Index: /trunk/workshop-routing-foss4g/docs/make.bat
===================================================================
--- /trunk/workshop-routing-foss4g/docs/make.bat	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/make.bat	(revision 76)
@@ -0,0 +1,113 @@
+@ECHO OFF
+
+REM Command file for Sphinx documentation
+
+set SPHINXBUILD=sphinx-build
+set BUILDDIR=_build
+set ALLSPHINXOPTS=-d %BUILDDIR%/doctrees %SPHINXOPTS% .
+if NOT "%PAPER%" == "" (
+	set ALLSPHINXOPTS=-D latex_paper_size=%PAPER% %ALLSPHINXOPTS%
+)
+
+if "%1" == "" goto help
+
+if "%1" == "help" (
+	:help
+	echo.Please use `make ^<target^>` where ^<target^> is one of
+	echo.  html      to make standalone HTML files
+	echo.  dirhtml   to make HTML files named index.html in directories
+	echo.  pickle    to make pickle files
+	echo.  json      to make JSON files
+	echo.  htmlhelp  to make HTML files and a HTML help project
+	echo.  qthelp    to make HTML files and a qthelp project
+	echo.  latex     to make LaTeX files, you can set PAPER=a4 or PAPER=letter
+	echo.  changes   to make an overview over all changed/added/deprecated items
+	echo.  linkcheck to check all external links for integrity
+	echo.  doctest   to run all doctests embedded in the documentation if enabled
+	goto end
+)
+
+if "%1" == "clean" (
+	for /d %%i in (%BUILDDIR%\*) do rmdir /q /s %%i
+	del /q /s %BUILDDIR%\*
+	goto end
+)
+
+if "%1" == "html" (
+	%SPHINXBUILD% -b html %ALLSPHINXOPTS% %BUILDDIR%/html
+	echo.
+	echo.Build finished. The HTML pages are in %BUILDDIR%/html.
+	goto end
+)
+
+if "%1" == "dirhtml" (
+	%SPHINXBUILD% -b dirhtml %ALLSPHINXOPTS% %BUILDDIR%/dirhtml
+	echo.
+	echo.Build finished. The HTML pages are in %BUILDDIR%/dirhtml.
+	goto end
+)
+
+if "%1" == "pickle" (
+	%SPHINXBUILD% -b pickle %ALLSPHINXOPTS% %BUILDDIR%/pickle
+	echo.
+	echo.Build finished; now you can process the pickle files.
+	goto end
+)
+
+if "%1" == "json" (
+	%SPHINXBUILD% -b json %ALLSPHINXOPTS% %BUILDDIR%/json
+	echo.
+	echo.Build finished; now you can process the JSON files.
+	goto end
+)
+
+if "%1" == "htmlhelp" (
+	%SPHINXBUILD% -b htmlhelp %ALLSPHINXOPTS% %BUILDDIR%/htmlhelp
+	echo.
+	echo.Build finished; now you can run HTML Help Workshop with the ^
+.hhp project file in %BUILDDIR%/htmlhelp.
+	goto end
+)
+
+if "%1" == "qthelp" (
+	%SPHINXBUILD% -b qthelp %ALLSPHINXOPTS% %BUILDDIR%/qthelp
+	echo.
+	echo.Build finished; now you can run "qcollectiongenerator" with the ^
+.qhcp project file in %BUILDDIR%/qthelp, like this:
+	echo.^> qcollectiongenerator %BUILDDIR%\qthelp\Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhcp
+	echo.To view the help file:
+	echo.^> assistant -collectionFile %BUILDDIR%\qthelp\Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.ghc
+	goto end
+)
+
+if "%1" == "latex" (
+	%SPHINXBUILD% -b latex %ALLSPHINXOPTS% %BUILDDIR%/latex
+	echo.
+	echo.Build finished; the LaTeX files are in %BUILDDIR%/latex.
+	goto end
+)
+
+if "%1" == "changes" (
+	%SPHINXBUILD% -b changes %ALLSPHINXOPTS% %BUILDDIR%/changes
+	echo.
+	echo.The overview file is in %BUILDDIR%/changes.
+	goto end
+)
+
+if "%1" == "linkcheck" (
+	%SPHINXBUILD% -b linkcheck %ALLSPHINXOPTS% %BUILDDIR%/linkcheck
+	echo.
+	echo.Link check complete; look for any errors in the above output ^
+or in %BUILDDIR%/linkcheck/output.txt.
+	goto end
+)
+
+if "%1" == "doctest" (
+	%SPHINXBUILD% -b doctest %ALLSPHINXOPTS% %BUILDDIR%/doctest
+	echo.
+	echo.Testing of doctests in the sources finished, look at the ^
+results in %BUILDDIR%/doctest/output.txt.
+	goto end
+)
+
+:end
Index: /trunk/workshop-routing-foss4g/docs/latex.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/latex.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/latex.rst	(revision 76)
@@ -0,0 +1,23 @@
+.. Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt documentation master file, created by
+   sphinx-quickstart on Sat Jul  3 21:23:22 2010.
+   You can adapt this file completely to your liking, but it should at least
+   contain the root `toctree` directive.
+
+==============================================================================================================
+pgRouting Workshop - Latex generation (doesn't include this page)
+==============================================================================================================
+
+.. toctree::
+   :numbered:
+   :maxdepth: 3
+
+   chapters/introduction.rst
+   chapters/about.rst
+   chapters/installation.rst
+   chapters/osm2pgrouting.rst
+   chapters/topology.rst
+   chapters/shortest_path.rst
+   chapters/advanced.rst
+   chapters/php_server.rst
+   chapters/geoext_client.rst
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/geoext_client.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/geoext_client.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/geoext_client.rst	(revision 76)
@@ -0,0 +1,301 @@
+==============================================================================================================
+Client en GeoExt
+==============================================================================================================
+
+`GeoExt <http://www.geoext.org/>`_ est une librairie JavaScript pour le dÃ©veloppement d'applications internet avancÃ©es. GeoExt rassemble les capacitÃ©s d'`OpenLayers <http://www.openlayers.org>`_ avec l'interface utilsiateur savvy de `Ext JS <http://www.sencha.com>`_ pour aider au dÃ©veloppement d'applications similaires Ã  des applications bureautiques.
+
+CommenÃ§ons avec un exemple simple d'utilisation de GeoExt et ajoutons-y les fonctionalitÃ©s de routage :
+
+.. literalinclude:: ../../web/routing-0.html
+	:language: html
+
+Dans l'entÃªte nous chargeons l'ensemble des fichiers javascript et css requis pour l'application. Nous dÃ©finissons aussi une fonction qui sera exÃ©cutÃ©e Ã  la fin du chargement de la page (Ext.onReady).
+
+Cette fonction cÃ©e une instance de`GeoExt.MapPanel
+<http://www.geoext.org/lib/GeoExt/widgets/MapPanel.html>`_ avec une couche de fond OpenStreetMap centrÃ©e sur Denver. Dans ce code, aucun objet OpenLayers.Map est explicitemet crÃ©Ã©; le GeoExt.MapPanel le fait de faÃ§on camouflÃ© : il rÃ©cupÃšre les options de la carte, le centre, le seuil de zoom et crÃ©e une instance de maniÃšre appropriÃ©e.
+
+Pour permettre Ã  nos utilisateurs de trouver leur direction, nous devons fournir :
+ * un moyen de sÃ©lectionner un algorithme de routage  (Dijkstra, A* ou Shooting*),
+ * un moyen de sÃ©lectionner la position de dÃ©part et d'arrivÃ©e.
+
+.. note:: Ce chapitre prÃ©sente uniquement des extraits de codes, le code source complet de la page peut Ãªtre rÃ©cupÃ©rÃ©e depuis ``pgrouting-workshop/web/routing-final.html`` qui devrait Ãªtre sur votre bureau. Le fichier complet se trouve Ã  la fin de ce chapitre.
+
+-------------------------------------------------------------------------------------------------------------
+Outil de sÃ©lection de la mÃ©thode de routage
+-------------------------------------------------------------------------------------------------------------
+
+Pour sÃ©lectionner une mÃ©thode de routage, nous utiliserons un `Ext.form.ComboBox
+<http://www.sencha.com/deploy/dev/docs/?class=Ext.form.ComboBox>`_: il se comporte simplement comme un select html mais est plus simple Ã  controler.
+
+Comme pour le GeoExt.MapPanel, nous avons besoin d'un Ã©lÃ©ments html pour placer notre control, crÃ©ons un div dans le body (ayant 'method' comme identifiant) :
+
+ .. code-block:: html
+
+   <body>
+     <div id="gxmap"></div>
+     <div id="method"></div>
+   </body>
+
+CrÃ©ons ensuite le combo :
+ .. code-block:: js
+
+   var method = new Ext.form.ComboBox({
+       renderTo: "method",
+       triggerAction: "all",
+       editable: false,
+       forceSelection: true,
+       store: [
+           ["SPD", "Shortest Path Dijkstra"],
+           ["SPA", "Shortest Path A*"],
+           ["SPS", "Shortest Path Shooting*"]
+       ]
+   });
+
+Dans l'option ``store``, nous avons dÃ©fini toutes les valeurs pour les mÃ©thodes de routages; les formats sont dans un tableau d'options ou une option est de la forme ``[clef,valeur]``. La ``clef`` sera envoyÃ©e au serveur (the script php dans note cas) et la ``valeur`` affichÃ©e dans la liste dÃ©roulante.
+
+L'option ``renderTo`` dÃ©fini oÃ¹ la liste dÃ©roulante doit Ãªtre affichÃ©e , nous utilisons ici notre Ã©lÃ©ment div.
+
+Et pour finir, une valeur par dÃ©faut est dÃ©finie :
+ .. code-block:: js
+
+    method.setValue("SPD");
+
+Cette partie utilise le composant ExtJS : ni code OpenLayers ni GeoExt.
+
+-------------------------------------------------------------------------------------------------------------
+SÃ©lectionner un point de dÃ©part et d'arrivÃ©e
+-------------------------------------------------------------------------------------------------------------
+
+Nous souhaitons permettre Ã  nos utilisateurs de dÃ©ssiner et dÃ©placer un point de dÃ©part et d'arrivÃ©e. C'est plus ou moins le comportement des applications comme google map et les autres : l'utilsateur choisi un point de dÃ©part Ã  l'aide d'un moteur de recherche ou en cliquant sur la carte. L'applicationinterroge ensuite le serveur afin d'afficher le chemin sur la carte. L'utilisateur peut ensuite modifier son opint de dÃ©part et d'arrivÃ©e afin que le chemin soit mis Ã  jour automatiquement.
+
+Dans ces travaux pratiques, nous implÃ©menterons seulement la saisie de point sur la carte (dessiner des points et les dÃ©placer) mais il est parfaitement possible d'implÃ©menter un moteur de recherche en utilisant un service web dÃ©diÃ© tel que `GeoNames <http://www.geonames.org/>`_ ou tout autre service de `geocodage
+<http://fr.wikipedia.org/wiki/Geocodage>`_.
+
+Pour faire ceci nous aurons besoin d'un outil permettant de dessiner des points (nous utiliserons le control
+`OpenLayers.Control.DrawFeatures
+<http://openlayers.org/dev/examples/draw-feature.html>`_) et un outil pour dÃ©placer les points (`OpenLayers.Control.DragFeatures
+<http://openlayers.org/dev/examples/drag-feature.html>`_ sera parfait pour ce travail). Comme leur noms le suppose ces controls sont disponibles dans OpenLayers.
+
+Ces deux controls auront besoin d'un emplacement pour afficher et manipuler les points; nous aurons besoin d'une couche `OpenLayers.Layer.Vector
+<http://dev.openlayers.org/releases/OpenLayers-2.10/doc/apidocs/files/OpenLayers/Layer/Vector-js.html>`_. Dans OpenLayers, une couche vecteur est un endroit oÃ¹ des Ã©lements (une geomÃ©trie et des attributs) peuvent Ãªtre afffichÃ©e (contrairement Ã  la couche OSM qui est une couche raster).
+
+Comme les couches vecteurs sont lÃ©gÃšres, nous en utiliserons une seconde pour afficher la route retourner par le service web. L'initialisation de la couche se fait de la maniÃšre suivante :
+
+ .. code-block:: js
+
+    // CrÃ©ation de la couche oÃ¹ le chemin sera affichÃ©
+    var route_layer = new OpenLayers.Layer.Vector("route", {
+        styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({
+            strokeColor: "#ff9933",
+            strokeWidth: 3
+        }))
+    });
+
+``"route"`` est  le nom de la couche, n'importe qu'elle chaÃ®ne de caractÃšres peut Ãªtre utilisÃ©e.
+``styleMap`` fournis Ã  la couche un mimum de style avec une couleur de contour particuliÃšre et un largeur (en pixel).
+
+La seconde couche est simplement initialiser comme suit :
+
+ .. code-block:: js
+
+    // CrÃ©ation de la couche ou seront affichÃ© les points de dÃ©part et d'arrivÃ©e
+    var points_layer = new OpenLayers.Layer.Vector("points");
+
+Les deux couches sont ajoutÃ©e Ã  l'objet OpenLayers.Map avec :
+
+ .. code-block:: js
+
+    // Ajouter la cocuhe Ã  la carte
+    map.addLayers([points_layer, route_layer]);
+
+Regardons le control pour afficher les points : puisque ce composant Ã  un comportement particulier il est plus simple de crÃ©er une nouvelle classe basÃ©e sur le control standard
+OpenLayers.Control.DrawFeatures. Ce control (nommÃ© DrawPoints) est enregistrÃ© dans un fichier javascript Ã  part (``web/DrawPoints.js``):
+
+.. literalinclude:: ../../web/DrawPoints.js
+	:language: js
+
+Dans la fonction ``initialize`` (qui est le constructeur de la classe) nous spÃ©cifions que ce control peut seulement dessiner des point (la variable handler est OpenLayers.Handler.Point).
+
+Le comportement spÃ©cifique est implÃ©mentÃ© dans la fonction ``drawFeature`` : puisque nous avons seulement  besoin des points de dÃ©part et d'arrivÃ©e, le control se desactive automatiquemnt lorsque deux points ont Ã©tÃ© saisie. La dÃ©sactivation se fait via ``this.deactivate()``.
+
+Notre control est ensuite crÃ©Ã© avec :
+
+ .. code-block:: js
+
+    // CrÃ©ation du control pour dessiner les points (voir le fichier DrawPoints.js)
+    var draw_points = new DrawPoints(points_layer);
+
+``points_layer`` est la couche vecteur crÃ©Ã©e prÃ©cÃ©demment.
+
+Et maintenant pour le control DragFeature :
+
+ .. code-block:: js
+
+    // CrÃ©ation du control pour dÃ©placer les points 
+    var drag_points = new OpenLayers.Control.DragFeature(points_layer, {
+        autoActivate: true
+    });
+
+Encore une fois, la couche ``points_layer``est de type vecteur, ``autoActivate: true`` dit Ã  OpenLayers que nous voulons que ce control soit automatiquement activÃ©.
+
+ .. code-block:: js
+
+    // Ajouter le control Ã  la carte
+    map.addControls([draw_points, drag_points]);
+
+Ajouter le control Ã  la carte.
+
+-------------------------------------------------------------------------------------------------------------
+Envoyer et recevoire des donnÃ©es du service web
+-------------------------------------------------------------------------------------------------------------
+
+Le cheminement de base pour obtenir un chemin depuis le service web est le suivant :
+
+#. transformer nos points en coordonnÃ©es de EPSG:900913 en EPSG:4326
+#. appeler le service web avec les arguments correctes (nom de la mÃ©thode et deux points)
+#. lire le rÃ©sultat retournÃ© par le service web : transformer le GeoJSON en OpenLayers.Feature.Vector
+#. transformer toutes les coordonnÃ©es de EPSG:4326 Ã  EPSG:900913
+#. ajouter le rÃ©sultat Ã  la couche vecteur
+
+La premiÃšre Ã©tape est quelque chose de nouveau : notre carte utilise le systÃšme de projection EPSG:900913 
+(parce que nous utilisons une couche OSM) mais le service web attends des coordonnÃ©es en EPSG:4326 : nous devons re-projeter les donnÃ©es avant de les envoyer. Ce n'est pas bien difficile : nous aurons simplement besoin de la ` librairie javascript Proj4js <http://trac.osgeo.org/proj4js/>`_.
+
+(La deuxiÃšme Ã©tape *appeler le service web* est Ã©tudiÃ© au chapitre suivant.)
+
+Le service web de routage dans pgrouting.php renvoit un objet  FeatureCollection au format `GeoJSON <http://geojson.org/>`_. Un objet FeatureCollection est simplement un tableau d'Ã©lÃ©ment : un Ã©lÃ©ments pour chaque tronÃ§on de route. Ceci est trÃšs pratique carOpenLayers et GeoExt ont tout ce dont nous avons besoin pour gÃ©rer ce format. Pour nous rendre la tÃ¢che encore plus simple, nous utiliserons le GeoExt.data.FeatureStore suivant :
+
+ .. code-block:: js
+
+    var store = new GeoExt.data.FeatureStore({
+        layer: route_layer,
+        fields: [
+            {name: "length"}
+        ],
+        proxy: new GeoExt.data.ProtocolProxy({
+            protocol: new OpenLayers.Protocol.HTTP({
+                url: './php/pgrouting.php',
+                format: new OpenLayers.Format.GeoJSON({
+                    internalProjection: epsg_900913,
+                    externalProjection: epsg_4326
+                })
+            })
+        })
+    });
+
+Un Store est simplement un conteneur qui stocke des informations : nous pouvons y ajouter des Ã©lÃ©ments et les rÃ©cupÃ©rer.
+
+Expliquons les options :
+
+``layer``: le paramÃštre est une couche vecteur : en spÃ©cifiant une couche, le
+FeatureStore affichera automatiquement les donnÃ©es qu'elle contient. C'est exactement ce dont nous avons besoin pour la derniÃšre Ã©tape (*ajouter le rÃ©sultat Ã  la couche vecteur*) dans la liste ci-dessus.
+
+``fields``: liste tout les attributs renvoyÃ©s avec la gÃ©omÃ©trie : pgrouting.php renvoit la longueurdu segment donc nous le spÃ©cifions ici. Notez que cette information n'est pas utilisÃ©e dans ces travaux pratiques.
+
+``proxy``: le paramÃštre proxy specifie oÃ¹ nous devons rÃ©cupÃ©rer les donnÃ©es : dans notre cas depuis le serveur HTTP. Le type de proxy est GeoExt.data.ProtocolProxy : cette classe connecte le monde ExtJS (le Store) et le monde OpenLayers (l'objet protocol).
+
+``protocol``: ce composant OpenLayers est capable d'exÃ©cuter des requÃªtes Ã  un``url`` (notre script php) et de lire la rÃ©ponse (option ``format``). En ajoutant les options ``internalProjection`` et ``externalProjection``, les coordonnÃ©es sont reprojetÃ©es par l'objet format.
+
+Nous avons maintenant tout ce qu'il nous faut pour gÃ©rer les donnÃ©es renvoyÃ©es par le service web : le prochain chapitre expliquera comment et quand l'appeler.
+
+-------------------------------------------------------------------------------------------------------------
+DÃ©clancher l'appel au service web
+-------------------------------------------------------------------------------------------------------------
+
+Nous devons appeler le service web lorsque :
+ * les deux points sont dessinÃ©s
+ * un point Ã  Ã©tÃ© dÃ©placÃ©
+ * la mÃ©thode Ã  utiliser a changÃ© 
+
+Notre couche vecteur gÃ©nÃšre une Ã©vÃ©nement (appelÃ© ``featureadded``) lorsqu'un nouvel Ã©lÃ©ment est ajoutÃ©, nous pouvons utiliser cet Ã©vÃ©nement pour appeler la fonction pgrouting (cette fonction sera prÃ©sentÃ© dans peu de temps) :
+
+ .. code-block:: js
+
+    draw_layer.events.on({
+        featureadded: function() {
+            pgrouting(store, draw_layer, method.getValue());
+        }
+    });
+
+.. note:: Avant de continuer quelque mots sur les Ã©vÃ©nements : un Ã©vÃ©nement dans OpenLayers (la mÃªme chose s'applique pour ExtJS et les autres frameworks), est un systÃšme qui permet Ã  une fonction d'Ãªtre appelÃ©e lorsque *quelquechose* se passe. Par exemple lorsqu'une couche est ajoutÃ©e Ã  la carte ou quand la souris se trouve au dessus d'un objet de la carte. Plusieurs fonctions peuvent Ãªtre liÃ©es Ã  un mÃªme Ã©vÃ©nement.
+
+Aucune Ã©vÃ©nemenet n'est gÃ©nÃ©rÃ© lorsqu'un point est dÃ©placÃ©, heureusement nous pouvons dÃ©finir une fonction Ã  notre control DragFeature Ã  appeler lorsqu'un point est dÃ©placÃ© :
+
+ .. code-block:: js
+
+    drag_points.onComplete = function() {
+        pgrouting(store, draw_layer, method.getValue());
+    };
+
+Pour la liste dÃ©roulante *method*, nous pouvons ajouter une option `select` au contructeur  (c'est l'Ã©vÃ©nement dÃ©clencher lorsqu'un utilisateur change sa sÃ©lection) :
+
+ .. code-block:: js
+
+    var method = new Ext.form.ComboBox({
+        renderTo: "method",
+        triggerAction: "all",
+        editable: false,
+        forceSelection: true,
+        store: [
+            ["SPD", "Shortest Path Dijkstra"],
+            ["SPA", "Shortest Path A*"],
+            ["SPS", "Shortest Path Shooting*"]
+        ],
+        listeners: {
+            select: function() {
+                pgrouting(store, draw_layer, method.getValue());
+            }
+    });
+
+Il est maintenant temps de prÃ©senter la fonction pgrouting :
+
+ .. code-block:: js
+
+   // global projection objects (uses the proj4js lib)
+   var epsg_4326 = new OpenLayers.Projection("EPSG:4326"), 
+       epsg_900913 = new OpenLayers.Projection("EPSG:900913");
+
+   function pgrouting(store, layer, method) {
+         if (layer.features.length == 2) {
+             // erase the previous route
+             store.removeAll();
+
+             // transform the two geometries from EPSG:900913 to EPSG:4326
+             var startpoint = layer.features[0].geometry.clone();
+             startpoint.transform(epsg_900913, epsg_4326);
+             var finalpoint = layer.features[1].geometry.clone();
+             finalpoint.transform(epsg_900913, epsg_4326);
+
+             // load to route
+             store.load({
+                 params: {
+                     startpoint: startpoint.x + " " + startpoint.y,
+                     finalpoint: finalpoint.x + " " + finalpoint.y,
+                     method: method
+                 }
+             });
+        }
+    }
+
+La fonction pgrouting appÃšle me service web Ã  travers l'argument store.
+
+Au dÃ©but, la fonction vÃ©rifie si deux points sont prÃ©sent dans les paramÃštres. Ensuite, `select` est appelÃ©e pour Ã©ffacer le rÃ©sultat prÃ©cÃ©dent de la couche (souvenez-vous que le Store et la couche vecteur sont liÃ©). Les deux points sont projetÃ©s en utilisant une instance de OpenLayers.Projection.
+
+Pour finir, ``store.load()`` est appelÃ©e avec un argument ``params`` (ils sont passÃ©s via un appÃšle HTTP utilisant la mÃ©thode GET).
+
+-------------------------------------------------------------------------------------------------------------
+Que faire maintenant ?
+-------------------------------------------------------------------------------------------------------------
+
+Possibles amÃ©liorations :
+ * Utiliser un service de gÃ©ocodage pour rÃ©cupÃ©rer le point de dÃ©part / d'arrivÃ©e
+ * Support de plusieurs points 
+ * De jolies icÃŽnes pour le point de dÃ©part et celui d'arrivÃ©e
+ * Direction du parcour (carte de voyage) : nous avons dÃ©jÃ  la distance
+
+-------------------------------------------------------------------------------------------------------------
+Code source complet
+-------------------------------------------------------------------------------------------------------------
+
+.. literalinclude:: ../../web/routing-final.html
+	:language: html
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/about.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/about.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/about.rst	(revision 76)
@@ -0,0 +1,91 @@
+=============================================================================================================
+Ã propos
+=============================================================================================================
+
+Ces travaux pratiques utilisent de nombreux outils FOSS4G, beaucoup plus que le titre ne le laisse supposer. Ainsi, de nombreux logiciels FOSS4G sont liÃ©s au autres project OpenSource et ce serait aller trop loin de tous les lister. Il y a nÃ©anmoins 4 projets OpenSource que ces travaux pratiues prÃ©senterons :
+
+.. image:: images/osgeo.png
+	:align: center
+
+-------------------------------------------------------------------------------------------------------------
+pgRouting
+-------------------------------------------------------------------------------------------------------------
+
+pgRouting est un extension de PostGIS et ajoute les fonctionalitÃ©s de routing au couple PostGIS/PostgreSQL. pgRouting est un dÃ©veloppement antÃ©rieur Ã  pgDijkstra (par `Camptocamp SA <http://www.camptocamp.com>`_). Il a Ã©tÃ© Ã©tendu par l'entreprise `Orkney Inc. <http://www.orkney.co.jp>`_ et est actuellement dÃ©veloppÃ© et maintenu par `Georepublic <http://georepublic.de>`_.
+
+.. image:: images/pgrouting.png
+	:align: center
+
+pgRouting fournit les fonctions pour :
+
+* Plus court chemin Dikstra : algorithme de routage sans heusitique
+* Plus court chemin A-Ãtoile : routage pour grand un ensemble de donnÃ©es (avec heuristiques)
+* Plus court chemin Shooting-Star: routage prenant en compte le sens giratoir (avec heuristiques)
+* ProblÃšme du voyageur de commerce (TSP)
+* Distance de pilotage (Isolines)
+
+De nombreux nouveaux algorithmes vont Ãªtre ajoutÃ©s dans un futur proche :
+
+* Dial-a-Ride-Problem solver (DARP)
+* Support du routage multimodal 
+* Algortihme de recherche de plus court chemin dÃ©pendant du temps / dynamique
+* A-Ãtoile utilisant deux direction 
+* All-Pair shortest path algorithm
+
+Les avantages de l'approche base de donnÃ©es pour les algorithmes de routage sont :
+
+* L'accessibilitÃ© par nombreux clients au travers de JDBC, ODBC, our directement en tuililsant Pl/pgSQL. Les clients peuvent Ãªtre des ordinateurs personnels ou des pÃ©rifÃ©riques mobiles.
+* Utilise PostGIS pour le format des donnÃ©es gÃ©ographiques, qui utilise le Format Text Bien Connu (WKT) de l'OGC et le Format Binaire Bien Connu (WKB).
+* Les logiciels OpenSource comme qGIS et uDig peuvent modifier les donnÃ©es / les attributs.
+* Les modifications apportÃ©es aux donnÃ©es peuvent Ãªtre intÃ©grÃ©es au moteur de routage instantanÃ©ment. Il n'y pas de besoin de prÃ©-calcul.
+* Le paramÃštre de "coÃ»t" peut Ãªtre calculÃ© dynamiquement Ã  l'aide du SQL et ces valeurs peuvent provenir de diffÃ©rets attributsou tables.
+
+pgRouting est disponible sous licence GPLv2.
+
+Le site web officiel de pgRouting : http://www.pgrouting.org
+
+
+-------------------------------------------------------------------------------------------------------------
+OpenStreetMap
+-------------------------------------------------------------------------------------------------------------
+
+*"OpenStreetMap a pour objectif de crÃ©er et fournir des informations gÃ©ographiques libres telles que des plans de rue Ã  toute personne le dÃ©sirant. Le projet fut dÃ©marrÃ© car la plupart des cartes qui semblent libres ont en fait des restrictions dâutilisation lÃ©gales ou techniques, empÃªchant de les utiliser de maniÃšre crÃ©ative, productive ou tout simplement selon vos souhaits."* (Source: http://wiki.openstreetmap.org/wiki/FR:Portal:Press)
+
+.. image:: images/osm_logo.png
+	:align: center
+
+OpenStreetMap est une source de donnÃ©es parfaite pour Ãªtre utilisÃ©es avec pgRouting, car elles sont librement disponibles et n'ont pas de restrictions techniques en terme d'utilisation. La disponibilitÃ© des donnÃ©es varie d'un pays Ã  un autre, mais la couverture mondiale s'amÃ©liore de jour en jour.
+
+OpenStreetMap utilise une structuration de donnÃ©es topologiques :
+
+* Les noeuds (nodes) sont des points avec une position gÃ©ographique.
+* Les chemins (ways) sont des liste de noeuds, reprÃ©sentant une polyligne ou un polygone.
+* Les relations (relations) sont des groupes de noeud, de chemin et d'autre relations auquelles on peut affecter certaines propriÃ©tÃ©s.
+* Les propriÃ©tÃ©s (tags) peuvent Ãªtre appliquÃ©s Ã  des noeuds, des chemins ou des relation et consistent en un couple nom=valeur.
+
+Site web d'OpenStreetMap : http://www.openstreetmap.org
+
+
+-------------------------------------------------------------------------------------------------------------
+osm2pgrouting
+-------------------------------------------------------------------------------------------------------------
+
+osm2pgrouting est un outils en ligne de commande qui rend simple l'importation de donnÃ©es OpenStreetMap dans une base de donnÃ©es pgRouting. Il contruit le rÃ©seau routier automatiquement et crÃ©e les tables pour les types de donnÃ©es et les classes de routes. osm2pgrouting a Ã©tÃ© Ã©crit initialement par Daniel Wendt et est maintenant disponible sur le site du projet pgRouting.
+
+osm2pgrouting est disponible sous licence GPLv2.
+
+Site web du projet : http://www.pgrouting.org/docs/tools/osm2pgrouting.html
+
+
+-------------------------------------------------------------------------------------------------------------
+GeoExt
+-------------------------------------------------------------------------------------------------------------
+
+GeoExt est une librairie JavaScript destinÃ©e au applications web avancÃ©es. GeoExt rassemble les connaissances gÃ©ospatiales de `OpenLayers <http://www.openlayers.org>`_ avec une interface utilisateurs issue de `Ext JS <http://www.sencha.com>`_ pour aider Ã  construire un application web ressemblant Ã  une application bureautique.
+
+.. image:: images/GeoExt.png
+	:align: center
+
+GeoExt est disponible sous licence BSD et est maintenu par une communautÃ© grandissante d'individus, d'ogranisations et d'entreprises.
+
+Le site web de GeoExt : http://www.geoext.org
Index: /trunk/workshop-routing-foss4g/docs/chapters/topology.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/topology.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/topology.rst	(revision 76)
@@ -0,0 +1,179 @@
+==============================================================================================================
+CrÃ©ation de la topologie du rÃ©seau
+==============================================================================================================
+
+:doc:`osm2pgrouting <osm2pgrouting>` est un outil pratique, mais c'est aussi une *boÃ®te noire*. Il y a de nombreux cas oÃ¹ :doc:`osm2pgrouting <osm2pgrouting>` ne peut pas Ãªtre utilisÃ©. Certaines donnÃ©es de rÃ©seau sont fournies avec la topologie du rÃ©seau qui peut Ãªtre utilisÃ© par pgRouting tel-quel. Certaines donnÃ©es de rÃ©seau sont stockÃ©es au format Shape file (``.shp``) et nous pouvons les charger dans une base de donnÃ©es PostgreSQL Ã  l'aide de l'outil de conversion de PostGIS' ``shape2postgresql`. But what to do then?
+
+.. image:: images/network.png
+	:width: 250pt
+	:align: center
+
+Dans ce chapitre vous allez apprendre comment crÃ©er une topologie de rÃ©seau en partant de rien. Pour ce faire, nous allons commencer par les donnÃ©es qui contiennent les attributs minimum requis pour le routage et comment constituer Ã©tape par Ã©tape des donnÃ©es pour pgRouting.
+
+-------------------------------------------------------------------------------------------------------------
+Charger les donnÃ©es de rÃ©seau
+-------------------------------------------------------------------------------------------------------------
+
+Au dÃ©but nous allors charger une sauvegarde de base de donnÃ©es Ã  partir du rÃ©pertoire ``data``des travxu pratiques. Ce rÃ©pertoire contient un fichier compressÃ© incluant une sauvegarde de base de donnÃ©es ainsi qu'un plus petit ensemble de donnÃ©es de rÃ©seau du centre ville de Denver. Si vous n'avez pas encore dÃ©compressÃ©, faite le en utilisant la comande :
+
+.. code-block:: bash
+
+	cd ~/Desktop/pgrouting-workshop/
+	tar -xvzf data.tar.gz
+
+La commande suivante permet d'importer la sauvegarde de la base de donnÃ©es. Elle ajoutera les fonctions PostGIS et pgRouting Ã  la base, de la mÃªme maniÃšre que ce nous avons dÃ©crit dans le chapitre prÃ©cÃ©dent. Cela chargera aussi le petit Ã©chantillon de donnÃ©es de Denver avec un nombre minimum d'attribut, que vous trouverez habituellement dans l'ensemble des donnÃ©es de rÃ©seau :
+
+.. code-block:: bash
+
+	# Optionel: supprimer la base de donnÃ©es
+	dropdb -U postgres pgrouting-workshop
+
+	# Chargement du fichier de sauvegarde
+	psql -U postgres -f ~/Desktop/pgrouting-workshop/data/sampledata_notopo.sql
+
+Regardons quelles tables ont Ã©tÃ© crÃ©Ã©es :
+
+.. rubric:: Lancer : ``psql -U postgres -d pgrouting-workshop -c "\d"``
+	
+.. code-block:: sql
+
+		          List of relations
+	 Schema |       Name        | Type  |  Owner   
+	--------+-------------------+-------+----------
+	 public | classes           | table | postgres
+	 public | geography_columns | view  | postgres
+	 public | geometry_columns  | table | postgres
+	 public | spatial_ref_sys   | table | postgres
+	 public | types             | table | postgres
+	 public | ways              | table | postgres
+	(6 rows)
+
+	
+La table contenant les donnÃ©es du rÃ©seau routier onle nom ``ways``. Elle possÃšde les attributs suivants :
+	
+.. rubric:: Lancer : ``psql -U postgres -d pgrouting-workshop -c "\d ways"``
+	
+.. code-block:: sql
+
+		       Table "public.ways"
+	  Column  |       Type       | Modifiers 
+	----------+------------------+-----------
+	 gid      | integer          | not null
+	 class_id | integer          | 
+	 length   | double precision | 
+	 name     | character(200)   | 
+	 the_geom | geometry         | 
+	Indexes:
+	    "ways_pkey" PRIMARY KEY, btree (gid)
+	    "geom_idx" gist (the_geom)
+	Check constraints:
+	    "enforce_dims_the_geom" CHECK (ndims(the_geom) = 2)
+	    "enforce_geotype_the_geom" CHECK (geometrytype(the_geom) = 
+	              'MULTILINESTRING'::text OR the_geom IS NULL)
+	    "enforce_srid_the_geom" CHECK (srid(the_geom) = 4326)
+
+Il est habituel dans des donnÃ©es de rÃ©seau routier de retrouver au moins les informations suivantes :
+
+* Identifiant de tronÃ§on routier (gid)
+* Classe de tronÃ§on (class_id)
+* Longuer du tronÃ§on routier (length)
+* Nom du tronÃ§on (name)
+* La gÃ©omÃ©trie du tronÃ§on (the_geom)
+
+Cela permet d'afficher le rÃ©seau routier comme une couche PostGIS depuis un logiciel SIG, par exemple dans QGIS. Notez ue les informations ne suffisent pas au calcul de routes Ã©tant donnÃ© qu'il ne contient aucune information relative Ã  la topolgie du rÃ©seau.
+
+La prochaine Ã©tape consiste Ã  dÃ©marrer l'outil en ligne de commande PostgreSQL
+
+.. code-block:: bash
+
+	psql -U postgres pgrouting-workshop
+	
+... ou d'utiliser PgAdmin III.
+
+
+--------------------------------------------------------------------------------------------------------------
+Calcul de la topologie
+--------------------------------------------------------------------------------------------------------------
+
+Pour avoir vos donnÃ©es importÃ© dans une base de donnÃ©es PostgreSQL requiÃšre gÃ©nÃ©ralement des Ã©tapes supplÃ©mentaires pour pgRouting. Vous devez vous assurer que vos donnÃ©es fournissent une topologie correcte du rÃ©seau, ce qui correspond aux informations par rapport au dÃ©but et Ã  la fin d'un tronÃ§on.
+
+Si les donnÃ©es de votre rÃ©seau ont une dÃ©jÃ  telle information vous devez exÃ©cuter la fonctions ``assign_vertex_id``. Cette fonction permet l'assignation des valeurs pour les colonnes ``source`` et ``target`` pour chaque tronÃ§on et il peut prendre en compte le fait qu'un sommet puisse Ãªtre Ã©loignÃ© d'un autre suivant une certaine tolÃ©rance.
+
+.. code-block:: sql
+
+	assign_vertex_id('<table>', float tolerance, '<geometry column', '<gid>')
+	
+PremiÃšrement nous devons ajouter les colonnes source et target, pour ensuite utiliser la fonction assign_vertex_id ... et attendre :
+
+.. code-block:: sql
+
+	-- Ajouter les colonnes "source" et "target"
+	ALTER TABLE ways ADD COLUMN "source" integer;
+	ALTER TABLE ways ADD COLUMN "target" integer;
+	
+	-- Utiliser la fonction de contruction de topologie
+	SELECT assign_vertex_id('ways', 0.00001, 'the_geom', 'gid');
+
+.. note::
+
+	ExÃ©cuter ``psql -U postgres -d pgrouting-workshop`` depuis votre terminal afin de vous connecter Ã Ã l a base de donnÃ©es et lancer des commandes PostgreSQL en ligne. Quiter la session avec la commande ``\q`` .   
+
+.. warning::
+
+	La dimension du paramÃštre tolÃ©rance dÃ©pends du systÃšme de projection de vos donnÃ©es. Habituellement c'est soit "degrÃ©s" soit "mÃštres".
+
+
+-------------------------------------------------------------------------------------------------------------
+Ajouter des indexes
+-------------------------------------------------------------------------------------------------------------
+
+Heureusement nous n'avons pas Ã  attendre longtemps Ã©tant donnÃ© que notre jeu de donnÃ©es est trÃšs petit. Mais la quantitÃ© de donnÃ©es d'un rÃ©seau pourrait Ãªtre beaucoup plus importante, donc il vaut mieux ajouter des indexes pour les colonnes  ``source`` et ``target``.
+
+.. code-block:: sql
+
+	CREATE INDEX source_idx ON ways("source");
+	CREATE INDEX target_idx ON ways("target");
+
+Suite Ã  ces Ã©tapes, notre base de donnÃ©es routing ressemble Ã  ceci :
+
+.. rubric:: Lancer : ``\d``
+	
+.. code-block:: sql
+
+		             List of relations
+	 Schema |        Name         |   Type   |  Owner   
+	--------+---------------------+----------+----------
+	 public | geography_columns   | view     | postgres
+	 public | geometry_columns    | table    | postgres
+	 public | spatial_ref_sys     | table    | postgres
+	 public | vertices_tmp        | table    | postgres
+	 public | vertices_tmp_id_seq | sequence | postgres
+	 public | ways                | table    | postgres
+	(6 rows)
+
+.. rubric:: Lancer : ``\d ways``
+	
+.. code-block:: sql
+	
+		       Table "public.ways"
+	  Column  |       Type       | Modifiers 
+	----------+------------------+-----------
+	 gid      | integer          | not null
+	 class_id | integer          | 
+	 length   | double precision | 
+	 name     | character(200)   | 
+	 the_geom | geometry         | 
+	 source   | integer          | 
+	 target   | integer          | 
+	Indexes:
+	    "ways_pkey" PRIMARY KEY, btree (gid)
+	    "geom_idx" gist (the_geom)
+	    "source_idx" btree (source)
+	    "target_idx" btree (target)
+	Check constraints:
+	    "enforce_dims_the_geom" CHECK (ndims(the_geom) = 2)
+	    "enforce_geotype_the_geom" CHECK (geometrytype(the_geom) = 
+	                'MULTILINESTRING'::text OR the_geom IS NULL)
+	    "enforce_srid_the_geom" CHECK (srid(the_geom) = 4326)
+		
+Nous sommes fin prÃªts pour notre premiÃšre requÃªte de routage avec `l'algorithme de Dijkstra <shortest_path>` !
Index: /trunk/workshop-routing-foss4g/docs/chapters/php_server.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/php_server.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/php_server.rst	(revision 76)
@@ -0,0 +1,55 @@
+==============================================================================================================
+Script PHP cotÃ© serveur
+==============================================================================================================
+
+Nous utiliserons un script PHP pour exÃ©cuter les requÃªtes de routafe et renverons le rÃ©sultat au client web.
+
+Les Ã©tapes suivantes sont nÃ©cessaires :
+
+* Retrouver les coordonnÃ©es du point de dÃ©part et de celui d'arrivÃ©e.
+* Trouver l'arrÃªte la plus proche d'un point de dÃ©part ou d'arrivÃ©e.
+* Prendre soit le noeud de dÃ©but ou de fin de l'arrÃªte  (for Dijkstra/ A-Star) ou l'arrÃªte elle-mÃªme (Shooting-Star) comme dÃ©but ou fin du parcours.
+* ExÃ©cuter les requÃªte de recherche de plus court chemin.
+* Retourner le rÃ©sultat de la requÃªte en XML ou mieux encore en GeoJSON au client web.
+
+.. note::
+	
+	Pour conserver cet exemple aussi simple que possiblle et de mettre en Ã©vidence les requÃªte de routafe, ce script PHP ne valide pas les paramÃštres des requÃªtes et ne prend pas en compte les problÃšmes de sÃ©curitÃ©s de PHP. 
+
+CommenÃ§ons avec quelque modÃšles PHP et plaÃ§on ces fichiers dans un rÃ©pertoire accessible par le serveur Apache :
+
+.. literalinclude:: ../../web/php/pgrouting.php
+	:language: php
+	:lines: 1-18
+
+	  
+-------------------------------------------------------------------------------------------------------------
+L'arrÃªte la plus proche
+-------------------------------------------------------------------------------------------------------------
+
+Habituellement les points de dÃ©part et d'arrivÃ©e, qui sont rÃ©cupÃ©rer depuis le client, n'est pas le point de dÃ©part ou d'arrivÃ©e d'un tronÃ§on. Il est plus simple de retrouver l'arrÃªte la plus proche que le sommet le plus proche, parce que l'algorithme "Shooting-Star" est basÃ© sur les arrÃªtes. Pour les algorithmes basÃ©s sur les sommets (Dijkstra, A-Ãtoile) nous pouvons choisir le opint de dÃ©part ou d'arrivÃ©e de l'arrÃªte sÃ©lectionnÃ©e.
+
+.. literalinclude:: ../../web/php/pgrouting.php
+	:language: php
+	:lines: 20-56
+	  
+	  
+-------------------------------------------------------------------------------------------------------------
+RequÃªte de routage
+-------------------------------------------------------------------------------------------------------------
+
+.. literalinclude:: ../../web/php/pgrouting.php
+	:language: php
+	:lines: 58-116
+
+
+-------------------------------------------------------------------------------------------------------------
+Sortie au format GeoJSON
+-------------------------------------------------------------------------------------------------------------
+
+OpenLayers permet l'affichage de lignes en utilisant directement des donnÃ©es au format GeoJSON, donc notre script retourne un objet FeatureCollection au format GeoJSON :
+
+.. literalinclude:: ../../web/php/pgrouting.php
+	:language: php
+	:lines: 118-
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/images/network.pngw
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/images/network.pngw	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/images/network.pngw	(revision 76)
@@ -0,0 +1,6 @@
+3.3579243441145299e-05
+0 
+0 
+-3.3579243441145299e-05
+2.1400889356797999
+41.399318783865887
Index: /trunk/workshop-routing-foss4g/docs/chapters/images/route.pngw
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/images/route.pngw	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/images/route.pngw	(revision 76)
@@ -0,0 +1,6 @@
+3.3579243441145299e-05
+0 
+0 
+-3.3579243441145299e-05
+2.1400889356797999
+41.399318783865887
Index: /trunk/workshop-routing-foss4g/docs/chapters/osm2pgrouting.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/osm2pgrouting.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/osm2pgrouting.rst	(revision 76)
@@ -0,0 +1,151 @@
+==============================================================================================================
+Outils d'import osm2pgrouting
+==============================================================================================================
+
+**osm2pgrouting** est un outils en ligne de commande qui rend simple l'importation de donnÃ©es OpenStreetMap dans une base de donnÃ©es pgRouting. Il contruit le rÃ©seau routier automatiquement et crÃ©e les tables pour les types de donnÃ©es et les classes de routes. osm2pgrouting a Ã©tÃ© Ã©crit initialement par Daniel Wendt et est maintenant disponible sur le site du projet pgRouting : http://www.pgrouting.org/docs/tools/osm2pgrouting.html
+
+.. note::
+
+	Il y a quelques limitations, particuliÃšrement par rapport Ã  la taille du rÃ©seay. La version actuelle nÃ©cessite le chargement en mÃ©moire de l'ensemble des donnÃ©es, ce qui le rend rapide mais consome aussi beaucoup de mÃ©moire pour les gros enesemble d'objets. Un outils alternatif n'ayant pas de limitation sur la taille du rÃ©seauest **osm2po** (http://osm2po.de). Il est disponible sous licence "Freeware License".
+	
+
+Les donnÃ©es brutres d'OpenStreetMap contiennent bien plus d'Ã©lÃ©ments et d'informations qu'il est nÃ©cessaire pour du routage. Ainsi le format n'est pas utilisable tel-quel avec pgRouting. Un fichier XML ``.osm`` contient trois types de donnÃ©es majeurs :
+
+* noeuds
+* chemins
+* relations
+
+Les donnÃ©es de sampledata.osm par exemple ressemble Ã  ce qui suit :
+
+.. literalinclude:: code/osm_sample.osm
+	:language: xml
+
+Une description dÃ©taillÃ©e de tout les types et classes possibles d'OpenStreetMap peuvent-Ãªtre trouvÃ© ici : http://wiki.openstreetmap.org/index.php/Map_features.
+
+Lorsuqe vous utilisez osm2pgrouting, nous devons conserver uniquement les noeuds et les chemin ayant pour types et classes celles stipulÃ©e dans le fichier ``mapconfig.xml`` qui seront improtÃ©s dans notre base de donnÃ©es routing :
+
+.. literalinclude:: code/mapconfig_sample.xml
+	:language: xml
+
+Le fichier ``mapconfig.xml``par dÃ©faut est installÃ© dans le rÃ©pertoire : ``/usr/share/osm2pgrouting/``.
+
+
+-------------------------------------------------------------------------------------------------------------
+CrÃ©ation de la base de donnÃ©es routing
+-------------------------------------------------------------------------------------------------------------
+
+Avant de lancer osm2pgrouting nous devons crÃ©er la base de donnÃ©es et y charger les fonctionalitÃ©s de PostGIS et pgRouting .
+Si vous avez installÃ© le modÃšle de base de donnÃ©es comme dÃ©crit dans le chapitre prÃ©cÃ©dent, crÃ©er une base de donnÃ©es prÃªte Ã  utiliser pgRouting est fait par une simple commande. Ouvrez une fenÃªtre de terminal et utiliser la commande suivante : 
+
+.. code-block:: bash
+
+	createdb -U postgres -T template_routing routing
+	
+... vous avez terminÃ©.
+
+Une alternative consiste Ã   utiliser l'outil **PgAdmin III** et des requÃªtes SQL. DÃ©marrez  PgAdmin III (disponible sur le LiveDVD), connectez vous Ã  une base de donnÃ©es eyt ouvrez l'Ã©diteur de requÃªtes afin d'y saisir les requÃªtes SQL suivantes :
+
+.. code-block:: sql
+
+	-- CrÃ©ationde la base routing
+	CREATE DATABASE "routing" TEMPLATE "template_routing";
+
+
+Sinon, vous devez manuellement charger diffÃ©rents fichier dans la base de donnÃ©es. Voir : :ref:`previous chapter <installation_load_functions>`.
+
+	
+-------------------------------------------------------------------------------------------------------------
+Utiliser osm2pgrouting
+-------------------------------------------------------------------------------------------------------------
+
+La prochaine Ã©tape c'est de lancer l'outil ``osm2pgrouting``, qui est un outil en ligne de commande, donc vous devrez l'utiliser depuis une fenÃªtre de terminal.
+
+Nous prendrons par dÃ©faut le fichier de configuration ``mapconfig.xml`` et la base de donnÃ©es ``routing`` que nous avons crÃ©er prÃ©cÃ©demment. De plus nous prendrons le fichier ``~/Desktop/pgrouting-workshop/data/sampledata.osm`` comme donnÃ©es brutes. Ce fichier contient seulement les donnÃ©es OSM du centre ville de Denver afin d'accÃ©lÃ©rer le processus de chargement des donnÃ©es.
+
+Les donnÃ©es sont disponibles au format compressÃ©, qui doit donc Ãªtre dÃ©compressÃ© soit en utlisant un navigateur de fichier soit en utilisant la commande suivante :
+
+.. code-block:: bash
+
+	cd ~/Desktop/pgrouting-workshop/
+	tar -xvzf data.tar.gz
+
+Lancer ensuite l'outil :
+	
+.. code-block:: bash
+
+	osm2pgrouting -file "data/sampledata.osm" \
+				  -conf "/usr/share/osm2pgrouting/mapconfig.xml" \
+				  -dbname routing \
+				  -user postgres \
+				  -clean
+					
+Liste des paramÃštres possible :
+
+.. list-table::
+   :widths: 15 15 60 10
+
+   * - **ParamÃštre**
+     - **Valeur**
+     - **DÃ©scription**
+     - **Requis**
+   * - -file
+     - <fichier>
+     - le nom du fichier XML .osm
+     - yes
+   * - -dbname
+     - <nom_de_base>
+     - le nom de votre base de donnÃ©es
+     - yes
+   * - -user
+     - <utilisateur>
+     - le nom de l'utilisateur, qui a le droit d'accÃšs en Ã©criture sur la base de donnÃ©es
+     - yes
+   * - -conf
+     - <fichier>
+     - le nom du fichier XML de configuration
+     - yes
+   * - -host
+     - <hÃŽte>
+     - l'hÃŽte de votre base de donnÃ©es postgresql (par dÃ©faut : 127.0.0.1)
+     - no
+   * - -port
+     - <port>
+     - le numÃ©ro de port de votre serveur de base de donnÃ©es(par dÃ©faut: 5432)
+     - no
+   * - -passwd
+     - <mot_de_passe>
+     - le mot de passe pour se connecter Ã  la base de donnÃ©es
+     - no
+   * - -clean
+     - 
+     - Suprrimer les tables prÃ©cÃ©demment crÃ©Ã©es
+     - no
+
+.. note::
+
+	Si vous obtenez un message d'erreur relatif aux droits de l'utilisateur postgres, vous pouvez dÃ©finir la mÃ©thode comme ``trust`` dans le fichier  ``/etc/postgresql/8.4/main/pg_hba.conf`` et redÃ©marrer le serveur PostgreSQL avec la commande ``sudo service postgresql-8.4 restart``.
+
+
+Suivant la taille de votre rÃ©seau le temps de cacul et d'importation de donnÃ©es peut Ãªtre long. Une fois terminÃ©, connectez Ã  votre base de donnÃ©es et vÃ©rifiez les tables qui aurait du Ãªtre crÃ©Ã©es :
+
+.. rubric:: Lancer: ``psql -U postgres -d routing -c "\d"``	
+
+Si tout se passe bien, le rÃ©sultat devrait ressembler Ã  ceci :
+	
+.. code-block:: sql
+
+		             List of relations
+	 Schema |        Name         |   Type   |  Owner   
+	--------+---------------------+----------+----------
+	 public | classes             | table    | postgres
+	 public | geometry_columns    | table    | postgres
+	 public | nodes               | table    | postgres
+	 public | spatial_ref_sys     | table    | postgres
+	 public | types               | table    | postgres
+	 public | vertices_tmp        | table    | postgres
+	 public | vertices_tmp_id_seq | sequence | postgres
+	 public | ways                | table    | postgres
+	(8 rows)
+
+	
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/installation.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/installation.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/installation.rst	(revision 76)
@@ -0,0 +1,181 @@
+==============================================================================================================
+Installation et prÃ©-requis
+==============================================================================================================
+
+Pour ces travaux pratiques, vous aurez besoin de :
+
+* un serveur wev comme Apache avec le support PHP d'activÃ© (et le module PostgreSQL de PHP)
+* De prÃ©fÃ©rence un systÃšme d'exploitation de type Linux comme Ubuntu
+* Un Ã©diteur de texte comme Gedit
+* Une connexion internet
+
+Tout les outils requis sont disponibles sur l'OSGeo LiveDVD, donc les rÃ©fÃ©rences qui suivent reprÃ©sentent un rapide rÃ©sumÃ© de comment l'installer sur votre propre machine tournant sur Ubuntu 10.04 ou suppÃ©rieur.
+
+--------------------------------------------------------------------------------------------------------------
+pgRouting
+--------------------------------------------------------------------------------------------------------------
+
+L'installation de pgRouting sur Ubuntu est devenu extrÃªmement simple du fait de la disponibilitÃ© d'un paquet binaire dans le `dÃ©pot Launchpad <https://launchpad.net/~georepublic/+archive/pgrouting>`_: . 
+
+Tout ce que vous avez Ã  faire maintenant c'est d'ouvrir un fenÃªtre de terminal et de lancer :
+
+.. code-block:: bash
+	
+	# Ajouter le dÃ©pÃŽt launchpad
+	sudo add-apt-repository ppa:georepublic/pgrouting
+	sudo apt-get update
+
+	# Installer les paquets pgRouting
+	sudo apt-get install gaul-devel \
+		postgresql-8.4-pgrouting \
+		postgresql-8.4-pgrouting-dd \
+		postgresql-8.4-pgrouting-tsp
+
+	# Installer le paquet osm2pgrouting
+	sudo apt-get install osm2pgrouting
+
+	# InstallÃ© le contenu des travaux pratiques (optionel)
+	sudo apt-get install pgrouting-workshop
+
+Cela installera aussi tout les paquets dÃ©pendants comme PostgreSQL et PostGIS s'ils ne sont pas dÃ©jÃ  installÃ©.
+
+.. note::
+
+	* Les paquets "multiverse" doivent Ãªtre disponible comme des sourecs de logiciels. Actuellement les paquets pour Ubuntu 10.04 Ã  11.04 sont disponibles.
+	* Pour prendre en compte les nouveaux dÃ©pÃŽts et avoir une liste des tout deniers paquets Ã  jour, vous devez lancer ``sudo apt-get update & sudo apt-get upgrade`` de temps en temps, tout spÃ©cialement si vous utilisez une ancienne version du LiveDVD.
+	* Afin d'Ã©viter les problÃšmes de permissions, vous pouvez utiliser la mÃ©thode de connexion ``trust`` dans ``/etc/postgresql/8.4/main/pg_hba.conf`` et redÃ©marrer le serveur PostgreSQL avec ``sudo service postgresql-8.4 restart``.
+	
+--------------------------------------------------------------------------------------------------------------
+Travaux pratiques
+--------------------------------------------------------------------------------------------------------------
+
+Suite Ã  l'installation du paquet workshop, vous touverez tout les documents dans ``/usr/share/pgrouting/workshop/``.
+
+Nous recommendons de copier l'ensemble de ces fichiers dans le rÃ©pertoire de votre utilisateur et de crÃ©er un lient symbolique vers votre serveur web :
+
+.. code-block:: bash
+	
+	cp -R /usr/share/pgrouting/workshop ~/Desktop/pgrouting-workshop
+	sudo ln -s ~/Desktop/pgrouting-workshop /var/www/pgrouting-workshop
+
+Vous pouvez ensuite trouver les fichiers des travaux pratiques dans le rÃ©pertoire ``pgrouting-workshop`` et y accÃ©der :
+
+* RÃ©pertoire Web : http://localhost/pgrouting-workshop/web/
+* Manuel en ligne : http://localhost/pgrouting-workshop/docs/html/
+
+.. note::
+
+	Des exemple de donnÃ©es additionelles sont disponibles dans le rÃ©pertoire ``data`` des travaux pratique. Ils contiennent un fichier compressÃ© contenant les sauvegardes de base de donnÃ©es ainsi qu'un plus petit ensemble de donnÃ©es du rÃ©seau routier du centre ville de Denver. Pour dÃ©compresser ce fichier, exÃ©cuter la commande ``tar -xzf ~/Desktop/pgrouting-workshop/data.tar.gz``.
+
+
+--------------------------------------------------------------------------------------------------------------
+Base de donnÃ©es Ã  partir de modÃšle
+--------------------------------------------------------------------------------------------------------------
+
+C'est une bonne idÃ©e de crÃ©er un modÃšle de bases de donnÃ©es PostGIS et pgRouting. Cela rendra plus facile la crÃ©ation de nouvelles bases de donnÃ©es incluant dÃ©jÃ  les fonctionnalitÃ©s requises, sans avoir Ã  charger les fichiers SQL pour chaque nouvelle base.
+
+Un script est disponible dans le rÃ©pertoire ``bin`` des travaux pratiques pour ajouter des modÃšles de bases de donnÃ©es incluant les fonctionnalitÃ©s de PostGIS et pgRouting. Pour crÃ©er une base de donnÃ©es modÃšles, exÃ©cutez les commandes suivantes depuis une fenÃªtre de terminal :
+
+.. code-block:: bash
+	
+	cd ~/Desktop/pgrouting-workshop
+	bash bin/create_templates.sh
+
+Maintenant vous pouvez crÃ©er une nouvelle base incluant les fonctionnalitÃ©s pgRouting en utilsant ``template_routing`` comme modÃšle. Lancez la commande suivante dans une fenÃªtr ede terminal :
+
+.. code-block:: bash
+	
+	# CrÃ©ation de la base de donnÃ©es "routing"
+	createdb -U postgres -T template_routing routing
+
+Vous povez aussi utiliser **PgAdmin III** et des commandes SQL. DÃ©marrez PgAdmin III (disponible sur le LiveDVD), connectez-vous Ã  n'importe quelle base de donnÃ©es et ouvrez l'Ã©diteur SQL afin de lancer les commandes SQL suivantes :
+
+.. code-block:: sql
+
+	-- CrÃ©ation de la base routing
+	CREATE DATABASE "routing" TEMPLATE "template_routing";
+
+
+.. _installation_load_functions:
+
+--------------------------------------------------------------------------------------------------------------
+Chargement des functions
+--------------------------------------------------------------------------------------------------------------
+
+Sans une base de donnÃ©es modÃšle, de nombreux fichiers contenant les fonctions de pgRouting doivent Ãªtre chargÃ©s dans la base. Pour procÃ©der de la sorte, utilsez les commandes suivantes depuis une fenÃªtre de terminal :
+
+.. code-block:: bash
+
+	# Passer en utilisateur "postgres" (ou lancez, en tant qu'utilisateur "postgres")
+	sudo su postgres
+
+	# CrÃ©ation d'un base routing
+	createdb routing
+	createlang plpgsql routing
+
+	# Ajouter les fonctions PostGIS
+	psql -d routing -f /usr/share/postgresql/8.4/contrib/postgis-1.5/postgis.sql
+	psql -d routing -f /usr/share/postgresql/8.4/contrib/postgis-1.5/spatial_ref_sys.sql
+
+	# Ajouter les fonctions de base de pgRouting
+	psql -d routing -f /usr/share/postlbs/routing_core.sql
+	psql -d routing -f /usr/share/postlbs/routing_core_wrappers.sql
+	psql -d routing -f /usr/share/postlbs/routing_topology.sql
+	
+Encore un fois, vous pouvez utiliser **PgAdmin III** et des commandes SQL. DÃ©marrez PgAdmin III, connextez-vous Ã  n'importe quelle base de donnÃ©es, ouvrez l'Ã©diteur de commande SQL et saisissez les commandes suivantes :
+
+.. code-block:: sql
+
+	-- CrÃ©ation de la base routing
+	CREATE DATABASE "routing";
+	
+Connectez-vous ensuite Ã  la base ``routing`` et ouvrez une nouvelle fenÃªtre d'Ã©diteur SQL :
+	
+.. code-block:: sql
+
+	-- Ajouter le support plpgsql et les fonctions PostGIS/pgRouting
+	CREATE PROCEDURAL LANGUAGE plpgsql;
+
+Maintenant, ouvrez les fichiers ``.sql`` contenant les fonctions PostGIS/pgRouting listÃ©e prÃ©cÃ©demment et chargez les dans la base de donnÃ©es ``routing``.
+	
+.. note::
+
+	PostGIS ``.sql`` files can be stored in different directories. The exact location depends on your version of PostGIS and PostgreSQL. The example above is valid for PostgeSQL/PostGIS version 1.5 installed on OSGeo LiveDVD.
+	
+
+--------------------------------------------------------------------------------------------------------------
+DonnÃ©es
+--------------------------------------------------------------------------------------------------------------
+
+Les travaux pratiques pgRouting utiliseront les donnÃ©es de Denver d'OpenStreetMap, quisont dÃ©jÃ  disponibles sur le LiveDVD. Si vous n'utilisez pas le LiveDV ou si vous voulez tÃ©lÃ©charger les derniÃšres donnÃ©es ou des donnÃ©es de votre choix, vous pouvez utiliser l'API OpenStreetMap depuis votre fenÃªtre de terminal :
+
+.. code-block:: bash
+	
+	# TÃ©lÃ©charger le fichier sampledata.osm
+	wget --progress=dot:mega -O "sampledata.osm"  
+		"http://jxapi.openstreetmap.org/xapi/api/0.6/*
+						[bbox=-105.2147,39.5506,-104.594,39.9139]"
+
+L'API a une limite de taille de tÃ©lÃ©chargment, ce qui peut Ãªtre problÃ©matique pour tÃ©lÃ©charger une grande Ã©tendu gÃ©ographique avec de nombreux Ã©lÃ©ments. Une alternative est d'utiliser  `l'Ã©diteur JOSM <http://josm.openstreetmap.de>`_, qui utilisera aussi des appels Ã  l'API pour tÃ©lÃ©charger les donnÃ©es, mais il fournit un interface facile d'utilisation pour les utilisateurs. Vous pouvez sauvegarder les donnÃ©es come un fichier ``.osm`` pour l'utiliser avec ces travaux pratiques. JSOM est aussi disponible sur le LiveDVD.
+
+.. note::
+
+	* OpenStreetMap API v0.6, voir pour plus d'informations http://wiki.openstreetmap.org/index.php/OSM_Protocol_Version_0.6
+	* Les donnÃ©es de Denver sont disponibles sur le LiveDVD dans le rÃ©pertoire ``/usr/local/share/osm/``
+
+Une alternative, pour de trÃšs grandes Ã©tendues est d'utiliser le service de tÃ©lÃ©chargement de `CloudMade <http://www.cloudemade.com>`_. Cette entreprise offre des extractions de cartes pour tous les pays du monde. Pour les donnÃ©es du Colorado par exemple, allez sur le page http://download.cloudmade.com/americas/northern_america/united_states/colorado et tÃ©lÃ©chargez le fichier compressÃ© ``.osm.bz2`` :
+
+.. code-block:: bash
+
+	wget --progress=dot:mega http://download.cloudmade.com/americas/northern_america/united_states/colorado/colorado.osm.bz2
+	
+.. warning::
+
+	Les donnÃ©es d'un pays complet peuvent Ãªtre trop grande par rapport Ã  l'espace disponible sur le LiveDVD et nÃ©cessitÃ© des temps de calculs extrÃªmement long.  
+	
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/introduction.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/introduction.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/introduction.rst	(revision 76)
@@ -0,0 +1,49 @@
+==============================================================================================================
+Introduction
+==============================================================================================================
+
+.. rubric:: RÃ©sumÃ©
+
+`pgRouting <http://www.pgrouting.org>`_ ajoute les fonctionalitÃ©s de routage Ã  `PostGIS <http://www.postgis.org>`_. Ces travaux pratiques d'introduction va vous prÃ©senter comment. Il prÃ©sente un exemple pratique de comment utiliser pgRouting avec les donnÃ©es du rÃ©seau routier d'`OpenStreetMap <http://www.openstreetmap.org>`_. Il explique les Ã©tapes permettant la prÃ©paration des donnÃ©es, effectuer des requÃªtes de routage, l'assignation des coÃ»ts et l'utilisation de `GeoExt <http://www.geoext.org>`_ pour prÃ©senter les chamins depuis une application de web-mapping.
+
+La navigration dans un rÃ©seau de routes nÃ©cessite des algorithmes de routage complex qui supportent la restriction des virages utilisables et mÃªme des attributs dÃ©pendant du temps. pgRouting est une librairie OpenSource qui peut Ãªtre Ã©tendue qui fournit une grande variÃ©tÃ© d'outils pour la recherche de plus courts chemins comme une extension de PortgreSQL et de PostGIS. Ces travaux pratiques vont expliquer la recherche de plus courts chemin avec pgRouting dans un rÃ©seau routier rÃ©el et comment la structure des donnÃ©es est importante pour obtenir des rÃ©sultats plus rapidement. Vous apprendrez aussi les difficultÃ©s et le limitations de pgRouting dans le cadre d'application SIG.
+
+Pour fournir un exemple pratique, ces travaux pratiques utiliseront les donnÃ©es OpenStreetMap de Denver. Vous apprendrez comment convertir les donnÃ©es dans le format requis et comment calibrer les donnÃ©es avec les attributs de "coÃ»t". De plus, nuos allons expliquer la diffÃ©rence entre l'agorithme principal de routage "Dijkstra", "A-Star" et "Shooting-Star". Ã la fin de ces travaux ratiques vous aurez acquis une bonne comprÃ©hension de comment utiliser pgRouting et comment prÃ©parer vos donnÃ©es de rÃ©seau.
+
+Pour apprendre comment utiliser la liste des rÃ©sultats afin de les affichÃ©es sur une carte, nous allons contruire une interface graphique de base avec GeoExt. Nous avons Ã©coutÃ© les remarques qui avaient Ã©tÃ© faites l'an dernier et voulons vous guider pour les Ã©tapes de bases nÃ©cessaires Ã  la mise en ligne d'une application de routage. Notre but est de faire cei de la maniÃšres la plus simple possible, et de montrer qu'il n'est pas difficile d'intÃ©grer cela avec les autres outils OpenSource FOSS4G. Pour cette raison, nuos avons selectionnÃ© GeoExt, qui est une librairies JavaScript fournissant les Ã©lÃ©ments de base pour crÃ©er des application de web-mappping basÃ©es sur OpenLayers et Ext.
+
+.. note::
+
+	* Niveau requis : intermÃ©diaire
+	* Connaissances requises : SQL (PostgreSQL, PostGIS), Javascript, HTML
+	* MatÃ©riel : ces travaux pratiques utiliseront le LiveDVD de l'OSGeo.
+
+
+.. rubric:: Presenter
+
+* *Daniel Kastl* est le fondateur et le directeur de l'entreprise `Georepublic <http://georepublic.de>`_ et travail en Alemagne et au Japon. Il modÃšre et pormeut la communautÃ© pgRouting et en assure le dÃ©veloppement depuis 5 ans, il est un actif contributeur de la communautÃ© OSM au Japon.
+
+* *FrÃ©dÃ©ric Junod* travail au bureau Suisse de l'entreprise `Camptocamp <http://www.camptocamp.com>`_ depuis environ 5 ans. Il est dÃ©veloppeur actif de nombreux projets OpenSource depuis le navigateur (GeoExt, OpenLayers) jusqu'au monde serveur (MapFish, Shapely, TileCache) il est membre du commitÃ© de pilotage de pgRouting.
+
+Daniel et FrÃ©dÃ©ric sont les auteurs des travaxu pratiques pgRouting prÃ©cÃ©dents, qui ont eut lieu au FOSS4G au Canada, en Afrique du Sud, en Espagne et dans des confÃ©rences locales au Japon.
+
+.. rubric:: License
+
+Ce travail est ditribuÃ© sous licence `Creative Commons Attribution-Share Alike 3.0 License <http://creativecommons.org/licenses/by-sa/3.0/>`_.
+
+.. image:: images/license.png
+
+
+.. rubric:: Support
+
+.. image:: images/camptocamp.png
+	:alt: Camptocamp
+
+`Camptocamp <http://www.camptocamp.com>`_
+
+.. image:: images/georepublic.png
+	:alt: Georepublic
+	
+`Georepublic <http://georepublic.de>`_
+
+
Index: /trunk/workshop-routing-foss4g/docs/chapters/code/mapconfig_sample.xml
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/code/mapconfig_sample.xml	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/code/mapconfig_sample.xml	(revision 76)
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<configuration>
+  <type name="highway" id="1">
+    <class name="motorway" id="101" />
+    <class name="motorway_link" id="102" />
+    <class name="motorway_junction" id="103" />
+    ...
+    <class name="road" id="100" />
+  </type>    
+  <type name="junction" id="4">
+    <class name="roundabout" id="401" />
+  </type>  
+</configuration> 
Index: /trunk/workshop-routing-foss4g/docs/chapters/code/osm_sample.osm
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/code/osm_sample.osm	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/code/osm_sample.osm	(revision 76)
@@ -0,0 +1,48 @@
+<?xml version='1.0' encoding='UTF-8'?>
+<osm version='0.6' generator='xapi: OSM Extended API 2.0' ... >
+  ...	
+  <node id='255405560' lat='41.4917468' lon='2.0257695' version='1' 
+  		changeset='19117' user='efrainlarrea' uid='32823' visible='true' 
+  		timestamp='2008-04-02T17:40:07Z'>
+  </node>
+  <node id='255405551' lat='41.4866740' lon='2.0302842' version='3' 
+  		changeset='248452' user='efrainlarrea' uid='32823' visible='true' 
+  		timestamp='2008-04-24T15:56:08Z'>
+  </node>
+  <node id='255405552' lat='41.4868540' lon='2.0297863' version='1' 
+  		changeset='19117' user='efrainlarrea' uid='32823' visible='true' 
+  		timestamp='2008-04-02T17:40:07Z'>
+  </node>
+  ...
+  <way id='35419222' visible='true' timestamp='2009-06-03T21:49:11Z' 
+  		version='1' changeset='1416898' user='Yodeima' uid='115931'>
+    <nd ref='415466914'/>
+    <nd ref='415466915'/>
+    <tag k='highway' v='unclassified'/>
+    <tag k='lanes' v='1'/>
+    <tag k='name' v='Carrer del ProgrÃ©s'/>
+    <tag k='oneway' v='no'/>
+  </way>
+  <way id='35419227' visible='true' timestamp='2009-06-14T20:37:55Z' 
+  		version='2' changeset='1518775' user='Yodeima' uid='115931'>
+    <nd ref='415472085'/>
+    <nd ref='415472086'/>
+    <nd ref='415472087'/>
+    <tag k='highway' v='unclassified'/>
+    <tag k='lanes' v='1'/>
+    <tag k='name' v='carrer de la mecanica'/>
+    <tag k='oneway' v='no'/>
+  </way>
+  ...
+  <relation id='903432' visible='true' timestamp='2010-05-06T08:36:54Z' 
+  		version='1' changeset='4619553' user='ivansanchez' uid='5265'>
+    <member type='way' ref='56426179' role='outer'/>
+    <member type='way' ref='56426173' role='inner'/>
+    <tag k='layer' v='0'/>
+    <tag k='leisure' v='common'/>
+    <tag k='name' v='PlaÃ§a Can Suris'/>
+    <tag k='source' v='WMS shagrat.icc.cat'/>
+    <tag k='type' v='multipolygon'/>
+  </relation>
+  ...
+</osm>
Index: /trunk/workshop-routing-foss4g/docs/chapters/advanced.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/advanced.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/advanced.rst	(revision 76)
@@ -0,0 +1,143 @@
+==============================================================================================================
+RequÃªtes de routage avancÃ©es
+==============================================================================================================
+
+Comme expliquÃ© dans le chapitre prÃ©cÃ©dent une requÃªte de recherche de plus court chemine ressemble gÃ©nÃ©ralement Ã  ce qui suit :
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path_shooting_star(
+		'SELECT gid as id, source, target, length as cost, x1, y1, x2, y2, rule, 
+		to_cost, reverse_cost FROM ways', 6585, 8247, true, true);
+	
+On parle gÃ©nÃ©ralement de **plus court** chemin, ce qui signifie que la longueur d'un arc est son coÃ»t. Mais le coÃ»t n'est pas nÃ©cessairement une longueur, il peut reprÃ©senter n'importe quoi, par exemple le temps, la surface, le type de routes, etc ... Ou il peut Ãªtre la combinaison de plusieurs paramÃštres ("coÃ»ts pondÃ©rÃ©s").
+
+.. note::
+
+	Si vous souhaitez continuer avec une base de donnÃ©es contenant les fonctions pgRouting, les donnÃ©es exemples ainsi que les attributs nÃ©cessaires, vous pouvez charger le fichier de sauvegarded la maniÃšre suivante.
+
+.. code-block:: bash
+
+	# Optionel: supprimer la base de donnÃ©es
+	dropdb -U postgres pgrouting-workshop
+
+	# Charger le fichier de sauvegarde
+	psql -U postgres -f ~/Desktop/pgrouting-workshop/data/sampledata_routing.sql
+
+-------------------------------------------------------------------------------------------------------------
+CoÃ»ts pondÃ©rÃ©s
+-------------------------------------------------------------------------------------------------------------
+
+Dans un vrai rÃ©seau il y a diffÃ©rents types de limitations ou de prÃ©fÃ©rences suivant les types de routes par exemple. En d'autre termes, nous ne voulons pas calculer *le plus court* chemin mais le chemin *le moins cher* - un chemin avec un coÃ»t minimum. Il n'y aucune limitation dans ce qui peut ÃªtreutilsiÃ© pour dÃ©finir le coÃ»t.
+
+Lorsque nous avons convertis les donnÃ©es au format OSM en utilisant l'outil osm2pgrouting, nous avons deux autres tables permettant de dÃ©ifinir les ``types`` de routes et les ``classes``.
+
+.. note::
+
+	Nous passons maintenant Ã  la base de donnÃ©es que nuos avons gÃ©nÃ©rÃ©e avec osm2pgrouting. Depuis l'invite de commandes de PostgreSQL ceci est possible avec la commande ``\c routing``.
+
+.. rubric:: Lancer : ``SELECT * FROM types;``
+
+.. code-block:: sql
+
+	  id |   name    
+	-----+------------
+	   2 | cycleway
+	   1 | highway
+	   4 | junction
+	   3 | tracktype
+   
+.. rubric:: Lancer : ``SELECT * FROM classes;``
+
+.. code-block:: sql
+
+	 id  | type_id |        name        |  cost 
+	-----+---------+--------------------+--------
+	 201 |       2 | lane               |     
+	 204 |       2 | opposite           |     
+	 203 |       2 | opposite_lane      |    
+	 202 |       2 | track              |     
+	 117 |       1 | bridleway          |     
+	 113 |       1 | bus_guideway       |     
+	 118 |       1 | byway              |     
+	 115 |       1 | cicleway           |     
+	 116 |       1 | footway            |     
+	 108 |       1 | living_street      |     
+	 101 |       1 | motorway           |    
+	 103 |       1 | motorway_junction  |     
+	 102 |       1 | motorway_link      |     
+	 114 |       1 | path               |     
+	 111 |       1 | pedestrian         |     
+	 106 |       1 | primary            |     
+	 107 |       1 | primary_link       |     
+	 107 |       1 | residential        |     
+	 100 |       1 | road               |     
+	 100 |       1 | unclassified       |     
+	 106 |       1 | secondary          |    
+	 109 |       1 | service            |     
+	 112 |       1 | services           |     
+	 119 |       1 | steps              |     
+	 107 |       1 | tertiary           |     
+	 110 |       1 | track              |     
+	 104 |       1 | trunk              |     
+	 105 |       1 | trunk_link         |     
+	 401 |       4 | roundabout         |     
+	 301 |       3 | grade1             |     
+	 302 |       3 | grade2             |     
+	 303 |       3 | grade3             |     
+	 304 |       3 | grade4             |     
+	 305 |       3 | grade5             |     
+
+La classe de route est liÃ©e avec la tables des cheminspar le champ ``class_id``. Suite Ã  l'importation des donnÃ©es la valeur de la colonne ``cost`` n'est pas encore attribuÃ©e. Sa valeur peut Ãªtre modifiÃ©e Ã  l'aide d'une requÃªte ``UPDATE``. Dans cet exemple les valeurs de coÃ»t pour la table des classe sont assignÃ© de faÃ§on arbitraire, donc nous exÃ©cutons :
+
+.. code-block:: sql
+
+	UPDATE classes SET cost=1 ;
+	UPDATE classes SET cost=2.0 WHERE name IN ('pedestrian','steps','footway');
+	UPDATE classes SET cost=1.5 WHERE name IN ('cicleway','living_street','path');
+	UPDATE classes SET cost=0.8 WHERE name IN ('secondary','tertiary');
+	UPDATE classes SET cost=0.6 WHERE name IN ('primary','primary_link');
+	UPDATE classes SET cost=0.4 WHERE name IN ('trunk','trunk_link');
+	UPDATE classes SET cost=0.3 WHERE name IN ('motorway','motorway_junction','motorway_link');
+
+Pour de meilleures performances, tout spÃ©cialement si le rÃ©seau est important, il est prÃ©fÃ©rable de crÃ©er un index sur la colonnes ``class_id`` de la table des chemins et eventuellement le champ ``id`` de la table ``types``.
+
+.. code-block:: sql
+
+	CREATE INDEX ways_class_idx ON ways (class_id);
+	CREATE INDEX classes_idx ON classes (id);
+
+L'idÃ©e de ces deux tables est de les utiliser afin de spÃ©cifier un facteur qui sera multipliÃ© par le coÃ»t de parcour d'un tronÃ§on (habituellement la longueur) :
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path_shooting_star(
+		'SELECT gid as id, class_id, source, target, length*c.cost as cost, 
+			x1, y1, x2, y2, rule, to_cost, reverse_cost*c.cost as reverse_cost 
+		FROM ways w, classes c 
+		WHERE class_id=c.id', 6585, 8247, true, true);
+
+-------------------------------------------------------------------------------------------------------------
+Restriction d'accÃšs
+-------------------------------------------------------------------------------------------------------------
+
+Une autre possibilitÃ© est de restreindre l'accÃšs Ã  des routes d'un certains types soit en affectant un coÃ»t trÃšs Ã©levÃ© Ã  un tronÃ§on ayant un certain attribut soit en s'assurant de ne sÃ©lectionner aucun de ces tronÃ§ons :
+
+.. code-block:: sql
+
+	UPDATE classes SET cost=100000 WHERE name LIKE 'motorway%';
+
+En utilisant des sous-requÃªtes vous pouvez "mixer" vos coÃ»t comme bon vous semble et cela modifiera le rÃ©sultat obtenu imÃ©diatement. Les changements de coÃ»ts affecteront la prochaine recherche de plus courts chemins, sans avoir Ã  reconstruire le votre rÃ©seau.
+
+Bien entendu, certaines classes de tronÃ§on peuvent aussi Ãªtre exclues Ã  l'aide d'une clause ``WHERE`` dans la requÃªte, par exemple pour exclure la classe "living_street" :
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path_shooting_star(
+		'SELECT gid as id, class_id, source, target, length*c.cost as cost, 
+			x1, y1, x2, y2, rule, to_cost, reverse_cost*c.cost as reverse_cost 
+		FROM ways w, classes c 
+		WHERE class_id=c.id AND class_id != 111', 6585, 8247, true, true);
+
+Bien entendu, pgRouting vus permet tout types de requÃªtes SQL supportÃ©es par PostgreSQL/PostGIS.
+ 
Index: /trunk/workshop-routing-foss4g/docs/chapters/shortest_path.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/chapters/shortest_path.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/chapters/shortest_path.rst	(revision 76)
@@ -0,0 +1,373 @@
+==============================================================================================================
+Plus courts chemins
+==============================================================================================================
+
+pgRouting Ã©tÃ© initialement appelÃ© *pgDijkstra*, puisque il implÃ©mentait seulement la recherche de plus court chemin Ã  l'aide de l'agorithme de *Dijkstra*. Plus tard, d'uatres fonctions se sont ajoutÃ©es et la bibliotÃšque fut renommÃ©e.
+
+.. image:: images/route.png
+	:width: 250pt
+	:align: center
+	
+Ce chapitre explique les trois diffÃ©rents algorithmes et les attributs nÃ©cessaires.
+
+
+.. note::
+
+	Si vous lancez l'outils :doc:`osm2pgrouting <osm2pgrouting>` pour importer des donnÃ©es *OpenStreetMap*, la table des chemins (``ways``) contient dÃ©jÃ  tout les attributs nÃ©cessaires pour utiliser les fonctions de recherche de plus court chemins. Au contraire, la table ``ways`` de la base de donnÃ©es ``pgrouting-workshop`` du :doc:`chapitre prÃ©cÃ©dent <topology>` manque d'un certain nombre d'attributs, qui sont prÃ©sentÃ©s dans ce chapitre dans les **PrÃ©requis**.
+
+
+-------------------------------------------------------------------------------------------------------------
+Dijkstra
+-------------------------------------------------------------------------------------------------------------
+
+L'algorithme de Dijkstraa Ã©tÃ© la premiÃšre implÃ©mentation disponible dans pgRouting. Il ne nÃ©cessite pas d'autre attributs que les champs ``source`` et ``target``, les attributs ``id`` et ``cost``. Il peut Ãªtre utilisÃ© sur des graphes orientÃ©s ou non. Vous pouvez spÃ©cifier que votre rÃ©seau Ã  un coÃ»t de ``parcours inverse`` (``reverse cost``) ou non.
+
+.. rubric:: PrÃ©requis
+
+Pour Ãªtre en mesure d'utiliser un coÃ»t de parcuors invers, vous devez ajouter une colonne de coÃ»t. Nous pouvons affecter la longuer au coÃ»t de parcours inverse.
+
+.. code-block:: sql
+
+	ALTER TABLE ways ADD COLUMN reverse_cost double precision;
+	UPDATE ways SET reverse_cost = length;
+
+.. rubric:: Fonction avec paramÃštres
+
+.. code-block:: sql
+
+	shortest_path( sql text, 
+			   source_id integer, 
+			   target_id integer, 
+			   directed boolean, 
+			   has_reverse_cost boolean ) 
+
+.. note::
+
+	* Les identifiant pour source et target sont les identifiant des noeuds.
+	* Graphes non-orientÃ©s ("directed=false") implique que le paramÃštre "has_reverse_cost" est ignorÃ©
+
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Bases
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+Chaque algorithme a une fonction de *base*.
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path('
+			SELECT gid as id, 
+				 source::integer, 
+				 target::integer, 
+				 length::double precision as cost 
+				FROM ways', 
+			5700, 6733, false, false); 
+
+.. code-block:: sql
+
+	 vertex_id | edge_id |        cost         
+	-----------+---------+---------------------
+	      5700 |    6585 |   0.175725539559539
+	      5701 |   18947 |   0.178145491343884
+	      2633 |   18948 |   0.177501253416424
+	       ... |     ... |                 ...
+	      6733 |      -1 |                   0
+	 (38 rows)
+
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Enveloppe
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. rubric:: Enveloppe SANS limite d'Ã©tendue
+
+les fonctions enveloppes sont des fonctions qui Ã©tendent les fonctions de bases en y ajoutant des transformations, ajoutant des limites de l'Ã©tendue gÃ©ograhpique de la recherhe, etc.. Les enveloppes peuvent changer le format et l'ordre des rÃ©sultats. Il affectent aussi automatiquement certains paramÃštre et rend l'utilisation de pgRouting encore plsu simple.
+
+.. code-block:: sql
+
+	SELECT gid, AsText(the_geom) AS the_geom 
+		FROM dijkstra_sp('ways', 5700, 6733);
+		
+.. code-block:: sql
+		
+	  gid   |                              the_geom      
+	--------+---------------------------------------------------------------
+	   5534 | MULTILINESTRING((-104.9993415 39.7423284, ... ,-104.9999815 39.7444843))
+	   5535 | MULTILINESTRING((-104.9999815 39.7444843, ... ,-105.0001355 39.7457581))
+	   5536 | MULTILINESTRING((-105.0001355 39.7457581,-105.0002133 39.7459024))
+	    ... | ...
+	  19914 | MULTILINESTRING((-104.9981408 39.7320938,-104.9981194 39.7305074))
+	(37 rows)
+
+
+.. note::
+
+	Il est possible de visualiser le chemin dans QGIS. Cela fonctionne pour la requÃªte de recherche du plus court chemin qui retourne une colonne gÃ©omÃ©trique.
+
+	* CrÃ©er la connexion Ã  la base de donnÃ©es et ajoutez la table route comme couche de fond.
+	* Ajoutez une autre couche de la table "ways" mais selectionnez l'option ``Build query`` avant de l'ajouter.
+	* Saissez ``"gid"  IN ( SELECT gid FROM dijkstra_sp('ways',5700,6733))`` dans le champ **SQL where clause**.
+	
+	``SQL query`` peut aussi Ãªtre sÃ©lectionnÃ© depuis le menu contextuel de la couche. 
+
+	
+.. rubric:: Enveloppe AVEC une Ã©tendue limite
+
+Vous pouvez limiter votre recherche Ã  une zone prÃ©cise en ajoutant un cadre limite. Cela amÃ©liorera les performances tout spÃ©cialement pour les rÃ©seaux volumineux.
+
+.. code-block:: sql
+
+	SELECT gid, AsText(the_geom) AS the_geom 
+		FROM dijkstra_sp_delta('ways', 5700, 6733, 0.1);
+		
+.. code-block:: sql
+
+	  gid   |                              the_geom      
+	--------+---------------------------------------------------------------
+	   5534 | MULTILINESTRING((-104.9993415 39.7423284, ... ,-104.9999815 39.7444843))
+	   5535 | MULTILINESTRING((-104.9999815 39.7444843, ... ,-105.0001355 39.7457581))
+	   5536 | MULTILINESTRING((-105.0001355 39.7457581,-105.0002133 39.7459024))
+	    ... | ...
+	  19914 | MULTILINESTRING((-104.9981408 39.7320938,-104.9981194 39.7305074))
+	(37 rows)
+
+.. note:: 
+
+	La projection des donnÃ©es OSM est en "degrÃ©s", donc nous dÃ©finirons un cadre limite contenant le point de dÃ©part et celui d'arrivÃ©e plus une zone tampon de ``0.1`` degrÃ©s par exemple.
+
+
+-------------------------------------------------------------------------------------------------------------
+A-Ãtoile
+-------------------------------------------------------------------------------------------------------------
+
+L'algortihme A-Ãtoile est un autre algrithme bien connu. Il ajoute l'information de la position gÃ©ographique du dÃ©but et la fin de chaque tronÃ§on. Cela permet une recherche privilÃ©giant les tronÃ§ons proches du point d'arrivÃ©e de la recherche.
+
+.. rubric:: PrÃ©requis
+
+Pour A-* vous avez besoin de prÃ©parer votre table de rÃ©seau et d'y ajouter les colonnes latitute/longitude (``x1``, ``y1`` et ``x2``, ``y2``) et de calculer leur valeurs.
+
+.. code-block:: sql
+
+	ALTER TABLE ways ADD COLUMN x1 double precision;
+	ALTER TABLE ways ADD COLUMN y1 double precision;
+	ALTER TABLE ways ADD COLUMN x2 double precision;
+	ALTER TABLE ways ADD COLUMN y2 double precision;
+	
+	UPDATE ways SET x1 = x(ST_startpoint(the_geom));
+	UPDATE ways SET y1 = y(ST_startpoint(the_geom));
+	
+	UPDATE ways SET x2 = x(ST_endpoint(the_geom));
+	UPDATE ways SET y2 = y(ST_endpoint(the_geom));
+	
+	UPDATE ways SET x1 = x(ST_PointN(the_geom, 1));
+	UPDATE ways SET y1 = y(ST_PointN(the_geom, 1));
+	
+	UPDATE ways SET x2 = x(ST_PointN(the_geom, ST_NumPoints(the_geom)));
+	UPDATE ways SET y2 = y(ST_PointN(the_geom, ST_NumPoints(the_geom)));
+
+.. Note:: 
+
+	La fonction ``endpoint()`` ne fonctionne pas avec certaines versions de PostgresQL (par exemple les version 8.2.5 et 8.1.9). Un moyen de rÃ©soudre ce problÃšme consiste Ã  utiliser la fonction ``PointN()`` Ã  la place:
+
+
+.. rubric:: Fonction avec paramÃštres
+
+La fonction de recherche de plus court chemin A-* est trÃšs semblable Ã  la fonction Dijkstra, bien qu'elle prÃ©fÃšre les tronÃ§ons qui sont plus proche du point d'arrivÃ©e de la recherche. Les heuristiques de cette recherche sont prÃ©dÃ©finis, donc vous aurez besoin de recompiler pgRouting si vous souhaitez modifier ces heuristiques.
+
+.. code-block:: sql
+
+	shortest_path_astar( sql text, 
+			   source_id integer, 
+			   target_id integer, 
+			   directed boolean, 
+			   has_reverse_cost boolean ) 
+
+.. note::
+	* Les identifiants source et target sont les identifiant des sommets IDs.
+	* Graphes non-orientÃ© ("directed=false") ne prennent pas en compte le paramÃštre "has_reverse_cost"
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Bases
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path_astar('
+			SELECT gid as id, 
+				 source::integer, 
+				 target::integer, 
+				 length::double precision as cost, 
+				 x1, y1, x2, y2
+				FROM ways', 
+			5700, 6733, false, false); 
+		
+.. code-block:: sql
+		
+	 vertex_id | edge_id |        cost         
+	-----------+---------+---------------------
+	      5700 |    6585 |   0.175725539559539
+	      5701 |   18947 |   0.178145491343884
+	      2633 |   18948 |   0.177501253416424
+	       ... |     ... |                 ...
+	      6733 |      -1 |                   0
+	 (38 rows)
+
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Enveloppe
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. rubric:: Fonction envelopper AVEC cadre limite
+
+.. code-block:: sql
+
+	SELECT gid, AsText(the_geom) AS the_geom 
+		FROM astar_sp_delta('ways', 5700, 6733, 0.1);
+
+.. code-block:: sql
+
+	  gid   |                              the_geom      
+	--------+---------------------------------------------------------------
+	   5534 | MULTILINESTRING((-104.9993415 39.7423284, ... ,-104.9999815 39.7444843))
+	   5535 | MULTILINESTRING((-104.9999815 39.7444843, ... ,-105.0001355 39.7457581))
+	   5536 | MULTILINESTRING((-105.0001355 39.7457581,-105.0002133 39.7459024))
+	    ... | ...
+	  19914 | MULTILINESTRING((-104.9981408 39.7320938,-104.9981194 39.7305074))
+	(37 rows)
+
+	
+.. note::
+
+	* Il n'y a pas actuellement de fonction pour a-* sans cadre limite, Ã©tant donnÃ©e que le cadre limite permet d'amÃ©liorer grandement les performances. Si vous n'avez pas besoin de cadre limite, Dijkstra sera suffisant.
+
+
+-------------------------------------------------------------------------------------------------------------
+Shooting-Star
+-------------------------------------------------------------------------------------------------------------
+
+L'algorithme Shooting-Star est le dernier algorithme de recherche de plus court chemin. Sa spÃ©cialitÃ© c'est qu'il recherche un parcours d'un tronÃ§on Ã  un autre, pas d'un sommet Ã  un sommet comme les agorithmes de Dijkstra et A-Star le font. Cela rend possible la dÃ©finition de relations entre les tronÃ§ons par exemple, et cela rÃ©soud certains problÃšmes liÃ©s aux recherches d'un sommets Ã  un autre comme les "tronÃ§ons parallÃšles", qui ont les mÃªme sommet de dÃ©but et de fin mais des coÃ»t diffÃ©rents.
+
+.. rubric:: PrÃ©requis
+
+Pour Shooting-Star vous avez besoin de prÃ©parer votre table de rÃ©seau et d'ajouter les colonnes ``rule`` et ``to_cost``. Come l'algorithme A-* il a aussi un fonction heuristique, qui favorise les tronÃ§ons plus proche du point d'arrivÃ©e.which prefers links closer to the target of the search.
+
+.. code-block:: sql
+
+	-- Ajouter les colonnes rule et to_cost
+	ALTER TABLE ways ADD COLUMN to_cost double precision;	
+	ALTER TABLE ways ADD COLUMN rule text;
+
+.. rubric:: L'algorithme Shooting-Star introduit deux nouveaux attributs
+
+.. list-table::
+   :widths: 10 90
+
+   * - **Attribut**
+     - **DÃ©scription**
+   * - rule
+     - une chaine de caractÃšres contenant une liste d'identifiants de tronÃ§no sÃ©parÃ©s par une virgule, qui dÃ©crivent le sens giratoir (si vous venez de cet tronÃ§on, vous pouvez rejoindre le suivant en ajoutant un coÃ»t dÃ©fini dans la colonne to_cost)
+   * - to_cost
+     - un coÃ»t pour passer d'un tronÃ§on Ã  un autre (peut Ãªtre trÃšs Ã©levÃ© s'il est interdit de trouner vers ce tronÃ§on ce qui est comparable au coÃ»t de parcours d'un tronÃ§on en cas de feu de signalisation)
+
+.. rubric:: Fonction avec paramÃštres
+
+.. code-block:: sql
+
+	shortest_path_shooting_star( sql text, 
+			   source_id integer, 
+			   target_id integer, 
+			   directed boolean, 
+			   has_reverse_cost boolean ) 
+
+.. note::
+
+	* Identifiant du dÃ©part et de l'arrivÃ©e sont des identifiants de tronÃ§ons.
+	* Graphes non-orientÃ©s ("directed=false") ne prennent pas en compte le paramÃštre "has_reverse_cost" 
+
+Pour dÃ©crire une interdiction de tourner :
+
+.. code-block:: sql
+
+	 gid | source | target | cost | x1 | y1 | x2 | y2 | to_cost | rule
+	-----+--------+--------+------+----+----+----+----+---------+------
+	  12 |      3 |     10 |    2 |  4 |  3 |  4 |  5 |    1000 | 14
+  
+... signifie que le coÃ»t pour aller du tronÃ§on 14 au tronÃ§on 12 est de 1000, et
+
+.. code-block:: sql
+
+	 gid | source | target | cost | x1 | y1 | x2 | y2 | to_cost | rule
+	-----+--------+--------+------+----+----+----+----+---------+------
+	  12 |      3 |     10 |    2 |  4 |  3 |  4 |  5 |    1000 | 14, 4
+
+... signifie que le coÃ»t pour aller du tronÃ§on 14 au tronÃ§on 12 via le tronÃ§on 4 est de 1000.
+
+Si vous avez besoin de plusieurs restrictions pour une arrÃªte donnÃ©e you devez ajouter plusieurs enregistrements pour ce tronÃ§on avec un restriction particuliÃšre.
+
+.. code-block:: sql
+
+	 gid | source | target | cost | x1 | y1 | x2 | y2 | to_cost | rule
+	-----+--------+--------+------+----+----+----+----+---------+------
+	  11 |      3 |     10 |    2 |  4 |  3 |  4 |  5 |    1000 | 4
+	  11 |      3 |     10 |    2 |  4 |  3 |  4 |  5 |    1000 | 12
+
+... signifie que le coÃ»t pour aller soit du tronÃ§on  4 soit du 12 au 11 est de 1000. Et donc vous devez ordoner vos donnÃ©es par gid lorsque vous chargez vos donnÃ©es dans la fonction de recherche de plus court chemin...
+
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Bases
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+Un exemple d'utilisation de l'algorithme Shooting Star : 
+
+.. code-block:: sql
+
+	SELECT * FROM shortest_path_shooting_star('
+			SELECT gid as id, 
+				 source::integer,
+				 target::integer, 
+				 length::double precision as cost, 
+				 x1, y1, x2, y2,
+				 rule, to_cost 
+				FROM ways', 
+			6585, 8247, false, false); 
+
+.. code-block:: sql
+
+	 vertex_id | edge_id |        cost
+	-----------+---------+---------------------
+	     15007 |    6585 |   0.175725539559539
+	     15009 |   18947 |   0.178145491343884
+	      9254 |   18948 |   0.177501253416424
+	       ... |     ... |   ...
+	      1161 |    8247 |   0.051155648874288
+	 (37 rows)
+
+.. warning::
+
+	L'lgorithme Shooting Star calcul un chemin d'un tronÃ§on Ã  un autre (pas d'un sommet Ã  un autre). La colonnes vertex_id contienr le point de dÃ©part du tronÃ§on de la colonne edge_id.
+
+
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+Envelopper
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. code-block:: sql
+
+	SELECT gid, AsText(the_geom) AS the_geom
+		FROM shootingstar_sp('ways', 6585, 8247, 0.1, 'length', true, true);
+
+.. code-block:: sql
+
+	  gid   |                              the_geom      
+	--------+---------------------------------------------------------------
+	   6585 | MULTILINESTRING((-104.9975345 39.7193508,-104.9975487 39.7209311))
+	  18947 | MULTILINESTRING((-104.9975487 39.7209311,-104.9975509 39.7225332))
+	  18948 | MULTILINESTRING((-104.9975509 39.7225332,-104.9975447 39.7241295))
+	    ... | ...
+	   8247 | MULTILINESTRING((-104.9978555 39.7495627,-104.9982781 39.7498884))
+	(37 rows)
+
+.. note::
+
+	Il n'y a actuellement pas de fonction enveloppe pour Shooting-Star sans cadre limite, puisque le cadre limite amÃ©liore grandement les performances. 
Index: /trunk/workshop-routing-foss4g/docs/conf.py
===================================================================
--- /trunk/workshop-routing-foss4g/docs/conf.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/conf.py	(revision 76)
@@ -0,0 +1,227 @@
+# -*- coding: utf-8 -*-
+#
+# Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt documentation build configuration file, created by
+# sphinx-quickstart on Sat Jul  3 21:23:22 2010.
+#
+# This file is execfile()d with the current directory set to its containing dir.
+#
+# Note that not all possible configuration values are present in this
+# autogenerated file.
+#
+# All configuration values have a default; values that are commented out
+# serve to show the default.
+
+import sys, os
+
+# If extensions (or modules to document with autodoc) are in another directory,
+# add these directories to sys.path here. If the directory is relative to the
+# documentation root, use os.path.abspath to make it absolute, like shown here.
+sys.path.append(os.path.abspath('.'))
+
+# -- General configuration -----------------------------------------------------
+
+# Add any Sphinx extension module names here, as strings. They can be extensions
+# coming with Sphinx (named 'sphinx.ext.*') or your custom ones.
+extensions = ['sphinx.ext.todo']
+
+# Add any paths that contain templates here, relative to this directory.
+templates_path = ['_templates']
+
+# The suffix of source filenames.
+source_suffix = '.rst'
+
+# The encoding of source files.
+#source_encoding = 'utf-8'
+
+# The master toctree document.
+master_doc = 'index'
+
+# General information about the project.
+project = u'Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le rÃ©seau routier d''OpenStreetMap et GeoExt'
+copyright = u'2010-2011 Daniel Kastl, FrÃ©dÃ©ric Junod'
+
+# The version info for the project you're documenting, acts as replacement for
+# |version| and |release|, also used in various other places throughout the
+# built documents.
+#
+# The short X.Y version.
+version = '2011'
+# The full version, including alpha/beta/rc tags.
+release = '2'
+
+# The language for content autogenerated by Sphinx. Refer to documentation
+# for a list of supported languages.
+#language = None
+
+# There are two options for replacing |today|: either, you set today to some
+# non-false value, then it is used:
+#today = ''
+# Else, today_fmt is used as the format for a strftime call.
+#today_fmt = '%B %d, %Y'
+
+# List of documents that shouldn't be included in the build.
+#unused_docs = []
+
+# List of directories, relative to source directory, that shouldn't be searched
+# for source files.
+exclude_trees = ['_build']
+
+# The reST default role (used for this markup: `text`) to use for all documents.
+#default_role = None
+
+# If true, '()' will be appended to :func: etc. cross-reference text.
+#add_function_parentheses = True
+
+# If true, the current module name will be prepended to all description
+# unit titles (such as .. function::).
+#add_module_names = True
+
+# If true, sectionauthor and moduleauthor directives will be shown in the
+# output. They are ignored by default.
+#show_authors = False
+
+# The name of the Pygments (syntax highlighting) style to use.
+pygments_style = 'sphinx'
+
+# A list of ignored prefixes for module index sorting.
+#modindex_common_prefix = []
+
+
+# -- Options for HTML output ---------------------------------------------------
+
+# The theme to use for HTML and HTML Help pages.  Major themes that come with
+# Sphinx are currently 'default' and 'sphinxdoc'.
+html_theme = 'default'
+
+# Theme options are theme-specific and customize the look and feel of a theme
+# further.  For a list of options available for each theme, see the
+# documentation.
+html_theme_options = {
+    #"rightsidebar": "true",
+    "stickysidebar": "true",
+    "footerbgcolor": "#FFEEFF",
+    "footertextcolor": "#555555",
+    "sidebarbgcolor": "#FFEEFF",
+    "sidebartextcolor": "#111111",
+    "sidebarlinkcolor": "#355F7C",
+    #"bgcolor": "",
+    #"textcolor": "",
+    #"linkcolor": "",
+    #"headbgcolor": "",
+    #"headtextcolor": "",
+    #"headlinkcolor": "",
+    #"codebgcolor": "",
+    #"codetextcolor": "",
+    #"bodyfont": "",
+    #"headfont": "",
+    #"relbartextcolor": "",
+    #"relbarlinkcolor": "",
+    "relbarbgcolor": "#555555"
+}
+
+# Add any paths that contain custom themes here, relative to this directory.
+#html_theme_path = []
+
+# The name for this set of Sphinx documents.  If None, it defaults to
+# "<project> v<release> documentation".
+html_title = "Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le reseau routier d'OpenStreetMap et GeoExt"
+
+# A shorter title for the navigation bar.  Default is the same as html_title.
+html_short_title = "Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le reseau routier d'OpenStreetMap et GeoExt"
+
+# The name of an image file (relative to this directory) to place at the top
+# of the sidebar.
+html_logo = "_static/pgrouting.png"
+
+# The name of an image file (within the static path) to use as favicon of the
+# docs.  This file should be a Windows icon file (.ico) being 16x16 or 32x32
+# pixels large.
+html_favicon = "_static/favicon.ico"
+
+# Add any paths that contain custom static files (such as style sheets) here,
+# relative to this directory. They are copied after the builtin static files,
+# so a file named "default.css" will overwrite the builtin "default.css".
+html_static_path = ['_static']
+
+# If not '', a 'Last updated on:' timestamp is inserted at every page bottom,
+# using the given strftime format.
+html_last_updated_fmt = '%b %d, %Y'
+
+# If true, SmartyPants will be used to convert quotes and dashes to
+# typographically correct entities.
+#html_use_smartypants = True
+
+# Custom sidebar templates, maps document names to template names.
+#html_sidebars = {}
+
+# Additional templates that should be rendered to pages, maps page names to
+# template names.
+#html_additional_pages = {}
+
+# If false, no module index is generated.
+#html_use_modindex = True
+
+# If false, no index is generated.
+html_use_index = False
+
+# If true, the index is split into individual pages for each letter.
+#html_split_index = False
+
+# If true, links to the reST sources are added to the pages.
+html_show_sourcelink = False
+
+# If true, an OpenSearch description file will be output, and all pages will
+# contain a <link> tag referring to it.  The value of this option must be the
+# base URL from which the finished HTML is served.
+#html_use_opensearch = ''
+
+# If nonempty, this is the file name suffix for HTML files (e.g. ".xhtml").
+#html_file_suffix = ''
+
+# Output file base name for HTML help builder.
+htmlhelp_basename = 'pgRoutingWorkshop'
+
+
+# -- Options for LaTeX output --------------------------------------------------
+
+latex_elements = {
+	'papersize'	: 'letter',
+	'pointsize'	: '10pt'
+}
+
+# Grouping the document tree into LaTeX files. List of tuples
+# (source start file, target name, title, author, documentclass [howto/manual]).
+latex_documents = [
+  ('latex', 'pgRoutingWorkshop.tex', u'Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt Manual',
+   u'Daniel Kastl, FrÃ©dÃ©ric Junod', 'manual', False),
+]
+
+# The name of an image file (relative to this directory) to place at the top of
+# the title page.
+#latex_logo = None
+
+# For "manual" documents, if this is true, then toplevel headings are parts,
+# not chapters.
+#latex_use_parts = False
+
+# Additional stuff for the LaTeX preamble.
+#latex_preamble = ''
+
+# Documents to append as an appendix to all manuals.
+#latex_appendices = []
+
+# If false, no module index is generated.
+latex_use_modindex = False
+
+# New in version 1.0
+latex_show_pagerefs = False
+latex_domain_indices = False
+
+
+# -- Custom Options --------------------------------------------------
+
+# Enable ToDo extension
+todo_include_todos = True
+
+html_show_sphinx = False
+
Index: /trunk/workshop-routing-foss4g/docs/Makefile
===================================================================
--- /trunk/workshop-routing-foss4g/docs/Makefile	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/Makefile	(revision 76)
@@ -0,0 +1,89 @@
+# Makefile for Sphinx documentation
+#
+
+# You can set these variables from the command line.
+SPHINXOPTS    = -Dlanguage=fr
+SPHINXBUILD   = sphinx-build
+PAPER         =
+BUILDDIR      = _build
+
+# Internal variables.
+PAPEROPT_a4     = -D latex_paper_size=a4
+PAPEROPT_letter = -D latex_paper_size=letter
+ALLSPHINXOPTS   = -d $(BUILDDIR)/doctrees $(PAPEROPT_$(PAPER)) $(SPHINXOPTS) .
+
+.PHONY: help clean html dirhtml pickle json htmlhelp qthelp latex changes linkcheck doctest
+
+help:
+	@echo "Please use \`make <target>' where <target> is one of"
+	@echo "  html      to make standalone HTML files"
+	@echo "  dirhtml   to make HTML files named index.html in directories"
+	@echo "  pickle    to make pickle files"
+	@echo "  json      to make JSON files"
+	@echo "  htmlhelp  to make HTML files and a HTML help project"
+	@echo "  qthelp    to make HTML files and a qthelp project"
+	@echo "  latex     to make LaTeX files, you can set PAPER=a4 or PAPER=letter"
+	@echo "  changes   to make an overview of all changed/added/deprecated items"
+	@echo "  linkcheck to check all external links for integrity"
+	@echo "  doctest   to run all doctests embedded in the documentation (if enabled)"
+
+clean:
+	-rm -rf $(BUILDDIR)/*
+
+html:
+	$(SPHINXBUILD) -b html $(ALLSPHINXOPTS) $(BUILDDIR)/html
+	@echo
+	@echo "Build finished. The HTML pages are in $(BUILDDIR)/html."
+
+dirhtml:
+	$(SPHINXBUILD) -b dirhtml $(ALLSPHINXOPTS) $(BUILDDIR)/dirhtml
+	@echo
+	@echo "Build finished. The HTML pages are in $(BUILDDIR)/dirhtml."
+
+pickle:
+	$(SPHINXBUILD) -b pickle $(ALLSPHINXOPTS) $(BUILDDIR)/pickle
+	@echo
+	@echo "Build finished; now you can process the pickle files."
+
+json:
+	$(SPHINXBUILD) -b json $(ALLSPHINXOPTS) $(BUILDDIR)/json
+	@echo
+	@echo "Build finished; now you can process the JSON files."
+
+htmlhelp:
+	$(SPHINXBUILD) -b htmlhelp $(ALLSPHINXOPTS) $(BUILDDIR)/htmlhelp
+	@echo
+	@echo "Build finished; now you can run HTML Help Workshop with the" \
+	      ".hhp project file in $(BUILDDIR)/htmlhelp."
+
+qthelp:
+	$(SPHINXBUILD) -b qthelp $(ALLSPHINXOPTS) $(BUILDDIR)/qthelp
+	@echo
+	@echo "Build finished; now you can run "qcollectiongenerator" with the" \
+	      ".qhcp project file in $(BUILDDIR)/qthelp, like this:"
+	@echo "# qcollectiongenerator $(BUILDDIR)/qthelp/Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhcp"
+	@echo "To view the help file:"
+	@echo "# assistant -collectionFile $(BUILDDIR)/qthelp/Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhc"
+
+latex:
+	$(SPHINXBUILD) -b latex $(ALLSPHINXOPTS) $(BUILDDIR)/latex
+	@echo
+	@echo "Build finished; the LaTeX files are in $(BUILDDIR)/latex."
+	@echo "Run \`make all-pdf' or \`make all-ps' in that directory to" \
+	      "run these through (pdf)latex."
+
+changes:
+	$(SPHINXBUILD) -b changes $(ALLSPHINXOPTS) $(BUILDDIR)/changes
+	@echo
+	@echo "The overview file is in $(BUILDDIR)/changes."
+
+linkcheck:
+	$(SPHINXBUILD) -b linkcheck $(ALLSPHINXOPTS) $(BUILDDIR)/linkcheck
+	@echo
+	@echo "Link check complete; look for any errors in the above output " \
+	      "or in $(BUILDDIR)/linkcheck/output.txt."
+
+doctest:
+	$(SPHINXBUILD) -b doctest $(ALLSPHINXOPTS) $(BUILDDIR)/doctest
+	@echo "Testing of doctests in the sources finished, look at the " \
+	      "results in $(BUILDDIR)/doctest/output.txt."
Index: /trunk/workshop-routing-foss4g/docs/README
===================================================================
--- /trunk/workshop-routing-foss4g/docs/README	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/README	(revision 76)
@@ -0,0 +1,20 @@
+# 
+# About:
+# =====
+# The docs directory contains the workshop documentation.
+# Sphinx installed on Ubuntu 10.04
+#
+
+# Install notes:
+# =============
+sudo apt-get install python-sphinx texlive-full
+sphinx-quickstart
+
+# Build Documentation:
+# ===================
+make html
+
+make latex
+cd _build/latex/
+make all-pdf
+
Index: /trunk/workshop-routing-foss4g/docs/_templates/layout.html
===================================================================
--- /trunk/workshop-routing-foss4g/docs/_templates/layout.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/_templates/layout.html	(revision 76)
@@ -0,0 +1,15 @@
+<style>
+	.toctree-wrapper {
+		-webkit-column-count: 2;
+		-moz-column-count: 2;
+		column-count: 2;
+	}
+</style>
+
+{% extends "!layout.html" %}
+{% block sidebarsearch %}
+    {{ super() }}
+    <h3>License</h3>
+    <p style="font-size: 90%; margin-top:2px;">This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-Share Alike 3.0 License</a>.</p>
+    <p style="margin:0;"><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/88x31.png"></a></p>
+{% endblock %}
Index: /trunk/workshop-routing-foss4g/docs/checkout.sh
===================================================================
--- /trunk/workshop-routing-foss4g/docs/checkout.sh	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/checkout.sh	(revision 76)
@@ -0,0 +1,49 @@
+#!/bin/sh
+###############################################################
+# 
+# Purpose: Automated build and update of pgRouting website
+# Authors: Daniel Kastl <daniel@georepublic.de>
+#
+###############################################################
+# Copyright (c) 2010 Georepublic UG
+#
+# Licensed under the GNU LGPL.
+# 
+# This library is free software; you can redistribute it and/or modify it
+# under the terms of the GNU Lesser General Public License as published
+# by the Free Software Foundation, either version 2.1 of the License,
+# or any later version.  This library is distributed in the hope that
+# it will be useful, but WITHOUT ANY WARRANTY, without even the implied
+# warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+# See the GNU Lesser General Public License for more details, either
+# in the "LICENSE.LGPL.txt" file distributed with this software or at
+# web page "http://www.fsf.org/licenses/lgpl.html".
+#
+
+# About:
+# =====
+# This script will run the following tasks
+#       - Update to the latest changes of the workshop repository 
+#       - Build documentation with Sphinx
+#
+# NOTE: This script was written to run on Ubuntu server. 
+#		It requires an existing
+#		clone of pgRouting workshop repository
+
+# Running:
+# =======
+# This script can run as cron job for example
+# ./checkout.sh
+
+REPDIR="/opt/pgrouting/workshop/docs/"
+WEBDIR="/var/www/pgrouting-workshop/"
+
+cd $REPDIR
+
+# Update to latest version
+git pull -q origin
+
+# Create HTML
+sphinx-build -b html -Q $REPDIR $WEBDIR
+
+
Index: /trunk/workshop-routing-foss4g/docs/index.rst
===================================================================
--- /trunk/workshop-routing-foss4g/docs/index.rst	(revision 76)
+++ /trunk/workshop-routing-foss4g/docs/index.rst	(revision 76)
@@ -0,0 +1,28 @@
+.. Travaux pratiques - Routage FOSS4G avec les outils pgRouting, les rÃ©seau routier d'OpenStreetMap et GeoExt documentation master file, crÃ©Ã© par
+   sphinx-quickstart on Sat Jul  3 21:23:22 2010.
+   You can adapt this file completely to your liking, but it should at least
+   contain the root `toctree` directive.
+
+==============================================================================================================
+pgRouting Workshop Manual
+==============================================================================================================
+
+*"Routage FOSS4G avec les outils pgRouting, le rÃ©seau routier d'OpenStreetMap et GeoExt"*, originalement Ã©crit pour les travaux pratiques du `FOSS4G2011 <http://2011.foss4g.org/sessions/foss4g-routing-pgrouting-tools-openstreetmap-road-data-and-geoext>`_.
+
+.. rubric:: Contenu
+
+.. toctree::
+   :numbered:
+   :maxdepth: 2
+
+   chapters/introduction.rst
+   chapters/about.rst
+   chapters/installation.rst
+   chapters/osm2pgrouting.rst
+   chapters/topology.rst
+   chapters/shortest_path.rst
+   chapters/advanced.rst
+   chapters/php_server.rst
+   chapters/geoext_client.rst
+
+
Index: /trunk/workshop-routing-foss4g/web/ext/ext.jsb2
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/ext.jsb2	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/ext.jsb2	(revision 76)
@@ -0,0 +1,1640 @@
+{
+    "projectName": "Ext JS",
+    "deployDir": "ext-3.4+",
+    "licenseText": "Ext JS Library 3.4.0\nCopyright(c) 2006-2011 Sencha Inc.\nlicensing@sencha.com\nhttp://www.sencha.com/license",
+    "pkgs": [{
+        "name": "Ext Base",
+        "file": "adapter/ext/ext-base.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Ext.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "TaskMgr.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "ext-base-begin.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-dom.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-event.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-ajax.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-anim.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-anim-extra.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-end.js",
+            "path": "src/ext-core/src/adapter/"
+        }]
+    },{
+        "name": "YUI Adapter",
+        "file": "adapter/yui/ext-yui-adapter.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Ext.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "TaskMgr.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "yui-bridge.js",
+            "path": "src/adapter/"
+        }]
+    },{
+        "name": "Prototype Adapter",
+        "file": "adapter/prototype/ext-prototype-adapter.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Ext.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "TaskMgr.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "prototype-bridge.js",
+            "path": "src/adapter/"
+        }]
+    },{
+        "name": "jQuery Adapter",
+        "file": "adapter/jquery/ext-jquery-adapter.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Ext.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "TaskMgr.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "jquery-bridge.js",
+            "path": "src/adapter/"
+        }]
+    },{
+        "name": "Ext Core",
+        "file": "pkgs/ext-core.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Observable.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "DomHelper.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Template.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "DomQuery.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "DelayedTask.js",
+            "path": "src/ext-core/src/util/"
+        },{
+            "text": "Element.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.traversal.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.insertion.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.style.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.position.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.scroll.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Element.fx.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Fx.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "CompositeElementLite.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Connection.js",
+            "path": "src/ext-core/src/data/"
+        },{
+            "text": "JSON.js",
+            "path": "src/ext-core/src/util/"
+        },
+        {
+            "text": "EventManager.js",
+            "path": "src/ext-core/src/core/"
+        },{
+            "text": "Loader.js",
+            "path": "src/ext-core/src/core/"
+        }]
+    },{
+        "name": "Ext Foundation",
+        "file": "pkgs/ext-foundation.js",
+        "isDebug": true,
+        "fileIncludes": [{
+            "text": "Ext-more.js",
+            "path": "src/core/"
+        },{
+            "text": "ext-base-dom-more.js",
+            "path": "src/adapter/"
+        },{
+            "text": "ext-base-region.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "ext-base-point.js",
+            "path": "src/ext-core/src/adapter/"
+        },{
+            "text": "DomHelper-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Template-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Function.js",
+            "path": "src/util/"
+        },{
+            "text": "Observable-more.js",
+            "path": "src/util/"
+        },{
+            "text": "EventManager-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.alignment.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.traversal-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.insertion-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.style-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.position-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.scroll-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.fx-more.js",
+            "path": "src/core/"
+        },{
+            "text": "Element.keys.js",
+            "path": "src/core/"
+        },{
+            "text": "CompositeElementLite-more.js",
+            "path": "src/core/"
+        },{
+            "text": "CompositeElement.js",
+            "path": "src/core/"
+        },{
+            "text": "UpdateManager.js",
+            "path": "src/util/"
+        },{
+            "text": "Date.js",
+            "path": "src/util/"
+        },{
+            "text": "MixedCollection.js",
+            "path": "src/util/"
+        },{
+            "text": "AbstractManager.js",
+            "path": "src/util/"
+        },{
+            "text": "Format.js",
+            "path": "src/util/"
+        },{
+            "text": "XTemplate.js",
+            "path": "src/util/"
+        },{
+            "text": "CSS.js",
+            "path": "src/util/"
+        },{
+            "text": "ClickRepeater.js",
+            "path": "src/util/"
+        },{
+            "text": "KeyNav.js",
+            "path": "src/util/"
+        },{
+            "text": "KeyMap.js",
+            "path": "src/util/"
+        },{
+            "text": "TextMetrics.js",
+            "path": "src/util/"
+        },{
+            "text": "Cookies.js",
+            "path": "src/util/"
+        },{
+            "text": "Error.js",
+            "path": "src/core/"
+        }]
+    },{
+        "name": "Drag Drop",
+        "file": "pkgs/ext-dd.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "DDCore.js",
+            "path": "src/dd/"
+        },{
+            "text": "DragTracker.js",
+            "path": "src/dd/"
+        },{
+            "text": "ScrollManager.js",
+            "path": "src/dd/"
+        },{
+            "text": "Registry.js",
+            "path": "src/dd/"
+        },{
+            "text": "StatusProxy.js",
+            "path": "src/dd/"
+        },{
+            "text": "DragSource.js",
+            "path": "src/dd/"
+        },{
+            "text": "DropTarget.js",
+            "path": "src/dd/"
+        },{
+            "text": "DragZone.js",
+            "path": "src/dd/"
+        },{
+            "text": "DropZone.js",
+            "path": "src/dd/"
+        },{
+            "text": "Element.dd.js",
+            "path": "src/core/"
+        }]
+    },{
+        "name": "Data Foundation",
+        "file": "pkgs/data-foundation.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "Api.js",
+            "path": "src/data/"
+        },{
+            "text": "SortTypes.js",
+            "path": "src/data/"
+        },{
+            "text": "Record.js",
+            "path": "src/data/"
+        },{
+            "text": "StoreMgr.js",
+            "path": "src/data/"
+        },{
+            "text": "Store.js",
+            "path": "src/data/"
+        },{
+            "text": "DataField.js",
+            "path": "src/data/"
+        },{
+            "text": "DataReader.js",
+            "path": "src/data/"
+        },{
+            "text": "DataWriter.js",
+            "path": "src/data/"
+        },{
+            "text": "DataProxy.js",
+            "path": "src/data/"
+        },{
+            "text": "Request.js",
+            "path": "src/data/"
+        }, {
+            "text": "Response.js",
+            "path": "src/data/"
+        }, {
+            "text": "ScriptTagProxy.js",
+            "path": "src/data/"
+        },{
+            "text": "HttpProxy.js",
+            "path": "src/data/"
+        },{
+            "text": "MemoryProxy.js",
+            "path": "src/data/"
+        },{
+            "text": "Types.js",
+            "path": "src/data/"
+        }]
+    },{
+        "name": "Data - Json",
+        "file": "pkgs/data-json.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/data-foundation.js"],
+        "fileIncludes": [{
+            "text": "JsonWriter.js",
+            "path": "src/data/"
+        },{
+            "text": "JsonReader.js",
+            "path": "src/data/"
+        },{
+            "text": "ArrayReader.js",
+            "path": "src/data/"
+        },{
+            "text": "ArrayStore.js",
+            "path": "src/data/"
+        },{
+            "text": "JsonStore.js",
+            "path": "src/data/"
+        }]
+    },{
+        "name": "Data - XML",
+        "file": "pkgs/data-xml.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/data-foundation.js"],
+        "fileIncludes": [{
+            "text": "XmlWriter.js",
+            "path": "src/data/"
+        },{
+            "text": "XmlReader.js",
+            "path": "src/data/"
+        },{
+            "text": "XmlStore.js",
+            "path": "src/data/"
+        }]
+    },{
+        "name": "Data - GroupingStore",
+        "file": "pkgs/data-grouping.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/data-foundation.js"],
+        "fileIncludes": [{
+            "text": "GroupingStore.js",
+            "path": "src/data/"
+        }]
+    },{
+        "name": "Direct",
+        "file": "pkgs/direct.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "DirectProxy.js",
+            "path": "src/data/"
+        },{
+            "text": "DirectStore.js",
+            "path": "src/data/"
+        },{
+            "text": "Direct.js",
+            "path": "src/direct/"
+        },{
+            "text": "Transaction.js",
+            "path": "src/direct/"
+        },{
+            "text": "Event.js",
+            "path": "src/direct/"
+        },{
+            "text": "Provider.js",
+            "path": "src/direct/"
+        },{
+            "text": "JsonProvider.js",
+            "path": "src/direct/"
+        },{
+            "text": "PollingProvider.js",
+            "path": "src/direct/"
+        },{
+            "text": "RemotingProvider.js",
+            "path": "src/direct/"
+        }]
+    },{
+        "name": "Component Foundation",
+        "file": "pkgs/cmp-foundation.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "ComponentMgr.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Component.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Action.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Layer.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Shadow.js",
+            "path": "src/widgets/"
+        },{
+            "text": "BoxComponent.js",
+            "path": "src/widgets/"
+        },{
+            "text": "SplitBar.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Container.js",
+            "path": "src/widgets/"
+        },{
+            "text": "ContainerLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "AutoLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "FitLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "CardLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "AnchorLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "ColumnLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "BorderLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "FormLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "AccordionLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "TableLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "AbsoluteLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "BoxLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "MenuOverflow.js",
+            "path": "src/widgets/layout/box/"
+        },{
+            "text": "ScrollerOverflow.js",
+            "path": "src/widgets/layout/box/"
+        },{
+            "text": "HBoxLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "VBoxLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "ToolbarLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "MenuLayout.js",
+            "path": "src/widgets/layout/"
+        },{
+            "text": "Viewport.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Panel.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Editor.js",
+            "path": "src/widgets/"
+        },{
+            "text": "ColorPalette.js",
+            "path": "src/widgets/"
+        },{
+            "text": "DatePicker.js",
+            "path": "src/widgets/"
+        },{
+            "text": "LoadMask.js",
+            "path": "src/widgets/"
+        },{
+            "text": "Slider.js",
+            "path": "src/widgets/"
+        },{
+            "text": "ProgressBar.js",
+            "path": "src/widgets/"
+        }]
+    },{
+        "name": "Window",
+        "file": "pkgs/window.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Window.js",
+            "path": "src/widgets/"
+        },{
+            "text": "WindowManager.js",
+            "path": "src/widgets/"
+        },{
+            "text": "MessageBox.js",
+            "path": "src/widgets/"
+        },{
+            "text": "PanelDD.js",
+            "path": "src/widgets/"
+        }]
+    },{
+        "name": "State",
+        "file": "pkgs/state.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Provider.js",
+            "path": "src/state/"
+        },{
+            "text": "StateManager.js",
+            "path": "src/state/"
+        },{
+            "text": "CookieProvider.js",
+            "path": "src/state/"
+        }]
+    },{
+        "name": "Data and ListViews",
+        "file": "pkgs/data-list-views.js",
+        "isDebug": true,
+        "pkgDeps": ["pkgs/cmp-foundation.js","pkgs/data-foundation.js"],
+        "fileIncludes": [{
+            "text": "DataView.js",
+            "path": "src/widgets/"
+        },{
+            "text": "ListView.js",
+            "path": "src/widgets/list/"
+        },{
+            "text": "Column.js",
+            "path": "src/widgets/list/"
+        },{
+            "text": "ColumnResizer.js",
+            "path": "src/widgets/list/"
+        },{
+            "text": "Sorter.js",
+            "path": "src/widgets/list/"
+        }]
+    },{
+        "name": "Resizable",
+        "file": "pkgs/resizable.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "Resizable.js",
+            "path": "src/widgets/"
+        }]
+
+    },{
+        "name": "TabPanel",
+        "file": "pkgs/pkg-tabs.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "TabPanel.js",
+            "path": "src/widgets/"
+        }]
+    },{
+        "name": "Buttons",
+        "file": "pkgs/pkg-buttons.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Button.js",
+            "path": "src/widgets/"
+        },{
+            "text": "SplitButton.js",
+            "path": "src/widgets/"
+        },{
+            "text": "CycleButton.js",
+            "path": "src/widgets/"
+        }]
+    },{
+        "name": "Toolbars",
+        "file": "pkgs/pkg-toolbars.js",
+        "type": "js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Toolbar.js",
+            "path": "src/widgets/"
+        },{
+            "text": "ButtonGroup.js",
+            "path": "src/widgets/"
+        },{
+            "text": "PagingToolbar.js",
+            "path": "src/widgets/"
+        }]
+    },{
+        "name": "History",
+        "file": "pkgs/pkg-history.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/ext-foundation.js"],
+        "fileIncludes": [{
+            "text": "History.js",
+            "path": "src/util/"
+        }]
+    },{
+        "name": "Tooltips",
+        "file": "pkgs/pkg-tips.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Tip.js",
+            "path": "src/widgets/tips/"
+        },{
+            "text": "ToolTip.js",
+            "path": "src/widgets/tips/"
+        },{
+            "text": "QuickTip.js",
+            "path": "src/widgets/tips/"
+        },{
+            "text": "QuickTips.js",
+            "path": "src/widgets/tips/"
+        },{
+            "text": "SliderTip.js",
+            "path": "src/widgets/tips/"
+        }]
+    },{
+        "name": "Trees",
+        "file": "pkgs/pkg-tree.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "TreePanel.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeEventModel.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeSelectionModel.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "Tree.js",
+            "path": "src/data/"
+        },{
+            "text": "TreeNode.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "AsyncTreeNode.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeNodeUI.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeLoader.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeFilter.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeSorter.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeDropZone.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeDragZone.js",
+            "path": "src/widgets/tree/"
+        },{
+            "text": "TreeEditor.js",
+            "path": "src/widgets/tree/"
+        }]
+    },{
+        "name": "Charts",
+        "file": "pkgs/pkg-charts.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "swfobject.js",
+            "path": "src/widgets/chart/"
+        },{
+            "text": "FlashComponent.js",
+            "path": "src/widgets/chart/"
+        },{
+            "text": "EventProxy.js",
+            "path": "src/widgets/chart/"
+        },{
+            "text": "Chart.js",
+            "path": "src/widgets/chart/"
+        }]
+    },{
+        "name": "Menu",
+        "file": "pkgs/pkg-menu.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Menu.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "MenuMgr.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "BaseItem.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "TextItem.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "Separator.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "Item.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "CheckItem.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "DateMenu.js",
+            "path": "src/widgets/menu/"
+        },{
+            "text": "ColorMenu.js",
+            "path": "src/widgets/menu/"
+        }]
+    },{
+        "name": "Forms",
+        "file": "pkgs/pkg-forms.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "Field.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "TextField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "TriggerField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "TextArea.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "NumberField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "DateField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "DisplayField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Combo.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Checkbox.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "CheckboxGroup.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "CompositeField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Radio.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "RadioGroup.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Hidden.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "BasicForm.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Form.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "FieldSet.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "HtmlEditor.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "TimeField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "SliderField.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Label.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "Action.js",
+            "path": "src/widgets/form/"
+        },{
+            "text": "VTypes.js",
+            "path": "src/widgets/form/"
+        }]
+    },{
+        "name": "Grid Foundation",
+        "file": "pkgs/pkg-grid-foundation.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/cmp-foundation.js"],
+        "fileIncludes": [{
+            "text": "GridPanel.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "PivotGrid.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "GridView.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "PivotGridView.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "PivotAxis.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "ColumnDD.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "ColumnSplitDD.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "GridDD.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "ColumnModel.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "AbstractSelectionModel.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "RowSelectionModel.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "Column.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "RowNumberer.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "CheckboxSelectionModel.js",
+            "path": "src/widgets/grid/"
+        }]
+    },{
+        "name": "Grid Editor",
+        "file": "pkgs/pkg-grid-editor.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/pkg-grid-foundation.js"],
+        "fileIncludes": [{
+            "text": "CellSelectionModel.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "EditorGrid.js",
+            "path": "src/widgets/grid/"
+        },{
+            "text": "GridEditor.js",
+            "path": "src/widgets/grid/"
+        }]
+    },{
+        "name": "Grid - Property Grid",
+        "file": "pkgs/pkg-grid-property.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/pkg-grid-foundation.js"],
+        "fileIncludes": [{
+            "text": "PropertyGrid.js",
+            "path": "src/widgets/grid/"
+        }]
+    },{
+        "name": "Grid - GroupingView",
+        "file": "pkgs/pkg-grid-grouping.js",
+        "isDebug": true,
+        "pkgs": ["pkgs/pkg-grid-foundation.js", "pkgs/data-grouping.js"],
+        "fileIncludes": [{
+            "text": "GroupingView.js",
+            "path": "src/widgets/grid/"
+        }]
+    },{
+        "name": "Ext Core",
+        "file": "ext-core-all.js",
+        "isDebug": true,
+        "includeDeps": true,
+        "pkgDeps": [
+            "adapter/ext/ext-base.js",
+            "pkgs/ext-core.js"
+        ],
+        "fileIncludes": []
+    },{
+        "name": "Ext All No Core",
+        "file": "ext-all-no-core.js",
+        "isDebug": true,
+        "includeDeps": true,
+        "pkgDeps": [
+            "pkgs/ext-foundation.js",
+            "pkgs/cmp-foundation.js",
+            "pkgs/ext-dd.js",
+            "pkgs/data-foundation.js",
+            "pkgs/data-json.js",
+            "pkgs/data-xml.js",
+            "pkgs/data-grouping.js",
+            "pkgs/direct.js",
+            "pkgs/resizable.js",
+            "pkgs/window.js",
+            "pkgs/state.js",
+            "pkgs/data-list-views.js",
+            "pkgs/pkg-tabs.js",
+            "pkgs/pkg-buttons.js",
+            "pkgs/pkg-toolbars.js",
+            "pkgs/pkg-history.js",
+            "pkgs/pkg-tips.js",
+            "pkgs/pkg-tree.js",
+            "pkgs/pkg-charts.js",
+            "pkgs/pkg-menu.js",
+            "pkgs/pkg-forms.js",
+            "pkgs/pkg-grid-foundation.js",
+            "pkgs/pkg-grid-editor.js",
+            "pkgs/pkg-grid-property.js",
+            "pkgs/pkg-grid-grouping.js"
+        ],
+        "fileIncludes": []
+    },{
+        "name": "Ext All",
+        "file": "ext-all.js",
+        "isDebug": true,
+        "includeDeps": true,
+        "pkgDeps": [
+            "pkgs/ext-core.js",
+            "ext-all-no-core.js"
+        ],
+        "fileIncludes": []
+    },
+    {
+        "name": "Calendar",
+        "file": "examples/calendar/calendar-all.js",
+        "isDebug": true,
+        "fileIncludes": [
+            {"path": "examples/calendar/src/",           "text": "Ext.calendar.js"},
+            {"path": "examples/calendar/src/templates/", "text": "DayHeaderTemplate.js"},
+            {"path": "examples/calendar/src/templates/", "text": "DayBodyTemplate.js"},
+            {"path": "examples/calendar/src/templates/", "text": "DayViewTemplate.js"},
+            {"path": "examples/calendar/src/templates/", "text": "BoxLayoutTemplate.js"},
+            {"path": "examples/calendar/src/templates/", "text": "MonthViewTemplate.js"},
+            {"path": "examples/calendar/src/dd/",        "text": "CalendarScrollManager.js"},
+            {"path": "examples/calendar/src/dd/",        "text": "StatusProxy.js"},
+            {"path": "examples/calendar/src/dd/",        "text": "CalendarDD.js"},
+            {"path": "examples/calendar/src/dd/",        "text": "DayViewDD.js"},
+            {"path": "examples/calendar/src/",           "text": "EventRecord.js"},
+            {"path": "examples/calendar/src/views/",     "text": "MonthDayDetailView.js"},
+            {"path": "examples/calendar/src/widgets/",   "text": "CalendarPicker.js"},
+            {"path": "examples/calendar/src/",           "text": "WeekEventRenderer.js"},
+            {"path": "examples/calendar/src/views/",     "text": "CalendarView.js"},
+            {"path": "examples/calendar/src/views/",     "text": "MonthView.js"},
+            {"path": "examples/calendar/src/views/",     "text": "DayHeaderView.js"},
+            {"path": "examples/calendar/src/views/",     "text": "DayBodyView.js"},
+            {"path": "examples/calendar/src/views/",     "text": "DayView.js"},
+            {"path": "examples/calendar/src/views/",     "text": "WeekView.js"},
+            {"path": "examples/calendar/src/widgets/",   "text": "DateRangeField.js"},
+            {"path": "examples/calendar/src/widgets/",   "text": "ReminderField.js"},
+            {"path": "examples/calendar/src/",           "text": "EventEditForm.js"},
+            {"path": "examples/calendar/src/",           "text": "EventEditWindow.js"},
+            {"path": "examples/calendar/src/",           "text": "CalendarPanel.js"}
+        ]
+    },
+    {
+       "name": "User Extension JS Pack",
+       "file": "examples/ux/ux-all.js",
+       "isDebug": true,
+       "fileIncludes": [{
+          "text": "BufferView.js",
+          "path": "examples/ux/"
+       },{
+          "text": "CenterLayout.js",
+          "path": "examples/ux/"
+       },{
+          "text": "CheckColumn.js",
+          "path": "examples/ux/"
+       },{
+          "text": "ColumnHeaderGroup.js",
+          "path": "examples/ux/"
+       },{
+          "text": "ColumnNodeUI.js",
+          "path": "examples/ux/"
+       },{
+          "text": "DataView-more.js",
+          "path": "examples/ux/"
+       },{
+          "text": "FileUploadField.js",
+          "path": "examples/ux/fileuploadfield/"
+       },{
+          "text": "GMapPanel.js",
+          "path": "examples/ux/"
+       },{
+          "text": "GridFilters.js",
+          "path": "examples/ux/gridfilters/"
+       },{
+          "text": "Filter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "BooleanFilter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "DateFilter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "ListFilter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "NumericFilter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "StringFilter.js",
+          "path": "examples/ux/gridfilters/filter/"
+       },{
+          "text": "ListMenu.js",
+          "path": "examples/ux/gridfilters/menu/"
+       },{
+          "text": "RangeMenu.js",
+          "path": "examples/ux/gridfilters/menu/"
+       },{
+          "text": "GroupSummary.js",
+          "path": "examples/ux/"
+       },{
+          "text": "GroupTab.js",
+          "path": "examples/ux/"
+       },{
+          "text": "GroupTabPanel.js",
+          "path": "examples/ux/"
+       },{
+          "text": "ItemSelector.js",
+          "path": "examples/ux/"
+       },{
+          "text": "LockingGridView.js",
+          "path": "examples/ux/"
+       },{
+          "text": "MultiSelect.js",
+          "path": "examples/ux/"
+       },{
+          "text": "PagingMemoryProxy.js",
+          "path": "examples/ux/"
+       },{
+          "text": "PanelResizer.js",
+          "path": "examples/ux/"
+       },{
+          "text": "Portal.js",
+          "path": "examples/ux/"
+       },{
+          "text": "PortalColumn.js",
+          "path": "examples/ux/"
+       },{
+          "text": "Portlet.js",
+          "path": "examples/ux/"
+       },{
+          "text": "ProgressBarPager.js",
+          "path": "examples/ux/"
+       },{
+          "text": "RowEditor.js",
+          "path": "examples/ux/"
+       },{
+          "text": "RowExpander.js",
+          "path": "examples/ux/"
+       },{
+          "text": "RowLayout.js",
+          "path": "examples/ux/"
+       },{
+          "text": "SearchField.js",
+          "path": "examples/ux/"
+       },{
+          "text": "SelectBox.js",
+          "path": "examples/ux/"
+       },{
+          "text": "SlidingPager.js",
+          "path": "examples/ux/"
+       },{
+          "text": "SpinnerField.js",
+          "path": "examples/ux/"
+       },{
+          "text": "Spinner.js",
+          "path": "examples/ux/"
+       },{
+          "text": "Spotlight.js",
+          "path": "examples/ux/"
+       },{
+          "text": "StatusBar.js",
+          "path": "examples/ux/statusbar/"
+       },{
+          "text": "TabCloseMenu.js",
+          "path": "examples/ux/"
+       },{
+          "text": "TableGrid.js",
+          "path": "examples/ux/"
+       },{
+          "text": "TabScrollerMenu.js",
+          "path": "examples/ux/"
+       },{
+          "text": "XmlTreeLoader.js",
+          "path": "examples/ux/"
+       },{
+          "text": "ValidationStatus.js",
+          "path": "examples/ux/statusbar/"
+       }, {
+          "text": "TreeGridColumns.js",
+          "path": "examples/ux/treegrid/"
+       },{
+          "text": "TreeGridNodeUI.js",
+          "path": "examples/ux/treegrid/"
+       },{
+          "text": "TreeGridColumnResizer.js",
+          "path": "examples/ux/treegrid/"
+       },{
+          "text": "TreeGridSorter.js",
+          "path": "examples/ux/treegrid/"
+       },{
+          "text": "TreeGridLoader.js",
+          "path": "examples/ux/treegrid/"
+       },{
+          "text": "TreeGrid.js",
+          "path": "examples/ux/treegrid/"
+       }]
+    },{
+       "name": "User Extension CSS Pack",
+       "file": "examples/ux/css/ux-all.css",
+       "fileIncludes": [{
+          "text": "CenterLayout.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "ColumnHeaderGroup.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "ColumnNodeUI.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "fileuploadfield.css",
+          "path": "examples/ux/fileuploadfield/css/"
+       },{
+          "text": "GridFilters.css",
+          "path": "examples/ux/gridfilters/css/"
+       },{
+          "text": "RangeMenu.css",
+          "path": "examples/ux/gridfilters/css/"
+       },{
+          "text": "GroupSummary.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "GroupTab.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "LockingGridView.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "MultiSelect.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "PanelResizer.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "Portal.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "RowEditor.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "Spinner.css",
+          "path": "examples/ux/css/"
+       },{
+          "text": "statusbar.css",
+          "path": "examples/ux/statusbar/css/"
+       },{
+          "text": "treegrid.css",
+          "path": "examples/ux/treegrid/"
+       }]
+    },{
+       "name": "Ext All CSS",
+       "file": "resources/css/ext-all.css",
+       "fileIncludes": [],
+       "includeDeps": true,
+       "pkgDeps": [
+           "resources/css/ext-all-notheme.css",
+           "resources/css/xtheme-blue.css"
+       ]
+    },{
+       "name": "Ext All CSS No theme",
+       "file": "resources/css/ext-all-notheme.css",
+       "fileIncludes": [{
+           "text": "reset.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "core.css",
+           "path": "resources/css/structure/"
+       },{
+            "text": "resizable.css",
+            "path": "resources/css/structure/"
+       },{
+           "text": "tabs.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "form.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "button.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "toolbar.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "grid.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "pivotgrid.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "dd.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "tree.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "date-picker.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "qtips.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "menu.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "box.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "combo.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "panel.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "panel-reset.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "window.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "editor.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "borders.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "layout.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "progress.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "list-view.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "slider.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "dialog.css",
+           "path": "resources/css/structure/"
+       }]
+    },{
+       "name": "Ext Blue Theme",
+       "file": "resources/css/xtheme-blue.css",
+       "fileIncludes": [{
+           "text": "core.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "tabs.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "form.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "button.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "toolbar.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "resizable.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "grid.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "pivotgrid.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "dd.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "tree.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "date-picker.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "qtips.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "menu.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "box.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "combo.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "panel.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "window.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "editor.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "borders.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "layout.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "progress.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "list-view.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "slider.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "dialog.css",
+           "path": "resources/css/visual/"
+       }]
+    },{
+       "name": "Your Theme",
+       "file": "resources/css/yourtheme.css",
+       "fileIncludes": [{
+           "text": "core.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "tabs.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "form.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "button.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "toolbar.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "resizable.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "grid.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "dd.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "tree.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "date-picker.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "qtips.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "menu.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "box.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "combo.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "panel.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "window.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "editor.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "borders.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "layout.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "progress.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "list-view.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "slider.css",
+           "path": "resources/css/visual/"
+       },{
+           "text": "dialog.css",
+           "path": "resources/css/visual/"
+       }]
+    },{
+       "name": "Ext Gray Theme",
+       "file": "resources/css/xtheme-gray.css",
+       "fileIncludes": [{
+           "text": "core.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "tabs.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "form.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "button.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "toolbar.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "resizable.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "grid.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "pivotgrid.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "dd.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "tree.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "date-picker.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "qtips.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "menu.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "box.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "combo.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "panel.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "window.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "editor.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "borders.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "layout.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "progress.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "list-view.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "slider.css",
+           "path": "resources/css/theme-gray/"
+       },{
+           "text": "dialog.css",
+           "path": "resources/css/theme-gray/"
+       }]
+    },{
+       "name": "Ext Accessibility Theme",
+       "file": "resources/css/xtheme-access.css",
+       "fileIncludes": [{
+           "text": "core.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "tabs.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "form.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "button.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "toolbar.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "resizable.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "grid.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "dd.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "tree.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "date-picker.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "qtips.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "menu.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "box.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "combo.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "panel.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "window.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "editor.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "borders.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "layout.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "progress.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "list-view.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "slider.css",
+           "path": "resources/css/theme-access/"
+       },{
+           "text": "dialog.css",
+           "path": "resources/css/theme-access/"
+       }]
+    },{
+       "name": "Ext Debug CSS",
+       "file": "resources/css/debug.css",
+       "fileIncludes": [{
+           "text": "debug.css",
+           "path": "resources/css/structure/"
+       },{
+           "text": "debug.css",
+           "path": "resources/css/visual/"
+        }]
+    }],
+    "resources": [{
+        "src": "src/",
+        "dest": "src/",
+        "filters": ".*\\.js"
+    },{
+        "src": "examples/",
+        "dest": "examples/",
+        "filters": ".*[\\.html|\\.jpg|\\.png|\\.gif|\\.css|\\.js|\\.php]"
+    },{
+        "src": "test/",
+        "dest": "test/",
+        "filters": ".*[\\.js]"
+    },{
+        "src": "welcome/",
+        "dest": "welcome/",
+        "filters": ".*"
+    },{
+        "src": "index.html",
+        "dest": "index.html",
+        "filters": ".*"
+    },{
+        "src": "resources/",
+        "dest": "resources/",
+        "filters": ".*"
+    },{
+        "src": "release-notes.html",
+        "dest": "release-notes.html",
+        "filters": ".*"
+    },{
+        "src": "license.txt",
+        "dest": "license.txt",
+        "filters": ".*"
+    },{
+        "src": "gpl-3.0.txt",
+        "dest": "gpl-3.0.txt",
+        "filters": ".*"
+    },{
+        "src": "INCLUDE_ORDER.txt",
+        "dest": "INCLUDE_ORDER.txt",
+        "filters": ".*"
+    },{
+        "src": "ext.jsb2",
+        "dest": "ext.jsb2",
+        "filters": ".*"
+    }]
+}
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/Template.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/Template.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/Template.js	(revision 76)
@@ -0,0 +1,179 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest( 'Ext', {
+
+    name: 'Template',
+
+    planned: 22,
+
+    setUp: function() {
+        this.es = [];
+    },
+
+    tearDown: function() {
+        Ext.each( this.es, function( el ) {
+            if ( el instanceof Ext.Element ) {
+                el.remove();
+            } else {
+                Ext.removeNode( el );
+            }
+        });
+        this.es.length = 0;
+    }, 
+
+    // 3
+    test_from: function() {
+        var id = Ext.id();
+        var el = Ext.getBody().createChild({
+            tag: 'textarea',
+            cls: 'x-hidden',
+            id: id,
+            html: '{0} {1}'
+        });
+        this.es.push( el );
+        var tpl1 = Ext.Template.from( el, { complied: true } );
+        var tpl2 = Ext.Template.from( el.dom, { complied: true } );
+        var tpl3 = Ext.Template.from( id, { complied: true } );
+        Y.Assert.areEqual( 'Hello World', tpl1.apply( [ 'Hello', 'World' ] ), 'Test template compiled from textarea value (using Ext.element)' );
+        Y.Assert.areEqual( 'Hello World', tpl2.apply( [ 'Hello', 'World' ] ), 'Test template compiled from textarea value (using Html element)' );
+        Y.Assert.areEqual( 'Hello World', tpl3.apply( [ 'Hello', 'World' ] ), 'Test template compiled from textarea value (using element id)' );
+    },
+
+    // 5
+    test_append: function() {
+        var container = Ext.getBody().createChild({
+            tag: 'div',
+            cls: 'x-hidden'
+        });
+        this.es.push( container );
+        var div = container.createChild({
+            tag: 'div',
+            html: 'foobar'
+        });
+        var tpl = new Ext.Template( '<div>{0} {1}</div>', {
+            compiled: true,
+            disableFormats: true
+        });
+
+        var newel = tpl.append( container, [ 'Hello', 'World' ] );
+        Y.Assert.areEqual( 'Hello World', newel.innerHTML, 'Test if the new element\'s innerHTML matches the template' );
+        Y.Assert.areSame( newel, div.dom.nextSibling, 'Test if nextSibling is the created element' );
+        Y.Assert.areSame( newel, container.dom.lastChild, 'Test if container\'s lastChild is the created element' );
+        Y.Assert.areEqual( 'Hello World', div.dom.nextSibling.innerHTML, 'Test if nextSibling\'s innerHTML is from the template' );
+        Y.Assert.areEqual( 'Hello World', container.dom.lastChild.innerHTML, 'Test if the container\'s firstChild innerHTML is from the template' );
+    },
+
+    // 3
+    test_apply: function() {
+        var tpl1 = new Ext.Template( '{0}{hello} {1}{world}. How are you {2}{name}?', {
+            compiled: true,
+            disableFormats: true
+        });
+        var tpl2 = new Ext.Template( '{hello} {world}. How are you {name:ellipsis(8)}?', {
+            compiled: true
+        });
+        Y.Assert.areEqual( 'Hello World. How are you TestyMcTester?', tpl1.apply( [ 'Hello', 'World', 'TestyMcTester' ] ), 'Test apply with an array, no formats' );
+        Y.Assert.areEqual( 'Hello World. How are you TestyMcTester?', tpl1.apply( { hello: 'Hello', world: 'World', name: 'TestyMcTester' } ), 'Test apply with an object, no formats' );
+        Y.Assert.areEqual( 'Hello World. How are you Testy...?', tpl2.apply( { hello: 'Hello', world: 'World', name: 'TestyMcTester' } ), 'Test apply with an object, with formats' );
+    },
+
+    // apply is an alias for applyTemplate
+
+    // 3
+    test_insertAfter: function() {
+        var container = Ext.getBody().createChild({
+            tag: 'div',
+            cls: 'x-hidden'
+        });
+        this.es.push( container );
+        var div = container.createChild({
+            tag: 'div',
+            html: 'foobar'
+        });
+        var tpl = new Ext.Template( '<div>{0} {1}</div>', {
+            compiled: true,
+            disableFormats: true
+        });
+
+        var newel = tpl.insertAfter( div, [ 'Hello', 'World' ] );
+        Y.Assert.areEqual( 'Hello World', newel.innerHTML, 'Test if the new element\'s innerHTML matches the template' );
+        Y.Assert.areSame( newel, div.dom.nextSibling, 'Test if nextSibling is the created element' );
+        Y.Assert.areEqual( 'Hello World', div.dom.nextSibling.innerHTML, 'Test if nextSibling\'s innerHTML is from the template' );
+    },
+    
+    // 3
+    test_insertBefore: function() {
+        var container = Ext.getBody().createChild({
+            tag: 'div',
+            cls: 'x-hidden'
+        });
+        this.es.push( container );
+        var div = container.createChild({
+            tag: 'div',
+            html: 'foobar'
+        });
+        var tpl = new Ext.Template( '<div>{0} {1}</div>', {
+            compiled: true,
+            disableFormats: true
+        });
+
+        var newel = tpl.insertBefore( div, [ 'Hello', 'World' ] );
+        Y.Assert.areEqual( 'Hello World', newel.innerHTML, 'Test if the new element\'s innerHTML matches the template' );
+        Y.Assert.areSame( newel, container.dom.firstChild, 'Test if the container\'s firstChild is the created element' );
+        Y.Assert.areEqual( 'Hello World', container.dom.firstChild.innerHTML, 'Test if the container\s firstChild innerHTML is from the template' );
+    },
+    
+    // 3
+    test_insertFirst: function() {
+        var container = Ext.getBody().createChild({
+            tag: 'div',
+            cls: 'x-hidden'
+        });
+        this.es.push( container );
+        container.createChild({
+            tag: 'div',
+            html: 'foobar'
+        });
+        var tpl = new Ext.Template( '<div>{0} {1}</div>', {
+            compiled: true,
+            disableFormats: true
+        });
+
+        var newel = tpl.insertFirst( container, [ 'Hello', 'World' ] );
+        Y.Assert.areEqual( 'Hello World', newel.innerHTML, 'Test if the new element\'s innerHTML matches the template' );
+        Y.Assert.areSame( newel, container.dom.firstChild, 'Test if the container\'s firstChild is the created element' );
+        Y.Assert.areEqual( 'Hello World', container.dom.firstChild.innerHTML, 'Test if the container\s firstChild innerHTML is from the template' );
+    },
+
+    // 1
+    test_overwrite: function() {
+        var container = Ext.getBody().createChild({
+            tag: 'div',
+            cls: 'x-hidden'
+        });
+        this.es.push( container );
+        container.createChild({
+            tag: 'div',
+            html: 'foobar'
+        });
+        var tpl = new Ext.Template( '{0} {1}', {
+            compiled: true,
+            disableFormats: true
+        });
+
+        var newel = tpl.overwrite( container, [ 'Hello', 'World' ] );
+        Y.Assert.areEqual( 'Hello World', container.dom.innerHTML, 'Test if the container innerHTML matches the template' );
+    },
+
+    // 1
+    test_set: function() {
+        var foo = new Ext.Template( '{1}{0}' );
+        foo.set( '{0}{1}', true );
+        Y.Assert.areEqual( 'foobar', foo.apply( [ 'foo', 'bar' ] ), 'Test recompiled template using set' );
+    }
+
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/XTemplate.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/XTemplate.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext/XTemplate.js	(revision 76)
@@ -0,0 +1,77 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+
+Ext.test.session.addTest( 'Ext', new Y.Test.Case({
+
+    name: 'XTemplate',
+
+    planned: 3,
+
+    // 3
+    test_apply: function() {
+        var data = {
+            hello: 'Hello',
+            world: 'World',
+            items1: [
+                'test1',
+                'test2',
+                'test3'
+            ],
+            items2: [
+                { name: 'test1' },
+                { name: 'test2' },
+                { name: 'test3' }
+            ],
+            kids: [{
+                name: 'Sara Grace',
+                gender: 'f',
+                age:3
+            },{
+                name: 'Zachary',
+                gender: 'm',
+                age:2
+            },{
+                name: 'John James',
+                gender: 'm',
+                age:.5
+            }]
+        };
+        var tpl1 = new Ext.XTemplate( '{hello} {world}. <tpl for="items1">{.}{[ xindex === xcount ? "" : ":" ]}</tpl>', { compiled: true });
+        Y.Assert.areEqual( 'Hello World. test1:test2:test3', tpl1.apply( data ), 'Test apply with an object with an array' );
+
+        var tpl2 = new Ext.XTemplate( '<tpl for="items2">{name}{[ xindex === xcount ? "" : ":" ]}</tpl>', { compiled: true });
+        Y.Assert.areEqual( 'test1:test2:test3', tpl2.apply( data ), 'Test apply with an object with an array of hashes' );
+        
+        var tpl3 = new Ext.XTemplate(
+            '<ul><tpl for="kids">',
+                '<tpl if="this.isGirl(gender)">',
+                    '<li>Girl: {name} - {age}</li>',
+                '</tpl>',
+                '<tpl if="!this.isGirl(gender)">',
+                    '<tpl if="age &lt; 1">',
+                        '<li>Baby Boy: {name} - {age*12} months</li>',
+                    '</tpl>',
+                    '<tpl if="age &gt;= 1">',
+                        '<li>Boy: {name} - {age}</li>',
+                    '</tpl>',
+                '</tpl>',
+            '</tpl></ul>',
+            {
+                compiled: true,
+                disableFormats: true,
+                isGirl: function(gender){
+                    return gender == 'f';
+                }
+            }
+        );
+        Y.Assert.areEqual( '<ul><li>Girl: Sara Grace - 3</li><li>Boy: Zachary - 2</li><li>Baby Boy: John James - 6 months</li></ul>',
+            tpl3.apply( data ), 'Test apply with template member functions, basic comparison operators, and math' );
+    }
+
+    // apply is an alias for applyTemplate
+
+}));
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Function.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Function.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Function.js	(revision 76)
@@ -0,0 +1,145 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Function', {
+
+    name: 'Global Function Decorators',
+    
+    planned: 71,
+    
+    // 3
+    test_createCallback: function(){
+        var fn = function(a, b){
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            return 'x';
+        };
+        
+        var cb = fn.createCallback('a', 'b'),
+            rt = cb(); // does not accept params
+        Y.Assert.areEqual('x', rt, 'Test return value of callback');
+    },
+    
+    // 24
+    test_createDelegate: function(){
+        var scope = {
+            foo: 'bar'
+        };
+        
+        var fn = function(a, b, c){
+            Y.Assert.areEqual(scope, this, 'Test if "this" is correct');
+            Y.Assert.areEqual('bar', this.foo, 'Test if property matches');
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            Y.Assert.areEqual('c', c, 'Test passed param');
+            return 'x';
+        };
+        
+        var cb = fn.createDelegate(scope, ['b', 'c'], true /* appendArgs: true appends these to passed params */),
+            rt = cb('a'); // a b c
+        Y.Assert.areEqual('x', rt, 'Test return value');
+        
+        
+        var cbTwo = fn.createDelegate(scope, ['a', 'b'], 0);
+        rt = cbTwo('c'); // a b c
+        Y.Assert.areEqual('x', rt, 'Test return value');
+        
+        
+        var cbThree = fn.createDelegate(scope, ['b'], 1 /* this replaces at pos 1 */);
+        rt = cbThree('a', 'c'); // a b c
+        Y.Assert.areEqual('x', rt, 'Test return value');
+        
+        var cbFour = fn.createDelegate(scope, ['a', 'b', 'c']);
+        rt = cbFour('x', 'y'); // overridden with a b c
+        Y.Assert.areEqual('x', rt, 'Test return value');
+    },
+    
+    // 19
+    test_createInterceptor: function(){
+        var scope = {
+            foo: 'bar',
+            n: 0
+        };
+        
+        var fn = function(a, b){
+            Y.Assert.areEqual(scope, this, 'Test if "this" is correct');
+            Y.Assert.areEqual('bar', this.foo, 'Test if property matches');
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            this.n++;
+            return 'x';
+        };
+        
+        // normal
+        var rt = fn.call(scope, 'a', 'b'); // n 1
+        Y.Assert.areEqual('x', rt, 'Test the return value');
+        
+        var cb = fn.createDelegate(scope).createInterceptor(function(a, b, z){
+            Y.Assert.areEqual(scope, this, 'Test if "this" is correct');
+            Y.Assert.areEqual('bar', this.foo, 'Test if property matches');
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            return z === undefined;
+        }, scope);
+        // intercepted, but allowed to continue
+        rt = cb('a', 'b'); // n 2
+        Y.Assert.areEqual('x', rt, 'Test the return value');
+        
+        // intercepted, and cancelled
+        cb('a', 'b', 'z');
+        Y.Assert.areEqual(2, scope.n, 'Test the interceptor call count');
+    },
+    
+    // 16
+    test_createSequence: function(){
+        var scope = {
+            foo: 'bar',
+            seq: 0
+        };
+        
+        var fn = function(a, b){
+            Y.Assert.areEqual(scope, this, 'Test if "this" is correct');
+            Y.Assert.areEqual('bar', this.foo, 'Test if property matches');
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            this.seq++;
+            return 'x';
+        };
+        
+        var rt = fn.call(scope, 'a', 'b'); // seq 1
+        Y.Assert.areEqual('x', rt, 'Test the return value');
+        Y.Assert.areEqual(1, scope.seq, 'Test the counter');
+        
+        var cb = fn.createDelegate(scope).createSequence(fn, scope);
+        rt = cb('a', 'b'); // seq 2, 3
+        Y.Assert.areEqual('x', rt, 'Test the return value');
+        Y.Assert.areEqual(3, scope.seq, 'Test the number of times the sequence was called');
+    },
+    
+    // 9
+    test_defer: function(){
+        var scope = {
+            foo: 'bar',
+            n: 0
+        };
+        
+        var fn = function(a, b){
+            Y.Assert.areEqual(scope, this, 'Test if "this" is correct');
+            Y.Assert.areEqual('bar', this.foo, 'Test if property matches');
+            Y.Assert.areEqual('a', a, 'Test passed param');
+            Y.Assert.areEqual('b', b, 'Test passed param');
+            this.n++;
+        };
+        
+        fn.defer(1, scope, ['a', 'b']);
+        fn.defer(2, scope, ['a', 'b']);
+        
+        setTimeout(function(){
+            Y.Assert.areEqual(2, scope.n, 'Test if the counter matches the call timer count');
+        }, 4);
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/String.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/String.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/String.js	(revision 76)
@@ -0,0 +1,64 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('String', {
+
+    name: 'Global String Decorators',
+    
+    planned: 30,
+    
+    // 5
+    test_escape: function(){
+        Y.Assert.areEqual('', String.escape(''), 'Test with an empty string');
+        Y.Assert.areEqual('foo', String.escape('foo'), 'Test with an non-empty string, no escape characters');
+        Y.Assert.areEqual('\\\\', String.escape('\\'), 'Test with a string with a single \\');
+        Y.Assert.areEqual('\\\'', String.escape('\''), 'Test with a string with a single \'');
+        Y.Assert.areEqual('\\\'foo\\\\', String.escape('\'foo\\'), 'Test with a mix of escape and non escape characters');
+    },
+    
+    
+    // 6
+    test_format: function(){
+        Y.Assert.areEqual('foo', String.format('foo'), 'Test with no format parameters, no function parameters');
+        Y.Assert.areEqual('foo', String.format('foo', 'x'), 'Test with no format parameters, 1 argument parameter');
+        Y.Assert.areEqual('foo', String.format('{0}', 'foo'), 'Test with only a format parameter');
+        Y.Assert.areEqual('xyz', String.format('{0}{1}{2}', 'x', 'y', 'z'), 'Test with several format parameters');
+        Y.Assert.areEqual('xy', String.format('{0}{1}', 'x', 'y', 'z'), 'Test with several format parameters, extra format parameters');
+        Y.Assert.areEqual('xfooy', String.format('{0}foo{1}', 'x', 'y'), 'Test with a mix of a string and format parameters');
+    },
+    
+    // 7
+    test_leftPad: function(){
+        Y.Assert.areEqual('     ', String.leftPad('', 5), 'Test with empty string');
+        Y.Assert.areEqual('  foo', String.leftPad('foo', 5), 'Test with string smaller than the padding size');
+        Y.Assert.areEqual('foofoo', String.leftPad('foofoo', 5), 'Test with string bigger than the padding size');
+        Y.Assert.areEqual('foo', String.leftPad('foo', 0), 'Test with a padding size of 0');
+        Y.Assert.areEqual('foo', String.leftPad('foo', -5), 'Test with a padding size of less than 0');
+        Y.Assert.areEqual('00000', String.leftPad('', 5, '0'), 'Test with empty string, different padding character');
+        Y.Assert.areEqual('00foo', String.leftPad('foo', 5, '0'), 'Test with string smaller than the padding size, different padding character');
+    },
+    
+    // 2
+    test_toggle: function(){
+        Y.Assert.areEqual('foo', 'baz'.toggle('foo', 'bar'), 'Test with a starting string that doesn\'t match either');
+        Y.Assert.areEqual('bar', 'foo'.toggle('foo', 'bar'), 'Test with a starting string that doesn\'t match either');
+    },
+    
+    // 10
+    test_trim: function(){
+        Y.Assert.areEqual('', ''.trim(), 'Test with empty string');
+        Y.Assert.areEqual('foo', 'foo'.trim(), 'Test with string with no whitespace');
+        Y.Assert.areEqual('', '    '.trim(), 'Test with string with only whitespace');
+        Y.Assert.areEqual('bar', '  bar  '.trim(), 'Test with string with leading and trailing whitespace');
+        Y.Assert.areEqual('foo', 'foo   '.trim(), 'Test with only trailing spaces');
+        Y.Assert.areEqual('bar', '   bar'.trim(), 'Test with only leading spaces');
+        Y.Assert.areEqual('foo bar', 'foo bar'.trim(), 'Test with spaces in between words');
+        Y.Assert.areEqual('foo bar baz', '  foo bar baz   '.trim(), 'Test with mixtures of different spaces');
+        Y.Assert.areEqual('foo', '\tfoo'.trim(), 'Test with tabs, as opposed to spaces');
+        Y.Assert.areEqual('text', '\ttext    '.trim(), 'Test with mixture of spaces and tabs');
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Number.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Number.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Number.js	(revision 76)
@@ -0,0 +1,35 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Number', {
+
+    name: 'Global Number Decorators',
+    
+    planned: 15,
+    
+    // 15
+    test_constrain: function(){
+        Y.Assert.areEqual(1, (1).constrain(1, 1), 'Test where the number being constrained is equal to both the min and the max');
+        Y.Assert.areEqual(5, (5).constrain(1, 5), 'Test where the number being constrained is equal to the max');
+        Y.Assert.areEqual(3, (3).constrain(3, 5), 'Test where the number being constrained is equal to the min');
+        
+        Y.Assert.areEqual(3, (3).constrain(1, 5), 'Test with an integer within the constraints');
+        Y.Assert.areEqual(-3, (-3).constrain(-5, -1), 'Test with a negative integer within the constraints');
+        Y.Assert.areEqual(3.3, (3.3).constrain(3.1, 3.5), 'Test with a float within the constraints');
+        Y.Assert.areEqual(-3.3, (-3.3).constrain(-3.5, -3.1), 'Test with a negative float within the constraints');
+        
+        Y.Assert.areEqual(5, (100).constrain(1, 5), 'Test with an integer over the maximum of the constraint');
+        Y.Assert.areEqual(3, (1).constrain(3, 5), 'Test with an integer under the maximum of the constraint');
+        Y.Assert.areEqual(-50, (-5).constrain(-100, -50), 'Test with a negative integer over the maximum of the constraint');
+        Y.Assert.areEqual(-5, (-100).constrain(-5, -3), 'Test with a negative integer under the maximum of the constraint');
+        
+        Y.Assert.areEqual(4.1, (6.7).constrain(3.1, 4.1), 'Test with a float over the maximum of the constraint');
+        Y.Assert.areEqual(6.7, (3.1).constrain(6.7, 12.4), 'Test with a float under the maximum of the constraint');
+        Y.Assert.areEqual(-50.5, (-3.1).constrain(-100.5, -50.5), 'Test with a negative float over the maximum of the constraint');
+        Y.Assert.areEqual(-5.4, (-100.7).constrain(-5.4, -3.1), 'Test with a negative float under the maximum of the constraint');
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/BasicForm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/BasicForm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/BasicForm.js	(revision 76)
@@ -0,0 +1,433 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.form.BasicForm'),
+        assert = Y.Assert;
+    
+    function buildForm(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            
+        });
+        
+        return new Ext.form.BasicForm(null, config);
+    };
+    
+    var itemIdCount = 0;
+    //creates a duck object simulating a form field
+    function buildFormItem(options) {
+        itemIdCount ++;
+        
+        options = options || {};
+              
+        Ext.applyIf(options, {
+            valid: true,
+            dirty: false,
+            id   : itemIdCount
+        });
+        
+        return (function(itemId, config) {
+            return Ext.apply(config || {}, {
+                isFormField: true,
+                itemId     : itemId,
+
+                getName: function() {
+                    return config.name || config.id;
+                },
+
+                getItemId: function() {
+                    return itemId;
+                },
+
+                validate: function() {
+                    return config.valid;
+                },
+
+                isDirty: function() {
+                    return config.dirty;
+                },
+                
+                setValue: function() {
+                    return true;
+                }
+            });
+        })(itemIdCount, options);
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'initialization with an element',
+        
+        setUp: function() {
+            //create a fake form element to test that initEl is called
+            this.el = Ext.getBody().createChild({tag: 'form'});
+        },
+        
+        tearDown: function() {
+            Ext.destroy(this.el);
+        },
+        
+        testItemsCreated: function() {
+            var form = buildForm();
+            
+            assert.isTrue(form.items instanceof Ext.util.MixedCollection);
+        },
+        
+        testInitsEl: function() {
+            var BasicForm = Ext.form.BasicForm,
+                proto     = BasicForm.prototype;
+            
+            var wasCalled = false,
+                oldInitEl = proto.initEl;
+            
+            proto.initEl = function() {
+                wasCalled = true;
+            };
+            
+            var form = new BasicForm(this.el, {});
+            
+            assert.isTrue(wasCalled);
+            
+            //cleanup
+            proto.initEl = oldInitEl;
+        },
+        
+        testGetEL: function() {
+            var form = new Ext.form.BasicForm(this.el, {});
+            
+            assert.areEqual(this.el, form.getEl());
+        },
+        
+        testGetsFormClass: function() {
+            var form = new Ext.form.BasicForm(this.el, {});
+            
+            assert.isTrue(this.el.hasClass('x-form'));
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'validations',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.validItem   = buildFormItem({valid: true});
+            this.invalidItem = buildFormItem({valid: false});
+        },
+        
+        testAllValid: function() {
+            this.form.add(this.validItem);
+            
+            assert.isTrue(this.form.isValid());
+        },
+        
+        testSomeInvalid: function() {
+            this.form.add(this.validItem, this.invalidItem);
+            
+            assert.isFalse(this.form.isValid());
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'dirtiness',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.cleanItem = buildFormItem({dirty: false});
+            this.dirtyItem = buildFormItem({dirty: true});
+        },
+        
+        testAllClean: function() {
+            this.form.add(this.cleanItem);
+            
+            assert.isFalse(this.form.isDirty());
+        },
+        
+        testSomeDirty: function() {
+            this.form.add(this.cleanItem, this.dirtyItem);
+            
+            assert.isTrue(this.form.isDirty());
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'performing actions'
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'submission'
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'loading, resetting and updating records',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.item1 = buildFormItem({id: 'name'});
+            this.item2 = buildFormItem({id: 'email'});
+            this.item3 = buildFormItem({id: 'phone'});
+            
+            this.form.add(this.item1, this.item2, this.item3);
+        },
+        
+        testReset: function() {
+            var resetCount = 0;
+            var reset = function() {
+                resetCount ++;
+            };
+            
+            this.item1.reset = reset;
+            this.item2.reset = reset;
+            this.item3.reset = reset;
+            
+            this.form.reset();
+            assert.areEqual(3, resetCount);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'finding fields',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.item1 = buildFormItem({id: 'name', dataIndex: 'someDataIndex'});
+            this.item2 = buildFormItem({id: 'email'});
+            this.item3 = buildFormItem({id: 'phone', name: 'phone number'});
+            
+            this.form.add(this.item1, this.item2, this.item3);
+        },
+        
+        testfindByItemId: function() {
+            assert.areEqual(this.item3, this.form.findField(this.item3.itemId));
+        },
+        
+        testFindById: function() {
+            assert.areEqual(this.item2, this.form.findField('email'));
+        },
+        
+        testFindByDataIndex: function() {
+            assert.areEqual(this.item1, this.form.findField('someDataIndex'));
+        },
+        
+        testFindByName: function() {
+            assert.areEqual(this.item3, this.form.findField('phone number'));
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'marking invalid',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.item1 = buildFormItem({id: 'name'});
+            this.item2 = buildFormItem({id: 'email'});
+            this.item3 = buildFormItem({id: 'phone'});
+            
+            this.form.add(this.item1, this.item2, this.item3);
+        },
+        
+        testMarkInvalidWithObject: function() {
+            var wasCalled = false, message;
+            
+            this.item1.markInvalid = function(msg) {
+                wasCalled = true;
+                message = msg;
+            };
+            
+            this.form.markInvalid({
+                name: 'is a bad name'
+            });
+            
+            assert.isTrue(wasCalled);
+            assert.areEqual('is a bad name', message);
+        },
+        
+        testMarkInvalidWithArray: function() {
+            var wasCalled = false, message;
+            
+            this.item2.markInvalid = function(msg) {
+                wasCalled = true;
+                message = msg;
+            };
+            
+            this.form.markInvalid([{id: 'email', msg: 'is the wrong format'}]);
+            
+            assert.isTrue(wasCalled);
+            assert.areEqual('is the wrong format', message);
+        },
+        
+        testClearInvalid: function() {
+            var clearCount = 0;
+            var clearInvalid = function() {
+                clearCount ++;
+            };
+            
+            this.item1.clearInvalid = clearInvalid;
+            this.item2.clearInvalid = clearInvalid;
+            this.item3.clearInvalid = clearInvalid;
+            
+            this.form.clearInvalid();
+            assert.areEqual(3, clearCount);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'setting values',
+        
+        setUp: function() {
+            this.form = buildForm({
+                trackResetOnLoad: true
+            });
+            
+            this.item1 = buildFormItem({name: 'name',  getValue: function() {return 'ed'; }});
+            this.item2 = buildFormItem({name: 'email'});
+            this.item3 = buildFormItem({name: 'phone', getValue: function() {return '333';}});
+            
+            this.form.add(this.item1, this.item2, this.item3);
+        },
+        
+        testSetByObject: function() {
+            var called = false, value;
+            
+            this.item1.setValue = function(val) {
+                wasCalled = true;
+                value = val;
+            };
+            
+            this.form.setValues({name: 'my name'});
+            
+            assert.isTrue(wasCalled);
+            assert.areEqual('my name', value);
+        },
+        
+        testSetByArray: function() {
+            var called = false, value;
+            
+            this.item1.setValue = function(val) {
+                wasCalled = true;
+                value = val;
+            };
+            
+            this.form.setValues([{id: 'name', value: 'my name'}]);
+            
+            assert.isTrue(wasCalled);
+            assert.areEqual('my name', value); 
+        },
+        
+        testSavesOriginalValue: function() {
+            this.form.setValues({'phone': '444'});
+            
+            assert.areEqual('333', this.item3.originalValue);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'getting values',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.item1 = buildFormItem({name: 'name',  getValue: function() {return 'Edward';}});
+            this.item2 = buildFormItem({name: 'email', getValue: function() {return 'ed@extjs.com';}});
+            this.item3 = buildFormItem({name: 'phone', getValue: function() {return '333';}});
+            
+            this.form.add(this.item1, this.item2, this.item3);
+        },
+        
+        testGetFieldValues: function() {
+            var values = this.form.getFieldValues();
+            
+            assert.areEqual('Edward', values.name);
+            assert.areEqual('ed@extjs.com', values.email);
+            assert.areEqual('333', values.phone);
+        },
+        
+        testGetFieldValuesWithArray: function() {
+            //adding a second item with the same name should result in an array being returned
+            this.item4 = buildFormItem({
+                name    : 'name',
+                getValue: function() {return 200;}
+            });
+            
+            this.form.add(this.item4);
+            
+            var values = this.form.getFieldValues();
+            
+            assert.areEqual(2,        values.name.length);
+            assert.areEqual('Edward', values.name[0]);
+            assert.areEqual(200,      values.name[1]);
+        },
+        
+        testGetDirtyFieldValues: function() {
+            this.item1.isDirty = function() {return true;};
+            
+            var values = this.form.getFieldValues(true);
+            
+            assert.areEqual('Edward', values.name);
+            assert.isUndefined(values.email);
+            assert.isUndefined(values.phone);
+        },
+        
+        testGetValuesForSubmission: function() {
+            //pending
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'adding and removing',
+        
+        setUp: function() {
+            this.form = buildForm();
+            
+            this.item1 = buildFormItem({id: 'name'});
+            this.item2 = buildFormItem({id: 'email'});
+            this.item3 = buildFormItem({id: 'phone'});
+            
+            this.form.add(this.item1);
+        },
+        
+        testAddField: function() {
+            var count = this.form.items.getCount();
+            
+            this.form.add(this.item2);
+            
+            assert.areEqual(count + 1, this.form.items.getCount());
+        },
+        
+        testAddMultipleFields: function() {
+            var count = this.form.items.getCount();
+            
+            this.form.add(this.item2, this.item3);
+            
+            assert.areEqual(count + 2, this.form.items.getCount());
+        },
+        
+        testAddReturnsForm: function() {
+            assert.areEqual(this.form, this.form.add(this.item2));
+        },
+        
+        testRemoveField: function() {
+            var count = this.form.items.getCount();
+            
+            this.form.remove(this.item1);
+            
+            assert.areEqual(count - 1, this.form.items.getCount());
+        },
+        
+        testRemoveReturnsForm: function() {
+            assert.areEqual(this.form, this.form.remove(this.item1));
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/GridPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/GridPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/GridPanel.js	(revision 76)
@@ -0,0 +1,103 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.grid.GridPanel'),
+        assert = Y.Assert;
+    
+    //builds and returns a grid with some default config
+    var buildGrid = function(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            store: new Ext.data.ArrayStore({
+                autoDestroy: true,
+                
+                storeId: 'myStore',
+                idIndex: 0,  
+                fields : [
+                   'company',
+                   {name: 'price',      type: 'float'},
+                   {name: 'change',     type: 'float'},
+                   {name: 'pctChange',  type: 'float'},
+                   {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+                ],
+                
+                data: [
+                    ['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
+                    ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
+                    ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
+                    ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
+                    ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
+                ]
+            }),
+            
+            colModel: new Ext.grid.ColumnModel({
+                columns: [
+                    {header: 'Name', dataIndex: 'company'}
+                ]
+            }),
+            
+            selModel: new Ext.grid.RowSelectionModel()
+        });
+        
+        return new Ext.grid.GridPanel(config);
+    };
+        
+    suite.add(new Y.Test.Case({
+        name: 'constructor and initComponent',
+        
+        testDisallowsAutoScroll: function() {
+            var grid = buildGrid({autoScroll: true});
+            
+            assert.isFalse(grid.autoScroll);
+        },
+        
+        testDisallowsAutoWidth: function() {
+            var grid = buildGrid({autoWidth: true});
+            
+            assert.isFalse(grid.autoWidth);
+        },
+        
+        testDsTranslatedToStore: function() {
+            var store = new Ext.data.ArrayStore({fields: ['name']}),
+                grid  = buildGrid({ds: store, store: null});
+            
+            assert.areEqual(store, grid.store);
+            assert.isUndefined(grid.ds);
+        },
+        
+        testCmTranslatedToColModel: function() {
+            var colModel = new Ext.grid.ColumnModel({columns: [{header: 'my header'}]}),
+                grid     = buildGrid({cm: colModel, colModel: null});
+            
+            assert.areEqual(colModel, grid.colModel);
+            assert.isUndefined(grid.cm);
+        },
+        
+        testColumnsTurnedIntoColModel: function() {
+            var columns = [
+                {header: 'first', dataIndex: 'company'}, {header: 'second', dataIndex: 'price'}
+            ];
+            var grid = buildGrid({columns: columns, colModel: null});
+            
+            var colModel = grid.colModel;
+            assert.areEqual(2, colModel.getColumnCount());
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'reconfigure'
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'walk cells'
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/form/CompositeField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/form/CompositeField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/form/CompositeField.js	(revision 76)
@@ -0,0 +1,201 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.form.CompositeField'),
+        assert = Y.Assert;
+    
+    //builds a simple composite field
+    function buildField(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            items: [
+                {xtype: 'textfield', name: 'title',     width: 40, fieldLabel: 'Title'},
+                {xtype: 'textfield', name: 'firstName', flex:  1,  fieldLabel: 'First'},
+                {xtype: 'textfield', name: 'lastName',  flex:  1,  fieldLabel: 'Last'}
+            ]
+        });
+        
+        return new Ext.form.CompositeField(config);
+    };
+    
+    //builds and renders a FormPanel containing a composite field
+    function createForm() {
+        this.field1 = new Ext.form.TextField({name: 'firstName', flex: 1, fieldLabel: 'First'});
+        this.field2 = new Ext.form.TextField({name: 'lastName',  flex: 1, fieldLabel: 'Last'});
+        
+        this.composite = new Ext.form.CompositeField({
+            items: [
+                {xtype: 'textfield', name: 'title', width: 40, fieldLabel: 'Title'},
+                this.field1,
+                this.field2
+            ]
+        });
+        
+        this.form = new Ext.form.FormPanel({
+            renderTo: Ext.getBody(),
+            items   : [
+                this.composite
+            ]
+        });
+    };
+    
+    //use this to tearDown createForm
+    function destroyForm() {
+        this.form.destroy();
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'building the label',
+        
+        testDefaultLabel: function() {
+            var field = buildField();
+            
+            assert.areSame('Title, First, Last', field.fieldLabel);
+        },
+        
+        testCustomFieldLabel: function() {
+            var field = buildField({fieldLabel: 'Custom label'});
+            
+            assert.areSame('Custom label', field.fieldLabel);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'isDirty',
+        
+        setUp   : createForm,
+        tearDown: destroyForm,
+        
+        testFalseIfDisabled: function() {
+            this.composite.disable();
+
+            assert.isFalse(this.composite.isDirty());
+        },
+        
+        testIsClean: function() {
+            assert.isFalse(this.composite.isDirty());
+        },
+        
+        testOneFieldDirty: function() {
+            this.field1.isDirty = function() {
+                return true;
+            };
+
+            assert.isTrue(this.composite.isDirty());
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'reset',
+        
+        setUp   : createForm,
+        tearDown: destroyForm,
+        
+        testPropagatesToChildren: function() {
+            var callCount = 0;
+            
+            var resetFunc =function() {
+                callCount ++;
+            };
+            
+            this.field1.reset = resetFunc;
+            this.field2.reset = resetFunc;
+            
+            //we need to set this to avoid an unrelated error when resetting
+            //clearInvalid would otherwise try to clear a non-existent DOM node
+            this.composite.clearInvalid = Ext.emptyFn;
+            
+            this.composite.reset();
+            
+            assert.areEqual(2, callCount);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'enabling and disabling',
+        
+        setUp   : createForm,
+        tearDown: destroyForm,
+        
+        testEnablePropagatesToChildren: function() {
+            var callCount = 0;
+            
+            var enableFunc =function() {
+                callCount ++;
+            };
+            
+            this.field1.enable = enableFunc;
+            this.field2.enable = enableFunc;
+            
+            this.composite.onEnable();
+            
+            assert.areEqual(2, callCount);
+        },
+        
+        testDisablePropagatesToChildren: function() {
+            var callCount = 0;
+            
+            var disableFunc = function() {
+                callCount ++;
+            };
+            
+            this.field1.disable = disableFunc;
+            this.field2.disable = disableFunc;
+            
+            this.composite.onDisable();
+            
+            assert.areEqual(2, callCount);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'setting read only',
+        
+        setUp   : createForm,
+        tearDown: destroyForm,
+        
+        testSetsSubFields: function() {
+            var callCount = 0;
+            
+            var func = function() {
+                callCount ++;
+            };
+            
+            this.field1.setReadOnly = func;
+            this.field2.setReadOnly = func;
+            
+            this.composite.setReadOnly();
+            
+            assert.areEqual(2, callCount);
+        },
+        
+        testSetsReadOnly: function() {
+            var comp = this.composite;
+            
+            assert.isFalse(comp.readOnly);
+            
+            comp.setReadOnly();
+            
+            assert.isTrue(comp.readOnly);
+        }
+    }));
+    
+    // suite.add(new Y.Test.Case({
+    //     name: 'resizing',
+    //     
+    //     setUp   : createForm,
+    //     tearDown: destroyForm,
+    //     
+    //     testResizing
+    //     
+    // }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Container.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Container.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Container.js	(revision 76)
@@ -0,0 +1,472 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Ext.Container', {
+    name: 'Test Ext.Container methods',
+    
+    test_add: function(){
+        var ct = new Ext.Container({
+            defaultType: 'box'
+        });
+        ct.add(new Ext.Component());
+        
+        Y.Assert.areEqual(1, ct.items.getCount(), 'Check adding a single item works');
+        
+        ct.add(new Ext.Component({itemId: 'a'}), new Ext.Component({itemId: 'b'}), new Ext.Component({itemId: 'c'}));
+        Y.Assert.areEqual(4, ct.items.getCount(), 'Test add with param array');
+        Y.Assert.areEqual('b', ct.items.itemAt(2).itemId, 'Test that they are correctly added in order');
+        
+        ct.add({
+             xtype: 'component'   
+        });
+        Y.Assert.areEqual(5, ct.items.getCount(), 'Test for lazy instantiation');
+        
+        ct.add({});
+        Y.Assert.isTrue(ct.items.last().isXType('box'), 'Test default type');
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_cascade: function(){
+        var ct = new Ext.Container({itemId: 'ct', depth: 0}),
+            i, 
+            j, 
+            k,
+            ci,
+            cj,
+            order = [ct.itemId];
+           
+        /* our container will have:
+         * 3 items at depth 1
+         * 9 items at depth 2
+         * 27 items at depth 3
+         */ 
+        for(i = 0; i < 3; ++i){
+            id = 'item' + i;
+            ci = ct.add({
+                itemId: id,
+                depth: 1
+            });
+            order.push(id);
+            for(j = 0; j < 3; ++j){
+                id = 'item' + i  + '_' + j;
+                cj = ci.add({
+                    itemId: id,
+                    depth: 2
+                });
+                order.push(id);
+                for(k = 0; k < 3; ++k){
+                    id = 'item' + i  + '_' + j + '_' + k;
+                    cj.add({
+                        itemId: id,
+                        depth: 3
+                    });
+                    order.push(id);
+                }
+            }
+        }
+        
+        
+        var cnt = 0,
+            items = [];
+        ct.cascade(function(c){
+            items.push(c.itemId);
+            ++cnt;    
+        });  
+        Y.Assert.areEqual(40, cnt, 'Test each item is iterated');
+        Y.ArrayAssert.itemsAreEqual(order, items, 'Test that items are iterated depth first');
+        
+        items = [];
+        ct.cascade(function(){
+            items.push(this.itemId);
+        });
+        Y.ArrayAssert.itemsAreEqual(order, items, 'Test that the scope defaults to the current component');
+        
+        cnt = 0;
+        ct.cascade(function(c){
+            cnt += c.depth * this.val;
+        }, {val: 3});
+        
+        Y.Assert.areEqual(306, cnt, 'Test that custom scope works');
+        
+        cnt = 0;
+        ct.cascade(function(a, b){
+            cnt += this.depth * (a + b);
+        }, null, [1, 2]);
+        
+        Y.Assert.areEqual(306, cnt, 'Test that custom args work');
+        
+        cnt = 0;
+        ct.cascade(function(){
+            if(this.itemId == 'item0' || this.itemId == 'item2'){
+                return false;
+            }
+            ++cnt;
+        });
+        Y.Assert.areEqual(14, cnt, 'Test that returning false stops iteration on a branch');
+        
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_find: function(){
+        var ct = new Ext.Container({
+            prop: 'foo',
+            special: 'main',
+            items: [{
+                xtype: 'container',
+                prop: 'foo',
+                id: 'a',
+                items: [{}, {prop: 'foo', id: 'd'}, {}, {}, {}, {
+                    xtype: 'container',
+                    items: [{}, {}, {}, {}]
+                }]
+            },{
+                xtype: 'container',
+                prop: 'bar',
+                id: 'b',
+                items: [{prop: 'foo', id: 'e'}, {prop: 'food'}, {
+                    xtype: 'container',
+                    items: {
+                        xtype: 'container',
+                        items: {
+                            xtype: 'container',
+                            items: {
+                                xtype: 'container',
+                                items: {
+                                    prop: 'foo',
+                                    id: 'f'
+                                }
+                            }
+                        }
+                    }
+                }]
+            },{
+                prop: 'foo',
+                xtype: 'box',
+                id: 'c'
+            }]
+        });
+        
+        var arr = ct.find('prop', 'foo');
+        Y.Assert.areEqual(5, arr.length, 'Ensure correct items are found, at all depths');
+        Y.ArrayAssert.itemsAreEqual(['a', 'd', 'e', 'f', 'c'], Ext.pluck(arr, 'id'), 'Test order the items are found, should be depth first');
+        
+        arr = ct.find('none', 'x');
+        Y.ArrayAssert.isEmpty(arr, 'Test with non existent property');
+        
+        arr = ct.find('foo', 'not here');
+        Y.ArrayAssert.isEmpty(arr, 'Test with property that exists, but no matches');
+        
+        arr = ct.items.first().find('prop', 'foo');
+        Y.Assert.areEqual(1, arr.length, 'Ensure correct items are found, at one child level');
+        Y.ArrayAssert.itemsAreEqual(['d'], Ext.pluck(arr, 'id'), 'Test order the items are found');
+        
+        arr = ct.find('special', 'main');
+        Y.ArrayAssert.isEmpty(arr, 'Ensure the container itself isn\'t found');
+        
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_findBy: function(){
+        var ct = new Ext.Container({
+            foo: 0,
+            items: [{
+                foo: 1,
+                items: [{
+                    foo: 5
+                },{
+                    foo: 6
+                },{
+                    foo: 7
+                }]
+            },{
+                foo: 2,
+                items: [{
+                    foo: 8
+                },{
+                    foo: 9
+                },{
+                    foo: 10
+                }]
+            },{
+                foo: 3,
+                items: {
+                    foo: 11
+                }
+            },{
+                foo: 4,
+                items: [{
+                    foo: 12
+                },{
+                    foo: 13
+                },{
+                    foo: 14,
+                    items: [{
+                        foo: 15
+                    },{
+                        foo: 16
+                    }]
+                }]
+            }]
+        });
+        
+        var arr = ct.findBy(function(){
+            return this.foo % 2 == 0; 
+        });
+        
+        Y.Assert.areEqual(8, arr.length, 'Test correct items are returned, also tests that scope defaults to the component');
+        Y.ArrayAssert.itemsAreEqual([6, 2, 8, 10, 4, 12, 14, 16], Ext.pluck(arr, 'foo'), 'Test items are returned in the correct order');
+        
+        arr = ct.findBy(function(c){
+            return c.foo == 0;
+        });
+        
+        Y.ArrayAssert.isEmpty(arr, 'Ensure that the container is not included in the findBy');
+        
+        arr = ct.findBy(function(c){
+            return c.foo % this.val == 0;
+        }, {val: 3});
+        
+        Y.Assert.areEqual(5, arr.length, 'Test correct items are returned, also test custom scope');
+        
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_findByType: function(){
+        var ct = new Ext.Container({
+            items: [{
+                xtype: 'box'
+            },{
+                xtype: 'component'
+            },{
+                xtype: 'container',
+                items: [{
+                    xtype: 'panel',
+                    items: {
+                        xtype: 'panel',
+                        items: {
+                            xtype: 'box'
+                        }
+                    }
+                },{
+                    xtype: 'container',
+                    items: {
+                        xtype: 'container',
+                        items: {
+                            xtype: 'container',
+                            items: {
+                                xtype: 'box'
+                            }
+                        }
+                    }
+                },{
+                    xtype: 'box'
+                }]
+            },{
+                xtype: 'form',
+                items: {
+                    xtype: 'fieldset',
+                    items: [{
+                        xtype: 'datefield'
+                    },{
+                        xtype: 'textfield'
+                    }]
+                }
+            }]
+        }); 
+        
+        var arr = ct.findByType('component');
+        Y.Assert.areEqual(15, arr.length, 'Check correct number of items are returned');
+        
+        arr = ct.findByType('box', true);
+        Y.Assert.areEqual(4, arr.length, 'Test shallow parameter is respected');
+        
+        arr = ct.findByType('grid');
+        Y.Assert.areEqual(0, arr.length, 'Ensure that no items are returned if there\'s no matches');
+        
+        arr = ct.findByType('container');
+        Y.Assert.areEqual(8, arr.length, 'Check all items are found at different depths');
+        
+        ct.destroy();
+        ct = null;   
+    },
+    
+    test_getComponent: function(){
+        var component1 = new Ext.Component({itemId: 'd'}),
+            component2 = new Ext.Component({itemId: 'e'}),
+            component3 = new Ext.Component();
+            
+        var ct = new Ext.Container({
+            items: [{
+                id: 'a'
+            },{
+                itemId: 'b'
+            },{
+                itemId: 'c'
+            },{
+                //nothing
+            }, component1, {
+                //nothing
+            }, component2]
+        });
+        
+        Y.Assert.areEqual('b', ct.getComponent(1).itemId, 'Test accessing by index');
+        Y.Assert.areEqual('a', ct.getComponent(0).id, 'Test accessing by index');
+        
+        Y.Assert.isUndefined(ct.getComponent(100), 'Test grabbing an index outside of bounds');
+        Y.Assert.isUndefined(ct.getComponent(null), 'Test with passing null');
+        Y.Assert.isUndefined(ct.getComponent('foo'), 'Test with passing id that doesn\'t exist');
+        Y.Assert.isUndefined(ct.getComponent(component3), 'Test with passing a component that doesn\'t belong to the container');
+        
+        Y.Assert.areEqual(component1, ct.getComponent(component1), 'Test passing in a component instance');
+        Y.Assert.areEqual(component2, ct.getComponent(component2), 'Test passing in a component instance');
+        
+        Y.Assert.areEqual('d', ct.getComponent('d').itemId, 'Test passing in itemId');
+        Y.Assert.areEqual('c', ct.getComponent('c').itemId, 'Test the above with an itemId');
+        
+        component3.destroy();
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_insert: function(){
+        var ct = new Ext.Container({
+            items: [{
+                itemId: 'first',
+                xtype: 'component'
+            },{
+                xtype: 'component'
+            },{
+                xtype: 'component'
+            }]
+        });
+        
+        ct.insert(1, {itemId: 'a'});
+        Y.Assert.areEqual('a', ct.items.itemAt(1).itemId, 'Test simple insert');
+        
+        ct.insert(0, {itemId: 'b'});
+        Y.Assert.areEqual('b', ct.items.first().itemId, 'Test insert at 0');
+        
+        ct.insert(ct.items.getCount(), {itemId: 'c'});
+        Y.Assert.areEqual('c', ct.items.last().itemId, 'Test inserting at the last index');
+        
+        ct.insert(100, {itemId: 'd'});
+        Y.Assert.areEqual('d', ct.items.last().itemId, 'Test inserting well after the last index');
+        
+        ct.insert(2, {itemId: 'e'}, {itemId: 'f'}, {itemId: 'g'});
+        Y.Assert.areEqual('e', ct.items.itemAt(2).itemId, 'Test inserting multiple items at once');
+        Y.Assert.areEqual('f', ct.items.itemAt(3).itemId, 'Test inserting multiple items at once');
+        Y.Assert.areEqual('g', ct.items.itemAt(4).itemId, 'Test inserting multiple items at once');
+        
+        ct.insert(3, new Ext.Component({itemId: 'h'}));
+        Y.Assert.areEqual('h', ct.items.itemAt(3).itemId, 'Test simple insert');
+        
+        Y.Assert.areEqual('first', ct.items.itemAt(1).itemId, 'Test original component held position');
+        
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_remove: function(){
+        var items = [],
+            ct,
+            c,
+            component1 = new Ext.Component(),
+            component2 = new Ext.Component(),
+            component3 = new Ext.Component();
+            
+        for(var i = 0; i < 10; ++i){
+            items.push({itemId: 'item' + i});
+        }
+        items.push(component1, component2);
+        ct = new Ext.Container({items: items});
+        
+        ct.remove(0);
+        Y.Assert.areEqual(11, ct.items.getCount(), 'Test remove by index');
+        
+        c = ct.remove(100);
+        Y.Assert.areEqual(11, ct.items.getCount(), 'Test remove by index, where the index doesn\'t exist')
+        Y.Assert.isUndefined(c, 'Ensure undefined is returned if the item doesn\'t exist');
+        
+        c = ct.remove(component1);
+        Y.Assert.areEqual(10, ct.items.getCount(), 'Test remove with a component instance');
+        Y.Assert.areEqual(component1, c, 'Test component is returned correctly');
+        
+        c = ct.remove(component3);
+        Y.Assert.areEqual(10, ct.items.getCount(), 'Test removing an instance that doesn\'t exist in the component');
+        Y.Assert.isUndefined(c, 'Ensure that the empty is returned in this case');
+        
+        c = ct.remove('item5');
+        Y.Assert.areEqual(9, ct.items.getCount(), 'Test removing with an itemId');
+        Y.Assert.areEqual('item5', c.itemId, 'Ensure component is returned properly');
+        
+        //test autoDestroy behaviour
+        c = ct.remove(0);
+        Y.Assert.isTrue(c.isDestroyed, 'Test that container autoDestroy/true is respected');
+        
+        c = ct.remove(0, true);
+        Y.Assert.isTrue(c.isDestroyed, 'Test that container autoDestroy/true and destroy/true works');
+        
+        c = ct.remove(0, false);
+        Y.Assert.isUndefined(c.isDestroyed, 'Test that destroy/false overrides autoDestroy/true');
+        
+        ct.autoDestroy = false;
+        c = ct.remove(0);
+        Y.Assert.isUndefined(c.isDestroyed, 'Test that autoDestroy/false is respected');
+        
+        c = ct.remove(0, false);
+        Y.Assert.isUndefined(c.isDestroyed, 'Test autoDestroy/false and destroy/false works');
+        
+        c = ct.remove(0, true);
+        Y.Assert.isTrue(c.isDestroyed, 'Test destroy/true overrides autoDestroy/false');
+        
+        component3.destroy();
+        ct.destroy();
+        ct = null;
+    },
+    
+    test_removeAll: function(){
+        var ct = new Ext.Container(),
+            arr,
+            i;
+            
+        arr = ct.removeAll();
+        Y.ArrayAssert.isEmpty(arr, 'Test removeAll with no items returns an empty array');
+        
+        for(i = 0; i < 3; ++i){
+            ct.add({
+                itemId: 'item' + i
+            });
+        }
+        
+        arr = ct.removeAll();
+        Y.Assert.areEqual(0, ct.items.getCount(), 'Ensure all items are removed');
+        Y.ArrayAssert.itemsAreEqual(['item0', 'item1', 'item2'], Ext.pluck(arr, 'itemId'), 'Ensure they are removed in a consistent order');
+        
+        for(i = 0; i < 2; ++i){
+            ct.add({
+                itemId: 'item' + i
+            });
+        }
+        arr = ct.removeAll(true);
+        Y.ArrayAssert.itemsAreEqual([true, true], Ext.pluck(arr, 'isDestroyed'), 'Check destroy is honoured');
+        
+        ct.autoDestroy = true;
+        for(i = 0; i < 3; ++i){
+            ct.add({
+                itemId: 'item' + i
+            });
+        }
+        arr = ct.removeAll();
+        Y.ArrayAssert.itemsAreEqual([true, true, true], Ext.pluck(arr, 'isDestroyed'), 'Check autoDestroy is honoured');
+        
+        ct.destroy();
+        ct = null;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Slider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Slider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/Slider.js	(revision 76)
@@ -0,0 +1,204 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.Slider'),
+        assert = Y.Assert;
+        
+    suite.add(new Y.Test.Case({
+        name: 'constructor and initComponent',
+        
+        setUp: function() {
+            this.slider = new Ext.Slider();
+        },
+        
+        testDefaultValues: function() {
+            assert.areEqual(0, this.slider.minValue);
+            assert.areEqual(0, this.slider.value);
+            assert.areEqual(100, this.slider.maxValue);
+        },
+        
+        testDefaultValueSet: function() {
+            var slider = new Ext.Slider({minValue: 50});
+            
+            assert.areEqual(50, slider.value);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'Changing value',
+        
+        setUp: function() {
+            this.slider = new Ext.Slider({
+                minValue: 30,
+                values  : [50, 70],
+                maxValue: 90,
+                renderTo: Ext.getBody()
+            });
+            
+            this.slider.render();
+        },
+        
+        tearDown: function() {
+            this.slider.destroy();
+        },
+        
+        testValueChanged: function() {
+            this.slider.setValue(0, 60);
+            
+            assert.areEqual(60, this.slider.getValues()[0]);
+        },
+        
+        testEventFired: function() {
+            var executed = false,
+                value, thumb;
+            
+            this.slider.on('change', function(slider, v, t) {
+                executed = true;
+                value = v;
+                thumb = t;
+            }, this);
+            
+            this.slider.setValue(0, 60);
+            
+            assert.isTrue(executed);
+            assert.areEqual(60, value);
+            assert.areEqual(this.slider.thumbs[0], thumb);
+        },
+        
+        testThumbMoved: function() {
+            var orig = this.slider.moveThumb,
+                index, animate;
+            
+            this.slider.moveThumb = function(i, v, a) {
+                index   = i;
+                animate = a;
+            };
+            
+            this.slider.setValue(0, 60, false);
+            
+            assert.areEqual(0, index);
+            assert.isFalse(animate);
+        },
+        
+        testChangeComplete: function() {
+            var executed = false,
+                value, thumb;
+            
+            this.slider.on('changecomplete', function(slider, v, t) {
+                executed = true;
+                value = v;
+                thumb = t;
+            }, this);
+            
+            this.slider.setValue(0, 60, undefined, true);
+            
+            assert.isTrue(executed);
+            assert.areEqual(60, value);
+            assert.areEqual(this.slider.thumbs[0], thumb);
+        },
+        
+        testSetMinValue: function() {
+            this.slider.setMinValue(20);
+            
+            assert.areEqual(20, this.slider.minValue);
+            assert.areEqual(50, this.slider.getValues()[0]);
+        },
+        
+        testSetMaxValue: function() {
+            this.slider.setMaxValue(110);
+            
+            assert.areEqual(110, this.slider.maxValue);
+            assert.areEqual(50, this.slider.getValues()[0]);
+        },
+        
+        testSetMinValueChangesValue: function() {
+            this.slider.setMinValue(60);
+            
+            assert.areEqual(60, this.slider.getValues()[0]);
+            assert.areEqual(70, this.slider.getValues()[1]);
+        },
+        
+        testSetMaxValueChangesValue: function() {
+            this.slider.setMaxValue(60);
+            
+            assert.areEqual(50, this.slider.getValues()[0]);
+            assert.areEqual(60, this.slider.getValues()[1]);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'Utility functions',
+        
+        setUp: function() {
+            this.slider = new Ext.Slider({
+                //the slider has 14px of total padding on the sides, so add this here to make the numbers easier
+                width   : 214,
+                minValue: 100,
+                maxValue: 500,
+                renderTo: Ext.getBody()
+            });
+            
+            this.slider.render();
+        },
+        
+        tearDown: function() {
+            this.slider.destroy();
+        },
+        
+        testGetRatio: function() {
+            assert.areEqual(0.5, this.slider.getRatio());
+        },
+        
+        testTranslateValue: function() {
+            
+        },
+        
+        testReverseValue: function() {
+            
+        },
+        
+        testNormalizeValue: function() {
+            
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'Snapping',
+        
+        setUp: function() {
+            this.slider = new Ext.Slider({
+                increment: 10,
+                renderTo : Ext.getBody()
+            });
+            
+            this.slider.render();
+        },
+        
+        tearDown: function() {
+            this.slider.destroy();
+        },
+        
+        testSnapToFloor: function() {
+            this.slider.setValue(0, 12);
+            
+            assert.areEqual(10, this.slider.doSnap(12));
+        },
+        
+        testSnapToCeil: function() {
+            assert.areEqual(20, this.slider.doSnap(18));            
+            assert.areEqual(20, this.slider.doSnap(15));
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'Adding and removing thumbs'
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/BoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/BoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/BoxLayout.js	(revision 76)
@@ -0,0 +1,19 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.layout.BoxLayout'),
+        assert = Y.Assert;
+    
+    // suite.add(new Y.Test.Case({
+    //     name: 'parseMargins'
+    // }));
+    
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/VBoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/VBoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/VBoxLayout.js	(revision 76)
@@ -0,0 +1,542 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.layout.VBoxLayout'),
+        assert = Y.Assert;
+    
+    function buildFakeChild(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            getWidth: function() {
+                return 10;
+            },
+            getHeight: function() {
+                return 10;
+            },
+            getSize: function() {
+                return {
+                    height: 10,
+                    width : 10
+                };
+            },
+            margins: {
+                top   : 0,
+                right : 0,
+                bottom: 0,
+                left  : 0
+            }
+        });
+        
+        return config;
+    }
+    
+    function buildLayout(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            padding: {
+                top   : 0,
+                right : 0,
+                bottom: 0,
+                left  : 0
+            }
+        });
+        
+        return new Ext.layout.VBoxLayout(config);
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'calculating flexed box sizes',
+        
+        setUp: function() {
+            this.layout = buildLayout();
+            
+            this.items = [
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1})
+            ];
+            
+            this.targetSize = {
+                height: 400,
+                width : 100
+            };
+        },
+        
+        testEqualFlexHeights: function() {
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(100, boxes[0].height);
+            assert.areEqual(100, boxes[1].height);
+            assert.areEqual(100, boxes[2].height);
+            assert.areEqual(100, boxes[3].height);
+        },
+        
+        testDifferentFlexWidths: function() {
+            this.items = [
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 2}),
+                buildFakeChild({flex: 3}),
+                buildFakeChild({flex: 4})
+            ];
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(40, boxes[0].height);
+            assert.areEqual(80, boxes[1].height);
+            assert.areEqual(120, boxes[2].height);
+            assert.areEqual(160, boxes[3].height);
+        },
+        
+        testMarginsAccountedFor: function() {
+            var items = [
+                buildFakeChild({flex: 1, margins: {left: 0, right: 0, top: 10, bottom: 10}}),
+                buildFakeChild({flex: 1, margins: {left: 0, right: 0, top: 10, bottom: 10}}),
+                buildFakeChild({flex: 1, margins: {left: 0, right: 0, top: 10, bottom: 10}}),
+                buildFakeChild({flex: 1, margins: {left: 0, right: 0, top: 10, bottom: 10}})
+            ];
+             
+            var calcs = this.layout.calculateChildBoxes(items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(80, boxes[0].height);
+            assert.areEqual(80, boxes[1].height);
+            assert.areEqual(80, boxes[2].height);
+            assert.areEqual(80, boxes[3].height);
+        },
+        
+        testPaddingAccountedFor: function() {
+            this.layout = buildLayout({
+                padding: {
+                    top   : 10,
+                    right : 10,
+                    bottom: 10,
+                    left  : 10
+                }
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            //400px available internally, minus 20px total left + right padding = 380 / 4
+            assert.areEqual(95, boxes[0].height);
+            assert.areEqual(95, boxes[1].height);
+            assert.areEqual(95, boxes[2].height);
+            assert.areEqual(95, boxes[3].height);
+        },
+        
+        //one of the items is passed both a width and a flex - the flex should be ignored
+        testHeightDominatesFlex: function() {
+            var items = [
+                buildFakeChild({flex: 1, height: 250, getHeight: function() {return 250;}}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1})
+            ];
+             
+            var calcs = this.layout.calculateChildBoxes(items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(250, boxes[0].height);
+            assert.areEqual(50, boxes[1].height);
+            assert.areEqual(50, boxes[2].height);
+            assert.areEqual(50, boxes[3].height);
+        },
+        
+        testHeightPropertyDominatesGetHeight: function() {
+            var layout = buildLayout({
+                pack : 'start',
+                align: 'stretch'
+            });
+            
+            var items = [
+                {
+                    title: 'Panel 1',
+                    flex: 1,
+                    html: 'flex : 1',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getHeight: function() {return 10;},
+                    getWidth: function() {return 10;}
+                }, {
+                    title: 'Panel 2',
+                    height: 100,
+                    html: 'width : 100',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getWidth: function() {return 10;},
+                    
+                    //NOTE: this should be ignored by HBox because we have a different configured width property
+                    getHeight: function() {return 10;}
+                }, {
+                    title: 'Panel 3',
+                    flex: 2,
+                    html: 'flex : 2',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getHeight: function() {return 10;},
+                    getWidth: function() {return 10;}
+                }
+            ];
+            
+            var targetSize = {
+                height: 1628,
+                width : 630
+            };
+            
+            var calcs = layout.calculateChildBoxes(items, targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].top);
+            assert.areEqual(510, boxes[1].top);
+            assert.areEqual(610, boxes[2].top);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'minHeight of items',
+
+        setUp: function() {
+            this.layout = buildLayout();
+
+            this.layout.beforeCt = {
+                getWidth: function() {
+                    return 0;
+                },
+                createChild: Ext.emptyFn
+            };
+
+            this.layout.afterCt = {
+                getWidth: function() {
+                    return 0;
+                },
+                createChild: Ext.emptyFn
+            };
+
+            this.items = [
+                buildFakeChild({height: 100, minHeight: 100}),
+                buildFakeChild({height: 200, minHeight: 120}),
+                buildFakeChild({height: 200, minHeight: 120}),
+                buildFakeChild({height: 200, minHeight: 120})
+            ];
+        },
+
+        testAvailableWidthIsSufficient: function() {
+            var targetSize = {
+                height: 700,
+                width : 25
+            };
+
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+
+            assert.areEqual(0,   boxes[0].top);
+            assert.areEqual(100, boxes[1].top);
+            assert.areEqual(300, boxes[2].top);
+            assert.areEqual(500, boxes[3].top);
+
+            assert.areEqual(100, boxes[0].height);
+            assert.areEqual(200, boxes[1].height);
+            assert.areEqual(200, boxes[2].height);
+            assert.areEqual(200, boxes[3].height);
+        },
+
+        testHasShortfall: function() {
+            var targetSize = {
+                height: 500,
+                width : 25
+            };
+
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+
+            assert.areEqual(100, boxes[0].height);
+            assert.areEqual(133, boxes[1].height);
+            assert.areEqual(133, boxes[2].height);
+            assert.areEqual(134, boxes[3].height);
+
+            assert.areEqual(0,   boxes[0].top);
+            assert.areEqual(100, boxes[1].top);
+            assert.areEqual(233, boxes[2].top);
+            assert.areEqual(366, boxes[3].top);
+        },
+
+        testTooNarrow: function() {
+            var targetSize = {
+                height: 400,
+                width : 25
+            };
+
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+
+            assert.areEqual(0,   boxes[0].top);
+            assert.areEqual(100, boxes[1].top);
+            assert.areEqual(220, boxes[2].top);
+            assert.areEqual(340, boxes[3].top);
+
+            assert.areEqual(100, boxes[0].height);
+            assert.areEqual(120, boxes[1].height);
+            assert.areEqual(120, boxes[2].height);
+            assert.areEqual(120, boxes[3].height);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'aligning',
+        
+        setUp: function() {
+            this.items = [
+                buildFakeChild({flex: 1, getWidth: function() {return 10;}}),
+                buildFakeChild({flex: 1, getWidth: function() {return 20;}}),
+                buildFakeChild({flex: 1, getWidth: function() {return 30;}}),
+                buildFakeChild({flex: 1, getWidth: function() {return 40;}})
+            ];
+            
+            this.targetSize = {
+                height: 400,
+                width : 100
+            };
+        },
+        
+        testLeft: function() {
+            this.layout = buildLayout({
+                align: 'left'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].left);
+            assert.areEqual(0, boxes[1].left);
+            assert.areEqual(0, boxes[2].left);
+            assert.areEqual(0, boxes[3].left);
+        },
+        
+        testMiddle: function() {
+            this.layout = buildLayout({
+                align: 'center'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(45, boxes[0].left);
+            assert.areEqual(40, boxes[1].left);
+            assert.areEqual(35, boxes[2].left);
+            assert.areEqual(30, boxes[3].left);
+        },
+        
+        testStretch: function() {
+            this.layout = buildLayout({
+                align: 'stretch'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].left);
+            assert.areEqual(0, boxes[1].left);
+            assert.areEqual(0, boxes[2].left);
+            assert.areEqual(0, boxes[3].left);
+            
+            assert.areEqual(100, boxes[0].width);
+            assert.areEqual(100, boxes[1].width);
+            assert.areEqual(100, boxes[2].width);
+            assert.areEqual(100, boxes[3].width);
+        },
+        
+        testStretchMax: function() {
+            this.layout = buildLayout({
+                align: 'stretchmax'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].left);
+            assert.areEqual(0, boxes[1].left);
+            assert.areEqual(0, boxes[2].left);
+            assert.areEqual(0, boxes[3].left);
+            
+            assert.areEqual(40, boxes[0].width);
+            assert.areEqual(40, boxes[1].width);
+            assert.areEqual(40, boxes[2].width);
+            assert.areEqual(40, boxes[3].width);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'packing',
+        
+        setUp: function() {
+            this.items = [
+                buildFakeChild({getSize: function() {return {width: 10, height: 10};}}),
+                buildFakeChild({getSize: function() {return {width: 10, height: 20};}}),
+                buildFakeChild({getSize: function() {return {width: 10, height: 30};}}),
+                buildFakeChild({getSize: function() {return {width: 10, height: 40};}})
+            ];
+            
+            this.targetSize = {
+                height: 400,
+                width : 100
+            };
+        },
+        
+        testPackStart: function() {
+            this.layout = buildLayout({
+                pack: 'start'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].top);
+            assert.areEqual(10, boxes[1].top);
+            assert.areEqual(30, boxes[2].top);
+            assert.areEqual(60, boxes[3].top);
+        },
+        
+        testPackCenter: function() {
+            this.layout = buildLayout({
+                pack: 'center'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+                        
+            assert.areEqual(150, boxes[0].top);
+            assert.areEqual(160, boxes[1].top);
+            assert.areEqual(180, boxes[2].top);
+            assert.areEqual(210, boxes[3].top);
+        },
+        
+        testPackEnd: function() {
+            this.layout = buildLayout({
+                pack: 'end'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(300, boxes[0].top);
+            assert.areEqual(310, boxes[1].top);
+            assert.areEqual(330, boxes[2].top);
+            assert.areEqual(360, boxes[3].top);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'meta data from calculated box sizes',
+        
+        setUp: function() {
+            this.layout = buildLayout();
+            
+            this.items = [
+                buildFakeChild({getWidth: function() {return 50;}, flex: 1}),
+                buildFakeChild({getWidth: function() {return 60;}, flex: 1}),
+                buildFakeChild({getWidth: function() {return 10;}, flex: 1}),
+                buildFakeChild({getWidth: function() {return 80;}, flex: 1})
+            ];
+            
+            this.targetSize = {
+                height: 400,
+                width : 100
+            };
+        },
+        
+        testMaxHeight: function() {
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                meta  = calcs.meta;
+            
+            assert.areEqual(80, meta.maxWidth);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'update innerCt size',
+        
+        setUp: function() {
+            this.layout = buildLayout({
+                align  : 'stretch',
+                padding: {
+                    top   : 0,
+                    bottom: 0,
+                    left  : 10,
+                    right : 20
+                }
+            });
+            
+            //fake the values that are calculated during onLayout
+            this.layoutTargetLastSize = {
+                width : 100,
+                height: 400
+            };
+            
+            this.childBoxCache = {
+                meta: {
+                    maxWidth: 150
+                }
+            };
+        },
+        
+        testMaintainsWidthForAlignStretch: function() {
+            var layout = this.layout,
+                width, height;
+            
+            //a fake innerCt element that we can intercept calls to setSize on
+            layout.innerCt = {
+                setSize: function(widthArg, heightArg) {
+                    width  = widthArg;
+                    height = heightArg;
+                }
+            };
+            
+            layout.updateInnerCtSize(this.layoutTargetLastSize, this.childBoxCache);
+            
+            assert.areSame(100, width);
+            assert.areSame(400, height);
+        },
+        
+        //if aligning middle, increase height to accomodate the tallest child
+        testIncreasesWidthForAlignMiddle: function() {
+            this.layout = buildLayout({
+                align  : 'middle',
+                padding: {
+                    top   : 0,
+                    bottom: 0,
+                    left  : 10,
+                    right : 20
+                }
+            });
+            
+            var layout = this.layout,
+                width, height;
+            
+            //a fake innerCt element that we can intercept calls to setSize on
+            layout.innerCt = {
+                setSize: function(widthArg, heightArg) {
+                    width  = widthArg;
+                    height = heightArg;
+                }
+            };
+            
+            layout.updateInnerCtSize(this.layoutTargetLastSize, this.childBoxCache);
+            
+            assert.areSame(180, width);
+            assert.areSame(400, height);
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/HBoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/HBoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/HBoxLayout.js	(revision 76)
@@ -0,0 +1,543 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.layout.HBoxLayout'),
+        assert = Y.Assert;
+    
+    function buildFakeChild(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            // width: 10,
+            getWidth: function() {
+                return 10;
+            },
+            getHeight: function() {
+                return 10;
+            },
+            getSize: function() {
+                return {
+                    height: 10,
+                    width : 10
+                };
+            },
+            margins: {
+                top   : 0,
+                right : 0,
+                bottom: 0,
+                left  : 0
+            }
+        });
+        
+        return config;
+    }
+    
+    function buildLayout(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            padding: {
+                top   : 0,
+                right : 0,
+                bottom: 0,
+                left  : 0
+            }
+        });
+        
+        return new Ext.layout.HBoxLayout(config);
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'calculating flexed box sizes',
+        
+        setUp: function() {
+            this.layout = buildLayout();
+            
+            this.items = [
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1})
+            ];
+            
+            this.targetSize = {
+                height: 100,
+                width : 400
+            };
+        },
+        
+        testEqualFlexWidths: function() {
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(100, boxes[0].width);
+            assert.areEqual(100, boxes[1].width);
+            assert.areEqual(100, boxes[2].width);
+            assert.areEqual(100, boxes[3].width);
+        },
+        
+        testDifferentFlexWidths: function() {
+            this.items = [
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 2}),
+                buildFakeChild({flex: 3}),
+                buildFakeChild({flex: 4})
+            ];
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(40, boxes[0].width);
+            assert.areEqual(80, boxes[1].width);
+            assert.areEqual(120, boxes[2].width);
+            assert.areEqual(160, boxes[3].width);
+        },
+        
+        testMarginsAccountedFor: function() {
+            var items = [
+                buildFakeChild({flex: 1, margins: {left: 10, right: 10, top: 0, bottom: 0}}),
+                buildFakeChild({flex: 1, margins: {left: 10, right: 10, top: 0, bottom: 0}}),
+                buildFakeChild({flex: 1, margins: {left: 10, right: 10, top: 0, bottom: 0}}),
+                buildFakeChild({flex: 1, margins: {left: 10, right: 10, top: 0, bottom: 0}})
+            ];
+             
+            var calcs = this.layout.calculateChildBoxes(items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(80, boxes[0].width);
+            assert.areEqual(80, boxes[1].width);
+            assert.areEqual(80, boxes[2].width);
+            assert.areEqual(80, boxes[3].width);
+        },
+        
+        testPaddingAccountedFor: function() {
+            this.layout = buildLayout({
+                padding: {
+                    top   : 10,
+                    right : 10,
+                    bottom: 10,
+                    left  : 10
+                }
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            //400px available internally, minus 20px total left + right padding = 380 / 4
+            assert.areEqual(95, boxes[0].width);
+            assert.areEqual(95, boxes[1].width);
+            assert.areEqual(95, boxes[2].width);
+            assert.areEqual(95, boxes[3].width);
+        },
+        
+        //one of the items is passed both a width and a flex - the flex should be ignored
+        testWidthDominatesFlex: function() {
+            var items = [
+                buildFakeChild({flex: 1, width: 250, getWidth: function() {return 250;}}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1}),
+                buildFakeChild({flex: 1})
+            ];
+             
+            var calcs = this.layout.calculateChildBoxes(items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(250, boxes[0].width);
+            assert.areEqual(50, boxes[1].width);
+            assert.areEqual(50, boxes[2].width);
+            assert.areEqual(50, boxes[3].width);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'minWidth of items',
+        
+        setUp: function() {
+            this.layout = buildLayout();
+            
+            this.layout.beforeCt = {
+                getWidth: function() {
+                    return 0;
+                },
+                createChild: Ext.emptyFn
+            };
+            
+            this.layout.afterCt = {
+                getWidth: function() {
+                    return 0;
+                },
+                createChild: Ext.emptyFn
+            };
+            
+            this.items = [
+                buildFakeChild({width: 100, minWidth: 100}),
+                buildFakeChild({width: 200, minWidth: 120}),
+                buildFakeChild({width: 200, minWidth: 120}),
+                buildFakeChild({width: 200, minWidth: 120})
+            ];
+        },
+        
+        testAvailableWidthIsSufficient: function() {
+            var targetSize = {
+                width : 700,
+                height: 25
+            };
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0,   boxes[0].left);
+            assert.areEqual(100, boxes[1].left);
+            assert.areEqual(300, boxes[2].left);
+            assert.areEqual(500, boxes[3].left);
+            
+            assert.areEqual(100, boxes[0].width);
+            assert.areEqual(200, boxes[1].width);
+            assert.areEqual(200, boxes[2].width);
+            assert.areEqual(200, boxes[3].width);
+        },
+        
+        testHasShortfall: function() {
+            var targetSize = {
+                width : 500,
+                height: 25
+            };
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(100, boxes[0].width);
+            assert.areEqual(133, boxes[1].width);
+            assert.areEqual(133, boxes[2].width);
+            assert.areEqual(134, boxes[3].width);
+            
+            assert.areEqual(0,   boxes[0].left);
+            assert.areEqual(100, boxes[1].left);
+            assert.areEqual(233, boxes[2].left);
+            assert.areEqual(366, boxes[3].left);
+        },
+        
+        testTooNarrow: function() {
+            var targetSize = {
+                width : 400,
+                height: 25
+            };
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0,   boxes[0].left);
+            assert.areEqual(100, boxes[1].left);
+            assert.areEqual(220, boxes[2].left);
+            assert.areEqual(340, boxes[3].left);
+            
+            assert.areEqual(100, boxes[0].width);
+            assert.areEqual(120, boxes[1].width);
+            assert.areEqual(120, boxes[2].width);
+            assert.areEqual(120, boxes[3].width);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'aligning',
+        
+        setUp: function() {
+            this.items = [
+                buildFakeChild({flex: 1, getHeight: function() {return 10;}}),
+                buildFakeChild({flex: 1, getHeight: function() {return 20;}}),
+                buildFakeChild({flex: 1, getHeight: function() {return 30;}}),
+                buildFakeChild({flex: 1, getHeight: function() {return 40;}})
+            ];
+            
+            this.targetSize = {
+                height: 100,
+                width : 400
+            };
+        },
+        
+        testTop: function() {
+            this.layout = buildLayout({
+                align: 'top'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].top);
+            assert.areEqual(0, boxes[1].top);
+            assert.areEqual(0, boxes[2].top);
+            assert.areEqual(0, boxes[3].top);
+        },
+        
+        testMiddle: function() {
+            this.layout = buildLayout({
+                align: 'middle'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(45, boxes[0].top);
+            assert.areEqual(40, boxes[1].top);
+            assert.areEqual(35, boxes[2].top);
+            assert.areEqual(30, boxes[3].top);
+        },
+        
+        testStretch: function() {
+            this.layout = buildLayout({
+                align: 'stretch'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].top);
+            assert.areEqual(0, boxes[1].top);
+            assert.areEqual(0, boxes[2].top);
+            assert.areEqual(0, boxes[3].top);
+            
+            assert.areEqual(100, boxes[0].height);
+            assert.areEqual(100, boxes[1].height);
+            assert.areEqual(100, boxes[2].height);
+            assert.areEqual(100, boxes[3].height);
+        },
+        
+        testStretchMax: function() {
+            this.layout = buildLayout({
+                align: 'stretchmax'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].top);
+            assert.areEqual(0, boxes[1].top);
+            assert.areEqual(0, boxes[2].top);
+            assert.areEqual(0, boxes[3].top);
+            
+            assert.areEqual(40, boxes[0].height);
+            assert.areEqual(40, boxes[1].height);
+            assert.areEqual(40, boxes[2].height);
+            assert.areEqual(40, boxes[3].height);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'packing',
+        
+        setUp: function() {
+            this.items = [
+                buildFakeChild({getSize: function() {return {height: 10, width: 10};}}),
+                buildFakeChild({getSize: function() {return {height: 10, width: 20};}}),
+                buildFakeChild({getSize: function() {return {height: 10, width: 30};}}),
+                buildFakeChild({getSize: function() {return {height: 10, width: 40};}})
+            ];
+            
+            this.targetSize = {
+                height: 100,
+                width : 400
+            };
+        },
+        
+        testPackStart: function() {
+            this.layout = buildLayout({
+                pack: 'start'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].left);
+            assert.areEqual(10, boxes[1].left);
+            assert.areEqual(30, boxes[2].left);
+            assert.areEqual(60, boxes[3].left);
+        },
+        
+        testPackCenter: function() {
+            this.layout = buildLayout({
+                pack: 'center'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+                        
+            assert.areEqual(150, boxes[0].left);
+            assert.areEqual(160, boxes[1].left);
+            assert.areEqual(180, boxes[2].left);
+            assert.areEqual(210, boxes[3].left);
+        },
+        
+        testPackEnd: function() {
+            this.layout = buildLayout({
+                pack: 'end'
+            });
+            
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(300, boxes[0].left);
+            assert.areEqual(310, boxes[1].left);
+            assert.areEqual(330, boxes[2].left);
+            assert.areEqual(360, boxes[3].left);
+        },
+        
+        testWidthPropertyDominatesGetWidth: function() {
+            var layout = buildLayout({
+                pack : 'start',
+                align: 'stretch'
+            });
+            
+            var items = [
+                {
+                    title: 'Panel 1',
+                    flex: 1,
+                    html: 'flex : 1',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getHeight: function() {return 10;},
+                    getWidth: function() {return 10;}
+                }, {
+                    title: 'Panel 2',
+                    width: 100,
+                    html: 'width : 100',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getHeight: function() {return 10;},
+                    
+                    //NOTE: this should be ignored by HBox because we have a different configured width property
+                    getWidth: function() {return 10;}
+                }, {
+                    title: 'Panel 3',
+                    flex: 2,
+                    html: 'flex : 2',
+                    frame: true,
+                    margins: {top: 0, left: 0, right: 0, bottom: 0},
+                    getHeight: function() {return 10;},
+                    getWidth: function() {return 10;}
+                }
+            ];
+            
+            var targetSize = {
+                height: 630,
+                width : 1628
+            };
+            
+            var calcs = layout.calculateChildBoxes(items, targetSize),
+                boxes = calcs.boxes;
+            
+            assert.areEqual(0, boxes[0].left);
+            assert.areEqual(510, boxes[1].left);
+            assert.areEqual(610, boxes[2].left);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'meta data from calculated box sizes',
+        
+        setUp: function() {
+            this.layout = buildLayout();
+            
+            this.items = [
+                buildFakeChild({getHeight: function() {return 50;}, flex: 1}),
+                buildFakeChild({getHeight: function() {return 60;}, flex: 1}),
+                buildFakeChild({getHeight: function() {return 10;}, flex: 1}),
+                buildFakeChild({getHeight: function() {return 80;}, flex: 1})
+            ];
+            
+            this.targetSize = {
+                height: 100,
+                width : 400
+            };
+        },
+        
+        testMaxHeight: function() {
+            var calcs = this.layout.calculateChildBoxes(this.items, this.targetSize),
+                meta  = calcs.meta;
+            
+            assert.areEqual(80, meta.maxHeight);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'update innerCt size',
+        
+        setUp: function() {
+            this.layout = buildLayout({
+                align  : 'stretch',
+                padding: {
+                    top   : 10,
+                    bottom: 20,
+                    left  : 0,
+                    right : 0
+                }
+            });
+            
+            //fake the values that are calculated during onLayout
+            this.layoutTargetLastSize = {
+                width : 400,
+                height: 100
+            };
+            
+            this.childBoxCache = {
+                meta: {
+                    maxHeight: 150
+                }
+            };
+        },
+        
+        testMaintainsHeightForAlignStretch: function() {
+            var layout = this.layout,
+                width, height;
+            
+            //a fake innerCt element that we can intercept calls to setSize on
+            layout.innerCt = {
+                setSize: function(widthArg, heightArg) {
+                    width  = widthArg;
+                    height = heightArg;
+                }
+            };
+            
+            layout.updateInnerCtSize(this.layoutTargetLastSize, this.childBoxCache);
+            
+            assert.areSame(400, width);
+            assert.areSame(100, height);
+        },
+        
+        //if aligning middle, increase height to accomodate the tallest child
+        testIncreasesHeightForAlignMiddle: function() {
+            this.layout = buildLayout({
+                align  : 'middle',
+                padding: {
+                    top   : 10,
+                    bottom: 20,
+                    left  : 0,
+                    right : 0
+                }
+            });
+                        
+            var layout = this.layout,
+                width, height;
+            
+            //a fake innerCt element that we can intercept calls to setSize on
+            layout.innerCt = {
+                setSize: function(widthArg, heightArg) {
+                    width  = widthArg;
+                    height = heightArg;
+                }
+            };
+            
+            layout.updateInnerCtSize(this.layoutTargetLastSize, this.childBoxCache);
+            
+            assert.areSame(400, width);
+            assert.areSame(180, height);
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/ContainerLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/ContainerLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/ContainerLayout.js	(revision 76)
@@ -0,0 +1,160 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.layout.ContainerLayout'),
+        assert = Y.Assert;
+    
+    function buildLayout(config) {
+        var layout = new Ext.layout.FormLayout(config || {});
+        
+        //give a mock container
+        layout.container = {
+            itemCls: 'ctCls'
+        };
+        
+        return layout;
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'parseMargins',
+        
+        setUp: function() {
+            this.cont = new Ext.layout.ContainerLayout();
+        },
+        
+        testParseFromNumber: function() {
+            var res = this.cont.parseMargins(10);
+            
+            assert.areEqual(10, res.top);
+            assert.areEqual(10, res.right);
+            assert.areEqual(10, res.bottom);
+            assert.areEqual(10, res.left);
+        },
+        
+        testParseFromString: function() {
+            var res = this.cont.parseMargins("10");
+            
+            assert.areEqual(10, res.top);
+            assert.areEqual(10, res.right);
+            assert.areEqual(10, res.bottom);
+            assert.areEqual(10, res.left);
+        },
+        
+        testParseFromTwoArgString: function() {
+            var res = this.cont.parseMargins("10 5");
+            
+            assert.areEqual(10, res.top);
+            assert.areEqual(5,  res.right);
+            assert.areEqual(10, res.bottom);
+            assert.areEqual(5,  res.left);
+        },
+        
+        testParseFromThreeArgString: function() {
+            var res = this.cont.parseMargins("10 5 2");
+            
+            assert.areEqual(10, res.top);
+            assert.areEqual(5,  res.right);
+            assert.areEqual(2,  res.bottom);
+            assert.areEqual(5,  res.left);
+        },
+        
+        testParseFromFourArgString: function() {
+            var res = this.cont.parseMargins("10 5 2 1");
+            
+            assert.areEqual(10, res.top);
+            assert.areEqual(5,  res.right);
+            assert.areEqual(2,  res.bottom);
+            assert.areEqual(1,  res.left);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'configureItem',
+        
+        setUp: function() {
+            this.layout = new Ext.layout.ContainerLayout({
+                extraCls: 'myExtraClass'
+            });
+            
+            //mock component object
+            this.component = {
+                addClass: Ext.emptyFn,
+                doLayout: Ext.emptyFn
+            };
+        },
+        
+        testAddsExtraCls: function() {
+            var layout = this.layout;
+            
+            var addedClass = "";
+            
+            //mock component object
+            c = {
+                addClass: function(cls) {
+                    addedClass = cls;
+                }
+            };
+            
+            layout.configureItem(c, 0);
+            
+            assert.areEqual('myExtraClass', addedClass);
+        },
+        
+        testAddsExtraClsToPositionEl: function() {
+            var layout = this.layout;
+            
+            var addedClass = "";
+            
+            //mock component object
+            c = {
+                getPositionEl: function() {
+                    return posEl;
+                }
+            };
+            
+            //mock position el
+            posEl = {
+                addClass: function(cls) {
+                    addedClass = cls;
+                }
+            };
+            
+            layout.configureItem(c, 0);
+            
+            assert.areEqual('myExtraClass', addedClass);
+        },
+        
+        testLaysOutIfForced: function() {
+            var laidOut = false;
+            
+            var layout = this.layout,
+                comp   = this.component;
+            
+            //mock component object
+            comp.doLayout = function() {
+                laidOut = true;
+            };
+            
+            layout.configureItem(comp, 0);
+            
+            assert.isFalse(laidOut);
+            
+            layout.forceLayout = true;
+            layout.configureItem(comp, 0);
+            
+            assert.isTrue(laidOut);
+        },
+        
+        testHidesIfRenderHidden: function() {
+            
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/FormLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/FormLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/layout/FormLayout.js	(revision 76)
@@ -0,0 +1,97 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.layout.FormLayout'),
+        assert = Y.Assert;
+    
+    function buildLayout(config) {
+        var layout = new Ext.layout.FormLayout(config || {});
+        
+        //give a mock container
+        layout.container = {
+            itemCls: 'ctCls'
+        };
+        
+        return layout;
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'getTemplateArgs',
+        
+        setUp: function() {
+            this.layout = buildLayout({
+                labelStyle  : 'color: red;',
+                elementStyle: 'padding-left:0;'
+            });
+            
+            //mock fields
+            this.field1 = {
+                id        : 'myField',
+                itemCls   : 'myCls',
+                clearCls  : 'myClearCls',
+                fieldLabel: 'A Label',
+                labelStyle: 'border-top: 10px;'
+            };
+            
+            this.field2 = {
+                id            : 'myField2',
+                fieldLabel    : 'My Label',
+                labelSeparator: '@'
+            };
+            
+            this.field3 = Ext.apply({}, {
+                fieldLabel: 'Third label',
+                hideLabel : true
+            }, this.field2);
+            
+            this.args1 = this.layout.getTemplateArgs(this.field1);
+            this.args2 = this.layout.getTemplateArgs(this.field2);
+            this.args3 = this.layout.getTemplateArgs(this.field3);
+        },
+        
+        testId: function() {
+            assert.areEqual('myField',  this.args1.id);
+            assert.areEqual('myField2', this.args2.id);
+        },
+        
+        testLabel: function() {
+            assert.areEqual('A Label',     this.args1.label);
+            assert.areEqual('My Label',    this.args2.label);
+            assert.areEqual('Third label', this.args3.label);
+        },
+        
+        //adds field's label style to layout's general label style
+        testLabelStyle: function() {
+            assert.areEqual('color: red;border-top: 10px;', this.args1.labelStyle);
+        },
+        
+        testElementStyle: function() {
+            assert.areEqual('padding-left:0;', this.args1.elementStyle);
+        },
+        
+        testLabelSeparator: function() {
+            assert.areEqual(':', this.args1.labelSeparator);
+            assert.areEqual('@', this.args2.labelSeparator);
+            assert.areEqual('',  this.args3.labelSeparator);
+        },
+        
+        testItemCls: function() {
+            assert.areEqual('myCls', this.args1.itemCls);
+            assert.areEqual('ctCls', this.args2.itemCls);
+            assert.areEqual('ctCls x-hide-label', this.args3.itemCls);
+        },
+        
+        testClearCls: function() {
+            assert.areEqual('myClearCls',        this.args1.clearCls);
+            assert.areEqual('x-form-clear-left', this.args2.clearCls);            
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/FormPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/FormPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/widgets/FormPanel.js	(revision 76)
@@ -0,0 +1,109 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.form.FormPanel'),
+        assert = Y.Assert;
+    
+    function buildForm(config) {
+        return new Ext.form.FormPanel(config);
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'initialization',
+        
+        testCreatesForm: function() {
+            var form = buildForm();
+            
+            assert.isTrue(form.form instanceof Ext.form.BasicForm);
+        },
+        
+        testInitsItems: function() {
+            var FormPanel = Ext.form.FormPanel,
+                proto     = FormPanel.prototype,
+                oldInit   = proto.initItems,
+                wasCalled = false;
+            
+            proto.initItems = function() {
+                wasCalled = true;
+            };
+            
+            var form = buildForm();
+            assert.isTrue(wasCalled);
+            
+            proto.initItems = oldInit;
+        },
+        
+        testStartsMonitoring: function() {
+            var FormPanel = Ext.form.FormPanel,
+                proto     = FormPanel.prototype,
+                oldFunc   = proto.startMonitoring,
+                wasCalled = false;
+            
+            proto.startMonitoring = function() {
+                wasCalled = true;
+            };
+            
+            var form = buildForm({
+                monitorValid: true, 
+                renderTo    : Ext.getBody()
+            });
+            
+            form.render();
+            assert.isTrue(wasCalled);
+            
+            proto.startMonitoring = oldFunc;
+            form.destroy();
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'destruction',
+        
+        testStopMonitoring: function() {
+            var FormPanel = Ext.form.FormPanel,
+                proto     = FormPanel.prototype,
+                oldFunc   = proto.stopMonitoring,
+                wasCalled = false;
+            
+            proto.stopMonitoring = function() {
+                wasCalled = true;
+            };
+            
+            var form = buildForm({
+                monitorValid: true, 
+                renderTo    : Ext.getBody()
+            });
+            
+            form.render();
+            form.destroy();
+            assert.isTrue(wasCalled);
+            
+            proto.stopMonitoring = oldFunc;
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'initFields',
+        
+        testIsField: function() {
+            var mockField = {
+                setValue    : Ext.emptyFn,
+                getValue    : Ext.emptyFn,
+                markInvalid : Ext.emptyFn,
+                clearInvalid: Ext.emptyFn
+            };
+            
+            var form = buildForm();
+            
+            assert.isTrue(form.isField(mockField));
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Array.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Array.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Array.js	(revision 76)
@@ -0,0 +1,69 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Array', {
+
+    name: 'Global Array Decorators',
+    
+    planned: 17,
+    
+    setUp: function(){
+        this.Cls = Ext.extend(Object, {});
+    },
+    
+    // 12
+    test_indexOf: function(){
+        Y.Assert.areEqual(-1, [].indexOf(1), 'Test with an empty array');
+        Y.Assert.areEqual(-1, [0, 1, 2].indexOf(3), 'Test with numbers where the item should not exist');
+        Y.Assert.areEqual(1, [0, 1, 2].indexOf(1), 'Test with numbers where the item should exist');
+        Y.Assert.areEqual(3, [0, 3, 2, 1, 4, 5, 6, 7, 1, 2].indexOf(1), 'Test with numbers where the item exists a number of times');
+        Y.Assert.areEqual(-1, ['x', 'y', 'z'].indexOf('X'), 'Test with strings where the item should not exist');
+        Y.Assert.areEqual(0, ['a', 'x', 'y', 'z'].indexOf('a'), 'Test with strings where the item should exist');
+        Y.Assert.areEqual(-1, [0, 1, 2].indexOf('1'), 'Test to ensure type coercion doesn\'t occur');
+        
+        var c1 = new this.Cls(), 
+            c2 = new this.Cls(), 
+            c3 = new this.Cls(), 
+            c4 = new this.Cls();
+        
+        Y.Assert.areEqual(-1, [c1, c2, c3, c4].indexOf(new this.Cls()), 'Test with object instances, item should not exist');
+        Y.Assert.areEqual(2, [c1, c2, c3, c4].indexOf(c3), 'Test with object instances, item should exist');
+        
+        //test the from parameter
+        Y.Assert.areEqual(-1, [1, 2, 3, 4, 5].indexOf(1, 3), 'Test where the item exists past the from parameter');
+        Y.Assert.areEqual(-1, [1, 2, 3, 4, 5].indexOf(1, 50), 'Test where the item exists, but the index is greater than the array');
+        Y.Assert.areEqual(7, [1, 2, 3, 4, 5, 6, 7, 3].indexOf(3, 4), 'Test where the item more than once, the from should refer to the second item');
+    },
+    
+    // 5
+    test_remove: function(){
+        var arr = [];
+        
+        arr.remove(1);
+        Y.ArrayAssert.isEmpty(arr, 'Test with an empty array');
+        
+        arr = [1, 2, 3];
+        arr.remove(1);
+        Y.ArrayAssert.itemsAreEqual([2, 3], arr, 'Test with a simple removal');
+        
+        arr = [1, 2, 3, 1];
+        arr.remove(1);
+        Y.ArrayAssert.itemsAreEqual([2, 3, 1], arr, 'Test where the item exists more than once');
+        
+        arr = [1, 2, 3, 4];
+        arr.remove(100);
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 4], arr, 'Test where the item doesn\'t exist');
+        
+        var c1 = new this.Cls(), 
+            c2 = new this.Cls(), 
+            c3 = new this.Cls();
+        
+        arr = [c1, c2, c3];
+        arr.remove(c2);
+        Y.ArrayAssert.itemsAreEqual([c1, c3], arr, 'Test with object instances');
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Types.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Types.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Types.js	(revision 76)
@@ -0,0 +1,182 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('DataTypes', {
+    name: 'Test data type conversion',
+    setUp: function(){
+        this.c = function(type, scope, value){
+            return type.convert.call(scope || {}, value);    
+        };
+    },
+    
+    tearDown: function(){
+        delete this.c;
+    },
+    
+    test_auto: function(){
+        var type = Ext.data.Types.AUTO,
+            d = new Date();
+        
+        Y.Assert.areEqual('auto', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(Ext.data.SortTypes.none, type.sortType, 'Check the default sort type');
+        
+        Y.Assert.isUndefined(this.c(type, null, undefined), 'Test convert with undefined');
+        Y.Assert.isNull(this.c(type, null, null), 'Test convert with undefined');
+        Y.Assert.areEqual(1, this.c(type, null, 1), 'Test with a number');
+        Y.Assert.areEqual(-37.4, this.c(type, null, -37.4), 'Test with a float');
+        Y.Assert.areEqual('foo', this.c(type, null, 'foo'), 'Test with a string');
+        Y.Assert.areEqual(d, this.c(type, null, d), 'Test with a date');
+        Y.Assert.isTrue(this.c(type, null, true), 'Test with a boolean value');
+    },
+    
+    test_string: function(){
+        var type = Ext.data.Types.STRING,
+            d = new Date();
+            
+        Y.Assert.areEqual('string', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(Ext.data.SortTypes.asUCString, type.sortType, 'Check the default sort type');
+        
+        Y.Assert.areEqual('', this.c(type, null, undefined), 'Test with undefined');
+        Y.Assert.areEqual('', this.c(type, null, null), 'Test with null');
+        Y.Assert.areEqual('', this.c(type, null, ''), 'Test with empty string');
+        Y.Assert.areEqual('username', this.c(type, null, 'username'), 'Test with simple string');
+        Y.Assert.areEqual('72', this.c(type, null, 72), 'Test with integer');
+        Y.Assert.areEqual('3.4', this.c(type, null, 3.4), 'Test with float number');
+        Y.Assert.areEqual('false', this.c(type, null, 'false'), 'Test with boolean false');
+        Y.Assert.areEqual(d.toString(), this.c(type, null, d), 'Test with date');
+    },
+    
+    test_int: function(){
+        var type = Ext.data.Types.INT;
+        
+        Y.Assert.areEqual('int', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(type, Ext.data.Types.INTEGER, 'Test INTEGER alias works correctly');
+        Y.Assert.areEqual(Ext.data.SortTypes.none, type.sortType, 'Check the default sort type');
+        
+        // test invalid
+        Y.Assert.areEqual(0, this.c(type, null, undefined), 'Test with undefined');
+        Y.Assert.areEqual(0, this.c(type, null, null), 'Test with null');
+        Y.Assert.areEqual(0, this.c(type, null, ''), 'Test with empty string');
+        
+        // test expected
+        Y.Assert.areEqual(14, this.c(type, null, '14'), 'Test with numeric string value');
+        Y.Assert.areEqual(100, this.c(type, null, 100), 'Test with integer');
+        Y.Assert.areEqual(-12, this.c(type, null, -12), 'Test with negative integer');
+        
+        // test with floats
+        Y.Assert.areEqual(71, this.c(type, null, 71.41), 'Test with float');
+        Y.Assert.areEqual(-14, this.c(type, null, -14.99), 'Test with negative float');
+        Y.Assert.areEqual(16, this.c(type, null, '16.03'), 'Test with float (string)');
+        
+        // test stripRe
+        Y.Assert.areEqual(12, this.c(type, null, '$12'), 'Test with $ in the string');
+        Y.Assert.areEqual(-112, this.c(type, null, '-112%'), 'Test with %');
+        Y.Assert.areEqual(123456, this.c(type, null, '123,456.00'), 'Test with , seperating numbers');
+        
+        //custom stripRe
+        var orig = Ext.data.Types.stripRe;
+        Ext.data.Types.stripRe = /[!]/g;
+        
+        Y.Assert.areEqual(987654, this.c(type, null, '987!654.34'), 'Test with custom stripRe');
+        
+        Ext.data.Types.stripRe = orig;
+    },
+    
+    test_float: function(){
+        var type = Ext.data.Types.FLOAT;
+        
+        Y.Assert.areEqual('float', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(type, Ext.data.Types.NUMBER, 'Test NUMBER alias works correctly');
+        Y.Assert.areEqual(Ext.data.SortTypes.none, type.sortType, 'Check the default sort type');
+        
+        // test invalid
+        Y.Assert.areEqual(0, this.c(type, null, undefined), 'Test with undefined');
+        Y.Assert.areEqual(0, this.c(type, null, null), 'Test with null');
+        Y.Assert.areEqual(0, this.c(type, null, ''), 'Test with empty string');
+        
+        // test ints
+        Y.Assert.areEqual(14, this.c(type, null, '14'), 'Test with numeric string value');
+        Y.Assert.areEqual(100, this.c(type, null, 100), 'Test with integer');
+        Y.Assert.areEqual(-12, this.c(type, null, -12), 'Test with negative integer');
+        
+        // test with floats
+        Y.Assert.areEqual(71.41, this.c(type, null, 71.41), 'Test with float');
+        Y.Assert.areEqual(-14.99, this.c(type, null, -14.99), 'Test with negative float');
+        Y.Assert.areEqual(16.03, this.c(type, null, '16.03'), 'Test with float (string)');
+        
+        // test stripRe
+        Y.Assert.areEqual(198.54, this.c(type, null, '$198.54'), 'Test with $ in the string');
+        
+        //custom stripRe
+        var orig = Ext.data.Types.stripRe;
+        Ext.data.Types.stripRe = /[\$,]/g;
+        
+        Y.Assert.areEqual(121343.17, this.c(type, null, '$121,343.17'), 'Test with custom stripRe');
+        
+        Ext.data.Types.stripRe = orig;
+    },
+    
+    test_bool: function(){
+        var type = Ext.data.Types.BOOL;
+        
+        Y.Assert.areEqual('bool', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(type, Ext.data.Types.BOOLEAN, 'Test BOOLEAN alias works correctly');
+        Y.Assert.areEqual(Ext.data.SortTypes.none, type.sortType, 'Check the default sort type');
+        
+        Y.Assert.isTrue(this.c(type, null, true), 'Test with true (boolean)');
+        Y.Assert.isTrue(this.c(type, null, 'true'), 'Test with true (string)');
+        Y.Assert.isTrue(this.c(type, null, 1), 'Test with 1 (number)' );
+        Y.Assert.isTrue(this.c(type, null, '1'), 'Test with 1 (string)');
+        
+        Y.Assert.isFalse(this.c(type, null, false), 'Test with bool');
+        Y.Assert.isFalse(this.c(type, null, 7), 'Test with number');
+        Y.Assert.isFalse(this.c(type, null, 'foo'), 'Test with string');
+        Y.Assert.isFalse(this.c(type, null, {}), 'Test with object');
+        Y.Assert.isFalse(this.c(type, null, []), 'Test with array');
+        Y.Assert.isFalse(this.c(type, null, new Date()), 'Test with date');
+    },
+    
+    test_date: function(){
+        var type = Ext.data.Types.DATE,
+            d = new Date();
+        
+        Y.Assert.areEqual('date', type.type, 'Check the string representation is correct');
+        Y.Assert.areEqual(Ext.data.SortTypes.asDate, type.sortType, 'Check the default sort type');
+        
+        Y.Assert.isNull(this.c(type, null, undefined), 'Test with undefined');
+        Y.Assert.isNull(this.c(type, null, null), 'Test with null');
+        Y.Assert.isNull(this.c(type, null, false), 'Test with false');
+        Y.Assert.areEqual(d, this.c(type, null, d), 'Test with date');
+        
+        // these aren't really great, but they aren't to test the validity of the dates, just that they get parsed
+        // in the right format and returned.
+        
+        // timestamp
+        var n = 1234567890;
+        d = new Date(n * 1000);
+        Y.Assert.areEqual(d.getTime(), this.c(type, {dateFormat: 'timestamp'}, n).getTime(), 'Test with timestamp format');
+        
+        // time
+        var n = 11111111110000;
+        d = new Date(n);
+        Y.Assert.areEqual(d.getTime(), this.c(type, {dateFormat: 'time'}, n).getTime(), 'Test with time format');
+        
+        //custom format
+        var format = 'Y-m-d',
+            val = '1986-03-03';
+            
+        d = Date.parseDate(val, format);
+        Y.Assert.areEqual(d.getTime(), this.c(type, {dateFormat: format}, val).getTime(), 'Test with custom format (Y-m-d)');
+        
+        //no format, default parse
+        val = 'Wed, 18 Oct 2002 13:00:00';
+        d = Date.parse(val);
+        Y.Assert.areEqual(d, this.c(type, null, val).getTime(), 'Test with no format, valid date');
+        
+        val = 'will fail';
+        Y.Assert.isNull(this.c(type, null, val), 'Test with no format, invalid date');
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/GroupingStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/GroupingStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/GroupingStore.js	(revision 76)
@@ -0,0 +1,386 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.data.GroupingStore'),
+        assert = Y.Assert;
+    
+    //a shared setup function used by several of the suites
+    var defaultSetup = function(config) {
+        config = config || {};
+              
+        Ext.applyIf(config, {
+            proxy : new Ext.data.MemoryProxy({}),
+            reader: new Ext.data.ArrayReader({}, [
+                {name: 'name',      type: 'string'},
+                {name: 'email',     type: 'string'},
+                {name: 'greatness', type: 'int'},
+                {name: 'group',     type: 'string'},
+                {name: 'old',       type: 'boolean'}
+            ]),
+            storeId: 'myStore',
+            remoteSort : false,
+            remoteGroup: false,
+            groupField : 'group',
+            
+            sortInfo: {field: 'name', direction: 'ASC'}
+        });
+        
+        var store = new Ext.data.GroupingStore(config);
+        
+        store.loadData([
+            ['Ed Spencer',   'ed@extjs.com',    100, 'code',  false],
+            ['Abe Elias',    'abe@extjs.com',   70,  'admin', false],
+            ['Aaron Conran', 'aaron@extjs.com', 5,   'admin', true],
+            ['Tommy Maintz', 'tommy@extjs.com', -15, 'code',  true]
+        ]);
+        
+        return store;
+    };
+    
+    suite.add(new Y.Test.Case({
+        name: 'constructor',
+        
+        testAppliesGroupField: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.applyGroupField,
+                wasCalled     = false;
+            
+            proto.applyGroupField = function() {
+                wasCalled = true;
+            };
+            
+            var store = new GroupingStore();
+            assert.isTrue(wasCalled);
+            
+            proto.applyGroupField = oldFunc;
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'clear grouping',
+        
+        testUnsetsGroupField: function() {
+            var store = defaultSetup();
+            store.groupField = 'abc';
+            
+            store.clearGrouping();
+            assert.isFalse(store.groupField);
+        },
+        
+        testLocalGroupingAppliesSort: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.sort,
+                wasCalled     = false;
+            
+            proto.sort = function() {
+                wasCalled = true;
+            };
+            
+            var store = defaultSetup({remoteGroup: false});
+            store.clearGrouping();
+            
+            assert.isTrue(wasCalled);
+            
+            proto.sort = oldFunc;
+        },
+        
+        testLocalGroupingFiresEvent: function() {
+            var store = defaultSetup({remoteGroup: false}),
+                fired = false;
+            
+            store.on('datachanged', function() {
+                fired = true;
+            }, this);
+            
+            store.clearGrouping();
+            assert.isTrue(fired);
+        },
+        
+        testRemoteGroupingReloads: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.reload,
+                wasCalled     = false;
+            
+            proto.reload = function() {
+                wasCalled = true;
+            };
+            
+            var store = defaultSetup({remoteGroup: true});
+            store.clearGrouping();
+            
+            assert.isTrue(wasCalled);
+            
+            proto.reload = oldFunc;
+        },
+        
+        testRemoteGroupingDeletesBaseParams: function() {
+            var store = defaultSetup({remoteGroup: true});
+            
+            //these params should be deleted
+            Ext.apply(store.baseParams, {
+                groupBy : 'abc',
+                groupDir: 'ASC'
+            });
+            
+            store.clearGrouping();
+            
+            assert.isUndefined(store.baseParams.groupBy);
+            assert.isUndefined(store.baseParams.groupDir);
+        },
+        
+        testRemoteGroupingDeletesLastOptions: function() {
+            var store = defaultSetup({remoteGroup: true});
+            
+            //these params should be deleted
+            store.lastOptions        = store.lastOptions        || {};
+            store.lastOptions.params = store.lastOptions.params || {};
+            
+            Ext.apply(store.lastOptions.params, {
+                groupBy : 'abc',
+                groupDir: 'ASC'
+            });
+            
+            store.clearGrouping();
+            
+            assert.isUndefined(store.lastOptions.params.groupBy);
+            assert.isUndefined(store.lastOptions.params.groupDir);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'group by',
+        
+        testForceRegroup: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.applyGroupField,
+                callCount     = 0;
+            
+            proto.applyGroupField = function() {
+                callCount++;
+            };
+            
+            var store = defaultSetup({sortInfo: {field: 'name', direction: 'ASC'}});
+            store.groupBy('name', 'DESC');
+            
+            var currentCallCount = callCount;
+            
+            //this should activate another group operation
+            store.groupBy('name', 'DESC', true);
+            
+            //cleanup
+            proto.applyGroupField = oldFunc;
+            
+            assert.areEqual(currentCallCount + 1, callCount);
+        },
+        
+        //if we already group by this field and direction, it should not group again
+        testNoForceRegroup: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.applyGroupField,
+                callCount     = 0;
+            
+            proto.applyGroupField = function() {
+                callCount++;
+            };
+            
+            var store = defaultSetup({sortInfo: {field: 'name', direction: 'ASC'}});
+            store.groupBy('name');
+            
+            var currentCallCount = callCount;
+            
+            //this should not activate another group operation
+            store.groupBy('name');
+            
+            //cleanup
+            proto.applyGroupField = oldFunc;
+            
+            assert.areEqual(currentCallCount, callCount);
+        },
+        
+        testSetsGroupDir: function() {
+            var store = defaultSetup({sortInfo: {field: 'name', direction: 'ASC'}});
+            store.groupBy('name');
+            
+            assert.areEqual('name', store.groupField);
+        },
+        
+        testSetsGroupField: function() {
+            var store = defaultSetup({sortInfo: {field: 'name', direction: 'ASC'}});
+            store.groupBy('name', false, 'DESC');
+            
+            assert.areEqual('DESC', store.groupDir);
+        },
+        
+        testAppliesGroupField: function() {
+            var GroupingStore = Ext.data.GroupingStore,
+                proto         = GroupingStore.prototype,
+                oldFunc       = proto.applyGroupField,
+                wasCalled     = false;
+            
+            proto.applyGroupField = function() {
+                wasCalled = true;
+            };
+            
+            var store = defaultSetup({sortInfo: {field: 'name', direction: 'ASC'}});
+            store.groupBy('name');
+            
+            //cleanup
+            proto.applyGroupField = oldFunc;
+            
+            assert.isTrue(wasCalled);
+        },
+        
+        testReloadsIfRemote: function() {
+            var fired = false;
+            var store = defaultSetup({
+                remoteGroup: true, 
+                sortInfo   : {field: 'name', direction: 'ASC'}
+            });
+            
+            //fake a remote load
+            store.load = function() {
+                fired = true;
+            };
+            
+            store.groupBy('name');
+            
+            assert.isTrue(fired);
+        },
+        
+        testFiresDatachangedIfLocal: function() {
+            var fired = false,
+                store = defaultSetup({remoteGroup: false, sortInfo: {field: 'name', direction: 'ASC'}});
+            
+            store.on('datachanged', function() {
+                fired = true;
+            }, this);
+            
+            store.groupBy('name');
+            
+            assert.isTrue(fired);
+        },
+        
+        testFiresGroupchangeIfLocal: function() {
+            var fired = false,
+                store = defaultSetup({remoteGroup: false, sortInfo: {field: 'name', direction: 'ASC'}});
+            
+            store.on('groupchange', function() {
+                fired = true;
+            }, this);
+            
+            store.groupBy('name');
+            
+            assert.isTrue(fired);
+        },
+        
+        testFiresGroupchangeIfRemote: function() {
+            var fired = false;
+            var store = defaultSetup({
+                remoteGroup: true, 
+                sortInfo   : {field: 'name', direction: 'ASC'}
+            });
+            
+            //fake a remote load
+            store.load = function() {
+                store.fireEvent('load', store);
+            };
+            
+            store.on('groupchange', function() {
+                fired = true;
+            }, this);
+            
+            store.groupBy('name');
+            
+            assert.isTrue(fired);
+        },
+        
+        testGroupOnSort: function() {
+            
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'apply group field',
+        
+        setUp: function() {
+            this.store = defaultSetup({
+                remoteGroup: true
+            });
+            
+            this.store.groupField  = 'abc';
+            this.store.groupDir    = 'DESC';            
+            this.store.lastOptions = {params: {}};
+        },
+        
+        testSetsBaseParams: function() {
+            this.store.applyGroupField();
+            
+            assert.areEqual('abc',  this.store.baseParams.groupBy);
+            assert.areEqual('DESC', this.store.baseParams.groupDir);
+        },
+        
+        testSetsLastOptionsGroupDir: function() {
+            this.store.applyGroupField();
+            
+            assert.areEqual('DESC', this.store.lastOptions.params.groupDir);
+        },
+        
+        testDeletesLastOptionsGroupBy: function() {
+            this.store.applyGroupField();
+            
+            assert.isUndefined(this.store.lastOptions.params.groupBy);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'apply sort'
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'apply grouping'
+    }));
+    
+    //not really sure what this function does or why it does it. These tests just ensure
+    //that any refactoring does not break it
+    suite.add(new Y.Test.Case({
+        name: 'get group state',
+
+        testReturnsGroupField: function() {
+            var store = defaultSetup();
+            store.groupField = 'abc';
+            
+            assert.areEqual('abc', store.getGroupState());
+        },
+        
+        //if only sorting is on sortinfo
+        testReturnsSortInfoField: function() {
+            var store = defaultSetup({groupOnSort: true});
+            store.groupField = 'abc';
+            store.sortInfo   = {field: 'def'};
+            
+            assert.areEqual('def', store.getGroupState());
+        },
+        
+        //if no sorting is applied anywhere
+        testReturnsUndefined: function() {
+            var store = defaultSetup({groupOnSort: true});
+            store.groupField = 'abc';
+            store.sortInfo   = {};
+            
+            assert.isUndefined(store.getGroupState());
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/JsonReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/JsonReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/JsonReader.js	(revision 76)
@@ -0,0 +1,171 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+var suite = Ext.test.session.getSuite('JsonReader');
+
+suite.add(new Y.Test.Case({
+    name: 'buildExtractors',
+    setUp: function() {
+        this.reader = new Ext.data.JsonReader({
+            root: 'data',
+            idProperty: 'id',
+            totalProperty: 'totalProp',
+            messageProperty: 'messageProp',
+            successProperty: 'successProp',
+            fields: [
+               {mapping: 'mappy', name: 'inter', type: 'integer'}
+            ]
+        });
+        this.reader.buildExtractors();
+    },
+    tearDown: function() {
+        delete this.reader;
+    },
+    test_getTotal: function() {
+        Y.Assert.areSame(this.reader.getTotal({ totalProp: 500}), 500);
+    },
+    test_getSuccess: function() {
+        Y.Assert.areSame(this.reader.getSuccess({ successProp: false }), false);
+    },
+    test_getMessage: function() {
+        Y.Assert.areSame(this.reader.getMessage({ messageProp: 'Hello' }), 'Hello');
+    },
+    test_getRoot: function() {
+        Y.Assert.areSame(this.reader.getRoot({ data: 'data' }), 'data');
+    },
+    test_getId: function() {
+        Y.Assert.areSame(this.reader.getId({ id: 100 }), 100);
+    },
+    test_mapping: function() {
+        Y.Assert.areSame(this.reader.ef[0]({ mappy: 200 }), 200);
+    }
+}));
+
+suite.add(new Y.Test.Case({
+    name: 'readRecords',
+    setUp: function() {
+        this.reader = new Ext.data.JsonReader({
+            root: 'data',
+            idProperty: 'id',
+            totalProperty: 'totalProp',
+            messageProperty: 'Hello World',
+            successProperty: 'successProp',
+            fields: [
+               {name: 'id'},
+               {name: 'floater', type: 'float'},
+               {name: 'bool', type: 'boolean'},
+               {name: 'inter', type: 'integer'}
+            ]
+        });
+        this.data1 = {
+            id: 1,
+            floater: 1.23,
+            bool: true,
+            inter: 8675
+        };
+        this.rec1 = this.reader.readRecords({
+            data: [this.data1],
+            successProp: true,
+            totalProp: 2
+        });
+        this.rec2 = this.reader.readRecords({
+            data: [{
+                id: 2,
+                floater: 4.56,
+                bool: false,
+                inter: 309
+            }],
+            successProp: false,
+            totalProp: 6
+        });
+    },
+    test_tearDown: function() {
+        delete this.reader;
+        delete this.data1;
+        delete this.rec1;
+        delete this.rec2;
+    },
+    test_SuccessProperty: function() {
+        Y.Assert.areSame(this.rec1.success, true);
+        Y.Assert.areSame(this.rec2.success, false);
+    },
+    test_TotalRecords: function() {
+        Y.Assert.areSame(this.rec1.totalRecords, 2);
+        Y.Assert.areSame(this.rec2.totalRecords, 6);
+    },
+    test_Records: function() {
+        Y.Assert.areSame(this.rec1.records[0].data.id, this.data1.id);
+        Y.Assert.areSame(this.rec1.records[0].data.floater, this.data1.floater);
+        Y.Assert.areSame(this.rec1.records[0].data.bool, this.data1.bool);
+        Y.Assert.areSame(this.rec1.records[0].data.inter, this.data1.inter);
+    }
+}));
+
+suite.add(new Y.Test.Case({
+    name: 'readResponse',
+    setUp: function() {
+        this.reader = new Ext.data.JsonReader({
+            root: 'data',
+            idProperty: 'id',
+            totalProperty: 'totalProp',
+            messageProperty: 'messageProp',
+            successProperty: 'successProp',
+            fields: [
+               {name: 'id'},
+               {name: 'floater', type: 'float'},
+               {name: 'bool', type: 'boolean'},
+               {name: 'inter', type: 'integer'}
+            ]
+        });
+        this.data1 = {
+            id: 1,
+            floater: 1.23,
+            bool: true,
+            inter: 8675
+        };
+        this.rec1 = this.reader.readResponse('read', {
+            data: [this.data1],
+            successProp: true,
+            totalProp: 2,
+            messageProp: 'Hello'
+        });
+        this.rec2 = this.reader.readResponse('read', {
+            data: [{
+                id: 2,
+                floater: 4.56,
+                bool: false,
+                inter: 309
+            }],
+            successProp: false,
+            totalProp: 6
+        });
+    },
+    tearDown: function() {
+        delete this.reader;
+        delete this.data1;
+        delete this.rec1;
+        delete this.rec2;
+    },
+    test_SuccessProperty: function() {
+        Y.Assert.areSame(this.rec1.success, true);
+        Y.Assert.areSame(this.rec2.success, false);
+    },
+    test_Records: function() {
+        Y.Assert.areSame(this.rec1.data[0].id, this.data1.id);
+        Y.Assert.areSame(this.rec1.data[0].floater, this.data1.floater);
+        Y.Assert.areSame(this.rec1.data[0].bool, this.data1.bool);
+        Y.Assert.areSame(this.rec1.data[0].inter, this.data1.inter);
+    },
+    test_ActionProperty: function() {
+        Y.Assert.areSame(this.rec1.action, 'read');
+    },
+    test_MessageProperty: function() {
+        Y.Assert.areSame(this.rec1.message, 'Hello');
+    },
+    test_RawProperty: function() {
+        Y.Assert.areSame(this.rec1.raw.data[0].id, this.data1.id);
+    }
+}));
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Store.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Store.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/Store.js	(revision 76)
@@ -0,0 +1,588 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.data.Store'),
+        assert = Y.Assert;
+
+    //a shared setup function used by several of the suites
+    var defaultSetup = function() {
+        this.store = new Ext.data.Store({
+            proxy : new Ext.data.MemoryProxy({}),
+            reader: new Ext.data.ArrayReader({}, [
+                {name: 'name',      type: 'string'},
+                {name: 'email',     type: 'string'},
+                {name: 'greatness', type: 'int'},
+                {name: 'group',     type: 'string'},
+                {name: 'old',       type: 'boolean'}
+            ]),
+            storeId: 'myStore',
+            remoteSort: false
+        });
+
+        this.store.loadData([
+            ['Ed Spencer',   'ed@extjs.com',    100, 'code',  false],
+            ['Abe Elias',    'abe@extjs.com',   70,  'admin', false],
+            ['Aaron Conran', 'aaron@extjs.com', 5,   'admin', true],
+            ['Tommy Maintz', 'tommy@extjs.com', -15, 'code',  true]
+        ]);
+    };
+
+    suite.add(new Y.Test.Case({
+        name: 'local single sorting',
+
+        setUp: defaultSetup,
+
+        testSetDefaultSort: function() {
+            this.store.setDefaultSort('name', 'DESC');
+
+            var store    = this.store,
+                sortInfo = store.sortInfo;
+
+            assert.areEqual('name', sortInfo.field);
+            assert.areEqual('DESC', sortInfo.direction);
+            assert.areEqual('DESC', store.sortToggle['name']);
+        },
+
+        testSetDefaultSortDefaultToASC: function() {
+            this.store.setDefaultSort('email');
+
+            var store    = this.store,
+                sortInfo = store.sortInfo;
+
+            assert.areEqual('email', sortInfo.field);
+            assert.areEqual('ASC', sortInfo['direction']);
+            assert.areEqual('ASC', store.sortToggle['email']);
+        },
+
+        testSortByField: function() {
+            var store = this.store;
+
+            store.sort('name', 'ASC');
+            assert.areEqual('Aaron Conran', store.getAt(0).get('name'));
+            assert.areEqual('Abe Elias',    store.getAt(1).get('name'));
+            assert.areEqual('Ed Spencer',   store.getAt(2).get('name'));
+            assert.areEqual('Tommy Maintz', store.getAt(3).get('name'));
+        },
+
+        testToggling: function() {
+            var store = this.store;
+
+            store.sort('name', 'ASC');
+
+            //second call to sort toggles the direction
+            store.sort('name');
+
+            assert.areEqual('Aaron Conran', store.getAt(3).get('name'));
+            assert.areEqual('Abe Elias',    store.getAt(2).get('name'));
+            assert.areEqual('Ed Spencer',   store.getAt(1).get('name'));
+            assert.areEqual('Tommy Maintz', store.getAt(0).get('name'));
+        },
+
+        testSetsHasMultiSort: function() {
+            this.store.sort('name', 'ASC');
+
+            assert.isFalse(this.store.hasMultiSort);
+        },
+
+        testEventFired: function() {
+            var executed = false,
+                store    = this.store;
+
+            store.on('datachanged', function() {
+                executed = true;
+            }, this);
+
+            store.sort('name');
+            assert.isTrue(executed);
+        },
+
+        testSavesSortInfo: function() {
+            var store = this.store;
+
+            store.sort('name', 'DESC');
+
+            assert.areEqual('name', store.sortInfo.field);
+            assert.areEqual('DESC', store.sortInfo.direction);
+        },
+
+        //if we tell store to sort on a non-existent field it should return false and do nothing
+        testInvalidFieldIgnored: function() {
+            var store = this.store;
+
+            //first we'll sort by name to give some reference sorting
+            store.sort('name', 'ASC');
+
+            assert.isFalse(store.sort('someUnknownField'));
+
+            //make sure the original sorting was preserved
+            assert.areEqual('Aaron Conran', store.getAt(0).get('name'));
+            assert.areEqual('Abe Elias',    store.getAt(1).get('name'));
+            assert.areEqual('Ed Spencer',   store.getAt(2).get('name'));
+            assert.areEqual('Tommy Maintz', store.getAt(3).get('name'));
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'local multiple sorting',
+
+        setUp: function() {
+            defaultSetup.call(this);
+
+            this.sorters = [
+                {
+                    field    : 'group',
+                    direction: 'ASC'
+                },
+                {
+                    field    : 'old',
+                    direction: 'DESC'
+                }
+            ];
+        },
+
+        testSetsHasMultiSort: function() {
+            this.store.sort(this.sorters);
+
+            assert.isTrue(this.store.hasMultiSort);
+        },
+
+        testMultipleSorters: function() {
+            var store   = this.store,
+                sorters = this.sorters;
+
+            store.sort(sorters);
+
+            assert.areEqual('Aaron Conran', store.getAt(0).get('name'));
+            assert.areEqual('Abe Elias',    store.getAt(1).get('name'));
+            assert.areEqual('Tommy Maintz', store.getAt(2).get('name'));
+            assert.areEqual('Ed Spencer',   store.getAt(3).get('name'));
+        }
+
+        // testMultipleSorterToggling: function() {
+        //     var store   = this.store,
+        //         sorters = this.sorters;
+        //
+        //     //first we'll sort to give some reference sorting
+        //     store.sort(sorters, "ASC");
+        //
+        //     //second call to sort toggles direction
+        //     store.sort(sorters);
+        //
+        //     assert.areEqual('Aaron Conran', store.getAt(3).get('name'));
+        //     assert.areEqual('Abe Elias',    store.getAt(2).get('name'));
+        //     assert.areEqual('Tommy Maintz', store.getAt(1).get('name'));
+        //     assert.areEqual('Ed Spencer',   store.getAt(0).get('name'));
+        // }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'single filtering',
+
+        setUp: defaultSetup,
+
+        testFilterByField: function() {
+            var store = this.store;
+
+            store.filter('group', 'code');
+            assert.areEqual(2, store.getCount());
+        },
+
+        testFilterByFieldAnyMatch: function() {
+            var store = this.store;
+
+            store.filter('email', 'extjs', true);
+            assert.areEqual(4, store.getCount());
+        },
+
+        testFilterByFieldCaseSensitive: function() {
+            var store = this.store;
+
+            store.filter('group', 'Code', false, true);
+            assert.areEqual(0, store.getCount());
+        },
+
+        testFilterByFieldExactMatch: function() {
+            var store = this.store;
+
+            store.filter('email', 'aaron', false, false, true);
+            assert.areEqual(0, store.getCount());
+        },
+
+        testClearFilter: function() {
+            var store    = this.store,
+                executed = false;
+
+            store.on('datachanged', function() {
+                executed = true;
+            }, this);
+
+            store.filter('group', 'code');
+            assert.areEqual(2, store.getCount());
+
+            store.clearFilter();
+            assert.areEqual(4, store.getCount());
+
+            assert.isTrue(executed);
+        },
+
+        testSuppressClearFilterEvent: function() {
+            var store    = this.store,
+                executed = false;
+
+            store.filter('group', 'email');
+            store.clearFilter(true);
+
+            store.on('datachanged', function() {
+                executed = true;
+            }, this);
+            assert.isFalse(executed);
+        },
+
+        testIsFiltered: function() {
+            var store = this.store;
+
+            assert.isFalse(store.isFiltered());
+            store.filter('group', 'code');
+            assert.isTrue(store.isFiltered());
+        },
+
+        testFilterByFunction: function() {
+            var store = this.store,
+                execScope,
+                executed;
+
+            store.on('datachanged', function() {
+                executed = true;
+            }, this);
+
+            var filterFn = function(item) {
+                execScope = this;
+
+                return item.get('greatness') > 50;
+            };
+
+            store.filterBy(filterFn, this);
+            assert.areEqual(this, execScope);
+            assert.areEqual(2, store.getCount());
+            assert.isTrue(executed);
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name : 'filtering more than once',
+        setUp: defaultSetup,
+
+        testFirstFilterIsCleared: function() {
+            var store = this.store;
+
+            store.filter('group', 'code');
+            assert.areEqual(2, store.getCount());
+
+            store.filter('old', false);
+
+            //if filter had not been reset first, count would be 1
+            assert.areEqual(2, store.getCount());
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name : 'multiple filters',
+        setUp: function() {
+            defaultSetup.call(this);
+
+            this.filters = [
+                {
+                    property: 'group',
+                    value   : 'code'
+                },
+                {
+                    property: 'old',
+                    value   : true
+                }
+            ];
+        },
+
+        testMultipleBasicFilters: function() {
+            this.store.filter(this.filters);
+
+            //applying the filter set above shoule yield one result
+            assert.areEqual(1, this.store.getCount());
+            assert.areEqual('Tommy Maintz', this.store.data.first().get('name'));
+        },
+
+        testMultiFiltersFiresDataChanged: function() {
+            var executed = false;
+
+            this.store.on('datachanged', function() {
+                executed = true;
+            }, this);
+
+            this.store.filter(this.filters);
+
+            assert.isTrue(executed);
+        },
+
+        //tests that the anyMatch and caseSensitive defaults are correctly applied
+        testMultiFilterDefaults: function() {
+            //PENDING
+        },
+
+        //tests a single custom filter
+        testCustomFilter: function() {
+            var execScope;
+
+            //tests that the passed filter function is called
+            //tests that the filter is called in the right scope
+            this.store.filter({
+                fn: function(record) {
+                    execScope = this;
+                    return record.get('group') == 'admin' && record.get('old') === true;
+                },
+                scope: this
+            });
+
+            assert.areEqual(this, execScope);
+            assert.areEqual(1, this.store.getCount());
+            assert.areEqual('Aaron Conran', this.store.data.first().get('name'));
+        },
+
+        //tests multiple filters where we pass in custom matcher functions
+        testMultiCustomFilters: function() {
+            this.store.filter([
+                {
+                    fn: function(record) {
+                        return record.get('group') == 'admin';
+                    }
+                },
+                {
+                    fn: function(record) {
+                        return record.get('old') === false;
+                    }
+                }
+            ]);
+
+            assert.areEqual(1, this.store.getCount());
+            assert.areEqual('Abe Elias', this.store.data.first().get('name'));
+        },
+
+        testBasicAndCustomFilters: function() {
+            //should return a single result - Ed Spencer
+            this.store.filter([
+                {
+                    fn: function(record) {
+                        return record.get('old') === false;
+                    }
+                },
+                {
+                    property: 'group',
+                    value   : 'code'
+                }
+            ]);
+
+            assert.areEqual(1, this.store.getCount());
+            assert.areEqual('Ed Spencer', this.store.data.first().get('name'));
+        },
+
+        testClearMultipleFilters: function() {
+            this.store.filter(this.filters);
+            assert.areEqual(1, this.store.getCount());
+
+            //make sure that clearing multiple filters is still correct
+            this.store.clearFilter();
+            assert.areEqual(4, this.store.getCount());
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'inserting and removing',
+
+        testInsert: function() {
+            //PENDING
+        },
+
+        testInsertFiresAddEvent: function() {
+            //PENDING
+        },
+
+        testRemove: function() {
+            //PENDING
+        },
+
+        testRemoveAll: function() {
+            //PENDING
+        },
+
+        testRemoveAt: function() {
+            //PENDING
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'destroying',
+
+        setUp: defaultSetup,
+
+        //we hijack Ext.StoreMgr.unregister temporarily and then set it back in this test case
+        testUnregistersFromStore: function() {
+            var executed   = false,
+                arg        = undefined,
+                unregister = Ext.StoreMgr.unregister;
+
+            Ext.StoreMgr.unregister = function(store) {
+                executed = true;
+                arg = store;
+            };
+
+            this.store.destroy();
+
+            assert.isTrue(executed);
+            assert.areEqual(this.store, arg);
+
+            Ext.StoreMgr.unregister = unregister;
+        },
+
+        testClearsData: function() {
+            var executed = false;
+            this.store.clearData = function() {
+                executed = true;
+            };
+
+            this.store.destroy();
+            assert.isTrue(executed);
+        },
+
+        testDestroysProxy: function() {
+            var executed = false,
+                arg      = undefined,
+                proxy    = this.store.proxy,
+                destroy  = Ext.destroy;
+
+            Ext.destroy = function(store) {
+                executed = true;
+                arg = store;
+            };
+
+            this.store.destroy();
+
+            assert.isTrue(executed);
+            assert.areEqual(proxy, arg);
+
+            Ext.destroy = destroy;
+        },
+
+        testUnsetsReferences: function() {
+            this.store.destroy();
+
+            assert.isNull(this.store.reader);
+            assert.isNull(this.store.writer);
+            assert.isNull(this.store.data);
+        },
+
+        testIsDestroyed: function() {
+            assert.isFalse(this.store.isDestroyed);
+
+            this.store.destroy();
+
+            assert.isTrue(this.store.isDestroyed);
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'counting and iterators',
+
+        setUp: defaultSetup,
+
+        testGetCount: function() {
+            assert.areEqual(4, this.store.getCount());
+        },
+
+        testGetTotalCount: function() {
+            //PENDING - need a fake remote data set test with paging
+        },
+
+        testEach: function() {
+            var count = 0,
+                callScope;
+
+            this.store.each(function() {
+                callScope = this;
+                count ++;
+            }, this);
+
+            assert.areEqual(4, count);
+            assert.areEqual(this, callScope);
+        },
+
+        testSum: function() {
+            var sum = this.store.sum('greatness');
+
+            assert.areEqual(160, sum);
+        },
+
+        testSumWithStartAndEnd: function() {
+            var sum = this.store.sum('greatness', 1, 3);
+
+            assert.areEqual(60, sum);
+        },
+
+        //a normal collect test - check that we're pulling the right values out of the store
+        testCollect: function() {
+            var values = this.store.collect('name');
+
+            assert.areEqual(4, values.length);
+            assert.areNotEqual(-1, values.indexOf("Ed Spencer"));
+            assert.areNotEqual(-1, values.indexOf("Abe Elias"));
+            assert.areNotEqual(-1, values.indexOf("Aaron Conran"));
+            assert.areNotEqual(-1, values.indexOf("Tommy Maintz"));
+        },
+
+        //checks that all collected values are unique
+        testCollectIsUnique: function() {
+            var values = this.store.collect('group');
+
+            assert.areEqual(2, values.length);
+            assert.areNotEqual(-1, values.indexOf("code"));
+            assert.areNotEqual(-1, values.indexOf("admin"));
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'committing',
+
+        testCommitChanges: function() {
+            //PENDING
+        },
+
+        testRejectChanges: function() {
+            //PENDING
+        },
+
+        testAfterCommit: function() {
+            //PENDING
+        },
+
+        testAfterReject: function() {
+            //PENDING
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'modified',
+
+        testGetModifiedRecords: function() {
+            //PENDING
+        }
+    }));
+
+    suite.add(new Y.Test.Case({
+        name: 'loading'
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/DataField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/DataField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/DataField.js	(revision 76)
@@ -0,0 +1,148 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Ext.data.Field', {
+    name: 'Test data field creation',
+    
+    setUp: function(){
+        this.t = Ext.data.Types;
+        this.st = Ext.data.SortTypes;
+    },
+    
+    tearDown: function(){
+        delete this.t;
+        delete this.st;
+    },
+    
+    test_alias: function(){
+        var f;
+        
+        f = new Ext.data.Field({type: null});
+        Y.Assert.areEqual(this.t.AUTO, f.type, 'Test empty alias');
+        f = new Ext.data.Field({type: 'auto'});
+        Y.Assert.areEqual(this.t.AUTO, f.type, 'Test auto alias');
+        
+        f = new Ext.data.Field({type: 'int'});
+        Y.Assert.areEqual(this.t.INT, f.type, 'Test int alias');
+        f = new Ext.data.Field({type: 'integer'});
+        Y.Assert.areEqual(this.t.INT, f.type, 'Test integer alias');
+        
+        f = new Ext.data.Field({type: 'float'});
+        Y.Assert.areEqual(this.t.FLOAT, f.type, 'Test float alias');
+        f = new Ext.data.Field({type: 'number'});
+        Y.Assert.areEqual(this.t.FLOAT, f.type, 'Test number alias');
+        
+        f = new Ext.data.Field({type: 'bool'});
+        Y.Assert.areEqual(this.t.BOOL, f.type, 'Test bool alias');
+        f = new Ext.data.Field({type: 'boolean'});
+        Y.Assert.areEqual(this.t.BOOL, f.type, 'Test boolean alias');
+        
+        f = new Ext.data.Field({type: 'string'});
+        Y.Assert.areEqual(this.t.STRING, f.type, 'Test string alias');
+        
+        f = new Ext.data.Field({type: 'date'});
+        Y.Assert.areEqual(this.t.DATE, f.type, 'Test date alias');
+    },
+    
+    test_type: function(){
+        var f;
+        
+        f = new Ext.data.Field({type: this.t.INT});
+        Y.Assert.areEqual(this.t.INT, f.type, 'Test int type');
+        
+        f = new Ext.data.Field({type: this.t.AUTO});
+        Y.Assert.areEqual(this.t.AUTO, f.type, 'Test auto type');
+        
+        f = new Ext.data.Field({type: this.t.STRING});
+        Y.Assert.areEqual(this.t.STRING, f.type, 'Test string type');
+    },
+    
+    test_sortType: function(){
+        var f,
+            s1 = function(v){
+                return v * v;    
+            },
+            s2 = function(v){
+                return Math.sqrt(v);
+            };
+        
+        f = new Ext.data.Field({type: 'auto'});
+        Y.Assert.areEqual(this.st.none, f.sortType, 'Test sort type defaults for auto');
+        
+        f = new Ext.data.Field({type: 'int'});
+        Y.Assert.areEqual(this.st.none, f.sortType, 'Test sort type defaults for int');
+        
+        f = new Ext.data.Field({type: 'float'});
+        Y.Assert.areEqual(this.st.none, f.sortType, 'Test sort type defaults for float');
+        
+        f = new Ext.data.Field({type: 'bool'});
+        Y.Assert.areEqual(this.st.none, f.sortType, 'Test sort type defaults for bool');
+        
+        f = new Ext.data.Field({type: 'string'});
+        Y.Assert.areEqual(this.st.asUCString, f.sortType, 'Test sort type defaults for string');
+        
+        f = new Ext.data.Field({type: 'date'});
+        Y.Assert.areEqual(this.st.asDate, f.sortType, 'Test sort type defaults for date');
+        
+        f = new Ext.data.Field({
+            type: 'auto',
+            sortType: 'asDate'
+        });
+        Y.Assert.areEqual(this.st.asDate, f.sortType, 'Test with custom string sortType');
+        
+        f = new Ext.data.Field({
+            type: 'int',
+            sortType: s1
+        });
+        Y.Assert.areEqual(s1, f.sortType, 'Test with custom function sortType');
+        
+        f = new Ext.data.Field({
+            type: 'date',
+            sortType: s2
+        });
+        Y.Assert.areEqual(s2, f.sortType, 'Test with another custom function sortType');
+    },
+    
+    test_convert: function(){
+        var f,
+            c1 = function(v){
+                return v / 3;
+            },
+            c2 = function(v){
+                return v * 4;    
+            };
+            
+        f = new Ext.data.Field({type: 'auto'});
+        Y.Assert.areEqual(this.t.AUTO.convert, f.convert, 'Test convert for auto');
+        
+        f = new Ext.data.Field({type: 'int'});
+        Y.Assert.areEqual(this.t.INT.convert, f.convert, 'Test convert for int');
+        
+        f = new Ext.data.Field({type: 'float'});
+        Y.Assert.areEqual(this.t.FLOAT.convert, f.convert, 'Test convert for float');
+        
+        f = new Ext.data.Field({type: 'bool'});
+        Y.Assert.areEqual(this.t.BOOL.convert, f.convert, 'Test convert for bool');
+        
+        f = new Ext.data.Field({type: 'string'});
+        Y.Assert.areEqual(this.t.STRING.convert, f.convert, 'Test convert for string');
+        
+        f = new Ext.data.Field({type: 'date'});
+        Y.Assert.areEqual(this.t.DATE.convert, f.convert, 'Test convert for date');
+        
+        f = new Ext.data.Field({
+            type: 'int',
+            convert: c1
+        });
+        Y.Assert.areEqual(c1, f.convert, 'Test with custom function convert');
+        
+        f = new Ext.data.Field({
+            type: 'date',
+            convert: c2
+        });
+        Y.Assert.areEqual(c2, f.convert, 'Test with another custom function convert');
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/data/ArrayReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/data/ArrayReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/data/ArrayReader.js	(revision 76)
@@ -0,0 +1,40 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest( 'ArrayReader', {
+    name: 'readRecords',
+    setUp: function() {
+        this.reader = new Ext.data.ArrayReader({
+            idIndex: 1,
+            fields: [
+               {name: 'floater', type: 'float'},
+               {name: 'id'},
+               {name: 'totalProp', type: 'integer'},
+               {name: 'bool', type: 'boolean'},
+               {name: 'msg'}
+            ]
+        });
+        this.data1 = [
+            [ 1.23, 1, 6, true, 'hello' ]
+        ];
+        this.rec1 = this.reader.readRecords(this.data1);
+    },
+    test_tearDown: function() {
+        delete this.reader;
+        delete this.data1;
+        delete this.rec1;
+    },
+    test_TotalRecords: function() {
+        Y.Assert.areSame(this.rec1.totalRecords, 1);
+    },
+    test_Records: function() {
+        Y.Assert.areSame(this.rec1.records[0].data.floater, this.data1[0][0]);
+        Y.Assert.areSame(this.rec1.records[0].data.id, this.data1[0][1]);
+        Y.Assert.areSame(this.rec1.records[0].data.totalProp, this.data1[0][2]);
+        Y.Assert.areSame(this.rec1.records[0].data.bool, this.data1[0][3]);
+        Y.Assert.areSame(this.rec1.records[0].data.msg, this.data1[0][4]);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/direct/Direct.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/direct/Direct.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/direct/Direct.js	(revision 76)
@@ -0,0 +1,88 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Tests Ext.data.Store functionality
+ * @author Ed Spencer
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.Direct'),
+        assert = Y.Assert;
+
+    //a shared setup function used by several of the suites
+    var defaultSetup = function() {
+        this.API = {
+            "url": "php\/router.php",
+            "type": "remoting",
+            "actions": {
+                "TestAction": [{
+                    "name": "doEcho",
+                    "len": 1
+                }, {
+                    "name": "multiply",
+                    "len": 1
+                }, {
+                    "name": "getTree",
+                    "len": 1
+                }],
+                "Profile": [{
+                    "name": "getBasicInfo",
+                    "len": 2
+                }, {
+                    "name": "getPhoneInfo",
+                    "len": 1
+                }, {
+                    "name": "getLocationInfo",
+                    "len": 1
+                }, {
+                    "name": "updateBasicInfo",
+                    "len": 2,
+                    "formHandler": true
+                }]
+            }
+        };
+    };
+
+    suite.add(new Y.Test.Case({
+        name: 'adding providers',
+
+        setUp: defaultSetup,
+
+        testAddProvider: function() {
+            var p = Ext.Direct.addProvider(
+                this.API
+            );
+            Y.ObjectAssert.hasKeys(p.actions, [
+                "Profile",
+                "TestAction"
+            ], 'Test actions provided');
+            Y.ObjectAssert.hasKeys(p.actions, p, Ext.Direct.providers, "Test providers cache");
+        },
+        testGetProvider: function() {
+            var p = Ext.Direct.addProvider(
+                this.API
+            );
+            Y.ObjectAssert.hasKeys(p, Ext.Direct.getProvider(p.id));
+        },
+        testRemoveProvider: function() {
+            // Remove via id
+            var p = Ext.Direct.addProvider(
+                this.API
+            );
+            var id = p.id;
+            Ext.Direct.removeProvider(id);
+            Y.Assert.isUndefined(Ext.Direct.getProvider(id));
+
+            // Remove via object
+            var p = Ext.Direct.addProvider(
+                this.API
+            );
+            var id = p.id;
+            Ext.Direct.removeProvider(p);
+            Y.Assert.isUndefined(Ext.Direct.getProvider(id));
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/Ext.js	(revision 76)
@@ -0,0 +1,953 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest('Ext', {
+
+    name: 'core',
+    
+    planned: 355,
+    
+    // addBehaviors
+    
+    // 7
+    test_apply: function(){
+        var o1 = Ext.apply({}, {
+            foo: 1,
+            bar: 2
+        });
+        Y.ObjectAssert.hasKeys(o1, {
+            foo: 1,
+            bar: 2
+        }, 'Test simple apply, with a return value');
+        
+        var o2 = {};
+        Ext.apply(o2, {
+            opt1: 'x',
+            opt2: 'y'
+        });
+        Y.ObjectAssert.hasKeys(o2, {
+            opt1: 'x',
+            opt2: 'y'
+        }, 'Test that the reference is changed');
+        
+        var o3 = Ext.apply({}, {
+            prop1: 1
+        });
+        Y.Assert.isUndefined(o3.prop2, 'Test to ensure no extra properties are copied');
+        
+        var o4 = Ext.apply({
+            foo: 1,
+            baz: 4
+        }, {
+            foo: 2,
+            bar: 3
+        });
+        Y.ObjectAssert.hasKeys(o4, {
+            foo: 2,
+            bar: 3,
+            baz: 4
+        }, 'Ensure that properties get overwritten by defaults');
+        
+        var o5 = {};
+        Ext.apply(o5, {
+            foo: 'new',
+            exist: true
+        }, {
+            foo: 'old',
+            def: true
+        });
+        Y.ObjectAssert.hasKeys(o5, {
+            foo: 'new',
+            def: true,
+            exist: true
+        }, 'Test using defaults');
+        
+        var o6 = Ext.apply({}, {
+            foo: 'foo',
+            bar: 'bar'
+        }, {
+            foo: 'oldFoo',
+            bar: 'oldBar'
+        });
+        Y.ObjectAssert.hasKeys(o6, {
+            foo: 'foo',
+            bar: 'bar'
+        }, 'Test to ensure all defaults get overridden');
+        
+        Y.Assert.isNull(Ext.apply(null, {}), 'Test null first argument');
+    },
+    
+    // 5
+    test_applyIf: function(){
+        var o1 = Ext.applyIf({}, {
+            foo: 'foo',
+            bar: 'bar'
+        });
+        Y.ObjectAssert.hasKeys(o1, {
+            foo: 'foo',
+            bar: 'bar'
+        }, 'Test with an empty destination object');
+        
+        var o2 = Ext.applyIf({
+            foo: 'foo'
+        }, {
+            foo: 'oldFoo'
+        });
+        Y.ObjectAssert.hasKeys(o2, {
+            foo: 'foo'
+        }, 'Ensure existing properties don\'t get overridden');
+        
+        var o3 = Ext.applyIf({
+            foo: 1,
+            bar: 2
+        }, {
+            bar: 3,
+            baz: 4
+        });
+        Y.ObjectAssert.hasKeys(o3, {
+            foo: 1,
+            bar: 2,
+            baz: 4
+        }, 'Test mixing properties to be overridden');
+        
+        var o4 = {};
+        Ext.applyIf(o4, {
+            foo: 2
+        }, {
+            foo: 1
+        });
+        Y.ObjectAssert.hasKeys(o4, {
+            foo: 2
+        }, 'Test that the reference of the object is changed');
+        
+        Y.Assert.isNull(Ext.applyIf(null, {}), 'Test null first argument');
+    },
+    
+    // 6
+    test_clean: function(){
+        Y.ArrayAssert.itemsAreEqual([true, true, true], Ext.clean([true, true, true]), 'Test with all true');
+        Y.ArrayAssert.isEmpty(Ext.clean([]), 'Test with empty');
+        Y.ArrayAssert.isEmpty(Ext.clean([false, false, false]), 'Test with all false');
+        Y.ArrayAssert.isEmpty(Ext.clean(null), 'Test with non array parameter');
+        Y.ArrayAssert.itemsAreEqual([1, 1], Ext.clean([1, 0, 1]), 'Test with non booleans');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 1], Ext.clean([1, 2, false, 0, 3, 1]), 'Ensure order is maintained properly');
+    },
+    
+    // 7
+    test_copyTo: function(){
+        var from = {
+            x: 50,
+            y: 100,
+            width: 'auto',
+            height: 200
+        };
+        
+        var o1 = Ext.copyTo({}, from, 'x,y');
+        Y.ObjectAssert.hasKeys(o1, {
+            x: 50,
+            y: 100
+        }, 'Test simple copy with string');
+        
+        var o2 = Ext.copyTo({}, from, '');
+        Y.Assert.isUndefined(o2.x, 'Test with empty string as properties');
+        Y.Assert.isUndefined(o2.y, 'Test with empty string as properties');
+        Y.Assert.isUndefined(o2.width, 'Test with empty string as properties');
+        Y.Assert.isUndefined(o2.height, 'Test with empty string as properties');
+        
+        var o3 = {};
+        Ext.copyTo(o3, from, 'width');
+        Y.ObjectAssert.hasKeys(o3, {
+            width: 'auto'
+        }, 'Test copy ensuring that the original reference is changed');
+        
+        var o4 = Ext.copyTo({
+            x: 1
+        }, from, ['x', 'y']);
+        Y.ObjectAssert.hasKeys(o4, {
+            x: 50,
+            y: 100
+        }, 'Test with array as properties, also with an existing value in the destination object');
+    },
+    
+    // create
+    // decode
+    
+    // 14
+    test_destroy: function(){
+        var C1 = Ext.extend(Object, {
+            constructor: function(){
+                this.c1destroy = false;
+            },
+            destroy: function(){
+                this.c1destroy = true;
+            }
+        });
+        var C2 = Ext.extend(Object, {
+            constructor: function(){
+                this.c2destroy = false;
+            },
+            destroy: function(){
+                this.c2destroy = true;
+            }
+        });
+        var C3 = Ext.extend(Object, {
+            constructor: function(){
+                this.c3destroy = false;
+            },
+            dest: function(){
+                this.c3destroy = true;
+            }
+        });
+        
+        var o1 = new C1();
+        Ext.destroy(o1);
+        Y.Assert.isTrue(o1.c1destroy, 'Simple destroy test with a single object');
+        
+        var arr1 = [new C1(), new C2(), new C2()];
+        Ext.destroy(arr1);
+        Y.Assert.isTrue(arr1[0].c1destroy, 'Test with an array of items');
+        Y.Assert.isTrue(arr1[1].c2destroy, 'Test with an array of items');
+        Y.Assert.isTrue(arr1[2].c2destroy, 'Test with an array of items');
+        
+        var o2 = new C1(), o3 = new C2(), o4 = new C1();
+        
+        Ext.destroy(o2, o3, o4);
+        Y.Assert.isTrue(o2.c1destroy, 'Test with param array');
+        Y.Assert.isTrue(o3.c2destroy, 'Test with param array');
+        Y.Assert.isTrue(o4.c1destroy, 'Test with param array');
+        
+        var o5 = new C3();
+        Ext.destroy(o5);
+        Y.Assert.isFalse(o5.c3destroy, 'Test item without a destroy method');
+        
+        var arr2 = [new C1(), new C3(), new C2()];
+        Ext.destroy(arr2);
+        Y.Assert.isTrue(arr2[0].c1destroy, 'Test with an array of items, mix of items with and without destroy');
+        Y.Assert.isFalse(arr2[1].c3destroy, 'Test with an array of items, mix of items with and without destroy');
+        Y.Assert.isTrue(arr2[2].c2destroy, 'Test with an array of items, mix of items with and without destroy');
+        
+        var id1 = Ext.id(), el1 = Ext.getBody().createChild({
+            id: id1
+        });
+        Ext.destroy(el1);
+        Y.Assert.isNull(document.getElementById(id1), 'Test with an Ext.Element');
+        
+        var id2 = Ext.id(), el2 = Ext.getBody().createChild({
+            id: id2
+        }), o6 = new C1();
+        Ext.destroy(el2, o6);
+        Y.Assert.isNull(document.getElementById(id2), 'Test with a mix of elements and objects');
+        Y.Assert.isTrue(o6.c1destroy, 'Test with a mix of elements and objects');
+    },
+    
+    // 14
+    test_destroyMembers: function(){
+        var C1 = Ext.extend(Object, {
+            constructor: function(){
+                this.p1 = 1;
+                this.p2 = 2;
+                this.p3 = 3;
+                this.p4 = 4;
+                this.d = false;
+            },
+            
+            destroy: function(){
+                this.d = true;
+            }
+        });
+        var C2 = Ext.extend(Object, {
+            constructor: function(){
+                this.p1 = new C1();
+                this.p2 = new C1();
+                this.p3 = 1;
+            }
+        });
+        
+        var o1 = new C1();
+        Ext.destroyMembers(o1, 'p1', 'p3');
+        Y.Assert.isUndefined(o1.p1, 'Simple test with a mix of properties');
+        Y.Assert.areEqual(2, o1.p2, 'Simple test with a mix of properties');
+        Y.Assert.isUndefined(o1.p3, 'Simple test with a mix of properties');
+        Y.Assert.areEqual(4, o1.p4, 'Simple test with a mix of properties');
+        
+        var o2 = new C2();
+        Ext.destroyMembers(o2);
+        Y.Assert.isNotUndefined(o2.p1, 'Test with empty parameter list, ensure nothing is removed or destroyed');
+        Y.Assert.isNotUndefined(o2.p2, 'Test with empty parameter list, ensure nothing is removed or destroyed');
+        Y.Assert.areEqual(1, o2.p3, 'Test with empty parameter list, ensure nothing is removed or destroyed');
+        Y.Assert.isFalse(o2.p1.d, 'Test with empty parameter list, ensure nothing is removed or destroyed');
+        Y.Assert.isFalse(o2.p2.d, 'Test with empty parameter list, ensure nothing is removed or destroyed');
+        
+        var o3 = new C2(), o4 = o3.p1, o5 = o3.p2;
+        Ext.destroyMembers(o3, 'p1', 'p2');
+        Y.Assert.isUndefined(o3.p1, 'Destroy objects, ensure they are destroyed and removed');
+        Y.Assert.isUndefined(o3.p2, 'Destroy objects, ensure they are destroyed and removed');
+        Y.Assert.areEqual(1, o3.p3, 'Destroy objects, ensure they are destroyed and removed');
+        Y.Assert.isTrue(o4.d, 'Destroy objects, ensure they are destroyed and removed');
+        Y.Assert.isTrue(o5.d, 'Destroy objects, ensure they are destroyed and removed');
+    },
+    
+    // 10
+    test_each: function(){
+        var sum = 0;
+        Ext.each([1, 2, 3, 4], function(val){
+            sum += val;
+        });
+        Y.Assert.areEqual(10, sum, 'Simple each on an array of numbers');
+            
+        var s = '';
+        Ext.each(['T', 'e', 's', 't', 'i', 'n', 'g'], function(c){
+            s += c;
+        });
+        Y.Assert.areEqual('Testing', s, 'Simple each on array of strings');
+            
+        sum = 0;
+        Ext.each(5, function(num){
+            sum += num;
+        });
+        Y.Assert.areEqual(5, sum, 'Test with a non array parameter, number');
+            
+        var hit = false;
+        Ext.each([], function(){
+            hit = true;
+        });
+        Y.Assert.isFalse(hit, 'Test with empty array parameter');
+            
+        hit = false;
+        Ext.each(null, function(){
+            hit = true;
+        });
+        Y.Assert.isFalse(hit, 'Test with null parameter');
+            
+        hit = false;
+        Ext.each(document.getElementsByTagName('body'), function(){
+            hit = true;
+        });
+        Y.Assert.isTrue(hit, 'Test iteration over NodeLists');
+            
+        var arr = [];
+        Ext.each([1, 2, 3, 4, 5, 6], function(val, idx){
+            arr.push(idx);
+        });
+        Y.ArrayAssert.itemsAreEqual([0, 1, 2, 3, 4, 5], arr, 'Test index is passed correctly');
+            
+        sum = 0;
+        Ext.each([1, 2, 3, 4, 5, 6], function(val){
+            if(val > 4){
+                return false;
+            }
+            sum += val;
+        });
+        Y.Assert.areEqual(10, sum, 'Test that returning false stops iteration');
+            
+        sum = 0;
+        var scope = {value: 3};
+        Ext.each([1, 2, 3], function(val){
+            sum += val * this.value;
+        }, scope);
+        Y.Assert.areEqual(18, sum, 'Test scope argument #1');
+            
+        sum = 0;
+        scope = {value: 5};
+        Ext.each([1, 2, 3], function(val){
+            sum += val * this.value; //value should be 5
+        }, scope);
+        Y.Assert.areEqual(30, sum, 'Test scope argument #2');
+    },
+    
+    // encode
+    
+    // 5
+    test_escapeRe: function(){
+        Y.Assert.areEqual('\\-', Ext.escapeRe('-'), 'Test with single char');
+        Y.Assert.areEqual('\\*\\.', Ext.escapeRe('*.'), 'Test with multiple characters next to each other');
+        Y.Assert.areEqual('foo', Ext.escapeRe('foo'), 'Test with no escapeable chars');
+        Y.Assert.areEqual('\\{baz\\}', Ext.escapeRe('{baz}'), 'Test with mixed set');
+        Y.Assert.areEqual('\\-\\.\\*\\+\\?\\^\\$\\{\\}\\(\\)\\|\\[\\]\\/\\\\', Ext.escapeRe('-.*+?^${}()|[]/\\'), 'Test with every character');
+    },
+    
+    // 4
+    test_extend: function(){
+        var Dude = Ext.extend(Object, {
+            constructor: function(config){
+                Ext.apply(this, config);
+                this.isBadass = false;
+            }
+        });
+        var Aweysome = Ext.extend(Dude, {
+            constructor: function(){
+                Aweysome.superclass.constructor.apply(this, arguments);
+                this.isBadass = true;
+            }
+        });
+        
+        var david = new Aweysome({
+            davis: 'isAwesome'
+        });
+        Y.Assert.areEqual('isAwesome', david.davis, 'Test if David is awesome');
+        Y.Assert.isTrue(david.isBadass, 'Test if David is badass');
+        Y.Assert.isFunction(david.override, 'Test if extend added the override method');
+        Y.ObjectAssert.areEqual({
+            isBadass: true,
+            davis: 'isAwesome'
+        }, david, 'Test if David is badass and awesome');
+    },
+    
+    // 9
+    test_flatten: function(){
+        Y.ArrayAssert.isEmpty(Ext.flatten([]), 'Test with empty array');
+        Y.ArrayAssert.isEmpty(Ext.flatten([[], [], []]), 'Test with an array of empty arrays');
+        Y.ArrayAssert.isEmpty(Ext.flatten(null), 'Test with null');
+        Y.ArrayAssert.isEmpty(Ext.flatten(undefined), 'Test with undefined');
+        Y.ArrayAssert.itemsAreEqual([1, 7, 3, 4], Ext.flatten([1, 7, 3, 4]), 'Test with a simple flat array');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3], Ext.flatten([[1], [2], [3]]), 'Test with an array of arrays with a single item');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 4, 5, 6], Ext.flatten([[1, 2], [3, 4], [5, 6]]), 'Test sub arrays with multiple items');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 4, 5, 6, 7], Ext.flatten([1, 2, [3, 4], 5, [6, 7]]), 'Test a mix of sub arrays and non arrays');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], Ext.flatten([[[1, [2, 3], [4, 5]], [6, 7, [8, [9, 10]]]]]), 'Test with multiple levels of nesting');
+    },
+    
+    // 1
+    test_fly: function(){
+        var id = Ext.id();
+        var div = document.createElement('div');
+        div.id = id;
+        Ext.getBody().dom.appendChild(div);
+        
+        var div2 = Ext.fly(id);
+        Y.Assert.areSame(div, div2.dom, 'Test if fly got the correct item');
+        div2.remove();
+    },
+    
+    // 1
+    test_get: function(){
+        var id = Ext.id();
+        var div = document.createElement('div');
+        div.id = id;
+        Ext.getBody().dom.appendChild(div);
+        var div2 = Ext.get(id);
+        Y.Assert.areSame(div, div2.dom, 'Test if "get" got the correct item');
+        div2.remove();
+    },
+    
+    // 1
+    test_getBody: function(){
+        var body = Ext.getBody();
+        Y.Assert.isTrue(body.dom === document.body || body.dom === document.documentElement, 'Test if getBody returns the body');
+    },
+    
+    // getCmp
+    
+    // 1
+    test_getDoc: function(){
+        var doc = Ext.getDoc();
+        Y.Assert.areSame(document, doc.dom, 'Test if getDoc returns document');
+    },
+    
+    // 1
+    test_getDom: function(){
+        var id = Ext.id();
+        var div = document.createElement('div');
+        div.id = id;
+        Ext.getBody().dom.appendChild(div);
+        
+        var div2 = Ext.getDom(id);
+        Y.Assert.areSame(div, div2, 'Test if getDom returns correct element');
+        div2.parentNode.removeChild(div2);
+    },
+    
+    // 1
+    test_getScrollBarWidth: function(){
+        Y.Assert.isNumber(Ext.getScrollBarWidth(), 'Test if getScrollBarWith returns a number');
+    },
+    
+    // 1
+    test_id: function(){
+        var id = Ext.id(document);
+        var id2 = Ext.id(document);
+        Y.Assert.areEqual(id, id2, 'Test if id returns same id for the same element');
+    },
+    
+    // 8
+    test_invoke: function(){
+        var n = 0;
+        var fn = function(a, b){
+            Y.Assert.areEqual('a', a, 'Testing invoke param');
+            Y.Assert.areEqual('b', b, 'Testing invoke param');
+            return ++n;
+        };
+        
+        var arr = [{
+            get: fn
+        }, {
+            get: fn
+        }, {
+            get: fn
+        }];
+        var results = Ext.invoke(arr, 'get', 'a', 'b');
+        
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3], results, 'Test invoke results');
+        Y.Assert.areEqual(n, results.length, 'Number of invocations');
+    },
+    
+    // 12
+    test_isArray: function(){
+        var C = Ext.extend(Object, {
+            length: 1
+        });
+        Y.Assert.isTrue(Ext.isArray([]), 'Test with empty array');
+        Y.Assert.isTrue(Ext.isArray([1, 2, 3, 4]), 'Test with filled array');
+        Y.Assert.isFalse(Ext.isArray(false), 'Test with boolean #1');
+        Y.Assert.isFalse(Ext.isArray(true), 'Test with boolean #2');
+        Y.Assert.isFalse(Ext.isArray('foo'), 'Test with string');
+        Y.Assert.isFalse(Ext.isArray(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isArray(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isArray(new Date()), 'Test with a date');
+        Y.Assert.isFalse(Ext.isArray({}), 'Test with empty object');
+        Y.Assert.isFalse(Ext.isArray(document.getElementsByTagName('body')), 'Test with node list');
+        Y.Assert.isFalse(Ext.isArray(Ext.getBody().dom), 'Test with element');
+        Y.Assert.isFalse(Ext.isArray(new C()), 'Test with custom class that has a length property');
+    },
+    
+    // 11
+    test_isBoolean: function(){
+        Y.Assert.isTrue(Ext.isBoolean(true), 'Test with true');
+        Y.Assert.isTrue(Ext.isBoolean(false), 'Test with false');
+        Y.Assert.isFalse(Ext.isBoolean([]), 'Test with empty array');
+        Y.Assert.isFalse(Ext.isBoolean([1, 2, 3]), 'Test with filled array');
+        Y.Assert.isFalse(Ext.isBoolean(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isBoolean(''), 'Test with empty string');
+        Y.Assert.isFalse(Ext.isBoolean('foo'), 'Test with non empty string');
+        Y.Assert.isFalse(Ext.isBoolean(Ext.getBody().dom), 'Test with element');
+        Y.Assert.isFalse(Ext.isBoolean(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isBoolean({}), 'Test with object');
+        Y.Assert.isFalse(Ext.isBoolean(new Date()), 'Test with date');
+    },
+    
+    // 9
+    test_isDate: function(){
+        Y.Assert.isTrue(Ext.isDate(new Date()), 'Test with simple date');
+        Y.Assert.isTrue(Ext.isDate(Date.parseDate('2000', 'Y')), 'Test with simple date');
+        Y.Assert.isFalse(Ext.isDate(true), 'Test with boolean');
+        Y.Assert.isFalse(Ext.isDate(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isDate('foo'), 'Test with string');
+        Y.Assert.isFalse(Ext.isDate(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isDate([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isDate({}), 'Test with object');
+        Y.Assert.isFalse(Ext.isDate(Ext.getBody().dom), 'Test with element');
+    },
+    
+    // 10
+    test_isDefined: function(){
+        Y.Assert.isFalse(Ext.isDefined(undefined), 'Test with undefined');
+        Y.Assert.isTrue(Ext.isDefined(null), 'Test with null');
+        Y.Assert.isTrue(Ext.isDefined({}), 'Test with object');
+        Y.Assert.isTrue(Ext.isDefined([]), 'Test with array');
+        Y.Assert.isTrue(Ext.isDefined(new Date()), 'Test with date');
+        Y.Assert.isTrue(Ext.isDefined(1), 'Test with number');
+        Y.Assert.isTrue(Ext.isDefined(false), 'Test with boolean');
+        Y.Assert.isTrue(Ext.isDefined(''), 'Test with empty string');
+        Y.Assert.isTrue(Ext.isDefined('foo'), 'Test with non-empty string');
+        Y.Assert.isTrue(Ext.isDefined(Ext.getBody().dom), 'Test with element');
+    },
+    
+    // 5
+    test_isElement: function(){
+        Y.Assert.isTrue(Ext.isElement(Ext.getBody().dom), 'Test with element');
+        Y.Assert.isFalse(Ext.isElement(Ext.getBody()), 'Test with Ext.Element');
+        Y.Assert.isFalse(Ext.isElement(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isElement(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isElement('foo'), 'Test with string');
+    },
+    
+    // 10
+    test_isEmpty: function(){
+        Y.Assert.isTrue(Ext.isEmpty(''), 'Test with empty string');
+        Y.Assert.isTrue(Ext.isEmpty(null), 'Test with null');
+        Y.Assert.isTrue(Ext.isEmpty(undefined), 'Test with undefined');
+        Y.Assert.isTrue(Ext.isEmpty([]), 'Test with empty array');
+        Y.Assert.isFalse(Ext.isEmpty('Foo'), 'Test with simple string');
+        Y.Assert.isFalse(Ext.isEmpty(false), 'Test with boolean false');
+        Y.Assert.isFalse(Ext.isEmpty(1), 'Test with numeric value');
+        Y.Assert.isFalse(Ext.isEmpty({}), 'Test with object with no properties');
+        Y.Assert.isFalse(Ext.isEmpty([1, 2, 3]), 'Test with filled array');
+        Y.Assert.isFalse(Ext.isEmpty('', true), 'Test empty string with allowBlank');
+    },
+    
+    // 12
+    test_isFunction: function(){
+        var c = new Ext.util.Observable(), o = {
+            fn: function(){
+            }
+        };
+        Y.Assert.isTrue(Ext.isFunction(function(){
+        }), 'Test with anonymous function');
+        Y.Assert.isTrue(Ext.isFunction(new Function('return "";')), 'Test with new Function syntax');
+        Y.Assert.isTrue(Ext.isFunction(Ext.emptyFn), 'Test with static function');
+        Y.Assert.isTrue(Ext.isFunction(c.fireEvent), 'Test with instance function');
+        Y.Assert.isTrue(Ext.isFunction(o.fn), 'Test with function on object');
+        Y.Assert.isFalse(Ext.isFunction(Ext.version), 'Test with class property');
+        Y.Assert.isFalse(Ext.isFunction(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isFunction(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isFunction(''), 'Test with string');
+        Y.Assert.isFalse(Ext.isFunction(new Date()), 'Test with date');
+        Y.Assert.isFalse(Ext.isFunction([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isFunction({}), 'Test with object');
+    },
+    
+    // 19
+    test_isNumber: function(){
+        Y.Assert.isTrue(Ext.isNumber(0), 'Test with 0');
+        Y.Assert.isTrue(Ext.isNumber(4), 'Test with non-zero integer');
+        Y.Assert.isTrue(Ext.isNumber(-3), 'Test with negative integer');
+        Y.Assert.isTrue(Ext.isNumber(7.9), 'Test with positive float');
+        Y.Assert.isTrue(Ext.isNumber(-4.3), 'Test with negative float');
+        Y.Assert.isTrue(Ext.isNumber(Number.MAX_VALUE), 'Test with MAX_VALUE');
+        Y.Assert.isTrue(Ext.isNumber(Number.MIN_VALUE), 'Test with MIN_VALUE');
+        Y.Assert.isTrue(Ext.isNumber(Math.PI), 'Test with Math.PI');
+        Y.Assert.isTrue(Ext.isNumber(Number('3.1')), 'Test with Number() constructor');
+        Y.Assert.isFalse(Ext.isNumber(Number.NaN), 'Test with NaN');
+        Y.Assert.isFalse(Ext.isNumber(Number.POSITIVE_INFINITY), 'Test with POSITIVE_INFINITY');
+        Y.Assert.isFalse(Ext.isNumber(Number.NEGATIVE_INFINITY), 'Test with NEGATIVE_INFINITY');
+        Y.Assert.isFalse(Ext.isNumber(true), 'Test with true');
+        Y.Assert.isFalse(Ext.isNumber(''), 'Test with empty string');
+        Y.Assert.isFalse(Ext.isNumber('1.0'), 'Test with string containing a number');
+        Y.Assert.isFalse(Ext.isNumber(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isNumber(undefined), 'Test with undefined');
+        Y.Assert.isFalse(Ext.isNumber([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isNumber({}), 'Test with object');
+    },
+    
+    // 14
+    test_isObject: function(){
+        Y.Assert.isTrue(Ext.isObject({}), 'Test with empty object');
+        Y.Assert.isTrue(Ext.isObject({
+            foo: 1
+        }), 'Test with object with properties');
+        Y.Assert.isTrue(Ext.isObject(new Ext.util.Observable()), 'Test with object instance');
+        Y.Assert.isTrue(Ext.isObject(new Object()), 'Test with new Object(  ) syntax');
+        Y.Assert.isFalse(Ext.isObject(new Date()), 'Test with a date object');
+        Y.Assert.isFalse(Ext.isObject([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isObject(new Array()), 'Test with new Array(  ) syntax');
+        Y.Assert.isFalse(Ext.isObject(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isObject('foo'), 'Test with string');
+        Y.Assert.isFalse(Ext.isObject(false), 'Test with boolean');
+        Y.Assert.isFalse(Ext.isObject(new Number(3)), 'Test with new Number() syntax');
+        Y.Assert.isFalse(Ext.isObject(new String('foo')), 'Test with new String() syntax');
+        Y.Assert.isFalse(Ext.isObject(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isObject(undefined), 'Test with undefined');
+    },
+    
+    // 14
+    test_isPrimitive: function(){
+        Y.Assert.isTrue(Ext.isPrimitive(1), 'Test with integer');
+        Y.Assert.isTrue(Ext.isPrimitive(-3), 'Test with negative integer');
+        Y.Assert.isTrue(Ext.isPrimitive(1.4), 'Test with floating number');
+        Y.Assert.isTrue(Ext.isPrimitive(Number.MAX_VALUE), 'Test with Number.MAX_VALUE');
+        Y.Assert.isTrue(Ext.isPrimitive(Math.PI), 'Test with Math.PI');
+        Y.Assert.isTrue(Ext.isPrimitive(''), 'Test with empty string');
+        Y.Assert.isTrue(Ext.isPrimitive('foo'), 'Test with non empty string');
+        Y.Assert.isTrue(Ext.isPrimitive(true), 'Test with boolean true');
+        Y.Assert.isTrue(Ext.isPrimitive(false), 'Test with boolean false');
+        Y.Assert.isFalse(Ext.isPrimitive(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isPrimitive(undefined), 'Test with undefined');
+        Y.Assert.isFalse(Ext.isPrimitive({}), 'Test with object');
+        Y.Assert.isFalse(Ext.isPrimitive([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isPrimitive(new Ext.util.Observable()), 'Test with object instance');
+    },
+    
+    // 10
+    test_isString: function(){
+        var s = new String('foo');
+        Y.Assert.isTrue(Ext.isString(''), 'Test with empty string');
+        Y.Assert.isTrue(Ext.isString('foo'), 'Test with non empty string');
+        Y.Assert.isTrue(Ext.isString(String('')), 'Test with String() syntax');
+        Y.Assert.isFalse(Ext.isString(new String('')), 'Test with new String() syntax'); //should return an object that wraps the primitive
+        Y.Assert.isFalse(Ext.isString(1), 'Test with number');
+        Y.Assert.isFalse(Ext.isString(true), 'Test with boolean');
+        Y.Assert.isFalse(Ext.isString(null), 'Test with null');
+        Y.Assert.isFalse(Ext.isString(undefined), 'Test with undefined');
+        Y.Assert.isFalse(Ext.isString([]), 'Test with array');
+        Y.Assert.isFalse(Ext.isString({}), 'Test with number');
+    },
+    
+    // 8
+    test_iterate: function(){
+        var n = 0;
+        Ext.iterate({
+            n1: 11,
+            n2: 13,
+            n3: 18
+        }, function(k, v, o){
+            Y.Assert.isNumber(v);
+            n += v;
+        });
+        Y.Assert.areEqual(42, n, 'Test if iterate has called the function the correct number of times (object)');
+        n = 0;
+        Ext.iterate([11, 13, 18], function(x){
+            Y.Assert.isNumber(x);
+            n += x;
+        });
+        Y.Assert.areEqual(42, n, 'Test if iterate has called the function the correct number of times (array)');
+    },
+    
+    // 7
+    test_max: function(){
+        Y.Assert.areEqual(14, Ext.max([14]), 'Test single item');
+        Y.Assert.areEqual(16, Ext.max([1, 4, 16, 3, 8]), 'Test with max in the middle');
+        Y.Assert.areEqual(9, Ext.max([9, 1, 5, 8]), 'Test with max at start');
+        Y.Assert.areEqual(12, Ext.max([1, 9, 0, 4, 12]), 'Test with max at end');
+        Y.Assert.isUndefined(Ext.max([]), 'Test with empty array');
+        Y.Assert.areEqual('j', Ext.max(['a', 'f', 'j', 'c', 'b']), 'Test with strings');
+        Y.Assert.areEqual(7, Ext.max([6, 7, 8], function(a, b){
+            return (a % 8 > b % 8) ? 1 : -1;
+        }), 'Test with custom comparator');
+    },
+    
+    // 4
+    test_mean: function(){
+        Y.Assert.isUndefined(Ext.mean([]), 'Test with an empty list');
+        Y.Assert.areEqual(4, Ext.mean([4]), 'Test with a single item');
+        Y.Assert.areEqual(3, Ext.mean([1, 2, 3, 4, 5]), 'Test with multiple items');
+        Y.Assert.areEqual(1.3, Ext.mean([1.1, 1.2, 1.3, 1.4, 1.5]), 'Test with floats');
+    },
+    
+    // 7
+    test_min: function(){
+        Y.Assert.areEqual(5, Ext.min([5]), 'Test single item');
+        Y.Assert.areEqual(2, Ext.min([3, 7, 2, 4, 8]), 'Test with min in the middle');
+        Y.Assert.areEqual(4, Ext.min([4, 12, 28, 100, 5]), 'Test with min at the start');
+        Y.Assert.areEqual(3, Ext.min([13, 4, 17, 83, 3]), 'Test with min at the end');
+        Y.Assert.isUndefined(Ext.min([]), 'Test with empty array');
+        Y.Assert.areEqual('b', Ext.min(['c', 'm', 'b', 'q', 's']), 'Test with strings');
+        Y.Assert.areEqual(8, Ext.min([6, 7, 8], function(a, b){
+            return (a % 8 > b % 8) ? 1 : -1;
+        }), 'Test with custom comparator');
+    },
+    
+    // 14
+    test_namespace: function(){
+        var w = window;
+        
+        Ext.namespace('FooTest1');
+        Y.Assert.isNotUndefined(w.FooTest1, 'Test creation with a single top-level namespace');
+        
+        Ext.namespace('FooTest2', 'FooTest3', 'FooTest4');
+        Y.Assert.isNotUndefined(w.FooTest2, 'Test creation with multiple top level namespaces');
+        Y.Assert.isNotUndefined(w.FooTest3, 'Test creation with multiple top level namespaces');
+        Y.Assert.isNotUndefined(w.FooTest4, 'Test creation with multiple top level namespaces');
+        
+        Ext.namespace('FooTest5', 'FooTest5.ns1', 'FooTest5.ns1.ns2', 'FooTest5.ns1.ns2.ns3');
+        Y.Assert.isNotUndefined(w.FooTest5, 'Test a chain of namespaces, starting from a top-level');
+        Y.Assert.isNotUndefined(w.FooTest5.ns1, 'Test a chain of namespaces, starting from a top-level');
+        Y.Assert.isNotUndefined(w.FooTest5.ns1.ns2, 'Test a chain of namespaces, starting from a top-level');
+        Y.Assert.isNotUndefined(w.FooTest5.ns1.ns2.ns3, 'Test a chain of namespaces, starting from a top-level');
+        
+        Ext.namespace('FooTest6.ns1', 'FooTest7.ns1');
+        Y.Assert.isNotUndefined(w.FooTest6.ns1, 'Test creating lower level namespaces without first defining the top level');
+        Y.Assert.isNotUndefined(w.FooTest7.ns1, 'Test creating lower level namespaces without first defining the top level');
+        
+        Ext.namespace('FooTest8', 'FooTest8.ns1.ns2');
+        Y.Assert.isNotUndefined(w.FooTest8, 'Test creating a lower level namespace without defining the middle level');
+        Y.Assert.isNotUndefined(w.FooTest8.ns1, 'Test creating a lower level namespace without defining the middle level');
+        Y.Assert.isNotUndefined(w.FooTest8.ns1.ns2, 'Test creating a lower level namespace without defining the middle level');
+        
+        FooTest8.prop1 = 'foo';
+        Ext.namespace('FooTest8');
+        Y.Assert.areEqual('foo', FooTest8.prop1, 'Ensure existing namespaces are not overwritten');
+    },
+    
+    // ns is alias of namespace
+    
+    // 18
+    test_num: function(){
+        Y.Assert.areEqual(3, Ext.num(3), 'Test with an integer');
+        Y.Assert.areEqual(-7, Ext.num(-7), 'Test with a negative integer');
+        Y.Assert.areEqual(5.43, Ext.num(5.43), 'Test with a float');
+        Y.Assert.areEqual(-9.8, Ext.num(-9.8), 'Test with a negative float');
+        Y.Assert.areEqual(Math.PI, Ext.num(Math.PI), 'Test with Math.PI');
+        Y.Assert.isUndefined(Ext.num(null), 'Test with null, no default');
+        Y.Assert.areEqual(3, Ext.num(null, 3), 'Test with null, with default');
+        Y.Assert.isUndefined(Ext.num(undefined), 'Test with undefined, no default');
+        Y.Assert.areEqual(17, Ext.num(undefined, 17), 'Test with undefined, with default');
+        Y.Assert.isUndefined(Ext.num(true), 'Test with boolean, no default');
+        Y.Assert.areEqual(8, Ext.num(true, 8), 'Test with boolean, with default');
+        Y.Assert.isUndefined(Ext.num(''), 'Test with empty string');
+        Y.Assert.areEqual(453, Ext.num('453'), 'Test with a string argument in the form of a number');
+        Y.Assert.isUndefined(Ext.num('    '), 'Test with a string containing only spaces');
+        Y.Assert.isUndefined(Ext.num('foo'), 'Test with non empty string');
+        Y.Assert.isUndefined(Ext.num([]), 'Test with empty array');
+        Y.Assert.isUndefined(Ext.num([1, 2, 3]), 'Test with non empty array');
+        Y.Assert.isUndefined(Ext.num([1]), 'Test with array with a single item');
+    },
+    
+    // onReady
+    
+    test_override: function(){
+    
+    },
+    
+    // 4
+    test_partition: function(){
+        var part = Ext.partition([true, false, true, true, false]);
+        Y.ArrayAssert.itemsAreEqual([true, true, true], part[0], 'Test if partitioned into true values');
+        Y.ArrayAssert.itemsAreEqual([false, false], part[1], 'Test if partitioned into false values');
+        var part2 = Ext.partition([12, 1, 11, 2, 3, 50, 5, 15], function(v){
+            return v > 10
+        });
+        Y.ArrayAssert.itemsAreEqual([12, 11, 50, 15], part2[0], 'Test if partitioned into a list of items less than 10');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3, 5], part2[1], 'Test if partitioned into a list of items greater than 10');
+    },
+    
+    // 1
+    test_pluck: function(){
+        var results = Ext.pluck([{
+            n: 11
+        }, {
+            n: 13
+        }, {
+            n: 18
+        }], 'n');
+        Y.ArrayAssert.itemsAreEqual([11, 13, 18], results, 'Test pluck results');
+    },
+    
+    // preg
+    // query
+    // reg
+    // removeNode
+    // select
+    
+    // 4
+    test_sum: function(){
+        Y.Assert.areEqual(0, Ext.sum([]), 'Test with an empty list');
+        Y.Assert.areEqual(4, Ext.sum([4]), 'Test with a single item');
+        Y.Assert.areEqual(15, Ext.sum([1, 2, 3, 4, 5]), 'Test with multiple items');
+        Y.Assert.areEqual(6.5, Ext.sum([1.1, 1.2, 1.3, 1.4, 1.5]), 'Test with floats');
+    },
+    
+    // 1
+    test_toArray: function(){
+        Y.Assert.isArray(Ext.toArray(document.getElementsByTagName('body')), 'Test with node list');
+    },
+    
+    // 25
+    test_type: function(){
+        Y.Assert.areEqual('string', Ext.type('foo'), 'Test with string');
+        Y.Assert.areEqual('object', Ext.type(new String('foo')), 'Test with new String() syntax'); //for some reason, isn't a string
+        
+        Y.Assert.areEqual('number', Ext.type(1), 'Test with number');
+        Y.Assert.areEqual('object', Ext.type(new Number(3)), 'Test with new Number() syntax'); //for some reason, isn't a number
+        
+        Y.Assert.areEqual('boolean', Ext.type(false), 'Test with boolean');
+        Y.Assert.areEqual('object', Ext.type(new Boolean(false)), 'Test with new Boolean() syntax'); //for some reason, isn't a boolean
+        
+        Y.Assert.areEqual('date', Ext.type(new Date()), 'Test with a date object');
+        Y.Assert.areEqual('date', Ext.type(Date.parseDate('2000', 'Y')), 'Test with simple date (parsed)');
+        
+        Y.Assert.areEqual('function', Ext.type(function(){
+        }), 'Test with a function');
+        Y.Assert.areEqual('function', Ext.type(Ext.emptyFn), 'Test with Ext.emptyFn');
+        Y.Assert.areEqual('function', Ext.type(new Function()), 'Test with new Function() syntax');
+        
+        Y.Assert.areEqual('object', Ext.type({}), 'Test with empty object');
+        Y.Assert.areEqual('object', Ext.type({
+            foo: 1
+        }), 'Test with object with properties');
+        Y.Assert.areEqual('object', Ext.type(new Ext.util.Observable()), 'Test with object instance');
+        Y.Assert.areEqual('object', Ext.type(new Object()), 'Test with new Object() syntax');
+        
+        Y.Assert.areEqual('array', Ext.type([]), 'Test with array');
+        Y.Assert.areEqual('array', Ext.type(new Array()), 'Test with new Array() syntax');
+        
+        Y.Assert.areEqual('regexp', Ext.type(/asdf/), 'Test with regexp');
+        Y.Assert.areEqual('regexp', Ext.type(new RegExp('asdf')), 'Test with new Regexp() syntax');
+        
+        Y.Assert.areEqual('nodelist', Ext.type(document.getElementsByTagName('body')), 'Test with node list');
+        
+        Y.Assert.areEqual('textnode', Ext.type(document.createTextNode('test')), 'Test with text node');
+        
+        Y.Assert.areEqual('whitespace', Ext.type(document.createTextNode('')), 'Test with empty text node');
+        Y.Assert.areEqual('whitespace', Ext.type(document.createTextNode('     ')), 'Test with whitespace in text node');
+        
+        Y.Assert.areEqual('', Ext.type(null), 'Test with null');
+        Y.Assert.areEqual(false, Ext.type(undefined), 'Test with undefined');
+    },
+    
+    // 7
+    test_unique: function(){
+        var fn = function(){
+        }, obj = {}, arr = [], date = new Date();
+        Y.ArrayAssert.itemsAreEqual([true, false], Ext.unique([true, true, false, true, false, false]), 'Test with all booleans');
+        Y.ArrayAssert.itemsAreEqual([1, 2, 3], Ext.unique([1, 2, 3, 3, 2, 1]), 'Test with all numbers');
+        Y.ArrayAssert.itemsAreEqual([fn], Ext.unique([fn, fn, fn, fn]), 'Test with functions');
+        Y.ArrayAssert.itemsAreEqual([arr], Ext.unique([arr, arr, arr, arr]), 'Test with arrays');
+        Y.ArrayAssert.itemsAreEqual([obj], Ext.unique([obj, obj, obj, obj]), 'Test with objects');
+        Y.ArrayAssert.itemsAreEqual([date], Ext.unique([date, date, date, date]), 'Test with dates');
+        Y.ArrayAssert.itemsAreEqual([obj, fn, arr, date], Ext.unique([obj, obj, fn, obj, arr, obj, fn, arr, date, fn, arr, obj]), 'Test with objects, functions, arrays, and dates');
+    },
+    
+    // 2
+    test_urlAppend: function(){
+        var url = "http://example.com/";
+        Y.Assert.areEqual('http://example.com/?test=1', Ext.urlAppend(url, 'test=1'), 'Test for question mark');
+        Y.Assert.areEqual('http://example.com/?test=1&foo=2', Ext.urlAppend(url + '?test=1', 'foo=2'), 'Test for ampersand');
+    },
+    
+    // 3
+    test_urlDecode: function(){
+        Y.ObjectAssert.hasKeys({
+            foo: 1,
+            bar: 2
+        }, Ext.urlDecode('foo=1&bar=2'), 'Decode 2 keys');
+        Y.ObjectAssert.hasKeys({
+            foo: 1,
+            bar: ['2', '3', '4']
+        }, Ext.urlDecode('foo=1&bar=2&bar=3&bar=4', false), 'Decode 2 keys, one of them an array (overwrite off)');
+        Y.ObjectAssert.hasKeys({
+            foo: 1,
+            bar: 4
+        }, Ext.urlDecode('foo=1&bar=2&bar=3&bar=4', true), 'Decode 2 keys, one of them an array (overwrite on)');
+    },
+    
+    // 3
+    test_urlEncode: function(){
+        Y.Assert.areEqual('foo=1&bar=2', Ext.urlEncode({
+            foo: 1,
+            bar: 2
+        }), 'Decode 2 keys');
+        Y.Assert.areEqual('foo=1&bar=2&bar=3&bar=4', Ext.urlEncode({
+            foo: 1,
+            bar: ['2', '3', '4']
+        }), 'Decode 2 keys, one of them an array');
+        Y.Assert.areEqual('test=1&foo=1&bar=2&bar=3&bar=4', Ext.urlEncode({
+            foo: 1,
+            bar: ['2', '3', '4']
+        }, 'test=1'), 'Decode 2 keys, one of them an array, with pre: test=1');
+    },
+    
+    // 7
+    test_value: function(){
+        Y.Assert.areEqual('test1', Ext.value('test1', 'test2'), 'Testing "test1" string');
+        Y.Assert.areEqual('test2', Ext.value('', 'test2'), 'Testing blank string');
+        Y.Assert.areEqual('test2', Ext.value(undefined, 'test2'), 'Testing undefined value');
+        Y.Assert.areEqual('test2', Ext.value(null, 'test2'), 'Testing null value');
+        Y.Assert.areEqual('', Ext.value('', 'test2', true), 'Testing blank string with allowBlank: true');
+        // it does not consider undef and null as a blank string, so these are OK
+        Y.Assert.areEqual('test2', Ext.value(undefined, 'test2', true), 'Testing undefined value with allowBlank: true');
+        Y.Assert.areEqual('test2', Ext.value(null, 'test2', true), 'Testing null value with allowBlank: true');
+    },
+    
+    // 4
+    test_zip: function(){
+        var arr = Ext.zip([1, 2, 3], [4, 5, 6]);
+        Y.ArrayAssert.itemsAreEqual([1, 4], arr[0], 'Zip two arrays');
+        Y.ArrayAssert.itemsAreEqual([2, 5], arr[1], 'Zip two arrays');
+        Y.ArrayAssert.itemsAreEqual([3, 6], arr[2], 'Zip two arrays');
+        Y.ArrayAssert.itemsAreEqual([['$+12.43'], ['$-10.15'], ['$+22.96']], Ext.zip(['+', '-', '+'], [12, 10, 22], [43, 15, 96], function(a, b, c){
+            return '$' + a + '' + b + '.' + c;
+        }), 'Zip using a function');
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/util/JSON.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/util/JSON.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/util/JSON.js	(revision 76)
@@ -0,0 +1,32 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.test.session.addTest( 'Ext.util', {
+
+    name: 'JSON',
+
+    planned: 4,
+
+    // same as Ext.encode
+    // 1
+    test_encode: function() {
+        Y.Assert.areEqual( '{"foo":"bar"}', Ext.util.JSON.encode( { foo: 'bar' } ), 'Test encode with simple object' );
+    },
+
+    // same as Ext.decode
+    // 2
+    test_decode: function() {
+        Y.ObjectAssert.hasKeys({
+            foo: 'bar'
+        }, Ext.util.JSON.decode( '{"foo":"bar"}' ), 'Test decode with a simple object');
+        Y.ObjectAssert.hasKeys({
+            foo: ['bar','baz']
+        }, Ext.util.JSON.decode( '{"foo":["bar","baz"]}' ), 'Test decode with a hash + array');
+    }
+
+    // encodeDate
+
+});
Index: /trunk/workshop-routing-foss4g/web/ext/test/unit/util/MixedCollection.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/unit/util/MixedCollection.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/unit/util/MixedCollection.js	(revision 76)
@@ -0,0 +1,543 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function() {
+    var suite  = Ext.test.session.getSuite('Ext.util.MixedCollection'),
+        assert = Y.Assert;
+
+    suite.add(new Y.Test.Case({
+        name: 'constructor',
+
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+        },
+
+        tearDown: function() {
+            this.mc.clear();
+        },
+
+        //test that a default getKey implementation is set
+        testHasDefaultGetKey: function() {
+            var item1      = {id: 1, data: 'first item' },
+                item2      = {id: 2, data: 'second item'};
+            
+            this.mc.add(item1);
+            this.mc.add(item2);
+            
+            assert.areSame(item1, this.mc.get(1));
+            assert.areSame(item2, this.mc.get(2));
+        },
+
+        //test that we can provide a getKey implementation
+        testCanSetGetKey: function() {
+            var collection = new Ext.util.MixedCollection(false, function(item) {
+                return item.myKey;
+            });
+            
+            var item1 = {myKey: 'a', data: 'first item' },
+                item2 = {myKey: 'b', data: 'second item'};
+            
+            collection.add(item1);
+            collection.add(item2);
+            
+            assert.areSame(item2, collection.get('b'));
+            assert.areSame(item1, collection.get('a'));
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'iterators',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            
+            this.mc.addAll([
+                {id: 1, name: 'first'},
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+
+        testEach: function() {
+            var callCount = 0, callScope, total;
+            
+            this.mc.each(function(item, index, length) {
+                //make sure that the function is called in the correct scope
+                callScope = this;
+                callCount ++;
+                total = length;
+            }, this);
+            
+            assert.areEqual(this, callScope);
+            assert.areEqual(3, callCount);
+            assert.areEqual(3, total);
+        },
+        
+        testEachKey: function() {
+            var callCount = 0, callScope;
+            
+            this.mc.eachKey(function(key, index, length) {
+                //make sure that the function is called in the correct scope
+                callScope = this;
+                callCount ++;
+            }, this);
+            
+            assert.areEqual(this, callScope);
+            assert.areEqual(3, callCount);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'add and remove',
+       
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+        },
+       
+        testAddAll: function() {
+            var mc = this.mc;
+            
+            assert.areEqual(0, mc.length);
+            
+            mc.addAll([{id: 1}, {id: 2}, {id: 3}]);
+            
+            assert.areEqual(3, mc.length);
+        },
+        
+        testAddAndClear: function() {
+            var mc = this.mc;
+            
+            mc.add({id: 1});
+            mc.add({id: 2});
+            mc.add({id: 3});
+            
+            assert.areEqual(3, mc.length);
+            
+            mc.clear();
+            assert.areEqual(0, mc.length);
+        },
+        
+        testAddEventFired: function() {
+            var mc    = this.mc,
+                fired = false;
+            
+            mc.on('add', function() {fired = true;});
+            
+            mc.add({id: 1});
+            assert.isTrue(fired);
+        },
+        
+        testClearEventFired: function() {
+            var mc    = this.mc,
+                fired = false;
+            
+            mc.on('clear', function() {fired = true;}, this);
+            mc.clear();
+            
+            assert.isTrue(fired);
+        },
+        
+        testGetCount: function() {
+            this.mc.add({id: 1});
+            this.mc.add({id: 2});
+            this.mc.add({id: 3});
+            
+            assert.areEqual(3, this.mc.getCount());
+        },
+        
+        testRemove: function() {
+            
+        },
+        
+        testRemoveFiresEvent: function() {
+            
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'insert',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            
+            this.mc.addAll([
+                {id: 1, name: 'first'},
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        doInsert: function() {
+            this.mc.insert(1, {id: 4, name: 'fourth'});
+        },
+        
+        testInsertsToCorrectLocation: function() {
+            this.doInsert();
+            
+            assert.areEqual(4, this.mc.itemAt(1).id);
+        },
+        
+        testOtherItemsPreserved: function() {
+            var prevCount = this.mc.getCount();
+            
+            this.doInsert();
+            assert.areEqual(prevCount + 1, this.mc.getCount());
+        },
+        
+        testFiresAddEvent: function() {
+            var fired = false;
+            
+            this.mc.on('add', function() { fired = true; });
+            this.doInsert();
+            
+            assert.isTrue(fired);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'replace',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            
+            this.mc.addAll([
+                {id: 1, name: 'first'},
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        doReplace: function() {
+            this.mc.replace(2, {id: 4, name: 'fourth'});
+        },
+        
+        testReplacesCorrectItem: function() {
+            this.doReplace();
+            assert.areEqual("fourth", this.mc.itemAt(1).name);
+        },
+        
+        testPreviousItemRemoved: function() {
+            var prevCount = this.mc.getCount();
+            
+            this.doReplace();
+            assert.areEqual(prevCount, this.mc.getCount());
+        },
+        
+        testReplaceEventFired: function() {
+            var fired = false;
+            
+            this.mc.on('replace', function() { fired = true; });
+            this.doReplace();
+            
+            assert.isTrue(fired);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'clone',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            
+            this.mc.addAll([
+                {id: 1, name: 'first'},
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        //test that a shallow clone is completed correctly
+        testClone: function() {
+            var newMC = this.mc.clone();
+            
+            assert.areEqual(3, newMC.getCount());
+            
+            Ext.each([1, 2, 3], function(id) {
+              assert.areEqual(this.mc.get(id).id, newMC.get(id).id);
+            }, this);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'getting items',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            this.item1 = {id: 1, name: 'first'};
+            
+            this.mc.addAll([
+                this.item1,
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        testFirst: function() {
+            assert.areEqual(1, this.mc.first().id);
+        },
+        
+        testLast: function() {
+            assert.areEqual(3, this.mc.last().id);
+        },
+        
+        testGet: function() {
+            assert.areEqual(2, this.mc.get(2).id);
+        },
+        
+        testGetKey: function() {
+            assert.areEqual(1, this.mc.getKey(this.item1));
+        },
+        
+        //should return items in the given range
+        testGetRange: function() {
+            var items = this.mc.getRange(1, 2);
+            
+            assert.areEqual(2, items.length);
+            assert.areEqual(2, items[0].id);
+            assert.areEqual(3, items[1].id);
+        },
+        
+        //should get all items
+        testGetRangeWithNoArguments: function() {
+            var items = this.mc.getRange();
+            
+            assert.areEqual(3, items.length);
+        },
+        
+        //should get all items after the provided start index
+        testGetRangeWithNoEnd: function() {
+            var items = this.mc.getRange(1);
+            
+            assert.areEqual(2, items.length);
+        },
+        
+        testIndexOf: function() {
+            assert.areEqual(0, this.mc.indexOf(this.item1));
+        },
+        
+        testIndexOfKey: function() {
+            assert.areEqual(2, this.mc.indexOfKey(3));
+        },
+        
+        testKey: function() {
+            assert.areEqual(3, this.mc.key(3).id);
+        },
+        
+        testItemByIndex: function() {
+            this.mc.add({id: 'a', name: 'another item'});
+            this.mc.add({id: 'b', name: 'yet another item'});
+            
+            assert.areEqual('b', this.mc.item(4).id);
+        },
+        
+        //key should take priority over index
+        testItemByKey: function() {
+            this.mc.add({id: 'a', name: 'another item'});
+            
+            assert.areEqual('a', this.mc.item('a').id);
+        },
+        
+        testItemAt: function() {
+            assert.areEqual(3, this.mc.itemAt(2).id);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'find functions',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            
+            this.mc.addAll([
+                {id: 1, name: 'first'},
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        testFind: function() {
+            var matched = this.mc.find(function(item) {
+                return item.name == 'third';
+            });
+            
+            assert.areEqual('third', matched.name);
+        },
+        
+        testFindIndex: function() {
+            var matched = this.mc.findIndex('name', 'third');
+            
+            assert.areEqual(2, matched);
+        },
+        
+        testFindIndexBy: function() {
+            var matched = this.mc.findIndexBy(function(item) {
+                return item.name == 'second';
+            });
+            
+            assert.areEqual(1, matched);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'contains',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection();
+            this.item = {id: 1, name: 'first'};
+            
+            this.mc.addAll([
+                this.item,
+                {id: 2, name: 'second'},
+                {id: 3, name: 'third'}
+            ]);
+        },
+        
+        tearDown: function() {
+            delete this.item;
+        },
+        
+        testContains: function() {
+            assert.isTrue(this.mc.contains(this.item));
+        },
+        
+        testDoesNotContain: function() {
+            assert.isFalse(this.mc.contains({some: 'object'}));
+        },
+        
+        testContainsKey: function() {
+            assert.isTrue(this.mc.containsKey(1));
+        },
+        
+        testDoesNotContainKey: function() {
+            assert.isFalse(this.mc.containsKey('abc'));
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'single sorting',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection(false, function(item) {
+                return item['code'];
+            });
+            
+            this.mc.addAll([
+                {id: 1, name: 'first',  code: 'C', modifier: 10},
+                {id: 2, name: 'second', code: 'A', modifier: 100},
+                {id: 3, name: 'third',  code: 'B', modifier: 5}
+            ]);
+        },
+        
+        testKeySort: function() {
+            var mc = this.mc;
+            mc.keySort();
+            
+            assert.areEqual('A', mc.itemAt(0).code);
+            assert.areEqual('B', mc.itemAt(1).code);
+            assert.areEqual('C', mc.itemAt(2).code);
+        },
+        
+        testDirectionalKeySort: function() {
+            var mc = this.mc;
+            mc.keySort('DESC');
+            
+            assert.areEqual('C', mc.itemAt(0).code);
+            assert.areEqual('B', mc.itemAt(1).code);
+            assert.areEqual('A', mc.itemAt(2).code);
+        },
+        
+        testSort: function() {
+            var mc = new Ext.util.MixedCollection();
+            mc.addAll(3, 1, 4, 2);
+            mc.sort();
+            
+            assert.areEqual(1, mc.itemAt(0));
+            assert.areEqual(2, mc.itemAt(1));
+            assert.areEqual(3, mc.itemAt(2));
+            assert.areEqual(4, mc.itemAt(3));
+        },
+        
+        testDirectionalSort: function() {
+            
+        },
+        
+        testSortWithComparator: function() {
+            var mc = this.mc;
+            mc.sort('ASC', function(a, b) {
+                return (a.id * a.modifier) - (b.id * b.modifier);
+            });
+            
+            assert.areEqual('C', mc.itemAt(0).code);
+            assert.areEqual('B', mc.itemAt(1).code);
+            assert.areEqual('A', mc.itemAt(2).code);
+        },
+        
+        testDirectionalSortWithComparator: function() {
+            var mc = this.mc;
+            mc.sort('DESC', function(a, b) {
+                return (a.id * a.modifier) - (b.id * b.modifier);
+            });
+            
+            assert.areEqual('A', mc.itemAt(0).code);
+            assert.areEqual('B', mc.itemAt(1).code);
+            assert.areEqual('C', mc.itemAt(2).code);
+        },
+        
+        testSortEventFired: function() {
+            var fired = false;
+            
+            this.mc.on('sort', function() { fired = true; });
+            this.mc.sort('name');
+            
+            assert.isTrue(fired);
+        }
+    }));
+    
+    suite.add(new Y.Test.Case({
+        name: 'reordering',
+        
+        setUp: function() {
+            this.mc = new Ext.util.MixedCollection(false, function(item) {
+                return item['code'];
+            });
+            
+            this.mc.addAll([
+                {id: 1, name: 'first',  code: 'C', modifier: 10},
+                {id: 2, name: 'second', code: 'A', modifier: 100},
+                {id: 3, name: 'third',  code: 'B', modifier: 5}
+            ]);
+        },
+        
+        testReordering: function() {
+            var mc = this.mc;
+            
+            mc.reorder({
+                1: 2,
+                2: 0
+            });
+            
+            assert.areEqual('B', mc.itemAt(0).code);
+            assert.areEqual('C', mc.itemAt(1).code);
+            assert.areEqual('A', mc.itemAt(2).code);
+        },
+        
+        testSortEventFired: function() {
+            var wasFired = false,
+                mc       = this.mc;
+            
+            mc.on('sort', function() {
+                wasFired = true;
+            }, this);
+            
+            mc.reorder({
+                1: 2,
+                2: 0
+            });
+            
+            assert.isTrue(wasFired);
+        }
+    }));
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/test/performance/window.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/test/performance/window.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/test/performance/window.js	(revision 76)
@@ -0,0 +1,494 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Creates a window with 40 tabs, profiles initial rendering speed and resize rendering speed
+ */
+
+function addWindowPerformanceTest() {
+        Ext.test.profiler.add({
+        name      : 'AnchorLayout',
+        skipVersions: ['2.2.0', '3.1.0'],
+        iterations: 1000,
+        newWindow : true,
+
+        beforeAll : function() {
+            this.previousBuffer = Ext.Container.bufferResize;
+            Ext.Container.bufferResize = false;
+        },
+
+        afterAll : function() {
+            Ext.Container.bufferResize = this.previousBuffer;
+        },
+
+        execute   : function() {
+
+
+            this.win = new Ext.Viewport({
+                layout: 'fit',
+                items: [{
+                    xtype: 'container',
+                    layout: 'form',
+                    items: [{
+                        xtype: 'textfield',
+                        width: 100
+                    }, {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        anchor: '100%'
+                    },
+                    {
+                        xtype: 'textfield',
+                        width: 100
+                    }]
+                }]
+            });
+
+        },
+
+        afterEach: function() {
+          this.win.destroy();
+        }
+    });
+/*
+    Ext.test.profiler.add({
+        name      : 'ColumnLayout',
+        skipVersions: ['2.2.0'],
+        iterations: 50,
+        newWindow : true,
+
+        beforeAll : function() {
+            this.previousBuffer = Ext.Container.bufferResize;
+            Ext.Container.bufferResize = false;
+        },
+
+        afterAll : function() {
+            Ext.Container.bufferResize = this.previousBuffer;
+        },
+
+        execute   : function() {
+
+            this.win = new Ext.Viewport({
+                layout: 'fit',
+                items: [{
+                    xtype: 'container',
+                    layout: 'column',
+                    defaults: {
+                        height: 30
+                    },
+                    items: [{
+                        xtype: 'container',
+                        width: 100
+                    }, {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        columnWidth: .05
+                    },
+                    {
+                        xtype: 'container',
+                        width: 100
+                    }]
+                }]
+            });
+
+        },
+
+        afterEach: function() {
+          this.win.destroy();
+        }
+    });
+
+    Ext.test.profiler.add({
+        name      : 'HBoxLayout',
+        skipVersions: ['2.2.0'],
+        iterations: 50,
+        newWindow : true,
+
+        beforeAll : function() {
+            this.previousBuffer = Ext.Container.bufferResize;
+            Ext.Container.bufferResize = false;
+        },
+
+        afterAll : function() {
+            Ext.Container.bufferResize = this.previousBuffer;
+        },
+
+        execute   : function() {
+
+            this.win = new Ext.Viewport({
+                layout: 'fit',
+                items: [{
+                    xtype: 'container',
+                    layout: 'hbox',
+                    layoutConfig: {
+                        align: 'stretch'
+                    },
+                    items: [{
+                        xtype: 'container',
+                        width: 100
+                    }, {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 1
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 2
+                    },
+                    {
+                        xtype: 'container',
+                        flex: 3
+                    },
+                    {
+                        xtype: 'container',
+                        width: 100
+                    }]
+                }]
+            });
+
+      } ,
+
+        afterEach: function() {
+          this.win.destroy();
+        }
+    });
+*/
+};
+
+if (typeof Ext != 'undefined' && typeof Ext.test != 'undefined') {
+    addWindowPerformanceTest();
+} else {
+    Ext.onReady(addWindowPerformanceTest);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+window.undefined=window.undefined;Ext={version:"3.4.0",versionDetail:{major:3,minor:4,patch:0}};Ext.apply=function(d,e,b){if(b){Ext.apply(d,b)}if(d&&e&&typeof e=="object"){for(var a in e){d[a]=e[a]}}return d};(function(){var g=0,u=Object.prototype.toString,v=navigator.userAgent.toLowerCase(),A=function(e){return e.test(v)},i=document,n=i.documentMode,l=i.compatMode=="CSS1Compat",C=A(/opera/),h=A(/\bchrome\b/),w=A(/webkit/),z=!h&&A(/safari/),f=z&&A(/applewebkit\/4/),b=z&&A(/version\/3/),D=z&&A(/version\/4/),t=!C&&A(/msie/),r=t&&(A(/msie 7/)||n==7),q=t&&(A(/msie 8/)&&n!=7),p=t&&A(/msie 9/),s=t&&!r&&!q&&!p,o=!w&&A(/gecko/),d=o&&A(/rv:1\.8/),a=o&&A(/rv:1\.9/),x=t&&!l,B=A(/windows|win32/),k=A(/macintosh|mac os x/),j=A(/adobeair/),m=A(/linux/),c=/^https/i.test(window.location.protocol);if(s){try{i.execCommand("BackgroundImageCache",false,true)}catch(y){}}Ext.apply(Ext,{SSL_SECURE_URL:c&&t?'javascript:""':"about:blank",isStrict:l,isSecure:c,isReady:false,enableForcedBoxModel:false,enableGarbageCollector:true,enableListenerCollection:false,enableNestedListenerRemoval:false,USE_NATIVE_JSON:false,applyIf:function(E,F){if(E){for(var e in F){if(!Ext.isDefined(E[e])){E[e]=F[e]}}}return E},id:function(e,E){e=Ext.getDom(e,true)||{};if(!e.id){e.id=(E||"ext-gen")+(++g)}return e.id},extend:function(){var E=function(G){for(var F in G){this[F]=G[F]}};var e=Object.prototype.constructor;return function(L,I,K){if(typeof I=="object"){K=I;I=L;L=K.constructor!=e?K.constructor:function(){I.apply(this,arguments)}}var H=function(){},J,G=I.prototype;H.prototype=G;J=L.prototype=new H();J.constructor=L;L.superclass=G;if(G.constructor==e){G.constructor=I}L.override=function(F){Ext.override(L,F)};J.superclass=J.supr=(function(){return G});J.override=E;Ext.override(L,K);L.extend=function(F){return Ext.extend(L,F)};return L}}(),override:function(e,F){if(F){var E=e.prototype;Ext.apply(E,F);if(Ext.isIE&&F.hasOwnProperty("toString")){E.toString=F.toString}}},namespace:function(){var G=arguments.length,H=0,E,F,e,J,I,K;for(;H<G;++H){e=arguments[H];J=arguments[H].split(".");K=window[J[0]];if(K===undefined){K=window[J[0]]={}}I=J.slice(1);E=I.length;for(F=0;F<E;++F){K=K[I[F]]=K[I[F]]||{}}}return K},urlEncode:function(I,H){var F,E=[],G=encodeURIComponent;Ext.iterate(I,function(e,J){F=Ext.isEmpty(J);Ext.each(F?e:J,function(K){E.push("&",G(e),"=",(!Ext.isEmpty(K)&&(K!=e||!F))?(Ext.isDate(K)?Ext.encode(K).replace(/"/g,""):G(K)):"")})});if(!H){E.shift();H=""}return H+E.join("")},urlDecode:function(F,E){if(Ext.isEmpty(F)){return{}}var I={},H=F.split("&"),J=decodeURIComponent,e,G;Ext.each(H,function(K){K=K.split("=");e=J(K[0]);G=J(K[1]);I[e]=E||!I[e]?G:[].concat(I[e]).concat(G)});return I},urlAppend:function(e,E){if(!Ext.isEmpty(E)){return e+(e.indexOf("?")===-1?"?":"&")+E}return e},toArray:function(){return t?function(F,I,G,H){H=[];for(var E=0,e=F.length;E<e;E++){H.push(F[E])}return H.slice(I||0,G||H.length)}:function(e,F,E){return Array.prototype.slice.call(e,F||0,E||e.length)}}(),isIterable:function(e){if(Ext.isArray(e)||e.callee){return true}if(/NodeList|HTMLCollection/.test(u.call(e))){return true}return((typeof e.nextNode!="undefined"||e.item)&&Ext.isNumber(e.length))},each:function(H,G,F){if(Ext.isEmpty(H,true)){return}if(!Ext.isIterable(H)||Ext.isPrimitive(H)){H=[H]}for(var E=0,e=H.length;E<e;E++){if(G.call(F||H[E],H[E],E,H)===false){return E}}},iterate:function(F,E,e){if(Ext.isEmpty(F)){return}if(Ext.isIterable(F)){Ext.each(F,E,e);return}else{if(typeof F=="object"){for(var G in F){if(F.hasOwnProperty(G)){if(E.call(e||F,G,F[G],F)===false){return}}}}}},getDom:function(F,E){if(!F||!i){return null}if(F.dom){return F.dom}else{if(typeof F=="string"){var G=i.getElementById(F);if(G&&t&&E){if(F==G.getAttribute("id")){return G}else{return null}}return G}else{return F}}},getBody:function(){return Ext.get(i.body||i.documentElement)},getHead:function(){var e;return function(){if(e==undefined){e=Ext.get(i.getElementsByTagName("head")[0])}return e}}(),removeNode:t&&!q?function(){var e;return function(E){if(E&&E.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(E,true):Ext.EventManager.removeAll(E);e=e||i.createElement("div");e.appendChild(E);e.innerHTML="";delete Ext.elCache[E.id]}}}():function(e){if(e&&e.parentNode&&e.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(e,true):Ext.EventManager.removeAll(e);e.parentNode.removeChild(e);delete Ext.elCache[e.id]}},isEmpty:function(E,e){return E===null||E===undefined||((Ext.isArray(E)&&!E.length))||(!e?E==="":false)},isArray:function(e){return u.apply(e)==="[object Array]"},isDate:function(e){return u.apply(e)==="[object Date]"},isObject:function(e){return !!e&&Object.prototype.toString.call(e)==="[object Object]"},isPrimitive:function(e){return Ext.isString(e)||Ext.isNumber(e)||Ext.isBoolean(e)},isFunction:function(e){return u.apply(e)==="[object Function]"},isNumber:function(e){return typeof e==="number"&&isFinite(e)},isString:function(e){return typeof e==="string"},isBoolean:function(e){return typeof e==="boolean"},isElement:function(e){return e?!!e.tagName:false},isDefined:function(e){return typeof e!=="undefined"},isOpera:C,isWebKit:w,isChrome:h,isSafari:z,isSafari3:b,isSafari4:D,isSafari2:f,isIE:t,isIE6:s,isIE7:r,isIE8:q,isIE9:p,isGecko:o,isGecko2:d,isGecko3:a,isBorderBox:x,isLinux:m,isWindows:B,isMac:k,isAir:j});Ext.ns=Ext.namespace})();Ext.ns("Ext.util","Ext.lib","Ext.data","Ext.supports");Ext.elCache={};Ext.apply(Function.prototype,{createInterceptor:function(b,a){var c=this;return !Ext.isFunction(b)?this:function(){var e=this,d=arguments;b.target=e;b.method=c;return(b.apply(a||e||window,d)!==false)?c.apply(e||window,d):null}},createCallback:function(){var a=arguments,b=this;return function(){return b.apply(window,a)}},createDelegate:function(c,b,a){var d=this;return function(){var f=b||arguments;if(a===true){f=Array.prototype.slice.call(arguments,0);f=f.concat(b)}else{if(Ext.isNumber(a)){f=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(f,e)}}return d.apply(c||window,f)}},defer:function(c,e,b,a){var d=this.createDelegate(e,b,a);if(c>0){return setTimeout(d,c)}d();return 0}});Ext.applyIf(String,{format:function(b){var a=Ext.toArray(arguments,1);return b.replace(/\{(\d+)\}/g,function(c,d){return a[d]})}});Ext.applyIf(Array.prototype,{indexOf:function(b,c){var a=this.length;c=c||0;c+=(c<0)?a:0;for(;c<a;++c){if(this[c]===b){return c}}return -1},remove:function(b){var a=this.indexOf(b);if(a!=-1){this.splice(a,1)}return this}});Ext.util.TaskRunner=function(e){e=e||10;var f=[],a=[],b=0,g=false,d=function(){g=false;clearInterval(b);b=0},h=function(){if(!g){g=true;b=setInterval(i,e)}},c=function(j){a.push(j);if(j.onStop){j.onStop.apply(j.scope||j)}},i=function(){var l=a.length,n=new Date().getTime();if(l>0){for(var p=0;p<l;p++){f.remove(a[p])}a=[];if(f.length<1){d();return}}for(var p=0,o,k,m,j=f.length;p<j;++p){o=f[p];k=n-o.taskRunTime;if(o.interval<=k){m=o.run.apply(o.scope||o,o.args||[++o.taskRunCount]);o.taskRunTime=n;if(m===false||o.taskRunCount===o.repeat){c(o);return}}if(o.duration&&o.duration<=(n-o.taskStartTime)){c(o)}}};this.start=function(j){f.push(j);j.taskStartTime=new Date().getTime();j.taskRunTime=0;j.taskRunCount=0;h();return j};this.stop=function(j){c(j);return j};this.stopAll=function(){d();for(var k=0,j=f.length;k<j;k++){if(f[k].onStop){f[k].onStop()}}f=[];a=[]}};Ext.TaskMgr=new Ext.util.TaskRunner();if(typeof jQuery=="undefined"){throw"Unable to load Ext, jQuery not found."}(function(){var b;Ext.lib.Dom={getViewWidth:function(d){return d?Math.max(jQuery(document).width(),jQuery(window).width()):jQuery(window).width()},getViewHeight:function(d){return d?Math.max(jQuery(document).height(),jQuery(window).height()):jQuery(window).height()},isAncestor:function(e,f){var d=false;e=Ext.getDom(e);f=Ext.getDom(f);if(e&&f){if(e.contains){return e.contains(f)}else{if(e.compareDocumentPosition){return !!(e.compareDocumentPosition(f)&16)}else{while(f=f.parentNode){d=f==e||d}}}}return d},getRegion:function(d){return Ext.lib.Region.getRegion(d)},getY:function(d){return this.getXY(d)[1]},getX:function(d){return this.getXY(d)[0]},getXY:function(f){var e,j,l,m,i=(document.body||document.documentElement);f=Ext.getDom(f);if(f==i){return[0,0]}if(f.getBoundingClientRect){l=f.getBoundingClientRect();m=c(document).getScroll();return[Math.round(l.left+m.left),Math.round(l.top+m.top)]}var n=0,k=0;e=f;var d=c(f).getStyle("position")=="absolute";while(e){n+=e.offsetLeft;k+=e.offsetTop;if(!d&&c(e).getStyle("position")=="absolute"){d=true}if(Ext.isGecko){j=c(e);var o=parseInt(j.getStyle("borderTopWidth"),10)||0;var g=parseInt(j.getStyle("borderLeftWidth"),10)||0;n+=g;k+=o;if(e!=f&&j.getStyle("overflow")!="visible"){n+=g;k+=o}}e=e.offsetParent}if(Ext.isSafari&&d){n-=i.offsetLeft;k-=i.offsetTop}if(Ext.isGecko&&!d){var h=c(i);n+=parseInt(h.getStyle("borderLeftWidth"),10)||0;k+=parseInt(h.getStyle("borderTopWidth"),10)||0}e=f.parentNode;while(e&&e!=i){if(!Ext.isOpera||(e.tagName!="TR"&&c(e).getStyle("display")!="inline")){n-=e.scrollLeft;k-=e.scrollTop}e=e.parentNode}return[n,k]},setXY:function(d,e){d=Ext.fly(d,"_setXY");d.position();var f=d.translatePoints(e);if(e[0]!==false){d.dom.style.left=f.left+"px"}if(e[1]!==false){d.dom.style.top=f.top+"px"}},setX:function(e,d){this.setXY(e,[d,false])},setY:function(d,e){this.setXY(d,[false,e])}};function c(d){if(!b){b=new Ext.Element.Flyweight()}b.dom=d;return b}Ext.lib.Event={getPageX:function(d){d=d.browserEvent||d;return d.pageX},getPageY:function(d){d=d.browserEvent||d;return d.pageY},getXY:function(d){d=d.browserEvent||d;return[d.pageX,d.pageY]},getTarget:function(d){return d.target},on:function(h,d,g,f,e){jQuery(h).bind(d,g)},un:function(f,d,e){jQuery(f).unbind(d,e)},purgeElement:function(d){jQuery(d).unbind()},preventDefault:function(d){d=d.browserEvent||d;if(d.preventDefault){d.preventDefault()}else{d.returnValue=false}},stopPropagation:function(d){d=d.browserEvent||d;if(d.stopPropagation){d.stopPropagation()}else{d.cancelBubble=true}},stopEvent:function(d){this.preventDefault(d);this.stopPropagation(d)},onAvailable:function(j,e,d){var i=new Date();var g=function(){if(i.getElapsed()>10000){clearInterval(h)}var f=document.getElementById(j);if(f){clearInterval(h);e.call(d||window,f)}};var h=setInterval(g,50)},resolveTextNode:Ext.isGecko?function(e){if(!e){return}var d=HTMLElement.prototype.toString.call(e);if(d=="[xpconnect wrapped native prototype]"||d=="[object XULElement]"){return}return e.nodeType==3?e.parentNode:e}:function(d){return d&&d.nodeType==3?d.parentNode:d},getRelatedTarget:function(e){e=e.browserEvent||e;var d=e.relatedTarget;if(!d){if(e.type=="mouseout"){d=e.toElement}else{if(e.type=="mouseover"){d=e.fromElement}}}return this.resolveTextNode(d)}};Ext.lib.Ajax=function(){var d=function(f){return function(h,g){if((g=="error"||g=="timeout")&&f.failure){f.failure.call(f.scope||window,e(f,h))}else{if(f.success){f.success.call(f.scope||window,e(f,h))}}}};var e=function(f,l){var h={},j,g,i;try{j=l.getAllResponseHeaders();Ext.each(j.replace(/\r\n/g,"\n").split("\n"),function(m){g=m.indexOf(":");if(g>=0){i=m.substr(0,g).toLowerCase();if(m.charAt(g+1)==" "){++g}h[i]=m.substr(g+1)}})}catch(k){}return{responseText:l.responseText,responseXML:l.responseXML,argument:f.argument,status:l.status,statusText:l.statusText,getResponseHeader:function(m){return h[m.toLowerCase()]},getAllResponseHeaders:function(){return j}}};return{request:function(l,i,f,j,g){var k={type:l,url:i,data:j,timeout:f.timeout,complete:d(f)};if(g){var h=g.headers;if(g.xmlData){k.data=g.xmlData;k.processData=false;k.type=(l?l:(g.method?g.method:"POST"));if(!h||!h["Content-Type"]){k.contentType="text/xml"}}else{if(g.jsonData){k.data=typeof g.jsonData=="object"?Ext.encode(g.jsonData):g.jsonData;k.processData=false;k.type=(l?l:(g.method?g.method:"POST"));if(!h||!h["Content-Type"]){k.contentType="application/json"}}}if(h){k.beforeSend=function(n){for(var m in h){if(h.hasOwnProperty(m)){n.setRequestHeader(m,h[m])}}}}}jQuery.ajax(k)},formRequest:function(j,i,g,k,f,h){jQuery.ajax({type:Ext.getDom(j).method||"POST",url:i,data:jQuery(j).serialize()+(k?"&"+k:""),timeout:g.timeout,complete:d(g)})},isCallInProgress:function(f){return false},abort:function(f){return false},serializeForm:function(f){return jQuery(f.dom||f).serialize()}}}();Ext.lib.Anim=function(){var d=function(e,f){var g=true;return{stop:function(h){},isAnimated:function(){return g},proxyCallback:function(){g=false;Ext.callback(e,f)}}};return{scroll:function(h,f,j,k,e,g){var i=d(e,g);h=Ext.getDom(h);if(typeof f.scroll.to[0]=="number"){h.scrollLeft=f.scroll.to[0]}if(typeof f.scroll.to[1]=="number"){h.scrollTop=f.scroll.to[1]}i.proxyCallback();return i},motion:function(h,f,i,j,e,g){return this.run(h,f,i,j,e,g)},color:function(h,f,j,k,e,g){var i=d(e,g);i.proxyCallback();return i},run:function(g,q,j,p,h,s,r){var l=d(h,s),m=Ext.fly(g,"_animrun");var f={};for(var i in q){switch(i){case"points":var n,u;m.position();if(n=q.points.by){var t=m.getXY();u=m.translatePoints([t[0]+n[0],t[1]+n[1]])}else{u=m.translatePoints(q.points.to)}f.left=u.left;f.top=u.top;if(!parseInt(m.getStyle("left"),10)){m.setLeft(0)}if(!parseInt(m.getStyle("top"),10)){m.setTop(0)}if(q.points.from){m.setXY(q.points.from)}break;case"width":f.width=q.width.to;if(q.width.from){m.setWidth(q.width.from)}break;case"height":f.height=q.height.to;if(q.height.from){m.setHeight(q.height.from)}break;case"opacity":f.opacity=q.opacity.to;if(q.opacity.from){m.setOpacity(q.opacity.from)}break;case"left":f.left=q.left.to;if(q.left.from){m.setLeft(q.left.from)}break;case"top":f.top=q.top.to;if(q.top.from){m.setTop(q.top.from)}break;case"callback":case"scope":case"xy":break;default:f[i]=q[i].to;if(q[i].from){m.setStyle(i,q[i].from)}break}}jQuery(g).animate(f,j*1000,undefined,l.proxyCallback);return l}}}();Ext.lib.Region=function(f,g,d,e){this.top=f;this[1]=f;this.right=g;this.bottom=d;this.left=e;this[0]=e};Ext.lib.Region.prototype={contains:function(d){return(d.left>=this.left&&d.right<=this.right&&d.top>=this.top&&d.bottom<=this.bottom)},getArea:function(){return((this.bottom-this.top)*(this.right-this.left))},intersect:function(h){var f=Math.max(this.top,h.top);var g=Math.min(this.right,h.right);var d=Math.min(this.bottom,h.bottom);var e=Math.max(this.left,h.left);if(d>=f&&g>=e){return new Ext.lib.Region(f,g,d,e)}else{return null}},union:function(h){var f=Math.min(this.top,h.top);var g=Math.max(this.right,h.right);var d=Math.max(this.bottom,h.bottom);var e=Math.min(this.left,h.left);return new Ext.lib.Region(f,g,d,e)},constrainTo:function(d){this.top=this.top.constrain(d.top,d.bottom);this.bottom=this.bottom.constrain(d.top,d.bottom);this.left=this.left.constrain(d.left,d.right);this.right=this.right.constrain(d.left,d.right);return this},adjust:function(f,e,d,g){this.top+=f;this.left+=e;this.right+=g;this.bottom+=d;return this}};Ext.lib.Region.getRegion=function(g){var i=Ext.lib.Dom.getXY(g);var f=i[1];var h=i[0]+g.offsetWidth;var d=i[1]+g.offsetHeight;var e=i[0];return new Ext.lib.Region(f,h,d,e)};Ext.lib.Point=function(d,e){if(Ext.isArray(d)){e=d[1];d=d[0]}this.x=this.right=this.left=this[0]=d;this.y=this.top=this.bottom=this[1]=e};Ext.lib.Point.prototype=new Ext.lib.Region();if(Ext.isIE){function a(){var d=Function.prototype;delete d.createSequence;delete d.defer;delete d.createDelegate;delete d.createCallback;delete d.createInterceptor;window.detachEvent("onunload",a)}window.attachEvent("onunload",a)}})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/jquery/ext-jquery-adapter-debug.js	(revision 76)
@@ -0,0 +1,1817 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// for old browsers
+window.undefined = window.undefined;
+
+/**
+ * @class Ext
+ * Ext core utilities and functions.
+ * @singleton
+ */
+
+Ext = {
+    /**
+     * The version of the framework
+     * @type String
+     */
+    version : '3.4.0',
+    versionDetail : {
+        major : 3,
+        minor : 4,
+        patch : 0
+    }
+};
+
+/**
+ * Copies all the properties of config to obj.
+ * @param {Object} obj The receiver of the properties
+ * @param {Object} config The source of the properties
+ * @param {Object} defaults A different object that will also be applied for default values
+ * @return {Object} returns obj
+ * @member Ext apply
+ */
+Ext.apply = function(o, c, defaults){
+    // no "this" reference for friendly out of scope calls
+    if(defaults){
+        Ext.apply(o, defaults);
+    }
+    if(o && c && typeof c == 'object'){
+        for(var p in c){
+            o[p] = c[p];
+        }
+    }
+    return o;
+};
+
+(function(){
+    var idSeed = 0,
+        toString = Object.prototype.toString,
+        ua = navigator.userAgent.toLowerCase(),
+        check = function(r){
+            return r.test(ua);
+        },
+        DOC = document,
+        docMode = DOC.documentMode,
+        isStrict = DOC.compatMode == "CSS1Compat",
+        isOpera = check(/opera/),
+        isChrome = check(/\bchrome\b/),
+        isWebKit = check(/webkit/),
+        isSafari = !isChrome && check(/safari/),
+        isSafari2 = isSafari && check(/applewebkit\/4/), // unique to Safari 2
+        isSafari3 = isSafari && check(/version\/3/),
+        isSafari4 = isSafari && check(/version\/4/),
+        isIE = !isOpera && check(/msie/),
+        isIE7 = isIE && (check(/msie 7/) || docMode == 7),
+        isIE8 = isIE && (check(/msie 8/) && docMode != 7),
+        isIE9 = isIE && check(/msie 9/),
+        isIE6 = isIE && !isIE7 && !isIE8 && !isIE9,
+        isGecko = !isWebKit && check(/gecko/),
+        isGecko2 = isGecko && check(/rv:1\.8/),
+        isGecko3 = isGecko && check(/rv:1\.9/),
+        isBorderBox = isIE && !isStrict,
+        isWindows = check(/windows|win32/),
+        isMac = check(/macintosh|mac os x/),
+        isAir = check(/adobeair/),
+        isLinux = check(/linux/),
+        isSecure = /^https/i.test(window.location.protocol);
+
+    // remove css image flicker
+    if(isIE6){
+        try{
+            DOC.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+
+    Ext.apply(Ext, {
+        /**
+         * URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent
+         * the IE insecure content warning (<tt>'about:blank'</tt>, except for IE in secure mode, which is <tt>'javascript:""'</tt>).
+         * @type String
+         */
+        SSL_SECURE_URL : isSecure && isIE ? 'javascript:""' : 'about:blank',
+        /**
+         * True if the browser is in strict (standards-compliant) mode, as opposed to quirks mode
+         * @type Boolean
+         */
+        isStrict : isStrict,
+        /**
+         * True if the page is running over SSL
+         * @type Boolean
+         */
+        isSecure : isSecure,
+        /**
+         * True when the document is fully initialized and ready for action
+         * @type Boolean
+         */
+        isReady : false,
+
+        /**
+         * True if the {@link Ext.Fx} Class is available
+         * @type Boolean
+         * @property enableFx
+         */
+
+        /**
+         * HIGHLY EXPERIMENTAL
+         * True to force css based border-box model override and turning off javascript based adjustments. This is a
+         * runtime configuration and must be set before onReady.
+         * @type Boolean
+         */
+        enableForcedBoxModel : false,
+
+        /**
+         * True to automatically uncache orphaned Ext.Elements periodically (defaults to true)
+         * @type Boolean
+         */
+        enableGarbageCollector : true,
+
+        /**
+         * True to automatically purge event listeners during garbageCollection (defaults to false).
+         * @type Boolean
+         */
+        enableListenerCollection : false,
+
+        /**
+         * EXPERIMENTAL - True to cascade listener removal to child elements when an element is removed.
+         * Currently not optimized for performance.
+         * @type Boolean
+         */
+        enableNestedListenerRemoval : false,
+
+        /**
+         * Indicates whether to use native browser parsing for JSON methods.
+         * This option is ignored if the browser does not support native JSON methods.
+         * <b>Note: Native JSON methods will not work with objects that have functions.
+         * Also, property names must be quoted, otherwise the data will not parse.</b> (Defaults to false)
+         * @type Boolean
+         */
+        USE_NATIVE_JSON : false,
+
+        /**
+         * Copies all the properties of config to obj if they don't already exist.
+         * @param {Object} obj The receiver of the properties
+         * @param {Object} config The source of the properties
+         * @return {Object} returns obj
+         */
+        applyIf : function(o, c){
+            if(o){
+                for(var p in c){
+                    if(!Ext.isDefined(o[p])){
+                        o[p] = c[p];
+                    }
+                }
+            }
+            return o;
+        },
+
+        /**
+         * Generates unique ids. If the element already has an id, it is unchanged
+         * @param {Mixed} el (optional) The element to generate an id for
+         * @param {String} prefix (optional) Id prefix (defaults "ext-gen")
+         * @return {String} The generated Id.
+         */
+        id : function(el, prefix){
+            el = Ext.getDom(el, true) || {};
+            if (!el.id) {
+                el.id = (prefix || "ext-gen") + (++idSeed);
+            }
+            return el.id;
+        },
+
+        /**
+         * <p>Extends one class to create a subclass and optionally overrides members with the passed literal. This method
+         * also adds the function "override()" to the subclass that can be used to override members of the class.</p>
+         * For example, to create a subclass of Ext GridPanel:
+         * <pre><code>
+MyGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    constructor: function(config) {
+
+//      Create configuration for this Grid.
+        var store = new Ext.data.Store({...});
+        var colModel = new Ext.grid.ColumnModel({...});
+
+//      Create a new config object containing our computed properties
+//      *plus* whatever was in the config parameter.
+        config = Ext.apply({
+            store: store,
+            colModel: colModel
+        }, config);
+
+        MyGridPanel.superclass.constructor.call(this, config);
+
+//      Your postprocessing here
+    },
+
+    yourMethod: function() {
+        // etc.
+    }
+});
+</code></pre>
+         *
+         * <p>This function also supports a 3-argument call in which the subclass's constructor is
+         * passed as an argument. In this form, the parameters are as follows:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><code>subclass</code> : Function <div class="sub-desc">The subclass constructor.</div></li>
+         * <li><code>superclass</code> : Function <div class="sub-desc">The constructor of class being extended</div></li>
+         * <li><code>overrides</code> : Object <div class="sub-desc">A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared among all instances of the new class.</div></li>
+         * </ul></div>
+         *
+         * @param {Function} superclass The constructor of class being extended.
+         * @param {Object} overrides <p>A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared between all instances of the new class.</p>
+         * <p>This may contain a special member named <tt><b>constructor</b></tt>. This is used
+         * to define the constructor of the new class, and is returned. If this property is
+         * <i>not</i> specified, a constructor is generated and returned which just calls the
+         * superclass's constructor passing on its parameters.</p>
+         * <p><b>It is essential that you call the superclass constructor in any provided constructor. See example code.</b></p>
+         * @return {Function} The subclass constructor from the <code>overrides</code> parameter, or a generated one if not provided.
+         */
+        extend : function(){
+            // inline overrides
+            var io = function(o){
+                for(var m in o){
+                    this[m] = o[m];
+                }
+            };
+            var oc = Object.prototype.constructor;
+
+            return function(sb, sp, overrides){
+                if(typeof sp == 'object'){
+                    overrides = sp;
+                    sp = sb;
+                    sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
+                }
+                var F = function(){},
+                    sbp,
+                    spp = sp.prototype;
+
+                F.prototype = spp;
+                sbp = sb.prototype = new F();
+                sbp.constructor=sb;
+                sb.superclass=spp;
+                if(spp.constructor == oc){
+                    spp.constructor=sp;
+                }
+                sb.override = function(o){
+                    Ext.override(sb, o);
+                };
+                sbp.superclass = sbp.supr = (function(){
+                    return spp;
+                });
+                sbp.override = io;
+                Ext.override(sb, overrides);
+                sb.extend = function(o){return Ext.extend(sb, o);};
+                return sb;
+            };
+        }(),
+
+        /**
+         * Adds a list of functions to the prototype of an existing class, overwriting any existing methods with the same name.
+         * Usage:<pre><code>
+Ext.override(MyClass, {
+    newMethod1: function(){
+        // etc.
+    },
+    newMethod2: function(foo){
+        // etc.
+    }
+});
+</code></pre>
+         * @param {Object} origclass The class to override
+         * @param {Object} overrides The list of functions to add to origClass.  This should be specified as an object literal
+         * containing one or more methods.
+         * @method override
+         */
+        override : function(origclass, overrides){
+            if(overrides){
+                var p = origclass.prototype;
+                Ext.apply(p, overrides);
+                if(Ext.isIE && overrides.hasOwnProperty('toString')){
+                    p.toString = overrides.toString;
+                }
+            }
+        },
+
+        /**
+         * Creates namespaces to be used for scoping variables and classes so that they are not global.
+         * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+         * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+         * @param {String} namespace1
+         * @param {String} namespace2
+         * @param {String} etc
+         * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+         * @method namespace
+         */
+        namespace : function(){
+            var len1 = arguments.length,
+                i = 0,
+                len2,
+                j,
+                main,
+                ns,
+                sub,
+                current;
+                
+            for(; i < len1; ++i) {
+                main = arguments[i];
+                ns = arguments[i].split('.');
+                current = window[ns[0]];
+                if (current === undefined) {
+                    current = window[ns[0]] = {};
+                }
+                sub = ns.slice(1);
+                len2 = sub.length;
+                for(j = 0; j < len2; ++j) {
+                    current = current[sub[j]] = current[sub[j]] || {};
+                }
+            }
+            return current;
+        },
+
+        /**
+         * Takes an object and converts it to an encoded URL. e.g. Ext.urlEncode({foo: 1, bar: 2}); would return "foo=1&bar=2".  Optionally, property values can be arrays, instead of keys and the resulting string that's returned will contain a name/value pair for each array value.
+         * @param {Object} o
+         * @param {String} pre (optional) A prefix to add to the url encoded string
+         * @return {String}
+         */
+        urlEncode : function(o, pre){
+            var empty,
+                buf = [],
+                e = encodeURIComponent;
+
+            Ext.iterate(o, function(key, item){
+                empty = Ext.isEmpty(item);
+                Ext.each(empty ? key : item, function(val){
+                    buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
+                });
+            });
+            if(!pre){
+                buf.shift();
+                pre = '';
+            }
+            return pre + buf.join('');
+        },
+
+        /**
+         * Takes an encoded URL and and converts it to an object. Example: <pre><code>
+Ext.urlDecode("foo=1&bar=2"); // returns {foo: "1", bar: "2"}
+Ext.urlDecode("foo=1&bar=2&bar=3&bar=4", false); // returns {foo: "1", bar: ["2", "3", "4"]}
+</code></pre>
+         * @param {String} string
+         * @param {Boolean} overwrite (optional) Items of the same name will overwrite previous values instead of creating an an array (Defaults to false).
+         * @return {Object} A literal with members
+         */
+        urlDecode : function(string, overwrite){
+            if(Ext.isEmpty(string)){
+                return {};
+            }
+            var obj = {},
+                pairs = string.split('&'),
+                d = decodeURIComponent,
+                name,
+                value;
+            Ext.each(pairs, function(pair) {
+                pair = pair.split('=');
+                name = d(pair[0]);
+                value = d(pair[1]);
+                obj[name] = overwrite || !obj[name] ? value :
+                            [].concat(obj[name]).concat(value);
+            });
+            return obj;
+        },
+
+        /**
+         * Appends content to the query string of a URL, handling logic for whether to place
+         * a question mark or ampersand.
+         * @param {String} url The URL to append to.
+         * @param {String} s The content to append to the URL.
+         * @return (String) The resulting URL
+         */
+        urlAppend : function(url, s){
+            if(!Ext.isEmpty(s)){
+                return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
+            }
+            return url;
+        },
+
+        /**
+         * Converts any iterable (numeric indices and a length property) into a true array
+         * Don't use this on strings. IE doesn't support "abc"[0] which this implementation depends on.
+         * For strings, use this instead: "abc".match(/./g) => [a,b,c];
+         * @param {Iterable} the iterable object to be turned into a true Array.
+         * @return (Array) array
+         */
+         toArray : function(){
+             return isIE ?
+                 function(a, i, j, res){
+                     res = [];
+                     for(var x = 0, len = a.length; x < len; x++) {
+                         res.push(a[x]);
+                     }
+                     return res.slice(i || 0, j || res.length);
+                 } :
+                 function(a, i, j){
+                     return Array.prototype.slice.call(a, i || 0, j || a.length);
+                 };
+         }(),
+
+        isIterable : function(v){
+            //check for array or arguments
+            if(Ext.isArray(v) || v.callee){
+                return true;
+            }
+            //check for node list type
+            if(/NodeList|HTMLCollection/.test(toString.call(v))){
+                return true;
+            }
+            //NodeList has an item and length property
+            //IXMLDOMNodeList has nextNode method, needs to be checked first.
+            return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length));
+        },
+
+        /**
+         * Iterates an array calling the supplied function.
+         * @param {Array/NodeList/Mixed} array The array to be iterated. If this
+         * argument is not really an array, the supplied function is called once.
+         * @param {Function} fn The function to be called with each item. If the
+         * supplied function returns false, iteration stops and this method returns
+         * the current <code>index</code>. This function is called with
+         * the following arguments:
+         * <div class="mdetail-params"><ul>
+         * <li><code>item</code> : <i>Mixed</i>
+         * <div class="sub-desc">The item at the current <code>index</code>
+         * in the passed <code>array</code></div></li>
+         * <li><code>index</code> : <i>Number</i>
+         * <div class="sub-desc">The current index within the array</div></li>
+         * <li><code>allItems</code> : <i>Array</i>
+         * <div class="sub-desc">The <code>array</code> passed as the first
+         * argument to <code>Ext.each</code>.</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed.
+         * Defaults to the <code>item</code> at the current <code>index</code>
+         * within the passed <code>array</code>.
+         * @return See description for the fn parameter.
+         */
+        each : function(array, fn, scope){
+            if(Ext.isEmpty(array, true)){
+                return;
+            }
+            if(!Ext.isIterable(array) || Ext.isPrimitive(array)){
+                array = [array];
+            }
+            for(var i = 0, len = array.length; i < len; i++){
+                if(fn.call(scope || array[i], array[i], i, array) === false){
+                    return i;
+                };
+            }
+        },
+
+        /**
+         * Iterates either the elements in an array, or each of the properties in an object.
+         * <b>Note</b>: If you are only iterating arrays, it is better to call {@link #each}.
+         * @param {Object/Array} object The object or array to be iterated
+         * @param {Function} fn The function to be called for each iteration.
+         * The iteration will stop if the supplied function returns false, or
+         * all array elements / object properties have been covered. The signature
+         * varies depending on the type of object being interated:
+         * <div class="mdetail-params"><ul>
+         * <li>Arrays : <tt>(Object item, Number index, Array allItems)</tt>
+         * <div class="sub-desc">
+         * When iterating an array, the supplied function is called with each item.</div></li>
+         * <li>Objects : <tt>(String key, Object value, Object)</tt>
+         * <div class="sub-desc">
+         * When iterating an object, the supplied function is called with each key-value pair in
+         * the object, and the iterated object</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed. Defaults to
+         * the <code>object</code> being iterated.
+         */
+        iterate : function(obj, fn, scope){
+            if(Ext.isEmpty(obj)){
+                return;
+            }
+            if(Ext.isIterable(obj)){
+                Ext.each(obj, fn, scope);
+                return;
+            }else if(typeof obj == 'object'){
+                for(var prop in obj){
+                    if(obj.hasOwnProperty(prop)){
+                        if(fn.call(scope || obj, prop, obj[prop], obj) === false){
+                            return;
+                        };
+                    }
+                }
+            }
+        },
+
+        /**
+         * Return the dom node for the passed String (id), dom node, or Ext.Element.
+         * Optional 'strict' flag is needed for IE since it can return 'name' and
+         * 'id' elements by using getElementById.
+         * Here are some examples:
+         * <pre><code>
+// gets dom node based on id
+var elDom = Ext.getDom('elId');
+// gets dom node based on the dom node
+var elDom1 = Ext.getDom(elDom);
+
+// If we don&#39;t know if we are working with an
+// Ext.Element or a dom node use Ext.getDom
+function(el){
+    var dom = Ext.getDom(el);
+    // do something with the dom node
+}
+         * </code></pre>
+         * <b>Note</b>: the dom node to be found actually needs to exist (be rendered, etc)
+         * when this method is called to be successful.
+         * @param {Mixed} el
+         * @return HTMLElement
+         */
+        getDom : function(el, strict){
+            if(!el || !DOC){
+                return null;
+            }
+            if (el.dom){
+                return el.dom;
+            } else {
+                if (typeof el == 'string') {
+                    var e = DOC.getElementById(el);
+                    // IE returns elements with the 'name' and 'id' attribute.
+                    // we do a strict check to return the element with only the id attribute
+                    if (e && isIE && strict) {
+                        if (el == e.getAttribute('id')) {
+                            return e;
+                        } else {
+                            return null;
+                        }
+                    }
+                    return e;
+                } else {
+                    return el;
+                }
+            }
+        },
+
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getBody : function(){
+            return Ext.get(DOC.body || DOC.documentElement);
+        },
+        
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getHead : function() {
+            var head;
+            
+            return function() {
+                if (head == undefined) {
+                    head = Ext.get(DOC.getElementsByTagName("head")[0]);
+                }
+                
+                return head;
+            };
+        }(),
+
+        /**
+         * Removes a DOM node from the document.
+         */
+        /**
+         * <p>Removes this element from the document, removes all DOM event listeners, and deletes the cache reference.
+         * All DOM event listeners are removed from this element. If {@link Ext#enableNestedListenerRemoval} is
+         * <code>true</code>, then DOM event listeners are also removed from all child nodes. The body node
+         * will be ignored if passed in.</p>
+         * @param {HTMLElement} node The node to remove
+         */
+        removeNode : isIE && !isIE8 ? function(){
+            var d;
+            return function(n){
+                if(n && n.tagName != 'BODY'){
+                    (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                    d = d || DOC.createElement('div');
+                    d.appendChild(n);
+                    d.innerHTML = '';
+                    delete Ext.elCache[n.id];
+                }
+            };
+        }() : function(n){
+            if(n && n.parentNode && n.tagName != 'BODY'){
+                (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                n.parentNode.removeChild(n);
+                delete Ext.elCache[n.id];
+            }
+        },
+
+        /**
+         * <p>Returns true if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Boolean} allowBlank (optional) true to allow empty strings (defaults to false)
+         * @return {Boolean}
+         */
+        isEmpty : function(v, allowBlank){
+            return v === null || v === undefined || ((Ext.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript array, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isArray : function(v){
+            return toString.apply(v) === '[object Array]';
+        },
+
+        /**
+         * Returns true if the passed object is a JavaScript date object, otherwise false.
+         * @param {Object} object The object to test
+         * @return {Boolean}
+         */
+        isDate : function(v){
+            return toString.apply(v) === '[object Date]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Object, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isObject : function(v){
+            return !!v && Object.prototype.toString.call(v) === '[object Object]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isPrimitive : function(v){
+            return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Function, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isFunction : function(v){
+            return toString.apply(v) === '[object Function]';
+        },
+
+        /**
+         * Returns true if the passed value is a number. Returns false for non-finite numbers.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isNumber : function(v){
+            return typeof v === 'number' && isFinite(v);
+        },
+
+        /**
+         * Returns true if the passed value is a string.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isString : function(v){
+            return typeof v === 'string';
+        },
+
+        /**
+         * Returns true if the passed value is a boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isBoolean : function(v){
+            return typeof v === 'boolean';
+        },
+
+        /**
+         * Returns true if the passed value is an HTMLElement
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isElement : function(v) {
+            return v ? !!v.tagName : false;
+        },
+
+        /**
+         * Returns true if the passed value is not undefined.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isDefined : function(v){
+            return typeof v !== 'undefined';
+        },
+
+        /**
+         * True if the detected browser is Opera.
+         * @type Boolean
+         */
+        isOpera : isOpera,
+        /**
+         * True if the detected browser uses WebKit.
+         * @type Boolean
+         */
+        isWebKit : isWebKit,
+        /**
+         * True if the detected browser is Chrome.
+         * @type Boolean
+         */
+        isChrome : isChrome,
+        /**
+         * True if the detected browser is Safari.
+         * @type Boolean
+         */
+        isSafari : isSafari,
+        /**
+         * True if the detected browser is Safari 3.x.
+         * @type Boolean
+         */
+        isSafari3 : isSafari3,
+        /**
+         * True if the detected browser is Safari 4.x.
+         * @type Boolean
+         */
+        isSafari4 : isSafari4,
+        /**
+         * True if the detected browser is Safari 2.x.
+         * @type Boolean
+         */
+        isSafari2 : isSafari2,
+        /**
+         * True if the detected browser is Internet Explorer.
+         * @type Boolean
+         */
+        isIE : isIE,
+        /**
+         * True if the detected browser is Internet Explorer 6.x.
+         * @type Boolean
+         */
+        isIE6 : isIE6,
+        /**
+         * True if the detected browser is Internet Explorer 7.x.
+         * @type Boolean
+         */
+        isIE7 : isIE7,
+        /**
+         * True if the detected browser is Internet Explorer 8.x.
+         * @type Boolean
+         */
+        isIE8 : isIE8,
+        /**
+         * True if the detected browser is Internet Explorer 9.x.
+         * @type Boolean
+         */
+        isIE9 : isIE9,
+        /**
+         * True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).
+         * @type Boolean
+         */
+        isGecko : isGecko,
+        /**
+         * True if the detected browser uses a pre-Gecko 1.9 layout engine (e.g. Firefox 2.x).
+         * @type Boolean
+         */
+        isGecko2 : isGecko2,
+        /**
+         * True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).
+         * @type Boolean
+         */
+        isGecko3 : isGecko3,
+        /**
+         * True if the detected browser is Internet Explorer running in non-strict mode.
+         * @type Boolean
+         */
+        isBorderBox : isBorderBox,
+        /**
+         * True if the detected platform is Linux.
+         * @type Boolean
+         */
+        isLinux : isLinux,
+        /**
+         * True if the detected platform is Windows.
+         * @type Boolean
+         */
+        isWindows : isWindows,
+        /**
+         * True if the detected platform is Mac OS.
+         * @type Boolean
+         */
+        isMac : isMac,
+        /**
+         * True if the detected platform is Adobe Air.
+         * @type Boolean
+         */
+        isAir : isAir
+    });
+
+    /**
+     * Creates namespaces to be used for scoping variables and classes so that they are not global.
+     * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+     * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+     * @param {String} namespace1
+     * @param {String} namespace2
+     * @param {String} etc
+     * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+     * @method ns
+     */
+    Ext.ns = Ext.namespace;
+})();
+
+Ext.ns('Ext.util', 'Ext.lib', 'Ext.data', 'Ext.supports');
+
+Ext.elCache = {};
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+     /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = sayHi.createInterceptor(function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+</code></pre>
+     * @param {Function} fcn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor : function(fcn, scope){
+        var method = this;
+        return !Ext.isFunction(fcn) ?
+                this :
+                function() {
+                    var me = this,
+                        args = arguments;
+                    fcn.target = me;
+                    fcn.method = method;
+                    return (fcn.apply(scope || me || window, args) !== false) ?
+                            method.apply(me || window, args) :
+                            null;
+                };
+    },
+
+     /**
+     * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+     * Call directly on any function. Example: <code>myFunction.createCallback(arg1, arg2)</code>
+     * Will create a function that is bound to those 2 args. <b>If a specific scope is required in the
+     * callback, use {@link #createDelegate} instead.</b> The function returned by createCallback always
+     * executes in the window scope.
+     * <p>This method is required when you want to pass arguments to a callback function.  If no arguments
+     * are needed, you can simply pass a reference to the function as a callback (e.g., callback: myFn).
+     * However, if you tried to pass a function with arguments (e.g., callback: myFn(arg1, arg2)) the function
+     * would simply execute immediately when the code is parsed. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// clicking the button alerts "Hi, Fred"
+new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody(),
+    handler: sayHi.createCallback('Fred')
+});
+</code></pre>
+     * @return {Function} The new function
+    */
+    createCallback : function(/*args...*/){
+        // make args available, in function below
+        var args = arguments,
+            method = this;
+        return function() {
+            return method.apply(window, args);
+        };
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>this.myFunction.createDelegate(this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', sayHi.createDelegate(btn, ['Fred']));
+</code></pre>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate : function(obj, args, appendArgs){
+        var method = this;
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true){
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }else if (Ext.isNumber(appendArgs)){
+                callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args); // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+            }
+            return method.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+sayHi.defer(2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+(function(){
+    alert('Anonymous');
+}).defer(100);
+</code></pre>
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer : function(millis, obj, args, appendArgs){
+        var fn = this.createDelegate(obj, args, appendArgs);
+        if(millis > 0){
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    }
+});
+
+/**
+ * @class String
+ * These functions are available on every String object.
+ */
+Ext.applyIf(String, {
+    /**
+     * Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens.  Each
+     * token must be unique, and must increment in the format {0}, {1}, etc.  Example usage:
+     * <pre><code>
+var cls = 'my-class', text = 'Some text';
+var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);
+// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'
+     * </code></pre>
+     * @param {String} string The tokenized string to be formatted
+     * @param {String} value1 The value to replace token {0}
+     * @param {String} value2 Etc...
+     * @return {String} The formatted string
+     * @static
+     */
+    format : function(format){
+        var args = Ext.toArray(arguments, 1);
+        return format.replace(/\{(\d+)\}/g, function(m, i){
+            return args[i];
+        });
+    }
+});
+
+/**
+ * @class Array
+ */
+Ext.applyIf(Array.prototype, {
+    /**
+     * Checks whether or not the specified object exists in the array.
+     * @param {Object} o The object to check for
+     * @param {Number} from (Optional) The index at which to begin the search
+     * @return {Number} The index of o in the array (or -1 if it is not found)
+     */
+    indexOf : function(o, from){
+        var len = this.length;
+        from = from || 0;
+        from += (from < 0) ? len : 0;
+        for (; from < len; ++from){
+            if(this[from] === o){
+                return from;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Removes the specified object from the array.  If the object is not found nothing happens.
+     * @param {Object} o The object to remove
+     * @return {Array} this array
+     */
+    remove : function(o){
+        var index = this.indexOf(o);
+        if(index != -1){
+            this.splice(index, 1);
+        }
+        return this;
+    }
+});
+/**
+ * @class Ext.util.TaskRunner
+ * Provides the ability to execute one or more arbitrary tasks in a multithreaded
+ * manner.  Generally, you can use the singleton {@link Ext.TaskMgr} instead, but
+ * if needed, you can create separate instances of TaskRunner.  Any number of
+ * separate tasks can be started at any time and will run independently of each
+ * other. Example usage:
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var updateClock = function(){
+    Ext.fly('clock').update(new Date().format('g:i:s A'));
+} 
+var task = {
+    run: updateClock,
+    interval: 1000 //1 second
+}
+var runner = new Ext.util.TaskRunner();
+runner.start(task);
+
+// equivalent using TaskMgr
+Ext.TaskMgr.start({
+    run: updateClock,
+    interval: 1000
+});
+
+ * </code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * Also see {@link Ext.util.DelayedTask}. 
+ * 
+ * @constructor
+ * @param {Number} interval (optional) The minimum precision in milliseconds supported by this TaskRunner instance
+ * (defaults to 10)
+ */
+Ext.util.TaskRunner = function(interval){
+    interval = interval || 10;
+    var tasks = [], 
+    	removeQueue = [],
+    	id = 0,
+    	running = false,
+
+    	// private
+    	stopThread = function(){
+	        running = false;
+	        clearInterval(id);
+	        id = 0;
+	    },
+
+    	// private
+    	startThread = function(){
+	        if(!running){
+	            running = true;
+	            id = setInterval(runTasks, interval);
+	        }
+	    },
+
+    	// private
+    	removeTask = function(t){
+	        removeQueue.push(t);
+	        if(t.onStop){
+	            t.onStop.apply(t.scope || t);
+	        }
+	    },
+	    
+    	// private
+    	runTasks = function(){
+	    	var rqLen = removeQueue.length,
+	    		now = new Date().getTime();	    			    		
+	    
+	        if(rqLen > 0){
+	            for(var i = 0; i < rqLen; i++){
+	                tasks.remove(removeQueue[i]);
+	            }
+	            removeQueue = [];
+	            if(tasks.length < 1){
+	                stopThread();
+	                return;
+	            }
+	        }	        
+	        for(var i = 0, t, itime, rt, len = tasks.length; i < len; ++i){
+	            t = tasks[i];
+	            itime = now - t.taskRunTime;
+	            if(t.interval <= itime){
+	                rt = t.run.apply(t.scope || t, t.args || [++t.taskRunCount]);
+	                t.taskRunTime = now;
+	                if(rt === false || t.taskRunCount === t.repeat){
+	                    removeTask(t);
+	                    return;
+	                }
+	            }
+	            if(t.duration && t.duration <= (now - t.taskStartTime)){
+	                removeTask(t);
+	            }
+	        }
+	    };
+
+    /**
+     * Starts a new task.
+     * @method start
+     * @param {Object} task <p>A config object that supports the following properties:<ul>
+     * <li><code>run</code> : Function<div class="sub-desc"><p>The function to execute each time the task is invoked. The
+     * function will be called at each interval and passed the <code>args</code> argument if specified, and the
+     * current invocation count if not.</p>
+     * <p>If a particular scope (<code>this</code> reference) is required, be sure to specify it using the <code>scope</code> argument.</p>
+     * <p>Return <code>false</code> from this function to terminate the task.</p></div></li>
+     * <li><code>interval</code> : Number<div class="sub-desc">The frequency in milliseconds with which the task
+     * should be invoked.</div></li>
+     * <li><code>args</code> : Array<div class="sub-desc">(optional) An array of arguments to be passed to the function
+     * specified by <code>run</code>. If not specified, the current invocation count is passed.</div></li>
+     * <li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<tt>this</tt> reference) in which to execute the
+     * <code>run</code> function. Defaults to the task config object.</div></li>
+     * <li><code>duration</code> : Number<div class="sub-desc">(optional) The length of time in milliseconds to invoke
+     * the task before stopping automatically (defaults to indefinite).</div></li>
+     * <li><code>repeat</code> : Number<div class="sub-desc">(optional) The number of times to invoke the task before
+     * stopping automatically (defaults to indefinite).</div></li>
+     * </ul></p>
+     * <p>Before each invocation, Ext injects the property <code>taskRunCount</code> into the task object so
+     * that calculations based on the repeat count can be performed.</p>
+     * @return {Object} The task
+     */
+    this.start = function(task){
+        tasks.push(task);
+        task.taskStartTime = new Date().getTime();
+        task.taskRunTime = 0;
+        task.taskRunCount = 0;
+        startThread();
+        return task;
+    };
+
+    /**
+     * Stops an existing running task.
+     * @method stop
+     * @param {Object} task The task to stop
+     * @return {Object} The task
+     */
+    this.stop = function(task){
+        removeTask(task);
+        return task;
+    };
+
+    /**
+     * Stops all tasks that are currently running.
+     * @method stopAll
+     */
+    this.stopAll = function(){
+        stopThread();
+        for(var i = 0, len = tasks.length; i < len; i++){
+            if(tasks[i].onStop){
+                tasks[i].onStop();
+            }
+        }
+        tasks = [];
+        removeQueue = [];
+    };
+};
+
+/**
+ * @class Ext.TaskMgr
+ * @extends Ext.util.TaskRunner
+ * A static {@link Ext.util.TaskRunner} instance that can be used to start and stop arbitrary tasks.  See
+ * {@link Ext.util.TaskRunner} for supported methods and task config properties.
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var task = {
+    run: function(){
+        Ext.fly('clock').update(new Date().format('g:i:s A'));
+    },
+    interval: 1000 //1 second
+}
+Ext.TaskMgr.start(task);
+</code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * @singleton
+ */
+Ext.TaskMgr = new Ext.util.TaskRunner();if(typeof jQuery == "undefined"){
+    throw "Unable to load Ext, jQuery not found.";
+}
+
+(function(){
+var libFlyweight;
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        // jQuery doesn't report full window size on document query, so max both
+        return full ? Math.max(jQuery(document).width(),jQuery(window).width()) : jQuery(window).width();
+    },
+
+    getViewHeight : function(full){
+        // jQuery doesn't report full window size on document query, so max both
+        return full ? Math.max(jQuery(document).height(),jQuery(window).height()) : jQuery(window).height();
+    },
+
+    isAncestor : function(p, c){
+        var ret = false;
+
+        p = Ext.getDom(p);
+        c = Ext.getDom(c);
+        if (p && c) {
+            if (p.contains) {
+                return p.contains(c);
+            } else if (p.compareDocumentPosition) {
+                return !!(p.compareDocumentPosition(c) & 16);
+            } else {
+                while (c = c.parentNode) {
+                    ret = c == p || ret;
+                }
+            }
+        }
+        return ret;
+    },
+
+    getRegion : function(el){
+        return Ext.lib.Region.getRegion(el);
+    },
+
+    //////////////////////////////////////////////////////////////////////////////////////
+    // Use of jQuery.offset() removed to promote consistent behavior across libs.
+    // JVS 05/23/07
+    //////////////////////////////////////////////////////////////////////////////////////
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    getXY : function(el) {
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+Ext.lib.Event = {
+    getPageX : function(e){
+        e = e.browserEvent || e;
+        return e.pageX;
+    },
+
+    getPageY : function(e){
+        e = e.browserEvent || e;
+        return e.pageY;
+    },
+
+    getXY : function(e){
+        e = e.browserEvent || e;
+        return [e.pageX, e.pageY];
+    },
+
+    getTarget : function(e){
+        return e.target;
+    },
+
+    // all Ext events will go through event manager which provides scoping
+    on : function(el, eventName, fn, scope, override){
+        jQuery(el).bind(eventName, fn);
+    },
+
+    un : function(el, eventName, fn){
+        jQuery(el).unbind(eventName, fn);
+    },
+
+    purgeElement : function(el){
+        jQuery(el).unbind();
+    },
+
+    preventDefault : function(e){
+        e = e.browserEvent || e;
+        if(e.preventDefault){
+            e.preventDefault();
+        }else{
+            e.returnValue = false;
+        }
+    },
+
+    stopPropagation : function(e){
+        e = e.browserEvent || e;
+        if(e.stopPropagation){
+            e.stopPropagation();
+        }else{
+            e.cancelBubble = true;
+        }
+    },
+
+    stopEvent : function(e){
+        this.preventDefault(e);
+        this.stopPropagation(e);
+    },
+
+    onAvailable : function(id, fn, scope){
+        var start = new Date();
+        var f = function(){
+            if(start.getElapsed() > 10000){
+                clearInterval(iid);
+            }
+            var el = document.getElementById(id);
+            if(el){
+                clearInterval(iid);
+                fn.call(scope||window, el);
+            }
+        };
+        var iid = setInterval(f, 50);
+    },
+
+    resolveTextNode: Ext.isGecko ? function(node){
+        if(!node){
+            return;
+        }
+        var s = HTMLElement.prototype.toString.call(node);
+        if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+            return;
+        }
+        return node.nodeType == 3 ? node.parentNode : node;
+    } : function(node){
+        return node && node.nodeType == 3 ? node.parentNode : node;
+    },
+
+    getRelatedTarget: function(ev) {
+        ev = ev.browserEvent || ev;
+        var t = ev.relatedTarget;
+        if (!t) {
+            if (ev.type == "mouseout") {
+                t = ev.toElement;
+            } else if (ev.type == "mouseover") {
+                t = ev.fromElement;
+            }
+        }
+
+        return this.resolveTextNode(t);
+    }
+};
+
+Ext.lib.Ajax = function(){
+    var createComplete = function(cb){
+         return function(xhr, status){
+            if((status == 'error' || status == 'timeout') && cb.failure){
+                cb.failure.call(cb.scope||window, createResponse(cb, xhr));
+            }else if(cb.success){
+                cb.success.call(cb.scope||window, createResponse(cb, xhr));
+            }
+         };
+    };
+
+    var createResponse = function(cb, xhr){
+        var headerObj = {},
+            headerStr,
+            t,
+            s;
+
+        try {
+            headerStr = xhr.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            responseText: xhr.responseText,
+            responseXML : xhr.responseXML,
+            argument: cb.argument,
+            status: xhr.status,
+            statusText: xhr.statusText,
+            getResponseHeader : function(header){
+                return headerObj[header.toLowerCase()];
+            },
+            getAllResponseHeaders : function(){
+                return headerStr;
+            }
+        };
+    };
+    return {
+        request : function(method, uri, cb, data, options){
+            var o = {
+                type: method,
+                url: uri,
+                data: data,
+                timeout: cb.timeout,
+                complete: createComplete(cb)
+            };
+
+            if(options){
+                var hs = options.headers;
+                if(options.xmlData){
+                    o.data = options.xmlData;
+                    o.processData = false;
+                    o.type = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'text/xml';
+                    }
+                }else if(options.jsonData){
+                    o.data = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+                    o.processData = false;
+                    o.type = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'application/json';
+                    }
+                }
+                if(hs){
+                    o.beforeSend = function(xhr){
+                        for (var h in hs) {
+                            if (hs.hasOwnProperty(h)) {
+                                xhr.setRequestHeader(h, hs[h]);
+                            }
+                        }
+                    };
+                }
+            }
+            jQuery.ajax(o);
+        },
+
+        formRequest : function(form, uri, cb, data, isUpload, sslUri){
+            jQuery.ajax({
+                type: Ext.getDom(form).method ||'POST',
+                url: uri,
+                data: jQuery(form).serialize()+(data?'&'+data:''),
+                timeout: cb.timeout,
+                complete: createComplete(cb)
+            });
+        },
+
+        isCallInProgress : function(trans){
+            return false;
+        },
+
+        abort : function(trans){
+            return false;
+        },
+
+        serializeForm : function(form){
+            return jQuery(form.dom||form).serialize();
+        }
+    };
+}();
+
+Ext.lib.Anim = function(){
+    var createAnim = function(cb, scope){
+        var animated = true;
+        return {
+            stop : function(skipToLast){
+                // do nothing
+            },
+
+            isAnimated : function(){
+                return animated;
+            },
+
+            proxyCallback : function(){
+                animated = false;
+                Ext.callback(cb, scope);
+            }
+        };
+    };
+    return {
+        scroll : function(el, args, duration, easing, cb, scope){
+            // scroll anim not supported so just scroll immediately
+            var anim = createAnim(cb, scope);
+            el = Ext.getDom(el);
+            if(typeof args.scroll.to[0] == 'number'){
+                el.scrollLeft = args.scroll.to[0];
+            }
+            if(typeof args.scroll.to[1] == 'number'){
+                el.scrollTop = args.scroll.to[1];
+            }
+            anim.proxyCallback();
+            return anim;
+        },
+
+        motion : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        color : function(el, args, duration, easing, cb, scope){
+            // color anim not supported, so execute callback immediately
+            var anim = createAnim(cb, scope);
+            anim.proxyCallback();
+            return anim;
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type){
+            var anim = createAnim(cb, scope), e = Ext.fly(el, '_animrun');
+            var o = {};
+            for(var k in args){
+                switch(k){   // jquery doesn't support, so convert
+                    case 'points':
+                        var by, pts;
+                        e.position();
+                        if(by = args.points.by){
+                            var xy = e.getXY();
+                            pts = e.translatePoints([xy[0]+by[0], xy[1]+by[1]]);
+                        }else{
+                            pts = e.translatePoints(args.points.to);
+                        }
+                        o.left = pts.left;
+                        o.top = pts.top;
+                        if(!parseInt(e.getStyle('left'), 10)){ // auto bug
+                            e.setLeft(0);
+                        }
+                        if(!parseInt(e.getStyle('top'), 10)){
+                            e.setTop(0);
+                        }
+                        if(args.points.from){
+                            e.setXY(args.points.from);
+                        }
+                    break;
+                    case 'width':
+                        o.width = args.width.to;
+                        if (args.width.from)
+                            e.setWidth(args.width.from);
+                    break;
+                    case 'height':
+                        o.height = args.height.to;
+                        if (args.height.from)
+                            e.setHeight(args.height.from);
+                    break;
+                    case 'opacity':
+                        o.opacity = args.opacity.to;
+                        if (args.opacity.from)
+                            e.setOpacity(args.opacity.from);
+                    break;
+                    case 'left':
+                        o.left = args.left.to;
+                        if (args.left.from)
+                            e.setLeft(args.left.from);
+                    break;
+                    case 'top':
+                        o.top = args.top.to;
+                        if (args.top.from)
+                            e.setTop(args.top.from);
+                    break;
+                        // jQuery can't handle callback, scope, and xy arguments, so break here
+                    case 'callback':
+                    case 'scope':
+                    case 'xy':
+                    break;
+
+                    default:
+                        o[k] = args[k].to;
+                        if (args[k].from)
+                            e.setStyle(k, args[k].from);
+                    break;
+                }
+            }
+            // TODO: find out about easing plug in?
+            jQuery(el).animate(o, duration*1000, undefined, anim.proxyCallback);
+            return anim;
+        }
+    };
+}();
+
+
+Ext.lib.Region = function(t, r, b, l) {
+    this.top = t;
+    this[1] = t;
+    this.right = r;
+    this.bottom = b;
+    this.left = l;
+    this[0] = l;
+};
+
+Ext.lib.Region.prototype = {
+    contains : function(region) {
+        return ( region.left   >= this.left   &&
+                 region.right  <= this.right  &&
+                 region.top    >= this.top    &&
+                 region.bottom <= this.bottom    );
+
+    },
+
+    getArea : function() {
+        return ( (this.bottom - this.top) * (this.right - this.left) );
+    },
+
+    intersect : function(region) {
+        var t = Math.max( this.top,    region.top    );
+        var r = Math.min( this.right,  region.right  );
+        var b = Math.min( this.bottom, region.bottom );
+        var l = Math.max( this.left,   region.left   );
+
+        if (b >= t && r >= l) {
+            return new Ext.lib.Region(t, r, b, l);
+        } else {
+            return null;
+        }
+    },
+    union : function(region) {
+        var t = Math.min( this.top,    region.top    );
+        var r = Math.max( this.right,  region.right  );
+        var b = Math.max( this.bottom, region.bottom );
+        var l = Math.min( this.left,   region.left   );
+
+        return new Ext.lib.Region(t, r, b, l);
+    },
+
+    constrainTo : function(r) {
+            this.top = this.top.constrain(r.top, r.bottom);
+            this.bottom = this.bottom.constrain(r.top, r.bottom);
+            this.left = this.left.constrain(r.left, r.right);
+            this.right = this.right.constrain(r.left, r.right);
+            return this;
+    },
+
+    adjust : function(t, l, b, r){
+        this.top += t;
+        this.left += l;
+        this.right += r;
+        this.bottom += b;
+        return this;
+    }
+};
+
+Ext.lib.Region.getRegion = function(el) {
+    var p = Ext.lib.Dom.getXY(el);
+
+    var t = p[1];
+    var r = p[0] + el.offsetWidth;
+    var b = p[1] + el.offsetHeight;
+    var l = p[0];
+
+    return new Ext.lib.Region(t, r, b, l);
+};
+
+Ext.lib.Point = function(x, y) {
+   if (Ext.isArray(x)) {
+      y = x[1];
+      x = x[0];
+   }
+    this.x = this.right = this.left = this[0] = x;
+    this.y = this.top = this.bottom = this[1] = y;
+};
+
+Ext.lib.Point.prototype = new Ext.lib.Region();
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+window.undefined=window.undefined;Ext={version:"3.4.0",versionDetail:{major:3,minor:4,patch:0}};Ext.apply=function(d,e,b){if(b){Ext.apply(d,b)}if(d&&e&&typeof e=="object"){for(var a in e){d[a]=e[a]}}return d};(function(){var g=0,u=Object.prototype.toString,v=navigator.userAgent.toLowerCase(),A=function(e){return e.test(v)},i=document,n=i.documentMode,l=i.compatMode=="CSS1Compat",C=A(/opera/),h=A(/\bchrome\b/),w=A(/webkit/),z=!h&&A(/safari/),f=z&&A(/applewebkit\/4/),b=z&&A(/version\/3/),D=z&&A(/version\/4/),t=!C&&A(/msie/),r=t&&(A(/msie 7/)||n==7),q=t&&(A(/msie 8/)&&n!=7),p=t&&A(/msie 9/),s=t&&!r&&!q&&!p,o=!w&&A(/gecko/),d=o&&A(/rv:1\.8/),a=o&&A(/rv:1\.9/),x=t&&!l,B=A(/windows|win32/),k=A(/macintosh|mac os x/),j=A(/adobeair/),m=A(/linux/),c=/^https/i.test(window.location.protocol);if(s){try{i.execCommand("BackgroundImageCache",false,true)}catch(y){}}Ext.apply(Ext,{SSL_SECURE_URL:c&&t?'javascript:""':"about:blank",isStrict:l,isSecure:c,isReady:false,enableForcedBoxModel:false,enableGarbageCollector:true,enableListenerCollection:false,enableNestedListenerRemoval:false,USE_NATIVE_JSON:false,applyIf:function(E,F){if(E){for(var e in F){if(!Ext.isDefined(E[e])){E[e]=F[e]}}}return E},id:function(e,E){e=Ext.getDom(e,true)||{};if(!e.id){e.id=(E||"ext-gen")+(++g)}return e.id},extend:function(){var E=function(G){for(var F in G){this[F]=G[F]}};var e=Object.prototype.constructor;return function(L,I,K){if(typeof I=="object"){K=I;I=L;L=K.constructor!=e?K.constructor:function(){I.apply(this,arguments)}}var H=function(){},J,G=I.prototype;H.prototype=G;J=L.prototype=new H();J.constructor=L;L.superclass=G;if(G.constructor==e){G.constructor=I}L.override=function(F){Ext.override(L,F)};J.superclass=J.supr=(function(){return G});J.override=E;Ext.override(L,K);L.extend=function(F){return Ext.extend(L,F)};return L}}(),override:function(e,F){if(F){var E=e.prototype;Ext.apply(E,F);if(Ext.isIE&&F.hasOwnProperty("toString")){E.toString=F.toString}}},namespace:function(){var G=arguments.length,H=0,E,F,e,J,I,K;for(;H<G;++H){e=arguments[H];J=arguments[H].split(".");K=window[J[0]];if(K===undefined){K=window[J[0]]={}}I=J.slice(1);E=I.length;for(F=0;F<E;++F){K=K[I[F]]=K[I[F]]||{}}}return K},urlEncode:function(I,H){var F,E=[],G=encodeURIComponent;Ext.iterate(I,function(e,J){F=Ext.isEmpty(J);Ext.each(F?e:J,function(K){E.push("&",G(e),"=",(!Ext.isEmpty(K)&&(K!=e||!F))?(Ext.isDate(K)?Ext.encode(K).replace(/"/g,""):G(K)):"")})});if(!H){E.shift();H=""}return H+E.join("")},urlDecode:function(F,E){if(Ext.isEmpty(F)){return{}}var I={},H=F.split("&"),J=decodeURIComponent,e,G;Ext.each(H,function(K){K=K.split("=");e=J(K[0]);G=J(K[1]);I[e]=E||!I[e]?G:[].concat(I[e]).concat(G)});return I},urlAppend:function(e,E){if(!Ext.isEmpty(E)){return e+(e.indexOf("?")===-1?"?":"&")+E}return e},toArray:function(){return t?function(F,I,G,H){H=[];for(var E=0,e=F.length;E<e;E++){H.push(F[E])}return H.slice(I||0,G||H.length)}:function(e,F,E){return Array.prototype.slice.call(e,F||0,E||e.length)}}(),isIterable:function(e){if(Ext.isArray(e)||e.callee){return true}if(/NodeList|HTMLCollection/.test(u.call(e))){return true}return((typeof e.nextNode!="undefined"||e.item)&&Ext.isNumber(e.length))},each:function(H,G,F){if(Ext.isEmpty(H,true)){return}if(!Ext.isIterable(H)||Ext.isPrimitive(H)){H=[H]}for(var E=0,e=H.length;E<e;E++){if(G.call(F||H[E],H[E],E,H)===false){return E}}},iterate:function(F,E,e){if(Ext.isEmpty(F)){return}if(Ext.isIterable(F)){Ext.each(F,E,e);return}else{if(typeof F=="object"){for(var G in F){if(F.hasOwnProperty(G)){if(E.call(e||F,G,F[G],F)===false){return}}}}}},getDom:function(F,E){if(!F||!i){return null}if(F.dom){return F.dom}else{if(typeof F=="string"){var G=i.getElementById(F);if(G&&t&&E){if(F==G.getAttribute("id")){return G}else{return null}}return G}else{return F}}},getBody:function(){return Ext.get(i.body||i.documentElement)},getHead:function(){var e;return function(){if(e==undefined){e=Ext.get(i.getElementsByTagName("head")[0])}return e}}(),removeNode:t&&!q?function(){var e;return function(E){if(E&&E.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(E,true):Ext.EventManager.removeAll(E);e=e||i.createElement("div");e.appendChild(E);e.innerHTML="";delete Ext.elCache[E.id]}}}():function(e){if(e&&e.parentNode&&e.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(e,true):Ext.EventManager.removeAll(e);e.parentNode.removeChild(e);delete Ext.elCache[e.id]}},isEmpty:function(E,e){return E===null||E===undefined||((Ext.isArray(E)&&!E.length))||(!e?E==="":false)},isArray:function(e){return u.apply(e)==="[object Array]"},isDate:function(e){return u.apply(e)==="[object Date]"},isObject:function(e){return !!e&&Object.prototype.toString.call(e)==="[object Object]"},isPrimitive:function(e){return Ext.isString(e)||Ext.isNumber(e)||Ext.isBoolean(e)},isFunction:function(e){return u.apply(e)==="[object Function]"},isNumber:function(e){return typeof e==="number"&&isFinite(e)},isString:function(e){return typeof e==="string"},isBoolean:function(e){return typeof e==="boolean"},isElement:function(e){return e?!!e.tagName:false},isDefined:function(e){return typeof e!=="undefined"},isOpera:C,isWebKit:w,isChrome:h,isSafari:z,isSafari3:b,isSafari4:D,isSafari2:f,isIE:t,isIE6:s,isIE7:r,isIE8:q,isIE9:p,isGecko:o,isGecko2:d,isGecko3:a,isBorderBox:x,isLinux:m,isWindows:B,isMac:k,isAir:j});Ext.ns=Ext.namespace})();Ext.ns("Ext.util","Ext.lib","Ext.data","Ext.supports");Ext.elCache={};Ext.apply(Function.prototype,{createInterceptor:function(b,a){var c=this;return !Ext.isFunction(b)?this:function(){var e=this,d=arguments;b.target=e;b.method=c;return(b.apply(a||e||window,d)!==false)?c.apply(e||window,d):null}},createCallback:function(){var a=arguments,b=this;return function(){return b.apply(window,a)}},createDelegate:function(c,b,a){var d=this;return function(){var f=b||arguments;if(a===true){f=Array.prototype.slice.call(arguments,0);f=f.concat(b)}else{if(Ext.isNumber(a)){f=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(f,e)}}return d.apply(c||window,f)}},defer:function(c,e,b,a){var d=this.createDelegate(e,b,a);if(c>0){return setTimeout(d,c)}d();return 0}});Ext.applyIf(String,{format:function(b){var a=Ext.toArray(arguments,1);return b.replace(/\{(\d+)\}/g,function(c,d){return a[d]})}});Ext.applyIf(Array.prototype,{indexOf:function(b,c){var a=this.length;c=c||0;c+=(c<0)?a:0;for(;c<a;++c){if(this[c]===b){return c}}return -1},remove:function(b){var a=this.indexOf(b);if(a!=-1){this.splice(a,1)}return this}});Ext.util.TaskRunner=function(e){e=e||10;var f=[],a=[],b=0,g=false,d=function(){g=false;clearInterval(b);b=0},h=function(){if(!g){g=true;b=setInterval(i,e)}},c=function(j){a.push(j);if(j.onStop){j.onStop.apply(j.scope||j)}},i=function(){var l=a.length,n=new Date().getTime();if(l>0){for(var p=0;p<l;p++){f.remove(a[p])}a=[];if(f.length<1){d();return}}for(var p=0,o,k,m,j=f.length;p<j;++p){o=f[p];k=n-o.taskRunTime;if(o.interval<=k){m=o.run.apply(o.scope||o,o.args||[++o.taskRunCount]);o.taskRunTime=n;if(m===false||o.taskRunCount===o.repeat){c(o);return}}if(o.duration&&o.duration<=(n-o.taskStartTime)){c(o)}}};this.start=function(j){f.push(j);j.taskStartTime=new Date().getTime();j.taskRunTime=0;j.taskRunCount=0;h();return j};this.stop=function(j){c(j);return j};this.stopAll=function(){d();for(var k=0,j=f.length;k<j;k++){if(f[k].onStop){f[k].onStop()}}f=[];a=[]}};Ext.TaskMgr=new Ext.util.TaskRunner();(function(){var b;function c(d){if(!b){b=new Ext.Element.Flyweight()}b.dom=d;return b}(function(){var g=document,e=g.compatMode=="CSS1Compat",f=Math.max,d=Math.round,h=parseInt;Ext.lib.Dom={isAncestor:function(j,k){var i=false;j=Ext.getDom(j);k=Ext.getDom(k);if(j&&k){if(j.contains){return j.contains(k)}else{if(j.compareDocumentPosition){return !!(j.compareDocumentPosition(k)&16)}else{while(k=k.parentNode){i=k==j||i}}}}return i},getViewWidth:function(i){return i?this.getDocumentWidth():this.getViewportWidth()},getViewHeight:function(i){return i?this.getDocumentHeight():this.getViewportHeight()},getDocumentHeight:function(){return f(!e?g.body.scrollHeight:g.documentElement.scrollHeight,this.getViewportHeight())},getDocumentWidth:function(){return f(!e?g.body.scrollWidth:g.documentElement.scrollWidth,this.getViewportWidth())},getViewportHeight:function(){return Ext.isIE?(Ext.isStrict?g.documentElement.clientHeight:g.body.clientHeight):self.innerHeight},getViewportWidth:function(){return !Ext.isStrict&&!Ext.isOpera?g.body.clientWidth:Ext.isIE?g.documentElement.clientWidth:self.innerWidth},getY:function(i){return this.getXY(i)[1]},getX:function(i){return this.getXY(i)[0]},getXY:function(k){var j,q,s,v,l,m,u=0,r=0,t,i,n=(g.body||g.documentElement),o=[0,0];k=Ext.getDom(k);if(k!=n){if(k.getBoundingClientRect){s=k.getBoundingClientRect();t=c(document).getScroll();o=[d(s.left+t.left),d(s.top+t.top)]}else{j=k;i=c(k).isStyle("position","absolute");while(j){q=c(j);u+=j.offsetLeft;r+=j.offsetTop;i=i||q.isStyle("position","absolute");if(Ext.isGecko){r+=v=h(q.getStyle("borderTopWidth"),10)||0;u+=l=h(q.getStyle("borderLeftWidth"),10)||0;if(j!=k&&!q.isStyle("overflow","visible")){u+=l;r+=v}}j=j.offsetParent}if(Ext.isSafari&&i){u-=n.offsetLeft;r-=n.offsetTop}if(Ext.isGecko&&!i){m=c(n);u+=h(m.getStyle("borderLeftWidth"),10)||0;r+=h(m.getStyle("borderTopWidth"),10)||0}j=k.parentNode;while(j&&j!=n){if(!Ext.isOpera||(j.tagName!="TR"&&!c(j).isStyle("display","inline"))){u-=j.scrollLeft;r-=j.scrollTop}j=j.parentNode}o=[u,r]}}return o},setXY:function(j,k){(j=Ext.fly(j,"_setXY")).position();var l=j.translatePoints(k),i=j.dom.style,m;for(m in l){if(!isNaN(l[m])){i[m]=l[m]+"px"}}},setX:function(j,i){this.setXY(j,[i,false])},setY:function(i,j){this.setXY(i,[false,j])}}})();Ext.lib.Event=function(){var v=false,f={},z=0,o=[],d,A=false,k=window,E=document,l=200,r=20,p=0,i=1,s=2,w=3,t="scrollLeft",q="scrollTop",g="unload",y="mouseover",D="mouseout",e=function(){var F;if(k.addEventListener){F=function(J,H,I,G){if(H=="mouseenter"){I=I.createInterceptor(n);J.addEventListener(y,I,(G))}else{if(H=="mouseleave"){I=I.createInterceptor(n);J.addEventListener(D,I,(G))}else{J.addEventListener(H,I,(G))}}return I}}else{if(k.attachEvent){F=function(J,H,I,G){J.attachEvent("on"+H,I);return I}}else{F=function(){}}}return F}(),h=function(){var F;if(k.removeEventListener){F=function(J,H,I,G){if(H=="mouseenter"){H=y}else{if(H=="mouseleave"){H=D}}J.removeEventListener(H,I,(G))}}else{if(k.detachEvent){F=function(I,G,H){I.detachEvent("on"+G,H)}}else{F=function(){}}}return F}();function n(F){return !u(F.currentTarget,x.getRelatedTarget(F))}function u(F,G){if(F&&F.firstChild){while(G){if(G===F){return true}G=G.parentNode;if(G&&(G.nodeType!=1)){G=null}}}return false}function B(){var G=false,L=[],J,I,F,H,K=!v||(z>0);if(!A){A=true;for(I=0;I<o.length;++I){F=o[I];if(F&&(J=E.getElementById(F.id))){if(!F.checkReady||v||J.nextSibling||(E&&E.body)){H=F.override;J=H?(H===true?F.obj:H):J;F.fn.call(J,F.obj);o.remove(F);--I}else{L.push(F)}}}z=(L.length===0)?0:z-1;if(K){m()}else{clearInterval(d);d=null}G=!(A=false)}return G}function m(){if(!d){var F=function(){B()};d=setInterval(F,r)}}function C(){var F=E.documentElement,G=E.body;if(F&&(F[q]||F[t])){return[F[t],F[q]]}else{if(G){return[G[t],G[q]]}else{return[0,0]}}}function j(F,G){F=F.browserEvent||F;var H=F["page"+G];if(!H&&H!==0){H=F["client"+G]||0;if(Ext.isIE){H+=C()[G=="X"?0:1]}}return H}var x={extAdapter:true,onAvailable:function(H,F,I,G){o.push({id:H,fn:F,obj:I,override:G,checkReady:false});z=l;m()},addListener:function(H,F,G){H=Ext.getDom(H);if(H&&G){if(F==g){if(f[H.id]===undefined){f[H.id]=[]}f[H.id].push([F,G]);return G}return e(H,F,G,false)}return false},removeListener:function(L,H,K){L=Ext.getDom(L);var J,G,F,I;if(L&&K){if(H==g){if((I=f[L.id])!==undefined){for(J=0,G=I.length;J<G;J++){if((F=I[J])&&F[p]==H&&F[i]==K){f[L.id].splice(J,1)}}}return}h(L,H,K,false)}},getTarget:function(F){F=F.browserEvent||F;return this.resolveTextNode(F.target||F.srcElement)},resolveTextNode:Ext.isGecko?function(G){if(!G){return}var F=HTMLElement.prototype.toString.call(G);if(F=="[xpconnect wrapped native prototype]"||F=="[object XULElement]"){return}return G.nodeType==3?G.parentNode:G}:function(F){return F&&F.nodeType==3?F.parentNode:F},getRelatedTarget:function(F){F=F.browserEvent||F;return this.resolveTextNode(F.relatedTarget||(/(mouseout|mouseleave)/.test(F.type)?F.toElement:/(mouseover|mouseenter)/.test(F.type)?F.fromElement:null))},getPageX:function(F){return j(F,"X")},getPageY:function(F){return j(F,"Y")},getXY:function(F){return[this.getPageX(F),this.getPageY(F)]},stopEvent:function(F){this.stopPropagation(F);this.preventDefault(F)},stopPropagation:function(F){F=F.browserEvent||F;if(F.stopPropagation){F.stopPropagation()}else{F.cancelBubble=true}},preventDefault:function(F){F=F.browserEvent||F;if(F.preventDefault){F.preventDefault()}else{if(F.keyCode){F.keyCode=0}F.returnValue=false}},getEvent:function(F){F=F||k.event;if(!F){var G=this.getEvent.caller;while(G){F=G.arguments[0];if(F&&Event==F.constructor){break}G=G.caller}}return F},getCharCode:function(F){F=F.browserEvent||F;return F.charCode||F.keyCode||0},getListeners:function(G,F){Ext.EventManager.getListeners(G,F)},purgeElement:function(G,H,F){Ext.EventManager.purgeElement(G,H,F)},_load:function(F){v=true;if(Ext.isIE&&F!==true){h(k,"load",arguments.callee)}},_unload:function(J){var G=Ext.lib.Event,H,M,K,F,I,N;for(F in f){K=f[F];for(H=0,I=K.length;H<I;H++){M=K[H];if(M){try{N=M[w]?(M[w]===true?M[s]:M[w]):k;M[i].call(N,G.getEvent(J),M[s])}catch(L){}}}}Ext.EventManager._unload();h(k,g,G._unload)}};x.on=x.addListener;x.un=x.removeListener;if(E&&E.body){x._load(true)}else{e(k,"load",x._load)}e(k,g,x._unload);B();return x}();Ext.lib.Ajax=function(){var g=["Msxml2.XMLHTTP.6.0","Msxml2.XMLHTTP.3.0","Msxml2.XMLHTTP"],d="Content-Type";function h(v){var t=v.conn,w,u={};function s(x,y){for(w in y){if(y.hasOwnProperty(w)){x.setRequestHeader(w,y[w])}}}Ext.apply(u,k.headers,k.defaultHeaders);s(t,u);delete k.headers}function e(v,u,t,s){return{tId:v,status:t?-1:0,statusText:t?"transaction aborted":"communication failure",isAbort:t,isTimeout:s,argument:u}}function j(s,t){(k.headers=k.headers||{})[s]=t}function p(u,y){var C={},x,w=u.conn,A,B,v=w.status==1223;try{x=u.conn.getAllResponseHeaders();Ext.each(x.replace(/\r\n/g,"\n").split("\n"),function(s){A=s.indexOf(":");if(A>=0){B=s.substr(0,A).toLowerCase();if(s.charAt(A+1)==" "){++A}C[B]=s.substr(A+1)}})}catch(z){}return{tId:u.tId,status:v?204:w.status,statusText:v?"No Content":w.statusText,getResponseHeader:function(s){return C[s.toLowerCase()]},getAllResponseHeaders:function(){return x},responseText:w.responseText,responseXML:w.responseXML,argument:y}}function o(s){if(s.tId){k.conn[s.tId]=null}s.conn=null;s=null}function f(x,y,t,s){if(!y){o(x);return}var v,u;try{if(x.conn.status!==undefined&&x.conn.status!=0){v=x.conn.status}else{v=13030}}catch(w){v=13030}if((v>=200&&v<300)||(Ext.isIE&&v==1223)){u=p(x,y.argument);if(y.success){if(!y.scope){y.success(u)}else{y.success.apply(y.scope,[u])}}}else{switch(v){case 12002:case 12029:case 12030:case 12031:case 12152:case 13030:u=e(x.tId,y.argument,(t?t:false),s);if(y.failure){if(!y.scope){y.failure(u)}else{y.failure.apply(y.scope,[u])}}break;default:u=p(x,y.argument);if(y.failure){if(!y.scope){y.failure(u)}else{y.failure.apply(y.scope,[u])}}}}o(x);u=null}function m(u,x,s,w,t,v){if(s&&s.readyState==4){clearInterval(t[w]);t[w]=null;if(v){clearTimeout(k.timeout[w]);k.timeout[w]=null}f(u,x)}}function r(s,t){k.abort(s,t,true)}function n(u,x){x=x||{};var s=u.conn,w=u.tId,t=k.poll,v=x.timeout||null;if(v){k.conn[w]=s;k.timeout[w]=setTimeout(r.createCallback(u,x),v)}t[w]=setInterval(m.createCallback(u,x,s,w,t,v),k.pollInterval)}function i(w,t,v,s){var u=l()||null;if(u){u.conn.open(w,t,true);if(k.useDefaultXhrHeader){j("X-Requested-With",k.defaultXhrHeader)}if(s&&k.useDefaultHeader&&(!k.headers||!k.headers[d])){j(d,k.defaultPostHeader)}if(k.defaultHeaders||k.headers){h(u)}n(u,v);u.conn.send(s||null)}return u}function l(){var t;try{if(t=q(k.transactionId)){k.transactionId++}}catch(s){}finally{return t}}function q(v){var s;try{s=new XMLHttpRequest()}catch(u){for(var t=Ext.isIE6?1:0;t<g.length;++t){try{s=new ActiveXObject(g[t]);break}catch(u){}}}finally{return{conn:s,tId:v}}}var k={request:function(s,u,v,w,A){if(A){var x=this,t=A.xmlData,y=A.jsonData,z;Ext.applyIf(x,A);if(t||y){z=x.headers;if(!z||!z[d]){j(d,t?"text/xml":"application/json")}w=t||(!Ext.isPrimitive(y)?Ext.encode(y):y)}}return i(s||A.method||"POST",u,v,w)},serializeForm:function(y){var x=y.elements||(document.forms[y]||Ext.getDom(y)).elements,s=false,w=encodeURIComponent,t,z="",v,u;Ext.each(x,function(A){t=A.name;v=A.type;if(!A.disabled&&t){if(/select-(one|multiple)/i.test(v)){Ext.each(A.options,function(B){if(B.selected){u=B.hasAttribute?B.hasAttribute("value"):B.getAttributeNode("value").specified;z+=String.format("{0}={1}&",w(t),w(u?B.value:B.text))}})}else{if(!(/file|undefined|reset|button/i.test(v))){if(!(/radio|checkbox/i.test(v)&&!A.checked)&&!(v=="submit"&&s)){z+=w(t)+"="+w(A.value)+"&";s=/submit/i.test(v)}}}}});return z.substr(0,z.length-1)},useDefaultHeader:true,defaultPostHeader:"application/x-www-form-urlencoded; charset=UTF-8",useDefaultXhrHeader:true,defaultXhrHeader:"XMLHttpRequest",poll:{},timeout:{},conn:{},pollInterval:50,transactionId:0,abort:function(v,x,s){var u=this,w=v.tId,t=false;if(u.isCallInProgress(v)){v.conn.abort();clearInterval(u.poll[w]);u.poll[w]=null;clearTimeout(k.timeout[w]);u.timeout[w]=null;f(v,x,(t=true),s)}return t},isCallInProgress:function(s){return s.conn&&!{0:true,4:true}[s.conn.readyState]}};return k}();(function(){var g=Ext.lib,i=/width|height|opacity|padding/i,f=/^((width|height)|(top|left))$/,d=/width|height|top$|bottom$|left$|right$/i,h=/\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i,j=function(k){return typeof k!=="undefined"},e=function(){return new Date()};g.Anim={motion:function(n,l,o,p,k,m){return this.run(n,l,o,p,k,m,Ext.lib.Motion)},run:function(o,l,q,r,k,n,m){m=m||Ext.lib.AnimBase;if(typeof r=="string"){r=Ext.lib.Easing[r]}var p=new m(o,l,q,r);p.animateX(function(){if(Ext.isFunction(k)){k.call(n)}});return p}};g.AnimBase=function(l,k,m,n){if(l){this.init(l,k,m,n)}};g.AnimBase.prototype={doMethod:function(k,n,l){var m=this;return m.method(m.curFrame,n,l-n,m.totalFrames)},setAttr:function(k,m,l){if(i.test(k)&&m<0){m=0}Ext.fly(this.el,"_anim").setStyle(k,m+l)},getAttr:function(k){var m=Ext.fly(this.el),n=m.getStyle(k),l=f.exec(k)||[];if(n!=="auto"&&!h.test(n)){return parseFloat(n)}return(!!(l[2])||(m.getStyle("position")=="absolute"&&!!(l[3])))?m.dom["offset"+l[0].charAt(0).toUpperCase()+l[0].substr(1)]:0},getDefaultUnit:function(k){return d.test(k)?"px":""},animateX:function(n,k){var l=this,m=function(){l.onComplete.removeListener(m);if(Ext.isFunction(n)){n.call(k||l,l)}};l.onComplete.addListener(m,l);l.animate()},setRunAttr:function(p){var r=this,s=this.attributes[p],t=s.to,q=s.by,u=s.from,v=s.unit,l=(this.runAttrs[p]={}),m;if(!j(t)&&!j(q)){return false}var k=j(u)?u:r.getAttr(p);if(j(t)){m=t}else{if(j(q)){if(Ext.isArray(k)){m=[];for(var n=0,o=k.length;n<o;n++){m[n]=k[n]+q[n]}}else{m=k+q}}}Ext.apply(l,{start:k,end:m,unit:j(v)?v:r.getDefaultUnit(p)})},init:function(l,p,o,k){var r=this,n=0,s=g.AnimMgr;Ext.apply(r,{isAnimated:false,startTime:null,el:Ext.getDom(l),attributes:p||{},duration:o||1,method:k||g.Easing.easeNone,useSec:true,curFrame:0,totalFrames:s.fps,runAttrs:{},animate:function(){var u=this,v=u.duration;if(u.isAnimated){return false}u.curFrame=0;u.totalFrames=u.useSec?Math.ceil(s.fps*v):v;s.registerElement(u)},stop:function(u){var v=this;if(u){v.curFrame=v.totalFrames;v._onTween.fire()}s.stop(v)}});var t=function(){var v=this,u;v.onStart.fire();v.runAttrs={};for(u in this.attributes){this.setRunAttr(u)}v.isAnimated=true;v.startTime=e();n=0};var q=function(){var v=this;v.onTween.fire({duration:e()-v.startTime,curFrame:v.curFrame});var w=v.runAttrs;for(var u in w){this.setAttr(u,v.doMethod(u,w[u].start,w[u].end),w[u].unit)}++n};var m=function(){var u=this,w=(e()-u.startTime)/1000,v={duration:w,frames:n,fps:n/w};u.isAnimated=false;n=0;u.onComplete.fire(v)};r.onStart=new Ext.util.Event(r);r.onTween=new Ext.util.Event(r);r.onComplete=new Ext.util.Event(r);(r._onStart=new Ext.util.Event(r)).addListener(t);(r._onTween=new Ext.util.Event(r)).addListener(q);(r._onComplete=new Ext.util.Event(r)).addListener(m)}};Ext.lib.AnimMgr=new function(){var o=this,m=null,l=[],k=0;Ext.apply(o,{fps:1000,delay:1,registerElement:function(q){l.push(q);++k;q._onStart.fire();o.start()},unRegister:function(r,q){r._onComplete.fire();q=q||p(r);if(q!=-1){l.splice(q,1)}if(--k<=0){o.stop()}},start:function(){if(m===null){m=setInterval(o.run,o.delay)}},stop:function(s){if(!s){clearInterval(m);for(var r=0,q=l.length;r<q;++r){if(l[0].isAnimated){o.unRegister(l[0],0)}}l=[];m=null;k=0}else{o.unRegister(s)}},run:function(){var t,s,q,r;for(s=0,q=l.length;s<q;s++){r=l[s];if(r&&r.isAnimated){t=r.totalFrames;if(r.curFrame<t||t===null){++r.curFrame;if(r.useSec){n(r)}r._onTween.fire()}else{o.stop(r)}}}}});var p=function(s){var r,q;for(r=0,q=l.length;r<q;r++){if(l[r]===s){return r}}return -1};var n=function(r){var v=r.totalFrames,u=r.curFrame,t=r.duration,s=(u*t*1000/v),q=(e()-r.startTime),w=0;if(q<t*1000){w=Math.round((q/s-1)*u)}else{w=v-(u+1)}if(w>0&&isFinite(w)){if(r.curFrame+w>=v){w=v-(u+1)}r.curFrame+=w}}};g.Bezier=new function(){this.getPosition=function(p,o){var r=p.length,m=[],q=1-o,l,k;for(l=0;l<r;++l){m[l]=[p[l][0],p[l][1]]}for(k=1;k<r;++k){for(l=0;l<r-k;++l){m[l][0]=q*m[l][0]+o*m[parseInt(l+1,10)][0];m[l][1]=q*m[l][1]+o*m[parseInt(l+1,10)][1]}}return[m[0][0],m[0][1]]}};g.Easing={easeNone:function(l,k,n,m){return n*l/m+k},easeIn:function(l,k,n,m){return n*(l/=m)*l+k},easeOut:function(l,k,n,m){return -n*(l/=m)*(l-2)+k}};(function(){g.Motion=function(o,n,p,q){if(o){g.Motion.superclass.constructor.call(this,o,n,p,q)}};Ext.extend(g.Motion,Ext.lib.AnimBase);var m=g.Motion.superclass,l=/^points$/i;Ext.apply(g.Motion.prototype,{setAttr:function(n,r,q){var p=this,o=m.setAttr;if(l.test(n)){q=q||"px";o.call(p,"left",r[0],q);o.call(p,"top",r[1],q)}else{o.call(p,n,r,q)}},getAttr:function(n){var p=this,o=m.getAttr;return l.test(n)?[o.call(p,"left"),o.call(p,"top")]:o.call(p,n)},doMethod:function(n,q,o){var p=this;return l.test(n)?g.Bezier.getPosition(p.runAttrs[n],p.method(p.curFrame,0,100,p.totalFrames)/100):m.doMethod.call(p,n,q,o)},setRunAttr:function(u){if(l.test(u)){var w=this,p=this.el,z=this.attributes.points,s=z.control||[],x=z.from,y=z.to,v=z.by,A=g.Dom,o,r,q,t,n;if(s.length>0&&!Ext.isArray(s[0])){s=[s]}else{}Ext.fly(p,"_anim").position();A.setXY(p,j(x)?x:A.getXY(p));o=w.getAttr("points");if(j(y)){q=k.call(w,y,o);for(r=0,t=s.length;r<t;++r){s[r]=k.call(w,s[r],o)}}else{if(j(v)){q=[o[0]+v[0],o[1]+v[1]];for(r=0,t=s.length;r<t;++r){s[r]=[o[0]+s[r][0],o[1]+s[r][1]]}}}n=this.runAttrs[u]=[o];if(s.length>0){n=n.concat(s)}n[n.length]=q}else{m.setRunAttr.call(this,u)}}});var k=function(n,p){var o=g.Dom.getXY(this.el);return[n[0]-o[0]+p[0],n[1]-o[1]+p[1]]}})()})();(function(){var d=Math.abs,i=Math.PI,h=Math.asin,g=Math.pow,e=Math.sin,f=Ext.lib;Ext.apply(f.Easing,{easeBoth:function(k,j,m,l){return((k/=l/2)<1)?m/2*k*k+j:-m/2*((--k)*(k-2)-1)+j},easeInStrong:function(k,j,m,l){return m*(k/=l)*k*k*k+j},easeOutStrong:function(k,j,m,l){return -m*((k=k/l-1)*k*k*k-1)+j},easeBothStrong:function(k,j,m,l){return((k/=l/2)<1)?m/2*k*k*k*k+j:-m/2*((k-=2)*k*k*k-2)+j},elasticIn:function(l,j,q,o,k,n){if(l==0||(l/=o)==1){return l==0?j:j+q}n=n||(o*0.3);var m;if(k>=d(q)){m=n/(2*i)*h(q/k)}else{k=q;m=n/4}return -(k*g(2,10*(l-=1))*e((l*o-m)*(2*i)/n))+j},elasticOut:function(l,j,q,o,k,n){if(l==0||(l/=o)==1){return l==0?j:j+q}n=n||(o*0.3);var m;if(k>=d(q)){m=n/(2*i)*h(q/k)}else{k=q;m=n/4}return k*g(2,-10*l)*e((l*o-m)*(2*i)/n)+q+j},elasticBoth:function(l,j,q,o,k,n){if(l==0||(l/=o/2)==2){return l==0?j:j+q}n=n||(o*(0.3*1.5));var m;if(k>=d(q)){m=n/(2*i)*h(q/k)}else{k=q;m=n/4}return l<1?-0.5*(k*g(2,10*(l-=1))*e((l*o-m)*(2*i)/n))+j:k*g(2,-10*(l-=1))*e((l*o-m)*(2*i)/n)*0.5+q+j},backIn:function(k,j,n,m,l){l=l||1.70158;return n*(k/=m)*k*((l+1)*k-l)+j},backOut:function(k,j,n,m,l){if(!l){l=1.70158}return n*((k=k/m-1)*k*((l+1)*k+l)+1)+j},backBoth:function(k,j,n,m,l){l=l||1.70158;return((k/=m/2)<1)?n/2*(k*k*(((l*=(1.525))+1)*k-l))+j:n/2*((k-=2)*k*(((l*=(1.525))+1)*k+l)+2)+j},bounceIn:function(k,j,m,l){return m-f.Easing.bounceOut(l-k,0,m,l)+j},bounceOut:function(k,j,m,l){if((k/=l)<(1/2.75)){return m*(7.5625*k*k)+j}else{if(k<(2/2.75)){return m*(7.5625*(k-=(1.5/2.75))*k+0.75)+j}else{if(k<(2.5/2.75)){return m*(7.5625*(k-=(2.25/2.75))*k+0.9375)+j}}}return m*(7.5625*(k-=(2.625/2.75))*k+0.984375)+j},bounceBoth:function(k,j,m,l){return(k<l/2)?f.Easing.bounceIn(k*2,0,m,l)*0.5+j:f.Easing.bounceOut(k*2-l,0,m,l)*0.5+m*0.5+j}})})();(function(){var h=Ext.lib;h.Anim.color=function(p,n,q,r,m,o){return h.Anim.run(p,n,q,r,m,o,h.ColorAnim)};h.ColorAnim=function(n,m,o,p){h.ColorAnim.superclass.constructor.call(this,n,m,o,p)};Ext.extend(h.ColorAnim,h.AnimBase);var j=h.ColorAnim.superclass,i=/color$/i,f=/^transparent|rgba\(0, 0, 0, 0\)$/,l=/^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i,d=/^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i,e=/^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i,g=function(m){return typeof m!=="undefined"};function k(n){var p=parseInt,o,m=null,q;if(n.length==3){return n}Ext.each([d,l,e],function(s,r){o=(r%2==0)?16:10;q=s.exec(n);if(q&&q.length==4){m=[p(q[1],o),p(q[2],o),p(q[3],o)];return false}});return m}Ext.apply(h.ColorAnim.prototype,{getAttr:function(m){var o=this,n=o.el,p;if(i.test(m)){while(n&&f.test(p=Ext.fly(n).getStyle(m))){n=n.parentNode;p="fff"}}else{p=j.getAttr.call(o,m)}return p},doMethod:function(s,m,o){var t=this,n,q=Math.floor,p,r,u;if(i.test(s)){n=[];o=o||[];for(p=0,r=m.length;p<r;p++){u=m[p];n[p]=j.doMethod.call(t,s,u,o[p])}n="rgb("+q(n[0])+","+q(n[1])+","+q(n[2])+")"}else{n=j.doMethod.call(t,s,m,o)}return n},setRunAttr:function(r){var t=this,u=t.attributes[r],v=u.to,s=u.by,n;j.setRunAttr.call(t,r);n=t.runAttrs[r];if(i.test(r)){var m=k(n.start),o=k(n.end);if(!g(v)&&g(s)){o=k(s);for(var p=0,q=m.length;p<q;p++){o[p]=m[p]+o[p]}}n.start=m;n.end=o}}})})();(function(){var d=Ext.lib;d.Anim.scroll=function(j,h,k,l,g,i){return d.Anim.run(j,h,k,l,g,i,d.Scroll)};d.Scroll=function(h,g,i,j){if(h){d.Scroll.superclass.constructor.call(this,h,g,i,j)}};Ext.extend(d.Scroll,d.ColorAnim);var f=d.Scroll.superclass,e="scroll";Ext.apply(d.Scroll.prototype,{doMethod:function(g,m,h){var k,j=this,l=j.curFrame,i=j.totalFrames;if(g==e){k=[j.method(l,m[0],h[0]-m[0],i),j.method(l,m[1],h[1]-m[1],i)]}else{k=f.doMethod.call(j,g,m,h)}return k},getAttr:function(g){var h=this;if(g==e){return[h.el.scrollLeft,h.el.scrollTop]}else{return f.getAttr.call(h,g)}},setAttr:function(g,j,i){var h=this;if(g==e){h.el.scrollLeft=j[0];h.el.scrollTop=j[1]}else{f.setAttr.call(h,g,j,i)}}})})();if(Ext.isIE){function a(){var d=Function.prototype;delete d.createSequence;delete d.defer;delete d.createDelegate;delete d.createCallback;delete d.createInterceptor;window.detachEvent("onunload",a)}window.attachEvent("onunload",a)}})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/ext/ext-base-debug.js	(revision 76)
@@ -0,0 +1,2909 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// for old browsers
+window.undefined = window.undefined;
+
+/**
+ * @class Ext
+ * Ext core utilities and functions.
+ * @singleton
+ */
+
+Ext = {
+    /**
+     * The version of the framework
+     * @type String
+     */
+    version : '3.4.0',
+    versionDetail : {
+        major : 3,
+        minor : 4,
+        patch : 0
+    }
+};
+
+/**
+ * Copies all the properties of config to obj.
+ * @param {Object} obj The receiver of the properties
+ * @param {Object} config The source of the properties
+ * @param {Object} defaults A different object that will also be applied for default values
+ * @return {Object} returns obj
+ * @member Ext apply
+ */
+Ext.apply = function(o, c, defaults){
+    // no "this" reference for friendly out of scope calls
+    if(defaults){
+        Ext.apply(o, defaults);
+    }
+    if(o && c && typeof c == 'object'){
+        for(var p in c){
+            o[p] = c[p];
+        }
+    }
+    return o;
+};
+
+(function(){
+    var idSeed = 0,
+        toString = Object.prototype.toString,
+        ua = navigator.userAgent.toLowerCase(),
+        check = function(r){
+            return r.test(ua);
+        },
+        DOC = document,
+        docMode = DOC.documentMode,
+        isStrict = DOC.compatMode == "CSS1Compat",
+        isOpera = check(/opera/),
+        isChrome = check(/\bchrome\b/),
+        isWebKit = check(/webkit/),
+        isSafari = !isChrome && check(/safari/),
+        isSafari2 = isSafari && check(/applewebkit\/4/), // unique to Safari 2
+        isSafari3 = isSafari && check(/version\/3/),
+        isSafari4 = isSafari && check(/version\/4/),
+        isIE = !isOpera && check(/msie/),
+        isIE7 = isIE && (check(/msie 7/) || docMode == 7),
+        isIE8 = isIE && (check(/msie 8/) && docMode != 7),
+        isIE9 = isIE && check(/msie 9/),
+        isIE6 = isIE && !isIE7 && !isIE8 && !isIE9,
+        isGecko = !isWebKit && check(/gecko/),
+        isGecko2 = isGecko && check(/rv:1\.8/),
+        isGecko3 = isGecko && check(/rv:1\.9/),
+        isBorderBox = isIE && !isStrict,
+        isWindows = check(/windows|win32/),
+        isMac = check(/macintosh|mac os x/),
+        isAir = check(/adobeair/),
+        isLinux = check(/linux/),
+        isSecure = /^https/i.test(window.location.protocol);
+
+    // remove css image flicker
+    if(isIE6){
+        try{
+            DOC.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+
+    Ext.apply(Ext, {
+        /**
+         * URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent
+         * the IE insecure content warning (<tt>'about:blank'</tt>, except for IE in secure mode, which is <tt>'javascript:""'</tt>).
+         * @type String
+         */
+        SSL_SECURE_URL : isSecure && isIE ? 'javascript:""' : 'about:blank',
+        /**
+         * True if the browser is in strict (standards-compliant) mode, as opposed to quirks mode
+         * @type Boolean
+         */
+        isStrict : isStrict,
+        /**
+         * True if the page is running over SSL
+         * @type Boolean
+         */
+        isSecure : isSecure,
+        /**
+         * True when the document is fully initialized and ready for action
+         * @type Boolean
+         */
+        isReady : false,
+
+        /**
+         * True if the {@link Ext.Fx} Class is available
+         * @type Boolean
+         * @property enableFx
+         */
+
+        /**
+         * HIGHLY EXPERIMENTAL
+         * True to force css based border-box model override and turning off javascript based adjustments. This is a
+         * runtime configuration and must be set before onReady.
+         * @type Boolean
+         */
+        enableForcedBoxModel : false,
+
+        /**
+         * True to automatically uncache orphaned Ext.Elements periodically (defaults to true)
+         * @type Boolean
+         */
+        enableGarbageCollector : true,
+
+        /**
+         * True to automatically purge event listeners during garbageCollection (defaults to false).
+         * @type Boolean
+         */
+        enableListenerCollection : false,
+
+        /**
+         * EXPERIMENTAL - True to cascade listener removal to child elements when an element is removed.
+         * Currently not optimized for performance.
+         * @type Boolean
+         */
+        enableNestedListenerRemoval : false,
+
+        /**
+         * Indicates whether to use native browser parsing for JSON methods.
+         * This option is ignored if the browser does not support native JSON methods.
+         * <b>Note: Native JSON methods will not work with objects that have functions.
+         * Also, property names must be quoted, otherwise the data will not parse.</b> (Defaults to false)
+         * @type Boolean
+         */
+        USE_NATIVE_JSON : false,
+
+        /**
+         * Copies all the properties of config to obj if they don't already exist.
+         * @param {Object} obj The receiver of the properties
+         * @param {Object} config The source of the properties
+         * @return {Object} returns obj
+         */
+        applyIf : function(o, c){
+            if(o){
+                for(var p in c){
+                    if(!Ext.isDefined(o[p])){
+                        o[p] = c[p];
+                    }
+                }
+            }
+            return o;
+        },
+
+        /**
+         * Generates unique ids. If the element already has an id, it is unchanged
+         * @param {Mixed} el (optional) The element to generate an id for
+         * @param {String} prefix (optional) Id prefix (defaults "ext-gen")
+         * @return {String} The generated Id.
+         */
+        id : function(el, prefix){
+            el = Ext.getDom(el, true) || {};
+            if (!el.id) {
+                el.id = (prefix || "ext-gen") + (++idSeed);
+            }
+            return el.id;
+        },
+
+        /**
+         * <p>Extends one class to create a subclass and optionally overrides members with the passed literal. This method
+         * also adds the function "override()" to the subclass that can be used to override members of the class.</p>
+         * For example, to create a subclass of Ext GridPanel:
+         * <pre><code>
+MyGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    constructor: function(config) {
+
+//      Create configuration for this Grid.
+        var store = new Ext.data.Store({...});
+        var colModel = new Ext.grid.ColumnModel({...});
+
+//      Create a new config object containing our computed properties
+//      *plus* whatever was in the config parameter.
+        config = Ext.apply({
+            store: store,
+            colModel: colModel
+        }, config);
+
+        MyGridPanel.superclass.constructor.call(this, config);
+
+//      Your postprocessing here
+    },
+
+    yourMethod: function() {
+        // etc.
+    }
+});
+</code></pre>
+         *
+         * <p>This function also supports a 3-argument call in which the subclass's constructor is
+         * passed as an argument. In this form, the parameters are as follows:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><code>subclass</code> : Function <div class="sub-desc">The subclass constructor.</div></li>
+         * <li><code>superclass</code> : Function <div class="sub-desc">The constructor of class being extended</div></li>
+         * <li><code>overrides</code> : Object <div class="sub-desc">A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared among all instances of the new class.</div></li>
+         * </ul></div>
+         *
+         * @param {Function} superclass The constructor of class being extended.
+         * @param {Object} overrides <p>A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared between all instances of the new class.</p>
+         * <p>This may contain a special member named <tt><b>constructor</b></tt>. This is used
+         * to define the constructor of the new class, and is returned. If this property is
+         * <i>not</i> specified, a constructor is generated and returned which just calls the
+         * superclass's constructor passing on its parameters.</p>
+         * <p><b>It is essential that you call the superclass constructor in any provided constructor. See example code.</b></p>
+         * @return {Function} The subclass constructor from the <code>overrides</code> parameter, or a generated one if not provided.
+         */
+        extend : function(){
+            // inline overrides
+            var io = function(o){
+                for(var m in o){
+                    this[m] = o[m];
+                }
+            };
+            var oc = Object.prototype.constructor;
+
+            return function(sb, sp, overrides){
+                if(typeof sp == 'object'){
+                    overrides = sp;
+                    sp = sb;
+                    sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
+                }
+                var F = function(){},
+                    sbp,
+                    spp = sp.prototype;
+
+                F.prototype = spp;
+                sbp = sb.prototype = new F();
+                sbp.constructor=sb;
+                sb.superclass=spp;
+                if(spp.constructor == oc){
+                    spp.constructor=sp;
+                }
+                sb.override = function(o){
+                    Ext.override(sb, o);
+                };
+                sbp.superclass = sbp.supr = (function(){
+                    return spp;
+                });
+                sbp.override = io;
+                Ext.override(sb, overrides);
+                sb.extend = function(o){return Ext.extend(sb, o);};
+                return sb;
+            };
+        }(),
+
+        /**
+         * Adds a list of functions to the prototype of an existing class, overwriting any existing methods with the same name.
+         * Usage:<pre><code>
+Ext.override(MyClass, {
+    newMethod1: function(){
+        // etc.
+    },
+    newMethod2: function(foo){
+        // etc.
+    }
+});
+</code></pre>
+         * @param {Object} origclass The class to override
+         * @param {Object} overrides The list of functions to add to origClass.  This should be specified as an object literal
+         * containing one or more methods.
+         * @method override
+         */
+        override : function(origclass, overrides){
+            if(overrides){
+                var p = origclass.prototype;
+                Ext.apply(p, overrides);
+                if(Ext.isIE && overrides.hasOwnProperty('toString')){
+                    p.toString = overrides.toString;
+                }
+            }
+        },
+
+        /**
+         * Creates namespaces to be used for scoping variables and classes so that they are not global.
+         * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+         * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+         * @param {String} namespace1
+         * @param {String} namespace2
+         * @param {String} etc
+         * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+         * @method namespace
+         */
+        namespace : function(){
+            var len1 = arguments.length,
+                i = 0,
+                len2,
+                j,
+                main,
+                ns,
+                sub,
+                current;
+                
+            for(; i < len1; ++i) {
+                main = arguments[i];
+                ns = arguments[i].split('.');
+                current = window[ns[0]];
+                if (current === undefined) {
+                    current = window[ns[0]] = {};
+                }
+                sub = ns.slice(1);
+                len2 = sub.length;
+                for(j = 0; j < len2; ++j) {
+                    current = current[sub[j]] = current[sub[j]] || {};
+                }
+            }
+            return current;
+        },
+
+        /**
+         * Takes an object and converts it to an encoded URL. e.g. Ext.urlEncode({foo: 1, bar: 2}); would return "foo=1&bar=2".  Optionally, property values can be arrays, instead of keys and the resulting string that's returned will contain a name/value pair for each array value.
+         * @param {Object} o
+         * @param {String} pre (optional) A prefix to add to the url encoded string
+         * @return {String}
+         */
+        urlEncode : function(o, pre){
+            var empty,
+                buf = [],
+                e = encodeURIComponent;
+
+            Ext.iterate(o, function(key, item){
+                empty = Ext.isEmpty(item);
+                Ext.each(empty ? key : item, function(val){
+                    buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
+                });
+            });
+            if(!pre){
+                buf.shift();
+                pre = '';
+            }
+            return pre + buf.join('');
+        },
+
+        /**
+         * Takes an encoded URL and and converts it to an object. Example: <pre><code>
+Ext.urlDecode("foo=1&bar=2"); // returns {foo: "1", bar: "2"}
+Ext.urlDecode("foo=1&bar=2&bar=3&bar=4", false); // returns {foo: "1", bar: ["2", "3", "4"]}
+</code></pre>
+         * @param {String} string
+         * @param {Boolean} overwrite (optional) Items of the same name will overwrite previous values instead of creating an an array (Defaults to false).
+         * @return {Object} A literal with members
+         */
+        urlDecode : function(string, overwrite){
+            if(Ext.isEmpty(string)){
+                return {};
+            }
+            var obj = {},
+                pairs = string.split('&'),
+                d = decodeURIComponent,
+                name,
+                value;
+            Ext.each(pairs, function(pair) {
+                pair = pair.split('=');
+                name = d(pair[0]);
+                value = d(pair[1]);
+                obj[name] = overwrite || !obj[name] ? value :
+                            [].concat(obj[name]).concat(value);
+            });
+            return obj;
+        },
+
+        /**
+         * Appends content to the query string of a URL, handling logic for whether to place
+         * a question mark or ampersand.
+         * @param {String} url The URL to append to.
+         * @param {String} s The content to append to the URL.
+         * @return (String) The resulting URL
+         */
+        urlAppend : function(url, s){
+            if(!Ext.isEmpty(s)){
+                return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
+            }
+            return url;
+        },
+
+        /**
+         * Converts any iterable (numeric indices and a length property) into a true array
+         * Don't use this on strings. IE doesn't support "abc"[0] which this implementation depends on.
+         * For strings, use this instead: "abc".match(/./g) => [a,b,c];
+         * @param {Iterable} the iterable object to be turned into a true Array.
+         * @return (Array) array
+         */
+         toArray : function(){
+             return isIE ?
+                 function(a, i, j, res){
+                     res = [];
+                     for(var x = 0, len = a.length; x < len; x++) {
+                         res.push(a[x]);
+                     }
+                     return res.slice(i || 0, j || res.length);
+                 } :
+                 function(a, i, j){
+                     return Array.prototype.slice.call(a, i || 0, j || a.length);
+                 };
+         }(),
+
+        isIterable : function(v){
+            //check for array or arguments
+            if(Ext.isArray(v) || v.callee){
+                return true;
+            }
+            //check for node list type
+            if(/NodeList|HTMLCollection/.test(toString.call(v))){
+                return true;
+            }
+            //NodeList has an item and length property
+            //IXMLDOMNodeList has nextNode method, needs to be checked first.
+            return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length));
+        },
+
+        /**
+         * Iterates an array calling the supplied function.
+         * @param {Array/NodeList/Mixed} array The array to be iterated. If this
+         * argument is not really an array, the supplied function is called once.
+         * @param {Function} fn The function to be called with each item. If the
+         * supplied function returns false, iteration stops and this method returns
+         * the current <code>index</code>. This function is called with
+         * the following arguments:
+         * <div class="mdetail-params"><ul>
+         * <li><code>item</code> : <i>Mixed</i>
+         * <div class="sub-desc">The item at the current <code>index</code>
+         * in the passed <code>array</code></div></li>
+         * <li><code>index</code> : <i>Number</i>
+         * <div class="sub-desc">The current index within the array</div></li>
+         * <li><code>allItems</code> : <i>Array</i>
+         * <div class="sub-desc">The <code>array</code> passed as the first
+         * argument to <code>Ext.each</code>.</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed.
+         * Defaults to the <code>item</code> at the current <code>index</code>
+         * within the passed <code>array</code>.
+         * @return See description for the fn parameter.
+         */
+        each : function(array, fn, scope){
+            if(Ext.isEmpty(array, true)){
+                return;
+            }
+            if(!Ext.isIterable(array) || Ext.isPrimitive(array)){
+                array = [array];
+            }
+            for(var i = 0, len = array.length; i < len; i++){
+                if(fn.call(scope || array[i], array[i], i, array) === false){
+                    return i;
+                };
+            }
+        },
+
+        /**
+         * Iterates either the elements in an array, or each of the properties in an object.
+         * <b>Note</b>: If you are only iterating arrays, it is better to call {@link #each}.
+         * @param {Object/Array} object The object or array to be iterated
+         * @param {Function} fn The function to be called for each iteration.
+         * The iteration will stop if the supplied function returns false, or
+         * all array elements / object properties have been covered. The signature
+         * varies depending on the type of object being interated:
+         * <div class="mdetail-params"><ul>
+         * <li>Arrays : <tt>(Object item, Number index, Array allItems)</tt>
+         * <div class="sub-desc">
+         * When iterating an array, the supplied function is called with each item.</div></li>
+         * <li>Objects : <tt>(String key, Object value, Object)</tt>
+         * <div class="sub-desc">
+         * When iterating an object, the supplied function is called with each key-value pair in
+         * the object, and the iterated object</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed. Defaults to
+         * the <code>object</code> being iterated.
+         */
+        iterate : function(obj, fn, scope){
+            if(Ext.isEmpty(obj)){
+                return;
+            }
+            if(Ext.isIterable(obj)){
+                Ext.each(obj, fn, scope);
+                return;
+            }else if(typeof obj == 'object'){
+                for(var prop in obj){
+                    if(obj.hasOwnProperty(prop)){
+                        if(fn.call(scope || obj, prop, obj[prop], obj) === false){
+                            return;
+                        };
+                    }
+                }
+            }
+        },
+
+        /**
+         * Return the dom node for the passed String (id), dom node, or Ext.Element.
+         * Optional 'strict' flag is needed for IE since it can return 'name' and
+         * 'id' elements by using getElementById.
+         * Here are some examples:
+         * <pre><code>
+// gets dom node based on id
+var elDom = Ext.getDom('elId');
+// gets dom node based on the dom node
+var elDom1 = Ext.getDom(elDom);
+
+// If we don&#39;t know if we are working with an
+// Ext.Element or a dom node use Ext.getDom
+function(el){
+    var dom = Ext.getDom(el);
+    // do something with the dom node
+}
+         * </code></pre>
+         * <b>Note</b>: the dom node to be found actually needs to exist (be rendered, etc)
+         * when this method is called to be successful.
+         * @param {Mixed} el
+         * @return HTMLElement
+         */
+        getDom : function(el, strict){
+            if(!el || !DOC){
+                return null;
+            }
+            if (el.dom){
+                return el.dom;
+            } else {
+                if (typeof el == 'string') {
+                    var e = DOC.getElementById(el);
+                    // IE returns elements with the 'name' and 'id' attribute.
+                    // we do a strict check to return the element with only the id attribute
+                    if (e && isIE && strict) {
+                        if (el == e.getAttribute('id')) {
+                            return e;
+                        } else {
+                            return null;
+                        }
+                    }
+                    return e;
+                } else {
+                    return el;
+                }
+            }
+        },
+
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getBody : function(){
+            return Ext.get(DOC.body || DOC.documentElement);
+        },
+        
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getHead : function() {
+            var head;
+            
+            return function() {
+                if (head == undefined) {
+                    head = Ext.get(DOC.getElementsByTagName("head")[0]);
+                }
+                
+                return head;
+            };
+        }(),
+
+        /**
+         * Removes a DOM node from the document.
+         */
+        /**
+         * <p>Removes this element from the document, removes all DOM event listeners, and deletes the cache reference.
+         * All DOM event listeners are removed from this element. If {@link Ext#enableNestedListenerRemoval} is
+         * <code>true</code>, then DOM event listeners are also removed from all child nodes. The body node
+         * will be ignored if passed in.</p>
+         * @param {HTMLElement} node The node to remove
+         */
+        removeNode : isIE && !isIE8 ? function(){
+            var d;
+            return function(n){
+                if(n && n.tagName != 'BODY'){
+                    (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                    d = d || DOC.createElement('div');
+                    d.appendChild(n);
+                    d.innerHTML = '';
+                    delete Ext.elCache[n.id];
+                }
+            };
+        }() : function(n){
+            if(n && n.parentNode && n.tagName != 'BODY'){
+                (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                n.parentNode.removeChild(n);
+                delete Ext.elCache[n.id];
+            }
+        },
+
+        /**
+         * <p>Returns true if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Boolean} allowBlank (optional) true to allow empty strings (defaults to false)
+         * @return {Boolean}
+         */
+        isEmpty : function(v, allowBlank){
+            return v === null || v === undefined || ((Ext.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript array, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isArray : function(v){
+            return toString.apply(v) === '[object Array]';
+        },
+
+        /**
+         * Returns true if the passed object is a JavaScript date object, otherwise false.
+         * @param {Object} object The object to test
+         * @return {Boolean}
+         */
+        isDate : function(v){
+            return toString.apply(v) === '[object Date]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Object, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isObject : function(v){
+            return !!v && Object.prototype.toString.call(v) === '[object Object]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isPrimitive : function(v){
+            return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Function, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isFunction : function(v){
+            return toString.apply(v) === '[object Function]';
+        },
+
+        /**
+         * Returns true if the passed value is a number. Returns false for non-finite numbers.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isNumber : function(v){
+            return typeof v === 'number' && isFinite(v);
+        },
+
+        /**
+         * Returns true if the passed value is a string.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isString : function(v){
+            return typeof v === 'string';
+        },
+
+        /**
+         * Returns true if the passed value is a boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isBoolean : function(v){
+            return typeof v === 'boolean';
+        },
+
+        /**
+         * Returns true if the passed value is an HTMLElement
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isElement : function(v) {
+            return v ? !!v.tagName : false;
+        },
+
+        /**
+         * Returns true if the passed value is not undefined.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isDefined : function(v){
+            return typeof v !== 'undefined';
+        },
+
+        /**
+         * True if the detected browser is Opera.
+         * @type Boolean
+         */
+        isOpera : isOpera,
+        /**
+         * True if the detected browser uses WebKit.
+         * @type Boolean
+         */
+        isWebKit : isWebKit,
+        /**
+         * True if the detected browser is Chrome.
+         * @type Boolean
+         */
+        isChrome : isChrome,
+        /**
+         * True if the detected browser is Safari.
+         * @type Boolean
+         */
+        isSafari : isSafari,
+        /**
+         * True if the detected browser is Safari 3.x.
+         * @type Boolean
+         */
+        isSafari3 : isSafari3,
+        /**
+         * True if the detected browser is Safari 4.x.
+         * @type Boolean
+         */
+        isSafari4 : isSafari4,
+        /**
+         * True if the detected browser is Safari 2.x.
+         * @type Boolean
+         */
+        isSafari2 : isSafari2,
+        /**
+         * True if the detected browser is Internet Explorer.
+         * @type Boolean
+         */
+        isIE : isIE,
+        /**
+         * True if the detected browser is Internet Explorer 6.x.
+         * @type Boolean
+         */
+        isIE6 : isIE6,
+        /**
+         * True if the detected browser is Internet Explorer 7.x.
+         * @type Boolean
+         */
+        isIE7 : isIE7,
+        /**
+         * True if the detected browser is Internet Explorer 8.x.
+         * @type Boolean
+         */
+        isIE8 : isIE8,
+        /**
+         * True if the detected browser is Internet Explorer 9.x.
+         * @type Boolean
+         */
+        isIE9 : isIE9,
+        /**
+         * True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).
+         * @type Boolean
+         */
+        isGecko : isGecko,
+        /**
+         * True if the detected browser uses a pre-Gecko 1.9 layout engine (e.g. Firefox 2.x).
+         * @type Boolean
+         */
+        isGecko2 : isGecko2,
+        /**
+         * True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).
+         * @type Boolean
+         */
+        isGecko3 : isGecko3,
+        /**
+         * True if the detected browser is Internet Explorer running in non-strict mode.
+         * @type Boolean
+         */
+        isBorderBox : isBorderBox,
+        /**
+         * True if the detected platform is Linux.
+         * @type Boolean
+         */
+        isLinux : isLinux,
+        /**
+         * True if the detected platform is Windows.
+         * @type Boolean
+         */
+        isWindows : isWindows,
+        /**
+         * True if the detected platform is Mac OS.
+         * @type Boolean
+         */
+        isMac : isMac,
+        /**
+         * True if the detected platform is Adobe Air.
+         * @type Boolean
+         */
+        isAir : isAir
+    });
+
+    /**
+     * Creates namespaces to be used for scoping variables and classes so that they are not global.
+     * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+     * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+     * @param {String} namespace1
+     * @param {String} namespace2
+     * @param {String} etc
+     * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+     * @method ns
+     */
+    Ext.ns = Ext.namespace;
+})();
+
+Ext.ns('Ext.util', 'Ext.lib', 'Ext.data', 'Ext.supports');
+
+Ext.elCache = {};
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+     /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = sayHi.createInterceptor(function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+</code></pre>
+     * @param {Function} fcn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor : function(fcn, scope){
+        var method = this;
+        return !Ext.isFunction(fcn) ?
+                this :
+                function() {
+                    var me = this,
+                        args = arguments;
+                    fcn.target = me;
+                    fcn.method = method;
+                    return (fcn.apply(scope || me || window, args) !== false) ?
+                            method.apply(me || window, args) :
+                            null;
+                };
+    },
+
+     /**
+     * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+     * Call directly on any function. Example: <code>myFunction.createCallback(arg1, arg2)</code>
+     * Will create a function that is bound to those 2 args. <b>If a specific scope is required in the
+     * callback, use {@link #createDelegate} instead.</b> The function returned by createCallback always
+     * executes in the window scope.
+     * <p>This method is required when you want to pass arguments to a callback function.  If no arguments
+     * are needed, you can simply pass a reference to the function as a callback (e.g., callback: myFn).
+     * However, if you tried to pass a function with arguments (e.g., callback: myFn(arg1, arg2)) the function
+     * would simply execute immediately when the code is parsed. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// clicking the button alerts "Hi, Fred"
+new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody(),
+    handler: sayHi.createCallback('Fred')
+});
+</code></pre>
+     * @return {Function} The new function
+    */
+    createCallback : function(/*args...*/){
+        // make args available, in function below
+        var args = arguments,
+            method = this;
+        return function() {
+            return method.apply(window, args);
+        };
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>this.myFunction.createDelegate(this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', sayHi.createDelegate(btn, ['Fred']));
+</code></pre>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate : function(obj, args, appendArgs){
+        var method = this;
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true){
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }else if (Ext.isNumber(appendArgs)){
+                callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args); // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+            }
+            return method.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+sayHi.defer(2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+(function(){
+    alert('Anonymous');
+}).defer(100);
+</code></pre>
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer : function(millis, obj, args, appendArgs){
+        var fn = this.createDelegate(obj, args, appendArgs);
+        if(millis > 0){
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    }
+});
+
+/**
+ * @class String
+ * These functions are available on every String object.
+ */
+Ext.applyIf(String, {
+    /**
+     * Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens.  Each
+     * token must be unique, and must increment in the format {0}, {1}, etc.  Example usage:
+     * <pre><code>
+var cls = 'my-class', text = 'Some text';
+var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);
+// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'
+     * </code></pre>
+     * @param {String} string The tokenized string to be formatted
+     * @param {String} value1 The value to replace token {0}
+     * @param {String} value2 Etc...
+     * @return {String} The formatted string
+     * @static
+     */
+    format : function(format){
+        var args = Ext.toArray(arguments, 1);
+        return format.replace(/\{(\d+)\}/g, function(m, i){
+            return args[i];
+        });
+    }
+});
+
+/**
+ * @class Array
+ */
+Ext.applyIf(Array.prototype, {
+    /**
+     * Checks whether or not the specified object exists in the array.
+     * @param {Object} o The object to check for
+     * @param {Number} from (Optional) The index at which to begin the search
+     * @return {Number} The index of o in the array (or -1 if it is not found)
+     */
+    indexOf : function(o, from){
+        var len = this.length;
+        from = from || 0;
+        from += (from < 0) ? len : 0;
+        for (; from < len; ++from){
+            if(this[from] === o){
+                return from;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Removes the specified object from the array.  If the object is not found nothing happens.
+     * @param {Object} o The object to remove
+     * @return {Array} this array
+     */
+    remove : function(o){
+        var index = this.indexOf(o);
+        if(index != -1){
+            this.splice(index, 1);
+        }
+        return this;
+    }
+});
+/**
+ * @class Ext.util.TaskRunner
+ * Provides the ability to execute one or more arbitrary tasks in a multithreaded
+ * manner.  Generally, you can use the singleton {@link Ext.TaskMgr} instead, but
+ * if needed, you can create separate instances of TaskRunner.  Any number of
+ * separate tasks can be started at any time and will run independently of each
+ * other. Example usage:
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var updateClock = function(){
+    Ext.fly('clock').update(new Date().format('g:i:s A'));
+} 
+var task = {
+    run: updateClock,
+    interval: 1000 //1 second
+}
+var runner = new Ext.util.TaskRunner();
+runner.start(task);
+
+// equivalent using TaskMgr
+Ext.TaskMgr.start({
+    run: updateClock,
+    interval: 1000
+});
+
+ * </code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * Also see {@link Ext.util.DelayedTask}. 
+ * 
+ * @constructor
+ * @param {Number} interval (optional) The minimum precision in milliseconds supported by this TaskRunner instance
+ * (defaults to 10)
+ */
+Ext.util.TaskRunner = function(interval){
+    interval = interval || 10;
+    var tasks = [], 
+    	removeQueue = [],
+    	id = 0,
+    	running = false,
+
+    	// private
+    	stopThread = function(){
+	        running = false;
+	        clearInterval(id);
+	        id = 0;
+	    },
+
+    	// private
+    	startThread = function(){
+	        if(!running){
+	            running = true;
+	            id = setInterval(runTasks, interval);
+	        }
+	    },
+
+    	// private
+    	removeTask = function(t){
+	        removeQueue.push(t);
+	        if(t.onStop){
+	            t.onStop.apply(t.scope || t);
+	        }
+	    },
+	    
+    	// private
+    	runTasks = function(){
+	    	var rqLen = removeQueue.length,
+	    		now = new Date().getTime();	    			    		
+	    
+	        if(rqLen > 0){
+	            for(var i = 0; i < rqLen; i++){
+	                tasks.remove(removeQueue[i]);
+	            }
+	            removeQueue = [];
+	            if(tasks.length < 1){
+	                stopThread();
+	                return;
+	            }
+	        }	        
+	        for(var i = 0, t, itime, rt, len = tasks.length; i < len; ++i){
+	            t = tasks[i];
+	            itime = now - t.taskRunTime;
+	            if(t.interval <= itime){
+	                rt = t.run.apply(t.scope || t, t.args || [++t.taskRunCount]);
+	                t.taskRunTime = now;
+	                if(rt === false || t.taskRunCount === t.repeat){
+	                    removeTask(t);
+	                    return;
+	                }
+	            }
+	            if(t.duration && t.duration <= (now - t.taskStartTime)){
+	                removeTask(t);
+	            }
+	        }
+	    };
+
+    /**
+     * Starts a new task.
+     * @method start
+     * @param {Object} task <p>A config object that supports the following properties:<ul>
+     * <li><code>run</code> : Function<div class="sub-desc"><p>The function to execute each time the task is invoked. The
+     * function will be called at each interval and passed the <code>args</code> argument if specified, and the
+     * current invocation count if not.</p>
+     * <p>If a particular scope (<code>this</code> reference) is required, be sure to specify it using the <code>scope</code> argument.</p>
+     * <p>Return <code>false</code> from this function to terminate the task.</p></div></li>
+     * <li><code>interval</code> : Number<div class="sub-desc">The frequency in milliseconds with which the task
+     * should be invoked.</div></li>
+     * <li><code>args</code> : Array<div class="sub-desc">(optional) An array of arguments to be passed to the function
+     * specified by <code>run</code>. If not specified, the current invocation count is passed.</div></li>
+     * <li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<tt>this</tt> reference) in which to execute the
+     * <code>run</code> function. Defaults to the task config object.</div></li>
+     * <li><code>duration</code> : Number<div class="sub-desc">(optional) The length of time in milliseconds to invoke
+     * the task before stopping automatically (defaults to indefinite).</div></li>
+     * <li><code>repeat</code> : Number<div class="sub-desc">(optional) The number of times to invoke the task before
+     * stopping automatically (defaults to indefinite).</div></li>
+     * </ul></p>
+     * <p>Before each invocation, Ext injects the property <code>taskRunCount</code> into the task object so
+     * that calculations based on the repeat count can be performed.</p>
+     * @return {Object} The task
+     */
+    this.start = function(task){
+        tasks.push(task);
+        task.taskStartTime = new Date().getTime();
+        task.taskRunTime = 0;
+        task.taskRunCount = 0;
+        startThread();
+        return task;
+    };
+
+    /**
+     * Stops an existing running task.
+     * @method stop
+     * @param {Object} task The task to stop
+     * @return {Object} The task
+     */
+    this.stop = function(task){
+        removeTask(task);
+        return task;
+    };
+
+    /**
+     * Stops all tasks that are currently running.
+     * @method stopAll
+     */
+    this.stopAll = function(){
+        stopThread();
+        for(var i = 0, len = tasks.length; i < len; i++){
+            if(tasks[i].onStop){
+                tasks[i].onStop();
+            }
+        }
+        tasks = [];
+        removeQueue = [];
+    };
+};
+
+/**
+ * @class Ext.TaskMgr
+ * @extends Ext.util.TaskRunner
+ * A static {@link Ext.util.TaskRunner} instance that can be used to start and stop arbitrary tasks.  See
+ * {@link Ext.util.TaskRunner} for supported methods and task config properties.
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var task = {
+    run: function(){
+        Ext.fly('clock').update(new Date().format('g:i:s A'));
+    },
+    interval: 1000 //1 second
+}
+Ext.TaskMgr.start(task);
+</code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * @singleton
+ */
+Ext.TaskMgr = new Ext.util.TaskRunner();(function(){
+	var libFlyweight;
+	
+	function fly(el) {
+        if (!libFlyweight) {
+            libFlyweight = new Ext.Element.Flyweight();
+        }
+        libFlyweight.dom = el;
+        return libFlyweight;
+    }
+    
+    (function(){
+	var doc = document,
+		isCSS1 = doc.compatMode == "CSS1Compat",
+		MAX = Math.max,		
+        ROUND = Math.round,
+		PARSEINT = parseInt;
+		
+	Ext.lib.Dom = {
+	    isAncestor : function(p, c) {
+		    var ret = false;
+			
+			p = Ext.getDom(p);
+			c = Ext.getDom(c);
+			if (p && c) {
+				if (p.contains) {
+					return p.contains(c);
+				} else if (p.compareDocumentPosition) {
+					return !!(p.compareDocumentPosition(c) & 16);
+				} else {
+					while (c = c.parentNode) {
+						ret = c == p || ret;	        			
+					}
+				}	            
+			}	
+			return ret;
+		},
+		
+        getViewWidth : function(full) {
+            return full ? this.getDocumentWidth() : this.getViewportWidth();
+        },
+
+        getViewHeight : function(full) {
+            return full ? this.getDocumentHeight() : this.getViewportHeight();
+        },
+
+        getDocumentHeight: function() {            
+            return MAX(!isCSS1 ? doc.body.scrollHeight : doc.documentElement.scrollHeight, this.getViewportHeight());
+        },
+
+        getDocumentWidth: function() {            
+            return MAX(!isCSS1 ? doc.body.scrollWidth : doc.documentElement.scrollWidth, this.getViewportWidth());
+        },
+
+        getViewportHeight: function(){
+	        return Ext.isIE ? 
+	        	   (Ext.isStrict ? doc.documentElement.clientHeight : doc.body.clientHeight) :
+	        	   self.innerHeight;
+        },
+
+        getViewportWidth : function() {
+	        return !Ext.isStrict && !Ext.isOpera ? doc.body.clientWidth :
+	        	   Ext.isIE ? doc.documentElement.clientWidth : self.innerWidth;
+        },
+        
+        getY : function(el) {
+            return this.getXY(el)[1];
+        },
+
+        getX : function(el) {
+            return this.getXY(el)[0];
+        },
+
+        getXY : function(el) {
+            var p, 
+            	pe, 
+            	b,
+            	bt, 
+            	bl,     
+            	dbd,       	
+            	x = 0,
+            	y = 0, 
+            	scroll,
+            	hasAbsolute, 
+            	bd = (doc.body || doc.documentElement),
+            	ret = [0,0];
+            	
+            el = Ext.getDom(el);
+
+            if(el != bd){
+	            if (el.getBoundingClientRect) {
+	                b = el.getBoundingClientRect();
+	                scroll = fly(document).getScroll();
+	                ret = [ROUND(b.left + scroll.left), ROUND(b.top + scroll.top)];
+	            } else {  
+		            p = el;		
+		            hasAbsolute = fly(el).isStyle("position", "absolute");
+		
+		            while (p) {
+			            pe = fly(p);		
+		                x += p.offsetLeft;
+		                y += p.offsetTop;
+		
+		                hasAbsolute = hasAbsolute || pe.isStyle("position", "absolute");
+		                		
+		                if (Ext.isGecko) {		                    
+		                    y += bt = PARSEINT(pe.getStyle("borderTopWidth"), 10) || 0;
+		                    x += bl = PARSEINT(pe.getStyle("borderLeftWidth"), 10) || 0;	
+		
+		                    if (p != el && !pe.isStyle('overflow','visible')) {
+		                        x += bl;
+		                        y += bt;
+		                    }
+		                }
+		                p = p.offsetParent;
+		            }
+		
+		            if (Ext.isSafari && hasAbsolute) {
+		                x -= bd.offsetLeft;
+		                y -= bd.offsetTop;
+		            }
+		
+		            if (Ext.isGecko && !hasAbsolute) {
+		                dbd = fly(bd);
+		                x += PARSEINT(dbd.getStyle("borderLeftWidth"), 10) || 0;
+		                y += PARSEINT(dbd.getStyle("borderTopWidth"), 10) || 0;
+		            }
+		
+		            p = el.parentNode;
+		            while (p && p != bd) {
+		                if (!Ext.isOpera || (p.tagName != 'TR' && !fly(p).isStyle("display", "inline"))) {
+		                    x -= p.scrollLeft;
+		                    y -= p.scrollTop;
+		                }
+		                p = p.parentNode;
+		            }
+		            ret = [x,y];
+	            }
+         	}
+            return ret;
+        },
+
+        setXY : function(el, xy) {
+            (el = Ext.fly(el, '_setXY')).position();
+            
+            var pts = el.translatePoints(xy),
+            	style = el.dom.style,
+            	pos;            	
+            
+            for (pos in pts) {	            
+	            if (!isNaN(pts[pos])) {
+	                style[pos] = pts[pos] + "px";
+                }
+            }
+        },
+
+        setX : function(el, x) {
+            this.setXY(el, [x, false]);
+        },
+
+        setY : function(el, y) {
+            this.setXY(el, [false, y]);
+        }
+    };
+})();Ext.lib.Event = function() {
+    var loadComplete = false,
+        unloadListeners = {},
+        retryCount = 0,
+        onAvailStack = [],
+        _interval,
+        locked = false,
+        win = window,
+        doc = document,
+
+        // constants
+        POLL_RETRYS = 200,
+        POLL_INTERVAL = 20,
+        TYPE = 0,
+        FN = 1,
+        OBJ = 2,
+        ADJ_SCOPE = 3,
+        SCROLLLEFT = 'scrollLeft',
+        SCROLLTOP = 'scrollTop',
+        UNLOAD = 'unload',
+        MOUSEOVER = 'mouseover',
+        MOUSEOUT = 'mouseout',
+        // private
+        doAdd = function() {
+            var ret;
+            if (win.addEventListener) {
+                ret = function(el, eventName, fn, capture) {
+                    if (eventName == 'mouseenter') {
+                        fn = fn.createInterceptor(checkRelatedTarget);
+                        el.addEventListener(MOUSEOVER, fn, (capture));
+                    } else if (eventName == 'mouseleave') {
+                        fn = fn.createInterceptor(checkRelatedTarget);
+                        el.addEventListener(MOUSEOUT, fn, (capture));
+                    } else {
+                        el.addEventListener(eventName, fn, (capture));
+                    }
+                    return fn;
+                };
+            } else if (win.attachEvent) {
+                ret = function(el, eventName, fn, capture) {
+                    el.attachEvent("on" + eventName, fn);
+                    return fn;
+                };
+            } else {
+                ret = function(){};
+            }
+            return ret;
+        }(),
+        // private
+        doRemove = function(){
+            var ret;
+            if (win.removeEventListener) {
+                ret = function (el, eventName, fn, capture) {
+                    if (eventName == 'mouseenter') {
+                        eventName = MOUSEOVER;
+                    } else if (eventName == 'mouseleave') {
+                        eventName = MOUSEOUT;
+                    }
+                    el.removeEventListener(eventName, fn, (capture));
+                };
+            } else if (win.detachEvent) {
+                ret = function (el, eventName, fn) {
+                    el.detachEvent("on" + eventName, fn);
+                };
+            } else {
+                ret = function(){};
+            }
+            return ret;
+        }();
+
+    function checkRelatedTarget(e) {
+        return !elContains(e.currentTarget, pub.getRelatedTarget(e));
+    }
+
+    function elContains(parent, child) {
+       if(parent && parent.firstChild){
+         while(child) {
+            if(child === parent) {
+                return true;
+            }
+            child = child.parentNode;
+            if(child && (child.nodeType != 1)) {
+                child = null;
+            }
+          }
+        }
+        return false;
+    }
+
+    // private
+    function _tryPreloadAttach() {
+        var ret = false,
+            notAvail = [],
+            element, i, v, override,
+            tryAgain = !loadComplete || (retryCount > 0);
+
+        if(!locked){
+            locked = true;
+            
+            for(i = 0; i < onAvailStack.length; ++i){
+                v = onAvailStack[i];
+                if(v && (element = doc.getElementById(v.id))){
+                    if(!v.checkReady || loadComplete || element.nextSibling || (doc && doc.body)) {
+                        override = v.override;
+                        element = override ? (override === true ? v.obj : override) : element;
+                        v.fn.call(element, v.obj);
+                        onAvailStack.remove(v);
+                        --i;
+                    }else{
+                        notAvail.push(v);
+                    }
+                }
+            }
+
+            retryCount = (notAvail.length === 0) ? 0 : retryCount - 1;
+
+            if (tryAgain) {
+                startInterval();
+            } else {
+                clearInterval(_interval);
+                _interval = null;
+            }
+            ret = !(locked = false);
+        }
+        return ret;
+    }
+
+    // private
+    function startInterval() {
+        if(!_interval){
+            var callback = function() {
+                _tryPreloadAttach();
+            };
+            _interval = setInterval(callback, POLL_INTERVAL);
+        }
+    }
+
+    // private
+    function getScroll() {
+        var dd = doc.documentElement,
+            db = doc.body;
+        if(dd && (dd[SCROLLTOP] || dd[SCROLLLEFT])){
+            return [dd[SCROLLLEFT], dd[SCROLLTOP]];
+        }else if(db){
+            return [db[SCROLLLEFT], db[SCROLLTOP]];
+        }else{
+            return [0, 0];
+        }
+    }
+
+    // private
+    function getPageCoord (ev, xy) {
+        ev = ev.browserEvent || ev;
+        var coord  = ev['page' + xy];
+        if (!coord && coord !== 0) {
+            coord = ev['client' + xy] || 0;
+
+            if (Ext.isIE) {
+                coord += getScroll()[xy == "X" ? 0 : 1];
+            }
+        }
+
+        return coord;
+    }
+
+    var pub =  {
+        extAdapter: true,
+        onAvailable : function(p_id, p_fn, p_obj, p_override) {
+            onAvailStack.push({
+                id:         p_id,
+                fn:         p_fn,
+                obj:        p_obj,
+                override:   p_override,
+                checkReady: false });
+
+            retryCount = POLL_RETRYS;
+            startInterval();
+        },
+
+        // This function should ALWAYS be called from Ext.EventManager
+        addListener: function(el, eventName, fn) {
+            el = Ext.getDom(el);
+            if (el && fn) {
+                if (eventName == UNLOAD) {
+                    if (unloadListeners[el.id] === undefined) {
+                        unloadListeners[el.id] = [];
+                    }
+                    unloadListeners[el.id].push([eventName, fn]);
+                    return fn;
+                }
+                return doAdd(el, eventName, fn, false);
+            }
+            return false;
+        },
+
+        // This function should ALWAYS be called from Ext.EventManager
+        removeListener: function(el, eventName, fn) {
+            el = Ext.getDom(el);
+            var i, len, li, lis;
+            if (el && fn) {
+                if(eventName == UNLOAD){
+                    if((lis = unloadListeners[el.id]) !== undefined){
+                        for(i = 0, len = lis.length; i < len; i++){
+                            if((li = lis[i]) && li[TYPE] == eventName && li[FN] == fn){
+                                unloadListeners[el.id].splice(i, 1);
+                            }
+                        }
+                    }
+                    return;
+                }
+                doRemove(el, eventName, fn, false);
+            }
+        },
+
+        getTarget : function(ev) {
+            ev = ev.browserEvent || ev;
+            return this.resolveTextNode(ev.target || ev.srcElement);
+        },
+
+        resolveTextNode : Ext.isGecko ? function(node){
+            if(!node){
+                return;
+            }
+            // work around firefox bug, https://bugzilla.mozilla.org/show_bug.cgi?id=101197
+            var s = HTMLElement.prototype.toString.call(node);
+            if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+                return;
+            }
+            return node.nodeType == 3 ? node.parentNode : node;
+        } : function(node){
+            return node && node.nodeType == 3 ? node.parentNode : node;
+        },
+
+        getRelatedTarget : function(ev) {
+            ev = ev.browserEvent || ev;
+            return this.resolveTextNode(ev.relatedTarget ||
+                (/(mouseout|mouseleave)/.test(ev.type) ? ev.toElement :
+                 /(mouseover|mouseenter)/.test(ev.type) ? ev.fromElement : null));
+        },
+
+        getPageX : function(ev) {
+            return getPageCoord(ev, "X");
+        },
+
+        getPageY : function(ev) {
+            return getPageCoord(ev, "Y");
+        },
+
+
+        getXY : function(ev) {
+            return [this.getPageX(ev), this.getPageY(ev)];
+        },
+
+        stopEvent : function(ev) {
+            this.stopPropagation(ev);
+            this.preventDefault(ev);
+        },
+
+        stopPropagation : function(ev) {
+            ev = ev.browserEvent || ev;
+            if (ev.stopPropagation) {
+                ev.stopPropagation();
+            } else {
+                ev.cancelBubble = true;
+            }
+        },
+
+        preventDefault : function(ev) {
+            ev = ev.browserEvent || ev;
+            if (ev.preventDefault) {
+                ev.preventDefault();
+            } else {
+                if (ev.keyCode) {
+                    ev.keyCode = 0;
+                }
+                ev.returnValue = false;
+            }
+        },
+
+        getEvent : function(e) {
+            e = e || win.event;
+            if (!e) {
+                var c = this.getEvent.caller;
+                while (c) {
+                    e = c.arguments[0];
+                    if (e && Event == e.constructor) {
+                        break;
+                    }
+                    c = c.caller;
+                }
+            }
+            return e;
+        },
+
+        getCharCode : function(ev) {
+            ev = ev.browserEvent || ev;
+            return ev.charCode || ev.keyCode || 0;
+        },
+
+        //clearCache: function() {},
+        // deprecated, call from EventManager
+        getListeners : function(el, eventName) {
+            Ext.EventManager.getListeners(el, eventName);
+        },
+
+        // deprecated, call from EventManager
+        purgeElement : function(el, recurse, eventName) {
+            Ext.EventManager.purgeElement(el, recurse, eventName);
+        },
+
+        _load : function(e) {
+            loadComplete = true;
+            
+            if (Ext.isIE && e !== true) {
+                // IE8 complains that _load is null or not an object
+                // so lets remove self via arguments.callee
+                doRemove(win, "load", arguments.callee);
+            }
+        },
+
+        _unload : function(e) {
+             var EU = Ext.lib.Event,
+                i, v, ul, id, len, scope;
+
+            for (id in unloadListeners) {
+                ul = unloadListeners[id];
+                for (i = 0, len = ul.length; i < len; i++) {
+                    v = ul[i];
+                    if (v) {
+                        try{
+                            scope = v[ADJ_SCOPE] ? (v[ADJ_SCOPE] === true ? v[OBJ] : v[ADJ_SCOPE]) :  win;
+                            v[FN].call(scope, EU.getEvent(e), v[OBJ]);
+                        }catch(ex){}
+                    }
+                }
+            };
+
+            Ext.EventManager._unload();
+
+            doRemove(win, UNLOAD, EU._unload);
+        }
+    };
+
+    // Initialize stuff.
+    pub.on = pub.addListener;
+    pub.un = pub.removeListener;
+    if (doc && doc.body) {
+        pub._load(true);
+    } else {
+        doAdd(win, "load", pub._load);
+    }
+    doAdd(win, UNLOAD, pub._unload);
+    _tryPreloadAttach();
+
+    return pub;
+}();
+/*
+* Portions of this file are based on pieces of Yahoo User Interface Library
+* Copyright (c) 2007, Yahoo! Inc. All rights reserved.
+* YUI licensed under the BSD License:
+* http://developer.yahoo.net/yui/license.txt
+*/
+Ext.lib.Ajax = function() {
+    var activeX = ['Msxml2.XMLHTTP.6.0',
+                   'Msxml2.XMLHTTP.3.0',
+                   'Msxml2.XMLHTTP'],
+        CONTENTTYPE = 'Content-Type';
+
+    // private
+    function setHeader(o) {
+        var conn = o.conn,
+            prop,
+            headers = {};
+
+        function setTheHeaders(conn, headers){
+            for (prop in headers) {
+                if (headers.hasOwnProperty(prop)) {
+                    conn.setRequestHeader(prop, headers[prop]);
+                }
+            }
+        }
+
+        Ext.apply(headers, pub.headers, pub.defaultHeaders);
+        setTheHeaders(conn, headers);
+        delete pub.headers;
+    }
+
+    // private
+    function createExceptionObject(tId, callbackArg, isAbort, isTimeout) {
+        return {
+            tId : tId,
+            status : isAbort ? -1 : 0,
+            statusText : isAbort ? 'transaction aborted' : 'communication failure',
+            isAbort: isAbort,
+            isTimeout: isTimeout,
+            argument : callbackArg
+        };
+    }
+
+    // private
+    function initHeader(label, value) {
+        (pub.headers = pub.headers || {})[label] = value;
+    }
+
+    // private
+    function createResponseObject(o, callbackArg) {
+        var headerObj = {},
+            headerStr,
+            conn = o.conn,
+            t,
+            s,
+            // see: https://prototype.lighthouseapp.com/projects/8886/tickets/129-ie-mangles-http-response-status-code-204-to-1223
+            isBrokenStatus = conn.status == 1223;
+
+        try {
+            headerStr = o.conn.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            tId : o.tId,
+            // Normalize the status and statusText when IE returns 1223, see the above link.
+            status : isBrokenStatus ? 204 : conn.status,
+            statusText : isBrokenStatus ? 'No Content' : conn.statusText,
+            getResponseHeader : function(header){return headerObj[header.toLowerCase()];},
+            getAllResponseHeaders : function(){return headerStr;},
+            responseText : conn.responseText,
+            responseXML : conn.responseXML,
+            argument : callbackArg
+        };
+    }
+
+    // private
+    function releaseObject(o) {
+        if (o.tId) {
+            pub.conn[o.tId] = null;
+        }
+        o.conn = null;
+        o = null;
+    }
+
+    // private
+    function handleTransactionResponse(o, callback, isAbort, isTimeout) {
+        if (!callback) {
+            releaseObject(o);
+            return;
+        }
+
+        var httpStatus, responseObject;
+
+        try {
+            if (o.conn.status !== undefined && o.conn.status != 0) {
+                httpStatus = o.conn.status;
+            }
+            else {
+                httpStatus = 13030;
+            }
+        }
+        catch(e) {
+            httpStatus = 13030;
+        }
+
+        if ((httpStatus >= 200 && httpStatus < 300) || (Ext.isIE && httpStatus == 1223)) {
+            responseObject = createResponseObject(o, callback.argument);
+            if (callback.success) {
+                if (!callback.scope) {
+                    callback.success(responseObject);
+                }
+                else {
+                    callback.success.apply(callback.scope, [responseObject]);
+                }
+            }
+        }
+        else {
+            switch (httpStatus) {
+                case 12002:
+                case 12029:
+                case 12030:
+                case 12031:
+                case 12152:
+                case 13030:
+                    responseObject = createExceptionObject(o.tId, callback.argument, (isAbort ? isAbort : false), isTimeout);
+                    if (callback.failure) {
+                        if (!callback.scope) {
+                            callback.failure(responseObject);
+                        }
+                        else {
+                            callback.failure.apply(callback.scope, [responseObject]);
+                        }
+                    }
+                    break;
+                default:
+                    responseObject = createResponseObject(o, callback.argument);
+                    if (callback.failure) {
+                        if (!callback.scope) {
+                            callback.failure(responseObject);
+                        }
+                        else {
+                            callback.failure.apply(callback.scope, [responseObject]);
+                        }
+                    }
+            }
+        }
+
+        releaseObject(o);
+        responseObject = null;
+    }
+    
+    function checkResponse(o, callback, conn, tId, poll, cbTimeout){
+        if (conn && conn.readyState == 4) {
+            clearInterval(poll[tId]);
+            poll[tId] = null;
+
+            if (cbTimeout) {
+                clearTimeout(pub.timeout[tId]);
+                pub.timeout[tId] = null;
+            }
+            handleTransactionResponse(o, callback);
+        }
+    }
+    
+    function checkTimeout(o, callback){
+        pub.abort(o, callback, true);
+    }
+    
+
+    // private
+    function handleReadyState(o, callback){
+        callback = callback || {};
+        var conn = o.conn,
+            tId = o.tId,
+            poll = pub.poll,
+            cbTimeout = callback.timeout || null;
+
+        if (cbTimeout) {
+            pub.conn[tId] = conn;
+            pub.timeout[tId] = setTimeout(checkTimeout.createCallback(o, callback), cbTimeout);
+        }
+        poll[tId] = setInterval(checkResponse.createCallback(o, callback, conn, tId, poll, cbTimeout), pub.pollInterval);
+    }
+
+    // private
+    function asyncRequest(method, uri, callback, postData) {
+        var o = getConnectionObject() || null;
+
+        if (o) {
+            o.conn.open(method, uri, true);
+
+            if (pub.useDefaultXhrHeader) {
+                initHeader('X-Requested-With', pub.defaultXhrHeader);
+            }
+
+            if(postData && pub.useDefaultHeader && (!pub.headers || !pub.headers[CONTENTTYPE])){
+                initHeader(CONTENTTYPE, pub.defaultPostHeader);
+            }
+
+            if (pub.defaultHeaders || pub.headers) {
+                setHeader(o);
+            }
+
+            handleReadyState(o, callback);
+            o.conn.send(postData || null);
+        }
+        return o;
+    }
+
+    // private
+    function getConnectionObject() {
+        var o;
+
+        try {
+            if (o = createXhrObject(pub.transactionId)) {
+                pub.transactionId++;
+            }
+        } catch(e) {
+        } finally {
+            return o;
+        }
+    }
+
+    // private
+    function createXhrObject(transactionId) {
+        var http;
+
+        try {
+            http = new XMLHttpRequest();
+        } catch(e) {
+            for (var i = Ext.isIE6 ? 1 : 0; i < activeX.length; ++i) {
+                try {
+                    http = new ActiveXObject(activeX[i]);
+                    break;
+                } catch(e) {}
+            }
+        } finally {
+            return {conn : http, tId : transactionId};
+        }
+    }
+
+    var pub = {
+        request : function(method, uri, cb, data, options) {
+            if(options){
+                var me = this,
+                    xmlData = options.xmlData,
+                    jsonData = options.jsonData,
+                    hs;
+
+                Ext.applyIf(me, options);
+
+                if(xmlData || jsonData){
+                    hs = me.headers;
+                    if(!hs || !hs[CONTENTTYPE]){
+                        initHeader(CONTENTTYPE, xmlData ? 'text/xml' : 'application/json');
+                    }
+                    data = xmlData || (!Ext.isPrimitive(jsonData) ? Ext.encode(jsonData) : jsonData);
+                }
+            }
+            return asyncRequest(method || options.method || "POST", uri, cb, data);
+        },
+
+        serializeForm : function(form) {
+            var fElements = form.elements || (document.forms[form] || Ext.getDom(form)).elements, 
+                hasSubmit = false, 
+                encoder = encodeURIComponent, 
+                name, 
+                data = '', 
+                type, 
+                hasValue;
+    
+            Ext.each(fElements, function(element){
+                name = element.name;
+                type = element.type;
+        
+                if (!element.disabled && name) {
+                    if (/select-(one|multiple)/i.test(type)) {
+                        Ext.each(element.options, function(opt){
+                            if (opt.selected) {
+                                hasValue = opt.hasAttribute ? opt.hasAttribute('value') : opt.getAttributeNode('value').specified;
+                                data += String.format("{0}={1}&", encoder(name), encoder(hasValue ? opt.value : opt.text));
+                            }
+                        });
+                    } else if (!(/file|undefined|reset|button/i.test(type))) {
+                        if (!(/radio|checkbox/i.test(type) && !element.checked) && !(type == 'submit' && hasSubmit)) {
+                            data += encoder(name) + '=' + encoder(element.value) + '&';
+                            hasSubmit = /submit/i.test(type);
+                        }
+                    }
+                }
+            });
+            return data.substr(0, data.length - 1);
+        },
+
+        useDefaultHeader : true,
+        defaultPostHeader : 'application/x-www-form-urlencoded; charset=UTF-8',
+        useDefaultXhrHeader : true,
+        defaultXhrHeader : 'XMLHttpRequest',
+        poll : {},
+        timeout : {},
+        conn: {},
+        pollInterval : 50,
+        transactionId : 0,
+
+//  This is never called - Is it worth exposing this?
+//          setProgId : function(id) {
+//              activeX.unshift(id);
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setDefaultPostHeader : function(b) {
+//              this.useDefaultHeader = b;
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setDefaultXhrHeader : function(b) {
+//              this.useDefaultXhrHeader = b;
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setPollingInterval : function(i) {
+//              if (typeof i == 'number' && isFinite(i)) {
+//                  this.pollInterval = i;
+//              }
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          resetDefaultHeaders : function() {
+//              this.defaultHeaders = null;
+//          },
+
+        abort : function(o, callback, isTimeout) {
+            var me = this,
+                tId = o.tId,
+                isAbort = false;
+
+            if (me.isCallInProgress(o)) {
+                o.conn.abort();
+                clearInterval(me.poll[tId]);
+                me.poll[tId] = null;
+                clearTimeout(pub.timeout[tId]);
+                me.timeout[tId] = null;
+
+                handleTransactionResponse(o, callback, (isAbort = true), isTimeout);
+            }
+            return isAbort;
+        },
+
+        isCallInProgress : function(o) {
+            // if there is a connection and readyState is not 0 or 4
+            return o.conn && !{0:true,4:true}[o.conn.readyState];
+        }
+    };
+    return pub;
+}();(function(){
+    var EXTLIB = Ext.lib,
+        noNegatives = /width|height|opacity|padding/i,
+        offsetAttribute = /^((width|height)|(top|left))$/,
+        defaultUnit = /width|height|top$|bottom$|left$|right$/i,
+        offsetUnit =  /\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i,
+        isset = function(v){
+            return typeof v !== 'undefined';
+        },
+        now = function(){
+            return new Date();
+        };
+
+    EXTLIB.Anim = {
+        motion : function(el, args, duration, easing, cb, scope) {
+            return this.run(el, args, duration, easing, cb, scope, Ext.lib.Motion);
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type) {
+            type = type || Ext.lib.AnimBase;
+            if (typeof easing == "string") {
+                easing = Ext.lib.Easing[easing];
+            }
+            var anim = new type(el, args, duration, easing);
+            anim.animateX(function() {
+                if(Ext.isFunction(cb)){
+                    cb.call(scope);
+                }
+            });
+            return anim;
+        }
+    };
+
+    EXTLIB.AnimBase = function(el, attributes, duration, method) {
+        if (el) {
+            this.init(el, attributes, duration, method);
+        }
+    };
+
+    EXTLIB.AnimBase.prototype = {
+        doMethod: function(attr, start, end) {
+            var me = this;
+            return me.method(me.curFrame, start, end - start, me.totalFrames);
+        },
+
+
+        setAttr: function(attr, val, unit) {
+            if (noNegatives.test(attr) && val < 0) {
+                val = 0;
+            }
+            Ext.fly(this.el, '_anim').setStyle(attr, val + unit);
+        },
+
+
+        getAttr: function(attr) {
+            var el = Ext.fly(this.el),
+                val = el.getStyle(attr),
+                a = offsetAttribute.exec(attr) || [];
+
+            if (val !== 'auto' && !offsetUnit.test(val)) {
+                return parseFloat(val);
+            }
+
+            return (!!(a[2]) || (el.getStyle('position') == 'absolute' && !!(a[3]))) ? el.dom['offset' + a[0].charAt(0).toUpperCase() + a[0].substr(1)] : 0;
+        },
+
+
+        getDefaultUnit: function(attr) {
+            return defaultUnit.test(attr) ? 'px' : '';
+        },
+
+        animateX : function(callback, scope) {
+            var me = this,
+                f = function() {
+                me.onComplete.removeListener(f);
+                if (Ext.isFunction(callback)) {
+                    callback.call(scope || me, me);
+                }
+            };
+            me.onComplete.addListener(f, me);
+            me.animate();
+        },
+
+
+        setRunAttr: function(attr) {
+            var me = this,
+                a = this.attributes[attr],
+                to = a.to,
+                by = a.by,
+                from = a.from,
+                unit = a.unit,
+                ra = (this.runAttrs[attr] = {}),
+                end;
+
+            if (!isset(to) && !isset(by)){
+                return false;
+            }
+
+            var start = isset(from) ? from : me.getAttr(attr);
+            if (isset(to)) {
+                end = to;
+            }else if(isset(by)) {
+                if (Ext.isArray(start)){
+                    end = [];
+                    for(var i=0,len=start.length; i<len; i++) {
+                        end[i] = start[i] + by[i];
+                    }
+                }else{
+                    end = start + by;
+                }
+            }
+
+            Ext.apply(ra, {
+                start: start,
+                end: end,
+                unit: isset(unit) ? unit : me.getDefaultUnit(attr)
+            });
+        },
+
+
+        init: function(el, attributes, duration, method) {
+            var me = this,
+                actualFrames = 0,
+                mgr = EXTLIB.AnimMgr;
+
+            Ext.apply(me, {
+                isAnimated: false,
+                startTime: null,
+                el: Ext.getDom(el),
+                attributes: attributes || {},
+                duration: duration || 1,
+                method: method || EXTLIB.Easing.easeNone,
+                useSec: true,
+                curFrame: 0,
+                totalFrames: mgr.fps,
+                runAttrs: {},
+                animate: function(){
+                    var me = this,
+                        d = me.duration;
+
+                    if(me.isAnimated){
+                        return false;
+                    }
+
+                    me.curFrame = 0;
+                    me.totalFrames = me.useSec ? Math.ceil(mgr.fps * d) : d;
+                    mgr.registerElement(me);
+                },
+
+                stop: function(finish){
+                    var me = this;
+
+                    if(finish){
+                        me.curFrame = me.totalFrames;
+                        me._onTween.fire();
+                    }
+                    mgr.stop(me);
+                }
+            });
+
+            var onStart = function(){
+                var me = this,
+                    attr;
+
+                me.onStart.fire();
+                me.runAttrs = {};
+                for(attr in this.attributes){
+                    this.setRunAttr(attr);
+                }
+
+                me.isAnimated = true;
+                me.startTime = now();
+                actualFrames = 0;
+            };
+
+
+            var onTween = function(){
+                var me = this;
+
+                me.onTween.fire({
+                    duration: now() - me.startTime,
+                    curFrame: me.curFrame
+                });
+
+                var ra = me.runAttrs;
+                for (var attr in ra) {
+                    this.setAttr(attr, me.doMethod(attr, ra[attr].start, ra[attr].end), ra[attr].unit);
+                }
+
+                ++actualFrames;
+            };
+
+            var onComplete = function() {
+                var me = this,
+                    actual = (now() - me.startTime) / 1000,
+                    data = {
+                        duration: actual,
+                        frames: actualFrames,
+                        fps: actualFrames / actual
+                    };
+
+                me.isAnimated = false;
+                actualFrames = 0;
+                me.onComplete.fire(data);
+            };
+
+            me.onStart = new Ext.util.Event(me);
+            me.onTween = new Ext.util.Event(me);
+            me.onComplete = new Ext.util.Event(me);
+            (me._onStart = new Ext.util.Event(me)).addListener(onStart);
+            (me._onTween = new Ext.util.Event(me)).addListener(onTween);
+            (me._onComplete = new Ext.util.Event(me)).addListener(onComplete);
+        }
+    };
+
+
+    Ext.lib.AnimMgr = new function() {
+        var me = this,
+            thread = null,
+            queue = [],
+            tweenCount = 0;
+
+
+        Ext.apply(me, {
+            fps: 1000,
+            delay: 1,
+            registerElement: function(tween){
+                queue.push(tween);
+                ++tweenCount;
+                tween._onStart.fire();
+                me.start();
+            },
+
+            unRegister: function(tween, index){
+                tween._onComplete.fire();
+                index = index || getIndex(tween);
+                if (index != -1) {
+                    queue.splice(index, 1);
+                }
+
+                if (--tweenCount <= 0) {
+                    me.stop();
+                }
+            },
+
+            start: function(){
+                if(thread === null){
+                    thread = setInterval(me.run, me.delay);
+                }
+            },
+
+            stop: function(tween){
+                if(!tween){
+                    clearInterval(thread);
+                    for(var i = 0, len = queue.length; i < len; ++i){
+                        if(queue[0].isAnimated){
+                            me.unRegister(queue[0], 0);
+                        }
+                    }
+
+                    queue = [];
+                    thread = null;
+                    tweenCount = 0;
+                }else{
+                    me.unRegister(tween);
+                }
+            },
+
+            run: function(){
+                var tf, i, len, tween;
+                for(i = 0, len = queue.length; i<len; i++) {
+                    tween = queue[i];
+                    if(tween && tween.isAnimated){
+                        tf = tween.totalFrames;
+                        if(tween.curFrame < tf || tf === null){
+                            ++tween.curFrame;
+                            if(tween.useSec){
+                                correctFrame(tween);
+                            }
+                            tween._onTween.fire();
+                        }else{
+                            me.stop(tween);
+                        }
+                    }
+                }
+            }
+        });
+
+        var getIndex = function(anim) {
+            var i, len;
+            for(i = 0, len = queue.length; i<len; i++) {
+                if(queue[i] === anim) {
+                    return i;
+                }
+            }
+            return -1;
+        };
+
+        var correctFrame = function(tween) {
+            var frames = tween.totalFrames,
+                frame = tween.curFrame,
+                duration = tween.duration,
+                expected = (frame * duration * 1000 / frames),
+                elapsed = (now() - tween.startTime),
+                tweak = 0;
+
+            if(elapsed < duration * 1000){
+                tweak = Math.round((elapsed / expected - 1) * frame);
+            }else{
+                tweak = frames - (frame + 1);
+            }
+            if(tweak > 0 && isFinite(tweak)){
+                if(tween.curFrame + tweak >= frames){
+                    tweak = frames - (frame + 1);
+                }
+                tween.curFrame += tweak;
+            }
+        };
+    };
+
+    EXTLIB.Bezier = new function() {
+
+        this.getPosition = function(points, t) {
+            var n = points.length,
+                tmp = [],
+                c = 1 - t,
+                i,
+                j;
+
+            for (i = 0; i < n; ++i) {
+                tmp[i] = [points[i][0], points[i][1]];
+            }
+
+            for (j = 1; j < n; ++j) {
+                for (i = 0; i < n - j; ++i) {
+                    tmp[i][0] = c * tmp[i][0] + t * tmp[parseInt(i + 1, 10)][0];
+                    tmp[i][1] = c * tmp[i][1] + t * tmp[parseInt(i + 1, 10)][1];
+                }
+            }
+
+            return [ tmp[0][0], tmp[0][1] ];
+
+        };
+    };
+
+
+    EXTLIB.Easing = {
+        easeNone: function (t, b, c, d) {
+            return c * t / d + b;
+        },
+
+
+        easeIn: function (t, b, c, d) {
+            return c * (t /= d) * t + b;
+        },
+
+
+        easeOut: function (t, b, c, d) {
+            return -c * (t /= d) * (t - 2) + b;
+        }
+    };
+
+    (function() {
+        EXTLIB.Motion = function(el, attributes, duration, method) {
+            if (el) {
+                EXTLIB.Motion.superclass.constructor.call(this, el, attributes, duration, method);
+            }
+        };
+
+        Ext.extend(EXTLIB.Motion, Ext.lib.AnimBase);
+
+        var superclass = EXTLIB.Motion.superclass,
+            pointsRe = /^points$/i;
+
+        Ext.apply(EXTLIB.Motion.prototype, {
+            setAttr: function(attr, val, unit){
+                var me = this,
+                    setAttr = superclass.setAttr;
+
+                if (pointsRe.test(attr)) {
+                    unit = unit || 'px';
+                    setAttr.call(me, 'left', val[0], unit);
+                    setAttr.call(me, 'top', val[1], unit);
+                } else {
+                    setAttr.call(me, attr, val, unit);
+                }
+            },
+
+            getAttr: function(attr){
+                var me = this,
+                    getAttr = superclass.getAttr;
+
+                return pointsRe.test(attr) ? [getAttr.call(me, 'left'), getAttr.call(me, 'top')] : getAttr.call(me, attr);
+            },
+
+            doMethod: function(attr, start, end){
+                var me = this;
+
+                return pointsRe.test(attr)
+                        ? EXTLIB.Bezier.getPosition(me.runAttrs[attr], me.method(me.curFrame, 0, 100, me.totalFrames) / 100)
+                        : superclass.doMethod.call(me, attr, start, end);
+            },
+
+            setRunAttr: function(attr){
+                if(pointsRe.test(attr)){
+
+                    var me = this,
+                        el = this.el,
+                        points = this.attributes.points,
+                        control = points.control || [],
+                        from = points.from,
+                        to = points.to,
+                        by = points.by,
+                        DOM = EXTLIB.Dom,
+                        start,
+                        i,
+                        end,
+                        len,
+                        ra;
+
+
+                    if(control.length > 0 && !Ext.isArray(control[0])){
+                        control = [control];
+                    }else{
+                        /*
+                        var tmp = [];
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            tmp[i] = control[i];
+                        }
+                        control = tmp;
+                        */
+                    }
+
+                    Ext.fly(el, '_anim').position();
+                    DOM.setXY(el, isset(from) ? from : DOM.getXY(el));
+                    start = me.getAttr('points');
+
+
+                    if(isset(to)){
+                        end = translateValues.call(me, to, start);
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            control[i] = translateValues.call(me, control[i], start);
+                        }
+                    } else if (isset(by)) {
+                        end = [start[0] + by[0], start[1] + by[1]];
+
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            control[i] = [ start[0] + control[i][0], start[1] + control[i][1] ];
+                        }
+                    }
+
+                    ra = this.runAttrs[attr] = [start];
+                    if (control.length > 0) {
+                        ra = ra.concat(control);
+                    }
+
+                    ra[ra.length] = end;
+                }else{
+                    superclass.setRunAttr.call(this, attr);
+                }
+            }
+        });
+
+        var translateValues = function(val, start) {
+            var pageXY = EXTLIB.Dom.getXY(this.el);
+            return [val[0] - pageXY[0] + start[0], val[1] - pageXY[1] + start[1]];
+        };
+    })();
+})();// Easing functions
+(function(){
+    // shortcuts to aid compression
+    var abs = Math.abs,
+        pi = Math.PI,
+        asin = Math.asin,
+        pow = Math.pow,
+        sin = Math.sin,
+        EXTLIB = Ext.lib;
+
+    Ext.apply(EXTLIB.Easing, {
+
+        easeBoth: function (t, b, c, d) {
+            return ((t /= d / 2) < 1)  ?  c / 2 * t * t + b  :  -c / 2 * ((--t) * (t - 2) - 1) + b;
+        },
+
+        easeInStrong: function (t, b, c, d) {
+            return c * (t /= d) * t * t * t + b;
+        },
+
+        easeOutStrong: function (t, b, c, d) {
+            return -c * ((t = t / d - 1) * t * t * t - 1) + b;
+        },
+
+        easeBothStrong: function (t, b, c, d) {
+            return ((t /= d / 2) < 1)  ?  c / 2 * t * t * t * t + b  :  -c / 2 * ((t -= 2) * t * t * t - 2) + b;
+        },
+
+        elasticIn: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d) == 1) {
+                return t == 0 ? b : b + c;
+            }
+            p = p || (d * .3);
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return -(a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b;
+
+        },
+
+        elasticOut: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d) == 1) {
+                return t == 0 ? b : b + c;
+            }
+            p = p || (d * .3);
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return a * pow(2, -10 * t) * sin((t * d - s) * (2 * pi) / p) + c + b;
+        },
+
+        elasticBoth: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d / 2) == 2) {
+                return t == 0 ? b : b + c;
+            }
+
+            p = p || (d * (.3 * 1.5));
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return t < 1 ?
+                    -.5 * (a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b :
+                    a * pow(2, -10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p) * .5 + c + b;
+        },
+
+        backIn: function (t, b, c, d, s) {
+            s = s ||  1.70158;
+            return c * (t /= d) * t * ((s + 1) * t - s) + b;
+        },
+
+
+        backOut: function (t, b, c, d, s) {
+            if (!s) {
+                s = 1.70158;
+            }
+            return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
+        },
+
+
+        backBoth: function (t, b, c, d, s) {
+            s = s || 1.70158;
+
+            return ((t /= d / 2 ) < 1) ?
+                    c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b :
+                    c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b;
+        },
+
+
+        bounceIn: function (t, b, c, d) {
+            return c - EXTLIB.Easing.bounceOut(d - t, 0, c, d) + b;
+        },
+
+
+        bounceOut: function (t, b, c, d) {
+        if ((t /= d) < (1 / 2.75)) {
+                return c * (7.5625 * t * t) + b;
+            } else if (t < (2 / 2.75)) {
+                return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
+            } else if (t < (2.5 / 2.75)) {
+                return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
+            }
+            return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
+        },
+
+
+        bounceBoth: function (t, b, c, d) {
+            return (t < d / 2) ?
+                    EXTLIB.Easing.bounceIn(t * 2, 0, c, d) * .5 + b :
+                    EXTLIB.Easing.bounceOut(t * 2 - d, 0, c, d) * .5 + c * .5 + b;
+        }
+    });
+})();
+
+(function() {
+    var EXTLIB = Ext.lib;
+    // Color Animation
+    EXTLIB.Anim.color = function(el, args, duration, easing, cb, scope) {
+        return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.ColorAnim);
+    };
+
+    EXTLIB.ColorAnim = function(el, attributes, duration, method) {
+        EXTLIB.ColorAnim.superclass.constructor.call(this, el, attributes, duration, method);
+    };
+
+    Ext.extend(EXTLIB.ColorAnim, EXTLIB.AnimBase);
+
+    var superclass = EXTLIB.ColorAnim.superclass,
+        colorRE = /color$/i,
+        transparentRE = /^transparent|rgba\(0, 0, 0, 0\)$/,
+        rgbRE = /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i,
+        hexRE= /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i,
+        hex3RE = /^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i,
+        isset = function(v){
+            return typeof v !== 'undefined';
+        };
+
+    // private
+    function parseColor(s) {
+        var pi = parseInt,
+            base,
+            out = null,
+            c;
+
+        if (s.length == 3) {
+            return s;
+        }
+
+        Ext.each([hexRE, rgbRE, hex3RE], function(re, idx){
+            base = (idx % 2 == 0) ? 16 : 10;
+            c = re.exec(s);
+            if(c && c.length == 4){
+                out = [pi(c[1], base), pi(c[2], base), pi(c[3], base)];
+                return false;
+            }
+        });
+        return out;
+    }
+
+    Ext.apply(EXTLIB.ColorAnim.prototype, {
+        getAttr : function(attr) {
+            var me = this,
+                el = me.el,
+                val;
+            if(colorRE.test(attr)){
+                while(el && transparentRE.test(val = Ext.fly(el).getStyle(attr))){
+                    el = el.parentNode;
+                    val = "fff";
+                }
+            }else{
+                val = superclass.getAttr.call(me, attr);
+            }
+            return val;
+        },
+
+        doMethod : function(attr, start, end) {
+            var me = this,
+                val,
+                floor = Math.floor,
+                i,
+                len,
+                v;
+
+            if(colorRE.test(attr)){
+                val = [];
+                end = end || [];
+
+                for(i = 0, len = start.length; i < len; i++) {
+                    v = start[i];
+                    val[i] = superclass.doMethod.call(me, attr, v, end[i]);
+                }
+                val = 'rgb(' + floor(val[0]) + ',' + floor(val[1]) + ',' + floor(val[2]) + ')';
+            }else{
+                val = superclass.doMethod.call(me, attr, start, end);
+            }
+            return val;
+        },
+
+        setRunAttr : function(attr) {
+            var me = this,
+                a = me.attributes[attr],
+                to = a.to,
+                by = a.by,
+                ra;
+
+            superclass.setRunAttr.call(me, attr);
+            ra = me.runAttrs[attr];
+            if(colorRE.test(attr)){
+                var start = parseColor(ra.start),
+                    end = parseColor(ra.end);
+
+                if(!isset(to) && isset(by)){
+                    end = parseColor(by);
+                    for(var i=0,len=start.length; i<len; i++) {
+                        end[i] = start[i] + end[i];
+                    }
+                }
+                ra.start = start;
+                ra.end = end;
+            }
+        }
+    });
+})();
+
+
+(function() {
+    // Scroll Animation
+    var EXTLIB = Ext.lib;
+    EXTLIB.Anim.scroll = function(el, args, duration, easing, cb, scope) {
+        return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.Scroll);
+    };
+
+    EXTLIB.Scroll = function(el, attributes, duration, method) {
+        if(el){
+            EXTLIB.Scroll.superclass.constructor.call(this, el, attributes, duration, method);
+        }
+    };
+
+    Ext.extend(EXTLIB.Scroll, EXTLIB.ColorAnim);
+
+    var superclass = EXTLIB.Scroll.superclass,
+        SCROLL = 'scroll';
+
+    Ext.apply(EXTLIB.Scroll.prototype, {
+
+        doMethod : function(attr, start, end) {
+            var val,
+                me = this,
+                curFrame = me.curFrame,
+                totalFrames = me.totalFrames;
+
+            if(attr == SCROLL){
+                val = [me.method(curFrame, start[0], end[0] - start[0], totalFrames),
+                       me.method(curFrame, start[1], end[1] - start[1], totalFrames)];
+            }else{
+                val = superclass.doMethod.call(me, attr, start, end);
+            }
+            return val;
+        },
+
+        getAttr : function(attr) {
+            var me = this;
+
+            if (attr == SCROLL) {
+                return [me.el.scrollLeft, me.el.scrollTop];
+            }else{
+                return superclass.getAttr.call(me, attr);
+            }
+        },
+
+        setAttr : function(attr, val, unit) {
+            var me = this;
+
+            if(attr == SCROLL){
+                me.el.scrollLeft = val[0];
+                me.el.scrollTop = val[1];
+            }else{
+                superclass.setAttr.call(me, attr, val, unit);
+            }
+        }
+    });
+})();	
+	if (Ext.isIE) {
+        function fnCleanUp() {
+            var p = Function.prototype;
+            delete p.createSequence;
+            delete p.defer;
+            delete p.createDelegate;
+            delete p.createCallback;
+            delete p.createInterceptor;
+
+            window.detachEvent("onunload", fnCleanUp);
+        }
+        window.attachEvent("onunload", fnCleanUp);
+    }
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter-debug.js	(revision 76)
@@ -0,0 +1,1846 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// for old browsers
+window.undefined = window.undefined;
+
+/**
+ * @class Ext
+ * Ext core utilities and functions.
+ * @singleton
+ */
+
+Ext = {
+    /**
+     * The version of the framework
+     * @type String
+     */
+    version : '3.4.0',
+    versionDetail : {
+        major : 3,
+        minor : 4,
+        patch : 0
+    }
+};
+
+/**
+ * Copies all the properties of config to obj.
+ * @param {Object} obj The receiver of the properties
+ * @param {Object} config The source of the properties
+ * @param {Object} defaults A different object that will also be applied for default values
+ * @return {Object} returns obj
+ * @member Ext apply
+ */
+Ext.apply = function(o, c, defaults){
+    // no "this" reference for friendly out of scope calls
+    if(defaults){
+        Ext.apply(o, defaults);
+    }
+    if(o && c && typeof c == 'object'){
+        for(var p in c){
+            o[p] = c[p];
+        }
+    }
+    return o;
+};
+
+(function(){
+    var idSeed = 0,
+        toString = Object.prototype.toString,
+        ua = navigator.userAgent.toLowerCase(),
+        check = function(r){
+            return r.test(ua);
+        },
+        DOC = document,
+        docMode = DOC.documentMode,
+        isStrict = DOC.compatMode == "CSS1Compat",
+        isOpera = check(/opera/),
+        isChrome = check(/\bchrome\b/),
+        isWebKit = check(/webkit/),
+        isSafari = !isChrome && check(/safari/),
+        isSafari2 = isSafari && check(/applewebkit\/4/), // unique to Safari 2
+        isSafari3 = isSafari && check(/version\/3/),
+        isSafari4 = isSafari && check(/version\/4/),
+        isIE = !isOpera && check(/msie/),
+        isIE7 = isIE && (check(/msie 7/) || docMode == 7),
+        isIE8 = isIE && (check(/msie 8/) && docMode != 7),
+        isIE9 = isIE && check(/msie 9/),
+        isIE6 = isIE && !isIE7 && !isIE8 && !isIE9,
+        isGecko = !isWebKit && check(/gecko/),
+        isGecko2 = isGecko && check(/rv:1\.8/),
+        isGecko3 = isGecko && check(/rv:1\.9/),
+        isBorderBox = isIE && !isStrict,
+        isWindows = check(/windows|win32/),
+        isMac = check(/macintosh|mac os x/),
+        isAir = check(/adobeair/),
+        isLinux = check(/linux/),
+        isSecure = /^https/i.test(window.location.protocol);
+
+    // remove css image flicker
+    if(isIE6){
+        try{
+            DOC.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+
+    Ext.apply(Ext, {
+        /**
+         * URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent
+         * the IE insecure content warning (<tt>'about:blank'</tt>, except for IE in secure mode, which is <tt>'javascript:""'</tt>).
+         * @type String
+         */
+        SSL_SECURE_URL : isSecure && isIE ? 'javascript:""' : 'about:blank',
+        /**
+         * True if the browser is in strict (standards-compliant) mode, as opposed to quirks mode
+         * @type Boolean
+         */
+        isStrict : isStrict,
+        /**
+         * True if the page is running over SSL
+         * @type Boolean
+         */
+        isSecure : isSecure,
+        /**
+         * True when the document is fully initialized and ready for action
+         * @type Boolean
+         */
+        isReady : false,
+
+        /**
+         * True if the {@link Ext.Fx} Class is available
+         * @type Boolean
+         * @property enableFx
+         */
+
+        /**
+         * HIGHLY EXPERIMENTAL
+         * True to force css based border-box model override and turning off javascript based adjustments. This is a
+         * runtime configuration and must be set before onReady.
+         * @type Boolean
+         */
+        enableForcedBoxModel : false,
+
+        /**
+         * True to automatically uncache orphaned Ext.Elements periodically (defaults to true)
+         * @type Boolean
+         */
+        enableGarbageCollector : true,
+
+        /**
+         * True to automatically purge event listeners during garbageCollection (defaults to false).
+         * @type Boolean
+         */
+        enableListenerCollection : false,
+
+        /**
+         * EXPERIMENTAL - True to cascade listener removal to child elements when an element is removed.
+         * Currently not optimized for performance.
+         * @type Boolean
+         */
+        enableNestedListenerRemoval : false,
+
+        /**
+         * Indicates whether to use native browser parsing for JSON methods.
+         * This option is ignored if the browser does not support native JSON methods.
+         * <b>Note: Native JSON methods will not work with objects that have functions.
+         * Also, property names must be quoted, otherwise the data will not parse.</b> (Defaults to false)
+         * @type Boolean
+         */
+        USE_NATIVE_JSON : false,
+
+        /**
+         * Copies all the properties of config to obj if they don't already exist.
+         * @param {Object} obj The receiver of the properties
+         * @param {Object} config The source of the properties
+         * @return {Object} returns obj
+         */
+        applyIf : function(o, c){
+            if(o){
+                for(var p in c){
+                    if(!Ext.isDefined(o[p])){
+                        o[p] = c[p];
+                    }
+                }
+            }
+            return o;
+        },
+
+        /**
+         * Generates unique ids. If the element already has an id, it is unchanged
+         * @param {Mixed} el (optional) The element to generate an id for
+         * @param {String} prefix (optional) Id prefix (defaults "ext-gen")
+         * @return {String} The generated Id.
+         */
+        id : function(el, prefix){
+            el = Ext.getDom(el, true) || {};
+            if (!el.id) {
+                el.id = (prefix || "ext-gen") + (++idSeed);
+            }
+            return el.id;
+        },
+
+        /**
+         * <p>Extends one class to create a subclass and optionally overrides members with the passed literal. This method
+         * also adds the function "override()" to the subclass that can be used to override members of the class.</p>
+         * For example, to create a subclass of Ext GridPanel:
+         * <pre><code>
+MyGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    constructor: function(config) {
+
+//      Create configuration for this Grid.
+        var store = new Ext.data.Store({...});
+        var colModel = new Ext.grid.ColumnModel({...});
+
+//      Create a new config object containing our computed properties
+//      *plus* whatever was in the config parameter.
+        config = Ext.apply({
+            store: store,
+            colModel: colModel
+        }, config);
+
+        MyGridPanel.superclass.constructor.call(this, config);
+
+//      Your postprocessing here
+    },
+
+    yourMethod: function() {
+        // etc.
+    }
+});
+</code></pre>
+         *
+         * <p>This function also supports a 3-argument call in which the subclass's constructor is
+         * passed as an argument. In this form, the parameters are as follows:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><code>subclass</code> : Function <div class="sub-desc">The subclass constructor.</div></li>
+         * <li><code>superclass</code> : Function <div class="sub-desc">The constructor of class being extended</div></li>
+         * <li><code>overrides</code> : Object <div class="sub-desc">A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared among all instances of the new class.</div></li>
+         * </ul></div>
+         *
+         * @param {Function} superclass The constructor of class being extended.
+         * @param {Object} overrides <p>A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared between all instances of the new class.</p>
+         * <p>This may contain a special member named <tt><b>constructor</b></tt>. This is used
+         * to define the constructor of the new class, and is returned. If this property is
+         * <i>not</i> specified, a constructor is generated and returned which just calls the
+         * superclass's constructor passing on its parameters.</p>
+         * <p><b>It is essential that you call the superclass constructor in any provided constructor. See example code.</b></p>
+         * @return {Function} The subclass constructor from the <code>overrides</code> parameter, or a generated one if not provided.
+         */
+        extend : function(){
+            // inline overrides
+            var io = function(o){
+                for(var m in o){
+                    this[m] = o[m];
+                }
+            };
+            var oc = Object.prototype.constructor;
+
+            return function(sb, sp, overrides){
+                if(typeof sp == 'object'){
+                    overrides = sp;
+                    sp = sb;
+                    sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
+                }
+                var F = function(){},
+                    sbp,
+                    spp = sp.prototype;
+
+                F.prototype = spp;
+                sbp = sb.prototype = new F();
+                sbp.constructor=sb;
+                sb.superclass=spp;
+                if(spp.constructor == oc){
+                    spp.constructor=sp;
+                }
+                sb.override = function(o){
+                    Ext.override(sb, o);
+                };
+                sbp.superclass = sbp.supr = (function(){
+                    return spp;
+                });
+                sbp.override = io;
+                Ext.override(sb, overrides);
+                sb.extend = function(o){return Ext.extend(sb, o);};
+                return sb;
+            };
+        }(),
+
+        /**
+         * Adds a list of functions to the prototype of an existing class, overwriting any existing methods with the same name.
+         * Usage:<pre><code>
+Ext.override(MyClass, {
+    newMethod1: function(){
+        // etc.
+    },
+    newMethod2: function(foo){
+        // etc.
+    }
+});
+</code></pre>
+         * @param {Object} origclass The class to override
+         * @param {Object} overrides The list of functions to add to origClass.  This should be specified as an object literal
+         * containing one or more methods.
+         * @method override
+         */
+        override : function(origclass, overrides){
+            if(overrides){
+                var p = origclass.prototype;
+                Ext.apply(p, overrides);
+                if(Ext.isIE && overrides.hasOwnProperty('toString')){
+                    p.toString = overrides.toString;
+                }
+            }
+        },
+
+        /**
+         * Creates namespaces to be used for scoping variables and classes so that they are not global.
+         * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+         * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+         * @param {String} namespace1
+         * @param {String} namespace2
+         * @param {String} etc
+         * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+         * @method namespace
+         */
+        namespace : function(){
+            var len1 = arguments.length,
+                i = 0,
+                len2,
+                j,
+                main,
+                ns,
+                sub,
+                current;
+                
+            for(; i < len1; ++i) {
+                main = arguments[i];
+                ns = arguments[i].split('.');
+                current = window[ns[0]];
+                if (current === undefined) {
+                    current = window[ns[0]] = {};
+                }
+                sub = ns.slice(1);
+                len2 = sub.length;
+                for(j = 0; j < len2; ++j) {
+                    current = current[sub[j]] = current[sub[j]] || {};
+                }
+            }
+            return current;
+        },
+
+        /**
+         * Takes an object and converts it to an encoded URL. e.g. Ext.urlEncode({foo: 1, bar: 2}); would return "foo=1&bar=2".  Optionally, property values can be arrays, instead of keys and the resulting string that's returned will contain a name/value pair for each array value.
+         * @param {Object} o
+         * @param {String} pre (optional) A prefix to add to the url encoded string
+         * @return {String}
+         */
+        urlEncode : function(o, pre){
+            var empty,
+                buf = [],
+                e = encodeURIComponent;
+
+            Ext.iterate(o, function(key, item){
+                empty = Ext.isEmpty(item);
+                Ext.each(empty ? key : item, function(val){
+                    buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
+                });
+            });
+            if(!pre){
+                buf.shift();
+                pre = '';
+            }
+            return pre + buf.join('');
+        },
+
+        /**
+         * Takes an encoded URL and and converts it to an object. Example: <pre><code>
+Ext.urlDecode("foo=1&bar=2"); // returns {foo: "1", bar: "2"}
+Ext.urlDecode("foo=1&bar=2&bar=3&bar=4", false); // returns {foo: "1", bar: ["2", "3", "4"]}
+</code></pre>
+         * @param {String} string
+         * @param {Boolean} overwrite (optional) Items of the same name will overwrite previous values instead of creating an an array (Defaults to false).
+         * @return {Object} A literal with members
+         */
+        urlDecode : function(string, overwrite){
+            if(Ext.isEmpty(string)){
+                return {};
+            }
+            var obj = {},
+                pairs = string.split('&'),
+                d = decodeURIComponent,
+                name,
+                value;
+            Ext.each(pairs, function(pair) {
+                pair = pair.split('=');
+                name = d(pair[0]);
+                value = d(pair[1]);
+                obj[name] = overwrite || !obj[name] ? value :
+                            [].concat(obj[name]).concat(value);
+            });
+            return obj;
+        },
+
+        /**
+         * Appends content to the query string of a URL, handling logic for whether to place
+         * a question mark or ampersand.
+         * @param {String} url The URL to append to.
+         * @param {String} s The content to append to the URL.
+         * @return (String) The resulting URL
+         */
+        urlAppend : function(url, s){
+            if(!Ext.isEmpty(s)){
+                return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
+            }
+            return url;
+        },
+
+        /**
+         * Converts any iterable (numeric indices and a length property) into a true array
+         * Don't use this on strings. IE doesn't support "abc"[0] which this implementation depends on.
+         * For strings, use this instead: "abc".match(/./g) => [a,b,c];
+         * @param {Iterable} the iterable object to be turned into a true Array.
+         * @return (Array) array
+         */
+         toArray : function(){
+             return isIE ?
+                 function(a, i, j, res){
+                     res = [];
+                     for(var x = 0, len = a.length; x < len; x++) {
+                         res.push(a[x]);
+                     }
+                     return res.slice(i || 0, j || res.length);
+                 } :
+                 function(a, i, j){
+                     return Array.prototype.slice.call(a, i || 0, j || a.length);
+                 };
+         }(),
+
+        isIterable : function(v){
+            //check for array or arguments
+            if(Ext.isArray(v) || v.callee){
+                return true;
+            }
+            //check for node list type
+            if(/NodeList|HTMLCollection/.test(toString.call(v))){
+                return true;
+            }
+            //NodeList has an item and length property
+            //IXMLDOMNodeList has nextNode method, needs to be checked first.
+            return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length));
+        },
+
+        /**
+         * Iterates an array calling the supplied function.
+         * @param {Array/NodeList/Mixed} array The array to be iterated. If this
+         * argument is not really an array, the supplied function is called once.
+         * @param {Function} fn The function to be called with each item. If the
+         * supplied function returns false, iteration stops and this method returns
+         * the current <code>index</code>. This function is called with
+         * the following arguments:
+         * <div class="mdetail-params"><ul>
+         * <li><code>item</code> : <i>Mixed</i>
+         * <div class="sub-desc">The item at the current <code>index</code>
+         * in the passed <code>array</code></div></li>
+         * <li><code>index</code> : <i>Number</i>
+         * <div class="sub-desc">The current index within the array</div></li>
+         * <li><code>allItems</code> : <i>Array</i>
+         * <div class="sub-desc">The <code>array</code> passed as the first
+         * argument to <code>Ext.each</code>.</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed.
+         * Defaults to the <code>item</code> at the current <code>index</code>
+         * within the passed <code>array</code>.
+         * @return See description for the fn parameter.
+         */
+        each : function(array, fn, scope){
+            if(Ext.isEmpty(array, true)){
+                return;
+            }
+            if(!Ext.isIterable(array) || Ext.isPrimitive(array)){
+                array = [array];
+            }
+            for(var i = 0, len = array.length; i < len; i++){
+                if(fn.call(scope || array[i], array[i], i, array) === false){
+                    return i;
+                };
+            }
+        },
+
+        /**
+         * Iterates either the elements in an array, or each of the properties in an object.
+         * <b>Note</b>: If you are only iterating arrays, it is better to call {@link #each}.
+         * @param {Object/Array} object The object or array to be iterated
+         * @param {Function} fn The function to be called for each iteration.
+         * The iteration will stop if the supplied function returns false, or
+         * all array elements / object properties have been covered. The signature
+         * varies depending on the type of object being interated:
+         * <div class="mdetail-params"><ul>
+         * <li>Arrays : <tt>(Object item, Number index, Array allItems)</tt>
+         * <div class="sub-desc">
+         * When iterating an array, the supplied function is called with each item.</div></li>
+         * <li>Objects : <tt>(String key, Object value, Object)</tt>
+         * <div class="sub-desc">
+         * When iterating an object, the supplied function is called with each key-value pair in
+         * the object, and the iterated object</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed. Defaults to
+         * the <code>object</code> being iterated.
+         */
+        iterate : function(obj, fn, scope){
+            if(Ext.isEmpty(obj)){
+                return;
+            }
+            if(Ext.isIterable(obj)){
+                Ext.each(obj, fn, scope);
+                return;
+            }else if(typeof obj == 'object'){
+                for(var prop in obj){
+                    if(obj.hasOwnProperty(prop)){
+                        if(fn.call(scope || obj, prop, obj[prop], obj) === false){
+                            return;
+                        };
+                    }
+                }
+            }
+        },
+
+        /**
+         * Return the dom node for the passed String (id), dom node, or Ext.Element.
+         * Optional 'strict' flag is needed for IE since it can return 'name' and
+         * 'id' elements by using getElementById.
+         * Here are some examples:
+         * <pre><code>
+// gets dom node based on id
+var elDom = Ext.getDom('elId');
+// gets dom node based on the dom node
+var elDom1 = Ext.getDom(elDom);
+
+// If we don&#39;t know if we are working with an
+// Ext.Element or a dom node use Ext.getDom
+function(el){
+    var dom = Ext.getDom(el);
+    // do something with the dom node
+}
+         * </code></pre>
+         * <b>Note</b>: the dom node to be found actually needs to exist (be rendered, etc)
+         * when this method is called to be successful.
+         * @param {Mixed} el
+         * @return HTMLElement
+         */
+        getDom : function(el, strict){
+            if(!el || !DOC){
+                return null;
+            }
+            if (el.dom){
+                return el.dom;
+            } else {
+                if (typeof el == 'string') {
+                    var e = DOC.getElementById(el);
+                    // IE returns elements with the 'name' and 'id' attribute.
+                    // we do a strict check to return the element with only the id attribute
+                    if (e && isIE && strict) {
+                        if (el == e.getAttribute('id')) {
+                            return e;
+                        } else {
+                            return null;
+                        }
+                    }
+                    return e;
+                } else {
+                    return el;
+                }
+            }
+        },
+
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getBody : function(){
+            return Ext.get(DOC.body || DOC.documentElement);
+        },
+        
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getHead : function() {
+            var head;
+            
+            return function() {
+                if (head == undefined) {
+                    head = Ext.get(DOC.getElementsByTagName("head")[0]);
+                }
+                
+                return head;
+            };
+        }(),
+
+        /**
+         * Removes a DOM node from the document.
+         */
+        /**
+         * <p>Removes this element from the document, removes all DOM event listeners, and deletes the cache reference.
+         * All DOM event listeners are removed from this element. If {@link Ext#enableNestedListenerRemoval} is
+         * <code>true</code>, then DOM event listeners are also removed from all child nodes. The body node
+         * will be ignored if passed in.</p>
+         * @param {HTMLElement} node The node to remove
+         */
+        removeNode : isIE && !isIE8 ? function(){
+            var d;
+            return function(n){
+                if(n && n.tagName != 'BODY'){
+                    (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                    d = d || DOC.createElement('div');
+                    d.appendChild(n);
+                    d.innerHTML = '';
+                    delete Ext.elCache[n.id];
+                }
+            };
+        }() : function(n){
+            if(n && n.parentNode && n.tagName != 'BODY'){
+                (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                n.parentNode.removeChild(n);
+                delete Ext.elCache[n.id];
+            }
+        },
+
+        /**
+         * <p>Returns true if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Boolean} allowBlank (optional) true to allow empty strings (defaults to false)
+         * @return {Boolean}
+         */
+        isEmpty : function(v, allowBlank){
+            return v === null || v === undefined || ((Ext.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript array, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isArray : function(v){
+            return toString.apply(v) === '[object Array]';
+        },
+
+        /**
+         * Returns true if the passed object is a JavaScript date object, otherwise false.
+         * @param {Object} object The object to test
+         * @return {Boolean}
+         */
+        isDate : function(v){
+            return toString.apply(v) === '[object Date]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Object, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isObject : function(v){
+            return !!v && Object.prototype.toString.call(v) === '[object Object]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isPrimitive : function(v){
+            return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Function, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isFunction : function(v){
+            return toString.apply(v) === '[object Function]';
+        },
+
+        /**
+         * Returns true if the passed value is a number. Returns false for non-finite numbers.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isNumber : function(v){
+            return typeof v === 'number' && isFinite(v);
+        },
+
+        /**
+         * Returns true if the passed value is a string.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isString : function(v){
+            return typeof v === 'string';
+        },
+
+        /**
+         * Returns true if the passed value is a boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isBoolean : function(v){
+            return typeof v === 'boolean';
+        },
+
+        /**
+         * Returns true if the passed value is an HTMLElement
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isElement : function(v) {
+            return v ? !!v.tagName : false;
+        },
+
+        /**
+         * Returns true if the passed value is not undefined.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isDefined : function(v){
+            return typeof v !== 'undefined';
+        },
+
+        /**
+         * True if the detected browser is Opera.
+         * @type Boolean
+         */
+        isOpera : isOpera,
+        /**
+         * True if the detected browser uses WebKit.
+         * @type Boolean
+         */
+        isWebKit : isWebKit,
+        /**
+         * True if the detected browser is Chrome.
+         * @type Boolean
+         */
+        isChrome : isChrome,
+        /**
+         * True if the detected browser is Safari.
+         * @type Boolean
+         */
+        isSafari : isSafari,
+        /**
+         * True if the detected browser is Safari 3.x.
+         * @type Boolean
+         */
+        isSafari3 : isSafari3,
+        /**
+         * True if the detected browser is Safari 4.x.
+         * @type Boolean
+         */
+        isSafari4 : isSafari4,
+        /**
+         * True if the detected browser is Safari 2.x.
+         * @type Boolean
+         */
+        isSafari2 : isSafari2,
+        /**
+         * True if the detected browser is Internet Explorer.
+         * @type Boolean
+         */
+        isIE : isIE,
+        /**
+         * True if the detected browser is Internet Explorer 6.x.
+         * @type Boolean
+         */
+        isIE6 : isIE6,
+        /**
+         * True if the detected browser is Internet Explorer 7.x.
+         * @type Boolean
+         */
+        isIE7 : isIE7,
+        /**
+         * True if the detected browser is Internet Explorer 8.x.
+         * @type Boolean
+         */
+        isIE8 : isIE8,
+        /**
+         * True if the detected browser is Internet Explorer 9.x.
+         * @type Boolean
+         */
+        isIE9 : isIE9,
+        /**
+         * True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).
+         * @type Boolean
+         */
+        isGecko : isGecko,
+        /**
+         * True if the detected browser uses a pre-Gecko 1.9 layout engine (e.g. Firefox 2.x).
+         * @type Boolean
+         */
+        isGecko2 : isGecko2,
+        /**
+         * True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).
+         * @type Boolean
+         */
+        isGecko3 : isGecko3,
+        /**
+         * True if the detected browser is Internet Explorer running in non-strict mode.
+         * @type Boolean
+         */
+        isBorderBox : isBorderBox,
+        /**
+         * True if the detected platform is Linux.
+         * @type Boolean
+         */
+        isLinux : isLinux,
+        /**
+         * True if the detected platform is Windows.
+         * @type Boolean
+         */
+        isWindows : isWindows,
+        /**
+         * True if the detected platform is Mac OS.
+         * @type Boolean
+         */
+        isMac : isMac,
+        /**
+         * True if the detected platform is Adobe Air.
+         * @type Boolean
+         */
+        isAir : isAir
+    });
+
+    /**
+     * Creates namespaces to be used for scoping variables and classes so that they are not global.
+     * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+     * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+     * @param {String} namespace1
+     * @param {String} namespace2
+     * @param {String} etc
+     * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+     * @method ns
+     */
+    Ext.ns = Ext.namespace;
+})();
+
+Ext.ns('Ext.util', 'Ext.lib', 'Ext.data', 'Ext.supports');
+
+Ext.elCache = {};
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+     /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = sayHi.createInterceptor(function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+</code></pre>
+     * @param {Function} fcn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor : function(fcn, scope){
+        var method = this;
+        return !Ext.isFunction(fcn) ?
+                this :
+                function() {
+                    var me = this,
+                        args = arguments;
+                    fcn.target = me;
+                    fcn.method = method;
+                    return (fcn.apply(scope || me || window, args) !== false) ?
+                            method.apply(me || window, args) :
+                            null;
+                };
+    },
+
+     /**
+     * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+     * Call directly on any function. Example: <code>myFunction.createCallback(arg1, arg2)</code>
+     * Will create a function that is bound to those 2 args. <b>If a specific scope is required in the
+     * callback, use {@link #createDelegate} instead.</b> The function returned by createCallback always
+     * executes in the window scope.
+     * <p>This method is required when you want to pass arguments to a callback function.  If no arguments
+     * are needed, you can simply pass a reference to the function as a callback (e.g., callback: myFn).
+     * However, if you tried to pass a function with arguments (e.g., callback: myFn(arg1, arg2)) the function
+     * would simply execute immediately when the code is parsed. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// clicking the button alerts "Hi, Fred"
+new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody(),
+    handler: sayHi.createCallback('Fred')
+});
+</code></pre>
+     * @return {Function} The new function
+    */
+    createCallback : function(/*args...*/){
+        // make args available, in function below
+        var args = arguments,
+            method = this;
+        return function() {
+            return method.apply(window, args);
+        };
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>this.myFunction.createDelegate(this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', sayHi.createDelegate(btn, ['Fred']));
+</code></pre>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate : function(obj, args, appendArgs){
+        var method = this;
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true){
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }else if (Ext.isNumber(appendArgs)){
+                callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args); // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+            }
+            return method.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+sayHi.defer(2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+(function(){
+    alert('Anonymous');
+}).defer(100);
+</code></pre>
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer : function(millis, obj, args, appendArgs){
+        var fn = this.createDelegate(obj, args, appendArgs);
+        if(millis > 0){
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    }
+});
+
+/**
+ * @class String
+ * These functions are available on every String object.
+ */
+Ext.applyIf(String, {
+    /**
+     * Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens.  Each
+     * token must be unique, and must increment in the format {0}, {1}, etc.  Example usage:
+     * <pre><code>
+var cls = 'my-class', text = 'Some text';
+var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);
+// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'
+     * </code></pre>
+     * @param {String} string The tokenized string to be formatted
+     * @param {String} value1 The value to replace token {0}
+     * @param {String} value2 Etc...
+     * @return {String} The formatted string
+     * @static
+     */
+    format : function(format){
+        var args = Ext.toArray(arguments, 1);
+        return format.replace(/\{(\d+)\}/g, function(m, i){
+            return args[i];
+        });
+    }
+});
+
+/**
+ * @class Array
+ */
+Ext.applyIf(Array.prototype, {
+    /**
+     * Checks whether or not the specified object exists in the array.
+     * @param {Object} o The object to check for
+     * @param {Number} from (Optional) The index at which to begin the search
+     * @return {Number} The index of o in the array (or -1 if it is not found)
+     */
+    indexOf : function(o, from){
+        var len = this.length;
+        from = from || 0;
+        from += (from < 0) ? len : 0;
+        for (; from < len; ++from){
+            if(this[from] === o){
+                return from;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Removes the specified object from the array.  If the object is not found nothing happens.
+     * @param {Object} o The object to remove
+     * @return {Array} this array
+     */
+    remove : function(o){
+        var index = this.indexOf(o);
+        if(index != -1){
+            this.splice(index, 1);
+        }
+        return this;
+    }
+});
+/**
+ * @class Ext.util.TaskRunner
+ * Provides the ability to execute one or more arbitrary tasks in a multithreaded
+ * manner.  Generally, you can use the singleton {@link Ext.TaskMgr} instead, but
+ * if needed, you can create separate instances of TaskRunner.  Any number of
+ * separate tasks can be started at any time and will run independently of each
+ * other. Example usage:
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var updateClock = function(){
+    Ext.fly('clock').update(new Date().format('g:i:s A'));
+} 
+var task = {
+    run: updateClock,
+    interval: 1000 //1 second
+}
+var runner = new Ext.util.TaskRunner();
+runner.start(task);
+
+// equivalent using TaskMgr
+Ext.TaskMgr.start({
+    run: updateClock,
+    interval: 1000
+});
+
+ * </code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * Also see {@link Ext.util.DelayedTask}. 
+ * 
+ * @constructor
+ * @param {Number} interval (optional) The minimum precision in milliseconds supported by this TaskRunner instance
+ * (defaults to 10)
+ */
+Ext.util.TaskRunner = function(interval){
+    interval = interval || 10;
+    var tasks = [], 
+    	removeQueue = [],
+    	id = 0,
+    	running = false,
+
+    	// private
+    	stopThread = function(){
+	        running = false;
+	        clearInterval(id);
+	        id = 0;
+	    },
+
+    	// private
+    	startThread = function(){
+	        if(!running){
+	            running = true;
+	            id = setInterval(runTasks, interval);
+	        }
+	    },
+
+    	// private
+    	removeTask = function(t){
+	        removeQueue.push(t);
+	        if(t.onStop){
+	            t.onStop.apply(t.scope || t);
+	        }
+	    },
+	    
+    	// private
+    	runTasks = function(){
+	    	var rqLen = removeQueue.length,
+	    		now = new Date().getTime();	    			    		
+	    
+	        if(rqLen > 0){
+	            for(var i = 0; i < rqLen; i++){
+	                tasks.remove(removeQueue[i]);
+	            }
+	            removeQueue = [];
+	            if(tasks.length < 1){
+	                stopThread();
+	                return;
+	            }
+	        }	        
+	        for(var i = 0, t, itime, rt, len = tasks.length; i < len; ++i){
+	            t = tasks[i];
+	            itime = now - t.taskRunTime;
+	            if(t.interval <= itime){
+	                rt = t.run.apply(t.scope || t, t.args || [++t.taskRunCount]);
+	                t.taskRunTime = now;
+	                if(rt === false || t.taskRunCount === t.repeat){
+	                    removeTask(t);
+	                    return;
+	                }
+	            }
+	            if(t.duration && t.duration <= (now - t.taskStartTime)){
+	                removeTask(t);
+	            }
+	        }
+	    };
+
+    /**
+     * Starts a new task.
+     * @method start
+     * @param {Object} task <p>A config object that supports the following properties:<ul>
+     * <li><code>run</code> : Function<div class="sub-desc"><p>The function to execute each time the task is invoked. The
+     * function will be called at each interval and passed the <code>args</code> argument if specified, and the
+     * current invocation count if not.</p>
+     * <p>If a particular scope (<code>this</code> reference) is required, be sure to specify it using the <code>scope</code> argument.</p>
+     * <p>Return <code>false</code> from this function to terminate the task.</p></div></li>
+     * <li><code>interval</code> : Number<div class="sub-desc">The frequency in milliseconds with which the task
+     * should be invoked.</div></li>
+     * <li><code>args</code> : Array<div class="sub-desc">(optional) An array of arguments to be passed to the function
+     * specified by <code>run</code>. If not specified, the current invocation count is passed.</div></li>
+     * <li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<tt>this</tt> reference) in which to execute the
+     * <code>run</code> function. Defaults to the task config object.</div></li>
+     * <li><code>duration</code> : Number<div class="sub-desc">(optional) The length of time in milliseconds to invoke
+     * the task before stopping automatically (defaults to indefinite).</div></li>
+     * <li><code>repeat</code> : Number<div class="sub-desc">(optional) The number of times to invoke the task before
+     * stopping automatically (defaults to indefinite).</div></li>
+     * </ul></p>
+     * <p>Before each invocation, Ext injects the property <code>taskRunCount</code> into the task object so
+     * that calculations based on the repeat count can be performed.</p>
+     * @return {Object} The task
+     */
+    this.start = function(task){
+        tasks.push(task);
+        task.taskStartTime = new Date().getTime();
+        task.taskRunTime = 0;
+        task.taskRunCount = 0;
+        startThread();
+        return task;
+    };
+
+    /**
+     * Stops an existing running task.
+     * @method stop
+     * @param {Object} task The task to stop
+     * @return {Object} The task
+     */
+    this.stop = function(task){
+        removeTask(task);
+        return task;
+    };
+
+    /**
+     * Stops all tasks that are currently running.
+     * @method stopAll
+     */
+    this.stopAll = function(){
+        stopThread();
+        for(var i = 0, len = tasks.length; i < len; i++){
+            if(tasks[i].onStop){
+                tasks[i].onStop();
+            }
+        }
+        tasks = [];
+        removeQueue = [];
+    };
+};
+
+/**
+ * @class Ext.TaskMgr
+ * @extends Ext.util.TaskRunner
+ * A static {@link Ext.util.TaskRunner} instance that can be used to start and stop arbitrary tasks.  See
+ * {@link Ext.util.TaskRunner} for supported methods and task config properties.
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var task = {
+    run: function(){
+        Ext.fly('clock').update(new Date().format('g:i:s A'));
+    },
+    interval: 1000 //1 second
+}
+Ext.TaskMgr.start(task);
+</code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * @singleton
+ */
+Ext.TaskMgr = new Ext.util.TaskRunner();(function(){
+
+var libFlyweight,
+    version = Prototype.Version.split('.'),
+    mouseEnterSupported = (parseInt(version[0], 10) >= 2) || (parseInt(version[1], 10) >= 7) || (parseInt(version[2], 10) >= 1),
+    mouseCache = {},
+    elContains = function(parent, child) {
+       if(parent && parent.firstChild){
+         while(child) {
+            if(child === parent) {
+                return true;
+            }
+            child = child.parentNode;
+            if(child && (child.nodeType != 1)) {
+                child = null;
+            }
+          }
+        }
+        return false;
+    },
+    checkRelatedTarget = function(e) {
+        return !elContains(e.currentTarget, Ext.lib.Event.getRelatedTarget(e));
+    };
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        return full ? this.getDocumentWidth() : this.getViewportWidth();
+    },
+
+    getViewHeight : function(full){
+        return full ? this.getDocumentHeight() : this.getViewportHeight();
+    },
+
+    getDocumentHeight: function() { // missing from prototype?
+        var scrollHeight = (document.compatMode != "CSS1Compat") ? document.body.scrollHeight : document.documentElement.scrollHeight;
+        return Math.max(scrollHeight, this.getViewportHeight());
+    },
+
+    getDocumentWidth: function() { // missing from prototype?
+        var scrollWidth = (document.compatMode != "CSS1Compat") ? document.body.scrollWidth : document.documentElement.scrollWidth;
+        return Math.max(scrollWidth, this.getViewportWidth());
+    },
+
+    getViewportHeight: function() { // missing from prototype?
+        var height = self.innerHeight;
+        var mode = document.compatMode;
+
+        if ( (mode || Ext.isIE) && !Ext.isOpera ) {
+            height = (mode == "CSS1Compat") ?
+                    document.documentElement.clientHeight : // Standards
+                    document.body.clientHeight; // Quirks
+        }
+
+        return height;
+    },
+
+    getViewportWidth: function() { // missing from prototype?
+        var width = self.innerWidth;  // Safari
+        var mode = document.compatMode;
+
+        if (mode || Ext.isIE) { // IE, Gecko, Opera
+            width = (mode == "CSS1Compat") ?
+                    document.documentElement.clientWidth : // Standards
+                    document.body.clientWidth; // Quirks
+        }
+        return width;
+    },
+
+    isAncestor : function(p, c){ // missing from prototype?
+        var ret = false;
+
+        p = Ext.getDom(p);
+        c = Ext.getDom(c);
+        if (p && c) {
+            if (p.contains) {
+                return p.contains(c);
+            } else if (p.compareDocumentPosition) {
+                return !!(p.compareDocumentPosition(c) & 16);
+            } else {
+                while (c = c.parentNode) {
+                    ret = c == p || ret;
+                }
+            }
+        }
+        return ret;
+    },
+
+    getRegion : function(el){
+        return Ext.lib.Region.getRegion(el);
+    },
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    getXY : function(el){ // this initially used Position.cumulativeOffset but it is not accurate enough
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){ // this initially used Position.cumulativeOffset but it is not accurate enough
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+Ext.lib.Event = {
+    getPageX : function(e){
+        return Event.pointerX(e.browserEvent || e);
+    },
+
+    getPageY : function(e){
+        return Event.pointerY(e.browserEvent || e);
+    },
+
+    getXY : function(e){
+        e = e.browserEvent || e;
+        return [Event.pointerX(e), Event.pointerY(e)];
+    },
+
+    getTarget : function(e){
+        return Event.element(e.browserEvent || e);
+    },
+
+    resolveTextNode: Ext.isGecko ? function(node){
+        if(!node){
+            return;
+        }
+        var s = HTMLElement.prototype.toString.call(node);
+        if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+            return;
+        }
+        return node.nodeType == 3 ? node.parentNode : node;
+    } : function(node){
+        return node && node.nodeType == 3 ? node.parentNode : node;
+    },
+
+    getRelatedTarget: function(ev) { // missing from prototype?
+        ev = ev.browserEvent || ev;
+        var t = ev.relatedTarget;
+        if (!t) {
+            if (ev.type == "mouseout") {
+                t = ev.toElement;
+            } else if (ev.type == "mouseover") {
+                t = ev.fromElement;
+            }
+        }
+
+        return this.resolveTextNode(t);
+    },
+
+    on : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id] || (mouseCache[el.id] = {});
+            item[eventName] = fn;
+            fn = fn.createInterceptor(checkRelatedTarget);
+            eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+        }
+        Event.observe(el, eventName, fn, false);
+    },
+
+    un : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id],
+                ev = item && item[eventName];
+
+            if(ev){
+                fn = ev.fn;
+                delete item[eventName];
+                eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+            }
+        }
+        Event.stopObserving(el, eventName, fn, false);
+    },
+
+    purgeElement : function(el){
+        // no equiv?
+    },
+
+    preventDefault : function(e){   // missing from prototype?
+        e = e.browserEvent || e;
+        if(e.preventDefault) {
+            e.preventDefault();
+        } else {
+            e.returnValue = false;
+        }
+    },
+
+    stopPropagation : function(e){   // missing from prototype?
+        e = e.browserEvent || e;
+        if(e.stopPropagation) {
+            e.stopPropagation();
+        } else {
+            e.cancelBubble = true;
+        }
+    },
+
+    stopEvent : function(e){
+        Event.stop(e.browserEvent || e);
+    },
+
+    onAvailable : function(id, fn, scope){  // no equiv
+        var start = new Date(), iid;
+        var f = function(){
+            if(start.getElapsed() > 10000){
+                clearInterval(iid);
+            }
+            var el = document.getElementById(id);
+            if(el){
+                clearInterval(iid);
+                fn.call(scope||window, el);
+            }
+        };
+        iid = setInterval(f, 50);
+    }
+};
+
+Ext.lib.Ajax = function(){
+    var createSuccess = function(cb){
+         return cb.success ? function(xhr){
+            cb.success.call(cb.scope||window, createResponse(cb, xhr));
+         } : Ext.emptyFn;
+    };
+    var createFailure = function(cb){
+         return cb.failure ? function(xhr){
+            cb.failure.call(cb.scope||window, createResponse(cb, xhr));
+         } : Ext.emptyFn;
+    };
+    var createResponse = function(cb, xhr){
+        var headerObj = {},
+            headerStr,
+            t,
+            s;
+
+        try {
+            headerStr = xhr.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            responseText: xhr.responseText,
+            responseXML : xhr.responseXML,
+            argument: cb.argument,
+            status: xhr.status,
+            statusText: xhr.statusText,
+            getResponseHeader : function(header){
+                return headerObj[header.toLowerCase()];
+            },
+            getAllResponseHeaders : function(){
+                return headerStr;
+            }
+        };
+    };
+    return {
+        request : function(method, uri, cb, data, options){
+            var o = {
+                method: method,
+                parameters: data || '',
+                timeout: cb.timeout,
+                onSuccess: createSuccess(cb),
+                onFailure: createFailure(cb)
+            };
+            if(options){
+                var hs = options.headers;
+                if(hs){
+                    o.requestHeaders = hs;
+                }
+                if(options.xmlData){
+                    method = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'text/xml';
+                    }
+                    o.postBody = options.xmlData;
+                    delete o.parameters;
+                }
+                if(options.jsonData){
+                    method = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'application/json';
+                    }
+                    o.postBody = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+                    delete o.parameters;
+                }
+            }
+            new Ajax.Request(uri, o);
+        },
+
+        formRequest : function(form, uri, cb, data, isUpload, sslUri){
+            new Ajax.Request(uri, {
+                method: Ext.getDom(form).method ||'POST',
+                parameters: Form.serialize(form)+(data?'&'+data:''),
+                timeout: cb.timeout,
+                onSuccess: createSuccess(cb),
+                onFailure: createFailure(cb)
+            });
+        },
+
+        isCallInProgress : function(trans){
+            return false;
+        },
+
+        abort : function(trans){
+            return false;
+        },
+
+        serializeForm : function(form){
+            return Form.serialize(form.dom||form);
+        }
+    };
+}();
+
+
+Ext.lib.Anim = function(){
+
+    var easings = {
+        easeOut: function(pos) {
+            return 1-Math.pow(1-pos,2);
+        },
+        easeIn: function(pos) {
+            return 1-Math.pow(1-pos,2);
+        }
+    };
+    var createAnim = function(cb, scope){
+        return {
+            stop : function(skipToLast){
+                this.effect.cancel();
+            },
+
+            isAnimated : function(){
+                return this.effect.state == 'running';
+            },
+
+            proxyCallback : function(){
+                Ext.callback(cb, scope);
+            }
+        };
+    };
+    return {
+        scroll : function(el, args, duration, easing, cb, scope){
+            // not supported so scroll immediately?
+            var anim = createAnim(cb, scope);
+            el = Ext.getDom(el);
+            if(typeof args.scroll.to[0] == 'number'){
+                el.scrollLeft = args.scroll.to[0];
+            }
+            if(typeof args.scroll.to[1] == 'number'){
+                el.scrollTop = args.scroll.to[1];
+            }
+            anim.proxyCallback();
+            return anim;
+        },
+
+        motion : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        color : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type){
+            var o = {};
+            for(var k in args){
+                switch(k){   // scriptaculous doesn't support, so convert these
+                    case 'points':
+                        var by, pts, e = Ext.fly(el, '_animrun');
+                        e.position();
+                        if(by = args.points.by){
+                            var xy = e.getXY();
+                            pts = e.translatePoints([xy[0]+by[0], xy[1]+by[1]]);
+                        }else{
+                            pts = e.translatePoints(args.points.to);
+                        }
+                        o.left = pts.left+'px';
+                        o.top = pts.top+'px';
+                    break;
+                    case 'width':
+                        o.width = args.width.to+'px';
+                    break;
+                    case 'height':
+                        o.height = args.height.to+'px';
+                    break;
+                    case 'opacity':
+                        o.opacity = String(args.opacity.to);
+                    break;
+                    default:
+                        o[k] = String(args[k].to);
+                    break;
+                }
+            }
+            var anim = createAnim(cb, scope);
+            anim.effect = new Effect.Morph(Ext.id(el), {
+                duration: duration,
+                afterFinish: anim.proxyCallback,
+                transition: easings[easing] || Effect.Transitions.linear,
+                style: o
+            });
+            return anim;
+        }
+    };
+}();
+
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+
+Ext.lib.Region = function(t, r, b, l) {
+    this.top = t;
+    this[1] = t;
+    this.right = r;
+    this.bottom = b;
+    this.left = l;
+    this[0] = l;
+};
+
+Ext.lib.Region.prototype = {
+    contains : function(region) {
+        return ( region.left   >= this.left   &&
+                 region.right  <= this.right  &&
+                 region.top    >= this.top    &&
+                 region.bottom <= this.bottom    );
+
+    },
+
+    getArea : function() {
+        return ( (this.bottom - this.top) * (this.right - this.left) );
+    },
+
+    intersect : function(region) {
+        var t = Math.max( this.top,    region.top    );
+        var r = Math.min( this.right,  region.right  );
+        var b = Math.min( this.bottom, region.bottom );
+        var l = Math.max( this.left,   region.left   );
+
+        if (b >= t && r >= l) {
+            return new Ext.lib.Region(t, r, b, l);
+        } else {
+            return null;
+        }
+    },
+    union : function(region) {
+        var t = Math.min( this.top,    region.top    );
+        var r = Math.max( this.right,  region.right  );
+        var b = Math.max( this.bottom, region.bottom );
+        var l = Math.min( this.left,   region.left   );
+
+        return new Ext.lib.Region(t, r, b, l);
+    },
+
+    constrainTo : function(r) {
+            this.top = this.top.constrain(r.top, r.bottom);
+            this.bottom = this.bottom.constrain(r.top, r.bottom);
+            this.left = this.left.constrain(r.left, r.right);
+            this.right = this.right.constrain(r.left, r.right);
+            return this;
+    },
+
+    adjust : function(t, l, b, r){
+        this.top += t;
+        this.left += l;
+        this.right += r;
+        this.bottom += b;
+        return this;
+    }
+};
+
+Ext.lib.Region.getRegion = function(el) {
+    var p = Ext.lib.Dom.getXY(el);
+
+    var t = p[1];
+    var r = p[0] + el.offsetWidth;
+    var b = p[1] + el.offsetHeight;
+    var l = p[0];
+
+    return new Ext.lib.Region(t, r, b, l);
+};
+
+Ext.lib.Point = function(x, y) {
+   if (Ext.isArray(x)) {
+      y = x[1];
+      x = x[0];
+   }
+    this.x = this.right = this.left = this[0] = x;
+    this.y = this.top = this.bottom = this[1] = y;
+};
+
+Ext.lib.Point.prototype = new Ext.lib.Region();
+
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/prototype/ext-prototype-adapter.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+window.undefined=window.undefined;Ext={version:"3.4.0",versionDetail:{major:3,minor:4,patch:0}};Ext.apply=function(d,e,b){if(b){Ext.apply(d,b)}if(d&&e&&typeof e=="object"){for(var a in e){d[a]=e[a]}}return d};(function(){var g=0,u=Object.prototype.toString,v=navigator.userAgent.toLowerCase(),A=function(e){return e.test(v)},i=document,n=i.documentMode,l=i.compatMode=="CSS1Compat",C=A(/opera/),h=A(/\bchrome\b/),w=A(/webkit/),z=!h&&A(/safari/),f=z&&A(/applewebkit\/4/),b=z&&A(/version\/3/),D=z&&A(/version\/4/),t=!C&&A(/msie/),r=t&&(A(/msie 7/)||n==7),q=t&&(A(/msie 8/)&&n!=7),p=t&&A(/msie 9/),s=t&&!r&&!q&&!p,o=!w&&A(/gecko/),d=o&&A(/rv:1\.8/),a=o&&A(/rv:1\.9/),x=t&&!l,B=A(/windows|win32/),k=A(/macintosh|mac os x/),j=A(/adobeair/),m=A(/linux/),c=/^https/i.test(window.location.protocol);if(s){try{i.execCommand("BackgroundImageCache",false,true)}catch(y){}}Ext.apply(Ext,{SSL_SECURE_URL:c&&t?'javascript:""':"about:blank",isStrict:l,isSecure:c,isReady:false,enableForcedBoxModel:false,enableGarbageCollector:true,enableListenerCollection:false,enableNestedListenerRemoval:false,USE_NATIVE_JSON:false,applyIf:function(E,F){if(E){for(var e in F){if(!Ext.isDefined(E[e])){E[e]=F[e]}}}return E},id:function(e,E){e=Ext.getDom(e,true)||{};if(!e.id){e.id=(E||"ext-gen")+(++g)}return e.id},extend:function(){var E=function(G){for(var F in G){this[F]=G[F]}};var e=Object.prototype.constructor;return function(L,I,K){if(typeof I=="object"){K=I;I=L;L=K.constructor!=e?K.constructor:function(){I.apply(this,arguments)}}var H=function(){},J,G=I.prototype;H.prototype=G;J=L.prototype=new H();J.constructor=L;L.superclass=G;if(G.constructor==e){G.constructor=I}L.override=function(F){Ext.override(L,F)};J.superclass=J.supr=(function(){return G});J.override=E;Ext.override(L,K);L.extend=function(F){return Ext.extend(L,F)};return L}}(),override:function(e,F){if(F){var E=e.prototype;Ext.apply(E,F);if(Ext.isIE&&F.hasOwnProperty("toString")){E.toString=F.toString}}},namespace:function(){var G=arguments.length,H=0,E,F,e,J,I,K;for(;H<G;++H){e=arguments[H];J=arguments[H].split(".");K=window[J[0]];if(K===undefined){K=window[J[0]]={}}I=J.slice(1);E=I.length;for(F=0;F<E;++F){K=K[I[F]]=K[I[F]]||{}}}return K},urlEncode:function(I,H){var F,E=[],G=encodeURIComponent;Ext.iterate(I,function(e,J){F=Ext.isEmpty(J);Ext.each(F?e:J,function(K){E.push("&",G(e),"=",(!Ext.isEmpty(K)&&(K!=e||!F))?(Ext.isDate(K)?Ext.encode(K).replace(/"/g,""):G(K)):"")})});if(!H){E.shift();H=""}return H+E.join("")},urlDecode:function(F,E){if(Ext.isEmpty(F)){return{}}var I={},H=F.split("&"),J=decodeURIComponent,e,G;Ext.each(H,function(K){K=K.split("=");e=J(K[0]);G=J(K[1]);I[e]=E||!I[e]?G:[].concat(I[e]).concat(G)});return I},urlAppend:function(e,E){if(!Ext.isEmpty(E)){return e+(e.indexOf("?")===-1?"?":"&")+E}return e},toArray:function(){return t?function(F,I,G,H){H=[];for(var E=0,e=F.length;E<e;E++){H.push(F[E])}return H.slice(I||0,G||H.length)}:function(e,F,E){return Array.prototype.slice.call(e,F||0,E||e.length)}}(),isIterable:function(e){if(Ext.isArray(e)||e.callee){return true}if(/NodeList|HTMLCollection/.test(u.call(e))){return true}return((typeof e.nextNode!="undefined"||e.item)&&Ext.isNumber(e.length))},each:function(H,G,F){if(Ext.isEmpty(H,true)){return}if(!Ext.isIterable(H)||Ext.isPrimitive(H)){H=[H]}for(var E=0,e=H.length;E<e;E++){if(G.call(F||H[E],H[E],E,H)===false){return E}}},iterate:function(F,E,e){if(Ext.isEmpty(F)){return}if(Ext.isIterable(F)){Ext.each(F,E,e);return}else{if(typeof F=="object"){for(var G in F){if(F.hasOwnProperty(G)){if(E.call(e||F,G,F[G],F)===false){return}}}}}},getDom:function(F,E){if(!F||!i){return null}if(F.dom){return F.dom}else{if(typeof F=="string"){var G=i.getElementById(F);if(G&&t&&E){if(F==G.getAttribute("id")){return G}else{return null}}return G}else{return F}}},getBody:function(){return Ext.get(i.body||i.documentElement)},getHead:function(){var e;return function(){if(e==undefined){e=Ext.get(i.getElementsByTagName("head")[0])}return e}}(),removeNode:t&&!q?function(){var e;return function(E){if(E&&E.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(E,true):Ext.EventManager.removeAll(E);e=e||i.createElement("div");e.appendChild(E);e.innerHTML="";delete Ext.elCache[E.id]}}}():function(e){if(e&&e.parentNode&&e.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(e,true):Ext.EventManager.removeAll(e);e.parentNode.removeChild(e);delete Ext.elCache[e.id]}},isEmpty:function(E,e){return E===null||E===undefined||((Ext.isArray(E)&&!E.length))||(!e?E==="":false)},isArray:function(e){return u.apply(e)==="[object Array]"},isDate:function(e){return u.apply(e)==="[object Date]"},isObject:function(e){return !!e&&Object.prototype.toString.call(e)==="[object Object]"},isPrimitive:function(e){return Ext.isString(e)||Ext.isNumber(e)||Ext.isBoolean(e)},isFunction:function(e){return u.apply(e)==="[object Function]"},isNumber:function(e){return typeof e==="number"&&isFinite(e)},isString:function(e){return typeof e==="string"},isBoolean:function(e){return typeof e==="boolean"},isElement:function(e){return e?!!e.tagName:false},isDefined:function(e){return typeof e!=="undefined"},isOpera:C,isWebKit:w,isChrome:h,isSafari:z,isSafari3:b,isSafari4:D,isSafari2:f,isIE:t,isIE6:s,isIE7:r,isIE8:q,isIE9:p,isGecko:o,isGecko2:d,isGecko3:a,isBorderBox:x,isLinux:m,isWindows:B,isMac:k,isAir:j});Ext.ns=Ext.namespace})();Ext.ns("Ext.util","Ext.lib","Ext.data","Ext.supports");Ext.elCache={};Ext.apply(Function.prototype,{createInterceptor:function(b,a){var c=this;return !Ext.isFunction(b)?this:function(){var e=this,d=arguments;b.target=e;b.method=c;return(b.apply(a||e||window,d)!==false)?c.apply(e||window,d):null}},createCallback:function(){var a=arguments,b=this;return function(){return b.apply(window,a)}},createDelegate:function(c,b,a){var d=this;return function(){var f=b||arguments;if(a===true){f=Array.prototype.slice.call(arguments,0);f=f.concat(b)}else{if(Ext.isNumber(a)){f=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(f,e)}}return d.apply(c||window,f)}},defer:function(c,e,b,a){var d=this.createDelegate(e,b,a);if(c>0){return setTimeout(d,c)}d();return 0}});Ext.applyIf(String,{format:function(b){var a=Ext.toArray(arguments,1);return b.replace(/\{(\d+)\}/g,function(c,d){return a[d]})}});Ext.applyIf(Array.prototype,{indexOf:function(b,c){var a=this.length;c=c||0;c+=(c<0)?a:0;for(;c<a;++c){if(this[c]===b){return c}}return -1},remove:function(b){var a=this.indexOf(b);if(a!=-1){this.splice(a,1)}return this}});Ext.util.TaskRunner=function(e){e=e||10;var f=[],a=[],b=0,g=false,d=function(){g=false;clearInterval(b);b=0},h=function(){if(!g){g=true;b=setInterval(i,e)}},c=function(j){a.push(j);if(j.onStop){j.onStop.apply(j.scope||j)}},i=function(){var l=a.length,n=new Date().getTime();if(l>0){for(var p=0;p<l;p++){f.remove(a[p])}a=[];if(f.length<1){d();return}}for(var p=0,o,k,m,j=f.length;p<j;++p){o=f[p];k=n-o.taskRunTime;if(o.interval<=k){m=o.run.apply(o.scope||o,o.args||[++o.taskRunCount]);o.taskRunTime=n;if(m===false||o.taskRunCount===o.repeat){c(o);return}}if(o.duration&&o.duration<=(n-o.taskStartTime)){c(o)}}};this.start=function(j){f.push(j);j.taskStartTime=new Date().getTime();j.taskRunTime=0;j.taskRunCount=0;h();return j};this.stop=function(j){c(j);return j};this.stopAll=function(){d();for(var k=0,j=f.length;k<j;k++){if(f[k].onStop){f[k].onStop()}}f=[];a=[]}};Ext.TaskMgr=new Ext.util.TaskRunner();(function(){var e,a=Prototype.Version.split("."),h=(parseInt(a[0],10)>=2)||(parseInt(a[1],10)>=7)||(parseInt(a[2],10)>=1),g={},d=function(i,j){if(i&&i.firstChild){while(j){if(j===i){return true}j=j.parentNode;if(j&&(j.nodeType!=1)){j=null}}}return false},b=function(i){return !d(i.currentTarget,Ext.lib.Event.getRelatedTarget(i))};Ext.lib.Dom={getViewWidth:function(i){return i?this.getDocumentWidth():this.getViewportWidth()},getViewHeight:function(i){return i?this.getDocumentHeight():this.getViewportHeight()},getDocumentHeight:function(){var i=(document.compatMode!="CSS1Compat")?document.body.scrollHeight:document.documentElement.scrollHeight;return Math.max(i,this.getViewportHeight())},getDocumentWidth:function(){var i=(document.compatMode!="CSS1Compat")?document.body.scrollWidth:document.documentElement.scrollWidth;return Math.max(i,this.getViewportWidth())},getViewportHeight:function(){var i=self.innerHeight;var j=document.compatMode;if((j||Ext.isIE)&&!Ext.isOpera){i=(j=="CSS1Compat")?document.documentElement.clientHeight:document.body.clientHeight}return i},getViewportWidth:function(){var i=self.innerWidth;var j=document.compatMode;if(j||Ext.isIE){i=(j=="CSS1Compat")?document.documentElement.clientWidth:document.body.clientWidth}return i},isAncestor:function(j,k){var i=false;j=Ext.getDom(j);k=Ext.getDom(k);if(j&&k){if(j.contains){return j.contains(k)}else{if(j.compareDocumentPosition){return !!(j.compareDocumentPosition(k)&16)}else{while(k=k.parentNode){i=k==j||i}}}}return i},getRegion:function(i){return Ext.lib.Region.getRegion(i)},getY:function(i){return this.getXY(i)[1]},getX:function(i){return this.getXY(i)[0]},getXY:function(k){var j,o,r,s,n=(document.body||document.documentElement);k=Ext.getDom(k);if(k==n){return[0,0]}if(k.getBoundingClientRect){r=k.getBoundingClientRect();s=f(document).getScroll();return[Math.round(r.left+s.left),Math.round(r.top+s.top)]}var t=0,q=0;j=k;var i=f(k).getStyle("position")=="absolute";while(j){t+=j.offsetLeft;q+=j.offsetTop;if(!i&&f(j).getStyle("position")=="absolute"){i=true}if(Ext.isGecko){o=f(j);var u=parseInt(o.getStyle("borderTopWidth"),10)||0;var l=parseInt(o.getStyle("borderLeftWidth"),10)||0;t+=l;q+=u;if(j!=k&&o.getStyle("overflow")!="visible"){t+=l;q+=u}}j=j.offsetParent}if(Ext.isSafari&&i){t-=n.offsetLeft;q-=n.offsetTop}if(Ext.isGecko&&!i){var m=f(n);t+=parseInt(m.getStyle("borderLeftWidth"),10)||0;q+=parseInt(m.getStyle("borderTopWidth"),10)||0}j=k.parentNode;while(j&&j!=n){if(!Ext.isOpera||(j.tagName!="TR"&&f(j).getStyle("display")!="inline")){t-=j.scrollLeft;q-=j.scrollTop}j=j.parentNode}return[t,q]},setXY:function(i,j){i=Ext.fly(i,"_setXY");i.position();var k=i.translatePoints(j);if(j[0]!==false){i.dom.style.left=k.left+"px"}if(j[1]!==false){i.dom.style.top=k.top+"px"}},setX:function(j,i){this.setXY(j,[i,false])},setY:function(i,j){this.setXY(i,[false,j])}};Ext.lib.Event={getPageX:function(i){return Event.pointerX(i.browserEvent||i)},getPageY:function(i){return Event.pointerY(i.browserEvent||i)},getXY:function(i){i=i.browserEvent||i;return[Event.pointerX(i),Event.pointerY(i)]},getTarget:function(i){return Event.element(i.browserEvent||i)},resolveTextNode:Ext.isGecko?function(j){if(!j){return}var i=HTMLElement.prototype.toString.call(j);if(i=="[xpconnect wrapped native prototype]"||i=="[object XULElement]"){return}return j.nodeType==3?j.parentNode:j}:function(i){return i&&i.nodeType==3?i.parentNode:i},getRelatedTarget:function(j){j=j.browserEvent||j;var i=j.relatedTarget;if(!i){if(j.type=="mouseout"){i=j.toElement}else{if(j.type=="mouseover"){i=j.fromElement}}}return this.resolveTextNode(i)},on:function(k,i,j){if((i=="mouseenter"||i=="mouseleave")&&!h){var l=g[k.id]||(g[k.id]={});l[i]=j;j=j.createInterceptor(b);i=(i=="mouseenter")?"mouseover":"mouseout"}Event.observe(k,i,j,false)},un:function(k,i,j){if((i=="mouseenter"||i=="mouseleave")&&!h){var m=g[k.id],l=m&&m[i];if(l){j=l.fn;delete m[i];i=(i=="mouseenter")?"mouseover":"mouseout"}}Event.stopObserving(k,i,j,false)},purgeElement:function(i){},preventDefault:function(i){i=i.browserEvent||i;if(i.preventDefault){i.preventDefault()}else{i.returnValue=false}},stopPropagation:function(i){i=i.browserEvent||i;if(i.stopPropagation){i.stopPropagation()}else{i.cancelBubble=true}},stopEvent:function(i){Event.stop(i.browserEvent||i)},onAvailable:function(n,j,i){var m=new Date(),l;var k=function(){if(m.getElapsed()>10000){clearInterval(l)}var o=document.getElementById(n);if(o){clearInterval(l);j.call(i||window,o)}};l=setInterval(k,50)}};Ext.lib.Ajax=function(){var k=function(l){return l.success?function(m){l.success.call(l.scope||window,i(l,m))}:Ext.emptyFn};var j=function(l){return l.failure?function(m){l.failure.call(l.scope||window,i(l,m))}:Ext.emptyFn};var i=function(l,r){var n={},p,m,o;try{p=r.getAllResponseHeaders();Ext.each(p.replace(/\r\n/g,"\n").split("\n"),function(s){m=s.indexOf(":");if(m>=0){o=s.substr(0,m).toLowerCase();if(s.charAt(m+1)==" "){++m}n[o]=s.substr(m+1)}})}catch(q){}return{responseText:r.responseText,responseXML:r.responseXML,argument:l.argument,status:r.status,statusText:r.statusText,getResponseHeader:function(s){return n[s.toLowerCase()]},getAllResponseHeaders:function(){return p}}};return{request:function(s,p,l,q,m){var r={method:s,parameters:q||"",timeout:l.timeout,onSuccess:k(l),onFailure:j(l)};if(m){var n=m.headers;if(n){r.requestHeaders=n}if(m.xmlData){s=(s?s:(m.method?m.method:"POST"));if(!n||!n["Content-Type"]){r.contentType="text/xml"}r.postBody=m.xmlData;delete r.parameters}if(m.jsonData){s=(s?s:(m.method?m.method:"POST"));if(!n||!n["Content-Type"]){r.contentType="application/json"}r.postBody=typeof m.jsonData=="object"?Ext.encode(m.jsonData):m.jsonData;delete r.parameters}}new Ajax.Request(p,r)},formRequest:function(p,o,m,q,l,n){new Ajax.Request(o,{method:Ext.getDom(p).method||"POST",parameters:Form.serialize(p)+(q?"&"+q:""),timeout:m.timeout,onSuccess:k(m),onFailure:j(m)})},isCallInProgress:function(l){return false},abort:function(l){return false},serializeForm:function(l){return Form.serialize(l.dom||l)}}}();Ext.lib.Anim=function(){var i={easeOut:function(k){return 1-Math.pow(1-k,2)},easeIn:function(k){return 1-Math.pow(1-k,2)}};var j=function(k,l){return{stop:function(m){this.effect.cancel()},isAnimated:function(){return this.effect.state=="running"},proxyCallback:function(){Ext.callback(k,l)}}};return{scroll:function(n,l,p,q,k,m){var o=j(k,m);n=Ext.getDom(n);if(typeof l.scroll.to[0]=="number"){n.scrollLeft=l.scroll.to[0]}if(typeof l.scroll.to[1]=="number"){n.scrollTop=l.scroll.to[1]}o.proxyCallback();return o},motion:function(n,l,o,p,k,m){return this.run(n,l,o,p,k,m)},color:function(n,l,o,p,k,m){return this.run(n,l,o,p,k,m)},run:function(m,v,r,u,n,x,w){var l={};for(var q in v){switch(q){case"points":var t,z,s=Ext.fly(m,"_animrun");s.position();if(t=v.points.by){var y=s.getXY();z=s.translatePoints([y[0]+t[0],y[1]+t[1]])}else{z=s.translatePoints(v.points.to)}l.left=z.left+"px";l.top=z.top+"px";break;case"width":l.width=v.width.to+"px";break;case"height":l.height=v.height.to+"px";break;case"opacity":l.opacity=String(v.opacity.to);break;default:l[q]=String(v[q].to);break}}var p=j(n,x);p.effect=new Effect.Morph(Ext.id(m),{duration:r,afterFinish:p.proxyCallback,transition:i[u]||Effect.Transitions.linear,style:l});return p}}}();function f(i){if(!e){e=new Ext.Element.Flyweight()}e.dom=i;return e}Ext.lib.Region=function(k,m,i,j){this.top=k;this[1]=k;this.right=m;this.bottom=i;this.left=j;this[0]=j};Ext.lib.Region.prototype={contains:function(i){return(i.left>=this.left&&i.right<=this.right&&i.top>=this.top&&i.bottom<=this.bottom)},getArea:function(){return((this.bottom-this.top)*(this.right-this.left))},intersect:function(n){var k=Math.max(this.top,n.top);var m=Math.min(this.right,n.right);var i=Math.min(this.bottom,n.bottom);var j=Math.max(this.left,n.left);if(i>=k&&m>=j){return new Ext.lib.Region(k,m,i,j)}else{return null}},union:function(n){var k=Math.min(this.top,n.top);var m=Math.max(this.right,n.right);var i=Math.max(this.bottom,n.bottom);var j=Math.min(this.left,n.left);return new Ext.lib.Region(k,m,i,j)},constrainTo:function(i){this.top=this.top.constrain(i.top,i.bottom);this.bottom=this.bottom.constrain(i.top,i.bottom);this.left=this.left.constrain(i.left,i.right);this.right=this.right.constrain(i.left,i.right);return this},adjust:function(k,j,i,m){this.top+=k;this.left+=j;this.right+=m;this.bottom+=i;return this}};Ext.lib.Region.getRegion=function(m){var o=Ext.lib.Dom.getXY(m);var k=o[1];var n=o[0]+m.offsetWidth;var i=o[1]+m.offsetHeight;var j=o[0];return new Ext.lib.Region(k,n,i,j)};Ext.lib.Point=function(i,j){if(Ext.isArray(i)){j=i[1];i=i[0]}this.x=this.right=this.left=this[0]=i;this.y=this.top=this.bottom=this[1]=j};Ext.lib.Point.prototype=new Ext.lib.Region();if(Ext.isIE){function c(){var i=Function.prototype;delete i.createSequence;delete i.defer;delete i.createDelegate;delete i.createCallback;delete i.createInterceptor;window.detachEvent("onunload",c)}window.attachEvent("onunload",c)}})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter-debug.js	(revision 76)
@@ -0,0 +1,1612 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// for old browsers
+window.undefined = window.undefined;
+
+/**
+ * @class Ext
+ * Ext core utilities and functions.
+ * @singleton
+ */
+
+Ext = {
+    /**
+     * The version of the framework
+     * @type String
+     */
+    version : '3.4.0',
+    versionDetail : {
+        major : 3,
+        minor : 4,
+        patch : 0
+    }
+};
+
+/**
+ * Copies all the properties of config to obj.
+ * @param {Object} obj The receiver of the properties
+ * @param {Object} config The source of the properties
+ * @param {Object} defaults A different object that will also be applied for default values
+ * @return {Object} returns obj
+ * @member Ext apply
+ */
+Ext.apply = function(o, c, defaults){
+    // no "this" reference for friendly out of scope calls
+    if(defaults){
+        Ext.apply(o, defaults);
+    }
+    if(o && c && typeof c == 'object'){
+        for(var p in c){
+            o[p] = c[p];
+        }
+    }
+    return o;
+};
+
+(function(){
+    var idSeed = 0,
+        toString = Object.prototype.toString,
+        ua = navigator.userAgent.toLowerCase(),
+        check = function(r){
+            return r.test(ua);
+        },
+        DOC = document,
+        docMode = DOC.documentMode,
+        isStrict = DOC.compatMode == "CSS1Compat",
+        isOpera = check(/opera/),
+        isChrome = check(/\bchrome\b/),
+        isWebKit = check(/webkit/),
+        isSafari = !isChrome && check(/safari/),
+        isSafari2 = isSafari && check(/applewebkit\/4/), // unique to Safari 2
+        isSafari3 = isSafari && check(/version\/3/),
+        isSafari4 = isSafari && check(/version\/4/),
+        isIE = !isOpera && check(/msie/),
+        isIE7 = isIE && (check(/msie 7/) || docMode == 7),
+        isIE8 = isIE && (check(/msie 8/) && docMode != 7),
+        isIE9 = isIE && check(/msie 9/),
+        isIE6 = isIE && !isIE7 && !isIE8 && !isIE9,
+        isGecko = !isWebKit && check(/gecko/),
+        isGecko2 = isGecko && check(/rv:1\.8/),
+        isGecko3 = isGecko && check(/rv:1\.9/),
+        isBorderBox = isIE && !isStrict,
+        isWindows = check(/windows|win32/),
+        isMac = check(/macintosh|mac os x/),
+        isAir = check(/adobeair/),
+        isLinux = check(/linux/),
+        isSecure = /^https/i.test(window.location.protocol);
+
+    // remove css image flicker
+    if(isIE6){
+        try{
+            DOC.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+
+    Ext.apply(Ext, {
+        /**
+         * URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent
+         * the IE insecure content warning (<tt>'about:blank'</tt>, except for IE in secure mode, which is <tt>'javascript:""'</tt>).
+         * @type String
+         */
+        SSL_SECURE_URL : isSecure && isIE ? 'javascript:""' : 'about:blank',
+        /**
+         * True if the browser is in strict (standards-compliant) mode, as opposed to quirks mode
+         * @type Boolean
+         */
+        isStrict : isStrict,
+        /**
+         * True if the page is running over SSL
+         * @type Boolean
+         */
+        isSecure : isSecure,
+        /**
+         * True when the document is fully initialized and ready for action
+         * @type Boolean
+         */
+        isReady : false,
+
+        /**
+         * True if the {@link Ext.Fx} Class is available
+         * @type Boolean
+         * @property enableFx
+         */
+
+        /**
+         * HIGHLY EXPERIMENTAL
+         * True to force css based border-box model override and turning off javascript based adjustments. This is a
+         * runtime configuration and must be set before onReady.
+         * @type Boolean
+         */
+        enableForcedBoxModel : false,
+
+        /**
+         * True to automatically uncache orphaned Ext.Elements periodically (defaults to true)
+         * @type Boolean
+         */
+        enableGarbageCollector : true,
+
+        /**
+         * True to automatically purge event listeners during garbageCollection (defaults to false).
+         * @type Boolean
+         */
+        enableListenerCollection : false,
+
+        /**
+         * EXPERIMENTAL - True to cascade listener removal to child elements when an element is removed.
+         * Currently not optimized for performance.
+         * @type Boolean
+         */
+        enableNestedListenerRemoval : false,
+
+        /**
+         * Indicates whether to use native browser parsing for JSON methods.
+         * This option is ignored if the browser does not support native JSON methods.
+         * <b>Note: Native JSON methods will not work with objects that have functions.
+         * Also, property names must be quoted, otherwise the data will not parse.</b> (Defaults to false)
+         * @type Boolean
+         */
+        USE_NATIVE_JSON : false,
+
+        /**
+         * Copies all the properties of config to obj if they don't already exist.
+         * @param {Object} obj The receiver of the properties
+         * @param {Object} config The source of the properties
+         * @return {Object} returns obj
+         */
+        applyIf : function(o, c){
+            if(o){
+                for(var p in c){
+                    if(!Ext.isDefined(o[p])){
+                        o[p] = c[p];
+                    }
+                }
+            }
+            return o;
+        },
+
+        /**
+         * Generates unique ids. If the element already has an id, it is unchanged
+         * @param {Mixed} el (optional) The element to generate an id for
+         * @param {String} prefix (optional) Id prefix (defaults "ext-gen")
+         * @return {String} The generated Id.
+         */
+        id : function(el, prefix){
+            el = Ext.getDom(el, true) || {};
+            if (!el.id) {
+                el.id = (prefix || "ext-gen") + (++idSeed);
+            }
+            return el.id;
+        },
+
+        /**
+         * <p>Extends one class to create a subclass and optionally overrides members with the passed literal. This method
+         * also adds the function "override()" to the subclass that can be used to override members of the class.</p>
+         * For example, to create a subclass of Ext GridPanel:
+         * <pre><code>
+MyGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    constructor: function(config) {
+
+//      Create configuration for this Grid.
+        var store = new Ext.data.Store({...});
+        var colModel = new Ext.grid.ColumnModel({...});
+
+//      Create a new config object containing our computed properties
+//      *plus* whatever was in the config parameter.
+        config = Ext.apply({
+            store: store,
+            colModel: colModel
+        }, config);
+
+        MyGridPanel.superclass.constructor.call(this, config);
+
+//      Your postprocessing here
+    },
+
+    yourMethod: function() {
+        // etc.
+    }
+});
+</code></pre>
+         *
+         * <p>This function also supports a 3-argument call in which the subclass's constructor is
+         * passed as an argument. In this form, the parameters are as follows:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><code>subclass</code> : Function <div class="sub-desc">The subclass constructor.</div></li>
+         * <li><code>superclass</code> : Function <div class="sub-desc">The constructor of class being extended</div></li>
+         * <li><code>overrides</code> : Object <div class="sub-desc">A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared among all instances of the new class.</div></li>
+         * </ul></div>
+         *
+         * @param {Function} superclass The constructor of class being extended.
+         * @param {Object} overrides <p>A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared between all instances of the new class.</p>
+         * <p>This may contain a special member named <tt><b>constructor</b></tt>. This is used
+         * to define the constructor of the new class, and is returned. If this property is
+         * <i>not</i> specified, a constructor is generated and returned which just calls the
+         * superclass's constructor passing on its parameters.</p>
+         * <p><b>It is essential that you call the superclass constructor in any provided constructor. See example code.</b></p>
+         * @return {Function} The subclass constructor from the <code>overrides</code> parameter, or a generated one if not provided.
+         */
+        extend : function(){
+            // inline overrides
+            var io = function(o){
+                for(var m in o){
+                    this[m] = o[m];
+                }
+            };
+            var oc = Object.prototype.constructor;
+
+            return function(sb, sp, overrides){
+                if(typeof sp == 'object'){
+                    overrides = sp;
+                    sp = sb;
+                    sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
+                }
+                var F = function(){},
+                    sbp,
+                    spp = sp.prototype;
+
+                F.prototype = spp;
+                sbp = sb.prototype = new F();
+                sbp.constructor=sb;
+                sb.superclass=spp;
+                if(spp.constructor == oc){
+                    spp.constructor=sp;
+                }
+                sb.override = function(o){
+                    Ext.override(sb, o);
+                };
+                sbp.superclass = sbp.supr = (function(){
+                    return spp;
+                });
+                sbp.override = io;
+                Ext.override(sb, overrides);
+                sb.extend = function(o){return Ext.extend(sb, o);};
+                return sb;
+            };
+        }(),
+
+        /**
+         * Adds a list of functions to the prototype of an existing class, overwriting any existing methods with the same name.
+         * Usage:<pre><code>
+Ext.override(MyClass, {
+    newMethod1: function(){
+        // etc.
+    },
+    newMethod2: function(foo){
+        // etc.
+    }
+});
+</code></pre>
+         * @param {Object} origclass The class to override
+         * @param {Object} overrides The list of functions to add to origClass.  This should be specified as an object literal
+         * containing one or more methods.
+         * @method override
+         */
+        override : function(origclass, overrides){
+            if(overrides){
+                var p = origclass.prototype;
+                Ext.apply(p, overrides);
+                if(Ext.isIE && overrides.hasOwnProperty('toString')){
+                    p.toString = overrides.toString;
+                }
+            }
+        },
+
+        /**
+         * Creates namespaces to be used for scoping variables and classes so that they are not global.
+         * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+         * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+         * @param {String} namespace1
+         * @param {String} namespace2
+         * @param {String} etc
+         * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+         * @method namespace
+         */
+        namespace : function(){
+            var len1 = arguments.length,
+                i = 0,
+                len2,
+                j,
+                main,
+                ns,
+                sub,
+                current;
+                
+            for(; i < len1; ++i) {
+                main = arguments[i];
+                ns = arguments[i].split('.');
+                current = window[ns[0]];
+                if (current === undefined) {
+                    current = window[ns[0]] = {};
+                }
+                sub = ns.slice(1);
+                len2 = sub.length;
+                for(j = 0; j < len2; ++j) {
+                    current = current[sub[j]] = current[sub[j]] || {};
+                }
+            }
+            return current;
+        },
+
+        /**
+         * Takes an object and converts it to an encoded URL. e.g. Ext.urlEncode({foo: 1, bar: 2}); would return "foo=1&bar=2".  Optionally, property values can be arrays, instead of keys and the resulting string that's returned will contain a name/value pair for each array value.
+         * @param {Object} o
+         * @param {String} pre (optional) A prefix to add to the url encoded string
+         * @return {String}
+         */
+        urlEncode : function(o, pre){
+            var empty,
+                buf = [],
+                e = encodeURIComponent;
+
+            Ext.iterate(o, function(key, item){
+                empty = Ext.isEmpty(item);
+                Ext.each(empty ? key : item, function(val){
+                    buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
+                });
+            });
+            if(!pre){
+                buf.shift();
+                pre = '';
+            }
+            return pre + buf.join('');
+        },
+
+        /**
+         * Takes an encoded URL and and converts it to an object. Example: <pre><code>
+Ext.urlDecode("foo=1&bar=2"); // returns {foo: "1", bar: "2"}
+Ext.urlDecode("foo=1&bar=2&bar=3&bar=4", false); // returns {foo: "1", bar: ["2", "3", "4"]}
+</code></pre>
+         * @param {String} string
+         * @param {Boolean} overwrite (optional) Items of the same name will overwrite previous values instead of creating an an array (Defaults to false).
+         * @return {Object} A literal with members
+         */
+        urlDecode : function(string, overwrite){
+            if(Ext.isEmpty(string)){
+                return {};
+            }
+            var obj = {},
+                pairs = string.split('&'),
+                d = decodeURIComponent,
+                name,
+                value;
+            Ext.each(pairs, function(pair) {
+                pair = pair.split('=');
+                name = d(pair[0]);
+                value = d(pair[1]);
+                obj[name] = overwrite || !obj[name] ? value :
+                            [].concat(obj[name]).concat(value);
+            });
+            return obj;
+        },
+
+        /**
+         * Appends content to the query string of a URL, handling logic for whether to place
+         * a question mark or ampersand.
+         * @param {String} url The URL to append to.
+         * @param {String} s The content to append to the URL.
+         * @return (String) The resulting URL
+         */
+        urlAppend : function(url, s){
+            if(!Ext.isEmpty(s)){
+                return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
+            }
+            return url;
+        },
+
+        /**
+         * Converts any iterable (numeric indices and a length property) into a true array
+         * Don't use this on strings. IE doesn't support "abc"[0] which this implementation depends on.
+         * For strings, use this instead: "abc".match(/./g) => [a,b,c];
+         * @param {Iterable} the iterable object to be turned into a true Array.
+         * @return (Array) array
+         */
+         toArray : function(){
+             return isIE ?
+                 function(a, i, j, res){
+                     res = [];
+                     for(var x = 0, len = a.length; x < len; x++) {
+                         res.push(a[x]);
+                     }
+                     return res.slice(i || 0, j || res.length);
+                 } :
+                 function(a, i, j){
+                     return Array.prototype.slice.call(a, i || 0, j || a.length);
+                 };
+         }(),
+
+        isIterable : function(v){
+            //check for array or arguments
+            if(Ext.isArray(v) || v.callee){
+                return true;
+            }
+            //check for node list type
+            if(/NodeList|HTMLCollection/.test(toString.call(v))){
+                return true;
+            }
+            //NodeList has an item and length property
+            //IXMLDOMNodeList has nextNode method, needs to be checked first.
+            return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length));
+        },
+
+        /**
+         * Iterates an array calling the supplied function.
+         * @param {Array/NodeList/Mixed} array The array to be iterated. If this
+         * argument is not really an array, the supplied function is called once.
+         * @param {Function} fn The function to be called with each item. If the
+         * supplied function returns false, iteration stops and this method returns
+         * the current <code>index</code>. This function is called with
+         * the following arguments:
+         * <div class="mdetail-params"><ul>
+         * <li><code>item</code> : <i>Mixed</i>
+         * <div class="sub-desc">The item at the current <code>index</code>
+         * in the passed <code>array</code></div></li>
+         * <li><code>index</code> : <i>Number</i>
+         * <div class="sub-desc">The current index within the array</div></li>
+         * <li><code>allItems</code> : <i>Array</i>
+         * <div class="sub-desc">The <code>array</code> passed as the first
+         * argument to <code>Ext.each</code>.</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed.
+         * Defaults to the <code>item</code> at the current <code>index</code>
+         * within the passed <code>array</code>.
+         * @return See description for the fn parameter.
+         */
+        each : function(array, fn, scope){
+            if(Ext.isEmpty(array, true)){
+                return;
+            }
+            if(!Ext.isIterable(array) || Ext.isPrimitive(array)){
+                array = [array];
+            }
+            for(var i = 0, len = array.length; i < len; i++){
+                if(fn.call(scope || array[i], array[i], i, array) === false){
+                    return i;
+                };
+            }
+        },
+
+        /**
+         * Iterates either the elements in an array, or each of the properties in an object.
+         * <b>Note</b>: If you are only iterating arrays, it is better to call {@link #each}.
+         * @param {Object/Array} object The object or array to be iterated
+         * @param {Function} fn The function to be called for each iteration.
+         * The iteration will stop if the supplied function returns false, or
+         * all array elements / object properties have been covered. The signature
+         * varies depending on the type of object being interated:
+         * <div class="mdetail-params"><ul>
+         * <li>Arrays : <tt>(Object item, Number index, Array allItems)</tt>
+         * <div class="sub-desc">
+         * When iterating an array, the supplied function is called with each item.</div></li>
+         * <li>Objects : <tt>(String key, Object value, Object)</tt>
+         * <div class="sub-desc">
+         * When iterating an object, the supplied function is called with each key-value pair in
+         * the object, and the iterated object</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed. Defaults to
+         * the <code>object</code> being iterated.
+         */
+        iterate : function(obj, fn, scope){
+            if(Ext.isEmpty(obj)){
+                return;
+            }
+            if(Ext.isIterable(obj)){
+                Ext.each(obj, fn, scope);
+                return;
+            }else if(typeof obj == 'object'){
+                for(var prop in obj){
+                    if(obj.hasOwnProperty(prop)){
+                        if(fn.call(scope || obj, prop, obj[prop], obj) === false){
+                            return;
+                        };
+                    }
+                }
+            }
+        },
+
+        /**
+         * Return the dom node for the passed String (id), dom node, or Ext.Element.
+         * Optional 'strict' flag is needed for IE since it can return 'name' and
+         * 'id' elements by using getElementById.
+         * Here are some examples:
+         * <pre><code>
+// gets dom node based on id
+var elDom = Ext.getDom('elId');
+// gets dom node based on the dom node
+var elDom1 = Ext.getDom(elDom);
+
+// If we don&#39;t know if we are working with an
+// Ext.Element or a dom node use Ext.getDom
+function(el){
+    var dom = Ext.getDom(el);
+    // do something with the dom node
+}
+         * </code></pre>
+         * <b>Note</b>: the dom node to be found actually needs to exist (be rendered, etc)
+         * when this method is called to be successful.
+         * @param {Mixed} el
+         * @return HTMLElement
+         */
+        getDom : function(el, strict){
+            if(!el || !DOC){
+                return null;
+            }
+            if (el.dom){
+                return el.dom;
+            } else {
+                if (typeof el == 'string') {
+                    var e = DOC.getElementById(el);
+                    // IE returns elements with the 'name' and 'id' attribute.
+                    // we do a strict check to return the element with only the id attribute
+                    if (e && isIE && strict) {
+                        if (el == e.getAttribute('id')) {
+                            return e;
+                        } else {
+                            return null;
+                        }
+                    }
+                    return e;
+                } else {
+                    return el;
+                }
+            }
+        },
+
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getBody : function(){
+            return Ext.get(DOC.body || DOC.documentElement);
+        },
+        
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getHead : function() {
+            var head;
+            
+            return function() {
+                if (head == undefined) {
+                    head = Ext.get(DOC.getElementsByTagName("head")[0]);
+                }
+                
+                return head;
+            };
+        }(),
+
+        /**
+         * Removes a DOM node from the document.
+         */
+        /**
+         * <p>Removes this element from the document, removes all DOM event listeners, and deletes the cache reference.
+         * All DOM event listeners are removed from this element. If {@link Ext#enableNestedListenerRemoval} is
+         * <code>true</code>, then DOM event listeners are also removed from all child nodes. The body node
+         * will be ignored if passed in.</p>
+         * @param {HTMLElement} node The node to remove
+         */
+        removeNode : isIE && !isIE8 ? function(){
+            var d;
+            return function(n){
+                if(n && n.tagName != 'BODY'){
+                    (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                    d = d || DOC.createElement('div');
+                    d.appendChild(n);
+                    d.innerHTML = '';
+                    delete Ext.elCache[n.id];
+                }
+            };
+        }() : function(n){
+            if(n && n.parentNode && n.tagName != 'BODY'){
+                (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                n.parentNode.removeChild(n);
+                delete Ext.elCache[n.id];
+            }
+        },
+
+        /**
+         * <p>Returns true if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Boolean} allowBlank (optional) true to allow empty strings (defaults to false)
+         * @return {Boolean}
+         */
+        isEmpty : function(v, allowBlank){
+            return v === null || v === undefined || ((Ext.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript array, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isArray : function(v){
+            return toString.apply(v) === '[object Array]';
+        },
+
+        /**
+         * Returns true if the passed object is a JavaScript date object, otherwise false.
+         * @param {Object} object The object to test
+         * @return {Boolean}
+         */
+        isDate : function(v){
+            return toString.apply(v) === '[object Date]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Object, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isObject : function(v){
+            return !!v && Object.prototype.toString.call(v) === '[object Object]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isPrimitive : function(v){
+            return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Function, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isFunction : function(v){
+            return toString.apply(v) === '[object Function]';
+        },
+
+        /**
+         * Returns true if the passed value is a number. Returns false for non-finite numbers.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isNumber : function(v){
+            return typeof v === 'number' && isFinite(v);
+        },
+
+        /**
+         * Returns true if the passed value is a string.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isString : function(v){
+            return typeof v === 'string';
+        },
+
+        /**
+         * Returns true if the passed value is a boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isBoolean : function(v){
+            return typeof v === 'boolean';
+        },
+
+        /**
+         * Returns true if the passed value is an HTMLElement
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isElement : function(v) {
+            return v ? !!v.tagName : false;
+        },
+
+        /**
+         * Returns true if the passed value is not undefined.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isDefined : function(v){
+            return typeof v !== 'undefined';
+        },
+
+        /**
+         * True if the detected browser is Opera.
+         * @type Boolean
+         */
+        isOpera : isOpera,
+        /**
+         * True if the detected browser uses WebKit.
+         * @type Boolean
+         */
+        isWebKit : isWebKit,
+        /**
+         * True if the detected browser is Chrome.
+         * @type Boolean
+         */
+        isChrome : isChrome,
+        /**
+         * True if the detected browser is Safari.
+         * @type Boolean
+         */
+        isSafari : isSafari,
+        /**
+         * True if the detected browser is Safari 3.x.
+         * @type Boolean
+         */
+        isSafari3 : isSafari3,
+        /**
+         * True if the detected browser is Safari 4.x.
+         * @type Boolean
+         */
+        isSafari4 : isSafari4,
+        /**
+         * True if the detected browser is Safari 2.x.
+         * @type Boolean
+         */
+        isSafari2 : isSafari2,
+        /**
+         * True if the detected browser is Internet Explorer.
+         * @type Boolean
+         */
+        isIE : isIE,
+        /**
+         * True if the detected browser is Internet Explorer 6.x.
+         * @type Boolean
+         */
+        isIE6 : isIE6,
+        /**
+         * True if the detected browser is Internet Explorer 7.x.
+         * @type Boolean
+         */
+        isIE7 : isIE7,
+        /**
+         * True if the detected browser is Internet Explorer 8.x.
+         * @type Boolean
+         */
+        isIE8 : isIE8,
+        /**
+         * True if the detected browser is Internet Explorer 9.x.
+         * @type Boolean
+         */
+        isIE9 : isIE9,
+        /**
+         * True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).
+         * @type Boolean
+         */
+        isGecko : isGecko,
+        /**
+         * True if the detected browser uses a pre-Gecko 1.9 layout engine (e.g. Firefox 2.x).
+         * @type Boolean
+         */
+        isGecko2 : isGecko2,
+        /**
+         * True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).
+         * @type Boolean
+         */
+        isGecko3 : isGecko3,
+        /**
+         * True if the detected browser is Internet Explorer running in non-strict mode.
+         * @type Boolean
+         */
+        isBorderBox : isBorderBox,
+        /**
+         * True if the detected platform is Linux.
+         * @type Boolean
+         */
+        isLinux : isLinux,
+        /**
+         * True if the detected platform is Windows.
+         * @type Boolean
+         */
+        isWindows : isWindows,
+        /**
+         * True if the detected platform is Mac OS.
+         * @type Boolean
+         */
+        isMac : isMac,
+        /**
+         * True if the detected platform is Adobe Air.
+         * @type Boolean
+         */
+        isAir : isAir
+    });
+
+    /**
+     * Creates namespaces to be used for scoping variables and classes so that they are not global.
+     * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+     * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+     * @param {String} namespace1
+     * @param {String} namespace2
+     * @param {String} etc
+     * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+     * @method ns
+     */
+    Ext.ns = Ext.namespace;
+})();
+
+Ext.ns('Ext.util', 'Ext.lib', 'Ext.data', 'Ext.supports');
+
+Ext.elCache = {};
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+     /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = sayHi.createInterceptor(function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+</code></pre>
+     * @param {Function} fcn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor : function(fcn, scope){
+        var method = this;
+        return !Ext.isFunction(fcn) ?
+                this :
+                function() {
+                    var me = this,
+                        args = arguments;
+                    fcn.target = me;
+                    fcn.method = method;
+                    return (fcn.apply(scope || me || window, args) !== false) ?
+                            method.apply(me || window, args) :
+                            null;
+                };
+    },
+
+     /**
+     * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+     * Call directly on any function. Example: <code>myFunction.createCallback(arg1, arg2)</code>
+     * Will create a function that is bound to those 2 args. <b>If a specific scope is required in the
+     * callback, use {@link #createDelegate} instead.</b> The function returned by createCallback always
+     * executes in the window scope.
+     * <p>This method is required when you want to pass arguments to a callback function.  If no arguments
+     * are needed, you can simply pass a reference to the function as a callback (e.g., callback: myFn).
+     * However, if you tried to pass a function with arguments (e.g., callback: myFn(arg1, arg2)) the function
+     * would simply execute immediately when the code is parsed. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// clicking the button alerts "Hi, Fred"
+new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody(),
+    handler: sayHi.createCallback('Fred')
+});
+</code></pre>
+     * @return {Function} The new function
+    */
+    createCallback : function(/*args...*/){
+        // make args available, in function below
+        var args = arguments,
+            method = this;
+        return function() {
+            return method.apply(window, args);
+        };
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>this.myFunction.createDelegate(this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', sayHi.createDelegate(btn, ['Fred']));
+</code></pre>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate : function(obj, args, appendArgs){
+        var method = this;
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true){
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }else if (Ext.isNumber(appendArgs)){
+                callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args); // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+            }
+            return method.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+sayHi.defer(2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+(function(){
+    alert('Anonymous');
+}).defer(100);
+</code></pre>
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer : function(millis, obj, args, appendArgs){
+        var fn = this.createDelegate(obj, args, appendArgs);
+        if(millis > 0){
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    }
+});
+
+/**
+ * @class String
+ * These functions are available on every String object.
+ */
+Ext.applyIf(String, {
+    /**
+     * Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens.  Each
+     * token must be unique, and must increment in the format {0}, {1}, etc.  Example usage:
+     * <pre><code>
+var cls = 'my-class', text = 'Some text';
+var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);
+// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'
+     * </code></pre>
+     * @param {String} string The tokenized string to be formatted
+     * @param {String} value1 The value to replace token {0}
+     * @param {String} value2 Etc...
+     * @return {String} The formatted string
+     * @static
+     */
+    format : function(format){
+        var args = Ext.toArray(arguments, 1);
+        return format.replace(/\{(\d+)\}/g, function(m, i){
+            return args[i];
+        });
+    }
+});
+
+/**
+ * @class Array
+ */
+Ext.applyIf(Array.prototype, {
+    /**
+     * Checks whether or not the specified object exists in the array.
+     * @param {Object} o The object to check for
+     * @param {Number} from (Optional) The index at which to begin the search
+     * @return {Number} The index of o in the array (or -1 if it is not found)
+     */
+    indexOf : function(o, from){
+        var len = this.length;
+        from = from || 0;
+        from += (from < 0) ? len : 0;
+        for (; from < len; ++from){
+            if(this[from] === o){
+                return from;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Removes the specified object from the array.  If the object is not found nothing happens.
+     * @param {Object} o The object to remove
+     * @return {Array} this array
+     */
+    remove : function(o){
+        var index = this.indexOf(o);
+        if(index != -1){
+            this.splice(index, 1);
+        }
+        return this;
+    }
+});
+/**
+ * @class Ext.util.TaskRunner
+ * Provides the ability to execute one or more arbitrary tasks in a multithreaded
+ * manner.  Generally, you can use the singleton {@link Ext.TaskMgr} instead, but
+ * if needed, you can create separate instances of TaskRunner.  Any number of
+ * separate tasks can be started at any time and will run independently of each
+ * other. Example usage:
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var updateClock = function(){
+    Ext.fly('clock').update(new Date().format('g:i:s A'));
+} 
+var task = {
+    run: updateClock,
+    interval: 1000 //1 second
+}
+var runner = new Ext.util.TaskRunner();
+runner.start(task);
+
+// equivalent using TaskMgr
+Ext.TaskMgr.start({
+    run: updateClock,
+    interval: 1000
+});
+
+ * </code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * Also see {@link Ext.util.DelayedTask}. 
+ * 
+ * @constructor
+ * @param {Number} interval (optional) The minimum precision in milliseconds supported by this TaskRunner instance
+ * (defaults to 10)
+ */
+Ext.util.TaskRunner = function(interval){
+    interval = interval || 10;
+    var tasks = [], 
+    	removeQueue = [],
+    	id = 0,
+    	running = false,
+
+    	// private
+    	stopThread = function(){
+	        running = false;
+	        clearInterval(id);
+	        id = 0;
+	    },
+
+    	// private
+    	startThread = function(){
+	        if(!running){
+	            running = true;
+	            id = setInterval(runTasks, interval);
+	        }
+	    },
+
+    	// private
+    	removeTask = function(t){
+	        removeQueue.push(t);
+	        if(t.onStop){
+	            t.onStop.apply(t.scope || t);
+	        }
+	    },
+	    
+    	// private
+    	runTasks = function(){
+	    	var rqLen = removeQueue.length,
+	    		now = new Date().getTime();	    			    		
+	    
+	        if(rqLen > 0){
+	            for(var i = 0; i < rqLen; i++){
+	                tasks.remove(removeQueue[i]);
+	            }
+	            removeQueue = [];
+	            if(tasks.length < 1){
+	                stopThread();
+	                return;
+	            }
+	        }	        
+	        for(var i = 0, t, itime, rt, len = tasks.length; i < len; ++i){
+	            t = tasks[i];
+	            itime = now - t.taskRunTime;
+	            if(t.interval <= itime){
+	                rt = t.run.apply(t.scope || t, t.args || [++t.taskRunCount]);
+	                t.taskRunTime = now;
+	                if(rt === false || t.taskRunCount === t.repeat){
+	                    removeTask(t);
+	                    return;
+	                }
+	            }
+	            if(t.duration && t.duration <= (now - t.taskStartTime)){
+	                removeTask(t);
+	            }
+	        }
+	    };
+
+    /**
+     * Starts a new task.
+     * @method start
+     * @param {Object} task <p>A config object that supports the following properties:<ul>
+     * <li><code>run</code> : Function<div class="sub-desc"><p>The function to execute each time the task is invoked. The
+     * function will be called at each interval and passed the <code>args</code> argument if specified, and the
+     * current invocation count if not.</p>
+     * <p>If a particular scope (<code>this</code> reference) is required, be sure to specify it using the <code>scope</code> argument.</p>
+     * <p>Return <code>false</code> from this function to terminate the task.</p></div></li>
+     * <li><code>interval</code> : Number<div class="sub-desc">The frequency in milliseconds with which the task
+     * should be invoked.</div></li>
+     * <li><code>args</code> : Array<div class="sub-desc">(optional) An array of arguments to be passed to the function
+     * specified by <code>run</code>. If not specified, the current invocation count is passed.</div></li>
+     * <li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<tt>this</tt> reference) in which to execute the
+     * <code>run</code> function. Defaults to the task config object.</div></li>
+     * <li><code>duration</code> : Number<div class="sub-desc">(optional) The length of time in milliseconds to invoke
+     * the task before stopping automatically (defaults to indefinite).</div></li>
+     * <li><code>repeat</code> : Number<div class="sub-desc">(optional) The number of times to invoke the task before
+     * stopping automatically (defaults to indefinite).</div></li>
+     * </ul></p>
+     * <p>Before each invocation, Ext injects the property <code>taskRunCount</code> into the task object so
+     * that calculations based on the repeat count can be performed.</p>
+     * @return {Object} The task
+     */
+    this.start = function(task){
+        tasks.push(task);
+        task.taskStartTime = new Date().getTime();
+        task.taskRunTime = 0;
+        task.taskRunCount = 0;
+        startThread();
+        return task;
+    };
+
+    /**
+     * Stops an existing running task.
+     * @method stop
+     * @param {Object} task The task to stop
+     * @return {Object} The task
+     */
+    this.stop = function(task){
+        removeTask(task);
+        return task;
+    };
+
+    /**
+     * Stops all tasks that are currently running.
+     * @method stopAll
+     */
+    this.stopAll = function(){
+        stopThread();
+        for(var i = 0, len = tasks.length; i < len; i++){
+            if(tasks[i].onStop){
+                tasks[i].onStop();
+            }
+        }
+        tasks = [];
+        removeQueue = [];
+    };
+};
+
+/**
+ * @class Ext.TaskMgr
+ * @extends Ext.util.TaskRunner
+ * A static {@link Ext.util.TaskRunner} instance that can be used to start and stop arbitrary tasks.  See
+ * {@link Ext.util.TaskRunner} for supported methods and task config properties.
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var task = {
+    run: function(){
+        Ext.fly('clock').update(new Date().format('g:i:s A'));
+    },
+    interval: 1000 //1 second
+}
+Ext.TaskMgr.start(task);
+</code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * @singleton
+ */
+Ext.TaskMgr = new Ext.util.TaskRunner();if(typeof YAHOO == "undefined"){
+    throw "Unable to load Ext, core YUI utilities (yahoo, dom, event) not found.";
+}
+
+(function(){
+    var E = YAHOO.util.Event,
+        D = YAHOO.util.Dom,
+        CN = YAHOO.util.Connect,
+        ES = YAHOO.util.Easing,
+        A = YAHOO.util.Anim,
+        libFlyweight,
+        version = YAHOO.env.getVersion('yahoo').version.split('.'),
+        mouseEnterSupported = parseInt(version[0], 10) >= 3,
+        mouseCache = {},
+        elContains = function(parent, child){
+            if(parent && parent.firstChild){
+                while(child){
+                    if(child === parent){
+                        return true;
+                    }
+                    child = child.parentNode;
+                    if(child && (child.nodeType != 1)){
+                        child = null;
+                    }
+                }
+            }
+            return false;
+        }, checkRelatedTarget = function(e){
+            return !elContains(e.currentTarget, Ext.lib.Event.getRelatedTarget(e));
+        };
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        return full ? D.getDocumentWidth() : D.getViewportWidth();
+    },
+
+    getViewHeight : function(full){
+        return full ? D.getDocumentHeight() : D.getViewportHeight();
+    },
+
+    isAncestor : function(haystack, needle){
+        return D.isAncestor(haystack, needle);
+    },
+
+    getRegion : function(el){
+        return D.getRegion(el);
+    },
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    // original version based on YahooUI getXY
+    // this version fixes several issues in Safari and FF
+    // and boosts performance by removing the batch overhead, repetitive dom lookups and array index calls
+    getXY : function(el){
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+Ext.lib.Event = {
+    getPageX : function(e){
+        return E.getPageX(e.browserEvent || e);
+    },
+
+    getPageY : function(e){
+        return E.getPageY(e.browserEvent || e);
+    },
+
+    getXY : function(e){
+        return E.getXY(e.browserEvent || e);
+    },
+
+    getTarget : function(e){
+        return E.getTarget(e.browserEvent || e);
+    },
+
+    getRelatedTarget : function(e){
+        return E.getRelatedTarget(e.browserEvent || e);
+    },
+
+    on : function(el, eventName, fn, scope, override){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id] || (mouseCache[el.id] = {});
+            item[eventName] = fn;
+            fn = fn.createInterceptor(checkRelatedTarget);
+            eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+        }
+        E.on(el, eventName, fn, scope, override);
+    },
+
+    un : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id], 
+                ev = item && item[eventName];
+
+            if(ev){
+                fn = ev.fn;
+                delete item[eventName];
+                eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+            }
+        }
+        E.removeListener(el, eventName, fn);;
+    },
+
+    purgeElement : function(el){
+        E.purgeElement(el);
+    },
+
+    preventDefault : function(e){
+        E.preventDefault(e.browserEvent || e);
+    },
+
+    stopPropagation : function(e){
+        E.stopPropagation(e.browserEvent || e);
+    },
+
+    stopEvent : function(e){
+        E.stopEvent(e.browserEvent || e);
+    },
+
+    onAvailable : function(el, fn, scope, override){
+        return E.onAvailable(el, fn, scope, override);
+    }
+};
+
+Ext.lib.Ajax = {
+    request : function(method, uri, cb, data, options){
+        if(options){
+            var hs = options.headers;
+            if(hs){
+                for(var h in hs){
+                    if(hs.hasOwnProperty(h)){
+                        CN.initHeader(h, hs[h], false);
+                    }
+                }
+            }
+            if(options.xmlData){
+                if (!hs || !hs['Content-Type']){
+                    CN.initHeader('Content-Type', 'text/xml', false);
+                }
+                method = (method ? method : (options.method ? options.method : 'POST'));
+                data = options.xmlData;
+            }else if(options.jsonData){
+                if (!hs || !hs['Content-Type']){
+                    CN.initHeader('Content-Type', 'application/json', false);
+                }
+                method = (method ? method : (options.method ? options.method : 'POST'));
+                data = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+            }
+        }
+        return CN.asyncRequest(method, uri, cb, data);
+    },
+
+    formRequest : function(form, uri, cb, data, isUpload, sslUri){
+        CN.setForm(form, isUpload, sslUri);
+        return CN.asyncRequest(Ext.getDom(form).method ||'POST', uri, cb, data);
+    },
+
+    isCallInProgress : function(trans){
+        return CN.isCallInProgress(trans);
+    },
+
+    abort : function(trans){
+        return CN.abort(trans);
+    },
+
+    serializeForm : function(form){
+        var d = CN.setForm(form.dom || form);
+        CN.resetFormState();
+        return d;
+    }
+};
+
+Ext.lib.Region = YAHOO.util.Region;
+Ext.lib.Point = YAHOO.util.Point;
+
+
+Ext.lib.Anim = {
+    scroll : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.Scroll);
+    },
+
+    motion : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.Motion);
+    },
+
+    color : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.ColorAnim);
+    },
+
+    run : function(el, args, duration, easing, cb, scope, type){
+        type = type || YAHOO.util.Anim;
+        if(typeof easing == "string"){
+            easing = YAHOO.util.Easing[easing];
+        }
+        var anim = new type(el, args, duration, easing);
+        anim.animateX(function(){
+            Ext.callback(cb, scope);
+        });
+        return anim;
+    }
+};
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+// various overrides
+
+// add ability for callbacks with animations
+if(YAHOO.util.Anim){
+    YAHOO.util.Anim.prototype.animateX = function(callback, scope){
+        var f = function(){
+            this.onComplete.unsubscribe(f);
+            if(typeof callback == "function"){
+                callback.call(scope || this, this);
+            }
+        };
+        this.onComplete.subscribe(f, this, true);
+        this.animate();
+    };
+}
+
+if(YAHOO.util.DragDrop && Ext.dd.DragDrop){
+    YAHOO.util.DragDrop.defaultPadding = Ext.dd.DragDrop.defaultPadding;
+    YAHOO.util.DragDrop.constrainTo = Ext.dd.DragDrop.constrainTo;
+}
+
+YAHOO.util.Dom.getXY = function(el) {
+    var f = function(el) {
+        return Ext.lib.Dom.getXY(el);
+    };
+    return YAHOO.util.Dom.batch(el, f, YAHOO.util.Dom, true);
+};
+
+
+// workaround for Safari anim duration speed problems
+if(YAHOO.util.AnimMgr){
+    YAHOO.util.AnimMgr.fps = 1000;
+}
+
+YAHOO.util.Region.prototype.adjust = function(t, l, b, r){
+    this.top += t;
+    this.left += l;
+    this.right += r;
+    this.bottom += b;
+    return this;
+};
+    
+YAHOO.util.Region.prototype.constrainTo = function(r) {
+    this.top = this.top.constrain(r.top, r.bottom);
+    this.bottom = this.bottom.constrain(r.top, r.bottom);
+    this.left = this.left.constrain(r.left, r.right);
+    this.right = this.right.constrain(r.left, r.right);
+    return this;
+};
+
+
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/adapter/yui/ext-yui-adapter.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+window.undefined=window.undefined;Ext={version:"3.4.0",versionDetail:{major:3,minor:4,patch:0}};Ext.apply=function(d,e,b){if(b){Ext.apply(d,b)}if(d&&e&&typeof e=="object"){for(var a in e){d[a]=e[a]}}return d};(function(){var g=0,u=Object.prototype.toString,v=navigator.userAgent.toLowerCase(),A=function(e){return e.test(v)},i=document,n=i.documentMode,l=i.compatMode=="CSS1Compat",C=A(/opera/),h=A(/\bchrome\b/),w=A(/webkit/),z=!h&&A(/safari/),f=z&&A(/applewebkit\/4/),b=z&&A(/version\/3/),D=z&&A(/version\/4/),t=!C&&A(/msie/),r=t&&(A(/msie 7/)||n==7),q=t&&(A(/msie 8/)&&n!=7),p=t&&A(/msie 9/),s=t&&!r&&!q&&!p,o=!w&&A(/gecko/),d=o&&A(/rv:1\.8/),a=o&&A(/rv:1\.9/),x=t&&!l,B=A(/windows|win32/),k=A(/macintosh|mac os x/),j=A(/adobeair/),m=A(/linux/),c=/^https/i.test(window.location.protocol);if(s){try{i.execCommand("BackgroundImageCache",false,true)}catch(y){}}Ext.apply(Ext,{SSL_SECURE_URL:c&&t?'javascript:""':"about:blank",isStrict:l,isSecure:c,isReady:false,enableForcedBoxModel:false,enableGarbageCollector:true,enableListenerCollection:false,enableNestedListenerRemoval:false,USE_NATIVE_JSON:false,applyIf:function(E,F){if(E){for(var e in F){if(!Ext.isDefined(E[e])){E[e]=F[e]}}}return E},id:function(e,E){e=Ext.getDom(e,true)||{};if(!e.id){e.id=(E||"ext-gen")+(++g)}return e.id},extend:function(){var E=function(G){for(var F in G){this[F]=G[F]}};var e=Object.prototype.constructor;return function(L,I,K){if(typeof I=="object"){K=I;I=L;L=K.constructor!=e?K.constructor:function(){I.apply(this,arguments)}}var H=function(){},J,G=I.prototype;H.prototype=G;J=L.prototype=new H();J.constructor=L;L.superclass=G;if(G.constructor==e){G.constructor=I}L.override=function(F){Ext.override(L,F)};J.superclass=J.supr=(function(){return G});J.override=E;Ext.override(L,K);L.extend=function(F){return Ext.extend(L,F)};return L}}(),override:function(e,F){if(F){var E=e.prototype;Ext.apply(E,F);if(Ext.isIE&&F.hasOwnProperty("toString")){E.toString=F.toString}}},namespace:function(){var G=arguments.length,H=0,E,F,e,J,I,K;for(;H<G;++H){e=arguments[H];J=arguments[H].split(".");K=window[J[0]];if(K===undefined){K=window[J[0]]={}}I=J.slice(1);E=I.length;for(F=0;F<E;++F){K=K[I[F]]=K[I[F]]||{}}}return K},urlEncode:function(I,H){var F,E=[],G=encodeURIComponent;Ext.iterate(I,function(e,J){F=Ext.isEmpty(J);Ext.each(F?e:J,function(K){E.push("&",G(e),"=",(!Ext.isEmpty(K)&&(K!=e||!F))?(Ext.isDate(K)?Ext.encode(K).replace(/"/g,""):G(K)):"")})});if(!H){E.shift();H=""}return H+E.join("")},urlDecode:function(F,E){if(Ext.isEmpty(F)){return{}}var I={},H=F.split("&"),J=decodeURIComponent,e,G;Ext.each(H,function(K){K=K.split("=");e=J(K[0]);G=J(K[1]);I[e]=E||!I[e]?G:[].concat(I[e]).concat(G)});return I},urlAppend:function(e,E){if(!Ext.isEmpty(E)){return e+(e.indexOf("?")===-1?"?":"&")+E}return e},toArray:function(){return t?function(F,I,G,H){H=[];for(var E=0,e=F.length;E<e;E++){H.push(F[E])}return H.slice(I||0,G||H.length)}:function(e,F,E){return Array.prototype.slice.call(e,F||0,E||e.length)}}(),isIterable:function(e){if(Ext.isArray(e)||e.callee){return true}if(/NodeList|HTMLCollection/.test(u.call(e))){return true}return((typeof e.nextNode!="undefined"||e.item)&&Ext.isNumber(e.length))},each:function(H,G,F){if(Ext.isEmpty(H,true)){return}if(!Ext.isIterable(H)||Ext.isPrimitive(H)){H=[H]}for(var E=0,e=H.length;E<e;E++){if(G.call(F||H[E],H[E],E,H)===false){return E}}},iterate:function(F,E,e){if(Ext.isEmpty(F)){return}if(Ext.isIterable(F)){Ext.each(F,E,e);return}else{if(typeof F=="object"){for(var G in F){if(F.hasOwnProperty(G)){if(E.call(e||F,G,F[G],F)===false){return}}}}}},getDom:function(F,E){if(!F||!i){return null}if(F.dom){return F.dom}else{if(typeof F=="string"){var G=i.getElementById(F);if(G&&t&&E){if(F==G.getAttribute("id")){return G}else{return null}}return G}else{return F}}},getBody:function(){return Ext.get(i.body||i.documentElement)},getHead:function(){var e;return function(){if(e==undefined){e=Ext.get(i.getElementsByTagName("head")[0])}return e}}(),removeNode:t&&!q?function(){var e;return function(E){if(E&&E.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(E,true):Ext.EventManager.removeAll(E);e=e||i.createElement("div");e.appendChild(E);e.innerHTML="";delete Ext.elCache[E.id]}}}():function(e){if(e&&e.parentNode&&e.tagName!="BODY"){(Ext.enableNestedListenerRemoval)?Ext.EventManager.purgeElement(e,true):Ext.EventManager.removeAll(e);e.parentNode.removeChild(e);delete Ext.elCache[e.id]}},isEmpty:function(E,e){return E===null||E===undefined||((Ext.isArray(E)&&!E.length))||(!e?E==="":false)},isArray:function(e){return u.apply(e)==="[object Array]"},isDate:function(e){return u.apply(e)==="[object Date]"},isObject:function(e){return !!e&&Object.prototype.toString.call(e)==="[object Object]"},isPrimitive:function(e){return Ext.isString(e)||Ext.isNumber(e)||Ext.isBoolean(e)},isFunction:function(e){return u.apply(e)==="[object Function]"},isNumber:function(e){return typeof e==="number"&&isFinite(e)},isString:function(e){return typeof e==="string"},isBoolean:function(e){return typeof e==="boolean"},isElement:function(e){return e?!!e.tagName:false},isDefined:function(e){return typeof e!=="undefined"},isOpera:C,isWebKit:w,isChrome:h,isSafari:z,isSafari3:b,isSafari4:D,isSafari2:f,isIE:t,isIE6:s,isIE7:r,isIE8:q,isIE9:p,isGecko:o,isGecko2:d,isGecko3:a,isBorderBox:x,isLinux:m,isWindows:B,isMac:k,isAir:j});Ext.ns=Ext.namespace})();Ext.ns("Ext.util","Ext.lib","Ext.data","Ext.supports");Ext.elCache={};Ext.apply(Function.prototype,{createInterceptor:function(b,a){var c=this;return !Ext.isFunction(b)?this:function(){var e=this,d=arguments;b.target=e;b.method=c;return(b.apply(a||e||window,d)!==false)?c.apply(e||window,d):null}},createCallback:function(){var a=arguments,b=this;return function(){return b.apply(window,a)}},createDelegate:function(c,b,a){var d=this;return function(){var f=b||arguments;if(a===true){f=Array.prototype.slice.call(arguments,0);f=f.concat(b)}else{if(Ext.isNumber(a)){f=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(f,e)}}return d.apply(c||window,f)}},defer:function(c,e,b,a){var d=this.createDelegate(e,b,a);if(c>0){return setTimeout(d,c)}d();return 0}});Ext.applyIf(String,{format:function(b){var a=Ext.toArray(arguments,1);return b.replace(/\{(\d+)\}/g,function(c,d){return a[d]})}});Ext.applyIf(Array.prototype,{indexOf:function(b,c){var a=this.length;c=c||0;c+=(c<0)?a:0;for(;c<a;++c){if(this[c]===b){return c}}return -1},remove:function(b){var a=this.indexOf(b);if(a!=-1){this.splice(a,1)}return this}});Ext.util.TaskRunner=function(e){e=e||10;var f=[],a=[],b=0,g=false,d=function(){g=false;clearInterval(b);b=0},h=function(){if(!g){g=true;b=setInterval(i,e)}},c=function(j){a.push(j);if(j.onStop){j.onStop.apply(j.scope||j)}},i=function(){var l=a.length,n=new Date().getTime();if(l>0){for(var p=0;p<l;p++){f.remove(a[p])}a=[];if(f.length<1){d();return}}for(var p=0,o,k,m,j=f.length;p<j;++p){o=f[p];k=n-o.taskRunTime;if(o.interval<=k){m=o.run.apply(o.scope||o,o.args||[++o.taskRunCount]);o.taskRunTime=n;if(m===false||o.taskRunCount===o.repeat){c(o);return}}if(o.duration&&o.duration<=(n-o.taskStartTime)){c(o)}}};this.start=function(j){f.push(j);j.taskStartTime=new Date().getTime();j.taskRunTime=0;j.taskRunCount=0;h();return j};this.stop=function(j){c(j);return j};this.stopAll=function(){d();for(var k=0,j=f.length;k<j;k++){if(f[k].onStop){f[k].onStop()}}f=[];a=[]}};Ext.TaskMgr=new Ext.util.TaskRunner();if(typeof YAHOO=="undefined"){throw"Unable to load Ext, core YUI utilities (yahoo, dom, event) not found."}(function(){var m=YAHOO.util.Event,b=YAHOO.util.Dom,f=YAHOO.util.Connect,h=YAHOO.util.Easing,c=YAHOO.util.Anim,j,k=YAHOO.env.getVersion("yahoo").version.split("."),a=parseInt(k[0],10)>=3,l={},e=function(n,o){if(n&&n.firstChild){while(o){if(o===n){return true}o=o.parentNode;if(o&&(o.nodeType!=1)){o=null}}}return false},i=function(n){return !e(n.currentTarget,Ext.lib.Event.getRelatedTarget(n))};Ext.lib.Dom={getViewWidth:function(n){return n?b.getDocumentWidth():b.getViewportWidth()},getViewHeight:function(n){return n?b.getDocumentHeight():b.getViewportHeight()},isAncestor:function(n,o){return b.isAncestor(n,o)},getRegion:function(n){return b.getRegion(n)},getY:function(n){return this.getXY(n)[1]},getX:function(n){return this.getXY(n)[0]},getXY:function(q){var o,u,w,z,t=(document.body||document.documentElement);q=Ext.getDom(q);if(q==t){return[0,0]}if(q.getBoundingClientRect){w=q.getBoundingClientRect();z=g(document).getScroll();return[Math.round(w.left+z.left),Math.round(w.top+z.top)]}var A=0,v=0;o=q;var n=g(q).getStyle("position")=="absolute";while(o){A+=o.offsetLeft;v+=o.offsetTop;if(!n&&g(o).getStyle("position")=="absolute"){n=true}if(Ext.isGecko){u=g(o);var B=parseInt(u.getStyle("borderTopWidth"),10)||0;var r=parseInt(u.getStyle("borderLeftWidth"),10)||0;A+=r;v+=B;if(o!=q&&u.getStyle("overflow")!="visible"){A+=r;v+=B}}o=o.offsetParent}if(Ext.isSafari&&n){A-=t.offsetLeft;v-=t.offsetTop}if(Ext.isGecko&&!n){var s=g(t);A+=parseInt(s.getStyle("borderLeftWidth"),10)||0;v+=parseInt(s.getStyle("borderTopWidth"),10)||0}o=q.parentNode;while(o&&o!=t){if(!Ext.isOpera||(o.tagName!="TR"&&g(o).getStyle("display")!="inline")){A-=o.scrollLeft;v-=o.scrollTop}o=o.parentNode}return[A,v]},setXY:function(n,o){n=Ext.fly(n,"_setXY");n.position();var p=n.translatePoints(o);if(o[0]!==false){n.dom.style.left=p.left+"px"}if(o[1]!==false){n.dom.style.top=p.top+"px"}},setX:function(o,n){this.setXY(o,[n,false])},setY:function(n,o){this.setXY(n,[false,o])}};Ext.lib.Event={getPageX:function(n){return m.getPageX(n.browserEvent||n)},getPageY:function(n){return m.getPageY(n.browserEvent||n)},getXY:function(n){return m.getXY(n.browserEvent||n)},getTarget:function(n){return m.getTarget(n.browserEvent||n)},getRelatedTarget:function(n){return m.getRelatedTarget(n.browserEvent||n)},on:function(r,n,q,p,o){if((n=="mouseenter"||n=="mouseleave")&&!a){var s=l[r.id]||(l[r.id]={});s[n]=q;q=q.createInterceptor(i);n=(n=="mouseenter")?"mouseover":"mouseout"}m.on(r,n,q,p,o)},un:function(p,n,o){if((n=="mouseenter"||n=="mouseleave")&&!a){var r=l[p.id],q=r&&r[n];if(q){o=q.fn;delete r[n];n=(n=="mouseenter")?"mouseover":"mouseout"}}m.removeListener(p,n,o)},purgeElement:function(n){m.purgeElement(n)},preventDefault:function(n){m.preventDefault(n.browserEvent||n)},stopPropagation:function(n){m.stopPropagation(n.browserEvent||n)},stopEvent:function(n){m.stopEvent(n.browserEvent||n)},onAvailable:function(q,p,o,n){return m.onAvailable(q,p,o,n)}};Ext.lib.Ajax={request:function(t,r,n,s,o){if(o){var p=o.headers;if(p){for(var q in p){if(p.hasOwnProperty(q)){f.initHeader(q,p[q],false)}}}if(o.xmlData){if(!p||!p["Content-Type"]){f.initHeader("Content-Type","text/xml",false)}t=(t?t:(o.method?o.method:"POST"));s=o.xmlData}else{if(o.jsonData){if(!p||!p["Content-Type"]){f.initHeader("Content-Type","application/json",false)}t=(t?t:(o.method?o.method:"POST"));s=typeof o.jsonData=="object"?Ext.encode(o.jsonData):o.jsonData}}}return f.asyncRequest(t,r,n,s)},formRequest:function(r,q,o,s,n,p){f.setForm(r,n,p);return f.asyncRequest(Ext.getDom(r).method||"POST",q,o,s)},isCallInProgress:function(n){return f.isCallInProgress(n)},abort:function(n){return f.abort(n)},serializeForm:function(n){var o=f.setForm(n.dom||n);f.resetFormState();return o}};Ext.lib.Region=YAHOO.util.Region;Ext.lib.Point=YAHOO.util.Point;Ext.lib.Anim={scroll:function(q,o,r,s,n,p){this.run(q,o,r,s,n,p,YAHOO.util.Scroll)},motion:function(q,o,r,s,n,p){this.run(q,o,r,s,n,p,YAHOO.util.Motion)},color:function(q,o,r,s,n,p){this.run(q,o,r,s,n,p,YAHOO.util.ColorAnim)},run:function(r,o,t,u,n,q,p){p=p||YAHOO.util.Anim;if(typeof u=="string"){u=YAHOO.util.Easing[u]}var s=new p(r,o,t,u);s.animateX(function(){Ext.callback(n,q)});return s}};function g(n){if(!j){j=new Ext.Element.Flyweight()}j.dom=n;return j}if(Ext.isIE){function d(){var n=Function.prototype;delete n.createSequence;delete n.defer;delete n.createDelegate;delete n.createCallback;delete n.createInterceptor;window.detachEvent("onunload",d)}window.attachEvent("onunload",d)}if(YAHOO.util.Anim){YAHOO.util.Anim.prototype.animateX=function(p,n){var o=function(){this.onComplete.unsubscribe(o);if(typeof p=="function"){p.call(n||this,this)}};this.onComplete.subscribe(o,this,true);this.animate()}}if(YAHOO.util.DragDrop&&Ext.dd.DragDrop){YAHOO.util.DragDrop.defaultPadding=Ext.dd.DragDrop.defaultPadding;YAHOO.util.DragDrop.constrainTo=Ext.dd.DragDrop.constrainTo}YAHOO.util.Dom.getXY=function(n){var o=function(p){return Ext.lib.Dom.getXY(p)};return YAHOO.util.Dom.batch(n,o,YAHOO.util.Dom,true)};if(YAHOO.util.AnimMgr){YAHOO.util.AnimMgr.fps=1000}YAHOO.util.Region.prototype.adjust=function(p,o,n,q){this.top+=p;this.left+=o;this.right+=q;this.bottom+=n;return this};YAHOO.util.Region.prototype.constrainTo=function(n){this.top=this.top.constrain(n.top,n.bottom);this.bottom=this.bottom.constrain(n.top,n.bottom);this.left=this.left.constrain(n.left,n.right);this.right=this.right.constrain(n.left,n.right);return this}})();
Index: /trunk/workshop-routing-foss4g/web/ext/license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/license.txt	(revision 76)
@@ -0,0 +1,41 @@
+Ext JS - JavaScript Library
+Copyright (c) 2006-2011, Sencha Inc.
+All rights reserved.
+licensing@sencha.com
+
+http://www.sencha.com/license
+
+Open Source License
+------------------------------------------------------------------------------------------
+Ext JS is licensed under the terms of the Open Source GPL 3.0 license. 
+
+http://www.gnu.org/licenses/gpl.html
+
+There are several FLOSS exceptions available for use with this release for
+open source applications that are distributed under a license other than the GPL.
+
+* Open Source License Exception for Applications
+
+  http://www.sencha.com/products/floss-exception.php
+
+* Open Source License Exception for Development
+
+  http://www.sencha.com/products/ux-exception.php
+
+
+Commercial License
+------------------------------------------------------------------------------------------
+This is the appropriate option if you are creating proprietary applications and you are 
+not prepared to distribute and share the source code of your application under the 
+GPL v3 license. Please visit http://www.sencha.com/license for more details.
+
+
+OEM / Reseller License
+------------------------------------------------------------------------------------------
+For more details, please visit: http://www.sencha.com/license.
+
+--
+
+This library is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NONINFRINGEMENT OF THIRD-PARTY INTELLECTUAL PROPERTY RIGHTS.  See the GNU
+General Public License for more details.
Index: /trunk/workshop-routing-foss4g/web/ext/ext-all.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/ext-all.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/ext-all.js	(revision 76)
@@ -0,0 +1,11 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){var h=Ext.util,j=Ext.each,g=true,i=false;h.Observable=function(){var k=this,l=k.events;if(k.listeners){k.on(k.listeners);delete k.listeners}k.events=l||{}};h.Observable.prototype={filterOptRe:/^(?:scope|delay|buffer|single)$/,fireEvent:function(){var k=Array.prototype.slice.call(arguments,0),m=k[0].toLowerCase(),n=this,l=g,p=n.events[m],s,o,r;if(n.eventsSuspended===g){if(o=n.eventQueue){o.push(k)}}else{if(typeof p=="object"){if(p.bubble){if(p.fire.apply(p,k.slice(1))===i){return i}r=n.getBubbleTarget&&n.getBubbleTarget();if(r&&r.enableBubble){s=r.events[m];if(!s||typeof s!="object"||!s.bubble){r.enableBubble(m)}return r.fireEvent.apply(r,k)}}else{k.shift();l=p.fire.apply(p,k)}}}return l},addListener:function(k,m,l,r){var n=this,q,s,p;if(typeof k=="object"){r=k;for(q in r){s=r[q];if(!n.filterOptRe.test(q)){n.addListener(q,s.fn||s,s.scope||r.scope,s.fn?s:r)}}}else{k=k.toLowerCase();p=n.events[k]||g;if(typeof p=="boolean"){n.events[k]=p=new h.Event(n,k)}p.addListener(m,l,typeof r=="object"?r:{})}},removeListener:function(k,m,l){var n=this.events[k.toLowerCase()];if(typeof n=="object"){n.removeListener(m,l)}},purgeListeners:function(){var m=this.events,k,l;for(l in m){k=m[l];if(typeof k=="object"){k.clearListeners()}}},addEvents:function(n){var m=this;m.events=m.events||{};if(typeof n=="string"){var k=arguments,l=k.length;while(l--){m.events[k[l]]=m.events[k[l]]||g}}else{Ext.applyIf(m.events,n)}},hasListener:function(k){var l=this.events[k.toLowerCase()];return typeof l=="object"&&l.listeners.length>0},suspendEvents:function(k){this.eventsSuspended=g;if(k&&!this.eventQueue){this.eventQueue=[]}},resumeEvents:function(){var k=this,l=k.eventQueue||[];k.eventsSuspended=i;delete k.eventQueue;j(l,function(m){k.fireEvent.apply(k,m)})}};var d=h.Observable.prototype;d.on=d.addListener;d.un=d.removeListener;h.Observable.releaseCapture=function(k){k.fireEvent=d.fireEvent};function e(l,m,k){return function(){if(m.target==arguments[0]){l.apply(k,Array.prototype.slice.call(arguments,0))}}}function b(n,p,k,m){k.task=new h.DelayedTask();return function(){k.task.delay(p.buffer,n,m,Array.prototype.slice.call(arguments,0))}}function c(m,n,l,k){return function(){n.removeListener(l,k);return m.apply(k,arguments)}}function a(n,p,k,m){return function(){var l=new h.DelayedTask(),o=Array.prototype.slice.call(arguments,0);if(!k.tasks){k.tasks=[]}k.tasks.push(l);l.delay(p.delay||10,function(){k.tasks.remove(l);n.apply(m,o)},m)}}h.Event=function(l,k){this.name=k;this.obj=l;this.listeners=[]};h.Event.prototype={addListener:function(o,n,m){var p=this,k;n=n||p.obj;if(!p.isListening(o,n)){k=p.createListener(o,n,m);if(p.firing){p.listeners=p.listeners.slice(0)}p.listeners.push(k)}},createListener:function(p,n,q){q=q||{};n=n||this.obj;var k={fn:p,scope:n,options:q},m=p;if(q.target){m=e(m,q,n)}if(q.delay){m=a(m,q,k,n)}if(q.single){m=c(m,this,p,n)}if(q.buffer){m=b(m,q,k,n)}k.fireFn=m;return k},findListener:function(o,n){var p=this.listeners,m=p.length,k;n=n||this.obj;while(m--){k=p[m];if(k){if(k.fn==o&&k.scope==n){return m}}}return -1},isListening:function(l,k){return this.findListener(l,k)!=-1},removeListener:function(r,q){var p,m,n,s=this,o=i;if((p=s.findListener(r,q))!=-1){if(s.firing){s.listeners=s.listeners.slice(0)}m=s.listeners[p];if(m.task){m.task.cancel();delete m.task}n=m.tasks&&m.tasks.length;if(n){while(n--){m.tasks[n].cancel()}delete m.tasks}s.listeners.splice(p,1);o=g}return o},clearListeners:function(){var n=this,k=n.listeners,m=k.length;while(m--){n.removeListener(k[m].fn,k[m].scope)}},fire:function(){var q=this,p=q.listeners,k=p.length,o=0,m;if(k>0){q.firing=g;var n=Array.prototype.slice.call(arguments,0);for(;o<k;o++){m=p[o];if(m&&m.fireFn.apply(m.scope||q.obj||window,n)===i){return(q.firing=i)}}}q.firing=i;return g}}})();Ext.DomHelper=function(){var x=null,k=/^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,m=/^table|tbody|tr|td$/i,d=/tag|children|cn|html$/i,t=/td|tr|tbody/i,o=/([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,v=/end/i,r,n="afterbegin",p="afterend",c="beforebegin",q="beforeend",a="<table>",i="</table>",b=a+"<tbody>",j="</tbody>"+i,l=b+"<tr>",w="</tr>"+j;function h(B,D,C,E,A,y){var z=r.insertHtml(E,Ext.getDom(B),u(D));return C?Ext.get(z,true):z}function u(D){var z="",y,C,B,E;if(typeof D=="string"){z=D}else{if(Ext.isArray(D)){for(var A=0;A<D.length;A++){if(D[A]){z+=u(D[A])}}}else{z+="<"+(D.tag=D.tag||"div");for(y in D){C=D[y];if(!d.test(y)){if(typeof C=="object"){z+=" "+y+'="';for(B in C){z+=B+":"+C[B]+";"}z+='"'}else{z+=" "+({cls:"class",htmlFor:"for"}[y]||y)+'="'+C+'"'}}}if(k.test(D.tag)){z+="/>"}else{z+=">";if((E=D.children||D.cn)){z+=u(E)}else{if(D.html){z+=D.html}}z+="</"+D.tag+">"}}}return z}function g(F,C,B,D){x.innerHTML=[C,B,D].join("");var y=-1,A=x,z;while(++y<F){A=A.firstChild}if(z=A.nextSibling){var E=document.createDocumentFragment();while(A){z=A.nextSibling;E.appendChild(A);A=z}A=E}return A}function e(y,z,B,A){var C,D;x=x||document.createElement("div");if(y=="td"&&(z==n||z==q)||!t.test(y)&&(z==c||z==p)){return}D=z==c?B:z==p?B.nextSibling:z==n?B.firstChild:null;if(z==c||z==p){B=B.parentNode}if(y=="td"||(y=="tr"&&(z==q||z==n))){C=g(4,l,A,w)}else{if((y=="tbody"&&(z==q||z==n))||(y=="tr"&&(z==c||z==p))){C=g(3,b,A,j)}else{C=g(2,a,A,i)}}B.insertBefore(C,D);return C}function s(A){var D=document.createElement("div"),y=document.createDocumentFragment(),z=0,B,C;D.innerHTML=A;C=D.childNodes;B=C.length;for(;z<B;z++){y.appendChild(C[z].cloneNode(true))}return y}r={markup:function(y){return u(y)},applyStyles:function(y,z){if(z){var A;y=Ext.fly(y);if(typeof z=="function"){z=z.call()}if(typeof z=="string"){o.lastIndex=0;while((A=o.exec(z))){y.setStyle(A[1],A[2])}}else{if(typeof z=="object"){y.setStyle(z)}}}},insertHtml:function(D,y,E){var B={},A,F,C,G,H,z;D=D.toLowerCase();B[c]=["BeforeBegin","previousSibling"];B[p]=["AfterEnd","nextSibling"];if(y.insertAdjacentHTML){if(m.test(y.tagName)&&(z=e(y.tagName.toLowerCase(),D,y,E))){return z}B[n]=["AfterBegin","firstChild"];B[q]=["BeforeEnd","lastChild"];if((A=B[D])){y.insertAdjacentHTML(A[0],E);return y[A[1]]}}else{F=y.ownerDocument.createRange();G="setStart"+(v.test(D)?"After":"Before");if(B[D]){F[G](y);if(!F.createContextualFragment){H=s(E)}else{H=F.createContextualFragment(E)}y.parentNode.insertBefore(H,D==c?y:y.nextSibling);return y[(D==c?"previous":"next")+"Sibling"]}else{C=(D==n?"first":"last")+"Child";if(y.firstChild){F[G](y[C]);if(!F.createContextualFragment){H=s(E)}else{H=F.createContextualFragment(E)}if(D==n){y.insertBefore(H,y.firstChild)}else{y.appendChild(H)}}else{y.innerHTML=E}return y[C]}}throw'Illegal insertion point -> "'+D+'"'},insertBefore:function(y,A,z){return h(y,A,z,c)},insertAfter:function(y,A,z){return h(y,A,z,p,"nextSibling")},insertFirst:function(y,A,z){return h(y,A,z,n,"firstChild")},append:function(y,A,z){return h(y,A,z,q,"",true)},overwrite:function(y,A,z){y=Ext.getDom(y);y.innerHTML=u(A);return z?Ext.get(y.firstChild):y.firstChild},createHtml:u};return r}();Ext.Template=function(h){var j=this,c=arguments,e=[],d;if(Ext.isArray(h)){h=h.join("")}else{if(c.length>1){for(var g=0,b=c.length;g<b;g++){d=c[g];if(typeof d=="object"){Ext.apply(j,d)}else{e.push(d)}}h=e.join("")}}j.html=h;if(j.compiled){j.compile()}};Ext.Template.prototype={re:/\{([\w\-]+)\}/g,applyTemplate:function(a){var b=this;return b.compiled?b.compiled(a):b.html.replace(b.re,function(c,d){return a[d]!==undefined?a[d]:""})},set:function(a,c){var b=this;b.html=a;b.compiled=null;return c?b.compile():b},compile:function(){var me=this,sep=Ext.isGecko?"+":",";function fn(m,name){name="values['"+name+"']";return"'"+sep+"("+name+" == undefined ? '' : "+name+")"+sep+"'"}eval("this.compiled = function(values){ return "+(Ext.isGecko?"'":"['")+me.html.replace(/\\/g,"\\\\").replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn)+(Ext.isGecko?"';};":"'].join('');};"));return me},insertFirst:function(b,a,c){return this.doInsert("afterBegin",b,a,c)},insertBefore:function(b,a,c){return this.doInsert("beforeBegin",b,a,c)},insertAfter:function(b,a,c){return this.doInsert("afterEnd",b,a,c)},append:function(b,a,c){return this.doInsert("beforeEnd",b,a,c)},doInsert:function(c,e,b,a){e=Ext.getDom(e);var d=Ext.DomHelper.insertHtml(c,e,this.applyTemplate(b));return a?Ext.get(d,true):d},overwrite:function(b,a,c){b=Ext.getDom(b);b.innerHTML=this.applyTemplate(a);return c?Ext.get(b.firstChild,true):b.firstChild}};Ext.Template.prototype.apply=Ext.Template.prototype.applyTemplate;Ext.Template.from=function(b,a){b=Ext.getDom(b);return new Ext.Template(b.value||b.innerHTML,a||"")};Ext.DomQuery=function(){var cache={},simpleCache={},valueCache={},nonSpace=/\S/,trimRe=/^\s+|\s+$/g,tplRe=/\{(\d+)\}/g,modeRe=/^(\s?[\/>+~]\s?|\s|$)/,tagTokenRe=/^(#)?([\w\-\*]+)/,nthRe=/(\d*)n\+?(\d*)/,nthRe2=/\D/,isIE=window.ActiveXObject?true:false,key=30803;eval("var batch = 30803;");function child(parent,index){var i=0,n=parent.firstChild;while(n){if(n.nodeType==1){if(++i==index){return n}}n=n.nextSibling}return null}function next(n){while((n=n.nextSibling)&&n.nodeType!=1){}return n}function prev(n){while((n=n.previousSibling)&&n.nodeType!=1){}return n}function children(parent){var n=parent.firstChild,nodeIndex=-1,nextNode;while(n){nextNode=n.nextSibling;if(n.nodeType==3&&!nonSpace.test(n.nodeValue)){parent.removeChild(n)}else{n.nodeIndex=++nodeIndex}n=nextNode}return this}function byClassName(nodeSet,cls){if(!cls){return nodeSet}var result=[],ri=-1;for(var i=0,ci;ci=nodeSet[i];i++){if((" "+ci.className+" ").indexOf(cls)!=-1){result[++ri]=ci}}return result}function attrValue(n,attr){if(!n.tagName&&typeof n.length!="undefined"){n=n[0]}if(!n){return null}if(attr=="for"){return n.htmlFor}if(attr=="class"||attr=="className"){return n.className}return n.getAttribute(attr)||n[attr]}function getNodes(ns,mode,tagName){var result=[],ri=-1,cs;if(!ns){return result}tagName=tagName||"*";if(typeof ns.getElementsByTagName!="undefined"){ns=[ns]}if(!mode){for(var i=0,ni;ni=ns[i];i++){cs=ni.getElementsByTagName(tagName);for(var j=0,ci;ci=cs[j];j++){result[++ri]=ci}}}else{if(mode=="/"||mode==">"){var utag=tagName.toUpperCase();for(var i=0,ni,cn;ni=ns[i];i++){cn=ni.childNodes;for(var j=0,cj;cj=cn[j];j++){if(cj.nodeName==utag||cj.nodeName==tagName||tagName=="*"){result[++ri]=cj}}}}else{if(mode=="+"){var utag=tagName.toUpperCase();for(var i=0,n;n=ns[i];i++){while((n=n.nextSibling)&&n.nodeType!=1){}if(n&&(n.nodeName==utag||n.nodeName==tagName||tagName=="*")){result[++ri]=n}}}else{if(mode=="~"){var utag=tagName.toUpperCase();for(var i=0,n;n=ns[i];i++){while((n=n.nextSibling)){if(n.nodeName==utag||n.nodeName==tagName||tagName=="*"){result[++ri]=n}}}}}}}return result}function concat(a,b){if(b.slice){return a.concat(b)}for(var i=0,l=b.length;i<l;i++){a[a.length]=b[i]}return a}function byTag(cs,tagName){if(cs.tagName||cs==document){cs=[cs]}if(!tagName){return cs}var result=[],ri=-1;tagName=tagName.toLowerCase();for(var i=0,ci;ci=cs[i];i++){if(ci.nodeType==1&&ci.tagName.toLowerCase()==tagName){result[++ri]=ci}}return result}function byId(cs,id){if(cs.tagName||cs==document){cs=[cs]}if(!id){return cs}var result=[],ri=-1;for(var i=0,ci;ci=cs[i];i++){if(ci&&ci.id==id){result[++ri]=ci;return result}}return result}function byAttribute(cs,attr,value,op,custom){var result=[],ri=-1,useGetStyle=custom=="{",fn=Ext.DomQuery.operators[op],a,xml,hasXml;for(var i=0,ci;ci=cs[i];i++){if(ci.nodeType!=1){continue}if(!hasXml){xml=Ext.DomQuery.isXml(ci);hasXml=true}if(!xml){if(useGetStyle){a=Ext.DomQuery.getStyle(ci,attr)}else{if(attr=="class"||attr=="className"){a=ci.className}else{if(attr=="for"){a=ci.htmlFor}else{if(attr=="href"){a=ci.getAttribute("href",2)}else{a=ci.getAttribute(attr)}}}}}else{a=ci.getAttribute(attr)}if((fn&&fn(a,value))||(!fn&&a)){result[++ri]=ci}}return result}function byPseudo(cs,name,value){return Ext.DomQuery.pseudos[name](cs,value)}function nodupIEXml(cs){var d=++key,r;cs[0].setAttribute("_nodup",d);r=[cs[0]];for(var i=1,len=cs.length;i<len;i++){var c=cs[i];if(!c.getAttribute("_nodup")!=d){c.setAttribute("_nodup",d);r[r.length]=c}}for(var i=0,len=cs.length;i<len;i++){cs[i].removeAttribute("_nodup")}return r}function nodup(cs){if(!cs){return[]}var len=cs.length,c,i,r=cs,cj,ri=-1;if(!len||typeof cs.nodeType!="undefined"||len==1){return cs}if(isIE&&typeof cs[0].selectSingleNode!="undefined"){return nodupIEXml(cs)}var d=++key;cs[0]._nodup=d;for(i=1;c=cs[i];i++){if(c._nodup!=d){c._nodup=d}else{r=[];for(var j=0;j<i;j++){r[++ri]=cs[j]}for(j=i+1;cj=cs[j];j++){if(cj._nodup!=d){cj._nodup=d;r[++ri]=cj}}return r}}return r}function quickDiffIEXml(c1,c2){var d=++key,r=[];for(var i=0,len=c1.length;i<len;i++){c1[i].setAttribute("_qdiff",d)}for(var i=0,len=c2.length;i<len;i++){if(c2[i].getAttribute("_qdiff")!=d){r[r.length]=c2[i]}}for(var i=0,len=c1.length;i<len;i++){c1[i].removeAttribute("_qdiff")}return r}function quickDiff(c1,c2){var len1=c1.length,d=++key,r=[];if(!len1){return c2}if(isIE&&typeof c1[0].selectSingleNode!="undefined"){return quickDiffIEXml(c1,c2)}for(var i=0;i<len1;i++){c1[i]._qdiff=d}for(var i=0,len=c2.length;i<len;i++){if(c2[i]._qdiff!=d){r[r.length]=c2[i]}}return r}function quickId(ns,mode,root,id){if(ns==root){var d=root.ownerDocument||root;return d.getElementById(id)}ns=getNodes(ns,mode,"*");return byId(ns,id)}return{getStyle:function(el,name){return Ext.fly(el).getStyle(name)},compile:function(path,type){type=type||"select";var fn=["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],mode,lastPath,matchers=Ext.DomQuery.matchers,matchersLn=matchers.length,modeMatch,lmode=path.match(modeRe);if(lmode&&lmode[1]){fn[fn.length]='mode="'+lmode[1].replace(trimRe,"")+'";';path=path.replace(lmode[1],"")}while(path.substr(0,1)=="/"){path=path.substr(1)}while(path&&lastPath!=path){lastPath=path;var tokenMatch=path.match(tagTokenRe);if(type=="select"){if(tokenMatch){if(tokenMatch[1]=="#"){fn[fn.length]='n = quickId(n, mode, root, "'+tokenMatch[2]+'");'}else{fn[fn.length]='n = getNodes(n, mode, "'+tokenMatch[2]+'");'}path=path.replace(tokenMatch[0],"")}else{if(path.substr(0,1)!="@"){fn[fn.length]='n = getNodes(n, mode, "*");'}}}else{if(tokenMatch){if(tokenMatch[1]=="#"){fn[fn.length]='n = byId(n, "'+tokenMatch[2]+'");'}else{fn[fn.length]='n = byTag(n, "'+tokenMatch[2]+'");'}path=path.replace(tokenMatch[0],"")}}while(!(modeMatch=path.match(modeRe))){var matched=false;for(var j=0;j<matchersLn;j++){var t=matchers[j];var m=path.match(t.re);if(m){fn[fn.length]=t.select.replace(tplRe,function(x,i){return m[i]});path=path.replace(m[0],"");matched=true;break}}if(!matched){throw'Error parsing selector, parsing failed at "'+path+'"'}}if(modeMatch[1]){fn[fn.length]='mode="'+modeMatch[1].replace(trimRe,"")+'";';path=path.replace(modeMatch[1],"")}}fn[fn.length]="return nodup(n);\n}";eval(fn.join(""));return f},jsSelect:function(path,root,type){root=root||document;if(typeof root=="string"){root=document.getElementById(root)}var paths=path.split(","),results=[];for(var i=0,len=paths.length;i<len;i++){var subPath=paths[i].replace(trimRe,"");if(!cache[subPath]){cache[subPath]=Ext.DomQuery.compile(subPath);if(!cache[subPath]){throw subPath+" is not a valid selector"}}var result=cache[subPath](root);if(result&&result!=document){results=results.concat(result)}}if(paths.length>1){return nodup(results)}return results},isXml:function(el){var docEl=(el?el.ownerDocument||el:0).documentElement;return docEl?docEl.nodeName!=="HTML":false},select:document.querySelectorAll?function(path,root,type){root=root||document;if(!Ext.DomQuery.isXml(root)){try{var cs=root.querySelectorAll(path);return Ext.toArray(cs)}catch(ex){}}return Ext.DomQuery.jsSelect.call(this,path,root,type)}:function(path,root,type){return Ext.DomQuery.jsSelect.call(this,path,root,type)},selectNode:function(path,root){return Ext.DomQuery.select(path,root)[0]},selectValue:function(path,root,defaultValue){path=path.replace(trimRe,"");if(!valueCache[path]){valueCache[path]=Ext.DomQuery.compile(path,"select")}var n=valueCache[path](root),v;n=n[0]?n[0]:n;if(typeof n.normalize=="function"){n.normalize()}v=(n&&n.firstChild?n.firstChild.nodeValue:null);return((v===null||v===undefined||v==="")?defaultValue:v)},selectNumber:function(path,root,defaultValue){var v=Ext.DomQuery.selectValue(path,root,defaultValue||0);return parseFloat(v)},is:function(el,ss){if(typeof el=="string"){el=document.getElementById(el)}var isArray=Ext.isArray(el),result=Ext.DomQuery.filter(isArray?el:[el],ss);return isArray?(result.length==el.length):(result.length>0)},filter:function(els,ss,nonMatches){ss=ss.replace(trimRe,"");if(!simpleCache[ss]){simpleCache[ss]=Ext.DomQuery.compile(ss,"simple")}var result=simpleCache[ss](els);return nonMatches?quickDiff(result,els):result},matchers:[{re:/^\.([\w\-]+)/,select:'n = byClassName(n, " {1} ");'},{re:/^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,select:'n = byPseudo(n, "{1}", "{2}");'},{re:/^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,select:'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'},{re:/^#([\w\-]+)/,select:'n = byId(n, "{1}");'},{re:/^@([\w\-]+)/,select:'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'}],operators:{"=":function(a,v){return a==v},"!=":function(a,v){return a!=v},"^=":function(a,v){return a&&a.substr(0,v.length)==v},"$=":function(a,v){return a&&a.substr(a.length-v.length)==v},"*=":function(a,v){return a&&a.indexOf(v)!==-1},"%=":function(a,v){return(a%v)==0},"|=":function(a,v){return a&&(a==v||a.substr(0,v.length+1)==v+"-")},"~=":function(a,v){return a&&(" "+a+" ").indexOf(" "+v+" ")!=-1}},pseudos:{"first-child":function(c){var r=[],ri=-1,n;for(var i=0,ci;ci=n=c[i];i++){while((n=n.previousSibling)&&n.nodeType!=1){}if(!n){r[++ri]=ci}}return r},"last-child":function(c){var r=[],ri=-1,n;for(var i=0,ci;ci=n=c[i];i++){while((n=n.nextSibling)&&n.nodeType!=1){}if(!n){r[++ri]=ci}}return r},"nth-child":function(c,a){var r=[],ri=-1,m=nthRe.exec(a=="even"&&"2n"||a=="odd"&&"2n+1"||!nthRe2.test(a)&&"n+"+a||a),f=(m[1]||1)-0,l=m[2]-0;for(var i=0,n;n=c[i];i++){var pn=n.parentNode;if(batch!=pn._batch){var j=0;for(var cn=pn.firstChild;cn;cn=cn.nextSibling){if(cn.nodeType==1){cn.nodeIndex=++j}}pn._batch=batch}if(f==1){if(l==0||n.nodeIndex==l){r[++ri]=n}}else{if((n.nodeIndex+l)%f==0){r[++ri]=n}}}return r},"only-child":function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(!prev(ci)&&!next(ci)){r[++ri]=ci}}return r},empty:function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var cns=ci.childNodes,j=0,cn,empty=true;while(cn=cns[j]){++j;if(cn.nodeType==1||cn.nodeType==3){empty=false;break}}if(empty){r[++ri]=ci}}return r},contains:function(c,v){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if((ci.textContent||ci.innerText||"").indexOf(v)!=-1){r[++ri]=ci}}return r},nodeValue:function(c,v){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(ci.firstChild&&ci.firstChild.nodeValue==v){r[++ri]=ci}}return r},checked:function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(ci.checked==true){r[++ri]=ci}}return r},not:function(c,ss){return Ext.DomQuery.filter(c,ss,true)},any:function(c,selectors){var ss=selectors.split("|"),r=[],ri=-1,s;for(var i=0,ci;ci=c[i];i++){for(var j=0;s=ss[j];j++){if(Ext.DomQuery.is(ci,s)){r[++ri]=ci;break}}}return r},odd:function(c){return this["nth-child"](c,"odd")},even:function(c){return this["nth-child"](c,"even")},nth:function(c,a){return c[a-1]||[]},first:function(c){return c[0]||[]},last:function(c){return c[c.length-1]||[]},has:function(c,ss){var s=Ext.DomQuery.select,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(s(ss,ci).length>0){r[++ri]=ci}}return r},next:function(c,ss){var is=Ext.DomQuery.is,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var n=next(ci);if(n&&is(n,ss)){r[++ri]=ci}}return r},prev:function(c,ss){var is=Ext.DomQuery.is,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var n=prev(ci);if(n&&is(n,ss)){r[++ri]=ci}}return r}}}}();Ext.query=Ext.DomQuery.select;Ext.util.DelayedTask=function(d,c,a){var e=this,g,b=function(){clearInterval(g);g=null;d.apply(c,a||[])};e.delay=function(i,k,j,h){e.cancel();d=k||d;c=j||c;a=h||a;g=setInterval(b,i)};e.cancel=function(){if(g){clearInterval(g);g=null}}};(function(){var h=document;Ext.Element=function(l,m){var n=typeof l=="string"?h.getElementById(l):l,o;if(!n){return null}o=n.id;if(!m&&o&&Ext.elCache[o]){return Ext.elCache[o].el}this.dom=n;this.id=o||Ext.id(n)};var d=Ext.DomHelper,e=Ext.Element,a=Ext.elCache;e.prototype={set:function(q,m){var n=this.dom,l,p,m=(m!==false)&&!!n.setAttribute;for(l in q){if(q.hasOwnProperty(l)){p=q[l];if(l=="style"){d.applyStyles(n,p)}else{if(l=="cls"){n.className=p}else{if(m){n.setAttribute(l,p)}else{n[l]=p}}}}}return this},defaultUnit:"px",is:function(l){return Ext.DomQuery.is(this.dom,l)},focus:function(o,n){var l=this,n=n||l.dom;try{if(Number(o)){l.focus.defer(o,null,[null,n])}else{n.focus()}}catch(m){}return l},blur:function(){try{this.dom.blur()}catch(l){}return this},getValue:function(l){var m=this.dom.value;return l?parseInt(m,10):m},addListener:function(l,o,n,m){Ext.EventManager.on(this.dom,l,o,n||this,m);return this},removeListener:function(l,n,m){Ext.EventManager.removeListener(this.dom,l,n,m||this);return this},removeAllListeners:function(){Ext.EventManager.removeAll(this.dom);return this},purgeAllListeners:function(){Ext.EventManager.purgeElement(this,true);return this},addUnits:function(l){if(l===""||l=="auto"||l===undefined){l=l||""}else{if(!isNaN(l)||!i.test(l)){l=l+(this.defaultUnit||"px")}}return l},load:function(m,n,l){Ext.Ajax.request(Ext.apply({params:n,url:m.url||m,callback:l,el:this.dom,indicatorText:m.indicatorText||""},Ext.isObject(m)?m:{}));return this},isBorderBox:function(){return Ext.isBorderBox||Ext.isForcedBorderBox||g[(this.dom.tagName||"").toLowerCase()]},remove:function(){var l=this,m=l.dom;if(m){delete l.dom;Ext.removeNode(m)}},hover:function(m,l,o,n){var p=this;p.on("mouseenter",m,o||p.dom,n);p.on("mouseleave",l,o||p.dom,n);return p},contains:function(l){return !l?false:Ext.lib.Dom.isAncestor(this.dom,l.dom?l.dom:l)},getAttributeNS:function(m,l){return this.getAttribute(l,m)},getAttribute:(function(){var p=document.createElement("table"),o=false,m="getAttribute" in p,l=/undefined|unknown/;if(m){try{p.getAttribute("ext:qtip")}catch(n){o=true}return function(q,s){var r=this.dom,t;if(r.getAttributeNS){t=r.getAttributeNS(s,q)||null}if(t==null){if(s){if(o&&r.tagName.toUpperCase()=="TABLE"){try{t=r.getAttribute(s+":"+q)}catch(u){t=""}}else{t=r.getAttribute(s+":"+q)}}else{t=r.getAttribute(q)||r[q]}}return t||""}}else{return function(q,s){var r=this.om,u,t;if(s){t=r[s+":"+q];u=l.test(typeof t)?undefined:t}else{u=r[q]}return u||""}}p=null})(),update:function(l){if(this.dom){this.dom.innerHTML=l}return this}};var k=e.prototype;e.addMethods=function(l){Ext.apply(k,l)};k.on=k.addListener;k.un=k.removeListener;k.autoBoxAdjust=true;var i=/\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,c;e.get=function(m){var l,p,o;if(!m){return null}if(typeof m=="string"){if(!(p=h.getElementById(m))){return null}if(a[m]&&a[m].el){l=a[m].el;l.dom=p}else{l=e.addToCache(new e(p))}return l}else{if(m.tagName){if(!(o=m.id)){o=Ext.id(m)}if(a[o]&&a[o].el){l=a[o].el;l.dom=m}else{l=e.addToCache(new e(m))}return l}else{if(m instanceof e){if(m!=c){if(Ext.isIE&&(m.id==undefined||m.id=="")){m.dom=m.dom}else{m.dom=h.getElementById(m.id)||m.dom}}return m}else{if(m.isComposite){return m}else{if(Ext.isArray(m)){return e.select(m)}else{if(m==h){if(!c){var n=function(){};n.prototype=e.prototype;c=new n();c.dom=h}return c}}}}}}return null};e.addToCache=function(l,m){m=m||l.id;a[m]={el:l,data:{},events:{}};return l};e.data=function(m,l,n){m=e.get(m);if(!m){return null}var o=a[m.id].data;if(arguments.length==2){return o[l]}else{return(o[l]=n)}};function j(){if(!Ext.enableGarbageCollector){clearInterval(e.collectorThreadId)}else{var l,n,q,p;for(l in a){p=a[l];if(p.skipGC){continue}n=p.el;q=n.dom;if(!q||!q.parentNode||(!q.offsetParent&&!h.getElementById(l))){if(Ext.enableListenerCollection){Ext.EventManager.removeAll(q)}delete a[l]}}if(Ext.isIE){var m={};for(l in a){m[l]=a[l]}a=Ext.elCache=m}}}e.collectorThreadId=setInterval(j,30000);var b=function(){};b.prototype=e.prototype;e.Flyweight=function(l){this.dom=l};e.Flyweight.prototype=new b();e.Flyweight.prototype.isFlyweight=true;e._flyweights={};e.fly=function(n,l){var m=null;l=l||"_global";if(n=Ext.getDom(n)){(e._flyweights[l]=e._flyweights[l]||new e.Flyweight()).dom=n;m=e._flyweights[l]}return m};Ext.get=e.get;Ext.fly=e.fly;var g=Ext.isStrict?{select:1}:{input:1,select:1,textarea:1};if(Ext.isIE||Ext.isGecko){g.button=1}})();Ext.Element.addMethods(function(){var d="parentNode",b="nextSibling",c="previousSibling",e=Ext.DomQuery,a=Ext.get;return{findParent:function(m,l,h){var j=this.dom,g=document.body,k=0,i;if(Ext.isGecko&&Object.prototype.toString.call(j)=="[object XULElement]"){return null}l=l||50;if(isNaN(l)){i=Ext.getDom(l);l=Number.MAX_VALUE}while(j&&j.nodeType==1&&k<l&&j!=g&&j!=i){if(e.is(j,m)){return h?a(j):j}k++;j=j.parentNode}return null},findParentNode:function(j,i,g){var h=Ext.fly(this.dom.parentNode,"_internal");return h?h.findParent(j,i,g):null},up:function(h,g){return this.findParentNode(h,g,true)},select:function(g){return Ext.Element.select(g,this.dom)},query:function(g){return e.select(g,this.dom)},child:function(g,h){var i=e.selectNode(g,this.dom);return h?i:a(i)},down:function(g,h){var i=e.selectNode(" > "+g,this.dom);return h?i:a(i)},parent:function(g,h){return this.matchNode(d,d,g,h)},next:function(g,h){return this.matchNode(b,b,g,h)},prev:function(g,h){return this.matchNode(c,c,g,h)},first:function(g,h){return this.matchNode(b,"firstChild",g,h)},last:function(g,h){return this.matchNode(c,"lastChild",g,h)},matchNode:function(h,k,g,i){var j=this.dom[k];while(j){if(j.nodeType==1&&(!g||e.is(j,g))){return !i?a(j):j}j=j[h]}return null}}}());Ext.Element.addMethods(function(){var c=Ext.getDom,a=Ext.get,b=Ext.DomHelper;return{appendChild:function(d){return a(d).appendTo(this)},appendTo:function(d){c(d).appendChild(this.dom);return this},insertBefore:function(d){(d=c(d)).parentNode.insertBefore(this.dom,d);return this},insertAfter:function(d){(d=c(d)).parentNode.insertBefore(this.dom,d.nextSibling);return this},insertFirst:function(e,d){e=e||{};if(e.nodeType||e.dom||typeof e=="string"){e=c(e);this.dom.insertBefore(e,this.dom.firstChild);return !d?a(e):e}else{return this.createChild(e,this.dom.firstChild,d)}},replace:function(d){d=a(d);this.insertBefore(d);d.remove();return this},replaceWith:function(d){var e=this;if(d.nodeType||d.dom||typeof d=="string"){d=c(d);e.dom.parentNode.insertBefore(d,e.dom)}else{d=b.insertBefore(e.dom,d)}delete Ext.elCache[e.id];Ext.removeNode(e.dom);e.id=Ext.id(e.dom=d);Ext.Element.addToCache(e.isFlyweight?new Ext.Element(e.dom):e);return e},createChild:function(e,d,g){e=e||{tag:"div"};return d?b.insertBefore(d,e,g!==true):b[!this.dom.firstChild?"overwrite":"append"](this.dom,e,g!==true)},wrap:function(d,e){var g=b.insertBefore(this.dom,d||{tag:"div"},!e);g.dom?g.dom.appendChild(this.dom):g.appendChild(this.dom);return g},insertHtml:function(e,g,d){var h=b.insertHtml(e,this.dom,g);return d?Ext.get(h):h}}}());Ext.Element.addMethods(function(){var A=Ext.supports,h={},x=/(-[a-z])/gi,s=document.defaultView,D=/alpha\(opacity=(.*)\)/i,l=/^\s+|\s+$/g,B=Ext.Element,u=/\s+/,b=/\w/g,d="padding",c="margin",y="border",t="-left",q="-right",w="-top",o="-bottom",j="-width",r=Math,z="hidden",e="isClipped",k="overflow",n="overflow-x",m="overflow-y",C="originalClip",i={l:y+t+j,r:y+q+j,t:y+w+j,b:y+o+j},g={l:d+t,r:d+q,t:d+w,b:d+o},a={l:c+t,r:c+q,t:c+w,b:c+o},E=Ext.Element.data;function p(F,G){return G.charAt(1).toUpperCase()}function v(F){return h[F]||(h[F]=F=="float"?(A.cssFloat?"cssFloat":"styleFloat"):F.replace(x,p))}return{adjustWidth:function(F){var G=this;var H=(typeof F=="number");if(H&&G.autoBoxAdjust&&!G.isBorderBox()){F-=(G.getBorderWidth("lr")+G.getPadding("lr"))}return(H&&F<0)?0:F},adjustHeight:function(F){var G=this;var H=(typeof F=="number");if(H&&G.autoBoxAdjust&&!G.isBorderBox()){F-=(G.getBorderWidth("tb")+G.getPadding("tb"))}return(H&&F<0)?0:F},addClass:function(J){var K=this,I,F,H,G=[];if(!Ext.isArray(J)){if(typeof J=="string"&&!this.hasClass(J)){K.dom.className+=" "+J}}else{for(I=0,F=J.length;I<F;I++){H=J[I];if(typeof H=="string"&&(" "+K.dom.className+" ").indexOf(" "+H+" ")==-1){G.push(H)}}if(G.length){K.dom.className+=" "+G.join(" ")}}return K},removeClass:function(K){var L=this,J,G,F,I,H;if(!Ext.isArray(K)){K=[K]}if(L.dom&&L.dom.className){H=L.dom.className.replace(l,"").split(u);for(J=0,F=K.length;J<F;J++){I=K[J];if(typeof I=="string"){I=I.replace(l,"");G=H.indexOf(I);if(G!=-1){H.splice(G,1)}}}L.dom.className=H.join(" ")}return L},radioClass:function(I){var J=this.dom.parentNode.childNodes,G,H,F;I=Ext.isArray(I)?I:[I];for(H=0,F=J.length;H<F;H++){G=J[H];if(G&&G.nodeType==1){Ext.fly(G,"_internal").removeClass(I)}}return this.addClass(I)},toggleClass:function(F){return this.hasClass(F)?this.removeClass(F):this.addClass(F)},hasClass:function(F){return F&&(" "+this.dom.className+" ").indexOf(" "+F+" ")!=-1},replaceClass:function(G,F){return this.removeClass(G).addClass(F)},isStyle:function(F,G){return this.getStyle(F)==G},getStyle:function(){return s&&s.getComputedStyle?function(K){var I=this.dom,F,H,G,J;if(I==document){return null}K=v(K);G=(F=I.style[K])?F:(H=s.getComputedStyle(I,""))?H[K]:null;if(K=="marginRight"&&G!="0px"&&!A.correctRightMargin){J=I.style.display;I.style.display="inline-block";G=s.getComputedStyle(I,"").marginRight;I.style.display=J}if(K=="backgroundColor"&&G=="rgba(0, 0, 0, 0)"&&!A.correctTransparentColor){G="transparent"}return G}:function(J){var H=this.dom,F,G;if(H==document){return null}if(J=="opacity"){if(H.style.filter.match){if(F=H.style.filter.match(D)){var I=parseFloat(F[1]);if(!isNaN(I)){return I?I/100:0}}}return 1}J=v(J);return H.style[J]||((G=H.currentStyle)?G[J]:null)}}(),getColor:function(F,G,K){var I=this.getStyle(F),H=(typeof K!="undefined")?K:"#",J;if(!I||(/transparent|inherit/.test(I))){return G}if(/^r/.test(I)){Ext.each(I.slice(4,I.length-1).split(","),function(L){J=parseInt(L,10);H+=(J<16?"0":"")+J.toString(16)})}else{I=I.replace("#","");H+=I.length==3?I.replace(/^(\w)(\w)(\w)$/,"$1$1$2$2$3$3"):I}return(H.length>5?H.toLowerCase():G)},setStyle:function(I,H){var F,G;if(typeof I!="object"){F={};F[I]=H;I=F}for(G in I){H=I[G];G=="opacity"?this.setOpacity(H):this.dom.style[v(G)]=H}return this},setOpacity:function(G,F){var J=this,H=J.dom.style;if(!F||!J.anim){if(Ext.isIE){var I=G<1?"alpha(opacity="+G*100+")":"",K=H.filter.replace(D,"").replace(l,"");H.zoom=1;H.filter=K+(K.length>0?" ":"")+I}else{H.opacity=G}}else{J.anim({opacity:{to:G}},J.preanim(arguments,1),null,0.35,"easeIn")}return J},clearOpacity:function(){var F=this.dom.style;if(Ext.isIE){if(!Ext.isEmpty(F.filter)){F.filter=F.filter.replace(D,"").replace(l,"")}}else{F.opacity=F["-moz-opacity"]=F["-khtml-opacity"]=""}return this},getHeight:function(H){var G=this,J=G.dom,I=Ext.isIE&&G.isStyle("display","none"),F=r.max(J.offsetHeight,I?0:J.clientHeight)||0;F=!H?F:F-G.getBorderWidth("tb")-G.getPadding("tb");return F<0?0:F},getWidth:function(G){var H=this,J=H.dom,I=Ext.isIE&&H.isStyle("display","none"),F=r.max(J.offsetWidth,I?0:J.clientWidth)||0;F=!G?F:F-H.getBorderWidth("lr")-H.getPadding("lr");return F<0?0:F},setWidth:function(G,F){var H=this;G=H.adjustWidth(G);!F||!H.anim?H.dom.style.width=H.addUnits(G):H.anim({width:{to:G}},H.preanim(arguments,1));return H},setHeight:function(F,G){var H=this;F=H.adjustHeight(F);!G||!H.anim?H.dom.style.height=H.addUnits(F):H.anim({height:{to:F}},H.preanim(arguments,1));return H},getBorderWidth:function(F){return this.addStyles(F,i)},getPadding:function(F){return this.addStyles(F,g)},clip:function(){var F=this,G=F.dom;if(!E(G,e)){E(G,e,true);E(G,C,{o:F.getStyle(k),x:F.getStyle(n),y:F.getStyle(m)});F.setStyle(k,z);F.setStyle(n,z);F.setStyle(m,z)}return F},unclip:function(){var F=this,H=F.dom;if(E(H,e)){E(H,e,false);var G=E(H,C);if(G.o){F.setStyle(k,G.o)}if(G.x){F.setStyle(n,G.x)}if(G.y){F.setStyle(m,G.y)}}return F},addStyles:function(M,L){var J=0,K=M.match(b),I,H,G,F=K.length;for(G=0;G<F;G++){I=K[G];H=I&&parseInt(this.getStyle(L[I]),10);if(H){J+=r.abs(H)}}return J},margins:a}}());(function(){var a=Ext.lib.Dom,b="left",g="right",d="top",i="bottom",h="position",c="static",e="relative",j="auto",k="z-index";Ext.Element.addMethods({getX:function(){return a.getX(this.dom)},getY:function(){return a.getY(this.dom)},getXY:function(){return a.getXY(this.dom)},getOffsetsTo:function(l){var n=this.getXY(),m=Ext.fly(l,"_internal").getXY();return[n[0]-m[0],n[1]-m[1]]},setX:function(l,m){return this.setXY([l,this.getY()],this.animTest(arguments,m,1))},setY:function(m,l){return this.setXY([this.getX(),m],this.animTest(arguments,l,1))},setLeft:function(l){this.setStyle(b,this.addUnits(l));return this},setTop:function(l){this.setStyle(d,this.addUnits(l));return this},setRight:function(l){this.setStyle(g,this.addUnits(l));return this},setBottom:function(l){this.setStyle(i,this.addUnits(l));return this},setXY:function(n,l){var m=this;if(!l||!m.anim){a.setXY(m.dom,n)}else{m.anim({points:{to:n}},m.preanim(arguments,1),"motion")}return m},setLocation:function(l,n,m){return this.setXY([l,n],this.animTest(arguments,m,2))},moveTo:function(l,n,m){return this.setXY([l,n],this.animTest(arguments,m,2))},getLeft:function(l){return !l?this.getX():parseInt(this.getStyle(b),10)||0},getRight:function(l){var m=this;return !l?m.getX()+m.getWidth():(m.getLeft(true)+m.getWidth())||0},getTop:function(l){return !l?this.getY():parseInt(this.getStyle(d),10)||0},getBottom:function(l){var m=this;return !l?m.getY()+m.getHeight():(m.getTop(true)+m.getHeight())||0},position:function(p,o,l,n){var m=this;if(!p&&m.isStyle(h,c)){m.setStyle(h,e)}else{if(p){m.setStyle(h,p)}}if(o){m.setStyle(k,o)}if(l||n){m.setXY([l||false,n||false])}},clearPositioning:function(l){l=l||"";this.setStyle({left:l,right:l,top:l,bottom:l,"z-index":"",position:c});return this},getPositioning:function(){var m=this.getStyle(b);var n=this.getStyle(d);return{position:this.getStyle(h),left:m,right:m?"":this.getStyle(g),top:n,bottom:n?"":this.getStyle(i),"z-index":this.getStyle(k)}},setPositioning:function(l){var n=this,m=n.dom.style;n.setStyle(l);if(l.right==j){m.right=""}if(l.bottom==j){m.bottom=""}return n},translatePoints:function(m,u){u=isNaN(m[1])?u:m[1];m=isNaN(m[0])?m:m[0];var q=this,r=q.isStyle(h,e),s=q.getXY(),n=parseInt(q.getStyle(b),10),p=parseInt(q.getStyle(d),10);n=!isNaN(n)?n:(r?0:q.dom.offsetLeft);p=!isNaN(p)?p:(r?0:q.dom.offsetTop);return{left:(m-s[0]+n),top:(u-s[1]+p)}},animTest:function(m,l,n){return !!l&&this.preanim?this.preanim(m,n):false}})})();Ext.Element.addMethods({isScrollable:function(){var a=this.dom;return a.scrollHeight>a.clientHeight||a.scrollWidth>a.clientWidth},scrollTo:function(a,b){this.dom["scroll"+(/top/i.test(a)?"Top":"Left")]=b;return this},getScroll:function(){var i=this.dom,h=document,a=h.body,c=h.documentElement,b,g,e;if(i==h||i==a){if(Ext.isIE&&Ext.isStrict){b=c.scrollLeft;g=c.scrollTop}else{b=window.pageXOffset;g=window.pageYOffset}e={left:b||(a?a.scrollLeft:0),top:g||(a?a.scrollTop:0)}}else{e={left:i.scrollLeft,top:i.scrollTop}}return e}});Ext.Element.VISIBILITY=1;Ext.Element.DISPLAY=2;Ext.Element.OFFSETS=3;Ext.Element.ASCLASS=4;Ext.Element.visibilityCls="x-hide-nosize";Ext.Element.addMethods(function(){var e=Ext.Element,p="opacity",j="visibility",g="display",d="hidden",n="offsets",k="asclass",m="none",a="nosize",b="originalDisplay",c="visibilityMode",h="isVisible",i=e.data,l=function(r){var q=i(r,b);if(q===undefined){i(r,b,q="")}return q},o=function(r){var q=i(r,c);if(q===undefined){i(r,c,q=1)}return q};return{originalDisplay:"",visibilityMode:1,setVisibilityMode:function(q){i(this.dom,c,q);return this},animate:function(r,t,s,u,q){this.anim(r,{duration:t,callback:s,easing:u},q);return this},anim:function(t,u,r,w,s,q){r=r||"run";u=u||{};var v=this,x=Ext.lib.Anim[r](v.dom,t,(u.duration||w)||0.35,(u.easing||s)||"easeOut",function(){if(q){q.call(v)}if(u.callback){u.callback.call(u.scope||v,v,u)}},v);u.anim=x;return x},preanim:function(q,r){return !q[r]?false:(typeof q[r]=="object"?q[r]:{duration:q[r+1],callback:q[r+2],easing:q[r+3]})},isVisible:function(){var q=this,s=q.dom,r=i(s,h);if(typeof r=="boolean"){return r}r=!q.isStyle(j,d)&&!q.isStyle(g,m)&&!((o(s)==e.ASCLASS)&&q.hasClass(q.visibilityCls||e.visibilityCls));i(s,h,r);return r},setVisible:function(t,q){var w=this,r,y,x,v,u=w.dom,s=o(u);if(typeof q=="string"){switch(q){case g:s=e.DISPLAY;break;case j:s=e.VISIBILITY;break;case n:s=e.OFFSETS;break;case a:case k:s=e.ASCLASS;break}w.setVisibilityMode(s);q=false}if(!q||!w.anim){if(s==e.ASCLASS){w[t?"removeClass":"addClass"](w.visibilityCls||e.visibilityCls)}else{if(s==e.DISPLAY){return w.setDisplayed(t)}else{if(s==e.OFFSETS){if(!t){w.hideModeStyles={position:w.getStyle("position"),top:w.getStyle("top"),left:w.getStyle("left")};w.applyStyles({position:"absolute",top:"-10000px",left:"-10000px"})}else{w.applyStyles(w.hideModeStyles||{position:"",top:"",left:""});delete w.hideModeStyles}}else{w.fixDisplay();u.style.visibility=t?"visible":d}}}}else{if(t){w.setOpacity(0.01);w.setVisible(true)}w.anim({opacity:{to:(t?1:0)}},w.preanim(arguments,1),null,0.35,"easeIn",function(){t||w.setVisible(false).setOpacity(1)})}i(u,h,t);return w},hasMetrics:function(){var q=this.dom;return this.isVisible()||(o(q)==e.VISIBILITY)},toggle:function(q){var r=this;r.setVisible(!r.isVisible(),r.preanim(arguments,0));return r},setDisplayed:function(q){if(typeof q=="boolean"){q=q?l(this.dom):m}this.setStyle(g,q);return this},fixDisplay:function(){var q=this;if(q.isStyle(g,m)){q.setStyle(j,d);q.setStyle(g,l(this.dom));if(q.isStyle(g,m)){q.setStyle(g,"block")}}},hide:function(q){if(typeof q=="string"){this.setVisible(false,q);return this}this.setVisible(false,this.preanim(arguments,0));return this},show:function(q){if(typeof q=="string"){this.setVisible(true,q);return this}this.setVisible(true,this.preanim(arguments,0));return this}}}());(function(){var y=null,A=undefined,k=true,t=false,j="setX",h="setY",a="setXY",n="left",l="bottom",s="top",m="right",q="height",g="width",i="points",w="hidden",z="absolute",u="visible",e="motion",o="position",r="easeOut",d=new Ext.Element.Flyweight(),v={},x=function(B){return B||{}},p=function(B){d.dom=B;d.id=Ext.id(B);return d},c=function(B){if(!v[B]){v[B]=[]}return v[B]},b=function(C,B){v[C]=B};Ext.enableFx=k;Ext.Fx={switchStatements:function(C,D,B){return D.apply(this,B[C])},slideIn:function(H,E){E=x(E);var J=this,G=J.dom,M=G.style,O,B,L,D,C,M,I,N,K,F;H=H||"t";J.queueFx(E,function(){O=p(G).getXY();p(G).fixDisplay();B=p(G).getFxRestore();L={x:O[0],y:O[1],0:O[0],1:O[1],width:G.offsetWidth,height:G.offsetHeight};L.right=L.x+L.width;L.bottom=L.y+L.height;p(G).setWidth(L.width).setHeight(L.height);D=p(G).fxWrap(B.pos,E,w);M.visibility=u;M.position=z;function P(){p(G).fxUnwrap(D,B.pos,E);M.width=B.width;M.height=B.height;p(G).afterFx(E)}N={to:[L.x,L.y]};K={to:L.width};F={to:L.height};function Q(U,R,V,S,X,Z,ac,ab,aa,W,T){var Y={};p(U).setWidth(V).setHeight(S);if(p(U)[X]){p(U)[X](Z)}R[ac]=R[ab]="0";if(aa){Y.width=aa}if(W){Y.height=W}if(T){Y.points=T}return Y}I=p(G).switchStatements(H.toLowerCase(),Q,{t:[D,M,L.width,0,y,y,n,l,y,F,y],l:[D,M,0,L.height,y,y,m,s,K,y,y],r:[D,M,L.width,L.height,j,L.right,n,s,y,y,N],b:[D,M,L.width,L.height,h,L.bottom,n,s,y,F,N],tl:[D,M,0,0,y,y,m,l,K,F,N],bl:[D,M,0,0,h,L.y+L.height,m,s,K,F,N],br:[D,M,0,0,a,[L.right,L.bottom],n,s,K,F,N],tr:[D,M,0,0,j,L.x+L.width,n,l,K,F,N]});M.visibility=u;p(D).show();arguments.callee.anim=p(D).fxanim(I,E,e,0.5,r,P)});return J},slideOut:function(F,D){D=x(D);var H=this,E=H.dom,K=E.style,L=H.getXY(),C,B,I,J,G={to:0};F=F||"t";H.queueFx(D,function(){B=p(E).getFxRestore();I={x:L[0],y:L[1],0:L[0],1:L[1],width:E.offsetWidth,height:E.offsetHeight};I.right=I.x+I.width;I.bottom=I.y+I.height;p(E).setWidth(I.width).setHeight(I.height);C=p(E).fxWrap(B.pos,D,u);K.visibility=u;K.position=z;p(C).setWidth(I.width).setHeight(I.height);function M(){D.useDisplay?p(E).setDisplayed(t):p(E).hide();p(E).fxUnwrap(C,B.pos,D);K.width=B.width;K.height=B.height;p(E).afterFx(D)}function N(O,W,U,X,S,V,R,T,Q){var P={};O[W]=O[U]="0";P[X]=S;if(V){P[V]=R}if(T){P[T]=Q}return P}J=p(E).switchStatements(F.toLowerCase(),N,{t:[K,n,l,q,G],l:[K,m,s,g,G],r:[K,n,s,g,G,i,{to:[I.right,I.y]}],b:[K,n,s,q,G,i,{to:[I.x,I.bottom]}],tl:[K,m,l,g,G,q,G],bl:[K,m,s,g,G,q,G,i,{to:[I.x,I.bottom]}],br:[K,n,s,g,G,q,G,i,{to:[I.x+I.width,I.bottom]}],tr:[K,n,l,g,G,q,G,i,{to:[I.right,I.y]}]});arguments.callee.anim=p(C).fxanim(J,D,e,0.5,r,M)});return H},puff:function(H){H=x(H);var F=this,G=F.dom,C=G.style,D,B,E;F.queueFx(H,function(){D=p(G).getWidth();B=p(G).getHeight();p(G).clearOpacity();p(G).show();E=p(G).getFxRestore();function I(){H.useDisplay?p(G).setDisplayed(t):p(G).hide();p(G).clearOpacity();p(G).setPositioning(E.pos);C.width=E.width;C.height=E.height;C.fontSize="";p(G).afterFx(H)}arguments.callee.anim=p(G).fxanim({width:{to:p(G).adjustWidth(D*2)},height:{to:p(G).adjustHeight(B*2)},points:{by:[-D*0.5,-B*0.5]},opacity:{to:0},fontSize:{to:200,unit:"%"}},H,e,0.5,r,I)});return F},switchOff:function(F){F=x(F);var D=this,E=D.dom,B=E.style,C;D.queueFx(F,function(){p(E).clearOpacity();p(E).clip();C=p(E).getFxRestore();function G(){F.useDisplay?p(E).setDisplayed(t):p(E).hide();p(E).clearOpacity();p(E).setPositioning(C.pos);B.width=C.width;B.height=C.height;p(E).afterFx(F)}p(E).fxanim({opacity:{to:0.3}},y,y,0.1,y,function(){p(E).clearOpacity();(function(){p(E).fxanim({height:{to:1},points:{by:[0,p(E).getHeight()*0.5]}},F,e,0.3,"easeIn",G)}).defer(100)})});return D},highlight:function(D,H){H=x(H);var F=this,G=F.dom,B=H.attr||"backgroundColor",C={},E;F.queueFx(H,function(){p(G).clearOpacity();p(G).show();function I(){G.style[B]=E;p(G).afterFx(H)}E=G.style[B];C[B]={from:D||"ffff9c",to:H.endColor||p(G).getColor(B)||"ffffff"};arguments.callee.anim=p(G).fxanim(C,H,"color",1,"easeIn",I)});return F},frame:function(B,E,H){H=x(H);var D=this,G=D.dom,C,F;D.queueFx(H,function(){B=B||"#C3DAF9";if(B.length==6){B="#"+B}E=E||1;p(G).show();var L=p(G).getXY(),J={x:L[0],y:L[1],0:L[0],1:L[1],width:G.offsetWidth,height:G.offsetHeight},I=function(){C=p(document.body||document.documentElement).createChild({style:{position:z,"z-index":35000,border:"0px solid "+B}});return C.queueFx({},K)};arguments.callee.anim={isAnimated:true,stop:function(){E=0;C.stopFx()}};function K(){var M=Ext.isBorderBox?2:1;F=C.anim({top:{from:J.y,to:J.y-20},left:{from:J.x,to:J.x-20},borderWidth:{from:0,to:10},opacity:{from:1,to:0},height:{from:J.height,to:J.height+20*M},width:{from:J.width,to:J.width+20*M}},{duration:H.duration||1,callback:function(){C.remove();--E>0?I():p(G).afterFx(H)}});arguments.callee.anim={isAnimated:true,stop:function(){F.stop()}}}I()});return D},pause:function(D){var C=this.dom,B;this.queueFx({},function(){B=setTimeout(function(){p(C).afterFx({})},D*1000);arguments.callee.anim={isAnimated:true,stop:function(){clearTimeout(B);p(C).afterFx({})}}});return this},fadeIn:function(D){D=x(D);var B=this,C=B.dom,E=D.endOpacity||1;B.queueFx(D,function(){p(C).setOpacity(0);p(C).fixDisplay();C.style.visibility=u;arguments.callee.anim=p(C).fxanim({opacity:{to:E}},D,y,0.5,r,function(){if(E==1){p(C).clearOpacity()}p(C).afterFx(D)})});return B},fadeOut:function(E){E=x(E);var C=this,D=C.dom,B=D.style,F=E.endOpacity||0;C.queueFx(E,function(){arguments.callee.anim=p(D).fxanim({opacity:{to:F}},E,y,0.5,r,function(){if(F==0){Ext.Element.data(D,"visibilityMode")==Ext.Element.DISPLAY||E.useDisplay?B.display="none":B.visibility=w;p(D).clearOpacity()}p(D).afterFx(E)})});return C},scale:function(B,C,D){this.shift(Ext.apply({},D,{width:B,height:C}));return this},shift:function(D){D=x(D);var C=this.dom,B={};this.queueFx(D,function(){for(var E in D){if(D[E]!=A){B[E]={to:D[E]}}}B.width?B.width.to=p(C).adjustWidth(D.width):B;B.height?B.height.to=p(C).adjustWidth(D.height):B;if(B.x||B.y||B.xy){B.points=B.xy||{to:[B.x?B.x.to:p(C).getX(),B.y?B.y.to:p(C).getY()]}}arguments.callee.anim=p(C).fxanim(B,D,e,0.35,r,function(){p(C).afterFx(D)})});return this},ghost:function(E,C){C=x(C);var G=this,D=G.dom,J=D.style,H={opacity:{to:0},points:{}},K=H.points,B,I,F;E=E||"b";G.queueFx(C,function(){B=p(D).getFxRestore();I=p(D).getWidth();F=p(D).getHeight();function L(){C.useDisplay?p(D).setDisplayed(t):p(D).hide();p(D).clearOpacity();p(D).setPositioning(B.pos);J.width=B.width;J.height=B.height;p(D).afterFx(C)}K.by=p(D).switchStatements(E.toLowerCase(),function(N,M){return[N,M]},{t:[0,-F],l:[-I,0],r:[I,0],b:[0,F],tl:[-I,-F],bl:[-I,F],br:[I,F],tr:[I,-F]});arguments.callee.anim=p(D).fxanim(H,C,e,0.5,r,L)});return G},syncFx:function(){var B=this;B.fxDefaults=Ext.apply(B.fxDefaults||{},{block:t,concurrent:k,stopFx:t});return B},sequenceFx:function(){var B=this;B.fxDefaults=Ext.apply(B.fxDefaults||{},{block:t,concurrent:t,stopFx:t});return B},nextFx:function(){var B=c(this.dom.id)[0];if(B){B.call(this)}},hasActiveFx:function(){return c(this.dom.id)[0]},stopFx:function(B){var C=this,E=C.dom.id;if(C.hasActiveFx()){var D=c(E)[0];if(D&&D.anim){if(D.anim.isAnimated){b(E,[D]);D.anim.stop(B!==undefined?B:k)}else{b(E,[])}}}return C},beforeFx:function(B){if(this.hasActiveFx()&&!B.concurrent){if(B.stopFx){this.stopFx();return k}return t}return k},hasFxBlock:function(){var B=c(this.dom.id);return B&&B[0]&&B[0].block},queueFx:function(E,B){var C=p(this.dom);if(!C.hasFxBlock()){Ext.applyIf(E,C.fxDefaults);if(!E.concurrent){var D=C.beforeFx(E);B.block=E.block;c(C.dom.id).push(B);if(D){C.nextFx()}}else{B.call(C)}}return C},fxWrap:function(H,F,D){var E=this.dom,C,B;if(!F.wrap||!(C=Ext.getDom(F.wrap))){if(F.fixPosition){B=p(E).getXY()}var G=document.createElement("div");G.style.visibility=D;C=E.parentNode.insertBefore(G,E);p(C).setPositioning(H);if(p(C).isStyle(o,"static")){p(C).position("relative")}p(E).clearPositioning("auto");p(C).clip();C.appendChild(E);if(B){p(C).setXY(B)}}return C},fxUnwrap:function(C,F,E){var D=this.dom;p(D).clearPositioning();p(D).setPositioning(F);if(!E.wrap){var B=p(C).dom.parentNode;B.insertBefore(D,C);p(C).remove()}},getFxRestore:function(){var B=this.dom.style;return{pos:this.getPositioning(),width:B.width,height:B.height}},afterFx:function(C){var B=this.dom,D=B.id;if(C.afterStyle){p(B).setStyle(C.afterStyle)}if(C.afterCls){p(B).addClass(C.afterCls)}if(C.remove==k){p(B).remove()}if(C.callback){C.callback.call(C.scope,p(B))}if(!C.concurrent){c(D).shift();p(B).nextFx()}},fxanim:function(E,F,C,G,D,B){C=C||"run";F=F||{};var H=Ext.lib.Anim[C](this.dom,E,(F.duration||G)||0.35,(F.easing||D)||r,B,this);F.anim=H;return H}};Ext.Fx.resize=Ext.Fx.scale;Ext.Element.addMethods(Ext.Fx)})();Ext.CompositeElementLite=function(b,a){this.elements=[];this.add(b,a);this.el=new Ext.Element.Flyweight()};Ext.CompositeElementLite.prototype={isComposite:true,getElement:function(a){var b=this.el;b.dom=a;b.id=a.id;return b},transformElement:function(a){return Ext.getDom(a)},getCount:function(){return this.elements.length},add:function(d,b){var e=this,g=e.elements;if(!d){return this}if(typeof d=="string"){d=Ext.Element.selectorFunction(d,b)}else{if(d.isComposite){d=d.elements}else{if(!Ext.isIterable(d)){d=[d]}}}for(var c=0,a=d.length;c<a;++c){g.push(e.transformElement(d[c]))}return e},invoke:function(g,b){var h=this,d=h.elements,a=d.length,j,c;for(c=0;c<a;c++){j=d[c];if(j){Ext.Element.prototype[g].apply(h.getElement(j),b)}}return h},item:function(b){var d=this,c=d.elements[b],a=null;if(c){a=d.getElement(c)}return a},addListener:function(b,j,h,g){var d=this.elements,a=d.length,c,k;for(c=0;c<a;c++){k=d[c];if(k){Ext.EventManager.on(k,b,j,h||k,g)}}return this},each:function(g,d){var h=this,c=h.elements,a=c.length,b,j;for(b=0;b<a;b++){j=c[b];if(j){j=this.getElement(j);if(g.call(d||j,j,h,b)===false){break}}}return h},fill:function(a){var b=this;b.elements=[];b.add(a);return b},filter:function(a){var b=[],d=this,c=Ext.isFunction(a)?a:function(e){return e.is(a)};d.each(function(h,e,g){if(c(h,g)!==false){b[b.length]=d.transformElement(h)}});d.elements=b;return d},indexOf:function(a){return this.elements.indexOf(this.transformElement(a))},replaceElement:function(e,c,a){var b=!isNaN(e)?e:this.indexOf(e),g;if(b>-1){c=Ext.getDom(c);if(a){g=this.elements[b];g.parentNode.insertBefore(c,g);Ext.removeNode(g)}this.elements.splice(b,1,c)}return this},clear:function(){this.elements=[]}};Ext.CompositeElementLite.prototype.on=Ext.CompositeElementLite.prototype.addListener;Ext.CompositeElementLite.importElementMethods=function(){var c,b=Ext.Element.prototype,a=Ext.CompositeElementLite.prototype;for(c in b){if(typeof b[c]=="function"){(function(d){a[d]=a[d]||function(){return this.invoke(d,arguments)}}).call(a,c)}}};Ext.CompositeElementLite.importElementMethods();if(Ext.DomQuery){Ext.Element.selectorFunction=Ext.DomQuery.select}Ext.Element.select=function(a,b){var c;if(typeof a=="string"){c=Ext.Element.selectorFunction(a,b)}else{if(a.length!==undefined){c=a}else{throw"Invalid selector"}}return new Ext.CompositeElementLite(c)};Ext.select=Ext.Element.select;(function(){var b="beforerequest",e="requestcomplete",d="requestexception",h=undefined,c="load",i="POST",a="GET",g=window;Ext.data.Connection=function(j){Ext.apply(this,j);this.addEvents(b,e,d);Ext.data.Connection.superclass.constructor.call(this)};Ext.extend(Ext.data.Connection,Ext.util.Observable,{timeout:30000,autoAbort:false,disableCaching:true,disableCachingParam:"_dc",request:function(n){var s=this;if(s.fireEvent(b,s,n)){if(n.el){if(!Ext.isEmpty(n.indicatorText)){s.indicatorText='<div class="loading-indicator">'+n.indicatorText+"</div>"}if(s.indicatorText){Ext.getDom(n.el).innerHTML=s.indicatorText}n.success=(Ext.isFunction(n.success)?n.success:function(){}).createInterceptor(function(o){Ext.getDom(n.el).innerHTML=o.responseText})}var l=n.params,k=n.url||s.url,j,q={success:s.handleResponse,failure:s.handleFailure,scope:s,argument:{options:n},timeout:Ext.num(n.timeout,s.timeout)},m,t;if(Ext.isFunction(l)){l=l.call(n.scope||g,n)}l=Ext.urlEncode(s.extraParams,Ext.isObject(l)?Ext.urlEncode(l):l);if(Ext.isFunction(k)){k=k.call(n.scope||g,n)}if((m=Ext.getDom(n.form))){k=k||m.action;if(n.isUpload||(/multipart\/form-data/i.test(m.getAttribute("enctype")))){return s.doFormUpload.call(s,n,l,k)}t=Ext.lib.Ajax.serializeForm(m);l=l?(l+"&"+t):t}j=n.method||s.method||((l||n.xmlData||n.jsonData)?i:a);if(j===a&&(s.disableCaching&&n.disableCaching!==false)||n.disableCaching===true){var r=n.disableCachingParam||s.disableCachingParam;k=Ext.urlAppend(k,r+"="+(new Date().getTime()))}n.headers=Ext.applyIf(n.headers||{},s.defaultHeaders||{});if(n.autoAbort===true||s.autoAbort){s.abort()}if((j==a||n.xmlData||n.jsonData)&&l){k=Ext.urlAppend(k,l);l=""}return(s.transId=Ext.lib.Ajax.request(j,k,q,l,n))}else{return n.callback?n.callback.apply(n.scope,[n,h,h]):null}},isLoading:function(j){return j?Ext.lib.Ajax.isCallInProgress(j):!!this.transId},abort:function(j){if(j||this.isLoading()){Ext.lib.Ajax.abort(j||this.transId)}},handleResponse:function(j){this.transId=false;var k=j.argument.options;j.argument=k?k.argument:null;this.fireEvent(e,this,j,k);if(k.success){k.success.call(k.scope,j,k)}if(k.callback){k.callback.call(k.scope,k,true,j)}},handleFailure:function(j,l){this.transId=false;var k=j.argument.options;j.argument=k?k.argument:null;this.fireEvent(d,this,j,k,l);if(k.failure){k.failure.call(k.scope,j,k)}if(k.callback){k.callback.call(k.scope,k,false,j)}},doFormUpload:function(q,j,k){var l=Ext.id(),v=document,r=v.createElement("iframe"),m=Ext.getDom(q.form),u=[],t,p="multipart/form-data",n={target:m.target,method:m.method,encoding:m.encoding,enctype:m.enctype,action:m.action};Ext.fly(r).set({id:l,name:l,cls:"x-hidden",src:Ext.SSL_SECURE_URL});v.body.appendChild(r);if(Ext.isIE){document.frames[l].name=l}Ext.fly(m).set({target:l,method:i,enctype:p,encoding:p,action:k||n.action});Ext.iterate(Ext.urlDecode(j,false),function(w,o){t=v.createElement("input");Ext.fly(t).set({type:"hidden",value:o,name:w});m.appendChild(t);u.push(t)});function s(){var x=this,w={responseText:"",responseXML:null,argument:q.argument},A,z;try{A=r.contentWindow.document||r.contentDocument||g.frames[l].document;if(A){if(A.body){if(/textarea/i.test((z=A.body.firstChild||{}).tagName)){w.responseText=z.value}else{w.responseText=A.body.innerHTML}}w.responseXML=A.XMLDocument||A}}catch(y){}Ext.EventManager.removeListener(r,c,s,x);x.fireEvent(e,x,w,q);function o(D,C,B){if(Ext.isFunction(D)){D.apply(C,B)}}o(q.success,q.scope,[w,q]);o(q.callback,q.scope,[q,true,w]);if(!x.debugUploads){setTimeout(function(){Ext.removeNode(r)},100)}}Ext.EventManager.on(r,c,s,this);m.submit();Ext.fly(m).set(n);Ext.each(u,function(o){Ext.removeNode(o)})}})})();Ext.Ajax=new Ext.data.Connection({autoAbort:false,serializeForm:function(a){return Ext.lib.Ajax.serializeForm(a)}});Ext.util.JSON=new (function(){var useHasOwn=!!{}.hasOwnProperty,isNative=function(){var useNative=null;return function(){if(useNative===null){useNative=Ext.USE_NATIVE_JSON&&window.JSON&&JSON.toString()=="[object JSON]"}return useNative}}(),pad=function(n){return n<10?"0"+n:n},doDecode=function(json){return json?eval("("+json+")"):""},doEncode=function(o){if(!Ext.isDefined(o)||o===null){return"null"}else{if(Ext.isArray(o)){return encodeArray(o)}else{if(Ext.isDate(o)){return Ext.util.JSON.encodeDate(o)}else{if(Ext.isString(o)){return encodeString(o)}else{if(typeof o=="number"){return isFinite(o)?String(o):"null"}else{if(Ext.isBoolean(o)){return String(o)}else{var a=["{"],b,i,v;for(i in o){if(!o.getElementsByTagName){if(!useHasOwn||o.hasOwnProperty(i)){v=o[i];switch(typeof v){case"undefined":case"function":case"unknown":break;default:if(b){a.push(",")}a.push(doEncode(i),":",v===null?"null":doEncode(v));b=true}}}}a.push("}");return a.join("")}}}}}}},m={"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},encodeString=function(s){if(/["\\\x00-\x1f]/.test(s)){return'"'+s.replace(/([\x00-\x1f\\"])/g,function(a,b){var c=m[b];if(c){return c}c=b.charCodeAt();return"\\u00"+Math.floor(c/16).toString(16)+(c%16).toString(16)})+'"'}return'"'+s+'"'},encodeArray=function(o){var a=["["],b,i,l=o.length,v;for(i=0;i<l;i+=1){v=o[i];switch(typeof v){case"undefined":case"function":case"unknown":break;default:if(b){a.push(",")}a.push(v===null?"null":Ext.util.JSON.encode(v));b=true}}a.push("]");return a.join("")};this.encodeDate=function(o){return'"'+o.getFullYear()+"-"+pad(o.getMonth()+1)+"-"+pad(o.getDate())+"T"+pad(o.getHours())+":"+pad(o.getMinutes())+":"+pad(o.getSeconds())+'"'};this.encode=function(){var ec;return function(o){if(!ec){ec=isNative()?JSON.stringify:doEncode}return ec(o)}}();this.decode=function(){var dc;return function(json){if(!dc){dc=isNative()?JSON.parse:doDecode}return dc(json)}}()})();Ext.encode=Ext.util.JSON.encode;Ext.decode=Ext.util.JSON.decode;Ext.EventManager=function(){var z,p,j=false,l=Ext.isGecko||Ext.isWebKit||Ext.isSafari,o=Ext.lib.Event,q=Ext.lib.Dom,c=document,A=window,r="DOMContentLoaded",t="complete",g=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,u=[];function n(E){var H=false,D=0,C=u.length,F=false,G;if(E){if(E.getElementById||E.navigator){for(;D<C;++D){G=u[D];if(G.el===E){H=G.id;break}}if(!H){H=Ext.id(E);u.push({id:H,el:E});F=true}}else{H=Ext.id(E)}if(!Ext.elCache[H]){Ext.Element.addToCache(new Ext.Element(E),H);if(F){Ext.elCache[H].skipGC=true}}}return H}function m(E,G,J,F,D,L){E=Ext.getDom(E);var C=n(E),K=Ext.elCache[C].events,H;H=o.on(E,G,D);K[G]=K[G]||[];K[G].push([J,D,L,H,F]);if(E.addEventListener&&G=="mousewheel"){var I=["DOMMouseScroll",D,false];E.addEventListener.apply(E,I);Ext.EventManager.addListener(A,"unload",function(){E.removeEventListener.apply(E,I)})}if(E==c&&G=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.addListener(D)}}function d(){if(window!=top){return false}try{c.documentElement.doScroll("left")}catch(C){return false}b();return true}function B(C){if(Ext.isIE&&d()){return true}if(c.readyState==t){b();return true}j||(p=setTimeout(arguments.callee,2));return false}var k;function i(C){k||(k=Ext.query("style, link[rel=stylesheet]"));if(k.length==c.styleSheets.length){b();return true}j||(p=setTimeout(arguments.callee,2));return false}function y(C){c.removeEventListener(r,arguments.callee,false);i()}function b(C){if(!j){j=true;if(p){clearTimeout(p)}if(l){c.removeEventListener(r,b,false)}if(Ext.isIE&&B.bindIE){c.detachEvent("onreadystatechange",B)}o.un(A,"load",arguments.callee)}if(z&&!Ext.isReady){Ext.isReady=true;z.fire();z.listeners=[]}}function a(){z||(z=new Ext.util.Event());if(l){c.addEventListener(r,b,false)}if(Ext.isIE){if(!B()){B.bindIE=true;c.attachEvent("onreadystatechange",B)}}else{if(Ext.isOpera){(c.readyState==t&&i())||c.addEventListener(r,y,false)}else{if(Ext.isWebKit){B()}}}o.on(A,"load",b)}function x(C,D){return function(){var E=Ext.toArray(arguments);if(D.target==Ext.EventObject.setEvent(E[0]).target){C.apply(this,E)}}}function w(D,E,C){return function(F){C.delay(E.buffer,D,null,[new Ext.EventObjectImpl(F)])}}function s(G,F,C,E,D){return function(H){Ext.EventManager.removeListener(F,C,E,D);G(H)}}function e(D,E,C){return function(G){var F=new Ext.util.DelayedTask(D);if(!C.tasks){C.tasks=[]}C.tasks.push(F);F.delay(E.delay||10,D,null,[new Ext.EventObjectImpl(G)])}}function h(H,G,C,J,K){var D=(!C||typeof C=="boolean")?{}:C,E=Ext.getDom(H),F;J=J||D.fn;K=K||D.scope;if(!E){throw'Error listening for "'+G+'". Element "'+H+"\" doesn't exist."}function I(M){if(!Ext){return}M=Ext.EventObject.setEvent(M);var L;if(D.delegate){if(!(L=M.getTarget(D.delegate,E))){return}}else{L=M.target}if(D.stopEvent){M.stopEvent()}if(D.preventDefault){M.preventDefault()}if(D.stopPropagation){M.stopPropagation()}if(D.normalized===false){M=M.browserEvent}J.call(K||E,M,L,D)}if(D.target){I=x(I,D)}if(D.delay){I=e(I,D,J)}if(D.single){I=s(I,E,G,J,K)}if(D.buffer){F=new Ext.util.DelayedTask(I);I=w(I,D,F)}m(E,G,J,F,I,K);return I}var v={addListener:function(E,C,G,F,D){if(typeof C=="object"){var J=C,H,I;for(H in J){I=J[H];if(!g.test(H)){if(Ext.isFunction(I)){h(E,H,J,I,J.scope)}else{h(E,H,I)}}}}else{h(E,C,D,G,F)}},removeListener:function(E,I,M,N){E=Ext.getDom(E);var C=n(E),K=E&&(Ext.elCache[C].events)[I]||[],D,H,F,G,J,L;for(H=0,J=K.length;H<J;H++){if(Ext.isArray(L=K[H])&&L[0]==M&&(!N||L[2]==N)){if(L[4]){L[4].cancel()}G=M.tasks&&M.tasks.length;if(G){while(G--){M.tasks[G].cancel()}delete M.tasks}D=L[1];o.un(E,I,o.extAdapter?L[3]:D);if(D&&E.addEventListener&&I=="mousewheel"){E.removeEventListener("DOMMouseScroll",D,false)}if(D&&E==c&&I=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.removeListener(D)}K.splice(H,1);if(K.length===0){delete Ext.elCache[C].events[I]}for(G in Ext.elCache[C].events){return false}Ext.elCache[C].events={};return false}}},removeAll:function(E){E=Ext.getDom(E);var D=n(E),J=Ext.elCache[D]||{},M=J.events||{},I,H,K,F,L,G,C;for(F in M){if(M.hasOwnProperty(F)){I=M[F];for(H=0,K=I.length;H<K;H++){L=I[H];if(L[4]){L[4].cancel()}if(L[0].tasks&&(G=L[0].tasks.length)){while(G--){L[0].tasks[G].cancel()}delete L.tasks}C=L[1];o.un(E,F,o.extAdapter?L[3]:C);if(E.addEventListener&&C&&F=="mousewheel"){E.removeEventListener("DOMMouseScroll",C,false)}if(C&&E==c&&F=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.removeListener(C)}}}}if(Ext.elCache[D]){Ext.elCache[D].events={}}},getListeners:function(F,C){F=Ext.getDom(F);var H=n(F),D=Ext.elCache[H]||{},G=D.events||{},E=[];if(G&&G[C]){return G[C]}else{return null}},purgeElement:function(E,C,G){E=Ext.getDom(E);var D=n(E),J=Ext.elCache[D]||{},K=J.events||{},F,I,H;if(G){if(K&&K.hasOwnProperty(G)){I=K[G];for(F=0,H=I.length;F<H;F++){Ext.EventManager.removeListener(E,G,I[F][0])}}}else{Ext.EventManager.removeAll(E)}if(C&&E&&E.childNodes){for(F=0,H=E.childNodes.length;F<H;F++){Ext.EventManager.purgeElement(E.childNodes[F],C,G)}}},_unload:function(){var C;for(C in Ext.elCache){Ext.EventManager.removeAll(C)}delete Ext.elCache;delete Ext.Element._flyweights;var G,D,F,E=Ext.lib.Ajax;(typeof E.conn=="object")?D=E.conn:D={};for(F in D){G=D[F];if(G){E.abort({conn:G,tId:F})}}},onDocumentReady:function(E,D,C){if(Ext.isReady){z||(z=new Ext.util.Event());z.addListener(E,D,C);z.fire();z.listeners=[]}else{if(!z){a()}C=C||{};C.delay=C.delay||1;z.addListener(E,D,C)}},fireDocReady:b};v.on=v.addListener;v.un=v.removeListener;v.stoppedMouseDownEvent=new Ext.util.Event();return v}();Ext.onReady=Ext.EventManager.onDocumentReady;(function(){var a=function(){var c=document.body||document.getElementsByTagName("body")[0];if(!c){return false}var b=[" ",Ext.isIE?"ext-ie "+(Ext.isIE6?"ext-ie6":(Ext.isIE7?"ext-ie7":(Ext.isIE8?"ext-ie8":"ext-ie9"))):Ext.isGecko?"ext-gecko "+(Ext.isGecko2?"ext-gecko2":"ext-gecko3"):Ext.isOpera?"ext-opera":Ext.isWebKit?"ext-webkit":""];if(Ext.isSafari){b.push("ext-safari "+(Ext.isSafari2?"ext-safari2":(Ext.isSafari3?"ext-safari3":"ext-safari4")))}else{if(Ext.isChrome){b.push("ext-chrome")}}if(Ext.isMac){b.push("ext-mac")}if(Ext.isLinux){b.push("ext-linux")}if(Ext.isStrict||Ext.isBorderBox){var d=c.parentNode;if(d){if(!Ext.isStrict){Ext.fly(d,"_internal").addClass("x-quirks");if(Ext.isIE&&!Ext.isStrict){Ext.isIEQuirks=true}}Ext.fly(d,"_internal").addClass(((Ext.isStrict&&Ext.isIE)||(!Ext.enableForcedBoxModel&&!Ext.isIE))?" ext-strict":" ext-border-box")}}if(Ext.enableForcedBoxModel&&!Ext.isIE){Ext.isForcedBorderBox=true;b.push("ext-forced-border-box")}Ext.fly(c,"_internal").addClass(b);return true};if(!a()){Ext.onReady(a)}})();(function(){var b=Ext.apply(Ext.supports,{correctRightMargin:true,correctTransparentColor:true,cssFloat:true});var a=function(){var g=document.createElement("div"),e=document,c,d;g.innerHTML='<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';e.body.appendChild(g);d=g.lastChild;if((c=e.defaultView)){if(c.getComputedStyle(g.firstChild.firstChild,null).marginRight!="0px"){b.correctRightMargin=false}if(c.getComputedStyle(d,null).backgroundColor!="transparent"){b.correctTransparentColor=false}}b.cssFloat=!!d.style.cssFloat;e.body.removeChild(g)};if(Ext.isReady){a()}else{Ext.onReady(a)}})();Ext.EventObject=function(){var b=Ext.lib.Event,c=/(dbl)?click/,a={3:13,63234:37,63235:39,63232:38,63233:40,63276:33,63277:34,63272:46,63273:36,63275:35},d=Ext.isIE?{1:0,4:1,2:2}:{0:0,1:1,2:2};Ext.EventObjectImpl=function(g){if(g){this.setEvent(g.browserEvent||g)}};Ext.EventObjectImpl.prototype={setEvent:function(h){var g=this;if(h==g||(h&&h.browserEvent)){return h}g.browserEvent=h;if(h){g.button=h.button?d[h.button]:(h.which?h.which-1:-1);if(c.test(h.type)&&g.button==-1){g.button=0}g.type=h.type;g.shiftKey=h.shiftKey;g.ctrlKey=h.ctrlKey||h.metaKey||false;g.altKey=h.altKey;g.keyCode=h.keyCode;g.charCode=h.charCode;g.target=b.getTarget(h);g.xy=b.getXY(h)}else{g.button=-1;g.shiftKey=false;g.ctrlKey=false;g.altKey=false;g.keyCode=0;g.charCode=0;g.target=null;g.xy=[0,0]}return g},stopEvent:function(){var e=this;if(e.browserEvent){if(e.browserEvent.type=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.fire(e)}b.stopEvent(e.browserEvent)}},preventDefault:function(){if(this.browserEvent){b.preventDefault(this.browserEvent)}},stopPropagation:function(){var e=this;if(e.browserEvent){if(e.browserEvent.type=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.fire(e)}b.stopPropagation(e.browserEvent)}},getCharCode:function(){return this.charCode||this.keyCode},getKey:function(){return this.normalizeKey(this.keyCode||this.charCode)},normalizeKey:function(e){return Ext.isSafari?(a[e]||e):e},getPageX:function(){return this.xy[0]},getPageY:function(){return this.xy[1]},getXY:function(){return this.xy},getTarget:function(g,h,e){return g?Ext.fly(this.target).findParent(g,h,e):(e?Ext.get(this.target):this.target)},getRelatedTarget:function(){return this.browserEvent?b.getRelatedTarget(this.browserEvent):null},getWheelDelta:function(){var g=this.browserEvent;var h=0;if(g.wheelDelta){h=g.wheelDelta/120}else{if(g.detail){h=-g.detail/3}}return h},within:function(h,i,e){if(h){var g=this[i?"getRelatedTarget":"getTarget"]();return g&&((e?(g==Ext.getDom(h)):false)||Ext.fly(h).contains(g))}return false}};return new Ext.EventObjectImpl()}();Ext.Loader=Ext.apply({},{load:function(j,i,k,c){var k=k||this,g=document.getElementsByTagName("head")[0],b=document.createDocumentFragment(),a=j.length,h=0,e=this;var l=function(m){g.appendChild(e.buildScriptTag(j[m],d))};var d=function(){h++;if(a==h&&typeof i=="function"){i.call(k)}else{if(c===true){l(h)}}};if(c===true){l.call(this,0)}else{Ext.each(j,function(n,m){b.appendChild(this.buildScriptTag(n,d))},this);g.appendChild(b)}},buildScriptTag:function(b,c){var a=document.createElement("script");a.type="text/javascript";a.src=b;if(a.readyState){a.onreadystatechange=function(){if(a.readyState=="loaded"||a.readyState=="complete"){a.onreadystatechange=null;c()}}}else{a.onload=c}return a}});Ext.ns("Ext.grid","Ext.list","Ext.dd","Ext.tree","Ext.form","Ext.menu","Ext.state","Ext.layout.boxOverflow","Ext.app","Ext.ux","Ext.chart","Ext.direct","Ext.slider");Ext.apply(Ext,function(){var c=Ext,a=0,b=null;return{emptyFn:function(){},BLANK_IMAGE_URL:Ext.isIE6||Ext.isIE7||Ext.isAir?"http://www.extjs.com/s.gif":"data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==",extendX:function(d,e){return Ext.extend(d,e(d.prototype))},getDoc:function(){return Ext.get(document)},num:function(e,d){e=Number(Ext.isEmpty(e)||Ext.isArray(e)||typeof e=="boolean"||(typeof e=="string"&&e.trim().length==0)?NaN:e);return isNaN(e)?d:e},value:function(g,d,e){return Ext.isEmpty(g,e)?d:g},escapeRe:function(d){return d.replace(/([-.*+?^${}()|[\]\/\\])/g,"\\$1")},sequence:function(h,d,g,e){h[d]=h[d].createSequence(g,e)},addBehaviors:function(i){if(!Ext.isReady){Ext.onReady(function(){Ext.addBehaviors(i)})}else{var e={},h,d,g;for(d in i){if((h=d.split("@"))[1]){g=h[0];if(!e[g]){e[g]=Ext.select(g)}e[g].on(h[1],i[d])}}e=null}},getScrollBarWidth:function(g){if(!Ext.isReady){return 0}if(g===true||b===null){var i=Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),h=i.child("div",true);var e=h.offsetWidth;i.setStyle("overflow",(Ext.isWebKit||Ext.isGecko)?"auto":"scroll");var d=h.offsetWidth;i.remove();b=e-d+2}return b},combine:function(){var g=arguments,e=g.length,j=[];for(var h=0;h<e;h++){var d=g[h];if(Ext.isArray(d)){j=j.concat(d)}else{if(d.length!==undefined&&!d.substr){j=j.concat(Array.prototype.slice.call(d,0))}else{j.push(d)}}}return j},copyTo:function(d,e,g){if(typeof g=="string"){g=g.split(/[,;\s]/)}Ext.each(g,function(h){if(e.hasOwnProperty(h)){d[h]=e[h]}},this);return d},destroy:function(){Ext.each(arguments,function(d){if(d){if(Ext.isArray(d)){this.destroy.apply(this,d)}else{if(typeof d.destroy=="function"){d.destroy()}else{if(d.dom){d.remove()}}}}},this)},destroyMembers:function(l,j,g,h){for(var k=1,e=arguments,d=e.length;k<d;k++){Ext.destroy(l[e[k]]);delete l[e[k]]}},clean:function(d){var e=[];Ext.each(d,function(g){if(!!g){e.push(g)}});return e},unique:function(d){var e=[],g={};Ext.each(d,function(h){if(!g[h]){e.push(h)}g[h]=true});return e},flatten:function(d){var g=[];function e(h){Ext.each(h,function(i){if(Ext.isArray(i)){e(i)}else{g.push(i)}});return g}return e(d)},min:function(d,e){var g=d[0];e=e||function(i,h){return i<h?-1:1};Ext.each(d,function(h){g=e(g,h)==-1?g:h});return g},max:function(d,e){var g=d[0];e=e||function(i,h){return i>h?1:-1};Ext.each(d,function(h){g=e(g,h)==1?g:h});return g},mean:function(d){return d.length>0?Ext.sum(d)/d.length:undefined},sum:function(d){var e=0;Ext.each(d,function(g){e+=g});return e},partition:function(d,e){var g=[[],[]];Ext.each(d,function(j,k,h){g[(e&&e(j,k,h))||(!e&&j)?0:1].push(j)});return g},invoke:function(d,e){var h=[],g=Array.prototype.slice.call(arguments,2);Ext.each(d,function(j,k){if(j&&typeof j[e]=="function"){h.push(j[e].apply(j,g))}else{h.push(undefined)}});return h},pluck:function(d,g){var e=[];Ext.each(d,function(h){e.push(h[g])});return e},zip:function(){var n=Ext.partition(arguments,function(i){return typeof i!="function"}),k=n[0],m=n[1][0],d=Ext.max(Ext.pluck(k,"length")),h=[];for(var l=0;l<d;l++){h[l]=[];if(m){h[l]=m.apply(m,Ext.pluck(k,l))}else{for(var g=0,e=k.length;g<e;g++){h[l].push(k[g][l])}}}return h},getCmp:function(d){return Ext.ComponentMgr.get(d)},useShims:c.isIE6||(c.isMac&&c.isGecko2),type:function(e){if(e===undefined||e===null){return false}if(e.htmlElement){return"element"}var d=typeof e;if(d=="object"&&e.nodeName){switch(e.nodeType){case 1:return"element";case 3:return(/\S/).test(e.nodeValue)?"textnode":"whitespace"}}if(d=="object"||d=="function"){switch(e.constructor){case Array:return"array";case RegExp:return"regexp";case Date:return"date"}if(typeof e.length=="number"&&typeof e.item=="function"){return"nodelist"}}return d},intercept:function(h,d,g,e){h[d]=h[d].createInterceptor(g,e)},callback:function(d,h,g,e){if(typeof d=="function"){if(e){d.defer(e,h,g||[])}else{d.apply(h,g||[])}}}}}());Ext.apply(Function.prototype,{createSequence:function(b,a){var c=this;return(typeof b!="function")?this:function(){var d=c.apply(this||window,arguments);b.apply(a||this||window,arguments);return d}}});Ext.applyIf(String,{escape:function(a){return a.replace(/('|\\)/g,"\\$1")},leftPad:function(d,b,c){var a=String(d);if(!c){c=" "}while(a.length<b){a=c+a}return a}});String.prototype.toggle=function(b,a){return this==b?a:b};String.prototype.trim=function(){var a=/^\s+|\s+$/g;return function(){return this.replace(a,"")}}();Date.prototype.getElapsed=function(a){return Math.abs((a||new Date()).getTime()-this.getTime())};Ext.applyIf(Number.prototype,{constrain:function(b,a){return Math.min(Math.max(this,b),a)}});Ext.lib.Dom.getRegion=function(a){return Ext.lib.Region.getRegion(a)};Ext.lib.Region=function(d,g,a,c){var e=this;e.top=d;e[1]=d;e.right=g;e.bottom=a;e.left=c;e[0]=c};Ext.lib.Region.prototype={contains:function(b){var a=this;return(b.left>=a.left&&b.right<=a.right&&b.top>=a.top&&b.bottom<=a.bottom)},getArea:function(){var a=this;return((a.bottom-a.top)*(a.right-a.left))},intersect:function(h){var g=this,d=Math.max(g.top,h.top),e=Math.min(g.right,h.right),a=Math.min(g.bottom,h.bottom),c=Math.max(g.left,h.left);if(a>=d&&e>=c){return new Ext.lib.Region(d,e,a,c)}},union:function(h){var g=this,d=Math.min(g.top,h.top),e=Math.max(g.right,h.right),a=Math.max(g.bottom,h.bottom),c=Math.min(g.left,h.left);return new Ext.lib.Region(d,e,a,c)},constrainTo:function(b){var a=this;a.top=a.top.constrain(b.top,b.bottom);a.bottom=a.bottom.constrain(b.top,b.bottom);a.left=a.left.constrain(b.left,b.right);a.right=a.right.constrain(b.left,b.right);return a},adjust:function(d,c,a,g){var e=this;e.top+=d;e.left+=c;e.right+=g;e.bottom+=a;return e}};Ext.lib.Region.getRegion=function(e){var h=Ext.lib.Dom.getXY(e),d=h[1],g=h[0]+e.offsetWidth,a=h[1]+e.offsetHeight,c=h[0];return new Ext.lib.Region(d,g,a,c)};Ext.lib.Point=function(a,c){if(Ext.isArray(a)){c=a[1];a=a[0]}var b=this;b.x=b.right=b.left=b[0]=a;b.y=b.top=b.bottom=b[1]=c};Ext.lib.Point.prototype=new Ext.lib.Region();Ext.apply(Ext.DomHelper,function(){var e,a="afterbegin",h="afterend",i="beforebegin",d="beforeend",b=/tag|children|cn|html$/i;function g(m,p,n,q,l,j){m=Ext.getDom(m);var k;if(e.useDom){k=c(p,null);if(j){m.appendChild(k)}else{(l=="firstChild"?m:m.parentNode).insertBefore(k,m[l]||m)}}else{k=Ext.DomHelper.insertHtml(q,m,Ext.DomHelper.createHtml(p))}return n?Ext.get(k,true):k}function c(j,r){var k,u=document,p,s,m,t;if(Ext.isArray(j)){k=u.createDocumentFragment();for(var q=0,n=j.length;q<n;q++){c(j[q],k)}}else{if(typeof j=="string"){k=u.createTextNode(j)}else{k=u.createElement(j.tag||"div");p=!!k.setAttribute;for(var s in j){if(!b.test(s)){m=j[s];if(s=="cls"){k.className=m}else{if(p){k.setAttribute(s,m)}else{k[s]=m}}}}Ext.DomHelper.applyStyles(k,j.style);if((t=j.children||j.cn)){c(t,k)}else{if(j.html){k.innerHTML=j.html}}}}if(r){r.appendChild(k)}return k}e={createTemplate:function(k){var j=Ext.DomHelper.createHtml(k);return new Ext.Template(j)},useDom:false,insertBefore:function(j,l,k){return g(j,l,k,i)},insertAfter:function(j,l,k){return g(j,l,k,h,"nextSibling")},insertFirst:function(j,l,k){return g(j,l,k,a,"firstChild")},append:function(j,l,k){return g(j,l,k,d,"",true)},createDom:c};return e}());Ext.apply(Ext.Template.prototype,{disableFormats:false,re:/\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,argsRe:/^\s*['"](.*)["']\s*$/,compileARe:/\\/g,compileBRe:/(\r\n|\n)/g,compileCRe:/'/g,applyTemplate:function(b){var g=this,a=g.disableFormats!==true,e=Ext.util.Format,c=g;if(g.compiled){return g.compiled(b)}function d(j,l,p,k){if(p&&a){if(p.substr(0,5)=="this."){return c.call(p.substr(5),b[l],b)}else{if(k){var o=g.argsRe;k=k.split(",");for(var n=0,h=k.length;n<h;n++){k[n]=k[n].replace(o,"$1")}k=[b[l]].concat(k)}else{k=[b[l]]}return e[p].apply(e,k)}}else{return b[l]!==undefined?b[l]:""}}return g.html.replace(g.re,d)},compile:function(){var me=this,fm=Ext.util.Format,useF=me.disableFormats!==true,sep=Ext.isGecko?"+":",",body;function fn(m,name,format,args){if(format&&useF){args=args?","+args:"";if(format.substr(0,5)!="this."){format="fm."+format+"("}else{format='this.call("'+format.substr(5)+'", ';args=", values"}}else{args="";format="(values['"+name+"'] == undefined ? '' : "}return"'"+sep+format+"values['"+name+"']"+args+")"+sep+"'"}if(Ext.isGecko){body="this.compiled = function(values){ return '"+me.html.replace(me.compileARe,"\\\\").replace(me.compileBRe,"\\n").replace(me.compileCRe,"\\'").replace(me.re,fn)+"';};"}else{body=["this.compiled = function(values){ return ['"];body.push(me.html.replace(me.compileARe,"\\\\").replace(me.compileBRe,"\\n").replace(me.compileCRe,"\\'").replace(me.re,fn));body.push("'].join('');};");body=body.join("")}eval(body);return me},call:function(c,b,a){return this[c](b,a)}});Ext.Template.prototype.apply=Ext.Template.prototype.applyTemplate;Ext.util.Functions={createInterceptor:function(c,b,a){var d=c;if(!Ext.isFunction(b)){return c}else{return function(){var g=this,e=arguments;b.target=g;b.method=c;return(b.apply(a||g||window,e)!==false)?c.apply(g||window,e):null}}},createDelegate:function(c,d,b,a){if(!Ext.isFunction(c)){return c}return function(){var g=b||arguments;if(a===true){g=Array.prototype.slice.call(arguments,0);g=g.concat(b)}else{if(Ext.isNumber(a)){g=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(g,e)}}return c.apply(d||window,g)}},defer:function(d,c,e,b,a){d=Ext.util.Functions.createDelegate(d,e,b,a);if(c>0){return setTimeout(d,c)}d();return 0},createSequence:function(c,b,a){if(!Ext.isFunction(b)){return c}else{return function(){var d=c.apply(this||window,arguments);b.apply(a||this||window,arguments);return d}}}};Ext.defer=Ext.util.Functions.defer;Ext.createInterceptor=Ext.util.Functions.createInterceptor;Ext.createSequence=Ext.util.Functions.createSequence;Ext.createDelegate=Ext.util.Functions.createDelegate;Ext.apply(Ext.util.Observable.prototype,function(){function a(j){var i=(this.methodEvents=this.methodEvents||{})[j],d,c,g,h=this;if(!i){this.methodEvents[j]=i={};i.originalFn=this[j];i.methodName=j;i.before=[];i.after=[];var b=function(l,k,e){if((c=l.apply(k||h,e))!==undefined){if(typeof c=="object"){if(c.returnValue!==undefined){d=c.returnValue}else{d=c}g=!!c.cancel}else{if(c===false){g=true}else{d=c}}}};this[j]=function(){var l=Array.prototype.slice.call(arguments,0),k;d=c=undefined;g=false;for(var m=0,e=i.before.length;m<e;m++){k=i.before[m];b(k.fn,k.scope,l);if(g){return d}}if((c=i.originalFn.apply(h,l))!==undefined){d=c}for(var m=0,e=i.after.length;m<e;m++){k=i.after[m];b(k.fn,k.scope,l);if(g){return d}}return d}}return i}return{beforeMethod:function(d,c,b){a.call(this,d).before.push({fn:c,scope:b})},afterMethod:function(d,c,b){a.call(this,d).after.push({fn:c,scope:b})},removeMethodListener:function(j,g,d){var h=this.getMethodEvent(j);for(var c=0,b=h.before.length;c<b;c++){if(h.before[c].fn==g&&h.before[c].scope==d){h.before.splice(c,1);return}}for(var c=0,b=h.after.length;c<b;c++){if(h.after[c].fn==g&&h.after[c].scope==d){h.after.splice(c,1);return}}},relayEvents:function(j,e){var h=this;function g(i){return function(){return h.fireEvent.apply(h,[i].concat(Array.prototype.slice.call(arguments,0)))}}for(var d=0,b=e.length;d<b;d++){var c=e[d];h.events[c]=h.events[c]||true;j.on(c,g(c),h)}},enableBubble:function(e){var g=this;if(!Ext.isEmpty(e)){e=Ext.isArray(e)?e:Array.prototype.slice.call(arguments,0);for(var d=0,b=e.length;d<b;d++){var c=e[d];c=c.toLowerCase();var h=g.events[c]||true;if(typeof h=="boolean"){h=new Ext.util.Event(g,c);g.events[c]=h}h.bubble=true}}}}}());Ext.util.Observable.capture=function(c,b,a){c.fireEvent=c.fireEvent.createInterceptor(b,a)};Ext.util.Observable.observeClass=function(b,a){if(b){if(!b.fireEvent){Ext.apply(b,new Ext.util.Observable());Ext.util.Observable.capture(b.prototype,b.fireEvent,b)}if(typeof a=="object"){b.on(a)}return b}};Ext.apply(Ext.EventManager,function(){var d,k,g,b,a=Ext.lib.Dom,j=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,c=Ext.EventManager._unload,i=0,h=0,e=Ext.isWebKit?Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1])>=525:!((Ext.isGecko&&!Ext.isWindows)||Ext.isOpera);return{_unload:function(){Ext.EventManager.un(window,"resize",this.fireWindowResize,this);c.call(Ext.EventManager)},doResizeEvent:function(){var m=a.getViewHeight(),l=a.getViewWidth();if(h!=m||i!=l){d.fire(i=l,h=m)}},onWindowResize:function(n,m,l){if(!d){d=new Ext.util.Event();k=new Ext.util.DelayedTask(this.doResizeEvent);Ext.EventManager.on(window,"resize",this.fireWindowResize,this)}d.addListener(n,m,l)},fireWindowResize:function(){if(d){k.delay(100)}},onTextResize:function(o,n,l){if(!g){g=new Ext.util.Event();var m=new Ext.Element(document.createElement("div"));m.dom.className="x-text-resize";m.dom.innerHTML="X";m.appendTo(document.body);b=m.dom.offsetHeight;setInterval(function(){if(m.dom.offsetHeight!=b){g.fire(b,b=m.dom.offsetHeight)}},this.textResizeInterval)}g.addListener(o,n,l)},removeResizeListener:function(m,l){if(d){d.removeListener(m,l)}},fireResize:function(){if(d){d.fire(a.getViewWidth(),a.getViewHeight())}},textResizeInterval:50,ieDeferSrc:false,getKeyEvent:function(){return e?"keydown":"keypress"},useKeydown:e}}());Ext.EventManager.on=Ext.EventManager.addListener;Ext.apply(Ext.EventObjectImpl.prototype,{BACKSPACE:8,TAB:9,NUM_CENTER:12,ENTER:13,RETURN:13,SHIFT:16,CTRL:17,CONTROL:17,ALT:18,PAUSE:19,CAPS_LOCK:20,ESC:27,SPACE:32,PAGE_UP:33,PAGEUP:33,PAGE_DOWN:34,PAGEDOWN:34,END:35,HOME:36,LEFT:37,UP:38,RIGHT:39,DOWN:40,PRINT_SCREEN:44,INSERT:45,DELETE:46,ZERO:48,ONE:49,TWO:50,THREE:51,FOUR:52,FIVE:53,SIX:54,SEVEN:55,EIGHT:56,NINE:57,A:65,B:66,C:67,D:68,E:69,F:70,G:71,H:72,I:73,J:74,K:75,L:76,M:77,N:78,O:79,P:80,Q:81,R:82,S:83,T:84,U:85,V:86,W:87,X:88,Y:89,Z:90,CONTEXT_MENU:93,NUM_ZERO:96,NUM_ONE:97,NUM_TWO:98,NUM_THREE:99,NUM_FOUR:100,NUM_FIVE:101,NUM_SIX:102,NUM_SEVEN:103,NUM_EIGHT:104,NUM_NINE:105,NUM_MULTIPLY:106,NUM_PLUS:107,NUM_MINUS:109,NUM_PERIOD:110,NUM_DIVISION:111,F1:112,F2:113,F3:114,F4:115,F5:116,F6:117,F7:118,F8:119,F9:120,F10:121,F11:122,F12:123,isNavKeyPress:function(){var b=this,a=this.normalizeKey(b.keyCode);return(a>=33&&a<=40)||a==b.RETURN||a==b.TAB||a==b.ESC},isSpecialKey:function(){var a=this.normalizeKey(this.keyCode);return(this.type=="keypress"&&this.ctrlKey)||this.isNavKeyPress()||(a==this.BACKSPACE)||(a>=16&&a<=20)||(a>=44&&a<=46)},getPoint:function(){return new Ext.lib.Point(this.xy[0],this.xy[1])},hasModifier:function(){return((this.ctrlKey||this.altKey)||this.shiftKey)}});Ext.Element.addMethods({swallowEvent:function(a,b){var d=this;function c(g){g.stopPropagation();if(b){g.preventDefault()}}if(Ext.isArray(a)){Ext.each(a,function(g){d.on(g,c)});return d}d.on(a,c);return d},relayEvent:function(a,b){this.on(a,function(c){b.fireEvent(a,c)})},clean:function(b){var d=this,e=d.dom,g=e.firstChild,c=-1;if(Ext.Element.data(e,"isCleaned")&&b!==true){return d}while(g){var a=g.nextSibling;if(g.nodeType==3&&!(/\S/.test(g.nodeValue))){e.removeChild(g)}else{g.nodeIndex=++c}g=a}Ext.Element.data(e,"isCleaned",true);return d},load:function(){var a=this.getUpdater();a.update.apply(a,arguments);return this},getUpdater:function(){return this.updateManager||(this.updateManager=new Ext.Updater(this))},update:function(html,loadScripts,callback){if(!this.dom){return this}html=html||"";if(loadScripts!==true){this.dom.innerHTML=html;if(typeof callback=="function"){callback()}return this}var id=Ext.id(),dom=this.dom;html+='<span id="'+id+'"></span>';Ext.lib.Event.onAvailable(id,function(){var DOC=document,hd=DOC.getElementsByTagName("head")[0],re=/(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,srcRe=/\ssrc=([\'\"])(.*?)\1/i,typeRe=/\stype=([\'\"])(.*?)\1/i,match,attrs,srcMatch,typeMatch,el,s;while((match=re.exec(html))){attrs=match[1];srcMatch=attrs?attrs.match(srcRe):false;if(srcMatch&&srcMatch[2]){s=DOC.createElement("script");s.src=srcMatch[2];typeMatch=attrs.match(typeRe);if(typeMatch&&typeMatch[2]){s.type=typeMatch[2]}hd.appendChild(s)}else{if(match[2]&&match[2].length>0){if(window.execScript){window.execScript(match[2])}else{window.eval(match[2])}}}}el=DOC.getElementById(id);if(el){Ext.removeNode(el)}if(typeof callback=="function"){callback()}});dom.innerHTML=html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,"");return this},removeAllListeners:function(){this.removeAnchor();Ext.EventManager.removeAll(this.dom);return this},createProxy:function(a,e,d){a=(typeof a=="object")?a:{tag:"div",cls:a};var c=this,b=e?Ext.DomHelper.append(e,a,true):Ext.DomHelper.insertBefore(c.dom,a,true);if(d&&c.setBox&&c.getBox){b.setBox(c.getBox())}return b}});Ext.Element.prototype.getUpdateManager=Ext.Element.prototype.getUpdater;Ext.Element.addMethods({getAnchorXY:function(e,l,q){e=(e||"tl").toLowerCase();q=q||{};var k=this,b=k.dom==document.body||k.dom==document,n=q.width||b?Ext.lib.Dom.getViewWidth():k.getWidth(),i=q.height||b?Ext.lib.Dom.getViewHeight():k.getHeight(),p,a=Math.round,c=k.getXY(),m=k.getScroll(),j=b?m.left:!l?c[0]:0,g=b?m.top:!l?c[1]:0,d={c:[a(n*0.5),a(i*0.5)],t:[a(n*0.5),0],l:[0,a(i*0.5)],r:[n,a(i*0.5)],b:[a(n*0.5),i],tl:[0,0],bl:[0,i],br:[n,i],tr:[n,0]};p=d[e];return[p[0]+j,p[1]+g]},anchorTo:function(b,h,c,a,k,l){var i=this,e=i.dom,j=!Ext.isEmpty(k),d=function(){Ext.fly(e).alignTo(b,h,c,a);Ext.callback(l,Ext.fly(e))},g=this.getAnchor();this.removeAnchor();Ext.apply(g,{fn:d,scroll:j});Ext.EventManager.onWindowResize(d,null);if(j){Ext.EventManager.on(window,"scroll",d,null,{buffer:!isNaN(k)?k:50})}d.call(i);return i},removeAnchor:function(){var b=this,a=this.getAnchor();if(a&&a.fn){Ext.EventManager.removeResizeListener(a.fn);if(a.scroll){Ext.EventManager.un(window,"scroll",a.fn)}delete a.fn}return b},getAnchor:function(){var b=Ext.Element.data,c=this.dom;if(!c){return}var a=b(c,"_anchor");if(!a){a=b(c,"_anchor",{})}return a},getAlignToXY:function(g,A,B){g=Ext.get(g);if(!g||!g.dom){throw"Element.alignToXY with an element that doesn't exist"}B=B||[0,0];A=(!A||A=="?"?"tl-bl?":(!(/-/).test(A)&&A!==""?"tl-"+A:A||"tl-bl")).toLowerCase();var K=this,H=K.dom,M,L,n,l,s,F,v,t=Ext.lib.Dom.getViewWidth()-10,G=Ext.lib.Dom.getViewHeight()-10,b,i,j,k,u,z,N=document,J=N.documentElement,q=N.body,E=(J.scrollLeft||q.scrollLeft||0)+5,D=(J.scrollTop||q.scrollTop||0)+5,I=false,e="",a="",C=A.match(/^([a-z]+)-([a-z]+)(\?)?$/);if(!C){throw"Element.alignTo with an invalid alignment "+A}e=C[1];a=C[2];I=!!C[3];M=K.getAnchorXY(e,true);L=g.getAnchorXY(a,false);n=L[0]-M[0]+B[0];l=L[1]-M[1]+B[1];if(I){s=K.getWidth();F=K.getHeight();v=g.getRegion();b=e.charAt(0);i=e.charAt(e.length-1);j=a.charAt(0);k=a.charAt(a.length-1);u=((b=="t"&&j=="b")||(b=="b"&&j=="t"));z=((i=="r"&&k=="l")||(i=="l"&&k=="r"));if(n+s>t+E){n=z?v.left-s:t+E-s}if(n<E){n=z?v.right:E}if(l+F>G+D){l=u?v.top-F:G+D-F}if(l<D){l=u?v.bottom:D}}return[n,l]},alignTo:function(c,a,e,b){var d=this;return d.setXY(d.getAlignToXY(c,a,e),d.preanim&&!!b?d.preanim(arguments,3):false)},adjustForConstraints:function(c,a,b){return this.getConstrainToXY(a||document,false,b,c)||c},getConstrainToXY:function(b,a,c,e){var d={top:0,left:0,bottom:0,right:0};return function(i,A,l,n){i=Ext.get(i);l=l?Ext.applyIf(l,d):d;var z,D,v=0,u=0;if(i.dom==document.body||i.dom==document){z=Ext.lib.Dom.getViewWidth();D=Ext.lib.Dom.getViewHeight()}else{z=i.dom.clientWidth;D=i.dom.clientHeight;if(!A){var t=i.getXY();v=t[0];u=t[1]}}var r=i.getScroll();v+=l.left+r.left;u+=l.top+r.top;z-=l.right;D-=l.bottom;var B=v+z,g=u+D,j=n||(!A?this.getXY():[this.getLeft(true),this.getTop(true)]),p=j[0],o=j[1],k=this.getConstrainOffset(),q=this.dom.offsetWidth+k,C=this.dom.offsetHeight+k;var m=false;if((p+q)>B){p=B-q;m=true}if((o+C)>g){o=g-C;m=true}if(p<v){p=v;m=true}if(o<u){o=u;m=true}return m?[p,o]:false}}(),getConstrainOffset:function(){return 0},getCenterXY:function(){return this.getAlignToXY(document,"c-c")},center:function(a){return this.alignTo(a||document,"c-c")}});Ext.Element.addMethods({select:function(a,b){return Ext.Element.select(a,b,this.dom)}});Ext.apply(Ext.Element.prototype,function(){var c=Ext.getDom,a=Ext.get,b=Ext.DomHelper;return{insertSibling:function(i,g,h){var j=this,e,d=(g||"before").toLowerCase()=="after",k;if(Ext.isArray(i)){k=j;Ext.each(i,function(l){e=Ext.fly(k,"_internal").insertSibling(l,g,h);if(d){k=e}});return e}i=i||{};if(i.nodeType||i.dom){e=j.dom.parentNode.insertBefore(c(i),d?j.dom.nextSibling:j.dom);if(!h){e=a(e)}}else{if(d&&!j.dom.nextSibling){e=b.append(j.dom.parentNode,i,!h)}else{e=b[d?"insertAfter":"insertBefore"](j.dom,i,!h)}}return e}}}());Ext.Element.boxMarkup='<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';Ext.Element.addMethods(function(){var a="_internal",b=/(\d+\.?\d+)px/;return{applyStyles:function(c){Ext.DomHelper.applyStyles(this.dom,c);return this},getStyles:function(){var c={};Ext.each(arguments,function(d){c[d]=this.getStyle(d)},this);return c},setOverflow:function(c){var d=this.dom;if(c=="auto"&&Ext.isMac&&Ext.isGecko2){d.style.overflow="hidden";(function(){d.style.overflow="auto"}).defer(1)}else{d.style.overflow=c}},boxWrap:function(c){c=c||"x-box";var d=Ext.get(this.insertHtml("beforeBegin","<div class='"+c+"'>"+String.format(Ext.Element.boxMarkup,c)+"</div>"));Ext.DomQuery.selectNode("."+c+"-mc",d.dom).appendChild(this.dom);return d},setSize:function(e,c,d){var g=this;if(typeof e=="object"){c=e.height;e=e.width}e=g.adjustWidth(e);c=g.adjustHeight(c);if(!d||!g.anim){g.dom.style.width=g.addUnits(e);g.dom.style.height=g.addUnits(c)}else{g.anim({width:{to:e},height:{to:c}},g.preanim(arguments,2))}return g},getComputedHeight:function(){var d=this,c=Math.max(d.dom.offsetHeight,d.dom.clientHeight);if(!c){c=parseFloat(d.getStyle("height"))||0;if(!d.isBorderBox()){c+=d.getFrameWidth("tb")}}return c},getComputedWidth:function(){var c=Math.max(this.dom.offsetWidth,this.dom.clientWidth);if(!c){c=parseFloat(this.getStyle("width"))||0;if(!this.isBorderBox()){c+=this.getFrameWidth("lr")}}return c},getFrameWidth:function(d,c){return c&&this.isBorderBox()?0:(this.getPadding(d)+this.getBorderWidth(d))},addClassOnOver:function(c){this.hover(function(){Ext.fly(this,a).addClass(c)},function(){Ext.fly(this,a).removeClass(c)});return this},addClassOnFocus:function(c){this.on("focus",function(){Ext.fly(this,a).addClass(c)},this.dom);this.on("blur",function(){Ext.fly(this,a).removeClass(c)},this.dom);return this},addClassOnClick:function(c){var d=this.dom;this.on("mousedown",function(){Ext.fly(d,a).addClass(c);var g=Ext.getDoc(),e=function(){Ext.fly(d,a).removeClass(c);g.removeListener("mouseup",e)};g.on("mouseup",e)});return this},getViewSize:function(){var g=document,h=this.dom,c=(h==g||h==g.body);if(c){var e=Ext.lib.Dom;return{width:e.getViewWidth(),height:e.getViewHeight()}}else{return{width:h.clientWidth,height:h.clientHeight}}},getStyleSize:function(){var j=this,c,i,l=document,m=this.dom,e=(m==l||m==l.body),g=m.style;if(e){var k=Ext.lib.Dom;return{width:k.getViewWidth(),height:k.getViewHeight()}}if(g.width&&g.width!="auto"){c=parseFloat(g.width);if(j.isBorderBox()){c-=j.getFrameWidth("lr")}}if(g.height&&g.height!="auto"){i=parseFloat(g.height);if(j.isBorderBox()){i-=j.getFrameWidth("tb")}}return{width:c||j.getWidth(true),height:i||j.getHeight(true)}},getSize:function(c){return{width:this.getWidth(c),height:this.getHeight(c)}},repaint:function(){var c=this.dom;this.addClass("x-repaint");setTimeout(function(){Ext.fly(c).removeClass("x-repaint")},1);return this},unselectable:function(){this.dom.unselectable="on";return this.swallowEvent("selectstart",true).applyStyles("-moz-user-select:none;-khtml-user-select:none;").addClass("x-unselectable")},getMargins:function(d){var e=this,c,g={t:"top",l:"left",r:"right",b:"bottom"},h={};if(!d){for(c in e.margins){h[g[c]]=parseFloat(e.getStyle(e.margins[c]))||0}return h}else{return e.addStyles.call(e,d,e.margins)}}}}());Ext.Element.addMethods({setBox:function(e,g,b){var d=this,a=e.width,c=e.height;if((g&&!d.autoBoxAdjust)&&!d.isBorderBox()){a-=(d.getBorderWidth("lr")+d.getPadding("lr"));c-=(d.getBorderWidth("tb")+d.getPadding("tb"))}d.setBounds(e.x,e.y,a,c,d.animTest.call(d,arguments,b,2));return d},getBox:function(j,p){var m=this,v,e,o,d=m.getBorderWidth,q=m.getPadding,g,a,u,n;if(!p){v=m.getXY()}else{e=parseInt(m.getStyle("left"),10)||0;o=parseInt(m.getStyle("top"),10)||0;v=[e,o]}var c=m.dom,s=c.offsetWidth,i=c.offsetHeight,k;if(!j){k={x:v[0],y:v[1],0:v[0],1:v[1],width:s,height:i}}else{g=d.call(m,"l")+q.call(m,"l");a=d.call(m,"r")+q.call(m,"r");u=d.call(m,"t")+q.call(m,"t");n=d.call(m,"b")+q.call(m,"b");k={x:v[0]+g,y:v[1]+u,0:v[0]+g,1:v[1]+u,width:s-(g+a),height:i-(u+n)}}k.right=k.x+k.width;k.bottom=k.y+k.height;return k},move:function(j,b,c){var g=this,m=g.getXY(),k=m[0],i=m[1],d=[k-b,i],l=[k+b,i],h=[k,i-b],a=[k,i+b],e={l:d,left:d,r:l,right:l,t:h,top:h,up:h,b:a,bottom:a,down:a};j=j.toLowerCase();g.moveTo(e[j][0],e[j][1],g.animTest.call(g,arguments,c,2))},setLeftTop:function(d,c){var b=this,a=b.dom.style;a.left=b.addUnits(d);a.top=b.addUnits(c);return b},getRegion:function(){return Ext.lib.Dom.getRegion(this.dom)},setBounds:function(b,g,d,a,c){var e=this;if(!c||!e.anim){e.setSize(d,a);e.setLocation(b,g)}else{e.anim({points:{to:[b,g]},width:{to:e.adjustWidth(d)},height:{to:e.adjustHeight(a)}},e.preanim(arguments,4),"motion")}return e},setRegion:function(b,a){return this.setBounds(b.left,b.top,b.right-b.left,b.bottom-b.top,this.animTest.call(this,arguments,a,1))}});Ext.Element.addMethods({scrollTo:function(b,d,a){var e=/top/i.test(b),c=this,g=c.dom,h;if(!a||!c.anim){h="scroll"+(e?"Top":"Left");g[h]=d}else{h="scroll"+(e?"Left":"Top");c.anim({scroll:{to:e?[g[h],d]:[d,g[h]]}},c.preanim(arguments,2),"scroll")}return c},scrollIntoView:function(e,i){var p=Ext.getDom(e)||Ext.getBody().dom,h=this.dom,g=this.getOffsetsTo(p),k=g[0]+p.scrollLeft,u=g[1]+p.scrollTop,q=u+h.offsetHeight,d=k+h.offsetWidth,a=p.clientHeight,m=parseInt(p.scrollTop,10),s=parseInt(p.scrollLeft,10),j=m+a,n=s+p.clientWidth;if(h.offsetHeight>a||u<m){p.scrollTop=u}else{if(q>j){p.scrollTop=q-a}}p.scrollTop=p.scrollTop;if(i!==false){if(h.offsetWidth>p.clientWidth||k<s){p.scrollLeft=k}else{if(d>n){p.scrollLeft=d-p.clientWidth}}p.scrollLeft=p.scrollLeft}return this},scrollChildIntoView:function(b,a){Ext.fly(b,"_scrollChildIntoView").scrollIntoView(this,a)},scroll:function(m,b,d){if(!this.isScrollable()){return false}var e=this.dom,g=e.scrollLeft,p=e.scrollTop,n=e.scrollWidth,k=e.scrollHeight,i=e.clientWidth,a=e.clientHeight,c=false,o,j={l:Math.min(g+b,n-i),r:o=Math.max(g-b,0),t:Math.max(p-b,0),b:Math.min(p+b,k-a)};j.d=j.b;j.u=j.t;m=m.substr(0,1);if((o=j[m])>-1){c=true;this.scrollTo(m=="l"||m=="r"?"left":"top",o,this.preanim(arguments,2))}return c}});Ext.Element.addMethods(function(){var d="visibility",b="display",a="hidden",h="none",c="x-masked",g="x-masked-relative",e=Ext.Element.data;return{isVisible:function(i){var j=!this.isStyle(d,a)&&!this.isStyle(b,h),k=this.dom.parentNode;if(i!==true||!j){return j}while(k&&!(/^body/i.test(k.tagName))){if(!Ext.fly(k,"_isVisible").isVisible()){return false}k=k.parentNode}return true},isDisplayed:function(){return !this.isStyle(b,h)},enableDisplayMode:function(i){this.setVisibilityMode(Ext.Element.DISPLAY);if(!Ext.isEmpty(i)){e(this.dom,"originalDisplay",i)}return this},mask:function(j,n){var p=this,l=p.dom,o=Ext.DomHelper,m="ext-el-mask-msg",i,q;if(!/^body/i.test(l.tagName)&&p.getStyle("position")=="static"){p.addClass(g)}if(i=e(l,"maskMsg")){i.remove()}if(i=e(l,"mask")){i.remove()}q=o.append(l,{cls:"ext-el-mask"},true);e(l,"mask",q);p.addClass(c);q.setDisplayed(true);if(typeof j=="string"){var k=o.append(l,{cls:m,cn:{tag:"div"}},true);e(l,"maskMsg",k);k.dom.className=n?m+" "+n:m;k.dom.firstChild.innerHTML=j;k.setDisplayed(true);k.center(p)}if(Ext.isIE&&!(Ext.isIE7&&Ext.isStrict)&&p.getStyle("height")=="auto"){q.setSize(undefined,p.getHeight())}return q},unmask:function(){var k=this,l=k.dom,i=e(l,"mask"),j=e(l,"maskMsg");if(i){if(j){j.remove();e(l,"maskMsg",undefined)}i.remove();e(l,"mask",undefined);k.removeClass([c,g])}},isMasked:function(){var i=e(this.dom,"mask");return i&&i.isVisible()},createShim:function(){var i=document.createElement("iframe"),j;i.frameBorder="0";i.className="ext-shim";i.src=Ext.SSL_SECURE_URL;j=Ext.get(this.dom.parentNode.insertBefore(i,this.dom));j.autoBoxAdjust=false;return j}}}());Ext.Element.addMethods({addKeyListener:function(b,d,c){var a;if(typeof b!="object"||Ext.isArray(b)){a={key:b,fn:d,scope:c}}else{a={key:b.key,shift:b.shift,ctrl:b.ctrl,alt:b.alt,fn:d,scope:c}}return new Ext.KeyMap(this,a)},addKeyMap:function(a){return new Ext.KeyMap(this,a)}});Ext.CompositeElementLite.importElementMethods();Ext.apply(Ext.CompositeElementLite.prototype,{addElements:function(c,a){if(!c){return this}if(typeof c=="string"){c=Ext.Element.selectorFunction(c,a)}var b=this.elements;Ext.each(c,function(d){b.push(Ext.get(d))});return this},first:function(){return this.item(0)},last:function(){return this.item(this.getCount()-1)},contains:function(a){return this.indexOf(a)!=-1},removeElement:function(d,e){var c=this,a=this.elements,b;Ext.each(d,function(g){if((b=(a[g]||a[g=c.indexOf(g)]))){if(e){if(b.dom){b.remove()}else{Ext.removeNode(b)}}a.splice(g,1)}});return this}});Ext.CompositeElement=Ext.extend(Ext.CompositeElementLite,{constructor:function(b,a){this.elements=[];this.add(b,a)},getElement:function(a){return a},transformElement:function(a){return Ext.get(a)}});Ext.Element.select=function(a,d,b){var c;if(typeof a=="string"){c=Ext.Element.selectorFunction(a,b)}else{if(a.length!==undefined){c=a}else{throw"Invalid selector"}}return(d===true)?new Ext.CompositeElement(c):new Ext.CompositeElementLite(c)};Ext.select=Ext.Element.select;Ext.UpdateManager=Ext.Updater=Ext.extend(Ext.util.Observable,function(){var b="beforeupdate",d="update",c="failure";function a(h){var i=this;i.transaction=null;if(h.argument.form&&h.argument.reset){try{h.argument.form.reset()}catch(j){}}if(i.loadScripts){i.renderer.render(i.el,h,i,g.createDelegate(i,[h]))}else{i.renderer.render(i.el,h,i);g.call(i,h)}}function g(h,i,j){this.fireEvent(i||d,this.el,h);if(Ext.isFunction(h.argument.callback)){h.argument.callback.call(h.argument.scope,this.el,Ext.isEmpty(j)?true:false,h,h.argument.options)}}function e(h){g.call(this,h,c,!!(this.transaction=null))}return{constructor:function(i,h){var j=this;i=Ext.get(i);if(!h&&i.updateManager){return i.updateManager}j.el=i;j.defaultUrl=null;j.addEvents(b,d,c);Ext.apply(j,Ext.Updater.defaults);j.transaction=null;j.refreshDelegate=j.refresh.createDelegate(j);j.updateDelegate=j.update.createDelegate(j);j.formUpdateDelegate=(j.formUpdate||function(){}).createDelegate(j);j.renderer=j.renderer||j.getDefaultRenderer();Ext.Updater.superclass.constructor.call(j)},setRenderer:function(h){this.renderer=h},getRenderer:function(){return this.renderer},getDefaultRenderer:function(){return new Ext.Updater.BasicRenderer()},setDefaultUrl:function(h){this.defaultUrl=h},getEl:function(){return this.el},update:function(i,n,p,l){var k=this,h,j;if(k.fireEvent(b,k.el,i,n)!==false){if(Ext.isObject(i)){h=i;i=h.url;n=n||h.params;p=p||h.callback;l=l||h.discardUrl;j=h.scope;if(!Ext.isEmpty(h.nocache)){k.disableCaching=h.nocache}if(!Ext.isEmpty(h.text)){k.indicatorText='<div class="loading-indicator">'+h.text+"</div>"}if(!Ext.isEmpty(h.scripts)){k.loadScripts=h.scripts}if(!Ext.isEmpty(h.timeout)){k.timeout=h.timeout}}k.showLoading();if(!l){k.defaultUrl=i}if(Ext.isFunction(i)){i=i.call(k)}var m=Ext.apply({},{url:i,params:(Ext.isFunction(n)&&j)?n.createDelegate(j):n,success:a,failure:e,scope:k,callback:undefined,timeout:(k.timeout*1000),disableCaching:k.disableCaching,argument:{options:h,url:i,form:null,callback:p,scope:j||window,params:n}},h);k.transaction=Ext.Ajax.request(m)}},formUpdate:function(k,h,j,l){var i=this;if(i.fireEvent(b,i.el,k,h)!==false){if(Ext.isFunction(h)){h=h.call(i)}k=Ext.getDom(k);i.transaction=Ext.Ajax.request({form:k,url:h,success:a,failure:e,scope:i,timeout:(i.timeout*1000),argument:{url:h,form:k,callback:l,reset:j}});i.showLoading.defer(1,i)}},startAutoRefresh:function(i,j,l,m,h){var k=this;if(h){k.update(j||k.defaultUrl,l,m,true)}if(k.autoRefreshProcId){clearInterval(k.autoRefreshProcId)}k.autoRefreshProcId=setInterval(k.update.createDelegate(k,[j||k.defaultUrl,l,m,true]),i*1000)},stopAutoRefresh:function(){if(this.autoRefreshProcId){clearInterval(this.autoRefreshProcId);delete this.autoRefreshProcId}},isAutoRefreshing:function(){return !!this.autoRefreshProcId},showLoading:function(){if(this.showLoadIndicator){this.el.dom.innerHTML=this.indicatorText}},abort:function(){if(this.transaction){Ext.Ajax.abort(this.transaction)}},isUpdating:function(){return this.transaction?Ext.Ajax.isLoading(this.transaction):false},refresh:function(h){if(this.defaultUrl){this.update(this.defaultUrl,null,h,true)}}}}());Ext.Updater.defaults={timeout:30,disableCaching:false,showLoadIndicator:true,indicatorText:'<div class="loading-indicator">Loading...</div>',loadScripts:false,sslBlankUrl:Ext.SSL_SECURE_URL};Ext.Updater.updateElement=function(d,c,e,b){var a=Ext.get(d).getUpdater();Ext.apply(a,b);a.update(c,e,b?b.callback:null)};Ext.Updater.BasicRenderer=function(){};Ext.Updater.BasicRenderer.prototype={render:function(c,a,b,d){c.update(a.responseText,b.loadScripts,d)}};(function(){Date.useStrict=false;function b(d){var c=Array.prototype.slice.call(arguments,1);return d.replace(/\{(\d+)\}/g,function(e,g){return c[g]})}Date.formatCodeToRegex=function(d,c){var e=Date.parseCodes[d];if(e){e=typeof e=="function"?e():e;Date.parseCodes[d]=e}return e?Ext.applyIf({c:e.c?b(e.c,c||"{0}"):e.c},e):{g:0,c:null,s:Ext.escapeRe(d)}};var a=Date.formatCodeToRegex;Ext.apply(Date,{parseFunctions:{"M$":function(d,c){var e=new RegExp("\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/");var g=(d||"").match(e);return g?new Date(((g[1]||"")+g[2])*1):null}},parseRegexes:[],formatFunctions:{"M$":function(){return"\\/Date("+this.getTime()+")\\/"}},y2kYear:50,MILLI:"ms",SECOND:"s",MINUTE:"mi",HOUR:"h",DAY:"d",MONTH:"mo",YEAR:"y",defaults:{},dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNumbers:{Jan:0,Feb:1,Mar:2,Apr:3,May:4,Jun:5,Jul:6,Aug:7,Sep:8,Oct:9,Nov:10,Dec:11},getShortMonthName:function(c){return Date.monthNames[c].substring(0,3)},getShortDayName:function(c){return Date.dayNames[c].substring(0,3)},getMonthNumber:function(c){return Date.monthNumbers[c.substring(0,1).toUpperCase()+c.substring(1,3).toLowerCase()]},formatContainsHourInfo:(function(){var d=/(\\.)/g,c=/([gGhHisucUOPZ]|M\$)/;return function(e){return c.test(e.replace(d,""))}})(),formatCodes:{d:"String.leftPad(this.getDate(), 2, '0')",D:"Date.getShortDayName(this.getDay())",j:"this.getDate()",l:"Date.dayNames[this.getDay()]",N:"(this.getDay() ? this.getDay() : 7)",S:"this.getSuffix()",w:"this.getDay()",z:"this.getDayOfYear()",W:"String.leftPad(this.getWeekOfYear(), 2, '0')",F:"Date.monthNames[this.getMonth()]",m:"String.leftPad(this.getMonth() + 1, 2, '0')",M:"Date.getShortMonthName(this.getMonth())",n:"(this.getMonth() + 1)",t:"this.getDaysInMonth()",L:"(this.isLeapYear() ? 1 : 0)",o:"(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",Y:"String.leftPad(this.getFullYear(), 4, '0')",y:"('' + this.getFullYear()).substring(2, 4)",a:"(this.getHours() < 12 ? 'am' : 'pm')",A:"(this.getHours() < 12 ? 'AM' : 'PM')",g:"((this.getHours() % 12) ? this.getHours() % 12 : 12)",G:"this.getHours()",h:"String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",H:"String.leftPad(this.getHours(), 2, '0')",i:"String.leftPad(this.getMinutes(), 2, '0')",s:"String.leftPad(this.getSeconds(), 2, '0')",u:"String.leftPad(this.getMilliseconds(), 3, '0')",O:"this.getGMTOffset()",P:"this.getGMTOffset(true)",T:"this.getTimezone()",Z:"(this.getTimezoneOffset() * -60)",c:function(){for(var k="Y-m-dTH:i:sP",h=[],g=0,d=k.length;g<d;++g){var j=k.charAt(g);h.push(j=="T"?"'T'":Date.getFormatCode(j))}return h.join(" + ")},U:"Math.round(this.getTime() / 1000)"},isValid:function(o,c,n,k,g,j,e){k=k||0;g=g||0;j=j||0;e=e||0;var l=new Date(o<100?100:o,c-1,n,k,g,j,e).add(Date.YEAR,o<100?o-100:0);return o==l.getFullYear()&&c==l.getMonth()+1&&n==l.getDate()&&k==l.getHours()&&g==l.getMinutes()&&j==l.getSeconds()&&e==l.getMilliseconds()},parseDate:function(d,g,c){var e=Date.parseFunctions;if(e[g]==null){Date.createParser(g)}return e[g](d,Ext.isDefined(c)?c:Date.useStrict)},getFormatCode:function(d){var c=Date.formatCodes[d];if(c){c=typeof c=="function"?c():c;Date.formatCodes[d]=c}return c||("'"+String.escape(d)+"'")},createFormat:function(h){var g=[],c=false,e="";for(var d=0;d<h.length;++d){e=h.charAt(d);if(!c&&e=="\\"){c=true}else{if(c){c=false;g.push("'"+String.escape(e)+"'")}else{g.push(Date.getFormatCode(e))}}}Date.formatFunctions[h]=new Function("return "+g.join("+"))},createParser:function(){var c=["var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,","def = Date.defaults,","results = String(input).match(Date.parseRegexes[{0}]);","if(results){","{1}","if(u != null){","v = new Date(u * 1000);","}else{","dt = (new Date()).clearTime();","y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));","m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));","d = Ext.num(d, Ext.num(def.d, dt.getDate()));","h  = Ext.num(h, Ext.num(def.h, dt.getHours()));","i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));","s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));","ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));","if(z >= 0 && y >= 0){","v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);","v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);","}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){","v = null;","}else{","v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);","}","}","}","if(v){","if(zz != null){","v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);","}else if(o){","v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));","}","}","return v;"].join("\n");return function(m){var e=Date.parseRegexes.length,o=1,g=[],l=[],k=false,d="",j=0,h,n;for(;j<m.length;++j){d=m.charAt(j);if(!k&&d=="\\"){k=true}else{if(k){k=false;l.push(String.escape(d))}else{h=a(d,o);o+=h.g;l.push(h.s);if(h.g&&h.c){if(h.calcLast){n=h.c}else{g.push(h.c)}}}}}if(n){g.push(n)}Date.parseRegexes[e]=new RegExp("^"+l.join("")+"$","i");Date.parseFunctions[m]=new Function("input","strict",b(c,e,g.join("")))}}(),parseCodes:{d:{g:1,c:"d = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},j:{g:1,c:"d = parseInt(results[{0}], 10);\n",s:"(\\d{1,2})"},D:function(){for(var c=[],d=0;d<7;c.push(Date.getShortDayName(d)),++d){}return{g:0,c:null,s:"(?:"+c.join("|")+")"}},l:function(){return{g:0,c:null,s:"(?:"+Date.dayNames.join("|")+")"}},N:{g:0,c:null,s:"[1-7]"},S:{g:0,c:null,s:"(?:st|nd|rd|th)"},w:{g:0,c:null,s:"[0-6]"},z:{g:1,c:"z = parseInt(results[{0}], 10);\n",s:"(\\d{1,3})"},W:{g:0,c:null,s:"(?:\\d{2})"},F:function(){return{g:1,c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n",s:"("+Date.monthNames.join("|")+")"}},M:function(){for(var c=[],d=0;d<12;c.push(Date.getShortMonthName(d)),++d){}return Ext.applyIf({s:"("+c.join("|")+")"},a("F"))},m:{g:1,c:"m = parseInt(results[{0}], 10) - 1;\n",s:"(\\d{2})"},n:{g:1,c:"m = parseInt(results[{0}], 10) - 1;\n",s:"(\\d{1,2})"},t:{g:0,c:null,s:"(?:\\d{2})"},L:{g:0,c:null,s:"(?:1|0)"},o:function(){return a("Y")},Y:{g:1,c:"y = parseInt(results[{0}], 10);\n",s:"(\\d{4})"},y:{g:1,c:"var ty = parseInt(results[{0}], 10);\ny = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n",s:"(\\d{1,2})"},a:function(){return a("A")},A:{calcLast:true,g:1,c:"if (/(am)/i.test(results[{0}])) {\nif (!h || h == 12) { h = 0; }\n} else { if (!h || h < 12) { h = (h || 0) + 12; }}",s:"(AM|PM|am|pm)"},g:function(){return a("G")},G:{g:1,c:"h = parseInt(results[{0}], 10);\n",s:"(\\d{1,2})"},h:function(){return a("H")},H:{g:1,c:"h = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},i:{g:1,c:"i = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},s:{g:1,c:"s = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},u:{g:1,c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",s:"(\\d+)"},O:{g:1,c:["o = results[{0}];","var sn = o.substring(0,1),","hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),","mn = o.substring(3,5) % 60;","o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n"].join("\n"),s:"([+-]\\d{4})"},P:{g:1,c:["o = results[{0}];","var sn = o.substring(0,1),","hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),","mn = o.substring(4,6) % 60;","o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n"].join("\n"),s:"([+-]\\d{2}:\\d{2})"},T:{g:0,c:null,s:"[A-Z]{1,4}"},Z:{g:1,c:"zz = results[{0}] * 1;\nzz = (-43200 <= zz && zz <= 50400)? zz : null;\n",s:"([+-]?\\d{1,5})"},c:function(){var e=[],c=[a("Y",1),a("m",2),a("d",3),a("h",4),a("i",5),a("s",6),{c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"},{c:["if(results[8]) {","if(results[8] == 'Z'){","zz = 0;","}else if (results[8].indexOf(':') > -1){",a("P",8).c,"}else{",a("O",8).c,"}","}"].join("\n")}];for(var g=0,d=c.length;g<d;++g){e.push(c[g].c)}return{g:1,c:e.join(""),s:[c[0].s,"(?:","-",c[1].s,"(?:","-",c[2].s,"(?:","(?:T| )?",c[3].s,":",c[4].s,"(?::",c[5].s,")?","(?:(?:\\.|,)(\\d+))?","(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?",")?",")?",")?"].join("")}},U:{g:1,c:"u = parseInt(results[{0}], 10);\n",s:"(-?\\d+)"}}})}());Ext.apply(Date.prototype,{dateFormat:function(a){if(Date.formatFunctions[a]==null){Date.createFormat(a)}return Date.formatFunctions[a].call(this)},getTimezone:function(){return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/,"$1$2").replace(/[^A-Z]/g,"")},getGMTOffset:function(a){return(this.getTimezoneOffset()>0?"-":"+")+String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset())/60),2,"0")+(a?":":"")+String.leftPad(Math.abs(this.getTimezoneOffset()%60),2,"0")},getDayOfYear:function(){var b=0,e=this.clone(),a=this.getMonth(),c;for(c=0,e.setDate(1),e.setMonth(0);c<a;e.setMonth(++c)){b+=e.getDaysInMonth()}return b+this.getDate()-1},getWeekOfYear:function(){var a=86400000,b=7*a;return function(){var d=Date.UTC(this.getFullYear(),this.getMonth(),this.getDate()+3)/a,c=Math.floor(d/7),e=new Date(c*b).getUTCFullYear();return c-Math.floor(Date.UTC(e,0,7)/b)+1}}(),isLeapYear:function(){var a=this.getFullYear();return !!((a&3)==0&&(a%100||(a%400==0&&a)))},getFirstDayOfMonth:function(){var a=(this.getDay()-(this.getDate()-1))%7;return(a<0)?(a+7):a},getLastDayOfMonth:function(){return this.getLastDateOfMonth().getDay()},getFirstDateOfMonth:function(){return new Date(this.getFullYear(),this.getMonth(),1)},getLastDateOfMonth:function(){return new Date(this.getFullYear(),this.getMonth(),this.getDaysInMonth())},getDaysInMonth:function(){var a=[31,28,31,30,31,30,31,31,30,31,30,31];return function(){var b=this.getMonth();return b==1&&this.isLeapYear()?29:a[b]}}(),getSuffix:function(){switch(this.getDate()){case 1:case 21:case 31:return"st";case 2:case 22:return"nd";case 3:case 23:return"rd";default:return"th"}},clone:function(){return new Date(this.getTime())},isDST:function(){return new Date(this.getFullYear(),0,1).getTimezoneOffset()!=this.getTimezoneOffset()},clearTime:function(g){if(g){return this.clone().clearTime()}var b=this.getDate();this.setHours(0);this.setMinutes(0);this.setSeconds(0);this.setMilliseconds(0);if(this.getDate()!=b){for(var a=1,e=this.add(Date.HOUR,a);e.getDate()!=b;a++,e=this.add(Date.HOUR,a)){}this.setDate(b);this.setHours(e.getHours())}return this},add:function(b,c){var e=this.clone();if(!b||c===0){return e}switch(b.toLowerCase()){case Date.MILLI:e.setMilliseconds(this.getMilliseconds()+c);break;case Date.SECOND:e.setSeconds(this.getSeconds()+c);break;case Date.MINUTE:e.setMinutes(this.getMinutes()+c);break;case Date.HOUR:e.setHours(this.getHours()+c);break;case Date.DAY:e.setDate(this.getDate()+c);break;case Date.MONTH:var a=this.getDate();if(a>28){a=Math.min(a,this.getFirstDateOfMonth().add("mo",c).getLastDateOfMonth().getDate())}e.setDate(a);e.setMonth(this.getMonth()+c);break;case Date.YEAR:e.setFullYear(this.getFullYear()+c);break}return e},between:function(c,a){var b=this.getTime();return c.getTime()<=b&&b<=a.getTime()}});Date.prototype.format=Date.prototype.dateFormat;if(Ext.isSafari&&(navigator.userAgent.match(/WebKit\/(\d+)/)[1]||NaN)<420){Ext.apply(Date.prototype,{_xMonth:Date.prototype.setMonth,_xDate:Date.prototype.setDate,setMonth:function(a){if(a<=-1){var d=Math.ceil(-a),c=Math.ceil(d/12),b=(d%12)?12-d%12:0;this.setFullYear(this.getFullYear()-c);return this._xMonth(b)}else{return this._xMonth(a)}},setDate:function(a){return this.setTime(this.getTime()-(this.getDate()-a)*86400000)}})}Ext.util.MixedCollection=function(b,a){this.items=[];this.map={};this.keys=[];this.length=0;this.addEvents("clear","add","replace","remove","sort");this.allowFunctions=b===true;if(a){this.getKey=a}Ext.util.MixedCollection.superclass.constructor.call(this)};Ext.extend(Ext.util.MixedCollection,Ext.util.Observable,{allowFunctions:false,add:function(b,c){if(arguments.length==1){c=arguments[0];b=this.getKey(c)}if(typeof b!="undefined"&&b!==null){var a=this.map[b];if(typeof a!="undefined"){return this.replace(b,c)}this.map[b]=c}this.length++;this.items.push(c);this.keys.push(b);this.fireEvent("add",this.length-1,c,b);return c},getKey:function(a){return a.id},replace:function(c,d){if(arguments.length==1){d=arguments[0];c=this.getKey(d)}var a=this.map[c];if(typeof c=="undefined"||c===null||typeof a=="undefined"){return this.add(c,d)}var b=this.indexOfKey(c);this.items[b]=d;this.map[c]=d;this.fireEvent("replace",c,a,d);return d},addAll:function(e){if(arguments.length>1||Ext.isArray(e)){var b=arguments.length>1?arguments:e;for(var d=0,a=b.length;d<a;d++){this.add(b[d])}}else{for(var c in e){if(this.allowFunctions||typeof e[c]!="function"){this.add(c,e[c])}}}},each:function(e,d){var b=[].concat(this.items);for(var c=0,a=b.length;c<a;c++){if(e.call(d||b[c],b[c],c,a)===false){break}}},eachKey:function(d,c){for(var b=0,a=this.keys.length;b<a;b++){d.call(c||window,this.keys[b],this.items[b],b,a)}},find:function(d,c){for(var b=0,a=this.items.length;b<a;b++){if(d.call(c||window,this.items[b],this.keys[b])){return this.items[b]}}return null},insert:function(a,b,c){if(arguments.length==2){c=arguments[1];b=this.getKey(c)}if(this.containsKey(b)){this.suspendEvents();this.removeKey(b);this.resumeEvents()}if(a>=this.length){return this.add(b,c)}this.length++;this.items.splice(a,0,c);if(typeof b!="undefined"&&b!==null){this.map[b]=c}this.keys.splice(a,0,b);this.fireEvent("add",a,c,b);return c},remove:function(a){return this.removeAt(this.indexOf(a))},removeAt:function(a){if(a<this.length&&a>=0){this.length--;var c=this.items[a];this.items.splice(a,1);var b=this.keys[a];if(typeof b!="undefined"){delete this.map[b]}this.keys.splice(a,1);this.fireEvent("remove",c,b);return c}return false},removeKey:function(a){return this.removeAt(this.indexOfKey(a))},getCount:function(){return this.length},indexOf:function(a){return this.items.indexOf(a)},indexOfKey:function(a){return this.keys.indexOf(a)},item:function(b){var a=this.map[b],c=a!==undefined?a:(typeof b=="number")?this.items[b]:undefined;return typeof c!="function"||this.allowFunctions?c:null},itemAt:function(a){return this.items[a]},key:function(a){return this.map[a]},contains:function(a){return this.indexOf(a)!=-1},containsKey:function(a){return typeof this.map[a]!="undefined"},clear:function(){this.length=0;this.items=[];this.keys=[];this.map={};this.fireEvent("clear")},first:function(){return this.items[0]},last:function(){return this.items[this.length-1]},_sort:function(k,a,j){var d,e,b=String(a).toUpperCase()=="DESC"?-1:1,h=[],l=this.keys,g=this.items;j=j||function(i,c){return i-c};for(d=0,e=g.length;d<e;d++){h[h.length]={key:l[d],value:g[d],index:d}}h.sort(function(i,c){var m=j(i[k],c[k])*b;if(m===0){m=(i.index<c.index?-1:1)}return m});for(d=0,e=h.length;d<e;d++){g[d]=h[d].value;l[d]=h[d].key}this.fireEvent("sort",this)},sort:function(a,b){this._sort("value",a,b)},reorder:function(d){this.suspendEvents();var b=this.items,c=0,g=b.length,a=[],e=[],h;for(h in d){a[d[h]]=b[h]}for(c=0;c<g;c++){if(d[c]==undefined){e.push(b[c])}}for(c=0;c<g;c++){if(a[c]==undefined){a[c]=e.shift()}}this.clear();this.addAll(a);this.resumeEvents();this.fireEvent("sort",this)},keySort:function(a,b){this._sort("key",a,b||function(d,c){var g=String(d).toUpperCase(),e=String(c).toUpperCase();return g>e?1:(g<e?-1:0)})},getRange:function(e,a){var b=this.items;if(b.length<1){return[]}e=e||0;a=Math.min(typeof a=="undefined"?this.length-1:a,this.length-1);var c,d=[];if(e<=a){for(c=e;c<=a;c++){d[d.length]=b[c]}}else{for(c=e;c>=a;c--){d[d.length]=b[c]}}return d},filter:function(c,b,d,a){if(Ext.isEmpty(b,false)){return this.clone()}b=this.createValueMatcher(b,d,a);return this.filterBy(function(e){return e&&b.test(e[c])})},filterBy:function(g,e){var h=new Ext.util.MixedCollection();h.getKey=this.getKey;var b=this.keys,d=this.items;for(var c=0,a=d.length;c<a;c++){if(g.call(e||this,d[c],b[c])){h.add(b[c],d[c])}}return h},findIndex:function(c,b,e,d,a){if(Ext.isEmpty(b,false)){return -1}b=this.createValueMatcher(b,d,a);return this.findIndexBy(function(g){return g&&b.test(g[c])},null,e)},findIndexBy:function(g,e,h){var b=this.keys,d=this.items;for(var c=(h||0),a=d.length;c<a;c++){if(g.call(e||this,d[c],b[c])){return c}}return -1},createValueMatcher:function(c,e,a,b){if(!c.exec){var d=Ext.escapeRe;c=String(c);if(e===true){c=d(c)}else{c="^"+d(c);if(b===true){c+="$"}}c=new RegExp(c,a?"":"i")}return c},clone:function(){var e=new Ext.util.MixedCollection();var b=this.keys,d=this.items;for(var c=0,a=d.length;c<a;c++){e.add(b[c],d[c])}e.getKey=this.getKey;return e}});Ext.util.MixedCollection.prototype.get=Ext.util.MixedCollection.prototype.item;Ext.AbstractManager=Ext.extend(Object,{typeName:"type",constructor:function(a){Ext.apply(this,a||{});this.all=new Ext.util.MixedCollection();this.types={}},get:function(a){return this.all.get(a)},register:function(a){this.all.add(a)},unregister:function(a){this.all.remove(a)},registerType:function(b,a){this.types[b]=a;a[this.typeName]=b},isRegistered:function(a){return this.types[a]!==undefined},create:function(a,d){var b=a[this.typeName]||a.type||d,c=this.types[b];if(c==undefined){throw new Error(String.format("The '{0}' type has not been registered with this manager",b))}return new c(a)},onAvailable:function(d,c,b){var a=this.all;a.on("add",function(e,g){if(g.id==d){c.call(b||g,g);a.un("add",c,b)}})}});Ext.util.Format=function(){var trimRe=/^\s+|\s+$/g,stripTagsRE=/<\/?[^>]+>/gi,stripScriptsRe=/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,nl2brRe=/\r?\n/g;return{ellipsis:function(value,len,word){if(value&&value.length>len){if(word){var vs=value.substr(0,len-2),index=Math.max(vs.lastIndexOf(" "),vs.lastIndexOf("."),vs.lastIndexOf("!"),vs.lastIndexOf("?"));if(index==-1||index<(len-15)){return value.substr(0,len-3)+"..."}else{return vs.substr(0,index)+"..."}}else{return value.substr(0,len-3)+"..."}}return value},undef:function(value){return value!==undefined?value:""},defaultValue:function(value,defaultValue){return value!==undefined&&value!==""?value:defaultValue},htmlEncode:function(value){return !value?value:String(value).replace(/&/g,"&amp;").replace(/>/g,"&gt;").replace(/</g,"&lt;").replace(/"/g,"&quot;")},htmlDecode:function(value){return !value?value:String(value).replace(/&gt;/g,">").replace(/&lt;/g,"<").replace(/&quot;/g,'"').replace(/&amp;/g,"&")},trim:function(value){return String(value).replace(trimRe,"")},substr:function(value,start,length){return String(value).substr(start,length)},lowercase:function(value){return String(value).toLowerCase()},uppercase:function(value){return String(value).toUpperCase()},capitalize:function(value){return !value?value:value.charAt(0).toUpperCase()+value.substr(1).toLowerCase()},call:function(value,fn){if(arguments.length>2){var args=Array.prototype.slice.call(arguments,2);args.unshift(value);return eval(fn).apply(window,args)}else{return eval(fn).call(window,value)}},usMoney:function(v){v=(Math.round((v-0)*100))/100;v=(v==Math.floor(v))?v+".00":((v*10==Math.floor(v*10))?v+"0":v);v=String(v);var ps=v.split("."),whole=ps[0],sub=ps[1]?"."+ps[1]:".00",r=/(\d+)(\d{3})/;while(r.test(whole)){whole=whole.replace(r,"$1,$2")}v=whole+sub;if(v.charAt(0)=="-"){return"-$"+v.substr(1)}return"$"+v},date:function(v,format){if(!v){return""}if(!Ext.isDate(v)){v=new Date(Date.parse(v))}return v.dateFormat(format||"m/d/Y")},dateRenderer:function(format){return function(v){return Ext.util.Format.date(v,format)}},stripTags:function(v){return !v?v:String(v).replace(stripTagsRE,"")},stripScripts:function(v){return !v?v:String(v).replace(stripScriptsRe,"")},fileSize:function(size){if(size<1024){return size+" bytes"}else{if(size<1048576){return(Math.round(((size*10)/1024))/10)+" KB"}else{return(Math.round(((size*10)/1048576))/10)+" MB"}}},math:function(){var fns={};return function(v,a){if(!fns[a]){fns[a]=new Function("v","return v "+a+";")}return fns[a](v)}}(),round:function(value,precision){var result=Number(value);if(typeof precision=="number"){precision=Math.pow(10,precision);result=Math.round(value*precision)/precision}return result},number:function(v,format){if(!format){return v}v=Ext.num(v,NaN);if(isNaN(v)){return""}var comma=",",dec=".",i18n=false,neg=v<0;v=Math.abs(v);if(format.substr(format.length-2)=="/i"){format=format.substr(0,format.length-2);i18n=true;comma=".";dec=","}var hasComma=format.indexOf(comma)!=-1,psplit=(i18n?format.replace(/[^\d\,]/g,""):format.replace(/[^\d\.]/g,"")).split(dec);if(1<psplit.length){v=v.toFixed(psplit[1].length)}else{if(2<psplit.length){throw ("NumberFormatException: invalid format, formats should have no more than 1 period: "+format)}else{v=v.toFixed(0)}}var fnum=v.toString();psplit=fnum.split(".");if(hasComma){var cnum=psplit[0],parr=[],j=cnum.length,m=Math.floor(j/3),n=cnum.length%3||3,i;for(i=0;i<j;i+=n){if(i!=0){n=3}parr[parr.length]=cnum.substr(i,n);m-=1}fnum=parr.join(comma);if(psplit[1]){fnum+=dec+psplit[1]}}else{if(psplit[1]){fnum=psplit[0]+dec+psplit[1]}}return(neg?"-":"")+format.replace(/[\d,?\.?]+/,fnum)},numberRenderer:function(format){return function(v){return Ext.util.Format.number(v,format)}},plural:function(v,s,p){return v+" "+(v==1?s:(p?p:s+"s"))},nl2br:function(v){return Ext.isEmpty(v)?"":v.replace(nl2brRe,"<br/>")}}}();Ext.XTemplate=function(){Ext.XTemplate.superclass.constructor.apply(this,arguments);var y=this,j=y.html,q=/<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,d=/^<tpl\b[^>]*?for="(.*?)"/,v=/^<tpl\b[^>]*?if="(.*?)"/,x=/^<tpl\b[^>]*?exec="(.*?)"/,r,p=0,k=[],o="values",w="parent",l="xindex",n="xcount",e="return ",c="with(values){ ";j=["<tpl>",j,"</tpl>"].join("");while((r=j.match(q))){var b=r[0].match(d),a=r[0].match(v),A=r[0].match(x),g=null,h=null,t=null,z=b&&b[1]?b[1]:"";if(a){g=a&&a[1]?a[1]:null;if(g){h=new Function(o,w,l,n,c+e+(Ext.util.Format.htmlDecode(g))+"; }")}}if(A){g=A&&A[1]?A[1]:null;if(g){t=new Function(o,w,l,n,c+(Ext.util.Format.htmlDecode(g))+"; }")}}if(z){switch(z){case".":z=new Function(o,w,c+e+o+"; }");break;case"..":z=new Function(o,w,c+e+w+"; }");break;default:z=new Function(o,w,c+e+z+"; }")}}k.push({id:p,target:z,exec:t,test:h,body:r[1]||""});j=j.replace(r[0],"{xtpl"+p+"}");++p}for(var u=k.length-1;u>=0;--u){y.compileTpl(k[u])}y.master=k[k.length-1];y.tpls=k};Ext.extend(Ext.XTemplate,Ext.Template,{re:/\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,codeRe:/\{\[((?:\\\]|.|\n)*?)\]\}/g,applySubTemplate:function(a,k,j,d,c){var h=this,g,m=h.tpls[a],l,b=[];if((m.test&&!m.test.call(h,k,j,d,c))||(m.exec&&m.exec.call(h,k,j,d,c))){return""}l=m.target?m.target.call(h,k,j):k;g=l.length;j=m.target?k:j;if(m.target&&Ext.isArray(l)){for(var e=0,g=l.length;e<g;e++){b[b.length]=m.compiled.call(h,l[e],j,e+1,g)}return b.join("")}return m.compiled.call(h,l,j,d,c)},compileTpl:function(tpl){var fm=Ext.util.Format,useF=this.disableFormats!==true,sep=Ext.isGecko?"+":",",body;function fn(m,name,format,args,math){if(name.substr(0,4)=="xtpl"){return"'"+sep+"this.applySubTemplate("+name.substr(4)+", values, parent, xindex, xcount)"+sep+"'"}var v;if(name==="."){v="values"}else{if(name==="#"){v="xindex"}else{if(name.indexOf(".")!=-1){v=name}else{v="values['"+name+"']"}}}if(math){v="("+v+math+")"}if(format&&useF){args=args?","+args:"";if(format.substr(0,5)!="this."){format="fm."+format+"("}else{format='this.call("'+format.substr(5)+'", ';args=", values"}}else{args="";format="("+v+" === undefined ? '' : "}return"'"+sep+format+v+args+")"+sep+"'"}function codeFn(m,code){return"'"+sep+"("+code.replace(/\\'/g,"'")+")"+sep+"'"}if(Ext.isGecko){body="tpl.compiled = function(values, parent, xindex, xcount){ return '"+tpl.body.replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn).replace(this.codeRe,codeFn)+"';};"}else{body=["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];body.push(tpl.body.replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn).replace(this.codeRe,codeFn));body.push("'].join('');};");body=body.join("")}eval(body);return this},applyTemplate:function(a){return this.master.compiled.call(this,a,{},1,1)},compile:function(){return this}});Ext.XTemplate.prototype.apply=Ext.XTemplate.prototype.applyTemplate;Ext.XTemplate.from=function(a){a=Ext.getDom(a);return new Ext.XTemplate(a.value||a.innerHTML)};Ext.util.CSS=function(){var d=null;var c=document;var b=/(-[a-z])/gi;var a=function(e,g){return g.charAt(1).toUpperCase()};return{createStyleSheet:function(i,l){var h;var g=c.getElementsByTagName("head")[0];var k=c.createElement("style");k.setAttribute("type","text/css");if(l){k.setAttribute("id",l)}if(Ext.isIE){g.appendChild(k);h=k.styleSheet;h.cssText=i}else{try{k.appendChild(c.createTextNode(i))}catch(j){k.cssText=i}g.appendChild(k);h=k.styleSheet?k.styleSheet:(k.sheet||c.styleSheets[c.styleSheets.length-1])}this.cacheStyleSheet(h);return h},removeStyleSheet:function(g){var e=c.getElementById(g);if(e){e.parentNode.removeChild(e)}},swapStyleSheet:function(h,e){this.removeStyleSheet(h);var g=c.createElement("link");g.setAttribute("rel","stylesheet");g.setAttribute("type","text/css");g.setAttribute("id",h);g.setAttribute("href",e);c.getElementsByTagName("head")[0].appendChild(g)},refreshCache:function(){return this.getRules(true)},cacheStyleSheet:function(h){if(!d){d={}}try{var k=h.cssRules||h.rules;for(var g=k.length-1;g>=0;--g){d[k[g].selectorText.toLowerCase()]=k[g]}}catch(i){}},getRules:function(h){if(d===null||h){d={};var k=c.styleSheets;for(var j=0,g=k.length;j<g;j++){try{this.cacheStyleSheet(k[j])}catch(l){}}}return d},getRule:function(e,h){var g=this.getRules(h);if(!Ext.isArray(e)){return g[e.toLowerCase()]}for(var j=0;j<e.length;j++){if(g[e[j]]){return g[e[j].toLowerCase()]}}return null},updateRule:function(e,j,h){if(!Ext.isArray(e)){var k=this.getRule(e);if(k){k.style[j.replace(b,a)]=h;return true}}else{for(var g=0;g<e.length;g++){if(this.updateRule(e[g],j,h)){return true}}}return false}}}();Ext.util.ClickRepeater=Ext.extend(Ext.util.Observable,{constructor:function(b,a){this.el=Ext.get(b);this.el.unselectable();Ext.apply(this,a);this.addEvents("mousedown","click","mouseup");if(!this.disabled){this.disabled=true;this.enable()}if(this.handler){this.on("click",this.handler,this.scope||this)}Ext.util.ClickRepeater.superclass.constructor.call(this)},interval:20,delay:250,preventDefault:true,stopDefault:false,timer:0,enable:function(){if(this.disabled){this.el.on("mousedown",this.handleMouseDown,this);if(Ext.isIE){this.el.on("dblclick",this.handleDblClick,this)}if(this.preventDefault||this.stopDefault){this.el.on("click",this.eventOptions,this)}}this.disabled=false},disable:function(a){if(a||!this.disabled){clearTimeout(this.timer);if(this.pressClass){this.el.removeClass(this.pressClass)}Ext.getDoc().un("mouseup",this.handleMouseUp,this);this.el.removeAllListeners()}this.disabled=true},setDisabled:function(a){this[a?"disable":"enable"]()},eventOptions:function(a){if(this.preventDefault){a.preventDefault()}if(this.stopDefault){a.stopEvent()}},destroy:function(){this.disable(true);Ext.destroy(this.el);this.purgeListeners()},handleDblClick:function(a){clearTimeout(this.timer);this.el.blur();this.fireEvent("mousedown",this,a);this.fireEvent("click",this,a)},handleMouseDown:function(a){clearTimeout(this.timer);this.el.blur();if(this.pressClass){this.el.addClass(this.pressClass)}this.mousedownTime=new Date();Ext.getDoc().on("mouseup",this.handleMouseUp,this);this.el.on("mouseout",this.handleMouseOut,this);this.fireEvent("mousedown",this,a);this.fireEvent("click",this,a);if(this.accelerate){this.delay=400}this.timer=this.click.defer(this.delay||this.interval,this,[a])},click:function(a){this.fireEvent("click",this,a);this.timer=this.click.defer(this.accelerate?this.easeOutExpo(this.mousedownTime.getElapsed(),400,-390,12000):this.interval,this,[a])},easeOutExpo:function(e,a,h,g){return(e==g)?a+h:h*(-Math.pow(2,-10*e/g)+1)+a},handleMouseOut:function(){clearTimeout(this.timer);if(this.pressClass){this.el.removeClass(this.pressClass)}this.el.on("mouseover",this.handleMouseReturn,this)},handleMouseReturn:function(){this.el.un("mouseover",this.handleMouseReturn,this);if(this.pressClass){this.el.addClass(this.pressClass)}this.click()},handleMouseUp:function(a){clearTimeout(this.timer);this.el.un("mouseover",this.handleMouseReturn,this);this.el.un("mouseout",this.handleMouseOut,this);Ext.getDoc().un("mouseup",this.handleMouseUp,this);this.el.removeClass(this.pressClass);this.fireEvent("mouseup",this,a)}});Ext.KeyNav=function(b,a){this.el=Ext.get(b);Ext.apply(this,a);if(!this.disabled){this.disabled=true;this.enable()}};Ext.KeyNav.prototype={disabled:false,defaultEventAction:"stopEvent",forceKeyDown:false,relay:function(c){var a=c.getKey(),b=this.keyToHandler[a];if(b&&this[b]){if(this.doRelay(c,this[b],b)!==true){c[this.defaultEventAction]()}}},doRelay:function(c,b,a){return b.call(this.scope||this,c,a)},enter:false,left:false,right:false,up:false,down:false,tab:false,esc:false,pageUp:false,pageDown:false,del:false,home:false,end:false,space:false,keyToHandler:{37:"left",39:"right",38:"up",40:"down",33:"pageUp",34:"pageDown",46:"del",36:"home",35:"end",13:"enter",27:"esc",9:"tab",32:"space"},stopKeyUp:function(b){var a=b.getKey();if(a>=37&&a<=40){b.stopEvent()}},destroy:function(){this.disable()},enable:function(){if(this.disabled){if(Ext.isSafari2){this.el.on("keyup",this.stopKeyUp,this)}this.el.on(this.isKeydown()?"keydown":"keypress",this.relay,this);this.disabled=false}},disable:function(){if(!this.disabled){if(Ext.isSafari2){this.el.un("keyup",this.stopKeyUp,this)}this.el.un(this.isKeydown()?"keydown":"keypress",this.relay,this);this.disabled=true}},setDisabled:function(a){this[a?"disable":"enable"]()},isKeydown:function(){return this.forceKeyDown||Ext.EventManager.useKeydown}};Ext.KeyMap=function(c,b,a){this.el=Ext.get(c);this.eventName=a||"keydown";this.bindings=[];if(b){this.addBinding(b)}this.enable()};Ext.KeyMap.prototype={stopEvent:false,addBinding:function(b){if(Ext.isArray(b)){Ext.each(b,function(j){this.addBinding(j)},this);return}var k=b.key,g=b.fn||b.handler,l=b.scope;if(b.stopEvent){this.stopEvent=b.stopEvent}if(typeof k=="string"){var h=[];var e=k.toUpperCase();for(var c=0,d=e.length;c<d;c++){h.push(e.charCodeAt(c))}k=h}var a=Ext.isArray(k);var i=function(o){if(this.checkModifiers(b,o)){var m=o.getKey();if(a){for(var n=0,j=k.length;n<j;n++){if(k[n]==m){if(this.stopEvent){o.stopEvent()}g.call(l||window,m,o);return}}}else{if(m==k){if(this.stopEvent){o.stopEvent()}g.call(l||window,m,o)}}}};this.bindings.push(i)},checkModifiers:function(b,h){var j,d,g=["shift","ctrl","alt"];for(var c=0,a=g.length;c<a;++c){d=g[c];j=b[d];if(!(j===undefined||(j===h[d+"Key"]))){return false}}return true},on:function(b,d,c){var h,a,e,g;if(typeof b=="object"&&!Ext.isArray(b)){h=b.key;a=b.shift;e=b.ctrl;g=b.alt}else{h=b}this.addBinding({key:h,shift:a,ctrl:e,alt:g,fn:d,scope:c})},handleKeyDown:function(g){if(this.enabled){var c=this.bindings;for(var d=0,a=c.length;d<a;d++){c[d].call(this,g)}}},isEnabled:function(){return this.enabled},enable:function(){if(!this.enabled){this.el.on(this.eventName,this.handleKeyDown,this);this.enabled=true}},disable:function(){if(this.enabled){this.el.removeListener(this.eventName,this.handleKeyDown,this);this.enabled=false}},setDisabled:function(a){this[a?"disable":"enable"]()}};Ext.util.TextMetrics=function(){var a;return{measure:function(b,c,d){if(!a){a=Ext.util.TextMetrics.Instance(b,d)}a.bind(b);a.setFixedWidth(d||"auto");return a.getSize(c)},createInstance:function(b,c){return Ext.util.TextMetrics.Instance(b,c)}}}();Ext.util.TextMetrics.Instance=function(b,d){var c=new Ext.Element(document.createElement("div"));document.body.appendChild(c.dom);c.position("absolute");c.setLeftTop(-1000,-1000);c.hide();if(d){c.setWidth(d)}var a={getSize:function(g){c.update(g);var e=c.getSize();c.update("");return e},bind:function(e){c.setStyle(Ext.fly(e).getStyles("font-size","font-style","font-weight","font-family","line-height","text-transform","letter-spacing"))},setFixedWidth:function(e){c.setWidth(e)},getWidth:function(e){c.dom.style.width="auto";return this.getSize(e).width},getHeight:function(e){return this.getSize(e).height}};a.bind(b);return a};Ext.Element.addMethods({getTextWidth:function(c,b,a){return(Ext.util.TextMetrics.measure(this.dom,Ext.value(c,this.dom.innerHTML,true)).width).constrain(b||0,a||1000000)}});Ext.util.Cookies={set:function(c,e){var a=arguments;var i=arguments.length;var b=(i>2)?a[2]:null;var h=(i>3)?a[3]:"/";var d=(i>4)?a[4]:null;var g=(i>5)?a[5]:false;document.cookie=c+"="+escape(e)+((b===null)?"":("; expires="+b.toGMTString()))+((h===null)?"":("; path="+h))+((d===null)?"":("; domain="+d))+((g===true)?"; secure":"")},get:function(d){var b=d+"=";var g=b.length;var a=document.cookie.length;var e=0;var c=0;while(e<a){c=e+g;if(document.cookie.substring(e,c)==b){return Ext.util.Cookies.getCookieVal(c)}e=document.cookie.indexOf(" ",e)+1;if(e===0){break}}return null},clear:function(a){if(Ext.util.Cookies.get(a)){document.cookie=a+"=; expires=Thu, 01-Jan-70 00:00:01 GMT"}},getCookieVal:function(b){var a=document.cookie.indexOf(";",b);if(a==-1){a=document.cookie.length}return unescape(document.cookie.substring(b,a))}};Ext.handleError=function(a){throw a};Ext.Error=function(a){this.message=(this.lang[a])?this.lang[a]:a};Ext.Error.prototype=new Error();Ext.apply(Ext.Error.prototype,{lang:{},name:"Ext.Error",getName:function(){return this.name},getMessage:function(){return this.message},toJson:function(){return Ext.encode(this)}});Ext.ComponentMgr=function(){var c=new Ext.util.MixedCollection();var b={};var a={};return{register:function(d){c.add(d)},unregister:function(d){c.remove(d)},get:function(d){return c.get(d)},onAvailable:function(g,e,d){c.on("add",function(h,i){if(i.id==g){e.call(d||i,i);c.un("add",e,d)}})},all:c,types:b,ptypes:a,isRegistered:function(d){return b[d]!==undefined},isPluginRegistered:function(d){return a[d]!==undefined},registerType:function(e,d){b[e]=d;d.xtype=e},create:function(d,e){return d.render?d:new b[d.xtype||e](d)},registerPlugin:function(e,d){a[e]=d;d.ptype=e},createPlugin:function(e,g){var d=a[e.ptype||g];if(d.init){return d}else{return new d(e)}}}}();Ext.reg=Ext.ComponentMgr.registerType;Ext.preg=Ext.ComponentMgr.registerPlugin;Ext.create=Ext.ComponentMgr.create;Ext.Component=function(b){b=b||{};if(b.initialConfig){if(b.isAction){this.baseAction=b}b=b.initialConfig}else{if(b.tagName||b.dom||Ext.isString(b)){b={applyTo:b,id:b.id||b}}}this.initialConfig=b;Ext.apply(this,b);this.addEvents("added","disable","enable","beforeshow","show","beforehide","hide","removed","beforerender","render","afterrender","beforedestroy","destroy","beforestaterestore","staterestore","beforestatesave","statesave");this.getId();Ext.ComponentMgr.register(this);Ext.Component.superclass.constructor.call(this);if(this.baseAction){this.baseAction.addComponent(this)}this.initComponent();if(this.plugins){if(Ext.isArray(this.plugins)){for(var c=0,a=this.plugins.length;c<a;c++){this.plugins[c]=this.initPlugin(this.plugins[c])}}else{this.plugins=this.initPlugin(this.plugins)}}if(this.stateful!==false){this.initState()}if(this.applyTo){this.applyToMarkup(this.applyTo);delete this.applyTo}else{if(this.renderTo){this.render(this.renderTo);delete this.renderTo}}};Ext.Component.AUTO_ID=1000;Ext.extend(Ext.Component,Ext.util.Observable,{disabled:false,hidden:false,autoEl:"div",disabledClass:"x-item-disabled",allowDomMove:true,autoShow:false,hideMode:"display",hideParent:false,rendered:false,tplWriteMode:"overwrite",bubbleEvents:[],ctype:"Ext.Component",actionMode:"el",getActionEl:function(){return this[this.actionMode]},initPlugin:function(a){if(a.ptype&&!Ext.isFunction(a.init)){a=Ext.ComponentMgr.createPlugin(a)}else{if(Ext.isString(a)){a=Ext.ComponentMgr.createPlugin({ptype:a})}}a.init(this);return a},initComponent:function(){if(this.listeners){this.on(this.listeners);delete this.listeners}this.enableBubble(this.bubbleEvents)},render:function(b,a){if(!this.rendered&&this.fireEvent("beforerender",this)!==false){if(!b&&this.el){this.el=Ext.get(this.el);b=this.el.dom.parentNode;this.allowDomMove=false}this.container=Ext.get(b);if(this.ctCls){this.container.addClass(this.ctCls)}this.rendered=true;if(a!==undefined){if(Ext.isNumber(a)){a=this.container.dom.childNodes[a]}else{a=Ext.getDom(a)}}this.onRender(this.container,a||null);if(this.autoShow){this.el.removeClass(["x-hidden","x-hide-"+this.hideMode])}if(this.cls){this.el.addClass(this.cls);delete this.cls}if(this.style){this.el.applyStyles(this.style);delete this.style}if(this.overCls){this.el.addClassOnOver(this.overCls)}this.fireEvent("render",this);var c=this.getContentTarget();if(this.html){c.update(Ext.DomHelper.markup(this.html));delete this.html}if(this.contentEl){var d=Ext.getDom(this.contentEl);Ext.fly(d).removeClass(["x-hidden","x-hide-display"]);c.appendChild(d)}if(this.tpl){if(!this.tpl.compile){this.tpl=new Ext.XTemplate(this.tpl)}if(this.data){this.tpl[this.tplWriteMode](c,this.data);delete this.data}}this.afterRender(this.container);if(this.hidden){this.doHide()}if(this.disabled){this.disable(true)}if(this.stateful!==false){this.initStateEvents()}this.fireEvent("afterrender",this)}return this},update:function(b,d,a){var c=this.getContentTarget();if(this.tpl&&typeof b!=="string"){this.tpl[this.tplWriteMode](c,b||{})}else{var e=Ext.isObject(b)?Ext.DomHelper.markup(b):b;c.update(e,d,a)}},onAdded:function(a,b){this.ownerCt=a;this.initRef();this.fireEvent("added",this,a,b)},onRemoved:function(){this.removeRef();this.fireEvent("removed",this,this.ownerCt);delete this.ownerCt},initRef:function(){if(this.ref&&!this.refOwner){var d=this.ref.split("/"),c=d.length,b=0,a=this;while(a&&b<c){a=a.ownerCt;++b}if(a){a[this.refName=d[--b]]=this;this.refOwner=a}}},removeRef:function(){if(this.refOwner&&this.refName){delete this.refOwner[this.refName];delete this.refOwner}},initState:function(){if(Ext.state.Manager){var b=this.getStateId();if(b){var a=Ext.state.Manager.get(b);if(a){if(this.fireEvent("beforestaterestore",this,a)!==false){this.applyState(Ext.apply({},a));this.fireEvent("staterestore",this,a)}}}}},getStateId:function(){return this.stateId||((/^(ext-comp-|ext-gen)/).test(String(this.id))?null:this.id)},initStateEvents:function(){if(this.stateEvents){for(var a=0,b;b=this.stateEvents[a];a++){this.on(b,this.saveState,this,{delay:100})}}},applyState:function(a){if(a){Ext.apply(this,a)}},getState:function(){return null},saveState:function(){if(Ext.state.Manager&&this.stateful!==false){var b=this.getStateId();if(b){var a=this.getState();if(this.fireEvent("beforestatesave",this,a)!==false){Ext.state.Manager.set(b,a);this.fireEvent("statesave",this,a)}}}},applyToMarkup:function(a){this.allowDomMove=false;this.el=Ext.get(a);this.render(this.el.dom.parentNode)},addClass:function(a){if(this.el){this.el.addClass(a)}else{this.cls=this.cls?this.cls+" "+a:a}return this},removeClass:function(a){if(this.el){this.el.removeClass(a)}else{if(this.cls){this.cls=this.cls.split(" ").remove(a).join(" ")}}return this},onRender:function(b,a){if(!this.el&&this.autoEl){if(Ext.isString(this.autoEl)){this.el=document.createElement(this.autoEl)}else{var c=document.createElement("div");Ext.DomHelper.overwrite(c,this.autoEl);this.el=c.firstChild}if(!this.el.id){this.el.id=this.getId()}}if(this.el){this.el=Ext.get(this.el);if(this.allowDomMove!==false){b.dom.insertBefore(this.el.dom,a);if(c){Ext.removeNode(c);c=null}}}},getAutoCreate:function(){var a=Ext.isObject(this.autoCreate)?this.autoCreate:Ext.apply({},this.defaultAutoCreate);if(this.id&&!a.id){a.id=this.id}return a},afterRender:Ext.emptyFn,destroy:function(){if(!this.isDestroyed){if(this.fireEvent("beforedestroy",this)!==false){this.destroying=true;this.beforeDestroy();if(this.ownerCt&&this.ownerCt.remove){this.ownerCt.remove(this,false)}if(this.rendered){this.el.remove();if(this.actionMode=="container"||this.removeMode=="container"){this.container.remove()}}if(this.focusTask&&this.focusTask.cancel){this.focusTask.cancel()}this.onDestroy();Ext.ComponentMgr.unregister(this);this.fireEvent("destroy",this);this.purgeListeners();this.destroying=false;this.isDestroyed=true}}},deleteMembers:function(){var b=arguments;for(var c=0,a=b.length;c<a;++c){delete this[b[c]]}},beforeDestroy:Ext.emptyFn,onDestroy:Ext.emptyFn,getEl:function(){return this.el},getContentTarget:function(){return this.el},getId:function(){return this.id||(this.id="ext-comp-"+(++Ext.Component.AUTO_ID))},getItemId:function(){return this.itemId||this.getId()},focus:function(b,a){if(a){this.focusTask=new Ext.util.DelayedTask(this.focus,this,[b,false]);this.focusTask.delay(Ext.isNumber(a)?a:10);return this}if(this.rendered&&!this.isDestroyed){this.el.focus();if(b===true){this.el.dom.select()}}return this},blur:function(){if(this.rendered){this.el.blur()}return this},disable:function(a){if(this.rendered){this.onDisable()}this.disabled=true;if(a!==true){this.fireEvent("disable",this)}return this},onDisable:function(){this.getActionEl().addClass(this.disabledClass);this.el.dom.disabled=true},enable:function(){if(this.rendered){this.onEnable()}this.disabled=false;this.fireEvent("enable",this);return this},onEnable:function(){this.getActionEl().removeClass(this.disabledClass);this.el.dom.disabled=false},setDisabled:function(a){return this[a?"disable":"enable"]()},show:function(){if(this.fireEvent("beforeshow",this)!==false){this.hidden=false;if(this.autoRender){this.render(Ext.isBoolean(this.autoRender)?Ext.getBody():this.autoRender)}if(this.rendered){this.onShow()}this.fireEvent("show",this)}return this},onShow:function(){this.getVisibilityEl().removeClass("x-hide-"+this.hideMode)},hide:function(){if(this.fireEvent("beforehide",this)!==false){this.doHide();this.fireEvent("hide",this)}return this},doHide:function(){this.hidden=true;if(this.rendered){this.onHide()}},onHide:function(){this.getVisibilityEl().addClass("x-hide-"+this.hideMode)},getVisibilityEl:function(){return this.hideParent?this.container:this.getActionEl()},setVisible:function(a){return this[a?"show":"hide"]()},isVisible:function(){return this.rendered&&this.getVisibilityEl().isVisible()},cloneConfig:function(b){b=b||{};var c=b.id||Ext.id();var a=Ext.applyIf(b,this.initialConfig);a.id=c;return new this.constructor(a)},getXType:function(){return this.constructor.xtype},isXType:function(b,a){if(Ext.isFunction(b)){b=b.xtype}else{if(Ext.isObject(b)){b=b.constructor.xtype}}return !a?("/"+this.getXTypes()+"/").indexOf("/"+b+"/")!=-1:this.constructor.xtype==b},getXTypes:function(){var a=this.constructor;if(!a.xtypes){var d=[],b=this;while(b&&b.constructor.xtype){d.unshift(b.constructor.xtype);b=b.constructor.superclass}a.xtypeChain=d;a.xtypes=d.join("/")}return a.xtypes},findParentBy:function(a){for(var b=this.ownerCt;(b!=null)&&!a(b,this);b=b.ownerCt){}return b||null},findParentByType:function(b,a){return this.findParentBy(function(d){return d.isXType(b,a)})},bubble:function(c,b,a){var d=this;while(d){if(c.apply(b||d,a||[d])===false){break}d=d.ownerCt}return this},getPositionEl:function(){return this.positionEl||this.el},purgeListeners:function(){Ext.Component.superclass.purgeListeners.call(this);if(this.mons){this.on("beforedestroy",this.clearMons,this,{single:true})}},clearMons:function(){Ext.each(this.mons,function(a){a.item.un(a.ename,a.fn,a.scope)},this);this.mons=[]},createMons:function(){if(!this.mons){this.mons=[];this.on("beforedestroy",this.clearMons,this,{single:true})}},mon:function(g,b,d,c,a){this.createMons();if(Ext.isObject(b)){var j=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;var i=b;for(var h in i){if(j.test(h)){continue}if(Ext.isFunction(i[h])){this.mons.push({item:g,ename:h,fn:i[h],scope:i.scope});g.on(h,i[h],i.scope,i)}else{this.mons.push({item:g,ename:h,fn:i[h],scope:i.scope});g.on(h,i[h])}}return}this.mons.push({item:g,ename:b,fn:d,scope:c});g.on(b,d,c,a)},mun:function(h,c,g,e){var j,d;this.createMons();for(var b=0,a=this.mons.length;b<a;++b){d=this.mons[b];if(h===d.item&&c==d.ename&&g===d.fn&&e===d.scope){this.mons.splice(b,1);h.un(c,g,e);j=true;break}}return j},nextSibling:function(){if(this.ownerCt){var a=this.ownerCt.items.indexOf(this);if(a!=-1&&a+1<this.ownerCt.items.getCount()){return this.ownerCt.items.itemAt(a+1)}}return null},previousSibling:function(){if(this.ownerCt){var a=this.ownerCt.items.indexOf(this);if(a>0){return this.ownerCt.items.itemAt(a-1)}}return null},getBubbleTarget:function(){return this.ownerCt}});Ext.reg("component",Ext.Component);Ext.Action=Ext.extend(Object,{constructor:function(a){this.initialConfig=a;this.itemId=a.itemId=(a.itemId||a.id||Ext.id());this.items=[]},isAction:true,setText:function(a){this.initialConfig.text=a;this.callEach("setText",[a])},getText:function(){return this.initialConfig.text},setIconClass:function(a){this.initialConfig.iconCls=a;this.callEach("setIconClass",[a])},getIconClass:function(){return this.initialConfig.iconCls},setDisabled:function(a){this.initialConfig.disabled=a;this.callEach("setDisabled",[a])},enable:function(){this.setDisabled(false)},disable:function(){this.setDisabled(true)},isDisabled:function(){return this.initialConfig.disabled},setHidden:function(a){this.initialConfig.hidden=a;this.callEach("setVisible",[!a])},show:function(){this.setHidden(false)},hide:function(){this.setHidden(true)},isHidden:function(){return this.initialConfig.hidden},setHandler:function(b,a){this.initialConfig.handler=b;this.initialConfig.scope=a;this.callEach("setHandler",[b,a])},each:function(b,a){Ext.each(this.items,b,a)},callEach:function(e,b){var d=this.items;for(var c=0,a=d.length;c<a;c++){d[c][e].apply(d[c],b)}},addComponent:function(a){this.items.push(a);a.on("destroy",this.removeComponent,this)},removeComponent:function(a){this.items.remove(a)},execute:function(){this.initialConfig.handler.apply(this.initialConfig.scope||window,arguments)}});(function(){Ext.Layer=function(d,c){d=d||{};var e=Ext.DomHelper,h=d.parentEl,g=h?Ext.getDom(h):document.body;if(c){this.dom=Ext.getDom(c)}if(!this.dom){var i=d.dh||{tag:"div",cls:"x-layer"};this.dom=e.append(g,i)}if(d.cls){this.addClass(d.cls)}this.constrain=d.constrain!==false;this.setVisibilityMode(Ext.Element.VISIBILITY);if(d.id){this.id=this.dom.id=d.id}else{this.id=Ext.id(this.dom)}this.zindex=d.zindex||this.getZIndex();this.position("absolute",this.zindex);if(d.shadow){this.shadowOffset=d.shadowOffset||4;this.shadow=new Ext.Shadow({offset:this.shadowOffset,mode:d.shadow})}else{this.shadowOffset=0}this.useShim=d.shim!==false&&Ext.useShims;this.useDisplay=d.useDisplay;this.hide()};var a=Ext.Element.prototype;var b=[];Ext.extend(Ext.Layer,Ext.Element,{getZIndex:function(){return this.zindex||parseInt((this.getShim()||this).getStyle("z-index"),10)||11000},getShim:function(){if(!this.useShim){return null}if(this.shim){return this.shim}var d=b.shift();if(!d){d=this.createShim();d.enableDisplayMode("block");d.dom.style.display="none";d.dom.style.visibility="visible"}var c=this.dom.parentNode;if(d.dom.parentNode!=c){c.insertBefore(d.dom,this.dom)}d.setStyle("z-index",this.getZIndex()-2);this.shim=d;return d},hideShim:function(){if(this.shim){this.shim.setDisplayed(false);b.push(this.shim);delete this.shim}},disableShadow:function(){if(this.shadow){this.shadowDisabled=true;this.shadow.hide();this.lastShadowOffset=this.shadowOffset;this.shadowOffset=0}},enableShadow:function(c){if(this.shadow){this.shadowDisabled=false;if(Ext.isDefined(this.lastShadowOffset)){this.shadowOffset=this.lastShadowOffset;delete this.lastShadowOffset}if(c){this.sync(true)}}},sync:function(d){var n=this.shadow;if(!this.updating&&this.isVisible()&&(n||this.useShim)){var i=this.getShim(),m=this.getWidth(),j=this.getHeight(),e=this.getLeft(true),o=this.getTop(true);if(n&&!this.shadowDisabled){if(d&&!n.isVisible()){n.show(this)}else{n.realign(e,o,m,j)}if(i){if(d){i.show()}var k=n.el.getXY(),g=i.dom.style,c=n.el.getSize();g.left=(k[0])+"px";g.top=(k[1])+"px";g.width=(c.width)+"px";g.height=(c.height)+"px"}}else{if(i){if(d){i.show()}i.setSize(m,j);i.setLeftTop(e,o)}}}},destroy:function(){this.hideShim();if(this.shadow){this.shadow.hide()}this.removeAllListeners();Ext.removeNode(this.dom);delete this.dom},remove:function(){this.destroy()},beginUpdate:function(){this.updating=true},endUpdate:function(){this.updating=false;this.sync(true)},hideUnders:function(c){if(this.shadow){this.shadow.hide()}this.hideShim()},constrainXY:function(){if(this.constrain){var j=Ext.lib.Dom.getViewWidth(),d=Ext.lib.Dom.getViewHeight();var o=Ext.getDoc().getScroll();var n=this.getXY();var k=n[0],i=n[1];var c=this.shadowOffset;var l=this.dom.offsetWidth+c,e=this.dom.offsetHeight+c;var g=false;if((k+l)>j+o.left){k=j-l-c;g=true}if((i+e)>d+o.top){i=d-e-c;g=true}if(k<o.left){k=o.left;g=true}if(i<o.top){i=o.top;g=true}if(g){if(this.avoidY){var m=this.avoidY;if(i<=m&&(i+e)>=m){i=m-e-5}}n=[k,i];this.storeXY(n);a.setXY.call(this,n);this.sync()}}return this},getConstrainOffset:function(){return this.shadowOffset},isVisible:function(){return this.visible},showAction:function(){this.visible=true;if(this.useDisplay===true){this.setDisplayed("")}else{if(this.lastXY){a.setXY.call(this,this.lastXY)}else{if(this.lastLT){a.setLeftTop.call(this,this.lastLT[0],this.lastLT[1])}}}},hideAction:function(){this.visible=false;if(this.useDisplay===true){this.setDisplayed(false)}else{this.setLeftTop(-10000,-10000)}},setVisible:function(i,h,k,l,j){if(i){this.showAction()}if(h&&i){var g=function(){this.sync(true);if(l){l()}}.createDelegate(this);a.setVisible.call(this,true,true,k,g,j)}else{if(!i){this.hideUnders(true)}var g=l;if(h){g=function(){this.hideAction();if(l){l()}}.createDelegate(this)}a.setVisible.call(this,i,h,k,g,j);if(i){this.sync(true)}else{if(!h){this.hideAction()}}}return this},storeXY:function(c){delete this.lastLT;this.lastXY=c},storeLeftTop:function(d,c){delete this.lastXY;this.lastLT=[d,c]},beforeFx:function(){this.beforeAction();return Ext.Layer.superclass.beforeFx.apply(this,arguments)},afterFx:function(){Ext.Layer.superclass.afterFx.apply(this,arguments);this.sync(this.isVisible())},beforeAction:function(){if(!this.updating&&this.shadow){this.shadow.hide()}},setLeft:function(c){this.storeLeftTop(c,this.getTop(true));a.setLeft.apply(this,arguments);this.sync();return this},setTop:function(c){this.storeLeftTop(this.getLeft(true),c);a.setTop.apply(this,arguments);this.sync();return this},setLeftTop:function(d,c){this.storeLeftTop(d,c);a.setLeftTop.apply(this,arguments);this.sync();return this},setXY:function(j,h,k,l,i){this.fixDisplay();this.beforeAction();this.storeXY(j);var g=this.createCB(l);a.setXY.call(this,j,h,k,g,i);if(!h){g()}return this},createCB:function(e){var d=this;return function(){d.constrainXY();d.sync(true);if(e){e()}}},setX:function(g,h,j,k,i){this.setXY([g,this.getY()],h,j,k,i);return this},setY:function(k,g,i,j,h){this.setXY([this.getX(),k],g,i,j,h);return this},setSize:function(j,k,i,m,n,l){this.beforeAction();var g=this.createCB(n);a.setSize.call(this,j,k,i,m,g,l);if(!i){g()}return this},setWidth:function(i,h,k,l,j){this.beforeAction();var g=this.createCB(l);a.setWidth.call(this,i,h,k,g,j);if(!h){g()}return this},setHeight:function(j,i,l,m,k){this.beforeAction();var g=this.createCB(m);a.setHeight.call(this,j,i,l,g,k);if(!i){g()}return this},setBounds:function(o,m,p,i,n,k,l,j){this.beforeAction();var g=this.createCB(l);if(!n){this.storeXY([o,m]);a.setXY.call(this,[o,m]);a.setSize.call(this,p,i,n,k,g,j);g()}else{a.setBounds.call(this,o,m,p,i,n,k,g,j)}return this},setZIndex:function(c){this.zindex=c;this.setStyle("z-index",c+2);if(this.shadow){this.shadow.setZIndex(c+1)}if(this.shim){this.shim.setStyle("z-index",c)}return this}})})();Ext.Shadow=function(d){Ext.apply(this,d);if(typeof this.mode!="string"){this.mode=this.defaultMode}var e=this.offset,c={h:0},b=Math.floor(this.offset/2);switch(this.mode.toLowerCase()){case"drop":c.w=0;c.l=c.t=e;c.t-=1;if(Ext.isIE){c.l-=this.offset+b;c.t-=this.offset+b;c.w-=b;c.h-=b;c.t+=1}break;case"sides":c.w=(e*2);c.l=-e;c.t=e-1;if(Ext.isIE){c.l-=(this.offset-b);c.t-=this.offset+b;c.l+=1;c.w-=(this.offset-b)*2;c.w-=b+1;c.h-=1}break;case"frame":c.w=c.h=(e*2);c.l=c.t=-e;c.t+=1;c.h-=2;if(Ext.isIE){c.l-=(this.offset-b);c.t-=(this.offset-b);c.l+=1;c.w-=(this.offset+b+1);c.h-=(this.offset+b);c.h+=1}break}this.adjusts=c};Ext.Shadow.prototype={offset:4,defaultMode:"drop",show:function(a){a=Ext.get(a);if(!this.el){this.el=Ext.Shadow.Pool.pull();if(this.el.dom.nextSibling!=a.dom){this.el.insertBefore(a)}}this.el.setStyle("z-index",this.zIndex||parseInt(a.getStyle("z-index"),10)-1);if(Ext.isIE){this.el.dom.style.filter="progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius="+(this.offset)+")"}this.realign(a.getLeft(true),a.getTop(true),a.getWidth(),a.getHeight());this.el.dom.style.display="block"},isVisible:function(){return this.el?true:false},realign:function(b,r,q,g){if(!this.el){return}var n=this.adjusts,k=this.el.dom,u=k.style,i=0,p=(q+n.w),e=(g+n.h),j=p+"px",o=e+"px",m,c;u.left=(b+n.l)+"px";u.top=(r+n.t)+"px";if(u.width!=j||u.height!=o){u.width=j;u.height=o;if(!Ext.isIE){m=k.childNodes;c=Math.max(0,(p-12))+"px";m[0].childNodes[1].style.width=c;m[1].childNodes[1].style.width=c;m[2].childNodes[1].style.width=c;m[1].style.height=Math.max(0,(e-12))+"px"}}},hide:function(){if(this.el){this.el.dom.style.display="none";Ext.Shadow.Pool.push(this.el);delete this.el}},setZIndex:function(a){this.zIndex=a;if(this.el){this.el.setStyle("z-index",a)}}};Ext.Shadow.Pool=function(){var b=[],a=Ext.isIE?'<div class="x-ie-shadow"></div>':'<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';return{pull:function(){var c=b.shift();if(!c){c=Ext.get(Ext.DomHelper.insertHtml("beforeBegin",document.body.firstChild,a));c.autoBoxAdjust=false}return c},push:function(c){b.push(c)}}}();Ext.BoxComponent=Ext.extend(Ext.Component,{initComponent:function(){Ext.BoxComponent.superclass.initComponent.call(this);this.addEvents("resize","move")},boxReady:false,deferHeight:false,setSize:function(b,d){if(typeof b=="object"){d=b.height;b=b.width}if(Ext.isDefined(b)&&Ext.isDefined(this.boxMinWidth)&&(b<this.boxMinWidth)){b=this.boxMinWidth}if(Ext.isDefined(d)&&Ext.isDefined(this.boxMinHeight)&&(d<this.boxMinHeight)){d=this.boxMinHeight}if(Ext.isDefined(b)&&Ext.isDefined(this.boxMaxWidth)&&(b>this.boxMaxWidth)){b=this.boxMaxWidth}if(Ext.isDefined(d)&&Ext.isDefined(this.boxMaxHeight)&&(d>this.boxMaxHeight)){d=this.boxMaxHeight}if(!this.boxReady){this.width=b;this.height=d;return this}if(this.cacheSizes!==false&&this.lastSize&&this.lastSize.width==b&&this.lastSize.height==d){return this}this.lastSize={width:b,height:d};var c=this.adjustSize(b,d),g=c.width,a=c.height,e;if(g!==undefined||a!==undefined){e=this.getResizeEl();if(!this.deferHeight&&g!==undefined&&a!==undefined){e.setSize(g,a)}else{if(!this.deferHeight&&a!==undefined){e.setHeight(a)}else{if(g!==undefined){e.setWidth(g)}}}this.onResize(g,a,b,d);this.fireEvent("resize",this,g,a,b,d)}return this},setWidth:function(a){return this.setSize(a)},setHeight:function(a){return this.setSize(undefined,a)},getSize:function(){return this.getResizeEl().getSize()},getWidth:function(){return this.getResizeEl().getWidth()},getHeight:function(){return this.getResizeEl().getHeight()},getOuterSize:function(){var a=this.getResizeEl();return{width:a.getWidth()+a.getMargins("lr"),height:a.getHeight()+a.getMargins("tb")}},getPosition:function(a){var b=this.getPositionEl();if(a===true){return[b.getLeft(true),b.getTop(true)]}return this.xy||b.getXY()},getBox:function(a){var c=this.getPosition(a);var b=this.getSize();b.x=c[0];b.y=c[1];return b},updateBox:function(a){this.setSize(a.width,a.height);this.setPagePosition(a.x,a.y);return this},getResizeEl:function(){return this.resizeEl||this.el},setAutoScroll:function(a){if(this.rendered){this.getContentTarget().setOverflow(a?"auto":"")}this.autoScroll=a;return this},setPosition:function(a,g){if(a&&typeof a[1]=="number"){g=a[1];a=a[0]}this.x=a;this.y=g;if(!this.boxReady){return this}var b=this.adjustPosition(a,g);var e=b.x,d=b.y;var c=this.getPositionEl();if(e!==undefined||d!==undefined){if(e!==undefined&&d!==undefined){c.setLeftTop(e,d)}else{if(e!==undefined){c.setLeft(e)}else{if(d!==undefined){c.setTop(d)}}}this.onPosition(e,d);this.fireEvent("move",this,e,d)}return this},setPagePosition:function(a,c){if(a&&typeof a[1]=="number"){c=a[1];a=a[0]}this.pageX=a;this.pageY=c;if(!this.boxReady){return}if(a===undefined||c===undefined){return}var b=this.getPositionEl().translatePoints(a,c);this.setPosition(b.left,b.top);return this},afterRender:function(){Ext.BoxComponent.superclass.afterRender.call(this);if(this.resizeEl){this.resizeEl=Ext.get(this.resizeEl)}if(this.positionEl){this.positionEl=Ext.get(this.positionEl)}this.boxReady=true;Ext.isDefined(this.autoScroll)&&this.setAutoScroll(this.autoScroll);this.setSize(this.width,this.height);if(this.x||this.y){this.setPosition(this.x,this.y)}else{if(this.pageX||this.pageY){this.setPagePosition(this.pageX,this.pageY)}}},syncSize:function(){delete this.lastSize;this.setSize(this.autoWidth?undefined:this.getResizeEl().getWidth(),this.autoHeight?undefined:this.getResizeEl().getHeight());return this},onResize:function(d,b,a,c){},onPosition:function(a,b){},adjustSize:function(a,b){if(this.autoWidth){a="auto"}if(this.autoHeight){b="auto"}return{width:a,height:b}},adjustPosition:function(a,b){return{x:a,y:b}}});Ext.reg("box",Ext.BoxComponent);Ext.Spacer=Ext.extend(Ext.BoxComponent,{autoEl:"div"});Ext.reg("spacer",Ext.Spacer);Ext.SplitBar=function(c,e,b,d,a){this.el=Ext.get(c,true);this.el.dom.unselectable="on";this.resizingEl=Ext.get(e,true);this.orientation=b||Ext.SplitBar.HORIZONTAL;this.minSize=0;this.maxSize=2000;this.animate=false;this.useShim=false;this.shim=null;if(!a){this.proxy=Ext.SplitBar.createProxy(this.orientation)}else{this.proxy=Ext.get(a).dom}this.dd=new Ext.dd.DDProxy(this.el.dom.id,"XSplitBars",{dragElId:this.proxy.id});this.dd.b4StartDrag=this.onStartProxyDrag.createDelegate(this);this.dd.endDrag=this.onEndProxyDrag.createDelegate(this);this.dragSpecs={};this.adapter=new Ext.SplitBar.BasicLayoutAdapter();this.adapter.init(this);if(this.orientation==Ext.SplitBar.HORIZONTAL){this.placement=d||(this.el.getX()>this.resizingEl.getX()?Ext.SplitBar.LEFT:Ext.SplitBar.RIGHT);this.el.addClass("x-splitbar-h")}else{this.placement=d||(this.el.getY()>this.resizingEl.getY()?Ext.SplitBar.TOP:Ext.SplitBar.BOTTOM);this.el.addClass("x-splitbar-v")}this.addEvents("resize","moved","beforeresize","beforeapply");Ext.SplitBar.superclass.constructor.call(this)};Ext.extend(Ext.SplitBar,Ext.util.Observable,{onStartProxyDrag:function(a,e){this.fireEvent("beforeresize",this);this.overlay=Ext.DomHelper.append(document.body,{cls:"x-drag-overlay",html:"&#160;"},true);this.overlay.unselectable();this.overlay.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.overlay.show();Ext.get(this.proxy).setDisplayed("block");var c=this.adapter.getElementSize(this);this.activeMinSize=this.getMinimumSize();this.activeMaxSize=this.getMaximumSize();var d=c-this.activeMinSize;var b=Math.max(this.activeMaxSize-c,0);if(this.orientation==Ext.SplitBar.HORIZONTAL){this.dd.resetConstraints();this.dd.setXConstraint(this.placement==Ext.SplitBar.LEFT?d:b,this.placement==Ext.SplitBar.LEFT?b:d,this.tickSize);this.dd.setYConstraint(0,0)}else{this.dd.resetConstraints();this.dd.setXConstraint(0,0);this.dd.setYConstraint(this.placement==Ext.SplitBar.TOP?d:b,this.placement==Ext.SplitBar.TOP?b:d,this.tickSize)}this.dragSpecs.startSize=c;this.dragSpecs.startPoint=[a,e];Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd,a,e)},onEndProxyDrag:function(c){Ext.get(this.proxy).setDisplayed(false);var b=Ext.lib.Event.getXY(c);if(this.overlay){Ext.destroy(this.overlay);delete this.overlay}var a;if(this.orientation==Ext.SplitBar.HORIZONTAL){a=this.dragSpecs.startSize+(this.placement==Ext.SplitBar.LEFT?b[0]-this.dragSpecs.startPoint[0]:this.dragSpecs.startPoint[0]-b[0])}else{a=this.dragSpecs.startSize+(this.placement==Ext.SplitBar.TOP?b[1]-this.dragSpecs.startPoint[1]:this.dragSpecs.startPoint[1]-b[1])}a=Math.min(Math.max(a,this.activeMinSize),this.activeMaxSize);if(a!=this.dragSpecs.startSize){if(this.fireEvent("beforeapply",this,a)!==false){this.adapter.setElementSize(this,a);this.fireEvent("moved",this,a);this.fireEvent("resize",this,a)}}},getAdapter:function(){return this.adapter},setAdapter:function(a){this.adapter=a;this.adapter.init(this)},getMinimumSize:function(){return this.minSize},setMinimumSize:function(a){this.minSize=a},getMaximumSize:function(){return this.maxSize},setMaximumSize:function(a){this.maxSize=a},setCurrentSize:function(b){var a=this.animate;this.animate=false;this.adapter.setElementSize(this,b);this.animate=a},destroy:function(a){Ext.destroy(this.shim,Ext.get(this.proxy));this.dd.unreg();if(a){this.el.remove()}this.purgeListeners()}});Ext.SplitBar.createProxy=function(b){var c=new Ext.Element(document.createElement("div"));document.body.appendChild(c.dom);c.unselectable();var a="x-splitbar-proxy";c.addClass(a+" "+(b==Ext.SplitBar.HORIZONTAL?a+"-h":a+"-v"));return c.dom};Ext.SplitBar.BasicLayoutAdapter=function(){};Ext.SplitBar.BasicLayoutAdapter.prototype={init:function(a){},getElementSize:function(a){if(a.orientation==Ext.SplitBar.HORIZONTAL){return a.resizingEl.getWidth()}else{return a.resizingEl.getHeight()}},setElementSize:function(b,a,c){if(b.orientation==Ext.SplitBar.HORIZONTAL){if(!b.animate){b.resizingEl.setWidth(a);if(c){c(b,a)}}else{b.resizingEl.setWidth(a,true,0.1,c,"easeOut")}}else{if(!b.animate){b.resizingEl.setHeight(a);if(c){c(b,a)}}else{b.resizingEl.setHeight(a,true,0.1,c,"easeOut")}}}};Ext.SplitBar.AbsoluteLayoutAdapter=function(a){this.basic=new Ext.SplitBar.BasicLayoutAdapter();this.container=Ext.get(a)};Ext.SplitBar.AbsoluteLayoutAdapter.prototype={init:function(a){this.basic.init(a)},getElementSize:function(a){return this.basic.getElementSize(a)},setElementSize:function(b,a,c){this.basic.setElementSize(b,a,this.moveSplitter.createDelegate(this,[b]))},moveSplitter:function(a){var b=Ext.SplitBar;switch(a.placement){case b.LEFT:a.el.setX(a.resizingEl.getRight());break;case b.RIGHT:a.el.setStyle("right",(this.container.getWidth()-a.resizingEl.getLeft())+"px");break;case b.TOP:a.el.setY(a.resizingEl.getBottom());break;case b.BOTTOM:a.el.setY(a.resizingEl.getTop()-a.el.getHeight());break}}};Ext.SplitBar.VERTICAL=1;Ext.SplitBar.HORIZONTAL=2;Ext.SplitBar.LEFT=1;Ext.SplitBar.RIGHT=2;Ext.SplitBar.TOP=3;Ext.SplitBar.BOTTOM=4;Ext.Container=Ext.extend(Ext.BoxComponent,{bufferResize:50,autoDestroy:true,forceLayout:false,defaultType:"panel",resizeEvent:"resize",bubbleEvents:["add","remove"],initComponent:function(){Ext.Container.superclass.initComponent.call(this);this.addEvents("afterlayout","beforeadd","beforeremove","add","remove");var a=this.items;if(a){delete this.items;this.add(a)}},initItems:function(){if(!this.items){this.items=new Ext.util.MixedCollection(false,this.getComponentId);this.getLayout()}},setLayout:function(a){if(this.layout&&this.layout!=a){this.layout.setContainer(null)}this.layout=a;this.initItems();a.setContainer(this)},afterRender:function(){Ext.Container.superclass.afterRender.call(this);if(!this.layout){this.layout="auto"}if(Ext.isObject(this.layout)&&!this.layout.layout){this.layoutConfig=this.layout;this.layout=this.layoutConfig.type}if(Ext.isString(this.layout)){this.layout=new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig)}this.setLayout(this.layout);if(this.activeItem!==undefined&&this.layout.setActiveItem){var a=this.activeItem;delete this.activeItem;this.layout.setActiveItem(a)}if(!this.ownerCt){this.doLayout(false,true)}if(this.monitorResize===true){Ext.EventManager.onWindowResize(this.doLayout,this,[false])}},getLayoutTarget:function(){return this.el},getComponentId:function(a){return a.getItemId()},add:function(b){this.initItems();var e=arguments.length>1;if(e||Ext.isArray(b)){var a=[];Ext.each(e?arguments:b,function(h){a.push(this.add(h))},this);return a}var g=this.lookupComponent(this.applyDefaults(b));var d=this.items.length;if(this.fireEvent("beforeadd",this,g,d)!==false&&this.onBeforeAdd(g)!==false){this.items.add(g);g.onAdded(this,d);this.onAdd(g);this.fireEvent("add",this,g,d)}return g},onAdd:function(a){},onAdded:function(a,b){this.ownerCt=a;this.initRef();this.cascade(function(d){d.initRef()});this.fireEvent("added",this,a,b)},insert:function(e,b){var d=arguments,h=d.length,a=[],g,j;this.initItems();if(h>2){for(g=h-1;g>=1;--g){a.push(this.insert(e,d[g]))}return a}j=this.lookupComponent(this.applyDefaults(b));e=Math.min(e,this.items.length);if(this.fireEvent("beforeadd",this,j,e)!==false&&this.onBeforeAdd(j)!==false){if(j.ownerCt==this){this.items.remove(j)}this.items.insert(e,j);j.onAdded(this,e);this.onAdd(j);this.fireEvent("add",this,j,e)}return j},applyDefaults:function(b){var a=this.defaults;if(a){if(Ext.isFunction(a)){a=a.call(this,b)}if(Ext.isString(b)){b=Ext.ComponentMgr.get(b);Ext.apply(b,a)}else{if(!b.events){Ext.applyIf(b.isAction?b.initialConfig:b,a)}else{Ext.apply(b,a)}}}return b},onBeforeAdd:function(a){if(a.ownerCt){a.ownerCt.remove(a,false)}if(this.hideBorders===true){a.border=(a.border===true)}},remove:function(a,b){this.initItems();var d=this.getComponent(a);if(d&&this.fireEvent("beforeremove",this,d)!==false){this.doRemove(d,b);this.fireEvent("remove",this,d)}return d},onRemove:function(a){},doRemove:function(e,d){var b=this.layout,a=b&&this.rendered;if(a){b.onRemove(e)}this.items.remove(e);e.onRemoved();this.onRemove(e);if(d===true||(d!==false&&this.autoDestroy)){e.destroy()}if(a){b.afterRemove(e)}},removeAll:function(c){this.initItems();var e,g=[],b=[];this.items.each(function(h){g.push(h)});for(var d=0,a=g.length;d<a;++d){e=g[d];this.remove(e,c);if(e.ownerCt!==this){b.push(e)}}return b},getComponent:function(a){if(Ext.isObject(a)){a=a.getItemId()}return this.items.get(a)},lookupComponent:function(a){if(Ext.isString(a)){return Ext.ComponentMgr.get(a)}else{if(!a.events){return this.createComponent(a)}}return a},createComponent:function(a,d){if(a.render){return a}var b=Ext.create(Ext.apply({ownerCt:this},a),d||this.defaultType);delete b.initialConfig.ownerCt;delete b.ownerCt;return b},canLayout:function(){var a=this.getVisibilityEl();return a&&a.dom&&!a.isStyle("display","none")},doLayout:function(g,e){var k=this.rendered,j=e||this.forceLayout;if(this.collapsed||!this.canLayout()){this.deferLayout=this.deferLayout||!g;if(!j){return}g=g&&!this.deferLayout}else{delete this.deferLayout}if(k&&this.layout){this.layout.layout()}if(g!==true&&this.items){var d=this.items.items;for(var b=0,a=d.length;b<a;b++){var h=d[b];if(h.doLayout){h.doLayout(false,j)}}}if(k){this.onLayout(g,j)}this.hasLayout=true;delete this.forceLayout},onLayout:Ext.emptyFn,shouldBufferLayout:function(){var a=this.hasLayout;if(this.ownerCt){return a?!this.hasLayoutPending():false}return a},hasLayoutPending:function(){var a=false;this.ownerCt.bubble(function(b){if(b.layoutPending){a=true;return false}});return a},onShow:function(){Ext.Container.superclass.onShow.call(this);if(Ext.isDefined(this.deferLayout)){delete this.deferLayout;this.doLayout(true)}},getLayout:function(){if(!this.layout){var a=new Ext.layout.AutoLayout(this.layoutConfig);this.setLayout(a)}return this.layout},beforeDestroy:function(){var a;if(this.items){while(a=this.items.first()){this.doRemove(a,true)}}if(this.monitorResize){Ext.EventManager.removeResizeListener(this.doLayout,this)}Ext.destroy(this.layout);Ext.Container.superclass.beforeDestroy.call(this)},cascade:function(g,e,b){if(g.apply(e||this,b||[this])!==false){if(this.items){var d=this.items.items;for(var c=0,a=d.length;c<a;c++){if(d[c].cascade){d[c].cascade(g,e,b)}else{g.apply(e||d[c],b||[d[c]])}}}}return this},findById:function(c){var a=null,b=this;this.cascade(function(d){if(b!=d&&d.id===c){a=d;return false}});return a},findByType:function(b,a){return this.findBy(function(d){return d.isXType(b,a)})},find:function(b,a){return this.findBy(function(d){return d[b]===a})},findBy:function(d,c){var a=[],b=this;this.cascade(function(e){if(b!=e&&d.call(c||e,e,b)===true){a.push(e)}});return a},get:function(a){return this.getComponent(a)}});Ext.Container.LAYOUTS={};Ext.reg("container",Ext.Container);Ext.layout.ContainerLayout=Ext.extend(Object,{monitorResize:false,activeItem:null,constructor:function(a){this.id=Ext.id(null,"ext-layout-");Ext.apply(this,a)},type:"container",IEMeasureHack:function(k,g){var a=k.dom.childNodes,b=a.length,n,m=[],l,h,j;for(h=0;h<b;h++){n=a[h];l=Ext.get(n);if(l){m[h]=l.getStyle("display");l.setStyle({display:"none"})}}j=k?k.getViewSize(g):{};for(h=0;h<b;h++){n=a[h];l=Ext.get(n);if(l){l.setStyle({display:m[h]})}}return j},getLayoutTargetSize:Ext.EmptyFn,layout:function(){var a=this.container,b=a.getLayoutTarget();if(!(this.hasLayout||Ext.isEmpty(this.targetCls))){b.addClass(this.targetCls)}this.onLayout(a,b);a.fireEvent("afterlayout",a,this)},onLayout:function(a,b){this.renderAll(a,b)},isValidParent:function(b,a){return a&&b.getPositionEl().dom.parentNode==(a.dom||a)},renderAll:function(e,g){var b=e.items.items,d,h,a=b.length;for(d=0;d<a;d++){h=b[d];if(h&&(!h.rendered||!this.isValidParent(h,g))){this.renderItem(h,d,g)}}},renderItem:function(d,a,b){if(d){if(!d.rendered){d.render(b,a);this.configureItem(d)}else{if(!this.isValidParent(d,b)){if(Ext.isNumber(a)){a=b.dom.childNodes[a]}b.dom.insertBefore(d.getPositionEl().dom,a||null);d.container=b;this.configureItem(d)}}}},getRenderedItems:function(g){var e=g.getLayoutTarget(),h=g.items.items,a=h.length,d,j,b=[];for(d=0;d<a;d++){if((j=h[d]).rendered&&this.isValidParent(j,e)&&j.shouldLayout!==false){b.push(j)}}return b},configureItem:function(b){if(this.extraCls){var a=b.getPositionEl?b.getPositionEl():b;a.addClass(this.extraCls)}if(b.doLayout&&this.forceLayout){b.doLayout()}if(this.renderHidden&&b!=this.activeItem){b.hide()}},onRemove:function(b){if(this.activeItem==b){delete this.activeItem}if(b.rendered&&this.extraCls){var a=b.getPositionEl?b.getPositionEl():b;a.removeClass(this.extraCls)}},afterRemove:function(a){if(a.removeRestore){a.removeMode="container";delete a.removeRestore}},onResize:function(){var c=this.container,a;if(c.collapsed){return}if(a=c.bufferResize&&c.shouldBufferLayout()){if(!this.resizeTask){this.resizeTask=new Ext.util.DelayedTask(this.runLayout,this);this.resizeBuffer=Ext.isNumber(a)?a:50}c.layoutPending=true;this.resizeTask.delay(this.resizeBuffer)}else{this.runLayout()}},runLayout:function(){var a=this.container;this.layout();a.onLayout();delete a.layoutPending},setContainer:function(b){if(this.monitorResize&&b!=this.container){var a=this.container;if(a){a.un(a.resizeEvent,this.onResize,this)}if(b){b.on(b.resizeEvent,this.onResize,this)}}this.container=b},parseMargins:function(b){if(Ext.isNumber(b)){b=b.toString()}var c=b.split(" "),a=c.length;if(a==1){c[1]=c[2]=c[3]=c[0]}else{if(a==2){c[2]=c[0];c[3]=c[1]}else{if(a==3){c[3]=c[1]}}}return{top:parseInt(c[0],10)||0,right:parseInt(c[1],10)||0,bottom:parseInt(c[2],10)||0,left:parseInt(c[3],10)||0}},fieldTpl:(function(){var a=new Ext.Template('<div class="x-form-item {itemCls}" tabIndex="-1">','<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>','<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">','</div><div class="{clearCls}"></div>',"</div>");a.disableFormats=true;return a.compile()})(),destroy:function(){if(this.resizeTask&&this.resizeTask.cancel){this.resizeTask.cancel()}if(this.container){this.container.un(this.container.resizeEvent,this.onResize,this)}if(!Ext.isEmpty(this.targetCls)){var a=this.container.getLayoutTarget();if(a){a.removeClass(this.targetCls)}}}});Ext.layout.AutoLayout=Ext.extend(Ext.layout.ContainerLayout,{type:"auto",monitorResize:true,onLayout:function(d,g){Ext.layout.AutoLayout.superclass.onLayout.call(this,d,g);var e=this.getRenderedItems(d),a=e.length,b,h;for(b=0;b<a;b++){h=e[b];if(h.doLayout){h.doLayout(true)}}}});Ext.Container.LAYOUTS.auto=Ext.layout.AutoLayout;Ext.layout.FitLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"fit",getLayoutTargetSize:function(){var a=this.container.getLayoutTarget();if(!a){return{}}return a.getStyleSize()},onLayout:function(a,b){Ext.layout.FitLayout.superclass.onLayout.call(this,a,b);if(!a.collapsed){this.setItemSize(this.activeItem||a.items.itemAt(0),this.getLayoutTargetSize())}},setItemSize:function(b,a){if(b&&a.height>0){b.setSize(a)}}});Ext.Container.LAYOUTS.fit=Ext.layout.FitLayout;Ext.layout.CardLayout=Ext.extend(Ext.layout.FitLayout,{deferredRender:false,layoutOnCardChange:false,renderHidden:true,type:"card",setActiveItem:function(d){var a=this.activeItem,b=this.container;d=b.getComponent(d);if(d&&a!=d){if(a){a.hide();if(a.hidden!==true){return false}a.fireEvent("deactivate",a)}var c=d.doLayout&&(this.layoutOnCardChange||!d.rendered);this.activeItem=d;delete d.deferLayout;d.show();this.layout();if(c){d.doLayout()}d.fireEvent("activate",d)}},renderAll:function(a,b){if(this.deferredRender){this.renderItem(this.activeItem,undefined,b)}else{Ext.layout.CardLayout.superclass.renderAll.call(this,a,b)}}});Ext.Container.LAYOUTS.card=Ext.layout.CardLayout;Ext.layout.AnchorLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"anchor",defaultAnchor:"100%",parseAnchorRE:/^(r|right|b|bottom)$/i,getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a={};if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},onLayout:function(m,w){Ext.layout.AnchorLayout.superclass.onLayout.call(this,m,w);var p=this.getLayoutTargetSize(),k=p.width,o=p.height,q=w.getStyle("overflow"),n=this.getRenderedItems(m),t=n.length,g=[],j,a,v,l,h,c,e,d,u=0,s,b;if(k<20&&o<20){return}if(m.anchorSize){if(typeof m.anchorSize=="number"){a=m.anchorSize}else{a=m.anchorSize.width;v=m.anchorSize.height}}else{a=m.initialConfig.width;v=m.initialConfig.height}for(s=0;s<t;s++){l=n[s];b=l.getPositionEl();if(!l.anchor&&l.items&&!Ext.isNumber(l.width)&&!(Ext.isIE6&&Ext.isStrict)){l.anchor=this.defaultAnchor}if(l.anchor){h=l.anchorSpec;if(!h){d=l.anchor.split(" ");l.anchorSpec=h={right:this.parseAnchor(d[0],l.initialConfig.width,a),bottom:this.parseAnchor(d[1],l.initialConfig.height,v)}}c=h.right?this.adjustWidthAnchor(h.right(k)-b.getMargins("lr"),l):undefined;e=h.bottom?this.adjustHeightAnchor(h.bottom(o)-b.getMargins("tb"),l):undefined;if(c||e){g.push({component:l,width:c||undefined,height:e||undefined})}}}for(s=0,t=g.length;s<t;s++){j=g[s];j.component.setSize(j.width,j.height)}if(q&&q!="hidden"&&!this.adjustmentPass){var r=this.getLayoutTargetSize();if(r.width!=p.width||r.height!=p.height){this.adjustmentPass=true;this.onLayout(m,w)}}delete this.adjustmentPass},parseAnchor:function(c,h,b){if(c&&c!="none"){var e;if(this.parseAnchorRE.test(c)){var g=b-h;return function(a){if(a!==e){e=a;return a-g}}}else{if(c.indexOf("%")!=-1){var d=parseFloat(c.replace("%",""))*0.01;return function(a){if(a!==e){e=a;return Math.floor(a*d)}}}else{c=parseInt(c,10);if(!isNaN(c)){return function(a){if(a!==e){e=a;return a+c}}}}}}return false},adjustWidthAnchor:function(b,a){return b},adjustHeightAnchor:function(b,a){return b}});Ext.Container.LAYOUTS.anchor=Ext.layout.AnchorLayout;Ext.layout.ColumnLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"column",extraCls:"x-column",scrollOffset:0,targetCls:"x-column-layout-ct",isValidParent:function(b,a){return this.innerCt&&b.getPositionEl().dom.parentNode==this.innerCt.dom},getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a;if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},renderAll:function(a,b){if(!this.innerCt){this.innerCt=b.createChild({cls:"x-column-inner"});this.innerCt.createChild({cls:"x-clear"})}Ext.layout.ColumnLayout.superclass.renderAll.call(this,a,this.innerCt)},onLayout:function(e,k){var g=e.items.items,j=g.length,n,b,a,o=[];this.renderAll(e,k);var r=this.getLayoutTargetSize();if(r.width<1&&r.height<1){return}var p=r.width-this.scrollOffset,d=r.height,q=p;this.innerCt.setWidth(p);for(b=0;b<j;b++){n=g[b];a=n.getPositionEl().getMargins("lr");o[b]=a;if(!n.columnWidth){q-=(n.getWidth()+a)}}q=q<0?0:q;for(b=0;b<j;b++){n=g[b];a=o[b];if(n.columnWidth){n.setSize(Math.floor(n.columnWidth*q)-a)}}if(Ext.isIE){if(b=k.getStyle("overflow")&&b!="hidden"&&!this.adjustmentPass){var l=this.getLayoutTargetSize();if(l.width!=r.width){this.adjustmentPass=true;this.onLayout(e,k)}}}delete this.adjustmentPass}});Ext.Container.LAYOUTS.column=Ext.layout.ColumnLayout;Ext.layout.BorderLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,rendered:false,type:"border",targetCls:"x-border-layout-ct",getLayoutTargetSize:function(){var a=this.container.getLayoutTarget();return a?a.getViewSize():{}},onLayout:function(g,I){var j,B,F,o,x=g.items.items,C=x.length;if(!this.rendered){j=[];for(B=0;B<C;B++){F=x[B];o=F.region;if(F.collapsed){j.push(F)}F.collapsed=false;if(!F.rendered){F.render(I,B);F.getPositionEl().addClass("x-border-panel")}this[o]=o!="center"&&F.split?new Ext.layout.BorderLayout.SplitRegion(this,F.initialConfig,o):new Ext.layout.BorderLayout.Region(this,F.initialConfig,o);this[o].render(I,F)}this.rendered=true}var v=this.getLayoutTargetSize();if(v.width<20||v.height<20){if(j){this.restoreCollapsed=j}return}else{if(this.restoreCollapsed){j=this.restoreCollapsed;delete this.restoreCollapsed}}var t=v.width,D=v.height,r=t,A=D,p=0,q=0,y=this.north,u=this.south,l=this.west,E=this.east,F=this.center,H,z,d,G;if(!F&&Ext.layout.BorderLayout.WARN!==false){throw"No center region defined in BorderLayout "+g.id}if(y&&y.isVisible()){H=y.getSize();z=y.getMargins();H.width=t-(z.left+z.right);H.x=z.left;H.y=z.top;p=H.height+H.y+z.bottom;A-=p;y.applyLayout(H)}if(u&&u.isVisible()){H=u.getSize();z=u.getMargins();H.width=t-(z.left+z.right);H.x=z.left;G=(H.height+z.top+z.bottom);H.y=D-G+z.top;A-=G;u.applyLayout(H)}if(l&&l.isVisible()){H=l.getSize();z=l.getMargins();H.height=A-(z.top+z.bottom);H.x=z.left;H.y=p+z.top;d=(H.width+z.left+z.right);q+=d;r-=d;l.applyLayout(H)}if(E&&E.isVisible()){H=E.getSize();z=E.getMargins();H.height=A-(z.top+z.bottom);d=(H.width+z.left+z.right);H.x=t-d+z.left;H.y=p+z.top;r-=d;E.applyLayout(H)}if(F){z=F.getMargins();var k={x:q+z.left,y:p+z.top,width:r-(z.left+z.right),height:A-(z.top+z.bottom)};F.applyLayout(k)}if(j){for(B=0,C=j.length;B<C;B++){j[B].collapse(false)}}if(Ext.isIE&&Ext.isStrict){I.repaint()}if(B=I.getStyle("overflow")&&B!="hidden"&&!this.adjustmentPass){var a=this.getLayoutTargetSize();if(a.width!=v.width||a.height!=v.height){this.adjustmentPass=true;this.onLayout(g,I)}}delete this.adjustmentPass},destroy:function(){var b=["north","south","east","west"],a,c;for(a=0;a<b.length;a++){c=this[b[a]];if(c){if(c.destroy){c.destroy()}else{if(c.split){c.split.destroy(true)}}}}Ext.layout.BorderLayout.superclass.destroy.call(this)}});Ext.layout.BorderLayout.Region=function(b,a,c){Ext.apply(this,a);this.layout=b;this.position=c;this.state={};if(typeof this.margins=="string"){this.margins=this.layout.parseMargins(this.margins)}this.margins=Ext.applyIf(this.margins||{},this.defaultMargins);if(this.collapsible){if(typeof this.cmargins=="string"){this.cmargins=this.layout.parseMargins(this.cmargins)}if(this.collapseMode=="mini"&&!this.cmargins){this.cmargins={left:0,top:0,right:0,bottom:0}}else{this.cmargins=Ext.applyIf(this.cmargins||{},c=="north"||c=="south"?this.defaultNSCMargins:this.defaultEWCMargins)}}};Ext.layout.BorderLayout.Region.prototype={collapsible:false,split:false,floatable:true,minWidth:50,minHeight:50,defaultMargins:{left:0,top:0,right:0,bottom:0},defaultNSCMargins:{left:5,top:5,right:5,bottom:5},defaultEWCMargins:{left:5,top:0,right:5,bottom:0},floatingZIndex:100,isCollapsed:false,render:function(b,c){this.panel=c;c.el.enableDisplayMode();this.targetEl=b;this.el=c.el;var a=c.getState,d=this.position;c.getState=function(){return Ext.apply(a.call(c)||{},this.state)}.createDelegate(this);if(d!="center"){c.allowQueuedExpand=false;c.on({beforecollapse:this.beforeCollapse,collapse:this.onCollapse,beforeexpand:this.beforeExpand,expand:this.onExpand,hide:this.onHide,show:this.onShow,scope:this});if(this.collapsible||this.floatable){c.collapseEl="el";c.slideAnchor=this.getSlideAnchor()}if(c.tools&&c.tools.toggle){c.tools.toggle.addClass("x-tool-collapse-"+d);c.tools.toggle.addClassOnOver("x-tool-collapse-"+d+"-over")}}},getCollapsedEl:function(){if(!this.collapsedEl){if(!this.toolTemplate){var b=new Ext.Template('<div class="x-tool x-tool-{id}">&#160;</div>');b.disableFormats=true;b.compile();Ext.layout.BorderLayout.Region.prototype.toolTemplate=b}this.collapsedEl=this.targetEl.createChild({cls:"x-layout-collapsed x-layout-collapsed-"+this.position,id:this.panel.id+"-xcollapsed"});this.collapsedEl.enableDisplayMode("block");if(this.collapseMode=="mini"){this.collapsedEl.addClass("x-layout-cmini-"+this.position);this.miniCollapsedEl=this.collapsedEl.createChild({cls:"x-layout-mini x-layout-mini-"+this.position,html:"&#160;"});this.miniCollapsedEl.addClassOnOver("x-layout-mini-over");this.collapsedEl.addClassOnOver("x-layout-collapsed-over");this.collapsedEl.on("click",this.onExpandClick,this,{stopEvent:true})}else{if(this.collapsible!==false&&!this.hideCollapseTool){var a=this.expandToolEl=this.toolTemplate.append(this.collapsedEl.dom,{id:"expand-"+this.position},true);a.addClassOnOver("x-tool-expand-"+this.position+"-over");a.on("click",this.onExpandClick,this,{stopEvent:true})}if(this.floatable!==false||this.titleCollapse){this.collapsedEl.addClassOnOver("x-layout-collapsed-over");this.collapsedEl.on("click",this[this.floatable?"collapseClick":"onExpandClick"],this)}}}return this.collapsedEl},onExpandClick:function(a){if(this.isSlid){this.panel.expand(false)}else{this.panel.expand()}},onCollapseClick:function(a){this.panel.collapse()},beforeCollapse:function(c,a){this.lastAnim=a;if(this.splitEl){this.splitEl.hide()}this.getCollapsedEl().show();var b=this.panel.getEl();this.originalZIndex=b.getStyle("z-index");b.setStyle("z-index",100);this.isCollapsed=true;this.layout.layout()},onCollapse:function(a){this.panel.el.setStyle("z-index",1);if(this.lastAnim===false||this.panel.animCollapse===false){this.getCollapsedEl().dom.style.visibility="visible"}else{this.getCollapsedEl().slideIn(this.panel.slideAnchor,{duration:0.2})}this.state.collapsed=true;this.panel.saveState()},beforeExpand:function(a){if(this.isSlid){this.afterSlideIn()}var b=this.getCollapsedEl();this.el.show();if(this.position=="east"||this.position=="west"){this.panel.setSize(undefined,b.getHeight())}else{this.panel.setSize(b.getWidth(),undefined)}b.hide();b.dom.style.visibility="hidden";this.panel.el.setStyle("z-index",this.floatingZIndex)},onExpand:function(){this.isCollapsed=false;if(this.splitEl){this.splitEl.show()}this.layout.layout();this.panel.el.setStyle("z-index",this.originalZIndex);this.state.collapsed=false;this.panel.saveState()},collapseClick:function(a){if(this.isSlid){a.stopPropagation();this.slideIn()}else{a.stopPropagation();this.slideOut()}},onHide:function(){if(this.isCollapsed){this.getCollapsedEl().hide()}else{if(this.splitEl){this.splitEl.hide()}}},onShow:function(){if(this.isCollapsed){this.getCollapsedEl().show()}else{if(this.splitEl){this.splitEl.show()}}},isVisible:function(){return !this.panel.hidden},getMargins:function(){return this.isCollapsed&&this.cmargins?this.cmargins:this.margins},getSize:function(){return this.isCollapsed?this.getCollapsedEl().getSize():this.panel.getSize()},setPanel:function(a){this.panel=a},getMinWidth:function(){return this.minWidth},getMinHeight:function(){return this.minHeight},applyLayoutCollapsed:function(a){var b=this.getCollapsedEl();b.setLeftTop(a.x,a.y);b.setSize(a.width,a.height)},applyLayout:function(a){if(this.isCollapsed){this.applyLayoutCollapsed(a)}else{this.panel.setPosition(a.x,a.y);this.panel.setSize(a.width,a.height)}},beforeSlide:function(){this.panel.beforeEffect()},afterSlide:function(){this.panel.afterEffect()},initAutoHide:function(){if(this.autoHide!==false){if(!this.autoHideHd){this.autoHideSlideTask=new Ext.util.DelayedTask(this.slideIn,this);this.autoHideHd={mouseout:function(a){if(!a.within(this.el,true)){this.autoHideSlideTask.delay(500)}},mouseover:function(a){this.autoHideSlideTask.cancel()},scope:this}}this.el.on(this.autoHideHd);this.collapsedEl.on(this.autoHideHd)}},clearAutoHide:function(){if(this.autoHide!==false){this.el.un("mouseout",this.autoHideHd.mouseout);this.el.un("mouseover",this.autoHideHd.mouseover);this.collapsedEl.un("mouseout",this.autoHideHd.mouseout);this.collapsedEl.un("mouseover",this.autoHideHd.mouseover)}},clearMonitor:function(){Ext.getDoc().un("click",this.slideInIf,this)},slideOut:function(){if(this.isSlid||this.el.hasActiveFx()){return}this.isSlid=true;var b=this.panel.tools,c,a;if(b&&b.toggle){b.toggle.hide()}this.el.show();a=this.panel.collapsed;this.panel.collapsed=false;if(this.position=="east"||this.position=="west"){c=this.panel.deferHeight;this.panel.deferHeight=false;this.panel.setSize(undefined,this.collapsedEl.getHeight());this.panel.deferHeight=c}else{this.panel.setSize(this.collapsedEl.getWidth(),undefined)}this.panel.collapsed=a;this.restoreLT=[this.el.dom.style.left,this.el.dom.style.top];this.el.alignTo(this.collapsedEl,this.getCollapseAnchor());this.el.setStyle("z-index",this.floatingZIndex+2);this.panel.el.replaceClass("x-panel-collapsed","x-panel-floating");if(this.animFloat!==false){this.beforeSlide();this.el.slideIn(this.getSlideAnchor(),{callback:function(){this.afterSlide();this.initAutoHide();Ext.getDoc().on("click",this.slideInIf,this)},scope:this,block:true})}else{this.initAutoHide();Ext.getDoc().on("click",this.slideInIf,this)}},afterSlideIn:function(){this.clearAutoHide();this.isSlid=false;this.clearMonitor();this.el.setStyle("z-index","");this.panel.el.replaceClass("x-panel-floating","x-panel-collapsed");this.el.dom.style.left=this.restoreLT[0];this.el.dom.style.top=this.restoreLT[1];var a=this.panel.tools;if(a&&a.toggle){a.toggle.show()}},slideIn:function(a){if(!this.isSlid||this.el.hasActiveFx()){Ext.callback(a);return}this.isSlid=false;if(this.animFloat!==false){this.beforeSlide();this.el.slideOut(this.getSlideAnchor(),{callback:function(){this.el.hide();this.afterSlide();this.afterSlideIn();Ext.callback(a)},scope:this,block:true})}else{this.el.hide();this.afterSlideIn()}},slideInIf:function(a){if(!a.within(this.el)){this.slideIn()}},anchors:{west:"left",east:"right",north:"top",south:"bottom"},sanchors:{west:"l",east:"r",north:"t",south:"b"},canchors:{west:"tl-tr",east:"tr-tl",north:"tl-bl",south:"bl-tl"},getAnchor:function(){return this.anchors[this.position]},getCollapseAnchor:function(){return this.canchors[this.position]},getSlideAnchor:function(){return this.sanchors[this.position]},getAlignAdj:function(){var a=this.cmargins;switch(this.position){case"west":return[0,0];break;case"east":return[0,0];break;case"north":return[0,0];break;case"south":return[0,0];break}},getExpandAdj:function(){var b=this.collapsedEl,a=this.cmargins;switch(this.position){case"west":return[-(a.right+b.getWidth()+a.left),0];break;case"east":return[a.right+b.getWidth()+a.left,0];break;case"north":return[0,-(a.top+a.bottom+b.getHeight())];break;case"south":return[0,a.top+a.bottom+b.getHeight()];break}},destroy:function(){if(this.autoHideSlideTask&&this.autoHideSlideTask.cancel){this.autoHideSlideTask.cancel()}Ext.destroyMembers(this,"miniCollapsedEl","collapsedEl","expandToolEl")}};Ext.layout.BorderLayout.SplitRegion=function(b,a,c){Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this,b,a,c);this.applyLayout=this.applyFns[c]};Ext.extend(Ext.layout.BorderLayout.SplitRegion,Ext.layout.BorderLayout.Region,{splitTip:"Drag to resize.",collapsibleSplitTip:"Drag to resize. Double click to hide.",useSplitTips:false,splitSettings:{north:{orientation:Ext.SplitBar.VERTICAL,placement:Ext.SplitBar.TOP,maxFn:"getVMaxSize",minProp:"minHeight",maxProp:"maxHeight"},south:{orientation:Ext.SplitBar.VERTICAL,placement:Ext.SplitBar.BOTTOM,maxFn:"getVMaxSize",minProp:"minHeight",maxProp:"maxHeight"},east:{orientation:Ext.SplitBar.HORIZONTAL,placement:Ext.SplitBar.RIGHT,maxFn:"getHMaxSize",minProp:"minWidth",maxProp:"maxWidth"},west:{orientation:Ext.SplitBar.HORIZONTAL,placement:Ext.SplitBar.LEFT,maxFn:"getHMaxSize",minProp:"minWidth",maxProp:"maxWidth"}},applyFns:{west:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;this.panel.setPosition(c.x,c.y);var a=d.offsetWidth;b.left=(c.x+c.width-a)+"px";b.top=(c.y)+"px";b.height=Math.max(0,c.height)+"px";this.panel.setSize(c.width-a,c.height)},east:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetWidth;this.panel.setPosition(c.x+a,c.y);b.left=(c.x)+"px";b.top=(c.y)+"px";b.height=Math.max(0,c.height)+"px";this.panel.setSize(c.width-a,c.height)},north:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetHeight;this.panel.setPosition(c.x,c.y);b.left=(c.x)+"px";b.top=(c.y+c.height-a)+"px";b.width=Math.max(0,c.width)+"px";this.panel.setSize(c.width,c.height-a)},south:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetHeight;this.panel.setPosition(c.x,c.y+a);b.left=(c.x)+"px";b.top=(c.y)+"px";b.width=Math.max(0,c.width)+"px";this.panel.setSize(c.width,c.height-a)}},render:function(a,c){Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this,a,c);var d=this.position;this.splitEl=a.createChild({cls:"x-layout-split x-layout-split-"+d,html:"&#160;",id:this.panel.id+"-xsplit"});if(this.collapseMode=="mini"){this.miniSplitEl=this.splitEl.createChild({cls:"x-layout-mini x-layout-mini-"+d,html:"&#160;"});this.miniSplitEl.addClassOnOver("x-layout-mini-over");this.miniSplitEl.on("click",this.onCollapseClick,this,{stopEvent:true})}var b=this.splitSettings[d];this.split=new Ext.SplitBar(this.splitEl.dom,c.el,b.orientation);this.split.tickSize=this.tickSize;this.split.placement=b.placement;this.split.getMaximumSize=this[b.maxFn].createDelegate(this);this.split.minSize=this.minSize||this[b.minProp];this.split.on("beforeapply",this.onSplitMove,this);this.split.useShim=this.useShim===true;this.maxSize=this.maxSize||this[b.maxProp];if(c.hidden){this.splitEl.hide()}if(this.useSplitTips){this.splitEl.dom.title=this.collapsible?this.collapsibleSplitTip:this.splitTip}if(this.collapsible){this.splitEl.on("dblclick",this.onCollapseClick,this)}},getSize:function(){if(this.isCollapsed){return this.collapsedEl.getSize()}var a=this.panel.getSize();if(this.position=="north"||this.position=="south"){a.height+=this.splitEl.dom.offsetHeight}else{a.width+=this.splitEl.dom.offsetWidth}return a},getHMaxSize:function(){var b=this.maxSize||10000;var a=this.layout.center;return Math.min(b,(this.el.getWidth()+a.el.getWidth())-a.getMinWidth())},getVMaxSize:function(){var b=this.maxSize||10000;var a=this.layout.center;return Math.min(b,(this.el.getHeight()+a.el.getHeight())-a.getMinHeight())},onSplitMove:function(b,a){var c=this.panel.getSize();this.lastSplitSize=a;if(this.position=="north"||this.position=="south"){this.panel.setSize(c.width,a);this.state.height=a}else{this.panel.setSize(a,c.height);this.state.width=a}this.layout.layout();this.panel.saveState();return false},getSplitBar:function(){return this.split},destroy:function(){Ext.destroy(this.miniSplitEl,this.split,this.splitEl);Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.border=Ext.layout.BorderLayout;Ext.layout.FormLayout=Ext.extend(Ext.layout.AnchorLayout,{labelSeparator:":",trackLabels:true,type:"form",onRemove:function(d){Ext.layout.FormLayout.superclass.onRemove.call(this,d);if(this.trackLabels){d.un("show",this.onFieldShow,this);d.un("hide",this.onFieldHide,this)}var b=d.getPositionEl(),a=d.getItemCt&&d.getItemCt();if(d.rendered&&a){if(b&&b.dom){b.insertAfter(a)}Ext.destroy(a);Ext.destroyMembers(d,"label","itemCt");if(d.customItemCt){Ext.destroyMembers(d,"getItemCt","customItemCt")}}},setContainer:function(a){Ext.layout.FormLayout.superclass.setContainer.call(this,a);if(a.labelAlign){a.addClass("x-form-label-"+a.labelAlign)}if(a.hideLabels){Ext.apply(this,{labelStyle:"display:none",elementStyle:"padding-left:0;",labelAdjust:0})}else{this.labelSeparator=Ext.isDefined(a.labelSeparator)?a.labelSeparator:this.labelSeparator;a.labelWidth=a.labelWidth||100;if(Ext.isNumber(a.labelWidth)){var b=Ext.isNumber(a.labelPad)?a.labelPad:5;Ext.apply(this,{labelAdjust:a.labelWidth+b,labelStyle:"width:"+a.labelWidth+"px;",elementStyle:"padding-left:"+(a.labelWidth+b)+"px"})}if(a.labelAlign=="top"){Ext.apply(this,{labelStyle:"width:auto;",labelAdjust:0,elementStyle:"padding-left:0;"})}}},isHide:function(a){return a.hideLabel||this.container.hideLabels},onFieldShow:function(a){a.getItemCt().removeClass("x-hide-"+a.hideMode);if(a.isComposite){a.doLayout()}},onFieldHide:function(a){a.getItemCt().addClass("x-hide-"+a.hideMode)},getLabelStyle:function(e){var b="",c=[this.labelStyle,e];for(var d=0,a=c.length;d<a;++d){if(c[d]){b+=c[d];if(b.substr(-1,1)!=";"){b+=";"}}}return b},renderItem:function(e,a,d){if(e&&(e.isFormField||e.fieldLabel)&&e.inputType!="hidden"){var b=this.getTemplateArgs(e);if(Ext.isNumber(a)){a=d.dom.childNodes[a]||null}if(a){e.itemCt=this.fieldTpl.insertBefore(a,b,true)}else{e.itemCt=this.fieldTpl.append(d,b,true)}if(!e.getItemCt){Ext.apply(e,{getItemCt:function(){return e.itemCt},customItemCt:true})}e.label=e.getItemCt().child("label.x-form-item-label");if(!e.rendered){e.render("x-form-el-"+e.id)}else{if(!this.isValidParent(e,d)){Ext.fly("x-form-el-"+e.id).appendChild(e.getPositionEl())}}if(this.trackLabels){if(e.hidden){this.onFieldHide(e)}e.on({scope:this,show:this.onFieldShow,hide:this.onFieldHide})}this.configureItem(e)}else{Ext.layout.FormLayout.superclass.renderItem.apply(this,arguments)}},getTemplateArgs:function(c){var a=!c.fieldLabel||c.hideLabel,b=(c.itemCls||this.container.itemCls||"")+(c.hideLabel?" x-hide-label":"");if(Ext.isIE9&&Ext.isIEQuirks&&c instanceof Ext.form.TextField){b+=" x-input-wrapper"}return{id:c.id,label:c.fieldLabel,itemCls:b,clearCls:c.clearCls||"x-form-clear-left",labelStyle:this.getLabelStyle(c.labelStyle),elementStyle:this.elementStyle||"",labelSeparator:a?"":(Ext.isDefined(c.labelSeparator)?c.labelSeparator:this.labelSeparator)}},adjustWidthAnchor:function(a,d){if(d.label&&!this.isHide(d)&&(this.container.labelAlign!="top")){var b=Ext.isIE6||(Ext.isIE&&!Ext.isStrict);return a-this.labelAdjust+(b?-3:0)}return a},adjustHeightAnchor:function(a,b){if(b.label&&!this.isHide(b)&&(this.container.labelAlign=="top")){return a-b.label.getHeight()}return a},isValidParent:function(b,a){return a&&this.container.getEl().contains(b.getPositionEl())}});Ext.Container.LAYOUTS.form=Ext.layout.FormLayout;Ext.layout.AccordionLayout=Ext.extend(Ext.layout.FitLayout,{fill:true,autoWidth:true,titleCollapse:true,hideCollapseTool:false,collapseFirst:false,animate:false,sequence:false,activeOnTop:false,type:"accordion",renderItem:function(a){if(this.animate===false){a.animCollapse=false}a.collapsible=true;if(this.autoWidth){a.autoWidth=true}if(this.titleCollapse){a.titleCollapse=true}if(this.hideCollapseTool){a.hideCollapseTool=true}if(this.collapseFirst!==undefined){a.collapseFirst=this.collapseFirst}if(!this.activeItem&&!a.collapsed){this.setActiveItem(a,true)}else{if(this.activeItem&&this.activeItem!=a){a.collapsed=true}}Ext.layout.AccordionLayout.superclass.renderItem.apply(this,arguments);a.header.addClass("x-accordion-hd");a.on("beforeexpand",this.beforeExpand,this)},onRemove:function(a){Ext.layout.AccordionLayout.superclass.onRemove.call(this,a);if(a.rendered){a.header.removeClass("x-accordion-hd")}a.un("beforeexpand",this.beforeExpand,this)},beforeExpand:function(c,b){var a=this.activeItem;if(a){if(this.sequence){delete this.activeItem;if(!a.collapsed){a.collapse({callback:function(){c.expand(b||true)},scope:this});return false}}else{a.collapse(this.animate)}}this.setActive(c);if(this.activeOnTop){c.el.dom.parentNode.insertBefore(c.el.dom,c.el.dom.parentNode.firstChild)}this.layout()},setItemSize:function(g,e){if(this.fill&&g){var d=0,c,b=this.getRenderedItems(this.container),a=b.length,h;for(c=0;c<a;c++){if((h=b[c])!=g&&!h.hidden){d+=h.header.getHeight()}}e.height-=d;g.setSize(e)}},setActiveItem:function(a){this.setActive(a,true)},setActive:function(c,b){var a=this.activeItem;c=this.container.getComponent(c);if(a!=c){if(c.rendered&&c.collapsed&&b){c.expand()}else{if(a){a.fireEvent("deactivate",a)}this.activeItem=c;c.fireEvent("activate",c)}}}});Ext.Container.LAYOUTS.accordion=Ext.layout.AccordionLayout;Ext.layout.Accordion=Ext.layout.AccordionLayout;Ext.layout.TableLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:false,type:"table",targetCls:"x-table-layout-ct",tableAttrs:null,setContainer:function(a){Ext.layout.TableLayout.superclass.setContainer.call(this,a);this.currentRow=0;this.currentColumn=0;this.cells=[]},onLayout:function(d,g){var e=d.items.items,a=e.length,h,b;if(!this.table){g.addClass("x-table-layout-ct");this.table=g.createChild(Ext.apply({tag:"table",cls:"x-table-layout",cellspacing:0,cn:{tag:"tbody"}},this.tableAttrs),null,true)}this.renderAll(d,g)},getRow:function(a){var b=this.table.tBodies[0].childNodes[a];if(!b){b=document.createElement("tr");this.table.tBodies[0].appendChild(b)}return b},getNextCell:function(j){var a=this.getNextNonSpan(this.currentColumn,this.currentRow);var g=this.currentColumn=a[0],e=this.currentRow=a[1];for(var i=e;i<e+(j.rowspan||1);i++){if(!this.cells[i]){this.cells[i]=[]}for(var d=g;d<g+(j.colspan||1);d++){this.cells[i][d]=true}}var h=document.createElement("td");if(j.cellId){h.id=j.cellId}var b="x-table-layout-cell";if(j.cellCls){b+=" "+j.cellCls}h.className=b;if(j.colspan){h.colSpan=j.colspan}if(j.rowspan){h.rowSpan=j.rowspan}this.getRow(e).appendChild(h);return h},getNextNonSpan:function(a,c){var b=this.columns;while((b&&a>=b)||(this.cells[c]&&this.cells[c][a])){if(b&&a>=b){c++;a=0}else{a++}}return[a,c]},renderItem:function(e,a,d){if(!this.table){this.table=d.createChild(Ext.apply({tag:"table",cls:"x-table-layout",cellspacing:0,cn:{tag:"tbody"}},this.tableAttrs),null,true)}if(e&&!e.rendered){e.render(this.getNextCell(e));this.configureItem(e)}else{if(e&&!this.isValidParent(e,d)){var b=this.getNextCell(e);b.insertBefore(e.getPositionEl().dom,null);e.container=Ext.get(b);this.configureItem(e)}}},isValidParent:function(b,a){return b.getPositionEl().up("table",5).dom.parentNode===(a.dom||a)},destroy:function(){delete this.table;Ext.layout.TableLayout.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.table=Ext.layout.TableLayout;Ext.layout.AbsoluteLayout=Ext.extend(Ext.layout.AnchorLayout,{extraCls:"x-abs-layout-item",type:"absolute",onLayout:function(a,b){b.position();this.paddingLeft=b.getPadding("l");this.paddingTop=b.getPadding("t");Ext.layout.AbsoluteLayout.superclass.onLayout.call(this,a,b)},adjustWidthAnchor:function(b,a){return b?b-a.getPosition(true)[0]+this.paddingLeft:b},adjustHeightAnchor:function(b,a){return b?b-a.getPosition(true)[1]+this.paddingTop:b}});Ext.Container.LAYOUTS.absolute=Ext.layout.AbsoluteLayout;Ext.layout.BoxLayout=Ext.extend(Ext.layout.ContainerLayout,{defaultMargins:{left:0,top:0,right:0,bottom:0},padding:"0",pack:"start",monitorResize:true,type:"box",scrollOffset:0,extraCls:"x-box-item",targetCls:"x-box-layout-ct",innerCls:"x-box-inner",constructor:function(a){Ext.layout.BoxLayout.superclass.constructor.call(this,a);if(Ext.isString(this.defaultMargins)){this.defaultMargins=this.parseMargins(this.defaultMargins)}var d=this.overflowHandler;if(typeof d=="string"){d={type:d}}var c="none";if(d&&d.type!=undefined){c=d.type}var b=Ext.layout.boxOverflow[c];if(b[this.type]){b=b[this.type]}this.overflowHandler=new b(this,d)},onLayout:function(b,h){Ext.layout.BoxLayout.superclass.onLayout.call(this,b,h);var d=this.getLayoutTargetSize(),i=this.getVisibleItems(b),c=this.calculateChildBoxes(i,d),g=c.boxes,j=c.meta;if(d.width>0){var k=this.overflowHandler,a=j.tooNarrow?"handleOverflow":"clearOverflow";var e=k[a](c,d);if(e){if(e.targetSize){d=e.targetSize}if(e.recalculate){i=this.getVisibleItems(b);c=this.calculateChildBoxes(i,d);g=c.boxes}}}this.layoutTargetLastSize=d;this.childBoxCache=c;this.updateInnerCtSize(d,c);this.updateChildBoxes(g);this.handleTargetOverflow(d,b,h)},updateChildBoxes:function(c){for(var b=0,e=c.length;b<e;b++){var d=c[b],a=d.component;if(d.dirtySize){a.setSize(d.width,d.height)}if(isNaN(d.left)||isNaN(d.top)){continue}a.setPosition(d.left,d.top)}},updateInnerCtSize:function(c,h){var i=this.align,g=this.padding,e=c.width,a=c.height;if(this.type=="hbox"){var b=e,d=h.meta.maxHeight+g.top+g.bottom;if(i=="stretch"){d=a}else{if(i=="middle"){d=Math.max(a,d)}}}else{var d=a,b=h.meta.maxWidth+g.left+g.right;if(i=="stretch"){b=e}else{if(i=="center"){b=Math.max(e,b)}}}this.innerCt.setSize(b||undefined,d||undefined)},handleTargetOverflow:function(d,a,c){var e=c.getStyle("overflow");if(e&&e!="hidden"&&!this.adjustmentPass){var b=this.getLayoutTargetSize();if(b.width!=d.width||b.height!=d.height){this.adjustmentPass=true;this.onLayout(a,c)}}delete this.adjustmentPass},isValidParent:function(b,a){return this.innerCt&&b.getPositionEl().dom.parentNode==this.innerCt.dom},getVisibleItems:function(g){var g=g||this.container,e=g.getLayoutTarget(),h=g.items.items,a=h.length,d,j,b=[];for(d=0;d<a;d++){if((j=h[d]).rendered&&this.isValidParent(j,e)&&j.hidden!==true&&j.collapsed!==true&&j.shouldLayout!==false){b.push(j)}}return b},renderAll:function(a,b){if(!this.innerCt){this.innerCt=b.createChild({cls:this.innerCls});this.padding=this.parseMargins(this.padding)}Ext.layout.BoxLayout.superclass.renderAll.call(this,a,this.innerCt)},getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a;if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},renderItem:function(a){if(Ext.isString(a.margins)){a.margins=this.parseMargins(a.margins)}else{if(!a.margins){a.margins=this.defaultMargins}}Ext.layout.BoxLayout.superclass.renderItem.apply(this,arguments)},destroy:function(){Ext.destroy(this.overflowHandler);Ext.layout.BoxLayout.superclass.destroy.apply(this,arguments)}});Ext.layout.boxOverflow.None=Ext.extend(Object,{constructor:function(b,a){this.layout=b;Ext.apply(this,a||{})},handleOverflow:Ext.emptyFn,clearOverflow:Ext.emptyFn});Ext.layout.boxOverflow.none=Ext.layout.boxOverflow.None;Ext.layout.boxOverflow.Menu=Ext.extend(Ext.layout.boxOverflow.None,{afterCls:"x-strip-right",noItemsMenuText:'<div class="x-toolbar-no-items">(None)</div>',constructor:function(a){Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this,arguments);this.menuItems=[]},createInnerElements:function(){if(!this.afterCt){this.afterCt=this.layout.innerCt.insertSibling({cls:this.afterCls},"before")}},clearOverflow:function(a,g){var e=g.width+(this.afterCt?this.afterCt.getWidth():0),b=this.menuItems;this.hideTrigger();for(var c=0,d=b.length;c<d;c++){b.pop().component.show()}return{targetSize:{height:g.height,width:e}}},showTrigger:function(){this.createMenu();this.menuTrigger.show()},hideTrigger:function(){if(this.menuTrigger!=undefined){this.menuTrigger.hide()}},beforeMenuShow:function(h){var b=this.menuItems,a=b.length,g,e;var c=function(j,i){return j.isXType("buttongroup")&&!(i instanceof Ext.Toolbar.Separator)};this.clearMenu();h.removeAll();for(var d=0;d<a;d++){g=b[d].component;if(e&&(c(g,e)||c(e,g))){h.add("-")}this.addComponentToMenu(h,g);e=g}if(h.items.length<1){h.add(this.noItemsMenuText)}},createMenuConfig:function(c,a){var b=Ext.apply({},c.initialConfig),d=c.toggleGroup;Ext.copyTo(b,c,["iconCls","icon","itemId","disabled","handler","scope","menu"]);Ext.apply(b,{text:c.overflowText||c.text,hideOnClick:a});if(d||c.enableToggle){Ext.apply(b,{group:d,checked:c.pressed,listeners:{checkchange:function(g,e){c.toggle(e)}}})}delete b.ownerCt;delete b.xtype;delete b.id;return b},addComponentToMenu:function(b,a){if(a instanceof Ext.Toolbar.Separator){b.add("-")}else{if(Ext.isFunction(a.isXType)){if(a.isXType("splitbutton")){b.add(this.createMenuConfig(a,true))}else{if(a.isXType("button")){b.add(this.createMenuConfig(a,!a.menu))}else{if(a.isXType("buttongroup")){a.items.each(function(c){this.addComponentToMenu(b,c)},this)}}}}}},clearMenu:function(){var a=this.moreMenu;if(a&&a.items){a.items.each(function(b){delete b.menu})}},createMenu:function(){if(!this.menuTrigger){this.createInnerElements();this.menu=new Ext.menu.Menu({ownerCt:this.layout.container,listeners:{scope:this,beforeshow:this.beforeMenuShow}});this.menuTrigger=new Ext.Button({iconCls:"x-toolbar-more-icon",cls:"x-toolbar-more",menu:this.menu,renderTo:this.afterCt})}},destroy:function(){Ext.destroy(this.menu,this.menuTrigger)}});Ext.layout.boxOverflow.menu=Ext.layout.boxOverflow.Menu;Ext.layout.boxOverflow.HorizontalMenu=Ext.extend(Ext.layout.boxOverflow.Menu,{constructor:function(){Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this,arguments);var c=this,b=c.layout,a=b.calculateChildBoxes;b.calculateChildBoxes=function(d,i){var l=a.apply(b,arguments),k=l.meta,e=c.menuItems;var j=0;for(var g=0,h=e.length;g<h;g++){j+=e[g].width}k.minimumWidth+=j;k.tooNarrow=k.minimumWidth>i.width;return l}},handleOverflow:function(d,h){this.showTrigger();var k=h.width-this.afterCt.getWidth(),l=d.boxes,e=0,r=false;for(var o=0,c=l.length;o<c;o++){e+=l[o].width}var a=k-e,g=0;for(var o=0,c=this.menuItems.length;o<c;o++){var n=this.menuItems[o],m=n.component,b=n.width;if(b<a){m.show();a-=b;g++;r=true}else{break}}if(r){this.menuItems=this.menuItems.slice(g)}else{for(var j=l.length-1;j>=0;j--){var q=l[j].component,p=l[j].left+l[j].width;if(p>=k){this.menuItems.unshift({component:q,width:l[j].width});q.hide()}else{break}}}if(this.menuItems.length==0){this.hideTrigger()}return{targetSize:{height:h.height,width:k},recalculate:r}}});Ext.layout.boxOverflow.menu.hbox=Ext.layout.boxOverflow.HorizontalMenu;Ext.layout.boxOverflow.Scroller=Ext.extend(Ext.layout.boxOverflow.None,{animateScroll:true,scrollIncrement:100,wheelIncrement:3,scrollRepeatInterval:400,scrollDuration:0.4,beforeCls:"x-strip-left",afterCls:"x-strip-right",scrollerCls:"x-strip-scroller",beforeScrollerCls:"x-strip-scroller-left",afterScrollerCls:"x-strip-scroller-right",createWheelListener:function(){this.layout.innerCt.on({scope:this,mousewheel:function(a){a.stopEvent();this.scrollBy(a.getWheelDelta()*this.wheelIncrement*-1,false)}})},handleOverflow:function(a,b){this.createInnerElements();this.showScrollers()},clearOverflow:function(){this.hideScrollers()},showScrollers:function(){this.createScrollers();this.beforeScroller.show();this.afterScroller.show();this.updateScrollButtons()},hideScrollers:function(){if(this.beforeScroller!=undefined){this.beforeScroller.hide();this.afterScroller.hide()}},createScrollers:function(){if(!this.beforeScroller&&!this.afterScroller){var a=this.beforeCt.createChild({cls:String.format("{0} {1} ",this.scrollerCls,this.beforeScrollerCls)});var b=this.afterCt.createChild({cls:String.format("{0} {1}",this.scrollerCls,this.afterScrollerCls)});a.addClassOnOver(this.beforeScrollerCls+"-hover");b.addClassOnOver(this.afterScrollerCls+"-hover");a.setVisibilityMode(Ext.Element.DISPLAY);b.setVisibilityMode(Ext.Element.DISPLAY);this.beforeRepeater=new Ext.util.ClickRepeater(a,{interval:this.scrollRepeatInterval,handler:this.scrollLeft,scope:this});this.afterRepeater=new Ext.util.ClickRepeater(b,{interval:this.scrollRepeatInterval,handler:this.scrollRight,scope:this});this.beforeScroller=a;this.afterScroller=b}},destroy:function(){Ext.destroy(this.beforeScroller,this.afterScroller,this.beforeRepeater,this.afterRepeater,this.beforeCt,this.afterCt)},scrollBy:function(b,a){this.scrollTo(this.getScrollPosition()+b,a)},getItem:function(a){if(Ext.isString(a)){a=Ext.getCmp(a)}else{if(Ext.isNumber(a)){a=this.items[a]}}return a},getScrollAnim:function(){return{duration:this.scrollDuration,callback:this.updateScrollButtons,scope:this}},updateScrollButtons:function(){if(this.beforeScroller==undefined||this.afterScroller==undefined){return}var d=this.atExtremeBefore()?"addClass":"removeClass",c=this.atExtremeAfter()?"addClass":"removeClass",a=this.beforeScrollerCls+"-disabled",b=this.afterScrollerCls+"-disabled";this.beforeScroller[d](a);this.afterScroller[c](b);this.scrolling=false},atExtremeBefore:function(){return this.getScrollPosition()===0},scrollLeft:function(a){this.scrollBy(-this.scrollIncrement,a)},scrollRight:function(a){this.scrollBy(this.scrollIncrement,a)},scrollToItem:function(d,b){d=this.getItem(d);if(d!=undefined){var a=this.getItemVisibility(d);if(!a.fullyVisible){var c=d.getBox(true,true),e=c.x;if(a.hiddenRight){e-=(this.layout.innerCt.getWidth()-c.width)}this.scrollTo(e,b)}}},getItemVisibility:function(e){var d=this.getItem(e).getBox(true,true),a=d.x,c=d.x+d.width,g=this.getScrollPosition(),b=this.layout.innerCt.getWidth()+g;return{hiddenLeft:a<g,hiddenRight:c>b,fullyVisible:a>g&&c<b}}});Ext.layout.boxOverflow.scroller=Ext.layout.boxOverflow.Scroller;Ext.layout.boxOverflow.VerticalScroller=Ext.extend(Ext.layout.boxOverflow.Scroller,{scrollIncrement:75,wheelIncrement:2,handleOverflow:function(a,b){Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this,arguments);return{targetSize:{height:b.height-(this.beforeCt.getHeight()+this.afterCt.getHeight()),width:b.width}}},createInnerElements:function(){var a=this.layout.innerCt;if(!this.beforeCt){this.beforeCt=a.insertSibling({cls:this.beforeCls},"before");this.afterCt=a.insertSibling({cls:this.afterCls},"after");this.createWheelListener()}},scrollTo:function(a,b){var d=this.getScrollPosition(),c=a.constrain(0,this.getMaxScrollBottom());if(c!=d&&!this.scrolling){if(b==undefined){b=this.animateScroll}this.layout.innerCt.scrollTo("top",c,b?this.getScrollAnim():false);if(b){this.scrolling=true}else{this.scrolling=false;this.updateScrollButtons()}}},getScrollPosition:function(){return parseInt(this.layout.innerCt.dom.scrollTop,10)||0},getMaxScrollBottom:function(){return this.layout.innerCt.dom.scrollHeight-this.layout.innerCt.getHeight()},atExtremeAfter:function(){return this.getScrollPosition()>=this.getMaxScrollBottom()}});Ext.layout.boxOverflow.scroller.vbox=Ext.layout.boxOverflow.VerticalScroller;Ext.layout.boxOverflow.HorizontalScroller=Ext.extend(Ext.layout.boxOverflow.Scroller,{handleOverflow:function(a,b){Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this,arguments);return{targetSize:{height:b.height,width:b.width-(this.beforeCt.getWidth()+this.afterCt.getWidth())}}},createInnerElements:function(){var a=this.layout.innerCt;if(!this.beforeCt){this.afterCt=a.insertSibling({cls:this.afterCls},"before");this.beforeCt=a.insertSibling({cls:this.beforeCls},"before");this.createWheelListener()}},scrollTo:function(a,b){var d=this.getScrollPosition(),c=a.constrain(0,this.getMaxScrollRight());if(c!=d&&!this.scrolling){if(b==undefined){b=this.animateScroll}this.layout.innerCt.scrollTo("left",c,b?this.getScrollAnim():false);if(b){this.scrolling=true}else{this.scrolling=false;this.updateScrollButtons()}}},getScrollPosition:function(){return parseInt(this.layout.innerCt.dom.scrollLeft,10)||0},getMaxScrollRight:function(){return this.layout.innerCt.dom.scrollWidth-this.layout.innerCt.getWidth()},atExtremeAfter:function(){return this.getScrollPosition()>=this.getMaxScrollRight()}});Ext.layout.boxOverflow.scroller.hbox=Ext.layout.boxOverflow.HorizontalScroller;Ext.layout.HBoxLayout=Ext.extend(Ext.layout.BoxLayout,{align:"top",type:"hbox",calculateChildBoxes:function(r,b){var F=r.length,R=this.padding,D=R.top,U=R.left,y=D+R.bottom,O=U+R.right,a=b.width-this.scrollOffset,e=b.height,o=Math.max(0,e-y),P=this.pack=="start",W=this.pack=="center",A=this.pack=="end",L=0,Q=0,T=0,l=0,X=0,H=[],k,J,M,V,w,j,S,I,c,x,q,N;for(S=0;S<F;S++){k=r[S];M=k.height;J=k.width;j=!k.hasLayout&&typeof k.doLayout=="function";if(typeof J!="number"){if(k.flex&&!J){T+=k.flex}else{if(!J&&j){k.doLayout()}V=k.getSize();J=V.width;M=V.height}}w=k.margins;x=w.left+w.right;L+=x+(J||0);l+=x+(k.flex?k.minWidth||0:J);X+=x+(k.minWidth||J||0);if(typeof M!="number"){if(j){k.doLayout()}M=k.getHeight()}Q=Math.max(Q,M+w.top+w.bottom);H.push({component:k,height:M||undefined,width:J||undefined})}var K=l-a,p=X>a;var n=Math.max(0,a-L-O);if(p){for(S=0;S<F;S++){H[S].width=r[S].minWidth||r[S].width||H[S].width}}else{if(K>0){var C=[];for(var E=0,v=F;E<v;E++){var B=r[E],t=B.minWidth||0;if(B.flex){H[E].width=t}else{C.push({minWidth:t,available:H[E].width-t,index:E})}}C.sort(function(Y,i){return Y.available>i.available?1:-1});for(var S=0,v=C.length;S<v;S++){var G=C[S].index;if(G==undefined){continue}var B=r[G],m=H[G],u=m.width,t=B.minWidth,d=Math.max(t,u-Math.ceil(K/(v-S))),g=u-d;H[G].width=d;K-=g}}else{var h=n,s=T;for(S=0;S<F;S++){k=r[S];I=H[S];w=k.margins;q=w.top+w.bottom;if(P&&k.flex&&!k.width){c=Math.ceil((k.flex/s)*h);h-=c;s-=k.flex;I.width=c;I.dirtySize=true}}}}if(W){U+=n/2}else{if(A){U+=n}}for(S=0;S<F;S++){k=r[S];I=H[S];w=k.margins;U+=w.left;q=w.top+w.bottom;I.left=U;I.top=D+w.top;switch(this.align){case"stretch":N=o-q;I.height=N.constrain(k.minHeight||0,k.maxHeight||1000000);I.dirtySize=true;break;case"stretchmax":N=Q-q;I.height=N.constrain(k.minHeight||0,k.maxHeight||1000000);I.dirtySize=true;break;case"middle":var z=o-I.height-q;if(z>0){I.top=D+q+(z/2)}}U+=I.width+w.right}return{boxes:H,meta:{maxHeight:Q,nonFlexWidth:L,desiredWidth:l,minimumWidth:X,shortfall:l-a,tooNarrow:p}}}});Ext.Container.LAYOUTS.hbox=Ext.layout.HBoxLayout;Ext.layout.VBoxLayout=Ext.extend(Ext.layout.BoxLayout,{align:"left",type:"vbox",calculateChildBoxes:function(o,b){var E=o.length,R=this.padding,C=R.top,V=R.left,x=C+R.bottom,O=V+R.right,a=b.width-this.scrollOffset,c=b.height,K=Math.max(0,a-O),P=this.pack=="start",X=this.pack=="center",z=this.pack=="end",k=0,u=0,U=0,L=0,m=0,G=[],h,I,N,W,t,g,T,H,S,w,n,d,r;for(T=0;T<E;T++){h=o[T];N=h.height;I=h.width;g=!h.hasLayout&&typeof h.doLayout=="function";if(typeof N!="number"){if(h.flex&&!N){U+=h.flex}else{if(!N&&g){h.doLayout()}W=h.getSize();I=W.width;N=W.height}}t=h.margins;n=t.top+t.bottom;k+=n+(N||0);L+=n+(h.flex?h.minHeight||0:N);m+=n+(h.minHeight||N||0);if(typeof I!="number"){if(g){h.doLayout()}I=h.getWidth()}u=Math.max(u,I+t.left+t.right);G.push({component:h,height:N||undefined,width:I||undefined})}var M=L-c,l=m>c;var q=Math.max(0,(c-k-x));if(l){for(T=0,r=E;T<r;T++){G[T].height=o[T].minHeight||o[T].height||G[T].height}}else{if(M>0){var J=[];for(var D=0,r=E;D<r;D++){var A=o[D],s=A.minHeight||0;if(A.flex){G[D].height=s}else{J.push({minHeight:s,available:G[D].height-s,index:D})}}J.sort(function(Y,i){return Y.available>i.available?1:-1});for(var T=0,r=J.length;T<r;T++){var F=J[T].index;if(F==undefined){continue}var A=o[F],j=G[F],v=j.height,s=A.minHeight,B=Math.max(s,v-Math.ceil(M/(r-T))),e=v-B;G[F].height=B;M-=e}}else{var Q=q,p=U;for(T=0;T<E;T++){h=o[T];H=G[T];t=h.margins;w=t.left+t.right;if(P&&h.flex&&!h.height){S=Math.ceil((h.flex/p)*Q);Q-=S;p-=h.flex;H.height=S;H.dirtySize=true}}}}if(X){C+=q/2}else{if(z){C+=q}}for(T=0;T<E;T++){h=o[T];H=G[T];t=h.margins;C+=t.top;w=t.left+t.right;H.left=V+t.left;H.top=C;switch(this.align){case"stretch":d=K-w;H.width=d.constrain(h.minWidth||0,h.maxWidth||1000000);H.dirtySize=true;break;case"stretchmax":d=u-w;H.width=d.constrain(h.minWidth||0,h.maxWidth||1000000);H.dirtySize=true;break;case"center":var y=K-H.width-w;if(y>0){H.left=V+w+(y/2)}}C+=H.height+t.bottom}return{boxes:G,meta:{maxWidth:u,nonFlexHeight:k,desiredHeight:L,minimumHeight:m,shortfall:L-c,tooNarrow:l}}}});Ext.Container.LAYOUTS.vbox=Ext.layout.VBoxLayout;Ext.layout.ToolbarLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"toolbar",triggerWidth:18,noItemsMenuText:'<div class="x-toolbar-no-items">(None)</div>',lastOverflow:false,tableHTML:['<table cellspacing="0" class="x-toolbar-ct">',"<tbody>","<tr>",'<td class="x-toolbar-left" align="{0}">','<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-left-row"></tr>',"</tbody>","</table>","</td>",'<td class="x-toolbar-right" align="right">','<table cellspacing="0" class="x-toolbar-right-ct">',"<tbody>","<tr>","<td>",'<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-right-row"></tr>',"</tbody>","</table>","</td>","<td>",'<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-extras-row"></tr>',"</tbody>","</table>","</td>","</tr>","</tbody>","</table>","</td>","</tr>","</tbody>","</table>"].join(""),onLayout:function(e,j){if(!this.leftTr){var h=e.buttonAlign=="center"?"center":"left";j.addClass("x-toolbar-layout-ct");j.insertHtml("beforeEnd",String.format(this.tableHTML,h));this.leftTr=j.child("tr.x-toolbar-left-row",true);this.rightTr=j.child("tr.x-toolbar-right-row",true);this.extrasTr=j.child("tr.x-toolbar-extras-row",true);if(this.hiddenItem==undefined){this.hiddenItems=[]}}var k=e.buttonAlign=="right"?this.rightTr:this.leftTr,l=e.items.items,d=0;for(var b=0,g=l.length,m;b<g;b++,d++){m=l[b];if(m.isFill){k=this.rightTr;d=-1}else{if(!m.rendered){m.render(this.insertCell(m,k,d));this.configureItem(m)}else{if(!m.xtbHidden&&!this.isValidParent(m,k.childNodes[d])){var a=this.insertCell(m,k,d);a.appendChild(m.getPositionEl().dom);m.container=Ext.get(a)}}}}this.cleanup(this.leftTr);this.cleanup(this.rightTr);this.cleanup(this.extrasTr);this.fitToSize(j)},cleanup:function(b){var e=b.childNodes,a,d;for(a=e.length-1;a>=0&&(d=e[a]);a--){if(!d.firstChild){b.removeChild(d)}}},insertCell:function(e,b,a){var d=document.createElement("td");d.className="x-toolbar-cell";b.insertBefore(d,b.childNodes[a]||null);return d},hideItem:function(a){this.hiddenItems.push(a);a.xtbHidden=true;a.xtbWidth=a.getPositionEl().dom.parentNode.offsetWidth;a.hide()},unhideItem:function(a){a.show();a.xtbHidden=false;this.hiddenItems.remove(a)},getItemWidth:function(a){return a.hidden?(a.xtbWidth||0):a.getPositionEl().dom.parentNode.offsetWidth},fitToSize:function(k){if(this.container.enableOverflow===false){return}var b=k.dom.clientWidth,j=k.dom.firstChild.offsetWidth,m=b-this.triggerWidth,a=this.lastWidth||0,c=this.hiddenItems,e=c.length!=0,n=b>=a;this.lastWidth=b;if(j>b||(e&&n)){var l=this.container.items.items,h=l.length,d=0,o;for(var g=0;g<h;g++){o=l[g];if(!o.isFill){d+=this.getItemWidth(o);if(d>m){if(!(o.hidden||o.xtbHidden)){this.hideItem(o)}}else{if(o.xtbHidden){this.unhideItem(o)}}}}}e=c.length!=0;if(e){this.initMore();if(!this.lastOverflow){this.container.fireEvent("overflowchange",this.container,true);this.lastOverflow=true}}else{if(this.more){this.clearMenu();this.more.destroy();delete this.more;if(this.lastOverflow){this.container.fireEvent("overflowchange",this.container,false);this.lastOverflow=false}}}},createMenuConfig:function(c,a){var b=Ext.apply({},c.initialConfig),d=c.toggleGroup;Ext.copyTo(b,c,["iconCls","icon","itemId","disabled","handler","scope","menu"]);Ext.apply(b,{text:c.overflowText||c.text,hideOnClick:a});if(d||c.enableToggle){Ext.apply(b,{group:d,checked:c.pressed,listeners:{checkchange:function(g,e){c.toggle(e)}}})}delete b.ownerCt;delete b.xtype;delete b.id;return b},addComponentToMenu:function(b,a){if(a instanceof Ext.Toolbar.Separator){b.add("-")}else{if(Ext.isFunction(a.isXType)){if(a.isXType("splitbutton")){b.add(this.createMenuConfig(a,true))}else{if(a.isXType("button")){b.add(this.createMenuConfig(a,!a.menu))}else{if(a.isXType("buttongroup")){a.items.each(function(c){this.addComponentToMenu(b,c)},this)}}}}}},clearMenu:function(){var a=this.moreMenu;if(a&&a.items){a.items.each(function(b){delete b.menu})}},beforeMoreShow:function(h){var b=this.container.items.items,a=b.length,g,e;var c=function(j,i){return j.isXType("buttongroup")&&!(i instanceof Ext.Toolbar.Separator)};this.clearMenu();h.removeAll();for(var d=0;d<a;d++){g=b[d];if(g.xtbHidden){if(e&&(c(g,e)||c(e,g))){h.add("-")}this.addComponentToMenu(h,g);e=g}}if(h.items.length<1){h.add(this.noItemsMenuText)}},initMore:function(){if(!this.more){this.moreMenu=new Ext.menu.Menu({ownerCt:this.container,listeners:{beforeshow:this.beforeMoreShow,scope:this}});this.more=new Ext.Button({iconCls:"x-toolbar-more-icon",cls:"x-toolbar-more",menu:this.moreMenu,ownerCt:this.container});var a=this.insertCell(this.more,this.extrasTr,100);this.more.render(a)}},destroy:function(){Ext.destroy(this.more,this.moreMenu);delete this.leftTr;delete this.rightTr;delete this.extrasTr;Ext.layout.ToolbarLayout.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.toolbar=Ext.layout.ToolbarLayout;Ext.layout.MenuLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"menu",setContainer:function(a){this.monitorResize=!a.floating;a.on("autosize",this.doAutoSize,this);Ext.layout.MenuLayout.superclass.setContainer.call(this,a)},renderItem:function(g,b,e){if(!this.itemTpl){this.itemTpl=Ext.layout.MenuLayout.prototype.itemTpl=new Ext.XTemplate('<li id="{itemId}" class="{itemCls}">','<tpl if="needsIcon">','<img alt="{altText}" src="{icon}" class="{iconCls}"/>',"</tpl>","</li>")}if(g&&!g.rendered){if(Ext.isNumber(b)){b=e.dom.childNodes[b]}var d=this.getItemArgs(g);g.render(g.positionEl=b?this.itemTpl.insertBefore(b,d,true):this.itemTpl.append(e,d,true));g.positionEl.menuItemId=g.getItemId();if(!d.isMenuItem&&d.needsIcon){g.positionEl.addClass("x-menu-list-item-indent")}this.configureItem(g)}else{if(g&&!this.isValidParent(g,e)){if(Ext.isNumber(b)){b=e.dom.childNodes[b]}e.dom.insertBefore(g.getActionEl().dom,b||null)}}},getItemArgs:function(d){var a=d instanceof Ext.menu.Item,b=!(a||d instanceof Ext.menu.Separator);return{isMenuItem:a,needsIcon:b&&(d.icon||d.iconCls),icon:d.icon||Ext.BLANK_IMAGE_URL,iconCls:"x-menu-item-icon "+(d.iconCls||""),itemId:"x-menu-el-"+d.id,itemCls:"x-menu-list-item ",altText:d.altText||""}},isValidParent:function(b,a){return b.el.up("li.x-menu-list-item",5).dom.parentNode===(a.dom||a)},onLayout:function(a,b){Ext.layout.MenuLayout.superclass.onLayout.call(this,a,b);this.doAutoSize()},doAutoSize:function(){var c=this.container,a=c.width;if(c.floating){if(a){c.setWidth(a)}else{if(Ext.isIE){c.setWidth(Ext.isStrict&&(Ext.isIE7||Ext.isIE8||Ext.isIE9)?"auto":c.minWidth);var d=c.getEl(),b=d.dom.offsetWidth;c.setWidth(c.getLayoutTarget().getWidth()+d.getFrameWidth("lr"))}}}}});Ext.Container.LAYOUTS.menu=Ext.layout.MenuLayout;Ext.Viewport=Ext.extend(Ext.Container,{initComponent:function(){Ext.Viewport.superclass.initComponent.call(this);document.getElementsByTagName("html")[0].className+=" x-viewport";this.el=Ext.getBody();this.el.setHeight=Ext.emptyFn;this.el.setWidth=Ext.emptyFn;this.el.setSize=Ext.emptyFn;this.el.dom.scroll="no";this.allowDomMove=false;this.autoWidth=true;this.autoHeight=true;Ext.EventManager.onWindowResize(this.fireResize,this);this.renderTo=this.el},fireResize:function(a,b){this.fireEvent("resize",this,a,b,a,b)}});Ext.reg("viewport",Ext.Viewport);Ext.Panel=Ext.extend(Ext.Container,{baseCls:"x-panel",collapsedCls:"x-panel-collapsed",maskDisabled:true,animCollapse:Ext.enableFx,headerAsText:true,buttonAlign:"right",collapsed:false,collapseFirst:true,minButtonWidth:75,elements:"body",preventBodyReset:false,padding:undefined,resizeEvent:"bodyresize",toolTarget:"header",collapseEl:"bwrap",slideAnchor:"t",disabledClass:"",deferHeight:true,expandDefaults:{duration:0.25},collapseDefaults:{duration:0.25},initComponent:function(){Ext.Panel.superclass.initComponent.call(this);this.addEvents("bodyresize","titlechange","iconchange","collapse","expand","beforecollapse","beforeexpand","beforeclose","close","activate","deactivate");if(this.unstyled){this.baseCls="x-plain"}this.toolbars=[];if(this.tbar){this.elements+=",tbar";this.topToolbar=this.createToolbar(this.tbar);this.tbar=null}if(this.bbar){this.elements+=",bbar";this.bottomToolbar=this.createToolbar(this.bbar);this.bbar=null}if(this.header===true){this.elements+=",header";this.header=null}else{if(this.headerCfg||(this.title&&this.header!==false)){this.elements+=",header"}}if(this.footerCfg||this.footer===true){this.elements+=",footer";this.footer=null}if(this.buttons){this.fbar=this.buttons;this.buttons=null}if(this.fbar){this.createFbar(this.fbar)}if(this.autoLoad){this.on("render",this.doAutoLoad,this,{delay:10})}},createFbar:function(b){var a=this.minButtonWidth;this.elements+=",footer";this.fbar=this.createToolbar(b,{buttonAlign:this.buttonAlign,toolbarCls:"x-panel-fbar",enableOverflow:false,defaults:function(d){return{minWidth:d.minWidth||a}}});this.fbar.items.each(function(d){d.minWidth=d.minWidth||this.minButtonWidth},this);this.buttons=this.fbar.items.items},createToolbar:function(b,c){var a;if(Ext.isArray(b)){b={items:b}}a=b.events?Ext.apply(b,c):this.createComponent(Ext.apply({},b,c),"toolbar");this.toolbars.push(a);return a},createElement:function(a,c){if(this[a]){c.appendChild(this[a].dom);return}if(a==="bwrap"||this.elements.indexOf(a)!=-1){if(this[a+"Cfg"]){this[a]=Ext.fly(c).createChild(this[a+"Cfg"])}else{var b=document.createElement("div");b.className=this[a+"Cls"];this[a]=Ext.get(c.appendChild(b))}if(this[a+"CssClass"]){this[a].addClass(this[a+"CssClass"])}if(this[a+"Style"]){this[a].applyStyles(this[a+"Style"])}}},onRender:function(g,e){Ext.Panel.superclass.onRender.call(this,g,e);this.createClasses();var a=this.el,h=a.dom,k,i;if(this.collapsible&&!this.hideCollapseTool){this.tools=this.tools?this.tools.slice(0):[];this.tools[this.collapseFirst?"unshift":"push"]({id:"toggle",handler:this.toggleCollapse,scope:this})}if(this.tools){i=this.tools;this.elements+=(this.header!==false)?",header":""}this.tools={};a.addClass(this.baseCls);if(h.firstChild){this.header=a.down("."+this.headerCls);this.bwrap=a.down("."+this.bwrapCls);var j=this.bwrap?this.bwrap:a;this.tbar=j.down("."+this.tbarCls);this.body=j.down("."+this.bodyCls);this.bbar=j.down("."+this.bbarCls);this.footer=j.down("."+this.footerCls);this.fromMarkup=true}if(this.preventBodyReset===true){a.addClass("x-panel-reset")}if(this.cls){a.addClass(this.cls)}if(this.buttons){this.elements+=",footer"}if(this.frame){a.insertHtml("afterBegin",String.format(Ext.Element.boxMarkup,this.baseCls));this.createElement("header",h.firstChild.firstChild.firstChild);this.createElement("bwrap",h);k=this.bwrap.dom;var c=h.childNodes[1],b=h.childNodes[2];k.appendChild(c);k.appendChild(b);var l=k.firstChild.firstChild.firstChild;this.createElement("tbar",l);this.createElement("body",l);this.createElement("bbar",l);this.createElement("footer",k.lastChild.firstChild.firstChild);if(!this.footer){this.bwrap.dom.lastChild.className+=" x-panel-nofooter"}this.ft=Ext.get(this.bwrap.dom.lastChild);this.mc=Ext.get(l)}else{this.createElement("header",h);this.createElement("bwrap",h);k=this.bwrap.dom;this.createElement("tbar",k);this.createElement("body",k);this.createElement("bbar",k);this.createElement("footer",k);if(!this.header){this.body.addClass(this.bodyCls+"-noheader");if(this.tbar){this.tbar.addClass(this.tbarCls+"-noheader")}}}if(Ext.isDefined(this.padding)){this.body.setStyle("padding",this.body.addUnits(this.padding))}if(this.border===false){this.el.addClass(this.baseCls+"-noborder");this.body.addClass(this.bodyCls+"-noborder");if(this.header){this.header.addClass(this.headerCls+"-noborder")}if(this.footer){this.footer.addClass(this.footerCls+"-noborder")}if(this.tbar){this.tbar.addClass(this.tbarCls+"-noborder")}if(this.bbar){this.bbar.addClass(this.bbarCls+"-noborder")}}if(this.bodyBorder===false){this.body.addClass(this.bodyCls+"-noborder")}this.bwrap.enableDisplayMode("block");if(this.header){this.header.unselectable();if(this.headerAsText){this.header.dom.innerHTML='<span class="'+this.headerTextCls+'">'+this.header.dom.innerHTML+"</span>";if(this.iconCls){this.setIconClass(this.iconCls)}}}if(this.floating){this.makeFloating(this.floating)}if(this.collapsible&&this.titleCollapse&&this.header){this.mon(this.header,"click",this.toggleCollapse,this);this.header.setStyle("cursor","pointer")}if(i){this.addTool.apply(this,i)}if(this.fbar){this.footer.addClass("x-panel-btns");this.fbar.ownerCt=this;this.fbar.render(this.footer);this.footer.createChild({cls:"x-clear"})}if(this.tbar&&this.topToolbar){this.topToolbar.ownerCt=this;this.topToolbar.render(this.tbar)}if(this.bbar&&this.bottomToolbar){this.bottomToolbar.ownerCt=this;this.bottomToolbar.render(this.bbar)}},setIconClass:function(b){var a=this.iconCls;this.iconCls=b;if(this.rendered&&this.header){if(this.frame){this.header.addClass("x-panel-icon");this.header.replaceClass(a,this.iconCls)}else{var e=this.header,c=e.child("img.x-panel-inline-icon");if(c){Ext.fly(c).replaceClass(a,this.iconCls)}else{var d=e.child("span."+this.headerTextCls);if(d){Ext.DomHelper.insertBefore(d.dom,{tag:"img",alt:"",src:Ext.BLANK_IMAGE_URL,cls:"x-panel-inline-icon "+this.iconCls})}}}}this.fireEvent("iconchange",this,b,a)},makeFloating:function(a){this.floating=true;this.el=new Ext.Layer(Ext.apply({},a,{shadow:Ext.isDefined(this.shadow)?this.shadow:"sides",shadowOffset:this.shadowOffset,constrain:false,shim:this.shim===false?false:undefined}),this.el)},getTopToolbar:function(){return this.topToolbar},getBottomToolbar:function(){return this.bottomToolbar},getFooterToolbar:function(){return this.fbar},addButton:function(a,c,b){if(!this.fbar){this.createFbar([])}if(c){if(Ext.isString(a)){a={text:a}}a=Ext.apply({handler:c,scope:b},a)}return this.fbar.add(a)},addTool:function(){if(!this.rendered){if(!this.tools){this.tools=[]}Ext.each(arguments,function(a){this.tools.push(a)},this);return}if(!this[this.toolTarget]){return}if(!this.toolTemplate){var h=new Ext.Template('<div class="x-tool x-tool-{id}">&#160;</div>');h.disableFormats=true;h.compile();Ext.Panel.prototype.toolTemplate=h}for(var g=0,d=arguments,c=d.length;g<c;g++){var b=d[g];if(!this.tools[b.id]){var j="x-tool-"+b.id+"-over";var e=this.toolTemplate.insertFirst(this[this.toolTarget],b,true);this.tools[b.id]=e;e.enableDisplayMode("block");this.mon(e,"click",this.createToolHandler(e,b,j,this));if(b.on){this.mon(e,b.on)}if(b.hidden){e.hide()}if(b.qtip){if(Ext.isObject(b.qtip)){Ext.QuickTips.register(Ext.apply({target:e.id},b.qtip))}else{e.dom.qtip=b.qtip}}e.addClassOnOver(j)}}},onLayout:function(b,a){Ext.Panel.superclass.onLayout.apply(this,arguments);if(this.hasLayout&&this.toolbars.length>0){Ext.each(this.toolbars,function(c){c.doLayout(undefined,a)});this.syncHeight()}},syncHeight:function(){var b=this.toolbarHeight,c=this.body,a=this.lastSize.height,d;if(this.autoHeight||!Ext.isDefined(a)||a=="auto"){return}if(b!=this.getToolbarHeight()){b=Math.max(0,a-this.getFrameHeight());c.setHeight(b);d=c.getSize();this.toolbarHeight=this.getToolbarHeight();this.onBodyResize(d.width,d.height)}},onShow:function(){if(this.floating){return this.el.show()}Ext.Panel.superclass.onShow.call(this)},onHide:function(){if(this.floating){return this.el.hide()}Ext.Panel.superclass.onHide.call(this)},createToolHandler:function(c,a,d,b){return function(g){c.removeClass(d);if(a.stopEvent!==false){g.stopEvent()}if(a.handler){a.handler.call(a.scope||c,g,c,b,a)}}},afterRender:function(){if(this.floating&&!this.hidden){this.el.show()}if(this.title){this.setTitle(this.title)}Ext.Panel.superclass.afterRender.call(this);if(this.collapsed){this.collapsed=false;this.collapse(false)}this.initEvents()},getKeyMap:function(){if(!this.keyMap){this.keyMap=new Ext.KeyMap(this.el,this.keys)}return this.keyMap},initEvents:function(){if(this.keys){this.getKeyMap()}if(this.draggable){this.initDraggable()}if(this.toolbars.length>0){Ext.each(this.toolbars,function(a){a.doLayout();a.on({scope:this,afterlayout:this.syncHeight,remove:this.syncHeight})},this);this.syncHeight()}},initDraggable:function(){this.dd=new Ext.Panel.DD(this,Ext.isBoolean(this.draggable)?null:this.draggable)},beforeEffect:function(a){if(this.floating){this.el.beforeAction()}if(a!==false){this.el.addClass("x-panel-animated")}},afterEffect:function(a){this.syncShadow();this.el.removeClass("x-panel-animated")},createEffect:function(c,b,d){var e={scope:d,block:true};if(c===true){e.callback=b;return e}else{if(!c.callback){e.callback=b}else{e.callback=function(){b.call(d);Ext.callback(c.callback,c.scope)}}}return Ext.applyIf(e,c)},collapse:function(b){if(this.collapsed||this.el.hasFxBlock()||this.fireEvent("beforecollapse",this,b)===false){return}var a=b===true||(b!==false&&this.animCollapse);this.beforeEffect(a);this.onCollapse(a,b);return this},onCollapse:function(a,b){if(a){this[this.collapseEl].slideOut(this.slideAnchor,Ext.apply(this.createEffect(b||true,this.afterCollapse,this),this.collapseDefaults))}else{this[this.collapseEl].hide(this.hideMode);this.afterCollapse(false)}},afterCollapse:function(a){this.collapsed=true;this.el.addClass(this.collapsedCls);if(a!==false){this[this.collapseEl].hide(this.hideMode)}this.afterEffect(a);this.cascade(function(b){if(b.lastSize){b.lastSize={width:undefined,height:undefined}}});this.fireEvent("collapse",this)},expand:function(b){if(!this.collapsed||this.el.hasFxBlock()||this.fireEvent("beforeexpand",this,b)===false){return}var a=b===true||(b!==false&&this.animCollapse);this.el.removeClass(this.collapsedCls);this.beforeEffect(a);this.onExpand(a,b);return this},onExpand:function(a,b){if(a){this[this.collapseEl].slideIn(this.slideAnchor,Ext.apply(this.createEffect(b||true,this.afterExpand,this),this.expandDefaults))}else{this[this.collapseEl].show(this.hideMode);this.afterExpand(false)}},afterExpand:function(a){this.collapsed=false;if(a!==false){this[this.collapseEl].show(this.hideMode)}this.afterEffect(a);if(this.deferLayout){delete this.deferLayout;this.doLayout(true)}this.fireEvent("expand",this)},toggleCollapse:function(a){this[this.collapsed?"expand":"collapse"](a);return this},onDisable:function(){if(this.rendered&&this.maskDisabled){this.el.mask()}Ext.Panel.superclass.onDisable.call(this)},onEnable:function(){if(this.rendered&&this.maskDisabled){this.el.unmask()}Ext.Panel.superclass.onEnable.call(this)},onResize:function(g,d,c,e){var a=g,b=d;if(Ext.isDefined(a)||Ext.isDefined(b)){if(!this.collapsed){if(Ext.isNumber(a)){this.body.setWidth(a=this.adjustBodyWidth(a-this.getFrameWidth()))}else{if(a=="auto"){a=this.body.setWidth("auto").dom.offsetWidth}else{a=this.body.dom.offsetWidth}}if(this.tbar){this.tbar.setWidth(a);if(this.topToolbar){this.topToolbar.setSize(a)}}if(this.bbar){this.bbar.setWidth(a);if(this.bottomToolbar){this.bottomToolbar.setSize(a);if(Ext.isIE){this.bbar.setStyle("position","static");this.bbar.setStyle("position","")}}}if(this.footer){this.footer.setWidth(a);if(this.fbar){this.fbar.setSize(Ext.isIE?(a-this.footer.getFrameWidth("lr")):"auto")}}if(Ext.isNumber(b)){b=Math.max(0,b-this.getFrameHeight());this.body.setHeight(b)}else{if(b=="auto"){this.body.setHeight(b)}}if(this.disabled&&this.el._mask){this.el._mask.setSize(this.el.dom.clientWidth,this.el.getHeight())}}else{this.queuedBodySize={width:a,height:b};if(!this.queuedExpand&&this.allowQueuedExpand!==false){this.queuedExpand=true;this.on("expand",function(){delete this.queuedExpand;this.onResize(this.queuedBodySize.width,this.queuedBodySize.height)},this,{single:true})}}this.onBodyResize(a,b)}this.syncShadow();Ext.Panel.superclass.onResize.call(this,g,d,c,e)},onBodyResize:function(a,b){this.fireEvent("bodyresize",this,a,b)},getToolbarHeight:function(){var a=0;if(this.rendered){Ext.each(this.toolbars,function(b){a+=b.getHeight()},this)}return a},adjustBodyHeight:function(a){return a},adjustBodyWidth:function(a){return a},onPosition:function(){this.syncShadow()},getFrameWidth:function(){var b=this.el.getFrameWidth("lr")+this.bwrap.getFrameWidth("lr");if(this.frame){var a=this.bwrap.dom.firstChild;b+=(Ext.fly(a).getFrameWidth("l")+Ext.fly(a.firstChild).getFrameWidth("r"));b+=this.mc.getFrameWidth("lr")}return b},getFrameHeight:function(){var a=this.el.getFrameWidth("tb")+this.bwrap.getFrameWidth("tb");a+=(this.tbar?this.tbar.getHeight():0)+(this.bbar?this.bbar.getHeight():0);if(this.frame){a+=this.el.dom.firstChild.offsetHeight+this.ft.dom.offsetHeight+this.mc.getFrameWidth("tb")}else{a+=(this.header?this.header.getHeight():0)+(this.footer?this.footer.getHeight():0)}return a},getInnerWidth:function(){return this.getSize().width-this.getFrameWidth()},getInnerHeight:function(){return this.body.getHeight()},syncShadow:function(){if(this.floating){this.el.sync(true)}},getLayoutTarget:function(){return this.body},getContentTarget:function(){return this.body},setTitle:function(b,a){this.title=b;if(this.header&&this.headerAsText){this.header.child("span").update(b)}if(a){this.setIconClass(a)}this.fireEvent("titlechange",this,b);return this},getUpdater:function(){return this.body.getUpdater()},load:function(){var a=this.body.getUpdater();a.update.apply(a,arguments);return this},beforeDestroy:function(){Ext.Panel.superclass.beforeDestroy.call(this);if(this.header){this.header.removeAllListeners()}if(this.tools){for(var a in this.tools){Ext.destroy(this.tools[a])}}if(this.toolbars.length>0){Ext.each(this.toolbars,function(b){b.un("afterlayout",this.syncHeight,this);b.un("remove",this.syncHeight,this)},this)}if(Ext.isArray(this.buttons)){while(this.buttons.length){Ext.destroy(this.buttons[0])}}if(this.rendered){Ext.destroy(this.ft,this.header,this.footer,this.tbar,this.bbar,this.body,this.mc,this.bwrap,this.dd);if(this.fbar){Ext.destroy(this.fbar,this.fbar.el)}}Ext.destroy(this.toolbars)},createClasses:function(){this.headerCls=this.baseCls+"-header";this.headerTextCls=this.baseCls+"-header-text";this.bwrapCls=this.baseCls+"-bwrap";this.tbarCls=this.baseCls+"-tbar";this.bodyCls=this.baseCls+"-body";this.bbarCls=this.baseCls+"-bbar";this.footerCls=this.baseCls+"-footer"},createGhost:function(a,e,b){var d=document.createElement("div");d.className="x-panel-ghost "+(a?a:"");if(this.header){d.appendChild(this.el.dom.firstChild.cloneNode(true))}Ext.fly(d.appendChild(document.createElement("ul"))).setHeight(this.bwrap.getHeight());d.style.width=this.el.dom.offsetWidth+"px";if(!b){this.container.dom.appendChild(d)}else{Ext.getDom(b).appendChild(d)}if(e!==false&&this.el.useShim!==false){var c=new Ext.Layer({shadow:false,useDisplay:true,constrain:false},d);c.show();return c}else{return new Ext.Element(d)}},doAutoLoad:function(){var a=this.body.getUpdater();if(this.renderer){a.setRenderer(this.renderer)}a.update(Ext.isObject(this.autoLoad)?this.autoLoad:{url:this.autoLoad})},getTool:function(a){return this.tools[a]}});Ext.reg("panel",Ext.Panel);Ext.Editor=function(b,a){if(b.field){this.field=Ext.create(b.field,"textfield");a=Ext.apply({},b);delete a.field}else{this.field=b}Ext.Editor.superclass.constructor.call(this,a)};Ext.extend(Ext.Editor,Ext.Component,{allowBlur:true,value:"",alignment:"c-c?",offsets:[0,0],shadow:"frame",constrain:false,swallowKeys:true,completeOnEnter:true,cancelOnEsc:true,updateEl:false,initComponent:function(){Ext.Editor.superclass.initComponent.call(this);this.addEvents("beforestartedit","startedit","beforecomplete","complete","canceledit","specialkey")},onRender:function(b,a){this.el=new Ext.Layer({shadow:this.shadow,cls:"x-editor",parentEl:b,shim:this.shim,shadowOffset:this.shadowOffset||4,id:this.id,constrain:this.constrain});if(this.zIndex){this.el.setZIndex(this.zIndex)}this.el.setStyle("overflow",Ext.isGecko?"auto":"hidden");if(this.field.msgTarget!="title"){this.field.msgTarget="qtip"}this.field.inEditor=true;this.mon(this.field,{scope:this,blur:this.onBlur,specialkey:this.onSpecialKey});if(this.field.grow){this.mon(this.field,"autosize",this.el.sync,this.el,{delay:1})}this.field.render(this.el).show();this.field.getEl().dom.name="";if(this.swallowKeys){this.field.el.swallowEvent(["keypress","keydown"])}},onSpecialKey:function(g,d){var b=d.getKey(),a=this.completeOnEnter&&b==d.ENTER,c=this.cancelOnEsc&&b==d.ESC;if(a||c){d.stopEvent();if(a){this.completeEdit()}else{this.cancelEdit()}if(g.triggerBlur){g.triggerBlur()}}this.fireEvent("specialkey",g,d)},startEdit:function(b,c){if(this.editing){this.completeEdit()}this.boundEl=Ext.get(b);var a=c!==undefined?c:this.boundEl.dom.innerHTML;if(!this.rendered){this.render(this.parentEl||document.body)}if(this.fireEvent("beforestartedit",this,this.boundEl,a)!==false){this.startValue=a;this.field.reset();this.field.setValue(a);this.realign(true);this.editing=true;this.show()}},doAutoSize:function(){if(this.autoSize){var b=this.boundEl.getSize(),a=this.field.getSize();switch(this.autoSize){case"width":this.setSize(b.width,a.height);break;case"height":this.setSize(a.width,b.height);break;case"none":this.setSize(a.width,a.height);break;default:this.setSize(b.width,b.height)}}},setSize:function(a,b){delete this.field.lastSize;this.field.setSize(a,b);if(this.el){if(Ext.isGecko2||Ext.isOpera||(Ext.isIE7&&Ext.isStrict)){this.el.setSize(a,b)}this.el.sync()}},realign:function(a){if(a===true){this.doAutoSize()}this.el.alignTo(this.boundEl,this.alignment,this.offsets)},completeEdit:function(a){if(!this.editing){return}if(this.field.assertValue){this.field.assertValue()}var b=this.getValue();if(!this.field.isValid()){if(this.revertInvalid!==false){this.cancelEdit(a)}return}if(String(b)===String(this.startValue)&&this.ignoreNoChange){this.hideEdit(a);return}if(this.fireEvent("beforecomplete",this,b,this.startValue)!==false){b=this.getValue();if(this.updateEl&&this.boundEl){this.boundEl.update(b)}this.hideEdit(a);this.fireEvent("complete",this,b,this.startValue)}},onShow:function(){this.el.show();if(this.hideEl!==false){this.boundEl.hide()}this.field.show().focus(false,true);this.fireEvent("startedit",this.boundEl,this.startValue)},cancelEdit:function(a){if(this.editing){var b=this.getValue();this.setValue(this.startValue);this.hideEdit(a);this.fireEvent("canceledit",this,b,this.startValue)}},hideEdit:function(a){if(a!==true){this.editing=false;this.hide()}},onBlur:function(){if(this.allowBlur===true&&this.editing&&this.selectSameEditor!==true){this.completeEdit()}},onHide:function(){if(this.editing){this.completeEdit();return}this.field.blur();if(this.field.collapse){this.field.collapse()}this.el.hide();if(this.hideEl!==false){this.boundEl.show()}},setValue:function(a){this.field.setValue(a)},getValue:function(){return this.field.getValue()},beforeDestroy:function(){Ext.destroyMembers(this,"field");delete this.parentEl;delete this.boundEl}});Ext.reg("editor",Ext.Editor);Ext.ColorPalette=Ext.extend(Ext.Component,{itemCls:"x-color-palette",value:null,clickEvent:"click",ctype:"Ext.ColorPalette",allowReselect:false,colors:["000000","993300","333300","003300","003366","000080","333399","333333","800000","FF6600","808000","008000","008080","0000FF","666699","808080","FF0000","FF9900","99CC00","339966","33CCCC","3366FF","800080","969696","FF00FF","FFCC00","FFFF00","00FF00","00FFFF","00CCFF","993366","C0C0C0","FF99CC","FFCC99","FFFF99","CCFFCC","CCFFFF","99CCFF","CC99FF","FFFFFF"],initComponent:function(){Ext.ColorPalette.superclass.initComponent.call(this);this.addEvents("select");if(this.handler){this.on("select",this.handler,this.scope,true)}},onRender:function(b,a){this.autoEl={tag:"div",cls:this.itemCls};Ext.ColorPalette.superclass.onRender.call(this,b,a);var c=this.tpl||new Ext.XTemplate('<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>');c.overwrite(this.el,this.colors);this.mon(this.el,this.clickEvent,this.handleClick,this,{delegate:"a"});if(this.clickEvent!="click"){this.mon(this.el,"click",Ext.emptyFn,this,{delegate:"a",preventDefault:true})}},afterRender:function(){Ext.ColorPalette.superclass.afterRender.call(this);if(this.value){var a=this.value;this.value=null;this.select(a,true)}},handleClick:function(b,a){b.preventDefault();if(!this.disabled){var d=a.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];this.select(d.toUpperCase())}},select:function(b,a){b=b.replace("#","");if(b!=this.value||this.allowReselect){var c=this.el;if(this.value){c.child("a.color-"+this.value).removeClass("x-color-palette-sel")}c.child("a.color-"+b).addClass("x-color-palette-sel");this.value=b;if(a!==true){this.fireEvent("select",this,b)}}}});Ext.reg("colorpalette",Ext.ColorPalette);Ext.DatePicker=Ext.extend(Ext.BoxComponent,{todayText:"Today",okText:"&#160;OK&#160;",cancelText:"Cancel",todayTip:"{0} (Spacebar)",minText:"This date is before the minimum date",maxText:"This date is after the maximum date",format:"m/d/y",disabledDaysText:"Disabled",disabledDatesText:"Disabled",monthNames:Date.monthNames,dayNames:Date.dayNames,nextText:"Next Month (Control+Right)",prevText:"Previous Month (Control+Left)",monthYearText:"Choose a month (Control+Up/Down to move years)",startDay:0,showToday:true,focusOnSelect:true,initHour:12,initComponent:function(){Ext.DatePicker.superclass.initComponent.call(this);this.value=this.value?this.value.clearTime(true):new Date().clearTime();this.addEvents("select");if(this.handler){this.on("select",this.handler,this.scope||this)}this.initDisabledDays()},initDisabledDays:function(){if(!this.disabledDatesRE&&this.disabledDates){var b=this.disabledDates,a=b.length-1,c="(?:";Ext.each(b,function(g,e){c+=Ext.isDate(g)?"^"+Ext.escapeRe(g.dateFormat(this.format))+"$":b[e];if(e!=a){c+="|"}},this);this.disabledDatesRE=new RegExp(c+")")}},setDisabledDates:function(a){if(Ext.isArray(a)){this.disabledDates=a;this.disabledDatesRE=null}else{this.disabledDatesRE=a}this.initDisabledDays();this.update(this.value,true)},setDisabledDays:function(a){this.disabledDays=a;this.update(this.value,true)},setMinDate:function(a){this.minDate=a;this.update(this.value,true)},setMaxDate:function(a){this.maxDate=a;this.update(this.value,true)},setValue:function(a){this.value=a.clearTime(true);this.update(this.value)},getValue:function(){return this.value},focus:function(){this.update(this.activeDate)},onEnable:function(a){Ext.DatePicker.superclass.onEnable.call(this);this.doDisabled(false);this.update(a?this.value:this.activeDate);if(Ext.isIE){this.el.repaint()}},onDisable:function(){Ext.DatePicker.superclass.onDisable.call(this);this.doDisabled(true);if(Ext.isIE&&!Ext.isIE8){Ext.each([].concat(this.textNodes,this.el.query("th span")),function(a){Ext.fly(a).repaint()})}},doDisabled:function(a){this.keyNav.setDisabled(a);this.prevRepeater.setDisabled(a);this.nextRepeater.setDisabled(a);if(this.showToday){this.todayKeyListener.setDisabled(a);this.todayBtn.setDisabled(a)}},onRender:function(e,b){var a=['<table cellspacing="0">','<tr><td class="x-date-left"><a href="#" title="',this.prevText,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="',this.nextText,'">&#160;</a></td></tr>','<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],c=this.dayNames,h;for(h=0;h<7;h++){var k=this.startDay+h;if(k>6){k=k-7}a.push("<th><span>",c[k].substr(0,1),"</span></th>")}a[a.length]="</tr></thead><tbody><tr>";for(h=0;h<42;h++){if(h%7===0&&h!==0){a[a.length]="</tr><tr>"}a[a.length]='<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>'}a.push("</tr></tbody></table></td></tr>",this.showToday?'<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>':"",'</table><div class="x-date-mp"></div>');var j=document.createElement("div");j.className="x-date-picker";j.innerHTML=a.join("");e.dom.insertBefore(j,b);this.el=Ext.get(j);this.eventEl=Ext.get(j.firstChild);this.prevRepeater=new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"),{handler:this.showPrevMonth,scope:this,preventDefault:true,stopDefault:true});this.nextRepeater=new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"),{handler:this.showNextMonth,scope:this,preventDefault:true,stopDefault:true});this.monthPicker=this.el.down("div.x-date-mp");this.monthPicker.enableDisplayMode("block");this.keyNav=new Ext.KeyNav(this.eventEl,{left:function(d){if(d.ctrlKey){this.showPrevMonth()}else{this.update(this.activeDate.add("d",-1))}},right:function(d){if(d.ctrlKey){this.showNextMonth()}else{this.update(this.activeDate.add("d",1))}},up:function(d){if(d.ctrlKey){this.showNextYear()}else{this.update(this.activeDate.add("d",-7))}},down:function(d){if(d.ctrlKey){this.showPrevYear()}else{this.update(this.activeDate.add("d",7))}},pageUp:function(d){this.showNextMonth()},pageDown:function(d){this.showPrevMonth()},enter:function(d){d.stopPropagation();return true},scope:this});this.el.unselectable();this.cells=this.el.select("table.x-date-inner tbody td");this.textNodes=this.el.query("table.x-date-inner tbody span");this.mbtn=new Ext.Button({text:"&#160;",tooltip:this.monthYearText,renderTo:this.el.child("td.x-date-middle",true)});this.mbtn.el.child("em").addClass("x-btn-arrow");if(this.showToday){this.todayKeyListener=this.eventEl.addKeyListener(Ext.EventObject.SPACE,this.selectToday,this);var g=(new Date()).dateFormat(this.format);this.todayBtn=new Ext.Button({renderTo:this.el.child("td.x-date-bottom",true),text:String.format(this.todayText,g),tooltip:String.format(this.todayTip,g),handler:this.selectToday,scope:this})}this.mon(this.eventEl,"mousewheel",this.handleMouseWheel,this);this.mon(this.eventEl,"click",this.handleDateClick,this,{delegate:"a.x-date-date"});this.mon(this.mbtn,"click",this.showMonthPicker,this);this.onEnable(true)},createMonthPicker:function(){if(!this.monthPicker.dom.firstChild){var a=['<table border="0" cellspacing="0">'];for(var b=0;b<6;b++){a.push('<tr><td class="x-date-mp-month"><a href="#">',Date.getShortMonthName(b),"</a></td>",'<td class="x-date-mp-month x-date-mp-sep"><a href="#">',Date.getShortMonthName(b+6),"</a></td>",b===0?'<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>':'<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>')}a.push('<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',this.okText,'</button><button type="button" class="x-date-mp-cancel">',this.cancelText,"</button></td></tr>","</table>");this.monthPicker.update(a.join(""));this.mon(this.monthPicker,"click",this.onMonthClick,this);this.mon(this.monthPicker,"dblclick",this.onMonthDblClick,this);this.mpMonths=this.monthPicker.select("td.x-date-mp-month");this.mpYears=this.monthPicker.select("td.x-date-mp-year");this.mpMonths.each(function(c,d,e){e+=1;if((e%2)===0){c.dom.xmonth=5+Math.round(e*0.5)}else{c.dom.xmonth=Math.round((e-1)*0.5)}})}},showMonthPicker:function(){if(!this.disabled){this.createMonthPicker();var a=this.el.getSize();this.monthPicker.setSize(a);this.monthPicker.child("table").setSize(a);this.mpSelMonth=(this.activeDate||this.value).getMonth();this.updateMPMonth(this.mpSelMonth);this.mpSelYear=(this.activeDate||this.value).getFullYear();this.updateMPYear(this.mpSelYear);this.monthPicker.slideIn("t",{duration:0.2})}},updateMPYear:function(e){this.mpyear=e;var c=this.mpYears.elements;for(var b=1;b<=10;b++){var d=c[b-1],a;if((b%2)===0){a=e+Math.round(b*0.5);d.firstChild.innerHTML=a;d.xyear=a}else{a=e-(5-Math.round(b*0.5));d.firstChild.innerHTML=a;d.xyear=a}this.mpYears.item(b-1)[a==this.mpSelYear?"addClass":"removeClass"]("x-date-mp-sel")}},updateMPMonth:function(a){this.mpMonths.each(function(b,c,d){b[b.dom.xmonth==a?"addClass":"removeClass"]("x-date-mp-sel")})},selectMPMonth:function(a){},onMonthClick:function(g,b){g.stopEvent();var c=new Ext.Element(b),a;if(c.is("button.x-date-mp-cancel")){this.hideMonthPicker()}else{if(c.is("button.x-date-mp-ok")){var h=new Date(this.mpSelYear,this.mpSelMonth,(this.activeDate||this.value).getDate());if(h.getMonth()!=this.mpSelMonth){h=new Date(this.mpSelYear,this.mpSelMonth,1).getLastDateOfMonth()}this.update(h);this.hideMonthPicker()}else{if((a=c.up("td.x-date-mp-month",2))){this.mpMonths.removeClass("x-date-mp-sel");a.addClass("x-date-mp-sel");this.mpSelMonth=a.dom.xmonth}else{if((a=c.up("td.x-date-mp-year",2))){this.mpYears.removeClass("x-date-mp-sel");a.addClass("x-date-mp-sel");this.mpSelYear=a.dom.xyear}else{if(c.is("a.x-date-mp-prev")){this.updateMPYear(this.mpyear-10)}else{if(c.is("a.x-date-mp-next")){this.updateMPYear(this.mpyear+10)}}}}}}},onMonthDblClick:function(d,b){d.stopEvent();var c=new Ext.Element(b),a;if((a=c.up("td.x-date-mp-month",2))){this.update(new Date(this.mpSelYear,a.dom.xmonth,(this.activeDate||this.value).getDate()));this.hideMonthPicker()}else{if((a=c.up("td.x-date-mp-year",2))){this.update(new Date(a.dom.xyear,this.mpSelMonth,(this.activeDate||this.value).getDate()));this.hideMonthPicker()}}},hideMonthPicker:function(a){if(this.monthPicker){if(a===true){this.monthPicker.hide()}else{this.monthPicker.slideOut("t",{duration:0.2})}}},showPrevMonth:function(a){this.update(this.activeDate.add("mo",-1))},showNextMonth:function(a){this.update(this.activeDate.add("mo",1))},showPrevYear:function(){this.update(this.activeDate.add("y",-1))},showNextYear:function(){this.update(this.activeDate.add("y",1))},handleMouseWheel:function(a){a.stopEvent();if(!this.disabled){var b=a.getWheelDelta();if(b>0){this.showPrevMonth()}else{if(b<0){this.showNextMonth()}}}},handleDateClick:function(b,a){b.stopEvent();if(!this.disabled&&a.dateValue&&!Ext.fly(a.parentNode).hasClass("x-date-disabled")){this.cancelFocus=this.focusOnSelect===false;this.setValue(new Date(a.dateValue));delete this.cancelFocus;this.fireEvent("select",this,this.value)}},selectToday:function(){if(this.todayBtn&&!this.todayBtn.disabled){this.setValue(new Date().clearTime());this.fireEvent("select",this,this.value)}},update:function(G,A){if(this.rendered){var a=this.activeDate,p=this.isVisible();this.activeDate=G;if(!A&&a&&this.el){var o=G.getTime();if(a.getMonth()==G.getMonth()&&a.getFullYear()==G.getFullYear()){this.cells.removeClass("x-date-selected");this.cells.each(function(d){if(d.dom.firstChild.dateValue==o){d.addClass("x-date-selected");if(p&&!this.cancelFocus){Ext.fly(d.dom.firstChild).focus(50)}return false}},this);return}}var k=G.getDaysInMonth(),q=G.getFirstDateOfMonth(),g=q.getDay()-this.startDay;if(g<0){g+=7}k+=g;var B=G.add("mo",-1),h=B.getDaysInMonth()-g,e=this.cells.elements,r=this.textNodes,D=(new Date(B.getFullYear(),B.getMonth(),h,this.initHour)),C=new Date().clearTime().getTime(),v=G.clearTime(true).getTime(),u=this.minDate?this.minDate.clearTime(true):Number.NEGATIVE_INFINITY,y=this.maxDate?this.maxDate.clearTime(true):Number.POSITIVE_INFINITY,F=this.disabledDatesRE,s=this.disabledDatesText,I=this.disabledDays?this.disabledDays.join(""):false,E=this.disabledDaysText,z=this.format;if(this.showToday){var m=new Date().clearTime(),c=(m<u||m>y||(F&&z&&F.test(m.dateFormat(z)))||(I&&I.indexOf(m.getDay())!=-1));if(!this.disabled){this.todayBtn.setDisabled(c);this.todayKeyListener[c?"disable":"enable"]()}}var l=function(J,d){d.title="";var i=D.clearTime(true).getTime();d.firstChild.dateValue=i;if(i==C){d.className+=" x-date-today";d.title=J.todayText}if(i==v){d.className+=" x-date-selected";if(p){Ext.fly(d.firstChild).focus(50)}}if(i<u){d.className=" x-date-disabled";d.title=J.minText;return}if(i>y){d.className=" x-date-disabled";d.title=J.maxText;return}if(I){if(I.indexOf(D.getDay())!=-1){d.title=E;d.className=" x-date-disabled"}}if(F&&z){var w=D.dateFormat(z);if(F.test(w)){d.title=s.replace("%0",w);d.className=" x-date-disabled"}}};var x=0;for(;x<g;x++){r[x].innerHTML=(++h);D.setDate(D.getDate()+1);e[x].className="x-date-prevday";l(this,e[x])}for(;x<k;x++){var b=x-g+1;r[x].innerHTML=(b);D.setDate(D.getDate()+1);e[x].className="x-date-active";l(this,e[x])}var H=0;for(;x<42;x++){r[x].innerHTML=(++H);D.setDate(D.getDate()+1);e[x].className="x-date-nextday";l(this,e[x])}this.mbtn.setText(this.monthNames[G.getMonth()]+" "+G.getFullYear());if(!this.internalRender){var j=this.el.dom.firstChild,n=j.offsetWidth;this.el.setWidth(n+this.el.getBorderWidth("lr"));Ext.fly(j).setWidth(n);this.internalRender=true;if(Ext.isOpera&&!this.secondPass){j.rows[0].cells[1].style.width=(n-(j.rows[0].cells[0].offsetWidth+j.rows[0].cells[2].offsetWidth))+"px";this.secondPass=true;this.update.defer(10,this,[G])}}}},beforeDestroy:function(){if(this.rendered){Ext.destroy(this.keyNav,this.monthPicker,this.eventEl,this.mbtn,this.nextRepeater,this.prevRepeater,this.cells.el,this.todayBtn);delete this.textNodes;delete this.cells.elements}}});Ext.reg("datepicker",Ext.DatePicker);Ext.LoadMask=function(c,b){this.el=Ext.get(c);Ext.apply(this,b);if(this.store){this.store.on({scope:this,beforeload:this.onBeforeLoad,load:this.onLoad,exception:this.onLoad});this.removeMask=Ext.value(this.removeMask,false)}else{var a=this.el.getUpdater();a.showLoadIndicator=false;a.on({scope:this,beforeupdate:this.onBeforeLoad,update:this.onLoad,failure:this.onLoad});this.removeMask=Ext.value(this.removeMask,true)}};Ext.LoadMask.prototype={msg:"Loading...",msgCls:"x-mask-loading",disabled:false,disable:function(){this.disabled=true},enable:function(){this.disabled=false},onLoad:function(){this.el.unmask(this.removeMask)},onBeforeLoad:function(){if(!this.disabled){this.el.mask(this.msg,this.msgCls)}},show:function(){this.onBeforeLoad()},hide:function(){this.onLoad()},destroy:function(){if(this.store){this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.onLoad,this)}else{var a=this.el.getUpdater();a.un("beforeupdate",this.onBeforeLoad,this);a.un("update",this.onLoad,this);a.un("failure",this.onLoad,this)}}};Ext.slider.Thumb=Ext.extend(Object,{dragging:false,constructor:function(a){Ext.apply(this,a||{},{cls:"x-slider-thumb",constrain:false});Ext.slider.Thumb.superclass.constructor.call(this,a);if(this.slider.vertical){Ext.apply(this,Ext.slider.Thumb.Vertical)}},render:function(){this.el=this.slider.innerEl.insertFirst({cls:this.cls});this.initEvents()},enable:function(){this.disabled=false;this.el.removeClass(this.slider.disabledClass)},disable:function(){this.disabled=true;this.el.addClass(this.slider.disabledClass)},initEvents:function(){var a=this.el;a.addClassOnOver("x-slider-thumb-over");this.tracker=new Ext.dd.DragTracker({onBeforeStart:this.onBeforeDragStart.createDelegate(this),onStart:this.onDragStart.createDelegate(this),onDrag:this.onDrag.createDelegate(this),onEnd:this.onDragEnd.createDelegate(this),tolerance:3,autoStart:300});this.tracker.initEl(a)},onBeforeDragStart:function(a){if(this.disabled){return false}else{this.slider.promoteThumb(this);return true}},onDragStart:function(a){this.el.addClass("x-slider-thumb-drag");this.dragging=true;this.dragStartValue=this.value;this.slider.fireEvent("dragstart",this.slider,a,this)},onDrag:function(g){var c=this.slider,b=this.index,d=this.getNewValue();if(this.constrain){var a=c.thumbs[b+1],h=c.thumbs[b-1];if(h!=undefined&&d<=h.value){d=h.value}if(a!=undefined&&d>=a.value){d=a.value}}c.setValue(b,d,false);c.fireEvent("drag",c,g,this)},getNewValue:function(){var a=this.slider,b=a.innerEl.translatePoints(this.tracker.getXY());return Ext.util.Format.round(a.reverseValue(b.left),a.decimalPrecision)},onDragEnd:function(c){var a=this.slider,b=this.value;this.el.removeClass("x-slider-thumb-drag");this.dragging=false;a.fireEvent("dragend",a,c);if(this.dragStartValue!=b){a.fireEvent("changecomplete",a,b,this)}},destroy:function(){Ext.destroyMembers(this,"tracker","el")}});Ext.slider.MultiSlider=Ext.extend(Ext.BoxComponent,{vertical:false,minValue:0,maxValue:100,decimalPrecision:0,keyIncrement:1,increment:0,clickRange:[5,15],clickToChange:true,animate:true,constrainThumbs:true,topThumbZIndex:10000,initComponent:function(){if(!Ext.isDefined(this.value)){this.value=this.minValue}this.thumbs=[];Ext.slider.MultiSlider.superclass.initComponent.call(this);this.keyIncrement=Math.max(this.increment,this.keyIncrement);this.addEvents("beforechange","change","changecomplete","dragstart","drag","dragend");if(this.values==undefined||Ext.isEmpty(this.values)){this.values=[0]}var a=this.values;for(var b=0;b<a.length;b++){this.addThumb(a[b])}if(this.vertical){Ext.apply(this,Ext.slider.Vertical)}},addThumb:function(b){var a=new Ext.slider.Thumb({value:b,slider:this,index:this.thumbs.length,constrain:this.constrainThumbs});this.thumbs.push(a);if(this.rendered){a.render()}},promoteThumb:function(d){var a=this.thumbs,g,b;for(var e=0,c=a.length;e<c;e++){b=a[e];if(b==d){g=this.topThumbZIndex}else{g=""}b.el.setStyle("zIndex",g)}},onRender:function(){this.autoEl={cls:"x-slider "+(this.vertical?"x-slider-vert":"x-slider-horz"),cn:{cls:"x-slider-end",cn:{cls:"x-slider-inner",cn:[{tag:"a",cls:"x-slider-focus",href:"#",tabIndex:"-1",hidefocus:"on"}]}}};Ext.slider.MultiSlider.superclass.onRender.apply(this,arguments);this.endEl=this.el.first();this.innerEl=this.endEl.first();this.focusEl=this.innerEl.child(".x-slider-focus");for(var b=0;b<this.thumbs.length;b++){this.thumbs[b].render()}var a=this.innerEl.child(".x-slider-thumb");this.halfThumb=(this.vertical?a.getHeight():a.getWidth())/2;this.initEvents()},initEvents:function(){this.mon(this.el,{scope:this,mousedown:this.onMouseDown,keydown:this.onKeyDown});this.focusEl.swallowEvent("click",true)},onMouseDown:function(d){if(this.disabled){return}var c=false;for(var b=0;b<this.thumbs.length;b++){c=c||d.target==this.thumbs[b].el.dom}if(this.clickToChange&&!c){var a=this.innerEl.translatePoints(d.getXY());this.onClickChange(a)}this.focus()},onClickChange:function(c){if(c.top>this.clickRange[0]&&c.top<this.clickRange[1]){var a=this.getNearest(c,"left"),b=a.index;this.setValue(b,Ext.util.Format.round(this.reverseValue(c.left),this.decimalPrecision),undefined,true)}},getNearest:function(k,b){var m=b=="top"?this.innerEl.getHeight()-k[b]:k[b],g=this.reverseValue(m),j=(this.maxValue-this.minValue)+5,e=0,c=null;for(var d=0;d<this.thumbs.length;d++){var a=this.thumbs[d],l=a.value,h=Math.abs(l-g);if(Math.abs(h<=j)){c=a;e=d;j=h}}return c},onKeyDown:function(b){if(this.disabled||this.thumbs.length!==1){b.preventDefault();return}var a=b.getKey(),c;switch(a){case b.UP:case b.RIGHT:b.stopEvent();c=b.ctrlKey?this.maxValue:this.getValue(0)+this.keyIncrement;this.setValue(0,c,undefined,true);break;case b.DOWN:case b.LEFT:b.stopEvent();c=b.ctrlKey?this.minValue:this.getValue(0)-this.keyIncrement;this.setValue(0,c,undefined,true);break;default:b.preventDefault()}},doSnap:function(b){if(!(this.increment&&b)){return b}var d=b,c=this.increment,a=b%c;if(a!=0){d-=a;if(a*2>=c){d+=c}else{if(a*2<-c){d-=c}}}return d.constrain(this.minValue,this.maxValue)},afterRender:function(){Ext.slider.MultiSlider.superclass.afterRender.apply(this,arguments);for(var c=0;c<this.thumbs.length;c++){var b=this.thumbs[c];if(b.value!==undefined){var a=this.normalizeValue(b.value);if(a!==b.value){this.setValue(c,a,false)}else{this.moveThumb(c,this.translateValue(a),false)}}}},getRatio:function(){var a=this.innerEl.getWidth(),b=this.maxValue-this.minValue;return b==0?a:(a/b)},normalizeValue:function(a){a=this.doSnap(a);a=Ext.util.Format.round(a,this.decimalPrecision);a=a.constrain(this.minValue,this.maxValue);return a},setMinValue:function(e){this.minValue=e;var d=0,b=this.thumbs,a=b.length,c;for(;d<a;++d){c=b[d];c.value=c.value<e?e:c.value}this.syncThumb()},setMaxValue:function(e){this.maxValue=e;var d=0,b=this.thumbs,a=b.length,c;for(;d<a;++d){c=b[d];c.value=c.value>e?e:c.value}this.syncThumb()},setValue:function(d,c,b,g){var a=this.thumbs[d],e=a.el;c=this.normalizeValue(c);if(c!==a.value&&this.fireEvent("beforechange",this,c,a.value,a)!==false){a.value=c;if(this.rendered){this.moveThumb(d,this.translateValue(c),b!==false);this.fireEvent("change",this,c,a);if(g){this.fireEvent("changecomplete",this,c,a)}}}},translateValue:function(a){var b=this.getRatio();return(a*b)-(this.minValue*b)-this.halfThumb},reverseValue:function(b){var a=this.getRatio();return(b+(this.minValue*a))/a},moveThumb:function(d,c,b){var a=this.thumbs[d].el;if(!b||this.animate===false){a.setLeft(c)}else{a.shift({left:c,stopFx:true,duration:0.35})}},focus:function(){this.focusEl.focus(10)},onResize:function(c,e){var b=this.thumbs,a=b.length,d=0;for(;d<a;++d){b[d].el.stopFx()}if(Ext.isNumber(c)){this.innerEl.setWidth(c-(this.el.getPadding("l")+this.endEl.getPadding("r")))}this.syncThumb();Ext.slider.MultiSlider.superclass.onResize.apply(this,arguments)},onDisable:function(){Ext.slider.MultiSlider.superclass.onDisable.call(this);for(var b=0;b<this.thumbs.length;b++){var a=this.thumbs[b],c=a.el;a.disable();if(Ext.isIE){var d=c.getXY();c.hide();this.innerEl.addClass(this.disabledClass).dom.disabled=true;if(!this.thumbHolder){this.thumbHolder=this.endEl.createChild({cls:"x-slider-thumb "+this.disabledClass})}this.thumbHolder.show().setXY(d)}}},onEnable:function(){Ext.slider.MultiSlider.superclass.onEnable.call(this);for(var b=0;b<this.thumbs.length;b++){var a=this.thumbs[b],c=a.el;a.enable();if(Ext.isIE){this.innerEl.removeClass(this.disabledClass).dom.disabled=false;if(this.thumbHolder){this.thumbHolder.hide()}c.show();this.syncThumb()}}},syncThumb:function(){if(this.rendered){for(var a=0;a<this.thumbs.length;a++){this.moveThumb(a,this.translateValue(this.thumbs[a].value))}}},getValue:function(a){return this.thumbs[a].value},getValues:function(){var a=[];for(var b=0;b<this.thumbs.length;b++){a.push(this.thumbs[b].value)}return a},beforeDestroy:function(){var b=this.thumbs;for(var c=0,a=b.length;c<a;++c){b[c].destroy();b[c]=null}Ext.destroyMembers(this,"endEl","innerEl","focusEl","thumbHolder");Ext.slider.MultiSlider.superclass.beforeDestroy.call(this)}});Ext.reg("multislider",Ext.slider.MultiSlider);Ext.slider.SingleSlider=Ext.extend(Ext.slider.MultiSlider,{constructor:function(a){a=a||{};Ext.applyIf(a,{values:[a.value||0]});Ext.slider.SingleSlider.superclass.constructor.call(this,a)},getValue:function(){return Ext.slider.SingleSlider.superclass.getValue.call(this,0)},setValue:function(d,b){var c=Ext.toArray(arguments),a=c.length;if(a==1||(a<=3&&typeof arguments[1]!="number")){c.unshift(0)}return Ext.slider.SingleSlider.superclass.setValue.apply(this,c)},syncThumb:function(){return Ext.slider.SingleSlider.superclass.syncThumb.apply(this,[0].concat(arguments))},getNearest:function(){return this.thumbs[0]}});Ext.Slider=Ext.slider.SingleSlider;Ext.reg("slider",Ext.slider.SingleSlider);Ext.slider.Vertical={onResize:function(a,b){this.innerEl.setHeight(b-(this.el.getPadding("t")+this.endEl.getPadding("b")));this.syncThumb()},getRatio:function(){var b=this.innerEl.getHeight(),a=this.maxValue-this.minValue;return b/a},moveThumb:function(d,c,b){var a=this.thumbs[d],e=a.el;if(!b||this.animate===false){e.setBottom(c)}else{e.shift({bottom:c,stopFx:true,duration:0.35})}},onClickChange:function(c){if(c.left>this.clickRange[0]&&c.left<this.clickRange[1]){var a=this.getNearest(c,"top"),b=a.index,d=this.minValue+this.reverseValue(this.innerEl.getHeight()-c.top);this.setValue(b,Ext.util.Format.round(d,this.decimalPrecision),undefined,true)}}};Ext.slider.Thumb.Vertical={getNewValue:function(){var b=this.slider,c=b.innerEl,d=c.translatePoints(this.tracker.getXY()),a=c.getHeight()-d.top;return b.minValue+Ext.util.Format.round(a/b.getRatio(),b.decimalPrecision)}};Ext.ProgressBar=Ext.extend(Ext.BoxComponent,{baseCls:"x-progress",animate:false,waitTimer:null,initComponent:function(){Ext.ProgressBar.superclass.initComponent.call(this);this.addEvents("update")},onRender:function(d,a){var c=new Ext.Template('<div class="{cls}-wrap">','<div class="{cls}-inner">','<div class="{cls}-bar">','<div class="{cls}-text">',"<div>&#160;</div>","</div>","</div>",'<div class="{cls}-text {cls}-text-back">',"<div>&#160;</div>","</div>","</div>","</div>");this.el=a?c.insertBefore(a,{cls:this.baseCls},true):c.append(d,{cls:this.baseCls},true);if(this.id){this.el.dom.id=this.id}var b=this.el.dom.firstChild;this.progressBar=Ext.get(b.firstChild);if(this.textEl){this.textEl=Ext.get(this.textEl);delete this.textTopEl}else{this.textTopEl=Ext.get(this.progressBar.dom.firstChild);var e=Ext.get(b.childNodes[1]);this.textTopEl.setStyle("z-index",99).addClass("x-hidden");this.textEl=new Ext.CompositeElement([this.textTopEl.dom.firstChild,e.dom.firstChild]);this.textEl.setWidth(b.offsetWidth)}this.progressBar.setHeight(b.offsetHeight)},afterRender:function(){Ext.ProgressBar.superclass.afterRender.call(this);if(this.value){this.updateProgress(this.value,this.text)}else{this.updateText(this.text)}},updateProgress:function(c,d,b){this.value=c||0;if(d){this.updateText(d)}if(this.rendered&&!this.isDestroyed){var a=Math.floor(c*this.el.dom.firstChild.offsetWidth);this.progressBar.setWidth(a,b===true||(b!==false&&this.animate));if(this.textTopEl){this.textTopEl.removeClass("x-hidden").setWidth(a)}}this.fireEvent("update",this,c,d);return this},wait:function(b){if(!this.waitTimer){var a=this;b=b||{};this.updateText(b.text);this.waitTimer=Ext.TaskMgr.start({run:function(c){var d=b.increment||10;c-=1;this.updateProgress(((((c+d)%d)+1)*(100/d))*0.01,null,b.animate)},interval:b.interval||1000,duration:b.duration,onStop:function(){if(b.fn){b.fn.apply(b.scope||this)}this.reset()},scope:a})}return this},isWaiting:function(){return this.waitTimer!==null},updateText:function(a){this.text=a||"&#160;";if(this.rendered){this.textEl.update(this.text)}return this},syncProgressBar:function(){if(this.value){this.updateProgress(this.value,this.text)}return this},setSize:function(a,c){Ext.ProgressBar.superclass.setSize.call(this,a,c);if(this.textTopEl){var b=this.el.dom.firstChild;this.textEl.setSize(b.offsetWidth,b.offsetHeight)}this.syncProgressBar();return this},reset:function(a){this.updateProgress(0);if(this.textTopEl){this.textTopEl.addClass("x-hidden")}this.clearTimer();if(a===true){this.hide()}return this},clearTimer:function(){if(this.waitTimer){this.waitTimer.onStop=null;Ext.TaskMgr.stop(this.waitTimer);this.waitTimer=null}},onDestroy:function(){this.clearTimer();if(this.rendered){if(this.textEl.isComposite){this.textEl.clear()}Ext.destroyMembers(this,"textEl","progressBar","textTopEl")}Ext.ProgressBar.superclass.onDestroy.call(this)}});Ext.reg("progress",Ext.ProgressBar);(function(){var a=Ext.EventManager;var b=Ext.lib.Dom;Ext.dd.DragDrop=function(e,c,d){if(e){this.init(e,c,d)}};Ext.dd.DragDrop.prototype={id:null,config:null,dragElId:null,handleElId:null,invalidHandleTypes:null,invalidHandleIds:null,invalidHandleClasses:null,startPageX:0,startPageY:0,groups:null,locked:false,lock:function(){this.locked=true},moveOnly:false,unlock:function(){this.locked=false},isTarget:true,padding:null,_domRef:null,__ygDragDrop:true,constrainX:false,constrainY:false,minX:0,maxX:0,minY:0,maxY:0,maintainOffset:false,xTicks:null,yTicks:null,primaryButtonOnly:true,available:false,hasOuterHandles:false,b4StartDrag:function(c,d){},startDrag:function(c,d){},b4Drag:function(c){},onDrag:function(c){},onDragEnter:function(c,d){},b4DragOver:function(c){},onDragOver:function(c,d){},b4DragOut:function(c){},onDragOut:function(c,d){},b4DragDrop:function(c){},onDragDrop:function(c,d){},onInvalidDrop:function(c){},b4EndDrag:function(c){},endDrag:function(c){},b4MouseDown:function(c){},onMouseDown:function(c){},onMouseUp:function(c){},onAvailable:function(){},defaultPadding:{left:0,right:0,top:0,bottom:0},constrainTo:function(j,h,o){if(Ext.isNumber(h)){h={left:h,right:h,top:h,bottom:h}}h=h||this.defaultPadding;var l=Ext.get(this.getEl()).getBox(),d=Ext.get(j),n=d.getScroll(),k,e=d.dom;if(e==document.body){k={x:n.left,y:n.top,width:Ext.lib.Dom.getViewWidth(),height:Ext.lib.Dom.getViewHeight()}}else{var m=d.getXY();k={x:m[0],y:m[1],width:e.clientWidth,height:e.clientHeight}}var i=l.y-k.y,g=l.x-k.x;this.resetConstraints();this.setXConstraint(g-(h.left||0),k.width-g-l.width-(h.right||0),this.xTickSize);this.setYConstraint(i-(h.top||0),k.height-i-l.height-(h.bottom||0),this.yTickSize)},getEl:function(){if(!this._domRef){this._domRef=Ext.getDom(this.id)}return this._domRef},getDragEl:function(){return Ext.getDom(this.dragElId)},init:function(e,c,d){this.initTarget(e,c,d);a.on(this.id,"mousedown",this.handleMouseDown,this)},initTarget:function(e,c,d){this.config=d||{};this.DDM=Ext.dd.DDM;this.groups={};if(typeof e!=="string"){e=Ext.id(e)}this.id=e;this.addToGroup((c)?c:"default");this.handleElId=e;this.setDragElId(e);this.invalidHandleTypes={A:"A"};this.invalidHandleIds={};this.invalidHandleClasses=[];this.applyConfig();this.handleOnAvailable()},applyConfig:function(){this.padding=this.config.padding||[0,0,0,0];this.isTarget=(this.config.isTarget!==false);this.maintainOffset=(this.config.maintainOffset);this.primaryButtonOnly=(this.config.primaryButtonOnly!==false)},handleOnAvailable:function(){this.available=true;this.resetConstraints();this.onAvailable()},setPadding:function(e,c,g,d){if(!c&&0!==c){this.padding=[e,e,e,e]}else{if(!g&&0!==g){this.padding=[e,c,e,c]}else{this.padding=[e,c,g,d]}}},setInitPosition:function(g,e){var h=this.getEl();if(!this.DDM.verifyEl(h)){return}var d=g||0;var c=e||0;var i=b.getXY(h);this.initPageX=i[0]-d;this.initPageY=i[1]-c;this.lastPageX=i[0];this.lastPageY=i[1];this.setStartPosition(i)},setStartPosition:function(d){var c=d||b.getXY(this.getEl());this.deltaSetXY=null;this.startPageX=c[0];this.startPageY=c[1]},addToGroup:function(c){this.groups[c]=true;this.DDM.regDragDrop(this,c)},removeFromGroup:function(c){if(this.groups[c]){delete this.groups[c]}this.DDM.removeDDFromGroup(this,c)},setDragElId:function(c){this.dragElId=c},setHandleElId:function(c){if(typeof c!=="string"){c=Ext.id(c)}this.handleElId=c;this.DDM.regHandle(this.id,c)},setOuterHandleElId:function(c){if(typeof c!=="string"){c=Ext.id(c)}a.on(c,"mousedown",this.handleMouseDown,this);this.setHandleElId(c);this.hasOuterHandles=true},unreg:function(){a.un(this.id,"mousedown",this.handleMouseDown);this._domRef=null;this.DDM._remove(this)},destroy:function(){this.unreg()},isLocked:function(){return(this.DDM.isLocked()||this.locked)},handleMouseDown:function(g,d){if(this.primaryButtonOnly&&g.button!=0){return}if(this.isLocked()){return}this.DDM.refreshCache(this.groups);var c=new Ext.lib.Point(Ext.lib.Event.getPageX(g),Ext.lib.Event.getPageY(g));if(!this.hasOuterHandles&&!this.DDM.isOverTarget(c,this)){}else{if(this.clickValidator(g)){this.setStartPosition();this.b4MouseDown(g);this.onMouseDown(g);this.DDM.handleMouseDown(g,this);this.DDM.stopEvent(g)}else{}}},clickValidator:function(d){var c=d.getTarget();return(this.isValidHandleChild(c)&&(this.id==this.handleElId||this.DDM.handleWasClicked(c,this.id)))},addInvalidHandleType:function(c){var d=c.toUpperCase();this.invalidHandleTypes[d]=d},addInvalidHandleId:function(c){if(typeof c!=="string"){c=Ext.id(c)}this.invalidHandleIds[c]=c},addInvalidHandleClass:function(c){this.invalidHandleClasses.push(c)},removeInvalidHandleType:function(c){var d=c.toUpperCase();delete this.invalidHandleTypes[d]},removeInvalidHandleId:function(c){if(typeof c!=="string"){c=Ext.id(c)}delete this.invalidHandleIds[c]},removeInvalidHandleClass:function(d){for(var e=0,c=this.invalidHandleClasses.length;e<c;++e){if(this.invalidHandleClasses[e]==d){delete this.invalidHandleClasses[e]}}},isValidHandleChild:function(h){var g=true;var k;try{k=h.nodeName.toUpperCase()}catch(j){k=h.nodeName}g=g&&!this.invalidHandleTypes[k];g=g&&!this.invalidHandleIds[h.id];for(var d=0,c=this.invalidHandleClasses.length;g&&d<c;++d){g=!Ext.fly(h).hasClass(this.invalidHandleClasses[d])}return g},setXTicks:function(g,c){this.xTicks=[];this.xTickSize=c;var e={};for(var d=this.initPageX;d>=this.minX;d=d-c){if(!e[d]){this.xTicks[this.xTicks.length]=d;e[d]=true}}for(d=this.initPageX;d<=this.maxX;d=d+c){if(!e[d]){this.xTicks[this.xTicks.length]=d;e[d]=true}}this.xTicks.sort(this.DDM.numericSort)},setYTicks:function(g,c){this.yTicks=[];this.yTickSize=c;var e={};for(var d=this.initPageY;d>=this.minY;d=d-c){if(!e[d]){this.yTicks[this.yTicks.length]=d;e[d]=true}}for(d=this.initPageY;d<=this.maxY;d=d+c){if(!e[d]){this.yTicks[this.yTicks.length]=d;e[d]=true}}this.yTicks.sort(this.DDM.numericSort)},setXConstraint:function(e,d,c){this.leftConstraint=e;this.rightConstraint=d;this.minX=this.initPageX-e;this.maxX=this.initPageX+d;if(c){this.setXTicks(this.initPageX,c)}this.constrainX=true},clearConstraints:function(){this.constrainX=false;this.constrainY=false;this.clearTicks()},clearTicks:function(){this.xTicks=null;this.yTicks=null;this.xTickSize=0;this.yTickSize=0},setYConstraint:function(c,e,d){this.topConstraint=c;this.bottomConstraint=e;this.minY=this.initPageY-c;this.maxY=this.initPageY+e;if(d){this.setYTicks(this.initPageY,d)}this.constrainY=true},resetConstraints:function(){if(this.initPageX||this.initPageX===0){var d=(this.maintainOffset)?this.lastPageX-this.initPageX:0;var c=(this.maintainOffset)?this.lastPageY-this.initPageY:0;this.setInitPosition(d,c)}else{this.setInitPosition()}if(this.constrainX){this.setXConstraint(this.leftConstraint,this.rightConstraint,this.xTickSize)}if(this.constrainY){this.setYConstraint(this.topConstraint,this.bottomConstraint,this.yTickSize)}},getTick:function(k,g){if(!g){return k}else{if(g[0]>=k){return g[0]}else{for(var d=0,c=g.length;d<c;++d){var e=d+1;if(g[e]&&g[e]>=k){var j=k-g[d];var h=g[e]-k;return(h>j)?g[d]:g[e]}}return g[g.length-1]}}},toString:function(){return("DragDrop "+this.id)}}})();if(!Ext.dd.DragDropMgr){Ext.dd.DragDropMgr=function(){var a=Ext.EventManager;return{ids:{},handleIds:{},dragCurrent:null,dragOvers:{},deltaX:0,deltaY:0,preventDefault:true,stopPropagation:true,initialized:false,locked:false,init:function(){this.initialized=true},POINT:0,INTERSECT:1,mode:0,_execOnAll:function(d,c){for(var e in this.ids){for(var b in this.ids[e]){var g=this.ids[e][b];if(!this.isTypeOfDD(g)){continue}g[d].apply(g,c)}}},_onLoad:function(){this.init();a.on(document,"mouseup",this.handleMouseUp,this,true);a.on(document,"mousemove",this.handleMouseMove,this,true);a.on(window,"unload",this._onUnload,this,true);a.on(window,"resize",this._onResize,this,true)},_onResize:function(b){this._execOnAll("resetConstraints",[])},lock:function(){this.locked=true},unlock:function(){this.locked=false},isLocked:function(){return this.locked},locationCache:{},useCache:true,clickPixelThresh:3,clickTimeThresh:350,dragThreshMet:false,clickTimeout:null,startX:0,startY:0,regDragDrop:function(c,b){if(!this.initialized){this.init()}if(!this.ids[b]){this.ids[b]={}}this.ids[b][c.id]=c},removeDDFromGroup:function(d,b){if(!this.ids[b]){this.ids[b]={}}var c=this.ids[b];if(c&&c[d.id]){delete c[d.id]}},_remove:function(c){for(var b in c.groups){if(b&&this.ids[b]&&this.ids[b][c.id]){delete this.ids[b][c.id]}}delete this.handleIds[c.id]},regHandle:function(c,b){if(!this.handleIds[c]){this.handleIds[c]={}}this.handleIds[c][b]=b},isDragDrop:function(b){return(this.getDDById(b))?true:false},getRelated:function(h,c){var g=[];for(var e in h.groups){for(var d in this.ids[e]){var b=this.ids[e][d];if(!this.isTypeOfDD(b)){continue}if(!c||b.isTarget){g[g.length]=b}}}return g},isLegalTarget:function(g,e){var c=this.getRelated(g,true);for(var d=0,b=c.length;d<b;++d){if(c[d].id==e.id){return true}}return false},isTypeOfDD:function(b){return(b&&b.__ygDragDrop)},isHandle:function(c,b){return(this.handleIds[c]&&this.handleIds[c][b])},getDDById:function(c){for(var b in this.ids){if(this.ids[b][c]){return this.ids[b][c]}}return null},handleMouseDown:function(d,c){if(Ext.QuickTips){Ext.QuickTips.ddDisable()}if(this.dragCurrent){this.handleMouseUp(d)}this.currentTarget=d.getTarget();this.dragCurrent=c;var b=c.getEl();this.startX=d.getPageX();this.startY=d.getPageY();this.deltaX=this.startX-b.offsetLeft;this.deltaY=this.startY-b.offsetTop;this.dragThreshMet=false;this.clickTimeout=setTimeout(function(){var e=Ext.dd.DDM;e.startDrag(e.startX,e.startY)},this.clickTimeThresh)},startDrag:function(b,c){clearTimeout(this.clickTimeout);if(this.dragCurrent){this.dragCurrent.b4StartDrag(b,c);this.dragCurrent.startDrag(b,c)}this.dragThreshMet=true},handleMouseUp:function(b){if(Ext.QuickTips){Ext.QuickTips.ddEnable()}if(!this.dragCurrent){return}clearTimeout(this.clickTimeout);if(this.dragThreshMet){this.fireEvents(b,true)}else{}this.stopDrag(b);this.stopEvent(b)},stopEvent:function(b){if(this.stopPropagation){b.stopPropagation()}if(this.preventDefault){b.preventDefault()}},stopDrag:function(b){if(this.dragCurrent){if(this.dragThreshMet){this.dragCurrent.b4EndDrag(b);this.dragCurrent.endDrag(b)}this.dragCurrent.onMouseUp(b)}this.dragCurrent=null;this.dragOvers={}},handleMouseMove:function(d){if(!this.dragCurrent){return true}if(Ext.isIE&&(d.button!==0&&d.button!==1&&d.button!==2)){this.stopEvent(d);return this.handleMouseUp(d)}if(!this.dragThreshMet){var c=Math.abs(this.startX-d.getPageX());var b=Math.abs(this.startY-d.getPageY());if(c>this.clickPixelThresh||b>this.clickPixelThresh){this.startDrag(this.startX,this.startY)}}if(this.dragThreshMet){this.dragCurrent.b4Drag(d);this.dragCurrent.onDrag(d);if(!this.dragCurrent.moveOnly){this.fireEvents(d,false)}}this.stopEvent(d);return true},fireEvents:function(n,o){var q=this.dragCurrent;if(!q||q.isLocked()){return}var r=n.getPoint();var b=[];var g=[];var l=[];var j=[];var d=[];for(var h in this.dragOvers){var c=this.dragOvers[h];if(!this.isTypeOfDD(c)){continue}if(!this.isOverTarget(r,c,this.mode)){g.push(c)}b[h]=true;delete this.dragOvers[h]}for(var p in q.groups){if("string"!=typeof p){continue}for(h in this.ids[p]){var k=this.ids[p][h];if(!this.isTypeOfDD(k)){continue}if(k.isTarget&&!k.isLocked()&&((k!=q)||(q.ignoreSelf===false))){if(this.isOverTarget(r,k,this.mode)){if(o){j.push(k)}else{if(!b[k.id]){d.push(k)}else{l.push(k)}this.dragOvers[k.id]=k}}}}}if(this.mode){if(g.length){q.b4DragOut(n,g);q.onDragOut(n,g)}if(d.length){q.onDragEnter(n,d)}if(l.length){q.b4DragOver(n,l);q.onDragOver(n,l)}if(j.length){q.b4DragDrop(n,j);q.onDragDrop(n,j)}}else{var m=0;for(h=0,m=g.length;h<m;++h){q.b4DragOut(n,g[h].id);q.onDragOut(n,g[h].id)}for(h=0,m=d.length;h<m;++h){q.onDragEnter(n,d[h].id)}for(h=0,m=l.length;h<m;++h){q.b4DragOver(n,l[h].id);q.onDragOver(n,l[h].id)}for(h=0,m=j.length;h<m;++h){q.b4DragDrop(n,j[h].id);q.onDragDrop(n,j[h].id)}}if(o&&!j.length){q.onInvalidDrop(n)}},getBestMatch:function(d){var g=null;var c=d.length;if(c==1){g=d[0]}else{for(var e=0;e<c;++e){var b=d[e];if(b.cursorIsOver){g=b;break}else{if(!g||g.overlap.getArea()<b.overlap.getArea()){g=b}}}}return g},refreshCache:function(c){for(var b in c){if("string"!=typeof b){continue}for(var d in this.ids[b]){var e=this.ids[b][d];if(this.isTypeOfDD(e)){var g=this.getLocation(e);if(g){this.locationCache[e.id]=g}else{delete this.locationCache[e.id]}}}}},verifyEl:function(c){if(c){var b;if(Ext.isIE){try{b=c.offsetParent}catch(d){}}else{b=c.offsetParent}if(b){return true}}return false},getLocation:function(j){if(!this.isTypeOfDD(j)){return null}var h=j.getEl(),o,g,d,q,p,s,c,n,i,m;try{o=Ext.lib.Dom.getXY(h)}catch(k){}if(!o){return null}g=o[0];d=g+h.offsetWidth;q=o[1];p=q+h.offsetHeight;s=q-j.padding[0];c=d+j.padding[1];n=p+j.padding[2];i=g-j.padding[3];m=new Ext.lib.Region(s,c,n,i);h=Ext.get(h.parentNode);while(h&&m){if(h.isScrollable()){m=m.intersect(h.getRegion())}h=h.parent()}return m},isOverTarget:function(k,b,d){var g=this.locationCache[b.id];if(!g||!this.useCache){g=this.getLocation(b);this.locationCache[b.id]=g}if(!g){return false}b.cursorIsOver=g.contains(k);var j=this.dragCurrent;if(!j||!j.getTargetCoord||(!d&&!j.constrainX&&!j.constrainY)){return b.cursorIsOver}b.overlap=null;var h=j.getTargetCoord(k.x,k.y);var c=j.getDragEl();var e=new Ext.lib.Region(h.y,h.x+c.offsetWidth,h.y+c.offsetHeight,h.x);var i=e.intersect(g);if(i){b.overlap=i;return(d)?true:b.cursorIsOver}else{return false}},_onUnload:function(c,b){a.removeListener(document,"mouseup",this.handleMouseUp,this);a.removeListener(document,"mousemove",this.handleMouseMove,this);a.removeListener(window,"resize",this._onResize,this);Ext.dd.DragDropMgr.unregAll()},unregAll:function(){if(this.dragCurrent){this.stopDrag();this.dragCurrent=null}this._execOnAll("unreg",[]);for(var b in this.elementCache){delete this.elementCache[b]}this.elementCache={};this.ids={}},elementCache:{},getElWrapper:function(c){var b=this.elementCache[c];if(!b||!b.el){b=this.elementCache[c]=new this.ElementWrapper(Ext.getDom(c))}return b},getElement:function(b){return Ext.getDom(b)},getCss:function(c){var b=Ext.getDom(c);return(b)?b.style:null},ElementWrapper:function(b){this.el=b||null;this.id=this.el&&b.id;this.css=this.el&&b.style},getPosX:function(b){return Ext.lib.Dom.getX(b)},getPosY:function(b){return Ext.lib.Dom.getY(b)},swapNode:function(d,b){if(d.swapNode){d.swapNode(b)}else{var e=b.parentNode;var c=b.nextSibling;if(c==d){e.insertBefore(d,b)}else{if(b==d.nextSibling){e.insertBefore(b,d)}else{d.parentNode.replaceChild(b,d);e.insertBefore(d,c)}}}},getScroll:function(){var d,b,e=document.documentElement,c=document.body;if(e&&(e.scrollTop||e.scrollLeft)){d=e.scrollTop;b=e.scrollLeft}else{if(c){d=c.scrollTop;b=c.scrollLeft}else{}}return{top:d,left:b}},getStyle:function(c,b){return Ext.fly(c).getStyle(b)},getScrollTop:function(){return this.getScroll().top},getScrollLeft:function(){return this.getScroll().left},moveToEl:function(b,d){var c=Ext.lib.Dom.getXY(d);Ext.lib.Dom.setXY(b,c)},numericSort:function(d,c){return(d-c)},_timeoutCount:0,_addListeners:function(){var b=Ext.dd.DDM;if(Ext.lib.Event&&document){b._onLoad()}else{if(b._timeoutCount>2000){}else{setTimeout(b._addListeners,10);if(document&&document.body){b._timeoutCount+=1}}}},handleWasClicked:function(b,d){if(this.isHandle(d,b.id)){return true}else{var c=b.parentNode;while(c){if(this.isHandle(d,c.id)){return true}else{c=c.parentNode}}}return false}}}();Ext.dd.DDM=Ext.dd.DragDropMgr;Ext.dd.DDM._addListeners()}Ext.dd.DD=function(c,a,b){if(c){this.init(c,a,b)}};Ext.extend(Ext.dd.DD,Ext.dd.DragDrop,{scroll:true,autoOffset:function(c,b){var a=c-this.startPageX;var d=b-this.startPageY;this.setDelta(a,d)},setDelta:function(b,a){this.deltaX=b;this.deltaY=a},setDragElPos:function(c,b){var a=this.getDragEl();this.alignElWithMouse(a,c,b)},alignElWithMouse:function(c,h,g){var e=this.getTargetCoord(h,g);var b=c.dom?c:Ext.fly(c,"_dd");if(!this.deltaSetXY){var i=[e.x,e.y];b.setXY(i);var d=b.getLeft(true);var a=b.getTop(true);this.deltaSetXY=[d-e.x,a-e.y]}else{b.setLeftTop(e.x+this.deltaSetXY[0],e.y+this.deltaSetXY[1])}this.cachePosition(e.x,e.y);this.autoScroll(e.x,e.y,c.offsetHeight,c.offsetWidth);return e},cachePosition:function(b,a){if(b){this.lastPageX=b;this.lastPageY=a}else{var c=Ext.lib.Dom.getXY(this.getEl());this.lastPageX=c[0];this.lastPageY=c[1]}},autoScroll:function(l,k,e,m){if(this.scroll){var n=Ext.lib.Dom.getViewHeight();var b=Ext.lib.Dom.getViewWidth();var p=this.DDM.getScrollTop();var d=this.DDM.getScrollLeft();var j=e+k;var o=m+l;var i=(n+p-k-this.deltaY);var g=(b+d-l-this.deltaX);var c=40;var a=(document.all)?80:30;if(j>n&&i<c){window.scrollTo(d,p+a)}if(k<p&&p>0&&k-p<c){window.scrollTo(d,p-a)}if(o>b&&g<c){window.scrollTo(d+a,p)}if(l<d&&d>0&&l-d<c){window.scrollTo(d-a,p)}}},getTargetCoord:function(c,b){var a=c-this.deltaX;var d=b-this.deltaY;if(this.constrainX){if(a<this.minX){a=this.minX}if(a>this.maxX){a=this.maxX}}if(this.constrainY){if(d<this.minY){d=this.minY}if(d>this.maxY){d=this.maxY}}a=this.getTick(a,this.xTicks);d=this.getTick(d,this.yTicks);return{x:a,y:d}},applyConfig:function(){Ext.dd.DD.superclass.applyConfig.call(this);this.scroll=(this.config.scroll!==false)},b4MouseDown:function(a){this.autoOffset(a.getPageX(),a.getPageY())},b4Drag:function(a){this.setDragElPos(a.getPageX(),a.getPageY())},toString:function(){return("DD "+this.id)}});Ext.dd.DDProxy=function(c,a,b){if(c){this.init(c,a,b);this.initFrame()}};Ext.dd.DDProxy.dragElId="ygddfdiv";Ext.extend(Ext.dd.DDProxy,Ext.dd.DD,{resizeFrame:true,centerFrame:false,createFrame:function(){var b=this;var a=document.body;if(!a||!a.firstChild){setTimeout(function(){b.createFrame()},50);return}var d=this.getDragEl();if(!d){d=document.createElement("div");d.id=this.dragElId;var c=d.style;c.position="absolute";c.visibility="hidden";c.cursor="move";c.border="2px solid #aaa";c.zIndex=999;a.insertBefore(d,a.firstChild)}},initFrame:function(){this.createFrame()},applyConfig:function(){Ext.dd.DDProxy.superclass.applyConfig.call(this);this.resizeFrame=(this.config.resizeFrame!==false);this.centerFrame=(this.config.centerFrame);this.setDragElId(this.config.dragElId||Ext.dd.DDProxy.dragElId)},showFrame:function(e,d){var c=this.getEl();var a=this.getDragEl();var b=a.style;this._resizeProxy();if(this.centerFrame){this.setDelta(Math.round(parseInt(b.width,10)/2),Math.round(parseInt(b.height,10)/2))}this.setDragElPos(e,d);Ext.fly(a).show()},_resizeProxy:function(){if(this.resizeFrame){var a=this.getEl();Ext.fly(this.getDragEl()).setSize(a.offsetWidth,a.offsetHeight)}},b4MouseDown:function(b){var a=b.getPageX();var c=b.getPageY();this.autoOffset(a,c);this.setDragElPos(a,c)},b4StartDrag:function(a,b){this.showFrame(a,b)},b4EndDrag:function(a){Ext.fly(this.getDragEl()).hide()},endDrag:function(c){var b=this.getEl();var a=this.getDragEl();a.style.visibility="";this.beforeMove();b.style.visibility="hidden";Ext.dd.DDM.moveToEl(b,a);a.style.visibility="hidden";b.style.visibility="";this.afterDrag()},beforeMove:function(){},afterDrag:function(){},toString:function(){return("DDProxy "+this.id)}});Ext.dd.DDTarget=function(c,a,b){if(c){this.initTarget(c,a,b)}};Ext.extend(Ext.dd.DDTarget,Ext.dd.DragDrop,{getDragEl:Ext.emptyFn,isValidHandleChild:Ext.emptyFn,startDrag:Ext.emptyFn,endDrag:Ext.emptyFn,onDrag:Ext.emptyFn,onDragDrop:Ext.emptyFn,onDragEnter:Ext.emptyFn,onDragOut:Ext.emptyFn,onDragOver:Ext.emptyFn,onInvalidDrop:Ext.emptyFn,onMouseDown:Ext.emptyFn,onMouseUp:Ext.emptyFn,setXConstraint:Ext.emptyFn,setYConstraint:Ext.emptyFn,resetConstraints:Ext.emptyFn,clearConstraints:Ext.emptyFn,clearTicks:Ext.emptyFn,setInitPosition:Ext.emptyFn,setDragElId:Ext.emptyFn,setHandleElId:Ext.emptyFn,setOuterHandleElId:Ext.emptyFn,addInvalidHandleClass:Ext.emptyFn,addInvalidHandleId:Ext.emptyFn,addInvalidHandleType:Ext.emptyFn,removeInvalidHandleClass:Ext.emptyFn,removeInvalidHandleId:Ext.emptyFn,removeInvalidHandleType:Ext.emptyFn,toString:function(){return("DDTarget "+this.id)}});Ext.dd.DragTracker=Ext.extend(Ext.util.Observable,{active:false,tolerance:5,autoStart:false,constructor:function(a){Ext.apply(this,a);this.addEvents("mousedown","mouseup","mousemove","dragstart","dragend","drag");this.dragRegion=new Ext.lib.Region(0,0,0,0);if(this.el){this.initEl(this.el)}Ext.dd.DragTracker.superclass.constructor.call(this,a)},initEl:function(a){this.el=Ext.get(a);a.on("mousedown",this.onMouseDown,this,this.delegate?{delegate:this.delegate}:undefined)},destroy:function(){this.el.un("mousedown",this.onMouseDown,this);delete this.el},onMouseDown:function(b,a){if(this.fireEvent("mousedown",this,b)!==false&&this.onBeforeStart(b)!==false){this.startXY=this.lastXY=b.getXY();this.dragTarget=this.delegate?a:this.el.dom;if(this.preventDefault!==false){b.preventDefault()}Ext.getDoc().on({scope:this,mouseup:this.onMouseUp,mousemove:this.onMouseMove,selectstart:this.stopSelect});if(this.autoStart){this.timer=this.triggerStart.defer(this.autoStart===true?1000:this.autoStart,this,[b])}}},onMouseMove:function(d,c){if(this.active&&Ext.isIE&&!d.browserEvent.button){d.preventDefault();this.onMouseUp(d);return}d.preventDefault();var b=d.getXY(),a=this.startXY;this.lastXY=b;if(!this.active){if(Math.abs(a[0]-b[0])>this.tolerance||Math.abs(a[1]-b[1])>this.tolerance){this.triggerStart(d)}else{return}}this.fireEvent("mousemove",this,d);this.onDrag(d);this.fireEvent("drag",this,d)},onMouseUp:function(c){var b=Ext.getDoc(),a=this.active;b.un("mousemove",this.onMouseMove,this);b.un("mouseup",this.onMouseUp,this);b.un("selectstart",this.stopSelect,this);c.preventDefault();this.clearStart();this.active=false;delete this.elRegion;this.fireEvent("mouseup",this,c);if(a){this.onEnd(c);this.fireEvent("dragend",this,c)}},triggerStart:function(a){this.clearStart();this.active=true;this.onStart(a);this.fireEvent("dragstart",this,a)},clearStart:function(){if(this.timer){clearTimeout(this.timer);delete this.timer}},stopSelect:function(a){a.stopEvent();return false},onBeforeStart:function(a){},onStart:function(a){},onDrag:function(a){},onEnd:function(a){},getDragTarget:function(){return this.dragTarget},getDragCt:function(){return this.el},getXY:function(a){return a?this.constrainModes[a].call(this,this.lastXY):this.lastXY},getOffset:function(c){var b=this.getXY(c),a=this.startXY;return[a[0]-b[0],a[1]-b[1]]},constrainModes:{point:function(b){if(!this.elRegion){this.elRegion=this.getDragCt().getRegion()}var a=this.dragRegion;a.left=b[0];a.top=b[1];a.right=b[0];a.bottom=b[1];a.constrainTo(this.elRegion);return[a.left,a.top]}}});Ext.dd.ScrollManager=function(){var c=Ext.dd.DragDropMgr;var e={};var b=null;var i={};var h=function(l){b=null;a()};var j=function(){if(c.dragCurrent){c.refreshCache(c.dragCurrent.groups)}};var d=function(){if(c.dragCurrent){var l=Ext.dd.ScrollManager;var m=i.el.ddScrollConfig?i.el.ddScrollConfig.increment:l.increment;if(!l.animate){if(i.el.scroll(i.dir,m)){j()}}else{i.el.scroll(i.dir,m,true,l.animDuration,j)}}};var a=function(){if(i.id){clearInterval(i.id)}i.id=0;i.el=null;i.dir=""};var g=function(m,l){a();i.el=m;i.dir=l;var o=m.ddScrollConfig?m.ddScrollConfig.ddGroup:undefined,n=(m.ddScrollConfig&&m.ddScrollConfig.frequency)?m.ddScrollConfig.frequency:Ext.dd.ScrollManager.frequency;if(o===undefined||c.dragCurrent.ddGroup==o){i.id=setInterval(d,n)}};var k=function(o,q){if(q||!c.dragCurrent){return}var s=Ext.dd.ScrollManager;if(!b||b!=c.dragCurrent){b=c.dragCurrent;s.refreshCache()}var t=Ext.lib.Event.getXY(o);var u=new Ext.lib.Point(t[0],t[1]);for(var m in e){var n=e[m],l=n._region;var p=n.ddScrollConfig?n.ddScrollConfig:s;if(l&&l.contains(u)&&n.isScrollable()){if(l.bottom-u.y<=p.vthresh){if(i.el!=n){g(n,"down")}return}else{if(l.right-u.x<=p.hthresh){if(i.el!=n){g(n,"left")}return}else{if(u.y-l.top<=p.vthresh){if(i.el!=n){g(n,"up")}return}else{if(u.x-l.left<=p.hthresh){if(i.el!=n){g(n,"right")}return}}}}}}a()};c.fireEvents=c.fireEvents.createSequence(k,c);c.stopDrag=c.stopDrag.createSequence(h,c);return{register:function(n){if(Ext.isArray(n)){for(var m=0,l=n.length;m<l;m++){this.register(n[m])}}else{n=Ext.get(n);e[n.id]=n}},unregister:function(n){if(Ext.isArray(n)){for(var m=0,l=n.length;m<l;m++){this.unregister(n[m])}}else{n=Ext.get(n);delete e[n.id]}},vthresh:25,hthresh:25,increment:100,frequency:500,animate:true,animDuration:0.4,ddGroup:undefined,refreshCache:function(){for(var l in e){if(typeof e[l]=="object"){e[l]._region=e[l].getRegion()}}}}}();Ext.dd.Registry=function(){var d={};var b={};var a=0;var c=function(g,e){if(typeof g=="string"){return g}var h=g.id;if(!h&&e!==false){h="extdd-"+(++a);g.id=h}return h};return{register:function(j,k){k=k||{};if(typeof j=="string"){j=document.getElementById(j)}k.ddel=j;d[c(j)]=k;if(k.isHandle!==false){b[k.ddel.id]=k}if(k.handles){var h=k.handles;for(var g=0,e=h.length;g<e;g++){b[c(h[g])]=k}}},unregister:function(j){var l=c(j,false);var k=d[l];if(k){delete d[l];if(k.handles){var h=k.handles;for(var g=0,e=h.length;g<e;g++){delete b[c(h[g],false)]}}}},getHandle:function(e){if(typeof e!="string"){e=e.id}return b[e]},getHandleFromEvent:function(h){var g=Ext.lib.Event.getTarget(h);return g?b[g.id]:null},getTarget:function(e){if(typeof e!="string"){e=e.id}return d[e]},getTargetFromEvent:function(h){var g=Ext.lib.Event.getTarget(h);return g?d[g.id]||b[g.id]:null}}}();Ext.dd.StatusProxy=function(a){Ext.apply(this,a);this.id=this.id||Ext.id();this.el=new Ext.Layer({dh:{id:this.id,tag:"div",cls:"x-dd-drag-proxy "+this.dropNotAllowed,children:[{tag:"div",cls:"x-dd-drop-icon"},{tag:"div",cls:"x-dd-drag-ghost"}]},shadow:!a||a.shadow!==false});this.ghost=Ext.get(this.el.dom.childNodes[1]);this.dropStatus=this.dropNotAllowed};Ext.dd.StatusProxy.prototype={dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",setStatus:function(a){a=a||this.dropNotAllowed;if(this.dropStatus!=a){this.el.replaceClass(this.dropStatus,a);this.dropStatus=a}},reset:function(a){this.el.dom.className="x-dd-drag-proxy "+this.dropNotAllowed;this.dropStatus=this.dropNotAllowed;if(a){this.ghost.update("")}},update:function(a){if(typeof a=="string"){this.ghost.update(a)}else{this.ghost.update("");a.style.margin="0";this.ghost.dom.appendChild(a)}var b=this.ghost.dom.firstChild;if(b){Ext.fly(b).setStyle("float","none")}},getEl:function(){return this.el},getGhost:function(){return this.ghost},hide:function(a){this.el.hide();if(a){this.reset(true)}},stop:function(){if(this.anim&&this.anim.isAnimated&&this.anim.isAnimated()){this.anim.stop()}},show:function(){this.el.show()},sync:function(){this.el.sync()},repair:function(b,c,a){this.callback=c;this.scope=a;if(b&&this.animRepair!==false){this.el.addClass("x-dd-drag-repair");this.el.hideUnders(true);this.anim=this.el.shift({duration:this.repairDuration||0.5,easing:"easeOut",xy:b,stopFx:true,callback:this.afterRepair,scope:this})}else{this.afterRepair()}},afterRepair:function(){this.hide(true);if(typeof this.callback=="function"){this.callback.call(this.scope||this)}this.callback=null;this.scope=null},destroy:function(){Ext.destroy(this.ghost,this.el)}};Ext.dd.DragSource=function(b,a){this.el=Ext.get(b);if(!this.dragData){this.dragData={}}Ext.apply(this,a);if(!this.proxy){this.proxy=new Ext.dd.StatusProxy()}Ext.dd.DragSource.superclass.constructor.call(this,this.el.dom,this.ddGroup||this.group,{dragElId:this.proxy.id,resizeFrame:false,isTarget:false,scroll:this.scroll===true});this.dragging=false};Ext.extend(Ext.dd.DragSource,Ext.dd.DDProxy,{dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",getDragData:function(a){return this.dragData},onDragEnter:function(c,d){var b=Ext.dd.DragDropMgr.getDDById(d);this.cachedTarget=b;if(this.beforeDragEnter(b,c,d)!==false){if(b.isNotifyTarget){var a=b.notifyEnter(this,c,this.dragData);this.proxy.setStatus(a)}else{this.proxy.setStatus(this.dropAllowed)}if(this.afterDragEnter){this.afterDragEnter(b,c,d)}}},beforeDragEnter:function(b,a,c){return true},alignElWithMouse:function(){Ext.dd.DragSource.superclass.alignElWithMouse.apply(this,arguments);this.proxy.sync()},onDragOver:function(c,d){var b=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(d);if(this.beforeDragOver(b,c,d)!==false){if(b.isNotifyTarget){var a=b.notifyOver(this,c,this.dragData);this.proxy.setStatus(a)}if(this.afterDragOver){this.afterDragOver(b,c,d)}}},beforeDragOver:function(b,a,c){return true},onDragOut:function(b,c){var a=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(c);if(this.beforeDragOut(a,b,c)!==false){if(a.isNotifyTarget){a.notifyOut(this,b,this.dragData)}this.proxy.reset();if(this.afterDragOut){this.afterDragOut(a,b,c)}}this.cachedTarget=null},beforeDragOut:function(b,a,c){return true},onDragDrop:function(b,c){var a=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(c);if(this.beforeDragDrop(a,b,c)!==false){if(a.isNotifyTarget){if(a.notifyDrop(this,b,this.dragData)){this.onValidDrop(a,b,c)}else{this.onInvalidDrop(a,b,c)}}else{this.onValidDrop(a,b,c)}if(this.afterDragDrop){this.afterDragDrop(a,b,c)}}delete this.cachedTarget},beforeDragDrop:function(b,a,c){return true},onValidDrop:function(b,a,c){this.hideProxy();if(this.afterValidDrop){this.afterValidDrop(b,a,c)}},getRepairXY:function(b,a){return this.el.getXY()},onInvalidDrop:function(b,a,c){this.beforeInvalidDrop(b,a,c);if(this.cachedTarget){if(this.cachedTarget.isNotifyTarget){this.cachedTarget.notifyOut(this,a,this.dragData)}this.cacheTarget=null}this.proxy.repair(this.getRepairXY(a,this.dragData),this.afterRepair,this);if(this.afterInvalidDrop){this.afterInvalidDrop(a,c)}},afterRepair:function(){if(Ext.enableFx){this.el.highlight(this.hlColor||"c3daf9")}this.dragging=false},beforeInvalidDrop:function(b,a,c){return true},handleMouseDown:function(b){if(this.dragging){return}var a=this.getDragData(b);if(a&&this.onBeforeDrag(a,b)!==false){this.dragData=a;this.proxy.stop();Ext.dd.DragSource.superclass.handleMouseDown.apply(this,arguments)}},onBeforeDrag:function(a,b){return true},onStartDrag:Ext.emptyFn,startDrag:function(a,b){this.proxy.reset();this.dragging=true;this.proxy.update("");this.onInitDrag(a,b);this.proxy.show()},onInitDrag:function(a,c){var b=this.el.dom.cloneNode(true);b.id=Ext.id();this.proxy.update(b);this.onStartDrag(a,c);return true},getProxy:function(){return this.proxy},hideProxy:function(){this.proxy.hide();this.proxy.reset(true);this.dragging=false},triggerCacheRefresh:function(){Ext.dd.DDM.refreshCache(this.groups)},b4EndDrag:function(a){},endDrag:function(a){this.onEndDrag(this.dragData,a)},onEndDrag:function(a,b){},autoOffset:function(a,b){this.setDelta(-12,-20)},destroy:function(){Ext.dd.DragSource.superclass.destroy.call(this);Ext.destroy(this.proxy)}});Ext.dd.DropTarget=Ext.extend(Ext.dd.DDTarget,{constructor:function(b,a){this.el=Ext.get(b);Ext.apply(this,a);if(this.containerScroll){Ext.dd.ScrollManager.register(this.el)}Ext.dd.DropTarget.superclass.constructor.call(this,this.el.dom,this.ddGroup||this.group,{isTarget:true})},dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",isTarget:true,isNotifyTarget:true,notifyEnter:function(a,c,b){if(this.overClass){this.el.addClass(this.overClass)}return this.dropAllowed},notifyOver:function(a,c,b){return this.dropAllowed},notifyOut:function(a,c,b){if(this.overClass){this.el.removeClass(this.overClass)}},notifyDrop:function(a,c,b){return false},destroy:function(){Ext.dd.DropTarget.superclass.destroy.call(this);if(this.containerScroll){Ext.dd.ScrollManager.unregister(this.el)}}});Ext.dd.DragZone=Ext.extend(Ext.dd.DragSource,{constructor:function(b,a){Ext.dd.DragZone.superclass.constructor.call(this,b,a);if(this.containerScroll){Ext.dd.ScrollManager.register(this.el)}},getDragData:function(a){return Ext.dd.Registry.getHandleFromEvent(a)},onInitDrag:function(a,b){this.proxy.update(this.dragData.ddel.cloneNode(true));this.onStartDrag(a,b);return true},afterRepair:function(){if(Ext.enableFx){Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor||"c3daf9")}this.dragging=false},getRepairXY:function(a){return Ext.Element.fly(this.dragData.ddel).getXY()},destroy:function(){Ext.dd.DragZone.superclass.destroy.call(this);if(this.containerScroll){Ext.dd.ScrollManager.unregister(this.el)}}});Ext.dd.DropZone=function(b,a){Ext.dd.DropZone.superclass.constructor.call(this,b,a)};Ext.extend(Ext.dd.DropZone,Ext.dd.DropTarget,{getTargetFromEvent:function(a){return Ext.dd.Registry.getTargetFromEvent(a)},onNodeEnter:function(d,a,c,b){},onNodeOver:function(d,a,c,b){return this.dropAllowed},onNodeOut:function(d,a,c,b){},onNodeDrop:function(d,a,c,b){return false},onContainerOver:function(a,c,b){return this.dropNotAllowed},onContainerDrop:function(a,c,b){return false},notifyEnter:function(a,c,b){return this.dropNotAllowed},notifyOver:function(a,c,b){var d=this.getTargetFromEvent(c);if(!d){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}return this.onContainerOver(a,c,b)}if(this.lastOverNode!=d){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b)}this.onNodeEnter(d,a,c,b);this.lastOverNode=d}return this.onNodeOver(d,a,c,b)},notifyOut:function(a,c,b){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}},notifyDrop:function(a,c,b){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}var d=this.getTargetFromEvent(c);return d?this.onNodeDrop(d,a,c,b):this.onContainerDrop(a,c,b)},triggerCacheRefresh:function(){Ext.dd.DDM.refreshCache(this.groups)}});Ext.Element.addMethods({initDD:function(c,b,d){var a=new Ext.dd.DD(Ext.id(this.dom),c,b);return Ext.apply(a,d)},initDDProxy:function(c,b,d){var a=new Ext.dd.DDProxy(Ext.id(this.dom),c,b);return Ext.apply(a,d)},initDDTarget:function(c,b,d){var a=new Ext.dd.DDTarget(Ext.id(this.dom),c,b);return Ext.apply(a,d)}});Ext.data.Api=(function(){var a={};return{actions:{create:"create",read:"read",update:"update",destroy:"destroy"},restActions:{create:"POST",read:"GET",update:"PUT",destroy:"DELETE"},isAction:function(b){return(Ext.data.Api.actions[b])?true:false},getVerb:function(b){if(a[b]){return a[b]}for(var c in this.actions){if(this.actions[c]===b){a[b]=c;break}}return(a[b]!==undefined)?a[b]:null},isValid:function(b){var e=[];var d=this.actions;for(var c in b){if(!(c in d)){e.push(c)}}return(!e.length)?true:e},hasUniqueUrl:function(c,g){var b=(c.api[g])?c.api[g].url:null;var e=true;for(var d in c.api){if((e=(d===g)?true:(c.api[d].url!=b)?true:false)===false){break}}return e},prepare:function(b){if(!b.api){b.api={}}for(var d in this.actions){var c=this.actions[d];b.api[c]=b.api[c]||b.url||b.directFn;if(typeof(b.api[c])=="string"){b.api[c]={url:b.api[c],method:(b.restful===true)?Ext.data.Api.restActions[c]:undefined}}}},restify:function(b){b.restful=true;for(var c in this.restActions){b.api[this.actions[c]].method||(b.api[this.actions[c]].method=this.restActions[c])}b.onWrite=b.onWrite.createInterceptor(function(i,j,g,e){var d=j.reader;var h=new Ext.data.Response({action:i,raw:g});switch(g.status){case 200:return true;break;case 201:if(Ext.isEmpty(h.raw.responseText)){h.success=true}else{return true}break;case 204:h.success=true;h.data=null;break;default:return true;break}if(h.success===true){this.fireEvent("write",this,i,h.data,h,e,j.request.arg)}else{this.fireEvent("exception",this,"remote",i,j,h,e)}j.request.callback.call(j.request.scope,h.data,h,h.success);return false},b)}}})();Ext.data.Response=function(b,a){Ext.apply(this,b,{raw:a})};Ext.data.Response.prototype={message:null,success:false,status:null,root:null,raw:null,getMessage:function(){return this.message},getSuccess:function(){return this.success},getStatus:function(){return this.status},getRoot:function(){return this.root},getRawResponse:function(){return this.raw}};Ext.data.Api.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.Api"});Ext.apply(Ext.data.Api.Error.prototype,{lang:{"action-url-undefined":"No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.",invalid:"received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions","invalid-url":"Invalid url.  Please review your proxy configuration.",execute:'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'}});Ext.data.SortTypes={none:function(a){return a},stripTagsRE:/<\/?[^>]+>/gi,asText:function(a){return String(a).replace(this.stripTagsRE,"")},asUCText:function(a){return String(a).toUpperCase().replace(this.stripTagsRE,"")},asUCString:function(a){return String(a).toUpperCase()},asDate:function(a){if(!a){return 0}if(Ext.isDate(a)){return a.getTime()}return Date.parse(String(a))},asFloat:function(a){var b=parseFloat(String(a).replace(/,/g,""));return isNaN(b)?0:b},asInt:function(a){var b=parseInt(String(a).replace(/,/g,""),10);return isNaN(b)?0:b}};Ext.data.Record=function(a,b){this.id=(b||b===0)?b:Ext.data.Record.id(this);this.data=a||{}};Ext.data.Record.create=function(e){var c=Ext.extend(Ext.data.Record,{});var d=c.prototype;d.fields=new Ext.util.MixedCollection(false,function(g){return g.name});for(var b=0,a=e.length;b<a;b++){d.fields.add(new Ext.data.Field(e[b]))}c.getField=function(g){return d.fields.get(g)};return c};Ext.data.Record.PREFIX="ext-record";Ext.data.Record.AUTO_ID=1;Ext.data.Record.EDIT="edit";Ext.data.Record.REJECT="reject";Ext.data.Record.COMMIT="commit";Ext.data.Record.id=function(a){a.phantom=true;return[Ext.data.Record.PREFIX,"-",Ext.data.Record.AUTO_ID++].join("")};Ext.data.Record.prototype={dirty:false,editing:false,error:null,modified:null,phantom:false,join:function(a){this.store=a},set:function(a,c){var b=Ext.isPrimitive(c)?String:Ext.encode;if(b(this.data[a])==b(c)){return}this.dirty=true;if(!this.modified){this.modified={}}if(this.modified[a]===undefined){this.modified[a]=this.data[a]}this.data[a]=c;if(!this.editing){this.afterEdit()}},afterEdit:function(){if(this.store!=undefined&&typeof this.store.afterEdit=="function"){this.store.afterEdit(this)}},afterReject:function(){if(this.store){this.store.afterReject(this)}},afterCommit:function(){if(this.store){this.store.afterCommit(this)}},get:function(a){return this.data[a]},beginEdit:function(){this.editing=true;this.modified=this.modified||{}},cancelEdit:function(){this.editing=false;delete this.modified},endEdit:function(){this.editing=false;if(this.dirty){this.afterEdit()}},reject:function(b){var a=this.modified;for(var c in a){if(typeof a[c]!="function"){this.data[c]=a[c]}}this.dirty=false;delete this.modified;this.editing=false;if(b!==true){this.afterReject()}},commit:function(a){this.dirty=false;delete this.modified;this.editing=false;if(a!==true){this.afterCommit()}},getChanges:function(){var a=this.modified,b={};for(var c in a){if(a.hasOwnProperty(c)){b[c]=this.data[c]}}return b},hasError:function(){return this.error!==null},clearError:function(){this.error=null},copy:function(a){return new this.constructor(Ext.apply({},this.data),a||this.id)},isModified:function(a){return !!(this.modified&&this.modified.hasOwnProperty(a))},isValid:function(){return this.fields.find(function(a){return(a.allowBlank===false&&Ext.isEmpty(this.data[a.name]))?true:false},this)?false:true},markDirty:function(){this.dirty=true;if(!this.modified){this.modified={}}this.fields.each(function(a){this.modified[a.name]=this.data[a.name]},this)}};Ext.StoreMgr=Ext.apply(new Ext.util.MixedCollection(),{register:function(){for(var a=0,b;(b=arguments[a]);a++){this.add(b)}},unregister:function(){for(var a=0,b;(b=arguments[a]);a++){this.remove(this.lookup(b))}},lookup:function(e){if(Ext.isArray(e)){var b=["field1"],d=!Ext.isArray(e[0]);if(!d){for(var c=2,a=e[0].length;c<=a;++c){b.push("field"+c)}}return new Ext.data.ArrayStore({fields:b,data:e,expandData:d,autoDestroy:true,autoCreated:true})}return Ext.isObject(e)?(e.events?e:Ext.create(e,"store")):this.get(e)},getKey:function(a){return a.storeId}});Ext.data.Store=Ext.extend(Ext.util.Observable,{writer:undefined,remoteSort:false,autoDestroy:false,pruneModifiedRecords:false,lastOptions:null,autoSave:true,batch:true,restful:false,paramNames:undefined,defaultParamNames:{start:"start",limit:"limit",sort:"sort",dir:"dir"},isDestroyed:false,hasMultiSort:false,batchKey:"_ext_batch_",constructor:function(a){this.data=new Ext.util.MixedCollection(false);this.data.getKey=function(b){return b.id};this.removed=[];if(a&&a.data){this.inlineData=a.data;delete a.data}Ext.apply(this,a);this.baseParams=Ext.isObject(this.baseParams)?this.baseParams:{};this.paramNames=Ext.applyIf(this.paramNames||{},this.defaultParamNames);if((this.url||this.api)&&!this.proxy){this.proxy=new Ext.data.HttpProxy({url:this.url,api:this.api})}if(this.restful===true&&this.proxy){this.batch=false;Ext.data.Api.restify(this.proxy)}if(this.reader){if(!this.recordType){this.recordType=this.reader.recordType}if(this.reader.onMetaChange){this.reader.onMetaChange=this.reader.onMetaChange.createSequence(this.onMetaChange,this)}if(this.writer){if(this.writer instanceof (Ext.data.DataWriter)===false){this.writer=this.buildWriter(this.writer)}this.writer.meta=this.reader.meta;this.pruneModifiedRecords=true}}if(this.recordType){this.fields=this.recordType.prototype.fields}this.modified=[];this.addEvents("datachanged","metachange","add","remove","update","clear","exception","beforeload","load","loadexception","beforewrite","write","beforesave","save");if(this.proxy){this.relayEvents(this.proxy,["loadexception","exception"])}if(this.writer){this.on({scope:this,add:this.createRecords,remove:this.destroyRecord,update:this.updateRecord,clear:this.onClear})}this.sortToggle={};if(this.sortField){this.setDefaultSort(this.sortField,this.sortDir)}else{if(this.sortInfo){this.setDefaultSort(this.sortInfo.field,this.sortInfo.direction)}}Ext.data.Store.superclass.constructor.call(this);if(this.id){this.storeId=this.id;delete this.id}if(this.storeId){Ext.StoreMgr.register(this)}if(this.inlineData){this.loadData(this.inlineData);delete this.inlineData}else{if(this.autoLoad){this.load.defer(10,this,[typeof this.autoLoad=="object"?this.autoLoad:undefined])}}this.batchCounter=0;this.batches={}},buildWriter:function(b){var a=undefined,c=(b.format||"json").toLowerCase();switch(c){case"json":a=Ext.data.JsonWriter;break;case"xml":a=Ext.data.XmlWriter;break;default:a=Ext.data.JsonWriter}return new a(b)},destroy:function(){if(!this.isDestroyed){if(this.storeId){Ext.StoreMgr.unregister(this)}this.clearData();this.data=null;Ext.destroy(this.proxy);this.reader=this.writer=null;this.purgeListeners();this.isDestroyed=true}},add:function(c){var e,a,b,d;c=[].concat(c);if(c.length<1){return}for(e=0,a=c.length;e<a;e++){b=c[e];b.join(this);if(b.dirty||b.phantom){this.modified.push(b)}}d=this.data.length;this.data.addAll(c);if(this.snapshot){this.snapshot.addAll(c)}this.fireEvent("add",this,c,d)},addSorted:function(a){var b=this.findInsertIndex(a);this.insert(b,a)},doUpdate:function(a){var b=a.id;this.getById(b).join(null);this.data.replace(b,a);if(this.snapshot){this.snapshot.replace(b,a)}a.join(this);this.fireEvent("update",this,a,Ext.data.Record.COMMIT)},remove:function(a){if(Ext.isArray(a)){Ext.each(a,function(c){this.remove(c)},this);return}var b=this.data.indexOf(a);if(b>-1){a.join(null);this.data.removeAt(b)}if(this.pruneModifiedRecords){this.modified.remove(a)}if(this.snapshot){this.snapshot.remove(a)}if(b>-1){this.fireEvent("remove",this,a,b)}},removeAt:function(a){this.remove(this.getAt(a))},removeAll:function(b){var a=[];this.each(function(c){a.push(c)});this.clearData();if(this.snapshot){this.snapshot.clear()}if(this.pruneModifiedRecords){this.modified=[]}if(b!==true){this.fireEvent("clear",this,a)}},onClear:function(b,a){Ext.each(a,function(d,c){this.destroyRecord(this,d,c)},this)},insert:function(d,c){var e,a,b;c=[].concat(c);for(e=0,a=c.length;e<a;e++){b=c[e];this.data.insert(d+e,b);b.join(this);if(b.dirty||b.phantom){this.modified.push(b)}}if(this.snapshot){this.snapshot.addAll(c)}this.fireEvent("add",this,c,d)},indexOf:function(a){return this.data.indexOf(a)},indexOfId:function(a){return this.data.indexOfKey(a)},getById:function(a){return(this.snapshot||this.data).key(a)},getAt:function(a){return this.data.itemAt(a)},getRange:function(b,a){return this.data.getRange(b,a)},storeOptions:function(a){a=Ext.apply({},a);delete a.callback;delete a.scope;this.lastOptions=a},clearData:function(){this.data.each(function(a){a.join(null)});this.data.clear()},load:function(b){b=Ext.apply({},b);this.storeOptions(b);if(this.sortInfo&&this.remoteSort){var a=this.paramNames;b.params=Ext.apply({},b.params);b.params[a.sort]=this.sortInfo.field;b.params[a.dir]=this.sortInfo.direction}try{return this.execute("read",null,b)}catch(c){this.handleException(c);return false}},updateRecord:function(b,a,c){if(c==Ext.data.Record.EDIT&&this.autoSave===true&&(!a.phantom||(a.phantom&&a.isValid()))){this.save()}},createRecords:function(c,b,e){var d=this.modified,h=b.length,a,g;for(g=0;g<h;g++){a=b[g];if(a.phantom&&a.isValid()){a.markDirty();if(d.indexOf(a)==-1){d.push(a)}}}if(this.autoSave===true){this.save()}},destroyRecord:function(b,a,c){if(this.modified.indexOf(a)!=-1){this.modified.remove(a)}if(!a.phantom){this.removed.push(a);a.lastIndex=c;if(this.autoSave===true){this.save()}}},execute:function(e,a,c,b){if(!Ext.data.Api.isAction(e)){throw new Ext.data.Api.Error("execute",e)}c=Ext.applyIf(c||{},{params:{}});if(b!==undefined){this.addToBatch(b)}var d=true;if(e==="read"){d=this.fireEvent("beforeload",this,c);Ext.applyIf(c.params,this.baseParams)}else{if(this.writer.listful===true&&this.restful!==true){a=(Ext.isArray(a))?a:[a]}else{if(Ext.isArray(a)&&a.length==1){a=a.shift()}}if((d=this.fireEvent("beforewrite",this,e,a,c))!==false){this.writer.apply(c.params,this.baseParams,e,a)}}if(d!==false){if(this.writer&&this.proxy.url&&!this.proxy.restful&&!Ext.data.Api.hasUniqueUrl(this.proxy,e)){c.params.xaction=e}this.proxy.request(Ext.data.Api.actions[e],a,c.params,this.reader,this.createCallback(e,a,b),this,c)}return d},save:function(){if(!this.writer){throw new Ext.data.Store.Error("writer-undefined")}var h=[],j,k,e,c={},d;if(this.removed.length){h.push(["destroy",this.removed])}var b=[].concat(this.getModifiedRecords());if(b.length){var g=[];for(d=b.length-1;d>=0;d--){if(b[d].phantom===true){var a=b.splice(d,1).shift();if(a.isValid()){g.push(a)}}else{if(!b[d].isValid()){b.splice(d,1)}}}if(g.length){h.push(["create",g])}if(b.length){h.push(["update",b])}}j=h.length;if(j){e=++this.batchCounter;for(d=0;d<j;++d){k=h[d];c[k[0]]=k[1]}if(this.fireEvent("beforesave",this,c)!==false){for(d=0;d<j;++d){k=h[d];this.doTransaction(k[0],k[1],e)}return e}}return -1},doTransaction:function(e,b,c){function g(h){try{this.execute(e,h,undefined,c)}catch(i){this.handleException(i)}}if(this.batch===false){for(var d=0,a=b.length;d<a;d++){g.call(this,b[d])}}else{g.call(this,b)}},addToBatch:function(c){var a=this.batches,d=this.batchKey+c,e=a[d];if(!e){a[d]=e={id:c,count:0,data:{}}}++e.count},removeFromBatch:function(d,h,g){var c=this.batches,e=this.batchKey+d,i=c[e],a;if(i){a=i.data[h]||[];i.data[h]=a.concat(g);if(i.count===1){g=i.data;delete c[e];this.fireEvent("save",this,d,g)}else{--i.count}}},createCallback:function(c,a,b){var d=Ext.data.Api.actions;return(c=="read")?this.loadRecords:function(g,e,h){this["on"+Ext.util.Format.capitalize(c)+"Records"](h,a,[].concat(g));if(h===true){this.fireEvent("write",this,c,g,e,a)}this.removeFromBatch(b,c,g)}},clearModified:function(a){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){this.modified.splice(this.modified.indexOf(a[b]),1)}}else{this.modified.splice(this.modified.indexOf(a),1)}},reMap:function(b){if(Ext.isArray(b)){for(var d=0,a=b.length;d<a;d++){this.reMap(b[d])}}else{delete this.data.map[b._phid];this.data.map[b.id]=b;var c=this.data.keys.indexOf(b._phid);this.data.keys.splice(c,1,b.id);delete b._phid}},onCreateRecords:function(d,a,b){if(d===true){try{this.reader.realize(a,b)}catch(c){this.handleException(c);if(Ext.isArray(a)){this.onCreateRecords(d,a,b)}}}},onUpdateRecords:function(d,a,b){if(d===true){try{this.reader.update(a,b)}catch(c){this.handleException(c);if(Ext.isArray(a)){this.onUpdateRecords(d,a,b)}}}},onDestroyRecords:function(e,b,d){b=(b instanceof Ext.data.Record)?[b]:[].concat(b);for(var c=0,a=b.length;c<a;c++){this.removed.splice(this.removed.indexOf(b[c]),1)}if(e===false){for(c=b.length-1;c>=0;c--){this.insert(b[c].lastIndex,b[c])}}},handleException:function(a){Ext.handleError(a)},reload:function(a){this.load(Ext.applyIf(a||{},this.lastOptions))},loadRecords:function(b,l,h){var e,g;if(this.isDestroyed===true){return}if(!b||h===false){if(h!==false){this.fireEvent("load",this,[],l)}if(l.callback){l.callback.call(l.scope||this,[],l,false,b)}return}var a=b.records,j=b.totalRecords||a.length;if(!l||l.add!==true){if(this.pruneModifiedRecords){this.modified=[]}for(e=0,g=a.length;e<g;e++){a[e].join(this)}if(this.snapshot){this.data=this.snapshot;delete this.snapshot}this.clearData();this.data.addAll(a);this.totalLength=j;this.applySort();this.fireEvent("datachanged",this)}else{var k=[],d,c=0;for(e=0,g=a.length;e<g;++e){d=a[e];if(this.indexOfId(d.id)>-1){this.doUpdate(d)}else{k.push(d);++c}}this.totalLength=Math.max(j,this.data.length+c);this.add(k)}this.fireEvent("load",this,a,l);if(l.callback){l.callback.call(l.scope||this,a,l,true)}},loadData:function(c,a){var b=this.reader.readRecords(c);this.loadRecords(b,{add:a},true)},getCount:function(){return this.data.length||0},getTotalCount:function(){return this.totalLength||0},getSortState:function(){return this.sortInfo},applySort:function(){if((this.sortInfo||this.multiSortInfo)&&!this.remoteSort){this.sortData()}},sortData:function(){var a=this.hasMultiSort?this.multiSortInfo:this.sortInfo,k=a.direction||"ASC",h=a.sorters,c=[];if(!this.hasMultiSort){h=[{direction:k,field:a.field}]}for(var d=0,b=h.length;d<b;d++){c.push(this.createSortFunction(h[d].field,h[d].direction))}if(c.length==0){return}var g=k.toUpperCase()=="DESC"?-1:1;var e=function(n,m){var l=c[0].call(this,n,m);if(c.length>1){for(var p=1,o=c.length;p<o;p++){l=l||c[p].call(this,n,m)}}return g*l};this.data.sort(k,e);if(this.snapshot&&this.snapshot!=this.data){this.snapshot.sort(k,e)}},createSortFunction:function(c,b){b=b||"ASC";var a=b.toUpperCase()=="DESC"?-1:1;var d=this.fields.get(c).sortType;return function(g,e){var i=d(g.data[c]),h=d(e.data[c]);return a*(i>h?1:(i<h?-1:0))}},setDefaultSort:function(b,a){a=a?a.toUpperCase():"ASC";this.sortInfo={field:b,direction:a};this.sortToggle[b]=a},sort:function(b,a){if(Ext.isArray(arguments[0])){return this.multiSort.call(this,b,a)}else{return this.singleSort(b,a)}},singleSort:function(g,c){var e=this.fields.get(g);if(!e){return false}var b=e.name,a=this.sortInfo||null,d=this.sortToggle?this.sortToggle[b]:null;if(!c){if(a&&a.field==b){c=(this.sortToggle[b]||"ASC").toggle("ASC","DESC")}else{c=e.sortDir}}this.sortToggle[b]=c;this.sortInfo={field:b,direction:c};this.hasMultiSort=false;if(this.remoteSort){if(!this.load(this.lastOptions)){if(d){this.sortToggle[b]=d}if(a){this.sortInfo=a}}}else{this.applySort();this.fireEvent("datachanged",this)}return true},multiSort:function(b,a){this.hasMultiSort=true;a=a||"ASC";if(this.multiSortInfo&&a==this.multiSortInfo.direction){a=a.toggle("ASC","DESC")}this.multiSortInfo={sorters:b,direction:a};if(this.remoteSort){this.singleSort(b[0].field,b[0].direction)}else{this.applySort();this.fireEvent("datachanged",this)}},each:function(b,a){this.data.each(b,a)},getModifiedRecords:function(){return this.modified},sum:function(e,g,a){var c=this.data.items,b=0;g=g||0;a=(a||a===0)?a:c.length-1;for(var d=g;d<=a;d++){b+=(c[d].data[e]||0)}return b},createFilterFn:function(d,c,e,a,b){if(Ext.isEmpty(c,false)){return false}c=this.data.createValueMatcher(c,e,a,b);return function(g){return c.test(g.data[d])}},createMultipleFilterFn:function(a){return function(b){var k=true;for(var d=0,c=a.length;d<c;d++){var h=a[d],g=h.fn,e=h.scope;k=k&&g.call(e,b)}return k}},filter:function(n,m,h,k,e){var l;if(Ext.isObject(n)){n=[n]}if(Ext.isArray(n)){var b=[];for(var g=0,d=n.length;g<d;g++){var a=n[g],c=a.fn,o=a.scope||this;if(!Ext.isFunction(c)){c=this.createFilterFn(a.property,a.value,a.anyMatch,a.caseSensitive,a.exactMatch)}b.push({fn:c,scope:o})}l=this.createMultipleFilterFn(b)}else{l=this.createFilterFn(n,m,h,k,e)}return l?this.filterBy(l):this.clearFilter()},filterBy:function(b,a){this.snapshot=this.snapshot||this.data;this.data=this.queryBy(b,a||this);this.fireEvent("datachanged",this)},clearFilter:function(a){if(this.isFiltered()){this.data=this.snapshot;delete this.snapshot;if(a!==true){this.fireEvent("datachanged",this)}}},isFiltered:function(){return !!this.snapshot&&this.snapshot!=this.data},query:function(d,c,e,a){var b=this.createFilterFn(d,c,e,a);return b?this.queryBy(b):this.data.clone()},queryBy:function(b,a){var c=this.snapshot||this.data;return c.filterBy(b,a||this)},find:function(d,c,g,e,a){var b=this.createFilterFn(d,c,e,a);return b?this.data.findIndexBy(b,null,g):-1},findExact:function(b,a,c){return this.data.findIndexBy(function(d){return d.get(b)===a},this,c)},findBy:function(b,a,c){return this.data.findIndexBy(b,a,c)},collect:function(j,k,b){var h=(b===true&&this.snapshot)?this.snapshot.items:this.data.items;var m,n,a=[],c={};for(var e=0,g=h.length;e<g;e++){m=h[e].data[j];n=String(m);if((k||!Ext.isEmpty(m))&&!c[n]){c[n]=true;a[a.length]=m}}return a},afterEdit:function(a){if(this.modified.indexOf(a)==-1){this.modified.push(a)}this.fireEvent("update",this,a,Ext.data.Record.EDIT)},afterReject:function(a){this.modified.remove(a);this.fireEvent("update",this,a,Ext.data.Record.REJECT)},afterCommit:function(a){this.modified.remove(a);this.fireEvent("update",this,a,Ext.data.Record.COMMIT)},commitChanges:function(){var a=this.modified.slice(0),c=a.length,b;for(b=0;b<c;b++){a[b].commit()}this.modified=[];this.removed=[]},rejectChanges:function(){var a=this.modified.slice(0),e=this.removed.slice(0).reverse(),c=a.length,d=e.length,b;for(b=0;b<c;b++){a[b].reject()}for(b=0;b<d;b++){this.insert(e[b].lastIndex||0,e[b]);e[b].reject()}this.modified=[];this.removed=[]},onMetaChange:function(a){this.recordType=this.reader.recordType;this.fields=this.recordType.prototype.fields;delete this.snapshot;if(this.reader.meta.sortInfo){this.sortInfo=this.reader.meta.sortInfo}else{if(this.sortInfo&&!this.fields.get(this.sortInfo.field)){delete this.sortInfo}}if(this.writer){this.writer.meta=this.reader.meta}this.modified=[];this.fireEvent("metachange",this,this.reader.meta)},findInsertIndex:function(a){this.suspendEvents();var c=this.data.clone();this.data.add(a);this.applySort();var b=this.data.indexOf(a);this.data=c;this.resumeEvents();return b},setBaseParam:function(a,b){this.baseParams=this.baseParams||{};this.baseParams[a]=b}});Ext.reg("store",Ext.data.Store);Ext.data.Store.Error=Ext.extend(Ext.Error,{name:"Ext.data.Store"});Ext.apply(Ext.data.Store.Error.prototype,{lang:{"writer-undefined":"Attempted to execute a write-action without a DataWriter installed."}});Ext.data.Field=Ext.extend(Object,{constructor:function(b){if(Ext.isString(b)){b={name:b}}Ext.apply(this,b);var d=Ext.data.Types,a=this.sortType,c;if(this.type){if(Ext.isString(this.type)){this.type=Ext.data.Types[this.type.toUpperCase()]||d.AUTO}}else{this.type=d.AUTO}if(Ext.isString(a)){this.sortType=Ext.data.SortTypes[a]}else{if(Ext.isEmpty(a)){this.sortType=this.type.sortType}}if(!this.convert){this.convert=this.type.convert}},dateFormat:null,useNull:false,defaultValue:"",mapping:null,sortType:null,sortDir:"ASC",allowBlank:true});Ext.data.DataReader=function(a,b){this.meta=a;this.recordType=Ext.isArray(b)?Ext.data.Record.create(b):b;if(this.recordType){this.buildExtractors()}};Ext.data.DataReader.prototype={getTotal:Ext.emptyFn,getRoot:Ext.emptyFn,getMessage:Ext.emptyFn,getSuccess:Ext.emptyFn,getId:Ext.emptyFn,buildExtractors:Ext.emptyFn,extractValues:Ext.emptyFn,realize:function(a,c){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){if(Ext.isArray(c)){this.realize(a.splice(b,1).shift(),c.splice(b,1).shift())}else{this.realize(a.splice(b,1).shift(),c)}}}else{if(Ext.isArray(c)&&c.length==1){c=c.shift()}if(!this.isData(c)){throw new Ext.data.DataReader.Error("realize",a)}a.phantom=false;a._phid=a.id;a.id=this.getId(c);a.data=c;a.commit();a.store.reMap(a)}},update:function(a,c){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){if(Ext.isArray(c)){this.update(a.splice(b,1).shift(),c.splice(b,1).shift())}else{this.update(a.splice(b,1).shift(),c)}}}else{if(Ext.isArray(c)&&c.length==1){c=c.shift()}if(this.isData(c)){a.data=Ext.apply(a.data,c)}a.commit()}},extractData:function(k,a){var j=(this instanceof Ext.data.JsonReader)?"json":"node";var c=[];if(this.isData(k)&&!(this instanceof Ext.data.XmlReader)){k=[k]}var h=this.recordType.prototype.fields,o=h.items,m=h.length,c=[];if(a===true){var l=this.recordType;for(var e=0;e<k.length;e++){var b=k[e];var g=new l(this.extractValues(b,o,m),this.getId(b));g[j]=b;c.push(g)}}else{for(var e=0;e<k.length;e++){var d=this.extractValues(k[e],o,m);d[this.meta.idProperty]=this.getId(k[e]);c.push(d)}}return c},isData:function(a){return(a&&Ext.isObject(a)&&!Ext.isEmpty(this.getId(a)))?true:false},onMetaChange:function(a){delete this.ef;this.meta=a;this.recordType=Ext.data.Record.create(a.fields);this.buildExtractors()}};Ext.data.DataReader.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.DataReader"});Ext.apply(Ext.data.DataReader.Error.prototype,{lang:{update:"#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",realize:"#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.","invalid-response":"#readResponse received an invalid response from the server."}});Ext.data.DataWriter=function(a){Ext.apply(this,a)};Ext.data.DataWriter.prototype={writeAllFields:false,listful:false,apply:function(e,g,d,a){var c=[],b=d+"Record";if(Ext.isArray(a)){Ext.each(a,function(h){c.push(this[b](h))},this)}else{if(a instanceof Ext.data.Record){c=this[b](a)}}this.render(e,g,c)},render:Ext.emptyFn,updateRecord:Ext.emptyFn,createRecord:Ext.emptyFn,destroyRecord:Ext.emptyFn,toHash:function(g,c){var e=g.fields.map,d={},b=(this.writeAllFields===false&&g.phantom===false)?g.getChanges():g.data,a;Ext.iterate(b,function(i,h){if((a=e[i])){d[a.mapping?a.mapping:a.name]=h}});if(g.phantom){if(g.fields.containsKey(this.meta.idProperty)&&Ext.isEmpty(g.data[this.meta.idProperty])){delete d[this.meta.idProperty]}}else{d[this.meta.idProperty]=g.id}return d},toArray:function(b){var a=[];Ext.iterate(b,function(d,c){a.push({name:d,value:c})},this);return a}};Ext.data.DataProxy=function(a){a=a||{};this.api=a.api;this.url=a.url;this.restful=a.restful;this.listeners=a.listeners;this.prettyUrls=a.prettyUrls;this.addEvents("exception","beforeload","load","loadexception","beforewrite","write");Ext.data.DataProxy.superclass.constructor.call(this);try{Ext.data.Api.prepare(this)}catch(b){if(b instanceof Ext.data.Api.Error){b.toConsole()}}Ext.data.DataProxy.relayEvents(this,["beforewrite","write","exception"])};Ext.extend(Ext.data.DataProxy,Ext.util.Observable,{restful:false,setApi:function(){if(arguments.length==1){var a=Ext.data.Api.isValid(arguments[0]);if(a===true){this.api=arguments[0]}else{throw new Ext.data.Api.Error("invalid",a)}}else{if(arguments.length==2){if(!Ext.data.Api.isAction(arguments[0])){throw new Ext.data.Api.Error("invalid",arguments[0])}this.api[arguments[0]]=arguments[1]}}Ext.data.Api.prepare(this)},isApiAction:function(a){return(this.api[a])?true:false},request:function(e,b,g,a,h,d,c){if(!this.api[e]&&!this.load){throw new Ext.data.DataProxy.Error("action-undefined",e)}g=g||{};if((e===Ext.data.Api.actions.read)?this.fireEvent("beforeload",this,g):this.fireEvent("beforewrite",this,e,b,g)!==false){this.doRequest.apply(this,arguments)}else{h.call(d||this,null,c,false)}},load:null,doRequest:function(e,b,g,a,h,d,c){this.load(g,a,h,d,c)},onRead:Ext.emptyFn,onWrite:Ext.emptyFn,buildUrl:function(d,b){b=b||null;var c=(this.conn&&this.conn.url)?this.conn.url:(this.api[d])?this.api[d].url:this.url;if(!c){throw new Ext.data.Api.Error("invalid-url",d)}var e=null;var a=c.match(/(.*)(\.json|\.xml|\.html)$/);if(a){e=a[2];c=a[1]}if((this.restful===true||this.prettyUrls===true)&&b instanceof Ext.data.Record&&!b.phantom){c+="/"+b.id}return(e===null)?c:c+e},destroy:function(){this.purgeListeners()}});Ext.apply(Ext.data.DataProxy,Ext.util.Observable.prototype);Ext.util.Observable.call(Ext.data.DataProxy);Ext.data.DataProxy.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.DataProxy"});Ext.apply(Ext.data.DataProxy.Error.prototype,{lang:{"action-undefined":"DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.","api-invalid":"Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions."}});Ext.data.Request=function(a){Ext.apply(this,a)};Ext.data.Request.prototype={action:undefined,rs:undefined,params:undefined,callback:Ext.emptyFn,scope:undefined,reader:undefined};Ext.data.Response=function(a){Ext.apply(this,a)};Ext.data.Response.prototype={action:undefined,success:undefined,message:undefined,data:undefined,raw:undefined,records:undefined};Ext.data.ScriptTagProxy=function(a){Ext.apply(this,a);Ext.data.ScriptTagProxy.superclass.constructor.call(this,a);this.head=document.getElementsByTagName("head")[0]};Ext.data.ScriptTagProxy.TRANS_ID=1000;Ext.extend(Ext.data.ScriptTagProxy,Ext.data.DataProxy,{timeout:30000,callbackParam:"callback",nocache:true,doRequest:function(e,g,d,h,j,k,l){var c=Ext.urlEncode(Ext.apply(d,this.extraParams));var b=this.buildUrl(e,g);if(!b){throw new Ext.data.Api.Error("invalid-url",b)}b=Ext.urlAppend(b,c);if(this.nocache){b=Ext.urlAppend(b,"_dc="+(new Date().getTime()))}var a=++Ext.data.ScriptTagProxy.TRANS_ID;var m={id:a,action:e,cb:"stcCallback"+a,scriptId:"stcScript"+a,params:d,arg:l,url:b,callback:j,scope:k,reader:h};window[m.cb]=this.createCallback(e,g,m);b+=String.format("&{0}={1}",this.callbackParam,m.cb);if(this.autoAbort!==false){this.abort()}m.timeoutId=this.handleFailure.defer(this.timeout,this,[m]);var i=document.createElement("script");i.setAttribute("src",b);i.setAttribute("type","text/javascript");i.setAttribute("id",m.scriptId);this.head.appendChild(i);this.trans=m},createCallback:function(d,b,c){var a=this;return function(e){a.trans=false;a.destroyTrans(c,true);if(d===Ext.data.Api.actions.read){a.onRead.call(a,d,c,e)}else{a.onWrite.call(a,d,c,e,b)}}},onRead:function(d,c,b){var a;try{a=c.reader.readRecords(b)}catch(g){this.fireEvent("loadexception",this,c,b,g);this.fireEvent("exception",this,"response",d,c,b,g);c.callback.call(c.scope||window,null,c.arg,false);return}if(a.success===false){this.fireEvent("loadexception",this,c,b);this.fireEvent("exception",this,"remote",d,c,b,null)}else{this.fireEvent("load",this,b,c.arg)}c.callback.call(c.scope||window,a,c.arg,a.success)},onWrite:function(h,g,c,b){var a=g.reader;try{var d=a.readResponse(h,c)}catch(i){this.fireEvent("exception",this,"response",h,g,d,i);g.callback.call(g.scope||window,null,d,false);return}if(!d.success===true){this.fireEvent("exception",this,"remote",h,g,d,b);g.callback.call(g.scope||window,null,d,false);return}this.fireEvent("write",this,h,d.data,d,b,g.arg);g.callback.call(g.scope||window,d.data,d,true)},isLoading:function(){return this.trans?true:false},abort:function(){if(this.isLoading()){this.destroyTrans(this.trans)}},destroyTrans:function(b,a){this.head.removeChild(document.getElementById(b.scriptId));clearTimeout(b.timeoutId);if(a){window[b.cb]=undefined;try{delete window[b.cb]}catch(c){}}else{window[b.cb]=function(){window[b.cb]=undefined;try{delete window[b.cb]}catch(d){}}}},handleFailure:function(a){this.trans=false;this.destroyTrans(a,false);if(a.action===Ext.data.Api.actions.read){this.fireEvent("loadexception",this,null,a.arg)}this.fireEvent("exception",this,"response",a.action,{response:null,options:a.arg});a.callback.call(a.scope||window,null,a.arg,false)},destroy:function(){this.abort();Ext.data.ScriptTagProxy.superclass.destroy.call(this)}});Ext.data.HttpProxy=function(a){Ext.data.HttpProxy.superclass.constructor.call(this,a);this.conn=a;this.conn.url=null;this.useAjax=!a||!a.events;var c=Ext.data.Api.actions;this.activeRequest={};for(var b in c){this.activeRequest[c[b]]=undefined}};Ext.extend(Ext.data.HttpProxy,Ext.data.DataProxy,{getConnection:function(){return this.useAjax?Ext.Ajax:this.conn},setUrl:function(a,b){this.conn.url=a;if(b===true){this.url=a;this.api=null;Ext.data.Api.prepare(this)}},doRequest:function(g,d,i,c,b,e,a){var h={method:(this.api[g])?this.api[g]["method"]:undefined,request:{callback:b,scope:e,arg:a},reader:c,callback:this.createCallback(g,d),scope:this};if(i.jsonData){h.jsonData=i.jsonData}else{if(i.xmlData){h.xmlData=i.xmlData}else{h.params=i||{}}}this.conn.url=this.buildUrl(g,d);if(this.useAjax){Ext.applyIf(h,this.conn);if(this.activeRequest[g]){}this.activeRequest[g]=Ext.Ajax.request(h)}else{this.conn.request(h)}this.conn.url=null},createCallback:function(b,a){return function(e,d,c){this.activeRequest[b]=undefined;if(!d){if(b===Ext.data.Api.actions.read){this.fireEvent("loadexception",this,e,c)}this.fireEvent("exception",this,"response",b,e,c);e.request.callback.call(e.request.scope,null,e.request.arg,false);return}if(b===Ext.data.Api.actions.read){this.onRead(b,e,c)}else{this.onWrite(b,e,c,a)}}},onRead:function(d,h,b){var a;try{a=h.reader.read(b)}catch(g){this.fireEvent("loadexception",this,h,b,g);this.fireEvent("exception",this,"response",d,h,b,g);h.request.callback.call(h.request.scope,null,h.request.arg,false);return}if(a.success===false){this.fireEvent("loadexception",this,h,b);var c=h.reader.readResponse(d,b);this.fireEvent("exception",this,"remote",d,h,c,null)}else{this.fireEvent("load",this,h,h.request.arg)}h.request.callback.call(h.request.scope,a,h.request.arg,a.success)},onWrite:function(g,i,c,b){var a=i.reader;var d;try{d=a.readResponse(g,c)}catch(h){this.fireEvent("exception",this,"response",g,i,c,h);i.request.callback.call(i.request.scope,null,i.request.arg,false);return}if(d.success===true){this.fireEvent("write",this,g,d.data,d,b,i.request.arg)}else{this.fireEvent("exception",this,"remote",g,i,d,b)}i.request.callback.call(i.request.scope,d.data,d,d.success)},destroy:function(){if(!this.useAjax){this.conn.abort()}else{if(this.activeRequest){var b=Ext.data.Api.actions;for(var a in b){if(this.activeRequest[b[a]]){Ext.Ajax.abort(this.activeRequest[b[a]])}}}}Ext.data.HttpProxy.superclass.destroy.call(this)}});Ext.data.MemoryProxy=function(b){var a={};a[Ext.data.Api.actions.read]=true;Ext.data.MemoryProxy.superclass.constructor.call(this,{api:a});this.data=b};Ext.extend(Ext.data.MemoryProxy,Ext.data.DataProxy,{doRequest:function(b,c,a,d,h,i,j){a=a||{};var k;try{k=d.readRecords(this.data)}catch(g){this.fireEvent("loadexception",this,null,j,g);this.fireEvent("exception",this,"response",b,j,null,g);h.call(i,null,j,false);return}h.call(i,k,j,true)}});Ext.data.Types=new function(){var a=Ext.data.SortTypes;Ext.apply(this,{stripRe:/[\$,%]/g,AUTO:{convert:function(b){return b},sortType:a.none,type:"auto"},STRING:{convert:function(b){return(b===undefined||b===null)?"":String(b)},sortType:a.asUCString,type:"string"},INT:{convert:function(b){return b!==undefined&&b!==null&&b!==""?parseInt(String(b).replace(Ext.data.Types.stripRe,""),10):(this.useNull?null:0)},sortType:a.none,type:"int"},FLOAT:{convert:function(b){return b!==undefined&&b!==null&&b!==""?parseFloat(String(b).replace(Ext.data.Types.stripRe,""),10):(this.useNull?null:0)},sortType:a.none,type:"float"},BOOL:{convert:function(b){return b===true||b==="true"||b==1},sortType:a.none,type:"bool"},DATE:{convert:function(c){var d=this.dateFormat;if(!c){return null}if(Ext.isDate(c)){return c}if(d){if(d=="timestamp"){return new Date(c*1000)}if(d=="time"){return new Date(parseInt(c,10))}return Date.parseDate(c,d)}var b=Date.parse(c);return b?new Date(b):null},sortType:a.asDate,type:"date"}});Ext.apply(this,{BOOLEAN:this.BOOL,INTEGER:this.INT,NUMBER:this.FLOAT})};Ext.data.JsonWriter=Ext.extend(Ext.data.DataWriter,{encode:true,encodeDelete:false,constructor:function(a){Ext.data.JsonWriter.superclass.constructor.call(this,a)},render:function(c,d,b){if(this.encode===true){Ext.apply(c,d);c[this.meta.root]=Ext.encode(b)}else{var a=Ext.apply({},d);a[this.meta.root]=b;c.jsonData=a}},createRecord:function(a){return this.toHash(a)},updateRecord:function(a){return this.toHash(a)},destroyRecord:function(b){if(this.encodeDelete){var a={};a[this.meta.idProperty]=b.id;return a}else{return b.id}}});Ext.data.JsonReader=function(a,b){a=a||{};Ext.applyIf(a,{idProperty:"id",successProperty:"success",totalProperty:"total"});Ext.data.JsonReader.superclass.constructor.call(this,a,b||a.fields)};Ext.extend(Ext.data.JsonReader,Ext.data.DataReader,{read:function(a){var b=a.responseText;var c=Ext.decode(b);if(!c){throw {message:"JsonReader.read: Json object not found"}}return this.readRecords(c)},readResponse:function(e,b){var h=(b.responseText!==undefined)?Ext.decode(b.responseText):b;if(!h){throw new Ext.data.JsonReader.Error("response")}var a=this.getRoot(h),g=this.getSuccess(h);if(g&&e===Ext.data.Api.actions.create){var d=Ext.isDefined(a);if(d&&Ext.isEmpty(a)){throw new Ext.data.JsonReader.Error("root-empty",this.meta.root)}else{if(!d){throw new Ext.data.JsonReader.Error("root-undefined-response",this.meta.root)}}}var c=new Ext.data.Response({action:e,success:g,data:(a)?this.extractData(a,false):[],message:this.getMessage(h),raw:h});if(Ext.isEmpty(c.success)){throw new Ext.data.JsonReader.Error("successProperty-response",this.meta.successProperty)}return c},readRecords:function(a){this.jsonData=a;if(a.metaData){this.onMetaChange(a.metaData)}var m=this.meta,h=this.recordType,b=h.prototype.fields,l=b.items,i=b.length,j;var g=this.getRoot(a),e=g.length,d=e,k=true;if(m.totalProperty){j=parseInt(this.getTotal(a),10);if(!isNaN(j)){d=j}}if(m.successProperty){j=this.getSuccess(a);if(j===false||j==="false"){k=false}}return{success:k,records:this.extractData(g,true),totalRecords:d}},buildExtractors:function(){if(this.ef){return}var l=this.meta,h=this.recordType,e=h.prototype.fields,k=e.items,j=e.length;if(l.totalProperty){this.getTotal=this.createAccessor(l.totalProperty)}if(l.successProperty){this.getSuccess=this.createAccessor(l.successProperty)}if(l.messageProperty){this.getMessage=this.createAccessor(l.messageProperty)}this.getRoot=l.root?this.createAccessor(l.root):function(g){return g};if(l.id||l.idProperty){var d=this.createAccessor(l.id||l.idProperty);this.getId=function(i){var g=d(i);return(g===undefined||g==="")?null:g}}else{this.getId=function(){return null}}var c=[];for(var b=0;b<j;b++){e=k[b];var a=(e.mapping!==undefined&&e.mapping!==null)?e.mapping:e.name;c.push(this.createAccessor(a))}this.ef=c},simpleAccess:function(b,a){return b[a]},createAccessor:function(){var a=/[\[\.]/;return function(c){if(Ext.isEmpty(c)){return Ext.emptyFn}if(Ext.isFunction(c)){return c}var b=String(c).search(a);if(b>=0){return new Function("obj","return obj"+(b>0?".":"")+c)}return function(d){return d[c]}}}(),extractValues:function(h,d,a){var g,c={};for(var e=0;e<a;e++){g=d[e];var b=this.ef[e](h);c[g.name]=g.convert((b!==undefined)?b:g.defaultValue,h)}return c}});Ext.data.JsonReader.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.JsonReader"});Ext.apply(Ext.data.JsonReader.Error.prototype,{lang:{response:"An error occurred while json-decoding your server response","successProperty-response":'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',"root-undefined-config":'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',"idProperty-undefined":'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',"root-empty":'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'}});Ext.data.ArrayReader=Ext.extend(Ext.data.JsonReader,{readRecords:function(r){this.arrayData=r;var l=this.meta,d=l?Ext.num(l.idIndex,l.id):null,b=this.recordType,q=b.prototype.fields,z=[],e=true,g;var u=this.getRoot(r);for(var y=0,A=u.length;y<A;y++){var t=u[y],a={},p=((d||d===0)&&t[d]!==undefined&&t[d]!==""?t[d]:null);for(var x=0,m=q.length;x<m;x++){var B=q.items[x],w=B.mapping!==undefined&&B.mapping!==null?B.mapping:x;g=t[w]!==undefined?t[w]:B.defaultValue;g=B.convert(g,t);a[B.name]=g}var c=new b(a,p);c.json=t;z[z.length]=c}var h=z.length;if(l.totalProperty){g=parseInt(this.getTotal(r),10);if(!isNaN(g)){h=g}}if(l.successProperty){g=this.getSuccess(r);if(g===false||g==="false"){e=false}}return{success:e,records:z,totalRecords:h}}});Ext.data.ArrayStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.ArrayStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.ArrayReader(a)}))},loadData:function(e,b){if(this.expandData===true){var d=[];for(var c=0,a=e.length;c<a;c++){d[d.length]=[e[c]]}e=d}Ext.data.ArrayStore.superclass.loadData.call(this,e,b)}});Ext.reg("arraystore",Ext.data.ArrayStore);Ext.data.SimpleStore=Ext.data.ArrayStore;Ext.reg("simplestore",Ext.data.SimpleStore);Ext.data.JsonStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.JsonStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.JsonReader(a)}))}});Ext.reg("jsonstore",Ext.data.JsonStore);Ext.data.XmlWriter=function(a){Ext.data.XmlWriter.superclass.constructor.apply(this,arguments);this.tpl=(typeof(this.tpl)==="string")?new Ext.XTemplate(this.tpl).compile():this.tpl.compile()};Ext.extend(Ext.data.XmlWriter,Ext.data.DataWriter,{documentRoot:"xrequest",forceDocumentRoot:false,root:"records",xmlVersion:"1.0",xmlEncoding:"ISO-8859-15",tpl:'<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',render:function(b,c,a){c=this.toArray(c);b.xmlData=this.tpl.applyTemplate({version:this.xmlVersion,encoding:this.xmlEncoding,documentRoot:(c.length>0||this.forceDocumentRoot===true)?this.documentRoot:false,record:this.meta.record,root:this.root,baseParams:c,records:(Ext.isArray(a[0]))?a:[a]})},createRecord:function(a){return this.toArray(this.toHash(a))},updateRecord:function(a){return this.toArray(this.toHash(a))},destroyRecord:function(b){var a={};a[this.meta.idProperty]=b.id;return this.toArray(a)}});Ext.data.XmlReader=function(a,b){a=a||{};Ext.applyIf(a,{idProperty:a.idProperty||a.idPath||a.id,successProperty:a.successProperty||a.success});Ext.data.XmlReader.superclass.constructor.call(this,a,b||a.fields)};Ext.extend(Ext.data.XmlReader,Ext.data.DataReader,{read:function(a){var b=a.responseXML;if(!b){throw {message:"XmlReader.read: XML Document not available"}}return this.readRecords(b)},readRecords:function(d){this.xmlData=d;var a=d.documentElement||d,c=Ext.DomQuery,g=0,e=true;if(this.meta.totalProperty){g=this.getTotal(a,0)}if(this.meta.successProperty){e=this.getSuccess(a)}var b=this.extractData(c.select(this.meta.record,a),true);return{success:e,records:b,totalRecords:g||b.length}},readResponse:function(g,b){var e=Ext.DomQuery,h=b.responseXML,a=h.documentElement||h;var c=new Ext.data.Response({action:g,success:this.getSuccess(a),message:this.getMessage(a),data:this.extractData(e.select(this.meta.record,a)||e.select(this.meta.root,a),false),raw:h});if(Ext.isEmpty(c.success)){throw new Ext.data.DataReader.Error("successProperty-response",this.meta.successProperty)}if(g===Ext.data.Api.actions.create){var d=Ext.isDefined(c.data);if(d&&Ext.isEmpty(c.data)){throw new Ext.data.JsonReader.Error("root-empty",this.meta.root)}else{if(!d){throw new Ext.data.JsonReader.Error("root-undefined-response",this.meta.root)}}}return c},getSuccess:function(){return true},buildExtractors:function(){if(this.ef){return}var l=this.meta,h=this.recordType,e=h.prototype.fields,k=e.items,j=e.length;if(l.totalProperty){this.getTotal=this.createAccessor(l.totalProperty)}if(l.successProperty){this.getSuccess=this.createAccessor(l.successProperty)}if(l.messageProperty){this.getMessage=this.createAccessor(l.messageProperty)}this.getRoot=function(g){return(!Ext.isEmpty(g[this.meta.record]))?g[this.meta.record]:g[this.meta.root]};if(l.idPath||l.idProperty){var d=this.createAccessor(l.idPath||l.idProperty);this.getId=function(g){var i=d(g)||g.id;return(i===undefined||i==="")?null:i}}else{this.getId=function(){return null}}var c=[];for(var b=0;b<j;b++){e=k[b];var a=(e.mapping!==undefined&&e.mapping!==null)?e.mapping:e.name;c.push(this.createAccessor(a))}this.ef=c},createAccessor:function(){var a=Ext.DomQuery;return function(b){if(Ext.isFunction(b)){return b}switch(b){case this.meta.totalProperty:return function(c,d){return a.selectNumber(b,c,d)};break;case this.meta.successProperty:return function(d,e){var c=a.selectValue(b,d,true);var g=c!==false&&c!=="false";return g};break;default:return function(c,d){return a.selectValue(b,c,d)};break}}}(),extractValues:function(h,d,a){var g,c={};for(var e=0;e<a;e++){g=d[e];var b=this.ef[e](h);c[g.name]=g.convert((b!==undefined)?b:g.defaultValue,h)}return c}});Ext.data.XmlStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.XmlStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.XmlReader(a)}))}});Ext.reg("xmlstore",Ext.data.XmlStore);Ext.data.GroupingStore=Ext.extend(Ext.data.Store,{constructor:function(d){d=d||{};this.hasMultiSort=true;this.multiSortInfo=this.multiSortInfo||{sorters:[]};var e=this.multiSortInfo.sorters,c=d.groupField||this.groupField,b=d.sortInfo||this.sortInfo,a=d.groupDir||this.groupDir;if(c){e.push({field:c,direction:a})}if(b){e.push(b)}Ext.data.GroupingStore.superclass.constructor.call(this,d);this.addEvents("groupchange");this.applyGroupField()},remoteGroup:false,groupOnSort:false,groupDir:"ASC",clearGrouping:function(){this.groupField=false;if(this.remoteGroup){if(this.baseParams){delete this.baseParams.groupBy;delete this.baseParams.groupDir}var a=this.lastOptions;if(a&&a.params){delete a.params.groupBy;delete a.params.groupDir}this.reload()}else{this.sort();this.fireEvent("datachanged",this)}},groupBy:function(e,a,d){d=d?(String(d).toUpperCase()=="DESC"?"DESC":"ASC"):this.groupDir;if(this.groupField==e&&this.groupDir==d&&!a){return}var c=this.multiSortInfo.sorters;if(c.length>0&&c[0].field==this.groupField){c.shift()}this.groupField=e;this.groupDir=d;this.applyGroupField();var b=function(){this.fireEvent("groupchange",this,this.getGroupState())};if(this.groupOnSort){this.sort(e,d);b.call(this);return}if(this.remoteGroup){this.on("load",b,this,{single:true});this.reload()}else{this.sort(c);b.call(this)}},sort:function(h,c){if(this.remoteSort){return Ext.data.GroupingStore.superclass.sort.call(this,h,c)}var g=[];if(Ext.isArray(arguments[0])){g=arguments[0]}else{if(h==undefined){g=this.sortInfo?[this.sortInfo]:[]}else{var e=this.fields.get(h);if(!e){return false}var b=e.name,a=this.sortInfo||null,d=this.sortToggle?this.sortToggle[b]:null;if(!c){if(a&&a.field==b){c=(this.sortToggle[b]||"ASC").toggle("ASC","DESC")}else{c=e.sortDir}}this.sortToggle[b]=c;this.sortInfo={field:b,direction:c};g=[this.sortInfo]}}if(this.groupField){g.unshift({direction:this.groupDir,field:this.groupField})}return this.multiSort.call(this,g,c)},applyGroupField:function(){if(this.remoteGroup){if(!this.baseParams){this.baseParams={}}Ext.apply(this.baseParams,{groupBy:this.groupField,groupDir:this.groupDir});var a=this.lastOptions;if(a&&a.params){a.params.groupDir=this.groupDir;delete a.params.groupBy}}},applyGrouping:function(a){if(this.groupField!==false){this.groupBy(this.groupField,true,this.groupDir);return true}else{if(a===true){this.fireEvent("datachanged",this)}return false}},getGroupState:function(){return this.groupOnSort&&this.groupField!==false?(this.sortInfo?this.sortInfo.field:undefined):this.groupField}});Ext.reg("groupingstore",Ext.data.GroupingStore);Ext.data.DirectProxy=function(a){Ext.apply(this,a);if(typeof this.paramOrder=="string"){this.paramOrder=this.paramOrder.split(/[\s,|]/)}Ext.data.DirectProxy.superclass.constructor.call(this,a)};Ext.extend(Ext.data.DirectProxy,Ext.data.DataProxy,{paramOrder:undefined,paramsAsHash:true,directFn:undefined,doRequest:function(b,c,a,e,k,l,n){var j=[],h=this.api[b]||this.directFn;switch(b){case Ext.data.Api.actions.create:j.push(a.jsonData);break;case Ext.data.Api.actions.read:if(h.directCfg.method.len>0){if(this.paramOrder){for(var d=0,g=this.paramOrder.length;d<g;d++){j.push(a[this.paramOrder[d]])}}else{if(this.paramsAsHash){j.push(a)}}}break;case Ext.data.Api.actions.update:j.push(a.jsonData);break;case Ext.data.Api.actions.destroy:j.push(a.jsonData);break}var m={params:a||{},request:{callback:k,scope:l,arg:n},reader:e};j.push(this.createCallback(b,c,m),this);h.apply(window,j)},createCallback:function(d,a,b){var c=this;return function(e,g){if(!g.status){if(d===Ext.data.Api.actions.read){c.fireEvent("loadexception",c,b,g,null)}c.fireEvent("exception",c,"remote",d,b,g,null);b.request.callback.call(b.request.scope,null,b.request.arg,false);return}if(d===Ext.data.Api.actions.read){c.onRead(d,b,e,g)}else{c.onWrite(d,b,e,g,a)}}},onRead:function(g,e,a,d){var b;try{b=e.reader.readRecords(a)}catch(c){this.fireEvent("loadexception",this,e,d,c);this.fireEvent("exception",this,"response",g,e,d,c);e.request.callback.call(e.request.scope,null,e.request.arg,false);return}this.fireEvent("load",this,d,e.request.arg);e.request.callback.call(e.request.scope,b,e.request.arg,true)},onWrite:function(g,d,a,c,b){var e=d.reader.extractData(d.reader.getRoot(a),false);var h=d.reader.getSuccess(a);h=(h!==false);if(h){this.fireEvent("write",this,g,e,c,b,d.request.arg)}else{this.fireEvent("exception",this,"remote",g,d,a,b)}d.request.callback.call(d.request.scope,e,c,h)}});Ext.data.DirectStore=Ext.extend(Ext.data.Store,{constructor:function(a){var b=Ext.apply({},{batchTransactions:false},a);Ext.data.DirectStore.superclass.constructor.call(this,Ext.apply(b,{proxy:Ext.isDefined(b.proxy)?b.proxy:new Ext.data.DirectProxy(Ext.copyTo({},b,"paramOrder,paramsAsHash,directFn,api")),reader:(!Ext.isDefined(b.reader)&&b.fields)?new Ext.data.JsonReader(Ext.copyTo({},b,"totalProperty,root,idProperty"),b.fields):b.reader}))}});Ext.reg("directstore",Ext.data.DirectStore);Ext.Direct=Ext.extend(Ext.util.Observable,{exceptions:{TRANSPORT:"xhr",PARSE:"parse",LOGIN:"login",SERVER:"exception"},constructor:function(){this.addEvents("event","exception");this.transactions={};this.providers={}},addProvider:function(e){var c=arguments;if(c.length>1){for(var d=0,b=c.length;d<b;d++){this.addProvider(c[d])}return}if(!e.events){e=new Ext.Direct.PROVIDERS[e.type](e)}e.id=e.id||Ext.id();this.providers[e.id]=e;e.on("data",this.onProviderData,this);e.on("exception",this.onProviderException,this);if(!e.isConnected()){e.connect()}return e},getProvider:function(a){return this.providers[a]},removeProvider:function(b){var a=b.id?b:this.providers[b];a.un("data",this.onProviderData,this);a.un("exception",this.onProviderException,this);delete this.providers[a.id];return a},addTransaction:function(a){this.transactions[a.tid]=a;return a},removeTransaction:function(a){delete this.transactions[a.tid||a];return a},getTransaction:function(a){return this.transactions[a.tid||a]},onProviderData:function(d,c){if(Ext.isArray(c)){for(var b=0,a=c.length;b<a;b++){this.onProviderData(d,c[b])}return}if(c.name&&c.name!="event"&&c.name!="exception"){this.fireEvent(c.name,c)}else{if(c.type=="exception"){this.fireEvent("exception",c)}}this.fireEvent("event",c,d)},createEvent:function(a,b){return new Ext.Direct.eventTypes[a.type](Ext.apply(a,b))}});Ext.Direct=new Ext.Direct();Ext.Direct.TID=1;Ext.Direct.PROVIDERS={};Ext.Direct.Transaction=function(a){Ext.apply(this,a);this.tid=++Ext.Direct.TID;this.retryCount=0};Ext.Direct.Transaction.prototype={send:function(){this.provider.queueTransaction(this)},retry:function(){this.retryCount++;this.send()},getProvider:function(){return this.provider}};Ext.Direct.Event=function(a){Ext.apply(this,a)};Ext.Direct.Event.prototype={status:true,getData:function(){return this.data}};Ext.Direct.RemotingEvent=Ext.extend(Ext.Direct.Event,{type:"rpc",getTransaction:function(){return this.transaction||Ext.Direct.getTransaction(this.tid)}});Ext.Direct.ExceptionEvent=Ext.extend(Ext.Direct.RemotingEvent,{status:false,type:"exception"});Ext.Direct.eventTypes={rpc:Ext.Direct.RemotingEvent,event:Ext.Direct.Event,exception:Ext.Direct.ExceptionEvent};Ext.direct.Provider=Ext.extend(Ext.util.Observable,{priority:1,constructor:function(a){Ext.apply(this,a);this.addEvents("connect","disconnect","data","exception");Ext.direct.Provider.superclass.constructor.call(this,a)},isConnected:function(){return false},connect:Ext.emptyFn,disconnect:Ext.emptyFn});Ext.direct.JsonProvider=Ext.extend(Ext.direct.Provider,{parseResponse:function(a){if(!Ext.isEmpty(a.responseText)){if(typeof a.responseText=="object"){return a.responseText}return Ext.decode(a.responseText)}return null},getEvents:function(j){var g=null;try{g=this.parseResponse(j)}catch(h){var d=new Ext.Direct.ExceptionEvent({data:h,xhr:j,code:Ext.Direct.exceptions.PARSE,message:"Error parsing json response: \n\n "+g});return[d]}var c=[];if(Ext.isArray(g)){for(var b=0,a=g.length;b<a;b++){c.push(Ext.Direct.createEvent(g[b]))}}else{c.push(Ext.Direct.createEvent(g))}return c}});Ext.direct.PollingProvider=Ext.extend(Ext.direct.JsonProvider,{priority:3,interval:3000,constructor:function(a){Ext.direct.PollingProvider.superclass.constructor.call(this,a);this.addEvents("beforepoll","poll")},isConnected:function(){return !!this.pollTask},connect:function(){if(this.url&&!this.pollTask){this.pollTask=Ext.TaskMgr.start({run:function(){if(this.fireEvent("beforepoll",this)!==false){if(typeof this.url=="function"){this.url(this.baseParams)}else{Ext.Ajax.request({url:this.url,callback:this.onData,scope:this,params:this.baseParams})}}},interval:this.interval,scope:this});this.fireEvent("connect",this)}else{if(!this.url){throw"Error initializing PollingProvider, no url configured."}}},disconnect:function(){if(this.pollTask){Ext.TaskMgr.stop(this.pollTask);delete this.pollTask;this.fireEvent("disconnect",this)}},onData:function(d,j,h){if(j){var c=this.getEvents(h);for(var b=0,a=c.length;b<a;b++){var g=c[b];this.fireEvent("data",this,g)}}else{var g=new Ext.Direct.ExceptionEvent({data:g,code:Ext.Direct.exceptions.TRANSPORT,message:"Unable to connect to the server.",xhr:h});this.fireEvent("data",this,g)}}});Ext.Direct.PROVIDERS.polling=Ext.direct.PollingProvider;Ext.direct.RemotingProvider=Ext.extend(Ext.direct.JsonProvider,{enableBuffer:10,maxRetries:1,timeout:undefined,constructor:function(a){Ext.direct.RemotingProvider.superclass.constructor.call(this,a);this.addEvents("beforecall","call");this.namespace=(Ext.isString(this.namespace))?Ext.ns(this.namespace):this.namespace||window;this.transactions={};this.callBuffer=[]},initAPI:function(){var h=this.actions;for(var j in h){var d=this.namespace[j]||(this.namespace[j]={}),e=h[j];for(var g=0,b=e.length;g<b;g++){var a=e[g];d[a.name]=this.createMethod(j,a)}}},isConnected:function(){return !!this.connected},connect:function(){if(this.url){this.initAPI();this.connected=true;this.fireEvent("connect",this)}else{if(!this.url){throw"Error initializing RemotingProvider, no url configured."}}},disconnect:function(){if(this.connected){this.connected=false;this.fireEvent("disconnect",this)}},onData:function(a,h,j){if(h){var k=this.getEvents(j);for(var b=0,c=k.length;b<c;b++){var d=k[b],l=this.getTransaction(d);this.fireEvent("data",this,d);if(l){this.doCallback(l,d,true);Ext.Direct.removeTransaction(l)}}}else{var g=[].concat(a.ts);for(var b=0,c=g.length;b<c;b++){var l=this.getTransaction(g[b]);if(l&&l.retryCount<this.maxRetries){l.retry()}else{var d=new Ext.Direct.ExceptionEvent({data:d,transaction:l,code:Ext.Direct.exceptions.TRANSPORT,message:"Unable to connect to the server.",xhr:j});this.fireEvent("data",this,d);if(l){this.doCallback(l,d,false);Ext.Direct.removeTransaction(l)}}}}},getCallData:function(a){return{action:a.action,method:a.method,data:a.data,type:"rpc",tid:a.tid}},doSend:function(d){var g={url:this.url,callback:this.onData,scope:this,ts:d,timeout:this.timeout},b;if(Ext.isArray(d)){b=[];for(var c=0,a=d.length;c<a;c++){b.push(this.getCallData(d[c]))}}else{b=this.getCallData(d)}if(this.enableUrlEncode){var e={};e[Ext.isString(this.enableUrlEncode)?this.enableUrlEncode:"data"]=Ext.encode(b);g.params=e}else{g.jsonData=b}Ext.Ajax.request(g)},combineAndSend:function(){var a=this.callBuffer.length;if(a>0){this.doSend(a==1?this.callBuffer[0]:this.callBuffer);this.callBuffer=[]}},queueTransaction:function(a){if(a.form){this.processForm(a);return}this.callBuffer.push(a);if(this.enableBuffer){if(!this.callTask){this.callTask=new Ext.util.DelayedTask(this.combineAndSend,this)}this.callTask.delay(Ext.isNumber(this.enableBuffer)?this.enableBuffer:10)}else{this.combineAndSend()}},doCall:function(i,a,b){var h=null,e=b[a.len],g=b[a.len+1];if(a.len!==0){h=b.slice(0,a.len)}var d=new Ext.Direct.Transaction({provider:this,args:b,action:i,method:a.name,data:h,cb:g&&Ext.isFunction(e)?e.createDelegate(g):e});if(this.fireEvent("beforecall",this,d,a)!==false){Ext.Direct.addTransaction(d);this.queueTransaction(d);this.fireEvent("call",this,d,a)}},doForm:function(j,b,g,i,e){var d=new Ext.Direct.Transaction({provider:this,action:j,method:b.name,args:[g,i,e],cb:e&&Ext.isFunction(i)?i.createDelegate(e):i,isForm:true});if(this.fireEvent("beforecall",this,d,b)!==false){Ext.Direct.addTransaction(d);var a=String(g.getAttribute("enctype")).toLowerCase()=="multipart/form-data",h={extTID:d.tid,extAction:j,extMethod:b.name,extType:"rpc",extUpload:String(a)};Ext.apply(d,{form:Ext.getDom(g),isUpload:a,params:i&&Ext.isObject(i.params)?Ext.apply(h,i.params):h});this.fireEvent("call",this,d,b);this.processForm(d)}},processForm:function(a){Ext.Ajax.request({url:this.url,params:a.params,callback:this.onData,scope:this,form:a.form,isUpload:a.isUpload,ts:a})},createMethod:function(d,a){var b;if(!a.formHandler){b=function(){this.doCall(d,a,Array.prototype.slice.call(arguments,0))}.createDelegate(this)}else{b=function(e,g,c){this.doForm(d,a,e,g,c)}.createDelegate(this)}b.directCfg={action:d,method:a};return b},getTransaction:function(a){return a&&a.tid?Ext.Direct.getTransaction(a.tid):null},doCallback:function(c,g){var d=g.status?"success":"failure";if(c&&c.cb){var b=c.cb,a=Ext.isDefined(g.result)?g.result:g.data;if(Ext.isFunction(b)){b(a,g)}else{Ext.callback(b[d],b.scope,[a,g]);Ext.callback(b.callback,b.scope,[a,g])}}}});Ext.Direct.PROVIDERS.remoting=Ext.direct.RemotingProvider;Ext.Resizable=Ext.extend(Ext.util.Observable,{constructor:function(d,e){this.el=Ext.get(d);if(e&&e.wrap){e.resizeChild=this.el;this.el=this.el.wrap(typeof e.wrap=="object"?e.wrap:{cls:"xresizable-wrap"});this.el.id=this.el.dom.id=e.resizeChild.id+"-rzwrap";this.el.setStyle("overflow","hidden");this.el.setPositioning(e.resizeChild.getPositioning());e.resizeChild.clearPositioning();if(!e.width||!e.height){var g=e.resizeChild.getSize();this.el.setSize(g.width,g.height)}if(e.pinned&&!e.adjustments){e.adjustments="auto"}}this.proxy=this.el.createProxy({tag:"div",cls:"x-resizable-proxy",id:this.el.id+"-rzproxy"},Ext.getBody());this.proxy.unselectable();this.proxy.enableDisplayMode("block");Ext.apply(this,e);if(this.pinned){this.disableTrackOver=true;this.el.addClass("x-resizable-pinned")}var k=this.el.getStyle("position");if(k!="absolute"&&k!="fixed"){this.el.setStyle("position","relative")}if(!this.handles){this.handles="s,e,se";if(this.multiDirectional){this.handles+=",n,w"}}if(this.handles=="all"){this.handles="n s e w ne nw se sw"}var o=this.handles.split(/\s*?[,;]\s*?| /);var c=Ext.Resizable.positions;for(var j=0,l=o.length;j<l;j++){if(o[j]&&c[o[j]]){var n=c[o[j]];this[n]=new Ext.Resizable.Handle(this,n,this.disableTrackOver,this.transparent,this.handleCls)}}this.corner=this.southeast;if(this.handles.indexOf("n")!=-1||this.handles.indexOf("w")!=-1){this.updateBox=true}this.activeHandle=null;if(this.resizeChild){if(typeof this.resizeChild=="boolean"){this.resizeChild=Ext.get(this.el.dom.firstChild,true)}else{this.resizeChild=Ext.get(this.resizeChild,true)}}if(this.adjustments=="auto"){var b=this.resizeChild;var m=this.west,h=this.east,a=this.north,o=this.south;if(b&&(m||a)){b.position("relative");b.setLeft(m?m.el.getWidth():0);b.setTop(a?a.el.getHeight():0)}this.adjustments=[(h?-h.el.getWidth():0)+(m?-m.el.getWidth():0),(a?-a.el.getHeight():0)+(o?-o.el.getHeight():0)-1]}if(this.draggable){this.dd=this.dynamic?this.el.initDD(null):this.el.initDDProxy(null,{dragElId:this.proxy.id});this.dd.setHandleElId(this.resizeChild?this.resizeChild.id:this.el.id);if(this.constrainTo){this.dd.constrainTo(this.constrainTo)}}this.addEvents("beforeresize","resize");if(this.width!==null&&this.height!==null){this.resizeTo(this.width,this.height)}else{this.updateChildSize()}if(Ext.isIE){this.el.dom.style.zoom=1}Ext.Resizable.superclass.constructor.call(this)},adjustments:[0,0],animate:false,disableTrackOver:false,draggable:false,duration:0.35,dynamic:false,easing:"easeOutStrong",enabled:true,handles:false,multiDirectional:false,height:null,width:null,heightIncrement:0,widthIncrement:0,minHeight:5,minWidth:5,maxHeight:10000,maxWidth:10000,minX:0,minY:0,pinned:false,preserveRatio:false,resizeChild:false,transparent:false,resizeTo:function(b,a){this.el.setSize(b,a);this.updateChildSize();this.fireEvent("resize",this,b,a,null)},startSizing:function(c,b){this.fireEvent("beforeresize",this,c);if(this.enabled){if(!this.overlay){this.overlay=this.el.createProxy({tag:"div",cls:"x-resizable-overlay",html:"&#160;"},Ext.getBody());this.overlay.unselectable();this.overlay.enableDisplayMode("block");this.overlay.on({scope:this,mousemove:this.onMouseMove,mouseup:this.onMouseUp})}this.overlay.setStyle("cursor",b.el.getStyle("cursor"));this.resizing=true;this.startBox=this.el.getBox();this.startPoint=c.getXY();this.offsets=[(this.startBox.x+this.startBox.width)-this.startPoint[0],(this.startBox.y+this.startBox.height)-this.startPoint[1]];this.overlay.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.overlay.show();if(this.constrainTo){var a=Ext.get(this.constrainTo);this.resizeRegion=a.getRegion().adjust(a.getFrameWidth("t"),a.getFrameWidth("l"),-a.getFrameWidth("b"),-a.getFrameWidth("r"))}this.proxy.setStyle("visibility","hidden");this.proxy.show();this.proxy.setBox(this.startBox);if(!this.dynamic){this.proxy.setStyle("visibility","visible")}}},onMouseDown:function(a,b){if(this.enabled){b.stopEvent();this.activeHandle=a;this.startSizing(b,a)}},onMouseUp:function(b){this.activeHandle=null;var a=this.resizeElement();this.resizing=false;this.handleOut();this.overlay.hide();this.proxy.hide();this.fireEvent("resize",this,a.width,a.height,b)},updateChildSize:function(){if(this.resizeChild){var d=this.el;var e=this.resizeChild;var c=this.adjustments;if(d.dom.offsetWidth){var a=d.getSize(true);e.setSize(a.width+c[0],a.height+c[1])}if(Ext.isIE){setTimeout(function(){if(d.dom.offsetWidth){var g=d.getSize(true);e.setSize(g.width+c[0],g.height+c[1])}},10)}}},snap:function(c,e,b){if(!e||!c){return c}var d=c;var a=c%e;if(a>0){if(a>(e/2)){d=c+(e-a)}else{d=c-a}}return Math.max(b,d)},resizeElement:function(){var a=this.proxy.getBox();if(this.updateBox){this.el.setBox(a,false,this.animate,this.duration,null,this.easing)}else{this.el.setSize(a.width,a.height,this.animate,this.duration,null,this.easing)}this.updateChildSize();if(!this.dynamic){this.proxy.hide()}if(this.draggable&&this.constrainTo){this.dd.resetConstraints();this.dd.constrainTo(this.constrainTo)}return a},constrain:function(b,c,a,d){if(b-c<a){c=b-a}else{if(b-c>d){c=b-d}}return c},onMouseMove:function(z){if(this.enabled&&this.activeHandle){try{if(this.resizeRegion&&!this.resizeRegion.contains(z.getPoint())){return}var t=this.curSize||this.startBox,l=this.startBox.x,k=this.startBox.y,c=l,b=k,m=t.width,u=t.height,d=m,o=u,n=this.minWidth,A=this.minHeight,s=this.maxWidth,D=this.maxHeight,i=this.widthIncrement,a=this.heightIncrement,B=z.getXY(),r=-(this.startPoint[0]-Math.max(this.minX,B[0])),p=-(this.startPoint[1]-Math.max(this.minY,B[1])),j=this.activeHandle.position,E,g;switch(j){case"east":m+=r;m=Math.min(Math.max(n,m),s);break;case"south":u+=p;u=Math.min(Math.max(A,u),D);break;case"southeast":m+=r;u+=p;m=Math.min(Math.max(n,m),s);u=Math.min(Math.max(A,u),D);break;case"north":p=this.constrain(u,p,A,D);k+=p;u-=p;break;case"west":r=this.constrain(m,r,n,s);l+=r;m-=r;break;case"northeast":m+=r;m=Math.min(Math.max(n,m),s);p=this.constrain(u,p,A,D);k+=p;u-=p;break;case"northwest":r=this.constrain(m,r,n,s);p=this.constrain(u,p,A,D);k+=p;u-=p;l+=r;m-=r;break;case"southwest":r=this.constrain(m,r,n,s);u+=p;u=Math.min(Math.max(A,u),D);l+=r;m-=r;break}var q=this.snap(m,i,n);var C=this.snap(u,a,A);if(q!=m||C!=u){switch(j){case"northeast":k-=C-u;break;case"north":k-=C-u;break;case"southwest":l-=q-m;break;case"west":l-=q-m;break;case"northwest":l-=q-m;k-=C-u;break}m=q;u=C}if(this.preserveRatio){switch(j){case"southeast":case"east":u=o*(m/d);u=Math.min(Math.max(A,u),D);m=d*(u/o);break;case"south":m=d*(u/o);m=Math.min(Math.max(n,m),s);u=o*(m/d);break;case"northeast":m=d*(u/o);m=Math.min(Math.max(n,m),s);u=o*(m/d);break;case"north":E=m;m=d*(u/o);m=Math.min(Math.max(n,m),s);u=o*(m/d);l+=(E-m)/2;break;case"southwest":u=o*(m/d);u=Math.min(Math.max(A,u),D);E=m;m=d*(u/o);l+=E-m;break;case"west":g=u;u=o*(m/d);u=Math.min(Math.max(A,u),D);k+=(g-u)/2;E=m;m=d*(u/o);l+=E-m;break;case"northwest":E=m;g=u;u=o*(m/d);u=Math.min(Math.max(A,u),D);m=d*(u/o);k+=g-u;l+=E-m;break}}this.proxy.setBounds(l,k,m,u);if(this.dynamic){this.resizeElement()}}catch(v){}}},handleOver:function(){if(this.enabled){this.el.addClass("x-resizable-over")}},handleOut:function(){if(!this.resizing){this.el.removeClass("x-resizable-over")}},getEl:function(){return this.el},getResizeChild:function(){return this.resizeChild},destroy:function(b){Ext.destroy(this.dd,this.overlay,this.proxy);this.overlay=null;this.proxy=null;var c=Ext.Resizable.positions;for(var a in c){if(typeof c[a]!="function"&&this[c[a]]){this[c[a]].destroy()}}if(b){this.el.update("");Ext.destroy(this.el);this.el=null}this.purgeListeners()},syncHandleHeight:function(){var a=this.el.getHeight(true);if(this.west){this.west.el.setHeight(a)}if(this.east){this.east.el.setHeight(a)}}});Ext.Resizable.positions={n:"north",s:"south",e:"east",w:"west",se:"southeast",sw:"southwest",nw:"northwest",ne:"northeast"};Ext.Resizable.Handle=Ext.extend(Object,{constructor:function(d,g,c,e,a){if(!this.tpl){var b=Ext.DomHelper.createTemplate({tag:"div",cls:"x-resizable-handle x-resizable-handle-{0}"});b.compile();Ext.Resizable.Handle.prototype.tpl=b}this.position=g;this.rz=d;this.el=this.tpl.append(d.el.dom,[this.position],true);this.el.unselectable();if(e){this.el.setOpacity(0)}if(!Ext.isEmpty(a)){this.el.addClass(a)}this.el.on("mousedown",this.onMouseDown,this);if(!c){this.el.on({scope:this,mouseover:this.onMouseOver,mouseout:this.onMouseOut})}},afterResize:function(a){},onMouseDown:function(a){this.rz.onMouseDown(this,a)},onMouseOver:function(a){this.rz.handleOver(this,a)},onMouseOut:function(a){this.rz.handleOut(this,a)},destroy:function(){Ext.destroy(this.el);this.el=null}});Ext.Window=Ext.extend(Ext.Panel,{baseCls:"x-window",resizable:true,draggable:true,closable:true,closeAction:"close",constrain:false,constrainHeader:false,plain:false,minimizable:false,maximizable:false,minHeight:100,minWidth:200,expandOnShow:true,showAnimDuration:0.25,hideAnimDuration:0.25,collapsible:false,initHidden:undefined,hidden:true,elements:"header,body",frame:true,floating:true,initComponent:function(){this.initTools();Ext.Window.superclass.initComponent.call(this);this.addEvents("resize","maximize","minimize","restore");if(Ext.isDefined(this.initHidden)){this.hidden=this.initHidden}if(this.hidden===false){this.hidden=true;this.show()}},getState:function(){return Ext.apply(Ext.Window.superclass.getState.call(this)||{},this.getBox(true))},onRender:function(b,a){Ext.Window.superclass.onRender.call(this,b,a);if(this.plain){this.el.addClass("x-window-plain")}this.focusEl=this.el.createChild({tag:"a",href:"#",cls:"x-dlg-focus",tabIndex:"-1",html:"&#160;"});this.focusEl.swallowEvent("click",true);this.proxy=this.el.createProxy("x-window-proxy");this.proxy.enableDisplayMode("block");if(this.modal){this.mask=this.container.createChild({cls:"ext-el-mask"},this.el.dom);this.mask.enableDisplayMode("block");this.mask.hide();this.mon(this.mask,"click",this.focus,this)}if(this.maximizable){this.mon(this.header,"dblclick",this.toggleMaximize,this)}},initEvents:function(){Ext.Window.superclass.initEvents.call(this);if(this.animateTarget){this.setAnimateTarget(this.animateTarget)}if(this.resizable){this.resizer=new Ext.Resizable(this.el,{minWidth:this.minWidth,minHeight:this.minHeight,handles:this.resizeHandles||"all",pinned:true,resizeElement:this.resizerAction,handleCls:"x-window-handle"});this.resizer.window=this;this.mon(this.resizer,"beforeresize",this.beforeResize,this)}if(this.draggable){this.header.addClass("x-window-draggable")}this.mon(this.el,"mousedown",this.toFront,this);this.manager=this.manager||Ext.WindowMgr;this.manager.register(this);if(this.maximized){this.maximized=false;this.maximize()}if(this.closable){var a=this.getKeyMap();a.on(27,this.onEsc,this);a.disable()}},initDraggable:function(){this.dd=new Ext.Window.DD(this)},onEsc:function(a,b){if(this.activeGhost){this.unghost()}b.stopEvent();this[this.closeAction]()},beforeDestroy:function(){if(this.rendered){this.hide();this.clearAnchor();Ext.destroy(this.focusEl,this.resizer,this.dd,this.proxy,this.mask)}Ext.Window.superclass.beforeDestroy.call(this)},onDestroy:function(){if(this.manager){this.manager.unregister(this)}Ext.Window.superclass.onDestroy.call(this)},initTools:function(){if(this.minimizable){this.addTool({id:"minimize",handler:this.minimize.createDelegate(this,[])})}if(this.maximizable){this.addTool({id:"maximize",handler:this.maximize.createDelegate(this,[])});this.addTool({id:"restore",handler:this.restore.createDelegate(this,[]),hidden:true})}if(this.closable){this.addTool({id:"close",handler:this[this.closeAction].createDelegate(this,[])})}},resizerAction:function(){var a=this.proxy.getBox();this.proxy.hide();this.window.handleResize(a);return a},beforeResize:function(){this.resizer.minHeight=Math.max(this.minHeight,this.getFrameHeight()+40);this.resizer.minWidth=Math.max(this.minWidth,this.getFrameWidth()+40);this.resizeBox=this.el.getBox()},updateHandles:function(){if(Ext.isIE&&this.resizer){this.resizer.syncHandleHeight();this.el.repaint()}},handleResize:function(b){var a=this.resizeBox;if(a.x!=b.x||a.y!=b.y){this.updateBox(b)}else{this.setSize(b);if(Ext.isIE6&&Ext.isStrict){this.doLayout()}}this.focus();this.updateHandles();this.saveState()},focus:function(){var e=this.focusEl,a=this.defaultButton,c=typeof a,d,b;if(Ext.isDefined(a)){if(Ext.isNumber(a)&&this.fbar){e=this.fbar.items.get(a)}else{if(Ext.isString(a)){e=Ext.getCmp(a)}else{e=a}}d=e.getEl();b=Ext.getDom(this.container);if(d&&b){if(b!=document.body&&!Ext.lib.Region.getRegion(b).contains(Ext.lib.Region.getRegion(d.dom))){return}}}e=e||this.focusEl;e.focus.defer(10,e)},setAnimateTarget:function(a){a=Ext.get(a);this.animateTarget=a},beforeShow:function(){delete this.el.lastXY;delete this.el.lastLT;if(this.x===undefined||this.y===undefined){var a=this.el.getAlignToXY(this.container,"c-c");var b=this.el.translatePoints(a[0],a[1]);this.x=this.x===undefined?b.left:this.x;this.y=this.y===undefined?b.top:this.y}this.el.setLeftTop(this.x,this.y);if(this.expandOnShow){this.expand(false)}if(this.modal){Ext.getBody().addClass("x-body-masked");this.mask.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.mask.show()}},show:function(c,a,b){if(!this.rendered){this.render(Ext.getBody())}if(this.hidden===false){this.toFront();return this}if(this.fireEvent("beforeshow",this)===false){return this}if(a){this.on("show",a,b,{single:true})}this.hidden=false;if(Ext.isDefined(c)){this.setAnimateTarget(c)}this.beforeShow();if(this.animateTarget){this.animShow()}else{this.afterShow()}return this},afterShow:function(b){if(this.isDestroyed){return false}this.proxy.hide();this.el.setStyle("display","block");this.el.show();if(this.maximized){this.fitContainer()}if(Ext.isMac&&Ext.isGecko2){this.cascade(this.setAutoScroll)}if(this.monitorResize||this.modal||this.constrain||this.constrainHeader){Ext.EventManager.onWindowResize(this.onWindowResize,this)}this.doConstrain();this.doLayout();if(this.keyMap){this.keyMap.enable()}this.toFront();this.updateHandles();if(b&&(Ext.isIE||Ext.isWebKit)){var a=this.getSize();this.onResize(a.width,a.height)}this.onShow();this.fireEvent("show",this)},animShow:function(){this.proxy.show();this.proxy.setBox(this.animateTarget.getBox());this.proxy.setOpacity(0);var a=this.getBox();this.el.setStyle("display","none");this.proxy.shift(Ext.apply(a,{callback:this.afterShow.createDelegate(this,[true],false),scope:this,easing:"easeNone",duration:this.showAnimDuration,opacity:0.5}))},hide:function(c,a,b){if(this.hidden||this.fireEvent("beforehide",this)===false){return this}if(a){this.on("hide",a,b,{single:true})}this.hidden=true;if(c!==undefined){this.setAnimateTarget(c)}if(this.modal){this.mask.hide();Ext.getBody().removeClass("x-body-masked")}if(this.animateTarget){this.animHide()}else{this.el.hide();this.afterHide()}return this},afterHide:function(){this.proxy.hide();if(this.monitorResize||this.modal||this.constrain||this.constrainHeader){Ext.EventManager.removeResizeListener(this.onWindowResize,this)}if(this.keyMap){this.keyMap.disable()}this.onHide();this.fireEvent("hide",this)},animHide:function(){this.proxy.setOpacity(0.5);this.proxy.show();var a=this.getBox(false);this.proxy.setBox(a);this.el.hide();this.proxy.shift(Ext.apply(this.animateTarget.getBox(),{callback:this.afterHide,scope:this,duration:this.hideAnimDuration,easing:"easeNone",opacity:0}))},onShow:Ext.emptyFn,onHide:Ext.emptyFn,onWindowResize:function(){if(this.maximized){this.fitContainer()}if(this.modal){this.mask.setSize("100%","100%");var a=this.mask.dom.offsetHeight;this.mask.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true))}this.doConstrain()},doConstrain:function(){if(this.constrain||this.constrainHeader){var b;if(this.constrain){b={right:this.el.shadowOffset,left:this.el.shadowOffset,bottom:this.el.shadowOffset}}else{var a=this.getSize();b={right:-(a.width-100),bottom:-(a.height-25+this.el.getConstrainOffset())}}var c=this.el.getConstrainToXY(this.container,true,b);if(c){this.setPosition(c[0],c[1])}}},ghost:function(a){var c=this.createGhost(a);var b=this.getBox(true);c.setLeftTop(b.x,b.y);c.setWidth(b.width);this.el.hide();this.activeGhost=c;return c},unghost:function(b,a){if(!this.activeGhost){return}if(b!==false){this.el.show();this.focus.defer(10,this);if(Ext.isMac&&Ext.isGecko2){this.cascade(this.setAutoScroll)}}if(a!==false){this.setPosition(this.activeGhost.getLeft(true),this.activeGhost.getTop(true))}this.activeGhost.hide();this.activeGhost.remove();delete this.activeGhost},minimize:function(){this.fireEvent("minimize",this);return this},close:function(){if(this.fireEvent("beforeclose",this)!==false){if(this.hidden){this.doClose()}else{this.hide(null,this.doClose,this)}}},doClose:function(){this.fireEvent("close",this);this.destroy()},maximize:function(){if(!this.maximized){this.expand(false);this.restoreSize=this.getSize();this.restorePos=this.getPosition(true);if(this.maximizable){this.tools.maximize.hide();this.tools.restore.show()}this.maximized=true;this.el.disableShadow();if(this.dd){this.dd.lock()}if(this.collapsible){this.tools.toggle.hide()}this.el.addClass("x-window-maximized");this.container.addClass("x-window-maximized-ct");this.setPosition(0,0);this.fitContainer();this.fireEvent("maximize",this)}return this},restore:function(){if(this.maximized){var a=this.tools;this.el.removeClass("x-window-maximized");if(a.restore){a.restore.hide()}if(a.maximize){a.maximize.show()}this.setPosition(this.restorePos[0],this.restorePos[1]);this.setSize(this.restoreSize.width,this.restoreSize.height);delete this.restorePos;delete this.restoreSize;this.maximized=false;this.el.enableShadow(true);if(this.dd){this.dd.unlock()}if(this.collapsible&&a.toggle){a.toggle.show()}this.container.removeClass("x-window-maximized-ct");this.doConstrain();this.fireEvent("restore",this)}return this},toggleMaximize:function(){return this[this.maximized?"restore":"maximize"]()},fitContainer:function(){var a=this.container.getViewSize(false);this.setSize(a.width,a.height)},setZIndex:function(a){if(this.modal){this.mask.setStyle("z-index",a)}this.el.setZIndex(++a);a+=5;if(this.resizer){this.resizer.proxy.setStyle("z-index",++a)}this.lastZIndex=a},alignTo:function(b,a,c){var d=this.el.getAlignToXY(b,a,c);this.setPagePosition(d[0],d[1]);return this},anchorTo:function(c,e,d,b){this.clearAnchor();this.anchorTarget={el:c,alignment:e,offsets:d};Ext.EventManager.onWindowResize(this.doAnchor,this);var a=typeof b;if(a!="undefined"){Ext.EventManager.on(window,"scroll",this.doAnchor,this,{buffer:a=="number"?b:50})}return this.doAnchor()},doAnchor:function(){var a=this.anchorTarget;this.alignTo(a.el,a.alignment,a.offsets);return this},clearAnchor:function(){if(this.anchorTarget){Ext.EventManager.removeResizeListener(this.doAnchor,this);Ext.EventManager.un(window,"scroll",this.doAnchor,this);delete this.anchorTarget}return this},toFront:function(a){if(this.manager.bringToFront(this)){if(!a||!a.getTarget().focus){this.focus()}}return this},setActive:function(a){if(a){if(!this.maximized){this.el.enableShadow(true)}this.fireEvent("activate",this)}else{this.el.disableShadow();this.fireEvent("deactivate",this)}},toBack:function(){this.manager.sendToBack(this);return this},center:function(){var a=this.el.getAlignToXY(this.container,"c-c");this.setPagePosition(a[0],a[1]);return this}});Ext.reg("window",Ext.Window);Ext.Window.DD=Ext.extend(Ext.dd.DD,{constructor:function(a){this.win=a;Ext.Window.DD.superclass.constructor.call(this,a.el.id,"WindowDD-"+a.id);this.setHandleElId(a.header.id);this.scroll=false},moveOnly:true,headerOffsets:[100,25],startDrag:function(){var a=this.win;this.proxy=a.ghost(a.initialConfig.cls);if(a.constrain!==false){var c=a.el.shadowOffset;this.constrainTo(a.container,{right:c,left:c,bottom:c})}else{if(a.constrainHeader!==false){var b=this.proxy.getSize();this.constrainTo(a.container,{right:-(b.width-this.headerOffsets[0]),bottom:-(b.height-this.headerOffsets[1])})}}},b4Drag:Ext.emptyFn,onDrag:function(a){this.alignElWithMouse(this.proxy,a.getPageX(),a.getPageY())},endDrag:function(a){this.win.unghost();this.win.saveState()}});Ext.WindowGroup=function(){var g={};var d=[];var e=null;var c=function(j,i){return(!j._lastAccess||j._lastAccess<i._lastAccess)?-1:1};var h=function(){var l=d,j=l.length;if(j>0){l.sort(c);var k=l[0].manager.zseed;for(var m=0;m<j;m++){var n=l[m];if(n&&!n.hidden){n.setZIndex(k+(m*10))}}}a()};var b=function(i){if(i!=e){if(e){e.setActive(false)}e=i;if(i){i.setActive(true)}}};var a=function(){for(var j=d.length-1;j>=0;--j){if(!d[j].hidden){b(d[j]);return}}b(null)};return{zseed:9000,register:function(i){if(i.manager){i.manager.unregister(i)}i.manager=this;g[i.id]=i;d.push(i);i.on("hide",a)},unregister:function(i){delete i.manager;delete g[i.id];i.un("hide",a);d.remove(i)},get:function(i){return typeof i=="object"?i:g[i]},bringToFront:function(i){i=this.get(i);if(i!=e){i._lastAccess=new Date().getTime();h();return true}return false},sendToBack:function(i){i=this.get(i);i._lastAccess=-(new Date().getTime());h();return i},hideAll:function(){for(var i in g){if(g[i]&&typeof g[i]!="function"&&g[i].isVisible()){g[i].hide()}}},getActive:function(){return e},getBy:function(l,k){var m=[];for(var j=d.length-1;j>=0;--j){var n=d[j];if(l.call(k||n,n)!==false){m.push(n)}}return m},each:function(j,i){for(var k in g){if(g[k]&&typeof g[k]!="function"){if(j.call(i||g[k],g[k])===false){return}}}}}};Ext.WindowMgr=new Ext.WindowGroup();Ext.MessageBox=function(){var u,b,q,t,h,l,s,a,n,p,j,g,r,v,o,i="",d="",m=["ok","yes","no","cancel"];var c=function(x){r[x].blur();if(u.isVisible()){u.hide();w();Ext.callback(b.fn,b.scope||window,[x,v.dom.value,b],1)}};var w=function(){if(b&&b.cls){u.el.removeClass(b.cls)}n.reset()};var e=function(z,x,y){if(b&&b.closable!==false){u.hide();w()}if(y){y.stopEvent()}};var k=function(x){var z=0,y;if(!x){Ext.each(m,function(A){r[A].hide()});return z}u.footer.dom.style.display="";Ext.iterate(r,function(A,B){y=x[A];if(y){B.show();B.setText(Ext.isString(y)?y:Ext.MessageBox.buttonText[A]);z+=B.getEl().getWidth()+15}else{B.hide()}});return z};return{getDialog:function(x){if(!u){var z=[];r={};Ext.each(m,function(A){z.push(r[A]=new Ext.Button({text:this.buttonText[A],handler:c.createCallback(A),hideMode:"offsets"}))},this);u=new Ext.Window({autoCreate:true,title:x,resizable:false,constrain:true,constrainHeader:true,minimizable:false,maximizable:false,stateful:false,modal:true,shim:true,buttonAlign:"center",width:400,height:100,minHeight:80,plain:true,footer:true,closable:true,close:function(){if(b&&b.buttons&&b.buttons.no&&!b.buttons.cancel){c("no")}else{c("cancel")}},fbar:new Ext.Toolbar({items:z,enableOverflow:false})});u.render(document.body);u.getEl().addClass("x-window-dlg");q=u.mask;h=u.body.createChild({html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'});j=Ext.get(h.dom.firstChild);var y=h.dom.childNodes[1];l=Ext.get(y.firstChild);s=Ext.get(y.childNodes[2].firstChild);s.enableDisplayMode();s.addKeyListener([10,13],function(){if(u.isVisible()&&b&&b.buttons){if(b.buttons.ok){c("ok")}else{if(b.buttons.yes){c("yes")}}}});a=Ext.get(y.childNodes[2].childNodes[1]);a.enableDisplayMode();n=new Ext.ProgressBar({renderTo:h});h.createChild({cls:"x-clear"})}return u},updateText:function(A){if(!u.isVisible()&&!b.width){u.setSize(this.maxWidth,100)}l.update(A?A+" ":"&#160;");var y=d!=""?(j.getWidth()+j.getMargins("lr")):0,C=l.getWidth()+l.getMargins("lr"),z=u.getFrameWidth("lr"),B=u.body.getFrameWidth("lr"),x;x=Math.max(Math.min(b.width||y+C+z+B,b.maxWidth||this.maxWidth),Math.max(b.minWidth||this.minWidth,o||0));if(b.prompt===true){v.setWidth(x-y-z-B)}if(b.progress===true||b.wait===true){n.setSize(x-y-z-B)}if(Ext.isIE&&x==o){x+=4}l.update(A||"&#160;");u.setSize(x,"auto").center();return this},updateProgress:function(y,x,z){n.updateProgress(y,x);if(z){this.updateText(z)}return this},isVisible:function(){return u&&u.isVisible()},hide:function(){var x=u?u.activeGhost:null;if(this.isVisible()||x){u.hide();w();if(x){u.unghost(false,false)}}return this},show:function(A){if(this.isVisible()){this.hide()}b=A;var B=this.getDialog(b.title||"&#160;");B.setTitle(b.title||"&#160;");var x=(b.closable!==false&&b.progress!==true&&b.wait!==true);B.tools.close.setDisplayed(x);v=s;b.prompt=b.prompt||(b.multiline?true:false);if(b.prompt){if(b.multiline){s.hide();a.show();a.setHeight(Ext.isNumber(b.multiline)?b.multiline:this.defaultTextHeight);v=a}else{s.show();a.hide()}}else{s.hide();a.hide()}v.dom.value=b.value||"";if(b.prompt){B.focusEl=v}else{var z=b.buttons;var y=null;if(z&&z.ok){y=r.ok}else{if(z&&z.yes){y=r.yes}}if(y){B.focusEl=y}}if(Ext.isDefined(b.iconCls)){B.setIconClass(b.iconCls)}this.setIcon(Ext.isDefined(b.icon)?b.icon:i);o=k(b.buttons);n.setVisible(b.progress===true||b.wait===true);this.updateProgress(0,b.progressText);this.updateText(b.msg);if(b.cls){B.el.addClass(b.cls)}B.proxyDrag=b.proxyDrag===true;B.modal=b.modal!==false;B.mask=b.modal!==false?q:false;if(!B.isVisible()){document.body.appendChild(u.el.dom);B.setAnimateTarget(b.animEl);B.on("show",function(){if(x===true){B.keyMap.enable()}else{B.keyMap.disable()}},this,{single:true});B.show(b.animEl)}if(b.wait===true){n.wait(b.waitConfig)}return this},setIcon:function(x){if(!u){i=x;return}i=undefined;if(x&&x!=""){j.removeClass("x-hidden");j.replaceClass(d,x);h.addClass("x-dlg-icon");d=x}else{j.replaceClass(d,"x-hidden");h.removeClass("x-dlg-icon");d=""}return this},progress:function(z,y,x){this.show({title:z,msg:y,buttons:false,progress:true,closable:false,minWidth:this.minProgressWidth,progressText:x});return this},wait:function(z,y,x){this.show({title:y,msg:z,buttons:false,closable:false,wait:true,modal:true,minWidth:this.minProgressWidth,waitConfig:x});return this},alert:function(A,z,y,x){this.show({title:A,msg:z,buttons:this.OK,fn:y,scope:x,minWidth:this.minWidth});return this},confirm:function(A,z,y,x){this.show({title:A,msg:z,buttons:this.YESNO,fn:y,scope:x,icon:this.QUESTION,minWidth:this.minWidth});return this},prompt:function(C,B,z,y,x,A){this.show({title:C,msg:B,buttons:this.OKCANCEL,fn:z,minWidth:this.minPromptWidth,scope:y,prompt:true,multiline:x,value:A});return this},OK:{ok:true},CANCEL:{cancel:true},OKCANCEL:{ok:true,cancel:true},YESNO:{yes:true,no:true},YESNOCANCEL:{yes:true,no:true,cancel:true},INFO:"ext-mb-info",WARNING:"ext-mb-warning",QUESTION:"ext-mb-question",ERROR:"ext-mb-error",defaultTextHeight:75,maxWidth:600,minWidth:100,minProgressWidth:250,minPromptWidth:250,buttonText:{ok:"OK",cancel:"Cancel",yes:"Yes",no:"No"}}}();Ext.Msg=Ext.MessageBox;Ext.dd.PanelProxy=Ext.extend(Object,{constructor:function(a,b){this.panel=a;this.id=this.panel.id+"-ddproxy";Ext.apply(this,b)},insertProxy:true,setStatus:Ext.emptyFn,reset:Ext.emptyFn,update:Ext.emptyFn,stop:Ext.emptyFn,sync:Ext.emptyFn,getEl:function(){return this.ghost},getGhost:function(){return this.ghost},getProxy:function(){return this.proxy},hide:function(){if(this.ghost){if(this.proxy){this.proxy.remove();delete this.proxy}this.panel.el.dom.style.display="";this.ghost.remove();delete this.ghost}},show:function(){if(!this.ghost){this.ghost=this.panel.createGhost(this.panel.initialConfig.cls,undefined,Ext.getBody());this.ghost.setXY(this.panel.el.getXY());if(this.insertProxy){this.proxy=this.panel.el.insertSibling({cls:"x-panel-dd-spacer"});this.proxy.setSize(this.panel.getSize())}this.panel.el.dom.style.display="none"}},repair:function(b,c,a){this.hide();if(typeof c=="function"){c.call(a||this)}},moveProxy:function(a,b){if(this.proxy){a.insertBefore(this.proxy.dom,b)}}});Ext.Panel.DD=Ext.extend(Ext.dd.DragSource,{constructor:function(b,a){this.panel=b;this.dragData={panel:b};this.proxy=new Ext.dd.PanelProxy(b,a);Ext.Panel.DD.superclass.constructor.call(this,b.el,a);var d=b.header,c=b.body;if(d){this.setHandleElId(d.id);c=b.header}c.setStyle("cursor","move");this.scroll=false},showFrame:Ext.emptyFn,startDrag:Ext.emptyFn,b4StartDrag:function(a,b){this.proxy.show()},b4MouseDown:function(b){var a=b.getPageX(),c=b.getPageY();this.autoOffset(a,c)},onInitDrag:function(a,b){this.onStartDrag(a,b);return true},createFrame:Ext.emptyFn,getDragEl:function(a){return this.proxy.ghost.dom},endDrag:function(a){this.proxy.hide();this.panel.saveState()},autoOffset:function(a,b){a-=this.startPageX;b-=this.startPageY;this.setDelta(a,b)}});Ext.state.Provider=Ext.extend(Ext.util.Observable,{constructor:function(){this.addEvents("statechange");this.state={};Ext.state.Provider.superclass.constructor.call(this)},get:function(b,a){return typeof this.state[b]=="undefined"?a:this.state[b]},clear:function(a){delete this.state[a];this.fireEvent("statechange",this,a,null)},set:function(a,b){this.state[a]=b;this.fireEvent("statechange",this,a,b)},decodeValue:function(b){var e=/^(a|n|d|b|s|o|e)\:(.*)$/,h=e.exec(unescape(b)),d,c,a,g;if(!h||!h[1]){return}c=h[1];a=h[2];switch(c){case"e":return null;case"n":return parseFloat(a);case"d":return new Date(Date.parse(a));case"b":return(a=="1");case"a":d=[];if(a!=""){Ext.each(a.split("^"),function(i){d.push(this.decodeValue(i))},this)}return d;case"o":d={};if(a!=""){Ext.each(a.split("^"),function(i){g=i.split("=");d[g[0]]=this.decodeValue(g[1])},this)}return d;default:return a}},encodeValue:function(c){var b,g="",e=0,a,d;if(c==null){return"e:1"}else{if(typeof c=="number"){b="n:"+c}else{if(typeof c=="boolean"){b="b:"+(c?"1":"0")}else{if(Ext.isDate(c)){b="d:"+c.toGMTString()}else{if(Ext.isArray(c)){for(a=c.length;e<a;e++){g+=this.encodeValue(c[e]);if(e!=a-1){g+="^"}}b="a:"+g}else{if(typeof c=="object"){for(d in c){if(typeof c[d]!="function"&&c[d]!==undefined){g+=d+"="+this.encodeValue(c[d])+"^"}}b="o:"+g.substring(0,g.length-1)}else{b="s:"+c}}}}}}return escape(b)}});Ext.state.Manager=function(){var a=new Ext.state.Provider();return{setProvider:function(b){a=b},get:function(c,b){return a.get(c,b)},set:function(b,c){a.set(b,c)},clear:function(b){a.clear(b)},getProvider:function(){return a}}}();Ext.state.CookieProvider=Ext.extend(Ext.state.Provider,{constructor:function(a){Ext.state.CookieProvider.superclass.constructor.call(this);this.path="/";this.expires=new Date(new Date().getTime()+(1000*60*60*24*7));this.domain=null;this.secure=false;Ext.apply(this,a);this.state=this.readCookies()},set:function(a,b){if(typeof b=="undefined"||b===null){this.clear(a);return}this.setCookie(a,b);Ext.state.CookieProvider.superclass.set.call(this,a,b)},clear:function(a){this.clearCookie(a);Ext.state.CookieProvider.superclass.clear.call(this,a)},readCookies:function(){var d={},h=document.cookie+";",b=/\s?(.*?)=(.*?);/g,g,a,e;while((g=b.exec(h))!=null){a=g[1];e=g[2];if(a&&a.substring(0,3)=="ys-"){d[a.substr(3)]=this.decodeValue(e)}}return d},setCookie:function(a,b){document.cookie="ys-"+a+"="+this.encodeValue(b)+((this.expires==null)?"":("; expires="+this.expires.toGMTString()))+((this.path==null)?"":("; path="+this.path))+((this.domain==null)?"":("; domain="+this.domain))+((this.secure==true)?"; secure":"")},clearCookie:function(a){document.cookie="ys-"+a+"=null; expires=Thu, 01-Jan-70 00:00:01 GMT"+((this.path==null)?"":("; path="+this.path))+((this.domain==null)?"":("; domain="+this.domain))+((this.secure==true)?"; secure":"")}});Ext.DataView=Ext.extend(Ext.BoxComponent,{selectedClass:"x-view-selected",emptyText:"",deferEmptyText:true,trackOver:false,blockRefresh:false,last:false,initComponent:function(){Ext.DataView.superclass.initComponent.call(this);if(Ext.isString(this.tpl)||Ext.isArray(this.tpl)){this.tpl=new Ext.XTemplate(this.tpl)}this.addEvents("beforeclick","click","mouseenter","mouseleave","containerclick","dblclick","contextmenu","containercontextmenu","selectionchange","beforeselect");this.store=Ext.StoreMgr.lookup(this.store);this.all=new Ext.CompositeElementLite();this.selected=new Ext.CompositeElementLite()},afterRender:function(){Ext.DataView.superclass.afterRender.call(this);this.mon(this.getTemplateTarget(),{click:this.onClick,dblclick:this.onDblClick,contextmenu:this.onContextMenu,scope:this});if(this.overClass||this.trackOver){this.mon(this.getTemplateTarget(),{mouseover:this.onMouseOver,mouseout:this.onMouseOut,scope:this})}if(this.store){this.bindStore(this.store,true)}},refresh:function(){this.clearSelections(false,true);var b=this.getTemplateTarget(),a=this.store.getRange();b.update("");if(a.length<1){if(!this.deferEmptyText||this.hasSkippedEmptyText){b.update(this.emptyText)}this.all.clear()}else{this.tpl.overwrite(b,this.collectData(a,0));this.all.fill(Ext.query(this.itemSelector,b.dom));this.updateIndexes(0)}this.hasSkippedEmptyText=true},getTemplateTarget:function(){return this.el},prepareData:function(a){return a},collectData:function(b,e){var d=[],c=0,a=b.length;for(;c<a;c++){d[d.length]=this.prepareData(b[c].data,e+c,b[c])}return d},bufferRender:function(a,b){var c=document.createElement("div");this.tpl.overwrite(c,this.collectData(a,b));return Ext.query(this.itemSelector,c)},onUpdate:function(g,a){var b=this.store.indexOf(a);if(b>-1){var e=this.isSelected(b),c=this.all.elements[b],d=this.bufferRender([a],b)[0];this.all.replaceElement(b,d,true);if(e){this.selected.replaceElement(c,d);this.all.item(b).addClass(this.selectedClass)}this.updateIndexes(b,b)}},onAdd:function(g,d,e){if(this.all.getCount()===0){this.refresh();return}var c=this.bufferRender(d,e),h,b=this.all.elements;if(e<this.all.getCount()){h=this.all.item(e).insertSibling(c,"before",true);b.splice.apply(b,[e,0].concat(c))}else{h=this.all.last().insertSibling(c,"after",true);b.push.apply(b,c)}this.updateIndexes(e)},onRemove:function(c,a,b){this.deselect(b);this.all.removeElement(b,true);this.updateIndexes(b);if(this.store.getCount()===0){this.refresh()}},refreshNode:function(a){this.onUpdate(this.store,this.store.getAt(a))},updateIndexes:function(d,c){var b=this.all.elements;d=d||0;c=c||((c===0)?0:(b.length-1));for(var a=d;a<=c;a++){b[a].viewIndex=a}},getStore:function(){return this.store},bindStore:function(a,b){if(!b&&this.store){if(a!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("datachanged",this.onDataChanged,this);this.store.un("add",this.onAdd,this);this.store.un("remove",this.onRemove,this);this.store.un("update",this.onUpdate,this);this.store.un("clear",this.refresh,this)}if(!a){this.store=null}}if(a){a=Ext.StoreMgr.lookup(a);a.on({scope:this,beforeload:this.onBeforeLoad,datachanged:this.onDataChanged,add:this.onAdd,remove:this.onRemove,update:this.onUpdate,clear:this.refresh})}this.store=a;if(a){this.refresh()}},onDataChanged:function(){if(this.blockRefresh!==true){this.refresh.apply(this,arguments)}},findItemFromChild:function(a){return Ext.fly(a).findParent(this.itemSelector,this.getTemplateTarget())},onClick:function(c){var b=c.getTarget(this.itemSelector,this.getTemplateTarget()),a;if(b){a=this.indexOf(b);if(this.onItemClick(b,a,c)!==false){this.fireEvent("click",this,a,b,c)}}else{if(this.fireEvent("containerclick",this,c)!==false){this.onContainerClick(c)}}},onContainerClick:function(a){this.clearSelections()},onContextMenu:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a){this.fireEvent("contextmenu",this,this.indexOf(a),a,b)}else{this.fireEvent("containercontextmenu",this,b)}},onDblClick:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a){this.fireEvent("dblclick",this,this.indexOf(a),a,b)}},onMouseOver:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a&&a!==this.lastItem){this.lastItem=a;Ext.fly(a).addClass(this.overClass);this.fireEvent("mouseenter",this,this.indexOf(a),a,b)}},onMouseOut:function(a){if(this.lastItem){if(!a.within(this.lastItem,true,true)){Ext.fly(this.lastItem).removeClass(this.overClass);this.fireEvent("mouseleave",this,this.indexOf(this.lastItem),this.lastItem,a);delete this.lastItem}}},onItemClick:function(b,a,c){if(this.fireEvent("beforeclick",this,a,b,c)===false){return false}if(this.multiSelect){this.doMultiSelection(b,a,c);c.preventDefault()}else{if(this.singleSelect){this.doSingleSelection(b,a,c);c.preventDefault()}}return true},doSingleSelection:function(b,a,c){if(c.ctrlKey&&this.isSelected(a)){this.deselect(a)}else{this.select(a,false)}},doMultiSelection:function(c,a,d){if(d.shiftKey&&this.last!==false){var b=this.last;this.selectRange(b,a,d.ctrlKey);this.last=b}else{if((d.ctrlKey||this.simpleSelect)&&this.isSelected(a)){this.deselect(a)}else{this.select(a,d.ctrlKey||d.shiftKey||this.simpleSelect)}}},getSelectionCount:function(){return this.selected.getCount()},getSelectedNodes:function(){return this.selected.elements},getSelectedIndexes:function(){var b=[],d=this.selected.elements,c=0,a=d.length;for(;c<a;c++){b.push(d[c].viewIndex)}return b},getSelectedRecords:function(){return this.getRecords(this.selected.elements)},getRecords:function(c){var b=[],d=0,a=c.length;for(;d<a;d++){b[b.length]=this.store.getAt(c[d].viewIndex)}return b},getRecord:function(a){return this.store.getAt(a.viewIndex)},clearSelections:function(a,b){if((this.multiSelect||this.singleSelect)&&this.selected.getCount()>0){if(!b){this.selected.removeClass(this.selectedClass)}this.selected.clear();this.last=false;if(!a){this.fireEvent("selectionchange",this,this.selected.elements)}}},isSelected:function(a){return this.selected.contains(this.getNode(a))},deselect:function(a){if(this.isSelected(a)){a=this.getNode(a);this.selected.removeElement(a);if(this.last==a.viewIndex){this.last=false}Ext.fly(a).removeClass(this.selectedClass);this.fireEvent("selectionchange",this,this.selected.elements)}},select:function(d,g,b){if(Ext.isArray(d)){if(!g){this.clearSelections(true)}for(var c=0,a=d.length;c<a;c++){this.select(d[c],true,true)}if(!b){this.fireEvent("selectionchange",this,this.selected.elements)}}else{var e=this.getNode(d);if(!g){this.clearSelections(true)}if(e&&!this.isSelected(e)){if(this.fireEvent("beforeselect",this,e,this.selected.elements)!==false){Ext.fly(e).addClass(this.selectedClass);this.selected.add(e);this.last=e.viewIndex;if(!b){this.fireEvent("selectionchange",this,this.selected.elements)}}}}},selectRange:function(c,a,b){if(!b){this.clearSelections(true)}this.select(this.getNodes(c,a),true)},getNode:function(b){if(Ext.isString(b)){return document.getElementById(b)}else{if(Ext.isNumber(b)){return this.all.elements[b]}else{if(b instanceof Ext.data.Record){var a=this.store.indexOf(b);return this.all.elements[a]}}}return b},getNodes:function(e,a){var d=this.all.elements,b=[],c;e=e||0;a=!Ext.isDefined(a)?Math.max(d.length-1,0):a;if(e<=a){for(c=e;c<=a&&d[c];c++){b.push(d[c])}}else{for(c=e;c>=a&&d[c];c--){b.push(d[c])}}return b},indexOf:function(a){a=this.getNode(a);if(Ext.isNumber(a.viewIndex)){return a.viewIndex}return this.all.indexOf(a)},onBeforeLoad:function(){if(this.loadingText){this.clearSelections(false,true);this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+"</div>");this.all.clear()}},onDestroy:function(){this.all.clear();this.selected.clear();Ext.DataView.superclass.onDestroy.call(this);this.bindStore(null)}});Ext.DataView.prototype.setStore=Ext.DataView.prototype.bindStore;Ext.reg("dataview",Ext.DataView);Ext.list.ListView=Ext.extend(Ext.DataView,{itemSelector:"dl",selectedClass:"x-list-selected",overClass:"x-list-over",scrollOffset:undefined,columnResize:true,columnSort:true,maxColumnWidth:Ext.isIE?99:100,initComponent:function(){if(this.columnResize){this.colResizer=new Ext.list.ColumnResizer(this.colResizer);this.colResizer.init(this)}if(this.columnSort){this.colSorter=new Ext.list.Sorter(this.columnSort);this.colSorter.init(this)}if(!this.internalTpl){this.internalTpl=new Ext.XTemplate('<div class="x-list-header"><div class="x-list-header-inner">','<tpl for="columns">','<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id,'-xlhd-{#}">',"{header}","</em></div>","</tpl>",'<div class="x-clear"></div>',"</div></div>",'<div class="x-list-body"><div class="x-list-body-inner">',"</div></div>")}if(!this.tpl){this.tpl=new Ext.XTemplate('<tpl for="rows">',"<dl>",'<tpl for="parent.columns">','<dt style="width:{[values.width*100]}%;text-align:{align};">','<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',"{[values.tpl.apply(parent)]}","</em></dt>","</tpl>",'<div class="x-clear"></div>',"</dl>","</tpl>")}var l=this.columns,h=0,k=0,m=l.length,b=[];for(var g=0;g<m;g++){var n=l[g];if(!n.isColumn){n.xtype=n.xtype?(/^lv/.test(n.xtype)?n.xtype:"lv"+n.xtype):"lvcolumn";n=Ext.create(n)}if(n.width){h+=n.width*100;if(h>this.maxColumnWidth){n.width-=(h-this.maxColumnWidth)/100}k++}b.push(n)}l=this.columns=b;if(k<m){var d=m-k;if(h<this.maxColumnWidth){var a=((this.maxColumnWidth-h)/d)/100;for(var e=0;e<m;e++){var n=l[e];if(!n.width){n.width=a}}}}Ext.list.ListView.superclass.initComponent.call(this)},onRender:function(){this.autoEl={cls:"x-list-wrap"};Ext.list.ListView.superclass.onRender.apply(this,arguments);this.internalTpl.overwrite(this.el,{columns:this.columns});this.innerBody=Ext.get(this.el.dom.childNodes[1].firstChild);this.innerHd=Ext.get(this.el.dom.firstChild.firstChild);if(this.hideHeaders){this.el.dom.firstChild.style.display="none"}},getTemplateTarget:function(){return this.innerBody},collectData:function(){var a=Ext.list.ListView.superclass.collectData.apply(this,arguments);return{columns:this.columns,rows:a}},verifyInternalSize:function(){if(this.lastSize){this.onResize(this.lastSize.width,this.lastSize.height)}},onResize:function(c,e){var b=this.innerBody.dom,g=this.innerHd.dom,d=c-Ext.num(this.scrollOffset,Ext.getScrollBarWidth())+"px",a;if(!b){return}a=b.parentNode;if(Ext.isNumber(c)){if(this.reserveScrollOffset||((a.offsetWidth-a.clientWidth)>10)){b.style.width=d;g.style.width=d}else{b.style.width=c+"px";g.style.width=c+"px";setTimeout(function(){if((a.offsetWidth-a.clientWidth)>10){b.style.width=d;g.style.width=d}},10)}}if(Ext.isNumber(e)){a.style.height=Math.max(0,e-g.parentNode.offsetHeight)+"px"}},updateIndexes:function(){Ext.list.ListView.superclass.updateIndexes.apply(this,arguments);this.verifyInternalSize()},findHeaderIndex:function(g){g=g.dom||g;var a=g.parentNode,d=a.parentNode.childNodes,b=0,e;for(;e=d[b];b++){if(e==a){return b}}return -1},setHdWidths:function(){var d=this.innerHd.dom.getElementsByTagName("div"),c=0,b=this.columns,a=b.length;for(;c<a;c++){d[c].style.width=(b[c].width*100)+"%"}}});Ext.reg("listview",Ext.list.ListView);Ext.ListView=Ext.list.ListView;Ext.list.Column=Ext.extend(Object,{isColumn:true,align:"left",header:"",width:null,cls:"",constructor:function(a){if(!a.tpl){a.tpl=new Ext.XTemplate("{"+a.dataIndex+"}")}else{if(Ext.isString(a.tpl)){a.tpl=new Ext.XTemplate(a.tpl)}}Ext.apply(this,a)}});Ext.reg("lvcolumn",Ext.list.Column);Ext.list.NumberColumn=Ext.extend(Ext.list.Column,{format:"0,000.00",constructor:function(a){a.tpl=a.tpl||new Ext.XTemplate("{"+a.dataIndex+':number("'+(a.format||this.format)+'")}');Ext.list.NumberColumn.superclass.constructor.call(this,a)}});Ext.reg("lvnumbercolumn",Ext.list.NumberColumn);Ext.list.DateColumn=Ext.extend(Ext.list.Column,{format:"m/d/Y",constructor:function(a){a.tpl=a.tpl||new Ext.XTemplate("{"+a.dataIndex+':date("'+(a.format||this.format)+'")}');Ext.list.DateColumn.superclass.constructor.call(this,a)}});Ext.reg("lvdatecolumn",Ext.list.DateColumn);Ext.list.BooleanColumn=Ext.extend(Ext.list.Column,{trueText:"true",falseText:"false",undefinedText:"&#160;",constructor:function(e){e.tpl=e.tpl||new Ext.XTemplate("{"+e.dataIndex+":this.format}");var b=this.trueText,d=this.falseText,a=this.undefinedText;e.tpl.format=function(c){if(c===undefined){return a}if(!c||c==="false"){return d}return b};Ext.list.DateColumn.superclass.constructor.call(this,e)}});Ext.reg("lvbooleancolumn",Ext.list.BooleanColumn);Ext.list.ColumnResizer=Ext.extend(Ext.util.Observable,{minPct:0.05,constructor:function(a){Ext.apply(this,a);Ext.list.ColumnResizer.superclass.constructor.call(this)},init:function(a){this.view=a;a.on("render",this.initEvents,this)},initEvents:function(a){a.mon(a.innerHd,"mousemove",this.handleHdMove,this);this.tracker=new Ext.dd.DragTracker({onBeforeStart:this.onBeforeStart.createDelegate(this),onStart:this.onStart.createDelegate(this),onDrag:this.onDrag.createDelegate(this),onEnd:this.onEnd.createDelegate(this),tolerance:3,autoStart:300});this.tracker.initEl(a.innerHd);a.on("beforedestroy",this.tracker.destroy,this.tracker)},handleHdMove:function(i,d){var c=5,b=i.getPageX(),j=i.getTarget("em",3,true);if(j){var h=j.getRegion(),g=j.dom.style,a=j.dom.parentNode;if(b-h.left<=c&&a!=a.parentNode.firstChild){this.activeHd=Ext.get(a.previousSibling.firstChild);g.cursor=Ext.isWebKit?"e-resize":"col-resize"}else{if(h.right-b<=c&&a!=a.parentNode.lastChild.previousSibling){this.activeHd=j;g.cursor=Ext.isWebKit?"w-resize":"col-resize"}else{delete this.activeHd;g.cursor=""}}}},onBeforeStart:function(a){this.dragHd=this.activeHd;return !!this.dragHd},onStart:function(g){var d=this,b=d.view,c=d.dragHd,a=d.tracker.getXY()[0];d.proxy=b.el.createChild({cls:"x-list-resizer"});d.dragX=c.getX();d.headerIndex=b.findHeaderIndex(c);d.headersDisabled=b.disableHeaders;b.disableHeaders=true;d.proxy.setHeight(b.el.getHeight());d.proxy.setX(d.dragX);d.proxy.setWidth(a-d.dragX);this.setBoundaries()},setBoundaries:function(j){var k=this.view,h=this.headerIndex,c=k.innerHd.getWidth(),j=k.innerHd.getX(),b=Math.ceil(c*this.minPct),l=c-b,e=k.columns.length,d=k.innerHd.select("em",true),g=b+j,a=l+j,i;if(e==2){this.minX=g;this.maxX=a}else{i=d.item(h+2);this.minX=d.item(h).getX()+b;this.maxX=i?i.getX()-b:a;if(h==0){this.minX=g}else{if(h==e-2){this.maxX=a}}}},onDrag:function(c){var b=this,a=b.tracker.getXY()[0].constrain(b.minX,b.maxX);b.proxy.setWidth(a-this.dragX)},onEnd:function(i){var g=this.proxy.getWidth(),h=this.headerIndex,l=this.view,c=l.columns,b=l.innerHd.getWidth(),k=Math.ceil(g*l.maxColumnWidth/b)/100,d=this.headersDisabled,m=c[h],j=c[h+1],a=m.width+j.width;this.proxy.remove();m.width=k;j.width=a-k;delete this.dragHd;l.setHdWidths();l.refresh();setTimeout(function(){l.disableHeaders=d},100)}});Ext.ListView.ColumnResizer=Ext.list.ColumnResizer;Ext.list.Sorter=Ext.extend(Ext.util.Observable,{sortClasses:["sort-asc","sort-desc"],constructor:function(a){Ext.apply(this,a);Ext.list.Sorter.superclass.constructor.call(this)},init:function(a){this.view=a;a.on("render",this.initEvents,this)},initEvents:function(a){a.mon(a.innerHd,"click",this.onHdClick,this);a.innerHd.setStyle("cursor","pointer");a.mon(a.store,"datachanged",this.updateSortState,this);this.updateSortState.defer(10,this,[a.store])},updateSortState:function(c){var g=c.getSortState();if(!g){return}this.sortState=g;var e=this.view.columns,h=-1;for(var d=0,a=e.length;d<a;d++){if(e[d].dataIndex==g.field){h=d;break}}if(h!=-1){var b=g.direction;this.updateSortIcon(h,b)}},updateSortIcon:function(b,a){var d=this.sortClasses;var c=this.view.innerHd.select("em").removeClass(d);c.item(b).addClass(d[a=="DESC"?1:0])},onHdClick:function(c){var b=c.getTarget("em",3);if(b&&!this.view.disableHeaders){var a=this.view.findHeaderIndex(b);this.view.store.sort(this.view.columns[a].dataIndex)}}});Ext.ListView.Sorter=Ext.list.Sorter;Ext.TabPanel=Ext.extend(Ext.Panel,{deferredRender:true,tabWidth:120,minTabWidth:30,resizeTabs:false,enableTabScroll:false,scrollIncrement:0,scrollRepeatInterval:400,scrollDuration:0.35,animScroll:true,tabPosition:"top",baseCls:"x-tab-panel",autoTabs:false,autoTabSelector:"div.x-tab",activeTab:undefined,tabMargin:2,plain:false,wheelIncrement:20,idDelimiter:"__",itemCls:"x-tab-item",elements:"body",headerAsText:false,frame:false,hideBorders:true,initComponent:function(){this.frame=false;Ext.TabPanel.superclass.initComponent.call(this);this.addEvents("beforetabchange","tabchange","contextmenu");this.setLayout(new Ext.layout.CardLayout(Ext.apply({layoutOnCardChange:this.layoutOnTabChange,deferredRender:this.deferredRender},this.layoutConfig)));if(this.tabPosition=="top"){this.elements+=",header";this.stripTarget="header"}else{this.elements+=",footer";this.stripTarget="footer"}if(!this.stack){this.stack=Ext.TabPanel.AccessStack()}this.initItems()},onRender:function(c,a){Ext.TabPanel.superclass.onRender.call(this,c,a);if(this.plain){var g=this.tabPosition=="top"?"header":"footer";this[g].addClass("x-tab-panel-"+g+"-plain")}var b=this[this.stripTarget];this.stripWrap=b.createChild({cls:"x-tab-strip-wrap",cn:{tag:"ul",cls:"x-tab-strip x-tab-strip-"+this.tabPosition}});var e=(this.tabPosition=="bottom"?this.stripWrap:null);b.createChild({cls:"x-tab-strip-spacer"},e);this.strip=new Ext.Element(this.stripWrap.dom.firstChild);this.edge=this.strip.createChild({tag:"li",cls:"x-tab-edge",cn:[{tag:"span",cls:"x-tab-strip-text",cn:"&#160;"}]});this.strip.createChild({cls:"x-clear"});this.body.addClass("x-tab-panel-body-"+this.tabPosition);if(!this.itemTpl){var d=new Ext.Template('<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>','<a class="x-tab-right" href="#"><em class="x-tab-left">','<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',"</em></a></li>");d.disableFormats=true;d.compile();Ext.TabPanel.prototype.itemTpl=d}this.items.each(this.initTab,this)},afterRender:function(){Ext.TabPanel.superclass.afterRender.call(this);if(this.autoTabs){this.readTabs(false)}if(this.activeTab!==undefined){var a=Ext.isObject(this.activeTab)?this.activeTab:this.items.get(this.activeTab);delete this.activeTab;this.setActiveTab(a)}},initEvents:function(){Ext.TabPanel.superclass.initEvents.call(this);this.mon(this.strip,{scope:this,mousedown:this.onStripMouseDown,contextmenu:this.onStripContextMenu});if(this.enableTabScroll){this.mon(this.strip,"mousewheel",this.onWheel,this)}},findTargets:function(c){var b=null,a=c.getTarget("li:not(.x-tab-edge)",this.strip);if(a){b=this.getComponent(a.id.split(this.idDelimiter)[1]);if(b.disabled){return{close:null,item:null,el:null}}}return{close:c.getTarget(".x-tab-strip-close",this.strip),item:b,el:a}},onStripMouseDown:function(b){if(b.button!==0){return}b.preventDefault();var a=this.findTargets(b);if(a.close){if(a.item.fireEvent("beforeclose",a.item)!==false){a.item.fireEvent("close",a.item);this.remove(a.item)}return}if(a.item&&a.item!=this.activeTab){this.setActiveTab(a.item)}},onStripContextMenu:function(b){b.preventDefault();var a=this.findTargets(b);if(a.item){this.fireEvent("contextmenu",this,a.item,b)}},readTabs:function(d){if(d===true){this.items.each(function(h){this.remove(h)},this)}var c=this.el.query(this.autoTabSelector);for(var b=0,a=c.length;b<a;b++){var e=c[b],g=e.getAttribute("title");e.removeAttribute("title");this.add({title:g,contentEl:e})}},initTab:function(d,b){var e=this.strip.dom.childNodes[b],g=this.getTemplateArgs(d),c=e?this.itemTpl.insertBefore(e,g):this.itemTpl.append(this.strip,g),a="x-tab-strip-over",h=Ext.get(c);h.hover(function(){if(!d.disabled){h.addClass(a)}},function(){h.removeClass(a)});if(d.tabTip){h.child("span.x-tab-strip-text",true).qtip=d.tabTip}d.tabEl=c;h.select("a").on("click",function(i){if(!i.getPageX()){this.onStripMouseDown(i)}},this,{preventDefault:true});d.on({scope:this,disable:this.onItemDisabled,enable:this.onItemEnabled,titlechange:this.onItemTitleChanged,iconchange:this.onItemIconChanged,beforeshow:this.onBeforeShowItem})},getTemplateArgs:function(b){var a=b.closable?"x-tab-strip-closable":"";if(b.disabled){a+=" x-item-disabled"}if(b.iconCls){a+=" x-tab-with-icon"}if(b.tabCls){a+=" "+b.tabCls}return{id:this.id+this.idDelimiter+b.getItemId(),text:b.title,cls:a,iconCls:b.iconCls||""}},onAdd:function(b){Ext.TabPanel.superclass.onAdd.call(this,b);if(this.rendered){var a=this.items;this.initTab(b,a.indexOf(b));this.delegateUpdates()}},onBeforeAdd:function(b){var a=b.events?(this.items.containsKey(b.getItemId())?b:null):this.items.get(b);if(a){this.setActiveTab(b);return false}Ext.TabPanel.superclass.onBeforeAdd.apply(this,arguments);var c=b.elements;b.elements=c?c.replace(",header",""):c;b.border=(b.border===true)},onRemove:function(d){var b=Ext.get(d.tabEl);if(b){b.select("a").removeAllListeners();Ext.destroy(b)}Ext.TabPanel.superclass.onRemove.call(this,d);this.stack.remove(d);delete d.tabEl;d.un("disable",this.onItemDisabled,this);d.un("enable",this.onItemEnabled,this);d.un("titlechange",this.onItemTitleChanged,this);d.un("iconchange",this.onItemIconChanged,this);d.un("beforeshow",this.onBeforeShowItem,this);if(d==this.activeTab){var a=this.stack.next();if(a){this.setActiveTab(a)}else{if(this.items.getCount()>0){this.setActiveTab(0)}else{this.setActiveTab(null)}}}if(!this.destroying){this.delegateUpdates()}},onBeforeShowItem:function(a){if(a!=this.activeTab){this.setActiveTab(a);return false}},onItemDisabled:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).addClass("x-item-disabled")}this.stack.remove(b)},onItemEnabled:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).removeClass("x-item-disabled")}},onItemTitleChanged:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).child("span.x-tab-strip-text",true).innerHTML=b.title}},onItemIconChanged:function(d,a,c){var b=this.getTabEl(d);if(b){b=Ext.get(b);b.child("span.x-tab-strip-text").replaceClass(c,a);b[Ext.isEmpty(a)?"removeClass":"addClass"]("x-tab-with-icon")}},getTabEl:function(a){var b=this.getComponent(a);return b?b.tabEl:null},onResize:function(){Ext.TabPanel.superclass.onResize.apply(this,arguments);this.delegateUpdates()},beginUpdate:function(){this.suspendUpdates=true},endUpdate:function(){this.suspendUpdates=false;this.delegateUpdates()},hideTabStripItem:function(b){b=this.getComponent(b);var a=this.getTabEl(b);if(a){a.style.display="none";this.delegateUpdates()}this.stack.remove(b)},unhideTabStripItem:function(b){b=this.getComponent(b);var a=this.getTabEl(b);if(a){a.style.display="";this.delegateUpdates()}},delegateUpdates:function(){var a=this.rendered;if(this.suspendUpdates){return}if(this.resizeTabs&&a){this.autoSizeTabs()}if(this.enableTabScroll&&a){this.autoScrollTabs()}},autoSizeTabs:function(){var h=this.items.length,b=this.tabPosition!="bottom"?"header":"footer",c=this[b].dom.offsetWidth,a=this[b].dom.clientWidth;if(!this.resizeTabs||h<1||!a){return}var k=Math.max(Math.min(Math.floor((a-4)/h)-this.tabMargin,this.tabWidth),this.minTabWidth);this.lastTabWidth=k;var m=this.strip.query("li:not(.x-tab-edge)");for(var e=0,j=m.length;e<j;e++){var l=m[e],n=Ext.fly(l).child(".x-tab-strip-inner",true),g=l.offsetWidth,d=n.offsetWidth;n.style.width=(k-(g-d))+"px"}},adjustBodyWidth:function(a){if(this.header){this.header.setWidth(a)}if(this.footer){this.footer.setWidth(a)}return a},setActiveTab:function(c){c=this.getComponent(c);if(this.fireEvent("beforetabchange",this,c,this.activeTab)===false){return}if(!this.rendered){this.activeTab=c;return}if(this.activeTab!=c){if(this.activeTab){var a=this.getTabEl(this.activeTab);if(a){Ext.fly(a).removeClass("x-tab-strip-active")}}this.activeTab=c;if(c){var b=this.getTabEl(c);Ext.fly(b).addClass("x-tab-strip-active");this.stack.add(c);this.layout.setActiveItem(c);this.delegateUpdates();if(this.scrolling){this.scrollToTab(c,this.animScroll)}}this.fireEvent("tabchange",this,c)}},getActiveTab:function(){return this.activeTab||null},getItem:function(a){return this.getComponent(a)},autoScrollTabs:function(){this.pos=this.tabPosition=="bottom"?this.footer:this.header;var h=this.items.length,d=this.pos.dom.offsetWidth,c=this.pos.dom.clientWidth,g=this.stripWrap,e=g.dom,b=e.offsetWidth,i=this.getScrollPos(),a=this.edge.getOffsetsTo(this.stripWrap)[0]+i;if(!this.enableTabScroll||b<20){return}if(h==0||a<=c){e.scrollLeft=0;g.setWidth(c);if(this.scrolling){this.scrolling=false;this.pos.removeClass("x-tab-scrolling");this.scrollLeft.hide();this.scrollRight.hide();if(Ext.isAir||Ext.isWebKit){e.style.marginLeft="";e.style.marginRight=""}}}else{if(!this.scrolling){this.pos.addClass("x-tab-scrolling");if(Ext.isAir||Ext.isWebKit){e.style.marginLeft="18px";e.style.marginRight="18px"}}c-=g.getMargins("lr");g.setWidth(c>20?c:20);if(!this.scrolling){if(!this.scrollLeft){this.createScrollers()}else{this.scrollLeft.show();this.scrollRight.show()}}this.scrolling=true;if(i>(a-c)){e.scrollLeft=a-c}else{this.scrollToTab(this.activeTab,false)}this.updateScrollButtons()}},createScrollers:function(){this.pos.addClass("x-tab-scrolling-"+this.tabPosition);var c=this.stripWrap.dom.offsetHeight;var a=this.pos.insertFirst({cls:"x-tab-scroller-left"});a.setHeight(c);a.addClassOnOver("x-tab-scroller-left-over");this.leftRepeater=new Ext.util.ClickRepeater(a,{interval:this.scrollRepeatInterval,handler:this.onScrollLeft,scope:this});this.scrollLeft=a;var b=this.pos.insertFirst({cls:"x-tab-scroller-right"});b.setHeight(c);b.addClassOnOver("x-tab-scroller-right-over");this.rightRepeater=new Ext.util.ClickRepeater(b,{interval:this.scrollRepeatInterval,handler:this.onScrollRight,scope:this});this.scrollRight=b},getScrollWidth:function(){return this.edge.getOffsetsTo(this.stripWrap)[0]+this.getScrollPos()},getScrollPos:function(){return parseInt(this.stripWrap.dom.scrollLeft,10)||0},getScrollArea:function(){return parseInt(this.stripWrap.dom.clientWidth,10)||0},getScrollAnim:function(){return{duration:this.scrollDuration,callback:this.updateScrollButtons,scope:this}},getScrollIncrement:function(){return this.scrollIncrement||(this.resizeTabs?this.lastTabWidth+2:100)},scrollToTab:function(e,a){if(!e){return}var c=this.getTabEl(e),h=this.getScrollPos(),d=this.getScrollArea(),g=Ext.fly(c).getOffsetsTo(this.stripWrap)[0]+h,b=g+c.offsetWidth;if(g<h){this.scrollTo(g,a)}else{if(b>(h+d)){this.scrollTo(b-d,a)}}},scrollTo:function(b,a){this.stripWrap.scrollTo("left",b,a?this.getScrollAnim():false);if(!a){this.updateScrollButtons()}},onWheel:function(g){var h=g.getWheelDelta()*this.wheelIncrement*-1;g.stopEvent();var i=this.getScrollPos(),c=i+h,a=this.getScrollWidth()-this.getScrollArea();var b=Math.max(0,Math.min(a,c));if(b!=i){this.scrollTo(b,false)}},onScrollRight:function(){var a=this.getScrollWidth()-this.getScrollArea(),c=this.getScrollPos(),b=Math.min(a,c+this.getScrollIncrement());if(b!=c){this.scrollTo(b,this.animScroll)}},onScrollLeft:function(){var b=this.getScrollPos(),a=Math.max(0,b-this.getScrollIncrement());if(a!=b){this.scrollTo(a,this.animScroll)}},updateScrollButtons:function(){var a=this.getScrollPos();this.scrollLeft[a===0?"addClass":"removeClass"]("x-tab-scroller-left-disabled");this.scrollRight[a>=(this.getScrollWidth()-this.getScrollArea())?"addClass":"removeClass"]("x-tab-scroller-right-disabled")},beforeDestroy:function(){Ext.destroy(this.leftRepeater,this.rightRepeater);this.deleteMembers("strip","edge","scrollLeft","scrollRight","stripWrap");this.activeTab=null;Ext.TabPanel.superclass.beforeDestroy.apply(this)}});Ext.reg("tabpanel",Ext.TabPanel);Ext.TabPanel.prototype.activate=Ext.TabPanel.prototype.setActiveTab;Ext.TabPanel.AccessStack=function(){var a=[];return{add:function(b){a.push(b);if(a.length>10){a.shift()}},remove:function(e){var d=[];for(var c=0,b=a.length;c<b;c++){if(a[c]!=e){d.push(a[c])}}a=d},next:function(){return a.pop()}}};Ext.Button=Ext.extend(Ext.BoxComponent,{hidden:false,disabled:false,pressed:false,enableToggle:false,menuAlign:"tl-bl?",type:"button",menuClassTarget:"tr:nth(2)",clickEvent:"click",handleMouseEvents:true,tooltipType:"qtip",buttonSelector:"button:first-child",scale:"small",iconAlign:"left",arrowAlign:"right",initComponent:function(){if(this.menu){if(Ext.isArray(this.menu)){this.menu={items:this.menu}}if(Ext.isObject(this.menu)){this.menu.ownerCt=this}this.menu=Ext.menu.MenuMgr.get(this.menu);this.menu.ownerCt=undefined}Ext.Button.superclass.initComponent.call(this);this.addEvents("click","toggle","mouseover","mouseout","menushow","menuhide","menutriggerover","menutriggerout");if(Ext.isString(this.toggleGroup)){this.enableToggle=true}},getTemplateArgs:function(){return[this.type,"x-btn-"+this.scale+" x-btn-icon-"+this.scale+"-"+this.iconAlign,this.getMenuClass(),this.cls,this.id]},setButtonClass:function(){if(this.useSetClass){if(!Ext.isEmpty(this.oldCls)){this.el.removeClass([this.oldCls,"x-btn-pressed"])}this.oldCls=(this.iconCls||this.icon)?(this.text?"x-btn-text-icon":"x-btn-icon"):"x-btn-noicon";this.el.addClass([this.oldCls,this.pressed?"x-btn-pressed":null])}},getMenuClass:function(){return this.menu?(this.arrowAlign!="bottom"?"x-btn-arrow":"x-btn-arrow-bottom"):""},onRender:function(c,a){if(!this.template){if(!Ext.Button.buttonTemplate){Ext.Button.buttonTemplate=new Ext.Template('<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">','<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>','<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>','<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',"</tbody></table>");Ext.Button.buttonTemplate.compile()}this.template=Ext.Button.buttonTemplate}var b,d=this.getTemplateArgs();if(a){b=this.template.insertBefore(a,d,true)}else{b=this.template.append(c,d,true)}this.btnEl=b.child(this.buttonSelector);this.mon(this.btnEl,{scope:this,focus:this.onFocus,blur:this.onBlur});this.initButtonEl(b,this.btnEl);Ext.ButtonToggleMgr.register(this)},initButtonEl:function(b,c){this.el=b;this.setIcon(this.icon);this.setText(this.text);this.setIconClass(this.iconCls);if(Ext.isDefined(this.tabIndex)){c.dom.tabIndex=this.tabIndex}if(this.tooltip){this.setTooltip(this.tooltip,true)}if(this.handleMouseEvents){this.mon(b,{scope:this,mouseover:this.onMouseOver,mousedown:this.onMouseDown})}if(this.menu){this.mon(this.menu,{scope:this,show:this.onMenuShow,hide:this.onMenuHide})}if(this.repeat){var a=new Ext.util.ClickRepeater(b,Ext.isObject(this.repeat)?this.repeat:{});this.mon(a,"click",this.onRepeatClick,this)}else{this.mon(b,this.clickEvent,this.onClick,this)}},afterRender:function(){Ext.Button.superclass.afterRender.call(this);this.useSetClass=true;this.setButtonClass();this.doc=Ext.getDoc();this.doAutoWidth()},setIconClass:function(a){this.iconCls=a;if(this.el){this.btnEl.dom.className="";this.btnEl.addClass(["x-btn-text",a||""]);this.setButtonClass()}return this},setTooltip:function(b,a){if(this.rendered){if(!a){this.clearTip()}if(Ext.isObject(b)){Ext.QuickTips.register(Ext.apply({target:this.btnEl.id},b));this.tooltip=b}else{this.btnEl.dom[this.tooltipType]=b}}else{this.tooltip=b}return this},clearTip:function(){if(Ext.isObject(this.tooltip)){Ext.QuickTips.unregister(this.btnEl)}},beforeDestroy:function(){if(this.rendered){this.clearTip()}if(this.menu&&this.destroyMenu!==false){Ext.destroy(this.btnEl,this.menu)}Ext.destroy(this.repeater)},onDestroy:function(){if(this.rendered){this.doc.un("mouseover",this.monitorMouseOver,this);this.doc.un("mouseup",this.onMouseUp,this);delete this.doc;delete this.btnEl;Ext.ButtonToggleMgr.unregister(this)}Ext.Button.superclass.onDestroy.call(this)},doAutoWidth:function(){if(this.autoWidth!==false&&this.el&&this.text&&this.width===undefined){this.el.setWidth("auto");if(Ext.isIE7&&Ext.isStrict){var a=this.btnEl;if(a&&a.getWidth()>20){a.clip();a.setWidth(Ext.util.TextMetrics.measure(a,this.text).width+a.getFrameWidth("lr"))}}if(this.minWidth){if(this.el.getWidth()<this.minWidth){this.el.setWidth(this.minWidth)}}}},setHandler:function(b,a){this.handler=b;this.scope=a;return this},setText:function(a){this.text=a;if(this.el){this.btnEl.update(a||"&#160;");this.setButtonClass()}this.doAutoWidth();return this},setIcon:function(a){this.icon=a;if(this.el){this.btnEl.setStyle("background-image",a?"url("+a+")":"");this.setButtonClass()}return this},getText:function(){return this.text},toggle:function(b,a){b=b===undefined?!this.pressed:!!b;if(b!=this.pressed){if(this.rendered){this.el[b?"addClass":"removeClass"]("x-btn-pressed")}this.pressed=b;if(!a){this.fireEvent("toggle",this,b);if(this.toggleHandler){this.toggleHandler.call(this.scope||this,this,b)}}}return this},onDisable:function(){this.onDisableChange(true)},onEnable:function(){this.onDisableChange(false)},onDisableChange:function(a){if(this.el){if(!Ext.isIE6||!this.text){this.el[a?"addClass":"removeClass"](this.disabledClass)}this.el.dom.disabled=a}this.disabled=a},showMenu:function(){if(this.rendered&&this.menu){if(this.tooltip){Ext.QuickTips.getQuickTip().cancelShow(this.btnEl)}if(this.menu.isVisible()){this.menu.hide()}this.menu.ownerCt=this;this.menu.show(this.el,this.menuAlign)}return this},hideMenu:function(){if(this.hasVisibleMenu()){this.menu.hide()}return this},hasVisibleMenu:function(){return this.menu&&this.menu.ownerCt==this&&this.menu.isVisible()},onRepeatClick:function(a,b){this.onClick(b)},onClick:function(a){if(a){a.preventDefault()}if(a.button!==0){return}if(!this.disabled){this.doToggle();if(this.menu&&!this.hasVisibleMenu()&&!this.ignoreNextClick){this.showMenu()}this.fireEvent("click",this,a);if(this.handler){this.handler.call(this.scope||this,this,a)}}},doToggle:function(){if(this.enableToggle&&(this.allowDepress!==false||!this.pressed)){this.toggle()}},isMenuTriggerOver:function(b,a){return this.menu&&!a},isMenuTriggerOut:function(b,a){return this.menu&&!a},onMouseOver:function(b){if(!this.disabled){var a=b.within(this.el,true);if(!a){this.el.addClass("x-btn-over");if(!this.monitoringMouseOver){this.doc.on("mouseover",this.monitorMouseOver,this);this.monitoringMouseOver=true}this.fireEvent("mouseover",this,b)}if(this.isMenuTriggerOver(b,a)){this.fireEvent("menutriggerover",this,this.menu,b)}}},monitorMouseOver:function(a){if(a.target!=this.el.dom&&!a.within(this.el)){if(this.monitoringMouseOver){this.doc.un("mouseover",this.monitorMouseOver,this);this.monitoringMouseOver=false}this.onMouseOut(a)}},onMouseOut:function(b){var a=b.within(this.el)&&b.target!=this.el.dom;this.el.removeClass("x-btn-over");this.fireEvent("mouseout",this,b);if(this.isMenuTriggerOut(b,a)){this.fireEvent("menutriggerout",this,this.menu,b)}},focus:function(){this.btnEl.focus()},blur:function(){this.btnEl.blur()},onFocus:function(a){if(!this.disabled){this.el.addClass("x-btn-focus")}},onBlur:function(a){this.el.removeClass("x-btn-focus")},getClickEl:function(b,a){return this.el},onMouseDown:function(a){if(!this.disabled&&a.button===0){this.getClickEl(a).addClass("x-btn-click");this.doc.on("mouseup",this.onMouseUp,this)}},onMouseUp:function(a){if(a.button===0){this.getClickEl(a,true).removeClass("x-btn-click");this.doc.un("mouseup",this.onMouseUp,this)}},onMenuShow:function(a){if(this.menu.ownerCt==this){this.menu.ownerCt=this;this.ignoreNextClick=0;this.el.addClass("x-btn-menu-active");this.fireEvent("menushow",this,this.menu)}},onMenuHide:function(a){if(this.menu.ownerCt==this){this.el.removeClass("x-btn-menu-active");this.ignoreNextClick=this.restoreClick.defer(250,this);this.fireEvent("menuhide",this,this.menu);delete this.menu.ownerCt}},restoreClick:function(){this.ignoreNextClick=0}});Ext.reg("button",Ext.Button);Ext.ButtonToggleMgr=function(){var a={};function b(e,j){if(j){var h=a[e.toggleGroup];for(var d=0,c=h.length;d<c;d++){if(h[d]!=e){h[d].toggle(false)}}}}return{register:function(c){if(!c.toggleGroup){return}var d=a[c.toggleGroup];if(!d){d=a[c.toggleGroup]=[]}d.push(c);c.on("toggle",b)},unregister:function(c){if(!c.toggleGroup){return}var d=a[c.toggleGroup];if(d){d.remove(c);c.un("toggle",b)}},getPressed:function(h){var e=a[h];if(e){for(var d=0,c=e.length;d<c;d++){if(e[d].pressed===true){return e[d]}}}return null}}}();Ext.SplitButton=Ext.extend(Ext.Button,{arrowSelector:"em",split:true,initComponent:function(){Ext.SplitButton.superclass.initComponent.call(this);this.addEvents("arrowclick")},onRender:function(){Ext.SplitButton.superclass.onRender.apply(this,arguments);if(this.arrowTooltip){this.el.child(this.arrowSelector).dom[this.tooltipType]=this.arrowTooltip}},setArrowHandler:function(b,a){this.arrowHandler=b;this.scope=a},getMenuClass:function(){return"x-btn-split"+(this.arrowAlign=="bottom"?"-bottom":"")},isClickOnArrow:function(c){if(this.arrowAlign!="bottom"){var b=this.el.child("em.x-btn-split");var a=b.getRegion().right-b.getPadding("r");return c.getPageX()>a}else{return c.getPageY()>this.btnEl.getRegion().bottom}},onClick:function(b,a){b.preventDefault();if(!this.disabled){if(this.isClickOnArrow(b)){if(this.menu&&!this.menu.isVisible()&&!this.ignoreNextClick){this.showMenu()}this.fireEvent("arrowclick",this,b);if(this.arrowHandler){this.arrowHandler.call(this.scope||this,this,b)}}else{this.doToggle();this.fireEvent("click",this,b);if(this.handler){this.handler.call(this.scope||this,this,b)}}}},isMenuTriggerOver:function(a){return this.menu&&a.target.tagName==this.arrowSelector},isMenuTriggerOut:function(b,a){return this.menu&&b.target.tagName!=this.arrowSelector}});Ext.reg("splitbutton",Ext.SplitButton);Ext.CycleButton=Ext.extend(Ext.SplitButton,{getItemText:function(a){if(a&&this.showText===true){var b="";if(this.prependText){b+=this.prependText}b+=a.text;return b}return undefined},setActiveItem:function(c,a){if(!Ext.isObject(c)){c=this.menu.getComponent(c)}if(c){if(!this.rendered){this.text=this.getItemText(c);this.iconCls=c.iconCls}else{var b=this.getItemText(c);if(b){this.setText(b)}this.setIconClass(c.iconCls)}this.activeItem=c;if(!c.checked){c.setChecked(true,a)}if(this.forceIcon){this.setIconClass(this.forceIcon)}if(!a){this.fireEvent("change",this,c)}}},getActiveItem:function(){return this.activeItem},initComponent:function(){this.addEvents("change");if(this.changeHandler){this.on("change",this.changeHandler,this.scope||this);delete this.changeHandler}this.itemCount=this.items.length;this.menu={cls:"x-cycle-menu",items:[]};var a=0;Ext.each(this.items,function(c,b){Ext.apply(c,{group:c.group||this.id,itemIndex:b,checkHandler:this.checkHandler,scope:this,checked:c.checked||false});this.menu.items.push(c);if(c.checked){a=b}},this);Ext.CycleButton.superclass.initComponent.call(this);this.on("click",this.toggleSelected,this);this.setActiveItem(a,true)},checkHandler:function(a,b){if(b){this.setActiveItem(a)}},toggleSelected:function(){var a=this.menu;a.render();if(!a.hasLayout){a.doLayout()}var d,b;for(var c=1;c<this.itemCount;c++){d=(this.activeItem.itemIndex+c)%this.itemCount;b=a.items.itemAt(d);if(!b.disabled){b.setChecked(true);break}}}});Ext.reg("cycle",Ext.CycleButton);Ext.Toolbar=function(a){if(Ext.isArray(a)){a={items:a,layout:"toolbar"}}else{a=Ext.apply({layout:"toolbar"},a);if(a.buttons){a.items=a.buttons}}Ext.Toolbar.superclass.constructor.call(this,a)};(function(){var a=Ext.Toolbar;Ext.extend(a,Ext.Container,{defaultType:"button",enableOverflow:false,trackMenus:true,internalDefaults:{removeMode:"container",hideParent:true},toolbarCls:"x-toolbar",initComponent:function(){a.superclass.initComponent.call(this);this.addEvents("overflowchange")},onRender:function(c,b){if(!this.el){if(!this.autoCreate){this.autoCreate={cls:this.toolbarCls+" x-small-editor"}}this.el=c.createChild(Ext.apply({id:this.id},this.autoCreate),b);Ext.Toolbar.superclass.onRender.apply(this,arguments)}},lookupComponent:function(b){if(Ext.isString(b)){if(b=="-"){b=new a.Separator()}else{if(b==" "){b=new a.Spacer()}else{if(b=="->"){b=new a.Fill()}else{b=new a.TextItem(b)}}}this.applyDefaults(b)}else{if(b.isFormField||b.render){b=this.createComponent(b)}else{if(b.tag){b=new a.Item({autoEl:b})}else{if(b.tagName){b=new a.Item({el:b})}else{if(Ext.isObject(b)){b=b.xtype?this.createComponent(b):this.constructButton(b)}}}}}return b},applyDefaults:function(e){if(!Ext.isString(e)){e=Ext.Toolbar.superclass.applyDefaults.call(this,e);var b=this.internalDefaults;if(e.events){Ext.applyIf(e.initialConfig,b);Ext.apply(e,b)}else{Ext.applyIf(e,b)}}return e},addSeparator:function(){return this.add(new a.Separator())},addSpacer:function(){return this.add(new a.Spacer())},addFill:function(){this.add(new a.Fill())},addElement:function(b){return this.addItem(new a.Item({el:b}))},addItem:function(b){return this.add.apply(this,arguments)},addButton:function(c){if(Ext.isArray(c)){var e=[];for(var d=0,b=c.length;d<b;d++){e.push(this.addButton(c[d]))}return e}return this.add(this.constructButton(c))},addText:function(b){return this.addItem(new a.TextItem(b))},addDom:function(b){return this.add(new a.Item({autoEl:b}))},addField:function(b){return this.add(b)},insertButton:function(c,g){if(Ext.isArray(g)){var e=[];for(var d=0,b=g.length;d<b;d++){e.push(this.insertButton(c+d,g[d]))}return e}return Ext.Toolbar.superclass.insert.call(this,c,g)},trackMenu:function(c,b){if(this.trackMenus&&c.menu){var d=b?"mun":"mon";this[d](c,"menutriggerover",this.onButtonTriggerOver,this);this[d](c,"menushow",this.onButtonMenuShow,this);this[d](c,"menuhide",this.onButtonMenuHide,this)}},constructButton:function(d){var c=d.events?d:this.createComponent(d,d.split?"splitbutton":this.defaultType);return c},onAdd:function(b){Ext.Toolbar.superclass.onAdd.call(this);this.trackMenu(b);if(this.disabled){b.disable()}},onRemove:function(b){Ext.Toolbar.superclass.onRemove.call(this);if(b==this.activeMenuBtn){delete this.activeMenuBtn}this.trackMenu(b,true)},onDisable:function(){this.items.each(function(b){if(b.disable){b.disable()}})},onEnable:function(){this.items.each(function(b){if(b.enable){b.enable()}})},onButtonTriggerOver:function(b){if(this.activeMenuBtn&&this.activeMenuBtn!=b){this.activeMenuBtn.hideMenu();b.showMenu();this.activeMenuBtn=b}},onButtonMenuShow:function(b){this.activeMenuBtn=b},onButtonMenuHide:function(b){delete this.activeMenuBtn}});Ext.reg("toolbar",Ext.Toolbar);a.Item=Ext.extend(Ext.BoxComponent,{hideParent:true,enable:Ext.emptyFn,disable:Ext.emptyFn,focus:Ext.emptyFn});Ext.reg("tbitem",a.Item);a.Separator=Ext.extend(a.Item,{onRender:function(c,b){this.el=c.createChild({tag:"span",cls:"xtb-sep"},b)}});Ext.reg("tbseparator",a.Separator);a.Spacer=Ext.extend(a.Item,{onRender:function(c,b){this.el=c.createChild({tag:"div",cls:"xtb-spacer",style:this.width?"width:"+this.width+"px":""},b)}});Ext.reg("tbspacer",a.Spacer);a.Fill=Ext.extend(a.Item,{render:Ext.emptyFn,isFill:true});Ext.reg("tbfill",a.Fill);a.TextItem=Ext.extend(a.Item,{constructor:function(b){a.TextItem.superclass.constructor.call(this,Ext.isString(b)?{text:b}:b)},onRender:function(c,b){this.autoEl={cls:"xtb-text",html:this.text||""};a.TextItem.superclass.onRender.call(this,c,b)},setText:function(b){if(this.rendered){this.el.update(b)}else{this.text=b}}});Ext.reg("tbtext",a.TextItem);a.Button=Ext.extend(Ext.Button,{});a.SplitButton=Ext.extend(Ext.SplitButton,{});Ext.reg("tbbutton",a.Button);Ext.reg("tbsplit",a.SplitButton)})();Ext.ButtonGroup=Ext.extend(Ext.Panel,{baseCls:"x-btn-group",layout:"table",defaultType:"button",frame:true,internalDefaults:{removeMode:"container",hideParent:true},initComponent:function(){this.layoutConfig=this.layoutConfig||{};Ext.applyIf(this.layoutConfig,{columns:this.columns});if(!this.title){this.addClass("x-btn-group-notitle")}this.on("afterlayout",this.onAfterLayout,this);Ext.ButtonGroup.superclass.initComponent.call(this)},applyDefaults:function(b){b=Ext.ButtonGroup.superclass.applyDefaults.call(this,b);var a=this.internalDefaults;if(b.events){Ext.applyIf(b.initialConfig,a);Ext.apply(b,a)}else{Ext.applyIf(b,a)}return b},onAfterLayout:function(){var a=this.body.getFrameWidth("lr")+this.body.dom.firstChild.offsetWidth;this.body.setWidth(a);this.el.setWidth(a+this.getFrameWidth())}});Ext.reg("buttongroup",Ext.ButtonGroup);(function(){var a=Ext.Toolbar;Ext.PagingToolbar=Ext.extend(Ext.Toolbar,{pageSize:20,displayMsg:"Displaying {0} - {1} of {2}",emptyMsg:"No data to display",beforePageText:"Page",afterPageText:"of {0}",firstText:"First Page",prevText:"Previous Page",nextText:"Next Page",lastText:"Last Page",refreshText:"Refresh",initComponent:function(){var c=[this.first=new a.Button({tooltip:this.firstText,overflowText:this.firstText,iconCls:"x-tbar-page-first",disabled:true,handler:this.moveFirst,scope:this}),this.prev=new a.Button({tooltip:this.prevText,overflowText:this.prevText,iconCls:"x-tbar-page-prev",disabled:true,handler:this.movePrevious,scope:this}),"-",this.beforePageText,this.inputItem=new Ext.form.NumberField({cls:"x-tbar-page-number",allowDecimals:false,allowNegative:false,enableKeyEvents:true,selectOnFocus:true,submitValue:false,listeners:{scope:this,keydown:this.onPagingKeyDown,blur:this.onPagingBlur}}),this.afterTextItem=new a.TextItem({text:String.format(this.afterPageText,1)}),"-",this.next=new a.Button({tooltip:this.nextText,overflowText:this.nextText,iconCls:"x-tbar-page-next",disabled:true,handler:this.moveNext,scope:this}),this.last=new a.Button({tooltip:this.lastText,overflowText:this.lastText,iconCls:"x-tbar-page-last",disabled:true,handler:this.moveLast,scope:this}),"-",this.refresh=new a.Button({tooltip:this.refreshText,overflowText:this.refreshText,iconCls:"x-tbar-loading",handler:this.doRefresh,scope:this})];var b=this.items||this.buttons||[];if(this.prependButtons){this.items=b.concat(c)}else{this.items=c.concat(b)}delete this.buttons;if(this.displayInfo){this.items.push("->");this.items.push(this.displayItem=new a.TextItem({}))}Ext.PagingToolbar.superclass.initComponent.call(this);this.addEvents("change","beforechange");this.on("afterlayout",this.onFirstLayout,this,{single:true});this.cursor=0;this.bindStore(this.store,true)},onFirstLayout:function(){if(this.dsLoaded){this.onLoad.apply(this,this.dsLoaded)}},updateInfo:function(){if(this.displayItem){var b=this.store.getCount();var c=b==0?this.emptyMsg:String.format(this.displayMsg,this.cursor+1,this.cursor+b,this.store.getTotalCount());this.displayItem.setText(c)}},onLoad:function(b,e,j){if(!this.rendered){this.dsLoaded=[b,e,j];return}var g=this.getParams();this.cursor=(j.params&&j.params[g.start])?j.params[g.start]:0;var i=this.getPageData(),c=i.activePage,h=i.pages;this.afterTextItem.setText(String.format(this.afterPageText,i.pages));this.inputItem.setValue(c);this.first.setDisabled(c==1);this.prev.setDisabled(c==1);this.next.setDisabled(c==h);this.last.setDisabled(c==h);this.refresh.enable();this.updateInfo();this.fireEvent("change",this,i)},getPageData:function(){var b=this.store.getTotalCount();return{total:b,activePage:Math.ceil((this.cursor+this.pageSize)/this.pageSize),pages:b<this.pageSize?1:Math.ceil(b/this.pageSize)}},changePage:function(b){this.doLoad(((b-1)*this.pageSize).constrain(0,this.store.getTotalCount()))},onLoadError:function(){if(!this.rendered){return}this.refresh.enable()},readPage:function(e){var b=this.inputItem.getValue(),c;if(!b||isNaN(c=parseInt(b,10))){this.inputItem.setValue(e.activePage);return false}return c},onPagingFocus:function(){this.inputItem.select()},onPagingBlur:function(b){this.inputItem.setValue(this.getPageData().activePage)},onPagingKeyDown:function(i,h){var c=h.getKey(),j=this.getPageData(),g;if(c==h.RETURN){h.stopEvent();g=this.readPage(j);if(g!==false){g=Math.min(Math.max(1,g),j.pages)-1;this.doLoad(g*this.pageSize)}}else{if(c==h.HOME||c==h.END){h.stopEvent();g=c==h.HOME?1:j.pages;i.setValue(g)}else{if(c==h.UP||c==h.PAGEUP||c==h.DOWN||c==h.PAGEDOWN){h.stopEvent();if((g=this.readPage(j))){var b=h.shiftKey?10:1;if(c==h.DOWN||c==h.PAGEDOWN){b*=-1}g+=b;if(g>=1&g<=j.pages){i.setValue(g)}}}}}},getParams:function(){return this.paramNames||this.store.paramNames},beforeLoad:function(){if(this.rendered&&this.refresh){this.refresh.disable()}},doLoad:function(d){var c={},b=this.getParams();c[b.start]=d;c[b.limit]=this.pageSize;if(this.fireEvent("beforechange",this,c)!==false){this.store.load({params:c})}},moveFirst:function(){this.doLoad(0)},movePrevious:function(){this.doLoad(Math.max(0,this.cursor-this.pageSize))},moveNext:function(){this.doLoad(this.cursor+this.pageSize)},moveLast:function(){var c=this.store.getTotalCount(),b=c%this.pageSize;this.doLoad(b?(c-b):c-this.pageSize)},doRefresh:function(){this.doLoad(this.cursor)},bindStore:function(c,d){var b;if(!d&&this.store){if(c!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.beforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.onLoadError,this)}if(!c){this.store=null}}if(c){c=Ext.StoreMgr.lookup(c);c.on({scope:this,beforeload:this.beforeLoad,load:this.onLoad,exception:this.onLoadError});b=true}this.store=c;if(b){this.onLoad(c,null,{})}},unbind:function(b){this.bindStore(null)},bind:function(b){this.bindStore(b)},onDestroy:function(){this.bindStore(null);Ext.PagingToolbar.superclass.onDestroy.call(this)}})})();Ext.reg("paging",Ext.PagingToolbar);Ext.History=(function(){var e,c;var k=false;var d;function g(){var l=location.href,m=l.indexOf("#"),n=m>=0?l.substr(m+1):null;if(Ext.isGecko){n=decodeURIComponent(n)}return n}function a(){c.value=d}function h(l){d=l;Ext.History.fireEvent("change",l)}function i(m){var l=['<html><body><div id="state">',Ext.util.Format.htmlEncode(m),"</div></body></html>"].join("");try{var o=e.contentWindow.document;o.open();o.write(l);o.close();return true}catch(n){return false}}function b(){if(!e.contentWindow||!e.contentWindow.document){setTimeout(b,10);return}var o=e.contentWindow.document;var m=o.getElementById("state");var l=m?m.innerText:null;var n=g();setInterval(function(){o=e.contentWindow.document;m=o.getElementById("state");var q=m?m.innerText:null;var p=g();if(q!==l){l=q;h(l);location.hash=l;n=l;a()}else{if(p!==n){n=p;i(p)}}},50);k=true;Ext.History.fireEvent("ready",Ext.History)}function j(){d=c.value?c.value:g();if(Ext.isIE){b()}else{var l=g();setInterval(function(){var m=g();if(m!==l){l=m;h(l);a()}},50);k=true;Ext.History.fireEvent("ready",Ext.History)}}return{fieldId:"x-history-field",iframeId:"x-history-frame",events:{},init:function(m,l){if(k){Ext.callback(m,l,[this]);return}if(!Ext.isReady){Ext.onReady(function(){Ext.History.init(m,l)});return}c=Ext.getDom(Ext.History.fieldId);if(Ext.isIE){e=Ext.getDom(Ext.History.iframeId)}this.addEvents("ready","change");if(m){this.on("ready",m,l,{single:true})}j()},add:function(l,m){if(m!==false){if(this.getToken()==l){return true}}if(Ext.isIE){return i(l)}else{location.hash=l;return true}},back:function(){history.go(-1)},forward:function(){history.go(1)},getToken:function(){return k?d:g()}}})();Ext.apply(Ext.History,new Ext.util.Observable());Ext.Tip=Ext.extend(Ext.Panel,{minWidth:40,maxWidth:300,shadow:"sides",defaultAlign:"tl-bl?",autoRender:true,quickShowInterval:250,frame:true,hidden:true,baseCls:"x-tip",floating:{shadow:true,shim:true,useDisplay:true,constrain:false},autoHeight:true,closeAction:"hide",initComponent:function(){Ext.Tip.superclass.initComponent.call(this);if(this.closable&&!this.title){this.elements+=",header"}},afterRender:function(){Ext.Tip.superclass.afterRender.call(this);if(this.closable){this.addTool({id:"close",handler:this[this.closeAction],scope:this})}},showAt:function(a){Ext.Tip.superclass.show.call(this);if(this.measureWidth!==false&&(!this.initialConfig||typeof this.initialConfig.width!="number")){this.doAutoWidth()}if(this.constrainPosition){a=this.el.adjustForConstraints(a)}this.setPagePosition(a[0],a[1])},doAutoWidth:function(a){a=a||0;var b=this.body.getTextWidth();if(this.title){b=Math.max(b,this.header.child("span").getTextWidth(this.title))}b+=this.getFrameWidth()+(this.closable?20:0)+this.body.getPadding("lr")+a;this.setWidth(b.constrain(this.minWidth,this.maxWidth));if(Ext.isIE7&&!this.repainted){this.el.repaint();this.repainted=true}},showBy:function(a,b){if(!this.rendered){this.render(Ext.getBody())}this.showAt(this.el.getAlignToXY(a,b||this.defaultAlign))},initDraggable:function(){this.dd=new Ext.Tip.DD(this,typeof this.draggable=="boolean"?null:this.draggable);this.header.addClass("x-tip-draggable")}});Ext.reg("tip",Ext.Tip);Ext.Tip.DD=function(b,a){Ext.apply(this,a);this.tip=b;Ext.Tip.DD.superclass.constructor.call(this,b.el.id,"WindowDD-"+b.id);this.setHandleElId(b.header.id);this.scroll=false};Ext.extend(Ext.Tip.DD,Ext.dd.DD,{moveOnly:true,scroll:false,headerOffsets:[100,25],startDrag:function(){this.tip.el.disableShadow()},endDrag:function(a){this.tip.el.enableShadow(true)}});Ext.ToolTip=Ext.extend(Ext.Tip,{showDelay:500,hideDelay:200,dismissDelay:5000,trackMouse:false,anchorToTarget:true,anchorOffset:0,targetCounter:0,constrainPosition:false,initComponent:function(){Ext.ToolTip.superclass.initComponent.call(this);this.lastActive=new Date();this.initTarget(this.target);this.origAnchor=this.anchor},onRender:function(b,a){Ext.ToolTip.superclass.onRender.call(this,b,a);this.anchorCls="x-tip-anchor-"+this.getAnchorPosition();this.anchorEl=this.el.createChild({cls:"x-tip-anchor "+this.anchorCls})},afterRender:function(){Ext.ToolTip.superclass.afterRender.call(this);this.anchorEl.setStyle("z-index",this.el.getZIndex()+1).setVisibilityMode(Ext.Element.DISPLAY)},initTarget:function(c){var a;if((a=Ext.get(c))){if(this.target){var b=Ext.get(this.target);this.mun(b,"mouseover",this.onTargetOver,this);this.mun(b,"mouseout",this.onTargetOut,this);this.mun(b,"mousemove",this.onMouseMove,this)}this.mon(a,{mouseover:this.onTargetOver,mouseout:this.onTargetOut,mousemove:this.onMouseMove,scope:this});this.target=a}if(this.anchor){this.anchorTarget=this.target}},onMouseMove:function(b){var a=this.delegate?b.getTarget(this.delegate):this.triggerElement=true;if(a){this.targetXY=b.getXY();if(a===this.triggerElement){if(!this.hidden&&this.trackMouse){this.setPagePosition(this.getTargetXY())}}else{this.hide();this.lastActive=new Date(0);this.onTargetOver(b)}}else{if(!this.closable&&this.isVisible()){this.hide()}}},getTargetXY:function(){if(this.delegate){this.anchorTarget=this.triggerElement}if(this.anchor){this.targetCounter++;var c=this.getOffsets(),l=(this.anchorToTarget&&!this.trackMouse)?this.el.getAlignToXY(this.anchorTarget,this.getAnchorAlign()):this.targetXY,a=Ext.lib.Dom.getViewWidth()-5,h=Ext.lib.Dom.getViewHeight()-5,i=document.documentElement,e=document.body,k=(i.scrollLeft||e.scrollLeft||0)+5,j=(i.scrollTop||e.scrollTop||0)+5,b=[l[0]+c[0],l[1]+c[1]],g=this.getSize();this.anchorEl.removeClass(this.anchorCls);if(this.targetCounter<2){if(b[0]<k){if(this.anchorToTarget){this.defaultAlign="l-r";if(this.mouseOffset){this.mouseOffset[0]*=-1}}this.anchor="left";return this.getTargetXY()}if(b[0]+g.width>a){if(this.anchorToTarget){this.defaultAlign="r-l";if(this.mouseOffset){this.mouseOffset[0]*=-1}}this.anchor="right";return this.getTargetXY()}if(b[1]<j){if(this.anchorToTarget){this.defaultAlign="t-b";if(this.mouseOffset){this.mouseOffset[1]*=-1}}this.anchor="top";return this.getTargetXY()}if(b[1]+g.height>h){if(this.anchorToTarget){this.defaultAlign="b-t";if(this.mouseOffset){this.mouseOffset[1]*=-1}}this.anchor="bottom";return this.getTargetXY()}}this.anchorCls="x-tip-anchor-"+this.getAnchorPosition();this.anchorEl.addClass(this.anchorCls);this.targetCounter=0;return b}else{var d=this.getMouseOffset();return[this.targetXY[0]+d[0],this.targetXY[1]+d[1]]}},getMouseOffset:function(){var a=this.anchor?[0,0]:[15,18];if(this.mouseOffset){a[0]+=this.mouseOffset[0];a[1]+=this.mouseOffset[1]}return a},getAnchorPosition:function(){if(this.anchor){this.tipAnchor=this.anchor.charAt(0)}else{var a=this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);if(!a){throw"AnchorTip.defaultAlign is invalid"}this.tipAnchor=a[1].charAt(0)}switch(this.tipAnchor){case"t":return"top";case"b":return"bottom";case"r":return"right"}return"left"},getAnchorAlign:function(){switch(this.anchor){case"top":return"tl-bl";case"left":return"tl-tr";case"right":return"tr-tl";default:return"bl-tl"}},getOffsets:function(){var b,a=this.getAnchorPosition().charAt(0);if(this.anchorToTarget&&!this.trackMouse){switch(a){case"t":b=[0,9];break;case"b":b=[0,-13];break;case"r":b=[-13,0];break;default:b=[9,0];break}}else{switch(a){case"t":b=[-15-this.anchorOffset,30];break;case"b":b=[-19-this.anchorOffset,-13-this.el.dom.offsetHeight];break;case"r":b=[-15-this.el.dom.offsetWidth,-13-this.anchorOffset];break;default:b=[25,-13-this.anchorOffset];break}}var c=this.getMouseOffset();b[0]+=c[0];b[1]+=c[1];return b},onTargetOver:function(b){if(this.disabled||b.within(this.target.dom,true)){return}var a=b.getTarget(this.delegate);if(a){this.triggerElement=a;this.clearTimer("hide");this.targetXY=b.getXY();this.delayShow()}},delayShow:function(){if(this.hidden&&!this.showTimer){if(this.lastActive.getElapsed()<this.quickShowInterval){this.show()}else{this.showTimer=this.show.defer(this.showDelay,this)}}else{if(!this.hidden&&this.autoHide!==false){this.show()}}},onTargetOut:function(a){if(this.disabled||a.within(this.target.dom,true)){return}this.clearTimer("show");if(this.autoHide!==false){this.delayHide()}},delayHide:function(){if(!this.hidden&&!this.hideTimer){this.hideTimer=this.hide.defer(this.hideDelay,this)}},hide:function(){this.clearTimer("dismiss");this.lastActive=new Date();if(this.anchorEl){this.anchorEl.hide()}Ext.ToolTip.superclass.hide.call(this);delete this.triggerElement},show:function(){if(this.anchor){this.showAt([-1000,-1000]);this.origConstrainPosition=this.constrainPosition;this.constrainPosition=false;this.anchor=this.origAnchor}this.showAt(this.getTargetXY());if(this.anchor){this.anchorEl.show();this.syncAnchor();this.constrainPosition=this.origConstrainPosition}else{this.anchorEl.hide()}},showAt:function(a){this.lastActive=new Date();this.clearTimers();Ext.ToolTip.superclass.showAt.call(this,a);if(this.dismissDelay&&this.autoHide!==false){this.dismissTimer=this.hide.defer(this.dismissDelay,this)}if(this.anchor&&!this.anchorEl.isVisible()){this.syncAnchor();this.anchorEl.show()}else{this.anchorEl.hide()}},syncAnchor:function(){var a,b,c;switch(this.tipAnchor.charAt(0)){case"t":a="b";b="tl";c=[20+this.anchorOffset,2];break;case"r":a="l";b="tr";c=[-2,11+this.anchorOffset];break;case"b":a="t";b="bl";c=[20+this.anchorOffset,-2];break;default:a="r";b="tl";c=[2,11+this.anchorOffset];break}this.anchorEl.alignTo(this.el,a+"-"+b,c)},setPagePosition:function(a,b){Ext.ToolTip.superclass.setPagePosition.call(this,a,b);if(this.anchor){this.syncAnchor()}},clearTimer:function(a){a=a+"Timer";clearTimeout(this[a]);delete this[a]},clearTimers:function(){this.clearTimer("show");this.clearTimer("dismiss");this.clearTimer("hide")},onShow:function(){Ext.ToolTip.superclass.onShow.call(this);Ext.getDoc().on("mousedown",this.onDocMouseDown,this)},onHide:function(){Ext.ToolTip.superclass.onHide.call(this);Ext.getDoc().un("mousedown",this.onDocMouseDown,this)},onDocMouseDown:function(a){if(this.autoHide!==true&&!this.closable&&!a.within(this.el.dom)){this.disable();this.doEnable.defer(100,this)}},doEnable:function(){if(!this.isDestroyed){this.enable()}},onDisable:function(){this.clearTimers();this.hide()},adjustPosition:function(a,d){if(this.constrainPosition){var c=this.targetXY[1],b=this.getSize().height;if(d<=c&&(d+b)>=c){d=c-b-5}}return{x:a,y:d}},beforeDestroy:function(){this.clearTimers();Ext.destroy(this.anchorEl);delete this.anchorEl;delete this.target;delete this.anchorTarget;delete this.triggerElement;Ext.ToolTip.superclass.beforeDestroy.call(this)},onDestroy:function(){Ext.getDoc().un("mousedown",this.onDocMouseDown,this);Ext.ToolTip.superclass.onDestroy.call(this)}});Ext.reg("tooltip",Ext.ToolTip);Ext.QuickTip=Ext.extend(Ext.ToolTip,{interceptTitles:false,tagConfig:{namespace:"ext",attribute:"qtip",width:"qwidth",target:"target",title:"qtitle",hide:"hide",cls:"qclass",align:"qalign",anchor:"anchor"},initComponent:function(){this.target=this.target||Ext.getDoc();this.targets=this.targets||{};Ext.QuickTip.superclass.initComponent.call(this)},register:function(e){var h=Ext.isArray(e)?e:arguments;for(var g=0,a=h.length;g<a;g++){var l=h[g];var k=l.target;if(k){if(Ext.isArray(k)){for(var d=0,b=k.length;d<b;d++){this.targets[Ext.id(k[d])]=l}}else{this.targets[Ext.id(k)]=l}}}},unregister:function(a){delete this.targets[Ext.id(a)]},cancelShow:function(b){var a=this.activeTarget;b=Ext.get(b).dom;if(this.isVisible()){if(a&&a.el==b){this.hide()}}else{if(a&&a.el==b){this.clearTimer("show")}}},getTipCfg:function(d){var b=d.getTarget(),c,a;if(this.interceptTitles&&b.title&&Ext.isString(b.title)){c=b.title;b.qtip=c;b.removeAttribute("title");d.preventDefault()}else{a=this.tagConfig;c=b.qtip||Ext.fly(b).getAttribute(a.attribute,a.namespace)}return c},onTargetOver:function(i){if(this.disabled){return}this.targetXY=i.getXY();var c=i.getTarget();if(!c||c.nodeType!==1||c==document||c==document.body){return}if(this.activeTarget&&((c==this.activeTarget.el)||Ext.fly(this.activeTarget.el).contains(c))){this.clearTimer("hide");this.show();return}if(c&&this.targets[c.id]){this.activeTarget=this.targets[c.id];this.activeTarget.el=c;this.anchor=this.activeTarget.anchor;if(this.anchor){this.anchorTarget=c}this.delayShow();return}var g,h=Ext.fly(c),b=this.tagConfig,d=b.namespace;if(g=this.getTipCfg(i)){var a=h.getAttribute(b.hide,d);this.activeTarget={el:c,text:g,width:h.getAttribute(b.width,d),autoHide:a!="user"&&a!=="false",title:h.getAttribute(b.title,d),cls:h.getAttribute(b.cls,d),align:h.getAttribute(b.align,d)};this.anchor=h.getAttribute(b.anchor,d);if(this.anchor){this.anchorTarget=c}this.delayShow()}},onTargetOut:function(a){if(this.activeTarget&&a.within(this.activeTarget.el)&&!this.getTipCfg(a)){return}this.clearTimer("show");if(this.autoHide!==false){this.delayHide()}},showAt:function(b){var a=this.activeTarget;if(a){if(!this.rendered){this.render(Ext.getBody());this.activeTarget=a}if(a.width){this.setWidth(a.width);this.body.setWidth(this.adjustBodyWidth(a.width-this.getFrameWidth()));this.measureWidth=false}else{this.measureWidth=true}this.setTitle(a.title||"");this.body.update(a.text);this.autoHide=a.autoHide;this.dismissDelay=a.dismissDelay||this.dismissDelay;if(this.lastCls){this.el.removeClass(this.lastCls);delete this.lastCls}if(a.cls){this.el.addClass(a.cls);this.lastCls=a.cls}if(this.anchor){this.constrainPosition=false}else{if(a.align){b=this.el.getAlignToXY(a.el,a.align);this.constrainPosition=false}else{this.constrainPosition=true}}}Ext.QuickTip.superclass.showAt.call(this,b)},hide:function(){delete this.activeTarget;Ext.QuickTip.superclass.hide.call(this)}});Ext.reg("quicktip",Ext.QuickTip);Ext.QuickTips=function(){var b,a=false;return{init:function(c){if(!b){if(!Ext.isReady){Ext.onReady(function(){Ext.QuickTips.init(c)});return}b=new Ext.QuickTip({elements:"header,body",disabled:a});if(c!==false){b.render(Ext.getBody())}}},ddDisable:function(){if(b&&!a){b.disable()}},ddEnable:function(){if(b&&!a){b.enable()}},enable:function(){if(b){b.enable()}a=false},disable:function(){if(b){b.disable()}a=true},isEnabled:function(){return b!==undefined&&!b.disabled},getQuickTip:function(){return b},register:function(){b.register.apply(b,arguments)},unregister:function(){b.unregister.apply(b,arguments)},tips:function(){b.register.apply(b,arguments)}}}();Ext.slider.Tip=Ext.extend(Ext.Tip,{minWidth:10,offsets:[0,-10],init:function(a){a.on({scope:this,dragstart:this.onSlide,drag:this.onSlide,dragend:this.hide,destroy:this.destroy})},onSlide:function(b,c,a){this.show();this.body.update(this.getText(a));this.doAutoWidth();this.el.alignTo(a.el,"b-t?",this.offsets)},getText:function(a){return String(a.value)}});Ext.ux.SliderTip=Ext.slider.Tip;Ext.tree.TreePanel=Ext.extend(Ext.Panel,{rootVisible:true,animate:Ext.enableFx,lines:true,enableDD:false,hlDrop:Ext.enableFx,pathSeparator:"/",bubbleEvents:[],initComponent:function(){Ext.tree.TreePanel.superclass.initComponent.call(this);if(!this.eventModel){this.eventModel=new Ext.tree.TreeEventModel(this)}var a=this.loader;if(!a){a=new Ext.tree.TreeLoader({dataUrl:this.dataUrl,requestMethod:this.requestMethod})}else{if(Ext.isObject(a)&&!a.load){a=new Ext.tree.TreeLoader(a)}}this.loader=a;this.nodeHash={};if(this.root){var b=this.root;delete this.root;this.setRootNode(b)}this.addEvents("append","remove","movenode","insert","beforeappend","beforeremove","beforemovenode","beforeinsert","beforeload","load","textchange","beforeexpandnode","beforecollapsenode","expandnode","disabledchange","collapsenode","beforeclick","click","containerclick","checkchange","beforedblclick","dblclick","containerdblclick","contextmenu","containercontextmenu","beforechildrenrendered","startdrag","enddrag","dragdrop","beforenodedrop","nodedrop","nodedragover");if(this.singleExpand){this.on("beforeexpandnode",this.restrictExpand,this)}},proxyNodeEvent:function(c,b,a,h,g,e,d){if(c=="collapse"||c=="expand"||c=="beforecollapse"||c=="beforeexpand"||c=="move"||c=="beforemove"){c=c+"node"}return this.fireEvent(c,b,a,h,g,e,d)},getRootNode:function(){return this.root},setRootNode:function(b){this.destroyRoot();if(!b.render){b=this.loader.createNode(b)}this.root=b;b.ownerTree=this;b.isRoot=true;this.registerNode(b);if(!this.rootVisible){var a=b.attributes.uiProvider;b.ui=a?new a(b):new Ext.tree.RootTreeNodeUI(b)}if(this.innerCt){this.clearInnerCt();this.renderRoot()}return b},clearInnerCt:function(){this.innerCt.update("")},renderRoot:function(){this.root.render();if(!this.rootVisible){this.root.renderChildren()}},getNodeById:function(a){return this.nodeHash[a]},registerNode:function(a){this.nodeHash[a.id]=a},unregisterNode:function(a){delete this.nodeHash[a.id]},toString:function(){return"[Tree"+(this.id?" "+this.id:"")+"]"},restrictExpand:function(a){var b=a.parentNode;if(b){if(b.expandedChild&&b.expandedChild.parentNode==b){b.expandedChild.collapse()}b.expandedChild=a}},getChecked:function(b,c){c=c||this.root;var d=[];var e=function(){if(this.attributes.checked){d.push(!b?this:(b=="id"?this.id:this.attributes[b]))}};c.cascade(e);return d},getLoader:function(){return this.loader},expandAll:function(){this.root.expand(true)},collapseAll:function(){this.root.collapse(true)},getSelectionModel:function(){if(!this.selModel){this.selModel=new Ext.tree.DefaultSelectionModel()}return this.selModel},expandPath:function(g,a,h){if(Ext.isEmpty(g)){if(h){h(false,undefined)}return}a=a||"id";var d=g.split(this.pathSeparator);var c=this.root;if(c.attributes[a]!=d[1]){if(h){h(false,null)}return}var b=1;var e=function(){if(++b==d.length){if(h){h(true,c)}return}var i=c.findChild(a,d[b]);if(!i){if(h){h(false,c)}return}c=i;i.expand(false,false,e)};c.expand(false,false,e)},selectPath:function(e,a,g){if(Ext.isEmpty(e)){if(g){g(false,undefined)}return}a=a||"id";var c=e.split(this.pathSeparator),b=c.pop();if(c.length>1){var d=function(i,h){if(i&&h){var j=h.findChild(a,b);if(j){j.select();if(g){g(true,j)}}else{if(g){g(false,j)}}}else{if(g){g(false,j)}}};this.expandPath(c.join(this.pathSeparator),a,d)}else{this.root.select();if(g){g(true,this.root)}}},getTreeEl:function(){return this.body},onRender:function(b,a){Ext.tree.TreePanel.superclass.onRender.call(this,b,a);this.el.addClass("x-tree");this.innerCt=this.body.createChild({tag:"ul",cls:"x-tree-root-ct "+(this.useArrows?"x-tree-arrows":this.lines?"x-tree-lines":"x-tree-no-lines")})},initEvents:function(){Ext.tree.TreePanel.superclass.initEvents.call(this);if(this.containerScroll){Ext.dd.ScrollManager.register(this.body)}if((this.enableDD||this.enableDrop)&&!this.dropZone){this.dropZone=new Ext.tree.TreeDropZone(this,this.dropConfig||{ddGroup:this.ddGroup||"TreeDD",appendOnly:this.ddAppendOnly===true})}if((this.enableDD||this.enableDrag)&&!this.dragZone){this.dragZone=new Ext.tree.TreeDragZone(this,this.dragConfig||{ddGroup:this.ddGroup||"TreeDD",scroll:this.ddScroll})}this.getSelectionModel().init(this)},afterRender:function(){Ext.tree.TreePanel.superclass.afterRender.call(this);this.renderRoot()},beforeDestroy:function(){if(this.rendered){Ext.dd.ScrollManager.unregister(this.body);Ext.destroy(this.dropZone,this.dragZone)}this.destroyRoot();Ext.destroy(this.loader);this.nodeHash=this.root=this.loader=null;Ext.tree.TreePanel.superclass.beforeDestroy.call(this)},destroyRoot:function(){if(this.root&&this.root.destroy){this.root.destroy(true)}}});Ext.tree.TreePanel.nodeTypes={};Ext.reg("treepanel",Ext.tree.TreePanel);Ext.tree.TreeEventModel=function(a){this.tree=a;this.tree.on("render",this.initEvents,this)};Ext.tree.TreeEventModel.prototype={initEvents:function(){var a=this.tree;if(a.trackMouseOver!==false){a.mon(a.innerCt,{scope:this,mouseover:this.delegateOver,mouseout:this.delegateOut})}a.mon(a.getTreeEl(),{scope:this,click:this.delegateClick,dblclick:this.delegateDblClick,contextmenu:this.delegateContextMenu})},getNode:function(b){var a;if(a=b.getTarget(".x-tree-node-el",10)){var c=Ext.fly(a,"_treeEvents").getAttribute("tree-node-id","ext");if(c){return this.tree.getNodeById(c)}}return null},getNodeTarget:function(b){var a=b.getTarget(".x-tree-node-icon",1);if(!a){a=b.getTarget(".x-tree-node-el",6)}return a},delegateOut:function(b,a){if(!this.beforeEvent(b)){return}if(b.getTarget(".x-tree-ec-icon",1)){var c=this.getNode(b);this.onIconOut(b,c);if(c==this.lastEcOver){delete this.lastEcOver}}if((a=this.getNodeTarget(b))&&!b.within(a,true)){this.onNodeOut(b,this.getNode(b))}},delegateOver:function(b,a){if(!this.beforeEvent(b)){return}if(Ext.isGecko&&!this.trackingDoc){Ext.getBody().on("mouseover",this.trackExit,this);this.trackingDoc=true}if(this.lastEcOver){this.onIconOut(b,this.lastEcOver);delete this.lastEcOver}if(b.getTarget(".x-tree-ec-icon",1)){this.lastEcOver=this.getNode(b);this.onIconOver(b,this.lastEcOver)}if(a=this.getNodeTarget(b)){this.onNodeOver(b,this.getNode(b))}},trackExit:function(a){if(this.lastOverNode){if(this.lastOverNode.ui&&!a.within(this.lastOverNode.ui.getEl())){this.onNodeOut(a,this.lastOverNode)}delete this.lastOverNode;Ext.getBody().un("mouseover",this.trackExit,this);this.trackingDoc=false}},delegateClick:function(b,a){if(this.beforeEvent(b)){if(b.getTarget("input[type=checkbox]",1)){this.onCheckboxClick(b,this.getNode(b))}else{if(b.getTarget(".x-tree-ec-icon",1)){this.onIconClick(b,this.getNode(b))}else{if(this.getNodeTarget(b)){this.onNodeClick(b,this.getNode(b))}}}}else{this.checkContainerEvent(b,"click")}},delegateDblClick:function(b,a){if(this.beforeEvent(b)){if(this.getNodeTarget(b)){this.onNodeDblClick(b,this.getNode(b))}}else{this.checkContainerEvent(b,"dblclick")}},delegateContextMenu:function(b,a){if(this.beforeEvent(b)){if(this.getNodeTarget(b)){this.onNodeContextMenu(b,this.getNode(b))}}else{this.checkContainerEvent(b,"contextmenu")}},checkContainerEvent:function(b,a){if(this.disabled){b.stopEvent();return false}this.onContainerEvent(b,a)},onContainerEvent:function(b,a){this.tree.fireEvent("container"+a,this.tree,b)},onNodeClick:function(b,a){a.ui.onClick(b)},onNodeOver:function(b,a){this.lastOverNode=a;a.ui.onOver(b)},onNodeOut:function(b,a){a.ui.onOut(b)},onIconOver:function(b,a){a.ui.addClass("x-tree-ec-over")},onIconOut:function(b,a){a.ui.removeClass("x-tree-ec-over")},onIconClick:function(b,a){a.ui.ecClick(b)},onCheckboxClick:function(b,a){a.ui.onCheckChange(b)},onNodeDblClick:function(b,a){a.ui.onDblClick(b)},onNodeContextMenu:function(b,a){a.ui.onContextMenu(b)},beforeEvent:function(b){var a=this.getNode(b);if(this.disabled||!a||!a.ui){b.stopEvent();return false}return true},disable:function(){this.disabled=true},enable:function(){this.disabled=false}};Ext.tree.DefaultSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(a){this.selNode=null;this.addEvents("selectionchange","beforeselect");Ext.apply(this,a);Ext.tree.DefaultSelectionModel.superclass.constructor.call(this)},init:function(a){this.tree=a;a.mon(a.getTreeEl(),"keydown",this.onKeyDown,this);a.on("click",this.onNodeClick,this)},onNodeClick:function(a,b){this.select(a)},select:function(c,a){if(!Ext.fly(c.ui.wrap).isVisible()&&a){return a.call(this,c)}var b=this.selNode;if(c==b){c.ui.onSelectedChange(true)}else{if(this.fireEvent("beforeselect",this,c,b)!==false){if(b&&b.ui){b.ui.onSelectedChange(false)}this.selNode=c;c.ui.onSelectedChange(true);this.fireEvent("selectionchange",this,c,b)}}return c},unselect:function(b,a){if(this.selNode==b){this.clearSelections(a)}},clearSelections:function(a){var b=this.selNode;if(b){b.ui.onSelectedChange(false);this.selNode=null;if(a!==true){this.fireEvent("selectionchange",this,null)}}return b},getSelectedNode:function(){return this.selNode},isSelected:function(a){return this.selNode==a},selectPrevious:function(a){if(!(a=a||this.selNode||this.lastSelNode)){return null}var c=a.previousSibling;if(c){if(!c.isExpanded()||c.childNodes.length<1){return this.select(c,this.selectPrevious)}else{var b=c.lastChild;while(b&&b.isExpanded()&&Ext.fly(b.ui.wrap).isVisible()&&b.childNodes.length>0){b=b.lastChild}return this.select(b,this.selectPrevious)}}else{if(a.parentNode&&(this.tree.rootVisible||!a.parentNode.isRoot)){return this.select(a.parentNode,this.selectPrevious)}}return null},selectNext:function(b){if(!(b=b||this.selNode||this.lastSelNode)){return null}if(b.firstChild&&b.isExpanded()&&Ext.fly(b.ui.wrap).isVisible()){return this.select(b.firstChild,this.selectNext)}else{if(b.nextSibling){return this.select(b.nextSibling,this.selectNext)}else{if(b.parentNode){var a=null;b.parentNode.bubble(function(){if(this.nextSibling){a=this.getOwnerTree().selModel.select(this.nextSibling,this.selectNext);return false}});return a}}}return null},onKeyDown:function(c){var b=this.selNode||this.lastSelNode;var d=this;if(!b){return}var a=c.getKey();switch(a){case c.DOWN:c.stopEvent();this.selectNext();break;case c.UP:c.stopEvent();this.selectPrevious();break;case c.RIGHT:c.preventDefault();if(b.hasChildNodes()){if(!b.isExpanded()){b.expand()}else{if(b.firstChild){this.select(b.firstChild,c)}}}break;case c.LEFT:c.preventDefault();if(b.hasChildNodes()&&b.isExpanded()){b.collapse()}else{if(b.parentNode&&(this.tree.rootVisible||b.parentNode!=this.tree.getRootNode())){this.select(b.parentNode,c)}}break}}});Ext.tree.MultiSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(a){this.selNodes=[];this.selMap={};this.addEvents("selectionchange");Ext.apply(this,a);Ext.tree.MultiSelectionModel.superclass.constructor.call(this)},init:function(a){this.tree=a;a.mon(a.getTreeEl(),"keydown",this.onKeyDown,this);a.on("click",this.onNodeClick,this)},onNodeClick:function(a,b){if(b.ctrlKey&&this.isSelected(a)){this.unselect(a)}else{this.select(a,b,b.ctrlKey)}},select:function(a,c,b){if(b!==true){this.clearSelections(true)}if(this.isSelected(a)){this.lastSelNode=a;return a}this.selNodes.push(a);this.selMap[a.id]=a;this.lastSelNode=a;a.ui.onSelectedChange(true);this.fireEvent("selectionchange",this,this.selNodes);return a},unselect:function(b){if(this.selMap[b.id]){b.ui.onSelectedChange(false);var c=this.selNodes;var a=c.indexOf(b);if(a!=-1){this.selNodes.splice(a,1)}delete this.selMap[b.id];this.fireEvent("selectionchange",this,this.selNodes)}},clearSelections:function(b){var d=this.selNodes;if(d.length>0){for(var c=0,a=d.length;c<a;c++){d[c].ui.onSelectedChange(false)}this.selNodes=[];this.selMap={};if(b!==true){this.fireEvent("selectionchange",this,this.selNodes)}}},isSelected:function(a){return this.selMap[a.id]?true:false},getSelectedNodes:function(){return this.selNodes.concat([])},onKeyDown:Ext.tree.DefaultSelectionModel.prototype.onKeyDown,selectNext:Ext.tree.DefaultSelectionModel.prototype.selectNext,selectPrevious:Ext.tree.DefaultSelectionModel.prototype.selectPrevious});Ext.data.Tree=Ext.extend(Ext.util.Observable,{constructor:function(a){this.nodeHash={};this.root=null;if(a){this.setRootNode(a)}this.addEvents("append","remove","move","insert","beforeappend","beforeremove","beforemove","beforeinsert");Ext.data.Tree.superclass.constructor.call(this)},pathSeparator:"/",proxyNodeEvent:function(){return this.fireEvent.apply(this,arguments)},getRootNode:function(){return this.root},setRootNode:function(a){this.root=a;a.ownerTree=this;a.isRoot=true;this.registerNode(a);return a},getNodeById:function(a){return this.nodeHash[a]},registerNode:function(a){this.nodeHash[a.id]=a},unregisterNode:function(a){delete this.nodeHash[a.id]},toString:function(){return"[Tree"+(this.id?" "+this.id:"")+"]"}});Ext.data.Node=Ext.extend(Ext.util.Observable,{constructor:function(a){this.attributes=a||{};this.leaf=this.attributes.leaf;this.id=this.attributes.id;if(!this.id){this.id=Ext.id(null,"xnode-");this.attributes.id=this.id}this.childNodes=[];this.parentNode=null;this.firstChild=null;this.lastChild=null;this.previousSibling=null;this.nextSibling=null;this.addEvents({append:true,remove:true,move:true,insert:true,beforeappend:true,beforeremove:true,beforemove:true,beforeinsert:true});this.listeners=this.attributes.listeners;Ext.data.Node.superclass.constructor.call(this)},fireEvent:function(b){if(Ext.data.Node.superclass.fireEvent.apply(this,arguments)===false){return false}var a=this.getOwnerTree();if(a){if(a.proxyNodeEvent.apply(a,arguments)===false){return false}}return true},isLeaf:function(){return this.leaf===true},setFirstChild:function(a){this.firstChild=a},setLastChild:function(a){this.lastChild=a},isLast:function(){return(!this.parentNode?true:this.parentNode.lastChild==this)},isFirst:function(){return(!this.parentNode?true:this.parentNode.firstChild==this)},hasChildNodes:function(){return !this.isLeaf()&&this.childNodes.length>0},isExpandable:function(){return this.attributes.expandable||this.hasChildNodes()},appendChild:function(e){var g=false;if(Ext.isArray(e)){g=e}else{if(arguments.length>1){g=arguments}}if(g){for(var d=0,a=g.length;d<a;d++){this.appendChild(g[d])}}else{if(this.fireEvent("beforeappend",this.ownerTree,this,e)===false){return false}var b=this.childNodes.length;var c=e.parentNode;if(c){if(e.fireEvent("beforemove",e.getOwnerTree(),e,c,this,b)===false){return false}c.removeChild(e)}b=this.childNodes.length;if(b===0){this.setFirstChild(e)}this.childNodes.push(e);e.parentNode=this;var h=this.childNodes[b-1];if(h){e.previousSibling=h;h.nextSibling=e}else{e.previousSibling=null}e.nextSibling=null;this.setLastChild(e);e.setOwnerTree(this.getOwnerTree());this.fireEvent("append",this.ownerTree,this,e,b);if(c){e.fireEvent("move",this.ownerTree,e,c,this,b)}return e}},removeChild:function(c,b){var a=this.childNodes.indexOf(c);if(a==-1){return false}if(this.fireEvent("beforeremove",this.ownerTree,this,c)===false){return false}this.childNodes.splice(a,1);if(c.previousSibling){c.previousSibling.nextSibling=c.nextSibling}if(c.nextSibling){c.nextSibling.previousSibling=c.previousSibling}if(this.firstChild==c){this.setFirstChild(c.nextSibling)}if(this.lastChild==c){this.setLastChild(c.previousSibling)}this.fireEvent("remove",this.ownerTree,this,c);if(b){c.destroy(true)}else{c.clear()}return c},clear:function(a){this.setOwnerTree(null,a);this.parentNode=this.previousSibling=this.nextSibling=null;if(a){this.firstChild=this.lastChild=null}},destroy:function(a){if(a===true){this.purgeListeners();this.clear(true);Ext.each(this.childNodes,function(b){b.destroy(true)});this.childNodes=null}else{this.remove(true)}},insertBefore:function(d,a){if(!a){return this.appendChild(d)}if(d==a){return false}if(this.fireEvent("beforeinsert",this.ownerTree,this,d,a)===false){return false}var b=this.childNodes.indexOf(a);var c=d.parentNode;var e=b;if(c==this&&this.childNodes.indexOf(d)<b){e--}if(c){if(d.fireEvent("beforemove",d.getOwnerTree(),d,c,this,b,a)===false){return false}c.removeChild(d)}if(e===0){this.setFirstChild(d)}this.childNodes.splice(e,0,d);d.parentNode=this;var g=this.childNodes[e-1];if(g){d.previousSibling=g;g.nextSibling=d}else{d.previousSibling=null}d.nextSibling=a;a.previousSibling=d;d.setOwnerTree(this.getOwnerTree());this.fireEvent("insert",this.ownerTree,this,d,a);if(c){d.fireEvent("move",this.ownerTree,d,c,this,e,a)}return d},remove:function(a){if(this.parentNode){this.parentNode.removeChild(this,a)}return this},removeAll:function(a){var c=this.childNodes,b;while((b=c[0])){this.removeChild(b,a)}return this},item:function(a){return this.childNodes[a]},replaceChild:function(a,c){var b=c?c.nextSibling:null;this.removeChild(c);this.insertBefore(a,b);return c},indexOf:function(a){return this.childNodes.indexOf(a)},getOwnerTree:function(){if(!this.ownerTree){var a=this;while(a){if(a.ownerTree){this.ownerTree=a.ownerTree;break}a=a.parentNode}}return this.ownerTree},getDepth:function(){var b=0;var a=this;while(a.parentNode){++b;a=a.parentNode}return b},setOwnerTree:function(a,b){if(a!=this.ownerTree){if(this.ownerTree){this.ownerTree.unregisterNode(this)}this.ownerTree=a;if(b!==true){Ext.each(this.childNodes,function(c){c.setOwnerTree(a)})}if(a){a.registerNode(this)}}},setId:function(b){if(b!==this.id){var a=this.ownerTree;if(a){a.unregisterNode(this)}this.id=this.attributes.id=b;if(a){a.registerNode(this)}this.onIdChange(b)}},onIdChange:Ext.emptyFn,getPath:function(c){c=c||"id";var e=this.parentNode;var a=[this.attributes[c]];while(e){a.unshift(e.attributes[c]);e=e.parentNode}var d=this.getOwnerTree().pathSeparator;return d+a.join(d)},bubble:function(c,b,a){var d=this;while(d){if(c.apply(b||d,a||[d])===false){break}d=d.parentNode}},cascade:function(g,e,b){if(g.apply(e||this,b||[this])!==false){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].cascade(g,e,b)}}},eachChild:function(g,e,b){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){if(g.apply(e||d[c],b||[d[c]])===false){break}}},findChild:function(b,c,a){return this.findChildBy(function(){return this.attributes[b]==c},null,a)},findChildBy:function(h,g,b){var e=this.childNodes,a=e.length,d=0,j,c;for(;d<a;d++){j=e[d];if(h.call(g||j,j)===true){return j}else{if(b){c=j.findChildBy(h,g,b);if(c!=null){return c}}}}return null},sort:function(e,d){var c=this.childNodes;var a=c.length;if(a>0){var g=d?function(){e.apply(d,arguments)}:e;c.sort(g);for(var b=0;b<a;b++){var h=c[b];h.previousSibling=c[b-1];h.nextSibling=c[b+1];if(b===0){this.setFirstChild(h)}if(b==a-1){this.setLastChild(h)}}}},contains:function(a){return a.isAncestor(this)},isAncestor:function(a){var b=this.parentNode;while(b){if(b==a){return true}b=b.parentNode}return false},toString:function(){return"[Node"+(this.id?" "+this.id:"")+"]"}});Ext.tree.TreeNode=Ext.extend(Ext.data.Node,{constructor:function(a){a=a||{};if(Ext.isString(a)){a={text:a}}this.childrenRendered=false;this.rendered=false;Ext.tree.TreeNode.superclass.constructor.call(this,a);this.expanded=a.expanded===true;this.isTarget=a.isTarget!==false;this.draggable=a.draggable!==false&&a.allowDrag!==false;this.allowChildren=a.allowChildren!==false&&a.allowDrop!==false;this.text=a.text;this.disabled=a.disabled===true;this.hidden=a.hidden===true;this.addEvents("textchange","beforeexpand","beforecollapse","expand","disabledchange","collapse","beforeclick","click","checkchange","beforedblclick","dblclick","contextmenu","beforechildrenrendered");var b=this.attributes.uiProvider||this.defaultUI||Ext.tree.TreeNodeUI;this.ui=new b(this)},preventHScroll:true,isExpanded:function(){return this.expanded},getUI:function(){return this.ui},getLoader:function(){var a;return this.loader||((a=this.getOwnerTree())&&a.loader?a.loader:(this.loader=new Ext.tree.TreeLoader()))},setFirstChild:function(a){var b=this.firstChild;Ext.tree.TreeNode.superclass.setFirstChild.call(this,a);if(this.childrenRendered&&b&&a!=b){b.renderIndent(true,true)}if(this.rendered){this.renderIndent(true,true)}},setLastChild:function(b){var a=this.lastChild;Ext.tree.TreeNode.superclass.setLastChild.call(this,b);if(this.childrenRendered&&a&&b!=a){a.renderIndent(true,true)}if(this.rendered){this.renderIndent(true,true)}},appendChild:function(b){if(!b.render&&!Ext.isArray(b)){b=this.getLoader().createNode(b)}var a=Ext.tree.TreeNode.superclass.appendChild.call(this,b);if(a&&this.childrenRendered){a.render()}this.ui.updateExpandIcon();return a},removeChild:function(b,a){this.ownerTree.getSelectionModel().unselect(b);Ext.tree.TreeNode.superclass.removeChild.apply(this,arguments);if(!a){var c=b.ui.rendered;if(c){b.ui.remove()}if(c&&this.childNodes.length<1){this.collapse(false,false)}else{this.ui.updateExpandIcon()}if(!this.firstChild&&!this.isHiddenRoot()){this.childrenRendered=false}}return b},insertBefore:function(c,a){if(!c.render){c=this.getLoader().createNode(c)}var b=Ext.tree.TreeNode.superclass.insertBefore.call(this,c,a);if(b&&a&&this.childrenRendered){c.render()}this.ui.updateExpandIcon();return b},setText:function(b){var a=this.text;this.text=this.attributes.text=b;if(this.rendered){this.ui.onTextChange(this,b,a)}this.fireEvent("textchange",this,b,a)},setIconCls:function(b){var a=this.attributes.iconCls;this.attributes.iconCls=b;if(this.rendered){this.ui.onIconClsChange(this,b,a)}},setTooltip:function(a,b){this.attributes.qtip=a;this.attributes.qtipTitle=b;if(this.rendered){this.ui.onTipChange(this,a,b)}},setIcon:function(a){this.attributes.icon=a;if(this.rendered){this.ui.onIconChange(this,a)}},setHref:function(a,b){this.attributes.href=a;this.attributes.hrefTarget=b;if(this.rendered){this.ui.onHrefChange(this,a,b)}},setCls:function(b){var a=this.attributes.cls;this.attributes.cls=b;if(this.rendered){this.ui.onClsChange(this,b,a)}},select:function(){var a=this.getOwnerTree();if(a){a.getSelectionModel().select(this)}},unselect:function(a){var b=this.getOwnerTree();if(b){b.getSelectionModel().unselect(this,a)}},isSelected:function(){var a=this.getOwnerTree();return a?a.getSelectionModel().isSelected(this):false},expand:function(a,c,d,b){if(!this.expanded){if(this.fireEvent("beforeexpand",this,a,c)===false){return}if(!this.childrenRendered){this.renderChildren()}this.expanded=true;if(!this.isHiddenRoot()&&(this.getOwnerTree().animate&&c!==false)||c){this.ui.animExpand(function(){this.fireEvent("expand",this);this.runCallback(d,b||this,[this]);if(a===true){this.expandChildNodes(true,true)}}.createDelegate(this));return}else{this.ui.expand();this.fireEvent("expand",this);this.runCallback(d,b||this,[this])}}else{this.runCallback(d,b||this,[this])}if(a===true){this.expandChildNodes(true)}},runCallback:function(a,c,b){if(Ext.isFunction(a)){a.apply(c,b)}},isHiddenRoot:function(){return this.isRoot&&!this.getOwnerTree().rootVisible},collapse:function(b,g,h,e){if(this.expanded&&!this.isHiddenRoot()){if(this.fireEvent("beforecollapse",this,b,g)===false){return}this.expanded=false;if((this.getOwnerTree().animate&&g!==false)||g){this.ui.animCollapse(function(){this.fireEvent("collapse",this);this.runCallback(h,e||this,[this]);if(b===true){this.collapseChildNodes(true)}}.createDelegate(this));return}else{this.ui.collapse();this.fireEvent("collapse",this);this.runCallback(h,e||this,[this])}}else{if(!this.expanded){this.runCallback(h,e||this,[this])}}if(b===true){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].collapse(true,false)}}},delayedExpand:function(a){if(!this.expandProcId){this.expandProcId=this.expand.defer(a,this)}},cancelExpand:function(){if(this.expandProcId){clearTimeout(this.expandProcId)}this.expandProcId=false},toggle:function(){if(this.expanded){this.collapse()}else{this.expand()}},ensureVisible:function(c,b){var a=this.getOwnerTree();a.expandPath(this.parentNode?this.parentNode.getPath():this.getPath(),false,function(){var d=a.getNodeById(this.id);a.getTreeEl().scrollChildIntoView(d.ui.anchor);this.runCallback(c,b||this,[this])}.createDelegate(this))},expandChildNodes:function(b,e){var d=this.childNodes,c,a=d.length;for(c=0;c<a;c++){d[c].expand(b,e)}},collapseChildNodes:function(b){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].collapse(b)}},disable:function(){this.disabled=true;this.unselect();if(this.rendered&&this.ui.onDisableChange){this.ui.onDisableChange(this,true)}this.fireEvent("disabledchange",this,true)},enable:function(){this.disabled=false;if(this.rendered&&this.ui.onDisableChange){this.ui.onDisableChange(this,false)}this.fireEvent("disabledchange",this,false)},renderChildren:function(b){if(b!==false){this.fireEvent("beforechildrenrendered",this)}var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].render(true)}this.childrenRendered=true},sort:function(e,d){Ext.tree.TreeNode.superclass.sort.apply(this,arguments);if(this.childrenRendered){var c=this.childNodes;for(var b=0,a=c.length;b<a;b++){c[b].render(true)}}},render:function(a){this.ui.render(a);if(!this.rendered){this.getOwnerTree().registerNode(this);this.rendered=true;if(this.expanded){this.expanded=false;this.expand(false,false)}}},renderIndent:function(b,e){if(e){this.ui.childIndent=null}this.ui.renderIndent();if(b===true&&this.childrenRendered){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].renderIndent(true,e)}}},beginUpdate:function(){this.childrenRendered=false},endUpdate:function(){if(this.expanded&&this.rendered){this.renderChildren()}},destroy:function(a){if(a===true){this.unselect(true)}Ext.tree.TreeNode.superclass.destroy.call(this,a);Ext.destroy(this.ui,this.loader);this.ui=this.loader=null},onIdChange:function(a){this.ui.onIdChange(a)}});Ext.tree.TreePanel.nodeTypes.node=Ext.tree.TreeNode;Ext.tree.AsyncTreeNode=function(a){this.loaded=a&&a.loaded===true;this.loading=false;Ext.tree.AsyncTreeNode.superclass.constructor.apply(this,arguments);this.addEvents("beforeload","load")};Ext.extend(Ext.tree.AsyncTreeNode,Ext.tree.TreeNode,{expand:function(b,e,h,c){if(this.loading){var g;var d=function(){if(!this.loading){clearInterval(g);this.expand(b,e,h,c)}}.createDelegate(this);g=setInterval(d,200);return}if(!this.loaded){if(this.fireEvent("beforeload",this)===false){return}this.loading=true;this.ui.beforeLoad(this);var a=this.loader||this.attributes.loader||this.getOwnerTree().getLoader();if(a){a.load(this,this.loadComplete.createDelegate(this,[b,e,h,c]),this);return}}Ext.tree.AsyncTreeNode.superclass.expand.call(this,b,e,h,c)},isLoading:function(){return this.loading},loadComplete:function(a,c,d,b){this.loading=false;this.loaded=true;this.ui.afterLoad(this);this.fireEvent("load",this);this.expand(a,c,d,b)},isLoaded:function(){return this.loaded},hasChildNodes:function(){if(!this.isLeaf()&&!this.loaded){return true}else{return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this)}},reload:function(b,a){this.collapse(false,false);while(this.firstChild){this.removeChild(this.firstChild).destroy()}this.childrenRendered=false;this.loaded=false;if(this.isHiddenRoot()){this.expanded=false}this.expand(false,false,b,a)}});Ext.tree.TreePanel.nodeTypes.async=Ext.tree.AsyncTreeNode;Ext.tree.TreeNodeUI=Ext.extend(Object,{constructor:function(a){Ext.apply(this,{node:a,rendered:false,animating:false,wasLeaf:true,ecc:"x-tree-ec-icon x-tree-elbow",emptyIcon:Ext.BLANK_IMAGE_URL})},removeChild:function(a){if(this.rendered){this.ctNode.removeChild(a.ui.getEl())}},beforeLoad:function(){this.addClass("x-tree-node-loading")},afterLoad:function(){this.removeClass("x-tree-node-loading")},onTextChange:function(b,c,a){if(this.rendered){this.textNode.innerHTML=c}},onIconClsChange:function(c,a,b){if(this.rendered){Ext.fly(this.iconNode).replaceClass(b,a)}},onIconChange:function(b,a){if(this.rendered){var c=Ext.isEmpty(a);this.iconNode.src=c?this.emptyIcon:a;Ext.fly(this.iconNode)[c?"removeClass":"addClass"]("x-tree-node-inline-icon")}},onTipChange:function(b,c,d){if(this.rendered){var a=Ext.isDefined(d);if(this.textNode.setAttributeNS){this.textNode.setAttributeNS("ext","qtip",c);if(a){this.textNode.setAttributeNS("ext","qtitle",d)}}else{this.textNode.setAttribute("ext:qtip",c);if(a){this.textNode.setAttribute("ext:qtitle",d)}}}},onHrefChange:function(b,a,c){if(this.rendered){this.anchor.href=this.getHref(a);if(Ext.isDefined(c)){this.anchor.target=c}}},onClsChange:function(c,a,b){if(this.rendered){Ext.fly(this.elNode).replaceClass(b,a)}},onDisableChange:function(a,b){this.disabled=b;if(this.checkbox){this.checkbox.disabled=b}this[b?"addClass":"removeClass"]("x-tree-node-disabled")},onSelectedChange:function(a){if(a){this.focus();this.addClass("x-tree-selected")}else{this.removeClass("x-tree-selected")}},onMove:function(a,h,e,g,d,b){this.childIndent=null;if(this.rendered){var i=g.ui.getContainer();if(!i){this.holder=document.createElement("div");this.holder.appendChild(this.wrap);return}var c=b?b.ui.getEl():null;if(c){i.insertBefore(this.wrap,c)}else{i.appendChild(this.wrap)}this.node.renderIndent(true,e!=g)}},addClass:function(a){if(this.elNode){Ext.fly(this.elNode).addClass(a)}},removeClass:function(a){if(this.elNode){Ext.fly(this.elNode).removeClass(a)}},remove:function(){if(this.rendered){this.holder=document.createElement("div");this.holder.appendChild(this.wrap)}},fireEvent:function(){return this.node.fireEvent.apply(this.node,arguments)},initEvents:function(){this.node.on("move",this.onMove,this);if(this.node.disabled){this.onDisableChange(this.node,true)}if(this.node.hidden){this.hide()}var b=this.node.getOwnerTree();var a=b.enableDD||b.enableDrag||b.enableDrop;if(a&&(!this.node.isRoot||b.rootVisible)){Ext.dd.Registry.register(this.elNode,{node:this.node,handles:this.getDDHandles(),isHandle:false})}},getDDHandles:function(){return[this.iconNode,this.textNode,this.elNode]},hide:function(){this.node.hidden=true;if(this.wrap){this.wrap.style.display="none"}},show:function(){this.node.hidden=false;if(this.wrap){this.wrap.style.display=""}},onContextMenu:function(a){if(this.node.hasListener("contextmenu")||this.node.getOwnerTree().hasListener("contextmenu")){a.preventDefault();this.focus();this.fireEvent("contextmenu",this.node,a)}},onClick:function(c){if(this.dropping){c.stopEvent();return}if(this.fireEvent("beforeclick",this.node,c)!==false){var b=c.getTarget("a");if(!this.disabled&&this.node.attributes.href&&b){this.fireEvent("click",this.node,c);return}else{if(b&&c.ctrlKey){c.stopEvent()}}c.preventDefault();if(this.disabled){return}if(this.node.attributes.singleClickExpand&&!this.animating&&this.node.isExpandable()){this.node.toggle()}this.fireEvent("click",this.node,c)}else{c.stopEvent()}},onDblClick:function(a){a.preventDefault();if(this.disabled){return}if(this.fireEvent("beforedblclick",this.node,a)!==false){if(this.checkbox){this.toggleCheck()}if(!this.animating&&this.node.isExpandable()){this.node.toggle()}this.fireEvent("dblclick",this.node,a)}},onOver:function(a){this.addClass("x-tree-node-over")},onOut:function(a){this.removeClass("x-tree-node-over")},onCheckChange:function(){var a=this.checkbox.checked;this.checkbox.defaultChecked=a;this.node.attributes.checked=a;this.fireEvent("checkchange",this.node,a)},ecClick:function(a){if(!this.animating&&this.node.isExpandable()){this.node.toggle()}},startDrop:function(){this.dropping=true},endDrop:function(){setTimeout(function(){this.dropping=false}.createDelegate(this),50)},expand:function(){this.updateExpandIcon();this.ctNode.style.display=""},focus:function(){if(!this.node.preventHScroll){try{this.anchor.focus()}catch(c){}}else{try{var b=this.node.getOwnerTree().getTreeEl().dom;var a=b.scrollLeft;this.anchor.focus();b.scrollLeft=a}catch(c){}}},toggleCheck:function(b){var a=this.checkbox;if(a){a.checked=(b===undefined?!a.checked:b);this.onCheckChange()}},blur:function(){try{this.anchor.blur()}catch(a){}},animExpand:function(b){var a=Ext.get(this.ctNode);a.stopFx();if(!this.node.isExpandable()){this.updateExpandIcon();this.ctNode.style.display="";Ext.callback(b);return}this.animating=true;this.updateExpandIcon();a.slideIn("t",{callback:function(){this.animating=false;Ext.callback(b)},scope:this,duration:this.node.ownerTree.duration||0.25})},highlight:function(){var a=this.node.getOwnerTree();Ext.fly(this.wrap).highlight(a.hlColor||"C3DAF9",{endColor:a.hlBaseColor})},collapse:function(){this.updateExpandIcon();this.ctNode.style.display="none"},animCollapse:function(b){var a=Ext.get(this.ctNode);a.enableDisplayMode("block");a.stopFx();this.animating=true;this.updateExpandIcon();a.slideOut("t",{callback:function(){this.animating=false;Ext.callback(b)},scope:this,duration:this.node.ownerTree.duration||0.25})},getContainer:function(){return this.ctNode},getEl:function(){return this.wrap},appendDDGhost:function(a){a.appendChild(this.elNode.cloneNode(true))},getDDRepairXY:function(){return Ext.lib.Dom.getXY(this.iconNode)},onRender:function(){this.render()},render:function(c){var e=this.node,b=e.attributes;var d=e.parentNode?e.parentNode.ui.getContainer():e.ownerTree.innerCt.dom;if(!this.rendered){this.rendered=true;this.renderElements(e,b,d,c);if(b.qtip){this.onTipChange(e,b.qtip,b.qtipTitle)}else{if(b.qtipCfg){b.qtipCfg.target=Ext.id(this.textNode);Ext.QuickTips.register(b.qtipCfg)}}this.initEvents();if(!this.node.expanded){this.updateExpandIcon(true)}}else{if(c===true){d.appendChild(this.wrap)}}},renderElements:function(e,k,j,l){this.indentMarkup=e.parentNode?e.parentNode.ui.getChildIndent():"";var g=Ext.isBoolean(k.checked),b,c=this.getHref(k.href),d=['<li class="x-tree-node"><div ext:tree-node-id="',e.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ',k.cls,'" unselectable="on">','<span class="x-tree-node-indent">',this.indentMarkup,"</span>",'<img alt="" src="',this.emptyIcon,'" class="x-tree-ec-icon x-tree-elbow" />','<img alt="" src="',k.icon||this.emptyIcon,'" class="x-tree-node-icon',(k.icon?" x-tree-node-inline-icon":""),(k.iconCls?" "+k.iconCls:""),'" unselectable="on" />',g?('<input class="x-tree-node-cb" type="checkbox" '+(k.checked?'checked="checked" />':"/>")):"",'<a hidefocus="on" class="x-tree-node-anchor" href="',c,'" tabIndex="1" ',k.hrefTarget?' target="'+k.hrefTarget+'"':"",'><span unselectable="on">',e.text,"</span></a></div>",'<ul class="x-tree-node-ct" style="display:none;"></ul>',"</li>"].join("");if(l!==true&&e.nextSibling&&(b=e.nextSibling.ui.getEl())){this.wrap=Ext.DomHelper.insertHtml("beforeBegin",b,d)}else{this.wrap=Ext.DomHelper.insertHtml("beforeEnd",j,d)}this.elNode=this.wrap.childNodes[0];this.ctNode=this.wrap.childNodes[1];var i=this.elNode.childNodes;this.indentNode=i[0];this.ecNode=i[1];this.iconNode=i[2];var h=3;if(g){this.checkbox=i[3];this.checkbox.defaultChecked=this.checkbox.checked;h++}this.anchor=i[h];this.textNode=i[h].firstChild},getHref:function(a){return Ext.isEmpty(a)?(Ext.isGecko?"":"#"):a},getAnchor:function(){return this.anchor},getTextEl:function(){return this.textNode},getIconEl:function(){return this.iconNode},isChecked:function(){return this.checkbox?this.checkbox.checked:false},updateExpandIcon:function(){if(this.rendered){var g=this.node,d,c,a=g.isLast()?"x-tree-elbow-end":"x-tree-elbow",e=g.hasChildNodes();if(e||g.attributes.expandable){if(g.expanded){a+="-minus";d="x-tree-node-collapsed";c="x-tree-node-expanded"}else{a+="-plus";d="x-tree-node-expanded";c="x-tree-node-collapsed"}if(this.wasLeaf){this.removeClass("x-tree-node-leaf");this.wasLeaf=false}if(this.c1!=d||this.c2!=c){Ext.fly(this.elNode).replaceClass(d,c);this.c1=d;this.c2=c}}else{if(!this.wasLeaf){Ext.fly(this.elNode).replaceClass("x-tree-node-expanded","x-tree-node-collapsed");delete this.c1;delete this.c2;this.wasLeaf=true}}var b="x-tree-ec-icon "+a;if(this.ecc!=b){this.ecNode.className=b;this.ecc=b}}},onIdChange:function(a){if(this.rendered){this.elNode.setAttribute("ext:tree-node-id",a)}},getChildIndent:function(){if(!this.childIndent){var a=[],b=this.node;while(b){if(!b.isRoot||(b.isRoot&&b.ownerTree.rootVisible)){if(!b.isLast()){a.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />')}else{a.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />')}}b=b.parentNode}this.childIndent=a.join("")}return this.childIndent},renderIndent:function(){if(this.rendered){var a="",b=this.node.parentNode;if(b){a=b.ui.getChildIndent()}if(this.indentMarkup!=a){this.indentNode.innerHTML=a;this.indentMarkup=a}this.updateExpandIcon()}},destroy:function(){if(this.elNode){Ext.dd.Registry.unregister(this.elNode.id)}Ext.each(["textnode","anchor","checkbox","indentNode","ecNode","iconNode","elNode","ctNode","wrap","holder"],function(a){if(this[a]){Ext.fly(this[a]).remove();delete this[a]}},this);delete this.node}});Ext.tree.RootTreeNodeUI=Ext.extend(Ext.tree.TreeNodeUI,{render:function(){if(!this.rendered){var a=this.node.ownerTree.innerCt.dom;this.node.expanded=true;a.innerHTML='<div class="x-tree-root-node"></div>';this.wrap=this.ctNode=a.firstChild}},collapse:Ext.emptyFn,expand:Ext.emptyFn});Ext.tree.TreeLoader=function(a){this.baseParams={};Ext.apply(this,a);this.addEvents("beforeload","load","loadexception");Ext.tree.TreeLoader.superclass.constructor.call(this);if(Ext.isString(this.paramOrder)){this.paramOrder=this.paramOrder.split(/[\s,|]/)}};Ext.extend(Ext.tree.TreeLoader,Ext.util.Observable,{uiProviders:{},clearOnLoad:true,paramOrder:undefined,paramsAsHash:false,nodeParameter:"node",directFn:undefined,load:function(b,c,a){if(this.clearOnLoad){while(b.firstChild){b.removeChild(b.firstChild)}}if(this.doPreload(b)){this.runCallback(c,a||b,[b])}else{if(this.directFn||this.dataUrl||this.url){this.requestData(b,c,a||b)}}},doPreload:function(d){if(d.attributes.children){if(d.childNodes.length<1){var c=d.attributes.children;d.beginUpdate();for(var b=0,a=c.length;b<a;b++){var e=d.appendChild(this.createNode(c[b]));if(this.preloadChildren){this.doPreload(e)}}d.endUpdate()}return true}return false},getParams:function(g){var e=Ext.apply({},this.baseParams),h=this.nodeParameter,b=this.paramOrder;h&&(e[h]=g.id);if(this.directFn){var c=[g.id];if(b){if(h&&b.indexOf(h)>-1){c=[]}for(var d=0,a=b.length;d<a;d++){c.push(e[b[d]])}}else{if(this.paramsAsHash){c=[e]}}return c}else{return e}},requestData:function(c,d,b){if(this.fireEvent("beforeload",this,c,d)!==false){if(this.directFn){var a=this.getParams(c);a.push(this.processDirectResponse.createDelegate(this,[{callback:d,node:c,scope:b}],true));this.directFn.apply(window,a)}else{this.transId=Ext.Ajax.request({method:this.requestMethod,url:this.dataUrl||this.url,success:this.handleResponse,failure:this.handleFailure,scope:this,argument:{callback:d,node:c,scope:b},params:this.getParams(c)})}}else{this.runCallback(d,b||c,[])}},processDirectResponse:function(a,b,c){if(b.status){this.handleResponse({responseData:Ext.isArray(a)?a:null,responseText:a,argument:c})}else{this.handleFailure({argument:c})}},runCallback:function(a,c,b){if(Ext.isFunction(a)){a.apply(c,b)}},isLoading:function(){return !!this.transId},abort:function(){if(this.isLoading()){Ext.Ajax.abort(this.transId)}},createNode:function(attr){if(this.baseAttrs){Ext.applyIf(attr,this.baseAttrs)}if(this.applyLoader!==false&&!attr.loader){attr.loader=this}if(Ext.isString(attr.uiProvider)){attr.uiProvider=this.uiProviders[attr.uiProvider]||eval(attr.uiProvider)}if(attr.nodeType){return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr)}else{return attr.leaf?new Ext.tree.TreeNode(attr):new Ext.tree.AsyncTreeNode(attr)}},processResponse:function(d,c,k,l){var m=d.responseText;try{var a=d.responseData||Ext.decode(m);c.beginUpdate();for(var g=0,h=a.length;g<h;g++){var b=this.createNode(a[g]);if(b){c.appendChild(b)}}c.endUpdate();this.runCallback(k,l||c,[c])}catch(j){this.handleFailure(d)}},handleResponse:function(c){this.transId=false;var b=c.argument;this.processResponse(c,b.node,b.callback,b.scope);this.fireEvent("load",this,b.node,c)},handleFailure:function(c){this.transId=false;var b=c.argument;this.fireEvent("loadexception",this,b.node,c);this.runCallback(b.callback,b.scope||b.node,[b.node])},destroy:function(){this.abort();this.purgeListeners()}});Ext.tree.TreeFilter=function(a,b){this.tree=a;this.filtered={};Ext.apply(this,b)};Ext.tree.TreeFilter.prototype={clearBlank:false,reverse:false,autoClear:false,remove:false,filter:function(d,a,b){a=a||"text";var c;if(typeof d=="string"){var e=d.length;if(e==0&&this.clearBlank){this.clear();return}d=d.toLowerCase();c=function(g){return g.attributes[a].substr(0,e).toLowerCase()==d}}else{if(d.exec){c=function(g){return d.test(g.attributes[a])}}else{throw"Illegal filter type, must be string or regex"}}this.filterBy(c,null,b)},filterBy:function(d,c,b){b=b||this.tree.root;if(this.autoClear){this.clear()}var a=this.filtered,i=this.reverse;var e=function(k){if(k==b){return true}if(a[k.id]){return false}var j=d.call(c||k,k);if(!j||i){a[k.id]=k;k.ui.hide();return false}return true};b.cascade(e);if(this.remove){for(var h in a){if(typeof h!="function"){var g=a[h];if(g&&g.parentNode){g.parentNode.removeChild(g)}}}}},clear:function(){var b=this.tree;var a=this.filtered;for(var d in a){if(typeof d!="function"){var c=a[d];if(c){c.ui.show()}}}this.filtered={}}};Ext.tree.TreeSorter=Ext.extend(Object,{constructor:function(a,c){Ext.apply(this,c);a.on({scope:this,beforechildrenrendered:this.doSort,append:this.updateSort,insert:this.updateSort,textchange:this.updateSortParent});var e=this.dir&&this.dir.toLowerCase()=="desc",i=this.property||"text",d=this.sortType,h=this.folderSort,b=this.caseSensitive===true,g=this.leafAttr||"leaf";if(Ext.isString(d)){d=Ext.data.SortTypes[d]}this.sortFn=function(o,m){var k=o.attributes,j=m.attributes;if(h){if(k[g]&&!j[g]){return 1}if(!k[g]&&j[g]){return -1}}var n=k[i],l=j[i],q=d?d(n):(b?n:n.toUpperCase()),p=d?d(l):(b?l:l.toUpperCase());if(q<p){return e?1:-1}else{if(q>p){return e?-1:1}}return 0}},doSort:function(a){a.sort(this.sortFn)},updateSort:function(a,b){if(b.childrenRendered){this.doSort.defer(1,this,[b])}},updateSortParent:function(a){var b=a.parentNode;if(b&&b.childrenRendered){this.doSort.defer(1,this,[b])}}});if(Ext.dd.DropZone){Ext.tree.TreeDropZone=function(a,b){this.allowParentInsert=b.allowParentInsert||false;this.allowContainerDrop=b.allowContainerDrop||false;this.appendOnly=b.appendOnly||false;Ext.tree.TreeDropZone.superclass.constructor.call(this,a.getTreeEl(),b);this.tree=a;this.dragOverData={};this.lastInsertClass="x-tree-no-status"};Ext.extend(Ext.tree.TreeDropZone,Ext.dd.DropZone,{ddGroup:"TreeDD",expandDelay:1000,expandNode:function(a){if(a.hasChildNodes()&&!a.isExpanded()){a.expand(false,null,this.triggerCacheRefresh.createDelegate(this))}},queueExpand:function(a){this.expandProcId=this.expandNode.defer(this.expandDelay,this,[a])},cancelExpand:function(){if(this.expandProcId){clearTimeout(this.expandProcId);this.expandProcId=false}},isValidDropPoint:function(a,k,i,d,c){if(!a||!c){return false}var g=a.node;var h=c.node;if(!(g&&g.isTarget&&k)){return false}if(k=="append"&&g.allowChildren===false){return false}if((k=="above"||k=="below")&&(g.parentNode&&g.parentNode.allowChildren===false)){return false}if(h&&(g==h||h.contains(g))){return false}var b=this.dragOverData;b.tree=this.tree;b.target=g;b.data=c;b.point=k;b.source=i;b.rawEvent=d;b.dropNode=h;b.cancel=false;var j=this.tree.fireEvent("nodedragover",b);return b.cancel===false&&j!==false},getDropPoint:function(h,g,l){var m=g.node;if(m.isRoot){return m.allowChildren!==false?"append":false}var c=g.ddel;var o=Ext.lib.Dom.getY(c),j=o+c.offsetHeight;var i=Ext.lib.Event.getPageY(h);var k=m.allowChildren===false||m.isLeaf();if(this.appendOnly||m.parentNode.allowChildren===false){return k?false:"append"}var d=false;if(!this.allowParentInsert){d=m.hasChildNodes()&&m.isExpanded()}var a=(j-o)/(k?2:3);if(i>=o&&i<(o+a)){return"above"}else{if(!d&&(k||i>=j-a&&i<=j)){return"below"}else{return"append"}}},onNodeEnter:function(d,a,c,b){this.cancelExpand()},onContainerOver:function(a,c,b){if(this.allowContainerDrop&&this.isValidDropPoint({ddel:this.tree.getRootNode().ui.elNode,node:this.tree.getRootNode()},"append",a,c,b)){return this.dropAllowed}return this.dropNotAllowed},onNodeOver:function(b,i,h,g){var k=this.getDropPoint(h,b,i);var c=b.node;if(!this.expandProcId&&k=="append"&&c.hasChildNodes()&&!b.node.isExpanded()){this.queueExpand(c)}else{if(k!="append"){this.cancelExpand()}}var d=this.dropNotAllowed;if(this.isValidDropPoint(b,k,i,h,g)){if(k){var a=b.ddel;var j;if(k=="above"){d=b.node.isFirst()?"x-tree-drop-ok-above":"x-tree-drop-ok-between";j="x-tree-drag-insert-above"}else{if(k=="below"){d=b.node.isLast()?"x-tree-drop-ok-below":"x-tree-drop-ok-between";j="x-tree-drag-insert-below"}else{d="x-tree-drop-ok-append";j="x-tree-drag-append"}}if(this.lastInsertClass!=j){Ext.fly(a).replaceClass(this.lastInsertClass,j);this.lastInsertClass=j}}}return d},onNodeOut:function(d,a,c,b){this.cancelExpand();this.removeDropIndicators(d)},onNodeDrop:function(i,b,h,d){var a=this.getDropPoint(h,i,b);var g=i.node;g.ui.startDrop();if(!this.isValidDropPoint(i,a,b,h,d)){g.ui.endDrop();return false}var c=d.node||(b.getTreeNode?b.getTreeNode(d,g,a,h):null);return this.processDrop(g,d,a,b,h,c)},onContainerDrop:function(a,g,c){if(this.allowContainerDrop&&this.isValidDropPoint({ddel:this.tree.getRootNode().ui.elNode,node:this.tree.getRootNode()},"append",a,g,c)){var d=this.tree.getRootNode();d.ui.startDrop();var b=c.node||(a.getTreeNode?a.getTreeNode(c,d,"append",g):null);return this.processDrop(d,c,"append",a,g,b)}return false},processDrop:function(j,h,b,a,i,d){var g={tree:this.tree,target:j,data:h,point:b,source:a,rawEvent:i,dropNode:d,cancel:!d,dropStatus:false};var c=this.tree.fireEvent("beforenodedrop",g);if(c===false||g.cancel===true||!g.dropNode){j.ui.endDrop();return g.dropStatus}j=g.target;if(b=="append"&&!j.isExpanded()){j.expand(false,null,function(){this.completeDrop(g)}.createDelegate(this))}else{this.completeDrop(g)}return true},completeDrop:function(h){var d=h.dropNode,e=h.point,c=h.target;if(!Ext.isArray(d)){d=[d]}var g;for(var b=0,a=d.length;b<a;b++){g=d[b];if(e=="above"){c.parentNode.insertBefore(g,c)}else{if(e=="below"){c.parentNode.insertBefore(g,c.nextSibling)}else{c.appendChild(g)}}}g.ui.focus();if(Ext.enableFx&&this.tree.hlDrop){g.ui.highlight()}c.ui.endDrop();this.tree.fireEvent("nodedrop",h)},afterNodeMoved:function(a,c,g,d,b){if(Ext.enableFx&&this.tree.hlDrop){b.ui.focus();b.ui.highlight()}this.tree.fireEvent("nodedrop",this.tree,d,c,a,g)},getTree:function(){return this.tree},removeDropIndicators:function(b){if(b&&b.ddel){var a=b.ddel;Ext.fly(a).removeClass(["x-tree-drag-insert-above","x-tree-drag-insert-below","x-tree-drag-append"]);this.lastInsertClass="_noclass"}},beforeDragDrop:function(b,a,c){this.cancelExpand();return true},afterRepair:function(a){if(a&&Ext.enableFx){a.node.ui.highlight()}this.hideProxy()}})}if(Ext.dd.DragZone){Ext.tree.TreeDragZone=function(a,b){Ext.tree.TreeDragZone.superclass.constructor.call(this,a.innerCt,b);this.tree=a};Ext.extend(Ext.tree.TreeDragZone,Ext.dd.DragZone,{ddGroup:"TreeDD",onBeforeDrag:function(a,b){var c=a.node;return c&&c.draggable&&!c.disabled},onInitDrag:function(b){var a=this.dragData;this.tree.getSelectionModel().select(a.node);this.tree.eventModel.disable();this.proxy.update("");a.node.ui.appendDDGhost(this.proxy.ghost.dom);this.tree.fireEvent("startdrag",this.tree,a.node,b)},getRepairXY:function(b,a){return a.node.ui.getDDRepairXY()},onEndDrag:function(a,b){this.tree.eventModel.enable.defer(100,this.tree.eventModel);this.tree.fireEvent("enddrag",this.tree,a.node,b)},onValidDrop:function(a,b,c){this.tree.fireEvent("dragdrop",this.tree,this.dragData.node,a,b);this.hideProxy()},beforeInvalidDrop:function(a,c){var b=this.tree.getSelectionModel();b.clearSelections();b.select(this.dragData.node)},afterRepair:function(){if(Ext.enableFx&&this.tree.hlDrop){Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor||"c3daf9")}this.dragging=false}})}Ext.tree.TreeEditor=function(a,c,b){c=c||{};var d=c.events?c:new Ext.form.TextField(c);Ext.tree.TreeEditor.superclass.constructor.call(this,d,b);this.tree=a;if(!a.rendered){a.on("render",this.initEditor,this)}else{this.initEditor(a)}};Ext.extend(Ext.tree.TreeEditor,Ext.Editor,{alignment:"l-l",autoSize:false,hideEl:false,cls:"x-small-editor x-tree-editor",shim:false,shadow:"frame",maxWidth:250,editDelay:350,initEditor:function(a){a.on({scope:this,beforeclick:this.beforeNodeClick,dblclick:this.onNodeDblClick});this.on({scope:this,complete:this.updateNode,beforestartedit:this.fitToTree,specialkey:this.onSpecialKey});this.on("startedit",this.bindScroll,this,{delay:10})},fitToTree:function(b,c){var e=this.tree.getTreeEl().dom,d=c.dom;if(e.scrollLeft>d.offsetLeft){e.scrollLeft=d.offsetLeft}var a=Math.min(this.maxWidth,(e.clientWidth>20?e.clientWidth:e.offsetWidth)-Math.max(0,d.offsetLeft-e.scrollLeft)-5);this.setSize(a,"")},triggerEdit:function(a,c){this.completeEdit();if(a.attributes.editable!==false){this.editNode=a;if(this.tree.autoScroll){Ext.fly(a.ui.getEl()).scrollIntoView(this.tree.body)}var b=a.text||"";if(!Ext.isGecko&&Ext.isEmpty(a.text)){a.setText("&#160;")}this.autoEditTimer=this.startEdit.defer(this.editDelay,this,[a.ui.textNode,b]);return false}},bindScroll:function(){this.tree.getTreeEl().on("scroll",this.cancelEdit,this)},beforeNodeClick:function(a,b){clearTimeout(this.autoEditTimer);if(this.tree.getSelectionModel().isSelected(a)){b.stopEvent();return this.triggerEdit(a)}},onNodeDblClick:function(a,b){clearTimeout(this.autoEditTimer)},updateNode:function(a,b){this.tree.getTreeEl().un("scroll",this.cancelEdit,this);this.editNode.setText(b)},onHide:function(){Ext.tree.TreeEditor.superclass.onHide.call(this);if(this.editNode){this.editNode.ui.focus.defer(50,this.editNode.ui)}},onSpecialKey:function(c,b){var a=b.getKey();if(a==b.ESC){b.stopEvent();this.cancelEdit()}else{if(a==b.ENTER&&!b.hasModifier()){b.stopEvent();this.completeEdit()}}},onDestroy:function(){clearTimeout(this.autoEditTimer);Ext.tree.TreeEditor.superclass.onDestroy.call(this);var a=this.tree;a.un("beforeclick",this.beforeNodeClick,this);a.un("dblclick",this.onNodeDblClick,this)}});
+/* SWFObject v2.2 <http://code.google.com/p/swfobject/> 
+    is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
+*/
+var swfobject=function(){var E="undefined",s="object",T="Shockwave Flash",X="ShockwaveFlash.ShockwaveFlash",r="application/x-shockwave-flash",S="SWFObjectExprInst",y="onreadystatechange",P=window,k=document,u=navigator,U=false,V=[i],p=[],O=[],J=[],m,R,F,C,K=false,a=false,o,H,n=true,N=function(){var ab=typeof k.getElementById!=E&&typeof k.getElementsByTagName!=E&&typeof k.createElement!=E,ai=u.userAgent.toLowerCase(),Z=u.platform.toLowerCase(),af=Z?(/win/).test(Z):/win/.test(ai),ad=Z?(/mac/).test(Z):/mac/.test(ai),ag=/webkit/.test(ai)?parseFloat(ai.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,Y=!+"\v1",ah=[0,0,0],ac=null;if(typeof u.plugins!=E&&typeof u.plugins[T]==s){ac=u.plugins[T].description;if(ac&&!(typeof u.mimeTypes!=E&&u.mimeTypes[r]&&!u.mimeTypes[r].enabledPlugin)){U=true;Y=false;ac=ac.replace(/^.*\s+(\S+\s+\S+$)/,"$1");ah[0]=parseInt(ac.replace(/^(.*)\..*$/,"$1"),10);ah[1]=parseInt(ac.replace(/^.*\.(.*)\s.*$/,"$1"),10);ah[2]=/[a-zA-Z]/.test(ac)?parseInt(ac.replace(/^.*[a-zA-Z]+(.*)$/,"$1"),10):0}}else{if(typeof P.ActiveXObject!=E){try{var ae=new ActiveXObject(X);if(ae){ac=ae.GetVariable("$version");if(ac){Y=true;ac=ac.split(" ")[1].split(",");ah=[parseInt(ac[0],10),parseInt(ac[1],10),parseInt(ac[2],10)]}}}catch(aa){}}}return{w3:ab,pv:ah,wk:ag,ie:Y,win:af,mac:ad}}(),l=function(){if(!N.w3){return}if((typeof k.readyState!=E&&k.readyState=="complete")||(typeof k.readyState==E&&(k.getElementsByTagName("body")[0]||k.body))){g()}if(!K){if(typeof k.addEventListener!=E){k.addEventListener("DOMContentLoaded",g,false)}if(N.ie&&N.win){k.attachEvent(y,function(){if(k.readyState=="complete"){k.detachEvent(y,arguments.callee);g()}});if(P==top){(function(){if(K){return}try{k.documentElement.doScroll("left")}catch(Y){setTimeout(arguments.callee,0);return}g()})()}}if(N.wk){(function(){if(K){return}if(!(/loaded|complete/).test(k.readyState)){setTimeout(arguments.callee,0);return}g()})()}t(g)}}();function g(){if(K){return}try{var aa=k.getElementsByTagName("body")[0].appendChild(D("span"));aa.parentNode.removeChild(aa)}catch(ab){return}K=true;var Y=V.length;for(var Z=0;Z<Y;Z++){V[Z]()}}function L(Y){if(K){Y()}else{V[V.length]=Y}}function t(Z){if(typeof P.addEventListener!=E){P.addEventListener("load",Z,false)}else{if(typeof k.addEventListener!=E){k.addEventListener("load",Z,false)}else{if(typeof P.attachEvent!=E){j(P,"onload",Z)}else{if(typeof P.onload=="function"){var Y=P.onload;P.onload=function(){Y();Z()}}else{P.onload=Z}}}}}function i(){if(U){W()}else{I()}}function W(){var Y=k.getElementsByTagName("body")[0];var ab=D(s);ab.setAttribute("type",r);var aa=Y.appendChild(ab);if(aa){var Z=0;(function(){if(typeof aa.GetVariable!=E){var ac=aa.GetVariable("$version");if(ac){ac=ac.split(" ")[1].split(",");N.pv=[parseInt(ac[0],10),parseInt(ac[1],10),parseInt(ac[2],10)]}}else{if(Z<10){Z++;setTimeout(arguments.callee,10);return}}Y.removeChild(ab);aa=null;I()})()}else{I()}}function I(){var ah=p.length;if(ah>0){for(var ag=0;ag<ah;ag++){var Z=p[ag].id;var ac=p[ag].callbackFn;var ab={success:false,id:Z};if(N.pv[0]>0){var af=c(Z);if(af){if(G(p[ag].swfVersion)&&!(N.wk&&N.wk<312)){x(Z,true);if(ac){ab.success=true;ab.ref=A(Z);ac(ab)}}else{if(p[ag].expressInstall&&B()){var aj={};aj.data=p[ag].expressInstall;aj.width=af.getAttribute("width")||"0";aj.height=af.getAttribute("height")||"0";if(af.getAttribute("class")){aj.styleclass=af.getAttribute("class")}if(af.getAttribute("align")){aj.align=af.getAttribute("align")}var ai={};var Y=af.getElementsByTagName("param");var ad=Y.length;for(var ae=0;ae<ad;ae++){if(Y[ae].getAttribute("name").toLowerCase()!="movie"){ai[Y[ae].getAttribute("name")]=Y[ae].getAttribute("value")}}Q(aj,ai,Z,ac)}else{q(af);if(ac){ac(ab)}}}}}else{x(Z,true);if(ac){var aa=A(Z);if(aa&&typeof aa.SetVariable!=E){ab.success=true;ab.ref=aa}ac(ab)}}}}}function A(ab){var Y=null;var Z=c(ab);if(Z&&Z.nodeName=="OBJECT"){if(typeof Z.SetVariable!=E){Y=Z}else{var aa=Z.getElementsByTagName(s)[0];if(aa){Y=aa}}}return Y}function B(){return !a&&G("6.0.65")&&(N.win||N.mac)&&!(N.wk&&N.wk<312)}function Q(ab,ac,Y,aa){a=true;F=aa||null;C={success:false,id:Y};var af=c(Y);if(af){if(af.nodeName=="OBJECT"){m=h(af);R=null}else{m=af;R=Y}ab.id=S;if(typeof ab.width==E||(!(/%$/).test(ab.width)&&parseInt(ab.width,10)<310)){ab.width="310"}if(typeof ab.height==E||(!(/%$/).test(ab.height)&&parseInt(ab.height,10)<137)){ab.height="137"}k.title=k.title.slice(0,47)+" - Flash Player Installation";var ae=N.ie&&N.win?"ActiveX":"PlugIn",ad="MMredirectURL="+P.location.toString().replace(/&/g,"%26")+"&MMplayerType="+ae+"&MMdoctitle="+k.title;if(typeof ac.flashvars!=E){ac.flashvars+="&"+ad}else{ac.flashvars=ad}if(N.ie&&N.win&&af.readyState!=4){var Z=D("div");Y+="SWFObjectNew";Z.setAttribute("id",Y);af.parentNode.insertBefore(Z,af);af.style.display="none";(function(){if(af.readyState==4){af.parentNode.removeChild(af)}else{setTimeout(arguments.callee,10)}})()}v(ab,ac,Y)}}function q(Z){if(N.ie&&N.win&&Z.readyState!=4){var Y=D("div");Z.parentNode.insertBefore(Y,Z);Y.parentNode.replaceChild(h(Z),Y);Z.style.display="none";(function(){if(Z.readyState==4){Z.parentNode.removeChild(Z)}else{setTimeout(arguments.callee,10)}})()}else{Z.parentNode.replaceChild(h(Z),Z)}}function h(ad){var ab=D("div");if(N.win&&N.ie){ab.innerHTML=ad.innerHTML}else{var Z=ad.getElementsByTagName(s)[0];if(Z){var ae=Z.childNodes;if(ae){var Y=ae.length;for(var aa=0;aa<Y;aa++){if(!(ae[aa].nodeType==1&&ae[aa].nodeName=="PARAM")&&!(ae[aa].nodeType==8)){ab.appendChild(ae[aa].cloneNode(true))}}}}}return ab}function v(aj,ah,Z){var Y,ab=c(Z);if(N.wk&&N.wk<312){return Y}if(ab){if(typeof aj.id==E){aj.id=Z}if(N.ie&&N.win){var ai="";for(var af in aj){if(aj[af]!=Object.prototype[af]){if(af.toLowerCase()=="data"){ah.movie=aj[af]}else{if(af.toLowerCase()=="styleclass"){ai+=' class="'+aj[af]+'"'}else{if(af.toLowerCase()!="classid"){ai+=" "+af+'="'+aj[af]+'"'}}}}}var ag="";for(var ae in ah){if(ah[ae]!=Object.prototype[ae]){ag+='<param name="'+ae+'" value="'+ah[ae]+'" />'}}ab.outerHTML='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+ai+">"+ag+"</object>";O[O.length]=aj.id;Y=c(aj.id)}else{var aa=D(s);aa.setAttribute("type",r);for(var ad in aj){if(aj[ad]!=Object.prototype[ad]){if(ad.toLowerCase()=="styleclass"){aa.setAttribute("class",aj[ad])}else{if(ad.toLowerCase()!="classid"){aa.setAttribute(ad,aj[ad])}}}}for(var ac in ah){if(ah[ac]!=Object.prototype[ac]&&ac.toLowerCase()!="movie"){e(aa,ac,ah[ac])}}ab.parentNode.replaceChild(aa,ab);Y=aa}}return Y}function e(aa,Y,Z){var ab=D("param");ab.setAttribute("name",Y);ab.setAttribute("value",Z);aa.appendChild(ab)}function z(Z){var Y=c(Z);if(Y&&Y.nodeName=="OBJECT"){if(N.ie&&N.win){Y.style.display="none";(function(){if(Y.readyState==4){b(Z)}else{setTimeout(arguments.callee,10)}})()}else{Y.parentNode.removeChild(Y)}}}function b(aa){var Z=c(aa);if(Z){for(var Y in Z){if(typeof Z[Y]=="function"){Z[Y]=null}}Z.parentNode.removeChild(Z)}}function c(aa){var Y=null;try{Y=k.getElementById(aa)}catch(Z){}return Y}function D(Y){return k.createElement(Y)}function j(aa,Y,Z){aa.attachEvent(Y,Z);J[J.length]=[aa,Y,Z]}function G(aa){var Z=N.pv,Y=aa.split(".");Y[0]=parseInt(Y[0],10);Y[1]=parseInt(Y[1],10)||0;Y[2]=parseInt(Y[2],10)||0;return(Z[0]>Y[0]||(Z[0]==Y[0]&&Z[1]>Y[1])||(Z[0]==Y[0]&&Z[1]==Y[1]&&Z[2]>=Y[2]))?true:false}function w(ad,Z,ae,ac){if(N.ie&&N.mac){return}var ab=k.getElementsByTagName("head")[0];if(!ab){return}var Y=(ae&&typeof ae=="string")?ae:"screen";if(ac){o=null;H=null}if(!o||H!=Y){var aa=D("style");aa.setAttribute("type","text/css");aa.setAttribute("media",Y);o=ab.appendChild(aa);if(N.ie&&N.win&&typeof k.styleSheets!=E&&k.styleSheets.length>0){o=k.styleSheets[k.styleSheets.length-1]}H=Y}if(N.ie&&N.win){if(o&&typeof o.addRule==s){o.addRule(ad,Z)}}else{if(o&&typeof k.createTextNode!=E){o.appendChild(k.createTextNode(ad+" {"+Z+"}"))}}}function x(aa,Y){if(!n){return}var Z=Y?"visible":"hidden";if(K&&c(aa)){c(aa).style.visibility=Z}else{w("#"+aa,"visibility:"+Z)}}function M(Z){var aa=/[\\\"<>\.;]/;var Y=aa.exec(Z)!=null;return Y&&typeof encodeURIComponent!=E?encodeURIComponent(Z):Z}var d=function(){if(N.ie&&N.win){window.attachEvent("onunload",function(){var ad=J.length;for(var ac=0;ac<ad;ac++){J[ac][0].detachEvent(J[ac][1],J[ac][2])}var aa=O.length;for(var ab=0;ab<aa;ab++){z(O[ab])}for(var Z in N){N[Z]=null}N=null;for(var Y in swfobject){swfobject[Y]=null}swfobject=null;window.detachEvent("onunload",arguments.callee)})}}();return{registerObject:function(ac,Y,ab,aa){if(N.w3&&ac&&Y){var Z={};Z.id=ac;Z.swfVersion=Y;Z.expressInstall=ab;Z.callbackFn=aa;p[p.length]=Z;x(ac,false)}else{if(aa){aa({success:false,id:ac})}}},getObjectById:function(Y){if(N.w3){return A(Y)}},embedSWF:function(ac,ai,af,ah,Z,ab,aa,ae,ag,ad){var Y={success:false,id:ai};if(N.w3&&!(N.wk&&N.wk<312)&&ac&&ai&&af&&ah&&Z){x(ai,false);L(function(){af+="";ah+="";var ak={};if(ag&&typeof ag===s){for(var am in ag){ak[am]=ag[am]}}ak.data=ac;ak.width=af;ak.height=ah;var an={};if(ae&&typeof ae===s){for(var al in ae){an[al]=ae[al]}}if(aa&&typeof aa===s){for(var aj in aa){if(typeof an.flashvars!=E){an.flashvars+="&"+aj+"="+aa[aj]}else{an.flashvars=aj+"="+aa[aj]}}}if(G(Z)){var ao=v(ak,an,ai);if(ak.id==ai){x(ai,true)}Y.success=true;Y.ref=ao}else{if(ab&&B()){ak.data=ab;Q(ak,an,ai,ad);return}else{x(ai,true)}}if(ad){ad(Y)}})}else{if(ad){ad(Y)}}},switchOffAutoHideShow:function(){n=false},ua:N,getFlashPlayerVersion:function(){return{major:N.pv[0],minor:N.pv[1],release:N.pv[2]}},hasFlashPlayerVersion:G,createSWF:function(aa,Z,Y){if(N.w3){return v(aa,Z,Y)}else{return undefined}},showExpressInstall:function(aa,ab,Y,Z){if(N.w3&&B()){Q(aa,ab,Y,Z)}},removeSWF:function(Y){if(N.w3){z(Y)}},createCSS:function(ab,aa,Z,Y){if(N.w3){w(ab,aa,Z,Y)}},addDomLoadEvent:L,addLoadEvent:t,getQueryParamValue:function(ab){var aa=k.location.search||k.location.hash;if(aa){if(/\?/.test(aa)){aa=aa.split("?")[1]}if(ab==null){return M(aa)}var Z=aa.split("&");for(var Y=0;Y<Z.length;Y++){if(Z[Y].substring(0,Z[Y].indexOf("="))==ab){return M(Z[Y].substring((Z[Y].indexOf("=")+1)))}}}return""},expressInstallCallback:function(){if(a){var Y=c(S);if(Y&&m){Y.parentNode.replaceChild(m,Y);if(R){x(R,true);if(N.ie&&N.win){m.style.display="block"}}if(F){F(C)}}a=false}}}}();Ext.FlashComponent=Ext.extend(Ext.BoxComponent,{flashVersion:"9.0.115",backgroundColor:"#ffffff",wmode:"opaque",flashVars:undefined,flashParams:undefined,url:undefined,swfId:undefined,swfWidth:"100%",swfHeight:"100%",expressInstall:false,initComponent:function(){Ext.FlashComponent.superclass.initComponent.call(this);this.addEvents("initialize")},onRender:function(){Ext.FlashComponent.superclass.onRender.apply(this,arguments);var b=Ext.apply({allowScriptAccess:"always",bgcolor:this.backgroundColor,wmode:this.wmode},this.flashParams),a=Ext.apply({allowedDomain:document.location.hostname,YUISwfId:this.getId(),YUIBridgeCallback:"Ext.FlashEventProxy.onEvent"},this.flashVars);new swfobject.embedSWF(this.url,this.id,this.swfWidth,this.swfHeight,this.flashVersion,this.expressInstall?Ext.FlashComponent.EXPRESS_INSTALL_URL:undefined,a,b);this.swf=Ext.getDom(this.id);this.el=Ext.get(this.swf)},getSwfId:function(){return this.swfId||(this.swfId="extswf"+(++Ext.Component.AUTO_ID))},getId:function(){return this.id||(this.id="extflashcmp"+(++Ext.Component.AUTO_ID))},onFlashEvent:function(a){switch(a.type){case"swfReady":this.initSwf();return;case"log":return}a.component=this;this.fireEvent(a.type.toLowerCase().replace(/event$/,""),a)},initSwf:function(){this.onSwfReady(!!this.isInitialized);this.isInitialized=true;this.fireEvent("initialize",this)},beforeDestroy:function(){if(this.rendered){swfobject.removeSWF(this.swf.id)}Ext.FlashComponent.superclass.beforeDestroy.call(this)},onSwfReady:Ext.emptyFn});Ext.FlashComponent.EXPRESS_INSTALL_URL="http://swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf";Ext.reg("flash",Ext.FlashComponent);Ext.FlashEventProxy={onEvent:function(c,b){var a=Ext.getCmp(c);if(a){a.onFlashEvent(b)}else{arguments.callee.defer(10,this,[c,b])}}};Ext.chart.Chart=Ext.extend(Ext.FlashComponent,{refreshBuffer:100,chartStyle:{padding:10,animationEnabled:true,font:{name:"Tahoma",color:4473924,size:11},dataTip:{padding:5,border:{color:10075112,size:1},background:{color:14346230,alpha:0.9},font:{name:"Tahoma",color:1393291,size:10,bold:true}}},extraStyle:null,seriesStyles:null,disableCaching:Ext.isIE||Ext.isOpera,disableCacheParam:"_dc",initComponent:function(){Ext.chart.Chart.superclass.initComponent.call(this);if(!this.url){this.url=Ext.chart.Chart.CHART_URL}if(this.disableCaching){this.url=Ext.urlAppend(this.url,String.format("{0}={1}",this.disableCacheParam,new Date().getTime()))}this.addEvents("itemmouseover","itemmouseout","itemclick","itemdoubleclick","itemdragstart","itemdrag","itemdragend","beforerefresh","refresh");this.store=Ext.StoreMgr.lookup(this.store)},setStyle:function(a,b){this.swf.setStyle(a,Ext.encode(b))},setStyles:function(a){this.swf.setStyles(Ext.encode(a))},setSeriesStyles:function(b){this.seriesStyles=b;var a=[];Ext.each(b,function(c){a.push(Ext.encode(c))});this.swf.setSeriesStyles(a)},setCategoryNames:function(a){this.swf.setCategoryNames(a)},setLegendRenderer:function(c,b){var a=this;b=b||a;a.removeFnProxy(a.legendFnName);a.legendFnName=a.createFnProxy(function(d){return c.call(b,d)});a.swf.setLegendLabelFunction(a.legendFnName)},setTipRenderer:function(c,b){var a=this;b=b||a;a.removeFnProxy(a.tipFnName);a.tipFnName=a.createFnProxy(function(h,e,g){var d=a.store.getAt(e);return c.call(b,a,d,e,g)});a.swf.setDataTipFunction(a.tipFnName)},setSeries:function(a){this.series=a;this.refresh()},bindStore:function(a,b){if(!b&&this.store){if(a!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("datachanged",this.refresh,this);this.store.un("add",this.delayRefresh,this);this.store.un("remove",this.delayRefresh,this);this.store.un("update",this.delayRefresh,this);this.store.un("clear",this.refresh,this)}}if(a){a=Ext.StoreMgr.lookup(a);a.on({scope:this,datachanged:this.refresh,add:this.delayRefresh,remove:this.delayRefresh,update:this.delayRefresh,clear:this.refresh})}this.store=a;if(a&&!b){this.refresh()}},onSwfReady:function(b){Ext.chart.Chart.superclass.onSwfReady.call(this,b);var a;this.swf.setType(this.type);if(this.chartStyle){this.setStyles(Ext.apply({},this.extraStyle,this.chartStyle))}if(this.categoryNames){this.setCategoryNames(this.categoryNames)}if(this.tipRenderer){a=this.getFunctionRef(this.tipRenderer);this.setTipRenderer(a.fn,a.scope)}if(this.legendRenderer){a=this.getFunctionRef(this.legendRenderer);this.setLegendRenderer(a.fn,a.scope)}if(!b){this.bindStore(this.store,true)}this.refresh.defer(10,this)},delayRefresh:function(){if(!this.refreshTask){this.refreshTask=new Ext.util.DelayedTask(this.refresh,this)}this.refreshTask.delay(this.refreshBuffer)},refresh:function(){if(this.fireEvent("beforerefresh",this)!==false){var m=false;var k=[],c=this.store.data.items;for(var g=0,l=c.length;g<l;g++){k[g]=c[g].data}var e=[];var d=0;var n=null;var h=0;if(this.series){d=this.series.length;for(h=0;h<d;h++){n=this.series[h];var b={};for(var a in n){if(a=="style"&&n.style!==null){b.style=Ext.encode(n.style);m=true}else{b[a]=n[a]}}e.push(b)}}if(d>0){for(h=0;h<d;h++){n=e[h];if(!n.type){n.type=this.type}n.dataProvider=k}}else{e.push({type:this.type,dataProvider:k})}this.swf.setDataProvider(e);if(this.seriesStyles){this.setSeriesStyles(this.seriesStyles)}this.fireEvent("refresh",this)}},createFnProxy:function(a){var b="extFnProxy"+(++Ext.chart.Chart.PROXY_FN_ID);Ext.chart.Chart.proxyFunction[b]=a;return"Ext.chart.Chart.proxyFunction."+b},removeFnProxy:function(a){if(!Ext.isEmpty(a)){a=a.replace("Ext.chart.Chart.proxyFunction.","");delete Ext.chart.Chart.proxyFunction[a]}},getFunctionRef:function(a){if(Ext.isFunction(a)){return{fn:a,scope:this}}else{return{fn:a.fn,scope:a.scope||this}}},onDestroy:function(){if(this.refreshTask&&this.refreshTask.cancel){this.refreshTask.cancel()}Ext.chart.Chart.superclass.onDestroy.call(this);this.bindStore(null);this.removeFnProxy(this.tipFnName);this.removeFnProxy(this.legendFnName)}});Ext.reg("chart",Ext.chart.Chart);Ext.chart.Chart.PROXY_FN_ID=0;Ext.chart.Chart.proxyFunction={};Ext.chart.Chart.CHART_URL="http://yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf";Ext.chart.PieChart=Ext.extend(Ext.chart.Chart,{type:"pie",onSwfReady:function(a){Ext.chart.PieChart.superclass.onSwfReady.call(this,a);this.setDataField(this.dataField);this.setCategoryField(this.categoryField)},setDataField:function(a){this.dataField=a;this.swf.setDataField(a)},setCategoryField:function(a){this.categoryField=a;this.swf.setCategoryField(a)}});Ext.reg("piechart",Ext.chart.PieChart);Ext.chart.CartesianChart=Ext.extend(Ext.chart.Chart,{onSwfReady:function(a){Ext.chart.CartesianChart.superclass.onSwfReady.call(this,a);this.labelFn=[];if(this.xField){this.setXField(this.xField)}if(this.yField){this.setYField(this.yField)}if(this.xAxis){this.setXAxis(this.xAxis)}if(this.xAxes){this.setXAxes(this.xAxes)}if(this.yAxis){this.setYAxis(this.yAxis)}if(this.yAxes){this.setYAxes(this.yAxes)}if(Ext.isDefined(this.constrainViewport)){this.swf.setConstrainViewport(this.constrainViewport)}},setXField:function(a){this.xField=a;this.swf.setHorizontalField(a)},setYField:function(a){this.yField=a;this.swf.setVerticalField(a)},setXAxis:function(a){this.xAxis=this.createAxis("xAxis",a);this.swf.setHorizontalAxis(this.xAxis)},setXAxes:function(c){var b;for(var a=0;a<c.length;a++){b=this.createAxis("xAxis"+a,c[a]);this.swf.setHorizontalAxis(b)}},setYAxis:function(a){this.yAxis=this.createAxis("yAxis",a);this.swf.setVerticalAxis(this.yAxis)},setYAxes:function(c){var b;for(var a=0;a<c.length;a++){b=this.createAxis("yAxis"+a,c[a]);this.swf.setVerticalAxis(b)}},createAxis:function(b,d){var e=Ext.apply({},d),c,a;if(this[b]){a=this[b].labelFunction;this.removeFnProxy(a);this.labelFn.remove(a)}if(e.labelRenderer){c=this.getFunctionRef(e.labelRenderer);e.labelFunction=this.createFnProxy(function(g){return c.fn.call(c.scope,g)});delete e.labelRenderer;this.labelFn.push(e.labelFunction)}if(b.indexOf("xAxis")>-1&&e.position=="left"){e.position="bottom"}return e},onDestroy:function(){Ext.chart.CartesianChart.superclass.onDestroy.call(this);Ext.each(this.labelFn,function(a){this.removeFnProxy(a)},this)}});Ext.reg("cartesianchart",Ext.chart.CartesianChart);Ext.chart.LineChart=Ext.extend(Ext.chart.CartesianChart,{type:"line"});Ext.reg("linechart",Ext.chart.LineChart);Ext.chart.ColumnChart=Ext.extend(Ext.chart.CartesianChart,{type:"column"});Ext.reg("columnchart",Ext.chart.ColumnChart);Ext.chart.StackedColumnChart=Ext.extend(Ext.chart.CartesianChart,{type:"stackcolumn"});Ext.reg("stackedcolumnchart",Ext.chart.StackedColumnChart);Ext.chart.BarChart=Ext.extend(Ext.chart.CartesianChart,{type:"bar"});Ext.reg("barchart",Ext.chart.BarChart);Ext.chart.StackedBarChart=Ext.extend(Ext.chart.CartesianChart,{type:"stackbar"});Ext.reg("stackedbarchart",Ext.chart.StackedBarChart);Ext.chart.Axis=function(a){Ext.apply(this,a)};Ext.chart.Axis.prototype={type:null,orientation:"horizontal",reverse:false,labelFunction:null,hideOverlappingLabels:true,labelSpacing:2};Ext.chart.NumericAxis=Ext.extend(Ext.chart.Axis,{type:"numeric",minimum:NaN,maximum:NaN,majorUnit:NaN,minorUnit:NaN,snapToUnits:true,alwaysShowZero:true,scale:"linear",roundMajorUnit:true,calculateByLabelSize:true,position:"left",adjustMaximumByMajorUnit:true,adjustMinimumByMajorUnit:true});Ext.chart.TimeAxis=Ext.extend(Ext.chart.Axis,{type:"time",minimum:null,maximum:null,majorUnit:NaN,majorTimeUnit:null,minorUnit:NaN,minorTimeUnit:null,snapToUnits:true,stackingEnabled:false,calculateByLabelSize:true});Ext.chart.CategoryAxis=Ext.extend(Ext.chart.Axis,{type:"category",categoryNames:null,calculateCategoryCount:false});Ext.chart.Series=function(a){Ext.apply(this,a)};Ext.chart.Series.prototype={type:null,displayName:null};Ext.chart.CartesianSeries=Ext.extend(Ext.chart.Series,{xField:null,yField:null,showInLegend:true,axis:"primary"});Ext.chart.ColumnSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"column"});Ext.chart.LineSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"line"});Ext.chart.BarSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"bar"});Ext.chart.PieSeries=Ext.extend(Ext.chart.Series,{type:"pie",dataField:null,categoryField:null});Ext.menu.Menu=Ext.extend(Ext.Container,{minWidth:120,shadow:"sides",subMenuAlign:"tl-tr?",defaultAlign:"tl-bl?",allowOtherMenus:false,ignoreParentClicks:false,enableScrolling:true,maxHeight:null,scrollIncrement:24,showSeparator:true,defaultOffsets:[0,0],plain:false,floating:true,zIndex:15000,hidden:true,layout:"menu",hideMode:"offsets",scrollerHeight:8,autoLayout:true,defaultType:"menuitem",bufferResize:false,initComponent:function(){if(Ext.isArray(this.initialConfig)){Ext.apply(this,{items:this.initialConfig})}this.addEvents("click","mouseover","mouseout","itemclick");Ext.menu.MenuMgr.register(this);if(this.floating){Ext.EventManager.onWindowResize(this.hide,this)}else{if(this.initialConfig.hidden!==false){this.hidden=false}this.internalDefaults={hideOnClick:false}}Ext.menu.Menu.superclass.initComponent.call(this);if(this.autoLayout){var a=this.doLayout.createDelegate(this,[]);this.on({add:a,remove:a})}},getLayoutTarget:function(){return this.ul},onRender:function(b,a){if(!b){b=Ext.getBody()}var c={id:this.getId(),cls:"x-menu "+((this.floating)?"x-menu-floating x-layer ":"")+(this.cls||"")+(this.plain?" x-menu-plain":"")+(this.showSeparator?"":" x-menu-nosep"),style:this.style,cn:[{tag:"a",cls:"x-menu-focus",href:"#",onclick:"return false;",tabIndex:"-1"},{tag:"ul",cls:"x-menu-list"}]};if(this.floating){this.el=new Ext.Layer({shadow:this.shadow,dh:c,constrain:false,parentEl:b,zindex:this.zIndex})}else{this.el=b.createChild(c)}Ext.menu.Menu.superclass.onRender.call(this,b,a);if(!this.keyNav){this.keyNav=new Ext.menu.MenuNav(this)}this.focusEl=this.el.child("a.x-menu-focus");this.ul=this.el.child("ul.x-menu-list");this.mon(this.ul,{scope:this,click:this.onClick,mouseover:this.onMouseOver,mouseout:this.onMouseOut});if(this.enableScrolling){this.mon(this.el,{scope:this,delegate:".x-menu-scroller",click:this.onScroll,mouseover:this.deactivateActive})}},findTargetItem:function(b){var a=b.getTarget(".x-menu-list-item",this.ul,true);if(a&&a.menuItemId){return this.items.get(a.menuItemId)}},onClick:function(b){var a=this.findTargetItem(b);if(a){if(a.isFormField){this.setActiveItem(a)}else{if(a instanceof Ext.menu.BaseItem){if(a.menu&&this.ignoreParentClicks){a.expandMenu();b.preventDefault()}else{if(a.onClick){a.onClick(b);this.fireEvent("click",this,a,b)}}}}}},setActiveItem:function(a,b){if(a!=this.activeItem){this.deactivateActive();if((this.activeItem=a).isFormField){a.focus()}else{a.activate(b)}}else{if(b){a.expandMenu()}}},deactivateActive:function(){var b=this.activeItem;if(b){if(b.isFormField){if(b.collapse){b.collapse()}}else{b.deactivate()}delete this.activeItem}},tryActivate:function(g,e){var b=this.items;for(var c=g,a=b.length;c>=0&&c<a;c+=e){var d=b.get(c);if(d.isVisible()&&!d.disabled&&(d.canActivate||d.isFormField)){this.setActiveItem(d,false);return d}}return false},onMouseOver:function(b){var a=this.findTargetItem(b);if(a){if(a.canActivate&&!a.disabled){this.setActiveItem(a,true)}}this.over=true;this.fireEvent("mouseover",this,b,a)},onMouseOut:function(b){var a=this.findTargetItem(b);if(a){if(a==this.activeItem&&a.shouldDeactivate&&a.shouldDeactivate(b)){this.activeItem.deactivate();delete this.activeItem}}this.over=false;this.fireEvent("mouseout",this,b,a)},onScroll:function(d,b){if(d){d.stopEvent()}var a=this.ul.dom,c=Ext.fly(b).is(".x-menu-scroller-top");a.scrollTop+=this.scrollIncrement*(c?-1:1);if(c?a.scrollTop<=0:a.scrollTop+this.activeMax>=a.scrollHeight){this.onScrollerOut(null,b)}},onScrollerIn:function(d,b){var a=this.ul.dom,c=Ext.fly(b).is(".x-menu-scroller-top");if(c?a.scrollTop>0:a.scrollTop+this.activeMax<a.scrollHeight){Ext.fly(b).addClass(["x-menu-item-active","x-menu-scroller-active"])}},onScrollerOut:function(b,a){Ext.fly(a).removeClass(["x-menu-item-active","x-menu-scroller-active"])},show:function(b,c,a){if(this.floating){this.parentMenu=a;if(!this.el){this.render();this.doLayout(false,true)}this.showAt(this.el.getAlignToXY(b,c||this.defaultAlign,this.defaultOffsets),a)}else{Ext.menu.Menu.superclass.show.call(this)}},showAt:function(b,a){if(this.fireEvent("beforeshow",this)!==false){this.parentMenu=a;if(!this.el){this.render()}if(this.enableScrolling){this.el.setXY(b);b[1]=this.constrainScroll(b[1]);b=[this.el.adjustForConstraints(b)[0],b[1]]}else{b=this.el.adjustForConstraints(b)}this.el.setXY(b);this.el.show();Ext.menu.Menu.superclass.onShow.call(this);if(Ext.isIE){this.fireEvent("autosize",this);if(!Ext.isIE8){this.el.repaint()}}this.hidden=false;this.focus();this.fireEvent("show",this)}},constrainScroll:function(i){var b,d=this.ul.setHeight("auto").getHeight(),a=i,h,e,g,c;if(this.floating){e=Ext.fly(this.el.dom.parentNode);g=e.getScroll().top;c=e.getViewSize().height;h=i-g;b=this.maxHeight?this.maxHeight:c-h;if(d>c){b=c;a=i-h}else{if(b<d){a=i-(d-b);b=d}}}else{b=this.getHeight()}if(this.maxHeight){b=Math.min(this.maxHeight,b)}if(d>b&&b>0){this.activeMax=b-this.scrollerHeight*2-this.el.getFrameWidth("tb")-Ext.num(this.el.shadowOffset,0);this.ul.setHeight(this.activeMax);this.createScrollers();this.el.select(".x-menu-scroller").setDisplayed("")}else{this.ul.setHeight(d);this.el.select(".x-menu-scroller").setDisplayed("none")}this.ul.dom.scrollTop=0;return a},createScrollers:function(){if(!this.scroller){this.scroller={pos:0,top:this.el.insertFirst({tag:"div",cls:"x-menu-scroller x-menu-scroller-top",html:"&#160;"}),bottom:this.el.createChild({tag:"div",cls:"x-menu-scroller x-menu-scroller-bottom",html:"&#160;"})};this.scroller.top.hover(this.onScrollerIn,this.onScrollerOut,this);this.scroller.topRepeater=new Ext.util.ClickRepeater(this.scroller.top,{listeners:{click:this.onScroll.createDelegate(this,[null,this.scroller.top],false)}});this.scroller.bottom.hover(this.onScrollerIn,this.onScrollerOut,this);this.scroller.bottomRepeater=new Ext.util.ClickRepeater(this.scroller.bottom,{listeners:{click:this.onScroll.createDelegate(this,[null,this.scroller.bottom],false)}})}},onLayout:function(){if(this.isVisible()){if(this.enableScrolling){this.constrainScroll(this.el.getTop())}if(this.floating){this.el.sync()}}},focus:function(){if(!this.hidden){this.doFocus.defer(50,this)}},doFocus:function(){if(!this.hidden){this.focusEl.focus()}},hide:function(a){if(!this.isDestroyed){this.deepHide=a;Ext.menu.Menu.superclass.hide.call(this);delete this.deepHide}},onHide:function(){Ext.menu.Menu.superclass.onHide.call(this);this.deactivateActive();if(this.el&&this.floating){this.el.hide()}var a=this.parentMenu;if(this.deepHide===true&&a){if(a.floating){a.hide(true)}else{a.deactivateActive()}}},lookupComponent:function(a){if(Ext.isString(a)){a=(a=="separator"||a=="-")?new Ext.menu.Separator():new Ext.menu.TextItem(a);this.applyDefaults(a)}else{if(Ext.isObject(a)){a=this.getMenuItem(a)}else{if(a.tagName||a.el){a=new Ext.BoxComponent({el:a})}}}return a},applyDefaults:function(b){if(!Ext.isString(b)){b=Ext.menu.Menu.superclass.applyDefaults.call(this,b);var a=this.internalDefaults;if(a){if(b.events){Ext.applyIf(b.initialConfig,a);Ext.apply(b,a)}else{Ext.applyIf(b,a)}}}return b},getMenuItem:function(a){a.ownerCt=this;if(!a.isXType){if(!a.xtype&&Ext.isBoolean(a.checked)){return new Ext.menu.CheckItem(a)}return Ext.create(a,this.defaultType)}return a},addSeparator:function(){return this.add(new Ext.menu.Separator())},addElement:function(a){return this.add(new Ext.menu.BaseItem({el:a}))},addItem:function(a){return this.add(a)},addMenuItem:function(a){return this.add(this.getMenuItem(a))},addText:function(a){return this.add(new Ext.menu.TextItem(a))},onDestroy:function(){Ext.EventManager.removeResizeListener(this.hide,this);var a=this.parentMenu;if(a&&a.activeChild==this){delete a.activeChild}delete this.parentMenu;Ext.menu.Menu.superclass.onDestroy.call(this);Ext.menu.MenuMgr.unregister(this);if(this.keyNav){this.keyNav.disable()}var b=this.scroller;if(b){Ext.destroy(b.topRepeater,b.bottomRepeater,b.top,b.bottom)}Ext.destroy(this.el,this.focusEl,this.ul)}});Ext.reg("menu",Ext.menu.Menu);Ext.menu.MenuNav=Ext.extend(Ext.KeyNav,function(){function a(d,c){if(!c.tryActivate(c.items.indexOf(c.activeItem)-1,-1)){c.tryActivate(c.items.length-1,-1)}}function b(d,c){if(!c.tryActivate(c.items.indexOf(c.activeItem)+1,1)){c.tryActivate(0,1)}}return{constructor:function(c){Ext.menu.MenuNav.superclass.constructor.call(this,c.el);this.scope=this.menu=c},doRelay:function(g,d){var c=g.getKey();if(this.menu.activeItem&&this.menu.activeItem.isFormField&&c!=g.TAB){return false}if(!this.menu.activeItem&&g.isNavKeyPress()&&c!=g.SPACE&&c!=g.RETURN){this.menu.tryActivate(0,1);return false}return d.call(this.scope||this,g,this.menu)},tab:function(d,c){d.stopEvent();if(d.shiftKey){a(d,c)}else{b(d,c)}},up:a,down:b,right:function(d,c){if(c.activeItem){c.activeItem.expandMenu(true)}},left:function(d,c){c.hide();if(c.parentMenu&&c.parentMenu.activeItem){c.parentMenu.activeItem.activate()}},enter:function(d,c){if(c.activeItem){d.stopPropagation();c.activeItem.onClick(d);c.fireEvent("click",this,c.activeItem);return true}}}}());Ext.menu.MenuMgr=function(){var h,e,b,d={},a=false,l=new Date();function n(){h={};e=new Ext.util.MixedCollection();b=Ext.getDoc().addKeyListener(27,j);b.disable()}function j(){if(e&&e.length>0){var o=e.clone();o.each(function(p){p.hide()});return true}return false}function g(o){e.remove(o);if(e.length<1){b.disable();Ext.getDoc().un("mousedown",m);a=false}}function k(o){var p=e.last();l=new Date();e.add(o);if(!a){b.enable();Ext.getDoc().on("mousedown",m);a=true}if(o.parentMenu){o.getEl().setZIndex(parseInt(o.parentMenu.getEl().getStyle("z-index"),10)+3);o.parentMenu.activeChild=o}else{if(p&&!p.isDestroyed&&p.isVisible()){o.getEl().setZIndex(parseInt(p.getEl().getStyle("z-index"),10)+3)}}}function c(o){if(o.activeChild){o.activeChild.hide()}if(o.autoHideTimer){clearTimeout(o.autoHideTimer);delete o.autoHideTimer}}function i(o){var p=o.parentMenu;if(!p&&!o.allowOtherMenus){j()}else{if(p&&p.activeChild){p.activeChild.hide()}}}function m(o){if(l.getElapsed()>50&&e.length>0&&!o.getTarget(".x-menu")){j()}}return{hideAll:function(){return j()},register:function(o){if(!h){n()}h[o.id]=o;o.on({beforehide:c,hide:g,beforeshow:i,show:k})},get:function(o){if(typeof o=="string"){if(!h){return null}return h[o]}else{if(o.events){return o}else{if(typeof o.length=="number"){return new Ext.menu.Menu({items:o})}else{return Ext.create(o,"menu")}}}},unregister:function(o){delete h[o.id];o.un("beforehide",c);o.un("hide",g);o.un("beforeshow",i);o.un("show",k)},registerCheckable:function(o){var p=o.group;if(p){if(!d[p]){d[p]=[]}d[p].push(o)}},unregisterCheckable:function(o){var p=o.group;if(p){d[p].remove(o)}},onCheckChange:function(q,r){if(q.group&&r){var t=d[q.group],p=0,o=t.length,s;for(;p<o;p++){s=t[p];if(s!=q){s.setChecked(false)}}}},getCheckedItem:function(q){var r=d[q];if(r){for(var p=0,o=r.length;p<o;p++){if(r[p].checked){return r[p]}}}return null},setCheckedItem:function(q,s){var r=d[q];if(r){for(var p=0,o=r.length;p<o;p++){if(r[p].id==s){r[p].setChecked(true)}}}return null}}}();Ext.menu.BaseItem=Ext.extend(Ext.Component,{canActivate:false,activeClass:"x-menu-item-active",hideOnClick:true,clickHideDelay:1,ctype:"Ext.menu.BaseItem",actionMode:"container",initComponent:function(){Ext.menu.BaseItem.superclass.initComponent.call(this);this.addEvents("click","activate","deactivate");if(this.handler){this.on("click",this.handler,this.scope)}},onRender:function(b,a){Ext.menu.BaseItem.superclass.onRender.apply(this,arguments);if(this.ownerCt&&this.ownerCt instanceof Ext.menu.Menu){this.parentMenu=this.ownerCt}else{this.container.addClass("x-menu-list-item");this.mon(this.el,{scope:this,click:this.onClick,mouseenter:this.activate,mouseleave:this.deactivate})}},setHandler:function(b,a){if(this.handler){this.un("click",this.handler,this.scope)}this.on("click",this.handler=b,this.scope=a)},onClick:function(a){if(!this.disabled&&this.fireEvent("click",this,a)!==false&&(this.parentMenu&&this.parentMenu.fireEvent("itemclick",this,a)!==false)){this.handleClick(a)}else{a.stopEvent()}},activate:function(){if(this.disabled){return false}var a=this.container;a.addClass(this.activeClass);this.region=a.getRegion().adjust(2,2,-2,-2);this.fireEvent("activate",this);return true},deactivate:function(){this.container.removeClass(this.activeClass);this.fireEvent("deactivate",this)},shouldDeactivate:function(a){return !this.region||!this.region.contains(a.getPoint())},handleClick:function(b){var a=this.parentMenu;if(this.hideOnClick){if(a.floating){this.clickHideDelayTimer=a.hide.defer(this.clickHideDelay,a,[true])}else{a.deactivateActive()}}},beforeDestroy:function(){clearTimeout(this.clickHideDelayTimer);Ext.menu.BaseItem.superclass.beforeDestroy.call(this)},expandMenu:Ext.emptyFn,hideMenu:Ext.emptyFn});Ext.reg("menubaseitem",Ext.menu.BaseItem);Ext.menu.TextItem=Ext.extend(Ext.menu.BaseItem,{hideOnClick:false,itemCls:"x-menu-text",constructor:function(a){if(typeof a=="string"){a={text:a}}Ext.menu.TextItem.superclass.constructor.call(this,a)},onRender:function(){var a=document.createElement("span");a.className=this.itemCls;a.innerHTML=this.text;this.el=a;Ext.menu.TextItem.superclass.onRender.apply(this,arguments)}});Ext.reg("menutextitem",Ext.menu.TextItem);Ext.menu.Separator=Ext.extend(Ext.menu.BaseItem,{itemCls:"x-menu-sep",hideOnClick:false,activeClass:"",onRender:function(a){var b=document.createElement("span");b.className=this.itemCls;b.innerHTML="&#160;";this.el=b;a.addClass("x-menu-sep-li");Ext.menu.Separator.superclass.onRender.apply(this,arguments)}});Ext.reg("menuseparator",Ext.menu.Separator);Ext.menu.Item=Ext.extend(Ext.menu.BaseItem,{itemCls:"x-menu-item",canActivate:true,showDelay:200,altText:"",hideDelay:200,ctype:"Ext.menu.Item",initComponent:function(){Ext.menu.Item.superclass.initComponent.call(this);if(this.menu){if(Ext.isArray(this.menu)){this.menu={items:this.menu}}if(Ext.isObject(this.menu)){this.menu.ownerCt=this}this.menu=Ext.menu.MenuMgr.get(this.menu);this.menu.ownerCt=undefined}},onRender:function(d,b){if(!this.itemTpl){this.itemTpl=Ext.menu.Item.prototype.itemTpl=new Ext.XTemplate('<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"','<tpl if="hrefTarget">',' target="{hrefTarget}"',"</tpl>",">",'<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>','<span class="x-menu-item-text">{text}</span>',"</a>")}var c=this.getTemplateArgs();this.el=b?this.itemTpl.insertBefore(b,c,true):this.itemTpl.append(d,c,true);this.iconEl=this.el.child("img.x-menu-item-icon");this.textEl=this.el.child(".x-menu-item-text");if(!this.href){this.mon(this.el,"click",Ext.emptyFn,null,{preventDefault:true})}Ext.menu.Item.superclass.onRender.call(this,d,b)},getTemplateArgs:function(){return{id:this.id,cls:this.itemCls+(this.menu?" x-menu-item-arrow":"")+(this.cls?" "+this.cls:""),href:this.href||"#",hrefTarget:this.hrefTarget,icon:this.icon||Ext.BLANK_IMAGE_URL,iconCls:this.iconCls||"",text:this.itemText||this.text||"&#160;",altText:this.altText||""}},setText:function(a){this.text=a||"&#160;";if(this.rendered){this.textEl.update(this.text);this.parentMenu.layout.doAutoSize()}},setIconClass:function(a){var b=this.iconCls;this.iconCls=a;if(this.rendered){this.iconEl.replaceClass(b,this.iconCls)}},beforeDestroy:function(){clearTimeout(this.showTimer);clearTimeout(this.hideTimer);if(this.menu){delete this.menu.ownerCt;this.menu.destroy()}Ext.menu.Item.superclass.beforeDestroy.call(this)},handleClick:function(a){if(!this.href){a.stopEvent()}Ext.menu.Item.superclass.handleClick.apply(this,arguments)},activate:function(a){if(Ext.menu.Item.superclass.activate.apply(this,arguments)){this.focus();if(a){this.expandMenu()}}return true},shouldDeactivate:function(a){if(Ext.menu.Item.superclass.shouldDeactivate.call(this,a)){if(this.menu&&this.menu.isVisible()){return !this.menu.getEl().getRegion().contains(a.getPoint())}return true}return false},deactivate:function(){Ext.menu.Item.superclass.deactivate.apply(this,arguments);this.hideMenu()},expandMenu:function(a){if(!this.disabled&&this.menu){clearTimeout(this.hideTimer);delete this.hideTimer;if(!this.menu.isVisible()&&!this.showTimer){this.showTimer=this.deferExpand.defer(this.showDelay,this,[a])}else{if(this.menu.isVisible()&&a){this.menu.tryActivate(0,1)}}}},deferExpand:function(a){delete this.showTimer;this.menu.show(this.container,this.parentMenu.subMenuAlign||"tl-tr?",this.parentMenu);if(a){this.menu.tryActivate(0,1)}},hideMenu:function(){clearTimeout(this.showTimer);delete this.showTimer;if(!this.hideTimer&&this.menu&&this.menu.isVisible()){this.hideTimer=this.deferHide.defer(this.hideDelay,this)}},deferHide:function(){delete this.hideTimer;if(this.menu.over){this.parentMenu.setActiveItem(this,false)}else{this.menu.hide()}}});Ext.reg("menuitem",Ext.menu.Item);Ext.menu.CheckItem=Ext.extend(Ext.menu.Item,{itemCls:"x-menu-item x-menu-check-item",groupClass:"x-menu-group-item",checked:false,ctype:"Ext.menu.CheckItem",initComponent:function(){Ext.menu.CheckItem.superclass.initComponent.call(this);this.addEvents("beforecheckchange","checkchange");if(this.checkHandler){this.on("checkchange",this.checkHandler,this.scope)}Ext.menu.MenuMgr.registerCheckable(this)},onRender:function(a){Ext.menu.CheckItem.superclass.onRender.apply(this,arguments);if(this.group){this.el.addClass(this.groupClass)}if(this.checked){this.checked=false;this.setChecked(true,true)}},destroy:function(){Ext.menu.MenuMgr.unregisterCheckable(this);Ext.menu.CheckItem.superclass.destroy.apply(this,arguments)},setChecked:function(b,a){var c=a===true;if(this.checked!=b&&(c||this.fireEvent("beforecheckchange",this,b)!==false)){Ext.menu.MenuMgr.onCheckChange(this,b);if(this.container){this.container[b?"addClass":"removeClass"]("x-menu-item-checked")}this.checked=b;if(!c){this.fireEvent("checkchange",this,b)}}},handleClick:function(a){if(!this.disabled&&!(this.checked&&this.group)){this.setChecked(!this.checked)}Ext.menu.CheckItem.superclass.handleClick.apply(this,arguments)}});Ext.reg("menucheckitem",Ext.menu.CheckItem);Ext.menu.DateMenu=Ext.extend(Ext.menu.Menu,{enableScrolling:false,hideOnClick:true,pickerId:null,cls:"x-date-menu",initComponent:function(){this.on("beforeshow",this.onBeforeShow,this);if(this.strict=(Ext.isIE7&&Ext.isStrict)){this.on("show",this.onShow,this,{single:true,delay:20})}Ext.apply(this,{plain:true,showSeparator:false,items:this.picker=new Ext.DatePicker(Ext.applyIf({internalRender:this.strict||!Ext.isIE,ctCls:"x-menu-date-item",id:this.pickerId},this.initialConfig))});this.picker.purgeListeners();Ext.menu.DateMenu.superclass.initComponent.call(this);this.relayEvents(this.picker,["select"]);this.on("show",this.picker.focus,this.picker);this.on("select",this.menuHide,this);if(this.handler){this.on("select",this.handler,this.scope||this)}},menuHide:function(){if(this.hideOnClick){this.hide(true)}},onBeforeShow:function(){if(this.picker){this.picker.hideMonthPicker(true)}},onShow:function(){var a=this.picker.getEl();a.setWidth(a.getWidth())}});Ext.reg("datemenu",Ext.menu.DateMenu);Ext.menu.ColorMenu=Ext.extend(Ext.menu.Menu,{enableScrolling:false,hideOnClick:true,cls:"x-color-menu",paletteId:null,initComponent:function(){Ext.apply(this,{plain:true,showSeparator:false,items:this.palette=new Ext.ColorPalette(Ext.applyIf({id:this.paletteId},this.initialConfig))});this.palette.purgeListeners();Ext.menu.ColorMenu.superclass.initComponent.call(this);this.relayEvents(this.palette,["select"]);this.on("select",this.menuHide,this);if(this.handler){this.on("select",this.handler,this.scope||this)}},menuHide:function(){if(this.hideOnClick){this.hide(true)}}});Ext.reg("colormenu",Ext.menu.ColorMenu);Ext.form.Field=Ext.extend(Ext.BoxComponent,{invalidClass:"x-form-invalid",invalidText:"The value in this field is invalid",focusClass:"x-form-focus",validationEvent:"keyup",validateOnBlur:true,validationDelay:250,defaultAutoCreate:{tag:"input",type:"text",size:"20",autocomplete:"off"},fieldClass:"x-form-field",msgTarget:"qtip",msgFx:"normal",readOnly:false,disabled:false,submitValue:true,isFormField:true,msgDisplay:"",hasFocus:false,initComponent:function(){Ext.form.Field.superclass.initComponent.call(this);this.addEvents("focus","blur","specialkey","change","invalid","valid")},getName:function(){return this.rendered&&this.el.dom.name?this.el.dom.name:this.name||this.id||""},onRender:function(c,a){if(!this.el){var b=this.getAutoCreate();if(!b.name){b.name=this.name||this.id}if(this.inputType){b.type=this.inputType}this.autoEl=b}Ext.form.Field.superclass.onRender.call(this,c,a);if(this.submitValue===false){this.el.dom.removeAttribute("name")}var d=this.el.dom.type;if(d){if(d=="password"){d="text"}this.el.addClass("x-form-"+d)}if(this.readOnly){this.setReadOnly(true)}if(this.tabIndex!==undefined){this.el.dom.setAttribute("tabIndex",this.tabIndex)}this.el.addClass([this.fieldClass,this.cls])},getItemCt:function(){return this.itemCt},initValue:function(){if(this.value!==undefined){this.setValue(this.value)}else{if(!Ext.isEmpty(this.el.dom.value)&&this.el.dom.value!=this.emptyText){this.setValue(this.el.dom.value)}}this.originalValue=this.getValue()},isDirty:function(){if(this.disabled||!this.rendered){return false}return String(this.getValue())!==String(this.originalValue)},setReadOnly:function(a){if(this.rendered){this.el.dom.readOnly=a}this.readOnly=a},afterRender:function(){Ext.form.Field.superclass.afterRender.call(this);this.initEvents();this.initValue()},fireKey:function(a){if(a.isSpecialKey()){this.fireEvent("specialkey",this,a)}},reset:function(){this.setValue(this.originalValue);this.clearInvalid()},initEvents:function(){this.mon(this.el,Ext.EventManager.getKeyEvent(),this.fireKey,this);this.mon(this.el,"focus",this.onFocus,this);this.mon(this.el,"blur",this.onBlur,this,this.inEditor?{buffer:10}:null)},preFocus:Ext.emptyFn,onFocus:function(){this.preFocus();if(this.focusClass){this.el.addClass(this.focusClass)}if(!this.hasFocus){this.hasFocus=true;this.startValue=this.getValue();this.fireEvent("focus",this)}},beforeBlur:Ext.emptyFn,onBlur:function(){this.beforeBlur();if(this.focusClass){this.el.removeClass(this.focusClass)}this.hasFocus=false;if(this.validationEvent!==false&&(this.validateOnBlur||this.validationEvent=="blur")){this.validate()}var a=this.getValue();if(String(a)!==String(this.startValue)){this.fireEvent("change",this,a,this.startValue)}this.fireEvent("blur",this);this.postBlur()},postBlur:Ext.emptyFn,isValid:function(a){if(this.disabled){return true}var c=this.preventMark;this.preventMark=a===true;var b=this.validateValue(this.processValue(this.getRawValue()),a);this.preventMark=c;return b},validate:function(){if(this.disabled||this.validateValue(this.processValue(this.getRawValue()))){this.clearInvalid();return true}return false},processValue:function(a){return a},validateValue:function(b){var a=this.getErrors(b)[0];if(a==undefined){return true}else{this.markInvalid(a);return false}},getErrors:function(){return[]},getActiveError:function(){return this.activeError||""},markInvalid:function(c){if(this.rendered&&!this.preventMark){c=c||this.invalidText;var a=this.getMessageHandler();if(a){a.mark(this,c)}else{if(this.msgTarget){this.el.addClass(this.invalidClass);var b=Ext.getDom(this.msgTarget);if(b){b.innerHTML=c;b.style.display=this.msgDisplay}}}}this.setActiveError(c)},clearInvalid:function(){if(this.rendered&&!this.preventMark){this.el.removeClass(this.invalidClass);var a=this.getMessageHandler();if(a){a.clear(this)}else{if(this.msgTarget){this.el.removeClass(this.invalidClass);var b=Ext.getDom(this.msgTarget);if(b){b.innerHTML="";b.style.display="none"}}}}this.unsetActiveError()},setActiveError:function(b,a){this.activeError=b;if(a!==true){this.fireEvent("invalid",this,b)}},unsetActiveError:function(a){delete this.activeError;if(a!==true){this.fireEvent("valid",this)}},getMessageHandler:function(){return Ext.form.MessageTargets[this.msgTarget]},getErrorCt:function(){return this.el.findParent(".x-form-element",5,true)||this.el.findParent(".x-form-field-wrap",5,true)},alignErrorEl:function(){this.errorEl.setWidth(this.getErrorCt().getWidth(true)-20)},alignErrorIcon:function(){this.errorIcon.alignTo(this.el,"tl-tr",[2,0])},getRawValue:function(){var a=this.rendered?this.el.getValue():Ext.value(this.value,"");if(a===this.emptyText){a=""}return a},getValue:function(){if(!this.rendered){return this.value}var a=this.el.getValue();if(a===this.emptyText||a===undefined){a=""}return a},setRawValue:function(a){return this.rendered?(this.el.dom.value=(Ext.isEmpty(a)?"":a)):""},setValue:function(a){this.value=a;if(this.rendered){this.el.dom.value=(Ext.isEmpty(a)?"":a);this.validate()}return this},append:function(a){this.setValue([this.getValue(),a].join(""))}});Ext.form.MessageTargets={qtip:{mark:function(a,b){a.el.addClass(a.invalidClass);a.el.dom.qtip=b;a.el.dom.qclass="x-form-invalid-tip";if(Ext.QuickTips){Ext.QuickTips.enable()}},clear:function(a){a.el.removeClass(a.invalidClass);a.el.dom.qtip=""}},title:{mark:function(a,b){a.el.addClass(a.invalidClass);a.el.dom.title=b},clear:function(a){a.el.dom.title=""}},under:{mark:function(b,c){b.el.addClass(b.invalidClass);if(!b.errorEl){var a=b.getErrorCt();if(!a){b.el.dom.title=c;return}b.errorEl=a.createChild({cls:"x-form-invalid-msg"});b.on("resize",b.alignErrorEl,b);b.on("destroy",function(){Ext.destroy(this.errorEl)},b)}b.alignErrorEl();b.errorEl.update(c);Ext.form.Field.msgFx[b.msgFx].show(b.errorEl,b)},clear:function(a){a.el.removeClass(a.invalidClass);if(a.errorEl){Ext.form.Field.msgFx[a.msgFx].hide(a.errorEl,a)}else{a.el.dom.title=""}}},side:{mark:function(b,c){b.el.addClass(b.invalidClass);if(!b.errorIcon){var a=b.getErrorCt();if(!a){b.el.dom.title=c;return}b.errorIcon=a.createChild({cls:"x-form-invalid-icon"});if(b.ownerCt){b.ownerCt.on("afterlayout",b.alignErrorIcon,b);b.ownerCt.on("expand",b.alignErrorIcon,b)}b.on("resize",b.alignErrorIcon,b);b.on("destroy",function(){Ext.destroy(this.errorIcon)},b)}b.alignErrorIcon();b.errorIcon.dom.qtip=c;b.errorIcon.dom.qclass="x-form-invalid-tip";b.errorIcon.show()},clear:function(a){a.el.removeClass(a.invalidClass);if(a.errorIcon){a.errorIcon.dom.qtip="";a.errorIcon.hide()}else{a.el.dom.title=""}}}};Ext.form.Field.msgFx={normal:{show:function(a,b){a.setDisplayed("block")},hide:function(a,b){a.setDisplayed(false).update("")}},slide:{show:function(a,b){a.slideIn("t",{stopFx:true})},hide:function(a,b){a.slideOut("t",{stopFx:true,useDisplay:true})}},slideRight:{show:function(a,b){a.fixDisplay();a.alignTo(b.el,"tl-tr");a.slideIn("l",{stopFx:true})},hide:function(a,b){a.slideOut("l",{stopFx:true,useDisplay:true})}}};Ext.reg("field",Ext.form.Field);Ext.form.TextField=Ext.extend(Ext.form.Field,{grow:false,growMin:30,growMax:800,vtype:null,maskRe:null,disableKeyFilter:false,allowBlank:true,minLength:0,maxLength:Number.MAX_VALUE,minLengthText:"The minimum length for this field is {0}",maxLengthText:"The maximum length for this field is {0}",selectOnFocus:false,blankText:"This field is required",validator:null,regex:null,regexText:"",emptyText:null,emptyClass:"x-form-empty-field",initComponent:function(){Ext.form.TextField.superclass.initComponent.call(this);this.addEvents("autosize","keydown","keyup","keypress")},initEvents:function(){Ext.form.TextField.superclass.initEvents.call(this);if(this.validationEvent=="keyup"){this.validationTask=new Ext.util.DelayedTask(this.validate,this);this.mon(this.el,"keyup",this.filterValidation,this)}else{if(this.validationEvent!==false&&this.validationEvent!="blur"){this.mon(this.el,this.validationEvent,this.validate,this,{buffer:this.validationDelay})}}if(this.selectOnFocus||this.emptyText){this.mon(this.el,"mousedown",this.onMouseDown,this);if(this.emptyText){this.applyEmptyText()}}if(this.maskRe||(this.vtype&&this.disableKeyFilter!==true&&(this.maskRe=Ext.form.VTypes[this.vtype+"Mask"]))){this.mon(this.el,"keypress",this.filterKeys,this)}if(this.grow){this.mon(this.el,"keyup",this.onKeyUpBuffered,this,{buffer:50});this.mon(this.el,"click",this.autoSize,this)}if(this.enableKeyEvents){this.mon(this.el,{scope:this,keyup:this.onKeyUp,keydown:this.onKeyDown,keypress:this.onKeyPress})}},onMouseDown:function(a){if(!this.hasFocus){this.mon(this.el,"mouseup",Ext.emptyFn,this,{single:true,preventDefault:true})}},processValue:function(a){if(this.stripCharsRe){var b=a.replace(this.stripCharsRe,"");if(b!==a){this.setRawValue(b);return b}}return a},filterValidation:function(a){if(!a.isNavKeyPress()){this.validationTask.delay(this.validationDelay)}},onDisable:function(){Ext.form.TextField.superclass.onDisable.call(this);if(Ext.isIE){this.el.dom.unselectable="on"}},onEnable:function(){Ext.form.TextField.superclass.onEnable.call(this);if(Ext.isIE){this.el.dom.unselectable=""}},onKeyUpBuffered:function(a){if(this.doAutoSize(a)){this.autoSize()}},doAutoSize:function(a){return !a.isNavKeyPress()},onKeyUp:function(a){this.fireEvent("keyup",this,a)},onKeyDown:function(a){this.fireEvent("keydown",this,a)},onKeyPress:function(a){this.fireEvent("keypress",this,a)},reset:function(){Ext.form.TextField.superclass.reset.call(this);this.applyEmptyText()},applyEmptyText:function(){if(this.rendered&&this.emptyText&&this.getRawValue().length<1&&!this.hasFocus){this.setRawValue(this.emptyText);this.el.addClass(this.emptyClass)}},preFocus:function(){var a=this.el,b;if(this.emptyText){if(a.dom.value==this.emptyText){this.setRawValue("");b=true}a.removeClass(this.emptyClass)}if(this.selectOnFocus||b){a.dom.select()}},postBlur:function(){this.applyEmptyText()},filterKeys:function(b){if(b.ctrlKey){return}var a=b.getKey();if(Ext.isGecko&&(b.isNavKeyPress()||a==b.BACKSPACE||(a==b.DELETE&&b.button==-1))){return}var c=String.fromCharCode(b.getCharCode());if(!Ext.isGecko&&b.isSpecialKey()&&!c){return}if(!this.maskRe.test(c)){b.stopEvent()}},setValue:function(a){if(this.emptyText&&this.el&&!Ext.isEmpty(a)){this.el.removeClass(this.emptyClass)}Ext.form.TextField.superclass.setValue.apply(this,arguments);this.applyEmptyText();this.autoSize();return this},getErrors:function(a){var d=Ext.form.TextField.superclass.getErrors.apply(this,arguments);a=Ext.isDefined(a)?a:this.processValue(this.getRawValue());if(Ext.isFunction(this.validator)){var c=this.validator(a);if(c!==true){d.push(c)}}if(a.length<1||a===this.emptyText){if(this.allowBlank){return d}else{d.push(this.blankText)}}if(!this.allowBlank&&(a.length<1||a===this.emptyText)){d.push(this.blankText)}if(a.length<this.minLength){d.push(String.format(this.minLengthText,this.minLength))}if(a.length>this.maxLength){d.push(String.format(this.maxLengthText,this.maxLength))}if(this.vtype){var b=Ext.form.VTypes;if(!b[this.vtype](a,this)){d.push(this.vtypeText||b[this.vtype+"Text"])}}if(this.regex&&!this.regex.test(a)){d.push(this.regexText)}return d},selectText:function(h,a){var c=this.getRawValue();var e=false;if(c.length>0){h=h===undefined?0:h;a=a===undefined?c.length:a;var g=this.el.dom;if(g.setSelectionRange){g.setSelectionRange(h,a)}else{if(g.createTextRange){var b=g.createTextRange();b.moveStart("character",h);b.moveEnd("character",a-c.length);b.select()}}e=Ext.isGecko||Ext.isOpera}else{e=true}if(e){this.focus()}},autoSize:function(){if(!this.grow||!this.rendered){return}if(!this.metrics){this.metrics=Ext.util.TextMetrics.createInstance(this.el)}var c=this.el;var b=c.dom.value;var e=document.createElement("div");e.appendChild(document.createTextNode(b));b=e.innerHTML;Ext.removeNode(e);e=null;b+="&#160;";var a=Math.min(this.growMax,Math.max(this.metrics.getWidth(b)+10,this.growMin));this.el.setWidth(a);this.fireEvent("autosize",this,a)},onDestroy:function(){if(this.validationTask){this.validationTask.cancel();this.validationTask=null}Ext.form.TextField.superclass.onDestroy.call(this)}});Ext.reg("textfield",Ext.form.TextField);Ext.form.TriggerField=Ext.extend(Ext.form.TextField,{defaultAutoCreate:{tag:"input",type:"text",size:"16",autocomplete:"off"},hideTrigger:false,editable:true,readOnly:false,wrapFocusClass:"x-trigger-wrap-focus",autoSize:Ext.emptyFn,monitorTab:true,deferHeight:true,mimicing:false,actionMode:"wrap",defaultTriggerWidth:17,onResize:function(a,c){Ext.form.TriggerField.superclass.onResize.call(this,a,c);var b=this.getTriggerWidth();if(Ext.isNumber(a)){this.el.setWidth(a-b)}this.wrap.setWidth(this.el.getWidth()+b)},getTriggerWidth:function(){var a=this.trigger.getWidth();if(!this.hideTrigger&&!this.readOnly&&a===0){a=this.defaultTriggerWidth}return a},alignErrorIcon:function(){if(this.wrap){this.errorIcon.alignTo(this.wrap,"tl-tr",[2,0])}},onRender:function(b,a){this.doc=Ext.isIE?Ext.getBody():Ext.getDoc();Ext.form.TriggerField.superclass.onRender.call(this,b,a);this.wrap=this.el.wrap({cls:"x-form-field-wrap x-form-field-trigger-wrap"});this.trigger=this.wrap.createChild(this.triggerConfig||{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.triggerClass});this.initTrigger();if(!this.width){this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth())}this.resizeEl=this.positionEl=this.wrap},getWidth:function(){return(this.el.getWidth()+this.trigger.getWidth())},updateEditState:function(){if(this.rendered){if(this.readOnly){this.el.dom.readOnly=true;this.el.addClass("x-trigger-noedit");this.mun(this.el,"click",this.onTriggerClick,this);this.trigger.setDisplayed(false)}else{if(!this.editable){this.el.dom.readOnly=true;this.el.addClass("x-trigger-noedit");this.mon(this.el,"click",this.onTriggerClick,this)}else{this.el.dom.readOnly=false;this.el.removeClass("x-trigger-noedit");this.mun(this.el,"click",this.onTriggerClick,this)}this.trigger.setDisplayed(!this.hideTrigger)}this.onResize(this.width||this.wrap.getWidth())}},setHideTrigger:function(a){if(a!=this.hideTrigger){this.hideTrigger=a;this.updateEditState()}},setEditable:function(a){if(a!=this.editable){this.editable=a;this.updateEditState()}},setReadOnly:function(a){if(a!=this.readOnly){this.readOnly=a;this.updateEditState()}},afterRender:function(){Ext.form.TriggerField.superclass.afterRender.call(this);this.updateEditState()},initTrigger:function(){this.mon(this.trigger,"click",this.onTriggerClick,this,{preventDefault:true});this.trigger.addClassOnOver("x-form-trigger-over");this.trigger.addClassOnClick("x-form-trigger-click")},onDestroy:function(){Ext.destroy(this.trigger,this.wrap);if(this.mimicing){this.doc.un("mousedown",this.mimicBlur,this)}delete this.doc;Ext.form.TriggerField.superclass.onDestroy.call(this)},onFocus:function(){Ext.form.TriggerField.superclass.onFocus.call(this);if(!this.mimicing){this.wrap.addClass(this.wrapFocusClass);this.mimicing=true;this.doc.on("mousedown",this.mimicBlur,this,{delay:10});if(this.monitorTab){this.on("specialkey",this.checkTab,this)}}},checkTab:function(a,b){if(b.getKey()==b.TAB){this.triggerBlur()}},onBlur:Ext.emptyFn,mimicBlur:function(a){if(!this.isDestroyed&&!this.wrap.contains(a.target)&&this.validateBlur(a)){this.triggerBlur()}},triggerBlur:function(){this.mimicing=false;this.doc.un("mousedown",this.mimicBlur,this);if(this.monitorTab&&this.el){this.un("specialkey",this.checkTab,this)}Ext.form.TriggerField.superclass.onBlur.call(this);if(this.wrap){this.wrap.removeClass(this.wrapFocusClass)}},beforeBlur:Ext.emptyFn,validateBlur:function(a){return true},onTriggerClick:Ext.emptyFn});Ext.form.TwinTriggerField=Ext.extend(Ext.form.TriggerField,{initComponent:function(){Ext.form.TwinTriggerField.superclass.initComponent.call(this);this.triggerConfig={tag:"span",cls:"x-form-twin-triggers",cn:[{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.trigger1Class},{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.trigger2Class}]}},getTrigger:function(a){return this.triggers[a]},afterRender:function(){Ext.form.TwinTriggerField.superclass.afterRender.call(this);var c=this.triggers,b=0,a=c.length;for(;b<a;++b){if(this["hideTrigger"+(b+1)]){c[b].hide()}}},initTrigger:function(){var a=this.trigger.select(".x-form-trigger",true),b=this;a.each(function(d,g,c){var e="Trigger"+(c+1);d.hide=function(){var h=b.wrap.getWidth();this.dom.style.display="none";b.el.setWidth(h-b.trigger.getWidth());b["hidden"+e]=true};d.show=function(){var h=b.wrap.getWidth();this.dom.style.display="";b.el.setWidth(h-b.trigger.getWidth());b["hidden"+e]=false};this.mon(d,"click",this["on"+e+"Click"],this,{preventDefault:true});d.addClassOnOver("x-form-trigger-over");d.addClassOnClick("x-form-trigger-click")},this);this.triggers=a.elements},getTriggerWidth:function(){var a=0;Ext.each(this.triggers,function(d,c){var e="Trigger"+(c+1),b=d.getWidth();if(b===0&&!this["hidden"+e]){a+=this.defaultTriggerWidth}else{a+=b}},this);return a},onDestroy:function(){Ext.destroy(this.triggers);Ext.form.TwinTriggerField.superclass.onDestroy.call(this)},onTrigger1Click:Ext.emptyFn,onTrigger2Click:Ext.emptyFn});Ext.reg("trigger",Ext.form.TriggerField);Ext.form.TextArea=Ext.extend(Ext.form.TextField,{growMin:60,growMax:1000,growAppend:"&#160;\n&#160;",enterIsSpecial:false,preventScrollbars:false,onRender:function(b,a){if(!this.el){this.defaultAutoCreate={tag:"textarea",style:"width:100px;height:60px;",autocomplete:"off"}}Ext.form.TextArea.superclass.onRender.call(this,b,a);if(this.grow){this.textSizeEl=Ext.DomHelper.append(document.body,{tag:"pre",cls:"x-form-grow-sizer"});if(this.preventScrollbars){this.el.setStyle("overflow","hidden")}this.el.setHeight(this.growMin)}},onDestroy:function(){Ext.removeNode(this.textSizeEl);Ext.form.TextArea.superclass.onDestroy.call(this)},fireKey:function(a){if(a.isSpecialKey()&&(this.enterIsSpecial||(a.getKey()!=a.ENTER||a.hasModifier()))){this.fireEvent("specialkey",this,a)}},doAutoSize:function(a){return !a.isNavKeyPress()||a.getKey()==a.ENTER},filterValidation:function(a){if(!a.isNavKeyPress()||(!this.enterIsSpecial&&a.keyCode==a.ENTER)){this.validationTask.delay(this.validationDelay)}},autoSize:function(){if(!this.grow||!this.textSizeEl){return}var c=this.el,a=Ext.util.Format.htmlEncode(c.dom.value),d=this.textSizeEl,b;Ext.fly(d).setWidth(this.el.getWidth());if(a.length<1){a="&#160;&#160;"}else{a+=this.growAppend;if(Ext.isIE){a=a.replace(/\n/g,"&#160;<br />")}}d.innerHTML=a;b=Math.min(this.growMax,Math.max(d.offsetHeight,this.growMin));if(b!=this.lastHeight){this.lastHeight=b;this.el.setHeight(b);this.fireEvent("autosize",this,b)}}});Ext.reg("textarea",Ext.form.TextArea);Ext.form.NumberField=Ext.extend(Ext.form.TextField,{fieldClass:"x-form-field x-form-num-field",allowDecimals:true,decimalSeparator:".",decimalPrecision:2,allowNegative:true,minValue:Number.NEGATIVE_INFINITY,maxValue:Number.MAX_VALUE,minText:"The minimum value for this field is {0}",maxText:"The maximum value for this field is {0}",nanText:"{0} is not a valid number",baseChars:"0123456789",autoStripChars:false,initEvents:function(){var a=this.baseChars+"";if(this.allowDecimals){a+=this.decimalSeparator}if(this.allowNegative){a+="-"}a=Ext.escapeRe(a);this.maskRe=new RegExp("["+a+"]");if(this.autoStripChars){this.stripCharsRe=new RegExp("[^"+a+"]","gi")}Ext.form.NumberField.superclass.initEvents.call(this)},getErrors:function(b){var c=Ext.form.NumberField.superclass.getErrors.apply(this,arguments);b=Ext.isDefined(b)?b:this.processValue(this.getRawValue());if(b.length<1){return c}b=String(b).replace(this.decimalSeparator,".");if(isNaN(b)){c.push(String.format(this.nanText,b))}var a=this.parseValue(b);if(a<this.minValue){c.push(String.format(this.minText,this.minValue))}if(a>this.maxValue){c.push(String.format(this.maxText,this.maxValue))}return c},getValue:function(){return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)))},setValue:function(a){a=Ext.isNumber(a)?a:parseFloat(String(a).replace(this.decimalSeparator,"."));a=this.fixPrecision(a);a=isNaN(a)?"":String(a).replace(".",this.decimalSeparator);return Ext.form.NumberField.superclass.setValue.call(this,a)},setMinValue:function(a){this.minValue=Ext.num(a,Number.NEGATIVE_INFINITY)},setMaxValue:function(a){this.maxValue=Ext.num(a,Number.MAX_VALUE)},parseValue:function(a){a=parseFloat(String(a).replace(this.decimalSeparator,"."));return isNaN(a)?"":a},fixPrecision:function(b){var a=isNaN(b);if(!this.allowDecimals||this.decimalPrecision==-1||a||!b){return a?"":b}return parseFloat(parseFloat(b).toFixed(this.decimalPrecision))},beforeBlur:function(){var a=this.parseValue(this.getRawValue());if(!Ext.isEmpty(a)){this.setValue(a)}}});Ext.reg("numberfield",Ext.form.NumberField);Ext.form.DateField=Ext.extend(Ext.form.TriggerField,{format:"m/d/Y",altFormats:"m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",disabledDaysText:"Disabled",disabledDatesText:"Disabled",minText:"The date in this field must be equal to or after {0}",maxText:"The date in this field must be equal to or before {0}",invalidText:"{0} is not a valid date - it must be in the format {1}",triggerClass:"x-form-date-trigger",showToday:true,startDay:0,defaultAutoCreate:{tag:"input",type:"text",size:"10",autocomplete:"off"},initTime:"12",initTimeFormat:"H",safeParse:function(b,c){if(Date.formatContainsHourInfo(c)){return Date.parseDate(b,c)}else{var a=Date.parseDate(b+" "+this.initTime,c+" "+this.initTimeFormat);if(a){return a.clearTime()}}},initComponent:function(){Ext.form.DateField.superclass.initComponent.call(this);this.addEvents("select");if(Ext.isString(this.minValue)){this.minValue=this.parseDate(this.minValue)}if(Ext.isString(this.maxValue)){this.maxValue=this.parseDate(this.maxValue)}this.disabledDatesRE=null;this.initDisabledDays()},initEvents:function(){Ext.form.DateField.superclass.initEvents.call(this);this.keyNav=new Ext.KeyNav(this.el,{down:function(a){this.onTriggerClick()},scope:this,forceKeyDown:true})},initDisabledDays:function(){if(this.disabledDates){var b=this.disabledDates,a=b.length-1,c="(?:";Ext.each(b,function(g,e){c+=Ext.isDate(g)?"^"+Ext.escapeRe(g.dateFormat(this.format))+"$":b[e];if(e!=a){c+="|"}},this);this.disabledDatesRE=new RegExp(c+")")}},setDisabledDates:function(a){this.disabledDates=a;this.initDisabledDays();if(this.menu){this.menu.picker.setDisabledDates(this.disabledDatesRE)}},setDisabledDays:function(a){this.disabledDays=a;if(this.menu){this.menu.picker.setDisabledDays(a)}},setMinValue:function(a){this.minValue=(Ext.isString(a)?this.parseDate(a):a);if(this.menu){this.menu.picker.setMinDate(this.minValue)}},setMaxValue:function(a){this.maxValue=(Ext.isString(a)?this.parseDate(a):a);if(this.menu){this.menu.picker.setMaxDate(this.maxValue)}},getErrors:function(e){var h=Ext.form.DateField.superclass.getErrors.apply(this,arguments);e=this.formatDate(e||this.processValue(this.getRawValue()));if(e.length<1){return h}var c=e;e=this.parseDate(e);if(!e){h.push(String.format(this.invalidText,c,this.format));return h}var g=e.getTime();if(this.minValue&&g<this.minValue.clearTime().getTime()){h.push(String.format(this.minText,this.formatDate(this.minValue)))}if(this.maxValue&&g>this.maxValue.clearTime().getTime()){h.push(String.format(this.maxText,this.formatDate(this.maxValue)))}if(this.disabledDays){var a=e.getDay();for(var b=0;b<this.disabledDays.length;b++){if(a===this.disabledDays[b]){h.push(this.disabledDaysText);break}}}var d=this.formatDate(e);if(this.disabledDatesRE&&this.disabledDatesRE.test(d)){h.push(String.format(this.disabledDatesText,d))}return h},validateBlur:function(){return !this.menu||!this.menu.isVisible()},getValue:function(){return this.parseDate(Ext.form.DateField.superclass.getValue.call(this))||""},setValue:function(a){return Ext.form.DateField.superclass.setValue.call(this,this.formatDate(this.parseDate(a)))},parseDate:function(g){if(!g||Ext.isDate(g)){return g}var b=this.safeParse(g,this.format),c=this.altFormats,e=this.altFormatsArray;if(!b&&c){e=e||c.split("|");for(var d=0,a=e.length;d<a&&!b;d++){b=this.safeParse(g,e[d])}}return b},onDestroy:function(){Ext.destroy(this.menu,this.keyNav);Ext.form.DateField.superclass.onDestroy.call(this)},formatDate:function(a){return Ext.isDate(a)?a.dateFormat(this.format):a},onTriggerClick:function(){if(this.disabled){return}if(this.menu==null){this.menu=new Ext.menu.DateMenu({hideOnClick:false,focusOnSelect:false})}this.onFocus();Ext.apply(this.menu.picker,{minDate:this.minValue,maxDate:this.maxValue,disabledDatesRE:this.disabledDatesRE,disabledDatesText:this.disabledDatesText,disabledDays:this.disabledDays,disabledDaysText:this.disabledDaysText,format:this.format,showToday:this.showToday,startDay:this.startDay,minText:String.format(this.minText,this.formatDate(this.minValue)),maxText:String.format(this.maxText,this.formatDate(this.maxValue))});this.menu.picker.setValue(this.getValue()||new Date());this.menu.show(this.el,"tl-bl?");this.menuEvents("on")},menuEvents:function(a){this.menu[a]("select",this.onSelect,this);this.menu[a]("hide",this.onMenuHide,this);this.menu[a]("show",this.onFocus,this)},onSelect:function(a,b){this.setValue(b);this.fireEvent("select",this,b);this.menu.hide()},onMenuHide:function(){this.focus(false,60);this.menuEvents("un")},beforeBlur:function(){var a=this.parseDate(this.getRawValue());if(a){this.setValue(a)}}});Ext.reg("datefield",Ext.form.DateField);Ext.form.DisplayField=Ext.extend(Ext.form.Field,{validationEvent:false,validateOnBlur:false,defaultAutoCreate:{tag:"div"},fieldClass:"x-form-display-field",htmlEncode:false,initEvents:Ext.emptyFn,isValid:function(){return true},validate:function(){return true},getRawValue:function(){var a=this.rendered?this.el.dom.innerHTML:Ext.value(this.value,"");if(a===this.emptyText){a=""}if(this.htmlEncode){a=Ext.util.Format.htmlDecode(a)}return a},getValue:function(){return this.getRawValue()},getName:function(){return this.name},setRawValue:function(a){if(this.htmlEncode){a=Ext.util.Format.htmlEncode(a)}return this.rendered?(this.el.dom.innerHTML=(Ext.isEmpty(a)?"":a)):(this.value=a)},setValue:function(a){this.setRawValue(a);return this}});Ext.reg("displayfield",Ext.form.DisplayField);Ext.form.ComboBox=Ext.extend(Ext.form.TriggerField,{defaultAutoCreate:{tag:"input",type:"text",size:"24",autocomplete:"off"},listClass:"",selectedClass:"x-combo-selected",listEmptyText:"",triggerClass:"x-form-arrow-trigger",shadow:"sides",listAlign:"tl-bl?",maxHeight:300,minHeight:90,triggerAction:"query",minChars:4,autoSelect:true,typeAhead:false,queryDelay:500,pageSize:0,selectOnFocus:false,queryParam:"query",loadingText:"Loading...",resizable:false,handleHeight:8,allQuery:"",mode:"remote",minListWidth:70,forceSelection:false,typeAheadDelay:250,lazyInit:true,clearFilterOnReset:true,submitValue:undefined,initComponent:function(){Ext.form.ComboBox.superclass.initComponent.call(this);this.addEvents("expand","collapse","beforeselect","select","beforequery");if(this.transform){var c=Ext.getDom(this.transform);if(!this.hiddenName){this.hiddenName=c.name}if(!this.store){this.mode="local";var j=[],e=c.options;for(var b=0,a=e.length;b<a;b++){var h=e[b],g=(h.hasAttribute?h.hasAttribute("value"):h.getAttributeNode("value").specified)?h.value:h.text;if(h.selected&&Ext.isEmpty(this.value,true)){this.value=g}j.push([g,h.text])}this.store=new Ext.data.ArrayStore({idIndex:0,fields:["value","text"],data:j,autoDestroy:true});this.valueField="value";this.displayField="text"}c.name=Ext.id();if(!this.lazyRender){this.target=true;this.el=Ext.DomHelper.insertBefore(c,this.autoCreate||this.defaultAutoCreate);this.render(this.el.parentNode,c)}Ext.removeNode(c)}else{if(this.store){this.store=Ext.StoreMgr.lookup(this.store);if(this.store.autoCreated){this.displayField=this.valueField="field1";if(!this.store.expandData){this.displayField="field2"}this.mode="local"}}}this.selectedIndex=-1;if(this.mode=="local"){if(!Ext.isDefined(this.initialConfig.queryDelay)){this.queryDelay=10}if(!Ext.isDefined(this.initialConfig.minChars)){this.minChars=0}}},onRender:function(b,a){if(this.hiddenName&&!Ext.isDefined(this.submitValue)){this.submitValue=false}Ext.form.ComboBox.superclass.onRender.call(this,b,a);if(this.hiddenName){this.hiddenField=this.el.insertSibling({tag:"input",type:"hidden",name:this.hiddenName,id:(this.hiddenId||Ext.id())},"before",true)}if(Ext.isGecko){this.el.dom.setAttribute("autocomplete","off")}if(!this.lazyInit){this.initList()}else{this.on("focus",this.initList,this,{single:true})}},initValue:function(){Ext.form.ComboBox.superclass.initValue.call(this);if(this.hiddenField){this.hiddenField.value=Ext.value(Ext.isDefined(this.hiddenValue)?this.hiddenValue:this.value,"")}},getParentZIndex:function(){var a;if(this.ownerCt){this.findParentBy(function(b){a=parseInt(b.getPositionEl().getStyle("z-index"),10);return !!a})}return a},getZIndex:function(b){b=b||Ext.getDom(this.getListParent()||Ext.getBody());var a=parseInt(Ext.fly(b).getStyle("z-index"),10);if(!a){a=this.getParentZIndex()}return(a||12000)+5},initList:function(){if(!this.list){var a="x-combo-list",c=Ext.getDom(this.getListParent()||Ext.getBody());this.list=new Ext.Layer({parentEl:c,shadow:this.shadow,cls:[a,this.listClass].join(" "),constrain:false,zindex:this.getZIndex(c)});var b=this.listWidth||Math.max(this.wrap.getWidth(),this.minListWidth);this.list.setSize(b,0);this.list.swallowEvent("mousewheel");this.assetHeight=0;if(this.syncFont!==false){this.list.setStyle("font-size",this.el.getStyle("font-size"))}if(this.title){this.header=this.list.createChild({cls:a+"-hd",html:this.title});this.assetHeight+=this.header.getHeight()}this.innerList=this.list.createChild({cls:a+"-inner"});this.mon(this.innerList,"mouseover",this.onViewOver,this);this.mon(this.innerList,"mousemove",this.onViewMove,this);this.innerList.setWidth(b-this.list.getFrameWidth("lr"));if(this.pageSize){this.footer=this.list.createChild({cls:a+"-ft"});this.pageTb=new Ext.PagingToolbar({store:this.store,pageSize:this.pageSize,renderTo:this.footer});this.assetHeight+=this.footer.getHeight()}if(!this.tpl){this.tpl='<tpl for="."><div class="'+a+'-item">{'+this.displayField+"}</div></tpl>"}this.view=new Ext.DataView({applyTo:this.innerList,tpl:this.tpl,singleSelect:true,selectedClass:this.selectedClass,itemSelector:this.itemSelector||"."+a+"-item",emptyText:this.listEmptyText,deferEmptyText:false});this.mon(this.view,{containerclick:this.onViewClick,click:this.onViewClick,scope:this});this.bindStore(this.store,true);if(this.resizable){this.resizer=new Ext.Resizable(this.list,{pinned:true,handles:"se"});this.mon(this.resizer,"resize",function(g,d,e){this.maxHeight=e-this.handleHeight-this.list.getFrameWidth("tb")-this.assetHeight;this.listWidth=d;this.innerList.setWidth(d-this.list.getFrameWidth("lr"));this.restrictHeight()},this);this[this.pageSize?"footer":"innerList"].setStyle("margin-bottom",this.handleHeight+"px")}}},getListParent:function(){return document.body},getStore:function(){return this.store},bindStore:function(a,b){if(this.store&&!b){if(this.store!==a&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.collapse,this)}if(!a){this.store=null;if(this.view){this.view.bindStore(null)}if(this.pageTb){this.pageTb.bindStore(null)}}}if(a){if(!b){this.lastQuery=null;if(this.pageTb){this.pageTb.bindStore(a)}}this.store=Ext.StoreMgr.lookup(a);this.store.on({scope:this,beforeload:this.onBeforeLoad,load:this.onLoad,exception:this.collapse});if(this.view){this.view.bindStore(a)}}},reset:function(){if(this.clearFilterOnReset&&this.mode=="local"){this.store.clearFilter()}Ext.form.ComboBox.superclass.reset.call(this)},initEvents:function(){Ext.form.ComboBox.superclass.initEvents.call(this);this.keyNav=new Ext.KeyNav(this.el,{up:function(a){this.inKeyMode=true;this.selectPrev()},down:function(a){if(!this.isExpanded()){this.onTriggerClick()}else{this.inKeyMode=true;this.selectNext()}},enter:function(a){this.onViewClick()},esc:function(a){this.collapse()},tab:function(a){if(this.forceSelection===true){this.collapse()}else{this.onViewClick(false)}return true},scope:this,doRelay:function(c,b,a){if(a=="down"||this.scope.isExpanded()){var d=Ext.KeyNav.prototype.doRelay.apply(this,arguments);if(!Ext.isIE&&Ext.EventManager.useKeydown){this.scope.fireKey(c)}return d}return true},forceKeyDown:true,defaultEventAction:"stopEvent"});this.queryDelay=Math.max(this.queryDelay||10,this.mode=="local"?10:250);this.dqTask=new Ext.util.DelayedTask(this.initQuery,this);if(this.typeAhead){this.taTask=new Ext.util.DelayedTask(this.onTypeAhead,this)}if(!this.enableKeyEvents){this.mon(this.el,"keyup",this.onKeyUp,this)}},onDestroy:function(){if(this.dqTask){this.dqTask.cancel();this.dqTask=null}this.bindStore(null);Ext.destroy(this.resizer,this.view,this.pageTb,this.list);Ext.destroyMembers(this,"hiddenField");Ext.form.ComboBox.superclass.onDestroy.call(this)},fireKey:function(a){if(!this.isExpanded()){Ext.form.ComboBox.superclass.fireKey.call(this,a)}},onResize:function(a,b){Ext.form.ComboBox.superclass.onResize.apply(this,arguments);if(!isNaN(a)&&this.isVisible()&&this.list){this.doResize(a)}else{this.bufferSize=a}},doResize:function(a){if(!Ext.isDefined(this.listWidth)){var b=Math.max(a,this.minListWidth);this.list.setWidth(b);this.innerList.setWidth(b-this.list.getFrameWidth("lr"))}},onEnable:function(){Ext.form.ComboBox.superclass.onEnable.apply(this,arguments);if(this.hiddenField){this.hiddenField.disabled=false}},onDisable:function(){Ext.form.ComboBox.superclass.onDisable.apply(this,arguments);if(this.hiddenField){this.hiddenField.disabled=true}},onBeforeLoad:function(){if(!this.hasFocus){return}this.innerList.update(this.loadingText?'<div class="loading-indicator">'+this.loadingText+"</div>":"");this.restrictHeight();this.selectedIndex=-1},onLoad:function(){if(!this.hasFocus){return}if(this.store.getCount()>0||this.listEmptyText){this.expand();this.restrictHeight();if(this.lastQuery==this.allQuery){if(this.editable){this.el.dom.select()}if(this.autoSelect!==false&&!this.selectByValue(this.value,true)){this.select(0,true)}}else{if(this.autoSelect!==false){this.selectNext()}if(this.typeAhead&&this.lastKey!=Ext.EventObject.BACKSPACE&&this.lastKey!=Ext.EventObject.DELETE){this.taTask.delay(this.typeAheadDelay)}}}else{this.collapse()}},onTypeAhead:function(){if(this.store.getCount()>0){var b=this.store.getAt(0);var c=b.data[this.displayField];var a=c.length;var d=this.getRawValue().length;if(d!=a){this.setRawValue(c);this.selectText(d,c.length)}}},assertValue:function(){var b=this.getRawValue(),a;if(this.valueField&&Ext.isDefined(this.value)){a=this.findRecord(this.valueField,this.value)}if(!a||a.get(this.displayField)!=b){a=this.findRecord(this.displayField,b)}if(!a&&this.forceSelection){if(b.length>0&&b!=this.emptyText){this.el.dom.value=Ext.value(this.lastSelectionText,"");this.applyEmptyText()}else{this.clearValue()}}else{if(a&&this.valueField){if(this.value==b){return}b=a.get(this.valueField||this.displayField)}this.setValue(b)}},onSelect:function(a,b){if(this.fireEvent("beforeselect",this,a,b)!==false){this.setValue(a.data[this.valueField||this.displayField]);this.collapse();this.fireEvent("select",this,a,b)}},getName:function(){var a=this.hiddenField;return a&&a.name?a.name:this.hiddenName||Ext.form.ComboBox.superclass.getName.call(this)},getValue:function(){if(this.valueField){return Ext.isDefined(this.value)?this.value:""}else{return Ext.form.ComboBox.superclass.getValue.call(this)}},clearValue:function(){if(this.hiddenField){this.hiddenField.value=""}this.setRawValue("");this.lastSelectionText="";this.applyEmptyText();this.value=""},setValue:function(a){var c=a;if(this.valueField){var b=this.findRecord(this.valueField,a);if(b){c=b.data[this.displayField]}else{if(Ext.isDefined(this.valueNotFoundText)){c=this.valueNotFoundText}}}this.lastSelectionText=c;if(this.hiddenField){this.hiddenField.value=Ext.value(a,"")}Ext.form.ComboBox.superclass.setValue.call(this,c);this.value=a;return this},findRecord:function(c,b){var a;if(this.store.getCount()>0){this.store.each(function(d){if(d.data[c]==b){a=d;return false}})}return a},onViewMove:function(b,a){this.inKeyMode=false},onViewOver:function(d,b){if(this.inKeyMode){return}var c=this.view.findItemFromChild(b);if(c){var a=this.view.indexOf(c);this.select(a,false)}},onViewClick:function(b){var a=this.view.getSelectedIndexes()[0],c=this.store,d=c.getAt(a);if(d){this.onSelect(d,a)}else{this.collapse()}if(b!==false){this.el.focus()}},restrictHeight:function(){this.innerList.dom.style.height="";var b=this.innerList.dom,e=this.list.getFrameWidth("tb")+(this.resizable?this.handleHeight:0)+this.assetHeight,c=Math.max(b.clientHeight,b.offsetHeight,b.scrollHeight),a=this.getPosition()[1]-Ext.getBody().getScroll().top,g=Ext.lib.Dom.getViewHeight()-a-this.getSize().height,d=Math.max(a,g,this.minHeight||0)-this.list.shadowOffset-e-5;c=Math.min(c,d,this.maxHeight);this.innerList.setHeight(c);this.list.beginUpdate();this.list.setHeight(c+e);this.list.alignTo.apply(this.list,[this.el].concat(this.listAlign));this.list.endUpdate()},isExpanded:function(){return this.list&&this.list.isVisible()},selectByValue:function(a,c){if(!Ext.isEmpty(a,true)){var b=this.findRecord(this.valueField||this.displayField,a);if(b){this.select(this.store.indexOf(b),c);return true}}return false},select:function(a,c){this.selectedIndex=a;this.view.select(a);if(c!==false){var b=this.view.getNode(a);if(b){this.innerList.scrollChildIntoView(b,false)}}},selectNext:function(){var a=this.store.getCount();if(a>0){if(this.selectedIndex==-1){this.select(0)}else{if(this.selectedIndex<a-1){this.select(this.selectedIndex+1)}}}},selectPrev:function(){var a=this.store.getCount();if(a>0){if(this.selectedIndex==-1){this.select(0)}else{if(this.selectedIndex!==0){this.select(this.selectedIndex-1)}}}},onKeyUp:function(b){var a=b.getKey();if(this.editable!==false&&this.readOnly!==true&&(a==b.BACKSPACE||!b.isSpecialKey())){this.lastKey=a;this.dqTask.delay(this.queryDelay)}Ext.form.ComboBox.superclass.onKeyUp.call(this,b)},validateBlur:function(){return !this.list||!this.list.isVisible()},initQuery:function(){this.doQuery(this.getRawValue())},beforeBlur:function(){this.assertValue()},postBlur:function(){Ext.form.ComboBox.superclass.postBlur.call(this);this.collapse();this.inKeyMode=false},doQuery:function(c,b){c=Ext.isEmpty(c)?"":c;var a={query:c,forceAll:b,combo:this,cancel:false};if(this.fireEvent("beforequery",a)===false||a.cancel){return false}c=a.query;b=a.forceAll;if(b===true||(c.length>=this.minChars)){if(this.lastQuery!==c){this.lastQuery=c;if(this.mode=="local"){this.selectedIndex=-1;if(b){this.store.clearFilter()}else{this.store.filter(this.displayField,c)}this.onLoad()}else{this.store.baseParams[this.queryParam]=c;this.store.load({params:this.getParams(c)});this.expand()}}else{this.selectedIndex=-1;this.onLoad()}}},getParams:function(a){var b={},c=this.store.paramNames;if(this.pageSize){b[c.start]=0;b[c.limit]=this.pageSize}return b},collapse:function(){if(!this.isExpanded()){return}this.list.hide();Ext.getDoc().un("mousewheel",this.collapseIf,this);Ext.getDoc().un("mousedown",this.collapseIf,this);this.fireEvent("collapse",this)},collapseIf:function(a){if(!this.isDestroyed&&!a.within(this.wrap)&&!a.within(this.list)){this.collapse()}},expand:function(){if(this.isExpanded()||!this.hasFocus){return}if(this.title||this.pageSize){this.assetHeight=0;if(this.title){this.assetHeight+=this.header.getHeight()}if(this.pageSize){this.assetHeight+=this.footer.getHeight()}}if(this.bufferSize){this.doResize(this.bufferSize);delete this.bufferSize}this.list.alignTo.apply(this.list,[this.el].concat(this.listAlign));this.list.setZIndex(this.getZIndex());this.list.show();if(Ext.isGecko2){this.innerList.setOverflow("auto")}this.mon(Ext.getDoc(),{scope:this,mousewheel:this.collapseIf,mousedown:this.collapseIf});this.fireEvent("expand",this)},onTriggerClick:function(){if(this.readOnly||this.disabled){return}if(this.isExpanded()){this.collapse();this.el.focus()}else{this.onFocus({});if(this.triggerAction=="all"){this.doQuery(this.allQuery,true)}else{this.doQuery(this.getRawValue())}this.el.focus()}}});Ext.reg("combo",Ext.form.ComboBox);Ext.form.Checkbox=Ext.extend(Ext.form.Field,{focusClass:undefined,fieldClass:"x-form-field",checked:false,boxLabel:"&#160;",defaultAutoCreate:{tag:"input",type:"checkbox",autocomplete:"off"},actionMode:"wrap",initComponent:function(){Ext.form.Checkbox.superclass.initComponent.call(this);this.addEvents("check")},onResize:function(){Ext.form.Checkbox.superclass.onResize.apply(this,arguments);if(!this.boxLabel&&!this.fieldLabel){this.el.alignTo(this.wrap,"c-c")}},initEvents:function(){Ext.form.Checkbox.superclass.initEvents.call(this);this.mon(this.el,{scope:this,click:this.onClick,change:this.onClick})},markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,onRender:function(b,a){Ext.form.Checkbox.superclass.onRender.call(this,b,a);if(this.inputValue!==undefined){this.el.dom.value=this.inputValue}this.wrap=this.el.wrap({cls:"x-form-check-wrap"});if(this.boxLabel){this.wrap.createChild({tag:"label",htmlFor:this.el.id,cls:"x-form-cb-label",html:this.boxLabel})}if(this.checked){this.setValue(true)}else{this.checked=this.el.dom.checked}if(Ext.isIE&&!Ext.isStrict){this.wrap.repaint()}this.resizeEl=this.positionEl=this.wrap},onDestroy:function(){Ext.destroy(this.wrap);Ext.form.Checkbox.superclass.onDestroy.call(this)},initValue:function(){this.originalValue=this.getValue()},getValue:function(){if(this.rendered){return this.el.dom.checked}return this.checked},onClick:function(){if(this.el.dom.checked!=this.checked){this.setValue(this.el.dom.checked)}},setValue:function(a){var c=this.checked,b=this.inputValue;if(a===false){this.checked=false}else{this.checked=(a===true||a==="true"||a=="1"||(b?a==b:String(a).toLowerCase()=="on"))}if(this.rendered){this.el.dom.checked=this.checked;this.el.dom.defaultChecked=this.checked}if(c!=this.checked){this.fireEvent("check",this,this.checked);if(this.handler){this.handler.call(this.scope||this,this,this.checked)}}return this}});Ext.reg("checkbox",Ext.form.Checkbox);Ext.form.CheckboxGroup=Ext.extend(Ext.form.Field,{columns:"auto",vertical:false,allowBlank:true,blankText:"You must select at least one item in this group",defaultType:"checkbox",groupCls:"x-form-check-group",initComponent:function(){this.addEvents("change");this.on("change",this.validate,this);Ext.form.CheckboxGroup.superclass.initComponent.call(this)},onRender:function(j,g){if(!this.el){var p={autoEl:{id:this.id},cls:this.groupCls,layout:"column",renderTo:j,bufferResize:false};var a={xtype:"container",defaultType:this.defaultType,layout:"form",defaults:{hideLabel:true,anchor:"100%"}};if(this.items[0].items){Ext.apply(p,{layoutConfig:{columns:this.items.length},defaults:this.defaults,items:this.items});for(var e=0,m=this.items.length;e<m;e++){Ext.applyIf(this.items[e],a)}}else{var d,n=[];if(typeof this.columns=="string"){this.columns=this.items.length}if(!Ext.isArray(this.columns)){var k=[];for(var e=0;e<this.columns;e++){k.push((100/this.columns)*0.01)}this.columns=k}d=this.columns.length;for(var e=0;e<d;e++){var b=Ext.apply({items:[]},a);b[this.columns[e]<=1?"columnWidth":"width"]=this.columns[e];if(this.defaults){b.defaults=Ext.apply(b.defaults||{},this.defaults)}n.push(b)}if(this.vertical){var r=Math.ceil(this.items.length/d),o=0;for(var e=0,m=this.items.length;e<m;e++){if(e>0&&e%r==0){o++}if(this.items[e].fieldLabel){this.items[e].hideLabel=false}n[o].items.push(this.items[e])}}else{for(var e=0,m=this.items.length;e<m;e++){var q=e%d;if(this.items[e].fieldLabel){this.items[e].hideLabel=false}n[q].items.push(this.items[e])}}Ext.apply(p,{layoutConfig:{columns:d},items:n})}this.panel=new Ext.Container(p);this.panel.ownerCt=this;this.el=this.panel.getEl();if(this.forId&&this.itemCls){var c=this.el.up(this.itemCls).child("label",true);if(c){c.setAttribute("htmlFor",this.forId)}}var h=this.panel.findBy(function(i){return i.isFormField},this);this.items=new Ext.util.MixedCollection();this.items.addAll(h)}Ext.form.CheckboxGroup.superclass.onRender.call(this,j,g)},initValue:function(){if(this.value){this.setValue.apply(this,this.buffered?this.value:[this.value]);delete this.buffered;delete this.value}},afterRender:function(){Ext.form.CheckboxGroup.superclass.afterRender.call(this);this.eachItem(function(a){a.on("check",this.fireChecked,this);a.inGroup=true})},doLayout:function(){if(this.rendered){this.panel.forceLayout=this.ownerCt.forceLayout;this.panel.doLayout()}},fireChecked:function(){var a=[];this.eachItem(function(b){if(b.checked){a.push(b)}});this.fireEvent("change",this,a)},getErrors:function(){var b=Ext.form.CheckboxGroup.superclass.getErrors.apply(this,arguments);if(!this.allowBlank){var a=true;this.eachItem(function(c){if(c.checked){return(a=false)}});if(a){b.push(this.blankText)}}return b},isDirty:function(){if(this.disabled||!this.rendered){return false}var a=false;this.eachItem(function(b){if(b.isDirty()){a=true;return false}});return a},setReadOnly:function(a){if(this.rendered){this.eachItem(function(b){b.setReadOnly(a)})}this.readOnly=a},onDisable:function(){this.eachItem(function(a){a.disable()})},onEnable:function(){this.eachItem(function(a){a.enable()})},onResize:function(a,b){this.panel.setSize(a,b);this.panel.doLayout()},reset:function(){if(this.originalValue){this.eachItem(function(a){if(a.setValue){a.setValue(false);a.originalValue=a.getValue()}});this.resetOriginal=true;this.setValue(this.originalValue);delete this.resetOriginal}else{this.eachItem(function(a){if(a.reset){a.reset()}})}(function(){this.clearInvalid()}).defer(50,this)},setValue:function(){if(this.rendered){this.onSetValue.apply(this,arguments)}else{this.buffered=true;this.value=arguments}return this},onSetValue:function(d,c){if(arguments.length==1){if(Ext.isArray(d)){Ext.each(d,function(h,e){if(Ext.isObject(h)&&h.setValue){h.setValue(true);if(this.resetOriginal===true){h.originalValue=h.getValue()}}else{var g=this.items.itemAt(e);if(g){g.setValue(h)}}},this)}else{if(Ext.isObject(d)){for(var a in d){var b=this.getBox(a);if(b){b.setValue(d[a])}}}else{this.setValueForItem(d)}}}else{var b=this.getBox(d);if(b){b.setValue(c)}}},beforeDestroy:function(){Ext.destroy(this.panel);if(!this.rendered){Ext.destroy(this.items)}Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this)},setValueForItem:function(a){a=String(a).split(",");this.eachItem(function(b){if(a.indexOf(b.inputValue)>-1){b.setValue(true)}})},getBox:function(b){var a=null;this.eachItem(function(c){if(b==c||c.dataIndex==b||c.id==b||c.getName()==b){a=c;return false}});return a},getValue:function(){var a=[];this.eachItem(function(b){if(b.checked){a.push(b)}});return a},eachItem:function(b,a){if(this.items&&this.items.each){this.items.each(b,a||this)}},getRawValue:Ext.emptyFn,setRawValue:Ext.emptyFn});Ext.reg("checkboxgroup",Ext.form.CheckboxGroup);Ext.form.CompositeField=Ext.extend(Ext.form.Field,{defaultMargins:"0 5 0 0",skipLastItemMargin:true,isComposite:true,combineErrors:true,labelConnector:", ",initComponent:function(){var g=[],b=this.items,e;for(var d=0,c=b.length;d<c;d++){e=b[d];if(!Ext.isEmpty(e.ref)){e.ref="../"+e.ref}g.push(e.fieldLabel);Ext.applyIf(e,this.defaults);if(!(d==c-1&&this.skipLastItemMargin)){Ext.applyIf(e,{margins:this.defaultMargins})}}this.fieldLabel=this.fieldLabel||this.buildLabel(g);this.fieldErrors=new Ext.util.MixedCollection(true,function(h){return h.field});this.fieldErrors.on({scope:this,add:this.updateInvalidMark,remove:this.updateInvalidMark,replace:this.updateInvalidMark});Ext.form.CompositeField.superclass.initComponent.apply(this,arguments);this.innerCt=new Ext.Container({layout:"hbox",items:this.items,cls:"x-form-composite",defaultMargins:"0 3 0 0",ownerCt:this});this.innerCt.ownerCt=undefined;var a=this.innerCt.findBy(function(h){return h.isFormField},this);this.items=new Ext.util.MixedCollection();this.items.addAll(a)},onRender:function(c,a){if(!this.el){var d=this.innerCt;d.render(c);this.el=d.getEl();if(this.combineErrors){this.eachItem(function(e){Ext.apply(e,{markInvalid:this.onFieldMarkInvalid.createDelegate(this,[e],0),clearInvalid:this.onFieldClearInvalid.createDelegate(this,[e],0)})})}var b=this.el.parent().parent().child("label",true);if(b){b.setAttribute("for",this.items.items[0].id)}}Ext.form.CompositeField.superclass.onRender.apply(this,arguments)},onFieldMarkInvalid:function(d,c){var b=d.getName(),a={field:b,errorName:d.fieldLabel||b,error:c};this.fieldErrors.replace(b,a);if(!d.preventMark){d.el.addClass(d.invalidClass)}},onFieldClearInvalid:function(a){this.fieldErrors.removeKey(a.getName());a.el.removeClass(a.invalidClass)},updateInvalidMark:function(){var a=Ext.isIE6&&Ext.isStrict;if(this.fieldErrors.length==0){this.clearInvalid();if(a){this.clearInvalid.defer(50,this)}}else{var b=this.buildCombinedErrorMessage(this.fieldErrors.items);this.sortErrors();this.markInvalid(b);if(a){this.markInvalid(b)}}},validateValue:function(c,a){var b=true;this.eachItem(function(d){if(!d.isValid(a)){b=false}});return b},buildCombinedErrorMessage:function(e){var d=[],b;for(var c=0,a=e.length;c<a;c++){b=e[c];d.push(String.format("{0}: {1}",b.errorName,b.error))}return d.join("<br />")},sortErrors:function(){var a=this.items;this.fieldErrors.sort("ASC",function(g,d){var c=function(b){return function(i){return i.getName()==b}};var h=a.findIndexBy(c(g.field)),e=a.findIndexBy(c(d.field));return h<e?-1:1})},reset:function(){this.eachItem(function(a){a.reset()});(function(){this.clearInvalid()}).defer(50,this)},clearInvalidChildren:function(){this.eachItem(function(a){a.clearInvalid()})},buildLabel:function(a){return Ext.clean(a).join(this.labelConnector)},isDirty:function(){if(this.disabled||!this.rendered){return false}var a=false;this.eachItem(function(b){if(b.isDirty()){a=true;return false}});return a},eachItem:function(b,a){if(this.items&&this.items.each){this.items.each(b,a||this)}},onResize:function(e,c,a,d){var b=this.innerCt;if(this.rendered&&b.rendered){b.setSize(e,c)}Ext.form.CompositeField.superclass.onResize.apply(this,arguments)},doLayout:function(c,b){if(this.rendered){var a=this.innerCt;a.forceLayout=this.ownerCt.forceLayout;a.doLayout(c,b)}},beforeDestroy:function(){Ext.destroy(this.innerCt);Ext.form.CompositeField.superclass.beforeDestroy.call(this)},setReadOnly:function(a){if(a==undefined){a=true}a=!!a;if(this.rendered){this.eachItem(function(b){b.setReadOnly(a)})}this.readOnly=a},onShow:function(){Ext.form.CompositeField.superclass.onShow.call(this);this.doLayout()},onDisable:function(){this.eachItem(function(a){a.disable()})},onEnable:function(){this.eachItem(function(a){a.enable()})}});Ext.reg("compositefield",Ext.form.CompositeField);Ext.form.Radio=Ext.extend(Ext.form.Checkbox,{inputType:"radio",markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,getGroupValue:function(){var a=this.el.up("form")||Ext.getBody();var b=a.child('input[name="'+this.el.dom.name+'"]:checked',true);return b?b.value:null},setValue:function(b){var a,d,c;if(typeof b=="boolean"){Ext.form.Radio.superclass.setValue.call(this,b)}else{if(this.rendered){a=this.getCheckEl();c=a.child('input[name="'+this.el.dom.name+'"][value="'+b+'"]',true);if(c){Ext.getCmp(c.id).setValue(true)}}}if(this.rendered&&this.checked){a=a||this.getCheckEl();d=this.getCheckEl().select('input[name="'+this.el.dom.name+'"]');d.each(function(e){if(e.dom.id!=this.id){Ext.getCmp(e.dom.id).setValue(false)}},this)}return this},getCheckEl:function(){if(this.inGroup){return this.el.up(".x-form-radio-group")}return this.el.up("form")||Ext.getBody()}});Ext.reg("radio",Ext.form.Radio);Ext.form.RadioGroup=Ext.extend(Ext.form.CheckboxGroup,{allowBlank:true,blankText:"You must select one item in this group",defaultType:"radio",groupCls:"x-form-radio-group",getValue:function(){var a=null;this.eachItem(function(b){if(b.checked){a=b;return false}});return a},onSetValue:function(c,b){if(arguments.length>1){var a=this.getBox(c);if(a){a.setValue(b);if(a.checked){this.eachItem(function(d){if(d!==a){d.setValue(false)}})}}}else{this.setValueForItem(c)}},setValueForItem:function(a){a=String(a).split(",")[0];this.eachItem(function(b){b.setValue(a==b.inputValue)})},fireChecked:function(){if(!this.checkTask){this.checkTask=new Ext.util.DelayedTask(this.bufferChecked,this)}this.checkTask.delay(10)},bufferChecked:function(){var a=null;this.eachItem(function(b){if(b.checked){a=b;return false}});this.fireEvent("change",this,a)},onDestroy:function(){if(this.checkTask){this.checkTask.cancel();this.checkTask=null}Ext.form.RadioGroup.superclass.onDestroy.call(this)}});Ext.reg("radiogroup",Ext.form.RadioGroup);Ext.form.Hidden=Ext.extend(Ext.form.Field,{inputType:"hidden",shouldLayout:false,onRender:function(){Ext.form.Hidden.superclass.onRender.apply(this,arguments)},initEvents:function(){this.originalValue=this.getValue()},setSize:Ext.emptyFn,setWidth:Ext.emptyFn,setHeight:Ext.emptyFn,setPosition:Ext.emptyFn,setPagePosition:Ext.emptyFn,markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn});Ext.reg("hidden",Ext.form.Hidden);Ext.form.BasicForm=Ext.extend(Ext.util.Observable,{constructor:function(b,a){Ext.apply(this,a);if(Ext.isString(this.paramOrder)){this.paramOrder=this.paramOrder.split(/[\s,|]/)}this.items=new Ext.util.MixedCollection(false,function(c){return c.getItemId()});this.addEvents("beforeaction","actionfailed","actioncomplete");if(b){this.initEl(b)}Ext.form.BasicForm.superclass.constructor.call(this)},timeout:30,paramOrder:undefined,paramsAsHash:false,waitTitle:"Please Wait...",activeAction:null,trackResetOnLoad:false,initEl:function(a){this.el=Ext.get(a);this.id=this.el.id||Ext.id();if(!this.standardSubmit){this.el.on("submit",this.onSubmit,this)}this.el.addClass("x-form")},getEl:function(){return this.el},onSubmit:function(a){a.stopEvent()},destroy:function(a){if(a!==true){this.items.each(function(b){Ext.destroy(b)});Ext.destroy(this.el)}this.items.clear();this.purgeListeners()},isValid:function(){var a=true;this.items.each(function(b){if(!b.validate()){a=false}});return a},isDirty:function(){var a=false;this.items.each(function(b){if(b.isDirty()){a=true;return false}});return a},doAction:function(b,a){if(Ext.isString(b)){b=new Ext.form.Action.ACTION_TYPES[b](this,a)}if(this.fireEvent("beforeaction",this,b)!==false){this.beforeAction(b);b.run.defer(100,b)}return this},submit:function(b){b=b||{};if(this.standardSubmit){var a=b.clientValidation===false||this.isValid();if(a){var c=this.el.dom;if(this.url&&Ext.isEmpty(c.action)){c.action=this.url}c.submit()}return a}var d=String.format("{0}submit",this.api?"direct":"");this.doAction(d,b);return this},load:function(a){var b=String.format("{0}load",this.api?"direct":"");this.doAction(b,a);return this},updateRecord:function(b){b.beginEdit();var a=b.fields,d,c;a.each(function(e){d=this.findField(e.name);if(d){c=d.getValue();if(Ext.type(c)!==false&&c.getGroupValue){c=c.getGroupValue()}else{if(d.eachItem){c=[];d.eachItem(function(g){c.push(g.getValue())})}}b.set(e.name,c)}},this);b.endEdit();return this},loadRecord:function(a){this.setValues(a.data);return this},beforeAction:function(a){this.items.each(function(c){if(c.isFormField&&c.syncValue){c.syncValue()}});var b=a.options;if(b.waitMsg){if(this.waitMsgTarget===true){this.el.mask(b.waitMsg,"x-mask-loading")}else{if(this.waitMsgTarget){this.waitMsgTarget=Ext.get(this.waitMsgTarget);this.waitMsgTarget.mask(b.waitMsg,"x-mask-loading")}else{Ext.MessageBox.wait(b.waitMsg,b.waitTitle||this.waitTitle)}}}},afterAction:function(a,c){this.activeAction=null;var b=a.options;if(b.waitMsg){if(this.waitMsgTarget===true){this.el.unmask()}else{if(this.waitMsgTarget){this.waitMsgTarget.unmask()}else{Ext.MessageBox.updateProgress(1);Ext.MessageBox.hide()}}}if(c){if(b.reset){this.reset()}Ext.callback(b.success,b.scope,[this,a]);this.fireEvent("actioncomplete",this,a)}else{Ext.callback(b.failure,b.scope,[this,a]);this.fireEvent("actionfailed",this,a)}},findField:function(c){var b=this.items.get(c);if(!Ext.isObject(b)){var a=function(d){if(d.isFormField){if(d.dataIndex==c||d.id==c||d.getName()==c){b=d;return false}else{if(d.isComposite){return d.items.each(a)}else{if(d instanceof Ext.form.CheckboxGroup&&d.rendered){return d.eachItem(a)}}}}};this.items.each(a)}return b||null},markInvalid:function(h){if(Ext.isArray(h)){for(var c=0,a=h.length;c<a;c++){var b=h[c];var d=this.findField(b.id);if(d){d.markInvalid(b.msg)}}}else{var e,g;for(g in h){if(!Ext.isFunction(h[g])&&(e=this.findField(g))){e.markInvalid(h[g])}}}return this},setValues:function(c){if(Ext.isArray(c)){for(var d=0,a=c.length;d<a;d++){var b=c[d];var e=this.findField(b.id);if(e){e.setValue(b.value);if(this.trackResetOnLoad){e.originalValue=e.getValue()}}}}else{var g,h;for(h in c){if(!Ext.isFunction(c[h])&&(g=this.findField(h))){g.setValue(c[h]);if(this.trackResetOnLoad){g.originalValue=g.getValue()}}}}return this},getValues:function(b){var a=Ext.lib.Ajax.serializeForm(this.el.dom);if(b===true){return a}return Ext.urlDecode(a)},getFieldValues:function(a){var d={},e,b,c;this.items.each(function(g){if(!g.disabled&&(a!==true||g.isDirty())){e=g.getName();b=d[e];c=g.getValue();if(Ext.isDefined(b)){if(Ext.isArray(b)){d[e].push(c)}else{d[e]=[b,c]}}else{d[e]=c}}});return d},clearInvalid:function(){this.items.each(function(a){a.clearInvalid()});return this},reset:function(){this.items.each(function(a){a.reset()});return this},add:function(){this.items.addAll(Array.prototype.slice.call(arguments,0));return this},remove:function(a){this.items.remove(a);return this},cleanDestroyed:function(){this.items.filterBy(function(a){return !!a.isDestroyed}).each(this.remove,this)},render:function(){this.items.each(function(a){if(a.isFormField&&!a.rendered&&document.getElementById(a.id)){a.applyToMarkup(a.id)}});return this},applyToFields:function(a){this.items.each(function(b){Ext.apply(b,a)});return this},applyIfToFields:function(a){this.items.each(function(b){Ext.applyIf(b,a)});return this},callFieldMethod:function(b,a){a=a||[];this.items.each(function(c){if(Ext.isFunction(c[b])){c[b].apply(c,a)}});return this}});Ext.BasicForm=Ext.form.BasicForm;Ext.FormPanel=Ext.extend(Ext.Panel,{minButtonWidth:75,labelAlign:"left",monitorValid:false,monitorPoll:200,layout:"form",initComponent:function(){this.form=this.createForm();Ext.FormPanel.superclass.initComponent.call(this);this.bodyCfg={tag:"form",cls:this.baseCls+"-body",method:this.method||"POST",id:this.formId||Ext.id()};if(this.fileUpload){this.bodyCfg.enctype="multipart/form-data"}this.initItems();this.addEvents("clientvalidation");this.relayEvents(this.form,["beforeaction","actionfailed","actioncomplete"])},createForm:function(){var a=Ext.applyIf({listeners:{}},this.initialConfig);return new Ext.form.BasicForm(null,a)},initFields:function(){var c=this.form;var a=this;var b=function(d){if(a.isField(d)){c.add(d)}else{if(d.findBy&&d!=a){a.applySettings(d);if(d.items&&d.items.each){d.items.each(b,this)}}}};this.items.each(b,this)},applySettings:function(b){var a=b.ownerCt;Ext.applyIf(b,{labelAlign:a.labelAlign,labelWidth:a.labelWidth,itemCls:a.itemCls})},getLayoutTarget:function(){return this.form.el},getForm:function(){return this.form},onRender:function(b,a){this.initFields();Ext.FormPanel.superclass.onRender.call(this,b,a);this.form.initEl(this.body)},beforeDestroy:function(){this.stopMonitoring();this.form.destroy(true);Ext.FormPanel.superclass.beforeDestroy.call(this)},isField:function(a){return !!a.setValue&&!!a.getValue&&!!a.markInvalid&&!!a.clearInvalid},initEvents:function(){Ext.FormPanel.superclass.initEvents.call(this);this.on({scope:this,add:this.onAddEvent,remove:this.onRemoveEvent});if(this.monitorValid){this.startMonitoring()}},onAdd:function(a){Ext.FormPanel.superclass.onAdd.call(this,a);this.processAdd(a)},onAddEvent:function(a,b){if(a!==this){this.processAdd(b)}},processAdd:function(a){if(this.isField(a)){this.form.add(a)}else{if(a.findBy){this.applySettings(a);this.form.add.apply(this.form,a.findBy(this.isField))}}},onRemove:function(a){Ext.FormPanel.superclass.onRemove.call(this,a);this.processRemove(a)},onRemoveEvent:function(a,b){if(a!==this){this.processRemove(b)}},processRemove:function(a){if(!this.destroying){if(this.isField(a)){this.form.remove(a)}else{if(a.findBy){Ext.each(a.findBy(this.isField),this.form.remove,this.form);this.form.cleanDestroyed()}}}},startMonitoring:function(){if(!this.validTask){this.validTask=new Ext.util.TaskRunner();this.validTask.start({run:this.bindHandler,interval:this.monitorPoll||200,scope:this})}},stopMonitoring:function(){if(this.validTask){this.validTask.stopAll();this.validTask=null}},load:function(){this.form.load.apply(this.form,arguments)},onDisable:function(){Ext.FormPanel.superclass.onDisable.call(this);if(this.form){this.form.items.each(function(){this.disable()})}},onEnable:function(){Ext.FormPanel.superclass.onEnable.call(this);if(this.form){this.form.items.each(function(){this.enable()})}},bindHandler:function(){var e=true;this.form.items.each(function(g){if(!g.isValid(true)){e=false;return false}});if(this.fbar){var b=this.fbar.items.items;for(var d=0,a=b.length;d<a;d++){var c=b[d];if(c.formBind===true&&c.disabled===e){c.setDisabled(!e)}}}this.fireEvent("clientvalidation",this,e)}});Ext.reg("form",Ext.FormPanel);Ext.form.FormPanel=Ext.FormPanel;Ext.form.FieldSet=Ext.extend(Ext.Panel,{baseCls:"x-fieldset",layout:"form",animCollapse:false,onRender:function(b,a){if(!this.el){this.el=document.createElement("fieldset");this.el.id=this.id;if(this.title||this.header||this.checkboxToggle){this.el.appendChild(document.createElement("legend")).className=this.baseCls+"-header"}}Ext.form.FieldSet.superclass.onRender.call(this,b,a);if(this.checkboxToggle){var c=typeof this.checkboxToggle=="object"?this.checkboxToggle:{tag:"input",type:"checkbox",name:this.checkboxName||this.id+"-checkbox"};this.checkbox=this.header.insertFirst(c);this.checkbox.dom.checked=!this.collapsed;this.mon(this.checkbox,"click",this.onCheckClick,this)}},onCollapse:function(a,b){if(this.checkbox){this.checkbox.dom.checked=false}Ext.form.FieldSet.superclass.onCollapse.call(this,a,b)},onExpand:function(a,b){if(this.checkbox){this.checkbox.dom.checked=true}Ext.form.FieldSet.superclass.onExpand.call(this,a,b)},onCheckClick:function(){this[this.checkbox.dom.checked?"expand":"collapse"]()}});Ext.reg("fieldset",Ext.form.FieldSet);Ext.form.HtmlEditor=Ext.extend(Ext.form.Field,{enableFormat:true,enableFontSize:true,enableColors:true,enableAlignments:true,enableLists:true,enableSourceEdit:true,enableLinks:true,enableFont:true,createLinkText:"Please enter the URL for the link:",defaultLinkValue:"http://",fontFamilies:["Arial","Courier New","Tahoma","Times New Roman","Verdana"],defaultFont:"tahoma",defaultValue:(Ext.isOpera||Ext.isIE6)?"&#160;":"&#8203;",actionMode:"wrap",validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Ext.emptyFn,iframePad:3,hideMode:"offsets",defaultAutoCreate:{tag:"textarea",style:"width:500px;height:300px;",autocomplete:"off"},initComponent:function(){this.addEvents("initialize","activate","beforesync","beforepush","sync","push","editmodechange");Ext.form.HtmlEditor.superclass.initComponent.call(this)},createFontOptions:function(){var d=[],b=this.fontFamilies,c,g;for(var e=0,a=b.length;e<a;e++){c=b[e];g=c.toLowerCase();d.push('<option value="',g,'" style="font-family:',c,';"',(this.defaultFont==g?' selected="true">':">"),c,"</option>")}return d.join("")},createToolbar:function(e){var c=[];var a=Ext.QuickTips&&Ext.QuickTips.isEnabled();function d(j,h,i){return{itemId:j,cls:"x-btn-icon",iconCls:"x-edit-"+j,enableToggle:h!==false,scope:e,handler:i||e.relayBtnCmd,clickEvent:"mousedown",tooltip:a?e.buttonTips[j]||undefined:undefined,overflowText:e.buttonTips[j].title||undefined,tabIndex:-1}}if(this.enableFont&&!Ext.isSafari2){var g=new Ext.Toolbar.Item({autoEl:{tag:"select",cls:"x-font-select",html:this.createFontOptions()}});c.push(g,"-")}if(this.enableFormat){c.push(d("bold"),d("italic"),d("underline"))}if(this.enableFontSize){c.push("-",d("increasefontsize",false,this.adjustFont),d("decreasefontsize",false,this.adjustFont))}if(this.enableColors){c.push("-",{itemId:"forecolor",cls:"x-btn-icon",iconCls:"x-edit-forecolor",clickEvent:"mousedown",tooltip:a?e.buttonTips.forecolor||undefined:undefined,tabIndex:-1,menu:new Ext.menu.ColorMenu({allowReselect:true,focus:Ext.emptyFn,value:"000000",plain:true,listeners:{scope:this,select:function(i,h){this.execCmd("forecolor",Ext.isWebKit||Ext.isIE?"#"+h:h);this.deferFocus()}},clickEvent:"mousedown"})},{itemId:"backcolor",cls:"x-btn-icon",iconCls:"x-edit-backcolor",clickEvent:"mousedown",tooltip:a?e.buttonTips.backcolor||undefined:undefined,tabIndex:-1,menu:new Ext.menu.ColorMenu({focus:Ext.emptyFn,value:"FFFFFF",plain:true,allowReselect:true,listeners:{scope:this,select:function(i,h){if(Ext.isGecko){this.execCmd("useCSS",false);this.execCmd("hilitecolor",h);this.execCmd("useCSS",true);this.deferFocus()}else{this.execCmd(Ext.isOpera?"hilitecolor":"backcolor",Ext.isWebKit||Ext.isIE?"#"+h:h);this.deferFocus()}}},clickEvent:"mousedown"})})}if(this.enableAlignments){c.push("-",d("justifyleft"),d("justifycenter"),d("justifyright"))}if(!Ext.isSafari2){if(this.enableLinks){c.push("-",d("createlink",false,this.createLink))}if(this.enableLists){c.push("-",d("insertorderedlist"),d("insertunorderedlist"))}if(this.enableSourceEdit){c.push("-",d("sourceedit",true,function(h){this.toggleSourceEdit(!this.sourceEditMode)}))}}var b=new Ext.Toolbar({renderTo:this.wrap.dom.firstChild,items:c});if(g){this.fontSelect=g.el;this.mon(this.fontSelect,"change",function(){var h=this.fontSelect.dom.value;this.relayCmd("fontname",h);this.deferFocus()},this)}this.mon(b.el,"click",function(h){h.preventDefault()});this.tb=b;this.tb.doLayout()},onDisable:function(){this.wrap.mask();Ext.form.HtmlEditor.superclass.onDisable.call(this)},onEnable:function(){this.wrap.unmask();Ext.form.HtmlEditor.superclass.onEnable.call(this)},setReadOnly:function(b){Ext.form.HtmlEditor.superclass.setReadOnly.call(this,b);if(this.initialized){if(Ext.isIE){this.getEditorBody().contentEditable=!b}else{this.setDesignMode(!b)}var a=this.getEditorBody();if(a){a.style.cursor=this.readOnly?"default":"text"}this.disableItems(b)}},getDocMarkup:function(){var a=Ext.fly(this.iframe).getHeight()-this.iframePad*2;return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>',this.iframePad,a)},getEditorBody:function(){var a=this.getDoc();return a.body||a.documentElement},getDoc:function(){return Ext.isIE?this.getWin().document:(this.iframe.contentDocument||this.getWin().document)},getWin:function(){return Ext.isIE?this.iframe.contentWindow:window.frames[this.iframe.name]},onRender:function(b,a){Ext.form.HtmlEditor.superclass.onRender.call(this,b,a);this.el.dom.style.border="0 none";this.el.dom.setAttribute("tabIndex",-1);this.el.addClass("x-hidden");if(Ext.isIE){this.el.applyStyles("margin-top:-1px;margin-bottom:-1px;")}this.wrap=this.el.wrap({cls:"x-html-editor-wrap",cn:{cls:"x-html-editor-tb"}});this.createToolbar(this);this.disableItems(true);this.tb.doLayout();this.createIFrame();if(!this.width){var c=this.el.getSize();this.setSize(c.width,this.height||c.height)}this.resizeEl=this.positionEl=this.wrap},createIFrame:function(){var a=document.createElement("iframe");a.name=Ext.id();a.frameBorder="0";a.style.overflow="auto";a.src=Ext.SSL_SECURE_URL;this.wrap.dom.appendChild(a);this.iframe=a;this.monitorTask=Ext.TaskMgr.start({run:this.checkDesignMode,scope:this,interval:100})},initFrame:function(){Ext.TaskMgr.stop(this.monitorTask);var b=this.getDoc();this.win=this.getWin();b.open();b.write(this.getDocMarkup());b.close();var a={run:function(){var c=this.getDoc();if(c.body||c.readyState=="complete"){Ext.TaskMgr.stop(a);this.setDesignMode(true);this.initEditor.defer(10,this)}},interval:10,duration:10000,scope:this};Ext.TaskMgr.start(a)},checkDesignMode:function(){if(this.wrap&&this.wrap.dom.offsetWidth){var a=this.getDoc();if(!a){return}if(!a.editorInitialized||this.getDesignMode()!="on"){this.initFrame()}}},setDesignMode:function(b){var a=this.getDoc();if(a){if(this.readOnly){b=false}a.designMode=(/on|true/i).test(String(b).toLowerCase())?"on":"off"}},getDesignMode:function(){var a=this.getDoc();if(!a){return""}return String(a.designMode).toLowerCase()},disableItems:function(a){if(this.fontSelect){this.fontSelect.dom.disabled=a}this.tb.items.each(function(b){if(b.getItemId()!="sourceedit"){b.setDisabled(a)}})},onResize:function(b,c){Ext.form.HtmlEditor.superclass.onResize.apply(this,arguments);if(this.el&&this.iframe){if(Ext.isNumber(b)){var e=b-this.wrap.getFrameWidth("lr");this.el.setWidth(e);this.tb.setWidth(e);this.iframe.style.width=Math.max(e,0)+"px"}if(Ext.isNumber(c)){var a=c-this.wrap.getFrameWidth("tb")-this.tb.el.getHeight();this.el.setHeight(a);this.iframe.style.height=Math.max(a,0)+"px";var d=this.getEditorBody();if(d){d.style.height=Math.max((a-(this.iframePad*2)),0)+"px"}}}},toggleSourceEdit:function(b){var d,a;if(b===undefined){b=!this.sourceEditMode}this.sourceEditMode=b===true;var c=this.tb.getComponent("sourceedit");if(c.pressed!==this.sourceEditMode){c.toggle(this.sourceEditMode);if(!c.xtbHidden){return}}if(this.sourceEditMode){this.previousSize=this.getSize();d=Ext.get(this.iframe).getHeight();this.disableItems(true);this.syncValue();this.iframe.className="x-hidden";this.el.removeClass("x-hidden");this.el.dom.removeAttribute("tabIndex");this.el.focus();this.el.dom.style.height=d+"px"}else{a=parseInt(this.el.dom.style.height,10);if(this.initialized){this.disableItems(this.readOnly)}this.pushValue();this.iframe.className="";this.el.addClass("x-hidden");this.el.dom.setAttribute("tabIndex",-1);this.deferFocus();this.setSize(this.previousSize);delete this.previousSize;this.iframe.style.height=a+"px"}this.fireEvent("editmodechange",this,this.sourceEditMode)},createLink:function(){var a=prompt(this.createLinkText,this.defaultLinkValue);if(a&&a!="http://"){this.relayCmd("createlink",a)}},initEvents:function(){this.originalValue=this.getValue()},markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,setValue:function(a){Ext.form.HtmlEditor.superclass.setValue.call(this,a);this.pushValue();return this},cleanHtml:function(a){a=String(a);if(Ext.isWebKit){a=a.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,"")}if(a.charCodeAt(0)==this.defaultValue.replace(/\D/g,"")){a=a.substring(1)}return a},syncValue:function(){if(this.initialized){var d=this.getEditorBody();var c=d.innerHTML;if(Ext.isWebKit){var b=d.getAttribute("style");var a=b.match(/text-align:(.*?);/i);if(a&&a[1]){c='<div style="'+a[0]+'">'+c+"</div>"}}c=this.cleanHtml(c);if(this.fireEvent("beforesync",this,c)!==false){this.el.dom.value=c;this.fireEvent("sync",this,c)}}},getValue:function(){this[this.sourceEditMode?"pushValue":"syncValue"]();return Ext.form.HtmlEditor.superclass.getValue.call(this)},pushValue:function(){if(this.initialized){var a=this.el.dom.value;if(!this.activated&&a.length<1){a=this.defaultValue}if(this.fireEvent("beforepush",this,a)!==false){this.getEditorBody().innerHTML=a;if(Ext.isGecko){this.setDesignMode(false);this.setDesignMode(true)}this.fireEvent("push",this,a)}}},deferFocus:function(){this.focus.defer(10,this)},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus()}else{this.el.focus()}},initEditor:function(){try{var c=this.getEditorBody(),a=this.el.getStyles("font-size","font-family","background-image","background-repeat","background-color","color"),g,b;a["background-attachment"]="fixed";c.bgProperties="fixed";Ext.DomHelper.applyStyles(c,a);g=this.getDoc();if(g){try{Ext.EventManager.removeAll(g)}catch(d){}}b=this.onEditorEvent.createDelegate(this);Ext.EventManager.on(g,{mousedown:b,dblclick:b,click:b,keyup:b,buffer:100});if(Ext.isGecko){Ext.EventManager.on(g,"keypress",this.applyCommand,this)}if(Ext.isIE||Ext.isWebKit||Ext.isOpera){Ext.EventManager.on(g,"keydown",this.fixKeys,this)}g.editorInitialized=true;this.initialized=true;this.pushValue();this.setReadOnly(this.readOnly);this.fireEvent("initialize",this)}catch(d){}},beforeDestroy:function(){if(this.monitorTask){Ext.TaskMgr.stop(this.monitorTask)}if(this.rendered){Ext.destroy(this.tb);var b=this.getDoc();if(b){try{Ext.EventManager.removeAll(b);for(var c in b){delete b[c]}}catch(a){}}if(this.wrap){this.wrap.dom.innerHTML="";this.wrap.remove()}}Ext.form.HtmlEditor.superclass.beforeDestroy.call(this)},onFirstFocus:function(){this.activated=true;this.disableItems(this.readOnly);if(Ext.isGecko){this.win.focus();var a=this.win.getSelection();if(!a.focusNode||a.focusNode.nodeType!=3){var b=a.getRangeAt(0);b.selectNodeContents(this.getEditorBody());b.collapse(true);this.deferFocus()}try{this.execCmd("useCSS",true);this.execCmd("styleWithCSS",false)}catch(c){}}this.fireEvent("activate",this)},adjustFont:function(b){var d=b.getItemId()=="increasefontsize"?1:-1,c=this.getDoc(),a=parseInt(c.queryCommandValue("FontSize")||2,10);if((Ext.isSafari&&!Ext.isSafari2)||Ext.isChrome||Ext.isAir){if(a<=10){a=1+d}else{if(a<=13){a=2+d}else{if(a<=16){a=3+d}else{if(a<=18){a=4+d}else{if(a<=24){a=5+d}else{a=6+d}}}}}a=a.constrain(1,6)}else{if(Ext.isSafari){d*=2}a=Math.max(1,a+d)+(Ext.isSafari?"px":0)}this.execCmd("FontSize",a)},onEditorEvent:function(a){this.updateToolbar()},updateToolbar:function(){if(this.readOnly){return}if(!this.activated){this.onFirstFocus();return}var b=this.tb.items.map,c=this.getDoc();if(this.enableFont&&!Ext.isSafari2){var a=(c.queryCommandValue("FontName")||this.defaultFont).toLowerCase();if(a!=this.fontSelect.dom.value){this.fontSelect.dom.value=a}}if(this.enableFormat){b.bold.toggle(c.queryCommandState("bold"));b.italic.toggle(c.queryCommandState("italic"));b.underline.toggle(c.queryCommandState("underline"))}if(this.enableAlignments){b.justifyleft.toggle(c.queryCommandState("justifyleft"));b.justifycenter.toggle(c.queryCommandState("justifycenter"));b.justifyright.toggle(c.queryCommandState("justifyright"))}if(!Ext.isSafari2&&this.enableLists){b.insertorderedlist.toggle(c.queryCommandState("insertorderedlist"));b.insertunorderedlist.toggle(c.queryCommandState("insertunorderedlist"))}Ext.menu.MenuMgr.hideAll();this.syncValue()},relayBtnCmd:function(a){this.relayCmd(a.getItemId())},relayCmd:function(b,a){(function(){this.focus();this.execCmd(b,a);this.updateToolbar()}).defer(10,this)},execCmd:function(b,a){var c=this.getDoc();c.execCommand(b,false,a===undefined?null:a);this.syncValue()},applyCommand:function(b){if(b.ctrlKey){var d=b.getCharCode(),a;if(d>0){d=String.fromCharCode(d);switch(d){case"b":a="bold";break;case"i":a="italic";break;case"u":a="underline";break}if(a){this.win.focus();this.execCmd(a);this.deferFocus();b.preventDefault()}}}},insertAtCursor:function(c){if(!this.activated){return}if(Ext.isIE){this.win.focus();var b=this.getDoc(),a=b.selection.createRange();if(a){a.pasteHTML(c);this.syncValue();this.deferFocus()}}else{this.win.focus();this.execCmd("InsertHTML",c);this.deferFocus()}},fixKeys:function(){if(Ext.isIE){return function(g){var a=g.getKey(),d=this.getDoc(),b;if(a==g.TAB){g.stopEvent();b=d.selection.createRange();if(b){b.collapse(true);b.pasteHTML("&nbsp;&nbsp;&nbsp;&nbsp;");this.deferFocus()}}else{if(a==g.ENTER){b=d.selection.createRange();if(b){var c=b.parentElement();if(!c||c.tagName.toLowerCase()!="li"){g.stopEvent();b.pasteHTML("<br />");b.collapse(false);b.select()}}}}}}else{if(Ext.isOpera){return function(b){var a=b.getKey();if(a==b.TAB){b.stopEvent();this.win.focus();this.execCmd("InsertHTML","&nbsp;&nbsp;&nbsp;&nbsp;");this.deferFocus()}}}else{if(Ext.isWebKit){return function(b){var a=b.getKey();if(a==b.TAB){b.stopEvent();this.execCmd("InsertText","\t");this.deferFocus()}else{if(a==b.ENTER){b.stopEvent();this.execCmd("InsertHtml","<br /><br />");this.deferFocus()}}}}}}}(),getToolbar:function(){return this.tb},buttonTips:{bold:{title:"Bold (Ctrl+B)",text:"Make the selected text bold.",cls:"x-html-editor-tip"},italic:{title:"Italic (Ctrl+I)",text:"Make the selected text italic.",cls:"x-html-editor-tip"},underline:{title:"Underline (Ctrl+U)",text:"Underline the selected text.",cls:"x-html-editor-tip"},increasefontsize:{title:"Grow Text",text:"Increase the font size.",cls:"x-html-editor-tip"},decreasefontsize:{title:"Shrink Text",text:"Decrease the font size.",cls:"x-html-editor-tip"},backcolor:{title:"Text Highlight Color",text:"Change the background color of the selected text.",cls:"x-html-editor-tip"},forecolor:{title:"Font Color",text:"Change the color of the selected text.",cls:"x-html-editor-tip"},justifyleft:{title:"Align Text Left",text:"Align text to the left.",cls:"x-html-editor-tip"},justifycenter:{title:"Center Text",text:"Center text in the editor.",cls:"x-html-editor-tip"},justifyright:{title:"Align Text Right",text:"Align text to the right.",cls:"x-html-editor-tip"},insertunorderedlist:{title:"Bullet List",text:"Start a bulleted list.",cls:"x-html-editor-tip"},insertorderedlist:{title:"Numbered List",text:"Start a numbered list.",cls:"x-html-editor-tip"},createlink:{title:"Hyperlink",text:"Make the selected text a hyperlink.",cls:"x-html-editor-tip"},sourceedit:{title:"Source Edit",text:"Switch to source editing mode.",cls:"x-html-editor-tip"}}});Ext.reg("htmleditor",Ext.form.HtmlEditor);Ext.form.TimeField=Ext.extend(Ext.form.ComboBox,{minValue:undefined,maxValue:undefined,minText:"The time in this field must be equal to or after {0}",maxText:"The time in this field must be equal to or before {0}",invalidText:"{0} is not a valid time",format:"g:i A",altFormats:"g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",increment:15,mode:"local",triggerAction:"all",typeAhead:false,initDate:"1/1/2008",initDateFormat:"j/n/Y",initComponent:function(){if(Ext.isDefined(this.minValue)){this.setMinValue(this.minValue,true)}if(Ext.isDefined(this.maxValue)){this.setMaxValue(this.maxValue,true)}if(!this.store){this.generateStore(true)}Ext.form.TimeField.superclass.initComponent.call(this)},setMinValue:function(b,a){this.setLimit(b,true,a);return this},setMaxValue:function(b,a){this.setLimit(b,false,a);return this},generateStore:function(b){var c=this.minValue||new Date(this.initDate).clearTime(),a=this.maxValue||new Date(this.initDate).clearTime().add("mi",(24*60)-1),d=[];while(c<=a){d.push(c.dateFormat(this.format));c=c.add("mi",this.increment)}this.bindStore(d,b)},setLimit:function(b,g,a){var e;if(Ext.isString(b)){e=this.parseDate(b)}else{if(Ext.isDate(b)){e=b}}if(e){var c=new Date(this.initDate).clearTime();c.setHours(e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds());this[g?"minValue":"maxValue"]=c;if(!a){this.generateStore()}}},getValue:function(){var a=Ext.form.TimeField.superclass.getValue.call(this);return this.formatDate(this.parseDate(a))||""},setValue:function(a){return Ext.form.TimeField.superclass.setValue.call(this,this.formatDate(this.parseDate(a)))},validateValue:Ext.form.DateField.prototype.validateValue,formatDate:Ext.form.DateField.prototype.formatDate,parseDate:function(h){if(!h||Ext.isDate(h)){return h}var j=this.initDate+" ",g=this.initDateFormat+" ",b=Date.parseDate(j+h,g+this.format),c=this.altFormats;if(!b&&c){if(!this.altFormatsArray){this.altFormatsArray=c.split("|")}for(var e=0,d=this.altFormatsArray,a=d.length;e<a&&!b;e++){b=Date.parseDate(j+h,g+d[e])}}return b}});Ext.reg("timefield",Ext.form.TimeField);Ext.form.SliderField=Ext.extend(Ext.form.Field,{useTips:true,tipText:null,actionMode:"wrap",initComponent:function(){var b=Ext.copyTo({id:this.id+"-slider"},this.initialConfig,["vertical","minValue","maxValue","decimalPrecision","keyIncrement","increment","clickToChange","animate"]);if(this.useTips){var a=this.tipText?{getText:this.tipText}:{};b.plugins=[new Ext.slider.Tip(a)]}this.slider=new Ext.Slider(b);Ext.form.SliderField.superclass.initComponent.call(this)},onRender:function(b,a){this.autoCreate={id:this.id,name:this.name,type:"hidden",tag:"input"};Ext.form.SliderField.superclass.onRender.call(this,b,a);this.wrap=this.el.wrap({cls:"x-form-field-wrap"});this.resizeEl=this.positionEl=this.wrap;this.slider.render(this.wrap)},onResize:function(b,c,d,a){Ext.form.SliderField.superclass.onResize.call(this,b,c,d,a);this.slider.setSize(b,c)},initEvents:function(){Ext.form.SliderField.superclass.initEvents.call(this);this.slider.on("change",this.onChange,this)},onChange:function(b,a){this.setValue(a,undefined,true)},onEnable:function(){Ext.form.SliderField.superclass.onEnable.call(this);this.slider.enable()},onDisable:function(){Ext.form.SliderField.superclass.onDisable.call(this);this.slider.disable()},beforeDestroy:function(){Ext.destroy(this.slider);Ext.form.SliderField.superclass.beforeDestroy.call(this)},alignErrorIcon:function(){this.errorIcon.alignTo(this.slider.el,"tl-tr",[2,0])},setMinValue:function(a){this.slider.setMinValue(a);return this},setMaxValue:function(a){this.slider.setMaxValue(a);return this},setValue:function(c,b,a){if(!a){this.slider.setValue(c,b)}return Ext.form.SliderField.superclass.setValue.call(this,this.slider.getValue())},getValue:function(){return this.slider.getValue()}});Ext.reg("sliderfield",Ext.form.SliderField);Ext.form.Label=Ext.extend(Ext.BoxComponent,{onRender:function(b,a){if(!this.el){this.el=document.createElement("label");this.el.id=this.getId();this.el.innerHTML=this.text?Ext.util.Format.htmlEncode(this.text):(this.html||"");if(this.forId){this.el.setAttribute("for",this.forId)}}Ext.form.Label.superclass.onRender.call(this,b,a)},setText:function(a,b){var c=b===false;this[!c?"text":"html"]=a;delete this[c?"text":"html"];if(this.rendered){this.el.dom.innerHTML=b!==false?Ext.util.Format.htmlEncode(a):a}return this}});Ext.reg("label",Ext.form.Label);Ext.form.Action=function(b,a){this.form=b;this.options=a||{}};Ext.form.Action.CLIENT_INVALID="client";Ext.form.Action.SERVER_INVALID="server";Ext.form.Action.CONNECT_FAILURE="connect";Ext.form.Action.LOAD_FAILURE="load";Ext.form.Action.prototype={type:"default",run:function(a){},success:function(a){},handleResponse:function(a){},failure:function(a){this.response=a;this.failureType=Ext.form.Action.CONNECT_FAILURE;this.form.afterAction(this,false)},processResponse:function(a){this.response=a;if(!a.responseText&&!a.responseXML){return true}this.result=this.handleResponse(a);return this.result},decodeResponse:function(a){try{return Ext.decode(a.responseText)}catch(b){return false}},getUrl:function(c){var a=this.options.url||this.form.url||this.form.el.dom.action;if(c){var b=this.getParams();if(b){a=Ext.urlAppend(a,b)}}return a},getMethod:function(){return(this.options.method||this.form.method||this.form.el.dom.method||"POST").toUpperCase()},getParams:function(){var a=this.form.baseParams;var b=this.options.params;if(b){if(typeof b=="object"){b=Ext.urlEncode(Ext.applyIf(b,a))}else{if(typeof b=="string"&&a){b+="&"+Ext.urlEncode(a)}}}else{if(a){b=Ext.urlEncode(a)}}return b},createCallback:function(a){var a=a||{};return{success:this.success,failure:this.failure,scope:this,timeout:(a.timeout*1000)||(this.form.timeout*1000),upload:this.form.fileUpload?this.success:undefined}}};Ext.form.Action.Submit=function(b,a){Ext.form.Action.Submit.superclass.constructor.call(this,b,a)};Ext.extend(Ext.form.Action.Submit,Ext.form.Action,{type:"submit",run:function(){var e=this.options,g=this.getMethod(),d=g=="GET";if(e.clientValidation===false||this.form.isValid()){if(e.submitEmptyText===false){var a=this.form.items,c=[],b=function(h){if(h.el.getValue()==h.emptyText){c.push(h);h.el.dom.value=""}if(h.isComposite&&h.rendered){h.items.each(b)}};a.each(b)}Ext.Ajax.request(Ext.apply(this.createCallback(e),{form:this.form.el.dom,url:this.getUrl(d),method:g,headers:e.headers,params:!d?this.getParams():null,isUpload:this.form.fileUpload}));if(e.submitEmptyText===false){Ext.each(c,function(h){if(h.applyEmptyText){h.applyEmptyText()}})}}else{if(e.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false)}}},success:function(b){var a=this.processResponse(b);if(a===true||a.success){this.form.afterAction(this,true);return}if(a.errors){this.form.markInvalid(a.errors)}this.failureType=Ext.form.Action.SERVER_INVALID;this.form.afterAction(this,false)},handleResponse:function(c){if(this.form.errorReader){var b=this.form.errorReader.read(c);var g=[];if(b.records){for(var d=0,a=b.records.length;d<a;d++){var e=b.records[d];g[d]=e.data}}if(g.length<1){g=null}return{success:b.success,errors:g}}return this.decodeResponse(c)}});Ext.form.Action.Load=function(b,a){Ext.form.Action.Load.superclass.constructor.call(this,b,a);this.reader=this.form.reader};Ext.extend(Ext.form.Action.Load,Ext.form.Action,{type:"load",run:function(){Ext.Ajax.request(Ext.apply(this.createCallback(this.options),{method:this.getMethod(),url:this.getUrl(false),headers:this.options.headers,params:this.getParams()}))},success:function(b){var a=this.processResponse(b);if(a===true||!a.success||!a.data){this.failureType=Ext.form.Action.LOAD_FAILURE;this.form.afterAction(this,false);return}this.form.clearInvalid();this.form.setValues(a.data);this.form.afterAction(this,true)},handleResponse:function(b){if(this.form.reader){var a=this.form.reader.read(b);var c=a.records&&a.records[0]?a.records[0].data:null;return{success:a.success,data:c}}return this.decodeResponse(b)}});Ext.form.Action.DirectLoad=Ext.extend(Ext.form.Action.Load,{constructor:function(b,a){Ext.form.Action.DirectLoad.superclass.constructor.call(this,b,a)},type:"directload",run:function(){var a=this.getParams();a.push(this.success,this);this.form.api.load.apply(window,a)},getParams:function(){var c=[],h={};var e=this.form.baseParams;var g=this.options.params;Ext.apply(h,g,e);var b=this.form.paramOrder;if(b){for(var d=0,a=b.length;d<a;d++){c.push(h[b[d]])}}else{if(this.form.paramsAsHash){c.push(h)}}return c},processResponse:function(a){this.result=a;return a},success:function(a,b){if(b.type==Ext.Direct.exceptions.SERVER){a={}}Ext.form.Action.DirectLoad.superclass.success.call(this,a)}});Ext.form.Action.DirectSubmit=Ext.extend(Ext.form.Action.Submit,{constructor:function(b,a){Ext.form.Action.DirectSubmit.superclass.constructor.call(this,b,a)},type:"directsubmit",run:function(){var a=this.options;if(a.clientValidation===false||this.form.isValid()){this.success.params=this.getParams();this.form.api.submit(this.form.el.dom,this.success,this)}else{if(a.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false)}}},getParams:function(){var c={};var a=this.form.baseParams;var b=this.options.params;Ext.apply(c,b,a);return c},processResponse:function(a){this.result=a;return a},success:function(a,b){if(b.type==Ext.Direct.exceptions.SERVER){a={}}Ext.form.Action.DirectSubmit.superclass.success.call(this,a)}});Ext.form.Action.ACTION_TYPES={load:Ext.form.Action.Load,submit:Ext.form.Action.Submit,directload:Ext.form.Action.DirectLoad,directsubmit:Ext.form.Action.DirectSubmit};Ext.form.VTypes=function(){var c=/^[a-zA-Z_]+$/,d=/^[a-zA-Z0-9_]+$/,b=/^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,a=/(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;return{email:function(e){return b.test(e)},emailText:'This field should be an e-mail address in the format "user@example.com"',emailMask:/[a-z0-9_\.\-\+\'@]/i,url:function(e){return a.test(e)},urlText:'This field should be a URL in the format "http://www.example.com"',alpha:function(e){return c.test(e)},alphaText:"This field should only contain letters and _",alphaMask:/[a-z_]/i,alphanum:function(e){return d.test(e)},alphanumText:"This field should only contain letters, numbers and _",alphanumMask:/[a-z0-9_]/i}}();Ext.grid.GridPanel=Ext.extend(Ext.Panel,{autoExpandColumn:false,autoExpandMax:1000,autoExpandMin:50,columnLines:false,ddText:"{0} selected row{1}",deferRowRender:true,enableColumnHide:true,enableColumnMove:true,enableDragDrop:false,enableHdMenu:true,loadMask:false,minColumnWidth:25,stripeRows:false,trackMouseOver:true,stateEvents:["columnmove","columnresize","sortchange","groupchange"],view:null,bubbleEvents:[],rendered:false,viewReady:false,initComponent:function(){Ext.grid.GridPanel.superclass.initComponent.call(this);if(this.columnLines){this.cls=(this.cls||"")+" x-grid-with-col-lines"}this.autoScroll=false;this.autoWidth=false;if(Ext.isArray(this.columns)){this.colModel=new Ext.grid.ColumnModel(this.columns);delete this.columns}if(this.ds){this.store=this.ds;delete this.ds}if(this.cm){this.colModel=this.cm;delete this.cm}if(this.sm){this.selModel=this.sm;delete this.sm}this.store=Ext.StoreMgr.lookup(this.store);this.addEvents("click","dblclick","contextmenu","mousedown","mouseup","mouseover","mouseout","keypress","keydown","cellmousedown","rowmousedown","headermousedown","groupmousedown","rowbodymousedown","containermousedown","cellclick","celldblclick","rowclick","rowdblclick","headerclick","headerdblclick","groupclick","groupdblclick","containerclick","containerdblclick","rowbodyclick","rowbodydblclick","rowcontextmenu","cellcontextmenu","headercontextmenu","groupcontextmenu","containercontextmenu","rowbodycontextmenu","bodyscroll","columnresize","columnmove","sortchange","groupchange","reconfigure","viewready")},onRender:function(d,a){Ext.grid.GridPanel.superclass.onRender.apply(this,arguments);var e=this.getGridEl();this.el.addClass("x-grid-panel");this.mon(e,{scope:this,mousedown:this.onMouseDown,click:this.onClick,dblclick:this.onDblClick,contextmenu:this.onContextMenu});this.relayEvents(e,["mousedown","mouseup","mouseover","mouseout","keypress","keydown"]);var b=this.getView();b.init(this);b.render();this.getSelectionModel().init(this)},initEvents:function(){Ext.grid.GridPanel.superclass.initEvents.call(this);if(this.loadMask){this.loadMask=new Ext.LoadMask(this.bwrap,Ext.apply({store:this.store},this.loadMask))}},initStateEvents:function(){Ext.grid.GridPanel.superclass.initStateEvents.call(this);this.mon(this.colModel,"hiddenchange",this.saveState,this,{delay:100})},applyState:function(a){var k=this.colModel,g=a.columns,j=this.store,m,h,l;if(g){for(var d=0,e=g.length;d<e;d++){m=g[d];h=k.getColumnById(m.id);if(h){l=k.getIndexById(m.id);k.setState(l,{hidden:m.hidden,width:m.width,sortable:m.sortable});if(l!=d){k.moveColumn(l,d)}}}}if(j){m=a.sort;if(m){j[j.remoteSort?"setDefaultSort":"sort"](m.field,m.direction)}m=a.group;if(j.groupBy){if(m){j.groupBy(m)}else{j.clearGrouping()}}}var b=Ext.apply({},a);delete b.columns;delete b.sort;Ext.grid.GridPanel.superclass.applyState.call(this,b)},getState:function(){var g={columns:[]},b=this.store,e,a;for(var d=0,h;(h=this.colModel.config[d]);d++){g.columns[d]={id:h.id,width:h.width};if(h.hidden){g.columns[d].hidden=true}if(h.sortable){g.columns[d].sortable=true}}if(b){e=b.getSortState();if(e){g.sort=e}if(b.getGroupState){a=b.getGroupState();if(a){g.group=a}}}return g},afterRender:function(){Ext.grid.GridPanel.superclass.afterRender.call(this);var a=this.view;this.on("bodyresize",a.layout,a);a.layout(true);if(this.deferRowRender){if(!this.deferRowRenderTask){this.deferRowRenderTask=new Ext.util.DelayedTask(a.afterRender,this.view)}this.deferRowRenderTask.delay(10)}else{a.afterRender()}this.viewReady=true},reconfigure:function(a,b){var c=this.rendered;if(c){if(this.loadMask){this.loadMask.destroy();this.loadMask=new Ext.LoadMask(this.bwrap,Ext.apply({},{store:a},this.initialConfig.loadMask))}}if(this.view){this.view.initData(a,b)}this.store=a;this.colModel=b;if(c){this.view.refresh(true)}this.fireEvent("reconfigure",this,a,b)},onDestroy:function(){if(this.deferRowRenderTask&&this.deferRowRenderTask.cancel){this.deferRowRenderTask.cancel()}if(this.rendered){Ext.destroy(this.view,this.loadMask)}else{if(this.store&&this.store.autoDestroy){this.store.destroy()}}Ext.destroy(this.colModel,this.selModel);this.store=this.selModel=this.colModel=this.view=this.loadMask=null;Ext.grid.GridPanel.superclass.onDestroy.call(this)},processEvent:function(a,b){this.view.processEvent(a,b)},onClick:function(a){this.processEvent("click",a)},onMouseDown:function(a){this.processEvent("mousedown",a)},onContextMenu:function(b,a){this.processEvent("contextmenu",b)},onDblClick:function(a){this.processEvent("dblclick",a)},walkCells:function(k,c,b,e,j){var i=this.colModel,g=i.getColumnCount(),a=this.store,h=a.getCount(),d=true;if(b<0){if(c<0){k--;d=false}while(k>=0){if(!d){c=g-1}d=false;while(c>=0){if(e.call(j||this,k,c,i)===true){return[k,c]}c--}k--}}else{if(c>=g){k++;d=false}while(k<h){if(!d){c=0}d=false;while(c<g){if(e.call(j||this,k,c,i)===true){return[k,c]}c++}k++}}return null},getGridEl:function(){return this.body},stopEditing:Ext.emptyFn,getSelectionModel:function(){if(!this.selModel){this.selModel=new Ext.grid.RowSelectionModel(this.disableSelection?{selectRow:Ext.emptyFn}:null)}return this.selModel},getStore:function(){return this.store},getColumnModel:function(){return this.colModel},getView:function(){if(!this.view){this.view=new Ext.grid.GridView(this.viewConfig)}return this.view},getDragDropText:function(){var a=this.selModel.getCount();return String.format(this.ddText,a,a==1?"":"s")}});Ext.reg("grid",Ext.grid.GridPanel);Ext.grid.PivotGrid=Ext.extend(Ext.grid.GridPanel,{aggregator:"sum",renderer:undefined,initComponent:function(){Ext.grid.PivotGrid.superclass.initComponent.apply(this,arguments);this.initAxes();this.enableColumnResize=false;this.viewConfig=Ext.apply(this.viewConfig||{},{forceFit:true});this.colModel=new Ext.grid.ColumnModel({})},getAggregator:function(){if(typeof this.aggregator=="string"){return Ext.grid.PivotAggregatorMgr.types[this.aggregator]}else{return this.aggregator}},setAggregator:function(a){this.aggregator=a},setMeasure:function(a){this.measure=a},setLeftAxis:function(b,a){this.leftAxis=b;if(a){this.view.refresh()}},setTopAxis:function(b,a){this.topAxis=b;if(a){this.view.refresh()}},initAxes:function(){var a=Ext.grid.PivotAxis;if(!(this.leftAxis instanceof a)){this.setLeftAxis(new a({orientation:"vertical",dimensions:this.leftAxis||[],store:this.store}))}if(!(this.topAxis instanceof a)){this.setTopAxis(new a({orientation:"horizontal",dimensions:this.topAxis||[],store:this.store}))}},extractData:function(){var c=this.store.data.items,s=c.length,q=[],h,g,e,d;if(s==0){return[]}var l=this.leftAxis.getTuples(),o=l.length,m=this.topAxis.getTuples(),a=m.length,b=this.getAggregator();for(g=0;g<s;g++){h=c[g];for(e=0;e<o;e++){q[e]=q[e]||[];if(l[e].matcher(h)===true){for(d=0;d<a;d++){q[e][d]=q[e][d]||[];if(m[d].matcher(h)){q[e][d].push(h)}}}}}var n=q.length,p,r;for(g=0;g<n;g++){r=q[g];p=r.length;for(e=0;e<p;e++){q[g][e]=b(q[g][e],this.measure)}}return q},getView:function(){if(!this.view){this.view=new Ext.grid.PivotGridView(this.viewConfig)}return this.view}});Ext.reg("pivotgrid",Ext.grid.PivotGrid);Ext.grid.PivotAggregatorMgr=new Ext.AbstractManager();Ext.grid.PivotAggregatorMgr.registerType("sum",function(a,c){var e=a.length,d=0,b;for(b=0;b<e;b++){d+=a[b].get(c)}return d});Ext.grid.PivotAggregatorMgr.registerType("avg",function(a,c){var e=a.length,d=0,b;for(b=0;b<e;b++){d+=a[b].get(c)}return(d/e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("min",function(a,c){var e=[],d=a.length,b;for(b=0;b<d;b++){e.push(a[b].get(c))}return Math.min.apply(this,e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("max",function(a,c){var e=[],d=a.length,b;for(b=0;b<d;b++){e.push(a[b].get(c))}return Math.max.apply(this,e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("count",function(a,b){return a.length});Ext.grid.GridView=Ext.extend(Ext.util.Observable,{deferEmptyText:true,scrollOffset:undefined,autoFill:false,forceFit:false,sortClasses:["sort-asc","sort-desc"],sortAscText:"Sort Ascending",sortDescText:"Sort Descending",columnsText:"Columns",selectedRowClass:"x-grid3-row-selected",borderWidth:2,tdClass:"x-grid3-cell",hdCls:"x-grid3-hd",markDirty:true,cellSelectorDepth:4,rowSelectorDepth:10,rowBodySelectorDepth:10,cellSelector:"td.x-grid3-cell",rowSelector:"div.x-grid3-row",rowBodySelector:"div.x-grid3-row-body",firstRowCls:"x-grid3-row-first",lastRowCls:"x-grid3-row-last",rowClsRe:/(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,headerMenuOpenCls:"x-grid3-hd-menu-open",rowOverCls:"x-grid3-row-over",constructor:function(a){Ext.apply(this,a);this.addEvents("beforerowremoved","beforerowsinserted","beforerefresh","rowremoved","rowsinserted","rowupdated","refresh");Ext.grid.GridView.superclass.constructor.call(this)},masterTpl:new Ext.Template('<div class="x-grid3" hidefocus="true">','<div class="x-grid3-viewport">','<div class="x-grid3-header">','<div class="x-grid3-header-inner">','<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',"</div>",'<div class="x-clear"></div>',"</div>",'<div class="x-grid3-scroller">','<div class="x-grid3-body" style="{bstyle}">{body}</div>','<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',"</div>","</div>",'<div class="x-grid3-resize-marker">&#160;</div>','<div class="x-grid3-resize-proxy">&#160;</div>',"</div>"),headerTpl:new Ext.Template('<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',"<thead>",'<tr class="x-grid3-hd-row">{cells}</tr>',"</thead>","</table>"),bodyTpl:new Ext.Template("{rows}"),cellTpl:new Ext.Template('<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>','<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',"</td>"),initTemplates:function(){var c=this.templates||{},d,b,g=new Ext.Template('<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">','<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">',this.grid.enableHdMenu?'<a class="x-grid3-hd-btn" href="#"></a>':"","{value}",'<img alt="" class="x-grid3-sort-icon" src="',Ext.BLANK_IMAGE_URL,'" />',"</div>","</td>"),a=['<tr class="x-grid3-row-body-tr" style="{bodyStyle}">','<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">','<div class="x-grid3-row-body">{body}</div>',"</td>","</tr>"].join(""),e=['<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',"<tbody>","<tr>{cells}</tr>",this.enableRowBody?a:"","</tbody>","</table>"].join("");Ext.applyIf(c,{hcell:g,cell:this.cellTpl,body:this.bodyTpl,header:this.headerTpl,master:this.masterTpl,row:new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">'+e+"</div>"),rowInner:new Ext.Template(e)});for(b in c){d=c[b];if(d&&Ext.isFunction(d.compile)&&!d.compiled){d.disableFormats=true;d.compile()}}this.templates=c;this.colRe=new RegExp("x-grid3-td-([^\\s]+)","")},fly:function(a){if(!this._flyweight){this._flyweight=new Ext.Element.Flyweight(document.body)}this._flyweight.dom=a;return this._flyweight},getEditorParent:function(){return this.scroller.dom},initElements:function(){var b=Ext.Element,d=Ext.get(this.grid.getGridEl().dom.firstChild),e=new b(d.child("div.x-grid3-viewport")),c=new b(e.child("div.x-grid3-header")),a=new b(e.child("div.x-grid3-scroller"));if(this.grid.hideHeaders){c.setDisplayed(false)}if(this.forceFit){a.setStyle("overflow-x","hidden")}Ext.apply(this,{el:d,mainWrap:e,scroller:a,mainHd:c,innerHd:c.child("div.x-grid3-header-inner").dom,mainBody:new b(b.fly(a).child("div.x-grid3-body")),focusEl:new b(b.fly(a).child("a")),resizeMarker:new b(d.child("div.x-grid3-resize-marker")),resizeProxy:new b(d.child("div.x-grid3-resize-proxy"))});this.focusEl.swallowEvent("click",true)},getRows:function(){return this.hasRows()?this.mainBody.dom.childNodes:[]},findCell:function(a){if(!a){return false}return this.fly(a).findParent(this.cellSelector,this.cellSelectorDepth)},findCellIndex:function(d,c){var b=this.findCell(d),a;if(b){a=this.fly(b).hasClass(c);if(!c||a){return this.getCellIndex(b)}}return false},getCellIndex:function(b){if(b){var a=b.className.match(this.colRe);if(a&&a[1]){return this.cm.getIndexById(a[1])}}return false},findHeaderCell:function(b){var a=this.findCell(b);return a&&this.fly(a).hasClass(this.hdCls)?a:null},findHeaderIndex:function(a){return this.findCellIndex(a,this.hdCls)},findRow:function(a){if(!a){return false}return this.fly(a).findParent(this.rowSelector,this.rowSelectorDepth)},findRowIndex:function(a){var b=this.findRow(a);return b?b.rowIndex:false},findRowBody:function(a){if(!a){return false}return this.fly(a).findParent(this.rowBodySelector,this.rowBodySelectorDepth)},getRow:function(a){return this.getRows()[a]},getCell:function(b,a){return Ext.fly(this.getRow(b)).query(this.cellSelector)[a]},getHeaderCell:function(a){return this.mainHd.dom.getElementsByTagName("td")[a]},addRowClass:function(b,a){var c=this.getRow(b);if(c){this.fly(c).addClass(a)}},removeRowClass:function(c,a){var b=this.getRow(c);if(b){this.fly(b).removeClass(a)}},removeRow:function(a){Ext.removeNode(this.getRow(a));this.syncFocusEl(a)},removeRows:function(c,a){var b=this.mainBody.dom,d;for(d=c;d<=a;d++){Ext.removeNode(b.childNodes[c])}this.syncFocusEl(c)},getScrollState:function(){var a=this.scroller.dom;return{left:a.scrollLeft,top:a.scrollTop}},restoreScroll:function(a){var b=this.scroller.dom;b.scrollLeft=a.left;b.scrollTop=a.top},scrollToTop:function(){var a=this.scroller.dom;a.scrollTop=0;a.scrollLeft=0},syncScroll:function(){this.syncHeaderScroll();var a=this.scroller.dom;this.grid.fireEvent("bodyscroll",a.scrollLeft,a.scrollTop)},syncHeaderScroll:function(){var a=this.innerHd,b=this.scroller.dom.scrollLeft;a.scrollLeft=b;a.scrollLeft=b},updateSortIcon:function(d,c){var a=this.sortClasses,b=a[c=="DESC"?1:0],e=this.mainHd.select("td").removeClass(a);e.item(d).addClass(b)},updateAllColumnWidths:function(){var e=this.getTotalWidth(),k=this.cm.getColumnCount(),m=this.getRows(),g=m.length,b=[],l,a,h,d,c;for(d=0;d<k;d++){b[d]=this.getColumnWidth(d);this.getHeaderCell(d).style.width=b[d]}this.updateHeaderWidth();for(d=0;d<g;d++){l=m[d];l.style.width=e;a=l.firstChild;if(a){a.style.width=e;h=a.rows[0];for(c=0;c<k;c++){h.childNodes[c].style.width=b[c]}}}this.onAllColumnWidthsUpdated(b,e)},updateColumnWidth:function(d,b){var c=this.getColumnWidth(d),j=this.getTotalWidth(),h=this.getHeaderCell(d),a=this.getRows(),e=a.length,l,g,k;this.updateHeaderWidth();h.style.width=c;for(g=0;g<e;g++){l=a[g];k=l.firstChild;l.style.width=j;if(k){k.style.width=j;k.rows[0].childNodes[d].style.width=c}}this.onColumnWidthUpdated(d,c,j)},updateColumnHidden:function(b,j){var h=this.getTotalWidth(),k=j?"none":"",g=this.getHeaderCell(b),a=this.getRows(),d=a.length,l,c,e;this.updateHeaderWidth();g.style.display=k;for(e=0;e<d;e++){l=a[e];l.style.width=h;c=l.firstChild;if(c){c.style.width=h;c.rows[0].childNodes[b].style.display=k}}this.onColumnHiddenUpdated(b,j,h);delete this.lastViewWidth;this.layout()},doRender:function(d,v,m,a,r,t){var h=this.templates,c=h.cell,y=h.row,o=r-1,b="width:"+this.getTotalWidth()+";",k=[],l=[],n={tstyle:b},q={},w=v.length,x,g,e,u,s,p;for(s=0;s<w;s++){e=v[s];l=[];p=s+a;for(u=0;u<r;u++){g=d[u];q.id=g.id;q.css=u===0?"x-grid3-cell-first ":(u==o?"x-grid3-cell-last ":"");q.attr=q.cellAttr="";q.style=g.style;q.value=g.renderer.call(g.scope,e.data[g.name],q,e,p,u,m);if(Ext.isEmpty(q.value)){q.value="&#160;"}if(this.markDirty&&e.dirty&&typeof e.modified[g.name]!="undefined"){q.css+=" x-grid3-dirty-cell"}l[l.length]=c.apply(q)}x=[];if(t&&((p+1)%2===0)){x[0]="x-grid3-row-alt"}if(e.dirty){x[1]=" x-grid3-dirty-row"}n.cols=r;if(this.getRowClass){x[2]=this.getRowClass(e,p,n,m)}n.alt=x.join(" ");n.cells=l.join("");k[k.length]=y.apply(n)}return k.join("")},processRows:function(a,g){if(!this.ds||this.ds.getCount()<1){return}var d=this.getRows(),c=d.length,e,b;g=g||!this.grid.stripeRows;a=a||0;for(b=0;b<c;b++){e=d[b];if(e){e.rowIndex=b;if(!g){e.className=e.className.replace(this.rowClsRe," ");if((b+1)%2===0){e.className+=" x-grid3-row-alt"}}}}if(a===0){Ext.fly(d[0]).addClass(this.firstRowCls)}Ext.fly(d[c-1]).addClass(this.lastRowCls)},afterRender:function(){if(!this.ds||!this.cm){return}this.mainBody.dom.innerHTML=this.renderBody()||"&#160;";this.processRows(0,true);if(this.deferEmptyText!==true){this.applyEmptyText()}this.grid.fireEvent("viewready",this.grid)},afterRenderUI:function(){var a=this.grid;this.initElements();Ext.fly(this.innerHd).on("click",this.handleHdDown,this);this.mainHd.on({scope:this,mouseover:this.handleHdOver,mouseout:this.handleHdOut,mousemove:this.handleHdMove});this.scroller.on("scroll",this.syncScroll,this);if(a.enableColumnResize!==false){this.splitZone=new Ext.grid.GridView.SplitDragZone(a,this.mainHd.dom)}if(a.enableColumnMove){this.columnDrag=new Ext.grid.GridView.ColumnDragZone(a,this.innerHd);this.columnDrop=new Ext.grid.HeaderDropZone(a,this.mainHd.dom)}if(a.enableHdMenu!==false){this.hmenu=new Ext.menu.Menu({id:a.id+"-hctx"});this.hmenu.add({itemId:"asc",text:this.sortAscText,cls:"xg-hmenu-sort-asc"},{itemId:"desc",text:this.sortDescText,cls:"xg-hmenu-sort-desc"});if(a.enableColumnHide!==false){this.colMenu=new Ext.menu.Menu({id:a.id+"-hcols-menu"});this.colMenu.on({scope:this,beforeshow:this.beforeColMenuShow,itemclick:this.handleHdMenuClick});this.hmenu.add("-",{itemId:"columns",hideOnClick:false,text:this.columnsText,menu:this.colMenu,iconCls:"x-cols-icon"})}this.hmenu.on("itemclick",this.handleHdMenuClick,this)}if(a.trackMouseOver){this.mainBody.on({scope:this,mouseover:this.onRowOver,mouseout:this.onRowOut})}if(a.enableDragDrop||a.enableDrag){this.dragZone=new Ext.grid.GridDragZone(a,{ddGroup:a.ddGroup||"GridDD"})}this.updateHeaderSortState()},renderUI:function(){var a=this.templates;return a.master.apply({body:a.body.apply({rows:"&#160;"}),header:this.renderHeaders(),ostyle:"width:"+this.getOffsetWidth()+";",bstyle:"width:"+this.getTotalWidth()+";"})},processEvent:function(b,h){var i=h.getTarget(),a=this.grid,d=this.findHeaderIndex(i),k,j,c,g;a.fireEvent(b,h);if(d!==false){a.fireEvent("header"+b,a,d,h)}else{k=this.findRowIndex(i);if(k!==false){j=this.findCellIndex(i);if(j!==false){c=a.colModel.getColumnAt(j);if(a.fireEvent("cell"+b,a,k,j,h)!==false){if(!c||(c.processEvent&&(c.processEvent(b,h,a,k,j)!==false))){a.fireEvent("row"+b,a,k,h)}}}else{if(a.fireEvent("row"+b,a,k,h)!==false){(g=this.findRowBody(i))&&a.fireEvent("rowbody"+b,a,k,h)}}}else{a.fireEvent("container"+b,a,h)}}},layout:function(j){if(!this.mainBody){return}var a=this.grid,d=a.getGridEl(),c=d.getSize(true),i=c.width,b=c.height,h=this.scroller,g,e,k;if(i<20||b<20){return}if(a.autoHeight){g=h.dom.style;g.overflow="visible";if(Ext.isWebKit){g.position="static"}}else{this.el.setSize(i,b);e=this.mainHd.getHeight();k=b-e;h.setSize(i,k);if(this.innerHd){this.innerHd.style.width=(i)+"px"}}if(this.forceFit||(j===true&&this.autoFill)){if(this.lastViewWidth!=i){this.fitColumns(false,false);this.lastViewWidth=i}}else{this.autoExpand();this.syncHeaderScroll()}this.onLayout(i,k)},onLayout:function(a,b){},onColumnWidthUpdated:function(c,a,b){},onAllColumnWidthsUpdated:function(a,b){},onColumnHiddenUpdated:function(b,c,a){},updateColumnText:function(a,b){},afterMove:function(a){},init:function(a){this.grid=a;this.initTemplates();this.initData(a.store,a.colModel);this.initUI(a)},getColumnId:function(a){return this.cm.getColumnId(a)},getOffsetWidth:function(){return(this.cm.getTotalWidth()+this.getScrollOffset())+"px"},getScrollOffset:function(){return Ext.num(this.scrollOffset,Ext.getScrollBarWidth())},renderHeaders:function(){var e=this.cm,g=this.templates,a=g.hcell,d={},h=e.getColumnCount(),j=h-1,k=[],c,b;for(c=0;c<h;c++){if(c==0){b="x-grid3-cell-first "}else{b=c==j?"x-grid3-cell-last ":""}d={id:e.getColumnId(c),value:e.getColumnHeader(c)||"",style:this.getColumnStyle(c,true),css:b,tooltip:this.getColumnTooltip(c)};if(e.config[c].align=="right"){d.istyle="padding-right: 16px;"}else{delete d.istyle}k[c]=a.apply(d)}return g.header.apply({cells:k.join(""),tstyle:String.format("width: {0};",this.getTotalWidth())})},getColumnTooltip:function(a){var b=this.cm.getColumnTooltip(a);if(b){if(Ext.QuickTips.isEnabled()){return'ext:qtip="'+b+'"'}else{return'title="'+b+'"'}}return""},beforeUpdate:function(){this.grid.stopEditing(true)},updateHeaders:function(){this.innerHd.firstChild.innerHTML=this.renderHeaders();this.updateHeaderWidth(false)},updateHeaderWidth:function(c){var b=this.innerHd.firstChild,a=this.getTotalWidth();b.style.width=this.getOffsetWidth();b.firstChild.style.width=a;if(c!==false){this.mainBody.dom.style.width=a}},focusRow:function(a){this.focusCell(a,0,false)},focusCell:function(d,b,c){this.syncFocusEl(this.ensureVisible(d,b,c));var a=this.focusEl;if(Ext.isGecko){a.focus()}else{a.focus.defer(1,a)}},resolveCell:function(h,d,g){if(!Ext.isNumber(h)){h=h.rowIndex}if(!this.ds){return null}if(h<0||h>=this.ds.getCount()){return null}d=(d!==undefined?d:0);var c=this.getRow(h),b=this.cm,e=b.getColumnCount(),a;if(!(g===false&&d===0)){while(d<e&&b.isHidden(d)){d++}a=this.getCell(h,d)}return{row:c,cell:a}},getResolvedXY:function(b){if(!b){return null}var a=b.cell,c=b.row;if(a){return Ext.fly(a).getXY()}else{return[this.el.getX(),Ext.fly(c).getY()]}},syncFocusEl:function(d,a,c){var b=d;if(!Ext.isArray(b)){d=Math.min(d,Math.max(0,this.getRows().length-1));if(isNaN(d)){return}b=this.getResolvedXY(this.resolveCell(d,a,c))}this.focusEl.setXY(b||this.scroller.getXY())},ensureVisible:function(t,g,e){var r=this.resolveCell(t,g,e);if(!r||!r.row){return null}var k=r.row,h=r.cell,n=this.scroller.dom,d=k,s=0,o=this.el.dom;while(d&&d!=o){s+=d.offsetTop;d=d.offsetParent}s-=this.mainHd.dom.offsetHeight;o=parseInt(n.scrollTop,10);var q=s+k.offsetHeight,a=n.clientHeight,m=o+a;if(s<o){n.scrollTop=s}else{if(q>m){n.scrollTop=q-a}}if(e!==false){var l=parseInt(h.offsetLeft,10),j=l+h.offsetWidth,i=parseInt(n.scrollLeft,10),b=i+n.clientWidth;if(l<i){n.scrollLeft=l}else{if(j>b){n.scrollLeft=j-n.clientWidth}}}return this.getResolvedXY(r)},insertRows:function(a,i,e,h){var d=a.getCount()-1;if(!h&&i===0&&e>=d){this.fireEvent("beforerowsinserted",this,i,e);this.refresh();this.fireEvent("rowsinserted",this,i,e)}else{if(!h){this.fireEvent("beforerowsinserted",this,i,e)}var b=this.renderRows(i,e),g=this.getRow(i);if(g){if(i===0){Ext.fly(this.getRow(0)).removeClass(this.firstRowCls)}Ext.DomHelper.insertHtml("beforeBegin",g,b)}else{var c=this.getRow(d-1);if(c){Ext.fly(c).removeClass(this.lastRowCls)}Ext.DomHelper.insertHtml("beforeEnd",this.mainBody.dom,b)}if(!h){this.processRows(i);this.fireEvent("rowsinserted",this,i,e)}else{if(i===0||i>=d){Ext.fly(this.getRow(i)).addClass(i===0?this.firstRowCls:this.lastRowCls)}}}this.syncFocusEl(i)},deleteRows:function(a,c,b){if(a.getRowCount()<1){this.refresh()}else{this.fireEvent("beforerowsdeleted",this,c,b);this.removeRows(c,b);this.processRows(c);this.fireEvent("rowsdeleted",this,c,b)}},getColumnStyle:function(b,d){var a=this.cm,g=a.config,c=d?"":g[b].css||"",e=g[b].align;c+=String.format("width: {0};",this.getColumnWidth(b));if(a.isHidden(b)){c+="display: none; "}if(e){c+=String.format("text-align: {0};",e)}return c},getColumnWidth:function(b){var c=this.cm.getColumnWidth(b),a=this.borderWidth;if(Ext.isNumber(c)){if(Ext.isBorderBox||(Ext.isWebKit&&!Ext.isSafari2)){return c+"px"}else{return Math.max(c-a,0)+"px"}}else{return c}},getTotalWidth:function(){return this.cm.getTotalWidth()+"px"},fitColumns:function(g,j,h){var a=this.grid,l=this.cm,s=l.getTotalWidth(false),q=this.getGridInnerWidth(),r=q-s,c=[],o=0,n=0,u,d,p;if(q<20||r===0){return false}var e=l.getColumnCount(true),m=l.getColumnCount(false),b=e-(Ext.isNumber(h)?1:0);if(b===0){b=1;h=undefined}for(p=0;p<m;p++){if(!l.isFixed(p)&&p!==h){u=l.getColumnWidth(p);c.push(p,u);if(!l.isHidden(p)){o=p;n+=u}}}d=(q-l.getTotalWidth())/n;while(c.length){u=c.pop();p=c.pop();l.setColumnWidth(p,Math.max(a.minColumnWidth,Math.floor(u+u*d)),true)}s=l.getTotalWidth(false);if(s>q){var t=(b==e)?o:h,k=Math.max(1,l.getColumnWidth(t)-(s-q));l.setColumnWidth(t,k,true)}if(g!==true){this.updateAllColumnWidths()}return true},autoExpand:function(k){var a=this.grid,i=this.cm,e=this.getGridInnerWidth(),c=i.getTotalWidth(false),g=a.autoExpandColumn;if(!this.userResized&&g){if(e!=c){var j=i.getIndexById(g),b=i.getColumnWidth(j),h=e-c+b,d=Math.min(Math.max(h,a.autoExpandMin),a.autoExpandMax);if(b!=d){i.setColumnWidth(j,d,true);if(k!==true){this.updateColumnWidth(j,d)}}}}},getGridInnerWidth:function(){return this.grid.getGridEl().getWidth(true)-this.getScrollOffset()},getColumnData:function(){var e=[],c=this.cm,g=c.getColumnCount(),a=this.ds.fields,d,b;for(d=0;d<g;d++){b=c.getDataIndex(d);e[d]={name:Ext.isDefined(b)?b:(a.get(d)?a.get(d).name:undefined),renderer:c.getRenderer(d),scope:c.getRendererScope(d),id:c.getColumnId(d),style:this.getColumnStyle(d)}}return e},renderRows:function(i,c){var a=this.grid,g=a.store,j=a.stripeRows,e=a.colModel,h=e.getColumnCount(),d=g.getCount(),b;if(d<1){return""}i=i||0;c=Ext.isDefined(c)?c:d-1;b=g.getRange(i,c);return this.doRender(this.getColumnData(),b,g,i,h,j)},renderBody:function(){var a=this.renderRows()||"&#160;";return this.templates.body.apply({rows:a})},refreshRow:function(g){var l=this.ds,m=this.cm.getColumnCount(),c=this.getColumnData(),n=m-1,p=["x-grid3-row"],e={tstyle:String.format("width: {0};",this.getTotalWidth())},a=[],k=this.templates.cell,j,q,b,o,h,d;if(Ext.isNumber(g)){j=g;g=l.getAt(j)}else{j=l.indexOf(g)}if(!g||j<0){return}for(d=0;d<m;d++){b=c[d];if(d==0){h="x-grid3-cell-first"}else{h=(d==n)?"x-grid3-cell-last ":""}o={id:b.id,style:b.style,css:h,attr:"",cellAttr:""};o.value=b.renderer.call(b.scope,g.data[b.name],o,g,j,d,l);if(Ext.isEmpty(o.value)){o.value="&#160;"}if(this.markDirty&&g.dirty&&typeof g.modified[b.name]!="undefined"){o.css+=" x-grid3-dirty-cell"}a[d]=k.apply(o)}q=this.getRow(j);q.className="";if(this.grid.stripeRows&&((j+1)%2===0)){p.push("x-grid3-row-alt")}if(this.getRowClass){e.cols=m;p.push(this.getRowClass(g,j,e,l))}this.fly(q).addClass(p).setStyle(e.tstyle);e.cells=a.join("");q.innerHTML=this.templates.rowInner.apply(e);this.fireEvent("rowupdated",this,j,g)},refresh:function(b){this.fireEvent("beforerefresh",this);this.grid.stopEditing(true);var a=this.renderBody();this.mainBody.update(a).setWidth(this.getTotalWidth());if(b===true){this.updateHeaders();this.updateHeaderSortState()}this.processRows(0,true);this.layout();this.applyEmptyText();this.fireEvent("refresh",this)},applyEmptyText:function(){if(this.emptyText&&!this.hasRows()){this.mainBody.update('<div class="x-grid-empty">'+this.emptyText+"</div>")}},updateHeaderSortState:function(){var b=this.ds.getSortState();if(!b){return}if(!this.sortState||(this.sortState.field!=b.field||this.sortState.direction!=b.direction)){this.grid.fireEvent("sortchange",this.grid,b)}this.sortState=b;var c=this.cm.findColumnIndex(b.field);if(c!=-1){var a=b.direction;this.updateSortIcon(c,a)}},clearHeaderSortState:function(){if(!this.sortState){return}this.grid.fireEvent("sortchange",this.grid,null);this.mainHd.select("td").removeClass(this.sortClasses);delete this.sortState},destroy:function(){var j=this,a=j.grid,d=a.getGridEl(),i=j.dragZone,g=j.splitZone,h=j.columnDrag,e=j.columnDrop,k=j.scrollToTopTask,c,b;if(k&&k.cancel){k.cancel()}Ext.destroyMembers(j,"colMenu","hmenu");j.initData(null,null);j.purgeListeners();Ext.fly(j.innerHd).un("click",j.handleHdDown,j);if(a.enableColumnMove){c=h.dragData;b=h.proxy;Ext.destroy(h.el,b.ghost,b.el,e.el,e.proxyTop,e.proxyBottom,c.ddel,c.header);if(b.anim){Ext.destroy(b.anim)}delete b.ghost;delete c.ddel;delete c.header;h.destroy();delete Ext.dd.DDM.locationCache[h.id];delete h._domRef;delete e.proxyTop;delete e.proxyBottom;e.destroy();delete Ext.dd.DDM.locationCache["gridHeader"+d.id];delete e._domRef;delete Ext.dd.DDM.ids[e.ddGroup]}if(g){g.destroy();delete g._domRef;delete Ext.dd.DDM.ids["gridSplitters"+d.id]}Ext.fly(j.innerHd).removeAllListeners();Ext.removeNode(j.innerHd);delete j.innerHd;Ext.destroy(j.el,j.mainWrap,j.mainHd,j.scroller,j.mainBody,j.focusEl,j.resizeMarker,j.resizeProxy,j.activeHdBtn,j._flyweight,i,g);delete a.container;if(i){i.destroy()}Ext.dd.DDM.currentTarget=null;delete Ext.dd.DDM.locationCache[d.id];Ext.EventManager.removeResizeListener(j.onWindowResize,j)},onDenyColumnHide:function(){},render:function(){if(this.autoFill){var a=this.grid.ownerCt;if(a&&a.getLayout()){a.on("afterlayout",function(){this.fitColumns(true,true);this.updateHeaders();this.updateHeaderSortState()},this,{single:true})}}else{if(this.forceFit){this.fitColumns(true,false)}else{if(this.grid.autoExpandColumn){this.autoExpand(true)}}}this.grid.getGridEl().dom.innerHTML=this.renderUI();this.afterRenderUI()},initData:function(a,e){var b=this;if(b.ds){var d=b.ds;d.un("add",b.onAdd,b);d.un("load",b.onLoad,b);d.un("clear",b.onClear,b);d.un("remove",b.onRemove,b);d.un("update",b.onUpdate,b);d.un("datachanged",b.onDataChange,b);if(d!==a&&d.autoDestroy){d.destroy()}}if(a){a.on({scope:b,load:b.onLoad,add:b.onAdd,remove:b.onRemove,update:b.onUpdate,clear:b.onClear,datachanged:b.onDataChange})}if(b.cm){var c=b.cm;c.un("configchange",b.onColConfigChange,b);c.un("widthchange",b.onColWidthChange,b);c.un("headerchange",b.onHeaderChange,b);c.un("hiddenchange",b.onHiddenChange,b);c.un("columnmoved",b.onColumnMove,b)}if(e){delete b.lastViewWidth;e.on({scope:b,configchange:b.onColConfigChange,widthchange:b.onColWidthChange,headerchange:b.onHeaderChange,hiddenchange:b.onHiddenChange,columnmoved:b.onColumnMove})}b.ds=a;b.cm=e},onDataChange:function(){this.refresh(true);this.updateHeaderSortState();this.syncFocusEl(0)},onClear:function(){this.refresh();this.syncFocusEl(0)},onUpdate:function(b,a){this.refreshRow(a)},onAdd:function(b,a,c){this.insertRows(b,c,c+(a.length-1))},onRemove:function(b,a,c,d){if(d!==true){this.fireEvent("beforerowremoved",this,c,a)}this.removeRow(c);if(d!==true){this.processRows(c);this.applyEmptyText();this.fireEvent("rowremoved",this,c,a)}},onLoad:function(){if(Ext.isGecko){if(!this.scrollToTopTask){this.scrollToTopTask=new Ext.util.DelayedTask(this.scrollToTop,this)}this.scrollToTopTask.delay(1)}else{this.scrollToTop()}},onColWidthChange:function(a,b,c){this.updateColumnWidth(b,c)},onHeaderChange:function(a,b,c){this.updateHeaders()},onHiddenChange:function(a,b,c){this.updateColumnHidden(b,c)},onColumnMove:function(a,c,b){this.indexMap=null;this.refresh(true);this.restoreScroll(this.getScrollState());this.afterMove(b);this.grid.fireEvent("columnmove",c,b)},onColConfigChange:function(){delete this.lastViewWidth;this.indexMap=null;this.refresh(true)},initUI:function(a){a.on("headerclick",this.onHeaderClick,this)},initEvents:Ext.emptyFn,onHeaderClick:function(b,a){if(this.headersDisabled||!this.cm.isSortable(a)){return}b.stopEditing(true);b.store.sort(this.cm.getDataIndex(a))},onRowOver:function(b,a){var c=this.findRowIndex(a);if(c!==false){this.addRowClass(c,this.rowOverCls)}},onRowOut:function(b,a){var c=this.findRowIndex(a);if(c!==false&&!b.within(this.getRow(c),true)){this.removeRowClass(c,this.rowOverCls)}},onRowSelect:function(a){this.addRowClass(a,this.selectedRowClass)},onRowDeselect:function(a){this.removeRowClass(a,this.selectedRowClass)},onCellSelect:function(c,b){var a=this.getCell(c,b);if(a){this.fly(a).addClass("x-grid3-cell-selected")}},onCellDeselect:function(c,b){var a=this.getCell(c,b);if(a){this.fly(a).removeClass("x-grid3-cell-selected")}},handleWheel:function(a){a.stopPropagation()},onColumnSplitterMoved:function(a,b){this.userResized=true;this.grid.colModel.setColumnWidth(a,b,true);if(this.forceFit){this.fitColumns(true,false,a);this.updateAllColumnWidths()}else{this.updateColumnWidth(a,b);this.syncHeaderScroll()}this.grid.fireEvent("columnresize",a,b)},beforeColMenuShow:function(){var b=this.cm,d=b.getColumnCount(),a=this.colMenu,c;a.removeAll();for(c=0;c<d;c++){if(b.config[c].hideable!==false){a.add(new Ext.menu.CheckItem({text:b.getColumnHeader(c),itemId:"col-"+b.getColumnId(c),checked:!b.isHidden(c),disabled:b.config[c].hideable===false,hideOnClick:false}))}}},handleHdMenuClick:function(c){var a=this.ds,b=this.cm.getDataIndex(this.hdCtxIndex);switch(c.getItemId()){case"asc":a.sort(b,"ASC");break;case"desc":a.sort(b,"DESC");break;default:this.handleHdMenuClickDefault(c)}return true},handleHdMenuClickDefault:function(c){var b=this.cm,d=c.getItemId(),a=b.getIndexById(d.substr(4));if(a!=-1){if(c.checked&&b.getColumnsBy(this.isHideableColumn,this).length<=1){this.onDenyColumnHide();return}b.setHidden(a,c.checked)}},handleHdDown:function(i,j){if(Ext.fly(j).hasClass("x-grid3-hd-btn")){i.stopEvent();var k=this.cm,g=this.findHeaderCell(j),h=this.getCellIndex(g),d=k.isSortable(h),c=this.hmenu,b=c.items,a=this.headerMenuOpenCls;this.hdCtxIndex=h;Ext.fly(g).addClass(a);b.get("asc").setDisabled(!d);b.get("desc").setDisabled(!d);c.on("hide",function(){Ext.fly(g).removeClass(a)},this,{single:true});c.show(j,"tl-bl?")}},handleHdMove:function(k){var i=this.findHeaderCell(this.activeHdRef);if(i&&!this.headersDisabled){var l=this.splitHandleWidth||5,j=this.activeHdRegion,p=i.style,m=this.cm,o="",g=k.getPageX();if(this.grid.enableColumnResize!==false){var a=this.activeHdIndex,b=this.getPreviousVisible(a),n=m.isResizable(a),c=b&&m.isResizable(b),d=g-j.left<=l,h=j.right-g<=(!this.activeHdBtn?l:2);if(d&&c){o=Ext.isAir?"move":Ext.isWebKit?"e-resize":"col-resize"}else{if(h&&n){o=Ext.isAir?"move":Ext.isWebKit?"w-resize":"col-resize"}}}p.cursor=o}},getPreviousVisible:function(a){while(a>0){if(!this.cm.isHidden(a-1)){return a}a--}return undefined},handleHdOver:function(c,b){var d=this.findHeaderCell(b);if(d&&!this.headersDisabled){var a=this.fly(d);this.activeHdRef=b;this.activeHdIndex=this.getCellIndex(d);this.activeHdRegion=a.getRegion();if(!this.isMenuDisabled(this.activeHdIndex,a)){a.addClass("x-grid3-hd-over");this.activeHdBtn=a.child(".x-grid3-hd-btn");if(this.activeHdBtn){this.activeHdBtn.dom.style.height=(d.firstChild.offsetHeight-1)+"px"}}}},handleHdOut:function(b,a){var c=this.findHeaderCell(a);if(c&&(!Ext.isIE||!b.within(c,true))){this.activeHdRef=null;this.fly(c).removeClass("x-grid3-hd-over");c.style.cursor=""}},isMenuDisabled:function(a,b){return this.cm.isMenuDisabled(a)},hasRows:function(){var a=this.mainBody.dom.firstChild;return a&&a.nodeType==1&&a.className!="x-grid-empty"},isHideableColumn:function(a){return !a.hidden},bind:function(a,b){this.initData(a,b)}});Ext.grid.GridView.SplitDragZone=Ext.extend(Ext.dd.DDProxy,{constructor:function(a,b){this.grid=a;this.view=a.getView();this.marker=this.view.resizeMarker;this.proxy=this.view.resizeProxy;Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this,b,"gridSplitters"+this.grid.getGridEl().id,{dragElId:Ext.id(this.proxy.dom),resizeFrame:false});this.scroll=false;this.hw=this.view.splitHandleWidth||5},b4StartDrag:function(a,e){this.dragHeadersDisabled=this.view.headersDisabled;this.view.headersDisabled=true;var d=this.view.mainWrap.getHeight();this.marker.setHeight(d);this.marker.show();this.marker.alignTo(this.view.getHeaderCell(this.cellIndex),"tl-tl",[-2,0]);this.proxy.setHeight(d);var b=this.cm.getColumnWidth(this.cellIndex),c=Math.max(b-this.grid.minColumnWidth,0);this.resetConstraints();this.setXConstraint(c,1000);this.setYConstraint(0,0);this.minX=a-c;this.maxX=a+1000;this.startPos=a;Ext.dd.DDProxy.prototype.b4StartDrag.call(this,a,e)},allowHeaderDrag:function(a){return true},handleMouseDown:function(a){var h=this.view.findHeaderCell(a.getTarget());if(h&&this.allowHeaderDrag(a)){var k=this.view.fly(h).getXY(),c=k[0],i=a.getXY(),b=i[0],g=h.offsetWidth,d=false;if((b-c)<=this.hw){d=-1}else{if((c+g)-b<=this.hw){d=0}}if(d!==false){this.cm=this.grid.colModel;var j=this.view.getCellIndex(h);if(d==-1){if(j+d<0){return}while(this.cm.isHidden(j+d)){--d;if(j+d<0){return}}}this.cellIndex=j+d;this.split=h.dom;if(this.cm.isResizable(this.cellIndex)&&!this.cm.isFixed(this.cellIndex)){Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this,arguments)}}else{if(this.view.columnDrag){this.view.columnDrag.callHandleMouseDown(a)}}}},endDrag:function(g){this.marker.hide();var a=this.view,c=Math.max(this.minX,g.getPageX()),d=c-this.startPos,b=this.dragHeadersDisabled;a.onColumnSplitterMoved(this.cellIndex,this.cm.getColumnWidth(this.cellIndex)+d);setTimeout(function(){a.headersDisabled=b},50)},autoOffset:function(){this.setDelta(0,0)}});Ext.grid.PivotGridView=Ext.extend(Ext.grid.GridView,{colHeaderCellCls:"grid-hd-group-cell",title:"",getColumnHeaders:function(){return this.grid.topAxis.buildHeaders()},getRowHeaders:function(){return this.grid.leftAxis.buildHeaders()},renderRows:function(a,t){var b=this.grid,o=b.extractData(),p=o.length,g=this.templates,s=b.renderer,h=typeof s=="function",w=this.getCellCls,n=typeof w=="function",d=g.cell,x=g.row,k=[],q={},c="width:"+this.getGridInnerWidth()+"px;",l,r,e,v,m;a=a||0;t=Ext.isDefined(t)?t:p-1;for(v=0;v<p;v++){m=o[v];r=m.length;l=[];for(var u=0;u<r;u++){q.id=v+"-"+u;q.css=u===0?"x-grid3-cell-first ":(u==(r-1)?"x-grid3-cell-last ":"");q.attr=q.cellAttr="";q.value=m[u];if(Ext.isEmpty(q.value)){q.value="&#160;"}if(h){q.value=s(q.value)}if(n){q.css+=w(q.value)+" "}l[l.length]=d.apply(q)}k[k.length]=x.apply({tstyle:c,cols:r,cells:l.join(""),alt:""})}return k.join("")},masterTpl:new Ext.Template('<div class="x-grid3 x-pivotgrid" hidefocus="true">','<div class="x-grid3-viewport">','<div class="x-grid3-header">','<div class="x-grid3-header-title"><span>{title}</span></div>','<div class="x-grid3-header-inner">','<div class="x-grid3-header-offset" style="{ostyle}"></div>',"</div>",'<div class="x-clear"></div>',"</div>",'<div class="x-grid3-scroller">','<div class="x-grid3-row-headers"></div>','<div class="x-grid3-body" style="{bstyle}">{body}</div>','<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',"</div>","</div>",'<div class="x-grid3-resize-marker">&#160;</div>','<div class="x-grid3-resize-proxy">&#160;</div>',"</div>"),initTemplates:function(){Ext.grid.PivotGridView.superclass.initTemplates.apply(this,arguments);var a=this.templates||{};if(!a.gcell){a.gcell=new Ext.XTemplate('<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} '+this.colHeaderCellCls+'" style="{style}">','<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">',this.grid.enableHdMenu?'<a class="x-grid3-hd-btn" href="#"></a>':"","{value}","</div>","</td>")}this.templates=a;this.hrowRe=new RegExp("ux-grid-hd-group-row-(\\d+)","")},initElements:function(){Ext.grid.PivotGridView.superclass.initElements.apply(this,arguments);this.rowHeadersEl=new Ext.Element(this.scroller.child("div.x-grid3-row-headers"));this.headerTitleEl=new Ext.Element(this.mainHd.child("div.x-grid3-header-title"))},getGridInnerWidth:function(){var a=Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this,arguments);return a-this.getTotalRowHeaderWidth()},getTotalRowHeaderWidth:function(){var d=this.getRowHeaders(),c=d.length,b=0,a;for(a=0;a<c;a++){b+=d[a].width}return b},getTotalColumnHeaderHeight:function(){return this.getColumnHeaders().length*21},getCellIndex:function(b){if(b){var a=b.className.match(this.colRe),c;if(a&&(c=a[1])){return parseInt(c.split("-")[1],10)}}return false},renderUI:function(){var b=this.templates,a=this.getGridInnerWidth();return b.master.apply({body:b.body.apply({rows:"&#160;"}),ostyle:"width:"+a+"px",bstyle:"width:"+a+"px"})},onLayout:function(b,a){Ext.grid.PivotGridView.superclass.onLayout.apply(this,arguments);var b=this.getGridInnerWidth();this.resizeColumnHeaders(b);this.resizeAllRows(b)},refresh:function(b){this.fireEvent("beforerefresh",this);this.grid.stopEditing(true);var a=this.renderBody();this.mainBody.update(a).setWidth(this.getGridInnerWidth());if(b===true){this.updateHeaders();this.updateHeaderSortState()}this.processRows(0,true);this.layout();this.applyEmptyText();this.fireEvent("refresh",this)},renderHeaders:Ext.emptyFn,fitColumns:Ext.emptyFn,resizeColumnHeaders:function(b){var a=this.grid.topAxis;if(a.rendered){a.el.setWidth(b)}},resizeRowHeaders:function(){var a=this.getTotalRowHeaderWidth(),b=String.format("margin-left: {0}px;",a);this.rowHeadersEl.setWidth(a);this.mainBody.applyStyles(b);Ext.fly(this.innerHd).applyStyles(b);this.headerTitleEl.setWidth(a);this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight())},resizeAllRows:function(b){var d=this.getRows(),c=d.length,a;for(a=0;a<c;a++){Ext.fly(d[a]).setWidth(b);Ext.fly(d[a]).child("table").setWidth(b)}},updateHeaders:function(){this.renderGroupRowHeaders();this.renderGroupColumnHeaders()},renderGroupRowHeaders:function(){var a=this.grid.leftAxis;this.resizeRowHeaders();a.rendered=false;a.render(this.rowHeadersEl);this.setTitle(this.title)},setTitle:function(a){this.headerTitleEl.child("span").dom.innerHTML=a},renderGroupColumnHeaders:function(){var a=this.grid.topAxis;a.rendered=false;a.render(this.innerHd.firstChild)},isMenuDisabled:function(a,b){return true}});Ext.grid.PivotAxis=Ext.extend(Ext.Component,{orientation:"horizontal",defaultHeaderWidth:80,paddingWidth:7,setDimensions:function(a){this.dimensions=a},onRender:function(b,a){var c=this.orientation=="horizontal"?this.renderHorizontalRows():this.renderVerticalRows();this.el=Ext.DomHelper.overwrite(b.dom,{tag:"table",cn:c},true)},renderHorizontalRows:function(){var k=this.buildHeaders(),a=k.length,g=[],c,h,e,d,b;for(d=0;d<a;d++){c=[];h=k[d].items;e=h.length;for(b=0;b<e;b++){c.push({tag:"td",html:h[b].header,colspan:h[b].span})}g[d]={tag:"tr",cn:c}}return g},renderVerticalRows:function(){var b=this.buildHeaders(),k=b.length,a=[],m=[],h,c,l,g,e,d;for(e=0;e<k;e++){c=b[e];g=c.width||80;h=c.items.length;for(d=0;d<h;d++){l=c.items[d];a[l.start]=a[l.start]||[];a[l.start].push({tag:"td",html:l.header,rowspan:l.span,width:Ext.isBorderBox?g:g-this.paddingWidth})}}h=a.length;for(e=0;e<h;e++){m[e]={tag:"tr",cn:a[e]}}return m},getTuples:function(){var b=new Ext.data.Store({});b.data=this.store.data.clone();b.fields=this.store.fields;var l=[],a=this.dimensions,c=a.length,j;for(j=0;j<c;j++){l.push({field:a[j].dataIndex,direction:a[j].direction||"ASC"})}b.sort(l);var e=b.data.items,n=[],k=[],o,h,d,g,m;c=e.length;for(j=0;j<c;j++){d=this.getRecordInfo(e[j]);g=d.data;h="";for(m in g){h+=g[m]+"---"}if(n.indexOf(h)==-1){n.push(h);k.push(d)}}b.destroy();return k},getRecordInfo:function(a){var e=this.dimensions,d=e.length,h={},j,c,b;for(b=0;b<d;b++){j=e[b];c=j.dataIndex;h[c]=a.get(c)}var g=function(i){return function(k){for(var l in i){if(k.get(l)!=i[l]){return false}}return true}};return{data:h,matcher:g(h)}},buildHeaders:function(){var l=this.getTuples(),m=l.length,a=this.dimensions,e,r=a.length,c=[],o,s,n,q,p,b,k,h,g,d;for(g=0;g<r;g++){e=a[g];s=[];p=0;b=0;for(d=0;d<m;d++){o=l[d];k=d==(m-1);n=o.data[e.dataIndex];h=q!=undefined&&q!=n;if(g>0&&d>0){h=h||o.data[a[g-1].dataIndex]!=l[d-1].data[a[g-1].dataIndex]}if(h){s.push({header:q,span:p,start:b});b+=p;p=0}if(k){s.push({header:n,span:p+1,start:b});b+=p;p=0}q=n;p++}c.push({items:s,width:e.width||this.defaultHeaderWidth});q=undefined}return c}});Ext.grid.HeaderDragZone=Ext.extend(Ext.dd.DragZone,{maxDragWidth:120,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.ddGroup="gridHeader"+this.grid.getGridEl().id;Ext.grid.HeaderDragZone.superclass.constructor.call(this,c);if(b){this.setHandleElId(Ext.id(c));this.setOuterHandleElId(Ext.id(b))}this.scroll=false},getDragData:function(c){var a=Ext.lib.Event.getTarget(c),b=this.view.findHeaderCell(a);if(b){return{ddel:b.firstChild,header:b}}return false},onInitDrag:function(a){this.dragHeadersDisabled=this.view.headersDisabled;this.view.headersDisabled=true;var b=this.dragData.ddel.cloneNode(true);b.id=Ext.id();b.style.width=Math.min(this.dragData.header.offsetWidth,this.maxDragWidth)+"px";this.proxy.update(b);return true},afterValidDrop:function(){this.completeDrop()},afterInvalidDrop:function(){this.completeDrop()},completeDrop:function(){var a=this.view,b=this.dragHeadersDisabled;setTimeout(function(){a.headersDisabled=b},50)}});Ext.grid.HeaderDropZone=Ext.extend(Ext.dd.DropZone,{proxyOffsets:[-4,-9],fly:Ext.Element.fly,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.proxyTop=Ext.DomHelper.append(document.body,{cls:"col-move-top",html:"&#160;"},true);this.proxyBottom=Ext.DomHelper.append(document.body,{cls:"col-move-bottom",html:"&#160;"},true);this.proxyTop.hide=this.proxyBottom.hide=function(){this.setLeftTop(-100,-100);this.setStyle("visibility","hidden")};this.ddGroup="gridHeader"+this.grid.getGridEl().id;Ext.grid.HeaderDropZone.superclass.constructor.call(this,a.getGridEl().dom)},getTargetFromEvent:function(c){var a=Ext.lib.Event.getTarget(c),b=this.view.findCellIndex(a);if(b!==false){return this.view.getHeaderCell(b)}},nextVisible:function(c){var b=this.view,a=this.grid.colModel;c=c.nextSibling;while(c){if(!a.isHidden(b.getCellIndex(c))){return c}c=c.nextSibling}return null},prevVisible:function(c){var b=this.view,a=this.grid.colModel;c=c.prevSibling;while(c){if(!a.isHidden(b.getCellIndex(c))){return c}c=c.prevSibling}return null},positionIndicator:function(d,k,j){var a=Ext.lib.Event.getPageX(j),g=Ext.lib.Dom.getRegion(k.firstChild),c,i,b=g.top+this.proxyOffsets[1];if((g.right-a)<=(g.right-g.left)/2){c=g.right+this.view.borderWidth;i="after"}else{c=g.left;i="before"}if(this.grid.colModel.isFixed(this.view.getCellIndex(k))){return false}c+=this.proxyOffsets[0];this.proxyTop.setLeftTop(c,b);this.proxyTop.show();if(!this.bottomOffset){this.bottomOffset=this.view.mainHd.getHeight()}this.proxyBottom.setLeftTop(c,b+this.proxyTop.dom.offsetHeight+this.bottomOffset);this.proxyBottom.show();return i},onNodeEnter:function(d,a,c,b){if(b.header!=d){this.positionIndicator(b.header,d,c)}},onNodeOver:function(g,b,d,c){var a=false;if(c.header!=g){a=this.positionIndicator(c.header,g,d)}if(!a){this.proxyTop.hide();this.proxyBottom.hide()}return a?this.dropAllowed:this.dropNotAllowed},onNodeOut:function(d,a,c,b){this.proxyTop.hide();this.proxyBottom.hide()},onNodeDrop:function(b,m,g,c){var d=c.header;if(d!=b){var k=this.grid.colModel,j=Ext.lib.Event.getPageX(g),a=Ext.lib.Dom.getRegion(b.firstChild),o=(a.right-j)<=((a.right-a.left)/2)?"after":"before",i=this.view.getCellIndex(d),l=this.view.getCellIndex(b);if(o=="after"){l++}if(i<l){l--}k.moveColumn(i,l);return true}return false}});Ext.grid.GridView.ColumnDragZone=Ext.extend(Ext.grid.HeaderDragZone,{constructor:function(a,b){Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this,a,b,null);this.proxy.el.addClass("x-grid3-col-dd")},handleMouseDown:function(a){},callHandleMouseDown:function(a){Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this,a)}});Ext.grid.SplitDragZone=Ext.extend(Ext.dd.DDProxy,{fly:Ext.Element.fly,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.proxy=this.view.resizeProxy;Ext.grid.SplitDragZone.superclass.constructor.call(this,c,"gridSplitters"+this.grid.getGridEl().id,{dragElId:Ext.id(this.proxy.dom),resizeFrame:false});this.setHandleElId(Ext.id(c));this.setOuterHandleElId(Ext.id(b));this.scroll=false},b4StartDrag:function(a,d){this.view.headersDisabled=true;this.proxy.setHeight(this.view.mainWrap.getHeight());var b=this.cm.getColumnWidth(this.cellIndex);var c=Math.max(b-this.grid.minColumnWidth,0);this.resetConstraints();this.setXConstraint(c,1000);this.setYConstraint(0,0);this.minX=a-c;this.maxX=a+1000;this.startPos=a;Ext.dd.DDProxy.prototype.b4StartDrag.call(this,a,d)},handleMouseDown:function(c){var b=Ext.EventObject.setEvent(c);var a=this.fly(b.getTarget());if(a.hasClass("x-grid-split")){this.cellIndex=this.view.getCellIndex(a.dom);this.split=a.dom;this.cm=this.grid.colModel;if(this.cm.isResizable(this.cellIndex)&&!this.cm.isFixed(this.cellIndex)){Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this,arguments)}}},endDrag:function(c){this.view.headersDisabled=false;var a=Math.max(this.minX,Ext.lib.Event.getPageX(c));var b=a-this.startPos;this.view.onColumnSplitterMoved(this.cellIndex,this.cm.getColumnWidth(this.cellIndex)+b)},autoOffset:function(){this.setDelta(0,0)}});Ext.grid.GridDragZone=function(b,a){this.view=b.getView();Ext.grid.GridDragZone.superclass.constructor.call(this,this.view.mainBody.dom,a);this.scroll=false;this.grid=b;this.ddel=document.createElement("div");this.ddel.className="x-grid-dd-wrap"};Ext.extend(Ext.grid.GridDragZone,Ext.dd.DragZone,{ddGroup:"GridDD",getDragData:function(b){var a=Ext.lib.Event.getTarget(b);var d=this.view.findRowIndex(a);if(d!==false){var c=this.grid.selModel;if(!c.isSelected(d)||b.hasModifier()){c.handleMouseDown(this.grid,d,b)}return{grid:this.grid,ddel:this.ddel,rowIndex:d,selections:c.getSelections()}}return false},onInitDrag:function(b){var a=this.dragData;this.ddel.innerHTML=this.grid.getDragDropText();this.proxy.update(this.ddel)},afterRepair:function(){this.dragging=false},getRepairXY:function(b,a){return false},onEndDrag:function(a,b){},onValidDrop:function(a,b,c){this.hideProxy()},beforeInvalidDrop:function(a,b){}});Ext.grid.ColumnModel=Ext.extend(Ext.util.Observable,{defaultWidth:100,defaultSortable:false,constructor:function(a){if(a.columns){Ext.apply(this,a);this.setConfig(a.columns,true)}else{this.setConfig(a,true)}this.addEvents("widthchange","headerchange","hiddenchange","columnmoved","configchange");Ext.grid.ColumnModel.superclass.constructor.call(this)},getColumnId:function(a){return this.config[a].id},getColumnAt:function(a){return this.config[a]},setConfig:function(d,b){var e,h,a;if(!b){delete this.totalWidth;for(e=0,a=this.config.length;e<a;e++){h=this.config[e];if(h.setEditor){h.setEditor(null)}}}this.defaults=Ext.apply({width:this.defaultWidth,sortable:this.defaultSortable},this.defaults);this.config=d;this.lookup={};for(e=0,a=d.length;e<a;e++){h=Ext.applyIf(d[e],this.defaults);if(Ext.isEmpty(h.id)){h.id=e}if(!h.isColumn){var g=Ext.grid.Column.types[h.xtype||"gridcolumn"];h=new g(h);d[e]=h}this.lookup[h.id]=h}if(!b){this.fireEvent("configchange",this)}},getColumnById:function(a){return this.lookup[a]},getIndexById:function(c){for(var b=0,a=this.config.length;b<a;b++){if(this.config[b].id==c){return b}}return -1},moveColumn:function(e,b){var a=this.config,d=a[e];a.splice(e,1);a.splice(b,0,d);this.dataMap=null;this.fireEvent("columnmoved",this,e,b)},getColumnCount:function(b){var d=this.config.length,e=0,a;if(b===true){for(a=0;a<d;a++){if(!this.isHidden(a)){e++}}return e}return d},getColumnsBy:function(g,e){var b=this.config,h=b.length,a=[],d,j;for(d=0;d<h;d++){j=b[d];if(g.call(e||this,j,d)===true){a[a.length]=j}}return a},isSortable:function(a){return !!this.config[a].sortable},isMenuDisabled:function(a){return !!this.config[a].menuDisabled},getRenderer:function(a){return this.config[a].renderer||Ext.grid.ColumnModel.defaultRenderer},getRendererScope:function(a){return this.config[a].scope},setRenderer:function(a,b){this.config[a].renderer=b},getColumnWidth:function(a){var b=this.config[a].width;if(typeof b!="number"){b=this.defaultWidth}return b},setColumnWidth:function(b,c,a){this.config[b].width=c;this.totalWidth=null;if(!a){this.fireEvent("widthchange",this,b,c)}},getTotalWidth:function(b){if(!this.totalWidth){this.totalWidth=0;for(var c=0,a=this.config.length;c<a;c++){if(b||!this.isHidden(c)){this.totalWidth+=this.getColumnWidth(c)}}}return this.totalWidth},getColumnHeader:function(a){return this.config[a].header},setColumnHeader:function(a,b){this.config[a].header=b;this.fireEvent("headerchange",this,a,b)},getColumnTooltip:function(a){return this.config[a].tooltip},setColumnTooltip:function(a,b){this.config[a].tooltip=b},getDataIndex:function(a){return this.config[a].dataIndex},setDataIndex:function(a,b){this.config[a].dataIndex=b},findColumnIndex:function(d){var e=this.config;for(var b=0,a=e.length;b<a;b++){if(e[b].dataIndex==d){return b}}return -1},isCellEditable:function(b,e){var d=this.config[b],a=d.editable;return !!(a||(!Ext.isDefined(a)&&d.editor))},getCellEditor:function(a,b){return this.config[a].getCellEditor(b)},setEditable:function(a,b){this.config[a].editable=b},isHidden:function(a){return !!this.config[a].hidden},isFixed:function(a){return !!this.config[a].fixed},isResizable:function(a){return a>=0&&this.config[a].resizable!==false&&this.config[a].fixed!==true},setHidden:function(a,b){var d=this.config[a];if(d.hidden!==b){d.hidden=b;this.totalWidth=null;this.fireEvent("hiddenchange",this,a,b)}},setEditor:function(a,b){this.config[a].setEditor(b)},destroy:function(){var b=this.config.length,a=0;for(;a<b;a++){this.config[a].destroy()}delete this.config;delete this.lookup;this.purgeListeners()},setState:function(a,b){b=Ext.applyIf(b,this.defaults);Ext.apply(this.config[a],b)}});Ext.grid.ColumnModel.defaultRenderer=function(a){if(typeof a=="string"&&a.length<1){return"&#160;"}return a};Ext.grid.AbstractSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(){this.locked=false;Ext.grid.AbstractSelectionModel.superclass.constructor.call(this)},init:function(a){this.grid=a;if(this.lockOnInit){delete this.lockOnInit;this.locked=false;this.lock()}this.initEvents()},lock:function(){if(!this.locked){this.locked=true;var a=this.grid;if(a){a.getView().on({scope:this,beforerefresh:this.sortUnLock,refresh:this.sortLock})}else{this.lockOnInit=true}}},sortLock:function(){this.locked=true},sortUnLock:function(){this.locked=false},unlock:function(){if(this.locked){this.locked=false;var a=this.grid,b;if(a){b=a.getView();b.un("beforerefresh",this.sortUnLock,this);b.un("refresh",this.sortLock,this)}else{delete this.lockOnInit}}},isLocked:function(){return this.locked},destroy:function(){this.unlock();this.purgeListeners()}});Ext.grid.RowSelectionModel=Ext.extend(Ext.grid.AbstractSelectionModel,{singleSelect:false,constructor:function(a){Ext.apply(this,a);this.selections=new Ext.util.MixedCollection(false,function(b){return b.id});this.last=false;this.lastActive=false;this.addEvents("selectionchange","beforerowselect","rowselect","rowdeselect");Ext.grid.RowSelectionModel.superclass.constructor.call(this)},initEvents:function(){if(!this.grid.enableDragDrop&&!this.grid.enableDrag){this.grid.on("rowmousedown",this.handleMouseDown,this)}this.rowNav=new Ext.KeyNav(this.grid.getGridEl(),{up:this.onKeyPress,down:this.onKeyPress,scope:this});this.grid.getView().on({scope:this,refresh:this.onRefresh,rowupdated:this.onRowUpdated,rowremoved:this.onRemove})},onKeyPress:function(g,b){var a=b=="up",h=a?"selectPrevious":"selectNext",d=a?-1:1,c;if(!g.shiftKey||this.singleSelect){this[h](false)}else{if(this.last!==false&&this.lastActive!==false){c=this.last;this.selectRange(this.last,this.lastActive+d);this.grid.getView().focusRow(this.lastActive);if(c!==false){this.last=c}}else{this.selectFirstRow()}}},onRefresh:function(){var g=this.grid.store,d=this.getSelections(),c=0,a=d.length,b,e;this.silent=true;this.clearSelections(true);for(;c<a;c++){e=d[c];if((b=g.indexOfId(e.id))!=-1){this.selectRow(b,true)}}if(d.length!=this.selections.getCount()){this.fireEvent("selectionchange",this)}this.silent=false},onRemove:function(a,b,c){if(this.selections.remove(c)!==false){this.fireEvent("selectionchange",this)}},onRowUpdated:function(a,b,c){if(this.isSelected(c)){a.onRowSelect(b)}},selectRecords:function(b,e){if(!e){this.clearSelections()}var d=this.grid.store,c=0,a=b.length;for(;c<a;c++){this.selectRow(d.indexOf(b[c]),true)}},getCount:function(){return this.selections.length},selectFirstRow:function(){this.selectRow(0)},selectLastRow:function(a){this.selectRow(this.grid.store.getCount()-1,a)},selectNext:function(a){if(this.hasNext()){this.selectRow(this.last+1,a);this.grid.getView().focusRow(this.last);return true}return false},selectPrevious:function(a){if(this.hasPrevious()){this.selectRow(this.last-1,a);this.grid.getView().focusRow(this.last);return true}return false},hasNext:function(){return this.last!==false&&(this.last+1)<this.grid.store.getCount()},hasPrevious:function(){return !!this.last},getSelections:function(){return[].concat(this.selections.items)},getSelected:function(){return this.selections.itemAt(0)},each:function(e,d){var c=this.getSelections(),b=0,a=c.length;for(;b<a;b++){if(e.call(d||this,c[b],b)===false){return false}}return true},clearSelections:function(a){if(this.isLocked()){return}if(a!==true){var c=this.grid.store,b=this.selections;b.each(function(d){this.deselectRow(c.indexOfId(d.id))},this);b.clear()}else{this.selections.clear()}this.last=false},selectAll:function(){if(this.isLocked()){return}this.selections.clear();for(var b=0,a=this.grid.store.getCount();b<a;b++){this.selectRow(b,true)}},hasSelection:function(){return this.selections.length>0},isSelected:function(a){var b=Ext.isNumber(a)?this.grid.store.getAt(a):a;return(b&&this.selections.key(b.id)?true:false)},isIdSelected:function(a){return(this.selections.key(a)?true:false)},handleMouseDown:function(d,i,h){if(h.button!==0||this.isLocked()){return}var a=this.grid.getView();if(h.shiftKey&&!this.singleSelect&&this.last!==false){var c=this.last;this.selectRange(c,i,h.ctrlKey);this.last=c;a.focusRow(i)}else{var b=this.isSelected(i);if(h.ctrlKey&&b){this.deselectRow(i)}else{if(!b||this.getCount()>1){this.selectRow(i,h.ctrlKey||h.shiftKey);a.focusRow(i)}}}},selectRows:function(c,d){if(!d){this.clearSelections()}for(var b=0,a=c.length;b<a;b++){this.selectRow(c[b],true)}},selectRange:function(b,a,d){var c;if(this.isLocked()){return}if(!d){this.clearSelections()}if(b<=a){for(c=b;c<=a;c++){this.selectRow(c,true)}}else{for(c=b;c>=a;c--){this.selectRow(c,true)}}},deselectRange:function(c,b,a){if(this.isLocked()){return}for(var d=c;d<=b;d++){this.deselectRow(d,a)}},selectRow:function(b,d,a){if(this.isLocked()||(b<0||b>=this.grid.store.getCount())||(d&&this.isSelected(b))){return}var c=this.grid.store.getAt(b);if(c&&this.fireEvent("beforerowselect",this,b,d,c)!==false){if(!d||this.singleSelect){this.clearSelections()}this.selections.add(c);this.last=this.lastActive=b;if(!a){this.grid.getView().onRowSelect(b)}if(!this.silent){this.fireEvent("rowselect",this,b,c);this.fireEvent("selectionchange",this)}}},deselectRow:function(b,a){if(this.isLocked()){return}if(this.last==b){this.last=false}if(this.lastActive==b){this.lastActive=false}var c=this.grid.store.getAt(b);if(c){this.selections.remove(c);if(!a){this.grid.getView().onRowDeselect(b)}this.fireEvent("rowdeselect",this,b,c);this.fireEvent("selectionchange",this)}},acceptsNav:function(c,b,a){return !a.isHidden(b)&&a.isCellEditable(b,c)},onEditorKey:function(n,l){var d=l.getKey(),h,i=this.grid,p=i.lastEdit,j=i.activeEditor,b=l.shiftKey,o,p,a,m;if(d==l.TAB){l.stopEvent();j.completeEdit();if(b){h=i.walkCells(j.row,j.col-1,-1,this.acceptsNav,this)}else{h=i.walkCells(j.row,j.col+1,1,this.acceptsNav,this)}}else{if(d==l.ENTER){if(this.moveEditorOnEnter!==false){if(b){h=i.walkCells(p.row-1,p.col,-1,this.acceptsNav,this)}else{h=i.walkCells(p.row+1,p.col,1,this.acceptsNav,this)}}}}if(h){a=h[0];m=h[1];this.onEditorSelect(a,p.row);if(i.isEditor&&i.editing){o=i.activeEditor;if(o&&o.field.triggerBlur){o.field.triggerBlur()}}i.startEditing(a,m)}},onEditorSelect:function(b,a){if(a!=b){this.selectRow(b)}},destroy:function(){Ext.destroy(this.rowNav);this.rowNav=null;Ext.grid.RowSelectionModel.superclass.destroy.call(this)}});Ext.grid.Column=Ext.extend(Ext.util.Observable,{isColumn:true,constructor:function(b){Ext.apply(this,b);if(Ext.isString(this.renderer)){this.renderer=Ext.util.Format[this.renderer]}else{if(Ext.isObject(this.renderer)){this.scope=this.renderer.scope;this.renderer=this.renderer.fn}}if(!this.scope){this.scope=this}var a=this.editor;delete this.editor;this.setEditor(a);this.addEvents("click","contextmenu","dblclick","mousedown");Ext.grid.Column.superclass.constructor.call(this)},processEvent:function(b,d,c,g,a){return this.fireEvent(b,this,c,g,d)},destroy:function(){if(this.setEditor){this.setEditor(null)}this.purgeListeners()},renderer:function(a){return a},getEditor:function(a){return this.editable!==false?this.editor:null},setEditor:function(b){var a=this.editor;if(a){if(a.gridEditor){a.gridEditor.destroy();delete a.gridEditor}else{a.destroy()}}this.editor=null;if(b){if(!b.isXType){b=Ext.create(b,"textfield")}this.editor=b}},getCellEditor:function(b){var a=this.getEditor(b);if(a){if(!a.startEdit){if(!a.gridEditor){a.gridEditor=new Ext.grid.GridEditor(a)}a=a.gridEditor}}return a}});Ext.grid.BooleanColumn=Ext.extend(Ext.grid.Column,{trueText:"true",falseText:"false",undefinedText:"&#160;",constructor:function(a){Ext.grid.BooleanColumn.superclass.constructor.call(this,a);var c=this.trueText,d=this.falseText,b=this.undefinedText;this.renderer=function(e){if(e===undefined){return b}if(!e||e==="false"){return d}return c}}});Ext.grid.NumberColumn=Ext.extend(Ext.grid.Column,{format:"0,000.00",constructor:function(a){Ext.grid.NumberColumn.superclass.constructor.call(this,a);this.renderer=Ext.util.Format.numberRenderer(this.format)}});Ext.grid.DateColumn=Ext.extend(Ext.grid.Column,{format:"m/d/Y",constructor:function(a){Ext.grid.DateColumn.superclass.constructor.call(this,a);this.renderer=Ext.util.Format.dateRenderer(this.format)}});Ext.grid.TemplateColumn=Ext.extend(Ext.grid.Column,{constructor:function(a){Ext.grid.TemplateColumn.superclass.constructor.call(this,a);var b=(!Ext.isPrimitive(this.tpl)&&this.tpl.compile)?this.tpl:new Ext.XTemplate(this.tpl);this.renderer=function(d,e,c){return b.apply(c.data)};this.tpl=b}});Ext.grid.ActionColumn=Ext.extend(Ext.grid.Column,{header:"&#160;",actionIdRe:/x-action-col-(\d+)/,altText:"",constructor:function(b){var g=this,c=b.items||(g.items=[g]),a=c.length,d,e;Ext.grid.ActionColumn.superclass.constructor.call(g,b);g.renderer=function(h,i){h=Ext.isFunction(b.renderer)?b.renderer.apply(this,arguments)||"":"";i.css+=" x-action-col-cell";for(d=0;d<a;d++){e=c[d];h+='<img alt="'+(e.altText||g.altText)+'" src="'+(e.icon||Ext.BLANK_IMAGE_URL)+'" class="x-action-col-icon x-action-col-'+String(d)+" "+(e.iconCls||"")+" "+(Ext.isFunction(e.getClass)?e.getClass.apply(e.scope||this.scope||this,arguments):"")+'"'+((e.tooltip)?' ext:qtip="'+e.tooltip+'"':"")+" />"}return h}},destroy:function(){delete this.items;delete this.renderer;return Ext.grid.ActionColumn.superclass.destroy.apply(this,arguments)},processEvent:function(c,i,d,j,b){var a=i.getTarget().className.match(this.actionIdRe),h,g;if(a&&(h=this.items[parseInt(a[1],10)])){if(c=="click"){(g=h.handler||this.handler)&&g.call(h.scope||this.scope||this,d,j,b,h,i)}else{if((c=="mousedown")&&(h.stopSelection!==false)){return false}}}return Ext.grid.ActionColumn.superclass.processEvent.apply(this,arguments)}});Ext.grid.Column.types={gridcolumn:Ext.grid.Column,booleancolumn:Ext.grid.BooleanColumn,numbercolumn:Ext.grid.NumberColumn,datecolumn:Ext.grid.DateColumn,templatecolumn:Ext.grid.TemplateColumn,actioncolumn:Ext.grid.ActionColumn};Ext.grid.RowNumberer=Ext.extend(Object,{header:"",width:23,sortable:false,constructor:function(a){Ext.apply(this,a);if(this.rowspan){this.renderer=this.renderer.createDelegate(this)}},fixed:true,hideable:false,menuDisabled:true,dataIndex:"",id:"numberer",rowspan:undefined,renderer:function(b,c,a,d){if(this.rowspan){c.cellAttr='rowspan="'+this.rowspan+'"'}return d+1}});Ext.grid.CheckboxSelectionModel=Ext.extend(Ext.grid.RowSelectionModel,{header:'<div class="x-grid3-hd-checker">&#160;</div>',width:20,sortable:false,menuDisabled:true,fixed:true,hideable:false,dataIndex:"",id:"checker",isColumn:true,constructor:function(){Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this,arguments);if(this.checkOnly){this.handleMouseDown=Ext.emptyFn}},initEvents:function(){Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);this.grid.on("render",function(){Ext.fly(this.grid.getView().innerHd).on("mousedown",this.onHdMouseDown,this)},this)},processEvent:function(b,d,c,g,a){if(b=="mousedown"){this.onMouseDown(d,d.getTarget());return false}else{return Ext.grid.Column.prototype.processEvent.apply(this,arguments)}},onMouseDown:function(c,b){if(c.button===0&&b.className=="x-grid3-row-checker"){c.stopEvent();var d=c.getTarget(".x-grid3-row");if(d){var a=d.rowIndex;if(this.isSelected(a)){this.deselectRow(a)}else{this.selectRow(a,true);this.grid.getView().focusRow(a)}}}},onHdMouseDown:function(c,a){if(a.className=="x-grid3-hd-checker"){c.stopEvent();var b=Ext.fly(a.parentNode);var d=b.hasClass("x-grid3-hd-checker-on");if(d){b.removeClass("x-grid3-hd-checker-on");this.clearSelections()}else{b.addClass("x-grid3-hd-checker-on");this.selectAll()}}},renderer:function(b,c,a){return'<div class="x-grid3-row-checker">&#160;</div>'},onEditorSelect:function(b,a){if(a!=b&&!this.checkOnly){this.selectRow(b)}}});Ext.grid.CellSelectionModel=Ext.extend(Ext.grid.AbstractSelectionModel,{constructor:function(a){Ext.apply(this,a);this.selection=null;this.addEvents("beforecellselect","cellselect","selectionchange");Ext.grid.CellSelectionModel.superclass.constructor.call(this)},initEvents:function(){this.grid.on("cellmousedown",this.handleMouseDown,this);this.grid.on(Ext.EventManager.getKeyEvent(),this.handleKeyDown,this);this.grid.getView().on({scope:this,refresh:this.onViewChange,rowupdated:this.onRowUpdated,beforerowremoved:this.clearSelections,beforerowsinserted:this.clearSelections});if(this.grid.isEditor){this.grid.on("beforeedit",this.beforeEdit,this)}},beforeEdit:function(a){this.select(a.row,a.column,false,true,a.record)},onRowUpdated:function(a,b,c){if(this.selection&&this.selection.record==c){a.onCellSelect(b,this.selection.cell[1])}},onViewChange:function(){this.clearSelections(true)},getSelectedCell:function(){return this.selection?this.selection.cell:null},clearSelections:function(b){var a=this.selection;if(a){if(b!==true){this.grid.view.onCellDeselect(a.cell[0],a.cell[1])}this.selection=null;this.fireEvent("selectionchange",this,null)}},hasSelection:function(){return this.selection?true:false},handleMouseDown:function(b,d,a,c){if(c.button!==0||this.isLocked()){return}this.select(d,a)},select:function(g,c,b,e,d){if(this.fireEvent("beforecellselect",this,g,c)!==false){this.clearSelections();d=d||this.grid.store.getAt(g);this.selection={record:d,cell:[g,c]};if(!b){var a=this.grid.getView();a.onCellSelect(g,c);if(e!==true){a.focusCell(g,c)}}this.fireEvent("cellselect",this,g,c);this.fireEvent("selectionchange",this,this.selection)}},isSelectable:function(c,b,a){return !a.isHidden(b)},onEditorKey:function(b,a){if(a.getKey()==a.TAB){this.handleKeyDown(a)}},handleKeyDown:function(j){if(!j.isNavKeyPress()){return}var d=j.getKey(),i=this.grid,p=this.selection,b=this,m=function(g,c,e){return i.walkCells(g,c,e,i.isEditor&&i.editing?b.acceptsNav:b.isSelectable,b)},o,h,a,l,n;switch(d){case j.ESC:case j.PAGE_UP:case j.PAGE_DOWN:break;default:j.stopEvent();break}if(!p){o=m(0,0,1);if(o){this.select(o[0],o[1])}return}o=p.cell;a=o[0];l=o[1];switch(d){case j.TAB:if(j.shiftKey){h=m(a,l-1,-1)}else{h=m(a,l+1,1)}break;case j.DOWN:h=m(a+1,l,1);break;case j.UP:h=m(a-1,l,-1);break;case j.RIGHT:h=m(a,l+1,1);break;case j.LEFT:h=m(a,l-1,-1);break;case j.ENTER:if(i.isEditor&&!i.editing){i.startEditing(a,l);return}break}if(h){a=h[0];l=h[1];this.select(a,l);if(i.isEditor&&i.editing){n=i.activeEditor;if(n&&n.field.triggerBlur){n.field.triggerBlur()}i.startEditing(a,l)}}},acceptsNav:function(c,b,a){return !a.isHidden(b)&&a.isCellEditable(b,c)}});Ext.grid.EditorGridPanel=Ext.extend(Ext.grid.GridPanel,{clicksToEdit:2,forceValidation:false,isEditor:true,detectEdit:false,autoEncode:false,trackMouseOver:false,initComponent:function(){Ext.grid.EditorGridPanel.superclass.initComponent.call(this);if(!this.selModel){this.selModel=new Ext.grid.CellSelectionModel()}this.activeEditor=null;this.addEvents("beforeedit","afteredit","validateedit")},initEvents:function(){Ext.grid.EditorGridPanel.superclass.initEvents.call(this);this.getGridEl().on("mousewheel",this.stopEditing.createDelegate(this,[true]),this);this.on("columnresize",this.stopEditing,this,[true]);if(this.clicksToEdit==1){this.on("cellclick",this.onCellDblClick,this)}else{var a=this.getView();if(this.clicksToEdit=="auto"&&a.mainBody){a.mainBody.on("mousedown",this.onAutoEditClick,this)}this.on("celldblclick",this.onCellDblClick,this)}},onResize:function(){Ext.grid.EditorGridPanel.superclass.onResize.apply(this,arguments);var a=this.activeEditor;if(this.editing&&a){a.realign(true)}},onCellDblClick:function(b,c,a){this.startEditing(c,a)},onAutoEditClick:function(c,b){if(c.button!==0){return}var g=this.view.findRowIndex(b),a=this.view.findCellIndex(b);if(g!==false&&a!==false){this.stopEditing();if(this.selModel.getSelectedCell){var d=this.selModel.getSelectedCell();if(d&&d[0]===g&&d[1]===a){this.startEditing(g,a)}}else{if(this.selModel.isSelected(g)){this.startEditing(g,a)}}}},onEditComplete:function(b,d,a){this.editing=false;this.lastActiveEditor=this.activeEditor;this.activeEditor=null;var c=b.record,h=this.colModel.getDataIndex(b.col);d=this.postEditValue(d,a,c,h);if(this.forceValidation===true||String(d)!==String(a)){var g={grid:this,record:c,field:h,originalValue:a,value:d,row:b.row,column:b.col,cancel:false};if(this.fireEvent("validateedit",g)!==false&&!g.cancel&&String(d)!==String(a)){c.set(h,g.value);delete g.cancel;this.fireEvent("afteredit",g)}}this.view.focusCell(b.row,b.col)},startEditing:function(i,c){this.stopEditing();if(this.colModel.isCellEditable(c,i)){this.view.ensureVisible(i,c,true);var d=this.store.getAt(i),h=this.colModel.getDataIndex(c),g={grid:this,record:d,field:h,value:d.data[h],row:i,column:c,cancel:false};if(this.fireEvent("beforeedit",g)!==false&&!g.cancel){this.editing=true;var b=this.colModel.getCellEditor(c,i);if(!b){return}if(!b.rendered){b.parentEl=this.view.getEditorParent(b);b.on({scope:this,render:{fn:function(e){e.field.focus(false,true)},single:true,scope:this},specialkey:function(k,j){this.getSelectionModel().onEditorKey(k,j)},complete:this.onEditComplete,canceledit:this.stopEditing.createDelegate(this,[true])})}Ext.apply(b,{row:i,col:c,record:d});this.lastEdit={row:i,col:c};this.activeEditor=b;b.selectSameEditor=(this.activeEditor==this.lastActiveEditor);var a=this.preEditValue(d,h);b.startEdit(this.view.getCell(i,c).firstChild,Ext.isDefined(a)?a:"");(function(){delete b.selectSameEditor}).defer(50)}}},preEditValue:function(a,c){var b=a.data[c];return this.autoEncode&&Ext.isString(b)?Ext.util.Format.htmlDecode(b):b},postEditValue:function(c,a,b,d){return this.autoEncode&&Ext.isString(c)?Ext.util.Format.htmlEncode(c):c},stopEditing:function(b){if(this.editing){var a=this.lastActiveEditor=this.activeEditor;if(a){a[b===true?"cancelEdit":"completeEdit"]();this.view.focusCell(a.row,a.col)}this.activeEditor=null}this.editing=false}});Ext.reg("editorgrid",Ext.grid.EditorGridPanel);Ext.grid.GridEditor=function(b,a){Ext.grid.GridEditor.superclass.constructor.call(this,b,a);b.monitorTab=false};Ext.extend(Ext.grid.GridEditor,Ext.Editor,{alignment:"tl-tl",autoSize:"width",hideEl:false,cls:"x-small-editor x-grid-editor",shim:false,shadow:false});Ext.grid.PropertyRecord=Ext.data.Record.create([{name:"name",type:"string"},"value"]);Ext.grid.PropertyStore=Ext.extend(Ext.util.Observable,{constructor:function(a,b){this.grid=a;this.store=new Ext.data.Store({recordType:Ext.grid.PropertyRecord});this.store.on("update",this.onUpdate,this);if(b){this.setSource(b)}Ext.grid.PropertyStore.superclass.constructor.call(this)},setSource:function(c){this.source=c;this.store.removeAll();var b=[];for(var a in c){if(this.isEditableValue(c[a])){b.push(new Ext.grid.PropertyRecord({name:a,value:c[a]},a))}}this.store.loadRecords({records:b},{},true)},onUpdate:function(e,a,d){if(d==Ext.data.Record.EDIT){var b=a.data.value;var c=a.modified.value;if(this.grid.fireEvent("beforepropertychange",this.source,a.id,b,c)!==false){this.source[a.id]=b;a.commit();this.grid.fireEvent("propertychange",this.source,a.id,b,c)}else{a.reject()}}},getProperty:function(a){return this.store.getAt(a)},isEditableValue:function(a){return Ext.isPrimitive(a)||Ext.isDate(a)},setValue:function(d,c,a){var b=this.getRec(d);if(b){b.set("value",c);this.source[d]=c}else{if(a){this.source[d]=c;b=new Ext.grid.PropertyRecord({name:d,value:c},d);this.store.add(b)}}},remove:function(b){var a=this.getRec(b);if(a){this.store.remove(a);delete this.source[b]}},getRec:function(a){return this.store.getById(a)},getSource:function(){return this.source}});Ext.grid.PropertyColumnModel=Ext.extend(Ext.grid.ColumnModel,{nameText:"Name",valueText:"Value",dateFormat:"m/j/Y",trueText:"true",falseText:"false",constructor:function(c,b){var d=Ext.grid,e=Ext.form;this.grid=c;d.PropertyColumnModel.superclass.constructor.call(this,[{header:this.nameText,width:50,sortable:true,dataIndex:"name",id:"name",menuDisabled:true},{header:this.valueText,width:50,resizable:false,dataIndex:"value",id:"value",menuDisabled:true}]);this.store=b;var a=new e.Field({autoCreate:{tag:"select",children:[{tag:"option",value:"true",html:this.trueText},{tag:"option",value:"false",html:this.falseText}]},getValue:function(){return this.el.dom.value=="true"}});this.editors={date:new d.GridEditor(new e.DateField({selectOnFocus:true})),string:new d.GridEditor(new e.TextField({selectOnFocus:true})),number:new d.GridEditor(new e.NumberField({selectOnFocus:true,style:"text-align:left;"})),"boolean":new d.GridEditor(a,{autoSize:"both"})};this.renderCellDelegate=this.renderCell.createDelegate(this);this.renderPropDelegate=this.renderProp.createDelegate(this)},renderDate:function(a){return a.dateFormat(this.dateFormat)},renderBool:function(a){return this[a?"trueText":"falseText"]},isCellEditable:function(a,b){return a==1},getRenderer:function(a){return a==1?this.renderCellDelegate:this.renderPropDelegate},renderProp:function(a){return this.getPropertyName(a)},renderCell:function(d,b,c){var a=this.grid.customRenderers[c.get("name")];if(a){return a.apply(this,arguments)}var e=d;if(Ext.isDate(d)){e=this.renderDate(d)}else{if(typeof d=="boolean"){e=this.renderBool(d)}}return Ext.util.Format.htmlEncode(e)},getPropertyName:function(b){var a=this.grid.propertyNames;return a&&a[b]?a[b]:b},getCellEditor:function(a,e){var b=this.store.getProperty(e),d=b.data.name,c=b.data.value;if(this.grid.customEditors[d]){return this.grid.customEditors[d]}if(Ext.isDate(c)){return this.editors.date}else{if(typeof c=="number"){return this.editors.number}else{if(typeof c=="boolean"){return this.editors["boolean"]}else{return this.editors.string}}}},destroy:function(){Ext.grid.PropertyColumnModel.superclass.destroy.call(this);this.destroyEditors(this.editors);this.destroyEditors(this.grid.customEditors)},destroyEditors:function(b){for(var a in b){Ext.destroy(b[a])}}});Ext.grid.PropertyGrid=Ext.extend(Ext.grid.EditorGridPanel,{enableColumnMove:false,stripeRows:false,trackMouseOver:false,clicksToEdit:1,enableHdMenu:false,viewConfig:{forceFit:true},initComponent:function(){this.customRenderers=this.customRenderers||{};this.customEditors=this.customEditors||{};this.lastEditRow=null;var b=new Ext.grid.PropertyStore(this);this.propStore=b;var a=new Ext.grid.PropertyColumnModel(this,b);b.store.sort("name","ASC");this.addEvents("beforepropertychange","propertychange");this.cm=a;this.ds=b.store;Ext.grid.PropertyGrid.superclass.initComponent.call(this);this.mon(this.selModel,"beforecellselect",function(e,d,c){if(c===0){this.startEditing.defer(200,this,[d,1]);return false}},this)},onRender:function(){Ext.grid.PropertyGrid.superclass.onRender.apply(this,arguments);this.getGridEl().addClass("x-props-grid")},afterRender:function(){Ext.grid.PropertyGrid.superclass.afterRender.apply(this,arguments);if(this.source){this.setSource(this.source)}},setSource:function(a){this.propStore.setSource(a)},getSource:function(){return this.propStore.getSource()},setProperty:function(c,b,a){this.propStore.setValue(c,b,a)},removeProperty:function(a){this.propStore.remove(a)}});Ext.reg("propertygrid",Ext.grid.PropertyGrid);Ext.grid.GroupingView=Ext.extend(Ext.grid.GridView,{groupByText:"Group By This Field",showGroupsText:"Show in Groups",hideGroupedColumn:false,showGroupName:true,startCollapsed:false,enableGrouping:true,enableGroupingMenu:true,enableNoGroups:true,emptyGroupText:"(None)",ignoreAdd:false,groupTextTpl:"{text}",groupMode:"value",cancelEditOnToggle:true,initTemplates:function(){Ext.grid.GroupingView.superclass.initTemplates.call(this);this.state={};var a=this.grid.getSelectionModel();a.on(a.selectRow?"beforerowselect":"beforecellselect",this.onBeforeRowSelect,this);if(!this.startGroup){this.startGroup=new Ext.XTemplate('<div id="{groupId}" class="x-grid-group {cls}">','<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">',this.groupTextTpl,"</div></div>",'<div id="{groupId}-bd" class="x-grid-group-body">')}this.startGroup.compile();if(!this.endGroup){this.endGroup="</div></div>"}},findGroup:function(a){return Ext.fly(a).up(".x-grid-group",this.mainBody.dom)},getGroups:function(){return this.hasRows()?this.mainBody.dom.childNodes:[]},onAdd:function(d,a,b){if(this.canGroup()&&!this.ignoreAdd){var c=this.getScrollState();this.fireEvent("beforerowsinserted",d,b,b+(a.length-1));this.refresh();this.restoreScroll(c);this.fireEvent("rowsinserted",d,b,b+(a.length-1))}else{if(!this.canGroup()){Ext.grid.GroupingView.superclass.onAdd.apply(this,arguments)}}},onRemove:function(e,a,b,d){Ext.grid.GroupingView.superclass.onRemove.apply(this,arguments);var c=document.getElementById(a._groupId);if(c&&c.childNodes[1].childNodes.length<1){Ext.removeNode(c)}this.applyEmptyText()},refreshRow:function(a){if(this.ds.getCount()==1){this.refresh()}else{this.isUpdating=true;Ext.grid.GroupingView.superclass.refreshRow.apply(this,arguments);this.isUpdating=false}},beforeMenuShow:function(){var c,a=this.hmenu.items,b=this.cm.config[this.hdCtxIndex].groupable===false;if((c=a.get("groupBy"))){c.setDisabled(b)}if((c=a.get("showGroups"))){c.setDisabled(b);c.setChecked(this.canGroup(),true)}},renderUI:function(){var a=Ext.grid.GroupingView.superclass.renderUI.call(this);if(this.enableGroupingMenu&&this.hmenu){this.hmenu.add("-",{itemId:"groupBy",text:this.groupByText,handler:this.onGroupByClick,scope:this,iconCls:"x-group-by-icon"});if(this.enableNoGroups){this.hmenu.add({itemId:"showGroups",text:this.showGroupsText,checked:true,checkHandler:this.onShowGroupsClick,scope:this})}this.hmenu.on("beforeshow",this.beforeMenuShow,this)}return a},processEvent:function(b,i){Ext.grid.GroupingView.superclass.processEvent.call(this,b,i);var h=i.getTarget(".x-grid-group-hd",this.mainBody);if(h){var g=this.getGroupField(),d=this.getPrefix(g),a=h.id.substring(d.length),c=new RegExp("gp-"+Ext.escapeRe(g)+"--hd");a=a.substr(0,a.length-3);if(a||c.test(h.id)){this.grid.fireEvent("group"+b,this.grid,g,a,i)}if(b=="mousedown"&&i.button==0){this.toggleGroup(h.parentNode)}}},onGroupByClick:function(){var a=this.grid;this.enableGrouping=true;a.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));a.fireEvent("groupchange",a,a.store.getGroupState());this.beforeMenuShow();this.refresh()},onShowGroupsClick:function(a,b){this.enableGrouping=b;if(b){this.onGroupByClick()}else{this.grid.store.clearGrouping();this.grid.fireEvent("groupchange",this,null)}},toggleRowIndex:function(c,a){if(!this.canGroup()){return}var b=this.getRow(c);if(b){this.toggleGroup(this.findGroup(b),a)}},toggleGroup:function(c,b){var a=Ext.get(c),d=Ext.util.Format.htmlEncode(a.id);b=Ext.isDefined(b)?b:a.hasClass("x-grid-group-collapsed");if(this.state[d]!==b){if(this.cancelEditOnToggle!==false){this.grid.stopEditing(true)}this.state[d]=b;a[b?"removeClass":"addClass"]("x-grid-group-collapsed")}},toggleAllGroups:function(c){var b=this.getGroups();for(var d=0,a=b.length;d<a;d++){this.toggleGroup(b[d],c)}},expandAllGroups:function(){this.toggleAllGroups(true)},collapseAllGroups:function(){this.toggleAllGroups(false)},getGroup:function(a,e,i,j,b,h){var c=this.cm.config[b],d=i?i.call(c.scope,a,{},e,j,b,h):String(a);if(d===""||d==="&#160;"){d=c.emptyGroupText||this.emptyGroupText}return d},getGroupField:function(){return this.grid.store.getGroupState()},afterRender:function(){if(!this.ds||!this.cm){return}Ext.grid.GroupingView.superclass.afterRender.call(this);if(this.grid.deferRowRender){this.updateGroupWidths()}},afterRenderUI:function(){Ext.grid.GroupingView.superclass.afterRenderUI.call(this);if(this.enableGroupingMenu&&this.hmenu){this.hmenu.add("-",{itemId:"groupBy",text:this.groupByText,handler:this.onGroupByClick,scope:this,iconCls:"x-group-by-icon"});if(this.enableNoGroups){this.hmenu.add({itemId:"showGroups",text:this.showGroupsText,checked:true,checkHandler:this.onShowGroupsClick,scope:this})}this.hmenu.on("beforeshow",this.beforeMenuShow,this)}},renderRows:function(){var a=this.getGroupField();var e=!!a;if(this.hideGroupedColumn){var b=this.cm.findColumnIndex(a),d=Ext.isDefined(this.lastGroupField);if(!e&&d){this.mainBody.update("");this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField),false);delete this.lastGroupField}else{if(e&&!d){this.lastGroupField=a;this.cm.setHidden(b,true)}else{if(e&&d&&a!==this.lastGroupField){this.mainBody.update("");var c=this.cm.findColumnIndex(this.lastGroupField);this.cm.setHidden(c,false);this.lastGroupField=a;this.cm.setHidden(b,true)}}}}return Ext.grid.GroupingView.superclass.renderRows.apply(this,arguments)},doRender:function(c,h,q,a,p,s){if(h.length<1){return""}if(!this.canGroup()||this.isUpdating){return Ext.grid.GroupingView.superclass.doRender.apply(this,arguments)}var z=this.getGroupField(),o=this.cm.findColumnIndex(z),w,j="width:"+this.getTotalWidth()+";",e=this.cm.config[o],b=e.groupRenderer||e.renderer,t=this.showGroupName?(e.groupName||e.header)+": ":"",y=[],l,u,v,n;for(u=0,v=h.length;u<v;u++){var k=a+u,m=h[u],d=m.data[z];w=this.getGroup(d,m,b,k,o,q);if(!l||l.group!=w){n=this.constructId(d,z,o);this.state[n]=!(Ext.isDefined(this.state[n])?!this.state[n]:this.startCollapsed);l={group:w,gvalue:d,text:t+w,groupId:n,startRow:k,rs:[m],cls:this.state[n]?"":"x-grid-group-collapsed",style:j};y.push(l)}else{l.rs.push(m)}m._groupId=n}var x=[];for(u=0,v=y.length;u<v;u++){w=y[u];this.doGroupStart(x,w,c,q,p);x[x.length]=Ext.grid.GroupingView.superclass.doRender.call(this,c,w.rs,q,w.startRow,p,s);this.doGroupEnd(x,w,c,q,p)}return x.join("")},getGroupId:function(a){var b=this.getGroupField();return this.constructId(a,b,this.cm.findColumnIndex(b))},constructId:function(c,e,a){var b=this.cm.config[a],d=b.groupRenderer||b.renderer,g=(this.groupMode=="value")?c:this.getGroup(c,{data:{}},d,0,a,this.ds);return this.getPrefix(e)+Ext.util.Format.htmlEncode(g)},canGroup:function(){return this.enableGrouping&&!!this.getGroupField()},getPrefix:function(a){return this.grid.getGridEl().id+"-gp-"+a+"-"},doGroupStart:function(a,d,b,e,c){a[a.length]=this.startGroup.apply(d)},doGroupEnd:function(a,d,b,e,c){a[a.length]=this.endGroup},getRows:function(){if(!this.canGroup()){return Ext.grid.GroupingView.superclass.getRows.call(this)}var k=[],c=this.getGroups(),h,e=0,a=c.length,d,b;for(;e<a;++e){h=c[e].childNodes[1];if(h){h=h.childNodes;for(d=0,b=h.length;d<b;++d){k[k.length]=h[d]}}}return k},updateGroupWidths:function(){if(!this.canGroup()||!this.hasRows()){return}var c=Math.max(this.cm.getTotalWidth(),this.el.dom.offsetWidth-this.getScrollOffset())+"px";var b=this.getGroups();for(var d=0,a=b.length;d<a;d++){b[d].firstChild.style.width=c}},onColumnWidthUpdated:function(c,a,b){Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this,c,a,b);this.updateGroupWidths()},onAllColumnWidthsUpdated:function(a,b){Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this,a,b);this.updateGroupWidths()},onColumnHiddenUpdated:function(b,c,a){Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this,b,c,a);this.updateGroupWidths()},onLayout:function(){this.updateGroupWidths()},onBeforeRowSelect:function(b,a){this.toggleRowIndex(a,true)}});Ext.grid.GroupingView.GROUP_ID=1000;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns("Ext.grid","Ext.list","Ext.dd","Ext.tree","Ext.form","Ext.menu","Ext.state","Ext.layout.boxOverflow","Ext.app","Ext.ux","Ext.chart","Ext.direct","Ext.slider");Ext.apply(Ext,function(){var c=Ext,a=0,b=null;return{emptyFn:function(){},BLANK_IMAGE_URL:Ext.isIE6||Ext.isIE7||Ext.isAir?"http://www.extjs.com/s.gif":"data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==",extendX:function(d,e){return Ext.extend(d,e(d.prototype))},getDoc:function(){return Ext.get(document)},num:function(e,d){e=Number(Ext.isEmpty(e)||Ext.isArray(e)||typeof e=="boolean"||(typeof e=="string"&&e.trim().length==0)?NaN:e);return isNaN(e)?d:e},value:function(f,d,e){return Ext.isEmpty(f,e)?d:f},escapeRe:function(d){return d.replace(/([-.*+?^${}()|[\]\/\\])/g,"\\$1")},sequence:function(g,d,f,e){g[d]=g[d].createSequence(f,e)},addBehaviors:function(h){if(!Ext.isReady){Ext.onReady(function(){Ext.addBehaviors(h)})}else{var e={},g,d,f;for(d in h){if((g=d.split("@"))[1]){f=g[0];if(!e[f]){e[f]=Ext.select(f)}e[f].on(g[1],h[d])}}e=null}},getScrollBarWidth:function(f){if(!Ext.isReady){return 0}if(f===true||b===null){var h=Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),g=h.child("div",true);var e=g.offsetWidth;h.setStyle("overflow",(Ext.isWebKit||Ext.isGecko)?"auto":"scroll");var d=g.offsetWidth;h.remove();b=e-d+2}return b},combine:function(){var f=arguments,e=f.length,h=[];for(var g=0;g<e;g++){var d=f[g];if(Ext.isArray(d)){h=h.concat(d)}else{if(d.length!==undefined&&!d.substr){h=h.concat(Array.prototype.slice.call(d,0))}else{h.push(d)}}}return h},copyTo:function(d,e,f){if(typeof f=="string"){f=f.split(/[,;\s]/)}Ext.each(f,function(g){if(e.hasOwnProperty(g)){d[g]=e[g]}},this);return d},destroy:function(){Ext.each(arguments,function(d){if(d){if(Ext.isArray(d)){this.destroy.apply(this,d)}else{if(typeof d.destroy=="function"){d.destroy()}else{if(d.dom){d.remove()}}}}},this)},destroyMembers:function(k,h,f,g){for(var j=1,e=arguments,d=e.length;j<d;j++){Ext.destroy(k[e[j]]);delete k[e[j]]}},clean:function(d){var e=[];Ext.each(d,function(f){if(!!f){e.push(f)}});return e},unique:function(d){var e=[],f={};Ext.each(d,function(g){if(!f[g]){e.push(g)}f[g]=true});return e},flatten:function(d){var f=[];function e(g){Ext.each(g,function(h){if(Ext.isArray(h)){e(h)}else{f.push(h)}});return f}return e(d)},min:function(d,e){var f=d[0];e=e||function(h,g){return h<g?-1:1};Ext.each(d,function(g){f=e(f,g)==-1?f:g});return f},max:function(d,e){var f=d[0];e=e||function(h,g){return h>g?1:-1};Ext.each(d,function(g){f=e(f,g)==1?f:g});return f},mean:function(d){return d.length>0?Ext.sum(d)/d.length:undefined},sum:function(d){var e=0;Ext.each(d,function(f){e+=f});return e},partition:function(d,e){var f=[[],[]];Ext.each(d,function(h,j,g){f[(e&&e(h,j,g))||(!e&&h)?0:1].push(h)});return f},invoke:function(d,e){var g=[],f=Array.prototype.slice.call(arguments,2);Ext.each(d,function(h,j){if(h&&typeof h[e]=="function"){g.push(h[e].apply(h,f))}else{g.push(undefined)}});return g},pluck:function(d,f){var e=[];Ext.each(d,function(g){e.push(g[f])});return e},zip:function(){var m=Ext.partition(arguments,function(i){return typeof i!="function"}),h=m[0],l=m[1][0],d=Ext.max(Ext.pluck(h,"length")),g=[];for(var k=0;k<d;k++){g[k]=[];if(l){g[k]=l.apply(l,Ext.pluck(h,k))}else{for(var f=0,e=h.length;f<e;f++){g[k].push(h[f][k])}}}return g},getCmp:function(d){return Ext.ComponentMgr.get(d)},useShims:c.isIE6||(c.isMac&&c.isGecko2),type:function(e){if(e===undefined||e===null){return false}if(e.htmlElement){return"element"}var d=typeof e;if(d=="object"&&e.nodeName){switch(e.nodeType){case 1:return"element";case 3:return(/\S/).test(e.nodeValue)?"textnode":"whitespace"}}if(d=="object"||d=="function"){switch(e.constructor){case Array:return"array";case RegExp:return"regexp";case Date:return"date"}if(typeof e.length=="number"&&typeof e.item=="function"){return"nodelist"}}return d},intercept:function(g,d,f,e){g[d]=g[d].createInterceptor(f,e)},callback:function(d,g,f,e){if(typeof d=="function"){if(e){d.defer(e,g,f||[])}else{d.apply(g,f||[])}}}}}());Ext.apply(Function.prototype,{createSequence:function(b,a){var c=this;return(typeof b!="function")?this:function(){var d=c.apply(this||window,arguments);b.apply(a||this||window,arguments);return d}}});Ext.applyIf(String,{escape:function(a){return a.replace(/('|\\)/g,"\\$1")},leftPad:function(d,b,c){var a=String(d);if(!c){c=" "}while(a.length<b){a=c+a}return a}});String.prototype.toggle=function(b,a){return this==b?a:b};String.prototype.trim=function(){var a=/^\s+|\s+$/g;return function(){return this.replace(a,"")}}();Date.prototype.getElapsed=function(a){return Math.abs((a||new Date()).getTime()-this.getTime())};Ext.applyIf(Number.prototype,{constrain:function(b,a){return Math.min(Math.max(this,b),a)}});Ext.lib.Dom.getRegion=function(a){return Ext.lib.Region.getRegion(a)};Ext.lib.Region=function(d,f,a,c){var e=this;e.top=d;e[1]=d;e.right=f;e.bottom=a;e.left=c;e[0]=c};Ext.lib.Region.prototype={contains:function(b){var a=this;return(b.left>=a.left&&b.right<=a.right&&b.top>=a.top&&b.bottom<=a.bottom)},getArea:function(){var a=this;return((a.bottom-a.top)*(a.right-a.left))},intersect:function(g){var f=this,d=Math.max(f.top,g.top),e=Math.min(f.right,g.right),a=Math.min(f.bottom,g.bottom),c=Math.max(f.left,g.left);if(a>=d&&e>=c){return new Ext.lib.Region(d,e,a,c)}},union:function(g){var f=this,d=Math.min(f.top,g.top),e=Math.max(f.right,g.right),a=Math.max(f.bottom,g.bottom),c=Math.min(f.left,g.left);return new Ext.lib.Region(d,e,a,c)},constrainTo:function(b){var a=this;a.top=a.top.constrain(b.top,b.bottom);a.bottom=a.bottom.constrain(b.top,b.bottom);a.left=a.left.constrain(b.left,b.right);a.right=a.right.constrain(b.left,b.right);return a},adjust:function(d,c,a,f){var e=this;e.top+=d;e.left+=c;e.right+=f;e.bottom+=a;return e}};Ext.lib.Region.getRegion=function(e){var g=Ext.lib.Dom.getXY(e),d=g[1],f=g[0]+e.offsetWidth,a=g[1]+e.offsetHeight,c=g[0];return new Ext.lib.Region(d,f,a,c)};Ext.lib.Point=function(a,c){if(Ext.isArray(a)){c=a[1];a=a[0]}var b=this;b.x=b.right=b.left=b[0]=a;b.y=b.top=b.bottom=b[1]=c};Ext.lib.Point.prototype=new Ext.lib.Region();Ext.apply(Ext.DomHelper,function(){var e,a="afterbegin",g="afterend",h="beforebegin",d="beforeend",b=/tag|children|cn|html$/i;function f(l,n,m,p,k,i){l=Ext.getDom(l);var j;if(e.useDom){j=c(n,null);if(i){l.appendChild(j)}else{(k=="firstChild"?l:l.parentNode).insertBefore(j,l[k]||l)}}else{j=Ext.DomHelper.insertHtml(p,l,Ext.DomHelper.createHtml(n))}return m?Ext.get(j,true):j}function c(j,r){var k,u=document,p,s,m,t;if(Ext.isArray(j)){k=u.createDocumentFragment();for(var q=0,n=j.length;q<n;q++){c(j[q],k)}}else{if(typeof j=="string"){k=u.createTextNode(j)}else{k=u.createElement(j.tag||"div");p=!!k.setAttribute;for(var s in j){if(!b.test(s)){m=j[s];if(s=="cls"){k.className=m}else{if(p){k.setAttribute(s,m)}else{k[s]=m}}}}Ext.DomHelper.applyStyles(k,j.style);if((t=j.children||j.cn)){c(t,k)}else{if(j.html){k.innerHTML=j.html}}}}if(r){r.appendChild(k)}return k}e={createTemplate:function(j){var i=Ext.DomHelper.createHtml(j);return new Ext.Template(i)},useDom:false,insertBefore:function(i,k,j){return f(i,k,j,h)},insertAfter:function(i,k,j){return f(i,k,j,g,"nextSibling")},insertFirst:function(i,k,j){return f(i,k,j,a,"firstChild")},append:function(i,k,j){return f(i,k,j,d,"",true)},createDom:c};return e}());Ext.apply(Ext.Template.prototype,{disableFormats:false,re:/\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,argsRe:/^\s*['"](.*)["']\s*$/,compileARe:/\\/g,compileBRe:/(\r\n|\n)/g,compileCRe:/'/g,applyTemplate:function(b){var f=this,a=f.disableFormats!==true,e=Ext.util.Format,c=f;if(f.compiled){return f.compiled(b)}function d(h,k,o,j){if(o&&a){if(o.substr(0,5)=="this."){return c.call(o.substr(5),b[k],b)}else{if(j){var n=f.argsRe;j=j.split(",");for(var l=0,g=j.length;l<g;l++){j[l]=j[l].replace(n,"$1")}j=[b[k]].concat(j)}else{j=[b[k]]}return e[o].apply(e,j)}}else{return b[k]!==undefined?b[k]:""}}return f.html.replace(f.re,d)},compile:function(){var me=this,fm=Ext.util.Format,useF=me.disableFormats!==true,sep=Ext.isGecko?"+":",",body;function fn(m,name,format,args){if(format&&useF){args=args?","+args:"";if(format.substr(0,5)!="this."){format="fm."+format+"("}else{format='this.call("'+format.substr(5)+'", ';args=", values"}}else{args="";format="(values['"+name+"'] == undefined ? '' : "}return"'"+sep+format+"values['"+name+"']"+args+")"+sep+"'"}if(Ext.isGecko){body="this.compiled = function(values){ return '"+me.html.replace(me.compileARe,"\\\\").replace(me.compileBRe,"\\n").replace(me.compileCRe,"\\'").replace(me.re,fn)+"';};"}else{body=["this.compiled = function(values){ return ['"];body.push(me.html.replace(me.compileARe,"\\\\").replace(me.compileBRe,"\\n").replace(me.compileCRe,"\\'").replace(me.re,fn));body.push("'].join('');};");body=body.join("")}eval(body);return me},call:function(c,b,a){return this[c](b,a)}});Ext.Template.prototype.apply=Ext.Template.prototype.applyTemplate;Ext.util.Functions={createInterceptor:function(c,b,a){var d=c;if(!Ext.isFunction(b)){return c}else{return function(){var f=this,e=arguments;b.target=f;b.method=c;return(b.apply(a||f||window,e)!==false)?c.apply(f||window,e):null}}},createDelegate:function(c,d,b,a){if(!Ext.isFunction(c)){return c}return function(){var f=b||arguments;if(a===true){f=Array.prototype.slice.call(arguments,0);f=f.concat(b)}else{if(Ext.isNumber(a)){f=Array.prototype.slice.call(arguments,0);var e=[a,0].concat(b);Array.prototype.splice.apply(f,e)}}return c.apply(d||window,f)}},defer:function(d,c,e,b,a){d=Ext.util.Functions.createDelegate(d,e,b,a);if(c>0){return setTimeout(d,c)}d();return 0},createSequence:function(c,b,a){if(!Ext.isFunction(b)){return c}else{return function(){var d=c.apply(this||window,arguments);b.apply(a||this||window,arguments);return d}}}};Ext.defer=Ext.util.Functions.defer;Ext.createInterceptor=Ext.util.Functions.createInterceptor;Ext.createSequence=Ext.util.Functions.createSequence;Ext.createDelegate=Ext.util.Functions.createDelegate;Ext.apply(Ext.util.Observable.prototype,function(){function a(i){var h=(this.methodEvents=this.methodEvents||{})[i],d,c,f,g=this;if(!h){this.methodEvents[i]=h={};h.originalFn=this[i];h.methodName=i;h.before=[];h.after=[];var b=function(k,j,e){if((c=k.apply(j||g,e))!==undefined){if(typeof c=="object"){if(c.returnValue!==undefined){d=c.returnValue}else{d=c}f=!!c.cancel}else{if(c===false){f=true}else{d=c}}}};this[i]=function(){var k=Array.prototype.slice.call(arguments,0),j;d=c=undefined;f=false;for(var l=0,e=h.before.length;l<e;l++){j=h.before[l];b(j.fn,j.scope,k);if(f){return d}}if((c=h.originalFn.apply(g,k))!==undefined){d=c}for(var l=0,e=h.after.length;l<e;l++){j=h.after[l];b(j.fn,j.scope,k);if(f){return d}}return d}}return h}return{beforeMethod:function(d,c,b){a.call(this,d).before.push({fn:c,scope:b})},afterMethod:function(d,c,b){a.call(this,d).after.push({fn:c,scope:b})},removeMethodListener:function(h,f,d){var g=this.getMethodEvent(h);for(var c=0,b=g.before.length;c<b;c++){if(g.before[c].fn==f&&g.before[c].scope==d){g.before.splice(c,1);return}}for(var c=0,b=g.after.length;c<b;c++){if(g.after[c].fn==f&&g.after[c].scope==d){g.after.splice(c,1);return}}},relayEvents:function(h,e){var g=this;function f(i){return function(){return g.fireEvent.apply(g,[i].concat(Array.prototype.slice.call(arguments,0)))}}for(var d=0,b=e.length;d<b;d++){var c=e[d];g.events[c]=g.events[c]||true;h.on(c,f(c),g)}},enableBubble:function(e){var f=this;if(!Ext.isEmpty(e)){e=Ext.isArray(e)?e:Array.prototype.slice.call(arguments,0);for(var d=0,b=e.length;d<b;d++){var c=e[d];c=c.toLowerCase();var g=f.events[c]||true;if(typeof g=="boolean"){g=new Ext.util.Event(f,c);f.events[c]=g}g.bubble=true}}}}}());Ext.util.Observable.capture=function(c,b,a){c.fireEvent=c.fireEvent.createInterceptor(b,a)};Ext.util.Observable.observeClass=function(b,a){if(b){if(!b.fireEvent){Ext.apply(b,new Ext.util.Observable());Ext.util.Observable.capture(b.prototype,b.fireEvent,b)}if(typeof a=="object"){b.on(a)}return b}};Ext.apply(Ext.EventManager,function(){var d,j,f,b,a=Ext.lib.Dom,i=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,c=Ext.EventManager._unload,h=0,g=0,e=Ext.isWebKit?Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1])>=525:!((Ext.isGecko&&!Ext.isWindows)||Ext.isOpera);return{_unload:function(){Ext.EventManager.un(window,"resize",this.fireWindowResize,this);c.call(Ext.EventManager)},doResizeEvent:function(){var l=a.getViewHeight(),k=a.getViewWidth();if(g!=l||h!=k){d.fire(h=k,g=l)}},onWindowResize:function(m,l,k){if(!d){d=new Ext.util.Event();j=new Ext.util.DelayedTask(this.doResizeEvent);Ext.EventManager.on(window,"resize",this.fireWindowResize,this)}d.addListener(m,l,k)},fireWindowResize:function(){if(d){j.delay(100)}},onTextResize:function(n,m,k){if(!f){f=new Ext.util.Event();var l=new Ext.Element(document.createElement("div"));l.dom.className="x-text-resize";l.dom.innerHTML="X";l.appendTo(document.body);b=l.dom.offsetHeight;setInterval(function(){if(l.dom.offsetHeight!=b){f.fire(b,b=l.dom.offsetHeight)}},this.textResizeInterval)}f.addListener(n,m,k)},removeResizeListener:function(l,k){if(d){d.removeListener(l,k)}},fireResize:function(){if(d){d.fire(a.getViewWidth(),a.getViewHeight())}},textResizeInterval:50,ieDeferSrc:false,getKeyEvent:function(){return e?"keydown":"keypress"},useKeydown:e}}());Ext.EventManager.on=Ext.EventManager.addListener;Ext.apply(Ext.EventObjectImpl.prototype,{BACKSPACE:8,TAB:9,NUM_CENTER:12,ENTER:13,RETURN:13,SHIFT:16,CTRL:17,CONTROL:17,ALT:18,PAUSE:19,CAPS_LOCK:20,ESC:27,SPACE:32,PAGE_UP:33,PAGEUP:33,PAGE_DOWN:34,PAGEDOWN:34,END:35,HOME:36,LEFT:37,UP:38,RIGHT:39,DOWN:40,PRINT_SCREEN:44,INSERT:45,DELETE:46,ZERO:48,ONE:49,TWO:50,THREE:51,FOUR:52,FIVE:53,SIX:54,SEVEN:55,EIGHT:56,NINE:57,A:65,B:66,C:67,D:68,E:69,F:70,G:71,H:72,I:73,J:74,K:75,L:76,M:77,N:78,O:79,P:80,Q:81,R:82,S:83,T:84,U:85,V:86,W:87,X:88,Y:89,Z:90,CONTEXT_MENU:93,NUM_ZERO:96,NUM_ONE:97,NUM_TWO:98,NUM_THREE:99,NUM_FOUR:100,NUM_FIVE:101,NUM_SIX:102,NUM_SEVEN:103,NUM_EIGHT:104,NUM_NINE:105,NUM_MULTIPLY:106,NUM_PLUS:107,NUM_MINUS:109,NUM_PERIOD:110,NUM_DIVISION:111,F1:112,F2:113,F3:114,F4:115,F5:116,F6:117,F7:118,F8:119,F9:120,F10:121,F11:122,F12:123,isNavKeyPress:function(){var b=this,a=this.normalizeKey(b.keyCode);return(a>=33&&a<=40)||a==b.RETURN||a==b.TAB||a==b.ESC},isSpecialKey:function(){var a=this.normalizeKey(this.keyCode);return(this.type=="keypress"&&this.ctrlKey)||this.isNavKeyPress()||(a==this.BACKSPACE)||(a>=16&&a<=20)||(a>=44&&a<=46)},getPoint:function(){return new Ext.lib.Point(this.xy[0],this.xy[1])},hasModifier:function(){return((this.ctrlKey||this.altKey)||this.shiftKey)}});Ext.Element.addMethods({swallowEvent:function(a,b){var d=this;function c(f){f.stopPropagation();if(b){f.preventDefault()}}if(Ext.isArray(a)){Ext.each(a,function(f){d.on(f,c)});return d}d.on(a,c);return d},relayEvent:function(a,b){this.on(a,function(c){b.fireEvent(a,c)})},clean:function(b){var d=this,e=d.dom,f=e.firstChild,c=-1;if(Ext.Element.data(e,"isCleaned")&&b!==true){return d}while(f){var a=f.nextSibling;if(f.nodeType==3&&!(/\S/.test(f.nodeValue))){e.removeChild(f)}else{f.nodeIndex=++c}f=a}Ext.Element.data(e,"isCleaned",true);return d},load:function(){var a=this.getUpdater();a.update.apply(a,arguments);return this},getUpdater:function(){return this.updateManager||(this.updateManager=new Ext.Updater(this))},update:function(html,loadScripts,callback){if(!this.dom){return this}html=html||"";if(loadScripts!==true){this.dom.innerHTML=html;if(typeof callback=="function"){callback()}return this}var id=Ext.id(),dom=this.dom;html+='<span id="'+id+'"></span>';Ext.lib.Event.onAvailable(id,function(){var DOC=document,hd=DOC.getElementsByTagName("head")[0],re=/(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,srcRe=/\ssrc=([\'\"])(.*?)\1/i,typeRe=/\stype=([\'\"])(.*?)\1/i,match,attrs,srcMatch,typeMatch,el,s;while((match=re.exec(html))){attrs=match[1];srcMatch=attrs?attrs.match(srcRe):false;if(srcMatch&&srcMatch[2]){s=DOC.createElement("script");s.src=srcMatch[2];typeMatch=attrs.match(typeRe);if(typeMatch&&typeMatch[2]){s.type=typeMatch[2]}hd.appendChild(s)}else{if(match[2]&&match[2].length>0){if(window.execScript){window.execScript(match[2])}else{window.eval(match[2])}}}}el=DOC.getElementById(id);if(el){Ext.removeNode(el)}if(typeof callback=="function"){callback()}});dom.innerHTML=html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,"");return this},removeAllListeners:function(){this.removeAnchor();Ext.EventManager.removeAll(this.dom);return this},createProxy:function(a,e,d){a=(typeof a=="object")?a:{tag:"div",cls:a};var c=this,b=e?Ext.DomHelper.append(e,a,true):Ext.DomHelper.insertBefore(c.dom,a,true);if(d&&c.setBox&&c.getBox){b.setBox(c.getBox())}return b}});Ext.Element.prototype.getUpdateManager=Ext.Element.prototype.getUpdater;Ext.Element.addMethods({getAnchorXY:function(e,k,p){e=(e||"tl").toLowerCase();p=p||{};var j=this,b=j.dom==document.body||j.dom==document,m=p.width||b?Ext.lib.Dom.getViewWidth():j.getWidth(),g=p.height||b?Ext.lib.Dom.getViewHeight():j.getHeight(),n,a=Math.round,c=j.getXY(),l=j.getScroll(),i=b?l.left:!k?c[0]:0,f=b?l.top:!k?c[1]:0,d={c:[a(m*0.5),a(g*0.5)],t:[a(m*0.5),0],l:[0,a(g*0.5)],r:[m,a(g*0.5)],b:[a(m*0.5),g],tl:[0,0],bl:[0,g],br:[m,g],tr:[m,0]};n=d[e];return[n[0]+i,n[1]+f]},anchorTo:function(b,g,c,a,j,k){var h=this,e=h.dom,i=!Ext.isEmpty(j),d=function(){Ext.fly(e).alignTo(b,g,c,a);Ext.callback(k,Ext.fly(e))},f=this.getAnchor();this.removeAnchor();Ext.apply(f,{fn:d,scroll:i});Ext.EventManager.onWindowResize(d,null);if(i){Ext.EventManager.on(window,"scroll",d,null,{buffer:!isNaN(j)?j:50})}d.call(h);return h},removeAnchor:function(){var b=this,a=this.getAnchor();if(a&&a.fn){Ext.EventManager.removeResizeListener(a.fn);if(a.scroll){Ext.EventManager.un(window,"scroll",a.fn)}delete a.fn}return b},getAnchor:function(){var b=Ext.Element.data,c=this.dom;if(!c){return}var a=b(c,"_anchor");if(!a){a=b(c,"_anchor",{})}return a},getAlignToXY:function(f,z,A){f=Ext.get(f);if(!f||!f.dom){throw"Element.alignToXY with an element that doesn't exist"}A=A||[0,0];z=(!z||z=="?"?"tl-bl?":(!(/-/).test(z)&&z!==""?"tl-"+z:z||"tl-bl")).toLowerCase();var J=this,G=J.dom,L,K,l,k,q,E,u,s=Ext.lib.Dom.getViewWidth()-10,F=Ext.lib.Dom.getViewHeight()-10,b,g,i,j,t,v,M=document,I=M.documentElement,n=M.body,D=(I.scrollLeft||n.scrollLeft||0)+5,C=(I.scrollTop||n.scrollTop||0)+5,H=false,e="",a="",B=z.match(/^([a-z]+)-([a-z]+)(\?)?$/);if(!B){throw"Element.alignTo with an invalid alignment "+z}e=B[1];a=B[2];H=!!B[3];L=J.getAnchorXY(e,true);K=f.getAnchorXY(a,false);l=K[0]-L[0]+A[0];k=K[1]-L[1]+A[1];if(H){q=J.getWidth();E=J.getHeight();u=f.getRegion();b=e.charAt(0);g=e.charAt(e.length-1);i=a.charAt(0);j=a.charAt(a.length-1);t=((b=="t"&&i=="b")||(b=="b"&&i=="t"));v=((g=="r"&&j=="l")||(g=="l"&&j=="r"));if(l+q>s+D){l=v?u.left-q:s+D-q}if(l<D){l=v?u.right:D}if(k+E>F+C){k=t?u.top-E:F+C-E}if(k<C){k=t?u.bottom:C}}return[l,k]},alignTo:function(c,a,e,b){var d=this;return d.setXY(d.getAlignToXY(c,a,e),d.preanim&&!!b?d.preanim(arguments,3):false)},adjustForConstraints:function(c,a,b){return this.getConstrainToXY(a||document,false,b,c)||c},getConstrainToXY:function(b,a,c,e){var d={top:0,left:0,bottom:0,right:0};return function(g,z,k,m){g=Ext.get(g);k=k?Ext.applyIf(k,d):d;var v,C,u=0,t=0;if(g.dom==document.body||g.dom==document){v=Ext.lib.Dom.getViewWidth();C=Ext.lib.Dom.getViewHeight()}else{v=g.dom.clientWidth;C=g.dom.clientHeight;if(!z){var r=g.getXY();u=r[0];t=r[1]}}var q=g.getScroll();u+=k.left+q.left;t+=k.top+q.top;v-=k.right;C-=k.bottom;var A=u+v,f=t+C,i=m||(!z?this.getXY():[this.getLeft(true),this.getTop(true)]),o=i[0],n=i[1],j=this.getConstrainOffset(),p=this.dom.offsetWidth+j,B=this.dom.offsetHeight+j;var l=false;if((o+p)>A){o=A-p;l=true}if((n+B)>f){n=f-B;l=true}if(o<u){o=u;l=true}if(n<t){n=t;l=true}return l?[o,n]:false}}(),getConstrainOffset:function(){return 0},getCenterXY:function(){return this.getAlignToXY(document,"c-c")},center:function(a){return this.alignTo(a||document,"c-c")}});Ext.Element.addMethods({select:function(a,b){return Ext.Element.select(a,b,this.dom)}});Ext.apply(Ext.Element.prototype,function(){var c=Ext.getDom,a=Ext.get,b=Ext.DomHelper;return{insertSibling:function(h,f,g){var i=this,e,d=(f||"before").toLowerCase()=="after",j;if(Ext.isArray(h)){j=i;Ext.each(h,function(k){e=Ext.fly(j,"_internal").insertSibling(k,f,g);if(d){j=e}});return e}h=h||{};if(h.nodeType||h.dom){e=i.dom.parentNode.insertBefore(c(h),d?i.dom.nextSibling:i.dom);if(!g){e=a(e)}}else{if(d&&!i.dom.nextSibling){e=b.append(i.dom.parentNode,h,!g)}else{e=b[d?"insertAfter":"insertBefore"](i.dom,h,!g)}}return e}}}());Ext.Element.boxMarkup='<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';Ext.Element.addMethods(function(){var a="_internal",b=/(\d+\.?\d+)px/;return{applyStyles:function(c){Ext.DomHelper.applyStyles(this.dom,c);return this},getStyles:function(){var c={};Ext.each(arguments,function(d){c[d]=this.getStyle(d)},this);return c},setOverflow:function(c){var d=this.dom;if(c=="auto"&&Ext.isMac&&Ext.isGecko2){d.style.overflow="hidden";(function(){d.style.overflow="auto"}).defer(1)}else{d.style.overflow=c}},boxWrap:function(c){c=c||"x-box";var d=Ext.get(this.insertHtml("beforeBegin","<div class='"+c+"'>"+String.format(Ext.Element.boxMarkup,c)+"</div>"));Ext.DomQuery.selectNode("."+c+"-mc",d.dom).appendChild(this.dom);return d},setSize:function(e,c,d){var f=this;if(typeof e=="object"){c=e.height;e=e.width}e=f.adjustWidth(e);c=f.adjustHeight(c);if(!d||!f.anim){f.dom.style.width=f.addUnits(e);f.dom.style.height=f.addUnits(c)}else{f.anim({width:{to:e},height:{to:c}},f.preanim(arguments,2))}return f},getComputedHeight:function(){var d=this,c=Math.max(d.dom.offsetHeight,d.dom.clientHeight);if(!c){c=parseFloat(d.getStyle("height"))||0;if(!d.isBorderBox()){c+=d.getFrameWidth("tb")}}return c},getComputedWidth:function(){var c=Math.max(this.dom.offsetWidth,this.dom.clientWidth);if(!c){c=parseFloat(this.getStyle("width"))||0;if(!this.isBorderBox()){c+=this.getFrameWidth("lr")}}return c},getFrameWidth:function(d,c){return c&&this.isBorderBox()?0:(this.getPadding(d)+this.getBorderWidth(d))},addClassOnOver:function(c){this.hover(function(){Ext.fly(this,a).addClass(c)},function(){Ext.fly(this,a).removeClass(c)});return this},addClassOnFocus:function(c){this.on("focus",function(){Ext.fly(this,a).addClass(c)},this.dom);this.on("blur",function(){Ext.fly(this,a).removeClass(c)},this.dom);return this},addClassOnClick:function(c){var d=this.dom;this.on("mousedown",function(){Ext.fly(d,a).addClass(c);var f=Ext.getDoc(),e=function(){Ext.fly(d,a).removeClass(c);f.removeListener("mouseup",e)};f.on("mouseup",e)});return this},getViewSize:function(){var f=document,g=this.dom,c=(g==f||g==f.body);if(c){var e=Ext.lib.Dom;return{width:e.getViewWidth(),height:e.getViewHeight()}}else{return{width:g.clientWidth,height:g.clientHeight}}},getStyleSize:function(){var i=this,c,g,k=document,l=this.dom,e=(l==k||l==k.body),f=l.style;if(e){var j=Ext.lib.Dom;return{width:j.getViewWidth(),height:j.getViewHeight()}}if(f.width&&f.width!="auto"){c=parseFloat(f.width);if(i.isBorderBox()){c-=i.getFrameWidth("lr")}}if(f.height&&f.height!="auto"){g=parseFloat(f.height);if(i.isBorderBox()){g-=i.getFrameWidth("tb")}}return{width:c||i.getWidth(true),height:g||i.getHeight(true)}},getSize:function(c){return{width:this.getWidth(c),height:this.getHeight(c)}},repaint:function(){var c=this.dom;this.addClass("x-repaint");setTimeout(function(){Ext.fly(c).removeClass("x-repaint")},1);return this},unselectable:function(){this.dom.unselectable="on";return this.swallowEvent("selectstart",true).applyStyles("-moz-user-select:none;-khtml-user-select:none;").addClass("x-unselectable")},getMargins:function(d){var e=this,c,f={t:"top",l:"left",r:"right",b:"bottom"},g={};if(!d){for(c in e.margins){g[f[c]]=parseFloat(e.getStyle(e.margins[c]))||0}return g}else{return e.addStyles.call(e,d,e.margins)}}}}());Ext.Element.addMethods({setBox:function(e,f,b){var d=this,a=e.width,c=e.height;if((f&&!d.autoBoxAdjust)&&!d.isBorderBox()){a-=(d.getBorderWidth("lr")+d.getPadding("lr"));c-=(d.getBorderWidth("tb")+d.getPadding("tb"))}d.setBounds(e.x,e.y,a,c,d.animTest.call(d,arguments,b,2));return d},getBox:function(i,o){var k=this,u,e,n,d=k.getBorderWidth,p=k.getPadding,f,a,s,m;if(!o){u=k.getXY()}else{e=parseInt(k.getStyle("left"),10)||0;n=parseInt(k.getStyle("top"),10)||0;u=[e,n]}var c=k.dom,q=c.offsetWidth,g=c.offsetHeight,j;if(!i){j={x:u[0],y:u[1],0:u[0],1:u[1],width:q,height:g}}else{f=d.call(k,"l")+p.call(k,"l");a=d.call(k,"r")+p.call(k,"r");s=d.call(k,"t")+p.call(k,"t");m=d.call(k,"b")+p.call(k,"b");j={x:u[0]+f,y:u[1]+s,0:u[0]+f,1:u[1]+s,width:q-(f+a),height:g-(s+m)}}j.right=j.x+j.width;j.bottom=j.y+j.height;return j},move:function(i,b,c){var f=this,l=f.getXY(),j=l[0],h=l[1],d=[j-b,h],k=[j+b,h],g=[j,h-b],a=[j,h+b],e={l:d,left:d,r:k,right:k,t:g,top:g,up:g,b:a,bottom:a,down:a};i=i.toLowerCase();f.moveTo(e[i][0],e[i][1],f.animTest.call(f,arguments,c,2))},setLeftTop:function(d,c){var b=this,a=b.dom.style;a.left=b.addUnits(d);a.top=b.addUnits(c);return b},getRegion:function(){return Ext.lib.Dom.getRegion(this.dom)},setBounds:function(b,f,d,a,c){var e=this;if(!c||!e.anim){e.setSize(d,a);e.setLocation(b,f)}else{e.anim({points:{to:[b,f]},width:{to:e.adjustWidth(d)},height:{to:e.adjustHeight(a)}},e.preanim(arguments,4),"motion")}return e},setRegion:function(b,a){return this.setBounds(b.left,b.top,b.right-b.left,b.bottom-b.top,this.animTest.call(this,arguments,a,1))}});Ext.Element.addMethods({scrollTo:function(b,d,a){var e=/top/i.test(b),c=this,f=c.dom,g;if(!a||!c.anim){g="scroll"+(e?"Top":"Left");f[g]=d}else{g="scroll"+(e?"Left":"Top");c.anim({scroll:{to:e?[f[g],d]:[d,f[g]]}},c.preanim(arguments,2),"scroll")}return c},scrollIntoView:function(e,h){var n=Ext.getDom(e)||Ext.getBody().dom,g=this.dom,f=this.getOffsetsTo(n),j=f[0]+n.scrollLeft,s=f[1]+n.scrollTop,p=s+g.offsetHeight,d=j+g.offsetWidth,a=n.clientHeight,k=parseInt(n.scrollTop,10),q=parseInt(n.scrollLeft,10),i=k+a,m=q+n.clientWidth;if(g.offsetHeight>a||s<k){n.scrollTop=s}else{if(p>i){n.scrollTop=p-a}}n.scrollTop=n.scrollTop;if(h!==false){if(g.offsetWidth>n.clientWidth||j<q){n.scrollLeft=j}else{if(d>m){n.scrollLeft=d-n.clientWidth}}n.scrollLeft=n.scrollLeft}return this},scrollChildIntoView:function(b,a){Ext.fly(b,"_scrollChildIntoView").scrollIntoView(this,a)},scroll:function(k,b,d){if(!this.isScrollable()){return false}var e=this.dom,f=e.scrollLeft,o=e.scrollTop,m=e.scrollWidth,j=e.scrollHeight,g=e.clientWidth,a=e.clientHeight,c=false,n,i={l:Math.min(f+b,m-g),r:n=Math.max(f-b,0),t:Math.max(o-b,0),b:Math.min(o+b,j-a)};i.d=i.b;i.u=i.t;k=k.substr(0,1);if((n=i[k])>-1){c=true;this.scrollTo(k=="l"||k=="r"?"left":"top",n,this.preanim(arguments,2))}return c}});Ext.Element.addMethods(function(){var d="visibility",b="display",a="hidden",g="none",c="x-masked",f="x-masked-relative",e=Ext.Element.data;return{isVisible:function(h){var i=!this.isStyle(d,a)&&!this.isStyle(b,g),j=this.dom.parentNode;if(h!==true||!i){return i}while(j&&!(/^body/i.test(j.tagName))){if(!Ext.fly(j,"_isVisible").isVisible()){return false}j=j.parentNode}return true},isDisplayed:function(){return !this.isStyle(b,g)},enableDisplayMode:function(h){this.setVisibilityMode(Ext.Element.DISPLAY);if(!Ext.isEmpty(h)){e(this.dom,"originalDisplay",h)}return this},mask:function(i,m){var o=this,k=o.dom,n=Ext.DomHelper,l="ext-el-mask-msg",h,p;if(!/^body/i.test(k.tagName)&&o.getStyle("position")=="static"){o.addClass(f)}if(h=e(k,"maskMsg")){h.remove()}if(h=e(k,"mask")){h.remove()}p=n.append(k,{cls:"ext-el-mask"},true);e(k,"mask",p);o.addClass(c);p.setDisplayed(true);if(typeof i=="string"){var j=n.append(k,{cls:l,cn:{tag:"div"}},true);e(k,"maskMsg",j);j.dom.className=m?l+" "+m:l;j.dom.firstChild.innerHTML=i;j.setDisplayed(true);j.center(o)}if(Ext.isIE&&!(Ext.isIE7&&Ext.isStrict)&&o.getStyle("height")=="auto"){p.setSize(undefined,o.getHeight())}return p},unmask:function(){var j=this,k=j.dom,h=e(k,"mask"),i=e(k,"maskMsg");if(h){if(i){i.remove();e(k,"maskMsg",undefined)}h.remove();e(k,"mask",undefined);j.removeClass([c,f])}},isMasked:function(){var h=e(this.dom,"mask");return h&&h.isVisible()},createShim:function(){var h=document.createElement("iframe"),i;h.frameBorder="0";h.className="ext-shim";h.src=Ext.SSL_SECURE_URL;i=Ext.get(this.dom.parentNode.insertBefore(h,this.dom));i.autoBoxAdjust=false;return i}}}());Ext.Element.addMethods({addKeyListener:function(b,d,c){var a;if(typeof b!="object"||Ext.isArray(b)){a={key:b,fn:d,scope:c}}else{a={key:b.key,shift:b.shift,ctrl:b.ctrl,alt:b.alt,fn:d,scope:c}}return new Ext.KeyMap(this,a)},addKeyMap:function(a){return new Ext.KeyMap(this,a)}});Ext.CompositeElementLite.importElementMethods();Ext.apply(Ext.CompositeElementLite.prototype,{addElements:function(c,a){if(!c){return this}if(typeof c=="string"){c=Ext.Element.selectorFunction(c,a)}var b=this.elements;Ext.each(c,function(d){b.push(Ext.get(d))});return this},first:function(){return this.item(0)},last:function(){return this.item(this.getCount()-1)},contains:function(a){return this.indexOf(a)!=-1},removeElement:function(d,e){var c=this,a=this.elements,b;Ext.each(d,function(f){if((b=(a[f]||a[f=c.indexOf(f)]))){if(e){if(b.dom){b.remove()}else{Ext.removeNode(b)}}a.splice(f,1)}});return this}});Ext.CompositeElement=Ext.extend(Ext.CompositeElementLite,{constructor:function(b,a){this.elements=[];this.add(b,a)},getElement:function(a){return a},transformElement:function(a){return Ext.get(a)}});Ext.Element.select=function(a,d,b){var c;if(typeof a=="string"){c=Ext.Element.selectorFunction(a,b)}else{if(a.length!==undefined){c=a}else{throw"Invalid selector"}}return(d===true)?new Ext.CompositeElement(c):new Ext.CompositeElementLite(c)};Ext.select=Ext.Element.select;Ext.UpdateManager=Ext.Updater=Ext.extend(Ext.util.Observable,function(){var b="beforeupdate",d="update",c="failure";function a(g){var h=this;h.transaction=null;if(g.argument.form&&g.argument.reset){try{g.argument.form.reset()}catch(i){}}if(h.loadScripts){h.renderer.render(h.el,g,h,f.createDelegate(h,[g]))}else{h.renderer.render(h.el,g,h);f.call(h,g)}}function f(g,h,i){this.fireEvent(h||d,this.el,g);if(Ext.isFunction(g.argument.callback)){g.argument.callback.call(g.argument.scope,this.el,Ext.isEmpty(i)?true:false,g,g.argument.options)}}function e(g){f.call(this,g,c,!!(this.transaction=null))}return{constructor:function(h,g){var i=this;h=Ext.get(h);if(!g&&h.updateManager){return h.updateManager}i.el=h;i.defaultUrl=null;i.addEvents(b,d,c);Ext.apply(i,Ext.Updater.defaults);i.transaction=null;i.refreshDelegate=i.refresh.createDelegate(i);i.updateDelegate=i.update.createDelegate(i);i.formUpdateDelegate=(i.formUpdate||function(){}).createDelegate(i);i.renderer=i.renderer||i.getDefaultRenderer();Ext.Updater.superclass.constructor.call(i)},setRenderer:function(g){this.renderer=g},getRenderer:function(){return this.renderer},getDefaultRenderer:function(){return new Ext.Updater.BasicRenderer()},setDefaultUrl:function(g){this.defaultUrl=g},getEl:function(){return this.el},update:function(h,m,n,k){var j=this,g,i;if(j.fireEvent(b,j.el,h,m)!==false){if(Ext.isObject(h)){g=h;h=g.url;m=m||g.params;n=n||g.callback;k=k||g.discardUrl;i=g.scope;if(!Ext.isEmpty(g.nocache)){j.disableCaching=g.nocache}if(!Ext.isEmpty(g.text)){j.indicatorText='<div class="loading-indicator">'+g.text+"</div>"}if(!Ext.isEmpty(g.scripts)){j.loadScripts=g.scripts}if(!Ext.isEmpty(g.timeout)){j.timeout=g.timeout}}j.showLoading();if(!k){j.defaultUrl=h}if(Ext.isFunction(h)){h=h.call(j)}var l=Ext.apply({},{url:h,params:(Ext.isFunction(m)&&i)?m.createDelegate(i):m,success:a,failure:e,scope:j,callback:undefined,timeout:(j.timeout*1000),disableCaching:j.disableCaching,argument:{options:g,url:h,form:null,callback:n,scope:i||window,params:m}},g);j.transaction=Ext.Ajax.request(l)}},formUpdate:function(j,g,i,k){var h=this;if(h.fireEvent(b,h.el,j,g)!==false){if(Ext.isFunction(g)){g=g.call(h)}j=Ext.getDom(j);h.transaction=Ext.Ajax.request({form:j,url:g,success:a,failure:e,scope:h,timeout:(h.timeout*1000),argument:{url:g,form:j,callback:k,reset:i}});h.showLoading.defer(1,h)}},startAutoRefresh:function(h,i,k,l,g){var j=this;if(g){j.update(i||j.defaultUrl,k,l,true)}if(j.autoRefreshProcId){clearInterval(j.autoRefreshProcId)}j.autoRefreshProcId=setInterval(j.update.createDelegate(j,[i||j.defaultUrl,k,l,true]),h*1000)},stopAutoRefresh:function(){if(this.autoRefreshProcId){clearInterval(this.autoRefreshProcId);delete this.autoRefreshProcId}},isAutoRefreshing:function(){return !!this.autoRefreshProcId},showLoading:function(){if(this.showLoadIndicator){this.el.dom.innerHTML=this.indicatorText}},abort:function(){if(this.transaction){Ext.Ajax.abort(this.transaction)}},isUpdating:function(){return this.transaction?Ext.Ajax.isLoading(this.transaction):false},refresh:function(g){if(this.defaultUrl){this.update(this.defaultUrl,null,g,true)}}}}());Ext.Updater.defaults={timeout:30,disableCaching:false,showLoadIndicator:true,indicatorText:'<div class="loading-indicator">Loading...</div>',loadScripts:false,sslBlankUrl:Ext.SSL_SECURE_URL};Ext.Updater.updateElement=function(d,c,e,b){var a=Ext.get(d).getUpdater();Ext.apply(a,b);a.update(c,e,b?b.callback:null)};Ext.Updater.BasicRenderer=function(){};Ext.Updater.BasicRenderer.prototype={render:function(c,a,b,d){c.update(a.responseText,b.loadScripts,d)}};(function(){Date.useStrict=false;function b(d){var c=Array.prototype.slice.call(arguments,1);return d.replace(/\{(\d+)\}/g,function(e,f){return c[f]})}Date.formatCodeToRegex=function(d,c){var e=Date.parseCodes[d];if(e){e=typeof e=="function"?e():e;Date.parseCodes[d]=e}return e?Ext.applyIf({c:e.c?b(e.c,c||"{0}"):e.c},e):{g:0,c:null,s:Ext.escapeRe(d)}};var a=Date.formatCodeToRegex;Ext.apply(Date,{parseFunctions:{"M$":function(d,c){var e=new RegExp("\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/");var f=(d||"").match(e);return f?new Date(((f[1]||"")+f[2])*1):null}},parseRegexes:[],formatFunctions:{"M$":function(){return"\\/Date("+this.getTime()+")\\/"}},y2kYear:50,MILLI:"ms",SECOND:"s",MINUTE:"mi",HOUR:"h",DAY:"d",MONTH:"mo",YEAR:"y",defaults:{},dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNumbers:{Jan:0,Feb:1,Mar:2,Apr:3,May:4,Jun:5,Jul:6,Aug:7,Sep:8,Oct:9,Nov:10,Dec:11},getShortMonthName:function(c){return Date.monthNames[c].substring(0,3)},getShortDayName:function(c){return Date.dayNames[c].substring(0,3)},getMonthNumber:function(c){return Date.monthNumbers[c.substring(0,1).toUpperCase()+c.substring(1,3).toLowerCase()]},formatContainsHourInfo:(function(){var d=/(\\.)/g,c=/([gGhHisucUOPZ]|M\$)/;return function(e){return c.test(e.replace(d,""))}})(),formatCodes:{d:"String.leftPad(this.getDate(), 2, '0')",D:"Date.getShortDayName(this.getDay())",j:"this.getDate()",l:"Date.dayNames[this.getDay()]",N:"(this.getDay() ? this.getDay() : 7)",S:"this.getSuffix()",w:"this.getDay()",z:"this.getDayOfYear()",W:"String.leftPad(this.getWeekOfYear(), 2, '0')",F:"Date.monthNames[this.getMonth()]",m:"String.leftPad(this.getMonth() + 1, 2, '0')",M:"Date.getShortMonthName(this.getMonth())",n:"(this.getMonth() + 1)",t:"this.getDaysInMonth()",L:"(this.isLeapYear() ? 1 : 0)",o:"(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",Y:"String.leftPad(this.getFullYear(), 4, '0')",y:"('' + this.getFullYear()).substring(2, 4)",a:"(this.getHours() < 12 ? 'am' : 'pm')",A:"(this.getHours() < 12 ? 'AM' : 'PM')",g:"((this.getHours() % 12) ? this.getHours() % 12 : 12)",G:"this.getHours()",h:"String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",H:"String.leftPad(this.getHours(), 2, '0')",i:"String.leftPad(this.getMinutes(), 2, '0')",s:"String.leftPad(this.getSeconds(), 2, '0')",u:"String.leftPad(this.getMilliseconds(), 3, '0')",O:"this.getGMTOffset()",P:"this.getGMTOffset(true)",T:"this.getTimezone()",Z:"(this.getTimezoneOffset() * -60)",c:function(){for(var j="Y-m-dTH:i:sP",g=[],f=0,d=j.length;f<d;++f){var h=j.charAt(f);g.push(h=="T"?"'T'":Date.getFormatCode(h))}return g.join(" + ")},U:"Math.round(this.getTime() / 1000)"},isValid:function(n,c,l,j,f,g,e){j=j||0;f=f||0;g=g||0;e=e||0;var k=new Date(n<100?100:n,c-1,l,j,f,g,e).add(Date.YEAR,n<100?n-100:0);return n==k.getFullYear()&&c==k.getMonth()+1&&l==k.getDate()&&j==k.getHours()&&f==k.getMinutes()&&g==k.getSeconds()&&e==k.getMilliseconds()},parseDate:function(d,f,c){var e=Date.parseFunctions;if(e[f]==null){Date.createParser(f)}return e[f](d,Ext.isDefined(c)?c:Date.useStrict)},getFormatCode:function(d){var c=Date.formatCodes[d];if(c){c=typeof c=="function"?c():c;Date.formatCodes[d]=c}return c||("'"+String.escape(d)+"'")},createFormat:function(g){var f=[],c=false,e="";for(var d=0;d<g.length;++d){e=g.charAt(d);if(!c&&e=="\\"){c=true}else{if(c){c=false;f.push("'"+String.escape(e)+"'")}else{f.push(Date.getFormatCode(e))}}}Date.formatFunctions[g]=new Function("return "+f.join("+"))},createParser:function(){var c=["var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,","def = Date.defaults,","results = String(input).match(Date.parseRegexes[{0}]);","if(results){","{1}","if(u != null){","v = new Date(u * 1000);","}else{","dt = (new Date()).clearTime();","y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));","m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));","d = Ext.num(d, Ext.num(def.d, dt.getDate()));","h  = Ext.num(h, Ext.num(def.h, dt.getHours()));","i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));","s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));","ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));","if(z >= 0 && y >= 0){","v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);","v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);","}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){","v = null;","}else{","v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);","}","}","}","if(v){","if(zz != null){","v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);","}else if(o){","v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));","}","}","return v;"].join("\n");return function(l){var e=Date.parseRegexes.length,n=1,f=[],k=[],j=false,d="",h=0,g,m;for(;h<l.length;++h){d=l.charAt(h);if(!j&&d=="\\"){j=true}else{if(j){j=false;k.push(String.escape(d))}else{g=a(d,n);n+=g.g;k.push(g.s);if(g.g&&g.c){if(g.calcLast){m=g.c}else{f.push(g.c)}}}}}if(m){f.push(m)}Date.parseRegexes[e]=new RegExp("^"+k.join("")+"$","i");Date.parseFunctions[l]=new Function("input","strict",b(c,e,f.join("")))}}(),parseCodes:{d:{g:1,c:"d = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},j:{g:1,c:"d = parseInt(results[{0}], 10);\n",s:"(\\d{1,2})"},D:function(){for(var c=[],d=0;d<7;c.push(Date.getShortDayName(d)),++d){}return{g:0,c:null,s:"(?:"+c.join("|")+")"}},l:function(){return{g:0,c:null,s:"(?:"+Date.dayNames.join("|")+")"}},N:{g:0,c:null,s:"[1-7]"},S:{g:0,c:null,s:"(?:st|nd|rd|th)"},w:{g:0,c:null,s:"[0-6]"},z:{g:1,c:"z = parseInt(results[{0}], 10);\n",s:"(\\d{1,3})"},W:{g:0,c:null,s:"(?:\\d{2})"},F:function(){return{g:1,c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n",s:"("+Date.monthNames.join("|")+")"}},M:function(){for(var c=[],d=0;d<12;c.push(Date.getShortMonthName(d)),++d){}return Ext.applyIf({s:"("+c.join("|")+")"},a("F"))},m:{g:1,c:"m = parseInt(results[{0}], 10) - 1;\n",s:"(\\d{2})"},n:{g:1,c:"m = parseInt(results[{0}], 10) - 1;\n",s:"(\\d{1,2})"},t:{g:0,c:null,s:"(?:\\d{2})"},L:{g:0,c:null,s:"(?:1|0)"},o:function(){return a("Y")},Y:{g:1,c:"y = parseInt(results[{0}], 10);\n",s:"(\\d{4})"},y:{g:1,c:"var ty = parseInt(results[{0}], 10);\ny = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n",s:"(\\d{1,2})"},a:function(){return a("A")},A:{calcLast:true,g:1,c:"if (/(am)/i.test(results[{0}])) {\nif (!h || h == 12) { h = 0; }\n} else { if (!h || h < 12) { h = (h || 0) + 12; }}",s:"(AM|PM|am|pm)"},g:function(){return a("G")},G:{g:1,c:"h = parseInt(results[{0}], 10);\n",s:"(\\d{1,2})"},h:function(){return a("H")},H:{g:1,c:"h = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},i:{g:1,c:"i = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},s:{g:1,c:"s = parseInt(results[{0}], 10);\n",s:"(\\d{2})"},u:{g:1,c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",s:"(\\d+)"},O:{g:1,c:["o = results[{0}];","var sn = o.substring(0,1),","hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),","mn = o.substring(3,5) % 60;","o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n"].join("\n"),s:"([+-]\\d{4})"},P:{g:1,c:["o = results[{0}];","var sn = o.substring(0,1),","hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),","mn = o.substring(4,6) % 60;","o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n"].join("\n"),s:"([+-]\\d{2}:\\d{2})"},T:{g:0,c:null,s:"[A-Z]{1,4}"},Z:{g:1,c:"zz = results[{0}] * 1;\nzz = (-43200 <= zz && zz <= 50400)? zz : null;\n",s:"([+-]?\\d{1,5})"},c:function(){var e=[],c=[a("Y",1),a("m",2),a("d",3),a("h",4),a("i",5),a("s",6),{c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"},{c:["if(results[8]) {","if(results[8] == 'Z'){","zz = 0;","}else if (results[8].indexOf(':') > -1){",a("P",8).c,"}else{",a("O",8).c,"}","}"].join("\n")}];for(var f=0,d=c.length;f<d;++f){e.push(c[f].c)}return{g:1,c:e.join(""),s:[c[0].s,"(?:","-",c[1].s,"(?:","-",c[2].s,"(?:","(?:T| )?",c[3].s,":",c[4].s,"(?::",c[5].s,")?","(?:(?:\\.|,)(\\d+))?","(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?",")?",")?",")?"].join("")}},U:{g:1,c:"u = parseInt(results[{0}], 10);\n",s:"(-?\\d+)"}}})}());Ext.apply(Date.prototype,{dateFormat:function(a){if(Date.formatFunctions[a]==null){Date.createFormat(a)}return Date.formatFunctions[a].call(this)},getTimezone:function(){return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/,"$1$2").replace(/[^A-Z]/g,"")},getGMTOffset:function(a){return(this.getTimezoneOffset()>0?"-":"+")+String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset())/60),2,"0")+(a?":":"")+String.leftPad(Math.abs(this.getTimezoneOffset()%60),2,"0")},getDayOfYear:function(){var b=0,e=this.clone(),a=this.getMonth(),c;for(c=0,e.setDate(1),e.setMonth(0);c<a;e.setMonth(++c)){b+=e.getDaysInMonth()}return b+this.getDate()-1},getWeekOfYear:function(){var a=86400000,b=7*a;return function(){var d=Date.UTC(this.getFullYear(),this.getMonth(),this.getDate()+3)/a,c=Math.floor(d/7),e=new Date(c*b).getUTCFullYear();return c-Math.floor(Date.UTC(e,0,7)/b)+1}}(),isLeapYear:function(){var a=this.getFullYear();return !!((a&3)==0&&(a%100||(a%400==0&&a)))},getFirstDayOfMonth:function(){var a=(this.getDay()-(this.getDate()-1))%7;return(a<0)?(a+7):a},getLastDayOfMonth:function(){return this.getLastDateOfMonth().getDay()},getFirstDateOfMonth:function(){return new Date(this.getFullYear(),this.getMonth(),1)},getLastDateOfMonth:function(){return new Date(this.getFullYear(),this.getMonth(),this.getDaysInMonth())},getDaysInMonth:function(){var a=[31,28,31,30,31,30,31,31,30,31,30,31];return function(){var b=this.getMonth();return b==1&&this.isLeapYear()?29:a[b]}}(),getSuffix:function(){switch(this.getDate()){case 1:case 21:case 31:return"st";case 2:case 22:return"nd";case 3:case 23:return"rd";default:return"th"}},clone:function(){return new Date(this.getTime())},isDST:function(){return new Date(this.getFullYear(),0,1).getTimezoneOffset()!=this.getTimezoneOffset()},clearTime:function(f){if(f){return this.clone().clearTime()}var b=this.getDate();this.setHours(0);this.setMinutes(0);this.setSeconds(0);this.setMilliseconds(0);if(this.getDate()!=b){for(var a=1,e=this.add(Date.HOUR,a);e.getDate()!=b;a++,e=this.add(Date.HOUR,a)){}this.setDate(b);this.setHours(e.getHours())}return this},add:function(b,c){var e=this.clone();if(!b||c===0){return e}switch(b.toLowerCase()){case Date.MILLI:e.setMilliseconds(this.getMilliseconds()+c);break;case Date.SECOND:e.setSeconds(this.getSeconds()+c);break;case Date.MINUTE:e.setMinutes(this.getMinutes()+c);break;case Date.HOUR:e.setHours(this.getHours()+c);break;case Date.DAY:e.setDate(this.getDate()+c);break;case Date.MONTH:var a=this.getDate();if(a>28){a=Math.min(a,this.getFirstDateOfMonth().add("mo",c).getLastDateOfMonth().getDate())}e.setDate(a);e.setMonth(this.getMonth()+c);break;case Date.YEAR:e.setFullYear(this.getFullYear()+c);break}return e},between:function(c,a){var b=this.getTime();return c.getTime()<=b&&b<=a.getTime()}});Date.prototype.format=Date.prototype.dateFormat;if(Ext.isSafari&&(navigator.userAgent.match(/WebKit\/(\d+)/)[1]||NaN)<420){Ext.apply(Date.prototype,{_xMonth:Date.prototype.setMonth,_xDate:Date.prototype.setDate,setMonth:function(a){if(a<=-1){var d=Math.ceil(-a),c=Math.ceil(d/12),b=(d%12)?12-d%12:0;this.setFullYear(this.getFullYear()-c);return this._xMonth(b)}else{return this._xMonth(a)}},setDate:function(a){return this.setTime(this.getTime()-(this.getDate()-a)*86400000)}})}Ext.util.MixedCollection=function(b,a){this.items=[];this.map={};this.keys=[];this.length=0;this.addEvents("clear","add","replace","remove","sort");this.allowFunctions=b===true;if(a){this.getKey=a}Ext.util.MixedCollection.superclass.constructor.call(this)};Ext.extend(Ext.util.MixedCollection,Ext.util.Observable,{allowFunctions:false,add:function(b,c){if(arguments.length==1){c=arguments[0];b=this.getKey(c)}if(typeof b!="undefined"&&b!==null){var a=this.map[b];if(typeof a!="undefined"){return this.replace(b,c)}this.map[b]=c}this.length++;this.items.push(c);this.keys.push(b);this.fireEvent("add",this.length-1,c,b);return c},getKey:function(a){return a.id},replace:function(c,d){if(arguments.length==1){d=arguments[0];c=this.getKey(d)}var a=this.map[c];if(typeof c=="undefined"||c===null||typeof a=="undefined"){return this.add(c,d)}var b=this.indexOfKey(c);this.items[b]=d;this.map[c]=d;this.fireEvent("replace",c,a,d);return d},addAll:function(e){if(arguments.length>1||Ext.isArray(e)){var b=arguments.length>1?arguments:e;for(var d=0,a=b.length;d<a;d++){this.add(b[d])}}else{for(var c in e){if(this.allowFunctions||typeof e[c]!="function"){this.add(c,e[c])}}}},each:function(e,d){var b=[].concat(this.items);for(var c=0,a=b.length;c<a;c++){if(e.call(d||b[c],b[c],c,a)===false){break}}},eachKey:function(d,c){for(var b=0,a=this.keys.length;b<a;b++){d.call(c||window,this.keys[b],this.items[b],b,a)}},find:function(d,c){for(var b=0,a=this.items.length;b<a;b++){if(d.call(c||window,this.items[b],this.keys[b])){return this.items[b]}}return null},insert:function(a,b,c){if(arguments.length==2){c=arguments[1];b=this.getKey(c)}if(this.containsKey(b)){this.suspendEvents();this.removeKey(b);this.resumeEvents()}if(a>=this.length){return this.add(b,c)}this.length++;this.items.splice(a,0,c);if(typeof b!="undefined"&&b!==null){this.map[b]=c}this.keys.splice(a,0,b);this.fireEvent("add",a,c,b);return c},remove:function(a){return this.removeAt(this.indexOf(a))},removeAt:function(a){if(a<this.length&&a>=0){this.length--;var c=this.items[a];this.items.splice(a,1);var b=this.keys[a];if(typeof b!="undefined"){delete this.map[b]}this.keys.splice(a,1);this.fireEvent("remove",c,b);return c}return false},removeKey:function(a){return this.removeAt(this.indexOfKey(a))},getCount:function(){return this.length},indexOf:function(a){return this.items.indexOf(a)},indexOfKey:function(a){return this.keys.indexOf(a)},item:function(b){var a=this.map[b],c=a!==undefined?a:(typeof b=="number")?this.items[b]:undefined;return typeof c!="function"||this.allowFunctions?c:null},itemAt:function(a){return this.items[a]},key:function(a){return this.map[a]},contains:function(a){return this.indexOf(a)!=-1},containsKey:function(a){return typeof this.map[a]!="undefined"},clear:function(){this.length=0;this.items=[];this.keys=[];this.map={};this.fireEvent("clear")},first:function(){return this.items[0]},last:function(){return this.items[this.length-1]},_sort:function(j,a,h){var d,e,b=String(a).toUpperCase()=="DESC"?-1:1,g=[],k=this.keys,f=this.items;h=h||function(i,c){return i-c};for(d=0,e=f.length;d<e;d++){g[g.length]={key:k[d],value:f[d],index:d}}g.sort(function(i,c){var l=h(i[j],c[j])*b;if(l===0){l=(i.index<c.index?-1:1)}return l});for(d=0,e=g.length;d<e;d++){f[d]=g[d].value;k[d]=g[d].key}this.fireEvent("sort",this)},sort:function(a,b){this._sort("value",a,b)},reorder:function(d){this.suspendEvents();var b=this.items,c=0,f=b.length,a=[],e=[],g;for(g in d){a[d[g]]=b[g]}for(c=0;c<f;c++){if(d[c]==undefined){e.push(b[c])}}for(c=0;c<f;c++){if(a[c]==undefined){a[c]=e.shift()}}this.clear();this.addAll(a);this.resumeEvents();this.fireEvent("sort",this)},keySort:function(a,b){this._sort("key",a,b||function(d,c){var f=String(d).toUpperCase(),e=String(c).toUpperCase();return f>e?1:(f<e?-1:0)})},getRange:function(e,a){var b=this.items;if(b.length<1){return[]}e=e||0;a=Math.min(typeof a=="undefined"?this.length-1:a,this.length-1);var c,d=[];if(e<=a){for(c=e;c<=a;c++){d[d.length]=b[c]}}else{for(c=e;c>=a;c--){d[d.length]=b[c]}}return d},filter:function(c,b,d,a){if(Ext.isEmpty(b,false)){return this.clone()}b=this.createValueMatcher(b,d,a);return this.filterBy(function(e){return e&&b.test(e[c])})},filterBy:function(f,e){var g=new Ext.util.MixedCollection();g.getKey=this.getKey;var b=this.keys,d=this.items;for(var c=0,a=d.length;c<a;c++){if(f.call(e||this,d[c],b[c])){g.add(b[c],d[c])}}return g},findIndex:function(c,b,e,d,a){if(Ext.isEmpty(b,false)){return -1}b=this.createValueMatcher(b,d,a);return this.findIndexBy(function(f){return f&&b.test(f[c])},null,e)},findIndexBy:function(f,e,g){var b=this.keys,d=this.items;for(var c=(g||0),a=d.length;c<a;c++){if(f.call(e||this,d[c],b[c])){return c}}return -1},createValueMatcher:function(c,e,a,b){if(!c.exec){var d=Ext.escapeRe;c=String(c);if(e===true){c=d(c)}else{c="^"+d(c);if(b===true){c+="$"}}c=new RegExp(c,a?"":"i")}return c},clone:function(){var e=new Ext.util.MixedCollection();var b=this.keys,d=this.items;for(var c=0,a=d.length;c<a;c++){e.add(b[c],d[c])}e.getKey=this.getKey;return e}});Ext.util.MixedCollection.prototype.get=Ext.util.MixedCollection.prototype.item;Ext.AbstractManager=Ext.extend(Object,{typeName:"type",constructor:function(a){Ext.apply(this,a||{});this.all=new Ext.util.MixedCollection();this.types={}},get:function(a){return this.all.get(a)},register:function(a){this.all.add(a)},unregister:function(a){this.all.remove(a)},registerType:function(b,a){this.types[b]=a;a[this.typeName]=b},isRegistered:function(a){return this.types[a]!==undefined},create:function(a,d){var b=a[this.typeName]||a.type||d,c=this.types[b];if(c==undefined){throw new Error(String.format("The '{0}' type has not been registered with this manager",b))}return new c(a)},onAvailable:function(d,c,b){var a=this.all;a.on("add",function(e,f){if(f.id==d){c.call(b||f,f);a.un("add",c,b)}})}});Ext.util.Format=function(){var trimRe=/^\s+|\s+$/g,stripTagsRE=/<\/?[^>]+>/gi,stripScriptsRe=/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,nl2brRe=/\r?\n/g;return{ellipsis:function(value,len,word){if(value&&value.length>len){if(word){var vs=value.substr(0,len-2),index=Math.max(vs.lastIndexOf(" "),vs.lastIndexOf("."),vs.lastIndexOf("!"),vs.lastIndexOf("?"));if(index==-1||index<(len-15)){return value.substr(0,len-3)+"..."}else{return vs.substr(0,index)+"..."}}else{return value.substr(0,len-3)+"..."}}return value},undef:function(value){return value!==undefined?value:""},defaultValue:function(value,defaultValue){return value!==undefined&&value!==""?value:defaultValue},htmlEncode:function(value){return !value?value:String(value).replace(/&/g,"&amp;").replace(/>/g,"&gt;").replace(/</g,"&lt;").replace(/"/g,"&quot;")},htmlDecode:function(value){return !value?value:String(value).replace(/&gt;/g,">").replace(/&lt;/g,"<").replace(/&quot;/g,'"').replace(/&amp;/g,"&")},trim:function(value){return String(value).replace(trimRe,"")},substr:function(value,start,length){return String(value).substr(start,length)},lowercase:function(value){return String(value).toLowerCase()},uppercase:function(value){return String(value).toUpperCase()},capitalize:function(value){return !value?value:value.charAt(0).toUpperCase()+value.substr(1).toLowerCase()},call:function(value,fn){if(arguments.length>2){var args=Array.prototype.slice.call(arguments,2);args.unshift(value);return eval(fn).apply(window,args)}else{return eval(fn).call(window,value)}},usMoney:function(v){v=(Math.round((v-0)*100))/100;v=(v==Math.floor(v))?v+".00":((v*10==Math.floor(v*10))?v+"0":v);v=String(v);var ps=v.split("."),whole=ps[0],sub=ps[1]?"."+ps[1]:".00",r=/(\d+)(\d{3})/;while(r.test(whole)){whole=whole.replace(r,"$1,$2")}v=whole+sub;if(v.charAt(0)=="-"){return"-$"+v.substr(1)}return"$"+v},date:function(v,format){if(!v){return""}if(!Ext.isDate(v)){v=new Date(Date.parse(v))}return v.dateFormat(format||"m/d/Y")},dateRenderer:function(format){return function(v){return Ext.util.Format.date(v,format)}},stripTags:function(v){return !v?v:String(v).replace(stripTagsRE,"")},stripScripts:function(v){return !v?v:String(v).replace(stripScriptsRe,"")},fileSize:function(size){if(size<1024){return size+" bytes"}else{if(size<1048576){return(Math.round(((size*10)/1024))/10)+" KB"}else{return(Math.round(((size*10)/1048576))/10)+" MB"}}},math:function(){var fns={};return function(v,a){if(!fns[a]){fns[a]=new Function("v","return v "+a+";")}return fns[a](v)}}(),round:function(value,precision){var result=Number(value);if(typeof precision=="number"){precision=Math.pow(10,precision);result=Math.round(value*precision)/precision}return result},number:function(v,format){if(!format){return v}v=Ext.num(v,NaN);if(isNaN(v)){return""}var comma=",",dec=".",i18n=false,neg=v<0;v=Math.abs(v);if(format.substr(format.length-2)=="/i"){format=format.substr(0,format.length-2);i18n=true;comma=".";dec=","}var hasComma=format.indexOf(comma)!=-1,psplit=(i18n?format.replace(/[^\d\,]/g,""):format.replace(/[^\d\.]/g,"")).split(dec);if(1<psplit.length){v=v.toFixed(psplit[1].length)}else{if(2<psplit.length){throw ("NumberFormatException: invalid format, formats should have no more than 1 period: "+format)}else{v=v.toFixed(0)}}var fnum=v.toString();psplit=fnum.split(".");if(hasComma){var cnum=psplit[0],parr=[],j=cnum.length,m=Math.floor(j/3),n=cnum.length%3||3,i;for(i=0;i<j;i+=n){if(i!=0){n=3}parr[parr.length]=cnum.substr(i,n);m-=1}fnum=parr.join(comma);if(psplit[1]){fnum+=dec+psplit[1]}}else{if(psplit[1]){fnum=psplit[0]+dec+psplit[1]}}return(neg?"-":"")+format.replace(/[\d,?\.?]+/,fnum)},numberRenderer:function(format){return function(v){return Ext.util.Format.number(v,format)}},plural:function(v,s,p){return v+" "+(v==1?s:(p?p:s+"s"))},nl2br:function(v){return Ext.isEmpty(v)?"":v.replace(nl2brRe,"<br/>")}}}();Ext.XTemplate=function(){Ext.XTemplate.superclass.constructor.apply(this,arguments);var x=this,h=x.html,p=/<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,d=/^<tpl\b[^>]*?for="(.*?)"/,u=/^<tpl\b[^>]*?if="(.*?)"/,w=/^<tpl\b[^>]*?exec="(.*?)"/,q,o=0,j=[],n="values",v="parent",k="xindex",l="xcount",e="return ",c="with(values){ ";h=["<tpl>",h,"</tpl>"].join("");while((q=h.match(p))){var b=q[0].match(d),a=q[0].match(u),z=q[0].match(w),f=null,g=null,r=null,y=b&&b[1]?b[1]:"";if(a){f=a&&a[1]?a[1]:null;if(f){g=new Function(n,v,k,l,c+e+(Ext.util.Format.htmlDecode(f))+"; }")}}if(z){f=z&&z[1]?z[1]:null;if(f){r=new Function(n,v,k,l,c+(Ext.util.Format.htmlDecode(f))+"; }")}}if(y){switch(y){case".":y=new Function(n,v,c+e+n+"; }");break;case"..":y=new Function(n,v,c+e+v+"; }");break;default:y=new Function(n,v,c+e+y+"; }")}}j.push({id:o,target:y,exec:r,test:g,body:q[1]||""});h=h.replace(q[0],"{xtpl"+o+"}");++o}for(var t=j.length-1;t>=0;--t){x.compileTpl(j[t])}x.master=j[j.length-1];x.tpls=j};Ext.extend(Ext.XTemplate,Ext.Template,{re:/\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,codeRe:/\{\[((?:\\\]|.|\n)*?)\]\}/g,applySubTemplate:function(a,j,h,d,c){var g=this,f,l=g.tpls[a],k,b=[];if((l.test&&!l.test.call(g,j,h,d,c))||(l.exec&&l.exec.call(g,j,h,d,c))){return""}k=l.target?l.target.call(g,j,h):j;f=k.length;h=l.target?j:h;if(l.target&&Ext.isArray(k)){for(var e=0,f=k.length;e<f;e++){b[b.length]=l.compiled.call(g,k[e],h,e+1,f)}return b.join("")}return l.compiled.call(g,k,h,d,c)},compileTpl:function(tpl){var fm=Ext.util.Format,useF=this.disableFormats!==true,sep=Ext.isGecko?"+":",",body;function fn(m,name,format,args,math){if(name.substr(0,4)=="xtpl"){return"'"+sep+"this.applySubTemplate("+name.substr(4)+", values, parent, xindex, xcount)"+sep+"'"}var v;if(name==="."){v="values"}else{if(name==="#"){v="xindex"}else{if(name.indexOf(".")!=-1){v=name}else{v="values['"+name+"']"}}}if(math){v="("+v+math+")"}if(format&&useF){args=args?","+args:"";if(format.substr(0,5)!="this."){format="fm."+format+"("}else{format='this.call("'+format.substr(5)+'", ';args=", values"}}else{args="";format="("+v+" === undefined ? '' : "}return"'"+sep+format+v+args+")"+sep+"'"}function codeFn(m,code){return"'"+sep+"("+code.replace(/\\'/g,"'")+")"+sep+"'"}if(Ext.isGecko){body="tpl.compiled = function(values, parent, xindex, xcount){ return '"+tpl.body.replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn).replace(this.codeRe,codeFn)+"';};"}else{body=["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];body.push(tpl.body.replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn).replace(this.codeRe,codeFn));body.push("'].join('');};");body=body.join("")}eval(body);return this},applyTemplate:function(a){return this.master.compiled.call(this,a,{},1,1)},compile:function(){return this}});Ext.XTemplate.prototype.apply=Ext.XTemplate.prototype.applyTemplate;Ext.XTemplate.from=function(a){a=Ext.getDom(a);return new Ext.XTemplate(a.value||a.innerHTML)};Ext.util.CSS=function(){var d=null;var c=document;var b=/(-[a-z])/gi;var a=function(e,f){return f.charAt(1).toUpperCase()};return{createStyleSheet:function(h,k){var g;var f=c.getElementsByTagName("head")[0];var j=c.createElement("style");j.setAttribute("type","text/css");if(k){j.setAttribute("id",k)}if(Ext.isIE){f.appendChild(j);g=j.styleSheet;g.cssText=h}else{try{j.appendChild(c.createTextNode(h))}catch(i){j.cssText=h}f.appendChild(j);g=j.styleSheet?j.styleSheet:(j.sheet||c.styleSheets[c.styleSheets.length-1])}this.cacheStyleSheet(g);return g},removeStyleSheet:function(f){var e=c.getElementById(f);if(e){e.parentNode.removeChild(e)}},swapStyleSheet:function(g,e){this.removeStyleSheet(g);var f=c.createElement("link");f.setAttribute("rel","stylesheet");f.setAttribute("type","text/css");f.setAttribute("id",g);f.setAttribute("href",e);c.getElementsByTagName("head")[0].appendChild(f)},refreshCache:function(){return this.getRules(true)},cacheStyleSheet:function(g){if(!d){d={}}try{var i=g.cssRules||g.rules;for(var f=i.length-1;f>=0;--f){d[i[f].selectorText.toLowerCase()]=i[f]}}catch(h){}},getRules:function(g){if(d===null||g){d={};var j=c.styleSheets;for(var h=0,f=j.length;h<f;h++){try{this.cacheStyleSheet(j[h])}catch(k){}}}return d},getRule:function(e,g){var f=this.getRules(g);if(!Ext.isArray(e)){return f[e.toLowerCase()]}for(var h=0;h<e.length;h++){if(f[e[h]]){return f[e[h].toLowerCase()]}}return null},updateRule:function(e,h,g){if(!Ext.isArray(e)){var j=this.getRule(e);if(j){j.style[h.replace(b,a)]=g;return true}}else{for(var f=0;f<e.length;f++){if(this.updateRule(e[f],h,g)){return true}}}return false}}}();Ext.util.ClickRepeater=Ext.extend(Ext.util.Observable,{constructor:function(b,a){this.el=Ext.get(b);this.el.unselectable();Ext.apply(this,a);this.addEvents("mousedown","click","mouseup");if(!this.disabled){this.disabled=true;this.enable()}if(this.handler){this.on("click",this.handler,this.scope||this)}Ext.util.ClickRepeater.superclass.constructor.call(this)},interval:20,delay:250,preventDefault:true,stopDefault:false,timer:0,enable:function(){if(this.disabled){this.el.on("mousedown",this.handleMouseDown,this);if(Ext.isIE){this.el.on("dblclick",this.handleDblClick,this)}if(this.preventDefault||this.stopDefault){this.el.on("click",this.eventOptions,this)}}this.disabled=false},disable:function(a){if(a||!this.disabled){clearTimeout(this.timer);if(this.pressClass){this.el.removeClass(this.pressClass)}Ext.getDoc().un("mouseup",this.handleMouseUp,this);this.el.removeAllListeners()}this.disabled=true},setDisabled:function(a){this[a?"disable":"enable"]()},eventOptions:function(a){if(this.preventDefault){a.preventDefault()}if(this.stopDefault){a.stopEvent()}},destroy:function(){this.disable(true);Ext.destroy(this.el);this.purgeListeners()},handleDblClick:function(a){clearTimeout(this.timer);this.el.blur();this.fireEvent("mousedown",this,a);this.fireEvent("click",this,a)},handleMouseDown:function(a){clearTimeout(this.timer);this.el.blur();if(this.pressClass){this.el.addClass(this.pressClass)}this.mousedownTime=new Date();Ext.getDoc().on("mouseup",this.handleMouseUp,this);this.el.on("mouseout",this.handleMouseOut,this);this.fireEvent("mousedown",this,a);this.fireEvent("click",this,a);if(this.accelerate){this.delay=400}this.timer=this.click.defer(this.delay||this.interval,this,[a])},click:function(a){this.fireEvent("click",this,a);this.timer=this.click.defer(this.accelerate?this.easeOutExpo(this.mousedownTime.getElapsed(),400,-390,12000):this.interval,this,[a])},easeOutExpo:function(e,a,g,f){return(e==f)?a+g:g*(-Math.pow(2,-10*e/f)+1)+a},handleMouseOut:function(){clearTimeout(this.timer);if(this.pressClass){this.el.removeClass(this.pressClass)}this.el.on("mouseover",this.handleMouseReturn,this)},handleMouseReturn:function(){this.el.un("mouseover",this.handleMouseReturn,this);if(this.pressClass){this.el.addClass(this.pressClass)}this.click()},handleMouseUp:function(a){clearTimeout(this.timer);this.el.un("mouseover",this.handleMouseReturn,this);this.el.un("mouseout",this.handleMouseOut,this);Ext.getDoc().un("mouseup",this.handleMouseUp,this);this.el.removeClass(this.pressClass);this.fireEvent("mouseup",this,a)}});Ext.KeyNav=function(b,a){this.el=Ext.get(b);Ext.apply(this,a);if(!this.disabled){this.disabled=true;this.enable()}};Ext.KeyNav.prototype={disabled:false,defaultEventAction:"stopEvent",forceKeyDown:false,relay:function(c){var a=c.getKey(),b=this.keyToHandler[a];if(b&&this[b]){if(this.doRelay(c,this[b],b)!==true){c[this.defaultEventAction]()}}},doRelay:function(c,b,a){return b.call(this.scope||this,c,a)},enter:false,left:false,right:false,up:false,down:false,tab:false,esc:false,pageUp:false,pageDown:false,del:false,home:false,end:false,space:false,keyToHandler:{37:"left",39:"right",38:"up",40:"down",33:"pageUp",34:"pageDown",46:"del",36:"home",35:"end",13:"enter",27:"esc",9:"tab",32:"space"},stopKeyUp:function(b){var a=b.getKey();if(a>=37&&a<=40){b.stopEvent()}},destroy:function(){this.disable()},enable:function(){if(this.disabled){if(Ext.isSafari2){this.el.on("keyup",this.stopKeyUp,this)}this.el.on(this.isKeydown()?"keydown":"keypress",this.relay,this);this.disabled=false}},disable:function(){if(!this.disabled){if(Ext.isSafari2){this.el.un("keyup",this.stopKeyUp,this)}this.el.un(this.isKeydown()?"keydown":"keypress",this.relay,this);this.disabled=true}},setDisabled:function(a){this[a?"disable":"enable"]()},isKeydown:function(){return this.forceKeyDown||Ext.EventManager.useKeydown}};Ext.KeyMap=function(c,b,a){this.el=Ext.get(c);this.eventName=a||"keydown";this.bindings=[];if(b){this.addBinding(b)}this.enable()};Ext.KeyMap.prototype={stopEvent:false,addBinding:function(b){if(Ext.isArray(b)){Ext.each(b,function(j){this.addBinding(j)},this);return}var i=b.key,f=b.fn||b.handler,k=b.scope;if(b.stopEvent){this.stopEvent=b.stopEvent}if(typeof i=="string"){var g=[];var e=i.toUpperCase();for(var c=0,d=e.length;c<d;c++){g.push(e.charCodeAt(c))}i=g}var a=Ext.isArray(i);var h=function(n){if(this.checkModifiers(b,n)){var l=n.getKey();if(a){for(var m=0,j=i.length;m<j;m++){if(i[m]==l){if(this.stopEvent){n.stopEvent()}f.call(k||window,l,n);return}}}else{if(l==i){if(this.stopEvent){n.stopEvent()}f.call(k||window,l,n)}}}};this.bindings.push(h)},checkModifiers:function(b,g){var h,d,f=["shift","ctrl","alt"];for(var c=0,a=f.length;c<a;++c){d=f[c];h=b[d];if(!(h===undefined||(h===g[d+"Key"]))){return false}}return true},on:function(b,d,c){var g,a,e,f;if(typeof b=="object"&&!Ext.isArray(b)){g=b.key;a=b.shift;e=b.ctrl;f=b.alt}else{g=b}this.addBinding({key:g,shift:a,ctrl:e,alt:f,fn:d,scope:c})},handleKeyDown:function(f){if(this.enabled){var c=this.bindings;for(var d=0,a=c.length;d<a;d++){c[d].call(this,f)}}},isEnabled:function(){return this.enabled},enable:function(){if(!this.enabled){this.el.on(this.eventName,this.handleKeyDown,this);this.enabled=true}},disable:function(){if(this.enabled){this.el.removeListener(this.eventName,this.handleKeyDown,this);this.enabled=false}},setDisabled:function(a){this[a?"disable":"enable"]()}};Ext.util.TextMetrics=function(){var a;return{measure:function(b,c,d){if(!a){a=Ext.util.TextMetrics.Instance(b,d)}a.bind(b);a.setFixedWidth(d||"auto");return a.getSize(c)},createInstance:function(b,c){return Ext.util.TextMetrics.Instance(b,c)}}}();Ext.util.TextMetrics.Instance=function(b,d){var c=new Ext.Element(document.createElement("div"));document.body.appendChild(c.dom);c.position("absolute");c.setLeftTop(-1000,-1000);c.hide();if(d){c.setWidth(d)}var a={getSize:function(f){c.update(f);var e=c.getSize();c.update("");return e},bind:function(e){c.setStyle(Ext.fly(e).getStyles("font-size","font-style","font-weight","font-family","line-height","text-transform","letter-spacing"))},setFixedWidth:function(e){c.setWidth(e)},getWidth:function(e){c.dom.style.width="auto";return this.getSize(e).width},getHeight:function(e){return this.getSize(e).height}};a.bind(b);return a};Ext.Element.addMethods({getTextWidth:function(c,b,a){return(Ext.util.TextMetrics.measure(this.dom,Ext.value(c,this.dom.innerHTML,true)).width).constrain(b||0,a||1000000)}});Ext.util.Cookies={set:function(c,e){var a=arguments;var h=arguments.length;var b=(h>2)?a[2]:null;var g=(h>3)?a[3]:"/";var d=(h>4)?a[4]:null;var f=(h>5)?a[5]:false;document.cookie=c+"="+escape(e)+((b===null)?"":("; expires="+b.toGMTString()))+((g===null)?"":("; path="+g))+((d===null)?"":("; domain="+d))+((f===true)?"; secure":"")},get:function(d){var b=d+"=";var f=b.length;var a=document.cookie.length;var e=0;var c=0;while(e<a){c=e+f;if(document.cookie.substring(e,c)==b){return Ext.util.Cookies.getCookieVal(c)}e=document.cookie.indexOf(" ",e)+1;if(e===0){break}}return null},clear:function(a){if(Ext.util.Cookies.get(a)){document.cookie=a+"=; expires=Thu, 01-Jan-70 00:00:01 GMT"}},getCookieVal:function(b){var a=document.cookie.indexOf(";",b);if(a==-1){a=document.cookie.length}return unescape(document.cookie.substring(b,a))}};Ext.handleError=function(a){throw a};Ext.Error=function(a){this.message=(this.lang[a])?this.lang[a]:a};Ext.Error.prototype=new Error();Ext.apply(Ext.Error.prototype,{lang:{},name:"Ext.Error",getName:function(){return this.name},getMessage:function(){return this.message},toJson:function(){return Ext.encode(this)}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Toolbar=function(a){if(Ext.isArray(a)){a={items:a,layout:"toolbar"}}else{a=Ext.apply({layout:"toolbar"},a);if(a.buttons){a.items=a.buttons}}Ext.Toolbar.superclass.constructor.call(this,a)};(function(){var a=Ext.Toolbar;Ext.extend(a,Ext.Container,{defaultType:"button",enableOverflow:false,trackMenus:true,internalDefaults:{removeMode:"container",hideParent:true},toolbarCls:"x-toolbar",initComponent:function(){a.superclass.initComponent.call(this);this.addEvents("overflowchange")},onRender:function(c,b){if(!this.el){if(!this.autoCreate){this.autoCreate={cls:this.toolbarCls+" x-small-editor"}}this.el=c.createChild(Ext.apply({id:this.id},this.autoCreate),b);Ext.Toolbar.superclass.onRender.apply(this,arguments)}},lookupComponent:function(b){if(Ext.isString(b)){if(b=="-"){b=new a.Separator()}else{if(b==" "){b=new a.Spacer()}else{if(b=="->"){b=new a.Fill()}else{b=new a.TextItem(b)}}}this.applyDefaults(b)}else{if(b.isFormField||b.render){b=this.createComponent(b)}else{if(b.tag){b=new a.Item({autoEl:b})}else{if(b.tagName){b=new a.Item({el:b})}else{if(Ext.isObject(b)){b=b.xtype?this.createComponent(b):this.constructButton(b)}}}}}return b},applyDefaults:function(e){if(!Ext.isString(e)){e=Ext.Toolbar.superclass.applyDefaults.call(this,e);var b=this.internalDefaults;if(e.events){Ext.applyIf(e.initialConfig,b);Ext.apply(e,b)}else{Ext.applyIf(e,b)}}return e},addSeparator:function(){return this.add(new a.Separator())},addSpacer:function(){return this.add(new a.Spacer())},addFill:function(){this.add(new a.Fill())},addElement:function(b){return this.addItem(new a.Item({el:b}))},addItem:function(b){return this.add.apply(this,arguments)},addButton:function(c){if(Ext.isArray(c)){var e=[];for(var d=0,b=c.length;d<b;d++){e.push(this.addButton(c[d]))}return e}return this.add(this.constructButton(c))},addText:function(b){return this.addItem(new a.TextItem(b))},addDom:function(b){return this.add(new a.Item({autoEl:b}))},addField:function(b){return this.add(b)},insertButton:function(c,f){if(Ext.isArray(f)){var e=[];for(var d=0,b=f.length;d<b;d++){e.push(this.insertButton(c+d,f[d]))}return e}return Ext.Toolbar.superclass.insert.call(this,c,f)},trackMenu:function(c,b){if(this.trackMenus&&c.menu){var d=b?"mun":"mon";this[d](c,"menutriggerover",this.onButtonTriggerOver,this);this[d](c,"menushow",this.onButtonMenuShow,this);this[d](c,"menuhide",this.onButtonMenuHide,this)}},constructButton:function(d){var c=d.events?d:this.createComponent(d,d.split?"splitbutton":this.defaultType);return c},onAdd:function(b){Ext.Toolbar.superclass.onAdd.call(this);this.trackMenu(b);if(this.disabled){b.disable()}},onRemove:function(b){Ext.Toolbar.superclass.onRemove.call(this);if(b==this.activeMenuBtn){delete this.activeMenuBtn}this.trackMenu(b,true)},onDisable:function(){this.items.each(function(b){if(b.disable){b.disable()}})},onEnable:function(){this.items.each(function(b){if(b.enable){b.enable()}})},onButtonTriggerOver:function(b){if(this.activeMenuBtn&&this.activeMenuBtn!=b){this.activeMenuBtn.hideMenu();b.showMenu();this.activeMenuBtn=b}},onButtonMenuShow:function(b){this.activeMenuBtn=b},onButtonMenuHide:function(b){delete this.activeMenuBtn}});Ext.reg("toolbar",Ext.Toolbar);a.Item=Ext.extend(Ext.BoxComponent,{hideParent:true,enable:Ext.emptyFn,disable:Ext.emptyFn,focus:Ext.emptyFn});Ext.reg("tbitem",a.Item);a.Separator=Ext.extend(a.Item,{onRender:function(c,b){this.el=c.createChild({tag:"span",cls:"xtb-sep"},b)}});Ext.reg("tbseparator",a.Separator);a.Spacer=Ext.extend(a.Item,{onRender:function(c,b){this.el=c.createChild({tag:"div",cls:"xtb-spacer",style:this.width?"width:"+this.width+"px":""},b)}});Ext.reg("tbspacer",a.Spacer);a.Fill=Ext.extend(a.Item,{render:Ext.emptyFn,isFill:true});Ext.reg("tbfill",a.Fill);a.TextItem=Ext.extend(a.Item,{constructor:function(b){a.TextItem.superclass.constructor.call(this,Ext.isString(b)?{text:b}:b)},onRender:function(c,b){this.autoEl={cls:"xtb-text",html:this.text||""};a.TextItem.superclass.onRender.call(this,c,b)},setText:function(b){if(this.rendered){this.el.update(b)}else{this.text=b}}});Ext.reg("tbtext",a.TextItem);a.Button=Ext.extend(Ext.Button,{});a.SplitButton=Ext.extend(Ext.SplitButton,{});Ext.reg("tbbutton",a.Button);Ext.reg("tbsplit",a.SplitButton)})();Ext.ButtonGroup=Ext.extend(Ext.Panel,{baseCls:"x-btn-group",layout:"table",defaultType:"button",frame:true,internalDefaults:{removeMode:"container",hideParent:true},initComponent:function(){this.layoutConfig=this.layoutConfig||{};Ext.applyIf(this.layoutConfig,{columns:this.columns});if(!this.title){this.addClass("x-btn-group-notitle")}this.on("afterlayout",this.onAfterLayout,this);Ext.ButtonGroup.superclass.initComponent.call(this)},applyDefaults:function(b){b=Ext.ButtonGroup.superclass.applyDefaults.call(this,b);var a=this.internalDefaults;if(b.events){Ext.applyIf(b.initialConfig,a);Ext.apply(b,a)}else{Ext.applyIf(b,a)}return b},onAfterLayout:function(){var a=this.body.getFrameWidth("lr")+this.body.dom.firstChild.offsetWidth;this.body.setWidth(a);this.el.setWidth(a+this.getFrameWidth())}});Ext.reg("buttongroup",Ext.ButtonGroup);(function(){var a=Ext.Toolbar;Ext.PagingToolbar=Ext.extend(Ext.Toolbar,{pageSize:20,displayMsg:"Displaying {0} - {1} of {2}",emptyMsg:"No data to display",beforePageText:"Page",afterPageText:"of {0}",firstText:"First Page",prevText:"Previous Page",nextText:"Next Page",lastText:"Last Page",refreshText:"Refresh",initComponent:function(){var c=[this.first=new a.Button({tooltip:this.firstText,overflowText:this.firstText,iconCls:"x-tbar-page-first",disabled:true,handler:this.moveFirst,scope:this}),this.prev=new a.Button({tooltip:this.prevText,overflowText:this.prevText,iconCls:"x-tbar-page-prev",disabled:true,handler:this.movePrevious,scope:this}),"-",this.beforePageText,this.inputItem=new Ext.form.NumberField({cls:"x-tbar-page-number",allowDecimals:false,allowNegative:false,enableKeyEvents:true,selectOnFocus:true,submitValue:false,listeners:{scope:this,keydown:this.onPagingKeyDown,blur:this.onPagingBlur}}),this.afterTextItem=new a.TextItem({text:String.format(this.afterPageText,1)}),"-",this.next=new a.Button({tooltip:this.nextText,overflowText:this.nextText,iconCls:"x-tbar-page-next",disabled:true,handler:this.moveNext,scope:this}),this.last=new a.Button({tooltip:this.lastText,overflowText:this.lastText,iconCls:"x-tbar-page-last",disabled:true,handler:this.moveLast,scope:this}),"-",this.refresh=new a.Button({tooltip:this.refreshText,overflowText:this.refreshText,iconCls:"x-tbar-loading",handler:this.doRefresh,scope:this})];var b=this.items||this.buttons||[];if(this.prependButtons){this.items=b.concat(c)}else{this.items=c.concat(b)}delete this.buttons;if(this.displayInfo){this.items.push("->");this.items.push(this.displayItem=new a.TextItem({}))}Ext.PagingToolbar.superclass.initComponent.call(this);this.addEvents("change","beforechange");this.on("afterlayout",this.onFirstLayout,this,{single:true});this.cursor=0;this.bindStore(this.store,true)},onFirstLayout:function(){if(this.dsLoaded){this.onLoad.apply(this,this.dsLoaded)}},updateInfo:function(){if(this.displayItem){var b=this.store.getCount();var c=b==0?this.emptyMsg:String.format(this.displayMsg,this.cursor+1,this.cursor+b,this.store.getTotalCount());this.displayItem.setText(c)}},onLoad:function(b,e,i){if(!this.rendered){this.dsLoaded=[b,e,i];return}var f=this.getParams();this.cursor=(i.params&&i.params[f.start])?i.params[f.start]:0;var h=this.getPageData(),c=h.activePage,g=h.pages;this.afterTextItem.setText(String.format(this.afterPageText,h.pages));this.inputItem.setValue(c);this.first.setDisabled(c==1);this.prev.setDisabled(c==1);this.next.setDisabled(c==g);this.last.setDisabled(c==g);this.refresh.enable();this.updateInfo();this.fireEvent("change",this,h)},getPageData:function(){var b=this.store.getTotalCount();return{total:b,activePage:Math.ceil((this.cursor+this.pageSize)/this.pageSize),pages:b<this.pageSize?1:Math.ceil(b/this.pageSize)}},changePage:function(b){this.doLoad(((b-1)*this.pageSize).constrain(0,this.store.getTotalCount()))},onLoadError:function(){if(!this.rendered){return}this.refresh.enable()},readPage:function(e){var b=this.inputItem.getValue(),c;if(!b||isNaN(c=parseInt(b,10))){this.inputItem.setValue(e.activePage);return false}return c},onPagingFocus:function(){this.inputItem.select()},onPagingBlur:function(b){this.inputItem.setValue(this.getPageData().activePage)},onPagingKeyDown:function(h,g){var c=g.getKey(),i=this.getPageData(),f;if(c==g.RETURN){g.stopEvent();f=this.readPage(i);if(f!==false){f=Math.min(Math.max(1,f),i.pages)-1;this.doLoad(f*this.pageSize)}}else{if(c==g.HOME||c==g.END){g.stopEvent();f=c==g.HOME?1:i.pages;h.setValue(f)}else{if(c==g.UP||c==g.PAGEUP||c==g.DOWN||c==g.PAGEDOWN){g.stopEvent();if((f=this.readPage(i))){var b=g.shiftKey?10:1;if(c==g.DOWN||c==g.PAGEDOWN){b*=-1}f+=b;if(f>=1&f<=i.pages){h.setValue(f)}}}}}},getParams:function(){return this.paramNames||this.store.paramNames},beforeLoad:function(){if(this.rendered&&this.refresh){this.refresh.disable()}},doLoad:function(d){var c={},b=this.getParams();c[b.start]=d;c[b.limit]=this.pageSize;if(this.fireEvent("beforechange",this,c)!==false){this.store.load({params:c})}},moveFirst:function(){this.doLoad(0)},movePrevious:function(){this.doLoad(Math.max(0,this.cursor-this.pageSize))},moveNext:function(){this.doLoad(this.cursor+this.pageSize)},moveLast:function(){var c=this.store.getTotalCount(),b=c%this.pageSize;this.doLoad(b?(c-b):c-this.pageSize)},doRefresh:function(){this.doLoad(this.cursor)},bindStore:function(c,d){var b;if(!d&&this.store){if(c!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.beforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.onLoadError,this)}if(!c){this.store=null}}if(c){c=Ext.StoreMgr.lookup(c);c.on({scope:this,beforeload:this.beforeLoad,load:this.onLoad,exception:this.onLoadError});b=true}this.store=c;if(b){this.onLoad(c,null,{})}},unbind:function(b){this.bindStore(null)},bind:function(b){this.bindStore(b)},onDestroy:function(){this.bindStore(null);Ext.PagingToolbar.superclass.onDestroy.call(this)}})})();Ext.reg("paging",Ext.PagingToolbar);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu-debug.js	(revision 76)
@@ -0,0 +1,1727 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.Menu
+ * @extends Ext.Container
+ * <p>A menu object.  This is the container to which you may add menu items.  Menu can also serve as a base class
+ * when you want a specialized menu based off of another component (like {@link Ext.menu.DateMenu} for example).</p>
+ * <p>Menus may contain either {@link Ext.menu.Item menu items}, or general {@link Ext.Component Component}s.</p>
+ * <p>To make a contained general {@link Ext.Component Component} line up with other {@link Ext.menu.Item menu items}
+ * specify <tt>iconCls: 'no-icon'</tt>.  This reserves a space for an icon, and indents the Component in line
+ * with the other menu items.  See {@link Ext.form.ComboBox}.{@link Ext.form.ComboBox#getListParent getListParent}
+ * for an example.</p>
+ * <p>By default, Menus are absolutely positioned, floating Components. By configuring a Menu with
+ * <b><tt>{@link #floating}:false</tt></b>, a Menu may be used as child of a Container.</p>
+ *
+ * @xtype menu
+ */
+Ext.menu.Menu = Ext.extend(Ext.Container, {
+    /**
+     * @cfg {Object} defaults
+     * A config object that will be applied to all items added to this container either via the {@link #items}
+     * config or via the {@link #add} method.  The defaults config can contain any number of
+     * name/value property pairs to be added to each item, and should be valid for the types of items
+     * being added to the menu.
+     */
+    /**
+     * @cfg {Mixed} items
+     * An array of items to be added to this menu. Menus may contain either {@link Ext.menu.Item menu items},
+     * or general {@link Ext.Component Component}s.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the menu in pixels (defaults to 120)
+     */
+    minWidth : 120,
+    /**
+     * @cfg {Boolean/String} shadow True or 'sides' for the default effect, 'frame' for 4-way shadow, and 'drop'
+     * for bottom-right shadow (defaults to 'sides')
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String} subMenuAlign The {@link Ext.Element#alignTo} anchor position value to use for submenus of
+     * this menu (defaults to 'tl-tr?')
+     */
+    subMenuAlign : 'tl-tr?',
+    /**
+     * @cfg {String} defaultAlign The default {@link Ext.Element#alignTo} anchor position value for this menu
+     * relative to its element of origin (defaults to 'tl-bl?')
+     */
+    defaultAlign : 'tl-bl?',
+    /**
+     * @cfg {Boolean} allowOtherMenus True to allow multiple menus to be displayed at the same time (defaults to false)
+     */
+    allowOtherMenus : false,
+    /**
+     * @cfg {Boolean} ignoreParentClicks True to ignore clicks on any item in this menu that is a parent item (displays
+     * a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false).
+     */
+    ignoreParentClicks : false,
+    /**
+     * @cfg {Boolean} enableScrolling True to allow the menu container to have scroller controls if the menu is too long (defaults to true).
+     */
+    enableScrolling : true,
+    /**
+     * @cfg {Number} maxHeight The maximum height of the menu. Only applies when enableScrolling is set to True (defaults to null).
+     */
+    maxHeight : null,
+    /**
+     * @cfg {Number} scrollIncrement The amount to scroll the menu. Only applies when enableScrolling is set to True (defaults to 24).
+     */
+    scrollIncrement : 24,
+    /**
+     * @cfg {Boolean} showSeparator True to show the icon separator. (defaults to true).
+     */
+    showSeparator : true,
+    /**
+     * @cfg {Array} defaultOffsets An array specifying the [x, y] offset in pixels by which to
+     * change the default Menu popup position after aligning according to the {@link #defaultAlign}
+     * configuration. Defaults to <tt>[0, 0]</tt>.
+     */
+    defaultOffsets : [0, 0],
+
+    /**
+     * @cfg {Boolean} plain
+     * True to remove the incised line down the left side of the menu. Defaults to <tt>false</tt>.
+     */
+    plain : false,
+
+    /**
+     * @cfg {Boolean} floating
+     * <p>By default, a Menu configured as <b><code>floating:true</code></b>
+     * will be rendered as an {@link Ext.Layer} (an absolutely positioned,
+     * floating Component with zindex=15000).
+     * If configured as <b><code>floating:false</code></b>, the Menu may be
+     * used as child item of another Container instead of a free-floating
+     * {@link Ext.Layer Layer}.
+     */
+    floating : true,
+
+
+    /**
+     * @cfg {Number} zIndex
+     * zIndex to use when the menu is floating.
+     */
+    zIndex: 15000,
+
+    // private
+    hidden : true,
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>menu</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout is required.
+     * See {@link Ext.Container#layout} for additional information.
+     */
+    layout : 'menu',
+    hideMode : 'offsets',    // Important for laying out Components
+    scrollerHeight : 8,
+    autoLayout : true,       // Provided for backwards compat
+    defaultType : 'menuitem',
+    bufferResize : false,
+
+    initComponent : function(){
+        if(Ext.isArray(this.initialConfig)){
+            Ext.apply(this, {items:this.initialConfig});
+        }
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this menu is clicked (or when the enter key is pressed while it is active)
+             * @param {Ext.menu.Menu} this
+            * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event mouseover
+             * Fires when the mouse is hovering over this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseout',
+            /**
+             * @event itemclick
+             * Fires when a menu item contained in this menu is clicked
+             * @param {Ext.menu.BaseItem} baseItem The BaseItem that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'itemclick'
+        );
+        Ext.menu.MenuMgr.register(this);
+        if(this.floating){
+            Ext.EventManager.onWindowResize(this.hide, this);
+        }else{
+            if(this.initialConfig.hidden !== false){
+                this.hidden = false;
+            }
+            this.internalDefaults = {hideOnClick: false};
+        }
+        Ext.menu.Menu.superclass.initComponent.call(this);
+        if(this.autoLayout){
+            var fn = this.doLayout.createDelegate(this, []);
+            this.on({
+                add: fn,
+                remove: fn
+            });
+        }
+    },
+
+    //private
+    getLayoutTarget : function() {
+        return this.ul;
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!ct){
+            ct = Ext.getBody();
+        }
+
+        var dh = {
+            id: this.getId(),
+            cls: 'x-menu ' + ((this.floating) ? 'x-menu-floating x-layer ' : '') + (this.cls || '') + (this.plain ? ' x-menu-plain' : '') + (this.showSeparator ? '' : ' x-menu-nosep'),
+            style: this.style,
+            cn: [
+                {tag: 'a', cls: 'x-menu-focus', href: '#', onclick: 'return false;', tabIndex: '-1'},
+                {tag: 'ul', cls: 'x-menu-list'}
+            ]
+        };
+        if(this.floating){
+            this.el = new Ext.Layer({
+                shadow: this.shadow,
+                dh: dh,
+                constrain: false,
+                parentEl: ct,
+                zindex: this.zIndex
+            });
+        }else{
+            this.el = ct.createChild(dh);
+        }
+        Ext.menu.Menu.superclass.onRender.call(this, ct, position);
+
+        if(!this.keyNav){
+            this.keyNav = new Ext.menu.MenuNav(this);
+        }
+        // generic focus element
+        this.focusEl = this.el.child('a.x-menu-focus');
+        this.ul = this.el.child('ul.x-menu-list');
+        this.mon(this.ul, {
+            scope: this,
+            click: this.onClick,
+            mouseover: this.onMouseOver,
+            mouseout: this.onMouseOut
+        });
+        if(this.enableScrolling){
+            this.mon(this.el, {
+                scope: this,
+                delegate: '.x-menu-scroller',
+                click: this.onScroll,
+                mouseover: this.deactivateActive
+            });
+        }
+    },
+
+    // private
+    findTargetItem : function(e){
+        var t = e.getTarget('.x-menu-list-item', this.ul, true);
+        if(t && t.menuItemId){
+            return this.items.get(t.menuItemId);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.isFormField){
+                this.setActiveItem(t);
+            }else if(t instanceof Ext.menu.BaseItem){
+                if(t.menu && this.ignoreParentClicks){
+                    t.expandMenu();
+                    e.preventDefault();
+                }else if(t.onClick){
+                    t.onClick(e);
+                    this.fireEvent('click', this, t, e);
+                }
+            }
+        }
+    },
+
+    // private
+    setActiveItem : function(item, autoExpand){
+        if(item != this.activeItem){
+            this.deactivateActive();
+            if((this.activeItem = item).isFormField){
+                item.focus();
+            }else{
+                item.activate(autoExpand);
+            }
+        }else if(autoExpand){
+            item.expandMenu();
+        }
+    },
+
+    deactivateActive : function(){
+        var a = this.activeItem;
+        if(a){
+            if(a.isFormField){
+                //Fields cannot deactivate, but Combos must collapse
+                if(a.collapse){
+                    a.collapse();
+                }
+            }else{
+                a.deactivate();
+            }
+            delete this.activeItem;
+        }
+    },
+
+    // private
+    tryActivate : function(start, step){
+        var items = this.items;
+        for(var i = start, len = items.length; i >= 0 && i < len; i+= step){
+            var item = items.get(i);
+            if(item.isVisible() && !item.disabled && (item.canActivate || item.isFormField)){
+                this.setActiveItem(item, false);
+                return item;
+            }
+        }
+        return false;
+    },
+
+    // private
+    onMouseOver : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.canActivate && !t.disabled){
+                this.setActiveItem(t, true);
+            }
+        }
+        this.over = true;
+        this.fireEvent('mouseover', this, e, t);
+    },
+
+    // private
+    onMouseOut : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t == this.activeItem && t.shouldDeactivate && t.shouldDeactivate(e)){
+                this.activeItem.deactivate();
+                delete this.activeItem;
+            }
+        }
+        this.over = false;
+        this.fireEvent('mouseout', this, e, t);
+    },
+
+    // private
+    onScroll : function(e, t){
+        if(e){
+            e.stopEvent();
+        }
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        ul.scrollTop += this.scrollIncrement * (top ? -1 : 1);
+        if(top ? ul.scrollTop <= 0 : ul.scrollTop + this.activeMax >= ul.scrollHeight){
+           this.onScrollerOut(null, t);
+        }
+    },
+
+    // private
+    onScrollerIn : function(e, t){
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        if(top ? ul.scrollTop > 0 : ul.scrollTop + this.activeMax < ul.scrollHeight){
+            Ext.fly(t).addClass(['x-menu-item-active', 'x-menu-scroller-active']);
+        }
+    },
+
+    // private
+    onScrollerOut : function(e, t){
+        Ext.fly(t).removeClass(['x-menu-item-active', 'x-menu-scroller-active']);
+    },
+
+    /**
+     * If <code>{@link #floating}=true</code>, shows this menu relative to
+     * another element using {@link #showat}, otherwise uses {@link Ext.Component#show}.
+     * @param {Mixed} element The element to align to
+     * @param {String} position (optional) The {@link Ext.Element#alignTo} anchor position to use in aligning to
+     * the element (defaults to this.defaultAlign)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    show : function(el, pos, parentMenu){
+        if(this.floating){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+                this.doLayout(false, true);
+            }
+            this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign, this.defaultOffsets), parentMenu);
+        }else{
+            Ext.menu.Menu.superclass.show.call(this);
+        }
+    },
+
+    /**
+     * Displays this menu at a specific xy position and fires the 'show' event if a
+     * handler for the 'beforeshow' event does not return false cancelling the operation.
+     * @param {Array} xyPosition Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    showAt : function(xy, parentMenu){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+            }
+            if(this.enableScrolling){
+                // set the position so we can figure out the constrain value.
+                this.el.setXY(xy);
+                //constrain the value, keep the y coordinate the same
+                xy[1] = this.constrainScroll(xy[1]);
+                xy = [this.el.adjustForConstraints(xy)[0], xy[1]];
+            }else{
+                //constrain to the viewport.
+                xy = this.el.adjustForConstraints(xy);
+            }
+            this.el.setXY(xy);
+            this.el.show();
+            Ext.menu.Menu.superclass.onShow.call(this);
+            if(Ext.isIE){
+                // internal event, used so we don't couple the layout to the menu
+                this.fireEvent('autosize', this);
+                if(!Ext.isIE8){
+                    this.el.repaint();
+                }
+            }
+            this.hidden = false;
+            this.focus();
+            this.fireEvent('show', this);
+        }
+    },
+
+    constrainScroll : function(y){
+        var max, full = this.ul.setHeight('auto').getHeight(),
+            returnY = y, normalY, parentEl, scrollTop, viewHeight;
+        if(this.floating){
+            parentEl = Ext.fly(this.el.dom.parentNode);
+            scrollTop = parentEl.getScroll().top;
+            viewHeight = parentEl.getViewSize().height;
+            //Normalize y by the scroll position for the parent element.  Need to move it into the coordinate space
+            //of the view.
+            normalY = y - scrollTop;
+            max = this.maxHeight ? this.maxHeight : viewHeight - normalY;
+            if(full > viewHeight) {
+                max = viewHeight;
+                //Set returnY equal to (0,0) in view space by reducing y by the value of normalY
+                returnY = y - normalY;
+            } else if(max < full) {
+                returnY = y - (full - max);
+                max = full;
+            }
+        }else{
+            max = this.getHeight();
+        }
+        // Always respect maxHeight 
+        if (this.maxHeight){
+            max = Math.min(this.maxHeight, max);
+        }
+        if(full > max && max > 0){
+            this.activeMax = max - this.scrollerHeight * 2 - this.el.getFrameWidth('tb') - Ext.num(this.el.shadowOffset, 0);
+            this.ul.setHeight(this.activeMax);
+            this.createScrollers();
+            this.el.select('.x-menu-scroller').setDisplayed('');
+        }else{
+            this.ul.setHeight(full);
+            this.el.select('.x-menu-scroller').setDisplayed('none');
+        }
+        this.ul.dom.scrollTop = 0;
+        return returnY;
+    },
+
+    createScrollers : function(){
+        if(!this.scroller){
+            this.scroller = {
+                pos: 0,
+                top: this.el.insertFirst({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-top',
+                    html: '&#160;'
+                }),
+                bottom: this.el.createChild({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-bottom',
+                    html: '&#160;'
+                })
+            };
+            this.scroller.top.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.topRepeater = new Ext.util.ClickRepeater(this.scroller.top, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.top], false)
+                }
+            });
+            this.scroller.bottom.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.bottomRepeater = new Ext.util.ClickRepeater(this.scroller.bottom, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.bottom], false)
+                }
+            });
+        }
+    },
+
+    onLayout : function(){
+        if(this.isVisible()){
+            if(this.enableScrolling){
+                this.constrainScroll(this.el.getTop());
+            }
+            if(this.floating){
+                this.el.sync();
+            }
+        }
+    },
+
+    focus : function(){
+        if(!this.hidden){
+            this.doFocus.defer(50, this);
+        }
+    },
+
+    doFocus : function(){
+        if(!this.hidden){
+            this.focusEl.focus();
+        }
+    },
+
+    /**
+     * Hides this menu and optionally all parent menus
+     * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
+     */
+    hide : function(deep){
+        if (!this.isDestroyed) {
+            this.deepHide = deep;
+            Ext.menu.Menu.superclass.hide.call(this);
+            delete this.deepHide;
+        }
+    },
+
+    // private
+    onHide : function(){
+        Ext.menu.Menu.superclass.onHide.call(this);
+        this.deactivateActive();
+        if(this.el && this.floating){
+            this.el.hide();
+        }
+        var pm = this.parentMenu;
+        if(this.deepHide === true && pm){
+            if(pm.floating){
+                pm.hide(true);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+
+    // private
+    lookupComponent : function(c){
+         if(Ext.isString(c)){
+            c = (c == 'separator' || c == '-') ? new Ext.menu.Separator() : new Ext.menu.TextItem(c);
+             this.applyDefaults(c);
+         }else{
+            if(Ext.isObject(c)){
+                c = this.getMenuItem(c);
+            }else if(c.tagName || c.el){ // element. Wrap it.
+                c = new Ext.BoxComponent({
+                    el: c
+                });
+            }
+         }
+         return c;
+    },
+
+    applyDefaults : function(c) {
+        if (!Ext.isString(c)) {
+            c = Ext.menu.Menu.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(d){
+                if(c.events){
+                    Ext.applyIf(c.initialConfig, d);
+                    Ext.apply(c, d);
+                }else{
+                    Ext.applyIf(c, d);
+                }
+            }
+        }
+        return c;
+    },
+
+    // private
+    getMenuItem : function(config) {
+        config.ownerCt = this;
+        
+        if (!config.isXType) {
+            if (!config.xtype && Ext.isBoolean(config.checked)) {
+                return new Ext.menu.CheckItem(config);
+            }
+            return Ext.create(config, this.defaultType);
+        }
+        return config;
+    },
+
+    /**
+     * Adds a separator bar to the menu
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addSeparator : function() {
+        return this.add(new Ext.menu.Separator());
+    },
+
+    /**
+     * Adds an {@link Ext.Element} object to the menu
+     * @param {Mixed} el The element or DOM node to add, or its id
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addElement : function(el) {
+        return this.add(new Ext.menu.BaseItem({
+            el: el
+        }));
+    },
+
+    /**
+     * Adds an existing object based on {@link Ext.menu.BaseItem} to the menu
+     * @param {Ext.menu.Item} item The menu item to add
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addItem : function(item) {
+        return this.add(item);
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.Item} based an the supplied config object and adds it to the menu
+     * @param {Object} config A MenuItem config object
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addMenuItem : function(config) {
+        return this.add(this.getMenuItem(config));
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.TextItem} with the supplied text and adds it to the menu
+     * @param {String} text The text to display in the menu item
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addText : function(text){
+        return this.add(new Ext.menu.TextItem(text));
+    },
+
+    //private
+    onDestroy : function(){
+        Ext.EventManager.removeResizeListener(this.hide, this);
+        var pm = this.parentMenu;
+        if(pm && pm.activeChild == this){
+            delete pm.activeChild;
+        }
+        delete this.parentMenu;
+        Ext.menu.Menu.superclass.onDestroy.call(this);
+        Ext.menu.MenuMgr.unregister(this);
+        if(this.keyNav) {
+            this.keyNav.disable();
+        }
+        var s = this.scroller;
+        if(s){
+            Ext.destroy(s.topRepeater, s.bottomRepeater, s.top, s.bottom);
+        }
+        Ext.destroy(
+            this.el,
+            this.focusEl,
+            this.ul
+        );
+    }
+});
+
+Ext.reg('menu', Ext.menu.Menu);
+
+// MenuNav is a private utility class used internally by the Menu
+Ext.menu.MenuNav = Ext.extend(Ext.KeyNav, function(){
+    function up(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){
+            m.tryActivate(m.items.length-1, -1);
+        }
+    }
+    function down(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){
+            m.tryActivate(0, 1);
+        }
+    }
+    return {
+        constructor : function(menu){
+            Ext.menu.MenuNav.superclass.constructor.call(this, menu.el);
+            this.scope = this.menu = menu;
+        },
+
+        doRelay : function(e, h){
+            var k = e.getKey();
+//          Keystrokes within a form Field (e.g.: down in a Combo) do not navigate. Allow only TAB
+            if (this.menu.activeItem && this.menu.activeItem.isFormField && k != e.TAB) {
+                return false;
+            }
+            if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){
+                this.menu.tryActivate(0, 1);
+                return false;
+            }
+            return h.call(this.scope || this, e, this.menu);
+        },
+
+        tab: function(e, m) {
+            e.stopEvent();
+            if (e.shiftKey) {
+                up(e, m);
+            } else {
+                down(e, m);
+            }
+        },
+
+        up : up,
+
+        down : down,
+
+        right : function(e, m){
+            if(m.activeItem){
+                m.activeItem.expandMenu(true);
+            }
+        },
+
+        left : function(e, m){
+            m.hide();
+            if(m.parentMenu && m.parentMenu.activeItem){
+                m.parentMenu.activeItem.activate();
+            }
+        },
+
+        enter : function(e, m){
+            if(m.activeItem){
+                e.stopPropagation();
+                m.activeItem.onClick(e);
+                m.fireEvent('click', this, m.activeItem);
+                return true;
+            }
+        }
+    };
+}());
+/**
+ * @class Ext.menu.MenuMgr
+ * Provides a common registry of all menu items on a page so that they can be easily accessed by id.
+ * @singleton
+ */
+Ext.menu.MenuMgr = function(){
+   var menus, 
+       active, 
+       map,
+       groups = {}, 
+       attached = false, 
+       lastShow = new Date();
+   
+
+   // private - called when first menu is created
+   function init(){
+       menus = {};
+       active = new Ext.util.MixedCollection();
+       map = Ext.getDoc().addKeyListener(27, hideAll);
+       map.disable();
+   }
+
+   // private
+   function hideAll(){
+       if(active && active.length > 0){
+           var c = active.clone();
+           c.each(function(m){
+               m.hide();
+           });
+           return true;
+       }
+       return false;
+   }
+
+   // private
+   function onHide(m){
+       active.remove(m);
+       if(active.length < 1){
+           map.disable();
+           Ext.getDoc().un("mousedown", onMouseDown);
+           attached = false;
+       }
+   }
+
+   // private
+   function onShow(m){
+       var last = active.last();
+       lastShow = new Date();
+       active.add(m);
+       if(!attached){
+           map.enable();
+           Ext.getDoc().on("mousedown", onMouseDown);
+           attached = true;
+       }
+       if(m.parentMenu){
+          m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3);
+          m.parentMenu.activeChild = m;
+       }else if(last && !last.isDestroyed && last.isVisible()){
+          m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3);
+       }
+   }
+
+   // private
+   function onBeforeHide(m){
+       if(m.activeChild){
+           m.activeChild.hide();
+       }
+       if(m.autoHideTimer){
+           clearTimeout(m.autoHideTimer);
+           delete m.autoHideTimer;
+       }
+   }
+
+   // private
+   function onBeforeShow(m){
+       var pm = m.parentMenu;
+       if(!pm && !m.allowOtherMenus){
+           hideAll();
+       }else if(pm && pm.activeChild){
+           pm.activeChild.hide();
+       }
+   }
+
+   // private
+   function onMouseDown(e){
+       if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){
+           hideAll();
+       }
+   }
+
+   return {
+
+       /**
+        * Hides all menus that are currently visible
+        * @return {Boolean} success True if any active menus were hidden.
+        */
+       hideAll : function(){
+            return hideAll();
+       },
+
+       // private
+       register : function(menu){
+           if(!menus){
+               init();
+           }
+           menus[menu.id] = menu;
+           menu.on({
+               beforehide: onBeforeHide,
+               hide: onHide,
+               beforeshow: onBeforeShow,
+               show: onShow
+           });
+       },
+
+        /**
+         * Returns a {@link Ext.menu.Menu} object
+         * @param {String/Object} menu The string menu id, an existing menu object reference, or a Menu config that will
+         * be used to generate and return a new Menu instance.
+         * @return {Ext.menu.Menu} The specified menu, or null if none are found
+         */
+       get : function(menu){
+           if(typeof menu == "string"){ // menu id
+               if(!menus){  // not initialized, no menus to return
+                   return null;
+               }
+               return menus[menu];
+           }else if(menu.events){  // menu instance
+               return menu;
+           }else if(typeof menu.length == 'number'){ // array of menu items?
+               return new Ext.menu.Menu({items:menu});
+           }else{ // otherwise, must be a config
+               return Ext.create(menu, 'menu');
+           }
+       },
+
+       // private
+       unregister : function(menu){
+           delete menus[menu.id];
+           menu.un("beforehide", onBeforeHide);
+           menu.un("hide", onHide);
+           menu.un("beforeshow", onBeforeShow);
+           menu.un("show", onShow);
+       },
+
+       // private
+       registerCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               if(!groups[g]){
+                   groups[g] = [];
+               }
+               groups[g].push(menuItem);
+           }
+       },
+
+       // private
+       unregisterCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               groups[g].remove(menuItem);
+           }
+       },
+       
+       // private
+       onCheckChange: function(item, state){
+           if(item.group && state){
+               var group = groups[item.group],
+                   i = 0,
+                   len = group.length,
+                   current;
+                   
+               for(; i < len; i++){
+                   current = group[i];
+                   if(current != item){
+                       current.setChecked(false);
+                   }
+               }
+           }
+       },
+
+       getCheckedItem : function(groupId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].checked){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       },
+
+       setCheckedItem : function(groupId, itemId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].id == itemId){
+                       g[i].setChecked(true);
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+/**
+ * @class Ext.menu.BaseItem
+ * @extends Ext.Component
+ * The base class for all items that render into menus.  BaseItem provides default rendering, activated state
+ * management and base configuration options shared by all menu components.
+ * @constructor
+ * Creates a new BaseItem
+ * @param {Object} config Configuration options
+ * @xtype menubaseitem
+ */
+Ext.menu.BaseItem = Ext.extend(Ext.Component, {
+    /**
+     * @property parentMenu
+     * @type Ext.menu.Menu
+     * The parent Menu of this Item.
+     */
+    /**
+     * @cfg {Function} handler
+     * A function that will handle the click event of this menu item (optional).
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>b</code> : Item<div class="sub-desc">This menu Item.</div></li>
+     * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the handler function will be called.
+     */
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to false)
+     */
+    canActivate : false,
+    /**
+     * @cfg {String} activeClass The CSS class to use when the item becomes activated (defaults to "x-menu-item-active")
+     */
+    activeClass : "x-menu-item-active",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to true)
+     */
+    hideOnClick : true,
+    /**
+     * @cfg {Number} clickHideDelay Length of time in milliseconds to wait before hiding after a click (defaults to 1)
+     */
+    clickHideDelay : 1,
+
+    // private
+    ctype : "Ext.menu.BaseItem",
+
+    // private
+    actionMode : "container",
+
+    initComponent : function(){
+        Ext.menu.BaseItem.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this item is clicked
+             * @param {Ext.menu.BaseItem} this
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event activate
+             * Fires when this item is activated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires when this item is deactivated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'deactivate'
+        );
+        if(this.handler){
+            this.on("click", this.handler, this.scope);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        Ext.menu.BaseItem.superclass.onRender.apply(this, arguments);
+        if(this.ownerCt && this.ownerCt instanceof Ext.menu.Menu){
+            this.parentMenu = this.ownerCt;
+        }else{
+            this.container.addClass('x-menu-list-item');
+            this.mon(this.el, {
+                scope: this,
+                click: this.onClick,
+                mouseenter: this.activate,
+                mouseleave: this.deactivate
+            });
+        }
+    },
+
+    /**
+     * Sets the function that will handle click events for this item (equivalent to passing in the {@link #handler}
+     * config property).  If an existing handler is already registered, it will be unregistered for you.
+     * @param {Function} handler The function that should be called on click
+     * @param {Object} scope The scope (<code>this</code> reference) in which the handler function is executed. Defaults to this menu item.
+     */
+    setHandler : function(handler, scope){
+        if(this.handler){
+            this.un("click", this.handler, this.scope);
+        }
+        this.on("click", this.handler = handler, this.scope = scope);
+    },
+
+    // private
+    onClick : function(e){
+        if(!this.disabled && this.fireEvent("click", this, e) !== false
+                && (this.parentMenu && this.parentMenu.fireEvent("itemclick", this, e) !== false)){
+            this.handleClick(e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    activate : function(){
+        if(this.disabled){
+            return false;
+        }
+        var li = this.container;
+        li.addClass(this.activeClass);
+        this.region = li.getRegion().adjust(2, 2, -2, -2);
+        this.fireEvent("activate", this);
+        return true;
+    },
+
+    // private
+    deactivate : function(){
+        this.container.removeClass(this.activeClass);
+        this.fireEvent("deactivate", this);
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        return !this.region || !this.region.contains(e.getPoint());
+    },
+
+    // private
+    handleClick : function(e){
+        var pm = this.parentMenu;
+        if(this.hideOnClick){
+            if(pm.floating){
+                this.clickHideDelayTimer = pm.hide.defer(this.clickHideDelay, pm, [true]);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+    
+    beforeDestroy: function(){
+        clearTimeout(this.clickHideDelayTimer);
+        Ext.menu.BaseItem.superclass.beforeDestroy.call(this);    
+    },
+
+    // private. Do nothing
+    expandMenu : Ext.emptyFn,
+
+    // private. Do nothing
+    hideMenu : Ext.emptyFn
+});
+Ext.reg('menubaseitem', Ext.menu.BaseItem);/**
+ * @class Ext.menu.TextItem
+ * @extends Ext.menu.BaseItem
+ * Adds a static text string to a menu, usually used as either a heading or group separator.
+ * @constructor
+ * Creates a new TextItem
+ * @param {Object/String} config If config is a string, it is used as the text to display, otherwise it
+ * is applied as a config object (and should contain a <tt>text</tt> property).
+ * @xtype menutextitem
+ */
+Ext.menu.TextItem = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} text The text to display for this item (defaults to '')
+     */
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    /**
+     * @cfg {String} itemCls The default CSS class to use for text items (defaults to "x-menu-text")
+     */
+    itemCls : "x-menu-text",
+    
+    constructor : function(config) {
+        if (typeof config == 'string') {
+            config = {
+                text: config
+            };
+        }
+        Ext.menu.TextItem.superclass.constructor.call(this, config);
+    },
+
+    // private
+    onRender : function() {
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = this.text;
+        this.el = s;
+        Ext.menu.TextItem.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menutextitem', Ext.menu.TextItem);/**
+ * @class Ext.menu.Separator
+ * @extends Ext.menu.BaseItem
+ * Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will
+ * add one of these by using "-" in you call to add() or in your items config rather than creating one directly.
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype menuseparator
+ */
+Ext.menu.Separator = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} itemCls The default CSS class to use for separators (defaults to "x-menu-sep")
+     */
+    itemCls : "x-menu-sep",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    
+    /** 
+     * @cfg {String} activeClass
+     * @hide 
+     */
+    activeClass: '',
+
+    // private
+    onRender : function(li){
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = "&#160;";
+        this.el = s;
+        li.addClass("x-menu-sep-li");
+        Ext.menu.Separator.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menuseparator', Ext.menu.Separator);/**
+ * @class Ext.menu.Item
+ * @extends Ext.menu.BaseItem
+ * A base class for all menu items that require menu-related functionality (like sub-menus) and are not static
+ * display items.  Item extends the base functionality of {@link Ext.menu.BaseItem} by adding menu-specific
+ * activation and click handling.
+ * @constructor
+ * Creates a new Item
+ * @param {Object} config Configuration options
+ * @xtype menuitem
+ */
+Ext.menu.Item = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @property menu
+     * @type Ext.menu.Menu
+     * The submenu associated with this Item if one was configured.
+     */
+    /**
+     * @cfg {Mixed} menu (optional) Either an instance of {@link Ext.menu.Menu} or the config object for an
+     * {@link Ext.menu.Menu} which acts as the submenu when this item is activated.
+     */
+    /**
+     * @cfg {String} icon The path to an icon to display in this item (defaults to Ext.BLANK_IMAGE_URL).  If
+     * icon is specified {@link #iconCls} should not be.
+     */
+    /**
+     * @cfg {String} iconCls A CSS class that specifies a background image that will be used as the icon for
+     * this item (defaults to '').  If iconCls is specified {@link #icon} should not be.
+     */
+    /**
+     * @cfg {String} text The text to display in this item (defaults to '').
+     */
+    /**
+     * @cfg {String} href The href attribute to use for the underlying anchor link (defaults to '#').
+     */
+    /**
+     * @cfg {String} hrefTarget The target attribute to use for the underlying anchor link (defaults to '').
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for menu items (defaults to 'x-menu-item')
+     */
+    itemCls : 'x-menu-item',
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to true)
+     */
+    canActivate : true,
+    /**
+     * @cfg {Number} showDelay Length of time in milliseconds to wait before showing this item (defaults to 200)
+     */
+    showDelay: 200,
+    
+    /**
+     * @cfg {String} altText The altText to use for the icon, if it exists. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+    
+    // doc'd in BaseItem
+    hideDelay: 200,
+
+    // private
+    ctype: 'Ext.menu.Item',
+
+    initComponent : function(){
+        Ext.menu.Item.superclass.initComponent.call(this);
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.menu.Item.prototype.itemTpl = new Ext.XTemplate(
+                '<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"',
+                    '<tpl if="hrefTarget">',
+                        ' target="{hrefTarget}"',
+                    '</tpl>',
+                 '>',
+                     '<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>',
+                     '<span class="x-menu-item-text">{text}</span>',
+                 '</a>'
+             );
+        }
+        var a = this.getTemplateArgs();
+        this.el = position ? this.itemTpl.insertBefore(position, a, true) : this.itemTpl.append(container, a, true);
+        this.iconEl = this.el.child('img.x-menu-item-icon');
+        this.textEl = this.el.child('.x-menu-item-text');
+        if(!this.href) { // if no link defined, prevent the default anchor event
+            this.mon(this.el, 'click', Ext.emptyFn, null, { preventDefault: true });
+        }
+        Ext.menu.Item.superclass.onRender.call(this, container, position);
+    },
+
+    getTemplateArgs: function() {
+        return {
+            id: this.id,
+            cls: this.itemCls + (this.menu ?  ' x-menu-item-arrow' : '') + (this.cls ?  ' ' + this.cls : ''),
+            href: this.href || '#',
+            hrefTarget: this.hrefTarget,
+            icon: this.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: this.iconCls || '',
+            text: this.itemText||this.text||'&#160;',
+            altText: this.altText || ''
+        };
+    },
+
+    /**
+     * Sets the text to display in this menu item
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.text = text||'&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+            this.parentMenu.layout.doAutoSize();
+        }
+    },
+
+    /**
+     * Sets the CSS class to apply to the item's icon element
+     * @param {String} cls The CSS class to apply
+     */
+    setIconClass : function(cls){
+        var oldCls = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered){
+            this.iconEl.replaceClass(oldCls, this.iconCls);
+        }
+    },
+
+    //private
+    beforeDestroy: function(){
+        clearTimeout(this.showTimer);
+        clearTimeout(this.hideTimer);
+        if (this.menu){
+            delete this.menu.ownerCt;
+            this.menu.destroy();
+        }
+        Ext.menu.Item.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    handleClick : function(e){
+        if(!this.href){ // if no link defined, stop the event automatically
+            e.stopEvent();
+        }
+        Ext.menu.Item.superclass.handleClick.apply(this, arguments);
+    },
+
+    // private
+    activate : function(autoExpand){
+        if(Ext.menu.Item.superclass.activate.apply(this, arguments)){
+            this.focus();
+            if(autoExpand){
+                this.expandMenu();
+            }
+        }
+        return true;
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){
+            if(this.menu && this.menu.isVisible()){
+                return !this.menu.getEl().getRegion().contains(e.getPoint());
+            }
+            return true;
+        }
+        return false;
+    },
+
+    // private
+    deactivate : function(){
+        Ext.menu.Item.superclass.deactivate.apply(this, arguments);
+        this.hideMenu();
+    },
+
+    // private
+    expandMenu : function(autoActivate){
+        if(!this.disabled && this.menu){
+            clearTimeout(this.hideTimer);
+            delete this.hideTimer;
+            if(!this.menu.isVisible() && !this.showTimer){
+                this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]);
+            }else if (this.menu.isVisible() && autoActivate){
+                this.menu.tryActivate(0, 1);
+            }
+        }
+    },
+
+    // private
+    deferExpand : function(autoActivate){
+        delete this.showTimer;
+        this.menu.show(this.container, this.parentMenu.subMenuAlign || 'tl-tr?', this.parentMenu);
+        if(autoActivate){
+            this.menu.tryActivate(0, 1);
+        }
+    },
+
+    // private
+    hideMenu : function(){
+        clearTimeout(this.showTimer);
+        delete this.showTimer;
+        if(!this.hideTimer && this.menu && this.menu.isVisible()){
+            this.hideTimer = this.deferHide.defer(this.hideDelay, this);
+        }
+    },
+
+    // private
+    deferHide : function(){
+        delete this.hideTimer;
+        if(this.menu.over){
+            this.parentMenu.setActiveItem(this, false);
+        }else{
+            this.menu.hide();
+        }
+    }
+});
+Ext.reg('menuitem', Ext.menu.Item);/**
+ * @class Ext.menu.CheckItem
+ * @extends Ext.menu.Item
+ * Adds a menu item that contains a checkbox by default, but can also be part of a radio group.
+ * @constructor
+ * Creates a new CheckItem
+ * @param {Object} config Configuration options
+ * @xtype menucheckitem
+ */
+Ext.menu.CheckItem = Ext.extend(Ext.menu.Item, {
+    /**
+     * @cfg {String} group
+     * All check items with the same group name will automatically be grouped into a single-select
+     * radio button group (defaults to '')
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for check items (defaults to "x-menu-item x-menu-check-item")
+     */
+    itemCls : "x-menu-item x-menu-check-item",
+    /**
+     * @cfg {String} groupClass The default CSS class to use for radio group check items (defaults to "x-menu-group-item")
+     */
+    groupClass : "x-menu-group-item",
+
+    /**
+     * @cfg {Boolean} checked True to initialize this checkbox as checked (defaults to false).  Note that
+     * if this checkbox is part of a radio group (group = true) only the first item in the group that is
+     * initialized with checked = true will be rendered as checked.
+     */
+    checked: false,
+
+    // private
+    ctype: "Ext.menu.CheckItem",
+    
+    initComponent : function(){
+        Ext.menu.CheckItem.superclass.initComponent.call(this);
+	    this.addEvents(
+	        /**
+	         * @event beforecheckchange
+	         * Fires before the checked value is set, providing an opportunity to cancel if needed
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The new checked value that will be set
+	         */
+	        "beforecheckchange" ,
+	        /**
+	         * @event checkchange
+	         * Fires after the checked value has been set
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The checked value that was set
+	         */
+	        "checkchange"
+	    );
+	    /**
+	     * A function that handles the checkchange event.  The function is undefined by default, but if an implementation
+	     * is provided, it will be called automatically when the checkchange event fires.
+	     * @param {Ext.menu.CheckItem} this
+	     * @param {Boolean} checked The checked value that was set
+	     * @method checkHandler
+	     */
+	    if(this.checkHandler){
+	        this.on('checkchange', this.checkHandler, this.scope);
+	    }
+	    Ext.menu.MenuMgr.registerCheckable(this);
+    },
+
+    // private
+    onRender : function(c){
+        Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);
+        if(this.group){
+            this.el.addClass(this.groupClass);
+        }
+        if(this.checked){
+            this.checked = false;
+            this.setChecked(true, true);
+        }
+    },
+
+    // private
+    destroy : function(){
+        Ext.menu.MenuMgr.unregisterCheckable(this);
+        Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Set the checked state of this item
+     * @param {Boolean} checked The new checked value
+     * @param {Boolean} suppressEvent (optional) True to prevent the checkchange event from firing (defaults to false)
+     */
+    setChecked : function(state, suppressEvent){
+        var suppress = suppressEvent === true;
+        if(this.checked != state && (suppress || this.fireEvent("beforecheckchange", this, state) !== false)){
+            Ext.menu.MenuMgr.onCheckChange(this, state);
+            if(this.container){
+                this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");
+            }
+            this.checked = state;
+            if(!suppress){
+                this.fireEvent("checkchange", this, state);
+            }
+        }
+    },
+
+    // private
+    handleClick : function(e){
+       if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item
+           this.setChecked(!this.checked);
+       }
+       Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);
+    }
+});
+Ext.reg('menucheckitem', Ext.menu.CheckItem);/**
+ * @class Ext.menu.DateMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing an {@link Ext.DatePicker} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.DatePicker}</b>.</li>
+ * <li>If subclassing DateMenu, any configuration options for the DatePicker must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the DateMenu.
+ * Applying {@link Ext.DatePicker DatePicker} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the DatePicker's configuration.</li>
+ * </ul></div>
+ * @xtype datemenu
+ */
+ Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">The Ext.DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DateMenu instance.
+     */    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a date is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    /** 
+     * @cfg {String} pickerId
+     * An id to assign to the underlying date picker. Defaults to <tt>null</tt>.
+     */
+    pickerId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * The {@link Ext.DatePicker} instance for this DateMenu
+     * @property picker
+     * @type DatePicker
+     */
+    cls : 'x-date-menu',
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+
+    initComponent : function(){
+        this.on('beforeshow', this.onBeforeShow, this);
+        if(this.strict = (Ext.isIE7 && Ext.isStrict)){
+            this.on('show', this.onShow, this, {single: true, delay: 20});
+        }
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.picker = new Ext.DatePicker(Ext.applyIf({
+                internalRender: this.strict || !Ext.isIE,
+                ctCls: 'x-menu-date-item',
+                id: this.pickerId
+            }, this.initialConfig))
+        });
+        this.picker.purgeListeners();
+        Ext.menu.DateMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a date is selected from the {@link #picker Ext.DatePicker}
+         * @param {DatePicker} picker The {@link #picker Ext.DatePicker}
+         * @param {Date} date The selected date
+         */
+        this.relayEvents(this.picker, ['select']);
+        this.on('show', this.picker.focus, this.picker);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function() {
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    },
+
+    onBeforeShow : function(){
+        if(this.picker){
+            this.picker.hideMonthPicker(true);
+        }
+    },
+
+    onShow : function(){
+        var el = this.picker.getEl();
+        el.setWidth(el.getWidth()); //nasty hack for IE7 strict mode
+    }
+ });
+ Ext.reg('datemenu', Ext.menu.DateMenu);
+ /**
+ * @class Ext.menu.ColorMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing a {@link Ext.ColorPalette} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.ColorPalette}</b>.</li>
+ * <li>If subclassing ColorMenu, any configuration options for the ColorPalette must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the ColorMenu.
+ * Applying {@link Ext.ColorPalette ColorPalette} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the ColorPalette's configuration.</li>
+ * </ul></div> * 
+ * @xtype colormenu
+ */
+ Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorMenu instance.
+     */    
+    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a color is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    cls : 'x-color-menu',
+    
+    /** 
+     * @cfg {String} paletteId
+     * An id to assign to the underlying color palette. Defaults to <tt>null</tt>.
+     */
+    paletteId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * @property palette
+     * @type ColorPalette
+     * The {@link Ext.ColorPalette} instance for this ColorMenu
+     */
+    
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+    
+    initComponent : function(){
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.palette = new Ext.ColorPalette(Ext.applyIf({
+                id: this.paletteId
+            }, this.initialConfig))
+        });
+        this.palette.purgeListeners();
+        Ext.menu.ColorMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a color is selected from the {@link #palette Ext.ColorPalette}
+         * @param {Ext.ColorPalette} palette The {@link #palette Ext.ColorPalette}
+	     * @param {String} color The 6-digit color hex code (without the # symbol)
+         */
+        this.relayEvents(this.palette, ['select']);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function(){
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    }
+});
+Ext.reg('colormenu', Ext.menu.ColorMenu);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd-debug.js	(revision 76)
@@ -0,0 +1,4820 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * These classes are derivatives of the similarly named classes in the YUI Library.
+ * The original license:
+ * Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+ * Code licensed under the BSD License:
+ * http://developer.yahoo.net/yui/license.txt
+ */
+
+(function() {
+
+var Event=Ext.EventManager;
+var Dom=Ext.lib.Dom;
+
+/**
+ * @class Ext.dd.DragDrop
+ * Defines the interface and base operation of items that that can be
+ * dragged or can be drop targets.  It was designed to be extended, overriding
+ * the event handlers for startDrag, onDrag, onDragOver and onDragOut.
+ * Up to three html elements can be associated with a DragDrop instance:
+ * <ul>
+ * <li>linked element: the element that is passed into the constructor.
+ * This is the element which defines the boundaries for interaction with
+ * other DragDrop objects.</li>
+ * <li>handle element(s): The drag operation only occurs if the element that
+ * was clicked matches a handle element.  By default this is the linked
+ * element, but there are times that you will want only a portion of the
+ * linked element to initiate the drag operation, and the setHandleElId()
+ * method provides a way to define this.</li>
+ * <li>drag element: this represents the element that would be moved along
+ * with the cursor during a drag operation.  By default, this is the linked
+ * element itself as in {@link Ext.dd.DD}.  setDragElId() lets you define
+ * a separate element that would be moved, as in {@link Ext.dd.DDProxy}.
+ * </li>
+ * </ul>
+ * This class should not be instantiated until the onload event to ensure that
+ * the associated elements are available.
+ * The following would define a DragDrop obj that would interact with any
+ * other DragDrop obj in the "group1" group:
+ * <pre>
+ *  dd = new Ext.dd.DragDrop("div1", "group1");
+ * </pre>
+ * Since none of the event handlers have been implemented, nothing would
+ * actually happen if you were to run the code above.  Normally you would
+ * override this class or one of the default implementations, but you can
+ * also override the methods you want on an instance of the class...
+ * <pre>
+ *  dd.onDragDrop = function(e, id) {
+ *  &nbsp;&nbsp;alert("dd was dropped on " + id);
+ *  }
+ * </pre>
+ * @constructor
+ * @param {String} id of the element that is linked to this instance
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DragDrop:
+ *                    padding, isTarget, maintainOffset, primaryButtonOnly
+ */
+Ext.dd.DragDrop = function(id, sGroup, config) {
+    if(id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.dd.DragDrop.prototype = {
+
+    /**
+     * Set to false to enable a DragDrop object to fire drag events while dragging
+     * over its own Element. Defaults to true - DragDrop objects do not by default
+     * fire drag events to themselves.
+     * @property ignoreSelf
+     * @type Boolean
+     */
+
+    /**
+     * The id of the element associated with this object.  This is what we
+     * refer to as the "linked element" because the size and position of
+     * this element is used to determine when the drag and drop objects have
+     * interacted.
+     * @property id
+     * @type String
+     */
+    id: null,
+
+    /**
+     * Configuration attributes passed into the constructor
+     * @property config
+     * @type object
+     */
+    config: null,
+
+    /**
+     * The id of the element that will be dragged.  By default this is same
+     * as the linked element, but could be changed to another element. Ex:
+     * Ext.dd.DDProxy
+     * @property dragElId
+     * @type String
+     * @private
+     */
+    dragElId: null,
+
+    /**
+     * The ID of the element that initiates the drag operation.  By default
+     * this is the linked element, but could be changed to be a child of this
+     * element.  This lets us do things like only starting the drag when the
+     * header element within the linked html element is clicked.
+     * @property handleElId
+     * @type String
+     * @private
+     */
+    handleElId: null,
+
+    /**
+     * An object who's property names identify HTML tags to be considered invalid as drag handles.
+     * A non-null property value identifies the tag as invalid. Defaults to the 
+     * following value which prevents drag operations from being initiated by &lt;a> elements:<pre><code>
+{
+    A: "A"
+}</code></pre>
+     * @property invalidHandleTypes
+     * @type Object
+     */
+    invalidHandleTypes: null,
+
+    /**
+     * An object who's property names identify the IDs of elements to be considered invalid as drag handles.
+     * A non-null property value identifies the ID as invalid. For example, to prevent
+     * dragging from being initiated on element ID "foo", use:<pre><code>
+{
+    foo: true
+}</code></pre>
+     * @property invalidHandleIds
+     * @type Object
+     */
+    invalidHandleIds: null,
+
+    /**
+     * An Array of CSS class names for elements to be considered in valid as drag handles.
+     * @property invalidHandleClasses
+     * @type Array
+     */
+    invalidHandleClasses: null,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageX
+     * @type int
+     * @private
+     */
+    startPageX: 0,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageY
+     * @type int
+     * @private
+     */
+    startPageY: 0,
+
+    /**
+     * The group defines a logical collection of DragDrop objects that are
+     * related.  Instances only get events when interacting with other
+     * DragDrop object in the same group.  This lets us define multiple
+     * groups using a single DragDrop subclass if we want.
+     * @property groups
+     * @type object An object in the format {'group1':true, 'group2':true}
+     */
+    groups: null,
+
+    /**
+     * Individual drag/drop instances can be locked.  This will prevent
+     * onmousedown start drag.
+     * @property locked
+     * @type boolean
+     * @private
+     */
+    locked: false,
+
+    /**
+     * Lock this instance
+     * @method lock
+     */
+    lock: function() {
+        this.locked = true;
+    },
+
+    /**
+     * When set to true, other DD objects in cooperating DDGroups do not receive
+     * notification events when this DD object is dragged over them. Defaults to false.
+     * @property moveOnly
+     * @type boolean
+     */
+    moveOnly: false,
+
+    /**
+     * Unlock this instace
+     * @method unlock
+     */
+    unlock: function() {
+        this.locked = false;
+    },
+
+    /**
+     * By default, all instances can be a drop target.  This can be disabled by
+     * setting isTarget to false.
+     * @property isTarget
+     * @type boolean
+     */
+    isTarget: true,
+
+    /**
+     * The padding configured for this drag and drop object for calculating
+     * the drop zone intersection with this object.
+     * @property padding
+     * @type int[] An array containing the 4 padding values: [top, right, bottom, left]
+     */
+    padding: null,
+
+    /**
+     * Cached reference to the linked element
+     * @property _domRef
+     * @private
+     */
+    _domRef: null,
+
+    /**
+     * Internal typeof flag
+     * @property __ygDragDrop
+     * @private
+     */
+    __ygDragDrop: true,
+
+    /**
+     * Set to true when horizontal contraints are applied
+     * @property constrainX
+     * @type boolean
+     * @private
+     */
+    constrainX: false,
+
+    /**
+     * Set to true when vertical contraints are applied
+     * @property constrainY
+     * @type boolean
+     * @private
+     */
+    constrainY: false,
+
+    /**
+     * The left constraint
+     * @property minX
+     * @type int
+     * @private
+     */
+    minX: 0,
+
+    /**
+     * The right constraint
+     * @property maxX
+     * @type int
+     * @private
+     */
+    maxX: 0,
+
+    /**
+     * The up constraint
+     * @property minY
+     * @type int
+     * @private
+     */
+    minY: 0,
+
+    /**
+     * The down constraint
+     * @property maxY
+     * @type int
+     * @private
+     */
+    maxY: 0,
+
+    /**
+     * Maintain offsets when we resetconstraints.  Set to true when you want
+     * the position of the element relative to its parent to stay the same
+     * when the page changes
+     *
+     * @property maintainOffset
+     * @type boolean
+     */
+    maintainOffset: false,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * horizontal graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property xTicks
+     * @type int[]
+     */
+    xTicks: null,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * vertical graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property yTicks
+     * @type int[]
+     */
+    yTicks: null,
+
+    /**
+     * By default the drag and drop instance will only respond to the primary
+     * button click (left button for a right-handed mouse).  Set to true to
+     * allow drag and drop to start with any mouse click that is propogated
+     * by the browser
+     * @property primaryButtonOnly
+     * @type boolean
+     */
+    primaryButtonOnly: true,
+
+    /**
+     * The available property is false until the linked dom element is accessible.
+     * @property available
+     * @type boolean
+     */
+    available: false,
+
+    /**
+     * By default, drags can only be initiated if the mousedown occurs in the
+     * region the linked element is.  This is done in part to work around a
+     * bug in some browsers that mis-report the mousedown if the previous
+     * mouseup happened outside of the window.  This property is set to true
+     * if outer handles are defined.
+     *
+     * @property hasOuterHandles
+     * @type boolean
+     * @default false
+     */
+    hasOuterHandles: false,
+
+    /**
+     * Code that executes immediately before the startDrag event
+     * @method b4StartDrag
+     * @private
+     */
+    b4StartDrag: function(x, y) { },
+
+    /**
+     * Abstract method called after a drag/drop object is clicked
+     * and the drag or mousedown time thresholds have beeen met.
+     * @method startDrag
+     * @param {int} X click location
+     * @param {int} Y click location
+     */
+    startDrag: function(x, y) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDrag event
+     * @method b4Drag
+     * @private
+     */
+    b4Drag: function(e) { },
+
+    /**
+     * Abstract method called during the onMouseMove event while dragging an
+     * object.
+     * @method onDrag
+     * @param {Event} e the mousemove event
+     */
+    onDrag: function(e) { /* override this */ },
+
+    /**
+     * Abstract method called when this element fist begins hovering over
+     * another DragDrop obj
+     * @method onDragEnter
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of one or more
+     * dragdrop items being hovered over.
+     */
+    onDragEnter: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOver event
+     * @method b4DragOver
+     * @private
+     */
+    b4DragOver: function(e) { },
+
+    /**
+     * Abstract method called when this element is hovering over another
+     * DragDrop obj
+     * @method onDragOver
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of dd items
+     * being hovered over.
+     */
+    onDragOver: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOut event
+     * @method b4DragOut
+     * @private
+     */
+    b4DragOut: function(e) { },
+
+    /**
+     * Abstract method called when we are no longer hovering over an element
+     * @method onDragOut
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was hovering over.  In INTERSECT mode, an array of dd items
+     * that the mouse is no longer over.
+     */
+    onDragOut: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragDrop event
+     * @method b4DragDrop
+     * @private
+     */
+    b4DragDrop: function(e) { },
+
+    /**
+     * Abstract method called when this item is dropped on another DragDrop
+     * obj
+     * @method onDragDrop
+     * @param {Event} e the mouseup event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was dropped on.  In INTERSECT mode, an array of dd items this
+     * was dropped on.
+     */
+    onDragDrop: function(e, id) { /* override this */ },
+
+    /**
+     * Abstract method called when this item is dropped on an area with no
+     * drop target
+     * @method onInvalidDrop
+     * @param {Event} e the mouseup event
+     */
+    onInvalidDrop: function(e) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the endDrag event
+     * @method b4EndDrag
+     * @private
+     */
+    b4EndDrag: function(e) { },
+
+    /**
+     * Fired when we are done dragging the object
+     * @method endDrag
+     * @param {Event} e the mouseup event
+     */
+    endDrag: function(e) { /* override this */ },
+
+    /**
+     * Code executed immediately before the onMouseDown event
+     * @method b4MouseDown
+     * @param {Event} e the mousedown event
+     * @private
+     */
+    b4MouseDown: function(e) {  },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mousedown
+     * @method onMouseDown
+     * @param {Event} e the mousedown event
+     */
+    onMouseDown: function(e) { /* override this */ },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mouseup
+     * @method onMouseUp
+     * @param {Event} e the mouseup event
+     */
+    onMouseUp: function(e) { /* override this */ },
+
+    /**
+     * Override the onAvailable method to do what is needed after the initial
+     * position was determined.
+     * @method onAvailable
+     */
+    onAvailable: function () {
+    },
+
+    /**
+     * Provides default constraint padding to "constrainTo" elements (defaults to {left: 0, right:0, top:0, bottom:0}).
+     * @type Object
+     */
+    defaultPadding : {left:0, right:0, top:0, bottom:0},
+
+    /**
+     * Initializes the drag drop object's constraints to restrict movement to a certain element.
+ *
+ * Usage:
+ <pre><code>
+ var dd = new Ext.dd.DDProxy("dragDiv1", "proxytest",
+                { dragElId: "existingProxyDiv" });
+ dd.startDrag = function(){
+     this.constrainTo("parent-id");
+ };
+ </code></pre>
+ * Or you can initalize it using the {@link Ext.Element} object:
+ <pre><code>
+ Ext.get("dragDiv1").initDDProxy("proxytest", {dragElId: "existingProxyDiv"}, {
+     startDrag : function(){
+         this.constrainTo("parent-id");
+     }
+ });
+ </code></pre>
+     * @param {Mixed} constrainTo The element to constrain to.
+     * @param {Object/Number} pad (optional) Pad provides a way to specify "padding" of the constraints,
+     * and can be either a number for symmetrical padding (4 would be equal to {left:4, right:4, top:4, bottom:4}) or
+     * an object containing the sides to pad. For example: {right:10, bottom:10}
+     * @param {Boolean} inContent (optional) Constrain the draggable in the content box of the element (inside padding and borders)
+     */
+    constrainTo : function(constrainTo, pad, inContent){
+        if(Ext.isNumber(pad)){
+            pad = {left: pad, right:pad, top:pad, bottom:pad};
+        }
+        pad = pad || this.defaultPadding;
+        var b = Ext.get(this.getEl()).getBox(),
+            ce = Ext.get(constrainTo),
+            s = ce.getScroll(),
+            c, 
+            cd = ce.dom;
+        if(cd == document.body){
+            c = { x: s.left, y: s.top, width: Ext.lib.Dom.getViewWidth(), height: Ext.lib.Dom.getViewHeight()};
+        }else{
+            var xy = ce.getXY();
+            c = {x : xy[0], y: xy[1], width: cd.clientWidth, height: cd.clientHeight};
+        }
+
+
+        var topSpace = b.y - c.y,
+            leftSpace = b.x - c.x;
+
+        this.resetConstraints();
+        this.setXConstraint(leftSpace - (pad.left||0), // left
+                c.width - leftSpace - b.width - (pad.right||0), //right
+				this.xTickSize
+        );
+        this.setYConstraint(topSpace - (pad.top||0), //top
+                c.height - topSpace - b.height - (pad.bottom||0), //bottom
+				this.yTickSize
+        );
+    },
+
+    /**
+     * Returns a reference to the linked element
+     * @method getEl
+     * @return {HTMLElement} the html element
+     */
+    getEl: function() {
+        if (!this._domRef) {
+            this._domRef = Ext.getDom(this.id);
+        }
+
+        return this._domRef;
+    },
+
+    /**
+     * Returns a reference to the actual element to drag.  By default this is
+     * the same as the html element, but it can be assigned to another
+     * element. An example of this can be found in Ext.dd.DDProxy
+     * @method getDragEl
+     * @return {HTMLElement} the html element
+     */
+    getDragEl: function() {
+        return Ext.getDom(this.dragElId);
+    },
+
+    /**
+     * Sets up the DragDrop object.  Must be called in the constructor of any
+     * Ext.dd.DragDrop subclass
+     * @method init
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    init: function(id, sGroup, config) {
+        this.initTarget(id, sGroup, config);
+        Event.on(this.id, "mousedown", this.handleMouseDown, this);
+        // Event.on(this.id, "selectstart", Event.preventDefault);
+    },
+
+    /**
+     * Initializes Targeting functionality only... the object does not
+     * get a mousedown handler.
+     * @method initTarget
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    initTarget: function(id, sGroup, config) {
+
+        // configuration attributes
+        this.config = config || {};
+
+        // create a local reference to the drag and drop manager
+        this.DDM = Ext.dd.DDM;
+        // initialize the groups array
+        this.groups = {};
+
+        // assume that we have an element reference instead of an id if the
+        // parameter is not a string
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+
+        // set the id
+        this.id = id;
+
+        // add to an interaction group
+        this.addToGroup((sGroup) ? sGroup : "default");
+
+        // We don't want to register this as the handle with the manager
+        // so we just set the id rather than calling the setter.
+        this.handleElId = id;
+
+        // the linked element is the element that gets dragged by default
+        this.setDragElId(id);
+
+        // by default, clicked anchors will not start drag operations.
+        this.invalidHandleTypes = { A: "A" };
+        this.invalidHandleIds = {};
+        this.invalidHandleClasses = [];
+
+        this.applyConfig();
+
+        this.handleOnAvailable();
+    },
+
+    /**
+     * Applies the configuration parameters that were passed into the constructor.
+     * This is supposed to happen at each level through the inheritance chain.  So
+     * a DDProxy implentation will execute apply config on DDProxy, DD, and
+     * DragDrop in order to get all of the parameters that are available in
+     * each object.
+     * @method applyConfig
+     */
+    applyConfig: function() {
+
+        // configurable properties:
+        //    padding, isTarget, maintainOffset, primaryButtonOnly
+        this.padding           = this.config.padding || [0, 0, 0, 0];
+        this.isTarget          = (this.config.isTarget !== false);
+        this.maintainOffset    = (this.config.maintainOffset);
+        this.primaryButtonOnly = (this.config.primaryButtonOnly !== false);
+
+    },
+
+    /**
+     * Executed when the linked element is available
+     * @method handleOnAvailable
+     * @private
+     */
+    handleOnAvailable: function() {
+        this.available = true;
+        this.resetConstraints();
+        this.onAvailable();
+    },
+
+     /**
+     * Configures the padding for the target zone in px.  Effectively expands
+     * (or reduces) the virtual object size for targeting calculations.
+     * Supports css-style shorthand; if only one parameter is passed, all sides
+     * will have that padding, and if only two are passed, the top and bottom
+     * will have the first param, the left and right the second.
+     * @method setPadding
+     * @param {int} iTop    Top pad
+     * @param {int} iRight  Right pad
+     * @param {int} iBot    Bot pad
+     * @param {int} iLeft   Left pad
+     */
+    setPadding: function(iTop, iRight, iBot, iLeft) {
+        // this.padding = [iLeft, iRight, iTop, iBot];
+        if (!iRight && 0 !== iRight) {
+            this.padding = [iTop, iTop, iTop, iTop];
+        } else if (!iBot && 0 !== iBot) {
+            this.padding = [iTop, iRight, iTop, iRight];
+        } else {
+            this.padding = [iTop, iRight, iBot, iLeft];
+        }
+    },
+
+    /**
+     * Stores the initial placement of the linked element.
+     * @method setInitPosition
+     * @param {int} diffX   the X offset, default 0
+     * @param {int} diffY   the Y offset, default 0
+     */
+    setInitPosition: function(diffX, diffY) {
+        var el = this.getEl();
+
+        if (!this.DDM.verifyEl(el)) {
+            return;
+        }
+
+        var dx = diffX || 0;
+        var dy = diffY || 0;
+
+        var p = Dom.getXY( el );
+
+        this.initPageX = p[0] - dx;
+        this.initPageY = p[1] - dy;
+
+        this.lastPageX = p[0];
+        this.lastPageY = p[1];
+
+        this.setStartPosition(p);
+    },
+
+    /**
+     * Sets the start position of the element.  This is set when the obj
+     * is initialized, the reset when a drag is started.
+     * @method setStartPosition
+     * @param pos current position (from previous lookup)
+     * @private
+     */
+    setStartPosition: function(pos) {
+        var p = pos || Dom.getXY( this.getEl() );
+        this.deltaSetXY = null;
+
+        this.startPageX = p[0];
+        this.startPageY = p[1];
+    },
+
+    /**
+     * Add this instance to a group of related drag/drop objects.  All
+     * instances belong to at least one group, and can belong to as many
+     * groups as needed.
+     * @method addToGroup
+     * @param sGroup {string} the name of the group
+     */
+    addToGroup: function(sGroup) {
+        this.groups[sGroup] = true;
+        this.DDM.regDragDrop(this, sGroup);
+    },
+
+    /**
+     * Remove's this instance from the supplied interaction group
+     * @method removeFromGroup
+     * @param {string}  sGroup  The group to drop
+     */
+    removeFromGroup: function(sGroup) {
+        if (this.groups[sGroup]) {
+            delete this.groups[sGroup];
+        }
+
+        this.DDM.removeDDFromGroup(this, sGroup);
+    },
+
+    /**
+     * Allows you to specify that an element other than the linked element
+     * will be moved with the cursor during a drag
+     * @method setDragElId
+     * @param id {string} the id of the element that will be used to initiate the drag
+     */
+    setDragElId: function(id) {
+        this.dragElId = id;
+    },
+
+    /**
+     * Allows you to specify a child of the linked element that should be
+     * used to initiate the drag operation.  An example of this would be if
+     * you have a content div with text and links.  Clicking anywhere in the
+     * content area would normally start the drag operation.  Use this method
+     * to specify that an element inside of the content div is the element
+     * that starts the drag operation.
+     * @method setHandleElId
+     * @param id {string} the id of the element that will be used to
+     * initiate the drag.
+     */
+    setHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.handleElId = id;
+        this.DDM.regHandle(this.id, id);
+    },
+
+    /**
+     * Allows you to set an element outside of the linked element as a drag
+     * handle
+     * @method setOuterHandleElId
+     * @param id the id of the element that will be used to initiate the drag
+     */
+    setOuterHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        Event.on(id, "mousedown",
+                this.handleMouseDown, this);
+        this.setHandleElId(id);
+
+        this.hasOuterHandles = true;
+    },
+
+    /**
+     * Remove all drag and drop hooks for this element
+     * @method unreg
+     */
+    unreg: function() {
+        Event.un(this.id, "mousedown",
+                this.handleMouseDown);
+        this._domRef = null;
+        this.DDM._remove(this);
+    },
+
+    destroy : function(){
+        this.unreg();
+    },
+
+    /**
+     * Returns true if this instance is locked, or the drag drop mgr is locked
+     * (meaning that all drag/drop is disabled on the page.)
+     * @method isLocked
+     * @return {boolean} true if this obj or all drag/drop is locked, else
+     * false
+     */
+    isLocked: function() {
+        return (this.DDM.isLocked() || this.locked);
+    },
+
+    /**
+     * Fired when this object is clicked
+     * @method handleMouseDown
+     * @param {Event} e
+     * @param {Ext.dd.DragDrop} oDD the clicked dd object (this dd obj)
+     * @private
+     */
+    handleMouseDown: function(e, oDD){
+        if (this.primaryButtonOnly && e.button != 0) {
+            return;
+        }
+
+        if (this.isLocked()) {
+            return;
+        }
+
+        this.DDM.refreshCache(this.groups);
+
+        var pt = new Ext.lib.Point(Ext.lib.Event.getPageX(e), Ext.lib.Event.getPageY(e));
+        if (!this.hasOuterHandles && !this.DDM.isOverTarget(pt, this) )  {
+        } else {
+            if (this.clickValidator(e)) {
+
+                // set the initial element position
+                this.setStartPosition();
+
+                this.b4MouseDown(e);
+                this.onMouseDown(e);
+
+                this.DDM.handleMouseDown(e, this);
+
+                this.DDM.stopEvent(e);
+            } else {
+
+
+            }
+        }
+    },
+
+    clickValidator: function(e) {
+        var target = e.getTarget();
+        return ( this.isValidHandleChild(target) &&
+                    (this.id == this.handleElId ||
+                        this.DDM.handleWasClicked(target, this.id)) );
+    },
+
+    /**
+     * Allows you to specify a tag name that should not start a drag operation
+     * when clicked.  This is designed to facilitate embedding links within a
+     * drag handle that do something other than start the drag.
+     * @method addInvalidHandleType
+     * @param {string} tagName the type of element to exclude
+     */
+    addInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        this.invalidHandleTypes[type] = type;
+    },
+
+    /**
+     * Lets you to specify an element id for a child of a drag handle
+     * that should not initiate a drag
+     * @method addInvalidHandleId
+     * @param {string} id the element id of the element you wish to ignore
+     */
+    addInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.invalidHandleIds[id] = id;
+    },
+
+    /**
+     * Lets you specify a css class of elements that will not initiate a drag
+     * @method addInvalidHandleClass
+     * @param {string} cssClass the class of the elements you wish to ignore
+     */
+    addInvalidHandleClass: function(cssClass) {
+        this.invalidHandleClasses.push(cssClass);
+    },
+
+    /**
+     * Unsets an excluded tag name set by addInvalidHandleType
+     * @method removeInvalidHandleType
+     * @param {string} tagName the type of element to unexclude
+     */
+    removeInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        // this.invalidHandleTypes[type] = null;
+        delete this.invalidHandleTypes[type];
+    },
+
+    /**
+     * Unsets an invalid handle id
+     * @method removeInvalidHandleId
+     * @param {string} id the id of the element to re-enable
+     */
+    removeInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        delete this.invalidHandleIds[id];
+    },
+
+    /**
+     * Unsets an invalid css class
+     * @method removeInvalidHandleClass
+     * @param {string} cssClass the class of the element(s) you wish to
+     * re-enable
+     */
+    removeInvalidHandleClass: function(cssClass) {
+        for (var i=0, len=this.invalidHandleClasses.length; i<len; ++i) {
+            if (this.invalidHandleClasses[i] == cssClass) {
+                delete this.invalidHandleClasses[i];
+            }
+        }
+    },
+
+    /**
+     * Checks the tag exclusion list to see if this click should be ignored
+     * @method isValidHandleChild
+     * @param {HTMLElement} node the HTMLElement to evaluate
+     * @return {boolean} true if this is a valid tag type, false if not
+     */
+    isValidHandleChild: function(node) {
+
+        var valid = true;
+        // var n = (node.nodeName == "#text") ? node.parentNode : node;
+        var nodeName;
+        try {
+            nodeName = node.nodeName.toUpperCase();
+        } catch(e) {
+            nodeName = node.nodeName;
+        }
+        valid = valid && !this.invalidHandleTypes[nodeName];
+        valid = valid && !this.invalidHandleIds[node.id];
+
+        for (var i=0, len=this.invalidHandleClasses.length; valid && i<len; ++i) {
+            valid = !Ext.fly(node).hasClass(this.invalidHandleClasses[i]);
+        }
+
+
+        return valid;
+
+    },
+
+    /**
+     * Create the array of horizontal tick marks if an interval was specified
+     * in setXConstraint().
+     * @method setXTicks
+     * @private
+     */
+    setXTicks: function(iStartX, iTickSize) {
+        this.xTicks = [];
+        this.xTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.xTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * Create the array of vertical tick marks if an interval was specified in
+     * setYConstraint().
+     * @method setYTicks
+     * @private
+     */
+    setYTicks: function(iStartY, iTickSize) {
+        this.yTicks = [];
+        this.yTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.yTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Use
+     * this method to limit the horizontal travel of the element.  Pass in
+     * 0,0 for the parameters if you want to lock the drag to the y axis.
+     * @method setXConstraint
+     * @param {int} iLeft the number of pixels the element can move to the left
+     * @param {int} iRight the number of pixels the element can move to the
+     * right
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element
+     * should move iTickSize pixels at a time.
+     */
+    setXConstraint: function(iLeft, iRight, iTickSize) {
+        this.leftConstraint = iLeft;
+        this.rightConstraint = iRight;
+
+        this.minX = this.initPageX - iLeft;
+        this.maxX = this.initPageX + iRight;
+        if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); }
+
+        this.constrainX = true;
+    },
+
+    /**
+     * Clears any constraints applied to this instance.  Also clears ticks
+     * since they can't exist independent of a constraint at this time.
+     * @method clearConstraints
+     */
+    clearConstraints: function() {
+        this.constrainX = false;
+        this.constrainY = false;
+        this.clearTicks();
+    },
+
+    /**
+     * Clears any tick interval defined for this instance
+     * @method clearTicks
+     */
+    clearTicks: function() {
+        this.xTicks = null;
+        this.yTicks = null;
+        this.xTickSize = 0;
+        this.yTickSize = 0;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Set
+     * this to limit the vertical travel of the element.  Pass in 0,0 for the
+     * parameters if you want to lock the drag to the x axis.
+     * @method setYConstraint
+     * @param {int} iUp the number of pixels the element can move up
+     * @param {int} iDown the number of pixels the element can move down
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element should move iTickSize pixels at a time.
+     */
+    setYConstraint: function(iUp, iDown, iTickSize) {
+        this.topConstraint = iUp;
+        this.bottomConstraint = iDown;
+
+        this.minY = this.initPageY - iUp;
+        this.maxY = this.initPageY + iDown;
+        if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); }
+
+        this.constrainY = true;
+
+    },
+
+    /**
+     * resetConstraints must be called if you manually reposition a dd element.
+     * @method resetConstraints
+     * @param {boolean} maintainOffset
+     */
+    resetConstraints: function() {
+        // Maintain offsets if necessary
+        if (this.initPageX || this.initPageX === 0) {
+            // figure out how much this thing has moved
+            var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0;
+            var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0;
+
+            this.setInitPosition(dx, dy);
+
+        // This is the first time we have detected the element's position
+        } else {
+            this.setInitPosition();
+        }
+
+        if (this.constrainX) {
+            this.setXConstraint( this.leftConstraint,
+                                 this.rightConstraint,
+                                 this.xTickSize        );
+        }
+
+        if (this.constrainY) {
+            this.setYConstraint( this.topConstraint,
+                                 this.bottomConstraint,
+                                 this.yTickSize         );
+        }
+    },
+
+    /**
+     * Normally the drag element is moved pixel by pixel, but we can specify
+     * that it move a number of pixels at a time.  This method resolves the
+     * location when we have it set up like this.
+     * @method getTick
+     * @param {int} val where we want to place the object
+     * @param {int[]} tickArray sorted array of valid points
+     * @return {int} the closest tick
+     * @private
+     */
+    getTick: function(val, tickArray) {
+        if (!tickArray) {
+            // If tick interval is not defined, it is effectively 1 pixel,
+            // so we return the value passed to us.
+            return val;
+        } else if (tickArray[0] >= val) {
+            // The value is lower than the first tick, so we return the first
+            // tick.
+            return tickArray[0];
+        } else {
+            for (var i=0, len=tickArray.length; i<len; ++i) {
+                var next = i + 1;
+                if (tickArray[next] && tickArray[next] >= val) {
+                    var diff1 = val - tickArray[i];
+                    var diff2 = tickArray[next] - val;
+                    return (diff2 > diff1) ? tickArray[i] : tickArray[next];
+                }
+            }
+
+            // The value is larger than the last tick, so we return the last
+            // tick.
+            return tickArray[tickArray.length - 1];
+        }
+    },
+
+    /**
+     * toString method
+     * @method toString
+     * @return {string} string representation of the dd obj
+     */
+    toString: function() {
+        return ("DragDrop " + this.id);
+    }
+
+};
+
+})();
+/*
+ * The drag and drop utility provides a framework for building drag and drop
+ * applications.  In addition to enabling drag and drop for specific elements,
+ * the drag and drop elements are tracked by the manager class, and the
+ * interactions between the various elements are tracked during the drag and
+ * the implementing code is notified about these important moments.
+ */
+
+// Only load the library once.  Rewriting the manager class would orphan
+// existing drag and drop instances.
+if (!Ext.dd.DragDropMgr) {
+
+/**
+ * @class Ext.dd.DragDropMgr
+ * DragDropMgr is a singleton that tracks the element interaction for
+ * all DragDrop items in the window.  Generally, you will not call
+ * this class directly, but it does have helper methods that could
+ * be useful in your DragDrop implementations.
+ * @singleton
+ */
+Ext.dd.DragDropMgr = function() {
+
+    var Event = Ext.EventManager;
+
+    return {
+
+        /**
+         * Two dimensional Array of registered DragDrop objects.  The first
+         * dimension is the DragDrop item group, the second the DragDrop
+         * object.
+         * @property ids
+         * @type String[]
+         * @private
+         * @static
+         */
+        ids: {},
+
+        /**
+         * Array of element ids defined as drag handles.  Used to determine
+         * if the element that generated the mousedown event is actually the
+         * handle and not the html element itself.
+         * @property handleIds
+         * @type String[]
+         * @private
+         * @static
+         */
+        handleIds: {},
+
+        /**
+         * the DragDrop object that is currently being dragged
+         * @property dragCurrent
+         * @type DragDrop
+         * @private
+         * @static
+         **/
+        dragCurrent: null,
+
+        /**
+         * the DragDrop object(s) that are being hovered over
+         * @property dragOvers
+         * @type Array
+         * @private
+         * @static
+         */
+        dragOvers: {},
+
+        /**
+         * the X distance between the cursor and the object being dragged
+         * @property deltaX
+         * @type int
+         * @private
+         * @static
+         */
+        deltaX: 0,
+
+        /**
+         * the Y distance between the cursor and the object being dragged
+         * @property deltaY
+         * @type int
+         * @private
+         * @static
+         */
+        deltaY: 0,
+
+        /**
+         * Flag to determine if we should prevent the default behavior of the
+         * events we define. By default this is true, but this can be set to
+         * false if you need the default behavior (not recommended)
+         * @property preventDefault
+         * @type boolean
+         * @static
+         */
+        preventDefault: true,
+
+        /**
+         * Flag to determine if we should stop the propagation of the events
+         * we generate. This is true by default but you may want to set it to
+         * false if the html element contains other features that require the
+         * mouse click.
+         * @property stopPropagation
+         * @type boolean
+         * @static
+         */
+        stopPropagation: true,
+
+        /**
+         * Internal flag that is set to true when drag and drop has been
+         * intialized
+         * @property initialized
+         * @private
+         * @static
+         */
+        initialized: false,
+
+        /**
+         * All drag and drop can be disabled.
+         * @property locked
+         * @private
+         * @static
+         */
+        locked: false,
+
+        /**
+         * Called the first time an element is registered.
+         * @method init
+         * @private
+         * @static
+         */
+        init: function() {
+            this.initialized = true;
+        },
+
+        /**
+         * In point mode, drag and drop interaction is defined by the
+         * location of the cursor during the drag/drop
+         * @property POINT
+         * @type int
+         * @static
+         */
+        POINT: 0,
+
+        /**
+         * In intersect mode, drag and drop interaction is defined by the
+         * overlap of two or more drag and drop objects.
+         * @property INTERSECT
+         * @type int
+         * @static
+         */
+        INTERSECT: 1,
+
+        /**
+         * The current drag and drop mode.  Default: POINT
+         * @property mode
+         * @type int
+         * @static
+         */
+        mode: 0,
+
+        /**
+         * Runs method on all drag and drop objects
+         * @method _execOnAll
+         * @private
+         * @static
+         */
+        _execOnAll: function(sMethod, args) {
+            for (var i in this.ids) {
+                for (var j in this.ids[i]) {
+                    var oDD = this.ids[i][j];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+                    oDD[sMethod].apply(oDD, args);
+                }
+            }
+        },
+
+        /**
+         * Drag and drop initialization.  Sets up the global event handlers
+         * @method _onLoad
+         * @private
+         * @static
+         */
+        _onLoad: function() {
+
+            this.init();
+
+
+            Event.on(document, "mouseup",   this.handleMouseUp, this, true);
+            Event.on(document, "mousemove", this.handleMouseMove, this, true);
+            Event.on(window,   "unload",    this._onUnload, this, true);
+            Event.on(window,   "resize",    this._onResize, this, true);
+            // Event.on(window,   "mouseout",    this._test);
+
+        },
+
+        /**
+         * Reset constraints on all drag and drop objs
+         * @method _onResize
+         * @private
+         * @static
+         */
+        _onResize: function(e) {
+            this._execOnAll("resetConstraints", []);
+        },
+
+        /**
+         * Lock all drag and drop functionality
+         * @method lock
+         * @static
+         */
+        lock: function() { this.locked = true; },
+
+        /**
+         * Unlock all drag and drop functionality
+         * @method unlock
+         * @static
+         */
+        unlock: function() { this.locked = false; },
+
+        /**
+         * Is drag and drop locked?
+         * @method isLocked
+         * @return {boolean} True if drag and drop is locked, false otherwise.
+         * @static
+         */
+        isLocked: function() { return this.locked; },
+
+        /**
+         * Location cache that is set for all drag drop objects when a drag is
+         * initiated, cleared when the drag is finished.
+         * @property locationCache
+         * @private
+         * @static
+         */
+        locationCache: {},
+
+        /**
+         * Set useCache to false if you want to force object the lookup of each
+         * drag and drop linked element constantly during a drag.
+         * @property useCache
+         * @type boolean
+         * @static
+         */
+        useCache: true,
+
+        /**
+         * The number of pixels that the mouse needs to move after the
+         * mousedown before the drag is initiated.  Default=3;
+         * @property clickPixelThresh
+         * @type int
+         * @static
+         */
+        clickPixelThresh: 3,
+
+        /**
+         * The number of milliseconds after the mousedown event to initiate the
+         * drag if we don't get a mouseup event. Default=350
+         * @property clickTimeThresh
+         * @type int
+         * @static
+         */
+        clickTimeThresh: 350,
+
+        /**
+         * Flag that indicates that either the drag pixel threshold or the
+         * mousdown time threshold has been met
+         * @property dragThreshMet
+         * @type boolean
+         * @private
+         * @static
+         */
+        dragThreshMet: false,
+
+        /**
+         * Timeout used for the click time threshold
+         * @property clickTimeout
+         * @type Object
+         * @private
+         * @static
+         */
+        clickTimeout: null,
+
+        /**
+         * The X position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startX
+         * @type int
+         * @private
+         * @static
+         */
+        startX: 0,
+
+        /**
+         * The Y position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startY
+         * @type int
+         * @private
+         * @static
+         */
+        startY: 0,
+
+        /**
+         * Each DragDrop instance must be registered with the DragDropMgr.
+         * This is executed in DragDrop.init()
+         * @method regDragDrop
+         * @param {DragDrop} oDD the DragDrop object to register
+         * @param {String} sGroup the name of the group this element belongs to
+         * @static
+         */
+        regDragDrop: function(oDD, sGroup) {
+            if (!this.initialized) { this.init(); }
+
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+            this.ids[sGroup][oDD.id] = oDD;
+        },
+
+        /**
+         * Removes the supplied dd instance from the supplied group. Executed
+         * by DragDrop.removeFromGroup, so don't call this function directly.
+         * @method removeDDFromGroup
+         * @private
+         * @static
+         */
+        removeDDFromGroup: function(oDD, sGroup) {
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+
+            var obj = this.ids[sGroup];
+            if (obj && obj[oDD.id]) {
+                delete obj[oDD.id];
+            }
+        },
+
+        /**
+         * Unregisters a drag and drop item.  This is executed in
+         * DragDrop.unreg, use that method instead of calling this directly.
+         * @method _remove
+         * @private
+         * @static
+         */
+        _remove: function(oDD) {
+            for (var g in oDD.groups) {
+                if (g && this.ids[g] && this.ids[g][oDD.id]) {
+                    delete this.ids[g][oDD.id];
+                }
+            }
+            delete this.handleIds[oDD.id];
+        },
+
+        /**
+         * Each DragDrop handle element must be registered.  This is done
+         * automatically when executing DragDrop.setHandleElId()
+         * @method regHandle
+         * @param {String} sDDId the DragDrop id this element is a handle for
+         * @param {String} sHandleId the id of the element that is the drag
+         * handle
+         * @static
+         */
+        regHandle: function(sDDId, sHandleId) {
+            if (!this.handleIds[sDDId]) {
+                this.handleIds[sDDId] = {};
+            }
+            this.handleIds[sDDId][sHandleId] = sHandleId;
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop item.
+         * @method isDragDrop
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop item,
+         * false otherwise
+         * @static
+         */
+        isDragDrop: function(id) {
+            return ( this.getDDById(id) ) ? true : false;
+        },
+
+        /**
+         * Returns the drag and drop instances that are in all groups the
+         * passed in instance belongs to.
+         * @method getRelated
+         * @param {DragDrop} p_oDD the obj to get related data for
+         * @param {boolean} bTargetsOnly if true, only return targetable objs
+         * @return {DragDrop[]} the related instances
+         * @static
+         */
+        getRelated: function(p_oDD, bTargetsOnly) {
+            var oDDs = [];
+            for (var i in p_oDD.groups) {
+                for (var j in this.ids[i]) {
+                    var dd = this.ids[i][j];
+                    if (! this.isTypeOfDD(dd)) {
+                        continue;
+                    }
+                    if (!bTargetsOnly || dd.isTarget) {
+                        oDDs[oDDs.length] = dd;
+                    }
+                }
+            }
+
+            return oDDs;
+        },
+
+        /**
+         * Returns true if the specified dd target is a legal target for
+         * the specifice drag obj
+         * @method isLegalTarget
+         * @param {DragDrop} oDD the drag obj
+         * @param {DragDrop} oTargetDD the target
+         * @return {boolean} true if the target is a legal target for the
+         * dd obj
+         * @static
+         */
+        isLegalTarget: function (oDD, oTargetDD) {
+            var targets = this.getRelated(oDD, true);
+            for (var i=0, len=targets.length;i<len;++i) {
+                if (targets[i].id == oTargetDD.id) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * My goal is to be able to transparently determine if an object is
+         * typeof DragDrop, and the exact subclass of DragDrop.  typeof
+         * returns "object", oDD.constructor.toString() always returns
+         * "DragDrop" and not the name of the subclass.  So for now it just
+         * evaluates a well-known variable in DragDrop.
+         * @method isTypeOfDD
+         * @param {Object} the object to evaluate
+         * @return {boolean} true if typeof oDD = DragDrop
+         * @static
+         */
+        isTypeOfDD: function (oDD) {
+            return (oDD && oDD.__ygDragDrop);
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop handle for the given Drag Drop object.
+         * @method isHandle
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop handle, false
+         * otherwise
+         * @static
+         */
+        isHandle: function(sDDId, sHandleId) {
+            return ( this.handleIds[sDDId] &&
+                            this.handleIds[sDDId][sHandleId] );
+        },
+
+        /**
+         * Returns the DragDrop instance for a given id
+         * @method getDDById
+         * @param {String} id the id of the DragDrop object
+         * @return {DragDrop} the drag drop object, null if it is not found
+         * @static
+         */
+        getDDById: function(id) {
+            for (var i in this.ids) {
+                if (this.ids[i][id]) {
+                    return this.ids[i][id];
+                }
+            }
+            return null;
+        },
+
+        /**
+         * Fired after a registered DragDrop object gets the mousedown event.
+         * Sets up the events required to track the object being dragged
+         * @method handleMouseDown
+         * @param {Event} e the event
+         * @param oDD the DragDrop object being dragged
+         * @private
+         * @static
+         */
+        handleMouseDown: function(e, oDD) {
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddDisable();
+            }
+            if(this.dragCurrent){
+                // the original browser mouseup wasn't handled (e.g. outside FF browser window)
+                // so clean up first to avoid breaking the next drag
+                this.handleMouseUp(e);
+            }
+            
+            this.currentTarget = e.getTarget();
+            this.dragCurrent = oDD;
+
+            var el = oDD.getEl();
+
+            // track start position
+            this.startX = e.getPageX();
+            this.startY = e.getPageY();
+
+            this.deltaX = this.startX - el.offsetLeft;
+            this.deltaY = this.startY - el.offsetTop;
+
+            this.dragThreshMet = false;
+
+            this.clickTimeout = setTimeout(
+                    function() {
+                        var DDM = Ext.dd.DDM;
+                        DDM.startDrag(DDM.startX, DDM.startY);
+                    },
+                    this.clickTimeThresh );
+        },
+
+        /**
+         * Fired when either the drag pixel threshol or the mousedown hold
+         * time threshold has been met.
+         * @method startDrag
+         * @param x {int} the X position of the original mousedown
+         * @param y {int} the Y position of the original mousedown
+         * @static
+         */
+        startDrag: function(x, y) {
+            clearTimeout(this.clickTimeout);
+            if (this.dragCurrent) {
+                this.dragCurrent.b4StartDrag(x, y);
+                this.dragCurrent.startDrag(x, y);
+            }
+            this.dragThreshMet = true;
+        },
+
+        /**
+         * Internal function to handle the mouseup event.  Will be invoked
+         * from the context of the document.
+         * @method handleMouseUp
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseUp: function(e) {
+
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddEnable();
+            }
+            if (! this.dragCurrent) {
+                return;
+            }
+
+            clearTimeout(this.clickTimeout);
+
+            if (this.dragThreshMet) {
+                this.fireEvents(e, true);
+            } else {
+            }
+
+            this.stopDrag(e);
+
+            this.stopEvent(e);
+        },
+
+        /**
+         * Utility to stop event propagation and event default, if these
+         * features are turned on.
+         * @method stopEvent
+         * @param {Event} e the event as returned by this.getEvent()
+         * @static
+         */
+        stopEvent: function(e){
+            if(this.stopPropagation) {
+                e.stopPropagation();
+            }
+
+            if (this.preventDefault) {
+                e.preventDefault();
+            }
+        },
+
+        /**
+         * Internal function to clean up event handlers after the drag
+         * operation is complete
+         * @method stopDrag
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        stopDrag: function(e) {
+            // Fire the drag end event for the item that was dragged
+            if (this.dragCurrent) {
+                if (this.dragThreshMet) {
+                    this.dragCurrent.b4EndDrag(e);
+                    this.dragCurrent.endDrag(e);
+                }
+
+                this.dragCurrent.onMouseUp(e);
+            }
+
+            this.dragCurrent = null;
+            this.dragOvers = {};
+        },
+
+        /**
+         * Internal function to handle the mousemove event.  Will be invoked
+         * from the context of the html element.
+         *
+         * @TODO figure out what we can do about mouse events lost when the
+         * user drags objects beyond the window boundary.  Currently we can
+         * detect this in internet explorer by verifying that the mouse is
+         * down during the mousemove event.  Firefox doesn't give us the
+         * button state on the mousemove event.
+         * @method handleMouseMove
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseMove: function(e) {
+            if (! this.dragCurrent) {
+                return true;
+            }
+            // var button = e.which || e.button;
+
+            // check for IE mouseup outside of page boundary
+            if (Ext.isIE && (e.button !== 0 && e.button !== 1 && e.button !== 2)) {
+                this.stopEvent(e);
+                return this.handleMouseUp(e);
+            }
+
+            if (!this.dragThreshMet) {
+                var diffX = Math.abs(this.startX - e.getPageX());
+                var diffY = Math.abs(this.startY - e.getPageY());
+                if (diffX > this.clickPixelThresh ||
+                            diffY > this.clickPixelThresh) {
+                    this.startDrag(this.startX, this.startY);
+                }
+            }
+
+            if (this.dragThreshMet) {
+                this.dragCurrent.b4Drag(e);
+                this.dragCurrent.onDrag(e);
+                if(!this.dragCurrent.moveOnly){
+                    this.fireEvents(e, false);
+                }
+            }
+
+            this.stopEvent(e);
+
+            return true;
+        },
+
+        /**
+         * Iterates over all of the DragDrop elements to find ones we are
+         * hovering over or dropping on
+         * @method fireEvents
+         * @param {Event} e the event
+         * @param {boolean} isDrop is this a drop op or a mouseover op?
+         * @private
+         * @static
+         */
+        fireEvents: function(e, isDrop) {
+            var dc = this.dragCurrent;
+
+            // If the user did the mouse up outside of the window, we could
+            // get here even though we have ended the drag.
+            if (!dc || dc.isLocked()) {
+                return;
+            }
+
+            var pt = e.getPoint();
+
+            // cache the previous dragOver array
+            var oldOvers = [];
+
+            var outEvts   = [];
+            var overEvts  = [];
+            var dropEvts  = [];
+            var enterEvts = [];
+
+            // Check to see if the object(s) we were hovering over is no longer
+            // being hovered over so we can fire the onDragOut event
+            for (var i in this.dragOvers) {
+
+                var ddo = this.dragOvers[i];
+
+                if (! this.isTypeOfDD(ddo)) {
+                    continue;
+                }
+
+                if (! this.isOverTarget(pt, ddo, this.mode)) {
+                    outEvts.push( ddo );
+                }
+
+                oldOvers[i] = true;
+                delete this.dragOvers[i];
+            }
+
+            for (var sGroup in dc.groups) {
+
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+
+                for (i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+
+                    if (oDD.isTarget && !oDD.isLocked() && ((oDD != dc) || (dc.ignoreSelf === false))) {
+                        if (this.isOverTarget(pt, oDD, this.mode)) {
+                            // look for drop interactions
+                            if (isDrop) {
+                                dropEvts.push( oDD );
+                            // look for drag enter and drag over interactions
+                            } else {
+
+                                // initial drag over: dragEnter fires
+                                if (!oldOvers[oDD.id]) {
+                                    enterEvts.push( oDD );
+                                // subsequent drag overs: dragOver fires
+                                } else {
+                                    overEvts.push( oDD );
+                                }
+
+                                this.dragOvers[oDD.id] = oDD;
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (this.mode) {
+                if (outEvts.length) {
+                    dc.b4DragOut(e, outEvts);
+                    dc.onDragOut(e, outEvts);
+                }
+
+                if (enterEvts.length) {
+                    dc.onDragEnter(e, enterEvts);
+                }
+
+                if (overEvts.length) {
+                    dc.b4DragOver(e, overEvts);
+                    dc.onDragOver(e, overEvts);
+                }
+
+                if (dropEvts.length) {
+                    dc.b4DragDrop(e, dropEvts);
+                    dc.onDragDrop(e, dropEvts);
+                }
+
+            } else {
+                // fire dragout events
+                var len = 0;
+                for (i=0, len=outEvts.length; i<len; ++i) {
+                    dc.b4DragOut(e, outEvts[i].id);
+                    dc.onDragOut(e, outEvts[i].id);
+                }
+
+                // fire enter events
+                for (i=0,len=enterEvts.length; i<len; ++i) {
+                    // dc.b4DragEnter(e, oDD.id);
+                    dc.onDragEnter(e, enterEvts[i].id);
+                }
+
+                // fire over events
+                for (i=0,len=overEvts.length; i<len; ++i) {
+                    dc.b4DragOver(e, overEvts[i].id);
+                    dc.onDragOver(e, overEvts[i].id);
+                }
+
+                // fire drop events
+                for (i=0, len=dropEvts.length; i<len; ++i) {
+                    dc.b4DragDrop(e, dropEvts[i].id);
+                    dc.onDragDrop(e, dropEvts[i].id);
+                }
+
+            }
+
+            // notify about a drop that did not find a target
+            if (isDrop && !dropEvts.length) {
+                dc.onInvalidDrop(e);
+            }
+
+        },
+
+        /**
+         * Helper function for getting the best match from the list of drag
+         * and drop objects returned by the drag and drop events when we are
+         * in INTERSECT mode.  It returns either the first object that the
+         * cursor is over, or the object that has the greatest overlap with
+         * the dragged element.
+         * @method getBestMatch
+         * @param  {DragDrop[]} dds The array of drag and drop objects
+         * targeted
+         * @return {DragDrop}       The best single match
+         * @static
+         */
+        getBestMatch: function(dds) {
+            var winner = null;
+            // Return null if the input is not what we expect
+            //if (!dds || !dds.length || dds.length == 0) {
+               // winner = null;
+            // If there is only one item, it wins
+            //} else if (dds.length == 1) {
+
+            var len = dds.length;
+
+            if (len == 1) {
+                winner = dds[0];
+            } else {
+                // Loop through the targeted items
+                for (var i=0; i<len; ++i) {
+                    var dd = dds[i];
+                    // If the cursor is over the object, it wins.  If the
+                    // cursor is over multiple matches, the first one we come
+                    // to wins.
+                    if (dd.cursorIsOver) {
+                        winner = dd;
+                        break;
+                    // Otherwise the object with the most overlap wins
+                    } else {
+                        if (!winner ||
+                            winner.overlap.getArea() < dd.overlap.getArea()) {
+                            winner = dd;
+                        }
+                    }
+                }
+            }
+
+            return winner;
+        },
+
+        /**
+         * Refreshes the cache of the top-left and bottom-right points of the
+         * drag and drop objects in the specified group(s).  This is in the
+         * format that is stored in the drag and drop instance, so typical
+         * usage is:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache(ddinstance.groups);
+         * </code>
+         * Alternatively:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache({group1:true, group2:true});
+         * </code>
+         * @TODO this really should be an indexed array.  Alternatively this
+         * method could accept both.
+         * @method refreshCache
+         * @param {Object} groups an associative array of groups to refresh
+         * @static
+         */
+        refreshCache: function(groups) {
+            for (var sGroup in groups) {
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+                for (var i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+
+                    if (this.isTypeOfDD(oDD)) {
+                    // if (this.isTypeOfDD(oDD) && oDD.isTarget) {
+                        var loc = this.getLocation(oDD);
+                        if (loc) {
+                            this.locationCache[oDD.id] = loc;
+                        } else {
+                            delete this.locationCache[oDD.id];
+                            // this will unregister the drag and drop object if
+                            // the element is not in a usable state
+                            // oDD.unreg();
+                        }
+                    }
+                }
+            }
+        },
+
+        /**
+         * This checks to make sure an element exists and is in the DOM.  The
+         * main purpose is to handle cases where innerHTML is used to remove
+         * drag and drop objects from the DOM.  IE provides an 'unspecified
+         * error' when trying to access the offsetParent of such an element
+         * @method verifyEl
+         * @param {HTMLElement} el the element to check
+         * @return {boolean} true if the element looks usable
+         * @static
+         */
+        verifyEl: function(el) {
+            if (el) {
+                var parent;
+                if(Ext.isIE){
+                    try{
+                        parent = el.offsetParent;
+                    }catch(e){}
+                }else{
+                    parent = el.offsetParent;
+                }
+                if (parent) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * Returns a Region object containing the drag and drop element's position
+         * and size, including the padding configured for it
+         * @method getLocation
+         * @param {DragDrop} oDD the drag and drop object to get the
+         *                       location for
+         * @return {Ext.lib.Region} a Region object representing the total area
+         *                             the element occupies, including any padding
+         *                             the instance is configured for.
+         * @static
+         */
+        getLocation: function(oDD) {
+            if (! this.isTypeOfDD(oDD)) {
+                return null;
+            }
+
+            var el = oDD.getEl(), pos, x1, x2, y1, y2, t, r, b, l, region;
+
+            try {
+                pos= Ext.lib.Dom.getXY(el);
+            } catch (e) { }
+
+            if (!pos) {
+                return null;
+            }
+
+            x1 = pos[0];
+            x2 = x1 + el.offsetWidth;
+            y1 = pos[1];
+            y2 = y1 + el.offsetHeight;
+
+            t = y1 - oDD.padding[0];
+            r = x2 + oDD.padding[1];
+            b = y2 + oDD.padding[2];
+            l = x1 - oDD.padding[3];
+
+            region = new Ext.lib.Region( t, r, b, l );
+            /*
+             * The code below is to ensure that large scrolling elements will
+             * only have their visible area recognized as a drop target, otherwise it 
+             * can potentially erronously register as a target when the element scrolls
+             * over the top of something below it.
+             */
+            el = Ext.get(el.parentNode);
+            while (el && region) {
+	            if (el.isScrollable()) {
+	                // check whether our element is visible in the view port:
+	                region = region.intersect(el.getRegion());
+	            }
+	            el = el.parent();
+            }
+            return region;
+        },
+
+        /**
+         * Checks the cursor location to see if it over the target
+         * @method isOverTarget
+         * @param {Ext.lib.Point} pt The point to evaluate
+         * @param {DragDrop} oTarget the DragDrop object we are inspecting
+         * @return {boolean} true if the mouse is over the target
+         * @private
+         * @static
+         */
+        isOverTarget: function(pt, oTarget, intersect) {
+            // use cache if available
+            var loc = this.locationCache[oTarget.id];
+            if (!loc || !this.useCache) {
+                loc = this.getLocation(oTarget);
+                this.locationCache[oTarget.id] = loc;
+
+            }
+
+            if (!loc) {
+                return false;
+            }
+
+            oTarget.cursorIsOver = loc.contains( pt );
+
+            // DragDrop is using this as a sanity check for the initial mousedown
+            // in this case we are done.  In POINT mode, if the drag obj has no
+            // contraints, we are also done. Otherwise we need to evaluate the
+            // location of the target as related to the actual location of the
+            // dragged element.
+            var dc = this.dragCurrent;
+            if (!dc || !dc.getTargetCoord ||
+                    (!intersect && !dc.constrainX && !dc.constrainY)) {
+                return oTarget.cursorIsOver;
+            }
+
+            oTarget.overlap = null;
+
+            // Get the current location of the drag element, this is the
+            // location of the mouse event less the delta that represents
+            // where the original mousedown happened on the element.  We
+            // need to consider constraints and ticks as well.
+            var pos = dc.getTargetCoord(pt.x, pt.y);
+
+            var el = dc.getDragEl();
+            var curRegion = new Ext.lib.Region( pos.y,
+                                                   pos.x + el.offsetWidth,
+                                                   pos.y + el.offsetHeight,
+                                                   pos.x );
+
+            var overlap = curRegion.intersect(loc);
+
+            if (overlap) {
+                oTarget.overlap = overlap;
+                return (intersect) ? true : oTarget.cursorIsOver;
+            } else {
+                return false;
+            }
+        },
+
+        /**
+         * unload event handler
+         * @method _onUnload
+         * @private
+         * @static
+         */
+        _onUnload: function(e, me) {
+            Event.removeListener(document, "mouseup",   this.handleMouseUp, this);
+            Event.removeListener(document, "mousemove", this.handleMouseMove, this);
+            Event.removeListener(window,   "resize",    this._onResize, this);
+            Ext.dd.DragDropMgr.unregAll();
+        },
+
+        /**
+         * Cleans up the drag and drop events and objects.
+         * @method unregAll
+         * @private
+         * @static
+         */
+        unregAll: function() {
+
+            if (this.dragCurrent) {
+                this.stopDrag();
+                this.dragCurrent = null;
+            }
+
+            this._execOnAll("unreg", []);
+
+            for (var i in this.elementCache) {
+                delete this.elementCache[i];
+            }
+
+            this.elementCache = {};
+            this.ids = {};
+        },
+
+        /**
+         * A cache of DOM elements
+         * @property elementCache
+         * @private
+         * @static
+         */
+        elementCache: {},
+
+        /**
+         * Get the wrapper for the DOM element specified
+         * @method getElWrapper
+         * @param {String} id the id of the element to get
+         * @return {Ext.dd.DDM.ElementWrapper} the wrapped element
+         * @private
+         * @deprecated This wrapper isn't that useful
+         * @static
+         */
+        getElWrapper: function(id) {
+            var oWrapper = this.elementCache[id];
+            if (!oWrapper || !oWrapper.el) {
+                oWrapper = this.elementCache[id] =
+                    new this.ElementWrapper(Ext.getDom(id));
+            }
+            return oWrapper;
+        },
+
+        /**
+         * Returns the actual DOM element
+         * @method getElement
+         * @param {String} id the id of the elment to get
+         * @return {Object} The element
+         * @deprecated use Ext.lib.Ext.getDom instead
+         * @static
+         */
+        getElement: function(id) {
+            return Ext.getDom(id);
+        },
+
+        /**
+         * Returns the style property for the DOM element (i.e.,
+         * document.getElById(id).style)
+         * @method getCss
+         * @param {String} id the id of the elment to get
+         * @return {Object} The style property of the element
+         * @deprecated use Ext.lib.Dom instead
+         * @static
+         */
+        getCss: function(id) {
+            var el = Ext.getDom(id);
+            return (el) ? el.style : null;
+        },
+
+        /**
+         * Inner class for cached elements
+         * @class Ext.dd.DragDropMgr.ElementWrapper
+         * @for DragDropMgr
+         * @private
+         * @deprecated
+         */
+        ElementWrapper: function(el) {
+                /**
+                 * The element
+                 * @property el
+                 */
+                this.el = el || null;
+                /**
+                 * The element id
+                 * @property id
+                 */
+                this.id = this.el && el.id;
+                /**
+                 * A reference to the style property
+                 * @property css
+                 */
+                this.css = this.el && el.style;
+            },
+
+        /**
+         * Returns the X position of an html element
+         * @method getPosX
+         * @param el the element for which to get the position
+         * @return {int} the X coordinate
+         * @for DragDropMgr
+         * @deprecated use Ext.lib.Dom.getX instead
+         * @static
+         */
+        getPosX: function(el) {
+            return Ext.lib.Dom.getX(el);
+        },
+
+        /**
+         * Returns the Y position of an html element
+         * @method getPosY
+         * @param el the element for which to get the position
+         * @return {int} the Y coordinate
+         * @deprecated use Ext.lib.Dom.getY instead
+         * @static
+         */
+        getPosY: function(el) {
+            return Ext.lib.Dom.getY(el);
+        },
+
+        /**
+         * Swap two nodes.  In IE, we use the native method, for others we
+         * emulate the IE behavior
+         * @method swapNode
+         * @param n1 the first node to swap
+         * @param n2 the other node to swap
+         * @static
+         */
+        swapNode: function(n1, n2) {
+            if (n1.swapNode) {
+                n1.swapNode(n2);
+            } else {
+                var p = n2.parentNode;
+                var s = n2.nextSibling;
+
+                if (s == n1) {
+                    p.insertBefore(n1, n2);
+                } else if (n2 == n1.nextSibling) {
+                    p.insertBefore(n2, n1);
+                } else {
+                    n1.parentNode.replaceChild(n2, n1);
+                    p.insertBefore(n1, s);
+                }
+            }
+        },
+
+        /**
+         * Returns the current scroll position
+         * @method getScroll
+         * @private
+         * @static
+         */
+        getScroll: function () {
+            var t, l, dde=document.documentElement, db=document.body;
+            if (dde && (dde.scrollTop || dde.scrollLeft)) {
+                t = dde.scrollTop;
+                l = dde.scrollLeft;
+            } else if (db) {
+                t = db.scrollTop;
+                l = db.scrollLeft;
+            } else {
+
+            }
+            return { top: t, left: l };
+        },
+
+        /**
+         * Returns the specified element style property
+         * @method getStyle
+         * @param {HTMLElement} el          the element
+         * @param {string}      styleProp   the style property
+         * @return {string} The value of the style property
+         * @deprecated use Ext.lib.Dom.getStyle
+         * @static
+         */
+        getStyle: function(el, styleProp) {
+            return Ext.fly(el).getStyle(styleProp);
+        },
+
+        /**
+         * Gets the scrollTop
+         * @method getScrollTop
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollTop: function () {
+            return this.getScroll().top;
+        },
+
+        /**
+         * Gets the scrollLeft
+         * @method getScrollLeft
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollLeft: function () {
+            return this.getScroll().left;
+        },
+
+        /**
+         * Sets the x/y position of an element to the location of the
+         * target element.
+         * @method moveToEl
+         * @param {HTMLElement} moveEl      The element to move
+         * @param {HTMLElement} targetEl    The position reference element
+         * @static
+         */
+        moveToEl: function (moveEl, targetEl) {
+            var aCoord = Ext.lib.Dom.getXY(targetEl);
+            Ext.lib.Dom.setXY(moveEl, aCoord);
+        },
+
+        /**
+         * Numeric array sort function
+         * @method numericSort
+         * @static
+         */
+        numericSort: function(a, b) {
+            return (a - b);
+        },
+
+        /**
+         * Internal counter
+         * @property _timeoutCount
+         * @private
+         * @static
+         */
+        _timeoutCount: 0,
+
+        /**
+         * Trying to make the load order less important.  Without this we get
+         * an error if this file is loaded before the Event Utility.
+         * @method _addListeners
+         * @private
+         * @static
+         */
+        _addListeners: function() {
+            var DDM = Ext.dd.DDM;
+            if ( Ext.lib.Event && document ) {
+                DDM._onLoad();
+            } else {
+                if (DDM._timeoutCount > 2000) {
+                } else {
+                    setTimeout(DDM._addListeners, 10);
+                    if (document && document.body) {
+                        DDM._timeoutCount += 1;
+                    }
+                }
+            }
+        },
+
+        /**
+         * Recursively searches the immediate parent and all child nodes for
+         * the handle element in order to determine wheter or not it was
+         * clicked.
+         * @method handleWasClicked
+         * @param node the html element to inspect
+         * @static
+         */
+        handleWasClicked: function(node, id) {
+            if (this.isHandle(id, node.id)) {
+                return true;
+            } else {
+                // check to see if this is a text node child of the one we want
+                var p = node.parentNode;
+
+                while (p) {
+                    if (this.isHandle(id, p.id)) {
+                        return true;
+                    } else {
+                        p = p.parentNode;
+                    }
+                }
+            }
+
+            return false;
+        }
+
+    };
+
+}();
+
+// shorter alias, save a few bytes
+Ext.dd.DDM = Ext.dd.DragDropMgr;
+Ext.dd.DDM._addListeners();
+
+}
+
+/**
+ * @class Ext.dd.DD
+ * A DragDrop implementation where the linked element follows the
+ * mouse cursor during a drag.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DD:
+ *                    scroll
+ */
+Ext.dd.DD = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.extend(Ext.dd.DD, Ext.dd.DragDrop, {
+
+    /**
+     * When set to true, the utility automatically tries to scroll the browser
+     * window when a drag and drop element is dragged near the viewport boundary.
+     * Defaults to true.
+     * @property scroll
+     * @type boolean
+     */
+    scroll: true,
+
+    /**
+     * Sets the pointer offset to the distance between the linked element's top
+     * left corner and the location the element was clicked
+     * @method autoOffset
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     */
+    autoOffset: function(iPageX, iPageY) {
+        var x = iPageX - this.startPageX;
+        var y = iPageY - this.startPageY;
+        this.setDelta(x, y);
+    },
+
+    /**
+     * Sets the pointer offset.  You can call this directly to force the
+     * offset to be in a particular location (e.g., pass in 0,0 to set it
+     * to the center of the object)
+     * @method setDelta
+     * @param {int} iDeltaX the distance from the left
+     * @param {int} iDeltaY the distance from the top
+     */
+    setDelta: function(iDeltaX, iDeltaY) {
+        this.deltaX = iDeltaX;
+        this.deltaY = iDeltaY;
+    },
+
+    /**
+     * Sets the drag element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method setDragElPos
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    setDragElPos: function(iPageX, iPageY) {
+        // the first time we do this, we are going to check to make sure
+        // the element has css positioning
+
+        var el = this.getDragEl();
+        this.alignElWithMouse(el, iPageX, iPageY);
+    },
+
+    /**
+     * Sets the element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method alignElWithMouse
+     * @param {HTMLElement} el the element to move
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    alignElWithMouse: function(el, iPageX, iPageY) {
+        var oCoord = this.getTargetCoord(iPageX, iPageY);
+        var fly = el.dom ? el : Ext.fly(el, '_dd');
+        if (!this.deltaSetXY) {
+            var aCoord = [oCoord.x, oCoord.y];
+            fly.setXY(aCoord);
+            var newLeft = fly.getLeft(true);
+            var newTop  = fly.getTop(true);
+            this.deltaSetXY = [ newLeft - oCoord.x, newTop - oCoord.y ];
+        } else {
+            fly.setLeftTop(oCoord.x + this.deltaSetXY[0], oCoord.y + this.deltaSetXY[1]);
+        }
+
+        this.cachePosition(oCoord.x, oCoord.y);
+        this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth);
+        return oCoord;
+    },
+
+    /**
+     * Saves the most recent position so that we can reset the constraints and
+     * tick marks on-demand.  We need to know this so that we can calculate the
+     * number of pixels the element is offset from its original position.
+     * @method cachePosition
+     * @param iPageX the current x position (optional, this just makes it so we
+     * don't have to look it up again)
+     * @param iPageY the current y position (optional, this just makes it so we
+     * don't have to look it up again)
+     */
+    cachePosition: function(iPageX, iPageY) {
+        if (iPageX) {
+            this.lastPageX = iPageX;
+            this.lastPageY = iPageY;
+        } else {
+            var aCoord = Ext.lib.Dom.getXY(this.getEl());
+            this.lastPageX = aCoord[0];
+            this.lastPageY = aCoord[1];
+        }
+    },
+
+    /**
+     * Auto-scroll the window if the dragged object has been moved beyond the
+     * visible window boundary.
+     * @method autoScroll
+     * @param {int} x the drag element's x position
+     * @param {int} y the drag element's y position
+     * @param {int} h the height of the drag element
+     * @param {int} w the width of the drag element
+     * @private
+     */
+    autoScroll: function(x, y, h, w) {
+
+        if (this.scroll) {
+            // The client height
+            var clientH = Ext.lib.Dom.getViewHeight();
+
+            // The client width
+            var clientW = Ext.lib.Dom.getViewWidth();
+
+            // The amt scrolled down
+            var st = this.DDM.getScrollTop();
+
+            // The amt scrolled right
+            var sl = this.DDM.getScrollLeft();
+
+            // Location of the bottom of the element
+            var bot = h + y;
+
+            // Location of the right of the element
+            var right = w + x;
+
+            // The distance from the cursor to the bottom of the visible area,
+            // adjusted so that we don't scroll if the cursor is beyond the
+            // element drag constraints
+            var toBot = (clientH + st - y - this.deltaY);
+
+            // The distance from the cursor to the right of the visible area
+            var toRight = (clientW + sl - x - this.deltaX);
+
+
+            // How close to the edge the cursor must be before we scroll
+            // var thresh = (document.all) ? 100 : 40;
+            var thresh = 40;
+
+            // How many pixels to scroll per autoscroll op.  This helps to reduce
+            // clunky scrolling. IE is more sensitive about this ... it needs this
+            // value to be higher.
+            var scrAmt = (document.all) ? 80 : 30;
+
+            // Scroll down if we are near the bottom of the visible page and the
+            // obj extends below the crease
+            if ( bot > clientH && toBot < thresh ) {
+                window.scrollTo(sl, st + scrAmt);
+            }
+
+            // Scroll up if the window is scrolled down and the top of the object
+            // goes above the top border
+            if ( y < st && st > 0 && y - st < thresh ) {
+                window.scrollTo(sl, st - scrAmt);
+            }
+
+            // Scroll right if the obj is beyond the right border and the cursor is
+            // near the border.
+            if ( right > clientW && toRight < thresh ) {
+                window.scrollTo(sl + scrAmt, st);
+            }
+
+            // Scroll left if the window has been scrolled to the right and the obj
+            // extends past the left border
+            if ( x < sl && sl > 0 && x - sl < thresh ) {
+                window.scrollTo(sl - scrAmt, st);
+            }
+        }
+    },
+
+    /**
+     * Finds the location the element should be placed if we want to move
+     * it to where the mouse location less the click offset would place us.
+     * @method getTargetCoord
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     * @return an object that contains the coordinates (Object.x and Object.y)
+     * @private
+     */
+    getTargetCoord: function(iPageX, iPageY) {
+        var x = iPageX - this.deltaX;
+        var y = iPageY - this.deltaY;
+
+        if (this.constrainX) {
+            if (x < this.minX) { x = this.minX; }
+            if (x > this.maxX) { x = this.maxX; }
+        }
+
+        if (this.constrainY) {
+            if (y < this.minY) { y = this.minY; }
+            if (y > this.maxY) { y = this.maxY; }
+        }
+
+        x = this.getTick(x, this.xTicks);
+        y = this.getTick(y, this.yTicks);
+
+
+        return {x:x, y:y};
+    },
+
+    /**
+     * Sets up config options specific to this class. Overrides
+     * Ext.dd.DragDrop, but all versions of this method through the
+     * inheritance chain are called
+     */
+    applyConfig: function() {
+        Ext.dd.DD.superclass.applyConfig.call(this);
+        this.scroll = (this.config.scroll !== false);
+    },
+
+    /**
+     * Event that fires prior to the onMouseDown event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4MouseDown: function(e) {
+        // this.resetConstraints();
+        this.autoOffset(e.getPageX(),
+                            e.getPageY());
+    },
+
+    /**
+     * Event that fires prior to the onDrag event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4Drag: function(e) {
+        this.setDragElPos(e.getPageX(),
+                            e.getPageY());
+    },
+
+    toString: function() {
+        return ("DD " + this.id);
+    }
+
+    //////////////////////////////////////////////////////////////////////////
+    // Debugging ygDragDrop events that can be overridden
+    //////////////////////////////////////////////////////////////////////////
+    /*
+    startDrag: function(x, y) {
+    },
+
+    onDrag: function(e) {
+    },
+
+    onDragEnter: function(e, id) {
+    },
+
+    onDragOver: function(e, id) {
+    },
+
+    onDragOut: function(e, id) {
+    },
+
+    onDragDrop: function(e, id) {
+    },
+
+    endDrag: function(e) {
+    }
+
+    */
+
+});
+/**
+ * @class Ext.dd.DDProxy
+ * A DragDrop implementation that inserts an empty, bordered div into
+ * the document that follows the cursor during drag operations.  At the time of
+ * the click, the frame div is resized to the dimensions of the linked html
+ * element, and moved to the exact location of the linked element.
+ *
+ * References to the "frame" element refer to the single proxy element that
+ * was created to be dragged in place of all DDProxy elements on the
+ * page.
+ *
+ * @extends Ext.dd.DD
+ * @constructor
+ * @param {String} id the id of the linked html element
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DDProxy in addition to those in DragDrop:
+ *                   resizeFrame, centerFrame, dragElId
+ */
+Ext.dd.DDProxy = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+    }
+};
+
+/**
+ * The default drag frame div id
+ * @property Ext.dd.DDProxy.dragElId
+ * @type String
+ * @static
+ */
+Ext.dd.DDProxy.dragElId = "ygddfdiv";
+
+Ext.extend(Ext.dd.DDProxy, Ext.dd.DD, {
+
+    /**
+     * By default we resize the drag frame to be the same size as the element
+     * we want to drag (this is to get the frame effect).  We can turn it off
+     * if we want a different behavior.
+     * @property resizeFrame
+     * @type boolean
+     */
+    resizeFrame: true,
+
+    /**
+     * By default the frame is positioned exactly where the drag element is, so
+     * we use the cursor offset provided by Ext.dd.DD.  Another option that works only if
+     * you do not have constraints on the obj is to have the drag frame centered
+     * around the cursor.  Set centerFrame to true for this effect.
+     * @property centerFrame
+     * @type boolean
+     */
+    centerFrame: false,
+
+    /**
+     * Creates the proxy element if it does not yet exist
+     * @method createFrame
+     */
+    createFrame: function() {
+        var self = this;
+        var body = document.body;
+
+        if (!body || !body.firstChild) {
+            setTimeout( function() { self.createFrame(); }, 50 );
+            return;
+        }
+
+        var div = this.getDragEl();
+
+        if (!div) {
+            div    = document.createElement("div");
+            div.id = this.dragElId;
+            var s  = div.style;
+
+            s.position   = "absolute";
+            s.visibility = "hidden";
+            s.cursor     = "move";
+            s.border     = "2px solid #aaa";
+            s.zIndex     = 999;
+
+            // appendChild can blow up IE if invoked prior to the window load event
+            // while rendering a table.  It is possible there are other scenarios
+            // that would cause this to happen as well.
+            body.insertBefore(div, body.firstChild);
+        }
+    },
+
+    /**
+     * Initialization for the drag frame element.  Must be called in the
+     * constructor of all subclasses
+     * @method initFrame
+     */
+    initFrame: function() {
+        this.createFrame();
+    },
+
+    applyConfig: function() {
+        Ext.dd.DDProxy.superclass.applyConfig.call(this);
+
+        this.resizeFrame = (this.config.resizeFrame !== false);
+        this.centerFrame = (this.config.centerFrame);
+        this.setDragElId(this.config.dragElId || Ext.dd.DDProxy.dragElId);
+    },
+
+    /**
+     * Resizes the drag frame to the dimensions of the clicked object, positions
+     * it over the object, and finally displays it
+     * @method showFrame
+     * @param {int} iPageX X click position
+     * @param {int} iPageY Y click position
+     * @private
+     */
+    showFrame: function(iPageX, iPageY) {
+        var el = this.getEl();
+        var dragEl = this.getDragEl();
+        var s = dragEl.style;
+
+        this._resizeProxy();
+
+        if (this.centerFrame) {
+            this.setDelta( Math.round(parseInt(s.width,  10)/2),
+                           Math.round(parseInt(s.height, 10)/2) );
+        }
+
+        this.setDragElPos(iPageX, iPageY);
+
+        Ext.fly(dragEl).show();
+    },
+
+    /**
+     * The proxy is automatically resized to the dimensions of the linked
+     * element when a drag is initiated, unless resizeFrame is set to false
+     * @method _resizeProxy
+     * @private
+     */
+    _resizeProxy: function() {
+        if (this.resizeFrame) {
+            var el = this.getEl();
+            Ext.fly(this.getDragEl()).setSize(el.offsetWidth, el.offsetHeight);
+        }
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4MouseDown: function(e) {
+        var x = e.getPageX();
+        var y = e.getPageY();
+        this.autoOffset(x, y);
+        this.setDragElPos(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4StartDrag: function(x, y) {
+        // show the drag frame
+        this.showFrame(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4EndDrag: function(e) {
+        Ext.fly(this.getDragEl()).hide();
+    },
+
+    // overrides Ext.dd.DragDrop
+    // By default we try to move the element to the last location of the frame.
+    // This is so that the default behavior mirrors that of Ext.dd.DD.
+    endDrag: function(e) {
+
+        var lel = this.getEl();
+        var del = this.getDragEl();
+
+        // Show the drag frame briefly so we can get its position
+        del.style.visibility = "";
+
+        this.beforeMove();
+        // Hide the linked element before the move to get around a Safari
+        // rendering bug.
+        lel.style.visibility = "hidden";
+        Ext.dd.DDM.moveToEl(lel, del);
+        del.style.visibility = "hidden";
+        lel.style.visibility = "";
+
+        this.afterDrag();
+    },
+
+    beforeMove : function(){
+
+    },
+
+    afterDrag : function(){
+
+    },
+
+    toString: function() {
+        return ("DDProxy " + this.id);
+    }
+
+});
+/**
+ * @class Ext.dd.DDTarget
+ * A DragDrop implementation that does not move, but can be a drop
+ * target.  You would get the same result by simply omitting implementation
+ * for the event callbacks, but this way we reduce the processing cost of the
+ * event listener and the callbacks.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the element that is a drop target
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                 Valid properties for DDTarget in addition to those in
+ *                 DragDrop:
+ *                    none
+ */
+Ext.dd.DDTarget = function(id, sGroup, config) {
+    if (id) {
+        this.initTarget(id, sGroup, config);
+    }
+};
+
+// Ext.dd.DDTarget.prototype = new Ext.dd.DragDrop();
+Ext.extend(Ext.dd.DDTarget, Ext.dd.DragDrop, {
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    getDragEl: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    isValidHandleChild: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    startDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    endDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragEnter: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOut: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOver: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onInvalidDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseDown: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseUp: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setXConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setYConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    resetConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearTicks: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setInitPosition: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setDragElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setOuterHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleType: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleType: Ext.emptyFn,
+
+    toString: function() {
+        return ("DDTarget " + this.id);
+    }
+});/**
+ * @class Ext.dd.DragTracker
+ * @extends Ext.util.Observable
+ * A DragTracker listens for drag events on an Element and fires events at the start and end of the drag,
+ * as well as during the drag. This is useful for components such as {@link Ext.slider.MultiSlider}, where there is
+ * an element that can be dragged around to change the Slider's value.
+ * DragTracker provides a series of template methods that should be overridden to provide functionality
+ * in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd.
+ * See {@link Ext.slider.MultiSlider}'s initEvents function for an example implementation.
+ */
+Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
+    /**
+     * @cfg {Boolean} active
+	 * Defaults to <tt>false</tt>.
+	 */	
+    active: false,
+    /**
+     * @cfg {Number} tolerance
+	 * Number of pixels the drag target must be moved before dragging is considered to have started. Defaults to <tt>5</tt>.
+	 */	
+    tolerance: 5,
+    /**
+     * @cfg {Boolean/Number} autoStart
+	 * Defaults to <tt>false</tt>. Specify <tt>true</tt> to defer trigger start by 1000 ms.
+	 * Specify a Number for the number of milliseconds to defer trigger start.
+	 */	
+    autoStart: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+	    this.addEvents(
+	        /**
+	         * @event mousedown
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousedown',
+	        /**
+	         * @event mouseup
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mouseup',
+	        /**
+	         * @event mousemove
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousemove',
+	        /**
+	         * @event dragstart
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragstart',
+	        /**
+	         * @event dragend
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragend',
+	        /**
+	         * @event drag
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'drag'
+	    );
+	
+	    this.dragRegion = new Ext.lib.Region(0,0,0,0);
+	
+	    if(this.el){
+	        this.initEl(this.el);
+	    }
+        Ext.dd.DragTracker.superclass.constructor.call(this, config);
+    },
+
+    initEl: function(el){
+        this.el = Ext.get(el);
+        el.on('mousedown', this.onMouseDown, this,
+                this.delegate ? {delegate: this.delegate} : undefined);
+    },
+
+    destroy : function(){
+        this.el.un('mousedown', this.onMouseDown, this);
+        delete this.el;
+    },
+
+    onMouseDown: function(e, target){
+        if(this.fireEvent('mousedown', this, e) !== false && this.onBeforeStart(e) !== false){
+            this.startXY = this.lastXY = e.getXY();
+            this.dragTarget = this.delegate ? target : this.el.dom;
+            if(this.preventDefault !== false){
+                e.preventDefault();
+            }
+            Ext.getDoc().on({
+                scope: this,
+                mouseup: this.onMouseUp,
+                mousemove: this.onMouseMove,
+                selectstart: this.stopSelect
+            });
+            if(this.autoStart){
+                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this, [e]);
+            }
+        }
+    },
+
+    onMouseMove: function(e, target){
+        // HACK: IE hack to see if button was released outside of window. */
+        if(this.active && Ext.isIE && !e.browserEvent.button){
+            e.preventDefault();
+            this.onMouseUp(e);
+            return;
+        }
+
+        e.preventDefault();
+        var xy = e.getXY(), s = this.startXY;
+        this.lastXY = xy;
+        if(!this.active){
+            if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
+                this.triggerStart(e);
+            }else{
+                return;
+            }
+        }
+        this.fireEvent('mousemove', this, e);
+        this.onDrag(e);
+        this.fireEvent('drag', this, e);
+    },
+
+    onMouseUp: function(e) {
+        var doc = Ext.getDoc(),
+            wasActive = this.active;
+            
+        doc.un('mousemove', this.onMouseMove, this);
+        doc.un('mouseup', this.onMouseUp, this);
+        doc.un('selectstart', this.stopSelect, this);
+        e.preventDefault();
+        this.clearStart();
+        this.active = false;
+        delete this.elRegion;
+        this.fireEvent('mouseup', this, e);
+        if(wasActive){
+            this.onEnd(e);
+            this.fireEvent('dragend', this, e);
+        }
+    },
+
+    triggerStart: function(e) {
+        this.clearStart();
+        this.active = true;
+        this.onStart(e);
+        this.fireEvent('dragstart', this, e);
+    },
+
+    clearStart : function() {
+        if(this.timer){
+            clearTimeout(this.timer);
+            delete this.timer;
+        }
+    },
+
+    stopSelect : function(e) {
+        e.stopEvent();
+        return false;
+    },
+    
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when the user first clicks and
+     * holds the mouse button down. Return false to disallow the drag
+     * @param {Ext.EventObject} e The event object
+     */
+    onBeforeStart : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation starts
+     * (e.g. the user has moved the tracked element beyond the specified tolerance)
+     * @param {Ext.EventObject} e The event object
+     */
+    onStart : function(xy) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called whenever a drag has been detected.
+     * @param {Ext.EventObject} e The event object
+     */
+    onDrag : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation has been completed
+     * (e.g. the user clicked and held the mouse down, dragged the element and then released the mouse button)
+     * @param {Ext.EventObject} e The event object
+     */
+    onEnd : function(e) {
+
+    },
+
+    /**
+     * Returns the drag target
+     * @return {Ext.Element} The element currently being tracked
+     */
+    getDragTarget : function(){
+        return this.dragTarget;
+    },
+
+    getDragCt : function(){
+        return this.el;
+    },
+
+    getXY : function(constrain){
+        return constrain ?
+               this.constrainModes[constrain].call(this, this.lastXY) : this.lastXY;
+    },
+
+    getOffset : function(constrain){
+        var xy = this.getXY(constrain),
+            s = this.startXY;
+        return [s[0]-xy[0], s[1]-xy[1]];
+    },
+
+    constrainModes: {
+        'point' : function(xy){
+
+            if(!this.elRegion){
+                this.elRegion = this.getDragCt().getRegion();
+            }
+
+            var dr = this.dragRegion;
+
+            dr.left = xy[0];
+            dr.top = xy[1];
+            dr.right = xy[0];
+            dr.bottom = xy[1];
+
+            dr.constrainTo(this.elRegion);
+
+            return [dr.left, dr.top];
+        }
+    }
+});/**
+ * @class Ext.dd.ScrollManager
+ * <p>Provides automatic scrolling of overflow regions in the page during drag operations.</p>
+ * <p>The ScrollManager configs will be used as the defaults for any scroll container registered with it,
+ * but you can also override most of the configs per scroll container by adding a 
+ * <tt>ddScrollConfig</tt> object to the target element that contains these properties: {@link #hthresh},
+ * {@link #vthresh}, {@link #increment} and {@link #frequency}.  Example usage:
+ * <pre><code>
+var el = Ext.get('scroll-ct');
+el.ddScrollConfig = {
+    vthresh: 50,
+    hthresh: -1,
+    frequency: 100,
+    increment: 200
+};
+Ext.dd.ScrollManager.register(el);
+</code></pre>
+ * <b>Note: This class uses "Point Mode" and is untested in "Intersect Mode".</b>
+ * @singleton
+ */
+Ext.dd.ScrollManager = function(){
+    var ddm = Ext.dd.DragDropMgr;
+    var els = {};
+    var dragEl = null;
+    var proc = {};
+    
+    var onStop = function(e){
+        dragEl = null;
+        clearProc();
+    };
+    
+    var triggerRefresh = function(){
+        if(ddm.dragCurrent){
+             ddm.refreshCache(ddm.dragCurrent.groups);
+        }
+    };
+    
+    var doScroll = function(){
+        if(ddm.dragCurrent){
+            var dds = Ext.dd.ScrollManager;
+            var inc = proc.el.ddScrollConfig ?
+                      proc.el.ddScrollConfig.increment : dds.increment;
+            if(!dds.animate){
+                if(proc.el.scroll(proc.dir, inc)){
+                    triggerRefresh();
+                }
+            }else{
+                proc.el.scroll(proc.dir, inc, true, dds.animDuration, triggerRefresh);
+            }
+        }
+    };
+    
+    var clearProc = function(){
+        if(proc.id){
+            clearInterval(proc.id);
+        }
+        proc.id = 0;
+        proc.el = null;
+        proc.dir = "";
+    };
+
+    var startProc = function(el, dir){
+        clearProc();
+        proc.el = el;
+        proc.dir = dir;
+        var group = el.ddScrollConfig ? el.ddScrollConfig.ddGroup : undefined,
+            freq  = (el.ddScrollConfig && el.ddScrollConfig.frequency)
+                  ? el.ddScrollConfig.frequency
+                  : Ext.dd.ScrollManager.frequency;
+
+        if (group === undefined || ddm.dragCurrent.ddGroup == group) {
+            proc.id = setInterval(doScroll, freq);
+        }
+    };
+    
+    var onFire = function(e, isDrop){
+        if(isDrop || !ddm.dragCurrent){ return; }
+        var dds = Ext.dd.ScrollManager;
+        if(!dragEl || dragEl != ddm.dragCurrent){
+            dragEl = ddm.dragCurrent;
+            // refresh regions on drag start
+            dds.refreshCache();
+        }
+        
+        var xy = Ext.lib.Event.getXY(e);
+        var pt = new Ext.lib.Point(xy[0], xy[1]);
+        for(var id in els){
+            var el = els[id], r = el._region;
+            var c = el.ddScrollConfig ? el.ddScrollConfig : dds;
+            if(r && r.contains(pt) && el.isScrollable()){
+                if(r.bottom - pt.y <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "down");
+                    }
+                    return;
+                }else if(r.right - pt.x <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "left");
+                    }
+                    return;
+                }else if(pt.y - r.top <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "up");
+                    }
+                    return;
+                }else if(pt.x - r.left <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "right");
+                    }
+                    return;
+                }
+            }
+        }
+        clearProc();
+    };
+    
+    ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);
+    ddm.stopDrag = ddm.stopDrag.createSequence(onStop, ddm);
+    
+    return {
+        /**
+         * Registers new overflow element(s) to auto scroll
+         * @param {Mixed/Array} el The id of or the element to be scrolled or an array of either
+         */
+        register : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.register(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                els[el.id] = el;
+            }
+        },
+        
+        /**
+         * Unregisters overflow element(s) so they are no longer scrolled
+         * @param {Mixed/Array} el The id of or the element to be removed or an array of either
+         */
+        unregister : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.unregister(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                delete els[el.id];
+            }
+        },
+        
+        /**
+         * The number of pixels from the top or bottom edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        vthresh : 25,
+        /**
+         * The number of pixels from the right or left edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        hthresh : 25,
+
+        /**
+         * The number of pixels to scroll in each scroll increment (defaults to 100)
+         * @type Number
+         */
+        increment : 100,
+        
+        /**
+         * The frequency of scrolls in milliseconds (defaults to 500)
+         * @type Number
+         */
+        frequency : 500,
+        
+        /**
+         * True to animate the scroll (defaults to true)
+         * @type Boolean
+         */
+        animate: true,
+        
+        /**
+         * The animation duration in seconds - 
+         * MUST BE less than Ext.dd.ScrollManager.frequency! (defaults to .4)
+         * @type Number
+         */
+        animDuration: .4,
+        
+        /**
+         * The named drag drop {@link Ext.dd.DragSource#ddGroup group} to which this container belongs (defaults to undefined). 
+         * If a ddGroup is specified, then container scrolling will only occur when a dragged object is in the same ddGroup.
+         * @type String
+         */
+        ddGroup: undefined,
+        
+        /**
+         * Manually trigger a cache refresh.
+         */
+        refreshCache : function(){
+            for(var id in els){
+                if(typeof els[id] == 'object'){ // for people extending the object prototype
+                    els[id]._region = els[id].getRegion();
+                }
+            }
+        }
+    };
+}();/**
+ * @class Ext.dd.Registry
+ * Provides easy access to all drag drop components that are registered on a page.  Items can be retrieved either
+ * directly by DOM node id, or by passing in the drag drop event that occurred and looking up the event target.
+ * @singleton
+ */
+Ext.dd.Registry = function(){
+    var elements = {}; 
+    var handles = {}; 
+    var autoIdSeed = 0;
+
+    var getId = function(el, autogen){
+        if(typeof el == "string"){
+            return el;
+        }
+        var id = el.id;
+        if(!id && autogen !== false){
+            id = "extdd-" + (++autoIdSeed);
+            el.id = id;
+        }
+        return id;
+    };
+    
+    return {
+    /**
+     * Resgister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to register
+     * @param {Object} data (optional) An custom data object that will be passed between the elements that are involved
+     * in drag drop operations.  You can populate this object with any arbitrary properties that your own code
+     * knows how to interpret, plus there are some specific properties known to the Registry that should be
+     * populated in the data object (if applicable):
+     * <pre>
+Value      Description<br />
+---------  ------------------------------------------<br />
+handles    Array of DOM nodes that trigger dragging<br />
+           for the element being registered<br />
+isHandle   True if the element passed in triggers<br />
+           dragging itself, else false
+</pre>
+     */
+        register : function(el, data){
+            data = data || {};
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            data.ddel = el;
+            elements[getId(el)] = data;
+            if(data.isHandle !== false){
+                handles[data.ddel.id] = data;
+            }
+            if(data.handles){
+                var hs = data.handles;
+                for(var i = 0, len = hs.length; i < len; i++){
+                	handles[getId(hs[i])] = data;
+                }
+            }
+        },
+
+    /**
+     * Unregister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to unregister
+     */
+        unregister : function(el){
+            var id = getId(el, false);
+            var data = elements[id];
+            if(data){
+                delete elements[id];
+                if(data.handles){
+                    var hs = data.handles;
+                    for(var i = 0, len = hs.length; i < len; i++){
+                    	delete handles[getId(hs[i], false)];
+                    }
+                }
+            }
+        },
+
+    /**
+     * Returns the handle registered for a DOM Node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} handle The custom handle data
+     */
+        getHandle : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return handles[id];
+        },
+
+    /**
+     * Returns the handle that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} handle The custom handle data
+     */
+        getHandleFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? handles[t.id] : null;
+        },
+
+    /**
+     * Returns a custom data object that is registered for a DOM node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} data The custom data
+     */
+        getTarget : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return elements[id];
+        },
+
+    /**
+     * Returns a custom data object that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+        getTargetFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? elements[t.id] || handles[t.id] : null;
+        }
+    };
+}();/**
+ * @class Ext.dd.StatusProxy
+ * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
+ * default drag proxy used by all Ext.dd components.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.dd.StatusProxy = function(config){
+    Ext.apply(this, config);
+    this.id = this.id || Ext.id();
+    this.el = new Ext.Layer({
+        dh: {
+            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
+                {tag: "div", cls: "x-dd-drop-icon"},
+                {tag: "div", cls: "x-dd-drag-ghost"}
+            ]
+        }, 
+        shadow: !config || config.shadow !== false
+    });
+    this.ghost = Ext.get(this.el.dom.childNodes[1]);
+    this.dropStatus = this.dropNotAllowed;
+};
+
+Ext.dd.StatusProxy.prototype = {
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class to apply to the status element when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class to apply to the status element when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
+     * over the current target element.
+     * @param {String} cssClass The css class for the new drop status indicator image
+     */
+    setStatus : function(cssClass){
+        cssClass = cssClass || this.dropNotAllowed;
+        if(this.dropStatus != cssClass){
+            this.el.replaceClass(this.dropStatus, cssClass);
+            this.dropStatus = cssClass;
+        }
+    },
+
+    /**
+     * Resets the status indicator to the default dropNotAllowed value
+     * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
+     */
+    reset : function(clearGhost){
+        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
+        this.dropStatus = this.dropNotAllowed;
+        if(clearGhost){
+            this.ghost.update("");
+        }
+    },
+
+    /**
+     * Updates the contents of the ghost element
+     * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
+     * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
+     */
+    update : function(html){
+        if(typeof html == "string"){
+            this.ghost.update(html);
+        }else{
+            this.ghost.update("");
+            html.style.margin = "0";
+            this.ghost.dom.appendChild(html);
+        }
+        var el = this.ghost.dom.firstChild; 
+        if(el){
+            Ext.fly(el).setStyle('float', 'none');
+        }
+    },
+
+    /**
+     * Returns the underlying proxy {@link Ext.Layer}
+     * @return {Ext.Layer} el
+    */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the ghost element
+     * @return {Ext.Element} el
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Hides the proxy
+     * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
+     */
+    hide : function(clear){
+        this.el.hide();
+        if(clear){
+            this.reset(true);
+        }
+    },
+
+    /**
+     * Stops the repair animation if it's currently running
+     */
+    stop : function(){
+        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
+            this.anim.stop();
+        }
+    },
+
+    /**
+     * Displays this proxy
+     */
+    show : function(){
+        this.el.show();
+    },
+
+    /**
+     * Force the Layer to sync its shadow and shim positions to the element
+     */
+    sync : function(){
+        this.el.sync();
+    },
+
+    /**
+     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
+     * invalid drop operation by the item being dragged.
+     * @param {Array} xy The XY position of the element ([x, y])
+     * @param {Function} callback The function to call after the repair is complete.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     */
+    repair : function(xy, callback, scope){
+        this.callback = callback;
+        this.scope = scope;
+        if(xy && this.animRepair !== false){
+            this.el.addClass("x-dd-drag-repair");
+            this.el.hideUnders(true);
+            this.anim = this.el.shift({
+                duration: this.repairDuration || .5,
+                easing: 'easeOut',
+                xy: xy,
+                stopFx: true,
+                callback: this.afterRepair,
+                scope: this
+            });
+        }else{
+            this.afterRepair();
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        this.hide(true);
+        if(typeof this.callback == "function"){
+            this.callback.call(this.scope || this);
+        }
+        this.callback = null;
+        this.scope = null;
+    },
+    
+    destroy: function(){
+        Ext.destroy(this.ghost, this.el);    
+    }
+};/**
+ * @class Ext.dd.DragSource
+ * @extends Ext.dd.DDProxy
+ * A simple class that provides the basic implementation needed to make any element draggable.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragSource = function(el, config){
+    this.el = Ext.get(el);
+    if(!this.dragData){
+        this.dragData = {};
+    }
+    
+    Ext.apply(this, config);
+    
+    if(!this.proxy){
+        this.proxy = new Ext.dd.StatusProxy();
+    }
+    Ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
+    
+    this.dragging = false;
+};
+
+Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Returns the data object associated with this drag source
+     * @return {Object} data An object containing arbitrary data
+     */
+    getDragData : function(e){
+        return this.dragData;
+    },
+
+    // private
+    onDragEnter : function(e, id){
+        var target = Ext.dd.DragDropMgr.getDDById(id);
+        this.cachedTarget = target;
+        if(this.beforeDragEnter(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyEnter(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }else{
+                this.proxy.setStatus(this.dropAllowed);
+            }
+            
+            if(this.afterDragEnter){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * when the dragged item enters the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragEnter
+                 */
+                this.afterDragEnter(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * before the dragged item enters the drop target and optionally cancel the onDragEnter.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragEnter : function(target, e, id){
+        return true;
+    },
+
+    // private
+    alignElWithMouse: function() {
+        Ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.proxy.sync();
+    },
+
+    // private
+    onDragOver : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOver(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyOver(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }
+
+            if(this.afterDragOver){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * while the dragged item is over the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOver
+                 */
+                this.afterDragOver(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * while the dragged item is over the drop target and optionally cancel the onDragOver.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOver : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onDragOut : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOut(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                target.notifyOut(this, e, this.dragData);
+            }
+            this.proxy.reset();
+            if(this.afterDragOut){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after the dragged item is dragged out of the target without dropping.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOut
+                 */
+                this.afterDragOut(target, e, id);
+            }
+        }
+        this.cachedTarget = null;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dragged out of the target without dropping, and optionally cancel the onDragOut.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOut : function(target, e, id){
+        return true;
+    },
+    
+    // private
+    onDragDrop : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragDrop(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                if(target.notifyDrop(this, e, this.dragData)){ // valid drop?
+                    this.onValidDrop(target, e, id);
+                }else{
+                    this.onInvalidDrop(target, e, id);
+                }
+            }else{
+                this.onValidDrop(target, e, id);
+            }
+            
+            if(this.afterDragDrop){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after a valid drag drop has occurred by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dropped element
+                 * @method afterDragDrop
+                 */
+                this.afterDragDrop(target, e, id);
+            }
+        }
+        delete this.cachedTarget;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dropped onto the target and optionally cancel the onDragDrop.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag drop event is valid, else false to cancel
+     */
+    beforeDragDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onValidDrop : function(target, e, id){
+        this.hideProxy();
+        if(this.afterValidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after a valid drop has occurred by providing an implementation.
+             * @param {Object} target The target DD 
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterValidDrop(target, e, id);
+        }
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return this.el.getXY();  
+    },
+
+    // private
+    onInvalidDrop : function(target, e, id){
+        this.beforeInvalidDrop(target, e, id);
+        if(this.cachedTarget){
+            if(this.cachedTarget.isNotifyTarget){
+                this.cachedTarget.notifyOut(this, e, this.dragData);
+            }
+            this.cacheTarget = null;
+        }
+        this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
+
+        if(this.afterInvalidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after an invalid drop has occurred by providing an implementation.
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterInvalidDrop(e, id);
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        if(Ext.enableFx){
+            this.el.highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action after an invalid
+     * drop has occurred.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the invalid drop should proceed, else false to cancel
+     */
+    beforeInvalidDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    handleMouseDown : function(e){
+        if(this.dragging) {
+            return;
+        }
+        var data = this.getDragData(e);
+        if(data && this.onBeforeDrag(data, e) !== false){
+            this.dragData = data;
+            this.proxy.stop();
+            Ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
+        } 
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the initial
+     * drag event begins and optionally cancel it.
+     * @param {Object} data An object containing arbitrary data to be shared with drop targets
+     * @param {Event} e The event object
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    onBeforeDrag : function(data, e){
+        return true;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action once the initial
+     * drag event has begun.  The drag cannot be canceled from this function.
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     */
+    onStartDrag : Ext.emptyFn,
+
+    // private override
+    startDrag : function(x, y){
+        this.proxy.reset();
+        this.dragging = true;
+        this.proxy.update("");
+        this.onInitDrag(x, y);
+        this.proxy.show();
+    },
+
+    // private
+    onInitDrag : function(x, y){
+        var clone = this.el.dom.cloneNode(true);
+        clone.id = Ext.id(); // prevent duplicate ids
+        this.proxy.update(clone);
+        this.onStartDrag(x, y);
+        return true;
+    },
+
+    /**
+     * Returns the drag source's underlying {@link Ext.dd.StatusProxy}
+     * @return {Ext.dd.StatusProxy} proxy The StatusProxy
+     */
+    getProxy : function(){
+        return this.proxy;  
+    },
+
+    /**
+     * Hides the drag source's {@link Ext.dd.StatusProxy}
+     */
+    hideProxy : function(){
+        this.proxy.hide();  
+        this.proxy.reset(true);
+        this.dragging = false;
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    },
+
+    // private - override to prevent hiding
+    b4EndDrag: function(e) {
+    },
+
+    // private - override to prevent moving
+    endDrag : function(e){
+        this.onEndDrag(this.dragData, e);
+    },
+
+    // private
+    onEndDrag : function(data, e){
+    },
+    
+    // private - pin to cursor
+    autoOffset : function(x, y) {
+        this.setDelta(-12, -20);
+    },
+    
+    destroy: function(){
+        Ext.dd.DragSource.superclass.destroy.call(this);
+        Ext.destroy(this.proxy);
+    }
+});/**
+ * @class Ext.dd.DropTarget
+ * @extends Ext.dd.DDTarget
+ * A simple class that provides the basic implementation needed to make any element a drop target that can have
+ * draggable items dropped onto it.  The drop has no effect until an implementation of notifyDrop is provided.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropTarget = Ext.extend(Ext.dd.DDTarget, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+    
+        Ext.apply(this, config);
+    
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    
+        Ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+              {isTarget: true});        
+    },
+    
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} overClass
+     * The CSS class applied to the drop target element while the drag source is over it (defaults to "").
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    // private
+    isTarget : true,
+
+    // private
+    isNotifyTarget : true,
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source is now over the
+     * target.  This default implementation adds the CSS class specified by overClass (if any) to the drop element
+     * and returns the dropAllowed config value.  This method should be overridden if drop validation is required.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        if(this.overClass){
+            this.el.addClass(this.overClass);
+        }
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the target.
+     * This method will be called on every mouse movement while the drag source is over the drop target.
+     * This default implementation simply returns the dropAllowed config value.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source has been dragged
+     * out of the target without dropping.  This default implementation simply removes the CSS class specified by
+     * overClass (if any) from the drop element.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    notifyOut : function(dd, e, data){
+        if(this.overClass){
+            this.el.removeClass(this.overClass);
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the dragged item has
+     * been dropped on it.  This method has no default implementation and returns false, so you must provide an
+     * implementation that does something to process the drop event and returns true so that the drag source's
+     * repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        return false;
+    },
+    
+    destroy : function(){
+        Ext.dd.DropTarget.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});/**
+ * @class Ext.dd.DragZone
+ * @extends Ext.dd.DragSource
+ * <p>This class provides a container DD instance that allows dragging of multiple child source nodes.</p>
+ * <p>This class does not move the drag target nodes, but a proxy element which may contain
+ * any DOM structure you wish. The DOM element to show in the proxy is provided by either a
+ * provided implementation of {@link #getDragData}, or by registered draggables registered with {@link Ext.dd.Registry}</p>
+ * <p>If you wish to provide draggability for an arbitrary number of DOM nodes, each of which represent some
+ * application object (For example nodes in a {@link Ext.DataView DataView}) then use of this class
+ * is the most efficient way to "activate" those nodes.</p>
+ * <p>By default, this class requires that draggable child nodes are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DragZone to manage any number of draggable elements is to configure
+ * the DragZone with  an implementation of the {@link #getDragData} method which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector. For example, to make the nodes of a DataView draggable, use the following
+ * technique. Knowledge of the use of the DataView is required:</p><pre><code>
+myDataView.on('render', function(v) {
+    myDataView.dragZone = new Ext.dd.DragZone(v.getEl(), {
+
+//      On receipt of a mousedown event, see if it is within a DataView node.
+//      Return a drag data object if so.
+        getDragData: function(e) {
+
+//          Use the DataView's own itemSelector (a mandatory property) to
+//          test if the mousedown is within one of the DataView's nodes.
+            var sourceEl = e.getTarget(v.itemSelector, 10);
+
+//          If the mousedown is within a DataView node, clone the node to produce
+//          a ddel element for use by the drag proxy. Also add application data
+//          to the returned data object.
+            if (sourceEl) {
+                d = sourceEl.cloneNode(true);
+                d.id = Ext.id();
+                return {
+                    ddel: d,
+                    sourceEl: sourceEl,
+                    repairXY: Ext.fly(sourceEl).getXY(),
+                    sourceStore: v.store,
+                    draggedRecord: v.{@link Ext.DataView#getRecord getRecord}(sourceEl)
+                }
+            }
+        },
+
+//      Provide coordinates for the proxy to slide back to on failed drag.
+//      This is the original XY coordinates of the draggable element captured
+//      in the getDragData method.
+        getRepairXY: function() {
+            return this.dragData.repairXY;
+        }
+    });
+});</code></pre>
+ * See the {@link Ext.dd.DropZone DropZone} documentation for details about building a DropZone which
+ * cooperates with this DragZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragZone = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(el, config){
+        Ext.dd.DragZone.superclass.constructor.call(this, el, config);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    },
+    
+    /**
+     * This property contains the data representing the dragged object. This data is set up by the implementation
+     * of the {@link #getDragData} method. It must contain a <tt>ddel</tt> property, but can contain
+     * any other data according to the application's needs.
+     * @type Object
+     * @property dragData
+     */
+    /**
+     * @cfg {Boolean} containerScroll True to register this container with the Scrollmanager
+     * for auto scrolling during drag operations.
+     */
+    /**
+     * @cfg {String} hlColor The color to use when visually highlighting the drag source in the afterRepair
+     * method after a failed drop (defaults to "c3daf9" - light blue)
+     */
+
+    /**
+     * Called when a mousedown occurs in this container. Looks in {@link Ext.dd.Registry}
+     * for a valid target to drag based on the mouse down. Override this method
+     * to provide your own lookup logic (e.g. finding a child by class name). Make sure your returned
+     * object has a "ddel" attribute (with an HTML Element) for other functions to work.
+     * @param {EventObject} e The mouse down event
+     * @return {Object} The dragData
+     */
+    getDragData : function(e){
+        return Ext.dd.Registry.getHandleFromEvent(e);
+    },
+    
+    /**
+     * Called once drag threshold has been reached to initialize the proxy element. By default, it clones the
+     * this.dragData.ddel
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     * @return {Boolean} true to continue the drag, false to cancel
+     */
+    onInitDrag : function(x, y){
+        this.proxy.update(this.dragData.ddel.cloneNode(true));
+        this.onStartDrag(x, y);
+        return true;
+    },
+    
+    /**
+     * Called after a repair of an invalid drop. By default, highlights this.dragData.ddel 
+     */
+    afterRepair : function(){
+        if(Ext.enableFx){
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * Called before a repair of an invalid drop to get the XY to animate to. By default returns
+     * the XY of this.dragData.ddel
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e){
+        return Ext.Element.fly(this.dragData.ddel).getXY();  
+    },
+    
+    destroy : function(){
+        Ext.dd.DragZone.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});/**
+ * @class Ext.dd.DropZone
+ * @extends Ext.dd.DropTarget
+ * <p>This class provides a container DD instance that allows dropping on multiple child target nodes.</p>
+ * <p>By default, this class requires that child nodes accepting drop are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DropZone to manage any number of target elements is to configure the
+ * DropZone with an implementation of {@link #getTargetFromEvent} which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector.</p>
+ * <p>Once the DropZone has detected through calling getTargetFromEvent, that the mouse is over
+ * a drop target, that target is passed as the first parameter to {@link #onNodeEnter}, {@link #onNodeOver},
+ * {@link #onNodeOut}, {@link #onNodeDrop}. You may configure the instance of DropZone with implementations
+ * of these methods to provide application-specific behaviour for these events to update both
+ * application state, and UI state.</p>
+ * <p>For example to make a GridPanel a cooperating target with the example illustrated in
+ * {@link Ext.dd.DragZone DragZone}, the following technique might be used:</p><pre><code>
+myGridPanel.on('render', function() {
+    myGridPanel.dropZone = new Ext.dd.DropZone(myGridPanel.getView().scroller, {
+
+//      If the mouse is over a grid row, return that node. This is
+//      provided as the "target" parameter in all "onNodeXXXX" node event handling functions
+        getTargetFromEvent: function(e) {
+            return e.getTarget(myGridPanel.getView().rowSelector);
+        },
+
+//      On entry into a target node, highlight that node.
+        onNodeEnter : function(target, dd, e, data){ 
+            Ext.fly(target).addClass('my-row-highlight-class');
+        },
+
+//      On exit from a target node, unhighlight that node.
+        onNodeOut : function(target, dd, e, data){ 
+            Ext.fly(target).removeClass('my-row-highlight-class');
+        },
+
+//      While over a target node, return the default drop allowed class which
+//      places a "tick" icon into the drag proxy.
+        onNodeOver : function(target, dd, e, data){ 
+            return Ext.dd.DropZone.prototype.dropAllowed;
+        },
+
+//      On node drop we can interrogate the target to find the underlying
+//      application object that is the real target of the dragged data.
+//      In this case, it is a Record in the GridPanel's Store.
+//      We can use the data set up by the DragZone's getDragData method to read
+//      any data we decided to attach in the DragZone's getDragData method.
+        onNodeDrop : function(target, dd, e, data){
+            var rowIndex = myGridPanel.getView().findRowIndex(target);
+            var r = myGridPanel.getStore().getAt(rowIndex);
+            Ext.Msg.alert('Drop gesture', 'Dropped Record id ' + data.draggedRecord.id +
+                ' on Record id ' + r.id);
+            return true;
+        }
+    });
+}
+</code></pre>
+ * See the {@link Ext.dd.DragZone DragZone} documentation for details about building a DragZone which
+ * cooperates with this DropZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropZone = function(el, config){
+    Ext.dd.DropZone.superclass.constructor.call(this, el, config);
+};
+
+Ext.extend(Ext.dd.DropZone, Ext.dd.DropTarget, {
+    /**
+     * Returns a custom data object associated with the DOM node that is the target of the event.  By default
+     * this looks up the event target in the {@link Ext.dd.Registry}, although you can override this method to
+     * provide your own custom lookup.
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+    getTargetFromEvent : function(e){
+        return Ext.dd.Registry.getTargetFromEvent(e);
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has entered a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from 
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeEnter : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is over a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * The default implementation returns this.dropNotAllowed, so it should be
+     * overridden to provide the proper feedback.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onNodeOver : function(n, dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dragged out of
+     * the drop node without dropping.  This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeOut : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped onto
+     * the drop node.  The default implementation returns false, so it should be overridden to provide the
+     * appropriate processing of the drop event and return true so that the drag source's repair action does not run.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onNodeDrop : function(n, dd, e, data){
+        return false;
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is being dragged over it,
+     * but not over any of its registered drop nodes.  The default implementation returns this.dropNotAllowed, so
+     * it should be overridden to provide the proper feedback if necessary.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onContainerOver : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped on it,
+     * but not on any of its registered drop nodes.  The default implementation returns false, so it should be
+     * overridden to provide the appropriate processing of the drop event if you need the drop zone itself to
+     * be able to accept drops.  It should return true when valid so that the drag source's repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onContainerDrop : function(dd, e, data){
+        return false;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source is now over
+     * the zone.  The default implementation returns this.dropNotAllowed and expects that only registered drop
+     * nodes can process drag drop operations, so if you need the drop zone itself to be able to process drops
+     * you should override this method and provide a custom implementation.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the drop zone.
+     * This method will be called on every mouse movement while the drag source is over the drop zone.
+     * It will call {@link #onNodeOver} while the drag source is over a registered node, and will also automatically
+     * delegate to the appropriate node-specific methods as necessary when the drag source enters and exits
+     * registered nodes ({@link #onNodeEnter}, {@link #onNodeOut}). If the drag source is not currently over a
+     * registered node, it will call {@link #onContainerOver}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        var n = this.getTargetFromEvent(e);
+        if(!n){ // not over valid drop target
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+                this.lastOverNode = null;
+            }
+            return this.onContainerOver(dd, e, data);
+        }
+        if(this.lastOverNode != n){
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+            }
+            this.onNodeEnter(n, dd, e, data);
+            this.lastOverNode = n;
+        }
+        return this.onNodeOver(n, dd, e, data);
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source has been dragged
+     * out of the zone without dropping.  If the drag source is currently over a registered node, the notification
+     * will be delegated to {@link #onNodeOut} for node-specific handling, otherwise it will be ignored.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag zone
+     */
+    notifyOut : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the dragged item has
+     * been dropped on it.  The drag zone will look up the target node based on the event passed in, and if there
+     * is a node registered for that event, it will delegate to {@link #onNodeDrop} for node-specific handling,
+     * otherwise it will call {@link #onContainerDrop}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+        var n = this.getTargetFromEvent(e);
+        return n ?
+            this.onNodeDrop(n, dd, e, data) :
+            this.onContainerDrop(dd, e, data);
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    }  
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Initializes a {@link Ext.dd.DD} drag drop object for this element.
+     * @param {String} group The group the DD object is member of
+     * @param {Object} config The DD config object
+     * @param {Object} overrides An object containing methods to override/implement on the DD object
+     * @return {Ext.dd.DD} The DD object
+     */
+    initDD : function(group, config, overrides){
+        var dd = new Ext.dd.DD(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDProxy} object for this element.
+     * @param {String} group The group the DDProxy object is member of
+     * @param {Object} config The DDProxy config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDProxy object
+     * @return {Ext.dd.DDProxy} The DDProxy object
+     */
+    initDDProxy : function(group, config, overrides){
+        var dd = new Ext.dd.DDProxy(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDTarget} object for this element.
+     * @param {String} group The group the DDTarget object is member of
+     * @param {Object} config The DDTarget config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDTarget object
+     * @return {Ext.dd.DDTarget} The DDTarget object
+     */
+    initDDTarget : function(group, config, overrides){
+        var dd = new Ext.dd.DDTarget(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/direct.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/direct.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/direct.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.data.DirectProxy=function(a){Ext.apply(this,a);if(typeof this.paramOrder=="string"){this.paramOrder=this.paramOrder.split(/[\s,|]/)}Ext.data.DirectProxy.superclass.constructor.call(this,a)};Ext.extend(Ext.data.DirectProxy,Ext.data.DataProxy,{paramOrder:undefined,paramsAsHash:true,directFn:undefined,doRequest:function(b,c,a,e,j,k,m){var h=[],g=this.api[b]||this.directFn;switch(b){case Ext.data.Api.actions.create:h.push(a.jsonData);break;case Ext.data.Api.actions.read:if(g.directCfg.method.len>0){if(this.paramOrder){for(var d=0,f=this.paramOrder.length;d<f;d++){h.push(a[this.paramOrder[d]])}}else{if(this.paramsAsHash){h.push(a)}}}break;case Ext.data.Api.actions.update:h.push(a.jsonData);break;case Ext.data.Api.actions.destroy:h.push(a.jsonData);break}var l={params:a||{},request:{callback:j,scope:k,arg:m},reader:e};h.push(this.createCallback(b,c,l),this);g.apply(window,h)},createCallback:function(d,a,b){var c=this;return function(e,f){if(!f.status){if(d===Ext.data.Api.actions.read){c.fireEvent("loadexception",c,b,f,null)}c.fireEvent("exception",c,"remote",d,b,f,null);b.request.callback.call(b.request.scope,null,b.request.arg,false);return}if(d===Ext.data.Api.actions.read){c.onRead(d,b,e,f)}else{c.onWrite(d,b,e,f,a)}}},onRead:function(f,e,a,d){var b;try{b=e.reader.readRecords(a)}catch(c){this.fireEvent("loadexception",this,e,d,c);this.fireEvent("exception",this,"response",f,e,d,c);e.request.callback.call(e.request.scope,null,e.request.arg,false);return}this.fireEvent("load",this,d,e.request.arg);e.request.callback.call(e.request.scope,b,e.request.arg,true)},onWrite:function(f,d,a,c,b){var e=d.reader.extractData(d.reader.getRoot(a),false);var g=d.reader.getSuccess(a);g=(g!==false);if(g){this.fireEvent("write",this,f,e,c,b,d.request.arg)}else{this.fireEvent("exception",this,"remote",f,d,a,b)}d.request.callback.call(d.request.scope,e,c,g)}});Ext.data.DirectStore=Ext.extend(Ext.data.Store,{constructor:function(a){var b=Ext.apply({},{batchTransactions:false},a);Ext.data.DirectStore.superclass.constructor.call(this,Ext.apply(b,{proxy:Ext.isDefined(b.proxy)?b.proxy:new Ext.data.DirectProxy(Ext.copyTo({},b,"paramOrder,paramsAsHash,directFn,api")),reader:(!Ext.isDefined(b.reader)&&b.fields)?new Ext.data.JsonReader(Ext.copyTo({},b,"totalProperty,root,idProperty"),b.fields):b.reader}))}});Ext.reg("directstore",Ext.data.DirectStore);Ext.Direct=Ext.extend(Ext.util.Observable,{exceptions:{TRANSPORT:"xhr",PARSE:"parse",LOGIN:"login",SERVER:"exception"},constructor:function(){this.addEvents("event","exception");this.transactions={};this.providers={}},addProvider:function(e){var c=arguments;if(c.length>1){for(var d=0,b=c.length;d<b;d++){this.addProvider(c[d])}return}if(!e.events){e=new Ext.Direct.PROVIDERS[e.type](e)}e.id=e.id||Ext.id();this.providers[e.id]=e;e.on("data",this.onProviderData,this);e.on("exception",this.onProviderException,this);if(!e.isConnected()){e.connect()}return e},getProvider:function(a){return this.providers[a]},removeProvider:function(b){var a=b.id?b:this.providers[b];a.un("data",this.onProviderData,this);a.un("exception",this.onProviderException,this);delete this.providers[a.id];return a},addTransaction:function(a){this.transactions[a.tid]=a;return a},removeTransaction:function(a){delete this.transactions[a.tid||a];return a},getTransaction:function(a){return this.transactions[a.tid||a]},onProviderData:function(d,c){if(Ext.isArray(c)){for(var b=0,a=c.length;b<a;b++){this.onProviderData(d,c[b])}return}if(c.name&&c.name!="event"&&c.name!="exception"){this.fireEvent(c.name,c)}else{if(c.type=="exception"){this.fireEvent("exception",c)}}this.fireEvent("event",c,d)},createEvent:function(a,b){return new Ext.Direct.eventTypes[a.type](Ext.apply(a,b))}});Ext.Direct=new Ext.Direct();Ext.Direct.TID=1;Ext.Direct.PROVIDERS={};Ext.Direct.Transaction=function(a){Ext.apply(this,a);this.tid=++Ext.Direct.TID;this.retryCount=0};Ext.Direct.Transaction.prototype={send:function(){this.provider.queueTransaction(this)},retry:function(){this.retryCount++;this.send()},getProvider:function(){return this.provider}};Ext.Direct.Event=function(a){Ext.apply(this,a)};Ext.Direct.Event.prototype={status:true,getData:function(){return this.data}};Ext.Direct.RemotingEvent=Ext.extend(Ext.Direct.Event,{type:"rpc",getTransaction:function(){return this.transaction||Ext.Direct.getTransaction(this.tid)}});Ext.Direct.ExceptionEvent=Ext.extend(Ext.Direct.RemotingEvent,{status:false,type:"exception"});Ext.Direct.eventTypes={rpc:Ext.Direct.RemotingEvent,event:Ext.Direct.Event,exception:Ext.Direct.ExceptionEvent};Ext.direct.Provider=Ext.extend(Ext.util.Observable,{priority:1,constructor:function(a){Ext.apply(this,a);this.addEvents("connect","disconnect","data","exception");Ext.direct.Provider.superclass.constructor.call(this,a)},isConnected:function(){return false},connect:Ext.emptyFn,disconnect:Ext.emptyFn});Ext.direct.JsonProvider=Ext.extend(Ext.direct.Provider,{parseResponse:function(a){if(!Ext.isEmpty(a.responseText)){if(typeof a.responseText=="object"){return a.responseText}return Ext.decode(a.responseText)}return null},getEvents:function(h){var f=null;try{f=this.parseResponse(h)}catch(g){var d=new Ext.Direct.ExceptionEvent({data:g,xhr:h,code:Ext.Direct.exceptions.PARSE,message:"Error parsing json response: \n\n "+f});return[d]}var c=[];if(Ext.isArray(f)){for(var b=0,a=f.length;b<a;b++){c.push(Ext.Direct.createEvent(f[b]))}}else{c.push(Ext.Direct.createEvent(f))}return c}});Ext.direct.PollingProvider=Ext.extend(Ext.direct.JsonProvider,{priority:3,interval:3000,constructor:function(a){Ext.direct.PollingProvider.superclass.constructor.call(this,a);this.addEvents("beforepoll","poll")},isConnected:function(){return !!this.pollTask},connect:function(){if(this.url&&!this.pollTask){this.pollTask=Ext.TaskMgr.start({run:function(){if(this.fireEvent("beforepoll",this)!==false){if(typeof this.url=="function"){this.url(this.baseParams)}else{Ext.Ajax.request({url:this.url,callback:this.onData,scope:this,params:this.baseParams})}}},interval:this.interval,scope:this});this.fireEvent("connect",this)}else{if(!this.url){throw"Error initializing PollingProvider, no url configured."}}},disconnect:function(){if(this.pollTask){Ext.TaskMgr.stop(this.pollTask);delete this.pollTask;this.fireEvent("disconnect",this)}},onData:function(d,h,g){if(h){var c=this.getEvents(g);for(var b=0,a=c.length;b<a;b++){var f=c[b];this.fireEvent("data",this,f)}}else{var f=new Ext.Direct.ExceptionEvent({data:f,code:Ext.Direct.exceptions.TRANSPORT,message:"Unable to connect to the server.",xhr:g});this.fireEvent("data",this,f)}}});Ext.Direct.PROVIDERS.polling=Ext.direct.PollingProvider;Ext.direct.RemotingProvider=Ext.extend(Ext.direct.JsonProvider,{enableBuffer:10,maxRetries:1,timeout:undefined,constructor:function(a){Ext.direct.RemotingProvider.superclass.constructor.call(this,a);this.addEvents("beforecall","call");this.namespace=(Ext.isString(this.namespace))?Ext.ns(this.namespace):this.namespace||window;this.transactions={};this.callBuffer=[]},initAPI:function(){var g=this.actions;for(var h in g){var d=this.namespace[h]||(this.namespace[h]={}),e=g[h];for(var f=0,b=e.length;f<b;f++){var a=e[f];d[a.name]=this.createMethod(h,a)}}},isConnected:function(){return !!this.connected},connect:function(){if(this.url){this.initAPI();this.connected=true;this.fireEvent("connect",this)}else{if(!this.url){throw"Error initializing RemotingProvider, no url configured."}}},disconnect:function(){if(this.connected){this.connected=false;this.fireEvent("disconnect",this)}},onData:function(a,g,h){if(g){var j=this.getEvents(h);for(var b=0,c=j.length;b<c;b++){var d=j[b],k=this.getTransaction(d);this.fireEvent("data",this,d);if(k){this.doCallback(k,d,true);Ext.Direct.removeTransaction(k)}}}else{var f=[].concat(a.ts);for(var b=0,c=f.length;b<c;b++){var k=this.getTransaction(f[b]);if(k&&k.retryCount<this.maxRetries){k.retry()}else{var d=new Ext.Direct.ExceptionEvent({data:d,transaction:k,code:Ext.Direct.exceptions.TRANSPORT,message:"Unable to connect to the server.",xhr:h});this.fireEvent("data",this,d);if(k){this.doCallback(k,d,false);Ext.Direct.removeTransaction(k)}}}}},getCallData:function(a){return{action:a.action,method:a.method,data:a.data,type:"rpc",tid:a.tid}},doSend:function(d){var f={url:this.url,callback:this.onData,scope:this,ts:d,timeout:this.timeout},b;if(Ext.isArray(d)){b=[];for(var c=0,a=d.length;c<a;c++){b.push(this.getCallData(d[c]))}}else{b=this.getCallData(d)}if(this.enableUrlEncode){var e={};e[Ext.isString(this.enableUrlEncode)?this.enableUrlEncode:"data"]=Ext.encode(b);f.params=e}else{f.jsonData=b}Ext.Ajax.request(f)},combineAndSend:function(){var a=this.callBuffer.length;if(a>0){this.doSend(a==1?this.callBuffer[0]:this.callBuffer);this.callBuffer=[]}},queueTransaction:function(a){if(a.form){this.processForm(a);return}this.callBuffer.push(a);if(this.enableBuffer){if(!this.callTask){this.callTask=new Ext.util.DelayedTask(this.combineAndSend,this)}this.callTask.delay(Ext.isNumber(this.enableBuffer)?this.enableBuffer:10)}else{this.combineAndSend()}},doCall:function(h,a,b){var g=null,e=b[a.len],f=b[a.len+1];if(a.len!==0){g=b.slice(0,a.len)}var d=new Ext.Direct.Transaction({provider:this,args:b,action:h,method:a.name,data:g,cb:f&&Ext.isFunction(e)?e.createDelegate(f):e});if(this.fireEvent("beforecall",this,d,a)!==false){Ext.Direct.addTransaction(d);this.queueTransaction(d);this.fireEvent("call",this,d,a)}},doForm:function(i,b,f,h,e){var d=new Ext.Direct.Transaction({provider:this,action:i,method:b.name,args:[f,h,e],cb:e&&Ext.isFunction(h)?h.createDelegate(e):h,isForm:true});if(this.fireEvent("beforecall",this,d,b)!==false){Ext.Direct.addTransaction(d);var a=String(f.getAttribute("enctype")).toLowerCase()=="multipart/form-data",g={extTID:d.tid,extAction:i,extMethod:b.name,extType:"rpc",extUpload:String(a)};Ext.apply(d,{form:Ext.getDom(f),isUpload:a,params:h&&Ext.isObject(h.params)?Ext.apply(g,h.params):g});this.fireEvent("call",this,d,b);this.processForm(d)}},processForm:function(a){Ext.Ajax.request({url:this.url,params:a.params,callback:this.onData,scope:this,form:a.form,isUpload:a.isUpload,ts:a})},createMethod:function(d,a){var b;if(!a.formHandler){b=function(){this.doCall(d,a,Array.prototype.slice.call(arguments,0))}.createDelegate(this)}else{b=function(e,f,c){this.doForm(d,a,e,f,c)}.createDelegate(this)}b.directCfg={action:d,method:a};return b},getTransaction:function(a){return a&&a.tid?Ext.Direct.getTransaction(a.tid):null},doCallback:function(c,f){var d=f.status?"success":"failure";if(c&&c.cb){var b=c.cb,a=Ext.isDefined(f.result)?f.result:f.data;if(Ext.isFunction(b)){b(a,f)}else{Ext.callback(b[d],b.scope,[a,f]);Ext.callback(b.callback,b.scope,[a,f])}}}});Ext.Direct.PROVIDERS.remoting=Ext.direct.RemotingProvider;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property-debug.js	(revision 76)
@@ -0,0 +1,468 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.PropertyRecord
+ * A specific {@link Ext.data.Record} type that represents a name/value pair and is made to work with the
+ * {@link Ext.grid.PropertyGrid}.  Typically, PropertyRecords do not need to be created directly as they can be
+ * created implicitly by simply using the appropriate data configs either via the {@link Ext.grid.PropertyGrid#source}
+ * config property or by calling {@link Ext.grid.PropertyGrid#setSource}.  However, if the need arises, these records
+ * can also be created explicitly as shwon below.  Example usage:
+ * <pre><code>
+var rec = new Ext.grid.PropertyRecord({
+    name: 'Birthday',
+    value: new Date(Date.parse('05/26/1972'))
+});
+// Add record to an already populated grid
+grid.store.addSorted(rec);
+</code></pre>
+ * @constructor
+ * @param {Object} config A data object in the format: {name: [name], value: [value]}.  The specified value's type
+ * will be read automatically by the grid to determine the type of editor to use when displaying it.
+ */
+Ext.grid.PropertyRecord = Ext.data.Record.create([
+    {name:'name',type:'string'}, 'value'
+]);
+
+/**
+ * @class Ext.grid.PropertyStore
+ * @extends Ext.util.Observable
+ * A custom wrapper for the {@link Ext.grid.PropertyGrid}'s {@link Ext.data.Store}. This class handles the mapping
+ * between the custom data source objects supported by the grid and the {@link Ext.grid.PropertyRecord} format
+ * required for compatibility with the underlying store. Generally this class should not need to be used directly --
+ * the grid's data should be accessed from the underlying store via the {@link #store} property.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyStore = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(grid, source){
+        this.grid = grid;
+        this.store = new Ext.data.Store({
+            recordType : Ext.grid.PropertyRecord
+        });
+        this.store.on('update', this.onUpdate,  this);
+        if(source){
+            this.setSource(source);
+        }
+        Ext.grid.PropertyStore.superclass.constructor.call(this);    
+    },
+    
+    // protected - should only be called by the grid.  Use grid.setSource instead.
+    setSource : function(o){
+        this.source = o;
+        this.store.removeAll();
+        var data = [];
+        for(var k in o){
+            if(this.isEditableValue(o[k])){
+                data.push(new Ext.grid.PropertyRecord({name: k, value: o[k]}, k));
+            }
+        }
+        this.store.loadRecords({records: data}, {}, true);
+    },
+
+    // private
+    onUpdate : function(ds, record, type){
+        if(type == Ext.data.Record.EDIT){
+            var v = record.data.value;
+            var oldValue = record.modified.value;
+            if(this.grid.fireEvent('beforepropertychange', this.source, record.id, v, oldValue) !== false){
+                this.source[record.id] = v;
+                record.commit();
+                this.grid.fireEvent('propertychange', this.source, record.id, v, oldValue);
+            }else{
+                record.reject();
+            }
+        }
+    },
+
+    // private
+    getProperty : function(row){
+       return this.store.getAt(row);
+    },
+
+    // private
+    isEditableValue: function(val){
+        return Ext.isPrimitive(val) || Ext.isDate(val);
+    },
+
+    // private
+    setValue : function(prop, value, create){
+        var r = this.getRec(prop);
+        if(r){
+            r.set('value', value);
+            this.source[prop] = value;
+        }else if(create){
+            // only create if specified.
+            this.source[prop] = value;
+            r = new Ext.grid.PropertyRecord({name: prop, value: value}, prop);
+            this.store.add(r);
+
+        }
+    },
+    
+    // private
+    remove : function(prop){
+        var r = this.getRec(prop);
+        if(r){
+            this.store.remove(r);
+            delete this.source[prop];
+        }
+    },
+    
+    // private
+    getRec : function(prop){
+        return this.store.getById(prop);
+    },
+
+    // protected - should only be called by the grid.  Use grid.getSource instead.
+    getSource : function(){
+        return this.source;
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyColumnModel
+ * @extends Ext.grid.ColumnModel
+ * A custom column model for the {@link Ext.grid.PropertyGrid}.  Generally it should not need to be used directly.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyColumnModel = Ext.extend(Ext.grid.ColumnModel, {
+    // private - strings used for locale support
+    nameText : 'Name',
+    valueText : 'Value',
+    dateFormat : 'm/j/Y',
+    trueText: 'true',
+    falseText: 'false',
+    
+    constructor : function(grid, store){
+        var g = Ext.grid,
+	        f = Ext.form;
+	        
+	    this.grid = grid;
+	    g.PropertyColumnModel.superclass.constructor.call(this, [
+	        {header: this.nameText, width:50, sortable: true, dataIndex:'name', id: 'name', menuDisabled:true},
+	        {header: this.valueText, width:50, resizable:false, dataIndex: 'value', id: 'value', menuDisabled:true}
+	    ]);
+	    this.store = store;
+	
+	    var bfield = new f.Field({
+	        autoCreate: {tag: 'select', children: [
+	            {tag: 'option', value: 'true', html: this.trueText},
+	            {tag: 'option', value: 'false', html: this.falseText}
+	        ]},
+	        getValue : function(){
+	            return this.el.dom.value == 'true';
+	        }
+	    });
+	    this.editors = {
+	        'date' : new g.GridEditor(new f.DateField({selectOnFocus:true})),
+	        'string' : new g.GridEditor(new f.TextField({selectOnFocus:true})),
+	        'number' : new g.GridEditor(new f.NumberField({selectOnFocus:true, style:'text-align:left;'})),
+	        'boolean' : new g.GridEditor(bfield, {
+	            autoSize: 'both'
+	        })
+	    };
+	    this.renderCellDelegate = this.renderCell.createDelegate(this);
+	    this.renderPropDelegate = this.renderProp.createDelegate(this);
+    },
+
+    // private
+    renderDate : function(dateVal){
+        return dateVal.dateFormat(this.dateFormat);
+    },
+
+    // private
+    renderBool : function(bVal){
+        return this[bVal ? 'trueText' : 'falseText'];
+    },
+
+    // private
+    isCellEditable : function(colIndex, rowIndex){
+        return colIndex == 1;
+    },
+
+    // private
+    getRenderer : function(col){
+        return col == 1 ?
+            this.renderCellDelegate : this.renderPropDelegate;
+    },
+
+    // private
+    renderProp : function(v){
+        return this.getPropertyName(v);
+    },
+
+    // private
+    renderCell : function(val, meta, rec){
+        var renderer = this.grid.customRenderers[rec.get('name')];
+        if(renderer){
+            return renderer.apply(this, arguments);
+        }
+        var rv = val;
+        if(Ext.isDate(val)){
+            rv = this.renderDate(val);
+        }else if(typeof val == 'boolean'){
+            rv = this.renderBool(val);
+        }
+        return Ext.util.Format.htmlEncode(rv);
+    },
+
+    // private
+    getPropertyName : function(name){
+        var pn = this.grid.propertyNames;
+        return pn && pn[name] ? pn[name] : name;
+    },
+
+    // private
+    getCellEditor : function(colIndex, rowIndex){
+        var p = this.store.getProperty(rowIndex),
+            n = p.data.name, 
+            val = p.data.value;
+        if(this.grid.customEditors[n]){
+            return this.grid.customEditors[n];
+        }
+        if(Ext.isDate(val)){
+            return this.editors.date;
+        }else if(typeof val == 'number'){
+            return this.editors.number;
+        }else if(typeof val == 'boolean'){
+            return this.editors['boolean'];
+        }else{
+            return this.editors.string;
+        }
+    },
+
+    // inherit docs
+    destroy : function(){
+        Ext.grid.PropertyColumnModel.superclass.destroy.call(this);
+        this.destroyEditors(this.editors);
+        this.destroyEditors(this.grid.customEditors);
+    },
+    
+    destroyEditors: function(editors){
+        for(var ed in editors){
+            Ext.destroy(editors[ed]);
+        }
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyGrid
+ * @extends Ext.grid.EditorGridPanel
+ * A specialized grid implementation intended to mimic the traditional property grid as typically seen in
+ * development IDEs.  Each row in the grid represents a property of some object, and the data is stored
+ * as a set of name/value pairs in {@link Ext.grid.PropertyRecord}s.  Example usage:
+ * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    title: 'Properties Grid',
+    autoHeight: true,
+    width: 300,
+    renderTo: 'grid-ct',
+    source: {
+        "(name)": "My Object",
+        "Created": new Date(Date.parse('10/15/2006')),
+        "Available": false,
+        "Version": .01,
+        "Description": "A test object"
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {Object} config The grid config object
+ */
+Ext.grid.PropertyGrid = Ext.extend(Ext.grid.EditorGridPanel, {
+    /**
+    * @cfg {Object} propertyNames An object containing property name/display name pairs.
+    * If specified, the display name will be shown in the name column instead of the property name.
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customEditors An object containing name/value pairs of custom editor type definitions that allow
+    * the grid to support additional types of editable fields.  By default, the grid supports strongly-typed editing
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with a custom input control by specifying a custom editor.  The name of the editor
+    * type should correspond with the name of the property that will use the editor.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customEditors: {
+        'Start Time': new Ext.grid.GridEditor(new Ext.form.TimeField({selectOnFocus:true}))
+    },
+    source: {
+        'Start Time': '10:00 AM'
+    }
+});
+</code></pre>
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customRenderers An object containing name/value pairs of custom renderer type definitions that allow
+    * the grid to support custom rendering of fields.  By default, the grid supports strongly-typed rendering
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with the type of the value.  The name of the renderer type should correspond with the name of the property
+    * that it will render.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customRenderers: {
+        Available: function(v){
+            if(v){
+                return '<span style="color: green;">Yes</span>';
+            }else{
+                return '<span style="color: red;">No</span>';
+            }
+        }
+    },
+    source: {
+        Available: true
+    }
+});
+</code></pre>
+    */
+
+    // private config overrides
+    enableColumnMove:false,
+    stripeRows:false,
+    trackMouseOver: false,
+    clicksToEdit:1,
+    enableHdMenu : false,
+    viewConfig : {
+        forceFit:true
+    },
+
+    // private
+    initComponent : function(){
+        this.customRenderers = this.customRenderers || {};
+        this.customEditors = this.customEditors || {};
+        this.lastEditRow = null;
+        var store = new Ext.grid.PropertyStore(this);
+        this.propStore = store;
+        var cm = new Ext.grid.PropertyColumnModel(this, store);
+        store.store.sort('name', 'ASC');
+        this.addEvents(
+            /**
+             * @event beforepropertychange
+             * Fires before a property value changes.  Handlers can return false to cancel the property change
+             * (this will internally call {@link Ext.data.Record#reject} on the property's record).
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'beforepropertychange',
+            /**
+             * @event propertychange
+             * Fires after a property value has changed.
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'propertychange'
+        );
+        this.cm = cm;
+        this.ds = store.store;
+        Ext.grid.PropertyGrid.superclass.initComponent.call(this);
+
+		this.mon(this.selModel, 'beforecellselect', function(sm, rowIndex, colIndex){
+            if(colIndex === 0){
+                this.startEditing.defer(200, this, [rowIndex, 1]);
+                return false;
+            }
+        }, this);
+    },
+
+    // private
+    onRender : function(){
+        Ext.grid.PropertyGrid.superclass.onRender.apply(this, arguments);
+
+        this.getGridEl().addClass('x-props-grid');
+    },
+
+    // private
+    afterRender: function(){
+        Ext.grid.PropertyGrid.superclass.afterRender.apply(this, arguments);
+        if(this.source){
+            this.setSource(this.source);
+        }
+    },
+
+    /**
+     * Sets the source data object containing the property data.  The data object can contain one or more name/value
+     * pairs representing all of the properties of an object to display in the grid, and this data will automatically
+     * be loaded into the grid's {@link #store}.  The values should be supplied in the proper data type if needed,
+     * otherwise string type will be assumed.  If the grid already contains data, this method will replace any
+     * existing data.  See also the {@link #source} config value.  Example usage:
+     * <pre><code>
+grid.setSource({
+    "(name)": "My Object",
+    "Created": new Date(Date.parse('10/15/2006')),  // date type
+    "Available": false,  // boolean type
+    "Version": .01,      // decimal type
+    "Description": "A test object"
+});
+</code></pre>
+     * @param {Object} source The data object
+     */
+    setSource : function(source){
+        this.propStore.setSource(source);
+    },
+
+    /**
+     * Gets the source data object containing the property data.  See {@link #setSource} for details regarding the
+     * format of the data object.
+     * @return {Object} The data object
+     */
+    getSource : function(){
+        return this.propStore.getSource();
+    },
+    
+    /**
+     * Sets the value of a property.
+     * @param {String} prop The name of the property to set
+     * @param {Mixed} value The value to test
+     * @param {Boolean} create (Optional) True to create the property if it doesn't already exist. Defaults to <tt>false</tt>.
+     */
+    setProperty : function(prop, value, create){
+        this.propStore.setValue(prop, value, create);    
+    },
+    
+    /**
+     * Removes a property from the grid.
+     * @param {String} prop The name of the property to remove
+     */
+    removeProperty : function(prop){
+        this.propStore.remove(prop);
+    }
+
+    /**
+     * @cfg store
+     * @hide
+     */
+    /**
+     * @cfg colModel
+     * @hide
+     */
+    /**
+     * @cfg cm
+     * @hide
+     */
+    /**
+     * @cfg columns
+     * @hide
+     */
+});
+Ext.reg("propertygrid", Ext.grid.PropertyGrid);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.data.Api=(function(){var a={};return{actions:{create:"create",read:"read",update:"update",destroy:"destroy"},restActions:{create:"POST",read:"GET",update:"PUT",destroy:"DELETE"},isAction:function(b){return(Ext.data.Api.actions[b])?true:false},getVerb:function(b){if(a[b]){return a[b]}for(var c in this.actions){if(this.actions[c]===b){a[b]=c;break}}return(a[b]!==undefined)?a[b]:null},isValid:function(b){var e=[];var d=this.actions;for(var c in b){if(!(c in d)){e.push(c)}}return(!e.length)?true:e},hasUniqueUrl:function(c,f){var b=(c.api[f])?c.api[f].url:null;var e=true;for(var d in c.api){if((e=(d===f)?true:(c.api[d].url!=b)?true:false)===false){break}}return e},prepare:function(b){if(!b.api){b.api={}}for(var d in this.actions){var c=this.actions[d];b.api[c]=b.api[c]||b.url||b.directFn;if(typeof(b.api[c])=="string"){b.api[c]={url:b.api[c],method:(b.restful===true)?Ext.data.Api.restActions[c]:undefined}}}},restify:function(b){b.restful=true;for(var c in this.restActions){b.api[this.actions[c]].method||(b.api[this.actions[c]].method=this.restActions[c])}b.onWrite=b.onWrite.createInterceptor(function(h,i,f,e){var d=i.reader;var g=new Ext.data.Response({action:h,raw:f});switch(f.status){case 200:return true;break;case 201:if(Ext.isEmpty(g.raw.responseText)){g.success=true}else{return true}break;case 204:g.success=true;g.data=null;break;default:return true;break}if(g.success===true){this.fireEvent("write",this,h,g.data,g,e,i.request.arg)}else{this.fireEvent("exception",this,"remote",h,i,g,e)}i.request.callback.call(i.request.scope,g.data,g,g.success);return false},b)}}})();Ext.data.Response=function(b,a){Ext.apply(this,b,{raw:a})};Ext.data.Response.prototype={message:null,success:false,status:null,root:null,raw:null,getMessage:function(){return this.message},getSuccess:function(){return this.success},getStatus:function(){return this.status},getRoot:function(){return this.root},getRawResponse:function(){return this.raw}};Ext.data.Api.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.Api"});Ext.apply(Ext.data.Api.Error.prototype,{lang:{"action-url-undefined":"No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.",invalid:"received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions","invalid-url":"Invalid url.  Please review your proxy configuration.",execute:'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'}});Ext.data.SortTypes={none:function(a){return a},stripTagsRE:/<\/?[^>]+>/gi,asText:function(a){return String(a).replace(this.stripTagsRE,"")},asUCText:function(a){return String(a).toUpperCase().replace(this.stripTagsRE,"")},asUCString:function(a){return String(a).toUpperCase()},asDate:function(a){if(!a){return 0}if(Ext.isDate(a)){return a.getTime()}return Date.parse(String(a))},asFloat:function(a){var b=parseFloat(String(a).replace(/,/g,""));return isNaN(b)?0:b},asInt:function(a){var b=parseInt(String(a).replace(/,/g,""),10);return isNaN(b)?0:b}};Ext.data.Record=function(a,b){this.id=(b||b===0)?b:Ext.data.Record.id(this);this.data=a||{}};Ext.data.Record.create=function(e){var c=Ext.extend(Ext.data.Record,{});var d=c.prototype;d.fields=new Ext.util.MixedCollection(false,function(f){return f.name});for(var b=0,a=e.length;b<a;b++){d.fields.add(new Ext.data.Field(e[b]))}c.getField=function(f){return d.fields.get(f)};return c};Ext.data.Record.PREFIX="ext-record";Ext.data.Record.AUTO_ID=1;Ext.data.Record.EDIT="edit";Ext.data.Record.REJECT="reject";Ext.data.Record.COMMIT="commit";Ext.data.Record.id=function(a){a.phantom=true;return[Ext.data.Record.PREFIX,"-",Ext.data.Record.AUTO_ID++].join("")};Ext.data.Record.prototype={dirty:false,editing:false,error:null,modified:null,phantom:false,join:function(a){this.store=a},set:function(a,c){var b=Ext.isPrimitive(c)?String:Ext.encode;if(b(this.data[a])==b(c)){return}this.dirty=true;if(!this.modified){this.modified={}}if(this.modified[a]===undefined){this.modified[a]=this.data[a]}this.data[a]=c;if(!this.editing){this.afterEdit()}},afterEdit:function(){if(this.store!=undefined&&typeof this.store.afterEdit=="function"){this.store.afterEdit(this)}},afterReject:function(){if(this.store){this.store.afterReject(this)}},afterCommit:function(){if(this.store){this.store.afterCommit(this)}},get:function(a){return this.data[a]},beginEdit:function(){this.editing=true;this.modified=this.modified||{}},cancelEdit:function(){this.editing=false;delete this.modified},endEdit:function(){this.editing=false;if(this.dirty){this.afterEdit()}},reject:function(b){var a=this.modified;for(var c in a){if(typeof a[c]!="function"){this.data[c]=a[c]}}this.dirty=false;delete this.modified;this.editing=false;if(b!==true){this.afterReject()}},commit:function(a){this.dirty=false;delete this.modified;this.editing=false;if(a!==true){this.afterCommit()}},getChanges:function(){var a=this.modified,b={};for(var c in a){if(a.hasOwnProperty(c)){b[c]=this.data[c]}}return b},hasError:function(){return this.error!==null},clearError:function(){this.error=null},copy:function(a){return new this.constructor(Ext.apply({},this.data),a||this.id)},isModified:function(a){return !!(this.modified&&this.modified.hasOwnProperty(a))},isValid:function(){return this.fields.find(function(a){return(a.allowBlank===false&&Ext.isEmpty(this.data[a.name]))?true:false},this)?false:true},markDirty:function(){this.dirty=true;if(!this.modified){this.modified={}}this.fields.each(function(a){this.modified[a.name]=this.data[a.name]},this)}};Ext.StoreMgr=Ext.apply(new Ext.util.MixedCollection(),{register:function(){for(var a=0,b;(b=arguments[a]);a++){this.add(b)}},unregister:function(){for(var a=0,b;(b=arguments[a]);a++){this.remove(this.lookup(b))}},lookup:function(e){if(Ext.isArray(e)){var b=["field1"],d=!Ext.isArray(e[0]);if(!d){for(var c=2,a=e[0].length;c<=a;++c){b.push("field"+c)}}return new Ext.data.ArrayStore({fields:b,data:e,expandData:d,autoDestroy:true,autoCreated:true})}return Ext.isObject(e)?(e.events?e:Ext.create(e,"store")):this.get(e)},getKey:function(a){return a.storeId}});Ext.data.Store=Ext.extend(Ext.util.Observable,{writer:undefined,remoteSort:false,autoDestroy:false,pruneModifiedRecords:false,lastOptions:null,autoSave:true,batch:true,restful:false,paramNames:undefined,defaultParamNames:{start:"start",limit:"limit",sort:"sort",dir:"dir"},isDestroyed:false,hasMultiSort:false,batchKey:"_ext_batch_",constructor:function(a){this.data=new Ext.util.MixedCollection(false);this.data.getKey=function(b){return b.id};this.removed=[];if(a&&a.data){this.inlineData=a.data;delete a.data}Ext.apply(this,a);this.baseParams=Ext.isObject(this.baseParams)?this.baseParams:{};this.paramNames=Ext.applyIf(this.paramNames||{},this.defaultParamNames);if((this.url||this.api)&&!this.proxy){this.proxy=new Ext.data.HttpProxy({url:this.url,api:this.api})}if(this.restful===true&&this.proxy){this.batch=false;Ext.data.Api.restify(this.proxy)}if(this.reader){if(!this.recordType){this.recordType=this.reader.recordType}if(this.reader.onMetaChange){this.reader.onMetaChange=this.reader.onMetaChange.createSequence(this.onMetaChange,this)}if(this.writer){if(this.writer instanceof (Ext.data.DataWriter)===false){this.writer=this.buildWriter(this.writer)}this.writer.meta=this.reader.meta;this.pruneModifiedRecords=true}}if(this.recordType){this.fields=this.recordType.prototype.fields}this.modified=[];this.addEvents("datachanged","metachange","add","remove","update","clear","exception","beforeload","load","loadexception","beforewrite","write","beforesave","save");if(this.proxy){this.relayEvents(this.proxy,["loadexception","exception"])}if(this.writer){this.on({scope:this,add:this.createRecords,remove:this.destroyRecord,update:this.updateRecord,clear:this.onClear})}this.sortToggle={};if(this.sortField){this.setDefaultSort(this.sortField,this.sortDir)}else{if(this.sortInfo){this.setDefaultSort(this.sortInfo.field,this.sortInfo.direction)}}Ext.data.Store.superclass.constructor.call(this);if(this.id){this.storeId=this.id;delete this.id}if(this.storeId){Ext.StoreMgr.register(this)}if(this.inlineData){this.loadData(this.inlineData);delete this.inlineData}else{if(this.autoLoad){this.load.defer(10,this,[typeof this.autoLoad=="object"?this.autoLoad:undefined])}}this.batchCounter=0;this.batches={}},buildWriter:function(b){var a=undefined,c=(b.format||"json").toLowerCase();switch(c){case"json":a=Ext.data.JsonWriter;break;case"xml":a=Ext.data.XmlWriter;break;default:a=Ext.data.JsonWriter}return new a(b)},destroy:function(){if(!this.isDestroyed){if(this.storeId){Ext.StoreMgr.unregister(this)}this.clearData();this.data=null;Ext.destroy(this.proxy);this.reader=this.writer=null;this.purgeListeners();this.isDestroyed=true}},add:function(c){var e,a,b,d;c=[].concat(c);if(c.length<1){return}for(e=0,a=c.length;e<a;e++){b=c[e];b.join(this);if(b.dirty||b.phantom){this.modified.push(b)}}d=this.data.length;this.data.addAll(c);if(this.snapshot){this.snapshot.addAll(c)}this.fireEvent("add",this,c,d)},addSorted:function(a){var b=this.findInsertIndex(a);this.insert(b,a)},doUpdate:function(a){var b=a.id;this.getById(b).join(null);this.data.replace(b,a);if(this.snapshot){this.snapshot.replace(b,a)}a.join(this);this.fireEvent("update",this,a,Ext.data.Record.COMMIT)},remove:function(a){if(Ext.isArray(a)){Ext.each(a,function(c){this.remove(c)},this);return}var b=this.data.indexOf(a);if(b>-1){a.join(null);this.data.removeAt(b)}if(this.pruneModifiedRecords){this.modified.remove(a)}if(this.snapshot){this.snapshot.remove(a)}if(b>-1){this.fireEvent("remove",this,a,b)}},removeAt:function(a){this.remove(this.getAt(a))},removeAll:function(b){var a=[];this.each(function(c){a.push(c)});this.clearData();if(this.snapshot){this.snapshot.clear()}if(this.pruneModifiedRecords){this.modified=[]}if(b!==true){this.fireEvent("clear",this,a)}},onClear:function(b,a){Ext.each(a,function(d,c){this.destroyRecord(this,d,c)},this)},insert:function(d,c){var e,a,b;c=[].concat(c);for(e=0,a=c.length;e<a;e++){b=c[e];this.data.insert(d+e,b);b.join(this);if(b.dirty||b.phantom){this.modified.push(b)}}if(this.snapshot){this.snapshot.addAll(c)}this.fireEvent("add",this,c,d)},indexOf:function(a){return this.data.indexOf(a)},indexOfId:function(a){return this.data.indexOfKey(a)},getById:function(a){return(this.snapshot||this.data).key(a)},getAt:function(a){return this.data.itemAt(a)},getRange:function(b,a){return this.data.getRange(b,a)},storeOptions:function(a){a=Ext.apply({},a);delete a.callback;delete a.scope;this.lastOptions=a},clearData:function(){this.data.each(function(a){a.join(null)});this.data.clear()},load:function(b){b=Ext.apply({},b);this.storeOptions(b);if(this.sortInfo&&this.remoteSort){var a=this.paramNames;b.params=Ext.apply({},b.params);b.params[a.sort]=this.sortInfo.field;b.params[a.dir]=this.sortInfo.direction}try{return this.execute("read",null,b)}catch(c){this.handleException(c);return false}},updateRecord:function(b,a,c){if(c==Ext.data.Record.EDIT&&this.autoSave===true&&(!a.phantom||(a.phantom&&a.isValid()))){this.save()}},createRecords:function(c,b,e){var d=this.modified,g=b.length,a,f;for(f=0;f<g;f++){a=b[f];if(a.phantom&&a.isValid()){a.markDirty();if(d.indexOf(a)==-1){d.push(a)}}}if(this.autoSave===true){this.save()}},destroyRecord:function(b,a,c){if(this.modified.indexOf(a)!=-1){this.modified.remove(a)}if(!a.phantom){this.removed.push(a);a.lastIndex=c;if(this.autoSave===true){this.save()}}},execute:function(e,a,c,b){if(!Ext.data.Api.isAction(e)){throw new Ext.data.Api.Error("execute",e)}c=Ext.applyIf(c||{},{params:{}});if(b!==undefined){this.addToBatch(b)}var d=true;if(e==="read"){d=this.fireEvent("beforeload",this,c);Ext.applyIf(c.params,this.baseParams)}else{if(this.writer.listful===true&&this.restful!==true){a=(Ext.isArray(a))?a:[a]}else{if(Ext.isArray(a)&&a.length==1){a=a.shift()}}if((d=this.fireEvent("beforewrite",this,e,a,c))!==false){this.writer.apply(c.params,this.baseParams,e,a)}}if(d!==false){if(this.writer&&this.proxy.url&&!this.proxy.restful&&!Ext.data.Api.hasUniqueUrl(this.proxy,e)){c.params.xaction=e}this.proxy.request(Ext.data.Api.actions[e],a,c.params,this.reader,this.createCallback(e,a,b),this,c)}return d},save:function(){if(!this.writer){throw new Ext.data.Store.Error("writer-undefined")}var g=[],h,j,e,c={},d;if(this.removed.length){g.push(["destroy",this.removed])}var b=[].concat(this.getModifiedRecords());if(b.length){var f=[];for(d=b.length-1;d>=0;d--){if(b[d].phantom===true){var a=b.splice(d,1).shift();if(a.isValid()){f.push(a)}}else{if(!b[d].isValid()){b.splice(d,1)}}}if(f.length){g.push(["create",f])}if(b.length){g.push(["update",b])}}h=g.length;if(h){e=++this.batchCounter;for(d=0;d<h;++d){j=g[d];c[j[0]]=j[1]}if(this.fireEvent("beforesave",this,c)!==false){for(d=0;d<h;++d){j=g[d];this.doTransaction(j[0],j[1],e)}return e}}return -1},doTransaction:function(e,b,c){function f(g){try{this.execute(e,g,undefined,c)}catch(h){this.handleException(h)}}if(this.batch===false){for(var d=0,a=b.length;d<a;d++){f.call(this,b[d])}}else{f.call(this,b)}},addToBatch:function(c){var a=this.batches,d=this.batchKey+c,e=a[d];if(!e){a[d]=e={id:c,count:0,data:{}}}++e.count},removeFromBatch:function(d,g,f){var c=this.batches,e=this.batchKey+d,h=c[e],a;if(h){a=h.data[g]||[];h.data[g]=a.concat(f);if(h.count===1){f=h.data;delete c[e];this.fireEvent("save",this,d,f)}else{--h.count}}},createCallback:function(c,a,b){var d=Ext.data.Api.actions;return(c=="read")?this.loadRecords:function(f,e,g){this["on"+Ext.util.Format.capitalize(c)+"Records"](g,a,[].concat(f));if(g===true){this.fireEvent("write",this,c,f,e,a)}this.removeFromBatch(b,c,f)}},clearModified:function(a){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){this.modified.splice(this.modified.indexOf(a[b]),1)}}else{this.modified.splice(this.modified.indexOf(a),1)}},reMap:function(b){if(Ext.isArray(b)){for(var d=0,a=b.length;d<a;d++){this.reMap(b[d])}}else{delete this.data.map[b._phid];this.data.map[b.id]=b;var c=this.data.keys.indexOf(b._phid);this.data.keys.splice(c,1,b.id);delete b._phid}},onCreateRecords:function(d,a,b){if(d===true){try{this.reader.realize(a,b)}catch(c){this.handleException(c);if(Ext.isArray(a)){this.onCreateRecords(d,a,b)}}}},onUpdateRecords:function(d,a,b){if(d===true){try{this.reader.update(a,b)}catch(c){this.handleException(c);if(Ext.isArray(a)){this.onUpdateRecords(d,a,b)}}}},onDestroyRecords:function(e,b,d){b=(b instanceof Ext.data.Record)?[b]:[].concat(b);for(var c=0,a=b.length;c<a;c++){this.removed.splice(this.removed.indexOf(b[c]),1)}if(e===false){for(c=b.length-1;c>=0;c--){this.insert(b[c].lastIndex,b[c])}}},handleException:function(a){Ext.handleError(a)},reload:function(a){this.load(Ext.applyIf(a||{},this.lastOptions))},loadRecords:function(b,k,g){var e,f;if(this.isDestroyed===true){return}if(!b||g===false){if(g!==false){this.fireEvent("load",this,[],k)}if(k.callback){k.callback.call(k.scope||this,[],k,false,b)}return}var a=b.records,h=b.totalRecords||a.length;if(!k||k.add!==true){if(this.pruneModifiedRecords){this.modified=[]}for(e=0,f=a.length;e<f;e++){a[e].join(this)}if(this.snapshot){this.data=this.snapshot;delete this.snapshot}this.clearData();this.data.addAll(a);this.totalLength=h;this.applySort();this.fireEvent("datachanged",this)}else{var j=[],d,c=0;for(e=0,f=a.length;e<f;++e){d=a[e];if(this.indexOfId(d.id)>-1){this.doUpdate(d)}else{j.push(d);++c}}this.totalLength=Math.max(h,this.data.length+c);this.add(j)}this.fireEvent("load",this,a,k);if(k.callback){k.callback.call(k.scope||this,a,k,true)}},loadData:function(c,a){var b=this.reader.readRecords(c);this.loadRecords(b,{add:a},true)},getCount:function(){return this.data.length||0},getTotalCount:function(){return this.totalLength||0},getSortState:function(){return this.sortInfo},applySort:function(){if((this.sortInfo||this.multiSortInfo)&&!this.remoteSort){this.sortData()}},sortData:function(){var a=this.hasMultiSort?this.multiSortInfo:this.sortInfo,h=a.direction||"ASC",g=a.sorters,c=[];if(!this.hasMultiSort){g=[{direction:h,field:a.field}]}for(var d=0,b=g.length;d<b;d++){c.push(this.createSortFunction(g[d].field,g[d].direction))}if(c.length==0){return}var f=h.toUpperCase()=="DESC"?-1:1;var e=function(m,l){var k=c[0].call(this,m,l);if(c.length>1){for(var o=1,n=c.length;o<n;o++){k=k||c[o].call(this,m,l)}}return f*k};this.data.sort(h,e);if(this.snapshot&&this.snapshot!=this.data){this.snapshot.sort(h,e)}},createSortFunction:function(c,b){b=b||"ASC";var a=b.toUpperCase()=="DESC"?-1:1;var d=this.fields.get(c).sortType;return function(f,e){var h=d(f.data[c]),g=d(e.data[c]);return a*(h>g?1:(h<g?-1:0))}},setDefaultSort:function(b,a){a=a?a.toUpperCase():"ASC";this.sortInfo={field:b,direction:a};this.sortToggle[b]=a},sort:function(b,a){if(Ext.isArray(arguments[0])){return this.multiSort.call(this,b,a)}else{return this.singleSort(b,a)}},singleSort:function(f,c){var e=this.fields.get(f);if(!e){return false}var b=e.name,a=this.sortInfo||null,d=this.sortToggle?this.sortToggle[b]:null;if(!c){if(a&&a.field==b){c=(this.sortToggle[b]||"ASC").toggle("ASC","DESC")}else{c=e.sortDir}}this.sortToggle[b]=c;this.sortInfo={field:b,direction:c};this.hasMultiSort=false;if(this.remoteSort){if(!this.load(this.lastOptions)){if(d){this.sortToggle[b]=d}if(a){this.sortInfo=a}}}else{this.applySort();this.fireEvent("datachanged",this)}return true},multiSort:function(b,a){this.hasMultiSort=true;a=a||"ASC";if(this.multiSortInfo&&a==this.multiSortInfo.direction){a=a.toggle("ASC","DESC")}this.multiSortInfo={sorters:b,direction:a};if(this.remoteSort){this.singleSort(b[0].field,b[0].direction)}else{this.applySort();this.fireEvent("datachanged",this)}},each:function(b,a){this.data.each(b,a)},getModifiedRecords:function(){return this.modified},sum:function(e,f,a){var c=this.data.items,b=0;f=f||0;a=(a||a===0)?a:c.length-1;for(var d=f;d<=a;d++){b+=(c[d].data[e]||0)}return b},createFilterFn:function(d,c,e,a,b){if(Ext.isEmpty(c,false)){return false}c=this.data.createValueMatcher(c,e,a,b);return function(f){return c.test(f.data[d])}},createMultipleFilterFn:function(a){return function(b){var h=true;for(var d=0,c=a.length;d<c;d++){var g=a[d],f=g.fn,e=g.scope;h=h&&f.call(e,b)}return h}},filter:function(m,l,g,h,e){var k;if(Ext.isObject(m)){m=[m]}if(Ext.isArray(m)){var b=[];for(var f=0,d=m.length;f<d;f++){var a=m[f],c=a.fn,n=a.scope||this;if(!Ext.isFunction(c)){c=this.createFilterFn(a.property,a.value,a.anyMatch,a.caseSensitive,a.exactMatch)}b.push({fn:c,scope:n})}k=this.createMultipleFilterFn(b)}else{k=this.createFilterFn(m,l,g,h,e)}return k?this.filterBy(k):this.clearFilter()},filterBy:function(b,a){this.snapshot=this.snapshot||this.data;this.data=this.queryBy(b,a||this);this.fireEvent("datachanged",this)},clearFilter:function(a){if(this.isFiltered()){this.data=this.snapshot;delete this.snapshot;if(a!==true){this.fireEvent("datachanged",this)}}},isFiltered:function(){return !!this.snapshot&&this.snapshot!=this.data},query:function(d,c,e,a){var b=this.createFilterFn(d,c,e,a);return b?this.queryBy(b):this.data.clone()},queryBy:function(b,a){var c=this.snapshot||this.data;return c.filterBy(b,a||this)},find:function(d,c,f,e,a){var b=this.createFilterFn(d,c,e,a);return b?this.data.findIndexBy(b,null,f):-1},findExact:function(b,a,c){return this.data.findIndexBy(function(d){return d.get(b)===a},this,c)},findBy:function(b,a,c){return this.data.findIndexBy(b,a,c)},collect:function(h,j,b){var g=(b===true&&this.snapshot)?this.snapshot.items:this.data.items;var k,m,a=[],c={};for(var e=0,f=g.length;e<f;e++){k=g[e].data[h];m=String(k);if((j||!Ext.isEmpty(k))&&!c[m]){c[m]=true;a[a.length]=k}}return a},afterEdit:function(a){if(this.modified.indexOf(a)==-1){this.modified.push(a)}this.fireEvent("update",this,a,Ext.data.Record.EDIT)},afterReject:function(a){this.modified.remove(a);this.fireEvent("update",this,a,Ext.data.Record.REJECT)},afterCommit:function(a){this.modified.remove(a);this.fireEvent("update",this,a,Ext.data.Record.COMMIT)},commitChanges:function(){var a=this.modified.slice(0),c=a.length,b;for(b=0;b<c;b++){a[b].commit()}this.modified=[];this.removed=[]},rejectChanges:function(){var a=this.modified.slice(0),e=this.removed.slice(0).reverse(),c=a.length,d=e.length,b;for(b=0;b<c;b++){a[b].reject()}for(b=0;b<d;b++){this.insert(e[b].lastIndex||0,e[b]);e[b].reject()}this.modified=[];this.removed=[]},onMetaChange:function(a){this.recordType=this.reader.recordType;this.fields=this.recordType.prototype.fields;delete this.snapshot;if(this.reader.meta.sortInfo){this.sortInfo=this.reader.meta.sortInfo}else{if(this.sortInfo&&!this.fields.get(this.sortInfo.field)){delete this.sortInfo}}if(this.writer){this.writer.meta=this.reader.meta}this.modified=[];this.fireEvent("metachange",this,this.reader.meta)},findInsertIndex:function(a){this.suspendEvents();var c=this.data.clone();this.data.add(a);this.applySort();var b=this.data.indexOf(a);this.data=c;this.resumeEvents();return b},setBaseParam:function(a,b){this.baseParams=this.baseParams||{};this.baseParams[a]=b}});Ext.reg("store",Ext.data.Store);Ext.data.Store.Error=Ext.extend(Ext.Error,{name:"Ext.data.Store"});Ext.apply(Ext.data.Store.Error.prototype,{lang:{"writer-undefined":"Attempted to execute a write-action without a DataWriter installed."}});Ext.data.Field=Ext.extend(Object,{constructor:function(b){if(Ext.isString(b)){b={name:b}}Ext.apply(this,b);var d=Ext.data.Types,a=this.sortType,c;if(this.type){if(Ext.isString(this.type)){this.type=Ext.data.Types[this.type.toUpperCase()]||d.AUTO}}else{this.type=d.AUTO}if(Ext.isString(a)){this.sortType=Ext.data.SortTypes[a]}else{if(Ext.isEmpty(a)){this.sortType=this.type.sortType}}if(!this.convert){this.convert=this.type.convert}},dateFormat:null,useNull:false,defaultValue:"",mapping:null,sortType:null,sortDir:"ASC",allowBlank:true});Ext.data.DataReader=function(a,b){this.meta=a;this.recordType=Ext.isArray(b)?Ext.data.Record.create(b):b;if(this.recordType){this.buildExtractors()}};Ext.data.DataReader.prototype={getTotal:Ext.emptyFn,getRoot:Ext.emptyFn,getMessage:Ext.emptyFn,getSuccess:Ext.emptyFn,getId:Ext.emptyFn,buildExtractors:Ext.emptyFn,extractValues:Ext.emptyFn,realize:function(a,c){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){if(Ext.isArray(c)){this.realize(a.splice(b,1).shift(),c.splice(b,1).shift())}else{this.realize(a.splice(b,1).shift(),c)}}}else{if(Ext.isArray(c)&&c.length==1){c=c.shift()}if(!this.isData(c)){throw new Ext.data.DataReader.Error("realize",a)}a.phantom=false;a._phid=a.id;a.id=this.getId(c);a.data=c;a.commit();a.store.reMap(a)}},update:function(a,c){if(Ext.isArray(a)){for(var b=a.length-1;b>=0;b--){if(Ext.isArray(c)){this.update(a.splice(b,1).shift(),c.splice(b,1).shift())}else{this.update(a.splice(b,1).shift(),c)}}}else{if(Ext.isArray(c)&&c.length==1){c=c.shift()}if(this.isData(c)){a.data=Ext.apply(a.data,c)}a.commit()}},extractData:function(k,a){var j=(this instanceof Ext.data.JsonReader)?"json":"node";var c=[];if(this.isData(k)&&!(this instanceof Ext.data.XmlReader)){k=[k]}var h=this.recordType.prototype.fields,o=h.items,m=h.length,c=[];if(a===true){var l=this.recordType;for(var e=0;e<k.length;e++){var b=k[e];var g=new l(this.extractValues(b,o,m),this.getId(b));g[j]=b;c.push(g)}}else{for(var e=0;e<k.length;e++){var d=this.extractValues(k[e],o,m);d[this.meta.idProperty]=this.getId(k[e]);c.push(d)}}return c},isData:function(a){return(a&&Ext.isObject(a)&&!Ext.isEmpty(this.getId(a)))?true:false},onMetaChange:function(a){delete this.ef;this.meta=a;this.recordType=Ext.data.Record.create(a.fields);this.buildExtractors()}};Ext.data.DataReader.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.DataReader"});Ext.apply(Ext.data.DataReader.Error.prototype,{lang:{update:"#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",realize:"#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.","invalid-response":"#readResponse received an invalid response from the server."}});Ext.data.DataWriter=function(a){Ext.apply(this,a)};Ext.data.DataWriter.prototype={writeAllFields:false,listful:false,apply:function(e,f,d,a){var c=[],b=d+"Record";if(Ext.isArray(a)){Ext.each(a,function(g){c.push(this[b](g))},this)}else{if(a instanceof Ext.data.Record){c=this[b](a)}}this.render(e,f,c)},render:Ext.emptyFn,updateRecord:Ext.emptyFn,createRecord:Ext.emptyFn,destroyRecord:Ext.emptyFn,toHash:function(f,c){var e=f.fields.map,d={},b=(this.writeAllFields===false&&f.phantom===false)?f.getChanges():f.data,a;Ext.iterate(b,function(h,g){if((a=e[h])){d[a.mapping?a.mapping:a.name]=g}});if(f.phantom){if(f.fields.containsKey(this.meta.idProperty)&&Ext.isEmpty(f.data[this.meta.idProperty])){delete d[this.meta.idProperty]}}else{d[this.meta.idProperty]=f.id}return d},toArray:function(b){var a=[];Ext.iterate(b,function(d,c){a.push({name:d,value:c})},this);return a}};Ext.data.DataProxy=function(a){a=a||{};this.api=a.api;this.url=a.url;this.restful=a.restful;this.listeners=a.listeners;this.prettyUrls=a.prettyUrls;this.addEvents("exception","beforeload","load","loadexception","beforewrite","write");Ext.data.DataProxy.superclass.constructor.call(this);try{Ext.data.Api.prepare(this)}catch(b){if(b instanceof Ext.data.Api.Error){b.toConsole()}}Ext.data.DataProxy.relayEvents(this,["beforewrite","write","exception"])};Ext.extend(Ext.data.DataProxy,Ext.util.Observable,{restful:false,setApi:function(){if(arguments.length==1){var a=Ext.data.Api.isValid(arguments[0]);if(a===true){this.api=arguments[0]}else{throw new Ext.data.Api.Error("invalid",a)}}else{if(arguments.length==2){if(!Ext.data.Api.isAction(arguments[0])){throw new Ext.data.Api.Error("invalid",arguments[0])}this.api[arguments[0]]=arguments[1]}}Ext.data.Api.prepare(this)},isApiAction:function(a){return(this.api[a])?true:false},request:function(e,b,f,a,g,d,c){if(!this.api[e]&&!this.load){throw new Ext.data.DataProxy.Error("action-undefined",e)}f=f||{};if((e===Ext.data.Api.actions.read)?this.fireEvent("beforeload",this,f):this.fireEvent("beforewrite",this,e,b,f)!==false){this.doRequest.apply(this,arguments)}else{g.call(d||this,null,c,false)}},load:null,doRequest:function(e,b,f,a,g,d,c){this.load(f,a,g,d,c)},onRead:Ext.emptyFn,onWrite:Ext.emptyFn,buildUrl:function(d,b){b=b||null;var c=(this.conn&&this.conn.url)?this.conn.url:(this.api[d])?this.api[d].url:this.url;if(!c){throw new Ext.data.Api.Error("invalid-url",d)}var e=null;var a=c.match(/(.*)(\.json|\.xml|\.html)$/);if(a){e=a[2];c=a[1]}if((this.restful===true||this.prettyUrls===true)&&b instanceof Ext.data.Record&&!b.phantom){c+="/"+b.id}return(e===null)?c:c+e},destroy:function(){this.purgeListeners()}});Ext.apply(Ext.data.DataProxy,Ext.util.Observable.prototype);Ext.util.Observable.call(Ext.data.DataProxy);Ext.data.DataProxy.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.DataProxy"});Ext.apply(Ext.data.DataProxy.Error.prototype,{lang:{"action-undefined":"DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.","api-invalid":"Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions."}});Ext.data.Request=function(a){Ext.apply(this,a)};Ext.data.Request.prototype={action:undefined,rs:undefined,params:undefined,callback:Ext.emptyFn,scope:undefined,reader:undefined};Ext.data.Response=function(a){Ext.apply(this,a)};Ext.data.Response.prototype={action:undefined,success:undefined,message:undefined,data:undefined,raw:undefined,records:undefined};Ext.data.ScriptTagProxy=function(a){Ext.apply(this,a);Ext.data.ScriptTagProxy.superclass.constructor.call(this,a);this.head=document.getElementsByTagName("head")[0]};Ext.data.ScriptTagProxy.TRANS_ID=1000;Ext.extend(Ext.data.ScriptTagProxy,Ext.data.DataProxy,{timeout:30000,callbackParam:"callback",nocache:true,doRequest:function(e,f,d,g,i,j,k){var c=Ext.urlEncode(Ext.apply(d,this.extraParams));var b=this.buildUrl(e,f);if(!b){throw new Ext.data.Api.Error("invalid-url",b)}b=Ext.urlAppend(b,c);if(this.nocache){b=Ext.urlAppend(b,"_dc="+(new Date().getTime()))}var a=++Ext.data.ScriptTagProxy.TRANS_ID;var l={id:a,action:e,cb:"stcCallback"+a,scriptId:"stcScript"+a,params:d,arg:k,url:b,callback:i,scope:j,reader:g};window[l.cb]=this.createCallback(e,f,l);b+=String.format("&{0}={1}",this.callbackParam,l.cb);if(this.autoAbort!==false){this.abort()}l.timeoutId=this.handleFailure.defer(this.timeout,this,[l]);var h=document.createElement("script");h.setAttribute("src",b);h.setAttribute("type","text/javascript");h.setAttribute("id",l.scriptId);this.head.appendChild(h);this.trans=l},createCallback:function(d,b,c){var a=this;return function(e){a.trans=false;a.destroyTrans(c,true);if(d===Ext.data.Api.actions.read){a.onRead.call(a,d,c,e)}else{a.onWrite.call(a,d,c,e,b)}}},onRead:function(d,c,b){var a;try{a=c.reader.readRecords(b)}catch(f){this.fireEvent("loadexception",this,c,b,f);this.fireEvent("exception",this,"response",d,c,b,f);c.callback.call(c.scope||window,null,c.arg,false);return}if(a.success===false){this.fireEvent("loadexception",this,c,b);this.fireEvent("exception",this,"remote",d,c,b,null)}else{this.fireEvent("load",this,b,c.arg)}c.callback.call(c.scope||window,a,c.arg,a.success)},onWrite:function(g,f,c,b){var a=f.reader;try{var d=a.readResponse(g,c)}catch(h){this.fireEvent("exception",this,"response",g,f,d,h);f.callback.call(f.scope||window,null,d,false);return}if(!d.success===true){this.fireEvent("exception",this,"remote",g,f,d,b);f.callback.call(f.scope||window,null,d,false);return}this.fireEvent("write",this,g,d.data,d,b,f.arg);f.callback.call(f.scope||window,d.data,d,true)},isLoading:function(){return this.trans?true:false},abort:function(){if(this.isLoading()){this.destroyTrans(this.trans)}},destroyTrans:function(b,a){this.head.removeChild(document.getElementById(b.scriptId));clearTimeout(b.timeoutId);if(a){window[b.cb]=undefined;try{delete window[b.cb]}catch(c){}}else{window[b.cb]=function(){window[b.cb]=undefined;try{delete window[b.cb]}catch(d){}}}},handleFailure:function(a){this.trans=false;this.destroyTrans(a,false);if(a.action===Ext.data.Api.actions.read){this.fireEvent("loadexception",this,null,a.arg)}this.fireEvent("exception",this,"response",a.action,{response:null,options:a.arg});a.callback.call(a.scope||window,null,a.arg,false)},destroy:function(){this.abort();Ext.data.ScriptTagProxy.superclass.destroy.call(this)}});Ext.data.HttpProxy=function(a){Ext.data.HttpProxy.superclass.constructor.call(this,a);this.conn=a;this.conn.url=null;this.useAjax=!a||!a.events;var c=Ext.data.Api.actions;this.activeRequest={};for(var b in c){this.activeRequest[c[b]]=undefined}};Ext.extend(Ext.data.HttpProxy,Ext.data.DataProxy,{getConnection:function(){return this.useAjax?Ext.Ajax:this.conn},setUrl:function(a,b){this.conn.url=a;if(b===true){this.url=a;this.api=null;Ext.data.Api.prepare(this)}},doRequest:function(f,d,h,c,b,e,a){var g={method:(this.api[f])?this.api[f]["method"]:undefined,request:{callback:b,scope:e,arg:a},reader:c,callback:this.createCallback(f,d),scope:this};if(h.jsonData){g.jsonData=h.jsonData}else{if(h.xmlData){g.xmlData=h.xmlData}else{g.params=h||{}}}this.conn.url=this.buildUrl(f,d);if(this.useAjax){Ext.applyIf(g,this.conn);if(this.activeRequest[f]){}this.activeRequest[f]=Ext.Ajax.request(g)}else{this.conn.request(g)}this.conn.url=null},createCallback:function(b,a){return function(e,d,c){this.activeRequest[b]=undefined;if(!d){if(b===Ext.data.Api.actions.read){this.fireEvent("loadexception",this,e,c)}this.fireEvent("exception",this,"response",b,e,c);e.request.callback.call(e.request.scope,null,e.request.arg,false);return}if(b===Ext.data.Api.actions.read){this.onRead(b,e,c)}else{this.onWrite(b,e,c,a)}}},onRead:function(d,g,b){var a;try{a=g.reader.read(b)}catch(f){this.fireEvent("loadexception",this,g,b,f);this.fireEvent("exception",this,"response",d,g,b,f);g.request.callback.call(g.request.scope,null,g.request.arg,false);return}if(a.success===false){this.fireEvent("loadexception",this,g,b);var c=g.reader.readResponse(d,b);this.fireEvent("exception",this,"remote",d,g,c,null)}else{this.fireEvent("load",this,g,g.request.arg)}g.request.callback.call(g.request.scope,a,g.request.arg,a.success)},onWrite:function(f,h,c,b){var a=h.reader;var d;try{d=a.readResponse(f,c)}catch(g){this.fireEvent("exception",this,"response",f,h,c,g);h.request.callback.call(h.request.scope,null,h.request.arg,false);return}if(d.success===true){this.fireEvent("write",this,f,d.data,d,b,h.request.arg)}else{this.fireEvent("exception",this,"remote",f,h,d,b)}h.request.callback.call(h.request.scope,d.data,d,d.success)},destroy:function(){if(!this.useAjax){this.conn.abort()}else{if(this.activeRequest){var b=Ext.data.Api.actions;for(var a in b){if(this.activeRequest[b[a]]){Ext.Ajax.abort(this.activeRequest[b[a]])}}}}Ext.data.HttpProxy.superclass.destroy.call(this)}});Ext.data.MemoryProxy=function(b){var a={};a[Ext.data.Api.actions.read]=true;Ext.data.MemoryProxy.superclass.constructor.call(this,{api:a});this.data=b};Ext.extend(Ext.data.MemoryProxy,Ext.data.DataProxy,{doRequest:function(b,c,a,d,g,h,i){a=a||{};var j;try{j=d.readRecords(this.data)}catch(f){this.fireEvent("loadexception",this,null,i,f);this.fireEvent("exception",this,"response",b,i,null,f);g.call(h,null,i,false);return}g.call(h,j,i,true)}});Ext.data.Types=new function(){var a=Ext.data.SortTypes;Ext.apply(this,{stripRe:/[\$,%]/g,AUTO:{convert:function(b){return b},sortType:a.none,type:"auto"},STRING:{convert:function(b){return(b===undefined||b===null)?"":String(b)},sortType:a.asUCString,type:"string"},INT:{convert:function(b){return b!==undefined&&b!==null&&b!==""?parseInt(String(b).replace(Ext.data.Types.stripRe,""),10):(this.useNull?null:0)},sortType:a.none,type:"int"},FLOAT:{convert:function(b){return b!==undefined&&b!==null&&b!==""?parseFloat(String(b).replace(Ext.data.Types.stripRe,""),10):(this.useNull?null:0)},sortType:a.none,type:"float"},BOOL:{convert:function(b){return b===true||b==="true"||b==1},sortType:a.none,type:"bool"},DATE:{convert:function(c){var d=this.dateFormat;if(!c){return null}if(Ext.isDate(c)){return c}if(d){if(d=="timestamp"){return new Date(c*1000)}if(d=="time"){return new Date(parseInt(c,10))}return Date.parseDate(c,d)}var b=Date.parse(c);return b?new Date(b):null},sortType:a.asDate,type:"date"}});Ext.apply(this,{BOOLEAN:this.BOOL,INTEGER:this.INT,NUMBER:this.FLOAT})};
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.tree.TreePanel=Ext.extend(Ext.Panel,{rootVisible:true,animate:Ext.enableFx,lines:true,enableDD:false,hlDrop:Ext.enableFx,pathSeparator:"/",bubbleEvents:[],initComponent:function(){Ext.tree.TreePanel.superclass.initComponent.call(this);if(!this.eventModel){this.eventModel=new Ext.tree.TreeEventModel(this)}var a=this.loader;if(!a){a=new Ext.tree.TreeLoader({dataUrl:this.dataUrl,requestMethod:this.requestMethod})}else{if(Ext.isObject(a)&&!a.load){a=new Ext.tree.TreeLoader(a)}}this.loader=a;this.nodeHash={};if(this.root){var b=this.root;delete this.root;this.setRootNode(b)}this.addEvents("append","remove","movenode","insert","beforeappend","beforeremove","beforemovenode","beforeinsert","beforeload","load","textchange","beforeexpandnode","beforecollapsenode","expandnode","disabledchange","collapsenode","beforeclick","click","containerclick","checkchange","beforedblclick","dblclick","containerdblclick","contextmenu","containercontextmenu","beforechildrenrendered","startdrag","enddrag","dragdrop","beforenodedrop","nodedrop","nodedragover");if(this.singleExpand){this.on("beforeexpandnode",this.restrictExpand,this)}},proxyNodeEvent:function(c,b,a,g,f,e,d){if(c=="collapse"||c=="expand"||c=="beforecollapse"||c=="beforeexpand"||c=="move"||c=="beforemove"){c=c+"node"}return this.fireEvent(c,b,a,g,f,e,d)},getRootNode:function(){return this.root},setRootNode:function(b){this.destroyRoot();if(!b.render){b=this.loader.createNode(b)}this.root=b;b.ownerTree=this;b.isRoot=true;this.registerNode(b);if(!this.rootVisible){var a=b.attributes.uiProvider;b.ui=a?new a(b):new Ext.tree.RootTreeNodeUI(b)}if(this.innerCt){this.clearInnerCt();this.renderRoot()}return b},clearInnerCt:function(){this.innerCt.update("")},renderRoot:function(){this.root.render();if(!this.rootVisible){this.root.renderChildren()}},getNodeById:function(a){return this.nodeHash[a]},registerNode:function(a){this.nodeHash[a.id]=a},unregisterNode:function(a){delete this.nodeHash[a.id]},toString:function(){return"[Tree"+(this.id?" "+this.id:"")+"]"},restrictExpand:function(a){var b=a.parentNode;if(b){if(b.expandedChild&&b.expandedChild.parentNode==b){b.expandedChild.collapse()}b.expandedChild=a}},getChecked:function(b,c){c=c||this.root;var d=[];var e=function(){if(this.attributes.checked){d.push(!b?this:(b=="id"?this.id:this.attributes[b]))}};c.cascade(e);return d},getLoader:function(){return this.loader},expandAll:function(){this.root.expand(true)},collapseAll:function(){this.root.collapse(true)},getSelectionModel:function(){if(!this.selModel){this.selModel=new Ext.tree.DefaultSelectionModel()}return this.selModel},expandPath:function(g,a,h){if(Ext.isEmpty(g)){if(h){h(false,undefined)}return}a=a||"id";var d=g.split(this.pathSeparator);var c=this.root;if(c.attributes[a]!=d[1]){if(h){h(false,null)}return}var b=1;var e=function(){if(++b==d.length){if(h){h(true,c)}return}var f=c.findChild(a,d[b]);if(!f){if(h){h(false,c)}return}c=f;f.expand(false,false,e)};c.expand(false,false,e)},selectPath:function(e,a,g){if(Ext.isEmpty(e)){if(g){g(false,undefined)}return}a=a||"id";var c=e.split(this.pathSeparator),b=c.pop();if(c.length>1){var d=function(h,f){if(h&&f){var i=f.findChild(a,b);if(i){i.select();if(g){g(true,i)}}else{if(g){g(false,i)}}}else{if(g){g(false,i)}}};this.expandPath(c.join(this.pathSeparator),a,d)}else{this.root.select();if(g){g(true,this.root)}}},getTreeEl:function(){return this.body},onRender:function(b,a){Ext.tree.TreePanel.superclass.onRender.call(this,b,a);this.el.addClass("x-tree");this.innerCt=this.body.createChild({tag:"ul",cls:"x-tree-root-ct "+(this.useArrows?"x-tree-arrows":this.lines?"x-tree-lines":"x-tree-no-lines")})},initEvents:function(){Ext.tree.TreePanel.superclass.initEvents.call(this);if(this.containerScroll){Ext.dd.ScrollManager.register(this.body)}if((this.enableDD||this.enableDrop)&&!this.dropZone){this.dropZone=new Ext.tree.TreeDropZone(this,this.dropConfig||{ddGroup:this.ddGroup||"TreeDD",appendOnly:this.ddAppendOnly===true})}if((this.enableDD||this.enableDrag)&&!this.dragZone){this.dragZone=new Ext.tree.TreeDragZone(this,this.dragConfig||{ddGroup:this.ddGroup||"TreeDD",scroll:this.ddScroll})}this.getSelectionModel().init(this)},afterRender:function(){Ext.tree.TreePanel.superclass.afterRender.call(this);this.renderRoot()},beforeDestroy:function(){if(this.rendered){Ext.dd.ScrollManager.unregister(this.body);Ext.destroy(this.dropZone,this.dragZone)}this.destroyRoot();Ext.destroy(this.loader);this.nodeHash=this.root=this.loader=null;Ext.tree.TreePanel.superclass.beforeDestroy.call(this)},destroyRoot:function(){if(this.root&&this.root.destroy){this.root.destroy(true)}}});Ext.tree.TreePanel.nodeTypes={};Ext.reg("treepanel",Ext.tree.TreePanel);Ext.tree.TreeEventModel=function(a){this.tree=a;this.tree.on("render",this.initEvents,this)};Ext.tree.TreeEventModel.prototype={initEvents:function(){var a=this.tree;if(a.trackMouseOver!==false){a.mon(a.innerCt,{scope:this,mouseover:this.delegateOver,mouseout:this.delegateOut})}a.mon(a.getTreeEl(),{scope:this,click:this.delegateClick,dblclick:this.delegateDblClick,contextmenu:this.delegateContextMenu})},getNode:function(b){var a;if(a=b.getTarget(".x-tree-node-el",10)){var c=Ext.fly(a,"_treeEvents").getAttribute("tree-node-id","ext");if(c){return this.tree.getNodeById(c)}}return null},getNodeTarget:function(b){var a=b.getTarget(".x-tree-node-icon",1);if(!a){a=b.getTarget(".x-tree-node-el",6)}return a},delegateOut:function(b,a){if(!this.beforeEvent(b)){return}if(b.getTarget(".x-tree-ec-icon",1)){var c=this.getNode(b);this.onIconOut(b,c);if(c==this.lastEcOver){delete this.lastEcOver}}if((a=this.getNodeTarget(b))&&!b.within(a,true)){this.onNodeOut(b,this.getNode(b))}},delegateOver:function(b,a){if(!this.beforeEvent(b)){return}if(Ext.isGecko&&!this.trackingDoc){Ext.getBody().on("mouseover",this.trackExit,this);this.trackingDoc=true}if(this.lastEcOver){this.onIconOut(b,this.lastEcOver);delete this.lastEcOver}if(b.getTarget(".x-tree-ec-icon",1)){this.lastEcOver=this.getNode(b);this.onIconOver(b,this.lastEcOver)}if(a=this.getNodeTarget(b)){this.onNodeOver(b,this.getNode(b))}},trackExit:function(a){if(this.lastOverNode){if(this.lastOverNode.ui&&!a.within(this.lastOverNode.ui.getEl())){this.onNodeOut(a,this.lastOverNode)}delete this.lastOverNode;Ext.getBody().un("mouseover",this.trackExit,this);this.trackingDoc=false}},delegateClick:function(b,a){if(this.beforeEvent(b)){if(b.getTarget("input[type=checkbox]",1)){this.onCheckboxClick(b,this.getNode(b))}else{if(b.getTarget(".x-tree-ec-icon",1)){this.onIconClick(b,this.getNode(b))}else{if(this.getNodeTarget(b)){this.onNodeClick(b,this.getNode(b))}}}}else{this.checkContainerEvent(b,"click")}},delegateDblClick:function(b,a){if(this.beforeEvent(b)){if(this.getNodeTarget(b)){this.onNodeDblClick(b,this.getNode(b))}}else{this.checkContainerEvent(b,"dblclick")}},delegateContextMenu:function(b,a){if(this.beforeEvent(b)){if(this.getNodeTarget(b)){this.onNodeContextMenu(b,this.getNode(b))}}else{this.checkContainerEvent(b,"contextmenu")}},checkContainerEvent:function(b,a){if(this.disabled){b.stopEvent();return false}this.onContainerEvent(b,a)},onContainerEvent:function(b,a){this.tree.fireEvent("container"+a,this.tree,b)},onNodeClick:function(b,a){a.ui.onClick(b)},onNodeOver:function(b,a){this.lastOverNode=a;a.ui.onOver(b)},onNodeOut:function(b,a){a.ui.onOut(b)},onIconOver:function(b,a){a.ui.addClass("x-tree-ec-over")},onIconOut:function(b,a){a.ui.removeClass("x-tree-ec-over")},onIconClick:function(b,a){a.ui.ecClick(b)},onCheckboxClick:function(b,a){a.ui.onCheckChange(b)},onNodeDblClick:function(b,a){a.ui.onDblClick(b)},onNodeContextMenu:function(b,a){a.ui.onContextMenu(b)},beforeEvent:function(b){var a=this.getNode(b);if(this.disabled||!a||!a.ui){b.stopEvent();return false}return true},disable:function(){this.disabled=true},enable:function(){this.disabled=false}};Ext.tree.DefaultSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(a){this.selNode=null;this.addEvents("selectionchange","beforeselect");Ext.apply(this,a);Ext.tree.DefaultSelectionModel.superclass.constructor.call(this)},init:function(a){this.tree=a;a.mon(a.getTreeEl(),"keydown",this.onKeyDown,this);a.on("click",this.onNodeClick,this)},onNodeClick:function(a,b){this.select(a)},select:function(c,a){if(!Ext.fly(c.ui.wrap).isVisible()&&a){return a.call(this,c)}var b=this.selNode;if(c==b){c.ui.onSelectedChange(true)}else{if(this.fireEvent("beforeselect",this,c,b)!==false){if(b&&b.ui){b.ui.onSelectedChange(false)}this.selNode=c;c.ui.onSelectedChange(true);this.fireEvent("selectionchange",this,c,b)}}return c},unselect:function(b,a){if(this.selNode==b){this.clearSelections(a)}},clearSelections:function(a){var b=this.selNode;if(b){b.ui.onSelectedChange(false);this.selNode=null;if(a!==true){this.fireEvent("selectionchange",this,null)}}return b},getSelectedNode:function(){return this.selNode},isSelected:function(a){return this.selNode==a},selectPrevious:function(a){if(!(a=a||this.selNode||this.lastSelNode)){return null}var c=a.previousSibling;if(c){if(!c.isExpanded()||c.childNodes.length<1){return this.select(c,this.selectPrevious)}else{var b=c.lastChild;while(b&&b.isExpanded()&&Ext.fly(b.ui.wrap).isVisible()&&b.childNodes.length>0){b=b.lastChild}return this.select(b,this.selectPrevious)}}else{if(a.parentNode&&(this.tree.rootVisible||!a.parentNode.isRoot)){return this.select(a.parentNode,this.selectPrevious)}}return null},selectNext:function(b){if(!(b=b||this.selNode||this.lastSelNode)){return null}if(b.firstChild&&b.isExpanded()&&Ext.fly(b.ui.wrap).isVisible()){return this.select(b.firstChild,this.selectNext)}else{if(b.nextSibling){return this.select(b.nextSibling,this.selectNext)}else{if(b.parentNode){var a=null;b.parentNode.bubble(function(){if(this.nextSibling){a=this.getOwnerTree().selModel.select(this.nextSibling,this.selectNext);return false}});return a}}}return null},onKeyDown:function(c){var b=this.selNode||this.lastSelNode;var d=this;if(!b){return}var a=c.getKey();switch(a){case c.DOWN:c.stopEvent();this.selectNext();break;case c.UP:c.stopEvent();this.selectPrevious();break;case c.RIGHT:c.preventDefault();if(b.hasChildNodes()){if(!b.isExpanded()){b.expand()}else{if(b.firstChild){this.select(b.firstChild,c)}}}break;case c.LEFT:c.preventDefault();if(b.hasChildNodes()&&b.isExpanded()){b.collapse()}else{if(b.parentNode&&(this.tree.rootVisible||b.parentNode!=this.tree.getRootNode())){this.select(b.parentNode,c)}}break}}});Ext.tree.MultiSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(a){this.selNodes=[];this.selMap={};this.addEvents("selectionchange");Ext.apply(this,a);Ext.tree.MultiSelectionModel.superclass.constructor.call(this)},init:function(a){this.tree=a;a.mon(a.getTreeEl(),"keydown",this.onKeyDown,this);a.on("click",this.onNodeClick,this)},onNodeClick:function(a,b){if(b.ctrlKey&&this.isSelected(a)){this.unselect(a)}else{this.select(a,b,b.ctrlKey)}},select:function(a,c,b){if(b!==true){this.clearSelections(true)}if(this.isSelected(a)){this.lastSelNode=a;return a}this.selNodes.push(a);this.selMap[a.id]=a;this.lastSelNode=a;a.ui.onSelectedChange(true);this.fireEvent("selectionchange",this,this.selNodes);return a},unselect:function(b){if(this.selMap[b.id]){b.ui.onSelectedChange(false);var c=this.selNodes;var a=c.indexOf(b);if(a!=-1){this.selNodes.splice(a,1)}delete this.selMap[b.id];this.fireEvent("selectionchange",this,this.selNodes)}},clearSelections:function(b){var d=this.selNodes;if(d.length>0){for(var c=0,a=d.length;c<a;c++){d[c].ui.onSelectedChange(false)}this.selNodes=[];this.selMap={};if(b!==true){this.fireEvent("selectionchange",this,this.selNodes)}}},isSelected:function(a){return this.selMap[a.id]?true:false},getSelectedNodes:function(){return this.selNodes.concat([])},onKeyDown:Ext.tree.DefaultSelectionModel.prototype.onKeyDown,selectNext:Ext.tree.DefaultSelectionModel.prototype.selectNext,selectPrevious:Ext.tree.DefaultSelectionModel.prototype.selectPrevious});Ext.data.Tree=Ext.extend(Ext.util.Observable,{constructor:function(a){this.nodeHash={};this.root=null;if(a){this.setRootNode(a)}this.addEvents("append","remove","move","insert","beforeappend","beforeremove","beforemove","beforeinsert");Ext.data.Tree.superclass.constructor.call(this)},pathSeparator:"/",proxyNodeEvent:function(){return this.fireEvent.apply(this,arguments)},getRootNode:function(){return this.root},setRootNode:function(a){this.root=a;a.ownerTree=this;a.isRoot=true;this.registerNode(a);return a},getNodeById:function(a){return this.nodeHash[a]},registerNode:function(a){this.nodeHash[a.id]=a},unregisterNode:function(a){delete this.nodeHash[a.id]},toString:function(){return"[Tree"+(this.id?" "+this.id:"")+"]"}});Ext.data.Node=Ext.extend(Ext.util.Observable,{constructor:function(a){this.attributes=a||{};this.leaf=this.attributes.leaf;this.id=this.attributes.id;if(!this.id){this.id=Ext.id(null,"xnode-");this.attributes.id=this.id}this.childNodes=[];this.parentNode=null;this.firstChild=null;this.lastChild=null;this.previousSibling=null;this.nextSibling=null;this.addEvents({append:true,remove:true,move:true,insert:true,beforeappend:true,beforeremove:true,beforemove:true,beforeinsert:true});this.listeners=this.attributes.listeners;Ext.data.Node.superclass.constructor.call(this)},fireEvent:function(b){if(Ext.data.Node.superclass.fireEvent.apply(this,arguments)===false){return false}var a=this.getOwnerTree();if(a){if(a.proxyNodeEvent.apply(a,arguments)===false){return false}}return true},isLeaf:function(){return this.leaf===true},setFirstChild:function(a){this.firstChild=a},setLastChild:function(a){this.lastChild=a},isLast:function(){return(!this.parentNode?true:this.parentNode.lastChild==this)},isFirst:function(){return(!this.parentNode?true:this.parentNode.firstChild==this)},hasChildNodes:function(){return !this.isLeaf()&&this.childNodes.length>0},isExpandable:function(){return this.attributes.expandable||this.hasChildNodes()},appendChild:function(e){var f=false;if(Ext.isArray(e)){f=e}else{if(arguments.length>1){f=arguments}}if(f){for(var d=0,a=f.length;d<a;d++){this.appendChild(f[d])}}else{if(this.fireEvent("beforeappend",this.ownerTree,this,e)===false){return false}var b=this.childNodes.length;var c=e.parentNode;if(c){if(e.fireEvent("beforemove",e.getOwnerTree(),e,c,this,b)===false){return false}c.removeChild(e)}b=this.childNodes.length;if(b===0){this.setFirstChild(e)}this.childNodes.push(e);e.parentNode=this;var g=this.childNodes[b-1];if(g){e.previousSibling=g;g.nextSibling=e}else{e.previousSibling=null}e.nextSibling=null;this.setLastChild(e);e.setOwnerTree(this.getOwnerTree());this.fireEvent("append",this.ownerTree,this,e,b);if(c){e.fireEvent("move",this.ownerTree,e,c,this,b)}return e}},removeChild:function(c,b){var a=this.childNodes.indexOf(c);if(a==-1){return false}if(this.fireEvent("beforeremove",this.ownerTree,this,c)===false){return false}this.childNodes.splice(a,1);if(c.previousSibling){c.previousSibling.nextSibling=c.nextSibling}if(c.nextSibling){c.nextSibling.previousSibling=c.previousSibling}if(this.firstChild==c){this.setFirstChild(c.nextSibling)}if(this.lastChild==c){this.setLastChild(c.previousSibling)}this.fireEvent("remove",this.ownerTree,this,c);if(b){c.destroy(true)}else{c.clear()}return c},clear:function(a){this.setOwnerTree(null,a);this.parentNode=this.previousSibling=this.nextSibling=null;if(a){this.firstChild=this.lastChild=null}},destroy:function(a){if(a===true){this.purgeListeners();this.clear(true);Ext.each(this.childNodes,function(b){b.destroy(true)});this.childNodes=null}else{this.remove(true)}},insertBefore:function(d,a){if(!a){return this.appendChild(d)}if(d==a){return false}if(this.fireEvent("beforeinsert",this.ownerTree,this,d,a)===false){return false}var b=this.childNodes.indexOf(a);var c=d.parentNode;var e=b;if(c==this&&this.childNodes.indexOf(d)<b){e--}if(c){if(d.fireEvent("beforemove",d.getOwnerTree(),d,c,this,b,a)===false){return false}c.removeChild(d)}if(e===0){this.setFirstChild(d)}this.childNodes.splice(e,0,d);d.parentNode=this;var f=this.childNodes[e-1];if(f){d.previousSibling=f;f.nextSibling=d}else{d.previousSibling=null}d.nextSibling=a;a.previousSibling=d;d.setOwnerTree(this.getOwnerTree());this.fireEvent("insert",this.ownerTree,this,d,a);if(c){d.fireEvent("move",this.ownerTree,d,c,this,e,a)}return d},remove:function(a){if(this.parentNode){this.parentNode.removeChild(this,a)}return this},removeAll:function(a){var c=this.childNodes,b;while((b=c[0])){this.removeChild(b,a)}return this},item:function(a){return this.childNodes[a]},replaceChild:function(a,c){var b=c?c.nextSibling:null;this.removeChild(c);this.insertBefore(a,b);return c},indexOf:function(a){return this.childNodes.indexOf(a)},getOwnerTree:function(){if(!this.ownerTree){var a=this;while(a){if(a.ownerTree){this.ownerTree=a.ownerTree;break}a=a.parentNode}}return this.ownerTree},getDepth:function(){var b=0;var a=this;while(a.parentNode){++b;a=a.parentNode}return b},setOwnerTree:function(a,b){if(a!=this.ownerTree){if(this.ownerTree){this.ownerTree.unregisterNode(this)}this.ownerTree=a;if(b!==true){Ext.each(this.childNodes,function(c){c.setOwnerTree(a)})}if(a){a.registerNode(this)}}},setId:function(b){if(b!==this.id){var a=this.ownerTree;if(a){a.unregisterNode(this)}this.id=this.attributes.id=b;if(a){a.registerNode(this)}this.onIdChange(b)}},onIdChange:Ext.emptyFn,getPath:function(c){c=c||"id";var e=this.parentNode;var a=[this.attributes[c]];while(e){a.unshift(e.attributes[c]);e=e.parentNode}var d=this.getOwnerTree().pathSeparator;return d+a.join(d)},bubble:function(c,b,a){var d=this;while(d){if(c.apply(b||d,a||[d])===false){break}d=d.parentNode}},cascade:function(f,e,b){if(f.apply(e||this,b||[this])!==false){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].cascade(f,e,b)}}},eachChild:function(f,e,b){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){if(f.apply(e||d[c],b||[d[c]])===false){break}}},findChild:function(b,c,a){return this.findChildBy(function(){return this.attributes[b]==c},null,a)},findChildBy:function(g,f,b){var e=this.childNodes,a=e.length,d=0,h,c;for(;d<a;d++){h=e[d];if(g.call(f||h,h)===true){return h}else{if(b){c=h.findChildBy(g,f,b);if(c!=null){return c}}}}return null},sort:function(e,d){var c=this.childNodes;var a=c.length;if(a>0){var f=d?function(){e.apply(d,arguments)}:e;c.sort(f);for(var b=0;b<a;b++){var g=c[b];g.previousSibling=c[b-1];g.nextSibling=c[b+1];if(b===0){this.setFirstChild(g)}if(b==a-1){this.setLastChild(g)}}}},contains:function(a){return a.isAncestor(this)},isAncestor:function(a){var b=this.parentNode;while(b){if(b==a){return true}b=b.parentNode}return false},toString:function(){return"[Node"+(this.id?" "+this.id:"")+"]"}});Ext.tree.TreeNode=Ext.extend(Ext.data.Node,{constructor:function(a){a=a||{};if(Ext.isString(a)){a={text:a}}this.childrenRendered=false;this.rendered=false;Ext.tree.TreeNode.superclass.constructor.call(this,a);this.expanded=a.expanded===true;this.isTarget=a.isTarget!==false;this.draggable=a.draggable!==false&&a.allowDrag!==false;this.allowChildren=a.allowChildren!==false&&a.allowDrop!==false;this.text=a.text;this.disabled=a.disabled===true;this.hidden=a.hidden===true;this.addEvents("textchange","beforeexpand","beforecollapse","expand","disabledchange","collapse","beforeclick","click","checkchange","beforedblclick","dblclick","contextmenu","beforechildrenrendered");var b=this.attributes.uiProvider||this.defaultUI||Ext.tree.TreeNodeUI;this.ui=new b(this)},preventHScroll:true,isExpanded:function(){return this.expanded},getUI:function(){return this.ui},getLoader:function(){var a;return this.loader||((a=this.getOwnerTree())&&a.loader?a.loader:(this.loader=new Ext.tree.TreeLoader()))},setFirstChild:function(a){var b=this.firstChild;Ext.tree.TreeNode.superclass.setFirstChild.call(this,a);if(this.childrenRendered&&b&&a!=b){b.renderIndent(true,true)}if(this.rendered){this.renderIndent(true,true)}},setLastChild:function(b){var a=this.lastChild;Ext.tree.TreeNode.superclass.setLastChild.call(this,b);if(this.childrenRendered&&a&&b!=a){a.renderIndent(true,true)}if(this.rendered){this.renderIndent(true,true)}},appendChild:function(b){if(!b.render&&!Ext.isArray(b)){b=this.getLoader().createNode(b)}var a=Ext.tree.TreeNode.superclass.appendChild.call(this,b);if(a&&this.childrenRendered){a.render()}this.ui.updateExpandIcon();return a},removeChild:function(b,a){this.ownerTree.getSelectionModel().unselect(b);Ext.tree.TreeNode.superclass.removeChild.apply(this,arguments);if(!a){var c=b.ui.rendered;if(c){b.ui.remove()}if(c&&this.childNodes.length<1){this.collapse(false,false)}else{this.ui.updateExpandIcon()}if(!this.firstChild&&!this.isHiddenRoot()){this.childrenRendered=false}}return b},insertBefore:function(c,a){if(!c.render){c=this.getLoader().createNode(c)}var b=Ext.tree.TreeNode.superclass.insertBefore.call(this,c,a);if(b&&a&&this.childrenRendered){c.render()}this.ui.updateExpandIcon();return b},setText:function(b){var a=this.text;this.text=this.attributes.text=b;if(this.rendered){this.ui.onTextChange(this,b,a)}this.fireEvent("textchange",this,b,a)},setIconCls:function(b){var a=this.attributes.iconCls;this.attributes.iconCls=b;if(this.rendered){this.ui.onIconClsChange(this,b,a)}},setTooltip:function(a,b){this.attributes.qtip=a;this.attributes.qtipTitle=b;if(this.rendered){this.ui.onTipChange(this,a,b)}},setIcon:function(a){this.attributes.icon=a;if(this.rendered){this.ui.onIconChange(this,a)}},setHref:function(a,b){this.attributes.href=a;this.attributes.hrefTarget=b;if(this.rendered){this.ui.onHrefChange(this,a,b)}},setCls:function(b){var a=this.attributes.cls;this.attributes.cls=b;if(this.rendered){this.ui.onClsChange(this,b,a)}},select:function(){var a=this.getOwnerTree();if(a){a.getSelectionModel().select(this)}},unselect:function(a){var b=this.getOwnerTree();if(b){b.getSelectionModel().unselect(this,a)}},isSelected:function(){var a=this.getOwnerTree();return a?a.getSelectionModel().isSelected(this):false},expand:function(a,c,d,b){if(!this.expanded){if(this.fireEvent("beforeexpand",this,a,c)===false){return}if(!this.childrenRendered){this.renderChildren()}this.expanded=true;if(!this.isHiddenRoot()&&(this.getOwnerTree().animate&&c!==false)||c){this.ui.animExpand(function(){this.fireEvent("expand",this);this.runCallback(d,b||this,[this]);if(a===true){this.expandChildNodes(true,true)}}.createDelegate(this));return}else{this.ui.expand();this.fireEvent("expand",this);this.runCallback(d,b||this,[this])}}else{this.runCallback(d,b||this,[this])}if(a===true){this.expandChildNodes(true)}},runCallback:function(a,c,b){if(Ext.isFunction(a)){a.apply(c,b)}},isHiddenRoot:function(){return this.isRoot&&!this.getOwnerTree().rootVisible},collapse:function(b,f,g,e){if(this.expanded&&!this.isHiddenRoot()){if(this.fireEvent("beforecollapse",this,b,f)===false){return}this.expanded=false;if((this.getOwnerTree().animate&&f!==false)||f){this.ui.animCollapse(function(){this.fireEvent("collapse",this);this.runCallback(g,e||this,[this]);if(b===true){this.collapseChildNodes(true)}}.createDelegate(this));return}else{this.ui.collapse();this.fireEvent("collapse",this);this.runCallback(g,e||this,[this])}}else{if(!this.expanded){this.runCallback(g,e||this,[this])}}if(b===true){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].collapse(true,false)}}},delayedExpand:function(a){if(!this.expandProcId){this.expandProcId=this.expand.defer(a,this)}},cancelExpand:function(){if(this.expandProcId){clearTimeout(this.expandProcId)}this.expandProcId=false},toggle:function(){if(this.expanded){this.collapse()}else{this.expand()}},ensureVisible:function(c,b){var a=this.getOwnerTree();a.expandPath(this.parentNode?this.parentNode.getPath():this.getPath(),false,function(){var d=a.getNodeById(this.id);a.getTreeEl().scrollChildIntoView(d.ui.anchor);this.runCallback(c,b||this,[this])}.createDelegate(this))},expandChildNodes:function(b,e){var d=this.childNodes,c,a=d.length;for(c=0;c<a;c++){d[c].expand(b,e)}},collapseChildNodes:function(b){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].collapse(b)}},disable:function(){this.disabled=true;this.unselect();if(this.rendered&&this.ui.onDisableChange){this.ui.onDisableChange(this,true)}this.fireEvent("disabledchange",this,true)},enable:function(){this.disabled=false;if(this.rendered&&this.ui.onDisableChange){this.ui.onDisableChange(this,false)}this.fireEvent("disabledchange",this,false)},renderChildren:function(b){if(b!==false){this.fireEvent("beforechildrenrendered",this)}var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].render(true)}this.childrenRendered=true},sort:function(e,d){Ext.tree.TreeNode.superclass.sort.apply(this,arguments);if(this.childrenRendered){var c=this.childNodes;for(var b=0,a=c.length;b<a;b++){c[b].render(true)}}},render:function(a){this.ui.render(a);if(!this.rendered){this.getOwnerTree().registerNode(this);this.rendered=true;if(this.expanded){this.expanded=false;this.expand(false,false)}}},renderIndent:function(b,e){if(e){this.ui.childIndent=null}this.ui.renderIndent();if(b===true&&this.childrenRendered){var d=this.childNodes;for(var c=0,a=d.length;c<a;c++){d[c].renderIndent(true,e)}}},beginUpdate:function(){this.childrenRendered=false},endUpdate:function(){if(this.expanded&&this.rendered){this.renderChildren()}},destroy:function(a){if(a===true){this.unselect(true)}Ext.tree.TreeNode.superclass.destroy.call(this,a);Ext.destroy(this.ui,this.loader);this.ui=this.loader=null},onIdChange:function(a){this.ui.onIdChange(a)}});Ext.tree.TreePanel.nodeTypes.node=Ext.tree.TreeNode;Ext.tree.AsyncTreeNode=function(a){this.loaded=a&&a.loaded===true;this.loading=false;Ext.tree.AsyncTreeNode.superclass.constructor.apply(this,arguments);this.addEvents("beforeload","load")};Ext.extend(Ext.tree.AsyncTreeNode,Ext.tree.TreeNode,{expand:function(b,e,h,c){if(this.loading){var g;var d=function(){if(!this.loading){clearInterval(g);this.expand(b,e,h,c)}}.createDelegate(this);g=setInterval(d,200);return}if(!this.loaded){if(this.fireEvent("beforeload",this)===false){return}this.loading=true;this.ui.beforeLoad(this);var a=this.loader||this.attributes.loader||this.getOwnerTree().getLoader();if(a){a.load(this,this.loadComplete.createDelegate(this,[b,e,h,c]),this);return}}Ext.tree.AsyncTreeNode.superclass.expand.call(this,b,e,h,c)},isLoading:function(){return this.loading},loadComplete:function(a,c,d,b){this.loading=false;this.loaded=true;this.ui.afterLoad(this);this.fireEvent("load",this);this.expand(a,c,d,b)},isLoaded:function(){return this.loaded},hasChildNodes:function(){if(!this.isLeaf()&&!this.loaded){return true}else{return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this)}},reload:function(b,a){this.collapse(false,false);while(this.firstChild){this.removeChild(this.firstChild).destroy()}this.childrenRendered=false;this.loaded=false;if(this.isHiddenRoot()){this.expanded=false}this.expand(false,false,b,a)}});Ext.tree.TreePanel.nodeTypes.async=Ext.tree.AsyncTreeNode;Ext.tree.TreeNodeUI=Ext.extend(Object,{constructor:function(a){Ext.apply(this,{node:a,rendered:false,animating:false,wasLeaf:true,ecc:"x-tree-ec-icon x-tree-elbow",emptyIcon:Ext.BLANK_IMAGE_URL})},removeChild:function(a){if(this.rendered){this.ctNode.removeChild(a.ui.getEl())}},beforeLoad:function(){this.addClass("x-tree-node-loading")},afterLoad:function(){this.removeClass("x-tree-node-loading")},onTextChange:function(b,c,a){if(this.rendered){this.textNode.innerHTML=c}},onIconClsChange:function(c,a,b){if(this.rendered){Ext.fly(this.iconNode).replaceClass(b,a)}},onIconChange:function(b,a){if(this.rendered){var c=Ext.isEmpty(a);this.iconNode.src=c?this.emptyIcon:a;Ext.fly(this.iconNode)[c?"removeClass":"addClass"]("x-tree-node-inline-icon")}},onTipChange:function(b,c,d){if(this.rendered){var a=Ext.isDefined(d);if(this.textNode.setAttributeNS){this.textNode.setAttributeNS("ext","qtip",c);if(a){this.textNode.setAttributeNS("ext","qtitle",d)}}else{this.textNode.setAttribute("ext:qtip",c);if(a){this.textNode.setAttribute("ext:qtitle",d)}}}},onHrefChange:function(b,a,c){if(this.rendered){this.anchor.href=this.getHref(a);if(Ext.isDefined(c)){this.anchor.target=c}}},onClsChange:function(c,a,b){if(this.rendered){Ext.fly(this.elNode).replaceClass(b,a)}},onDisableChange:function(a,b){this.disabled=b;if(this.checkbox){this.checkbox.disabled=b}this[b?"addClass":"removeClass"]("x-tree-node-disabled")},onSelectedChange:function(a){if(a){this.focus();this.addClass("x-tree-selected")}else{this.removeClass("x-tree-selected")}},onMove:function(a,g,e,f,d,b){this.childIndent=null;if(this.rendered){var h=f.ui.getContainer();if(!h){this.holder=document.createElement("div");this.holder.appendChild(this.wrap);return}var c=b?b.ui.getEl():null;if(c){h.insertBefore(this.wrap,c)}else{h.appendChild(this.wrap)}this.node.renderIndent(true,e!=f)}},addClass:function(a){if(this.elNode){Ext.fly(this.elNode).addClass(a)}},removeClass:function(a){if(this.elNode){Ext.fly(this.elNode).removeClass(a)}},remove:function(){if(this.rendered){this.holder=document.createElement("div");this.holder.appendChild(this.wrap)}},fireEvent:function(){return this.node.fireEvent.apply(this.node,arguments)},initEvents:function(){this.node.on("move",this.onMove,this);if(this.node.disabled){this.onDisableChange(this.node,true)}if(this.node.hidden){this.hide()}var b=this.node.getOwnerTree();var a=b.enableDD||b.enableDrag||b.enableDrop;if(a&&(!this.node.isRoot||b.rootVisible)){Ext.dd.Registry.register(this.elNode,{node:this.node,handles:this.getDDHandles(),isHandle:false})}},getDDHandles:function(){return[this.iconNode,this.textNode,this.elNode]},hide:function(){this.node.hidden=true;if(this.wrap){this.wrap.style.display="none"}},show:function(){this.node.hidden=false;if(this.wrap){this.wrap.style.display=""}},onContextMenu:function(a){if(this.node.hasListener("contextmenu")||this.node.getOwnerTree().hasListener("contextmenu")){a.preventDefault();this.focus();this.fireEvent("contextmenu",this.node,a)}},onClick:function(c){if(this.dropping){c.stopEvent();return}if(this.fireEvent("beforeclick",this.node,c)!==false){var b=c.getTarget("a");if(!this.disabled&&this.node.attributes.href&&b){this.fireEvent("click",this.node,c);return}else{if(b&&c.ctrlKey){c.stopEvent()}}c.preventDefault();if(this.disabled){return}if(this.node.attributes.singleClickExpand&&!this.animating&&this.node.isExpandable()){this.node.toggle()}this.fireEvent("click",this.node,c)}else{c.stopEvent()}},onDblClick:function(a){a.preventDefault();if(this.disabled){return}if(this.fireEvent("beforedblclick",this.node,a)!==false){if(this.checkbox){this.toggleCheck()}if(!this.animating&&this.node.isExpandable()){this.node.toggle()}this.fireEvent("dblclick",this.node,a)}},onOver:function(a){this.addClass("x-tree-node-over")},onOut:function(a){this.removeClass("x-tree-node-over")},onCheckChange:function(){var a=this.checkbox.checked;this.checkbox.defaultChecked=a;this.node.attributes.checked=a;this.fireEvent("checkchange",this.node,a)},ecClick:function(a){if(!this.animating&&this.node.isExpandable()){this.node.toggle()}},startDrop:function(){this.dropping=true},endDrop:function(){setTimeout(function(){this.dropping=false}.createDelegate(this),50)},expand:function(){this.updateExpandIcon();this.ctNode.style.display=""},focus:function(){if(!this.node.preventHScroll){try{this.anchor.focus()}catch(c){}}else{try{var b=this.node.getOwnerTree().getTreeEl().dom;var a=b.scrollLeft;this.anchor.focus();b.scrollLeft=a}catch(c){}}},toggleCheck:function(b){var a=this.checkbox;if(a){a.checked=(b===undefined?!a.checked:b);this.onCheckChange()}},blur:function(){try{this.anchor.blur()}catch(a){}},animExpand:function(b){var a=Ext.get(this.ctNode);a.stopFx();if(!this.node.isExpandable()){this.updateExpandIcon();this.ctNode.style.display="";Ext.callback(b);return}this.animating=true;this.updateExpandIcon();a.slideIn("t",{callback:function(){this.animating=false;Ext.callback(b)},scope:this,duration:this.node.ownerTree.duration||0.25})},highlight:function(){var a=this.node.getOwnerTree();Ext.fly(this.wrap).highlight(a.hlColor||"C3DAF9",{endColor:a.hlBaseColor})},collapse:function(){this.updateExpandIcon();this.ctNode.style.display="none"},animCollapse:function(b){var a=Ext.get(this.ctNode);a.enableDisplayMode("block");a.stopFx();this.animating=true;this.updateExpandIcon();a.slideOut("t",{callback:function(){this.animating=false;Ext.callback(b)},scope:this,duration:this.node.ownerTree.duration||0.25})},getContainer:function(){return this.ctNode},getEl:function(){return this.wrap},appendDDGhost:function(a){a.appendChild(this.elNode.cloneNode(true))},getDDRepairXY:function(){return Ext.lib.Dom.getXY(this.iconNode)},onRender:function(){this.render()},render:function(c){var e=this.node,b=e.attributes;var d=e.parentNode?e.parentNode.ui.getContainer():e.ownerTree.innerCt.dom;if(!this.rendered){this.rendered=true;this.renderElements(e,b,d,c);if(b.qtip){this.onTipChange(e,b.qtip,b.qtipTitle)}else{if(b.qtipCfg){b.qtipCfg.target=Ext.id(this.textNode);Ext.QuickTips.register(b.qtipCfg)}}this.initEvents();if(!this.node.expanded){this.updateExpandIcon(true)}}else{if(c===true){d.appendChild(this.wrap)}}},renderElements:function(e,j,i,k){this.indentMarkup=e.parentNode?e.parentNode.ui.getChildIndent():"";var f=Ext.isBoolean(j.checked),b,c=this.getHref(j.href),d=['<li class="x-tree-node"><div ext:tree-node-id="',e.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ',j.cls,'" unselectable="on">','<span class="x-tree-node-indent">',this.indentMarkup,"</span>",'<img alt="" src="',this.emptyIcon,'" class="x-tree-ec-icon x-tree-elbow" />','<img alt="" src="',j.icon||this.emptyIcon,'" class="x-tree-node-icon',(j.icon?" x-tree-node-inline-icon":""),(j.iconCls?" "+j.iconCls:""),'" unselectable="on" />',f?('<input class="x-tree-node-cb" type="checkbox" '+(j.checked?'checked="checked" />':"/>")):"",'<a hidefocus="on" class="x-tree-node-anchor" href="',c,'" tabIndex="1" ',j.hrefTarget?' target="'+j.hrefTarget+'"':"",'><span unselectable="on">',e.text,"</span></a></div>",'<ul class="x-tree-node-ct" style="display:none;"></ul>',"</li>"].join("");if(k!==true&&e.nextSibling&&(b=e.nextSibling.ui.getEl())){this.wrap=Ext.DomHelper.insertHtml("beforeBegin",b,d)}else{this.wrap=Ext.DomHelper.insertHtml("beforeEnd",i,d)}this.elNode=this.wrap.childNodes[0];this.ctNode=this.wrap.childNodes[1];var h=this.elNode.childNodes;this.indentNode=h[0];this.ecNode=h[1];this.iconNode=h[2];var g=3;if(f){this.checkbox=h[3];this.checkbox.defaultChecked=this.checkbox.checked;g++}this.anchor=h[g];this.textNode=h[g].firstChild},getHref:function(a){return Ext.isEmpty(a)?(Ext.isGecko?"":"#"):a},getAnchor:function(){return this.anchor},getTextEl:function(){return this.textNode},getIconEl:function(){return this.iconNode},isChecked:function(){return this.checkbox?this.checkbox.checked:false},updateExpandIcon:function(){if(this.rendered){var f=this.node,d,c,a=f.isLast()?"x-tree-elbow-end":"x-tree-elbow",e=f.hasChildNodes();if(e||f.attributes.expandable){if(f.expanded){a+="-minus";d="x-tree-node-collapsed";c="x-tree-node-expanded"}else{a+="-plus";d="x-tree-node-expanded";c="x-tree-node-collapsed"}if(this.wasLeaf){this.removeClass("x-tree-node-leaf");this.wasLeaf=false}if(this.c1!=d||this.c2!=c){Ext.fly(this.elNode).replaceClass(d,c);this.c1=d;this.c2=c}}else{if(!this.wasLeaf){Ext.fly(this.elNode).replaceClass("x-tree-node-expanded","x-tree-node-collapsed");delete this.c1;delete this.c2;this.wasLeaf=true}}var b="x-tree-ec-icon "+a;if(this.ecc!=b){this.ecNode.className=b;this.ecc=b}}},onIdChange:function(a){if(this.rendered){this.elNode.setAttribute("ext:tree-node-id",a)}},getChildIndent:function(){if(!this.childIndent){var a=[],b=this.node;while(b){if(!b.isRoot||(b.isRoot&&b.ownerTree.rootVisible)){if(!b.isLast()){a.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />')}else{a.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />')}}b=b.parentNode}this.childIndent=a.join("")}return this.childIndent},renderIndent:function(){if(this.rendered){var a="",b=this.node.parentNode;if(b){a=b.ui.getChildIndent()}if(this.indentMarkup!=a){this.indentNode.innerHTML=a;this.indentMarkup=a}this.updateExpandIcon()}},destroy:function(){if(this.elNode){Ext.dd.Registry.unregister(this.elNode.id)}Ext.each(["textnode","anchor","checkbox","indentNode","ecNode","iconNode","elNode","ctNode","wrap","holder"],function(a){if(this[a]){Ext.fly(this[a]).remove();delete this[a]}},this);delete this.node}});Ext.tree.RootTreeNodeUI=Ext.extend(Ext.tree.TreeNodeUI,{render:function(){if(!this.rendered){var a=this.node.ownerTree.innerCt.dom;this.node.expanded=true;a.innerHTML='<div class="x-tree-root-node"></div>';this.wrap=this.ctNode=a.firstChild}},collapse:Ext.emptyFn,expand:Ext.emptyFn});Ext.tree.TreeLoader=function(a){this.baseParams={};Ext.apply(this,a);this.addEvents("beforeload","load","loadexception");Ext.tree.TreeLoader.superclass.constructor.call(this);if(Ext.isString(this.paramOrder)){this.paramOrder=this.paramOrder.split(/[\s,|]/)}};Ext.extend(Ext.tree.TreeLoader,Ext.util.Observable,{uiProviders:{},clearOnLoad:true,paramOrder:undefined,paramsAsHash:false,nodeParameter:"node",directFn:undefined,load:function(b,c,a){if(this.clearOnLoad){while(b.firstChild){b.removeChild(b.firstChild)}}if(this.doPreload(b)){this.runCallback(c,a||b,[b])}else{if(this.directFn||this.dataUrl||this.url){this.requestData(b,c,a||b)}}},doPreload:function(d){if(d.attributes.children){if(d.childNodes.length<1){var c=d.attributes.children;d.beginUpdate();for(var b=0,a=c.length;b<a;b++){var e=d.appendChild(this.createNode(c[b]));if(this.preloadChildren){this.doPreload(e)}}d.endUpdate()}return true}return false},getParams:function(f){var e=Ext.apply({},this.baseParams),g=this.nodeParameter,b=this.paramOrder;g&&(e[g]=f.id);if(this.directFn){var c=[f.id];if(b){if(g&&b.indexOf(g)>-1){c=[]}for(var d=0,a=b.length;d<a;d++){c.push(e[b[d]])}}else{if(this.paramsAsHash){c=[e]}}return c}else{return e}},requestData:function(c,d,b){if(this.fireEvent("beforeload",this,c,d)!==false){if(this.directFn){var a=this.getParams(c);a.push(this.processDirectResponse.createDelegate(this,[{callback:d,node:c,scope:b}],true));this.directFn.apply(window,a)}else{this.transId=Ext.Ajax.request({method:this.requestMethod,url:this.dataUrl||this.url,success:this.handleResponse,failure:this.handleFailure,scope:this,argument:{callback:d,node:c,scope:b},params:this.getParams(c)})}}else{this.runCallback(d,b||c,[])}},processDirectResponse:function(a,b,c){if(b.status){this.handleResponse({responseData:Ext.isArray(a)?a:null,responseText:a,argument:c})}else{this.handleFailure({argument:c})}},runCallback:function(a,c,b){if(Ext.isFunction(a)){a.apply(c,b)}},isLoading:function(){return !!this.transId},abort:function(){if(this.isLoading()){Ext.Ajax.abort(this.transId)}},createNode:function(attr){if(this.baseAttrs){Ext.applyIf(attr,this.baseAttrs)}if(this.applyLoader!==false&&!attr.loader){attr.loader=this}if(Ext.isString(attr.uiProvider)){attr.uiProvider=this.uiProviders[attr.uiProvider]||eval(attr.uiProvider)}if(attr.nodeType){return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr)}else{return attr.leaf?new Ext.tree.TreeNode(attr):new Ext.tree.AsyncTreeNode(attr)}},processResponse:function(d,c,j,k){var l=d.responseText;try{var a=d.responseData||Ext.decode(l);c.beginUpdate();for(var f=0,g=a.length;f<g;f++){var b=this.createNode(a[f]);if(b){c.appendChild(b)}}c.endUpdate();this.runCallback(j,k||c,[c])}catch(h){this.handleFailure(d)}},handleResponse:function(c){this.transId=false;var b=c.argument;this.processResponse(c,b.node,b.callback,b.scope);this.fireEvent("load",this,b.node,c)},handleFailure:function(c){this.transId=false;var b=c.argument;this.fireEvent("loadexception",this,b.node,c);this.runCallback(b.callback,b.scope||b.node,[b.node])},destroy:function(){this.abort();this.purgeListeners()}});Ext.tree.TreeFilter=function(a,b){this.tree=a;this.filtered={};Ext.apply(this,b)};Ext.tree.TreeFilter.prototype={clearBlank:false,reverse:false,autoClear:false,remove:false,filter:function(d,a,b){a=a||"text";var c;if(typeof d=="string"){var e=d.length;if(e==0&&this.clearBlank){this.clear();return}d=d.toLowerCase();c=function(f){return f.attributes[a].substr(0,e).toLowerCase()==d}}else{if(d.exec){c=function(f){return d.test(f.attributes[a])}}else{throw"Illegal filter type, must be string or regex"}}this.filterBy(c,null,b)},filterBy:function(d,c,b){b=b||this.tree.root;if(this.autoClear){this.clear()}var a=this.filtered,i=this.reverse;var e=function(j){if(j==b){return true}if(a[j.id]){return false}var f=d.call(c||j,j);if(!f||i){a[j.id]=j;j.ui.hide();return false}return true};b.cascade(e);if(this.remove){for(var h in a){if(typeof h!="function"){var g=a[h];if(g&&g.parentNode){g.parentNode.removeChild(g)}}}}},clear:function(){var b=this.tree;var a=this.filtered;for(var d in a){if(typeof d!="function"){var c=a[d];if(c){c.ui.show()}}}this.filtered={}}};Ext.tree.TreeSorter=Ext.extend(Object,{constructor:function(a,c){Ext.apply(this,c);a.on({scope:this,beforechildrenrendered:this.doSort,append:this.updateSort,insert:this.updateSort,textchange:this.updateSortParent});var e=this.dir&&this.dir.toLowerCase()=="desc",h=this.property||"text",d=this.sortType,g=this.folderSort,b=this.caseSensitive===true,f=this.leafAttr||"leaf";if(Ext.isString(d)){d=Ext.data.SortTypes[d]}this.sortFn=function(n,l){var j=n.attributes,i=l.attributes;if(g){if(j[f]&&!i[f]){return 1}if(!j[f]&&i[f]){return -1}}var m=j[h],k=i[h],p=d?d(m):(b?m:m.toUpperCase()),o=d?d(k):(b?k:k.toUpperCase());if(p<o){return e?1:-1}else{if(p>o){return e?-1:1}}return 0}},doSort:function(a){a.sort(this.sortFn)},updateSort:function(a,b){if(b.childrenRendered){this.doSort.defer(1,this,[b])}},updateSortParent:function(a){var b=a.parentNode;if(b&&b.childrenRendered){this.doSort.defer(1,this,[b])}}});if(Ext.dd.DropZone){Ext.tree.TreeDropZone=function(a,b){this.allowParentInsert=b.allowParentInsert||false;this.allowContainerDrop=b.allowContainerDrop||false;this.appendOnly=b.appendOnly||false;Ext.tree.TreeDropZone.superclass.constructor.call(this,a.getTreeEl(),b);this.tree=a;this.dragOverData={};this.lastInsertClass="x-tree-no-status"};Ext.extend(Ext.tree.TreeDropZone,Ext.dd.DropZone,{ddGroup:"TreeDD",expandDelay:1000,expandNode:function(a){if(a.hasChildNodes()&&!a.isExpanded()){a.expand(false,null,this.triggerCacheRefresh.createDelegate(this))}},queueExpand:function(a){this.expandProcId=this.expandNode.defer(this.expandDelay,this,[a])},cancelExpand:function(){if(this.expandProcId){clearTimeout(this.expandProcId);this.expandProcId=false}},isValidDropPoint:function(a,j,h,d,c){if(!a||!c){return false}var f=a.node;var g=c.node;if(!(f&&f.isTarget&&j)){return false}if(j=="append"&&f.allowChildren===false){return false}if((j=="above"||j=="below")&&(f.parentNode&&f.parentNode.allowChildren===false)){return false}if(g&&(f==g||g.contains(f))){return false}var b=this.dragOverData;b.tree=this.tree;b.target=f;b.data=c;b.point=j;b.source=h;b.rawEvent=d;b.dropNode=g;b.cancel=false;var i=this.tree.fireEvent("nodedragover",b);return b.cancel===false&&i!==false},getDropPoint:function(g,f,k){var l=f.node;if(l.isRoot){return l.allowChildren!==false?"append":false}var c=f.ddel;var m=Ext.lib.Dom.getY(c),i=m+c.offsetHeight;var h=Ext.lib.Event.getPageY(g);var j=l.allowChildren===false||l.isLeaf();if(this.appendOnly||l.parentNode.allowChildren===false){return j?false:"append"}var d=false;if(!this.allowParentInsert){d=l.hasChildNodes()&&l.isExpanded()}var a=(i-m)/(j?2:3);if(h>=m&&h<(m+a)){return"above"}else{if(!d&&(j||h>=i-a&&h<=i)){return"below"}else{return"append"}}},onNodeEnter:function(d,a,c,b){this.cancelExpand()},onContainerOver:function(a,c,b){if(this.allowContainerDrop&&this.isValidDropPoint({ddel:this.tree.getRootNode().ui.elNode,node:this.tree.getRootNode()},"append",a,c,b)){return this.dropAllowed}return this.dropNotAllowed},onNodeOver:function(b,h,g,f){var j=this.getDropPoint(g,b,h);var c=b.node;if(!this.expandProcId&&j=="append"&&c.hasChildNodes()&&!b.node.isExpanded()){this.queueExpand(c)}else{if(j!="append"){this.cancelExpand()}}var d=this.dropNotAllowed;if(this.isValidDropPoint(b,j,h,g,f)){if(j){var a=b.ddel;var i;if(j=="above"){d=b.node.isFirst()?"x-tree-drop-ok-above":"x-tree-drop-ok-between";i="x-tree-drag-insert-above"}else{if(j=="below"){d=b.node.isLast()?"x-tree-drop-ok-below":"x-tree-drop-ok-between";i="x-tree-drag-insert-below"}else{d="x-tree-drop-ok-append";i="x-tree-drag-append"}}if(this.lastInsertClass!=i){Ext.fly(a).replaceClass(this.lastInsertClass,i);this.lastInsertClass=i}}}return d},onNodeOut:function(d,a,c,b){this.cancelExpand();this.removeDropIndicators(d)},onNodeDrop:function(h,b,g,d){var a=this.getDropPoint(g,h,b);var f=h.node;f.ui.startDrop();if(!this.isValidDropPoint(h,a,b,g,d)){f.ui.endDrop();return false}var c=d.node||(b.getTreeNode?b.getTreeNode(d,f,a,g):null);return this.processDrop(f,d,a,b,g,c)},onContainerDrop:function(a,f,c){if(this.allowContainerDrop&&this.isValidDropPoint({ddel:this.tree.getRootNode().ui.elNode,node:this.tree.getRootNode()},"append",a,f,c)){var d=this.tree.getRootNode();d.ui.startDrop();var b=c.node||(a.getTreeNode?a.getTreeNode(c,d,"append",f):null);return this.processDrop(d,c,"append",a,f,b)}return false},processDrop:function(i,g,b,a,h,d){var f={tree:this.tree,target:i,data:g,point:b,source:a,rawEvent:h,dropNode:d,cancel:!d,dropStatus:false};var c=this.tree.fireEvent("beforenodedrop",f);if(c===false||f.cancel===true||!f.dropNode){i.ui.endDrop();return f.dropStatus}i=f.target;if(b=="append"&&!i.isExpanded()){i.expand(false,null,function(){this.completeDrop(f)}.createDelegate(this))}else{this.completeDrop(f)}return true},completeDrop:function(g){var d=g.dropNode,e=g.point,c=g.target;if(!Ext.isArray(d)){d=[d]}var f;for(var b=0,a=d.length;b<a;b++){f=d[b];if(e=="above"){c.parentNode.insertBefore(f,c)}else{if(e=="below"){c.parentNode.insertBefore(f,c.nextSibling)}else{c.appendChild(f)}}}f.ui.focus();if(Ext.enableFx&&this.tree.hlDrop){f.ui.highlight()}c.ui.endDrop();this.tree.fireEvent("nodedrop",g)},afterNodeMoved:function(a,c,f,d,b){if(Ext.enableFx&&this.tree.hlDrop){b.ui.focus();b.ui.highlight()}this.tree.fireEvent("nodedrop",this.tree,d,c,a,f)},getTree:function(){return this.tree},removeDropIndicators:function(b){if(b&&b.ddel){var a=b.ddel;Ext.fly(a).removeClass(["x-tree-drag-insert-above","x-tree-drag-insert-below","x-tree-drag-append"]);this.lastInsertClass="_noclass"}},beforeDragDrop:function(b,a,c){this.cancelExpand();return true},afterRepair:function(a){if(a&&Ext.enableFx){a.node.ui.highlight()}this.hideProxy()}})}if(Ext.dd.DragZone){Ext.tree.TreeDragZone=function(a,b){Ext.tree.TreeDragZone.superclass.constructor.call(this,a.innerCt,b);this.tree=a};Ext.extend(Ext.tree.TreeDragZone,Ext.dd.DragZone,{ddGroup:"TreeDD",onBeforeDrag:function(a,b){var c=a.node;return c&&c.draggable&&!c.disabled},onInitDrag:function(b){var a=this.dragData;this.tree.getSelectionModel().select(a.node);this.tree.eventModel.disable();this.proxy.update("");a.node.ui.appendDDGhost(this.proxy.ghost.dom);this.tree.fireEvent("startdrag",this.tree,a.node,b)},getRepairXY:function(b,a){return a.node.ui.getDDRepairXY()},onEndDrag:function(a,b){this.tree.eventModel.enable.defer(100,this.tree.eventModel);this.tree.fireEvent("enddrag",this.tree,a.node,b)},onValidDrop:function(a,b,c){this.tree.fireEvent("dragdrop",this.tree,this.dragData.node,a,b);this.hideProxy()},beforeInvalidDrop:function(a,c){var b=this.tree.getSelectionModel();b.clearSelections();b.select(this.dragData.node)},afterRepair:function(){if(Ext.enableFx&&this.tree.hlDrop){Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor||"c3daf9")}this.dragging=false}})}Ext.tree.TreeEditor=function(a,c,b){c=c||{};var d=c.events?c:new Ext.form.TextField(c);Ext.tree.TreeEditor.superclass.constructor.call(this,d,b);this.tree=a;if(!a.rendered){a.on("render",this.initEditor,this)}else{this.initEditor(a)}};Ext.extend(Ext.tree.TreeEditor,Ext.Editor,{alignment:"l-l",autoSize:false,hideEl:false,cls:"x-small-editor x-tree-editor",shim:false,shadow:"frame",maxWidth:250,editDelay:350,initEditor:function(a){a.on({scope:this,beforeclick:this.beforeNodeClick,dblclick:this.onNodeDblClick});this.on({scope:this,complete:this.updateNode,beforestartedit:this.fitToTree,specialkey:this.onSpecialKey});this.on("startedit",this.bindScroll,this,{delay:10})},fitToTree:function(b,c){var e=this.tree.getTreeEl().dom,d=c.dom;if(e.scrollLeft>d.offsetLeft){e.scrollLeft=d.offsetLeft}var a=Math.min(this.maxWidth,(e.clientWidth>20?e.clientWidth:e.offsetWidth)-Math.max(0,d.offsetLeft-e.scrollLeft)-5);this.setSize(a,"")},triggerEdit:function(a,c){this.completeEdit();if(a.attributes.editable!==false){this.editNode=a;if(this.tree.autoScroll){Ext.fly(a.ui.getEl()).scrollIntoView(this.tree.body)}var b=a.text||"";if(!Ext.isGecko&&Ext.isEmpty(a.text)){a.setText("&#160;")}this.autoEditTimer=this.startEdit.defer(this.editDelay,this,[a.ui.textNode,b]);return false}},bindScroll:function(){this.tree.getTreeEl().on("scroll",this.cancelEdit,this)},beforeNodeClick:function(a,b){clearTimeout(this.autoEditTimer);if(this.tree.getSelectionModel().isSelected(a)){b.stopEvent();return this.triggerEdit(a)}},onNodeDblClick:function(a,b){clearTimeout(this.autoEditTimer)},updateNode:function(a,b){this.tree.getTreeEl().un("scroll",this.cancelEdit,this);this.editNode.setText(b)},onHide:function(){Ext.tree.TreeEditor.superclass.onHide.call(this);if(this.editNode){this.editNode.ui.focus.defer(50,this.editNode.ui)}},onSpecialKey:function(c,b){var a=b.getKey();if(a==b.ESC){b.stopEvent();this.cancelEdit()}else{if(a==b.ENTER&&!b.hasModifier()){b.stopEvent();this.completeEdit()}}},onDestroy:function(){clearTimeout(this.autoEditTimer);Ext.tree.TreeEditor.superclass.onDestroy.call(this);var a=this.tree;a.un("beforeclick",this.beforeNodeClick,this);a.un("dblclick",this.onNodeDblClick,this)}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.data.JsonWriter=Ext.extend(Ext.data.DataWriter,{encode:true,encodeDelete:false,constructor:function(a){Ext.data.JsonWriter.superclass.constructor.call(this,a)},render:function(c,d,b){if(this.encode===true){Ext.apply(c,d);c[this.meta.root]=Ext.encode(b)}else{var a=Ext.apply({},d);a[this.meta.root]=b;c.jsonData=a}},createRecord:function(a){return this.toHash(a)},updateRecord:function(a){return this.toHash(a)},destroyRecord:function(b){if(this.encodeDelete){var a={};a[this.meta.idProperty]=b.id;return a}else{return b.id}}});Ext.data.JsonReader=function(a,b){a=a||{};Ext.applyIf(a,{idProperty:"id",successProperty:"success",totalProperty:"total"});Ext.data.JsonReader.superclass.constructor.call(this,a,b||a.fields)};Ext.extend(Ext.data.JsonReader,Ext.data.DataReader,{read:function(a){var b=a.responseText;var c=Ext.decode(b);if(!c){throw {message:"JsonReader.read: Json object not found"}}return this.readRecords(c)},readResponse:function(e,b){var g=(b.responseText!==undefined)?Ext.decode(b.responseText):b;if(!g){throw new Ext.data.JsonReader.Error("response")}var a=this.getRoot(g),f=this.getSuccess(g);if(f&&e===Ext.data.Api.actions.create){var d=Ext.isDefined(a);if(d&&Ext.isEmpty(a)){throw new Ext.data.JsonReader.Error("root-empty",this.meta.root)}else{if(!d){throw new Ext.data.JsonReader.Error("root-undefined-response",this.meta.root)}}}var c=new Ext.data.Response({action:e,success:f,data:(a)?this.extractData(a,false):[],message:this.getMessage(g),raw:g});if(Ext.isEmpty(c.success)){throw new Ext.data.JsonReader.Error("successProperty-response",this.meta.successProperty)}return c},readRecords:function(a){this.jsonData=a;if(a.metaData){this.onMetaChange(a.metaData)}var m=this.meta,h=this.recordType,b=h.prototype.fields,l=b.items,i=b.length,j;var g=this.getRoot(a),e=g.length,d=e,k=true;if(m.totalProperty){j=parseInt(this.getTotal(a),10);if(!isNaN(j)){d=j}}if(m.successProperty){j=this.getSuccess(a);if(j===false||j==="false"){k=false}}return{success:k,records:this.extractData(g,true),totalRecords:d}},buildExtractors:function(){if(this.ef){return}var l=this.meta,h=this.recordType,e=h.prototype.fields,k=e.items,j=e.length;if(l.totalProperty){this.getTotal=this.createAccessor(l.totalProperty)}if(l.successProperty){this.getSuccess=this.createAccessor(l.successProperty)}if(l.messageProperty){this.getMessage=this.createAccessor(l.messageProperty)}this.getRoot=l.root?this.createAccessor(l.root):function(f){return f};if(l.id||l.idProperty){var d=this.createAccessor(l.id||l.idProperty);this.getId=function(g){var f=d(g);return(f===undefined||f==="")?null:f}}else{this.getId=function(){return null}}var c=[];for(var b=0;b<j;b++){e=k[b];var a=(e.mapping!==undefined&&e.mapping!==null)?e.mapping:e.name;c.push(this.createAccessor(a))}this.ef=c},simpleAccess:function(b,a){return b[a]},createAccessor:function(){var a=/[\[\.]/;return function(c){if(Ext.isEmpty(c)){return Ext.emptyFn}if(Ext.isFunction(c)){return c}var b=String(c).search(a);if(b>=0){return new Function("obj","return obj"+(b>0?".":"")+c)}return function(d){return d[c]}}}(),extractValues:function(h,d,a){var g,c={};for(var e=0;e<a;e++){g=d[e];var b=this.ef[e](h);c[g.name]=g.convert((b!==undefined)?b:g.defaultValue,h)}return c}});Ext.data.JsonReader.Error=Ext.extend(Ext.Error,{constructor:function(b,a){this.arg=a;Ext.Error.call(this,b)},name:"Ext.data.JsonReader"});Ext.apply(Ext.data.JsonReader.Error.prototype,{lang:{response:"An error occurred while json-decoding your server response","successProperty-response":'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',"root-undefined-config":'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',"idProperty-undefined":'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',"root-empty":'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'}});Ext.data.ArrayReader=Ext.extend(Ext.data.JsonReader,{readRecords:function(r){this.arrayData=r;var l=this.meta,d=l?Ext.num(l.idIndex,l.id):null,b=this.recordType,q=b.prototype.fields,z=[],e=true,g;var u=this.getRoot(r);for(var y=0,A=u.length;y<A;y++){var t=u[y],a={},p=((d||d===0)&&t[d]!==undefined&&t[d]!==""?t[d]:null);for(var x=0,m=q.length;x<m;x++){var B=q.items[x],w=B.mapping!==undefined&&B.mapping!==null?B.mapping:x;g=t[w]!==undefined?t[w]:B.defaultValue;g=B.convert(g,t);a[B.name]=g}var c=new b(a,p);c.json=t;z[z.length]=c}var h=z.length;if(l.totalProperty){g=parseInt(this.getTotal(r),10);if(!isNaN(g)){h=g}}if(l.successProperty){g=this.getSuccess(r);if(g===false||g==="false"){e=false}}return{success:e,records:z,totalRecords:h}}});Ext.data.ArrayStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.ArrayStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.ArrayReader(a)}))},loadData:function(e,b){if(this.expandData===true){var d=[];for(var c=0,a=e.length;c<a;c++){d[d.length]=[e[c]]}e=d}Ext.data.ArrayStore.superclass.loadData.call(this,e,b)}});Ext.reg("arraystore",Ext.data.ArrayStore);Ext.data.SimpleStore=Ext.data.ArrayStore;Ext.reg("simplestore",Ext.data.SimpleStore);Ext.data.JsonStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.JsonStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.JsonReader(a)}))}});Ext.reg("jsonstore",Ext.data.JsonStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.History=(function(){var e,c;var j=false;var d;function f(){var k=location.href,l=k.indexOf("#"),m=l>=0?k.substr(l+1):null;if(Ext.isGecko){m=decodeURIComponent(m)}return m}function a(){c.value=d}function g(k){d=k;Ext.History.fireEvent("change",k)}function h(l){var k=['<html><body><div id="state">',Ext.util.Format.htmlEncode(l),"</div></body></html>"].join("");try{var n=e.contentWindow.document;n.open();n.write(k);n.close();return true}catch(m){return false}}function b(){if(!e.contentWindow||!e.contentWindow.document){setTimeout(b,10);return}var n=e.contentWindow.document;var l=n.getElementById("state");var k=l?l.innerText:null;var m=f();setInterval(function(){n=e.contentWindow.document;l=n.getElementById("state");var p=l?l.innerText:null;var o=f();if(p!==k){k=p;g(k);location.hash=k;m=k;a()}else{if(o!==m){m=o;h(o)}}},50);j=true;Ext.History.fireEvent("ready",Ext.History)}function i(){d=c.value?c.value:f();if(Ext.isIE){b()}else{var k=f();setInterval(function(){var l=f();if(l!==k){k=l;g(k);a()}},50);j=true;Ext.History.fireEvent("ready",Ext.History)}}return{fieldId:"x-history-field",iframeId:"x-history-frame",events:{},init:function(l,k){if(j){Ext.callback(l,k,[this]);return}if(!Ext.isReady){Ext.onReady(function(){Ext.History.init(l,k)});return}c=Ext.getDom(Ext.History.fieldId);if(Ext.isIE){e=Ext.getDom(Ext.History.iframeId)}this.addEvents("ready","change");if(l){this.on("ready",l,k,{single:true})}i()},add:function(k,l){if(l!==false){if(this.getToken()==k){return true}}if(Ext.isIE){return h(k)}else{location.hash=k;return true}},back:function(){history.go(-1)},forward:function(){history.go(1)},getToken:function(){return j?d:f()}}})();Ext.apply(Ext.History,new Ext.util.Observable());
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Resizable=Ext.extend(Ext.util.Observable,{constructor:function(d,e){this.el=Ext.get(d);if(e&&e.wrap){e.resizeChild=this.el;this.el=this.el.wrap(typeof e.wrap=="object"?e.wrap:{cls:"xresizable-wrap"});this.el.id=this.el.dom.id=e.resizeChild.id+"-rzwrap";this.el.setStyle("overflow","hidden");this.el.setPositioning(e.resizeChild.getPositioning());e.resizeChild.clearPositioning();if(!e.width||!e.height){var f=e.resizeChild.getSize();this.el.setSize(f.width,f.height)}if(e.pinned&&!e.adjustments){e.adjustments="auto"}}this.proxy=this.el.createProxy({tag:"div",cls:"x-resizable-proxy",id:this.el.id+"-rzproxy"},Ext.getBody());this.proxy.unselectable();this.proxy.enableDisplayMode("block");Ext.apply(this,e);if(this.pinned){this.disableTrackOver=true;this.el.addClass("x-resizable-pinned")}var j=this.el.getStyle("position");if(j!="absolute"&&j!="fixed"){this.el.setStyle("position","relative")}if(!this.handles){this.handles="s,e,se";if(this.multiDirectional){this.handles+=",n,w"}}if(this.handles=="all"){this.handles="n s e w ne nw se sw"}var n=this.handles.split(/\s*?[,;]\s*?| /);var c=Ext.Resizable.positions;for(var h=0,k=n.length;h<k;h++){if(n[h]&&c[n[h]]){var m=c[n[h]];this[m]=new Ext.Resizable.Handle(this,m,this.disableTrackOver,this.transparent,this.handleCls)}}this.corner=this.southeast;if(this.handles.indexOf("n")!=-1||this.handles.indexOf("w")!=-1){this.updateBox=true}this.activeHandle=null;if(this.resizeChild){if(typeof this.resizeChild=="boolean"){this.resizeChild=Ext.get(this.el.dom.firstChild,true)}else{this.resizeChild=Ext.get(this.resizeChild,true)}}if(this.adjustments=="auto"){var b=this.resizeChild;var l=this.west,g=this.east,a=this.north,n=this.south;if(b&&(l||a)){b.position("relative");b.setLeft(l?l.el.getWidth():0);b.setTop(a?a.el.getHeight():0)}this.adjustments=[(g?-g.el.getWidth():0)+(l?-l.el.getWidth():0),(a?-a.el.getHeight():0)+(n?-n.el.getHeight():0)-1]}if(this.draggable){this.dd=this.dynamic?this.el.initDD(null):this.el.initDDProxy(null,{dragElId:this.proxy.id});this.dd.setHandleElId(this.resizeChild?this.resizeChild.id:this.el.id);if(this.constrainTo){this.dd.constrainTo(this.constrainTo)}}this.addEvents("beforeresize","resize");if(this.width!==null&&this.height!==null){this.resizeTo(this.width,this.height)}else{this.updateChildSize()}if(Ext.isIE){this.el.dom.style.zoom=1}Ext.Resizable.superclass.constructor.call(this)},adjustments:[0,0],animate:false,disableTrackOver:false,draggable:false,duration:0.35,dynamic:false,easing:"easeOutStrong",enabled:true,handles:false,multiDirectional:false,height:null,width:null,heightIncrement:0,widthIncrement:0,minHeight:5,minWidth:5,maxHeight:10000,maxWidth:10000,minX:0,minY:0,pinned:false,preserveRatio:false,resizeChild:false,transparent:false,resizeTo:function(b,a){this.el.setSize(b,a);this.updateChildSize();this.fireEvent("resize",this,b,a,null)},startSizing:function(c,b){this.fireEvent("beforeresize",this,c);if(this.enabled){if(!this.overlay){this.overlay=this.el.createProxy({tag:"div",cls:"x-resizable-overlay",html:"&#160;"},Ext.getBody());this.overlay.unselectable();this.overlay.enableDisplayMode("block");this.overlay.on({scope:this,mousemove:this.onMouseMove,mouseup:this.onMouseUp})}this.overlay.setStyle("cursor",b.el.getStyle("cursor"));this.resizing=true;this.startBox=this.el.getBox();this.startPoint=c.getXY();this.offsets=[(this.startBox.x+this.startBox.width)-this.startPoint[0],(this.startBox.y+this.startBox.height)-this.startPoint[1]];this.overlay.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.overlay.show();if(this.constrainTo){var a=Ext.get(this.constrainTo);this.resizeRegion=a.getRegion().adjust(a.getFrameWidth("t"),a.getFrameWidth("l"),-a.getFrameWidth("b"),-a.getFrameWidth("r"))}this.proxy.setStyle("visibility","hidden");this.proxy.show();this.proxy.setBox(this.startBox);if(!this.dynamic){this.proxy.setStyle("visibility","visible")}}},onMouseDown:function(a,b){if(this.enabled){b.stopEvent();this.activeHandle=a;this.startSizing(b,a)}},onMouseUp:function(b){this.activeHandle=null;var a=this.resizeElement();this.resizing=false;this.handleOut();this.overlay.hide();this.proxy.hide();this.fireEvent("resize",this,a.width,a.height,b)},updateChildSize:function(){if(this.resizeChild){var d=this.el;var e=this.resizeChild;var c=this.adjustments;if(d.dom.offsetWidth){var a=d.getSize(true);e.setSize(a.width+c[0],a.height+c[1])}if(Ext.isIE){setTimeout(function(){if(d.dom.offsetWidth){var f=d.getSize(true);e.setSize(f.width+c[0],f.height+c[1])}},10)}}},snap:function(c,e,b){if(!e||!c){return c}var d=c;var a=c%e;if(a>0){if(a>(e/2)){d=c+(e-a)}else{d=c-a}}return Math.max(b,d)},resizeElement:function(){var a=this.proxy.getBox();if(this.updateBox){this.el.setBox(a,false,this.animate,this.duration,null,this.easing)}else{this.el.setSize(a.width,a.height,this.animate,this.duration,null,this.easing)}this.updateChildSize();if(!this.dynamic){this.proxy.hide()}if(this.draggable&&this.constrainTo){this.dd.resetConstraints();this.dd.constrainTo(this.constrainTo)}return a},constrain:function(b,c,a,d){if(b-c<a){c=b-a}else{if(b-c>d){c=b-d}}return c},onMouseMove:function(v){if(this.enabled&&this.activeHandle){try{if(this.resizeRegion&&!this.resizeRegion.contains(v.getPoint())){return}var s=this.curSize||this.startBox,k=this.startBox.x,j=this.startBox.y,c=k,b=j,l=s.width,t=s.height,d=l,n=t,m=this.minWidth,z=this.minHeight,r=this.maxWidth,C=this.maxHeight,g=this.widthIncrement,a=this.heightIncrement,A=v.getXY(),q=-(this.startPoint[0]-Math.max(this.minX,A[0])),o=-(this.startPoint[1]-Math.max(this.minY,A[1])),i=this.activeHandle.position,D,f;switch(i){case"east":l+=q;l=Math.min(Math.max(m,l),r);break;case"south":t+=o;t=Math.min(Math.max(z,t),C);break;case"southeast":l+=q;t+=o;l=Math.min(Math.max(m,l),r);t=Math.min(Math.max(z,t),C);break;case"north":o=this.constrain(t,o,z,C);j+=o;t-=o;break;case"west":q=this.constrain(l,q,m,r);k+=q;l-=q;break;case"northeast":l+=q;l=Math.min(Math.max(m,l),r);o=this.constrain(t,o,z,C);j+=o;t-=o;break;case"northwest":q=this.constrain(l,q,m,r);o=this.constrain(t,o,z,C);j+=o;t-=o;k+=q;l-=q;break;case"southwest":q=this.constrain(l,q,m,r);t+=o;t=Math.min(Math.max(z,t),C);k+=q;l-=q;break}var p=this.snap(l,g,m);var B=this.snap(t,a,z);if(p!=l||B!=t){switch(i){case"northeast":j-=B-t;break;case"north":j-=B-t;break;case"southwest":k-=p-l;break;case"west":k-=p-l;break;case"northwest":k-=p-l;j-=B-t;break}l=p;t=B}if(this.preserveRatio){switch(i){case"southeast":case"east":t=n*(l/d);t=Math.min(Math.max(z,t),C);l=d*(t/n);break;case"south":l=d*(t/n);l=Math.min(Math.max(m,l),r);t=n*(l/d);break;case"northeast":l=d*(t/n);l=Math.min(Math.max(m,l),r);t=n*(l/d);break;case"north":D=l;l=d*(t/n);l=Math.min(Math.max(m,l),r);t=n*(l/d);k+=(D-l)/2;break;case"southwest":t=n*(l/d);t=Math.min(Math.max(z,t),C);D=l;l=d*(t/n);k+=D-l;break;case"west":f=t;t=n*(l/d);t=Math.min(Math.max(z,t),C);j+=(f-t)/2;D=l;l=d*(t/n);k+=D-l;break;case"northwest":D=l;f=t;t=n*(l/d);t=Math.min(Math.max(z,t),C);l=d*(t/n);j+=f-t;k+=D-l;break}}this.proxy.setBounds(k,j,l,t);if(this.dynamic){this.resizeElement()}}catch(u){}}},handleOver:function(){if(this.enabled){this.el.addClass("x-resizable-over")}},handleOut:function(){if(!this.resizing){this.el.removeClass("x-resizable-over")}},getEl:function(){return this.el},getResizeChild:function(){return this.resizeChild},destroy:function(b){Ext.destroy(this.dd,this.overlay,this.proxy);this.overlay=null;this.proxy=null;var c=Ext.Resizable.positions;for(var a in c){if(typeof c[a]!="function"&&this[c[a]]){this[c[a]].destroy()}}if(b){this.el.update("");Ext.destroy(this.el);this.el=null}this.purgeListeners()},syncHandleHeight:function(){var a=this.el.getHeight(true);if(this.west){this.west.el.setHeight(a)}if(this.east){this.east.el.setHeight(a)}}});Ext.Resizable.positions={n:"north",s:"south",e:"east",w:"west",se:"southeast",sw:"southwest",nw:"northwest",ne:"northeast"};Ext.Resizable.Handle=Ext.extend(Object,{constructor:function(d,f,c,e,a){if(!this.tpl){var b=Ext.DomHelper.createTemplate({tag:"div",cls:"x-resizable-handle x-resizable-handle-{0}"});b.compile();Ext.Resizable.Handle.prototype.tpl=b}this.position=f;this.rz=d;this.el=this.tpl.append(d.el.dom,[this.position],true);this.el.unselectable();if(e){this.el.setOpacity(0)}if(!Ext.isEmpty(a)){this.el.addClass(a)}this.el.on("mousedown",this.onMouseDown,this);if(!c){this.el.on({scope:this,mouseover:this.onMouseOver,mouseout:this.onMouseOut})}},afterResize:function(a){},onMouseDown:function(a){this.rz.onMouseDown(this,a)},onMouseOver:function(a){this.rz.handleOver(this,a)},onMouseOut:function(a){this.rz.handleOut(this,a)},destroy:function(){Ext.destroy(this.el);this.el=null}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/state.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/state.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/state.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.state.Provider=Ext.extend(Ext.util.Observable,{constructor:function(){this.addEvents("statechange");this.state={};Ext.state.Provider.superclass.constructor.call(this)},get:function(b,a){return typeof this.state[b]=="undefined"?a:this.state[b]},clear:function(a){delete this.state[a];this.fireEvent("statechange",this,a,null)},set:function(a,b){this.state[a]=b;this.fireEvent("statechange",this,a,b)},decodeValue:function(b){var e=/^(a|n|d|b|s|o|e)\:(.*)$/,g=e.exec(unescape(b)),d,c,a,f;if(!g||!g[1]){return}c=g[1];a=g[2];switch(c){case"e":return null;case"n":return parseFloat(a);case"d":return new Date(Date.parse(a));case"b":return(a=="1");case"a":d=[];if(a!=""){Ext.each(a.split("^"),function(h){d.push(this.decodeValue(h))},this)}return d;case"o":d={};if(a!=""){Ext.each(a.split("^"),function(h){f=h.split("=");d[f[0]]=this.decodeValue(f[1])},this)}return d;default:return a}},encodeValue:function(c){var b,f="",e=0,a,d;if(c==null){return"e:1"}else{if(typeof c=="number"){b="n:"+c}else{if(typeof c=="boolean"){b="b:"+(c?"1":"0")}else{if(Ext.isDate(c)){b="d:"+c.toGMTString()}else{if(Ext.isArray(c)){for(a=c.length;e<a;e++){f+=this.encodeValue(c[e]);if(e!=a-1){f+="^"}}b="a:"+f}else{if(typeof c=="object"){for(d in c){if(typeof c[d]!="function"&&c[d]!==undefined){f+=d+"="+this.encodeValue(c[d])+"^"}}b="o:"+f.substring(0,f.length-1)}else{b="s:"+c}}}}}}return escape(b)}});Ext.state.Manager=function(){var a=new Ext.state.Provider();return{setProvider:function(b){a=b},get:function(c,b){return a.get(c,b)},set:function(b,c){a.set(b,c)},clear:function(b){a.clear(b)},getProvider:function(){return a}}}();Ext.state.CookieProvider=Ext.extend(Ext.state.Provider,{constructor:function(a){Ext.state.CookieProvider.superclass.constructor.call(this);this.path="/";this.expires=new Date(new Date().getTime()+(1000*60*60*24*7));this.domain=null;this.secure=false;Ext.apply(this,a);this.state=this.readCookies()},set:function(a,b){if(typeof b=="undefined"||b===null){this.clear(a);return}this.setCookie(a,b);Ext.state.CookieProvider.superclass.set.call(this,a,b)},clear:function(a){this.clearCookie(a);Ext.state.CookieProvider.superclass.clear.call(this,a)},readCookies:function(){var d={},g=document.cookie+";",b=/\s?(.*?)=(.*?);/g,f,a,e;while((f=b.exec(g))!=null){a=f[1];e=f[2];if(a&&a.substring(0,3)=="ys-"){d[a.substr(3)]=this.decodeValue(e)}}return d},setCookie:function(a,b){document.cookie="ys-"+a+"="+this.encodeValue(b)+((this.expires==null)?"":("; expires="+this.expires.toGMTString()))+((this.path==null)?"":("; path="+this.path))+((this.domain==null)?"":("; domain="+this.domain))+((this.secure==true)?"; secure":"")},clearCookie:function(a){document.cookie="ys-"+a+"=null; expires=Thu, 01-Jan-70 00:00:01 GMT"+((this.path==null)?"":("; path="+this.path))+((this.domain==null)?"":("; domain="+this.domain))+((this.secure==true)?"; secure":"")}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips-debug.js	(revision 76)
@@ -0,0 +1,1146 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Tip
+ * @extends Ext.Panel
+ * @xtype tip
+ * This is the base class for {@link Ext.QuickTip} and {@link Ext.Tooltip} that provides the basic layout and
+ * positioning that all tip-based classes require. This class can be used directly for simple, statically-positioned
+ * tips that are displayed programmatically, or it can be extended to provide custom tip implementations.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.Tip = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Boolean} closable True to render a close tool button into the tooltip header (defaults to false).
+     */
+    /**
+     * @cfg {Number} width
+     * Width in pixels of the tip (defaults to auto).  Width will be ignored if it exceeds the bounds of
+     * {@link #minWidth} or {@link #maxWidth}.  The maximum supported value is 500.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the tip in pixels (defaults to 40).
+     */
+    minWidth : 40,
+    /**
+     * @cfg {Number} maxWidth The maximum width of the tip in pixels (defaults to 300).  The maximum supported value is 500.
+     */
+    maxWidth : 300,
+    /**
+     * @cfg {Boolean/String} shadow True or "sides" for the default effect, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "sides").
+     */
+    shadow : "sides",
+    /**
+     * @cfg {String} defaultAlign <b>Experimental</b>. The default {@link Ext.Element#alignTo} anchor position value
+     * for this tip relative to its element of origin (defaults to "tl-bl?").
+     */
+    defaultAlign : "tl-bl?",
+    autoRender: true,
+    quickShowInterval : 250,
+
+    // private panel overrides
+    frame:true,
+    hidden:true,
+    baseCls: 'x-tip',
+    floating:{shadow:true,shim:true,useDisplay:true,constrain:false},
+    autoHeight:true,
+
+    closeAction: 'hide',
+
+    // private
+    initComponent : function(){
+        Ext.Tip.superclass.initComponent.call(this);
+        if(this.closable && !this.title){
+            this.elements += ',header';
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Tip.superclass.afterRender.call(this);
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction],
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Shows this tip at the specified XY position.  Example usage:
+     * <pre><code>
+// Show the tip at x:50 and y:100
+tip.showAt([50,100]);
+</code></pre>
+     * @param {Array} xy An array containing the x and y coordinates
+     */
+    showAt : function(xy){
+        Ext.Tip.superclass.show.call(this);
+        if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){
+            this.doAutoWidth();
+        }
+        if(this.constrainPosition){
+            xy = this.el.adjustForConstraints(xy);
+        }
+        this.setPagePosition(xy[0], xy[1]);
+    },
+
+    // protected
+    doAutoWidth : function(adjust){
+        adjust = adjust || 0;
+        var bw = this.body.getTextWidth();
+        if(this.title){
+            bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));
+        }
+        bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr") + adjust;
+        this.setWidth(bw.constrain(this.minWidth, this.maxWidth));
+        
+        // IE7 repaint bug on initial show
+        if(Ext.isIE7 && !this.repainted){
+            this.el.repaint();
+            this.repainted = true;
+        }
+    },
+
+    /**
+     * <b>Experimental</b>. Shows this tip at a position relative to another element using a standard {@link Ext.Element#alignTo}
+     * anchor position value.  Example usage:
+     * <pre><code>
+// Show the tip at the default position ('tl-br?')
+tip.showBy('my-el');
+
+// Show the tip's top-left corner anchored to the element's top-right corner
+tip.showBy('my-el', 'tl-tr');
+</code></pre>
+     * @param {Mixed} el An HTMLElement, Ext.Element or string id of the target element to align to
+     * @param {String} position (optional) A valid {@link Ext.Element#alignTo} anchor position (defaults to 'tl-br?' or
+     * {@link #defaultAlign} if specified).
+     */
+    showBy : function(el, pos){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));
+    },
+
+    initDraggable : function(){
+        this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);
+        this.header.addClass('x-tip-draggable');
+    }
+});
+
+Ext.reg('tip', Ext.Tip);
+
+// private - custom Tip DD implementation
+Ext.Tip.DD = function(tip, config){
+    Ext.apply(this, config);
+    this.tip = tip;
+    Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);
+    this.setHandleElId(tip.header.id);
+    this.scroll = false;
+};
+
+Ext.extend(Ext.Tip.DD, Ext.dd.DD, {
+    moveOnly:true,
+    scroll:false,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        this.tip.el.disableShadow();
+    },
+    endDrag : function(e){
+        this.tip.el.enableShadow(true);
+    }
+});/**
+ * @class Ext.ToolTip
+ * @extends Ext.Tip
+ * A standard tooltip implementation for providing additional information when hovering over a target element.
+ * @xtype tooltip
+ * @constructor
+ * Create a new Tooltip
+ * @param {Object} config The configuration options
+ */
+Ext.ToolTip = Ext.extend(Ext.Tip, {
+    /**
+     * When a Tooltip is configured with the <code>{@link #delegate}</code>
+     * option to cause selected child elements of the <code>{@link #target}</code>
+     * Element to each trigger a seperate show event, this property is set to
+     * the DOM element which triggered the show.
+     * @type DOMElement
+     * @property triggerElement
+     */
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to monitor
+     * for mouseover events to trigger showing this ToolTip.
+     */
+    /**
+     * @cfg {Boolean} autoHide True to automatically hide the tooltip after the
+     * mouse exits the target element or after the <code>{@link #dismissDelay}</code>
+     * has expired if set (defaults to true).  If <code>{@link closable} = true</code>
+     * a close tool button will be rendered into the tooltip header.
+     */
+    /**
+     * @cfg {Number} showDelay Delay in milliseconds before the tooltip displays
+     * after the mouse enters the target element (defaults to 500)
+     */
+    showDelay : 500,
+    /**
+     * @cfg {Number} hideDelay Delay in milliseconds after the mouse exits the
+     * target element but before the tooltip actually hides (defaults to 200).
+     * Set to 0 for the tooltip to hide immediately.
+     */
+    hideDelay : 200,
+    /**
+     * @cfg {Number} dismissDelay Delay in milliseconds before the tooltip
+     * automatically hides (defaults to 5000). To disable automatic hiding, set
+     * dismissDelay = 0.
+     */
+    dismissDelay : 5000,
+    /**
+     * @cfg {Array} mouseOffset An XY offset from the mouse position where the
+     * tooltip should be shown (defaults to [15,18]).
+     */
+    /**
+     * @cfg {Boolean} trackMouse True to have the tooltip follow the mouse as it
+     * moves over the target element (defaults to false).
+     */
+    trackMouse : false,
+    /**
+     * @cfg {Boolean} anchorToTarget True to anchor the tooltip to the target
+     * element, false to anchor it relative to the mouse coordinates (defaults
+     * to true).  When <code>anchorToTarget</code> is true, use
+     * <code>{@link #defaultAlign}</code> to control tooltip alignment to the
+     * target element.  When <code>anchorToTarget</code> is false, use
+     * <code>{@link #anchorPosition}</code> instead to control alignment.
+     */
+    anchorToTarget : true,
+    /**
+     * @cfg {Number} anchorOffset A numeric pixel value used to offset the
+     * default position of the anchor arrow (defaults to 0).  When the anchor
+     * position is on the top or bottom of the tooltip, <code>anchorOffset</code>
+     * will be used as a horizontal offset.  Likewise, when the anchor position
+     * is on the left or right side, <code>anchorOffset</code> will be used as
+     * a vertical offset.
+     */
+    anchorOffset : 0,
+    /**
+     * @cfg {String} delegate <p>Optional. A {@link Ext.DomQuery DomQuery}
+     * selector which allows selection of individual elements within the
+     * <code>{@link #target}</code> element to trigger showing and hiding the
+     * ToolTip as the mouse moves within the target.</p>
+     * <p>When specified, the child element of the target which caused a show
+     * event is placed into the <code>{@link #triggerElement}</code> property
+     * before the ToolTip is shown.</p>
+     * <p>This may be useful when a Component has regular, repeating elements
+     * in it, each of which need a Tooltip which contains information specific
+     * to that element. For example:</p><pre><code>
+var myGrid = new Ext.grid.gridPanel(gridConfig);
+myGrid.on('render', function(grid) {
+    var store = grid.getStore();  // Capture the Store.
+    var view = grid.getView();    // Capture the GridView.
+    myGrid.tip = new Ext.ToolTip({
+        target: view.mainBody,    // The overall target element.
+        delegate: '.x-grid3-row', // Each grid row causes its own seperate show and hide.
+        trackMouse: true,         // Moving within the row should not hide the tip.
+        renderTo: document.body,  // Render immediately so that tip.body can be
+                                  //  referenced prior to the first show.
+        listeners: {              // Change content dynamically depending on which element
+                                  //  triggered the show.
+            beforeshow: function updateTipBody(tip) {
+                var rowIndex = view.findRowIndex(tip.triggerElement);
+                tip.body.dom.innerHTML = 'Over Record ID ' + store.getAt(rowIndex).id;
+            }
+        }
+    });
+});
+     *</code></pre>
+     */
+
+    // private
+    targetCounter : 0,
+
+    constrainPosition : false,
+
+    // private
+    initComponent : function(){
+        Ext.ToolTip.superclass.initComponent.call(this);
+        this.lastActive = new Date();
+        this.initTarget(this.target);
+        this.origAnchor = this.anchor;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.ToolTip.superclass.onRender.call(this, ct, position);
+        this.anchorCls = 'x-tip-anchor-' + this.getAnchorPosition();
+        this.anchorEl = this.el.createChild({
+            cls: 'x-tip-anchor ' + this.anchorCls
+        });
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ToolTip.superclass.afterRender.call(this);
+        this.anchorEl.setStyle('z-index', this.el.getZIndex() + 1).setVisibilityMode(Ext.Element.DISPLAY);
+    },
+
+    /**
+     * Binds this ToolTip to the specified element. The tooltip will be displayed when the mouse moves over the element.
+     * @param {Mixed} t The Element, HtmlElement, or ID of an element to bind to
+     */
+    initTarget : function(target){
+        var t;
+        if((t = Ext.get(target))){
+            if(this.target){
+                var tg = Ext.get(this.target);
+                this.mun(tg, 'mouseover', this.onTargetOver, this);
+                this.mun(tg, 'mouseout', this.onTargetOut, this);
+                this.mun(tg, 'mousemove', this.onMouseMove, this);
+            }
+            this.mon(t, {
+                mouseover: this.onTargetOver,
+                mouseout: this.onTargetOut,
+                mousemove: this.onMouseMove,
+                scope: this
+            });
+            this.target = t;
+        }
+        if(this.anchor){
+            this.anchorTarget = this.target;
+        }
+    },
+
+    // private
+    onMouseMove : function(e){
+        var t = this.delegate ? e.getTarget(this.delegate) : this.triggerElement = true;
+        if (t) {
+            this.targetXY = e.getXY();
+            if (t === this.triggerElement) {
+                if(!this.hidden && this.trackMouse){
+                    this.setPagePosition(this.getTargetXY());
+                }
+            } else {
+                this.hide();
+                this.lastActive = new Date(0);
+                this.onTargetOver(e);
+            }
+        } else if (!this.closable && this.isVisible()) {
+            this.hide();
+        }
+    },
+
+    // private
+    getTargetXY : function(){
+        if(this.delegate){
+            this.anchorTarget = this.triggerElement;
+        }
+        if(this.anchor){
+            this.targetCounter++;
+            var offsets = this.getOffsets(),
+                xy = (this.anchorToTarget && !this.trackMouse) ? this.el.getAlignToXY(this.anchorTarget, this.getAnchorAlign()) : this.targetXY,
+                dw = Ext.lib.Dom.getViewWidth() - 5,
+                dh = Ext.lib.Dom.getViewHeight() - 5,
+                de = document.documentElement,
+                bd = document.body,
+                scrollX = (de.scrollLeft || bd.scrollLeft || 0) + 5,
+                scrollY = (de.scrollTop || bd.scrollTop || 0) + 5,
+                axy = [xy[0] + offsets[0], xy[1] + offsets[1]],
+                sz = this.getSize();
+                
+            this.anchorEl.removeClass(this.anchorCls);
+
+            if(this.targetCounter < 2){
+                if(axy[0] < scrollX){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'l-r';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'left';
+                    return this.getTargetXY();
+                }
+                if(axy[0]+sz.width > dw){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'r-l';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'right';
+                    return this.getTargetXY();
+                }
+                if(axy[1] < scrollY){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 't-b';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'top';
+                    return this.getTargetXY();
+                }
+                if(axy[1]+sz.height > dh){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'b-t';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'bottom';
+                    return this.getTargetXY();
+                }
+            }
+
+            this.anchorCls = 'x-tip-anchor-'+this.getAnchorPosition();
+            this.anchorEl.addClass(this.anchorCls);
+            this.targetCounter = 0;
+            return axy;
+        }else{
+            var mouseOffset = this.getMouseOffset();
+            return [this.targetXY[0]+mouseOffset[0], this.targetXY[1]+mouseOffset[1]];
+        }
+    },
+
+    getMouseOffset : function(){
+        var offset = this.anchor ? [0,0] : [15,18];
+        if(this.mouseOffset){
+            offset[0] += this.mouseOffset[0];
+            offset[1] += this.mouseOffset[1];
+        }
+        return offset;
+    },
+
+    // private
+    getAnchorPosition : function(){
+        if(this.anchor){
+            this.tipAnchor = this.anchor.charAt(0);
+        }else{
+            var m = this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+            if(!m){
+               throw 'AnchorTip.defaultAlign is invalid';
+            }
+            this.tipAnchor = m[1].charAt(0);
+        }
+
+        switch(this.tipAnchor){
+            case 't': return 'top';
+            case 'b': return 'bottom';
+            case 'r': return 'right';
+        }
+        return 'left';
+    },
+
+    // private
+    getAnchorAlign : function(){
+        switch(this.anchor){
+            case 'top'  : return 'tl-bl';
+            case 'left' : return 'tl-tr';
+            case 'right': return 'tr-tl';
+            default     : return 'bl-tl';
+        }
+    },
+
+    // private
+    getOffsets : function(){
+        var offsets, 
+            ap = this.getAnchorPosition().charAt(0);
+        if(this.anchorToTarget && !this.trackMouse){
+            switch(ap){
+                case 't':
+                    offsets = [0, 9];
+                    break;
+                case 'b':
+                    offsets = [0, -13];
+                    break;
+                case 'r':
+                    offsets = [-13, 0];
+                    break;
+                default:
+                    offsets = [9, 0];
+                    break;
+            }
+        }else{
+            switch(ap){
+                case 't':
+                    offsets = [-15-this.anchorOffset, 30];
+                    break;
+                case 'b':
+                    offsets = [-19-this.anchorOffset, -13-this.el.dom.offsetHeight];
+                    break;
+                case 'r':
+                    offsets = [-15-this.el.dom.offsetWidth, -13-this.anchorOffset];
+                    break;
+                default:
+                    offsets = [25, -13-this.anchorOffset];
+                    break;
+            }
+        }
+        var mouseOffset = this.getMouseOffset();
+        offsets[0] += mouseOffset[0];
+        offsets[1] += mouseOffset[1];
+
+        return offsets;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        var t = e.getTarget(this.delegate);
+        if (t) {
+            this.triggerElement = t;
+            this.clearTimer('hide');
+            this.targetXY = e.getXY();
+            this.delayShow();
+        }
+    },
+
+    // private
+    delayShow : function(){
+        if(this.hidden && !this.showTimer){
+            if(this.lastActive.getElapsed() < this.quickShowInterval){
+                this.show();
+            }else{
+                this.showTimer = this.show.defer(this.showDelay, this);
+            }
+        }else if(!this.hidden && this.autoHide !== false){
+            this.show();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // private
+    delayHide : function(){
+        if(!this.hidden && !this.hideTimer){
+            this.hideTimer = this.hide.defer(this.hideDelay, this);
+        }
+    },
+
+    /**
+     * Hides this tooltip if visible.
+     */
+    hide: function(){
+        this.clearTimer('dismiss');
+        this.lastActive = new Date();
+        if(this.anchorEl){
+            this.anchorEl.hide();
+        }
+        Ext.ToolTip.superclass.hide.call(this);
+        delete this.triggerElement;
+    },
+
+    /**
+     * Shows this tooltip at the current event target XY position.
+     */
+    show : function(){
+        if(this.anchor){
+            // pre-show it off screen so that the el will have dimensions
+            // for positioning calcs when getting xy next
+            this.showAt([-1000,-1000]);
+            this.origConstrainPosition = this.constrainPosition;
+            this.constrainPosition = false;
+            this.anchor = this.origAnchor;
+        }
+        this.showAt(this.getTargetXY());
+
+        if(this.anchor){
+            this.anchorEl.show();
+            this.syncAnchor();
+            this.constrainPosition = this.origConstrainPosition;
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        this.lastActive = new Date();
+        this.clearTimers();
+        Ext.ToolTip.superclass.showAt.call(this, xy);
+        if(this.dismissDelay && this.autoHide !== false){
+            this.dismissTimer = this.hide.defer(this.dismissDelay, this);
+        }
+        if(this.anchor && !this.anchorEl.isVisible()){
+            this.syncAnchor();
+            this.anchorEl.show();
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // private
+    syncAnchor : function(){
+        var anchorPos, targetPos, offset;
+        switch(this.tipAnchor.charAt(0)){
+            case 't':
+                anchorPos = 'b';
+                targetPos = 'tl';
+                offset = [20+this.anchorOffset, 2];
+                break;
+            case 'r':
+                anchorPos = 'l';
+                targetPos = 'tr';
+                offset = [-2, 11+this.anchorOffset];
+                break;
+            case 'b':
+                anchorPos = 't';
+                targetPos = 'bl';
+                offset = [20+this.anchorOffset, -2];
+                break;
+            default:
+                anchorPos = 'r';
+                targetPos = 'tl';
+                offset = [2, 11+this.anchorOffset];
+                break;
+        }
+        this.anchorEl.alignTo(this.el, anchorPos+'-'+targetPos, offset);
+    },
+
+    // private
+    setPagePosition : function(x, y){
+        Ext.ToolTip.superclass.setPagePosition.call(this, x, y);
+        if(this.anchor){
+            this.syncAnchor();
+        }
+    },
+
+    // private
+    clearTimer : function(name){
+        name = name + 'Timer';
+        clearTimeout(this[name]);
+        delete this[name];
+    },
+
+    // private
+    clearTimers : function(){
+        this.clearTimer('show');
+        this.clearTimer('dismiss');
+        this.clearTimer('hide');
+    },
+
+    // private
+    onShow : function(){
+        Ext.ToolTip.superclass.onShow.call(this);
+        Ext.getDoc().on('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onHide : function(){
+        Ext.ToolTip.superclass.onHide.call(this);
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onDocMouseDown : function(e){
+        if(this.autoHide !== true && !this.closable && !e.within(this.el.dom)){
+            this.disable();
+            this.doEnable.defer(100, this);
+        }
+    },
+    
+    // private
+    doEnable : function(){
+        if(!this.isDestroyed){
+            this.enable();
+        }
+    },
+
+    // private
+    onDisable : function(){
+        this.clearTimers();
+        this.hide();
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        if(this.constrainPosition){
+            var ay = this.targetXY[1], h = this.getSize().height;
+            if(y <= ay && (y+h) >= ay){
+                y = ay-h-5;
+            }
+        }
+        return {x : x, y: y};
+    },
+    
+    beforeDestroy : function(){
+        this.clearTimers();
+        Ext.destroy(this.anchorEl);
+        delete this.anchorEl;
+        delete this.target;
+        delete this.anchorTarget;
+        delete this.triggerElement;
+        Ext.ToolTip.superclass.beforeDestroy.call(this);    
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+        Ext.ToolTip.superclass.onDestroy.call(this);
+    }
+});
+
+Ext.reg('tooltip', Ext.ToolTip);/**
+ * @class Ext.QuickTip
+ * @extends Ext.ToolTip
+ * @xtype quicktip
+ * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
+ * {@link Ext.QuickTips} instance.  See the QuickTips class header for additional usage details and examples.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.QuickTip = Ext.extend(Ext.ToolTip, {
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
+     */
+    /**
+     * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
+     */
+    interceptTitles : false,
+
+    // private
+    tagConfig : {
+        namespace : "ext",
+        attribute : "qtip",
+        width : "qwidth",
+        target : "target",
+        title : "qtitle",
+        hide : "hide",
+        cls : "qclass",
+        align : "qalign",
+        anchor : "anchor"
+    },
+
+    // private
+    initComponent : function(){
+        this.target = this.target || Ext.getDoc();
+        this.targets = this.targets || {};
+        Ext.QuickTip.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Configures a new quick tip instance and assigns it to a target element.  The following config values are
+     * supported (for example usage, see the {@link Ext.QuickTips} class header):
+     * <div class="mdetail-params"><ul>
+     * <li>autoHide</li>
+     * <li>cls</li>
+     * <li>dismissDelay (overrides the singleton value)</li>
+     * <li>target (required)</li>
+     * <li>text (required)</li>
+     * <li>title</li>
+     * <li>width</li></ul></div>
+     * @param {Object} config The config object
+     */
+    register : function(config){
+        var cs = Ext.isArray(config) ? config : arguments;
+        for(var i = 0, len = cs.length; i < len; i++){
+            var c = cs[i];
+            var target = c.target;
+            if(target){
+                if(Ext.isArray(target)){
+                    for(var j = 0, jlen = target.length; j < jlen; j++){
+                        this.targets[Ext.id(target[j])] = c;
+                    }
+                } else{
+                    this.targets[Ext.id(target)] = c;
+                }
+            }
+        }
+    },
+
+    /**
+     * Removes this quick tip from its element and destroys it.
+     * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+     */
+    unregister : function(el){
+        delete this.targets[Ext.id(el)];
+    },
+    
+    /**
+     * Hides a visible tip or cancels an impending show for a particular element.
+     * @param {String/HTMLElement/Element} el The element that is the target of the tip.
+     */
+    cancelShow: function(el){
+        var at = this.activeTarget;
+        el = Ext.get(el).dom;
+        if(this.isVisible()){
+            if(at && at.el == el){
+                this.hide();
+            }
+        }else if(at && at.el == el){
+            this.clearTimer('show');
+        }
+    },
+    
+    getTipCfg: function(e) {
+        var t = e.getTarget(), 
+            ttp, 
+            cfg;
+        if(this.interceptTitles && t.title && Ext.isString(t.title)){
+            ttp = t.title;
+            t.qtip = ttp;
+            t.removeAttribute("title");
+            e.preventDefault();
+        }else{
+            cfg = this.tagConfig;
+            ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
+        }
+        return ttp;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled){
+            return;
+        }
+        this.targetXY = e.getXY();
+        var t = e.getTarget();
+        if(!t || t.nodeType !== 1 || t == document || t == document.body){
+            return;
+        }
+        if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
+            this.clearTimer('hide');
+            this.show();
+            return;
+        }
+        if(t && this.targets[t.id]){
+            this.activeTarget = this.targets[t.id];
+            this.activeTarget.el = t;
+            this.anchor = this.activeTarget.anchor;
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+            return;
+        }
+        var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
+        if(ttp = this.getTipCfg(e)){
+            var autoHide = et.getAttribute(cfg.hide, ns);
+            this.activeTarget = {
+                el: t,
+                text: ttp,
+                width: et.getAttribute(cfg.width, ns),
+                autoHide: autoHide != "user" && autoHide !== 'false',
+                title: et.getAttribute(cfg.title, ns),
+                cls: et.getAttribute(cfg.cls, ns),
+                align: et.getAttribute(cfg.align, ns)
+                
+            };
+            this.anchor = et.getAttribute(cfg.anchor, ns);
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+
+        // If moving within the current target, and it does not have a new tip, ignore the mouseout
+        if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
+            return;
+        }
+
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        var t = this.activeTarget;
+        if(t){
+            if(!this.rendered){
+                this.render(Ext.getBody());
+                this.activeTarget = t;
+            }
+            if(t.width){
+                this.setWidth(t.width);
+                this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
+                this.measureWidth = false;
+            } else{
+                this.measureWidth = true;
+            }
+            this.setTitle(t.title || '');
+            this.body.update(t.text);
+            this.autoHide = t.autoHide;
+            this.dismissDelay = t.dismissDelay || this.dismissDelay;
+            if(this.lastCls){
+                this.el.removeClass(this.lastCls);
+                delete this.lastCls;
+            }
+            if(t.cls){
+                this.el.addClass(t.cls);
+                this.lastCls = t.cls;
+            }
+            if(this.anchor){
+                this.constrainPosition = false;
+            }else if(t.align){ // TODO: this doesn't seem to work consistently
+                xy = this.el.getAlignToXY(t.el, t.align);
+                this.constrainPosition = false;
+            }else{
+                this.constrainPosition = true;
+            }
+        }
+        Ext.QuickTip.superclass.showAt.call(this, xy);
+    },
+
+    // inherit docs
+    hide: function(){
+        delete this.activeTarget;
+        Ext.QuickTip.superclass.hide.call(this);
+    }
+});
+Ext.reg('quicktip', Ext.QuickTip);/**
+ * @class Ext.QuickTips
+ * <p>Provides attractive and customizable tooltips for any element. The QuickTips
+ * singleton is used to configure and manage tooltips globally for multiple elements
+ * in a generic manner.  To create individual tooltips with maximum customizability,
+ * you should consider either {@link Ext.Tip} or {@link Ext.ToolTip}.</p>
+ * <p>Quicktips can be configured via tag attributes directly in markup, or by
+ * registering quick tips programmatically via the {@link #register} method.</p>
+ * <p>The singleton's instance of {@link Ext.QuickTip} is available via
+ * {@link #getQuickTip}, and supports all the methods, and all the all the
+ * configuration properties of Ext.QuickTip. These settings will apply to all
+ * tooltips shown by the singleton.</p>
+ * <p>Below is the summary of the configuration properties which can be used.
+ * For detailed descriptions see the config options for the {@link Ext.QuickTip QuickTip} class</p>
+ * <p><b>QuickTips singleton configs (all are optional)</b></p>
+ * <div class="mdetail-params"><ul><li>dismissDelay</li>
+ * <li>hideDelay</li>
+ * <li>maxWidth</li>
+ * <li>minWidth</li>
+ * <li>showDelay</li>
+ * <li>trackMouse</li></ul></div>
+ * <p><b>Target element configs (optional unless otherwise noted)</b></p>
+ * <div class="mdetail-params"><ul><li>autoHide</li>
+ * <li>cls</li>
+ * <li>dismissDelay (overrides singleton value)</li>
+ * <li>target (required)</li>
+ * <li>text (required)</li>
+ * <li>title</li>
+ * <li>width</li></ul></div>
+ * <p>Here is an example showing how some of these config options could be used:</p>
+ * <pre><code>
+// Init the singleton.  Any tag-based quick tips will start working.
+Ext.QuickTips.init();
+
+// Apply a set of config properties to the singleton
+Ext.apply(Ext.QuickTips.getQuickTip(), {
+    maxWidth: 200,
+    minWidth: 100,
+    showDelay: 50,      // Show 50ms after entering target
+    trackMouse: true
+});
+
+// Manually register a quick tip for a specific element
+Ext.QuickTips.register({
+    target: 'my-div',
+    title: 'My Tooltip',
+    text: 'This tooltip was added in code',
+    width: 100,
+    dismissDelay: 10000 // Hide after 10 seconds hover
+});
+</code></pre>
+ * <p>To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
+ * the <b>ext:</b> namespace.  The HTML element itself is automatically set as the quick tip target. Here is the summary
+ * of supported attributes (optional unless otherwise noted):</p>
+ * <ul><li><b>hide</b>: Specifying "user" is equivalent to setting autoHide = false.  Any other value will be the
+ * same as autoHide = true.</li>
+ * <li><b>qclass</b>: A CSS class to be applied to the quick tip (equivalent to the 'cls' target element config).</li>
+ * <li><b>qtip (required)</b>: The quick tip text (equivalent to the 'text' target element config).</li>
+ * <li><b>qtitle</b>: The quick tip title (equivalent to the 'title' target element config).</li>
+ * <li><b>qwidth</b>: The quick tip width (equivalent to the 'width' target element config).</li></ul>
+ * <p>Here is an example of configuring an HTML element to display a tooltip from markup:</p>
+ * <pre><code>
+// Add a quick tip to an HTML button
+&lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
+     ext:qtip="This is a quick tip from markup!">&lt;/input>
+</code></pre>
+ * @singleton
+ */
+Ext.QuickTips = function(){
+    var tip,
+        disabled = false;
+        
+    return {
+        /**
+         * Initialize the global QuickTips instance and prepare any quick tips.
+         * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true) 
+         */
+        init : function(autoRender){
+            if(!tip){
+                if(!Ext.isReady){
+                    Ext.onReady(function(){
+                        Ext.QuickTips.init(autoRender);
+                    });
+                    return;
+                }
+                tip = new Ext.QuickTip({
+                    elements:'header,body', 
+                    disabled: disabled
+                });
+                if(autoRender !== false){
+                    tip.render(Ext.getBody());
+                }
+            }
+        },
+        
+        // Protected method called by the dd classes
+        ddDisable : function(){
+            // don't disable it if we don't need to
+            if(tip && !disabled){
+                tip.disable();
+            }    
+        },
+        
+        // Protected method called by the dd classes
+        ddEnable : function(){
+            // only enable it if it hasn't been disabled
+            if(tip && !disabled){
+                tip.enable();
+            }
+        },
+
+        /**
+         * Enable quick tips globally.
+         */
+        enable : function(){
+            if(tip){
+                tip.enable();
+            }
+            disabled = false;
+        },
+
+        /**
+         * Disable quick tips globally.
+         */
+        disable : function(){
+            if(tip){
+                tip.disable();
+            }
+            disabled = true;
+        },
+
+        /**
+         * Returns true if quick tips are enabled, else false.
+         * @return {Boolean}
+         */
+        isEnabled : function(){
+            return tip !== undefined && !tip.disabled;
+        },
+
+        /**
+         * Gets the single {@link Ext.QuickTip QuickTip} instance used to show tips from all registered elements.
+         * @return {Ext.QuickTip}
+         */
+        getQuickTip : function(){
+            return tip;
+        },
+
+        /**
+         * Configures a new quick tip instance and assigns it to a target element.  See
+         * {@link Ext.QuickTip#register} for details.
+         * @param {Object} config The config object
+         */
+        register : function(){
+            tip.register.apply(tip, arguments);
+        },
+
+        /**
+         * Removes any registered quick tip from the target element and destroys it.
+         * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+         */
+        unregister : function(){
+            tip.unregister.apply(tip, arguments);
+        },
+
+        /**
+         * Alias of {@link #register}.
+         * @param {Object} config The config object
+         */
+        tips : function(){
+            tip.register.apply(tip, arguments);
+        }
+    };
+}();/**
+ * @class Ext.slider.Tip
+ * @extends Ext.Tip
+ * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage:
+<pre>
+new Ext.Slider({
+    width: 214,
+    minValue: 0,
+    maxValue: 100,
+    plugins: new Ext.slider.Tip()
+});
+</pre>
+ * Optionally provide your own tip text by overriding getText:
+ <pre>
+ new Ext.Slider({
+     width: 214,
+     minValue: 0,
+     maxValue: 100,
+     plugins: new Ext.slider.Tip({
+         getText: function(thumb){
+             return String.format('<b>{0}% complete</b>', thumb.value);
+         }
+     })
+ });
+ </pre>
+ */
+Ext.slider.Tip = Ext.extend(Ext.Tip, {
+    minWidth: 10,
+    offsets : [0, -10],
+    
+    init: function(slider) {
+        slider.on({
+            scope    : this,
+            dragstart: this.onSlide,
+            drag     : this.onSlide,
+            dragend  : this.hide,
+            destroy  : this.destroy
+        });
+    },
+    
+    /**
+     * @private
+     * Called whenever a dragstart or drag event is received on the associated Thumb. 
+     * Aligns the Tip with the Thumb's new position.
+     * @param {Ext.slider.MultiSlider} slider The slider
+     * @param {Ext.EventObject} e The Event object
+     * @param {Ext.slider.Thumb} thumb The thumb that the Tip is attached to
+     */
+    onSlide : function(slider, e, thumb) {
+        this.show();
+        this.body.update(this.getText(thumb));
+        this.doAutoWidth();
+        this.el.alignTo(thumb.el, 'b-t?', this.offsets);
+    },
+
+    /**
+     * Used to create the text that appears in the Tip's body. By default this just returns
+     * the value of the Slider Thumb that the Tip is attached to. Override to customize.
+     * @param {Ext.slider.Thumb} thumb The Thumb that the Tip is attached to
+     * @return {String} The text to display in the tip
+     */
+    getText : function(thumb) {
+        return String(thumb.value);
+    }
+});
+
+//backwards compatibility - SliderTip used to be a ux before 3.2
+Ext.ux.SliderTip = Ext.slider.Tip;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ComponentMgr=function(){var c=new Ext.util.MixedCollection();var b={};var a={};return{register:function(d){c.add(d)},unregister:function(d){c.remove(d)},get:function(d){return c.get(d)},onAvailable:function(f,e,d){c.on("add",function(g,h){if(h.id==f){e.call(d||h,h);c.un("add",e,d)}})},all:c,types:b,ptypes:a,isRegistered:function(d){return b[d]!==undefined},isPluginRegistered:function(d){return a[d]!==undefined},registerType:function(e,d){b[e]=d;d.xtype=e},create:function(d,e){return d.render?d:new b[d.xtype||e](d)},registerPlugin:function(e,d){a[e]=d;d.ptype=e},createPlugin:function(e,f){var d=a[e.ptype||f];if(d.init){return d}else{return new d(e)}}}}();Ext.reg=Ext.ComponentMgr.registerType;Ext.preg=Ext.ComponentMgr.registerPlugin;Ext.create=Ext.ComponentMgr.create;Ext.Component=function(b){b=b||{};if(b.initialConfig){if(b.isAction){this.baseAction=b}b=b.initialConfig}else{if(b.tagName||b.dom||Ext.isString(b)){b={applyTo:b,id:b.id||b}}}this.initialConfig=b;Ext.apply(this,b);this.addEvents("added","disable","enable","beforeshow","show","beforehide","hide","removed","beforerender","render","afterrender","beforedestroy","destroy","beforestaterestore","staterestore","beforestatesave","statesave");this.getId();Ext.ComponentMgr.register(this);Ext.Component.superclass.constructor.call(this);if(this.baseAction){this.baseAction.addComponent(this)}this.initComponent();if(this.plugins){if(Ext.isArray(this.plugins)){for(var c=0,a=this.plugins.length;c<a;c++){this.plugins[c]=this.initPlugin(this.plugins[c])}}else{this.plugins=this.initPlugin(this.plugins)}}if(this.stateful!==false){this.initState()}if(this.applyTo){this.applyToMarkup(this.applyTo);delete this.applyTo}else{if(this.renderTo){this.render(this.renderTo);delete this.renderTo}}};Ext.Component.AUTO_ID=1000;Ext.extend(Ext.Component,Ext.util.Observable,{disabled:false,hidden:false,autoEl:"div",disabledClass:"x-item-disabled",allowDomMove:true,autoShow:false,hideMode:"display",hideParent:false,rendered:false,tplWriteMode:"overwrite",bubbleEvents:[],ctype:"Ext.Component",actionMode:"el",getActionEl:function(){return this[this.actionMode]},initPlugin:function(a){if(a.ptype&&!Ext.isFunction(a.init)){a=Ext.ComponentMgr.createPlugin(a)}else{if(Ext.isString(a)){a=Ext.ComponentMgr.createPlugin({ptype:a})}}a.init(this);return a},initComponent:function(){if(this.listeners){this.on(this.listeners);delete this.listeners}this.enableBubble(this.bubbleEvents)},render:function(b,a){if(!this.rendered&&this.fireEvent("beforerender",this)!==false){if(!b&&this.el){this.el=Ext.get(this.el);b=this.el.dom.parentNode;this.allowDomMove=false}this.container=Ext.get(b);if(this.ctCls){this.container.addClass(this.ctCls)}this.rendered=true;if(a!==undefined){if(Ext.isNumber(a)){a=this.container.dom.childNodes[a]}else{a=Ext.getDom(a)}}this.onRender(this.container,a||null);if(this.autoShow){this.el.removeClass(["x-hidden","x-hide-"+this.hideMode])}if(this.cls){this.el.addClass(this.cls);delete this.cls}if(this.style){this.el.applyStyles(this.style);delete this.style}if(this.overCls){this.el.addClassOnOver(this.overCls)}this.fireEvent("render",this);var c=this.getContentTarget();if(this.html){c.update(Ext.DomHelper.markup(this.html));delete this.html}if(this.contentEl){var d=Ext.getDom(this.contentEl);Ext.fly(d).removeClass(["x-hidden","x-hide-display"]);c.appendChild(d)}if(this.tpl){if(!this.tpl.compile){this.tpl=new Ext.XTemplate(this.tpl)}if(this.data){this.tpl[this.tplWriteMode](c,this.data);delete this.data}}this.afterRender(this.container);if(this.hidden){this.doHide()}if(this.disabled){this.disable(true)}if(this.stateful!==false){this.initStateEvents()}this.fireEvent("afterrender",this)}return this},update:function(b,d,a){var c=this.getContentTarget();if(this.tpl&&typeof b!=="string"){this.tpl[this.tplWriteMode](c,b||{})}else{var e=Ext.isObject(b)?Ext.DomHelper.markup(b):b;c.update(e,d,a)}},onAdded:function(a,b){this.ownerCt=a;this.initRef();this.fireEvent("added",this,a,b)},onRemoved:function(){this.removeRef();this.fireEvent("removed",this,this.ownerCt);delete this.ownerCt},initRef:function(){if(this.ref&&!this.refOwner){var d=this.ref.split("/"),c=d.length,b=0,a=this;while(a&&b<c){a=a.ownerCt;++b}if(a){a[this.refName=d[--b]]=this;this.refOwner=a}}},removeRef:function(){if(this.refOwner&&this.refName){delete this.refOwner[this.refName];delete this.refOwner}},initState:function(){if(Ext.state.Manager){var b=this.getStateId();if(b){var a=Ext.state.Manager.get(b);if(a){if(this.fireEvent("beforestaterestore",this,a)!==false){this.applyState(Ext.apply({},a));this.fireEvent("staterestore",this,a)}}}}},getStateId:function(){return this.stateId||((/^(ext-comp-|ext-gen)/).test(String(this.id))?null:this.id)},initStateEvents:function(){if(this.stateEvents){for(var a=0,b;b=this.stateEvents[a];a++){this.on(b,this.saveState,this,{delay:100})}}},applyState:function(a){if(a){Ext.apply(this,a)}},getState:function(){return null},saveState:function(){if(Ext.state.Manager&&this.stateful!==false){var b=this.getStateId();if(b){var a=this.getState();if(this.fireEvent("beforestatesave",this,a)!==false){Ext.state.Manager.set(b,a);this.fireEvent("statesave",this,a)}}}},applyToMarkup:function(a){this.allowDomMove=false;this.el=Ext.get(a);this.render(this.el.dom.parentNode)},addClass:function(a){if(this.el){this.el.addClass(a)}else{this.cls=this.cls?this.cls+" "+a:a}return this},removeClass:function(a){if(this.el){this.el.removeClass(a)}else{if(this.cls){this.cls=this.cls.split(" ").remove(a).join(" ")}}return this},onRender:function(b,a){if(!this.el&&this.autoEl){if(Ext.isString(this.autoEl)){this.el=document.createElement(this.autoEl)}else{var c=document.createElement("div");Ext.DomHelper.overwrite(c,this.autoEl);this.el=c.firstChild}if(!this.el.id){this.el.id=this.getId()}}if(this.el){this.el=Ext.get(this.el);if(this.allowDomMove!==false){b.dom.insertBefore(this.el.dom,a);if(c){Ext.removeNode(c);c=null}}}},getAutoCreate:function(){var a=Ext.isObject(this.autoCreate)?this.autoCreate:Ext.apply({},this.defaultAutoCreate);if(this.id&&!a.id){a.id=this.id}return a},afterRender:Ext.emptyFn,destroy:function(){if(!this.isDestroyed){if(this.fireEvent("beforedestroy",this)!==false){this.destroying=true;this.beforeDestroy();if(this.ownerCt&&this.ownerCt.remove){this.ownerCt.remove(this,false)}if(this.rendered){this.el.remove();if(this.actionMode=="container"||this.removeMode=="container"){this.container.remove()}}if(this.focusTask&&this.focusTask.cancel){this.focusTask.cancel()}this.onDestroy();Ext.ComponentMgr.unregister(this);this.fireEvent("destroy",this);this.purgeListeners();this.destroying=false;this.isDestroyed=true}}},deleteMembers:function(){var b=arguments;for(var c=0,a=b.length;c<a;++c){delete this[b[c]]}},beforeDestroy:Ext.emptyFn,onDestroy:Ext.emptyFn,getEl:function(){return this.el},getContentTarget:function(){return this.el},getId:function(){return this.id||(this.id="ext-comp-"+(++Ext.Component.AUTO_ID))},getItemId:function(){return this.itemId||this.getId()},focus:function(b,a){if(a){this.focusTask=new Ext.util.DelayedTask(this.focus,this,[b,false]);this.focusTask.delay(Ext.isNumber(a)?a:10);return this}if(this.rendered&&!this.isDestroyed){this.el.focus();if(b===true){this.el.dom.select()}}return this},blur:function(){if(this.rendered){this.el.blur()}return this},disable:function(a){if(this.rendered){this.onDisable()}this.disabled=true;if(a!==true){this.fireEvent("disable",this)}return this},onDisable:function(){this.getActionEl().addClass(this.disabledClass);this.el.dom.disabled=true},enable:function(){if(this.rendered){this.onEnable()}this.disabled=false;this.fireEvent("enable",this);return this},onEnable:function(){this.getActionEl().removeClass(this.disabledClass);this.el.dom.disabled=false},setDisabled:function(a){return this[a?"disable":"enable"]()},show:function(){if(this.fireEvent("beforeshow",this)!==false){this.hidden=false;if(this.autoRender){this.render(Ext.isBoolean(this.autoRender)?Ext.getBody():this.autoRender)}if(this.rendered){this.onShow()}this.fireEvent("show",this)}return this},onShow:function(){this.getVisibilityEl().removeClass("x-hide-"+this.hideMode)},hide:function(){if(this.fireEvent("beforehide",this)!==false){this.doHide();this.fireEvent("hide",this)}return this},doHide:function(){this.hidden=true;if(this.rendered){this.onHide()}},onHide:function(){this.getVisibilityEl().addClass("x-hide-"+this.hideMode)},getVisibilityEl:function(){return this.hideParent?this.container:this.getActionEl()},setVisible:function(a){return this[a?"show":"hide"]()},isVisible:function(){return this.rendered&&this.getVisibilityEl().isVisible()},cloneConfig:function(b){b=b||{};var c=b.id||Ext.id();var a=Ext.applyIf(b,this.initialConfig);a.id=c;return new this.constructor(a)},getXType:function(){return this.constructor.xtype},isXType:function(b,a){if(Ext.isFunction(b)){b=b.xtype}else{if(Ext.isObject(b)){b=b.constructor.xtype}}return !a?("/"+this.getXTypes()+"/").indexOf("/"+b+"/")!=-1:this.constructor.xtype==b},getXTypes:function(){var a=this.constructor;if(!a.xtypes){var d=[],b=this;while(b&&b.constructor.xtype){d.unshift(b.constructor.xtype);b=b.constructor.superclass}a.xtypeChain=d;a.xtypes=d.join("/")}return a.xtypes},findParentBy:function(a){for(var b=this.ownerCt;(b!=null)&&!a(b,this);b=b.ownerCt){}return b||null},findParentByType:function(b,a){return this.findParentBy(function(d){return d.isXType(b,a)})},bubble:function(c,b,a){var d=this;while(d){if(c.apply(b||d,a||[d])===false){break}d=d.ownerCt}return this},getPositionEl:function(){return this.positionEl||this.el},purgeListeners:function(){Ext.Component.superclass.purgeListeners.call(this);if(this.mons){this.on("beforedestroy",this.clearMons,this,{single:true})}},clearMons:function(){Ext.each(this.mons,function(a){a.item.un(a.ename,a.fn,a.scope)},this);this.mons=[]},createMons:function(){if(!this.mons){this.mons=[];this.on("beforedestroy",this.clearMons,this,{single:true})}},mon:function(f,b,d,c,a){this.createMons();if(Ext.isObject(b)){var i=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;var h=b;for(var g in h){if(i.test(g)){continue}if(Ext.isFunction(h[g])){this.mons.push({item:f,ename:g,fn:h[g],scope:h.scope});f.on(g,h[g],h.scope,h)}else{this.mons.push({item:f,ename:g,fn:h[g],scope:h.scope});f.on(g,h[g])}}return}this.mons.push({item:f,ename:b,fn:d,scope:c});f.on(b,d,c,a)},mun:function(g,c,f,e){var h,d;this.createMons();for(var b=0,a=this.mons.length;b<a;++b){d=this.mons[b];if(g===d.item&&c==d.ename&&f===d.fn&&e===d.scope){this.mons.splice(b,1);g.un(c,f,e);h=true;break}}return h},nextSibling:function(){if(this.ownerCt){var a=this.ownerCt.items.indexOf(this);if(a!=-1&&a+1<this.ownerCt.items.getCount()){return this.ownerCt.items.itemAt(a+1)}}return null},previousSibling:function(){if(this.ownerCt){var a=this.ownerCt.items.indexOf(this);if(a>0){return this.ownerCt.items.itemAt(a-1)}}return null},getBubbleTarget:function(){return this.ownerCt}});Ext.reg("component",Ext.Component);Ext.Action=Ext.extend(Object,{constructor:function(a){this.initialConfig=a;this.itemId=a.itemId=(a.itemId||a.id||Ext.id());this.items=[]},isAction:true,setText:function(a){this.initialConfig.text=a;this.callEach("setText",[a])},getText:function(){return this.initialConfig.text},setIconClass:function(a){this.initialConfig.iconCls=a;this.callEach("setIconClass",[a])},getIconClass:function(){return this.initialConfig.iconCls},setDisabled:function(a){this.initialConfig.disabled=a;this.callEach("setDisabled",[a])},enable:function(){this.setDisabled(false)},disable:function(){this.setDisabled(true)},isDisabled:function(){return this.initialConfig.disabled},setHidden:function(a){this.initialConfig.hidden=a;this.callEach("setVisible",[!a])},show:function(){this.setHidden(false)},hide:function(){this.setHidden(true)},isHidden:function(){return this.initialConfig.hidden},setHandler:function(b,a){this.initialConfig.handler=b;this.initialConfig.scope=a;this.callEach("setHandler",[b,a])},each:function(b,a){Ext.each(this.items,b,a)},callEach:function(e,b){var d=this.items;for(var c=0,a=d.length;c<a;c++){d[c][e].apply(d[c],b)}},addComponent:function(a){this.items.push(a);a.on("destroy",this.removeComponent,this)},removeComponent:function(a){this.items.remove(a)},execute:function(){this.initialConfig.handler.apply(this.initialConfig.scope||window,arguments)}});(function(){Ext.Layer=function(d,c){d=d||{};var e=Ext.DomHelper,g=d.parentEl,f=g?Ext.getDom(g):document.body;if(c){this.dom=Ext.getDom(c)}if(!this.dom){var h=d.dh||{tag:"div",cls:"x-layer"};this.dom=e.append(f,h)}if(d.cls){this.addClass(d.cls)}this.constrain=d.constrain!==false;this.setVisibilityMode(Ext.Element.VISIBILITY);if(d.id){this.id=this.dom.id=d.id}else{this.id=Ext.id(this.dom)}this.zindex=d.zindex||this.getZIndex();this.position("absolute",this.zindex);if(d.shadow){this.shadowOffset=d.shadowOffset||4;this.shadow=new Ext.Shadow({offset:this.shadowOffset,mode:d.shadow})}else{this.shadowOffset=0}this.useShim=d.shim!==false&&Ext.useShims;this.useDisplay=d.useDisplay;this.hide()};var a=Ext.Element.prototype;var b=[];Ext.extend(Ext.Layer,Ext.Element,{getZIndex:function(){return this.zindex||parseInt((this.getShim()||this).getStyle("z-index"),10)||11000},getShim:function(){if(!this.useShim){return null}if(this.shim){return this.shim}var d=b.shift();if(!d){d=this.createShim();d.enableDisplayMode("block");d.dom.style.display="none";d.dom.style.visibility="visible"}var c=this.dom.parentNode;if(d.dom.parentNode!=c){c.insertBefore(d.dom,this.dom)}d.setStyle("z-index",this.getZIndex()-2);this.shim=d;return d},hideShim:function(){if(this.shim){this.shim.setDisplayed(false);b.push(this.shim);delete this.shim}},disableShadow:function(){if(this.shadow){this.shadowDisabled=true;this.shadow.hide();this.lastShadowOffset=this.shadowOffset;this.shadowOffset=0}},enableShadow:function(c){if(this.shadow){this.shadowDisabled=false;if(Ext.isDefined(this.lastShadowOffset)){this.shadowOffset=this.lastShadowOffset;delete this.lastShadowOffset}if(c){this.sync(true)}}},sync:function(d){var m=this.shadow;if(!this.updating&&this.isVisible()&&(m||this.useShim)){var g=this.getShim(),k=this.getWidth(),i=this.getHeight(),e=this.getLeft(true),n=this.getTop(true);if(m&&!this.shadowDisabled){if(d&&!m.isVisible()){m.show(this)}else{m.realign(e,n,k,i)}if(g){if(d){g.show()}var j=m.el.getXY(),f=g.dom.style,c=m.el.getSize();f.left=(j[0])+"px";f.top=(j[1])+"px";f.width=(c.width)+"px";f.height=(c.height)+"px"}}else{if(g){if(d){g.show()}g.setSize(k,i);g.setLeftTop(e,n)}}}},destroy:function(){this.hideShim();if(this.shadow){this.shadow.hide()}this.removeAllListeners();Ext.removeNode(this.dom);delete this.dom},remove:function(){this.destroy()},beginUpdate:function(){this.updating=true},endUpdate:function(){this.updating=false;this.sync(true)},hideUnders:function(c){if(this.shadow){this.shadow.hide()}this.hideShim()},constrainXY:function(){if(this.constrain){var i=Ext.lib.Dom.getViewWidth(),d=Ext.lib.Dom.getViewHeight();var n=Ext.getDoc().getScroll();var m=this.getXY();var j=m[0],g=m[1];var c=this.shadowOffset;var k=this.dom.offsetWidth+c,e=this.dom.offsetHeight+c;var f=false;if((j+k)>i+n.left){j=i-k-c;f=true}if((g+e)>d+n.top){g=d-e-c;f=true}if(j<n.left){j=n.left;f=true}if(g<n.top){g=n.top;f=true}if(f){if(this.avoidY){var l=this.avoidY;if(g<=l&&(g+e)>=l){g=l-e-5}}m=[j,g];this.storeXY(m);a.setXY.call(this,m);this.sync()}}return this},getConstrainOffset:function(){return this.shadowOffset},isVisible:function(){return this.visible},showAction:function(){this.visible=true;if(this.useDisplay===true){this.setDisplayed("")}else{if(this.lastXY){a.setXY.call(this,this.lastXY)}else{if(this.lastLT){a.setLeftTop.call(this,this.lastLT[0],this.lastLT[1])}}}},hideAction:function(){this.visible=false;if(this.useDisplay===true){this.setDisplayed(false)}else{this.setLeftTop(-10000,-10000)}},setVisible:function(h,g,j,k,i){if(h){this.showAction()}if(g&&h){var f=function(){this.sync(true);if(k){k()}}.createDelegate(this);a.setVisible.call(this,true,true,j,f,i)}else{if(!h){this.hideUnders(true)}var f=k;if(g){f=function(){this.hideAction();if(k){k()}}.createDelegate(this)}a.setVisible.call(this,h,g,j,f,i);if(h){this.sync(true)}else{if(!g){this.hideAction()}}}return this},storeXY:function(c){delete this.lastLT;this.lastXY=c},storeLeftTop:function(d,c){delete this.lastXY;this.lastLT=[d,c]},beforeFx:function(){this.beforeAction();return Ext.Layer.superclass.beforeFx.apply(this,arguments)},afterFx:function(){Ext.Layer.superclass.afterFx.apply(this,arguments);this.sync(this.isVisible())},beforeAction:function(){if(!this.updating&&this.shadow){this.shadow.hide()}},setLeft:function(c){this.storeLeftTop(c,this.getTop(true));a.setLeft.apply(this,arguments);this.sync();return this},setTop:function(c){this.storeLeftTop(this.getLeft(true),c);a.setTop.apply(this,arguments);this.sync();return this},setLeftTop:function(d,c){this.storeLeftTop(d,c);a.setLeftTop.apply(this,arguments);this.sync();return this},setXY:function(i,g,j,k,h){this.fixDisplay();this.beforeAction();this.storeXY(i);var f=this.createCB(k);a.setXY.call(this,i,g,j,f,h);if(!g){f()}return this},createCB:function(e){var d=this;return function(){d.constrainXY();d.sync(true);if(e){e()}}},setX:function(f,g,i,j,h){this.setXY([f,this.getY()],g,i,j,h);return this},setY:function(j,f,h,i,g){this.setXY([this.getX(),j],f,h,i,g);return this},setSize:function(i,j,g,l,m,k){this.beforeAction();var f=this.createCB(m);a.setSize.call(this,i,j,g,l,f,k);if(!g){f()}return this},setWidth:function(h,g,j,k,i){this.beforeAction();var f=this.createCB(k);a.setWidth.call(this,h,g,j,f,i);if(!g){f()}return this},setHeight:function(i,g,k,l,j){this.beforeAction();var f=this.createCB(l);a.setHeight.call(this,i,g,k,f,j);if(!g){f()}return this},setBounds:function(n,l,o,g,m,j,k,i){this.beforeAction();var f=this.createCB(k);if(!m){this.storeXY([n,l]);a.setXY.call(this,[n,l]);a.setSize.call(this,o,g,m,j,f,i);f()}else{a.setBounds.call(this,n,l,o,g,m,j,f,i)}return this},setZIndex:function(c){this.zindex=c;this.setStyle("z-index",c+2);if(this.shadow){this.shadow.setZIndex(c+1)}if(this.shim){this.shim.setStyle("z-index",c)}return this}})})();Ext.Shadow=function(d){Ext.apply(this,d);if(typeof this.mode!="string"){this.mode=this.defaultMode}var e=this.offset,c={h:0},b=Math.floor(this.offset/2);switch(this.mode.toLowerCase()){case"drop":c.w=0;c.l=c.t=e;c.t-=1;if(Ext.isIE){c.l-=this.offset+b;c.t-=this.offset+b;c.w-=b;c.h-=b;c.t+=1}break;case"sides":c.w=(e*2);c.l=-e;c.t=e-1;if(Ext.isIE){c.l-=(this.offset-b);c.t-=this.offset+b;c.l+=1;c.w-=(this.offset-b)*2;c.w-=b+1;c.h-=1}break;case"frame":c.w=c.h=(e*2);c.l=c.t=-e;c.t+=1;c.h-=2;if(Ext.isIE){c.l-=(this.offset-b);c.t-=(this.offset-b);c.l+=1;c.w-=(this.offset+b+1);c.h-=(this.offset+b);c.h+=1}break}this.adjusts=c};Ext.Shadow.prototype={offset:4,defaultMode:"drop",show:function(a){a=Ext.get(a);if(!this.el){this.el=Ext.Shadow.Pool.pull();if(this.el.dom.nextSibling!=a.dom){this.el.insertBefore(a)}}this.el.setStyle("z-index",this.zIndex||parseInt(a.getStyle("z-index"),10)-1);if(Ext.isIE){this.el.dom.style.filter="progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius="+(this.offset)+")"}this.realign(a.getLeft(true),a.getTop(true),a.getWidth(),a.getHeight());this.el.dom.style.display="block"},isVisible:function(){return this.el?true:false},realign:function(b,q,p,f){if(!this.el){return}var m=this.adjusts,j=this.el.dom,r=j.style,g=0,o=(p+m.w),e=(f+m.h),i=o+"px",n=e+"px",k,c;r.left=(b+m.l)+"px";r.top=(q+m.t)+"px";if(r.width!=i||r.height!=n){r.width=i;r.height=n;if(!Ext.isIE){k=j.childNodes;c=Math.max(0,(o-12))+"px";k[0].childNodes[1].style.width=c;k[1].childNodes[1].style.width=c;k[2].childNodes[1].style.width=c;k[1].style.height=Math.max(0,(e-12))+"px"}}},hide:function(){if(this.el){this.el.dom.style.display="none";Ext.Shadow.Pool.push(this.el);delete this.el}},setZIndex:function(a){this.zIndex=a;if(this.el){this.el.setStyle("z-index",a)}}};Ext.Shadow.Pool=function(){var b=[],a=Ext.isIE?'<div class="x-ie-shadow"></div>':'<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';return{pull:function(){var c=b.shift();if(!c){c=Ext.get(Ext.DomHelper.insertHtml("beforeBegin",document.body.firstChild,a));c.autoBoxAdjust=false}return c},push:function(c){b.push(c)}}}();Ext.BoxComponent=Ext.extend(Ext.Component,{initComponent:function(){Ext.BoxComponent.superclass.initComponent.call(this);this.addEvents("resize","move")},boxReady:false,deferHeight:false,setSize:function(b,d){if(typeof b=="object"){d=b.height;b=b.width}if(Ext.isDefined(b)&&Ext.isDefined(this.boxMinWidth)&&(b<this.boxMinWidth)){b=this.boxMinWidth}if(Ext.isDefined(d)&&Ext.isDefined(this.boxMinHeight)&&(d<this.boxMinHeight)){d=this.boxMinHeight}if(Ext.isDefined(b)&&Ext.isDefined(this.boxMaxWidth)&&(b>this.boxMaxWidth)){b=this.boxMaxWidth}if(Ext.isDefined(d)&&Ext.isDefined(this.boxMaxHeight)&&(d>this.boxMaxHeight)){d=this.boxMaxHeight}if(!this.boxReady){this.width=b;this.height=d;return this}if(this.cacheSizes!==false&&this.lastSize&&this.lastSize.width==b&&this.lastSize.height==d){return this}this.lastSize={width:b,height:d};var c=this.adjustSize(b,d),f=c.width,a=c.height,e;if(f!==undefined||a!==undefined){e=this.getResizeEl();if(!this.deferHeight&&f!==undefined&&a!==undefined){e.setSize(f,a)}else{if(!this.deferHeight&&a!==undefined){e.setHeight(a)}else{if(f!==undefined){e.setWidth(f)}}}this.onResize(f,a,b,d);this.fireEvent("resize",this,f,a,b,d)}return this},setWidth:function(a){return this.setSize(a)},setHeight:function(a){return this.setSize(undefined,a)},getSize:function(){return this.getResizeEl().getSize()},getWidth:function(){return this.getResizeEl().getWidth()},getHeight:function(){return this.getResizeEl().getHeight()},getOuterSize:function(){var a=this.getResizeEl();return{width:a.getWidth()+a.getMargins("lr"),height:a.getHeight()+a.getMargins("tb")}},getPosition:function(a){var b=this.getPositionEl();if(a===true){return[b.getLeft(true),b.getTop(true)]}return this.xy||b.getXY()},getBox:function(a){var c=this.getPosition(a);var b=this.getSize();b.x=c[0];b.y=c[1];return b},updateBox:function(a){this.setSize(a.width,a.height);this.setPagePosition(a.x,a.y);return this},getResizeEl:function(){return this.resizeEl||this.el},setAutoScroll:function(a){if(this.rendered){this.getContentTarget().setOverflow(a?"auto":"")}this.autoScroll=a;return this},setPosition:function(a,f){if(a&&typeof a[1]=="number"){f=a[1];a=a[0]}this.x=a;this.y=f;if(!this.boxReady){return this}var b=this.adjustPosition(a,f);var e=b.x,d=b.y;var c=this.getPositionEl();if(e!==undefined||d!==undefined){if(e!==undefined&&d!==undefined){c.setLeftTop(e,d)}else{if(e!==undefined){c.setLeft(e)}else{if(d!==undefined){c.setTop(d)}}}this.onPosition(e,d);this.fireEvent("move",this,e,d)}return this},setPagePosition:function(a,c){if(a&&typeof a[1]=="number"){c=a[1];a=a[0]}this.pageX=a;this.pageY=c;if(!this.boxReady){return}if(a===undefined||c===undefined){return}var b=this.getPositionEl().translatePoints(a,c);this.setPosition(b.left,b.top);return this},afterRender:function(){Ext.BoxComponent.superclass.afterRender.call(this);if(this.resizeEl){this.resizeEl=Ext.get(this.resizeEl)}if(this.positionEl){this.positionEl=Ext.get(this.positionEl)}this.boxReady=true;Ext.isDefined(this.autoScroll)&&this.setAutoScroll(this.autoScroll);this.setSize(this.width,this.height);if(this.x||this.y){this.setPosition(this.x,this.y)}else{if(this.pageX||this.pageY){this.setPagePosition(this.pageX,this.pageY)}}},syncSize:function(){delete this.lastSize;this.setSize(this.autoWidth?undefined:this.getResizeEl().getWidth(),this.autoHeight?undefined:this.getResizeEl().getHeight());return this},onResize:function(d,b,a,c){},onPosition:function(a,b){},adjustSize:function(a,b){if(this.autoWidth){a="auto"}if(this.autoHeight){b="auto"}return{width:a,height:b}},adjustPosition:function(a,b){return{x:a,y:b}}});Ext.reg("box",Ext.BoxComponent);Ext.Spacer=Ext.extend(Ext.BoxComponent,{autoEl:"div"});Ext.reg("spacer",Ext.Spacer);Ext.SplitBar=function(c,e,b,d,a){this.el=Ext.get(c,true);this.el.dom.unselectable="on";this.resizingEl=Ext.get(e,true);this.orientation=b||Ext.SplitBar.HORIZONTAL;this.minSize=0;this.maxSize=2000;this.animate=false;this.useShim=false;this.shim=null;if(!a){this.proxy=Ext.SplitBar.createProxy(this.orientation)}else{this.proxy=Ext.get(a).dom}this.dd=new Ext.dd.DDProxy(this.el.dom.id,"XSplitBars",{dragElId:this.proxy.id});this.dd.b4StartDrag=this.onStartProxyDrag.createDelegate(this);this.dd.endDrag=this.onEndProxyDrag.createDelegate(this);this.dragSpecs={};this.adapter=new Ext.SplitBar.BasicLayoutAdapter();this.adapter.init(this);if(this.orientation==Ext.SplitBar.HORIZONTAL){this.placement=d||(this.el.getX()>this.resizingEl.getX()?Ext.SplitBar.LEFT:Ext.SplitBar.RIGHT);this.el.addClass("x-splitbar-h")}else{this.placement=d||(this.el.getY()>this.resizingEl.getY()?Ext.SplitBar.TOP:Ext.SplitBar.BOTTOM);this.el.addClass("x-splitbar-v")}this.addEvents("resize","moved","beforeresize","beforeapply");Ext.SplitBar.superclass.constructor.call(this)};Ext.extend(Ext.SplitBar,Ext.util.Observable,{onStartProxyDrag:function(a,e){this.fireEvent("beforeresize",this);this.overlay=Ext.DomHelper.append(document.body,{cls:"x-drag-overlay",html:"&#160;"},true);this.overlay.unselectable();this.overlay.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.overlay.show();Ext.get(this.proxy).setDisplayed("block");var c=this.adapter.getElementSize(this);this.activeMinSize=this.getMinimumSize();this.activeMaxSize=this.getMaximumSize();var d=c-this.activeMinSize;var b=Math.max(this.activeMaxSize-c,0);if(this.orientation==Ext.SplitBar.HORIZONTAL){this.dd.resetConstraints();this.dd.setXConstraint(this.placement==Ext.SplitBar.LEFT?d:b,this.placement==Ext.SplitBar.LEFT?b:d,this.tickSize);this.dd.setYConstraint(0,0)}else{this.dd.resetConstraints();this.dd.setXConstraint(0,0);this.dd.setYConstraint(this.placement==Ext.SplitBar.TOP?d:b,this.placement==Ext.SplitBar.TOP?b:d,this.tickSize)}this.dragSpecs.startSize=c;this.dragSpecs.startPoint=[a,e];Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd,a,e)},onEndProxyDrag:function(c){Ext.get(this.proxy).setDisplayed(false);var b=Ext.lib.Event.getXY(c);if(this.overlay){Ext.destroy(this.overlay);delete this.overlay}var a;if(this.orientation==Ext.SplitBar.HORIZONTAL){a=this.dragSpecs.startSize+(this.placement==Ext.SplitBar.LEFT?b[0]-this.dragSpecs.startPoint[0]:this.dragSpecs.startPoint[0]-b[0])}else{a=this.dragSpecs.startSize+(this.placement==Ext.SplitBar.TOP?b[1]-this.dragSpecs.startPoint[1]:this.dragSpecs.startPoint[1]-b[1])}a=Math.min(Math.max(a,this.activeMinSize),this.activeMaxSize);if(a!=this.dragSpecs.startSize){if(this.fireEvent("beforeapply",this,a)!==false){this.adapter.setElementSize(this,a);this.fireEvent("moved",this,a);this.fireEvent("resize",this,a)}}},getAdapter:function(){return this.adapter},setAdapter:function(a){this.adapter=a;this.adapter.init(this)},getMinimumSize:function(){return this.minSize},setMinimumSize:function(a){this.minSize=a},getMaximumSize:function(){return this.maxSize},setMaximumSize:function(a){this.maxSize=a},setCurrentSize:function(b){var a=this.animate;this.animate=false;this.adapter.setElementSize(this,b);this.animate=a},destroy:function(a){Ext.destroy(this.shim,Ext.get(this.proxy));this.dd.unreg();if(a){this.el.remove()}this.purgeListeners()}});Ext.SplitBar.createProxy=function(b){var c=new Ext.Element(document.createElement("div"));document.body.appendChild(c.dom);c.unselectable();var a="x-splitbar-proxy";c.addClass(a+" "+(b==Ext.SplitBar.HORIZONTAL?a+"-h":a+"-v"));return c.dom};Ext.SplitBar.BasicLayoutAdapter=function(){};Ext.SplitBar.BasicLayoutAdapter.prototype={init:function(a){},getElementSize:function(a){if(a.orientation==Ext.SplitBar.HORIZONTAL){return a.resizingEl.getWidth()}else{return a.resizingEl.getHeight()}},setElementSize:function(b,a,c){if(b.orientation==Ext.SplitBar.HORIZONTAL){if(!b.animate){b.resizingEl.setWidth(a);if(c){c(b,a)}}else{b.resizingEl.setWidth(a,true,0.1,c,"easeOut")}}else{if(!b.animate){b.resizingEl.setHeight(a);if(c){c(b,a)}}else{b.resizingEl.setHeight(a,true,0.1,c,"easeOut")}}}};Ext.SplitBar.AbsoluteLayoutAdapter=function(a){this.basic=new Ext.SplitBar.BasicLayoutAdapter();this.container=Ext.get(a)};Ext.SplitBar.AbsoluteLayoutAdapter.prototype={init:function(a){this.basic.init(a)},getElementSize:function(a){return this.basic.getElementSize(a)},setElementSize:function(b,a,c){this.basic.setElementSize(b,a,this.moveSplitter.createDelegate(this,[b]))},moveSplitter:function(a){var b=Ext.SplitBar;switch(a.placement){case b.LEFT:a.el.setX(a.resizingEl.getRight());break;case b.RIGHT:a.el.setStyle("right",(this.container.getWidth()-a.resizingEl.getLeft())+"px");break;case b.TOP:a.el.setY(a.resizingEl.getBottom());break;case b.BOTTOM:a.el.setY(a.resizingEl.getTop()-a.el.getHeight());break}}};Ext.SplitBar.VERTICAL=1;Ext.SplitBar.HORIZONTAL=2;Ext.SplitBar.LEFT=1;Ext.SplitBar.RIGHT=2;Ext.SplitBar.TOP=3;Ext.SplitBar.BOTTOM=4;Ext.Container=Ext.extend(Ext.BoxComponent,{bufferResize:50,autoDestroy:true,forceLayout:false,defaultType:"panel",resizeEvent:"resize",bubbleEvents:["add","remove"],initComponent:function(){Ext.Container.superclass.initComponent.call(this);this.addEvents("afterlayout","beforeadd","beforeremove","add","remove");var a=this.items;if(a){delete this.items;this.add(a)}},initItems:function(){if(!this.items){this.items=new Ext.util.MixedCollection(false,this.getComponentId);this.getLayout()}},setLayout:function(a){if(this.layout&&this.layout!=a){this.layout.setContainer(null)}this.layout=a;this.initItems();a.setContainer(this)},afterRender:function(){Ext.Container.superclass.afterRender.call(this);if(!this.layout){this.layout="auto"}if(Ext.isObject(this.layout)&&!this.layout.layout){this.layoutConfig=this.layout;this.layout=this.layoutConfig.type}if(Ext.isString(this.layout)){this.layout=new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig)}this.setLayout(this.layout);if(this.activeItem!==undefined&&this.layout.setActiveItem){var a=this.activeItem;delete this.activeItem;this.layout.setActiveItem(a)}if(!this.ownerCt){this.doLayout(false,true)}if(this.monitorResize===true){Ext.EventManager.onWindowResize(this.doLayout,this,[false])}},getLayoutTarget:function(){return this.el},getComponentId:function(a){return a.getItemId()},add:function(b){this.initItems();var e=arguments.length>1;if(e||Ext.isArray(b)){var a=[];Ext.each(e?arguments:b,function(g){a.push(this.add(g))},this);return a}var f=this.lookupComponent(this.applyDefaults(b));var d=this.items.length;if(this.fireEvent("beforeadd",this,f,d)!==false&&this.onBeforeAdd(f)!==false){this.items.add(f);f.onAdded(this,d);this.onAdd(f);this.fireEvent("add",this,f,d)}return f},onAdd:function(a){},onAdded:function(a,b){this.ownerCt=a;this.initRef();this.cascade(function(d){d.initRef()});this.fireEvent("added",this,a,b)},insert:function(e,b){var d=arguments,g=d.length,a=[],f,h;this.initItems();if(g>2){for(f=g-1;f>=1;--f){a.push(this.insert(e,d[f]))}return a}h=this.lookupComponent(this.applyDefaults(b));e=Math.min(e,this.items.length);if(this.fireEvent("beforeadd",this,h,e)!==false&&this.onBeforeAdd(h)!==false){if(h.ownerCt==this){this.items.remove(h)}this.items.insert(e,h);h.onAdded(this,e);this.onAdd(h);this.fireEvent("add",this,h,e)}return h},applyDefaults:function(b){var a=this.defaults;if(a){if(Ext.isFunction(a)){a=a.call(this,b)}if(Ext.isString(b)){b=Ext.ComponentMgr.get(b);Ext.apply(b,a)}else{if(!b.events){Ext.applyIf(b.isAction?b.initialConfig:b,a)}else{Ext.apply(b,a)}}}return b},onBeforeAdd:function(a){if(a.ownerCt){a.ownerCt.remove(a,false)}if(this.hideBorders===true){a.border=(a.border===true)}},remove:function(a,b){this.initItems();var d=this.getComponent(a);if(d&&this.fireEvent("beforeremove",this,d)!==false){this.doRemove(d,b);this.fireEvent("remove",this,d)}return d},onRemove:function(a){},doRemove:function(e,d){var b=this.layout,a=b&&this.rendered;if(a){b.onRemove(e)}this.items.remove(e);e.onRemoved();this.onRemove(e);if(d===true||(d!==false&&this.autoDestroy)){e.destroy()}if(a){b.afterRemove(e)}},removeAll:function(c){this.initItems();var e,f=[],b=[];this.items.each(function(g){f.push(g)});for(var d=0,a=f.length;d<a;++d){e=f[d];this.remove(e,c);if(e.ownerCt!==this){b.push(e)}}return b},getComponent:function(a){if(Ext.isObject(a)){a=a.getItemId()}return this.items.get(a)},lookupComponent:function(a){if(Ext.isString(a)){return Ext.ComponentMgr.get(a)}else{if(!a.events){return this.createComponent(a)}}return a},createComponent:function(a,d){if(a.render){return a}var b=Ext.create(Ext.apply({ownerCt:this},a),d||this.defaultType);delete b.initialConfig.ownerCt;delete b.ownerCt;return b},canLayout:function(){var a=this.getVisibilityEl();return a&&a.dom&&!a.isStyle("display","none")},doLayout:function(f,e){var j=this.rendered,h=e||this.forceLayout;if(this.collapsed||!this.canLayout()){this.deferLayout=this.deferLayout||!f;if(!h){return}f=f&&!this.deferLayout}else{delete this.deferLayout}if(j&&this.layout){this.layout.layout()}if(f!==true&&this.items){var d=this.items.items;for(var b=0,a=d.length;b<a;b++){var g=d[b];if(g.doLayout){g.doLayout(false,h)}}}if(j){this.onLayout(f,h)}this.hasLayout=true;delete this.forceLayout},onLayout:Ext.emptyFn,shouldBufferLayout:function(){var a=this.hasLayout;if(this.ownerCt){return a?!this.hasLayoutPending():false}return a},hasLayoutPending:function(){var a=false;this.ownerCt.bubble(function(b){if(b.layoutPending){a=true;return false}});return a},onShow:function(){Ext.Container.superclass.onShow.call(this);if(Ext.isDefined(this.deferLayout)){delete this.deferLayout;this.doLayout(true)}},getLayout:function(){if(!this.layout){var a=new Ext.layout.AutoLayout(this.layoutConfig);this.setLayout(a)}return this.layout},beforeDestroy:function(){var a;if(this.items){while(a=this.items.first()){this.doRemove(a,true)}}if(this.monitorResize){Ext.EventManager.removeResizeListener(this.doLayout,this)}Ext.destroy(this.layout);Ext.Container.superclass.beforeDestroy.call(this)},cascade:function(f,e,b){if(f.apply(e||this,b||[this])!==false){if(this.items){var d=this.items.items;for(var c=0,a=d.length;c<a;c++){if(d[c].cascade){d[c].cascade(f,e,b)}else{f.apply(e||d[c],b||[d[c]])}}}}return this},findById:function(c){var a=null,b=this;this.cascade(function(d){if(b!=d&&d.id===c){a=d;return false}});return a},findByType:function(b,a){return this.findBy(function(d){return d.isXType(b,a)})},find:function(b,a){return this.findBy(function(d){return d[b]===a})},findBy:function(d,c){var a=[],b=this;this.cascade(function(e){if(b!=e&&d.call(c||e,e,b)===true){a.push(e)}});return a},get:function(a){return this.getComponent(a)}});Ext.Container.LAYOUTS={};Ext.reg("container",Ext.Container);Ext.layout.ContainerLayout=Ext.extend(Object,{monitorResize:false,activeItem:null,constructor:function(a){this.id=Ext.id(null,"ext-layout-");Ext.apply(this,a)},type:"container",IEMeasureHack:function(j,f){var a=j.dom.childNodes,b=a.length,m,l=[],k,g,h;for(g=0;g<b;g++){m=a[g];k=Ext.get(m);if(k){l[g]=k.getStyle("display");k.setStyle({display:"none"})}}h=j?j.getViewSize(f):{};for(g=0;g<b;g++){m=a[g];k=Ext.get(m);if(k){k.setStyle({display:l[g]})}}return h},getLayoutTargetSize:Ext.EmptyFn,layout:function(){var a=this.container,b=a.getLayoutTarget();if(!(this.hasLayout||Ext.isEmpty(this.targetCls))){b.addClass(this.targetCls)}this.onLayout(a,b);a.fireEvent("afterlayout",a,this)},onLayout:function(a,b){this.renderAll(a,b)},isValidParent:function(b,a){return a&&b.getPositionEl().dom.parentNode==(a.dom||a)},renderAll:function(e,f){var b=e.items.items,d,g,a=b.length;for(d=0;d<a;d++){g=b[d];if(g&&(!g.rendered||!this.isValidParent(g,f))){this.renderItem(g,d,f)}}},renderItem:function(d,a,b){if(d){if(!d.rendered){d.render(b,a);this.configureItem(d)}else{if(!this.isValidParent(d,b)){if(Ext.isNumber(a)){a=b.dom.childNodes[a]}b.dom.insertBefore(d.getPositionEl().dom,a||null);d.container=b;this.configureItem(d)}}}},getRenderedItems:function(f){var e=f.getLayoutTarget(),g=f.items.items,a=g.length,d,h,b=[];for(d=0;d<a;d++){if((h=g[d]).rendered&&this.isValidParent(h,e)&&h.shouldLayout!==false){b.push(h)}}return b},configureItem:function(b){if(this.extraCls){var a=b.getPositionEl?b.getPositionEl():b;a.addClass(this.extraCls)}if(b.doLayout&&this.forceLayout){b.doLayout()}if(this.renderHidden&&b!=this.activeItem){b.hide()}},onRemove:function(b){if(this.activeItem==b){delete this.activeItem}if(b.rendered&&this.extraCls){var a=b.getPositionEl?b.getPositionEl():b;a.removeClass(this.extraCls)}},afterRemove:function(a){if(a.removeRestore){a.removeMode="container";delete a.removeRestore}},onResize:function(){var c=this.container,a;if(c.collapsed){return}if(a=c.bufferResize&&c.shouldBufferLayout()){if(!this.resizeTask){this.resizeTask=new Ext.util.DelayedTask(this.runLayout,this);this.resizeBuffer=Ext.isNumber(a)?a:50}c.layoutPending=true;this.resizeTask.delay(this.resizeBuffer)}else{this.runLayout()}},runLayout:function(){var a=this.container;this.layout();a.onLayout();delete a.layoutPending},setContainer:function(b){if(this.monitorResize&&b!=this.container){var a=this.container;if(a){a.un(a.resizeEvent,this.onResize,this)}if(b){b.on(b.resizeEvent,this.onResize,this)}}this.container=b},parseMargins:function(b){if(Ext.isNumber(b)){b=b.toString()}var c=b.split(" "),a=c.length;if(a==1){c[1]=c[2]=c[3]=c[0]}else{if(a==2){c[2]=c[0];c[3]=c[1]}else{if(a==3){c[3]=c[1]}}}return{top:parseInt(c[0],10)||0,right:parseInt(c[1],10)||0,bottom:parseInt(c[2],10)||0,left:parseInt(c[3],10)||0}},fieldTpl:(function(){var a=new Ext.Template('<div class="x-form-item {itemCls}" tabIndex="-1">','<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>','<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">','</div><div class="{clearCls}"></div>',"</div>");a.disableFormats=true;return a.compile()})(),destroy:function(){if(this.resizeTask&&this.resizeTask.cancel){this.resizeTask.cancel()}if(this.container){this.container.un(this.container.resizeEvent,this.onResize,this)}if(!Ext.isEmpty(this.targetCls)){var a=this.container.getLayoutTarget();if(a){a.removeClass(this.targetCls)}}}});Ext.layout.AutoLayout=Ext.extend(Ext.layout.ContainerLayout,{type:"auto",monitorResize:true,onLayout:function(d,f){Ext.layout.AutoLayout.superclass.onLayout.call(this,d,f);var e=this.getRenderedItems(d),a=e.length,b,g;for(b=0;b<a;b++){g=e[b];if(g.doLayout){g.doLayout(true)}}}});Ext.Container.LAYOUTS.auto=Ext.layout.AutoLayout;Ext.layout.FitLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"fit",getLayoutTargetSize:function(){var a=this.container.getLayoutTarget();if(!a){return{}}return a.getStyleSize()},onLayout:function(a,b){Ext.layout.FitLayout.superclass.onLayout.call(this,a,b);if(!a.collapsed){this.setItemSize(this.activeItem||a.items.itemAt(0),this.getLayoutTargetSize())}},setItemSize:function(b,a){if(b&&a.height>0){b.setSize(a)}}});Ext.Container.LAYOUTS.fit=Ext.layout.FitLayout;Ext.layout.CardLayout=Ext.extend(Ext.layout.FitLayout,{deferredRender:false,layoutOnCardChange:false,renderHidden:true,type:"card",setActiveItem:function(d){var a=this.activeItem,b=this.container;d=b.getComponent(d);if(d&&a!=d){if(a){a.hide();if(a.hidden!==true){return false}a.fireEvent("deactivate",a)}var c=d.doLayout&&(this.layoutOnCardChange||!d.rendered);this.activeItem=d;delete d.deferLayout;d.show();this.layout();if(c){d.doLayout()}d.fireEvent("activate",d)}},renderAll:function(a,b){if(this.deferredRender){this.renderItem(this.activeItem,undefined,b)}else{Ext.layout.CardLayout.superclass.renderAll.call(this,a,b)}}});Ext.Container.LAYOUTS.card=Ext.layout.CardLayout;Ext.layout.AnchorLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"anchor",defaultAnchor:"100%",parseAnchorRE:/^(r|right|b|bottom)$/i,getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a={};if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},onLayout:function(l,v){Ext.layout.AnchorLayout.superclass.onLayout.call(this,l,v);var o=this.getLayoutTargetSize(),j=o.width,n=o.height,p=v.getStyle("overflow"),m=this.getRenderedItems(l),s=m.length,f=[],h,a,u,k,g,c,e,d,t=0,r,b;if(j<20&&n<20){return}if(l.anchorSize){if(typeof l.anchorSize=="number"){a=l.anchorSize}else{a=l.anchorSize.width;u=l.anchorSize.height}}else{a=l.initialConfig.width;u=l.initialConfig.height}for(r=0;r<s;r++){k=m[r];b=k.getPositionEl();if(!k.anchor&&k.items&&!Ext.isNumber(k.width)&&!(Ext.isIE6&&Ext.isStrict)){k.anchor=this.defaultAnchor}if(k.anchor){g=k.anchorSpec;if(!g){d=k.anchor.split(" ");k.anchorSpec=g={right:this.parseAnchor(d[0],k.initialConfig.width,a),bottom:this.parseAnchor(d[1],k.initialConfig.height,u)}}c=g.right?this.adjustWidthAnchor(g.right(j)-b.getMargins("lr"),k):undefined;e=g.bottom?this.adjustHeightAnchor(g.bottom(n)-b.getMargins("tb"),k):undefined;if(c||e){f.push({component:k,width:c||undefined,height:e||undefined})}}}for(r=0,s=f.length;r<s;r++){h=f[r];h.component.setSize(h.width,h.height)}if(p&&p!="hidden"&&!this.adjustmentPass){var q=this.getLayoutTargetSize();if(q.width!=o.width||q.height!=o.height){this.adjustmentPass=true;this.onLayout(l,v)}}delete this.adjustmentPass},parseAnchor:function(c,g,b){if(c&&c!="none"){var e;if(this.parseAnchorRE.test(c)){var f=b-g;return function(a){if(a!==e){e=a;return a-f}}}else{if(c.indexOf("%")!=-1){var d=parseFloat(c.replace("%",""))*0.01;return function(a){if(a!==e){e=a;return Math.floor(a*d)}}}else{c=parseInt(c,10);if(!isNaN(c)){return function(a){if(a!==e){e=a;return a+c}}}}}}return false},adjustWidthAnchor:function(b,a){return b},adjustHeightAnchor:function(b,a){return b}});Ext.Container.LAYOUTS.anchor=Ext.layout.AnchorLayout;Ext.layout.ColumnLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"column",extraCls:"x-column",scrollOffset:0,targetCls:"x-column-layout-ct",isValidParent:function(b,a){return this.innerCt&&b.getPositionEl().dom.parentNode==this.innerCt.dom},getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a;if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},renderAll:function(a,b){if(!this.innerCt){this.innerCt=b.createChild({cls:"x-column-inner"});this.innerCt.createChild({cls:"x-clear"})}Ext.layout.ColumnLayout.superclass.renderAll.call(this,a,this.innerCt)},onLayout:function(e,j){var f=e.items.items,g=f.length,l,b,a,n=[];this.renderAll(e,j);var q=this.getLayoutTargetSize();if(q.width<1&&q.height<1){return}var o=q.width-this.scrollOffset,d=q.height,p=o;this.innerCt.setWidth(o);for(b=0;b<g;b++){l=f[b];a=l.getPositionEl().getMargins("lr");n[b]=a;if(!l.columnWidth){p-=(l.getWidth()+a)}}p=p<0?0:p;for(b=0;b<g;b++){l=f[b];a=n[b];if(l.columnWidth){l.setSize(Math.floor(l.columnWidth*p)-a)}}if(Ext.isIE){if(b=j.getStyle("overflow")&&b!="hidden"&&!this.adjustmentPass){var k=this.getLayoutTargetSize();if(k.width!=q.width){this.adjustmentPass=true;this.onLayout(e,j)}}}delete this.adjustmentPass}});Ext.Container.LAYOUTS.column=Ext.layout.ColumnLayout;Ext.layout.BorderLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,rendered:false,type:"border",targetCls:"x-border-layout-ct",getLayoutTargetSize:function(){var a=this.container.getLayoutTarget();return a?a.getViewSize():{}},onLayout:function(f,H){var g,A,E,l,v=f.items.items,B=v.length;if(!this.rendered){g=[];for(A=0;A<B;A++){E=v[A];l=E.region;if(E.collapsed){g.push(E)}E.collapsed=false;if(!E.rendered){E.render(H,A);E.getPositionEl().addClass("x-border-panel")}this[l]=l!="center"&&E.split?new Ext.layout.BorderLayout.SplitRegion(this,E.initialConfig,l):new Ext.layout.BorderLayout.Region(this,E.initialConfig,l);this[l].render(H,E)}this.rendered=true}var u=this.getLayoutTargetSize();if(u.width<20||u.height<20){if(g){this.restoreCollapsed=g}return}else{if(this.restoreCollapsed){g=this.restoreCollapsed;delete this.restoreCollapsed}}var r=u.width,C=u.height,q=r,z=C,o=0,p=0,x=this.north,t=this.south,k=this.west,D=this.east,E=this.center,G,y,d,F;if(!E&&Ext.layout.BorderLayout.WARN!==false){throw"No center region defined in BorderLayout "+f.id}if(x&&x.isVisible()){G=x.getSize();y=x.getMargins();G.width=r-(y.left+y.right);G.x=y.left;G.y=y.top;o=G.height+G.y+y.bottom;z-=o;x.applyLayout(G)}if(t&&t.isVisible()){G=t.getSize();y=t.getMargins();G.width=r-(y.left+y.right);G.x=y.left;F=(G.height+y.top+y.bottom);G.y=C-F+y.top;z-=F;t.applyLayout(G)}if(k&&k.isVisible()){G=k.getSize();y=k.getMargins();G.height=z-(y.top+y.bottom);G.x=y.left;G.y=o+y.top;d=(G.width+y.left+y.right);p+=d;q-=d;k.applyLayout(G)}if(D&&D.isVisible()){G=D.getSize();y=D.getMargins();G.height=z-(y.top+y.bottom);d=(G.width+y.left+y.right);G.x=r-d+y.left;G.y=o+y.top;q-=d;D.applyLayout(G)}if(E){y=E.getMargins();var j={x:p+y.left,y:o+y.top,width:q-(y.left+y.right),height:z-(y.top+y.bottom)};E.applyLayout(j)}if(g){for(A=0,B=g.length;A<B;A++){g[A].collapse(false)}}if(Ext.isIE&&Ext.isStrict){H.repaint()}if(A=H.getStyle("overflow")&&A!="hidden"&&!this.adjustmentPass){var a=this.getLayoutTargetSize();if(a.width!=u.width||a.height!=u.height){this.adjustmentPass=true;this.onLayout(f,H)}}delete this.adjustmentPass},destroy:function(){var b=["north","south","east","west"],a,c;for(a=0;a<b.length;a++){c=this[b[a]];if(c){if(c.destroy){c.destroy()}else{if(c.split){c.split.destroy(true)}}}}Ext.layout.BorderLayout.superclass.destroy.call(this)}});Ext.layout.BorderLayout.Region=function(b,a,c){Ext.apply(this,a);this.layout=b;this.position=c;this.state={};if(typeof this.margins=="string"){this.margins=this.layout.parseMargins(this.margins)}this.margins=Ext.applyIf(this.margins||{},this.defaultMargins);if(this.collapsible){if(typeof this.cmargins=="string"){this.cmargins=this.layout.parseMargins(this.cmargins)}if(this.collapseMode=="mini"&&!this.cmargins){this.cmargins={left:0,top:0,right:0,bottom:0}}else{this.cmargins=Ext.applyIf(this.cmargins||{},c=="north"||c=="south"?this.defaultNSCMargins:this.defaultEWCMargins)}}};Ext.layout.BorderLayout.Region.prototype={collapsible:false,split:false,floatable:true,minWidth:50,minHeight:50,defaultMargins:{left:0,top:0,right:0,bottom:0},defaultNSCMargins:{left:5,top:5,right:5,bottom:5},defaultEWCMargins:{left:5,top:0,right:5,bottom:0},floatingZIndex:100,isCollapsed:false,render:function(b,c){this.panel=c;c.el.enableDisplayMode();this.targetEl=b;this.el=c.el;var a=c.getState,d=this.position;c.getState=function(){return Ext.apply(a.call(c)||{},this.state)}.createDelegate(this);if(d!="center"){c.allowQueuedExpand=false;c.on({beforecollapse:this.beforeCollapse,collapse:this.onCollapse,beforeexpand:this.beforeExpand,expand:this.onExpand,hide:this.onHide,show:this.onShow,scope:this});if(this.collapsible||this.floatable){c.collapseEl="el";c.slideAnchor=this.getSlideAnchor()}if(c.tools&&c.tools.toggle){c.tools.toggle.addClass("x-tool-collapse-"+d);c.tools.toggle.addClassOnOver("x-tool-collapse-"+d+"-over")}}},getCollapsedEl:function(){if(!this.collapsedEl){if(!this.toolTemplate){var b=new Ext.Template('<div class="x-tool x-tool-{id}">&#160;</div>');b.disableFormats=true;b.compile();Ext.layout.BorderLayout.Region.prototype.toolTemplate=b}this.collapsedEl=this.targetEl.createChild({cls:"x-layout-collapsed x-layout-collapsed-"+this.position,id:this.panel.id+"-xcollapsed"});this.collapsedEl.enableDisplayMode("block");if(this.collapseMode=="mini"){this.collapsedEl.addClass("x-layout-cmini-"+this.position);this.miniCollapsedEl=this.collapsedEl.createChild({cls:"x-layout-mini x-layout-mini-"+this.position,html:"&#160;"});this.miniCollapsedEl.addClassOnOver("x-layout-mini-over");this.collapsedEl.addClassOnOver("x-layout-collapsed-over");this.collapsedEl.on("click",this.onExpandClick,this,{stopEvent:true})}else{if(this.collapsible!==false&&!this.hideCollapseTool){var a=this.expandToolEl=this.toolTemplate.append(this.collapsedEl.dom,{id:"expand-"+this.position},true);a.addClassOnOver("x-tool-expand-"+this.position+"-over");a.on("click",this.onExpandClick,this,{stopEvent:true})}if(this.floatable!==false||this.titleCollapse){this.collapsedEl.addClassOnOver("x-layout-collapsed-over");this.collapsedEl.on("click",this[this.floatable?"collapseClick":"onExpandClick"],this)}}}return this.collapsedEl},onExpandClick:function(a){if(this.isSlid){this.panel.expand(false)}else{this.panel.expand()}},onCollapseClick:function(a){this.panel.collapse()},beforeCollapse:function(c,a){this.lastAnim=a;if(this.splitEl){this.splitEl.hide()}this.getCollapsedEl().show();var b=this.panel.getEl();this.originalZIndex=b.getStyle("z-index");b.setStyle("z-index",100);this.isCollapsed=true;this.layout.layout()},onCollapse:function(a){this.panel.el.setStyle("z-index",1);if(this.lastAnim===false||this.panel.animCollapse===false){this.getCollapsedEl().dom.style.visibility="visible"}else{this.getCollapsedEl().slideIn(this.panel.slideAnchor,{duration:0.2})}this.state.collapsed=true;this.panel.saveState()},beforeExpand:function(a){if(this.isSlid){this.afterSlideIn()}var b=this.getCollapsedEl();this.el.show();if(this.position=="east"||this.position=="west"){this.panel.setSize(undefined,b.getHeight())}else{this.panel.setSize(b.getWidth(),undefined)}b.hide();b.dom.style.visibility="hidden";this.panel.el.setStyle("z-index",this.floatingZIndex)},onExpand:function(){this.isCollapsed=false;if(this.splitEl){this.splitEl.show()}this.layout.layout();this.panel.el.setStyle("z-index",this.originalZIndex);this.state.collapsed=false;this.panel.saveState()},collapseClick:function(a){if(this.isSlid){a.stopPropagation();this.slideIn()}else{a.stopPropagation();this.slideOut()}},onHide:function(){if(this.isCollapsed){this.getCollapsedEl().hide()}else{if(this.splitEl){this.splitEl.hide()}}},onShow:function(){if(this.isCollapsed){this.getCollapsedEl().show()}else{if(this.splitEl){this.splitEl.show()}}},isVisible:function(){return !this.panel.hidden},getMargins:function(){return this.isCollapsed&&this.cmargins?this.cmargins:this.margins},getSize:function(){return this.isCollapsed?this.getCollapsedEl().getSize():this.panel.getSize()},setPanel:function(a){this.panel=a},getMinWidth:function(){return this.minWidth},getMinHeight:function(){return this.minHeight},applyLayoutCollapsed:function(a){var b=this.getCollapsedEl();b.setLeftTop(a.x,a.y);b.setSize(a.width,a.height)},applyLayout:function(a){if(this.isCollapsed){this.applyLayoutCollapsed(a)}else{this.panel.setPosition(a.x,a.y);this.panel.setSize(a.width,a.height)}},beforeSlide:function(){this.panel.beforeEffect()},afterSlide:function(){this.panel.afterEffect()},initAutoHide:function(){if(this.autoHide!==false){if(!this.autoHideHd){this.autoHideSlideTask=new Ext.util.DelayedTask(this.slideIn,this);this.autoHideHd={mouseout:function(a){if(!a.within(this.el,true)){this.autoHideSlideTask.delay(500)}},mouseover:function(a){this.autoHideSlideTask.cancel()},scope:this}}this.el.on(this.autoHideHd);this.collapsedEl.on(this.autoHideHd)}},clearAutoHide:function(){if(this.autoHide!==false){this.el.un("mouseout",this.autoHideHd.mouseout);this.el.un("mouseover",this.autoHideHd.mouseover);this.collapsedEl.un("mouseout",this.autoHideHd.mouseout);this.collapsedEl.un("mouseover",this.autoHideHd.mouseover)}},clearMonitor:function(){Ext.getDoc().un("click",this.slideInIf,this)},slideOut:function(){if(this.isSlid||this.el.hasActiveFx()){return}this.isSlid=true;var b=this.panel.tools,c,a;if(b&&b.toggle){b.toggle.hide()}this.el.show();a=this.panel.collapsed;this.panel.collapsed=false;if(this.position=="east"||this.position=="west"){c=this.panel.deferHeight;this.panel.deferHeight=false;this.panel.setSize(undefined,this.collapsedEl.getHeight());this.panel.deferHeight=c}else{this.panel.setSize(this.collapsedEl.getWidth(),undefined)}this.panel.collapsed=a;this.restoreLT=[this.el.dom.style.left,this.el.dom.style.top];this.el.alignTo(this.collapsedEl,this.getCollapseAnchor());this.el.setStyle("z-index",this.floatingZIndex+2);this.panel.el.replaceClass("x-panel-collapsed","x-panel-floating");if(this.animFloat!==false){this.beforeSlide();this.el.slideIn(this.getSlideAnchor(),{callback:function(){this.afterSlide();this.initAutoHide();Ext.getDoc().on("click",this.slideInIf,this)},scope:this,block:true})}else{this.initAutoHide();Ext.getDoc().on("click",this.slideInIf,this)}},afterSlideIn:function(){this.clearAutoHide();this.isSlid=false;this.clearMonitor();this.el.setStyle("z-index","");this.panel.el.replaceClass("x-panel-floating","x-panel-collapsed");this.el.dom.style.left=this.restoreLT[0];this.el.dom.style.top=this.restoreLT[1];var a=this.panel.tools;if(a&&a.toggle){a.toggle.show()}},slideIn:function(a){if(!this.isSlid||this.el.hasActiveFx()){Ext.callback(a);return}this.isSlid=false;if(this.animFloat!==false){this.beforeSlide();this.el.slideOut(this.getSlideAnchor(),{callback:function(){this.el.hide();this.afterSlide();this.afterSlideIn();Ext.callback(a)},scope:this,block:true})}else{this.el.hide();this.afterSlideIn()}},slideInIf:function(a){if(!a.within(this.el)){this.slideIn()}},anchors:{west:"left",east:"right",north:"top",south:"bottom"},sanchors:{west:"l",east:"r",north:"t",south:"b"},canchors:{west:"tl-tr",east:"tr-tl",north:"tl-bl",south:"bl-tl"},getAnchor:function(){return this.anchors[this.position]},getCollapseAnchor:function(){return this.canchors[this.position]},getSlideAnchor:function(){return this.sanchors[this.position]},getAlignAdj:function(){var a=this.cmargins;switch(this.position){case"west":return[0,0];break;case"east":return[0,0];break;case"north":return[0,0];break;case"south":return[0,0];break}},getExpandAdj:function(){var b=this.collapsedEl,a=this.cmargins;switch(this.position){case"west":return[-(a.right+b.getWidth()+a.left),0];break;case"east":return[a.right+b.getWidth()+a.left,0];break;case"north":return[0,-(a.top+a.bottom+b.getHeight())];break;case"south":return[0,a.top+a.bottom+b.getHeight()];break}},destroy:function(){if(this.autoHideSlideTask&&this.autoHideSlideTask.cancel){this.autoHideSlideTask.cancel()}Ext.destroyMembers(this,"miniCollapsedEl","collapsedEl","expandToolEl")}};Ext.layout.BorderLayout.SplitRegion=function(b,a,c){Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this,b,a,c);this.applyLayout=this.applyFns[c]};Ext.extend(Ext.layout.BorderLayout.SplitRegion,Ext.layout.BorderLayout.Region,{splitTip:"Drag to resize.",collapsibleSplitTip:"Drag to resize. Double click to hide.",useSplitTips:false,splitSettings:{north:{orientation:Ext.SplitBar.VERTICAL,placement:Ext.SplitBar.TOP,maxFn:"getVMaxSize",minProp:"minHeight",maxProp:"maxHeight"},south:{orientation:Ext.SplitBar.VERTICAL,placement:Ext.SplitBar.BOTTOM,maxFn:"getVMaxSize",minProp:"minHeight",maxProp:"maxHeight"},east:{orientation:Ext.SplitBar.HORIZONTAL,placement:Ext.SplitBar.RIGHT,maxFn:"getHMaxSize",minProp:"minWidth",maxProp:"maxWidth"},west:{orientation:Ext.SplitBar.HORIZONTAL,placement:Ext.SplitBar.LEFT,maxFn:"getHMaxSize",minProp:"minWidth",maxProp:"maxWidth"}},applyFns:{west:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;this.panel.setPosition(c.x,c.y);var a=d.offsetWidth;b.left=(c.x+c.width-a)+"px";b.top=(c.y)+"px";b.height=Math.max(0,c.height)+"px";this.panel.setSize(c.width-a,c.height)},east:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetWidth;this.panel.setPosition(c.x+a,c.y);b.left=(c.x)+"px";b.top=(c.y)+"px";b.height=Math.max(0,c.height)+"px";this.panel.setSize(c.width-a,c.height)},north:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetHeight;this.panel.setPosition(c.x,c.y);b.left=(c.x)+"px";b.top=(c.y+c.height-a)+"px";b.width=Math.max(0,c.width)+"px";this.panel.setSize(c.width,c.height-a)},south:function(c){if(this.isCollapsed){return this.applyLayoutCollapsed(c)}var d=this.splitEl.dom,b=d.style;var a=d.offsetHeight;this.panel.setPosition(c.x,c.y+a);b.left=(c.x)+"px";b.top=(c.y)+"px";b.width=Math.max(0,c.width)+"px";this.panel.setSize(c.width,c.height-a)}},render:function(a,c){Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this,a,c);var d=this.position;this.splitEl=a.createChild({cls:"x-layout-split x-layout-split-"+d,html:"&#160;",id:this.panel.id+"-xsplit"});if(this.collapseMode=="mini"){this.miniSplitEl=this.splitEl.createChild({cls:"x-layout-mini x-layout-mini-"+d,html:"&#160;"});this.miniSplitEl.addClassOnOver("x-layout-mini-over");this.miniSplitEl.on("click",this.onCollapseClick,this,{stopEvent:true})}var b=this.splitSettings[d];this.split=new Ext.SplitBar(this.splitEl.dom,c.el,b.orientation);this.split.tickSize=this.tickSize;this.split.placement=b.placement;this.split.getMaximumSize=this[b.maxFn].createDelegate(this);this.split.minSize=this.minSize||this[b.minProp];this.split.on("beforeapply",this.onSplitMove,this);this.split.useShim=this.useShim===true;this.maxSize=this.maxSize||this[b.maxProp];if(c.hidden){this.splitEl.hide()}if(this.useSplitTips){this.splitEl.dom.title=this.collapsible?this.collapsibleSplitTip:this.splitTip}if(this.collapsible){this.splitEl.on("dblclick",this.onCollapseClick,this)}},getSize:function(){if(this.isCollapsed){return this.collapsedEl.getSize()}var a=this.panel.getSize();if(this.position=="north"||this.position=="south"){a.height+=this.splitEl.dom.offsetHeight}else{a.width+=this.splitEl.dom.offsetWidth}return a},getHMaxSize:function(){var b=this.maxSize||10000;var a=this.layout.center;return Math.min(b,(this.el.getWidth()+a.el.getWidth())-a.getMinWidth())},getVMaxSize:function(){var b=this.maxSize||10000;var a=this.layout.center;return Math.min(b,(this.el.getHeight()+a.el.getHeight())-a.getMinHeight())},onSplitMove:function(b,a){var c=this.panel.getSize();this.lastSplitSize=a;if(this.position=="north"||this.position=="south"){this.panel.setSize(c.width,a);this.state.height=a}else{this.panel.setSize(a,c.height);this.state.width=a}this.layout.layout();this.panel.saveState();return false},getSplitBar:function(){return this.split},destroy:function(){Ext.destroy(this.miniSplitEl,this.split,this.splitEl);Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.border=Ext.layout.BorderLayout;Ext.layout.FormLayout=Ext.extend(Ext.layout.AnchorLayout,{labelSeparator:":",trackLabels:true,type:"form",onRemove:function(d){Ext.layout.FormLayout.superclass.onRemove.call(this,d);if(this.trackLabels){d.un("show",this.onFieldShow,this);d.un("hide",this.onFieldHide,this)}var b=d.getPositionEl(),a=d.getItemCt&&d.getItemCt();if(d.rendered&&a){if(b&&b.dom){b.insertAfter(a)}Ext.destroy(a);Ext.destroyMembers(d,"label","itemCt");if(d.customItemCt){Ext.destroyMembers(d,"getItemCt","customItemCt")}}},setContainer:function(a){Ext.layout.FormLayout.superclass.setContainer.call(this,a);if(a.labelAlign){a.addClass("x-form-label-"+a.labelAlign)}if(a.hideLabels){Ext.apply(this,{labelStyle:"display:none",elementStyle:"padding-left:0;",labelAdjust:0})}else{this.labelSeparator=Ext.isDefined(a.labelSeparator)?a.labelSeparator:this.labelSeparator;a.labelWidth=a.labelWidth||100;if(Ext.isNumber(a.labelWidth)){var b=Ext.isNumber(a.labelPad)?a.labelPad:5;Ext.apply(this,{labelAdjust:a.labelWidth+b,labelStyle:"width:"+a.labelWidth+"px;",elementStyle:"padding-left:"+(a.labelWidth+b)+"px"})}if(a.labelAlign=="top"){Ext.apply(this,{labelStyle:"width:auto;",labelAdjust:0,elementStyle:"padding-left:0;"})}}},isHide:function(a){return a.hideLabel||this.container.hideLabels},onFieldShow:function(a){a.getItemCt().removeClass("x-hide-"+a.hideMode);if(a.isComposite){a.doLayout()}},onFieldHide:function(a){a.getItemCt().addClass("x-hide-"+a.hideMode)},getLabelStyle:function(e){var b="",c=[this.labelStyle,e];for(var d=0,a=c.length;d<a;++d){if(c[d]){b+=c[d];if(b.substr(-1,1)!=";"){b+=";"}}}return b},renderItem:function(e,a,d){if(e&&(e.isFormField||e.fieldLabel)&&e.inputType!="hidden"){var b=this.getTemplateArgs(e);if(Ext.isNumber(a)){a=d.dom.childNodes[a]||null}if(a){e.itemCt=this.fieldTpl.insertBefore(a,b,true)}else{e.itemCt=this.fieldTpl.append(d,b,true)}if(!e.getItemCt){Ext.apply(e,{getItemCt:function(){return e.itemCt},customItemCt:true})}e.label=e.getItemCt().child("label.x-form-item-label");if(!e.rendered){e.render("x-form-el-"+e.id)}else{if(!this.isValidParent(e,d)){Ext.fly("x-form-el-"+e.id).appendChild(e.getPositionEl())}}if(this.trackLabels){if(e.hidden){this.onFieldHide(e)}e.on({scope:this,show:this.onFieldShow,hide:this.onFieldHide})}this.configureItem(e)}else{Ext.layout.FormLayout.superclass.renderItem.apply(this,arguments)}},getTemplateArgs:function(c){var a=!c.fieldLabel||c.hideLabel,b=(c.itemCls||this.container.itemCls||"")+(c.hideLabel?" x-hide-label":"");if(Ext.isIE9&&Ext.isIEQuirks&&c instanceof Ext.form.TextField){b+=" x-input-wrapper"}return{id:c.id,label:c.fieldLabel,itemCls:b,clearCls:c.clearCls||"x-form-clear-left",labelStyle:this.getLabelStyle(c.labelStyle),elementStyle:this.elementStyle||"",labelSeparator:a?"":(Ext.isDefined(c.labelSeparator)?c.labelSeparator:this.labelSeparator)}},adjustWidthAnchor:function(a,d){if(d.label&&!this.isHide(d)&&(this.container.labelAlign!="top")){var b=Ext.isIE6||(Ext.isIE&&!Ext.isStrict);return a-this.labelAdjust+(b?-3:0)}return a},adjustHeightAnchor:function(a,b){if(b.label&&!this.isHide(b)&&(this.container.labelAlign=="top")){return a-b.label.getHeight()}return a},isValidParent:function(b,a){return a&&this.container.getEl().contains(b.getPositionEl())}});Ext.Container.LAYOUTS.form=Ext.layout.FormLayout;Ext.layout.AccordionLayout=Ext.extend(Ext.layout.FitLayout,{fill:true,autoWidth:true,titleCollapse:true,hideCollapseTool:false,collapseFirst:false,animate:false,sequence:false,activeOnTop:false,type:"accordion",renderItem:function(a){if(this.animate===false){a.animCollapse=false}a.collapsible=true;if(this.autoWidth){a.autoWidth=true}if(this.titleCollapse){a.titleCollapse=true}if(this.hideCollapseTool){a.hideCollapseTool=true}if(this.collapseFirst!==undefined){a.collapseFirst=this.collapseFirst}if(!this.activeItem&&!a.collapsed){this.setActiveItem(a,true)}else{if(this.activeItem&&this.activeItem!=a){a.collapsed=true}}Ext.layout.AccordionLayout.superclass.renderItem.apply(this,arguments);a.header.addClass("x-accordion-hd");a.on("beforeexpand",this.beforeExpand,this)},onRemove:function(a){Ext.layout.AccordionLayout.superclass.onRemove.call(this,a);if(a.rendered){a.header.removeClass("x-accordion-hd")}a.un("beforeexpand",this.beforeExpand,this)},beforeExpand:function(c,b){var a=this.activeItem;if(a){if(this.sequence){delete this.activeItem;if(!a.collapsed){a.collapse({callback:function(){c.expand(b||true)},scope:this});return false}}else{a.collapse(this.animate)}}this.setActive(c);if(this.activeOnTop){c.el.dom.parentNode.insertBefore(c.el.dom,c.el.dom.parentNode.firstChild)}this.layout()},setItemSize:function(f,e){if(this.fill&&f){var d=0,c,b=this.getRenderedItems(this.container),a=b.length,g;for(c=0;c<a;c++){if((g=b[c])!=f&&!g.hidden){d+=g.header.getHeight()}}e.height-=d;f.setSize(e)}},setActiveItem:function(a){this.setActive(a,true)},setActive:function(c,b){var a=this.activeItem;c=this.container.getComponent(c);if(a!=c){if(c.rendered&&c.collapsed&&b){c.expand()}else{if(a){a.fireEvent("deactivate",a)}this.activeItem=c;c.fireEvent("activate",c)}}}});Ext.Container.LAYOUTS.accordion=Ext.layout.AccordionLayout;Ext.layout.Accordion=Ext.layout.AccordionLayout;Ext.layout.TableLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:false,type:"table",targetCls:"x-table-layout-ct",tableAttrs:null,setContainer:function(a){Ext.layout.TableLayout.superclass.setContainer.call(this,a);this.currentRow=0;this.currentColumn=0;this.cells=[]},onLayout:function(d,f){var e=d.items.items,a=e.length,g,b;if(!this.table){f.addClass("x-table-layout-ct");this.table=f.createChild(Ext.apply({tag:"table",cls:"x-table-layout",cellspacing:0,cn:{tag:"tbody"}},this.tableAttrs),null,true)}this.renderAll(d,f)},getRow:function(a){var b=this.table.tBodies[0].childNodes[a];if(!b){b=document.createElement("tr");this.table.tBodies[0].appendChild(b)}return b},getNextCell:function(i){var a=this.getNextNonSpan(this.currentColumn,this.currentRow);var f=this.currentColumn=a[0],e=this.currentRow=a[1];for(var h=e;h<e+(i.rowspan||1);h++){if(!this.cells[h]){this.cells[h]=[]}for(var d=f;d<f+(i.colspan||1);d++){this.cells[h][d]=true}}var g=document.createElement("td");if(i.cellId){g.id=i.cellId}var b="x-table-layout-cell";if(i.cellCls){b+=" "+i.cellCls}g.className=b;if(i.colspan){g.colSpan=i.colspan}if(i.rowspan){g.rowSpan=i.rowspan}this.getRow(e).appendChild(g);return g},getNextNonSpan:function(a,c){var b=this.columns;while((b&&a>=b)||(this.cells[c]&&this.cells[c][a])){if(b&&a>=b){c++;a=0}else{a++}}return[a,c]},renderItem:function(e,a,d){if(!this.table){this.table=d.createChild(Ext.apply({tag:"table",cls:"x-table-layout",cellspacing:0,cn:{tag:"tbody"}},this.tableAttrs),null,true)}if(e&&!e.rendered){e.render(this.getNextCell(e));this.configureItem(e)}else{if(e&&!this.isValidParent(e,d)){var b=this.getNextCell(e);b.insertBefore(e.getPositionEl().dom,null);e.container=Ext.get(b);this.configureItem(e)}}},isValidParent:function(b,a){return b.getPositionEl().up("table",5).dom.parentNode===(a.dom||a)},destroy:function(){delete this.table;Ext.layout.TableLayout.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.table=Ext.layout.TableLayout;Ext.layout.AbsoluteLayout=Ext.extend(Ext.layout.AnchorLayout,{extraCls:"x-abs-layout-item",type:"absolute",onLayout:function(a,b){b.position();this.paddingLeft=b.getPadding("l");this.paddingTop=b.getPadding("t");Ext.layout.AbsoluteLayout.superclass.onLayout.call(this,a,b)},adjustWidthAnchor:function(b,a){return b?b-a.getPosition(true)[0]+this.paddingLeft:b},adjustHeightAnchor:function(b,a){return b?b-a.getPosition(true)[1]+this.paddingTop:b}});Ext.Container.LAYOUTS.absolute=Ext.layout.AbsoluteLayout;Ext.layout.BoxLayout=Ext.extend(Ext.layout.ContainerLayout,{defaultMargins:{left:0,top:0,right:0,bottom:0},padding:"0",pack:"start",monitorResize:true,type:"box",scrollOffset:0,extraCls:"x-box-item",targetCls:"x-box-layout-ct",innerCls:"x-box-inner",constructor:function(a){Ext.layout.BoxLayout.superclass.constructor.call(this,a);if(Ext.isString(this.defaultMargins)){this.defaultMargins=this.parseMargins(this.defaultMargins)}var d=this.overflowHandler;if(typeof d=="string"){d={type:d}}var c="none";if(d&&d.type!=undefined){c=d.type}var b=Ext.layout.boxOverflow[c];if(b[this.type]){b=b[this.type]}this.overflowHandler=new b(this,d)},onLayout:function(b,g){Ext.layout.BoxLayout.superclass.onLayout.call(this,b,g);var d=this.getLayoutTargetSize(),h=this.getVisibleItems(b),c=this.calculateChildBoxes(h,d),f=c.boxes,i=c.meta;if(d.width>0){var j=this.overflowHandler,a=i.tooNarrow?"handleOverflow":"clearOverflow";var e=j[a](c,d);if(e){if(e.targetSize){d=e.targetSize}if(e.recalculate){h=this.getVisibleItems(b);c=this.calculateChildBoxes(h,d);f=c.boxes}}}this.layoutTargetLastSize=d;this.childBoxCache=c;this.updateInnerCtSize(d,c);this.updateChildBoxes(f);this.handleTargetOverflow(d,b,g)},updateChildBoxes:function(c){for(var b=0,e=c.length;b<e;b++){var d=c[b],a=d.component;if(d.dirtySize){a.setSize(d.width,d.height)}if(isNaN(d.left)||isNaN(d.top)){continue}a.setPosition(d.left,d.top)}},updateInnerCtSize:function(c,g){var h=this.align,f=this.padding,e=c.width,a=c.height;if(this.type=="hbox"){var b=e,d=g.meta.maxHeight+f.top+f.bottom;if(h=="stretch"){d=a}else{if(h=="middle"){d=Math.max(a,d)}}}else{var d=a,b=g.meta.maxWidth+f.left+f.right;if(h=="stretch"){b=e}else{if(h=="center"){b=Math.max(e,b)}}}this.innerCt.setSize(b||undefined,d||undefined)},handleTargetOverflow:function(d,a,c){var e=c.getStyle("overflow");if(e&&e!="hidden"&&!this.adjustmentPass){var b=this.getLayoutTargetSize();if(b.width!=d.width||b.height!=d.height){this.adjustmentPass=true;this.onLayout(a,c)}}delete this.adjustmentPass},isValidParent:function(b,a){return this.innerCt&&b.getPositionEl().dom.parentNode==this.innerCt.dom},getVisibleItems:function(f){var f=f||this.container,e=f.getLayoutTarget(),g=f.items.items,a=g.length,d,h,b=[];for(d=0;d<a;d++){if((h=g[d]).rendered&&this.isValidParent(h,e)&&h.hidden!==true&&h.collapsed!==true&&h.shouldLayout!==false){b.push(h)}}return b},renderAll:function(a,b){if(!this.innerCt){this.innerCt=b.createChild({cls:this.innerCls});this.padding=this.parseMargins(this.padding)}Ext.layout.BoxLayout.superclass.renderAll.call(this,a,this.innerCt)},getLayoutTargetSize:function(){var b=this.container.getLayoutTarget(),a;if(b){a=b.getViewSize();if(Ext.isIE&&Ext.isStrict&&a.width==0){a=b.getStyleSize()}a.width-=b.getPadding("lr");a.height-=b.getPadding("tb")}return a},renderItem:function(a){if(Ext.isString(a.margins)){a.margins=this.parseMargins(a.margins)}else{if(!a.margins){a.margins=this.defaultMargins}}Ext.layout.BoxLayout.superclass.renderItem.apply(this,arguments)},destroy:function(){Ext.destroy(this.overflowHandler);Ext.layout.BoxLayout.superclass.destroy.apply(this,arguments)}});Ext.layout.boxOverflow.None=Ext.extend(Object,{constructor:function(b,a){this.layout=b;Ext.apply(this,a||{})},handleOverflow:Ext.emptyFn,clearOverflow:Ext.emptyFn});Ext.layout.boxOverflow.none=Ext.layout.boxOverflow.None;Ext.layout.boxOverflow.Menu=Ext.extend(Ext.layout.boxOverflow.None,{afterCls:"x-strip-right",noItemsMenuText:'<div class="x-toolbar-no-items">(None)</div>',constructor:function(a){Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this,arguments);this.menuItems=[]},createInnerElements:function(){if(!this.afterCt){this.afterCt=this.layout.innerCt.insertSibling({cls:this.afterCls},"before")}},clearOverflow:function(a,f){var e=f.width+(this.afterCt?this.afterCt.getWidth():0),b=this.menuItems;this.hideTrigger();for(var c=0,d=b.length;c<d;c++){b.pop().component.show()}return{targetSize:{height:f.height,width:e}}},showTrigger:function(){this.createMenu();this.menuTrigger.show()},hideTrigger:function(){if(this.menuTrigger!=undefined){this.menuTrigger.hide()}},beforeMenuShow:function(g){var b=this.menuItems,a=b.length,f,e;var c=function(i,h){return i.isXType("buttongroup")&&!(h instanceof Ext.Toolbar.Separator)};this.clearMenu();g.removeAll();for(var d=0;d<a;d++){f=b[d].component;if(e&&(c(f,e)||c(e,f))){g.add("-")}this.addComponentToMenu(g,f);e=f}if(g.items.length<1){g.add(this.noItemsMenuText)}},createMenuConfig:function(c,a){var b=Ext.apply({},c.initialConfig),d=c.toggleGroup;Ext.copyTo(b,c,["iconCls","icon","itemId","disabled","handler","scope","menu"]);Ext.apply(b,{text:c.overflowText||c.text,hideOnClick:a});if(d||c.enableToggle){Ext.apply(b,{group:d,checked:c.pressed,listeners:{checkchange:function(f,e){c.toggle(e)}}})}delete b.ownerCt;delete b.xtype;delete b.id;return b},addComponentToMenu:function(b,a){if(a instanceof Ext.Toolbar.Separator){b.add("-")}else{if(Ext.isFunction(a.isXType)){if(a.isXType("splitbutton")){b.add(this.createMenuConfig(a,true))}else{if(a.isXType("button")){b.add(this.createMenuConfig(a,!a.menu))}else{if(a.isXType("buttongroup")){a.items.each(function(c){this.addComponentToMenu(b,c)},this)}}}}}},clearMenu:function(){var a=this.moreMenu;if(a&&a.items){a.items.each(function(b){delete b.menu})}},createMenu:function(){if(!this.menuTrigger){this.createInnerElements();this.menu=new Ext.menu.Menu({ownerCt:this.layout.container,listeners:{scope:this,beforeshow:this.beforeMenuShow}});this.menuTrigger=new Ext.Button({iconCls:"x-toolbar-more-icon",cls:"x-toolbar-more",menu:this.menu,renderTo:this.afterCt})}},destroy:function(){Ext.destroy(this.menu,this.menuTrigger)}});Ext.layout.boxOverflow.menu=Ext.layout.boxOverflow.Menu;Ext.layout.boxOverflow.HorizontalMenu=Ext.extend(Ext.layout.boxOverflow.Menu,{constructor:function(){Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this,arguments);var c=this,b=c.layout,a=b.calculateChildBoxes;b.calculateChildBoxes=function(d,h){var k=a.apply(b,arguments),j=k.meta,e=c.menuItems;var i=0;for(var f=0,g=e.length;f<g;f++){i+=e[f].width}j.minimumWidth+=i;j.tooNarrow=j.minimumWidth>h.width;return k}},handleOverflow:function(d,g){this.showTrigger();var j=g.width-this.afterCt.getWidth(),k=d.boxes,e=0,q=false;for(var n=0,c=k.length;n<c;n++){e+=k[n].width}var a=j-e,f=0;for(var n=0,c=this.menuItems.length;n<c;n++){var m=this.menuItems[n],l=m.component,b=m.width;if(b<a){l.show();a-=b;f++;q=true}else{break}}if(q){this.menuItems=this.menuItems.slice(f)}else{for(var h=k.length-1;h>=0;h--){var p=k[h].component,o=k[h].left+k[h].width;if(o>=j){this.menuItems.unshift({component:p,width:k[h].width});p.hide()}else{break}}}if(this.menuItems.length==0){this.hideTrigger()}return{targetSize:{height:g.height,width:j},recalculate:q}}});Ext.layout.boxOverflow.menu.hbox=Ext.layout.boxOverflow.HorizontalMenu;Ext.layout.boxOverflow.Scroller=Ext.extend(Ext.layout.boxOverflow.None,{animateScroll:true,scrollIncrement:100,wheelIncrement:3,scrollRepeatInterval:400,scrollDuration:0.4,beforeCls:"x-strip-left",afterCls:"x-strip-right",scrollerCls:"x-strip-scroller",beforeScrollerCls:"x-strip-scroller-left",afterScrollerCls:"x-strip-scroller-right",createWheelListener:function(){this.layout.innerCt.on({scope:this,mousewheel:function(a){a.stopEvent();this.scrollBy(a.getWheelDelta()*this.wheelIncrement*-1,false)}})},handleOverflow:function(a,b){this.createInnerElements();this.showScrollers()},clearOverflow:function(){this.hideScrollers()},showScrollers:function(){this.createScrollers();this.beforeScroller.show();this.afterScroller.show();this.updateScrollButtons()},hideScrollers:function(){if(this.beforeScroller!=undefined){this.beforeScroller.hide();this.afterScroller.hide()}},createScrollers:function(){if(!this.beforeScroller&&!this.afterScroller){var a=this.beforeCt.createChild({cls:String.format("{0} {1} ",this.scrollerCls,this.beforeScrollerCls)});var b=this.afterCt.createChild({cls:String.format("{0} {1}",this.scrollerCls,this.afterScrollerCls)});a.addClassOnOver(this.beforeScrollerCls+"-hover");b.addClassOnOver(this.afterScrollerCls+"-hover");a.setVisibilityMode(Ext.Element.DISPLAY);b.setVisibilityMode(Ext.Element.DISPLAY);this.beforeRepeater=new Ext.util.ClickRepeater(a,{interval:this.scrollRepeatInterval,handler:this.scrollLeft,scope:this});this.afterRepeater=new Ext.util.ClickRepeater(b,{interval:this.scrollRepeatInterval,handler:this.scrollRight,scope:this});this.beforeScroller=a;this.afterScroller=b}},destroy:function(){Ext.destroy(this.beforeScroller,this.afterScroller,this.beforeRepeater,this.afterRepeater,this.beforeCt,this.afterCt)},scrollBy:function(b,a){this.scrollTo(this.getScrollPosition()+b,a)},getItem:function(a){if(Ext.isString(a)){a=Ext.getCmp(a)}else{if(Ext.isNumber(a)){a=this.items[a]}}return a},getScrollAnim:function(){return{duration:this.scrollDuration,callback:this.updateScrollButtons,scope:this}},updateScrollButtons:function(){if(this.beforeScroller==undefined||this.afterScroller==undefined){return}var d=this.atExtremeBefore()?"addClass":"removeClass",c=this.atExtremeAfter()?"addClass":"removeClass",a=this.beforeScrollerCls+"-disabled",b=this.afterScrollerCls+"-disabled";this.beforeScroller[d](a);this.afterScroller[c](b);this.scrolling=false},atExtremeBefore:function(){return this.getScrollPosition()===0},scrollLeft:function(a){this.scrollBy(-this.scrollIncrement,a)},scrollRight:function(a){this.scrollBy(this.scrollIncrement,a)},scrollToItem:function(d,b){d=this.getItem(d);if(d!=undefined){var a=this.getItemVisibility(d);if(!a.fullyVisible){var c=d.getBox(true,true),e=c.x;if(a.hiddenRight){e-=(this.layout.innerCt.getWidth()-c.width)}this.scrollTo(e,b)}}},getItemVisibility:function(e){var d=this.getItem(e).getBox(true,true),a=d.x,c=d.x+d.width,f=this.getScrollPosition(),b=this.layout.innerCt.getWidth()+f;return{hiddenLeft:a<f,hiddenRight:c>b,fullyVisible:a>f&&c<b}}});Ext.layout.boxOverflow.scroller=Ext.layout.boxOverflow.Scroller;Ext.layout.boxOverflow.VerticalScroller=Ext.extend(Ext.layout.boxOverflow.Scroller,{scrollIncrement:75,wheelIncrement:2,handleOverflow:function(a,b){Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this,arguments);return{targetSize:{height:b.height-(this.beforeCt.getHeight()+this.afterCt.getHeight()),width:b.width}}},createInnerElements:function(){var a=this.layout.innerCt;if(!this.beforeCt){this.beforeCt=a.insertSibling({cls:this.beforeCls},"before");this.afterCt=a.insertSibling({cls:this.afterCls},"after");this.createWheelListener()}},scrollTo:function(a,b){var d=this.getScrollPosition(),c=a.constrain(0,this.getMaxScrollBottom());if(c!=d&&!this.scrolling){if(b==undefined){b=this.animateScroll}this.layout.innerCt.scrollTo("top",c,b?this.getScrollAnim():false);if(b){this.scrolling=true}else{this.scrolling=false;this.updateScrollButtons()}}},getScrollPosition:function(){return parseInt(this.layout.innerCt.dom.scrollTop,10)||0},getMaxScrollBottom:function(){return this.layout.innerCt.dom.scrollHeight-this.layout.innerCt.getHeight()},atExtremeAfter:function(){return this.getScrollPosition()>=this.getMaxScrollBottom()}});Ext.layout.boxOverflow.scroller.vbox=Ext.layout.boxOverflow.VerticalScroller;Ext.layout.boxOverflow.HorizontalScroller=Ext.extend(Ext.layout.boxOverflow.Scroller,{handleOverflow:function(a,b){Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this,arguments);return{targetSize:{height:b.height,width:b.width-(this.beforeCt.getWidth()+this.afterCt.getWidth())}}},createInnerElements:function(){var a=this.layout.innerCt;if(!this.beforeCt){this.afterCt=a.insertSibling({cls:this.afterCls},"before");this.beforeCt=a.insertSibling({cls:this.beforeCls},"before");this.createWheelListener()}},scrollTo:function(a,b){var d=this.getScrollPosition(),c=a.constrain(0,this.getMaxScrollRight());if(c!=d&&!this.scrolling){if(b==undefined){b=this.animateScroll}this.layout.innerCt.scrollTo("left",c,b?this.getScrollAnim():false);if(b){this.scrolling=true}else{this.scrolling=false;this.updateScrollButtons()}}},getScrollPosition:function(){return parseInt(this.layout.innerCt.dom.scrollLeft,10)||0},getMaxScrollRight:function(){return this.layout.innerCt.dom.scrollWidth-this.layout.innerCt.getWidth()},atExtremeAfter:function(){return this.getScrollPosition()>=this.getMaxScrollRight()}});Ext.layout.boxOverflow.scroller.hbox=Ext.layout.boxOverflow.HorizontalScroller;Ext.layout.HBoxLayout=Ext.extend(Ext.layout.BoxLayout,{align:"top",type:"hbox",calculateChildBoxes:function(q,b){var E=q.length,Q=this.padding,C=Q.top,T=Q.left,x=C+Q.bottom,N=T+Q.right,a=b.width-this.scrollOffset,e=b.height,n=Math.max(0,e-x),O=this.pack=="start",V=this.pack=="center",z=this.pack=="end",K=0,P=0,S=0,k=0,W=0,G=[],j,I,L,U,v,h,R,H,c,w,p,M;for(R=0;R<E;R++){j=q[R];L=j.height;I=j.width;h=!j.hasLayout&&typeof j.doLayout=="function";if(typeof I!="number"){if(j.flex&&!I){S+=j.flex}else{if(!I&&h){j.doLayout()}U=j.getSize();I=U.width;L=U.height}}v=j.margins;w=v.left+v.right;K+=w+(I||0);k+=w+(j.flex?j.minWidth||0:I);W+=w+(j.minWidth||I||0);if(typeof L!="number"){if(h){j.doLayout()}L=j.getHeight()}P=Math.max(P,L+v.top+v.bottom);G.push({component:j,height:L||undefined,width:I||undefined})}var J=k-a,o=W>a;var m=Math.max(0,a-K-N);if(o){for(R=0;R<E;R++){G[R].width=q[R].minWidth||q[R].width||G[R].width}}else{if(J>0){var B=[];for(var D=0,u=E;D<u;D++){var A=q[D],s=A.minWidth||0;if(A.flex){G[D].width=s}else{B.push({minWidth:s,available:G[D].width-s,index:D})}}B.sort(function(X,i){return X.available>i.available?1:-1});for(var R=0,u=B.length;R<u;R++){var F=B[R].index;if(F==undefined){continue}var A=q[F],l=G[F],t=l.width,s=A.minWidth,d=Math.max(s,t-Math.ceil(J/(u-R))),f=t-d;G[F].width=d;J-=f}}else{var g=m,r=S;for(R=0;R<E;R++){j=q[R];H=G[R];v=j.margins;p=v.top+v.bottom;if(O&&j.flex&&!j.width){c=Math.ceil((j.flex/r)*g);g-=c;r-=j.flex;H.width=c;H.dirtySize=true}}}}if(V){T+=m/2}else{if(z){T+=m}}for(R=0;R<E;R++){j=q[R];H=G[R];v=j.margins;T+=v.left;p=v.top+v.bottom;H.left=T;H.top=C+v.top;switch(this.align){case"stretch":M=n-p;H.height=M.constrain(j.minHeight||0,j.maxHeight||1000000);H.dirtySize=true;break;case"stretchmax":M=P-p;H.height=M.constrain(j.minHeight||0,j.maxHeight||1000000);H.dirtySize=true;break;case"middle":var y=n-H.height-p;if(y>0){H.top=C+p+(y/2)}}T+=H.width+v.right}return{boxes:G,meta:{maxHeight:P,nonFlexWidth:K,desiredWidth:k,minimumWidth:W,shortfall:k-a,tooNarrow:o}}}});Ext.Container.LAYOUTS.hbox=Ext.layout.HBoxLayout;Ext.layout.VBoxLayout=Ext.extend(Ext.layout.BoxLayout,{align:"left",type:"vbox",calculateChildBoxes:function(n,b){var D=n.length,Q=this.padding,B=Q.top,U=Q.left,w=B+Q.bottom,N=U+Q.right,a=b.width-this.scrollOffset,c=b.height,J=Math.max(0,a-N),O=this.pack=="start",W=this.pack=="center",y=this.pack=="end",j=0,t=0,T=0,K=0,l=0,F=[],g,H,M,V,s,f,S,G,R,v,m,d,q;for(S=0;S<D;S++){g=n[S];M=g.height;H=g.width;f=!g.hasLayout&&typeof g.doLayout=="function";if(typeof M!="number"){if(g.flex&&!M){T+=g.flex}else{if(!M&&f){g.doLayout()}V=g.getSize();H=V.width;M=V.height}}s=g.margins;m=s.top+s.bottom;j+=m+(M||0);K+=m+(g.flex?g.minHeight||0:M);l+=m+(g.minHeight||M||0);if(typeof H!="number"){if(f){g.doLayout()}H=g.getWidth()}t=Math.max(t,H+s.left+s.right);F.push({component:g,height:M||undefined,width:H||undefined})}var L=K-c,k=l>c;var p=Math.max(0,(c-j-w));if(k){for(S=0,q=D;S<q;S++){F[S].height=n[S].minHeight||n[S].height||F[S].height}}else{if(L>0){var I=[];for(var C=0,q=D;C<q;C++){var z=n[C],r=z.minHeight||0;if(z.flex){F[C].height=r}else{I.push({minHeight:r,available:F[C].height-r,index:C})}}I.sort(function(X,i){return X.available>i.available?1:-1});for(var S=0,q=I.length;S<q;S++){var E=I[S].index;if(E==undefined){continue}var z=n[E],h=F[E],u=h.height,r=z.minHeight,A=Math.max(r,u-Math.ceil(L/(q-S))),e=u-A;F[E].height=A;L-=e}}else{var P=p,o=T;for(S=0;S<D;S++){g=n[S];G=F[S];s=g.margins;v=s.left+s.right;if(O&&g.flex&&!g.height){R=Math.ceil((g.flex/o)*P);P-=R;o-=g.flex;G.height=R;G.dirtySize=true}}}}if(W){B+=p/2}else{if(y){B+=p}}for(S=0;S<D;S++){g=n[S];G=F[S];s=g.margins;B+=s.top;v=s.left+s.right;G.left=U+s.left;G.top=B;switch(this.align){case"stretch":d=J-v;G.width=d.constrain(g.minWidth||0,g.maxWidth||1000000);G.dirtySize=true;break;case"stretchmax":d=t-v;G.width=d.constrain(g.minWidth||0,g.maxWidth||1000000);G.dirtySize=true;break;case"center":var x=J-G.width-v;if(x>0){G.left=U+v+(x/2)}}B+=G.height+s.bottom}return{boxes:F,meta:{maxWidth:t,nonFlexHeight:j,desiredHeight:K,minimumHeight:l,shortfall:K-c,tooNarrow:k}}}});Ext.Container.LAYOUTS.vbox=Ext.layout.VBoxLayout;Ext.layout.ToolbarLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"toolbar",triggerWidth:18,noItemsMenuText:'<div class="x-toolbar-no-items">(None)</div>',lastOverflow:false,tableHTML:['<table cellspacing="0" class="x-toolbar-ct">',"<tbody>","<tr>",'<td class="x-toolbar-left" align="{0}">','<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-left-row"></tr>',"</tbody>","</table>","</td>",'<td class="x-toolbar-right" align="right">','<table cellspacing="0" class="x-toolbar-right-ct">',"<tbody>","<tr>","<td>",'<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-right-row"></tr>',"</tbody>","</table>","</td>","<td>",'<table cellspacing="0">',"<tbody>",'<tr class="x-toolbar-extras-row"></tr>',"</tbody>","</table>","</td>","</tr>","</tbody>","</table>","</td>","</tr>","</tbody>","</table>"].join(""),onLayout:function(e,h){if(!this.leftTr){var g=e.buttonAlign=="center"?"center":"left";h.addClass("x-toolbar-layout-ct");h.insertHtml("beforeEnd",String.format(this.tableHTML,g));this.leftTr=h.child("tr.x-toolbar-left-row",true);this.rightTr=h.child("tr.x-toolbar-right-row",true);this.extrasTr=h.child("tr.x-toolbar-extras-row",true);if(this.hiddenItem==undefined){this.hiddenItems=[]}}var j=e.buttonAlign=="right"?this.rightTr:this.leftTr,k=e.items.items,d=0;for(var b=0,f=k.length,l;b<f;b++,d++){l=k[b];if(l.isFill){j=this.rightTr;d=-1}else{if(!l.rendered){l.render(this.insertCell(l,j,d));this.configureItem(l)}else{if(!l.xtbHidden&&!this.isValidParent(l,j.childNodes[d])){var a=this.insertCell(l,j,d);a.appendChild(l.getPositionEl().dom);l.container=Ext.get(a)}}}}this.cleanup(this.leftTr);this.cleanup(this.rightTr);this.cleanup(this.extrasTr);this.fitToSize(h)},cleanup:function(b){var e=b.childNodes,a,d;for(a=e.length-1;a>=0&&(d=e[a]);a--){if(!d.firstChild){b.removeChild(d)}}},insertCell:function(e,b,a){var d=document.createElement("td");d.className="x-toolbar-cell";b.insertBefore(d,b.childNodes[a]||null);return d},hideItem:function(a){this.hiddenItems.push(a);a.xtbHidden=true;a.xtbWidth=a.getPositionEl().dom.parentNode.offsetWidth;a.hide()},unhideItem:function(a){a.show();a.xtbHidden=false;this.hiddenItems.remove(a)},getItemWidth:function(a){return a.hidden?(a.xtbWidth||0):a.getPositionEl().dom.parentNode.offsetWidth},fitToSize:function(j){if(this.container.enableOverflow===false){return}var b=j.dom.clientWidth,h=j.dom.firstChild.offsetWidth,l=b-this.triggerWidth,a=this.lastWidth||0,c=this.hiddenItems,e=c.length!=0,m=b>=a;this.lastWidth=b;if(h>b||(e&&m)){var k=this.container.items.items,g=k.length,d=0,n;for(var f=0;f<g;f++){n=k[f];if(!n.isFill){d+=this.getItemWidth(n);if(d>l){if(!(n.hidden||n.xtbHidden)){this.hideItem(n)}}else{if(n.xtbHidden){this.unhideItem(n)}}}}}e=c.length!=0;if(e){this.initMore();if(!this.lastOverflow){this.container.fireEvent("overflowchange",this.container,true);this.lastOverflow=true}}else{if(this.more){this.clearMenu();this.more.destroy();delete this.more;if(this.lastOverflow){this.container.fireEvent("overflowchange",this.container,false);this.lastOverflow=false}}}},createMenuConfig:function(c,a){var b=Ext.apply({},c.initialConfig),d=c.toggleGroup;Ext.copyTo(b,c,["iconCls","icon","itemId","disabled","handler","scope","menu"]);Ext.apply(b,{text:c.overflowText||c.text,hideOnClick:a});if(d||c.enableToggle){Ext.apply(b,{group:d,checked:c.pressed,listeners:{checkchange:function(f,e){c.toggle(e)}}})}delete b.ownerCt;delete b.xtype;delete b.id;return b},addComponentToMenu:function(b,a){if(a instanceof Ext.Toolbar.Separator){b.add("-")}else{if(Ext.isFunction(a.isXType)){if(a.isXType("splitbutton")){b.add(this.createMenuConfig(a,true))}else{if(a.isXType("button")){b.add(this.createMenuConfig(a,!a.menu))}else{if(a.isXType("buttongroup")){a.items.each(function(c){this.addComponentToMenu(b,c)},this)}}}}}},clearMenu:function(){var a=this.moreMenu;if(a&&a.items){a.items.each(function(b){delete b.menu})}},beforeMoreShow:function(g){var b=this.container.items.items,a=b.length,f,e;var c=function(i,h){return i.isXType("buttongroup")&&!(h instanceof Ext.Toolbar.Separator)};this.clearMenu();g.removeAll();for(var d=0;d<a;d++){f=b[d];if(f.xtbHidden){if(e&&(c(f,e)||c(e,f))){g.add("-")}this.addComponentToMenu(g,f);e=f}}if(g.items.length<1){g.add(this.noItemsMenuText)}},initMore:function(){if(!this.more){this.moreMenu=new Ext.menu.Menu({ownerCt:this.container,listeners:{beforeshow:this.beforeMoreShow,scope:this}});this.more=new Ext.Button({iconCls:"x-toolbar-more-icon",cls:"x-toolbar-more",menu:this.moreMenu,ownerCt:this.container});var a=this.insertCell(this.more,this.extrasTr,100);this.more.render(a)}},destroy:function(){Ext.destroy(this.more,this.moreMenu);delete this.leftTr;delete this.rightTr;delete this.extrasTr;Ext.layout.ToolbarLayout.superclass.destroy.call(this)}});Ext.Container.LAYOUTS.toolbar=Ext.layout.ToolbarLayout;Ext.layout.MenuLayout=Ext.extend(Ext.layout.ContainerLayout,{monitorResize:true,type:"menu",setContainer:function(a){this.monitorResize=!a.floating;a.on("autosize",this.doAutoSize,this);Ext.layout.MenuLayout.superclass.setContainer.call(this,a)},renderItem:function(f,b,e){if(!this.itemTpl){this.itemTpl=Ext.layout.MenuLayout.prototype.itemTpl=new Ext.XTemplate('<li id="{itemId}" class="{itemCls}">','<tpl if="needsIcon">','<img alt="{altText}" src="{icon}" class="{iconCls}"/>',"</tpl>","</li>")}if(f&&!f.rendered){if(Ext.isNumber(b)){b=e.dom.childNodes[b]}var d=this.getItemArgs(f);f.render(f.positionEl=b?this.itemTpl.insertBefore(b,d,true):this.itemTpl.append(e,d,true));f.positionEl.menuItemId=f.getItemId();if(!d.isMenuItem&&d.needsIcon){f.positionEl.addClass("x-menu-list-item-indent")}this.configureItem(f)}else{if(f&&!this.isValidParent(f,e)){if(Ext.isNumber(b)){b=e.dom.childNodes[b]}e.dom.insertBefore(f.getActionEl().dom,b||null)}}},getItemArgs:function(d){var a=d instanceof Ext.menu.Item,b=!(a||d instanceof Ext.menu.Separator);return{isMenuItem:a,needsIcon:b&&(d.icon||d.iconCls),icon:d.icon||Ext.BLANK_IMAGE_URL,iconCls:"x-menu-item-icon "+(d.iconCls||""),itemId:"x-menu-el-"+d.id,itemCls:"x-menu-list-item ",altText:d.altText||""}},isValidParent:function(b,a){return b.el.up("li.x-menu-list-item",5).dom.parentNode===(a.dom||a)},onLayout:function(a,b){Ext.layout.MenuLayout.superclass.onLayout.call(this,a,b);this.doAutoSize()},doAutoSize:function(){var c=this.container,a=c.width;if(c.floating){if(a){c.setWidth(a)}else{if(Ext.isIE){c.setWidth(Ext.isStrict&&(Ext.isIE7||Ext.isIE8||Ext.isIE9)?"auto":c.minWidth);var d=c.getEl(),b=d.dom.offsetWidth;c.setWidth(c.getLayoutTarget().getWidth()+d.getFrameWidth("lr"))}}}}});Ext.Container.LAYOUTS.menu=Ext.layout.MenuLayout;Ext.Viewport=Ext.extend(Ext.Container,{initComponent:function(){Ext.Viewport.superclass.initComponent.call(this);document.getElementsByTagName("html")[0].className+=" x-viewport";this.el=Ext.getBody();this.el.setHeight=Ext.emptyFn;this.el.setWidth=Ext.emptyFn;this.el.setSize=Ext.emptyFn;this.el.dom.scroll="no";this.allowDomMove=false;this.autoWidth=true;this.autoHeight=true;Ext.EventManager.onWindowResize(this.fireResize,this);this.renderTo=this.el},fireResize:function(a,b){this.fireEvent("resize",this,a,b,a,b)}});Ext.reg("viewport",Ext.Viewport);Ext.Panel=Ext.extend(Ext.Container,{baseCls:"x-panel",collapsedCls:"x-panel-collapsed",maskDisabled:true,animCollapse:Ext.enableFx,headerAsText:true,buttonAlign:"right",collapsed:false,collapseFirst:true,minButtonWidth:75,elements:"body",preventBodyReset:false,padding:undefined,resizeEvent:"bodyresize",toolTarget:"header",collapseEl:"bwrap",slideAnchor:"t",disabledClass:"",deferHeight:true,expandDefaults:{duration:0.25},collapseDefaults:{duration:0.25},initComponent:function(){Ext.Panel.superclass.initComponent.call(this);this.addEvents("bodyresize","titlechange","iconchange","collapse","expand","beforecollapse","beforeexpand","beforeclose","close","activate","deactivate");if(this.unstyled){this.baseCls="x-plain"}this.toolbars=[];if(this.tbar){this.elements+=",tbar";this.topToolbar=this.createToolbar(this.tbar);this.tbar=null}if(this.bbar){this.elements+=",bbar";this.bottomToolbar=this.createToolbar(this.bbar);this.bbar=null}if(this.header===true){this.elements+=",header";this.header=null}else{if(this.headerCfg||(this.title&&this.header!==false)){this.elements+=",header"}}if(this.footerCfg||this.footer===true){this.elements+=",footer";this.footer=null}if(this.buttons){this.fbar=this.buttons;this.buttons=null}if(this.fbar){this.createFbar(this.fbar)}if(this.autoLoad){this.on("render",this.doAutoLoad,this,{delay:10})}},createFbar:function(b){var a=this.minButtonWidth;this.elements+=",footer";this.fbar=this.createToolbar(b,{buttonAlign:this.buttonAlign,toolbarCls:"x-panel-fbar",enableOverflow:false,defaults:function(d){return{minWidth:d.minWidth||a}}});this.fbar.items.each(function(d){d.minWidth=d.minWidth||this.minButtonWidth},this);this.buttons=this.fbar.items.items},createToolbar:function(b,c){var a;if(Ext.isArray(b)){b={items:b}}a=b.events?Ext.apply(b,c):this.createComponent(Ext.apply({},b,c),"toolbar");this.toolbars.push(a);return a},createElement:function(a,c){if(this[a]){c.appendChild(this[a].dom);return}if(a==="bwrap"||this.elements.indexOf(a)!=-1){if(this[a+"Cfg"]){this[a]=Ext.fly(c).createChild(this[a+"Cfg"])}else{var b=document.createElement("div");b.className=this[a+"Cls"];this[a]=Ext.get(c.appendChild(b))}if(this[a+"CssClass"]){this[a].addClass(this[a+"CssClass"])}if(this[a+"Style"]){this[a].applyStyles(this[a+"Style"])}}},onRender:function(f,e){Ext.Panel.superclass.onRender.call(this,f,e);this.createClasses();var a=this.el,g=a.dom,j,h;if(this.collapsible&&!this.hideCollapseTool){this.tools=this.tools?this.tools.slice(0):[];this.tools[this.collapseFirst?"unshift":"push"]({id:"toggle",handler:this.toggleCollapse,scope:this})}if(this.tools){h=this.tools;this.elements+=(this.header!==false)?",header":""}this.tools={};a.addClass(this.baseCls);if(g.firstChild){this.header=a.down("."+this.headerCls);this.bwrap=a.down("."+this.bwrapCls);var i=this.bwrap?this.bwrap:a;this.tbar=i.down("."+this.tbarCls);this.body=i.down("."+this.bodyCls);this.bbar=i.down("."+this.bbarCls);this.footer=i.down("."+this.footerCls);this.fromMarkup=true}if(this.preventBodyReset===true){a.addClass("x-panel-reset")}if(this.cls){a.addClass(this.cls)}if(this.buttons){this.elements+=",footer"}if(this.frame){a.insertHtml("afterBegin",String.format(Ext.Element.boxMarkup,this.baseCls));this.createElement("header",g.firstChild.firstChild.firstChild);this.createElement("bwrap",g);j=this.bwrap.dom;var c=g.childNodes[1],b=g.childNodes[2];j.appendChild(c);j.appendChild(b);var k=j.firstChild.firstChild.firstChild;this.createElement("tbar",k);this.createElement("body",k);this.createElement("bbar",k);this.createElement("footer",j.lastChild.firstChild.firstChild);if(!this.footer){this.bwrap.dom.lastChild.className+=" x-panel-nofooter"}this.ft=Ext.get(this.bwrap.dom.lastChild);this.mc=Ext.get(k)}else{this.createElement("header",g);this.createElement("bwrap",g);j=this.bwrap.dom;this.createElement("tbar",j);this.createElement("body",j);this.createElement("bbar",j);this.createElement("footer",j);if(!this.header){this.body.addClass(this.bodyCls+"-noheader");if(this.tbar){this.tbar.addClass(this.tbarCls+"-noheader")}}}if(Ext.isDefined(this.padding)){this.body.setStyle("padding",this.body.addUnits(this.padding))}if(this.border===false){this.el.addClass(this.baseCls+"-noborder");this.body.addClass(this.bodyCls+"-noborder");if(this.header){this.header.addClass(this.headerCls+"-noborder")}if(this.footer){this.footer.addClass(this.footerCls+"-noborder")}if(this.tbar){this.tbar.addClass(this.tbarCls+"-noborder")}if(this.bbar){this.bbar.addClass(this.bbarCls+"-noborder")}}if(this.bodyBorder===false){this.body.addClass(this.bodyCls+"-noborder")}this.bwrap.enableDisplayMode("block");if(this.header){this.header.unselectable();if(this.headerAsText){this.header.dom.innerHTML='<span class="'+this.headerTextCls+'">'+this.header.dom.innerHTML+"</span>";if(this.iconCls){this.setIconClass(this.iconCls)}}}if(this.floating){this.makeFloating(this.floating)}if(this.collapsible&&this.titleCollapse&&this.header){this.mon(this.header,"click",this.toggleCollapse,this);this.header.setStyle("cursor","pointer")}if(h){this.addTool.apply(this,h)}if(this.fbar){this.footer.addClass("x-panel-btns");this.fbar.ownerCt=this;this.fbar.render(this.footer);this.footer.createChild({cls:"x-clear"})}if(this.tbar&&this.topToolbar){this.topToolbar.ownerCt=this;this.topToolbar.render(this.tbar)}if(this.bbar&&this.bottomToolbar){this.bottomToolbar.ownerCt=this;this.bottomToolbar.render(this.bbar)}},setIconClass:function(b){var a=this.iconCls;this.iconCls=b;if(this.rendered&&this.header){if(this.frame){this.header.addClass("x-panel-icon");this.header.replaceClass(a,this.iconCls)}else{var e=this.header,c=e.child("img.x-panel-inline-icon");if(c){Ext.fly(c).replaceClass(a,this.iconCls)}else{var d=e.child("span."+this.headerTextCls);if(d){Ext.DomHelper.insertBefore(d.dom,{tag:"img",alt:"",src:Ext.BLANK_IMAGE_URL,cls:"x-panel-inline-icon "+this.iconCls})}}}}this.fireEvent("iconchange",this,b,a)},makeFloating:function(a){this.floating=true;this.el=new Ext.Layer(Ext.apply({},a,{shadow:Ext.isDefined(this.shadow)?this.shadow:"sides",shadowOffset:this.shadowOffset,constrain:false,shim:this.shim===false?false:undefined}),this.el)},getTopToolbar:function(){return this.topToolbar},getBottomToolbar:function(){return this.bottomToolbar},getFooterToolbar:function(){return this.fbar},addButton:function(a,c,b){if(!this.fbar){this.createFbar([])}if(c){if(Ext.isString(a)){a={text:a}}a=Ext.apply({handler:c,scope:b},a)}return this.fbar.add(a)},addTool:function(){if(!this.rendered){if(!this.tools){this.tools=[]}Ext.each(arguments,function(a){this.tools.push(a)},this);return}if(!this[this.toolTarget]){return}if(!this.toolTemplate){var g=new Ext.Template('<div class="x-tool x-tool-{id}">&#160;</div>');g.disableFormats=true;g.compile();Ext.Panel.prototype.toolTemplate=g}for(var f=0,d=arguments,c=d.length;f<c;f++){var b=d[f];if(!this.tools[b.id]){var h="x-tool-"+b.id+"-over";var e=this.toolTemplate.insertFirst(this[this.toolTarget],b,true);this.tools[b.id]=e;e.enableDisplayMode("block");this.mon(e,"click",this.createToolHandler(e,b,h,this));if(b.on){this.mon(e,b.on)}if(b.hidden){e.hide()}if(b.qtip){if(Ext.isObject(b.qtip)){Ext.QuickTips.register(Ext.apply({target:e.id},b.qtip))}else{e.dom.qtip=b.qtip}}e.addClassOnOver(h)}}},onLayout:function(b,a){Ext.Panel.superclass.onLayout.apply(this,arguments);if(this.hasLayout&&this.toolbars.length>0){Ext.each(this.toolbars,function(c){c.doLayout(undefined,a)});this.syncHeight()}},syncHeight:function(){var b=this.toolbarHeight,c=this.body,a=this.lastSize.height,d;if(this.autoHeight||!Ext.isDefined(a)||a=="auto"){return}if(b!=this.getToolbarHeight()){b=Math.max(0,a-this.getFrameHeight());c.setHeight(b);d=c.getSize();this.toolbarHeight=this.getToolbarHeight();this.onBodyResize(d.width,d.height)}},onShow:function(){if(this.floating){return this.el.show()}Ext.Panel.superclass.onShow.call(this)},onHide:function(){if(this.floating){return this.el.hide()}Ext.Panel.superclass.onHide.call(this)},createToolHandler:function(c,a,d,b){return function(f){c.removeClass(d);if(a.stopEvent!==false){f.stopEvent()}if(a.handler){a.handler.call(a.scope||c,f,c,b,a)}}},afterRender:function(){if(this.floating&&!this.hidden){this.el.show()}if(this.title){this.setTitle(this.title)}Ext.Panel.superclass.afterRender.call(this);if(this.collapsed){this.collapsed=false;this.collapse(false)}this.initEvents()},getKeyMap:function(){if(!this.keyMap){this.keyMap=new Ext.KeyMap(this.el,this.keys)}return this.keyMap},initEvents:function(){if(this.keys){this.getKeyMap()}if(this.draggable){this.initDraggable()}if(this.toolbars.length>0){Ext.each(this.toolbars,function(a){a.doLayout();a.on({scope:this,afterlayout:this.syncHeight,remove:this.syncHeight})},this);this.syncHeight()}},initDraggable:function(){this.dd=new Ext.Panel.DD(this,Ext.isBoolean(this.draggable)?null:this.draggable)},beforeEffect:function(a){if(this.floating){this.el.beforeAction()}if(a!==false){this.el.addClass("x-panel-animated")}},afterEffect:function(a){this.syncShadow();this.el.removeClass("x-panel-animated")},createEffect:function(c,b,d){var e={scope:d,block:true};if(c===true){e.callback=b;return e}else{if(!c.callback){e.callback=b}else{e.callback=function(){b.call(d);Ext.callback(c.callback,c.scope)}}}return Ext.applyIf(e,c)},collapse:function(b){if(this.collapsed||this.el.hasFxBlock()||this.fireEvent("beforecollapse",this,b)===false){return}var a=b===true||(b!==false&&this.animCollapse);this.beforeEffect(a);this.onCollapse(a,b);return this},onCollapse:function(a,b){if(a){this[this.collapseEl].slideOut(this.slideAnchor,Ext.apply(this.createEffect(b||true,this.afterCollapse,this),this.collapseDefaults))}else{this[this.collapseEl].hide(this.hideMode);this.afterCollapse(false)}},afterCollapse:function(a){this.collapsed=true;this.el.addClass(this.collapsedCls);if(a!==false){this[this.collapseEl].hide(this.hideMode)}this.afterEffect(a);this.cascade(function(b){if(b.lastSize){b.lastSize={width:undefined,height:undefined}}});this.fireEvent("collapse",this)},expand:function(b){if(!this.collapsed||this.el.hasFxBlock()||this.fireEvent("beforeexpand",this,b)===false){return}var a=b===true||(b!==false&&this.animCollapse);this.el.removeClass(this.collapsedCls);this.beforeEffect(a);this.onExpand(a,b);return this},onExpand:function(a,b){if(a){this[this.collapseEl].slideIn(this.slideAnchor,Ext.apply(this.createEffect(b||true,this.afterExpand,this),this.expandDefaults))}else{this[this.collapseEl].show(this.hideMode);this.afterExpand(false)}},afterExpand:function(a){this.collapsed=false;if(a!==false){this[this.collapseEl].show(this.hideMode)}this.afterEffect(a);if(this.deferLayout){delete this.deferLayout;this.doLayout(true)}this.fireEvent("expand",this)},toggleCollapse:function(a){this[this.collapsed?"expand":"collapse"](a);return this},onDisable:function(){if(this.rendered&&this.maskDisabled){this.el.mask()}Ext.Panel.superclass.onDisable.call(this)},onEnable:function(){if(this.rendered&&this.maskDisabled){this.el.unmask()}Ext.Panel.superclass.onEnable.call(this)},onResize:function(f,d,c,e){var a=f,b=d;if(Ext.isDefined(a)||Ext.isDefined(b)){if(!this.collapsed){if(Ext.isNumber(a)){this.body.setWidth(a=this.adjustBodyWidth(a-this.getFrameWidth()))}else{if(a=="auto"){a=this.body.setWidth("auto").dom.offsetWidth}else{a=this.body.dom.offsetWidth}}if(this.tbar){this.tbar.setWidth(a);if(this.topToolbar){this.topToolbar.setSize(a)}}if(this.bbar){this.bbar.setWidth(a);if(this.bottomToolbar){this.bottomToolbar.setSize(a);if(Ext.isIE){this.bbar.setStyle("position","static");this.bbar.setStyle("position","")}}}if(this.footer){this.footer.setWidth(a);if(this.fbar){this.fbar.setSize(Ext.isIE?(a-this.footer.getFrameWidth("lr")):"auto")}}if(Ext.isNumber(b)){b=Math.max(0,b-this.getFrameHeight());this.body.setHeight(b)}else{if(b=="auto"){this.body.setHeight(b)}}if(this.disabled&&this.el._mask){this.el._mask.setSize(this.el.dom.clientWidth,this.el.getHeight())}}else{this.queuedBodySize={width:a,height:b};if(!this.queuedExpand&&this.allowQueuedExpand!==false){this.queuedExpand=true;this.on("expand",function(){delete this.queuedExpand;this.onResize(this.queuedBodySize.width,this.queuedBodySize.height)},this,{single:true})}}this.onBodyResize(a,b)}this.syncShadow();Ext.Panel.superclass.onResize.call(this,f,d,c,e)},onBodyResize:function(a,b){this.fireEvent("bodyresize",this,a,b)},getToolbarHeight:function(){var a=0;if(this.rendered){Ext.each(this.toolbars,function(b){a+=b.getHeight()},this)}return a},adjustBodyHeight:function(a){return a},adjustBodyWidth:function(a){return a},onPosition:function(){this.syncShadow()},getFrameWidth:function(){var b=this.el.getFrameWidth("lr")+this.bwrap.getFrameWidth("lr");if(this.frame){var a=this.bwrap.dom.firstChild;b+=(Ext.fly(a).getFrameWidth("l")+Ext.fly(a.firstChild).getFrameWidth("r"));b+=this.mc.getFrameWidth("lr")}return b},getFrameHeight:function(){var a=this.el.getFrameWidth("tb")+this.bwrap.getFrameWidth("tb");a+=(this.tbar?this.tbar.getHeight():0)+(this.bbar?this.bbar.getHeight():0);if(this.frame){a+=this.el.dom.firstChild.offsetHeight+this.ft.dom.offsetHeight+this.mc.getFrameWidth("tb")}else{a+=(this.header?this.header.getHeight():0)+(this.footer?this.footer.getHeight():0)}return a},getInnerWidth:function(){return this.getSize().width-this.getFrameWidth()},getInnerHeight:function(){return this.body.getHeight()},syncShadow:function(){if(this.floating){this.el.sync(true)}},getLayoutTarget:function(){return this.body},getContentTarget:function(){return this.body},setTitle:function(b,a){this.title=b;if(this.header&&this.headerAsText){this.header.child("span").update(b)}if(a){this.setIconClass(a)}this.fireEvent("titlechange",this,b);return this},getUpdater:function(){return this.body.getUpdater()},load:function(){var a=this.body.getUpdater();a.update.apply(a,arguments);return this},beforeDestroy:function(){Ext.Panel.superclass.beforeDestroy.call(this);if(this.header){this.header.removeAllListeners()}if(this.tools){for(var a in this.tools){Ext.destroy(this.tools[a])}}if(this.toolbars.length>0){Ext.each(this.toolbars,function(b){b.un("afterlayout",this.syncHeight,this);b.un("remove",this.syncHeight,this)},this)}if(Ext.isArray(this.buttons)){while(this.buttons.length){Ext.destroy(this.buttons[0])}}if(this.rendered){Ext.destroy(this.ft,this.header,this.footer,this.tbar,this.bbar,this.body,this.mc,this.bwrap,this.dd);if(this.fbar){Ext.destroy(this.fbar,this.fbar.el)}}Ext.destroy(this.toolbars)},createClasses:function(){this.headerCls=this.baseCls+"-header";this.headerTextCls=this.baseCls+"-header-text";this.bwrapCls=this.baseCls+"-bwrap";this.tbarCls=this.baseCls+"-tbar";this.bodyCls=this.baseCls+"-body";this.bbarCls=this.baseCls+"-bbar";this.footerCls=this.baseCls+"-footer"},createGhost:function(a,e,b){var d=document.createElement("div");d.className="x-panel-ghost "+(a?a:"");if(this.header){d.appendChild(this.el.dom.firstChild.cloneNode(true))}Ext.fly(d.appendChild(document.createElement("ul"))).setHeight(this.bwrap.getHeight());d.style.width=this.el.dom.offsetWidth+"px";if(!b){this.container.dom.appendChild(d)}else{Ext.getDom(b).appendChild(d)}if(e!==false&&this.el.useShim!==false){var c=new Ext.Layer({shadow:false,useDisplay:true,constrain:false},d);c.show();return c}else{return new Ext.Element(d)}},doAutoLoad:function(){var a=this.body.getUpdater();if(this.renderer){a.setRenderer(this.renderer)}a.update(Ext.isObject(this.autoLoad)?this.autoLoad:{url:this.autoLoad})},getTool:function(a){return this.tools[a]}});Ext.reg("panel",Ext.Panel);Ext.Editor=function(b,a){if(b.field){this.field=Ext.create(b.field,"textfield");a=Ext.apply({},b);delete a.field}else{this.field=b}Ext.Editor.superclass.constructor.call(this,a)};Ext.extend(Ext.Editor,Ext.Component,{allowBlur:true,value:"",alignment:"c-c?",offsets:[0,0],shadow:"frame",constrain:false,swallowKeys:true,completeOnEnter:true,cancelOnEsc:true,updateEl:false,initComponent:function(){Ext.Editor.superclass.initComponent.call(this);this.addEvents("beforestartedit","startedit","beforecomplete","complete","canceledit","specialkey")},onRender:function(b,a){this.el=new Ext.Layer({shadow:this.shadow,cls:"x-editor",parentEl:b,shim:this.shim,shadowOffset:this.shadowOffset||4,id:this.id,constrain:this.constrain});if(this.zIndex){this.el.setZIndex(this.zIndex)}this.el.setStyle("overflow",Ext.isGecko?"auto":"hidden");if(this.field.msgTarget!="title"){this.field.msgTarget="qtip"}this.field.inEditor=true;this.mon(this.field,{scope:this,blur:this.onBlur,specialkey:this.onSpecialKey});if(this.field.grow){this.mon(this.field,"autosize",this.el.sync,this.el,{delay:1})}this.field.render(this.el).show();this.field.getEl().dom.name="";if(this.swallowKeys){this.field.el.swallowEvent(["keypress","keydown"])}},onSpecialKey:function(f,d){var b=d.getKey(),a=this.completeOnEnter&&b==d.ENTER,c=this.cancelOnEsc&&b==d.ESC;if(a||c){d.stopEvent();if(a){this.completeEdit()}else{this.cancelEdit()}if(f.triggerBlur){f.triggerBlur()}}this.fireEvent("specialkey",f,d)},startEdit:function(b,c){if(this.editing){this.completeEdit()}this.boundEl=Ext.get(b);var a=c!==undefined?c:this.boundEl.dom.innerHTML;if(!this.rendered){this.render(this.parentEl||document.body)}if(this.fireEvent("beforestartedit",this,this.boundEl,a)!==false){this.startValue=a;this.field.reset();this.field.setValue(a);this.realign(true);this.editing=true;this.show()}},doAutoSize:function(){if(this.autoSize){var b=this.boundEl.getSize(),a=this.field.getSize();switch(this.autoSize){case"width":this.setSize(b.width,a.height);break;case"height":this.setSize(a.width,b.height);break;case"none":this.setSize(a.width,a.height);break;default:this.setSize(b.width,b.height)}}},setSize:function(a,b){delete this.field.lastSize;this.field.setSize(a,b);if(this.el){if(Ext.isGecko2||Ext.isOpera||(Ext.isIE7&&Ext.isStrict)){this.el.setSize(a,b)}this.el.sync()}},realign:function(a){if(a===true){this.doAutoSize()}this.el.alignTo(this.boundEl,this.alignment,this.offsets)},completeEdit:function(a){if(!this.editing){return}if(this.field.assertValue){this.field.assertValue()}var b=this.getValue();if(!this.field.isValid()){if(this.revertInvalid!==false){this.cancelEdit(a)}return}if(String(b)===String(this.startValue)&&this.ignoreNoChange){this.hideEdit(a);return}if(this.fireEvent("beforecomplete",this,b,this.startValue)!==false){b=this.getValue();if(this.updateEl&&this.boundEl){this.boundEl.update(b)}this.hideEdit(a);this.fireEvent("complete",this,b,this.startValue)}},onShow:function(){this.el.show();if(this.hideEl!==false){this.boundEl.hide()}this.field.show().focus(false,true);this.fireEvent("startedit",this.boundEl,this.startValue)},cancelEdit:function(a){if(this.editing){var b=this.getValue();this.setValue(this.startValue);this.hideEdit(a);this.fireEvent("canceledit",this,b,this.startValue)}},hideEdit:function(a){if(a!==true){this.editing=false;this.hide()}},onBlur:function(){if(this.allowBlur===true&&this.editing&&this.selectSameEditor!==true){this.completeEdit()}},onHide:function(){if(this.editing){this.completeEdit();return}this.field.blur();if(this.field.collapse){this.field.collapse()}this.el.hide();if(this.hideEl!==false){this.boundEl.show()}},setValue:function(a){this.field.setValue(a)},getValue:function(){return this.field.getValue()},beforeDestroy:function(){Ext.destroyMembers(this,"field");delete this.parentEl;delete this.boundEl}});Ext.reg("editor",Ext.Editor);Ext.ColorPalette=Ext.extend(Ext.Component,{itemCls:"x-color-palette",value:null,clickEvent:"click",ctype:"Ext.ColorPalette",allowReselect:false,colors:["000000","993300","333300","003300","003366","000080","333399","333333","800000","FF6600","808000","008000","008080","0000FF","666699","808080","FF0000","FF9900","99CC00","339966","33CCCC","3366FF","800080","969696","FF00FF","FFCC00","FFFF00","00FF00","00FFFF","00CCFF","993366","C0C0C0","FF99CC","FFCC99","FFFF99","CCFFCC","CCFFFF","99CCFF","CC99FF","FFFFFF"],initComponent:function(){Ext.ColorPalette.superclass.initComponent.call(this);this.addEvents("select");if(this.handler){this.on("select",this.handler,this.scope,true)}},onRender:function(b,a){this.autoEl={tag:"div",cls:this.itemCls};Ext.ColorPalette.superclass.onRender.call(this,b,a);var c=this.tpl||new Ext.XTemplate('<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>');c.overwrite(this.el,this.colors);this.mon(this.el,this.clickEvent,this.handleClick,this,{delegate:"a"});if(this.clickEvent!="click"){this.mon(this.el,"click",Ext.emptyFn,this,{delegate:"a",preventDefault:true})}},afterRender:function(){Ext.ColorPalette.superclass.afterRender.call(this);if(this.value){var a=this.value;this.value=null;this.select(a,true)}},handleClick:function(b,a){b.preventDefault();if(!this.disabled){var d=a.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];this.select(d.toUpperCase())}},select:function(b,a){b=b.replace("#","");if(b!=this.value||this.allowReselect){var c=this.el;if(this.value){c.child("a.color-"+this.value).removeClass("x-color-palette-sel")}c.child("a.color-"+b).addClass("x-color-palette-sel");this.value=b;if(a!==true){this.fireEvent("select",this,b)}}}});Ext.reg("colorpalette",Ext.ColorPalette);Ext.DatePicker=Ext.extend(Ext.BoxComponent,{todayText:"Today",okText:"&#160;OK&#160;",cancelText:"Cancel",todayTip:"{0} (Spacebar)",minText:"This date is before the minimum date",maxText:"This date is after the maximum date",format:"m/d/y",disabledDaysText:"Disabled",disabledDatesText:"Disabled",monthNames:Date.monthNames,dayNames:Date.dayNames,nextText:"Next Month (Control+Right)",prevText:"Previous Month (Control+Left)",monthYearText:"Choose a month (Control+Up/Down to move years)",startDay:0,showToday:true,focusOnSelect:true,initHour:12,initComponent:function(){Ext.DatePicker.superclass.initComponent.call(this);this.value=this.value?this.value.clearTime(true):new Date().clearTime();this.addEvents("select");if(this.handler){this.on("select",this.handler,this.scope||this)}this.initDisabledDays()},initDisabledDays:function(){if(!this.disabledDatesRE&&this.disabledDates){var b=this.disabledDates,a=b.length-1,c="(?:";Ext.each(b,function(f,e){c+=Ext.isDate(f)?"^"+Ext.escapeRe(f.dateFormat(this.format))+"$":b[e];if(e!=a){c+="|"}},this);this.disabledDatesRE=new RegExp(c+")")}},setDisabledDates:function(a){if(Ext.isArray(a)){this.disabledDates=a;this.disabledDatesRE=null}else{this.disabledDatesRE=a}this.initDisabledDays();this.update(this.value,true)},setDisabledDays:function(a){this.disabledDays=a;this.update(this.value,true)},setMinDate:function(a){this.minDate=a;this.update(this.value,true)},setMaxDate:function(a){this.maxDate=a;this.update(this.value,true)},setValue:function(a){this.value=a.clearTime(true);this.update(this.value)},getValue:function(){return this.value},focus:function(){this.update(this.activeDate)},onEnable:function(a){Ext.DatePicker.superclass.onEnable.call(this);this.doDisabled(false);this.update(a?this.value:this.activeDate);if(Ext.isIE){this.el.repaint()}},onDisable:function(){Ext.DatePicker.superclass.onDisable.call(this);this.doDisabled(true);if(Ext.isIE&&!Ext.isIE8){Ext.each([].concat(this.textNodes,this.el.query("th span")),function(a){Ext.fly(a).repaint()})}},doDisabled:function(a){this.keyNav.setDisabled(a);this.prevRepeater.setDisabled(a);this.nextRepeater.setDisabled(a);if(this.showToday){this.todayKeyListener.setDisabled(a);this.todayBtn.setDisabled(a)}},onRender:function(e,b){var a=['<table cellspacing="0">','<tr><td class="x-date-left"><a href="#" title="',this.prevText,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="',this.nextText,'">&#160;</a></td></tr>','<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],c=this.dayNames,g;for(g=0;g<7;g++){var j=this.startDay+g;if(j>6){j=j-7}a.push("<th><span>",c[j].substr(0,1),"</span></th>")}a[a.length]="</tr></thead><tbody><tr>";for(g=0;g<42;g++){if(g%7===0&&g!==0){a[a.length]="</tr><tr>"}a[a.length]='<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>'}a.push("</tr></tbody></table></td></tr>",this.showToday?'<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>':"",'</table><div class="x-date-mp"></div>');var h=document.createElement("div");h.className="x-date-picker";h.innerHTML=a.join("");e.dom.insertBefore(h,b);this.el=Ext.get(h);this.eventEl=Ext.get(h.firstChild);this.prevRepeater=new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"),{handler:this.showPrevMonth,scope:this,preventDefault:true,stopDefault:true});this.nextRepeater=new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"),{handler:this.showNextMonth,scope:this,preventDefault:true,stopDefault:true});this.monthPicker=this.el.down("div.x-date-mp");this.monthPicker.enableDisplayMode("block");this.keyNav=new Ext.KeyNav(this.eventEl,{left:function(d){if(d.ctrlKey){this.showPrevMonth()}else{this.update(this.activeDate.add("d",-1))}},right:function(d){if(d.ctrlKey){this.showNextMonth()}else{this.update(this.activeDate.add("d",1))}},up:function(d){if(d.ctrlKey){this.showNextYear()}else{this.update(this.activeDate.add("d",-7))}},down:function(d){if(d.ctrlKey){this.showPrevYear()}else{this.update(this.activeDate.add("d",7))}},pageUp:function(d){this.showNextMonth()},pageDown:function(d){this.showPrevMonth()},enter:function(d){d.stopPropagation();return true},scope:this});this.el.unselectable();this.cells=this.el.select("table.x-date-inner tbody td");this.textNodes=this.el.query("table.x-date-inner tbody span");this.mbtn=new Ext.Button({text:"&#160;",tooltip:this.monthYearText,renderTo:this.el.child("td.x-date-middle",true)});this.mbtn.el.child("em").addClass("x-btn-arrow");if(this.showToday){this.todayKeyListener=this.eventEl.addKeyListener(Ext.EventObject.SPACE,this.selectToday,this);var f=(new Date()).dateFormat(this.format);this.todayBtn=new Ext.Button({renderTo:this.el.child("td.x-date-bottom",true),text:String.format(this.todayText,f),tooltip:String.format(this.todayTip,f),handler:this.selectToday,scope:this})}this.mon(this.eventEl,"mousewheel",this.handleMouseWheel,this);this.mon(this.eventEl,"click",this.handleDateClick,this,{delegate:"a.x-date-date"});this.mon(this.mbtn,"click",this.showMonthPicker,this);this.onEnable(true)},createMonthPicker:function(){if(!this.monthPicker.dom.firstChild){var a=['<table border="0" cellspacing="0">'];for(var b=0;b<6;b++){a.push('<tr><td class="x-date-mp-month"><a href="#">',Date.getShortMonthName(b),"</a></td>",'<td class="x-date-mp-month x-date-mp-sep"><a href="#">',Date.getShortMonthName(b+6),"</a></td>",b===0?'<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>':'<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>')}a.push('<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',this.okText,'</button><button type="button" class="x-date-mp-cancel">',this.cancelText,"</button></td></tr>","</table>");this.monthPicker.update(a.join(""));this.mon(this.monthPicker,"click",this.onMonthClick,this);this.mon(this.monthPicker,"dblclick",this.onMonthDblClick,this);this.mpMonths=this.monthPicker.select("td.x-date-mp-month");this.mpYears=this.monthPicker.select("td.x-date-mp-year");this.mpMonths.each(function(c,d,e){e+=1;if((e%2)===0){c.dom.xmonth=5+Math.round(e*0.5)}else{c.dom.xmonth=Math.round((e-1)*0.5)}})}},showMonthPicker:function(){if(!this.disabled){this.createMonthPicker();var a=this.el.getSize();this.monthPicker.setSize(a);this.monthPicker.child("table").setSize(a);this.mpSelMonth=(this.activeDate||this.value).getMonth();this.updateMPMonth(this.mpSelMonth);this.mpSelYear=(this.activeDate||this.value).getFullYear();this.updateMPYear(this.mpSelYear);this.monthPicker.slideIn("t",{duration:0.2})}},updateMPYear:function(e){this.mpyear=e;var c=this.mpYears.elements;for(var b=1;b<=10;b++){var d=c[b-1],a;if((b%2)===0){a=e+Math.round(b*0.5);d.firstChild.innerHTML=a;d.xyear=a}else{a=e-(5-Math.round(b*0.5));d.firstChild.innerHTML=a;d.xyear=a}this.mpYears.item(b-1)[a==this.mpSelYear?"addClass":"removeClass"]("x-date-mp-sel")}},updateMPMonth:function(a){this.mpMonths.each(function(b,c,d){b[b.dom.xmonth==a?"addClass":"removeClass"]("x-date-mp-sel")})},selectMPMonth:function(a){},onMonthClick:function(f,b){f.stopEvent();var c=new Ext.Element(b),a;if(c.is("button.x-date-mp-cancel")){this.hideMonthPicker()}else{if(c.is("button.x-date-mp-ok")){var g=new Date(this.mpSelYear,this.mpSelMonth,(this.activeDate||this.value).getDate());if(g.getMonth()!=this.mpSelMonth){g=new Date(this.mpSelYear,this.mpSelMonth,1).getLastDateOfMonth()}this.update(g);this.hideMonthPicker()}else{if((a=c.up("td.x-date-mp-month",2))){this.mpMonths.removeClass("x-date-mp-sel");a.addClass("x-date-mp-sel");this.mpSelMonth=a.dom.xmonth}else{if((a=c.up("td.x-date-mp-year",2))){this.mpYears.removeClass("x-date-mp-sel");a.addClass("x-date-mp-sel");this.mpSelYear=a.dom.xyear}else{if(c.is("a.x-date-mp-prev")){this.updateMPYear(this.mpyear-10)}else{if(c.is("a.x-date-mp-next")){this.updateMPYear(this.mpyear+10)}}}}}}},onMonthDblClick:function(d,b){d.stopEvent();var c=new Ext.Element(b),a;if((a=c.up("td.x-date-mp-month",2))){this.update(new Date(this.mpSelYear,a.dom.xmonth,(this.activeDate||this.value).getDate()));this.hideMonthPicker()}else{if((a=c.up("td.x-date-mp-year",2))){this.update(new Date(a.dom.xyear,this.mpSelMonth,(this.activeDate||this.value).getDate()));this.hideMonthPicker()}}},hideMonthPicker:function(a){if(this.monthPicker){if(a===true){this.monthPicker.hide()}else{this.monthPicker.slideOut("t",{duration:0.2})}}},showPrevMonth:function(a){this.update(this.activeDate.add("mo",-1))},showNextMonth:function(a){this.update(this.activeDate.add("mo",1))},showPrevYear:function(){this.update(this.activeDate.add("y",-1))},showNextYear:function(){this.update(this.activeDate.add("y",1))},handleMouseWheel:function(a){a.stopEvent();if(!this.disabled){var b=a.getWheelDelta();if(b>0){this.showPrevMonth()}else{if(b<0){this.showNextMonth()}}}},handleDateClick:function(b,a){b.stopEvent();if(!this.disabled&&a.dateValue&&!Ext.fly(a.parentNode).hasClass("x-date-disabled")){this.cancelFocus=this.focusOnSelect===false;this.setValue(new Date(a.dateValue));delete this.cancelFocus;this.fireEvent("select",this,this.value)}},selectToday:function(){if(this.todayBtn&&!this.todayBtn.disabled){this.setValue(new Date().clearTime());this.fireEvent("select",this,this.value)}},update:function(F,z){if(this.rendered){var a=this.activeDate,o=this.isVisible();this.activeDate=F;if(!z&&a&&this.el){var n=F.getTime();if(a.getMonth()==F.getMonth()&&a.getFullYear()==F.getFullYear()){this.cells.removeClass("x-date-selected");this.cells.each(function(d){if(d.dom.firstChild.dateValue==n){d.addClass("x-date-selected");if(o&&!this.cancelFocus){Ext.fly(d.dom.firstChild).focus(50)}return false}},this);return}}var j=F.getDaysInMonth(),p=F.getFirstDateOfMonth(),f=p.getDay()-this.startDay;if(f<0){f+=7}j+=f;var A=F.add("mo",-1),g=A.getDaysInMonth()-f,e=this.cells.elements,q=this.textNodes,C=(new Date(A.getFullYear(),A.getMonth(),g,this.initHour)),B=new Date().clearTime().getTime(),u=F.clearTime(true).getTime(),s=this.minDate?this.minDate.clearTime(true):Number.NEGATIVE_INFINITY,x=this.maxDate?this.maxDate.clearTime(true):Number.POSITIVE_INFINITY,E=this.disabledDatesRE,r=this.disabledDatesText,H=this.disabledDays?this.disabledDays.join(""):false,D=this.disabledDaysText,y=this.format;if(this.showToday){var l=new Date().clearTime(),c=(l<s||l>x||(E&&y&&E.test(l.dateFormat(y)))||(H&&H.indexOf(l.getDay())!=-1));if(!this.disabled){this.todayBtn.setDisabled(c);this.todayKeyListener[c?"disable":"enable"]()}}var k=function(I,d){d.title="";var i=C.clearTime(true).getTime();d.firstChild.dateValue=i;if(i==B){d.className+=" x-date-today";d.title=I.todayText}if(i==u){d.className+=" x-date-selected";if(o){Ext.fly(d.firstChild).focus(50)}}if(i<s){d.className=" x-date-disabled";d.title=I.minText;return}if(i>x){d.className=" x-date-disabled";d.title=I.maxText;return}if(H){if(H.indexOf(C.getDay())!=-1){d.title=D;d.className=" x-date-disabled"}}if(E&&y){var w=C.dateFormat(y);if(E.test(w)){d.title=r.replace("%0",w);d.className=" x-date-disabled"}}};var v=0;for(;v<f;v++){q[v].innerHTML=(++g);C.setDate(C.getDate()+1);e[v].className="x-date-prevday";k(this,e[v])}for(;v<j;v++){var b=v-f+1;q[v].innerHTML=(b);C.setDate(C.getDate()+1);e[v].className="x-date-active";k(this,e[v])}var G=0;for(;v<42;v++){q[v].innerHTML=(++G);C.setDate(C.getDate()+1);e[v].className="x-date-nextday";k(this,e[v])}this.mbtn.setText(this.monthNames[F.getMonth()]+" "+F.getFullYear());if(!this.internalRender){var h=this.el.dom.firstChild,m=h.offsetWidth;this.el.setWidth(m+this.el.getBorderWidth("lr"));Ext.fly(h).setWidth(m);this.internalRender=true;if(Ext.isOpera&&!this.secondPass){h.rows[0].cells[1].style.width=(m-(h.rows[0].cells[0].offsetWidth+h.rows[0].cells[2].offsetWidth))+"px";this.secondPass=true;this.update.defer(10,this,[F])}}}},beforeDestroy:function(){if(this.rendered){Ext.destroy(this.keyNav,this.monthPicker,this.eventEl,this.mbtn,this.nextRepeater,this.prevRepeater,this.cells.el,this.todayBtn);delete this.textNodes;delete this.cells.elements}}});Ext.reg("datepicker",Ext.DatePicker);Ext.LoadMask=function(c,b){this.el=Ext.get(c);Ext.apply(this,b);if(this.store){this.store.on({scope:this,beforeload:this.onBeforeLoad,load:this.onLoad,exception:this.onLoad});this.removeMask=Ext.value(this.removeMask,false)}else{var a=this.el.getUpdater();a.showLoadIndicator=false;a.on({scope:this,beforeupdate:this.onBeforeLoad,update:this.onLoad,failure:this.onLoad});this.removeMask=Ext.value(this.removeMask,true)}};Ext.LoadMask.prototype={msg:"Loading...",msgCls:"x-mask-loading",disabled:false,disable:function(){this.disabled=true},enable:function(){this.disabled=false},onLoad:function(){this.el.unmask(this.removeMask)},onBeforeLoad:function(){if(!this.disabled){this.el.mask(this.msg,this.msgCls)}},show:function(){this.onBeforeLoad()},hide:function(){this.onLoad()},destroy:function(){if(this.store){this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.onLoad,this)}else{var a=this.el.getUpdater();a.un("beforeupdate",this.onBeforeLoad,this);a.un("update",this.onLoad,this);a.un("failure",this.onLoad,this)}}};Ext.slider.Thumb=Ext.extend(Object,{dragging:false,constructor:function(a){Ext.apply(this,a||{},{cls:"x-slider-thumb",constrain:false});Ext.slider.Thumb.superclass.constructor.call(this,a);if(this.slider.vertical){Ext.apply(this,Ext.slider.Thumb.Vertical)}},render:function(){this.el=this.slider.innerEl.insertFirst({cls:this.cls});this.initEvents()},enable:function(){this.disabled=false;this.el.removeClass(this.slider.disabledClass)},disable:function(){this.disabled=true;this.el.addClass(this.slider.disabledClass)},initEvents:function(){var a=this.el;a.addClassOnOver("x-slider-thumb-over");this.tracker=new Ext.dd.DragTracker({onBeforeStart:this.onBeforeDragStart.createDelegate(this),onStart:this.onDragStart.createDelegate(this),onDrag:this.onDrag.createDelegate(this),onEnd:this.onDragEnd.createDelegate(this),tolerance:3,autoStart:300});this.tracker.initEl(a)},onBeforeDragStart:function(a){if(this.disabled){return false}else{this.slider.promoteThumb(this);return true}},onDragStart:function(a){this.el.addClass("x-slider-thumb-drag");this.dragging=true;this.dragStartValue=this.value;this.slider.fireEvent("dragstart",this.slider,a,this)},onDrag:function(f){var c=this.slider,b=this.index,d=this.getNewValue();if(this.constrain){var a=c.thumbs[b+1],g=c.thumbs[b-1];if(g!=undefined&&d<=g.value){d=g.value}if(a!=undefined&&d>=a.value){d=a.value}}c.setValue(b,d,false);c.fireEvent("drag",c,f,this)},getNewValue:function(){var a=this.slider,b=a.innerEl.translatePoints(this.tracker.getXY());return Ext.util.Format.round(a.reverseValue(b.left),a.decimalPrecision)},onDragEnd:function(c){var a=this.slider,b=this.value;this.el.removeClass("x-slider-thumb-drag");this.dragging=false;a.fireEvent("dragend",a,c);if(this.dragStartValue!=b){a.fireEvent("changecomplete",a,b,this)}},destroy:function(){Ext.destroyMembers(this,"tracker","el")}});Ext.slider.MultiSlider=Ext.extend(Ext.BoxComponent,{vertical:false,minValue:0,maxValue:100,decimalPrecision:0,keyIncrement:1,increment:0,clickRange:[5,15],clickToChange:true,animate:true,constrainThumbs:true,topThumbZIndex:10000,initComponent:function(){if(!Ext.isDefined(this.value)){this.value=this.minValue}this.thumbs=[];Ext.slider.MultiSlider.superclass.initComponent.call(this);this.keyIncrement=Math.max(this.increment,this.keyIncrement);this.addEvents("beforechange","change","changecomplete","dragstart","drag","dragend");if(this.values==undefined||Ext.isEmpty(this.values)){this.values=[0]}var a=this.values;for(var b=0;b<a.length;b++){this.addThumb(a[b])}if(this.vertical){Ext.apply(this,Ext.slider.Vertical)}},addThumb:function(b){var a=new Ext.slider.Thumb({value:b,slider:this,index:this.thumbs.length,constrain:this.constrainThumbs});this.thumbs.push(a);if(this.rendered){a.render()}},promoteThumb:function(d){var a=this.thumbs,f,b;for(var e=0,c=a.length;e<c;e++){b=a[e];if(b==d){f=this.topThumbZIndex}else{f=""}b.el.setStyle("zIndex",f)}},onRender:function(){this.autoEl={cls:"x-slider "+(this.vertical?"x-slider-vert":"x-slider-horz"),cn:{cls:"x-slider-end",cn:{cls:"x-slider-inner",cn:[{tag:"a",cls:"x-slider-focus",href:"#",tabIndex:"-1",hidefocus:"on"}]}}};Ext.slider.MultiSlider.superclass.onRender.apply(this,arguments);this.endEl=this.el.first();this.innerEl=this.endEl.first();this.focusEl=this.innerEl.child(".x-slider-focus");for(var b=0;b<this.thumbs.length;b++){this.thumbs[b].render()}var a=this.innerEl.child(".x-slider-thumb");this.halfThumb=(this.vertical?a.getHeight():a.getWidth())/2;this.initEvents()},initEvents:function(){this.mon(this.el,{scope:this,mousedown:this.onMouseDown,keydown:this.onKeyDown});this.focusEl.swallowEvent("click",true)},onMouseDown:function(d){if(this.disabled){return}var c=false;for(var b=0;b<this.thumbs.length;b++){c=c||d.target==this.thumbs[b].el.dom}if(this.clickToChange&&!c){var a=this.innerEl.translatePoints(d.getXY());this.onClickChange(a)}this.focus()},onClickChange:function(c){if(c.top>this.clickRange[0]&&c.top<this.clickRange[1]){var a=this.getNearest(c,"left"),b=a.index;this.setValue(b,Ext.util.Format.round(this.reverseValue(c.left),this.decimalPrecision),undefined,true)}},getNearest:function(j,b){var l=b=="top"?this.innerEl.getHeight()-j[b]:j[b],f=this.reverseValue(l),h=(this.maxValue-this.minValue)+5,e=0,c=null;for(var d=0;d<this.thumbs.length;d++){var a=this.thumbs[d],k=a.value,g=Math.abs(k-f);if(Math.abs(g<=h)){c=a;e=d;h=g}}return c},onKeyDown:function(b){if(this.disabled||this.thumbs.length!==1){b.preventDefault();return}var a=b.getKey(),c;switch(a){case b.UP:case b.RIGHT:b.stopEvent();c=b.ctrlKey?this.maxValue:this.getValue(0)+this.keyIncrement;this.setValue(0,c,undefined,true);break;case b.DOWN:case b.LEFT:b.stopEvent();c=b.ctrlKey?this.minValue:this.getValue(0)-this.keyIncrement;this.setValue(0,c,undefined,true);break;default:b.preventDefault()}},doSnap:function(b){if(!(this.increment&&b)){return b}var d=b,c=this.increment,a=b%c;if(a!=0){d-=a;if(a*2>=c){d+=c}else{if(a*2<-c){d-=c}}}return d.constrain(this.minValue,this.maxValue)},afterRender:function(){Ext.slider.MultiSlider.superclass.afterRender.apply(this,arguments);for(var c=0;c<this.thumbs.length;c++){var b=this.thumbs[c];if(b.value!==undefined){var a=this.normalizeValue(b.value);if(a!==b.value){this.setValue(c,a,false)}else{this.moveThumb(c,this.translateValue(a),false)}}}},getRatio:function(){var a=this.innerEl.getWidth(),b=this.maxValue-this.minValue;return b==0?a:(a/b)},normalizeValue:function(a){a=this.doSnap(a);a=Ext.util.Format.round(a,this.decimalPrecision);a=a.constrain(this.minValue,this.maxValue);return a},setMinValue:function(e){this.minValue=e;var d=0,b=this.thumbs,a=b.length,c;for(;d<a;++d){c=b[d];c.value=c.value<e?e:c.value}this.syncThumb()},setMaxValue:function(e){this.maxValue=e;var d=0,b=this.thumbs,a=b.length,c;for(;d<a;++d){c=b[d];c.value=c.value>e?e:c.value}this.syncThumb()},setValue:function(d,c,b,f){var a=this.thumbs[d],e=a.el;c=this.normalizeValue(c);if(c!==a.value&&this.fireEvent("beforechange",this,c,a.value,a)!==false){a.value=c;if(this.rendered){this.moveThumb(d,this.translateValue(c),b!==false);this.fireEvent("change",this,c,a);if(f){this.fireEvent("changecomplete",this,c,a)}}}},translateValue:function(a){var b=this.getRatio();return(a*b)-(this.minValue*b)-this.halfThumb},reverseValue:function(b){var a=this.getRatio();return(b+(this.minValue*a))/a},moveThumb:function(d,c,b){var a=this.thumbs[d].el;if(!b||this.animate===false){a.setLeft(c)}else{a.shift({left:c,stopFx:true,duration:0.35})}},focus:function(){this.focusEl.focus(10)},onResize:function(c,e){var b=this.thumbs,a=b.length,d=0;for(;d<a;++d){b[d].el.stopFx()}if(Ext.isNumber(c)){this.innerEl.setWidth(c-(this.el.getPadding("l")+this.endEl.getPadding("r")))}this.syncThumb();Ext.slider.MultiSlider.superclass.onResize.apply(this,arguments)},onDisable:function(){Ext.slider.MultiSlider.superclass.onDisable.call(this);for(var b=0;b<this.thumbs.length;b++){var a=this.thumbs[b],c=a.el;a.disable();if(Ext.isIE){var d=c.getXY();c.hide();this.innerEl.addClass(this.disabledClass).dom.disabled=true;if(!this.thumbHolder){this.thumbHolder=this.endEl.createChild({cls:"x-slider-thumb "+this.disabledClass})}this.thumbHolder.show().setXY(d)}}},onEnable:function(){Ext.slider.MultiSlider.superclass.onEnable.call(this);for(var b=0;b<this.thumbs.length;b++){var a=this.thumbs[b],c=a.el;a.enable();if(Ext.isIE){this.innerEl.removeClass(this.disabledClass).dom.disabled=false;if(this.thumbHolder){this.thumbHolder.hide()}c.show();this.syncThumb()}}},syncThumb:function(){if(this.rendered){for(var a=0;a<this.thumbs.length;a++){this.moveThumb(a,this.translateValue(this.thumbs[a].value))}}},getValue:function(a){return this.thumbs[a].value},getValues:function(){var a=[];for(var b=0;b<this.thumbs.length;b++){a.push(this.thumbs[b].value)}return a},beforeDestroy:function(){var b=this.thumbs;for(var c=0,a=b.length;c<a;++c){b[c].destroy();b[c]=null}Ext.destroyMembers(this,"endEl","innerEl","focusEl","thumbHolder");Ext.slider.MultiSlider.superclass.beforeDestroy.call(this)}});Ext.reg("multislider",Ext.slider.MultiSlider);Ext.slider.SingleSlider=Ext.extend(Ext.slider.MultiSlider,{constructor:function(a){a=a||{};Ext.applyIf(a,{values:[a.value||0]});Ext.slider.SingleSlider.superclass.constructor.call(this,a)},getValue:function(){return Ext.slider.SingleSlider.superclass.getValue.call(this,0)},setValue:function(d,b){var c=Ext.toArray(arguments),a=c.length;if(a==1||(a<=3&&typeof arguments[1]!="number")){c.unshift(0)}return Ext.slider.SingleSlider.superclass.setValue.apply(this,c)},syncThumb:function(){return Ext.slider.SingleSlider.superclass.syncThumb.apply(this,[0].concat(arguments))},getNearest:function(){return this.thumbs[0]}});Ext.Slider=Ext.slider.SingleSlider;Ext.reg("slider",Ext.slider.SingleSlider);Ext.slider.Vertical={onResize:function(a,b){this.innerEl.setHeight(b-(this.el.getPadding("t")+this.endEl.getPadding("b")));this.syncThumb()},getRatio:function(){var b=this.innerEl.getHeight(),a=this.maxValue-this.minValue;return b/a},moveThumb:function(d,c,b){var a=this.thumbs[d],e=a.el;if(!b||this.animate===false){e.setBottom(c)}else{e.shift({bottom:c,stopFx:true,duration:0.35})}},onClickChange:function(c){if(c.left>this.clickRange[0]&&c.left<this.clickRange[1]){var a=this.getNearest(c,"top"),b=a.index,d=this.minValue+this.reverseValue(this.innerEl.getHeight()-c.top);this.setValue(b,Ext.util.Format.round(d,this.decimalPrecision),undefined,true)}}};Ext.slider.Thumb.Vertical={getNewValue:function(){var b=this.slider,c=b.innerEl,d=c.translatePoints(this.tracker.getXY()),a=c.getHeight()-d.top;return b.minValue+Ext.util.Format.round(a/b.getRatio(),b.decimalPrecision)}};Ext.ProgressBar=Ext.extend(Ext.BoxComponent,{baseCls:"x-progress",animate:false,waitTimer:null,initComponent:function(){Ext.ProgressBar.superclass.initComponent.call(this);this.addEvents("update")},onRender:function(d,a){var c=new Ext.Template('<div class="{cls}-wrap">','<div class="{cls}-inner">','<div class="{cls}-bar">','<div class="{cls}-text">',"<div>&#160;</div>","</div>","</div>",'<div class="{cls}-text {cls}-text-back">',"<div>&#160;</div>","</div>","</div>","</div>");this.el=a?c.insertBefore(a,{cls:this.baseCls},true):c.append(d,{cls:this.baseCls},true);if(this.id){this.el.dom.id=this.id}var b=this.el.dom.firstChild;this.progressBar=Ext.get(b.firstChild);if(this.textEl){this.textEl=Ext.get(this.textEl);delete this.textTopEl}else{this.textTopEl=Ext.get(this.progressBar.dom.firstChild);var e=Ext.get(b.childNodes[1]);this.textTopEl.setStyle("z-index",99).addClass("x-hidden");this.textEl=new Ext.CompositeElement([this.textTopEl.dom.firstChild,e.dom.firstChild]);this.textEl.setWidth(b.offsetWidth)}this.progressBar.setHeight(b.offsetHeight)},afterRender:function(){Ext.ProgressBar.superclass.afterRender.call(this);if(this.value){this.updateProgress(this.value,this.text)}else{this.updateText(this.text)}},updateProgress:function(c,d,b){this.value=c||0;if(d){this.updateText(d)}if(this.rendered&&!this.isDestroyed){var a=Math.floor(c*this.el.dom.firstChild.offsetWidth);this.progressBar.setWidth(a,b===true||(b!==false&&this.animate));if(this.textTopEl){this.textTopEl.removeClass("x-hidden").setWidth(a)}}this.fireEvent("update",this,c,d);return this},wait:function(b){if(!this.waitTimer){var a=this;b=b||{};this.updateText(b.text);this.waitTimer=Ext.TaskMgr.start({run:function(c){var d=b.increment||10;c-=1;this.updateProgress(((((c+d)%d)+1)*(100/d))*0.01,null,b.animate)},interval:b.interval||1000,duration:b.duration,onStop:function(){if(b.fn){b.fn.apply(b.scope||this)}this.reset()},scope:a})}return this},isWaiting:function(){return this.waitTimer!==null},updateText:function(a){this.text=a||"&#160;";if(this.rendered){this.textEl.update(this.text)}return this},syncProgressBar:function(){if(this.value){this.updateProgress(this.value,this.text)}return this},setSize:function(a,c){Ext.ProgressBar.superclass.setSize.call(this,a,c);if(this.textTopEl){var b=this.el.dom.firstChild;this.textEl.setSize(b.offsetWidth,b.offsetHeight)}this.syncProgressBar();return this},reset:function(a){this.updateProgress(0);if(this.textTopEl){this.textTopEl.addClass("x-hidden")}this.clearTimer();if(a===true){this.hide()}return this},clearTimer:function(){if(this.waitTimer){this.waitTimer.onStop=null;Ext.TaskMgr.stop(this.waitTimer);this.waitTimer=null}},onDestroy:function(){this.clearTimer();if(this.rendered){if(this.textEl.isComposite){this.textEl.clear()}Ext.destroyMembers(this,"textEl","progressBar","textTopEl")}Ext.ProgressBar.superclass.onDestroy.call(this)}});Ext.reg("progress",Ext.ProgressBar);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping-debug.js	(revision 76)
@@ -0,0 +1,263 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.GroupingStore
+ * @extends Ext.data.Store
+ * A specialized store implementation that provides for grouping records by one of the available fields. This
+ * is usually used in conjunction with an {@link Ext.grid.GroupingView} to provide the data model for
+ * a grouped GridPanel.
+ *
+ * Internally, GroupingStore is simply a normal Store with multi sorting enabled from the start. The grouping field
+ * and direction are always injected as the first sorter pair. GroupingView picks up on the configured groupField and
+ * builds grid rows appropriately.
+ *
+ * @constructor
+ * Creates a new GroupingStore.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype groupingstore
+ */
+Ext.data.GroupingStore = Ext.extend(Ext.data.Store, {
+
+    //inherit docs
+    constructor: function(config) {
+        config = config || {};
+
+        //We do some preprocessing here to massage the grouping + sorting options into a single
+        //multi sort array. If grouping and sorting options are both presented to the constructor,
+        //the sorters array consists of the grouping sorter object followed by the sorting sorter object
+        //see Ext.data.Store's sorting functions for details about how multi sorting works
+        this.hasMultiSort  = true;
+        this.multiSortInfo = this.multiSortInfo || {sorters: []};
+
+        var sorters    = this.multiSortInfo.sorters,
+            groupField = config.groupField || this.groupField,
+            sortInfo   = config.sortInfo || this.sortInfo,
+            groupDir   = config.groupDir || this.groupDir;
+
+        //add the grouping sorter object first
+        if(groupField){
+            sorters.push({
+                field    : groupField,
+                direction: groupDir
+            });
+        }
+
+        //add the sorting sorter object if it is present
+        if (sortInfo) {
+            sorters.push(sortInfo);
+        }
+
+        Ext.data.GroupingStore.superclass.constructor.call(this, config);
+
+        this.addEvents(
+          /**
+           * @event groupchange
+           * Fired whenever a call to store.groupBy successfully changes the grouping on the store
+           * @param {Ext.data.GroupingStore} store The grouping store
+           * @param {String} groupField The field that the store is now grouped by
+           */
+          'groupchange'
+        );
+
+        this.applyGroupField();
+    },
+
+    /**
+     * @cfg {String} groupField
+     * The field name by which to sort the store's data (defaults to '').
+     */
+    /**
+     * @cfg {Boolean} remoteGroup
+     * True if the grouping should apply on the server side, false if it is local only (defaults to false).  If the
+     * grouping is local, it can be applied immediately to the data.  If it is remote, then it will simply act as a
+     * helper, automatically sending the grouping field name as the 'groupBy' param with each XHR call.
+     */
+    remoteGroup : false,
+    /**
+     * @cfg {Boolean} groupOnSort
+     * True to sort the data on the grouping field when a grouping operation occurs, false to sort based on the
+     * existing sort info (defaults to false).
+     */
+    groupOnSort:false,
+
+    /**
+     * @cfg {String} groupDir
+     * The direction to sort the groups. Defaults to <tt>'ASC'</tt>.
+     */
+    groupDir : 'ASC',
+
+    /**
+     * Clears any existing grouping and refreshes the data using the default sort.
+     */
+    clearGrouping : function(){
+        this.groupField = false;
+
+        if(this.remoteGroup){
+            if(this.baseParams){
+                delete this.baseParams.groupBy;
+                delete this.baseParams.groupDir;
+            }
+            var lo = this.lastOptions;
+            if(lo && lo.params){
+                delete lo.params.groupBy;
+                delete lo.params.groupDir;
+            }
+
+            this.reload();
+        }else{
+            this.sort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Groups the data by the specified field.
+     * @param {String} field The field name by which to sort the store's data
+     * @param {Boolean} forceRegroup (optional) True to force the group to be refreshed even if the field passed
+     * in is the same as the current grouping field, false to skip grouping on the same field (defaults to false)
+     */
+    groupBy : function(field, forceRegroup, direction) {
+        direction = direction ? (String(direction).toUpperCase() == 'DESC' ? 'DESC' : 'ASC') : this.groupDir;
+
+        if (this.groupField == field && this.groupDir == direction && !forceRegroup) {
+            return; // already grouped by this field
+        }
+
+        //check the contents of the first sorter. If the field matches the CURRENT groupField (before it is set to the new one),
+        //remove the sorter as it is actually the grouper. The new grouper is added back in by this.sort
+        var sorters = this.multiSortInfo.sorters;
+        if (sorters.length > 0 && sorters[0].field == this.groupField) {
+            sorters.shift();
+        }
+
+        this.groupField = field;
+        this.groupDir = direction;
+        this.applyGroupField();
+
+        var fireGroupEvent = function() {
+            this.fireEvent('groupchange', this, this.getGroupState());
+        };
+
+        if (this.groupOnSort) {
+            this.sort(field, direction);
+            fireGroupEvent.call(this);
+            return;
+        }
+
+        if (this.remoteGroup) {
+            this.on('load', fireGroupEvent, this, {single: true});
+            this.reload();
+        } else {
+            this.sort(sorters);
+            fireGroupEvent.call(this);
+        }
+    },
+
+    //GroupingStore always uses multisorting so we intercept calls to sort here to make sure that our grouping sorter object
+    //is always injected first.
+    sort : function(fieldName, dir) {
+        if (this.remoteSort) {
+            return Ext.data.GroupingStore.superclass.sort.call(this, fieldName, dir);
+        }
+
+        var sorters = [];
+
+        //cater for any existing valid arguments to this.sort, massage them into an array of sorter objects
+        if (Ext.isArray(arguments[0])) {
+            sorters = arguments[0];
+        } else if (fieldName == undefined) {
+            //we preserve the existing sortInfo here because this.sort is called after
+            //clearGrouping and there may be existing sorting
+            sorters = this.sortInfo ? [this.sortInfo] : [];
+        } else {
+            //TODO: this is lifted straight from Ext.data.Store's singleSort function. It should instead be
+            //refactored into a common method if possible
+            var field = this.fields.get(fieldName);
+            if (!field) return false;
+
+            var name       = field.name,
+                sortInfo   = this.sortInfo || null,
+                sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+            if (!dir) {
+                if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                    dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+                } else {
+                    dir = field.sortDir;
+                }
+            }
+
+            this.sortToggle[name] = dir;
+            this.sortInfo = {field: name, direction: dir};
+
+            sorters = [this.sortInfo];
+        }
+
+        //add the grouping sorter object as the first multisort sorter
+        if (this.groupField) {
+            sorters.unshift({direction: this.groupDir, field: this.groupField});
+        }
+
+        return this.multiSort.call(this, sorters, dir);
+    },
+
+    /**
+     * @private
+     * Saves the current grouping field and direction to this.baseParams and this.lastOptions.params
+     * if we're using remote grouping. Does not actually perform any grouping - just stores values
+     */
+    applyGroupField: function(){
+        if (this.remoteGroup) {
+            if(!this.baseParams){
+                this.baseParams = {};
+            }
+
+            Ext.apply(this.baseParams, {
+                groupBy : this.groupField,
+                groupDir: this.groupDir
+            });
+
+            var lo = this.lastOptions;
+            if (lo && lo.params) {
+                lo.params.groupDir = this.groupDir;
+
+                //this is deleted because of a bug reported at http://www.extjs.com/forum/showthread.php?t=82907
+                delete lo.params.groupBy;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * TODO: This function is apparently never invoked anywhere in the framework. It has no documentation
+     * and should be considered for deletion
+     */
+    applyGrouping : function(alwaysFireChange){
+        if(this.groupField !== false){
+            this.groupBy(this.groupField, true, this.groupDir);
+            return true;
+        }else{
+            if(alwaysFireChange === true){
+                this.fireEvent('datachanged', this);
+            }
+            return false;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the grouping field that should be used. If groupOnSort is used this will be sortInfo's field,
+     * otherwise it will be this.groupField
+     * @return {String} The group field
+     */
+    getGroupState : function(){
+        return this.groupOnSort && this.groupField !== false ?
+               (this.sortInfo ? this.sortInfo.field : undefined) : this.groupField;
+    }
+});
+Ext.reg('groupingstore', Ext.data.GroupingStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){var h=Ext.util,j=Ext.each,g=true,i=false;h.Observable=function(){var k=this,l=k.events;if(k.listeners){k.on(k.listeners);delete k.listeners}k.events=l||{}};h.Observable.prototype={filterOptRe:/^(?:scope|delay|buffer|single)$/,fireEvent:function(){var k=Array.prototype.slice.call(arguments,0),m=k[0].toLowerCase(),n=this,l=g,p=n.events[m],s,o,r;if(n.eventsSuspended===g){if(o=n.eventQueue){o.push(k)}}else{if(typeof p=="object"){if(p.bubble){if(p.fire.apply(p,k.slice(1))===i){return i}r=n.getBubbleTarget&&n.getBubbleTarget();if(r&&r.enableBubble){s=r.events[m];if(!s||typeof s!="object"||!s.bubble){r.enableBubble(m)}return r.fireEvent.apply(r,k)}}else{k.shift();l=p.fire.apply(p,k)}}}return l},addListener:function(k,m,l,r){var n=this,q,s,p;if(typeof k=="object"){r=k;for(q in r){s=r[q];if(!n.filterOptRe.test(q)){n.addListener(q,s.fn||s,s.scope||r.scope,s.fn?s:r)}}}else{k=k.toLowerCase();p=n.events[k]||g;if(typeof p=="boolean"){n.events[k]=p=new h.Event(n,k)}p.addListener(m,l,typeof r=="object"?r:{})}},removeListener:function(k,m,l){var n=this.events[k.toLowerCase()];if(typeof n=="object"){n.removeListener(m,l)}},purgeListeners:function(){var m=this.events,k,l;for(l in m){k=m[l];if(typeof k=="object"){k.clearListeners()}}},addEvents:function(n){var m=this;m.events=m.events||{};if(typeof n=="string"){var k=arguments,l=k.length;while(l--){m.events[k[l]]=m.events[k[l]]||g}}else{Ext.applyIf(m.events,n)}},hasListener:function(k){var l=this.events[k.toLowerCase()];return typeof l=="object"&&l.listeners.length>0},suspendEvents:function(k){this.eventsSuspended=g;if(k&&!this.eventQueue){this.eventQueue=[]}},resumeEvents:function(){var k=this,l=k.eventQueue||[];k.eventsSuspended=i;delete k.eventQueue;j(l,function(m){k.fireEvent.apply(k,m)})}};var d=h.Observable.prototype;d.on=d.addListener;d.un=d.removeListener;h.Observable.releaseCapture=function(k){k.fireEvent=d.fireEvent};function e(l,m,k){return function(){if(m.target==arguments[0]){l.apply(k,Array.prototype.slice.call(arguments,0))}}}function b(n,p,k,m){k.task=new h.DelayedTask();return function(){k.task.delay(p.buffer,n,m,Array.prototype.slice.call(arguments,0))}}function c(m,n,l,k){return function(){n.removeListener(l,k);return m.apply(k,arguments)}}function a(n,p,k,m){return function(){var l=new h.DelayedTask(),o=Array.prototype.slice.call(arguments,0);if(!k.tasks){k.tasks=[]}k.tasks.push(l);l.delay(p.delay||10,function(){k.tasks.remove(l);n.apply(m,o)},m)}}h.Event=function(l,k){this.name=k;this.obj=l;this.listeners=[]};h.Event.prototype={addListener:function(o,n,m){var p=this,k;n=n||p.obj;if(!p.isListening(o,n)){k=p.createListener(o,n,m);if(p.firing){p.listeners=p.listeners.slice(0)}p.listeners.push(k)}},createListener:function(p,n,q){q=q||{};n=n||this.obj;var k={fn:p,scope:n,options:q},m=p;if(q.target){m=e(m,q,n)}if(q.delay){m=a(m,q,k,n)}if(q.single){m=c(m,this,p,n)}if(q.buffer){m=b(m,q,k,n)}k.fireFn=m;return k},findListener:function(o,n){var p=this.listeners,m=p.length,k;n=n||this.obj;while(m--){k=p[m];if(k){if(k.fn==o&&k.scope==n){return m}}}return -1},isListening:function(l,k){return this.findListener(l,k)!=-1},removeListener:function(r,q){var p,m,n,s=this,o=i;if((p=s.findListener(r,q))!=-1){if(s.firing){s.listeners=s.listeners.slice(0)}m=s.listeners[p];if(m.task){m.task.cancel();delete m.task}n=m.tasks&&m.tasks.length;if(n){while(n--){m.tasks[n].cancel()}delete m.tasks}s.listeners.splice(p,1);o=g}return o},clearListeners:function(){var n=this,k=n.listeners,m=k.length;while(m--){n.removeListener(k[m].fn,k[m].scope)}},fire:function(){var q=this,p=q.listeners,k=p.length,o=0,m;if(k>0){q.firing=g;var n=Array.prototype.slice.call(arguments,0);for(;o<k;o++){m=p[o];if(m&&m.fireFn.apply(m.scope||q.obj||window,n)===i){return(q.firing=i)}}}q.firing=i;return g}}})();Ext.DomHelper=function(){var x=null,k=/^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,m=/^table|tbody|tr|td$/i,d=/tag|children|cn|html$/i,t=/td|tr|tbody/i,o=/([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,v=/end/i,r,n="afterbegin",p="afterend",c="beforebegin",q="beforeend",a="<table>",i="</table>",b=a+"<tbody>",j="</tbody>"+i,l=b+"<tr>",w="</tr>"+j;function h(B,D,C,E,A,y){var z=r.insertHtml(E,Ext.getDom(B),u(D));return C?Ext.get(z,true):z}function u(D){var z="",y,C,B,E;if(typeof D=="string"){z=D}else{if(Ext.isArray(D)){for(var A=0;A<D.length;A++){if(D[A]){z+=u(D[A])}}}else{z+="<"+(D.tag=D.tag||"div");for(y in D){C=D[y];if(!d.test(y)){if(typeof C=="object"){z+=" "+y+'="';for(B in C){z+=B+":"+C[B]+";"}z+='"'}else{z+=" "+({cls:"class",htmlFor:"for"}[y]||y)+'="'+C+'"'}}}if(k.test(D.tag)){z+="/>"}else{z+=">";if((E=D.children||D.cn)){z+=u(E)}else{if(D.html){z+=D.html}}z+="</"+D.tag+">"}}}return z}function g(F,C,B,D){x.innerHTML=[C,B,D].join("");var y=-1,A=x,z;while(++y<F){A=A.firstChild}if(z=A.nextSibling){var E=document.createDocumentFragment();while(A){z=A.nextSibling;E.appendChild(A);A=z}A=E}return A}function e(y,z,B,A){var C,D;x=x||document.createElement("div");if(y=="td"&&(z==n||z==q)||!t.test(y)&&(z==c||z==p)){return}D=z==c?B:z==p?B.nextSibling:z==n?B.firstChild:null;if(z==c||z==p){B=B.parentNode}if(y=="td"||(y=="tr"&&(z==q||z==n))){C=g(4,l,A,w)}else{if((y=="tbody"&&(z==q||z==n))||(y=="tr"&&(z==c||z==p))){C=g(3,b,A,j)}else{C=g(2,a,A,i)}}B.insertBefore(C,D);return C}function s(A){var D=document.createElement("div"),y=document.createDocumentFragment(),z=0,B,C;D.innerHTML=A;C=D.childNodes;B=C.length;for(;z<B;z++){y.appendChild(C[z].cloneNode(true))}return y}r={markup:function(y){return u(y)},applyStyles:function(y,z){if(z){var A;y=Ext.fly(y);if(typeof z=="function"){z=z.call()}if(typeof z=="string"){o.lastIndex=0;while((A=o.exec(z))){y.setStyle(A[1],A[2])}}else{if(typeof z=="object"){y.setStyle(z)}}}},insertHtml:function(D,y,E){var B={},A,F,C,G,H,z;D=D.toLowerCase();B[c]=["BeforeBegin","previousSibling"];B[p]=["AfterEnd","nextSibling"];if(y.insertAdjacentHTML){if(m.test(y.tagName)&&(z=e(y.tagName.toLowerCase(),D,y,E))){return z}B[n]=["AfterBegin","firstChild"];B[q]=["BeforeEnd","lastChild"];if((A=B[D])){y.insertAdjacentHTML(A[0],E);return y[A[1]]}}else{F=y.ownerDocument.createRange();G="setStart"+(v.test(D)?"After":"Before");if(B[D]){F[G](y);if(!F.createContextualFragment){H=s(E)}else{H=F.createContextualFragment(E)}y.parentNode.insertBefore(H,D==c?y:y.nextSibling);return y[(D==c?"previous":"next")+"Sibling"]}else{C=(D==n?"first":"last")+"Child";if(y.firstChild){F[G](y[C]);if(!F.createContextualFragment){H=s(E)}else{H=F.createContextualFragment(E)}if(D==n){y.insertBefore(H,y.firstChild)}else{y.appendChild(H)}}else{y.innerHTML=E}return y[C]}}throw'Illegal insertion point -> "'+D+'"'},insertBefore:function(y,A,z){return h(y,A,z,c)},insertAfter:function(y,A,z){return h(y,A,z,p,"nextSibling")},insertFirst:function(y,A,z){return h(y,A,z,n,"firstChild")},append:function(y,A,z){return h(y,A,z,q,"",true)},overwrite:function(y,A,z){y=Ext.getDom(y);y.innerHTML=u(A);return z?Ext.get(y.firstChild):y.firstChild},createHtml:u};return r}();Ext.Template=function(h){var j=this,c=arguments,e=[],d;if(Ext.isArray(h)){h=h.join("")}else{if(c.length>1){for(var g=0,b=c.length;g<b;g++){d=c[g];if(typeof d=="object"){Ext.apply(j,d)}else{e.push(d)}}h=e.join("")}}j.html=h;if(j.compiled){j.compile()}};Ext.Template.prototype={re:/\{([\w\-]+)\}/g,applyTemplate:function(a){var b=this;return b.compiled?b.compiled(a):b.html.replace(b.re,function(c,d){return a[d]!==undefined?a[d]:""})},set:function(a,c){var b=this;b.html=a;b.compiled=null;return c?b.compile():b},compile:function(){var me=this,sep=Ext.isGecko?"+":",";function fn(m,name){name="values['"+name+"']";return"'"+sep+"("+name+" == undefined ? '' : "+name+")"+sep+"'"}eval("this.compiled = function(values){ return "+(Ext.isGecko?"'":"['")+me.html.replace(/\\/g,"\\\\").replace(/(\r\n|\n)/g,"\\n").replace(/'/g,"\\'").replace(this.re,fn)+(Ext.isGecko?"';};":"'].join('');};"));return me},insertFirst:function(b,a,c){return this.doInsert("afterBegin",b,a,c)},insertBefore:function(b,a,c){return this.doInsert("beforeBegin",b,a,c)},insertAfter:function(b,a,c){return this.doInsert("afterEnd",b,a,c)},append:function(b,a,c){return this.doInsert("beforeEnd",b,a,c)},doInsert:function(c,e,b,a){e=Ext.getDom(e);var d=Ext.DomHelper.insertHtml(c,e,this.applyTemplate(b));return a?Ext.get(d,true):d},overwrite:function(b,a,c){b=Ext.getDom(b);b.innerHTML=this.applyTemplate(a);return c?Ext.get(b.firstChild,true):b.firstChild}};Ext.Template.prototype.apply=Ext.Template.prototype.applyTemplate;Ext.Template.from=function(b,a){b=Ext.getDom(b);return new Ext.Template(b.value||b.innerHTML,a||"")};Ext.DomQuery=function(){var cache={},simpleCache={},valueCache={},nonSpace=/\S/,trimRe=/^\s+|\s+$/g,tplRe=/\{(\d+)\}/g,modeRe=/^(\s?[\/>+~]\s?|\s|$)/,tagTokenRe=/^(#)?([\w\-\*]+)/,nthRe=/(\d*)n\+?(\d*)/,nthRe2=/\D/,isIE=window.ActiveXObject?true:false,key=30803;eval("var batch = 30803;");function child(parent,index){var i=0,n=parent.firstChild;while(n){if(n.nodeType==1){if(++i==index){return n}}n=n.nextSibling}return null}function next(n){while((n=n.nextSibling)&&n.nodeType!=1){}return n}function prev(n){while((n=n.previousSibling)&&n.nodeType!=1){}return n}function children(parent){var n=parent.firstChild,nodeIndex=-1,nextNode;while(n){nextNode=n.nextSibling;if(n.nodeType==3&&!nonSpace.test(n.nodeValue)){parent.removeChild(n)}else{n.nodeIndex=++nodeIndex}n=nextNode}return this}function byClassName(nodeSet,cls){if(!cls){return nodeSet}var result=[],ri=-1;for(var i=0,ci;ci=nodeSet[i];i++){if((" "+ci.className+" ").indexOf(cls)!=-1){result[++ri]=ci}}return result}function attrValue(n,attr){if(!n.tagName&&typeof n.length!="undefined"){n=n[0]}if(!n){return null}if(attr=="for"){return n.htmlFor}if(attr=="class"||attr=="className"){return n.className}return n.getAttribute(attr)||n[attr]}function getNodes(ns,mode,tagName){var result=[],ri=-1,cs;if(!ns){return result}tagName=tagName||"*";if(typeof ns.getElementsByTagName!="undefined"){ns=[ns]}if(!mode){for(var i=0,ni;ni=ns[i];i++){cs=ni.getElementsByTagName(tagName);for(var j=0,ci;ci=cs[j];j++){result[++ri]=ci}}}else{if(mode=="/"||mode==">"){var utag=tagName.toUpperCase();for(var i=0,ni,cn;ni=ns[i];i++){cn=ni.childNodes;for(var j=0,cj;cj=cn[j];j++){if(cj.nodeName==utag||cj.nodeName==tagName||tagName=="*"){result[++ri]=cj}}}}else{if(mode=="+"){var utag=tagName.toUpperCase();for(var i=0,n;n=ns[i];i++){while((n=n.nextSibling)&&n.nodeType!=1){}if(n&&(n.nodeName==utag||n.nodeName==tagName||tagName=="*")){result[++ri]=n}}}else{if(mode=="~"){var utag=tagName.toUpperCase();for(var i=0,n;n=ns[i];i++){while((n=n.nextSibling)){if(n.nodeName==utag||n.nodeName==tagName||tagName=="*"){result[++ri]=n}}}}}}}return result}function concat(a,b){if(b.slice){return a.concat(b)}for(var i=0,l=b.length;i<l;i++){a[a.length]=b[i]}return a}function byTag(cs,tagName){if(cs.tagName||cs==document){cs=[cs]}if(!tagName){return cs}var result=[],ri=-1;tagName=tagName.toLowerCase();for(var i=0,ci;ci=cs[i];i++){if(ci.nodeType==1&&ci.tagName.toLowerCase()==tagName){result[++ri]=ci}}return result}function byId(cs,id){if(cs.tagName||cs==document){cs=[cs]}if(!id){return cs}var result=[],ri=-1;for(var i=0,ci;ci=cs[i];i++){if(ci&&ci.id==id){result[++ri]=ci;return result}}return result}function byAttribute(cs,attr,value,op,custom){var result=[],ri=-1,useGetStyle=custom=="{",fn=Ext.DomQuery.operators[op],a,xml,hasXml;for(var i=0,ci;ci=cs[i];i++){if(ci.nodeType!=1){continue}if(!hasXml){xml=Ext.DomQuery.isXml(ci);hasXml=true}if(!xml){if(useGetStyle){a=Ext.DomQuery.getStyle(ci,attr)}else{if(attr=="class"||attr=="className"){a=ci.className}else{if(attr=="for"){a=ci.htmlFor}else{if(attr=="href"){a=ci.getAttribute("href",2)}else{a=ci.getAttribute(attr)}}}}}else{a=ci.getAttribute(attr)}if((fn&&fn(a,value))||(!fn&&a)){result[++ri]=ci}}return result}function byPseudo(cs,name,value){return Ext.DomQuery.pseudos[name](cs,value)}function nodupIEXml(cs){var d=++key,r;cs[0].setAttribute("_nodup",d);r=[cs[0]];for(var i=1,len=cs.length;i<len;i++){var c=cs[i];if(!c.getAttribute("_nodup")!=d){c.setAttribute("_nodup",d);r[r.length]=c}}for(var i=0,len=cs.length;i<len;i++){cs[i].removeAttribute("_nodup")}return r}function nodup(cs){if(!cs){return[]}var len=cs.length,c,i,r=cs,cj,ri=-1;if(!len||typeof cs.nodeType!="undefined"||len==1){return cs}if(isIE&&typeof cs[0].selectSingleNode!="undefined"){return nodupIEXml(cs)}var d=++key;cs[0]._nodup=d;for(i=1;c=cs[i];i++){if(c._nodup!=d){c._nodup=d}else{r=[];for(var j=0;j<i;j++){r[++ri]=cs[j]}for(j=i+1;cj=cs[j];j++){if(cj._nodup!=d){cj._nodup=d;r[++ri]=cj}}return r}}return r}function quickDiffIEXml(c1,c2){var d=++key,r=[];for(var i=0,len=c1.length;i<len;i++){c1[i].setAttribute("_qdiff",d)}for(var i=0,len=c2.length;i<len;i++){if(c2[i].getAttribute("_qdiff")!=d){r[r.length]=c2[i]}}for(var i=0,len=c1.length;i<len;i++){c1[i].removeAttribute("_qdiff")}return r}function quickDiff(c1,c2){var len1=c1.length,d=++key,r=[];if(!len1){return c2}if(isIE&&typeof c1[0].selectSingleNode!="undefined"){return quickDiffIEXml(c1,c2)}for(var i=0;i<len1;i++){c1[i]._qdiff=d}for(var i=0,len=c2.length;i<len;i++){if(c2[i]._qdiff!=d){r[r.length]=c2[i]}}return r}function quickId(ns,mode,root,id){if(ns==root){var d=root.ownerDocument||root;return d.getElementById(id)}ns=getNodes(ns,mode,"*");return byId(ns,id)}return{getStyle:function(el,name){return Ext.fly(el).getStyle(name)},compile:function(path,type){type=type||"select";var fn=["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],mode,lastPath,matchers=Ext.DomQuery.matchers,matchersLn=matchers.length,modeMatch,lmode=path.match(modeRe);if(lmode&&lmode[1]){fn[fn.length]='mode="'+lmode[1].replace(trimRe,"")+'";';path=path.replace(lmode[1],"")}while(path.substr(0,1)=="/"){path=path.substr(1)}while(path&&lastPath!=path){lastPath=path;var tokenMatch=path.match(tagTokenRe);if(type=="select"){if(tokenMatch){if(tokenMatch[1]=="#"){fn[fn.length]='n = quickId(n, mode, root, "'+tokenMatch[2]+'");'}else{fn[fn.length]='n = getNodes(n, mode, "'+tokenMatch[2]+'");'}path=path.replace(tokenMatch[0],"")}else{if(path.substr(0,1)!="@"){fn[fn.length]='n = getNodes(n, mode, "*");'}}}else{if(tokenMatch){if(tokenMatch[1]=="#"){fn[fn.length]='n = byId(n, "'+tokenMatch[2]+'");'}else{fn[fn.length]='n = byTag(n, "'+tokenMatch[2]+'");'}path=path.replace(tokenMatch[0],"")}}while(!(modeMatch=path.match(modeRe))){var matched=false;for(var j=0;j<matchersLn;j++){var t=matchers[j];var m=path.match(t.re);if(m){fn[fn.length]=t.select.replace(tplRe,function(x,i){return m[i]});path=path.replace(m[0],"");matched=true;break}}if(!matched){throw'Error parsing selector, parsing failed at "'+path+'"'}}if(modeMatch[1]){fn[fn.length]='mode="'+modeMatch[1].replace(trimRe,"")+'";';path=path.replace(modeMatch[1],"")}}fn[fn.length]="return nodup(n);\n}";eval(fn.join(""));return f},jsSelect:function(path,root,type){root=root||document;if(typeof root=="string"){root=document.getElementById(root)}var paths=path.split(","),results=[];for(var i=0,len=paths.length;i<len;i++){var subPath=paths[i].replace(trimRe,"");if(!cache[subPath]){cache[subPath]=Ext.DomQuery.compile(subPath);if(!cache[subPath]){throw subPath+" is not a valid selector"}}var result=cache[subPath](root);if(result&&result!=document){results=results.concat(result)}}if(paths.length>1){return nodup(results)}return results},isXml:function(el){var docEl=(el?el.ownerDocument||el:0).documentElement;return docEl?docEl.nodeName!=="HTML":false},select:document.querySelectorAll?function(path,root,type){root=root||document;if(!Ext.DomQuery.isXml(root)){try{var cs=root.querySelectorAll(path);return Ext.toArray(cs)}catch(ex){}}return Ext.DomQuery.jsSelect.call(this,path,root,type)}:function(path,root,type){return Ext.DomQuery.jsSelect.call(this,path,root,type)},selectNode:function(path,root){return Ext.DomQuery.select(path,root)[0]},selectValue:function(path,root,defaultValue){path=path.replace(trimRe,"");if(!valueCache[path]){valueCache[path]=Ext.DomQuery.compile(path,"select")}var n=valueCache[path](root),v;n=n[0]?n[0]:n;if(typeof n.normalize=="function"){n.normalize()}v=(n&&n.firstChild?n.firstChild.nodeValue:null);return((v===null||v===undefined||v==="")?defaultValue:v)},selectNumber:function(path,root,defaultValue){var v=Ext.DomQuery.selectValue(path,root,defaultValue||0);return parseFloat(v)},is:function(el,ss){if(typeof el=="string"){el=document.getElementById(el)}var isArray=Ext.isArray(el),result=Ext.DomQuery.filter(isArray?el:[el],ss);return isArray?(result.length==el.length):(result.length>0)},filter:function(els,ss,nonMatches){ss=ss.replace(trimRe,"");if(!simpleCache[ss]){simpleCache[ss]=Ext.DomQuery.compile(ss,"simple")}var result=simpleCache[ss](els);return nonMatches?quickDiff(result,els):result},matchers:[{re:/^\.([\w\-]+)/,select:'n = byClassName(n, " {1} ");'},{re:/^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,select:'n = byPseudo(n, "{1}", "{2}");'},{re:/^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,select:'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'},{re:/^#([\w\-]+)/,select:'n = byId(n, "{1}");'},{re:/^@([\w\-]+)/,select:'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'}],operators:{"=":function(a,v){return a==v},"!=":function(a,v){return a!=v},"^=":function(a,v){return a&&a.substr(0,v.length)==v},"$=":function(a,v){return a&&a.substr(a.length-v.length)==v},"*=":function(a,v){return a&&a.indexOf(v)!==-1},"%=":function(a,v){return(a%v)==0},"|=":function(a,v){return a&&(a==v||a.substr(0,v.length+1)==v+"-")},"~=":function(a,v){return a&&(" "+a+" ").indexOf(" "+v+" ")!=-1}},pseudos:{"first-child":function(c){var r=[],ri=-1,n;for(var i=0,ci;ci=n=c[i];i++){while((n=n.previousSibling)&&n.nodeType!=1){}if(!n){r[++ri]=ci}}return r},"last-child":function(c){var r=[],ri=-1,n;for(var i=0,ci;ci=n=c[i];i++){while((n=n.nextSibling)&&n.nodeType!=1){}if(!n){r[++ri]=ci}}return r},"nth-child":function(c,a){var r=[],ri=-1,m=nthRe.exec(a=="even"&&"2n"||a=="odd"&&"2n+1"||!nthRe2.test(a)&&"n+"+a||a),f=(m[1]||1)-0,l=m[2]-0;for(var i=0,n;n=c[i];i++){var pn=n.parentNode;if(batch!=pn._batch){var j=0;for(var cn=pn.firstChild;cn;cn=cn.nextSibling){if(cn.nodeType==1){cn.nodeIndex=++j}}pn._batch=batch}if(f==1){if(l==0||n.nodeIndex==l){r[++ri]=n}}else{if((n.nodeIndex+l)%f==0){r[++ri]=n}}}return r},"only-child":function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(!prev(ci)&&!next(ci)){r[++ri]=ci}}return r},empty:function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var cns=ci.childNodes,j=0,cn,empty=true;while(cn=cns[j]){++j;if(cn.nodeType==1||cn.nodeType==3){empty=false;break}}if(empty){r[++ri]=ci}}return r},contains:function(c,v){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if((ci.textContent||ci.innerText||"").indexOf(v)!=-1){r[++ri]=ci}}return r},nodeValue:function(c,v){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(ci.firstChild&&ci.firstChild.nodeValue==v){r[++ri]=ci}}return r},checked:function(c){var r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(ci.checked==true){r[++ri]=ci}}return r},not:function(c,ss){return Ext.DomQuery.filter(c,ss,true)},any:function(c,selectors){var ss=selectors.split("|"),r=[],ri=-1,s;for(var i=0,ci;ci=c[i];i++){for(var j=0;s=ss[j];j++){if(Ext.DomQuery.is(ci,s)){r[++ri]=ci;break}}}return r},odd:function(c){return this["nth-child"](c,"odd")},even:function(c){return this["nth-child"](c,"even")},nth:function(c,a){return c[a-1]||[]},first:function(c){return c[0]||[]},last:function(c){return c[c.length-1]||[]},has:function(c,ss){var s=Ext.DomQuery.select,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){if(s(ss,ci).length>0){r[++ri]=ci}}return r},next:function(c,ss){var is=Ext.DomQuery.is,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var n=next(ci);if(n&&is(n,ss)){r[++ri]=ci}}return r},prev:function(c,ss){var is=Ext.DomQuery.is,r=[],ri=-1;for(var i=0,ci;ci=c[i];i++){var n=prev(ci);if(n&&is(n,ss)){r[++ri]=ci}}return r}}}}();Ext.query=Ext.DomQuery.select;Ext.util.DelayedTask=function(d,c,a){var e=this,g,b=function(){clearInterval(g);g=null;d.apply(c,a||[])};e.delay=function(i,k,j,h){e.cancel();d=k||d;c=j||c;a=h||a;g=setInterval(b,i)};e.cancel=function(){if(g){clearInterval(g);g=null}}};(function(){var h=document;Ext.Element=function(l,m){var n=typeof l=="string"?h.getElementById(l):l,o;if(!n){return null}o=n.id;if(!m&&o&&Ext.elCache[o]){return Ext.elCache[o].el}this.dom=n;this.id=o||Ext.id(n)};var d=Ext.DomHelper,e=Ext.Element,a=Ext.elCache;e.prototype={set:function(q,m){var n=this.dom,l,p,m=(m!==false)&&!!n.setAttribute;for(l in q){if(q.hasOwnProperty(l)){p=q[l];if(l=="style"){d.applyStyles(n,p)}else{if(l=="cls"){n.className=p}else{if(m){n.setAttribute(l,p)}else{n[l]=p}}}}}return this},defaultUnit:"px",is:function(l){return Ext.DomQuery.is(this.dom,l)},focus:function(o,n){var l=this,n=n||l.dom;try{if(Number(o)){l.focus.defer(o,null,[null,n])}else{n.focus()}}catch(m){}return l},blur:function(){try{this.dom.blur()}catch(l){}return this},getValue:function(l){var m=this.dom.value;return l?parseInt(m,10):m},addListener:function(l,o,n,m){Ext.EventManager.on(this.dom,l,o,n||this,m);return this},removeListener:function(l,n,m){Ext.EventManager.removeListener(this.dom,l,n,m||this);return this},removeAllListeners:function(){Ext.EventManager.removeAll(this.dom);return this},purgeAllListeners:function(){Ext.EventManager.purgeElement(this,true);return this},addUnits:function(l){if(l===""||l=="auto"||l===undefined){l=l||""}else{if(!isNaN(l)||!i.test(l)){l=l+(this.defaultUnit||"px")}}return l},load:function(m,n,l){Ext.Ajax.request(Ext.apply({params:n,url:m.url||m,callback:l,el:this.dom,indicatorText:m.indicatorText||""},Ext.isObject(m)?m:{}));return this},isBorderBox:function(){return Ext.isBorderBox||Ext.isForcedBorderBox||g[(this.dom.tagName||"").toLowerCase()]},remove:function(){var l=this,m=l.dom;if(m){delete l.dom;Ext.removeNode(m)}},hover:function(m,l,o,n){var p=this;p.on("mouseenter",m,o||p.dom,n);p.on("mouseleave",l,o||p.dom,n);return p},contains:function(l){return !l?false:Ext.lib.Dom.isAncestor(this.dom,l.dom?l.dom:l)},getAttributeNS:function(m,l){return this.getAttribute(l,m)},getAttribute:(function(){var p=document.createElement("table"),o=false,m="getAttribute" in p,l=/undefined|unknown/;if(m){try{p.getAttribute("ext:qtip")}catch(n){o=true}return function(q,s){var r=this.dom,t;if(r.getAttributeNS){t=r.getAttributeNS(s,q)||null}if(t==null){if(s){if(o&&r.tagName.toUpperCase()=="TABLE"){try{t=r.getAttribute(s+":"+q)}catch(u){t=""}}else{t=r.getAttribute(s+":"+q)}}else{t=r.getAttribute(q)||r[q]}}return t||""}}else{return function(q,s){var r=this.om,u,t;if(s){t=r[s+":"+q];u=l.test(typeof t)?undefined:t}else{u=r[q]}return u||""}}p=null})(),update:function(l){if(this.dom){this.dom.innerHTML=l}return this}};var k=e.prototype;e.addMethods=function(l){Ext.apply(k,l)};k.on=k.addListener;k.un=k.removeListener;k.autoBoxAdjust=true;var i=/\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,c;e.get=function(m){var l,p,o;if(!m){return null}if(typeof m=="string"){if(!(p=h.getElementById(m))){return null}if(a[m]&&a[m].el){l=a[m].el;l.dom=p}else{l=e.addToCache(new e(p))}return l}else{if(m.tagName){if(!(o=m.id)){o=Ext.id(m)}if(a[o]&&a[o].el){l=a[o].el;l.dom=m}else{l=e.addToCache(new e(m))}return l}else{if(m instanceof e){if(m!=c){if(Ext.isIE&&(m.id==undefined||m.id=="")){m.dom=m.dom}else{m.dom=h.getElementById(m.id)||m.dom}}return m}else{if(m.isComposite){return m}else{if(Ext.isArray(m)){return e.select(m)}else{if(m==h){if(!c){var n=function(){};n.prototype=e.prototype;c=new n();c.dom=h}return c}}}}}}return null};e.addToCache=function(l,m){m=m||l.id;a[m]={el:l,data:{},events:{}};return l};e.data=function(m,l,n){m=e.get(m);if(!m){return null}var o=a[m.id].data;if(arguments.length==2){return o[l]}else{return(o[l]=n)}};function j(){if(!Ext.enableGarbageCollector){clearInterval(e.collectorThreadId)}else{var l,n,q,p;for(l in a){p=a[l];if(p.skipGC){continue}n=p.el;q=n.dom;if(!q||!q.parentNode||(!q.offsetParent&&!h.getElementById(l))){if(Ext.enableListenerCollection){Ext.EventManager.removeAll(q)}delete a[l]}}if(Ext.isIE){var m={};for(l in a){m[l]=a[l]}a=Ext.elCache=m}}}e.collectorThreadId=setInterval(j,30000);var b=function(){};b.prototype=e.prototype;e.Flyweight=function(l){this.dom=l};e.Flyweight.prototype=new b();e.Flyweight.prototype.isFlyweight=true;e._flyweights={};e.fly=function(n,l){var m=null;l=l||"_global";if(n=Ext.getDom(n)){(e._flyweights[l]=e._flyweights[l]||new e.Flyweight()).dom=n;m=e._flyweights[l]}return m};Ext.get=e.get;Ext.fly=e.fly;var g=Ext.isStrict?{select:1}:{input:1,select:1,textarea:1};if(Ext.isIE||Ext.isGecko){g.button=1}})();Ext.Element.addMethods(function(){var d="parentNode",b="nextSibling",c="previousSibling",e=Ext.DomQuery,a=Ext.get;return{findParent:function(m,l,h){var j=this.dom,g=document.body,k=0,i;if(Ext.isGecko&&Object.prototype.toString.call(j)=="[object XULElement]"){return null}l=l||50;if(isNaN(l)){i=Ext.getDom(l);l=Number.MAX_VALUE}while(j&&j.nodeType==1&&k<l&&j!=g&&j!=i){if(e.is(j,m)){return h?a(j):j}k++;j=j.parentNode}return null},findParentNode:function(j,i,g){var h=Ext.fly(this.dom.parentNode,"_internal");return h?h.findParent(j,i,g):null},up:function(h,g){return this.findParentNode(h,g,true)},select:function(g){return Ext.Element.select(g,this.dom)},query:function(g){return e.select(g,this.dom)},child:function(g,h){var i=e.selectNode(g,this.dom);return h?i:a(i)},down:function(g,h){var i=e.selectNode(" > "+g,this.dom);return h?i:a(i)},parent:function(g,h){return this.matchNode(d,d,g,h)},next:function(g,h){return this.matchNode(b,b,g,h)},prev:function(g,h){return this.matchNode(c,c,g,h)},first:function(g,h){return this.matchNode(b,"firstChild",g,h)},last:function(g,h){return this.matchNode(c,"lastChild",g,h)},matchNode:function(h,k,g,i){var j=this.dom[k];while(j){if(j.nodeType==1&&(!g||e.is(j,g))){return !i?a(j):j}j=j[h]}return null}}}());Ext.Element.addMethods(function(){var c=Ext.getDom,a=Ext.get,b=Ext.DomHelper;return{appendChild:function(d){return a(d).appendTo(this)},appendTo:function(d){c(d).appendChild(this.dom);return this},insertBefore:function(d){(d=c(d)).parentNode.insertBefore(this.dom,d);return this},insertAfter:function(d){(d=c(d)).parentNode.insertBefore(this.dom,d.nextSibling);return this},insertFirst:function(e,d){e=e||{};if(e.nodeType||e.dom||typeof e=="string"){e=c(e);this.dom.insertBefore(e,this.dom.firstChild);return !d?a(e):e}else{return this.createChild(e,this.dom.firstChild,d)}},replace:function(d){d=a(d);this.insertBefore(d);d.remove();return this},replaceWith:function(d){var e=this;if(d.nodeType||d.dom||typeof d=="string"){d=c(d);e.dom.parentNode.insertBefore(d,e.dom)}else{d=b.insertBefore(e.dom,d)}delete Ext.elCache[e.id];Ext.removeNode(e.dom);e.id=Ext.id(e.dom=d);Ext.Element.addToCache(e.isFlyweight?new Ext.Element(e.dom):e);return e},createChild:function(e,d,g){e=e||{tag:"div"};return d?b.insertBefore(d,e,g!==true):b[!this.dom.firstChild?"overwrite":"append"](this.dom,e,g!==true)},wrap:function(d,e){var g=b.insertBefore(this.dom,d||{tag:"div"},!e);g.dom?g.dom.appendChild(this.dom):g.appendChild(this.dom);return g},insertHtml:function(e,g,d){var h=b.insertHtml(e,this.dom,g);return d?Ext.get(h):h}}}());Ext.Element.addMethods(function(){var A=Ext.supports,h={},x=/(-[a-z])/gi,s=document.defaultView,D=/alpha\(opacity=(.*)\)/i,l=/^\s+|\s+$/g,B=Ext.Element,u=/\s+/,b=/\w/g,d="padding",c="margin",y="border",t="-left",q="-right",w="-top",o="-bottom",j="-width",r=Math,z="hidden",e="isClipped",k="overflow",n="overflow-x",m="overflow-y",C="originalClip",i={l:y+t+j,r:y+q+j,t:y+w+j,b:y+o+j},g={l:d+t,r:d+q,t:d+w,b:d+o},a={l:c+t,r:c+q,t:c+w,b:c+o},E=Ext.Element.data;function p(F,G){return G.charAt(1).toUpperCase()}function v(F){return h[F]||(h[F]=F=="float"?(A.cssFloat?"cssFloat":"styleFloat"):F.replace(x,p))}return{adjustWidth:function(F){var G=this;var H=(typeof F=="number");if(H&&G.autoBoxAdjust&&!G.isBorderBox()){F-=(G.getBorderWidth("lr")+G.getPadding("lr"))}return(H&&F<0)?0:F},adjustHeight:function(F){var G=this;var H=(typeof F=="number");if(H&&G.autoBoxAdjust&&!G.isBorderBox()){F-=(G.getBorderWidth("tb")+G.getPadding("tb"))}return(H&&F<0)?0:F},addClass:function(J){var K=this,I,F,H,G=[];if(!Ext.isArray(J)){if(typeof J=="string"&&!this.hasClass(J)){K.dom.className+=" "+J}}else{for(I=0,F=J.length;I<F;I++){H=J[I];if(typeof H=="string"&&(" "+K.dom.className+" ").indexOf(" "+H+" ")==-1){G.push(H)}}if(G.length){K.dom.className+=" "+G.join(" ")}}return K},removeClass:function(K){var L=this,J,G,F,I,H;if(!Ext.isArray(K)){K=[K]}if(L.dom&&L.dom.className){H=L.dom.className.replace(l,"").split(u);for(J=0,F=K.length;J<F;J++){I=K[J];if(typeof I=="string"){I=I.replace(l,"");G=H.indexOf(I);if(G!=-1){H.splice(G,1)}}}L.dom.className=H.join(" ")}return L},radioClass:function(I){var J=this.dom.parentNode.childNodes,G,H,F;I=Ext.isArray(I)?I:[I];for(H=0,F=J.length;H<F;H++){G=J[H];if(G&&G.nodeType==1){Ext.fly(G,"_internal").removeClass(I)}}return this.addClass(I)},toggleClass:function(F){return this.hasClass(F)?this.removeClass(F):this.addClass(F)},hasClass:function(F){return F&&(" "+this.dom.className+" ").indexOf(" "+F+" ")!=-1},replaceClass:function(G,F){return this.removeClass(G).addClass(F)},isStyle:function(F,G){return this.getStyle(F)==G},getStyle:function(){return s&&s.getComputedStyle?function(K){var I=this.dom,F,H,G,J;if(I==document){return null}K=v(K);G=(F=I.style[K])?F:(H=s.getComputedStyle(I,""))?H[K]:null;if(K=="marginRight"&&G!="0px"&&!A.correctRightMargin){J=I.style.display;I.style.display="inline-block";G=s.getComputedStyle(I,"").marginRight;I.style.display=J}if(K=="backgroundColor"&&G=="rgba(0, 0, 0, 0)"&&!A.correctTransparentColor){G="transparent"}return G}:function(J){var H=this.dom,F,G;if(H==document){return null}if(J=="opacity"){if(H.style.filter.match){if(F=H.style.filter.match(D)){var I=parseFloat(F[1]);if(!isNaN(I)){return I?I/100:0}}}return 1}J=v(J);return H.style[J]||((G=H.currentStyle)?G[J]:null)}}(),getColor:function(F,G,K){var I=this.getStyle(F),H=(typeof K!="undefined")?K:"#",J;if(!I||(/transparent|inherit/.test(I))){return G}if(/^r/.test(I)){Ext.each(I.slice(4,I.length-1).split(","),function(L){J=parseInt(L,10);H+=(J<16?"0":"")+J.toString(16)})}else{I=I.replace("#","");H+=I.length==3?I.replace(/^(\w)(\w)(\w)$/,"$1$1$2$2$3$3"):I}return(H.length>5?H.toLowerCase():G)},setStyle:function(I,H){var F,G;if(typeof I!="object"){F={};F[I]=H;I=F}for(G in I){H=I[G];G=="opacity"?this.setOpacity(H):this.dom.style[v(G)]=H}return this},setOpacity:function(G,F){var J=this,H=J.dom.style;if(!F||!J.anim){if(Ext.isIE){var I=G<1?"alpha(opacity="+G*100+")":"",K=H.filter.replace(D,"").replace(l,"");H.zoom=1;H.filter=K+(K.length>0?" ":"")+I}else{H.opacity=G}}else{J.anim({opacity:{to:G}},J.preanim(arguments,1),null,0.35,"easeIn")}return J},clearOpacity:function(){var F=this.dom.style;if(Ext.isIE){if(!Ext.isEmpty(F.filter)){F.filter=F.filter.replace(D,"").replace(l,"")}}else{F.opacity=F["-moz-opacity"]=F["-khtml-opacity"]=""}return this},getHeight:function(H){var G=this,J=G.dom,I=Ext.isIE&&G.isStyle("display","none"),F=r.max(J.offsetHeight,I?0:J.clientHeight)||0;F=!H?F:F-G.getBorderWidth("tb")-G.getPadding("tb");return F<0?0:F},getWidth:function(G){var H=this,J=H.dom,I=Ext.isIE&&H.isStyle("display","none"),F=r.max(J.offsetWidth,I?0:J.clientWidth)||0;F=!G?F:F-H.getBorderWidth("lr")-H.getPadding("lr");return F<0?0:F},setWidth:function(G,F){var H=this;G=H.adjustWidth(G);!F||!H.anim?H.dom.style.width=H.addUnits(G):H.anim({width:{to:G}},H.preanim(arguments,1));return H},setHeight:function(F,G){var H=this;F=H.adjustHeight(F);!G||!H.anim?H.dom.style.height=H.addUnits(F):H.anim({height:{to:F}},H.preanim(arguments,1));return H},getBorderWidth:function(F){return this.addStyles(F,i)},getPadding:function(F){return this.addStyles(F,g)},clip:function(){var F=this,G=F.dom;if(!E(G,e)){E(G,e,true);E(G,C,{o:F.getStyle(k),x:F.getStyle(n),y:F.getStyle(m)});F.setStyle(k,z);F.setStyle(n,z);F.setStyle(m,z)}return F},unclip:function(){var F=this,H=F.dom;if(E(H,e)){E(H,e,false);var G=E(H,C);if(G.o){F.setStyle(k,G.o)}if(G.x){F.setStyle(n,G.x)}if(G.y){F.setStyle(m,G.y)}}return F},addStyles:function(M,L){var J=0,K=M.match(b),I,H,G,F=K.length;for(G=0;G<F;G++){I=K[G];H=I&&parseInt(this.getStyle(L[I]),10);if(H){J+=r.abs(H)}}return J},margins:a}}());(function(){var a=Ext.lib.Dom,b="left",g="right",d="top",i="bottom",h="position",c="static",e="relative",j="auto",k="z-index";Ext.Element.addMethods({getX:function(){return a.getX(this.dom)},getY:function(){return a.getY(this.dom)},getXY:function(){return a.getXY(this.dom)},getOffsetsTo:function(l){var n=this.getXY(),m=Ext.fly(l,"_internal").getXY();return[n[0]-m[0],n[1]-m[1]]},setX:function(l,m){return this.setXY([l,this.getY()],this.animTest(arguments,m,1))},setY:function(m,l){return this.setXY([this.getX(),m],this.animTest(arguments,l,1))},setLeft:function(l){this.setStyle(b,this.addUnits(l));return this},setTop:function(l){this.setStyle(d,this.addUnits(l));return this},setRight:function(l){this.setStyle(g,this.addUnits(l));return this},setBottom:function(l){this.setStyle(i,this.addUnits(l));return this},setXY:function(n,l){var m=this;if(!l||!m.anim){a.setXY(m.dom,n)}else{m.anim({points:{to:n}},m.preanim(arguments,1),"motion")}return m},setLocation:function(l,n,m){return this.setXY([l,n],this.animTest(arguments,m,2))},moveTo:function(l,n,m){return this.setXY([l,n],this.animTest(arguments,m,2))},getLeft:function(l){return !l?this.getX():parseInt(this.getStyle(b),10)||0},getRight:function(l){var m=this;return !l?m.getX()+m.getWidth():(m.getLeft(true)+m.getWidth())||0},getTop:function(l){return !l?this.getY():parseInt(this.getStyle(d),10)||0},getBottom:function(l){var m=this;return !l?m.getY()+m.getHeight():(m.getTop(true)+m.getHeight())||0},position:function(p,o,l,n){var m=this;if(!p&&m.isStyle(h,c)){m.setStyle(h,e)}else{if(p){m.setStyle(h,p)}}if(o){m.setStyle(k,o)}if(l||n){m.setXY([l||false,n||false])}},clearPositioning:function(l){l=l||"";this.setStyle({left:l,right:l,top:l,bottom:l,"z-index":"",position:c});return this},getPositioning:function(){var m=this.getStyle(b);var n=this.getStyle(d);return{position:this.getStyle(h),left:m,right:m?"":this.getStyle(g),top:n,bottom:n?"":this.getStyle(i),"z-index":this.getStyle(k)}},setPositioning:function(l){var n=this,m=n.dom.style;n.setStyle(l);if(l.right==j){m.right=""}if(l.bottom==j){m.bottom=""}return n},translatePoints:function(m,u){u=isNaN(m[1])?u:m[1];m=isNaN(m[0])?m:m[0];var q=this,r=q.isStyle(h,e),s=q.getXY(),n=parseInt(q.getStyle(b),10),p=parseInt(q.getStyle(d),10);n=!isNaN(n)?n:(r?0:q.dom.offsetLeft);p=!isNaN(p)?p:(r?0:q.dom.offsetTop);return{left:(m-s[0]+n),top:(u-s[1]+p)}},animTest:function(m,l,n){return !!l&&this.preanim?this.preanim(m,n):false}})})();Ext.Element.addMethods({isScrollable:function(){var a=this.dom;return a.scrollHeight>a.clientHeight||a.scrollWidth>a.clientWidth},scrollTo:function(a,b){this.dom["scroll"+(/top/i.test(a)?"Top":"Left")]=b;return this},getScroll:function(){var i=this.dom,h=document,a=h.body,c=h.documentElement,b,g,e;if(i==h||i==a){if(Ext.isIE&&Ext.isStrict){b=c.scrollLeft;g=c.scrollTop}else{b=window.pageXOffset;g=window.pageYOffset}e={left:b||(a?a.scrollLeft:0),top:g||(a?a.scrollTop:0)}}else{e={left:i.scrollLeft,top:i.scrollTop}}return e}});Ext.Element.VISIBILITY=1;Ext.Element.DISPLAY=2;Ext.Element.OFFSETS=3;Ext.Element.ASCLASS=4;Ext.Element.visibilityCls="x-hide-nosize";Ext.Element.addMethods(function(){var e=Ext.Element,p="opacity",j="visibility",g="display",d="hidden",n="offsets",k="asclass",m="none",a="nosize",b="originalDisplay",c="visibilityMode",h="isVisible",i=e.data,l=function(r){var q=i(r,b);if(q===undefined){i(r,b,q="")}return q},o=function(r){var q=i(r,c);if(q===undefined){i(r,c,q=1)}return q};return{originalDisplay:"",visibilityMode:1,setVisibilityMode:function(q){i(this.dom,c,q);return this},animate:function(r,t,s,u,q){this.anim(r,{duration:t,callback:s,easing:u},q);return this},anim:function(t,u,r,w,s,q){r=r||"run";u=u||{};var v=this,x=Ext.lib.Anim[r](v.dom,t,(u.duration||w)||0.35,(u.easing||s)||"easeOut",function(){if(q){q.call(v)}if(u.callback){u.callback.call(u.scope||v,v,u)}},v);u.anim=x;return x},preanim:function(q,r){return !q[r]?false:(typeof q[r]=="object"?q[r]:{duration:q[r+1],callback:q[r+2],easing:q[r+3]})},isVisible:function(){var q=this,s=q.dom,r=i(s,h);if(typeof r=="boolean"){return r}r=!q.isStyle(j,d)&&!q.isStyle(g,m)&&!((o(s)==e.ASCLASS)&&q.hasClass(q.visibilityCls||e.visibilityCls));i(s,h,r);return r},setVisible:function(t,q){var w=this,r,y,x,v,u=w.dom,s=o(u);if(typeof q=="string"){switch(q){case g:s=e.DISPLAY;break;case j:s=e.VISIBILITY;break;case n:s=e.OFFSETS;break;case a:case k:s=e.ASCLASS;break}w.setVisibilityMode(s);q=false}if(!q||!w.anim){if(s==e.ASCLASS){w[t?"removeClass":"addClass"](w.visibilityCls||e.visibilityCls)}else{if(s==e.DISPLAY){return w.setDisplayed(t)}else{if(s==e.OFFSETS){if(!t){w.hideModeStyles={position:w.getStyle("position"),top:w.getStyle("top"),left:w.getStyle("left")};w.applyStyles({position:"absolute",top:"-10000px",left:"-10000px"})}else{w.applyStyles(w.hideModeStyles||{position:"",top:"",left:""});delete w.hideModeStyles}}else{w.fixDisplay();u.style.visibility=t?"visible":d}}}}else{if(t){w.setOpacity(0.01);w.setVisible(true)}w.anim({opacity:{to:(t?1:0)}},w.preanim(arguments,1),null,0.35,"easeIn",function(){t||w.setVisible(false).setOpacity(1)})}i(u,h,t);return w},hasMetrics:function(){var q=this.dom;return this.isVisible()||(o(q)==e.VISIBILITY)},toggle:function(q){var r=this;r.setVisible(!r.isVisible(),r.preanim(arguments,0));return r},setDisplayed:function(q){if(typeof q=="boolean"){q=q?l(this.dom):m}this.setStyle(g,q);return this},fixDisplay:function(){var q=this;if(q.isStyle(g,m)){q.setStyle(j,d);q.setStyle(g,l(this.dom));if(q.isStyle(g,m)){q.setStyle(g,"block")}}},hide:function(q){if(typeof q=="string"){this.setVisible(false,q);return this}this.setVisible(false,this.preanim(arguments,0));return this},show:function(q){if(typeof q=="string"){this.setVisible(true,q);return this}this.setVisible(true,this.preanim(arguments,0));return this}}}());(function(){var y=null,A=undefined,k=true,t=false,j="setX",h="setY",a="setXY",n="left",l="bottom",s="top",m="right",q="height",g="width",i="points",w="hidden",z="absolute",u="visible",e="motion",o="position",r="easeOut",d=new Ext.Element.Flyweight(),v={},x=function(B){return B||{}},p=function(B){d.dom=B;d.id=Ext.id(B);return d},c=function(B){if(!v[B]){v[B]=[]}return v[B]},b=function(C,B){v[C]=B};Ext.enableFx=k;Ext.Fx={switchStatements:function(C,D,B){return D.apply(this,B[C])},slideIn:function(H,E){E=x(E);var J=this,G=J.dom,M=G.style,O,B,L,D,C,M,I,N,K,F;H=H||"t";J.queueFx(E,function(){O=p(G).getXY();p(G).fixDisplay();B=p(G).getFxRestore();L={x:O[0],y:O[1],0:O[0],1:O[1],width:G.offsetWidth,height:G.offsetHeight};L.right=L.x+L.width;L.bottom=L.y+L.height;p(G).setWidth(L.width).setHeight(L.height);D=p(G).fxWrap(B.pos,E,w);M.visibility=u;M.position=z;function P(){p(G).fxUnwrap(D,B.pos,E);M.width=B.width;M.height=B.height;p(G).afterFx(E)}N={to:[L.x,L.y]};K={to:L.width};F={to:L.height};function Q(U,R,V,S,X,Z,ac,ab,aa,W,T){var Y={};p(U).setWidth(V).setHeight(S);if(p(U)[X]){p(U)[X](Z)}R[ac]=R[ab]="0";if(aa){Y.width=aa}if(W){Y.height=W}if(T){Y.points=T}return Y}I=p(G).switchStatements(H.toLowerCase(),Q,{t:[D,M,L.width,0,y,y,n,l,y,F,y],l:[D,M,0,L.height,y,y,m,s,K,y,y],r:[D,M,L.width,L.height,j,L.right,n,s,y,y,N],b:[D,M,L.width,L.height,h,L.bottom,n,s,y,F,N],tl:[D,M,0,0,y,y,m,l,K,F,N],bl:[D,M,0,0,h,L.y+L.height,m,s,K,F,N],br:[D,M,0,0,a,[L.right,L.bottom],n,s,K,F,N],tr:[D,M,0,0,j,L.x+L.width,n,l,K,F,N]});M.visibility=u;p(D).show();arguments.callee.anim=p(D).fxanim(I,E,e,0.5,r,P)});return J},slideOut:function(F,D){D=x(D);var H=this,E=H.dom,K=E.style,L=H.getXY(),C,B,I,J,G={to:0};F=F||"t";H.queueFx(D,function(){B=p(E).getFxRestore();I={x:L[0],y:L[1],0:L[0],1:L[1],width:E.offsetWidth,height:E.offsetHeight};I.right=I.x+I.width;I.bottom=I.y+I.height;p(E).setWidth(I.width).setHeight(I.height);C=p(E).fxWrap(B.pos,D,u);K.visibility=u;K.position=z;p(C).setWidth(I.width).setHeight(I.height);function M(){D.useDisplay?p(E).setDisplayed(t):p(E).hide();p(E).fxUnwrap(C,B.pos,D);K.width=B.width;K.height=B.height;p(E).afterFx(D)}function N(O,W,U,X,S,V,R,T,Q){var P={};O[W]=O[U]="0";P[X]=S;if(V){P[V]=R}if(T){P[T]=Q}return P}J=p(E).switchStatements(F.toLowerCase(),N,{t:[K,n,l,q,G],l:[K,m,s,g,G],r:[K,n,s,g,G,i,{to:[I.right,I.y]}],b:[K,n,s,q,G,i,{to:[I.x,I.bottom]}],tl:[K,m,l,g,G,q,G],bl:[K,m,s,g,G,q,G,i,{to:[I.x,I.bottom]}],br:[K,n,s,g,G,q,G,i,{to:[I.x+I.width,I.bottom]}],tr:[K,n,l,g,G,q,G,i,{to:[I.right,I.y]}]});arguments.callee.anim=p(C).fxanim(J,D,e,0.5,r,M)});return H},puff:function(H){H=x(H);var F=this,G=F.dom,C=G.style,D,B,E;F.queueFx(H,function(){D=p(G).getWidth();B=p(G).getHeight();p(G).clearOpacity();p(G).show();E=p(G).getFxRestore();function I(){H.useDisplay?p(G).setDisplayed(t):p(G).hide();p(G).clearOpacity();p(G).setPositioning(E.pos);C.width=E.width;C.height=E.height;C.fontSize="";p(G).afterFx(H)}arguments.callee.anim=p(G).fxanim({width:{to:p(G).adjustWidth(D*2)},height:{to:p(G).adjustHeight(B*2)},points:{by:[-D*0.5,-B*0.5]},opacity:{to:0},fontSize:{to:200,unit:"%"}},H,e,0.5,r,I)});return F},switchOff:function(F){F=x(F);var D=this,E=D.dom,B=E.style,C;D.queueFx(F,function(){p(E).clearOpacity();p(E).clip();C=p(E).getFxRestore();function G(){F.useDisplay?p(E).setDisplayed(t):p(E).hide();p(E).clearOpacity();p(E).setPositioning(C.pos);B.width=C.width;B.height=C.height;p(E).afterFx(F)}p(E).fxanim({opacity:{to:0.3}},y,y,0.1,y,function(){p(E).clearOpacity();(function(){p(E).fxanim({height:{to:1},points:{by:[0,p(E).getHeight()*0.5]}},F,e,0.3,"easeIn",G)}).defer(100)})});return D},highlight:function(D,H){H=x(H);var F=this,G=F.dom,B=H.attr||"backgroundColor",C={},E;F.queueFx(H,function(){p(G).clearOpacity();p(G).show();function I(){G.style[B]=E;p(G).afterFx(H)}E=G.style[B];C[B]={from:D||"ffff9c",to:H.endColor||p(G).getColor(B)||"ffffff"};arguments.callee.anim=p(G).fxanim(C,H,"color",1,"easeIn",I)});return F},frame:function(B,E,H){H=x(H);var D=this,G=D.dom,C,F;D.queueFx(H,function(){B=B||"#C3DAF9";if(B.length==6){B="#"+B}E=E||1;p(G).show();var L=p(G).getXY(),J={x:L[0],y:L[1],0:L[0],1:L[1],width:G.offsetWidth,height:G.offsetHeight},I=function(){C=p(document.body||document.documentElement).createChild({style:{position:z,"z-index":35000,border:"0px solid "+B}});return C.queueFx({},K)};arguments.callee.anim={isAnimated:true,stop:function(){E=0;C.stopFx()}};function K(){var M=Ext.isBorderBox?2:1;F=C.anim({top:{from:J.y,to:J.y-20},left:{from:J.x,to:J.x-20},borderWidth:{from:0,to:10},opacity:{from:1,to:0},height:{from:J.height,to:J.height+20*M},width:{from:J.width,to:J.width+20*M}},{duration:H.duration||1,callback:function(){C.remove();--E>0?I():p(G).afterFx(H)}});arguments.callee.anim={isAnimated:true,stop:function(){F.stop()}}}I()});return D},pause:function(D){var C=this.dom,B;this.queueFx({},function(){B=setTimeout(function(){p(C).afterFx({})},D*1000);arguments.callee.anim={isAnimated:true,stop:function(){clearTimeout(B);p(C).afterFx({})}}});return this},fadeIn:function(D){D=x(D);var B=this,C=B.dom,E=D.endOpacity||1;B.queueFx(D,function(){p(C).setOpacity(0);p(C).fixDisplay();C.style.visibility=u;arguments.callee.anim=p(C).fxanim({opacity:{to:E}},D,y,0.5,r,function(){if(E==1){p(C).clearOpacity()}p(C).afterFx(D)})});return B},fadeOut:function(E){E=x(E);var C=this,D=C.dom,B=D.style,F=E.endOpacity||0;C.queueFx(E,function(){arguments.callee.anim=p(D).fxanim({opacity:{to:F}},E,y,0.5,r,function(){if(F==0){Ext.Element.data(D,"visibilityMode")==Ext.Element.DISPLAY||E.useDisplay?B.display="none":B.visibility=w;p(D).clearOpacity()}p(D).afterFx(E)})});return C},scale:function(B,C,D){this.shift(Ext.apply({},D,{width:B,height:C}));return this},shift:function(D){D=x(D);var C=this.dom,B={};this.queueFx(D,function(){for(var E in D){if(D[E]!=A){B[E]={to:D[E]}}}B.width?B.width.to=p(C).adjustWidth(D.width):B;B.height?B.height.to=p(C).adjustWidth(D.height):B;if(B.x||B.y||B.xy){B.points=B.xy||{to:[B.x?B.x.to:p(C).getX(),B.y?B.y.to:p(C).getY()]}}arguments.callee.anim=p(C).fxanim(B,D,e,0.35,r,function(){p(C).afterFx(D)})});return this},ghost:function(E,C){C=x(C);var G=this,D=G.dom,J=D.style,H={opacity:{to:0},points:{}},K=H.points,B,I,F;E=E||"b";G.queueFx(C,function(){B=p(D).getFxRestore();I=p(D).getWidth();F=p(D).getHeight();function L(){C.useDisplay?p(D).setDisplayed(t):p(D).hide();p(D).clearOpacity();p(D).setPositioning(B.pos);J.width=B.width;J.height=B.height;p(D).afterFx(C)}K.by=p(D).switchStatements(E.toLowerCase(),function(N,M){return[N,M]},{t:[0,-F],l:[-I,0],r:[I,0],b:[0,F],tl:[-I,-F],bl:[-I,F],br:[I,F],tr:[I,-F]});arguments.callee.anim=p(D).fxanim(H,C,e,0.5,r,L)});return G},syncFx:function(){var B=this;B.fxDefaults=Ext.apply(B.fxDefaults||{},{block:t,concurrent:k,stopFx:t});return B},sequenceFx:function(){var B=this;B.fxDefaults=Ext.apply(B.fxDefaults||{},{block:t,concurrent:t,stopFx:t});return B},nextFx:function(){var B=c(this.dom.id)[0];if(B){B.call(this)}},hasActiveFx:function(){return c(this.dom.id)[0]},stopFx:function(B){var C=this,E=C.dom.id;if(C.hasActiveFx()){var D=c(E)[0];if(D&&D.anim){if(D.anim.isAnimated){b(E,[D]);D.anim.stop(B!==undefined?B:k)}else{b(E,[])}}}return C},beforeFx:function(B){if(this.hasActiveFx()&&!B.concurrent){if(B.stopFx){this.stopFx();return k}return t}return k},hasFxBlock:function(){var B=c(this.dom.id);return B&&B[0]&&B[0].block},queueFx:function(E,B){var C=p(this.dom);if(!C.hasFxBlock()){Ext.applyIf(E,C.fxDefaults);if(!E.concurrent){var D=C.beforeFx(E);B.block=E.block;c(C.dom.id).push(B);if(D){C.nextFx()}}else{B.call(C)}}return C},fxWrap:function(H,F,D){var E=this.dom,C,B;if(!F.wrap||!(C=Ext.getDom(F.wrap))){if(F.fixPosition){B=p(E).getXY()}var G=document.createElement("div");G.style.visibility=D;C=E.parentNode.insertBefore(G,E);p(C).setPositioning(H);if(p(C).isStyle(o,"static")){p(C).position("relative")}p(E).clearPositioning("auto");p(C).clip();C.appendChild(E);if(B){p(C).setXY(B)}}return C},fxUnwrap:function(C,F,E){var D=this.dom;p(D).clearPositioning();p(D).setPositioning(F);if(!E.wrap){var B=p(C).dom.parentNode;B.insertBefore(D,C);p(C).remove()}},getFxRestore:function(){var B=this.dom.style;return{pos:this.getPositioning(),width:B.width,height:B.height}},afterFx:function(C){var B=this.dom,D=B.id;if(C.afterStyle){p(B).setStyle(C.afterStyle)}if(C.afterCls){p(B).addClass(C.afterCls)}if(C.remove==k){p(B).remove()}if(C.callback){C.callback.call(C.scope,p(B))}if(!C.concurrent){c(D).shift();p(B).nextFx()}},fxanim:function(E,F,C,G,D,B){C=C||"run";F=F||{};var H=Ext.lib.Anim[C](this.dom,E,(F.duration||G)||0.35,(F.easing||D)||r,B,this);F.anim=H;return H}};Ext.Fx.resize=Ext.Fx.scale;Ext.Element.addMethods(Ext.Fx)})();Ext.CompositeElementLite=function(b,a){this.elements=[];this.add(b,a);this.el=new Ext.Element.Flyweight()};Ext.CompositeElementLite.prototype={isComposite:true,getElement:function(a){var b=this.el;b.dom=a;b.id=a.id;return b},transformElement:function(a){return Ext.getDom(a)},getCount:function(){return this.elements.length},add:function(d,b){var e=this,g=e.elements;if(!d){return this}if(typeof d=="string"){d=Ext.Element.selectorFunction(d,b)}else{if(d.isComposite){d=d.elements}else{if(!Ext.isIterable(d)){d=[d]}}}for(var c=0,a=d.length;c<a;++c){g.push(e.transformElement(d[c]))}return e},invoke:function(g,b){var h=this,d=h.elements,a=d.length,j,c;for(c=0;c<a;c++){j=d[c];if(j){Ext.Element.prototype[g].apply(h.getElement(j),b)}}return h},item:function(b){var d=this,c=d.elements[b],a=null;if(c){a=d.getElement(c)}return a},addListener:function(b,j,h,g){var d=this.elements,a=d.length,c,k;for(c=0;c<a;c++){k=d[c];if(k){Ext.EventManager.on(k,b,j,h||k,g)}}return this},each:function(g,d){var h=this,c=h.elements,a=c.length,b,j;for(b=0;b<a;b++){j=c[b];if(j){j=this.getElement(j);if(g.call(d||j,j,h,b)===false){break}}}return h},fill:function(a){var b=this;b.elements=[];b.add(a);return b},filter:function(a){var b=[],d=this,c=Ext.isFunction(a)?a:function(e){return e.is(a)};d.each(function(h,e,g){if(c(h,g)!==false){b[b.length]=d.transformElement(h)}});d.elements=b;return d},indexOf:function(a){return this.elements.indexOf(this.transformElement(a))},replaceElement:function(e,c,a){var b=!isNaN(e)?e:this.indexOf(e),g;if(b>-1){c=Ext.getDom(c);if(a){g=this.elements[b];g.parentNode.insertBefore(c,g);Ext.removeNode(g)}this.elements.splice(b,1,c)}return this},clear:function(){this.elements=[]}};Ext.CompositeElementLite.prototype.on=Ext.CompositeElementLite.prototype.addListener;Ext.CompositeElementLite.importElementMethods=function(){var c,b=Ext.Element.prototype,a=Ext.CompositeElementLite.prototype;for(c in b){if(typeof b[c]=="function"){(function(d){a[d]=a[d]||function(){return this.invoke(d,arguments)}}).call(a,c)}}};Ext.CompositeElementLite.importElementMethods();if(Ext.DomQuery){Ext.Element.selectorFunction=Ext.DomQuery.select}Ext.Element.select=function(a,b){var c;if(typeof a=="string"){c=Ext.Element.selectorFunction(a,b)}else{if(a.length!==undefined){c=a}else{throw"Invalid selector"}}return new Ext.CompositeElementLite(c)};Ext.select=Ext.Element.select;(function(){var b="beforerequest",e="requestcomplete",d="requestexception",h=undefined,c="load",i="POST",a="GET",g=window;Ext.data.Connection=function(j){Ext.apply(this,j);this.addEvents(b,e,d);Ext.data.Connection.superclass.constructor.call(this)};Ext.extend(Ext.data.Connection,Ext.util.Observable,{timeout:30000,autoAbort:false,disableCaching:true,disableCachingParam:"_dc",request:function(n){var s=this;if(s.fireEvent(b,s,n)){if(n.el){if(!Ext.isEmpty(n.indicatorText)){s.indicatorText='<div class="loading-indicator">'+n.indicatorText+"</div>"}if(s.indicatorText){Ext.getDom(n.el).innerHTML=s.indicatorText}n.success=(Ext.isFunction(n.success)?n.success:function(){}).createInterceptor(function(o){Ext.getDom(n.el).innerHTML=o.responseText})}var l=n.params,k=n.url||s.url,j,q={success:s.handleResponse,failure:s.handleFailure,scope:s,argument:{options:n},timeout:Ext.num(n.timeout,s.timeout)},m,t;if(Ext.isFunction(l)){l=l.call(n.scope||g,n)}l=Ext.urlEncode(s.extraParams,Ext.isObject(l)?Ext.urlEncode(l):l);if(Ext.isFunction(k)){k=k.call(n.scope||g,n)}if((m=Ext.getDom(n.form))){k=k||m.action;if(n.isUpload||(/multipart\/form-data/i.test(m.getAttribute("enctype")))){return s.doFormUpload.call(s,n,l,k)}t=Ext.lib.Ajax.serializeForm(m);l=l?(l+"&"+t):t}j=n.method||s.method||((l||n.xmlData||n.jsonData)?i:a);if(j===a&&(s.disableCaching&&n.disableCaching!==false)||n.disableCaching===true){var r=n.disableCachingParam||s.disableCachingParam;k=Ext.urlAppend(k,r+"="+(new Date().getTime()))}n.headers=Ext.applyIf(n.headers||{},s.defaultHeaders||{});if(n.autoAbort===true||s.autoAbort){s.abort()}if((j==a||n.xmlData||n.jsonData)&&l){k=Ext.urlAppend(k,l);l=""}return(s.transId=Ext.lib.Ajax.request(j,k,q,l,n))}else{return n.callback?n.callback.apply(n.scope,[n,h,h]):null}},isLoading:function(j){return j?Ext.lib.Ajax.isCallInProgress(j):!!this.transId},abort:function(j){if(j||this.isLoading()){Ext.lib.Ajax.abort(j||this.transId)}},handleResponse:function(j){this.transId=false;var k=j.argument.options;j.argument=k?k.argument:null;this.fireEvent(e,this,j,k);if(k.success){k.success.call(k.scope,j,k)}if(k.callback){k.callback.call(k.scope,k,true,j)}},handleFailure:function(j,l){this.transId=false;var k=j.argument.options;j.argument=k?k.argument:null;this.fireEvent(d,this,j,k,l);if(k.failure){k.failure.call(k.scope,j,k)}if(k.callback){k.callback.call(k.scope,k,false,j)}},doFormUpload:function(q,j,k){var l=Ext.id(),v=document,r=v.createElement("iframe"),m=Ext.getDom(q.form),u=[],t,p="multipart/form-data",n={target:m.target,method:m.method,encoding:m.encoding,enctype:m.enctype,action:m.action};Ext.fly(r).set({id:l,name:l,cls:"x-hidden",src:Ext.SSL_SECURE_URL});v.body.appendChild(r);if(Ext.isIE){document.frames[l].name=l}Ext.fly(m).set({target:l,method:i,enctype:p,encoding:p,action:k||n.action});Ext.iterate(Ext.urlDecode(j,false),function(w,o){t=v.createElement("input");Ext.fly(t).set({type:"hidden",value:o,name:w});m.appendChild(t);u.push(t)});function s(){var x=this,w={responseText:"",responseXML:null,argument:q.argument},A,z;try{A=r.contentWindow.document||r.contentDocument||g.frames[l].document;if(A){if(A.body){if(/textarea/i.test((z=A.body.firstChild||{}).tagName)){w.responseText=z.value}else{w.responseText=A.body.innerHTML}}w.responseXML=A.XMLDocument||A}}catch(y){}Ext.EventManager.removeListener(r,c,s,x);x.fireEvent(e,x,w,q);function o(D,C,B){if(Ext.isFunction(D)){D.apply(C,B)}}o(q.success,q.scope,[w,q]);o(q.callback,q.scope,[q,true,w]);if(!x.debugUploads){setTimeout(function(){Ext.removeNode(r)},100)}}Ext.EventManager.on(r,c,s,this);m.submit();Ext.fly(m).set(n);Ext.each(u,function(o){Ext.removeNode(o)})}})})();Ext.Ajax=new Ext.data.Connection({autoAbort:false,serializeForm:function(a){return Ext.lib.Ajax.serializeForm(a)}});Ext.util.JSON=new (function(){var useHasOwn=!!{}.hasOwnProperty,isNative=function(){var useNative=null;return function(){if(useNative===null){useNative=Ext.USE_NATIVE_JSON&&window.JSON&&JSON.toString()=="[object JSON]"}return useNative}}(),pad=function(n){return n<10?"0"+n:n},doDecode=function(json){return json?eval("("+json+")"):""},doEncode=function(o){if(!Ext.isDefined(o)||o===null){return"null"}else{if(Ext.isArray(o)){return encodeArray(o)}else{if(Ext.isDate(o)){return Ext.util.JSON.encodeDate(o)}else{if(Ext.isString(o)){return encodeString(o)}else{if(typeof o=="number"){return isFinite(o)?String(o):"null"}else{if(Ext.isBoolean(o)){return String(o)}else{var a=["{"],b,i,v;for(i in o){if(!o.getElementsByTagName){if(!useHasOwn||o.hasOwnProperty(i)){v=o[i];switch(typeof v){case"undefined":case"function":case"unknown":break;default:if(b){a.push(",")}a.push(doEncode(i),":",v===null?"null":doEncode(v));b=true}}}}a.push("}");return a.join("")}}}}}}},m={"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},encodeString=function(s){if(/["\\\x00-\x1f]/.test(s)){return'"'+s.replace(/([\x00-\x1f\\"])/g,function(a,b){var c=m[b];if(c){return c}c=b.charCodeAt();return"\\u00"+Math.floor(c/16).toString(16)+(c%16).toString(16)})+'"'}return'"'+s+'"'},encodeArray=function(o){var a=["["],b,i,l=o.length,v;for(i=0;i<l;i+=1){v=o[i];switch(typeof v){case"undefined":case"function":case"unknown":break;default:if(b){a.push(",")}a.push(v===null?"null":Ext.util.JSON.encode(v));b=true}}a.push("]");return a.join("")};this.encodeDate=function(o){return'"'+o.getFullYear()+"-"+pad(o.getMonth()+1)+"-"+pad(o.getDate())+"T"+pad(o.getHours())+":"+pad(o.getMinutes())+":"+pad(o.getSeconds())+'"'};this.encode=function(){var ec;return function(o){if(!ec){ec=isNative()?JSON.stringify:doEncode}return ec(o)}}();this.decode=function(){var dc;return function(json){if(!dc){dc=isNative()?JSON.parse:doDecode}return dc(json)}}()})();Ext.encode=Ext.util.JSON.encode;Ext.decode=Ext.util.JSON.decode;Ext.EventManager=function(){var z,p,j=false,l=Ext.isGecko||Ext.isWebKit||Ext.isSafari,o=Ext.lib.Event,q=Ext.lib.Dom,c=document,A=window,r="DOMContentLoaded",t="complete",g=/^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,u=[];function n(E){var H=false,D=0,C=u.length,F=false,G;if(E){if(E.getElementById||E.navigator){for(;D<C;++D){G=u[D];if(G.el===E){H=G.id;break}}if(!H){H=Ext.id(E);u.push({id:H,el:E});F=true}}else{H=Ext.id(E)}if(!Ext.elCache[H]){Ext.Element.addToCache(new Ext.Element(E),H);if(F){Ext.elCache[H].skipGC=true}}}return H}function m(E,G,J,F,D,L){E=Ext.getDom(E);var C=n(E),K=Ext.elCache[C].events,H;H=o.on(E,G,D);K[G]=K[G]||[];K[G].push([J,D,L,H,F]);if(E.addEventListener&&G=="mousewheel"){var I=["DOMMouseScroll",D,false];E.addEventListener.apply(E,I);Ext.EventManager.addListener(A,"unload",function(){E.removeEventListener.apply(E,I)})}if(E==c&&G=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.addListener(D)}}function d(){if(window!=top){return false}try{c.documentElement.doScroll("left")}catch(C){return false}b();return true}function B(C){if(Ext.isIE&&d()){return true}if(c.readyState==t){b();return true}j||(p=setTimeout(arguments.callee,2));return false}var k;function i(C){k||(k=Ext.query("style, link[rel=stylesheet]"));if(k.length==c.styleSheets.length){b();return true}j||(p=setTimeout(arguments.callee,2));return false}function y(C){c.removeEventListener(r,arguments.callee,false);i()}function b(C){if(!j){j=true;if(p){clearTimeout(p)}if(l){c.removeEventListener(r,b,false)}if(Ext.isIE&&B.bindIE){c.detachEvent("onreadystatechange",B)}o.un(A,"load",arguments.callee)}if(z&&!Ext.isReady){Ext.isReady=true;z.fire();z.listeners=[]}}function a(){z||(z=new Ext.util.Event());if(l){c.addEventListener(r,b,false)}if(Ext.isIE){if(!B()){B.bindIE=true;c.attachEvent("onreadystatechange",B)}}else{if(Ext.isOpera){(c.readyState==t&&i())||c.addEventListener(r,y,false)}else{if(Ext.isWebKit){B()}}}o.on(A,"load",b)}function x(C,D){return function(){var E=Ext.toArray(arguments);if(D.target==Ext.EventObject.setEvent(E[0]).target){C.apply(this,E)}}}function w(D,E,C){return function(F){C.delay(E.buffer,D,null,[new Ext.EventObjectImpl(F)])}}function s(G,F,C,E,D){return function(H){Ext.EventManager.removeListener(F,C,E,D);G(H)}}function e(D,E,C){return function(G){var F=new Ext.util.DelayedTask(D);if(!C.tasks){C.tasks=[]}C.tasks.push(F);F.delay(E.delay||10,D,null,[new Ext.EventObjectImpl(G)])}}function h(H,G,C,J,K){var D=(!C||typeof C=="boolean")?{}:C,E=Ext.getDom(H),F;J=J||D.fn;K=K||D.scope;if(!E){throw'Error listening for "'+G+'". Element "'+H+"\" doesn't exist."}function I(M){if(!Ext){return}M=Ext.EventObject.setEvent(M);var L;if(D.delegate){if(!(L=M.getTarget(D.delegate,E))){return}}else{L=M.target}if(D.stopEvent){M.stopEvent()}if(D.preventDefault){M.preventDefault()}if(D.stopPropagation){M.stopPropagation()}if(D.normalized===false){M=M.browserEvent}J.call(K||E,M,L,D)}if(D.target){I=x(I,D)}if(D.delay){I=e(I,D,J)}if(D.single){I=s(I,E,G,J,K)}if(D.buffer){F=new Ext.util.DelayedTask(I);I=w(I,D,F)}m(E,G,J,F,I,K);return I}var v={addListener:function(E,C,G,F,D){if(typeof C=="object"){var J=C,H,I;for(H in J){I=J[H];if(!g.test(H)){if(Ext.isFunction(I)){h(E,H,J,I,J.scope)}else{h(E,H,I)}}}}else{h(E,C,D,G,F)}},removeListener:function(E,I,M,N){E=Ext.getDom(E);var C=n(E),K=E&&(Ext.elCache[C].events)[I]||[],D,H,F,G,J,L;for(H=0,J=K.length;H<J;H++){if(Ext.isArray(L=K[H])&&L[0]==M&&(!N||L[2]==N)){if(L[4]){L[4].cancel()}G=M.tasks&&M.tasks.length;if(G){while(G--){M.tasks[G].cancel()}delete M.tasks}D=L[1];o.un(E,I,o.extAdapter?L[3]:D);if(D&&E.addEventListener&&I=="mousewheel"){E.removeEventListener("DOMMouseScroll",D,false)}if(D&&E==c&&I=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.removeListener(D)}K.splice(H,1);if(K.length===0){delete Ext.elCache[C].events[I]}for(G in Ext.elCache[C].events){return false}Ext.elCache[C].events={};return false}}},removeAll:function(E){E=Ext.getDom(E);var D=n(E),J=Ext.elCache[D]||{},M=J.events||{},I,H,K,F,L,G,C;for(F in M){if(M.hasOwnProperty(F)){I=M[F];for(H=0,K=I.length;H<K;H++){L=I[H];if(L[4]){L[4].cancel()}if(L[0].tasks&&(G=L[0].tasks.length)){while(G--){L[0].tasks[G].cancel()}delete L.tasks}C=L[1];o.un(E,F,o.extAdapter?L[3]:C);if(E.addEventListener&&C&&F=="mousewheel"){E.removeEventListener("DOMMouseScroll",C,false)}if(C&&E==c&&F=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.removeListener(C)}}}}if(Ext.elCache[D]){Ext.elCache[D].events={}}},getListeners:function(F,C){F=Ext.getDom(F);var H=n(F),D=Ext.elCache[H]||{},G=D.events||{},E=[];if(G&&G[C]){return G[C]}else{return null}},purgeElement:function(E,C,G){E=Ext.getDom(E);var D=n(E),J=Ext.elCache[D]||{},K=J.events||{},F,I,H;if(G){if(K&&K.hasOwnProperty(G)){I=K[G];for(F=0,H=I.length;F<H;F++){Ext.EventManager.removeListener(E,G,I[F][0])}}}else{Ext.EventManager.removeAll(E)}if(C&&E&&E.childNodes){for(F=0,H=E.childNodes.length;F<H;F++){Ext.EventManager.purgeElement(E.childNodes[F],C,G)}}},_unload:function(){var C;for(C in Ext.elCache){Ext.EventManager.removeAll(C)}delete Ext.elCache;delete Ext.Element._flyweights;var G,D,F,E=Ext.lib.Ajax;(typeof E.conn=="object")?D=E.conn:D={};for(F in D){G=D[F];if(G){E.abort({conn:G,tId:F})}}},onDocumentReady:function(E,D,C){if(Ext.isReady){z||(z=new Ext.util.Event());z.addListener(E,D,C);z.fire();z.listeners=[]}else{if(!z){a()}C=C||{};C.delay=C.delay||1;z.addListener(E,D,C)}},fireDocReady:b};v.on=v.addListener;v.un=v.removeListener;v.stoppedMouseDownEvent=new Ext.util.Event();return v}();Ext.onReady=Ext.EventManager.onDocumentReady;(function(){var a=function(){var c=document.body||document.getElementsByTagName("body")[0];if(!c){return false}var b=[" ",Ext.isIE?"ext-ie "+(Ext.isIE6?"ext-ie6":(Ext.isIE7?"ext-ie7":(Ext.isIE8?"ext-ie8":"ext-ie9"))):Ext.isGecko?"ext-gecko "+(Ext.isGecko2?"ext-gecko2":"ext-gecko3"):Ext.isOpera?"ext-opera":Ext.isWebKit?"ext-webkit":""];if(Ext.isSafari){b.push("ext-safari "+(Ext.isSafari2?"ext-safari2":(Ext.isSafari3?"ext-safari3":"ext-safari4")))}else{if(Ext.isChrome){b.push("ext-chrome")}}if(Ext.isMac){b.push("ext-mac")}if(Ext.isLinux){b.push("ext-linux")}if(Ext.isStrict||Ext.isBorderBox){var d=c.parentNode;if(d){if(!Ext.isStrict){Ext.fly(d,"_internal").addClass("x-quirks");if(Ext.isIE&&!Ext.isStrict){Ext.isIEQuirks=true}}Ext.fly(d,"_internal").addClass(((Ext.isStrict&&Ext.isIE)||(!Ext.enableForcedBoxModel&&!Ext.isIE))?" ext-strict":" ext-border-box")}}if(Ext.enableForcedBoxModel&&!Ext.isIE){Ext.isForcedBorderBox=true;b.push("ext-forced-border-box")}Ext.fly(c,"_internal").addClass(b);return true};if(!a()){Ext.onReady(a)}})();(function(){var b=Ext.apply(Ext.supports,{correctRightMargin:true,correctTransparentColor:true,cssFloat:true});var a=function(){var g=document.createElement("div"),e=document,c,d;g.innerHTML='<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';e.body.appendChild(g);d=g.lastChild;if((c=e.defaultView)){if(c.getComputedStyle(g.firstChild.firstChild,null).marginRight!="0px"){b.correctRightMargin=false}if(c.getComputedStyle(d,null).backgroundColor!="transparent"){b.correctTransparentColor=false}}b.cssFloat=!!d.style.cssFloat;e.body.removeChild(g)};if(Ext.isReady){a()}else{Ext.onReady(a)}})();Ext.EventObject=function(){var b=Ext.lib.Event,c=/(dbl)?click/,a={3:13,63234:37,63235:39,63232:38,63233:40,63276:33,63277:34,63272:46,63273:36,63275:35},d=Ext.isIE?{1:0,4:1,2:2}:{0:0,1:1,2:2};Ext.EventObjectImpl=function(g){if(g){this.setEvent(g.browserEvent||g)}};Ext.EventObjectImpl.prototype={setEvent:function(h){var g=this;if(h==g||(h&&h.browserEvent)){return h}g.browserEvent=h;if(h){g.button=h.button?d[h.button]:(h.which?h.which-1:-1);if(c.test(h.type)&&g.button==-1){g.button=0}g.type=h.type;g.shiftKey=h.shiftKey;g.ctrlKey=h.ctrlKey||h.metaKey||false;g.altKey=h.altKey;g.keyCode=h.keyCode;g.charCode=h.charCode;g.target=b.getTarget(h);g.xy=b.getXY(h)}else{g.button=-1;g.shiftKey=false;g.ctrlKey=false;g.altKey=false;g.keyCode=0;g.charCode=0;g.target=null;g.xy=[0,0]}return g},stopEvent:function(){var e=this;if(e.browserEvent){if(e.browserEvent.type=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.fire(e)}b.stopEvent(e.browserEvent)}},preventDefault:function(){if(this.browserEvent){b.preventDefault(this.browserEvent)}},stopPropagation:function(){var e=this;if(e.browserEvent){if(e.browserEvent.type=="mousedown"){Ext.EventManager.stoppedMouseDownEvent.fire(e)}b.stopPropagation(e.browserEvent)}},getCharCode:function(){return this.charCode||this.keyCode},getKey:function(){return this.normalizeKey(this.keyCode||this.charCode)},normalizeKey:function(e){return Ext.isSafari?(a[e]||e):e},getPageX:function(){return this.xy[0]},getPageY:function(){return this.xy[1]},getXY:function(){return this.xy},getTarget:function(g,h,e){return g?Ext.fly(this.target).findParent(g,h,e):(e?Ext.get(this.target):this.target)},getRelatedTarget:function(){return this.browserEvent?b.getRelatedTarget(this.browserEvent):null},getWheelDelta:function(){var g=this.browserEvent;var h=0;if(g.wheelDelta){h=g.wheelDelta/120}else{if(g.detail){h=-g.detail/3}}return h},within:function(h,i,e){if(h){var g=this[i?"getRelatedTarget":"getTarget"]();return g&&((e?(g==Ext.getDom(h)):false)||Ext.fly(h).contains(g))}return false}};return new Ext.EventObjectImpl()}();Ext.Loader=Ext.apply({},{load:function(j,i,k,c){var k=k||this,g=document.getElementsByTagName("head")[0],b=document.createDocumentFragment(),a=j.length,h=0,e=this;var l=function(m){g.appendChild(e.buildScriptTag(j[m],d))};var d=function(){h++;if(a==h&&typeof i=="function"){i.call(k)}else{if(c===true){l(h)}}};if(c===true){l.call(this,0)}else{Ext.each(j,function(n,m){b.appendChild(this.buildScriptTag(n,d))},this);g.appendChild(b)}},buildScriptTag:function(b,c){var a=document.createElement("script");a.type="text/javascript";a.src=b;if(a.readyState){a.onreadystatechange=function(){if(a.readyState=="loaded"||a.readyState=="complete"){a.onreadystatechange=null;c()}}}else{a.onload=c}return a}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-toolbars-debug.js	(revision 76)
@@ -0,0 +1,1216 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Toolbar
+ * @extends Ext.Container
+ * <p>Basic Toolbar class. Although the <tt>{@link Ext.Container#defaultType defaultType}</tt> for Toolbar
+ * is <tt>{@link Ext.Button button}</tt>, Toolbar elements (child items for the Toolbar container) may
+ * be virtually any type of Component. Toolbar elements can be created explicitly via their constructors,
+ * or implicitly via their xtypes, and can be <tt>{@link #add}</tt>ed dynamically.</p>
+ * <p>Some items have shortcut strings for creation:</p>
+ * <pre>
+<u>Shortcut</u>  <u>xtype</u>          <u>Class</u>                  <u>Description</u>
+'->'      'tbfill'       {@link Ext.Toolbar.Fill}       begin using the right-justified button container
+'-'       'tbseparator'  {@link Ext.Toolbar.Separator}  add a vertical separator bar between toolbar items
+' '       'tbspacer'     {@link Ext.Toolbar.Spacer}     add horiztonal space between elements
+ * </pre>
+ *
+ * Example usage of various elements:
+ * <pre><code>
+var tb = new Ext.Toolbar({
+    renderTo: document.body,
+    width: 600,
+    height: 100,
+    items: [
+        {
+            // xtype: 'button', // default for Toolbars, same as 'tbbutton'
+            text: 'Button'
+        },
+        {
+            xtype: 'splitbutton', // same as 'tbsplitbutton'
+            text: 'Split Button'
+        },
+        // begin using the right-justified button container
+        '->', // same as {xtype: 'tbfill'}, // Ext.Toolbar.Fill
+        {
+            xtype: 'textfield',
+            name: 'field1',
+            emptyText: 'enter search term'
+        },
+        // add a vertical separator bar between toolbar items
+        '-', // same as {xtype: 'tbseparator'} to create Ext.Toolbar.Separator
+        'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.Toolbar.TextItem
+        {xtype: 'tbspacer'},// same as ' ' to create Ext.Toolbar.Spacer
+        'text 2',
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'text 3'
+    ]
+});
+ * </code></pre>
+ * Example adding a ComboBox within a menu of a button:
+ * <pre><code>
+// ComboBox creation
+var combo = new Ext.form.ComboBox({
+    store: new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: ['initials', 'fullname'],
+        data : [
+            ['FF', 'Fred Flintstone'],
+            ['BR', 'Barney Rubble']
+        ]
+    }),
+    displayField: 'fullname',
+    typeAhead: true,
+    mode: 'local',
+    forceSelection: true,
+    triggerAction: 'all',
+    emptyText: 'Select a name...',
+    selectOnFocus: true,
+    width: 135,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon' //use iconCls if placing within menu to shift to right side of menu
+});
+
+// put ComboBox in a Menu
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+
+// add a Button with the menu
+tb.add({
+        text:'Button w/ Menu',
+        menu: menu  // assign menu by instance
+    });
+tb.doLayout();
+ * </code></pre>
+ * @constructor
+ * Creates a new Toolbar
+ * @param {Object/Array} config A config object or an array of buttons to <tt>{@link #add}</tt>
+ * @xtype toolbar
+ */
+Ext.Toolbar = function(config){
+    if(Ext.isArray(config)){
+        config = {items: config, layout: 'toolbar'};
+    } else {
+        config = Ext.apply({
+            layout: 'toolbar'
+        }, config);
+        if(config.buttons) {
+            config.items = config.buttons;
+        }
+    }
+    Ext.Toolbar.superclass.constructor.call(this, config);
+};
+
+(function(){
+
+var T = Ext.Toolbar;
+
+Ext.extend(T, Ext.Container, {
+
+    defaultType: 'button',
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>toolbar</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout
+     * is required (the constructor must be passed a configuration object in this
+     * case instead of an array).
+     * See {@link Ext.Container#layout} for additional information.
+     */
+
+    enableOverflow : false,
+
+    /**
+     * @cfg {Boolean} enableOverflow
+     * Defaults to false. Configure <tt>true</tt> to make the toolbar provide a button
+     * which activates a dropdown Menu to show items which overflow the Toolbar's width.
+     */
+    /**
+     * @cfg {String} buttonAlign
+     * <p>The default position at which to align child items. Defaults to <code>"left"</code></p>
+     * <p>May be specified as <code>"center"</code> to cause items added before a Fill (A <code>"->"</code>) item
+     * to be centered in the Toolbar. Items added after a Fill are still right-aligned.</p>
+     * <p>Specify as <code>"right"</code> to right align all child items.</p>
+     */
+
+    trackMenus : true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+    toolbarCls: 'x-toolbar',
+
+    initComponent : function(){
+        T.superclass.initComponent.call(this);
+
+        /**
+         * @event overflowchange
+         * Fires after the overflow state has changed.
+         * @param {Object} c The Container
+         * @param {Boolean} lastOverflow overflow state
+         */
+        this.addEvents('overflowchange');
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            if(!this.autoCreate){
+                this.autoCreate = {
+                    cls: this.toolbarCls + ' x-small-editor'
+                };
+            }
+            this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);
+            Ext.Toolbar.superclass.onRender.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Adds element(s) to the toolbar -- this function takes a variable number of
+     * arguments of mixed type and adds them to the toolbar.</p>
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} arg1 The following types of arguments are all valid:<br />
+     * <ul>
+     * <li>{@link Ext.Button} config: A valid button config object (equivalent to {@link #addButton})</li>
+     * <li>HtmlElement: Any standard HTML element (equivalent to {@link #addElement})</li>
+     * <li>Field: Any form field (equivalent to {@link #addField})</li>
+     * <li>Item: Any subclass of {@link Ext.Toolbar.Item} (equivalent to {@link #addItem})</li>
+     * <li>String: Any generic string (gets wrapped in a {@link Ext.Toolbar.TextItem}, equivalent to {@link #addText}).
+     * Note that there are a few special strings that are treated differently as explained next.</li>
+     * <li>'-': Creates a separator element (equivalent to {@link #addSeparator})</li>
+     * <li>' ': Creates a spacer element (equivalent to {@link #addSpacer})</li>
+     * <li>'->': Creates a fill element (equivalent to {@link #addFill})</li>
+     * </ul>
+     * @param {Mixed} arg2
+     * @param {Mixed} etc.
+     * @method add
+     */
+
+    // private
+    lookupComponent : function(c){
+        if(Ext.isString(c)){
+            if(c == '-'){
+                c = new T.Separator();
+            }else if(c == ' '){
+                c = new T.Spacer();
+            }else if(c == '->'){
+                c = new T.Fill();
+            }else{
+                c = new T.TextItem(c);
+            }
+            this.applyDefaults(c);
+        }else{
+            if(c.isFormField || c.render){ // some kind of form field, some kind of Toolbar.Item
+                c = this.createComponent(c);
+            }else if(c.tag){ // DomHelper spec
+                c = new T.Item({autoEl: c});
+            }else if(c.tagName){ // element
+                c = new T.Item({el:c});
+            }else if(Ext.isObject(c)){ // must be button config?
+                c = c.xtype ? this.createComponent(c) : this.constructButton(c);
+            }
+        }
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        if(!Ext.isString(c)){
+            c = Ext.Toolbar.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(c.events){
+                Ext.applyIf(c.initialConfig, d);
+                Ext.apply(c, d);
+            }else{
+                Ext.applyIf(c, d);
+            }
+        }
+        return c;
+    },
+
+    /**
+     * Adds a separator
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Item} The separator {@link Ext.Toolbar.Item item}
+     */
+    addSeparator : function(){
+        return this.add(new T.Separator());
+    },
+
+    /**
+     * Adds a spacer element
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Spacer} The spacer item
+     */
+    addSpacer : function(){
+        return this.add(new T.Spacer());
+    },
+
+    /**
+     * Forces subsequent additions into the float:right toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     */
+    addFill : function(){
+        this.add(new T.Fill());
+    },
+
+    /**
+     * Adds any standard HTML element to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} el The element or id of the element to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addElement : function(el){
+        return this.addItem(new T.Item({el:el}));
+    },
+
+    /**
+     * Adds any Toolbar.Item or subclass
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.Toolbar.Item} item
+     * @return {Ext.Toolbar.Item} The item
+     */
+    addItem : function(item){
+        return this.add.apply(this, arguments);
+    },
+
+    /**
+     * Adds a button (or buttons). See {@link Ext.Button} for more info on the config.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object/Array} config A button config or array of configs
+     * @return {Ext.Button/Array}
+     */
+    addButton : function(config){
+        if(Ext.isArray(config)){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+                buttons.push(this.addButton(config[i]));
+            }
+            return buttons;
+        }
+        return this.add(this.constructButton(config));
+    },
+
+    /**
+     * Adds text to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {String} text The text to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addText : function(text){
+        return this.addItem(new T.TextItem(text));
+    },
+
+    /**
+     * Adds a new element to the toolbar from the passed {@link Ext.DomHelper} config
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object} config
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addDom : function(config){
+        return this.add(new T.Item({autoEl: config}));
+    },
+
+    /**
+     * Adds a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have
+     * been rendered yet. For a field that has already been rendered, use {@link #addElement}.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.form.Field} field
+     * @return {Ext.Toolbar.Item}
+     */
+    addField : function(field){
+        return this.add(field);
+    },
+
+    /**
+     * Inserts any {@link Ext.Toolbar.Item}/{@link Ext.Button} at the specified index.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Number} index The index where the item is to be inserted
+     * @param {Object/Ext.Toolbar.Item/Ext.Button/Array} item The button, or button config object to be
+     * inserted, or an array of buttons/configs.
+     * @return {Ext.Button/Item}
+     */
+    insertButton : function(index, item){
+        if(Ext.isArray(item)){
+            var buttons = [];
+            for(var i = 0, len = item.length; i < len; i++) {
+               buttons.push(this.insertButton(index + i, item[i]));
+            }
+            return buttons;
+        }
+        return Ext.Toolbar.superclass.insert.call(this, index, item);
+    },
+
+    // private
+    trackMenu : function(item, remove){
+        if(this.trackMenus && item.menu){
+            var method = remove ? 'mun' : 'mon';
+            this[method](item, 'menutriggerover', this.onButtonTriggerOver, this);
+            this[method](item, 'menushow', this.onButtonMenuShow, this);
+            this[method](item, 'menuhide', this.onButtonMenuHide, this);
+        }
+    },
+
+    // private
+    constructButton : function(item){
+        var b = item.events ? item : this.createComponent(item, item.split ? 'splitbutton' : this.defaultType);
+        return b;
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.Toolbar.superclass.onAdd.call(this);
+        this.trackMenu(c);
+        if(this.disabled){
+            c.disable();
+        }
+    },
+
+    // private
+    onRemove : function(c){
+        Ext.Toolbar.superclass.onRemove.call(this);
+        if (c == this.activeMenuBtn) {
+            delete this.activeMenuBtn;
+        }
+        this.trackMenu(c, true);
+    },
+
+    // private
+    onDisable : function(){
+        this.items.each(function(item){
+             if(item.disable){
+                 item.disable();
+             }
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.items.each(function(item){
+             if(item.enable){
+                 item.enable();
+             }
+        });
+    },
+
+    // private
+    onButtonTriggerOver : function(btn){
+        if(this.activeMenuBtn && this.activeMenuBtn != btn){
+            this.activeMenuBtn.hideMenu();
+            btn.showMenu();
+            this.activeMenuBtn = btn;
+        }
+    },
+
+    // private
+    onButtonMenuShow : function(btn){
+        this.activeMenuBtn = btn;
+    },
+
+    // private
+    onButtonMenuHide : function(btn){
+        delete this.activeMenuBtn;
+    }
+});
+Ext.reg('toolbar', Ext.Toolbar);
+
+/**
+ * @class Ext.Toolbar.Item
+ * @extends Ext.BoxComponent
+ * The base class that other non-interacting Toolbar Item classes should extend in order to
+ * get some basic common toolbar item functionality.
+ * @constructor
+ * Creates a new Item
+ * @param {HTMLElement} el
+ * @xtype tbitem
+ */
+T.Item = Ext.extend(Ext.BoxComponent, {
+    hideParent: true, //  Hiding a Toolbar.Item hides its containing TD
+    enable:Ext.emptyFn,
+    disable:Ext.emptyFn,
+    focus:Ext.emptyFn
+    /**
+     * @cfg {String} overflowText Text to be used for the menu if the item is overflowed.
+     */
+});
+Ext.reg('tbitem', T.Item);
+
+/**
+ * @class Ext.Toolbar.Separator
+ * @extends Ext.Toolbar.Item
+ * A simple class that adds a vertical separator bar between toolbar items
+ * (css class:<tt>'xtb-sep'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbseparator'}, // or '-'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Separator
+ * @xtype tbseparator
+ */
+T.Separator = Ext.extend(T.Item, {
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'span', cls:'xtb-sep'}, position);
+    }
+});
+Ext.reg('tbseparator', T.Separator);
+
+/**
+ * @class Ext.Toolbar.Spacer
+ * @extends Ext.Toolbar.Item
+ * A simple element that adds extra horizontal space between items in a toolbar.
+ * By default a 2px wide space is added via css specification:<pre><code>
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+ * </code></pre>
+ * <p>Example usage:</p>
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbspacer'}, // or ' '
+        'Item 2',
+        // space width is also configurable via javascript
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'Item 3'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Spacer
+ * @xtype tbspacer
+ */
+T.Spacer = Ext.extend(T.Item, {
+    /**
+     * @cfg {Number} width
+     * The width of the spacer in pixels (defaults to 2px via css style <tt>.x-toolbar .xtb-spacer</tt>).
+     */
+
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'div', cls:'xtb-spacer', style: this.width?'width:'+this.width+'px':''}, position);
+    }
+});
+Ext.reg('tbspacer', T.Spacer);
+
+/**
+ * @class Ext.Toolbar.Fill
+ * @extends Ext.Toolbar.Spacer
+ * A non-rendering placeholder item which instructs the Toolbar's Layout to begin using
+ * the right-justified button container.
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbfill'}, // or '->'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Fill
+ * @xtype tbfill
+ */
+T.Fill = Ext.extend(T.Item, {
+    // private
+    render : Ext.emptyFn,
+    isFill : true
+});
+Ext.reg('tbfill', T.Fill);
+
+/**
+ * @class Ext.Toolbar.TextItem
+ * @extends Ext.Toolbar.Item
+ * A simple class that renders text directly into a toolbar
+ * (with css class:<tt>'xtb-text'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        {xtype: 'tbtext', text: 'Item 1'} // or simply 'Item 1'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new TextItem
+ * @param {String/Object} text A text string, or a config object containing a <tt>text</tt> property
+ * @xtype tbtext
+ */
+T.TextItem = Ext.extend(T.Item, {
+    /**
+     * @cfg {String} text The text to be used as innerHTML (html tags are accepted)
+     */
+
+    constructor: function(config){
+        T.TextItem.superclass.constructor.call(this, Ext.isString(config) ? {text: config} : config);
+    },
+
+    // private
+    onRender : function(ct, position) {
+        this.autoEl = {cls: 'xtb-text', html: this.text || ''};
+        T.TextItem.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates this item's text, setting the text to be used as innerHTML.
+     * @param {String} t The text to display (html accepted).
+     */
+    setText : function(t) {
+        if(this.rendered){
+            this.el.update(t);
+        }else{
+            this.text = t;
+        }
+    }
+});
+Ext.reg('tbtext', T.TextItem);
+
+// backwards compat
+T.Button = Ext.extend(Ext.Button, {});
+T.SplitButton = Ext.extend(Ext.SplitButton, {});
+Ext.reg('tbbutton', T.Button);
+Ext.reg('tbsplit', T.SplitButton);
+
+})();
+/**
+ * @class Ext.ButtonGroup
+ * @extends Ext.Panel
+ * Container for a group of buttons. Example usage:
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Panel with Button Group',
+    width: 300,
+    height:200,
+    renderTo: document.body,
+    html: 'whatever',
+    tbar: [{
+        xtype: 'buttongroup',
+        {@link #columns}: 3,
+        title: 'Clipboard',
+        items: [{
+            text: 'Paste',
+            scale: 'large',
+            rowspan: 3, iconCls: 'add',
+            iconAlign: 'top',
+            cls: 'x-btn-as-arrow'
+        },{
+            xtype:'splitbutton',
+            text: 'Menu Button',
+            scale: 'large',
+            rowspan: 3,
+            iconCls: 'add',
+            iconAlign: 'top',
+            arrowAlign:'bottom',
+            menu: [{text: 'Menu Item 1'}]
+        },{
+            xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
+        },{
+            text: 'Copy', iconCls: 'add16'
+        },{
+            text: 'Format', iconCls: 'add16'
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * Create a new ButtonGroup.
+ * @param {Object} config The config object
+ * @xtype buttongroup
+ */
+Ext.ButtonGroup = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} columns The <tt>columns</tt> configuration property passed to the
+     * {@link #layout configured layout manager}. See {@link Ext.layout.TableLayout#columns}.
+     */
+    /**
+     * @cfg {String} baseCls  Defaults to <tt>'x-btn-group'</tt>.  See {@link Ext.Panel#baseCls}.
+     */
+    baseCls: 'x-btn-group',
+    /**
+     * @cfg {String} layout  Defaults to <tt>'table'</tt>.  See {@link Ext.Container#layout}.
+     */
+    layout:'table',
+    defaultType: 'button',
+    /**
+     * @cfg {Boolean} frame  Defaults to <tt>true</tt>.  See {@link Ext.Panel#frame}.
+     */
+    frame: true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+
+    initComponent : function(){
+        this.layoutConfig = this.layoutConfig || {};
+        Ext.applyIf(this.layoutConfig, {
+            columns : this.columns
+        });
+        if(!this.title){
+            this.addClass('x-btn-group-notitle');
+        }
+        this.on('afterlayout', this.onAfterLayout, this);
+        Ext.ButtonGroup.superclass.initComponent.call(this);
+    },
+
+    applyDefaults : function(c){
+        c = Ext.ButtonGroup.superclass.applyDefaults.call(this, c);
+        var d = this.internalDefaults;
+        if(c.events){
+            Ext.applyIf(c.initialConfig, d);
+            Ext.apply(c, d);
+        }else{
+            Ext.applyIf(c, d);
+        }
+        return c;
+    },
+
+    onAfterLayout : function(){
+        var bodyWidth = this.body.getFrameWidth('lr') + this.body.dom.firstChild.offsetWidth;
+        this.body.setWidth(bodyWidth);
+        this.el.setWidth(bodyWidth + this.getFrameWidth());
+    }
+    /**
+     * @cfg {Array} tools  @hide
+     */
+});
+
+Ext.reg('buttongroup', Ext.ButtonGroup);
+/**
+ * @class Ext.PagingToolbar
+ * @extends Ext.Toolbar
+ * <p>As the amount of records increases, the time required for the browser to render
+ * them increases. Paging is used to reduce the amount of data exchanged with the client.
+ * Note: if there are more records/rows than can be viewed in the available screen area, vertical
+ * scrollbars will be added.</p>
+ * <p>Paging is typically handled on the server side (see exception below). The client sends
+ * parameters to the server side, which the server needs to interpret and then respond with the
+ * approprate data.</p>
+ * <p><b>Ext.PagingToolbar</b> is a specialized toolbar that is bound to a {@link Ext.data.Store}
+ * and provides automatic paging control. This Component {@link Ext.data.Store#load load}s blocks
+ * of data into the <tt>{@link #store}</tt> by passing {@link Ext.data.Store#paramNames paramNames} used for
+ * paging criteria.</p>
+ * <p>PagingToolbar is typically used as one of the Grid's toolbars:</p>
+ * <pre><code>
+Ext.QuickTips.init(); // to display button quicktips
+
+var myStore = new Ext.data.Store({
+    reader: new Ext.data.JsonReader({
+        {@link Ext.data.JsonReader#totalProperty totalProperty}: 'results', 
+        ...
+    }),
+    ...
+});
+
+var myPageSize = 25;  // server script should only send back 25 items at a time
+
+var grid = new Ext.grid.GridPanel({
+    ...
+    store: myStore,
+    bbar: new Ext.PagingToolbar({
+        {@link #store}: myStore,       // grid and PagingToolbar using same store
+        {@link #displayInfo}: true,
+        {@link #pageSize}: myPageSize,
+        {@link #prependButtons}: true,
+        items: [
+            'text 1'
+        ]
+    })
+});
+ * </code></pre>
+ *
+ * <p>To use paging, pass the paging requirements to the server when the store is first loaded.</p>
+ * <pre><code>
+store.load({
+    params: {
+        // specify params for the first page load if using paging
+        start: 0,          
+        limit: myPageSize,
+        // other params
+        foo:   'bar'
+    }
+});
+ * </code></pre>
+ * 
+ * <p>If using {@link Ext.data.Store#autoLoad store's autoLoad} configuration:</p>
+ * <pre><code>
+var myStore = new Ext.data.Store({
+    {@link Ext.data.Store#autoLoad autoLoad}: {params:{start: 0, limit: 25}},
+    ...
+});
+ * </code></pre>
+ * 
+ * <p>The packet sent back from the server would have this form:</p>
+ * <pre><code>
+{
+    "success": true,
+    "results": 2000, 
+    "rows": [ // <b>*Note:</b> this must be an Array 
+        { "id":  1, "name": "Bill", "occupation": "Gardener" },
+        { "id":  2, "name":  "Ben", "occupation": "Horticulturalist" },
+        ...
+        { "id": 25, "name":  "Sue", "occupation": "Botanist" }
+    ]
+}
+ * </code></pre>
+ * <p><u>Paging with Local Data</u></p>
+ * <p>Paging can also be accomplished with local data using extensions:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><a href="http://extjs.com/forum/showthread.php?t=71532">Ext.ux.data.PagingStore</a></li>
+ * <li>Paging Memory Proxy (examples/ux/PagingMemoryProxy.js)</li>
+ * </ul></div>
+ * @constructor Create a new PagingToolbar
+ * @param {Object} config The config object
+ * @xtype paging
+ */
+(function() {
+
+var T = Ext.Toolbar;
+
+Ext.PagingToolbar = Ext.extend(Ext.Toolbar, {
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} the paging toolbar should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} displayInfo
+     * <tt>true</tt> to display the displayMsg (defaults to <tt>false</tt>)
+     */
+    /**
+     * @cfg {Number} pageSize
+     * The number of records to display per page (defaults to <tt>20</tt>)
+     */
+    pageSize : 20,
+    /**
+     * @cfg {Boolean} prependButtons
+     * <tt>true</tt> to insert any configured <tt>items</tt> <i>before</i> the paging buttons.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String} displayMsg
+     * The paging status message to display (defaults to <tt>'Displaying {0} - {1} of {2}'</tt>).
+     * Note that this string is formatted using the braced numbers <tt>{0}-{2}</tt> as tokens
+     * that are replaced by the values for start, end and total respectively. These tokens should
+     * be preserved when overriding this string if showing those values is desired.
+     */
+    displayMsg : 'Displaying {0} - {1} of {2}',
+    /**
+     * @cfg {String} emptyMsg
+     * The message to display when no records are found (defaults to 'No data to display')
+     */
+    emptyMsg : 'No data to display',
+    /**
+     * @cfg {String} beforePageText
+     * The text displayed before the input item (defaults to <tt>'Page'</tt>).
+     */
+    beforePageText : 'Page',
+    /**
+     * @cfg {String} afterPageText
+     * Customizable piece of the default paging text (defaults to <tt>'of {0}'</tt>). Note that
+     * this string is formatted using <tt>{0}</tt> as a token that is replaced by the number of
+     * total pages. This token should be preserved when overriding this string if showing the
+     * total page count is desired.
+     */
+    afterPageText : 'of {0}',
+    /**
+     * @cfg {String} firstText
+     * The quicktip text displayed for the first page button (defaults to <tt>'First Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    firstText : 'First Page',
+    /**
+     * @cfg {String} prevText
+     * The quicktip text displayed for the previous page button (defaults to <tt>'Previous Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    prevText : 'Previous Page',
+    /**
+     * @cfg {String} nextText
+     * The quicktip text displayed for the next page button (defaults to <tt>'Next Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    nextText : 'Next Page',
+    /**
+     * @cfg {String} lastText
+     * The quicktip text displayed for the last page button (defaults to <tt>'Last Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    lastText : 'Last Page',
+    /**
+     * @cfg {String} refreshText
+     * The quicktip text displayed for the Refresh button (defaults to <tt>'Refresh'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    refreshText : 'Refresh',
+
+    /**
+     * <p><b>Deprecated</b>. <code>paramNames</code> should be set in the <b>data store</b>
+     * (see {@link Ext.data.Store#paramNames}).</p>
+     * <br><p>Object mapping of parameter names used for load calls, initially set to:</p>
+     * <pre>{start: 'start', limit: 'limit'}</pre>
+     * @type Object
+     * @property paramNames
+     * @deprecated
+     */
+
+    /**
+     * The number of records to display per page.  See also <tt>{@link #cursor}</tt>.
+     * @type Number
+     * @property pageSize
+     */
+
+    /**
+     * Indicator for the record position.  This property might be used to get the active page
+     * number for example:<pre><code>
+     * // t is reference to the paging toolbar instance
+     * var activePage = Math.ceil((t.cursor + t.pageSize) / t.pageSize);
+     * </code></pre>
+     * @type Number
+     * @property cursor
+     */
+
+    initComponent : function(){
+        var pagingItems = [this.first = new T.Button({
+            tooltip: this.firstText,
+            overflowText: this.firstText,
+            iconCls: 'x-tbar-page-first',
+            disabled: true,
+            handler: this.moveFirst,
+            scope: this
+        }), this.prev = new T.Button({
+            tooltip: this.prevText,
+            overflowText: this.prevText,
+            iconCls: 'x-tbar-page-prev',
+            disabled: true,
+            handler: this.movePrevious,
+            scope: this
+        }), '-', this.beforePageText,
+        this.inputItem = new Ext.form.NumberField({
+            cls: 'x-tbar-page-number',
+            allowDecimals: false,
+            allowNegative: false,
+            enableKeyEvents: true,
+            selectOnFocus: true,
+            submitValue: false,
+            listeners: {
+                scope: this,
+                keydown: this.onPagingKeyDown,
+                blur: this.onPagingBlur
+            }
+        }), this.afterTextItem = new T.TextItem({
+            text: String.format(this.afterPageText, 1)
+        }), '-', this.next = new T.Button({
+            tooltip: this.nextText,
+            overflowText: this.nextText,
+            iconCls: 'x-tbar-page-next',
+            disabled: true,
+            handler: this.moveNext,
+            scope: this
+        }), this.last = new T.Button({
+            tooltip: this.lastText,
+            overflowText: this.lastText,
+            iconCls: 'x-tbar-page-last',
+            disabled: true,
+            handler: this.moveLast,
+            scope: this
+        }), '-', this.refresh = new T.Button({
+            tooltip: this.refreshText,
+            overflowText: this.refreshText,
+            iconCls: 'x-tbar-loading',
+            handler: this.doRefresh,
+            scope: this
+        })];
+
+
+        var userItems = this.items || this.buttons || [];
+        if (this.prependButtons) {
+            this.items = userItems.concat(pagingItems);
+        }else{
+            this.items = pagingItems.concat(userItems);
+        }
+        delete this.buttons;
+        if(this.displayInfo){
+            this.items.push('->');
+            this.items.push(this.displayItem = new T.TextItem({}));
+        }
+        Ext.PagingToolbar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the active page has been changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} pageData An object that has these properties:<ul>
+             * <li><code>total</code> : Number <div class="sub-desc">The total number of records in the dataset as
+             * returned by the server</div></li>
+             * <li><code>activePage</code> : Number <div class="sub-desc">The current page number</div></li>
+             * <li><code>pages</code> : Number <div class="sub-desc">The total number of pages (calculated from
+             * the total number of records in the dataset as returned by the server and the current {@link #pageSize})</div></li>
+             * </ul>
+             */
+            'change',
+            /**
+             * @event beforechange
+             * Fires just before the active page is changed.
+             * Return false to prevent the active page from being changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} params An object hash of the parameters which the PagingToolbar will send when
+             * loading the required page. This will contain:<ul>
+             * <li><code>start</code> : Number <div class="sub-desc">The starting row number for the next page of records to
+             * be retrieved from the server</div></li>
+             * <li><code>limit</code> : Number <div class="sub-desc">The number of records to be retrieved from the server</div></li>
+             * </ul>
+             * <p>(note: the names of the <b>start</b> and <b>limit</b> properties are determined
+             * by the store's {@link Ext.data.Store#paramNames paramNames} property.)</p>
+             * <p>Parameters may be added as required in the event handler.</p>
+             */
+            'beforechange'
+        );
+        this.on('afterlayout', this.onFirstLayout, this, {single: true});
+        this.cursor = 0;
+        this.bindStore(this.store, true);
+    },
+
+    // private
+    onFirstLayout : function(){
+        if(this.dsLoaded){
+            this.onLoad.apply(this, this.dsLoaded);
+        }
+    },
+
+    // private
+    updateInfo : function(){
+        if(this.displayItem){
+            var count = this.store.getCount();
+            var msg = count == 0 ?
+                this.emptyMsg :
+                String.format(
+                    this.displayMsg,
+                    this.cursor+1, this.cursor+count, this.store.getTotalCount()
+                );
+            this.displayItem.setText(msg);
+        }
+    },
+
+    // private
+    onLoad : function(store, r, o){
+        if(!this.rendered){
+            this.dsLoaded = [store, r, o];
+            return;
+        }
+        var p = this.getParams();
+        this.cursor = (o.params && o.params[p.start]) ? o.params[p.start] : 0;
+        var d = this.getPageData(), ap = d.activePage, ps = d.pages;
+
+        this.afterTextItem.setText(String.format(this.afterPageText, d.pages));
+        this.inputItem.setValue(ap);
+        this.first.setDisabled(ap == 1);
+        this.prev.setDisabled(ap == 1);
+        this.next.setDisabled(ap == ps);
+        this.last.setDisabled(ap == ps);
+        this.refresh.enable();
+        this.updateInfo();
+        this.fireEvent('change', this, d);
+    },
+
+    // private
+    getPageData : function(){
+        var total = this.store.getTotalCount();
+        return {
+            total : total,
+            activePage : Math.ceil((this.cursor+this.pageSize)/this.pageSize),
+            pages :  total < this.pageSize ? 1 : Math.ceil(total/this.pageSize)
+        };
+    },
+
+    /**
+     * Change the active page
+     * @param {Integer} page The page to display
+     */
+    changePage : function(page){
+        this.doLoad(((page-1) * this.pageSize).constrain(0, this.store.getTotalCount()));
+    },
+
+    // private
+    onLoadError : function(){
+        if(!this.rendered){
+            return;
+        }
+        this.refresh.enable();
+    },
+
+    // private
+    readPage : function(d){
+        var v = this.inputItem.getValue(), pageNum;
+        if (!v || isNaN(pageNum = parseInt(v, 10))) {
+            this.inputItem.setValue(d.activePage);
+            return false;
+        }
+        return pageNum;
+    },
+
+    onPagingFocus : function(){
+        this.inputItem.select();
+    },
+
+    //private
+    onPagingBlur : function(e){
+        this.inputItem.setValue(this.getPageData().activePage);
+    },
+
+    // private
+    onPagingKeyDown : function(field, e){
+        var k = e.getKey(), d = this.getPageData(), pageNum;
+        if (k == e.RETURN) {
+            e.stopEvent();
+            pageNum = this.readPage(d);
+            if(pageNum !== false){
+                pageNum = Math.min(Math.max(1, pageNum), d.pages) - 1;
+                this.doLoad(pageNum * this.pageSize);
+            }
+        }else if (k == e.HOME || k == e.END){
+            e.stopEvent();
+            pageNum = k == e.HOME ? 1 : d.pages;
+            field.setValue(pageNum);
+        }else if (k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){
+            e.stopEvent();
+            if((pageNum = this.readPage(d))){
+                var increment = e.shiftKey ? 10 : 1;
+                if(k == e.DOWN || k == e.PAGEDOWN){
+                    increment *= -1;
+                }
+                pageNum += increment;
+                if(pageNum >= 1 & pageNum <= d.pages){
+                    field.setValue(pageNum);
+                }
+            }
+        }
+    },
+
+    // private
+    getParams : function(){
+        //retain backwards compat, allow params on the toolbar itself, if they exist.
+        return this.paramNames || this.store.paramNames;
+    },
+
+    // private
+    beforeLoad : function(){
+        if(this.rendered && this.refresh){
+            this.refresh.disable();
+        }
+    },
+
+    // private
+    doLoad : function(start){
+        var o = {}, pn = this.getParams();
+        o[pn.start] = start;
+        o[pn.limit] = this.pageSize;
+        if(this.fireEvent('beforechange', this, o) !== false){
+            this.store.load({params:o});
+        }
+    },
+
+    /**
+     * Move to the first page, has the same effect as clicking the 'first' button.
+     */
+    moveFirst : function(){
+        this.doLoad(0);
+    },
+
+    /**
+     * Move to the previous page, has the same effect as clicking the 'previous' button.
+     */
+    movePrevious : function(){
+        this.doLoad(Math.max(0, this.cursor-this.pageSize));
+    },
+
+    /**
+     * Move to the next page, has the same effect as clicking the 'next' button.
+     */
+    moveNext : function(){
+        this.doLoad(this.cursor+this.pageSize);
+    },
+
+    /**
+     * Move to the last page, has the same effect as clicking the 'last' button.
+     */
+    moveLast : function(){
+        var total = this.store.getTotalCount(),
+            extra = total % this.pageSize;
+
+        this.doLoad(extra ? (total - extra) : total - this.pageSize);
+    },
+
+    /**
+     * Refresh the current page, has the same effect as clicking the 'refresh' button.
+     */
+    doRefresh : function(){
+        this.doLoad(this.cursor);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store}
+     * @param {Store} store The store to bind to this toolbar
+     * @param {Boolean} initial (Optional) true to not remove listeners
+     */
+    bindStore : function(store, initial){
+        var doLoad;
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.beforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.onLoadError, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.beforeLoad,
+                load: this.onLoad,
+                exception: this.onLoadError
+            });
+            doLoad = true;
+        }
+        this.store = store;
+        if(doLoad){
+            this.onLoad(store, null, {});
+        }
+    },
+
+    /**
+     * Unbinds the paging toolbar from the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to unbind
+     */
+    unbind : function(store){
+        this.bindStore(null);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to bind
+     */
+    bind : function(store){
+        this.bindStore(store);
+    },
+
+    // private
+    onDestroy : function(){
+        this.bindStore(null);
+        Ext.PagingToolbar.superclass.onDestroy.call(this);
+    }
+});
+
+})();
+Ext.reg('paging', Ext.PagingToolbar);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-foundation-debug.js	(revision 76)
@@ -0,0 +1,8044 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext
+ */
+
+Ext.ns("Ext.grid", "Ext.list", "Ext.dd", "Ext.tree", "Ext.form", "Ext.menu",
+       "Ext.state", "Ext.layout.boxOverflow", "Ext.app", "Ext.ux", "Ext.chart", "Ext.direct", "Ext.slider");
+    /**
+     * Namespace alloted for extensions to the framework.
+     * @property ux
+     * @type Object
+     */
+
+Ext.apply(Ext, function(){
+    var E = Ext,
+        idSeed = 0,
+        scrollWidth = null;
+
+    return {
+        /**
+        * A reusable empty function
+        * @property
+        * @type Function
+        */
+        emptyFn : function(){},
+
+        /**
+         * URL to a 1x1 transparent gif image used by Ext to create inline icons with CSS background images.
+         * In older versions of IE, this defaults to "http://extjs.com/s.gif" and you should change this to a URL on your server.
+         * For other browsers it uses an inline data URL.
+         * @type String
+         */
+        BLANK_IMAGE_URL : Ext.isIE6 || Ext.isIE7 || Ext.isAir ?
+                            'http:/' + '/www.extjs.com/s.gif' :
+                            'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
+
+        extendX : function(supr, fn){
+            return Ext.extend(supr, fn(supr.prototype));
+        },
+
+        /**
+         * Returns the current HTML document object as an {@link Ext.Element}.
+         * @return Ext.Element The document
+         */
+        getDoc : function(){
+            return Ext.get(document);
+        },
+
+        /**
+         * Utility method for validating that a value is numeric, returning the specified default value if it is not.
+         * @param {Mixed} value Should be a number, but any type will be handled appropriately
+         * @param {Number} defaultValue The value to return if the original value is non-numeric
+         * @return {Number} Value, if numeric, else defaultValue
+         */
+        num : function(v, defaultValue){
+            v = Number(Ext.isEmpty(v) || Ext.isArray(v) || typeof v == 'boolean' || (typeof v == 'string' && v.trim().length == 0) ? NaN : v);
+            return isNaN(v) ? defaultValue : v;
+        },
+
+        /**
+         * <p>Utility method for returning a default value if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Mixed} defaultValue The value to return if the original value is empty
+         * @param {Boolean} allowBlank (optional) true to allow zero length strings to qualify as non-empty (defaults to false)
+         * @return {Mixed} value, if non-empty, else defaultValue
+         */
+        value : function(v, defaultValue, allowBlank){
+            return Ext.isEmpty(v, allowBlank) ? defaultValue : v;
+        },
+
+        /**
+         * Escapes the passed string for use in a regular expression
+         * @param {String} str
+         * @return {String}
+         */
+        escapeRe : function(s) {
+            return s.replace(/([-.*+?^${}()|[\]\/\\])/g, "\\$1");
+        },
+
+        sequence : function(o, name, fn, scope){
+            o[name] = o[name].createSequence(fn, scope);
+        },
+
+        /**
+         * Applies event listeners to elements by selectors when the document is ready.
+         * The event name is specified with an <tt>&#64;</tt> suffix.
+         * <pre><code>
+Ext.addBehaviors({
+    // add a listener for click on all anchors in element with id foo
+    '#foo a&#64;click' : function(e, t){
+        // do something
+    },
+
+    // add the same listener to multiple selectors (separated by comma BEFORE the &#64;)
+    '#foo a, #bar span.some-class&#64;mouseover' : function(){
+        // do something
+    }
+});
+         * </code></pre>
+         * @param {Object} obj The list of behaviors to apply
+         */
+        addBehaviors : function(o){
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.addBehaviors(o);
+                });
+            } else {
+                var cache = {}, // simple cache for applying multiple behaviors to same selector does query multiple times
+                    parts,
+                    b,
+                    s;
+                for (b in o) {
+                    if ((parts = b.split('@'))[1]) { // for Object prototype breakers
+                        s = parts[0];
+                        if(!cache[s]){
+                            cache[s] = Ext.select(s);
+                        }
+                        cache[s].on(parts[1], o[b]);
+                    }
+                }
+                cache = null;
+            }
+        },
+
+        /**
+         * Utility method for getting the width of the browser scrollbar. This can differ depending on
+         * operating system settings, such as the theme or font size.
+         * @param {Boolean} force (optional) true to force a recalculation of the value.
+         * @return {Number} The width of the scrollbar.
+         */
+        getScrollBarWidth: function(force){
+            if(!Ext.isReady){
+                return 0;
+            }
+
+            if(force === true || scrollWidth === null){
+                    // Append our div, do our calculation and then remove it
+                var div = Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),
+                    child = div.child('div', true);
+                var w1 = child.offsetWidth;
+                div.setStyle('overflow', (Ext.isWebKit || Ext.isGecko) ? 'auto' : 'scroll');
+                var w2 = child.offsetWidth;
+                div.remove();
+                // Need to add 2 to ensure we leave enough space
+                scrollWidth = w1 - w2 + 2;
+            }
+            return scrollWidth;
+        },
+
+
+        // deprecated
+        combine : function(){
+            var as = arguments, l = as.length, r = [];
+            for(var i = 0; i < l; i++){
+                var a = as[i];
+                if(Ext.isArray(a)){
+                    r = r.concat(a);
+                }else if(a.length !== undefined && !a.substr){
+                    r = r.concat(Array.prototype.slice.call(a, 0));
+                }else{
+                    r.push(a);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Copies a set of named properties fom the source object to the destination object.
+         * <p>example:<pre><code>
+ImageComponent = Ext.extend(Ext.BoxComponent, {
+    initComponent: function() {
+        this.autoEl = { tag: 'img' };
+        MyComponent.superclass.initComponent.apply(this, arguments);
+        this.initialBox = Ext.copyTo({}, this.initialConfig, 'x,y,width,height');
+    }
+});
+         * </code></pre>
+         * @param {Object} dest The destination object.
+         * @param {Object} source The source object.
+         * @param {Array/String} names Either an Array of property names, or a comma-delimited list
+         * of property names to copy.
+         * @return {Object} The modified object.
+        */
+        copyTo : function(dest, source, names){
+            if(typeof names == 'string'){
+                names = names.split(/[,;\s]/);
+            }
+            Ext.each(names, function(name){
+                if(source.hasOwnProperty(name)){
+                    dest[name] = source[name];
+                }
+            }, this);
+            return dest;
+        },
+
+        /**
+         * Attempts to destroy any objects passed to it by removing all event listeners, removing them from the
+         * DOM (if applicable) and calling their destroy functions (if available).  This method is primarily
+         * intended for arguments of type {@link Ext.Element} and {@link Ext.Component}, but any subclass of
+         * {@link Ext.util.Observable} can be passed in.  Any number of elements and/or components can be
+         * passed into this function in a single call as separate arguments.
+         * @param {Mixed} arg1 An {@link Ext.Element}, {@link Ext.Component}, or an Array of either of these to destroy
+         * @param {Mixed} arg2 (optional)
+         * @param {Mixed} etc... (optional)
+         */
+        destroy : function(){
+            Ext.each(arguments, function(arg){
+                if(arg){
+                    if(Ext.isArray(arg)){
+                        this.destroy.apply(this, arg);
+                    }else if(typeof arg.destroy == 'function'){
+                        arg.destroy();
+                    }else if(arg.dom){
+                        arg.remove();
+                    }
+                }
+            }, this);
+        },
+
+        /**
+         * Attempts to destroy and then remove a set of named properties of the passed object.
+         * @param {Object} o The object (most likely a Component) who's properties you wish to destroy.
+         * @param {Mixed} arg1 The name of the property to destroy and remove from the object.
+         * @param {Mixed} etc... More property names to destroy and remove.
+         */
+        destroyMembers : function(o, arg1, arg2, etc){
+            for(var i = 1, a = arguments, len = a.length; i < len; i++) {
+                Ext.destroy(o[a[i]]);
+                delete o[a[i]];
+            }
+        },
+
+        /**
+         * Creates a copy of the passed Array with falsy values removed.
+         * @param {Array/NodeList} arr The Array from which to remove falsy values.
+         * @return {Array} The new, compressed Array.
+         */
+        clean : function(arr){
+            var ret = [];
+            Ext.each(arr, function(v){
+                if(!!v){
+                    ret.push(v);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Creates a copy of the passed Array, filtered to contain only unique values.
+         * @param {Array} arr The Array to filter
+         * @return {Array} The new Array containing unique values.
+         */
+        unique : function(arr){
+            var ret = [],
+                collect = {};
+
+            Ext.each(arr, function(v) {
+                if(!collect[v]){
+                    ret.push(v);
+                }
+                collect[v] = true;
+            });
+            return ret;
+        },
+
+        /**
+         * Recursively flattens into 1-d Array. Injects Arrays inline.
+         * @param {Array} arr The array to flatten
+         * @return {Array} The new, flattened array.
+         */
+        flatten : function(arr){
+            var worker = [];
+            function rFlatten(a) {
+                Ext.each(a, function(v) {
+                    if(Ext.isArray(v)){
+                        rFlatten(v);
+                    }else{
+                        worker.push(v);
+                    }
+                });
+                return worker;
+            }
+            return rFlatten(arr);
+        },
+
+        /**
+         * Returns the minimum value in the Array.
+         * @param {Array|NodeList} arr The Array from which to select the minimum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines minimization.
+         *                   If omitted the "<" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The minimum value in the Array.
+         */
+        min : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a < b ? -1 : 1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == -1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Returns the maximum value in the Array
+         * @param {Array|NodeList} arr The Array from which to select the maximum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines maximization.
+         *                   If omitted the ">" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The maximum value in the Array.
+         */
+        max : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a > b ? 1 : -1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == 1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Calculates the mean of the Array
+         * @param {Array} arr The Array to calculate the mean value of.
+         * @return {Number} The mean.
+         */
+        mean : function(arr){
+           return arr.length > 0 ? Ext.sum(arr) / arr.length : undefined;
+        },
+
+        /**
+         * Calculates the sum of the Array
+         * @param {Array} arr The Array to calculate the sum value of.
+         * @return {Number} The sum.
+         */
+        sum : function(arr){
+           var ret = 0;
+           Ext.each(arr, function(v) {
+               ret += v;
+           });
+           return ret;
+        },
+
+        /**
+         * Partitions the set into two sets: a true set and a false set.
+         * Example:
+         * Example2:
+         * <pre><code>
+// Example 1:
+Ext.partition([true, false, true, true, false]); // [[true, true, true], [false, false]]
+
+// Example 2:
+Ext.partition(
+    Ext.query("p"),
+    function(val){
+        return val.className == "class1"
+    }
+);
+// true are those paragraph elements with a className of "class1",
+// false set are those that do not have that className.
+         * </code></pre>
+         * @param {Array|NodeList} arr The array to partition
+         * @param {Function} truth (optional) a function to determine truth.  If this is omitted the element
+         *                   itself must be able to be evaluated for its truthfulness.
+         * @return {Array} [true<Array>,false<Array>]
+         */
+        partition : function(arr, truth){
+            var ret = [[],[]];
+            Ext.each(arr, function(v, i, a) {
+                ret[ (truth && truth(v, i, a)) || (!truth && v) ? 0 : 1].push(v);
+            });
+            return ret;
+        },
+
+        /**
+         * Invokes a method on each item in an Array.
+         * <pre><code>
+// Example:
+Ext.invoke(Ext.query("p"), "getAttribute", "id");
+// [el1.getAttribute("id"), el2.getAttribute("id"), ..., elN.getAttribute("id")]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to invoke the method on.
+         * @param {String} methodName The method name to invoke.
+         * @param {...*} args Arguments to send into the method invocation.
+         * @return {Array} The results of invoking the method on each item in the array.
+         */
+        invoke : function(arr, methodName){
+            var ret = [],
+                args = Array.prototype.slice.call(arguments, 2);
+            Ext.each(arr, function(v,i) {
+                if (v && typeof v[methodName] == 'function') {
+                    ret.push(v[methodName].apply(v, args));
+                } else {
+                    ret.push(undefined);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Plucks the value of a property from each item in the Array
+         * <pre><code>
+// Example:
+Ext.pluck(Ext.query("p"), "className"); // [el1.className, el2.className, ..., elN.className]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to pluck the value from.
+         * @param {String} prop The property name to pluck from each element.
+         * @return {Array} The value from each item in the Array.
+         */
+        pluck : function(arr, prop){
+            var ret = [];
+            Ext.each(arr, function(v) {
+                ret.push( v[prop] );
+            });
+            return ret;
+        },
+
+        /**
+         * <p>Zips N sets together.</p>
+         * <pre><code>
+// Example 1:
+Ext.zip([1,2,3],[4,5,6]); // [[1,4],[2,5],[3,6]]
+// Example 2:
+Ext.zip(
+    [ "+", "-", "+"],
+    [  12,  10,  22],
+    [  43,  15,  96],
+    function(a, b, c){
+        return "$" + a + "" + b + "." + c
+    }
+); // ["$+12.43", "$-10.15", "$+22.96"]
+         * </code></pre>
+         * @param {Arrays|NodeLists} arr This argument may be repeated. Array(s) to contribute values.
+         * @param {Function} zipper (optional) The last item in the argument list. This will drive how the items are zipped together.
+         * @return {Array} The zipped set.
+         */
+        zip : function(){
+            var parts = Ext.partition(arguments, function( val ){ return typeof val != 'function'; }),
+                arrs = parts[0],
+                fn = parts[1][0],
+                len = Ext.max(Ext.pluck(arrs, "length")),
+                ret = [];
+
+            for (var i = 0; i < len; i++) {
+                ret[i] = [];
+                if(fn){
+                    ret[i] = fn.apply(fn, Ext.pluck(arrs, i));
+                }else{
+                    for (var j = 0, aLen = arrs.length; j < aLen; j++){
+                        ret[i].push( arrs[j][i] );
+                    }
+                }
+            }
+            return ret;
+        },
+
+        /**
+         * This is shorthand reference to {@link Ext.ComponentMgr#get}.
+         * Looks up an existing {@link Ext.Component Component} by {@link Ext.Component#id id}
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <tt>undefined</tt> if not found, or <tt>null</tt> if a
+         * Class was found.
+        */
+        getCmp : function(id){
+            return Ext.ComponentMgr.get(id);
+        },
+
+        /**
+         * By default, Ext intelligently decides whether floating elements should be shimmed. If you are using flash,
+         * you may want to set this to true.
+         * @type Boolean
+         */
+        useShims: E.isIE6 || (E.isMac && E.isGecko2),
+
+        // inpired by a similar function in mootools library
+        /**
+         * Returns the type of object that is passed in. If the object passed in is null or undefined it
+         * return false otherwise it returns one of the following values:<div class="mdetail-params"><ul>
+         * <li><b>string</b>: If the object passed is a string</li>
+         * <li><b>number</b>: If the object passed is a number</li>
+         * <li><b>boolean</b>: If the object passed is a boolean value</li>
+         * <li><b>date</b>: If the object passed is a Date object</li>
+         * <li><b>function</b>: If the object passed is a function reference</li>
+         * <li><b>object</b>: If the object passed is an object</li>
+         * <li><b>array</b>: If the object passed is an array</li>
+         * <li><b>regexp</b>: If the object passed is a regular expression</li>
+         * <li><b>element</b>: If the object passed is a DOM Element</li>
+         * <li><b>nodelist</b>: If the object passed is a DOM NodeList</li>
+         * <li><b>textnode</b>: If the object passed is a DOM text node and contains something other than whitespace</li>
+         * <li><b>whitespace</b>: If the object passed is a DOM text node and contains only whitespace</li>
+         * </ul></div>
+         * @param {Mixed} object
+         * @return {String}
+         */
+        type : function(o){
+            if(o === undefined || o === null){
+                return false;
+            }
+            if(o.htmlElement){
+                return 'element';
+            }
+            var t = typeof o;
+            if(t == 'object' && o.nodeName) {
+                switch(o.nodeType) {
+                    case 1: return 'element';
+                    case 3: return (/\S/).test(o.nodeValue) ? 'textnode' : 'whitespace';
+                }
+            }
+            if(t == 'object' || t == 'function') {
+                switch(o.constructor) {
+                    case Array: return 'array';
+                    case RegExp: return 'regexp';
+                    case Date: return 'date';
+                }
+                if(typeof o.length == 'number' && typeof o.item == 'function') {
+                    return 'nodelist';
+                }
+            }
+            return t;
+        },
+
+        intercept : function(o, name, fn, scope){
+            o[name] = o[name].createInterceptor(fn, scope);
+        },
+
+        // internal
+        callback : function(cb, scope, args, delay){
+            if(typeof cb == 'function'){
+                if(delay){
+                    cb.defer(delay, scope, args || []);
+                }else{
+                    cb.apply(scope, args || []);
+                }
+            }
+        }
+    };
+}());
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = sayHi.createSequence(function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+</code></pre>
+     * @param {Function} fcn The function to sequence
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createSequence : function(fcn, scope){
+        var method = this;
+        return (typeof fcn != 'function') ?
+                this :
+                function(){
+                    var retval = method.apply(this || window, arguments);
+                    fcn.apply(scope || this || window, arguments);
+                    return retval;
+                };
+    }
+});
+
+
+/**
+ * @class String
+ * These functions are available as static methods on the JavaScript String object.
+ */
+Ext.applyIf(String, {
+
+    /**
+     * Escapes the passed string for ' and \
+     * @param {String} string The string to escape
+     * @return {String} The escaped string
+     * @static
+     */
+    escape : function(string) {
+        return string.replace(/('|\\)/g, "\\$1");
+    },
+
+    /**
+     * Pads the left side of a string with a specified character.  This is especially useful
+     * for normalizing number and date strings.  Example usage:
+     * <pre><code>
+var s = String.leftPad('123', 5, '0');
+// s now contains the string: '00123'
+     * </code></pre>
+     * @param {String} string The original string
+     * @param {Number} size The total length of the output string
+     * @param {String} char (optional) The character with which to pad the original string (defaults to empty string " ")
+     * @return {String} The padded string
+     * @static
+     */
+    leftPad : function (val, size, ch) {
+        var result = String(val);
+        if(!ch) {
+            ch = " ";
+        }
+        while (result.length < size) {
+            result = ch + result;
+        }
+        return result;
+    }
+});
+
+/**
+ * Utility function that allows you to easily switch a string between two alternating values.  The passed value
+ * is compared to the current string, and if they are equal, the other value that was passed in is returned.  If
+ * they are already different, the first value passed in is returned.  Note that this method returns the new value
+ * but does not change the current string.
+ * <pre><code>
+// alternate sort directions
+sort = sort.toggle('ASC', 'DESC');
+
+// instead of conditional logic:
+sort = (sort == 'ASC' ? 'DESC' : 'ASC');
+</code></pre>
+ * @param {String} value The value to compare to the current string
+ * @param {String} other The new value to use if the string already equals the first value passed in
+ * @return {String} The new value
+ */
+String.prototype.toggle = function(value, other){
+    return this == value ? other : value;
+};
+
+/**
+ * Trims whitespace from either end of a string, leaving spaces within the string intact.  Example:
+ * <pre><code>
+var s = '  foo bar  ';
+alert('-' + s + '-');         //alerts "- foo bar -"
+alert('-' + s.trim() + '-');  //alerts "-foo bar-"
+</code></pre>
+ * @return {String} The trimmed string
+ */
+String.prototype.trim = function(){
+    var re = /^\s+|\s+$/g;
+    return function(){ return this.replace(re, ""); };
+}();
+
+// here to prevent dependency on Date.js
+/**
+ Returns the number of milliseconds between this date and date
+ @param {Date} date (optional) Defaults to now
+ @return {Number} The diff in milliseconds
+ @member Date getElapsed
+ */
+Date.prototype.getElapsed = function(date) {
+    return Math.abs((date || new Date()).getTime()-this.getTime());
+};
+
+
+/**
+ * @class Number
+ */
+Ext.applyIf(Number.prototype, {
+    /**
+     * Checks whether or not the current number is within a desired range.  If the number is already within the
+     * range it is returned, otherwise the min or max value is returned depending on which side of the range is
+     * exceeded.  Note that this method returns the constrained value but does not change the current number.
+     * @param {Number} min The minimum number in the range
+     * @param {Number} max The maximum number in the range
+     * @return {Number} The constrained value if outside the range, otherwise the current value
+     */
+    constrain : function(min, max){
+        return Math.min(Math.max(this, min), max);
+    }
+});
+Ext.lib.Dom.getRegion = function(el) {
+    return Ext.lib.Region.getRegion(el);
+};	Ext.lib.Region = function(t, r, b, l) {
+		var me = this;
+        me.top = t;
+        me[1] = t;
+        me.right = r;
+        me.bottom = b;
+        me.left = l;
+        me[0] = l;
+    };
+
+    Ext.lib.Region.prototype = {
+        contains : function(region) {
+	        var me = this;
+            return ( region.left >= me.left &&
+                     region.right <= me.right &&
+                     region.top >= me.top &&
+                     region.bottom <= me.bottom );
+
+        },
+
+        getArea : function() {
+	        var me = this;
+            return ( (me.bottom - me.top) * (me.right - me.left) );
+        },
+
+        intersect : function(region) {
+            var me = this,
+            	t = Math.max(me.top, region.top),
+            	r = Math.min(me.right, region.right),
+            	b = Math.min(me.bottom, region.bottom),
+            	l = Math.max(me.left, region.left);
+
+            if (b >= t && r >= l) {
+                return new Ext.lib.Region(t, r, b, l);
+            }
+        },
+        
+        union : function(region) {
+	        var me = this,
+            	t = Math.min(me.top, region.top),
+            	r = Math.max(me.right, region.right),
+            	b = Math.max(me.bottom, region.bottom),
+            	l = Math.min(me.left, region.left);
+
+            return new Ext.lib.Region(t, r, b, l);
+        },
+
+        constrainTo : function(r) {
+	        var me = this;
+            me.top = me.top.constrain(r.top, r.bottom);
+            me.bottom = me.bottom.constrain(r.top, r.bottom);
+            me.left = me.left.constrain(r.left, r.right);
+            me.right = me.right.constrain(r.left, r.right);
+            return me;
+        },
+
+        adjust : function(t, l, b, r) {
+	        var me = this;
+            me.top += t;
+            me.left += l;
+            me.right += r;
+            me.bottom += b;
+            return me;
+        }
+    };
+
+    Ext.lib.Region.getRegion = function(el) {
+        var p = Ext.lib.Dom.getXY(el),
+        	t = p[1],
+        	r = p[0] + el.offsetWidth,
+        	b = p[1] + el.offsetHeight,
+        	l = p[0];
+
+        return new Ext.lib.Region(t, r, b, l);
+    };	Ext.lib.Point = function(x, y) {
+        if (Ext.isArray(x)) {
+            y = x[1];
+            x = x[0];
+        }
+        var me = this;
+        me.x = me.right = me.left = me[0] = x;
+        me.y = me.top = me.bottom = me[1] = y;
+    };
+
+    Ext.lib.Point.prototype = new Ext.lib.Region();
+/**
+ * @class Ext.DomHelper
+ */
+Ext.apply(Ext.DomHelper,
+function(){
+    var pub,
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        confRe = /tag|children|cn|html$/i;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        el = Ext.getDom(el);
+        var newNode;
+        if (pub.useDom) {
+            newNode = createDom(o, null);
+            if (append) {
+                el.appendChild(newNode);
+            } else {
+                (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
+            }
+        } else {
+            newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
+        }
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as dom
+    /** @ignore */
+    function createDom(o, parentNode){
+        var el,
+            doc = document,
+            useSet,
+            attr,
+            val,
+            cn;
+
+        if (Ext.isArray(o)) {                       // Allow Arrays of siblings to be inserted
+            el = doc.createDocumentFragment(); // in one shot using a DocumentFragment
+            for (var i = 0, l = o.length; i < l; i++) {
+                createDom(o[i], el);
+            }
+        } else if (typeof o == 'string') {         // Allow a string as a child spec.
+            el = doc.createTextNode(o);
+        } else {
+            el = doc.createElement( o.tag || 'div' );
+            useSet = !!el.setAttribute; // In IE some elements don't have setAttribute
+            for (var attr in o) {
+                if(!confRe.test(attr)){
+                    val = o[attr];
+                    if(attr == 'cls'){
+                        el.className = val;
+                    }else{
+                        if(useSet){
+                            el.setAttribute(attr, val);
+                        }else{
+                            el[attr] = val;
+                        }
+                    }
+                }
+            }
+            Ext.DomHelper.applyStyles(el, o.style);
+
+            if ((cn = o.children || o.cn)) {
+                createDom(cn, el);
+            } else if (o.html) {
+                el.innerHTML = o.html;
+            }
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    }
+
+    pub = {
+        /**
+         * Creates a new Ext.Template from the DOM object spec.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {Ext.Template} The new template
+         */
+        createTemplate : function(o){
+            var html = Ext.DomHelper.createHtml(o);
+            return new Ext.Template(html);
+        },
+
+        /** True to force the use of DOM instead of html fragments @type Boolean */
+        useDom : false,
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        append: function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) without inserting them to the document.
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @return {HTMLElement} The new uninserted node
+         */
+        createDom: createDom
+    };
+    return pub;
+}());
+/**
+ * @class Ext.Template
+ */
+Ext.apply(Ext.Template.prototype, {
+    /**
+     * @cfg {Boolean} disableFormats Specify <tt>true</tt> to disable format
+     * functions in the template. If the template does not contain
+     * {@link Ext.util.Format format functions}, setting <code>disableFormats</code>
+     * to true will reduce <code>{@link #apply}</code> time. Defaults to <tt>false</tt>.
+     * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // reduce <code>{@link #apply}</code> time since no formatting
+    }
+);
+     * </code></pre>
+     * For a list of available format functions, see {@link Ext.util.Format}.
+     */
+    disableFormats : false,
+    /**
+     * See <code>{@link #disableFormats}</code>.
+     * @type Boolean
+     * @property disableFormats
+     */
+
+    /**
+     * The regular expression used to match template variables
+     * @type RegExp
+     * @property
+     * @hide repeat doc
+     */
+    re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
+    argsRe : /^\s*['"](.*)["']\s*$/,
+    compileARe : /\\/g,
+    compileBRe : /(\r\n|\n)/g,
+    compileCRe : /'/g,
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     * @hide repeat doc
+     */
+    applyTemplate : function(values){
+        var me = this,
+            useF = me.disableFormats !== true,
+            fm = Ext.util.Format,
+            tpl = me;
+
+        if(me.compiled){
+            return me.compiled(values);
+        }
+        function fn(m, name, format, args){
+            if (format && useF) {
+                if (format.substr(0, 5) == "this.") {
+                    return tpl.call(format.substr(5), values[name], values);
+                } else {
+                    if (args) {
+                        // quoted values are required for strings in compiled templates,
+                        // but for non compiled we need to strip them
+                        // quoted reversed for jsmin
+                        var re = me.argsRe;
+                        args = args.split(',');
+                        for(var i = 0, len = args.length; i < len; i++){
+                            args[i] = args[i].replace(re, "$1");
+                        }
+                        args = [values[name]].concat(args);
+                    } else {
+                        args = [values[name]];
+                    }
+                    return fm[format].apply(fm, args);
+                }
+            } else {
+                return values[name] !== undefined ? values[name] : "";
+            }
+        }
+        return me.html.replace(me.re, fn);
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     * @hide repeat doc
+     */
+    compile : function(){
+        var me = this,
+            fm = Ext.util.Format,
+            useF = me.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args){
+            if(format && useF){
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            }else{
+                args= ''; format = "(values['" + name + "'] == undefined ? '' : ";
+            }
+            return "'"+ sep + format + "values['" + name + "']" + args + ")"+sep+"'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "this.compiled = function(values){ return '" +
+                   me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn) +
+                    "';};";
+        }else{
+            body = ["this.compiled = function(values){ return ['"];
+            body.push(me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return me;
+    },
+
+    // private function used to call members
+    call : function(fnName, value, allValues){
+        return this[fnName](value, allValues);
+    }
+});
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+/**
+ * @class Ext.util.Functions
+ * @singleton
+ */
+Ext.util.Functions = {
+    /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = Ext.createInterceptor(sayHi, function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+       </code></pre>
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor: function(origFn, newFn, scope) { 
+        var method = origFn;
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var me = this,
+                    args = arguments;
+                newFn.target = me;
+                newFn.method = origFn;
+                return (newFn.apply(scope || me || window, args) !== false) ?
+                        origFn.apply(me || window, args) :
+                        null;
+            };
+        }
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>Ext.createDelegate(this.myFunction, this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', Ext.createDelegate(sayHi, btn, ['Fred']));
+       </code></pre>
+     * @param {Function} fn The function to delegate.
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate: function(fn, obj, args, appendArgs) {
+        if (!Ext.isFunction(fn)) {
+            return fn;
+        }
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }
+            else if (Ext.isNumber(appendArgs)) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args);
+                // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs);
+                // splice them in
+            }
+            return fn.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+Ext.defer(sayHi, 2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+Ext.defer(function(){
+    alert('Anonymous');
+}, 100);
+       </code></pre>
+     * @param {Function} fn The function to defer.
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer: function(fn, millis, obj, args, appendArgs) {
+        fn = Ext.util.Functions.createDelegate(fn, obj, args, appendArgs);
+        if (millis > 0) {
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    },
+
+
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * 
+
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = Ext.createSequence(sayHi, function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to sequence
+     * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+     * If omitted, defaults to the scope in which the original function is called or the browser window.
+     * @return {Function} The new function
+     */
+    createSequence: function(origFn, newFn, scope) {
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var retval = origFn.apply(this || window, arguments);
+                newFn.apply(scope || this || window, arguments);
+                return retval;
+            };
+        }
+    }
+};
+
+/**
+ * Shorthand for {@link Ext.util.Functions#defer}   
+ * @param {Function} fn The function to defer.
+ * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Number} The timeout id that can be used with clearTimeout
+ * @member Ext
+ * @method defer
+ */
+
+Ext.defer = Ext.util.Functions.defer;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createInterceptor}   
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to call before the original
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+ * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createInterceptor = Ext.util.Functions.createInterceptor;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createSequence}
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to sequence
+ * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+ * If omitted, defaults to the scope in which the original function is called or the browser window.
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createSequence = Ext.util.Functions.createSequence;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createDelegate}
+ * @param {Function} fn The function to delegate.
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+Ext.createDelegate = Ext.util.Functions.createDelegate;
+/**
+ * @class Ext.util.Observable
+ */
+Ext.apply(Ext.util.Observable.prototype, function(){
+    // this is considered experimental (along with beforeMethod, afterMethod, removeMethodListener?)
+    // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+    // private
+    function getMethodEvent(method){
+        var e = (this.methodEvents = this.methodEvents ||
+        {})[method], returnValue, v, cancel, obj = this;
+
+        if (!e) {
+            this.methodEvents[method] = e = {};
+            e.originalFn = this[method];
+            e.methodName = method;
+            e.before = [];
+            e.after = [];
+
+            var makeCall = function(fn, scope, args){
+                if((v = fn.apply(scope || obj, args)) !== undefined){
+                    if (typeof v == 'object') {
+                        if(v.returnValue !== undefined){
+                            returnValue = v.returnValue;
+                        }else{
+                            returnValue = v;
+                        }
+                        cancel = !!v.cancel;
+                    }
+                    else
+                        if (v === false) {
+                            cancel = true;
+                        }
+                        else {
+                            returnValue = v;
+                        }
+                }
+            };
+
+            this[method] = function(){
+                var args = Array.prototype.slice.call(arguments, 0),
+                    b;
+                returnValue = v = undefined;
+                cancel = false;
+
+                for(var i = 0, len = e.before.length; i < len; i++){
+                    b = e.before[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+
+                if((v = e.originalFn.apply(obj, args)) !== undefined){
+                    returnValue = v;
+                }
+
+                for(var i = 0, len = e.after.length; i < len; i++){
+                    b = e.after[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+                return returnValue;
+            };
+        }
+        return e;
+    }
+
+    return {
+        // these are considered experimental
+        // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+        // adds an 'interceptor' called before the original method
+        beforeMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).before.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        // adds a 'sequence' called after the original method
+        afterMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).after.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        removeMethodListener: function(method, fn, scope){
+            var e = this.getMethodEvent(method);
+            for(var i = 0, len = e.before.length; i < len; i++){
+                if(e.before[i].fn == fn && e.before[i].scope == scope){
+                    e.before.splice(i, 1);
+                    return;
+                }
+            }
+            for(var i = 0, len = e.after.length; i < len; i++){
+                if(e.after[i].fn == fn && e.after[i].scope == scope){
+                    e.after.splice(i, 1);
+                    return;
+                }
+            }
+        },
+
+        /**
+         * Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.
+         * @param {Object} o The Observable whose events this object is to relay.
+         * @param {Array} events Array of event names to relay.
+         */
+        relayEvents : function(o, events){
+            var me = this;
+            function createHandler(ename){
+                return function(){
+                    return me.fireEvent.apply(me, [ename].concat(Array.prototype.slice.call(arguments, 0)));
+                };
+            }
+            for(var i = 0, len = events.length; i < len; i++){
+                var ename = events[i];
+                me.events[ename] = me.events[ename] || true;
+                o.on(ename, createHandler(ename), me);
+            }
+        },
+
+        /**
+         * <p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
+         * <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
+         * <p>This is commonly used by Ext.Components to bubble events to owner Containers. See {@link Ext.Component.getBubbleTarget}. The default
+         * implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+         * access the required target more quickly.</p>
+         * <p>Example:</p><pre><code>
+Ext.override(Ext.form.Field, {
+    //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
+    initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
+        this.enableBubble('change');
+    }),
+
+    //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
+    getBubbleTarget : function() {
+        if (!this.formPanel) {
+            this.formPanel = this.findParentByType('form');
+        }
+        return this.formPanel;
+    }
+});
+
+var myForm = new Ext.formPanel({
+    title: 'User Details',
+    items: [{
+        ...
+    }],
+    listeners: {
+        change: function() {
+            // Title goes red if form has been modified.
+            myForm.header.setStyle('color', 'red');
+        }
+    }
+});
+</code></pre>
+         * @param {String/Array} events The event name to bubble, or an Array of event names.
+         */
+        enableBubble : function(events){
+            var me = this;
+            if(!Ext.isEmpty(events)){
+                events = Ext.isArray(events) ? events : Array.prototype.slice.call(arguments, 0);
+                for(var i = 0, len = events.length; i < len; i++){
+                    var ename = events[i];
+                    ename = ename.toLowerCase();
+                    var ce = me.events[ename] || true;
+                    if (typeof ce == 'boolean') {
+                        ce = new Ext.util.Event(me, ename);
+                        me.events[ename] = ce;
+                    }
+                    ce.bubble = true;
+                }
+            }
+        }
+    };
+}());
+
+
+/**
+ * Starts capture on the specified Observable. All events will be passed
+ * to the supplied function with the event name + standard signature of the event
+ * <b>before</b> the event is fired. If the supplied function returns false,
+ * the event will not fire.
+ * @param {Observable} o The Observable to capture events from.
+ * @param {Function} fn The function to call when an event is fired.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Observable firing the event.
+ * @static
+ */
+Ext.util.Observable.capture = function(o, fn, scope){
+    o.fireEvent = o.fireEvent.createInterceptor(fn, scope);
+};
+
+
+/**
+ * Sets observability on the passed class constructor.<p>
+ * <p>This makes any event fired on any instance of the passed class also fire a single event through
+ * the <i>class</i> allowing for central handling of events on many instances at once.</p>
+ * <p>Usage:</p><pre><code>
+Ext.util.Observable.observeClass(Ext.data.Connection);
+Ext.data.Connection.on('beforerequest', function(con, options) {
+    console.log('Ajax request made to ' + options.url);
+});</code></pre>
+ * @param {Function} c The class constructor to make observable.
+ * @param {Object} listeners An object containing a series of listeners to add. See {@link #addListener}.
+ * @static
+ */
+Ext.util.Observable.observeClass = function(c, listeners){
+    if(c){
+      if(!c.fireEvent){
+          Ext.apply(c, new Ext.util.Observable());
+          Ext.util.Observable.capture(c.prototype, c.fireEvent, c);
+      }
+      if(typeof listeners == 'object'){
+          c.on(listeners);
+      }
+      return c;
+   }
+};
+/**
+* @class Ext.EventManager
+*/
+Ext.apply(Ext.EventManager, function(){
+   var resizeEvent,
+       resizeTask,
+       textEvent,
+       textSize,
+       D = Ext.lib.Dom,
+       propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+       unload = Ext.EventManager._unload,
+       curWidth = 0,
+       curHeight = 0,
+       // note 1: IE fires ONLY the keydown event on specialkey autorepeat
+       // note 2: Safari < 3.1, Gecko (Mac/Linux) & Opera fire only the keypress event on specialkey autorepeat
+       // (research done by @Jan Wolter at http://unixpapa.com/js/key.html)
+       useKeydown = Ext.isWebKit ?
+                   Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1]) >= 525 :
+                   !((Ext.isGecko && !Ext.isWindows) || Ext.isOpera);
+
+   return {
+       _unload: function(){
+           Ext.EventManager.un(window, "resize", this.fireWindowResize, this);
+           unload.call(Ext.EventManager);    
+       },
+       
+       // private
+       doResizeEvent: function(){
+           var h = D.getViewHeight(),
+               w = D.getViewWidth();
+
+            //whacky problem in IE where the resize event will fire even though the w/h are the same.
+            if(curHeight != h || curWidth != w){
+               resizeEvent.fire(curWidth = w, curHeight = h);
+            }
+       },
+
+       /**
+        * Adds a listener to be notified when the browser window is resized and provides resize event buffering (100 milliseconds),
+        * passes new viewport width and height to handlers.
+        * @param {Function} fn      The handler function the window resize event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onWindowResize : function(fn, scope, options){
+           if(!resizeEvent){
+               resizeEvent = new Ext.util.Event();
+               resizeTask = new Ext.util.DelayedTask(this.doResizeEvent);
+               Ext.EventManager.on(window, "resize", this.fireWindowResize, this);
+           }
+           resizeEvent.addListener(fn, scope, options);
+       },
+
+       // exposed only to allow manual firing
+       fireWindowResize : function(){
+           if(resizeEvent){
+               resizeTask.delay(100);
+           }
+       },
+
+       /**
+        * Adds a listener to be notified when the user changes the active text size. Handler gets called with 2 params, the old size and the new size.
+        * @param {Function} fn      The function the event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onTextResize : function(fn, scope, options){
+           if(!textEvent){
+               textEvent = new Ext.util.Event();
+               var textEl = new Ext.Element(document.createElement('div'));
+               textEl.dom.className = 'x-text-resize';
+               textEl.dom.innerHTML = 'X';
+               textEl.appendTo(document.body);
+               textSize = textEl.dom.offsetHeight;
+               setInterval(function(){
+                   if(textEl.dom.offsetHeight != textSize){
+                       textEvent.fire(textSize, textSize = textEl.dom.offsetHeight);
+                   }
+               }, this.textResizeInterval);
+           }
+           textEvent.addListener(fn, scope, options);
+       },
+
+       /**
+        * Removes the passed window resize listener.
+        * @param {Function} fn        The method the event invokes
+        * @param {Object}   scope    The scope of handler
+        */
+       removeResizeListener : function(fn, scope){
+           if(resizeEvent){
+               resizeEvent.removeListener(fn, scope);
+           }
+       },
+
+       // private
+       fireResize : function(){
+           if(resizeEvent){
+               resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
+           }
+       },
+
+        /**
+        * The frequency, in milliseconds, to check for text resize events (defaults to 50)
+        */
+       textResizeInterval : 50,
+
+       /**
+        * Url used for onDocumentReady with using SSL (defaults to Ext.SSL_SECURE_URL)
+        */
+       ieDeferSrc : false,
+       
+       // protected, short accessor for useKeydown
+       getKeyEvent : function(){
+           return useKeydown ? 'keydown' : 'keypress';
+       },
+
+       // protected for use inside the framework
+       // detects whether we should use keydown or keypress based on the browser.
+       useKeydown: useKeydown
+   };
+}());
+
+Ext.EventManager.on = Ext.EventManager.addListener;
+
+
+Ext.apply(Ext.EventObjectImpl.prototype, {
+   /** Key constant @type Number */
+   BACKSPACE: 8,
+   /** Key constant @type Number */
+   TAB: 9,
+   /** Key constant @type Number */
+   NUM_CENTER: 12,
+   /** Key constant @type Number */
+   ENTER: 13,
+   /** Key constant @type Number */
+   RETURN: 13,
+   /** Key constant @type Number */
+   SHIFT: 16,
+   /** Key constant @type Number */
+   CTRL: 17,
+   CONTROL : 17, // legacy
+   /** Key constant @type Number */
+   ALT: 18,
+   /** Key constant @type Number */
+   PAUSE: 19,
+   /** Key constant @type Number */
+   CAPS_LOCK: 20,
+   /** Key constant @type Number */
+   ESC: 27,
+   /** Key constant @type Number */
+   SPACE: 32,
+   /** Key constant @type Number */
+   PAGE_UP: 33,
+   PAGEUP : 33, // legacy
+   /** Key constant @type Number */
+   PAGE_DOWN: 34,
+   PAGEDOWN : 34, // legacy
+   /** Key constant @type Number */
+   END: 35,
+   /** Key constant @type Number */
+   HOME: 36,
+   /** Key constant @type Number */
+   LEFT: 37,
+   /** Key constant @type Number */
+   UP: 38,
+   /** Key constant @type Number */
+   RIGHT: 39,
+   /** Key constant @type Number */
+   DOWN: 40,
+   /** Key constant @type Number */
+   PRINT_SCREEN: 44,
+   /** Key constant @type Number */
+   INSERT: 45,
+   /** Key constant @type Number */
+   DELETE: 46,
+   /** Key constant @type Number */
+   ZERO: 48,
+   /** Key constant @type Number */
+   ONE: 49,
+   /** Key constant @type Number */
+   TWO: 50,
+   /** Key constant @type Number */
+   THREE: 51,
+   /** Key constant @type Number */
+   FOUR: 52,
+   /** Key constant @type Number */
+   FIVE: 53,
+   /** Key constant @type Number */
+   SIX: 54,
+   /** Key constant @type Number */
+   SEVEN: 55,
+   /** Key constant @type Number */
+   EIGHT: 56,
+   /** Key constant @type Number */
+   NINE: 57,
+   /** Key constant @type Number */
+   A: 65,
+   /** Key constant @type Number */
+   B: 66,
+   /** Key constant @type Number */
+   C: 67,
+   /** Key constant @type Number */
+   D: 68,
+   /** Key constant @type Number */
+   E: 69,
+   /** Key constant @type Number */
+   F: 70,
+   /** Key constant @type Number */
+   G: 71,
+   /** Key constant @type Number */
+   H: 72,
+   /** Key constant @type Number */
+   I: 73,
+   /** Key constant @type Number */
+   J: 74,
+   /** Key constant @type Number */
+   K: 75,
+   /** Key constant @type Number */
+   L: 76,
+   /** Key constant @type Number */
+   M: 77,
+   /** Key constant @type Number */
+   N: 78,
+   /** Key constant @type Number */
+   O: 79,
+   /** Key constant @type Number */
+   P: 80,
+   /** Key constant @type Number */
+   Q: 81,
+   /** Key constant @type Number */
+   R: 82,
+   /** Key constant @type Number */
+   S: 83,
+   /** Key constant @type Number */
+   T: 84,
+   /** Key constant @type Number */
+   U: 85,
+   /** Key constant @type Number */
+   V: 86,
+   /** Key constant @type Number */
+   W: 87,
+   /** Key constant @type Number */
+   X: 88,
+   /** Key constant @type Number */
+   Y: 89,
+   /** Key constant @type Number */
+   Z: 90,
+   /** Key constant @type Number */
+   CONTEXT_MENU: 93,
+   /** Key constant @type Number */
+   NUM_ZERO: 96,
+   /** Key constant @type Number */
+   NUM_ONE: 97,
+   /** Key constant @type Number */
+   NUM_TWO: 98,
+   /** Key constant @type Number */
+   NUM_THREE: 99,
+   /** Key constant @type Number */
+   NUM_FOUR: 100,
+   /** Key constant @type Number */
+   NUM_FIVE: 101,
+   /** Key constant @type Number */
+   NUM_SIX: 102,
+   /** Key constant @type Number */
+   NUM_SEVEN: 103,
+   /** Key constant @type Number */
+   NUM_EIGHT: 104,
+   /** Key constant @type Number */
+   NUM_NINE: 105,
+   /** Key constant @type Number */
+   NUM_MULTIPLY: 106,
+   /** Key constant @type Number */
+   NUM_PLUS: 107,
+   /** Key constant @type Number */
+   NUM_MINUS: 109,
+   /** Key constant @type Number */
+   NUM_PERIOD: 110,
+   /** Key constant @type Number */
+   NUM_DIVISION: 111,
+   /** Key constant @type Number */
+   F1: 112,
+   /** Key constant @type Number */
+   F2: 113,
+   /** Key constant @type Number */
+   F3: 114,
+   /** Key constant @type Number */
+   F4: 115,
+   /** Key constant @type Number */
+   F5: 116,
+   /** Key constant @type Number */
+   F6: 117,
+   /** Key constant @type Number */
+   F7: 118,
+   /** Key constant @type Number */
+   F8: 119,
+   /** Key constant @type Number */
+   F9: 120,
+   /** Key constant @type Number */
+   F10: 121,
+   /** Key constant @type Number */
+   F11: 122,
+   /** Key constant @type Number */
+   F12: 123,
+
+   /** @private */
+   isNavKeyPress : function(){
+       var me = this,
+           k = this.normalizeKey(me.keyCode);
+       return (k >= 33 && k <= 40) ||  // Page Up/Down, End, Home, Left, Up, Right, Down
+       k == me.RETURN ||
+       k == me.TAB ||
+       k == me.ESC;
+   },
+
+   isSpecialKey : function(){
+       var k = this.normalizeKey(this.keyCode);
+       return (this.type == 'keypress' && this.ctrlKey) ||
+       this.isNavKeyPress() ||
+       (k == this.BACKSPACE) || // Backspace
+       (k >= 16 && k <= 20) || // Shift, Ctrl, Alt, Pause, Caps Lock
+       (k >= 44 && k <= 46);   // Print Screen, Insert, Delete
+   },
+
+   getPoint : function(){
+       return new Ext.lib.Point(this.xy[0], this.xy[1]);
+   },
+
+   /**
+    * Returns true if the control, meta, shift or alt key was pressed during this event.
+    * @return {Boolean}
+    */
+   hasModifier : function(){
+       return ((this.ctrlKey || this.altKey) || this.shiftKey);
+   }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Stops the specified event(s) from bubbling and optionally prevents the default action
+     * @param {String/Array} eventName an event / array of events to stop from bubbling
+     * @param {Boolean} preventDefault (optional) true to prevent the default action too
+     * @return {Ext.Element} this
+     */
+    swallowEvent : function(eventName, preventDefault) {
+        var me = this;
+        function fn(e) {
+            e.stopPropagation();
+            if (preventDefault) {
+                e.preventDefault();
+            }
+        }
+        
+        if (Ext.isArray(eventName)) {
+            Ext.each(eventName, function(e) {
+                 me.on(e, fn);
+            });
+            return me;
+        }
+        me.on(eventName, fn);
+        return me;
+    },
+
+    /**
+     * Create an event handler on this element such that when the event fires and is handled by this element,
+     * it will be relayed to another object (i.e., fired again as if it originated from that object instead).
+     * @param {String} eventName The type of event to relay
+     * @param {Object} object Any object that extends {@link Ext.util.Observable} that will provide the context
+     * for firing the relayed event
+     */
+    relayEvent : function(eventName, observable) {
+        this.on(eventName, function(e) {
+            observable.fireEvent(eventName, e);
+        });
+    },
+
+    /**
+     * Removes worthless text nodes
+     * @param {Boolean} forceReclean (optional) By default the element
+     * keeps track if it has been cleaned already so
+     * you can call this over and over. However, if you update the element and
+     * need to force a reclean, you can pass true.
+     */
+    clean : function(forceReclean) {
+        var me  = this,
+            dom = me.dom,
+            n   = dom.firstChild,
+            ni  = -1;
+
+        if (Ext.Element.data(dom, 'isCleaned') && forceReclean !== true) {
+            return me;
+        }
+
+        while (n) {
+            var nx = n.nextSibling;
+            if (n.nodeType == 3 && !(/\S/.test(n.nodeValue))) {
+                dom.removeChild(n);
+            } else {
+                n.nodeIndex = ++ni;
+            }
+            n = nx;
+        }
+        
+        Ext.Element.data(dom, 'isCleaned', true);
+        return me;
+    },
+
+    /**
+     * Direct access to the Updater {@link Ext.Updater#update} method. The method takes the same object
+     * parameter as {@link Ext.Updater#update}
+     * @return {Ext.Element} this
+     */
+    load : function() {
+        var updateManager = this.getUpdater();
+        updateManager.update.apply(updateManager, arguments);
+        
+        return this;
+    },
+
+    /**
+    * Gets this element's {@link Ext.Updater Updater}
+    * @return {Ext.Updater} The Updater
+    */
+    getUpdater : function() {
+        return this.updateManager || (this.updateManager = new Ext.Updater(this));
+    },
+
+    /**
+    * Update the innerHTML of this element, optionally searching for and processing scripts
+    * @param {String} html The new HTML
+    * @param {Boolean} loadScripts (optional) True to look for and process scripts (defaults to false)
+    * @param {Function} callback (optional) For async script loading you can be notified when the update completes
+    * @return {Ext.Element} this
+     */
+    update : function(html, loadScripts, callback) {
+        if (!this.dom) {
+            return this;
+        }
+        html = html || "";
+
+        if (loadScripts !== true) {
+            this.dom.innerHTML = html;
+            if (typeof callback == 'function') {
+                callback();
+            }
+            return this;
+        }
+
+        var id  = Ext.id(),
+            dom = this.dom;
+
+        html += '<span id="' + id + '"></span>';
+
+        Ext.lib.Event.onAvailable(id, function() {
+            var DOC    = document,
+                hd     = DOC.getElementsByTagName("head")[0],
+                re     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+                srcRe  = /\ssrc=([\'\"])(.*?)\1/i,
+                typeRe = /\stype=([\'\"])(.*?)\1/i,
+                match,
+                attrs,
+                srcMatch,
+                typeMatch,
+                el,
+                s;
+
+            while ((match = re.exec(html))) {
+                attrs = match[1];
+                srcMatch = attrs ? attrs.match(srcRe) : false;
+                if (srcMatch && srcMatch[2]) {
+                   s = DOC.createElement("script");
+                   s.src = srcMatch[2];
+                   typeMatch = attrs.match(typeRe);
+                   if (typeMatch && typeMatch[2]) {
+                       s.type = typeMatch[2];
+                   }
+                   hd.appendChild(s);
+                } else if (match[2] && match[2].length > 0) {
+                    if (window.execScript) {
+                       window.execScript(match[2]);
+                    } else {
+                       window.eval(match[2]);
+                    }
+                }
+            }
+            
+            el = DOC.getElementById(id);
+            if (el) {
+                Ext.removeNode(el);
+            }
+            
+            if (typeof callback == 'function') {
+                callback();
+            }
+        });
+        dom.innerHTML = html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig, "");
+        return this;
+    },
+
+    // inherit docs, overridden so we can add removeAnchor
+    removeAllListeners : function() {
+        this.removeAnchor();
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Creates a proxy element of this element
+     * @param {String/Object} config The class name of the proxy element or a DomHelper config object
+     * @param {String/HTMLElement} renderTo (optional) The element or element id to render the proxy to (defaults to document.body)
+     * @param {Boolean} matchBox (optional) True to align and size the proxy to this element now (defaults to false)
+     * @return {Ext.Element} The new proxy element
+     */
+    createProxy : function(config, renderTo, matchBox) {
+        config = (typeof config == 'object') ? config : {tag : "div", cls: config};
+
+        var me = this,
+            proxy = renderTo ? Ext.DomHelper.append(renderTo, config, true) :
+                               Ext.DomHelper.insertBefore(me.dom, config, true);
+
+        if (matchBox && me.setBox && me.getBox) { // check to make sure Element.position.js is loaded
+           proxy.setBox(me.getBox());
+        }
+        return proxy;
+    }
+});
+
+Ext.Element.prototype.getUpdateManager = Ext.Element.prototype.getUpdater;
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Gets the x,y coordinates specified by the anchor position on the element.
+     * @param {String} anchor (optional) The specified anchor position (defaults to "c").  See {@link #alignTo}
+     * for details on supported anchor positions.
+     * @param {Boolean} local (optional) True to get the local (element top/left-relative) anchor position instead
+     * of page coordinates
+     * @param {Object} size (optional) An object containing the size to use for calculating anchor position
+     * {width: (target width), height: (target height)} (defaults to the element's current size)
+     * @return {Array} [x, y] An array containing the element's x and y coordinates
+     */
+    getAnchorXY : function(anchor, local, s){
+        //Passing a different size is useful for pre-calculating anchors,
+        //especially for anchored animations that change the el size.
+		anchor = (anchor || "tl").toLowerCase();
+        s = s || {};
+        
+        var me = this,        
+        	vp = me.dom == document.body || me.dom == document,
+        	w = s.width || vp ? Ext.lib.Dom.getViewWidth() : me.getWidth(),
+        	h = s.height || vp ? Ext.lib.Dom.getViewHeight() : me.getHeight(),         	        	
+        	xy,       	
+        	r = Math.round,
+        	o = me.getXY(),
+        	scroll = me.getScroll(),
+        	extraX = vp ? scroll.left : !local ? o[0] : 0,
+        	extraY = vp ? scroll.top : !local ? o[1] : 0,
+        	hash = {
+	        	c  : [r(w * 0.5), r(h * 0.5)],
+	        	t  : [r(w * 0.5), 0],
+	        	l  : [0, r(h * 0.5)],
+	        	r  : [w, r(h * 0.5)],
+	        	b  : [r(w * 0.5), h],
+	        	tl : [0, 0],	
+	        	bl : [0, h],
+	        	br : [w, h],
+	        	tr : [w, 0]
+        	};
+        
+        xy = hash[anchor];	
+        return [xy[0] + extraX, xy[1] + extraY]; 
+    },
+
+    /**
+     * Anchors an element to another element and realigns it when the window is resized.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) True for the default animation or a standard Element animation config object
+     * @param {Boolean/Number} monitorScroll (optional) True to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @param {Function} callback The function to call after the animation finishes
+     * @return {Ext.Element} this
+     */
+    anchorTo : function(el, alignment, offsets, animate, monitorScroll, callback){        
+	    var me = this,
+            dom = me.dom,
+            scroll = !Ext.isEmpty(monitorScroll),
+            action = function(){
+                Ext.fly(dom).alignTo(el, alignment, offsets, animate);
+                Ext.callback(callback, Ext.fly(dom));
+            },
+            anchor = this.getAnchor();
+            
+        // previous listener anchor, remove it
+        this.removeAnchor();
+        Ext.apply(anchor, {
+            fn: action,
+            scroll: scroll
+        });
+
+        Ext.EventManager.onWindowResize(action, null);
+        
+        if(scroll){
+            Ext.EventManager.on(window, 'scroll', action, null,
+                {buffer: !isNaN(monitorScroll) ? monitorScroll : 50});
+        }
+        action.call(me); // align immediately
+        return me;
+    },
+    
+    /**
+     * Remove any anchor to this element. See {@link #anchorTo}.
+     * @return {Ext.Element} this
+     */
+    removeAnchor : function(){
+        var me = this,
+            anchor = this.getAnchor();
+            
+        if(anchor && anchor.fn){
+            Ext.EventManager.removeResizeListener(anchor.fn);
+            if(anchor.scroll){
+                Ext.EventManager.un(window, 'scroll', anchor.fn);
+            }
+            delete anchor.fn;
+        }
+        return me;
+    },
+    
+    // private
+    getAnchor : function(){
+        var data = Ext.Element.data,
+            dom = this.dom;
+            if (!dom) {
+                return;
+            }
+            var anchor = data(dom, '_anchor');
+            
+        if(!anchor){
+            anchor = data(dom, '_anchor', {});
+        }
+        return anchor;
+    },
+
+    /**
+     * Gets the x,y coordinates to align this element with another element. See {@link #alignTo} for more info on the
+     * supported position values.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Array} [x, y]
+     */
+    getAlignToXY : function(el, p, o){	    
+        el = Ext.get(el);
+        
+        if(!el || !el.dom){
+            throw "Element.alignToXY with an element that doesn't exist";
+        }
+        
+        o = o || [0,0];
+        p = (!p || p == "?" ? "tl-bl?" : (!(/-/).test(p) && p !== "" ? "tl-" + p : p || "tl-bl")).toLowerCase();       
+                
+        var me = this,
+        	d = me.dom,
+        	a1,
+        	a2,
+        	x,
+        	y,
+        	//constrain the aligned el to viewport if necessary
+        	w,
+        	h,
+        	r,
+        	dw = Ext.lib.Dom.getViewWidth() -10, // 10px of margin for ie
+        	dh = Ext.lib.Dom.getViewHeight()-10, // 10px of margin for ie
+        	p1y,
+        	p1x,        	
+        	p2y,
+        	p2x,
+        	swapY,
+        	swapX,
+        	doc = document,
+        	docElement = doc.documentElement,
+        	docBody = doc.body,
+        	scrollX = (docElement.scrollLeft || docBody.scrollLeft || 0)+5,
+        	scrollY = (docElement.scrollTop || docBody.scrollTop || 0)+5,
+        	c = false, //constrain to viewport
+        	p1 = "", 
+        	p2 = "",
+        	m = p.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+        
+        if(!m){
+           throw "Element.alignTo with an invalid alignment " + p;
+        }
+        
+        p1 = m[1]; 
+        p2 = m[2]; 
+        c = !!m[3];
+
+        //Subtract the aligned el's internal xy from the target's offset xy
+        //plus custom offset to get the aligned el's new offset xy
+        a1 = me.getAnchorXY(p1, true);
+        a2 = el.getAnchorXY(p2, false);
+
+        x = a2[0] - a1[0] + o[0];
+        y = a2[1] - a1[1] + o[1];
+
+        if(c){    
+	       w = me.getWidth();
+           h = me.getHeight();
+           r = el.getRegion();       
+           //If we are at a viewport boundary and the aligned el is anchored on a target border that is
+           //perpendicular to the vp border, allow the aligned el to slide on that border,
+           //otherwise swap the aligned el to the opposite border of the target.
+           p1y = p1.charAt(0);
+           p1x = p1.charAt(p1.length-1);
+           p2y = p2.charAt(0);
+           p2x = p2.charAt(p2.length-1);
+           swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t"));
+           swapX = ((p1x=="r" && p2x=="l") || (p1x=="l" && p2x=="r"));          
+           
+
+           if (x + w > dw + scrollX) {
+                x = swapX ? r.left-w : dw+scrollX-w;
+           }
+           if (x < scrollX) {
+               x = swapX ? r.right : scrollX;
+           }
+           if (y + h > dh + scrollY) {
+                y = swapY ? r.top-h : dh+scrollY-h;
+            }
+           if (y < scrollY){
+               y = swapY ? r.bottom : scrollY;
+           }
+        }
+        return [x,y];
+    },
+
+    /**
+     * Aligns this element with another element relative to the specified anchor points. If the other element is the
+     * document it aligns it to the viewport.
+     * The position parameter is optional, and can be specified in any one of the following formats:
+     * <ul>
+     *   <li><b>Blank</b>: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").</li>
+     *   <li><b>One anchor (deprecated)</b>: The passed anchor position is used as the target element's anchor point.
+     *       The element being aligned will position its top-left corner (tl) to that point.  <i>This method has been
+     *       deprecated in favor of the newer two anchor syntax below</i>.</li>
+     *   <li><b>Two anchors</b>: If two values from the table below are passed separated by a dash, the first value is used as the
+     *       element's anchor point, and the second value is used as the target's anchor point.</li>
+     * </ul>
+     * In addition to the anchor points, the position parameter also supports the "?" character.  If "?" is passed at the end of
+     * the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to
+     * the viewport if necessary.  Note that the element being aligned might be swapped to align to a different position than
+     * that specified in order to enforce the viewport constraints.
+     * Following are all of the supported anchor positions:
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner (default)
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+c      In the center of the element
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+Example Usage:
+<pre><code>
+// align el to other-el using the default positioning ("tl-bl", non-constrained)
+el.alignTo("other-el");
+
+// align the top left corner of el with the top right corner of other-el (constrained to viewport)
+el.alignTo("other-el", "tr?");
+
+// align the bottom right corner of el with the center left edge of other-el
+el.alignTo("other-el", "br-l?");
+
+// align the center of el with the bottom left corner of other-el and
+// adjust the x position by -6 pixels (and the y position by 0)
+el.alignTo("other-el", "c-bl", [-6, 0]);
+</code></pre>
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    alignTo : function(element, position, offsets, animate){
+	    var me = this;
+        return me.setXY(me.getAlignToXY(element, position, offsets),
+          		        me.preanim && !!animate ? me.preanim(arguments, 3) : false);
+    },
+    
+    // private ==>  used outside of core
+    adjustForConstraints : function(xy, parent, offsets){
+        return this.getConstrainToXY(parent || document, false, offsets, xy) ||  xy;
+    },
+
+    // private ==>  used outside of core
+    getConstrainToXY : function(el, local, offsets, proposedXY){   
+	    var os = {top:0, left:0, bottom:0, right: 0};
+
+        return function(el, local, offsets, proposedXY){
+            el = Ext.get(el);
+            offsets = offsets ? Ext.applyIf(offsets, os) : os;
+
+            var vw, vh, vx = 0, vy = 0;
+            if(el.dom == document.body || el.dom == document){
+                vw =Ext.lib.Dom.getViewWidth();
+                vh = Ext.lib.Dom.getViewHeight();
+            }else{
+                vw = el.dom.clientWidth;
+                vh = el.dom.clientHeight;
+                if(!local){
+                    var vxy = el.getXY();
+                    vx = vxy[0];
+                    vy = vxy[1];
+                }
+            }
+
+            var s = el.getScroll();
+
+            vx += offsets.left + s.left;
+            vy += offsets.top + s.top;
+
+            vw -= offsets.right;
+            vh -= offsets.bottom;
+
+            var vr = vx + vw,
+                vb = vy + vh,
+                xy = proposedXY || (!local ? this.getXY() : [this.getLeft(true), this.getTop(true)]),
+                x = xy[0], y = xy[1],
+                offset = this.getConstrainOffset(),
+                w = this.dom.offsetWidth + offset, 
+                h = this.dom.offsetHeight + offset;
+
+            // only move it if it needs it
+            var moved = false;
+
+            // first validate right/bottom
+            if((x + w) > vr){
+                x = vr - w;
+                moved = true;
+            }
+            if((y + h) > vb){
+                y = vb - h;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < vx){
+                x = vx;
+                moved = true;
+            }
+            if(y < vy){
+                y = vy;
+                moved = true;
+            }
+            return moved ? [x, y] : false;
+        };
+    }(),
+	    
+	    
+	        
+//         el = Ext.get(el);
+//         offsets = Ext.applyIf(offsets || {}, {top : 0, left : 0, bottom : 0, right : 0});
+
+//         var	me = this,
+//         	doc = document,
+//         	s = el.getScroll(),
+//         	vxy = el.getXY(),
+//         	vx = offsets.left + s.left, 
+//         	vy = offsets.top + s.top,            	
+//         	vw = -offsets.right, 
+//         	vh = -offsets.bottom, 
+//         	vr,
+//         	vb,
+//         	xy = proposedXY || (!local ? me.getXY() : [me.getLeft(true), me.getTop(true)]),
+//         	x = xy[0],
+//         	y = xy[1],
+//         	w = me.dom.offsetWidth, h = me.dom.offsetHeight,
+//         	moved = false; // only move it if it needs it
+//       
+//         	
+//         if(el.dom == doc.body || el.dom == doc){
+//             vw += Ext.lib.Dom.getViewWidth();
+//             vh += Ext.lib.Dom.getViewHeight();
+//         }else{
+//             vw += el.dom.clientWidth;
+//             vh += el.dom.clientHeight;
+//             if(!local){                    
+//                 vx += vxy[0];
+//                 vy += vxy[1];
+//             }
+//         }
+
+//         // first validate right/bottom
+//         if(x + w > vx + vw){
+//             x = vx + vw - w;
+//             moved = true;
+//         }
+//         if(y + h > vy + vh){
+//             y = vy + vh - h;
+//             moved = true;
+//         }
+//         // then make sure top/left isn't negative
+//         if(x < vx){
+//             x = vx;
+//             moved = true;
+//         }
+//         if(y < vy){
+//             y = vy;
+//             moved = true;
+//         }
+//         return moved ? [x, y] : false;
+//    },
+
+    // private, used internally
+    getConstrainOffset : function(){
+        return 0;
+    },
+    
+    /**
+    * Calculates the x, y to center this element on the screen
+    * @return {Array} The x, y values [x, y]
+    */
+    getCenterXY : function(){
+        return this.getAlignToXY(document, 'c-c');
+    },
+
+    /**
+    * Centers the Element in either the viewport, or another Element.
+    * @param {Mixed} centerIn (optional) The element in which to center the element.
+    */
+    center : function(centerIn){
+        return this.alignTo(centerIn || document, 'c-c');        
+    }    
+});
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+     * @param {String} selector The CSS selector
+     * @param {Boolean} unique (optional) True to create a unique Ext.Element for each child (defaults to false, which creates a single shared flyweight object)
+     * @return {CompositeElement/CompositeElementLite} The composite element
+     */
+    select : function(selector, unique){
+        return Ext.Element.select(selector, unique, this.dom);
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.apply(Ext.Element.prototype, function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {	
+		/**
+	     * Inserts (or creates) the passed element (or DomHelper config) as a sibling of this element
+	     * @param {Mixed/Object/Array} el The id, element to insert or a DomHelper config to create and insert *or* an array of any of those.
+	     * @param {String} where (optional) 'before' or 'after' defaults to before
+	     * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+	     * @return {Ext.Element} The inserted Element. If an array is passed, the last inserted element is returned.
+	     */
+	    insertSibling: function(el, where, returnDom){
+	        var me = this,
+	        	rt,
+                isAfter = (where || 'before').toLowerCase() == 'after',
+                insertEl;
+	        	
+	        if(Ext.isArray(el)){
+                insertEl = me;
+	            Ext.each(el, function(e) {
+		            rt = Ext.fly(insertEl, '_internal').insertSibling(e, where, returnDom);
+                    if(isAfter){
+                        insertEl = rt;
+                    }
+	            });
+	            return rt;
+	        }
+	                
+	        el = el || {};
+	       	
+            if(el.nodeType || el.dom){
+                rt = me.dom.parentNode.insertBefore(GETDOM(el), isAfter ? me.dom.nextSibling : me.dom);
+                if (!returnDom) {
+                    rt = GET(rt);
+                }
+            }else{
+                if (isAfter && !me.dom.nextSibling) {
+                    rt = DH.append(me.dom.parentNode, el, !returnDom);
+                } else {                    
+                    rt = DH[isAfter ? 'insertAfter' : 'insertBefore'](me.dom, el, !returnDom);
+                }
+            }
+	        return rt;
+	    }
+    };
+}());/**
+ * @class Ext.Element
+ */
+
+// special markup used throughout Ext when box wrapping elements
+Ext.Element.boxMarkup = '<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';
+
+Ext.Element.addMethods(function(){
+    var INTERNAL = "_internal",
+        pxMatch = /(\d+\.?\d+)px/;
+    return {
+        /**
+         * More flexible version of {@link #setStyle} for setting style properties.
+         * @param {String/Object/Function} styles A style specification string, e.g. "width:100px", or object in the form {width:"100px"}, or
+         * a function which returns such a specification.
+         * @return {Ext.Element} this
+         */
+        applyStyles : function(style){
+            Ext.DomHelper.applyStyles(this.dom, style);
+            return this;
+        },
+
+        /**
+         * Returns an object with properties matching the styles requested.
+         * For example, el.getStyles('color', 'font-size', 'width') might return
+         * {'color': '#FFFFFF', 'font-size': '13px', 'width': '100px'}.
+         * @param {String} style1 A style name
+         * @param {String} style2 A style name
+         * @param {String} etc.
+         * @return {Object} The style object
+         */
+        getStyles : function(){
+            var ret = {};
+            Ext.each(arguments, function(v) {
+               ret[v] = this.getStyle(v);
+            },
+            this);
+            return ret;
+        },
+
+        // private  ==> used by ext full
+        setOverflow : function(v){
+            var dom = this.dom;
+            if(v=='auto' && Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                dom.style.overflow = 'hidden';
+                (function(){dom.style.overflow = 'auto';}).defer(1);
+            }else{
+                dom.style.overflow = v;
+            }
+        },
+
+       /**
+        * <p>Wraps the specified element with a special 9 element markup/CSS block that renders by default as
+        * a gray container with a gradient background, rounded corners and a 4-way shadow.</p>
+        * <p>This special markup is used throughout Ext when box wrapping elements ({@link Ext.Button},
+        * {@link Ext.Panel} when <tt>{@link Ext.Panel#frame frame=true}</tt>, {@link Ext.Window}).  The markup
+        * is of this form:</p>
+        * <pre><code>
+    Ext.Element.boxMarkup =
+    &#39;&lt;div class="{0}-tl">&lt;div class="{0}-tr">&lt;div class="{0}-tc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-ml">&lt;div class="{0}-mr">&lt;div class="{0}-mc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-bl">&lt;div class="{0}-br">&lt;div class="{0}-bc">&lt;/div>&lt;/div>&lt;/div>&#39;;
+        * </code></pre>
+        * <p>Example usage:</p>
+        * <pre><code>
+    // Basic box wrap
+    Ext.get("foo").boxWrap();
+
+    // You can also add a custom class and use CSS inheritance rules to customize the box look.
+    // 'x-box-blue' is a built-in alternative -- look at the related CSS definitions as an example
+    // for how to create a custom box wrap style.
+    Ext.get("foo").boxWrap().addClass("x-box-blue");
+        * </code></pre>
+        * @param {String} class (optional) A base CSS class to apply to the containing wrapper element
+        * (defaults to <tt>'x-box'</tt>). Note that there are a number of CSS rules that are dependent on
+        * this name to make the overall effect work, so if you supply an alternate base class, make sure you
+        * also supply all of the necessary rules.
+        * @return {Ext.Element} The outermost wrapping element of the created box structure.
+        */
+        boxWrap : function(cls){
+            cls = cls || 'x-box';
+            var el = Ext.get(this.insertHtml("beforeBegin", "<div class='" + cls + "'>" + String.format(Ext.Element.boxMarkup, cls) + "</div>"));        //String.format('<div class="{0}">'+Ext.Element.boxMarkup+'</div>', cls)));
+            Ext.DomQuery.selectNode('.' + cls + '-mc', el.dom).appendChild(this.dom);
+            return el;
+        },
+
+        /**
+         * Set the size of this Element. If animation is true, both width and height will be animated concurrently.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+         * </ul></div>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setSize : function(width, height, animate){
+            var me = this;
+            if(typeof width == 'object'){ // in case of object from getSize()
+                height = width.height;
+                width = width.width;
+            }
+            width = me.adjustWidth(width);
+            height = me.adjustHeight(height);
+            if(!animate || !me.anim){
+                me.dom.style.width = me.addUnits(width);
+                me.dom.style.height = me.addUnits(height);
+            }else{
+                me.anim({width: {to: width}, height: {to: height}}, me.preanim(arguments, 2));
+            }
+            return me;
+        },
+
+        /**
+         * Returns either the offsetHeight or the height of this element based on CSS height adjusted by padding or borders
+         * when needed to simulate offsetHeight when offsets aren't available. This may not work on display:none elements
+         * if a height has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedHeight : function(){
+            var me = this,
+                h = Math.max(me.dom.offsetHeight, me.dom.clientHeight);
+            if(!h){
+                h = parseFloat(me.getStyle('height')) || 0;
+                if(!me.isBorderBox()){
+                    h += me.getFrameWidth('tb');
+                }
+            }
+            return h;
+        },
+
+        /**
+         * Returns either the offsetWidth or the width of this element based on CSS width adjusted by padding or borders
+         * when needed to simulate offsetWidth when offsets aren't available. This may not work on display:none elements
+         * if a width has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedWidth : function(){
+            var w = Math.max(this.dom.offsetWidth, this.dom.clientWidth);
+            if(!w){
+                w = parseFloat(this.getStyle('width')) || 0;
+                if(!this.isBorderBox()){
+                    w += this.getFrameWidth('lr');
+                }
+            }
+            return w;
+        },
+
+        /**
+         * Returns the sum width of the padding and borders for the passed "sides". See getBorderWidth()
+         for more information about the sides.
+         * @param {String} sides
+         * @return {Number}
+         */
+        getFrameWidth : function(sides, onlyContentBox){
+            return onlyContentBox && this.isBorderBox() ? 0 : (this.getPadding(sides) + this.getBorderWidth(sides));
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is over this element
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnOver : function(className){
+            this.hover(
+                function(){
+                    Ext.fly(this, INTERNAL).addClass(className);
+                },
+                function(){
+                    Ext.fly(this, INTERNAL).removeClass(className);
+                }
+            );
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when this element has the focus
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnFocus : function(className){
+            this.on("focus", function(){
+                Ext.fly(this, INTERNAL).addClass(className);
+            }, this.dom);
+            this.on("blur", function(){
+                Ext.fly(this, INTERNAL).removeClass(className);
+            }, this.dom);
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnClick : function(className){
+            var dom = this.dom;
+            this.on("mousedown", function(){
+                Ext.fly(dom, INTERNAL).addClass(className);
+                var d = Ext.getDoc(),
+                    fn = function(){
+                        Ext.fly(dom, INTERNAL).removeClass(className);
+                        d.removeListener("mouseup", fn);
+                    };
+                d.on("mouseup", fn);
+            });
+            return this;
+        },
+
+        /**
+         * <p>Returns the dimensions of the element available to lay content out in.<p>
+         * <p>If the element (or any ancestor element) has CSS style <code>display : none</code>, the dimensions will be zero.</p>
+         * example:<pre><code>
+        var vpSize = Ext.getBody().getViewSize();
+
+        // all Windows created afterwards will have a default value of 90% height and 95% width
+        Ext.Window.override({
+            width: vpSize.width * 0.9,
+            height: vpSize.height * 0.95
+        });
+        // To handle window resizing you would have to hook onto onWindowResize.
+        * </code></pre>
+        *
+        * getViewSize utilizes clientHeight/clientWidth which excludes sizing of scrollbars.
+        * To obtain the size including scrollbars, use getStyleSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getViewSize : function(){
+            var doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body);
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+
+            // Else use clientHeight/clientWidth
+            } else {
+                return {
+                    width : d.clientWidth,
+                    height : d.clientHeight
+                };
+            }
+        },
+
+        /**
+        * <p>Returns the dimensions of the element available to lay content out in.<p>
+        *
+        * getStyleSize utilizes prefers style sizing if present, otherwise it chooses the larger of offsetHeight/clientHeight and offsetWidth/clientWidth.
+        * To obtain the size excluding scrollbars, use getViewSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getStyleSize : function(){
+            var me = this,
+                w, h,
+                doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body),
+                s = d.style;
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+            }
+            // Use Styles if they are set
+            if(s.width && s.width != 'auto'){
+                w = parseFloat(s.width);
+                if(me.isBorderBox()){
+                   w -= me.getFrameWidth('lr');
+                }
+            }
+            // Use Styles if they are set
+            if(s.height && s.height != 'auto'){
+                h = parseFloat(s.height);
+                if(me.isBorderBox()){
+                   h -= me.getFrameWidth('tb');
+                }
+            }
+            // Use getWidth/getHeight if style not set.
+            return {width: w || me.getWidth(true), height: h || me.getHeight(true)};
+        },
+
+        /**
+         * Returns the size of the element.
+         * @param {Boolean} contentSize (optional) true to get the width/size minus borders and padding
+         * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+         */
+        getSize : function(contentSize){
+            return {width: this.getWidth(contentSize), height: this.getHeight(contentSize)};
+        },
+
+        /**
+         * Forces the browser to repaint this element
+         * @return {Ext.Element} this
+         */
+        repaint : function(){
+            var dom = this.dom;
+            this.addClass("x-repaint");
+            setTimeout(function(){
+                Ext.fly(dom).removeClass("x-repaint");
+            }, 1);
+            return this;
+        },
+
+        /**
+         * Disables text selection for this element (normalized across browsers)
+         * @return {Ext.Element} this
+         */
+        unselectable : function(){
+            this.dom.unselectable = "on";
+            return this.swallowEvent("selectstart", true).
+                        applyStyles("-moz-user-select:none;-khtml-user-select:none;").
+                        addClass("x-unselectable");
+        },
+
+        /**
+         * Returns an object with properties top, left, right and bottom representing the margins of this element unless sides is passed,
+         * then it returns the calculated width of the sides (see getPadding)
+         * @param {String} sides (optional) Any combination of l, r, t, b to get the sum of those sides
+         * @return {Object/Number}
+         */
+        getMargins : function(side){
+            var me = this,
+                key,
+                hash = {t:"top", l:"left", r:"right", b: "bottom"},
+                o = {};
+
+            if (!side) {
+                for (key in me.margins){
+                    o[hash[key]] = parseFloat(me.getStyle(me.margins[key])) || 0;
+                }
+                return o;
+            } else {
+                return me.addStyles.call(me, side, me.margins);
+            }
+        }
+    };
+}());
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Sets the element's box. Use getBox() on another element to get a box obj. If animate is true then width, height, x and y will be animated concurrently.
+     * @param {Object} box The box to fill {x, y, width, height}
+     * @param {Boolean} adjust (optional) Whether to adjust for box-model issues automatically
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBox : function(box, adjust, animate){
+        var me = this,
+        	w = box.width, 
+        	h = box.height;
+        if((adjust && !me.autoBoxAdjust) && !me.isBorderBox()){
+           w -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+           h -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+        }
+        me.setBounds(box.x, box.y, w, h, me.animTest.call(me, arguments, animate, 2));
+        return me;
+    },
+
+    /**
+     * Return an object defining the area of this Element which can be passed to {@link #setBox} to
+     * set another Element's size/location to match this element.
+     * @param {Boolean} contentBox (optional) If true a box for the content of the element is returned.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page x/y.
+     * @return {Object} box An object in the format<pre><code>
+{
+    x: &lt;Element's X position>,
+    y: &lt;Element's Y position>,
+    width: &lt;Element's width>,
+    height: &lt;Element's height>,
+    bottom: &lt;Element's lower bound>,
+    right: &lt;Element's rightmost bound>
+}
+</code></pre>
+     * The returned object may also be addressed as an Array where index 0 contains the X position
+     * and index 1 contains the Y position. So the result may also be used for {@link #setXY}
+     */
+	getBox : function(contentBox, local) {	    
+	    var me = this,
+        	xy,
+        	left,
+        	top,
+        	getBorderWidth = me.getBorderWidth,
+        	getPadding = me.getPadding, 
+        	l,
+        	r,
+        	t,
+        	b;
+        if(!local){
+            xy = me.getXY();
+        }else{
+            left = parseInt(me.getStyle("left"), 10) || 0;
+            top = parseInt(me.getStyle("top"), 10) || 0;
+            xy = [left, top];
+        }
+        var el = me.dom, w = el.offsetWidth, h = el.offsetHeight, bx;
+        if(!contentBox){
+            bx = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: w, height: h};
+        }else{
+            l = getBorderWidth.call(me, "l") + getPadding.call(me, "l");
+            r = getBorderWidth.call(me, "r") + getPadding.call(me, "r");
+            t = getBorderWidth.call(me, "t") + getPadding.call(me, "t");
+            b = getBorderWidth.call(me, "b") + getPadding.call(me, "b");
+            bx = {x: xy[0]+l, y: xy[1]+t, 0: xy[0]+l, 1: xy[1]+t, width: w-(l+r), height: h-(t+b)};
+        }
+        bx.right = bx.x + bx.width;
+        bx.bottom = bx.y + bx.height;
+        return bx;
+	},
+	
+    /**
+     * Move this element relative to its current position.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to move the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+     move : function(direction, distance, animate){
+        var me = this,        	
+        	xy = me.getXY(),
+        	x = xy[0],
+        	y = xy[1],        	
+        	left = [x - distance, y],
+        	right = [x + distance, y],
+        	top = [x, y - distance],
+        	bottom = [x, y + distance],
+	       	hash = {
+	        	l :	left,
+	        	left : left,
+	        	r : right,
+	        	right : right,
+	        	t : top,
+	        	top : top,
+	        	up : top,
+	        	b : bottom, 
+	        	bottom : bottom,
+	        	down : bottom	        		
+	        };
+        
+ 	    direction = direction.toLowerCase();    
+ 	    me.moveTo(hash[direction][0], hash[direction][1], me.animTest.call(me, arguments, animate, 2));
+    },
+    
+    /**
+     * Quick set left and top adding default units
+     * @param {String} left The left CSS property value
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+     setLeftTop : function(left, top){
+	    var me = this,
+	    	style = me.dom.style;
+        style.left = me.addUnits(left);
+        style.top = me.addUnits(top);
+        return me;
+    },
+    
+    /**
+     * Returns the region of the given element.
+     * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
+     * @return {Region} A Ext.lib.Region containing "top, left, bottom, right" member data.
+     */
+    getRegion : function(){
+        return Ext.lib.Dom.getRegion(this.dom);
+    },
+    
+    /**
+     * Sets the element's position and size in one shot. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+     * </ul></div>
+     * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * </ul></div>
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBounds : function(x, y, width, height, animate){
+	    var me = this;
+        if (!animate || !me.anim) {
+            me.setSize(width, height);
+            me.setLocation(x, y);
+        } else {
+            me.anim({points: {to: [x, y]}, 
+            		 width: {to: me.adjustWidth(width)}, 
+            		 height: {to: me.adjustHeight(height)}},
+                     me.preanim(arguments, 4), 
+                     'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the element's position and size the specified region. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Ext.lib.Region} region The region to fill
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setRegion : function(region, animate) {
+        return this.setBounds(region.left, region.top, region.right-region.left, region.bottom-region.top, this.animTest.call(this, arguments, animate, 1));
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Element} this
+     */
+    scrollTo : function(side, value, animate) {
+        //check if we're scrolling top or left
+        var top = /top/i.test(side),
+            me = this,
+            dom = me.dom,
+            prop;
+        if (!animate || !me.anim) {
+            // just setting the value, so grab the direction
+            prop = 'scroll' + (top ? 'Top' : 'Left');
+            dom[prop] = value;
+        }
+        else {
+            // if scrolling top, we need to grab scrollLeft, if left, scrollTop
+            prop = 'scroll' + (top ? 'Left' : 'Top');
+            me.anim({scroll: {to: top ? [dom[prop], value] : [value, dom[prop]]}}, me.preanim(arguments, 2), 'scroll');
+        }
+        return me;
+    },
+    
+    /**
+     * Scrolls this element into view within the passed container.
+     * @param {Mixed} container (optional) The container element to scroll (defaults to document.body).  Should be a
+     * string (id), dom node, or Ext.Element.
+     * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)
+     * @return {Ext.Element} this
+     */
+    scrollIntoView : function(container, hscroll) {
+        var c = Ext.getDom(container) || Ext.getBody().dom,
+            el = this.dom,
+            o = this.getOffsetsTo(c),
+            l = o[0] + c.scrollLeft,
+            t = o[1] + c.scrollTop,
+            b = t + el.offsetHeight,
+            r = l + el.offsetWidth,
+            ch = c.clientHeight,
+            ct = parseInt(c.scrollTop, 10),
+            cl = parseInt(c.scrollLeft, 10),
+            cb = ct + ch,
+            cr = cl + c.clientWidth;
+
+        if (el.offsetHeight > ch || t < ct) {
+            c.scrollTop = t;
+        }
+        else if (b > cb) {
+            c.scrollTop = b-ch;
+        }
+        // corrects IE, other browsers will ignore
+        c.scrollTop = c.scrollTop;
+
+        if (hscroll !== false) {
+            if (el.offsetWidth > c.clientWidth || l < cl) {
+                c.scrollLeft = l;
+            }
+            else if (r > cr) {
+                c.scrollLeft = r - c.clientWidth;
+            }
+            c.scrollLeft = c.scrollLeft;
+        }
+        return this;
+    },
+
+    // private
+    scrollChildIntoView : function(child, hscroll) {
+        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
+    },
+    
+    /**
+     * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is
+     * within this element's scrollable range.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to scroll the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Boolean} Returns true if a scroll was triggered or false if the element
+     * was scrolled as far as it could go.
+     */
+     scroll : function(direction, distance, animate) {
+        if (!this.isScrollable()) {
+            return false;
+        }
+        var el = this.dom,
+            l = el.scrollLeft, t = el.scrollTop,
+            w = el.scrollWidth, h = el.scrollHeight,
+            cw = el.clientWidth, ch = el.clientHeight,
+            scrolled = false, v,
+            hash = {
+                l: Math.min(l + distance, w-cw),
+                r: v = Math.max(l - distance, 0),
+                t: Math.max(t - distance, 0),
+                b: Math.min(t + distance, h-ch)
+            };
+            hash.d = hash.b;
+            hash.u = hash.t;
+        
+        direction = direction.substr(0, 1);
+        if ((v = hash[direction]) > -1) {
+            scrolled = true;
+            this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.preanim(arguments, 2));
+        }
+        return scrolled;
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+    function() {
+        var VISIBILITY      = "visibility",
+            DISPLAY         = "display",
+            HIDDEN          = "hidden",
+            NONE            = "none",
+            XMASKED         = "x-masked",
+            XMASKEDRELATIVE = "x-masked-relative",
+            data            = Ext.Element.data;
+
+        return {
+            /**
+             * Checks whether the element is currently visible using both visibility and display properties.
+             * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)
+             * @return {Boolean} True if the element is currently visible, else false
+             */
+            isVisible : function(deep) {
+                var vis = !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE),
+                    p   = this.dom.parentNode;
+                
+                if (deep !== true || !vis) {
+                    return vis;
+                }
+                
+                while (p && !(/^body/i.test(p.tagName))) {
+                    if (!Ext.fly(p, '_isVisible').isVisible()) {
+                        return false;
+                    }
+                    p = p.parentNode;
+                }
+                return true;
+            },
+
+            /**
+             * Returns true if display is not "none"
+             * @return {Boolean}
+             */
+            isDisplayed : function() {
+                return !this.isStyle(DISPLAY, NONE);
+            },
+
+            /**
+             * Convenience method for setVisibilityMode(Element.DISPLAY)
+             * @param {String} display (optional) What to set display to when visible
+             * @return {Ext.Element} this
+             */
+            enableDisplayMode : function(display) {
+                this.setVisibilityMode(Ext.Element.DISPLAY);
+                
+                if (!Ext.isEmpty(display)) {
+                    data(this.dom, 'originalDisplay', display);
+                }
+                
+                return this;
+            },
+
+            /**
+             * Puts a mask over this element to disable user interaction. Requires core.css.
+             * This method can only be applied to elements which accept child nodes.
+             * @param {String} msg (optional) A message to display in the mask
+             * @param {String} msgCls (optional) A css class to apply to the msg element
+             * @return {Element} The mask element
+             */
+            mask : function(msg, msgCls) {
+                var me  = this,
+                    dom = me.dom,
+                    dh  = Ext.DomHelper,
+                    EXTELMASKMSG = "ext-el-mask-msg",
+                    el,
+                    mask;
+
+                if (!/^body/i.test(dom.tagName) && me.getStyle('position') == 'static') {
+                    me.addClass(XMASKEDRELATIVE);
+                }
+                if (el = data(dom, 'maskMsg')) {
+                    el.remove();
+                }
+                if (el = data(dom, 'mask')) {
+                    el.remove();
+                }
+
+                mask = dh.append(dom, {cls : "ext-el-mask"}, true);
+                data(dom, 'mask', mask);
+
+                me.addClass(XMASKED);
+                mask.setDisplayed(true);
+                
+                if (typeof msg == 'string') {
+                    var mm = dh.append(dom, {cls : EXTELMASKMSG, cn:{tag:'div'}}, true);
+                    data(dom, 'maskMsg', mm);
+                    mm.dom.className = msgCls ? EXTELMASKMSG + " " + msgCls : EXTELMASKMSG;
+                    mm.dom.firstChild.innerHTML = msg;
+                    mm.setDisplayed(true);
+                    mm.center(me);
+                }
+                
+                // ie will not expand full height automatically
+                if (Ext.isIE && !(Ext.isIE7 && Ext.isStrict) && me.getStyle('height') == 'auto') {
+                    mask.setSize(undefined, me.getHeight());
+                }
+                
+                return mask;
+            },
+
+            /**
+             * Removes a previously applied mask.
+             */
+            unmask : function() {
+                var me      = this,
+                    dom     = me.dom,
+                    mask    = data(dom, 'mask'),
+                    maskMsg = data(dom, 'maskMsg');
+
+                if (mask) {
+                    if (maskMsg) {
+                        maskMsg.remove();
+                        data(dom, 'maskMsg', undefined);
+                    }
+                    
+                    mask.remove();
+                    data(dom, 'mask', undefined);
+                    me.removeClass([XMASKED, XMASKEDRELATIVE]);
+                }
+            },
+
+            /**
+             * Returns true if this element is masked
+             * @return {Boolean}
+             */
+            isMasked : function() {
+                var m = data(this.dom, 'mask');
+                return m && m.isVisible();
+            },
+
+            /**
+             * Creates an iframe shim for this element to keep selects and other windowed objects from
+             * showing through.
+             * @return {Ext.Element} The new shim element
+             */
+            createShim : function() {
+                var el = document.createElement('iframe'),
+                    shim;
+                
+                el.frameBorder = '0';
+                el.className = 'ext-shim';
+                el.src = Ext.SSL_SECURE_URL;
+                shim = Ext.get(this.dom.parentNode.insertBefore(el, this.dom));
+                shim.autoBoxAdjust = false;
+                return shim;
+            }
+        };
+    }()
+);/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Convenience method for constructing a KeyMap
+     * @param {Number/Array/Object/String} key Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:
+     * <code>{key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}</code>
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the specified function is executed. Defaults to this Element.
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyListener : function(key, fn, scope){
+        var config;
+        if(typeof key != 'object' || Ext.isArray(key)){
+            config = {
+                key: key,
+                fn: fn,
+                scope: scope
+            };
+        }else{
+            config = {
+                key : key.key,
+                shift : key.shift,
+                ctrl : key.ctrl,
+                alt : key.alt,
+                fn: fn,
+                scope: scope
+            };
+        }
+        return new Ext.KeyMap(this, config);
+    },
+
+    /**
+     * Creates a KeyMap for this element
+     * @param {Object} config The KeyMap config. See {@link Ext.KeyMap} for more details
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyMap : function(config){
+        return new Ext.KeyMap(this, config);
+    }
+});
+
+//Import the newly-added Ext.Element functions into CompositeElementLite. We call this here because
+//Element.keys.js is the last extra Ext.Element include in the ext-all.js build
+Ext.CompositeElementLite.importElementMethods();/**
+ * @class Ext.CompositeElementLite
+ */
+Ext.apply(Ext.CompositeElementLite.prototype, {
+    addElements : function(els, root){
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }
+        var yels = this.elements;
+        Ext.each(els, function(e) {
+            yels.push(Ext.get(e));
+        });
+        return this;
+    },
+
+    /**
+     * Returns the first Element
+     * @return {Ext.Element}
+     */
+    first : function(){
+        return this.item(0);
+    },
+
+    /**
+     * Returns the last Element
+     * @return {Ext.Element}
+     */
+    last : function(){
+        return this.item(this.getCount()-1);
+    },
+
+    /**
+     * Returns true if this composite contains the passed element
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Boolean
+     */
+    contains : function(el){
+        return this.indexOf(el) != -1;
+    },
+
+    /**
+    * Removes the specified element(s).
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * or an array of any of those.
+    * @param {Boolean} removeDom (optional) True to also remove the element from the document
+    * @return {CompositeElement} this
+    */
+    removeElement : function(keys, removeDom){
+        var me = this,
+            els = this.elements,
+            el;
+        Ext.each(keys, function(val){
+            if ((el = (els[val] || els[val = me.indexOf(val)]))) {
+                if(removeDom){
+                    if(el.dom){
+                        el.remove();
+                    }else{
+                        Ext.removeNode(el);
+                    }
+                }
+                els.splice(val, 1);
+            }
+        });
+        return this;
+    }
+});
+/**
+ * @class Ext.CompositeElement
+ * @extends Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * <p>All methods return <i>this</i> and can be chained.</p>
+ * Usage:
+<pre><code>
+var els = Ext.select("#some-el div.some-class", true);
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class', true);
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code></pre>
+ */
+Ext.CompositeElement = Ext.extend(Ext.CompositeElementLite, {
+    
+    constructor : function(els, root){
+        this.elements = [];
+        this.add(els, root);
+    },
+    
+    // private
+    getElement : function(el){
+        // In this case just return it, since we already have a reference to it
+        return el;
+    },
+    
+    // private
+    transformElement : function(el){
+        return Ext.get(el);
+    }
+
+    /**
+    * Adds elements to this composite.
+    * @param {String/Array} els A string CSS selector, an array of elements or an element
+    * @return {CompositeElement} this
+    */
+
+    /**
+     * Returns the Element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+
+    /**
+     * Iterates each <code>element</code> in this <code>composite</code>
+     * calling the supplied function using {@link Ext#each}.
+     * @param {Function} fn The function to be called with each
+     * <code>element</code>. If the supplied function returns <tt>false</tt>,
+     * iteration stops. This function is called with the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><code>element</code> : <i>Ext.Element</i><div class="sub-desc">The element at the current <code>index</code>
+     * in the <code>composite</code></div></li>
+     * <li><code>composite</code> : <i>Object</i> <div class="sub-desc">This composite.</div></li>
+     * <li><code>index</code> : <i>Number</i> <div class="sub-desc">The current index within the <code>composite</code> </div></li>
+     * </ul></div>
+     * @param {Object} scope (optional) The scope (<code><this</code> reference) in which the specified function is executed.
+     * Defaults to the <code>element</code> at the current <code>index</code>
+     * within the composite.
+     * @return {CompositeElement} this
+     */
+});
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, unique, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+
+    return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);
+};
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;/**
+ * @class Ext.Updater
+ * @extends Ext.util.Observable
+ * Provides AJAX-style update capabilities for Element objects.  Updater can be used to {@link #update}
+ * an {@link Ext.Element} once, or you can use {@link #startAutoRefresh} to set up an auto-updating
+ * {@link Ext.Element Element} on a specific interval.<br><br>
+ * Usage:<br>
+ * <pre><code>
+ * var el = Ext.get("foo"); // Get Ext.Element object
+ * var mgr = el.getUpdater();
+ * mgr.update({
+        url: "http://myserver.com/index.php",
+        params: {
+            param1: "foo",
+            param2: "bar"
+        }
+ * });
+ * ...
+ * mgr.formUpdate("myFormId", "http://myserver.com/index.php");
+ * <br>
+ * // or directly (returns the same Updater instance)
+ * var mgr = new Ext.Updater("myElementId");
+ * mgr.startAutoRefresh(60, "http://myserver.com/index.php");
+ * mgr.on("update", myFcnNeedsToKnow);
+ * <br>
+ * // short handed call directly from the element object
+ * Ext.get("foo").load({
+        url: "bar.php",
+        scripts: true,
+        params: "param1=foo&amp;param2=bar",
+        text: "Loading Foo..."
+ * });
+ * </code></pre>
+ * @constructor
+ * Create new Updater directly.
+ * @param {Mixed} el The element to update
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if the passed element already
+ * has an Updater and if it does it returns the same instance. This will skip that check (useful for extending this class).
+ */
+Ext.UpdateManager = Ext.Updater = Ext.extend(Ext.util.Observable,
+function() {
+    var BEFOREUPDATE = "beforeupdate",
+        UPDATE = "update",
+        FAILURE = "failure";
+
+    // private
+    function processSuccess(response){
+        var me = this;
+        me.transaction = null;
+        if (response.argument.form && response.argument.reset) {
+            try { // put in try/catch since some older FF releases had problems with this
+                response.argument.form.reset();
+            } catch(e){}
+        }
+        if (me.loadScripts) {
+            me.renderer.render(me.el, response, me,
+               updateComplete.createDelegate(me, [response]));
+        } else {
+            me.renderer.render(me.el, response, me);
+            updateComplete.call(me, response);
+        }
+    }
+
+    // private
+    function updateComplete(response, type, success){
+        this.fireEvent(type || UPDATE, this.el, response);
+        if(Ext.isFunction(response.argument.callback)){
+            response.argument.callback.call(response.argument.scope, this.el, Ext.isEmpty(success) ? true : false, response, response.argument.options);
+        }
+    }
+
+    // private
+    function processFailure(response){
+        updateComplete.call(this, response, FAILURE, !!(this.transaction = null));
+    }
+
+    return {
+        constructor: function(el, forceNew){
+            var me = this;
+            el = Ext.get(el);
+            if(!forceNew && el.updateManager){
+                return el.updateManager;
+            }
+            /**
+             * The Element object
+             * @type Ext.Element
+             */
+            me.el = el;
+            /**
+             * Cached url to use for refreshes. Overwritten every time update() is called unless "discardUrl" param is set to true.
+             * @type String
+             */
+            me.defaultUrl = null;
+
+            me.addEvents(
+                /**
+                 * @event beforeupdate
+                 * Fired before an update is made, return false from your handler and the update is cancelled.
+                 * @param {Ext.Element} el
+                 * @param {String/Object/Function} url
+                 * @param {String/Object} params
+                 */
+                BEFOREUPDATE,
+                /**
+                 * @event update
+                 * Fired after successful update is made.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                UPDATE,
+                /**
+                 * @event failure
+                 * Fired on update failure.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                FAILURE
+            );
+
+            Ext.apply(me, Ext.Updater.defaults);
+            /**
+             * Blank page URL to use with SSL file uploads (defaults to {@link Ext.Updater.defaults#sslBlankUrl}).
+             * @property sslBlankUrl
+             * @type String
+             */
+            /**
+             * Whether to append unique parameter on get request to disable caching (defaults to {@link Ext.Updater.defaults#disableCaching}).
+             * @property disableCaching
+             * @type Boolean
+             */
+            /**
+             * Text for loading indicator (defaults to {@link Ext.Updater.defaults#indicatorText}).
+             * @property indicatorText
+             * @type String
+             */
+            /**
+             * Whether to show indicatorText when loading (defaults to {@link Ext.Updater.defaults#showLoadIndicator}).
+             * @property showLoadIndicator
+             * @type String
+             */
+            /**
+             * Timeout for requests or form posts in seconds (defaults to {@link Ext.Updater.defaults#timeout}).
+             * @property timeout
+             * @type Number
+             */
+            /**
+             * True to process scripts in the output (defaults to {@link Ext.Updater.defaults#loadScripts}).
+             * @property loadScripts
+             * @type Boolean
+             */
+
+            /**
+             * Transaction object of the current executing transaction, or null if there is no active transaction.
+             */
+            me.transaction = null;
+            /**
+             * Delegate for refresh() prebound to "this", use myUpdater.refreshDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.refreshDelegate = me.refresh.createDelegate(me);
+            /**
+             * Delegate for update() prebound to "this", use myUpdater.updateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.updateDelegate = me.update.createDelegate(me);
+            /**
+             * Delegate for formUpdate() prebound to "this", use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.formUpdateDelegate = (me.formUpdate || function(){}).createDelegate(me);
+
+            /**
+             * The renderer for this Updater (defaults to {@link Ext.Updater.BasicRenderer}).
+             */
+            me.renderer = me.renderer || me.getDefaultRenderer();
+
+            Ext.Updater.superclass.constructor.call(me);
+        },
+
+        /**
+         * Sets the content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @param {Object} renderer The object implementing the render() method
+         */
+        setRenderer : function(renderer){
+            this.renderer = renderer;
+        },
+
+        /**
+         * Returns the current content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @return {Object}
+         */
+        getRenderer : function(){
+           return this.renderer;
+        },
+
+        /**
+         * This is an overrideable method which returns a reference to a default
+         * renderer class if none is specified when creating the Ext.Updater.
+         * Defaults to {@link Ext.Updater.BasicRenderer}
+         */
+        getDefaultRenderer: function() {
+            return new Ext.Updater.BasicRenderer();
+        },
+
+        /**
+         * Sets the default URL used for updates.
+         * @param {String/Function} defaultUrl The url or a function to call to get the url
+         */
+        setDefaultUrl : function(defaultUrl){
+            this.defaultUrl = defaultUrl;
+        },
+
+        /**
+         * Get the Element this Updater is bound to
+         * @return {Ext.Element} The element
+         */
+        getEl : function(){
+            return this.el;
+        },
+
+        /**
+         * Performs an <b>asynchronous</b> request, updating this element with the response.
+         * If params are specified it uses POST, otherwise it uses GET.<br><br>
+         * <b>Note:</b> Due to the asynchronous nature of remote server requests, the Element
+         * will not have been fully updated when the function returns. To post-process the returned
+         * data, use the callback option, or an <b><code>update</code></b> event handler.
+         * @param {Object} options A config object containing any of the following options:<ul>
+         * <li>url : <b>String/Function</b><p class="sub-desc">The URL to request or a function which
+         * <i>returns</i> the URL (defaults to the value of {@link Ext.Ajax#url} if not specified).</p></li>
+         * <li>method : <b>String</b><p class="sub-desc">The HTTP method to
+         * use. Defaults to POST if the <code>params</code> argument is present, otherwise GET.</p></li>
+         * <li>params : <b>String/Object/Function</b><p class="sub-desc">The
+         * parameters to pass to the server (defaults to none). These may be specified as a url-encoded
+         * string, or as an object containing properties which represent parameters,
+         * or as a function, which returns such an object.</p></li>
+         * <li>scripts : <b>Boolean</b><p class="sub-desc">If <code>true</code>
+         * any &lt;script&gt; tags embedded in the response text will be extracted
+         * and executed (defaults to {@link Ext.Updater.defaults#loadScripts}). If this option is specified,
+         * the callback will be called <i>after</i> the execution of the scripts.</p></li>
+         * <li>callback : <b>Function</b><p class="sub-desc">A function to
+         * be called when the response from the server arrives. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li>
+         * <li><b>options</b> : Object<p class="sub-desc">The config object passed to the update call.</p></li></ul>
+         * </p></li>
+         * <li>scope : <b>Object</b><p class="sub-desc">The scope in which
+         * to execute the callback (The callback's <code>this</code> reference.) If the
+         * <code>params</code> argument is a function, this scope is used for that function also.</p></li>
+         * <li>discardUrl : <b>Boolean</b><p class="sub-desc">By default, the URL of this request becomes
+         * the default URL for this Updater object, and will be subsequently used in {@link #refresh}
+         * calls.  To bypass this behavior, pass <code>discardUrl:true</code> (defaults to false).</p></li>
+         * <li>timeout : <b>Number</b><p class="sub-desc">The number of seconds to wait for a response before
+         * timing out (defaults to {@link Ext.Updater.defaults#timeout}).</p></li>
+         * <li>text : <b>String</b><p class="sub-desc">The text to use as the innerHTML of the
+         * {@link Ext.Updater.defaults#indicatorText} div (defaults to 'Loading...').  To replace the entire div, not
+         * just the text, override {@link Ext.Updater.defaults#indicatorText} directly.</p></li>
+         * <li>nocache : <b>Boolean</b><p class="sub-desc">Only needed for GET
+         * requests, this option causes an extra, auto-generated parameter to be appended to the request
+         * to defeat caching (defaults to {@link Ext.Updater.defaults#disableCaching}).</p></li></ul>
+         * <p>
+         * For example:
+    <pre><code>
+    um.update({
+        url: "your-url.php",
+        params: {param1: "foo", param2: "bar"}, // or a URL encoded string
+        callback: yourFunction,
+        scope: yourObject, //(optional scope)
+        discardUrl: true,
+        nocache: true,
+        text: "Loading...",
+        timeout: 60,
+        scripts: false // Save time by avoiding RegExp execution.
+    });
+    </code></pre>
+         */
+        update : function(url, params, callback, discardUrl){
+            var me = this,
+                cfg,
+                callerScope;
+
+            if(me.fireEvent(BEFOREUPDATE, me.el, url, params) !== false){
+                if(Ext.isObject(url)){ // must be config object
+                    cfg = url;
+                    url = cfg.url;
+                    params = params || cfg.params;
+                    callback = callback || cfg.callback;
+                    discardUrl = discardUrl || cfg.discardUrl;
+                    callerScope = cfg.scope;
+                    if(!Ext.isEmpty(cfg.nocache)){me.disableCaching = cfg.nocache;};
+                    if(!Ext.isEmpty(cfg.text)){me.indicatorText = '<div class="loading-indicator">'+cfg.text+"</div>";};
+                    if(!Ext.isEmpty(cfg.scripts)){me.loadScripts = cfg.scripts;};
+                    if(!Ext.isEmpty(cfg.timeout)){me.timeout = cfg.timeout;};
+                }
+                me.showLoading();
+
+                if(!discardUrl){
+                    me.defaultUrl = url;
+                }
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+
+                var o = Ext.apply({}, {
+                    url : url,
+                    params: (Ext.isFunction(params) && callerScope) ? params.createDelegate(callerScope) : params,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    callback: undefined,
+                    timeout: (me.timeout*1000),
+                    disableCaching: me.disableCaching,
+                    argument: {
+                        "options": cfg,
+                        "url": url,
+                        "form": null,
+                        "callback": callback,
+                        "scope": callerScope || window,
+                        "params": params
+                    }
+                }, cfg);
+
+                me.transaction = Ext.Ajax.request(o);
+            }
+        },
+
+        /**
+         * <p>Performs an asynchronous form post, updating this element with the response. If the form has the attribute
+         * enctype="<a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>", it assumes it's a file upload.
+         * Uses this.sslBlankUrl for SSL file uploads to prevent IE security warning.</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <code>&lt;form></code> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <code>&lt;iframe></code> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>Be aware that file upload packets, sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * @param {String/HTMLElement} form The form Id or form element
+         * @param {String} url (optional) The url to pass the form to. If omitted the action attribute on the form will be used.
+         * @param {Boolean} reset (optional) Whether to try to reset the form after the update
+         * @param {Function} callback (optional) Callback when transaction is complete. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li></ul>
+         */
+        formUpdate : function(form, url, reset, callback){
+            var me = this;
+            if(me.fireEvent(BEFOREUPDATE, me.el, form, url) !== false){
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+                form = Ext.getDom(form);
+                me.transaction = Ext.Ajax.request({
+                    form: form,
+                    url:url,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    timeout: (me.timeout*1000),
+                    argument: {
+                        "url": url,
+                        "form": form,
+                        "callback": callback,
+                        "reset": reset
+                    }
+                });
+                me.showLoading.defer(1, me);
+            }
+        },
+
+        /**
+         * Set this element to auto refresh.  Can be canceled by calling {@link #stopAutoRefresh}.
+         * @param {Number} interval How often to update (in seconds).
+         * @param {String/Object/Function} url (optional) The url for this request, a config object in the same format
+         * supported by {@link #load}, or a function to call to get the url (defaults to the last used url).  Note that while
+         * the url used in a load call can be reused by this method, other load config options will not be reused and must be
+         * sepcified as part of a config object passed as this paramter if needed.
+         * @param {String/Object} params (optional) The parameters to pass as either a url encoded string
+         * "&param1=1&param2=2" or as an object {param1: 1, param2: 2}
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         * @param {Boolean} refreshNow (optional) Whether to execute the refresh now, or wait the interval
+         */
+        startAutoRefresh : function(interval, url, params, callback, refreshNow){
+            var me = this;
+            if(refreshNow){
+                me.update(url || me.defaultUrl, params, callback, true);
+            }
+            if(me.autoRefreshProcId){
+                clearInterval(me.autoRefreshProcId);
+            }
+            me.autoRefreshProcId = setInterval(me.update.createDelegate(me, [url || me.defaultUrl, params, callback, true]), interval * 1000);
+        },
+
+        /**
+         * Stop auto refresh on this element.
+         */
+        stopAutoRefresh : function(){
+            if(this.autoRefreshProcId){
+                clearInterval(this.autoRefreshProcId);
+                delete this.autoRefreshProcId;
+            }
+        },
+
+        /**
+         * Returns true if the Updater is currently set to auto refresh its content (see {@link #startAutoRefresh}), otherwise false.
+         */
+        isAutoRefreshing : function(){
+           return !!this.autoRefreshProcId;
+        },
+
+        /**
+         * Display the element's "loading" state. By default, the element is updated with {@link #indicatorText}. This
+         * method may be overridden to perform a custom action while this Updater is actively updating its contents.
+         */
+        showLoading : function(){
+            if(this.showLoadIndicator){
+                this.el.dom.innerHTML = this.indicatorText;
+            }
+        },
+
+        /**
+         * Aborts the currently executing transaction, if any.
+         */
+        abort : function(){
+            if(this.transaction){
+                Ext.Ajax.abort(this.transaction);
+            }
+        },
+
+        /**
+         * Returns true if an update is in progress, otherwise false.
+         * @return {Boolean}
+         */
+        isUpdating : function(){
+            return this.transaction ? Ext.Ajax.isLoading(this.transaction) : false;
+        },
+
+        /**
+         * Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         */
+        refresh : function(callback){
+            if(this.defaultUrl){
+                this.update(this.defaultUrl, null, callback, true);
+            }
+        }
+    };
+}());
+
+/**
+ * @class Ext.Updater.defaults
+ * The defaults collection enables customizing the default properties of Updater
+ */
+Ext.Updater.defaults = {
+   /**
+     * Timeout for requests or form posts in seconds (defaults to 30 seconds).
+     * @type Number
+     */
+    timeout : 30,
+    /**
+     * True to append a unique parameter to GET requests to disable caching (defaults to false).
+     * @type Boolean
+     */
+    disableCaching : false,
+    /**
+     * Whether or not to show {@link #indicatorText} during loading (defaults to true).
+     * @type Boolean
+     */
+    showLoadIndicator : true,
+    /**
+     * Text for loading indicator (defaults to '&lt;div class="loading-indicator"&gt;Loading...&lt;/div&gt;').
+     * @type String
+     */
+    indicatorText : '<div class="loading-indicator">Loading...</div>',
+     /**
+     * True to process scripts by default (defaults to false).
+     * @type Boolean
+     */
+    loadScripts : false,
+    /**
+    * Blank page URL to use with SSL file uploads (defaults to {@link Ext#SSL_SECURE_URL} if set, or "javascript:false").
+    * @type String
+    */
+    sslBlankUrl : Ext.SSL_SECURE_URL
+};
+
+
+/**
+ * Static convenience method. <b>This method is deprecated in favor of el.load({url:'foo.php', ...})</b>.
+ * Usage:
+ * <pre><code>Ext.Updater.updateElement("my-div", "stuff.php");</code></pre>
+ * @param {Mixed} el The element to update
+ * @param {String} url The url
+ * @param {String/Object} params (optional) Url encoded param string or an object of name/value pairs
+ * @param {Object} options (optional) A config object with any of the Updater properties you want to set - for
+ * example: {disableCaching:true, indicatorText: "Loading data..."}
+ * @static
+ * @deprecated
+ * @member Ext.Updater
+ */
+Ext.Updater.updateElement = function(el, url, params, options){
+    var um = Ext.get(el).getUpdater();
+    Ext.apply(um, options);
+    um.update(url, params, options ? options.callback : null);
+};
+
+/**
+ * @class Ext.Updater.BasicRenderer
+ * <p>This class is a base class implementing a simple render method which updates an element using results from an Ajax request.</p>
+ * <p>The BasicRenderer updates the element's innerHTML with the responseText. To perform a custom render (i.e. XML or JSON processing),
+ * create an object with a conforming {@link #render} method and pass it to setRenderer on the Updater.</p>
+ */
+Ext.Updater.BasicRenderer = function(){};
+
+Ext.Updater.BasicRenderer.prototype = {
+    /**
+     * This method is called when an Ajax response is received, and an Element needs updating.
+     * @param {Ext.Element} el The element being rendered
+     * @param {Object} xhr The XMLHttpRequest object
+     * @param {Updater} updateManager The calling update manager
+     * @param {Function} callback A callback that will need to be called if loadScripts is true on the Updater
+     */
+     render : function(el, response, updateManager, callback){
+        el.update(response.responseText, updateManager.loadScripts, callback);
+    }
+};/**
+ * @class Date
+ *
+ * The date parsing and formatting syntax contains a subset of
+ * <a href="http://www.php.net/date">PHP's date() function</a>, and the formats that are
+ * supported will provide results equivalent to their PHP versions.
+ *
+ * The following is a list of all currently supported formats:
+ * <pre>
+Format  Description                                                               Example returned values
+------  -----------------------------------------------------------------------   -----------------------
+  d     Day of the month, 2 digits with leading zeros                             01 to 31
+  D     A short textual representation of the day of the week                     Mon to Sun
+  j     Day of the month without leading zeros                                    1 to 31
+  l     A full textual representation of the day of the week                      Sunday to Saturday
+  N     ISO-8601 numeric representation of the day of the week                    1 (for Monday) through 7 (for Sunday)
+  S     English ordinal suffix for the day of the month, 2 characters             st, nd, rd or th. Works well with j
+  w     Numeric representation of the day of the week                             0 (for Sunday) to 6 (for Saturday)
+  z     The day of the year (starting from 0)                                     0 to 364 (365 in leap years)
+  W     ISO-8601 week number of year, weeks starting on Monday                    01 to 53
+  F     A full textual representation of a month, such as January or March        January to December
+  m     Numeric representation of a month, with leading zeros                     01 to 12
+  M     A short textual representation of a month                                 Jan to Dec
+  n     Numeric representation of a month, without leading zeros                  1 to 12
+  t     Number of days in the given month                                         28 to 31
+  L     Whether it's a leap year                                                  1 if it is a leap year, 0 otherwise.
+  o     ISO-8601 year number (identical to (Y), but if the ISO week number (W)    Examples: 1998 or 2004
+        belongs to the previous or next year, that year is used instead)
+  Y     A full numeric representation of a year, 4 digits                         Examples: 1999 or 2003
+  y     A two digit representation of a year                                      Examples: 99 or 03
+  a     Lowercase Ante meridiem and Post meridiem                                 am or pm
+  A     Uppercase Ante meridiem and Post meridiem                                 AM or PM
+  g     12-hour format of an hour without leading zeros                           1 to 12
+  G     24-hour format of an hour without leading zeros                           0 to 23
+  h     12-hour format of an hour with leading zeros                              01 to 12
+  H     24-hour format of an hour with leading zeros                              00 to 23
+  i     Minutes, with leading zeros                                               00 to 59
+  s     Seconds, with leading zeros                                               00 to 59
+  u     Decimal fraction of a second                                              Examples:
+        (minimum 1 digit, arbitrary number of digits allowed)                     001 (i.e. 0.001s) or
+                                                                                  100 (i.e. 0.100s) or
+                                                                                  999 (i.e. 0.999s) or
+                                                                                  999876543210 (i.e. 0.999876543210s)
+  O     Difference to Greenwich time (GMT) in hours and minutes                   Example: +1030
+  P     Difference to Greenwich time (GMT) with colon between hours and minutes   Example: -08:00
+  T     Timezone abbreviation of the machine running the code                     Examples: EST, MDT, PDT ...
+  Z     Timezone offset in seconds (negative if west of UTC, positive if east)    -43200 to 50400
+  c     ISO 8601 date
+        Notes:                                                                    Examples:
+        1) If unspecified, the month / day defaults to the current month / day,   1991 or
+           the time defaults to midnight, while the timezone defaults to the      1992-10 or
+           browser's timezone. If a time is specified, it must include both hours 1993-09-20 or
+           and minutes. The "T" delimiter, seconds, milliseconds and timezone     1994-08-19T16:20+01:00 or
+           are optional.                                                          1995-07-18T17:21:28-02:00 or
+        2) The decimal fraction of a second, if specified, must contain at        1996-06-17T18:22:29.98765+03:00 or
+           least 1 digit (there is no limit to the maximum number                 1997-05-16T19:23:30,12345-0400 or
+           of digits allowed), and may be delimited by either a '.' or a ','      1998-04-15T20:24:31.2468Z or
+        Refer to the examples on the right for the various levels of              1999-03-14T20:24:32Z or
+        date-time granularity which are supported, or see                         2000-02-13T21:25:33
+        http://www.w3.org/TR/NOTE-datetime for more info.                         2001-01-12 22:26:34
+  U     Seconds since the Unix Epoch (January 1 1970 00:00:00 GMT)                1193432466 or -2138434463
+  M$    Microsoft AJAX serialized dates                                           \/Date(1238606590509)\/ (i.e. UTC milliseconds since epoch) or
+                                                                                  \/Date(1238606590509+0800)\/
+</pre>
+ *
+ * Example usage (note that you must escape format specifiers with '\\' to render them as character literals):
+ * <pre><code>
+// Sample date:
+// 'Wed Jan 10 2007 15:05:01 GMT-0600 (Central Standard Time)'
+
+var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
+document.write(dt.format('Y-m-d'));                           // 2007-01-10
+document.write(dt.format('F j, Y, g:i a'));                   // January 10, 2007, 3:05 pm
+document.write(dt.format('l, \\t\\he jS \\of F Y h:i:s A'));  // Wednesday, the 10th of January 2007 03:05:01 PM
+</code></pre>
+ *
+ * Here are some standard date/time patterns that you might find helpful.  They
+ * are not part of the source of Date.js, but to use them you can simply copy this
+ * block of code into any script that is included after Date.js and they will also become
+ * globally available on the Date object.  Feel free to add or remove patterns as needed in your code.
+ * <pre><code>
+Date.patterns = {
+    ISO8601Long:"Y-m-d H:i:s",
+    ISO8601Short:"Y-m-d",
+    ShortDate: "n/j/Y",
+    LongDate: "l, F d, Y",
+    FullDateTime: "l, F d, Y g:i:s A",
+    MonthDay: "F d",
+    ShortTime: "g:i A",
+    LongTime: "g:i:s A",
+    SortableDateTime: "Y-m-d\\TH:i:s",
+    UniversalSortableDateTime: "Y-m-d H:i:sO",
+    YearMonth: "F, Y"
+};
+</code></pre>
+ *
+ * Example usage:
+ * <pre><code>
+var dt = new Date();
+document.write(dt.format(Date.patterns.ShortDate));
+</code></pre>
+ * <p>Developer-written, custom formats may be used by supplying both a formatting and a parsing function
+ * which perform to specialized requirements. The functions are stored in {@link #parseFunctions} and {@link #formatFunctions}.</p>
+ */
+
+/*
+ * Most of the date-formatting functions below are the excellent work of Baron Schwartz.
+ * (see http://www.xaprb.com/blog/2005/12/12/javascript-closures-for-runtime-efficiency/)
+ * They generate precompiled functions from format patterns instead of parsing and
+ * processing each pattern every time a date is formatted. These functions are available
+ * on every Date object.
+ */
+
+(function() {
+
+/**
+ * Global flag which determines if strict date parsing should be used.
+ * Strict date parsing will not roll-over invalid dates, which is the
+ * default behaviour of javascript Date objects.
+ * (see {@link #parseDate} for more information)
+ * Defaults to <tt>false</tt>.
+ * @static
+ * @type Boolean
+*/
+Date.useStrict = false;
+
+
+// create private copy of Ext's String.format() method
+// - to remove unnecessary dependency
+// - to resolve namespace conflict with M$-Ajax's implementation
+function xf(format) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return format.replace(/\{(\d+)\}/g, function(m, i) {
+        return args[i];
+    });
+}
+
+
+// private
+Date.formatCodeToRegex = function(character, currentGroup) {
+    // Note: currentGroup - position in regex result array (see notes for Date.parseCodes below)
+    var p = Date.parseCodes[character];
+
+    if (p) {
+      p = typeof p == 'function'? p() : p;
+      Date.parseCodes[character] = p; // reassign function result to prevent repeated execution
+    }
+
+    return p ? Ext.applyIf({
+      c: p.c ? xf(p.c, currentGroup || "{0}") : p.c
+    }, p) : {
+        g:0,
+        c:null,
+        s:Ext.escapeRe(character) // treat unrecognised characters as literals
+    };
+};
+
+// private shorthand for Date.formatCodeToRegex since we'll be using it fairly often
+var $f = Date.formatCodeToRegex;
+
+Ext.apply(Date, {
+    /**
+     * <p>An object hash in which each property is a date parsing function. The property name is the
+     * format string which that function parses.</p>
+     * <p>This object is automatically populated with date parsing functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom parsing functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #parseDate}.<p>
+     * <p>Example:</p><pre><code>
+Date.parseFunctions['x-date-format'] = myDateParser;
+</code></pre>
+     * <p>A parsing function should return a Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : String<div class="sub-desc">The date string to parse.</div></li>
+     * <li><code>strict</code> : Boolean<div class="sub-desc">True to validate date strings while parsing
+     * (i.e. prevent javascript Date "rollover") (The default must be false).
+     * Invalid date strings should return null when parsed.</div></li>
+     * </ul></div></p>
+     * <p>To enable Dates to also be <i>formatted</i> according to that format, a corresponding
+     * formatting function must be placed into the {@link #formatFunctions} property.
+     * @property parseFunctions
+     * @static
+     * @type Object
+     */
+    parseFunctions: {
+        "M$": function(input, strict) {
+            // note: the timezone offset is ignored since the M$ Ajax server sends
+            // a UTC milliseconds-since-Unix-epoch value (negative values are allowed)
+            var re = new RegExp('\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/');
+            var r = (input || '').match(re);
+            return r? new Date(((r[1] || '') + r[2]) * 1) : null;
+        }
+    },
+    parseRegexes: [],
+
+    /**
+     * <p>An object hash in which each property is a date formatting function. The property name is the
+     * format string which corresponds to the produced formatted date string.</p>
+     * <p>This object is automatically populated with date formatting functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom formatting functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #format}. Example:</p><pre><code>
+Date.formatFunctions['x-date-format'] = myDateFormatter;
+</code></pre>
+     * <p>A formatting function should return a string representation of the passed Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : Date<div class="sub-desc">The Date to format.</div></li>
+     * </ul></div></p>
+     * <p>To enable date strings to also be <i>parsed</i> according to that format, a corresponding
+     * parsing function must be placed into the {@link #parseFunctions} property.
+     * @property formatFunctions
+     * @static
+     * @type Object
+     */
+    formatFunctions: {
+        "M$": function() {
+            // UTC milliseconds since Unix epoch (M$-AJAX serialized date format (MRSF))
+            return '\\/Date(' + this.getTime() + ')\\/';
+        }
+    },
+
+    y2kYear : 50,
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MILLI : "ms",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    SECOND : "s",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MINUTE : "mi",
+
+    /** Date interval constant
+     * @static
+     * @type String
+     */
+    HOUR : "h",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    DAY : "d",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MONTH : "mo",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    YEAR : "y",
+
+    /**
+     * <p>An object hash containing default date values used during date parsing.</p>
+     * <p>The following properties are available:<div class="mdetail-params"><ul>
+     * <li><code>y</code> : Number<div class="sub-desc">The default year value. (defaults to undefined)</div></li>
+     * <li><code>m</code> : Number<div class="sub-desc">The default 1-based month value. (defaults to undefined)</div></li>
+     * <li><code>d</code> : Number<div class="sub-desc">The default day value. (defaults to undefined)</div></li>
+     * <li><code>h</code> : Number<div class="sub-desc">The default hour value. (defaults to undefined)</div></li>
+     * <li><code>i</code> : Number<div class="sub-desc">The default minute value. (defaults to undefined)</div></li>
+     * <li><code>s</code> : Number<div class="sub-desc">The default second value. (defaults to undefined)</div></li>
+     * <li><code>ms</code> : Number<div class="sub-desc">The default millisecond value. (defaults to undefined)</div></li>
+     * </ul></div></p>
+     * <p>Override these properties to customize the default date values used by the {@link #parseDate} method.</p>
+     * <p><b>Note: In countries which experience Daylight Saving Time (i.e. DST), the <tt>h</tt>, <tt>i</tt>, <tt>s</tt>
+     * and <tt>ms</tt> properties may coincide with the exact time in which DST takes effect.
+     * It is the responsiblity of the developer to account for this.</b></p>
+     * Example Usage:
+     * <pre><code>
+// set default day value to the first day of the month
+Date.defaults.d = 1;
+
+// parse a February date string containing only year and month values.
+// setting the default day value to 1 prevents weird date rollover issues
+// when attempting to parse the following date string on, for example, March 31st 2009.
+Date.parseDate('2009-02', 'Y-m'); // returns a Date object representing February 1st 2009
+</code></pre>
+     * @property defaults
+     * @static
+     * @type Object
+     */
+    defaults: {},
+
+    /**
+     * An array of textual day names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.dayNames = [
+    'SundayInYourLang',
+    'MondayInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    dayNames : [
+        "Sunday",
+        "Monday",
+        "Tuesday",
+        "Wednesday",
+        "Thursday",
+        "Friday",
+        "Saturday"
+    ],
+
+    /**
+     * An array of textual month names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNames = [
+    'JanInYourLang',
+    'FebInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    monthNames : [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July",
+        "August",
+        "September",
+        "October",
+        "November",
+        "December"
+    ],
+
+    /**
+     * An object hash of zero-based javascript month numbers (with short month names as keys. note: keys are case-sensitive).
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNumbers = {
+    'ShortJanNameInYourLang':0,
+    'ShortFebNameInYourLang':1,
+    ...
+};
+</code></pre>
+     * @type Object
+     * @static
+     */
+    monthNumbers : {
+        Jan:0,
+        Feb:1,
+        Mar:2,
+        Apr:3,
+        May:4,
+        Jun:5,
+        Jul:6,
+        Aug:7,
+        Sep:8,
+        Oct:9,
+        Nov:10,
+        Dec:11
+    },
+
+    /**
+     * Get the short month name for the given month number.
+     * Override this function for international dates.
+     * @param {Number} month A zero-based javascript month number.
+     * @return {String} The short month name.
+     * @static
+     */
+    getShortMonthName : function(month) {
+        return Date.monthNames[month].substring(0, 3);
+    },
+
+    /**
+     * Get the short day name for the given day number.
+     * Override this function for international dates.
+     * @param {Number} day A zero-based javascript day number.
+     * @return {String} The short day name.
+     * @static
+     */
+    getShortDayName : function(day) {
+        return Date.dayNames[day].substring(0, 3);
+    },
+
+    /**
+     * Get the zero-based javascript month number for the given short/full month name.
+     * Override this function for international dates.
+     * @param {String} name The short/full month name.
+     * @return {Number} The zero-based javascript month number.
+     * @static
+     */
+    getMonthNumber : function(name) {
+        // handle camel casing for english month names (since the keys for the Date.monthNumbers hash are case sensitive)
+        return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+    },
+    
+    /**
+     * Checks if the specified format contains hour information
+     * @param {Object} format The format to check
+     * @return {Boolean} True if the format contains hour information
+     * @static
+     */
+    formatContainsHourInfo : (function(){
+        var stripEscapeRe = /(\\.)/g,
+            hourInfoRe = /([gGhHisucUOPZ]|M\$)/;
+        return function(format){
+            return hourInfoRe.test(format.replace(stripEscapeRe, ''));
+        };
+    })(),
+
+    /**
+     * The base format-code to formatting-function hashmap used by the {@link #format} method.
+     * Formatting functions are strings (or functions which return strings) which
+     * will return the appropriate value when evaluated in the context of the Date object
+     * from which the {@link #format} method is called.
+     * Add to / override these mappings for custom date formatting.
+     * Note: Date.format() treats characters as literals if an appropriate mapping cannot be found.
+     * Example:
+     * <pre><code>
+Date.formatCodes.x = "String.leftPad(this.getDate(), 2, '0')";
+(new Date()).format("X"); // returns the current day of the month
+</code></pre>
+     * @type Object
+     * @static
+     */
+    formatCodes : {
+        d: "String.leftPad(this.getDate(), 2, '0')",
+        D: "Date.getShortDayName(this.getDay())", // get localised short day name
+        j: "this.getDate()",
+        l: "Date.dayNames[this.getDay()]",
+        N: "(this.getDay() ? this.getDay() : 7)",
+        S: "this.getSuffix()",
+        w: "this.getDay()",
+        z: "this.getDayOfYear()",
+        W: "String.leftPad(this.getWeekOfYear(), 2, '0')",
+        F: "Date.monthNames[this.getMonth()]",
+        m: "String.leftPad(this.getMonth() + 1, 2, '0')",
+        M: "Date.getShortMonthName(this.getMonth())", // get localised short month name
+        n: "(this.getMonth() + 1)",
+        t: "this.getDaysInMonth()",
+        L: "(this.isLeapYear() ? 1 : 0)",
+        o: "(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",
+        Y: "String.leftPad(this.getFullYear(), 4, '0')",
+        y: "('' + this.getFullYear()).substring(2, 4)",
+        a: "(this.getHours() < 12 ? 'am' : 'pm')",
+        A: "(this.getHours() < 12 ? 'AM' : 'PM')",
+        g: "((this.getHours() % 12) ? this.getHours() % 12 : 12)",
+        G: "this.getHours()",
+        h: "String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",
+        H: "String.leftPad(this.getHours(), 2, '0')",
+        i: "String.leftPad(this.getMinutes(), 2, '0')",
+        s: "String.leftPad(this.getSeconds(), 2, '0')",
+        u: "String.leftPad(this.getMilliseconds(), 3, '0')",
+        O: "this.getGMTOffset()",
+        P: "this.getGMTOffset(true)",
+        T: "this.getTimezone()",
+        Z: "(this.getTimezoneOffset() * -60)",
+
+        c: function() { // ISO-8601 -- GMT format
+            for (var c = "Y-m-dTH:i:sP", code = [], i = 0, l = c.length; i < l; ++i) {
+                var e = c.charAt(i);
+                code.push(e == "T" ? "'T'" : Date.getFormatCode(e)); // treat T as a character literal
+            }
+            return code.join(" + ");
+        },
+        /*
+        c: function() { // ISO-8601 -- UTC format
+            return [
+              "this.getUTCFullYear()", "'-'",
+              "String.leftPad(this.getUTCMonth() + 1, 2, '0')", "'-'",
+              "String.leftPad(this.getUTCDate(), 2, '0')",
+              "'T'",
+              "String.leftPad(this.getUTCHours(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCMinutes(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCSeconds(), 2, '0')",
+              "'Z'"
+            ].join(" + ");
+        },
+        */
+
+        U: "Math.round(this.getTime() / 1000)"
+    },
+
+    /**
+     * Checks if the passed Date parameters will cause a javascript Date "rollover".
+     * @param {Number} year 4-digit year
+     * @param {Number} month 1-based month-of-year
+     * @param {Number} day Day of month
+     * @param {Number} hour (optional) Hour
+     * @param {Number} minute (optional) Minute
+     * @param {Number} second (optional) Second
+     * @param {Number} millisecond (optional) Millisecond
+     * @return {Boolean} true if the passed parameters do not cause a Date "rollover", false otherwise.
+     * @static
+     */
+    isValid : function(y, m, d, h, i, s, ms) {
+        // setup defaults
+        h = h || 0;
+        i = i || 0;
+        s = s || 0;
+        ms = ms || 0;
+
+        // Special handling for year < 100
+        var dt = new Date(y < 100 ? 100 : y, m - 1, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);
+
+        return y == dt.getFullYear() &&
+            m == dt.getMonth() + 1 &&
+            d == dt.getDate() &&
+            h == dt.getHours() &&
+            i == dt.getMinutes() &&
+            s == dt.getSeconds() &&
+            ms == dt.getMilliseconds();
+    },
+
+    /**
+     * Parses the passed string using the specified date format.
+     * Note that this function expects normal calendar dates, meaning that months are 1-based (i.e. 1 = January).
+     * The {@link #defaults} hash will be used for any date value (i.e. year, month, day, hour, minute, second or millisecond)
+     * which cannot be found in the passed string. If a corresponding default date value has not been specified in the {@link #defaults} hash,
+     * the current date's year, month, day or DST-adjusted zero-hour time value will be used instead.
+     * Keep in mind that the input date string must precisely match the specified format string
+     * in order for the parse operation to be successful (failed parse operations return a null value).
+     * <p>Example:</p><pre><code>
+//dt = Fri May 25 2007 (current date)
+var dt = new Date();
+
+//dt = Thu May 25 2006 (today&#39;s month/day in 2006)
+dt = Date.parseDate("2006", "Y");
+
+//dt = Sun Jan 15 2006 (all date parts specified)
+dt = Date.parseDate("2006-01-15", "Y-m-d");
+
+//dt = Sun Jan 15 2006 15:20:01
+dt = Date.parseDate("2006-01-15 3:20:01 PM", "Y-m-d g:i:s A");
+
+// attempt to parse Sun Feb 29 2006 03:20:01 in strict mode
+dt = Date.parseDate("2006-02-29 03:20:01", "Y-m-d H:i:s", true); // returns null
+</code></pre>
+     * @param {String} input The raw date string.
+     * @param {String} format The expected date string format.
+     * @param {Boolean} strict (optional) True to validate date strings while parsing (i.e. prevents javascript Date "rollover")
+                        (defaults to false). Invalid date strings will return null when parsed.
+     * @return {Date} The parsed Date.
+     * @static
+     */
+    parseDate : function(input, format, strict) {
+        var p = Date.parseFunctions;
+        if (p[format] == null) {
+            Date.createParser(format);
+        }
+        return p[format](input, Ext.isDefined(strict) ? strict : Date.useStrict);
+    },
+
+    // private
+    getFormatCode : function(character) {
+        var f = Date.formatCodes[character];
+
+        if (f) {
+          f = typeof f == 'function'? f() : f;
+          Date.formatCodes[character] = f; // reassign function result to prevent repeated execution
+        }
+
+        // note: unknown characters are treated as literals
+        return f || ("'" + String.escape(character) + "'");
+    },
+
+    // private
+    createFormat : function(format) {
+        var code = [],
+            special = false,
+            ch = '';
+
+        for (var i = 0; i < format.length; ++i) {
+            ch = format.charAt(i);
+            if (!special && ch == "\\") {
+                special = true;
+            } else if (special) {
+                special = false;
+                code.push("'" + String.escape(ch) + "'");
+            } else {
+                code.push(Date.getFormatCode(ch));
+            }
+        }
+        Date.formatFunctions[format] = new Function("return " + code.join('+'));
+    },
+
+    // private
+    createParser : function() {
+        var code = [
+            "var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,",
+                "def = Date.defaults,",
+                "results = String(input).match(Date.parseRegexes[{0}]);", // either null, or an array of matched strings
+
+            "if(results){",
+                "{1}",
+
+                "if(u != null){", // i.e. unix time is defined
+                    "v = new Date(u * 1000);", // give top priority to UNIX time
+                "}else{",
+                    // create Date object representing midnight of the current day;
+                    // this will provide us with our date defaults
+                    // (note: clearTime() handles Daylight Saving Time automatically)
+                    "dt = (new Date()).clearTime();",
+
+                    // date calculations (note: these calculations create a dependency on Ext.num())
+                    "y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));",
+                    "m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));",
+                    "d = Ext.num(d, Ext.num(def.d, dt.getDate()));",
+
+                    // time calculations (note: these calculations create a dependency on Ext.num())
+                    "h  = Ext.num(h, Ext.num(def.h, dt.getHours()));",
+                    "i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));",
+                    "s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));",
+                    "ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));",
+
+                    "if(z >= 0 && y >= 0){",
+                        // both the year and zero-based day of year are defined and >= 0.
+                        // these 2 values alone provide sufficient info to create a full date object
+
+                        // create Date object representing January 1st for the given year
+                        // handle years < 100 appropriately
+                        "v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+
+                        // then add day of year, checking for Date "rollover" if necessary
+                        "v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);",
+                    "}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){", // check for Date "rollover"
+                        "v = null;", // invalid date, so return null
+                    "}else{",
+                        // plain old Date object
+                        // handle years < 100 properly
+                        "v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+                    "}",
+                "}",
+            "}",
+
+            "if(v){",
+                // favour UTC offset over GMT offset
+                "if(zz != null){",
+                    // reset to UTC, then add offset
+                    "v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);",
+                "}else if(o){",
+                    // reset to GMT, then add offset
+                    "v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));",
+                "}",
+            "}",
+
+            "return v;"
+        ].join('\n');
+
+        return function(format) {
+            var regexNum = Date.parseRegexes.length,
+                currentGroup = 1,
+                calc = [],
+                regex = [],
+                special = false,
+                ch = "",
+                i = 0,
+                obj,
+                last;
+
+            for (; i < format.length; ++i) {
+                ch = format.charAt(i);
+                if (!special && ch == "\\") {
+                    special = true;
+                } else if (special) {
+                    special = false;
+                    regex.push(String.escape(ch));
+                } else {
+                    obj = $f(ch, currentGroup);
+                    currentGroup += obj.g;
+                    regex.push(obj.s);
+                    if (obj.g && obj.c) {
+                        if (obj.calcLast) {
+                            last = obj.c;
+                        } else {
+                            calc.push(obj.c);
+                        }
+                    }
+                }
+            }
+            
+            if (last) {
+                calc.push(last);
+            }
+
+            Date.parseRegexes[regexNum] = new RegExp("^" + regex.join('') + "$", 'i');
+            Date.parseFunctions[format] = new Function("input", "strict", xf(code, regexNum, calc.join('')));
+        };
+    }(),
+
+    // private
+    parseCodes : {
+        /*
+         * Notes:
+         * g = {Number} calculation group (0 or 1. only group 1 contributes to date calculations.)
+         * c = {String} calculation method (required for group 1. null for group 0. {0} = currentGroup - position in regex result array)
+         * s = {String} regex pattern. all matches are stored in results[], and are accessible by the calculation mapped to 'c'
+         */
+        d: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // day of month with leading zeroes (01 - 31)
+        },
+        j: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // day of month without leading zeroes (1 - 31)
+        },
+        D: function() {
+            for (var a = [], i = 0; i < 7; a.push(Date.getShortDayName(i)), ++i); // get localised short day names
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + a.join("|") +")"
+            };
+        },
+        l: function() {
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + Date.dayNames.join("|") + ")"
+            };
+        },
+        N: {
+            g:0,
+            c:null,
+            s:"[1-7]" // ISO-8601 day number (1 (monday) - 7 (sunday))
+        },
+        S: {
+            g:0,
+            c:null,
+            s:"(?:st|nd|rd|th)"
+        },
+        w: {
+            g:0,
+            c:null,
+            s:"[0-6]" // javascript day number (0 (sunday) - 6 (saturday))
+        },
+        z: {
+            g:1,
+            c:"z = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,3})" // day of the year (0 - 364 (365 in leap years))
+        },
+        W: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // ISO-8601 week number (with leading zero)
+        },
+        F: function() {
+            return {
+                g:1,
+                c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n", // get localised month number
+                s:"(" + Date.monthNames.join("|") + ")"
+            };
+        },
+        M: function() {
+            for (var a = [], i = 0; i < 12; a.push(Date.getShortMonthName(i)), ++i); // get localised short month names
+            return Ext.applyIf({
+                s:"(" + a.join("|") + ")"
+            }, $f("F"));
+        },
+        m: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{2})" // month number with leading zeros (01 - 12)
+        },
+        n: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{1,2})" // month number without leading zeros (1 - 12)
+        },
+        t: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // no. of days in the month (28 - 31)
+        },
+        L: {
+            g:0,
+            c:null,
+            s:"(?:1|0)"
+        },
+        o: function() {
+            return $f("Y");
+        },
+        Y: {
+            g:1,
+            c:"y = parseInt(results[{0}], 10);\n",
+            s:"(\\d{4})" // 4-digit year
+        },
+        y: {
+            g:1,
+            c:"var ty = parseInt(results[{0}], 10);\n"
+                + "y = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n", // 2-digit year
+            s:"(\\d{1,2})"
+        },
+        /**
+         * In the am/pm parsing routines, we allow both upper and lower case 
+         * even though it doesn't exactly match the spec. It gives much more flexibility
+         * in being able to specify case insensitive regexes.
+         */
+        a: function(){
+            return $f("A");
+        },
+        A: {
+            // We need to calculate the hour before we apply AM/PM when parsing
+            calcLast: true,
+            g:1,
+            c:"if (/(am)/i.test(results[{0}])) {\n"
+                + "if (!h || h == 12) { h = 0; }\n"
+                + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
+            s:"(AM|PM|am|pm)"
+        },
+        g: function() {
+            return $f("G");
+        },
+        G: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // 24-hr format of an hour without leading zeroes (0 - 23)
+        },
+        h: function() {
+            return $f("H");
+        },
+        H: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" //  24-hr format of an hour with leading zeroes (00 - 23)
+        },
+        i: {
+            g:1,
+            c:"i = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // minutes with leading zeros (00 - 59)
+        },
+        s: {
+            g:1,
+            c:"s = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // seconds with leading zeros (00 - 59)
+        },
+        u: {
+            g:1,
+            c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",
+            s:"(\\d+)" // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+        },
+        O: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(3,5) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{4})" // GMT offset in hrs and mins
+        },
+        P: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(4,6) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{2}:\\d{2})" // GMT offset in hrs and mins (with colon separator)
+        },
+        T: {
+            g:0,
+            c:null,
+            s:"[A-Z]{1,4}" // timezone abbrev. may be between 1 - 4 chars
+        },
+        Z: {
+            g:1,
+            c:"zz = results[{0}] * 1;\n" // -43200 <= UTC offset <= 50400
+                  + "zz = (-43200 <= zz && zz <= 50400)? zz : null;\n",
+            s:"([+\-]?\\d{1,5})" // leading '+' sign is optional for UTC offset
+        },
+        c: function() {
+            var calc = [],
+                arr = [
+                    $f("Y", 1), // year
+                    $f("m", 2), // month
+                    $f("d", 3), // day
+                    $f("h", 4), // hour
+                    $f("i", 5), // minute
+                    $f("s", 6), // second
+                    {c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"}, // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+                    {c:[ // allow either "Z" (i.e. UTC) or "-0530" or "+08:00" (i.e. UTC offset) timezone delimiters. assumes local timezone if no timezone is specified
+                        "if(results[8]) {", // timezone specified
+                            "if(results[8] == 'Z'){",
+                                "zz = 0;", // UTC
+                            "}else if (results[8].indexOf(':') > -1){",
+                                $f("P", 8).c, // timezone offset with colon separator
+                            "}else{",
+                                $f("O", 8).c, // timezone offset without colon separator
+                            "}",
+                        "}"
+                    ].join('\n')}
+                ];
+
+            for (var i = 0, l = arr.length; i < l; ++i) {
+                calc.push(arr[i].c);
+            }
+
+            return {
+                g:1,
+                c:calc.join(""),
+                s:[
+                    arr[0].s, // year (required)
+                    "(?:", "-", arr[1].s, // month (optional)
+                        "(?:", "-", arr[2].s, // day (optional)
+                            "(?:",
+                                "(?:T| )?", // time delimiter -- either a "T" or a single blank space
+                                arr[3].s, ":", arr[4].s,  // hour AND minute, delimited by a single colon (optional). MUST be preceded by either a "T" or a single blank space
+                                "(?::", arr[5].s, ")?", // seconds (optional)
+                                "(?:(?:\\.|,)(\\d+))?", // decimal fraction of a second (e.g. ",12345" or ".98765") (optional)
+                                "(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?", // "Z" (UTC) or "-0530" (UTC offset without colon delimiter) or "+08:00" (UTC offset with colon delimiter) (optional)
+                            ")?",
+                        ")?",
+                    ")?"
+                ].join("")
+            };
+        },
+        U: {
+            g:1,
+            c:"u = parseInt(results[{0}], 10);\n",
+            s:"(-?\\d+)" // leading minus sign indicates seconds before UNIX epoch
+        }
+    }
+});
+
+}());
+
+Ext.apply(Date.prototype, {
+    // private
+    dateFormat : function(format) {
+        if (Date.formatFunctions[format] == null) {
+            Date.createFormat(format);
+        }
+        return Date.formatFunctions[format].call(this);
+    },
+
+    /**
+     * Get the timezone abbreviation of the current date (equivalent to the format specifier 'T').
+     *
+     * Note: The date string returned by the javascript Date object's toString() method varies
+     * between browsers (e.g. FF vs IE) and system region settings (e.g. IE in Asia vs IE in America).
+     * For a given date string e.g. "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)",
+     * getTimezone() first tries to get the timezone abbreviation from between a pair of parentheses
+     * (which may or may not be present), failing which it proceeds to get the timezone abbreviation
+     * from the GMT offset portion of the date string.
+     * @return {String} The abbreviated timezone name (e.g. 'CST', 'PDT', 'EDT', 'MPST' ...).
+     */
+    getTimezone : function() {
+        // the following list shows the differences between date strings from different browsers on a WinXP SP2 machine from an Asian locale:
+        //
+        // Opera  : "Thu, 25 Oct 2007 22:53:45 GMT+0800" -- shortest (weirdest) date string of the lot
+        // Safari : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone (same as FF)
+        // FF     : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone
+        // IE     : "Thu Oct 25 22:54:35 UTC+0800 2007" -- (Asian system setting) look for 3-4 letter timezone abbrev
+        // IE     : "Thu Oct 25 17:06:37 PDT 2007" -- (American system setting) look for 3-4 letter timezone abbrev
+        //
+        // this crazy regex attempts to guess the correct timezone abbreviation despite these differences.
+        // step 1: (?:\((.*)\) -- find timezone in parentheses
+        // step 2: ([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?) -- if nothing was found in step 1, find timezone from timezone offset portion of date string
+        // step 3: remove all non uppercase characters found in step 1 and 2
+        return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/, "$1$2").replace(/[^A-Z]/g, "");
+    },
+
+    /**
+     * Get the offset from GMT of the current date (equivalent to the format specifier 'O').
+     * @param {Boolean} colon (optional) true to separate the hours and minutes with a colon (defaults to false).
+     * @return {String} The 4-character offset string prefixed with + or - (e.g. '-0600').
+     */
+    getGMTOffset : function(colon) {
+        return (this.getTimezoneOffset() > 0 ? "-" : "+")
+            + String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset()) / 60), 2, "0")
+            + (colon ? ":" : "")
+            + String.leftPad(Math.abs(this.getTimezoneOffset() % 60), 2, "0");
+    },
+
+    /**
+     * Get the numeric day number of the year, adjusted for leap year.
+     * @return {Number} 0 to 364 (365 in leap years).
+     */
+    getDayOfYear: function() {
+        var num = 0,
+            d = this.clone(),
+            m = this.getMonth(),
+            i;
+
+        for (i = 0, d.setDate(1), d.setMonth(0); i < m; d.setMonth(++i)) {
+            num += d.getDaysInMonth();
+        }
+        return num + this.getDate() - 1;
+    },
+
+    /**
+     * Get the numeric ISO-8601 week number of the year.
+     * (equivalent to the format specifier 'W', but without a leading zero).
+     * @return {Number} 1 to 53
+     */
+    getWeekOfYear : function() {
+        // adapted from http://www.merlyn.demon.co.uk/weekcalc.htm
+        var ms1d = 864e5, // milliseconds in a day
+            ms7d = 7 * ms1d; // milliseconds in a week
+
+        return function() { // return a closure so constants get calculated only once
+            var DC3 = Date.UTC(this.getFullYear(), this.getMonth(), this.getDate() + 3) / ms1d, // an Absolute Day Number
+                AWN = Math.floor(DC3 / 7), // an Absolute Week Number
+                Wyr = new Date(AWN * ms7d).getUTCFullYear();
+
+            return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1;
+        };
+    }(),
+
+    /**
+     * Checks if the current date falls within a leap year.
+     * @return {Boolean} True if the current date falls within a leap year, false otherwise.
+     */
+    isLeapYear : function() {
+        var year = this.getFullYear();
+        return !!((year & 3) == 0 && (year % 100 || (year % 400 == 0 && year)));
+    },
+
+    /**
+     * Get the first day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getFirstDayOfMonth()]); //output: 'Monday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getFirstDayOfMonth : function() {
+        var day = (this.getDay() - (this.getDate() - 1)) % 7;
+        return (day < 0) ? (day + 7) : day;
+    },
+
+    /**
+     * Get the last day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getLastDayOfMonth()]); //output: 'Wednesday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getLastDayOfMonth : function() {
+        return this.getLastDateOfMonth().getDay();
+    },
+
+
+    /**
+     * Get the date of the first day of the month in which this date resides.
+     * @return {Date}
+     */
+    getFirstDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), 1);
+    },
+
+    /**
+     * Get the date of the last day of the month in which this date resides.
+     * @return {Date}
+     */
+    getLastDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), this.getDaysInMonth());
+    },
+
+    /**
+     * Get the number of days in the current month, adjusted for leap year.
+     * @return {Number} The number of days in the month.
+     */
+    getDaysInMonth: function() {
+        var daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+
+        return function() { // return a closure for efficiency
+            var m = this.getMonth();
+
+            return m == 1 && this.isLeapYear() ? 29 : daysInMonth[m];
+        };
+    }(),
+
+    /**
+     * Get the English ordinal suffix of the current day (equivalent to the format specifier 'S').
+     * @return {String} 'st, 'nd', 'rd' or 'th'.
+     */
+    getSuffix : function() {
+        switch (this.getDate()) {
+            case 1:
+            case 21:
+            case 31:
+                return "st";
+            case 2:
+            case 22:
+                return "nd";
+            case 3:
+            case 23:
+                return "rd";
+            default:
+                return "th";
+        }
+    },
+
+    /**
+     * Creates and returns a new Date instance with the exact same date value as the called instance.
+     * Dates are copied and passed by reference, so if a copied date variable is modified later, the original
+     * variable will also be changed.  When the intention is to create a new variable that will not
+     * modify the original instance, you should create a clone.
+     *
+     * Example of correctly cloning a date:
+     * <pre><code>
+//wrong way:
+var orig = new Date('10/1/2006');
+var copy = orig;
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 05 2006'!
+
+//correct way:
+var orig = new Date('10/1/2006');
+var copy = orig.clone();
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 01 2006'
+</code></pre>
+     * @return {Date} The new Date instance.
+     */
+    clone : function() {
+        return new Date(this.getTime());
+    },
+
+    /**
+     * Checks if the current date is affected by Daylight Saving Time (DST).
+     * @return {Boolean} True if the current date is affected by DST.
+     */
+    isDST : function() {
+        // adapted from http://extjs.com/forum/showthread.php?p=247172#post247172
+        // courtesy of @geoffrey.mcgill
+        return new Date(this.getFullYear(), 0, 1).getTimezoneOffset() != this.getTimezoneOffset();
+    },
+
+    /**
+     * Attempts to clear all time information from this Date by setting the time to midnight of the same day,
+     * automatically adjusting for Daylight Saving Time (DST) where applicable.
+     * (note: DST timezone information for the browser's host operating system is assumed to be up-to-date)
+     * @param {Boolean} clone true to create a clone of this date, clear the time and return it (defaults to false).
+     * @return {Date} this or the clone.
+     */
+    clearTime : function(clone) {
+        if (clone) {
+            return this.clone().clearTime();
+        }
+
+        // get current date before clearing time
+        var d = this.getDate();
+
+        // clear time
+        this.setHours(0);
+        this.setMinutes(0);
+        this.setSeconds(0);
+        this.setMilliseconds(0);
+
+        if (this.getDate() != d) { // account for DST (i.e. day of month changed when setting hour = 0)
+            // note: DST adjustments are assumed to occur in multiples of 1 hour (this is almost always the case)
+            // refer to http://www.timeanddate.com/time/aboutdst.html for the (rare) exceptions to this rule
+
+            // increment hour until cloned date == current date
+            for (var hr = 1, c = this.add(Date.HOUR, hr); c.getDate() != d; hr++, c = this.add(Date.HOUR, hr));
+
+            this.setDate(d);
+            this.setHours(c.getHours());
+        }
+
+        return this;
+    },
+
+    /**
+     * Provides a convenient method for performing basic date arithmetic. This method
+     * does not modify the Date instance being called - it creates and returns
+     * a new Date instance containing the resulting date value.
+     *
+     * Examples:
+     * <pre><code>
+// Basic usage:
+var dt = new Date('10/29/2006').add(Date.DAY, 5);
+document.write(dt); //returns 'Fri Nov 03 2006 00:00:00'
+
+// Negative values will be subtracted:
+var dt2 = new Date('10/1/2006').add(Date.DAY, -5);
+document.write(dt2); //returns 'Tue Sep 26 2006 00:00:00'
+
+// You can even chain several calls together in one line:
+var dt3 = new Date('10/1/2006').add(Date.DAY, 5).add(Date.HOUR, 8).add(Date.MINUTE, -30);
+document.write(dt3); //returns 'Fri Oct 06 2006 07:30:00'
+</code></pre>
+     *
+     * @param {String} interval A valid date interval enum value.
+     * @param {Number} value The amount to add to the current date.
+     * @return {Date} The new Date instance.
+     */
+    add : function(interval, value) {
+        var d = this.clone();
+        if (!interval || value === 0) return d;
+
+        switch(interval.toLowerCase()) {
+            case Date.MILLI:
+                d.setMilliseconds(this.getMilliseconds() + value);
+                break;
+            case Date.SECOND:
+                d.setSeconds(this.getSeconds() + value);
+                break;
+            case Date.MINUTE:
+                d.setMinutes(this.getMinutes() + value);
+                break;
+            case Date.HOUR:
+                d.setHours(this.getHours() + value);
+                break;
+            case Date.DAY:
+                d.setDate(this.getDate() + value);
+                break;
+            case Date.MONTH:
+                var day = this.getDate();
+                if (day > 28) {
+                    day = Math.min(day, this.getFirstDateOfMonth().add('mo', value).getLastDateOfMonth().getDate());
+                }
+                d.setDate(day);
+                d.setMonth(this.getMonth() + value);
+                break;
+            case Date.YEAR:
+                d.setFullYear(this.getFullYear() + value);
+                break;
+        }
+        return d;
+    },
+
+    /**
+     * Checks if this date falls on or between the given start and end dates.
+     * @param {Date} start Start date
+     * @param {Date} end End date
+     * @return {Boolean} true if this date falls on or between the given start and end dates.
+     */
+    between : function(start, end) {
+        var t = this.getTime();
+        return start.getTime() <= t && t <= end.getTime();
+    }
+});
+
+
+/**
+ * Formats a date given the supplied format string.
+ * @param {String} format The format string.
+ * @return {String} The formatted date.
+ * @method format
+ */
+Date.prototype.format = Date.prototype.dateFormat;
+
+
+// private
+if (Ext.isSafari && (navigator.userAgent.match(/WebKit\/(\d+)/)[1] || NaN) < 420) {
+    Ext.apply(Date.prototype, {
+        _xMonth : Date.prototype.setMonth,
+        _xDate  : Date.prototype.setDate,
+
+        // Bug in Safari 1.3, 2.0 (WebKit build < 420)
+        // Date.setMonth does not work consistently if iMonth is not 0-11
+        setMonth : function(num) {
+            if (num <= -1) {
+                var n = Math.ceil(-num),
+                    back_year = Math.ceil(n / 12),
+                    month = (n % 12) ? 12 - n % 12 : 0;
+
+                this.setFullYear(this.getFullYear() - back_year);
+
+                return this._xMonth(month);
+            } else {
+                return this._xMonth(num);
+            }
+        },
+
+        // Bug in setDate() method (resolved in WebKit build 419.3, so to be safe we target Webkit builds < 420)
+        // The parameter for Date.setDate() is converted to a signed byte integer in Safari
+        // http://brianary.blogspot.com/2006/03/safari-date-bug.html
+        setDate : function(d) {
+            // use setTime() to workaround setDate() bug
+            // subtract current day of month in milliseconds, then add desired day of month in milliseconds
+            return this.setTime(this.getTime() - (this.getDate() - d) * 864e5);
+        }
+    });
+}
+
+
+
+/* Some basic Date tests... (requires Firebug)
+
+Date.parseDate('', 'c'); // call Date.parseDate() once to force computation of regex string so we can console.log() it
+console.log('Insane Regex for "c" format: %o', Date.parseCodes.c.s); // view the insane regex for the "c" format specifier
+
+// standard tests
+console.group('Standard Date.parseDate() Tests');
+    console.log('Date.parseDate("2009-01-05T11:38:56", "c")               = %o', Date.parseDate("2009-01-05T11:38:56", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-02-04T12:37:55.001000", "c")        = %o', Date.parseDate("2009-02-04T12:37:55.001000", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-03-03T13:36:54,101000Z", "c")       = %o', Date.parseDate("2009-03-03T13:36:54,101000Z", "c")); // UTC
+    console.log('Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")   = %o', Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")); // GMT-0530
+    console.log('Date.parseDate("2009-05-01T15:34:52,9876000+08:00", "c") = %o', Date.parseDate("2009-05-01T15:34:52,987600+08:00", "c")); // GMT+08:00
+console.groupEnd();
+
+// ISO-8601 format as specified in http://www.w3.org/TR/NOTE-datetime
+// -- accepts ALL 6 levels of date-time granularity
+console.group('ISO-8601 Granularity Test (see http://www.w3.org/TR/NOTE-datetime)');
+    console.log('Date.parseDate("1997", "c")                              = %o', Date.parseDate("1997", "c")); // YYYY (e.g. 1997)
+    console.log('Date.parseDate("1997-07", "c")                           = %o', Date.parseDate("1997-07", "c")); // YYYY-MM (e.g. 1997-07)
+    console.log('Date.parseDate("1997-07-16", "c")                        = %o', Date.parseDate("1997-07-16", "c")); // YYYY-MM-DD (e.g. 1997-07-16)
+    console.log('Date.parseDate("1997-07-16T19:20+01:00", "c")            = %o', Date.parseDate("1997-07-16T19:20+01:00", "c")); // YYYY-MM-DDThh:mmTZD (e.g. 1997-07-16T19:20+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30+01:00", "c")         = %o', Date.parseDate("1997-07-16T19:20:30+01:00", "c")); // YYYY-MM-DDThh:mm:ssTZD (e.g. 1997-07-16T19:20:30+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")); // YYYY-MM-DDThh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")); // YYYY-MM-DD hh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)= %o', Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)); // strict date parsing with invalid month value
+console.groupEnd();
+
+*/
+/**
+ * @class Ext.util.MixedCollection
+ * @extends Ext.util.Observable
+ * A Collection class that maintains both numeric indexes and keys and exposes events.
+ * @constructor
+ * @param {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+ * function should add function references to the collection. Defaults to
+ * <tt>false</tt>.
+ * @param {Function} keyFn A function that can accept an item of the type(s) stored in this MixedCollection
+ * and return the key value for that item.  This is used when available to look up the key on items that
+ * were passed without an explicit key parameter to a MixedCollection method.  Passing this parameter is
+ * equivalent to providing an implementation for the {@link #getKey} method.
+ */
+Ext.util.MixedCollection = function(allowFunctions, keyFn){
+    this.items = [];
+    this.map = {};
+    this.keys = [];
+    this.length = 0;
+    this.addEvents(
+        /**
+         * @event clear
+         * Fires when the collection is cleared.
+         */
+        'clear',
+        /**
+         * @event add
+         * Fires when an item is added to the collection.
+         * @param {Number} index The index at which the item was added.
+         * @param {Object} o The item added.
+         * @param {String} key The key associated with the added item.
+         */
+        'add',
+        /**
+         * @event replace
+         * Fires when an item is replaced in the collection.
+         * @param {String} key he key associated with the new added.
+         * @param {Object} old The item being replaced.
+         * @param {Object} new The new item.
+         */
+        'replace',
+        /**
+         * @event remove
+         * Fires when an item is removed from the collection.
+         * @param {Object} o The item being removed.
+         * @param {String} key (optional) The key associated with the removed item.
+         */
+        'remove',
+        'sort'
+    );
+    this.allowFunctions = allowFunctions === true;
+    if(keyFn){
+        this.getKey = keyFn;
+    }
+    Ext.util.MixedCollection.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
+
+    /**
+     * @cfg {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+     * function should add function references to the collection. Defaults to
+     * <tt>false</tt>.
+     */
+    allowFunctions : false,
+
+    /**
+     * Adds an item to the collection. Fires the {@link #add} event when complete.
+     * @param {String} key <p>The key to associate with the item, or the new item.</p>
+     * <p>If a {@link #getKey} implementation was specified for this MixedCollection,
+     * or if the key of the stored items is in a property called <tt><b>id</b></tt>,
+     * the MixedCollection will be able to <i>derive</i> the key for the new item.
+     * In this case just pass the new item in this parameter.</p>
+     * @param {Object} o The item to add.
+     * @return {Object} The item added.
+     */
+    add : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        if(typeof key != 'undefined' && key !== null){
+            var old = this.map[key];
+            if(typeof old != 'undefined'){
+                return this.replace(key, o);
+            }
+            this.map[key] = o;
+        }
+        this.length++;
+        this.items.push(o);
+        this.keys.push(key);
+        this.fireEvent('add', this.length-1, o, key);
+        return o;
+    },
+
+    /**
+      * MixedCollection has a generic way to fetch keys if you implement getKey.  The default implementation
+      * simply returns <b><code>item.id</code></b> but you can provide your own implementation
+      * to return a different value as in the following examples:<pre><code>
+// normal way
+var mc = new Ext.util.MixedCollection();
+mc.add(someEl.dom.id, someEl);
+mc.add(otherEl.dom.id, otherEl);
+//and so on
+
+// using getKey
+var mc = new Ext.util.MixedCollection();
+mc.getKey = function(el){
+   return el.dom.id;
+};
+mc.add(someEl);
+mc.add(otherEl);
+
+// or via the constructor
+var mc = new Ext.util.MixedCollection(false, function(el){
+   return el.dom.id;
+});
+mc.add(someEl);
+mc.add(otherEl);
+     * </code></pre>
+     * @param {Object} item The item for which to find the key.
+     * @return {Object} The key for the passed item.
+     */
+    getKey : function(o){
+         return o.id;
+    },
+
+    /**
+     * Replaces an item in the collection. Fires the {@link #replace} event when complete.
+     * @param {String} key <p>The key associated with the item to replace, or the replacement item.</p>
+     * <p>If you supplied a {@link #getKey} implementation for this MixedCollection, or if the key
+     * of your stored items is in a property called <tt><b>id</b></tt>, then the MixedCollection
+     * will be able to <i>derive</i> the key of the replacement item. If you want to replace an item
+     * with one having the same key value, then just pass the replacement item in this parameter.</p>
+     * @param o {Object} o (optional) If the first parameter passed was a key, the item to associate
+     * with that key.
+     * @return {Object}  The new item.
+     */
+    replace : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        var old = this.map[key];
+        if(typeof key == 'undefined' || key === null || typeof old == 'undefined'){
+             return this.add(key, o);
+        }
+        var index = this.indexOfKey(key);
+        this.items[index] = o;
+        this.map[key] = o;
+        this.fireEvent('replace', key, old, o);
+        return o;
+    },
+
+    /**
+     * Adds all elements of an Array or an Object to the collection.
+     * @param {Object/Array} objs An Object containing properties which will be added
+     * to the collection, or an Array of values, each of which are added to the collection.
+     * Functions references will be added to the collection if <code>{@link #allowFunctions}</code>
+     * has been set to <tt>true</tt>.
+     */
+    addAll : function(objs){
+        if(arguments.length > 1 || Ext.isArray(objs)){
+            var args = arguments.length > 1 ? arguments : objs;
+            for(var i = 0, len = args.length; i < len; i++){
+                this.add(args[i]);
+            }
+        }else{
+            for(var key in objs){
+                if(this.allowFunctions || typeof objs[key] != 'function'){
+                    this.add(key, objs[key]);
+                }
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every item in the collection, passing the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><b>item</b> : Mixed<p class="sub-desc">The collection item</p></li>
+     * <li><b>index</b> : Number<p class="sub-desc">The item's index</p></li>
+     * <li><b>length</b> : Number<p class="sub-desc">The total number of items in the collection</p></li>
+     * </ul></div>
+     * The function should return a boolean value. Returning false from the function will stop the iteration.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current item in the iteration.
+     */
+    each : function(fn, scope){
+        var items = [].concat(this.items); // each safe for removal
+        for(var i = 0, len = items.length; i < len; i++){
+            if(fn.call(scope || items[i], items[i], i, len) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every key in the collection, passing each
+     * key, and its associated item as the first two parameters.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    eachKey : function(fn, scope){
+        for(var i = 0, len = this.keys.length; i < len; i++){
+            fn.call(scope || window, this.keys[i], this.items[i], i, len);
+        }
+    },
+
+    /**
+     * Returns the first item in the collection which elicits a true return value from the
+     * passed selection function.
+     * @param {Function} fn The selection function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     * @return {Object} The first item in the collection which returned true from the selection function.
+     */
+    find : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            if(fn.call(scope || window, this.items[i], this.keys[i])){
+                return this.items[i];
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Inserts an item at the specified index in the collection. Fires the {@link #add} event when complete.
+     * @param {Number} index The index to insert the item at.
+     * @param {String} key The key to associate with the new item, or the item itself.
+     * @param {Object} o (optional) If the second parameter was a key, the new item.
+     * @return {Object} The item inserted.
+     */
+    insert : function(index, key, o){
+        if(arguments.length == 2){
+            o = arguments[1];
+            key = this.getKey(o);
+        }
+        if(this.containsKey(key)){
+            this.suspendEvents();
+            this.removeKey(key);
+            this.resumeEvents();
+        }
+        if(index >= this.length){
+            return this.add(key, o);
+        }
+        this.length++;
+        this.items.splice(index, 0, o);
+        if(typeof key != 'undefined' && key !== null){
+            this.map[key] = o;
+        }
+        this.keys.splice(index, 0, key);
+        this.fireEvent('add', index, o, key);
+        return o;
+    },
+
+    /**
+     * Remove an item from the collection.
+     * @param {Object} o The item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    remove : function(o){
+        return this.removeAt(this.indexOf(o));
+    },
+
+    /**
+     * Remove an item from a specified index in the collection. Fires the {@link #remove} event when complete.
+     * @param {Number} index The index within the collection of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeAt : function(index){
+        if(index < this.length && index >= 0){
+            this.length--;
+            var o = this.items[index];
+            this.items.splice(index, 1);
+            var key = this.keys[index];
+            if(typeof key != 'undefined'){
+                delete this.map[key];
+            }
+            this.keys.splice(index, 1);
+            this.fireEvent('remove', o, key);
+            return o;
+        }
+        return false;
+    },
+
+    /**
+     * Removed an item associated with the passed key fom the collection.
+     * @param {String} key The key of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeKey : function(key){
+        return this.removeAt(this.indexOfKey(key));
+    },
+
+    /**
+     * Returns the number of items in the collection.
+     * @return {Number} the number of items in the collection.
+     */
+    getCount : function(){
+        return this.length;
+    },
+
+    /**
+     * Returns index within the collection of the passed Object.
+     * @param {Object} o The item to find the index of.
+     * @return {Number} index of the item. Returns -1 if not found.
+     */
+    indexOf : function(o){
+        return this.items.indexOf(o);
+    },
+
+    /**
+     * Returns index within the collection of the passed key.
+     * @param {String} key The key to find the index of.
+     * @return {Number} index of the key.
+     */
+    indexOfKey : function(key){
+        return this.keys.indexOf(key);
+    },
+
+    /**
+     * Returns the item associated with the passed key OR index.
+     * Key has priority over index.  This is the equivalent
+     * of calling {@link #key} first, then if nothing matched calling {@link #itemAt}.
+     * @param {String/Number} key The key or index of the item.
+     * @return {Object} If the item is found, returns the item.  If the item was not found, returns <tt>undefined</tt>.
+     * If an item was found, but is a Class, returns <tt>null</tt>.
+     */
+    item : function(key){
+        var mk = this.map[key],
+            item = mk !== undefined ? mk : (typeof key == 'number') ? this.items[key] : undefined;
+        return typeof item != 'function' || this.allowFunctions ? item : null; // for prototype!
+    },
+
+    /**
+     * Returns the item at the specified index.
+     * @param {Number} index The index of the item.
+     * @return {Object} The item at the specified index.
+     */
+    itemAt : function(index){
+        return this.items[index];
+    },
+
+    /**
+     * Returns the item associated with the passed key.
+     * @param {String/Number} key The key of the item.
+     * @return {Object} The item associated with the passed key.
+     */
+    key : function(key){
+        return this.map[key];
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as an item.
+     * @param {Object} o  The Object to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as an item.
+     */
+    contains : function(o){
+        return this.indexOf(o) != -1;
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as a key.
+     * @param {String} key The key to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as a key.
+     */
+    containsKey : function(key){
+        return typeof this.map[key] != 'undefined';
+    },
+
+    /**
+     * Removes all items from the collection.  Fires the {@link #clear} event when complete.
+     */
+    clear : function(){
+        this.length = 0;
+        this.items = [];
+        this.keys = [];
+        this.map = {};
+        this.fireEvent('clear');
+    },
+
+    /**
+     * Returns the first item in the collection.
+     * @return {Object} the first item in the collection..
+     */
+    first : function(){
+        return this.items[0];
+    },
+
+    /**
+     * Returns the last item in the collection.
+     * @return {Object} the last item in the collection..
+     */
+    last : function(){
+        return this.items[this.length-1];
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting based on a direction and a sorting function. Internally,
+     * this creates a temporary array of all items in the MixedCollection, sorts it and then writes
+     * the sorted array data back into this.items and this.keys
+     * @param {String} property Property to sort by ('key', 'value', or 'index')
+     * @param {String} dir (optional) Direction to sort 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    _sort : function(property, dir, fn){
+        var i, len,
+            dsc   = String(dir).toUpperCase() == 'DESC' ? -1 : 1,
+
+            //this is a temporary array used to apply the sorting function
+            c     = [],
+            keys  = this.keys,
+            items = this.items;
+
+        //default to a simple sorter function if one is not provided
+        fn = fn || function(a, b) {
+            return a - b;
+        };
+
+        //copy all the items into a temporary array, which we will sort
+        for(i = 0, len = items.length; i < len; i++){
+            c[c.length] = {
+                key  : keys[i],
+                value: items[i],
+                index: i
+            };
+        }
+
+        //sort the temporary array
+        c.sort(function(a, b){
+            var v = fn(a[property], b[property]) * dsc;
+            if(v === 0){
+                v = (a.index < b.index ? -1 : 1);
+            }
+            return v;
+        });
+
+        //copy the temporary array back into the main this.items and this.keys objects
+        for(i = 0, len = c.length; i < len; i++){
+            items[i] = c[i].value;
+            keys[i]  = c[i].key;
+        }
+
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>item</b> value with the passed comparison function.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    sort : function(dir, fn){
+        this._sort('value', dir, fn);
+    },
+
+    /**
+     * Reorders each of the items based on a mapping from old index to new index. Internally this
+     * just translates into a sort. The 'sort' event is fired whenever reordering has occured.
+     * @param {Object} mapping Mapping from old item index to new item index
+     */
+    reorder: function(mapping) {
+        this.suspendEvents();
+
+        var items = this.items,
+            index = 0,
+            length = items.length,
+            order = [],
+            remaining = [],
+            oldIndex;
+
+        //object of {oldPosition: newPosition} reversed to {newPosition: oldPosition}
+        for (oldIndex in mapping) {
+            order[mapping[oldIndex]] = items[oldIndex];
+        }
+
+        for (index = 0; index < length; index++) {
+            if (mapping[index] == undefined) {
+                remaining.push(items[index]);
+            }
+        }
+
+        for (index = 0; index < length; index++) {
+            if (order[index] == undefined) {
+                order[index] = remaining.shift();
+            }
+        }
+
+        this.clear();
+        this.addAll(order);
+
+        this.resumeEvents();
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>key</b>s.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by case insensitive string.
+     */
+    keySort : function(dir, fn){
+        this._sort('key', dir, fn || function(a, b){
+            var v1 = String(a).toUpperCase(), v2 = String(b).toUpperCase();
+            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
+        });
+    },
+
+    /**
+     * Returns a range of items in this collection
+     * @param {Number} startIndex (optional) The starting index. Defaults to 0.
+     * @param {Number} endIndex (optional) The ending index. Defaults to the last item.
+     * @return {Array} An array of items
+     */
+    getRange : function(start, end){
+        var items = this.items;
+        if(items.length < 1){
+            return [];
+        }
+        start = start || 0;
+        end = Math.min(typeof end == 'undefined' ? this.length-1 : end, this.length-1);
+        var i, r = [];
+        if(start <= end){
+            for(i = start; i <= end; i++) {
+                r[r.length] = items[i];
+            }
+        }else{
+            for(i = start; i >= end; i--) {
+                r[r.length] = items[i];
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Filter the <i>objects</i> in this collection by a specific property.
+     * Returns a new collection that has been filtered.
+     * @param {String} property A property on your objects
+     * @param {String/RegExp} value Either string that the property values
+     * should start with or a RegExp to test against the property
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison (defaults to False).
+     * @return {MixedCollection} The new filtered collection
+     */
+    filter : function(property, value, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return this.clone();
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.filterBy(function(o){
+            return o && value.test(o[property]);
+        });
+    },
+
+    /**
+     * Filter by a function. Returns a <i>new</i> collection that has been filtered.
+     * The passed function will be called with each object in the collection.
+     * If the function returns true, the value is included otherwise it is filtered.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key)
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @return {MixedCollection} The new filtered collection
+     */
+    filterBy : function(fn, scope){
+        var r = new Ext.util.MixedCollection();
+        r.getKey = this.getKey;
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                r.add(k[i], it[i]);
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Finds the index of the first matching object in this collection by a specific property/value.
+     * @param {String} property The name of a property on your objects.
+     * @param {String/RegExp} value A string that the property values
+     * should start with or a RegExp to test against the property.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning.
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison.
+     * @return {Number} The matched index or -1
+     */
+    findIndex : function(property, value, start, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return -1;
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.findIndexBy(function(o){
+            return o && value.test(o[property]);
+        }, null, start);
+    },
+
+    /**
+     * Find the index of the first matching object in this collection by a function.
+     * If the function returns <i>true</i> it is considered a match.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key).
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @return {Number} The matched index or -1
+     */
+    findIndexBy : function(fn, scope, start){
+        var k = this.keys, it = this.items;
+        for(var i = (start||0), len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns a regular expression based on the given value and matching options. This is used internally for finding and filtering,
+     * and by Ext.data.Store#filter
+     * @private
+     * @param {String} value The value to create the regex for. This is escaped using Ext.escapeRe
+     * @param {Boolean} anyMatch True to allow any match - no regex start/end line anchors will be added. Defaults to false
+     * @param {Boolean} caseSensitive True to make the regex case sensitive (adds 'i' switch to regex). Defaults to false.
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createValueMatcher : function(value, anyMatch, caseSensitive, exactMatch) {
+        if (!value.exec) { // not a regex
+            var er = Ext.escapeRe;
+            value = String(value);
+
+            if (anyMatch === true) {
+                value = er(value);
+            } else {
+                value = '^' + er(value);
+                if (exactMatch === true) {
+                    value += '$';
+                }
+            }
+            value = new RegExp(value, caseSensitive ? '' : 'i');
+         }
+         return value;
+    },
+
+    /**
+     * Creates a shallow copy of this collection
+     * @return {MixedCollection}
+     */
+    clone : function(){
+        var r = new Ext.util.MixedCollection();
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            r.add(k[i], it[i]);
+        }
+        r.getKey = this.getKey;
+        return r;
+    }
+});
+/**
+ * This method calls {@link #item item()}.
+ * Returns the item associated with the passed key OR index. Key has priority
+ * over index.  This is the equivalent of calling {@link #key} first, then if
+ * nothing matched calling {@link #itemAt}.
+ * @param {String/Number} key The key or index of the item.
+ * @return {Object} If the item is found, returns the item.  If the item was
+ * not found, returns <tt>undefined</tt>. If an item was found, but is a Class,
+ * returns <tt>null</tt>.
+ */
+Ext.util.MixedCollection.prototype.get = Ext.util.MixedCollection.prototype.item;
+/**
+ * @class Ext.AbstractManager
+ * @extends Object
+ * Base Manager class - extended by ComponentMgr and PluginMgr
+ */
+Ext.AbstractManager = Ext.extend(Object, {
+    typeName: 'type',
+    
+    constructor: function(config) {
+        Ext.apply(this, config || {});
+        
+        /**
+         * Contains all of the items currently managed
+         * @property all
+         * @type Ext.util.MixedCollection
+         */
+        this.all = new Ext.util.MixedCollection();
+        
+        this.types = {};
+    },
+    
+    /**
+     * Returns a component by {@link Ext.Component#id id}.
+     * For additional details see {@link Ext.util.MixedCollection#get}.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+     * Class was found.
+     */
+    get : function(id){
+        return this.all.get(id);
+    },
+    
+    /**
+     * Registers an item to be managed
+     * @param {Mixed} item The item to register
+     */
+    register: function(item) {
+        this.all.add(item);
+    },
+    
+    /**
+     * Unregisters a component by removing it from this manager
+     * @param {Mixed} item The item to unregister
+     */
+    unregister: function(item) {
+        this.all.remove(item);        
+    },
+    
+    /**
+     * <p>Registers a new Component constructor, keyed by a new
+     * {@link Ext.Component#xtype}.</p>
+     * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+     * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+     * child Components.
+     * see {@link Ext.Container#items}</p>
+     * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+     * @param {Constructor} cls The new Component class.
+     */
+    registerType : function(type, cls){
+        this.types[type] = cls;
+        cls[this.typeName] = type;
+    },
+    
+    /**
+     * Checks if a Component type is registered.
+     * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+     * @return {Boolean} Whether the type is registered.
+     */
+    isRegistered : function(type){
+        return this.types[type] !== undefined;    
+    },
+    
+    /**
+     * Creates and returns an instance of whatever this manager manages, based on the supplied type and config object
+     * @param {Object} config The config object
+     * @param {String} defaultType If no type is discovered in the config object, we fall back to this type
+     * @return {Mixed} The instance of whatever this manager is managing
+     */
+    create: function(config, defaultType) {
+        var type        = config[this.typeName] || config.type || defaultType,
+            Constructor = this.types[type];
+        
+        if (Constructor == undefined) {
+            throw new Error(String.format("The '{0}' type has not been registered with this manager", type));
+        }
+        
+        return new Constructor(config);
+    },
+    
+    /**
+     * Registers a function that will be called when a Component with the specified id is added to the manager. This will happen on instantiation.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @param {Function} fn The callback function
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+     */
+    onAvailable : function(id, fn, scope){
+        var all = this.all;
+        
+        all.on("add", function(index, o){
+            if (o.id == id) {
+                fn.call(scope || o, o);
+                all.un("add", fn, scope);
+            }
+        });
+    }
+});/**
+ * @class Ext.util.Format
+ * Reusable data formatting functions
+ * @singleton
+ */
+Ext.util.Format = function() {
+    var trimRe         = /^\s+|\s+$/g,
+        stripTagsRE    = /<\/?[^>]+>/gi,
+        stripScriptsRe = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+        nl2brRe        = /\r?\n/g;
+
+    return {
+        /**
+         * Truncate a string and add an ellipsis ('...') to the end if it exceeds the specified length
+         * @param {String} value The string to truncate
+         * @param {Number} length The maximum length to allow before truncating
+         * @param {Boolean} word True to try to find a common work break
+         * @return {String} The converted text
+         */
+        ellipsis : function(value, len, word) {
+            if (value && value.length > len) {
+                if (word) {
+                    var vs    = value.substr(0, len - 2),
+                        index = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'));
+                    if (index == -1 || index < (len - 15)) {
+                        return value.substr(0, len - 3) + "...";
+                    } else {
+                        return vs.substr(0, index) + "...";
+                    }
+                } else {
+                    return value.substr(0, len - 3) + "...";
+                }
+            }
+            return value;
+        },
+
+        /**
+         * Checks a reference and converts it to empty string if it is undefined
+         * @param {Mixed} value Reference to check
+         * @return {Mixed} Empty string if converted, otherwise the original value
+         */
+        undef : function(value) {
+            return value !== undefined ? value : "";
+        },
+
+        /**
+         * Checks a reference and converts it to the default value if it's empty
+         * @param {Mixed} value Reference to check
+         * @param {String} defaultValue The value to insert of it's undefined (defaults to "")
+         * @return {String}
+         */
+        defaultValue : function(value, defaultValue) {
+            return value !== undefined && value !== '' ? value : defaultValue;
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') to their HTML character equivalents for literal display in web pages.
+         * @param {String} value The string to encode
+         * @return {String} The encoded text
+         */
+        htmlEncode : function(value) {
+            return !value ? value : String(value).replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') from their HTML character equivalents.
+         * @param {String} value The string to decode
+         * @return {String} The decoded text
+         */
+        htmlDecode : function(value) {
+            return !value ? value : String(value).replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, '"').replace(/&amp;/g, "&");
+        },
+
+        /**
+         * Trims any whitespace from either side of a string
+         * @param {String} value The text to trim
+         * @return {String} The trimmed text
+         */
+        trim : function(value) {
+            return String(value).replace(trimRe, "");
+        },
+
+        /**
+         * Returns a substring from within an original string
+         * @param {String} value The original text
+         * @param {Number} start The start index of the substring
+         * @param {Number} length The length of the substring
+         * @return {String} The substring
+         */
+        substr : function(value, start, length) {
+            return String(value).substr(start, length);
+        },
+
+        /**
+         * Converts a string to all lower case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        lowercase : function(value) {
+            return String(value).toLowerCase();
+        },
+
+        /**
+         * Converts a string to all upper case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        uppercase : function(value) {
+            return String(value).toUpperCase();
+        },
+
+        /**
+         * Converts the first character only of a string to upper case
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        capitalize : function(value) {
+            return !value ? value : value.charAt(0).toUpperCase() + value.substr(1).toLowerCase();
+        },
+
+        // private
+        call : function(value, fn) {
+            if (arguments.length > 2) {
+                var args = Array.prototype.slice.call(arguments, 2);
+                args.unshift(value);
+                return eval(fn).apply(window, args);
+            } else {
+                return eval(fn).call(window, value);
+            }
+        },
+
+        /**
+         * Format a number as US currency
+         * @param {Number/String} value The numeric value to format
+         * @return {String} The formatted currency string
+         */
+        usMoney : function(v) {
+            v = (Math.round((v-0)*100))/100;
+            v = (v == Math.floor(v)) ? v + ".00" : ((v*10 == Math.floor(v*10)) ? v + "0" : v);
+            v = String(v);
+            var ps = v.split('.'),
+                whole = ps[0],
+                sub = ps[1] ? '.'+ ps[1] : '.00',
+                r = /(\d+)(\d{3})/;
+            while (r.test(whole)) {
+                whole = whole.replace(r, '$1' + ',' + '$2');
+            }
+            v = whole + sub;
+            if (v.charAt(0) == '-') {
+                return '-$' + v.substr(1);
+            }
+            return "$" +  v;
+        },
+
+        /**
+         * Parse a value into a formatted date using the specified format pattern.
+         * @param {String/Date} value The value to format (Strings must conform to the format expected by the javascript Date object's <a href="http://www.w3schools.com/jsref/jsref_parse.asp">parse()</a> method)
+         * @param {String} format (optional) Any valid date format string (defaults to 'm/d/Y')
+         * @return {String} The formatted date string
+         */
+        date : function(v, format) {
+            if (!v) {
+                return "";
+            }
+            if (!Ext.isDate(v)) {
+                v = new Date(Date.parse(v));
+            }
+            return v.dateFormat(format || "m/d/Y");
+        },
+
+        /**
+         * Returns a date rendering function that can be reused to apply a date format multiple times efficiently
+         * @param {String} format Any valid date format string
+         * @return {Function} The date formatting function
+         */
+        dateRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.date(v, format);
+            };
+        },
+
+        /**
+         * Strips all HTML tags
+         * @param {Mixed} value The text from which to strip tags
+         * @return {String} The stripped text
+         */
+        stripTags : function(v) {
+            return !v ? v : String(v).replace(stripTagsRE, "");
+        },
+
+        /**
+         * Strips all script tags
+         * @param {Mixed} value The text from which to strip script tags
+         * @return {String} The stripped text
+         */
+        stripScripts : function(v) {
+            return !v ? v : String(v).replace(stripScriptsRe, "");
+        },
+
+        /**
+         * Simple format for a file size (xxx bytes, xxx KB, xxx MB)
+         * @param {Number/String} size The numeric value to format
+         * @return {String} The formatted file size
+         */
+        fileSize : function(size) {
+            if (size < 1024) {
+                return size + " bytes";
+            } else if (size < 1048576) {
+                return (Math.round(((size*10) / 1024))/10) + " KB";
+            } else {
+                return (Math.round(((size*10) / 1048576))/10) + " MB";
+            }
+        },
+
+        /**
+         * It does simple math for use in a template, for example:<pre><code>
+         * var tpl = new Ext.Template('{value} * 10 = {value:math("* 10")}');
+         * </code></pre>
+         * @return {Function} A function that operates on the passed value.
+         */
+        math : function(){
+            var fns = {};
+            
+            return function(v, a){
+                if (!fns[a]) {
+                    fns[a] = new Function('v', 'return v ' + a + ';');
+                }
+                return fns[a](v);
+            };
+        }(),
+
+        /**
+         * Rounds the passed number to the required decimal precision.
+         * @param {Number/String} value The numeric value to round.
+         * @param {Number} precision The number of decimal places to which to round the first parameter's value.
+         * @return {Number} The rounded value.
+         */
+        round : function(value, precision) {
+            var result = Number(value);
+            if (typeof precision == 'number') {
+                precision = Math.pow(10, precision);
+                result = Math.round(value * precision) / precision;
+            }
+            return result;
+        },
+
+        /**
+         * Formats the number according to the format string.
+         * <div style="margin-left:40px">examples (123456.789):
+         * <div style="margin-left:10px">
+         * 0 - (123456) show only digits, no precision<br>
+         * 0.00 - (123456.78) show only digits, 2 precision<br>
+         * 0.0000 - (123456.7890) show only digits, 4 precision<br>
+         * 0,000 - (123,456) show comma and digits, no precision<br>
+         * 0,000.00 - (123,456.78) show comma and digits, 2 precision<br>
+         * 0,0.00 - (123,456.78) shortcut method, show comma and digits, 2 precision<br>
+         * To reverse the grouping (,) and decimal (.) for international numbers, add /i to the end.
+         * For example: 0.000,00/i
+         * </div></div>
+         * @param {Number} v The number to format.
+         * @param {String} format The way you would like to format this text.
+         * @return {String} The formatted number.
+         */
+        number: function(v, format) {
+            if (!format) {
+                return v;
+            }
+            v = Ext.num(v, NaN);
+            if (isNaN(v)) {
+                return '';
+            }
+            var comma = ',',
+                dec   = '.',
+                i18n  = false,
+                neg   = v < 0;
+
+            v = Math.abs(v);
+            if (format.substr(format.length - 2) == '/i') {
+                format = format.substr(0, format.length - 2);
+                i18n   = true;
+                comma  = '.';
+                dec    = ',';
+            }
+
+            var hasComma = format.indexOf(comma) != -1,
+                psplit   = (i18n ? format.replace(/[^\d\,]/g, '') : format.replace(/[^\d\.]/g, '')).split(dec);
+
+            if (1 < psplit.length) {
+                v = v.toFixed(psplit[1].length);
+            } else if(2 < psplit.length) {
+                throw ('NumberFormatException: invalid format, formats should have no more than 1 period: ' + format);
+            } else {
+                v = v.toFixed(0);
+            }
+
+            var fnum = v.toString();
+
+            psplit = fnum.split('.');
+
+            if (hasComma) {
+                var cnum = psplit[0], 
+                    parr = [], 
+                    j    = cnum.length, 
+                    m    = Math.floor(j / 3),
+                    n    = cnum.length % 3 || 3,
+                    i;
+
+                for (i = 0; i < j; i += n) {
+                    if (i != 0) {
+                        n = 3;
+                    }
+                    
+                    parr[parr.length] = cnum.substr(i, n);
+                    m -= 1;
+                }
+                fnum = parr.join(comma);
+                if (psplit[1]) {
+                    fnum += dec + psplit[1];
+                }
+            } else {
+                if (psplit[1]) {
+                    fnum = psplit[0] + dec + psplit[1];
+                }
+            }
+
+            return (neg ? '-' : '') + format.replace(/[\d,?\.?]+/, fnum);
+        },
+
+        /**
+         * Returns a number rendering function that can be reused to apply a number format multiple times efficiently
+         * @param {String} format Any valid number format string for {@link #number}
+         * @return {Function} The number formatting function
+         */
+        numberRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.number(v, format);
+            };
+        },
+
+        /**
+         * Selectively do a plural form of a word based on a numeric value. For example, in a template,
+         * {commentCount:plural("Comment")}  would result in "1 Comment" if commentCount was 1 or would be "x Comments"
+         * if the value is 0 or greater than 1.
+         * @param {Number} value The value to compare against
+         * @param {String} singular The singular form of the word
+         * @param {String} plural (optional) The plural form of the word (defaults to the singular with an "s")
+         */
+        plural : function(v, s, p) {
+            return v +' ' + (v == 1 ? s : (p ? p : s+'s'));
+        },
+
+        /**
+         * Converts newline characters to the HTML tag &lt;br/>
+         * @param {String} The string value to format.
+         * @return {String} The string with embedded &lt;br/> tags in place of newlines.
+         */
+        nl2br : function(v) {
+            return Ext.isEmpty(v) ? '' : v.replace(nl2brRe, '<br/>');
+        }
+    };
+}();
+/**
+ * @class Ext.XTemplate
+ * @extends Ext.Template
+ * <p>A template class that supports advanced functionality like:<div class="mdetail-params"><ul>
+ * <li>Autofilling arrays using templates and sub-templates</li>
+ * <li>Conditional processing with basic comparison operators</li>
+ * <li>Basic math function support</li>
+ * <li>Execute arbitrary inline code with special built-in template variables</li>
+ * <li>Custom member functions</li>
+ * <li>Many special tags and built-in operators that aren't defined as part of
+ * the API, but are supported in the templates that can be created</li>
+ * </ul></div></p>
+ * <p>XTemplate provides the templating mechanism built into:<div class="mdetail-params"><ul>
+ * <li>{@link Ext.DataView}</li>
+ * <li>{@link Ext.ListView}</li>
+ * <li>{@link Ext.form.ComboBox}</li>
+ * <li>{@link Ext.grid.TemplateColumn}</li>
+ * <li>{@link Ext.grid.GroupingView}</li>
+ * <li>{@link Ext.menu.Item}</li>
+ * <li>{@link Ext.layout.MenuLayout}</li>
+ * <li>{@link Ext.ColorPalette}</li>
+ * </ul></div></p>
+ *
+ * <p>For example usage {@link #XTemplate see the constructor}.</p>
+ *
+ * @constructor
+ * The {@link Ext.Template#Template Ext.Template constructor} describes
+ * the acceptable parameters to pass to the constructor. The following
+ * examples demonstrate all of the supported features.</p>
+ *
+ * <div class="mdetail-params"><ul>
+ *
+ * <li><b><u>Sample Data</u></b>
+ * <div class="sub-desc">
+ * <p>This is the data object used for reference in each code example:</p>
+ * <pre><code>
+var data = {
+    name: 'Jack Slocum',
+    title: 'Lead Developer',
+    company: 'Ext JS, LLC',
+    email: 'jack@extjs.com',
+    address: '4 Red Bulls Drive',
+    city: 'Cleveland',
+    state: 'Ohio',
+    zip: '44102',
+    drinks: ['Red Bull', 'Coffee', 'Water'],
+    kids: [{
+        name: 'Sara Grace',
+        age:3
+    },{
+        name: 'Zachary',
+        age:2
+    },{
+        name: 'John James',
+        age:0
+    }]
+};
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Auto filling of arrays</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>for</tt></b> operator are used
+ * to process the provided data object:
+ * <ul>
+ * <li>If the value specified in <tt>for</tt> is an array, it will auto-fill,
+ * repeating the template block inside the <tt>tpl</tt> tag for each item in the
+ * array.</li>
+ * <li>If <tt>for="."</tt> is specified, the data object provided is examined.</li>
+ * <li>While processing an array, the special variable <tt>{#}</tt>
+ * will provide the current array index + 1 (starts at 1, not 0).</li>
+ * </ul>
+ * </p>
+ * <pre><code>
+&lt;tpl <b>for</b>=".">...&lt;/tpl>       // loop through array at root node
+&lt;tpl <b>for</b>="foo">...&lt;/tpl>     // loop through array at foo node
+&lt;tpl <b>for</b>="foo.bar">...&lt;/tpl> // loop through array at foo.bar node
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for</b>=".">',       // process the data.kids node
+        '&lt;p>{#}. {name}&lt;/p>',  // use current array index to autonumber
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data.kids); // pass the kids property of the data object
+ * </code></pre>
+ * <p>An example illustrating how the <b><tt>for</tt></b> property can be leveraged
+ * to access specified members of the provided data object to populate the template:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Title: {title}&lt;/p>',
+    '&lt;p>Company: {company}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for="kids"</b>>',     // interrogate the kids property within the data
+        '&lt;p>{name}&lt;/p>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);  // pass the root node of the data object
+ * </code></pre>
+ * <p>Flat arrays that contain values (and not objects) can be auto-rendered
+ * using the special <b><tt>{.}</tt></b> variable inside a loop.  This variable
+ * will represent the value of the array at the current index:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>{name}\&#39;s favorite beverages:&lt;/p>',
+    '&lt;tpl for="drinks">',
+       '&lt;div> - {.}&lt;/div>',
+    '&lt;/tpl>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * <p>When processing a sub-template, for example while looping through a child array,
+ * you can access the parent object's members via the <b><tt>parent</tt></b> object:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+            '&lt;p>Dad: {<b>parent</b>.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Conditional processing with basic comparison operators</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>if</tt></b> operator are used
+ * to provide conditional checks for deciding whether or not to render specific
+ * parts of the template. Notes:<div class="sub-desc"><ul>
+ * <li>Double quotes must be encoded if used within the conditional</li>
+ * <li>There is no <tt>else</tt> operator &mdash; if needed, two opposite
+ * <tt>if</tt> statements should be used.</li>
+ * </ul></div>
+ * <pre><code>
+&lt;tpl if="age &gt; 1 &amp;&amp; age &lt; 10">Child&lt;/tpl>
+&lt;tpl if="age >= 10 && age < 18">Teenager&lt;/tpl>
+&lt;tpl <b>if</b>="this.isGirl(name)">...&lt;/tpl>
+&lt;tpl <b>if</b>="id==\'download\'">...&lt;/tpl>
+&lt;tpl <b>if</b>="needsIcon">&lt;img src="{icon}" class="{iconCls}"/>&lt;/tpl>
+// no good:
+&lt;tpl if="name == "Jack"">Hello&lt;/tpl>
+// encode &#34; if it is part of the condition, e.g.
+&lt;tpl if="name == &#38;quot;Jack&#38;quot;">Hello&lt;/tpl>
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Basic math support</u></b>
+ * <div class="sub-desc">
+ * <p>The following basic math operators may be applied directly on numeric
+ * data values:</p><pre>
+ * + - * /
+ * </pre>
+ * For example:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age &amp;gt; 1">',  // <-- Note that the &gt; is encoded
+            '&lt;p>{#}: {name}&lt;/p>',  // <-- Auto-number each item
+            '&lt;p>In 5 Years: {age+5}&lt;/p>',  // <-- Basic math
+            '&lt;p>Dad: {parent.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+</code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Execute arbitrary inline code with special built-in template variables</u></b>
+ * <div class="sub-desc">
+ * <p>Anything between <code>{[ ... ]}</code> is considered code to be executed
+ * in the scope of the template. There are some special variables available in that code:
+ * <ul>
+ * <li><b><tt>values</tt></b>: The values in the current scope. If you are using
+ * scope changing sub-templates, you can change what <tt>values</tt> is.</li>
+ * <li><b><tt>parent</tt></b>: The scope (values) of the ancestor template.</li>
+ * <li><b><tt>xindex</tt></b>: If you are in a looping template, the index of the
+ * loop you are in (1-based).</li>
+ * <li><b><tt>xcount</tt></b>: If you are in a looping template, the total length
+ * of the array you are looping.</li>
+ * <li><b><tt>fm</tt></b>: An alias for <tt>Ext.util.Format</tt>.</li>
+ * </ul>
+ * This example demonstrates basic row striping using an inline code block and the
+ * <tt>xindex</tt> variable:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Company: {[values.company.toUpperCase() + ", " + values.title]}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+       '&lt;div class="{[xindex % 2 === 0 ? "even" : "odd"]}">',
+        '{name}',
+        '&lt;/div>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * <li><b><u>Template member functions</u></b>
+ * <div class="sub-desc">
+ * <p>One or more member functions can be specified in a configuration
+ * object passed into the XTemplate constructor for more complex processing:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="this.isGirl(name)">',
+            '&lt;p>Girl: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        // use opposite if statement to simulate 'else' processing:
+        '&lt;tpl if="this.isGirl(name) == false">',
+            '&lt;p>Boy: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        '&lt;tpl if="this.isBaby(age)">',
+            '&lt;p>{name} is a baby!&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>',
+    {
+        // XTemplate configuration:
+        compiled: true,
+        disableFormats: true,
+        // member functions:
+        isGirl: function(name){
+            return name == 'Sara Grace';
+        },
+        isBaby: function(age){
+            return age < 1;
+        }
+    }
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * </ul></div>
+ *
+ * @param {Mixed} config
+ */
+Ext.XTemplate = function(){
+    Ext.XTemplate.superclass.constructor.apply(this, arguments);
+
+    var me = this,
+        s = me.html,
+        re = /<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,
+        nameRe = /^<tpl\b[^>]*?for="(.*?)"/,
+        ifRe = /^<tpl\b[^>]*?if="(.*?)"/,
+        execRe = /^<tpl\b[^>]*?exec="(.*?)"/,
+        m,
+        id = 0,
+        tpls = [],
+        VALUES = 'values',
+        PARENT = 'parent',
+        XINDEX = 'xindex',
+        XCOUNT = 'xcount',
+        RETURN = 'return ',
+        WITHVALUES = 'with(values){ ';
+
+    s = ['<tpl>', s, '</tpl>'].join('');
+
+    while((m = s.match(re))){
+        var m2 = m[0].match(nameRe),
+            m3 = m[0].match(ifRe),
+            m4 = m[0].match(execRe),
+            exp = null,
+            fn = null,
+            exec = null,
+            name = m2 && m2[1] ? m2[1] : '';
+
+       if (m3) {
+           exp = m3 && m3[1] ? m3[1] : null;
+           if(exp){
+               fn = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES + RETURN +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if (m4) {
+           exp = m4 && m4[1] ? m4[1] : null;
+           if(exp){
+               exec = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if(name){
+           switch(name){
+               case '.': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + VALUES + '; }'); break;
+               case '..': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + PARENT + '; }'); break;
+               default: name = new Function(VALUES, PARENT, WITHVALUES + RETURN + name + '; }');
+           }
+       }
+       tpls.push({
+            id: id,
+            target: name,
+            exec: exec,
+            test: fn,
+            body: m[1]||''
+        });
+       s = s.replace(m[0], '{xtpl'+ id + '}');
+       ++id;
+    }
+    for(var i = tpls.length-1; i >= 0; --i){
+        me.compileTpl(tpls[i]);
+    }
+    me.master = tpls[tpls.length-1];
+    me.tpls = tpls;
+};
+Ext.extend(Ext.XTemplate, Ext.Template, {
+    // private
+    re : /\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,
+    // private
+    codeRe : /\{\[((?:\\\]|.|\n)*?)\]\}/g,
+
+    // private
+    applySubTemplate : function(id, values, parent, xindex, xcount){
+        var me = this,
+            len,
+            t = me.tpls[id],
+            vs,
+            buf = [];
+        if ((t.test && !t.test.call(me, values, parent, xindex, xcount)) ||
+            (t.exec && t.exec.call(me, values, parent, xindex, xcount))) {
+            return '';
+        }
+        vs = t.target ? t.target.call(me, values, parent) : values;
+        len = vs.length;
+        parent = t.target ? values : parent;
+        if(t.target && Ext.isArray(vs)){
+            for(var i = 0, len = vs.length; i < len; i++){
+                buf[buf.length] = t.compiled.call(me, vs[i], parent, i+1, len);
+            }
+            return buf.join('');
+        }
+        return t.compiled.call(me, vs, parent, xindex, xcount);
+    },
+
+    // private
+    compileTpl : function(tpl){
+        var fm = Ext.util.Format,
+            useF = this.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args, math){
+            if(name.substr(0, 4) == 'xtpl'){
+                return "'"+ sep +'this.applySubTemplate('+name.substr(4)+', values, parent, xindex, xcount)'+sep+"'";
+            }
+            var v;
+            if(name === '.'){
+                v = 'values';
+            }else if(name === '#'){
+                v = 'xindex';
+            }else if(name.indexOf('.') != -1){
+                v = name;
+            }else{
+                v = "values['" + name + "']";
+            }
+            if(math){
+                v = '(' + v + math + ')';
+            }
+            if (format && useF) {
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            } else {
+                args= ''; format = "("+v+" === undefined ? '' : ";
+            }
+            return "'"+ sep + format + v + args + ")"+sep+"'";
+        }
+
+        function codeFn(m, code){
+            // Single quotes get escaped when the template is compiled, however we want to undo this when running code.
+            return "'" + sep + '(' + code.replace(/\\'/g, "'") + ')' + sep + "'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "tpl.compiled = function(values, parent, xindex, xcount){ return '" +
+                   tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn) +
+                    "';};";
+        }else{
+            body = ["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];
+            body.push(tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return this;
+    },
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        return this.master.compiled.call(this, values, {}, 1, 1);
+    },
+
+    /**
+     * Compile the template to a function for optimized performance.  Recommended if the template will be used frequently.
+     * @return {Function} The compiled function
+     */
+    compile : function(){return this;}
+
+    /**
+     * @property re
+     * @hide
+     */
+    /**
+     * @property disableFormats
+     * @hide
+     */
+    /**
+     * @method set
+     * @hide
+     */
+
+});
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified values applied.
+ * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+ * @return {String} The HTML fragment
+ * @member Ext.XTemplate
+ * @method apply
+ */
+Ext.XTemplate.prototype.apply = Ext.XTemplate.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.XTemplate.from = function(el){
+    el = Ext.getDom(el);
+    return new Ext.XTemplate(el.value || el.innerHTML);
+};
+/**
+ * @class Ext.util.CSS
+ * Utility class for manipulating CSS rules
+ * @singleton
+ */
+Ext.util.CSS = function(){
+	var rules = null;
+   	var doc = document;
+
+    var camelRe = /(-[a-z])/gi;
+    var camelFn = function(m, a){ return a.charAt(1).toUpperCase(); };
+
+   return {
+   /**
+    * Creates a stylesheet from a text blob of rules.
+    * These rules will be wrapped in a STYLE tag and appended to the HEAD of the document.
+    * @param {String} cssText The text containing the css rules
+    * @param {String} id An id to add to the stylesheet for later removal
+    * @return {StyleSheet}
+    */
+   createStyleSheet : function(cssText, id){
+       var ss;
+       var head = doc.getElementsByTagName("head")[0];
+       var rules = doc.createElement("style");
+       rules.setAttribute("type", "text/css");
+       if(id){
+           rules.setAttribute("id", id);
+       }
+       if(Ext.isIE){
+           head.appendChild(rules);
+           ss = rules.styleSheet;
+           ss.cssText = cssText;
+       }else{
+           try{
+                rules.appendChild(doc.createTextNode(cssText));
+           }catch(e){
+               rules.cssText = cssText;
+           }
+           head.appendChild(rules);
+           ss = rules.styleSheet ? rules.styleSheet : (rules.sheet || doc.styleSheets[doc.styleSheets.length-1]);
+       }
+       this.cacheStyleSheet(ss);
+       return ss;
+   },
+
+   /**
+    * Removes a style or link tag by id
+    * @param {String} id The id of the tag
+    */
+   removeStyleSheet : function(id){
+       var existing = doc.getElementById(id);
+       if(existing){
+           existing.parentNode.removeChild(existing);
+       }
+   },
+
+   /**
+    * Dynamically swaps an existing stylesheet reference for a new one
+    * @param {String} id The id of an existing link tag to remove
+    * @param {String} url The href of the new stylesheet to include
+    */
+   swapStyleSheet : function(id, url){
+       this.removeStyleSheet(id);
+       var ss = doc.createElement("link");
+       ss.setAttribute("rel", "stylesheet");
+       ss.setAttribute("type", "text/css");
+       ss.setAttribute("id", id);
+       ss.setAttribute("href", url);
+       doc.getElementsByTagName("head")[0].appendChild(ss);
+   },
+   
+   /**
+    * Refresh the rule cache if you have dynamically added stylesheets
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   refreshCache : function(){
+       return this.getRules(true);
+   },
+
+   // private
+   cacheStyleSheet : function(ss){
+       if(!rules){
+           rules = {};
+       }
+       try{// try catch for cross domain access issue
+           var ssRules = ss.cssRules || ss.rules;
+           for(var j = ssRules.length-1; j >= 0; --j){
+               rules[ssRules[j].selectorText.toLowerCase()] = ssRules[j];
+           }
+       }catch(e){}
+   },
+   
+   /**
+    * Gets all css rules for the document
+    * @param {Boolean} refreshCache true to refresh the internal cache
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   getRules : function(refreshCache){
+   		if(rules === null || refreshCache){
+   			rules = {};
+   			var ds = doc.styleSheets;
+   			for(var i =0, len = ds.length; i < len; i++){
+   			    try{
+    		        this.cacheStyleSheet(ds[i]);
+    		    }catch(e){} 
+	        }
+   		}
+   		return rules;
+   	},
+   	
+   	/**
+    * Gets an an individual CSS rule by selector(s)
+    * @param {String/Array} selector The CSS selector or an array of selectors to try. The first selector that is found is returned.
+    * @param {Boolean} refreshCache true to refresh the internal cache if you have recently updated any rules or added styles dynamically
+    * @return {CSSRule} The CSS rule or null if one is not found
+    */
+   getRule : function(selector, refreshCache){
+   		var rs = this.getRules(refreshCache);
+   		if(!Ext.isArray(selector)){
+   		    return rs[selector.toLowerCase()];
+   		}
+   		for(var i = 0; i < selector.length; i++){
+			if(rs[selector[i]]){
+				return rs[selector[i].toLowerCase()];
+			}
+		}
+		return null;
+   	},
+   	
+   	
+   	/**
+    * Updates a rule property
+    * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found.
+    * @param {String} property The css property
+    * @param {String} value The new value for the property
+    * @return {Boolean} true If a rule was found and updated
+    */
+   updateRule : function(selector, property, value){
+   		if(!Ext.isArray(selector)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				rule.style[property.replace(camelRe, camelFn)] = value;
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.updateRule(selector[i], property, value)){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	}
+   };	
+}();/**
+ @class Ext.util.ClickRepeater
+ @extends Ext.util.Observable
+
+ A wrapper class which can be applied to any element. Fires a "click" event while the
+ mouse is pressed. The interval between firings may be specified in the config but
+ defaults to 20 milliseconds.
+
+ Optionally, a CSS class may be applied to the element during the time it is pressed.
+
+ @cfg {Mixed} el The element to act as a button.
+ @cfg {Number} delay The initial delay before the repeating event begins firing.
+ Similar to an autorepeat key delay.
+ @cfg {Number} interval The interval between firings of the "click" event. Default 20 ms.
+ @cfg {String} pressClass A CSS class name to be applied to the element while pressed.
+ @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
+           "interval" and "delay" are ignored.
+ @cfg {Boolean} preventDefault True to prevent the default click event
+ @cfg {Boolean} stopDefault True to stop the default click event
+
+ @history
+    2007-02-02 jvs Original code contributed by Nige "Animal" White
+    2007-02-02 jvs Renamed to ClickRepeater
+    2007-02-03 jvs Modifications for FF Mac and Safari
+
+ @constructor
+ @param {Mixed} el The element to listen on
+ @param {Object} config
+ */
+Ext.util.ClickRepeater = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+        this.el.unselectable();
+
+        Ext.apply(this, config);
+
+        this.addEvents(
+        /**
+         * @event mousedown
+         * Fires when the mouse button is depressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mousedown",
+        /**
+         * @event click
+         * Fires on a specified interval during the time the element is pressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "click",
+        /**
+         * @event mouseup
+         * Fires when the mouse key is released.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mouseup"
+        );
+
+        if(!this.disabled){
+            this.disabled = true;
+            this.enable();
+        }
+
+        // allow inline handler
+        if(this.handler){
+            this.on("click", this.handler,  this.scope || this);
+        }
+
+        Ext.util.ClickRepeater.superclass.constructor.call(this);        
+    },
+    
+    interval : 20,
+    delay: 250,
+    preventDefault : true,
+    stopDefault : false,
+    timer : 0,
+
+    /**
+     * Enables the repeater and allows events to fire.
+     */
+    enable: function(){
+        if(this.disabled){
+            this.el.on('mousedown', this.handleMouseDown, this);
+            if (Ext.isIE){
+                this.el.on('dblclick', this.handleDblClick, this);
+            }
+            if(this.preventDefault || this.stopDefault){
+                this.el.on('click', this.eventOptions, this);
+            }
+        }
+        this.disabled = false;
+    },
+
+    /**
+     * Disables the repeater and stops events from firing.
+     */
+    disable: function(/* private */ force){
+        if(force || !this.disabled){
+            clearTimeout(this.timer);
+            if(this.pressClass){
+                this.el.removeClass(this.pressClass);
+            }
+            Ext.getDoc().un('mouseup', this.handleMouseUp, this);
+            this.el.removeAllListeners();
+        }
+        this.disabled = true;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled: function(disabled){
+        this[disabled ? 'disable' : 'enable']();
+    },
+
+    eventOptions: function(e){
+        if(this.preventDefault){
+            e.preventDefault();
+        }
+        if(this.stopDefault){
+            e.stopEvent();
+        }
+    },
+
+    // private
+    destroy : function() {
+        this.disable(true);
+        Ext.destroy(this.el);
+        this.purgeListeners();
+    },
+
+    handleDblClick : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+    },
+
+    // private
+    handleMouseDown : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.mousedownTime = new Date();
+
+        Ext.getDoc().on("mouseup", this.handleMouseUp, this);
+        this.el.on("mouseout", this.handleMouseOut, this);
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+
+        // Do not honor delay or interval if acceleration wanted.
+        if (this.accelerate) {
+            this.delay = 400;
+        }
+        this.timer = this.click.defer(this.delay || this.interval, this, [e]);
+    },
+
+    // private
+    click : function(e){
+        this.fireEvent("click", this, e);
+        this.timer = this.click.defer(this.accelerate ?
+            this.easeOutExpo(this.mousedownTime.getElapsed(),
+                400,
+                -390,
+                12000) :
+            this.interval, this, [e]);
+    },
+
+    easeOutExpo : function (t, b, c, d) {
+        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+    },
+
+    // private
+    handleMouseOut : function(){
+        clearTimeout(this.timer);
+        if(this.pressClass){
+            this.el.removeClass(this.pressClass);
+        }
+        this.el.on("mouseover", this.handleMouseReturn, this);
+    },
+
+    // private
+    handleMouseReturn : function(){
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.click();
+    },
+
+    // private
+    handleMouseUp : function(e){
+        clearTimeout(this.timer);
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        this.el.un("mouseout", this.handleMouseOut, this);
+        Ext.getDoc().un("mouseup", this.handleMouseUp, this);
+        this.el.removeClass(this.pressClass);
+        this.fireEvent("mouseup", this, e);
+    }
+});/**
+ * @class Ext.KeyNav
+ * <p>Provides a convenient wrapper for normalized keyboard navigation.  KeyNav allows you to bind
+ * navigation keys to function calls that will get called when the keys are pressed, providing an easy
+ * way to implement custom navigation schemes for any UI component.</p>
+ * <p>The following are all of the possible keys that can be implemented: enter, left, right, up, down, tab, esc,
+ * pageUp, pageDown, del, home, end.  Usage:</p>
+ <pre><code>
+var nav = new Ext.KeyNav("my-element", {
+    "left" : function(e){
+        this.moveLeft(e.ctrlKey);
+    },
+    "right" : function(e){
+        this.moveRight(e.ctrlKey);
+    },
+    "enter" : function(e){
+        this.save();
+    },
+    scope : this
+});
+</code></pre>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config
+ */
+Ext.KeyNav = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(!this.disabled){
+        this.disabled = true;
+        this.enable();
+    }
+};
+
+Ext.KeyNav.prototype = {
+    /**
+     * @cfg {Boolean} disabled
+     * True to disable this KeyNav instance (defaults to false)
+     */
+    disabled : false,
+    /**
+     * @cfg {String} defaultEventAction
+     * The method to call on the {@link Ext.EventObject} after this KeyNav intercepts a key.  Valid values are
+     * {@link Ext.EventObject#stopEvent}, {@link Ext.EventObject#preventDefault} and
+     * {@link Ext.EventObject#stopPropagation} (defaults to 'stopEvent')
+     */
+    defaultEventAction: "stopEvent",
+    /**
+     * @cfg {Boolean} forceKeyDown
+     * Handle the keydown event instead of keypress (defaults to false).  KeyNav automatically does this for IE since
+     * IE does not propagate special keys on keypress, but setting this to true will force other browsers to also
+     * handle keydown instead of keypress.
+     */
+    forceKeyDown : false,
+
+    // private
+    relay : function(e){
+        var k = e.getKey(),
+            h = this.keyToHandler[k];
+        if(h && this[h]){
+            if(this.doRelay(e, this[h], h) !== true){
+                e[this.defaultEventAction]();
+            }
+        }
+    },
+
+    // private
+    doRelay : function(e, h, hname){
+        return h.call(this.scope || this, e, hname);
+    },
+
+    // possible handlers
+    enter : false,
+    left : false,
+    right : false,
+    up : false,
+    down : false,
+    tab : false,
+    esc : false,
+    pageUp : false,
+    pageDown : false,
+    del : false,
+    home : false,
+    end : false,
+    space : false,
+
+    // quick lookup hash
+    keyToHandler : {
+        37 : "left",
+        39 : "right",
+        38 : "up",
+        40 : "down",
+        33 : "pageUp",
+        34 : "pageDown",
+        46 : "del",
+        36 : "home",
+        35 : "end",
+        13 : "enter",
+        27 : "esc",
+        9  : "tab",
+        32 : "space"
+    },
+    
+    stopKeyUp: function(e) {
+        var k = e.getKey();
+
+        if (k >= 37 && k <= 40) {
+            // *** bugfix - safari 2.x fires 2 keyup events on cursor keys
+            // *** (note: this bugfix sacrifices the "keyup" event originating from keyNav elements in Safari 2)
+            e.stopEvent();
+        }
+    },
+    
+    /**
+     * Destroy this KeyNav (this is the same as calling disable).
+     */
+    destroy: function(){
+        this.disable();    
+    },
+
+	/**
+	 * Enable this KeyNav
+	 */
+	enable: function() {
+        if (this.disabled) {
+            if (Ext.isSafari2) {
+                // call stopKeyUp() on "keyup" event
+                this.el.on('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.on(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = false;
+        }
+    },
+
+	/**
+	 * Disable this KeyNav
+	 */
+	disable: function() {
+        if (!this.disabled) {
+            if (Ext.isSafari2) {
+                // remove "keyup" event handler
+                this.el.un('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.un(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = true;
+        }
+    },
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    },
+    
+    // private
+    isKeydown: function(){
+        return this.forceKeyDown || Ext.EventManager.useKeydown;
+    }
+};
+/**
+ * @class Ext.KeyMap
+ * Handles mapping keys to actions for an element. One key map can be used for multiple actions.
+ * The constructor accepts the same config object as defined by {@link #addBinding}.
+ * If you bind a callback function to a KeyMap, anytime the KeyMap handles an expected key
+ * combination it will call the function with this signature (if the match is a multi-key
+ * combination the callback will still be called only once): (String key, Ext.EventObject e)
+ * A KeyMap can also handle a string representation of keys.<br />
+ * Usage:
+ <pre><code>
+// map one key by key code
+var map = new Ext.KeyMap("my-element", {
+    key: 13, // or Ext.EventObject.ENTER
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to one action by string
+var map = new Ext.KeyMap("my-element", {
+    key: "a\r\n\t",
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to multiple actions by strings and array of codes
+var map = new Ext.KeyMap("my-element", [
+    {
+        key: [10,13],
+        fn: function(){ alert("Return was pressed"); }
+    }, {
+        key: "abc",
+        fn: function(){ alert('a, b or c was pressed'); }
+    }, {
+        key: "\t",
+        ctrl:true,
+        shift:true,
+        fn: function(){ alert('Control + shift + tab was pressed.'); }
+    }
+]);
+</code></pre>
+ * <b>Note: A KeyMap starts enabled</b>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config (see {@link #addBinding})
+ * @param {String} eventName (optional) The event to bind to (defaults to "keydown")
+ */
+Ext.KeyMap = function(el, config, eventName){
+    this.el  = Ext.get(el);
+    this.eventName = eventName || "keydown";
+    this.bindings = [];
+    if(config){
+        this.addBinding(config);
+    }
+    this.enable();
+};
+
+Ext.KeyMap.prototype = {
+    /**
+     * True to stop the event from bubbling and prevent the default browser action if the
+     * key was handled by the KeyMap (defaults to false)
+     * @type Boolean
+     */
+    stopEvent : false,
+
+    /**
+     * Add a new binding to this KeyMap. The following config object properties are supported:
+     * <pre>
+Property    Type             Description
+----------  ---------------  ----------------------------------------------------------------------
+key         String/Array     A single keycode or an array of keycodes to handle
+shift       Boolean          True to handle key only when shift is pressed, False to handle the key only when shift is not pressed (defaults to undefined)
+ctrl        Boolean          True to handle key only when ctrl is pressed, False to handle the key only when ctrl is not pressed (defaults to undefined)
+alt         Boolean          True to handle key only when alt is pressed, False to handle the key only when alt is not pressed (defaults to undefined)
+handler     Function         The function to call when KeyMap finds the expected key combination
+fn          Function         Alias of handler (for backwards-compatibility)
+scope       Object           The scope of the callback function
+stopEvent   Boolean          True to stop the event from bubbling and prevent the default browser action if the key was handled by the KeyMap (defaults to false)
+</pre>
+     *
+     * Usage:
+     * <pre><code>
+// Create a KeyMap
+var map = new Ext.KeyMap(document, {
+    key: Ext.EventObject.ENTER,
+    fn: handleKey,
+    scope: this
+});
+
+//Add a new binding to the existing KeyMap later
+map.addBinding({
+    key: 'abc',
+    shift: true,
+    fn: handleKey,
+    scope: this
+});
+</code></pre>
+     * @param {Object/Array} config A single KeyMap config or an array of configs
+     */
+	addBinding : function(config){
+        if(Ext.isArray(config)){
+            Ext.each(config, function(c){
+                this.addBinding(c);
+            }, this);
+            return;
+        }
+        var keyCode = config.key,
+            fn = config.fn || config.handler,
+            scope = config.scope;
+
+	if (config.stopEvent) {
+	    this.stopEvent = config.stopEvent;    
+	}	
+
+        if(typeof keyCode == "string"){
+            var ks = [];
+            var keyString = keyCode.toUpperCase();
+            for(var j = 0, len = keyString.length; j < len; j++){
+                ks.push(keyString.charCodeAt(j));
+            }
+            keyCode = ks;
+        }
+        var keyArray = Ext.isArray(keyCode);
+        
+        var handler = function(e){
+            if(this.checkModifiers(config, e)){
+                var k = e.getKey();
+                if(keyArray){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          if(this.stopEvent){
+                              e.stopEvent();
+                          }
+                          fn.call(scope || window, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        if(this.stopEvent){
+                           e.stopEvent();
+                        }
+                        fn.call(scope || window, k, e);
+                    }
+                }
+            }
+        };
+        this.bindings.push(handler);
+	},
+    
+    // private
+    checkModifiers: function(config, e){
+        var val, key, keys = ['shift', 'ctrl', 'alt'];
+        for (var i = 0, len = keys.length; i < len; ++i){
+            key = keys[i];
+            val = config[key];
+            if(!(val === undefined || (val === e[key + 'Key']))){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Shorthand for adding a single key listener
+     * @param {Number/Array/Object} key Either the numeric key code, array of key codes or an object with the
+     * following options:
+     * {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    on : function(key, fn, scope){
+        var keyCode, shift, ctrl, alt;
+        if(typeof key == "object" && !Ext.isArray(key)){
+            keyCode = key.key;
+            shift = key.shift;
+            ctrl = key.ctrl;
+            alt = key.alt;
+        }else{
+            keyCode = key;
+        }
+        this.addBinding({
+            key: keyCode,
+            shift: shift,
+            ctrl: ctrl,
+            alt: alt,
+            fn: fn,
+            scope: scope
+        });
+    },
+
+    // private
+    handleKeyDown : function(e){
+	    if(this.enabled){ //just in case
+    	    var b = this.bindings;
+    	    for(var i = 0, len = b.length; i < len; i++){
+    	        b[i].call(this, e);
+    	    }
+	    }
+	},
+
+	/**
+	 * Returns true if this KeyMap is enabled
+	 * @return {Boolean}
+	 */
+	isEnabled : function(){
+	    return this.enabled;
+	},
+
+	/**
+	 * Enables this KeyMap
+	 */
+	enable: function(){
+		if(!this.enabled){
+		    this.el.on(this.eventName, this.handleKeyDown, this);
+		    this.enabled = true;
+		}
+	},
+
+	/**
+	 * Disable this KeyMap
+	 */
+	disable: function(){
+		if(this.enabled){
+		    this.el.removeListener(this.eventName, this.handleKeyDown, this);
+		    this.enabled = false;
+		}
+	},
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    }
+};/**
+ * @class Ext.util.TextMetrics
+ * Provides precise pixel measurements for blocks of text so that you can determine exactly how high and
+ * wide, in pixels, a given block of text will be. Note that when measuring text, it should be plain text and
+ * should not contain any HTML, otherwise it may not be measured correctly.
+ * @singleton
+ */
+Ext.util.TextMetrics = function(){
+    var shared;
+    return {
+        /**
+         * Measures the size of the specified text
+         * @param {String/HTMLElement} el The element, dom node or id from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String} text The text to measure
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        measure : function(el, text, fixedWidth){
+            if(!shared){
+                shared = Ext.util.TextMetrics.Instance(el, fixedWidth);
+            }
+            shared.bind(el);
+            shared.setFixedWidth(fixedWidth || 'auto');
+            return shared.getSize(text);
+        },
+
+        /**
+         * Return a unique TextMetrics instance that can be bound directly to an element and reused.  This reduces
+         * the overhead of multiple calls to initialize the style properties on each measurement.
+         * @param {String/HTMLElement} el The element, dom node or id that the instance will be bound to
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Ext.util.TextMetrics.Instance} instance The new instance
+         */
+        createInstance : function(el, fixedWidth){
+            return Ext.util.TextMetrics.Instance(el, fixedWidth);
+        }
+    };
+}();
+
+Ext.util.TextMetrics.Instance = function(bindTo, fixedWidth){
+    var ml = new Ext.Element(document.createElement('div'));
+    document.body.appendChild(ml.dom);
+    ml.position('absolute');
+    ml.setLeftTop(-1000, -1000);
+    ml.hide();
+
+    if(fixedWidth){
+        ml.setWidth(fixedWidth);
+    }
+
+    var instance = {
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the size of the specified text based on the internal element's style and width properties
+         * @param {String} text The text to measure
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        getSize : function(text){
+            ml.update(text);
+            var s = ml.getSize();
+            ml.update('');
+            return s;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Binds this TextMetrics instance to an element from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String/HTMLElement} el The element, dom node or id
+         */
+        bind : function(el){
+            ml.setStyle(
+                Ext.fly(el).getStyles('font-size','font-style', 'font-weight', 'font-family','line-height', 'text-transform', 'letter-spacing')
+            );
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Sets a fixed width on the internal measurement element.  If the text will be multiline, you have
+         * to set a fixed width in order to accurately measure the text height.
+         * @param {Number} width The width to set on the element
+         */
+        setFixedWidth : function(width){
+            ml.setWidth(width);
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured width of the specified text
+         * @param {String} text The text to measure
+         * @return {Number} width The width in pixels
+         */
+        getWidth : function(text){
+            ml.dom.style.width = 'auto';
+            return this.getSize(text).width;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured height of the specified text.  For multiline text, be sure to call
+         * {@link #setFixedWidth} if necessary.
+         * @param {String} text The text to measure
+         * @return {Number} height The height in pixels
+         */
+        getHeight : function(text){
+            return this.getSize(text).height;
+        }
+    };
+
+    instance.bind(bindTo);
+
+    return instance;
+};
+
+Ext.Element.addMethods({
+    /**
+     * Returns the width in pixels of the passed text, or the width of the text in this Element.
+     * @param {String} text The text to measure. Defaults to the innerHTML of the element.
+     * @param {Number} min (Optional) The minumum value to return.
+     * @param {Number} max (Optional) The maximum value to return.
+     * @return {Number} The text width in pixels.
+     * @member Ext.Element getTextWidth
+     */
+    getTextWidth : function(text, min, max){
+        return (Ext.util.TextMetrics.measure(this.dom, Ext.value(text, this.dom.innerHTML, true)).width).constrain(min || 0, max || 1000000);
+    }
+});
+/**
+ * @class Ext.util.Cookies
+ * Utility class for managing and interacting with cookies.
+ * @singleton
+ */
+Ext.util.Cookies = {
+    /**
+     * Create a cookie with the specified name and value. Additional settings
+     * for the cookie may be optionally specified (for example: expiration,
+     * access restriction, SSL).
+     * @param {String} name The name of the cookie to set. 
+     * @param {Mixed} value The value to set for the cookie.
+     * @param {Object} expires (Optional) Specify an expiration date the
+     * cookie is to persist until.  Note that the specified Date object will
+     * be converted to Greenwich Mean Time (GMT). 
+     * @param {String} path (Optional) Setting a path on the cookie restricts
+     * access to pages that match that path. Defaults to all pages (<tt>'/'</tt>). 
+     * @param {String} domain (Optional) Setting a domain restricts access to
+     * pages on a given domain (typically used to allow cookie access across
+     * subdomains). For example, "extjs.com" will create a cookie that can be
+     * accessed from any subdomain of extjs.com, including www.extjs.com,
+     * support.extjs.com, etc.
+     * @param {Boolean} secure (Optional) Specify true to indicate that the cookie
+     * should only be accessible via SSL on a page using the HTTPS protocol.
+     * Defaults to <tt>false</tt>. Note that this will only work if the page
+     * calling this code uses the HTTPS protocol, otherwise the cookie will be
+     * created with default options.
+     */
+    set : function(name, value){
+        var argv = arguments;
+        var argc = arguments.length;
+        var expires = (argc > 2) ? argv[2] : null;
+        var path = (argc > 3) ? argv[3] : '/';
+        var domain = (argc > 4) ? argv[4] : null;
+        var secure = (argc > 5) ? argv[5] : false;
+        document.cookie = name + "=" + escape(value) + ((expires === null) ? "" : ("; expires=" + expires.toGMTString())) + ((path === null) ? "" : ("; path=" + path)) + ((domain === null) ? "" : ("; domain=" + domain)) + ((secure === true) ? "; secure" : "");
+    },
+
+    /**
+     * Retrieves cookies that are accessible by the current page. If a cookie
+     * does not exist, <code>get()</code> returns <tt>null</tt>.  The following
+     * example retrieves the cookie called "valid" and stores the String value
+     * in the variable <tt>validStatus</tt>.
+     * <pre><code>
+     * var validStatus = Ext.util.Cookies.get("valid");
+     * </code></pre>
+     * @param {String} name The name of the cookie to get
+     * @return {Mixed} Returns the cookie value for the specified name;
+     * null if the cookie name does not exist.
+     */
+    get : function(name){
+        var arg = name + "=";
+        var alen = arg.length;
+        var clen = document.cookie.length;
+        var i = 0;
+        var j = 0;
+        while(i < clen){
+            j = i + alen;
+            if(document.cookie.substring(i, j) == arg){
+                return Ext.util.Cookies.getCookieVal(j);
+            }
+            i = document.cookie.indexOf(" ", i) + 1;
+            if(i === 0){
+                break;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Removes a cookie with the provided name from the browser
+     * if found by setting its expiration date to sometime in the past. 
+     * @param {String} name The name of the cookie to remove
+     */
+    clear : function(name){
+        if(Ext.util.Cookies.get(name)){
+            document.cookie = name + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
+        }
+    },
+    /**
+     * @private
+     */
+    getCookieVal : function(offset){
+        var endstr = document.cookie.indexOf(";", offset);
+        if(endstr == -1){
+            endstr = document.cookie.length;
+        }
+        return unescape(document.cookie.substring(offset, endstr));
+    }
+};/**
+ * Framework-wide error-handler.  Developers can override this method to provide
+ * custom exception-handling.  Framework errors will often extend from the base
+ * Ext.Error class.
+ * @param {Object/Error} e The thrown exception object.
+ */
+Ext.handleError = function(e) {
+    throw e;
+};
+
+/**
+ * @class Ext.Error
+ * @extends Error
+ * <p>A base error class. Future implementations are intended to provide more
+ * robust error handling throughout the framework (<b>in the debug build only</b>)
+ * to check for common errors and problems. The messages issued by this class
+ * will aid error checking. Error checks will be automatically removed in the
+ * production build so that performance is not negatively impacted.</p>
+ * <p>Some sample messages currently implemented:</p><pre>
+"DataProxy attempted to execute an API-action but found an undefined
+url / function. Please review your Proxy url/api-configuration."
+ * </pre><pre>
+"Could not locate your "root" property in your server response.
+Please review your JsonReader config to ensure the config-property
+"root" matches the property your server-response.  See the JsonReader
+docs for additional assistance."
+ * </pre>
+ * <p>An example of the code used for generating error messages:</p><pre><code>
+try {
+    generateError({
+        foo: 'bar'
+    });
+}
+catch (e) {
+    console.error(e);
+}
+function generateError(data) {
+    throw new Ext.Error('foo-error', data);
+}
+ * </code></pre>
+ * @param {String} message
+ */
+Ext.Error = function(message) {
+    // Try to read the message from Ext.Error.lang
+    this.message = (this.lang[message]) ? this.lang[message] : message;
+};
+
+Ext.Error.prototype = new Error();
+Ext.apply(Ext.Error.prototype, {
+    // protected.  Extensions place their error-strings here.
+    lang: {},
+
+    name: 'Ext.Error',
+    /**
+     * getName
+     * @return {String}
+     */
+    getName : function() {
+        return this.name;
+    },
+    /**
+     * getMessage
+     * @return {String}
+     */
+    getMessage : function() {
+        return this.message;
+    },
+    /**
+     * toJson
+     * @return {String}
+     */
+    toJson : function() {
+        return Ext.encode(this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.grid.CellSelectionModel=Ext.extend(Ext.grid.AbstractSelectionModel,{constructor:function(a){Ext.apply(this,a);this.selection=null;this.addEvents("beforecellselect","cellselect","selectionchange");Ext.grid.CellSelectionModel.superclass.constructor.call(this)},initEvents:function(){this.grid.on("cellmousedown",this.handleMouseDown,this);this.grid.on(Ext.EventManager.getKeyEvent(),this.handleKeyDown,this);this.grid.getView().on({scope:this,refresh:this.onViewChange,rowupdated:this.onRowUpdated,beforerowremoved:this.clearSelections,beforerowsinserted:this.clearSelections});if(this.grid.isEditor){this.grid.on("beforeedit",this.beforeEdit,this)}},beforeEdit:function(a){this.select(a.row,a.column,false,true,a.record)},onRowUpdated:function(a,b,c){if(this.selection&&this.selection.record==c){a.onCellSelect(b,this.selection.cell[1])}},onViewChange:function(){this.clearSelections(true)},getSelectedCell:function(){return this.selection?this.selection.cell:null},clearSelections:function(b){var a=this.selection;if(a){if(b!==true){this.grid.view.onCellDeselect(a.cell[0],a.cell[1])}this.selection=null;this.fireEvent("selectionchange",this,null)}},hasSelection:function(){return this.selection?true:false},handleMouseDown:function(b,d,a,c){if(c.button!==0||this.isLocked()){return}this.select(d,a)},select:function(f,c,b,e,d){if(this.fireEvent("beforecellselect",this,f,c)!==false){this.clearSelections();d=d||this.grid.store.getAt(f);this.selection={record:d,cell:[f,c]};if(!b){var a=this.grid.getView();a.onCellSelect(f,c);if(e!==true){a.focusCell(f,c)}}this.fireEvent("cellselect",this,f,c);this.fireEvent("selectionchange",this,this.selection)}},isSelectable:function(c,b,a){return !a.isHidden(b)},onEditorKey:function(b,a){if(a.getKey()==a.TAB){this.handleKeyDown(a)}},handleKeyDown:function(i){if(!i.isNavKeyPress()){return}var d=i.getKey(),h=this.grid,o=this.selection,b=this,l=function(g,c,e){return h.walkCells(g,c,e,h.isEditor&&h.editing?b.acceptsNav:b.isSelectable,b)},n,f,a,j,m;switch(d){case i.ESC:case i.PAGE_UP:case i.PAGE_DOWN:break;default:i.stopEvent();break}if(!o){n=l(0,0,1);if(n){this.select(n[0],n[1])}return}n=o.cell;a=n[0];j=n[1];switch(d){case i.TAB:if(i.shiftKey){f=l(a,j-1,-1)}else{f=l(a,j+1,1)}break;case i.DOWN:f=l(a+1,j,1);break;case i.UP:f=l(a-1,j,-1);break;case i.RIGHT:f=l(a,j+1,1);break;case i.LEFT:f=l(a,j-1,-1);break;case i.ENTER:if(h.isEditor&&!h.editing){h.startEditing(a,j);return}break}if(f){a=f[0];j=f[1];this.select(a,j);if(h.isEditor&&h.editing){m=h.activeEditor;if(m&&m.field.triggerBlur){m.field.triggerBlur()}h.startEditing(a,j)}}},acceptsNav:function(c,b,a){return !a.isHidden(b)&&a.isCellEditable(b,c)}});Ext.grid.EditorGridPanel=Ext.extend(Ext.grid.GridPanel,{clicksToEdit:2,forceValidation:false,isEditor:true,detectEdit:false,autoEncode:false,trackMouseOver:false,initComponent:function(){Ext.grid.EditorGridPanel.superclass.initComponent.call(this);if(!this.selModel){this.selModel=new Ext.grid.CellSelectionModel()}this.activeEditor=null;this.addEvents("beforeedit","afteredit","validateedit")},initEvents:function(){Ext.grid.EditorGridPanel.superclass.initEvents.call(this);this.getGridEl().on("mousewheel",this.stopEditing.createDelegate(this,[true]),this);this.on("columnresize",this.stopEditing,this,[true]);if(this.clicksToEdit==1){this.on("cellclick",this.onCellDblClick,this)}else{var a=this.getView();if(this.clicksToEdit=="auto"&&a.mainBody){a.mainBody.on("mousedown",this.onAutoEditClick,this)}this.on("celldblclick",this.onCellDblClick,this)}},onResize:function(){Ext.grid.EditorGridPanel.superclass.onResize.apply(this,arguments);var a=this.activeEditor;if(this.editing&&a){a.realign(true)}},onCellDblClick:function(b,c,a){this.startEditing(c,a)},onAutoEditClick:function(c,b){if(c.button!==0){return}var f=this.view.findRowIndex(b),a=this.view.findCellIndex(b);if(f!==false&&a!==false){this.stopEditing();if(this.selModel.getSelectedCell){var d=this.selModel.getSelectedCell();if(d&&d[0]===f&&d[1]===a){this.startEditing(f,a)}}else{if(this.selModel.isSelected(f)){this.startEditing(f,a)}}}},onEditComplete:function(b,d,a){this.editing=false;this.lastActiveEditor=this.activeEditor;this.activeEditor=null;var c=b.record,g=this.colModel.getDataIndex(b.col);d=this.postEditValue(d,a,c,g);if(this.forceValidation===true||String(d)!==String(a)){var f={grid:this,record:c,field:g,originalValue:a,value:d,row:b.row,column:b.col,cancel:false};if(this.fireEvent("validateedit",f)!==false&&!f.cancel&&String(d)!==String(a)){c.set(g,f.value);delete f.cancel;this.fireEvent("afteredit",f)}}this.view.focusCell(b.row,b.col)},startEditing:function(h,c){this.stopEditing();if(this.colModel.isCellEditable(c,h)){this.view.ensureVisible(h,c,true);var d=this.store.getAt(h),g=this.colModel.getDataIndex(c),f={grid:this,record:d,field:g,value:d.data[g],row:h,column:c,cancel:false};if(this.fireEvent("beforeedit",f)!==false&&!f.cancel){this.editing=true;var b=this.colModel.getCellEditor(c,h);if(!b){return}if(!b.rendered){b.parentEl=this.view.getEditorParent(b);b.on({scope:this,render:{fn:function(e){e.field.focus(false,true)},single:true,scope:this},specialkey:function(j,i){this.getSelectionModel().onEditorKey(j,i)},complete:this.onEditComplete,canceledit:this.stopEditing.createDelegate(this,[true])})}Ext.apply(b,{row:h,col:c,record:d});this.lastEdit={row:h,col:c};this.activeEditor=b;b.selectSameEditor=(this.activeEditor==this.lastActiveEditor);var a=this.preEditValue(d,g);b.startEdit(this.view.getCell(h,c).firstChild,Ext.isDefined(a)?a:"");(function(){delete b.selectSameEditor}).defer(50)}}},preEditValue:function(a,c){var b=a.data[c];return this.autoEncode&&Ext.isString(b)?Ext.util.Format.htmlDecode(b):b},postEditValue:function(c,a,b,d){return this.autoEncode&&Ext.isString(c)?Ext.util.Format.htmlEncode(c):c},stopEditing:function(b){if(this.editing){var a=this.lastActiveEditor=this.activeEditor;if(a){a[b===true?"cancelEdit":"completeEdit"]();this.view.focusCell(a.row,a.col)}this.activeEditor=null}this.editing=false}});Ext.reg("editorgrid",Ext.grid.EditorGridPanel);Ext.grid.GridEditor=function(b,a){Ext.grid.GridEditor.superclass.constructor.call(this,b,a);b.monitorTab=false};Ext.extend(Ext.grid.GridEditor,Ext.Editor,{alignment:"tl-tl",autoSize:"width",hideEl:false,cls:"x-small-editor x-grid-editor",shim:false,shadow:false});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.grid.GroupingView=Ext.extend(Ext.grid.GridView,{groupByText:"Group By This Field",showGroupsText:"Show in Groups",hideGroupedColumn:false,showGroupName:true,startCollapsed:false,enableGrouping:true,enableGroupingMenu:true,enableNoGroups:true,emptyGroupText:"(None)",ignoreAdd:false,groupTextTpl:"{text}",groupMode:"value",cancelEditOnToggle:true,initTemplates:function(){Ext.grid.GroupingView.superclass.initTemplates.call(this);this.state={};var a=this.grid.getSelectionModel();a.on(a.selectRow?"beforerowselect":"beforecellselect",this.onBeforeRowSelect,this);if(!this.startGroup){this.startGroup=new Ext.XTemplate('<div id="{groupId}" class="x-grid-group {cls}">','<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">',this.groupTextTpl,"</div></div>",'<div id="{groupId}-bd" class="x-grid-group-body">')}this.startGroup.compile();if(!this.endGroup){this.endGroup="</div></div>"}},findGroup:function(a){return Ext.fly(a).up(".x-grid-group",this.mainBody.dom)},getGroups:function(){return this.hasRows()?this.mainBody.dom.childNodes:[]},onAdd:function(d,a,b){if(this.canGroup()&&!this.ignoreAdd){var c=this.getScrollState();this.fireEvent("beforerowsinserted",d,b,b+(a.length-1));this.refresh();this.restoreScroll(c);this.fireEvent("rowsinserted",d,b,b+(a.length-1))}else{if(!this.canGroup()){Ext.grid.GroupingView.superclass.onAdd.apply(this,arguments)}}},onRemove:function(e,a,b,d){Ext.grid.GroupingView.superclass.onRemove.apply(this,arguments);var c=document.getElementById(a._groupId);if(c&&c.childNodes[1].childNodes.length<1){Ext.removeNode(c)}this.applyEmptyText()},refreshRow:function(a){if(this.ds.getCount()==1){this.refresh()}else{this.isUpdating=true;Ext.grid.GroupingView.superclass.refreshRow.apply(this,arguments);this.isUpdating=false}},beforeMenuShow:function(){var c,a=this.hmenu.items,b=this.cm.config[this.hdCtxIndex].groupable===false;if((c=a.get("groupBy"))){c.setDisabled(b)}if((c=a.get("showGroups"))){c.setDisabled(b);c.setChecked(this.canGroup(),true)}},renderUI:function(){var a=Ext.grid.GroupingView.superclass.renderUI.call(this);if(this.enableGroupingMenu&&this.hmenu){this.hmenu.add("-",{itemId:"groupBy",text:this.groupByText,handler:this.onGroupByClick,scope:this,iconCls:"x-group-by-icon"});if(this.enableNoGroups){this.hmenu.add({itemId:"showGroups",text:this.showGroupsText,checked:true,checkHandler:this.onShowGroupsClick,scope:this})}this.hmenu.on("beforeshow",this.beforeMenuShow,this)}return a},processEvent:function(b,h){Ext.grid.GroupingView.superclass.processEvent.call(this,b,h);var g=h.getTarget(".x-grid-group-hd",this.mainBody);if(g){var f=this.getGroupField(),d=this.getPrefix(f),a=g.id.substring(d.length),c=new RegExp("gp-"+Ext.escapeRe(f)+"--hd");a=a.substr(0,a.length-3);if(a||c.test(g.id)){this.grid.fireEvent("group"+b,this.grid,f,a,h)}if(b=="mousedown"&&h.button==0){this.toggleGroup(g.parentNode)}}},onGroupByClick:function(){var a=this.grid;this.enableGrouping=true;a.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));a.fireEvent("groupchange",a,a.store.getGroupState());this.beforeMenuShow();this.refresh()},onShowGroupsClick:function(a,b){this.enableGrouping=b;if(b){this.onGroupByClick()}else{this.grid.store.clearGrouping();this.grid.fireEvent("groupchange",this,null)}},toggleRowIndex:function(c,a){if(!this.canGroup()){return}var b=this.getRow(c);if(b){this.toggleGroup(this.findGroup(b),a)}},toggleGroup:function(c,b){var a=Ext.get(c),d=Ext.util.Format.htmlEncode(a.id);b=Ext.isDefined(b)?b:a.hasClass("x-grid-group-collapsed");if(this.state[d]!==b){if(this.cancelEditOnToggle!==false){this.grid.stopEditing(true)}this.state[d]=b;a[b?"removeClass":"addClass"]("x-grid-group-collapsed")}},toggleAllGroups:function(c){var b=this.getGroups();for(var d=0,a=b.length;d<a;d++){this.toggleGroup(b[d],c)}},expandAllGroups:function(){this.toggleAllGroups(true)},collapseAllGroups:function(){this.toggleAllGroups(false)},getGroup:function(a,e,h,i,b,f){var c=this.cm.config[b],d=h?h.call(c.scope,a,{},e,i,b,f):String(a);if(d===""||d==="&#160;"){d=c.emptyGroupText||this.emptyGroupText}return d},getGroupField:function(){return this.grid.store.getGroupState()},afterRender:function(){if(!this.ds||!this.cm){return}Ext.grid.GroupingView.superclass.afterRender.call(this);if(this.grid.deferRowRender){this.updateGroupWidths()}},afterRenderUI:function(){Ext.grid.GroupingView.superclass.afterRenderUI.call(this);if(this.enableGroupingMenu&&this.hmenu){this.hmenu.add("-",{itemId:"groupBy",text:this.groupByText,handler:this.onGroupByClick,scope:this,iconCls:"x-group-by-icon"});if(this.enableNoGroups){this.hmenu.add({itemId:"showGroups",text:this.showGroupsText,checked:true,checkHandler:this.onShowGroupsClick,scope:this})}this.hmenu.on("beforeshow",this.beforeMenuShow,this)}},renderRows:function(){var a=this.getGroupField();var e=!!a;if(this.hideGroupedColumn){var b=this.cm.findColumnIndex(a),d=Ext.isDefined(this.lastGroupField);if(!e&&d){this.mainBody.update("");this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField),false);delete this.lastGroupField}else{if(e&&!d){this.lastGroupField=a;this.cm.setHidden(b,true)}else{if(e&&d&&a!==this.lastGroupField){this.mainBody.update("");var c=this.cm.findColumnIndex(this.lastGroupField);this.cm.setHidden(c,false);this.lastGroupField=a;this.cm.setHidden(b,true)}}}}return Ext.grid.GroupingView.superclass.renderRows.apply(this,arguments)},doRender:function(c,f,p,a,o,q){if(f.length<1){return""}if(!this.canGroup()||this.isUpdating){return Ext.grid.GroupingView.superclass.doRender.apply(this,arguments)}var y=this.getGroupField(),n=this.cm.findColumnIndex(y),v,h="width:"+this.getTotalWidth()+";",e=this.cm.config[n],b=e.groupRenderer||e.renderer,s=this.showGroupName?(e.groupName||e.header)+": ":"",x=[],k,t,u,m;for(t=0,u=f.length;t<u;t++){var j=a+t,l=f[t],d=l.data[y];v=this.getGroup(d,l,b,j,n,p);if(!k||k.group!=v){m=this.constructId(d,y,n);this.state[m]=!(Ext.isDefined(this.state[m])?!this.state[m]:this.startCollapsed);k={group:v,gvalue:d,text:s+v,groupId:m,startRow:j,rs:[l],cls:this.state[m]?"":"x-grid-group-collapsed",style:h};x.push(k)}else{k.rs.push(l)}l._groupId=m}var w=[];for(t=0,u=x.length;t<u;t++){v=x[t];this.doGroupStart(w,v,c,p,o);w[w.length]=Ext.grid.GroupingView.superclass.doRender.call(this,c,v.rs,p,v.startRow,o,q);this.doGroupEnd(w,v,c,p,o)}return w.join("")},getGroupId:function(a){var b=this.getGroupField();return this.constructId(a,b,this.cm.findColumnIndex(b))},constructId:function(c,e,a){var b=this.cm.config[a],d=b.groupRenderer||b.renderer,f=(this.groupMode=="value")?c:this.getGroup(c,{data:{}},d,0,a,this.ds);return this.getPrefix(e)+Ext.util.Format.htmlEncode(f)},canGroup:function(){return this.enableGrouping&&!!this.getGroupField()},getPrefix:function(a){return this.grid.getGridEl().id+"-gp-"+a+"-"},doGroupStart:function(a,d,b,e,c){a[a.length]=this.startGroup.apply(d)},doGroupEnd:function(a,d,b,e,c){a[a.length]=this.endGroup},getRows:function(){if(!this.canGroup()){return Ext.grid.GroupingView.superclass.getRows.call(this)}var h=[],c=this.getGroups(),f,e=0,a=c.length,d,b;for(;e<a;++e){f=c[e].childNodes[1];if(f){f=f.childNodes;for(d=0,b=f.length;d<b;++d){h[h.length]=f[d]}}}return h},updateGroupWidths:function(){if(!this.canGroup()||!this.hasRows()){return}var c=Math.max(this.cm.getTotalWidth(),this.el.dom.offsetWidth-this.getScrollOffset())+"px";var b=this.getGroups();for(var d=0,a=b.length;d<a;d++){b[d].firstChild.style.width=c}},onColumnWidthUpdated:function(c,a,b){Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this,c,a,b);this.updateGroupWidths()},onAllColumnWidthsUpdated:function(a,b){Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this,a,b);this.updateGroupWidths()},onColumnHiddenUpdated:function(b,c,a){Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this,b,c,a);this.updateGroupWidths()},onLayout:function(){this.updateGroupWidths()},onBeforeRowSelect:function(b,a){this.toggleRowIndex(a,true)}});Ext.grid.GroupingView.GROUP_ID=1000;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/direct-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/direct-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/direct-debug.js	(revision 76)
@@ -0,0 +1,1162 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DirectProxy
+ * @extends Ext.data.DataProxy
+ */
+Ext.data.DirectProxy = function(config){
+    Ext.apply(this, config);
+    if(typeof this.paramOrder == 'string'){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+    Ext.data.DirectProxy.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.data.DirectProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. A list of params to be executed
+     * server side.  Specify the params in the order in which they must be executed on the server-side
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash
+     * Send parameters as a collection of named arguments (defaults to <tt>true</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: true,
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.  directFn is a simple alternative to defining the api configuration-parameter
+     * for Store's which will not implement a full CRUD api.
+     */
+    directFn : undefined,
+
+    /**
+     * DirectProxy implementation of {@link Ext.data.DataProxy#doRequest}
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        var args = [],
+            directFn = this.api[action] || this.directFn;
+
+        switch (action) {
+            case Ext.data.Api.actions.create:
+                args.push(params.jsonData);		// <-- create(Hash)
+                break;
+            case Ext.data.Api.actions.read:
+                // If the method has no parameters, ignore the paramOrder/paramsAsHash.
+                if(directFn.directCfg.method.len > 0){
+                    if(this.paramOrder){
+                        for(var i = 0, len = this.paramOrder.length; i < len; i++){
+                            args.push(params[this.paramOrder[i]]);
+                        }
+                    }else if(this.paramsAsHash){
+                        args.push(params);
+                    }
+                }
+                break;
+            case Ext.data.Api.actions.update:
+                args.push(params.jsonData);        // <-- update(Hash/Hash[])
+                break;
+            case Ext.data.Api.actions.destroy:
+                args.push(params.jsonData);        // <-- destroy(Int/Int[])
+                break;
+        }
+
+        var trans = {
+            params : params || {},
+            request: {
+                callback : callback,
+                scope : scope,
+                arg : options
+            },
+            reader: reader
+        };
+
+        args.push(this.createCallback(action, rs, trans), this);
+        directFn.apply(window, args);
+    },
+
+    // private
+    createCallback : function(action, rs, trans) {
+        var me = this;
+        return function(result, res) {
+            if (!res.status) {
+                // @deprecated fire loadexception
+                if (action === Ext.data.Api.actions.read) {
+                    me.fireEvent("loadexception", me, trans, res, null);
+                }
+                me.fireEvent('exception', me, 'remote', action, trans, res, null);
+                trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                me.onRead(action, trans, result, res);
+            } else {
+                me.onWrite(action, trans, result, res, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, result, res) {
+        var records;
+        try {
+            records = trans.reader.readRecords(result);
+        }
+        catch (ex) {
+            // @deprecated: Fire old loadexception for backwards-compat.
+            this.fireEvent("loadexception", this, trans, res, ex);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, ex);
+            trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+            return;
+        }
+        this.fireEvent("load", this, res, trans.request.arg);
+        trans.request.callback.call(trans.request.scope, records, trans.request.arg, true);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [{@link Ext.data.Api#actions create|read|update|destroy}]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @param {Ext.data.Record/[Ext.data.Record]} rs The Store resultset associated with the action.
+     * @protected
+     */
+    onWrite : function(action, trans, result, res, rs) {
+        var data = trans.reader.extractData(trans.reader.getRoot(result), false);
+        var success = trans.reader.getSuccess(result);
+        success = (success !== false);
+        if (success){
+            this.fireEvent("write", this, action, data, res, rs, trans.request.arg);
+        }else{
+            this.fireEvent('exception', this, 'remote', action, trans, result, rs);
+        }
+        trans.request.callback.call(trans.request.scope, data, res, success);
+    }
+});
+/**
+ * @class Ext.data.DirectStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to create an {@link Ext.data.Store} configured with an
+ * {@link Ext.data.DirectProxy} and {@link Ext.data.JsonReader} to make interacting
+ * with an {@link Ext.Direct} Server-side {@link Ext.direct.Provider Provider} easier.
+ * To create a different proxy/reader combination create a basic {@link Ext.data.Store}
+ * configured as needed.</p>
+ *
+ * <p><b>*Note:</b> Although they are not listed, this class inherits all of the config options of:</p>
+ * <div><ul class="mdetail-params">
+ * <li><b>{@link Ext.data.Store Store}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ *
+ * </ul></div>
+ * <li><b>{@link Ext.data.JsonReader JsonReader}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.JsonReader#root root}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#idProperty idProperty}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#totalProperty totalProperty}</b></tt></li>
+ * </ul></div>
+ *
+ * <li><b>{@link Ext.data.DirectProxy DirectProxy}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.DirectProxy#directFn directFn}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramOrder paramOrder}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramsAsHash paramsAsHash}</b></tt></li>
+ * </ul></div>
+ * </ul></div>
+ *
+ * @xtype directstore
+ *
+ * @constructor
+ * @param {Object} config
+ */
+Ext.data.DirectStore = Ext.extend(Ext.data.Store, {
+    constructor : function(config){
+        // each transaction upon a singe record will generate a distinct Direct transaction since Direct queues them into one Ajax request.
+        var c = Ext.apply({}, {
+            batchTransactions: false
+        }, config);
+        Ext.data.DirectStore.superclass.constructor.call(this, Ext.apply(c, {
+            proxy: Ext.isDefined(c.proxy) ? c.proxy : new Ext.data.DirectProxy(Ext.copyTo({}, c, 'paramOrder,paramsAsHash,directFn,api')),
+            reader: (!Ext.isDefined(c.reader) && c.fields) ? new Ext.data.JsonReader(Ext.copyTo({}, c, 'totalProperty,root,idProperty'), c.fields) : c.reader
+        }));
+    }
+});
+Ext.reg('directstore', Ext.data.DirectStore);
+/**
+ * @class Ext.Direct
+ * @extends Ext.util.Observable
+ * <p><b><u>Overview</u></b></p>
+ *
+ * <p>Ext.Direct aims to streamline communication between the client and server
+ * by providing a single interface that reduces the amount of common code
+ * typically required to validate data and handle returned data packets
+ * (reading data, error conditions, etc).</p>
+ *
+ * <p>The Ext.direct namespace includes several classes for a closer integration
+ * with the server-side. The Ext.data namespace also includes classes for working
+ * with Ext.data.Stores which are backed by data from an Ext.Direct method.</p>
+ *
+ * <p><b><u>Specification</u></b></p>
+ *
+ * <p>For additional information consult the
+ * <a href="http://extjs.com/products/extjs/direct.php">Ext.Direct Specification</a>.</p>
+ *
+ * <p><b><u>Providers</u></b></p>
+ *
+ * <p>Ext.Direct uses a provider architecture, where one or more providers are
+ * used to transport data to and from the server. There are several providers
+ * that exist in the core at the moment:</p><div class="mdetail-params"><ul>
+ *
+ * <li>{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations</li>
+ * <li>{@link Ext.direct.PollingProvider PollingProvider} for repeated requests</li>
+ * <li>{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side
+ * on the client.</li>
+ * </ul></div>
+ *
+ * <p>A provider does not need to be invoked directly, providers are added via
+ * {@link Ext.Direct}.{@link Ext.Direct#add add}.</p>
+ *
+ * <p><b><u>Router</u></b></p>
+ *
+ * <p>Ext.Direct utilizes a "router" on the server to direct requests from the client
+ * to the appropriate server-side method. Because the Ext.Direct API is completely
+ * platform-agnostic, you could completely swap out a Java based server solution
+ * and replace it with one that uses C# without changing the client side JavaScript
+ * at all.</p>
+ *
+ * <p><b><u>Server side events</u></b></p>
+ *
+ * <p>Custom events from the server may be handled by the client by adding
+ * listeners, for example:</p>
+ * <pre><code>
+{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}
+
+// add a handler for a 'message' event sent by the server
+Ext.Direct.on('message', function(e){
+    out.append(String.format('&lt;p>&lt;i>{0}&lt;/i>&lt;/p>', e.data));
+            out.el.scrollTo('t', 100000, true);
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.Direct = Ext.extend(Ext.util.Observable, {
+    /**
+     * Each event type implements a getData() method. The default event types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>event</tt></b> : Ext.Direct.Event</li>
+     * <li><b><tt>exception</tt></b> : Ext.Direct.ExceptionEvent</li>
+     * <li><b><tt>rpc</tt></b> : Ext.Direct.RemotingEvent</li>
+     * </ul></div>
+     * @property eventTypes
+     * @type Object
+     */
+
+    /**
+     * Four types of possible exceptions which can occur:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>Ext.Direct.exceptions.TRANSPORT</tt></b> : 'xhr'</li>
+     * <li><b><tt>Ext.Direct.exceptions.PARSE</tt></b> : 'parse'</li>
+     * <li><b><tt>Ext.Direct.exceptions.LOGIN</tt></b> : 'login'</li>
+     * <li><b><tt>Ext.Direct.exceptions.SERVER</tt></b> : 'exception'</li>
+     * </ul></div>
+     * @property exceptions
+     * @type Object
+     */
+    exceptions: {
+        TRANSPORT: 'xhr',
+        PARSE: 'parse',
+        LOGIN: 'login',
+        SERVER: 'exception'
+    },
+
+    // private
+    constructor: function(){
+        this.addEvents(
+            /**
+             * @event event
+             * Fires after an event.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */
+            'event',
+            /**
+             * @event exception
+             * Fires after an event exception.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */
+            'exception'
+        );
+        this.transactions = {};
+        this.providers = {};
+    },
+
+    /**
+     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.
+     * If the provider is not already connected, it will auto-connect.
+     * <pre><code>
+var pollProv = new Ext.direct.PollingProvider({
+    url: 'php/poll2.php'
+});
+
+Ext.Direct.addProvider(
+    {
+        "type":"remoting",       // create a {@link Ext.direct.RemotingProvider}
+        "url":"php\/router.php", // url to connect to the Ext.Direct server-side router.
+        "actions":{              // each property within the actions object represents a Class
+            "TestAction":[       // array of methods within each server side Class
+            {
+                "name":"doEcho", // name of method
+                "len":1
+            },{
+                "name":"multiply",
+                "len":1
+            },{
+                "name":"doForm",
+                "formHandler":true, // handle form on server with Ext.Direct.Transaction
+                "len":1
+            }]
+        },
+        "namespace":"myApplication",// namespace to create the Remoting Provider in
+    },{
+        type: 'polling', // create a {@link Ext.direct.PollingProvider}
+        url:  'php/poll.php'
+    },
+    pollProv // reference to previously created instance
+);
+     * </code></pre>
+     * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance
+     * or config object for a Provider) or any number of Provider descriptions as arguments.  Each
+     * Provider description instructs Ext.Direct how to create client-side stub methods.
+     */
+    addProvider : function(provider){
+        var a = arguments;
+        if(a.length > 1){
+            for(var i = 0, len = a.length; i < len; i++){
+                this.addProvider(a[i]);
+            }
+            return;
+        }
+
+        // if provider has not already been instantiated
+        if(!provider.events){
+            provider = new Ext.Direct.PROVIDERS[provider.type](provider);
+        }
+        provider.id = provider.id || Ext.id();
+        this.providers[provider.id] = provider;
+
+        provider.on('data', this.onProviderData, this);
+        provider.on('exception', this.onProviderException, this);
+
+
+        if(!provider.isConnected()){
+            provider.connect();
+        }
+
+        return provider;
+    },
+
+    /**
+     * Retrieve a {@link Ext.direct.Provider provider} by the
+     * <b><tt>{@link Ext.direct.Provider#id id}</tt></b> specified when the provider is
+     * {@link #addProvider added}.
+     * @param {String} id Unique identifier assigned to the provider when calling {@link #addProvider}
+     */
+    getProvider : function(id){
+        return this.providers[id];
+    },
+
+    removeProvider : function(id){
+        var provider = id.id ? id : this.providers[id];
+        provider.un('data', this.onProviderData, this);
+        provider.un('exception', this.onProviderException, this);
+        delete this.providers[provider.id];
+        return provider;
+    },
+
+    addTransaction: function(t){
+        this.transactions[t.tid] = t;
+        return t;
+    },
+
+    removeTransaction: function(t){
+        delete this.transactions[t.tid || t];
+        return t;
+    },
+
+    getTransaction: function(tid){
+        return this.transactions[tid.tid || tid];
+    },
+
+    onProviderData : function(provider, e){
+        if(Ext.isArray(e)){
+            for(var i = 0, len = e.length; i < len; i++){
+                this.onProviderData(provider, e[i]);
+            }
+            return;
+        }
+        if(e.name && e.name != 'event' && e.name != 'exception'){
+            this.fireEvent(e.name, e);
+        }else if(e.type == 'exception'){
+            this.fireEvent('exception', e);
+        }
+        this.fireEvent('event', e, provider);
+    },
+
+    createEvent : function(response, extraProps){
+        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));
+    }
+});
+// overwrite impl. with static instance
+Ext.Direct = new Ext.Direct();
+
+Ext.Direct.TID = 1;
+Ext.Direct.PROVIDERS = {};/**
+ * @class Ext.Direct.Transaction
+ * @extends Object
+ * <p>Supporting Class for Ext.Direct (not intended to be used directly).</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Direct.Transaction = function(config){
+    Ext.apply(this, config);
+    this.tid = ++Ext.Direct.TID;
+    this.retryCount = 0;
+};
+Ext.Direct.Transaction.prototype = {
+    send: function(){
+        this.provider.queueTransaction(this);
+    },
+
+    retry: function(){
+        this.retryCount++;
+        this.send();
+    },
+
+    getProvider: function(){
+        return this.provider;
+    }
+};Ext.Direct.Event = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.Direct.Event.prototype = {
+    status: true,
+    getData: function(){
+        return this.data;
+    }
+};
+
+Ext.Direct.RemotingEvent = Ext.extend(Ext.Direct.Event, {
+    type: 'rpc',
+    getTransaction: function(){
+        return this.transaction || Ext.Direct.getTransaction(this.tid);
+    }
+});
+
+Ext.Direct.ExceptionEvent = Ext.extend(Ext.Direct.RemotingEvent, {
+    status: false,
+    type: 'exception'
+});
+
+Ext.Direct.eventTypes = {
+    'rpc':  Ext.Direct.RemotingEvent,
+    'event':  Ext.Direct.Event,
+    'exception':  Ext.Direct.ExceptionEvent
+};
+/**
+ * @class Ext.direct.Provider
+ * @extends Ext.util.Observable
+ * <p>Ext.direct.Provider is an abstract class meant to be extended.</p>
+ * 
+ * <p>For example ExtJs implements the following subclasses:</p>
+ * <pre><code>
+Provider
+|
++---{@link Ext.direct.JsonProvider JsonProvider} 
+    |
+    +---{@link Ext.direct.PollingProvider PollingProvider}   
+    |
+    +---{@link Ext.direct.RemotingProvider RemotingProvider}   
+ * </code></pre>
+ * @abstract
+ */
+Ext.direct.Provider = Ext.extend(Ext.util.Observable, {    
+    /**
+     * @cfg {String} id
+     * The unique id of the provider (defaults to an {@link Ext#id auto-assigned id}).
+     * You should assign an id if you need to be able to access the provider later and you do
+     * not have an object reference available, for example:
+     * <pre><code>
+Ext.Direct.addProvider(
+    {
+        type: 'polling',
+        url:  'php/poll.php',
+        id:   'poll-provider'
+    }
+);
+     
+var p = {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#getProvider getProvider}('poll-provider');
+p.disconnect();
+     * </code></pre>
+     */
+        
+    /**
+     * @cfg {Number} priority
+     * Priority of the request. Lower is higher priority, <tt>0</tt> means "duplex" (always on).
+     * All Providers default to <tt>1</tt> except for PollingProvider which defaults to <tt>3</tt>.
+     */    
+    priority: 1,
+
+    /**
+     * @cfg {String} type
+     * <b>Required</b>, <tt>undefined</tt> by default.  The <tt>type</tt> of provider specified
+     * to {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#addProvider addProvider} to create a
+     * new Provider. Acceptable values by default are:<div class="mdetail-params"><ul>
+     * <li><b><tt>polling</tt></b> : {@link Ext.direct.PollingProvider PollingProvider}</li>
+     * <li><b><tt>remoting</tt></b> : {@link Ext.direct.RemotingProvider RemotingProvider}</li>
+     * </ul></div>
+     */    
+ 
+    // private
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event connect
+             * Fires when the Provider connects to the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'connect',
+            /**
+             * @event disconnect
+             * Fires when the Provider disconnects from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'disconnect',
+            /**
+             * @event data
+             * Fires when the Provider receives data from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */            
+            'data',
+            /**
+             * @event exception
+             * Fires when the Provider receives an exception from the server-side
+             */                        
+            'exception'
+        );
+        Ext.direct.Provider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns whether or not the server-side is currently connected.
+     * Abstract method for subclasses to implement.
+     */
+    isConnected: function(){
+        return false;
+    },
+
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    connect: Ext.emptyFn,
+    
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    disconnect: Ext.emptyFn
+});
+/**
+ * @class Ext.direct.JsonProvider
+ * @extends Ext.direct.Provider
+ */
+Ext.direct.JsonProvider = Ext.extend(Ext.direct.Provider, {
+    parseResponse: function(xhr){
+        if(!Ext.isEmpty(xhr.responseText)){
+            if(typeof xhr.responseText == 'object'){
+                return xhr.responseText;
+            }
+            return Ext.decode(xhr.responseText);
+        }
+        return null;
+    },
+
+    getEvents: function(xhr){
+        var data = null;
+        try{
+            data = this.parseResponse(xhr);
+        }catch(e){
+            var event = new Ext.Direct.ExceptionEvent({
+                data: e,
+                xhr: xhr,
+                code: Ext.Direct.exceptions.PARSE,
+                message: 'Error parsing json response: \n\n ' + data
+            });
+            return [event];
+        }
+        var events = [];
+        if(Ext.isArray(data)){
+            for(var i = 0, len = data.length; i < len; i++){
+                events.push(Ext.Direct.createEvent(data[i]));
+            }
+        }else{
+            events.push(Ext.Direct.createEvent(data));
+        }
+        return events;
+    }
+});/**
+ * @class Ext.direct.PollingProvider
+ * @extends Ext.direct.JsonProvider
+ *
+ * <p>Provides for repetitive polling of the server at distinct {@link #interval intervals}.
+ * The initial request for data originates from the client, and then is responded to by the
+ * server.</p>
+ * 
+ * <p>All configurations for the PollingProvider should be generated by the server-side
+ * API portion of the Ext.Direct stack.</p>
+ *
+ * <p>An instance of PollingProvider may be created directly via the new keyword or by simply
+ * specifying <tt>type = 'polling'</tt>.  For example:</p>
+ * <pre><code>
+var pollA = new Ext.direct.PollingProvider({
+    type:'polling',
+    url: 'php/pollA.php',
+});
+Ext.Direct.addProvider(pollA);
+pollA.disconnect();
+
+Ext.Direct.addProvider(
+    {
+        type:'polling',
+        url: 'php/pollB.php',
+        id: 'pollB-provider'
+    }
+);
+var pollB = Ext.Direct.getProvider('pollB-provider');
+ * </code></pre>
+ */
+Ext.direct.PollingProvider = Ext.extend(Ext.direct.JsonProvider, {
+    /**
+     * @cfg {Number} priority
+     * Priority of the request (defaults to <tt>3</tt>). See {@link Ext.direct.Provider#priority}.
+     */
+    // override default priority
+    priority: 3,
+    
+    /**
+     * @cfg {Number} interval
+     * How often to poll the server-side in milliseconds (defaults to <tt>3000</tt> - every
+     * 3 seconds).
+     */
+    interval: 3000,
+
+    /**
+     * @cfg {Object} baseParams An object containing properties which are to be sent as parameters
+     * on every polling request
+     */
+    
+    /**
+     * @cfg {String/Function} url
+     * The url which the PollingProvider should contact with each request. This can also be
+     * an imported Ext.Direct method which will accept the baseParams as its only argument.
+     */
+
+    // private
+    constructor : function(config){
+        Ext.direct.PollingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforepoll
+             * Fired immediately before a poll takes place, an event handler can return false
+             * in order to cancel the poll.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'beforepoll',            
+            /**
+             * @event poll
+             * This event has not yet been implemented.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'poll'
+        );
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.pollTask;
+    },
+
+    /**
+     * Connect to the server-side and begin the polling process. To handle each
+     * response subscribe to the data event.
+     */
+    connect: function(){
+        if(this.url && !this.pollTask){
+            this.pollTask = Ext.TaskMgr.start({
+                run: function(){
+                    if(this.fireEvent('beforepoll', this) !== false){
+                        if(typeof this.url == 'function'){
+                            this.url(this.baseParams);
+                        }else{
+                            Ext.Ajax.request({
+                                url: this.url,
+                                callback: this.onData,
+                                scope: this,
+                                params: this.baseParams
+                            });
+                        }
+                    }
+                },
+                interval: this.interval,
+                scope: this
+            });
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing PollingProvider, no url configured.';
+        }
+    },
+
+    /**
+     * Disconnect from the server-side and stop the polling process. The disconnect
+     * event will be fired on a successful disconnect.
+     */
+    disconnect: function(){
+        if(this.pollTask){
+            Ext.TaskMgr.stop(this.pollTask);
+            delete this.pollTask;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    // private
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i];
+                this.fireEvent('data', this, e);
+            }
+        }else{
+            var e = new Ext.Direct.ExceptionEvent({
+                data: e,
+                code: Ext.Direct.exceptions.TRANSPORT,
+                message: 'Unable to connect to the server.',
+                xhr: xhr
+            });
+            this.fireEvent('data', this, e);
+        }
+    }
+});
+
+Ext.Direct.PROVIDERS['polling'] = Ext.direct.PollingProvider;/**
+ * @class Ext.direct.RemotingProvider
+ * @extends Ext.direct.JsonProvider
+ * 
+ * <p>The {@link Ext.direct.RemotingProvider RemotingProvider} exposes access to
+ * server side methods on the client (a remote procedure call (RPC) type of
+ * connection where the client can initiate a procedure on the server).</p>
+ * 
+ * <p>This allows for code to be organized in a fashion that is maintainable,
+ * while providing a clear path between client and server, something that is
+ * not always apparent when using URLs.</p>
+ * 
+ * <p>To accomplish this the server-side needs to describe what classes and methods
+ * are available on the client-side. This configuration will typically be
+ * outputted by the server-side Ext.Direct stack when the API description is built.</p>
+ */
+Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, {       
+    /**
+     * @cfg {Object} actions
+     * Object literal defining the server side actions and methods. For example, if
+     * the Provider is configured with:
+     * <pre><code>
+"actions":{ // each property within the 'actions' object represents a server side Class 
+    "TestAction":[ // array of methods within each server side Class to be   
+    {              // stubbed out on client
+        "name":"doEcho", 
+        "len":1            
+    },{
+        "name":"multiply",// name of method
+        "len":2           // The number of parameters that will be used to create an
+                          // array of data to send to the server side function.
+                          // Ensure the server sends back a Number, not a String. 
+    },{
+        "name":"doForm",
+        "formHandler":true, // direct the client to use specialized form handling method 
+        "len":1
+    }]
+}
+     * </code></pre>
+     * <p>Note that a Store is not required, a server method can be called at any time.
+     * In the following example a <b>client side</b> handler is used to call the
+     * server side method "multiply" in the server-side "TestAction" Class:</p>
+     * <pre><code>
+TestAction.multiply(
+    2, 4, // pass two arguments to server, so specify len=2
+    // callback function after the server is called
+    // result: the result returned by the server
+    //      e: Ext.Direct.RemotingEvent object
+    function(result, e){
+        var t = e.getTransaction();
+        var action = t.action; // server side Class called
+        var method = t.method; // server side method called
+        if(e.status){
+            var answer = Ext.encode(result); // 8
+    
+        }else{
+            var msg = e.message; // failure message
+        }
+    }
+);
+     * </code></pre>
+     * In the example above, the server side "multiply" function will be passed two
+     * arguments (2 and 4).  The "multiply" method should return the value 8 which will be
+     * available as the <tt>result</tt> in the example above. 
+     */
+    
+    /**
+     * @cfg {String/Object} namespace
+     * Namespace for the Remoting Provider (defaults to the browser global scope of <i>window</i>).
+     * Explicitly specify the namespace Object, or specify a String to have a
+     * {@link Ext#namespace namespace created} implicitly.
+     */
+    
+    /**
+     * @cfg {String} url
+     * <b>Required<b>. The url to connect to the {@link Ext.Direct} server-side router. 
+     */
+    
+    /**
+     * @cfg {String} enableUrlEncode
+     * Specify which param will hold the arguments for the method.
+     * Defaults to <tt>'data'</tt>.
+     */
+    
+    /**
+     * @cfg {Number/Boolean} enableBuffer
+     * <p><tt>true</tt> or <tt>false</tt> to enable or disable combining of method
+     * calls. If a number is specified this is the amount of time in milliseconds
+     * to wait before sending a batched request (defaults to <tt>10</tt>).</p>
+     * <br><p>Calls which are received within the specified timeframe will be
+     * concatenated together and sent in a single request, optimizing the
+     * application by reducing the amount of round trips that have to be made
+     * to the server.</p>
+     */
+    enableBuffer: 10,
+    
+    /**
+     * @cfg {Number} maxRetries
+     * Number of times to re-attempt delivery on failure of a call. Defaults to <tt>1</tt>.
+     */
+    maxRetries: 1,
+    
+    /**
+     * @cfg {Number} timeout
+     * The timeout to use for each request. Defaults to <tt>undefined</tt>.
+     */
+    timeout: undefined,
+
+    constructor : function(config){
+        Ext.direct.RemotingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforecall
+             * Fires immediately before the client-side sends off the RPC call.
+             * By returning false from an event handler you can prevent the call from
+             * executing.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'beforecall',            
+            /**
+             * @event call
+             * Fires immediately after the request to the server-side is sent. This does
+             * NOT fire after the response has come back from the call.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'call'
+        );
+        this.namespace = (Ext.isString(this.namespace)) ? Ext.ns(this.namespace) : this.namespace || window;
+        this.transactions = {};
+        this.callBuffer = [];
+    },
+
+    // private
+    initAPI : function(){
+        var o = this.actions;
+        for(var c in o){
+            var cls = this.namespace[c] || (this.namespace[c] = {}),
+                ms = o[c];
+            for(var i = 0, len = ms.length; i < len; i++){
+                var m = ms[i];
+                cls[m.name] = this.createMethod(c, m);
+            }
+        }
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.connected;
+    },
+
+    connect: function(){
+        if(this.url){
+            this.initAPI();
+            this.connected = true;
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing RemotingProvider, no url configured.';
+        }
+    },
+
+    disconnect: function(){
+        if(this.connected){
+            this.connected = false;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i],
+                    t = this.getTransaction(e);
+                this.fireEvent('data', this, e);
+                if(t){
+                    this.doCallback(t, e, true);
+                    Ext.Direct.removeTransaction(t);
+                }
+            }
+        }else{
+            var ts = [].concat(opt.ts);
+            for(var i = 0, len = ts.length; i < len; i++){
+                var t = this.getTransaction(ts[i]);
+                if(t && t.retryCount < this.maxRetries){
+                    t.retry();
+                }else{
+                    var e = new Ext.Direct.ExceptionEvent({
+                        data: e,
+                        transaction: t,
+                        code: Ext.Direct.exceptions.TRANSPORT,
+                        message: 'Unable to connect to the server.',
+                        xhr: xhr
+                    });
+                    this.fireEvent('data', this, e);
+                    if(t){
+                        this.doCallback(t, e, false);
+                        Ext.Direct.removeTransaction(t);
+                    }
+                }
+            }
+        }
+    },
+
+    getCallData: function(t){
+        return {
+            action: t.action,
+            method: t.method,
+            data: t.data,
+            type: 'rpc',
+            tid: t.tid
+        };
+    },
+
+    doSend : function(data){
+        var o = {
+            url: this.url,
+            callback: this.onData,
+            scope: this,
+            ts: data,
+            timeout: this.timeout
+        }, callData;
+
+        if(Ext.isArray(data)){
+            callData = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                callData.push(this.getCallData(data[i]));
+            }
+        }else{
+            callData = this.getCallData(data);
+        }
+
+        if(this.enableUrlEncode){
+            var params = {};
+            params[Ext.isString(this.enableUrlEncode) ? this.enableUrlEncode : 'data'] = Ext.encode(callData);
+            o.params = params;
+        }else{
+            o.jsonData = callData;
+        }
+        Ext.Ajax.request(o);
+    },
+
+    combineAndSend : function(){
+        var len = this.callBuffer.length;
+        if(len > 0){
+            this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer);
+            this.callBuffer = [];
+        }
+    },
+
+    queueTransaction: function(t){
+        if(t.form){
+            this.processForm(t);
+            return;
+        }
+        this.callBuffer.push(t);
+        if(this.enableBuffer){
+            if(!this.callTask){
+                this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this);
+            }
+            this.callTask.delay(Ext.isNumber(this.enableBuffer) ? this.enableBuffer : 10);
+        }else{
+            this.combineAndSend();
+        }
+    },
+
+    doCall : function(c, m, args){
+        var data = null, hs = args[m.len], scope = args[m.len+1];
+
+        if(m.len !== 0){
+            data = args.slice(0, m.len);
+        }
+
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            args: args,
+            action: c,
+            method: m.name,
+            data: data,
+            cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            this.queueTransaction(t);
+            this.fireEvent('call', this, t, m);
+        }
+    },
+
+    doForm : function(c, m, form, callback, scope){
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            action: c,
+            method: m.name,
+            args:[form, callback, scope],
+            cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback,
+            isForm: true
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data',
+                params = {
+                    extTID: t.tid,
+                    extAction: c,
+                    extMethod: m.name,
+                    extType: 'rpc',
+                    extUpload: String(isUpload)
+                };
+            
+            // change made from typeof callback check to callback.params
+            // to support addl param passing in DirectSubmit EAC 6/2
+            Ext.apply(t, {
+                form: Ext.getDom(form),
+                isUpload: isUpload,
+                params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params
+            });
+            this.fireEvent('call', this, t, m);
+            this.processForm(t);
+        }
+    },
+    
+    processForm: function(t){
+        Ext.Ajax.request({
+            url: this.url,
+            params: t.params,
+            callback: this.onData,
+            scope: this,
+            form: t.form,
+            isUpload: t.isUpload,
+            ts: t
+        });
+    },
+
+    createMethod : function(c, m){
+        var f;
+        if(!m.formHandler){
+            f = function(){
+                this.doCall(c, m, Array.prototype.slice.call(arguments, 0));
+            }.createDelegate(this);
+        }else{
+            f = function(form, callback, scope){
+                this.doForm(c, m, form, callback, scope);
+            }.createDelegate(this);
+        }
+        f.directCfg = {
+            action: c,
+            method: m
+        };
+        return f;
+    },
+
+    getTransaction: function(opt){
+        return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null;
+    },
+
+    doCallback: function(t, e){
+        var fn = e.status ? 'success' : 'failure';
+        if(t && t.cb){
+            var hs = t.cb,
+                result = Ext.isDefined(e.result) ? e.result : e.data;
+            if(Ext.isFunction(hs)){
+                hs(result, e);
+            } else{
+                Ext.callback(hs[fn], hs.scope, [result, e]);
+                Ext.callback(hs.callback, hs.scope, [result, e]);
+            }
+        }
+    }
+});
+Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-foundation-debug.js	(revision 76)
@@ -0,0 +1,4809 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+
+/**
+ * @class Ext.data.Api
+ * @extends Object
+ * Ext.data.Api is a singleton designed to manage the data API including methods
+ * for validating a developer's DataProxy API.  Defines variables for CRUD actions
+ * create, read, update and destroy in addition to a mapping of RESTful HTTP methods
+ * GET, POST, PUT and DELETE to CRUD actions.
+ * @singleton
+ */
+Ext.data.Api = (function() {
+
+    // private validActions.  validActions is essentially an inverted hash of Ext.data.Api.actions, where value becomes the key.
+    // Some methods in this singleton (e.g.: getActions, getVerb) will loop through actions with the code <code>for (var verb in this.actions)</code>
+    // For efficiency, some methods will first check this hash for a match.  Those methods which do acces validActions will cache their result here.
+    // We cannot pre-define this hash since the developer may over-ride the actions at runtime.
+    var validActions = {};
+
+    return {
+        /**
+         * Defined actions corresponding to remote actions:
+         * <pre><code>
+actions: {
+    create  : 'create',  // Text representing the remote-action to create records on server.
+    read    : 'read',    // Text representing the remote-action to read/load data from server.
+    update  : 'update',  // Text representing the remote-action to update records on server.
+    destroy : 'destroy'  // Text representing the remote-action to destroy records on server.
+}
+         * </code></pre>
+         * @property actions
+         * @type Object
+         */
+        actions : {
+            create  : 'create',
+            read    : 'read',
+            update  : 'update',
+            destroy : 'destroy'
+        },
+
+        /**
+         * Defined {CRUD action}:{HTTP method} pairs to associate HTTP methods with the
+         * corresponding actions for {@link Ext.data.DataProxy#restful RESTful proxies}.
+         * Defaults to:
+         * <pre><code>
+restActions : {
+    create  : 'POST',
+    read    : 'GET',
+    update  : 'PUT',
+    destroy : 'DELETE'
+},
+         * </code></pre>
+         */
+        restActions : {
+            create  : 'POST',
+            read    : 'GET',
+            update  : 'PUT',
+            destroy : 'DELETE'
+        },
+
+        /**
+         * Returns true if supplied action-name is a valid API action defined in <code>{@link #actions}</code> constants
+         * @param {String} action Action to test for availability.
+         * @return {Boolean}
+         */
+        isAction : function(action) {
+            return (Ext.data.Api.actions[action]) ? true : false;
+        },
+
+        /**
+         * Returns the actual CRUD action KEY "create", "read", "update" or "destroy" from the supplied action-name.  This method is used internally and shouldn't generally
+         * need to be used directly.  The key/value pair of Ext.data.Api.actions will often be identical but this is not necessarily true.  A developer can override this naming
+         * convention if desired.  However, the framework internally calls methods based upon the KEY so a way of retreiving the the words "create", "read", "update" and "destroy" is
+         * required.  This method will cache discovered KEYS into the private validActions hash.
+         * @param {String} name The runtime name of the action.
+         * @return {String||null} returns the action-key, or verb of the user-action or null if invalid.
+         * @nodoc
+         */
+        getVerb : function(name) {
+            if (validActions[name]) {
+                return validActions[name];  // <-- found in cache.  return immediately.
+            }
+            for (var verb in this.actions) {
+                if (this.actions[verb] === name) {
+                    validActions[name] = verb;
+                    break;
+                }
+            }
+            return (validActions[name] !== undefined) ? validActions[name] : null;
+        },
+
+        /**
+         * Returns true if the supplied API is valid; that is, check that all keys match defined actions
+         * otherwise returns an array of mistakes.
+         * @return {String[]|true}
+         */
+        isValid : function(api){
+            var invalid = [];
+            var crud = this.actions; // <-- cache a copy of the actions.
+            for (var action in api) {
+                if (!(action in crud)) {
+                    invalid.push(action);
+                }
+            }
+            return (!invalid.length) ? true : invalid;
+        },
+
+        /**
+         * Returns true if the supplied verb upon the supplied proxy points to a unique url in that none of the other api-actions
+         * point to the same url.  The question is important for deciding whether to insert the "xaction" HTTP parameter within an
+         * Ajax request.  This method is used internally and shouldn't generally need to be called directly.
+         * @param {Ext.data.DataProxy} proxy
+         * @param {String} verb
+         * @return {Boolean}
+         */
+        hasUniqueUrl : function(proxy, verb) {
+            var url = (proxy.api[verb]) ? proxy.api[verb].url : null;
+            var unique = true;
+            for (var action in proxy.api) {
+                if ((unique = (action === verb) ? true : (proxy.api[action].url != url) ? true : false) === false) {
+                    break;
+                }
+            }
+            return unique;
+        },
+
+        /**
+         * This method is used internally by <tt>{@link Ext.data.DataProxy DataProxy}</tt> and should not generally need to be used directly.
+         * Each action of a DataProxy api can be initially defined as either a String or an Object.  When specified as an object,
+         * one can explicitly define the HTTP method (GET|POST) to use for each CRUD action.  This method will prepare the supplied API, setting
+         * each action to the Object form.  If your API-actions do not explicitly define the HTTP method, the "method" configuration-parameter will
+         * be used.  If the method configuration parameter is not specified, POST will be used.
+         <pre><code>
+new Ext.data.HttpProxy({
+    method: "POST",     // <-- default HTTP method when not specified.
+    api: {
+        create: 'create.php',
+        load: 'read.php',
+        save: 'save.php',
+        destroy: 'destroy.php'
+    }
+});
+
+// Alternatively, one can use the object-form to specify the API
+new Ext.data.HttpProxy({
+    api: {
+        load: {url: 'read.php', method: 'GET'},
+        create: 'create.php',
+        destroy: 'destroy.php',
+        save: 'update.php'
+    }
+});
+        </code></pre>
+         *
+         * @param {Ext.data.DataProxy} proxy
+         */
+        prepare : function(proxy) {
+            if (!proxy.api) {
+                proxy.api = {}; // <-- No api?  create a blank one.
+            }
+            for (var verb in this.actions) {
+                var action = this.actions[verb];
+                proxy.api[action] = proxy.api[action] || proxy.url || proxy.directFn;
+                if (typeof(proxy.api[action]) == 'string') {
+                    proxy.api[action] = {
+                        url: proxy.api[action],
+                        method: (proxy.restful === true) ? Ext.data.Api.restActions[action] : undefined
+                    };
+                }
+            }
+        },
+
+        /**
+         * Prepares a supplied Proxy to be RESTful.  Sets the HTTP method for each api-action to be one of
+         * GET, POST, PUT, DELETE according to the defined {@link #restActions}.
+         * @param {Ext.data.DataProxy} proxy
+         */
+        restify : function(proxy) {
+            proxy.restful = true;
+            for (var verb in this.restActions) {
+                proxy.api[this.actions[verb]].method ||
+                    (proxy.api[this.actions[verb]].method = this.restActions[verb]);
+            }
+            // TODO: perhaps move this interceptor elsewhere?  like into DataProxy, perhaps?  Placed here
+            // to satisfy initial 3.0 final release of REST features.
+            proxy.onWrite = proxy.onWrite.createInterceptor(function(action, o, response, rs) {
+                var reader = o.reader;
+                var res = new Ext.data.Response({
+                    action: action,
+                    raw: response
+                });
+
+                switch (response.status) {
+                    case 200:   // standard 200 response, send control back to HttpProxy#onWrite by returning true from this intercepted #onWrite
+                        return true;
+                        break;
+                    case 201:   // entity created but no response returned
+                        if (Ext.isEmpty(res.raw.responseText)) {
+                          res.success = true;
+                        } else {
+                          //if the response contains data, treat it like a 200
+                          return true;
+                        }
+                        break;
+                    case 204:  // no-content.  Create a fake response.
+                        res.success = true;
+                        res.data = null;
+                        break;
+                    default:
+                        return true;
+                        break;
+                }
+                if (res.success === true) {
+                    this.fireEvent("write", this, action, res.data, res, rs, o.request.arg);
+                } else {
+                    this.fireEvent('exception', this, 'remote', action, o, res, rs);
+                }
+                o.request.callback.call(o.request.scope, res.data, res, res.success);
+
+                return false;   // <-- false to prevent intercepted function from running.
+            }, proxy);
+        }
+    };
+})();
+
+/**
+ * Ext.data.Response
+ * Experimental.  Do not use directly.
+ */
+Ext.data.Response = function(params, response) {
+    Ext.apply(this, params, {
+        raw: response
+    });
+};
+Ext.data.Response.prototype = {
+    message : null,
+    success : false,
+    status : null,
+    root : null,
+    raw : null,
+
+    getMessage : function() {
+        return this.message;
+    },
+    getSuccess : function() {
+        return this.success;
+    },
+    getStatus : function() {
+        return this.status;
+    },
+    getRoot : function() {
+        return this.root;
+    },
+    getRawResponse : function() {
+        return this.raw;
+    }
+};
+
+/**
+ * @class Ext.data.Api.Error
+ * @extends Ext.Error
+ * Error class for Ext.data.Api errors
+ */
+Ext.data.Api.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.Api'
+});
+Ext.apply(Ext.data.Api.Error.prototype, {
+    lang: {
+        'action-url-undefined': 'No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.',
+        'invalid': 'received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions',
+        'invalid-url': 'Invalid url.  Please review your proxy configuration.',
+        'execute': 'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'
+    }
+});
+
+
+
+/**
+ * @class Ext.data.SortTypes
+ * @singleton
+ * Defines the default sorting (casting?) comparison functions used when sorting data.
+ */
+Ext.data.SortTypes = {
+    /**
+     * Default sort that does nothing
+     * @param {Mixed} s The value being converted
+     * @return {Mixed} The comparison value
+     */
+    none : function(s){
+        return s;
+    },
+    
+    /**
+     * The regular expression used to strip tags
+     * @type {RegExp}
+     * @property
+     */
+    stripTagsRE : /<\/?[^>]+>/gi,
+    
+    /**
+     * Strips all HTML tags to sort on text only
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asText : function(s){
+        return String(s).replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Strips all HTML tags to sort on text only - Case insensitive
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCText : function(s){
+        return String(s).toUpperCase().replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Case insensitive string
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCString : function(s) {
+    	return String(s).toUpperCase();
+    },
+    
+    /**
+     * Date sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asDate : function(s) {
+        if(!s){
+            return 0;
+        }
+        if(Ext.isDate(s)){
+            return s.getTime();
+        }
+    	return Date.parse(String(s));
+    },
+    
+    /**
+     * Float sorting
+     * @param {Mixed} s The value being converted
+     * @return {Float} The comparison value
+     */
+    asFloat : function(s) {
+    	var val = parseFloat(String(s).replace(/,/g, ""));
+    	return isNaN(val) ? 0 : val;
+    },
+    
+    /**
+     * Integer sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asInt : function(s) {
+        var val = parseInt(String(s).replace(/,/g, ""), 10);
+        return isNaN(val) ? 0 : val;
+    }
+};/**
+ * @class Ext.data.Record
+ * <p>Instances of this class encapsulate both Record <em>definition</em> information, and Record
+ * <em>value</em> information for use in {@link Ext.data.Store} objects, or any code which needs
+ * to access Records cached in an {@link Ext.data.Store} object.</p>
+ * <p>Constructors for this class are generated by passing an Array of field definition objects to {@link #create}.
+ * Instances are usually only created by {@link Ext.data.Reader} implementations when processing unformatted data
+ * objects.</p>
+ * <p>Note that an instance of a Record class may only belong to one {@link Ext.data.Store Store} at a time.
+ * In order to copy data from one Store to another, use the {@link #copy} method to create an exact
+ * copy of the Record, and insert the new instance into the other Store.</p>
+ * <p>When serializing a Record for submission to the server, be aware that it contains many private
+ * properties, and also a reference to its owning Store which in turn holds references to its Records.
+ * This means that a whole Record may not be encoded using {@link Ext.util.JSON.encode}. Instead, use the
+ * <code>{@link #data}</code> and <code>{@link #id}</code> properties.</p>
+ * <p>Record objects generated by this constructor inherit all the methods of Ext.data.Record listed below.</p>
+ * @constructor
+ * <p>This constructor should not be used to create Record objects. Instead, use {@link #create} to
+ * generate a subclass of Ext.data.Record configured with information about its constituent fields.<p>
+ * <p><b>The generated constructor has the same signature as this constructor.</b></p>
+ * @param {Object} data (Optional) An object, the properties of which provide values for the new Record's
+ * fields. If not specified the <code>{@link Ext.data.Field#defaultValue defaultValue}</code>
+ * for each field will be assigned.
+ * @param {Object} id (Optional) The id of the Record. The id is used by the
+ * {@link Ext.data.Store} object which owns the Record to index its collection
+ * of Records (therefore this id should be unique within each store). If an
+ * <code>id</code> is not specified a <b><code>{@link #phantom}</code></b>
+ * Record will be created with an {@link #Record.id automatically generated id}.
+ */
+Ext.data.Record = function(data, id){
+    // if no id, call the auto id method
+    this.id = (id || id === 0) ? id : Ext.data.Record.id(this);
+    this.data = data || {};
+};
+
+/**
+ * Generate a constructor for a specific Record layout.
+ * @param {Array} o An Array of <b>{@link Ext.data.Field Field}</b> definition objects.
+ * The constructor generated by this method may be used to create new Record instances. The data
+ * object must contain properties named after the {@link Ext.data.Field field}
+ * <b><tt>{@link Ext.data.Field#name}s</tt></b>.  Example usage:<pre><code>
+// create a Record constructor from a description of the fields
+var TopicRecord = Ext.data.Record.create([ // creates a subclass of Ext.data.Record
+    {{@link Ext.data.Field#name name}: 'title', {@link Ext.data.Field#mapping mapping}: 'topic_title'},
+    {name: 'author', mapping: 'username', allowBlank: false},
+    {name: 'totalPosts', mapping: 'topic_replies', type: 'int'},
+    {name: 'lastPost', mapping: 'post_time', type: 'date'},
+    {name: 'lastPoster', mapping: 'user2'},
+    {name: 'excerpt', mapping: 'post_text', allowBlank: false},
+    // In the simplest case, if no properties other than <tt>name</tt> are required,
+    // a field definition may consist of just a String for the field name.
+    'signature'
+]);
+
+// create Record instance
+var myNewRecord = new TopicRecord(
+    {
+        title: 'Do my job please',
+        author: 'noobie',
+        totalPosts: 1,
+        lastPost: new Date(),
+        lastPoster: 'Animal',
+        excerpt: 'No way dude!',
+        signature: ''
+    },
+    id // optionally specify the id of the record otherwise {@link #Record.id one is auto-assigned}
+);
+myStore.{@link Ext.data.Store#add add}(myNewRecord);
+</code></pre>
+ * @method create
+ * @return {Function} A constructor which is used to create new Records according
+ * to the definition. The constructor has the same signature as {@link #Record}.
+ * @static
+ */
+Ext.data.Record.create = function(o){
+    var f = Ext.extend(Ext.data.Record, {});
+    var p = f.prototype;
+    p.fields = new Ext.util.MixedCollection(false, function(field){
+        return field.name;
+    });
+    for(var i = 0, len = o.length; i < len; i++){
+        p.fields.add(new Ext.data.Field(o[i]));
+    }
+    f.getField = function(name){
+        return p.fields.get(name);
+    };
+    return f;
+};
+
+Ext.data.Record.PREFIX = 'ext-record';
+Ext.data.Record.AUTO_ID = 1;
+Ext.data.Record.EDIT = 'edit';
+Ext.data.Record.REJECT = 'reject';
+Ext.data.Record.COMMIT = 'commit';
+
+
+/**
+ * Generates a sequential id. This method is typically called when a record is {@link #create}d
+ * and {@link #Record no id has been specified}. The returned id takes the form:
+ * <tt>&#123;PREFIX}-&#123;AUTO_ID}</tt>.<div class="mdetail-params"><ul>
+ * <li><b><tt>PREFIX</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.PREFIX</tt>
+ * (defaults to <tt>'ext-record'</tt>)</p></li>
+ * <li><b><tt>AUTO_ID</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.AUTO_ID</tt>
+ * (defaults to <tt>1</tt> initially)</p></li>
+ * </ul></div>
+ * @param {Record} rec The record being created.  The record does not exist, it's a {@link #phantom}.
+ * @return {String} auto-generated string id, <tt>"ext-record-i++'</tt>;
+ */
+Ext.data.Record.id = function(rec) {
+    rec.phantom = true;
+    return [Ext.data.Record.PREFIX, '-', Ext.data.Record.AUTO_ID++].join('');
+};
+
+Ext.data.Record.prototype = {
+    /**
+     * <p><b>This property is stored in the Record definition's <u>prototype</u></b></p>
+     * A MixedCollection containing the defined {@link Ext.data.Field Field}s for this Record.  Read-only.
+     * @property fields
+     * @type Ext.util.MixedCollection
+     */
+    /**
+     * An object hash representing the data for this Record. Every field name in the Record definition
+     * is represented by a property of that name in this object. Note that unless you specified a field
+     * with {@link Ext.data.Field#name name} "id" in the Record definition, this will <b>not</b> contain
+     * an <tt>id</tt> property.
+     * @property data
+     * @type {Object}
+     */
+    /**
+     * The unique ID of the Record {@link #Record as specified at construction time}.
+     * @property id
+     * @type {Object}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.XmlReader XmlReader}</b>.</p>
+     * <p>The XML element which was the source of the data for this Record.</p>
+     * @property node
+     * @type {XMLElement}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.ArrayReader ArrayReader} or a {@link Ext.data.JsonReader JsonReader}</b>.</p>
+     * <p>The Array or object which was the source of the data for this Record.</p>
+     * @property json
+     * @type {Array|Object}
+     */
+    /**
+     * Readonly flag - true if this Record has been modified.
+     * @type Boolean
+     */
+    dirty : false,
+    editing : false,
+    error : null,
+    /**
+     * This object contains a key and value storing the original values of all modified
+     * fields or is null if no fields have been modified.
+     * @property modified
+     * @type {Object}
+     */
+    modified : null,
+    /**
+     * <tt>true</tt> when the record does not yet exist in a server-side database (see
+     * {@link #markDirty}).  Any record which has a real database pk set as its id property
+     * is NOT a phantom -- it's real.
+     * @property phantom
+     * @type {Boolean}
+     */
+    phantom : false,
+
+    // private
+    join : function(store){
+        /**
+         * The {@link Ext.data.Store} to which this Record belongs.
+         * @property store
+         * @type {Ext.data.Store}
+         */
+        this.store = store;
+    },
+
+    /**
+     * Set the {@link Ext.data.Field#name named field} to the specified value.  For example:
+     * <pre><code>
+// record has a field named 'firstname'
+var Employee = Ext.data.Record.{@link #create}([
+    {name: 'firstname'},
+    ...
+]);
+
+// update the 2nd record in the store:
+var rec = myStore.{@link Ext.data.Store#getAt getAt}(1);
+
+// set the value (shows dirty flag):
+rec.set('firstname', 'Betty');
+
+// commit the change (removes dirty flag):
+rec.{@link #commit}();
+
+// update the record in the store, bypass setting dirty flag,
+// and do not store the change in the {@link Ext.data.Store#getModifiedRecords modified records}
+rec.{@link #data}['firstname'] = 'Wilma'; // updates record, but not the view
+rec.{@link #commit}(); // updates the view
+     * </code></pre>
+     * <b>Notes</b>:<div class="mdetail-params"><ul>
+     * <li>If the store has a writer and <code>autoSave=true</code>, each set()
+     * will execute an XHR to the server.</li>
+     * <li>Use <code>{@link #beginEdit}</code> to prevent the store's <code>update</code>
+     * event firing while using set().</li>
+     * <li>Use <code>{@link #endEdit}</code> to have the store's <code>update</code>
+     * event fire.</li>
+     * </ul></div>
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to set.
+     * @param {String/Object/Array} value The value to set the field to.
+     */
+    set : function(name, value){
+        var encode = Ext.isPrimitive(value) ? String : Ext.encode;
+        if(encode(this.data[name]) == encode(value)) {
+            return;
+        }        
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        if(this.modified[name] === undefined){
+            this.modified[name] = this.data[name];
+        }
+        this.data[name] = value;
+        if(!this.editing){
+            this.afterEdit();
+        }
+    },
+
+    // private
+    afterEdit : function(){
+        if (this.store != undefined && typeof this.store.afterEdit == "function") {
+            this.store.afterEdit(this);
+        }
+    },
+
+    // private
+    afterReject : function(){
+        if(this.store){
+            this.store.afterReject(this);
+        }
+    },
+
+    // private
+    afterCommit : function(){
+        if(this.store){
+            this.store.afterCommit(this);
+        }
+    },
+
+    /**
+     * Get the value of the {@link Ext.data.Field#name named field}.
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to get the value of.
+     * @return {Object} The value of the field.
+     */
+    get : function(name){
+        return this.data[name];
+    },
+
+    /**
+     * Begin an edit. While in edit mode, no events (e.g.. the <code>update</code> event)
+     * are relayed to the containing store.
+     * See also: <code>{@link #endEdit}</code> and <code>{@link #cancelEdit}</code>.
+     */
+    beginEdit : function(){
+        this.editing = true;
+        this.modified = this.modified || {};
+    },
+
+    /**
+     * Cancels all changes made in the current edit operation.
+     */
+    cancelEdit : function(){
+        this.editing = false;
+        delete this.modified;
+    },
+
+    /**
+     * End an edit. If any data was modified, the containing store is notified
+     * (ie, the store's <code>update</code> event will fire).
+     */
+    endEdit : function(){
+        this.editing = false;
+        if(this.dirty){
+            this.afterEdit();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Rejects all changes made to the Record since either creation, or the last commit operation.
+     * Modified fields are reverted to their original values.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of reject operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    reject : function(silent){
+        var m = this.modified;
+        for(var n in m){
+            if(typeof m[n] != "function"){
+                this.data[n] = m[n];
+            }
+        }
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterReject();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Commits all changes made to the Record since either creation, or the last commit operation.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of commit operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    commit : function(silent){
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterCommit();
+        }
+    },
+
+    /**
+     * Gets a hash of only the fields that have been modified since this Record was created or commited.
+     * @return Object
+     */
+    getChanges : function(){
+        var m = this.modified, cs = {};
+        for(var n in m){
+            if(m.hasOwnProperty(n)){
+                cs[n] = this.data[n];
+            }
+        }
+        return cs;
+    },
+
+    // private
+    hasError : function(){
+        return this.error !== null;
+    },
+
+    // private
+    clearError : function(){
+        this.error = null;
+    },
+
+    /**
+     * Creates a copy (clone) of this Record.
+     * @param {String} id (optional) A new Record id, defaults to the id
+     * of the record being copied. See <code>{@link #id}</code>. 
+     * To generate a phantom record with a new id use:<pre><code>
+var rec = record.copy(); // clone the record
+Ext.data.Record.id(rec); // automatically generate a unique sequential id
+     * </code></pre>
+     * @return {Record}
+     */
+    copy : function(newId) {
+        return new this.constructor(Ext.apply({}, this.data), newId || this.id);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the passed field name has been <code>{@link #modified}</code>
+     * since the load or last commit.
+     * @param {String} fieldName {@link Ext.data.Field.{@link Ext.data.Field#name}
+     * @return {Boolean}
+     */
+    isModified : function(fieldName){
+        return !!(this.modified && this.modified.hasOwnProperty(fieldName));
+    },
+
+    /**
+     * By default returns <tt>false</tt> if any {@link Ext.data.Field field} within the
+     * record configured with <tt>{@link Ext.data.Field#allowBlank} = false</tt> returns
+     * <tt>true</tt> from an {@link Ext}.{@link Ext#isEmpty isempty} test.
+     * @return {Boolean}
+     */
+    isValid : function() {
+        return this.fields.find(function(f) {
+            return (f.allowBlank === false && Ext.isEmpty(this.data[f.name])) ? true : false;
+        },this) ? false : true;
+    },
+
+    /**
+     * <p>Marks this <b>Record</b> as <code>{@link #dirty}</code>.  This method
+     * is used interally when adding <code>{@link #phantom}</code> records to a
+     * {@link Ext.data.Store#writer writer enabled store}.</p>
+     * <br><p>Marking a record <code>{@link #dirty}</code> causes the phantom to
+     * be returned by {@link Ext.data.Store#getModifiedRecords} where it will
+     * have a create action composed for it during {@link Ext.data.Store#save store save}
+     * operations.</p>
+     */
+    markDirty : function(){
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        this.fields.each(function(f) {
+            this.modified[f.name] = this.data[f.name];
+        },this);
+    }
+};
+/**
+ * @class Ext.StoreMgr
+ * @extends Ext.util.MixedCollection
+ * The default global group of stores.
+ * @singleton
+ */
+Ext.StoreMgr = Ext.apply(new Ext.util.MixedCollection(), {
+    /**
+     * @cfg {Object} listeners @hide
+     */
+
+    /**
+     * Registers one or more Stores with the StoreMgr. You do not normally need to register stores
+     * manually.  Any store initialized with a {@link Ext.data.Store#storeId} will be auto-registered. 
+     * @param {Ext.data.Store} store1 A Store instance
+     * @param {Ext.data.Store} store2 (optional)
+     * @param {Ext.data.Store} etc... (optional)
+     */
+    register : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.add(s);
+        }
+    },
+
+    /**
+     * Unregisters one or more Stores with the StoreMgr
+     * @param {String/Object} id1 The id of the Store, or a Store instance
+     * @param {String/Object} id2 (optional)
+     * @param {String/Object} etc... (optional)
+     */
+    unregister : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.remove(this.lookup(s));
+        }
+    },
+
+    /**
+     * Gets a registered Store by id
+     * @param {String/Object} id The id of the Store, or a Store instance
+     * @return {Ext.data.Store}
+     */
+    lookup : function(id){
+        if(Ext.isArray(id)){
+            var fields = ['field1'], expand = !Ext.isArray(id[0]);
+            if(!expand){
+                for(var i = 2, len = id[0].length; i <= len; ++i){
+                    fields.push('field' + i);
+                }
+            }
+            return new Ext.data.ArrayStore({
+                fields: fields,
+                data: id,
+                expandData: expand,
+                autoDestroy: true,
+                autoCreated: true
+
+            });
+        }
+        return Ext.isObject(id) ? (id.events ? id : Ext.create(id, 'store')) : this.get(id);
+    },
+
+    // getKey implementation for MixedCollection
+    getKey : function(o){
+         return o.storeId;
+    }
+});/**
+ * @class Ext.data.Store
+ * @extends Ext.util.Observable
+ * <p>The Store class encapsulates a client side cache of {@link Ext.data.Record Record}
+ * objects which provide input data for Components such as the {@link Ext.grid.GridPanel GridPanel},
+ * the {@link Ext.form.ComboBox ComboBox}, or the {@link Ext.DataView DataView}.</p>
+ * <p><u>Retrieving Data</u></p>
+ * <p>A Store object may access a data object using:<div class="mdetail-params"><ul>
+ * <li>{@link #proxy configured implementation} of {@link Ext.data.DataProxy DataProxy}</li>
+ * <li>{@link #data} to automatically pass in data</li>
+ * <li>{@link #loadData} to manually pass in data</li>
+ * </ul></div></p>
+ * <p><u>Reading Data</u></p>
+ * <p>A Store object has no inherent knowledge of the format of the data object (it could be
+ * an Array, XML, or JSON). A Store object uses an appropriate {@link #reader configured implementation}
+ * of a {@link Ext.data.DataReader DataReader} to create {@link Ext.data.Record Record} instances from the data
+ * object.</p>
+ * <p><u>Store Types</u></p>
+ * <p>There are several implementations of Store available which are customized for use with
+ * a specific DataReader implementation.  Here is an example using an ArrayStore which implicitly
+ * creates a reader commensurate to an Array data object.</p>
+ * <pre><code>
+var myStore = new Ext.data.ArrayStore({
+    fields: ['fullname', 'first'],
+    idIndex: 0 // id for each record will be the first element
+});
+ * </code></pre>
+ * <p>For custom implementations create a basic {@link Ext.data.Store} configured as needed:</p>
+ * <pre><code>
+// create a {@link Ext.data.Record Record} constructor:
+var rt = Ext.data.Record.create([
+    {name: 'fullname'},
+    {name: 'first'}
+]);
+var myStore = new Ext.data.Store({
+    // explicitly create reader
+    reader: new Ext.data.ArrayReader(
+        {
+            idIndex: 0  // id for each record will be the first element
+        },
+        rt // recordType
+    )
+});
+ * </code></pre>
+ * <p>Load some data into store (note the data object is an array which corresponds to the reader):</p>
+ * <pre><code>
+var myData = [
+    [1, 'Fred Flintstone', 'Fred'],  // note that id for the record is the first element
+    [2, 'Barney Rubble', 'Barney']
+];
+myStore.loadData(myData);
+ * </code></pre>
+ * <p>Records are cached and made available through accessor functions.  An example of adding
+ * a record to the store:</p>
+ * <pre><code>
+var defaultData = {
+    fullname: 'Full Name',
+    first: 'First Name'
+};
+var recId = 100; // provide unique id for the record
+var r = new myStore.recordType(defaultData, ++recId); // create new record
+myStore.{@link #insert}(0, r); // insert a new record into the store (also see {@link #add})
+ * </code></pre>
+ * <p><u>Writing Data</u></p>
+ * <p>And <b>new in Ext version 3</b>, use the new {@link Ext.data.DataWriter DataWriter} to create an automated, <a href="http://extjs.com/deploy/dev/examples/writer/writer.html">Writable Store</a>
+ * along with <a href="http://extjs.com/deploy/dev/examples/restful/restful.html">RESTful features.</a>
+ * @constructor
+ * Creates a new Store.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype store
+ */
+Ext.data.Store = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {String} storeId If passed, the id to use to register with the <b>{@link Ext.StoreMgr StoreMgr}</b>.
+     * <p><b>Note</b>: if a (deprecated) <tt>{@link #id}</tt> is specified it will supersede the <tt>storeId</tt>
+     * assignment.</p>
+     */
+    /**
+     * @cfg {String} url If a <tt>{@link #proxy}</tt> is not specified the <tt>url</tt> will be used to
+     * implicitly configure a {@link Ext.data.HttpProxy HttpProxy} if an <tt>url</tt> is specified.
+     * Typically this option, or the <code>{@link #data}</code> option will be specified.
+     */
+    /**
+     * @cfg {Boolean/Object} autoLoad If <tt>{@link #data}</tt> is not specified, and if <tt>autoLoad</tt>
+     * is <tt>true</tt> or an <tt>Object</tt>, this store's {@link #load} method is automatically called
+     * after creation. If the value of <tt>autoLoad</tt> is an <tt>Object</tt>, this <tt>Object</tt> will
+     * be passed to the store's {@link #load} method.
+     */
+    /**
+     * @cfg {Ext.data.DataProxy} proxy The {@link Ext.data.DataProxy DataProxy} object which provides
+     * access to a data object.  See <code>{@link #url}</code>.
+     */
+    /**
+     * @cfg {Array} data An inline data object readable by the <code>{@link #reader}</code>.
+     * Typically this option, or the <code>{@link #url}</code> option will be specified.
+     */
+    /**
+     * @cfg {Ext.data.DataReader} reader The {@link Ext.data.DataReader Reader} object which processes the
+     * data object and returns an Array of {@link Ext.data.Record} objects which are cached keyed by their
+     * <b><tt>{@link Ext.data.Record#id id}</tt></b> property.
+     */
+    /**
+     * @cfg {Ext.data.DataWriter} writer
+     * <p>The {@link Ext.data.DataWriter Writer} object which processes a record object for being written
+     * to the server-side database.</p>
+     * <br><p>When a writer is installed into a Store the {@link #add}, {@link #remove}, and {@link #update}
+     * events on the store are monitored in order to remotely {@link #createRecords create records},
+     * {@link #destroyRecord destroy records}, or {@link #updateRecord update records}.</p>
+     * <br><p>The proxy for this store will relay any {@link #writexception} events to this store.</p>
+     * <br><p>Sample implementation:
+     * <pre><code>
+var writer = new {@link Ext.data.JsonWriter}({
+    encode: true,
+    writeAllFields: true // write all fields, not just those that changed
+});
+
+// Typical Store collecting the Proxy, Reader and Writer together.
+var store = new Ext.data.Store({
+    storeId: 'user',
+    root: 'records',
+    proxy: proxy,
+    reader: reader,
+    writer: writer,     // <-- plug a DataWriter into the store just as you would a Reader
+    paramsAsHash: true,
+    autoSave: false    // <-- false to delay executing create, update, destroy requests
+                        //     until specifically told to do so.
+});
+     * </code></pre></p>
+     */
+    writer : undefined,
+    /**
+     * @cfg {Object} baseParams
+     * <p>An object containing properties which are to be sent as parameters
+     * for <i>every</i> HTTP request.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     * <p><b>Note</b>: <code>baseParams</code> may be superseded by any <code>params</code>
+     * specified in a <code>{@link #load}</code> request, see <code>{@link #load}</code>
+     * for more details.</p>
+     * This property may be modified after creation using the <code>{@link #setBaseParam}</code>
+     * method.
+     * @property
+     */
+    /**
+     * @cfg {Object} sortInfo A config object to specify the sort order in the request of a Store's
+     * {@link #load} operation.  Note that for local sorting, the <tt>direction</tt> property is
+     * case-sensitive. See also {@link #remoteSort} and {@link #paramNames}.
+     * For example:<pre><code>
+sortInfo: {
+    field: 'fieldName',
+    direction: 'ASC' // or 'DESC' (case sensitive for local sorting)
+}
+</code></pre>
+     */
+    /**
+     * @cfg {boolean} remoteSort <tt>true</tt> if sorting is to be handled by requesting the <tt>{@link #proxy Proxy}</tt>
+     * to provide a refreshed version of the data object in sorted order, as opposed to sorting the Record cache
+     * in place (defaults to <tt>false</tt>).
+     * <p>If <tt>remoteSort</tt> is <tt>true</tt>, then clicking on a {@link Ext.grid.Column Grid Column}'s
+     * {@link Ext.grid.Column#header header} causes the current page to be requested from the server appending
+     * the following two parameters to the <b><tt>{@link #load params}</tt></b>:<div class="mdetail-params"><ul>
+     * <li><b><tt>sort</tt></b> : String<p class="sub-desc">The <tt>name</tt> (as specified in the Record's
+     * {@link Ext.data.Field Field definition}) of the field to sort on.</p></li>
+     * <li><b><tt>dir</tt></b> : String<p class="sub-desc">The direction of the sort, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul></div></p>
+     */
+    remoteSort : false,
+
+    /**
+     * @cfg {Boolean} autoDestroy <tt>true</tt> to destroy the store when the component the store is bound
+     * to is destroyed (defaults to <tt>false</tt>).
+     * <p><b>Note</b>: this should be set to true when using stores that are bound to only 1 component.</p>
+     */
+    autoDestroy : false,
+
+    /**
+     * @cfg {Boolean} pruneModifiedRecords <tt>true</tt> to clear all modified record information each time
+     * the store is loaded or when a record is removed (defaults to <tt>false</tt>). See {@link #getModifiedRecords}
+     * for the accessor method to retrieve the modified records.
+     */
+    pruneModifiedRecords : false,
+
+    /**
+     * Contains the last options object used as the parameter to the {@link #load} method. See {@link #load}
+     * for the details of what this may contain. This may be useful for accessing any params which were used
+     * to load the current Record cache.
+     * @property
+     */
+    lastOptions : null,
+
+    /**
+     * @cfg {Boolean} autoSave
+     * <p>Defaults to <tt>true</tt> causing the store to automatically {@link #save} records to
+     * the server when a record is modified (ie: becomes 'dirty'). Specify <tt>false</tt> to manually call {@link #save}
+     * to send all modifiedRecords to the server.</p>
+     * <br><p><b>Note</b>: each CRUD action will be sent as a separate request.</p>
+     */
+    autoSave : true,
+
+    /**
+     * @cfg {Boolean} batch
+     * <p>Defaults to <tt>true</tt> (unless <code>{@link #restful}:true</code>). Multiple
+     * requests for each CRUD action (CREATE, READ, UPDATE and DESTROY) will be combined
+     * and sent as one transaction. Only applies when <code>{@link #autoSave}</code> is set
+     * to <tt>false</tt>.</p>
+     * <br><p>If Store is RESTful, the DataProxy is also RESTful, and a unique transaction is
+     * generated for each record.</p>
+     */
+    batch : true,
+
+    /**
+     * @cfg {Boolean} restful
+     * Defaults to <tt>false</tt>.  Set to <tt>true</tt> to have the Store and the set
+     * Proxy operate in a RESTful manner. The store will automatically generate GET, POST,
+     * PUT and DELETE requests to the server. The HTTP method used for any given CRUD
+     * action is described in {@link Ext.data.Api#restActions}.  For additional information
+     * see {@link Ext.data.DataProxy#restful}.
+     * <p><b>Note</b>: if <code>{@link #restful}:true</code> <code>batch</code> will
+     * internally be set to <tt>false</tt>.</p>
+     */
+    restful: false,
+
+    /**
+     * @cfg {Object} paramNames
+     * <p>An object containing properties which specify the names of the paging and
+     * sorting parameters passed to remote servers when loading blocks of data. By default, this
+     * object takes the following form:</p><pre><code>
+{
+    start : 'start',  // The parameter name which specifies the start row
+    limit : 'limit',  // The parameter name which specifies number of rows to return
+    sort : 'sort',    // The parameter name which specifies the column to sort on
+    dir : 'dir'       // The parameter name which specifies the sort direction
+}
+</code></pre>
+     * <p>The server must produce the requested data block upon receipt of these parameter names.
+     * If different parameter names are required, this property can be overriden using a configuration
+     * property.</p>
+     * <p>A {@link Ext.PagingToolbar PagingToolbar} bound to this Store uses this property to determine
+     * the parameter names to use in its {@link #load requests}.
+     */
+    paramNames : undefined,
+
+    /**
+     * @cfg {Object} defaultParamNames
+     * Provides the default values for the {@link #paramNames} property. To globally modify the parameters
+     * for all stores, this object should be changed on the store prototype.
+     */
+    defaultParamNames : {
+        start : 'start',
+        limit : 'limit',
+        sort : 'sort',
+        dir : 'dir'
+    },
+
+    isDestroyed: false,    
+    hasMultiSort: false,
+
+    // private
+    batchKey : '_ext_batch_',
+
+    constructor : function(config){
+        /**
+         * @property multiSort
+         * @type Boolean
+         * True if this store is currently sorted by more than one field/direction combination.
+         */
+        
+        /**
+         * @property isDestroyed
+         * @type Boolean
+         * True if the store has been destroyed already. Read only
+         */
+        
+        this.data = new Ext.util.MixedCollection(false);
+        this.data.getKey = function(o){
+            return o.id;
+        };
+        
+
+        // temporary removed-records cache
+        this.removed = [];
+
+        if(config && config.data){
+            this.inlineData = config.data;
+            delete config.data;
+        }
+
+        Ext.apply(this, config);
+
+        /**
+         * See the <code>{@link #baseParams corresponding configuration option}</code>
+         * for a description of this property.
+         * To modify this property see <code>{@link #setBaseParam}</code>.
+         * @property
+         */
+        this.baseParams = Ext.isObject(this.baseParams) ? this.baseParams : {};
+
+        this.paramNames = Ext.applyIf(this.paramNames || {}, this.defaultParamNames);
+
+        if((this.url || this.api) && !this.proxy){
+            this.proxy = new Ext.data.HttpProxy({url: this.url, api: this.api});
+        }
+        // If Store is RESTful, so too is the DataProxy
+        if (this.restful === true && this.proxy) {
+            // When operating RESTfully, a unique transaction is generated for each record.
+            // TODO might want to allow implemention of faux REST where batch is possible using RESTful routes only.
+            this.batch = false;
+            Ext.data.Api.restify(this.proxy);
+        }
+
+        if(this.reader){ // reader passed
+            if(!this.recordType){
+                this.recordType = this.reader.recordType;
+            }
+            if(this.reader.onMetaChange){
+                this.reader.onMetaChange = this.reader.onMetaChange.createSequence(this.onMetaChange, this);
+            }
+            if (this.writer) { // writer passed
+                if (this.writer instanceof(Ext.data.DataWriter) === false) {    // <-- config-object instead of instance.
+                    this.writer = this.buildWriter(this.writer);
+                }
+                this.writer.meta = this.reader.meta;
+                this.pruneModifiedRecords = true;
+            }
+        }
+
+        /**
+         * The {@link Ext.data.Record Record} constructor as supplied to (or created by) the
+         * {@link Ext.data.DataReader Reader}. Read-only.
+         * <p>If the Reader was constructed by passing in an Array of {@link Ext.data.Field} definition objects,
+         * instead of a Record constructor, it will implicitly create a Record constructor from that Array (see
+         * {@link Ext.data.Record}.{@link Ext.data.Record#create create} for additional details).</p>
+         * <p>This property may be used to create new Records of the type held in this Store, for example:</p><pre><code>
+    // create the data store
+    var store = new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: [
+           {name: 'company'},
+           {name: 'price', type: 'float'},
+           {name: 'change', type: 'float'},
+           {name: 'pctChange', type: 'float'},
+           {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+        ]
+    });
+    store.loadData(myData);
+
+    // create the Grid
+    var grid = new Ext.grid.EditorGridPanel({
+        store: store,
+        colModel: new Ext.grid.ColumnModel({
+            columns: [
+                {id:'company', header: 'Company', width: 160, dataIndex: 'company'},
+                {header: 'Price', renderer: 'usMoney', dataIndex: 'price'},
+                {header: 'Change', renderer: change, dataIndex: 'change'},
+                {header: '% Change', renderer: pctChange, dataIndex: 'pctChange'},
+                {header: 'Last Updated', width: 85,
+                    renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+                    dataIndex: 'lastChange'}
+            ],
+            defaults: {
+                sortable: true,
+                width: 75
+            }
+        }),
+        autoExpandColumn: 'company', // match the id specified in the column model
+        height:350,
+        width:600,
+        title:'Array Grid',
+        tbar: [{
+            text: 'Add Record',
+            handler : function(){
+                var defaultData = {
+                    change: 0,
+                    company: 'New Company',
+                    lastChange: (new Date()).clearTime(),
+                    pctChange: 0,
+                    price: 10
+                };
+                var recId = 3; // provide unique id
+                var p = new store.recordType(defaultData, recId); // create new record
+                grid.stopEditing();
+                store.{@link #insert}(0, p); // insert a new record into the store (also see {@link #add})
+                grid.startEditing(0, 0);
+            }
+        }]
+    });
+         * </code></pre>
+         * @property recordType
+         * @type Function
+         */
+
+        if(this.recordType){
+            /**
+             * A {@link Ext.util.MixedCollection MixedCollection} containing the defined {@link Ext.data.Field Field}s
+             * for the {@link Ext.data.Record Records} stored in this Store. Read-only.
+             * @property fields
+             * @type Ext.util.MixedCollection
+             */
+            this.fields = this.recordType.prototype.fields;
+        }
+        this.modified = [];
+
+        this.addEvents(
+            /**
+             * @event datachanged
+             * Fires when the data cache has changed in a bulk manner (e.g., it has been sorted, filtered, etc.) and a
+             * widget that is using this Store as a Record cache should refresh its view.
+             * @param {Store} this
+             */
+            'datachanged',
+            /**
+             * @event metachange
+             * Fires when this store's reader provides new metadata (fields). This is currently only supported for JsonReaders.
+             * @param {Store} this
+             * @param {Object} meta The JSON metadata
+             */
+            'metachange',
+            /**
+             * @event add
+             * Fires when Records have been {@link #add}ed to the Store
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The array of Records added
+             * @param {Number} index The index at which the record(s) were added
+             */
+            'add',
+            /**
+             * @event remove
+             * Fires when a Record has been {@link #remove}d from the Store
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was removed
+             * @param {Number} index The index at which the record was removed
+             */
+            'remove',
+            /**
+             * @event update
+             * Fires when a Record has been updated
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was updated
+             * @param {String} operation The update operation being performed.  Value may be one of:
+             * <pre><code>
+     Ext.data.Record.EDIT
+     Ext.data.Record.REJECT
+     Ext.data.Record.COMMIT
+             * </code></pre>
+             */
+            'update',
+            /**
+             * @event clear
+             * Fires when the data cache has been cleared.
+             * @param {Store} this
+             * @param {Record[]} records The records that were cleared.
+             */
+            'clear',
+            /**
+             * @event exception
+             * <p>Fires if an exception occurs in the Proxy during a remote request.
+             * This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for description.
+             */
+            'exception',
+            /**
+             * @event beforeload
+             * Fires before a request is made for a new data object.  If the beforeload handler returns
+             * <tt>false</tt> the {@link #load} action will be canceled.
+             * @param {Store} this
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'beforeload',
+            /**
+             * @event load
+             * Fires after a new set of Records has been loaded.
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The Records that were loaded
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'load',
+            /**
+             * @event loadexception
+             * <p>This event is <b>deprecated</b> in favor of the catch-all <b><code>{@link #exception}</code></b>
+             * event instead.</p>
+             * <p>This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for description.
+             */
+            'loadexception',
+            /**
+             * @event beforewrite
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Record/Record[]} rs The Record(s) being written.
+             * @param {Object} options The loading options that were specified. Edit <code>options.params</code> to add Http parameters to the request.  (see {@link #save} for details)
+             * @param {Object} arg The callback's arg object passed to the {@link #request} function
+             */
+            'beforewrite',
+            /**
+             * @event write
+             * Fires if the server returns 200 after an Ext.data.Api.actions CRUD action.
+             * Success of the action is determined in the <code>result['successProperty']</code>property (<b>NOTE</b> for RESTful stores,
+             * a simple 20x response is sufficient for the actions "destroy" and "update".  The "create" action should should return 200 along with a database pk).
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Object} result The 'data' picked-out out of the response for convenience.
+             * @param {Ext.Direct.Transaction} res
+             * @param {Record/Record[]} rs Store's records, the subject(s) of the write-action
+             */
+            'write',
+            /**
+             * @event beforesave
+             * Fires before a save action is called. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'beforesave',
+            /**
+             * @event save
+             * Fires after a save is completed. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Number} batch The identifier for the batch that was saved.
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'save'
+
+        );
+
+        if(this.proxy){
+            // TODO remove deprecated loadexception with ext-3.0.1
+            this.relayEvents(this.proxy,  ['loadexception', 'exception']);
+        }
+        // With a writer set for the Store, we want to listen to add/remove events to remotely create/destroy records.
+        if (this.writer) {
+            this.on({
+                scope: this,
+                add: this.createRecords,
+                remove: this.destroyRecord,
+                update: this.updateRecord,
+                clear: this.onClear
+            });
+        }
+
+        this.sortToggle = {};
+        if(this.sortField){
+            this.setDefaultSort(this.sortField, this.sortDir);
+        }else if(this.sortInfo){
+            this.setDefaultSort(this.sortInfo.field, this.sortInfo.direction);
+        }
+
+        Ext.data.Store.superclass.constructor.call(this);
+
+        if(this.id){
+            this.storeId = this.id;
+            delete this.id;
+        }
+        if(this.storeId){
+            Ext.StoreMgr.register(this);
+        }
+        if(this.inlineData){
+            this.loadData(this.inlineData);
+            delete this.inlineData;
+        }else if(this.autoLoad){
+            this.load.defer(10, this, [
+                typeof this.autoLoad == 'object' ?
+                    this.autoLoad : undefined]);
+        }
+        // used internally to uniquely identify a batch
+        this.batchCounter = 0;
+        this.batches = {};
+    },
+
+    /**
+     * builds a DataWriter instance when Store constructor is provided with a writer config-object instead of an instace.
+     * @param {Object} config Writer configuration
+     * @return {Ext.data.DataWriter}
+     * @private
+     */
+    buildWriter : function(config) {
+        var klass = undefined,
+            type = (config.format || 'json').toLowerCase();
+        switch (type) {
+            case 'json':
+                klass = Ext.data.JsonWriter;
+                break;
+            case 'xml':
+                klass = Ext.data.XmlWriter;
+                break;
+            default:
+                klass = Ext.data.JsonWriter;
+        }
+        return new klass(config);
+    },
+
+    /**
+     * Destroys the store.
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.storeId){
+                Ext.StoreMgr.unregister(this);
+            }
+            this.clearData();
+            this.data = null;
+            Ext.destroy(this.proxy);
+            this.reader = this.writer = null;
+            this.purgeListeners();
+            this.isDestroyed = true;
+        }
+    },
+
+    /**
+     * Add Records to the Store and fires the {@link #add} event.  To add Records
+     * to the store from a remote source use <code>{@link #load}({add:true})</code>.
+     * See also <code>{@link #recordType}</code> and <code>{@link #insert}</code>.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects
+     * to add to the cache. See {@link #recordType}.
+     */
+    add : function(records) {
+        var i, len, record, index;
+        
+        records = [].concat(records);
+        if (records.length < 1) {
+            return;
+        }
+        
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        index = this.data.length;
+        this.data.addAll(records);
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * (Local sort only) Inserts the passed Record into the Store at the index where it
+     * should go based on the current sort information.
+     * @param {Ext.data.Record} record
+     */
+    addSorted : function(record){
+        var index = this.findInsertIndex(record);
+        this.insert(index, record);
+    },
+    
+    /**
+     * @private
+     * Update a record within the store with a new reference
+     */
+    doUpdate: function(rec){
+        var id = rec.id;
+        // unjoin the old record
+        this.getById(id).join(null);
+        
+        this.data.replace(id, rec);
+        if (this.snapshot) {
+            this.snapshot.replace(id, rec);
+        }
+        rec.join(this);
+        this.fireEvent('update', this, rec, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Remove Records from the Store and fires the {@link #remove} event.
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record object or array of records to remove from the cache.
+     */
+    remove : function(record){
+        if(Ext.isArray(record)){
+            Ext.each(record, function(r){
+                this.remove(r);
+            }, this);
+            return;
+        }
+        var index = this.data.indexOf(record);
+        if(index > -1){
+            record.join(null);
+            this.data.removeAt(index);
+        }
+        if(this.pruneModifiedRecords){
+            this.modified.remove(record);
+        }
+        if(this.snapshot){
+            this.snapshot.remove(record);
+        }
+        if(index > -1){
+            this.fireEvent('remove', this, record, index);
+        }
+    },
+
+    /**
+     * Remove a Record from the Store at the specified index. Fires the {@link #remove} event.
+     * @param {Number} index The index of the record to remove.
+     */
+    removeAt : function(index){
+        this.remove(this.getAt(index));
+    },
+
+    /**
+     * Remove all Records from the Store and fires the {@link #clear} event.
+     * @param {Boolean} silent [false] Defaults to <tt>false</tt>.  Set <tt>true</tt> to not fire clear event.
+     */
+    removeAll : function(silent){
+        var items = [];
+        this.each(function(rec){
+            items.push(rec);
+        });
+        this.clearData();
+        if(this.snapshot){
+            this.snapshot.clear();
+        }
+        if(this.pruneModifiedRecords){
+            this.modified = [];
+        }
+        if (silent !== true) {  // <-- prevents write-actions when we just want to clear a store.
+            this.fireEvent('clear', this, items);
+        }
+    },
+
+    // private
+    onClear: function(store, records){
+        Ext.each(records, function(rec, index){
+            this.destroyRecord(this, rec, index);
+        }, this);
+    },
+
+    /**
+     * Inserts Records into the Store at the given index and fires the {@link #add} event.
+     * See also <code>{@link #add}</code> and <code>{@link #addSorted}</code>.
+     * @param {Number} index The start index at which to insert the passed Records.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects to add to the cache.
+     */
+    insert : function(index, records) {
+        var i, len, record;
+        
+        records = [].concat(records);
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            this.data.insert(index + i, record);
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * Get the index within the cache of the passed Record.
+     * @param {Ext.data.Record} record The Ext.data.Record object to find.
+     * @return {Number} The index of the passed Record. Returns -1 if not found.
+     */
+    indexOf : function(record){
+        return this.data.indexOf(record);
+    },
+
+    /**
+     * Get the index within the cache of the Record with the passed id.
+     * @param {String} id The id of the Record to find.
+     * @return {Number} The index of the Record. Returns -1 if not found.
+     */
+    indexOfId : function(id){
+        return this.data.indexOfKey(id);
+    },
+
+    /**
+     * Get the Record with the specified id.
+     * @param {String} id The id of the Record to find.
+     * @return {Ext.data.Record} The Record with the passed id. Returns undefined if not found.
+     */
+    getById : function(id){
+        return (this.snapshot || this.data).key(id);
+    },
+
+    /**
+     * Get the Record at the specified index.
+     * @param {Number} index The index of the Record to find.
+     * @return {Ext.data.Record} The Record at the passed index. Returns undefined if not found.
+     */
+    getAt : function(index){
+        return this.data.itemAt(index);
+    },
+
+    /**
+     * Returns a range of Records between specified indices.
+     * @param {Number} startIndex (optional) The starting index (defaults to 0)
+     * @param {Number} endIndex (optional) The ending index (defaults to the last Record in the Store)
+     * @return {Ext.data.Record[]} An array of Records
+     */
+    getRange : function(start, end){
+        return this.data.getRange(start, end);
+    },
+
+    // private
+    storeOptions : function(o){
+        o = Ext.apply({}, o);
+        delete o.callback;
+        delete o.scope;
+        this.lastOptions = o;
+    },
+
+    // private
+    clearData: function(){
+        this.data.each(function(rec) {
+            rec.join(null);
+        });
+        this.data.clear();
+    },
+
+    /**
+     * <p>Loads the Record cache from the configured <tt>{@link #proxy}</tt> using the configured <tt>{@link #reader}</tt>.</p>
+     * <br><p>Notes:</p><div class="mdetail-params"><ul>
+     * <li><b><u>Important</u></b>: loading is asynchronous! This call will return before the new data has been
+     * loaded. To perform any post-processing where information from the load call is required, specify
+     * the <tt>callback</tt> function to be called, or use a {@link Ext.util.Observable#listeners a 'load' event handler}.</li>
+     * <li>If using {@link Ext.PagingToolbar remote paging}, the first load call must specify the <tt>start</tt> and <tt>limit</tt>
+     * properties in the <code>options.params</code> property to establish the initial position within the
+     * dataset, and the number of Records to cache on each read from the Proxy.</li>
+     * <li>If using {@link #remoteSort remote sorting}, the configured <code>{@link #sortInfo}</code>
+     * will be automatically included with the posted parameters according to the specified
+     * <code>{@link #paramNames}</code>.</li>
+     * </ul></div>
+     * @param {Object} options An object containing properties which control loading options:<ul>
+     * <li><b><tt>params</tt></b> :Object<div class="sub-desc"><p>An object containing properties to pass as HTTP
+     * parameters to a remote data source. <b>Note</b>: <code>params</code> will override any
+     * <code>{@link #baseParams}</code> of the same name.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     * <li><b>callback</b> : Function<div class="sub-desc"><p>A function to be called after the Records
+     * have been loaded. The callback is called after the load event is fired, and is passed the following arguments:<ul>
+     * <li>r : Ext.data.Record[] An Array of Records loaded.</li>
+     * <li>options : Options object from the load call.</li>
+     * <li>success : Boolean success indicator.</li></ul></p></div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc"><p>Scope with which to call the callback (defaults
+     * to the Store object)</p></div></li>
+     * <li><b>add</b> : Boolean<div class="sub-desc"><p>Indicator to append loaded records rather than
+     * replace the current cache.  <b>Note</b>: see note for <tt>{@link #loadData}</tt></p></div></li>
+     * </ul>
+     * @return {Boolean} If the <i>developer</i> provided <tt>{@link #beforeload}</tt> event handler returns
+     * <tt>false</tt>, the load call will abort and will return <tt>false</tt>; otherwise will return <tt>true</tt>.
+     */
+    load : function(options) {
+        options = Ext.apply({}, options);
+        this.storeOptions(options);
+        if(this.sortInfo && this.remoteSort){
+            var pn = this.paramNames;
+            options.params = Ext.apply({}, options.params);
+            options.params[pn.sort] = this.sortInfo.field;
+            options.params[pn.dir] = this.sortInfo.direction;
+        }
+        try {
+            return this.execute('read', null, options); // <-- null represents rs.  No rs for load actions.
+        } catch(e) {
+            this.handleException(e);
+            return false;
+        }
+    },
+
+    /**
+     * updateRecord  Should not be used directly.  This method will be called automatically if a Writer is set.
+     * Listens to 'update' event.
+     * @param {Object} store
+     * @param {Object} record
+     * @param {Object} action
+     * @private
+     */
+    updateRecord : function(store, record, action) {
+        if (action == Ext.data.Record.EDIT && this.autoSave === true && (!record.phantom || (record.phantom && record.isValid()))) {
+            this.save();
+        }
+    },
+
+    /**
+     * @private
+     * Should not be used directly.  Store#add will call this automatically if a Writer is set
+     * @param {Object} store
+     * @param {Object} records
+     * @param {Object} index
+     */
+    createRecords : function(store, records, index) {
+        var modified = this.modified,
+            length   = records.length,
+            record, i;
+        
+        for (i = 0; i < length; i++) {
+            record = records[i];
+            
+            if (record.phantom && record.isValid()) {
+                record.markDirty();  // <-- Mark new records dirty (Ed: why?)
+                
+                if (modified.indexOf(record) == -1) {
+                    modified.push(record);
+                }
+            }
+        }
+        if (this.autoSave === true) {
+            this.save();
+        }
+    },
+
+    /**
+     * Destroys a Record.  Should not be used directly.  It's called by Store#remove if a Writer is set.
+     * @param {Store} store this
+     * @param {Ext.data.Record} record
+     * @param {Number} index
+     * @private
+     */
+    destroyRecord : function(store, record, index) {
+        if (this.modified.indexOf(record) != -1) {  // <-- handled already if @cfg pruneModifiedRecords == true
+            this.modified.remove(record);
+        }
+        if (!record.phantom) {
+            this.removed.push(record);
+
+            // since the record has already been removed from the store but the server request has not yet been executed,
+            // must keep track of the last known index this record existed.  If a server error occurs, the record can be
+            // put back into the store.  @see Store#createCallback where the record is returned when response status === false
+            record.lastIndex = index;
+
+            if (this.autoSave === true) {
+                this.save();
+            }
+        }
+    },
+
+    /**
+     * This method should generally not be used directly.  This method is called internally
+     * by {@link #load}, or if a Writer is set will be called automatically when {@link #add},
+     * {@link #remove}, or {@link #update} events fire.
+     * @param {String} action Action name ('read', 'create', 'update', or 'destroy')
+     * @param {Record/Record[]} rs
+     * @param {Object} options
+     * @throws Error
+     * @private
+     */
+    execute : function(action, rs, options, /* private */ batch) {
+        // blow up if action not Ext.data.CREATE, READ, UPDATE, DESTROY
+        if (!Ext.data.Api.isAction(action)) {
+            throw new Ext.data.Api.Error('execute', action);
+        }
+        // make sure options has a fresh, new params hash
+        options = Ext.applyIf(options||{}, {
+            params: {}
+        });
+        if(batch !== undefined){
+            this.addToBatch(batch);
+        }
+        // have to separate before-events since load has a different signature than create,destroy and save events since load does not
+        // include the rs (record resultset) parameter.  Capture return values from the beforeaction into doRequest flag.
+        var doRequest = true;
+
+        if (action === 'read') {
+            doRequest = this.fireEvent('beforeload', this, options);
+            Ext.applyIf(options.params, this.baseParams);
+        }
+        else {
+            // if Writer is configured as listful, force single-record rs to be [{}] instead of {}
+            // TODO Move listful rendering into DataWriter where the @cfg is defined.  Should be easy now.
+            if (this.writer.listful === true && this.restful !== true) {
+                rs = (Ext.isArray(rs)) ? rs : [rs];
+            }
+            // if rs has just a single record, shift it off so that Writer writes data as '{}' rather than '[{}]'
+            else if (Ext.isArray(rs) && rs.length == 1) {
+                rs = rs.shift();
+            }
+            // Write the action to options.params
+            if ((doRequest = this.fireEvent('beforewrite', this, action, rs, options)) !== false) {
+                this.writer.apply(options.params, this.baseParams, action, rs);
+            }
+        }
+        if (doRequest !== false) {
+            // Send request to proxy.
+            if (this.writer && this.proxy.url && !this.proxy.restful && !Ext.data.Api.hasUniqueUrl(this.proxy, action)) {
+                options.params.xaction = action;    // <-- really old, probaby unecessary.
+            }
+            // Note:  Up until this point we've been dealing with 'action' as a key from Ext.data.Api.actions.
+            // We'll flip it now and send the value into DataProxy#request, since it's the value which maps to
+            // the user's configured DataProxy#api
+            // TODO Refactor all Proxies to accept an instance of Ext.data.Request (not yet defined) instead of this looooooong list
+            // of params.  This method is an artifact from Ext2.
+            this.proxy.request(Ext.data.Api.actions[action], rs, options.params, this.reader, this.createCallback(action, rs, batch), this, options);
+        }
+        return doRequest;
+    },
+
+    /**
+     * Saves all pending changes to the store.  If the commensurate Ext.data.Api.actions action is not configured, then
+     * the configured <code>{@link #url}</code> will be used.
+     * <pre>
+     * change            url
+     * ---------------   --------------------
+     * removed records   Ext.data.Api.actions.destroy
+     * phantom records   Ext.data.Api.actions.create
+     * {@link #getModifiedRecords modified records}  Ext.data.Api.actions.update
+     * </pre>
+     * @TODO:  Create extensions of Error class and send associated Record with thrown exceptions.
+     * e.g.:  Ext.data.DataReader.Error or Ext.data.Error or Ext.data.DataProxy.Error, etc.
+     * @return {Number} batch Returns a number to uniquely identify the "batch" of saves occurring. -1 will be returned
+     * if there are no items to save or the save was cancelled.
+     */
+    save : function() {
+        if (!this.writer) {
+            throw new Ext.data.Store.Error('writer-undefined');
+        }
+
+        var queue = [],
+            len,
+            trans,
+            batch,
+            data = {},
+            i;
+        // DESTROY:  First check for removed records.  Records in this.removed are guaranteed non-phantoms.  @see Store#remove
+        if(this.removed.length){
+            queue.push(['destroy', this.removed]);
+        }
+
+        // Check for modified records. Use a copy so Store#rejectChanges will work if server returns error.
+        var rs = [].concat(this.getModifiedRecords());
+        if(rs.length){
+            // CREATE:  Next check for phantoms within rs.  splice-off and execute create.
+            var phantoms = [];
+            for(i = rs.length-1; i >= 0; i--){
+                if(rs[i].phantom === true){
+                    var rec = rs.splice(i, 1).shift();
+                    if(rec.isValid()){
+                        phantoms.push(rec);
+                    }
+                }else if(!rs[i].isValid()){ // <-- while we're here, splice-off any !isValid real records
+                    rs.splice(i,1);
+                }
+            }
+            // If we have valid phantoms, create them...
+            if(phantoms.length){
+                queue.push(['create', phantoms]);
+            }
+
+            // UPDATE:  And finally, if we're still here after splicing-off phantoms and !isValid real records, update the rest...
+            if(rs.length){
+                queue.push(['update', rs]);
+            }
+        }
+        len = queue.length;
+        if(len){
+            batch = ++this.batchCounter;
+            for(i = 0; i < len; ++i){
+                trans = queue[i];
+                data[trans[0]] = trans[1];
+            }
+            if(this.fireEvent('beforesave', this, data) !== false){
+                for(i = 0; i < len; ++i){
+                    trans = queue[i];
+                    this.doTransaction(trans[0], trans[1], batch);
+                }
+                return batch;
+            }
+        }
+        return -1;
+    },
+
+    // private.  Simply wraps call to Store#execute in try/catch.  Defers to Store#handleException on error.  Loops if batch: false
+    doTransaction : function(action, rs, batch) {
+        function transaction(records) {
+            try{
+                this.execute(action, records, undefined, batch);
+            }catch (e){
+                this.handleException(e);
+            }
+        }
+        if(this.batch === false){
+            for(var i = 0, len = rs.length; i < len; i++){
+                transaction.call(this, rs[i]);
+            }
+        }else{
+            transaction.call(this, rs);
+        }
+    },
+
+    // private
+    addToBatch : function(batch){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key];
+
+        if(!o){
+            b[key] = o = {
+                id: batch,
+                count: 0,
+                data: {}
+            };
+        }
+        ++o.count;
+    },
+
+    removeFromBatch : function(batch, action, data){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key],
+            arr;
+
+
+        if(o){
+            arr = o.data[action] || [];
+            o.data[action] = arr.concat(data);
+            if(o.count === 1){
+                data = o.data;
+                delete b[key];
+                this.fireEvent('save', this, batch, data);
+            }else{
+                --o.count;
+            }
+        }
+    },
+
+    // @private callback-handler for remote CRUD actions
+    // Do not override -- override loadRecords, onCreateRecords, onDestroyRecords and onUpdateRecords instead.
+    createCallback : function(action, rs, batch) {
+        var actions = Ext.data.Api.actions;
+        return (action == 'read') ? this.loadRecords : function(data, response, success) {
+            // calls: onCreateRecords | onUpdateRecords | onDestroyRecords
+            this['on' + Ext.util.Format.capitalize(action) + 'Records'](success, rs, [].concat(data));
+            // If success === false here, exception will have been called in DataProxy
+            if (success === true) {
+                this.fireEvent('write', this, action, data, response, rs);
+            }
+            this.removeFromBatch(batch, action, data);
+        };
+    },
+
+    // Clears records from modified array after an exception event.
+    // NOTE:  records are left marked dirty.  Do we want to commit them even though they were not updated/realized?
+    // TODO remove this method?
+    clearModified : function(rs) {
+        if (Ext.isArray(rs)) {
+            for (var n=rs.length-1;n>=0;n--) {
+                this.modified.splice(this.modified.indexOf(rs[n]), 1);
+            }
+        } else {
+            this.modified.splice(this.modified.indexOf(rs), 1);
+        }
+    },
+
+    // remap record ids in MixedCollection after records have been realized.  @see Store#onCreateRecords, @see DataReader#realize
+    reMap : function(record) {
+        if (Ext.isArray(record)) {
+            for (var i = 0, len = record.length; i < len; i++) {
+                this.reMap(record[i]);
+            }
+        } else {
+            delete this.data.map[record._phid];
+            this.data.map[record.id] = record;
+            var index = this.data.keys.indexOf(record._phid);
+            this.data.keys.splice(index, 1, record.id);
+            delete record._phid;
+        }
+    },
+
+    // @protected onCreateRecord proxy callback for create action
+    onCreateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.realize(rs, data);
+            }
+            catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#realize splices-off the rs until empty.
+                    this.onCreateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected, onUpdateRecords proxy callback for update action
+    onUpdateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.update(rs, data);
+            } catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#update splices-off the rs until empty.
+                    this.onUpdateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected onDestroyRecords proxy callback for destroy action
+    onDestroyRecords : function(success, rs, data) {
+        // splice each rec out of this.removed
+        rs = (rs instanceof Ext.data.Record) ? [rs] : [].concat(rs);
+        for (var i=0,len=rs.length;i<len;i++) {
+            this.removed.splice(this.removed.indexOf(rs[i]), 1);
+        }
+        if (success === false) {
+            // put records back into store if remote destroy fails.
+            // @TODO: Might want to let developer decide.
+            for (i=rs.length-1;i>=0;i--) {
+                this.insert(rs[i].lastIndex, rs[i]);    // <-- lastIndex set in Store#destroyRecord
+            }
+        }
+    },
+
+    // protected handleException.  Possibly temporary until Ext framework has an exception-handler.
+    handleException : function(e) {
+        // @see core/Error.js
+        Ext.handleError(e);
+    },
+
+    /**
+     * <p>Reloads the Record cache from the configured Proxy using the configured
+     * {@link Ext.data.Reader Reader} and the options from the last load operation
+     * performed.</p>
+     * <p><b>Note</b>: see the Important note in {@link #load}.</p>
+     * @param {Object} options <p>(optional) An <tt>Object</tt> containing
+     * {@link #load loading options} which may override the {@link #lastOptions options}
+     * used in the last {@link #load} operation. See {@link #load} for details
+     * (defaults to <tt>null</tt>, in which case the {@link #lastOptions} are
+     * used).</p>
+     * <br><p>To add new params to the existing params:</p><pre><code>
+lastOptions = myStore.lastOptions;
+Ext.apply(lastOptions.params, {
+    myNewParam: true
+});
+myStore.reload(lastOptions);
+     * </code></pre>
+     */
+    reload : function(options){
+        this.load(Ext.applyIf(options||{}, this.lastOptions));
+    },
+
+    // private
+    // Called as a callback by the Reader during a load operation.
+    loadRecords : function(o, options, success){
+        var i, len;
+        
+        if (this.isDestroyed === true) {
+            return;
+        }
+        if(!o || success === false){
+            if(success !== false){
+                this.fireEvent('load', this, [], options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope || this, [], options, false, o);
+            }
+            return;
+        }
+        var r = o.records, t = o.totalRecords || r.length;
+        if(!options || options.add !== true){
+            if(this.pruneModifiedRecords){
+                this.modified = [];
+            }
+            for(i = 0, len = r.length; i < len; i++){
+                r[i].join(this);
+            }
+            if(this.snapshot){
+                this.data = this.snapshot;
+                delete this.snapshot;
+            }
+            this.clearData();
+            this.data.addAll(r);
+            this.totalLength = t;
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }else{
+            var toAdd = [],
+                rec,
+                cnt = 0;
+            for(i = 0, len = r.length; i < len; ++i){
+                rec = r[i];
+                if(this.indexOfId(rec.id) > -1){
+                    this.doUpdate(rec);
+                }else{
+                    toAdd.push(rec);
+                    ++cnt;
+                }
+            }
+            this.totalLength = Math.max(t, this.data.length + cnt);
+            this.add(toAdd);
+        }
+        this.fireEvent('load', this, r, options);
+        if(options.callback){
+            options.callback.call(options.scope || this, r, options, true);
+        }
+    },
+
+    /**
+     * Loads data from a passed data block and fires the {@link #load} event. A {@link Ext.data.Reader Reader}
+     * which understands the format of the data must have been configured in the constructor.
+     * @param {Object} data The data block from which to read the Records.  The format of the data expected
+     * is dependent on the type of {@link Ext.data.Reader Reader} that is configured and should correspond to
+     * that {@link Ext.data.Reader Reader}'s <tt>{@link Ext.data.Reader#readRecords}</tt> parameter.
+     * @param {Boolean} append (Optional) <tt>true</tt> to append the new Records rather the default to replace
+     * the existing cache.
+     * <b>Note</b>: that Records in a Store are keyed by their {@link Ext.data.Record#id id}, so added Records
+     * with ids which are already present in the Store will <i>replace</i> existing Records. Only Records with
+     * new, unique ids will be added.
+     */
+    loadData : function(o, append){
+        var r = this.reader.readRecords(o);
+        this.loadRecords(r, {add: append}, true);
+    },
+
+    /**
+     * Gets the number of cached records.
+     * <p>If using paging, this may not be the total size of the dataset. If the data object
+     * used by the Reader contains the dataset size, then the {@link #getTotalCount} function returns
+     * the dataset size.  <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records in the Store's cache.
+     */
+    getCount : function(){
+        return this.data.length || 0;
+    },
+
+    /**
+     * Gets the total number of records in the dataset as returned by the server.
+     * <p>If using paging, for this to be accurate, the data object used by the {@link #reader Reader}
+     * must contain the dataset size. For remote data sources, the value for this property
+     * (<tt>totalProperty</tt> for {@link Ext.data.JsonReader JsonReader},
+     * <tt>totalRecords</tt> for {@link Ext.data.XmlReader XmlReader}) shall be returned by a query on the server.
+     * <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records as specified in the data object passed to the Reader
+     * by the Proxy.
+     * <p><b>Note</b>: this value is not updated when changing the contents of the Store locally.</p>
+     */
+    getTotalCount : function(){
+        return this.totalLength || 0;
+    },
+
+    /**
+     * Returns an object describing the current sort state of this Store.
+     * @return {Object} The sort state of the Store. An object with two properties:<ul>
+     * <li><b>field : String<p class="sub-desc">The name of the field by which the Records are sorted.</p></li>
+     * <li><b>direction : String<p class="sub-desc">The sort order, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul>
+     * See <tt>{@link #sortInfo}</tt> for additional details.
+     */
+    getSortState : function(){
+        return this.sortInfo;
+    },
+
+    /**
+     * @private
+     * Invokes sortData if we have sortInfo to sort on and are not sorting remotely
+     */
+    applySort : function(){
+        if ((this.sortInfo || this.multiSortInfo) && !this.remoteSort) {
+            this.sortData();
+        }
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting of data. This checks to see if we currently have a multi sort or not. It applies
+     * each sorter field/direction pair in turn by building an OR'ed master sorting function and running it against
+     * the full dataset
+     */
+    sortData : function() {
+        var sortInfo  = this.hasMultiSort ? this.multiSortInfo : this.sortInfo,
+            direction = sortInfo.direction || "ASC",
+            sorters   = sortInfo.sorters,
+            sortFns   = [];
+
+        //if we just have a single sorter, pretend it's the first in an array
+        if (!this.hasMultiSort) {
+            sorters = [{direction: direction, field: sortInfo.field}];
+        }
+
+        //create a sorter function for each sorter field/direction combo
+        for (var i=0, j = sorters.length; i < j; i++) {
+            sortFns.push(this.createSortFunction(sorters[i].field, sorters[i].direction));
+        }
+        
+        if (sortFns.length == 0) {
+            return;
+        }
+
+        //the direction modifier is multiplied with the result of the sorting functions to provide overall sort direction
+        //(as opposed to direction per field)
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        //create a function which ORs each sorter together to enable multi-sort
+        var fn = function(r1, r2) {
+          var result = sortFns[0].call(this, r1, r2);
+
+          //if we have more than one sorter, OR any additional sorter functions together
+          if (sortFns.length > 1) {
+              for (var i=1, j = sortFns.length; i < j; i++) {
+                  result = result || sortFns[i].call(this, r1, r2);
+              }
+          }
+
+          return directionModifier * result;
+        };
+
+        //sort the data
+        this.data.sort(direction, fn);
+        if (this.snapshot && this.snapshot != this.data) {
+            this.snapshot.sort(direction, fn);
+        }
+    },
+
+    /**
+     * @private
+     * Creates and returns a function which sorts an array by the given field and direction
+     * @param {String} field The field to create the sorter for
+     * @param {String} direction The direction to sort by (defaults to "ASC")
+     * @return {Function} A function which sorts by the field/direction combination provided
+     */
+    createSortFunction: function(field, direction) {
+        direction = direction || "ASC";
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        var sortType = this.fields.get(field).sortType;
+
+        //create a comparison function. Takes 2 records, returns 1 if record 1 is greater,
+        //-1 if record 2 is greater or 0 if they are equal
+        return function(r1, r2) {
+            var v1 = sortType(r1.data[field]),
+                v2 = sortType(r2.data[field]);
+
+            return directionModifier * (v1 > v2 ? 1 : (v1 < v2 ? -1 : 0));
+        };
+    },
+
+    /**
+     * Sets the default sort column and order to be used by the next {@link #load} operation.
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    setDefaultSort : function(field, dir) {
+        dir = dir ? dir.toUpperCase() : 'ASC';
+        this.sortInfo = {field: field, direction: dir};
+        this.sortToggle[field] = dir;
+    },
+
+    /**
+     * Sort the Records.
+     * If remote sorting is used, the sort is performed on the server, and the cache is reloaded. If local
+     * sorting is used, the cache is sorted internally. See also {@link #remoteSort} and {@link #paramNames}.
+     * This function accepts two call signatures - pass in a field name as the first argument to sort on a single
+     * field, or pass in an array of sort configuration objects to sort by multiple fields.
+     * Single sort example:
+     * store.sort('name', 'ASC');
+     * Multi sort example:
+     * store.sort([
+     *   {
+     *     field    : 'name',
+     *     direction: 'ASC'
+     *   },
+     *   {
+     *     field    : 'salary',
+     *     direction: 'DESC'
+     *   }
+     * ], 'ASC');
+     * In this second form, the sort configs are applied in order, with later sorters sorting within earlier sorters' results.
+     * For example, if two records with the same name are present they will also be sorted by salary if given the sort configs
+     * above. Any number of sort configs can be added.
+     * @param {String/Array} fieldName The name of the field to sort by, or an array of ordered sort configs
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    sort : function(fieldName, dir) {
+        if (Ext.isArray(arguments[0])) {
+            return this.multiSort.call(this, fieldName, dir);
+        } else {
+            return this.singleSort(fieldName, dir);
+        }
+    },
+
+    /**
+     * Sorts the store contents by a single field and direction. This is called internally by {@link sort} and would
+     * not usually be called manually
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    singleSort: function(fieldName, dir) {
+        var field = this.fields.get(fieldName);
+        if (!field) {
+            return false;
+        }
+
+        var name       = field.name,
+            sortInfo   = this.sortInfo || null,
+            sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+        if (!dir) {
+            if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+            } else {
+                dir = field.sortDir;
+            }
+        }
+
+        this.sortToggle[name] = dir;
+        this.sortInfo = {field: name, direction: dir};
+        this.hasMultiSort = false;
+
+        if (this.remoteSort) {
+            if (!this.load(this.lastOptions)) {
+                if (sortToggle) {
+                    this.sortToggle[name] = sortToggle;
+                }
+                if (sortInfo) {
+                    this.sortInfo = sortInfo;
+                }
+            }
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+        return true;
+    },
+
+    /**
+     * Sorts the contents of this store by multiple field/direction sorters. This is called internally by {@link sort}
+     * and would not usually be called manually.
+     * Multi sorting only currently applies to local datasets - multiple sort data is not currently sent to a proxy
+     * if remoteSort is used.
+     * @param {Array} sorters Array of sorter objects (field and direction)
+     * @param {String} direction Overall direction to sort the ordered results by (defaults to "ASC")
+     */
+    multiSort: function(sorters, direction) {
+        this.hasMultiSort = true;
+        direction = direction || "ASC";
+
+        //toggle sort direction
+        if (this.multiSortInfo && direction == this.multiSortInfo.direction) {
+            direction = direction.toggle("ASC", "DESC");
+        }
+
+        /**
+         * Object containing overall sort direction and an ordered array of sorter configs used when sorting on multiple fields
+         * @property multiSortInfo
+         * @type Object
+         */
+        this.multiSortInfo = {
+            sorters  : sorters,
+            direction: direction
+        };
+        
+        if (this.remoteSort) {
+            this.singleSort(sorters[0].field, sorters[0].direction);
+
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Calls the specified function for each of the {@link Ext.data.Record Records} in the cache.
+     * @param {Function} fn The function to call. The {@link Ext.data.Record Record} is passed as the first parameter.
+     * Returning <tt>false</tt> aborts and exits the iteration.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed.
+     * Defaults to the current {@link Ext.data.Record Record} in the iteration.
+     */
+    each : function(fn, scope){
+        this.data.each(fn, scope);
+    },
+
+    /**
+     * Gets all {@link Ext.data.Record records} modified since the last commit.  Modified records are
+     * persisted across load operations (e.g., during paging). <b>Note</b>: deleted records are not
+     * included.  See also <tt>{@link #pruneModifiedRecords}</tt> and
+     * {@link Ext.data.Record}<tt>{@link Ext.data.Record#markDirty markDirty}.</tt>.
+     * @return {Ext.data.Record[]} An array of {@link Ext.data.Record Records} containing outstanding
+     * modifications.  To obtain modified fields within a modified record see
+     *{@link Ext.data.Record}<tt>{@link Ext.data.Record#modified modified}.</tt>.
+     */
+    getModifiedRecords : function(){
+        return this.modified;
+    },
+
+    /**
+     * Sums the value of <tt>property</tt> for each {@link Ext.data.Record record} between <tt>start</tt>
+     * and <tt>end</tt> and returns the result.
+     * @param {String} property A field in each record
+     * @param {Number} start (optional) The record index to start at (defaults to <tt>0</tt>)
+     * @param {Number} end (optional) The last record index to include (defaults to length - 1)
+     * @return {Number} The sum
+     */
+    sum : function(property, start, end){
+        var rs = this.data.items, v = 0;
+        start = start || 0;
+        end = (end || end === 0) ? end : rs.length-1;
+
+        for(var i = start; i <= end; i++){
+            v += (rs[i].data[property] || 0);
+        }
+        return v;
+    },
+
+    /**
+     * @private
+     * Returns a filter function used to test a the given property's value. Defers most of the work to
+     * Ext.util.MixedCollection's createValueMatcher function
+     * @param {String} property The property to create the filter function for
+     * @param {String/RegExp} value The string/regex to compare the property value to
+     * @param {Boolean} anyMatch True if we don't care if the filter value is not the full value (defaults to false)
+     * @param {Boolean} caseSensitive True to create a case-sensitive regex (defaults to false)
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createFilterFn : function(property, value, anyMatch, caseSensitive, exactMatch){
+        if(Ext.isEmpty(value, false)){
+            return false;
+        }
+        value = this.data.createValueMatcher(value, anyMatch, caseSensitive, exactMatch);
+        return function(r) {
+            return value.test(r.data[property]);
+        };
+    },
+
+    /**
+     * @private
+     * Given an array of filter functions (each with optional scope), constructs and returns a single function that returns
+     * the result of all of the filters ANDed together
+     * @param {Array} filters The array of filter objects (each object should contain an 'fn' and optional scope)
+     * @return {Function} The multiple filter function
+     */
+    createMultipleFilterFn: function(filters) {
+        return function(record) {
+            var isMatch = true;
+
+            for (var i=0, j = filters.length; i < j; i++) {
+                var filter = filters[i],
+                    fn     = filter.fn,
+                    scope  = filter.scope;
+
+                isMatch = isMatch && fn.call(scope, record);
+            }
+
+            return isMatch;
+        };
+    },
+
+    /**
+     * Filter the {@link Ext.data.Record records} by a specified property. Alternatively, pass an array of filter
+     * options to filter by more than one property.
+     * Single filter example:
+     * store.filter('name', 'Ed', true, true); //finds all records containing the substring 'Ed'
+     * Multiple filter example:
+     * <pre><code>
+     * store.filter([
+     *   {
+     *     property     : 'name',
+     *     value        : 'Ed',
+     *     anyMatch     : true, //optional, defaults to true
+     *     caseSensitive: true  //optional, defaults to true
+     *   },
+     *
+     *   //filter functions can also be passed
+     *   {
+     *     fn   : function(record) {
+     *       return record.get('age') == 24
+     *     },
+     *     scope: this
+     *   }
+     * ]);
+     * </code></pre>
+     * @param {String|Array} field A field on your records, or an array containing multiple filter options
+     * @param {String/RegExp} value Either a string that the field should begin with, or a RegExp to test
+     * against the field.
+     * @param {Boolean} anyMatch (optional) <tt>true</tt> to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) <tt>true</tt> for case sensitive comparison
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    filter : function(property, value, anyMatch, caseSensitive, exactMatch){
+        var fn;
+        //we can accept an array of filter objects, or a single filter object - normalize them here
+        if (Ext.isObject(property)) {
+            property = [property];
+        }
+
+        if (Ext.isArray(property)) {
+            var filters = [];
+
+            //normalize the filters passed into an array of filter functions
+            for (var i=0, j = property.length; i < j; i++) {
+                var filter = property[i],
+                    func   = filter.fn,
+                    scope  = filter.scope || this;
+
+                //if we weren't given a filter function, construct one now
+                if (!Ext.isFunction(func)) {
+                    func = this.createFilterFn(filter.property, filter.value, filter.anyMatch, filter.caseSensitive, filter.exactMatch);
+                }
+
+                filters.push({fn: func, scope: scope});
+            }
+
+            fn = this.createMultipleFilterFn(filters);
+        } else {
+            //classic single property filter
+            fn = this.createFilterFn(property, value, anyMatch, caseSensitive, exactMatch);
+        }
+
+        return fn ? this.filterBy(fn) : this.clearFilter();
+    },
+
+    /**
+     * Filter by a function. The specified function will be called for each
+     * Record in this Store. If the function returns <tt>true</tt> the Record is included,
+     * otherwise it is filtered out.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     */
+    filterBy : function(fn, scope){
+        this.snapshot = this.snapshot || this.data;
+        this.data = this.queryBy(fn, scope || this);
+        this.fireEvent('datachanged', this);
+    },
+
+    /**
+     * Revert to a view of the Record cache with no filtering applied.
+     * @param {Boolean} suppressEvent If <tt>true</tt> the filter is cleared silently without firing the
+     * {@link #datachanged} event.
+     */
+    clearFilter : function(suppressEvent){
+        if(this.isFiltered()){
+            this.data = this.snapshot;
+            delete this.snapshot;
+            if(suppressEvent !== true){
+                this.fireEvent('datachanged', this);
+            }
+        }
+    },
+
+    /**
+     * Returns true if this store is currently filtered
+     * @return {Boolean}
+     */
+    isFiltered : function(){
+        return !!this.snapshot && this.snapshot != this.data;
+    },
+
+    /**
+     * Query the records by a specified property.
+     * @param {String} field A field on your records
+     * @param {String/RegExp} value Either a string that the field
+     * should begin with, or a RegExp to test against the field.
+     * @param {Boolean} anyMatch (optional) True to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     */
+    query : function(property, value, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.queryBy(fn) : this.data.clone();
+    },
+
+    /**
+     * Query the cached records in this Store using a filtering function. The specified function
+     * will be called with each record in this Store. If the function returns <tt>true</tt> the record is
+     * included in the results.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     **/
+    queryBy : function(fn, scope){
+        var data = this.snapshot || this.data;
+        return data.filterBy(fn, scope||this);
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {String/RegExp} value Either a string that the field value
+     * should begin with, or a RegExp to test against the field.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {Number} The matched index or -1
+     */
+    find : function(property, value, start, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.data.findIndexBy(fn, null, start) : -1;
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {Mixed} value The value to match the field against.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findExact: function(property, value, start){
+        return this.data.findIndexBy(function(rec){
+            return rec.get(property) === value;
+        }, this, start);
+    },
+
+    /**
+     * Find the index of the first matching Record in this Store by a function.
+     * If the function returns <tt>true</tt> it is considered a match.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findBy : function(fn, scope, start){
+        return this.data.findIndexBy(fn, scope, start);
+    },
+
+    /**
+     * Collects unique values for a particular dataIndex from this store.
+     * @param {String} dataIndex The property to collect
+     * @param {Boolean} allowNull (optional) Pass true to allow null, undefined or empty string values
+     * @param {Boolean} bypassFilter (optional) Pass true to collect from all records, even ones which are filtered
+     * @return {Array} An array of the unique values
+     **/
+    collect : function(dataIndex, allowNull, bypassFilter){
+        var d = (bypassFilter === true && this.snapshot) ?
+                this.snapshot.items : this.data.items;
+        var v, sv, r = [], l = {};
+        for(var i = 0, len = d.length; i < len; i++){
+            v = d[i].data[dataIndex];
+            sv = String(v);
+            if((allowNull || !Ext.isEmpty(v)) && !l[sv]){
+                l[sv] = true;
+                r[r.length] = v;
+            }
+        }
+        return r;
+    },
+
+    // private
+    afterEdit : function(record){
+        if(this.modified.indexOf(record) == -1){
+            this.modified.push(record);
+        }
+        this.fireEvent('update', this, record, Ext.data.Record.EDIT);
+    },
+
+    // private
+    afterReject : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.REJECT);
+    },
+
+    // private
+    afterCommit : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Commit all Records with {@link #getModifiedRecords outstanding changes}. To handle updates for changes,
+     * subscribe to the Store's {@link #update update event}, and perform updating when the third parameter is
+     * Ext.data.Record.COMMIT.
+     */
+    commitChanges : function(){
+        var modified = this.modified.slice(0),
+            length   = modified.length,
+            i;
+            
+        for (i = 0; i < length; i++){
+            modified[i].commit();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    /**
+     * {@link Ext.data.Record#reject Reject} outstanding changes on all {@link #getModifiedRecords modified records}.
+     */
+    rejectChanges : function() {
+        var modified = this.modified.slice(0),
+            removed  = this.removed.slice(0).reverse(),
+            mLength  = modified.length,
+            rLength  = removed.length,
+            i;
+        
+        for (i = 0; i < mLength; i++) {
+            modified[i].reject();
+        }
+        
+        for (i = 0; i < rLength; i++) {
+            this.insert(removed[i].lastIndex || 0, removed[i]);
+            removed[i].reject();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    // private
+    onMetaChange : function(meta){
+        this.recordType = this.reader.recordType;
+        this.fields = this.recordType.prototype.fields;
+        delete this.snapshot;
+        if(this.reader.meta.sortInfo){
+            this.sortInfo = this.reader.meta.sortInfo;
+        }else if(this.sortInfo  && !this.fields.get(this.sortInfo.field)){
+            delete this.sortInfo;
+        }
+        if(this.writer){
+            this.writer.meta = this.reader.meta;
+        }
+        this.modified = [];
+        this.fireEvent('metachange', this, this.reader.meta);
+    },
+
+    // private
+    findInsertIndex : function(record){
+        this.suspendEvents();
+        var data = this.data.clone();
+        this.data.add(record);
+        this.applySort();
+        var index = this.data.indexOf(record);
+        this.data = data;
+        this.resumeEvents();
+        return index;
+    },
+
+    /**
+     * Set the value for a property name in this store's {@link #baseParams}.  Usage:</p><pre><code>
+myStore.setBaseParam('foo', {bar:3});
+</code></pre>
+     * @param {String} name Name of the property to assign
+     * @param {Mixed} value Value to assign the <tt>name</tt>d property
+     **/
+    setBaseParam : function (name, value){
+        this.baseParams = this.baseParams || {};
+        this.baseParams[name] = value;
+    }
+});
+
+Ext.reg('store', Ext.data.Store);
+
+/**
+ * @class Ext.data.Store.Error
+ * @extends Ext.Error
+ * Store Error extension.
+ * @param {String} name
+ */
+Ext.data.Store.Error = Ext.extend(Ext.Error, {
+    name: 'Ext.data.Store'
+});
+Ext.apply(Ext.data.Store.Error.prototype, {
+    lang: {
+        'writer-undefined' : 'Attempted to execute a write-action without a DataWriter installed.'
+    }
+});
+/**
+ * @class Ext.data.Field
+ * <p>This class encapsulates the field definition information specified in the field definition objects
+ * passed to {@link Ext.data.Record#create}.</p>
+ * <p>Developers do not need to instantiate this class. Instances are created by {@link Ext.data.Record.create}
+ * and cached in the {@link Ext.data.Record#fields fields} property of the created Record constructor's <b>prototype.</b></p>
+ */
+Ext.data.Field = Ext.extend(Object, {
+    
+    constructor : function(config){
+        if(Ext.isString(config)){
+            config = {name: config};
+        }
+        Ext.apply(this, config);
+        
+        var types = Ext.data.Types,
+            st = this.sortType,
+            t;
+
+        if(this.type){
+            if(Ext.isString(this.type)){
+                this.type = Ext.data.Types[this.type.toUpperCase()] || types.AUTO;
+            }
+        }else{
+            this.type = types.AUTO;
+        }
+
+        // named sortTypes are supported, here we look them up
+        if(Ext.isString(st)){
+            this.sortType = Ext.data.SortTypes[st];
+        }else if(Ext.isEmpty(st)){
+            this.sortType = this.type.sortType;
+        }
+
+        if(!this.convert){
+            this.convert = this.type.convert;
+        }
+    },
+    
+    /**
+     * @cfg {String} name
+     * The name by which the field is referenced within the Record. This is referenced by, for example,
+     * the <code>dataIndex</code> property in column definition objects passed to {@link Ext.grid.ColumnModel}.
+     * <p>Note: In the simplest case, if no properties other than <code>name</code> are required, a field
+     * definition may consist of just a String for the field name.</p>
+     */
+    /**
+     * @cfg {Mixed} type
+     * (Optional) The data type for automatic conversion from received data to the <i>stored</i> value if <code>{@link Ext.data.Field#convert convert}</code>
+     * has not been specified. This may be specified as a string value. Possible values are
+     * <div class="mdetail-params"><ul>
+     * <li>auto (Default, implies no conversion)</li>
+     * <li>string</li>
+     * <li>int</li>
+     * <li>float</li>
+     * <li>boolean</li>
+     * <li>date</li></ul></div>
+     * <p>This may also be specified by referencing a member of the {@link Ext.data.Types} class.</p>
+     * <p>Developers may create their own application-specific data types by defining new members of the
+     * {@link Ext.data.Types} class.</p>
+     */
+    /**
+     * @cfg {Function} convert
+     * (Optional) A function which converts the value provided by the Reader into an object that will be stored
+     * in the Record. It is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+     * the configured <code>{@link Ext.data.Field#defaultValue defaultValue}</code>.</div></li>
+     * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+     * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+     *  ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+     * </ul></div>
+     * <pre><code>
+// example of convert function
+function fullName(v, record){
+    return record.name.last + ', ' + record.name.first;
+}
+
+function location(v, record){
+    return !record.city ? '' : (record.city + ', ' + record.state);
+}
+
+var Dude = Ext.data.Record.create([
+    {name: 'fullname',  convert: fullName},
+    {name: 'firstname', mapping: 'name.first'},
+    {name: 'lastname',  mapping: 'name.last'},
+    {name: 'city', defaultValue: 'homeless'},
+    'state',
+    {name: 'location',  convert: location}
+]);
+
+// create the data store
+var store = new Ext.data.Store({
+    reader: new Ext.data.JsonReader(
+        {
+            idProperty: 'key',
+            root: 'daRoot',
+            totalProperty: 'total'
+        },
+        Dude  // recordType
+    )
+});
+
+var myData = [
+    { key: 1,
+      name: { first: 'Fat',    last:  'Albert' }
+      // notice no city, state provided in data object
+    },
+    { key: 2,
+      name: { first: 'Barney', last:  'Rubble' },
+      city: 'Bedrock', state: 'Stoneridge'
+    },
+    { key: 3,
+      name: { first: 'Cliff',  last:  'Claven' },
+      city: 'Boston',  state: 'MA'
+    }
+];
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} dateFormat
+     * <p>(Optional) Used when converting received data into a Date when the {@link #type} is specified as <code>"date"</code>.</p>
+     * <p>A format string for the {@link Date#parseDate Date.parseDate} function, or "timestamp" if the
+     * value provided by the Reader is a UNIX timestamp, or "time" if the value provided by the Reader is a
+     * javascript millisecond timestamp. See {@link Date}</p>
+     */
+    dateFormat: null,
+    
+    /**
+     * @cfg {Boolean} useNull
+     * <p>(Optional) Use when converting received data into a Number type (either int or float). If the value cannot be parsed,
+     * null will be used if useNull is true, otherwise the value will be 0. Defaults to <tt>false</tt>
+     */
+    useNull: false,
+    
+    /**
+     * @cfg {Mixed} defaultValue
+     * (Optional) The default value used <b>when a Record is being created by a {@link Ext.data.Reader Reader}</b>
+     * when the item referenced by the <code>{@link Ext.data.Field#mapping mapping}</code> does not exist in the data
+     * object (i.e. undefined). (defaults to "")
+     */
+    defaultValue: "",
+    /**
+     * @cfg {String/Number} mapping
+     * <p>(Optional) A path expression for use by the {@link Ext.data.DataReader} implementation
+     * that is creating the {@link Ext.data.Record Record} to extract the Field value from the data object.
+     * If the path expression is the same as the field name, the mapping may be omitted.</p>
+     * <p>The form of the mapping expression depends on the Reader being used.</p>
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.data.JsonReader}<div class="sub-desc">The mapping is a string containing the javascript
+     * expression to reference the data from an element of the data item's {@link Ext.data.JsonReader#root root} Array. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.XmlReader}<div class="sub-desc">The mapping is an {@link Ext.DomQuery} path to the data
+     * item relative to the DOM element that represents the {@link Ext.data.XmlReader#record record}. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.ArrayReader}<div class="sub-desc">The mapping is a number indicating the Array index
+     * of the field's value. Defaults to the field specification's Array position.</div></li>
+     * </ul></div>
+     * <p>If a more complex value extraction strategy is required, then configure the Field with a {@link #convert}
+     * function. This is passed the whole row object, and may interrogate it in whatever way is necessary in order to
+     * return the desired data.</p>
+     */
+    mapping: null,
+    /**
+     * @cfg {Function} sortType
+     * (Optional) A function which converts a Field's value to a comparable value in order to ensure
+     * correct sort ordering. Predefined functions are provided in {@link Ext.data.SortTypes}. A custom
+     * sort example:<pre><code>
+// current sort     after sort we want
+// +-+------+          +-+------+
+// |1|First |          |1|First |
+// |2|Last  |          |3|Second|
+// |3|Second|          |2|Last  |
+// +-+------+          +-+------+
+
+sortType: function(value) {
+   switch (value.toLowerCase()) // native toLowerCase():
+   {
+      case 'first': return 1;
+      case 'second': return 2;
+      default: return 3;
+   }
+}
+     * </code></pre>
+     */
+    sortType : null,
+    /**
+     * @cfg {String} sortDir
+     * (Optional) Initial direction to sort (<code>"ASC"</code> or  <code>"DESC"</code>).  Defaults to
+     * <code>"ASC"</code>.
+     */
+    sortDir : "ASC",
+    /**
+     * @cfg {Boolean} allowBlank
+     * (Optional) Used for validating a {@link Ext.data.Record record}, defaults to <code>true</code>.
+     * An empty value here will cause {@link Ext.data.Record}.{@link Ext.data.Record#isValid isValid}
+     * to evaluate to <code>false</code>.
+     */
+    allowBlank : true
+});
+/**
+ * @class Ext.data.DataReader
+ * Abstract base class for reading structured data from a data source and converting
+ * it into an object containing {@link Ext.data.Record} objects and metadata for use
+ * by an {@link Ext.data.Store}.  This class is intended to be extended and should not
+ * be created directly. For existing implementations, see {@link Ext.data.ArrayReader},
+ * {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}.
+ * @constructor Create a new DataReader
+ * @param {Object} meta Metadata configuration options (implementation-specific).
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created using {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.DataReader = function(meta, recordType){
+    /**
+     * This DataReader's configured metadata as passed to the constructor.
+     * @type Mixed
+     * @property meta
+     */
+    this.meta = meta;
+    /**
+     * @cfg {Array/Object} fields
+     * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+     * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+     * constructor created from {@link Ext.data.Record#create}.</p>
+     */
+    this.recordType = Ext.isArray(recordType) ?
+        Ext.data.Record.create(recordType) : recordType;
+
+    // if recordType defined make sure extraction functions are defined
+    if (this.recordType){
+        this.buildExtractors();
+    }
+};
+
+Ext.data.DataReader.prototype = {
+    /**
+     * @cfg {String} messageProperty [undefined] Optional name of a property within a server-response that represents a user-feedback message.
+     */
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getTotal: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getRoot: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getMessage: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getSuccess: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getId: Ext.emptyFn,
+    /**
+     * Abstract method, overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    buildExtractors : Ext.emptyFn,
+    /**
+     * Abstract method overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    extractValues : Ext.emptyFn,
+
+    /**
+     * Used for un-phantoming a record after a successful database insert.  Sets the records pk along with new data from server.
+     * You <b>must</b> return at least the database pk using the idProperty defined in your DataReader configuration.  The incoming
+     * data from server will be merged with the data in the local record.
+     * In addition, you <b>must</b> return record-data from the server in the same order received.
+     * Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be suppressed.
+     * @param {Record/Record[]} record The phantom record to be realized.
+     * @param {Object/Object[]} data The new record data to apply.  Must include the primary-key from database defined in idProperty field.
+     */
+    realize: function(rs, data){
+        if (Ext.isArray(rs)) {
+            for (var i = rs.length - 1; i >= 0; i--) {
+                // recurse
+                if (Ext.isArray(data)) {
+                    this.realize(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole invalid data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.realize(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (!this.isData(data)) {
+                // TODO: Let exception-handler choose to commit or not rather than blindly rs.commit() here.
+                //rs.commit();
+                throw new Ext.data.DataReader.Error('realize', rs);
+            }
+            rs.phantom = false; // <-- That's what it's all about
+            rs._phid = rs.id;  // <-- copy phantom-id -> _phid, so we can remap in Store#onCreateRecords
+            rs.id = this.getId(data);
+            rs.data = data;
+
+            rs.commit();
+            rs.store.reMap(rs);
+        }
+    },
+
+    /**
+     * Used for updating a non-phantom or "real" record's data with fresh data from server after remote-save.
+     * If returning data from multiple-records after a batch-update, you <b>must</b> return record-data from the server in
+     * the same order received.  Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be
+     * suppressed as the record receives fresh new data-hash
+     * @param {Record/Record[]} rs
+     * @param {Object/Object[]} data
+     */
+    update : function(rs, data) {
+        if (Ext.isArray(rs)) {
+            for (var i=rs.length-1; i >= 0; i--) {
+                if (Ext.isArray(data)) {
+                    this.update(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.update(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (this.isData(data)) {
+                rs.data = Ext.apply(rs.data, data);
+            }
+            rs.commit();
+        }
+    },
+
+    /**
+     * returns extracted, type-cast rows of data.  Iterates to call #extractValues for each row
+     * @param {Object[]/Object} data-root from server response
+     * @param {Boolean} returnRecords [false] Set true to return instances of Ext.data.Record
+     * @private
+     */
+    extractData : function(root, returnRecords) {
+        // A bit ugly this, too bad the Record's raw data couldn't be saved in a common property named "raw" or something.
+        var rawName = (this instanceof Ext.data.JsonReader) ? 'json' : 'node';
+
+        var rs = [];
+
+        // Had to add Check for XmlReader, #isData returns true if root is an Xml-object.  Want to check in order to re-factor
+        // #extractData into DataReader base, since the implementations are almost identical for JsonReader, XmlReader
+        if (this.isData(root) && !(this instanceof Ext.data.XmlReader)) {
+            root = [root];
+        }
+        var f       = this.recordType.prototype.fields,
+            fi      = f.items,
+            fl      = f.length,
+            rs      = [];
+        if (returnRecords === true) {
+            var Record = this.recordType;
+            for (var i = 0; i < root.length; i++) {
+                var n = root[i];
+                var record = new Record(this.extractValues(n, fi, fl), this.getId(n));
+                record[rawName] = n;    // <-- There's implementation of ugly bit, setting the raw record-data.
+                rs.push(record);
+            }
+        }
+        else {
+            for (var i = 0; i < root.length; i++) {
+                var data = this.extractValues(root[i], fi, fl);
+                data[this.meta.idProperty] = this.getId(root[i]);
+                rs.push(data);
+            }
+        }
+        return rs;
+    },
+
+    /**
+     * Returns true if the supplied data-hash <b>looks</b> and quacks like data.  Checks to see if it has a key
+     * corresponding to idProperty defined in your DataReader config containing non-empty pk.
+     * @param {Object} data
+     * @return {Boolean}
+     */
+    isData : function(data) {
+        return (data && Ext.isObject(data) && !Ext.isEmpty(this.getId(data))) ? true : false;
+    },
+
+    // private function a store will createSequence upon
+    onMetaChange : function(meta){
+        delete this.ef;
+        this.meta = meta;
+        this.recordType = Ext.data.Record.create(meta.fields);
+        this.buildExtractors();
+    }
+};
+
+/**
+ * @class Ext.data.DataReader.Error
+ * @extends Ext.Error
+ * General error class for Ext.data.DataReader
+ */
+Ext.data.DataReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataReader'
+});
+Ext.apply(Ext.data.DataReader.Error.prototype, {
+    lang : {
+        'update': "#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",
+        'realize': "#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.",
+        'invalid-response': "#readResponse received an invalid response from the server."
+    }
+});
+/**
+ * @class Ext.data.DataWriter
+ * <p>Ext.data.DataWriter facilitates create, update, and destroy actions between
+ * an Ext.data.Store and a server-side framework. A Writer enabled Store will
+ * automatically manage the Ajax requests to perform CRUD actions on a Store.</p>
+ * <p>Ext.data.DataWriter is an abstract base class which is intended to be extended
+ * and should not be created directly. For existing implementations, see
+ * {@link Ext.data.JsonWriter}.</p>
+ * <p>Creating a writer is simple:</p>
+ * <pre><code>
+var writer = new Ext.data.JsonWriter({
+    encode: false   // &lt;--- false causes data to be printed to jsonData config-property of Ext.Ajax#reqeust
+});
+ * </code></pre>
+ * * <p>Same old JsonReader as Ext-2.x:</p>
+ * <pre><code>
+var reader = new Ext.data.JsonReader({idProperty: 'id'}, [{name: 'first'}, {name: 'last'}, {name: 'email'}]);
+ * </code></pre>
+ *
+ * <p>The proxy for a writer enabled store can be configured with a simple <code>url</code>:</p>
+ * <pre><code>
+// Create a standard HttpProxy instance.
+var proxy = new Ext.data.HttpProxy({
+    url: 'app.php/users'    // &lt;--- Supports "provides"-type urls, such as '/users.json', '/products.xml' (Hello Rails/Merb)
+});
+ * </code></pre>
+ * <p>For finer grained control, the proxy may also be configured with an <code>API</code>:</p>
+ * <pre><code>
+// Maximum flexibility with the API-configuration
+var proxy = new Ext.data.HttpProxy({
+    api: {
+        read    : 'app.php/users/read',
+        create  : 'app.php/users/create',
+        update  : 'app.php/users/update',
+        destroy : {  // &lt;--- Supports object-syntax as well
+            url: 'app.php/users/destroy',
+            method: "DELETE"
+        }
+    }
+});
+ * </code></pre>
+ * <p>Pulling it all together into a Writer-enabled Store:</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: true  // -- Cell-level updates.
+});
+ * </code></pre>
+ * <p>Initiating write-actions <b>automatically</b>, using the existing Ext2.0 Store/Record API:</p>
+ * <pre><code>
+var rec = store.getAt(0);
+rec.set('email', 'foo@bar.com');  // &lt;--- Immediately initiates an UPDATE action through configured proxy.
+
+store.remove(rec);  // &lt;---- Immediately initiates a DESTROY action through configured proxy.
+ * </code></pre>
+ * <p>For <b>record/batch</b> updates, use the Store-configuration {@link Ext.data.Store#autoSave autoSave:false}</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: false  // -- disable cell-updates
+});
+
+var urec = store.getAt(0);
+urec.set('email', 'foo@bar.com');
+
+var drec = store.getAt(1);
+store.remove(drec);
+
+// Push the button!
+store.save();
+ * </code></pre>
+ * @constructor Create a new DataWriter
+ * @param {Object} meta Metadata configuration options (implementation-specific)
+ * @param {Object} recordType Either an Array of field definition objects as specified
+ * in {@link Ext.data.Record#create}, or an {@link Ext.data.Record} object created
+ * using {@link Ext.data.Record#create}.
+ */
+Ext.data.DataWriter = function(config){
+    Ext.apply(this, config);
+};
+Ext.data.DataWriter.prototype = {
+
+    /**
+     * @cfg {Boolean} writeAllFields
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have DataWriter return ALL fields of a modified
+     * record -- not just those that changed.
+     * <tt>false</tt> to have DataWriter only request modified fields from a record.
+     */
+    writeAllFields : false,
+    /**
+     * @cfg {Boolean} listful
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have the DataWriter <b>always</b> write HTTP params as a list,
+     * even when acting upon a single record.
+     */
+    listful : false,    // <-- listful is actually not used internally here in DataWriter.  @see Ext.data.Store#execute.
+
+    /**
+     * Compiles a Store recordset into a data-format defined by an extension such as {@link Ext.data.JsonWriter} or {@link Ext.data.XmlWriter} in preparation for a {@link Ext.data.Api#actions server-write action}.  The first two params are similar similar in nature to {@link Ext#apply},
+     * Where the first parameter is the <i>receiver</i> of paramaters and the second, baseParams, <i>the source</i>.
+     * @param {Object} params The request-params receiver.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {String} action [{@link Ext.data.Api#actions create|update|destroy}]
+     * @param {Record/Record[]} rs The recordset to write, the subject(s) of the write action.
+     */
+    apply : function(params, baseParams, action, rs) {
+        var data    = [],
+        renderer    = action + 'Record';
+        // TODO implement @cfg listful here
+        if (Ext.isArray(rs)) {
+            Ext.each(rs, function(rec){
+                data.push(this[renderer](rec));
+            }, this);
+        }
+        else if (rs instanceof Ext.data.Record) {
+            data = this[renderer](rs);
+        }
+        this.render(params, baseParams, data);
+    },
+
+    /**
+     * abstract method meant to be overridden by all DataWriter extensions.  It's the extension's job to apply the "data" to the "params".
+     * The data-object provided to render is populated with data according to the meta-info defined in the user's DataReader config,
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Record[]} rs Store recordset
+     * @param {Object} params Http params to be sent to server.
+     * @param {Object} data object populated according to DataReader meta-data.
+     */
+    render : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} updateRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#updateRecord JsonWriter.updateRecord}
+     */
+    updateRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} createRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#createRecord JsonWriter.createRecord})
+     */
+    createRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} destroyRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#destroyRecord JsonWriter.destroyRecord})
+     */
+    destroyRecord : Ext.emptyFn,
+
+    /**
+     * Converts a Record to a hash, taking into account the state of the Ext.data.Record along with configuration properties
+     * related to its rendering, such as {@link #writeAllFields}, {@link Ext.data.Record#phantom phantom}, {@link Ext.data.Record#getChanges getChanges} and
+     * {@link Ext.data.DataReader#idProperty idProperty}
+     * @param {Ext.data.Record} rec The Record from which to create a hash.
+     * @param {Object} config <b>NOT YET IMPLEMENTED</b>.  Will implement an exlude/only configuration for fine-control over which fields do/don't get rendered.
+     * @return {Object}
+     * @protected
+     * TODO Implement excludes/only configuration with 2nd param?
+     */
+    toHash : function(rec, config) {
+        var map = rec.fields.map,
+            data = {},
+            raw = (this.writeAllFields === false && rec.phantom === false) ? rec.getChanges() : rec.data,
+            m;
+        Ext.iterate(raw, function(prop, value){
+            if((m = map[prop])){
+                data[m.mapping ? m.mapping : m.name] = value;
+            }
+        });
+        // we don't want to write Ext auto-generated id to hash.  Careful not to remove it on Models not having auto-increment pk though.
+        // We can tell its not auto-increment if the user defined a DataReader field for it *and* that field's value is non-empty.
+        // we could also do a RegExp here for the Ext.data.Record AUTO_ID prefix.
+        if (rec.phantom) {
+            if (rec.fields.containsKey(this.meta.idProperty) && Ext.isEmpty(rec.data[this.meta.idProperty])) {
+                delete data[this.meta.idProperty];
+            }
+        } else {
+            data[this.meta.idProperty] = rec.id;
+        }
+        return data;
+    },
+
+    /**
+     * Converts a {@link Ext.data.DataWriter#toHash Hashed} {@link Ext.data.Record} to fields-array array suitable
+     * for encoding to xml via XTemplate, eg:
+<code><pre>&lt;tpl for=".">&lt;{name}>{value}&lt;/{name}&lt;/tpl></pre></code>
+     * eg, <b>non-phantom</b>:
+<code><pre>{id: 1, first: 'foo', last: 'bar'} --> [{name: 'id', value: 1}, {name: 'first', value: 'foo'}, {name: 'last', value: 'bar'}]</pre></code>
+     * {@link Ext.data.Record#phantom Phantom} records will have had their idProperty omitted in {@link #toHash} if determined to be auto-generated.
+     * Non AUTOINCREMENT pks should have been protected.
+     * @param {Hash} data Hashed by Ext.data.DataWriter#toHash
+     * @return {[Object]} Array of attribute-objects.
+     * @protected
+     */
+    toArray : function(data) {
+        var fields = [];
+        Ext.iterate(data, function(k, v) {fields.push({name: k, value: v});},this);
+        return fields;
+    }
+};/**
+ * @class Ext.data.DataProxy
+ * @extends Ext.util.Observable
+ * <p>Abstract base class for implementations which provide retrieval of unformatted data objects.
+ * This class is intended to be extended and should not be created directly. For existing implementations,
+ * see {@link Ext.data.DirectProxy}, {@link Ext.data.HttpProxy}, {@link Ext.data.ScriptTagProxy} and
+ * {@link Ext.data.MemoryProxy}.</p>
+ * <p>DataProxy implementations are usually used in conjunction with an implementation of {@link Ext.data.DataReader}
+ * (of the appropriate type which knows how to parse the data object) to provide a block of
+ * {@link Ext.data.Records} to an {@link Ext.data.Store}.</p>
+ * <p>The parameter to a DataProxy constructor may be an {@link Ext.data.Connection} or can also be the
+ * config object to an {@link Ext.data.Connection}.</p>
+ * <p>Custom implementations must implement either the <code><b>doRequest</b></code> method (preferred) or the
+ * <code>load</code> method (deprecated). See
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#doRequest doRequest} or
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#load load} for additional details.</p>
+ * <p><b><u>Example 1</u></b></p>
+ * <pre><code>
+proxy: new Ext.data.ScriptTagProxy({
+    {@link Ext.data.Connection#url url}: 'http://extjs.com/forum/topics-remote.php'
+}),
+ * </code></pre>
+ * <p><b><u>Example 2</u></b></p>
+ * <pre><code>
+proxy : new Ext.data.HttpProxy({
+    {@link Ext.data.Connection#method method}: 'GET',
+    {@link Ext.data.HttpProxy#prettyUrls prettyUrls}: false,
+    {@link Ext.data.Connection#url url}: 'local/default.php', // see options parameter for {@link Ext.Ajax#request}
+    {@link #api}: {
+        // all actions except the following will use above url
+        create  : 'local/new.php',
+        update  : 'local/update.php'
+    }
+}),
+ * </code></pre>
+ * <p>And <b>new in Ext version 3</b>, attach centralized event-listeners upon the DataProxy class itself!  This is a great place
+ * to implement a <i>messaging system</i> to centralize your application's user-feedback and error-handling.</p>
+ * <pre><code>
+// Listen to all "beforewrite" event fired by all proxies.
+Ext.data.DataProxy.on('beforewrite', function(proxy, action) {
+    console.log('beforewrite: ', action);
+});
+
+// Listen to "write" event fired by all proxies
+Ext.data.DataProxy.on('write', function(proxy, action, data, res, rs) {
+    console.info('write: ', action);
+});
+
+// Listen to "exception" event fired by all proxies
+Ext.data.DataProxy.on('exception', function(proxy, type, action, exception) {
+    console.error(type + action + ' exception);
+});
+ * </code></pre>
+ * <b>Note:</b> These three events are all fired with the signature of the corresponding <i>DataProxy instance</i> event {@link #beforewrite beforewrite}, {@link #write write} and {@link #exception exception}.
+ */
+Ext.data.DataProxy = function(conn){
+    // make sure we have a config object here to support ux proxies.
+    // All proxies should now send config into superclass constructor.
+    conn = conn || {};
+
+    // This line caused a bug when people use custom Connection object having its own request method.
+    // http://extjs.com/forum/showthread.php?t=67194.  Have to set DataProxy config
+    //Ext.applyIf(this, conn);
+
+    this.api     = conn.api;
+    this.url     = conn.url;
+    this.restful = conn.restful;
+    this.listeners = conn.listeners;
+
+    // deprecated
+    this.prettyUrls = conn.prettyUrls;
+
+    /**
+     * @cfg {Object} api
+     * Specific urls to call on CRUD action methods "read", "create", "update" and "destroy".
+     * Defaults to:<pre><code>
+api: {
+    read    : undefined,
+    create  : undefined,
+    update  : undefined,
+    destroy : undefined
+}
+     * </code></pre>
+     * <p>The url is built based upon the action being executed <tt>[load|create|save|destroy]</tt>
+     * using the commensurate <tt>{@link #api}</tt> property, or if undefined default to the
+     * configured {@link Ext.data.Store}.{@link Ext.data.Store#url url}.</p><br>
+     * <p>For example:</p>
+     * <pre><code>
+api: {
+    load :    '/controller/load',
+    create :  '/controller/new',  // Server MUST return idProperty of new record
+    save :    '/controller/update',
+    destroy : '/controller/destroy_action'
+}
+
+// Alternatively, one can use the object-form to specify each API-action
+api: {
+    load: {url: 'read.php', method: 'GET'},
+    create: 'create.php',
+    destroy: 'destroy.php',
+    save: 'update.php'
+}
+     * </code></pre>
+     * <p>If the specific URL for a given CRUD action is undefined, the CRUD action request
+     * will be directed to the configured <tt>{@link Ext.data.Connection#url url}</tt>.</p>
+     * <br><p><b>Note</b>: To modify the URL for an action dynamically the appropriate API
+     * property should be modified before the action is requested using the corresponding before
+     * action event.  For example to modify the URL associated with the load action:
+     * <pre><code>
+// modify the url for the action
+myStore.on({
+    beforeload: {
+        fn: function (store, options) {
+            // use <tt>{@link Ext.data.HttpProxy#setUrl setUrl}</tt> to change the URL for *just* this request.
+            store.proxy.setUrl('changed1.php');
+
+            // set optional second parameter to true to make this URL change
+            // permanent, applying this URL for all subsequent requests.
+            store.proxy.setUrl('changed1.php', true);
+
+            // Altering the proxy API should be done using the public
+            // method <tt>{@link Ext.data.DataProxy#setApi setApi}</tt>.
+            store.proxy.setApi('read', 'changed2.php');
+
+            // Or set the entire API with a config-object.
+            // When using the config-object option, you must redefine the <b>entire</b>
+            // API -- not just a specific action of it.
+            store.proxy.setApi({
+                read    : 'changed_read.php',
+                create  : 'changed_create.php',
+                update  : 'changed_update.php',
+                destroy : 'changed_destroy.php'
+            });
+        }
+    }
+});
+     * </code></pre>
+     * </p>
+     */
+
+    this.addEvents(
+        /**
+         * @event exception
+         * <p>Fires if an exception occurs in the Proxy during a remote request. This event is relayed
+         * through a corresponding {@link Ext.data.Store}.{@link Ext.data.Store#exception exception},
+         * so any Store instance may observe this event.</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of exception events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * <p>This event can be fired for one of two reasons:</p>
+         * <div class="mdetail-params"><ul>
+         * <li>remote-request <b>failed</b> : <div class="sub-desc">
+         * The server did not return status === 200.
+         * </div></li>
+         * <li>remote-request <b>succeeded</b> : <div class="sub-desc">
+         * The remote-request succeeded but the reader could not read the response.
+         * This means the server returned data, but the configured Reader threw an
+         * error while reading the response.  In this case, this event will be
+         * raised and the caught error will be passed along into this event.
+         * </div></li>
+         * </ul></div>
+         * <br><p>This event fires with two different contexts based upon the 2nd
+         * parameter <tt>type [remote|response]</tt>.  The first four parameters
+         * are identical between the two contexts -- only the final two parameters
+         * differ.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} type
+         * <p>The value of this parameter will be either <tt>'response'</tt> or <tt>'remote'</tt>.</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>An <b>invalid</b> response from the server was returned: either 404,
+         * 500 or the response meta-data does not match that defined in the DataReader
+         * (e.g.: root, idProperty, successProperty).</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>A <b>valid</b> response was returned from the server having
+         * successProperty === false.  This response might contain an error-message
+         * sent from the server.  For example, the user may have failed
+         * authentication/authorization or a database validation error occurred.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {String} action Name of the action (see {@link Ext.data.Api#actions}.
+         * @param {Object} options The options for the action that were specified in the {@link #request}.
+         * @param {Object} response
+         * <p>The value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>The raw browser response object (e.g.: XMLHttpRequest)</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>The decoded response object sent from the server.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {Mixed} arg
+         * <p>The type and value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : Error<div class="sub-desc">
+         * <p>The JavaScript Error object caught if the configured Reader could not read the data.
+         * If the remote request returns success===false, this parameter will be null.</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : Record/Record[]<div class="sub-desc">
+         * <p>This parameter will only exist if the <tt>action</tt> was a <b>write</b> action
+         * (Ext.data.Api.actions.create|update|destroy).</p>
+         * </div></li>
+         * </ul></div>
+         */
+        'exception',
+        /**
+         * @event beforeload
+         * Fires before a request to retrieve a data object.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} params The params object passed to the {@link #request} function
+         */
+        'beforeload',
+        /**
+         * @event load
+         * Fires before the load method's callback is called.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} o The request transaction object
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'load',
+        /**
+         * @event loadexception
+         * <p>This event is <b>deprecated</b>.  The signature of the loadexception event
+         * varies depending on the proxy, use the catch-all {@link #exception} event instead.
+         * This event will fire in addition to the {@link #exception} event.</p>
+         * @param {misc} misc See {@link #exception}.
+         * @deprecated
+         */
+        'loadexception',
+        /**
+         * @event beforewrite
+         * <p>Fires before a request is generated for one of the actions Ext.data.Api.actions.create|update|destroy</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of beforewrite events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy for the request
+         * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+         * @param {Record/Record[]} rs The Record(s) to create|update|destroy.
+         * @param {Object} params The request <code>params</code> object.  Edit <code>params</code> to add parameters to the request.
+         */
+        'beforewrite',
+        /**
+         * @event write
+         * <p>Fires before the request-callback is called</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of write events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} action [Ext.data.Api.actions.create|upate|destroy]
+         * @param {Object} data The data object extracted from the server-response
+         * @param {Object} response The decoded response from server
+         * @param {Record/Record[]} rs The Record(s) from Store
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'write'
+    );
+    Ext.data.DataProxy.superclass.constructor.call(this);
+
+    // Prepare the proxy api.  Ensures all API-actions are defined with the Object-form.
+    try {
+        Ext.data.Api.prepare(this);
+    } catch (e) {
+        if (e instanceof Ext.data.Api.Error) {
+            e.toConsole();
+        }
+    }
+    // relay each proxy's events onto Ext.data.DataProxy class for centralized Proxy-listening
+    Ext.data.DataProxy.relayEvents(this, ['beforewrite', 'write', 'exception']);
+};
+
+Ext.extend(Ext.data.DataProxy, Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} restful
+     * <p>Defaults to <tt>false</tt>.  Set to <tt>true</tt> to operate in a RESTful manner.</p>
+     * <br><p> Note: this parameter will automatically be set to <tt>true</tt> if the
+     * {@link Ext.data.Store} it is plugged into is set to <code>restful: true</code>. If the
+     * Store is RESTful, there is no need to set this option on the proxy.</p>
+     * <br><p>RESTful implementations enable the serverside framework to automatically route
+     * actions sent to one url based upon the HTTP method, for example:
+     * <pre><code>
+store: new Ext.data.Store({
+    restful: true,
+    proxy: new Ext.data.HttpProxy({url:'/users'}); // all requests sent to /users
+    ...
+)}
+     * </code></pre>
+     * If there is no <code>{@link #api}</code> specified in the configuration of the proxy,
+     * all requests will be marshalled to a single RESTful url (/users) so the serverside
+     * framework can inspect the HTTP Method and act accordingly:
+     * <pre>
+<u>Method</u>   <u>url</u>        <u>action</u>
+POST     /users     create
+GET      /users     read
+PUT      /users/23  update
+DESTROY  /users/23  delete
+     * </pre></p>
+     * <p>If set to <tt>true</tt>, a {@link Ext.data.Record#phantom non-phantom} record's
+     * {@link Ext.data.Record#id id} will be appended to the url. Some MVC (e.g., Ruby on Rails,
+     * Merb and Django) support segment based urls where the segments in the URL follow the
+     * Model-View-Controller approach:<pre><code>
+     * someSite.com/controller/action/id
+     * </code></pre>
+     * Where the segments in the url are typically:<div class="mdetail-params"><ul>
+     * <li>The first segment : represents the controller class that should be invoked.</li>
+     * <li>The second segment : represents the class function, or method, that should be called.</li>
+     * <li>The third segment : represents the ID (a variable typically passed to the method).</li>
+     * </ul></div></p>
+     * <br><p>Refer to <code>{@link Ext.data.DataProxy#api}</code> for additional information.</p>
+     */
+    restful: false,
+
+    /**
+     * <p>Redefines the Proxy's API or a single action of an API. Can be called with two method signatures.</p>
+     * <p>If called with an object as the only parameter, the object should redefine the <b>entire</b> API, e.g.:</p><pre><code>
+proxy.setApi({
+    read    : '/users/read',
+    create  : '/users/create',
+    update  : '/users/update',
+    destroy : '/users/destroy'
+});
+</code></pre>
+     * <p>If called with two parameters, the first parameter should be a string specifying the API action to
+     * redefine and the second parameter should be the URL (or function if using DirectProxy) to call for that action, e.g.:</p><pre><code>
+proxy.setApi(Ext.data.Api.actions.read, '/users/new_load_url');
+</code></pre>
+     * @param {String/Object} api An API specification object, or the name of an action.
+     * @param {String/Function} url The URL (or function if using DirectProxy) to call for the action.
+     */
+    setApi : function() {
+        if (arguments.length == 1) {
+            var valid = Ext.data.Api.isValid(arguments[0]);
+            if (valid === true) {
+                this.api = arguments[0];
+            }
+            else {
+                throw new Ext.data.Api.Error('invalid', valid);
+            }
+        }
+        else if (arguments.length == 2) {
+            if (!Ext.data.Api.isAction(arguments[0])) {
+                throw new Ext.data.Api.Error('invalid', arguments[0]);
+            }
+            this.api[arguments[0]] = arguments[1];
+        }
+        Ext.data.Api.prepare(this);
+    },
+
+    /**
+     * Returns true if the specified action is defined as a unique action in the api-config.
+     * request.  If all API-actions are routed to unique urls, the xaction parameter is unecessary.  However, if no api is defined
+     * and all Proxy actions are routed to DataProxy#url, the server-side will require the xaction parameter to perform a switch to
+     * the corresponding code for CRUD action.
+     * @param {String [Ext.data.Api.CREATE|READ|UPDATE|DESTROY]} action
+     * @return {Boolean}
+     */
+    isApiAction : function(action) {
+        return (this.api[action]) ? true : false;
+    },
+
+    /**
+     * All proxy actions are executed through this method.  Automatically fires the "before" + action event
+     * @param {String} action Name of the action
+     * @param {Ext.data.Record/Ext.data.Record[]/null} rs Will be null when action is 'load'
+     * @param {Object} params
+     * @param {Ext.data.DataReader} reader
+     * @param {Function} callback
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the Proxy object.
+     * @param {Object} options Any options specified for the action (e.g. see {@link Ext.data.Store#load}.
+     */
+    request : function(action, rs, params, reader, callback, scope, options) {
+        if (!this.api[action] && !this.load) {
+            throw new Ext.data.DataProxy.Error('action-undefined', action);
+        }
+        params = params || {};
+        if ((action === Ext.data.Api.actions.read) ? this.fireEvent("beforeload", this, params) : this.fireEvent("beforewrite", this, action, rs, params) !== false) {
+            this.doRequest.apply(this, arguments);
+        }
+        else {
+            callback.call(scope || this, null, options, false);
+        }
+    },
+
+
+    /**
+     * <b>Deprecated</b> load method using old method signature. See {@doRequest} for preferred method.
+     * @deprecated
+     * @param {Object} params
+     * @param {Object} reader
+     * @param {Object} callback
+     * @param {Object} scope
+     * @param {Object} arg
+     */
+    load : null,
+
+    /**
+     * @cfg {Function} doRequest Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.
+     * (e.g.: {@link Ext.data.HttpProxy#doRequest HttpProxy.doRequest},
+     * {@link Ext.data.DirectProxy#doRequest DirectProxy.doRequest}).
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        // default implementation of doRequest for backwards compatibility with 2.0 proxies.
+        // If we're executing here, the action is probably "load".
+        // Call with the pre-3.0 method signature.
+        this.load(params, reader, callback, scope, options);
+    },
+
+    /**
+     * @cfg {Function} onRead Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for read {@link Ext.data.Api#actions action}.
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : Ext.emptyFn,
+    /**
+     * @cfg {Function} onWrite Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for <i>create, update and destroy</i> {@link Ext.data.Api#actions actions}.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : Ext.emptyFn,
+    /**
+     * buildUrl
+     * Sets the appropriate url based upon the action being executed.  If restful is true, and only a single record is being acted upon,
+     * url will be built Rails-style, as in "/controller/action/32".  restful will aply iff the supplied record is an
+     * instance of Ext.data.Record rather than an Array of them.
+     * @param {String} action The api action being executed [read|create|update|destroy]
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record or Array of Records being acted upon.
+     * @return {String} url
+     * @private
+     */
+    buildUrl : function(action, record) {
+        record = record || null;
+
+        // conn.url gets nullified after each request.  If it's NOT null here, that means the user must have intervened with a call
+        // to DataProxy#setUrl or DataProxy#setApi and changed it before the request was executed.  If that's the case, use conn.url,
+        // otherwise, build the url from the api or this.url.
+        var url = (this.conn && this.conn.url) ? this.conn.url : (this.api[action]) ? this.api[action].url : this.url;
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', action);
+        }
+
+        // look for urls having "provides" suffix used in some MVC frameworks like Rails/Merb and others.  The provides suffice informs
+        // the server what data-format the client is dealing with and returns data in the same format (eg: application/json, application/xml, etc)
+        // e.g.: /users.json, /users.xml, etc.
+        // with restful routes, we need urls like:
+        // PUT /users/1.json
+        // DELETE /users/1.json
+        var provides = null;
+        var m = url.match(/(.*)(\.json|\.xml|\.html)$/);
+        if (m) {
+            provides = m[2];    // eg ".json"
+            url      = m[1];    // eg: "/users"
+        }
+        // prettyUrls is deprectated in favor of restful-config
+        if ((this.restful === true || this.prettyUrls === true) && record instanceof Ext.data.Record && !record.phantom) {
+            url += '/' + record.id;
+        }
+        return (provides === null) ? url : url + provides;
+    },
+
+    /**
+     * Destroys the proxy by purging any event listeners and cancelling any active requests.
+     */
+    destroy: function(){
+        this.purgeListeners();
+    }
+});
+
+// Apply the Observable prototype to the DataProxy class so that proxy instances can relay their
+// events to the class.  Allows for centralized listening of all proxy instances upon the DataProxy class.
+Ext.apply(Ext.data.DataProxy, Ext.util.Observable.prototype);
+Ext.util.Observable.call(Ext.data.DataProxy);
+
+/**
+ * @class Ext.data.DataProxy.Error
+ * @extends Ext.Error
+ * DataProxy Error extension.
+ * constructor
+ * @param {String} message Message describing the error.
+ * @param {Record/Record[]} arg
+ */
+Ext.data.DataProxy.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataProxy'
+});
+Ext.apply(Ext.data.DataProxy.Error.prototype, {
+    lang: {
+        'action-undefined': "DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.",
+        'api-invalid': 'Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions.'
+    }
+});
+
+
+/**
+ * @class Ext.data.Request
+ * A simple Request class used internally to the data package to provide more generalized remote-requests
+ * to a DataProxy.
+ * TODO Not yet implemented.  Implement in Ext.data.Store#execute
+ */
+Ext.data.Request = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Request.prototype = {
+    /**
+     * @cfg {String} action
+     */
+    action : undefined,
+    /**
+     * @cfg {Ext.data.Record[]/Ext.data.Record} rs The Store recordset associated with the request.
+     */
+    rs : undefined,
+    /**
+     * @cfg {Object} params HTTP request params
+     */
+    params: undefined,
+    /**
+     * @cfg {Function} callback The function to call when request is complete
+     */
+    callback : Ext.emptyFn,
+    /**
+     * @cfg {Object} scope The scope of the callback funtion
+     */
+    scope : undefined,
+    /**
+     * @cfg {Ext.data.DataReader} reader The DataReader instance which will parse the received response
+     */
+    reader : undefined
+};
+/**
+ * @class Ext.data.Response
+ * A generic response class to normalize response-handling internally to the framework.
+ */
+Ext.data.Response = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Response.prototype = {
+    /**
+     * @cfg {String} action {@link Ext.data.Api#actions}
+     */
+    action: undefined,
+    /**
+     * @cfg {Boolean} success
+     */
+    success : undefined,
+    /**
+     * @cfg {String} message
+     */
+    message : undefined,
+    /**
+     * @cfg {Array/Object} data
+     */
+    data: undefined,
+    /**
+     * @cfg {Object} raw The raw response returned from server-code
+     */
+    raw: undefined,
+    /**
+     * @cfg {Ext.data.Record/Ext.data.Record[]} records related to the Request action
+     */
+    records: undefined
+};
+/**
+ * @class Ext.data.ScriptTagProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that reads a data object from a URL which may be in a domain
+ * other than the originating domain of the running page.<br>
+ * <p>
+ * <b>Note that if you are retrieving data from a page that is in a domain that is NOT the same as the originating domain
+ * of the running page, you must use this class, rather than HttpProxy.</b><br>
+ * <p>
+ * The content passed back from a server resource requested by a ScriptTagProxy <b>must</b> be executable JavaScript
+ * source code because it is used as the source inside a &lt;script> tag.<br>
+ * <p>
+ * In order for the browser to process the returned data, the server must wrap the data object
+ * with a call to a callback function, the name of which is passed as a parameter by the ScriptTagProxy.
+ * Below is a Java example for a servlet which returns data for either a ScriptTagProxy, or an HttpProxy
+ * depending on whether the callback name was passed:
+ * <p>
+ * <pre><code>
+boolean scriptTag = false;
+String cb = request.getParameter("callback");
+if (cb != null) {
+    scriptTag = true;
+    response.setContentType("text/javascript");
+} else {
+    response.setContentType("application/x-json");
+}
+Writer out = response.getWriter();
+if (scriptTag) {
+    out.write(cb + "(");
+}
+out.print(dataBlock.toJsonString());
+if (scriptTag) {
+    out.write(");");
+}
+</code></pre>
+ * <p>Below is a PHP example to do the same thing:</p><pre><code>
+$callback = $_REQUEST['callback'];
+
+// Create the output object.
+$output = array('a' => 'Apple', 'b' => 'Banana');
+
+//start output
+if ($callback) {
+    header('Content-Type: text/javascript');
+    echo $callback . '(' . json_encode($output) . ');';
+} else {
+    header('Content-Type: application/x-json');
+    echo json_encode($output);
+}
+</code></pre>
+ * <p>Below is the ASP.Net code to do the same thing:</p><pre><code>
+String jsonString = "{success: true}";
+String cb = Request.Params.Get("callback");
+String responseString = "";
+if (!String.IsNullOrEmpty(cb)) {
+    responseString = cb + "(" + jsonString + ")";
+} else {
+    responseString = jsonString;
+}
+Response.Write(responseString);
+</code></pre>
+ *
+ * @constructor
+ * @param {Object} config A configuration object.
+ */
+Ext.data.ScriptTagProxy = function(config){
+    Ext.apply(this, config);
+
+    Ext.data.ScriptTagProxy.superclass.constructor.call(this, config);
+
+    this.head = document.getElementsByTagName("head")[0];
+
+    /**
+     * @event loadexception
+     * <b>Deprecated</b> in favor of 'exception' event.
+     * Fires if an exception occurs in the Proxy during data loading.  This event can be fired for one of two reasons:
+     * <ul><li><b>The load call timed out.</b>  This means the load callback did not execute within the time limit
+     * specified by {@link #timeout}.  In this case, this event will be raised and the
+     * fourth parameter (read error) will be null.</li>
+     * <li><b>The load succeeded but the reader could not read the response.</b>  This means the server returned
+     * data, but the configured Reader threw an error while reading the data.  In this case, this event will be
+     * raised and the caught error will be passed along as the fourth parameter of this event.</li></ul>
+     * Note that this event is also relayed through {@link Ext.data.Store}, so you can listen for it directly
+     * on any Store instance.
+     * @param {Object} this
+     * @param {Object} options The loading options that were specified (see {@link #load} for details).  If the load
+     * call timed out, this parameter will be null.
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data.
+     * If the remote request returns success: false, this parameter will be null.
+     */
+};
+
+Ext.data.ScriptTagProxy.TRANS_ID = 1000;
+
+Ext.extend(Ext.data.ScriptTagProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {String} url The URL from which to request the data object.
+     */
+    /**
+     * @cfg {Number} timeout (optional) The number of milliseconds to wait for a response. Defaults to 30 seconds.
+     */
+    timeout : 30000,
+    /**
+     * @cfg {String} callbackParam (Optional) The name of the parameter to pass to the server which tells
+     * the server the name of the callback function set up by the load call to process the returned data object.
+     * Defaults to "callback".<p>The server-side processing must read this parameter value, and generate
+     * javascript output which calls this named function passing the data object as its only parameter.
+     */
+    callbackParam : "callback",
+    /**
+     *  @cfg {Boolean} nocache (optional) Defaults to true. Disable caching by adding a unique parameter
+     * name to the request.
+     */
+    nocache : true,
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is <tt>read</tt>, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        var p = Ext.urlEncode(Ext.apply(params, this.extraParams));
+
+        var url = this.buildUrl(action, rs);
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', url);
+        }
+        url = Ext.urlAppend(url, p);
+
+        if(this.nocache){
+            url = Ext.urlAppend(url, '_dc=' + (new Date().getTime()));
+        }
+        var transId = ++Ext.data.ScriptTagProxy.TRANS_ID;
+        var trans = {
+            id : transId,
+            action: action,
+            cb : "stcCallback"+transId,
+            scriptId : "stcScript"+transId,
+            params : params,
+            arg : arg,
+            url : url,
+            callback : callback,
+            scope : scope,
+            reader : reader
+        };
+        window[trans.cb] = this.createCallback(action, rs, trans);
+        url += String.format("&{0}={1}", this.callbackParam, trans.cb);
+        if(this.autoAbort !== false){
+            this.abort();
+        }
+
+        trans.timeoutId = this.handleFailure.defer(this.timeout, this, [trans]);
+
+        var script = document.createElement("script");
+        script.setAttribute("src", url);
+        script.setAttribute("type", "text/javascript");
+        script.setAttribute("id", trans.scriptId);
+        this.head.appendChild(script);
+
+        this.trans = trans;
+    },
+
+    // @private createCallback
+    createCallback : function(action, rs, trans) {
+        var self = this;
+        return function(res) {
+            self.trans = false;
+            self.destroyTrans(trans, true);
+            if (action === Ext.data.Api.actions.read) {
+                self.onRead.call(self, action, trans, res);
+            } else {
+                self.onWrite.call(self, action, trans, res, rs);
+            }
+        };
+    },
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, res) {
+        var result;
+        try {
+            result = trans.reader.readRecords(res);
+        }catch(e){
+            // @deprecated: fire loadexception
+            this.fireEvent("loadexception", this, trans, res, e);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, trans.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            this.fireEvent('loadexception', this, trans, res);
+
+            this.fireEvent('exception', this, 'remote', action, trans, res, null);
+        } else {
+            this.fireEvent("load", this, res, trans.arg);
+        }
+        trans.callback.call(trans.scope||window, result, trans.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onWrite : function(action, trans, response, rs) {
+        var reader = trans.reader;
+        try {
+            // though we already have a response object here in STP, run through readResponse to catch any meta-data exceptions.
+            var res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        if(!res.success === true){
+            this.fireEvent('exception', this, 'remote', action, trans, res, rs);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        this.fireEvent("write", this, action, res.data, res, rs, trans.arg );
+        trans.callback.call(trans.scope||window, res.data, res, true);
+    },
+
+    // private
+    isLoading : function(){
+        return this.trans ? true : false;
+    },
+
+    /**
+     * Abort the current server request.
+     */
+    abort : function(){
+        if(this.isLoading()){
+            this.destroyTrans(this.trans);
+        }
+    },
+
+    // private
+    destroyTrans : function(trans, isLoaded){
+        this.head.removeChild(document.getElementById(trans.scriptId));
+        clearTimeout(trans.timeoutId);
+        if(isLoaded){
+            window[trans.cb] = undefined;
+            try{
+                delete window[trans.cb];
+            }catch(e){}
+        }else{
+            // if hasn't been loaded, wait for load to remove it to prevent script error
+            window[trans.cb] = function(){
+                window[trans.cb] = undefined;
+                try{
+                    delete window[trans.cb];
+                }catch(e){}
+            };
+        }
+    },
+
+    // private
+    handleFailure : function(trans){
+        this.trans = false;
+        this.destroyTrans(trans, false);
+        if (trans.action === Ext.data.Api.actions.read) {
+            // @deprecated firing loadexception
+            this.fireEvent("loadexception", this, null, trans.arg);
+        }
+
+        this.fireEvent('exception', this, 'response', trans.action, {
+            response: null,
+            options: trans.arg
+        });
+        trans.callback.call(trans.scope||window, null, trans.arg, false);
+    },
+
+    // inherit docs
+    destroy: function(){
+        this.abort();
+        Ext.data.ScriptTagProxy.superclass.destroy.call(this);
+    }
+});/**
+ * @class Ext.data.HttpProxy
+ * @extends Ext.data.DataProxy
+ * <p>An implementation of {@link Ext.data.DataProxy} that processes data requests within the same
+ * domain of the originating page.</p>
+ * <p><b>Note</b>: this class cannot be used to retrieve data from a domain other
+ * than the domain from which the running page was served. For cross-domain requests, use a
+ * {@link Ext.data.ScriptTagProxy ScriptTagProxy}.</p>
+ * <p>Be aware that to enable the browser to parse an XML document, the server must set
+ * the Content-Type header in the HTTP response to "<tt>text/xml</tt>".</p>
+ * @constructor
+ * @param {Object} conn
+ * An {@link Ext.data.Connection} object, or options parameter to {@link Ext.Ajax#request}.
+ * <p>Note that if this HttpProxy is being used by a {@link Ext.data.Store Store}, then the
+ * Store's call to {@link #load} will override any specified <tt>callback</tt> and <tt>params</tt>
+ * options. In this case, use the Store's {@link Ext.data.Store#events events} to modify parameters,
+ * or react to loading events. The Store's {@link Ext.data.Store#baseParams baseParams} may also be
+ * used to pass parameters known at instantiation time.</p>
+ * <p>If an options parameter is passed, the singleton {@link Ext.Ajax} object will be used to make
+ * the request.</p>
+ */
+Ext.data.HttpProxy = function(conn){
+    Ext.data.HttpProxy.superclass.constructor.call(this, conn);
+
+    /**
+     * The Connection object (Or options parameter to {@link Ext.Ajax#request}) which this HttpProxy
+     * uses to make requests to the server. Properties of this object may be changed dynamically to
+     * change the way data is requested.
+     * @property
+     */
+    this.conn = conn;
+
+    // nullify the connection url.  The url param has been copied to 'this' above.  The connection
+    // url will be set during each execution of doRequest when buildUrl is called.  This makes it easier for users to override the
+    // connection url during beforeaction events (ie: beforeload, beforewrite, etc).
+    // Url is always re-defined during doRequest.
+    this.conn.url = null;
+
+    this.useAjax = !conn || !conn.events;
+
+    // A hash containing active requests, keyed on action [Ext.data.Api.actions.create|read|update|destroy]
+    var actions = Ext.data.Api.actions;
+    this.activeRequest = {};
+    for (var verb in actions) {
+        this.activeRequest[actions[verb]] = undefined;
+    }
+};
+
+Ext.extend(Ext.data.HttpProxy, Ext.data.DataProxy, {
+    /**
+     * Return the {@link Ext.data.Connection} object being used by this Proxy.
+     * @return {Connection} The Connection object. This object may be used to subscribe to events on
+     * a finer-grained basis than the DataProxy events.
+     */
+    getConnection : function() {
+        return this.useAjax ? Ext.Ajax : this.conn;
+    },
+
+    /**
+     * Used for overriding the url used for a single request.  Designed to be called during a beforeaction event.  Calling setUrl
+     * will override any urls set via the api configuration parameter.  Set the optional parameter makePermanent to set the url for
+     * all subsequent requests.  If not set to makePermanent, the next request will use the same url or api configuration defined
+     * in the initial proxy configuration.
+     * @param {String} url
+     * @param {Boolean} makePermanent (Optional) [false]
+     *
+     * (e.g.: beforeload, beforesave, etc).
+     */
+    setUrl : function(url, makePermanent) {
+        this.conn.url = url;
+        if (makePermanent === true) {
+            this.url = url;
+            this.api = null;
+            Ext.data.Api.prepare(this);
+        }
+    },
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, cb, scope, arg) {
+        var  o = {
+            method: (this.api[action]) ? this.api[action]['method'] : undefined,
+            request: {
+                callback : cb,
+                scope : scope,
+                arg : arg
+            },
+            reader: reader,
+            callback : this.createCallback(action, rs),
+            scope: this
+        };
+
+        // If possible, transmit data using jsonData || xmlData on Ext.Ajax.request (An installed DataWriter would have written it there.).
+        // Use std HTTP params otherwise.
+        if (params.jsonData) {
+            o.jsonData = params.jsonData;
+        } else if (params.xmlData) {
+            o.xmlData = params.xmlData;
+        } else {
+            o.params = params || {};
+        }
+        // Set the connection url.  If this.conn.url is not null here,
+        // the user must have overridden the url during a beforewrite/beforeload event-handler.
+        // this.conn.url is nullified after each request.
+        this.conn.url = this.buildUrl(action, rs);
+
+        if(this.useAjax){
+
+            Ext.applyIf(o, this.conn);
+
+            // If a currently running request is found for this action, abort it.
+            if (this.activeRequest[action]) {
+                ////
+                // Disabled aborting activeRequest while implementing REST.  activeRequest[action] will have to become an array
+                // TODO ideas anyone?
+                //
+                //Ext.Ajax.abort(this.activeRequest[action]);
+            }
+            this.activeRequest[action] = Ext.Ajax.request(o);
+        }else{
+            this.conn.request(o);
+        }
+        // request is sent, nullify the connection url in preparation for the next request
+        this.conn.url = null;
+    },
+
+    /**
+     * Returns a callback function for a request.  Note a special case is made for the
+     * read action vs all the others.
+     * @param {String} action [create|update|delete|load]
+     * @param {Ext.data.Record[]} rs The Store-recordset being acted upon
+     * @private
+     */
+    createCallback : function(action, rs) {
+        return function(o, success, response) {
+            this.activeRequest[action] = undefined;
+            if (!success) {
+                if (action === Ext.data.Api.actions.read) {
+                    // @deprecated: fire loadexception for backwards compat.
+                    // TODO remove
+                    this.fireEvent('loadexception', this, o, response);
+                }
+                this.fireEvent('exception', this, 'response', action, o, response);
+                o.request.callback.call(o.request.scope, null, o.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                this.onRead(action, o, response);
+            } else {
+                this.onWrite(action, o, response, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read action
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : function(action, o, response) {
+        var result;
+        try {
+            result = o.reader.read(response);
+        }catch(e){
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response, e);
+
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response);
+
+            // Get DataReader read-back a response-object to pass along to exception event
+            var res = o.reader.readResponse(action, response);
+            this.fireEvent('exception', this, 'remote', action, o, res, null);
+        }
+        else {
+            this.fireEvent('load', this, o, o.request.arg);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made identical.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, result, o.request.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : function(action, o, response, rs) {
+        var reader = o.reader;
+        var res;
+        try {
+            res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (res.success === true) {
+            this.fireEvent('write', this, action, res.data, res, rs, o.request.arg);
+        } else {
+            this.fireEvent('exception', this, 'remote', action, o, res, rs);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made similar.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, res.data, res, res.success);
+    },
+
+    // inherit docs
+    destroy: function(){
+        if(!this.useAjax){
+            this.conn.abort();
+        }else if(this.activeRequest){
+            var actions = Ext.data.Api.actions;
+            for (var verb in actions) {
+                if(this.activeRequest[actions[verb]]){
+                    Ext.Ajax.abort(this.activeRequest[actions[verb]]);
+                }
+            }
+        }
+        Ext.data.HttpProxy.superclass.destroy.call(this);
+    }
+});/**
+ * @class Ext.data.MemoryProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that simply passes the data specified in its constructor
+ * to the Reader when its load method is called.
+ * @constructor
+ * @param {Object} data The data object which the Reader uses to construct a block of Ext.data.Records.
+ */
+Ext.data.MemoryProxy = function(data){
+    // Must define a dummy api with "read" action to satisfy DataProxy#doRequest and Ext.data.Api#prepare *before* calling super
+    var api = {};
+    api[Ext.data.Api.actions.read] = true;
+    Ext.data.MemoryProxy.superclass.constructor.call(this, {
+        api: api
+    });
+    this.data = data;
+};
+
+Ext.extend(Ext.data.MemoryProxy, Ext.data.DataProxy, {
+    /**
+     * @event loadexception
+     * Fires if an exception occurs in the Proxy during data loading. Note that this event is also relayed
+     * through {@link Ext.data.Store}, so you can listen for it directly on any Store instance.
+     * @param {Object} this
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Object} null This parameter does not apply and will always be null for MemoryProxy
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data
+     */
+
+       /**
+     * MemoryProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        // No implementation for CRUD in MemoryProxy.  Assumes all actions are 'load'
+        params = params || {};
+        var result;
+        try {
+            result = reader.readRecords(this.data);
+        }catch(e){
+            // @deprecated loadexception
+            this.fireEvent("loadexception", this, null, arg, e);
+
+            this.fireEvent('exception', this, 'response', action, arg, null, e);
+            callback.call(scope, null, arg, false);
+            return;
+        }
+        callback.call(scope, result, arg, true);
+    }
+});/**
+ * @class Ext.data.Types
+ * <p>This is s static class containing the system-supplied data types which may be given to a {@link Ext.data.Field Field}.<p/>
+ * <p>The properties in this class are used as type indicators in the {@link Ext.data.Field Field} class, so to
+ * test whether a Field is of a certain type, compare the {@link Ext.data.Field#type type} property against properties
+ * of this class.</p>
+ * <p>Developers may add their own application-specific data types to this class. Definition names must be UPPERCASE.
+ * each type definition must contain three properties:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>convert</code> : <i>Function</i><div class="sub-desc">A function to convert raw data values from a data block into the data
+ * to be stored in the Field. The function is passed the collowing parameters:
+ * <div class="mdetail-params"><ul>
+ * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+ * the configured <tt>{@link Ext.data.Field#defaultValue defaultValue}</tt>.</div></li>
+ * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+ * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+ * ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+ * </ul></div></div></li>
+ * <li><code>sortType</code> : <i>Function</i> <div class="sub-desc">A function to convert the stored data into comparable form, as defined by {@link Ext.data.SortTypes}.</div></li>
+ * <li><code>type</code> : <i>String</i> <div class="sub-desc">A textual data type name.</div></li>
+ * </ul></div>
+ * <p>For example, to create a VELatLong field (See the Microsoft Bing Mapping API) containing the latitude/longitude value of a datapoint on a map from a JsonReader data block
+ * which contained the properties <code>lat</code> and <code>long</code>, you would define a new data type like this:</p>
+ *<pre><code>
+// Add a new Field data type which stores a VELatLong object in the Record.
+Ext.data.Types.VELATLONG = {
+    convert: function(v, data) {
+        return new VELatLong(data.lat, data.long);
+    },
+    sortType: function(v) {
+        return v.Latitude;  // When sorting, order by latitude
+    },
+    type: 'VELatLong'
+};
+</code></pre>
+ * <p>Then, when declaring a Record, use <pre><code>
+var types = Ext.data.Types; // allow shorthand type access
+UnitRecord = Ext.data.Record.create([
+    { name: 'unitName', mapping: 'UnitName' },
+    { name: 'curSpeed', mapping: 'CurSpeed', type: types.INT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'position', type: types.VELATLONG }
+]);
+</code></pre>
+ * @singleton
+ */
+Ext.data.Types = new function(){
+    var st = Ext.data.SortTypes;
+    Ext.apply(this, {
+        /**
+         * @type Regexp
+         * @property stripRe
+         * A regular expression for stripping non-numeric characters from a numeric value. Defaults to <tt>/[\$,%]/g</tt>.
+         * This should be overridden for localization.
+         */
+        stripRe: /[\$,%]/g,
+        
+        /**
+         * @type Object.
+         * @property AUTO
+         * This data type means that no conversion is applied to the raw data before it is placed into a Record.
+         */
+        AUTO: {
+            convert: function(v){ return v; },
+            sortType: st.none,
+            type: 'auto'
+        },
+
+        /**
+         * @type Object.
+         * @property STRING
+         * This data type means that the raw data is converted into a String before it is placed into a Record.
+         */
+        STRING: {
+            convert: function(v){ return (v === undefined || v === null) ? '' : String(v); },
+            sortType: st.asUCString,
+            type: 'string'
+        },
+
+        /**
+         * @type Object.
+         * @property INT
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INTEGER</code> is equivalent.</p>
+         */
+        INT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseInt(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'int'
+        },
+        
+        /**
+         * @type Object.
+         * @property FLOAT
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>NUMBER</code> is equivalent.</p>
+         */
+        FLOAT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseFloat(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'float'
+        },
+        
+        /**
+         * @type Object.
+         * @property BOOL
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOLEAN</code> is equivalent.</p>
+         */
+        BOOL: {
+            convert: function(v){ return v === true || v === 'true' || v == 1; },
+            sortType: st.none,
+            type: 'bool'
+        },
+        
+        /**
+         * @type Object.
+         * @property DATE
+         * This data type means that the raw data is converted into a Date before it is placed into a Record.
+         * The date format is specified in the constructor of the {@link Ext.data.Field} to which this type is
+         * being applied.
+         */
+        DATE: {
+            convert: function(v){
+                var df = this.dateFormat;
+                if(!v){
+                    return null;
+                }
+                if(Ext.isDate(v)){
+                    return v;
+                }
+                if(df){
+                    if(df == 'timestamp'){
+                        return new Date(v*1000);
+                    }
+                    if(df == 'time'){
+                        return new Date(parseInt(v, 10));
+                    }
+                    return Date.parseDate(v, df);
+                }
+                var parsed = Date.parse(v);
+                return parsed ? new Date(parsed) : null;
+            },
+            sortType: st.asDate,
+            type: 'date'
+        }
+    });
+    
+    Ext.apply(this, {
+        /**
+         * @type Object.
+         * @property BOOLEAN
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOL</code> is equivalent.</p>
+         */
+        BOOLEAN: this.BOOL,
+        /**
+         * @type Object.
+         * @property INTEGER
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INT</code> is equivalent.</p>
+         */
+        INTEGER: this.INT,
+        /**
+         * @type Object.
+         * @property NUMBER
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>FLOAT</code> is equivalent.</p>
+         */
+        NUMBER: this.FLOAT    
+    });
+};
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tree-debug.js	(revision 76)
@@ -0,0 +1,4837 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreePanel
+ * @extends Ext.Panel
+ * <p>The TreePanel provides tree-structured UI representation of tree-structured data.</p>
+ * <p>{@link Ext.tree.TreeNode TreeNode}s added to the TreePanel may each contain metadata
+ * used by your application in their {@link Ext.tree.TreeNode#attributes attributes} property.</p>
+ * <p><b>A TreePanel must have a {@link #root} node before it is rendered.</b> This may either be
+ * specified using the {@link #root} config option, or using the {@link #setRootNode} method.
+ * <p>An example of tree rendered to an existing div:</p><pre><code>
+var tree = new Ext.tree.TreePanel({
+    renderTo: 'tree-div',
+    useArrows: true,
+    autoScroll: true,
+    animate: true,
+    enableDD: true,
+    containerScroll: true,
+    border: false,
+    // auto create TreeLoader
+    dataUrl: 'get-nodes.php',
+
+    root: {
+        nodeType: 'async',
+        text: 'Ext JS',
+        draggable: false,
+        id: 'source'
+    }
+});
+
+tree.getRootNode().expand();
+ * </code></pre>
+ * <p>The example above would work with a data packet similar to this:</p><pre><code>
+[{
+    "text": "adapter",
+    "id": "source\/adapter",
+    "cls": "folder"
+}, {
+    "text": "dd",
+    "id": "source\/dd",
+    "cls": "folder"
+}, {
+    "text": "debug.js",
+    "id": "source\/debug.js",
+    "leaf": true,
+    "cls": "file"
+}]
+ * </code></pre>
+ * <p>An example of tree within a Viewport:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        xtype: 'treepanel',
+        width: 200,
+        autoScroll: true,
+        split: true,
+        loader: new Ext.tree.TreeLoader(),
+        root: new Ext.tree.AsyncTreeNode({
+            expanded: true,
+            children: [{
+                text: 'Menu Option 1',
+                leaf: true
+            }, {
+                text: 'Menu Option 2',
+                leaf: true
+            }, {
+                text: 'Menu Option 3',
+                leaf: true
+            }]
+        }),
+        rootVisible: false,
+        listeners: {
+            click: function(n) {
+                Ext.Msg.alert('Navigation Tree Click', 'You clicked: "' + n.attributes.text + '"');
+            }
+        }
+    }, {
+        region: 'center',
+        xtype: 'tabpanel',
+        // remaining code not shown ...
+    }]
+});
+</code></pre>
+ *
+ * @cfg {Ext.tree.TreeNode} root The root node for the tree.
+ * @cfg {Boolean} rootVisible <tt>false</tt> to hide the root node (defaults to <tt>true</tt>)
+ * @cfg {Boolean} lines <tt>false</tt> to disable tree lines (defaults to <tt>true</tt>)
+ * @cfg {Boolean} enableDD <tt>true</tt> to enable drag and drop
+ * @cfg {Boolean} enableDrag <tt>true</tt> to enable just drag
+ * @cfg {Boolean} enableDrop <tt>true</tt> to enable just drop
+ * @cfg {Object} dragConfig Custom config to pass to the {@link Ext.tree.TreeDragZone} instance
+ * @cfg {Object} dropConfig Custom config to pass to the {@link Ext.tree.TreeDropZone} instance
+ * @cfg {String} ddGroup The DD group this TreePanel belongs to
+ * @cfg {Boolean} ddAppendOnly <tt>true</tt> if the tree should only allow append drops (use for trees which are sorted)
+ * @cfg {Boolean} ddScroll <tt>true</tt> to enable body scrolling
+ * @cfg {Boolean} containerScroll <tt>true</tt> to register this container with ScrollManager
+ * @cfg {Boolean} hlDrop <tt>false</tt> to disable node highlight on drop (defaults to the value of {@link Ext#enableFx})
+ * @cfg {String} hlColor The color of the node highlight (defaults to <tt>'C3DAF9'</tt>)
+ * @cfg {Boolean} animate <tt>true</tt> to enable animated expand/collapse (defaults to the value of {@link Ext#enableFx})
+ * @cfg {Boolean} singleExpand <tt>true</tt> if only 1 node per branch may be expanded
+ * @cfg {Object} selModel A tree selection model to use with this TreePanel (defaults to an {@link Ext.tree.DefaultSelectionModel})
+ * @cfg {Boolean} trackMouseOver <tt>false</tt> to disable mouse over highlighting
+ * @cfg {Ext.tree.TreeLoader} loader A {@link Ext.tree.TreeLoader} for use with this TreePanel
+ * @cfg {String} pathSeparator The token used to separate sub-paths in path strings (defaults to <tt>'/'</tt>)
+ * @cfg {Boolean} useArrows <tt>true</tt> to use Vista-style arrows in the tree (defaults to <tt>false</tt>)
+ * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+ *
+ * @constructor
+ * @param {Object} config
+ * @xtype treepanel
+ */
+Ext.tree.TreePanel = Ext.extend(Ext.Panel, {
+    rootVisible : true,
+    animate : Ext.enableFx,
+    lines : true,
+    enableDD : false,
+    hlDrop : Ext.enableFx,
+    pathSeparator : '/',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents : [],
+
+    initComponent : function(){
+        Ext.tree.TreePanel.superclass.initComponent.call(this);
+
+        if(!this.eventModel){
+            this.eventModel = new Ext.tree.TreeEventModel(this);
+        }
+
+        // initialize the loader
+        var l = this.loader;
+        if(!l){
+            l = new Ext.tree.TreeLoader({
+                dataUrl: this.dataUrl,
+                requestMethod: this.requestMethod
+            });
+        }else if(Ext.isObject(l) && !l.load){
+            l = new Ext.tree.TreeLoader(l);
+        }
+        this.loader = l;
+
+        this.nodeHash = {};
+
+        /**
+        * The root node of this tree.
+        * @type Ext.tree.TreeNode
+        * @property root
+        */
+        if(this.root){
+            var r = this.root;
+            delete this.root;
+            this.setRootNode(r);
+        }
+
+
+        this.addEvents(
+
+            /**
+            * @event append
+            * Fires when a new child node is appended to a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The newly appended node
+            * @param {Number} index The index of the newly appended node
+            */
+           'append',
+           /**
+            * @event remove
+            * Fires when a child node is removed from a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node removed
+            */
+           'remove',
+           /**
+            * @event movenode
+            * Fires when a node is moved to a new location in the tree
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node moved
+            * @param {Node} oldParent The old parent of this node
+            * @param {Node} newParent The new parent of this node
+            * @param {Number} index The index it was moved to
+            */
+           'movenode',
+           /**
+            * @event insert
+            * Fires when a new child node is inserted in a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node inserted
+            * @param {Node} refNode The child node the node was inserted before
+            */
+           'insert',
+           /**
+            * @event beforeappend
+            * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be appended
+            */
+           'beforeappend',
+           /**
+            * @event beforeremove
+            * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be removed
+            */
+           'beforeremove',
+           /**
+            * @event beforemovenode
+            * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node being moved
+            * @param {Node} oldParent The parent of the node
+            * @param {Node} newParent The new parent the node is moving to
+            * @param {Number} index The index it is being moved to
+            */
+           'beforemovenode',
+           /**
+            * @event beforeinsert
+            * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be inserted
+            * @param {Node} refNode The child node the node is being inserted before
+            */
+            'beforeinsert',
+
+            /**
+            * @event beforeload
+            * Fires before a node is loaded, return false to cancel
+            * @param {Node} node The node being loaded
+            */
+            'beforeload',
+            /**
+            * @event load
+            * Fires when a node is loaded
+            * @param {Node} node The node that was loaded
+            */
+            'load',
+            /**
+            * @event textchange
+            * Fires when the text for a node is changed
+            * @param {Node} node The node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpandnode
+            * Fires before a node is expanded, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpandnode',
+            /**
+            * @event beforecollapsenode
+            * Fires before a node is collapsed, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapsenode',
+            /**
+            * @event expandnode
+            * Fires when a node is expanded
+            * @param {Node} node The node
+            */
+            'expandnode',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of a node changes
+            * @param {Node} node The node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapsenode
+            * Fires when a node is collapsed
+            * @param {Node} node The node
+            */
+            'collapsenode',
+            /**
+            * @event beforeclick
+            * Fires before click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when a node is clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event containerclick
+            * Fires when the tree container is clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerclick',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when a node is double clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event containerdblclick
+            * Fires when the tree container is double clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerdblclick',
+            /**
+            * @event contextmenu
+            * Fires when a node is right clicked. To display a context menu in response to this
+            * event, first create a Menu object (see {@link Ext.menu.Menu} for details), then add
+            * a handler for this event:<pre><code>
+new Ext.tree.TreePanel({
+    title: 'My TreePanel',
+    root: new Ext.tree.AsyncTreeNode({
+        text: 'The Root',
+        children: [
+            { text: 'Child node 1', leaf: true },
+            { text: 'Child node 2', leaf: true }
+        ]
+    }),
+    contextMenu: new Ext.menu.Menu({
+        items: [{
+            id: 'delete-node',
+            text: 'Delete Node'
+        }],
+        listeners: {
+            itemclick: function(item) {
+                switch (item.id) {
+                    case 'delete-node':
+                        var n = item.parentMenu.contextNode;
+                        if (n.parentNode) {
+                            n.remove();
+                        }
+                        break;
+                }
+            }
+        }
+    }),
+    listeners: {
+        contextmenu: function(node, e) {
+//          Register the context node with the menu so that a Menu Item's handler function can access
+//          it via its {@link Ext.menu.BaseItem#parentMenu parentMenu} property.
+            node.select();
+            var c = node.getOwnerTree().contextMenu;
+            c.contextNode = node;
+            c.showAt(e.getXY());
+        }
+    }
+});
+</code></pre>
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event containercontextmenu
+            * Fires when the tree container is right clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containercontextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for a node are rendered
+            * @param {Node} node The node
+            */
+            'beforechildrenrendered',
+           /**
+             * @event startdrag
+             * Fires when a node starts being dragged
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'startdrag',
+            /**
+             * @event enddrag
+             * Fires when a drag operation is complete
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'enddrag',
+            /**
+             * @event dragdrop
+             * Fires when a dragged node is dropped on a valid DD target
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {DD} dd The dd it was dropped on
+             * @param {event} e The raw browser event
+             */
+            'dragdrop',
+            /**
+             * @event beforenodedrop
+             * Fires when a DD object is dropped on a node in this tree for preprocessing. Return false to cancel the drop. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source <b>OR</b> you can supply node(s)
+             * to be inserted by setting them on this object.</li>
+             * <li>cancel - Set this to true to cancel the drop.</li>
+             * <li>dropStatus - If the default drop action is cancelled but the drop is valid, setting this to true
+             * will prevent the animated 'repair' from appearing.</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'beforenodedrop',
+            /**
+             * @event nodedrop
+             * Fires after a DD object is dropped on a node in this tree. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Dropped node(s).</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'nodedrop',
+             /**
+             * @event nodedragover
+             * Fires when a tree node is being targeted for a drag drop, return false to signal drop not allowed. The dragOverEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source.</li>
+             * <li>cancel - Set this to true to signal drop not allowed.</li>
+             * </ul>
+             * @param {Object} dragOverEvent
+             */
+            'nodedragover'
+        );
+        if(this.singleExpand){
+            this.on('beforeexpandnode', this.restrictExpand, this);
+        }
+    },
+
+    // private
+    proxyNodeEvent : function(ename, a1, a2, a3, a4, a5, a6){
+        if(ename == 'collapse' || ename == 'expand' || ename == 'beforecollapse' || ename == 'beforeexpand' || ename == 'move' || ename == 'beforemove'){
+            ename = ename+'node';
+        }
+        // args inline for performance while bubbling events
+        return this.fireEvent(ename, a1, a2, a3, a4, a5, a6);
+    },
+
+
+    /**
+     * Returns this root node for this tree
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree. If the TreePanel has already rendered a root node, the
+     * previous root node (and all of its descendants) are destroyed before the new root node is rendered.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.destroyRoot();
+        if(!node.render){ // attributes passed
+            node = this.loader.createNode(node);
+        }
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        if(!this.rootVisible){
+            var uiP = node.attributes.uiProvider;
+            node.ui = uiP ? new uiP(node) : new Ext.tree.RootTreeNodeUI(node);
+        }
+        if(this.innerCt){
+            this.clearInnerCt();
+            this.renderRoot();
+        }
+        return node;
+    },
+    
+    clearInnerCt : function(){
+        this.innerCt.update('');    
+    },
+    
+    // private
+    renderRoot : function(){
+        this.root.render();
+        if(!this.rootVisible){
+            this.root.renderChildren();
+        }
+    },
+
+    /**
+     * Gets a node in this tree by its id
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    // private
+    toString : function(){
+        return '[Tree'+(this.id?' '+this.id:'')+']';
+    },
+
+    // private
+    restrictExpand : function(node){
+        var p = node.parentNode;
+        if(p){
+            if(p.expandedChild && p.expandedChild.parentNode == p){
+                p.expandedChild.collapse();
+            }
+            p.expandedChild = node;
+        }
+    },
+
+    /**
+     * Retrieve an array of checked nodes, or an array of a specific attribute of checked nodes (e.g. 'id')
+     * @param {String} attribute (optional) Defaults to null (return the actual nodes)
+     * @param {TreeNode} startNode (optional) The node to start from, defaults to the root
+     * @return {Array}
+     */
+    getChecked : function(a, startNode){
+        startNode = startNode || this.root;
+        var r = [];
+        var f = function(){
+            if(this.attributes.checked){
+                r.push(!a ? this : (a == 'id' ? this.id : this.attributes[a]));
+            }
+        };
+        startNode.cascade(f);
+        return r;
+    },
+
+    /**
+     * Returns the default {@link Ext.tree.TreeLoader} for this TreePanel.
+     * @return {Ext.tree.TreeLoader} The TreeLoader for this TreePanel.
+     */
+    getLoader : function(){
+        return this.loader;
+    },
+
+    /**
+     * Expand all nodes
+     */
+    expandAll : function(){
+        this.root.expand(true);
+    },
+
+    /**
+     * Collapse all nodes
+     */
+    collapseAll : function(){
+        this.root.collapse(true);
+    },
+
+    /**
+     * Returns the selection model used by this TreePanel.
+     * @return {TreeSelectionModel} The selection model used by this TreePanel
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.tree.DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Expands a specified path in this TreePanel. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the expand is complete. The callback will be called with
+     * (bSuccess, oLastNode) where bSuccess is if the expand was successful and oLastNode is the last node that was expanded.
+     */
+    expandPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var curNode = this.root;
+        if(curNode.attributes[attr] != keys[1]){ // invalid root
+            if(callback){
+                callback(false, null);
+            }
+            return;
+        }
+        var index = 1;
+        var f = function(){
+            if(++index == keys.length){
+                if(callback){
+                    callback(true, curNode);
+                }
+                return;
+            }
+            var c = curNode.findChild(attr, keys[index]);
+            if(!c){
+                if(callback){
+                    callback(false, curNode);
+                }
+                return;
+            }
+            curNode = c;
+            c.expand(false, false, f);
+        };
+        curNode.expand(false, false, f);
+    },
+
+    /**
+     * Selects the node in this tree at the specified path. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the selection is complete. The callback will be called with
+     * (bSuccess, oSelNode) where bSuccess is if the selection was successful and oSelNode is the selected node.
+     */
+    selectPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator),
+            v = keys.pop();
+        if(keys.length > 1){
+            var f = function(success, node){
+                if(success && node){
+                    var n = node.findChild(attr, v);
+                    if(n){
+                        n.select();
+                        if(callback){
+                            callback(true, n);
+                        }
+                    }else if(callback){
+                        callback(false, n);
+                    }
+                }else{
+                    if(callback){
+                        callback(false, n);
+                    }
+                }
+            };
+            this.expandPath(keys.join(this.pathSeparator), attr, f);
+        }else{
+            this.root.select();
+            if(callback){
+                callback(true, this.root);
+            }
+        }
+    },
+
+    /**
+     * Returns the underlying Element for this tree
+     * @return {Ext.Element} The Element
+     */
+    getTreeEl : function(){
+        return this.body;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.tree.TreePanel.superclass.onRender.call(this, ct, position);
+        this.el.addClass('x-tree');
+        this.innerCt = this.body.createChild({tag:'ul',
+               cls:'x-tree-root-ct ' +
+               (this.useArrows ? 'x-tree-arrows' : this.lines ? 'x-tree-lines' : 'x-tree-no-lines')});
+    },
+
+    // private
+    initEvents : function(){
+        Ext.tree.TreePanel.superclass.initEvents.call(this);
+
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.body);
+        }
+        if((this.enableDD || this.enableDrop) && !this.dropZone){
+           /**
+            * The dropZone used by this tree if drop is enabled (see {@link #enableDD} or {@link #enableDrop})
+            * @property dropZone
+            * @type Ext.tree.TreeDropZone
+            */
+             this.dropZone = new Ext.tree.TreeDropZone(this, this.dropConfig || {
+               ddGroup: this.ddGroup || 'TreeDD', appendOnly: this.ddAppendOnly === true
+           });
+        }
+        if((this.enableDD || this.enableDrag) && !this.dragZone){
+           /**
+            * The dragZone used by this tree if drag is enabled (see {@link #enableDD} or {@link #enableDrag})
+            * @property dragZone
+            * @type Ext.tree.TreeDragZone
+            */
+            this.dragZone = new Ext.tree.TreeDragZone(this, this.dragConfig || {
+               ddGroup: this.ddGroup || 'TreeDD',
+               scroll: this.ddScroll
+           });
+        }
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.tree.TreePanel.superclass.afterRender.call(this);
+        this.renderRoot();
+    },
+
+    beforeDestroy : function(){
+        if(this.rendered){
+            Ext.dd.ScrollManager.unregister(this.body);
+            Ext.destroy(this.dropZone, this.dragZone);
+        }
+        this.destroyRoot();
+        Ext.destroy(this.loader);
+        this.nodeHash = this.root = this.loader = null;
+        Ext.tree.TreePanel.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * Destroy the root node. Not included by itself because we need to pass the silent parameter.
+     * @private
+     */
+    destroyRoot : function(){
+        if(this.root && this.root.destroy){
+            this.root.destroy(true);
+        }
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @method removeAll
+     * @hide
+     */
+    /**
+     * @event afterLayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+
+Ext.tree.TreePanel.nodeTypes = {};
+
+Ext.reg('treepanel', Ext.tree.TreePanel);Ext.tree.TreeEventModel = function(tree){
+    this.tree = tree;
+    this.tree.on('render', this.initEvents, this);
+};
+
+Ext.tree.TreeEventModel.prototype = {
+    initEvents : function(){
+        var t = this.tree;
+
+        if(t.trackMouseOver !== false){
+            t.mon(t.innerCt, {
+                scope: this,
+                mouseover: this.delegateOver,
+                mouseout: this.delegateOut
+            });
+        }
+        t.mon(t.getTreeEl(), {
+            scope: this,
+            click: this.delegateClick,
+            dblclick: this.delegateDblClick,
+            contextmenu: this.delegateContextMenu
+        });
+    },
+
+    getNode : function(e){
+        var t;
+        if(t = e.getTarget('.x-tree-node-el', 10)){
+            var id = Ext.fly(t, '_treeEvents').getAttribute('tree-node-id', 'ext');
+            if(id){
+                return this.tree.getNodeById(id);
+            }
+        }
+        return null;
+    },
+
+    getNodeTarget : function(e){
+        var t = e.getTarget('.x-tree-node-icon', 1);
+        if(!t){
+            t = e.getTarget('.x-tree-node-el', 6);
+        }
+        return t;
+    },
+
+    delegateOut : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            var n = this.getNode(e);
+            this.onIconOut(e, n);
+            if(n == this.lastEcOver){
+                delete this.lastEcOver;
+            }
+        }
+        if((t = this.getNodeTarget(e)) && !e.within(t, true)){
+            this.onNodeOut(e, this.getNode(e));
+        }
+    },
+
+    delegateOver : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(Ext.isGecko && !this.trackingDoc){ // prevent hanging in FF
+            Ext.getBody().on('mouseover', this.trackExit, this);
+            this.trackingDoc = true;
+        }
+        if(this.lastEcOver){ // prevent hung highlight
+            this.onIconOut(e, this.lastEcOver);
+            delete this.lastEcOver;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            this.lastEcOver = this.getNode(e);
+            this.onIconOver(e, this.lastEcOver);
+        }
+        if(t = this.getNodeTarget(e)){
+            this.onNodeOver(e, this.getNode(e));
+        }
+    },
+
+    trackExit : function(e){
+        if(this.lastOverNode){
+            if(this.lastOverNode.ui && !e.within(this.lastOverNode.ui.getEl())){
+                this.onNodeOut(e, this.lastOverNode);
+            }
+            delete this.lastOverNode;
+            Ext.getBody().un('mouseover', this.trackExit, this);
+            this.trackingDoc = false;
+        }
+
+    },
+
+    delegateClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(e.getTarget('input[type=checkbox]', 1)){
+                this.onCheckboxClick(e, this.getNode(e));
+            }else if(e.getTarget('.x-tree-ec-icon', 1)){
+                this.onIconClick(e, this.getNode(e));
+            }else if(this.getNodeTarget(e)){
+                this.onNodeClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'click');
+        }
+    },
+
+    delegateDblClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeDblClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'dblclick');
+        }
+    },
+
+    delegateContextMenu : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeContextMenu(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'contextmenu');
+        }
+    },
+    
+    checkContainerEvent: function(e, type){
+        if(this.disabled){
+            e.stopEvent();
+            return false;
+        }
+        this.onContainerEvent(e, type);    
+    },
+
+    onContainerEvent: function(e, type){
+        this.tree.fireEvent('container' + type, this.tree, e);
+    },
+
+    onNodeClick : function(e, node){
+        node.ui.onClick(e);
+    },
+
+    onNodeOver : function(e, node){
+        this.lastOverNode = node;
+        node.ui.onOver(e);
+    },
+
+    onNodeOut : function(e, node){
+        node.ui.onOut(e);
+    },
+
+    onIconOver : function(e, node){
+        node.ui.addClass('x-tree-ec-over');
+    },
+
+    onIconOut : function(e, node){
+        node.ui.removeClass('x-tree-ec-over');
+    },
+
+    onIconClick : function(e, node){
+        node.ui.ecClick(e);
+    },
+
+    onCheckboxClick : function(e, node){
+        node.ui.onCheckChange(e);
+    },
+
+    onNodeDblClick : function(e, node){
+        node.ui.onDblClick(e);
+    },
+
+    onNodeContextMenu : function(e, node){
+        node.ui.onContextMenu(e);
+    },
+
+    beforeEvent : function(e){
+        var node = this.getNode(e);
+        if(this.disabled || !node || !node.ui){
+            e.stopEvent();
+            return false;
+        }
+        return true;
+    },
+
+    disable: function(){
+        this.disabled = true;
+    },
+
+    enable: function(){
+        this.disabled = false;
+    }
+};/**
+ * @class Ext.tree.DefaultSelectionModel
+ * @extends Ext.util.Observable
+ * The default single selection for a TreePanel.
+ */
+Ext.tree.DefaultSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNode = null;
+   
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected node changes
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             */
+            'selectionchange',
+
+            /**
+             * @event beforeselect
+             * Fires before the selected node changes, return false to cancel the change
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             * @param {TreeNode} node the old selection
+             */
+            'beforeselect'
+        );
+
+        Ext.apply(this, config);
+        Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node);
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, /* private*/ selectNextNode){
+        // If node is hidden, select the next node in whatever direction was being moved in.
+        if (!Ext.fly(node.ui.wrap).isVisible() && selectNextNode) {
+            return selectNextNode.call(this, node);
+        }
+        var last = this.selNode;
+        if(node == last){
+            node.ui.onSelectedChange(true);
+        }else if(this.fireEvent('beforeselect', this, node, last) !== false){
+            if(last && last.ui){
+                last.ui.onSelectedChange(false);
+            }
+            this.selNode = node;
+            node.ui.onSelectedChange(true);
+            this.fireEvent('selectionchange', this, node, last);
+        }
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    unselect : function(node, silent){
+        if(this.selNode == node){
+            this.clearSelections(silent);
+        }    
+    },
+    
+    /**
+     * Clear all selections
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    clearSelections : function(silent){
+        var n = this.selNode;
+        if(n){
+            n.ui.onSelectedChange(false);
+            this.selNode = null;
+            if(silent !== true){
+                this.fireEvent('selectionchange', this, null);
+            }
+        }
+        return n;
+    },
+    
+    /**
+     * Get the selected node
+     * @return {TreeNode} The selected node
+     */
+    getSelectedNode : function(){
+        return this.selNode;    
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selNode == node;  
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectPrevious : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        var ps = s.previousSibling;
+        if(ps){
+            if(!ps.isExpanded() || ps.childNodes.length < 1){
+                return this.select(ps, this.selectPrevious);
+            } else{
+                var lc = ps.lastChild;
+                while(lc && lc.isExpanded() && Ext.fly(lc.ui.wrap).isVisible() && lc.childNodes.length > 0){
+                    lc = lc.lastChild;
+                }
+                return this.select(lc, this.selectPrevious);
+            }
+        } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
+            return this.select(s.parentNode, this.selectPrevious);
+        }
+        return null;
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectNext : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        if(s.firstChild && s.isExpanded() && Ext.fly(s.ui.wrap).isVisible()){
+             return this.select(s.firstChild, this.selectNext);
+         }else if(s.nextSibling){
+             return this.select(s.nextSibling, this.selectNext);
+         }else if(s.parentNode){
+            var newS = null;
+            s.parentNode.bubble(function(){
+                if(this.nextSibling){
+                    newS = this.getOwnerTree().selModel.select(this.nextSibling, this.selectNext);
+                    return false;
+                }
+            });
+            return newS;
+         }
+        return null;
+    },
+
+    onKeyDown : function(e){
+        var s = this.selNode || this.lastSelNode;
+        // undesirable, but required
+        var sm = this;
+        if(!s){
+            return;
+        }
+        var k = e.getKey();
+        switch(k){
+             case e.DOWN:
+                 e.stopEvent();
+                 this.selectNext();
+             break;
+             case e.UP:
+                 e.stopEvent();
+                 this.selectPrevious();
+             break;
+             case e.RIGHT:
+                 e.preventDefault();
+                 if(s.hasChildNodes()){
+                     if(!s.isExpanded()){
+                         s.expand();
+                     }else if(s.firstChild){
+                         this.select(s.firstChild, e);
+                     }
+                 }
+             break;
+             case e.LEFT:
+                 e.preventDefault();
+                 if(s.hasChildNodes() && s.isExpanded()){
+                     s.collapse();
+                 }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+        };
+    }
+});
+
+/**
+ * @class Ext.tree.MultiSelectionModel
+ * @extends Ext.util.Observable
+ * Multi selection for a TreePanel.
+ */
+Ext.tree.MultiSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNodes = [];
+        this.selMap = {};
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change
+             * @param {MultiSelectionModel} this
+             * @param {Array} nodes Array of the selected nodes
+             */
+            'selectionchange'
+        );
+        Ext.apply(this, config);
+        Ext.tree.MultiSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        if(e.ctrlKey && this.isSelected(node)){
+            this.unselect(node);
+        }else{
+            this.select(node, e, e.ctrlKey);
+        }
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @param {EventObject} e (optional) An event associated with the selection
+     * @param {Boolean} keepExisting True to retain existing selections
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, e, keepExisting){
+        if(keepExisting !== true){
+            this.clearSelections(true);
+        }
+        if(this.isSelected(node)){
+            this.lastSelNode = node;
+            return node;
+        }
+        this.selNodes.push(node);
+        this.selMap[node.id] = node;
+        this.lastSelNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, this.selNodes);
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     */
+    unselect : function(node){
+        if(this.selMap[node.id]){
+            node.ui.onSelectedChange(false);
+            var sn = this.selNodes;
+            var index = sn.indexOf(node);
+            if(index != -1){
+                this.selNodes.splice(index, 1);
+            }
+            delete this.selMap[node.id];
+            this.fireEvent('selectionchange', this, this.selNodes);
+        }
+    },
+    
+    /**
+     * Clear all selections
+     */
+    clearSelections : function(suppressEvent){
+        var sn = this.selNodes;
+        if(sn.length > 0){
+            for(var i = 0, len = sn.length; i < len; i++){
+                sn[i].ui.onSelectedChange(false);
+            }
+            this.selNodes = [];
+            this.selMap = {};
+            if(suppressEvent !== true){
+                this.fireEvent('selectionchange', this, this.selNodes);
+            }
+        }
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selMap[node.id] ? true : false;  
+    },
+    
+    /**
+     * Returns an array of the selected nodes
+     * @return {Array}
+     */
+    getSelectedNodes : function(){
+        return this.selNodes.concat([]);
+    },
+
+    onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,
+
+    selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,
+
+    selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious
+});/**
+ * @class Ext.data.Tree
+ * @extends Ext.util.Observable
+ * Represents a tree data structure and bubbles all the events for its nodes. The nodes
+ * in the tree have most standard DOM functionality.
+ * @constructor
+ * @param {Node} root (optional) The root node
+ */
+Ext.data.Tree = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(root){
+        this.nodeHash = {};
+        /**
+         * The root node for this tree
+         * @type Node
+         */
+        this.root = null;
+        if(root){
+            this.setRootNode(root);
+        }
+        this.addEvents(
+            /**
+             * @event append
+             * Fires when a new child node is appended to a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append",
+            /**
+             * @event remove
+             * Fires when a child node is removed from a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node removed
+             */
+            "remove",
+            /**
+             * @event move
+             * Fires when a node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node moved
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move",
+            /**
+             * @event insert
+             * Fires when a new child node is inserted in a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert",
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend",
+            /**
+             * @event beforeremove
+             * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove",
+            /**
+             * @event beforemove
+             * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node being moved
+             * @param {Node} oldParent The parent of the node
+             * @param {Node} newParent The new parent the node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove",
+            /**
+             * @event beforeinsert
+             * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be inserted
+             * @param {Node} refNode The child node the node is being inserted before
+             */
+            "beforeinsert"
+        );
+        Ext.data.Tree.superclass.constructor.call(this);        
+    },
+    
+    /**
+     * @cfg {String} pathSeparator
+     * The token used to separate paths in node ids (defaults to '/').
+     */
+    pathSeparator: "/",
+
+    // private
+    proxyNodeEvent : function(){
+        return this.fireEvent.apply(this, arguments);
+    },
+
+    /**
+     * Returns the root node for this tree.
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        return node;
+    },
+
+    /**
+     * Gets a node in this tree by its id.
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    toString : function(){
+        return "[Tree"+(this.id?" "+this.id:"")+"]";
+    }
+});
+
+/**
+ * @class Ext.data.Node
+ * @extends Ext.util.Observable
+ * @cfg {Boolean} leaf true if this node is a leaf and does not have children
+ * @cfg {String} id The id for this node. If one is not specified, one is generated.
+ * @constructor
+ * @param {Object} attributes The attributes/config for the node
+ */
+Ext.data.Node = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(attributes){
+        /**
+         * The attributes supplied for the node. You can use this property to access any custom attributes you supplied.
+         * @type {Object}
+         */
+        this.attributes = attributes || {};
+        this.leaf = this.attributes.leaf;
+        /**
+         * The node id. @type String
+         */
+        this.id = this.attributes.id;
+        if(!this.id){
+            this.id = Ext.id(null, "xnode-");
+            this.attributes.id = this.id;
+        }
+        /**
+         * All child nodes of this node. @type Array
+         */
+        this.childNodes = [];
+        /**
+         * The parent node for this node. @type Node
+         */
+        this.parentNode = null;
+        /**
+         * The first direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.firstChild = null;
+        /**
+         * The last direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.lastChild = null;
+        /**
+         * The node immediately preceding this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.previousSibling = null;
+        /**
+         * The node immediately following this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.nextSibling = null;
+
+        this.addEvents({
+            /**
+             * @event append
+             * Fires when a new child node is appended
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append" : true,
+            /**
+             * @event remove
+             * Fires when a child node is removed
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The removed node
+             */
+            "remove" : true,
+            /**
+             * @event move
+             * Fires when this node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move" : true,
+            /**
+             * @event insert
+             * Fires when a new child node is inserted.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert" : true,
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend" : true,
+            /**
+             * @event beforeremove
+             * Fires before a child is removed, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove" : true,
+            /**
+             * @event beforemove
+             * Fires before this node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The parent of this node
+             * @param {Node} newParent The new parent this node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove" : true,
+             /**
+              * @event beforeinsert
+              * Fires before a new child is inserted, return false to cancel the insert.
+              * @param {Tree} tree The owner tree
+              * @param {Node} this This node
+              * @param {Node} node The child node to be inserted
+              * @param {Node} refNode The child node the node is being inserted before
+              */
+            "beforeinsert" : true
+        });
+        this.listeners = this.attributes.listeners;
+        Ext.data.Node.superclass.constructor.call(this);    
+    },
+    
+    // private
+    fireEvent : function(evtName){
+        // first do standard event for this node
+        if(Ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
+            return false;
+        }
+        // then bubble it up to the tree if the event wasn't cancelled
+        var ot = this.getOwnerTree();
+        if(ot){
+            if(ot.proxyNodeEvent.apply(ot, arguments) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Returns true if this node is a leaf
+     * @return {Boolean}
+     */
+    isLeaf : function(){
+        return this.leaf === true;
+    },
+
+    // private
+    setFirstChild : function(node){
+        this.firstChild = node;
+    },
+
+    //private
+    setLastChild : function(node){
+        this.lastChild = node;
+    },
+
+
+    /**
+     * Returns true if this node is the last child of its parent
+     * @return {Boolean}
+     */
+    isLast : function(){
+       return (!this.parentNode ? true : this.parentNode.lastChild == this);
+    },
+
+    /**
+     * Returns true if this node is the first child of its parent
+     * @return {Boolean}
+     */
+    isFirst : function(){
+       return (!this.parentNode ? true : this.parentNode.firstChild == this);
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, else false.
+     * @return {Boolean}
+     */
+    hasChildNodes : function(){
+        return !this.isLeaf() && this.childNodes.length > 0;
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, or if the <tt>expandable</tt>
+     * node attribute is explicitly specified as true (see {@link #attributes}), otherwise returns false.
+     * @return {Boolean}
+     */
+    isExpandable : function(){
+        return this.attributes.expandable || this.hasChildNodes();
+    },
+
+    /**
+     * Insert node(s) as the last child node of this node.
+     * @param {Node/Array} node The node or Array of nodes to append
+     * @return {Node} The appended node if single append, or null if an array was passed
+     */
+    appendChild : function(node){
+        var multi = false;
+        if(Ext.isArray(node)){
+            multi = node;
+        }else if(arguments.length > 1){
+            multi = arguments;
+        }
+        // if passed an array or multiple args do them one by one
+        if(multi){
+            for(var i = 0, len = multi.length; i < len; i++) {
+                this.appendChild(multi[i]);
+            }
+        }else{
+            if(this.fireEvent("beforeappend", this.ownerTree, this, node) === false){
+                return false;
+            }
+            var index = this.childNodes.length;
+            var oldParent = node.parentNode;
+            // it's a move, make sure we move it cleanly
+            if(oldParent){
+                if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index) === false){
+                    return false;
+                }
+                oldParent.removeChild(node);
+            }
+            index = this.childNodes.length;
+            if(index === 0){
+                this.setFirstChild(node);
+            }
+            this.childNodes.push(node);
+            node.parentNode = this;
+            var ps = this.childNodes[index-1];
+            if(ps){
+                node.previousSibling = ps;
+                ps.nextSibling = node;
+            }else{
+                node.previousSibling = null;
+            }
+            node.nextSibling = null;
+            this.setLastChild(node);
+            node.setOwnerTree(this.getOwnerTree());
+            this.fireEvent("append", this.ownerTree, this, node, index);
+            if(oldParent){
+                node.fireEvent("move", this.ownerTree, node, oldParent, this, index);
+            }
+            return node;
+        }
+    },
+
+    /**
+     * Removes a child node from this node.
+     * @param {Node} node The node to remove
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} The removed node
+     */
+    removeChild : function(node, destroy){
+        var index = this.childNodes.indexOf(node);
+        if(index == -1){
+            return false;
+        }
+        if(this.fireEvent("beforeremove", this.ownerTree, this, node) === false){
+            return false;
+        }
+
+        // remove it from childNodes collection
+        this.childNodes.splice(index, 1);
+
+        // update siblings
+        if(node.previousSibling){
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+        if(node.nextSibling){
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+
+        // update child refs
+        if(this.firstChild == node){
+            this.setFirstChild(node.nextSibling);
+        }
+        if(this.lastChild == node){
+            this.setLastChild(node.previousSibling);
+        }
+
+        this.fireEvent("remove", this.ownerTree, this, node);
+        if(destroy){
+            node.destroy(true);
+        }else{
+            node.clear();
+        }
+        return node;
+    },
+
+    // private
+    clear : function(destroy){
+        // clear any references from the node
+        this.setOwnerTree(null, destroy);
+        this.parentNode = this.previousSibling = this.nextSibling = null;
+        if(destroy){
+            this.firstChild = this.lastChild = null;
+        }
+    },
+
+    /**
+     * Destroys the node.
+     */
+    destroy : function(/* private */ silent){
+        /*
+         * Silent is to be used in a number of cases
+         * 1) When setRootNode is called.
+         * 2) When destroy on the tree is called
+         * 3) For destroying child nodes on a node
+         */
+        if(silent === true){
+            this.purgeListeners();
+            this.clear(true);
+            Ext.each(this.childNodes, function(n){
+                n.destroy(true);
+            });
+            this.childNodes = null;
+        }else{
+            this.remove(true);
+        }
+    },
+
+    /**
+     * Inserts the first node before the second node in this nodes childNodes collection.
+     * @param {Node} node The node to insert
+     * @param {Node} refNode The node to insert before (if null the node is appended)
+     * @return {Node} The inserted node
+     */
+    insertBefore : function(node, refNode){
+        if(!refNode){ // like standard Dom, refNode can be null for append
+            return this.appendChild(node);
+        }
+        // nothing to do
+        if(node == refNode){
+            return false;
+        }
+
+        if(this.fireEvent("beforeinsert", this.ownerTree, this, node, refNode) === false){
+            return false;
+        }
+        var index = this.childNodes.indexOf(refNode);
+        var oldParent = node.parentNode;
+        var refIndex = index;
+
+        // when moving internally, indexes will change after remove
+        if(oldParent == this && this.childNodes.indexOf(node) < index){
+            refIndex--;
+        }
+
+        // it's a move, make sure we move it cleanly
+        if(oldParent){
+            if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index, refNode) === false){
+                return false;
+            }
+            oldParent.removeChild(node);
+        }
+        if(refIndex === 0){
+            this.setFirstChild(node);
+        }
+        this.childNodes.splice(refIndex, 0, node);
+        node.parentNode = this;
+        var ps = this.childNodes[refIndex-1];
+        if(ps){
+            node.previousSibling = ps;
+            ps.nextSibling = node;
+        }else{
+            node.previousSibling = null;
+        }
+        node.nextSibling = refNode;
+        refNode.previousSibling = node;
+        node.setOwnerTree(this.getOwnerTree());
+        this.fireEvent("insert", this.ownerTree, this, node, refNode);
+        if(oldParent){
+            node.fireEvent("move", this.ownerTree, node, oldParent, this, refIndex, refNode);
+        }
+        return node;
+    },
+
+    /**
+     * Removes this node from its parent
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    remove : function(destroy){
+        if (this.parentNode) {
+            this.parentNode.removeChild(this, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all child nodes from this node.
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    removeAll : function(destroy){
+        var cn = this.childNodes,
+            n;
+        while((n = cn[0])){
+            this.removeChild(n, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Returns the child node at the specified index.
+     * @param {Number} index
+     * @return {Node}
+     */
+    item : function(index){
+        return this.childNodes[index];
+    },
+
+    /**
+     * Replaces one child node in this node with another.
+     * @param {Node} newChild The replacement node
+     * @param {Node} oldChild The node to replace
+     * @return {Node} The replaced node
+     */
+    replaceChild : function(newChild, oldChild){
+        var s = oldChild ? oldChild.nextSibling : null;
+        this.removeChild(oldChild);
+        this.insertBefore(newChild, s);
+        return oldChild;
+    },
+
+    /**
+     * Returns the index of a child node
+     * @param {Node} node
+     * @return {Number} The index of the node or -1 if it was not found
+     */
+    indexOf : function(child){
+        return this.childNodes.indexOf(child);
+    },
+
+    /**
+     * Returns the tree this node is in.
+     * @return {Tree}
+     */
+    getOwnerTree : function(){
+        // if it doesn't have one, look for one
+        if(!this.ownerTree){
+            var p = this;
+            while(p){
+                if(p.ownerTree){
+                    this.ownerTree = p.ownerTree;
+                    break;
+                }
+                p = p.parentNode;
+            }
+        }
+        return this.ownerTree;
+    },
+
+    /**
+     * Returns depth of this node (the root node has a depth of 0)
+     * @return {Number}
+     */
+    getDepth : function(){
+        var depth = 0;
+        var p = this;
+        while(p.parentNode){
+            ++depth;
+            p = p.parentNode;
+        }
+        return depth;
+    },
+
+    // private
+    setOwnerTree : function(tree, destroy){
+        // if it is a move, we need to update everyone
+        if(tree != this.ownerTree){
+            if(this.ownerTree){
+                this.ownerTree.unregisterNode(this);
+            }
+            this.ownerTree = tree;
+            // If we're destroying, we don't need to recurse since it will be called on each child node
+            if(destroy !== true){
+                Ext.each(this.childNodes, function(n){
+                    n.setOwnerTree(tree);
+                });
+            }
+            if(tree){
+                tree.registerNode(this);
+            }
+        }
+    },
+
+    /**
+     * Changes the id of this node.
+     * @param {String} id The new id for the node.
+     */
+    setId: function(id){
+        if(id !== this.id){
+            var t = this.ownerTree;
+            if(t){
+                t.unregisterNode(this);
+            }
+            this.id = this.attributes.id = id;
+            if(t){
+                t.registerNode(this);
+            }
+            this.onIdChange(id);
+        }
+    },
+
+    // private
+    onIdChange: Ext.emptyFn,
+
+    /**
+     * Returns the path for this node. The path can be used to expand or select this node programmatically.
+     * @param {String} attr (optional) The attr to use for the path (defaults to the node's id)
+     * @return {String} The path
+     */
+    getPath : function(attr){
+        attr = attr || "id";
+        var p = this.parentNode;
+        var b = [this.attributes[attr]];
+        while(p){
+            b.unshift(p.attributes[attr]);
+            p = p.parentNode;
+        }
+        var sep = this.getOwnerTree().pathSeparator;
+        return sep + b.join(sep);
+    },
+
+    /**
+     * Bubbles up the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.parentNode;
+        }
+    },
+
+    /**
+     * Cascades down the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+                cs[i].cascade(fn, scope, args);
+            }
+        }
+    },
+
+    /**
+     * Interates the child nodes of this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the iteration stops.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node in the iteration.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    eachChild : function(fn, scope, args){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+            if(fn.apply(scope || cs[i], args || [cs[i]]) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Finds the first child that has the attribute with the specified value.
+     * @param {String} attribute The attribute name
+     * @param {Mixed} value The value to search for
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChild : function(attribute, value, deep){
+        return this.findChildBy(function(){
+            return this.attributes[attribute] == value;
+        }, null, deep);
+    },
+
+    /**
+     * Finds the first child by a custom function. The child matches if the function passed returns <code>true</code>.
+     * @param {Function} fn A function which must return <code>true</code> if the passed Node is the required Node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Node being tested.
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChildBy : function(fn, scope, deep){
+        var cs = this.childNodes,
+            len = cs.length,
+            i = 0,
+            n,
+            res;
+        for(; i < len; i++){
+            n = cs[i];
+            if(fn.call(scope || n, n) === true){
+                return n;
+            }else if (deep){
+                res = n.findChildBy(fn, scope, deep);
+                if(res != null){
+                    return res;
+                }
+            }
+            
+        }
+        return null;
+    },
+
+    /**
+     * Sorts this nodes children using the supplied sort function.
+     * @param {Function} fn A function which, when passed two Nodes, returns -1, 0 or 1 depending upon required sort order.
+     * @param {Object} scope (optional)The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    sort : function(fn, scope){
+        var cs = this.childNodes;
+        var len = cs.length;
+        if(len > 0){
+            var sortFn = scope ? function(){fn.apply(scope, arguments);} : fn;
+            cs.sort(sortFn);
+            for(var i = 0; i < len; i++){
+                var n = cs[i];
+                n.previousSibling = cs[i-1];
+                n.nextSibling = cs[i+1];
+                if(i === 0){
+                    this.setFirstChild(n);
+                }
+                if(i == len-1){
+                    this.setLastChild(n);
+                }
+            }
+        }
+    },
+
+    /**
+     * Returns true if this node is an ancestor (at any point) of the passed node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    contains : function(node){
+        return node.isAncestor(this);
+    },
+
+    /**
+     * Returns true if the passed node is an ancestor (at any point) of this node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    isAncestor : function(node){
+        var p = this.parentNode;
+        while(p){
+            if(p == node){
+                return true;
+            }
+            p = p.parentNode;
+        }
+        return false;
+    },
+
+    toString : function(){
+        return "[Node"+(this.id?" "+this.id:"")+"]";
+    }
+});/**
+ * @class Ext.tree.TreeNode
+ * @extends Ext.data.Node
+ * @cfg {String} text The text for this node
+ * @cfg {Boolean} expanded true to start the node expanded
+ * @cfg {Boolean} allowDrag False to make this node undraggable if {@link #draggable} = true (defaults to true)
+ * @cfg {Boolean} allowDrop False if this node cannot have child nodes dropped on it (defaults to true)
+ * @cfg {Boolean} disabled true to start the node disabled
+ * @cfg {String} icon The path to an icon for the node. The preferred way to do this
+ * is to use the cls or iconCls attributes and add the icon via a CSS background image.
+ * @cfg {String} cls A css class to be added to the node
+ * @cfg {String} iconCls A css class to be added to the nodes icon element for applying css background images
+ * @cfg {String} href URL of the link used for the node (defaults to #)
+ * @cfg {String} hrefTarget target frame for the link
+ * @cfg {Boolean} hidden True to render hidden. (Defaults to false).
+ * @cfg {String} qtip An Ext QuickTip for the node
+ * @cfg {Boolean} expandable If set to true, the node will always show a plus/minus icon, even when empty
+ * @cfg {String} qtipCfg An Ext QuickTip config for the node (used instead of qtip)
+ * @cfg {Boolean} singleClickExpand True for single click expand on this node
+ * @cfg {Function} uiProvider A UI <b>class</b> to use for this node (defaults to Ext.tree.TreeNodeUI)
+ * @cfg {Boolean} checked True to render a checked checkbox for this node, false to render an unchecked checkbox
+ * (defaults to undefined with no checkbox rendered)
+ * @cfg {Boolean} draggable True to make this node draggable (defaults to false)
+ * @cfg {Boolean} isTarget False to not allow this node to act as a drop target (defaults to true)
+ * @cfg {Boolean} allowChildren False to not allow this node to have child nodes (defaults to true)
+ * @cfg {Boolean} editable False to not allow this node to be edited by an {@link Ext.tree.TreeEditor} (defaults to true)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node
+ */
+Ext.tree.TreeNode = Ext.extend(Ext.data.Node, {
+    
+    constructor : function(attributes){
+        attributes = attributes || {};
+        if(Ext.isString(attributes)){
+            attributes = {text: attributes};
+        }
+        this.childrenRendered = false;
+        this.rendered = false;
+        Ext.tree.TreeNode.superclass.constructor.call(this, attributes);
+        this.expanded = attributes.expanded === true;
+        this.isTarget = attributes.isTarget !== false;
+        this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;
+        this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;
+
+        /**
+         * Read-only. The text for this node. To change it use <code>{@link #setText}</code>.
+         * @type String
+         */
+        this.text = attributes.text;
+        /**
+         * True if this node is disabled.
+         * @type Boolean
+         */
+        this.disabled = attributes.disabled === true;
+        /**
+         * True if this node is hidden.
+         * @type Boolean
+         */
+        this.hidden = attributes.hidden === true;
+    
+        this.addEvents(
+            /**
+            * @event textchange
+            * Fires when the text for this node is changed
+            * @param {Node} this This node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpand
+            * Fires before this node is expanded, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpand',
+            /**
+            * @event beforecollapse
+            * Fires before this node is collapsed, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapse',
+            /**
+            * @event expand
+            * Fires when this node is expanded
+            * @param {Node} this This node
+            */
+            'expand',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of this node changes
+            * @param {Node} this This node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapse
+            * Fires when this node is collapsed
+            * @param {Node} this This node
+            */
+            'collapse',
+            /**
+            * @event beforeclick
+            * Fires before click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when this node is clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when this node is double clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event contextmenu
+            * Fires when this node is right clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for this node are rendered
+            * @param {Node} this This node
+            */
+            'beforechildrenrendered'
+        );
+    
+        var uiClass = this.attributes.uiProvider || this.defaultUI || Ext.tree.TreeNodeUI;
+    
+        /**
+         * Read-only. The UI for this node
+         * @type TreeNodeUI
+         */
+        this.ui = new uiClass(this);    
+    },
+    
+    preventHScroll : true,
+    /**
+     * Returns true if this node is expanded
+     * @return {Boolean}
+     */
+    isExpanded : function(){
+        return this.expanded;
+    },
+
+/**
+ * Returns the UI object for this node.
+ * @return {TreeNodeUI} The object which is providing the user interface for this tree
+ * node. Unless otherwise specified in the {@link #uiProvider}, this will be an instance
+ * of {@link Ext.tree.TreeNodeUI}
+ */
+    getUI : function(){
+        return this.ui;
+    },
+
+    getLoader : function(){
+        var owner;
+        return this.loader || ((owner = this.getOwnerTree()) && owner.loader ? owner.loader : (this.loader = new Ext.tree.TreeLoader()));
+    },
+
+    // private override
+    setFirstChild : function(node){
+        var of = this.firstChild;
+        Ext.tree.TreeNode.superclass.setFirstChild.call(this, node);
+        if(this.childrenRendered && of && node != of){
+            of.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // private override
+    setLastChild : function(node){
+        var ol = this.lastChild;
+        Ext.tree.TreeNode.superclass.setLastChild.call(this, node);
+        if(this.childrenRendered && ol && node != ol){
+            ol.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // these methods are overridden to provide lazy rendering support
+    // private override
+    appendChild : function(n){
+        if(!n.render && !Ext.isArray(n)){
+            n = this.getLoader().createNode(n);
+        }
+        var node = Ext.tree.TreeNode.superclass.appendChild.call(this, n);
+        if(node && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return node;
+    },
+
+    // private override
+    removeChild : function(node, destroy){
+        this.ownerTree.getSelectionModel().unselect(node);
+        Ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);
+        // only update the ui if we're not destroying
+        if(!destroy){
+            var rendered = node.ui.rendered;
+            // if it's been rendered remove dom node
+            if(rendered){
+                node.ui.remove();
+            }
+            if(rendered && this.childNodes.length < 1){
+                this.collapse(false, false);
+            }else{
+                this.ui.updateExpandIcon();
+            }
+            if(!this.firstChild && !this.isHiddenRoot()){
+                this.childrenRendered = false;
+            }
+        }
+        return node;
+    },
+
+    // private override
+    insertBefore : function(node, refNode){
+        if(!node.render){
+            node = this.getLoader().createNode(node);
+        }
+        var newNode = Ext.tree.TreeNode.superclass.insertBefore.call(this, node, refNode);
+        if(newNode && refNode && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return newNode;
+    },
+
+    /**
+     * Sets the text for this node
+     * @param {String} text
+     */
+    setText : function(text){
+        var oldText = this.text;
+        this.text = this.attributes.text = text;
+        if(this.rendered){ // event without subscribing
+            this.ui.onTextChange(this, text, oldText);
+        }
+        this.fireEvent('textchange', this, text, oldText);
+    },
+    
+    /**
+     * Sets the icon class for this node.
+     * @param {String} cls
+     */
+    setIconCls : function(cls){
+        var old = this.attributes.iconCls;
+        this.attributes.iconCls = cls;
+        if(this.rendered){
+            this.ui.onIconClsChange(this, cls, old);
+        }
+    },
+    
+    /**
+     * Sets the tooltip for this node.
+     * @param {String} tip The text for the tip
+     * @param {String} title (Optional) The title for the tip
+     */
+    setTooltip : function(tip, title){
+        this.attributes.qtip = tip;
+        this.attributes.qtipTitle = title;
+        if(this.rendered){
+            this.ui.onTipChange(this, tip, title);
+        }
+    },
+    
+    /**
+     * Sets the icon for this node.
+     * @param {String} icon
+     */
+    setIcon : function(icon){
+        this.attributes.icon = icon;
+        if(this.rendered){
+            this.ui.onIconChange(this, icon);
+        }
+    },
+    
+    /**
+     * Sets the href for the node.
+     * @param {String} href The href to set
+     * @param {String} (Optional) target The target of the href
+     */
+    setHref : function(href, target){
+        this.attributes.href = href;
+        this.attributes.hrefTarget = target;
+        if(this.rendered){
+            this.ui.onHrefChange(this, href, target);
+        }
+    },
+    
+    /**
+     * Sets the class on this node.
+     * @param {String} cls
+     */
+    setCls : function(cls){
+        var old = this.attributes.cls;
+        this.attributes.cls = cls;
+        if(this.rendered){
+            this.ui.onClsChange(this, cls, old);
+        }
+    },
+
+    /**
+     * Triggers selection of this node
+     */
+    select : function(){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().select(this);
+        }
+    },
+
+    /**
+     * Triggers deselection of this node
+     * @param {Boolean} silent (optional) True to stop selection change events from firing.
+     */
+    unselect : function(silent){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().unselect(this, silent);
+        }
+    },
+
+    /**
+     * Returns true if this node is selected
+     * @return {Boolean}
+     */
+    isSelected : function(){
+        var t = this.getOwnerTree();
+        return t ? t.getSelectionModel().isSelected(this) : false;
+    },
+
+    /**
+     * Expand this node.
+     * @param {Boolean} deep (optional) True to expand all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    expand : function(deep, anim, callback, scope){
+        if(!this.expanded){
+            if(this.fireEvent('beforeexpand', this, deep, anim) === false){
+                return;
+            }
+            if(!this.childrenRendered){
+                this.renderChildren();
+            }
+            this.expanded = true;
+            if(!this.isHiddenRoot() && (this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animExpand(function(){
+                    this.fireEvent('expand', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.expandChildNodes(true, true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.expand();
+                this.fireEvent('expand', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else{
+           this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            this.expandChildNodes(true);
+        }
+    },
+
+    runCallback : function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isHiddenRoot : function(){
+        return this.isRoot && !this.getOwnerTree().rootVisible;
+    },
+
+    /**
+     * Collapse this node.
+     * @param {Boolean} deep (optional) True to collapse all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    collapse : function(deep, anim, callback, scope){
+        if(this.expanded && !this.isHiddenRoot()){
+            if(this.fireEvent('beforecollapse', this, deep, anim) === false){
+                return;
+            }
+            this.expanded = false;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animCollapse(function(){
+                    this.fireEvent('collapse', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.collapseChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.collapse();
+                this.fireEvent('collapse', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else if(!this.expanded){
+            this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].collapse(true, false);
+            }
+        }
+    },
+
+    // private
+    delayedExpand : function(delay){
+        if(!this.expandProcId){
+            this.expandProcId = this.expand.defer(delay, this);
+        }
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+        }
+        this.expandProcId = false;
+    },
+
+    /**
+     * Toggles expanded/collapsed state of the node
+     */
+    toggle : function(){
+        if(this.expanded){
+            this.collapse();
+        }else{
+            this.expand();
+        }
+    },
+
+    /**
+     * Ensures all parent nodes are expanded, and if necessary, scrolls
+     * the node into view.
+     * @param {Function} callback (optional) A function to call when the node has been made visible.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    ensureVisible : function(callback, scope){
+        var tree = this.getOwnerTree();
+        tree.expandPath(this.parentNode ? this.parentNode.getPath() : this.getPath(), false, function(){
+            var node = tree.getNodeById(this.id);  // Somehow if we don't do this, we lose changes that happened to node in the meantime
+            tree.getTreeEl().scrollChildIntoView(node.ui.anchor);
+            this.runCallback(callback, scope || this, [this]);
+        }.createDelegate(this));
+    },
+
+    /**
+     * Expand all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also expand their child nodes
+     */
+    expandChildNodes : function(deep, anim) {
+        var cs = this.childNodes,
+            i,
+            len = cs.length;
+        for (i = 0; i < len; i++) {
+        	cs[i].expand(deep, anim);
+        }
+    },
+
+    /**
+     * Collapse all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also collapse their child nodes
+     */
+    collapseChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].collapse(deep);
+        }
+    },
+
+    /**
+     * Disables this node
+     */
+    disable : function(){
+        this.disabled = true;
+        this.unselect();
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, true);
+        }
+        this.fireEvent('disabledchange', this, true);
+    },
+
+    /**
+     * Enables this node
+     */
+    enable : function(){
+        this.disabled = false;
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, false);
+        }
+        this.fireEvent('disabledchange', this, false);
+    },
+
+    // private
+    renderChildren : function(suppressEvent){
+        if(suppressEvent !== false){
+            this.fireEvent('beforechildrenrendered', this);
+        }
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].render(true);
+        }
+        this.childrenRendered = true;
+    },
+
+    // private
+    sort : function(fn, scope){
+        Ext.tree.TreeNode.superclass.sort.apply(this, arguments);
+        if(this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].render(true);
+            }
+        }
+    },
+
+    // private
+    render : function(bulkRender){
+        this.ui.render(bulkRender);
+        if(!this.rendered){
+            // make sure it is registered
+            this.getOwnerTree().registerNode(this);
+            this.rendered = true;
+            if(this.expanded){
+                this.expanded = false;
+                this.expand(false, false);
+            }
+        }
+    },
+
+    // private
+    renderIndent : function(deep, refresh){
+        if(refresh){
+            this.ui.childIndent = null;
+        }
+        this.ui.renderIndent();
+        if(deep === true && this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].renderIndent(true, refresh);
+            }
+        }
+    },
+
+    beginUpdate : function(){
+        this.childrenRendered = false;
+    },
+
+    endUpdate : function(){
+        if(this.expanded && this.rendered){
+            this.renderChildren();
+        }
+    },
+
+    //inherit docs
+    destroy : function(silent){
+        if(silent === true){
+            this.unselect(true);
+        }
+        Ext.tree.TreeNode.superclass.destroy.call(this, silent);
+        Ext.destroy(this.ui, this.loader);
+        this.ui = this.loader = null;
+    },
+
+    // private
+    onIdChange : function(id){
+        this.ui.onIdChange(id);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.node = Ext.tree.TreeNode;/**
+ * @class Ext.tree.AsyncTreeNode
+ * @extends Ext.tree.TreeNode
+ * @cfg {TreeLoader} loader A TreeLoader to be used by this node (defaults to the loader defined on the tree)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node 
+ */
+ Ext.tree.AsyncTreeNode = function(config){
+    this.loaded = config && config.loaded === true;
+    this.loading = false;
+    Ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);
+    /**
+    * @event beforeload
+    * Fires before this node is loaded, return false to cancel
+    * @param {Node} this This node
+    */
+    this.addEvents('beforeload', 'load');
+    /**
+    * @event load
+    * Fires when this node is loaded
+    * @param {Node} this This node
+    */
+    /**
+     * The loader used by this node (defaults to using the tree's defined loader)
+     * @type TreeLoader
+     * @property loader
+     */
+};
+Ext.extend(Ext.tree.AsyncTreeNode, Ext.tree.TreeNode, {
+    expand : function(deep, anim, callback, scope){
+        if(this.loading){ // if an async load is already running, waiting til it's done
+            var timer;
+            var f = function(){
+                if(!this.loading){ // done loading
+                    clearInterval(timer);
+                    this.expand(deep, anim, callback, scope);
+                }
+            }.createDelegate(this);
+            timer = setInterval(f, 200);
+            return;
+        }
+        if(!this.loaded){
+            if(this.fireEvent("beforeload", this) === false){
+                return;
+            }
+            this.loading = true;
+            this.ui.beforeLoad(this);
+            var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();
+            if(loader){
+                loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback, scope]), this);
+                return;
+            }
+        }
+        Ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node is currently loading
+     * @return {Boolean}
+     */
+    isLoading : function(){
+        return this.loading;  
+    },
+    
+    loadComplete : function(deep, anim, callback, scope){
+        this.loading = false;
+        this.loaded = true;
+        this.ui.afterLoad(this);
+        this.fireEvent("load", this);
+        this.expand(deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node has been loaded
+     * @return {Boolean}
+     */
+    isLoaded : function(){
+        return this.loaded;
+    },
+    
+    hasChildNodes : function(){
+        if(!this.isLeaf() && !this.loaded){
+            return true;
+        }else{
+            return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);
+        }
+    },
+
+    /**
+     * Trigger a reload for this node
+     * @param {Function} callback
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Node.
+     */
+    reload : function(callback, scope){
+        this.collapse(false, false);
+        while(this.firstChild){
+            this.removeChild(this.firstChild).destroy();
+        }
+        this.childrenRendered = false;
+        this.loaded = false;
+        if(this.isHiddenRoot()){
+            this.expanded = false;
+        }
+        this.expand(false, false, callback, scope);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.async = Ext.tree.AsyncTreeNode;/**
+ * @class Ext.tree.TreeNodeUI
+ * This class provides the default UI implementation for Ext TreeNodes.
+ * The TreeNode UI implementation is separate from the
+ * tree implementation, and allows customizing of the appearance of
+ * tree nodes.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ * <p>
+ * This class provides access to the user interface components of an Ext TreeNode, through
+ * {@link Ext.tree.TreeNode#getUI}
+ */
+Ext.tree.TreeNodeUI = Ext.extend(Object, {
+    
+    constructor : function(node){
+        Ext.apply(this, {
+            node: node,
+            rendered: false,
+            animating: false,
+            wasLeaf: true,
+            ecc: 'x-tree-ec-icon x-tree-elbow',
+            emptyIcon: Ext.BLANK_IMAGE_URL    
+        });
+    },
+    
+    // private
+    removeChild : function(node){
+        if(this.rendered){
+            this.ctNode.removeChild(node.ui.getEl());
+        }
+    },
+
+    // private
+    beforeLoad : function(){
+         this.addClass("x-tree-node-loading");
+    },
+
+    // private
+    afterLoad : function(){
+         this.removeClass("x-tree-node-loading");
+    },
+
+    // private
+    onTextChange : function(node, text, oldText){
+        if(this.rendered){
+            this.textNode.innerHTML = text;
+        }
+    },
+    
+    // private
+    onIconClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.iconNode).replaceClass(oldCls, cls);
+        }
+    },
+    
+    // private
+    onIconChange : function(node, icon){
+        if(this.rendered){
+            //'<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            var empty = Ext.isEmpty(icon);
+            this.iconNode.src = empty ? this.emptyIcon : icon;
+            Ext.fly(this.iconNode)[empty ? 'removeClass' : 'addClass']('x-tree-node-inline-icon');
+        }
+    },
+    
+    // private
+    onTipChange : function(node, tip, title){
+        if(this.rendered){
+            var hasTitle = Ext.isDefined(title);
+            if(this.textNode.setAttributeNS){
+                this.textNode.setAttributeNS("ext", "qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttributeNS("ext", "qtitle", title);
+                }
+            }else{
+                this.textNode.setAttribute("ext:qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttribute("ext:qtitle", title);
+                }
+            }
+        }
+    },
+    
+    // private
+    onHrefChange : function(node, href, target){
+        if(this.rendered){
+            this.anchor.href = this.getHref(href);
+            if(Ext.isDefined(target)){
+                this.anchor.target = target;
+            }
+        }
+    },
+    
+    // private
+    onClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.elNode).replaceClass(oldCls, cls);
+        }    
+    },
+
+    // private
+    onDisableChange : function(node, state){
+        this.disabled = state;
+        if (this.checkbox) {
+            this.checkbox.disabled = state;
+        }
+        this[state ? 'addClass' : 'removeClass']('x-tree-node-disabled');
+    },
+
+    // private
+    onSelectedChange : function(state){
+        if(state){
+            this.focus();
+            this.addClass("x-tree-selected");
+        }else{
+            //this.blur();
+            this.removeClass("x-tree-selected");
+        }
+    },
+
+    // private
+    onMove : function(tree, node, oldParent, newParent, index, refNode){
+        this.childIndent = null;
+        if(this.rendered){
+            var targetNode = newParent.ui.getContainer();
+            if(!targetNode){//target not rendered
+                this.holder = document.createElement("div");
+                this.holder.appendChild(this.wrap);
+                return;
+            }
+            var insertBefore = refNode ? refNode.ui.getEl() : null;
+            if(insertBefore){
+                targetNode.insertBefore(this.wrap, insertBefore);
+            }else{
+                targetNode.appendChild(this.wrap);
+            }
+            this.node.renderIndent(true, oldParent != newParent);
+        }
+    },
+
+/**
+ * Adds one or more CSS classes to the node's UI element.
+ * Duplicate classes are automatically filtered out.
+ * @param {String/Array} className The CSS class to add, or an array of classes
+ */
+    addClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).addClass(cls);
+        }
+    },
+
+/**
+ * Removes one or more CSS classes from the node's UI element.
+ * @param {String/Array} className The CSS class to remove, or an array of classes
+ */
+    removeClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).removeClass(cls);
+        }
+    },
+
+    // private
+    remove : function(){
+        if(this.rendered){
+            this.holder = document.createElement("div");
+            this.holder.appendChild(this.wrap);
+        }
+    },
+
+    // private
+    fireEvent : function(){
+        return this.node.fireEvent.apply(this.node, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.node.on("move", this.onMove, this);
+
+        if(this.node.disabled){
+            this.onDisableChange(this.node, true);
+        }
+        if(this.node.hidden){
+            this.hide();
+        }
+        var ot = this.node.getOwnerTree();
+        var dd = ot.enableDD || ot.enableDrag || ot.enableDrop;
+        if(dd && (!this.node.isRoot || ot.rootVisible)){
+            Ext.dd.Registry.register(this.elNode, {
+                node: this.node,
+                handles: this.getDDHandles(),
+                isHandle: false
+            });
+        }
+    },
+
+    // private
+    getDDHandles : function(){
+        return [this.iconNode, this.textNode, this.elNode];
+    },
+
+/**
+ * Hides this node.
+ */
+    hide : function(){
+        this.node.hidden = true;
+        if(this.wrap){
+            this.wrap.style.display = "none";
+        }
+    },
+
+/**
+ * Shows this node.
+ */
+    show : function(){
+        this.node.hidden = false;
+        if(this.wrap){
+            this.wrap.style.display = "";
+        }
+    },
+
+    // private
+    onContextMenu : function(e){
+        if (this.node.hasListener("contextmenu") || this.node.getOwnerTree().hasListener("contextmenu")) {
+            e.preventDefault();
+            this.focus();
+            this.fireEvent("contextmenu", this.node, e);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        if(this.dropping){
+            e.stopEvent();
+            return;
+        }
+        if(this.fireEvent("beforeclick", this.node, e) !== false){
+            var a = e.getTarget('a');
+            if(!this.disabled && this.node.attributes.href && a){
+                this.fireEvent("click", this.node, e);
+                return;
+            }else if(a && e.ctrlKey){
+                e.stopEvent();
+            }
+            e.preventDefault();
+            if(this.disabled){
+                return;
+            }
+
+            if(this.node.attributes.singleClickExpand && !this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+
+            this.fireEvent("click", this.node, e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        e.preventDefault();
+        if(this.disabled){
+            return;
+        }
+        if(this.fireEvent("beforedblclick", this.node, e) !== false){
+            if(this.checkbox){
+                this.toggleCheck();
+            }
+            if(!this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+            this.fireEvent("dblclick", this.node, e);
+        }
+    },
+
+    onOver : function(e){
+        this.addClass('x-tree-node-over');
+    },
+
+    onOut : function(e){
+        this.removeClass('x-tree-node-over');
+    },
+
+    // private
+    onCheckChange : function(){
+        var checked = this.checkbox.checked;
+        // fix for IE6
+        this.checkbox.defaultChecked = checked;
+        this.node.attributes.checked = checked;
+        this.fireEvent('checkchange', this.node, checked);
+    },
+
+    // private
+    ecClick : function(e){
+        if(!this.animating && this.node.isExpandable()){
+            this.node.toggle();
+        }
+    },
+
+    // private
+    startDrop : function(){
+        this.dropping = true;
+    },
+
+    // delayed drop so the click event doesn't get fired on a drop
+    endDrop : function(){
+       setTimeout(function(){
+           this.dropping = false;
+       }.createDelegate(this), 50);
+    },
+
+    // private
+    expand : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "";
+    },
+
+    // private
+    focus : function(){
+        if(!this.node.preventHScroll){
+            try{this.anchor.focus();
+            }catch(e){}
+        }else{
+            try{
+                var noscroll = this.node.getOwnerTree().getTreeEl().dom;
+                var l = noscroll.scrollLeft;
+                this.anchor.focus();
+                noscroll.scrollLeft = l;
+            }catch(e){}
+        }
+    },
+
+/**
+ * Sets the checked status of the tree node to the passed value, or, if no value was passed,
+ * toggles the checked status. If the node was rendered with no checkbox, this has no effect.
+ * @param {Boolean} value (optional) The new checked status.
+ */
+    toggleCheck : function(value){
+        var cb = this.checkbox;
+        if(cb){
+            cb.checked = (value === undefined ? !cb.checked : value);
+            this.onCheckChange();
+        }
+    },
+
+    // private
+    blur : function(){
+        try{
+            this.anchor.blur();
+        }catch(e){}
+    },
+
+    // private
+    animExpand : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.stopFx();
+        if(!this.node.isExpandable()){
+            this.updateExpandIcon();
+            this.ctNode.style.display = "";
+            Ext.callback(callback);
+            return;
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideIn('t', {
+           callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    highlight : function(){
+        var tree = this.node.getOwnerTree();
+        Ext.fly(this.wrap).highlight(
+            tree.hlColor || "C3DAF9",
+            {endColor: tree.hlBaseColor}
+        );
+    },
+
+    // private
+    collapse : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "none";
+    },
+
+    // private
+    animCollapse : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.enableDisplayMode('block');
+        ct.stopFx();
+
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideOut('t', {
+            callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    getContainer : function(){
+        return this.ctNode;
+    },
+
+/**
+ * Returns the element which encapsulates this node.
+ * @return {HtmlElement} The DOM element. The default implementation uses a <code>&lt;li></code>.
+ */
+    getEl : function(){
+        return this.wrap;
+    },
+
+    // private
+    appendDDGhost : function(ghostNode){
+        ghostNode.appendChild(this.elNode.cloneNode(true));
+    },
+
+    // private
+    getDDRepairXY : function(){
+        return Ext.lib.Dom.getXY(this.iconNode);
+    },
+
+    // private
+    onRender : function(){
+        this.render();
+    },
+
+    // private
+    render : function(bulkRender){
+        var n = this.node, a = n.attributes;
+        var targetNode = n.parentNode ?
+              n.parentNode.ui.getContainer() : n.ownerTree.innerCt.dom;
+
+        if(!this.rendered){
+            this.rendered = true;
+
+            this.renderElements(n, a, targetNode, bulkRender);
+
+            if(a.qtip){
+                this.onTipChange(n, a.qtip, a.qtipTitle);
+            }else if(a.qtipCfg){
+                a.qtipCfg.target = Ext.id(this.textNode);
+                Ext.QuickTips.register(a.qtipCfg);
+            }
+            this.initEvents();
+            if(!this.node.expanded){
+                this.updateExpandIcon(true);
+            }
+        }else{
+            if(bulkRender === true) {
+                targetNode.appendChild(this.wrap);
+            }
+        }
+    },
+
+    // private
+    renderElements : function(n, a, targetNode, bulkRender){
+        // add some indent caching, this helps performance when rendering a large tree
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var cb = Ext.isBoolean(a.checked),
+            nel,
+            href = this.getHref(a.href),
+            buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',
+            '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+            '<img alt="" src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+            '<img alt="" src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',
+            '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+             a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",
+            '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+            "</li>"].join('');
+
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+        var index = 3;
+        if(cb){
+            this.checkbox = cs[3];
+            // fix for IE6
+            this.checkbox.defaultChecked = this.checkbox.checked;
+            index++;
+        }
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+    
+    /**
+     * @private Gets a normalized href for the node.
+     * @param {String} href
+     */
+    getHref : function(href){
+        return Ext.isEmpty(href) ? (Ext.isGecko ? '' : '#') : href;
+    },
+
+/**
+ * Returns the &lt;a> element that provides focus for the node's UI.
+ * @return {HtmlElement} The DOM anchor element.
+ */
+    getAnchor : function(){
+        return this.anchor;
+    },
+
+/**
+ * Returns the text node.
+ * @return {HtmlNode} The DOM text node.
+ */
+    getTextEl : function(){
+        return this.textNode;
+    },
+
+/**
+ * Returns the icon &lt;img> element.
+ * @return {HtmlElement} The DOM image element.
+ */
+    getIconEl : function(){
+        return this.iconNode;
+    },
+
+/**
+ * Returns the checked status of the node. If the node was rendered with no
+ * checkbox, it returns false.
+ * @return {Boolean} The checked flag.
+ */
+    isChecked : function(){
+        return this.checkbox ? this.checkbox.checked : false;
+    },
+
+    // private
+    updateExpandIcon : function(){
+        if(this.rendered){
+            var n = this.node,
+                c1,
+                c2,
+                cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow",
+                hasChild = n.hasChildNodes();
+            if(hasChild || n.attributes.expandable){
+                if(n.expanded){
+                    cls += "-minus";
+                    c1 = "x-tree-node-collapsed";
+                    c2 = "x-tree-node-expanded";
+                }else{
+                    cls += "-plus";
+                    c1 = "x-tree-node-expanded";
+                    c2 = "x-tree-node-collapsed";
+                }
+                if(this.wasLeaf){
+                    this.removeClass("x-tree-node-leaf");
+                    this.wasLeaf = false;
+                }
+                if(this.c1 != c1 || this.c2 != c2){
+                    Ext.fly(this.elNode).replaceClass(c1, c2);
+                    this.c1 = c1; this.c2 = c2;
+                }
+            }else{
+                if(!this.wasLeaf){
+                    Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-collapsed");
+                    delete this.c1;
+                    delete this.c2;
+                    this.wasLeaf = true;
+                }
+            }
+            var ecc = "x-tree-ec-icon "+cls;
+            if(this.ecc != ecc){
+                this.ecNode.className = ecc;
+                this.ecc = ecc;
+            }
+        }
+    },
+
+    // private
+    onIdChange: function(id){
+        if(this.rendered){
+            this.elNode.setAttribute('ext:tree-node-id', id);
+        }
+    },
+
+    // private
+    getChildIndent : function(){
+        if(!this.childIndent){
+            var buf = [],
+                p = this.node;
+            while(p){
+                if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){
+                    if(!p.isLast()) {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />');
+                    } else {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />');
+                    }
+                }
+                p = p.parentNode;
+            }
+            this.childIndent = buf.join("");
+        }
+        return this.childIndent;
+    },
+
+    // private
+    renderIndent : function(){
+        if(this.rendered){
+            var indent = "",
+                p = this.node.parentNode;
+            if(p){
+                indent = p.ui.getChildIndent();
+            }
+            if(this.indentMarkup != indent){ // don't rerender if not required
+                this.indentNode.innerHTML = indent;
+                this.indentMarkup = indent;
+            }
+            this.updateExpandIcon();
+        }
+    },
+
+    destroy : function(){
+        if(this.elNode){
+            Ext.dd.Registry.unregister(this.elNode.id);
+        }
+
+        Ext.each(['textnode', 'anchor', 'checkbox', 'indentNode', 'ecNode', 'iconNode', 'elNode', 'ctNode', 'wrap', 'holder'], function(el){
+            if(this[el]){
+                Ext.fly(this[el]).remove();
+                delete this[el];
+            }
+        }, this);
+        delete this.node;
+    }
+});
+
+/**
+ * @class Ext.tree.RootTreeNodeUI
+ * This class provides the default UI implementation for <b>root</b> Ext TreeNodes.
+ * The RootTreeNode UI implementation allows customizing the appearance of the root tree node.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ */
+Ext.tree.RootTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    // private
+    render : function(){
+        if(!this.rendered){
+            var targetNode = this.node.ownerTree.innerCt.dom;
+            this.node.expanded = true;
+            targetNode.innerHTML = '<div class="x-tree-root-node"></div>';
+            this.wrap = this.ctNode = targetNode.firstChild;
+        }
+    },
+    collapse : Ext.emptyFn,
+    expand : Ext.emptyFn
+});/**
+ * @class Ext.tree.TreeLoader
+ * @extends Ext.util.Observable
+ * A TreeLoader provides for lazy loading of an {@link Ext.tree.TreeNode}'s child
+ * nodes from a specified URL. The response must be a JavaScript Array definition
+ * whose elements are node definition objects. e.g.:
+ * <pre><code>
+    [{
+        id: 1,
+        text: 'A leaf Node',
+        leaf: true
+    },{
+        id: 2,
+        text: 'A folder Node',
+        children: [{
+            id: 3,
+            text: 'A child Node',
+            leaf: true
+        }]
+   }]
+</code></pre>
+ * <br><br>
+ * A server request is sent, and child nodes are loaded only when a node is expanded.
+ * The loading node's id is passed to the server under the parameter name "node" to
+ * enable the server to produce the correct child nodes.
+ * <br><br>
+ * To pass extra parameters, an event handler may be attached to the "beforeload"
+ * event, and the parameters specified in the TreeLoader's baseParams property:
+ * <pre><code>
+    myTreeLoader.on("beforeload", function(treeLoader, node) {
+        this.baseParams.category = node.attributes.category;
+    }, this);
+</code></pre>
+ * This would pass an HTTP parameter called "category" to the server containing
+ * the value of the Node's "category" attribute.
+ * @constructor
+ * Creates a new Treeloader.
+ * @param {Object} config A config object containing config properties.
+ */
+Ext.tree.TreeLoader = function(config){
+    this.baseParams = {};
+    Ext.apply(this, config);
+
+    this.addEvents(
+        /**
+         * @event beforeload
+         * Fires before a network request is made to retrieve the Json text which specifies a node's children.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} callback The callback function specified in the {@link #load} call.
+         */
+        "beforeload",
+        /**
+         * @event load
+         * Fires when the node has been successfuly loaded.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "load",
+        /**
+         * @event loadexception
+         * Fires if the network request failed.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "loadexception"
+    );
+    Ext.tree.TreeLoader.superclass.constructor.call(this);
+    if(Ext.isString(this.paramOrder)){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+};
+
+Ext.extend(Ext.tree.TreeLoader, Ext.util.Observable, {
+    /**
+    * @cfg {String} dataUrl The URL from which to request a Json string which
+    * specifies an array of node definition objects representing the child nodes
+    * to be loaded.
+    */
+    /**
+     * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+     */
+    /**
+     * @cfg {String} url Equivalent to {@link #dataUrl}.
+     */
+    /**
+     * @cfg {Boolean} preloadChildren If set to true, the loader recursively loads "children" attributes when doing the first load on nodes.
+     */
+    /**
+    * @cfg {Object} baseParams (optional) An object containing properties which
+    * specify HTTP parameters to be passed to each request for child nodes.
+    */
+    /**
+    * @cfg {Object} baseAttrs (optional) An object containing attributes to be added to all nodes
+    * created by this loader. If the attributes sent by the server have an attribute in this object,
+    * they take priority.
+    */
+    /**
+    * @cfg {Object} uiProviders (optional) An object containing properties which
+    * specify custom {@link Ext.tree.TreeNodeUI} implementations. If the optional
+    * <i>uiProvider</i> attribute of a returned child node is a string rather
+    * than a reference to a TreeNodeUI implementation, then that string value
+    * is used as a property name in the uiProviders object.
+    */
+    uiProviders : {},
+
+    /**
+    * @cfg {Boolean} clearOnLoad (optional) Default to true. Remove previously existing
+    * child nodes before loading.
+    */
+    clearOnLoad : true,
+
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. Only used when using directFn.
+     * Specifies the params in the order in which they must be passed to the server-side Direct method
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+nodeParameter: 'node',
+paramOrder: ['param1','param2','param3']
+paramOrder: 'node param1 param2 param3'
+paramOrder: 'param1,node,param2,param3'
+paramOrder: 'param1|param2|param|node'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used when using directFn.
+     * Send parameters as a collection of named arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} nodeParameter The name of the parameter sent to the server which contains
+     * the identifier of the node. Defaults to <tt>'node'</tt>.
+     */
+    nodeParameter: 'node',
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.
+     */
+    directFn : undefined,
+
+    /**
+     * Load an {@link Ext.tree.TreeNode} from the URL specified in the constructor.
+     * This is called automatically when a node is expanded, but may be used to reload
+     * a node (or append new children if the {@link #clearOnLoad} option is false.)
+     * @param {Ext.tree.TreeNode} node
+     * @param {Function} callback Function to call after the node has been loaded. The
+     * function is passed the TreeNode which was requested to be loaded.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed.
+     * defaults to the loaded TreeNode.
+     */
+    load : function(node, callback, scope){
+        if(this.clearOnLoad){
+            while(node.firstChild){
+                node.removeChild(node.firstChild);
+            }
+        }
+        if(this.doPreload(node)){ // preloaded json children
+            this.runCallback(callback, scope || node, [node]);
+        }else if(this.directFn || this.dataUrl || this.url){
+            this.requestData(node, callback, scope || node);
+        }
+    },
+
+    doPreload : function(node){
+        if(node.attributes.children){
+            if(node.childNodes.length < 1){ // preloaded?
+                var cs = node.attributes.children;
+                node.beginUpdate();
+                for(var i = 0, len = cs.length; i < len; i++){
+                    var cn = node.appendChild(this.createNode(cs[i]));
+                    if(this.preloadChildren){
+                        this.doPreload(cn);
+                    }
+                }
+                node.endUpdate();
+            }
+            return true;
+        }
+        return false;
+    },
+
+    getParams: function(node){
+        var bp = Ext.apply({}, this.baseParams),
+            np = this.nodeParameter,
+            po = this.paramOrder;
+
+        np && (bp[ np ] = node.id);
+
+        if(this.directFn){
+            var buf = [node.id];
+            if(po){
+                // reset 'buf' if the nodeParameter was included in paramOrder
+                if(np && po.indexOf(np) > -1){
+                    buf = [];
+                }
+
+                for(var i = 0, len = po.length; i < len; i++){
+                    buf.push(bp[ po[i] ]);
+                }
+            }else if(this.paramsAsHash){
+                buf = [bp];
+            }
+            return buf;
+        }else{
+            return bp;
+        }
+    },
+
+    requestData : function(node, callback, scope){
+        if(this.fireEvent("beforeload", this, node, callback) !== false){
+            if(this.directFn){
+                var args = this.getParams(node);
+                args.push(this.processDirectResponse.createDelegate(this, [{callback: callback, node: node, scope: scope}], true));
+                this.directFn.apply(window, args);
+            }else{
+                this.transId = Ext.Ajax.request({
+                    method:this.requestMethod,
+                    url: this.dataUrl||this.url,
+                    success: this.handleResponse,
+                    failure: this.handleFailure,
+                    scope: this,
+                    argument: {callback: callback, node: node, scope: scope},
+                    params: this.getParams(node)
+                });
+            }
+        }else{
+            // if the load is cancelled, make sure we notify
+            // the node that we are done
+            this.runCallback(callback, scope || node, []);
+        }
+    },
+
+    processDirectResponse: function(result, response, args){
+        if(response.status){
+            this.handleResponse({
+                responseData: Ext.isArray(result) ? result : null,
+                responseText: result,
+                argument: args
+            });
+        }else{
+            this.handleFailure({
+                argument: args
+            });
+        }
+    },
+
+    // private
+    runCallback: function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isLoading : function(){
+        return !!this.transId;
+    },
+
+    abort : function(){
+        if(this.isLoading()){
+            Ext.Ajax.abort(this.transId);
+        }
+    },
+
+    /**
+    * <p>Override this function for custom TreeNode node implementation, or to
+    * modify the attributes at creation time.</p>
+    * Example:<pre><code>
+new Ext.tree.TreePanel({
+    ...
+    loader: new Ext.tree.TreeLoader({
+        url: 'dataUrl',
+        createNode: function(attr) {
+//          Allow consolidation consignments to have
+//          consignments dropped into them.
+            if (attr.isConsolidation) {
+                attr.iconCls = 'x-consol',
+                attr.allowDrop = true;
+            }
+            return Ext.tree.TreeLoader.prototype.createNode.call(this, attr);
+        }
+    }),
+    ...
+});
+</code></pre>
+    * @param attr {Object} The attributes from which to create the new node.
+    */
+    createNode : function(attr){
+        // apply baseAttrs, nice idea Corey!
+        if(this.baseAttrs){
+            Ext.applyIf(attr, this.baseAttrs);
+        }
+        if(this.applyLoader !== false && !attr.loader){
+            attr.loader = this;
+        }
+        if(Ext.isString(attr.uiProvider)){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        if(attr.nodeType){
+            return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+        }else{
+            return attr.leaf ?
+                        new Ext.tree.TreeNode(attr) :
+                        new Ext.tree.AsyncTreeNode(attr);
+        }
+    },
+
+    processResponse : function(response, node, callback, scope){
+        var json = response.responseText;
+        try {
+            var o = response.responseData || Ext.decode(json);
+            node.beginUpdate();
+            for(var i = 0, len = o.length; i < len; i++){
+                var n = this.createNode(o[i]);
+                if(n){
+                    node.appendChild(n);
+                }
+            }
+            node.endUpdate();
+            this.runCallback(callback, scope || node, [node]);
+        }catch(e){
+            this.handleFailure(response);
+        }
+    },
+
+    handleResponse : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.processResponse(response, a.node, a.callback, a.scope);
+        this.fireEvent("load", this, a.node, response);
+    },
+
+    handleFailure : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.fireEvent("loadexception", this, a.node, response);
+        this.runCallback(a.callback, a.scope || a.node, [a.node]);
+    },
+
+    destroy : function(){
+        this.abort();
+        this.purgeListeners();
+    }
+});/**
+ * @class Ext.tree.TreeFilter
+ * Note this class is experimental and doesn't update the indent (lines) or expand collapse icons of the nodes
+ * @param {TreePanel} tree
+ * @param {Object} config (optional)
+ */
+Ext.tree.TreeFilter = function(tree, config){
+    this.tree = tree;
+    this.filtered = {};
+    Ext.apply(this, config);
+};
+
+Ext.tree.TreeFilter.prototype = {
+    clearBlank:false,
+    reverse:false,
+    autoClear:false,
+    remove:false,
+
+     /**
+     * Filter the data by a specific attribute.
+     * @param {String/RegExp} value Either string that the attribute value
+     * should start with or a RegExp to test against the attribute
+     * @param {String} attr (optional) The attribute passed in your node's attributes collection. Defaults to "text".
+     * @param {TreeNode} startNode (optional) The node to start the filter at.
+     */
+    filter : function(value, attr, startNode){
+        attr = attr || "text";
+        var f;
+        if(typeof value == "string"){
+            var vlen = value.length;
+            // auto clear empty filter
+            if(vlen == 0 && this.clearBlank){
+                this.clear();
+                return;
+            }
+            value = value.toLowerCase();
+            f = function(n){
+                return n.attributes[attr].substr(0, vlen).toLowerCase() == value;
+            };
+        }else if(value.exec){ // regex?
+            f = function(n){
+                return value.test(n.attributes[attr]);
+            };
+        }else{
+            throw 'Illegal filter type, must be string or regex';
+        }
+        this.filterBy(f, null, startNode);
+	},
+
+    /**
+     * Filter by a function. The passed function will be called with each
+     * node in the tree (or from the startNode). If the function returns true, the node is kept
+     * otherwise it is filtered. If a node is filtered, its children are also filtered.
+     * @param {Function} fn The filter function
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     */
+    filterBy : function(fn, scope, startNode){
+        startNode = startNode || this.tree.root;
+        if(this.autoClear){
+            this.clear();
+        }
+        var af = this.filtered, rv = this.reverse;
+        var f = function(n){
+            if(n == startNode){
+                return true;
+            }
+            if(af[n.id]){
+                return false;
+            }
+            var m = fn.call(scope || n, n);
+            if(!m || rv){
+                af[n.id] = n;
+                n.ui.hide();
+                return false;
+            }
+            return true;
+        };
+        startNode.cascade(f);
+        if(this.remove){
+           for(var id in af){
+               if(typeof id != "function"){
+                   var n = af[id];
+                   if(n && n.parentNode){
+                       n.parentNode.removeChild(n);
+                   }
+               }
+           }
+        }
+    },
+
+    /**
+     * Clears the current filter. Note: with the "remove" option
+     * set a filter cannot be cleared.
+     */
+    clear : function(){
+        var t = this.tree;
+        var af = this.filtered;
+        for(var id in af){
+            if(typeof id != "function"){
+                var n = af[id];
+                if(n){
+                    n.ui.show();
+                }
+            }
+        }
+        this.filtered = {};
+    }
+};
+/**
+ * @class Ext.tree.TreeSorter
+ * Provides sorting of nodes in a {@link Ext.tree.TreePanel}.  The TreeSorter automatically monitors events on the
+ * associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
+ * Example usage:<br />
+ * <pre><code>
+new Ext.tree.TreeSorter(myTree, {
+    folderSort: true,
+    dir: "desc",
+    sortType: function(node) {
+        // sort by a custom, typed attribute:
+        return parseInt(node.id, 10);
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} config
+ */
+Ext.tree.TreeSorter = Ext.extend(Object, {
+    
+    constructor: function(tree, config){
+        /**
+     * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
+     */
+    /**
+     * @cfg {String} property The named attribute on the node to sort by (defaults to "text").  Note that this
+     * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
+     */
+    /**
+     * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
+     */
+    /**
+     * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
+     */
+    /**
+     * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
+     */
+    /**
+     * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting.  The function
+     * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
+     * the node's sort value cast to the specific data type required for sorting.  This could be used, for example, when
+     * a node's text (or other attribute) should be sorted as a date or numeric value.  See the class description for
+     * example usage.  Note that if a sortType is specified, any {@link #property} config will be ignored.
+     */
+
+    Ext.apply(this, config);
+    tree.on({
+        scope: this,
+        beforechildrenrendered: this.doSort,
+        append: this.updateSort,
+        insert: this.updateSort,
+        textchange: this.updateSortParent
+    });
+
+    var desc = this.dir && this.dir.toLowerCase() == 'desc',
+        prop = this.property || 'text',
+        sortType = this.sortType,
+        folderSort = this.folderSort,
+        caseSensitive = this.caseSensitive === true,
+        leafAttr = this.leafAttr || 'leaf';
+
+    if(Ext.isString(sortType)){
+        sortType = Ext.data.SortTypes[sortType];
+    }
+    this.sortFn = function(n1, n2){
+        var attr1 = n1.attributes,
+            attr2 = n2.attributes;
+            
+        if(folderSort){
+            if(attr1[leafAttr] && !attr2[leafAttr]){
+                return 1;
+            }
+            if(!attr1[leafAttr] && attr2[leafAttr]){
+                return -1;
+            }
+        }
+        var prop1 = attr1[prop],
+            prop2 = attr2[prop],
+            v1 = sortType ? sortType(prop1) : (caseSensitive ? prop1 : prop1.toUpperCase()),
+            v2 = sortType ? sortType(prop2) : (caseSensitive ? prop2 : prop2.toUpperCase());
+            
+        if(v1 < v2){
+            return desc ? 1 : -1;
+        }else if(v1 > v2){
+            return desc ? -1 : 1;
+        }
+        return 0;
+    };
+    },
+    
+    doSort : function(node){
+        node.sort(this.sortFn);
+    },
+
+    updateSort : function(tree, node){
+        if(node.childrenRendered){
+            this.doSort.defer(1, this, [node]);
+        }
+    },
+
+    updateSortParent : function(node){
+        var p = node.parentNode;
+        if(p && p.childrenRendered){
+            this.doSort.defer(1, this, [p]);
+        }
+    }    
+});
+/**
+ * @class Ext.tree.TreeDropZone
+ * @extends Ext.dd.DropZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dropping
+ * @param {Object} config
+ */
+if(Ext.dd.DropZone){
+    
+Ext.tree.TreeDropZone = function(tree, config){
+    /**
+     * @cfg {Boolean} allowParentInsert
+     * Allow inserting a dragged node between an expanded parent node and its first child that will become a
+     * sibling of the parent when dropped (defaults to false)
+     */
+    this.allowParentInsert = config.allowParentInsert || false;
+    /**
+     * @cfg {String} allowContainerDrop
+     * True if drops on the tree container (outside of a specific tree node) are allowed (defaults to false)
+     */
+    this.allowContainerDrop = config.allowContainerDrop || false;
+    /**
+     * @cfg {String} appendOnly
+     * True if the tree should only allow append drops (use for trees which are sorted, defaults to false)
+     */
+    this.appendOnly = config.appendOnly || false;
+
+    Ext.tree.TreeDropZone.superclass.constructor.call(this, tree.getTreeEl(), config);
+    /**
+    * The TreePanel for this drop zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+    /**
+    * Arbitrary data that can be associated with this tree and will be included in the event object that gets
+    * passed to any nodedragover event handler (defaults to {})
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.dragOverData = {};
+    // private
+    this.lastInsertClass = "x-tree-no-status";
+};
+
+Ext.extend(Ext.tree.TreeDropZone, Ext.dd.DropZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    /**
+     * @cfg {String} expandDelay
+     * The delay in milliseconds to wait before expanding a target tree node while dragging a droppable node
+     * over the target (defaults to 1000)
+     */
+    expandDelay : 1000,
+
+    // private
+    expandNode : function(node){
+        if(node.hasChildNodes() && !node.isExpanded()){
+            node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));
+        }
+    },
+
+    // private
+    queueExpand : function(node){
+        this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+            this.expandProcId = false;
+        }
+    },
+
+    // private
+    isValidDropPoint : function(n, pt, dd, e, data){
+        if(!n || !data){ return false; }
+        var targetNode = n.node;
+        var dropNode = data.node;
+        // default drop rules
+        if(!(targetNode && targetNode.isTarget && pt)){
+            return false;
+        }
+        if(pt == "append" && targetNode.allowChildren === false){
+            return false;
+        }
+        if((pt == "above" || pt == "below") && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){
+            return false;
+        }
+        if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){
+            return false;
+        }
+        // reuse the object
+        var overEvent = this.dragOverData;
+        overEvent.tree = this.tree;
+        overEvent.target = targetNode;
+        overEvent.data = data;
+        overEvent.point = pt;
+        overEvent.source = dd;
+        overEvent.rawEvent = e;
+        overEvent.dropNode = dropNode;
+        overEvent.cancel = false;  
+        var result = this.tree.fireEvent("nodedragover", overEvent);
+        return overEvent.cancel === false && result !== false;
+    },
+
+    // private
+    getDropPoint : function(e, n, dd){
+        var tn = n.node;
+        if(tn.isRoot){
+            return tn.allowChildren !== false ? "append" : false; // always append for root
+        }
+        var dragEl = n.ddel;
+        var t = Ext.lib.Dom.getY(dragEl), b = t + dragEl.offsetHeight;
+        var y = Ext.lib.Event.getPageY(e);
+        var noAppend = tn.allowChildren === false || tn.isLeaf();
+        if(this.appendOnly || tn.parentNode.allowChildren === false){
+            return noAppend ? false : "append";
+        }
+        var noBelow = false;
+        if(!this.allowParentInsert){
+            noBelow = tn.hasChildNodes() && tn.isExpanded();
+        }
+        var q = (b - t) / (noAppend ? 2 : 3);
+        if(y >= t && y < (t + q)){
+            return "above";
+        }else if(!noBelow && (noAppend || y >= b-q && y <= b)){
+            return "below";
+        }else{
+            return "append";
+        }
+    },
+
+    // private
+    onNodeEnter : function(n, dd, e, data){
+        this.cancelExpand();
+    },
+    
+    onContainerOver : function(dd, e, data) {
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            return this.dropAllowed;
+        }
+        return this.dropNotAllowed;
+    },
+
+    // private
+    onNodeOver : function(n, dd, e, data){
+        var pt = this.getDropPoint(e, n, dd);
+        var node = n.node;
+        
+        // auto node expand check
+        if(!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()){
+            this.queueExpand(node);
+        }else if(pt != "append"){
+            this.cancelExpand();
+        }
+        
+        // set the insert point style on the target node
+        var returnCls = this.dropNotAllowed;
+        if(this.isValidDropPoint(n, pt, dd, e, data)){
+           if(pt){
+               var el = n.ddel;
+               var cls;
+               if(pt == "above"){
+                   returnCls = n.node.isFirst() ? "x-tree-drop-ok-above" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-above";
+               }else if(pt == "below"){
+                   returnCls = n.node.isLast() ? "x-tree-drop-ok-below" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-below";
+               }else{
+                   returnCls = "x-tree-drop-ok-append";
+                   cls = "x-tree-drag-append";
+               }
+               if(this.lastInsertClass != cls){
+                   Ext.fly(el).replaceClass(this.lastInsertClass, cls);
+                   this.lastInsertClass = cls;
+               }
+           }
+       }
+       return returnCls;
+    },
+
+    // private
+    onNodeOut : function(n, dd, e, data){
+        this.cancelExpand();
+        this.removeDropIndicators(n);
+    },
+
+    // private
+    onNodeDrop : function(n, dd, e, data){
+        var point = this.getDropPoint(e, n, dd);
+        var targetNode = n.node;
+        targetNode.ui.startDrop();
+        if(!this.isValidDropPoint(n, point, dd, e, data)){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        // first try to find the drop node
+        var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);
+        return this.processDrop(targetNode, data, point, dd, e, dropNode);
+    },
+    
+    onContainerDrop : function(dd, e, data){
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            var targetNode = this.tree.getRootNode();       
+            targetNode.ui.startDrop();
+            var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, 'append', e) : null);
+            return this.processDrop(targetNode, data, 'append', dd, e, dropNode);
+        }
+        return false;
+    },
+    
+    // private
+    processDrop: function(target, data, point, dd, e, dropNode){
+        var dropEvent = {
+            tree : this.tree,
+            target: target,
+            data: data,
+            point: point,
+            source: dd,
+            rawEvent: e,
+            dropNode: dropNode,
+            cancel: !dropNode,
+            dropStatus: false
+        };
+        var retval = this.tree.fireEvent("beforenodedrop", dropEvent);
+        if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){
+            target.ui.endDrop();
+            return dropEvent.dropStatus;
+        }
+    
+        target = dropEvent.target;
+        if(point == 'append' && !target.isExpanded()){
+            target.expand(false, null, function(){
+                this.completeDrop(dropEvent);
+            }.createDelegate(this));
+        }else{
+            this.completeDrop(dropEvent);
+        }
+        return true;
+    },
+
+    // private
+    completeDrop : function(de){
+        var ns = de.dropNode, p = de.point, t = de.target;
+        if(!Ext.isArray(ns)){
+            ns = [ns];
+        }
+        var n;
+        for(var i = 0, len = ns.length; i < len; i++){
+            n = ns[i];
+            if(p == "above"){
+                t.parentNode.insertBefore(n, t);
+            }else if(p == "below"){
+                t.parentNode.insertBefore(n, t.nextSibling);
+            }else{
+                t.appendChild(n);
+            }
+        }
+        n.ui.focus();
+        if(Ext.enableFx && this.tree.hlDrop){
+            n.ui.highlight();
+        }
+        t.ui.endDrop();
+        this.tree.fireEvent("nodedrop", de);
+    },
+
+    // private
+    afterNodeMoved : function(dd, data, e, targetNode, dropNode){
+        if(Ext.enableFx && this.tree.hlDrop){
+            dropNode.ui.focus();
+            dropNode.ui.highlight();
+        }
+        this.tree.fireEvent("nodedrop", this.tree, targetNode, data, dd, e);
+    },
+
+    // private
+    getTree : function(){
+        return this.tree;
+    },
+
+    // private
+    removeDropIndicators : function(n){
+        if(n && n.ddel){
+            var el = n.ddel;
+            Ext.fly(el).removeClass([
+                    "x-tree-drag-insert-above",
+                    "x-tree-drag-insert-below",
+                    "x-tree-drag-append"]);
+            this.lastInsertClass = "_noclass";
+        }
+    },
+
+    // private
+    beforeDragDrop : function(target, e, id){
+        this.cancelExpand();
+        return true;
+    },
+
+    // private
+    afterRepair : function(data){
+        if(data && Ext.enableFx){
+            data.node.ui.highlight();
+        }
+        this.hideProxy();
+    }    
+});
+
+}/**
+ * @class Ext.tree.TreeDragZone
+ * @extends Ext.dd.DragZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dragging
+ * @param {Object} config
+ */
+if(Ext.dd.DragZone){
+Ext.tree.TreeDragZone = function(tree, config){
+    Ext.tree.TreeDragZone.superclass.constructor.call(this, tree.innerCt, config);
+    /**
+    * The TreePanel for this drag zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+};
+
+Ext.extend(Ext.tree.TreeDragZone, Ext.dd.DragZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    // private
+    onBeforeDrag : function(data, e){
+        var n = data.node;
+        return n && n.draggable && !n.disabled;
+    },
+
+    // private
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.tree.getSelectionModel().select(data.node);
+        this.tree.eventModel.disable();
+        this.proxy.update("");
+        data.node.ui.appendDDGhost(this.proxy.ghost.dom);
+        this.tree.fireEvent("startdrag", this.tree, data.node, e);
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return data.node.ui.getDDRepairXY();
+    },
+
+    // private
+    onEndDrag : function(data, e){
+        this.tree.eventModel.enable.defer(100, this.tree.eventModel);
+        this.tree.fireEvent("enddrag", this.tree, data.node, e);
+    },
+
+    // private
+    onValidDrop : function(dd, e, id){
+        this.tree.fireEvent("dragdrop", this.tree, this.dragData.node, dd, e);
+        this.hideProxy();
+    },
+
+    // private
+    beforeInvalidDrop : function(e, id){
+        // this scrolls the original position back into view
+        var sm = this.tree.getSelectionModel();
+        sm.clearSelections();
+        sm.select(this.dragData.node);
+    },
+    
+    // private
+    afterRepair : function(){
+        if (Ext.enableFx && this.tree.hlDrop) {
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    }
+});
+}/**
+ * @class Ext.tree.TreeEditor
+ * @extends Ext.Editor
+ * Provides editor functionality for inline tree node editing.  Any valid {@link Ext.form.Field} subclass can be used
+ * as the editor field.
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} fieldConfig (optional) Either a prebuilt {@link Ext.form.Field} instance or a Field config object
+ * that will be applied to the default field instance (defaults to a {@link Ext.form.TextField}).
+ * @param {Object} config (optional) A TreeEditor config object
+ */
+Ext.tree.TreeEditor = function(tree, fc, config){
+    fc = fc || {};
+    var field = fc.events ? fc : new Ext.form.TextField(fc);
+    
+    Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);
+
+    this.tree = tree;
+
+    if(!tree.rendered){
+        tree.on('render', this.initEditor, this);
+    }else{
+        this.initEditor(tree);
+    }
+};
+
+Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "l-l").
+     */
+    alignment: "l-l",
+    // inherit
+    autoSize: false,
+    /**
+     * @cfg {Boolean} hideEl
+     * True to hide the bound element while the editor is displayed (defaults to false)
+     */
+    hideEl : false,
+    /**
+     * @cfg {String} cls
+     * CSS class to apply to the editor (defaults to "x-small-editor x-tree-editor")
+     */
+    cls: "x-small-editor x-tree-editor",
+    /**
+     * @cfg {Boolean} shim
+     * True to shim the editor if selects/iframes could be displayed beneath it (defaults to false)
+     */
+    shim:false,
+    // inherit
+    shadow:"frame",
+    /**
+     * @cfg {Number} maxWidth
+     * The maximum width in pixels of the editor field (defaults to 250).  Note that if the maxWidth would exceed
+     * the containing tree element's size, it will be automatically limited for you to the container width, taking
+     * scroll and client offsets into account prior to each edit.
+     */
+    maxWidth: 250,
+    /**
+     * @cfg {Number} editDelay The number of milliseconds between clicks to register a double-click that will trigger
+     * editing on the current node (defaults to 350).  If two clicks occur on the same node within this time span,
+     * the editor for the node will display, otherwise it will be processed as a regular click.
+     */
+    editDelay : 350,
+
+    initEditor : function(tree){
+        tree.on({
+            scope      : this,
+            beforeclick: this.beforeNodeClick,
+            dblclick   : this.onNodeDblClick
+        });
+        
+        this.on({
+            scope          : this,
+            complete       : this.updateNode,
+            beforestartedit: this.fitToTree,
+            specialkey     : this.onSpecialKey
+        });
+        
+        this.on('startedit', this.bindScroll, this, {delay:10});
+    },
+
+    // private
+    fitToTree : function(ed, el){
+        var td = this.tree.getTreeEl().dom, nd = el.dom;
+        if(td.scrollLeft >  nd.offsetLeft){ // ensure the node left point is visible
+            td.scrollLeft = nd.offsetLeft;
+        }
+        var w = Math.min(
+                this.maxWidth,
+                (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - /*cushion*/5);
+        this.setSize(w, '');
+    },
+
+    /**
+     * Edit the text of the passed {@link Ext.tree.TreeNode TreeNode}.
+     * @param node {Ext.tree.TreeNode} The TreeNode to edit. The TreeNode must be {@link Ext.tree.TreeNode#editable editable}.
+     */
+    triggerEdit : function(node, defer){
+        this.completeEdit();
+		if(node.attributes.editable !== false){
+           /**
+            * The {@link Ext.tree.TreeNode TreeNode} this editor is bound to. Read-only.
+            * @type Ext.tree.TreeNode
+            * @property editNode
+            */
+			this.editNode = node;
+            if(this.tree.autoScroll){
+                Ext.fly(node.ui.getEl()).scrollIntoView(this.tree.body);
+            }
+            var value = node.text || '';
+            if (!Ext.isGecko && Ext.isEmpty(node.text)){
+                node.setText('&#160;');
+            }
+            this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, value]);
+            return false;
+        }
+    },
+
+    // private
+    bindScroll : function(){
+        this.tree.getTreeEl().on('scroll', this.cancelEdit, this);
+    },
+
+    // private
+    beforeNodeClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+        if(this.tree.getSelectionModel().isSelected(node)){
+            e.stopEvent();
+            return this.triggerEdit(node);
+        }
+    },
+
+    onNodeDblClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+    },
+
+    // private
+    updateNode : function(ed, value){
+        this.tree.getTreeEl().un('scroll', this.cancelEdit, this);
+        this.editNode.setText(value);
+    },
+
+    // private
+    onHide : function(){
+        Ext.tree.TreeEditor.superclass.onHide.call(this);
+        if(this.editNode){
+            this.editNode.ui.focus.defer(50, this.editNode.ui);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var k = e.getKey();
+        if(k == e.ESC){
+            e.stopEvent();
+            this.cancelEdit();
+        }else if(k == e.ENTER && !e.hasModifier()){
+            e.stopEvent();
+            this.completeEdit();
+        }
+    },
+    
+    onDestroy : function(){
+        clearTimeout(this.autoEditTimer);
+        Ext.tree.TreeEditor.superclass.onDestroy.call(this);
+        var tree = this.tree;
+        tree.un('beforeclick', this.beforeNodeClick, this);
+        tree.un('dblclick', this.onNodeDblClick, this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts.js	(revision 76)
@@ -0,0 +1,10 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/* SWFObject v2.2 <http://code.google.com/p/swfobject/> 
+    is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
+*/
+var swfobject=function(){var D="undefined",r="object",S="Shockwave Flash",W="ShockwaveFlash.ShockwaveFlash",q="application/x-shockwave-flash",R="SWFObjectExprInst",x="onreadystatechange",O=window,j=document,t=navigator,T=false,U=[h],o=[],N=[],I=[],l,Q,E,B,J=false,a=false,n,G,m=true,M=function(){var aa=typeof j.getElementById!=D&&typeof j.getElementsByTagName!=D&&typeof j.createElement!=D,ah=t.userAgent.toLowerCase(),Y=t.platform.toLowerCase(),ae=Y?(/win/).test(Y):/win/.test(ah),ac=Y?(/mac/).test(Y):/mac/.test(ah),af=/webkit/.test(ah)?parseFloat(ah.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,X=!+"\v1",ag=[0,0,0],ab=null;if(typeof t.plugins!=D&&typeof t.plugins[S]==r){ab=t.plugins[S].description;if(ab&&!(typeof t.mimeTypes!=D&&t.mimeTypes[q]&&!t.mimeTypes[q].enabledPlugin)){T=true;X=false;ab=ab.replace(/^.*\s+(\S+\s+\S+$)/,"$1");ag[0]=parseInt(ab.replace(/^(.*)\..*$/,"$1"),10);ag[1]=parseInt(ab.replace(/^.*\.(.*)\s.*$/,"$1"),10);ag[2]=/[a-zA-Z]/.test(ab)?parseInt(ab.replace(/^.*[a-zA-Z]+(.*)$/,"$1"),10):0}}else{if(typeof O.ActiveXObject!=D){try{var ad=new ActiveXObject(W);if(ad){ab=ad.GetVariable("$version");if(ab){X=true;ab=ab.split(" ")[1].split(",");ag=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}}catch(Z){}}}return{w3:aa,pv:ag,wk:af,ie:X,win:ae,mac:ac}}(),k=function(){if(!M.w3){return}if((typeof j.readyState!=D&&j.readyState=="complete")||(typeof j.readyState==D&&(j.getElementsByTagName("body")[0]||j.body))){f()}if(!J){if(typeof j.addEventListener!=D){j.addEventListener("DOMContentLoaded",f,false)}if(M.ie&&M.win){j.attachEvent(x,function(){if(j.readyState=="complete"){j.detachEvent(x,arguments.callee);f()}});if(O==top){(function(){if(J){return}try{j.documentElement.doScroll("left")}catch(X){setTimeout(arguments.callee,0);return}f()})()}}if(M.wk){(function(){if(J){return}if(!(/loaded|complete/).test(j.readyState)){setTimeout(arguments.callee,0);return}f()})()}s(f)}}();function f(){if(J){return}try{var Z=j.getElementsByTagName("body")[0].appendChild(C("span"));Z.parentNode.removeChild(Z)}catch(aa){return}J=true;var X=U.length;for(var Y=0;Y<X;Y++){U[Y]()}}function K(X){if(J){X()}else{U[U.length]=X}}function s(Y){if(typeof O.addEventListener!=D){O.addEventListener("load",Y,false)}else{if(typeof j.addEventListener!=D){j.addEventListener("load",Y,false)}else{if(typeof O.attachEvent!=D){i(O,"onload",Y)}else{if(typeof O.onload=="function"){var X=O.onload;O.onload=function(){X();Y()}}else{O.onload=Y}}}}}function h(){if(T){V()}else{H()}}function V(){var X=j.getElementsByTagName("body")[0];var aa=C(r);aa.setAttribute("type",q);var Z=X.appendChild(aa);if(Z){var Y=0;(function(){if(typeof Z.GetVariable!=D){var ab=Z.GetVariable("$version");if(ab){ab=ab.split(" ")[1].split(",");M.pv=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}else{if(Y<10){Y++;setTimeout(arguments.callee,10);return}}X.removeChild(aa);Z=null;H()})()}else{H()}}function H(){var ag=o.length;if(ag>0){for(var af=0;af<ag;af++){var Y=o[af].id;var ab=o[af].callbackFn;var aa={success:false,id:Y};if(M.pv[0]>0){var ae=c(Y);if(ae){if(F(o[af].swfVersion)&&!(M.wk&&M.wk<312)){w(Y,true);if(ab){aa.success=true;aa.ref=z(Y);ab(aa)}}else{if(o[af].expressInstall&&A()){var ai={};ai.data=o[af].expressInstall;ai.width=ae.getAttribute("width")||"0";ai.height=ae.getAttribute("height")||"0";if(ae.getAttribute("class")){ai.styleclass=ae.getAttribute("class")}if(ae.getAttribute("align")){ai.align=ae.getAttribute("align")}var ah={};var X=ae.getElementsByTagName("param");var ac=X.length;for(var ad=0;ad<ac;ad++){if(X[ad].getAttribute("name").toLowerCase()!="movie"){ah[X[ad].getAttribute("name")]=X[ad].getAttribute("value")}}P(ai,ah,Y,ab)}else{p(ae);if(ab){ab(aa)}}}}}else{w(Y,true);if(ab){var Z=z(Y);if(Z&&typeof Z.SetVariable!=D){aa.success=true;aa.ref=Z}ab(aa)}}}}}function z(aa){var X=null;var Y=c(aa);if(Y&&Y.nodeName=="OBJECT"){if(typeof Y.SetVariable!=D){X=Y}else{var Z=Y.getElementsByTagName(r)[0];if(Z){X=Z}}}return X}function A(){return !a&&F("6.0.65")&&(M.win||M.mac)&&!(M.wk&&M.wk<312)}function P(aa,ab,X,Z){a=true;E=Z||null;B={success:false,id:X};var ae=c(X);if(ae){if(ae.nodeName=="OBJECT"){l=g(ae);Q=null}else{l=ae;Q=X}aa.id=R;if(typeof aa.width==D||(!(/%$/).test(aa.width)&&parseInt(aa.width,10)<310)){aa.width="310"}if(typeof aa.height==D||(!(/%$/).test(aa.height)&&parseInt(aa.height,10)<137)){aa.height="137"}j.title=j.title.slice(0,47)+" - Flash Player Installation";var ad=M.ie&&M.win?"ActiveX":"PlugIn",ac="MMredirectURL="+O.location.toString().replace(/&/g,"%26")+"&MMplayerType="+ad+"&MMdoctitle="+j.title;if(typeof ab.flashvars!=D){ab.flashvars+="&"+ac}else{ab.flashvars=ac}if(M.ie&&M.win&&ae.readyState!=4){var Y=C("div");X+="SWFObjectNew";Y.setAttribute("id",X);ae.parentNode.insertBefore(Y,ae);ae.style.display="none";(function(){if(ae.readyState==4){ae.parentNode.removeChild(ae)}else{setTimeout(arguments.callee,10)}})()}u(aa,ab,X)}}function p(Y){if(M.ie&&M.win&&Y.readyState!=4){var X=C("div");Y.parentNode.insertBefore(X,Y);X.parentNode.replaceChild(g(Y),X);Y.style.display="none";(function(){if(Y.readyState==4){Y.parentNode.removeChild(Y)}else{setTimeout(arguments.callee,10)}})()}else{Y.parentNode.replaceChild(g(Y),Y)}}function g(ab){var aa=C("div");if(M.win&&M.ie){aa.innerHTML=ab.innerHTML}else{var Y=ab.getElementsByTagName(r)[0];if(Y){var ad=Y.childNodes;if(ad){var X=ad.length;for(var Z=0;Z<X;Z++){if(!(ad[Z].nodeType==1&&ad[Z].nodeName=="PARAM")&&!(ad[Z].nodeType==8)){aa.appendChild(ad[Z].cloneNode(true))}}}}}return aa}function u(ai,ag,Y){var X,aa=c(Y);if(M.wk&&M.wk<312){return X}if(aa){if(typeof ai.id==D){ai.id=Y}if(M.ie&&M.win){var ah="";for(var ae in ai){if(ai[ae]!=Object.prototype[ae]){if(ae.toLowerCase()=="data"){ag.movie=ai[ae]}else{if(ae.toLowerCase()=="styleclass"){ah+=' class="'+ai[ae]+'"'}else{if(ae.toLowerCase()!="classid"){ah+=" "+ae+'="'+ai[ae]+'"'}}}}}var af="";for(var ad in ag){if(ag[ad]!=Object.prototype[ad]){af+='<param name="'+ad+'" value="'+ag[ad]+'" />'}}aa.outerHTML='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+ah+">"+af+"</object>";N[N.length]=ai.id;X=c(ai.id)}else{var Z=C(r);Z.setAttribute("type",q);for(var ac in ai){if(ai[ac]!=Object.prototype[ac]){if(ac.toLowerCase()=="styleclass"){Z.setAttribute("class",ai[ac])}else{if(ac.toLowerCase()!="classid"){Z.setAttribute(ac,ai[ac])}}}}for(var ab in ag){if(ag[ab]!=Object.prototype[ab]&&ab.toLowerCase()!="movie"){e(Z,ab,ag[ab])}}aa.parentNode.replaceChild(Z,aa);X=Z}}return X}function e(Z,X,Y){var aa=C("param");aa.setAttribute("name",X);aa.setAttribute("value",Y);Z.appendChild(aa)}function y(Y){var X=c(Y);if(X&&X.nodeName=="OBJECT"){if(M.ie&&M.win){X.style.display="none";(function(){if(X.readyState==4){b(Y)}else{setTimeout(arguments.callee,10)}})()}else{X.parentNode.removeChild(X)}}}function b(Z){var Y=c(Z);if(Y){for(var X in Y){if(typeof Y[X]=="function"){Y[X]=null}}Y.parentNode.removeChild(Y)}}function c(Z){var X=null;try{X=j.getElementById(Z)}catch(Y){}return X}function C(X){return j.createElement(X)}function i(Z,X,Y){Z.attachEvent(X,Y);I[I.length]=[Z,X,Y]}function F(Z){var Y=M.pv,X=Z.split(".");X[0]=parseInt(X[0],10);X[1]=parseInt(X[1],10)||0;X[2]=parseInt(X[2],10)||0;return(Y[0]>X[0]||(Y[0]==X[0]&&Y[1]>X[1])||(Y[0]==X[0]&&Y[1]==X[1]&&Y[2]>=X[2]))?true:false}function v(ac,Y,ad,ab){if(M.ie&&M.mac){return}var aa=j.getElementsByTagName("head")[0];if(!aa){return}var X=(ad&&typeof ad=="string")?ad:"screen";if(ab){n=null;G=null}if(!n||G!=X){var Z=C("style");Z.setAttribute("type","text/css");Z.setAttribute("media",X);n=aa.appendChild(Z);if(M.ie&&M.win&&typeof j.styleSheets!=D&&j.styleSheets.length>0){n=j.styleSheets[j.styleSheets.length-1]}G=X}if(M.ie&&M.win){if(n&&typeof n.addRule==r){n.addRule(ac,Y)}}else{if(n&&typeof j.createTextNode!=D){n.appendChild(j.createTextNode(ac+" {"+Y+"}"))}}}function w(Z,X){if(!m){return}var Y=X?"visible":"hidden";if(J&&c(Z)){c(Z).style.visibility=Y}else{v("#"+Z,"visibility:"+Y)}}function L(Y){var Z=/[\\\"<>\.;]/;var X=Z.exec(Y)!=null;return X&&typeof encodeURIComponent!=D?encodeURIComponent(Y):Y}var d=function(){if(M.ie&&M.win){window.attachEvent("onunload",function(){var ac=I.length;for(var ab=0;ab<ac;ab++){I[ab][0].detachEvent(I[ab][1],I[ab][2])}var Z=N.length;for(var aa=0;aa<Z;aa++){y(N[aa])}for(var Y in M){M[Y]=null}M=null;for(var X in swfobject){swfobject[X]=null}swfobject=null;window.detachEvent("onunload",arguments.callee)})}}();return{registerObject:function(ab,X,aa,Z){if(M.w3&&ab&&X){var Y={};Y.id=ab;Y.swfVersion=X;Y.expressInstall=aa;Y.callbackFn=Z;o[o.length]=Y;w(ab,false)}else{if(Z){Z({success:false,id:ab})}}},getObjectById:function(X){if(M.w3){return z(X)}},embedSWF:function(ab,ah,ae,ag,Y,aa,Z,ad,af,ac){var X={success:false,id:ah};if(M.w3&&!(M.wk&&M.wk<312)&&ab&&ah&&ae&&ag&&Y){w(ah,false);K(function(){ae+="";ag+="";var aj={};if(af&&typeof af===r){for(var al in af){aj[al]=af[al]}}aj.data=ab;aj.width=ae;aj.height=ag;var am={};if(ad&&typeof ad===r){for(var ak in ad){am[ak]=ad[ak]}}if(Z&&typeof Z===r){for(var ai in Z){if(typeof am.flashvars!=D){am.flashvars+="&"+ai+"="+Z[ai]}else{am.flashvars=ai+"="+Z[ai]}}}if(F(Y)){var an=u(aj,am,ah);if(aj.id==ah){w(ah,true)}X.success=true;X.ref=an}else{if(aa&&A()){aj.data=aa;P(aj,am,ah,ac);return}else{w(ah,true)}}if(ac){ac(X)}})}else{if(ac){ac(X)}}},switchOffAutoHideShow:function(){m=false},ua:M,getFlashPlayerVersion:function(){return{major:M.pv[0],minor:M.pv[1],release:M.pv[2]}},hasFlashPlayerVersion:F,createSWF:function(Z,Y,X){if(M.w3){return u(Z,Y,X)}else{return undefined}},showExpressInstall:function(Z,aa,X,Y){if(M.w3&&A()){P(Z,aa,X,Y)}},removeSWF:function(X){if(M.w3){y(X)}},createCSS:function(aa,Z,Y,X){if(M.w3){v(aa,Z,Y,X)}},addDomLoadEvent:K,addLoadEvent:s,getQueryParamValue:function(aa){var Z=j.location.search||j.location.hash;if(Z){if(/\?/.test(Z)){Z=Z.split("?")[1]}if(aa==null){return L(Z)}var Y=Z.split("&");for(var X=0;X<Y.length;X++){if(Y[X].substring(0,Y[X].indexOf("="))==aa){return L(Y[X].substring((Y[X].indexOf("=")+1)))}}}return""},expressInstallCallback:function(){if(a){var X=c(R);if(X&&l){X.parentNode.replaceChild(l,X);if(Q){w(Q,true);if(M.ie&&M.win){l.style.display="block"}}if(E){E(B)}}a=false}}}}();Ext.FlashComponent=Ext.extend(Ext.BoxComponent,{flashVersion:"9.0.115",backgroundColor:"#ffffff",wmode:"opaque",flashVars:undefined,flashParams:undefined,url:undefined,swfId:undefined,swfWidth:"100%",swfHeight:"100%",expressInstall:false,initComponent:function(){Ext.FlashComponent.superclass.initComponent.call(this);this.addEvents("initialize")},onRender:function(){Ext.FlashComponent.superclass.onRender.apply(this,arguments);var b=Ext.apply({allowScriptAccess:"always",bgcolor:this.backgroundColor,wmode:this.wmode},this.flashParams),a=Ext.apply({allowedDomain:document.location.hostname,YUISwfId:this.getId(),YUIBridgeCallback:"Ext.FlashEventProxy.onEvent"},this.flashVars);new swfobject.embedSWF(this.url,this.id,this.swfWidth,this.swfHeight,this.flashVersion,this.expressInstall?Ext.FlashComponent.EXPRESS_INSTALL_URL:undefined,a,b);this.swf=Ext.getDom(this.id);this.el=Ext.get(this.swf)},getSwfId:function(){return this.swfId||(this.swfId="extswf"+(++Ext.Component.AUTO_ID))},getId:function(){return this.id||(this.id="extflashcmp"+(++Ext.Component.AUTO_ID))},onFlashEvent:function(a){switch(a.type){case"swfReady":this.initSwf();return;case"log":return}a.component=this;this.fireEvent(a.type.toLowerCase().replace(/event$/,""),a)},initSwf:function(){this.onSwfReady(!!this.isInitialized);this.isInitialized=true;this.fireEvent("initialize",this)},beforeDestroy:function(){if(this.rendered){swfobject.removeSWF(this.swf.id)}Ext.FlashComponent.superclass.beforeDestroy.call(this)},onSwfReady:Ext.emptyFn});Ext.FlashComponent.EXPRESS_INSTALL_URL="http://swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf";Ext.reg("flash",Ext.FlashComponent);Ext.FlashEventProxy={onEvent:function(c,b){var a=Ext.getCmp(c);if(a){a.onFlashEvent(b)}else{arguments.callee.defer(10,this,[c,b])}}};Ext.chart.Chart=Ext.extend(Ext.FlashComponent,{refreshBuffer:100,chartStyle:{padding:10,animationEnabled:true,font:{name:"Tahoma",color:4473924,size:11},dataTip:{padding:5,border:{color:10075112,size:1},background:{color:14346230,alpha:0.9},font:{name:"Tahoma",color:1393291,size:10,bold:true}}},extraStyle:null,seriesStyles:null,disableCaching:Ext.isIE||Ext.isOpera,disableCacheParam:"_dc",initComponent:function(){Ext.chart.Chart.superclass.initComponent.call(this);if(!this.url){this.url=Ext.chart.Chart.CHART_URL}if(this.disableCaching){this.url=Ext.urlAppend(this.url,String.format("{0}={1}",this.disableCacheParam,new Date().getTime()))}this.addEvents("itemmouseover","itemmouseout","itemclick","itemdoubleclick","itemdragstart","itemdrag","itemdragend","beforerefresh","refresh");this.store=Ext.StoreMgr.lookup(this.store)},setStyle:function(a,b){this.swf.setStyle(a,Ext.encode(b))},setStyles:function(a){this.swf.setStyles(Ext.encode(a))},setSeriesStyles:function(b){this.seriesStyles=b;var a=[];Ext.each(b,function(c){a.push(Ext.encode(c))});this.swf.setSeriesStyles(a)},setCategoryNames:function(a){this.swf.setCategoryNames(a)},setLegendRenderer:function(c,b){var a=this;b=b||a;a.removeFnProxy(a.legendFnName);a.legendFnName=a.createFnProxy(function(d){return c.call(b,d)});a.swf.setLegendLabelFunction(a.legendFnName)},setTipRenderer:function(c,b){var a=this;b=b||a;a.removeFnProxy(a.tipFnName);a.tipFnName=a.createFnProxy(function(g,e,f){var d=a.store.getAt(e);return c.call(b,a,d,e,f)});a.swf.setDataTipFunction(a.tipFnName)},setSeries:function(a){this.series=a;this.refresh()},bindStore:function(a,b){if(!b&&this.store){if(a!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("datachanged",this.refresh,this);this.store.un("add",this.delayRefresh,this);this.store.un("remove",this.delayRefresh,this);this.store.un("update",this.delayRefresh,this);this.store.un("clear",this.refresh,this)}}if(a){a=Ext.StoreMgr.lookup(a);a.on({scope:this,datachanged:this.refresh,add:this.delayRefresh,remove:this.delayRefresh,update:this.delayRefresh,clear:this.refresh})}this.store=a;if(a&&!b){this.refresh()}},onSwfReady:function(b){Ext.chart.Chart.superclass.onSwfReady.call(this,b);var a;this.swf.setType(this.type);if(this.chartStyle){this.setStyles(Ext.apply({},this.extraStyle,this.chartStyle))}if(this.categoryNames){this.setCategoryNames(this.categoryNames)}if(this.tipRenderer){a=this.getFunctionRef(this.tipRenderer);this.setTipRenderer(a.fn,a.scope)}if(this.legendRenderer){a=this.getFunctionRef(this.legendRenderer);this.setLegendRenderer(a.fn,a.scope)}if(!b){this.bindStore(this.store,true)}this.refresh.defer(10,this)},delayRefresh:function(){if(!this.refreshTask){this.refreshTask=new Ext.util.DelayedTask(this.refresh,this)}this.refreshTask.delay(this.refreshBuffer)},refresh:function(){if(this.fireEvent("beforerefresh",this)!==false){var l=false;var h=[],c=this.store.data.items;for(var f=0,k=c.length;f<k;f++){h[f]=c[f].data}var e=[];var d=0;var m=null;var g=0;if(this.series){d=this.series.length;for(g=0;g<d;g++){m=this.series[g];var b={};for(var a in m){if(a=="style"&&m.style!==null){b.style=Ext.encode(m.style);l=true}else{b[a]=m[a]}}e.push(b)}}if(d>0){for(g=0;g<d;g++){m=e[g];if(!m.type){m.type=this.type}m.dataProvider=h}}else{e.push({type:this.type,dataProvider:h})}this.swf.setDataProvider(e);if(this.seriesStyles){this.setSeriesStyles(this.seriesStyles)}this.fireEvent("refresh",this)}},createFnProxy:function(a){var b="extFnProxy"+(++Ext.chart.Chart.PROXY_FN_ID);Ext.chart.Chart.proxyFunction[b]=a;return"Ext.chart.Chart.proxyFunction."+b},removeFnProxy:function(a){if(!Ext.isEmpty(a)){a=a.replace("Ext.chart.Chart.proxyFunction.","");delete Ext.chart.Chart.proxyFunction[a]}},getFunctionRef:function(a){if(Ext.isFunction(a)){return{fn:a,scope:this}}else{return{fn:a.fn,scope:a.scope||this}}},onDestroy:function(){if(this.refreshTask&&this.refreshTask.cancel){this.refreshTask.cancel()}Ext.chart.Chart.superclass.onDestroy.call(this);this.bindStore(null);this.removeFnProxy(this.tipFnName);this.removeFnProxy(this.legendFnName)}});Ext.reg("chart",Ext.chart.Chart);Ext.chart.Chart.PROXY_FN_ID=0;Ext.chart.Chart.proxyFunction={};Ext.chart.Chart.CHART_URL="http://yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf";Ext.chart.PieChart=Ext.extend(Ext.chart.Chart,{type:"pie",onSwfReady:function(a){Ext.chart.PieChart.superclass.onSwfReady.call(this,a);this.setDataField(this.dataField);this.setCategoryField(this.categoryField)},setDataField:function(a){this.dataField=a;this.swf.setDataField(a)},setCategoryField:function(a){this.categoryField=a;this.swf.setCategoryField(a)}});Ext.reg("piechart",Ext.chart.PieChart);Ext.chart.CartesianChart=Ext.extend(Ext.chart.Chart,{onSwfReady:function(a){Ext.chart.CartesianChart.superclass.onSwfReady.call(this,a);this.labelFn=[];if(this.xField){this.setXField(this.xField)}if(this.yField){this.setYField(this.yField)}if(this.xAxis){this.setXAxis(this.xAxis)}if(this.xAxes){this.setXAxes(this.xAxes)}if(this.yAxis){this.setYAxis(this.yAxis)}if(this.yAxes){this.setYAxes(this.yAxes)}if(Ext.isDefined(this.constrainViewport)){this.swf.setConstrainViewport(this.constrainViewport)}},setXField:function(a){this.xField=a;this.swf.setHorizontalField(a)},setYField:function(a){this.yField=a;this.swf.setVerticalField(a)},setXAxis:function(a){this.xAxis=this.createAxis("xAxis",a);this.swf.setHorizontalAxis(this.xAxis)},setXAxes:function(c){var b;for(var a=0;a<c.length;a++){b=this.createAxis("xAxis"+a,c[a]);this.swf.setHorizontalAxis(b)}},setYAxis:function(a){this.yAxis=this.createAxis("yAxis",a);this.swf.setVerticalAxis(this.yAxis)},setYAxes:function(c){var b;for(var a=0;a<c.length;a++){b=this.createAxis("yAxis"+a,c[a]);this.swf.setVerticalAxis(b)}},createAxis:function(b,d){var e=Ext.apply({},d),c,a;if(this[b]){a=this[b].labelFunction;this.removeFnProxy(a);this.labelFn.remove(a)}if(e.labelRenderer){c=this.getFunctionRef(e.labelRenderer);e.labelFunction=this.createFnProxy(function(f){return c.fn.call(c.scope,f)});delete e.labelRenderer;this.labelFn.push(e.labelFunction)}if(b.indexOf("xAxis")>-1&&e.position=="left"){e.position="bottom"}return e},onDestroy:function(){Ext.chart.CartesianChart.superclass.onDestroy.call(this);Ext.each(this.labelFn,function(a){this.removeFnProxy(a)},this)}});Ext.reg("cartesianchart",Ext.chart.CartesianChart);Ext.chart.LineChart=Ext.extend(Ext.chart.CartesianChart,{type:"line"});Ext.reg("linechart",Ext.chart.LineChart);Ext.chart.ColumnChart=Ext.extend(Ext.chart.CartesianChart,{type:"column"});Ext.reg("columnchart",Ext.chart.ColumnChart);Ext.chart.StackedColumnChart=Ext.extend(Ext.chart.CartesianChart,{type:"stackcolumn"});Ext.reg("stackedcolumnchart",Ext.chart.StackedColumnChart);Ext.chart.BarChart=Ext.extend(Ext.chart.CartesianChart,{type:"bar"});Ext.reg("barchart",Ext.chart.BarChart);Ext.chart.StackedBarChart=Ext.extend(Ext.chart.CartesianChart,{type:"stackbar"});Ext.reg("stackedbarchart",Ext.chart.StackedBarChart);Ext.chart.Axis=function(a){Ext.apply(this,a)};Ext.chart.Axis.prototype={type:null,orientation:"horizontal",reverse:false,labelFunction:null,hideOverlappingLabels:true,labelSpacing:2};Ext.chart.NumericAxis=Ext.extend(Ext.chart.Axis,{type:"numeric",minimum:NaN,maximum:NaN,majorUnit:NaN,minorUnit:NaN,snapToUnits:true,alwaysShowZero:true,scale:"linear",roundMajorUnit:true,calculateByLabelSize:true,position:"left",adjustMaximumByMajorUnit:true,adjustMinimumByMajorUnit:true});Ext.chart.TimeAxis=Ext.extend(Ext.chart.Axis,{type:"time",minimum:null,maximum:null,majorUnit:NaN,majorTimeUnit:null,minorUnit:NaN,minorTimeUnit:null,snapToUnits:true,stackingEnabled:false,calculateByLabelSize:true});Ext.chart.CategoryAxis=Ext.extend(Ext.chart.Axis,{type:"category",categoryNames:null,calculateCategoryCount:false});Ext.chart.Series=function(a){Ext.apply(this,a)};Ext.chart.Series.prototype={type:null,displayName:null};Ext.chart.CartesianSeries=Ext.extend(Ext.chart.Series,{xField:null,yField:null,showInLegend:true,axis:"primary"});Ext.chart.ColumnSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"column"});Ext.chart.LineSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"line"});Ext.chart.BarSeries=Ext.extend(Ext.chart.CartesianSeries,{type:"bar"});Ext.chart.PieSeries=Ext.extend(Ext.chart.Series,{type:"pie",dataField:null,categoryField:null});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/state-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/state-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/state-debug.js	(revision 76)
@@ -0,0 +1,304 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.state.Provider
+ * Abstract base class for state provider implementations. This class provides methods
+ * for encoding and decoding <b>typed</b> variables including dates and defines the
+ * Provider interface.
+ */
+Ext.state.Provider = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(){
+        /**
+         * @event statechange
+         * Fires when a state change occurs.
+         * @param {Provider} this This state provider
+         * @param {String} key The state key which was changed
+         * @param {String} value The encoded value for the state
+         */
+        this.addEvents("statechange");
+        this.state = {};
+        Ext.state.Provider.superclass.constructor.call(this);
+    },
+    
+    /**
+     * Returns the current value for a key
+     * @param {String} name The key name
+     * @param {Mixed} defaultValue A default value to return if the key's value is not found
+     * @return {Mixed} The state data
+     */
+    get : function(name, defaultValue){
+        return typeof this.state[name] == "undefined" ?
+            defaultValue : this.state[name];
+    },
+
+    /**
+     * Clears a value from the state
+     * @param {String} name The key name
+     */
+    clear : function(name){
+        delete this.state[name];
+        this.fireEvent("statechange", this, name, null);
+    },
+
+    /**
+     * Sets the value for a key
+     * @param {String} name The key name
+     * @param {Mixed} value The value to set
+     */
+    set : function(name, value){
+        this.state[name] = value;
+        this.fireEvent("statechange", this, name, value);
+    },
+
+    /**
+     * Decodes a string previously encoded with {@link #encodeValue}.
+     * @param {String} value The value to decode
+     * @return {Mixed} The decoded value
+     */
+    decodeValue : function(cookie){
+        /**
+         * a -> Array
+         * n -> Number
+         * d -> Date
+         * b -> Boolean
+         * s -> String
+         * o -> Object
+         * -> Empty (null)
+         */
+        var re = /^(a|n|d|b|s|o|e)\:(.*)$/,
+            matches = re.exec(unescape(cookie)),
+            all,
+            type,
+            v,
+            kv;
+        if(!matches || !matches[1]){
+            return; // non state cookie
+        }
+        type = matches[1];
+        v = matches[2];
+        switch(type){
+            case 'e':
+                return null;
+            case 'n':
+                return parseFloat(v);
+            case 'd':
+                return new Date(Date.parse(v));
+            case 'b':
+                return (v == '1');
+            case 'a':
+                all = [];
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        all.push(this.decodeValue(val));
+                    }, this);
+                }
+                return all;
+           case 'o':
+                all = {};
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        kv = val.split('=');
+                        all[kv[0]] = this.decodeValue(kv[1]);
+                    }, this);
+                }
+                return all;
+           default:
+                return v;
+        }
+    },
+
+    /**
+     * Encodes a value including type information.  Decode with {@link #decodeValue}.
+     * @param {Mixed} value The value to encode
+     * @return {String} The encoded value
+     */
+    encodeValue : function(v){
+        var enc,
+            flat = '',
+            i = 0,
+            len,
+            key;
+        if(v == null){
+            return 'e:1';    
+        }else if(typeof v == 'number'){
+            enc = 'n:' + v;
+        }else if(typeof v == 'boolean'){
+            enc = 'b:' + (v ? '1' : '0');
+        }else if(Ext.isDate(v)){
+            enc = 'd:' + v.toGMTString();
+        }else if(Ext.isArray(v)){
+            for(len = v.length; i < len; i++){
+                flat += this.encodeValue(v[i]);
+                if(i != len - 1){
+                    flat += '^';
+                }
+            }
+            enc = 'a:' + flat;
+        }else if(typeof v == 'object'){
+            for(key in v){
+                if(typeof v[key] != 'function' && v[key] !== undefined){
+                    flat += key + '=' + this.encodeValue(v[key]) + '^';
+                }
+            }
+            enc = 'o:' + flat.substring(0, flat.length-1);
+        }else{
+            enc = 's:' + v;
+        }
+        return escape(enc);
+    }
+});
+/**
+ * @class Ext.state.Manager
+ * This is the global state manager. By default all components that are "state aware" check this class
+ * for state information if you don't pass them a custom state provider. In order for this class
+ * to be useful, it must be initialized with a provider when your application initializes. Example usage:
+ <pre><code>
+// in your initialization function
+init : function(){
+   Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+   var win = new Window(...);
+   win.restoreState();
+}
+ </code></pre>
+ * @singleton
+ */
+Ext.state.Manager = function(){
+    var provider = new Ext.state.Provider();
+
+    return {
+        /**
+         * Configures the default state provider for your application
+         * @param {Provider} stateProvider The state provider to set
+         */
+        setProvider : function(stateProvider){
+            provider = stateProvider;
+        },
+
+        /**
+         * Returns the current value for a key
+         * @param {String} name The key name
+         * @param {Mixed} defaultValue The default value to return if the key lookup does not match
+         * @return {Mixed} The state data
+         */
+        get : function(key, defaultValue){
+            return provider.get(key, defaultValue);
+        },
+
+        /**
+         * Sets the value for a key
+         * @param {String} name The key name
+         * @param {Mixed} value The state data
+         */
+         set : function(key, value){
+            provider.set(key, value);
+        },
+
+        /**
+         * Clears a value from the state
+         * @param {String} name The key name
+         */
+        clear : function(key){
+            provider.clear(key);
+        },
+
+        /**
+         * Gets the currently configured state provider
+         * @return {Provider} The state provider
+         */
+        getProvider : function(){
+            return provider;
+        }
+    };
+}();
+/**
+ * @class Ext.state.CookieProvider
+ * @extends Ext.state.Provider
+ * The default Provider implementation which saves state via cookies.
+ * <br />Usage:
+ <pre><code>
+   var cp = new Ext.state.CookieProvider({
+       path: "/cgi-bin/",
+       expires: new Date(new Date().getTime()+(1000*60*60*24*30)), //30 days
+       domain: "extjs.com"
+   });
+   Ext.state.Manager.setProvider(cp);
+ </code></pre>
+ * @cfg {String} path The path for which the cookie is active (defaults to root '/' which makes it active for all pages in the site)
+ * @cfg {Date} expires The cookie expiration date (defaults to 7 days from now)
+ * @cfg {String} domain The domain to save the cookie for.  Note that you cannot specify a different domain than
+ * your page is on, but you can specify a sub-domain, or simply the domain itself like 'extjs.com' to include
+ * all sub-domains if you need to access cookies across different sub-domains (defaults to null which uses the same
+ * domain the page is running on including the 'www' like 'www.extjs.com')
+ * @cfg {Boolean} secure True if the site is using SSL (defaults to false)
+ * @constructor
+ * Create a new CookieProvider
+ * @param {Object} config The configuration object
+ */
+Ext.state.CookieProvider = Ext.extend(Ext.state.Provider, {
+    
+    constructor : function(config){
+        Ext.state.CookieProvider.superclass.constructor.call(this);
+        this.path = "/";
+        this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days
+        this.domain = null;
+        this.secure = false;
+        Ext.apply(this, config);
+        this.state = this.readCookies();
+    },
+    
+    // private
+    set : function(name, value){
+        if(typeof value == "undefined" || value === null){
+            this.clear(name);
+            return;
+        }
+        this.setCookie(name, value);
+        Ext.state.CookieProvider.superclass.set.call(this, name, value);
+    },
+
+    // private
+    clear : function(name){
+        this.clearCookie(name);
+        Ext.state.CookieProvider.superclass.clear.call(this, name);
+    },
+
+    // private
+    readCookies : function(){
+        var cookies = {},
+            c = document.cookie + ";",
+            re = /\s?(.*?)=(.*?);/g,
+    	    matches,
+            name,
+            value;
+    	while((matches = re.exec(c)) != null){
+            name = matches[1];
+            value = matches[2];
+            if(name && name.substring(0,3) == "ys-"){
+                cookies[name.substr(3)] = this.decodeValue(value);
+            }
+        }
+        return cookies;
+    },
+
+    // private
+    setCookie : function(name, value){
+        document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +
+           ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    },
+
+    // private
+    clearCookie : function(name){
+        document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/resizable-debug.js	(revision 76)
@@ -0,0 +1,770 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Resizable
+ * @extends Ext.util.Observable
+ * <p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element
+ * and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
+ * the textarea in a div and set 'resizeChild' to true (or to the id of the element), <b>or</b> set wrap:true in your config and
+ * the element will be wrapped for you automatically.</p>
+ * <p>Here is the list of valid resize handles:</p>
+ * <pre>
+Value   Description
+------  -------------------
+ 'n'     north
+ 's'     south
+ 'e'     east
+ 'w'     west
+ 'nw'    northwest
+ 'sw'    southwest
+ 'se'    southeast
+ 'ne'    northeast
+ 'all'   all
+</pre>
+ * <p>Here's an example showing the creation of a typical Resizable:</p>
+ * <pre><code>
+var resizer = new Ext.Resizable('element-id', {
+    handles: 'all',
+    minWidth: 200,
+    minHeight: 100,
+    maxWidth: 500,
+    maxHeight: 400,
+    pinned: true
+});
+resizer.on('resize', myHandler);
+</code></pre>
+ * <p>To hide a particular handle, set its display to none in CSS, or through script:<br>
+ * resizer.east.setDisplayed(false);</p>
+ * @constructor
+ * Create a new resizable component
+ * @param {Mixed} el The id or element to resize
+ * @param {Object} config configuration options
+  */
+Ext.Resizable = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        this.el = Ext.get(el);
+        if(config && config.wrap){
+            config.resizeChild = this.el;
+            this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : {cls:'xresizable-wrap'});
+            this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
+            this.el.setStyle('overflow', 'hidden');
+            this.el.setPositioning(config.resizeChild.getPositioning());
+            config.resizeChild.clearPositioning();
+            if(!config.width || !config.height){
+                var csize = config.resizeChild.getSize();
+                this.el.setSize(csize.width, csize.height);
+            }
+            if(config.pinned && !config.adjustments){
+                config.adjustments = 'auto';
+            }
+        }
+
+        /**
+         * The proxy Element that is resized in place of the real Element during the resize operation.
+         * This may be queried using {@link Ext.Element#getBox} to provide the new area to resize to.
+         * Read only.
+         * @type Ext.Element.
+         * @property proxy
+         */
+        this.proxy = this.el.createProxy({tag: 'div', cls: 'x-resizable-proxy', id: this.el.id + '-rzproxy'}, Ext.getBody());
+        this.proxy.unselectable();
+        this.proxy.enableDisplayMode('block');
+
+        Ext.apply(this, config);
+
+        if(this.pinned){
+            this.disableTrackOver = true;
+            this.el.addClass('x-resizable-pinned');
+        }
+        // if the element isn't positioned, make it relative
+        var position = this.el.getStyle('position');
+        if(position != 'absolute' && position != 'fixed'){
+            this.el.setStyle('position', 'relative');
+        }
+        if(!this.handles){ // no handles passed, must be legacy style
+            this.handles = 's,e,se';
+            if(this.multiDirectional){
+                this.handles += ',n,w';
+            }
+        }
+        if(this.handles == 'all'){
+            this.handles = 'n s e w ne nw se sw';
+        }
+        var hs = this.handles.split(/\s*?[,;]\s*?| /);
+        var ps = Ext.Resizable.positions;
+        for(var i = 0, len = hs.length; i < len; i++){
+            if(hs[i] && ps[hs[i]]){
+                var pos = ps[hs[i]];
+                this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent, this.handleCls);
+            }
+        }
+        // legacy
+        this.corner = this.southeast;
+
+        if(this.handles.indexOf('n') != -1 || this.handles.indexOf('w') != -1){
+            this.updateBox = true;
+        }
+
+        this.activeHandle = null;
+
+        if(this.resizeChild){
+            if(typeof this.resizeChild == 'boolean'){
+                this.resizeChild = Ext.get(this.el.dom.firstChild, true);
+            }else{
+                this.resizeChild = Ext.get(this.resizeChild, true);
+            }
+        }
+
+        if(this.adjustments == 'auto'){
+            var rc = this.resizeChild;
+            var hw = this.west, he = this.east, hn = this.north, hs = this.south;
+            if(rc && (hw || hn)){
+                rc.position('relative');
+                rc.setLeft(hw ? hw.el.getWidth() : 0);
+                rc.setTop(hn ? hn.el.getHeight() : 0);
+            }
+            this.adjustments = [
+                (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
+                (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1
+            ];
+        }
+
+        if(this.draggable){
+            this.dd = this.dynamic ?
+                this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
+            this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
+            if(this.constrainTo){
+                this.dd.constrainTo(this.constrainTo);
+            }
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeresize
+             * Fired before resize is allowed. Set {@link #enabled} to false to cancel resize.
+             * @param {Ext.Resizable} this
+             * @param {Ext.EventObject} e The mousedown event
+             */
+            'beforeresize',
+            /**
+             * @event resize
+             * Fired after a resize.
+             * @param {Ext.Resizable} this
+             * @param {Number} width The new width
+             * @param {Number} height The new height
+             * @param {Ext.EventObject} e The mouseup event
+             */
+            'resize'
+        );
+
+        if(this.width !== null && this.height !== null){
+            this.resizeTo(this.width, this.height);
+        }else{
+            this.updateChildSize();
+        }
+        if(Ext.isIE){
+            this.el.dom.style.zoom = 1;
+        }
+        Ext.Resizable.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Array/String} adjustments String 'auto' or an array [width, height] with values to be <b>added</b> to the
+     * resize operation's new size (defaults to <tt>[0, 0]</tt>)
+     */
+    adjustments : [0, 0],
+    /**
+     * @cfg {Boolean} animate True to animate the resize (not compatible with dynamic sizing, defaults to false)
+     */
+    animate : false,
+    /**
+     * @cfg {Mixed} constrainTo Constrain the resize to a particular element
+     */
+    /**
+     * @cfg {Boolean} disableTrackOver True to disable mouse tracking. This is only applied at config time. (defaults to false)
+     */
+    disableTrackOver : false,
+    /**
+     * @cfg {Boolean} draggable Convenience to initialize drag drop (defaults to false)
+     */
+    draggable: false,
+    /**
+     * @cfg {Number} duration Animation duration if animate = true (defaults to 0.35)
+     */
+    duration : 0.35,
+    /**
+     * @cfg {Boolean} dynamic True to resize the element while dragging instead of using a proxy (defaults to false)
+     */
+    dynamic : false,
+    /**
+     * @cfg {String} easing Animation easing if animate = true (defaults to <tt>'easingOutStrong'</tt>)
+     */
+    easing : 'easeOutStrong',
+    /**
+     * @cfg {Boolean} enabled False to disable resizing (defaults to true)
+     */
+    enabled : true,
+    /**
+     * @property enabled Writable. False if resizing is disabled.
+     * @type Boolean
+     */
+    /**
+     * @cfg {String} handles String consisting of the resize handles to display (defaults to undefined).
+     * Specify either <tt>'all'</tt> or any of <tt>'n s e w ne nw se sw'</tt>.
+     */
+    handles : false,
+    /**
+     * @cfg {Boolean} multiDirectional <b>Deprecated</b>.  Deprecated style of adding multi-direction resize handles.
+     */
+    multiDirectional : false,
+    /**
+     * @cfg {Number} height The height of the element in pixels (defaults to null)
+     */
+    height : null,
+    /**
+     * @cfg {Number} width The width of the element in pixels (defaults to null)
+     */
+    width : null,
+    /**
+     * @cfg {Number} heightIncrement The increment to snap the height resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    heightIncrement : 0,
+    /**
+     * @cfg {Number} widthIncrement The increment to snap the width resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    widthIncrement : 0,
+    /**
+     * @cfg {Number} minHeight The minimum height for the element (defaults to 5)
+     */
+    minHeight : 5,
+    /**
+     * @cfg {Number} minWidth The minimum width for the element (defaults to 5)
+     */
+    minWidth : 5,
+    /**
+     * @cfg {Number} maxHeight The maximum height for the element (defaults to 10000)
+     */
+    maxHeight : 10000,
+    /**
+     * @cfg {Number} maxWidth The maximum width for the element (defaults to 10000)
+     */
+    maxWidth : 10000,
+    /**
+     * @cfg {Number} minX The minimum x for the element (defaults to 0)
+     */
+    minX: 0,
+    /**
+     * @cfg {Number} minY The minimum x for the element (defaults to 0)
+     */
+    minY: 0,
+    /**
+     * @cfg {Boolean} pinned True to ensure that the resize handles are always visible, false to display them only when the
+     * user mouses over the resizable borders. This is only applied at config time. (defaults to false)
+     */
+    pinned : false,
+    /**
+     * @cfg {Boolean} preserveRatio True to preserve the original ratio between height
+     * and width during resize (defaults to false)
+     */
+    preserveRatio : false,
+    /**
+     * @cfg {Boolean/String/Element} resizeChild True to resize the first child, or id/element to resize (defaults to false)
+     */
+    resizeChild : false,
+    /**
+     * @cfg {Boolean} transparent True for transparent handles. This is only applied at config time. (defaults to false)
+     */
+    transparent: false,
+    /**
+     * @cfg {Ext.lib.Region} resizeRegion Constrain the resize to a particular region
+     */
+    /**
+     * @cfg {Boolean} wrap True to wrap an element with a div if needed (required for textareas and images, defaults to false)
+     * in favor of the handles config option (defaults to false)
+     */
+    /**
+     * @cfg {String} handleCls A css class to add to each handle. Defaults to <tt>''</tt>.
+     */
+
+
+    /**
+     * Perform a manual resize and fires the 'resize' event.
+     * @param {Number} width
+     * @param {Number} height
+     */
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.updateChildSize();
+        this.fireEvent('resize', this, width, height, null);
+    },
+
+    // private
+    startSizing : function(e, handle){
+        this.fireEvent('beforeresize', this, e);
+        if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler
+
+            if(!this.overlay){
+                this.overlay = this.el.createProxy({tag: 'div', cls: 'x-resizable-overlay', html: '&#160;'}, Ext.getBody());
+                this.overlay.unselectable();
+                this.overlay.enableDisplayMode('block');
+                this.overlay.on({
+                    scope: this,
+                    mousemove: this.onMouseMove,
+                    mouseup: this.onMouseUp
+                });
+            }
+            this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
+
+            this.resizing = true;
+            this.startBox = this.el.getBox();
+            this.startPoint = e.getXY();
+            this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
+                            (this.startBox.y + this.startBox.height) - this.startPoint[1]];
+
+            this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.overlay.show();
+
+            if(this.constrainTo) {
+                var ct = Ext.get(this.constrainTo);
+                this.resizeRegion = ct.getRegion().adjust(
+                    ct.getFrameWidth('t'),
+                    ct.getFrameWidth('l'),
+                    -ct.getFrameWidth('b'),
+                    -ct.getFrameWidth('r')
+                );
+            }
+
+            this.proxy.setStyle('visibility', 'hidden'); // workaround display none
+            this.proxy.show();
+            this.proxy.setBox(this.startBox);
+            if(!this.dynamic){
+                this.proxy.setStyle('visibility', 'visible');
+            }
+        }
+    },
+
+    // private
+    onMouseDown : function(handle, e){
+        if(this.enabled){
+            e.stopEvent();
+            this.activeHandle = handle;
+            this.startSizing(e, handle);
+        }
+    },
+
+    // private
+    onMouseUp : function(e){
+        this.activeHandle = null;
+        var size = this.resizeElement();
+        this.resizing = false;
+        this.handleOut();
+        this.overlay.hide();
+        this.proxy.hide();
+        this.fireEvent('resize', this, size.width, size.height, e);
+    },
+
+    // private
+    updateChildSize : function(){
+        if(this.resizeChild){
+            var el = this.el;
+            var child = this.resizeChild;
+            var adj = this.adjustments;
+            if(el.dom.offsetWidth){
+                var b = el.getSize(true);
+                child.setSize(b.width+adj[0], b.height+adj[1]);
+            }
+            // Second call here for IE
+            // The first call enables instant resizing and
+            // the second call corrects scroll bars if they
+            // exist
+            if(Ext.isIE){
+                setTimeout(function(){
+                    if(el.dom.offsetWidth){
+                        var b = el.getSize(true);
+                        child.setSize(b.width+adj[0], b.height+adj[1]);
+                    }
+                }, 10);
+            }
+        }
+    },
+
+    // private
+    snap : function(value, inc, min){
+        if(!inc || !value){
+            return value;
+        }
+        var newValue = value;
+        var m = value % inc;
+        if(m > 0){
+            if(m > (inc/2)){
+                newValue = value + (inc-m);
+            }else{
+                newValue = value - m;
+            }
+        }
+        return Math.max(min, newValue);
+    },
+
+    /**
+     * <p>Performs resizing of the associated Element. This method is called internally by this
+     * class, and should not be called by user code.</p>
+     * <p>If a Resizable is being used to resize an Element which encapsulates a more complex UI
+     * component such as a Panel, this method may be overridden by specifying an implementation
+     * as a config option to provide appropriate behaviour at the end of the resize operation on
+     * mouseup, for example resizing the Panel, and relaying the Panel's content.</p>
+     * <p>The new area to be resized to is available by examining the state of the {@link #proxy}
+     * Element. Example:
+<pre><code>
+new Ext.Panel({
+    title: 'Resize me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    listeners: {
+        render: function(p) {
+            new Ext.Resizable(p.getEl(), {
+                handles: 'all',
+                pinned: true,
+                transparent: true,
+                resizeElement: function() {
+                    var box = this.proxy.getBox();
+                    p.updateBox(box);
+                    if (p.layout) {
+                        p.doLayout();
+                    }
+                    return box;
+                }
+           });
+       }
+    }
+}).show();
+</code></pre>
+     */
+    resizeElement : function(){
+        var box = this.proxy.getBox();
+        if(this.updateBox){
+            this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
+        }else{
+            this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
+        }
+        this.updateChildSize();
+        if(!this.dynamic){
+            this.proxy.hide();
+        }
+        if(this.draggable && this.constrainTo){
+            this.dd.resetConstraints();
+            this.dd.constrainTo(this.constrainTo);
+        }
+        return box;
+    },
+
+    // private
+    constrain : function(v, diff, m, mx){
+        if(v - diff < m){
+            diff = v - m;
+        }else if(v - diff > mx){
+            diff = v - mx;
+        }
+        return diff;
+    },
+
+    // private
+    onMouseMove : function(e){
+        if(this.enabled && this.activeHandle){
+            try{// try catch so if something goes wrong the user doesn't get hung
+
+            if(this.resizeRegion && !this.resizeRegion.contains(e.getPoint())) {
+                return;
+            }
+
+            //var curXY = this.startPoint;
+            var curSize = this.curSize || this.startBox,
+                x = this.startBox.x, y = this.startBox.y,
+                ox = x,
+                oy = y,
+                w = curSize.width,
+                h = curSize.height,
+                ow = w,
+                oh = h,
+                mw = this.minWidth,
+                mh = this.minHeight,
+                mxw = this.maxWidth,
+                mxh = this.maxHeight,
+                wi = this.widthIncrement,
+                hi = this.heightIncrement,
+                eventXY = e.getXY(),
+                diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0])),
+                diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1])),
+                pos = this.activeHandle.position,
+                tw,
+                th;
+
+            switch(pos){
+                case 'east':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    break;
+                case 'south':
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'southeast':
+                    w += diffX;
+                    h += diffY;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'north':
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'west':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+                case 'northeast':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'northwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    x += diffX;
+                    w -= diffX;
+                    break;
+               case 'southwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+            }
+
+            var sw = this.snap(w, wi, mw);
+            var sh = this.snap(h, hi, mh);
+            if(sw != w || sh != h){
+                switch(pos){
+                    case 'northeast':
+                        y -= sh - h;
+                    break;
+                    case 'north':
+                        y -= sh - h;
+                        break;
+                    case 'southwest':
+                        x -= sw - w;
+                    break;
+                    case 'west':
+                        x -= sw - w;
+                        break;
+                    case 'northwest':
+                        x -= sw - w;
+                        y -= sh - h;
+                    break;
+                }
+                w = sw;
+                h = sh;
+            }
+
+            if(this.preserveRatio){
+                switch(pos){
+                    case 'southeast':
+                    case 'east':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                       break;
+                    case 'south':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        break;
+                    case 'northeast':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                    break;
+                    case 'north':
+                        tw = w;
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        x += (tw - w) / 2;
+                        break;
+                    case 'southwest':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                        break;
+                    case 'west':
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        y += (th - h) / 2;
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                       break;
+                    case 'northwest':
+                        tw = w;
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                        y += th - h;
+                        x += tw - w;
+                        break;
+
+                }
+            }
+            this.proxy.setBounds(x, y, w, h);
+            if(this.dynamic){
+                this.resizeElement();
+            }
+            }catch(ex){}
+        }
+    },
+
+    // private
+    handleOver : function(){
+        if(this.enabled){
+            this.el.addClass('x-resizable-over');
+        }
+    },
+
+    // private
+    handleOut : function(){
+        if(!this.resizing){
+            this.el.removeClass('x-resizable-over');
+        }
+    },
+
+    /**
+     * Returns the element this component is bound to.
+     * @return {Ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the resizeChild element (or null).
+     * @return {Ext.Element}
+     */
+    getResizeChild : function(){
+        return this.resizeChild;
+    },
+
+    /**
+     * Destroys this resizable. If the element was wrapped and
+     * removeEl is not true then the element remains.
+     * @param {Boolean} removeEl (optional) true to remove the element from the DOM
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.dd, this.overlay, this.proxy);
+        this.overlay = null;
+        this.proxy = null;
+
+        var ps = Ext.Resizable.positions;
+        for(var k in ps){
+            if(typeof ps[k] != 'function' && this[ps[k]]){
+                this[ps[k]].destroy();
+            }
+        }
+        if(removeEl){
+            this.el.update('');
+            Ext.destroy(this.el);
+            this.el = null;
+        }
+        this.purgeListeners();
+    },
+
+    syncHandleHeight : function(){
+        var h = this.el.getHeight(true);
+        if(this.west){
+            this.west.el.setHeight(h);
+        }
+        if(this.east){
+            this.east.el.setHeight(h);
+        }
+    }
+});
+
+// private
+// hash to map config positions to true positions
+Ext.Resizable.positions = {
+    n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast'
+};
+
+Ext.Resizable.Handle = Ext.extend(Object, {
+    constructor : function(rz, pos, disableTrackOver, transparent, cls){
+       if(!this.tpl){
+            // only initialize the template if resizable is used
+            var tpl = Ext.DomHelper.createTemplate(
+                {tag: 'div', cls: 'x-resizable-handle x-resizable-handle-{0}'}
+            );
+            tpl.compile();
+            Ext.Resizable.Handle.prototype.tpl = tpl;
+        }
+        this.position = pos;
+        this.rz = rz;
+        this.el = this.tpl.append(rz.el.dom, [this.position], true);
+        this.el.unselectable();
+        if(transparent){
+            this.el.setOpacity(0);
+        }
+        if(!Ext.isEmpty(cls)){
+            this.el.addClass(cls);
+        }
+        this.el.on('mousedown', this.onMouseDown, this);
+        if(!disableTrackOver){
+            this.el.on({
+                scope: this,
+                mouseover: this.onMouseOver,
+                mouseout: this.onMouseOut
+            });
+        }
+    },
+
+    // private
+    afterResize : function(rz){
+        // do nothing
+    },
+    // private
+    onMouseDown : function(e){
+        this.rz.onMouseDown(this, e);
+    },
+    // private
+    onMouseOver : function(e){
+        this.rz.handleOver(this, e);
+    },
+    // private
+    onMouseOut : function(e){
+        this.rz.handleOut(this, e);
+    },
+    // private
+    destroy : function(){
+        Ext.destroy(this.el);
+        this.el = null;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-history-debug.js	(revision 76)
@@ -0,0 +1,221 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.History
+ * @extends Ext.util.Observable
+ * History management component that allows you to register arbitrary tokens that signify application
+ * history state on navigation actions.  You can then handle the history {@link #change} event in order
+ * to reset your application UI to the appropriate state when the user navigates forward or backward through
+ * the browser history stack.
+ * @singleton
+ */
+Ext.History = (function () {
+    var iframe, hiddenField;
+    var ready = false;
+    var currentToken;
+
+    function getHash() {
+        var href = location.href, i = href.indexOf("#"),
+            hash = i >= 0 ? href.substr(i + 1) : null;
+             
+        if (Ext.isGecko) {
+            hash = decodeURIComponent(hash);
+        }
+        return hash;
+    }
+
+    function doSave() {
+        hiddenField.value = currentToken;
+    }
+
+    function handleStateChange(token) {
+        currentToken = token;
+        Ext.History.fireEvent('change', token);
+    }
+
+    function updateIFrame (token) {
+        var html = ['<html><body><div id="state">',Ext.util.Format.htmlEncode(token),'</div></body></html>'].join('');
+        try {
+            var doc = iframe.contentWindow.document;
+            doc.open();
+            doc.write(html);
+            doc.close();
+            return true;
+        } catch (e) {
+            return false;
+        }
+    }
+
+    function checkIFrame() {
+        if (!iframe.contentWindow || !iframe.contentWindow.document) {
+            setTimeout(checkIFrame, 10);
+            return;
+        }
+
+        var doc = iframe.contentWindow.document;
+        var elem = doc.getElementById("state");
+        var token = elem ? elem.innerText : null;
+
+        var hash = getHash();
+
+        setInterval(function () {
+
+            doc = iframe.contentWindow.document;
+            elem = doc.getElementById("state");
+
+            var newtoken = elem ? elem.innerText : null;
+
+            var newHash = getHash();
+
+            if (newtoken !== token) {
+                token = newtoken;
+                handleStateChange(token);
+                location.hash = token;
+                hash = token;
+                doSave();
+            } else if (newHash !== hash) {
+                hash = newHash;
+                updateIFrame(newHash);
+            }
+
+        }, 50);
+
+        ready = true;
+
+        Ext.History.fireEvent('ready', Ext.History);
+    }
+
+    function startUp() {
+        currentToken = hiddenField.value ? hiddenField.value : getHash();
+
+        if (Ext.isIE) {
+            checkIFrame();
+        } else {
+            var hash = getHash();
+            setInterval(function () {
+                var newHash = getHash();
+                if (newHash !== hash) {
+                    hash = newHash;
+                    handleStateChange(hash);
+                    doSave();
+                }
+            }, 50);
+            ready = true;
+            Ext.History.fireEvent('ready', Ext.History);
+        }
+    }
+
+    return {
+        /**
+         * The id of the hidden field required for storing the current history token.
+         * @type String
+         * @property
+         */
+        fieldId: 'x-history-field',
+        /**
+         * The id of the iframe required by IE to manage the history stack.
+         * @type String
+         * @property
+         */
+        iframeId: 'x-history-frame',
+
+        events:{},
+
+        /**
+         * Initialize the global History instance.
+         * @param {Boolean} onReady (optional) A callback function that will be called once the history
+         * component is fully initialized.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser window.
+         */
+        init: function (onReady, scope) {
+            if(ready) {
+                Ext.callback(onReady, scope, [this]);
+                return;
+            }
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.History.init(onReady, scope);
+                });
+                return;
+            }
+            hiddenField = Ext.getDom(Ext.History.fieldId);
+            if (Ext.isIE) {
+                iframe = Ext.getDom(Ext.History.iframeId);
+            }
+            this.addEvents(
+                /**
+                 * @event ready
+                 * Fires when the Ext.History singleton has been initialized and is ready for use.
+                 * @param {Ext.History} The Ext.History singleton.
+                 */
+                'ready',
+                /**
+                 * @event change
+                 * Fires when navigation back or forwards within the local page's history occurs.
+                 * @param {String} token An identifier associated with the page state at that point in its history.
+                 */
+                'change'
+            );
+            if(onReady){
+                this.on('ready', onReady, scope, {single:true});
+            }
+            startUp();
+        },
+
+        /**
+         * Add a new token to the history stack. This can be any arbitrary value, although it would
+         * commonly be the concatenation of a component id and another id marking the specifc history
+         * state of that component.  Example usage:
+         * <pre><code>
+// Handle tab changes on a TabPanel
+tabPanel.on('tabchange', function(tabPanel, tab){
+    Ext.History.add(tabPanel.id + ':' + tab.id);
+});
+</code></pre>
+         * @param {String} token The value that defines a particular application-specific history state
+         * @param {Boolean} preventDuplicates When true, if the passed token matches the current token
+         * it will not save a new history step. Set to false if the same state can be saved more than once
+         * at the same history stack location (defaults to true).
+         */
+        add: function (token, preventDup) {
+            if(preventDup !== false){
+                if(this.getToken() == token){
+                    return true;
+                }
+            }
+            if (Ext.isIE) {
+                return updateIFrame(token);
+            } else {
+                location.hash = token;
+                return true;
+            }
+        },
+
+        /**
+         * Programmatically steps back one step in browser history (equivalent to the user pressing the Back button).
+         */
+        back: function(){
+            history.go(-1);
+        },
+
+        /**
+         * Programmatically steps forward one step in browser history (equivalent to the user pressing the Forward button).
+         */
+        forward: function(){
+            history.go(1);
+        },
+
+        /**
+         * Retrieves the currently-active history token.
+         * @return {String} The token
+         */
+        getToken: function() {
+            return ready ? currentToken : getHash();
+        }
+    };
+})();
+Ext.apply(Ext.History, new Ext.util.Observable());
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-json-debug.js	(revision 76)
@@ -0,0 +1,650 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.JsonWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action.
+ */
+Ext.data.JsonWriter = Ext.extend(Ext.data.DataWriter, {
+    /**
+     * @cfg {Boolean} encode <p><tt>true</tt> to {@link Ext.util.JSON#encode JSON encode} the
+     * {@link Ext.data.DataWriter#toHash hashed data} into a standard HTTP parameter named after this
+     * Reader's <code>meta.root</code> property which, by default is imported from the associated Reader. Defaults to <tt>true</tt>.</p>
+     * <p>If set to <code>false</code>, the hashed data is {@link Ext.util.JSON#encode JSON encoded}, along with
+     * the associated {@link Ext.data.Store}'s {@link Ext.data.Store#baseParams baseParams}, into the POST body.</p>
+     * <p>When using {@link Ext.data.DirectProxy}, set this to <tt>false</tt> since Ext.Direct.JsonProvider will perform
+     * its own json-encoding.  In addition, if you're using {@link Ext.data.HttpProxy}, setting to <tt>false</tt>
+     * will cause HttpProxy to transmit data using the <b>jsonData</b> configuration-params of {@link Ext.Ajax#request}
+     * instead of <b>params</b>.</p>
+     * <p>When using a {@link Ext.data.Store#restful} Store, some serverside frameworks are
+     * tuned to expect data through the jsonData mechanism.  In those cases, one will want to set <b>encode: <tt>false</tt></b>, as in
+     * let the lower-level connection object (eg: Ext.Ajax) do the encoding.</p>
+     */
+    encode : true,
+    /**
+     * @cfg {Boolean} encodeDelete False to send only the id to the server on delete, true to encode it in an object
+     * literal, eg: <pre><code>
+{id: 1}
+ * </code></pre> Defaults to <tt>false</tt>
+     */
+    encodeDelete: false,
+    
+    constructor : function(config){
+        Ext.data.JsonWriter.superclass.constructor.call(this, config);    
+    },
+
+    /**
+     * <p>This method should not need to be called by application code, however it may be useful on occasion to
+     * override it, or augment it with an {@link Function#createInterceptor interceptor} or {@link Function#createSequence sequence}.</p>
+     * <p>The provided implementation encodes the serialized data representing the Store's modified Records into the Ajax request's
+     * <code>params</code> according to the <code>{@link #encode}</code> setting.</p>
+     * @param {Object} Ajax request params object to write into.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data object representing the serialized modified records from the Store. May be either a single object,
+     * or an Array of objects - user implementations must handle both cases.
+     */
+    render : function(params, baseParams, data) {
+        if (this.encode === true) {
+            // Encode here now.
+            Ext.apply(params, baseParams);
+            params[this.meta.root] = Ext.encode(data);
+        } else {
+            // defer encoding for some other layer, probably in {@link Ext.Ajax#request}.  Place everything into "jsonData" key.
+            var jdata = Ext.apply({}, baseParams);
+            jdata[this.meta.root] = data;
+            params.jsonData = jdata;
+        }
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    createRecord : function(rec) {
+       return this.toHash(rec);
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    updateRecord : function(rec) {
+        return this.toHash(rec);
+
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    destroyRecord : function(rec){
+        if(this.encodeDelete){
+            var data = {};
+            data[this.meta.idProperty] = rec.id;
+            return data;
+        }else{
+            return rec.id;
+        }
+    }
+});/**
+ * @class Ext.data.JsonReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects
+ * from a JSON packet based on mappings in a provided {@link Ext.data.Record}
+ * constructor.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var myReader = new Ext.data.JsonReader({
+    // metadata configuration options:
+    {@link #idProperty}: 'id'
+    {@link #root}: 'rows',
+    {@link #totalProperty}: 'results',
+    {@link Ext.data.DataReader#messageProperty}: "msg"  // The element within the response that provides a user-feedback message (optional)
+
+    // the fields config option will internally create an {@link Ext.data.Record}
+    // constructor that provides mapping for reading the record data objects
+    {@link Ext.data.DataReader#fields fields}: [
+        // map Record&#39;s 'firstname' field to data object&#39;s key of same name
+        {name: 'name', mapping: 'firstname'},
+        // map Record&#39;s 'job' field to data object&#39;s 'occupation' key
+        {name: 'job', mapping: 'occupation'}
+    ]
+});
+</code></pre>
+ * <p>This would consume a JSON data object of the form:</p><pre><code>
+{
+    results: 2000, // Reader&#39;s configured {@link #totalProperty}
+    rows: [        // Reader&#39;s configured {@link #root}
+        // record data objects:
+        { {@link #idProperty id}: 1, firstname: 'Bill', occupation: 'Gardener' },
+        { {@link #idProperty id}: 2, firstname: 'Ben' , occupation: 'Horticulturalist' },
+        ...
+    ]
+}
+</code></pre>
+ * <p><b><u>Automatic configuration using metaData</u></b></p>
+ * <p>It is possible to change a JsonReader's metadata at any time by including
+ * a <b><tt>metaData</tt></b> property in the JSON data object. If the JSON data
+ * object has a <b><tt>metaData</tt></b> property, a {@link Ext.data.Store Store}
+ * object using this Reader will reconfigure itself to use the newly provided
+ * field definition and fire its {@link Ext.data.Store#metachange metachange}
+ * event. The metachange event handler may interrogate the <b><tt>metaData</tt></b>
+ * property to perform any configuration required.</p>
+ * <p>Note that reconfiguring a Store potentially invalidates objects which may
+ * refer to Fields or Records which no longer exist.</p>
+ * <p>To use this facility you would create the JsonReader like this:</p><pre><code>
+var myReader = new Ext.data.JsonReader();
+</code></pre>
+ * <p>The first data packet from the server would configure the reader by
+ * containing a <b><tt>metaData</tt></b> property <b>and</b> the data. For
+ * example, the JSON data object might take the form:</p><pre><code>
+{
+    metaData: {
+        "{@link #idProperty}": "id",
+        "{@link #root}": "rows",
+        "{@link #totalProperty}": "results"
+        "{@link #successProperty}": "success",
+        "{@link Ext.data.DataReader#fields fields}": [
+            {"name": "name"},
+            {"name": "job", "mapping": "occupation"}
+        ],
+        // used by store to set its sortInfo
+        "sortInfo":{
+           "field": "name",
+           "direction": "ASC"
+        },
+        // {@link Ext.PagingToolbar paging data} (if applicable)
+        "start": 0,
+        "limit": 2,
+        // custom property
+        "foo": "bar"
+    },
+    // Reader&#39;s configured {@link #successProperty}
+    "success": true,
+    // Reader&#39;s configured {@link #totalProperty}
+    "results": 2000,
+    // Reader&#39;s configured {@link #root}
+    // (this data simulates 2 results {@link Ext.PagingToolbar per page})
+    "rows": [ // <b>*Note:</b> this must be an Array
+        { "id": 1, "name": "Bill", "occupation": "Gardener" },
+        { "id": 2, "name":  "Ben", "occupation": "Horticulturalist" }
+    ]
+}
+ * </code></pre>
+ * <p>The <b><tt>metaData</tt></b> property in the JSON data object should contain:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>any of the configuration options for this class</li>
+ * <li>a <b><tt>{@link Ext.data.Record#fields fields}</tt></b> property which
+ * the JsonReader will use as an argument to the
+ * {@link Ext.data.Record#create data Record create method} in order to
+ * configure the layout of the Records it will produce.</li>
+ * <li>a <b><tt>{@link Ext.data.Store#sortInfo sortInfo}</tt></b> property
+ * which the JsonReader will use to set the {@link Ext.data.Store}'s
+ * {@link Ext.data.Store#sortInfo sortInfo} property</li>
+ * <li>any custom properties needed</li>
+ * </ul></div>
+ *
+ * @constructor
+ * Create a new JsonReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.JsonReader = function(meta, recordType){
+    meta = meta || {};
+    /**
+     * @cfg {String} idProperty [id] Name of the property within a row object
+     * that contains a record identifier value.  Defaults to <tt>id</tt>
+     */
+    /**
+     * @cfg {String} successProperty [success] Name of the property from which to
+     * retrieve the success attribute. Defaults to <tt>success</tt>.  See
+     * {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+     * for additional information.
+     */
+    /**
+     * @cfg {String} totalProperty [total] Name of the property from which to
+     * retrieve the total number of records in the dataset. This is only needed
+     * if the whole dataset is not passed in one go, but is being paged from
+     * the remote server.  Defaults to <tt>total</tt>.
+     */
+    /**
+     * @cfg {String} root [undefined] <b>Required</b>.  The name of the property
+     * which contains the Array of row objects.  Defaults to <tt>undefined</tt>.
+     * An exception will be thrown if the root property is undefined. The data
+     * packet value for this property should be an empty array to clear the data
+     * or show no data.
+     */
+    Ext.applyIf(meta, {
+        idProperty: 'id',
+        successProperty: 'success',
+        totalProperty: 'total'
+    });
+
+    Ext.data.JsonReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.JsonReader, Ext.data.DataReader, {
+    /**
+     * This JsonReader's metadata as passed to the constructor, or as passed in
+     * the last data packet's <b><tt>metaData</tt></b> property.
+     * @type Mixed
+     * @property meta
+     */
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the JSON data in its responseText.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var json = response.responseText;
+        var o = Ext.decode(json);
+        if(!o) {
+            throw {message: 'JsonReader.read: Json object not found'};
+        }
+        return this.readRecords(o);
+    },
+
+    /*
+     * TODO: refactor code between JsonReader#readRecords, #readResponse into 1 method.
+     * there's ugly duplication going on due to maintaining backwards compat. with 2.0.  It's time to do this.
+     */
+    /**
+     * Decode a JSON response from server.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} response The XHR object returned through an Ajax server request.
+     * @return {Response} A {@link Ext.data.Response Response} object containing the data response, and also status information.
+     */
+    readResponse : function(action, response) {
+        var o = (response.responseText !== undefined) ? Ext.decode(response.responseText) : response;
+        if(!o) {
+            throw new Ext.data.JsonReader.Error('response');
+        }
+
+        var root = this.getRoot(o),
+            success = this.getSuccess(o);
+        if (success && action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(root);
+            if (def && Ext.isEmpty(root)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+
+        // instantiate response object
+        var res = new Ext.data.Response({
+            action: action,
+            success: success,
+            data: (root) ? this.extractData(root, false) : [],
+            message: this.getMessage(o),
+            raw: o
+        });
+
+        // blow up if no successProperty
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.JsonReader.Error('successProperty-response', this.meta.successProperty);
+        }
+        return res;
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from a JSON object.
+     * @param {Object} o An object which contains an Array of row objects in the property specified
+     * in the config as 'root, and optionally a property, specified in the config as 'totalProperty'
+     * which contains the total size of the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        /**
+         * After any data loads, the raw JSON data is available for further custom processing.  If no data is
+         * loaded or there is a load exception this property will be undefined.
+         * @type Object
+         */
+        this.jsonData = o;
+        if(o.metaData){
+            this.onMetaChange(o.metaData);
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length, v;
+
+        var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
+        if(s.totalProperty){
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)){
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        // TODO return Ext.data.Response instance instead.  @see #readResponse
+        return {
+            success : success,
+            records : this.extractData(root, true), // <-- true to return [Ext.data.Record]
+            totalRecords : totalRecords
+        };
+    },
+
+    // private
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = s.root ? this.createAccessor(s.root) : function(p){return p;};
+        if (s.id || s.idProperty) {
+            var g = this.createAccessor(s.id || s.idProperty);
+            this.getId = function(rec) {
+                var r = g(rec);
+                return (r === undefined || r === '') ? null : r;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * @ignore
+     * TODO This isn't used anywhere??  Don't we want to use this where possible instead of complex #createAccessor?
+     */
+    simpleAccess : function(obj, subsc) {
+        return obj[subsc];
+    },
+
+    /**
+     * @ignore
+     */
+    createAccessor : function(){
+        var re = /[\[\.]/;
+        return function(expr) {
+            if(Ext.isEmpty(expr)){
+                return Ext.emptyFn;
+            }
+            if(Ext.isFunction(expr)){
+                return expr;
+            }
+            var i = String(expr).search(re);
+            if(i >= 0){
+                return new Function('obj', 'return obj' + (i > 0 ? '.' : '') + expr);
+            }
+            return function(obj){
+                return obj[expr];
+            };
+
+        };
+    }(),
+
+    /**
+     * type-casts a single row of raw-data from server
+     * @param {Object} data
+     * @param {Array} items
+     * @param {Integer} len
+     * @private
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
+
+/**
+ * @class Ext.data.JsonReader.Error
+ * Error class for JsonReader
+ */
+Ext.data.JsonReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name : 'Ext.data.JsonReader'
+});
+Ext.apply(Ext.data.JsonReader.Error.prototype, {
+    lang: {
+        'response': 'An error occurred while json-decoding your server response',
+        'successProperty-response': 'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',
+        'root-undefined-config': 'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',
+        'idProperty-undefined' : 'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',
+        'root-empty': 'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'
+    }
+});
+/**
+ * @class Ext.data.ArrayReader
+ * @extends Ext.data.JsonReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an Array.
+ * Each element of that Array represents a row of data fields. The
+ * fields are pulled into a Record object using as a subscript, the <code>mapping</code> property
+ * of the field definition if it exists, or the field's ordinal position in the definition.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+    {name: 'name', mapping: 1},         // "mapping" only needed if an "id" field is present which
+    {name: 'occupation', mapping: 2}    // precludes using the ordinal position as the index.
+]);
+var myReader = new Ext.data.ArrayReader({
+    {@link #idIndex}: 0
+}, Employee);
+</code></pre>
+ * <p>This would consume an Array like this:</p>
+ * <pre><code>
+[ [1, 'Bill', 'Gardener'], [2, 'Ben', 'Horticulturalist'] ]
+ * </code></pre>
+ * @constructor
+ * Create a new ArrayReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.ArrayReader = Ext.extend(Ext.data.JsonReader, {
+    /**
+     * @cfg {String} successProperty
+     * @hide
+     */
+    /**
+     * @cfg {Number} id (optional) The subscript within row Array that provides an ID for the Record.
+     * Deprecated. Use {@link #idIndex} instead.
+     */
+    /**
+     * @cfg {Number} idIndex (optional) The subscript within row Array that provides an ID for the Record.
+     */
+    /**
+     * Create a data block containing Ext.data.Records from an Array.
+     * @param {Object} o An Array of row objects which represents the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        this.arrayData = o;
+        var s = this.meta,
+            sid = s ? Ext.num(s.idIndex, s.id) : null,
+            recordType = this.recordType,
+            fields = recordType.prototype.fields,
+            records = [],
+            success = true,
+            v;
+
+        var root = this.getRoot(o);
+
+        for(var i = 0, len = root.length; i < len; i++) {
+            var n = root[i],
+                values = {},
+                id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null);
+            for(var j = 0, jlen = fields.length; j < jlen; j++) {
+                var f = fields.items[j],
+                    k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j;
+                v = n[k] !== undefined ? n[k] : f.defaultValue;
+                v = f.convert(v, n);
+                values[f.name] = v;
+            }
+            var record = new recordType(values, id);
+            record.json = n;
+            records[records.length] = record;
+        }
+
+        var totalRecords = records.length;
+
+        if(s.totalProperty) {
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)) {
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords
+        };
+    }
+});/**
+ * @class Ext.data.ArrayStore
+ * @extends Ext.data.Store
+ * <p>Formerly known as "SimpleStore".</p>
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from Array data easier.
+ * An ArrayStore will be automatically configured with a {@link Ext.data.ArrayReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.ArrayStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    // reader configs
+    idIndex: 0,  
+    fields: [
+       'company',
+       {name: 'price', type: 'float'},
+       {name: 'change', type: 'float'},
+       {name: 'pctChange', type: 'float'},
+       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+var myData = [
+    ['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
+    ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
+    ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
+    ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
+    ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
+];
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.ArrayReader ArrayReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype arraystore
+ */
+Ext.data.ArrayStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.ArrayStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.ArrayReader(config)
+        }));
+    },
+
+    loadData : function(data, append){
+        if(this.expandData === true){
+            var r = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                r[r.length] = [data[i]];
+            }
+            data = r;
+        }
+        Ext.data.ArrayStore.superclass.loadData.call(this, data, append);
+    }
+});
+Ext.reg('arraystore', Ext.data.ArrayStore);
+
+// backwards compat
+Ext.data.SimpleStore = Ext.data.ArrayStore;
+Ext.reg('simplestore', Ext.data.SimpleStore);/**
+ * @class Ext.data.JsonStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from JSON data easier.
+ * A JsonStore will be automatically configured with a {@link Ext.data.JsonReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.JsonStore({
+    // store configs
+    autoDestroy: true,
+    url: 'get-images.php',
+    storeId: 'myStore',
+    // reader configs
+    root: 'images',
+    idProperty: 'name',
+    fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date'}]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+{
+    images: [
+        {name: 'Image one', url:'/GetImage.php?id=1', size:46.5, lastmod: new Date(2007, 10, 29)},
+        {name: 'Image Two', url:'/GetImage.php?id=2', size:43.2, lastmod: new Date(2007, 10, 30)}
+    ]
+}
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of
+ * <b>{@link Ext.data.JsonReader JsonReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype jsonstore
+ */
+Ext.data.JsonStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.JsonStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.JsonReader(config)
+        }));
+    }
+});
+Ext.reg('jsonstore', Ext.data.JsonStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.form.Field=Ext.extend(Ext.BoxComponent,{invalidClass:"x-form-invalid",invalidText:"The value in this field is invalid",focusClass:"x-form-focus",validationEvent:"keyup",validateOnBlur:true,validationDelay:250,defaultAutoCreate:{tag:"input",type:"text",size:"20",autocomplete:"off"},fieldClass:"x-form-field",msgTarget:"qtip",msgFx:"normal",readOnly:false,disabled:false,submitValue:true,isFormField:true,msgDisplay:"",hasFocus:false,initComponent:function(){Ext.form.Field.superclass.initComponent.call(this);this.addEvents("focus","blur","specialkey","change","invalid","valid")},getName:function(){return this.rendered&&this.el.dom.name?this.el.dom.name:this.name||this.id||""},onRender:function(c,a){if(!this.el){var b=this.getAutoCreate();if(!b.name){b.name=this.name||this.id}if(this.inputType){b.type=this.inputType}this.autoEl=b}Ext.form.Field.superclass.onRender.call(this,c,a);if(this.submitValue===false){this.el.dom.removeAttribute("name")}var d=this.el.dom.type;if(d){if(d=="password"){d="text"}this.el.addClass("x-form-"+d)}if(this.readOnly){this.setReadOnly(true)}if(this.tabIndex!==undefined){this.el.dom.setAttribute("tabIndex",this.tabIndex)}this.el.addClass([this.fieldClass,this.cls])},getItemCt:function(){return this.itemCt},initValue:function(){if(this.value!==undefined){this.setValue(this.value)}else{if(!Ext.isEmpty(this.el.dom.value)&&this.el.dom.value!=this.emptyText){this.setValue(this.el.dom.value)}}this.originalValue=this.getValue()},isDirty:function(){if(this.disabled||!this.rendered){return false}return String(this.getValue())!==String(this.originalValue)},setReadOnly:function(a){if(this.rendered){this.el.dom.readOnly=a}this.readOnly=a},afterRender:function(){Ext.form.Field.superclass.afterRender.call(this);this.initEvents();this.initValue()},fireKey:function(a){if(a.isSpecialKey()){this.fireEvent("specialkey",this,a)}},reset:function(){this.setValue(this.originalValue);this.clearInvalid()},initEvents:function(){this.mon(this.el,Ext.EventManager.getKeyEvent(),this.fireKey,this);this.mon(this.el,"focus",this.onFocus,this);this.mon(this.el,"blur",this.onBlur,this,this.inEditor?{buffer:10}:null)},preFocus:Ext.emptyFn,onFocus:function(){this.preFocus();if(this.focusClass){this.el.addClass(this.focusClass)}if(!this.hasFocus){this.hasFocus=true;this.startValue=this.getValue();this.fireEvent("focus",this)}},beforeBlur:Ext.emptyFn,onBlur:function(){this.beforeBlur();if(this.focusClass){this.el.removeClass(this.focusClass)}this.hasFocus=false;if(this.validationEvent!==false&&(this.validateOnBlur||this.validationEvent=="blur")){this.validate()}var a=this.getValue();if(String(a)!==String(this.startValue)){this.fireEvent("change",this,a,this.startValue)}this.fireEvent("blur",this);this.postBlur()},postBlur:Ext.emptyFn,isValid:function(a){if(this.disabled){return true}var c=this.preventMark;this.preventMark=a===true;var b=this.validateValue(this.processValue(this.getRawValue()),a);this.preventMark=c;return b},validate:function(){if(this.disabled||this.validateValue(this.processValue(this.getRawValue()))){this.clearInvalid();return true}return false},processValue:function(a){return a},validateValue:function(b){var a=this.getErrors(b)[0];if(a==undefined){return true}else{this.markInvalid(a);return false}},getErrors:function(){return[]},getActiveError:function(){return this.activeError||""},markInvalid:function(c){if(this.rendered&&!this.preventMark){c=c||this.invalidText;var a=this.getMessageHandler();if(a){a.mark(this,c)}else{if(this.msgTarget){this.el.addClass(this.invalidClass);var b=Ext.getDom(this.msgTarget);if(b){b.innerHTML=c;b.style.display=this.msgDisplay}}}}this.setActiveError(c)},clearInvalid:function(){if(this.rendered&&!this.preventMark){this.el.removeClass(this.invalidClass);var a=this.getMessageHandler();if(a){a.clear(this)}else{if(this.msgTarget){this.el.removeClass(this.invalidClass);var b=Ext.getDom(this.msgTarget);if(b){b.innerHTML="";b.style.display="none"}}}}this.unsetActiveError()},setActiveError:function(b,a){this.activeError=b;if(a!==true){this.fireEvent("invalid",this,b)}},unsetActiveError:function(a){delete this.activeError;if(a!==true){this.fireEvent("valid",this)}},getMessageHandler:function(){return Ext.form.MessageTargets[this.msgTarget]},getErrorCt:function(){return this.el.findParent(".x-form-element",5,true)||this.el.findParent(".x-form-field-wrap",5,true)},alignErrorEl:function(){this.errorEl.setWidth(this.getErrorCt().getWidth(true)-20)},alignErrorIcon:function(){this.errorIcon.alignTo(this.el,"tl-tr",[2,0])},getRawValue:function(){var a=this.rendered?this.el.getValue():Ext.value(this.value,"");if(a===this.emptyText){a=""}return a},getValue:function(){if(!this.rendered){return this.value}var a=this.el.getValue();if(a===this.emptyText||a===undefined){a=""}return a},setRawValue:function(a){return this.rendered?(this.el.dom.value=(Ext.isEmpty(a)?"":a)):""},setValue:function(a){this.value=a;if(this.rendered){this.el.dom.value=(Ext.isEmpty(a)?"":a);this.validate()}return this},append:function(a){this.setValue([this.getValue(),a].join(""))}});Ext.form.MessageTargets={qtip:{mark:function(a,b){a.el.addClass(a.invalidClass);a.el.dom.qtip=b;a.el.dom.qclass="x-form-invalid-tip";if(Ext.QuickTips){Ext.QuickTips.enable()}},clear:function(a){a.el.removeClass(a.invalidClass);a.el.dom.qtip=""}},title:{mark:function(a,b){a.el.addClass(a.invalidClass);a.el.dom.title=b},clear:function(a){a.el.dom.title=""}},under:{mark:function(b,c){b.el.addClass(b.invalidClass);if(!b.errorEl){var a=b.getErrorCt();if(!a){b.el.dom.title=c;return}b.errorEl=a.createChild({cls:"x-form-invalid-msg"});b.on("resize",b.alignErrorEl,b);b.on("destroy",function(){Ext.destroy(this.errorEl)},b)}b.alignErrorEl();b.errorEl.update(c);Ext.form.Field.msgFx[b.msgFx].show(b.errorEl,b)},clear:function(a){a.el.removeClass(a.invalidClass);if(a.errorEl){Ext.form.Field.msgFx[a.msgFx].hide(a.errorEl,a)}else{a.el.dom.title=""}}},side:{mark:function(b,c){b.el.addClass(b.invalidClass);if(!b.errorIcon){var a=b.getErrorCt();if(!a){b.el.dom.title=c;return}b.errorIcon=a.createChild({cls:"x-form-invalid-icon"});if(b.ownerCt){b.ownerCt.on("afterlayout",b.alignErrorIcon,b);b.ownerCt.on("expand",b.alignErrorIcon,b)}b.on("resize",b.alignErrorIcon,b);b.on("destroy",function(){Ext.destroy(this.errorIcon)},b)}b.alignErrorIcon();b.errorIcon.dom.qtip=c;b.errorIcon.dom.qclass="x-form-invalid-tip";b.errorIcon.show()},clear:function(a){a.el.removeClass(a.invalidClass);if(a.errorIcon){a.errorIcon.dom.qtip="";a.errorIcon.hide()}else{a.el.dom.title=""}}}};Ext.form.Field.msgFx={normal:{show:function(a,b){a.setDisplayed("block")},hide:function(a,b){a.setDisplayed(false).update("")}},slide:{show:function(a,b){a.slideIn("t",{stopFx:true})},hide:function(a,b){a.slideOut("t",{stopFx:true,useDisplay:true})}},slideRight:{show:function(a,b){a.fixDisplay();a.alignTo(b.el,"tl-tr");a.slideIn("l",{stopFx:true})},hide:function(a,b){a.slideOut("l",{stopFx:true,useDisplay:true})}}};Ext.reg("field",Ext.form.Field);Ext.form.TextField=Ext.extend(Ext.form.Field,{grow:false,growMin:30,growMax:800,vtype:null,maskRe:null,disableKeyFilter:false,allowBlank:true,minLength:0,maxLength:Number.MAX_VALUE,minLengthText:"The minimum length for this field is {0}",maxLengthText:"The maximum length for this field is {0}",selectOnFocus:false,blankText:"This field is required",validator:null,regex:null,regexText:"",emptyText:null,emptyClass:"x-form-empty-field",initComponent:function(){Ext.form.TextField.superclass.initComponent.call(this);this.addEvents("autosize","keydown","keyup","keypress")},initEvents:function(){Ext.form.TextField.superclass.initEvents.call(this);if(this.validationEvent=="keyup"){this.validationTask=new Ext.util.DelayedTask(this.validate,this);this.mon(this.el,"keyup",this.filterValidation,this)}else{if(this.validationEvent!==false&&this.validationEvent!="blur"){this.mon(this.el,this.validationEvent,this.validate,this,{buffer:this.validationDelay})}}if(this.selectOnFocus||this.emptyText){this.mon(this.el,"mousedown",this.onMouseDown,this);if(this.emptyText){this.applyEmptyText()}}if(this.maskRe||(this.vtype&&this.disableKeyFilter!==true&&(this.maskRe=Ext.form.VTypes[this.vtype+"Mask"]))){this.mon(this.el,"keypress",this.filterKeys,this)}if(this.grow){this.mon(this.el,"keyup",this.onKeyUpBuffered,this,{buffer:50});this.mon(this.el,"click",this.autoSize,this)}if(this.enableKeyEvents){this.mon(this.el,{scope:this,keyup:this.onKeyUp,keydown:this.onKeyDown,keypress:this.onKeyPress})}},onMouseDown:function(a){if(!this.hasFocus){this.mon(this.el,"mouseup",Ext.emptyFn,this,{single:true,preventDefault:true})}},processValue:function(a){if(this.stripCharsRe){var b=a.replace(this.stripCharsRe,"");if(b!==a){this.setRawValue(b);return b}}return a},filterValidation:function(a){if(!a.isNavKeyPress()){this.validationTask.delay(this.validationDelay)}},onDisable:function(){Ext.form.TextField.superclass.onDisable.call(this);if(Ext.isIE){this.el.dom.unselectable="on"}},onEnable:function(){Ext.form.TextField.superclass.onEnable.call(this);if(Ext.isIE){this.el.dom.unselectable=""}},onKeyUpBuffered:function(a){if(this.doAutoSize(a)){this.autoSize()}},doAutoSize:function(a){return !a.isNavKeyPress()},onKeyUp:function(a){this.fireEvent("keyup",this,a)},onKeyDown:function(a){this.fireEvent("keydown",this,a)},onKeyPress:function(a){this.fireEvent("keypress",this,a)},reset:function(){Ext.form.TextField.superclass.reset.call(this);this.applyEmptyText()},applyEmptyText:function(){if(this.rendered&&this.emptyText&&this.getRawValue().length<1&&!this.hasFocus){this.setRawValue(this.emptyText);this.el.addClass(this.emptyClass)}},preFocus:function(){var a=this.el,b;if(this.emptyText){if(a.dom.value==this.emptyText){this.setRawValue("");b=true}a.removeClass(this.emptyClass)}if(this.selectOnFocus||b){a.dom.select()}},postBlur:function(){this.applyEmptyText()},filterKeys:function(b){if(b.ctrlKey){return}var a=b.getKey();if(Ext.isGecko&&(b.isNavKeyPress()||a==b.BACKSPACE||(a==b.DELETE&&b.button==-1))){return}var c=String.fromCharCode(b.getCharCode());if(!Ext.isGecko&&b.isSpecialKey()&&!c){return}if(!this.maskRe.test(c)){b.stopEvent()}},setValue:function(a){if(this.emptyText&&this.el&&!Ext.isEmpty(a)){this.el.removeClass(this.emptyClass)}Ext.form.TextField.superclass.setValue.apply(this,arguments);this.applyEmptyText();this.autoSize();return this},getErrors:function(a){var d=Ext.form.TextField.superclass.getErrors.apply(this,arguments);a=Ext.isDefined(a)?a:this.processValue(this.getRawValue());if(Ext.isFunction(this.validator)){var c=this.validator(a);if(c!==true){d.push(c)}}if(a.length<1||a===this.emptyText){if(this.allowBlank){return d}else{d.push(this.blankText)}}if(!this.allowBlank&&(a.length<1||a===this.emptyText)){d.push(this.blankText)}if(a.length<this.minLength){d.push(String.format(this.minLengthText,this.minLength))}if(a.length>this.maxLength){d.push(String.format(this.maxLengthText,this.maxLength))}if(this.vtype){var b=Ext.form.VTypes;if(!b[this.vtype](a,this)){d.push(this.vtypeText||b[this.vtype+"Text"])}}if(this.regex&&!this.regex.test(a)){d.push(this.regexText)}return d},selectText:function(g,a){var c=this.getRawValue();var e=false;if(c.length>0){g=g===undefined?0:g;a=a===undefined?c.length:a;var f=this.el.dom;if(f.setSelectionRange){f.setSelectionRange(g,a)}else{if(f.createTextRange){var b=f.createTextRange();b.moveStart("character",g);b.moveEnd("character",a-c.length);b.select()}}e=Ext.isGecko||Ext.isOpera}else{e=true}if(e){this.focus()}},autoSize:function(){if(!this.grow||!this.rendered){return}if(!this.metrics){this.metrics=Ext.util.TextMetrics.createInstance(this.el)}var c=this.el;var b=c.dom.value;var e=document.createElement("div");e.appendChild(document.createTextNode(b));b=e.innerHTML;Ext.removeNode(e);e=null;b+="&#160;";var a=Math.min(this.growMax,Math.max(this.metrics.getWidth(b)+10,this.growMin));this.el.setWidth(a);this.fireEvent("autosize",this,a)},onDestroy:function(){if(this.validationTask){this.validationTask.cancel();this.validationTask=null}Ext.form.TextField.superclass.onDestroy.call(this)}});Ext.reg("textfield",Ext.form.TextField);Ext.form.TriggerField=Ext.extend(Ext.form.TextField,{defaultAutoCreate:{tag:"input",type:"text",size:"16",autocomplete:"off"},hideTrigger:false,editable:true,readOnly:false,wrapFocusClass:"x-trigger-wrap-focus",autoSize:Ext.emptyFn,monitorTab:true,deferHeight:true,mimicing:false,actionMode:"wrap",defaultTriggerWidth:17,onResize:function(a,c){Ext.form.TriggerField.superclass.onResize.call(this,a,c);var b=this.getTriggerWidth();if(Ext.isNumber(a)){this.el.setWidth(a-b)}this.wrap.setWidth(this.el.getWidth()+b)},getTriggerWidth:function(){var a=this.trigger.getWidth();if(!this.hideTrigger&&!this.readOnly&&a===0){a=this.defaultTriggerWidth}return a},alignErrorIcon:function(){if(this.wrap){this.errorIcon.alignTo(this.wrap,"tl-tr",[2,0])}},onRender:function(b,a){this.doc=Ext.isIE?Ext.getBody():Ext.getDoc();Ext.form.TriggerField.superclass.onRender.call(this,b,a);this.wrap=this.el.wrap({cls:"x-form-field-wrap x-form-field-trigger-wrap"});this.trigger=this.wrap.createChild(this.triggerConfig||{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.triggerClass});this.initTrigger();if(!this.width){this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth())}this.resizeEl=this.positionEl=this.wrap},getWidth:function(){return(this.el.getWidth()+this.trigger.getWidth())},updateEditState:function(){if(this.rendered){if(this.readOnly){this.el.dom.readOnly=true;this.el.addClass("x-trigger-noedit");this.mun(this.el,"click",this.onTriggerClick,this);this.trigger.setDisplayed(false)}else{if(!this.editable){this.el.dom.readOnly=true;this.el.addClass("x-trigger-noedit");this.mon(this.el,"click",this.onTriggerClick,this)}else{this.el.dom.readOnly=false;this.el.removeClass("x-trigger-noedit");this.mun(this.el,"click",this.onTriggerClick,this)}this.trigger.setDisplayed(!this.hideTrigger)}this.onResize(this.width||this.wrap.getWidth())}},setHideTrigger:function(a){if(a!=this.hideTrigger){this.hideTrigger=a;this.updateEditState()}},setEditable:function(a){if(a!=this.editable){this.editable=a;this.updateEditState()}},setReadOnly:function(a){if(a!=this.readOnly){this.readOnly=a;this.updateEditState()}},afterRender:function(){Ext.form.TriggerField.superclass.afterRender.call(this);this.updateEditState()},initTrigger:function(){this.mon(this.trigger,"click",this.onTriggerClick,this,{preventDefault:true});this.trigger.addClassOnOver("x-form-trigger-over");this.trigger.addClassOnClick("x-form-trigger-click")},onDestroy:function(){Ext.destroy(this.trigger,this.wrap);if(this.mimicing){this.doc.un("mousedown",this.mimicBlur,this)}delete this.doc;Ext.form.TriggerField.superclass.onDestroy.call(this)},onFocus:function(){Ext.form.TriggerField.superclass.onFocus.call(this);if(!this.mimicing){this.wrap.addClass(this.wrapFocusClass);this.mimicing=true;this.doc.on("mousedown",this.mimicBlur,this,{delay:10});if(this.monitorTab){this.on("specialkey",this.checkTab,this)}}},checkTab:function(a,b){if(b.getKey()==b.TAB){this.triggerBlur()}},onBlur:Ext.emptyFn,mimicBlur:function(a){if(!this.isDestroyed&&!this.wrap.contains(a.target)&&this.validateBlur(a)){this.triggerBlur()}},triggerBlur:function(){this.mimicing=false;this.doc.un("mousedown",this.mimicBlur,this);if(this.monitorTab&&this.el){this.un("specialkey",this.checkTab,this)}Ext.form.TriggerField.superclass.onBlur.call(this);if(this.wrap){this.wrap.removeClass(this.wrapFocusClass)}},beforeBlur:Ext.emptyFn,validateBlur:function(a){return true},onTriggerClick:Ext.emptyFn});Ext.form.TwinTriggerField=Ext.extend(Ext.form.TriggerField,{initComponent:function(){Ext.form.TwinTriggerField.superclass.initComponent.call(this);this.triggerConfig={tag:"span",cls:"x-form-twin-triggers",cn:[{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.trigger1Class},{tag:"img",src:Ext.BLANK_IMAGE_URL,alt:"",cls:"x-form-trigger "+this.trigger2Class}]}},getTrigger:function(a){return this.triggers[a]},afterRender:function(){Ext.form.TwinTriggerField.superclass.afterRender.call(this);var c=this.triggers,b=0,a=c.length;for(;b<a;++b){if(this["hideTrigger"+(b+1)]){c[b].hide()}}},initTrigger:function(){var a=this.trigger.select(".x-form-trigger",true),b=this;a.each(function(d,f,c){var e="Trigger"+(c+1);d.hide=function(){var g=b.wrap.getWidth();this.dom.style.display="none";b.el.setWidth(g-b.trigger.getWidth());b["hidden"+e]=true};d.show=function(){var g=b.wrap.getWidth();this.dom.style.display="";b.el.setWidth(g-b.trigger.getWidth());b["hidden"+e]=false};this.mon(d,"click",this["on"+e+"Click"],this,{preventDefault:true});d.addClassOnOver("x-form-trigger-over");d.addClassOnClick("x-form-trigger-click")},this);this.triggers=a.elements},getTriggerWidth:function(){var a=0;Ext.each(this.triggers,function(d,c){var e="Trigger"+(c+1),b=d.getWidth();if(b===0&&!this["hidden"+e]){a+=this.defaultTriggerWidth}else{a+=b}},this);return a},onDestroy:function(){Ext.destroy(this.triggers);Ext.form.TwinTriggerField.superclass.onDestroy.call(this)},onTrigger1Click:Ext.emptyFn,onTrigger2Click:Ext.emptyFn});Ext.reg("trigger",Ext.form.TriggerField);Ext.form.TextArea=Ext.extend(Ext.form.TextField,{growMin:60,growMax:1000,growAppend:"&#160;\n&#160;",enterIsSpecial:false,preventScrollbars:false,onRender:function(b,a){if(!this.el){this.defaultAutoCreate={tag:"textarea",style:"width:100px;height:60px;",autocomplete:"off"}}Ext.form.TextArea.superclass.onRender.call(this,b,a);if(this.grow){this.textSizeEl=Ext.DomHelper.append(document.body,{tag:"pre",cls:"x-form-grow-sizer"});if(this.preventScrollbars){this.el.setStyle("overflow","hidden")}this.el.setHeight(this.growMin)}},onDestroy:function(){Ext.removeNode(this.textSizeEl);Ext.form.TextArea.superclass.onDestroy.call(this)},fireKey:function(a){if(a.isSpecialKey()&&(this.enterIsSpecial||(a.getKey()!=a.ENTER||a.hasModifier()))){this.fireEvent("specialkey",this,a)}},doAutoSize:function(a){return !a.isNavKeyPress()||a.getKey()==a.ENTER},filterValidation:function(a){if(!a.isNavKeyPress()||(!this.enterIsSpecial&&a.keyCode==a.ENTER)){this.validationTask.delay(this.validationDelay)}},autoSize:function(){if(!this.grow||!this.textSizeEl){return}var c=this.el,a=Ext.util.Format.htmlEncode(c.dom.value),d=this.textSizeEl,b;Ext.fly(d).setWidth(this.el.getWidth());if(a.length<1){a="&#160;&#160;"}else{a+=this.growAppend;if(Ext.isIE){a=a.replace(/\n/g,"&#160;<br />")}}d.innerHTML=a;b=Math.min(this.growMax,Math.max(d.offsetHeight,this.growMin));if(b!=this.lastHeight){this.lastHeight=b;this.el.setHeight(b);this.fireEvent("autosize",this,b)}}});Ext.reg("textarea",Ext.form.TextArea);Ext.form.NumberField=Ext.extend(Ext.form.TextField,{fieldClass:"x-form-field x-form-num-field",allowDecimals:true,decimalSeparator:".",decimalPrecision:2,allowNegative:true,minValue:Number.NEGATIVE_INFINITY,maxValue:Number.MAX_VALUE,minText:"The minimum value for this field is {0}",maxText:"The maximum value for this field is {0}",nanText:"{0} is not a valid number",baseChars:"0123456789",autoStripChars:false,initEvents:function(){var a=this.baseChars+"";if(this.allowDecimals){a+=this.decimalSeparator}if(this.allowNegative){a+="-"}a=Ext.escapeRe(a);this.maskRe=new RegExp("["+a+"]");if(this.autoStripChars){this.stripCharsRe=new RegExp("[^"+a+"]","gi")}Ext.form.NumberField.superclass.initEvents.call(this)},getErrors:function(b){var c=Ext.form.NumberField.superclass.getErrors.apply(this,arguments);b=Ext.isDefined(b)?b:this.processValue(this.getRawValue());if(b.length<1){return c}b=String(b).replace(this.decimalSeparator,".");if(isNaN(b)){c.push(String.format(this.nanText,b))}var a=this.parseValue(b);if(a<this.minValue){c.push(String.format(this.minText,this.minValue))}if(a>this.maxValue){c.push(String.format(this.maxText,this.maxValue))}return c},getValue:function(){return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)))},setValue:function(a){a=Ext.isNumber(a)?a:parseFloat(String(a).replace(this.decimalSeparator,"."));a=this.fixPrecision(a);a=isNaN(a)?"":String(a).replace(".",this.decimalSeparator);return Ext.form.NumberField.superclass.setValue.call(this,a)},setMinValue:function(a){this.minValue=Ext.num(a,Number.NEGATIVE_INFINITY)},setMaxValue:function(a){this.maxValue=Ext.num(a,Number.MAX_VALUE)},parseValue:function(a){a=parseFloat(String(a).replace(this.decimalSeparator,"."));return isNaN(a)?"":a},fixPrecision:function(b){var a=isNaN(b);if(!this.allowDecimals||this.decimalPrecision==-1||a||!b){return a?"":b}return parseFloat(parseFloat(b).toFixed(this.decimalPrecision))},beforeBlur:function(){var a=this.parseValue(this.getRawValue());if(!Ext.isEmpty(a)){this.setValue(a)}}});Ext.reg("numberfield",Ext.form.NumberField);Ext.form.DateField=Ext.extend(Ext.form.TriggerField,{format:"m/d/Y",altFormats:"m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",disabledDaysText:"Disabled",disabledDatesText:"Disabled",minText:"The date in this field must be equal to or after {0}",maxText:"The date in this field must be equal to or before {0}",invalidText:"{0} is not a valid date - it must be in the format {1}",triggerClass:"x-form-date-trigger",showToday:true,startDay:0,defaultAutoCreate:{tag:"input",type:"text",size:"10",autocomplete:"off"},initTime:"12",initTimeFormat:"H",safeParse:function(b,c){if(Date.formatContainsHourInfo(c)){return Date.parseDate(b,c)}else{var a=Date.parseDate(b+" "+this.initTime,c+" "+this.initTimeFormat);if(a){return a.clearTime()}}},initComponent:function(){Ext.form.DateField.superclass.initComponent.call(this);this.addEvents("select");if(Ext.isString(this.minValue)){this.minValue=this.parseDate(this.minValue)}if(Ext.isString(this.maxValue)){this.maxValue=this.parseDate(this.maxValue)}this.disabledDatesRE=null;this.initDisabledDays()},initEvents:function(){Ext.form.DateField.superclass.initEvents.call(this);this.keyNav=new Ext.KeyNav(this.el,{down:function(a){this.onTriggerClick()},scope:this,forceKeyDown:true})},initDisabledDays:function(){if(this.disabledDates){var b=this.disabledDates,a=b.length-1,c="(?:";Ext.each(b,function(f,e){c+=Ext.isDate(f)?"^"+Ext.escapeRe(f.dateFormat(this.format))+"$":b[e];if(e!=a){c+="|"}},this);this.disabledDatesRE=new RegExp(c+")")}},setDisabledDates:function(a){this.disabledDates=a;this.initDisabledDays();if(this.menu){this.menu.picker.setDisabledDates(this.disabledDatesRE)}},setDisabledDays:function(a){this.disabledDays=a;if(this.menu){this.menu.picker.setDisabledDays(a)}},setMinValue:function(a){this.minValue=(Ext.isString(a)?this.parseDate(a):a);if(this.menu){this.menu.picker.setMinDate(this.minValue)}},setMaxValue:function(a){this.maxValue=(Ext.isString(a)?this.parseDate(a):a);if(this.menu){this.menu.picker.setMaxDate(this.maxValue)}},getErrors:function(e){var g=Ext.form.DateField.superclass.getErrors.apply(this,arguments);e=this.formatDate(e||this.processValue(this.getRawValue()));if(e.length<1){return g}var c=e;e=this.parseDate(e);if(!e){g.push(String.format(this.invalidText,c,this.format));return g}var f=e.getTime();if(this.minValue&&f<this.minValue.clearTime().getTime()){g.push(String.format(this.minText,this.formatDate(this.minValue)))}if(this.maxValue&&f>this.maxValue.clearTime().getTime()){g.push(String.format(this.maxText,this.formatDate(this.maxValue)))}if(this.disabledDays){var a=e.getDay();for(var b=0;b<this.disabledDays.length;b++){if(a===this.disabledDays[b]){g.push(this.disabledDaysText);break}}}var d=this.formatDate(e);if(this.disabledDatesRE&&this.disabledDatesRE.test(d)){g.push(String.format(this.disabledDatesText,d))}return g},validateBlur:function(){return !this.menu||!this.menu.isVisible()},getValue:function(){return this.parseDate(Ext.form.DateField.superclass.getValue.call(this))||""},setValue:function(a){return Ext.form.DateField.superclass.setValue.call(this,this.formatDate(this.parseDate(a)))},parseDate:function(f){if(!f||Ext.isDate(f)){return f}var b=this.safeParse(f,this.format),c=this.altFormats,e=this.altFormatsArray;if(!b&&c){e=e||c.split("|");for(var d=0,a=e.length;d<a&&!b;d++){b=this.safeParse(f,e[d])}}return b},onDestroy:function(){Ext.destroy(this.menu,this.keyNav);Ext.form.DateField.superclass.onDestroy.call(this)},formatDate:function(a){return Ext.isDate(a)?a.dateFormat(this.format):a},onTriggerClick:function(){if(this.disabled){return}if(this.menu==null){this.menu=new Ext.menu.DateMenu({hideOnClick:false,focusOnSelect:false})}this.onFocus();Ext.apply(this.menu.picker,{minDate:this.minValue,maxDate:this.maxValue,disabledDatesRE:this.disabledDatesRE,disabledDatesText:this.disabledDatesText,disabledDays:this.disabledDays,disabledDaysText:this.disabledDaysText,format:this.format,showToday:this.showToday,startDay:this.startDay,minText:String.format(this.minText,this.formatDate(this.minValue)),maxText:String.format(this.maxText,this.formatDate(this.maxValue))});this.menu.picker.setValue(this.getValue()||new Date());this.menu.show(this.el,"tl-bl?");this.menuEvents("on")},menuEvents:function(a){this.menu[a]("select",this.onSelect,this);this.menu[a]("hide",this.onMenuHide,this);this.menu[a]("show",this.onFocus,this)},onSelect:function(a,b){this.setValue(b);this.fireEvent("select",this,b);this.menu.hide()},onMenuHide:function(){this.focus(false,60);this.menuEvents("un")},beforeBlur:function(){var a=this.parseDate(this.getRawValue());if(a){this.setValue(a)}}});Ext.reg("datefield",Ext.form.DateField);Ext.form.DisplayField=Ext.extend(Ext.form.Field,{validationEvent:false,validateOnBlur:false,defaultAutoCreate:{tag:"div"},fieldClass:"x-form-display-field",htmlEncode:false,initEvents:Ext.emptyFn,isValid:function(){return true},validate:function(){return true},getRawValue:function(){var a=this.rendered?this.el.dom.innerHTML:Ext.value(this.value,"");if(a===this.emptyText){a=""}if(this.htmlEncode){a=Ext.util.Format.htmlDecode(a)}return a},getValue:function(){return this.getRawValue()},getName:function(){return this.name},setRawValue:function(a){if(this.htmlEncode){a=Ext.util.Format.htmlEncode(a)}return this.rendered?(this.el.dom.innerHTML=(Ext.isEmpty(a)?"":a)):(this.value=a)},setValue:function(a){this.setRawValue(a);return this}});Ext.reg("displayfield",Ext.form.DisplayField);Ext.form.ComboBox=Ext.extend(Ext.form.TriggerField,{defaultAutoCreate:{tag:"input",type:"text",size:"24",autocomplete:"off"},listClass:"",selectedClass:"x-combo-selected",listEmptyText:"",triggerClass:"x-form-arrow-trigger",shadow:"sides",listAlign:"tl-bl?",maxHeight:300,minHeight:90,triggerAction:"query",minChars:4,autoSelect:true,typeAhead:false,queryDelay:500,pageSize:0,selectOnFocus:false,queryParam:"query",loadingText:"Loading...",resizable:false,handleHeight:8,allQuery:"",mode:"remote",minListWidth:70,forceSelection:false,typeAheadDelay:250,lazyInit:true,clearFilterOnReset:true,submitValue:undefined,initComponent:function(){Ext.form.ComboBox.superclass.initComponent.call(this);this.addEvents("expand","collapse","beforeselect","select","beforequery");if(this.transform){var c=Ext.getDom(this.transform);if(!this.hiddenName){this.hiddenName=c.name}if(!this.store){this.mode="local";var h=[],e=c.options;for(var b=0,a=e.length;b<a;b++){var g=e[b],f=(g.hasAttribute?g.hasAttribute("value"):g.getAttributeNode("value").specified)?g.value:g.text;if(g.selected&&Ext.isEmpty(this.value,true)){this.value=f}h.push([f,g.text])}this.store=new Ext.data.ArrayStore({idIndex:0,fields:["value","text"],data:h,autoDestroy:true});this.valueField="value";this.displayField="text"}c.name=Ext.id();if(!this.lazyRender){this.target=true;this.el=Ext.DomHelper.insertBefore(c,this.autoCreate||this.defaultAutoCreate);this.render(this.el.parentNode,c)}Ext.removeNode(c)}else{if(this.store){this.store=Ext.StoreMgr.lookup(this.store);if(this.store.autoCreated){this.displayField=this.valueField="field1";if(!this.store.expandData){this.displayField="field2"}this.mode="local"}}}this.selectedIndex=-1;if(this.mode=="local"){if(!Ext.isDefined(this.initialConfig.queryDelay)){this.queryDelay=10}if(!Ext.isDefined(this.initialConfig.minChars)){this.minChars=0}}},onRender:function(b,a){if(this.hiddenName&&!Ext.isDefined(this.submitValue)){this.submitValue=false}Ext.form.ComboBox.superclass.onRender.call(this,b,a);if(this.hiddenName){this.hiddenField=this.el.insertSibling({tag:"input",type:"hidden",name:this.hiddenName,id:(this.hiddenId||Ext.id())},"before",true)}if(Ext.isGecko){this.el.dom.setAttribute("autocomplete","off")}if(!this.lazyInit){this.initList()}else{this.on("focus",this.initList,this,{single:true})}},initValue:function(){Ext.form.ComboBox.superclass.initValue.call(this);if(this.hiddenField){this.hiddenField.value=Ext.value(Ext.isDefined(this.hiddenValue)?this.hiddenValue:this.value,"")}},getParentZIndex:function(){var a;if(this.ownerCt){this.findParentBy(function(b){a=parseInt(b.getPositionEl().getStyle("z-index"),10);return !!a})}return a},getZIndex:function(b){b=b||Ext.getDom(this.getListParent()||Ext.getBody());var a=parseInt(Ext.fly(b).getStyle("z-index"),10);if(!a){a=this.getParentZIndex()}return(a||12000)+5},initList:function(){if(!this.list){var a="x-combo-list",c=Ext.getDom(this.getListParent()||Ext.getBody());this.list=new Ext.Layer({parentEl:c,shadow:this.shadow,cls:[a,this.listClass].join(" "),constrain:false,zindex:this.getZIndex(c)});var b=this.listWidth||Math.max(this.wrap.getWidth(),this.minListWidth);this.list.setSize(b,0);this.list.swallowEvent("mousewheel");this.assetHeight=0;if(this.syncFont!==false){this.list.setStyle("font-size",this.el.getStyle("font-size"))}if(this.title){this.header=this.list.createChild({cls:a+"-hd",html:this.title});this.assetHeight+=this.header.getHeight()}this.innerList=this.list.createChild({cls:a+"-inner"});this.mon(this.innerList,"mouseover",this.onViewOver,this);this.mon(this.innerList,"mousemove",this.onViewMove,this);this.innerList.setWidth(b-this.list.getFrameWidth("lr"));if(this.pageSize){this.footer=this.list.createChild({cls:a+"-ft"});this.pageTb=new Ext.PagingToolbar({store:this.store,pageSize:this.pageSize,renderTo:this.footer});this.assetHeight+=this.footer.getHeight()}if(!this.tpl){this.tpl='<tpl for="."><div class="'+a+'-item">{'+this.displayField+"}</div></tpl>"}this.view=new Ext.DataView({applyTo:this.innerList,tpl:this.tpl,singleSelect:true,selectedClass:this.selectedClass,itemSelector:this.itemSelector||"."+a+"-item",emptyText:this.listEmptyText,deferEmptyText:false});this.mon(this.view,{containerclick:this.onViewClick,click:this.onViewClick,scope:this});this.bindStore(this.store,true);if(this.resizable){this.resizer=new Ext.Resizable(this.list,{pinned:true,handles:"se"});this.mon(this.resizer,"resize",function(f,d,e){this.maxHeight=e-this.handleHeight-this.list.getFrameWidth("tb")-this.assetHeight;this.listWidth=d;this.innerList.setWidth(d-this.list.getFrameWidth("lr"));this.restrictHeight()},this);this[this.pageSize?"footer":"innerList"].setStyle("margin-bottom",this.handleHeight+"px")}}},getListParent:function(){return document.body},getStore:function(){return this.store},bindStore:function(a,b){if(this.store&&!b){if(this.store!==a&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("load",this.onLoad,this);this.store.un("exception",this.collapse,this)}if(!a){this.store=null;if(this.view){this.view.bindStore(null)}if(this.pageTb){this.pageTb.bindStore(null)}}}if(a){if(!b){this.lastQuery=null;if(this.pageTb){this.pageTb.bindStore(a)}}this.store=Ext.StoreMgr.lookup(a);this.store.on({scope:this,beforeload:this.onBeforeLoad,load:this.onLoad,exception:this.collapse});if(this.view){this.view.bindStore(a)}}},reset:function(){if(this.clearFilterOnReset&&this.mode=="local"){this.store.clearFilter()}Ext.form.ComboBox.superclass.reset.call(this)},initEvents:function(){Ext.form.ComboBox.superclass.initEvents.call(this);this.keyNav=new Ext.KeyNav(this.el,{up:function(a){this.inKeyMode=true;this.selectPrev()},down:function(a){if(!this.isExpanded()){this.onTriggerClick()}else{this.inKeyMode=true;this.selectNext()}},enter:function(a){this.onViewClick()},esc:function(a){this.collapse()},tab:function(a){if(this.forceSelection===true){this.collapse()}else{this.onViewClick(false)}return true},scope:this,doRelay:function(c,b,a){if(a=="down"||this.scope.isExpanded()){var d=Ext.KeyNav.prototype.doRelay.apply(this,arguments);if(!Ext.isIE&&Ext.EventManager.useKeydown){this.scope.fireKey(c)}return d}return true},forceKeyDown:true,defaultEventAction:"stopEvent"});this.queryDelay=Math.max(this.queryDelay||10,this.mode=="local"?10:250);this.dqTask=new Ext.util.DelayedTask(this.initQuery,this);if(this.typeAhead){this.taTask=new Ext.util.DelayedTask(this.onTypeAhead,this)}if(!this.enableKeyEvents){this.mon(this.el,"keyup",this.onKeyUp,this)}},onDestroy:function(){if(this.dqTask){this.dqTask.cancel();this.dqTask=null}this.bindStore(null);Ext.destroy(this.resizer,this.view,this.pageTb,this.list);Ext.destroyMembers(this,"hiddenField");Ext.form.ComboBox.superclass.onDestroy.call(this)},fireKey:function(a){if(!this.isExpanded()){Ext.form.ComboBox.superclass.fireKey.call(this,a)}},onResize:function(a,b){Ext.form.ComboBox.superclass.onResize.apply(this,arguments);if(!isNaN(a)&&this.isVisible()&&this.list){this.doResize(a)}else{this.bufferSize=a}},doResize:function(a){if(!Ext.isDefined(this.listWidth)){var b=Math.max(a,this.minListWidth);this.list.setWidth(b);this.innerList.setWidth(b-this.list.getFrameWidth("lr"))}},onEnable:function(){Ext.form.ComboBox.superclass.onEnable.apply(this,arguments);if(this.hiddenField){this.hiddenField.disabled=false}},onDisable:function(){Ext.form.ComboBox.superclass.onDisable.apply(this,arguments);if(this.hiddenField){this.hiddenField.disabled=true}},onBeforeLoad:function(){if(!this.hasFocus){return}this.innerList.update(this.loadingText?'<div class="loading-indicator">'+this.loadingText+"</div>":"");this.restrictHeight();this.selectedIndex=-1},onLoad:function(){if(!this.hasFocus){return}if(this.store.getCount()>0||this.listEmptyText){this.expand();this.restrictHeight();if(this.lastQuery==this.allQuery){if(this.editable){this.el.dom.select()}if(this.autoSelect!==false&&!this.selectByValue(this.value,true)){this.select(0,true)}}else{if(this.autoSelect!==false){this.selectNext()}if(this.typeAhead&&this.lastKey!=Ext.EventObject.BACKSPACE&&this.lastKey!=Ext.EventObject.DELETE){this.taTask.delay(this.typeAheadDelay)}}}else{this.collapse()}},onTypeAhead:function(){if(this.store.getCount()>0){var b=this.store.getAt(0);var c=b.data[this.displayField];var a=c.length;var d=this.getRawValue().length;if(d!=a){this.setRawValue(c);this.selectText(d,c.length)}}},assertValue:function(){var b=this.getRawValue(),a;if(this.valueField&&Ext.isDefined(this.value)){a=this.findRecord(this.valueField,this.value)}if(!a||a.get(this.displayField)!=b){a=this.findRecord(this.displayField,b)}if(!a&&this.forceSelection){if(b.length>0&&b!=this.emptyText){this.el.dom.value=Ext.value(this.lastSelectionText,"");this.applyEmptyText()}else{this.clearValue()}}else{if(a&&this.valueField){if(this.value==b){return}b=a.get(this.valueField||this.displayField)}this.setValue(b)}},onSelect:function(a,b){if(this.fireEvent("beforeselect",this,a,b)!==false){this.setValue(a.data[this.valueField||this.displayField]);this.collapse();this.fireEvent("select",this,a,b)}},getName:function(){var a=this.hiddenField;return a&&a.name?a.name:this.hiddenName||Ext.form.ComboBox.superclass.getName.call(this)},getValue:function(){if(this.valueField){return Ext.isDefined(this.value)?this.value:""}else{return Ext.form.ComboBox.superclass.getValue.call(this)}},clearValue:function(){if(this.hiddenField){this.hiddenField.value=""}this.setRawValue("");this.lastSelectionText="";this.applyEmptyText();this.value=""},setValue:function(a){var c=a;if(this.valueField){var b=this.findRecord(this.valueField,a);if(b){c=b.data[this.displayField]}else{if(Ext.isDefined(this.valueNotFoundText)){c=this.valueNotFoundText}}}this.lastSelectionText=c;if(this.hiddenField){this.hiddenField.value=Ext.value(a,"")}Ext.form.ComboBox.superclass.setValue.call(this,c);this.value=a;return this},findRecord:function(c,b){var a;if(this.store.getCount()>0){this.store.each(function(d){if(d.data[c]==b){a=d;return false}})}return a},onViewMove:function(b,a){this.inKeyMode=false},onViewOver:function(d,b){if(this.inKeyMode){return}var c=this.view.findItemFromChild(b);if(c){var a=this.view.indexOf(c);this.select(a,false)}},onViewClick:function(b){var a=this.view.getSelectedIndexes()[0],c=this.store,d=c.getAt(a);if(d){this.onSelect(d,a)}else{this.collapse()}if(b!==false){this.el.focus()}},restrictHeight:function(){this.innerList.dom.style.height="";var b=this.innerList.dom,e=this.list.getFrameWidth("tb")+(this.resizable?this.handleHeight:0)+this.assetHeight,c=Math.max(b.clientHeight,b.offsetHeight,b.scrollHeight),a=this.getPosition()[1]-Ext.getBody().getScroll().top,f=Ext.lib.Dom.getViewHeight()-a-this.getSize().height,d=Math.max(a,f,this.minHeight||0)-this.list.shadowOffset-e-5;c=Math.min(c,d,this.maxHeight);this.innerList.setHeight(c);this.list.beginUpdate();this.list.setHeight(c+e);this.list.alignTo.apply(this.list,[this.el].concat(this.listAlign));this.list.endUpdate()},isExpanded:function(){return this.list&&this.list.isVisible()},selectByValue:function(a,c){if(!Ext.isEmpty(a,true)){var b=this.findRecord(this.valueField||this.displayField,a);if(b){this.select(this.store.indexOf(b),c);return true}}return false},select:function(a,c){this.selectedIndex=a;this.view.select(a);if(c!==false){var b=this.view.getNode(a);if(b){this.innerList.scrollChildIntoView(b,false)}}},selectNext:function(){var a=this.store.getCount();if(a>0){if(this.selectedIndex==-1){this.select(0)}else{if(this.selectedIndex<a-1){this.select(this.selectedIndex+1)}}}},selectPrev:function(){var a=this.store.getCount();if(a>0){if(this.selectedIndex==-1){this.select(0)}else{if(this.selectedIndex!==0){this.select(this.selectedIndex-1)}}}},onKeyUp:function(b){var a=b.getKey();if(this.editable!==false&&this.readOnly!==true&&(a==b.BACKSPACE||!b.isSpecialKey())){this.lastKey=a;this.dqTask.delay(this.queryDelay)}Ext.form.ComboBox.superclass.onKeyUp.call(this,b)},validateBlur:function(){return !this.list||!this.list.isVisible()},initQuery:function(){this.doQuery(this.getRawValue())},beforeBlur:function(){this.assertValue()},postBlur:function(){Ext.form.ComboBox.superclass.postBlur.call(this);this.collapse();this.inKeyMode=false},doQuery:function(c,b){c=Ext.isEmpty(c)?"":c;var a={query:c,forceAll:b,combo:this,cancel:false};if(this.fireEvent("beforequery",a)===false||a.cancel){return false}c=a.query;b=a.forceAll;if(b===true||(c.length>=this.minChars)){if(this.lastQuery!==c){this.lastQuery=c;if(this.mode=="local"){this.selectedIndex=-1;if(b){this.store.clearFilter()}else{this.store.filter(this.displayField,c)}this.onLoad()}else{this.store.baseParams[this.queryParam]=c;this.store.load({params:this.getParams(c)});this.expand()}}else{this.selectedIndex=-1;this.onLoad()}}},getParams:function(a){var b={},c=this.store.paramNames;if(this.pageSize){b[c.start]=0;b[c.limit]=this.pageSize}return b},collapse:function(){if(!this.isExpanded()){return}this.list.hide();Ext.getDoc().un("mousewheel",this.collapseIf,this);Ext.getDoc().un("mousedown",this.collapseIf,this);this.fireEvent("collapse",this)},collapseIf:function(a){if(!this.isDestroyed&&!a.within(this.wrap)&&!a.within(this.list)){this.collapse()}},expand:function(){if(this.isExpanded()||!this.hasFocus){return}if(this.title||this.pageSize){this.assetHeight=0;if(this.title){this.assetHeight+=this.header.getHeight()}if(this.pageSize){this.assetHeight+=this.footer.getHeight()}}if(this.bufferSize){this.doResize(this.bufferSize);delete this.bufferSize}this.list.alignTo.apply(this.list,[this.el].concat(this.listAlign));this.list.setZIndex(this.getZIndex());this.list.show();if(Ext.isGecko2){this.innerList.setOverflow("auto")}this.mon(Ext.getDoc(),{scope:this,mousewheel:this.collapseIf,mousedown:this.collapseIf});this.fireEvent("expand",this)},onTriggerClick:function(){if(this.readOnly||this.disabled){return}if(this.isExpanded()){this.collapse();this.el.focus()}else{this.onFocus({});if(this.triggerAction=="all"){this.doQuery(this.allQuery,true)}else{this.doQuery(this.getRawValue())}this.el.focus()}}});Ext.reg("combo",Ext.form.ComboBox);Ext.form.Checkbox=Ext.extend(Ext.form.Field,{focusClass:undefined,fieldClass:"x-form-field",checked:false,boxLabel:"&#160;",defaultAutoCreate:{tag:"input",type:"checkbox",autocomplete:"off"},actionMode:"wrap",initComponent:function(){Ext.form.Checkbox.superclass.initComponent.call(this);this.addEvents("check")},onResize:function(){Ext.form.Checkbox.superclass.onResize.apply(this,arguments);if(!this.boxLabel&&!this.fieldLabel){this.el.alignTo(this.wrap,"c-c")}},initEvents:function(){Ext.form.Checkbox.superclass.initEvents.call(this);this.mon(this.el,{scope:this,click:this.onClick,change:this.onClick})},markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,onRender:function(b,a){Ext.form.Checkbox.superclass.onRender.call(this,b,a);if(this.inputValue!==undefined){this.el.dom.value=this.inputValue}this.wrap=this.el.wrap({cls:"x-form-check-wrap"});if(this.boxLabel){this.wrap.createChild({tag:"label",htmlFor:this.el.id,cls:"x-form-cb-label",html:this.boxLabel})}if(this.checked){this.setValue(true)}else{this.checked=this.el.dom.checked}if(Ext.isIE&&!Ext.isStrict){this.wrap.repaint()}this.resizeEl=this.positionEl=this.wrap},onDestroy:function(){Ext.destroy(this.wrap);Ext.form.Checkbox.superclass.onDestroy.call(this)},initValue:function(){this.originalValue=this.getValue()},getValue:function(){if(this.rendered){return this.el.dom.checked}return this.checked},onClick:function(){if(this.el.dom.checked!=this.checked){this.setValue(this.el.dom.checked)}},setValue:function(a){var c=this.checked,b=this.inputValue;if(a===false){this.checked=false}else{this.checked=(a===true||a==="true"||a=="1"||(b?a==b:String(a).toLowerCase()=="on"))}if(this.rendered){this.el.dom.checked=this.checked;this.el.dom.defaultChecked=this.checked}if(c!=this.checked){this.fireEvent("check",this,this.checked);if(this.handler){this.handler.call(this.scope||this,this,this.checked)}}return this}});Ext.reg("checkbox",Ext.form.Checkbox);Ext.form.CheckboxGroup=Ext.extend(Ext.form.Field,{columns:"auto",vertical:false,allowBlank:true,blankText:"You must select at least one item in this group",defaultType:"checkbox",groupCls:"x-form-check-group",initComponent:function(){this.addEvents("change");this.on("change",this.validate,this);Ext.form.CheckboxGroup.superclass.initComponent.call(this)},onRender:function(h,f){if(!this.el){var o={autoEl:{id:this.id},cls:this.groupCls,layout:"column",renderTo:h,bufferResize:false};var a={xtype:"container",defaultType:this.defaultType,layout:"form",defaults:{hideLabel:true,anchor:"100%"}};if(this.items[0].items){Ext.apply(o,{layoutConfig:{columns:this.items.length},defaults:this.defaults,items:this.items});for(var e=0,k=this.items.length;e<k;e++){Ext.applyIf(this.items[e],a)}}else{var d,m=[];if(typeof this.columns=="string"){this.columns=this.items.length}if(!Ext.isArray(this.columns)){var j=[];for(var e=0;e<this.columns;e++){j.push((100/this.columns)*0.01)}this.columns=j}d=this.columns.length;for(var e=0;e<d;e++){var b=Ext.apply({items:[]},a);b[this.columns[e]<=1?"columnWidth":"width"]=this.columns[e];if(this.defaults){b.defaults=Ext.apply(b.defaults||{},this.defaults)}m.push(b)}if(this.vertical){var q=Math.ceil(this.items.length/d),n=0;for(var e=0,k=this.items.length;e<k;e++){if(e>0&&e%q==0){n++}if(this.items[e].fieldLabel){this.items[e].hideLabel=false}m[n].items.push(this.items[e])}}else{for(var e=0,k=this.items.length;e<k;e++){var p=e%d;if(this.items[e].fieldLabel){this.items[e].hideLabel=false}m[p].items.push(this.items[e])}}Ext.apply(o,{layoutConfig:{columns:d},items:m})}this.panel=new Ext.Container(o);this.panel.ownerCt=this;this.el=this.panel.getEl();if(this.forId&&this.itemCls){var c=this.el.up(this.itemCls).child("label",true);if(c){c.setAttribute("htmlFor",this.forId)}}var g=this.panel.findBy(function(i){return i.isFormField},this);this.items=new Ext.util.MixedCollection();this.items.addAll(g)}Ext.form.CheckboxGroup.superclass.onRender.call(this,h,f)},initValue:function(){if(this.value){this.setValue.apply(this,this.buffered?this.value:[this.value]);delete this.buffered;delete this.value}},afterRender:function(){Ext.form.CheckboxGroup.superclass.afterRender.call(this);this.eachItem(function(a){a.on("check",this.fireChecked,this);a.inGroup=true})},doLayout:function(){if(this.rendered){this.panel.forceLayout=this.ownerCt.forceLayout;this.panel.doLayout()}},fireChecked:function(){var a=[];this.eachItem(function(b){if(b.checked){a.push(b)}});this.fireEvent("change",this,a)},getErrors:function(){var b=Ext.form.CheckboxGroup.superclass.getErrors.apply(this,arguments);if(!this.allowBlank){var a=true;this.eachItem(function(c){if(c.checked){return(a=false)}});if(a){b.push(this.blankText)}}return b},isDirty:function(){if(this.disabled||!this.rendered){return false}var a=false;this.eachItem(function(b){if(b.isDirty()){a=true;return false}});return a},setReadOnly:function(a){if(this.rendered){this.eachItem(function(b){b.setReadOnly(a)})}this.readOnly=a},onDisable:function(){this.eachItem(function(a){a.disable()})},onEnable:function(){this.eachItem(function(a){a.enable()})},onResize:function(a,b){this.panel.setSize(a,b);this.panel.doLayout()},reset:function(){if(this.originalValue){this.eachItem(function(a){if(a.setValue){a.setValue(false);a.originalValue=a.getValue()}});this.resetOriginal=true;this.setValue(this.originalValue);delete this.resetOriginal}else{this.eachItem(function(a){if(a.reset){a.reset()}})}(function(){this.clearInvalid()}).defer(50,this)},setValue:function(){if(this.rendered){this.onSetValue.apply(this,arguments)}else{this.buffered=true;this.value=arguments}return this},onSetValue:function(d,c){if(arguments.length==1){if(Ext.isArray(d)){Ext.each(d,function(g,e){if(Ext.isObject(g)&&g.setValue){g.setValue(true);if(this.resetOriginal===true){g.originalValue=g.getValue()}}else{var f=this.items.itemAt(e);if(f){f.setValue(g)}}},this)}else{if(Ext.isObject(d)){for(var a in d){var b=this.getBox(a);if(b){b.setValue(d[a])}}}else{this.setValueForItem(d)}}}else{var b=this.getBox(d);if(b){b.setValue(c)}}},beforeDestroy:function(){Ext.destroy(this.panel);if(!this.rendered){Ext.destroy(this.items)}Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this)},setValueForItem:function(a){a=String(a).split(",");this.eachItem(function(b){if(a.indexOf(b.inputValue)>-1){b.setValue(true)}})},getBox:function(b){var a=null;this.eachItem(function(c){if(b==c||c.dataIndex==b||c.id==b||c.getName()==b){a=c;return false}});return a},getValue:function(){var a=[];this.eachItem(function(b){if(b.checked){a.push(b)}});return a},eachItem:function(b,a){if(this.items&&this.items.each){this.items.each(b,a||this)}},getRawValue:Ext.emptyFn,setRawValue:Ext.emptyFn});Ext.reg("checkboxgroup",Ext.form.CheckboxGroup);Ext.form.CompositeField=Ext.extend(Ext.form.Field,{defaultMargins:"0 5 0 0",skipLastItemMargin:true,isComposite:true,combineErrors:true,labelConnector:", ",initComponent:function(){var f=[],b=this.items,e;for(var d=0,c=b.length;d<c;d++){e=b[d];if(!Ext.isEmpty(e.ref)){e.ref="../"+e.ref}f.push(e.fieldLabel);Ext.applyIf(e,this.defaults);if(!(d==c-1&&this.skipLastItemMargin)){Ext.applyIf(e,{margins:this.defaultMargins})}}this.fieldLabel=this.fieldLabel||this.buildLabel(f);this.fieldErrors=new Ext.util.MixedCollection(true,function(g){return g.field});this.fieldErrors.on({scope:this,add:this.updateInvalidMark,remove:this.updateInvalidMark,replace:this.updateInvalidMark});Ext.form.CompositeField.superclass.initComponent.apply(this,arguments);this.innerCt=new Ext.Container({layout:"hbox",items:this.items,cls:"x-form-composite",defaultMargins:"0 3 0 0",ownerCt:this});this.innerCt.ownerCt=undefined;var a=this.innerCt.findBy(function(g){return g.isFormField},this);this.items=new Ext.util.MixedCollection();this.items.addAll(a)},onRender:function(c,a){if(!this.el){var d=this.innerCt;d.render(c);this.el=d.getEl();if(this.combineErrors){this.eachItem(function(e){Ext.apply(e,{markInvalid:this.onFieldMarkInvalid.createDelegate(this,[e],0),clearInvalid:this.onFieldClearInvalid.createDelegate(this,[e],0)})})}var b=this.el.parent().parent().child("label",true);if(b){b.setAttribute("for",this.items.items[0].id)}}Ext.form.CompositeField.superclass.onRender.apply(this,arguments)},onFieldMarkInvalid:function(d,c){var b=d.getName(),a={field:b,errorName:d.fieldLabel||b,error:c};this.fieldErrors.replace(b,a);if(!d.preventMark){d.el.addClass(d.invalidClass)}},onFieldClearInvalid:function(a){this.fieldErrors.removeKey(a.getName());a.el.removeClass(a.invalidClass)},updateInvalidMark:function(){var a=Ext.isIE6&&Ext.isStrict;if(this.fieldErrors.length==0){this.clearInvalid();if(a){this.clearInvalid.defer(50,this)}}else{var b=this.buildCombinedErrorMessage(this.fieldErrors.items);this.sortErrors();this.markInvalid(b);if(a){this.markInvalid(b)}}},validateValue:function(c,a){var b=true;this.eachItem(function(d){if(!d.isValid(a)){b=false}});return b},buildCombinedErrorMessage:function(e){var d=[],b;for(var c=0,a=e.length;c<a;c++){b=e[c];d.push(String.format("{0}: {1}",b.errorName,b.error))}return d.join("<br />")},sortErrors:function(){var a=this.items;this.fieldErrors.sort("ASC",function(f,d){var c=function(b){return function(h){return h.getName()==b}};var g=a.findIndexBy(c(f.field)),e=a.findIndexBy(c(d.field));return g<e?-1:1})},reset:function(){this.eachItem(function(a){a.reset()});(function(){this.clearInvalid()}).defer(50,this)},clearInvalidChildren:function(){this.eachItem(function(a){a.clearInvalid()})},buildLabel:function(a){return Ext.clean(a).join(this.labelConnector)},isDirty:function(){if(this.disabled||!this.rendered){return false}var a=false;this.eachItem(function(b){if(b.isDirty()){a=true;return false}});return a},eachItem:function(b,a){if(this.items&&this.items.each){this.items.each(b,a||this)}},onResize:function(e,c,a,d){var b=this.innerCt;if(this.rendered&&b.rendered){b.setSize(e,c)}Ext.form.CompositeField.superclass.onResize.apply(this,arguments)},doLayout:function(c,b){if(this.rendered){var a=this.innerCt;a.forceLayout=this.ownerCt.forceLayout;a.doLayout(c,b)}},beforeDestroy:function(){Ext.destroy(this.innerCt);Ext.form.CompositeField.superclass.beforeDestroy.call(this)},setReadOnly:function(a){if(a==undefined){a=true}a=!!a;if(this.rendered){this.eachItem(function(b){b.setReadOnly(a)})}this.readOnly=a},onShow:function(){Ext.form.CompositeField.superclass.onShow.call(this);this.doLayout()},onDisable:function(){this.eachItem(function(a){a.disable()})},onEnable:function(){this.eachItem(function(a){a.enable()})}});Ext.reg("compositefield",Ext.form.CompositeField);Ext.form.Radio=Ext.extend(Ext.form.Checkbox,{inputType:"radio",markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,getGroupValue:function(){var a=this.el.up("form")||Ext.getBody();var b=a.child('input[name="'+this.el.dom.name+'"]:checked',true);return b?b.value:null},setValue:function(b){var a,d,c;if(typeof b=="boolean"){Ext.form.Radio.superclass.setValue.call(this,b)}else{if(this.rendered){a=this.getCheckEl();c=a.child('input[name="'+this.el.dom.name+'"][value="'+b+'"]',true);if(c){Ext.getCmp(c.id).setValue(true)}}}if(this.rendered&&this.checked){a=a||this.getCheckEl();d=this.getCheckEl().select('input[name="'+this.el.dom.name+'"]');d.each(function(e){if(e.dom.id!=this.id){Ext.getCmp(e.dom.id).setValue(false)}},this)}return this},getCheckEl:function(){if(this.inGroup){return this.el.up(".x-form-radio-group")}return this.el.up("form")||Ext.getBody()}});Ext.reg("radio",Ext.form.Radio);Ext.form.RadioGroup=Ext.extend(Ext.form.CheckboxGroup,{allowBlank:true,blankText:"You must select one item in this group",defaultType:"radio",groupCls:"x-form-radio-group",getValue:function(){var a=null;this.eachItem(function(b){if(b.checked){a=b;return false}});return a},onSetValue:function(c,b){if(arguments.length>1){var a=this.getBox(c);if(a){a.setValue(b);if(a.checked){this.eachItem(function(d){if(d!==a){d.setValue(false)}})}}}else{this.setValueForItem(c)}},setValueForItem:function(a){a=String(a).split(",")[0];this.eachItem(function(b){b.setValue(a==b.inputValue)})},fireChecked:function(){if(!this.checkTask){this.checkTask=new Ext.util.DelayedTask(this.bufferChecked,this)}this.checkTask.delay(10)},bufferChecked:function(){var a=null;this.eachItem(function(b){if(b.checked){a=b;return false}});this.fireEvent("change",this,a)},onDestroy:function(){if(this.checkTask){this.checkTask.cancel();this.checkTask=null}Ext.form.RadioGroup.superclass.onDestroy.call(this)}});Ext.reg("radiogroup",Ext.form.RadioGroup);Ext.form.Hidden=Ext.extend(Ext.form.Field,{inputType:"hidden",shouldLayout:false,onRender:function(){Ext.form.Hidden.superclass.onRender.apply(this,arguments)},initEvents:function(){this.originalValue=this.getValue()},setSize:Ext.emptyFn,setWidth:Ext.emptyFn,setHeight:Ext.emptyFn,setPosition:Ext.emptyFn,setPagePosition:Ext.emptyFn,markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn});Ext.reg("hidden",Ext.form.Hidden);Ext.form.BasicForm=Ext.extend(Ext.util.Observable,{constructor:function(b,a){Ext.apply(this,a);if(Ext.isString(this.paramOrder)){this.paramOrder=this.paramOrder.split(/[\s,|]/)}this.items=new Ext.util.MixedCollection(false,function(c){return c.getItemId()});this.addEvents("beforeaction","actionfailed","actioncomplete");if(b){this.initEl(b)}Ext.form.BasicForm.superclass.constructor.call(this)},timeout:30,paramOrder:undefined,paramsAsHash:false,waitTitle:"Please Wait...",activeAction:null,trackResetOnLoad:false,initEl:function(a){this.el=Ext.get(a);this.id=this.el.id||Ext.id();if(!this.standardSubmit){this.el.on("submit",this.onSubmit,this)}this.el.addClass("x-form")},getEl:function(){return this.el},onSubmit:function(a){a.stopEvent()},destroy:function(a){if(a!==true){this.items.each(function(b){Ext.destroy(b)});Ext.destroy(this.el)}this.items.clear();this.purgeListeners()},isValid:function(){var a=true;this.items.each(function(b){if(!b.validate()){a=false}});return a},isDirty:function(){var a=false;this.items.each(function(b){if(b.isDirty()){a=true;return false}});return a},doAction:function(b,a){if(Ext.isString(b)){b=new Ext.form.Action.ACTION_TYPES[b](this,a)}if(this.fireEvent("beforeaction",this,b)!==false){this.beforeAction(b);b.run.defer(100,b)}return this},submit:function(b){b=b||{};if(this.standardSubmit){var a=b.clientValidation===false||this.isValid();if(a){var c=this.el.dom;if(this.url&&Ext.isEmpty(c.action)){c.action=this.url}c.submit()}return a}var d=String.format("{0}submit",this.api?"direct":"");this.doAction(d,b);return this},load:function(a){var b=String.format("{0}load",this.api?"direct":"");this.doAction(b,a);return this},updateRecord:function(b){b.beginEdit();var a=b.fields,d,c;a.each(function(e){d=this.findField(e.name);if(d){c=d.getValue();if(Ext.type(c)!==false&&c.getGroupValue){c=c.getGroupValue()}else{if(d.eachItem){c=[];d.eachItem(function(f){c.push(f.getValue())})}}b.set(e.name,c)}},this);b.endEdit();return this},loadRecord:function(a){this.setValues(a.data);return this},beforeAction:function(a){this.items.each(function(c){if(c.isFormField&&c.syncValue){c.syncValue()}});var b=a.options;if(b.waitMsg){if(this.waitMsgTarget===true){this.el.mask(b.waitMsg,"x-mask-loading")}else{if(this.waitMsgTarget){this.waitMsgTarget=Ext.get(this.waitMsgTarget);this.waitMsgTarget.mask(b.waitMsg,"x-mask-loading")}else{Ext.MessageBox.wait(b.waitMsg,b.waitTitle||this.waitTitle)}}}},afterAction:function(a,c){this.activeAction=null;var b=a.options;if(b.waitMsg){if(this.waitMsgTarget===true){this.el.unmask()}else{if(this.waitMsgTarget){this.waitMsgTarget.unmask()}else{Ext.MessageBox.updateProgress(1);Ext.MessageBox.hide()}}}if(c){if(b.reset){this.reset()}Ext.callback(b.success,b.scope,[this,a]);this.fireEvent("actioncomplete",this,a)}else{Ext.callback(b.failure,b.scope,[this,a]);this.fireEvent("actionfailed",this,a)}},findField:function(c){var b=this.items.get(c);if(!Ext.isObject(b)){var a=function(d){if(d.isFormField){if(d.dataIndex==c||d.id==c||d.getName()==c){b=d;return false}else{if(d.isComposite){return d.items.each(a)}else{if(d instanceof Ext.form.CheckboxGroup&&d.rendered){return d.eachItem(a)}}}}};this.items.each(a)}return b||null},markInvalid:function(h){if(Ext.isArray(h)){for(var c=0,a=h.length;c<a;c++){var b=h[c];var d=this.findField(b.id);if(d){d.markInvalid(b.msg)}}}else{var e,g;for(g in h){if(!Ext.isFunction(h[g])&&(e=this.findField(g))){e.markInvalid(h[g])}}}return this},setValues:function(c){if(Ext.isArray(c)){for(var d=0,a=c.length;d<a;d++){var b=c[d];var e=this.findField(b.id);if(e){e.setValue(b.value);if(this.trackResetOnLoad){e.originalValue=e.getValue()}}}}else{var g,h;for(h in c){if(!Ext.isFunction(c[h])&&(g=this.findField(h))){g.setValue(c[h]);if(this.trackResetOnLoad){g.originalValue=g.getValue()}}}}return this},getValues:function(b){var a=Ext.lib.Ajax.serializeForm(this.el.dom);if(b===true){return a}return Ext.urlDecode(a)},getFieldValues:function(a){var d={},e,b,c;this.items.each(function(g){if(!g.disabled&&(a!==true||g.isDirty())){e=g.getName();b=d[e];c=g.getValue();if(Ext.isDefined(b)){if(Ext.isArray(b)){d[e].push(c)}else{d[e]=[b,c]}}else{d[e]=c}}});return d},clearInvalid:function(){this.items.each(function(a){a.clearInvalid()});return this},reset:function(){this.items.each(function(a){a.reset()});return this},add:function(){this.items.addAll(Array.prototype.slice.call(arguments,0));return this},remove:function(a){this.items.remove(a);return this},cleanDestroyed:function(){this.items.filterBy(function(a){return !!a.isDestroyed}).each(this.remove,this)},render:function(){this.items.each(function(a){if(a.isFormField&&!a.rendered&&document.getElementById(a.id)){a.applyToMarkup(a.id)}});return this},applyToFields:function(a){this.items.each(function(b){Ext.apply(b,a)});return this},applyIfToFields:function(a){this.items.each(function(b){Ext.applyIf(b,a)});return this},callFieldMethod:function(b,a){a=a||[];this.items.each(function(c){if(Ext.isFunction(c[b])){c[b].apply(c,a)}});return this}});Ext.BasicForm=Ext.form.BasicForm;Ext.FormPanel=Ext.extend(Ext.Panel,{minButtonWidth:75,labelAlign:"left",monitorValid:false,monitorPoll:200,layout:"form",initComponent:function(){this.form=this.createForm();Ext.FormPanel.superclass.initComponent.call(this);this.bodyCfg={tag:"form",cls:this.baseCls+"-body",method:this.method||"POST",id:this.formId||Ext.id()};if(this.fileUpload){this.bodyCfg.enctype="multipart/form-data"}this.initItems();this.addEvents("clientvalidation");this.relayEvents(this.form,["beforeaction","actionfailed","actioncomplete"])},createForm:function(){var a=Ext.applyIf({listeners:{}},this.initialConfig);return new Ext.form.BasicForm(null,a)},initFields:function(){var c=this.form;var a=this;var b=function(d){if(a.isField(d)){c.add(d)}else{if(d.findBy&&d!=a){a.applySettings(d);if(d.items&&d.items.each){d.items.each(b,this)}}}};this.items.each(b,this)},applySettings:function(b){var a=b.ownerCt;Ext.applyIf(b,{labelAlign:a.labelAlign,labelWidth:a.labelWidth,itemCls:a.itemCls})},getLayoutTarget:function(){return this.form.el},getForm:function(){return this.form},onRender:function(b,a){this.initFields();Ext.FormPanel.superclass.onRender.call(this,b,a);this.form.initEl(this.body)},beforeDestroy:function(){this.stopMonitoring();this.form.destroy(true);Ext.FormPanel.superclass.beforeDestroy.call(this)},isField:function(a){return !!a.setValue&&!!a.getValue&&!!a.markInvalid&&!!a.clearInvalid},initEvents:function(){Ext.FormPanel.superclass.initEvents.call(this);this.on({scope:this,add:this.onAddEvent,remove:this.onRemoveEvent});if(this.monitorValid){this.startMonitoring()}},onAdd:function(a){Ext.FormPanel.superclass.onAdd.call(this,a);this.processAdd(a)},onAddEvent:function(a,b){if(a!==this){this.processAdd(b)}},processAdd:function(a){if(this.isField(a)){this.form.add(a)}else{if(a.findBy){this.applySettings(a);this.form.add.apply(this.form,a.findBy(this.isField))}}},onRemove:function(a){Ext.FormPanel.superclass.onRemove.call(this,a);this.processRemove(a)},onRemoveEvent:function(a,b){if(a!==this){this.processRemove(b)}},processRemove:function(a){if(!this.destroying){if(this.isField(a)){this.form.remove(a)}else{if(a.findBy){Ext.each(a.findBy(this.isField),this.form.remove,this.form);this.form.cleanDestroyed()}}}},startMonitoring:function(){if(!this.validTask){this.validTask=new Ext.util.TaskRunner();this.validTask.start({run:this.bindHandler,interval:this.monitorPoll||200,scope:this})}},stopMonitoring:function(){if(this.validTask){this.validTask.stopAll();this.validTask=null}},load:function(){this.form.load.apply(this.form,arguments)},onDisable:function(){Ext.FormPanel.superclass.onDisable.call(this);if(this.form){this.form.items.each(function(){this.disable()})}},onEnable:function(){Ext.FormPanel.superclass.onEnable.call(this);if(this.form){this.form.items.each(function(){this.enable()})}},bindHandler:function(){var e=true;this.form.items.each(function(g){if(!g.isValid(true)){e=false;return false}});if(this.fbar){var b=this.fbar.items.items;for(var d=0,a=b.length;d<a;d++){var c=b[d];if(c.formBind===true&&c.disabled===e){c.setDisabled(!e)}}}this.fireEvent("clientvalidation",this,e)}});Ext.reg("form",Ext.FormPanel);Ext.form.FormPanel=Ext.FormPanel;Ext.form.FieldSet=Ext.extend(Ext.Panel,{baseCls:"x-fieldset",layout:"form",animCollapse:false,onRender:function(b,a){if(!this.el){this.el=document.createElement("fieldset");this.el.id=this.id;if(this.title||this.header||this.checkboxToggle){this.el.appendChild(document.createElement("legend")).className=this.baseCls+"-header"}}Ext.form.FieldSet.superclass.onRender.call(this,b,a);if(this.checkboxToggle){var c=typeof this.checkboxToggle=="object"?this.checkboxToggle:{tag:"input",type:"checkbox",name:this.checkboxName||this.id+"-checkbox"};this.checkbox=this.header.insertFirst(c);this.checkbox.dom.checked=!this.collapsed;this.mon(this.checkbox,"click",this.onCheckClick,this)}},onCollapse:function(a,b){if(this.checkbox){this.checkbox.dom.checked=false}Ext.form.FieldSet.superclass.onCollapse.call(this,a,b)},onExpand:function(a,b){if(this.checkbox){this.checkbox.dom.checked=true}Ext.form.FieldSet.superclass.onExpand.call(this,a,b)},onCheckClick:function(){this[this.checkbox.dom.checked?"expand":"collapse"]()}});Ext.reg("fieldset",Ext.form.FieldSet);Ext.form.HtmlEditor=Ext.extend(Ext.form.Field,{enableFormat:true,enableFontSize:true,enableColors:true,enableAlignments:true,enableLists:true,enableSourceEdit:true,enableLinks:true,enableFont:true,createLinkText:"Please enter the URL for the link:",defaultLinkValue:"http://",fontFamilies:["Arial","Courier New","Tahoma","Times New Roman","Verdana"],defaultFont:"tahoma",defaultValue:(Ext.isOpera||Ext.isIE6)?"&#160;":"&#8203;",actionMode:"wrap",validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Ext.emptyFn,iframePad:3,hideMode:"offsets",defaultAutoCreate:{tag:"textarea",style:"width:500px;height:300px;",autocomplete:"off"},initComponent:function(){this.addEvents("initialize","activate","beforesync","beforepush","sync","push","editmodechange");Ext.form.HtmlEditor.superclass.initComponent.call(this)},createFontOptions:function(){var d=[],b=this.fontFamilies,c,f;for(var e=0,a=b.length;e<a;e++){c=b[e];f=c.toLowerCase();d.push('<option value="',f,'" style="font-family:',c,';"',(this.defaultFont==f?' selected="true">':">"),c,"</option>")}return d.join("")},createToolbar:function(e){var c=[];var a=Ext.QuickTips&&Ext.QuickTips.isEnabled();function d(i,g,h){return{itemId:i,cls:"x-btn-icon",iconCls:"x-edit-"+i,enableToggle:g!==false,scope:e,handler:h||e.relayBtnCmd,clickEvent:"mousedown",tooltip:a?e.buttonTips[i]||undefined:undefined,overflowText:e.buttonTips[i].title||undefined,tabIndex:-1}}if(this.enableFont&&!Ext.isSafari2){var f=new Ext.Toolbar.Item({autoEl:{tag:"select",cls:"x-font-select",html:this.createFontOptions()}});c.push(f,"-")}if(this.enableFormat){c.push(d("bold"),d("italic"),d("underline"))}if(this.enableFontSize){c.push("-",d("increasefontsize",false,this.adjustFont),d("decreasefontsize",false,this.adjustFont))}if(this.enableColors){c.push("-",{itemId:"forecolor",cls:"x-btn-icon",iconCls:"x-edit-forecolor",clickEvent:"mousedown",tooltip:a?e.buttonTips.forecolor||undefined:undefined,tabIndex:-1,menu:new Ext.menu.ColorMenu({allowReselect:true,focus:Ext.emptyFn,value:"000000",plain:true,listeners:{scope:this,select:function(h,g){this.execCmd("forecolor",Ext.isWebKit||Ext.isIE?"#"+g:g);this.deferFocus()}},clickEvent:"mousedown"})},{itemId:"backcolor",cls:"x-btn-icon",iconCls:"x-edit-backcolor",clickEvent:"mousedown",tooltip:a?e.buttonTips.backcolor||undefined:undefined,tabIndex:-1,menu:new Ext.menu.ColorMenu({focus:Ext.emptyFn,value:"FFFFFF",plain:true,allowReselect:true,listeners:{scope:this,select:function(h,g){if(Ext.isGecko){this.execCmd("useCSS",false);this.execCmd("hilitecolor",g);this.execCmd("useCSS",true);this.deferFocus()}else{this.execCmd(Ext.isOpera?"hilitecolor":"backcolor",Ext.isWebKit||Ext.isIE?"#"+g:g);this.deferFocus()}}},clickEvent:"mousedown"})})}if(this.enableAlignments){c.push("-",d("justifyleft"),d("justifycenter"),d("justifyright"))}if(!Ext.isSafari2){if(this.enableLinks){c.push("-",d("createlink",false,this.createLink))}if(this.enableLists){c.push("-",d("insertorderedlist"),d("insertunorderedlist"))}if(this.enableSourceEdit){c.push("-",d("sourceedit",true,function(g){this.toggleSourceEdit(!this.sourceEditMode)}))}}var b=new Ext.Toolbar({renderTo:this.wrap.dom.firstChild,items:c});if(f){this.fontSelect=f.el;this.mon(this.fontSelect,"change",function(){var g=this.fontSelect.dom.value;this.relayCmd("fontname",g);this.deferFocus()},this)}this.mon(b.el,"click",function(g){g.preventDefault()});this.tb=b;this.tb.doLayout()},onDisable:function(){this.wrap.mask();Ext.form.HtmlEditor.superclass.onDisable.call(this)},onEnable:function(){this.wrap.unmask();Ext.form.HtmlEditor.superclass.onEnable.call(this)},setReadOnly:function(b){Ext.form.HtmlEditor.superclass.setReadOnly.call(this,b);if(this.initialized){if(Ext.isIE){this.getEditorBody().contentEditable=!b}else{this.setDesignMode(!b)}var a=this.getEditorBody();if(a){a.style.cursor=this.readOnly?"default":"text"}this.disableItems(b)}},getDocMarkup:function(){var a=Ext.fly(this.iframe).getHeight()-this.iframePad*2;return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>',this.iframePad,a)},getEditorBody:function(){var a=this.getDoc();return a.body||a.documentElement},getDoc:function(){return Ext.isIE?this.getWin().document:(this.iframe.contentDocument||this.getWin().document)},getWin:function(){return Ext.isIE?this.iframe.contentWindow:window.frames[this.iframe.name]},onRender:function(b,a){Ext.form.HtmlEditor.superclass.onRender.call(this,b,a);this.el.dom.style.border="0 none";this.el.dom.setAttribute("tabIndex",-1);this.el.addClass("x-hidden");if(Ext.isIE){this.el.applyStyles("margin-top:-1px;margin-bottom:-1px;")}this.wrap=this.el.wrap({cls:"x-html-editor-wrap",cn:{cls:"x-html-editor-tb"}});this.createToolbar(this);this.disableItems(true);this.tb.doLayout();this.createIFrame();if(!this.width){var c=this.el.getSize();this.setSize(c.width,this.height||c.height)}this.resizeEl=this.positionEl=this.wrap},createIFrame:function(){var a=document.createElement("iframe");a.name=Ext.id();a.frameBorder="0";a.style.overflow="auto";a.src=Ext.SSL_SECURE_URL;this.wrap.dom.appendChild(a);this.iframe=a;this.monitorTask=Ext.TaskMgr.start({run:this.checkDesignMode,scope:this,interval:100})},initFrame:function(){Ext.TaskMgr.stop(this.monitorTask);var b=this.getDoc();this.win=this.getWin();b.open();b.write(this.getDocMarkup());b.close();var a={run:function(){var c=this.getDoc();if(c.body||c.readyState=="complete"){Ext.TaskMgr.stop(a);this.setDesignMode(true);this.initEditor.defer(10,this)}},interval:10,duration:10000,scope:this};Ext.TaskMgr.start(a)},checkDesignMode:function(){if(this.wrap&&this.wrap.dom.offsetWidth){var a=this.getDoc();if(!a){return}if(!a.editorInitialized||this.getDesignMode()!="on"){this.initFrame()}}},setDesignMode:function(b){var a=this.getDoc();if(a){if(this.readOnly){b=false}a.designMode=(/on|true/i).test(String(b).toLowerCase())?"on":"off"}},getDesignMode:function(){var a=this.getDoc();if(!a){return""}return String(a.designMode).toLowerCase()},disableItems:function(a){if(this.fontSelect){this.fontSelect.dom.disabled=a}this.tb.items.each(function(b){if(b.getItemId()!="sourceedit"){b.setDisabled(a)}})},onResize:function(b,c){Ext.form.HtmlEditor.superclass.onResize.apply(this,arguments);if(this.el&&this.iframe){if(Ext.isNumber(b)){var e=b-this.wrap.getFrameWidth("lr");this.el.setWidth(e);this.tb.setWidth(e);this.iframe.style.width=Math.max(e,0)+"px"}if(Ext.isNumber(c)){var a=c-this.wrap.getFrameWidth("tb")-this.tb.el.getHeight();this.el.setHeight(a);this.iframe.style.height=Math.max(a,0)+"px";var d=this.getEditorBody();if(d){d.style.height=Math.max((a-(this.iframePad*2)),0)+"px"}}}},toggleSourceEdit:function(b){var d,a;if(b===undefined){b=!this.sourceEditMode}this.sourceEditMode=b===true;var c=this.tb.getComponent("sourceedit");if(c.pressed!==this.sourceEditMode){c.toggle(this.sourceEditMode);if(!c.xtbHidden){return}}if(this.sourceEditMode){this.previousSize=this.getSize();d=Ext.get(this.iframe).getHeight();this.disableItems(true);this.syncValue();this.iframe.className="x-hidden";this.el.removeClass("x-hidden");this.el.dom.removeAttribute("tabIndex");this.el.focus();this.el.dom.style.height=d+"px"}else{a=parseInt(this.el.dom.style.height,10);if(this.initialized){this.disableItems(this.readOnly)}this.pushValue();this.iframe.className="";this.el.addClass("x-hidden");this.el.dom.setAttribute("tabIndex",-1);this.deferFocus();this.setSize(this.previousSize);delete this.previousSize;this.iframe.style.height=a+"px"}this.fireEvent("editmodechange",this,this.sourceEditMode)},createLink:function(){var a=prompt(this.createLinkText,this.defaultLinkValue);if(a&&a!="http://"){this.relayCmd("createlink",a)}},initEvents:function(){this.originalValue=this.getValue()},markInvalid:Ext.emptyFn,clearInvalid:Ext.emptyFn,setValue:function(a){Ext.form.HtmlEditor.superclass.setValue.call(this,a);this.pushValue();return this},cleanHtml:function(a){a=String(a);if(Ext.isWebKit){a=a.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,"")}if(a.charCodeAt(0)==this.defaultValue.replace(/\D/g,"")){a=a.substring(1)}return a},syncValue:function(){if(this.initialized){var d=this.getEditorBody();var c=d.innerHTML;if(Ext.isWebKit){var b=d.getAttribute("style");var a=b.match(/text-align:(.*?);/i);if(a&&a[1]){c='<div style="'+a[0]+'">'+c+"</div>"}}c=this.cleanHtml(c);if(this.fireEvent("beforesync",this,c)!==false){this.el.dom.value=c;this.fireEvent("sync",this,c)}}},getValue:function(){this[this.sourceEditMode?"pushValue":"syncValue"]();return Ext.form.HtmlEditor.superclass.getValue.call(this)},pushValue:function(){if(this.initialized){var a=this.el.dom.value;if(!this.activated&&a.length<1){a=this.defaultValue}if(this.fireEvent("beforepush",this,a)!==false){this.getEditorBody().innerHTML=a;if(Ext.isGecko){this.setDesignMode(false);this.setDesignMode(true)}this.fireEvent("push",this,a)}}},deferFocus:function(){this.focus.defer(10,this)},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus()}else{this.el.focus()}},initEditor:function(){try{var c=this.getEditorBody(),a=this.el.getStyles("font-size","font-family","background-image","background-repeat","background-color","color"),f,b;a["background-attachment"]="fixed";c.bgProperties="fixed";Ext.DomHelper.applyStyles(c,a);f=this.getDoc();if(f){try{Ext.EventManager.removeAll(f)}catch(d){}}b=this.onEditorEvent.createDelegate(this);Ext.EventManager.on(f,{mousedown:b,dblclick:b,click:b,keyup:b,buffer:100});if(Ext.isGecko){Ext.EventManager.on(f,"keypress",this.applyCommand,this)}if(Ext.isIE||Ext.isWebKit||Ext.isOpera){Ext.EventManager.on(f,"keydown",this.fixKeys,this)}f.editorInitialized=true;this.initialized=true;this.pushValue();this.setReadOnly(this.readOnly);this.fireEvent("initialize",this)}catch(d){}},beforeDestroy:function(){if(this.monitorTask){Ext.TaskMgr.stop(this.monitorTask)}if(this.rendered){Ext.destroy(this.tb);var b=this.getDoc();if(b){try{Ext.EventManager.removeAll(b);for(var c in b){delete b[c]}}catch(a){}}if(this.wrap){this.wrap.dom.innerHTML="";this.wrap.remove()}}Ext.form.HtmlEditor.superclass.beforeDestroy.call(this)},onFirstFocus:function(){this.activated=true;this.disableItems(this.readOnly);if(Ext.isGecko){this.win.focus();var a=this.win.getSelection();if(!a.focusNode||a.focusNode.nodeType!=3){var b=a.getRangeAt(0);b.selectNodeContents(this.getEditorBody());b.collapse(true);this.deferFocus()}try{this.execCmd("useCSS",true);this.execCmd("styleWithCSS",false)}catch(c){}}this.fireEvent("activate",this)},adjustFont:function(b){var d=b.getItemId()=="increasefontsize"?1:-1,c=this.getDoc(),a=parseInt(c.queryCommandValue("FontSize")||2,10);if((Ext.isSafari&&!Ext.isSafari2)||Ext.isChrome||Ext.isAir){if(a<=10){a=1+d}else{if(a<=13){a=2+d}else{if(a<=16){a=3+d}else{if(a<=18){a=4+d}else{if(a<=24){a=5+d}else{a=6+d}}}}}a=a.constrain(1,6)}else{if(Ext.isSafari){d*=2}a=Math.max(1,a+d)+(Ext.isSafari?"px":0)}this.execCmd("FontSize",a)},onEditorEvent:function(a){this.updateToolbar()},updateToolbar:function(){if(this.readOnly){return}if(!this.activated){this.onFirstFocus();return}var b=this.tb.items.map,c=this.getDoc();if(this.enableFont&&!Ext.isSafari2){var a=(c.queryCommandValue("FontName")||this.defaultFont).toLowerCase();if(a!=this.fontSelect.dom.value){this.fontSelect.dom.value=a}}if(this.enableFormat){b.bold.toggle(c.queryCommandState("bold"));b.italic.toggle(c.queryCommandState("italic"));b.underline.toggle(c.queryCommandState("underline"))}if(this.enableAlignments){b.justifyleft.toggle(c.queryCommandState("justifyleft"));b.justifycenter.toggle(c.queryCommandState("justifycenter"));b.justifyright.toggle(c.queryCommandState("justifyright"))}if(!Ext.isSafari2&&this.enableLists){b.insertorderedlist.toggle(c.queryCommandState("insertorderedlist"));b.insertunorderedlist.toggle(c.queryCommandState("insertunorderedlist"))}Ext.menu.MenuMgr.hideAll();this.syncValue()},relayBtnCmd:function(a){this.relayCmd(a.getItemId())},relayCmd:function(b,a){(function(){this.focus();this.execCmd(b,a);this.updateToolbar()}).defer(10,this)},execCmd:function(b,a){var c=this.getDoc();c.execCommand(b,false,a===undefined?null:a);this.syncValue()},applyCommand:function(b){if(b.ctrlKey){var d=b.getCharCode(),a;if(d>0){d=String.fromCharCode(d);switch(d){case"b":a="bold";break;case"i":a="italic";break;case"u":a="underline";break}if(a){this.win.focus();this.execCmd(a);this.deferFocus();b.preventDefault()}}}},insertAtCursor:function(c){if(!this.activated){return}if(Ext.isIE){this.win.focus();var b=this.getDoc(),a=b.selection.createRange();if(a){a.pasteHTML(c);this.syncValue();this.deferFocus()}}else{this.win.focus();this.execCmd("InsertHTML",c);this.deferFocus()}},fixKeys:function(){if(Ext.isIE){return function(f){var a=f.getKey(),d=this.getDoc(),b;if(a==f.TAB){f.stopEvent();b=d.selection.createRange();if(b){b.collapse(true);b.pasteHTML("&nbsp;&nbsp;&nbsp;&nbsp;");this.deferFocus()}}else{if(a==f.ENTER){b=d.selection.createRange();if(b){var c=b.parentElement();if(!c||c.tagName.toLowerCase()!="li"){f.stopEvent();b.pasteHTML("<br />");b.collapse(false);b.select()}}}}}}else{if(Ext.isOpera){return function(b){var a=b.getKey();if(a==b.TAB){b.stopEvent();this.win.focus();this.execCmd("InsertHTML","&nbsp;&nbsp;&nbsp;&nbsp;");this.deferFocus()}}}else{if(Ext.isWebKit){return function(b){var a=b.getKey();if(a==b.TAB){b.stopEvent();this.execCmd("InsertText","\t");this.deferFocus()}else{if(a==b.ENTER){b.stopEvent();this.execCmd("InsertHtml","<br /><br />");this.deferFocus()}}}}}}}(),getToolbar:function(){return this.tb},buttonTips:{bold:{title:"Bold (Ctrl+B)",text:"Make the selected text bold.",cls:"x-html-editor-tip"},italic:{title:"Italic (Ctrl+I)",text:"Make the selected text italic.",cls:"x-html-editor-tip"},underline:{title:"Underline (Ctrl+U)",text:"Underline the selected text.",cls:"x-html-editor-tip"},increasefontsize:{title:"Grow Text",text:"Increase the font size.",cls:"x-html-editor-tip"},decreasefontsize:{title:"Shrink Text",text:"Decrease the font size.",cls:"x-html-editor-tip"},backcolor:{title:"Text Highlight Color",text:"Change the background color of the selected text.",cls:"x-html-editor-tip"},forecolor:{title:"Font Color",text:"Change the color of the selected text.",cls:"x-html-editor-tip"},justifyleft:{title:"Align Text Left",text:"Align text to the left.",cls:"x-html-editor-tip"},justifycenter:{title:"Center Text",text:"Center text in the editor.",cls:"x-html-editor-tip"},justifyright:{title:"Align Text Right",text:"Align text to the right.",cls:"x-html-editor-tip"},insertunorderedlist:{title:"Bullet List",text:"Start a bulleted list.",cls:"x-html-editor-tip"},insertorderedlist:{title:"Numbered List",text:"Start a numbered list.",cls:"x-html-editor-tip"},createlink:{title:"Hyperlink",text:"Make the selected text a hyperlink.",cls:"x-html-editor-tip"},sourceedit:{title:"Source Edit",text:"Switch to source editing mode.",cls:"x-html-editor-tip"}}});Ext.reg("htmleditor",Ext.form.HtmlEditor);Ext.form.TimeField=Ext.extend(Ext.form.ComboBox,{minValue:undefined,maxValue:undefined,minText:"The time in this field must be equal to or after {0}",maxText:"The time in this field must be equal to or before {0}",invalidText:"{0} is not a valid time",format:"g:i A",altFormats:"g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",increment:15,mode:"local",triggerAction:"all",typeAhead:false,initDate:"1/1/2008",initDateFormat:"j/n/Y",initComponent:function(){if(Ext.isDefined(this.minValue)){this.setMinValue(this.minValue,true)}if(Ext.isDefined(this.maxValue)){this.setMaxValue(this.maxValue,true)}if(!this.store){this.generateStore(true)}Ext.form.TimeField.superclass.initComponent.call(this)},setMinValue:function(b,a){this.setLimit(b,true,a);return this},setMaxValue:function(b,a){this.setLimit(b,false,a);return this},generateStore:function(b){var c=this.minValue||new Date(this.initDate).clearTime(),a=this.maxValue||new Date(this.initDate).clearTime().add("mi",(24*60)-1),d=[];while(c<=a){d.push(c.dateFormat(this.format));c=c.add("mi",this.increment)}this.bindStore(d,b)},setLimit:function(b,f,a){var e;if(Ext.isString(b)){e=this.parseDate(b)}else{if(Ext.isDate(b)){e=b}}if(e){var c=new Date(this.initDate).clearTime();c.setHours(e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds());this[f?"minValue":"maxValue"]=c;if(!a){this.generateStore()}}},getValue:function(){var a=Ext.form.TimeField.superclass.getValue.call(this);return this.formatDate(this.parseDate(a))||""},setValue:function(a){return Ext.form.TimeField.superclass.setValue.call(this,this.formatDate(this.parseDate(a)))},validateValue:Ext.form.DateField.prototype.validateValue,formatDate:Ext.form.DateField.prototype.formatDate,parseDate:function(g){if(!g||Ext.isDate(g)){return g}var h=this.initDate+" ",f=this.initDateFormat+" ",b=Date.parseDate(h+g,f+this.format),c=this.altFormats;if(!b&&c){if(!this.altFormatsArray){this.altFormatsArray=c.split("|")}for(var e=0,d=this.altFormatsArray,a=d.length;e<a&&!b;e++){b=Date.parseDate(h+g,f+d[e])}}return b}});Ext.reg("timefield",Ext.form.TimeField);Ext.form.SliderField=Ext.extend(Ext.form.Field,{useTips:true,tipText:null,actionMode:"wrap",initComponent:function(){var b=Ext.copyTo({id:this.id+"-slider"},this.initialConfig,["vertical","minValue","maxValue","decimalPrecision","keyIncrement","increment","clickToChange","animate"]);if(this.useTips){var a=this.tipText?{getText:this.tipText}:{};b.plugins=[new Ext.slider.Tip(a)]}this.slider=new Ext.Slider(b);Ext.form.SliderField.superclass.initComponent.call(this)},onRender:function(b,a){this.autoCreate={id:this.id,name:this.name,type:"hidden",tag:"input"};Ext.form.SliderField.superclass.onRender.call(this,b,a);this.wrap=this.el.wrap({cls:"x-form-field-wrap"});this.resizeEl=this.positionEl=this.wrap;this.slider.render(this.wrap)},onResize:function(b,c,d,a){Ext.form.SliderField.superclass.onResize.call(this,b,c,d,a);this.slider.setSize(b,c)},initEvents:function(){Ext.form.SliderField.superclass.initEvents.call(this);this.slider.on("change",this.onChange,this)},onChange:function(b,a){this.setValue(a,undefined,true)},onEnable:function(){Ext.form.SliderField.superclass.onEnable.call(this);this.slider.enable()},onDisable:function(){Ext.form.SliderField.superclass.onDisable.call(this);this.slider.disable()},beforeDestroy:function(){Ext.destroy(this.slider);Ext.form.SliderField.superclass.beforeDestroy.call(this)},alignErrorIcon:function(){this.errorIcon.alignTo(this.slider.el,"tl-tr",[2,0])},setMinValue:function(a){this.slider.setMinValue(a);return this},setMaxValue:function(a){this.slider.setMaxValue(a);return this},setValue:function(c,b,a){if(!a){this.slider.setValue(c,b)}return Ext.form.SliderField.superclass.setValue.call(this,this.slider.getValue())},getValue:function(){return this.slider.getValue()}});Ext.reg("sliderfield",Ext.form.SliderField);Ext.form.Label=Ext.extend(Ext.BoxComponent,{onRender:function(b,a){if(!this.el){this.el=document.createElement("label");this.el.id=this.getId();this.el.innerHTML=this.text?Ext.util.Format.htmlEncode(this.text):(this.html||"");if(this.forId){this.el.setAttribute("for",this.forId)}}Ext.form.Label.superclass.onRender.call(this,b,a)},setText:function(a,b){var c=b===false;this[!c?"text":"html"]=a;delete this[c?"text":"html"];if(this.rendered){this.el.dom.innerHTML=b!==false?Ext.util.Format.htmlEncode(a):a}return this}});Ext.reg("label",Ext.form.Label);Ext.form.Action=function(b,a){this.form=b;this.options=a||{}};Ext.form.Action.CLIENT_INVALID="client";Ext.form.Action.SERVER_INVALID="server";Ext.form.Action.CONNECT_FAILURE="connect";Ext.form.Action.LOAD_FAILURE="load";Ext.form.Action.prototype={type:"default",run:function(a){},success:function(a){},handleResponse:function(a){},failure:function(a){this.response=a;this.failureType=Ext.form.Action.CONNECT_FAILURE;this.form.afterAction(this,false)},processResponse:function(a){this.response=a;if(!a.responseText&&!a.responseXML){return true}this.result=this.handleResponse(a);return this.result},decodeResponse:function(a){try{return Ext.decode(a.responseText)}catch(b){return false}},getUrl:function(c){var a=this.options.url||this.form.url||this.form.el.dom.action;if(c){var b=this.getParams();if(b){a=Ext.urlAppend(a,b)}}return a},getMethod:function(){return(this.options.method||this.form.method||this.form.el.dom.method||"POST").toUpperCase()},getParams:function(){var a=this.form.baseParams;var b=this.options.params;if(b){if(typeof b=="object"){b=Ext.urlEncode(Ext.applyIf(b,a))}else{if(typeof b=="string"&&a){b+="&"+Ext.urlEncode(a)}}}else{if(a){b=Ext.urlEncode(a)}}return b},createCallback:function(a){var a=a||{};return{success:this.success,failure:this.failure,scope:this,timeout:(a.timeout*1000)||(this.form.timeout*1000),upload:this.form.fileUpload?this.success:undefined}}};Ext.form.Action.Submit=function(b,a){Ext.form.Action.Submit.superclass.constructor.call(this,b,a)};Ext.extend(Ext.form.Action.Submit,Ext.form.Action,{type:"submit",run:function(){var e=this.options,f=this.getMethod(),d=f=="GET";if(e.clientValidation===false||this.form.isValid()){if(e.submitEmptyText===false){var a=this.form.items,c=[],b=function(g){if(g.el.getValue()==g.emptyText){c.push(g);g.el.dom.value=""}if(g.isComposite&&g.rendered){g.items.each(b)}};a.each(b)}Ext.Ajax.request(Ext.apply(this.createCallback(e),{form:this.form.el.dom,url:this.getUrl(d),method:f,headers:e.headers,params:!d?this.getParams():null,isUpload:this.form.fileUpload}));if(e.submitEmptyText===false){Ext.each(c,function(g){if(g.applyEmptyText){g.applyEmptyText()}})}}else{if(e.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false)}}},success:function(b){var a=this.processResponse(b);if(a===true||a.success){this.form.afterAction(this,true);return}if(a.errors){this.form.markInvalid(a.errors)}this.failureType=Ext.form.Action.SERVER_INVALID;this.form.afterAction(this,false)},handleResponse:function(c){if(this.form.errorReader){var b=this.form.errorReader.read(c);var f=[];if(b.records){for(var d=0,a=b.records.length;d<a;d++){var e=b.records[d];f[d]=e.data}}if(f.length<1){f=null}return{success:b.success,errors:f}}return this.decodeResponse(c)}});Ext.form.Action.Load=function(b,a){Ext.form.Action.Load.superclass.constructor.call(this,b,a);this.reader=this.form.reader};Ext.extend(Ext.form.Action.Load,Ext.form.Action,{type:"load",run:function(){Ext.Ajax.request(Ext.apply(this.createCallback(this.options),{method:this.getMethod(),url:this.getUrl(false),headers:this.options.headers,params:this.getParams()}))},success:function(b){var a=this.processResponse(b);if(a===true||!a.success||!a.data){this.failureType=Ext.form.Action.LOAD_FAILURE;this.form.afterAction(this,false);return}this.form.clearInvalid();this.form.setValues(a.data);this.form.afterAction(this,true)},handleResponse:function(b){if(this.form.reader){var a=this.form.reader.read(b);var c=a.records&&a.records[0]?a.records[0].data:null;return{success:a.success,data:c}}return this.decodeResponse(b)}});Ext.form.Action.DirectLoad=Ext.extend(Ext.form.Action.Load,{constructor:function(b,a){Ext.form.Action.DirectLoad.superclass.constructor.call(this,b,a)},type:"directload",run:function(){var a=this.getParams();a.push(this.success,this);this.form.api.load.apply(window,a)},getParams:function(){var c=[],g={};var e=this.form.baseParams;var f=this.options.params;Ext.apply(g,f,e);var b=this.form.paramOrder;if(b){for(var d=0,a=b.length;d<a;d++){c.push(g[b[d]])}}else{if(this.form.paramsAsHash){c.push(g)}}return c},processResponse:function(a){this.result=a;return a},success:function(a,b){if(b.type==Ext.Direct.exceptions.SERVER){a={}}Ext.form.Action.DirectLoad.superclass.success.call(this,a)}});Ext.form.Action.DirectSubmit=Ext.extend(Ext.form.Action.Submit,{constructor:function(b,a){Ext.form.Action.DirectSubmit.superclass.constructor.call(this,b,a)},type:"directsubmit",run:function(){var a=this.options;if(a.clientValidation===false||this.form.isValid()){this.success.params=this.getParams();this.form.api.submit(this.form.el.dom,this.success,this)}else{if(a.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false)}}},getParams:function(){var c={};var a=this.form.baseParams;var b=this.options.params;Ext.apply(c,b,a);return c},processResponse:function(a){this.result=a;return a},success:function(a,b){if(b.type==Ext.Direct.exceptions.SERVER){a={}}Ext.form.Action.DirectSubmit.superclass.success.call(this,a)}});Ext.form.Action.ACTION_TYPES={load:Ext.form.Action.Load,submit:Ext.form.Action.Submit,directload:Ext.form.Action.DirectLoad,directsubmit:Ext.form.Action.DirectSubmit};Ext.form.VTypes=function(){var c=/^[a-zA-Z_]+$/,d=/^[a-zA-Z0-9_]+$/,b=/^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,a=/(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;return{email:function(e){return b.test(e)},emailText:'This field should be an e-mail address in the format "user@example.com"',emailMask:/[a-z0-9_\.\-\+\'@]/i,url:function(e){return a.test(e)},urlText:'This field should be a URL in the format "http://www.example.com"',alpha:function(e){return c.test(e)},alphaText:"This field should only contain letters and _",alphaMask:/[a-z_]/i,alphanum:function(e){return d.test(e)},alphanumText:"This field should only contain letters, numbers and _",alphanumMask:/[a-z0-9_]/i}}();
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/window.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/window.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/window.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Window=Ext.extend(Ext.Panel,{baseCls:"x-window",resizable:true,draggable:true,closable:true,closeAction:"close",constrain:false,constrainHeader:false,plain:false,minimizable:false,maximizable:false,minHeight:100,minWidth:200,expandOnShow:true,showAnimDuration:0.25,hideAnimDuration:0.25,collapsible:false,initHidden:undefined,hidden:true,elements:"header,body",frame:true,floating:true,initComponent:function(){this.initTools();Ext.Window.superclass.initComponent.call(this);this.addEvents("resize","maximize","minimize","restore");if(Ext.isDefined(this.initHidden)){this.hidden=this.initHidden}if(this.hidden===false){this.hidden=true;this.show()}},getState:function(){return Ext.apply(Ext.Window.superclass.getState.call(this)||{},this.getBox(true))},onRender:function(b,a){Ext.Window.superclass.onRender.call(this,b,a);if(this.plain){this.el.addClass("x-window-plain")}this.focusEl=this.el.createChild({tag:"a",href:"#",cls:"x-dlg-focus",tabIndex:"-1",html:"&#160;"});this.focusEl.swallowEvent("click",true);this.proxy=this.el.createProxy("x-window-proxy");this.proxy.enableDisplayMode("block");if(this.modal){this.mask=this.container.createChild({cls:"ext-el-mask"},this.el.dom);this.mask.enableDisplayMode("block");this.mask.hide();this.mon(this.mask,"click",this.focus,this)}if(this.maximizable){this.mon(this.header,"dblclick",this.toggleMaximize,this)}},initEvents:function(){Ext.Window.superclass.initEvents.call(this);if(this.animateTarget){this.setAnimateTarget(this.animateTarget)}if(this.resizable){this.resizer=new Ext.Resizable(this.el,{minWidth:this.minWidth,minHeight:this.minHeight,handles:this.resizeHandles||"all",pinned:true,resizeElement:this.resizerAction,handleCls:"x-window-handle"});this.resizer.window=this;this.mon(this.resizer,"beforeresize",this.beforeResize,this)}if(this.draggable){this.header.addClass("x-window-draggable")}this.mon(this.el,"mousedown",this.toFront,this);this.manager=this.manager||Ext.WindowMgr;this.manager.register(this);if(this.maximized){this.maximized=false;this.maximize()}if(this.closable){var a=this.getKeyMap();a.on(27,this.onEsc,this);a.disable()}},initDraggable:function(){this.dd=new Ext.Window.DD(this)},onEsc:function(a,b){if(this.activeGhost){this.unghost()}b.stopEvent();this[this.closeAction]()},beforeDestroy:function(){if(this.rendered){this.hide();this.clearAnchor();Ext.destroy(this.focusEl,this.resizer,this.dd,this.proxy,this.mask)}Ext.Window.superclass.beforeDestroy.call(this)},onDestroy:function(){if(this.manager){this.manager.unregister(this)}Ext.Window.superclass.onDestroy.call(this)},initTools:function(){if(this.minimizable){this.addTool({id:"minimize",handler:this.minimize.createDelegate(this,[])})}if(this.maximizable){this.addTool({id:"maximize",handler:this.maximize.createDelegate(this,[])});this.addTool({id:"restore",handler:this.restore.createDelegate(this,[]),hidden:true})}if(this.closable){this.addTool({id:"close",handler:this[this.closeAction].createDelegate(this,[])})}},resizerAction:function(){var a=this.proxy.getBox();this.proxy.hide();this.window.handleResize(a);return a},beforeResize:function(){this.resizer.minHeight=Math.max(this.minHeight,this.getFrameHeight()+40);this.resizer.minWidth=Math.max(this.minWidth,this.getFrameWidth()+40);this.resizeBox=this.el.getBox()},updateHandles:function(){if(Ext.isIE&&this.resizer){this.resizer.syncHandleHeight();this.el.repaint()}},handleResize:function(b){var a=this.resizeBox;if(a.x!=b.x||a.y!=b.y){this.updateBox(b)}else{this.setSize(b);if(Ext.isIE6&&Ext.isStrict){this.doLayout()}}this.focus();this.updateHandles();this.saveState()},focus:function(){var e=this.focusEl,a=this.defaultButton,c=typeof a,d,b;if(Ext.isDefined(a)){if(Ext.isNumber(a)&&this.fbar){e=this.fbar.items.get(a)}else{if(Ext.isString(a)){e=Ext.getCmp(a)}else{e=a}}d=e.getEl();b=Ext.getDom(this.container);if(d&&b){if(b!=document.body&&!Ext.lib.Region.getRegion(b).contains(Ext.lib.Region.getRegion(d.dom))){return}}}e=e||this.focusEl;e.focus.defer(10,e)},setAnimateTarget:function(a){a=Ext.get(a);this.animateTarget=a},beforeShow:function(){delete this.el.lastXY;delete this.el.lastLT;if(this.x===undefined||this.y===undefined){var a=this.el.getAlignToXY(this.container,"c-c");var b=this.el.translatePoints(a[0],a[1]);this.x=this.x===undefined?b.left:this.x;this.y=this.y===undefined?b.top:this.y}this.el.setLeftTop(this.x,this.y);if(this.expandOnShow){this.expand(false)}if(this.modal){Ext.getBody().addClass("x-body-masked");this.mask.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true));this.mask.show()}},show:function(c,a,b){if(!this.rendered){this.render(Ext.getBody())}if(this.hidden===false){this.toFront();return this}if(this.fireEvent("beforeshow",this)===false){return this}if(a){this.on("show",a,b,{single:true})}this.hidden=false;if(Ext.isDefined(c)){this.setAnimateTarget(c)}this.beforeShow();if(this.animateTarget){this.animShow()}else{this.afterShow()}return this},afterShow:function(b){if(this.isDestroyed){return false}this.proxy.hide();this.el.setStyle("display","block");this.el.show();if(this.maximized){this.fitContainer()}if(Ext.isMac&&Ext.isGecko2){this.cascade(this.setAutoScroll)}if(this.monitorResize||this.modal||this.constrain||this.constrainHeader){Ext.EventManager.onWindowResize(this.onWindowResize,this)}this.doConstrain();this.doLayout();if(this.keyMap){this.keyMap.enable()}this.toFront();this.updateHandles();if(b&&(Ext.isIE||Ext.isWebKit)){var a=this.getSize();this.onResize(a.width,a.height)}this.onShow();this.fireEvent("show",this)},animShow:function(){this.proxy.show();this.proxy.setBox(this.animateTarget.getBox());this.proxy.setOpacity(0);var a=this.getBox();this.el.setStyle("display","none");this.proxy.shift(Ext.apply(a,{callback:this.afterShow.createDelegate(this,[true],false),scope:this,easing:"easeNone",duration:this.showAnimDuration,opacity:0.5}))},hide:function(c,a,b){if(this.hidden||this.fireEvent("beforehide",this)===false){return this}if(a){this.on("hide",a,b,{single:true})}this.hidden=true;if(c!==undefined){this.setAnimateTarget(c)}if(this.modal){this.mask.hide();Ext.getBody().removeClass("x-body-masked")}if(this.animateTarget){this.animHide()}else{this.el.hide();this.afterHide()}return this},afterHide:function(){this.proxy.hide();if(this.monitorResize||this.modal||this.constrain||this.constrainHeader){Ext.EventManager.removeResizeListener(this.onWindowResize,this)}if(this.keyMap){this.keyMap.disable()}this.onHide();this.fireEvent("hide",this)},animHide:function(){this.proxy.setOpacity(0.5);this.proxy.show();var a=this.getBox(false);this.proxy.setBox(a);this.el.hide();this.proxy.shift(Ext.apply(this.animateTarget.getBox(),{callback:this.afterHide,scope:this,duration:this.hideAnimDuration,easing:"easeNone",opacity:0}))},onShow:Ext.emptyFn,onHide:Ext.emptyFn,onWindowResize:function(){if(this.maximized){this.fitContainer()}if(this.modal){this.mask.setSize("100%","100%");var a=this.mask.dom.offsetHeight;this.mask.setSize(Ext.lib.Dom.getViewWidth(true),Ext.lib.Dom.getViewHeight(true))}this.doConstrain()},doConstrain:function(){if(this.constrain||this.constrainHeader){var b;if(this.constrain){b={right:this.el.shadowOffset,left:this.el.shadowOffset,bottom:this.el.shadowOffset}}else{var a=this.getSize();b={right:-(a.width-100),bottom:-(a.height-25+this.el.getConstrainOffset())}}var c=this.el.getConstrainToXY(this.container,true,b);if(c){this.setPosition(c[0],c[1])}}},ghost:function(a){var c=this.createGhost(a);var b=this.getBox(true);c.setLeftTop(b.x,b.y);c.setWidth(b.width);this.el.hide();this.activeGhost=c;return c},unghost:function(b,a){if(!this.activeGhost){return}if(b!==false){this.el.show();this.focus.defer(10,this);if(Ext.isMac&&Ext.isGecko2){this.cascade(this.setAutoScroll)}}if(a!==false){this.setPosition(this.activeGhost.getLeft(true),this.activeGhost.getTop(true))}this.activeGhost.hide();this.activeGhost.remove();delete this.activeGhost},minimize:function(){this.fireEvent("minimize",this);return this},close:function(){if(this.fireEvent("beforeclose",this)!==false){if(this.hidden){this.doClose()}else{this.hide(null,this.doClose,this)}}},doClose:function(){this.fireEvent("close",this);this.destroy()},maximize:function(){if(!this.maximized){this.expand(false);this.restoreSize=this.getSize();this.restorePos=this.getPosition(true);if(this.maximizable){this.tools.maximize.hide();this.tools.restore.show()}this.maximized=true;this.el.disableShadow();if(this.dd){this.dd.lock()}if(this.collapsible){this.tools.toggle.hide()}this.el.addClass("x-window-maximized");this.container.addClass("x-window-maximized-ct");this.setPosition(0,0);this.fitContainer();this.fireEvent("maximize",this)}return this},restore:function(){if(this.maximized){var a=this.tools;this.el.removeClass("x-window-maximized");if(a.restore){a.restore.hide()}if(a.maximize){a.maximize.show()}this.setPosition(this.restorePos[0],this.restorePos[1]);this.setSize(this.restoreSize.width,this.restoreSize.height);delete this.restorePos;delete this.restoreSize;this.maximized=false;this.el.enableShadow(true);if(this.dd){this.dd.unlock()}if(this.collapsible&&a.toggle){a.toggle.show()}this.container.removeClass("x-window-maximized-ct");this.doConstrain();this.fireEvent("restore",this)}return this},toggleMaximize:function(){return this[this.maximized?"restore":"maximize"]()},fitContainer:function(){var a=this.container.getViewSize(false);this.setSize(a.width,a.height)},setZIndex:function(a){if(this.modal){this.mask.setStyle("z-index",a)}this.el.setZIndex(++a);a+=5;if(this.resizer){this.resizer.proxy.setStyle("z-index",++a)}this.lastZIndex=a},alignTo:function(b,a,c){var d=this.el.getAlignToXY(b,a,c);this.setPagePosition(d[0],d[1]);return this},anchorTo:function(c,e,d,b){this.clearAnchor();this.anchorTarget={el:c,alignment:e,offsets:d};Ext.EventManager.onWindowResize(this.doAnchor,this);var a=typeof b;if(a!="undefined"){Ext.EventManager.on(window,"scroll",this.doAnchor,this,{buffer:a=="number"?b:50})}return this.doAnchor()},doAnchor:function(){var a=this.anchorTarget;this.alignTo(a.el,a.alignment,a.offsets);return this},clearAnchor:function(){if(this.anchorTarget){Ext.EventManager.removeResizeListener(this.doAnchor,this);Ext.EventManager.un(window,"scroll",this.doAnchor,this);delete this.anchorTarget}return this},toFront:function(a){if(this.manager.bringToFront(this)){if(!a||!a.getTarget().focus){this.focus()}}return this},setActive:function(a){if(a){if(!this.maximized){this.el.enableShadow(true)}this.fireEvent("activate",this)}else{this.el.disableShadow();this.fireEvent("deactivate",this)}},toBack:function(){this.manager.sendToBack(this);return this},center:function(){var a=this.el.getAlignToXY(this.container,"c-c");this.setPagePosition(a[0],a[1]);return this}});Ext.reg("window",Ext.Window);Ext.Window.DD=Ext.extend(Ext.dd.DD,{constructor:function(a){this.win=a;Ext.Window.DD.superclass.constructor.call(this,a.el.id,"WindowDD-"+a.id);this.setHandleElId(a.header.id);this.scroll=false},moveOnly:true,headerOffsets:[100,25],startDrag:function(){var a=this.win;this.proxy=a.ghost(a.initialConfig.cls);if(a.constrain!==false){var c=a.el.shadowOffset;this.constrainTo(a.container,{right:c,left:c,bottom:c})}else{if(a.constrainHeader!==false){var b=this.proxy.getSize();this.constrainTo(a.container,{right:-(b.width-this.headerOffsets[0]),bottom:-(b.height-this.headerOffsets[1])})}}},b4Drag:Ext.emptyFn,onDrag:function(a){this.alignElWithMouse(this.proxy,a.getPageX(),a.getPageY())},endDrag:function(a){this.win.unghost();this.win.saveState()}});Ext.WindowGroup=function(){var f={};var d=[];var e=null;var c=function(i,h){return(!i._lastAccess||i._lastAccess<h._lastAccess)?-1:1};var g=function(){var k=d,h=k.length;if(h>0){k.sort(c);var j=k[0].manager.zseed;for(var l=0;l<h;l++){var m=k[l];if(m&&!m.hidden){m.setZIndex(j+(l*10))}}}a()};var b=function(h){if(h!=e){if(e){e.setActive(false)}e=h;if(h){h.setActive(true)}}};var a=function(){for(var h=d.length-1;h>=0;--h){if(!d[h].hidden){b(d[h]);return}}b(null)};return{zseed:9000,register:function(h){if(h.manager){h.manager.unregister(h)}h.manager=this;f[h.id]=h;d.push(h);h.on("hide",a)},unregister:function(h){delete h.manager;delete f[h.id];h.un("hide",a);d.remove(h)},get:function(h){return typeof h=="object"?h:f[h]},bringToFront:function(h){h=this.get(h);if(h!=e){h._lastAccess=new Date().getTime();g();return true}return false},sendToBack:function(h){h=this.get(h);h._lastAccess=-(new Date().getTime());g();return h},hideAll:function(){for(var h in f){if(f[h]&&typeof f[h]!="function"&&f[h].isVisible()){f[h].hide()}}},getActive:function(){return e},getBy:function(k,j){var l=[];for(var h=d.length-1;h>=0;--h){var m=d[h];if(k.call(j||m,m)!==false){l.push(m)}}return l},each:function(i,h){for(var j in f){if(f[j]&&typeof f[j]!="function"){if(i.call(h||f[j],f[j])===false){return}}}}}};Ext.WindowMgr=new Ext.WindowGroup();Ext.MessageBox=function(){var t,b,p,s,g,k,r,a,m,o,i,f,q,u,n,h="",d="",l=["ok","yes","no","cancel"];var c=function(w){q[w].blur();if(t.isVisible()){t.hide();v();Ext.callback(b.fn,b.scope||window,[w,u.dom.value,b],1)}};var v=function(){if(b&&b.cls){t.el.removeClass(b.cls)}m.reset()};var e=function(y,w,x){if(b&&b.closable!==false){t.hide();v()}if(x){x.stopEvent()}};var j=function(w){var y=0,x;if(!w){Ext.each(l,function(z){q[z].hide()});return y}t.footer.dom.style.display="";Ext.iterate(q,function(z,A){x=w[z];if(x){A.show();A.setText(Ext.isString(x)?x:Ext.MessageBox.buttonText[z]);y+=A.getEl().getWidth()+15}else{A.hide()}});return y};return{getDialog:function(w){if(!t){var y=[];q={};Ext.each(l,function(z){y.push(q[z]=new Ext.Button({text:this.buttonText[z],handler:c.createCallback(z),hideMode:"offsets"}))},this);t=new Ext.Window({autoCreate:true,title:w,resizable:false,constrain:true,constrainHeader:true,minimizable:false,maximizable:false,stateful:false,modal:true,shim:true,buttonAlign:"center",width:400,height:100,minHeight:80,plain:true,footer:true,closable:true,close:function(){if(b&&b.buttons&&b.buttons.no&&!b.buttons.cancel){c("no")}else{c("cancel")}},fbar:new Ext.Toolbar({items:y,enableOverflow:false})});t.render(document.body);t.getEl().addClass("x-window-dlg");p=t.mask;g=t.body.createChild({html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'});i=Ext.get(g.dom.firstChild);var x=g.dom.childNodes[1];k=Ext.get(x.firstChild);r=Ext.get(x.childNodes[2].firstChild);r.enableDisplayMode();r.addKeyListener([10,13],function(){if(t.isVisible()&&b&&b.buttons){if(b.buttons.ok){c("ok")}else{if(b.buttons.yes){c("yes")}}}});a=Ext.get(x.childNodes[2].childNodes[1]);a.enableDisplayMode();m=new Ext.ProgressBar({renderTo:g});g.createChild({cls:"x-clear"})}return t},updateText:function(A){if(!t.isVisible()&&!b.width){t.setSize(this.maxWidth,100)}k.update(A?A+" ":"&#160;");var y=d!=""?(i.getWidth()+i.getMargins("lr")):0,C=k.getWidth()+k.getMargins("lr"),z=t.getFrameWidth("lr"),B=t.body.getFrameWidth("lr"),x;x=Math.max(Math.min(b.width||y+C+z+B,b.maxWidth||this.maxWidth),Math.max(b.minWidth||this.minWidth,n||0));if(b.prompt===true){u.setWidth(x-y-z-B)}if(b.progress===true||b.wait===true){m.setSize(x-y-z-B)}if(Ext.isIE&&x==n){x+=4}k.update(A||"&#160;");t.setSize(x,"auto").center();return this},updateProgress:function(x,w,y){m.updateProgress(x,w);if(y){this.updateText(y)}return this},isVisible:function(){return t&&t.isVisible()},hide:function(){var w=t?t.activeGhost:null;if(this.isVisible()||w){t.hide();v();if(w){t.unghost(false,false)}}return this},show:function(z){if(this.isVisible()){this.hide()}b=z;var A=this.getDialog(b.title||"&#160;");A.setTitle(b.title||"&#160;");var w=(b.closable!==false&&b.progress!==true&&b.wait!==true);A.tools.close.setDisplayed(w);u=r;b.prompt=b.prompt||(b.multiline?true:false);if(b.prompt){if(b.multiline){r.hide();a.show();a.setHeight(Ext.isNumber(b.multiline)?b.multiline:this.defaultTextHeight);u=a}else{r.show();a.hide()}}else{r.hide();a.hide()}u.dom.value=b.value||"";if(b.prompt){A.focusEl=u}else{var y=b.buttons;var x=null;if(y&&y.ok){x=q.ok}else{if(y&&y.yes){x=q.yes}}if(x){A.focusEl=x}}if(Ext.isDefined(b.iconCls)){A.setIconClass(b.iconCls)}this.setIcon(Ext.isDefined(b.icon)?b.icon:h);n=j(b.buttons);m.setVisible(b.progress===true||b.wait===true);this.updateProgress(0,b.progressText);this.updateText(b.msg);if(b.cls){A.el.addClass(b.cls)}A.proxyDrag=b.proxyDrag===true;A.modal=b.modal!==false;A.mask=b.modal!==false?p:false;if(!A.isVisible()){document.body.appendChild(t.el.dom);A.setAnimateTarget(b.animEl);A.on("show",function(){if(w===true){A.keyMap.enable()}else{A.keyMap.disable()}},this,{single:true});A.show(b.animEl)}if(b.wait===true){m.wait(b.waitConfig)}return this},setIcon:function(w){if(!t){h=w;return}h=undefined;if(w&&w!=""){i.removeClass("x-hidden");i.replaceClass(d,w);g.addClass("x-dlg-icon");d=w}else{i.replaceClass(d,"x-hidden");g.removeClass("x-dlg-icon");d=""}return this},progress:function(y,x,w){this.show({title:y,msg:x,buttons:false,progress:true,closable:false,minWidth:this.minProgressWidth,progressText:w});return this},wait:function(y,x,w){this.show({title:x,msg:y,buttons:false,closable:false,wait:true,modal:true,minWidth:this.minProgressWidth,waitConfig:w});return this},alert:function(z,y,x,w){this.show({title:z,msg:y,buttons:this.OK,fn:x,scope:w,minWidth:this.minWidth});return this},confirm:function(z,y,x,w){this.show({title:z,msg:y,buttons:this.YESNO,fn:x,scope:w,icon:this.QUESTION,minWidth:this.minWidth});return this},prompt:function(B,A,y,x,w,z){this.show({title:B,msg:A,buttons:this.OKCANCEL,fn:y,minWidth:this.minPromptWidth,scope:x,prompt:true,multiline:w,value:z});return this},OK:{ok:true},CANCEL:{cancel:true},OKCANCEL:{ok:true,cancel:true},YESNO:{yes:true,no:true},YESNOCANCEL:{yes:true,no:true,cancel:true},INFO:"ext-mb-info",WARNING:"ext-mb-warning",QUESTION:"ext-mb-question",ERROR:"ext-mb-error",defaultTextHeight:75,maxWidth:600,minWidth:100,minProgressWidth:250,minPromptWidth:250,buttonText:{ok:"OK",cancel:"Cancel",yes:"Yes",no:"No"}}}();Ext.Msg=Ext.MessageBox;Ext.dd.PanelProxy=Ext.extend(Object,{constructor:function(a,b){this.panel=a;this.id=this.panel.id+"-ddproxy";Ext.apply(this,b)},insertProxy:true,setStatus:Ext.emptyFn,reset:Ext.emptyFn,update:Ext.emptyFn,stop:Ext.emptyFn,sync:Ext.emptyFn,getEl:function(){return this.ghost},getGhost:function(){return this.ghost},getProxy:function(){return this.proxy},hide:function(){if(this.ghost){if(this.proxy){this.proxy.remove();delete this.proxy}this.panel.el.dom.style.display="";this.ghost.remove();delete this.ghost}},show:function(){if(!this.ghost){this.ghost=this.panel.createGhost(this.panel.initialConfig.cls,undefined,Ext.getBody());this.ghost.setXY(this.panel.el.getXY());if(this.insertProxy){this.proxy=this.panel.el.insertSibling({cls:"x-panel-dd-spacer"});this.proxy.setSize(this.panel.getSize())}this.panel.el.dom.style.display="none"}},repair:function(b,c,a){this.hide();if(typeof c=="function"){c.call(a||this)}},moveProxy:function(a,b){if(this.proxy){a.insertBefore(this.proxy.dom,b)}}});Ext.Panel.DD=Ext.extend(Ext.dd.DragSource,{constructor:function(b,a){this.panel=b;this.dragData={panel:b};this.proxy=new Ext.dd.PanelProxy(b,a);Ext.Panel.DD.superclass.constructor.call(this,b.el,a);var d=b.header,c=b.body;if(d){this.setHandleElId(d.id);c=b.header}c.setStyle("cursor","move");this.scroll=false},showFrame:Ext.emptyFn,startDrag:Ext.emptyFn,b4StartDrag:function(a,b){this.proxy.show()},b4MouseDown:function(b){var a=b.getPageX(),c=b.getPageY();this.autoOffset(a,c)},onInitDrag:function(a,b){this.onStartDrag(a,b);return true},createFrame:Ext.emptyFn,getDragEl:function(a){return this.proxy.ghost.dom},endDrag:function(a){this.proxy.hide();this.panel.saveState()},autoOffset:function(a,b){a-=this.startPageX;b-=this.startPageY;this.setDelta(a,b)}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.data.XmlWriter=function(a){Ext.data.XmlWriter.superclass.constructor.apply(this,arguments);this.tpl=(typeof(this.tpl)==="string")?new Ext.XTemplate(this.tpl).compile():this.tpl.compile()};Ext.extend(Ext.data.XmlWriter,Ext.data.DataWriter,{documentRoot:"xrequest",forceDocumentRoot:false,root:"records",xmlVersion:"1.0",xmlEncoding:"ISO-8859-15",tpl:'<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',render:function(b,c,a){c=this.toArray(c);b.xmlData=this.tpl.applyTemplate({version:this.xmlVersion,encoding:this.xmlEncoding,documentRoot:(c.length>0||this.forceDocumentRoot===true)?this.documentRoot:false,record:this.meta.record,root:this.root,baseParams:c,records:(Ext.isArray(a[0]))?a:[a]})},createRecord:function(a){return this.toArray(this.toHash(a))},updateRecord:function(a){return this.toArray(this.toHash(a))},destroyRecord:function(b){var a={};a[this.meta.idProperty]=b.id;return this.toArray(a)}});Ext.data.XmlReader=function(a,b){a=a||{};Ext.applyIf(a,{idProperty:a.idProperty||a.idPath||a.id,successProperty:a.successProperty||a.success});Ext.data.XmlReader.superclass.constructor.call(this,a,b||a.fields)};Ext.extend(Ext.data.XmlReader,Ext.data.DataReader,{read:function(a){var b=a.responseXML;if(!b){throw {message:"XmlReader.read: XML Document not available"}}return this.readRecords(b)},readRecords:function(d){this.xmlData=d;var a=d.documentElement||d,c=Ext.DomQuery,f=0,e=true;if(this.meta.totalProperty){f=this.getTotal(a,0)}if(this.meta.successProperty){e=this.getSuccess(a)}var b=this.extractData(c.select(this.meta.record,a),true);return{success:e,records:b,totalRecords:f||b.length}},readResponse:function(f,b){var e=Ext.DomQuery,g=b.responseXML,a=g.documentElement||g;var c=new Ext.data.Response({action:f,success:this.getSuccess(a),message:this.getMessage(a),data:this.extractData(e.select(this.meta.record,a)||e.select(this.meta.root,a),false),raw:g});if(Ext.isEmpty(c.success)){throw new Ext.data.DataReader.Error("successProperty-response",this.meta.successProperty)}if(f===Ext.data.Api.actions.create){var d=Ext.isDefined(c.data);if(d&&Ext.isEmpty(c.data)){throw new Ext.data.JsonReader.Error("root-empty",this.meta.root)}else{if(!d){throw new Ext.data.JsonReader.Error("root-undefined-response",this.meta.root)}}}return c},getSuccess:function(){return true},buildExtractors:function(){if(this.ef){return}var l=this.meta,h=this.recordType,e=h.prototype.fields,k=e.items,j=e.length;if(l.totalProperty){this.getTotal=this.createAccessor(l.totalProperty)}if(l.successProperty){this.getSuccess=this.createAccessor(l.successProperty)}if(l.messageProperty){this.getMessage=this.createAccessor(l.messageProperty)}this.getRoot=function(f){return(!Ext.isEmpty(f[this.meta.record]))?f[this.meta.record]:f[this.meta.root]};if(l.idPath||l.idProperty){var d=this.createAccessor(l.idPath||l.idProperty);this.getId=function(f){var g=d(f)||f.id;return(g===undefined||g==="")?null:g}}else{this.getId=function(){return null}}var c=[];for(var b=0;b<j;b++){e=k[b];var a=(e.mapping!==undefined&&e.mapping!==null)?e.mapping:e.name;c.push(this.createAccessor(a))}this.ef=c},createAccessor:function(){var a=Ext.DomQuery;return function(b){if(Ext.isFunction(b)){return b}switch(b){case this.meta.totalProperty:return function(c,d){return a.selectNumber(b,c,d)};break;case this.meta.successProperty:return function(d,e){var c=a.selectValue(b,d,true);var f=c!==false&&c!=="false";return f};break;default:return function(c,d){return a.selectValue(b,c,d)};break}}}(),extractValues:function(h,d,a){var g,c={};for(var e=0;e<a;e++){g=d[e];var b=this.ef[e](h);c[g.name]=g.convert((b!==undefined)?b:g.defaultValue,h)}return c}});Ext.data.XmlStore=Ext.extend(Ext.data.Store,{constructor:function(a){Ext.data.XmlStore.superclass.constructor.call(this,Ext.apply(a,{reader:new Ext.data.XmlReader(a)}))}});Ext.reg("xmlstore",Ext.data.XmlStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/cmp-foundation-debug.js	(revision 76)
@@ -0,0 +1,14756 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ComponentMgr
+ * <p>Provides a registry of all Components (instances of {@link Ext.Component} or any subclass
+ * thereof) on a page so that they can be easily accessed by {@link Ext.Component component}
+ * {@link Ext.Component#id id} (see {@link #get}, or the convenience method {@link Ext#getCmp Ext.getCmp}).</p>
+ * <p>This object also provides a registry of available Component <i>classes</i>
+ * indexed by a mnemonic code known as the Component's {@link Ext.Component#xtype xtype}.
+ * The <code>{@link Ext.Component#xtype xtype}</code> provides a way to avoid instantiating child Components
+ * when creating a full, nested config object for a complete Ext page.</p>
+ * <p>A child Component may be specified simply as a <i>config object</i>
+ * as long as the correct <code>{@link Ext.Component#xtype xtype}</code> is specified so that if and when the Component
+ * needs rendering, the correct type can be looked up for lazy instantiation.</p>
+ * <p>For a list of all available <code>{@link Ext.Component#xtype xtypes}</code>, see {@link Ext.Component}.</p>
+ * @singleton
+ */
+Ext.ComponentMgr = function(){
+    var all = new Ext.util.MixedCollection();
+    var types = {};
+    var ptypes = {};
+
+    return {
+        /**
+         * Registers a component.
+         * @param {Ext.Component} c The component
+         */
+        register : function(c){
+            all.add(c);
+        },
+
+        /**
+         * Unregisters a component.
+         * @param {Ext.Component} c The component
+         */
+        unregister : function(c){
+            all.remove(c);
+        },
+
+        /**
+         * Returns a component by {@link Ext.Component#id id}.
+         * For additional details see {@link Ext.util.MixedCollection#get}.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+         * Class was found.
+         */
+        get : function(id){
+            return all.get(id);
+        },
+
+        /**
+         * Registers a function that will be called when a Component with the specified id is added to ComponentMgr. This will happen on instantiation.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @param {Function} fn The callback function
+         * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+         */
+        onAvailable : function(id, fn, scope){
+            all.on("add", function(index, o){
+                if(o.id == id){
+                    fn.call(scope || o, o);
+                    all.un("add", fn, scope);
+                }
+            });
+        },
+
+        /**
+         * The MixedCollection used internally for the component cache. An example usage may be subscribing to
+         * events on the MixedCollection to monitor addition or removal.  Read-only.
+         * @type {MixedCollection}
+         */
+        all : all,
+        
+        /**
+         * The xtypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        types : types,
+        
+        /**
+         * The ptypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        ptypes: ptypes,
+        
+        /**
+         * Checks if a Component type is registered.
+         * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isRegistered : function(xtype){
+            return types[xtype] !== undefined;    
+        },
+        
+        /**
+         * Checks if a Plugin type is registered.
+         * @param {Ext.Component} ptype The mnemonic string by which the Plugin class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isPluginRegistered : function(ptype){
+            return ptypes[ptype] !== undefined;    
+        },        
+
+        /**
+         * <p>Registers a new Component constructor, keyed by a new
+         * {@link Ext.Component#xtype}.</p>
+         * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+         * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+         * child Components.
+         * see {@link Ext.Container#items}</p>
+         * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+         * @param {Constructor} cls The new Component class.
+         */
+        registerType : function(xtype, cls){
+            types[xtype] = cls;
+            cls.xtype = xtype;
+        },
+
+        /**
+         * Creates a new Component from the specified config object using the
+         * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Component you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Component type if
+         * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+         * @return {Ext.Component} The newly instantiated Component.
+         */
+        create : function(config, defaultType){
+            return config.render ? config : new types[config.xtype || defaultType](config);
+        },
+
+        /**
+         * <p>Registers a new Plugin constructor, keyed by a new
+         * {@link Ext.Component#ptype}.</p>
+         * <p>Use this method (or its alias {@link Ext#preg Ext.preg}) to register new
+         * plugins for {@link Ext.Component}s so that lazy instantiation may be used when specifying
+         * Plugins.</p>
+         * @param {String} ptype The mnemonic string by which the Plugin class may be looked up.
+         * @param {Constructor} cls The new Plugin class.
+         */
+        registerPlugin : function(ptype, cls){
+            ptypes[ptype] = cls;
+            cls.ptype = ptype;
+        },
+
+        /**
+         * Creates a new Plugin from the specified config object using the
+         * config object's {@link Ext.component#ptype ptype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Plugin you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Plugin type if
+         * the config object does not contain a <code>ptype</code>. (Optional if the config contains a <code>ptype</code>).
+         * @return {Ext.Component} The newly instantiated Plugin.
+         */
+        createPlugin : function(config, defaultType){
+            var PluginCls = ptypes[config.ptype || defaultType];
+            if (PluginCls.init) {
+                return PluginCls;                
+            } else {
+                return new PluginCls(config);
+            }            
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerType}
+ * @param {String} xtype The {@link Ext.component#xtype mnemonic string} by which the Component class
+ * may be looked up.
+ * @param {Constructor} cls The new Component class.
+ * @member Ext
+ * @method reg
+ */
+Ext.reg = Ext.ComponentMgr.registerType; // this will be called a lot internally, shorthand to keep the bytes down
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerPlugin}
+ * @param {String} ptype The {@link Ext.component#ptype mnemonic string} by which the Plugin class
+ * may be looked up.
+ * @param {Constructor} cls The new Plugin class.
+ * @member Ext
+ * @method preg
+ */
+Ext.preg = Ext.ComponentMgr.registerPlugin;
+/**
+ * Shorthand for {@link Ext.ComponentMgr#create}
+ * Creates a new Component from the specified config object using the
+ * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+ * @param {Object} config A configuration object for the Component you wish to create.
+ * @param {Constructor} defaultType The constructor to provide the default Component type if
+ * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+ * @return {Ext.Component} The newly instantiated Component.
+ * @member Ext
+ * @method create
+ */
+Ext.create = Ext.ComponentMgr.create;/**
+ * @class Ext.Component
+ * @extends Ext.util.Observable
+ * <p>Base class for all Ext components.  All subclasses of Component may participate in the automated
+ * Ext component lifecycle of creation, rendering and destruction which is provided by the {@link Ext.Container Container} class.
+ * Components may be added to a Container through the {@link Ext.Container#items items} config option at the time the Container is created,
+ * or they may be added dynamically via the {@link Ext.Container#add add} method.</p>
+ * <p>The Component base class has built-in support for basic hide/show and enable/disable behavior.</p>
+ * <p>All Components are registered with the {@link Ext.ComponentMgr} on construction so that they can be referenced at any time via
+ * {@link Ext#getCmp}, passing the {@link #id}.</p>
+ * <p>All user-developed visual widgets that are required to participate in automated lifecycle and size management should subclass Component (or
+ * {@link Ext.BoxComponent} if managed box model handling is required, ie height and width management).</p>
+ * <p>See the <a href="http://extjs.com/learn/Tutorial:Creating_new_UI_controls">Creating new UI controls</a> tutorial for details on how
+ * and to either extend or augment ExtJs base classes to create custom Components.</p>
+ * <p>Every component has a specific xtype, which is its Ext-specific type name, along with methods for checking the
+ * xtype like {@link #getXType} and {@link #isXType}. This is the list of all valid xtypes:</p>
+ * <pre>
+xtype            Class
+-------------    ------------------
+box              {@link Ext.BoxComponent}
+button           {@link Ext.Button}
+buttongroup      {@link Ext.ButtonGroup}
+colorpalette     {@link Ext.ColorPalette}
+component        {@link Ext.Component}
+container        {@link Ext.Container}
+cycle            {@link Ext.CycleButton}
+dataview         {@link Ext.DataView}
+datepicker       {@link Ext.DatePicker}
+editor           {@link Ext.Editor}
+editorgrid       {@link Ext.grid.EditorGridPanel}
+flash            {@link Ext.FlashComponent}
+grid             {@link Ext.grid.GridPanel}
+listview         {@link Ext.ListView}
+multislider      {@link Ext.slider.MultiSlider}
+panel            {@link Ext.Panel}
+progress         {@link Ext.ProgressBar}
+propertygrid     {@link Ext.grid.PropertyGrid}
+slider           {@link Ext.slider.SingleSlider}
+spacer           {@link Ext.Spacer}
+splitbutton      {@link Ext.SplitButton}
+tabpanel         {@link Ext.TabPanel}
+treepanel        {@link Ext.tree.TreePanel}
+viewport         {@link Ext.ViewPort}
+window           {@link Ext.Window}
+
+Toolbar components
+---------------------------------------
+paging           {@link Ext.PagingToolbar}
+toolbar          {@link Ext.Toolbar}
+tbbutton         {@link Ext.Toolbar.Button}        (deprecated; use button)
+tbfill           {@link Ext.Toolbar.Fill}
+tbitem           {@link Ext.Toolbar.Item}
+tbseparator      {@link Ext.Toolbar.Separator}
+tbspacer         {@link Ext.Toolbar.Spacer}
+tbsplit          {@link Ext.Toolbar.SplitButton}   (deprecated; use splitbutton)
+tbtext           {@link Ext.Toolbar.TextItem}
+
+Menu components
+---------------------------------------
+menu             {@link Ext.menu.Menu}
+colormenu        {@link Ext.menu.ColorMenu}
+datemenu         {@link Ext.menu.DateMenu}
+menubaseitem     {@link Ext.menu.BaseItem}
+menucheckitem    {@link Ext.menu.CheckItem}
+menuitem         {@link Ext.menu.Item}
+menuseparator    {@link Ext.menu.Separator}
+menutextitem     {@link Ext.menu.TextItem}
+
+Form components
+---------------------------------------
+form             {@link Ext.form.FormPanel}
+checkbox         {@link Ext.form.Checkbox}
+checkboxgroup    {@link Ext.form.CheckboxGroup}
+combo            {@link Ext.form.ComboBox}
+compositefield   {@link Ext.form.CompositeField}
+datefield        {@link Ext.form.DateField}
+displayfield     {@link Ext.form.DisplayField}
+field            {@link Ext.form.Field}
+fieldset         {@link Ext.form.FieldSet}
+hidden           {@link Ext.form.Hidden}
+htmleditor       {@link Ext.form.HtmlEditor}
+label            {@link Ext.form.Label}
+numberfield      {@link Ext.form.NumberField}
+radio            {@link Ext.form.Radio}
+radiogroup       {@link Ext.form.RadioGroup}
+textarea         {@link Ext.form.TextArea}
+textfield        {@link Ext.form.TextField}
+timefield        {@link Ext.form.TimeField}
+trigger          {@link Ext.form.TriggerField}
+
+Chart components
+---------------------------------------
+chart            {@link Ext.chart.Chart}
+barchart         {@link Ext.chart.BarChart}
+cartesianchart   {@link Ext.chart.CartesianChart}
+columnchart      {@link Ext.chart.ColumnChart}
+linechart        {@link Ext.chart.LineChart}
+piechart         {@link Ext.chart.PieChart}
+
+Store xtypes
+---------------------------------------
+arraystore       {@link Ext.data.ArrayStore}
+directstore      {@link Ext.data.DirectStore}
+groupingstore    {@link Ext.data.GroupingStore}
+jsonstore        {@link Ext.data.JsonStore}
+simplestore      {@link Ext.data.SimpleStore}      (deprecated; use arraystore)
+store            {@link Ext.data.Store}
+xmlstore         {@link Ext.data.XmlStore}
+</pre>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options may be specified as either:
+ * <div class="mdetail-params"><ul>
+ * <li><b>an element</b> :
+ * <p class="sub-desc">it is set as the internal element and its id used as the component id</p></li>
+ * <li><b>a string</b> :
+ * <p class="sub-desc">it is assumed to be the id of an existing element and is used as the component id</p></li>
+ * <li><b>anything else</b> :
+ * <p class="sub-desc">it is assumed to be a standard config object and is applied to the component</p></li>
+ * </ul></div>
+ */
+Ext.Component = function(config){
+    config = config || {};
+    if(config.initialConfig){
+        if(config.isAction){           // actions
+            this.baseAction = config;
+        }
+        config = config.initialConfig; // component cloning / action set up
+    }else if(config.tagName || config.dom || Ext.isString(config)){ // element object
+        config = {applyTo: config, id: config.id || config};
+    }
+
+    /**
+     * This Component's initial configuration specification. Read-only.
+     * @type Object
+     * @property initialConfig
+     */
+    this.initialConfig = config;
+
+    Ext.apply(this, config);
+    this.addEvents(
+        /**
+         * @event added
+         * Fires when a component is added to an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         * @param {number} index Position at which the component was added
+         */
+        'added',
+        /**
+         * @event disable
+         * Fires after the component is disabled.
+         * @param {Ext.Component} this
+         */
+        'disable',
+        /**
+         * @event enable
+         * Fires after the component is enabled.
+         * @param {Ext.Component} this
+         */
+        'enable',
+        /**
+         * @event beforeshow
+         * Fires before the component is shown by calling the {@link #show} method.
+         * Return false from an event handler to stop the show.
+         * @param {Ext.Component} this
+         */
+        'beforeshow',
+        /**
+         * @event show
+         * Fires after the component is shown when calling the {@link #show} method.
+         * @param {Ext.Component} this
+         */
+        'show',
+        /**
+         * @event beforehide
+         * Fires before the component is hidden by calling the {@link #hide} method.
+         * Return false from an event handler to stop the hide.
+         * @param {Ext.Component} this
+         */
+        'beforehide',
+        /**
+         * @event hide
+         * Fires after the component is hidden.
+         * Fires after the component is hidden when calling the {@link #hide} method.
+         * @param {Ext.Component} this
+         */
+        'hide',
+        /**
+         * @event removed
+         * Fires when a component is removed from an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         */
+        'removed',
+        /**
+         * @event beforerender
+         * Fires before the component is {@link #rendered}. Return false from an
+         * event handler to stop the {@link #render}.
+         * @param {Ext.Component} this
+         */
+        'beforerender',
+        /**
+         * @event render
+         * Fires after the component markup is {@link #rendered}.
+         * @param {Ext.Component} this
+         */
+        'render',
+        /**
+         * @event afterrender
+         * <p>Fires after the component rendering is finished.</p>
+         * <p>The afterrender event is fired after this Component has been {@link #rendered}, been postprocesed
+         * by any afterRender method defined for the Component, and, if {@link #stateful}, after state
+         * has been restored.</p>
+         * @param {Ext.Component} this
+         */
+        'afterrender',
+        /**
+         * @event beforedestroy
+         * Fires before the component is {@link #destroy}ed. Return false from an event handler to stop the {@link #destroy}.
+         * @param {Ext.Component} this
+         */
+        'beforedestroy',
+        /**
+         * @event destroy
+         * Fires after the component is {@link #destroy}ed.
+         * @param {Ext.Component} this
+         */
+        'destroy',
+        /**
+         * @event beforestaterestore
+         * Fires before the state of the component is restored. Return false from an event handler to stop the restore.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. If this
+         * event is not vetoed, then the state object is passed to <b><tt>applyState</tt></b>. By default,
+         * that simply copies property values into this Component. The method maybe overriden to
+         * provide custom state restoration.
+         */
+        'beforestaterestore',
+        /**
+         * @event staterestore
+         * Fires after the state of the component is restored.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. This is passed
+         * to <b><tt>applyState</tt></b>. By default, that simply copies property values into this
+         * Component. The method maybe overriden to provide custom state restoration.
+         */
+        'staterestore',
+        /**
+         * @event beforestatesave
+         * Fires before the state of the component is saved to the configured state provider. Return false to stop the save.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'beforestatesave',
+        /**
+         * @event statesave
+         * Fires after the state of the component is saved to the configured state provider.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'statesave'
+    );
+    this.getId();
+    Ext.ComponentMgr.register(this);
+    Ext.Component.superclass.constructor.call(this);
+
+    if(this.baseAction){
+        this.baseAction.addComponent(this);
+    }
+
+    this.initComponent();
+
+    if(this.plugins){
+        if(Ext.isArray(this.plugins)){
+            for(var i = 0, len = this.plugins.length; i < len; i++){
+                this.plugins[i] = this.initPlugin(this.plugins[i]);
+            }
+        }else{
+            this.plugins = this.initPlugin(this.plugins);
+        }
+    }
+
+    if(this.stateful !== false){
+        this.initState();
+    }
+
+    if(this.applyTo){
+        this.applyToMarkup(this.applyTo);
+        delete this.applyTo;
+    }else if(this.renderTo){
+        this.render(this.renderTo);
+        delete this.renderTo;
+    }
+};
+
+// private
+Ext.Component.AUTO_ID = 1000;
+
+Ext.extend(Ext.Component, Ext.util.Observable, {
+    // Configs below are used for all Components when rendered by FormLayout.
+    /**
+     * @cfg {String} fieldLabel <p>The label text to display next to this Component (defaults to '').</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelStyle <p>A CSS style specification string to apply directly to this field's
+     * label.  Defaults to the container's labelStyle value if set (e.g.,
+     * <tt>{@link Ext.layout.FormLayout#labelStyle}</tt> , or '').</p>
+     * <br><p><b>Note</b>: see the note for <code>{@link #clearCls}</code>.</p><br>
+     * <p>Also see <code>{@link #hideLabel}</code> and
+     * <code>{@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</code></p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        labelStyle: 'font-weight:bold;'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelSeparator <p>The separator to display after the text of each
+     * <tt>{@link #fieldLabel}</tt>.  This property may be configured at various levels.
+     * The order of precedence is:
+     * <div class="mdetail-params"><ul>
+     * <li>field / component level</li>
+     * <li>container level</li>
+     * <li>{@link Ext.layout.FormLayout#labelSeparator layout level} (defaults to colon <tt>':'</tt>)</li>
+     * </ul></div>
+     * To display no separator for this field's label specify empty string ''.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    layoutConfig: {
+        labelSeparator: '~'   // layout config has lowest priority (defaults to ':')
+    },
+    {@link Ext.layout.FormLayout#labelSeparator labelSeparator}: '>>',     // config at container level
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Field 1',
+        labelSeparator: '...' // field/component level config supersedes others
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Field 2' // labelSeparator will be '='
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideLabel <p><tt>true</tt> to completely hide the label element
+     * ({@link #fieldLabel label} and {@link #labelSeparator separator}). Defaults to <tt>false</tt>.
+     * By default, even if you do not specify a <tt>{@link #fieldLabel}</tt> the space will still be
+     * reserved so that the field will line up with other fields that do have labels.
+     * Setting this to <tt>true</tt> will cause the field to not reserve that space.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield'
+        hideLabel: true
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} clearCls <p>The CSS class used to to apply to the special clearing div rendered
+     * directly after each form field wrapper to provide field clearing (defaults to
+     * <tt>'x-form-clear-left'</tt>).</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container
+     * which has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout
+     * manager (e.g. {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) and either a
+     * <tt>{@link #fieldLabel}</tt> is specified or <tt>isFormField=true</tt> is specified.</p><br>
+     * <p>See {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} also.</p>
+     */
+    /**
+     * @cfg {String} itemCls
+     * <p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>An additional CSS class to apply to the div wrapping the form item
+     * element of this field.  If supplied, <tt>itemCls</tt> at the <b>field</b> level will override
+     * the default <tt>itemCls</tt> supplied at the <b>container</b> level. The value specified for
+     * <tt>itemCls</tt> will be added to the default class (<tt>'x-form-item'</tt>).</p>
+     * <p>Since it is applied to the item wrapper (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}), it allows
+     * you to write standard CSS rules that can apply to the field, the label (if specified), or
+     * any other element within the markup for the field.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #fieldLabel}</tt>.</p><br>
+     * Example use:<pre><code>
+// Apply a style to the field&#39;s label:
+&lt;style>
+    .required .x-form-item-label {font-weight:bold;color:red;}
+&lt;/style>
+
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        itemCls: 'required' //this label will be styled
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Favorite Color'
+    }]
+});
+</code></pre>
+     */
+
+    /**
+     * @cfg {String} id
+     * <p>The <b>unique</b> id of this component (defaults to an {@link #getId auto-assigned id}).
+     * You should assign an id if you need to be able to access the component later and you do
+     * not have an object reference available (e.g., using {@link Ext}.{@link Ext#getCmp getCmp}).</p>
+     * <p>Note that this id will also be used as the element id for the containing HTML element
+     * that is rendered to the page for this component. This allows you to write id-based CSS
+     * rules to style the specific instance of this component uniquely, and also to select
+     * sub-elements using this component's id as the parent.</p>
+     * <p><b>Note</b>: to avoid complications imposed by a unique <tt>id</tt> also see
+     * <code>{@link #itemId}</code> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <code>{@link #ownerCt}</code>.</p>
+     */
+    /**
+     * @cfg {String} itemId
+     * <p>An <tt>itemId</tt> can be used as an alternative way to get a reference to a component
+     * when no object reference is available.  Instead of using an <code>{@link #id}</code> with
+     * {@link Ext}.{@link Ext#getCmp getCmp}, use <code>itemId</code> with
+     * {@link Ext.Container}.{@link Ext.Container#getComponent getComponent} which will retrieve
+     * <code>itemId</code>'s or <tt>{@link #id}</tt>'s. Since <code>itemId</code>'s are an index to the
+     * container's internal MixedCollection, the <code>itemId</code> is scoped locally to the container --
+     * avoiding potential conflicts with {@link Ext.ComponentMgr} which requires a <b>unique</b>
+     * <code>{@link #id}</code>.</p>
+     * <pre><code>
+var c = new Ext.Panel({ //
+    {@link Ext.BoxComponent#height height}: 300,
+    {@link #renderTo}: document.body,
+    {@link Ext.Container#layout layout}: 'auto',
+    {@link Ext.Container#items items}: [
+        {
+            itemId: 'p1',
+            {@link Ext.Panel#title title}: 'Panel 1',
+            {@link Ext.BoxComponent#height height}: 150
+        },
+        {
+            itemId: 'p2',
+            {@link Ext.Panel#title title}: 'Panel 2',
+            {@link Ext.BoxComponent#height height}: 150
+        }
+    ]
+})
+p1 = c.{@link Ext.Container#getComponent getComponent}('p1'); // not the same as {@link Ext#getCmp Ext.getCmp()}
+p2 = p1.{@link #ownerCt}.{@link Ext.Container#getComponent getComponent}('p2'); // reference via a sibling
+     * </code></pre>
+     * <p>Also see <tt>{@link #id}</tt> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <tt>{@link #ownerCt}</tt>.</p>
+     */
+    /**
+     * @cfg {String} xtype
+     * The registered <tt>xtype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a child item of a Container is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>xtype</tt> will be looked up at render time up to determine what
+     * type of child Component to create.<br><br>
+     * The predefined xtypes are listed {@link Ext.Component here}.
+     * <br><br>
+     * If you subclass Components to create your own Components, you may register
+     * them using {@link Ext.ComponentMgr#registerType} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} ptype
+     * The registered <tt>ptype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a Plugin is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>ptype</tt> will be looked up at render time up to determine what
+     * type of Plugin to create.<br><br>
+     * If you create your own Plugins, you may register them using
+     * {@link Ext.ComponentMgr#registerPlugin} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} cls
+     * An optional extra CSS class that will be added to this component's Element (defaults to '').  This can be
+     * useful for adding customized styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} overCls
+     * An optional extra CSS class that will be added to this component's Element when the mouse moves
+     * over the Element, and removed when the mouse moves out. (defaults to '').  This can be
+     * useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} style
+     * A custom style specification to be applied to this component's Element.  Should be a valid argument to
+     * {@link Ext.Element#applyStyles}.
+     * <pre><code>
+new Ext.Panel({
+    title: 'Some Title',
+    renderTo: Ext.getBody(),
+    width: 400, height: 300,
+    layout: 'form',
+    items: [{
+        xtype: 'textarea',
+        style: {
+            width: '95%',
+            marginBottom: '10px'
+        }
+    },
+        new Ext.Button({
+            text: 'Send',
+            minWidth: '100',
+            style: {
+                marginBottom: '10px'
+            }
+        })
+    ]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} ctCls
+     * <p>An optional extra CSS class that will be added to this component's container. This can be useful for
+     * adding customized styles to the container or any of its children using standard CSS rules.  See
+     * {@link Ext.layout.ContainerLayout}.{@link Ext.layout.ContainerLayout#extraCls extraCls} also.</p>
+     * <p><b>Note</b>: <tt>ctCls</tt> defaults to <tt>''</tt> except for the following class
+     * which assigns a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-layout-ct'</tt></li>
+     * </ul></div>
+     * To configure the above Class with an extra CSS class append to the default.  For example,
+     * for BoxLayout (Hbox and Vbox):<pre><code>
+     * ctCls: 'x-box-layout-ct custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this component disabled (default is false).
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is false). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : false,
+    /**
+     * @cfg {Object/Array} plugins
+     * An object or array of objects that will provide custom functionality for this component.  The only
+     * requirement for a valid plugin is that it contain an init method that accepts a reference of type Ext.Component.
+     * When a component is created, if any plugins are available, the component will call the init method on each
+     * plugin, passing a reference to itself.  Each plugin can then call methods or respond to events on the
+     * component as needed to provide its functionality.
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>Specify the id of the element, a DOM element or an existing Element corresponding to a DIV
+     * that is already present in the document that specifies some structural markup for this
+     * component.</p><div><ul>
+     * <li><b>Description</b> : <ul>
+     * <div class="sub-desc">When <tt>applyTo</tt> is used, constituent parts of the component can also be specified
+     * by id or CSS class name within the main element, and the component being created may attempt
+     * to create its subcomponents from that markup if applicable.</div>
+     * </ul></li>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * <div class="sub-desc">If applyTo is specified, any value passed for {@link #renderTo} will be ignored and the target
+     * element's parent node will automatically be used as the component's container.</div>
+     * </ul></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Mixed} renderTo
+     * <p>Specify the id of the element, a DOM element or an existing Element that this component
+     * will be rendered into.</p><div><ul>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">Do <u>not</u> use this option if the Component is to be a child item of
+     * a {@link Ext.Container Container}. It is the responsibility of the
+     * {@link Ext.Container Container}'s {@link Ext.Container#layout layout manager}
+     * to render and manage its child items.</div>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * </ul></li>
+     * </ul></div>
+     * <p>See <tt>{@link #render}</tt> also.</p>
+     */
+    /**
+     * @cfg {Boolean} stateful
+     * <p>A flag which causes the Component to attempt to restore the state of
+     * internal properties from a saved state on startup. The component must have
+     * either a <code>{@link #stateId}</code> or <code>{@link #id}</code> assigned
+     * for state to be managed. Auto-generated ids are not guaranteed to be stable
+     * across page loads and cannot be relied upon to save and restore the same
+     * state for a component.<p>
+     * <p>For state saving to work, the state manager's provider must have been
+     * set to an implementation of {@link Ext.state.Provider} which overrides the
+     * {@link Ext.state.Provider#set set} and {@link Ext.state.Provider#get get}
+     * methods to save and recall name/value pairs. A built-in implementation,
+     * {@link Ext.state.CookieProvider} is available.</p>
+     * <p>To set the state provider for the current page:</p>
+     * <pre><code>
+Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
+    expires: new Date(new Date().getTime()+(1000*60*60*24*7)), //7 days from now
+}));
+     * </code></pre>
+     * <p>A stateful Component attempts to save state when one of the events
+     * listed in the <code>{@link #stateEvents}</code> configuration fires.</p>
+     * <p>To save state, a stateful Component first serializes its state by
+     * calling <b><code>getState</code></b>. By default, this function does
+     * nothing. The developer must provide an implementation which returns an
+     * object hash which represents the Component's restorable state.</p>
+     * <p>The value yielded by getState is passed to {@link Ext.state.Manager#set}
+     * which uses the configured {@link Ext.state.Provider} to save the object
+     * keyed by the Component's <code>{@link stateId}</code>, or, if that is not
+     * specified, its <code>{@link #id}</code>.</p>
+     * <p>During construction, a stateful Component attempts to <i>restore</i>
+     * its state by calling {@link Ext.state.Manager#get} passing the
+     * <code>{@link #stateId}</code>, or, if that is not specified, the
+     * <code>{@link #id}</code>.</p>
+     * <p>The resulting object is passed to <b><code>applyState</code></b>.
+     * The default implementation of <code>applyState</code> simply copies
+     * properties into the object, but a developer may override this to support
+     * more behaviour.</p>
+     * <p>You can perform extra processing on state save and restore by attaching
+     * handlers to the {@link #beforestaterestore}, {@link #staterestore},
+     * {@link #beforestatesave} and {@link #statesave} events.</p>
+     */
+    /**
+     * @cfg {String} stateId
+     * The unique id for this component to use for state management purposes
+     * (defaults to the component id if one was set, otherwise null if the
+     * component is using a generated id).
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Array} stateEvents
+     * <p>An array of events that, when fired, should trigger this component to
+     * save its state (defaults to none). <code>stateEvents</code> may be any type
+     * of event supported by this component, including browser or custom events
+     * (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Mixed} autoEl
+     * <p>A tag name or {@link Ext.DomHelper DomHelper} spec used to create the {@link #getEl Element} which will
+     * encapsulate this Component.</p>
+     * <p>You do not normally need to specify this. For the base classes {@link Ext.Component}, {@link Ext.BoxComponent},
+     * and {@link Ext.Container}, this defaults to <b><tt>'div'</tt></b>. The more complex Ext classes use a more complex
+     * DOM structure created by their own onRender methods.</p>
+     * <p>This is intended to allow the developer to create application-specific utility Components encapsulated by
+     * different DOM elements. Example usage:</p><pre><code>
+{
+    xtype: 'box',
+    autoEl: {
+        tag: 'img',
+        src: 'http://www.example.com/example.jpg'
+    }
+}, {
+    xtype: 'box',
+    autoEl: {
+        tag: 'blockquote',
+        html: 'autoEl is cool!'
+    }
+}, {
+    xtype: 'container',
+    autoEl: 'ul',
+    cls: 'ux-unordered-list',
+    items: {
+        xtype: 'box',
+        autoEl: 'li',
+        html: 'First list item'
+    }
+}
+</code></pre>
+     */
+    autoEl : 'div',
+
+    /**
+     * @cfg {String} disabledClass
+     * CSS class added to the component when it is disabled (defaults to 'x-item-disabled').
+     */
+    disabledClass : 'x-item-disabled',
+    /**
+     * @cfg {Boolean} allowDomMove
+     * Whether the component can move the Dom node when rendering (defaults to true).
+     */
+    allowDomMove : true,
+    /**
+     * @cfg {Boolean} autoShow
+     * True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove
+     * them on render (defaults to false).
+     */
+    autoShow : false,
+    /**
+     * @cfg {String} hideMode
+     * <p>How this component should be hidden. Supported values are <tt>'visibility'</tt>
+     * (css visibility), <tt>'offsets'</tt> (negative offset position) and <tt>'display'</tt>
+     * (css display).</p>
+     * <br><p><b>Note</b>: the default of <tt>'display'</tt> is generally preferred
+     * since items are automatically laid out when they are first shown (no sizing
+     * is done while hidden).</p>
+     */
+    hideMode : 'display',
+    /**
+     * @cfg {Boolean} hideParent
+     * True to hide and show the component's container when hide/show is called on the component, false to hide
+     * and show the component itself (defaults to false).  For example, this can be used as a shortcut for a hide
+     * button on a window by setting hide:true on the button when adding it to its parent container.
+     */
+    hideParent : false,
+    /**
+     * <p>The {@link Ext.Element} which encapsulates this Component. Read-only.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the <code>{@link #autoEl}</code> config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link Ext.util.Observable#listeners listeners}
+     * config for a suggestion, or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * <p>See also <tt>{@link #getEl getEl}</p>
+     * @type Ext.Element
+     * @property el
+     */
+    /**
+     * This Component's owner {@link Ext.Container Container} (defaults to undefined, and is set automatically when
+     * this Component is added to a Container).  Read-only.
+     * <p><b>Note</b>: to access items within the Container see <tt>{@link #itemId}</tt>.</p>
+     * @type Ext.Container
+     * @property ownerCt
+     */
+    /**
+     * True if this component is hidden. Read-only.
+     * @type Boolean
+     * @property hidden
+     */
+    /**
+     * True if this component is disabled. Read-only.
+     * @type Boolean
+     * @property disabled
+     */
+    /**
+     * True if this component has been rendered. Read-only.
+     * @type Boolean
+     * @property rendered
+     */
+    rendered : false,
+
+    /**
+     * @cfg {String} contentEl
+     * <p>Optional. Specify an existing HTML element, or the <code>id</code> of an existing HTML element to use as the content
+     * for this component.</p>
+     * <ul>
+     * <li><b>Description</b> :
+     * <div class="sub-desc">This config option is used to take an existing HTML element and place it in the layout element
+     * of a new component (it simply moves the specified DOM element <i>after the Component is rendered</i> to use as the content.</div></li>
+     * <li><b>Notes</b> :
+     * <div class="sub-desc">The specified HTML element is appended to the layout element of the component <i>after any configured
+     * {@link #html HTML} has been inserted</i>, and so the document will not contain this element at the time the {@link #render} event is fired.</div>
+     * <div class="sub-desc">The specified HTML element used will not participate in any <code><b>{@link Ext.Container#layout layout}</b></code>
+     * scheme that the Component may use. It is just HTML. Layouts operate on child <code><b>{@link Ext.Container#items items}</b></code>.</div>
+     * <div class="sub-desc">Add either the <code>x-hidden</code> or the <code>x-hide-display</code> CSS class to
+     * prevent a brief flicker of the content before it is rendered to the panel.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {String/Object} html
+     * An HTML fragment, or a {@link Ext.DomHelper DomHelper} specification to use as the layout element
+     * content (defaults to ''). The HTML content is added after the component is rendered,
+     * so the document will not contain this HTML at the time the {@link #render} event is fired.
+     * This content is inserted into the body <i>before</i> any configured {@link #contentEl} is appended.
+     */
+
+    /**
+     * @cfg {Mixed} tpl
+     * An <bold>{@link Ext.Template}</bold>, <bold>{@link Ext.XTemplate}</bold>
+     * or an array of strings to form an Ext.XTemplate.
+     * Used in conjunction with the <code>{@link #data}</code> and
+     * <code>{@link #tplWriteMode}</code> configurations.
+     */
+
+    /**
+     * @cfg {String} tplWriteMode The Ext.(X)Template method to use when
+     * updating the content area of the Component. Defaults to <tt>'overwrite'</tt>
+     * (see <code>{@link Ext.XTemplate#overwrite}</code>).
+     */
+    tplWriteMode : 'overwrite',
+
+    /**
+     * @cfg {Mixed} data
+     * The initial set of data to apply to the <code>{@link #tpl}</code> to
+     * update the content area of the Component.
+     */
+    
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+
+    // private
+    ctype : 'Ext.Component',
+
+    // private
+    actionMode : 'el',
+
+    // private
+    getActionEl : function(){
+        return this[this.actionMode];
+    },
+
+    initPlugin : function(p){
+        if(p.ptype && !Ext.isFunction(p.init)){
+            p = Ext.ComponentMgr.createPlugin(p);
+        }else if(Ext.isString(p)){
+            p = Ext.ComponentMgr.createPlugin({
+                ptype: p
+            });
+        }
+        p.init(this);
+        return p;
+    },
+
+    /* // protected
+     * Function to be implemented by Component subclasses to be part of standard component initialization flow (it is empty by default).
+     * <pre><code>
+// Traditional constructor:
+Ext.Foo = function(config){
+    // call superclass constructor:
+    Ext.Foo.superclass.constructor.call(this, config);
+
+    this.addEvents({
+        // add events
+    });
+};
+Ext.extend(Ext.Foo, Ext.Bar, {
+   // class body
+}
+
+// initComponent replaces the constructor:
+Ext.Foo = Ext.extend(Ext.Bar, {
+    initComponent : function(){
+        // call superclass initComponent
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents({
+            // add events
+        });
+    }
+}
+</code></pre>
+     */
+    initComponent : function(){
+        /*
+         * this is double processing, however it allows people to be able to do
+         * Ext.apply(this, {
+         *     listeners: {
+         *         //here
+         *     }
+         * });
+         * MyClass.superclass.initComponent.call(this);
+         */
+        if(this.listeners){
+            this.on(this.listeners);
+            delete this.listeners;
+        }
+        this.enableBubble(this.bubbleEvents);
+    },
+
+    /**
+     * <p>Render this Component into the passed HTML element.</p>
+     * <p><b>If you are using a {@link Ext.Container Container} object to house this Component, then
+     * do not use the render method.</b></p>
+     * <p>A Container's child Components are rendered by that Container's
+     * {@link Ext.Container#layout layout} manager when the Container is first rendered.</p>
+     * <p>Certain layout managers allow dynamic addition of child components. Those that do
+     * include {@link Ext.layout.CardLayout}, {@link Ext.layout.AnchorLayout},
+     * {@link Ext.layout.FormLayout}, {@link Ext.layout.TableLayout}.</p>
+     * <p>If the Container is already rendered when a new child Component is added, you may need to call
+     * the Container's {@link Ext.Container#doLayout doLayout} to refresh the view which causes any
+     * unrendered child Components to be rendered. This is required so that you can add multiple
+     * child components if needed while only refreshing the layout once.</p>
+     * <p>When creating complex UIs, it is important to remember that sizing and positioning
+     * of child items is the responsibility of the Container's {@link Ext.Container#layout layout} manager.
+     * If you expect child items to be sized in response to user interactions, you must
+     * configure the Container with a layout manager which creates and manages the type of layout you
+     * have in mind.</p>
+     * <p><b>Omitting the Container's {@link Ext.Container#layout layout} config means that a basic
+     * layout manager is used which does nothing but render child components sequentially into the
+     * Container. No sizing or positioning will be performed in this situation.</b></p>
+     * @param {Element/HTMLElement/String} container (optional) The element this Component should be
+     * rendered into. If it is being created from existing markup, this should be omitted.
+     * @param {String/Number} position (optional) The element ID or DOM node index within the container <b>before</b>
+     * which this component will be inserted (defaults to appending to the end of the container)
+     */
+    render : function(container, position){
+        if(!this.rendered && this.fireEvent('beforerender', this) !== false){
+            if(!container && this.el){
+                this.el = Ext.get(this.el);
+                container = this.el.dom.parentNode;
+                this.allowDomMove = false;
+            }
+            this.container = Ext.get(container);
+            if(this.ctCls){
+                this.container.addClass(this.ctCls);
+            }
+            this.rendered = true;
+            if(position !== undefined){
+                if(Ext.isNumber(position)){
+                    position = this.container.dom.childNodes[position];
+                }else{
+                    position = Ext.getDom(position);
+                }
+            }
+            this.onRender(this.container, position || null);
+            if(this.autoShow){
+                this.el.removeClass(['x-hidden','x-hide-' + this.hideMode]);
+            }
+            if(this.cls){
+                this.el.addClass(this.cls);
+                delete this.cls;
+            }
+            if(this.style){
+                this.el.applyStyles(this.style);
+                delete this.style;
+            }
+            if(this.overCls){
+                this.el.addClassOnOver(this.overCls);
+            }
+            this.fireEvent('render', this);
+
+
+            // Populate content of the component with html, contentEl or
+            // a tpl.
+            var contentTarget = this.getContentTarget();
+            if (this.html){
+                contentTarget.update(Ext.DomHelper.markup(this.html));
+                delete this.html;
+            }
+            if (this.contentEl){
+                var ce = Ext.getDom(this.contentEl);
+                Ext.fly(ce).removeClass(['x-hidden', 'x-hide-display']);
+                contentTarget.appendChild(ce);
+            }
+            if (this.tpl) {
+                if (!this.tpl.compile) {
+                    this.tpl = new Ext.XTemplate(this.tpl);
+                }
+                if (this.data) {
+                    this.tpl[this.tplWriteMode](contentTarget, this.data);
+                    delete this.data;
+                }
+            }
+            this.afterRender(this.container);
+
+
+            if(this.hidden){
+                // call this so we don't fire initial hide events.
+                this.doHide();
+            }
+            if(this.disabled){
+                // pass silent so the event doesn't fire the first time.
+                this.disable(true);
+            }
+
+            if(this.stateful !== false){
+                this.initStateEvents();
+            }
+            this.fireEvent('afterrender', this);
+        }
+        return this;
+    },
+
+
+    /**
+     * Update the content area of a component.
+     * @param {Mixed} htmlOrData
+     * If this component has been configured with a template via the tpl config
+     * then it will use this argument as data to populate the template.
+     * If this component was not configured with a template, the components
+     * content area will be updated via Ext.Element update
+     * @param {Boolean} loadScripts
+     * (optional) Only legitimate when using the html configuration. Defaults to false
+     * @param {Function} callback
+     * (optional) Only legitimate when using the html configuration. Callback to execute when scripts have finished loading
+     */
+    update: function(htmlOrData, loadScripts, cb) {
+        var contentTarget = this.getContentTarget();
+        if (this.tpl && typeof htmlOrData !== "string") {
+            this.tpl[this.tplWriteMode](contentTarget, htmlOrData || {});
+        } else {
+            var html = Ext.isObject(htmlOrData) ? Ext.DomHelper.markup(htmlOrData) : htmlOrData;
+            contentTarget.update(html, loadScripts, cb);
+        }
+    },
+
+
+    /**
+     * @private
+     * Method to manage awareness of when components are added to their
+     * respective Container, firing an added event.
+     * References are established at add time rather than at render time.
+     * @param {Ext.Container} container Container which holds the component
+     * @param {number} pos Position at which the component was added
+     */
+    onAdded : function(container, pos) {
+        this.ownerCt = container;
+        this.initRef();
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * @private
+     * Method to manage awareness of when components are removed from their
+     * respective Container, firing an removed event. References are properly
+     * cleaned up after removing a component from its owning container.
+     */
+    onRemoved : function() {
+        this.removeRef();
+        this.fireEvent('removed', this, this.ownerCt);
+        delete this.ownerCt;
+    },
+
+    /**
+     * @private
+     * Method to establish a reference to a component.
+     */
+    initRef : function() {
+        /**
+         * @cfg {String} ref
+         * <p>A path specification, relative to the Component's <code>{@link #ownerCt}</code>
+         * specifying into which ancestor Container to place a named reference to this Component.</p>
+         * <p>The ancestor axis can be traversed by using '/' characters in the path.
+         * For example, to put a reference to a Toolbar Button into <i>the Panel which owns the Toolbar</i>:</p><pre><code>
+var myGrid = new Ext.grid.EditorGridPanel({
+    title: 'My EditorGridPanel',
+    store: myStore,
+    colModel: myColModel,
+    tbar: [{
+        text: 'Save',
+        handler: saveChanges,
+        disabled: true,
+        ref: '../saveButton'
+    }],
+    listeners: {
+        afteredit: function() {
+//          The button reference is in the GridPanel
+            myGrid.saveButton.enable();
+        }
+    }
+});
+</code></pre>
+         * <p>In the code above, if the <code>ref</code> had been <code>'saveButton'</code>
+         * the reference would have been placed into the Toolbar. Each '/' in the <code>ref</code>
+         * moves up one level from the Component's <code>{@link #ownerCt}</code>.</p>
+         * <p>Also see the <code>{@link #added}</code> and <code>{@link #removed}</code> events.</p>
+         */
+        if(this.ref && !this.refOwner){
+            var levels = this.ref.split('/'),
+                last = levels.length,
+                i = 0,
+                t = this;
+
+            while(t && i < last){
+                t = t.ownerCt;
+                ++i;
+            }
+            if(t){
+                t[this.refName = levels[--i]] = this;
+                /**
+                 * @type Ext.Container
+                 * @property refOwner
+                 * The ancestor Container into which the {@link #ref} reference was inserted if this Component
+                 * is a child of a Container, and has been configured with a <code>ref</code>.
+                 */
+                this.refOwner = t;
+            }
+        }
+    },
+
+    removeRef : function() {
+        if (this.refOwner && this.refName) {
+            delete this.refOwner[this.refName];
+            delete this.refOwner;
+        }
+    },
+
+    // private
+    initState : function(){
+        if(Ext.state.Manager){
+            var id = this.getStateId();
+            if(id){
+                var state = Ext.state.Manager.get(id);
+                if(state){
+                    if(this.fireEvent('beforestaterestore', this, state) !== false){
+                        this.applyState(Ext.apply({}, state));
+                        this.fireEvent('staterestore', this, state);
+                    }
+                }
+            }
+        }
+    },
+
+    // private
+    getStateId : function(){
+        return this.stateId || ((/^(ext-comp-|ext-gen)/).test(String(this.id)) ? null : this.id);
+    },
+
+    // private
+    initStateEvents : function(){
+        if(this.stateEvents){
+            for(var i = 0, e; e = this.stateEvents[i]; i++){
+                this.on(e, this.saveState, this, {delay:100});
+            }
+        }
+    },
+
+    // private
+    applyState : function(state){
+        if(state){
+            Ext.apply(this, state);
+        }
+    },
+
+    // private
+    getState : function(){
+        return null;
+    },
+
+    // private
+    saveState : function(){
+        if(Ext.state.Manager && this.stateful !== false){
+            var id = this.getStateId();
+            if(id){
+                var state = this.getState();
+                if(this.fireEvent('beforestatesave', this, state) !== false){
+                    Ext.state.Manager.set(id, state);
+                    this.fireEvent('statesave', this, state);
+                }
+            }
+        }
+    },
+
+    /**
+     * Apply this component to existing markup that is valid. With this function, no call to render() is required.
+     * @param {String/HTMLElement} el
+     */
+    applyToMarkup : function(el){
+        this.allowDomMove = false;
+        this.el = Ext.get(el);
+        this.render(this.el.dom.parentNode);
+    },
+
+    /**
+     * Adds a CSS class to the component's underlying element.
+     * @param {string} cls The CSS class name to add
+     * @return {Ext.Component} this
+     */
+    addClass : function(cls){
+        if(this.el){
+            this.el.addClass(cls);
+        }else{
+            this.cls = this.cls ? this.cls + ' ' + cls : cls;
+        }
+        return this;
+    },
+
+    /**
+     * Removes a CSS class from the component's underlying element.
+     * @param {string} cls The CSS class name to remove
+     * @return {Ext.Component} this
+     */
+    removeClass : function(cls){
+        if(this.el){
+            this.el.removeClass(cls);
+        }else if(this.cls){
+            this.cls = this.cls.split(' ').remove(cls).join(' ');
+        }
+        return this;
+    },
+
+    // private
+    // default function is not really useful
+    onRender : function(ct, position){
+        if(!this.el && this.autoEl){
+            if(Ext.isString(this.autoEl)){
+                this.el = document.createElement(this.autoEl);
+            }else{
+                var div = document.createElement('div');
+                Ext.DomHelper.overwrite(div, this.autoEl);
+                this.el = div.firstChild;
+            }
+            if (!this.el.id) {
+                this.el.id = this.getId();
+            }
+        }
+        if(this.el){
+            this.el = Ext.get(this.el);
+            if(this.allowDomMove !== false){
+                ct.dom.insertBefore(this.el.dom, position);
+                if (div) {
+                    Ext.removeNode(div);
+                    div = null;
+                }
+            }
+        }
+    },
+
+    // private
+    getAutoCreate : function(){
+        var cfg = Ext.isObject(this.autoCreate) ?
+                      this.autoCreate : Ext.apply({}, this.defaultAutoCreate);
+        if(this.id && !cfg.id){
+            cfg.id = this.id;
+        }
+        return cfg;
+    },
+
+    // private
+    afterRender : Ext.emptyFn,
+
+    /**
+     * Destroys this component by purging any event listeners, removing the component's element from the DOM,
+     * removing the component from its {@link Ext.Container} (if applicable) and unregistering it from
+     * {@link Ext.ComponentMgr}.  Destruction is generally handled automatically by the framework and this method
+     * should usually not need to be called directly.
+     *
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.fireEvent('beforedestroy', this) !== false){
+                this.destroying = true;
+                this.beforeDestroy();
+                if(this.ownerCt && this.ownerCt.remove){
+                    this.ownerCt.remove(this, false);
+                }
+                if(this.rendered){
+                    this.el.remove();
+                    if(this.actionMode == 'container' || this.removeMode == 'container'){
+                        this.container.remove();
+                    }
+                }
+                // Stop any buffered tasks
+                if(this.focusTask && this.focusTask.cancel){
+                    this.focusTask.cancel();
+                }
+                this.onDestroy();
+                Ext.ComponentMgr.unregister(this);
+                this.fireEvent('destroy', this);
+                this.purgeListeners();
+                this.destroying = false;
+                this.isDestroyed = true;
+            }
+        }
+    },
+
+    deleteMembers : function(){
+        var args = arguments;
+        for(var i = 0, len = args.length; i < len; ++i){
+            delete this[args[i]];
+        }
+    },
+
+    // private
+    beforeDestroy : Ext.emptyFn,
+
+    // private
+    onDestroy  : Ext.emptyFn,
+
+    /**
+     * <p>Returns the {@link Ext.Element} which encapsulates this Component.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the {@link #autoEl} config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link #listeners} config for a suggestion,
+     * or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * @return {Ext.Element} The Element which encapsulates this Component.
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the <code>id</code> of this component or automatically generates and
+     * returns an <code>id</code> if an <code>id</code> is not defined yet:<pre><code>
+     * 'ext-comp-' + (++Ext.Component.AUTO_ID)
+     * </code></pre>
+     * @return {String} id
+     */
+    getId : function(){
+        return this.id || (this.id = 'ext-comp-' + (++Ext.Component.AUTO_ID));
+    },
+
+    /**
+     * Returns the <code>{@link #itemId}</code> of this component.  If an
+     * <code>{@link #itemId}</code> was not assigned through configuration the
+     * <code>id</code> is returned using <code>{@link #getId}</code>.
+     * @return {String}
+     */
+    getItemId : function(){
+        return this.itemId || this.getId();
+    },
+
+    /**
+     * Try to focus this component.
+     * @param {Boolean} selectText (optional) If applicable, true to also select the text in this component
+     * @param {Boolean/Number} delay (optional) Delay the focus this number of milliseconds (true for 10 milliseconds)
+     * @return {Ext.Component} this
+     */
+    focus : function(selectText, delay){
+        if(delay){
+            this.focusTask = new Ext.util.DelayedTask(this.focus, this, [selectText, false]);
+            this.focusTask.delay(Ext.isNumber(delay) ? delay : 10);
+            return this;
+        }
+        if(this.rendered && !this.isDestroyed){
+            this.el.focus();
+            if(selectText === true){
+                this.el.dom.select();
+            }
+        }
+        return this;
+    },
+
+    // private
+    blur : function(){
+        if(this.rendered){
+            this.el.blur();
+        }
+        return this;
+    },
+
+    /**
+     * Disable this component and fire the 'disable' event.
+     * @return {Ext.Component} this
+     */
+    disable : function(/* private */ silent){
+        if(this.rendered){
+            this.onDisable();
+        }
+        this.disabled = true;
+        if(silent !== true){
+            this.fireEvent('disable', this);
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.getActionEl().addClass(this.disabledClass);
+        this.el.dom.disabled = true;
+    },
+
+    /**
+     * Enable this component and fire the 'enable' event.
+     * @return {Ext.Component} this
+     */
+    enable : function(){
+        if(this.rendered){
+            this.onEnable();
+        }
+        this.disabled = false;
+        this.fireEvent('enable', this);
+        return this;
+    },
+
+    // private
+    onEnable : function(){
+        this.getActionEl().removeClass(this.disabledClass);
+        this.el.dom.disabled = false;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     * @return {Ext.Component} this
+     */
+    setDisabled : function(disabled){
+        return this[disabled ? 'disable' : 'enable']();
+    },
+
+    /**
+     * Show this component.  Listen to the '{@link #beforeshow}' event and return
+     * <tt>false</tt> to cancel showing the component.  Fires the '{@link #show}'
+     * event after showing the component.
+     * @return {Ext.Component} this
+     */
+    show : function(){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.hidden = false;
+            if(this.autoRender){
+                this.render(Ext.isBoolean(this.autoRender) ? Ext.getBody() : this.autoRender);
+            }
+            if(this.rendered){
+                this.onShow();
+            }
+            this.fireEvent('show', this);
+        }
+        return this;
+    },
+
+    // private
+    onShow : function(){
+        this.getVisibilityEl().removeClass('x-hide-' + this.hideMode);
+    },
+
+    /**
+     * Hide this component.  Listen to the '{@link #beforehide}' event and return
+     * <tt>false</tt> to cancel hiding the component.  Fires the '{@link #hide}'
+     * event after hiding the component. Note this method is called internally if
+     * the component is configured to be <code>{@link #hidden}</code>.
+     * @return {Ext.Component} this
+     */
+    hide : function(){
+        if(this.fireEvent('beforehide', this) !== false){
+            this.doHide();
+            this.fireEvent('hide', this);
+        }
+        return this;
+    },
+
+    // private
+    doHide: function(){
+        this.hidden = true;
+        if(this.rendered){
+            this.onHide();
+        }
+    },
+
+    // private
+    onHide : function(){
+        this.getVisibilityEl().addClass('x-hide-' + this.hideMode);
+    },
+
+    // private
+    getVisibilityEl : function(){
+        return this.hideParent ? this.container : this.getActionEl();
+    },
+
+    /**
+     * Convenience function to hide or show this component by boolean.
+     * @param {Boolean} visible True to show, false to hide
+     * @return {Ext.Component} this
+     */
+    setVisible : function(visible){
+        return this[visible ? 'show' : 'hide']();
+    },
+
+    /**
+     * Returns true if this component is visible.
+     * @return {Boolean} True if this component is visible, false otherwise.
+     */
+    isVisible : function(){
+        return this.rendered && this.getVisibilityEl().isVisible();
+    },
+
+    /**
+     * Clone the current component using the original config values passed into this instance by default.
+     * @param {Object} overrides A new config containing any properties to override in the cloned version.
+     * An id property can be passed on this object, otherwise one will be generated to avoid duplicates.
+     * @return {Ext.Component} clone The cloned copy of this component
+     */
+    cloneConfig : function(overrides){
+        overrides = overrides || {};
+        var id = overrides.id || Ext.id();
+        var cfg = Ext.applyIf(overrides, this.initialConfig);
+        cfg.id = id; // prevent dup id
+        return new this.constructor(cfg);
+    },
+
+    /**
+     * Gets the xtype for this component as registered with {@link Ext.ComponentMgr}. For a list of all
+     * available xtypes, see the {@link Ext.Component} header. Example usage:
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXType());  // alerts 'textfield'
+</code></pre>
+     * @return {String} The xtype
+     */
+    getXType : function(){
+        return this.constructor.xtype;
+    },
+
+    /**
+     * <p>Tests whether or not this Component is of a specific xtype. This can test whether this Component is descended
+     * from the xtype (default) or whether it is directly of the xtype specified (shallow = true).</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>For a list of all available xtypes, see the {@link Ext.Component} header.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+var isText = t.isXType('textfield');        // true
+var isBoxSubclass = t.isXType('box');       // true, descended from BoxComponent
+var isBoxInstance = t.isXType('box', true); // false, not a direct BoxComponent instance
+</code></pre>
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * <pre><code>
+var c = new Ext.Component();
+console.log(c.isXType(c));
+console.log(c.isXType(Ext.Component)); 
+</code></pre>
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Boolean} True if this component descends from the specified xtype, false otherwise.
+     */
+    isXType : function(xtype, shallow){
+        //assume a string by default
+        if (Ext.isFunction(xtype)){
+            xtype = xtype.xtype; //handle being passed the class, e.g. Ext.Component
+        }else if (Ext.isObject(xtype)){
+            xtype = xtype.constructor.xtype; //handle being passed an instance
+        }
+
+        return !shallow ? ('/' + this.getXTypes() + '/').indexOf('/' + xtype + '/') != -1 : this.constructor.xtype == xtype;
+    },
+
+    /**
+     * <p>Returns this Component's xtype hierarchy as a slash-delimited string. For a list of all
+     * available xtypes, see the {@link Ext.Component} header.</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXTypes());  // alerts 'component/box/field/textfield'
+</code></pre>
+     * @return {String} The xtype hierarchy string
+     */
+    getXTypes : function(){
+        var tc = this.constructor;
+        if(!tc.xtypes){
+            var c = [], sc = this;
+            while(sc && sc.constructor.xtype){
+                c.unshift(sc.constructor.xtype);
+                sc = sc.constructor.superclass;
+            }
+            tc.xtypeChain = c;
+            tc.xtypes = c.join('/');
+        }
+        return tc.xtypes;
+    },
+
+    /**
+     * Find a container above this component at any level by a custom function. If the passed function returns
+     * true, the container will be returned.
+     * @param {Function} fn The custom function to call with the arguments (container, this component).
+     * @return {Ext.Container} The first Container for which the custom function returns true
+     */
+    findParentBy : function(fn) {
+        for (var p = this.ownerCt; (p != null) && !fn(p, this); p = p.ownerCt);
+        return p || null;
+    },
+
+    /**
+     * Find a container above this component at any level by xtype or class
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Ext.Container} The first Container which matches the given xtype or class
+     */
+    findParentByType : function(xtype, shallow){
+        return this.findParentBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+    
+    /**
+     * Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current node)
+     * @param {Array} args (optional) The args to call the function with (default to passing the current component)
+     * @return {Ext.Component} this
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.ownerCt;
+        }
+        return this;
+    },
+
+    // protected
+    getPositionEl : function(){
+        return this.positionEl || this.el;
+    },
+
+    // private
+    purgeListeners : function(){
+        Ext.Component.superclass.purgeListeners.call(this);
+        if(this.mons){
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    // private
+    clearMons : function(){
+        Ext.each(this.mons, function(m){
+            m.item.un(m.ename, m.fn, m.scope);
+        }, this);
+        this.mons = [];
+    },
+
+    // private
+    createMons: function(){
+        if(!this.mons){
+            this.mons = [];
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    /**
+     * <p>Adds listeners to any Observable object (or Elements) which are automatically removed when this Component
+     * is destroyed. Usage:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), 'selectionchange', handleSelectionChange, null, {buffer: 50});
+</pre></code>
+     * <p>or:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), {
+    selectionchange: handleSelectionChange,
+    buffer: 50
+});
+</pre></code>
+     * @param {Observable|Element} item The item to which to add a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     * @param {Object} opt Optional. If the <code>ename</code> parameter was an event name, this
+     * is the {@link Ext.util.Observable#addListener addListener} options.
+     */
+    mon : function(item, ename, fn, scope, opt){
+        this.createMons();
+        if(Ext.isObject(ename)){
+            var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
+
+            var o = ename;
+            for(var e in o){
+                if(propRe.test(e)){
+                    continue;
+                }
+                if(Ext.isFunction(o[e])){
+                    // shared options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e], o.scope, o);
+                }else{
+                    // individual options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e]);
+                }
+            }
+            return;
+        }
+
+        this.mons.push({
+            item: item, ename: ename, fn: fn, scope: scope
+        });
+        item.on(ename, fn, scope, opt);
+    },
+
+    /**
+     * Removes listeners that were added by the {@link #mon} method.
+     * @param {Observable|Element} item The item from which to remove a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     */
+    mun : function(item, ename, fn, scope){
+        var found, mon;
+        this.createMons();
+        for(var i = 0, len = this.mons.length; i < len; ++i){
+            mon = this.mons[i];
+            if(item === mon.item && ename == mon.ename && fn === mon.fn && scope === mon.scope){
+                this.mons.splice(i, 1);
+                item.un(ename, fn, scope);
+                found = true;
+                break;
+            }
+        }
+        return found;
+    },
+
+    /**
+     * Returns the next component in the owning container
+     * @return Ext.Component
+     */
+    nextSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index != -1 && index+1 < this.ownerCt.items.getCount()){
+                return this.ownerCt.items.itemAt(index+1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the previous component in the owning container
+     * @return Ext.Component
+     */
+    previousSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index > 0){
+                return this.ownerCt.items.itemAt(index-1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Provides the link for Observable's fireEvent method to bubble up the ownership hierarchy.
+     * @return {Ext.Container} the Container which owns this Component.
+     */
+    getBubbleTarget : function(){
+        return this.ownerCt;
+    }
+});
+
+Ext.reg('component', Ext.Component);
+/**
+ * @class Ext.Action
+ * <p>An Action is a piece of reusable functionality that can be abstracted out of any particular component so that it
+ * can be usefully shared among multiple components.  Actions let you share handlers, configuration options and UI
+ * updates across any components that support the Action interface (primarily {@link Ext.Toolbar}, {@link Ext.Button}
+ * and {@link Ext.menu.Menu} components).</p>
+ * <p>Aside from supporting the config object interface, any component that needs to use Actions must also support
+ * the following method list, as these will be called as needed by the Action class: setText(string), setIconCls(string),
+ * setDisabled(boolean), setVisible(boolean) and setHandler(function).</p>
+ * Example usage:<br>
+ * <pre><code>
+// Define the shared action.  Each component below will have the same
+// display text and icon, and will display the same message on click.
+var action = new Ext.Action({
+    {@link #text}: 'Do something',
+    {@link #handler}: function(){
+        Ext.Msg.alert('Click', 'You did something.');
+    },
+    {@link #iconCls}: 'do-something',
+    {@link #itemId}: 'myAction'
+});
+
+var panel = new Ext.Panel({
+    title: 'Actions',
+    width: 500,
+    height: 300,
+    tbar: [
+        // Add the action directly to a toolbar as a menu button
+        action,
+        {
+            text: 'Action Menu',
+            // Add the action to a menu as a text item
+            menu: [action]
+        }
+    ],
+    items: [
+        // Add the action to the panel body as a standard button
+        new Ext.Button(action)
+    ],
+    renderTo: Ext.getBody()
+});
+
+// Change the text for all components using the action
+action.setText('Something else');
+
+// Reference an action through a container using the itemId
+var btn = panel.getComponent('myAction');
+var aRef = btn.baseAction;
+aRef.setText('New text');
+</code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.Action = Ext.extend(Object, {
+    /**
+     * @cfg {String} text The text to set for all components using this action (defaults to '').
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon for
+     * all components using this action (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'do-something'
+
+// css class that specifies background image to be used as the icon image:
+.do-something { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled True to disable all components using this action, false to enable them (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} hidden True to hide all components using this action, false to show them (defaults to false).
+     */
+    /**
+     * @cfg {Function} handler The function that will be invoked by each component tied to this action
+     * when the component's primary event is triggered (defaults to undefined).
+     */
+    /**
+     * @cfg {String} itemId
+     * See {@link Ext.Component}.{@link Ext.Component#itemId itemId}.
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> is executed. Defaults to this Button.
+     */
+
+    constructor : function(config){
+        this.initialConfig = config;
+        this.itemId = config.itemId = (config.itemId || config.id || Ext.id());
+        this.items = [];
+    },
+    
+    // private
+    isAction : true,
+
+    /**
+     * Sets the text to be displayed by all components using this action.
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.initialConfig.text = text;
+        this.callEach('setText', [text]);
+    },
+
+    /**
+     * Gets the text currently displayed by all components using this action.
+     */
+    getText : function(){
+        return this.initialConfig.text;
+    },
+
+    /**
+     * Sets the icon CSS class for all components using this action.  The class should supply
+     * a background image that will be used as the icon image.
+     * @param {String} cls The CSS class supplying the icon image
+     */
+    setIconClass : function(cls){
+        this.initialConfig.iconCls = cls;
+        this.callEach('setIconClass', [cls]);
+    },
+
+    /**
+     * Gets the icon CSS class currently used by all components using this action.
+     */
+    getIconClass : function(){
+        return this.initialConfig.iconCls;
+    },
+
+    /**
+     * Sets the disabled state of all components using this action.  Shortcut method
+     * for {@link #enable} and {@link #disable}.
+     * @param {Boolean} disabled True to disable the component, false to enable it
+     */
+    setDisabled : function(v){
+        this.initialConfig.disabled = v;
+        this.callEach('setDisabled', [v]);
+    },
+
+    /**
+     * Enables all components using this action.
+     */
+    enable : function(){
+        this.setDisabled(false);
+    },
+
+    /**
+     * Disables all components using this action.
+     */
+    disable : function(){
+        this.setDisabled(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently disabled, else returns false.  
+     */
+    isDisabled : function(){
+        return this.initialConfig.disabled;
+    },
+
+    /**
+     * Sets the hidden state of all components using this action.  Shortcut method
+     * for <code>{@link #hide}</code> and <code>{@link #show}</code>.
+     * @param {Boolean} hidden True to hide the component, false to show it
+     */
+    setHidden : function(v){
+        this.initialConfig.hidden = v;
+        this.callEach('setVisible', [!v]);
+    },
+
+    /**
+     * Shows all components using this action.
+     */
+    show : function(){
+        this.setHidden(false);
+    },
+
+    /**
+     * Hides all components using this action.
+     */
+    hide : function(){
+        this.setHidden(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently hidden, else returns false.  
+     */
+    isHidden : function(){
+        return this.initialConfig.hidden;
+    },
+
+    /**
+     * Sets the function that will be called by each Component using this action when its primary event is triggered.
+     * @param {Function} fn The function that will be invoked by the action's components.  The function
+     * will be called with no arguments.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed. Defaults to the Component firing the event.
+     */
+    setHandler : function(fn, scope){
+        this.initialConfig.handler = fn;
+        this.initialConfig.scope = scope;
+        this.callEach('setHandler', [fn, scope]);
+    },
+
+    /**
+     * Executes the specified function once for each Component currently tied to this action.  The function passed
+     * in should accept a single argument that will be an object that supports the basic Action config/method interface.
+     * @param {Function} fn The function to execute for each component
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed.  Defaults to the Component.
+     */
+    each : function(fn, scope){
+        Ext.each(this.items, fn, scope);
+    },
+
+    // private
+    callEach : function(fnName, args){
+        var cs = this.items;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i][fnName].apply(cs[i], args);
+        }
+    },
+
+    // private
+    addComponent : function(comp){
+        this.items.push(comp);
+        comp.on('destroy', this.removeComponent, this);
+    },
+
+    // private
+    removeComponent : function(comp){
+        this.items.remove(comp);
+    },
+
+    /**
+     * Executes this action manually using the handler function specified in the original config object
+     * or the handler function set with <code>{@link #setHandler}</code>.  Any arguments passed to this
+     * function will be passed on to the handler function.
+     * @param {Mixed} arg1 (optional) Variable number of arguments passed to the handler function
+     * @param {Mixed} arg2 (optional)
+     * @param {Mixed} etc... (optional)
+     */
+    execute : function(){
+        this.initialConfig.handler.apply(this.initialConfig.scope || window, arguments);
+    }
+});
+/**
+ * @class Ext.Layer
+ * @extends Ext.Element
+ * An extended {@link Ext.Element} object that supports a shadow and shim, constrain to viewport and
+ * automatic maintaining of shadow/shim positions.
+ * @cfg {Boolean} shim False to disable the iframe shim in browsers which need one (defaults to true)
+ * @cfg {String/Boolean} shadow True to automatically create an {@link Ext.Shadow}, or a string indicating the
+ * shadow's display {@link Ext.Shadow#mode}. False to disable the shadow. (defaults to false)
+ * @cfg {Object} dh DomHelper object config to create element with (defaults to {tag: 'div', cls: 'x-layer'}).
+ * @cfg {Boolean} constrain False to disable constrain to viewport (defaults to true)
+ * @cfg {String} cls CSS class to add to the element
+ * @cfg {Number} zindex Starting z-index (defaults to 11000)
+ * @cfg {Number} shadowOffset Number of pixels to offset the shadow (defaults to 4)
+ * @cfg {Boolean} useDisplay
+ * Defaults to use css offsets to hide the Layer. Specify <tt>true</tt>
+ * to use css style <tt>'display:none;'</tt> to hide the Layer.
+ * @constructor
+ * @param {Object} config An object with config options.
+ * @param {String/HTMLElement} existingEl (optional) Uses an existing DOM element. If the element is not found it creates it.
+ */
+(function(){
+Ext.Layer = function(config, existingEl){
+    config = config || {};
+    var dh = Ext.DomHelper,
+        cp = config.parentEl, pel = cp ? Ext.getDom(cp) : document.body;
+        
+    if (existingEl) {
+        this.dom = Ext.getDom(existingEl);
+    }
+    if(!this.dom){
+        var o = config.dh || {tag: 'div', cls: 'x-layer'};
+        this.dom = dh.append(pel, o);
+    }
+    if(config.cls){
+        this.addClass(config.cls);
+    }
+    this.constrain = config.constrain !== false;
+    this.setVisibilityMode(Ext.Element.VISIBILITY);
+    if(config.id){
+        this.id = this.dom.id = config.id;
+    }else{
+        this.id = Ext.id(this.dom);
+    }
+    this.zindex = config.zindex || this.getZIndex();
+    this.position('absolute', this.zindex);
+    if(config.shadow){
+        this.shadowOffset = config.shadowOffset || 4;
+        this.shadow = new Ext.Shadow({
+            offset : this.shadowOffset,
+            mode : config.shadow
+        });
+    }else{
+        this.shadowOffset = 0;
+    }
+    this.useShim = config.shim !== false && Ext.useShims;
+    this.useDisplay = config.useDisplay;
+    this.hide();
+};
+
+var supr = Ext.Element.prototype;
+
+// shims are shared among layer to keep from having 100 iframes
+var shims = [];
+
+Ext.extend(Ext.Layer, Ext.Element, {
+
+    getZIndex : function(){
+        return this.zindex || parseInt((this.getShim() || this).getStyle('z-index'), 10) || 11000;
+    },
+
+    getShim : function(){
+        if(!this.useShim){
+            return null;
+        }
+        if(this.shim){
+            return this.shim;
+        }
+        var shim = shims.shift();
+        if(!shim){
+            shim = this.createShim();
+            shim.enableDisplayMode('block');
+            shim.dom.style.display = 'none';
+            shim.dom.style.visibility = 'visible';
+        }
+        var pn = this.dom.parentNode;
+        if(shim.dom.parentNode != pn){
+            pn.insertBefore(shim.dom, this.dom);
+        }
+        shim.setStyle('z-index', this.getZIndex()-2);
+        this.shim = shim;
+        return shim;
+    },
+
+    hideShim : function(){
+        if(this.shim){
+            this.shim.setDisplayed(false);
+            shims.push(this.shim);
+            delete this.shim;
+        }
+    },
+
+    disableShadow : function(){
+        if(this.shadow){
+            this.shadowDisabled = true;
+            this.shadow.hide();
+            this.lastShadowOffset = this.shadowOffset;
+            this.shadowOffset = 0;
+        }
+    },
+
+    enableShadow : function(show){
+        if(this.shadow){
+            this.shadowDisabled = false;
+            if(Ext.isDefined(this.lastShadowOffset)) {
+                this.shadowOffset = this.lastShadowOffset;
+                delete this.lastShadowOffset;
+            }
+            if(show){
+                this.sync(true);
+            }
+        }
+    },
+
+    // private
+    // this code can execute repeatedly in milliseconds (i.e. during a drag) so
+    // code size was sacrificed for effeciency (e.g. no getBox/setBox, no XY calls)
+    sync : function(doShow){
+        var shadow = this.shadow;
+        if(!this.updating && this.isVisible() && (shadow || this.useShim)){
+            var shim = this.getShim(),
+                w = this.getWidth(),
+                h = this.getHeight(),
+                l = this.getLeft(true),
+                t = this.getTop(true);
+
+            if(shadow && !this.shadowDisabled){
+                if(doShow && !shadow.isVisible()){
+                    shadow.show(this);
+                }else{
+                    shadow.realign(l, t, w, h);
+                }
+                if(shim){
+                    if(doShow){
+                       shim.show();
+                    }
+                    // fit the shim behind the shadow, so it is shimmed too
+                    var shadowAdj = shadow.el.getXY(), shimStyle = shim.dom.style,
+                        shadowSize = shadow.el.getSize();
+                    shimStyle.left = (shadowAdj[0])+'px';
+                    shimStyle.top = (shadowAdj[1])+'px';
+                    shimStyle.width = (shadowSize.width)+'px';
+                    shimStyle.height = (shadowSize.height)+'px';
+                }
+            }else if(shim){
+                if(doShow){
+                   shim.show();
+                }
+                shim.setSize(w, h);
+                shim.setLeftTop(l, t);
+            }
+        }
+    },
+
+    // private
+    destroy : function(){
+        this.hideShim();
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.removeAllListeners();
+        Ext.removeNode(this.dom);
+        delete this.dom;
+    },
+
+    remove : function(){
+        this.destroy();
+    },
+
+    // private
+    beginUpdate : function(){
+        this.updating = true;
+    },
+
+    // private
+    endUpdate : function(){
+        this.updating = false;
+        this.sync(true);
+    },
+
+    // private
+    hideUnders : function(negOffset){
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.hideShim();
+    },
+
+    // private
+    constrainXY : function(){
+        if(this.constrain){
+            var vw = Ext.lib.Dom.getViewWidth(),
+                vh = Ext.lib.Dom.getViewHeight();
+            var s = Ext.getDoc().getScroll();
+
+            var xy = this.getXY();
+            var x = xy[0], y = xy[1];
+            var so = this.shadowOffset;
+            var w = this.dom.offsetWidth+so, h = this.dom.offsetHeight+so;
+            // only move it if it needs it
+            var moved = false;
+            // first validate right/bottom
+            if((x + w) > vw+s.left){
+                x = vw - w - so;
+                moved = true;
+            }
+            if((y + h) > vh+s.top){
+                y = vh - h - so;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < s.left){
+                x = s.left;
+                moved = true;
+            }
+            if(y < s.top){
+                y = s.top;
+                moved = true;
+            }
+            if(moved){
+                if(this.avoidY){
+                    var ay = this.avoidY;
+                    if(y <= ay && (y+h) >= ay){
+                        y = ay-h-5;
+                    }
+                }
+                xy = [x, y];
+                this.storeXY(xy);
+                supr.setXY.call(this, xy);
+                this.sync();
+            }
+        }
+        return this;
+    },
+    
+    getConstrainOffset : function(){
+        return this.shadowOffset;    
+    },
+
+    isVisible : function(){
+        return this.visible;
+    },
+
+    // private
+    showAction : function(){
+        this.visible = true; // track visibility to prevent getStyle calls
+        if(this.useDisplay === true){
+            this.setDisplayed('');
+        }else if(this.lastXY){
+            supr.setXY.call(this, this.lastXY);
+        }else if(this.lastLT){
+            supr.setLeftTop.call(this, this.lastLT[0], this.lastLT[1]);
+        }
+    },
+
+    // private
+    hideAction : function(){
+        this.visible = false;
+        if(this.useDisplay === true){
+            this.setDisplayed(false);
+        }else{
+            this.setLeftTop(-10000,-10000);
+        }
+    },
+
+    // overridden Element method
+    setVisible : function(v, a, d, c, e){
+        if(v){
+            this.showAction();
+        }
+        if(a && v){
+            var cb = function(){
+                this.sync(true);
+                if(c){
+                    c();
+                }
+            }.createDelegate(this);
+            supr.setVisible.call(this, true, true, d, cb, e);
+        }else{
+            if(!v){
+                this.hideUnders(true);
+            }
+            var cb = c;
+            if(a){
+                cb = function(){
+                    this.hideAction();
+                    if(c){
+                        c();
+                    }
+                }.createDelegate(this);
+            }
+            supr.setVisible.call(this, v, a, d, cb, e);
+            if(v){
+                this.sync(true);
+            }else if(!a){
+                this.hideAction();
+            }
+        }
+        return this;
+    },
+
+    storeXY : function(xy){
+        delete this.lastLT;
+        this.lastXY = xy;
+    },
+
+    storeLeftTop : function(left, top){
+        delete this.lastXY;
+        this.lastLT = [left, top];
+    },
+
+    // private
+    beforeFx : function(){
+        this.beforeAction();
+        return Ext.Layer.superclass.beforeFx.apply(this, arguments);
+    },
+
+    // private
+    afterFx : function(){
+        Ext.Layer.superclass.afterFx.apply(this, arguments);
+        this.sync(this.isVisible());
+    },
+
+    // private
+    beforeAction : function(){
+        if(!this.updating && this.shadow){
+            this.shadow.hide();
+        }
+    },
+
+    // overridden Element method
+    setLeft : function(left){
+        this.storeLeftTop(left, this.getTop(true));
+        supr.setLeft.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setTop : function(top){
+        this.storeLeftTop(this.getLeft(true), top);
+        supr.setTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setLeftTop : function(left, top){
+        this.storeLeftTop(left, top);
+        supr.setLeftTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setXY : function(xy, a, d, c, e){
+        this.fixDisplay();
+        this.beforeAction();
+        this.storeXY(xy);
+        var cb = this.createCB(c);
+        supr.setXY.call(this, xy, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // private
+    createCB : function(c){
+        var el = this;
+        return function(){
+            el.constrainXY();
+            el.sync(true);
+            if(c){
+                c();
+            }
+        };
+    },
+
+    // overridden Element method
+    setX : function(x, a, d, c, e){
+        this.setXY([x, this.getY()], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setY : function(y, a, d, c, e){
+        this.setXY([this.getX(), y], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setSize : function(w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setSize.call(this, w, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setWidth : function(w, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setWidth.call(this, w, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setHeight : function(h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setHeight.call(this, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setBounds : function(x, y, w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        if(!a){
+            this.storeXY([x, y]);
+            supr.setXY.call(this, [x, y]);
+            supr.setSize.call(this, w, h, a, d, cb, e);
+            cb();
+        }else{
+            supr.setBounds.call(this, x, y, w, h, a, d, cb, e);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the z-index of this layer and adjusts any shadow and shim z-indexes. The layer z-index is automatically
+     * incremented by two more than the value passed in so that it always shows above any shadow or shim (the shadow
+     * element, if any, will be assigned z-index + 1, and the shim element, if any, will be assigned the unmodified z-index).
+     * @param {Number} zindex The new z-index to set
+     * @return {this} The Layer
+     */
+    setZIndex : function(zindex){
+        this.zindex = zindex;
+        this.setStyle('z-index', zindex + 2);
+        if(this.shadow){
+            this.shadow.setZIndex(zindex + 1);
+        }
+        if(this.shim){
+            this.shim.setStyle('z-index', zindex);
+        }
+        return this;
+    }
+});
+})();
+/**
+ * @class Ext.Shadow
+ * Simple class that can provide a shadow effect for any element.  Note that the element MUST be absolutely positioned,
+ * and the shadow does not provide any shimming.  This should be used only in simple cases -- for more advanced
+ * functionality that can also provide the same shadow effect, see the {@link Ext.Layer} class.
+ * @constructor
+ * Create a new Shadow
+ * @param {Object} config The config object
+ */
+Ext.Shadow = function(config) {
+    Ext.apply(this, config);
+    if (typeof this.mode != "string") {
+        this.mode = this.defaultMode;
+    }
+    var o = this.offset,
+        a = {
+            h: 0
+        },
+        rad = Math.floor(this.offset / 2);
+    switch (this.mode.toLowerCase()) {
+        // all this hideous nonsense calculates the various offsets for shadows
+        case "drop":
+            a.w = 0;
+            a.l = a.t = o;
+            a.t -= 1;
+            if (Ext.isIE) {
+                a.l -= this.offset + rad;
+                a.t -= this.offset + rad;
+                a.w -= rad;
+                a.h -= rad;
+                a.t += 1;
+            }
+        break;
+        case "sides":
+            a.w = (o * 2);
+            a.l = -o;
+            a.t = o - 1;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= this.offset + rad;
+                a.l += 1;
+                a.w -= (this.offset - rad) * 2;
+                a.w -= rad + 1;
+                a.h -= 1;
+            }
+        break;
+        case "frame":
+            a.w = a.h = (o * 2);
+            a.l = a.t = -o;
+            a.t += 1;
+            a.h -= 2;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= (this.offset - rad);
+                a.l += 1;
+                a.w -= (this.offset + rad + 1);
+                a.h -= (this.offset + rad);
+                a.h += 1;
+            }
+        break;
+    };
+
+    this.adjusts = a;
+};
+
+Ext.Shadow.prototype = {
+    /**
+     * @cfg {String} mode
+     * The shadow display mode.  Supports the following options:<div class="mdetail-params"><ul>
+     * <li><b><tt>sides</tt></b> : Shadow displays on both sides and bottom only</li>
+     * <li><b><tt>frame</tt></b> : Shadow displays equally on all four sides</li>
+     * <li><b><tt>drop</tt></b> : Traditional bottom-right drop shadow</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {String} offset
+     * The number of pixels to offset the shadow from the element (defaults to <tt>4</tt>)
+     */
+    offset: 4,
+
+    // private
+    defaultMode: "drop",
+
+    /**
+     * Displays the shadow under the target element
+     * @param {Mixed} targetEl The id or element under which the shadow should display
+     */
+    show: function(target) {
+        target = Ext.get(target);
+        if (!this.el) {
+            this.el = Ext.Shadow.Pool.pull();
+            if (this.el.dom.nextSibling != target.dom) {
+                this.el.insertBefore(target);
+            }
+        }
+        this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10) - 1);
+        if (Ext.isIE) {
+            this.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (this.offset) + ")";
+        }
+        this.realign(
+        target.getLeft(true),
+        target.getTop(true),
+        target.getWidth(),
+        target.getHeight()
+        );
+        this.el.dom.style.display = "block";
+    },
+
+    /**
+     * Returns true if the shadow is visible, else false
+     */
+    isVisible: function() {
+        return this.el ? true: false;
+    },
+
+    /**
+     * Direct alignment when values are already available. Show must be called at least once before
+     * calling this method to ensure it is initialized.
+     * @param {Number} left The target element left position
+     * @param {Number} top The target element top position
+     * @param {Number} width The target element width
+     * @param {Number} height The target element height
+     */
+    realign: function(l, t, w, h) {
+        if (!this.el) {
+            return;
+        }
+        var a = this.adjusts,
+            d = this.el.dom,
+            s = d.style,
+            iea = 0,
+            sw = (w + a.w),
+            sh = (h + a.h),
+            sws = sw + "px",
+            shs = sh + "px",
+            cn,
+            sww;
+        s.left = (l + a.l) + "px";
+        s.top = (t + a.t) + "px";
+        if (s.width != sws || s.height != shs) {
+            s.width = sws;
+            s.height = shs;
+            if (!Ext.isIE) {
+                cn = d.childNodes;
+                sww = Math.max(0, (sw - 12)) + "px";
+                cn[0].childNodes[1].style.width = sww;
+                cn[1].childNodes[1].style.width = sww;
+                cn[2].childNodes[1].style.width = sww;
+                cn[1].style.height = Math.max(0, (sh - 12)) + "px";
+            }
+        }
+    },
+
+    /**
+     * Hides this shadow
+     */
+    hide: function() {
+        if (this.el) {
+            this.el.dom.style.display = "none";
+            Ext.Shadow.Pool.push(this.el);
+            delete this.el;
+        }
+    },
+
+    /**
+     * Adjust the z-index of this shadow
+     * @param {Number} zindex The new z-index
+     */
+    setZIndex: function(z) {
+        this.zIndex = z;
+        if (this.el) {
+            this.el.setStyle("z-index", z);
+        }
+    }
+};
+
+// Private utility class that manages the internal Shadow cache
+Ext.Shadow.Pool = function() {
+    var p = [],
+        markup = Ext.isIE ?
+            '<div class="x-ie-shadow"></div>':
+            '<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';
+    return {
+        pull: function() {
+            var sh = p.shift();
+            if (!sh) {
+                sh = Ext.get(Ext.DomHelper.insertHtml("beforeBegin", document.body.firstChild, markup));
+                sh.autoBoxAdjust = false;
+            }
+            return sh;
+        },
+
+        push: function(sh) {
+            p.push(sh);
+        }
+    };
+}();/**
+ * @class Ext.BoxComponent
+ * @extends Ext.Component
+ * <p>Base class for any {@link Ext.Component Component} that is to be sized as a box, using width and height.</p>
+ * <p>BoxComponent provides automatic box model adjustments for sizing and positioning and will work correctly
+ * within the Component rendering model.</p>
+ * <p>A BoxComponent may be created as a custom Component which encapsulates any HTML element, either a pre-existing
+ * element, or one that is created to your specifications at render time. Usually, to participate in layouts,
+ * a Component will need to be a <b>Box</b>Component in order to have its width and height managed.</p>
+ * <p>To use a pre-existing element as a BoxComponent, configure it so that you preset the <b>el</b> property to the
+ * element to reference:<pre><code>
+var pageHeader = new Ext.BoxComponent({
+    el: 'my-header-div'
+});</code></pre>
+ * This may then be {@link Ext.Container#add added} to a {@link Ext.Container Container} as a child item.</p>
+ * <p>To create a BoxComponent based around a HTML element to be created at render time, use the
+ * {@link Ext.Component#autoEl autoEl} config option which takes the form of a
+ * {@link Ext.DomHelper DomHelper} specification:<pre><code>
+var myImage = new Ext.BoxComponent({
+    autoEl: {
+        tag: 'img',
+        src: '/images/my-image.jpg'
+    }
+});</code></pre></p>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options.
+ * @xtype box
+ */
+Ext.BoxComponent = Ext.extend(Ext.Component, {
+
+    // Configs below are used for all Components when rendered by BoxLayout.
+    /**
+     * @cfg {Number} flex
+     * <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use a <b>{@link Ext.layout.BoxLayout BoxLayout}.</b>
+     * Each child Component with a <code>flex</code> property will be flexed either vertically (by a VBoxLayout)
+     * or horizontally (by an HBoxLayout) according to the item's <b>relative</b> <code>flex</code> value
+     * compared to the sum of all Components with <code>flex</flex> value specified. Any child items that have
+     * either a <code>flex = 0</code> or <code>flex = undefined</code> will not be 'flexed' (the initial size will not be changed).
+     */
+    // Configs below are used for all Components when rendered by AnchorLayout.
+    /**
+     * @cfg {String} anchor <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use an <b>{@link Ext.layout.AnchorLayout AnchorLayout} (or subclass thereof).</b>
+     * based layout manager, for example:<div class="mdetail-params"><ul>
+     * <li>{@link Ext.form.FormPanel}</li>
+     * <li>specifying <code>layout: 'anchor' // or 'form', or 'absolute'</code></li>
+     * </ul></div></p>
+     * <p>See {@link Ext.layout.AnchorLayout}.{@link Ext.layout.AnchorLayout#anchor anchor} also.</p>
+     */
+    // tabTip config is used when a BoxComponent is a child of a TabPanel
+    /**
+     * @cfg {String} tabTip
+     * <p><b>Note</b>: this config is only used when this BoxComponent is a child item of a TabPanel.</p>
+     * A string to be used as innerHTML (html tags are accepted) to show in a tooltip when mousing over
+     * the associated tab selector element. {@link Ext.QuickTips}.init()
+     * must be called in order for the tips to render.
+     */
+    // Configs below are used for all Components when rendered by BorderLayout.
+    /**
+     * @cfg {String} region <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * layout manager (e.g. specifying <tt>layout:'border'</tt>).</p><br>
+     * <p>See {@link Ext.layout.BorderLayout} also.</p>
+     */
+    // margins config is used when a BoxComponent is rendered by BorderLayout or BoxLayout.
+    /**
+     * @cfg {Object} margins <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * or one of the two <b>{@link Ext.layout.BoxLayout BoxLayout} subclasses.</b></p>
+     * <p>An object containing margins to apply to this BoxComponent in the
+     * format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Number} x
+     * The local x (left) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} y
+     * The local y (top) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageX
+     * The page level x coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageY
+     * The page level y coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} height
+     * The height of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} width
+     * The width of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} boxMinHeight
+     * <p>The minimum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMinWidth
+     * <p>The minimum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxHeight
+     * <p>The maximum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxWidth
+     * <p>The maximum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <p>True to use height:'auto', false to use fixed height (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components inherit this config option, not all will
+     * function as expected with a height of 'auto'. Setting autoHeight:true means that the
+     * browser will manage height based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the height, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the height might
+     * result in elements needing to be synchronized with the new height. Example:</p><pre><code>
+var w = new Ext.Window({
+    title: 'Window',
+    width: 600,
+    autoHeight: true,
+    items: {
+        title: 'Collapse Me',
+        height: 400,
+        collapsible: true,
+        border: false,
+        listeners: {
+            beforecollapse: function() {
+                w.el.shadow.hide();
+            },
+            beforeexpand: function() {
+                w.el.shadow.hide();
+            },
+            collapse: function() {
+                w.syncShadow();
+            },
+            expand: function() {
+                w.syncShadow();
+            }
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * <p>True to use width:'auto', false to use fixed width (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components  inherit this config option, not all will
+     * function as expected with a width of 'auto'. Setting autoWidth:true means that the
+     * browser will manage width based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the width, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the width might
+     * result in elements needing to be synchronized with the new width. For example, where the target element is:</p><pre><code>
+&lt;div id='grid-container' style='margin-left:25%;width:50%'>&lt;/div>
+</code></pre>
+     * A Panel rendered into that target element must listen for browser window resize in order to relay its
+      * child items when the browser changes its width:<pre><code>
+var myPanel = new Ext.Panel({
+    renderTo: 'grid-container',
+    monitorResize: true, // relay on browser resize
+    title: 'Panel',
+    height: 400,
+    autoWidth: true,
+    layout: 'hbox',
+    layoutConfig: {
+        align: 'stretch'
+    },
+    defaults: {
+        flex: 1
+    },
+    items: [{
+        title: 'Box 1',
+    }, {
+        title: 'Box 2'
+    }, {
+        title: 'Box 3'
+    }],
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoScroll
+     * <code>true</code> to use overflow:'auto' on the components layout element and show scroll bars automatically when
+     * necessary, <code>false</code> to clip any overflowing content (defaults to <code>false</code>).
+     */
+
+    /* // private internal config
+     * {Boolean} deferHeight
+     * True to defer height calculations to an external component, false to allow this component to set its own
+     * height (defaults to false).
+     */
+
+    // private
+    initComponent : function(){
+        Ext.BoxComponent.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event resize
+             * Fires after the component is resized.
+             * @param {Ext.Component} this
+             * @param {Number} adjWidth The box-adjusted width that was set
+             * @param {Number} adjHeight The box-adjusted height that was set
+             * @param {Number} rawWidth The width that was originally specified
+             * @param {Number} rawHeight The height that was originally specified
+             */
+            'resize',
+            /**
+             * @event move
+             * Fires after the component is moved.
+             * @param {Ext.Component} this
+             * @param {Number} x The new x position
+             * @param {Number} y The new y position
+             */
+            'move'
+        );
+    },
+
+    // private, set in afterRender to signify that the component has been rendered
+    boxReady : false,
+    // private, used to defer height settings to subclasses
+    deferHeight: false,
+
+    /**
+     * Sets the width and height of this BoxComponent. This method fires the {@link #resize} event. This method can accept
+     * either width and height as separate arguments, or you can pass a size object like <code>{width:10, height:20}</code>.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+     * <li><code>undefined</code> to leave the width unchanged.</li>
+     * </ul></div>
+     * @param {Mixed} height The new height to set (not required if a size object is passed as the first arg).
+     * This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * <li><code>undefined</code> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setSize : function(w, h){
+
+        // support for standard size objects
+        if(typeof w == 'object'){
+            h = w.height;
+            w = w.width;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMinWidth) && (w < this.boxMinWidth)) {
+            w = this.boxMinWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMinHeight) && (h < this.boxMinHeight)) {
+            h = this.boxMinHeight;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMaxWidth) && (w > this.boxMaxWidth)) {
+            w = this.boxMaxWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMaxHeight) && (h > this.boxMaxHeight)) {
+            h = this.boxMaxHeight;
+        }
+        // not rendered
+        if(!this.boxReady){
+            this.width  = w;
+            this.height = h;
+            return this;
+        }
+
+        // prevent recalcs when not needed
+        if(this.cacheSizes !== false && this.lastSize && this.lastSize.width == w && this.lastSize.height == h){
+            return this;
+        }
+        this.lastSize = {width: w, height: h};
+        var adj = this.adjustSize(w, h),
+            aw = adj.width,
+            ah = adj.height,
+            rz;
+        if(aw !== undefined || ah !== undefined){ // this code is nasty but performs better with floaters
+            rz = this.getResizeEl();
+            if(!this.deferHeight && aw !== undefined && ah !== undefined){
+                rz.setSize(aw, ah);
+            }else if(!this.deferHeight && ah !== undefined){
+                rz.setHeight(ah);
+            }else if(aw !== undefined){
+                rz.setWidth(aw);
+            }
+            this.onResize(aw, ah, w, h);
+            this.fireEvent('resize', this, aw, ah, w, h);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the width of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setWidth : function(width){
+        return this.setSize(width);
+    },
+
+    /**
+     * Sets the height of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} height The new height to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style.</li>
+     * <li><i>undefined</i> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setHeight : function(height){
+        return this.setSize(undefined, height);
+    },
+
+    /**
+     * Gets the current size of the component's underlying element.
+     * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+     */
+    getSize : function(){
+        return this.getResizeEl().getSize();
+    },
+
+    /**
+     * Gets the current width of the component's underlying element.
+     * @return {Number}
+     */
+    getWidth : function(){
+        return this.getResizeEl().getWidth();
+    },
+
+    /**
+     * Gets the current height of the component's underlying element.
+     * @return {Number}
+     */
+    getHeight : function(){
+        return this.getResizeEl().getHeight();
+    },
+
+    /**
+     * Gets the current size of the component's underlying element, including space taken by its margins.
+     * @return {Object} An object containing the element's size {width: (element width + left/right margins), height: (element height + top/bottom margins)}
+     */
+    getOuterSize : function(){
+        var el = this.getResizeEl();
+        return {width: el.getWidth() + el.getMargins('lr'),
+                height: el.getHeight() + el.getMargins('tb')};
+    },
+
+    /**
+     * Gets the current XY position of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Array} The XY position of the element (e.g., [100, 200])
+     */
+    getPosition : function(local){
+        var el = this.getPositionEl();
+        if(local === true){
+            return [el.getLeft(true), el.getTop(true)];
+        }
+        return this.xy || el.getXY();
+    },
+
+    /**
+     * Gets the current box measurements of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Object} box An object in the format {x, y, width, height}
+     */
+    getBox : function(local){
+        var pos = this.getPosition(local);
+        var s = this.getSize();
+        s.x = pos[0];
+        s.y = pos[1];
+        return s;
+    },
+
+    /**
+     * Sets the current box measurements of the component's underlying element.
+     * @param {Object} box An object in the format {x, y, width, height}
+     * @return {Ext.BoxComponent} this
+     */
+    updateBox : function(box){
+        this.setSize(box.width, box.height);
+        this.setPagePosition(box.x, box.y);
+        return this;
+    },
+
+    /**
+     * <p>Returns the outermost Element of this Component which defines the Components overall size.</p>
+     * <p><i>Usually</i> this will return the same Element as <code>{@link #getEl}</code>,
+     * but in some cases, a Component may have some more wrapping Elements around its main
+     * active Element.</p>
+     * <p>An example is a ComboBox. It is encased in a <i>wrapping</i> Element which
+     * contains both the <code>&lt;input></code> Element (which is what would be returned
+     * by its <code>{@link #getEl}</code> method, <i>and</i> the trigger button Element.
+     * This Element is returned as the <code>resizeEl</code>.
+     * @return {Ext.Element} The Element which is to be resized by size managing layouts.
+     */
+    getResizeEl : function(){
+        return this.resizeEl || this.el;
+    },
+
+    /**
+     * Sets the overflow on the content element of the component.
+     * @param {Boolean} scroll True to allow the Component to auto scroll.
+     * @return {Ext.BoxComponent} this
+     */
+    setAutoScroll : function(scroll){
+        if(this.rendered){
+            this.getContentTarget().setOverflow(scroll ? 'auto' : '');
+        }
+        this.autoScroll = scroll;
+        return this;
+    },
+
+    /**
+     * Sets the left and top of the component.  To set the page XY position instead, use {@link #setPagePosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} left The new left
+     * @param {Number} top The new top
+     * @return {Ext.BoxComponent} this
+     */
+    setPosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.x = x;
+        this.y = y;
+        if(!this.boxReady){
+            return this;
+        }
+        var adj = this.adjustPosition(x, y);
+        var ax = adj.x, ay = adj.y;
+
+        var el = this.getPositionEl();
+        if(ax !== undefined || ay !== undefined){
+            if(ax !== undefined && ay !== undefined){
+                el.setLeftTop(ax, ay);
+            }else if(ax !== undefined){
+                el.setLeft(ax);
+            }else if(ay !== undefined){
+                el.setTop(ay);
+            }
+            this.onPosition(ax, ay);
+            this.fireEvent('move', this, ax, ay);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the page XY position of the component.  To set the left and top instead, use {@link #setPosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     * @return {Ext.BoxComponent} this
+     */
+    setPagePosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.pageX = x;
+        this.pageY = y;
+        if(!this.boxReady){
+            return;
+        }
+        if(x === undefined || y === undefined){ // cannot translate undefined points
+            return;
+        }
+        var p = this.getPositionEl().translatePoints(x, y);
+        this.setPosition(p.left, p.top);
+        return this;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.BoxComponent.superclass.afterRender.call(this);
+        if(this.resizeEl){
+            this.resizeEl = Ext.get(this.resizeEl);
+        }
+        if(this.positionEl){
+            this.positionEl = Ext.get(this.positionEl);
+        }
+        this.boxReady = true;
+        Ext.isDefined(this.autoScroll) && this.setAutoScroll(this.autoScroll);
+        this.setSize(this.width, this.height);
+        if(this.x || this.y){
+            this.setPosition(this.x, this.y);
+        }else if(this.pageX || this.pageY){
+            this.setPagePosition(this.pageX, this.pageY);
+        }
+    },
+
+    /**
+     * Force the component's size to recalculate based on the underlying element's current height and width.
+     * @return {Ext.BoxComponent} this
+     */
+    syncSize : function(){
+        delete this.lastSize;
+        this.setSize(this.autoWidth ? undefined : this.getResizeEl().getWidth(), this.autoHeight ? undefined : this.getResizeEl().getHeight());
+        return this;
+    },
+
+    /* // protected
+     * Called after the component is resized, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a resize occurs.
+     * @param {Number} adjWidth The box-adjusted width that was set
+     * @param {Number} adjHeight The box-adjusted height that was set
+     * @param {Number} rawWidth The width that was originally specified
+     * @param {Number} rawHeight The height that was originally specified
+     */
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+    },
+
+    /* // protected
+     * Called after the component is moved, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a move occurs.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     */
+    onPosition : function(x, y){
+
+    },
+
+    // private
+    adjustSize : function(w, h){
+        if(this.autoWidth){
+            w = 'auto';
+        }
+        if(this.autoHeight){
+            h = 'auto';
+        }
+        return {width : w, height: h};
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        return {x : x, y: y};
+    }
+});
+Ext.reg('box', Ext.BoxComponent);
+
+
+/**
+ * @class Ext.Spacer
+ * @extends Ext.BoxComponent
+ * <p>Used to provide a sizable space in a layout.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Spacer = Ext.extend(Ext.BoxComponent, {
+    autoEl:'div'
+});
+Ext.reg('spacer', Ext.Spacer);/**
+ * @class Ext.SplitBar
+ * @extends Ext.util.Observable
+ * Creates draggable splitter bar functionality from two elements (element to be dragged and element to be resized).
+ * <br><br>
+ * Usage:
+ * <pre><code>
+var split = new Ext.SplitBar("elementToDrag", "elementToSize",
+                   Ext.SplitBar.HORIZONTAL, Ext.SplitBar.LEFT);
+split.setAdapter(new Ext.SplitBar.AbsoluteLayoutAdapter("container"));
+split.minSize = 100;
+split.maxSize = 600;
+split.animate = true;
+split.on('moved', splitterMoved);
+</code></pre>
+ * @constructor
+ * Create a new SplitBar
+ * @param {Mixed} dragElement The element to be dragged and act as the SplitBar.
+ * @param {Mixed} resizingElement The element to be resized based on where the SplitBar element is dragged
+ * @param {Number} orientation (optional) Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+ * @param {Number} placement (optional) Either Ext.SplitBar.LEFT or Ext.SplitBar.RIGHT for horizontal or
+                        Ext.SplitBar.TOP or Ext.SplitBar.BOTTOM for vertical. (By default, this is determined automatically by the initial
+                        position of the SplitBar).
+ */
+Ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){
+
+    /** @private */
+    this.el = Ext.get(dragElement, true);
+    this.el.dom.unselectable = "on";
+    /** @private */
+    this.resizingEl = Ext.get(resizingElement, true);
+
+    /**
+     * @private
+     * The orientation of the split. Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+     * Note: If this is changed after creating the SplitBar, the placement property must be manually updated
+     * @type Number
+     */
+    this.orientation = orientation || Ext.SplitBar.HORIZONTAL;
+
+    /**
+     * The increment, in pixels by which to move this SplitBar. When <i>undefined</i>, the SplitBar moves smoothly.
+     * @type Number
+     * @property tickSize
+     */
+    /**
+     * The minimum size of the resizing element. (Defaults to 0)
+     * @type Number
+     */
+    this.minSize = 0;
+
+    /**
+     * The maximum size of the resizing element. (Defaults to 2000)
+     * @type Number
+     */
+    this.maxSize = 2000;
+
+    /**
+     * Whether to animate the transition to the new size
+     * @type Boolean
+     */
+    this.animate = false;
+
+    /**
+     * Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.
+     * @type Boolean
+     */
+    this.useShim = false;
+
+    /** @private */
+    this.shim = null;
+
+    if(!existingProxy){
+        /** @private */
+        this.proxy = Ext.SplitBar.createProxy(this.orientation);
+    }else{
+        this.proxy = Ext.get(existingProxy).dom;
+    }
+    /** @private */
+    this.dd = new Ext.dd.DDProxy(this.el.dom.id, "XSplitBars", {dragElId : this.proxy.id});
+
+    /** @private */
+    this.dd.b4StartDrag = this.onStartProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dd.endDrag = this.onEndProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dragSpecs = {};
+
+    /**
+     * @private The adapter to use to positon and resize elements
+     */
+    this.adapter = new Ext.SplitBar.BasicLayoutAdapter();
+    this.adapter.init(this);
+
+    if(this.orientation == Ext.SplitBar.HORIZONTAL){
+        /** @private */
+        this.placement = placement || (this.el.getX() > this.resizingEl.getX() ? Ext.SplitBar.LEFT : Ext.SplitBar.RIGHT);
+        this.el.addClass("x-splitbar-h");
+    }else{
+        /** @private */
+        this.placement = placement || (this.el.getY() > this.resizingEl.getY() ? Ext.SplitBar.TOP : Ext.SplitBar.BOTTOM);
+        this.el.addClass("x-splitbar-v");
+    }
+
+    this.addEvents(
+        /**
+         * @event resize
+         * Fires when the splitter is moved (alias for {@link #moved})
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "resize",
+        /**
+         * @event moved
+         * Fires when the splitter is moved
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "moved",
+        /**
+         * @event beforeresize
+         * Fires before the splitter is dragged
+         * @param {Ext.SplitBar} this
+         */
+        "beforeresize",
+
+        "beforeapply"
+    );
+
+    Ext.SplitBar.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.SplitBar, Ext.util.Observable, {
+    onStartProxyDrag : function(x, y){
+        this.fireEvent("beforeresize", this);
+        this.overlay =  Ext.DomHelper.append(document.body,  {cls: "x-drag-overlay", html: "&#160;"}, true);
+        this.overlay.unselectable();
+        this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        this.overlay.show();
+        Ext.get(this.proxy).setDisplayed("block");
+        var size = this.adapter.getElementSize(this);
+        this.activeMinSize = this.getMinimumSize();
+        this.activeMaxSize = this.getMaximumSize();
+        var c1 = size - this.activeMinSize;
+        var c2 = Math.max(this.activeMaxSize - size, 0);
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(
+                this.placement == Ext.SplitBar.LEFT ? c1 : c2,
+                this.placement == Ext.SplitBar.LEFT ? c2 : c1,
+                this.tickSize
+            );
+            this.dd.setYConstraint(0, 0);
+        }else{
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(0, 0);
+            this.dd.setYConstraint(
+                this.placement == Ext.SplitBar.TOP ? c1 : c2,
+                this.placement == Ext.SplitBar.TOP ? c2 : c1,
+                this.tickSize
+            );
+         }
+        this.dragSpecs.startSize = size;
+        this.dragSpecs.startPoint = [x, y];
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd, x, y);
+    },
+
+    /**
+     * @private Called after the drag operation by the DDProxy
+     */
+    onEndProxyDrag : function(e){
+        Ext.get(this.proxy).setDisplayed(false);
+        var endPoint = Ext.lib.Event.getXY(e);
+        if(this.overlay){
+            Ext.destroy(this.overlay);
+            delete this.overlay;
+        }
+        var newSize;
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.LEFT ?
+                    endPoint[0] - this.dragSpecs.startPoint[0] :
+                    this.dragSpecs.startPoint[0] - endPoint[0]
+                );
+        }else{
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.TOP ?
+                    endPoint[1] - this.dragSpecs.startPoint[1] :
+                    this.dragSpecs.startPoint[1] - endPoint[1]
+                );
+        }
+        newSize = Math.min(Math.max(newSize, this.activeMinSize), this.activeMaxSize);
+        if(newSize != this.dragSpecs.startSize){
+            if(this.fireEvent('beforeapply', this, newSize) !== false){
+                this.adapter.setElementSize(this, newSize);
+                this.fireEvent("moved", this, newSize);
+                this.fireEvent("resize", this, newSize);
+            }
+        }
+    },
+
+    /**
+     * Get the adapter this SplitBar uses
+     * @return The adapter object
+     */
+    getAdapter : function(){
+        return this.adapter;
+    },
+
+    /**
+     * Set the adapter this SplitBar uses
+     * @param {Object} adapter A SplitBar adapter object
+     */
+    setAdapter : function(adapter){
+        this.adapter = adapter;
+        this.adapter.init(this);
+    },
+
+    /**
+     * Gets the minimum size for the resizing element
+     * @return {Number} The minimum size
+     */
+    getMinimumSize : function(){
+        return this.minSize;
+    },
+
+    /**
+     * Sets the minimum size for the resizing element
+     * @param {Number} minSize The minimum size
+     */
+    setMinimumSize : function(minSize){
+        this.minSize = minSize;
+    },
+
+    /**
+     * Gets the maximum size for the resizing element
+     * @return {Number} The maximum size
+     */
+    getMaximumSize : function(){
+        return this.maxSize;
+    },
+
+    /**
+     * Sets the maximum size for the resizing element
+     * @param {Number} maxSize The maximum size
+     */
+    setMaximumSize : function(maxSize){
+        this.maxSize = maxSize;
+    },
+
+    /**
+     * Sets the initialize size for the resizing element
+     * @param {Number} size The initial size
+     */
+    setCurrentSize : function(size){
+        var oldAnimate = this.animate;
+        this.animate = false;
+        this.adapter.setElementSize(this, size);
+        this.animate = oldAnimate;
+    },
+
+    /**
+     * Destroy this splitbar.
+     * @param {Boolean} removeEl True to remove the element
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.shim, Ext.get(this.proxy));
+        this.dd.unreg();
+        if(removeEl){
+            this.el.remove();
+        }
+        this.purgeListeners();
+    }
+});
+
+/**
+ * @private static Create our own proxy element element. So it will be the same same size on all browsers, we won't use borders. Instead we use a background color.
+ */
+Ext.SplitBar.createProxy = function(dir){
+    var proxy = new Ext.Element(document.createElement("div"));
+    document.body.appendChild(proxy.dom);
+    proxy.unselectable();
+    var cls = 'x-splitbar-proxy';
+    proxy.addClass(cls + ' ' + (dir == Ext.SplitBar.HORIZONTAL ? cls +'-h' : cls + '-v'));
+    return proxy.dom;
+};
+
+/**
+ * @class Ext.SplitBar.BasicLayoutAdapter
+ * Default Adapter. It assumes the splitter and resizing element are not positioned
+ * elements and only gets/sets the width of the element. Generally used for table based layouts.
+ */
+Ext.SplitBar.BasicLayoutAdapter = function(){
+};
+
+Ext.SplitBar.BasicLayoutAdapter.prototype = {
+    // do nothing for now
+    init : function(s){
+
+    },
+    /**
+     * Called before drag operations to get the current size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     */
+     getElementSize : function(s){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            return s.resizingEl.getWidth();
+        }else{
+            return s.resizingEl.getHeight();
+        }
+    },
+
+    /**
+     * Called after drag operations to set the size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     * @param {Number} newSize The new size to set
+     * @param {Function} onComplete A function to be invoked when resizing is complete
+     */
+    setElementSize : function(s, newSize, onComplete){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            if(!s.animate){
+                s.resizingEl.setWidth(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setWidth(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }else{
+
+            if(!s.animate){
+                s.resizingEl.setHeight(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setHeight(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }
+    }
+};
+
+/**
+ *@class Ext.SplitBar.AbsoluteLayoutAdapter
+ * @extends Ext.SplitBar.BasicLayoutAdapter
+ * Adapter that  moves the splitter element to align with the resized sizing element.
+ * Used with an absolute positioned SplitBar.
+ * @param {Mixed} container The container that wraps around the absolute positioned content. If it's
+ * document.body, make sure you assign an id to the body element.
+ */
+Ext.SplitBar.AbsoluteLayoutAdapter = function(container){
+    this.basic = new Ext.SplitBar.BasicLayoutAdapter();
+    this.container = Ext.get(container);
+};
+
+Ext.SplitBar.AbsoluteLayoutAdapter.prototype = {
+    init : function(s){
+        this.basic.init(s);
+    },
+
+    getElementSize : function(s){
+        return this.basic.getElementSize(s);
+    },
+
+    setElementSize : function(s, newSize, onComplete){
+        this.basic.setElementSize(s, newSize, this.moveSplitter.createDelegate(this, [s]));
+    },
+
+    moveSplitter : function(s){
+        var yes = Ext.SplitBar;
+        switch(s.placement){
+            case yes.LEFT:
+                s.el.setX(s.resizingEl.getRight());
+                break;
+            case yes.RIGHT:
+                s.el.setStyle("right", (this.container.getWidth() - s.resizingEl.getLeft()) + "px");
+                break;
+            case yes.TOP:
+                s.el.setY(s.resizingEl.getBottom());
+                break;
+            case yes.BOTTOM:
+                s.el.setY(s.resizingEl.getTop() - s.el.getHeight());
+                break;
+        }
+    }
+};
+
+/**
+ * Orientation constant - Create a vertical SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.VERTICAL = 1;
+
+/**
+ * Orientation constant - Create a horizontal SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.HORIZONTAL = 2;
+
+/**
+ * Placement constant - The resizing element is to the left of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.LEFT = 1;
+
+/**
+ * Placement constant - The resizing element is to the right of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.RIGHT = 2;
+
+/**
+ * Placement constant - The resizing element is positioned above the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.TOP = 3;
+
+/**
+ * Placement constant - The resizing element is positioned under splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.BOTTOM = 4;
+/**
+ * @class Ext.Container
+ * @extends Ext.BoxComponent
+ * <p>Base class for any {@link Ext.BoxComponent} that may contain other Components. Containers handle the
+ * basic behavior of containing items, namely adding, inserting and removing items.</p>
+ *
+ * <p>The most commonly used Container classes are {@link Ext.Panel}, {@link Ext.Window} and {@link Ext.TabPanel}.
+ * If you do not need the capabilities offered by the aforementioned classes you can create a lightweight
+ * Container to be encapsulated by an HTML element to your specifications by using the
+ * <code><b>{@link Ext.Component#autoEl autoEl}</b></code> config option. This is a useful technique when creating
+ * embedded {@link Ext.layout.ColumnLayout column} layouts inside {@link Ext.form.FormPanel FormPanels}
+ * for example.</p>
+ *
+ * <p>The code below illustrates both how to explicitly create a Container, and how to implicitly
+ * create one using the <b><code>'container'</code></b> xtype:<pre><code>
+// explicitly create a Container
+var embeddedColumns = new Ext.Container({
+    autoEl: 'div',  // This is the default
+    layout: 'column',
+    defaults: {
+        // implicitly create Container by specifying xtype
+        xtype: 'container',
+        autoEl: 'div', // This is the default.
+        layout: 'form',
+        columnWidth: 0.5,
+        style: {
+            padding: '10px'
+        }
+    },
+//  The two items below will be Ext.Containers, each encapsulated by a &lt;DIV> element.
+    items: [{
+        items: {
+            xtype: 'datefield',
+            name: 'startDate',
+            fieldLabel: 'Start date'
+        }
+    }, {
+        items: {
+            xtype: 'datefield',
+            name: 'endDate',
+            fieldLabel: 'End date'
+        }
+    }]
+});</code></pre></p>
+ *
+ * <p><u><b>Layout</b></u></p>
+ * <p>Container classes delegate the rendering of child Components to a layout
+ * manager class which must be configured into the Container using the
+ * <code><b>{@link #layout}</b></code> configuration property.</p>
+ * <p>When either specifying child <code>{@link #items}</code> of a Container,
+ * or dynamically {@link #add adding} Components to a Container, remember to
+ * consider how you wish the Container to arrange those child elements, and
+ * whether those child elements need to be sized using one of Ext's built-in
+ * <b><code>{@link #layout}</code></b> schemes. By default, Containers use the
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme which only
+ * renders child components, appending them one after the other inside the
+ * Container, and <b>does not apply any sizing</b> at all.</p>
+ * <p>A common mistake is when a developer neglects to specify a
+ * <b><code>{@link #layout}</code></b> (e.g. widgets like GridPanels or
+ * TreePanels are added to Containers for which no <code><b>{@link #layout}</b></code>
+ * has been specified). If a Container is left to use the default
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme, none of its
+ * child components will be resized, or changed in any way when the Container
+ * is resized.</p>
+ * <p>Certain layout managers allow dynamic addition of child components.
+ * Those that do include {@link Ext.layout.CardLayout},
+ * {@link Ext.layout.AnchorLayout}, {@link Ext.layout.FormLayout}, and
+ * {@link Ext.layout.TableLayout}. For example:<pre><code>
+//  Create the GridPanel.
+var myNewGrid = new Ext.grid.GridPanel({
+    store: myStore,
+    columns: myColumnModel,
+    title: 'Results', // the title becomes the title of the tab
+});
+
+myTabPanel.add(myNewGrid); // {@link Ext.TabPanel} implicitly uses {@link Ext.layout.CardLayout CardLayout}
+myTabPanel.{@link Ext.TabPanel#setActiveTab setActiveTab}(myNewGrid);
+ * </code></pre></p>
+ * <p>The example above adds a newly created GridPanel to a TabPanel. Note that
+ * a TabPanel uses {@link Ext.layout.CardLayout} as its layout manager which
+ * means all its child items are sized to {@link Ext.layout.FitLayout fit}
+ * exactly into its client area.
+ * <p><b><u>Overnesting is a common problem</u></b>.
+ * An example of overnesting occurs when a GridPanel is added to a TabPanel
+ * by wrapping the GridPanel <i>inside</i> a wrapping Panel (that has no
+ * <code><b>{@link #layout}</b></code> specified) and then add that wrapping Panel
+ * to the TabPanel. The point to realize is that a GridPanel <b>is</b> a
+ * Component which can be added directly to a Container. If the wrapping Panel
+ * has no <code><b>{@link #layout}</b></code> configuration, then the overnested
+ * GridPanel will not be sized as expected.<p>
+ *
+ * <p><u><b>Adding via remote configuration</b></u></p>
+ *
+ * <p>A server side script can be used to add Components which are generated dynamically on the server.
+ * An example of adding a GridPanel to a TabPanel where the GridPanel is generated by the server
+ * based on certain parameters:
+ * </p><pre><code>
+// execute an Ajax request to invoke server side script:
+Ext.Ajax.request({
+    url: 'gen-invoice-grid.php',
+    // send additional parameters to instruct server script
+    params: {
+        startDate: Ext.getCmp('start-date').getValue(),
+        endDate: Ext.getCmp('end-date').getValue()
+    },
+    // process the response object to add it to the TabPanel:
+    success: function(xhr) {
+        var newComponent = eval(xhr.responseText); // see discussion below
+        myTabPanel.add(newComponent); // add the component to the TabPanel
+        myTabPanel.setActiveTab(newComponent);
+    },
+    failure: function() {
+        Ext.Msg.alert("Grid create failed", "Server communication failure");
+    }
+});
+</code></pre>
+ * <p>The server script needs to return an executable Javascript statement which, when processed
+ * using <code>eval()</code>, will return either a config object with an {@link Ext.Component#xtype xtype},
+ * or an instantiated Component. The server might return this for example:</p><pre><code>
+(function() {
+    function formatDate(value){
+        return value ? value.dateFormat('M d, Y') : '';
+    };
+
+    var store = new Ext.data.Store({
+        url: 'get-invoice-data.php',
+        baseParams: {
+            startDate: '01/01/2008',
+            endDate: '01/31/2008'
+        },
+        reader: new Ext.data.JsonReader({
+            record: 'transaction',
+            idProperty: 'id',
+            totalRecords: 'total'
+        }, [
+           'customer',
+           'invNo',
+           {name: 'date', type: 'date', dateFormat: 'm/d/Y'},
+           {name: 'value', type: 'float'}
+        ])
+    });
+
+    var grid = new Ext.grid.GridPanel({
+        title: 'Invoice Report',
+        bbar: new Ext.PagingToolbar(store),
+        store: store,
+        columns: [
+            {header: "Customer", width: 250, dataIndex: 'customer', sortable: true},
+            {header: "Invoice Number", width: 120, dataIndex: 'invNo', sortable: true},
+            {header: "Invoice Date", width: 100, dataIndex: 'date', renderer: formatDate, sortable: true},
+            {header: "Value", width: 120, dataIndex: 'value', renderer: 'usMoney', sortable: true}
+        ],
+    });
+    store.load();
+    return grid;  // return instantiated component
+})();
+</code></pre>
+ * <p>When the above code fragment is passed through the <code>eval</code> function in the success handler
+ * of the Ajax request, the code is executed by the Javascript processor, and the anonymous function
+ * runs, and returns the instantiated grid component.</p>
+ * <p>Note: since the code above is <i>generated</i> by a server script, the <code>baseParams</code> for
+ * the Store, the metadata to allow generation of the Record layout, and the ColumnModel
+ * can all be generated into the code since these are all known on the server.</p>
+ *
+ * @xtype container
+ */
+Ext.Container = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Boolean} monitorResize
+     * True to automatically monitor window resize events to handle anything that is sensitive to the current size
+     * of the viewport.  This value is typically managed by the chosen <code>{@link #layout}</code> and should not need
+     * to be set manually.
+     */
+    /**
+     * @cfg {String/Object} layout
+     * <p><b>*Important</b>: In order for child items to be correctly sized and
+     * positioned, typically a layout manager <b>must</b> be specified through
+     * the <code>layout</code> configuration option.</p>
+     * <br><p>The sizing and positioning of child {@link items} is the responsibility of
+     * the Container's layout manager which creates and manages the type of layout
+     * you have in mind.  For example:</p><pre><code>
+new Ext.Window({
+    width:300, height: 300,
+    layout: 'fit', // explicitly set layout manager: override the default (layout:'auto')
+    items: [{
+        title: 'Panel inside a Window'
+    }]
+}).show();
+     * </code></pre>
+     * <p>If the {@link #layout} configuration is not explicitly specified for
+     * a general purpose container (e.g. Container or Panel) the
+     * {@link Ext.layout.ContainerLayout default layout manager} will be used
+     * which does nothing but render child components sequentially into the
+     * Container (no sizing or positioning will be performed in this situation).
+     * Some container classes implicitly specify a default layout
+     * (e.g. FormPanel specifies <code>layout:'form'</code>). Other specific
+     * purpose classes internally specify/manage their internal layout (e.g.
+     * GridPanel, TabPanel, TreePanel, Toolbar, Menu, etc.).</p>
+     * <br><p><b><code>layout</code></b> may be specified as either as an Object or
+     * as a String:</p><div><ul class="mdetail-params">
+     *
+     * <li><u>Specify as an Object</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: {
+    type: 'vbox',
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     *
+     * <li><code><b>type</b></code></li>
+     * <br/><p>The layout type to be used for this container.  If not specified,
+     * a default {@link Ext.layout.ContainerLayout} will be created and used.</p>
+     * <br/><p>Valid layout <code>type</code> values are:</p>
+     * <div class="sub-desc"><ul class="mdetail-params">
+     * <li><code><b>{@link Ext.layout.AbsoluteLayout absolute}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AccordionLayout accordion}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AnchorLayout anchor}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ContainerLayout auto}</b></code> &nbsp;&nbsp;&nbsp; <b>Default</b></li>
+     * <li><code><b>{@link Ext.layout.BorderLayout border}</b></code></li>
+     * <li><code><b>{@link Ext.layout.CardLayout card}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ColumnLayout column}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FitLayout fit}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FormLayout form}</b></code></li>
+     * <li><code><b>{@link Ext.layout.HBoxLayout hbox}</b></code></li>
+     * <li><code><b>{@link Ext.layout.MenuLayout menu}</b></code></li>
+     * <li><code><b>{@link Ext.layout.TableLayout table}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ToolbarLayout toolbar}</b></code></li>
+     * <li><code><b>{@link Ext.layout.VBoxLayout vbox}</b></code></li>
+     * </ul></div>
+     *
+     * <li>Layout specific configuration properties</li>
+     * <br/><p>Additional layout specific configuration properties may also be
+     * specified. For complete details regarding the valid config options for
+     * each layout type, see the layout class corresponding to the <code>type</code>
+     * specified.</p>
+     *
+     * </ul></div>
+     *
+     * <li><u>Specify as a String</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: 'vbox',
+layoutConfig: {
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     * <li><code><b>layout</b></code></li>
+     * <br/><p>The layout <code>type</code> to be used for this container (see list
+     * of valid layout type values above).</p><br/>
+     * <li><code><b>{@link #layoutConfig}</b></code></li>
+     * <br/><p>Additional layout specific configuration properties. For complete
+     * details regarding the valid config options for each layout type, see the
+     * layout class corresponding to the <code>layout</code> specified.</p>
+     * </ul></div></ul></div>
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * This is a config object containing properties specific to the chosen
+     * <b><code>{@link #layout}</code></b> if <b><code>{@link #layout}</code></b>
+     * has been specified as a <i>string</i>.</p>
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * When set to true (50 milliseconds) or a number of milliseconds, the layout assigned for this container will buffer
+     * the frequency it calculates and does a re-layout of components. This is useful for heavy containers or containers
+     * with a large quantity of sub-components for which frequent layout calls would be expensive. Defaults to <code>50</code>.
+     */
+    bufferResize: 50,
+
+    /**
+     * @cfg {String/Number} activeItem
+     * A string component id or the numeric index of the component that should be initially activated within the
+     * container's layout on render.  For example, activeItem: 'item-1' or activeItem: 0 (index 0 = the first
+     * item in the container's collection).  activeItem only applies to layout styles that can display
+     * items one at a time (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout} and
+     * {@link Ext.layout.FitLayout}).  Related to {@link Ext.layout.ContainerLayout#activeItem}.
+     */
+    /**
+     * @cfg {Object/Array} items
+     * <pre><b>** IMPORTANT</b>: be sure to <b>{@link #layout specify a <code>layout</code>} if needed ! **</b></pre>
+     * <p>A single item, or an array of child Components to be added to this container,
+     * for example:</p>
+     * <pre><code>
+// specifying a single item
+items: {...},
+layout: 'fit',    // specify a layout!
+
+// specifying multiple items
+items: [{...}, {...}],
+layout: 'anchor', // specify a layout!
+     * </code></pre>
+     * <p>Each item may be:</p>
+     * <div><ul class="mdetail-params">
+     * <li>any type of object based on {@link Ext.Component}</li>
+     * <li>a fully instanciated object or</li>
+     * <li>an object literal that:</li>
+     * <div><ul class="mdetail-params">
+     * <li>has a specified <code>{@link Ext.Component#xtype xtype}</code></li>
+     * <li>the {@link Ext.Component#xtype} specified is associated with the Component
+     * desired and should be chosen from one of the available xtypes as listed
+     * in {@link Ext.Component}.</li>
+     * <li>If an <code>{@link Ext.Component#xtype xtype}</code> is not explicitly
+     * specified, the {@link #defaultType} for that Container is used.</li>
+     * <li>will be "lazily instanciated", avoiding the overhead of constructing a fully
+     * instanciated Component object</li>
+     * </ul></div></ul></div>
+     * <p><b>Notes</b>:</p>
+     * <div><ul class="mdetail-params">
+     * <li>Ext uses lazy rendering. Child Components will only be rendered
+     * should it become necessary. Items are automatically laid out when they are first
+     * shown (no sizing is done while hidden), or in response to a {@link #doLayout} call.</li>
+     * <li>Do not specify <code>{@link Ext.Panel#contentEl contentEl}</code>/
+     * <code>{@link Ext.Panel#html html}</code> with <code>items</code>.</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object|Function} defaults
+     * <p>This option is a means of applying default settings to all added items whether added through the {@link #items}
+     * config or via the {@link #add} or {@link #insert} methods.</p>
+     * <p>If an added item is a config object, and <b>not</b> an instantiated Component, then the default properties are
+     * unconditionally applied. If the added item <b>is</b> an instantiated Component, then the default properties are
+     * applied conditionally so as not to override existing properties in the item.</p>
+     * <p>If the defaults option is specified as a function, then the function will be called using this Container as the
+     * scope (<code>this</code> reference) and passing the added item as the first parameter. Any resulting object
+     * from that call is then applied to the item as default properties.</p>
+     * <p>For example, to automatically apply padding to the body of each of a set of
+     * contained {@link Ext.Panel} items, you could pass: <code>defaults: {bodyStyle:'padding:15px'}</code>.</p>
+     * <p>Usage:</p><pre><code>
+defaults: {               // defaults are applied to items, not the container
+    autoScroll:true
+},
+items: [
+    {
+        xtype: 'panel',   // defaults <b>do not</b> have precedence over
+        id: 'panel1',     // options in config objects, so the defaults
+        autoScroll: false // will not be applied here, panel1 will be autoScroll:false
+    },
+    new Ext.Panel({       // defaults <b>do</b> have precedence over options
+        id: 'panel2',     // options in components, so the defaults
+        autoScroll: false // will be applied here, panel2 will be autoScroll:true.
+    })
+]
+     * </code></pre>
+     */
+
+
+    /** @cfg {Boolean} autoDestroy
+     * If true the container will automatically destroy any contained component that is removed from it, else
+     * destruction must be handled manually (defaults to true).
+     */
+    autoDestroy : true,
+
+    /** @cfg {Boolean} forceLayout
+     * If true the container will force a layout initially even if hidden or collapsed. This option
+     * is useful for forcing forms to render in collapsed or hidden containers. (defaults to false).
+     */
+    forceLayout: false,
+
+    /** @cfg {Boolean} hideBorders
+     * True to hide the borders of each contained component, false to defer to the component's existing
+     * border settings (defaults to false).
+     */
+    /** @cfg {String} defaultType
+     * <p>The default {@link Ext.Component xtype} of child Components to create in this Container when
+     * a child item is specified as a raw configuration object, rather than as an instantiated Component.</p>
+     * <p>Defaults to <code>'panel'</code>, except {@link Ext.menu.Menu} which defaults to <code>'menuitem'</code>,
+     * and {@link Ext.Toolbar} and {@link Ext.ButtonGroup} which default to <code>'button'</code>.</p>
+     */
+    defaultType : 'panel',
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <code>'resize'</code>.
+     */
+    resizeEvent: 'resize',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <code>['add', 'remove']</code>.
+     */
+    bubbleEvents: ['add', 'remove'],
+
+    // private
+    initComponent : function(){
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event afterlayout
+             * Fires when the components in this container are arranged by the associated layout manager.
+             * @param {Ext.Container} this
+             * @param {ContainerLayout} layout The ContainerLayout implementation for this container
+             */
+            'afterlayout',
+            /**
+             * @event beforeadd
+             * Fires before any {@link Ext.Component} is added or inserted into the container.
+             * A handler can return false to cancel the add.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being added
+             * @param {Number} index The index at which the component will be added to the container's items collection
+             */
+            'beforeadd',
+            /**
+             * @event beforeremove
+             * Fires before any {@link Ext.Component} is removed from the container.  A handler can return
+             * false to cancel the remove.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being removed
+             */
+            'beforeremove',
+            /**
+             * @event add
+             * @bubbles
+             * Fires after any {@link Ext.Component} is added or inserted into the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was added
+             * @param {Number} index The index at which the component was added to the container's items collection
+             */
+            'add',
+            /**
+             * @event remove
+             * @bubbles
+             * Fires after any {@link Ext.Component} is removed from the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was removed
+             */
+            'remove'
+        );
+
+        /**
+         * The collection of components in this container as a {@link Ext.util.MixedCollection}
+         * @type MixedCollection
+         * @property items
+         */
+        var items = this.items;
+        if(items){
+            delete this.items;
+            this.add(items);
+        }
+    },
+
+    // private
+    initItems : function(){
+        if(!this.items){
+            this.items = new Ext.util.MixedCollection(false, this.getComponentId);
+            this.getLayout(); // initialize the layout
+        }
+    },
+
+    // private
+    setLayout : function(layout){
+        if(this.layout && this.layout != layout){
+            this.layout.setContainer(null);
+        }
+        this.layout = layout;
+        this.initItems();
+        layout.setContainer(this);
+    },
+
+    afterRender: function(){
+        // Render this Container, this should be done before setLayout is called which
+        // will hook onResize
+        Ext.Container.superclass.afterRender.call(this);
+        if(!this.layout){
+            this.layout = 'auto';
+        }
+        if(Ext.isObject(this.layout) && !this.layout.layout){
+            this.layoutConfig = this.layout;
+            this.layout = this.layoutConfig.type;
+        }
+        if(Ext.isString(this.layout)){
+            this.layout = new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig);
+        }
+        this.setLayout(this.layout);
+
+        // If a CardLayout, the active item set
+        if(this.activeItem !== undefined && this.layout.setActiveItem){
+            var item = this.activeItem;
+            delete this.activeItem;
+            this.layout.setActiveItem(item);
+        }
+
+        // If we have no ownerCt, render and size all children
+        if(!this.ownerCt){
+            this.doLayout(false, true);
+        }
+
+        // This is a manually configured flag set by users in conjunction with renderTo.
+        // Not to be confused with the flag by the same name used in Layouts.
+        if(this.monitorResize === true){
+            Ext.EventManager.onWindowResize(this.doLayout, this, [false]);
+        }
+    },
+
+    /**
+     * <p>Returns the Element to be used to contain the child Components of this Container.</p>
+     * <p>An implementation is provided which returns the Container's {@link #getEl Element}, but
+     * if there is a more complex structure to a Container, this may be overridden to return
+     * the element into which the {@link #layout layout} renders child Components.</p>
+     * @return {Ext.Element} The Element to render child Components into.
+     */
+    getLayoutTarget : function(){
+        return this.el;
+    },
+
+    // private - used as the key lookup function for the items collection
+    getComponentId : function(comp){
+        return comp.getItemId();
+    },
+
+    /**
+     * <p>Adds {@link Ext.Component Component}(s) to this Container.</p>
+     * <br><p><b>Description</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>Fires the {@link #beforeadd} event before adding</li>
+     * <li>The Container's {@link #defaults default config values} will be applied
+     * accordingly (see <code>{@link #defaults}</code> for details).</li>
+     * <li>Fires the {@link #add} event after the component has been added.</li>
+     * </ul></div>
+     * <br><p><b>Notes</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>If the Container is <i>already rendered</i> when <code>add</code>
+     * is called, you may need to call {@link #doLayout} to refresh the view which causes
+     * any unrendered child Components to be rendered. This is required so that you can
+     * <code>add</code> multiple child components if needed while only refreshing the layout
+     * once. For example:<pre><code>
+var tb = new {@link Ext.Toolbar}();
+tb.render(document.body);  // toolbar is rendered
+tb.add({text:'Button 1'}); // add multiple items ({@link #defaultType} for {@link Ext.Toolbar Toolbar} is 'button')
+tb.add({text:'Button 2'});
+tb.{@link #doLayout}();             // refresh the layout
+     * </code></pre></li>
+     * <li><i>Warning:</i> Containers directly managed by the BorderLayout layout manager
+     * may not be removed or added.  See the Notes for {@link Ext.layout.BorderLayout BorderLayout}
+     * for more details.</li>
+     * </ul></div>
+     * @param {...Object/Array} component
+     * <p>Either one or more Components to add or an Array of Components to add.  See
+     * <code>{@link #items}</code> for additional information.</p>
+     * @return {Ext.Component/Array} The Components that were added.
+     */
+    add : function(comp){
+        this.initItems();
+        var args = arguments.length > 1;
+        if(args || Ext.isArray(comp)){
+            var result = [];
+            Ext.each(args ? arguments : comp, function(c){
+                result.push(this.add(c));
+            }, this);
+            return result;
+        }
+        var c = this.lookupComponent(this.applyDefaults(comp));
+        var index = this.items.length;
+        if(this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false){
+            this.items.add(c);
+            // *onAdded
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        return c;
+    },
+
+    onAdd : function(c){
+        // Empty template method
+    },
+
+    // private
+    onAdded : function(container, pos) {
+        //overridden here so we can cascade down, not worth creating a template method.
+        this.ownerCt = container;
+        this.initRef();
+        //initialize references for child items
+        this.cascade(function(c){
+            c.initRef();
+        });
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * Inserts a Component into this Container at a specified index. Fires the
+     * {@link #beforeadd} event before inserting, then fires the {@link #add} event after the
+     * Component has been inserted.
+     * @param {Number} index The index at which the Component will be inserted
+     * into the Container's items collection
+     * @param {Ext.Component} component The child Component to insert.<br><br>
+     * Ext uses lazy rendering, and will only render the inserted Component should
+     * it become necessary.<br><br>
+     * A Component config object may be passed in order to avoid the overhead of
+     * constructing a real Component object if lazy rendering might mean that the
+     * inserted Component will not be rendered immediately. To take advantage of
+     * this 'lazy instantiation', set the {@link Ext.Component#xtype} config
+     * property to the registered type of the Component wanted.<br><br>
+     * For a list of all available xtypes, see {@link Ext.Component}.
+     * @return {Ext.Component} component The Component (or config object) that was
+     * inserted with the Container's default config values applied.
+     */
+    insert : function(index, comp) {
+        var args   = arguments,
+            length = args.length,
+            result = [],
+            i, c;
+        
+        this.initItems();
+        
+        if (length > 2) {
+            for (i = length - 1; i >= 1; --i) {
+                result.push(this.insert(index, args[i]));
+            }
+            return result;
+        }
+        
+        c = this.lookupComponent(this.applyDefaults(comp));
+        index = Math.min(index, this.items.length);
+        
+        if (this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false) {
+            if (c.ownerCt == this) {
+                this.items.remove(c);
+            }
+            this.items.insert(index, c);
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        var d = this.defaults;
+        if(d){
+            if(Ext.isFunction(d)){
+                d = d.call(this, c);
+            }
+            if(Ext.isString(c)){
+                c = Ext.ComponentMgr.get(c);
+                Ext.apply(c, d);
+            }else if(!c.events){
+                Ext.applyIf(c.isAction ? c.initialConfig : c, d);
+            }else{
+                Ext.apply(c, d);
+            }
+        }
+        return c;
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        if(item.ownerCt){
+            item.ownerCt.remove(item, false);
+        }
+        if(this.hideBorders === true){
+            item.border = (item.border === true);
+        }
+    },
+
+    /**
+     * Removes a component from this container.  Fires the {@link #beforeremove} event before removing, then fires
+     * the {@link #remove} event after the component has been removed.
+     * @param {Component/String} component The component reference or id to remove.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Ext.Component} component The Component that was removed.
+     */
+    remove : function(comp, autoDestroy){
+        this.initItems();
+        var c = this.getComponent(comp);
+        if(c && this.fireEvent('beforeremove', this, c) !== false){
+            this.doRemove(c, autoDestroy);
+            this.fireEvent('remove', this, c);
+        }
+        return c;
+    },
+
+    onRemove: function(c){
+        // Empty template method
+    },
+
+    // private
+    doRemove: function(c, autoDestroy){
+        var l = this.layout,
+            hasLayout = l && this.rendered;
+
+        if(hasLayout){
+            l.onRemove(c);
+        }
+        this.items.remove(c);
+        c.onRemoved();
+        this.onRemove(c);
+        if(autoDestroy === true || (autoDestroy !== false && this.autoDestroy)){
+            c.destroy();
+        }
+        if(hasLayout){
+            l.afterRemove(c);
+        }
+    },
+
+    /**
+     * Removes all components from this container.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Array} Array of the destroyed components
+     */
+    removeAll: function(autoDestroy){
+        this.initItems();
+        var item, rem = [], items = [];
+        this.items.each(function(i){
+            rem.push(i);
+        });
+        for (var i = 0, len = rem.length; i < len; ++i){
+            item = rem[i];
+            this.remove(item, autoDestroy);
+            if(item.ownerCt !== this){
+                items.push(item);
+            }
+        }
+        return items;
+    },
+
+    /**
+     * Examines this container's <code>{@link #items}</code> <b>property</b>
+     * and gets a direct child component of this container.
+     * @param {String/Number} comp This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><code>String</code></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><code>Number</code></b> : representing the position of the child component
+     * within the <code>{@link #items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     * @return Ext.Component The component (if found).
+     */
+    getComponent : function(comp){
+        if(Ext.isObject(comp)){
+            comp = comp.getItemId();
+        }
+        return this.items.get(comp);
+    },
+
+    // private
+    lookupComponent : function(comp){
+        if(Ext.isString(comp)){
+            return Ext.ComponentMgr.get(comp);
+        }else if(!comp.events){
+            return this.createComponent(comp);
+        }
+        return comp;
+    },
+
+    // private
+    createComponent : function(config, defaultType){
+        if (config.render) {
+            return config;
+        }
+        // add in ownerCt at creation time but then immediately
+        // remove so that onBeforeAdd can handle it
+        var c = Ext.create(Ext.apply({
+            ownerCt: this
+        }, config), defaultType || this.defaultType);
+        delete c.initialConfig.ownerCt;
+        delete c.ownerCt;
+        return c;
+    },
+
+    /**
+     * @private
+     * We can only lay out if there is a view area in which to layout.
+     * display:none on the layout target, *or any of its parent elements* will mean it has no view area.
+     */
+    canLayout : function() {
+        var el = this.getVisibilityEl();
+        return el && el.dom && !el.isStyle("display", "none");
+    },
+
+    /**
+     * Force this container's layout to be recalculated. A call to this function is required after adding a new component
+     * to an already rendered container, or possibly after changing sizing/position properties of child components.
+     * @param {Boolean} shallow (optional) True to only calc the layout of this component, and let child components auto
+     * calc layouts as required (defaults to false, which calls doLayout recursively for each subcontainer)
+     * @param {Boolean} force (optional) True to force a layout to occur, even if the item is hidden.
+     * @return {Ext.Container} this
+     */
+
+    doLayout : function(shallow, force){
+        var rendered = this.rendered,
+            forceLayout = force || this.forceLayout;
+
+        if(this.collapsed || !this.canLayout()){
+            this.deferLayout = this.deferLayout || !shallow;
+            if(!forceLayout){
+                return;
+            }
+            shallow = shallow && !this.deferLayout;
+        } else {
+            delete this.deferLayout;
+        }
+        if(rendered && this.layout){
+            this.layout.layout();
+        }
+        if(shallow !== true && this.items){
+            var cs = this.items.items;
+            for(var i = 0, len = cs.length; i < len; i++){
+                var c = cs[i];
+                if(c.doLayout){
+                    c.doLayout(false, forceLayout);
+                }
+            }
+        }
+        if(rendered){
+            this.onLayout(shallow, forceLayout);
+        }
+        // Initial layout completed
+        this.hasLayout = true;
+        delete this.forceLayout;
+    },
+
+    onLayout : Ext.emptyFn,
+
+    // private
+    shouldBufferLayout: function(){
+        /*
+         * Returns true if the container should buffer a layout.
+         * This is true only if the container has previously been laid out
+         * and has a parent container that is pending a layout.
+         */
+        var hl = this.hasLayout;
+        if(this.ownerCt){
+            // Only ever buffer if we've laid out the first time and we have one pending.
+            return hl ? !this.hasLayoutPending() : false;
+        }
+        // Never buffer initial layout
+        return hl;
+    },
+
+    // private
+    hasLayoutPending: function(){
+        // Traverse hierarchy to see if any parent container has a pending layout.
+        var pending = false;
+        this.ownerCt.bubble(function(c){
+            if(c.layoutPending){
+                pending = true;
+                return false;
+            }
+        });
+        return pending;
+    },
+
+    onShow : function(){
+        // removes css classes that were added to hide
+        Ext.Container.superclass.onShow.call(this);
+        // If we were sized during the time we were hidden, layout.
+        if(Ext.isDefined(this.deferLayout)){
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+    },
+
+    /**
+     * Returns the layout currently in use by the container.  If the container does not currently have a layout
+     * set, a default {@link Ext.layout.ContainerLayout} will be created and set as the container's layout.
+     * @return {ContainerLayout} layout The container's layout
+     */
+    getLayout : function(){
+        if(!this.layout){
+            var layout = new Ext.layout.AutoLayout(this.layoutConfig);
+            this.setLayout(layout);
+        }
+        return this.layout;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var c;
+        if(this.items){
+            while(c = this.items.first()){
+                this.doRemove(c, true);
+            }
+        }
+        if(this.monitorResize){
+            Ext.EventManager.removeResizeListener(this.doLayout, this);
+        }
+        Ext.destroy(this.layout);
+        Ext.Container.superclass.beforeDestroy.call(this);
+    },
+
+    /**
+     * Cascades down the component/container heirarchy from this component (called first), calling the specified function with
+     * each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current component)
+     * @param {Array} args (optional) The args to call the function with (defaults to passing the current component)
+     * @return {Ext.Container} this
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            if(this.items){
+                var cs = this.items.items;
+                for(var i = 0, len = cs.length; i < len; i++){
+                    if(cs[i].cascade){
+                        cs[i].cascade(fn, scope, args);
+                    }else{
+                        fn.apply(scope || cs[i], args || [cs[i]]);
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Find a component under this container at any level by id
+     * @param {String} id
+     * @deprecated Fairly useless method, since you can just use Ext.getCmp. Should be removed for 4.0
+     * If you need to test if an id belongs to a container, you can use getCmp and findParent*.
+     * @return Ext.Component
+     */
+    findById : function(id){
+        var m = null, 
+            ct = this;
+        this.cascade(function(c){
+            if(ct != c && c.id === id){
+                m = c;
+                return false;
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Find a component under this container at any level by xtype or class
+     * @param {String/Class} xtype The xtype string for a component, or the class of the component directly
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Array} Array of Ext.Components
+     */
+    findByType : function(xtype, shallow){
+        return this.findBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by property
+     * @param {String} prop
+     * @param {String} value
+     * @return {Array} Array of Ext.Components
+     */
+    find : function(prop, value){
+        return this.findBy(function(c){
+            return c[prop] === value;
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by a custom function. If the passed function returns
+     * true, the component will be included in the results. The passed function is called with the arguments (component, this container).
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional)
+     * @return {Array} Array of Ext.Components
+     */
+    findBy : function(fn, scope){
+        var m = [], ct = this;
+        this.cascade(function(c){
+            if(ct != c && fn.call(scope || c, c, ct) === true){
+                m.push(c);
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Get a component contained by this container (alias for items.get(key))
+     * @param {String/Number} key The index or id of the component
+     * @deprecated Should be removed in 4.0, since getComponent does the same thing.
+     * @return {Ext.Component} Ext.Component
+     */
+    get : function(key){
+        return this.getComponent(key);
+    }
+});
+
+Ext.Container.LAYOUTS = {};
+Ext.reg('container', Ext.Container);
+/**
+ * @class Ext.layout.ContainerLayout
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ */
+Ext.layout.ContainerLayout = Ext.extend(Object, {
+    /**
+     * @cfg {String} extraCls
+     * <p>An optional extra CSS class that will be added to the container. This can be useful for adding
+     * customized styles to the container or any of its children using standard CSS rules. See
+     * {@link Ext.Component}.{@link Ext.Component#ctCls ctCls} also.</p>
+     * <p><b>Note</b>: <tt>extraCls</tt> defaults to <tt>''</tt> except for the following classes
+     * which assign a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.AbsoluteLayout Absolute Layout} : <tt>'x-abs-layout-item'</tt></li>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-item'</tt></li>
+     * <li>{@link Ext.layout.ColumnLayout Column Layout} : <tt>'x-column'</tt></li>
+     * </ul></div>
+     * To configure the above Classes with an extra CSS class append to the default.  For example,
+     * for ColumnLayout:<pre><code>
+     * extraCls: 'x-column custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} renderHidden
+     * True to hide each contained item on render (defaults to false).
+     */
+
+    /**
+     * A reference to the {@link Ext.Component} that is active.  For example, <pre><code>
+     * if(myPanel.layout.activeItem.id == 'item-1') { ... }
+     * </code></pre>
+     * <tt>activeItem</tt> only applies to layout styles that can display items one at a time
+     * (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout}
+     * and {@link Ext.layout.FitLayout}).  Read-only.  Related to {@link Ext.Container#activeItem}.
+     * @type {Ext.Component}
+     * @property activeItem
+     */
+
+    // private
+    monitorResize:false,
+    // private
+    activeItem : null,
+
+    constructor : function(config){
+        this.id = Ext.id(null, 'ext-layout-');
+        Ext.apply(this, config);
+    },
+
+    type: 'container',
+
+    /* Workaround for how IE measures autoWidth elements.  It prefers bottom-up measurements
+      whereas other browser prefer top-down.  We will hide all target child elements before we measure and
+      put them back to get an accurate measurement.
+    */
+    IEMeasureHack : function(target, viewFlag) {
+        var tChildren = target.dom.childNodes, tLen = tChildren.length, c, d = [], e, i, ret;
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                d[i] = e.getStyle('display');
+                e.setStyle({display: 'none'});
+            }
+        }
+        ret = target ? target.getViewSize(viewFlag) : {};
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                e.setStyle({display: d[i]});
+            }
+        }
+        return ret;
+    },
+
+    // Placeholder for the derived layouts
+    getLayoutTargetSize : Ext.EmptyFn,
+
+    // private
+    layout : function(){
+        var ct = this.container, target = ct.getLayoutTarget();
+        if(!(this.hasLayout || Ext.isEmpty(this.targetCls))){
+            target.addClass(this.targetCls);
+        }
+        this.onLayout(ct, target);
+        ct.fireEvent('afterlayout', ct, this);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        this.renderAll(ct, target);
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && c.getPositionEl().dom.parentNode == (target.dom || target);
+    },
+
+    // private
+    renderAll : function(ct, target){
+        var items = ct.items.items, i, c, len = items.length;
+        for(i = 0; i < len; i++) {
+            c = items[i];
+            if(c && (!c.rendered || !this.isValidParent(c, target))){
+                this.renderItem(c, i, target);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Renders the given Component into the target Element. If the Component is already rendered,
+     * it is moved to the provided target instead.
+     * @param {Ext.Component} c The Component to render
+     * @param {Number} position The position within the target to render the item to
+     * @param {Ext.Element} target The target Element
+     */
+    renderItem : function(c, position, target){
+        if (c) {
+            if (!c.rendered) {
+                c.render(target, position);
+                this.configureItem(c);
+            } else if (!this.isValidParent(c, target)) {
+                if (Ext.isNumber(position)) {
+                    position = target.dom.childNodes[position];
+                }
+                
+                target.dom.insertBefore(c.getPositionEl().dom, position || null);
+                c.container = target;
+                this.configureItem(c);
+            }
+        }
+    },
+
+    // private.
+    // Get all rendered items to lay out.
+    getRenderedItems: function(ct){
+        var t = ct.getLayoutTarget(), cti = ct.items.items, len = cti.length, i, c, items = [];
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.shouldLayout !== false){
+                items.push(c);
+            }
+        };
+        return items;
+    },
+
+    /**
+     * @private
+     * Applies extraCls and hides the item if renderHidden is true
+     */
+    configureItem: function(c){
+        if (this.extraCls) {
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.addClass(this.extraCls);
+        }
+        
+        // If we are forcing a layout, do so *before* we hide so elements have height/width
+        if (c.doLayout && this.forceLayout) {
+            c.doLayout();
+        }
+        if (this.renderHidden && c != this.activeItem) {
+            c.hide();
+        }
+    },
+
+    onRemove: function(c){
+        if(this.activeItem == c){
+            delete this.activeItem;
+        }
+        if(c.rendered && this.extraCls){
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.removeClass(this.extraCls);
+        }
+    },
+
+    afterRemove: function(c){
+        if(c.removeRestore){
+            c.removeMode = 'container';
+            delete c.removeRestore;
+        }
+    },
+
+    // private
+    onResize: function(){
+        var ct = this.container,
+            b;
+        if(ct.collapsed){
+            return;
+        }
+        if(b = ct.bufferResize && ct.shouldBufferLayout()){
+            if(!this.resizeTask){
+                this.resizeTask = new Ext.util.DelayedTask(this.runLayout, this);
+                this.resizeBuffer = Ext.isNumber(b) ? b : 50;
+            }
+            ct.layoutPending = true;
+            this.resizeTask.delay(this.resizeBuffer);
+        }else{
+            this.runLayout();
+        }
+    },
+
+    runLayout: function(){
+        var ct = this.container;
+        this.layout();
+        ct.onLayout();
+        delete ct.layoutPending;
+    },
+
+    // private
+    setContainer : function(ct){
+        /**
+         * This monitorResize flag will be renamed soon as to avoid confusion
+         * with the Container version which hooks onWindowResize to doLayout
+         *
+         * monitorResize flag in this context attaches the resize event between
+         * a container and it's layout
+         */
+        if(this.monitorResize && ct != this.container){
+            var old = this.container;
+            if(old){
+                old.un(old.resizeEvent, this.onResize, this);
+            }
+            if(ct){
+                ct.on(ct.resizeEvent, this.onResize, this);
+            }
+        }
+        this.container = ct;
+    },
+
+    /**
+     * Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations
+     * (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result)
+     * @param {Number|String} v The encoded margins
+     * @return {Object} An object with margin sizes for top, right, bottom and left
+     */
+    parseMargins : function(v){
+        if (Ext.isNumber(v)) {
+            v = v.toString();
+        }
+        var ms  = v.split(' '),
+            len = ms.length;
+            
+        if (len == 1) {
+            ms[1] = ms[2] = ms[3] = ms[0];
+        } else if(len == 2) {
+            ms[2] = ms[0];
+            ms[3] = ms[1];
+        } else if(len == 3) {
+            ms[3] = ms[1];
+        }
+        
+        return {
+            top   :parseInt(ms[0], 10) || 0,
+            right :parseInt(ms[1], 10) || 0,
+            bottom:parseInt(ms[2], 10) || 0,
+            left  :parseInt(ms[3], 10) || 0
+        };
+    },
+
+    /**
+     * The {@link Ext.Template Ext.Template} used by Field rendering layout classes (such as
+     * {@link Ext.layout.FormLayout}) to create the DOM structure of a fully wrapped,
+     * labeled and styled form Field. A default Template is supplied, but this may be
+     * overriden to create custom field structures. The template processes values returned from
+     * {@link Ext.layout.FormLayout#getTemplateArgs}.
+     * @property fieldTpl
+     * @type Ext.Template
+     */
+    fieldTpl: (function() {
+        var t = new Ext.Template(
+            '<div class="x-form-item {itemCls}" tabIndex="-1">',
+                '<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>',
+                '<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">',
+                '</div><div class="{clearCls}"></div>',
+            '</div>'
+        );
+        t.disableFormats = true;
+        return t.compile();
+    })(),
+
+    /*
+     * Destroys this layout. This is a template method that is empty by default, but should be implemented
+     * by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
+     * @protected
+     */
+    destroy : function(){
+        // Stop any buffered layout tasks
+        if(this.resizeTask && this.resizeTask.cancel){
+            this.resizeTask.cancel();
+        }
+        if(this.container) {
+            this.container.un(this.container.resizeEvent, this.onResize, this);
+        }
+        if(!Ext.isEmpty(this.targetCls)){
+            var target = this.container.getLayoutTarget();
+            if(target){
+                target.removeClass(this.targetCls);
+            }
+        }
+    }
+});/**
+ * @class Ext.layout.AutoLayout
+ * <p>The AutoLayout is the default layout manager delegated by {@link Ext.Container} to
+ * render any child Components when no <tt>{@link Ext.Container#layout layout}</tt> is configured into
+ * a {@link Ext.Container Container}.</tt>.  AutoLayout provides only a passthrough of any layout calls
+ * to any child containers.</p>
+ */
+Ext.layout.AutoLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    type: 'auto',
+
+    monitorResize: true,
+
+    onLayout : function(ct, target){
+        Ext.layout.AutoLayout.superclass.onLayout.call(this, ct, target);
+        var cs = this.getRenderedItems(ct), len = cs.length, i, c;
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            if (c.doLayout){
+                // Shallow layout children
+                c.doLayout(true);
+            }
+        }
+    }
+});
+
+Ext.Container.LAYOUTS['auto'] = Ext.layout.AutoLayout;
+/**
+ * @class Ext.layout.FitLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a base class for layouts that contain <b>a single item</b> that automatically expands to fill the layout's
+ * container.  This class is intended to be extended or created via the <tt>layout:'fit'</tt> {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>FitLayout does not have any direct config options (other than inherited ones).  To fit a panel to a container
+ * using FitLayout, simply set layout:'fit' on the container and add a single panel to it.  If the container has
+ * multiple panels, only the first one will be displayed.  Example usage:</p>
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Fit Layout',
+    layout:'fit',
+    items: {
+        title: 'Inner Panel',
+        html: '&lt;p&gt;This is the inner panel content&lt;/p&gt;',
+        border: false
+    }
+});
+</code></pre>
+ */
+Ext.layout.FitLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'fit',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        if (!target) {
+            return {};
+        }
+        // Style Sized (scrollbars not included)
+        return target.getStyleSize();
+    },
+
+    // private
+    onLayout : function(ct, target){
+        Ext.layout.FitLayout.superclass.onLayout.call(this, ct, target);
+        if(!ct.collapsed){
+            this.setItemSize(this.activeItem || ct.items.itemAt(0), this.getLayoutTargetSize());
+        }
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(item && size.height > 0){ // display none?
+            item.setSize(size);
+        }
+    }
+});
+Ext.Container.LAYOUTS['fit'] = Ext.layout.FitLayout;/**
+ * @class Ext.layout.CardLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This layout manages multiple child Components, each fitted to the Container, where only a single child Component can be
+ * visible at any given time.  This layout style is most commonly used for wizards, tab implementations, etc.
+ * This class is intended to be extended or created via the layout:'card' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>The CardLayout's focal method is {@link #setActiveItem}.  Since only one panel is displayed at a time,
+ * the only way to move from one Component to the next is by calling setActiveItem, passing the id or index of
+ * the next panel to display.  The layout itself does not provide a user interface for handling this navigation,
+ * so that functionality must be provided by the developer.</p>
+ * <p>In the following example, a simplistic wizard setup is demonstrated.  A button bar is added
+ * to the footer of the containing panel to provide navigation buttons.  The buttons will be handled by a
+ * common navigation routine -- for this example, the implementation of that routine has been ommitted since
+ * it can be any type of custom logic.  Note that other uses of a CardLayout (like a tab control) would require a
+ * completely different implementation.  For serious implementations, a better approach would be to extend
+ * CardLayout to provide the custom functionality needed.  Example usage:</p>
+ * <pre><code>
+var navHandler = function(direction){
+    // This routine could contain business logic required to manage the navigation steps.
+    // It would call setActiveItem as needed, manage navigation button state, handle any
+    // branching logic that might be required, handle alternate actions like cancellation
+    // or finalization, etc.  A complete wizard implementation could get pretty
+    // sophisticated depending on the complexity required, and should probably be
+    // done as a subclass of CardLayout in a real-world implementation.
+};
+
+var card = new Ext.Panel({
+    title: 'Example Wizard',
+    layout:'card',
+    activeItem: 0, // make sure the active item is set on the container config!
+    bodyStyle: 'padding:15px',
+    defaults: {
+        // applied to each contained panel
+        border:false
+    },
+    // just an example of one possible navigation scheme, using buttons
+    bbar: [
+        {
+            id: 'move-prev',
+            text: 'Back',
+            handler: navHandler.createDelegate(this, [-1]),
+            disabled: true
+        },
+        '->', // greedy spacer so that the buttons are aligned to each side
+        {
+            id: 'move-next',
+            text: 'Next',
+            handler: navHandler.createDelegate(this, [1])
+        }
+    ],
+    // the panels (or "cards") within the layout
+    items: [{
+        id: 'card-0',
+        html: '&lt;h1&gt;Welcome to the Wizard!&lt;/h1&gt;&lt;p&gt;Step 1 of 3&lt;/p&gt;'
+    },{
+        id: 'card-1',
+        html: '&lt;p&gt;Step 2 of 3&lt;/p&gt;'
+    },{
+        id: 'card-2',
+        html: '&lt;h1&gt;Congratulations!&lt;/h1&gt;&lt;p&gt;Step 3 of 3 - Complete&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.CardLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} deferredRender
+     * True to render each contained item at the time it becomes active, false to render all contained items
+     * as soon as the layout is rendered (defaults to false).  If there is a significant amount of content or
+     * a lot of heavy controls being rendered into panels that are not displayed by default, setting this to
+     * true might improve performance.
+     */
+    deferredRender : false,
+
+    /**
+     * @cfg {Boolean} layoutOnCardChange
+     * True to force a layout of the active item when the active card is changed. Defaults to false.
+     */
+    layoutOnCardChange : false,
+
+    /**
+     * @cfg {Boolean} renderHidden @hide
+     */
+    // private
+    renderHidden : true,
+
+    type: 'card',
+
+    /**
+     * Sets the active (visible) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        var ai = this.activeItem,
+            ct = this.container;
+        item = ct.getComponent(item);
+
+        // Is this a valid, different card?
+        if(item && ai != item){
+
+            // Changing cards, hide the current one
+            if(ai){
+                ai.hide();
+                if (ai.hidden !== true) {
+                    return false;
+                }
+                ai.fireEvent('deactivate', ai);
+            }
+
+            var layout = item.doLayout && (this.layoutOnCardChange || !item.rendered);
+
+            // Change activeItem reference
+            this.activeItem = item;
+
+            // The container is about to get a recursive layout, remove any deferLayout reference
+            // because it will trigger a redundant layout.
+            delete item.deferLayout;
+
+            // Show the new component
+            item.show();
+
+            this.layout();
+
+            if(layout){
+                item.doLayout();
+            }
+            item.fireEvent('activate', item);
+        }
+    },
+
+    // private
+    renderAll : function(ct, target){
+        if(this.deferredRender){
+            this.renderItem(this.activeItem, undefined, target);
+        }else{
+            Ext.layout.CardLayout.superclass.renderAll.call(this, ct, target);
+        }
+    }
+});
+Ext.Container.LAYOUTS['card'] = Ext.layout.CardLayout;
+/**
+ * @class Ext.layout.AnchorLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a layout that enables anchoring of contained elements relative to the container's dimensions.
+ * If the container is resized, all anchored items are automatically rerendered according to their
+ * <b><tt>{@link #anchor}</tt></b> rules.</p>
+ * <p>This class is intended to be extended or created via the layout:'anchor' {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>AnchorLayout does not have any direct config options (other than inherited ones). By default,
+ * AnchorLayout will calculate anchor measurements based on the size of the container itself. However, the
+ * container using the AnchorLayout can supply an anchoring-specific config property of <b>anchorSize</b>.
+ * If anchorSize is specifed, the layout will use it as a virtual container for the purposes of calculating
+ * anchor measurements based on it instead, allowing the container to be sized independently of the anchoring
+ * logic if necessary.  For example:</p>
+ * <pre><code>
+var viewport = new Ext.Viewport({
+    layout:'anchor',
+    anchorSize: {width:800, height:600},
+    items:[{
+        title:'Item 1',
+        html:'Content 1',
+        width:800,
+        anchor:'right 20%'
+    },{
+        title:'Item 2',
+        html:'Content 2',
+        width:300,
+        anchor:'50% 30%'
+    },{
+        title:'Item 3',
+        html:'Content 3',
+        width:600,
+        anchor:'-100 50%'
+    }]
+});
+ * </code></pre>
+ */
+Ext.layout.AnchorLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {String} anchor
+     * <p>This configuation option is to be applied to <b>child <tt>items</tt></b> of a container managed by
+     * this layout (ie. configured with <tt>layout:'anchor'</tt>).</p><br/>
+     *
+     * <p>This value is what tells the layout how an item should be anchored to the container. <tt>items</tt>
+     * added to an AnchorLayout accept an anchoring-specific config property of <b>anchor</b> which is a string
+     * containing two values: the horizontal anchor value and the vertical anchor value (for example, '100% 50%').
+     * The following types of anchor values are supported:<div class="mdetail-params"><ul>
+     *
+     * <li><b>Percentage</b> : Any value between 1 and 100, expressed as a percentage.<div class="sub-desc">
+     * The first anchor is the percentage width that the item should take up within the container, and the
+     * second is the percentage height.  For example:<pre><code>
+// two values specified
+anchor: '100% 50%' // render item complete width of the container and
+                   // 1/2 height of the container
+// one value specified
+anchor: '100%'     // the width value; the height will default to auto
+     * </code></pre></div></li>
+     *
+     * <li><b>Offsets</b> : Any positive or negative integer value.<div class="sub-desc">
+     * This is a raw adjustment where the first anchor is the offset from the right edge of the container,
+     * and the second is the offset from the bottom edge. For example:<pre><code>
+// two values specified
+anchor: '-50 -100' // render item the complete width of the container
+                   // minus 50 pixels and
+                   // the complete height minus 100 pixels.
+// one value specified
+anchor: '-50'      // anchor value is assumed to be the right offset value
+                   // bottom offset will default to 0
+     * </code></pre></div></li>
+     *
+     * <li><b>Sides</b> : Valid values are <tt>'right'</tt> (or <tt>'r'</tt>) and <tt>'bottom'</tt>
+     * (or <tt>'b'</tt>).<div class="sub-desc">
+     * Either the container must have a fixed size or an anchorSize config value defined at render time in
+     * order for these to have any effect.</div></li>
+     *
+     * <li><b>Mixed</b> : <div class="sub-desc">
+     * Anchor values can also be mixed as needed.  For example, to render the width offset from the container
+     * right edge by 50 pixels and 75% of the container's height use:
+     * <pre><code>
+anchor: '-50 75%'
+     * </code></pre></div></li>
+     *
+     *
+     * </ul></div>
+     */
+
+    // private
+    monitorResize : true,
+
+    type : 'anchor',
+
+    /**
+     * @cfg {String} defaultAnchor
+     *
+     * default anchor for all child container items applied if no anchor or specific width is set on the child item.  Defaults to '100%'.
+     *
+     */
+    defaultAnchor : '100%',
+
+    parseAnchorRE : /^(r|right|b|bottom)$/i,
+
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret = {};
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    // private
+    onLayout : function(container, target) {
+        Ext.layout.AnchorLayout.superclass.onLayout.call(this, container, target);
+
+        var size = this.getLayoutTargetSize(),
+            containerWidth = size.width,
+            containerHeight = size.height,
+            overflow = target.getStyle('overflow'),
+            components = this.getRenderedItems(container),
+            len = components.length,
+            boxes = [],
+            box,
+            anchorWidth,
+            anchorHeight,
+            component,
+            anchorSpec,
+            calcWidth,
+            calcHeight,
+            anchorsArray,
+            totalHeight = 0,
+            i,
+            el;
+
+        if(containerWidth < 20 && containerHeight < 20){
+            return;
+        }
+
+        // find the container anchoring size
+        if(container.anchorSize) {
+            if(typeof container.anchorSize == 'number') {
+                anchorWidth = container.anchorSize;
+            } else {
+                anchorWidth = container.anchorSize.width;
+                anchorHeight = container.anchorSize.height;
+            }
+        } else {
+            anchorWidth = container.initialConfig.width;
+            anchorHeight = container.initialConfig.height;
+        }
+
+        for(i = 0; i < len; i++) {
+            component = components[i];
+            el = component.getPositionEl();
+
+            // If a child container item has no anchor and no specific width, set the child to the default anchor size
+            if (!component.anchor && component.items && !Ext.isNumber(component.width) && !(Ext.isIE6 && Ext.isStrict)){
+                component.anchor = this.defaultAnchor;
+            }
+
+            if(component.anchor) {
+                anchorSpec = component.anchorSpec;
+                // cache all anchor values
+                if(!anchorSpec){
+                    anchorsArray = component.anchor.split(' ');
+                    component.anchorSpec = anchorSpec = {
+                        right: this.parseAnchor(anchorsArray[0], component.initialConfig.width, anchorWidth),
+                        bottom: this.parseAnchor(anchorsArray[1], component.initialConfig.height, anchorHeight)
+                    };
+                }
+                calcWidth = anchorSpec.right ? this.adjustWidthAnchor(anchorSpec.right(containerWidth) - el.getMargins('lr'), component) : undefined;
+                calcHeight = anchorSpec.bottom ? this.adjustHeightAnchor(anchorSpec.bottom(containerHeight) - el.getMargins('tb'), component) : undefined;
+
+                if(calcWidth || calcHeight) {
+                    boxes.push({
+                        component: component,
+                        width: calcWidth || undefined,
+                        height: calcHeight || undefined
+                    });
+                }
+            }
+        }
+        for (i = 0, len = boxes.length; i < len; i++) {
+            box = boxes[i];
+            box.component.setSize(box.width, box.height);
+        }
+
+        if (overflow && overflow != 'hidden' && !this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != size.width || newTargetSize.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    parseAnchor : function(a, start, cstart) {
+        if (a && a != 'none') {
+            var last;
+            // standard anchor
+            if (this.parseAnchorRE.test(a)) {
+                var diff = cstart - start;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return v - diff;
+                    }
+                };
+            // percentage
+            } else if(a.indexOf('%') != -1) {
+                var ratio = parseFloat(a.replace('%', ''))*.01;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return Math.floor(v*ratio);
+                    }
+                };
+            // simple offset adjustment
+            } else {
+                a = parseInt(a, 10);
+                if (!isNaN(a)) {
+                    return function(v) {
+                        if (v !== last) {
+                            last = v;
+                            return v + a;
+                        }
+                    };
+                }
+            }
+        }
+        return false;
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return value;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['anchor'] = Ext.layout.AnchorLayout;
+/**
+ * @class Ext.layout.ColumnLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is the layout style of choice for creating structural layouts in a multi-column format where the width of
+ * each column can be specified as a percentage or fixed width, but the height is allowed to vary based on the content.
+ * This class is intended to be extended or created via the layout:'column' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>ColumnLayout does not have any direct config options (other than inherited ones), but it does support a
+ * specific config property of <b><tt>columnWidth</tt></b> that can be included in the config of any panel added to it.  The
+ * layout will use the columnWidth (if present) or width of each panel during layout to determine how to size each panel.
+ * If width or columnWidth is not specified for a given panel, its width will default to the panel's width (or auto).</p>
+ * <p>The width property is always evaluated as pixels, and must be a number greater than or equal to 1.
+ * The columnWidth property is always evaluated as a percentage, and must be a decimal value greater than 0 and
+ * less than 1 (e.g., .25).</p>
+ * <p>The basic rules for specifying column widths are pretty simple.  The logic makes two passes through the
+ * set of contained panels.  During the first layout pass, all panels that either have a fixed width or none
+ * specified (auto) are skipped, but their widths are subtracted from the overall container width.  During the second
+ * pass, all panels with columnWidths are assigned pixel widths in proportion to their percentages based on
+ * the total <b>remaining</b> container width.  In other words, percentage width panels are designed to fill the space
+ * left over by all the fixed-width and/or auto-width panels.  Because of this, while you can specify any number of columns
+ * with different percentages, the columnWidths must always add up to 1 (or 100%) when added together, otherwise your
+ * layout may not render as expected.  Example usage:</p>
+ * <pre><code>
+// All columns are percentages -- they must add up to 1
+var p = new Ext.Panel({
+    title: 'Column Layout - Percentage Only',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        columnWidth: .25
+    },{
+        title: 'Column 2',
+        columnWidth: .6
+    },{
+        title: 'Column 3',
+        columnWidth: .15
+    }]
+});
+
+// Mix of width and columnWidth -- all columnWidth values must add up
+// to 1. The first column will take up exactly 120px, and the last two
+// columns will fill the remaining container width.
+var p = new Ext.Panel({
+    title: 'Column Layout - Mixed',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        width: 120
+    },{
+        title: 'Column 2',
+        columnWidth: .8
+    },{
+        title: 'Column 3',
+        columnWidth: .2
+    }]
+});
+</code></pre>
+ */
+Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'column',
+
+    extraCls: 'x-column',
+
+    scrollOffset : 0,
+
+    // private
+
+    targetCls: 'x-column-layout-ct',
+
+    isValidParent : function(c, target){
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    renderAll : function(ct, target) {
+        if(!this.innerCt){
+            // the innerCt prevents wrapping and shuffling while
+            // the container is resizing
+            this.innerCt = target.createChild({cls:'x-column-inner'});
+            this.innerCt.createChild({cls:'x-clear'});
+        }
+        Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items,
+            len = cs.length,
+            c,
+            i,
+            m,
+            margins = [];
+
+        this.renderAll(ct, target);
+
+        var size = this.getLayoutTargetSize();
+
+        if(size.width < 1 && size.height < 1){ // display none?
+            return;
+        }
+
+        var w = size.width - this.scrollOffset,
+            h = size.height,
+            pw = w;
+
+        this.innerCt.setWidth(w);
+
+        // some columns can be percentages while others are fixed
+        // so we need to make 2 passes
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = c.getPositionEl().getMargins('lr');
+            margins[i] = m;
+            if(!c.columnWidth){
+                pw -= (c.getWidth() + m);
+            }
+        }
+
+        pw = pw < 0 ? 0 : pw;
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = margins[i];
+            if(c.columnWidth){
+                c.setSize(Math.floor(c.columnWidth * pw) - m);
+            }
+        }
+
+        // Browsers differ as to when they account for scrollbars.  We need to re-measure to see if the scrollbar
+        // spaces were accounted for properly.  If not, re-layout.
+        if (Ext.isIE) {
+            if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+                var ts = this.getLayoutTargetSize();
+                if (ts.width != size.width){
+                    this.adjustmentPass = true;
+                    this.onLayout(ct, target);
+                }
+            }
+        }
+        delete this.adjustmentPass;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['column'] = Ext.layout.ColumnLayout;
+/**
+ * @class Ext.layout.BorderLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a multi-pane, application-oriented UI layout style that supports multiple
+ * nested panels, automatic {@link Ext.layout.BorderLayout.Region#split split} bars between
+ * {@link Ext.layout.BorderLayout.Region#BorderLayout.Region regions} and built-in
+ * {@link Ext.layout.BorderLayout.Region#collapsible expanding and collapsing} of regions.</p>
+ * <p>This class is intended to be extended or created via the <tt>layout:'border'</tt>
+ * {@link Ext.Container#layout} config, and should generally not need to be created directly
+ * via the new keyword.</p>
+ * <p>BorderLayout does not have any direct config options (other than inherited ones).
+ * All configuration options available for customizing the BorderLayout are at the
+ * {@link Ext.layout.BorderLayout.Region} and {@link Ext.layout.BorderLayout.SplitRegion}
+ * levels.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var myBorderPanel = new Ext.Panel({
+    {@link Ext.Component#renderTo renderTo}: document.body,
+    {@link Ext.BoxComponent#width width}: 700,
+    {@link Ext.BoxComponent#height height}: 500,
+    {@link Ext.Panel#title title}: 'Border Layout',
+    {@link Ext.Container#layout layout}: 'border',
+    {@link Ext.Container#items items}: [{
+        {@link Ext.Panel#title title}: 'South Region is resizable',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'south',     // position for region
+        {@link Ext.BoxComponent#height height}: 100,
+        {@link Ext.layout.BorderLayout.Region#split split}: true,         // enable resizing
+        {@link Ext.SplitBar#minSize minSize}: 75,         // defaults to {@link Ext.layout.BorderLayout.Region#minHeight 50}
+        {@link Ext.SplitBar#maxSize maxSize}: 150,
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '0 5 5 5'
+    },{
+        // xtype: 'panel' implied by default
+        {@link Ext.Panel#title title}: 'West Region is collapsible',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}:'west',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 0 0 5',
+        {@link Ext.BoxComponent#width width}: 200,
+        {@link Ext.layout.BorderLayout.Region#collapsible collapsible}: true,   // make collapsible
+        {@link Ext.layout.BorderLayout.Region#cmargins cmargins}: '5 5 0 5', // adjust top margin when collapsed
+        {@link Ext.Component#id id}: 'west-region-container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.Panel#unstyled unstyled}: true
+    },{
+        {@link Ext.Panel#title title}: 'Center Region',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'center',     // center region is required, no width/height specified
+        {@link Ext.Component#xtype xtype}: 'container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 5 0 0'
+    }]
+});
+</code></pre>
+ * <p><b><u>Notes</u></b>:</p><div class="mdetail-params"><ul>
+ * <li>Any container using the BorderLayout <b>must</b> have a child item with <tt>region:'center'</tt>.
+ * The child item in the center region will always be resized to fill the remaining space not used by
+ * the other regions in the layout.</li>
+ * <li>Any child items with a region of <tt>west</tt> or <tt>east</tt> must have <tt>width</tt> defined
+ * (an integer representing the number of pixels that the region should take up).</li>
+ * <li>Any child items with a region of <tt>north</tt> or <tt>south</tt> must have <tt>height</tt> defined.</li>
+ * <li>The regions of a BorderLayout are <b>fixed at render time</b> and thereafter, its child Components may not be removed or added</b>.  To add/remove
+ * Components within a BorderLayout, have them wrapped by an additional Container which is directly
+ * managed by the BorderLayout.  If the region is to be collapsible, the Container used directly
+ * by the BorderLayout manager should be a Panel.  In the following example a Container (an Ext.Panel)
+ * is added to the west region:
+ * <div style="margin-left:16px"><pre><code>
+wrc = {@link Ext#getCmp Ext.getCmp}('west-region-container');
+wrc.{@link Ext.Panel#removeAll removeAll}();
+wrc.{@link Ext.Container#add add}({
+    title: 'Added Panel',
+    html: 'Some content'
+});
+wrc.{@link Ext.Container#doLayout doLayout}();
+ * </code></pre></div>
+ * </li>
+ * <li> To reference a {@link Ext.layout.BorderLayout.Region Region}:
+ * <div style="margin-left:16px"><pre><code>
+wr = myBorderPanel.layout.west;
+ * </code></pre></div>
+ * </li>
+ * </ul></div>
+ */
+Ext.layout.BorderLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+    // private
+    rendered : false,
+
+    type: 'border',
+
+    targetCls: 'x-border-layout-ct',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        return target ? target.getViewSize() : {};
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var collapsed, i, c, pos, items = ct.items.items, len = items.length;
+        if(!this.rendered){
+            collapsed = [];
+            for(i = 0; i < len; i++) {
+                c = items[i];
+                pos = c.region;
+                if(c.collapsed){
+                    collapsed.push(c);
+                }
+                c.collapsed = false;
+                if(!c.rendered){
+                    c.render(target, i);
+                    c.getPositionEl().addClass('x-border-panel');
+                }
+                this[pos] = pos != 'center' && c.split ?
+                    new Ext.layout.BorderLayout.SplitRegion(this, c.initialConfig, pos) :
+                    new Ext.layout.BorderLayout.Region(this, c.initialConfig, pos);
+                this[pos].render(target, c);
+            }
+            this.rendered = true;
+        }
+
+        var size = this.getLayoutTargetSize();
+        if(size.width < 20 || size.height < 20){ // display none?
+            if(collapsed){
+                this.restoreCollapsed = collapsed;
+            }
+            return;
+        }else if(this.restoreCollapsed){
+            collapsed = this.restoreCollapsed;
+            delete this.restoreCollapsed;
+        }
+
+        var w = size.width, h = size.height,
+            centerW = w, centerH = h, centerY = 0, centerX = 0,
+            n = this.north, s = this.south, west = this.west, e = this.east, c = this.center,
+            b, m, totalWidth, totalHeight;
+        if(!c && Ext.layout.BorderLayout.WARN !== false){
+            throw 'No center region defined in BorderLayout ' + ct.id;
+        }
+
+        if(n && n.isVisible()){
+            b = n.getSize();
+            m = n.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            b.y = m.top;
+            centerY = b.height + b.y + m.bottom;
+            centerH -= centerY;
+            n.applyLayout(b);
+        }
+        if(s && s.isVisible()){
+            b = s.getSize();
+            m = s.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            totalHeight = (b.height + m.top + m.bottom);
+            b.y = h - totalHeight + m.top;
+            centerH -= totalHeight;
+            s.applyLayout(b);
+        }
+        if(west && west.isVisible()){
+            b = west.getSize();
+            m = west.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            b.x = m.left;
+            b.y = centerY + m.top;
+            totalWidth = (b.width + m.left + m.right);
+            centerX += totalWidth;
+            centerW -= totalWidth;
+            west.applyLayout(b);
+        }
+        if(e && e.isVisible()){
+            b = e.getSize();
+            m = e.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            totalWidth = (b.width + m.left + m.right);
+            b.x = w - totalWidth + m.left;
+            b.y = centerY + m.top;
+            centerW -= totalWidth;
+            e.applyLayout(b);
+        }
+        if(c){
+            m = c.getMargins();
+            var centerBox = {
+                x: centerX + m.left,
+                y: centerY + m.top,
+                width: centerW - (m.left+m.right),
+                height: centerH - (m.top+m.bottom)
+            };
+            c.applyLayout(centerBox);
+        }
+        if(collapsed){
+            for(i = 0, len = collapsed.length; i < len; i++){
+                collapsed[i].collapse(false);
+            }
+        }
+        if(Ext.isIE && Ext.isStrict){ // workaround IE strict repainting issue
+            target.repaint();
+        }
+        // Putting a border layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+            var ts = this.getLayoutTargetSize();
+            if (ts.width != size.width || ts.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(ct, target);
+            }
+        }
+        delete this.adjustmentPass;
+    },
+
+    destroy: function() {
+        var r = ['north', 'south', 'east', 'west'], i, region;
+        for (i = 0; i < r.length; i++) {
+            region = this[r[i]];
+            if(region){
+                if(region.destroy){
+                    region.destroy();
+                }else if (region.split){
+                    region.split.destroy(true);
+                }
+            }
+        }
+        Ext.layout.BorderLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+/**
+ * @class Ext.layout.BorderLayout.Region
+ * <p>This is a region of a {@link Ext.layout.BorderLayout BorderLayout} that acts as a subcontainer
+ * within the layout.  Each region has its own {@link Ext.layout.ContainerLayout layout} that is
+ * independent of other regions and the containing BorderLayout, and can be any of the
+ * {@link Ext.layout.ContainerLayout valid Ext layout types}.</p>
+ * <p>Region size is managed automatically and cannot be changed by the user -- for
+ * {@link #split resizable regions}, see {@link Ext.layout.BorderLayout.SplitRegion}.</p>
+ * @constructor
+ * Create a new Region.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: <tt>north</tt>, <tt>south</tt>,
+ * <tt>east</tt>, <tt>west</tt> and <tt>center</tt>.  Every {@link Ext.layout.BorderLayout BorderLayout}
+ * <b>must have a center region</b> for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.Region = function(layout, config, pos){
+    Ext.apply(this, config);
+    this.layout = layout;
+    this.position = pos;
+    this.state = {};
+    if(typeof this.margins == 'string'){
+        this.margins = this.layout.parseMargins(this.margins);
+    }
+    this.margins = Ext.applyIf(this.margins || {}, this.defaultMargins);
+    if(this.collapsible){
+        if(typeof this.cmargins == 'string'){
+            this.cmargins = this.layout.parseMargins(this.cmargins);
+        }
+        if(this.collapseMode == 'mini' && !this.cmargins){
+            this.cmargins = {left:0,top:0,right:0,bottom:0};
+        }else{
+            this.cmargins = Ext.applyIf(this.cmargins || {},
+                pos == 'north' || pos == 'south' ? this.defaultNSCMargins : this.defaultEWCMargins);
+        }
+    }
+};
+
+Ext.layout.BorderLayout.Region.prototype = {
+    /**
+     * @cfg {Boolean} animFloat
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel that will close again once the user mouses out of that panel (or clicks out if
+     * <tt>{@link #autoHide} = false</tt>).  Setting <tt>{@link #animFloat} = false</tt> will
+     * prevent the open and close of these floated panels from being animated (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {Boolean} autoHide
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel.  If <tt>autoHide = true</tt>, the panel will automatically hide after the user mouses
+     * out of the panel.  If <tt>autoHide = false</tt>, the panel will continue to display until the
+     * user clicks outside of the panel (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {String} collapseMode
+     * <tt>collapseMode</tt> supports two configuration values:<div class="mdetail-params"><ul>
+     * <li><b><tt>undefined</tt></b> (default)<div class="sub-desc">By default, {@link #collapsible}
+     * regions are collapsed by clicking the expand/collapse tool button that renders into the region's
+     * title bar.</div></li>
+     * <li><b><tt>'mini'</tt></b><div class="sub-desc">Optionally, when <tt>collapseMode</tt> is set to
+     * <tt>'mini'</tt> the region's split bar will also display a small collapse button in the center of
+     * the bar. In <tt>'mini'</tt> mode the region will collapse to a thinner bar than in normal mode.
+     * </div></li>
+     * </ul></div></p>
+     * <p><b>Note</b>: if a collapsible region does not have a title bar, then set <tt>collapseMode =
+     * 'mini'</tt> and <tt>{@link #split} = true</tt> in order for the region to be {@link #collapsible}
+     * by the user as the expand/collapse tool button (that would go in the title bar) will not be rendered.</p>
+     * <p>See also <tt>{@link #cmargins}</tt>.</p>
+     */
+    /**
+     * @cfg {Object} margins
+     * An object containing margins to apply to the region when in the expanded state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} cmargins
+     * An object containing margins to apply to the region when in the collapsed state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values.</p>
+     * <p><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></p>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <p><tt>true</tt> to allow the user to collapse this region (defaults to <tt>false</tt>).  If
+     * <tt>true</tt>, an expand/collapse tool button will automatically be rendered into the title
+     * bar of the region, otherwise the button will not be shown.</p>
+     * <p><b>Note</b>: that a title bar is required to display the collapse/expand toggle button -- if
+     * no <tt>title</tt> is specified for the region's panel, the region will only be collapsible if
+     * <tt>{@link #collapseMode} = 'mini'</tt> and <tt>{@link #split} = true</tt>.
+     */
+    collapsible : false,
+    /**
+     * @cfg {Boolean} split
+     * <p><tt>true</tt> to create a {@link Ext.layout.BorderLayout.SplitRegion SplitRegion} and
+     * display a 5px wide {@link Ext.SplitBar} between this region and its neighbor, allowing the user to
+     * resize the regions dynamically.  Defaults to <tt>false</tt> creating a
+     * {@link Ext.layout.BorderLayout.Region Region}.</p><br>
+     * <p><b>Notes</b>:</p><div class="mdetail-params"><ul>
+     * <li>this configuration option is ignored if <tt>region='center'</tt></li>
+     * <li>when <tt>split == true</tt>, it is common to specify a
+     * <tt>{@link Ext.SplitBar#minSize minSize}</tt> and <tt>{@link Ext.SplitBar#maxSize maxSize}</tt>
+     * for the {@link Ext.BoxComponent BoxComponent} representing the region. These are not native
+     * configs of {@link Ext.BoxComponent BoxComponent}, and are used only by this class.</li>
+     * <li>if <tt>{@link #collapseMode} = 'mini'</tt> requires <tt>split = true</tt> to reserve space
+     * for the collapse tool</tt></li>
+     * </ul></div>
+     */
+    split:false,
+    /**
+     * @cfg {Boolean} floatable
+     * <tt>true</tt> to allow clicking a collapsed region's bar to display the region's panel floated
+     * above the layout, <tt>false</tt> to force the user to fully expand a collapsed region by
+     * clicking the expand button to see it again (defaults to <tt>true</tt>).
+     */
+    floatable: true,
+    /**
+     * @cfg {Number} minWidth
+     * <p>The minimum allowable width in pixels for this region (defaults to <tt>50</tt>).
+     * <tt>maxWidth</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minWidth</tt> / <tt>maxWidth</tt>.</p>
+     */
+    minWidth:50,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum allowable height in pixels for this region (defaults to <tt>50</tt>)
+     * <tt>maxHeight</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minHeight</tt> / <tt>maxHeight</tt>.</p>
+     */
+    minHeight:50,
+
+    // private
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    // private
+    defaultNSCMargins : {left:5,top:5,right:5,bottom:5},
+    // private
+    defaultEWCMargins : {left:5,top:0,right:5,bottom:0},
+    floatingZIndex: 100,
+
+    /**
+     * True if this region is collapsed. Read-only.
+     * @type Boolean
+     * @property
+     */
+    isCollapsed : false,
+
+    /**
+     * This region's panel.  Read-only.
+     * @type Ext.Panel
+     * @property panel
+     */
+    /**
+     * This region's layout.  Read-only.
+     * @type Layout
+     * @property layout
+     */
+    /**
+     * This region's layout position (north, south, east, west or center).  Read-only.
+     * @type String
+     * @property position
+     */
+
+    // private
+    render : function(ct, p){
+        this.panel = p;
+        p.el.enableDisplayMode();
+        this.targetEl = ct;
+        this.el = p.el;
+
+        var gs = p.getState, ps = this.position;
+        p.getState = function(){
+            return Ext.apply(gs.call(p) || {}, this.state);
+        }.createDelegate(this);
+
+        if(ps != 'center'){
+            p.allowQueuedExpand = false;
+            p.on({
+                beforecollapse: this.beforeCollapse,
+                collapse: this.onCollapse,
+                beforeexpand: this.beforeExpand,
+                expand: this.onExpand,
+                hide: this.onHide,
+                show: this.onShow,
+                scope: this
+            });
+            if(this.collapsible || this.floatable){
+                p.collapseEl = 'el';
+                p.slideAnchor = this.getSlideAnchor();
+            }
+            if(p.tools && p.tools.toggle){
+                p.tools.toggle.addClass('x-tool-collapse-'+ps);
+                p.tools.toggle.addClassOnOver('x-tool-collapse-'+ps+'-over');
+            }
+        }
+    },
+
+    // private
+    getCollapsedEl : function(){
+        if(!this.collapsedEl){
+            if(!this.toolTemplate){
+                var tt = new Ext.Template(
+                     '<div class="x-tool x-tool-{id}">&#160;</div>'
+                );
+                tt.disableFormats = true;
+                tt.compile();
+                Ext.layout.BorderLayout.Region.prototype.toolTemplate = tt;
+            }
+            this.collapsedEl = this.targetEl.createChild({
+                cls: "x-layout-collapsed x-layout-collapsed-"+this.position,
+                id: this.panel.id + '-xcollapsed'
+            });
+            this.collapsedEl.enableDisplayMode('block');
+
+            if(this.collapseMode == 'mini'){
+                this.collapsedEl.addClass('x-layout-cmini-'+this.position);
+                this.miniCollapsedEl = this.collapsedEl.createChild({
+                    cls: "x-layout-mini x-layout-mini-"+this.position, html: "&#160;"
+                });
+                this.miniCollapsedEl.addClassOnOver('x-layout-mini-over');
+                this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                this.collapsedEl.on('click', this.onExpandClick, this, {stopEvent:true});
+            }else {
+                if(this.collapsible !== false && !this.hideCollapseTool) {
+                    var t = this.expandToolEl = this.toolTemplate.append(
+                            this.collapsedEl.dom,
+                            {id:'expand-'+this.position}, true);
+                    t.addClassOnOver('x-tool-expand-'+this.position+'-over');
+                    t.on('click', this.onExpandClick, this, {stopEvent:true});
+                }
+                if(this.floatable !== false || this.titleCollapse){
+                   this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                   this.collapsedEl.on("click", this[this.floatable ? 'collapseClick' : 'onExpandClick'], this);
+                }
+            }
+        }
+        return this.collapsedEl;
+    },
+
+    // private
+    onExpandClick : function(e){
+        if(this.isSlid){
+            this.panel.expand(false);
+        }else{
+            this.panel.expand();
+        }
+    },
+
+    // private
+    onCollapseClick : function(e){
+        this.panel.collapse();
+    },
+
+    // private
+    beforeCollapse : function(p, animate){
+        this.lastAnim = animate;
+        if(this.splitEl){
+            this.splitEl.hide();
+        }
+        this.getCollapsedEl().show();
+        var el = this.panel.getEl();
+        this.originalZIndex = el.getStyle('z-index');
+        el.setStyle('z-index', 100);
+        this.isCollapsed = true;
+        this.layout.layout();
+    },
+
+    // private
+    onCollapse : function(animate){
+        this.panel.el.setStyle('z-index', 1);
+        if(this.lastAnim === false || this.panel.animCollapse === false){
+            this.getCollapsedEl().dom.style.visibility = 'visible';
+        }else{
+            this.getCollapsedEl().slideIn(this.panel.slideAnchor, {duration:.2});
+        }
+        this.state.collapsed = true;
+        this.panel.saveState();
+    },
+
+    // private
+    beforeExpand : function(animate){
+        if(this.isSlid){
+            this.afterSlideIn();
+        }
+        var c = this.getCollapsedEl();
+        this.el.show();
+        if(this.position == 'east' || this.position == 'west'){
+            this.panel.setSize(undefined, c.getHeight());
+        }else{
+            this.panel.setSize(c.getWidth(), undefined);
+        }
+        c.hide();
+        c.dom.style.visibility = 'hidden';
+        this.panel.el.setStyle('z-index', this.floatingZIndex);
+    },
+
+    // private
+    onExpand : function(){
+        this.isCollapsed = false;
+        if(this.splitEl){
+            this.splitEl.show();
+        }
+        this.layout.layout();
+        this.panel.el.setStyle('z-index', this.originalZIndex);
+        this.state.collapsed = false;
+        this.panel.saveState();
+    },
+
+    // private
+    collapseClick : function(e){
+        if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+        }else{
+           e.stopPropagation();
+           this.slideOut();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().hide();
+        }else if(this.splitEl){
+            this.splitEl.hide();
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().show();
+        }else if(this.splitEl){
+            this.splitEl.show();
+        }
+    },
+
+    /**
+     * True if this region is currently visible, else false.
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return !this.panel.hidden;
+    },
+
+    /**
+     * Returns the current margins for this region.  If the region is collapsed, the
+     * {@link #cmargins} (collapsed margins) value will be returned, otherwise the
+     * {@link #margins} value will be returned.
+     * @return {Object} An object containing the element's margins: <tt>{left: (left
+     * margin), top: (top margin), right: (right margin), bottom: (bottom margin)}</tt>
+     */
+    getMargins : function(){
+        return this.isCollapsed && this.cmargins ? this.cmargins : this.margins;
+    },
+
+    /**
+     * Returns the current size of this region.  If the region is collapsed, the size of the
+     * collapsedEl will be returned, otherwise the size of the region's panel will be returned.
+     * @return {Object} An object containing the element's size: <tt>{width: (element width),
+     * height: (element height)}</tt>
+     */
+    getSize : function(){
+        return this.isCollapsed ? this.getCollapsedEl().getSize() : this.panel.getSize();
+    },
+
+    /**
+     * Sets the specified panel as the container element for this region.
+     * @param {Ext.Panel} panel The new panel
+     */
+    setPanel : function(panel){
+        this.panel = panel;
+    },
+
+    /**
+     * Returns the minimum allowable width for this region.
+     * @return {Number} The minimum width
+     */
+    getMinWidth: function(){
+        return this.minWidth;
+    },
+
+    /**
+     * Returns the minimum allowable height for this region.
+     * @return {Number} The minimum height
+     */
+    getMinHeight: function(){
+        return this.minHeight;
+    },
+
+    // private
+    applyLayoutCollapsed : function(box){
+        var ce = this.getCollapsedEl();
+        ce.setLeftTop(box.x, box.y);
+        ce.setSize(box.width, box.height);
+    },
+
+    // private
+    applyLayout : function(box){
+        if(this.isCollapsed){
+            this.applyLayoutCollapsed(box);
+        }else{
+            this.panel.setPosition(box.x, box.y);
+            this.panel.setSize(box.width, box.height);
+        }
+    },
+
+    // private
+    beforeSlide: function(){
+        this.panel.beforeEffect();
+    },
+
+    // private
+    afterSlide : function(){
+        this.panel.afterEffect();
+    },
+
+    // private
+    initAutoHide : function(){
+        if(this.autoHide !== false){
+            if(!this.autoHideHd){
+                this.autoHideSlideTask = new Ext.util.DelayedTask(this.slideIn, this);
+                this.autoHideHd = {
+                    "mouseout": function(e){
+                        if(!e.within(this.el, true)){
+                            this.autoHideSlideTask.delay(500);
+                        }
+                    },
+                    "mouseover" : function(e){
+                        this.autoHideSlideTask.cancel();
+                    },
+                    scope : this
+                };
+            }
+            this.el.on(this.autoHideHd);
+            this.collapsedEl.on(this.autoHideHd);
+        }
+    },
+
+    // private
+    clearAutoHide : function(){
+        if(this.autoHide !== false){
+            this.el.un("mouseout", this.autoHideHd.mouseout);
+            this.el.un("mouseover", this.autoHideHd.mouseover);
+            this.collapsedEl.un("mouseout", this.autoHideHd.mouseout);
+            this.collapsedEl.un("mouseover", this.autoHideHd.mouseover);
+        }
+    },
+
+    // private
+    clearMonitor : function(){
+        Ext.getDoc().un("click", this.slideInIf, this);
+    },
+
+    /**
+     * If this Region is {@link #floatable}, this method slides this Region into full visibility <i>over the top
+     * of the center Region</i> where it floats until either {@link #slideIn} is called, or other regions of the layout
+     * are clicked, or the mouse exits the Region.
+     */
+    slideOut : function(){
+        if(this.isSlid || this.el.hasActiveFx()){
+            return;
+        }
+        this.isSlid = true;
+        var ts = this.panel.tools, dh, pc;
+        if(ts && ts.toggle){
+            ts.toggle.hide();
+        }
+        this.el.show();
+
+        // Temporarily clear the collapsed flag so we can onResize the panel on the slide
+        pc = this.panel.collapsed;
+        this.panel.collapsed = false;
+
+        if(this.position == 'east' || this.position == 'west'){
+            // Temporarily clear the deferHeight flag so we can size the height on the slide
+            dh = this.panel.deferHeight;
+            this.panel.deferHeight = false;
+
+            this.panel.setSize(undefined, this.collapsedEl.getHeight());
+
+            // Put the deferHeight flag back after setSize
+            this.panel.deferHeight = dh;
+        }else{
+            this.panel.setSize(this.collapsedEl.getWidth(), undefined);
+        }
+
+        // Put the collapsed flag back after onResize
+        this.panel.collapsed = pc;
+
+        this.restoreLT = [this.el.dom.style.left, this.el.dom.style.top];
+        this.el.alignTo(this.collapsedEl, this.getCollapseAnchor());
+        this.el.setStyle("z-index", this.floatingZIndex+2);
+        this.panel.el.replaceClass('x-panel-collapsed', 'x-panel-floating');
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideIn(this.getSlideAnchor(), {
+                callback: function(){
+                    this.afterSlide();
+                    this.initAutoHide();
+                    Ext.getDoc().on("click", this.slideInIf, this);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.initAutoHide();
+             Ext.getDoc().on("click", this.slideInIf, this);
+        }
+    },
+
+    // private
+    afterSlideIn : function(){
+        this.clearAutoHide();
+        this.isSlid = false;
+        this.clearMonitor();
+        this.el.setStyle("z-index", "");
+        this.panel.el.replaceClass('x-panel-floating', 'x-panel-collapsed');
+        this.el.dom.style.left = this.restoreLT[0];
+        this.el.dom.style.top = this.restoreLT[1];
+
+        var ts = this.panel.tools;
+        if(ts && ts.toggle){
+            ts.toggle.show();
+        }
+    },
+
+    /**
+     * If this Region is {@link #floatable}, and this Region has been slid into floating visibility, then this method slides
+     * this region back into its collapsed state.
+     */
+    slideIn : function(cb){
+        if(!this.isSlid || this.el.hasActiveFx()){
+            Ext.callback(cb);
+            return;
+        }
+        this.isSlid = false;
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideOut(this.getSlideAnchor(), {
+                callback: function(){
+                    this.el.hide();
+                    this.afterSlide();
+                    this.afterSlideIn();
+                    Ext.callback(cb);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.el.hide();
+            this.afterSlideIn();
+        }
+    },
+
+    // private
+    slideInIf : function(e){
+        if(!e.within(this.el)){
+            this.slideIn();
+        }
+    },
+
+    // private
+    anchors : {
+        "west" : "left",
+        "east" : "right",
+        "north" : "top",
+        "south" : "bottom"
+    },
+
+    // private
+    sanchors : {
+        "west" : "l",
+        "east" : "r",
+        "north" : "t",
+        "south" : "b"
+    },
+
+    // private
+    canchors : {
+        "west" : "tl-tr",
+        "east" : "tr-tl",
+        "north" : "tl-bl",
+        "south" : "bl-tl"
+    },
+
+    // private
+    getAnchor : function(){
+        return this.anchors[this.position];
+    },
+
+    // private
+    getCollapseAnchor : function(){
+        return this.canchors[this.position];
+    },
+
+    // private
+    getSlideAnchor : function(){
+        return this.sanchors[this.position];
+    },
+
+    // private
+    getAlignAdj : function(){
+        var cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [0, 0];
+            break;
+            case "east":
+                return [0, 0];
+            break;
+            case "north":
+                return [0, 0];
+            break;
+            case "south":
+                return [0, 0];
+            break;
+        }
+    },
+
+    // private
+    getExpandAdj : function(){
+        var c = this.collapsedEl, cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [-(cm.right+c.getWidth()+cm.left), 0];
+            break;
+            case "east":
+                return [cm.right+c.getWidth()+cm.left, 0];
+            break;
+            case "north":
+                return [0, -(cm.top+cm.bottom+c.getHeight())];
+            break;
+            case "south":
+                return [0, cm.top+cm.bottom+c.getHeight()];
+            break;
+        }
+    },
+
+    destroy : function(){
+        if (this.autoHideSlideTask && this.autoHideSlideTask.cancel){
+            this.autoHideSlideTask.cancel();
+        }
+        Ext.destroyMembers(this, 'miniCollapsedEl', 'collapsedEl', 'expandToolEl');
+    }
+};
+
+/**
+ * @class Ext.layout.BorderLayout.SplitRegion
+ * @extends Ext.layout.BorderLayout.Region
+ * <p>This is a specialized type of {@link Ext.layout.BorderLayout.Region BorderLayout region} that
+ * has a built-in {@link Ext.SplitBar} for user resizing of regions.  The movement of the split bar
+ * is configurable to move either {@link #tickSize smooth or incrementally}.</p>
+ * @constructor
+ * Create a new SplitRegion.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: north, south, east, west and center.  Every
+ * BorderLayout must have a center region for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.SplitRegion = function(layout, config, pos){
+    Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this, layout, config, pos);
+    // prevent switch
+    this.applyLayout = this.applyFns[pos];
+};
+
+Ext.extend(Ext.layout.BorderLayout.SplitRegion, Ext.layout.BorderLayout.Region, {
+    /**
+     * @cfg {Number} tickSize
+     * The increment, in pixels by which to move this Region's {@link Ext.SplitBar SplitBar}.
+     * By default, the {@link Ext.SplitBar SplitBar} moves smoothly.
+     */
+    /**
+     * @cfg {String} splitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible non-collapsible} region's split bar
+     * (defaults to <tt>"Drag to resize."</tt>).  Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    splitTip : "Drag to resize.",
+    /**
+     * @cfg {String} collapsibleSplitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible collapsible} region's split bar
+     * (defaults to "Drag to resize. Double click to hide."). Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    collapsibleSplitTip : "Drag to resize. Double click to hide.",
+    /**
+     * @cfg {Boolean} useSplitTips
+     * <tt>true</tt> to display a tooltip when the user hovers over a region's split bar
+     * (defaults to <tt>false</tt>).  The tooltip text will be the value of either
+     * <tt>{@link #splitTip}</tt> or <tt>{@link #collapsibleSplitTip}</tt> as appropriate.
+     */
+    useSplitTips : false,
+
+    // private
+    splitSettings : {
+        north : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.TOP,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        south : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.BOTTOM,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        east : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.RIGHT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        },
+        west : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.LEFT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        }
+    },
+
+    // private
+    applyFns : {
+        west : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            this.panel.setPosition(box.x, box.y);
+            var sw = sd.offsetWidth;
+            s.left = (box.x+box.width-sw)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        east : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sw = sd.offsetWidth;
+            this.panel.setPosition(box.x+sw, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        north : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y+box.height-sh)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        },
+        south : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y+sh);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        }
+    },
+
+    // private
+    render : function(ct, p){
+        Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this, ct, p);
+
+        var ps = this.position;
+
+        this.splitEl = ct.createChild({
+            cls: "x-layout-split x-layout-split-"+ps, html: "&#160;",
+            id: this.panel.id + '-xsplit'
+        });
+
+        if(this.collapseMode == 'mini'){
+            this.miniSplitEl = this.splitEl.createChild({
+                cls: "x-layout-mini x-layout-mini-"+ps, html: "&#160;"
+            });
+            this.miniSplitEl.addClassOnOver('x-layout-mini-over');
+            this.miniSplitEl.on('click', this.onCollapseClick, this, {stopEvent:true});
+        }
+
+        var s = this.splitSettings[ps];
+
+        this.split = new Ext.SplitBar(this.splitEl.dom, p.el, s.orientation);
+        this.split.tickSize = this.tickSize;
+        this.split.placement = s.placement;
+        this.split.getMaximumSize = this[s.maxFn].createDelegate(this);
+        this.split.minSize = this.minSize || this[s.minProp];
+        this.split.on("beforeapply", this.onSplitMove, this);
+        this.split.useShim = this.useShim === true;
+        this.maxSize = this.maxSize || this[s.maxProp];
+
+        if(p.hidden){
+            this.splitEl.hide();
+        }
+
+        if(this.useSplitTips){
+            this.splitEl.dom.title = this.collapsible ? this.collapsibleSplitTip : this.splitTip;
+        }
+        if(this.collapsible){
+            this.splitEl.on("dblclick", this.onCollapseClick,  this);
+        }
+    },
+
+    //docs inherit from superclass
+    getSize : function(){
+        if(this.isCollapsed){
+            return this.collapsedEl.getSize();
+        }
+        var s = this.panel.getSize();
+        if(this.position == 'north' || this.position == 'south'){
+            s.height += this.splitEl.dom.offsetHeight;
+        }else{
+            s.width += this.splitEl.dom.offsetWidth;
+        }
+        return s;
+    },
+
+    // private
+    getHMaxSize : function(){
+         var cmax = this.maxSize || 10000;
+         var center = this.layout.center;
+         return Math.min(cmax, (this.el.getWidth()+center.el.getWidth())-center.getMinWidth());
+    },
+
+    // private
+    getVMaxSize : function(){
+        var cmax = this.maxSize || 10000;
+        var center = this.layout.center;
+        return Math.min(cmax, (this.el.getHeight()+center.el.getHeight())-center.getMinHeight());
+    },
+
+    // private
+    onSplitMove : function(split, newSize){
+        var s = this.panel.getSize();
+        this.lastSplitSize = newSize;
+        if(this.position == 'north' || this.position == 'south'){
+            this.panel.setSize(s.width, newSize);
+            this.state.height = newSize;
+        }else{
+            this.panel.setSize(newSize, s.height);
+            this.state.width = newSize;
+        }
+        this.layout.layout();
+        this.panel.saveState();
+        return false;
+    },
+
+    /**
+     * Returns a reference to the split bar in use by this region.
+     * @return {Ext.SplitBar} The split bar
+     */
+    getSplitBar : function(){
+        return this.split;
+    },
+
+    // inherit docs
+    destroy : function() {
+        Ext.destroy(this.miniSplitEl, this.split, this.splitEl);
+        Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS['border'] = Ext.layout.BorderLayout;
+/**
+ * @class Ext.layout.FormLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This layout manager is specifically designed for rendering and managing child Components of
+ * {@link Ext.form.FormPanel forms}. It is responsible for rendering the labels of
+ * {@link Ext.form.Field Field}s.</p>
+ *
+ * <p>This layout manager is used when a Container is configured with the <tt>layout:'form'</tt>
+ * {@link Ext.Container#layout layout} config option, and should generally not need to be created directly
+ * via the new keyword. See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ *
+ * <p>In an application, it will usually be preferrable to use a {@link Ext.form.FormPanel FormPanel}
+ * (which is configured with FormLayout as its layout class by default) since it also provides built-in
+ * functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form.</p>
+ *
+ * <p>A {@link Ext.Container Container} <i>using</i> the FormLayout layout manager (e.g.
+ * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) can also accept the following
+ * layout-specific config properties:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.form.FormPanel#hideLabels hideLabels}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelAlign labelAlign}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelPad labelPad}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelWidth labelWidth}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component (including Fields) managed by FormLayout accepts the following as a config option:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#anchor anchor}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component managed by FormLayout may be rendered as a form field (with an associated label) by
+ * configuring it with a non-null <b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b>. Components configured
+ * in this way may be configured with the following options which affect the way the FormLayout renders them:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#clearCls clearCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#hideLabel hideLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#itemCls itemCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelStyle labelStyle}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Example usage:</p>
+ * <pre><code>
+// Required if showing validation messages
+Ext.QuickTips.init();
+
+// While you can create a basic Panel with layout:'form', practically
+// you should usually use a FormPanel to also get its form functionality
+// since it already creates a FormLayout internally.
+var form = new Ext.form.FormPanel({
+    title: 'Form Layout',
+    bodyStyle: 'padding:15px',
+    width: 350,
+    defaultType: 'textfield',
+    defaults: {
+        // applied to each contained item
+        width: 230,
+        msgTarget: 'side'
+    },
+    items: [{
+            fieldLabel: 'First Name',
+            name: 'first',
+            allowBlank: false,
+            {@link Ext.Component#labelSeparator labelSeparator}: ':' // override labelSeparator layout config
+        },{
+            fieldLabel: 'Last Name',
+            name: 'last'
+        },{
+            fieldLabel: 'Email',
+            name: 'email',
+            vtype:'email'
+        }, {
+            xtype: 'textarea',
+            hideLabel: true,     // override hideLabels layout config
+            name: 'msg',
+            anchor: '100% -53'
+        }
+    ],
+    buttons: [
+        {text: 'Save'},
+        {text: 'Cancel'}
+    ],
+    layoutConfig: {
+        {@link #labelSeparator}: '~' // superseded by assignment below
+    },
+    // config options applicable to container when layout='form':
+    hideLabels: false,
+    labelAlign: 'left',   // or 'right' or 'top'
+    {@link Ext.form.FormPanel#labelSeparator labelSeparator}: '>>', // takes precedence over layoutConfig value
+    labelWidth: 65,       // defaults to 100
+    labelPad: 8           // defaults to 5, must specify labelWidth to be honored
+});
+</code></pre>
+ */
+Ext.layout.FormLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.form.FormPanel}.{@link Ext.form.FormPanel#labelSeparator labelSeparator}.  Configuration
+     * of this property at the <b>container</b> level takes precedence.
+     */
+    labelSeparator : ':',
+
+    /**
+     * Read only. The CSS style specification string added to field labels in this layout if not
+     * otherwise {@link Ext.Component#labelStyle specified by each contained field}.
+     * @type String
+     * @property labelStyle
+     */
+
+    /**
+     * @cfg {Boolean} trackLabels
+     * True to show/hide the field label when the field is hidden. Defaults to <tt>true</tt>.
+     */
+    trackLabels: true,
+
+    type: 'form',
+
+    onRemove: function(c){
+        Ext.layout.FormLayout.superclass.onRemove.call(this, c);
+        if(this.trackLabels){
+            c.un('show', this.onFieldShow, this);
+            c.un('hide', this.onFieldHide, this);
+        }
+        // check for itemCt, since we may be removing a fieldset or something similar
+        var el = c.getPositionEl(),
+            ct = c.getItemCt && c.getItemCt();
+        if (c.rendered && ct) {
+            if (el && el.dom) {
+                el.insertAfter(ct);
+            }
+            Ext.destroy(ct);
+            Ext.destroyMembers(c, 'label', 'itemCt');
+            if (c.customItemCt) {
+                Ext.destroyMembers(c, 'getItemCt', 'customItemCt');
+            }
+        }
+    },
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.FormLayout.superclass.setContainer.call(this, ct);
+        if(ct.labelAlign){
+            ct.addClass('x-form-label-'+ct.labelAlign);
+        }
+
+        if(ct.hideLabels){
+            Ext.apply(this, {
+                labelStyle: 'display:none',
+                elementStyle: 'padding-left:0;',
+                labelAdjust: 0
+            });
+        }else{
+            this.labelSeparator = Ext.isDefined(ct.labelSeparator) ? ct.labelSeparator : this.labelSeparator;
+            ct.labelWidth = ct.labelWidth || 100;
+            if(Ext.isNumber(ct.labelWidth)){
+                var pad = Ext.isNumber(ct.labelPad) ? ct.labelPad : 5;
+                Ext.apply(this, {
+                    labelAdjust: ct.labelWidth + pad,
+                    labelStyle: 'width:' + ct.labelWidth + 'px;',
+                    elementStyle: 'padding-left:' + (ct.labelWidth + pad) + 'px'
+                });
+            }
+            if(ct.labelAlign == 'top'){
+                Ext.apply(this, {
+                    labelStyle: 'width:auto;',
+                    labelAdjust: 0,
+                    elementStyle: 'padding-left:0;'
+                });
+            }
+        }
+    },
+
+    // private
+    isHide: function(c){
+        return c.hideLabel || this.container.hideLabels;
+    },
+
+    onFieldShow: function(c){
+        c.getItemCt().removeClass('x-hide-' + c.hideMode);
+
+        // Composite fields will need to layout after the container is made visible
+        if (c.isComposite) {
+            c.doLayout();
+        }
+    },
+
+    onFieldHide: function(c){
+        c.getItemCt().addClass('x-hide-' + c.hideMode);
+    },
+
+    //private
+    getLabelStyle: function(s){
+        var ls = '', items = [this.labelStyle, s];
+        for (var i = 0, len = items.length; i < len; ++i){
+            if (items[i]){
+                ls += items[i];
+                if (ls.substr(-1, 1) != ';'){
+                    ls += ';';
+                }
+            }
+        }
+        return ls;
+    },
+
+    /**
+     * @cfg {Ext.Template} fieldTpl
+     * A {@link Ext.Template#compile compile}d {@link Ext.Template} for rendering
+     * the fully wrapped, labeled and styled form Field. Defaults to:</p><pre><code>
+new Ext.Template(
+    &#39;&lt;div class="x-form-item {itemCls}" tabIndex="-1">&#39;,
+        &#39;&lt;&#108;abel for="{id}" style="{labelStyle}" class="x-form-item-&#108;abel">{&#108;abel}{labelSeparator}&lt;/&#108;abel>&#39;,
+        &#39;&lt;div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">&#39;,
+        &#39;&lt;/div>&lt;div class="{clearCls}">&lt;/div>&#39;,
+    '&lt;/div>'
+);
+</code></pre>
+     * <p>This may be specified to produce a different DOM structure when rendering form Fields.</p>
+     * <p>A description of the properties within the template follows:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to <tt>''</tt>)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * <p>Also see <tt>{@link #getTemplateArgs}</tt></p>
+     */
+
+    /**
+     * @private
+     *
+     */
+    renderItem : function(c, position, target){
+        if(c && (c.isFormField || c.fieldLabel) && c.inputType != 'hidden'){
+            var args = this.getTemplateArgs(c);
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position] || null;
+            }
+            if(position){
+                c.itemCt = this.fieldTpl.insertBefore(position, args, true);
+            }else{
+                c.itemCt = this.fieldTpl.append(target, args, true);
+            }
+            if(!c.getItemCt){
+                // Non form fields don't have getItemCt, apply it here
+                // This will get cleaned up in onRemove
+                Ext.apply(c, {
+                    getItemCt: function(){
+                        return c.itemCt;
+                    },
+                    customItemCt: true
+                });
+            }
+            c.label = c.getItemCt().child('label.x-form-item-label');
+            if(!c.rendered){
+                c.render('x-form-el-' + c.id);
+            }else if(!this.isValidParent(c, target)){
+                Ext.fly('x-form-el-' + c.id).appendChild(c.getPositionEl());
+            }
+            if(this.trackLabels){
+                if(c.hidden){
+                    this.onFieldHide(c);
+                }
+                c.on({
+                    scope: this,
+                    show: this.onFieldShow,
+                    hide: this.onFieldHide
+                });
+            }
+            this.configureItem(c);
+        }else {
+            Ext.layout.FormLayout.superclass.renderItem.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Provides template arguments for rendering the fully wrapped, labeled and styled form Field.</p>
+     * <p>This method returns an object hash containing properties used by the layout's {@link #fieldTpl}
+     * to create a correctly wrapped, labeled and styled form Field. This may be overriden to
+     * create custom layouts. The properties which must be returned are:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to the field's configured fieldLabel property)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * @param (Ext.form.Field} field The {@link Ext.form.Field Field} being rendered.
+     * @return {Object} An object hash containing the properties required to render the Field.
+     */
+    getTemplateArgs: function(field) {
+        var noLabelSep = !field.fieldLabel || field.hideLabel,
+            itemCls = (field.itemCls || this.container.itemCls || '') + (field.hideLabel ? ' x-hide-label' : '');
+
+        // IE9 quirks needs an extra, identifying class on wrappers of TextFields
+        if (Ext.isIE9 && Ext.isIEQuirks && field instanceof Ext.form.TextField) {
+            itemCls += ' x-input-wrapper';
+        }
+
+        return {
+            id            : field.id,
+            label         : field.fieldLabel,
+            itemCls       : itemCls,
+            clearCls      : field.clearCls || 'x-form-clear-left',
+            labelStyle    : this.getLabelStyle(field.labelStyle),
+            elementStyle  : this.elementStyle || '',
+            labelSeparator: noLabelSep ? '' : (Ext.isDefined(field.labelSeparator) ? field.labelSeparator : this.labelSeparator)
+        };
+    },
+
+    // private
+    adjustWidthAnchor: function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign != 'top')){
+            var adjust = Ext.isIE6 || (Ext.isIE && !Ext.isStrict);
+            return value - this.labelAdjust + (adjust ? -3 : 0);
+        }
+        return value;
+    },
+
+    adjustHeightAnchor : function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign == 'top')){
+            return value - c.label.getHeight();
+        }
+        return value;
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && this.container.getEl().contains(c.getPositionEl());
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['form'] = Ext.layout.FormLayout;
+/**
+ * @class Ext.layout.AccordionLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This is a layout that manages multiple Panels in an expandable accordion style such that only
+ * <b>one Panel can be expanded at any given time</b>. Each Panel has built-in support for expanding and collapsing.</p>
+ * <p>Note: Only Ext.Panels <b>and all subclasses of Ext.Panel</b> may be used in an accordion layout Container.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var accordion = new Ext.Panel({
+    title: 'Accordion Layout',
+    layout:'accordion',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle: 'padding:15px'
+    },
+    layoutConfig: {
+        // layout-specific configs go here
+        titleCollapse: false,
+        animate: true,
+        activeOnTop: true
+    },
+    items: [{
+        title: 'Panel 1',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 2',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 3',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AccordionLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} fill
+     * True to adjust the active item's height to fill the available space in the container, false to use the
+     * item's current height, or auto height if not explicitly set (defaults to true).
+     */
+    fill : true,
+    /**
+     * @cfg {Boolean} autoWidth
+     * True to set each contained item's width to 'auto', false to use the item's current width (defaults to true).
+     * Note that some components, in particular the {@link Ext.grid.GridPanel grid}, will not function properly within
+     * layouts if they have auto width, so in such cases this config should be set to false.
+     */
+    autoWidth : true,
+    /**
+     * @cfg {Boolean} titleCollapse
+     * True to allow expand/collapse of each contained panel by clicking anywhere on the title bar, false to allow
+     * expand/collapse only when the toggle tool button is clicked (defaults to true).  When set to false,
+     * {@link #hideCollapseTool} should be false also.
+     */
+    titleCollapse : true,
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * True to hide the contained panels' collapse/expand toggle buttons, false to display them (defaults to false).
+     * When set to true, {@link #titleCollapse} should be true also.
+     */
+    hideCollapseTool : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * True to make sure the collapse/expand toggle button always renders first (to the left of) any other tools
+     * in the contained panels' title bars, false to render it last (defaults to false).
+     */
+    collapseFirst : false,
+    /**
+     * @cfg {Boolean} animate
+     * True to slide the contained panels open and closed during expand/collapse using animation, false to open and
+     * close directly with no animation (defaults to false).  Note: to defer to the specific config setting of each
+     * contained panel for this property, set this to undefined at the layout level.
+     */
+    animate : false,
+    /**
+     * @cfg {Boolean} sequence
+     * <b>Experimental</b>. If animate is set to true, this will result in each animation running in sequence.
+     */
+    sequence : false,
+    /**
+     * @cfg {Boolean} activeOnTop
+     * True to swap the position of each panel as it is expanded so that it becomes the first item in the container,
+     * false to keep the panels in the rendered order. <b>This is NOT compatible with "animate:true"</b> (defaults to false).
+     */
+    activeOnTop : false,
+
+    type: 'accordion',
+
+    renderItem : function(c){
+        if(this.animate === false){
+            c.animCollapse = false;
+        }
+        c.collapsible = true;
+        if(this.autoWidth){
+            c.autoWidth = true;
+        }
+        if(this.titleCollapse){
+            c.titleCollapse = true;
+        }
+        if(this.hideCollapseTool){
+            c.hideCollapseTool = true;
+        }
+        if(this.collapseFirst !== undefined){
+            c.collapseFirst = this.collapseFirst;
+        }
+        if(!this.activeItem && !c.collapsed){
+            this.setActiveItem(c, true);
+        }else if(this.activeItem && this.activeItem != c){
+            c.collapsed = true;
+        }
+        Ext.layout.AccordionLayout.superclass.renderItem.apply(this, arguments);
+        c.header.addClass('x-accordion-hd');
+        c.on('beforeexpand', this.beforeExpand, this);
+    },
+
+    onRemove: function(c){
+        Ext.layout.AccordionLayout.superclass.onRemove.call(this, c);
+        if(c.rendered){
+            c.header.removeClass('x-accordion-hd');
+        }
+        c.un('beforeexpand', this.beforeExpand, this);
+    },
+
+    // private
+    beforeExpand : function(p, anim){
+        var ai = this.activeItem;
+        if(ai){
+            if(this.sequence){
+                delete this.activeItem;
+                if (!ai.collapsed){
+                    ai.collapse({callback:function(){
+                        p.expand(anim || true);
+                    }, scope: this});
+                    return false;
+                }
+            }else{
+                ai.collapse(this.animate);
+            }
+        }
+        this.setActive(p);
+        if(this.activeOnTop){
+            p.el.dom.parentNode.insertBefore(p.el.dom, p.el.dom.parentNode.firstChild);
+        }
+        // Items have been hidden an possibly rearranged, we need to get the container size again.
+        this.layout();
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(this.fill && item){
+            var hh = 0, i, ct = this.getRenderedItems(this.container), len = ct.length, p;
+            // Add up all the header heights
+            for (i = 0; i < len; i++) {
+                if((p = ct[i]) != item && !p.hidden){
+                    hh += p.header.getHeight();
+                }
+            };
+            // Subtract the header heights from the container size
+            size.height -= hh;
+            // Call setSize on the container to set the correct height.  For Panels, deferedHeight
+            // will simply store this size for when the expansion is done.
+            item.setSize(size);
+        }
+    },
+
+    /**
+     * Sets the active (expanded) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        this.setActive(item, true);
+    },
+
+    // private
+    setActive : function(item, expand){
+        var ai = this.activeItem;
+        item = this.container.getComponent(item);
+        if(ai != item){
+            if(item.rendered && item.collapsed && expand){
+                item.expand();
+            }else{
+                if(ai){
+                   ai.fireEvent('deactivate', ai);
+                }
+                this.activeItem = item;
+                item.fireEvent('activate', item);
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS.accordion = Ext.layout.AccordionLayout;
+
+//backwards compat
+Ext.layout.Accordion = Ext.layout.AccordionLayout;/**
+ * @class Ext.layout.TableLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This layout allows you to easily render content into an HTML table.  The total number of columns can be
+ * specified, and rowspan and colspan can be used to create complex layouts within the table.
+ * This class is intended to be extended or created via the layout:'table' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>Note that when creating a layout via config, the layout-specific config properties must be passed in via
+ * the {@link Ext.Container#layoutConfig} object which will then be applied internally to the layout.  In the
+ * case of TableLayout, the only valid layout config property is {@link #columns}.  However, the items added to a
+ * TableLayout can supply the following table-specific config properties:</p>
+ * <ul>
+ * <li><b>rowspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>colspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>cellId</b> An id applied to the table cell containing the item.</li>
+ * <li><b>cellCls</b> A CSS class name added to the table cell containing the item.</li>
+ * </ul>
+ * <p>The basic concept of building up a TableLayout is conceptually very similar to building up a standard
+ * HTML table.  You simply add each panel (or "cell") that you want to include along with any span attributes
+ * specified as the special config properties of rowspan and colspan which work exactly like their HTML counterparts.
+ * Rather than explicitly creating and nesting rows and columns as you would in HTML, you simply specify the
+ * total column count in the layoutConfig and start adding panels in their natural order from left to right,
+ * top to bottom.  The layout will automatically figure out, based on the column count, rowspans and colspans,
+ * how to position each panel within the table.  Just like with HTML tables, your rowspans and colspans must add
+ * up correctly in your overall layout or you'll end up with missing and/or extra cells!  Example usage:</p>
+ * <pre><code>
+// This code will generate a layout table that is 3 columns by 2 rows
+// with some spanning included.  The basic layout will be:
+// +--------+-----------------+
+// |   A    |   B             |
+// |        |--------+--------|
+// |        |   C    |   D    |
+// +--------+--------+--------+
+var table = new Ext.Panel({
+    title: 'Table Layout',
+    layout:'table',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle:'padding:20px'
+    },
+    layoutConfig: {
+        // The total column count must be specified here
+        columns: 3
+    },
+    items: [{
+        html: '&lt;p&gt;Cell A content&lt;/p&gt;',
+        rowspan: 2
+    },{
+        html: '&lt;p&gt;Cell B content&lt;/p&gt;',
+        colspan: 2
+    },{
+        html: '&lt;p&gt;Cell C content&lt;/p&gt;',
+        cellCls: 'highlight'
+    },{
+        html: '&lt;p&gt;Cell D content&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.TableLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Number} columns
+     * The total number of columns to create in the table for this layout.  If not specified, all Components added to
+     * this layout will be rendered into a single row using one column per Component.
+     */
+
+    // private
+    monitorResize:false,
+
+    type: 'table',
+
+    targetCls: 'x-table-layout-ct',
+
+    /**
+     * @cfg {Object} tableAttrs
+     * <p>An object containing properties which are added to the {@link Ext.DomHelper DomHelper} specification
+     * used to create the layout's <tt>&lt;table&gt;</tt> element. Example:</p><pre><code>
+{
+    xtype: 'panel',
+    layout: 'table',
+    layoutConfig: {
+        tableAttrs: {
+            style: {
+                width: '100%'
+            }
+        },
+        columns: 3
+    }
+}</code></pre>
+     */
+    tableAttrs:null,
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.TableLayout.superclass.setContainer.call(this, ct);
+
+        this.currentRow = 0;
+        this.currentColumn = 0;
+        this.cells = [];
+    },
+    
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items, len = cs.length, c, i;
+
+        if(!this.table){
+            target.addClass('x-table-layout-ct');
+
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        this.renderAll(ct, target);
+    },
+
+    // private
+    getRow : function(index){
+        var row = this.table.tBodies[0].childNodes[index];
+        if(!row){
+            row = document.createElement('tr');
+            this.table.tBodies[0].appendChild(row);
+        }
+        return row;
+    },
+
+    // private
+    getNextCell : function(c){
+        var cell = this.getNextNonSpan(this.currentColumn, this.currentRow);
+        var curCol = this.currentColumn = cell[0], curRow = this.currentRow = cell[1];
+        for(var rowIndex = curRow; rowIndex < curRow + (c.rowspan || 1); rowIndex++){
+            if(!this.cells[rowIndex]){
+                this.cells[rowIndex] = [];
+            }
+            for(var colIndex = curCol; colIndex < curCol + (c.colspan || 1); colIndex++){
+                this.cells[rowIndex][colIndex] = true;
+            }
+        }
+        var td = document.createElement('td');
+        if(c.cellId){
+            td.id = c.cellId;
+        }
+        var cls = 'x-table-layout-cell';
+        if(c.cellCls){
+            cls += ' ' + c.cellCls;
+        }
+        td.className = cls;
+        if(c.colspan){
+            td.colSpan = c.colspan;
+        }
+        if(c.rowspan){
+            td.rowSpan = c.rowspan;
+        }
+        this.getRow(curRow).appendChild(td);
+        return td;
+    },
+
+    // private
+    getNextNonSpan: function(colIndex, rowIndex){
+        var cols = this.columns;
+        while((cols && colIndex >= cols) || (this.cells[rowIndex] && this.cells[rowIndex][colIndex])) {
+            if(cols && colIndex >= cols){
+                rowIndex++;
+                colIndex = 0;
+            }else{
+                colIndex++;
+            }
+        }
+        return [colIndex, rowIndex];
+    },
+
+    // private
+    renderItem : function(c, position, target){
+        // Ensure we have our inner table to get cells to render into.
+        if(!this.table){
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        if(c && !c.rendered){
+            c.render(this.getNextCell(c));
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            var container = this.getNextCell(c);
+            container.insertBefore(c.getPositionEl().dom, null);
+            c.container = Ext.get(container);
+            this.configureItem(c);
+        }
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return c.getPositionEl().up('table', 5).dom.parentNode === (target.dom || target);
+    },
+    
+    destroy: function(){
+        delete this.table;
+        Ext.layout.TableLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['table'] = Ext.layout.TableLayout;/**
+ * @class Ext.layout.AbsoluteLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This is a layout that inherits the anchoring of <b>{@link Ext.layout.AnchorLayout}</b> and adds the
+ * ability for x/y positioning using the standard x and y component config options.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var form = new Ext.form.FormPanel({
+    title: 'Absolute Layout',
+    layout:'absolute',
+    layoutConfig: {
+        // layout-specific configs go here
+        extraCls: 'x-abs-layout-item',
+    },
+    baseCls: 'x-plain',
+    url:'save-form.php',
+    defaultType: 'textfield',
+    items: [{
+        x: 0,
+        y: 5,
+        xtype:'label',
+        text: 'Send To:'
+    },{
+        x: 60,
+        y: 0,
+        name: 'to',
+        anchor:'100%'  // anchor width by percentage
+    },{
+        x: 0,
+        y: 35,
+        xtype:'label',
+        text: 'Subject:'
+    },{
+        x: 60,
+        y: 30,
+        name: 'subject',
+        anchor: '100%'  // anchor width by percentage
+    },{
+        x:0,
+        y: 60,
+        xtype: 'textarea',
+        name: 'msg',
+        anchor: '100% 100%'  // anchor width and height
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    extraCls: 'x-abs-layout-item',
+
+    type: 'absolute',
+
+    onLayout : function(ct, target){
+        target.position();
+        this.paddingLeft = target.getPadding('l');
+        this.paddingTop = target.getPadding('t');
+        Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;
+    }
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;
+/**
+ * @class Ext.layout.BoxLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Base Class for HBoxLayout and VBoxLayout Classes. Generally it should not need to be used directly.</p>
+ */
+Ext.layout.BoxLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Object} defaultMargins
+     * <p>If the individual contained items do not have a <tt>margins</tt>
+     * property specified, the default margins from this property will be
+     * applied to each item.</p>
+     * <br><p>This property may be specified as an object containing margins
+     * to apply in the format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>This property may also be specified as a string containing
+     * space-separated, numeric margin values. The order of the sides associated
+     * with each value matches the way CSS processes margin values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    /**
+     * @cfg {String} padding
+     * <p>Sets the padding to be applied to all child items managed by this layout.</p>
+     * <p>This property must be specified as a string containing
+     * space-separated, numeric padding values. The order of the sides associated
+     * with each value matches the way CSS processes padding values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to: <code>"0"</code></p>
+     */
+    padding : '0',
+    // documented in subclasses
+    pack : 'start',
+
+    // private
+    monitorResize : true,
+    type: 'box',
+    scrollOffset : 0,
+    extraCls : 'x-box-item',
+    targetCls : 'x-box-layout-ct',
+    innerCls : 'x-box-inner',
+
+    constructor : function(config){
+        Ext.layout.BoxLayout.superclass.constructor.call(this, config);
+
+        if (Ext.isString(this.defaultMargins)) {
+            this.defaultMargins = this.parseMargins(this.defaultMargins);
+        }
+        
+        var handler = this.overflowHandler;
+        
+        if (typeof handler == 'string') {
+            handler = {
+                type: handler
+            };
+        }
+        
+        var handlerType = 'none';
+        if (handler && handler.type != undefined) {
+            handlerType = handler.type;
+        }
+        
+        var constructor = Ext.layout.boxOverflow[handlerType];
+        if (constructor[this.type]) {
+            constructor = constructor[this.type];
+        }
+        
+        this.overflowHandler = new constructor(this, handler);
+    },
+
+    /**
+     * @private
+     * Runs the child box calculations and caches them in childBoxCache. Subclasses can used these cached values
+     * when laying out
+     */
+    onLayout: function(container, target) {
+        Ext.layout.BoxLayout.superclass.onLayout.call(this, container, target);
+
+        var tSize = this.getLayoutTargetSize(),
+            items = this.getVisibleItems(container),
+            calcs = this.calculateChildBoxes(items, tSize),
+            boxes = calcs.boxes,
+            meta  = calcs.meta;
+        
+        //invoke the overflow handler, if one is configured
+        if (tSize.width > 0) {
+            var handler = this.overflowHandler,
+                method  = meta.tooNarrow ? 'handleOverflow' : 'clearOverflow';
+            
+            var results = handler[method](calcs, tSize);
+            
+            if (results) {
+                if (results.targetSize) {
+                    tSize = results.targetSize;
+                }
+                
+                if (results.recalculate) {
+                    items = this.getVisibleItems(container);
+                    calcs = this.calculateChildBoxes(items, tSize);
+                    boxes = calcs.boxes;
+                }
+            }
+        }
+        
+        /**
+         * @private
+         * @property layoutTargetLastSize
+         * @type Object
+         * Private cache of the last measured size of the layout target. This should never be used except by
+         * BoxLayout subclasses during their onLayout run.
+         */
+        this.layoutTargetLastSize = tSize;
+        
+        /**
+         * @private
+         * @property childBoxCache
+         * @type Array
+         * Array of the last calculated height, width, top and left positions of each visible rendered component
+         * within the Box layout.
+         */
+        this.childBoxCache = calcs;
+        
+        this.updateInnerCtSize(tSize, calcs);
+        this.updateChildBoxes(boxes);
+
+        // Putting a box layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        this.handleTargetOverflow(tSize, container, target);
+    },
+
+    /**
+     * Resizes and repositions each child component
+     * @param {Array} boxes The box measurements
+     */
+    updateChildBoxes: function(boxes) {
+        for (var i = 0, length = boxes.length; i < length; i++) {
+            var box  = boxes[i],
+                comp = box.component;
+            
+            if (box.dirtySize) {
+                comp.setSize(box.width, box.height);
+            }
+            // Don't set positions to NaN
+            if (isNaN(box.left) || isNaN(box.top)) {
+                continue;
+            }
+            
+            comp.setPosition(box.left, box.top);
+        }
+    },
+
+    /**
+     * @private
+     * Called by onRender just before the child components are sized and positioned. This resizes the innerCt
+     * to make sure all child items fit within it. We call this before sizing the children because if our child
+     * items are larger than the previous innerCt size the browser will insert scrollbars and then remove them
+     * again immediately afterwards, giving a performance hit.
+     * Subclasses should provide an implementation.
+     * @param {Object} currentSize The current height and width of the innerCt
+     * @param {Array} calculations The new box calculations of all items to be laid out
+     */
+    updateInnerCtSize: function(tSize, calcs) {
+        var align   = this.align,
+            padding = this.padding,
+            width   = tSize.width,
+            height  = tSize.height;
+        
+        if (this.type == 'hbox') {
+            var innerCtWidth  = width,
+                innerCtHeight = calcs.meta.maxHeight + padding.top + padding.bottom;
+
+            if (align == 'stretch') {
+                innerCtHeight = height;
+            } else if (align == 'middle') {
+                innerCtHeight = Math.max(height, innerCtHeight);
+            }
+        } else {
+            var innerCtHeight = height,
+                innerCtWidth  = calcs.meta.maxWidth + padding.left + padding.right;
+
+            if (align == 'stretch') {
+                innerCtWidth = width;
+            } else if (align == 'center') {
+                innerCtWidth = Math.max(width, innerCtWidth);
+            }
+        }
+
+        this.innerCt.setSize(innerCtWidth || undefined, innerCtHeight || undefined);
+    },
+
+    /**
+     * @private
+     * This should be called after onLayout of any BoxLayout subclass. If the target's overflow is not set to 'hidden',
+     * we need to lay out a second time because the scrollbars may have modified the height and width of the layout
+     * target. Having a Box layout inside such a target is therefore not recommended.
+     * @param {Object} previousTargetSize The size and height of the layout target before we just laid out
+     * @param {Ext.Container} container The container
+     * @param {Ext.Element} target The target element
+     */
+    handleTargetOverflow: function(previousTargetSize, container, target) {
+        var overflow = target.getStyle('overflow');
+
+        if (overflow && overflow != 'hidden' &&!this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != previousTargetSize.width || newTargetSize.height != previousTargetSize.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    isValidParent : function(c, target) {
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    /**
+     * @private
+     * Returns all items that are both rendered and visible
+     * @return {Array} All matching items
+     */
+    getVisibleItems: function(ct) {
+        var ct  = ct || this.container,
+            t   = ct.getLayoutTarget(),
+            cti = ct.items.items,
+            len = cti.length,
+
+            i, c, items = [];
+
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.hidden !== true  && c.collapsed !== true && c.shouldLayout !== false){
+                items.push(c);
+            }
+        }
+
+        return items;
+    },
+
+    // private
+    renderAll : function(ct, target) {
+        if (!this.innerCt) {
+            // the innerCt prevents wrapping and shuffling while the container is resizing
+            this.innerCt = target.createChild({cls:this.innerCls});
+            this.padding = this.parseMargins(this.padding);
+        }
+        Ext.layout.BoxLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width  -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        
+        return ret;
+    },
+
+    // private
+    renderItem : function(c) {
+        if(Ext.isString(c.margins)){
+            c.margins = this.parseMargins(c.margins);
+        }else if(!c.margins){
+            c.margins = this.defaultMargins;
+        }
+        Ext.layout.BoxLayout.superclass.renderItem.apply(this, arguments);
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.overflowHandler);
+        
+        Ext.layout.BoxLayout.superclass.destroy.apply(this, arguments);
+    }
+});
+
+/**
+ * @class Ext.layout.boxOverflow.None
+ * @extends Object
+ * Base class for Box Layout overflow handlers. These specialized classes are invoked when a Box Layout
+ * (either an HBox or a VBox) has child items that are either too wide (for HBox) or too tall (for VBox)
+ * for its container.
+ */
+
+Ext.layout.boxOverflow.None = Ext.extend(Object, {
+    constructor: function(layout, config) {
+        this.layout = layout;
+        
+        Ext.apply(this, config || {});
+    },
+    
+    handleOverflow: Ext.emptyFn,
+    
+    clearOverflow: Ext.emptyFn
+});
+
+
+Ext.layout.boxOverflow.none = Ext.layout.boxOverflow.None;
+/**
+ * @class Ext.layout.boxOverflow.Menu
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Menu = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+    
+    constructor: function(layout) {
+        Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this, arguments);
+        
+        /**
+         * @property menuItems
+         * @type Array
+         * Array of all items that are currently hidden and should go into the dropdown menu
+         */
+        this.menuItems = [];
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt, innerCt and afterCt elements if they have not already been created
+     * @param {Ext.Container} container The Container attached to this Layout instance
+     * @param {Ext.Element} target The target Element
+     */
+    createInnerElements: function() {
+        if (!this.afterCt) {
+            this.afterCt  = this.layout.innerCt.insertSibling({cls: this.afterCls},  'before');
+        }
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function(calculations, targetSize) {
+        var newWidth = targetSize.width + (this.afterCt ? this.afterCt.getWidth() : 0),
+            items    = this.menuItems;
+        
+        this.hideTrigger();
+        
+        for (var index = 0, length = items.length; index < length; index++) {
+            items.pop().component.show();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            }
+        };
+    },
+    
+    /**
+     * @private
+     */
+    showTrigger: function() {
+        this.createMenu();
+        this.menuTrigger.show();
+    },
+    
+    /**
+     * @private
+     */
+    hideTrigger: function() {
+        if (this.menuTrigger != undefined) {
+            this.menuTrigger.hide();
+        }
+    },
+    
+    /**
+     * @private
+     * Called before the overflow menu is shown. This constructs the menu's items, caching them for as long as it can.
+     */
+    beforeMenuShow: function(menu) {
+        var items = this.menuItems,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+        
+        this.clearMenu();
+        menu.removeAll();
+        
+        for (var i = 0; i < len; i++) {
+            item = items[i].component;
+            
+            if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                menu.add('-');
+            }
+            
+            this.addComponentToMenu(menu, item);
+            prev = item;
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+    
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the overflow trigger and menu used when enableOverflow is set to true and the items
+     * in the layout are too wide to fit in the space available
+     */
+    createMenu: function() {
+        if (!this.menuTrigger) {
+            this.createInnerElements();
+            
+            /**
+             * @private
+             * @property menu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every item that cannot be shown
+             * because the container is currently not large enough.
+             */
+            this.menu = new Ext.menu.Menu({
+                ownerCt : this.layout.container,
+                listeners: {
+                    scope: this,
+                    beforeshow: this.beforeMenuShow
+                }
+            });
+
+            /**
+             * @private
+             * @property menuTrigger
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.menuTrigger = new Ext.Button({
+                iconCls : 'x-toolbar-more-icon',
+                cls     : 'x-toolbar-more',
+                menu    : this.menu,
+                renderTo: this.afterCt
+            });
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.menu, this.menuTrigger);
+    }
+});
+
+Ext.layout.boxOverflow.menu = Ext.layout.boxOverflow.Menu;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalMenu
+ * @extends Ext.layout.boxOverflow.Menu
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalMenu = Ext.extend(Ext.layout.boxOverflow.Menu, {
+    
+    constructor: function() {
+        Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this, arguments);
+        
+        var me = this,
+            layout = me.layout,
+            origFunction = layout.calculateChildBoxes;
+        
+        layout.calculateChildBoxes = function(visibleItems, targetSize) {
+            var calcs = origFunction.apply(layout, arguments),
+                meta  = calcs.meta,
+                items = me.menuItems;
+            
+            //calculate the width of the items currently hidden solely because there is not enough space
+            //to display them
+            var hiddenWidth = 0;
+            for (var index = 0, length = items.length; index < length; index++) {
+                hiddenWidth += items[index].width;
+            }
+            
+            meta.minimumWidth += hiddenWidth;
+            meta.tooNarrow = meta.minimumWidth > targetSize.width;
+            
+            return calcs;
+        };        
+    },
+    
+    handleOverflow: function(calculations, targetSize) {
+        this.showTrigger();
+        
+        var newWidth    = targetSize.width - this.afterCt.getWidth(),
+            boxes       = calculations.boxes,
+            usedWidth   = 0,
+            recalculate = false;
+        
+        //calculate the width of all visible items and any spare width
+        for (var index = 0, length = boxes.length; index < length; index++) {
+            usedWidth += boxes[index].width;
+        }
+        
+        var spareWidth = newWidth - usedWidth,
+            showCount  = 0;
+        
+        //see if we can re-show any of the hidden components
+        for (var index = 0, length = this.menuItems.length; index < length; index++) {
+            var hidden = this.menuItems[index],
+                comp   = hidden.component,
+                width  = hidden.width;
+            
+            if (width < spareWidth) {
+                comp.show();
+                
+                spareWidth -= width;
+                showCount ++;
+                recalculate = true;
+            } else {
+                break;
+            }
+        }
+                
+        if (recalculate) {
+            this.menuItems = this.menuItems.slice(showCount);
+        } else {
+            for (var i = boxes.length - 1; i >= 0; i--) {
+                var item  = boxes[i].component,
+                    right = boxes[i].left + boxes[i].width;
+
+                if (right >= newWidth) {
+                    this.menuItems.unshift({
+                        component: item,
+                        width    : boxes[i].width
+                    });
+
+                    item.hide();
+                } else {
+                    break;
+                }
+            }
+        }
+        
+        if (this.menuItems.length == 0) {
+            this.hideTrigger();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            },
+            recalculate: recalculate
+        };
+    }
+});
+
+Ext.layout.boxOverflow.menu.hbox = Ext.layout.boxOverflow.HorizontalMenu;/**
+ * @class Ext.layout.boxOverflow.Scroller
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Scroller = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg animateScroll
+     * @type Boolean
+     * True to animate the scrolling of items within the layout (defaults to true, ignored if enableScroll is false)
+     */
+    animateScroll: true,
+    
+    /**
+     * @cfg scrollIncrement
+     * @type Number
+     * The number of pixels to scroll by on scroller click (defaults to 100)
+     */
+    scrollIncrement: 100,
+    
+    /**
+     * @cfg wheelIncrement
+     * @type Number
+     * The number of pixels to increment on mouse wheel scrolling (defaults to <tt>3</tt>).
+     */
+    wheelIncrement: 3,
+    
+    /**
+     * @cfg scrollRepeatInterval
+     * @type Number
+     * Number of milliseconds between each scroll while a scroller button is held down (defaults to 400)
+     */
+    scrollRepeatInterval: 400,
+    
+    /**
+     * @cfg scrollDuration
+     * @type Number
+     * Number of seconds that each scroll animation lasts (defaults to 0.4)
+     */
+    scrollDuration: 0.4,
+    
+    /**
+     * @cfg beforeCls
+     * @type String
+     * CSS class added to the beforeCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the leftmost edge of the Container
+     */
+    beforeCls: 'x-strip-left',
+    
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @cfg scrollerCls
+     * @type String
+     * CSS class added to both scroller elements if enableScroll is used
+     */
+    scrollerCls: 'x-strip-scroller',
+    
+    /**
+     * @cfg beforeScrollerCls
+     * @type String
+     * CSS class added to the left scroller element if enableScroll is used
+     */
+    beforeScrollerCls: 'x-strip-scroller-left',
+    
+    /**
+     * @cfg afterScrollerCls
+     * @type String
+     * CSS class added to the right scroller element if enableScroll is used
+     */
+    afterScrollerCls: 'x-strip-scroller-right',
+    
+    /**
+     * @private
+     * Sets up an listener to scroll on the layout's innerCt mousewheel event
+     */
+    createWheelListener: function() {
+        this.layout.innerCt.on({
+            scope     : this,
+            mousewheel: function(e) {
+                e.stopEvent();
+
+                this.scrollBy(e.getWheelDelta() * this.wheelIncrement * -1, false);
+            }
+        });
+    },
+    
+    /**
+     * @private
+     * Most of the heavy lifting is done in the subclasses
+     */
+    handleOverflow: function(calculations, targetSize) {
+        this.createInnerElements();
+        this.showScrollers();
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function() {
+        this.hideScrollers();
+    },
+    
+    /**
+     * @private
+     * Shows the scroller elements in the beforeCt and afterCt. Creates the scrollers first if they are not already
+     * present. 
+     */
+    showScrollers: function() {
+        this.createScrollers();
+        
+        this.beforeScroller.show();
+        this.afterScroller.show();
+        
+        this.updateScrollButtons();
+    },
+    
+    /**
+     * @private
+     * Hides the scroller elements in the beforeCt and afterCt
+     */
+    hideScrollers: function() {
+        if (this.beforeScroller != undefined) {
+            this.beforeScroller.hide();
+            this.afterScroller.hide();          
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the clickable scroller elements and places them into the beforeCt and afterCt
+     */
+    createScrollers: function() {
+        if (!this.beforeScroller && !this.afterScroller) {
+            var before = this.beforeCt.createChild({
+                cls: String.format("{0} {1} ", this.scrollerCls, this.beforeScrollerCls)
+            });
+            
+            var after = this.afterCt.createChild({
+                cls: String.format("{0} {1}", this.scrollerCls, this.afterScrollerCls)
+            });
+            
+            before.addClassOnOver(this.beforeScrollerCls + '-hover');
+            after.addClassOnOver(this.afterScrollerCls + '-hover');
+            
+            before.setVisibilityMode(Ext.Element.DISPLAY);
+            after.setVisibilityMode(Ext.Element.DISPLAY);
+            
+            this.beforeRepeater = new Ext.util.ClickRepeater(before, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollLeft,
+                scope   : this
+            });
+            
+            this.afterRepeater = new Ext.util.ClickRepeater(after, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollRight,
+                scope   : this
+            });
+            
+            /**
+             * @property beforeScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.beforeScroller = before;
+            
+            /**
+             * @property afterScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.afterScroller = after;
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.beforeScroller, this.afterScroller, this.beforeRepeater, this.afterRepeater, this.beforeCt, this.afterCt);
+    },
+    
+    /**
+     * @private
+     * Scrolls left or right by the number of pixels specified
+     * @param {Number} delta Number of pixels to scroll to the right by. Use a negative number to scroll left
+     */
+    scrollBy: function(delta, animate) {
+        this.scrollTo(this.getScrollPosition() + delta, animate);
+    },
+    
+    /**
+     * @private
+     * Normalizes an item reference, string id or numerical index into a reference to the item
+     * @param {Ext.Component|String|Number} item The item reference, id or index
+     * @return {Ext.Component} The item
+     */
+    getItem: function(item) {
+        if (Ext.isString(item)) {
+            item = Ext.getCmp(item);
+        } else if (Ext.isNumber(item)) {
+            item = this.items[item];
+        }
+        
+        return item;
+    },
+    
+    /**
+     * @private
+     * @return {Object} Object passed to scrollTo when scrolling
+     */
+    getScrollAnim: function() {
+        return {
+            duration: this.scrollDuration, 
+            callback: this.updateScrollButtons, 
+            scope   : this
+        };
+    },
+    
+    /**
+     * @private
+     * Enables or disables each scroller button based on the current scroll position
+     */
+    updateScrollButtons: function() {
+        if (this.beforeScroller == undefined || this.afterScroller == undefined) {
+            return;
+        }
+        
+        var beforeMeth = this.atExtremeBefore()  ? 'addClass' : 'removeClass',
+            afterMeth  = this.atExtremeAfter() ? 'addClass' : 'removeClass',
+            beforeCls  = this.beforeScrollerCls + '-disabled',
+            afterCls   = this.afterScrollerCls  + '-disabled';
+        
+        this.beforeScroller[beforeMeth](beforeCls);
+        this.afterScroller[afterMeth](afterCls);
+        this.scrolling = false;
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its left-most point
+     * @return {Boolean} True if already at furthest left point
+     */
+    atExtremeBefore: function() {
+        return this.getScrollPosition() === 0;
+    },
+    
+    /**
+     * @private
+     * Scrolls to the left by the configured amount
+     */
+    scrollLeft: function(animate) {
+        this.scrollBy(-this.scrollIncrement, animate);
+    },
+    
+    /**
+     * @private
+     * Scrolls to the right by the configured amount
+     */
+    scrollRight: function(animate) {
+        this.scrollBy(this.scrollIncrement, animate);
+    },
+    
+    /**
+     * Scrolls to the given component.
+     * @param {String|Number|Ext.Component} item The item to scroll to. Can be a numerical index, component id 
+     * or a reference to the component itself.
+     * @param {Boolean} animate True to animate the scrolling
+     */
+    scrollToItem: function(item, animate) {
+        item = this.getItem(item);
+        
+        if (item != undefined) {
+            var visibility = this.getItemVisibility(item);
+            
+            if (!visibility.fullyVisible) {
+                var box  = item.getBox(true, true),
+                    newX = box.x;
+                    
+                if (visibility.hiddenRight) {
+                    newX -= (this.layout.innerCt.getWidth() - box.width);
+                }
+                
+                this.scrollTo(newX, animate);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * For a given item in the container, return an object with information on whether the item is visible
+     * with the current innerCt scroll value.
+     * @param {Ext.Component} item The item
+     * @return {Object} Values for fullyVisible, hiddenLeft and hiddenRight
+     */
+    getItemVisibility: function(item) {
+        var box         = this.getItem(item).getBox(true, true),
+            itemLeft    = box.x,
+            itemRight   = box.x + box.width,
+            scrollLeft  = this.getScrollPosition(),
+            scrollRight = this.layout.innerCt.getWidth() + scrollLeft;
+        
+        return {
+            hiddenLeft  : itemLeft < scrollLeft,
+            hiddenRight : itemRight > scrollRight,
+            fullyVisible: itemLeft > scrollLeft && itemRight < scrollRight
+        };
+    }
+});
+
+Ext.layout.boxOverflow.scroller = Ext.layout.boxOverflow.Scroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.VerticalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.VerticalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    scrollIncrement: 75,
+    wheelIncrement : 2,
+    
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height - (this.beforeCt.getHeight() + this.afterCt.getHeight()),
+                width : targetSize.width
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'after');
+
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollBottom());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('top', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollTop, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollBottom: function() {
+        return this.layout.innerCt.dom.scrollHeight - this.layout.innerCt.getHeight();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollBottom();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.vbox = Ext.layout.boxOverflow.VerticalScroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : targetSize.width - (this.beforeCt.getWidth() + this.afterCt.getWidth())
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'before');
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollRight());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('left', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollLeft, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollRight: function() {
+        return this.layout.innerCt.dom.scrollWidth - this.layout.innerCt.getWidth();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollRight();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.hbox = Ext.layout.boxOverflow.HorizontalScroller;/**
+ * @class Ext.layout.HBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items horizontally across a Container. This layout optionally divides available horizontal
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the heights of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.HBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>top</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned vertically
+     * at the <b>top</b> of the container</div></li>
+     * <li><b><tt>middle</tt></b> : <div class="sub-desc">child items are aligned vertically in the
+     * <b>middle</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched vertically to fill
+     * the height of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched vertically to
+     * the height of the largest item.</div></li>
+     */
+    align: 'top', // top, middle, stretch, strechmax
+
+    type : 'hbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>left</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-width</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>right</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>horizontally</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the HBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availHeight  = Math.max(0, height - paddingVert),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexWidth = 0,
+            maxHeight    = 0,
+            totalFlex    = 0,
+            desiredWidth = 0,
+            minimumWidth = 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedWidth, 
+            horizMargins, vertMargins, stretchHeight;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child       = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static width (numeric) requires no calcs
+            if (typeof childWidth != 'number') {
+
+                // flex and not 'auto' width
+                if (child.flex && !childWidth) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' width or undefined width
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childWidth && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize   = child.getSize();
+                    childWidth  = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+
+            childMargins = child.margins;
+            horizMargins = childMargins.left + childMargins.right;
+
+            nonFlexWidth += horizMargins + (childWidth || 0);
+            desiredWidth += horizMargins + (child.flex ? child.minWidth || 0 : childWidth);
+            minimumWidth += horizMargins + (child.minWidth || childWidth || 0);
+
+            // Max height for align - force layout of non-laid out subcontainers without a numeric height
+            if (typeof childHeight != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childHeight = child.getHeight();
+            }
+
+            maxHeight = Math.max(maxHeight, childHeight + childMargins.top + childMargins.bottom);
+
+            //cache the size of each child component. Don't set height or width to 0, keep undefined instead
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth  || undefined
+            });
+        }
+                
+        var shortfall = desiredWidth - width,
+            tooNarrow = minimumWidth > width;
+            
+        //the width available to the flexed items
+        var availableWidth = Math.max(0, width - nonFlexWidth - paddingHoriz);
+        
+        if (tooNarrow) {
+            for (i = 0; i < visibleCount; i++) {
+                boxes[i].width = visibleItems[i].minWidth || visibleItems[i].width || boxes[i].width;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minWidths = [];
+                
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the width of each non-flexed item.
+                 * Flexed items are immediately reduced to their minWidth and anything already at minWidth is ignored.
+                 * The remaining items are collected into the minWidths array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item     = visibleItems[index],
+                        minWidth = item.minWidth || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minWidth because they're flexible and should be the first to lose width
+                    if (item.flex) {
+                        boxes[index].width = minWidth;
+                    } else {
+                        minWidths.push({
+                            minWidth : minWidth,
+                            available: boxes[index].width - minWidth,
+                            index    : index
+                        });
+                    }
+                }
+                
+                //sort by descending amount of width remaining before minWidth is reached
+                minWidths.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+                
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual width available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their width and minWidth first, so that if reducing the width by the average
+                 * amount would make that item less than its minWidth, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minWidths.length; i < length; i++) {
+                    var itemIndex = minWidths[i].index;
+                    
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+                        
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldWidth  = box.width,
+                        minWidth  = item.minWidth,
+                        newWidth  = Math.max(minWidth, oldWidth - Math.ceil(shortfall / (length - i))),
+                        reduction = oldWidth - newWidth;
+                    
+                    boxes[itemIndex].width = newWidth;
+                    shortfall -= reduction;                    
+                }
+            } else {
+                //temporary variables used in the flex width calculations below
+                var remainingWidth = availableWidth,
+                    remainingFlex  = totalFlex;
+
+                //calculate the widths of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    vertMargins  = childMargins.top + childMargins.bottom;
+
+                    if (isStart && child.flex && !child.width) {
+                        flexedWidth     = Math.ceil((child.flex / remainingFlex) * remainingWidth);
+                        remainingWidth -= flexedWidth;
+                        remainingFlex  -= child.flex;
+
+                        calcs.width = flexedWidth;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+        
+        if (isCenter) {
+            leftOffset += availableWidth / 2;
+        } else if (isEnd) {
+            leftOffset += availableWidth;
+        }
+        
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+            
+            childMargins = child.margins;
+            leftOffset  += childMargins.left;
+            vertMargins  = childMargins.top + childMargins.bottom;
+            
+            calcs.left = leftOffset;
+            calcs.top  = topOffset + childMargins.top;
+
+            switch (this.align) {
+                case 'stretch':
+                    stretchHeight = availHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchHeight = maxHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'middle':
+                    var diff = availHeight - calcs.height - vertMargins;
+                    if (diff > 0) {
+                        calcs.top = topOffset + vertMargins + (diff / 2);
+                    }
+            }
+            
+            leftOffset += calcs.width + childMargins.right;
+        }
+
+        return {
+            boxes: boxes,
+            meta : {
+                maxHeight   : maxHeight,
+                nonFlexWidth: nonFlexWidth,
+                desiredWidth: desiredWidth,
+                minimumWidth: minimumWidth,
+                shortfall   : desiredWidth - width,
+                tooNarrow   : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.hbox = Ext.layout.HBoxLayout;/**
+ * @class Ext.layout.VBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items vertically down a Container. This layout optionally divides available vertical
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the widths of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.VBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>left</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned horizontally
+     * at the <b>left</b> side of the container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are aligned horizontally at the
+     * <b>mid-width</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched horizontally to fill
+     * the width of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched horizontally to
+     * the size of the largest item.</div></li>
+     * </ul></div>
+     */
+    align : 'left', // left, center, stretch, strechmax
+    type: 'vbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>top</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-height</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>bottom</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>vertically</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the VBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availWidth   = Math.max(0, width - paddingHoriz),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexHeight= 0,
+            maxWidth     = 0,
+            totalFlex    = 0,
+            desiredHeight= 0,
+            minimumHeight= 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+            
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedHeight, 
+            horizMargins, vertMargins, stretchWidth, length;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static height (numeric) requires no calcs
+            if (typeof childHeight != 'number') {
+
+                // flex and not 'auto' height
+                if (child.flex && !childHeight) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' height or undefined height
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childHeight && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize = child.getSize();
+                    childWidth = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+            
+            childMargins = child.margins;
+            vertMargins  = childMargins.top + childMargins.bottom;
+
+            nonFlexHeight += vertMargins + (childHeight || 0);
+            desiredHeight += vertMargins + (child.flex ? child.minHeight || 0 : childHeight);
+            minimumHeight += vertMargins + (child.minHeight || childHeight || 0);
+
+            // Max width for align - force layout of non-layed out subcontainers without a numeric width
+            if (typeof childWidth != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childWidth = child.getWidth();
+            }
+
+            maxWidth = Math.max(maxWidth, childWidth + childMargins.left + childMargins.right);
+
+            //cache the size of each child component
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth || undefined
+            });
+        }
+                
+        var shortfall = desiredHeight - height,
+            tooNarrow = minimumHeight > height;
+
+        //the height available to the flexed items
+        var availableHeight = Math.max(0, (height - nonFlexHeight - paddingVert));
+        
+        if (tooNarrow) {
+            for (i = 0, length = visibleCount; i < length; i++) {
+                boxes[i].height = visibleItems[i].minHeight || visibleItems[i].height || boxes[i].height;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minHeights = [];
+
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the height of each non-flexed item.
+                 * Flexed items are immediately reduced to their minHeight and anything already at minHeight is ignored.
+                 * The remaining items are collected into the minHeights array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item      = visibleItems[index],
+                        minHeight = item.minHeight || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minHeight because they're flexible and should be the first to lose height
+                    if (item.flex) {
+                        boxes[index].height = minHeight;
+                    } else {
+                        minHeights.push({
+                            minHeight: minHeight, 
+                            available: boxes[index].height - minHeight,
+                            index    : index
+                        });
+                    }
+                }
+
+                //sort by descending minHeight value
+                minHeights.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual height available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their height and minHeight first, so that if reducing the height by the average
+                 * amount would make that item less than its minHeight, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minHeights.length; i < length; i++) {
+                    var itemIndex = minHeights[i].index;
+
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldHeight  = box.height,
+                        minHeight  = item.minHeight,
+                        newHeight  = Math.max(minHeight, oldHeight - Math.ceil(shortfall / (length - i))),
+                        reduction = oldHeight - newHeight;
+
+                    boxes[itemIndex].height = newHeight;
+                    shortfall -= reduction;
+                }
+            } else {
+                //temporary variables used in the flex height calculations below
+                var remainingHeight = availableHeight,
+                    remainingFlex   = totalFlex;
+                
+                //calculate the height of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    horizMargins = childMargins.left + childMargins.right;
+
+                    if (isStart && child.flex && !child.height) {
+                        flexedHeight     = Math.ceil((child.flex / remainingFlex) * remainingHeight);
+                        remainingHeight -= flexedHeight;
+                        remainingFlex   -= child.flex;
+
+                        calcs.height = flexedHeight;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+
+        if (isCenter) {
+            topOffset += availableHeight / 2;
+        } else if (isEnd) {
+            topOffset += availableHeight;
+        }
+
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+
+            childMargins = child.margins;
+            topOffset   += childMargins.top;
+            horizMargins = childMargins.left + childMargins.right;
+            
+
+            calcs.left = leftOffset + childMargins.left;
+            calcs.top  = topOffset;
+            
+            switch (this.align) {
+                case 'stretch':
+                    stretchWidth = availWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchWidth = maxWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'center':
+                    var diff = availWidth - calcs.width - horizMargins;
+                    if (diff > 0) {
+                        calcs.left = leftOffset + horizMargins + (diff / 2);
+                    }
+            }
+
+            topOffset += calcs.height + childMargins.bottom;
+        }
+        
+        return {
+            boxes: boxes,
+            meta : {
+                maxWidth     : maxWidth,
+                nonFlexHeight: nonFlexHeight,
+                desiredHeight: desiredHeight,
+                minimumHeight: minimumHeight,
+                shortfall    : desiredHeight - height,
+                tooNarrow    : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.vbox = Ext.layout.VBoxLayout;
+/**
+ * @class Ext.layout.ToolbarLayout
+ * @extends Ext.layout.ContainerLayout
+ * Layout manager used by Ext.Toolbar. This is highly specialised for use by Toolbars and would not
+ * usually be used by any other class.
+ */
+Ext.layout.ToolbarLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'toolbar',
+
+    /**
+     * @property triggerWidth
+     * @type Number
+     * The width allocated for the menu trigger at the extreme right end of the Toolbar
+     */
+    triggerWidth: 18,
+
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+
+    /**
+     * @private
+     * @property lastOverflow
+     * @type Boolean
+     * Used internally to record whether the last layout caused an overflow or not
+     */
+    lastOverflow: false,
+
+    /**
+     * @private
+     * @property tableHTML
+     * @type String
+     * String used to build the HTML injected to support the Toolbar's layout. The align property is
+     * injected into this string inside the td.x-toolbar-left element during onLayout.
+     */
+    tableHTML: [
+        '<table cellspacing="0" class="x-toolbar-ct">',
+            '<tbody>',
+                '<tr>',
+                    '<td class="x-toolbar-left" align="{0}">',
+                        '<table cellspacing="0">',
+                            '<tbody>',
+                                '<tr class="x-toolbar-left-row"></tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                    '<td class="x-toolbar-right" align="right">',
+                        '<table cellspacing="0" class="x-toolbar-right-ct">',
+                            '<tbody>',
+                                '<tr>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-right-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-extras-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                '</tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                '</tr>',
+            '</tbody>',
+        '</table>'
+    ].join(""),
+
+    /**
+     * @private
+     * Create the wrapping Toolbar HTML and render/move all the items into the correct places
+     */
+    onLayout : function(ct, target) {
+        //render the Toolbar <table> HTML if it's not already present
+        if (!this.leftTr) {
+            var align = ct.buttonAlign == 'center' ? 'center' : 'left';
+
+            target.addClass('x-toolbar-layout-ct');
+            target.insertHtml('beforeEnd', String.format(this.tableHTML, align));
+
+            this.leftTr   = target.child('tr.x-toolbar-left-row', true);
+            this.rightTr  = target.child('tr.x-toolbar-right-row', true);
+            this.extrasTr = target.child('tr.x-toolbar-extras-row', true);
+
+            if (this.hiddenItem == undefined) {
+                /**
+                 * @property hiddenItems
+                 * @type Array
+                 * Holds all items that are currently hidden due to there not being enough space to render them
+                 * These items will appear on the expand menu.
+                 */
+                this.hiddenItems = [];
+            }
+        }
+
+        var side     = ct.buttonAlign == 'right' ? this.rightTr : this.leftTr,
+            items    = ct.items.items,
+            position = 0;
+
+        //render each item if not already rendered, place it into the correct (left or right) target
+        for (var i = 0, len = items.length, c; i < len; i++, position++) {
+            c = items[i];
+
+            if (c.isFill) {
+                side   = this.rightTr;
+                position = -1;
+            } else if (!c.rendered) {
+                c.render(this.insertCell(c, side, position));
+                this.configureItem(c);
+            } else {
+                if (!c.xtbHidden && !this.isValidParent(c, side.childNodes[position])) {
+                    var td = this.insertCell(c, side, position);
+                    td.appendChild(c.getPositionEl().dom);
+                    c.container = Ext.get(td);
+                }
+            }
+        }
+
+        //strip extra empty cells
+        this.cleanup(this.leftTr);
+        this.cleanup(this.rightTr);
+        this.cleanup(this.extrasTr);
+        this.fitToSize(target);
+    },
+
+    /**
+     * @private
+     * Removes any empty nodes from the given element
+     * @param {Ext.Element} el The element to clean up
+     */
+    cleanup : function(el) {
+        var cn = el.childNodes, i, c;
+
+        for (i = cn.length-1; i >= 0 && (c = cn[i]); i--) {
+            if (!c.firstChild) {
+                el.removeChild(c);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Inserts the given Toolbar item into the given element
+     * @param {Ext.Component} c The component to add
+     * @param {Ext.Element} target The target to add the component to
+     * @param {Number} position The position to add the component at
+     */
+    insertCell : function(c, target, position) {
+        var td = document.createElement('td');
+        td.className = 'x-toolbar-cell';
+
+        target.insertBefore(td, target.childNodes[position] || null);
+
+        return td;
+    },
+
+    /**
+     * @private
+     * Hides an item because it will not fit in the available width. The item will be unhidden again
+     * if the Toolbar is resized to be large enough to show it
+     * @param {Ext.Component} item The item to hide
+     */
+    hideItem : function(item) {
+        this.hiddenItems.push(item);
+
+        item.xtbHidden = true;
+        item.xtbWidth = item.getPositionEl().dom.parentNode.offsetWidth;
+        item.hide();
+    },
+
+    /**
+     * @private
+     * Unhides an item that was previously hidden due to there not being enough space left on the Toolbar
+     * @param {Ext.Component} item The item to show
+     */
+    unhideItem : function(item) {
+        item.show();
+        item.xtbHidden = false;
+        this.hiddenItems.remove(item);
+    },
+
+    /**
+     * @private
+     * Returns the width of the given toolbar item. If the item is currently hidden because there
+     * is not enough room to render it, its previous width is returned
+     * @param {Ext.Component} c The component to measure
+     * @return {Number} The width of the item
+     */
+    getItemWidth : function(c) {
+        return c.hidden ? (c.xtbWidth || 0) : c.getPositionEl().dom.parentNode.offsetWidth;
+    },
+
+    /**
+     * @private
+     * Called at the end of onLayout. At this point the Toolbar has already been resized, so we need
+     * to fit the items into the available width. We add up the width required by all of the items in
+     * the toolbar - if we don't have enough space we hide the extra items and render the expand menu
+     * trigger.
+     * @param {Ext.Element} target The Element the Toolbar is currently laid out within
+     */
+    fitToSize : function(target) {
+        if (this.container.enableOverflow === false) {
+            return;
+        }
+
+        var width       = target.dom.clientWidth,
+            tableWidth  = target.dom.firstChild.offsetWidth,
+            clipWidth   = width - this.triggerWidth,
+            lastWidth   = this.lastWidth || 0,
+
+            hiddenItems = this.hiddenItems,
+            hasHiddens  = hiddenItems.length != 0,
+            isLarger    = width >= lastWidth;
+
+        this.lastWidth  = width;
+
+        if (tableWidth > width || (hasHiddens && isLarger)) {
+            var items     = this.container.items.items,
+                len       = items.length,
+                loopWidth = 0,
+                item;
+
+            for (var i = 0; i < len; i++) {
+                item = items[i];
+
+                if (!item.isFill) {
+                    loopWidth += this.getItemWidth(item);
+                    if (loopWidth > clipWidth) {
+                        if (!(item.hidden || item.xtbHidden)) {
+                            this.hideItem(item);
+                        }
+                    } else if (item.xtbHidden) {
+                        this.unhideItem(item);
+                    }
+                }
+            }
+        }
+
+        //test for number of hidden items again here because they may have changed above
+        hasHiddens = hiddenItems.length != 0;
+
+        if (hasHiddens) {
+            this.initMore();
+
+            if (!this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, true);
+                this.lastOverflow = true;
+            }
+        } else if (this.more) {
+            this.clearMenu();
+            this.more.destroy();
+            delete this.more;
+
+            if (this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, false);
+                this.lastOverflow = false;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+
+    /**
+     * @private
+     * Called before the expand menu is shown, this rebuilds the menu since it was last shown because
+     * it is possible that the items hidden due to space limitations on the Toolbar have changed since.
+     * @param {Ext.menu.Menu} m The menu
+     */
+    beforeMoreShow : function(menu) {
+        var items = this.container.items.items,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+
+        this.clearMenu();
+        menu.removeAll();
+        for (var i = 0; i < len; i++) {
+            item = items[i];
+            if (item.xtbHidden) {
+                if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                    menu.add('-');
+                }
+                this.addComponentToMenu(menu, item);
+                prev = item;
+            }
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+
+    /**
+     * @private
+     * Creates the expand trigger and menu, adding them to the <tr> at the extreme right of the
+     * Toolbar table
+     */
+    initMore : function(){
+        if (!this.more) {
+            /**
+             * @private
+             * @property moreMenu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every Toolbar item that cannot be shown
+             * because the Toolbar is currently not wide enough.
+             */
+            this.moreMenu = new Ext.menu.Menu({
+                ownerCt : this.container,
+                listeners: {
+                    beforeshow: this.beforeMoreShow,
+                    scope: this
+                }
+            });
+
+            /**
+             * @private
+             * @property more
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.more = new Ext.Button({
+                iconCls: 'x-toolbar-more-icon',
+                cls    : 'x-toolbar-more',
+                menu   : this.moreMenu,
+                ownerCt: this.container
+            });
+
+            var td = this.insertCell(this.more, this.extrasTr, 100);
+            this.more.render(td);
+        }
+    },
+
+    destroy : function(){
+        Ext.destroy(this.more, this.moreMenu);
+        delete this.leftTr;
+        delete this.rightTr;
+        delete this.extrasTr;
+        Ext.layout.ToolbarLayout.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS.toolbar = Ext.layout.ToolbarLayout;
+/**
+ * @class Ext.layout.MenuLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Layout manager used by {@link Ext.menu.Menu}. Generally this class should not need to be used directly.</p>
+ */
+ Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'menu',
+
+    setContainer : function(ct){
+        this.monitorResize = !ct.floating;
+        // This event is only fired by the menu in IE, used so we don't couple
+        // the menu with the layout.
+        ct.on('autosize', this.doAutoSize, this);
+        Ext.layout.MenuLayout.superclass.setContainer.call(this, ct);
+    },
+
+    renderItem : function(c, position, target){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
+                '<li id="{itemId}" class="{itemCls}">',
+                    '<tpl if="needsIcon">',
+                        '<img alt="{altText}" src="{icon}" class="{iconCls}"/>',
+                    '</tpl>',
+                '</li>'
+            );
+        }
+
+        if(c && !c.rendered){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            var a = this.getItemArgs(c);
+
+//          The Component's positionEl is the <li> it is rendered into
+            c.render(c.positionEl = position ?
+                this.itemTpl.insertBefore(position, a, true) :
+                this.itemTpl.append(target, a, true));
+
+//          Link the containing <li> to the item.
+            c.positionEl.menuItemId = c.getItemId();
+
+//          If rendering a regular Component, and it needs an icon,
+//          move the Component rightwards.
+            if (!a.isMenuItem && a.needsIcon) {
+                c.positionEl.addClass('x-menu-list-item-indent');
+            }
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            target.dom.insertBefore(c.getActionEl().dom, position || null);
+        }
+    },
+
+    getItemArgs : function(c) {
+        var isMenuItem = c instanceof Ext.menu.Item,
+            canHaveIcon = !(isMenuItem || c instanceof Ext.menu.Separator);
+
+        return {
+            isMenuItem: isMenuItem,
+            needsIcon: canHaveIcon && (c.icon || c.iconCls),
+            icon: c.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: 'x-menu-item-icon ' + (c.iconCls || ''),
+            itemId: 'x-menu-el-' + c.id,
+            itemCls: 'x-menu-list-item ',
+            altText: c.altText || ''
+        };
+    },
+
+    //  Valid if the Component is in a <li> which is part of our target <ul>
+    isValidParent : function(c, target) {
+        return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target);
+    },
+
+    onLayout : function(ct, target){
+        Ext.layout.MenuLayout.superclass.onLayout.call(this, ct, target);
+        this.doAutoSize();
+    },
+
+    doAutoSize : function(){
+        var ct = this.container, w = ct.width;
+        if(ct.floating){
+            if(w){
+                ct.setWidth(w);
+            }else if(Ext.isIE){
+                ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8 || Ext.isIE9) ? 'auto' : ct.minWidth);
+                var el = ct.getEl(), t = el.dom.offsetWidth; // force recalc
+                ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr'));
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout;
+/**
+ * @class Ext.Viewport
+ * @extends Ext.Container
+ * <p>A specialized container representing the viewable application area (the browser viewport).</p>
+ * <p>The Viewport renders itself to the document body, and automatically sizes itself to the size of
+ * the browser viewport and manages window resizing. There may only be one Viewport created
+ * in a page. Inner layouts are available by virtue of the fact that all {@link Ext.Panel Panel}s
+ * added to the Viewport, either through its {@link #items}, or through the items, or the {@link #add}
+ * method of any of its child Panels may themselves have a layout.</p>
+ * <p>The Viewport does not provide scrolling, so child Panels within the Viewport should provide
+ * for scrolling if needed using the {@link #autoScroll} config.</p>
+ * <p>An example showing a classic application border layout:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'north',
+        html: '&lt;h1 class="x-panel-header">Page Title&lt;/h1>',
+        autoHeight: true,
+        border: false,
+        margins: '0 0 5 0'
+    }, {
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        width: 200
+        // the west region might typically utilize a {@link Ext.tree.TreePanel TreePanel} or a Panel with {@link Ext.layout.AccordionLayout Accordion layout}
+    }, {
+        region: 'south',
+        title: 'Title for Panel',
+        collapsible: true,
+        html: 'Information goes here',
+        split: true,
+        height: 100,
+        minHeight: 100
+    }, {
+        region: 'east',
+        title: 'Title for the Grid Panel',
+        collapsible: true,
+        split: true,
+        width: 200,
+        xtype: 'grid',
+        // remaining grid configuration not shown ...
+        // notice that the GridPanel is added directly as the region
+        // it is not "overnested" inside another Panel
+    }, {
+        region: 'center',
+        xtype: 'tabpanel', // TabPanel itself has no title
+        items: {
+            title: 'Default Tab',
+            html: 'The first tab\'s content. Others may be added dynamically'
+        }
+    }]
+});
+</code></pre>
+ * @constructor
+ * Create a new Viewport
+ * @param {Object} config The config object
+ * @xtype viewport
+ */
+Ext.Viewport = Ext.extend(Ext.Container, {
+    /*
+     * Privatize config options which, if used, would interfere with the
+     * correct operation of the Viewport as the sole manager of the
+     * layout of the document body.
+     */
+    /**
+     * @cfg {Mixed} applyTo @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Mixed} renderTo @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Number} height @hide
+     */
+    /**
+     * @cfg {Number} width @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} deferHeight @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize @hide
+     */
+
+    initComponent : function() {
+        Ext.Viewport.superclass.initComponent.call(this);
+        document.getElementsByTagName('html')[0].className += ' x-viewport';
+        this.el = Ext.getBody();
+        this.el.setHeight = Ext.emptyFn;
+        this.el.setWidth = Ext.emptyFn;
+        this.el.setSize = Ext.emptyFn;
+        this.el.dom.scroll = 'no';
+        this.allowDomMove = false;
+        this.autoWidth = true;
+        this.autoHeight = true;
+        Ext.EventManager.onWindowResize(this.fireResize, this);
+        this.renderTo = this.el;
+    },
+
+    fireResize : function(w, h){
+        this.fireEvent('resize', this, w, h, w, h);
+    }
+});
+Ext.reg('viewport', Ext.Viewport);
+/**
+ * @class Ext.Panel
+ * @extends Ext.Container
+ * <p>Panel is a container that has specific functionality and structural components that make
+ * it the perfect building block for application-oriented user interfaces.</p>
+ * <p>Panels are, by virtue of their inheritance from {@link Ext.Container}, capable
+ * of being configured with a {@link Ext.Container#layout layout}, and containing child Components.</p>
+ * <p>When either specifying child {@link Ext.Component#items items} of a Panel, or dynamically {@link Ext.Container#add adding} Components
+ * to a Panel, remember to consider how you wish the Panel to arrange those child elements, and whether
+ * those child elements need to be sized using one of Ext's built-in <code><b>{@link Ext.Container#layout layout}</b></code> schemes. By
+ * default, Panels use the {@link Ext.layout.ContainerLayout ContainerLayout} scheme. This simply renders
+ * child components, appending them one after the other inside the Container, and <b>does not apply any sizing</b>
+ * at all.</p>
+ * <p>A Panel may also contain {@link #bbar bottom} and {@link #tbar top} toolbars, along with separate
+ * {@link #header}, {@link #footer} and {@link #body} sections (see {@link #frame} for additional
+ * information).</p>
+ * <p>Panel also provides built-in {@link #collapsible expandable and collapsible behavior}, along with
+ * a variety of {@link #tools prebuilt tool buttons} that can be wired up to provide other customized
+ * behavior.  Panels can be easily dropped into any {@link Ext.Container Container} or layout, and the
+ * layout and rendering pipeline is {@link Ext.Container#add completely managed by the framework}.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype panel
+ */
+Ext.Panel = Ext.extend(Ext.Container, {
+    /**
+     * The Panel's header {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the {@link #title} and {@link #tools}</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property header
+     */
+    /**
+     * The Panel's body {@link Ext.Element Element} which may be used to contain HTML content.
+     * The content may be specified in the {@link #html} config, or it may be loaded using the
+     * {@link autoLoad} config, or through the Panel's {@link #getUpdater Updater}. Read-only.
+     * <p>If this is used to load visible HTML elements in either way, then
+     * the Panel may not be used as a Layout for hosting nested Panels.</p>
+     * <p>If this Panel is intended to be used as the host of a Layout (See {@link #layout}
+     * then the body Element must not be loaded or changed - it is under the control
+     * of the Panel's Layout.
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property body
+     */
+    /**
+     * The Panel's bwrap {@link Ext.Element Element} used to contain other Panel elements
+     * (tbar, body, bbar, footer). See {@link #bodyCfg}. Read-only.
+     * @type Ext.Element
+     * @property bwrap
+     */
+    /**
+     * True if this panel is collapsed. Read-only.
+     * @type Boolean
+     * @property collapsed
+     */
+    /**
+     * @cfg {Object} bodyCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object may be specified for any
+     * Panel Element.</p>
+     * <p>By default, the Default element in the table below will be used for the html markup to
+     * create a child element with the commensurate Default class name (<code>baseCls</code> will be
+     * replaced by <code>{@link #baseCls}</code>):</p>
+     * <pre>
+     * Panel      Default  Default             Custom      Additional       Additional
+     * Element    element  class               element     class            style
+     * ========   ==========================   =========   ==============   ===========
+     * {@link #header}     div      {@link #baseCls}+'-header'   {@link #headerCfg}   headerCssClass   headerStyle
+     * {@link #bwrap}      div      {@link #baseCls}+'-bwrap'     {@link #bwrapCfg}    bwrapCssClass    bwrapStyle
+     * + tbar     div      {@link #baseCls}+'-tbar'       {@link #tbarCfg}     tbarCssClass     tbarStyle
+     * + {@link #body}     div      {@link #baseCls}+'-body'       {@link #bodyCfg}     {@link #bodyCssClass}     {@link #bodyStyle}
+     * + bbar     div      {@link #baseCls}+'-bbar'       {@link #bbarCfg}     bbarCssClass     bbarStyle
+     * + {@link #footer}   div      {@link #baseCls}+'-footer'   {@link #footerCfg}   footerCssClass   footerStyle
+     * </pre>
+     * <p>Configuring a Custom element may be used, for example, to force the {@link #body} Element
+     * to use a different form of markup than is created by default. An example of this might be
+     * to {@link Ext.Element#createChild create a child} Panel containing a custom content, such as
+     * a header, or forcing centering of all Panel content by having the body be a &lt;center&gt;
+     * element:</p>
+     * <pre><code>
+new Ext.Panel({
+    title: 'Message Title',
+    renderTo: Ext.getBody(),
+    width: 200, height: 130,
+    <b>bodyCfg</b>: {
+        tag: 'center',
+        cls: 'x-panel-body',  // Default class not applied if Custom element specified
+        html: 'Message'
+    },
+    footerCfg: {
+        tag: 'h2',
+        cls: 'x-panel-footer',        // same as the Default class
+        html: 'footer html'
+    },
+    footerCssClass: 'custom-footer', // additional css class, see {@link Ext.element#addClass addClass}
+    footerStyle:    'background-color:red' // see {@link #bodyStyle}
+});
+     * </code></pre>
+     * <p>The example above also explicitly creates a <code>{@link #footer}</code> with custom markup and
+     * styling applied.</p>
+     */
+    /**
+     * @cfg {Object} headerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #header} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bwrapCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bwrap} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} tbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #tbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} footerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #footer} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Boolean} closable
+     * Panels themselves do not directly support being closed, but some Panel subclasses do (like
+     * {@link Ext.Window}) or a Panel Class within an {@link Ext.TabPanel}.  Specify <code>true</code>
+     * to enable closing in such situations. Defaults to <code>false</code>.
+     */
+    /**
+     * The Panel's footer {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the Panel's <code>{@link #buttons}</code> or <code>{@link #fbar}</code>.</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property footer
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>The id of the node, a DOM node or an existing Element corresponding to a DIV that is already present in
+     * the document that specifies some panel-specific structural markup.  When <code>applyTo</code> is used,
+     * constituent parts of the panel can be specified by CSS class name within the main element, and the panel
+     * will automatically create those components from that markup. Any required components not specified in the
+     * markup will be autogenerated if necessary.</p>
+     * <p>The following class names are supported (baseCls will be replaced by {@link #baseCls}):</p>
+     * <ul><li>baseCls + '-header'</li>
+     * <li>baseCls + '-header-text'</li>
+     * <li>baseCls + '-bwrap'</li>
+     * <li>baseCls + '-tbar'</li>
+     * <li>baseCls + '-body'</li>
+     * <li>baseCls + '-bbar'</li>
+     * <li>baseCls + '-footer'</li></ul>
+     * <p>Using this config, a call to render() is not required.  If applyTo is specified, any value passed for
+     * {@link #renderTo} will be ignored and the target element's parent node will automatically be used as the
+     * panel's container.</p>
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * <p>The top toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the top toolbar after render, use {@link #getTopToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Object/Array} bbar
+     * <p>The bottom toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the bottom toolbar after render, use {@link #getBottomToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /** @cfg {Object/Array} fbar
+     * <p>A {@link Ext.Toolbar Toolbar} object, a Toolbar config, or an array of
+     * {@link Ext.Button Button}s/{@link Ext.Button Button} configs, describing a {@link Ext.Toolbar Toolbar} to be rendered into this Panel's footer element.</p>
+     * <p>After render, the <code>fbar</code> property will be an {@link Ext.Toolbar Toolbar} instance.</p>
+     * <p>If <code>{@link #buttons}</code> are specified, they will supersede the <code>fbar</code> configuration property.</p>
+     * The Panel's <code>{@link #buttonAlign}</code> configuration affects the layout of these items, for example:
+     * <pre><code>
+var w = new Ext.Window({
+    height: 250,
+    width: 500,
+    bbar: new Ext.Toolbar({
+        items: [{
+            text: 'bbar Left'
+        },'->',{
+            text: 'bbar Right'
+        }]
+    }),
+    {@link #buttonAlign}: 'left', // anything but 'center' or 'right' and you can use '-', and '->'
+                                  // to control the alignment of fbar items
+    fbar: [{
+        text: 'fbar Left'
+    },'->',{
+        text: 'fbar Right'
+    }]
+}).show();
+     * </code></pre>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Boolean} header
+     * <code>true</code> to create the Panel's header element explicitly, <code>false</code> to skip creating
+     * it.  If a <code>{@link #title}</code> is set the header will be created automatically, otherwise it will not.
+     * If a <code>{@link #title}</code> is set but <code>header</code> is explicitly set to <code>false</code>, the header
+     * will not be rendered.
+     */
+    /**
+     * @cfg {Boolean} footer
+     * <code>true</code> to create the footer element explicitly, false to skip creating it. The footer
+     * will be created automatically if <code>{@link #buttons}</code> or a <code>{@link #fbar}</code> have
+     * been configured.  See <code>{@link #bodyCfg}</code> for an example.
+     */
+    /**
+     * @cfg {String} title
+     * The title text to be used as innerHTML (html tags are accepted) to display in the panel
+     * <code>{@link #header}</code> (defaults to ''). When a <code>title</code> is specified the
+     * <code>{@link #header}</code> element will automatically be created and displayed unless
+     * {@link #header} is explicitly set to <code>false</code>.  If you do not want to specify a
+     * <code>title</code> at config time, but you may want one later, you must either specify a non-empty
+     * <code>title</code> (a blank space ' ' will do) or <code>header:true</code> so that the container
+     * element will get created.
+     */
+    /**
+     * @cfg {Array} buttons
+     * <code>buttons</code> will be used as <code>{@link Ext.Container#items items}</code> for the toolbar in
+     * the footer (<code>{@link #fbar}</code>). Typically the value of this configuration property will be
+     * an array of {@link Ext.Button}s or {@link Ext.Button} configuration objects.
+     * If an item is configured with <code>minWidth</code> or the Panel is configured with <code>minButtonWidth</code>,
+     * that width will be applied to the item.
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * A valid url spec according to the Updater {@link Ext.Updater#update} method.
+     * If autoLoad is not null, the panel will attempt to load its contents
+     * immediately upon render.<p>
+     * The URL will become the default URL for this panel's {@link #body} element,
+     * so it may be {@link Ext.Element#refresh refresh}ed at any time.</p>
+     */
+    /**
+     * @cfg {Boolean} frame
+     * <code>false</code> by default to render with plain 1px square borders. <code>true</code> to render with
+     * 9 elements, complete with custom rounded corners (also see {@link Ext.Element#boxWrap}).
+     * <p>The template generated for each condition is depicted below:</p><pre><code>
+     *
+// frame = false
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+
+    &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:false)&lt;/span>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+    &lt;/div>
+&lt;/div>
+
+// frame = true (create 9 elements)
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+    &lt;div class="x-panel-tl">&lt;div class="x-panel-tr">&lt;div class="x-panel-tc">
+        &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:true)&lt;/span>&lt;/div>
+    &lt;/div>&lt;/div>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-ml">&lt;div class="x-panel-mr">&lt;div class="x-panel-mc">
+            &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+        &lt;/div>&lt;/div>&lt;/div>
+
+        &lt;div class="x-panel-bl">&lt;div class="x-panel-br">&lt;div class="x-panel-bc"/>
+        &lt;/div>&lt;/div>&lt;/div>
+&lt;/div>
+     * </code></pre>
+     */
+    /**
+     * @cfg {Boolean} border
+     * True to display the borders of the panel's body element, false to hide them (defaults to true).  By default,
+     * the border is a 2px wide inset border, but this can be further altered by setting {@link #bodyBorder} to false.
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * True to display an interior border on the body element of the panel, false to hide it (defaults to true).
+     * This only applies when {@link #border} == true.  If border == true and bodyBorder == false, the border will display
+     * as a 1px wide inset border, giving the entire body element an inset appearance.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyCssClass
+     * Additional css class selector to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#addClass} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyStyle
+     * Custom CSS styles to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#applyStyles} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'my-icon'
+
+// css class that specifies background image to be used as the icon image:
+.my-icon { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * True to make the panel collapsible and have the expand/collapse toggle button automatically rendered into
+     * the header tool button area, false to keep the panel statically sized with no button (defaults to false).
+     */
+    /**
+     * @cfg {Array} tools
+     * An array of tool button configs to be added to the header tool area. When rendered, each tool is
+     * stored as an {@link Ext.Element Element} referenced by a public property called <code><b></b>tools.<i>&lt;tool-type&gt;</i></code>
+     * <p>Each tool config may contain the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc"><b>Required.</b> The type
+     * of tool to create. By default, this assigns a CSS class of the form <code>x-tool-<i>&lt;tool-type&gt;</i></code> to the
+     * resulting tool Element. Ext provides CSS rules, and an icon sprite containing images for the tool types listed below.
+     * The developer may implement custom tools by supplying alternate CSS rules and background images:
+     * <ul>
+     * <div class="x-tool x-tool-toggle" style="float:left; margin-right:5;"> </div><div><code> toggle</code> (Created by default when {@link #collapsible} is <code>true</code>)</div>
+     * <div class="x-tool x-tool-close" style="float:left; margin-right:5;"> </div><div><code> close</code></div>
+     * <div class="x-tool x-tool-minimize" style="float:left; margin-right:5;"> </div><div><code> minimize</code></div>
+     * <div class="x-tool x-tool-maximize" style="float:left; margin-right:5;"> </div><div><code> maximize</code></div>
+     * <div class="x-tool x-tool-restore" style="float:left; margin-right:5;"> </div><div><code> restore</code></div>
+     * <div class="x-tool x-tool-gear" style="float:left; margin-right:5;"> </div><div><code> gear</code></div>
+     * <div class="x-tool x-tool-pin" style="float:left; margin-right:5;"> </div><div><code> pin</code></div>
+     * <div class="x-tool x-tool-unpin" style="float:left; margin-right:5;"> </div><div><code> unpin</code></div>
+     * <div class="x-tool x-tool-right" style="float:left; margin-right:5;"> </div><div><code> right</code></div>
+     * <div class="x-tool x-tool-left" style="float:left; margin-right:5;"> </div><div><code> left</code></div>
+     * <div class="x-tool x-tool-up" style="float:left; margin-right:5;"> </div><div><code> up</code></div>
+     * <div class="x-tool x-tool-down" style="float:left; margin-right:5;"> </div><div><code> down</code></div>
+     * <div class="x-tool x-tool-refresh" style="float:left; margin-right:5;"> </div><div><code> refresh</code></div>
+     * <div class="x-tool x-tool-minus" style="float:left; margin-right:5;"> </div><div><code> minus</code></div>
+     * <div class="x-tool x-tool-plus" style="float:left; margin-right:5;"> </div><div><code> plus</code></div>
+     * <div class="x-tool x-tool-help" style="float:left; margin-right:5;"> </div><div><code> help</code></div>
+     * <div class="x-tool x-tool-search" style="float:left; margin-right:5;"> </div><div><code> search</code></div>
+     * <div class="x-tool x-tool-save" style="float:left; margin-right:5;"> </div><div><code> save</code></div>
+     * <div class="x-tool x-tool-print" style="float:left; margin-right:5;"> </div><div><code> print</code></div>
+     * </ul></div></li>
+     * <li><b>handler</b> : Function<div class="sub-desc"><b>Required.</b> The function to
+     * call when clicked. Arguments passed are:<ul>
+     * <li><b>event</b> : Ext.EventObject<div class="sub-desc">The click event.</div></li>
+     * <li><b>toolEl</b> : Ext.Element<div class="sub-desc">The tool Element.</div></li>
+     * <li><b>panel</b> : Ext.Panel<div class="sub-desc">The host Panel</div></li>
+     * <li><b>tc</b> : Object<div class="sub-desc">The tool configuration object</div></li>
+     * </ul></div></li>
+     * <li><b>stopEvent</b> : Boolean<div class="sub-desc">Defaults to true. Specify as false to allow click event to propagate.</div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the handler.</div></li>
+     * <li><b>qtip</b> : String/Object<div class="sub-desc">A tip string, or
+     * a config argument to {@link Ext.QuickTip#register}</div></li>
+     * <li><b>hidden</b> : Boolean<div class="sub-desc">True to initially render hidden.</div></li>
+     * <li><b>on</b> : Object<div class="sub-desc">A listener config object specifiying
+     * event listeners in the format of an argument to {@link #addListener}</div></li>
+     * </ul></div>
+     * <p>Note that, apart from the toggle tool which is provided when a panel is collapsible, these
+     * tools only provide the visual button. Any required functionality must be provided by adding
+     * handlers that implement the necessary behavior.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+tools:[{
+    id:'refresh',
+    qtip: 'Refresh form Data',
+    // hidden:true,
+    handler: function(event, toolEl, panel){
+        // refresh logic
+    }
+},
+{
+    id:'help',
+    qtip: 'Get Help',
+    handler: function(event, toolEl, panel){
+        // whatever
+    }
+}]
+</code></pre>
+     * <p>For the custom id of <code>'help'</code> define two relevant css classes with a link to
+     * a 15x15 image:</p>
+     * <pre><code>
+.x-tool-help {background-image: url(images/help.png);}
+.x-tool-help-over {background-image: url(images/help_over.png);}
+// if using an image sprite:
+.x-tool-help {background-image: url(images/help.png) no-repeat 0 0;}
+.x-tool-help-over {background-position:-15px 0;}
+</code></pre>
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * <p>A Template used to create {@link #tools} in the {@link #header} Element. Defaults to:</p><pre><code>
+new Ext.Template('&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>')</code></pre>
+     * <p>This may may be overridden to provide a custom DOM structure for tools based upon a more
+     * complex XTemplate. The template's data is a single tool configuration object (Not the entire Array)
+     * as specified in {@link #tools}.  In the following example an &lt;a> tag is used to provide a
+     * visual indication when hovering over the tool:</p><pre><code>
+var win = new Ext.Window({
+    tools: [{
+        id: 'download',
+        href: '/MyPdfDoc.pdf'
+    }],
+    toolTemplate: new Ext.XTemplate(
+        '&lt;tpl if="id==\'download\'">',
+            '&lt;a class="x-tool x-tool-pdf" href="{href}">&lt;/a>',
+        '&lt;/tpl>',
+        '&lt;tpl if="id!=\'download\'">',
+            '&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>',
+        '&lt;/tpl>'
+    ),
+    width:500,
+    height:300,
+    closeAction:'hide'
+});</code></pre>
+     * <p>Note that the CSS class 'x-tool-pdf' should have an associated style rule which provides an
+     * appropriate background image, something like:</p>
+    <pre><code>
+    a.x-tool-pdf {background-image: url(../shared/extjs/images/pdf.gif)!important;}
+    </code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * <code>true</code> to hide the expand/collapse toggle button when <code>{@link #collapsible} == true</code>,
+     * <code>false</code> to display it (defaults to <code>false</code>).
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * <code>true</code> to allow expanding and collapsing the panel (when <code>{@link #collapsible} = true</code>)
+     * by clicking anywhere in the header bar, <code>false</code>) to allow it only by clicking to tool button
+     * (defaults to <code>false</code>)). If this panel is a child item of a border layout also see the
+     * {@link Ext.layout.BorderLayout.Region BorderLayout.Region}
+     * <code>{@link Ext.layout.BorderLayout.Region#floatable floatable}</code> config option.
+     */
+
+    /**
+     * @cfg {Mixed} floating
+     * <p>This property is used to configure the underlying {@link Ext.Layer}. Acceptable values for this
+     * configuration property are:</p><div class="mdetail-params"><ul>
+     * <li><b><code>false</code></b> : <b>Default.</b><div class="sub-desc">Display the panel inline where it is
+     * rendered.</div></li>
+     * <li><b><code>true</code></b> : <div class="sub-desc">Float the panel (absolute position it with automatic
+     * shimming and shadow).<ul>
+     * <div class="sub-desc">Setting floating to true will create an Ext.Layer for this panel and display the
+     * panel at negative offsets so that it is hidden.</div>
+     * <div class="sub-desc">Since the panel will be absolute positioned, the position must be set explicitly
+     * <i>after</i> render (e.g., <code>myPanel.setPosition(100,100);</code>).</div>
+     * <div class="sub-desc"><b>Note</b>: when floating a panel you should always assign a fixed width,
+     * otherwise it will be auto width and will expand to fill to the right edge of the viewport.</div>
+     * </ul></div></li>
+     * <li><b><code>{@link Ext.Layer object}</code></b> : <div class="sub-desc">The specified object will be used
+     * as the configuration object for the {@link Ext.Layer} that will be created.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * <code>true</code> (or a valid Ext.Shadow {@link Ext.Shadow#mode} value) to display a shadow behind the
+     * panel, <code>false</code> to display no shadow (defaults to <code>'sides'</code>).  Note that this option
+     * only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * The number of pixels to offset the shadow if displayed (defaults to <code>4</code>). Note that this
+     * option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Boolean} shim
+     * <code>false</code> to disable the iframe shim in browsers which need one (defaults to <code>true</code>).
+     * Note that this option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Object/Array} keys
+     * A {@link Ext.KeyMap} config object (in the format expected by {@link Ext.KeyMap#addBinding}
+     * used to assign custom key handling to this panel (defaults to <code>null</code>).
+     */
+    /**
+     * @cfg {Boolean/Object} draggable
+     * <p><code>true</code> to enable dragging of this Panel (defaults to <code>false</code>).</p>
+     * <p>For custom drag/drop implementations, an <b>Ext.Panel.DD</b> config could also be passed
+     * in this config instead of <code>true</code>. Ext.Panel.DD is an internal, undocumented class which
+     * moves a proxy Element around in place of the Panel's element, but provides no other behaviour
+     * during dragging or on drop. It is a subclass of {@link Ext.dd.DragSource}, so behaviour may be
+     * added by implementing the interface methods of {@link Ext.dd.DragDrop} e.g.:
+     * <pre><code>
+new Ext.Panel({
+    title: 'Drag me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    draggable: {
+//      Config option of Ext.Panel.DD class.
+//      It&#39;s a floating Panel, so do not show a placeholder proxy in the original position.
+        insertProxy: false,
+
+//      Called for each mousemove event while dragging the DD object.
+        onDrag : function(e){
+//          Record the x,y position of the drag proxy so that we can
+//          position the Panel at end of drag.
+            var pel = this.proxy.getEl();
+            this.x = pel.getLeft(true);
+            this.y = pel.getTop(true);
+
+//          Keep the Shadow aligned if there is one.
+            var s = this.panel.getEl().shadow;
+            if (s) {
+                s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
+            }
+        },
+
+//      Called on the mouseup event.
+        endDrag : function(e){
+            this.panel.setPosition(this.x, this.y);
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this panel disabled (default is <code>false</code>). An important note when using the disabled
+     * config on panels is that IE will often fail to initialize the disabled mask element correectly if
+     * the panel's layout has not yet completed by the time the Panel is disabled during the render process.
+     * If you experience this issue, you may need to instead use the {@link #afterlayout} event to initialize
+     * the disabled state:
+     * <pre><code>
+new Ext.Panel({
+    ...
+    listeners: {
+        'afterlayout': {
+            fn: function(p){
+                p.disable();
+            },
+            single: true // important, as many layouts can occur
+        }
+    }
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <code>true</code> to use height:'auto', <code>false</code> to use fixed height (defaults to <code>false</code>).
+     * <b>Note</b>: Setting <code>autoHeight: true</code> means that the browser will manage the panel's height
+     * based on its contents, and that Ext will not manage it at all. If the panel is within a layout that
+     * manages dimensions (<code>fit</code>, <code>border</code>, etc.) then setting <code>autoHeight: true</code>
+     * can cause issues with scrolling and will not generally work as expected since the panel will take
+     * on the height of its contents rather than the height required by the Ext layout.
+     */
+
+
+    /**
+     * @cfg {String} baseCls
+     * The base CSS class to apply to this panel's element (defaults to <code>'x-panel'</code>).
+     * <p>Another option available by default is to specify <code>'x-plain'</code> which strips all styling
+     * except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     * See <code>{@link #unstyled}</code> also.</p>
+     */
+    baseCls : 'x-panel',
+    /**
+     * @cfg {String} collapsedCls
+     * A CSS class to add to the panel's element after it has been collapsed (defaults to
+     * <code>'x-panel-collapsed'</code>).
+     */
+    collapsedCls : 'x-panel-collapsed',
+    /**
+     * @cfg {Boolean} maskDisabled
+     * <code>true</code> to mask the panel when it is {@link #disabled}, <code>false</code> to not mask it (defaults
+     * to <code>true</code>).  Either way, the panel will always tell its contained elements to disable themselves
+     * when it is disabled, but masking the panel can provide an additional visual cue that the panel is
+     * disabled.
+     */
+    maskDisabled : true,
+    /**
+     * @cfg {Boolean} animCollapse
+     * <code>true</code> to animate the transition when the panel is collapsed, <code>false</code> to skip the
+     * animation (defaults to <code>true</code> if the {@link Ext.Fx} class is available, otherwise <code>false</code>).
+     */
+    animCollapse : Ext.enableFx,
+    /**
+     * @cfg {Boolean} headerAsText
+     * <code>true</code> to display the panel <code>{@link #title}</code> in the <code>{@link #header}</code>,
+     * <code>false</code> to hide it (defaults to <code>true</code>).
+     */
+    headerAsText : true,
+    /**
+     * @cfg {String} buttonAlign
+     * The alignment of any {@link #buttons} added to this panel.  Valid values are <code>'right'</code>,
+     * <code>'left'</code> and <code>'center'</code> (defaults to <code>'right'</code>).
+     */
+    buttonAlign : 'right',
+    /**
+     * @cfg {Boolean} collapsed
+     * <code>true</code> to render the panel collapsed, <code>false</code> to render it expanded (defaults to
+     * <code>false</code>).
+     */
+    collapsed : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * <code>true</code> to make sure the collapse/expand toggle button always renders first (to the left of)
+     * any other tools in the panel's title bar, <code>false</code> to render it last (defaults to <code>true</code>).
+     */
+    collapseFirst : true,
+    /**
+     * @cfg {Number} minButtonWidth
+     * Minimum width in pixels of all {@link #buttons} in this panel (defaults to <code>75</code>)
+     */
+    minButtonWidth : 75,
+    /**
+     * @cfg {Boolean} unstyled
+     * Overrides the <code>{@link #baseCls}</code> setting to <code>{@link #baseCls} = 'x-plain'</code> which renders
+     * the panel unstyled except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     */
+    /**
+     * @cfg {String} elements
+     * A comma-delimited list of panel elements to initialize when the panel is rendered.  Normally, this list will be
+     * generated automatically based on the items added to the panel at config time, but sometimes it might be useful to
+     * make sure a structural element is rendered even if not specified at config time (for example, you may want
+     * to add a button or toolbar dynamically after the panel has been rendered).  Adding those elements to this
+     * list will allocate the required placeholders in the panel when it is rendered.  Valid values are<div class="mdetail-params"><ul>
+     * <li><code>header</code></li>
+     * <li><code>tbar</code> (top bar)</li>
+     * <li><code>body</code></li>
+     * <li><code>bbar</code> (bottom bar)</li>
+     * <li><code>footer</code></li>
+     * </ul></div>
+     * Defaults to '<code>body</code>'.
+     */
+    elements : 'body',
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * Defaults to <code>false</code>.  When set to <code>true</code>, an extra css class <code>'x-panel-normal'</code>
+     * will be added to the panel's element, effectively applying css styles suggested by the W3C
+     * (see http://www.w3.org/TR/CSS21/sample.html) to the Panel's <b>body</b> element (not the header,
+     * footer, etc.).
+     */
+    preventBodyReset : false,
+
+    /**
+     * @cfg {Number/String} padding
+     * A shortcut for setting a padding style on the body element. The value can either be
+     * a number to be applied to all sides, or a normal css string describing padding.
+     * Defaults to <tt>undefined</tt>.
+     *
+     */
+    padding: undefined,
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <tt>'bodyresize'</tt>.
+     */
+    resizeEvent: 'bodyresize',
+
+    // protected - these could be used to customize the behavior of the window,
+    // but changing them would not be useful without further mofifications and
+    // could lead to unexpected or undesirable results.
+    toolTarget : 'header',
+    collapseEl : 'bwrap',
+    slideAnchor : 't',
+    disabledClass : '',
+
+    // private, notify box this class will handle heights
+    deferHeight : true,
+    // private
+    expandDefaults: {
+        duration : 0.25
+    },
+    // private
+    collapseDefaults : {
+        duration : 0.25
+    },
+
+    // private
+    initComponent : function(){
+        Ext.Panel.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event bodyresize
+             * Fires after the Panel has been resized.
+             * @param {Ext.Panel} p the Panel which has been resized.
+             * @param {Number} width The Panel body's new width.
+             * @param {Number} height The Panel body's new height.
+             */
+            'bodyresize',
+            /**
+             * @event titlechange
+             * Fires after the Panel title has been {@link #title set} or {@link #setTitle changed}.
+             * @param {Ext.Panel} p the Panel which has had its title changed.
+             * @param {String} The new title.
+             */
+            'titlechange',
+            /**
+             * @event iconchange
+             * Fires after the Panel icon class has been {@link #iconCls set} or {@link #setIconClass changed}.
+             * @param {Ext.Panel} p the Panel which has had its {@link #iconCls icon class} changed.
+             * @param {String} The new icon class.
+             * @param {String} The old icon class.
+             */
+            'iconchange',
+            /**
+             * @event collapse
+             * Fires after the Panel has been collapsed.
+             * @param {Ext.Panel} p the Panel that has been collapsed.
+             */
+            'collapse',
+            /**
+             * @event expand
+             * Fires after the Panel has been expanded.
+             * @param {Ext.Panel} p The Panel that has been expanded.
+             */
+            'expand',
+            /**
+             * @event beforecollapse
+             * Fires before the Panel is collapsed.  A handler can return false to cancel the collapse.
+             * @param {Ext.Panel} p the Panel being collapsed.
+             * @param {Boolean} animate True if the collapse is animated, else false.
+             */
+            'beforecollapse',
+            /**
+             * @event beforeexpand
+             * Fires before the Panel is expanded.  A handler can return false to cancel the expand.
+             * @param {Ext.Panel} p The Panel being expanded.
+             * @param {Boolean} animate True if the expand is animated, else false.
+             */
+            'beforeexpand',
+            /**
+             * @event beforeclose
+             * Fires before the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.  This event only
+             * applies to such subclasses.
+             * A handler can return false to cancel the close.
+             * @param {Ext.Panel} p The Panel being closed.
+             */
+            'beforeclose',
+            /**
+             * @event close
+             * Fires after the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.
+             * @param {Ext.Panel} p The Panel that has been closed.
+             */
+            'close',
+            /**
+             * @event activate
+             * Fires after the Panel has been visually activated.
+             * Note that Panels do not directly support being activated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been activated.
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires after the Panel has been visually deactivated.
+             * Note that Panels do not directly support being deactivated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been deactivated.
+             */
+            'deactivate'
+        );
+
+        if(this.unstyled){
+            this.baseCls = 'x-plain';
+        }
+
+
+        this.toolbars = [];
+        // shortcuts
+        if(this.tbar){
+            this.elements += ',tbar';
+            this.topToolbar = this.createToolbar(this.tbar);
+            this.tbar = null;
+
+        }
+        if(this.bbar){
+            this.elements += ',bbar';
+            this.bottomToolbar = this.createToolbar(this.bbar);
+            this.bbar = null;
+        }
+
+        if(this.header === true){
+            this.elements += ',header';
+            this.header = null;
+        }else if(this.headerCfg || (this.title && this.header !== false)){
+            this.elements += ',header';
+        }
+
+        if(this.footerCfg || this.footer === true){
+            this.elements += ',footer';
+            this.footer = null;
+        }
+
+        if(this.buttons){
+            this.fbar = this.buttons;
+            this.buttons = null;
+        }
+        if(this.fbar){
+            this.createFbar(this.fbar);
+        }
+        if(this.autoLoad){
+            this.on('render', this.doAutoLoad, this, {delay:10});
+        }
+    },
+
+    // private
+    createFbar : function(fbar){
+        var min = this.minButtonWidth;
+        this.elements += ',footer';
+        this.fbar = this.createToolbar(fbar, {
+            buttonAlign: this.buttonAlign,
+            toolbarCls: 'x-panel-fbar',
+            enableOverflow: false,
+            defaults: function(c){
+                return {
+                    minWidth: c.minWidth || min
+                };
+            }
+        });
+        // @compat addButton and buttons could possibly be removed
+        // @target 4.0
+        /**
+         * This Panel's Array of buttons as created from the <code>{@link #buttons}</code>
+         * config property. Read only.
+         * @type Array
+         * @property buttons
+         */
+        this.fbar.items.each(function(c){
+            c.minWidth = c.minWidth || this.minButtonWidth;
+        }, this);
+        this.buttons = this.fbar.items.items;
+    },
+
+    // private
+    createToolbar: function(tb, options){
+        var result;
+        // Convert array to proper toolbar config
+        if(Ext.isArray(tb)){
+            tb = {
+                items: tb
+            };
+        }
+        result = tb.events ? Ext.apply(tb, options) : this.createComponent(Ext.apply({}, tb, options), 'toolbar');
+        this.toolbars.push(result);
+        return result;
+    },
+
+    // private
+    createElement : function(name, pnode){
+        if(this[name]){
+            pnode.appendChild(this[name].dom);
+            return;
+        }
+
+        if(name === 'bwrap' || this.elements.indexOf(name) != -1){
+            if(this[name+'Cfg']){
+                this[name] = Ext.fly(pnode).createChild(this[name+'Cfg']);
+            }else{
+                var el = document.createElement('div');
+                el.className = this[name+'Cls'];
+                this[name] = Ext.get(pnode.appendChild(el));
+            }
+            if(this[name+'CssClass']){
+                this[name].addClass(this[name+'CssClass']);
+            }
+            if(this[name+'Style']){
+                this[name].applyStyles(this[name+'Style']);
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Panel.superclass.onRender.call(this, ct, position);
+        this.createClasses();
+
+        var el = this.el,
+            d = el.dom,
+            bw,
+            ts;
+
+
+        if(this.collapsible && !this.hideCollapseTool){
+            this.tools = this.tools ? this.tools.slice(0) : [];
+            this.tools[this.collapseFirst?'unshift':'push']({
+                id: 'toggle',
+                handler : this.toggleCollapse,
+                scope: this
+            });
+        }
+
+        if(this.tools){
+            ts = this.tools;
+            this.elements += (this.header !== false) ? ',header' : '';
+        }
+        this.tools = {};
+
+        el.addClass(this.baseCls);
+        if(d.firstChild){ // existing markup
+            this.header = el.down('.'+this.headerCls);
+            this.bwrap = el.down('.'+this.bwrapCls);
+            var cp = this.bwrap ? this.bwrap : el;
+            this.tbar = cp.down('.'+this.tbarCls);
+            this.body = cp.down('.'+this.bodyCls);
+            this.bbar = cp.down('.'+this.bbarCls);
+            this.footer = cp.down('.'+this.footerCls);
+            this.fromMarkup = true;
+        }
+        if (this.preventBodyReset === true) {
+            el.addClass('x-panel-reset');
+        }
+        if(this.cls){
+            el.addClass(this.cls);
+        }
+
+        if(this.buttons){
+            this.elements += ',footer';
+        }
+
+        // This block allows for maximum flexibility and performance when using existing markup
+
+        // framing requires special markup
+        if(this.frame){
+            el.insertHtml('afterBegin', String.format(Ext.Element.boxMarkup, this.baseCls));
+
+            this.createElement('header', d.firstChild.firstChild.firstChild);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            var ml = d.childNodes[1], bl = d.childNodes[2];
+            bw.appendChild(ml);
+            bw.appendChild(bl);
+
+            var mc = bw.firstChild.firstChild.firstChild;
+            this.createElement('tbar', mc);
+            this.createElement('body', mc);
+            this.createElement('bbar', mc);
+            this.createElement('footer', bw.lastChild.firstChild.firstChild);
+
+            if(!this.footer){
+                this.bwrap.dom.lastChild.className += ' x-panel-nofooter';
+            }
+            /*
+             * Store a reference to this element so:
+             * a) We aren't looking it up all the time
+             * b) The last element is reported incorrectly when using a loadmask
+             */
+            this.ft = Ext.get(this.bwrap.dom.lastChild);
+            this.mc = Ext.get(mc);
+        }else{
+            this.createElement('header', d);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            this.createElement('tbar', bw);
+            this.createElement('body', bw);
+            this.createElement('bbar', bw);
+            this.createElement('footer', bw);
+
+            if(!this.header){
+                this.body.addClass(this.bodyCls + '-noheader');
+                if(this.tbar){
+                    this.tbar.addClass(this.tbarCls + '-noheader');
+                }
+            }
+        }
+
+        if(Ext.isDefined(this.padding)){
+            this.body.setStyle('padding', this.body.addUnits(this.padding));
+        }
+
+        if(this.border === false){
+            this.el.addClass(this.baseCls + '-noborder');
+            this.body.addClass(this.bodyCls + '-noborder');
+            if(this.header){
+                this.header.addClass(this.headerCls + '-noborder');
+            }
+            if(this.footer){
+                this.footer.addClass(this.footerCls + '-noborder');
+            }
+            if(this.tbar){
+                this.tbar.addClass(this.tbarCls + '-noborder');
+            }
+            if(this.bbar){
+                this.bbar.addClass(this.bbarCls + '-noborder');
+            }
+        }
+
+        if(this.bodyBorder === false){
+           this.body.addClass(this.bodyCls + '-noborder');
+        }
+
+        this.bwrap.enableDisplayMode('block');
+
+        if(this.header){
+            this.header.unselectable();
+
+            // for tools, we need to wrap any existing header markup
+            if(this.headerAsText){
+                this.header.dom.innerHTML =
+                    '<span class="' + this.headerTextCls + '">'+this.header.dom.innerHTML+'</span>';
+
+                if(this.iconCls){
+                    this.setIconClass(this.iconCls);
+                }
+            }
+        }
+
+        if(this.floating){
+            this.makeFloating(this.floating);
+        }
+
+        if(this.collapsible && this.titleCollapse && this.header){
+            this.mon(this.header, 'click', this.toggleCollapse, this);
+            this.header.setStyle('cursor', 'pointer');
+        }
+        if(ts){
+            this.addTool.apply(this, ts);
+        }
+
+        // Render Toolbars.
+        if(this.fbar){
+            this.footer.addClass('x-panel-btns');
+            this.fbar.ownerCt = this;
+            this.fbar.render(this.footer);
+            this.footer.createChild({cls:'x-clear'});
+        }
+        if(this.tbar && this.topToolbar){
+            this.topToolbar.ownerCt = this;
+            this.topToolbar.render(this.tbar);
+        }
+        if(this.bbar && this.bottomToolbar){
+            this.bottomToolbar.ownerCt = this;
+            this.bottomToolbar.render(this.bbar);
+        }
+    },
+
+    /**
+     * Sets the CSS class that provides the icon image for this panel.  This method will replace any existing
+     * icon class if one has already been set and fire the {@link #iconchange} event after completion.
+     * @param {String} cls The new CSS class name
+     */
+    setIconClass : function(cls){
+        var old = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered && this.header){
+            if(this.frame){
+                this.header.addClass('x-panel-icon');
+                this.header.replaceClass(old, this.iconCls);
+            }else{
+                var hd = this.header,
+                    img = hd.child('img.x-panel-inline-icon');
+                if(img){
+                    Ext.fly(img).replaceClass(old, this.iconCls);
+                }else{
+                    var hdspan = hd.child('span.' + this.headerTextCls);
+                    if (hdspan) {
+                        Ext.DomHelper.insertBefore(hdspan.dom, {
+                            tag:'img', alt: '', src: Ext.BLANK_IMAGE_URL, cls:'x-panel-inline-icon '+this.iconCls
+                        });
+                    }
+                 }
+            }
+        }
+        this.fireEvent('iconchange', this, cls, old);
+    },
+
+    // private
+    makeFloating : function(cfg){
+        this.floating = true;
+        this.el = new Ext.Layer(Ext.apply({}, cfg, {
+            shadow: Ext.isDefined(this.shadow) ? this.shadow : 'sides',
+            shadowOffset: this.shadowOffset,
+            constrain:false,
+            shim: this.shim === false ? false : undefined
+        }), this.el);
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the top (<code>{@link #tbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getTopToolbar : function(){
+        return this.topToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the bottom (<code>{@link #bbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getBottomToolbar : function(){
+        return this.bottomToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the footer (<code>{@link #fbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getFooterToolbar : function() {
+        return this.fbar;
+    },
+
+    /**
+     * Adds a button to this panel.  Note that this method must be called prior to rendering.  The preferred
+     * approach is to add buttons via the {@link #buttons} config.
+     * @param {String/Object} config A valid {@link Ext.Button} config.  A string will become the text for a default
+     * button config, an object will be treated as a button config object.
+     * @param {Function} handler The function to be called on button {@link Ext.Button#click}
+     * @param {Object} scope The scope (<code>this</code> reference) in which the button handler function is executed. Defaults to the Button.
+     * @return {Ext.Button} The button that was added
+     */
+    addButton : function(config, handler, scope){
+        if(!this.fbar){
+            this.createFbar([]);
+        }
+        if(handler){
+            if(Ext.isString(config)){
+                config = {text: config};
+            }
+            config = Ext.apply({
+                handler: handler,
+                scope: scope
+            }, config);
+        }
+        return this.fbar.add(config);
+    },
+
+    // private
+    addTool : function(){
+        if(!this.rendered){
+            if(!this.tools){
+                this.tools = [];
+            }
+            Ext.each(arguments, function(arg){
+                this.tools.push(arg);
+            }, this);
+            return;
+        }
+         // nowhere to render tools!
+        if(!this[this.toolTarget]){
+            return;
+        }
+        if(!this.toolTemplate){
+            // initialize the global tool template on first use
+            var tt = new Ext.Template(
+                 '<div class="x-tool x-tool-{id}">&#160;</div>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.Panel.prototype.toolTemplate = tt;
+        }
+        for(var i = 0, a = arguments, len = a.length; i < len; i++) {
+            var tc = a[i];
+            if(!this.tools[tc.id]){
+                var overCls = 'x-tool-'+tc.id+'-over';
+                var t = this.toolTemplate.insertFirst(this[this.toolTarget], tc, true);
+                this.tools[tc.id] = t;
+                t.enableDisplayMode('block');
+                this.mon(t, 'click',  this.createToolHandler(t, tc, overCls, this));
+                if(tc.on){
+                    this.mon(t, tc.on);
+                }
+                if(tc.hidden){
+                    t.hide();
+                }
+                if(tc.qtip){
+                    if(Ext.isObject(tc.qtip)){
+                        Ext.QuickTips.register(Ext.apply({
+                              target: t.id
+                        }, tc.qtip));
+                    } else {
+                        t.dom.qtip = tc.qtip;
+                    }
+                }
+                t.addClassOnOver(overCls);
+            }
+        }
+    },
+
+    onLayout : function(shallow, force){
+        Ext.Panel.superclass.onLayout.apply(this, arguments);
+        if(this.hasLayout && this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout(undefined, force);
+            });
+            this.syncHeight();
+        }
+    },
+
+    syncHeight : function(){
+        var h = this.toolbarHeight,
+                bd = this.body,
+                lsh = this.lastSize.height,
+                sz;
+
+        if(this.autoHeight || !Ext.isDefined(lsh) || lsh == 'auto'){
+            return;
+        }
+
+
+        if(h != this.getToolbarHeight()){
+            h = Math.max(0, lsh - this.getFrameHeight());
+            bd.setHeight(h);
+            sz = bd.getSize();
+            this.toolbarHeight = this.getToolbarHeight();
+            this.onBodyResize(sz.width, sz.height);
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.floating){
+            return this.el.show();
+        }
+        Ext.Panel.superclass.onShow.call(this);
+    },
+
+    // private
+    onHide : function(){
+        if(this.floating){
+            return this.el.hide();
+        }
+        Ext.Panel.superclass.onHide.call(this);
+    },
+
+    // private
+    createToolHandler : function(t, tc, overCls, panel){
+        return function(e){
+            t.removeClass(overCls);
+            if(tc.stopEvent !== false){
+                e.stopEvent();
+            }
+            if(tc.handler){
+                tc.handler.call(tc.scope || t, e, t, panel, tc);
+            }
+        };
+    },
+
+    // private
+    afterRender : function(){
+        if(this.floating && !this.hidden){
+            this.el.show();
+        }
+        if(this.title){
+            this.setTitle(this.title);
+        }
+        Ext.Panel.superclass.afterRender.call(this); // do sizing calcs last
+        if (this.collapsed) {
+            this.collapsed = false;
+            this.collapse(false);
+        }
+        this.initEvents();
+    },
+
+    // private
+    getKeyMap : function(){
+        if(!this.keyMap){
+            this.keyMap = new Ext.KeyMap(this.el, this.keys);
+        }
+        return this.keyMap;
+    },
+
+    // private
+    initEvents : function(){
+        if(this.keys){
+            this.getKeyMap();
+        }
+        if(this.draggable){
+            this.initDraggable();
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout();
+                tb.on({
+                    scope: this,
+                    afterlayout: this.syncHeight,
+                    remove: this.syncHeight
+                });
+            }, this);
+            this.syncHeight();
+        }
+
+    },
+
+    // private
+    initDraggable : function(){
+        /**
+         * <p>If this Panel is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DragSource} which handles dragging the Panel.</p>
+         * The developer must provide implementations of the abstract methods of {@link Ext.dd.DragSource}
+         * in order to supply behaviour for each stage of the drag/drop process. See {@link #draggable}.
+         * @type Ext.dd.DragSource.
+         * @property dd
+         */
+        this.dd = new Ext.Panel.DD(this, Ext.isBoolean(this.draggable) ? null : this.draggable);
+    },
+
+    // private
+    beforeEffect : function(anim){
+        if(this.floating){
+            this.el.beforeAction();
+        }
+        if(anim !== false){
+            this.el.addClass('x-panel-animated');
+        }
+    },
+
+    // private
+    afterEffect : function(anim){
+        this.syncShadow();
+        this.el.removeClass('x-panel-animated');
+    },
+
+    // private - wraps up an animation param with internal callbacks
+    createEffect : function(a, cb, scope){
+        var o = {
+            scope:scope,
+            block:true
+        };
+        if(a === true){
+            o.callback = cb;
+            return o;
+        }else if(!a.callback){
+            o.callback = cb;
+        }else { // wrap it up
+            o.callback = function(){
+                cb.call(scope);
+                Ext.callback(a.callback, a.scope);
+            };
+        }
+        return Ext.applyIf(o, a);
+    },
+
+    /**
+     * Collapses the panel body so that it becomes hidden.  Fires the {@link #beforecollapse} event which will
+     * cancel the collapse action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    collapse : function(animate){
+        if(this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforecollapse', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.beforeEffect(doAnim);
+        this.onCollapse(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideOut(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterCollapse, this),
+                        this.collapseDefaults));
+        }else{
+            this[this.collapseEl].hide(this.hideMode);
+            this.afterCollapse(false);
+        }
+    },
+
+    // private
+    afterCollapse : function(anim){
+        this.collapsed = true;
+        this.el.addClass(this.collapsedCls);
+        if(anim !== false){
+            this[this.collapseEl].hide(this.hideMode);
+        }
+        this.afterEffect(anim);
+
+        // Reset lastSize of all sub-components so they KNOW they are in a collapsed container
+        this.cascade(function(c) {
+            if (c.lastSize) {
+                c.lastSize = { width: undefined, height: undefined };
+            }
+        });
+        this.fireEvent('collapse', this);
+    },
+
+    /**
+     * Expands the panel body so that it becomes visible.  Fires the {@link #beforeexpand} event which will
+     * cancel the expand action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    expand : function(animate){
+        if(!this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforeexpand', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.el.removeClass(this.collapsedCls);
+        this.beforeEffect(doAnim);
+        this.onExpand(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideIn(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterExpand, this),
+                        this.expandDefaults));
+        }else{
+            this[this.collapseEl].show(this.hideMode);
+            this.afterExpand(false);
+        }
+    },
+
+    // private
+    afterExpand : function(anim){
+        this.collapsed = false;
+        if(anim !== false){
+            this[this.collapseEl].show(this.hideMode);
+        }
+        this.afterEffect(anim);
+        if (this.deferLayout) {
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * Shortcut for performing an {@link #expand} or {@link #collapse} based on the current state of the panel.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    toggleCollapse : function(animate){
+        this[this.collapsed ? 'expand' : 'collapse'](animate);
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.mask();
+        }
+        Ext.Panel.superclass.onDisable.call(this);
+    },
+
+    // private
+    onEnable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.unmask();
+        }
+        Ext.Panel.superclass.onEnable.call(this);
+    },
+
+    // private
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+        var w = adjWidth,
+            h = adjHeight;
+
+        if(Ext.isDefined(w) || Ext.isDefined(h)){
+            if(!this.collapsed){
+                // First, set the the Panel's body width.
+                // If we have auto-widthed it, get the resulting full offset width so we can size the Toolbars to match
+                // The Toolbars must not buffer this resize operation because we need to know their heights.
+
+                if(Ext.isNumber(w)){
+                    this.body.setWidth(w = this.adjustBodyWidth(w - this.getFrameWidth()));
+                } else if (w == 'auto') {
+                    w = this.body.setWidth('auto').dom.offsetWidth;
+                } else {
+                    w = this.body.dom.offsetWidth;
+                }
+
+                if(this.tbar){
+                    this.tbar.setWidth(w);
+                    if(this.topToolbar){
+                        this.topToolbar.setSize(w);
+                    }
+                }
+                if(this.bbar){
+                    this.bbar.setWidth(w);
+                    if(this.bottomToolbar){
+                        this.bottomToolbar.setSize(w);
+                        // The bbar does not move on resize without this.
+                        if (Ext.isIE) {
+                            this.bbar.setStyle('position', 'static');
+                            this.bbar.setStyle('position', '');
+                        }
+                    }
+                }
+                if(this.footer){
+                    this.footer.setWidth(w);
+                    if(this.fbar){
+                        this.fbar.setSize(Ext.isIE ? (w - this.footer.getFrameWidth('lr')) : 'auto');
+                    }
+                }
+
+                // At this point, the Toolbars must be layed out for getFrameHeight to find a result.
+                if(Ext.isNumber(h)){
+                    h = Math.max(0, h - this.getFrameHeight());
+                    //h = Math.max(0, h - (this.getHeight() - this.body.getHeight()));
+                    this.body.setHeight(h);
+                }else if(h == 'auto'){
+                    this.body.setHeight(h);
+                }
+
+                if(this.disabled && this.el._mask){
+                    this.el._mask.setSize(this.el.dom.clientWidth, this.el.getHeight());
+                }
+            }else{
+                // Adds an event to set the correct height afterExpand.  This accounts for the deferHeight flag in panel
+                this.queuedBodySize = {width: w, height: h};
+                if(!this.queuedExpand && this.allowQueuedExpand !== false){
+                    this.queuedExpand = true;
+                    this.on('expand', function(){
+                        delete this.queuedExpand;
+                        this.onResize(this.queuedBodySize.width, this.queuedBodySize.height);
+                    }, this, {single:true});
+                }
+            }
+            this.onBodyResize(w, h);
+        }
+        this.syncShadow();
+        Ext.Panel.superclass.onResize.call(this, adjWidth, adjHeight, rawWidth, rawHeight);
+
+    },
+
+    // private
+    onBodyResize: function(w, h){
+        this.fireEvent('bodyresize', this, w, h);
+    },
+
+    // private
+    getToolbarHeight: function(){
+        var h = 0;
+        if(this.rendered){
+            Ext.each(this.toolbars, function(tb){
+                h += tb.getHeight();
+            }, this);
+        }
+        return h;
+    },
+
+    // deprecate
+    adjustBodyHeight : function(h){
+        return h;
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        return w;
+    },
+
+    // private
+    onPosition : function(){
+        this.syncShadow();
+    },
+
+    /**
+     * Returns the width in pixels of the framing elements of this panel (not including the body width).  To
+     * retrieve the body width see {@link #getInnerWidth}.
+     * @return {Number} The frame width
+     */
+    getFrameWidth : function(){
+        var w = this.el.getFrameWidth('lr') + this.bwrap.getFrameWidth('lr');
+
+        if(this.frame){
+            var l = this.bwrap.dom.firstChild;
+            w += (Ext.fly(l).getFrameWidth('l') + Ext.fly(l.firstChild).getFrameWidth('r'));
+            w += this.mc.getFrameWidth('lr');
+        }
+        return w;
+    },
+
+    /**
+     * Returns the height in pixels of the framing elements of this panel (including any top and bottom bars and
+     * header and footer elements, but not including the body height).  To retrieve the body height see {@link #getInnerHeight}.
+     * @return {Number} The frame height
+     */
+    getFrameHeight : function() {
+        var h  = this.el.getFrameWidth('tb') + this.bwrap.getFrameWidth('tb');
+        h += (this.tbar ? this.tbar.getHeight() : 0) +
+             (this.bbar ? this.bbar.getHeight() : 0);
+
+        if(this.frame){
+            h += this.el.dom.firstChild.offsetHeight + this.ft.dom.offsetHeight + this.mc.getFrameWidth('tb');
+        }else{
+            h += (this.header ? this.header.getHeight() : 0) +
+                (this.footer ? this.footer.getHeight() : 0);
+        }
+        return h;
+    },
+
+    /**
+     * Returns the width in pixels of the body element (not including the width of any framing elements).
+     * For the frame width see {@link #getFrameWidth}.
+     * @return {Number} The body width
+     */
+    getInnerWidth : function(){
+        return this.getSize().width - this.getFrameWidth();
+    },
+
+    /**
+     * Returns the height in pixels of the body element (not including the height of any framing elements).
+     * For the frame height see {@link #getFrameHeight}.
+     * @return {Number} The body height
+     */
+    getInnerHeight : function(){
+        return this.body.getHeight();
+        /* Deprecate
+            return this.getSize().height - this.getFrameHeight();
+        */
+    },
+
+    // private
+    syncShadow : function(){
+        if(this.floating){
+            this.el.sync(true);
+        }
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.body;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.body;
+    },
+
+    /**
+     * <p>Sets the title text for the panel and optionally the {@link #iconCls icon class}.</p>
+     * <p>In order to be able to set the title, a header element must have been created
+     * for the Panel. This is triggered either by configuring the Panel with a non-blank <code>{@link #title}</code>,
+     * or configuring it with <code><b>{@link #header}: true</b></code>.</p>
+     * @param {String} title The title text to set
+     * @param {String} iconCls (optional) {@link #iconCls iconCls} A user-defined CSS class that provides the icon image for this panel
+     */
+    setTitle : function(title, iconCls){
+        this.title = title;
+        if(this.header && this.headerAsText){
+            this.header.child('span').update(title);
+        }
+        if(iconCls){
+            this.setIconClass(iconCls);
+        }
+        this.fireEvent('titlechange', this, title);
+        return this;
+    },
+
+    /**
+     * Get the {@link Ext.Updater} for this panel. Enables you to perform Ajax updates of this panel's body.
+     * @return {Ext.Updater} The Updater
+     */
+    getUpdater : function(){
+        return this.body.getUpdater();
+    },
+
+     /**
+     * Loads this content panel immediately with content returned from an XHR call.
+     * @param {Object/String/Function} config A config object containing any of the following options:
+<pre><code>
+panel.load({
+    url: 'your-url.php',
+    params: {param1: 'foo', param2: 'bar'}, // or a URL encoded string
+    callback: yourFunction,
+    scope: yourObject, // optional scope for the callback
+    discardUrl: false,
+    nocache: false,
+    text: 'Loading...',
+    timeout: 30,
+    scripts: false
+});
+</code></pre>
+     * The only required property is url. The optional properties nocache, text and scripts
+     * are shorthand for disableCaching, indicatorText and loadScripts and are used to set their
+     * associated property on this panel Updater instance.
+     * @return {Ext.Panel} this
+     */
+    load : function(){
+        var um = this.body.getUpdater();
+        um.update.apply(um, arguments);
+        return this;
+    },
+
+    // private
+    beforeDestroy : function(){
+        Ext.Panel.superclass.beforeDestroy.call(this);
+        if(this.header){
+            this.header.removeAllListeners();
+        }
+        if(this.tools){
+            for(var k in this.tools){
+                Ext.destroy(this.tools[k]);
+            }
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.un('afterlayout', this.syncHeight, this);
+                tb.un('remove', this.syncHeight, this);
+            }, this);
+        }
+        if(Ext.isArray(this.buttons)){
+            while(this.buttons.length) {
+                Ext.destroy(this.buttons[0]);
+            }
+        }
+        if(this.rendered){
+            Ext.destroy(
+                this.ft,
+                this.header,
+                this.footer,
+                this.tbar,
+                this.bbar,
+                this.body,
+                this.mc,
+                this.bwrap,
+                this.dd
+            );
+            if (this.fbar) {
+                Ext.destroy(
+                    this.fbar,
+                    this.fbar.el
+                );
+            }
+        }
+        Ext.destroy(this.toolbars);
+    },
+
+    // private
+    createClasses : function(){
+        this.headerCls = this.baseCls + '-header';
+        this.headerTextCls = this.baseCls + '-header-text';
+        this.bwrapCls = this.baseCls + '-bwrap';
+        this.tbarCls = this.baseCls + '-tbar';
+        this.bodyCls = this.baseCls + '-body';
+        this.bbarCls = this.baseCls + '-bbar';
+        this.footerCls = this.baseCls + '-footer';
+    },
+
+    // private
+    createGhost : function(cls, useShim, appendTo){
+        var el = document.createElement('div');
+        el.className = 'x-panel-ghost ' + (cls ? cls : '');
+        if(this.header){
+            el.appendChild(this.el.dom.firstChild.cloneNode(true));
+        }
+        Ext.fly(el.appendChild(document.createElement('ul'))).setHeight(this.bwrap.getHeight());
+        el.style.width = this.el.dom.offsetWidth + 'px';;
+        if(!appendTo){
+            this.container.dom.appendChild(el);
+        }else{
+            Ext.getDom(appendTo).appendChild(el);
+        }
+        if(useShim !== false && this.el.useShim !== false){
+            var layer = new Ext.Layer({shadow:false, useDisplay:true, constrain:false}, el);
+            layer.show();
+            return layer;
+        }else{
+            return new Ext.Element(el);
+        }
+    },
+
+    // private
+    doAutoLoad : function(){
+        var u = this.body.getUpdater();
+        if(this.renderer){
+            u.setRenderer(this.renderer);
+        }
+        u.update(Ext.isObject(this.autoLoad) ? this.autoLoad : {url: this.autoLoad});
+    },
+
+    /**
+     * Retrieve a tool by id.
+     * @param {String} id
+     * @return {Object} tool
+     */
+    getTool : function(id) {
+        return this.tools[id];
+    }
+
+/**
+ * @cfg {String} autoEl @hide
+ */
+});
+Ext.reg('panel', Ext.Panel);
+/**
+ * @class Ext.Editor
+ * @extends Ext.Component
+ * A base editor field that handles displaying/hiding on demand and has some built-in sizing and event handling logic.
+ * @constructor
+ * Create a new Editor
+ * @param {Object} config The config object
+ * @xtype editor
+ */
+Ext.Editor = function(field, config){
+    if(field.field){
+        this.field = Ext.create(field.field, 'textfield');
+        config = Ext.apply({}, field); // copy so we don't disturb original config
+        delete config.field;
+    }else{
+        this.field = field;
+    }
+    Ext.Editor.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.Editor, Ext.Component, {
+    /**
+    * @cfg {Ext.form.Field} field
+    * The Field object (or descendant) or config object for field
+    */
+    /**
+     * @cfg {Boolean} allowBlur
+     * True to {@link #completeEdit complete the editing process} if in edit mode when the
+     * field is blurred. Defaults to <tt>true</tt>.
+     */
+    allowBlur: true,
+    /**
+     * @cfg {Boolean/String} autoSize
+     * True for the editor to automatically adopt the size of the underlying field, "width" to adopt the width only,
+     * or "height" to adopt the height only, "none" to always use the field dimensions. (defaults to false)
+     */
+    /**
+     * @cfg {Boolean} revertInvalid
+     * True to automatically revert the field value and cancel the edit when the user completes an edit and the field
+     * validation fails (defaults to true)
+     */
+    /**
+     * @cfg {Boolean} ignoreNoChange
+     * True to skip the edit completion process (no save, no events fired) if the user completes an edit and
+     * the value has not changed (defaults to false).  Applies only to string values - edits for other data types
+     * will never be ignored.
+     */
+    /**
+     * @cfg {Boolean} hideEl
+     * False to keep the bound element visible while the editor is displayed (defaults to true)
+     */
+    /**
+     * @cfg {Mixed} value
+     * The data value of the underlying field (defaults to "")
+     */
+    value : "",
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "c-c?").
+     */
+    alignment: "c-c?",
+    /**
+     * @cfg {Array} offsets
+     * The offsets to use when aligning (see {@link Ext.Element#alignTo} for more details. Defaults to <tt>[0, 0]</tt>.
+     */
+    offsets: [0, 0],
+    /**
+     * @cfg {Boolean/String} shadow "sides" for sides/bottom only, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "frame")
+     */
+    shadow : "frame",
+    /**
+     * @cfg {Boolean} constrain True to constrain the editor to the viewport
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} swallowKeys Handle the keydown/keypress events so they don't propagate (defaults to true)
+     */
+    swallowKeys : true,
+    /**
+     * @cfg {Boolean} completeOnEnter True to complete the edit when the enter key is pressed. Defaults to <tt>true</tt>.
+     */
+    completeOnEnter : true,
+    /**
+     * @cfg {Boolean} cancelOnEsc True to cancel the edit when the escape key is pressed. Defaults to <tt>true</tt>.
+     */
+    cancelOnEsc : true,
+    /**
+     * @cfg {Boolean} updateEl True to update the innerHTML of the bound element when the update completes (defaults to false)
+     */
+    updateEl : false,
+
+    initComponent : function(){
+        Ext.Editor.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforestartedit
+             * Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning
+             * false from the handler of this event.
+             * @param {Editor} this
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The field value being set
+             */
+            "beforestartedit",
+            /**
+             * @event startedit
+             * Fires when this editor is displayed
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The starting field value
+             */
+            "startedit",
+            /**
+             * @event beforecomplete
+             * Fires after a change has been made to the field, but before the change is reflected in the underlying
+             * field.  Saving the change to the field can be canceled by returning false from the handler of this event.
+             * Note that if the value has not changed and ignoreNoChange = true, the editing will still end but this
+             * event will not fire since no edit actually occurred.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "beforecomplete",
+            /**
+             * @event complete
+             * Fires after editing is complete and any changed value has been written to the underlying field.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "complete",
+            /**
+             * @event canceledit
+             * Fires after editing has been canceled and the editor's value has been reset.
+             * @param {Editor} this
+             * @param {Mixed} value The user-entered field value that was discarded
+             * @param {Mixed} startValue The original field value that was set back into the editor after cancel
+             */
+            "canceledit",
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check
+             * {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            "specialkey"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.el = new Ext.Layer({
+            shadow: this.shadow,
+            cls: "x-editor",
+            parentEl : ct,
+            shim : this.shim,
+            shadowOffset: this.shadowOffset || 4,
+            id: this.id,
+            constrain: this.constrain
+        });
+        if(this.zIndex){
+            this.el.setZIndex(this.zIndex);
+        }
+        this.el.setStyle("overflow", Ext.isGecko ? "auto" : "hidden");
+        if(this.field.msgTarget != 'title'){
+            this.field.msgTarget = 'qtip';
+        }
+        this.field.inEditor = true;
+        this.mon(this.field, {
+            scope: this,
+            blur: this.onBlur,
+            specialkey: this.onSpecialKey
+        });
+        if(this.field.grow){
+            this.mon(this.field, "autosize", this.el.sync,  this.el, {delay:1});
+        }
+        this.field.render(this.el).show();
+        this.field.getEl().dom.name = '';
+        if(this.swallowKeys){
+            this.field.el.swallowEvent([
+                'keypress', // *** Opera
+                'keydown'   // *** all other browsers
+            ]);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var key = e.getKey(),
+            complete = this.completeOnEnter && key == e.ENTER,
+            cancel = this.cancelOnEsc && key == e.ESC;
+        if(complete || cancel){
+            e.stopEvent();
+            if(complete){
+                this.completeEdit();
+            }else{
+                this.cancelEdit();
+            }
+            if(field.triggerBlur){
+                field.triggerBlur();
+            }
+        }
+        this.fireEvent('specialkey', field, e);
+    },
+
+    /**
+     * Starts the editing process and shows the editor.
+     * @param {Mixed} el The element to edit
+     * @param {String} value (optional) A value to initialize the editor with. If a value is not provided, it defaults
+      * to the innerHTML of el.
+     */
+    startEdit : function(el, value){
+        if(this.editing){
+            this.completeEdit();
+        }
+        this.boundEl = Ext.get(el);
+        var v = value !== undefined ? value : this.boundEl.dom.innerHTML;
+        if(!this.rendered){
+            this.render(this.parentEl || document.body);
+        }
+        if(this.fireEvent("beforestartedit", this, this.boundEl, v) !== false){
+            this.startValue = v;
+            this.field.reset();
+            this.field.setValue(v);
+            this.realign(true);
+            this.editing = true;
+            this.show();
+        }
+    },
+
+    // private
+    doAutoSize : function(){
+        if(this.autoSize){
+            var sz = this.boundEl.getSize(),
+                fs = this.field.getSize();
+
+            switch(this.autoSize){
+                case "width":
+                    this.setSize(sz.width, fs.height);
+                    break;
+                case "height":
+                    this.setSize(fs.width, sz.height);
+                    break;
+                case "none":
+                    this.setSize(fs.width, fs.height);
+                    break;
+                default:
+                    this.setSize(sz.width, sz.height);
+            }
+        }
+    },
+
+    /**
+     * Sets the height and width of this editor.
+     * @param {Number} width The new width
+     * @param {Number} height The new height
+     */
+    setSize : function(w, h){
+        delete this.field.lastSize;
+        this.field.setSize(w, h);
+        if(this.el){
+            // IE7 in strict mode doesn't size properly.
+            if(Ext.isGecko2 || Ext.isOpera || (Ext.isIE7 && Ext.isStrict)){
+                // prevent layer scrollbars
+                this.el.setSize(w, h);
+            }
+            this.el.sync();
+        }
+    },
+
+    /**
+     * Realigns the editor to the bound field based on the current alignment config value.
+     * @param {Boolean} autoSize (optional) True to size the field to the dimensions of the bound element.
+     */
+    realign : function(autoSize){
+        if(autoSize === true){
+            this.doAutoSize();
+        }
+        this.el.alignTo(this.boundEl, this.alignment, this.offsets);
+    },
+
+    /**
+     * Ends the editing process, persists the changed value to the underlying field, and hides the editor.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after edit (defaults to false)
+     */
+    completeEdit : function(remainVisible){
+        if(!this.editing){
+            return;
+        }
+        // Assert combo values first
+        if (this.field.assertValue) {
+            this.field.assertValue();
+        }
+        var v = this.getValue();
+        if(!this.field.isValid()){
+            if(this.revertInvalid !== false){
+                this.cancelEdit(remainVisible);
+            }
+            return;
+        }
+        if(String(v) === String(this.startValue) && this.ignoreNoChange){
+            this.hideEdit(remainVisible);
+            return;
+        }
+        if(this.fireEvent("beforecomplete", this, v, this.startValue) !== false){
+            v = this.getValue();
+            if(this.updateEl && this.boundEl){
+                this.boundEl.update(v);
+            }
+            this.hideEdit(remainVisible);
+            this.fireEvent("complete", this, v, this.startValue);
+        }
+    },
+
+    // private
+    onShow : function(){
+        this.el.show();
+        if(this.hideEl !== false){
+            this.boundEl.hide();
+        }
+        this.field.show().focus(false, true);
+        this.fireEvent("startedit", this.boundEl, this.startValue);
+    },
+
+    /**
+     * Cancels the editing process and hides the editor without persisting any changes.  The field value will be
+     * reverted to the original starting value.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after
+     * cancel (defaults to false)
+     */
+    cancelEdit : function(remainVisible){
+        if(this.editing){
+            var v = this.getValue();
+            this.setValue(this.startValue);
+            this.hideEdit(remainVisible);
+            this.fireEvent("canceledit", this, v, this.startValue);
+        }
+    },
+
+    // private
+    hideEdit: function(remainVisible){
+        if(remainVisible !== true){
+            this.editing = false;
+            this.hide();
+        }
+    },
+
+    // private
+    onBlur : function(){
+        // selectSameEditor flag allows the same editor to be started without onBlur firing on itself
+        if(this.allowBlur === true && this.editing && this.selectSameEditor !== true){
+            this.completeEdit();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.editing){
+            this.completeEdit();
+            return;
+        }
+        this.field.blur();
+        if(this.field.collapse){
+            this.field.collapse();
+        }
+        this.el.hide();
+        if(this.hideEl !== false){
+            this.boundEl.show();
+        }
+    },
+
+    /**
+     * Sets the data value of the editor
+     * @param {Mixed} value Any valid value supported by the underlying field
+     */
+    setValue : function(v){
+        this.field.setValue(v);
+    },
+
+    /**
+     * Gets the data value of the editor
+     * @return {Mixed} The data value
+     */
+    getValue : function(){
+        return this.field.getValue();
+    },
+
+    beforeDestroy : function(){
+        Ext.destroyMembers(this, 'field');
+
+        delete this.parentEl;
+        delete this.boundEl;
+    }
+});
+Ext.reg('editor', Ext.Editor);
+/**
+ * @class Ext.ColorPalette
+ * @extends Ext.Component
+ * Simple color palette class for choosing colors.  The palette can be rendered to any container.<br />
+ * Here's an example of typical usage:
+ * <pre><code>
+var cp = new Ext.ColorPalette({value:'993300'});  // initial selected color
+cp.render('my-div');
+
+cp.on('select', function(palette, selColor){
+    // do something with selColor
+});
+</code></pre>
+ * @constructor
+ * Create a new ColorPalette
+ * @param {Object} config The config object
+ * @xtype colorpalette
+ */
+Ext.ColorPalette = Ext.extend(Ext.Component, {
+	/**
+	 * @cfg {String} tpl An existing XTemplate instance to be used in place of the default template for rendering the component.
+	 */
+    /**
+     * @cfg {String} itemCls
+     * The CSS class to apply to the containing element (defaults to 'x-color-palette')
+     */
+    itemCls : 'x-color-palette',
+    /**
+     * @cfg {String} value
+     * The initial color to highlight (should be a valid 6-digit color hex code without the # symbol).  Note that
+     * the hex codes are case-sensitive.
+     */
+    value : null,
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will cause a color to be selected. This can be any valid event name (dblclick, contextmenu). 
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent :'click',
+    // private
+    ctype : 'Ext.ColorPalette',
+
+    /**
+     * @cfg {Boolean} allowReselect If set to true then reselecting a color that is already selected fires the {@link #select} event
+     */
+    allowReselect : false,
+
+    /**
+     * <p>An array of 6-digit color hex code strings (without the # symbol).  This array can contain any number
+     * of colors, and each hex code should be unique.  The width of the palette is controlled via CSS by adjusting
+     * the width property of the 'x-color-palette' class (or assigning a custom class), so you can balance the number
+     * of colors with the width setting until the box is symmetrical.</p>
+     * <p>You can override individual colors if needed:</p>
+     * <pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors[0] = 'FF0000';  // change the first box to red
+</code></pre>
+
+Or you can provide a custom array of your own for complete control:
+<pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors = ['000000', '993300', '333300'];
+</code></pre>
+     * @type Array
+     */
+    colors : [
+        '000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333',
+        '800000', 'FF6600', '808000', '008000', '008080', '0000FF', '666699', '808080',
+        'FF0000', 'FF9900', '99CC00', '339966', '33CCCC', '3366FF', '800080', '969696',
+        'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0',
+        'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', '99CCFF', 'CC99FF', 'FFFFFF'
+    ],
+
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this palette.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorPalette instance.
+     */
+    
+    // private
+    initComponent : function(){
+        Ext.ColorPalette.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a color is selected
+             * @param {ColorPalette} this
+             * @param {String} color The 6-digit color hex code (without the # symbol)
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler, this.scope, true);
+        }    
+    },
+
+    // private
+    onRender : function(container, position){
+        this.autoEl = {
+            tag: 'div',
+            cls: this.itemCls
+        };
+        Ext.ColorPalette.superclass.onRender.call(this, container, position);
+        var t = this.tpl || new Ext.XTemplate(
+            '<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>'
+        );
+        t.overwrite(this.el, this.colors);
+        this.mon(this.el, this.clickEvent, this.handleClick, this, {delegate: 'a'});
+        if(this.clickEvent != 'click'){
+        	this.mon(this.el, 'click', Ext.emptyFn, this, {delegate: 'a', preventDefault: true});
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ColorPalette.superclass.afterRender.call(this);
+        if(this.value){
+            var s = this.value;
+            this.value = null;
+            this.select(s, true);
+        }
+    },
+
+    // private
+    handleClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            var c = t.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];
+            this.select(c.toUpperCase());
+        }
+    },
+
+    /**
+     * Selects the specified color in the palette (fires the {@link #select} event)
+     * @param {String} color A valid 6-digit color hex code (# will be stripped if included)
+     * @param {Boolean} suppressEvent (optional) True to stop the select event from firing. Defaults to <tt>false</tt>.
+     */
+    select : function(color, suppressEvent){
+        color = color.replace('#', '');
+        if(color != this.value || this.allowReselect){
+            var el = this.el;
+            if(this.value){
+                el.child('a.color-'+this.value).removeClass('x-color-palette-sel');
+            }
+            el.child('a.color-'+color).addClass('x-color-palette-sel');
+            this.value = color;
+            if(suppressEvent !== true){
+                this.fireEvent('select', this, color);
+            }
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+Ext.reg('colorpalette', Ext.ColorPalette);/**
+ * @class Ext.DatePicker
+ * @extends Ext.Component
+ * <p>A popup date picker. This class is used by the {@link Ext.form.DateField DateField} class
+ * to allow browsing and selection of valid dates.</p>
+ * <p>All the string values documented below may be overridden by including an Ext locale file in
+ * your page.</p>
+ * @constructor
+ * Create a new DatePicker
+ * @param {Object} config The config object
+ * @xtype datepicker
+ */
+Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} todayText
+     * The text to display on the button that selects the current date (defaults to <code>'Today'</code>)
+     */
+    todayText : 'Today',
+    /**
+     * @cfg {String} okText
+     * The text to display on the ok button (defaults to <code>'&#160;OK&#160;'</code> to give the user extra clicking room)
+     */
+    okText : '&#160;OK&#160;',
+    /**
+     * @cfg {String} cancelText
+     * The text to display on the cancel button (defaults to <code>'Cancel'</code>)
+     */
+    cancelText : 'Cancel',
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this picker.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">This DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<code><b>this</b></code> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DatePicker instance.
+     */
+    /**
+     * @cfg {String} todayTip
+     * A string used to format the message for displaying in a tooltip over the button that
+     * selects the current date. Defaults to <code>'{0} (Spacebar)'</code> where
+     * the <code>{0}</code> token is replaced by today's date.
+     */
+    todayTip : '{0} (Spacebar)',
+    /**
+     * @cfg {String} minText
+     * The error text to display if the minDate validation fails (defaults to <code>'This date is before the minimum date'</code>)
+     */
+    minText : 'This date is before the minimum date',
+    /**
+     * @cfg {String} maxText
+     * The error text to display if the maxDate validation fails (defaults to <code>'This date is after the maximum date'</code>)
+     */
+    maxText : 'This date is after the maximum date',
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <code>'m/d/y'</code>).
+     */
+    format : 'm/d/y',
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <code>'Disabled'</code>)
+     */
+    disabledDaysText : 'Disabled',
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <code>'Disabled'</code>)
+     */
+    disabledDatesText : 'Disabled',
+    /**
+     * @cfg {Array} monthNames
+     * An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)
+     */
+    monthNames : Date.monthNames,
+    /**
+     * @cfg {Array} dayNames
+     * An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)
+     */
+    dayNames : Date.dayNames,
+    /**
+     * @cfg {String} nextText
+     * The next month navigation button tooltip (defaults to <code>'Next Month (Control+Right)'</code>)
+     */
+    nextText : 'Next Month (Control+Right)',
+    /**
+     * @cfg {String} prevText
+     * The previous month navigation button tooltip (defaults to <code>'Previous Month (Control+Left)'</code>)
+     */
+    prevText : 'Previous Month (Control+Left)',
+    /**
+     * @cfg {String} monthYearText
+     * The header month selector tooltip (defaults to <code>'Choose a month (Control+Up/Down to move years)'</code>)
+     */
+    monthYearText : 'Choose a month (Control+Up/Down to move years)',
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    /**
+     * @cfg {Boolean} showToday
+     * False to hide the footer area containing the Today button and disable the keyboard handler for spacebar
+     * that selects the current date (defaults to <code>true</code>).
+     */
+    showToday : true,
+    /**
+     * @cfg {Date} minDate
+     * Minimum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Date} maxDate
+     * Maximum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).
+     */
+    /**
+     * @cfg {RegExp} disabledDatesRE
+     * JavaScript regular expression used to disable a pattern of dates (defaults to null).  The {@link #disabledDates}
+     * config will generate this regex internally, but if you specify disabledDatesRE it will take precedence over the
+     * disabledDates value.
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of 'dates' to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:
+     * <ul>
+     * <li>['03/08/2003', '09/16/2003'] would disable those exact dates</li>
+     * <li>['03/08', '09/16'] would disable those days for every year</li>
+     * <li>['^03/08'] would only match the beginning (useful if you are using short years)</li>
+     * <li>['03/../2006'] would disable every day in March 2006</li>
+     * <li>['^03'] would disable every day in every March</li>
+     * </ul>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a date format that has '.' in it, you will have to
+     * escape the dot when restricting dates. For example: ['03\\.08\\.03'].
+     */
+
+    // private
+    // Set by other components to stop the picker focus being updated when the value changes.
+    focusOnSelect: true,
+
+    // default value used to initialise each date in the DatePicker
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initHour: 12, // 24-hour format
+
+    // private
+    initComponent : function(){
+        Ext.DatePicker.superclass.initComponent.call(this);
+
+        this.value = this.value ?
+                 this.value.clearTime(true) : new Date().clearTime();
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected
+             * @param {DatePicker} this DatePicker
+             * @param {Date} date The selected date
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler,  this.scope || this);
+        }
+
+        this.initDisabledDays();
+    },
+
+    // private
+    initDisabledDays : function(){
+        if(!this.disabledDatesRE && this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = '(?:';
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array/RegExp} disabledDates An array of date strings (see the {@link #disabledDates} config
+     * for details on supported values), or a JavaScript regular expression used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        if(Ext.isArray(dd)){
+            this.disabledDates = dd;
+            this.disabledDatesRE = null;
+        }else{
+            this.disabledDatesRE = dd;
+        }
+        this.initDisabledDays();
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the {@link #disabledDays} config
+     * for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #minDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinDate : function(dt){
+        this.minDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #maxDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxDate : function(dt){
+        this.maxDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Sets the value of the date field
+     * @param {Date} value The date to set
+     */
+    setValue : function(value){
+        this.value = value.clearTime(true);
+        this.update(this.value);
+    },
+
+    /**
+     * Gets the current selected value of the date field
+     * @return {Date} The selected date
+     */
+    getValue : function(){
+        return this.value;
+    },
+
+    // private
+    focus : function(){
+        this.update(this.activeDate);
+    },
+
+    // private
+    onEnable: function(initial){
+        Ext.DatePicker.superclass.onEnable.call(this);
+        this.doDisabled(false);
+        this.update(initial ? this.value : this.activeDate);
+        if(Ext.isIE){
+            this.el.repaint();
+        }
+
+    },
+
+    // private
+    onDisable : function(){
+        Ext.DatePicker.superclass.onDisable.call(this);
+        this.doDisabled(true);
+        if(Ext.isIE && !Ext.isIE8){
+            /* Really strange problem in IE6/7, when disabled, have to explicitly
+             * repaint each of the nodes to get them to display correctly, simply
+             * calling repaint on the main element doesn't appear to be enough.
+             */
+             Ext.each([].concat(this.textNodes, this.el.query('th span')), function(el){
+                 Ext.fly(el).repaint();
+             });
+        }
+    },
+
+    // private
+    doDisabled : function(disabled){
+        this.keyNav.setDisabled(disabled);
+        this.prevRepeater.setDisabled(disabled);
+        this.nextRepeater.setDisabled(disabled);
+        if(this.showToday){
+            this.todayKeyListener.setDisabled(disabled);
+            this.todayBtn.setDisabled(disabled);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        var m = [
+             '<table cellspacing="0">',
+                '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr>',
+                '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],
+                dn = this.dayNames,
+                i;
+        for(i = 0; i < 7; i++){
+            var d = this.startDay+i;
+            if(d > 6){
+                d = d-7;
+            }
+            m.push('<th><span>', dn[d].substr(0,1), '</span></th>');
+        }
+        m[m.length] = '</tr></thead><tbody><tr>';
+        for(i = 0; i < 42; i++) {
+            if(i % 7 === 0 && i !== 0){
+                m[m.length] = '</tr><tr>';
+            }
+            m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
+        }
+        m.push('</tr></tbody></table></td></tr>',
+                this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '',
+                '</table><div class="x-date-mp"></div>');
+
+        var el = document.createElement('div');
+        el.className = 'x-date-picker';
+        el.innerHTML = m.join('');
+
+        container.dom.insertBefore(el, position);
+
+        this.el = Ext.get(el);
+        this.eventEl = Ext.get(el.firstChild);
+
+        this.prevRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-left a'), {
+            handler: this.showPrevMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.nextRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-right a'), {
+            handler: this.showNextMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.monthPicker = this.el.down('div.x-date-mp');
+        this.monthPicker.enableDisplayMode('block');
+
+        this.keyNav = new Ext.KeyNav(this.eventEl, {
+            'left' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevMonth();
+                }else{
+                    this.update(this.activeDate.add('d', -1));
+                }
+            },
+
+            'right' : function(e){
+                if(e.ctrlKey){
+                    this.showNextMonth();
+                }else{
+                    this.update(this.activeDate.add('d', 1));
+                }
+            },
+
+            'up' : function(e){
+                if(e.ctrlKey){
+                    this.showNextYear();
+                }else{
+                    this.update(this.activeDate.add('d', -7));
+                }
+            },
+
+            'down' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevYear();
+                }else{
+                    this.update(this.activeDate.add('d', 7));
+                }
+            },
+
+            'pageUp' : function(e){
+                this.showNextMonth();
+            },
+
+            'pageDown' : function(e){
+                this.showPrevMonth();
+            },
+
+            'enter' : function(e){
+                e.stopPropagation();
+                return true;
+            },
+
+            scope : this
+        });
+
+        this.el.unselectable();
+
+        this.cells = this.el.select('table.x-date-inner tbody td');
+        this.textNodes = this.el.query('table.x-date-inner tbody span');
+
+        this.mbtn = new Ext.Button({
+            text: '&#160;',
+            tooltip: this.monthYearText,
+            renderTo: this.el.child('td.x-date-middle', true)
+        });
+        this.mbtn.el.child('em').addClass('x-btn-arrow');
+
+        if(this.showToday){
+            this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,  this);
+            var today = (new Date()).dateFormat(this.format);
+            this.todayBtn = new Ext.Button({
+                renderTo: this.el.child('td.x-date-bottom', true),
+                text: String.format(this.todayText, today),
+                tooltip: String.format(this.todayTip, today),
+                handler: this.selectToday,
+                scope: this
+            });
+        }
+        this.mon(this.eventEl, 'mousewheel', this.handleMouseWheel, this);
+        this.mon(this.eventEl, 'click', this.handleDateClick,  this, {delegate: 'a.x-date-date'});
+        this.mon(this.mbtn, 'click', this.showMonthPicker, this);
+        this.onEnable(true);
+    },
+
+    // private
+    createMonthPicker : function(){
+        if(!this.monthPicker.dom.firstChild){
+            var buf = ['<table border="0" cellspacing="0">'];
+            for(var i = 0; i < 6; i++){
+                buf.push(
+                    '<tr><td class="x-date-mp-month"><a href="#">', Date.getShortMonthName(i), '</a></td>',
+                    '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', Date.getShortMonthName(i + 6), '</a></td>',
+                    i === 0 ?
+                    '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
+                    '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
+                );
+            }
+            buf.push(
+                '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
+                    this.okText,
+                    '</button><button type="button" class="x-date-mp-cancel">',
+                    this.cancelText,
+                    '</button></td></tr>',
+                '</table>'
+            );
+            this.monthPicker.update(buf.join(''));
+
+            this.mon(this.monthPicker, 'click', this.onMonthClick, this);
+            this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
+
+            this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
+            this.mpYears = this.monthPicker.select('td.x-date-mp-year');
+
+            this.mpMonths.each(function(m, a, i){
+                i += 1;
+                if((i%2) === 0){
+                    m.dom.xmonth = 5 + Math.round(i * 0.5);
+                }else{
+                    m.dom.xmonth = Math.round((i-1) * 0.5);
+                }
+            });
+        }
+    },
+
+    // private
+    showMonthPicker : function(){
+        if(!this.disabled){
+            this.createMonthPicker();
+            var size = this.el.getSize();
+            this.monthPicker.setSize(size);
+            this.monthPicker.child('table').setSize(size);
+
+            this.mpSelMonth = (this.activeDate || this.value).getMonth();
+            this.updateMPMonth(this.mpSelMonth);
+            this.mpSelYear = (this.activeDate || this.value).getFullYear();
+            this.updateMPYear(this.mpSelYear);
+
+            this.monthPicker.slideIn('t', {duration:0.2});
+        }
+    },
+
+    // private
+    updateMPYear : function(y){
+        this.mpyear = y;
+        var ys = this.mpYears.elements;
+        for(var i = 1; i <= 10; i++){
+            var td = ys[i-1], y2;
+            if((i%2) === 0){
+                y2 = y + Math.round(i * 0.5);
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }else{
+                y2 = y - (5-Math.round(i * 0.5));
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }
+            this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        }
+    },
+
+    // private
+    updateMPMonth : function(sm){
+        this.mpMonths.each(function(m, a, i){
+            m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        });
+    },
+
+    // private
+    selectMPMonth : function(m){
+
+    },
+
+    // private
+    onMonthClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if(el.is('button.x-date-mp-cancel')){
+            this.hideMonthPicker();
+        }
+        else if(el.is('button.x-date-mp-ok')){
+            var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
+            if(d.getMonth() != this.mpSelMonth){
+                // 'fix' the JS rolling date conversion if needed
+                d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
+            }
+            this.update(d);
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-month', 2))){
+            this.mpMonths.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelMonth = pn.dom.xmonth;
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.mpYears.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelYear = pn.dom.xyear;
+        }
+        else if(el.is('a.x-date-mp-prev')){
+            this.updateMPYear(this.mpyear-10);
+        }
+        else if(el.is('a.x-date-mp-next')){
+            this.updateMPYear(this.mpyear+10);
+        }
+    },
+
+    // private
+    onMonthDblClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if((pn = el.up('td.x-date-mp-month', 2))){
+            this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+    },
+
+    // private
+    hideMonthPicker : function(disableAnim){
+        if(this.monthPicker){
+            if(disableAnim === true){
+                this.monthPicker.hide();
+            }else{
+                this.monthPicker.slideOut('t', {duration:0.2});
+            }
+        }
+    },
+
+    // private
+    showPrevMonth : function(e){
+        this.update(this.activeDate.add('mo', -1));
+    },
+
+    // private
+    showNextMonth : function(e){
+        this.update(this.activeDate.add('mo', 1));
+    },
+
+    // private
+    showPrevYear : function(){
+        this.update(this.activeDate.add('y', -1));
+    },
+
+    // private
+    showNextYear : function(){
+        this.update(this.activeDate.add('y', 1));
+    },
+
+    // private
+    handleMouseWheel : function(e){
+        e.stopEvent();
+        if(!this.disabled){
+            var delta = e.getWheelDelta();
+            if(delta > 0){
+                this.showPrevMonth();
+            } else if(delta < 0){
+                this.showNextMonth();
+            }
+        }
+    },
+
+    // private
+    handleDateClick : function(e, t){
+        e.stopEvent();
+        if(!this.disabled && t.dateValue && !Ext.fly(t.parentNode).hasClass('x-date-disabled')){
+            this.cancelFocus = this.focusOnSelect === false;
+            this.setValue(new Date(t.dateValue));
+            delete this.cancelFocus;
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    selectToday : function(){
+        if(this.todayBtn && !this.todayBtn.disabled){
+            this.setValue(new Date().clearTime());
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    update : function(date, forceRefresh){
+        if(this.rendered){
+            var vd = this.activeDate, vis = this.isVisible();
+            this.activeDate = date;
+            if(!forceRefresh && vd && this.el){
+                var t = date.getTime();
+                if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
+                    this.cells.removeClass('x-date-selected');
+                    this.cells.each(function(c){
+                       if(c.dom.firstChild.dateValue == t){
+                           c.addClass('x-date-selected');
+                           if(vis && !this.cancelFocus){
+                               Ext.fly(c.dom.firstChild).focus(50);
+                           }
+                           return false;
+                       }
+                    }, this);
+                    return;
+                }
+            }
+            var days = date.getDaysInMonth(),
+                firstOfMonth = date.getFirstDateOfMonth(),
+                startingPos = firstOfMonth.getDay()-this.startDay;
+
+            if(startingPos < 0){
+                startingPos += 7;
+            }
+            days += startingPos;
+
+            var pm = date.add('mo', -1),
+                prevStart = pm.getDaysInMonth()-startingPos,
+                cells = this.cells.elements,
+                textEls = this.textNodes,
+                // convert everything to numbers so it's fast
+                d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart, this.initHour)),
+                today = new Date().clearTime().getTime(),
+                sel = date.clearTime(true).getTime(),
+                min = this.minDate ? this.minDate.clearTime(true) : Number.NEGATIVE_INFINITY,
+                max = this.maxDate ? this.maxDate.clearTime(true) : Number.POSITIVE_INFINITY,
+                ddMatch = this.disabledDatesRE,
+                ddText = this.disabledDatesText,
+                ddays = this.disabledDays ? this.disabledDays.join('') : false,
+                ddaysText = this.disabledDaysText,
+                format = this.format;
+
+            if(this.showToday){
+                var td = new Date().clearTime(),
+                    disable = (td < min || td > max ||
+                    (ddMatch && format && ddMatch.test(td.dateFormat(format))) ||
+                    (ddays && ddays.indexOf(td.getDay()) != -1));
+
+                if(!this.disabled){
+                    this.todayBtn.setDisabled(disable);
+                    this.todayKeyListener[disable ? 'disable' : 'enable']();
+                }
+            }
+
+            var setCellClass = function(cal, cell){
+                cell.title = '';
+                var t = d.clearTime(true).getTime();
+                cell.firstChild.dateValue = t;
+                if(t == today){
+                    cell.className += ' x-date-today';
+                    cell.title = cal.todayText;
+                }
+                if(t == sel){
+                    cell.className += ' x-date-selected';
+                    if(vis){
+                        Ext.fly(cell.firstChild).focus(50);
+                    }
+                }
+                // disabling
+                if(t < min) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.minText;
+                    return;
+                }
+                if(t > max) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.maxText;
+                    return;
+                }
+                if(ddays){
+                    if(ddays.indexOf(d.getDay()) != -1){
+                        cell.title = ddaysText;
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+                if(ddMatch && format){
+                    var fvalue = d.dateFormat(format);
+                    if(ddMatch.test(fvalue)){
+                        cell.title = ddText.replace('%0', fvalue);
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+            };
+
+            var i = 0;
+            for(; i < startingPos; i++) {
+                textEls[i].innerHTML = (++prevStart);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-prevday';
+                setCellClass(this, cells[i]);
+            }
+            for(; i < days; i++){
+                var intDay = i - startingPos + 1;
+                textEls[i].innerHTML = (intDay);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-active';
+                setCellClass(this, cells[i]);
+            }
+            var extraDays = 0;
+            for(; i < 42; i++) {
+                 textEls[i].innerHTML = (++extraDays);
+                 d.setDate(d.getDate()+1);
+                 cells[i].className = 'x-date-nextday';
+                 setCellClass(this, cells[i]);
+            }
+
+            this.mbtn.setText(this.monthNames[date.getMonth()] + ' ' + date.getFullYear());
+
+            if(!this.internalRender){
+                var main = this.el.dom.firstChild,
+                    w = main.offsetWidth;
+                this.el.setWidth(w + this.el.getBorderWidth('lr'));
+                Ext.fly(main).setWidth(w);
+                this.internalRender = true;
+                // opera does not respect the auto grow header center column
+                // then, after it gets a width opera refuses to recalculate
+                // without a second pass
+                if(Ext.isOpera && !this.secondPass){
+                    main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + 'px';
+                    this.secondPass = true;
+                    this.update.defer(10, this, [date]);
+                }
+            }
+        }
+    },
+
+    // private
+    beforeDestroy : function() {
+        if(this.rendered){
+            Ext.destroy(
+                this.keyNav,
+                this.monthPicker,
+                this.eventEl,
+                this.mbtn,
+                this.nextRepeater,
+                this.prevRepeater,
+                this.cells.el,
+                this.todayBtn
+            );
+            delete this.textNodes;
+            delete this.cells.elements;
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+Ext.reg('datepicker', Ext.DatePicker);
+/**
+ * @class Ext.LoadMask
+ * A simple utility class for generically masking elements while loading data.  If the {@link #store}
+ * config option is specified, the masking will be automatically synchronized with the store's loading
+ * process and the mask element will be cached for reuse.  For all other elements, this mask will replace the
+ * element's Updater load indicator and will be destroyed after the initial load.
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic mask:
+var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait..."});
+myMask.show();
+</code></pre>
+ * @constructor
+ * Create a new LoadMask
+ * @param {Mixed} el The element or DOM node, or its id
+ * @param {Object} config The config object
+ */
+Ext.LoadMask = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(this.store){
+        this.store.on({
+            scope: this,
+            beforeload: this.onBeforeLoad,
+            load: this.onLoad,
+            exception: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, false);
+    }else{
+        var um = this.el.getUpdater();
+        um.showLoadIndicator = false; // disable the default indicator
+        um.on({
+            scope: this,
+            beforeupdate: this.onBeforeLoad,
+            update: this.onLoad,
+            failure: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, true);
+    }
+};
+
+Ext.LoadMask.prototype = {
+    /**
+     * @cfg {Ext.data.Store} store
+     * Optional Store to which the mask is bound. The mask is displayed when a load request is issued, and
+     * hidden on either load sucess, or load fail.
+     */
+    /**
+     * @cfg {Boolean} removeMask
+     * True to create a single-use mask that is automatically destroyed after loading (useful for page loads),
+     * False to persist the mask element reference for multiple uses (e.g., for paged data widgets).  Defaults to false.
+     */
+    /**
+     * @cfg {String} msg
+     * The text to display in a centered loading message box (defaults to 'Loading...')
+     */
+    msg : 'Loading...',
+    /**
+     * @cfg {String} msgCls
+     * The CSS class to apply to the loading message element (defaults to "x-mask-loading")
+     */
+    msgCls : 'x-mask-loading',
+
+    /**
+     * Read-only. True if the mask is currently disabled so that it will not be displayed (defaults to false)
+     * @type Boolean
+     */
+    disabled: false,
+
+    /**
+     * Disables the mask to prevent it from being displayed
+     */
+    disable : function(){
+       this.disabled = true;
+    },
+
+    /**
+     * Enables the mask so that it can be displayed
+     */
+    enable : function(){
+        this.disabled = false;
+    },
+
+    // private
+    onLoad : function(){
+        this.el.unmask(this.removeMask);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.disabled){
+            this.el.mask(this.msg, this.msgCls);
+        }
+    },
+
+    /**
+     * Show this LoadMask over the configured Element.
+     */
+    show: function(){
+        this.onBeforeLoad();
+    },
+
+    /**
+     * Hide this LoadMask.
+     */
+    hide: function(){
+        this.onLoad();
+    },
+
+    // private
+    destroy : function(){
+        if(this.store){
+            this.store.un('beforeload', this.onBeforeLoad, this);
+            this.store.un('load', this.onLoad, this);
+            this.store.un('exception', this.onLoad, this);
+        }else{
+            var um = this.el.getUpdater();
+            um.un('beforeupdate', this.onBeforeLoad, this);
+            um.un('update', this.onLoad, this);
+            um.un('failure', this.onLoad, this);
+        }
+    }
+};/**
+ * @class Ext.slider.Thumb
+ * @extends Object
+ * Represents a single thumb element on a Slider. This would not usually be created manually and would instead
+ * be created internally by an {@link Ext.slider.MultiSlider Ext.Slider}.
+ */
+Ext.slider.Thumb = Ext.extend(Object, {
+    
+    /**
+     * True while the thumb is in a drag operation
+     * @type Boolean
+     */
+    dragging: false,
+
+    /**
+     * @constructor
+     * @cfg {Ext.slider.MultiSlider} slider The Slider to render to (required)
+     */
+    constructor: function(config) {
+        /**
+         * @property slider
+         * @type Ext.slider.MultiSlider
+         * The slider this thumb is contained within
+         */
+        Ext.apply(this, config || {}, {
+            cls: 'x-slider-thumb',
+
+            /**
+             * @cfg {Boolean} constrain True to constrain the thumb so that it cannot overlap its siblings
+             */
+            constrain: false
+        });
+
+        Ext.slider.Thumb.superclass.constructor.call(this, config);
+
+        if (this.slider.vertical) {
+            Ext.apply(this, Ext.slider.Thumb.Vertical);
+        }
+    },
+
+    /**
+     * Renders the thumb into a slider
+     */
+    render: function() {
+        this.el = this.slider.innerEl.insertFirst({cls: this.cls});
+
+        this.initEvents();
+    },
+
+    /**
+     * Enables the thumb if it is currently disabled
+     */
+    enable: function() {
+        this.disabled = false;
+        this.el.removeClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Disables the thumb if it is currently enabled
+     */
+    disable: function() {
+        this.disabled = true;
+        this.el.addClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Sets up an Ext.dd.DragTracker for this thumb
+     */
+    initEvents: function() {
+        var el = this.el;
+
+        el.addClassOnOver('x-slider-thumb-over');
+
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeDragStart.createDelegate(this),
+            onStart      : this.onDragStart.createDelegate(this),
+            onDrag       : this.onDrag.createDelegate(this),
+            onEnd        : this.onDragEnd.createDelegate(this),
+            tolerance    : 3,
+            autoStart    : 300
+        });
+
+        this.tracker.initEl(el);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker. If the slider is currently disabled,
+     * this returns false to disable the DragTracker too.
+     * @return {Boolean} False if the slider is currently disabled
+     */
+    onBeforeDragStart : function(e) {
+        if (this.disabled) {
+            return false;
+        } else {
+            this.slider.promoteThumb(this);
+            return true;
+        }
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onStart template method. Adds the drag CSS class
+     * to the thumb and fires the 'dragstart' event
+     */
+    onDragStart: function(e){
+        this.el.addClass('x-slider-thumb-drag');
+        this.dragging = true;
+        this.dragStartValue = this.value;
+
+        this.slider.fireEvent('dragstart', this.slider, e, this);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onDrag template method. This is called every time
+     * the DragTracker detects a drag movement. It updates the Slider's value using the position of the drag
+     */
+    onDrag: function(e) {
+        var slider   = this.slider,
+            index    = this.index,
+            newValue = this.getNewValue();
+
+        if (this.constrain) {
+            var above = slider.thumbs[index + 1],
+                below = slider.thumbs[index - 1];
+
+            if (below != undefined && newValue <= below.value) newValue = below.value;
+            if (above != undefined && newValue >= above.value) newValue = above.value;
+        }
+
+        slider.setValue(index, newValue, false);
+        slider.fireEvent('drag', slider, e, this);
+    },
+
+    getNewValue: function() {
+        var slider   = this.slider,
+            pos      = slider.innerEl.translatePoints(this.tracker.getXY());
+
+        return Ext.util.Format.round(slider.reverseValue(pos.left), slider.decimalPrecision);
+    },
+
+    /**
+     * @private
+     * This is tied to the internal Ext.dd.DragTracker's onEnd template method. Removes the drag CSS class and
+     * fires the 'changecomplete' event with the new value
+     */
+    onDragEnd: function(e) {
+        var slider = this.slider,
+            value  = this.value;
+
+        this.el.removeClass('x-slider-thumb-drag');
+
+        this.dragging = false;
+        slider.fireEvent('dragend', slider, e);
+
+        if (this.dragStartValue != value) {
+            slider.fireEvent('changecomplete', slider, value, this);
+        }
+    },
+    
+    /**
+     * @private
+     * Destroys the thumb
+     */
+    destroy: function(){
+        Ext.destroyMembers(this, 'tracker', 'el');
+    }
+});
+
+/**
+ * @class Ext.slider.MultiSlider
+ * @extends Ext.BoxComponent
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments, configurable snapping, axis clicking and animation. Can be added as an item to any container. Example usage:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</pre>
+ * Sliders can be created with more than one thumb handle by passing an array of values instead of a single one:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    values: [25, 50, 75],
+    minValue: 0,
+    maxValue: 100,
+
+    //this defaults to true, setting to false allows the thumbs to pass each other
+    {@link #constrainThumbs}: false
+});
+</pre>
+ */
+Ext.slider.MultiSlider = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Number} value The value to initialize the slider with. Defaults to minValue.
+     */
+    /**
+     * @cfg {Boolean} vertical Orient the Slider vertically rather than horizontally, defaults to false.
+     */
+    vertical: false,
+    /**
+     * @cfg {Number} minValue The minimum value for the Slider. Defaults to 0.
+     */
+    minValue: 0,
+    /**
+     * @cfg {Number} maxValue The maximum value for the Slider. Defaults to 100.
+     */
+    maxValue: 100,
+    /**
+     * @cfg {Number/Boolean} decimalPrecision.
+     * <p>The number of decimal places to which to round the Slider's value. Defaults to 0.</p>
+     * <p>To disable rounding, configure as <tt><b>false</b></tt>.</p>
+     */
+    decimalPrecision: 0,
+    /**
+     * @cfg {Number} keyIncrement How many units to change the Slider when adjusting with keyboard navigation. Defaults to 1. If the increment config is larger, it will be used instead.
+     */
+    keyIncrement: 1,
+    /**
+     * @cfg {Number} increment How many units to change the slider when adjusting by drag and drop. Use this option to enable 'snapping'.
+     */
+    increment: 0,
+
+    /**
+     * @private
+     * @property clickRange
+     * @type Array
+     * Determines whether or not a click to the slider component is considered to be a user request to change the value. Specified as an array of [top, bottom],
+     * the click event's 'top' property is compared to these numbers and the click only considered a change request if it falls within them. e.g. if the 'top'
+     * value of the click event is 4 or 16, the click is not considered a change request as it falls outside of the [5, 15] range
+     */
+    clickRange: [5,15],
+
+    /**
+     * @cfg {Boolean} clickToChange Determines whether or not clicking on the Slider axis will change the slider. Defaults to true
+     */
+    clickToChange : true,
+    /**
+     * @cfg {Boolean} animate Turn on or off animation. Defaults to true
+     */
+    animate: true,
+    /**
+     * @cfg {Boolean} constrainThumbs True to disallow thumbs from overlapping one another. Defaults to true
+     */
+    constrainThumbs: true,
+
+    /**
+     * @private
+     * @property topThumbZIndex
+     * @type Number
+     * The number used internally to set the z index of the top thumb (see promoteThumb for details)
+     */
+    topThumbZIndex: 10000,
+
+    // private override
+    initComponent : function(){
+        if(!Ext.isDefined(this.value)){
+            this.value = this.minValue;
+        }
+
+        /**
+         * @property thumbs
+         * @type Array
+         * Array containing references to each thumb
+         */
+        this.thumbs = [];
+
+        Ext.slider.MultiSlider.superclass.initComponent.call(this);
+
+        this.keyIncrement = Math.max(this.increment, this.keyIncrement);
+        this.addEvents(
+            /**
+             * @event beforechange
+             * Fires before the slider value is changed. By returning false from an event handler,
+             * you can cancel the event and prevent the slider from changing.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider is being changed to.
+             * @param {Number} oldValue The old value which the slider was previously.
+             */
+            'beforechange',
+
+            /**
+             * @event change
+             * Fires when the slider value is changed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'change',
+
+            /**
+             * @event changecomplete
+             * Fires when the slider value is changed by the user and any drag operations have completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'changecomplete',
+
+            /**
+             * @event dragstart
+             * Fires after a drag operation has started.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragstart',
+
+            /**
+             * @event drag
+             * Fires continuously during the drag operation while the mouse is moving.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'drag',
+
+            /**
+             * @event dragend
+             * Fires after the drag operation has completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragend'
+        );
+
+        /**
+         * @property values
+         * @type Array
+         * Array of values to initalize the thumbs with
+         */
+        if (this.values == undefined || Ext.isEmpty(this.values)) this.values = [0];
+
+        var values = this.values;
+
+        for (var i=0; i < values.length; i++) {
+            this.addThumb(values[i]);
+        }
+
+        if(this.vertical){
+            Ext.apply(this, Ext.slider.Vertical);
+        }
+    },
+
+    /**
+     * Creates a new thumb and adds it to the slider
+     * @param {Number} value The initial value to set on the thumb. Defaults to 0
+     */
+    addThumb: function(value) {
+        var thumb = new Ext.slider.Thumb({
+            value    : value,
+            slider   : this,
+            index    : this.thumbs.length,
+            constrain: this.constrainThumbs
+        });
+        this.thumbs.push(thumb);
+
+        //render the thumb now if needed
+        if (this.rendered) thumb.render();
+    },
+
+    /**
+     * @private
+     * Moves the given thumb above all other by increasing its z-index. This is called when as drag
+     * any thumb, so that the thumb that was just dragged is always at the highest z-index. This is
+     * required when the thumbs are stacked on top of each other at one of the ends of the slider's
+     * range, which can result in the user not being able to move any of them.
+     * @param {Ext.slider.Thumb} topThumb The thumb to move to the top
+     */
+    promoteThumb: function(topThumb) {
+        var thumbs = this.thumbs,
+            zIndex, thumb;
+
+        for (var i = 0, j = thumbs.length; i < j; i++) {
+            thumb = thumbs[i];
+
+            if (thumb == topThumb) {
+                zIndex = this.topThumbZIndex;
+            } else {
+                zIndex = '';
+            }
+
+            thumb.el.setStyle('zIndex', zIndex);
+        }
+    },
+
+    // private override
+    onRender : function() {
+        this.autoEl = {
+            cls: 'x-slider ' + (this.vertical ? 'x-slider-vert' : 'x-slider-horz'),
+            cn : {
+                cls: 'x-slider-end',
+                cn : {
+                    cls:'x-slider-inner',
+                    cn : [{tag:'a', cls:'x-slider-focus', href:"#", tabIndex: '-1', hidefocus:'on'}]
+                }
+            }
+        };
+
+        Ext.slider.MultiSlider.superclass.onRender.apply(this, arguments);
+
+        this.endEl   = this.el.first();
+        this.innerEl = this.endEl.first();
+        this.focusEl = this.innerEl.child('.x-slider-focus');
+
+        //render each thumb
+        for (var i=0; i < this.thumbs.length; i++) {
+            this.thumbs[i].render();
+        }
+
+        //calculate the size of half a thumb
+        var thumb      = this.innerEl.child('.x-slider-thumb');
+        this.halfThumb = (this.vertical ? thumb.getHeight() : thumb.getWidth()) / 2;
+
+        this.initEvents();
+    },
+
+    /**
+     * @private
+     * Adds keyboard and mouse listeners on this.el. Ignores click events on the internal focus element.
+     * Creates a new DragTracker which is used to control what happens when the user drags the thumb around.
+     */
+    initEvents : function(){
+        this.mon(this.el, {
+            scope    : this,
+            mousedown: this.onMouseDown,
+            keydown  : this.onKeyDown
+        });
+
+        this.focusEl.swallowEvent("click", true);
+    },
+
+    /**
+     * @private
+     * Mousedown handler for the slider. If the clickToChange is enabled and the click was not on the draggable 'thumb',
+     * this calculates the new value of the slider and tells the implementation (Horizontal or Vertical) to move the thumb
+     * @param {Ext.EventObject} e The click event
+     */
+    onMouseDown : function(e){
+        if(this.disabled){
+            return;
+        }
+
+        //see if the click was on any of the thumbs
+        var thumbClicked = false;
+        for (var i=0; i < this.thumbs.length; i++) {
+            thumbClicked = thumbClicked || e.target == this.thumbs[i].el.dom;
+        }
+
+        if (this.clickToChange && !thumbClicked) {
+            var local = this.innerEl.translatePoints(e.getXY());
+            this.onClickChange(local);
+        }
+        this.focus();
+    },
+
+    /**
+     * @private
+     * Moves the thumb to the indicated position. Note that a Vertical implementation is provided in Ext.slider.Vertical.
+     * Only changes the value if the click was within this.clickRange.
+     * @param {Object} local Object containing top and left values for the click event.
+     */
+    onClickChange : function(local) {
+        if (local.top > this.clickRange[0] && local.top < this.clickRange[1]) {
+            //find the nearest thumb to the click event
+            var thumb = this.getNearest(local, 'left'),
+                index = thumb.index;
+
+            this.setValue(index, Ext.util.Format.round(this.reverseValue(local.left), this.decimalPrecision), undefined, true);
+        }
+    },
+
+    /**
+     * @private
+     * Returns the nearest thumb to a click event, along with its distance
+     * @param {Object} local Object containing top and left values from a click event
+     * @param {String} prop The property of local to compare on. Use 'left' for horizontal sliders, 'top' for vertical ones
+     * @return {Object} The closest thumb object and its distance from the click event
+     */
+    getNearest: function(local, prop) {
+        var localValue = prop == 'top' ? this.innerEl.getHeight() - local[prop] : local[prop],
+            clickValue = this.reverseValue(localValue),
+            nearestDistance = (this.maxValue - this.minValue) + 5, //add a small fudge for the end of the slider 
+            index = 0,
+            nearest = null;
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                value = thumb.value,
+                dist  = Math.abs(value - clickValue);
+
+            if (Math.abs(dist <= nearestDistance)) {
+                nearest = thumb;
+                index = i;
+                nearestDistance = dist;
+            }
+        }
+        return nearest;
+    },
+
+    /**
+     * @private
+     * Handler for any keypresses captured by the slider. If the key is UP or RIGHT, the thumb is moved along to the right
+     * by this.keyIncrement. If DOWN or LEFT it is moved left. Pressing CTRL moves the slider to the end in either direction
+     * @param {Ext.EventObject} e The Event object
+     */
+    onKeyDown : function(e){
+        /*
+         * The behaviour for keyboard handling with multiple thumbs is currently undefined.
+         * There's no real sane default for it, so leave it like this until we come up
+         * with a better way of doing it.
+         */
+        if(this.disabled || this.thumbs.length !== 1){
+            e.preventDefault();
+            return;
+        }
+        var k = e.getKey(),
+            val;
+        switch(k){
+            case e.UP:
+            case e.RIGHT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.maxValue : this.getValue(0) + this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            case e.DOWN:
+            case e.LEFT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.minValue : this.getValue(0) - this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            default:
+                e.preventDefault();
+        }
+    },
+
+    /**
+     * @private
+     * If using snapping, this takes a desired new value and returns the closest snapped
+     * value to it
+     * @param {Number} value The unsnapped value
+     * @return {Number} The value of the nearest snap target
+     */
+    doSnap : function(value){
+        if (!(this.increment && value)) {
+            return value;
+        }
+        var newValue = value,
+            inc = this.increment,
+            m = value % inc;
+        if (m != 0) {
+            newValue -= m;
+            if (m * 2 >= inc) {
+                newValue += inc;
+            } else if (m * 2 < -inc) {
+                newValue -= inc;
+            }
+        }
+        return newValue.constrain(this.minValue,  this.maxValue);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.slider.MultiSlider.superclass.afterRender.apply(this, arguments);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i];
+
+            if (thumb.value !== undefined) {
+                var v = this.normalizeValue(thumb.value);
+
+                if (v !== thumb.value) {
+                    // delete this.value;
+                    this.setValue(i, v, false);
+                } else {
+                    this.moveThumb(i, this.translateValue(v), false);
+                }
+            }
+        };
+    },
+
+    /**
+     * @private
+     * Returns the ratio of pixels to mapped values. e.g. if the slider is 200px wide and maxValue - minValue is 100,
+     * the ratio is 2
+     * @return {Number} The ratio of pixels to mapped values
+     */
+    getRatio : function(){
+        var w = this.innerEl.getWidth(),
+            v = this.maxValue - this.minValue;
+        return v == 0 ? w : (w/v);
+    },
+
+    /**
+     * @private
+     * Returns a snapped, constrained value when given a desired value
+     * @param {Number} value Raw number value
+     * @return {Number} The raw value rounded to the correct d.p. and constrained within the set max and min values
+     */
+    normalizeValue : function(v){
+        v = this.doSnap(v);
+        v = Ext.util.Format.round(v, this.decimalPrecision);
+        v = v.constrain(this.minValue, this.maxValue);
+        return v;
+    },
+
+    /**
+     * Sets the minimum value for the slider instance. If the current value is less than the
+     * minimum value, the current value will be changed.
+     * @param {Number} val The new minimum value
+     */
+    setMinValue : function(val){
+        this.minValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value < val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Sets the maximum value for the slider instance. If the current value is more than the
+     * maximum value, the current value will be changed.
+     * @param {Number} val The new maximum value
+     */
+    setMaxValue : function(val){
+        this.maxValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value > val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} index Index of the thumb to move
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue : function(index, v, animate, changeComplete) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        v = this.normalizeValue(v);
+
+        if (v !== thumb.value && this.fireEvent('beforechange', this, v, thumb.value, thumb) !== false) {
+            thumb.value = v;
+            if(this.rendered){
+                this.moveThumb(index, this.translateValue(v), animate !== false);
+                this.fireEvent('change', this, v, thumb);
+                if(changeComplete){
+                    this.fireEvent('changecomplete', this, v, thumb);
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     */
+    translateValue : function(v) {
+        var ratio = this.getRatio();
+        return (v * ratio) - (this.minValue * ratio) - this.halfThumb;
+    },
+
+    /**
+     * @private
+     * Given a pixel location along the slider, returns the mapped slider value for that pixel.
+     * E.g. if we have a slider 200px wide with minValue = 100 and maxValue = 500, reverseValue(50)
+     * returns 200
+     * @param {Number} pos The position along the slider to return a mapped value for
+     * @return {Number} The mapped value for the given position
+     */
+    reverseValue : function(pos){
+        var ratio = this.getRatio();
+        return (pos + (this.minValue * ratio)) / ratio;
+    },
+
+    /**
+     * @private
+     * @param {Number} index Index of the thumb to move
+     */
+    moveThumb: function(index, v, animate){
+        var thumb = this.thumbs[index].el;
+
+        if(!animate || this.animate === false){
+            thumb.setLeft(v);
+        }else{
+            thumb.shift({left: v, stopFx: true, duration:.35});
+        }
+    },
+
+    // private
+    focus : function(){
+        this.focusEl.focus(10);
+    },
+
+    // private
+    onResize : function(w, h){
+        var thumbs = this.thumbs,
+            len = thumbs.length,
+            i = 0;
+            
+        /*
+         * If we happen to be animating during a resize, the position of the thumb will likely be off
+         * when the animation stops. As such, just stop any animations before syncing the thumbs.
+         */
+        for(; i < len; ++i){
+            thumbs[i].el.stopFx();    
+        }
+        // check to see if we're using an auto width
+        if(Ext.isNumber(w)){
+            this.innerEl.setWidth(w - (this.el.getPadding('l') + this.endEl.getPadding('r')));
+        }
+        this.syncThumb();
+        Ext.slider.MultiSlider.superclass.onResize.apply(this, arguments);
+    },
+
+    //private
+    onDisable: function(){
+        Ext.slider.MultiSlider.superclass.onDisable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.disable();
+
+            if(Ext.isIE){
+                //IE breaks when using overflow visible and opacity other than 1.
+                //Create a place holder for the thumb and display it.
+                var xy = el.getXY();
+                el.hide();
+
+                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
+
+                if (!this.thumbHolder) {
+                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
+                }
+
+                this.thumbHolder.show().setXY(xy);
+            }
+        }
+    },
+
+    //private
+    onEnable: function(){
+        Ext.slider.MultiSlider.superclass.onEnable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.enable();
+
+            if (Ext.isIE) {
+                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
+
+                if (this.thumbHolder) this.thumbHolder.hide();
+
+                el.show();
+                this.syncThumb();
+            }
+        }
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        if (this.rendered) {
+            for (var i=0; i < this.thumbs.length; i++) {
+                this.moveThumb(i, this.translateValue(this.thumbs[i].value));
+            }
+        }
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @param {Number} index The index of the thumb to return a value for
+     * @return {Number} The current value of the slider
+     */
+    getValue : function(index) {
+        return this.thumbs[index].value;
+    },
+
+    /**
+     * Returns an array of values - one for the location of each thumb
+     * @return {Array} The set of thumb values
+     */
+    getValues: function() {
+        var values = [];
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            values.push(this.thumbs[i].value);
+        }
+
+        return values;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var thumbs = this.thumbs;
+        for(var i = 0, len = thumbs.length; i < len; ++i){
+            thumbs[i].destroy();
+            thumbs[i] = null;
+        }
+        Ext.destroyMembers(this, 'endEl', 'innerEl', 'focusEl', 'thumbHolder');
+        Ext.slider.MultiSlider.superclass.beforeDestroy.call(this);
+    }
+});
+
+Ext.reg('multislider', Ext.slider.MultiSlider);
+
+/**
+ * @class Ext.slider.SingleSlider
+ * @extends Ext.slider.MultiSlider
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments,
+ * configurable snapping, axis clicking and animation. Can be added as an item to
+ * any container. Example usage:
+<pre><code>
+new Ext.slider.SingleSlider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</code></pre>
+ * The class Ext.slider.SingleSlider is aliased to Ext.Slider for backwards compatibility.
+ */
+Ext.slider.SingleSlider = Ext.extend(Ext.slider.MultiSlider, {
+    constructor: function(config) {
+      config = config || {};
+
+      Ext.applyIf(config, {
+          values: [config.value || 0]
+      });
+
+      Ext.slider.SingleSlider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @return {Number} The current value of the slider
+     */
+    getValue: function() {
+        //just returns the value of the first thumb, which should be the only one in a single slider
+        return Ext.slider.SingleSlider.superclass.getValue.call(this, 0);
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue: function(value, animate) {
+        var args = Ext.toArray(arguments),
+            len  = args.length;
+
+        //this is to maintain backwards compatiblity for sliders with only one thunb. Usually you must pass the thumb
+        //index to setValue, but if we only have one thumb we inject the index here first if given the multi-slider
+        //signature without the required index. The index will always be 0 for a single slider
+        if (len == 1 || (len <= 3 && typeof arguments[1] != 'number')) {
+            args.unshift(0);
+        }
+
+        return Ext.slider.SingleSlider.superclass.setValue.apply(this, args);
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        return Ext.slider.SingleSlider.superclass.syncThumb.apply(this, [0].concat(arguments));
+    },
+    
+    // private
+    getNearest : function(){
+        // Since there's only 1 thumb, it's always the nearest
+        return this.thumbs[0];    
+    }
+});
+
+//backwards compatibility
+Ext.Slider = Ext.slider.SingleSlider;
+
+Ext.reg('slider', Ext.slider.SingleSlider);
+
+// private class to support vertical sliders
+Ext.slider.Vertical = {
+    onResize : function(w, h){
+        this.innerEl.setHeight(h - (this.el.getPadding('t') + this.endEl.getPadding('b')));
+        this.syncThumb();
+    },
+
+    getRatio : function(){
+        var h = this.innerEl.getHeight(),
+            v = this.maxValue - this.minValue;
+        return h/v;
+    },
+
+    moveThumb: function(index, v, animate) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        if (!animate || this.animate === false) {
+            el.setBottom(v);
+        } else {
+            el.shift({bottom: v, stopFx: true, duration:.35});
+        }
+    },
+
+    onClickChange : function(local) {
+        if (local.left > this.clickRange[0] && local.left < this.clickRange[1]) {
+            var thumb = this.getNearest(local, 'top'),
+                index = thumb.index,
+                value = this.minValue + this.reverseValue(this.innerEl.getHeight() - local.top);
+
+            this.setValue(index, Ext.util.Format.round(value, this.decimalPrecision), undefined, true);
+        }
+    }
+};
+
+//private class to support vertical dragging of thumbs within a slider
+Ext.slider.Thumb.Vertical = {
+    getNewValue: function() {
+        var slider   = this.slider,
+            innerEl  = slider.innerEl,
+            pos      = innerEl.translatePoints(this.tracker.getXY()),
+            bottom   = innerEl.getHeight() - pos.top;
+
+        return slider.minValue + Ext.util.Format.round(bottom / slider.getRatio(), slider.decimalPrecision);
+    }
+};
+/**
+ * @class Ext.ProgressBar
+ * @extends Ext.BoxComponent
+ * <p>An updateable progress bar component.  The progress bar supports two different modes: manual and automatic.</p>
+ * <p>In manual mode, you are responsible for showing, updating (via {@link #updateProgress}) and clearing the
+ * progress bar as needed from your own code.  This method is most appropriate when you want to show progress
+ * throughout an operation that has predictable points of interest at which you can update the control.</p>
+ * <p>In automatic mode, you simply call {@link #wait} and let the progress bar run indefinitely, only clearing it
+ * once the operation is complete.  You can optionally have the progress bar wait for a specific amount of time
+ * and then clear itself.  Automatic mode is most appropriate for timed operations or asynchronous operations in
+ * which you have no need for indicating intermediate progress.</p>
+ * @cfg {Float} value A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+ * @cfg {String} text The progress bar text (defaults to '')
+ * @cfg {Mixed} textEl The element to render the progress text to (defaults to the progress
+ * bar's internal text element)
+ * @cfg {String} id The progress bar element's id (defaults to an auto-generated id)
+ * @xtype progress
+ */
+Ext.ProgressBar = Ext.extend(Ext.BoxComponent, {
+   /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to the progress bar's wrapper element (defaults to 'x-progress')
+    */
+    baseCls : 'x-progress',
+    
+    /**
+    * @cfg {Boolean} animate
+    * True to animate the progress bar during transitions (defaults to false)
+    */
+    animate : false,
+
+    // private
+    waitTimer : null,
+
+    // private
+    initComponent : function(){
+        Ext.ProgressBar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event update
+             * Fires after each update interval
+             * @param {Ext.ProgressBar} this
+             * @param {Number} The current progress value
+             * @param {String} The current progress text
+             */
+            "update"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        var tpl = new Ext.Template(
+            '<div class="{cls}-wrap">',
+                '<div class="{cls}-inner">',
+                    '<div class="{cls}-bar">',
+                        '<div class="{cls}-text">',
+                            '<div>&#160;</div>',
+                        '</div>',
+                    '</div>',
+                    '<div class="{cls}-text {cls}-text-back">',
+                        '<div>&#160;</div>',
+                    '</div>',
+                '</div>',
+            '</div>'
+        );
+
+        this.el = position ? tpl.insertBefore(position, {cls: this.baseCls}, true)
+            : tpl.append(ct, {cls: this.baseCls}, true);
+                
+        if(this.id){
+            this.el.dom.id = this.id;
+        }
+        var inner = this.el.dom.firstChild;
+        this.progressBar = Ext.get(inner.firstChild);
+
+        if(this.textEl){
+            //use an external text el
+            this.textEl = Ext.get(this.textEl);
+            delete this.textTopEl;
+        }else{
+            //setup our internal layered text els
+            this.textTopEl = Ext.get(this.progressBar.dom.firstChild);
+            var textBackEl = Ext.get(inner.childNodes[1]);
+            this.textTopEl.setStyle("z-index", 99).addClass('x-hidden');
+            this.textEl = new Ext.CompositeElement([this.textTopEl.dom.firstChild, textBackEl.dom.firstChild]);
+            this.textEl.setWidth(inner.offsetWidth);
+        }
+        this.progressBar.setHeight(inner.offsetHeight);
+    },
+    
+    // private
+    afterRender : function(){
+        Ext.ProgressBar.superclass.afterRender.call(this);
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }else{
+            this.updateText(this.text);
+        }
+    },
+
+    /**
+     * Updates the progress bar value, and optionally its text.  If the text argument is not specified,
+     * any existing text value will be unchanged.  To blank out existing text, pass ''.  Note that even
+     * if the progress bar value exceeds 1, it will never automatically reset -- you are responsible for
+     * determining when the progress is complete and calling {@link #reset} to clear and/or hide the control.
+     * @param {Float} value (optional) A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @param {Boolean} animate (optional) Whether to animate the transition of the progress bar. If this value is
+     * not specified, the default for the class is used (default to false)
+     * @return {Ext.ProgressBar} this
+     */
+    updateProgress : function(value, text, animate){
+        this.value = value || 0;
+        if(text){
+            this.updateText(text);
+        }
+        if(this.rendered && !this.isDestroyed){
+            var w = Math.floor(value*this.el.dom.firstChild.offsetWidth);
+            this.progressBar.setWidth(w, animate === true || (animate !== false && this.animate));
+            if(this.textTopEl){
+                //textTopEl should be the same width as the bar so overflow will clip as the bar moves
+                this.textTopEl.removeClass('x-hidden').setWidth(w);
+            }
+        }
+        this.fireEvent('update', this, value, text);
+        return this;
+    },
+
+    /**
+     * Initiates an auto-updating progress bar.  A duration can be specified, in which case the progress
+     * bar will automatically reset after a fixed amount of time and optionally call a callback function
+     * if specified.  If no duration is passed in, then the progress bar will run indefinitely and must
+     * be manually cleared by calling {@link #reset}.  The wait method accepts a config object with
+     * the following properties:
+     * <pre>
+Property   Type          Description
+---------- ------------  ----------------------------------------------------------------------
+duration   Number        The length of time in milliseconds that the progress bar should
+                         run before resetting itself (defaults to undefined, in which case it
+                         will run indefinitely until reset is called)
+interval   Number        The length of time in milliseconds between each progress update
+                         (defaults to 1000 ms)
+animate    Boolean       Whether to animate the transition of the progress bar. If this value is
+                         not specified, the default for the class is used.                                                   
+increment  Number        The number of progress update segments to display within the progress
+                         bar (defaults to 10).  If the bar reaches the end and is still
+                         updating, it will automatically wrap back to the beginning.
+text       String        Optional text to display in the progress bar element (defaults to '').
+fn         Function      A callback function to execute after the progress bar finishes auto-
+                         updating.  The function will be called with no arguments.  This function
+                         will be ignored if duration is not specified since in that case the
+                         progress bar can only be stopped programmatically, so any required function
+                         should be called by the same code after it resets the progress bar.
+scope      Object        The scope that is passed to the callback function (only applies when
+                         duration and fn are both passed).
+</pre>
+         *
+         * Example usage:
+         * <pre><code>
+var p = new Ext.ProgressBar({
+   renderTo: 'my-el'
+});
+
+//Wait for 5 seconds, then update the status el (progress bar will auto-reset)
+p.wait({
+   interval: 100, //bar will move fast!
+   duration: 5000,
+   increment: 15,
+   text: 'Updating...',
+   scope: this,
+   fn: function(){
+      Ext.fly('status').update('Done!');
+   }
+});
+
+//Or update indefinitely until some async action completes, then reset manually
+p.wait();
+myAction.on('complete', function(){
+    p.reset();
+    Ext.fly('status').update('Done!');
+});
+</code></pre>
+     * @param {Object} config (optional) Configuration options
+     * @return {Ext.ProgressBar} this
+     */
+    wait : function(o){
+        if(!this.waitTimer){
+            var scope = this;
+            o = o || {};
+            this.updateText(o.text);
+            this.waitTimer = Ext.TaskMgr.start({
+                run: function(i){
+                    var inc = o.increment || 10;
+                    i -= 1;
+                    this.updateProgress(((((i+inc)%inc)+1)*(100/inc))*0.01, null, o.animate);
+                },
+                interval: o.interval || 1000,
+                duration: o.duration,
+                onStop: function(){
+                    if(o.fn){
+                        o.fn.apply(o.scope || this);
+                    }
+                    this.reset();
+                },
+                scope: scope
+            });
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the progress bar is currently in a {@link #wait} operation
+     * @return {Boolean} True if waiting, else false
+     */
+    isWaiting : function(){
+        return this.waitTimer !== null;
+    },
+
+    /**
+     * Updates the progress bar text.  If specified, textEl will be updated, otherwise the progress
+     * bar itself will display the updated text.
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @return {Ext.ProgressBar} this
+     */
+    updateText : function(text){
+        this.text = text || '&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+        }
+        return this;
+    },
+    
+    /**
+     * Synchronizes the inner bar width to the proper proportion of the total componet width based
+     * on the current progress {@link #value}.  This will be called automatically when the ProgressBar
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the ProgressBar if necessary.
+     */
+    syncProgressBar : function(){
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the size of the progress bar.
+     * @param {Number} width The new width in pixels
+     * @param {Number} height The new height in pixels
+     * @return {Ext.ProgressBar} this
+     */
+    setSize : function(w, h){
+        Ext.ProgressBar.superclass.setSize.call(this, w, h);
+        if(this.textTopEl){
+            var inner = this.el.dom.firstChild;
+            this.textEl.setSize(inner.offsetWidth, inner.offsetHeight);
+        }
+        this.syncProgressBar();
+        return this;
+    },
+
+    /**
+     * Resets the progress bar value to 0 and text to empty string.  If hide = true, the progress
+     * bar will also be hidden (using the {@link #hideMode} property internally).
+     * @param {Boolean} hide (optional) True to hide the progress bar (defaults to false)
+     * @return {Ext.ProgressBar} this
+     */
+    reset : function(hide){
+        this.updateProgress(0);
+        if(this.textTopEl){
+            this.textTopEl.addClass('x-hidden');
+        }
+        this.clearTimer();
+        if(hide === true){
+            this.hide();
+        }
+        return this;
+    },
+    
+    // private
+    clearTimer : function(){
+        if(this.waitTimer){
+            this.waitTimer.onStop = null; //prevent recursion
+            Ext.TaskMgr.stop(this.waitTimer);
+            this.waitTimer = null;
+        }
+    },
+    
+    onDestroy: function(){
+        this.clearTimer();
+        if(this.rendered){
+            if(this.textEl.isComposite){
+                this.textEl.clear();
+            }
+            Ext.destroyMembers(this, 'textEl', 'progressBar', 'textTopEl');
+        }
+        Ext.ProgressBar.superclass.onDestroy.call(this);
+    }
+});
+Ext.reg('progress', Ext.ProgressBar);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.grid.GridPanel=Ext.extend(Ext.Panel,{autoExpandColumn:false,autoExpandMax:1000,autoExpandMin:50,columnLines:false,ddText:"{0} selected row{1}",deferRowRender:true,enableColumnHide:true,enableColumnMove:true,enableDragDrop:false,enableHdMenu:true,loadMask:false,minColumnWidth:25,stripeRows:false,trackMouseOver:true,stateEvents:["columnmove","columnresize","sortchange","groupchange"],view:null,bubbleEvents:[],rendered:false,viewReady:false,initComponent:function(){Ext.grid.GridPanel.superclass.initComponent.call(this);if(this.columnLines){this.cls=(this.cls||"")+" x-grid-with-col-lines"}this.autoScroll=false;this.autoWidth=false;if(Ext.isArray(this.columns)){this.colModel=new Ext.grid.ColumnModel(this.columns);delete this.columns}if(this.ds){this.store=this.ds;delete this.ds}if(this.cm){this.colModel=this.cm;delete this.cm}if(this.sm){this.selModel=this.sm;delete this.sm}this.store=Ext.StoreMgr.lookup(this.store);this.addEvents("click","dblclick","contextmenu","mousedown","mouseup","mouseover","mouseout","keypress","keydown","cellmousedown","rowmousedown","headermousedown","groupmousedown","rowbodymousedown","containermousedown","cellclick","celldblclick","rowclick","rowdblclick","headerclick","headerdblclick","groupclick","groupdblclick","containerclick","containerdblclick","rowbodyclick","rowbodydblclick","rowcontextmenu","cellcontextmenu","headercontextmenu","groupcontextmenu","containercontextmenu","rowbodycontextmenu","bodyscroll","columnresize","columnmove","sortchange","groupchange","reconfigure","viewready")},onRender:function(d,a){Ext.grid.GridPanel.superclass.onRender.apply(this,arguments);var e=this.getGridEl();this.el.addClass("x-grid-panel");this.mon(e,{scope:this,mousedown:this.onMouseDown,click:this.onClick,dblclick:this.onDblClick,contextmenu:this.onContextMenu});this.relayEvents(e,["mousedown","mouseup","mouseover","mouseout","keypress","keydown"]);var b=this.getView();b.init(this);b.render();this.getSelectionModel().init(this)},initEvents:function(){Ext.grid.GridPanel.superclass.initEvents.call(this);if(this.loadMask){this.loadMask=new Ext.LoadMask(this.bwrap,Ext.apply({store:this.store},this.loadMask))}},initStateEvents:function(){Ext.grid.GridPanel.superclass.initStateEvents.call(this);this.mon(this.colModel,"hiddenchange",this.saveState,this,{delay:100})},applyState:function(a){var j=this.colModel,f=a.columns,h=this.store,l,g,k;if(f){for(var d=0,e=f.length;d<e;d++){l=f[d];g=j.getColumnById(l.id);if(g){k=j.getIndexById(l.id);j.setState(k,{hidden:l.hidden,width:l.width,sortable:l.sortable});if(k!=d){j.moveColumn(k,d)}}}}if(h){l=a.sort;if(l){h[h.remoteSort?"setDefaultSort":"sort"](l.field,l.direction)}l=a.group;if(h.groupBy){if(l){h.groupBy(l)}else{h.clearGrouping()}}}var b=Ext.apply({},a);delete b.columns;delete b.sort;Ext.grid.GridPanel.superclass.applyState.call(this,b)},getState:function(){var f={columns:[]},b=this.store,e,a;for(var d=0,g;(g=this.colModel.config[d]);d++){f.columns[d]={id:g.id,width:g.width};if(g.hidden){f.columns[d].hidden=true}if(g.sortable){f.columns[d].sortable=true}}if(b){e=b.getSortState();if(e){f.sort=e}if(b.getGroupState){a=b.getGroupState();if(a){f.group=a}}}return f},afterRender:function(){Ext.grid.GridPanel.superclass.afterRender.call(this);var a=this.view;this.on("bodyresize",a.layout,a);a.layout(true);if(this.deferRowRender){if(!this.deferRowRenderTask){this.deferRowRenderTask=new Ext.util.DelayedTask(a.afterRender,this.view)}this.deferRowRenderTask.delay(10)}else{a.afterRender()}this.viewReady=true},reconfigure:function(a,b){var c=this.rendered;if(c){if(this.loadMask){this.loadMask.destroy();this.loadMask=new Ext.LoadMask(this.bwrap,Ext.apply({},{store:a},this.initialConfig.loadMask))}}if(this.view){this.view.initData(a,b)}this.store=a;this.colModel=b;if(c){this.view.refresh(true)}this.fireEvent("reconfigure",this,a,b)},onDestroy:function(){if(this.deferRowRenderTask&&this.deferRowRenderTask.cancel){this.deferRowRenderTask.cancel()}if(this.rendered){Ext.destroy(this.view,this.loadMask)}else{if(this.store&&this.store.autoDestroy){this.store.destroy()}}Ext.destroy(this.colModel,this.selModel);this.store=this.selModel=this.colModel=this.view=this.loadMask=null;Ext.grid.GridPanel.superclass.onDestroy.call(this)},processEvent:function(a,b){this.view.processEvent(a,b)},onClick:function(a){this.processEvent("click",a)},onMouseDown:function(a){this.processEvent("mousedown",a)},onContextMenu:function(b,a){this.processEvent("contextmenu",b)},onDblClick:function(a){this.processEvent("dblclick",a)},walkCells:function(j,c,b,e,i){var h=this.colModel,f=h.getColumnCount(),a=this.store,g=a.getCount(),d=true;if(b<0){if(c<0){j--;d=false}while(j>=0){if(!d){c=f-1}d=false;while(c>=0){if(e.call(i||this,j,c,h)===true){return[j,c]}c--}j--}}else{if(c>=f){j++;d=false}while(j<g){if(!d){c=0}d=false;while(c<f){if(e.call(i||this,j,c,h)===true){return[j,c]}c++}j++}}return null},getGridEl:function(){return this.body},stopEditing:Ext.emptyFn,getSelectionModel:function(){if(!this.selModel){this.selModel=new Ext.grid.RowSelectionModel(this.disableSelection?{selectRow:Ext.emptyFn}:null)}return this.selModel},getStore:function(){return this.store},getColumnModel:function(){return this.colModel},getView:function(){if(!this.view){this.view=new Ext.grid.GridView(this.viewConfig)}return this.view},getDragDropText:function(){var a=this.selModel.getCount();return String.format(this.ddText,a,a==1?"":"s")}});Ext.reg("grid",Ext.grid.GridPanel);Ext.grid.PivotGrid=Ext.extend(Ext.grid.GridPanel,{aggregator:"sum",renderer:undefined,initComponent:function(){Ext.grid.PivotGrid.superclass.initComponent.apply(this,arguments);this.initAxes();this.enableColumnResize=false;this.viewConfig=Ext.apply(this.viewConfig||{},{forceFit:true});this.colModel=new Ext.grid.ColumnModel({})},getAggregator:function(){if(typeof this.aggregator=="string"){return Ext.grid.PivotAggregatorMgr.types[this.aggregator]}else{return this.aggregator}},setAggregator:function(a){this.aggregator=a},setMeasure:function(a){this.measure=a},setLeftAxis:function(b,a){this.leftAxis=b;if(a){this.view.refresh()}},setTopAxis:function(b,a){this.topAxis=b;if(a){this.view.refresh()}},initAxes:function(){var a=Ext.grid.PivotAxis;if(!(this.leftAxis instanceof a)){this.setLeftAxis(new a({orientation:"vertical",dimensions:this.leftAxis||[],store:this.store}))}if(!(this.topAxis instanceof a)){this.setTopAxis(new a({orientation:"horizontal",dimensions:this.topAxis||[],store:this.store}))}},extractData:function(){var c=this.store.data.items,r=c.length,p=[],g,f,e,d;if(r==0){return[]}var h=this.leftAxis.getTuples(),n=h.length,l=this.topAxis.getTuples(),a=l.length,b=this.getAggregator();for(f=0;f<r;f++){g=c[f];for(e=0;e<n;e++){p[e]=p[e]||[];if(h[e].matcher(g)===true){for(d=0;d<a;d++){p[e][d]=p[e][d]||[];if(l[d].matcher(g)){p[e][d].push(g)}}}}}var m=p.length,o,q;for(f=0;f<m;f++){q=p[f];o=q.length;for(e=0;e<o;e++){p[f][e]=b(p[f][e],this.measure)}}return p},getView:function(){if(!this.view){this.view=new Ext.grid.PivotGridView(this.viewConfig)}return this.view}});Ext.reg("pivotgrid",Ext.grid.PivotGrid);Ext.grid.PivotAggregatorMgr=new Ext.AbstractManager();Ext.grid.PivotAggregatorMgr.registerType("sum",function(a,c){var e=a.length,d=0,b;for(b=0;b<e;b++){d+=a[b].get(c)}return d});Ext.grid.PivotAggregatorMgr.registerType("avg",function(a,c){var e=a.length,d=0,b;for(b=0;b<e;b++){d+=a[b].get(c)}return(d/e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("min",function(a,c){var e=[],d=a.length,b;for(b=0;b<d;b++){e.push(a[b].get(c))}return Math.min.apply(this,e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("max",function(a,c){var e=[],d=a.length,b;for(b=0;b<d;b++){e.push(a[b].get(c))}return Math.max.apply(this,e)||"n/a"});Ext.grid.PivotAggregatorMgr.registerType("count",function(a,b){return a.length});Ext.grid.GridView=Ext.extend(Ext.util.Observable,{deferEmptyText:true,scrollOffset:undefined,autoFill:false,forceFit:false,sortClasses:["sort-asc","sort-desc"],sortAscText:"Sort Ascending",sortDescText:"Sort Descending",columnsText:"Columns",selectedRowClass:"x-grid3-row-selected",borderWidth:2,tdClass:"x-grid3-cell",hdCls:"x-grid3-hd",markDirty:true,cellSelectorDepth:4,rowSelectorDepth:10,rowBodySelectorDepth:10,cellSelector:"td.x-grid3-cell",rowSelector:"div.x-grid3-row",rowBodySelector:"div.x-grid3-row-body",firstRowCls:"x-grid3-row-first",lastRowCls:"x-grid3-row-last",rowClsRe:/(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,headerMenuOpenCls:"x-grid3-hd-menu-open",rowOverCls:"x-grid3-row-over",constructor:function(a){Ext.apply(this,a);this.addEvents("beforerowremoved","beforerowsinserted","beforerefresh","rowremoved","rowsinserted","rowupdated","refresh");Ext.grid.GridView.superclass.constructor.call(this)},masterTpl:new Ext.Template('<div class="x-grid3" hidefocus="true">','<div class="x-grid3-viewport">','<div class="x-grid3-header">','<div class="x-grid3-header-inner">','<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',"</div>",'<div class="x-clear"></div>',"</div>",'<div class="x-grid3-scroller">','<div class="x-grid3-body" style="{bstyle}">{body}</div>','<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',"</div>","</div>",'<div class="x-grid3-resize-marker">&#160;</div>','<div class="x-grid3-resize-proxy">&#160;</div>',"</div>"),headerTpl:new Ext.Template('<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',"<thead>",'<tr class="x-grid3-hd-row">{cells}</tr>',"</thead>","</table>"),bodyTpl:new Ext.Template("{rows}"),cellTpl:new Ext.Template('<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>','<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',"</td>"),initTemplates:function(){var c=this.templates||{},d,b,f=new Ext.Template('<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">','<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">',this.grid.enableHdMenu?'<a class="x-grid3-hd-btn" href="#"></a>':"","{value}",'<img alt="" class="x-grid3-sort-icon" src="',Ext.BLANK_IMAGE_URL,'" />',"</div>","</td>"),a=['<tr class="x-grid3-row-body-tr" style="{bodyStyle}">','<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">','<div class="x-grid3-row-body">{body}</div>',"</td>","</tr>"].join(""),e=['<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',"<tbody>","<tr>{cells}</tr>",this.enableRowBody?a:"","</tbody>","</table>"].join("");Ext.applyIf(c,{hcell:f,cell:this.cellTpl,body:this.bodyTpl,header:this.headerTpl,master:this.masterTpl,row:new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">'+e+"</div>"),rowInner:new Ext.Template(e)});for(b in c){d=c[b];if(d&&Ext.isFunction(d.compile)&&!d.compiled){d.disableFormats=true;d.compile()}}this.templates=c;this.colRe=new RegExp("x-grid3-td-([^\\s]+)","")},fly:function(a){if(!this._flyweight){this._flyweight=new Ext.Element.Flyweight(document.body)}this._flyweight.dom=a;return this._flyweight},getEditorParent:function(){return this.scroller.dom},initElements:function(){var b=Ext.Element,d=Ext.get(this.grid.getGridEl().dom.firstChild),e=new b(d.child("div.x-grid3-viewport")),c=new b(e.child("div.x-grid3-header")),a=new b(e.child("div.x-grid3-scroller"));if(this.grid.hideHeaders){c.setDisplayed(false)}if(this.forceFit){a.setStyle("overflow-x","hidden")}Ext.apply(this,{el:d,mainWrap:e,scroller:a,mainHd:c,innerHd:c.child("div.x-grid3-header-inner").dom,mainBody:new b(b.fly(a).child("div.x-grid3-body")),focusEl:new b(b.fly(a).child("a")),resizeMarker:new b(d.child("div.x-grid3-resize-marker")),resizeProxy:new b(d.child("div.x-grid3-resize-proxy"))});this.focusEl.swallowEvent("click",true)},getRows:function(){return this.hasRows()?this.mainBody.dom.childNodes:[]},findCell:function(a){if(!a){return false}return this.fly(a).findParent(this.cellSelector,this.cellSelectorDepth)},findCellIndex:function(d,c){var b=this.findCell(d),a;if(b){a=this.fly(b).hasClass(c);if(!c||a){return this.getCellIndex(b)}}return false},getCellIndex:function(b){if(b){var a=b.className.match(this.colRe);if(a&&a[1]){return this.cm.getIndexById(a[1])}}return false},findHeaderCell:function(b){var a=this.findCell(b);return a&&this.fly(a).hasClass(this.hdCls)?a:null},findHeaderIndex:function(a){return this.findCellIndex(a,this.hdCls)},findRow:function(a){if(!a){return false}return this.fly(a).findParent(this.rowSelector,this.rowSelectorDepth)},findRowIndex:function(a){var b=this.findRow(a);return b?b.rowIndex:false},findRowBody:function(a){if(!a){return false}return this.fly(a).findParent(this.rowBodySelector,this.rowBodySelectorDepth)},getRow:function(a){return this.getRows()[a]},getCell:function(b,a){return Ext.fly(this.getRow(b)).query(this.cellSelector)[a]},getHeaderCell:function(a){return this.mainHd.dom.getElementsByTagName("td")[a]},addRowClass:function(b,a){var c=this.getRow(b);if(c){this.fly(c).addClass(a)}},removeRowClass:function(c,a){var b=this.getRow(c);if(b){this.fly(b).removeClass(a)}},removeRow:function(a){Ext.removeNode(this.getRow(a));this.syncFocusEl(a)},removeRows:function(c,a){var b=this.mainBody.dom,d;for(d=c;d<=a;d++){Ext.removeNode(b.childNodes[c])}this.syncFocusEl(c)},getScrollState:function(){var a=this.scroller.dom;return{left:a.scrollLeft,top:a.scrollTop}},restoreScroll:function(a){var b=this.scroller.dom;b.scrollLeft=a.left;b.scrollTop=a.top},scrollToTop:function(){var a=this.scroller.dom;a.scrollTop=0;a.scrollLeft=0},syncScroll:function(){this.syncHeaderScroll();var a=this.scroller.dom;this.grid.fireEvent("bodyscroll",a.scrollLeft,a.scrollTop)},syncHeaderScroll:function(){var a=this.innerHd,b=this.scroller.dom.scrollLeft;a.scrollLeft=b;a.scrollLeft=b},updateSortIcon:function(d,c){var a=this.sortClasses,b=a[c=="DESC"?1:0],e=this.mainHd.select("td").removeClass(a);e.item(d).addClass(b)},updateAllColumnWidths:function(){var e=this.getTotalWidth(),h=this.cm.getColumnCount(),l=this.getRows(),f=l.length,b=[],k,a,g,d,c;for(d=0;d<h;d++){b[d]=this.getColumnWidth(d);this.getHeaderCell(d).style.width=b[d]}this.updateHeaderWidth();for(d=0;d<f;d++){k=l[d];k.style.width=e;a=k.firstChild;if(a){a.style.width=e;g=a.rows[0];for(c=0;c<h;c++){g.childNodes[c].style.width=b[c]}}}this.onAllColumnWidthsUpdated(b,e)},updateColumnWidth:function(d,b){var c=this.getColumnWidth(d),h=this.getTotalWidth(),g=this.getHeaderCell(d),a=this.getRows(),e=a.length,k,f,j;this.updateHeaderWidth();g.style.width=c;for(f=0;f<e;f++){k=a[f];j=k.firstChild;k.style.width=h;if(j){j.style.width=h;j.rows[0].childNodes[d].style.width=c}}this.onColumnWidthUpdated(d,c,h)},updateColumnHidden:function(b,h){var g=this.getTotalWidth(),j=h?"none":"",f=this.getHeaderCell(b),a=this.getRows(),d=a.length,k,c,e;this.updateHeaderWidth();f.style.display=j;for(e=0;e<d;e++){k=a[e];k.style.width=g;c=k.firstChild;if(c){c.style.width=g;c.rows[0].childNodes[b].style.display=j}}this.onColumnHiddenUpdated(b,h,g);delete this.lastViewWidth;this.layout()},doRender:function(d,u,l,a,q,s){var g=this.templates,c=g.cell,x=g.row,n=q-1,b="width:"+this.getTotalWidth()+";",h=[],k=[],m={tstyle:b},p={},v=u.length,w,f,e,t,r,o;for(r=0;r<v;r++){e=u[r];k=[];o=r+a;for(t=0;t<q;t++){f=d[t];p.id=f.id;p.css=t===0?"x-grid3-cell-first ":(t==n?"x-grid3-cell-last ":"");p.attr=p.cellAttr="";p.style=f.style;p.value=f.renderer.call(f.scope,e.data[f.name],p,e,o,t,l);if(Ext.isEmpty(p.value)){p.value="&#160;"}if(this.markDirty&&e.dirty&&typeof e.modified[f.name]!="undefined"){p.css+=" x-grid3-dirty-cell"}k[k.length]=c.apply(p)}w=[];if(s&&((o+1)%2===0)){w[0]="x-grid3-row-alt"}if(e.dirty){w[1]=" x-grid3-dirty-row"}m.cols=q;if(this.getRowClass){w[2]=this.getRowClass(e,o,m,l)}m.alt=w.join(" ");m.cells=k.join("");h[h.length]=x.apply(m)}return h.join("")},processRows:function(a,f){if(!this.ds||this.ds.getCount()<1){return}var d=this.getRows(),c=d.length,e,b;f=f||!this.grid.stripeRows;a=a||0;for(b=0;b<c;b++){e=d[b];if(e){e.rowIndex=b;if(!f){e.className=e.className.replace(this.rowClsRe," ");if((b+1)%2===0){e.className+=" x-grid3-row-alt"}}}}if(a===0){Ext.fly(d[0]).addClass(this.firstRowCls)}Ext.fly(d[c-1]).addClass(this.lastRowCls)},afterRender:function(){if(!this.ds||!this.cm){return}this.mainBody.dom.innerHTML=this.renderBody()||"&#160;";this.processRows(0,true);if(this.deferEmptyText!==true){this.applyEmptyText()}this.grid.fireEvent("viewready",this.grid)},afterRenderUI:function(){var a=this.grid;this.initElements();Ext.fly(this.innerHd).on("click",this.handleHdDown,this);this.mainHd.on({scope:this,mouseover:this.handleHdOver,mouseout:this.handleHdOut,mousemove:this.handleHdMove});this.scroller.on("scroll",this.syncScroll,this);if(a.enableColumnResize!==false){this.splitZone=new Ext.grid.GridView.SplitDragZone(a,this.mainHd.dom)}if(a.enableColumnMove){this.columnDrag=new Ext.grid.GridView.ColumnDragZone(a,this.innerHd);this.columnDrop=new Ext.grid.HeaderDropZone(a,this.mainHd.dom)}if(a.enableHdMenu!==false){this.hmenu=new Ext.menu.Menu({id:a.id+"-hctx"});this.hmenu.add({itemId:"asc",text:this.sortAscText,cls:"xg-hmenu-sort-asc"},{itemId:"desc",text:this.sortDescText,cls:"xg-hmenu-sort-desc"});if(a.enableColumnHide!==false){this.colMenu=new Ext.menu.Menu({id:a.id+"-hcols-menu"});this.colMenu.on({scope:this,beforeshow:this.beforeColMenuShow,itemclick:this.handleHdMenuClick});this.hmenu.add("-",{itemId:"columns",hideOnClick:false,text:this.columnsText,menu:this.colMenu,iconCls:"x-cols-icon"})}this.hmenu.on("itemclick",this.handleHdMenuClick,this)}if(a.trackMouseOver){this.mainBody.on({scope:this,mouseover:this.onRowOver,mouseout:this.onRowOut})}if(a.enableDragDrop||a.enableDrag){this.dragZone=new Ext.grid.GridDragZone(a,{ddGroup:a.ddGroup||"GridDD"})}this.updateHeaderSortState()},renderUI:function(){var a=this.templates;return a.master.apply({body:a.body.apply({rows:"&#160;"}),header:this.renderHeaders(),ostyle:"width:"+this.getOffsetWidth()+";",bstyle:"width:"+this.getTotalWidth()+";"})},processEvent:function(b,g){var h=g.getTarget(),a=this.grid,d=this.findHeaderIndex(h),j,i,c,f;a.fireEvent(b,g);if(d!==false){a.fireEvent("header"+b,a,d,g)}else{j=this.findRowIndex(h);if(j!==false){i=this.findCellIndex(h);if(i!==false){c=a.colModel.getColumnAt(i);if(a.fireEvent("cell"+b,a,j,i,g)!==false){if(!c||(c.processEvent&&(c.processEvent(b,g,a,j,i)!==false))){a.fireEvent("row"+b,a,j,g)}}}else{if(a.fireEvent("row"+b,a,j,g)!==false){(f=this.findRowBody(h))&&a.fireEvent("rowbody"+b,a,j,g)}}}else{a.fireEvent("container"+b,a,g)}}},layout:function(i){if(!this.mainBody){return}var a=this.grid,d=a.getGridEl(),c=d.getSize(true),h=c.width,b=c.height,g=this.scroller,f,e,j;if(h<20||b<20){return}if(a.autoHeight){f=g.dom.style;f.overflow="visible";if(Ext.isWebKit){f.position="static"}}else{this.el.setSize(h,b);e=this.mainHd.getHeight();j=b-e;g.setSize(h,j);if(this.innerHd){this.innerHd.style.width=(h)+"px"}}if(this.forceFit||(i===true&&this.autoFill)){if(this.lastViewWidth!=h){this.fitColumns(false,false);this.lastViewWidth=h}}else{this.autoExpand();this.syncHeaderScroll()}this.onLayout(h,j)},onLayout:function(a,b){},onColumnWidthUpdated:function(c,a,b){},onAllColumnWidthsUpdated:function(a,b){},onColumnHiddenUpdated:function(b,c,a){},updateColumnText:function(a,b){},afterMove:function(a){},init:function(a){this.grid=a;this.initTemplates();this.initData(a.store,a.colModel);this.initUI(a)},getColumnId:function(a){return this.cm.getColumnId(a)},getOffsetWidth:function(){return(this.cm.getTotalWidth()+this.getScrollOffset())+"px"},getScrollOffset:function(){return Ext.num(this.scrollOffset,Ext.getScrollBarWidth())},renderHeaders:function(){var e=this.cm,f=this.templates,a=f.hcell,d={},g=e.getColumnCount(),h=g-1,j=[],c,b;for(c=0;c<g;c++){if(c==0){b="x-grid3-cell-first "}else{b=c==h?"x-grid3-cell-last ":""}d={id:e.getColumnId(c),value:e.getColumnHeader(c)||"",style:this.getColumnStyle(c,true),css:b,tooltip:this.getColumnTooltip(c)};if(e.config[c].align=="right"){d.istyle="padding-right: 16px;"}else{delete d.istyle}j[c]=a.apply(d)}return f.header.apply({cells:j.join(""),tstyle:String.format("width: {0};",this.getTotalWidth())})},getColumnTooltip:function(a){var b=this.cm.getColumnTooltip(a);if(b){if(Ext.QuickTips.isEnabled()){return'ext:qtip="'+b+'"'}else{return'title="'+b+'"'}}return""},beforeUpdate:function(){this.grid.stopEditing(true)},updateHeaders:function(){this.innerHd.firstChild.innerHTML=this.renderHeaders();this.updateHeaderWidth(false)},updateHeaderWidth:function(c){var b=this.innerHd.firstChild,a=this.getTotalWidth();b.style.width=this.getOffsetWidth();b.firstChild.style.width=a;if(c!==false){this.mainBody.dom.style.width=a}},focusRow:function(a){this.focusCell(a,0,false)},focusCell:function(d,b,c){this.syncFocusEl(this.ensureVisible(d,b,c));var a=this.focusEl;if(Ext.isGecko){a.focus()}else{a.focus.defer(1,a)}},resolveCell:function(g,d,f){if(!Ext.isNumber(g)){g=g.rowIndex}if(!this.ds){return null}if(g<0||g>=this.ds.getCount()){return null}d=(d!==undefined?d:0);var c=this.getRow(g),b=this.cm,e=b.getColumnCount(),a;if(!(f===false&&d===0)){while(d<e&&b.isHidden(d)){d++}a=this.getCell(g,d)}return{row:c,cell:a}},getResolvedXY:function(b){if(!b){return null}var a=b.cell,c=b.row;if(a){return Ext.fly(a).getXY()}else{return[this.el.getX(),Ext.fly(c).getY()]}},syncFocusEl:function(d,a,c){var b=d;if(!Ext.isArray(b)){d=Math.min(d,Math.max(0,this.getRows().length-1));if(isNaN(d)){return}b=this.getResolvedXY(this.resolveCell(d,a,c))}this.focusEl.setXY(b||this.scroller.getXY())},ensureVisible:function(s,f,e){var q=this.resolveCell(s,f,e);if(!q||!q.row){return null}var j=q.row,g=q.cell,m=this.scroller.dom,d=j,r=0,n=this.el.dom;while(d&&d!=n){r+=d.offsetTop;d=d.offsetParent}r-=this.mainHd.dom.offsetHeight;n=parseInt(m.scrollTop,10);var o=r+j.offsetHeight,a=m.clientHeight,l=n+a;if(r<n){m.scrollTop=r}else{if(o>l){m.scrollTop=o-a}}if(e!==false){var k=parseInt(g.offsetLeft,10),i=k+g.offsetWidth,h=parseInt(m.scrollLeft,10),b=h+m.clientWidth;if(k<h){m.scrollLeft=k}else{if(i>b){m.scrollLeft=i-m.clientWidth}}}return this.getResolvedXY(q)},insertRows:function(a,h,e,g){var d=a.getCount()-1;if(!g&&h===0&&e>=d){this.fireEvent("beforerowsinserted",this,h,e);this.refresh();this.fireEvent("rowsinserted",this,h,e)}else{if(!g){this.fireEvent("beforerowsinserted",this,h,e)}var b=this.renderRows(h,e),f=this.getRow(h);if(f){if(h===0){Ext.fly(this.getRow(0)).removeClass(this.firstRowCls)}Ext.DomHelper.insertHtml("beforeBegin",f,b)}else{var c=this.getRow(d-1);if(c){Ext.fly(c).removeClass(this.lastRowCls)}Ext.DomHelper.insertHtml("beforeEnd",this.mainBody.dom,b)}if(!g){this.processRows(h);this.fireEvent("rowsinserted",this,h,e)}else{if(h===0||h>=d){Ext.fly(this.getRow(h)).addClass(h===0?this.firstRowCls:this.lastRowCls)}}}this.syncFocusEl(h)},deleteRows:function(a,c,b){if(a.getRowCount()<1){this.refresh()}else{this.fireEvent("beforerowsdeleted",this,c,b);this.removeRows(c,b);this.processRows(c);this.fireEvent("rowsdeleted",this,c,b)}},getColumnStyle:function(b,d){var a=this.cm,f=a.config,c=d?"":f[b].css||"",e=f[b].align;c+=String.format("width: {0};",this.getColumnWidth(b));if(a.isHidden(b)){c+="display: none; "}if(e){c+=String.format("text-align: {0};",e)}return c},getColumnWidth:function(b){var c=this.cm.getColumnWidth(b),a=this.borderWidth;if(Ext.isNumber(c)){if(Ext.isBorderBox||(Ext.isWebKit&&!Ext.isSafari2)){return c+"px"}else{return Math.max(c-a,0)+"px"}}else{return c}},getTotalWidth:function(){return this.cm.getTotalWidth()+"px"},fitColumns:function(f,h,g){var a=this.grid,k=this.cm,r=k.getTotalWidth(false),p=this.getGridInnerWidth(),q=p-r,c=[],n=0,m=0,t,d,o;if(p<20||q===0){return false}var e=k.getColumnCount(true),l=k.getColumnCount(false),b=e-(Ext.isNumber(g)?1:0);if(b===0){b=1;g=undefined}for(o=0;o<l;o++){if(!k.isFixed(o)&&o!==g){t=k.getColumnWidth(o);c.push(o,t);if(!k.isHidden(o)){n=o;m+=t}}}d=(p-k.getTotalWidth())/m;while(c.length){t=c.pop();o=c.pop();k.setColumnWidth(o,Math.max(a.minColumnWidth,Math.floor(t+t*d)),true)}r=k.getTotalWidth(false);if(r>p){var s=(b==e)?n:g,j=Math.max(1,k.getColumnWidth(s)-(r-p));k.setColumnWidth(s,j,true)}if(f!==true){this.updateAllColumnWidths()}return true},autoExpand:function(j){var a=this.grid,h=this.cm,e=this.getGridInnerWidth(),c=h.getTotalWidth(false),f=a.autoExpandColumn;if(!this.userResized&&f){if(e!=c){var i=h.getIndexById(f),b=h.getColumnWidth(i),g=e-c+b,d=Math.min(Math.max(g,a.autoExpandMin),a.autoExpandMax);if(b!=d){h.setColumnWidth(i,d,true);if(j!==true){this.updateColumnWidth(i,d)}}}}},getGridInnerWidth:function(){return this.grid.getGridEl().getWidth(true)-this.getScrollOffset()},getColumnData:function(){var e=[],c=this.cm,f=c.getColumnCount(),a=this.ds.fields,d,b;for(d=0;d<f;d++){b=c.getDataIndex(d);e[d]={name:Ext.isDefined(b)?b:(a.get(d)?a.get(d).name:undefined),renderer:c.getRenderer(d),scope:c.getRendererScope(d),id:c.getColumnId(d),style:this.getColumnStyle(d)}}return e},renderRows:function(h,c){var a=this.grid,f=a.store,i=a.stripeRows,e=a.colModel,g=e.getColumnCount(),d=f.getCount(),b;if(d<1){return""}h=h||0;c=Ext.isDefined(c)?c:d-1;b=f.getRange(h,c);return this.doRender(this.getColumnData(),b,f,h,g,i)},renderBody:function(){var a=this.renderRows()||"&#160;";return this.templates.body.apply({rows:a})},refreshRow:function(f){var k=this.ds,l=this.cm.getColumnCount(),c=this.getColumnData(),m=l-1,o=["x-grid3-row"],e={tstyle:String.format("width: {0};",this.getTotalWidth())},a=[],j=this.templates.cell,h,p,b,n,g,d;if(Ext.isNumber(f)){h=f;f=k.getAt(h)}else{h=k.indexOf(f)}if(!f||h<0){return}for(d=0;d<l;d++){b=c[d];if(d==0){g="x-grid3-cell-first"}else{g=(d==m)?"x-grid3-cell-last ":""}n={id:b.id,style:b.style,css:g,attr:"",cellAttr:""};n.value=b.renderer.call(b.scope,f.data[b.name],n,f,h,d,k);if(Ext.isEmpty(n.value)){n.value="&#160;"}if(this.markDirty&&f.dirty&&typeof f.modified[b.name]!="undefined"){n.css+=" x-grid3-dirty-cell"}a[d]=j.apply(n)}p=this.getRow(h);p.className="";if(this.grid.stripeRows&&((h+1)%2===0)){o.push("x-grid3-row-alt")}if(this.getRowClass){e.cols=l;o.push(this.getRowClass(f,h,e,k))}this.fly(p).addClass(o).setStyle(e.tstyle);e.cells=a.join("");p.innerHTML=this.templates.rowInner.apply(e);this.fireEvent("rowupdated",this,h,f)},refresh:function(b){this.fireEvent("beforerefresh",this);this.grid.stopEditing(true);var a=this.renderBody();this.mainBody.update(a).setWidth(this.getTotalWidth());if(b===true){this.updateHeaders();this.updateHeaderSortState()}this.processRows(0,true);this.layout();this.applyEmptyText();this.fireEvent("refresh",this)},applyEmptyText:function(){if(this.emptyText&&!this.hasRows()){this.mainBody.update('<div class="x-grid-empty">'+this.emptyText+"</div>")}},updateHeaderSortState:function(){var b=this.ds.getSortState();if(!b){return}if(!this.sortState||(this.sortState.field!=b.field||this.sortState.direction!=b.direction)){this.grid.fireEvent("sortchange",this.grid,b)}this.sortState=b;var c=this.cm.findColumnIndex(b.field);if(c!=-1){var a=b.direction;this.updateSortIcon(c,a)}},clearHeaderSortState:function(){if(!this.sortState){return}this.grid.fireEvent("sortchange",this.grid,null);this.mainHd.select("td").removeClass(this.sortClasses);delete this.sortState},destroy:function(){var i=this,a=i.grid,d=a.getGridEl(),h=i.dragZone,f=i.splitZone,g=i.columnDrag,e=i.columnDrop,j=i.scrollToTopTask,c,b;if(j&&j.cancel){j.cancel()}Ext.destroyMembers(i,"colMenu","hmenu");i.initData(null,null);i.purgeListeners();Ext.fly(i.innerHd).un("click",i.handleHdDown,i);if(a.enableColumnMove){c=g.dragData;b=g.proxy;Ext.destroy(g.el,b.ghost,b.el,e.el,e.proxyTop,e.proxyBottom,c.ddel,c.header);if(b.anim){Ext.destroy(b.anim)}delete b.ghost;delete c.ddel;delete c.header;g.destroy();delete Ext.dd.DDM.locationCache[g.id];delete g._domRef;delete e.proxyTop;delete e.proxyBottom;e.destroy();delete Ext.dd.DDM.locationCache["gridHeader"+d.id];delete e._domRef;delete Ext.dd.DDM.ids[e.ddGroup]}if(f){f.destroy();delete f._domRef;delete Ext.dd.DDM.ids["gridSplitters"+d.id]}Ext.fly(i.innerHd).removeAllListeners();Ext.removeNode(i.innerHd);delete i.innerHd;Ext.destroy(i.el,i.mainWrap,i.mainHd,i.scroller,i.mainBody,i.focusEl,i.resizeMarker,i.resizeProxy,i.activeHdBtn,i._flyweight,h,f);delete a.container;if(h){h.destroy()}Ext.dd.DDM.currentTarget=null;delete Ext.dd.DDM.locationCache[d.id];Ext.EventManager.removeResizeListener(i.onWindowResize,i)},onDenyColumnHide:function(){},render:function(){if(this.autoFill){var a=this.grid.ownerCt;if(a&&a.getLayout()){a.on("afterlayout",function(){this.fitColumns(true,true);this.updateHeaders();this.updateHeaderSortState()},this,{single:true})}}else{if(this.forceFit){this.fitColumns(true,false)}else{if(this.grid.autoExpandColumn){this.autoExpand(true)}}}this.grid.getGridEl().dom.innerHTML=this.renderUI();this.afterRenderUI()},initData:function(a,e){var b=this;if(b.ds){var d=b.ds;d.un("add",b.onAdd,b);d.un("load",b.onLoad,b);d.un("clear",b.onClear,b);d.un("remove",b.onRemove,b);d.un("update",b.onUpdate,b);d.un("datachanged",b.onDataChange,b);if(d!==a&&d.autoDestroy){d.destroy()}}if(a){a.on({scope:b,load:b.onLoad,add:b.onAdd,remove:b.onRemove,update:b.onUpdate,clear:b.onClear,datachanged:b.onDataChange})}if(b.cm){var c=b.cm;c.un("configchange",b.onColConfigChange,b);c.un("widthchange",b.onColWidthChange,b);c.un("headerchange",b.onHeaderChange,b);c.un("hiddenchange",b.onHiddenChange,b);c.un("columnmoved",b.onColumnMove,b)}if(e){delete b.lastViewWidth;e.on({scope:b,configchange:b.onColConfigChange,widthchange:b.onColWidthChange,headerchange:b.onHeaderChange,hiddenchange:b.onHiddenChange,columnmoved:b.onColumnMove})}b.ds=a;b.cm=e},onDataChange:function(){this.refresh(true);this.updateHeaderSortState();this.syncFocusEl(0)},onClear:function(){this.refresh();this.syncFocusEl(0)},onUpdate:function(b,a){this.refreshRow(a)},onAdd:function(b,a,c){this.insertRows(b,c,c+(a.length-1))},onRemove:function(b,a,c,d){if(d!==true){this.fireEvent("beforerowremoved",this,c,a)}this.removeRow(c);if(d!==true){this.processRows(c);this.applyEmptyText();this.fireEvent("rowremoved",this,c,a)}},onLoad:function(){if(Ext.isGecko){if(!this.scrollToTopTask){this.scrollToTopTask=new Ext.util.DelayedTask(this.scrollToTop,this)}this.scrollToTopTask.delay(1)}else{this.scrollToTop()}},onColWidthChange:function(a,b,c){this.updateColumnWidth(b,c)},onHeaderChange:function(a,b,c){this.updateHeaders()},onHiddenChange:function(a,b,c){this.updateColumnHidden(b,c)},onColumnMove:function(a,c,b){this.indexMap=null;this.refresh(true);this.restoreScroll(this.getScrollState());this.afterMove(b);this.grid.fireEvent("columnmove",c,b)},onColConfigChange:function(){delete this.lastViewWidth;this.indexMap=null;this.refresh(true)},initUI:function(a){a.on("headerclick",this.onHeaderClick,this)},initEvents:Ext.emptyFn,onHeaderClick:function(b,a){if(this.headersDisabled||!this.cm.isSortable(a)){return}b.stopEditing(true);b.store.sort(this.cm.getDataIndex(a))},onRowOver:function(b,a){var c=this.findRowIndex(a);if(c!==false){this.addRowClass(c,this.rowOverCls)}},onRowOut:function(b,a){var c=this.findRowIndex(a);if(c!==false&&!b.within(this.getRow(c),true)){this.removeRowClass(c,this.rowOverCls)}},onRowSelect:function(a){this.addRowClass(a,this.selectedRowClass)},onRowDeselect:function(a){this.removeRowClass(a,this.selectedRowClass)},onCellSelect:function(c,b){var a=this.getCell(c,b);if(a){this.fly(a).addClass("x-grid3-cell-selected")}},onCellDeselect:function(c,b){var a=this.getCell(c,b);if(a){this.fly(a).removeClass("x-grid3-cell-selected")}},handleWheel:function(a){a.stopPropagation()},onColumnSplitterMoved:function(a,b){this.userResized=true;this.grid.colModel.setColumnWidth(a,b,true);if(this.forceFit){this.fitColumns(true,false,a);this.updateAllColumnWidths()}else{this.updateColumnWidth(a,b);this.syncHeaderScroll()}this.grid.fireEvent("columnresize",a,b)},beforeColMenuShow:function(){var b=this.cm,d=b.getColumnCount(),a=this.colMenu,c;a.removeAll();for(c=0;c<d;c++){if(b.config[c].hideable!==false){a.add(new Ext.menu.CheckItem({text:b.getColumnHeader(c),itemId:"col-"+b.getColumnId(c),checked:!b.isHidden(c),disabled:b.config[c].hideable===false,hideOnClick:false}))}}},handleHdMenuClick:function(c){var a=this.ds,b=this.cm.getDataIndex(this.hdCtxIndex);switch(c.getItemId()){case"asc":a.sort(b,"ASC");break;case"desc":a.sort(b,"DESC");break;default:this.handleHdMenuClickDefault(c)}return true},handleHdMenuClickDefault:function(c){var b=this.cm,d=c.getItemId(),a=b.getIndexById(d.substr(4));if(a!=-1){if(c.checked&&b.getColumnsBy(this.isHideableColumn,this).length<=1){this.onDenyColumnHide();return}b.setHidden(a,c.checked)}},handleHdDown:function(h,i){if(Ext.fly(i).hasClass("x-grid3-hd-btn")){h.stopEvent();var j=this.cm,f=this.findHeaderCell(i),g=this.getCellIndex(f),d=j.isSortable(g),c=this.hmenu,b=c.items,a=this.headerMenuOpenCls;this.hdCtxIndex=g;Ext.fly(f).addClass(a);b.get("asc").setDisabled(!d);b.get("desc").setDisabled(!d);c.on("hide",function(){Ext.fly(f).removeClass(a)},this,{single:true});c.show(i,"tl-bl?")}},handleHdMove:function(j){var h=this.findHeaderCell(this.activeHdRef);if(h&&!this.headersDisabled){var k=this.splitHandleWidth||5,i=this.activeHdRegion,o=h.style,l=this.cm,n="",f=j.getPageX();if(this.grid.enableColumnResize!==false){var a=this.activeHdIndex,b=this.getPreviousVisible(a),m=l.isResizable(a),c=b&&l.isResizable(b),d=f-i.left<=k,g=i.right-f<=(!this.activeHdBtn?k:2);if(d&&c){n=Ext.isAir?"move":Ext.isWebKit?"e-resize":"col-resize"}else{if(g&&m){n=Ext.isAir?"move":Ext.isWebKit?"w-resize":"col-resize"}}}o.cursor=n}},getPreviousVisible:function(a){while(a>0){if(!this.cm.isHidden(a-1)){return a}a--}return undefined},handleHdOver:function(c,b){var d=this.findHeaderCell(b);if(d&&!this.headersDisabled){var a=this.fly(d);this.activeHdRef=b;this.activeHdIndex=this.getCellIndex(d);this.activeHdRegion=a.getRegion();if(!this.isMenuDisabled(this.activeHdIndex,a)){a.addClass("x-grid3-hd-over");this.activeHdBtn=a.child(".x-grid3-hd-btn");if(this.activeHdBtn){this.activeHdBtn.dom.style.height=(d.firstChild.offsetHeight-1)+"px"}}}},handleHdOut:function(b,a){var c=this.findHeaderCell(a);if(c&&(!Ext.isIE||!b.within(c,true))){this.activeHdRef=null;this.fly(c).removeClass("x-grid3-hd-over");c.style.cursor=""}},isMenuDisabled:function(a,b){return this.cm.isMenuDisabled(a)},hasRows:function(){var a=this.mainBody.dom.firstChild;return a&&a.nodeType==1&&a.className!="x-grid-empty"},isHideableColumn:function(a){return !a.hidden},bind:function(a,b){this.initData(a,b)}});Ext.grid.GridView.SplitDragZone=Ext.extend(Ext.dd.DDProxy,{constructor:function(a,b){this.grid=a;this.view=a.getView();this.marker=this.view.resizeMarker;this.proxy=this.view.resizeProxy;Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this,b,"gridSplitters"+this.grid.getGridEl().id,{dragElId:Ext.id(this.proxy.dom),resizeFrame:false});this.scroll=false;this.hw=this.view.splitHandleWidth||5},b4StartDrag:function(a,e){this.dragHeadersDisabled=this.view.headersDisabled;this.view.headersDisabled=true;var d=this.view.mainWrap.getHeight();this.marker.setHeight(d);this.marker.show();this.marker.alignTo(this.view.getHeaderCell(this.cellIndex),"tl-tl",[-2,0]);this.proxy.setHeight(d);var b=this.cm.getColumnWidth(this.cellIndex),c=Math.max(b-this.grid.minColumnWidth,0);this.resetConstraints();this.setXConstraint(c,1000);this.setYConstraint(0,0);this.minX=a-c;this.maxX=a+1000;this.startPos=a;Ext.dd.DDProxy.prototype.b4StartDrag.call(this,a,e)},allowHeaderDrag:function(a){return true},handleMouseDown:function(a){var g=this.view.findHeaderCell(a.getTarget());if(g&&this.allowHeaderDrag(a)){var j=this.view.fly(g).getXY(),c=j[0],h=a.getXY(),b=h[0],f=g.offsetWidth,d=false;if((b-c)<=this.hw){d=-1}else{if((c+f)-b<=this.hw){d=0}}if(d!==false){this.cm=this.grid.colModel;var i=this.view.getCellIndex(g);if(d==-1){if(i+d<0){return}while(this.cm.isHidden(i+d)){--d;if(i+d<0){return}}}this.cellIndex=i+d;this.split=g.dom;if(this.cm.isResizable(this.cellIndex)&&!this.cm.isFixed(this.cellIndex)){Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this,arguments)}}else{if(this.view.columnDrag){this.view.columnDrag.callHandleMouseDown(a)}}}},endDrag:function(f){this.marker.hide();var a=this.view,c=Math.max(this.minX,f.getPageX()),d=c-this.startPos,b=this.dragHeadersDisabled;a.onColumnSplitterMoved(this.cellIndex,this.cm.getColumnWidth(this.cellIndex)+d);setTimeout(function(){a.headersDisabled=b},50)},autoOffset:function(){this.setDelta(0,0)}});Ext.grid.PivotGridView=Ext.extend(Ext.grid.GridView,{colHeaderCellCls:"grid-hd-group-cell",title:"",getColumnHeaders:function(){return this.grid.topAxis.buildHeaders()},getRowHeaders:function(){return this.grid.leftAxis.buildHeaders()},renderRows:function(a,s){var b=this.grid,n=b.extractData(),o=n.length,f=this.templates,r=b.renderer,g=typeof r=="function",v=this.getCellCls,m=typeof v=="function",d=f.cell,w=f.row,h=[],p={},c="width:"+this.getGridInnerWidth()+"px;",k,q,e,u,l;a=a||0;s=Ext.isDefined(s)?s:o-1;for(u=0;u<o;u++){l=n[u];q=l.length;k=[];for(var t=0;t<q;t++){p.id=u+"-"+t;p.css=t===0?"x-grid3-cell-first ":(t==(q-1)?"x-grid3-cell-last ":"");p.attr=p.cellAttr="";p.value=l[t];if(Ext.isEmpty(p.value)){p.value="&#160;"}if(g){p.value=r(p.value)}if(m){p.css+=v(p.value)+" "}k[k.length]=d.apply(p)}h[h.length]=w.apply({tstyle:c,cols:q,cells:k.join(""),alt:""})}return h.join("")},masterTpl:new Ext.Template('<div class="x-grid3 x-pivotgrid" hidefocus="true">','<div class="x-grid3-viewport">','<div class="x-grid3-header">','<div class="x-grid3-header-title"><span>{title}</span></div>','<div class="x-grid3-header-inner">','<div class="x-grid3-header-offset" style="{ostyle}"></div>',"</div>",'<div class="x-clear"></div>',"</div>",'<div class="x-grid3-scroller">','<div class="x-grid3-row-headers"></div>','<div class="x-grid3-body" style="{bstyle}">{body}</div>','<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',"</div>","</div>",'<div class="x-grid3-resize-marker">&#160;</div>','<div class="x-grid3-resize-proxy">&#160;</div>',"</div>"),initTemplates:function(){Ext.grid.PivotGridView.superclass.initTemplates.apply(this,arguments);var a=this.templates||{};if(!a.gcell){a.gcell=new Ext.XTemplate('<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} '+this.colHeaderCellCls+'" style="{style}">','<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">',this.grid.enableHdMenu?'<a class="x-grid3-hd-btn" href="#"></a>':"","{value}","</div>","</td>")}this.templates=a;this.hrowRe=new RegExp("ux-grid-hd-group-row-(\\d+)","")},initElements:function(){Ext.grid.PivotGridView.superclass.initElements.apply(this,arguments);this.rowHeadersEl=new Ext.Element(this.scroller.child("div.x-grid3-row-headers"));this.headerTitleEl=new Ext.Element(this.mainHd.child("div.x-grid3-header-title"))},getGridInnerWidth:function(){var a=Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this,arguments);return a-this.getTotalRowHeaderWidth()},getTotalRowHeaderWidth:function(){var d=this.getRowHeaders(),c=d.length,b=0,a;for(a=0;a<c;a++){b+=d[a].width}return b},getTotalColumnHeaderHeight:function(){return this.getColumnHeaders().length*21},getCellIndex:function(b){if(b){var a=b.className.match(this.colRe),c;if(a&&(c=a[1])){return parseInt(c.split("-")[1],10)}}return false},renderUI:function(){var b=this.templates,a=this.getGridInnerWidth();return b.master.apply({body:b.body.apply({rows:"&#160;"}),ostyle:"width:"+a+"px",bstyle:"width:"+a+"px"})},onLayout:function(b,a){Ext.grid.PivotGridView.superclass.onLayout.apply(this,arguments);var b=this.getGridInnerWidth();this.resizeColumnHeaders(b);this.resizeAllRows(b)},refresh:function(b){this.fireEvent("beforerefresh",this);this.grid.stopEditing(true);var a=this.renderBody();this.mainBody.update(a).setWidth(this.getGridInnerWidth());if(b===true){this.updateHeaders();this.updateHeaderSortState()}this.processRows(0,true);this.layout();this.applyEmptyText();this.fireEvent("refresh",this)},renderHeaders:Ext.emptyFn,fitColumns:Ext.emptyFn,resizeColumnHeaders:function(b){var a=this.grid.topAxis;if(a.rendered){a.el.setWidth(b)}},resizeRowHeaders:function(){var a=this.getTotalRowHeaderWidth(),b=String.format("margin-left: {0}px;",a);this.rowHeadersEl.setWidth(a);this.mainBody.applyStyles(b);Ext.fly(this.innerHd).applyStyles(b);this.headerTitleEl.setWidth(a);this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight())},resizeAllRows:function(b){var d=this.getRows(),c=d.length,a;for(a=0;a<c;a++){Ext.fly(d[a]).setWidth(b);Ext.fly(d[a]).child("table").setWidth(b)}},updateHeaders:function(){this.renderGroupRowHeaders();this.renderGroupColumnHeaders()},renderGroupRowHeaders:function(){var a=this.grid.leftAxis;this.resizeRowHeaders();a.rendered=false;a.render(this.rowHeadersEl);this.setTitle(this.title)},setTitle:function(a){this.headerTitleEl.child("span").dom.innerHTML=a},renderGroupColumnHeaders:function(){var a=this.grid.topAxis;a.rendered=false;a.render(this.innerHd.firstChild)},isMenuDisabled:function(a,b){return true}});Ext.grid.PivotAxis=Ext.extend(Ext.Component,{orientation:"horizontal",defaultHeaderWidth:80,paddingWidth:7,setDimensions:function(a){this.dimensions=a},onRender:function(b,a){var c=this.orientation=="horizontal"?this.renderHorizontalRows():this.renderVerticalRows();this.el=Ext.DomHelper.overwrite(b.dom,{tag:"table",cn:c},true)},renderHorizontalRows:function(){var h=this.buildHeaders(),a=h.length,f=[],c,g,e,d,b;for(d=0;d<a;d++){c=[];g=h[d].items;e=g.length;for(b=0;b<e;b++){c.push({tag:"td",html:g[b].header,colspan:g[b].span})}f[d]={tag:"tr",cn:c}}return f},renderVerticalRows:function(){var b=this.buildHeaders(),h=b.length,a=[],l=[],g,c,k,f,e,d;for(e=0;e<h;e++){c=b[e];f=c.width||80;g=c.items.length;for(d=0;d<g;d++){k=c.items[d];a[k.start]=a[k.start]||[];a[k.start].push({tag:"td",html:k.header,rowspan:k.span,width:Ext.isBorderBox?f:f-this.paddingWidth})}}g=a.length;for(e=0;e<g;e++){l[e]={tag:"tr",cn:a[e]}}return l},getTuples:function(){var b=new Ext.data.Store({});b.data=this.store.data.clone();b.fields=this.store.fields;var k=[],a=this.dimensions,c=a.length,h;for(h=0;h<c;h++){k.push({field:a[h].dataIndex,direction:a[h].direction||"ASC"})}b.sort(k);var e=b.data.items,m=[],j=[],n,g,d,f,l;c=e.length;for(h=0;h<c;h++){d=this.getRecordInfo(e[h]);f=d.data;g="";for(l in f){g+=f[l]+"---"}if(m.indexOf(g)==-1){m.push(g);j.push(d)}}b.destroy();return j},getRecordInfo:function(a){var e=this.dimensions,d=e.length,g={},h,c,b;for(b=0;b<d;b++){h=e[b];c=h.dataIndex;g[c]=a.get(c)}var f=function(i){return function(j){for(var k in i){if(j.get(k)!=i[k]){return false}}return true}};return{data:g,matcher:f(g)}},buildHeaders:function(){var k=this.getTuples(),l=k.length,a=this.dimensions,e,q=a.length,c=[],n,r,m,p,o,b,h,g,f,d;for(f=0;f<q;f++){e=a[f];r=[];o=0;b=0;for(d=0;d<l;d++){n=k[d];h=d==(l-1);m=n.data[e.dataIndex];g=p!=undefined&&p!=m;if(f>0&&d>0){g=g||n.data[a[f-1].dataIndex]!=k[d-1].data[a[f-1].dataIndex]}if(g){r.push({header:p,span:o,start:b});b+=o;o=0}if(h){r.push({header:m,span:o+1,start:b});b+=o;o=0}p=m;o++}c.push({items:r,width:e.width||this.defaultHeaderWidth});p=undefined}return c}});Ext.grid.HeaderDragZone=Ext.extend(Ext.dd.DragZone,{maxDragWidth:120,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.ddGroup="gridHeader"+this.grid.getGridEl().id;Ext.grid.HeaderDragZone.superclass.constructor.call(this,c);if(b){this.setHandleElId(Ext.id(c));this.setOuterHandleElId(Ext.id(b))}this.scroll=false},getDragData:function(c){var a=Ext.lib.Event.getTarget(c),b=this.view.findHeaderCell(a);if(b){return{ddel:b.firstChild,header:b}}return false},onInitDrag:function(a){this.dragHeadersDisabled=this.view.headersDisabled;this.view.headersDisabled=true;var b=this.dragData.ddel.cloneNode(true);b.id=Ext.id();b.style.width=Math.min(this.dragData.header.offsetWidth,this.maxDragWidth)+"px";this.proxy.update(b);return true},afterValidDrop:function(){this.completeDrop()},afterInvalidDrop:function(){this.completeDrop()},completeDrop:function(){var a=this.view,b=this.dragHeadersDisabled;setTimeout(function(){a.headersDisabled=b},50)}});Ext.grid.HeaderDropZone=Ext.extend(Ext.dd.DropZone,{proxyOffsets:[-4,-9],fly:Ext.Element.fly,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.proxyTop=Ext.DomHelper.append(document.body,{cls:"col-move-top",html:"&#160;"},true);this.proxyBottom=Ext.DomHelper.append(document.body,{cls:"col-move-bottom",html:"&#160;"},true);this.proxyTop.hide=this.proxyBottom.hide=function(){this.setLeftTop(-100,-100);this.setStyle("visibility","hidden")};this.ddGroup="gridHeader"+this.grid.getGridEl().id;Ext.grid.HeaderDropZone.superclass.constructor.call(this,a.getGridEl().dom)},getTargetFromEvent:function(c){var a=Ext.lib.Event.getTarget(c),b=this.view.findCellIndex(a);if(b!==false){return this.view.getHeaderCell(b)}},nextVisible:function(c){var b=this.view,a=this.grid.colModel;c=c.nextSibling;while(c){if(!a.isHidden(b.getCellIndex(c))){return c}c=c.nextSibling}return null},prevVisible:function(c){var b=this.view,a=this.grid.colModel;c=c.prevSibling;while(c){if(!a.isHidden(b.getCellIndex(c))){return c}c=c.prevSibling}return null},positionIndicator:function(d,j,i){var a=Ext.lib.Event.getPageX(i),f=Ext.lib.Dom.getRegion(j.firstChild),c,g,b=f.top+this.proxyOffsets[1];if((f.right-a)<=(f.right-f.left)/2){c=f.right+this.view.borderWidth;g="after"}else{c=f.left;g="before"}if(this.grid.colModel.isFixed(this.view.getCellIndex(j))){return false}c+=this.proxyOffsets[0];this.proxyTop.setLeftTop(c,b);this.proxyTop.show();if(!this.bottomOffset){this.bottomOffset=this.view.mainHd.getHeight()}this.proxyBottom.setLeftTop(c,b+this.proxyTop.dom.offsetHeight+this.bottomOffset);this.proxyBottom.show();return g},onNodeEnter:function(d,a,c,b){if(b.header!=d){this.positionIndicator(b.header,d,c)}},onNodeOver:function(f,b,d,c){var a=false;if(c.header!=f){a=this.positionIndicator(c.header,f,d)}if(!a){this.proxyTop.hide();this.proxyBottom.hide()}return a?this.dropAllowed:this.dropNotAllowed},onNodeOut:function(d,a,c,b){this.proxyTop.hide();this.proxyBottom.hide()},onNodeDrop:function(b,l,f,c){var d=c.header;if(d!=b){var j=this.grid.colModel,i=Ext.lib.Event.getPageX(f),a=Ext.lib.Dom.getRegion(b.firstChild),m=(a.right-i)<=((a.right-a.left)/2)?"after":"before",g=this.view.getCellIndex(d),k=this.view.getCellIndex(b);if(m=="after"){k++}if(g<k){k--}j.moveColumn(g,k);return true}return false}});Ext.grid.GridView.ColumnDragZone=Ext.extend(Ext.grid.HeaderDragZone,{constructor:function(a,b){Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this,a,b,null);this.proxy.el.addClass("x-grid3-col-dd")},handleMouseDown:function(a){},callHandleMouseDown:function(a){Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this,a)}});Ext.grid.SplitDragZone=Ext.extend(Ext.dd.DDProxy,{fly:Ext.Element.fly,constructor:function(a,c,b){this.grid=a;this.view=a.getView();this.proxy=this.view.resizeProxy;Ext.grid.SplitDragZone.superclass.constructor.call(this,c,"gridSplitters"+this.grid.getGridEl().id,{dragElId:Ext.id(this.proxy.dom),resizeFrame:false});this.setHandleElId(Ext.id(c));this.setOuterHandleElId(Ext.id(b));this.scroll=false},b4StartDrag:function(a,d){this.view.headersDisabled=true;this.proxy.setHeight(this.view.mainWrap.getHeight());var b=this.cm.getColumnWidth(this.cellIndex);var c=Math.max(b-this.grid.minColumnWidth,0);this.resetConstraints();this.setXConstraint(c,1000);this.setYConstraint(0,0);this.minX=a-c;this.maxX=a+1000;this.startPos=a;Ext.dd.DDProxy.prototype.b4StartDrag.call(this,a,d)},handleMouseDown:function(c){var b=Ext.EventObject.setEvent(c);var a=this.fly(b.getTarget());if(a.hasClass("x-grid-split")){this.cellIndex=this.view.getCellIndex(a.dom);this.split=a.dom;this.cm=this.grid.colModel;if(this.cm.isResizable(this.cellIndex)&&!this.cm.isFixed(this.cellIndex)){Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this,arguments)}}},endDrag:function(c){this.view.headersDisabled=false;var a=Math.max(this.minX,Ext.lib.Event.getPageX(c));var b=a-this.startPos;this.view.onColumnSplitterMoved(this.cellIndex,this.cm.getColumnWidth(this.cellIndex)+b)},autoOffset:function(){this.setDelta(0,0)}});Ext.grid.GridDragZone=function(b,a){this.view=b.getView();Ext.grid.GridDragZone.superclass.constructor.call(this,this.view.mainBody.dom,a);this.scroll=false;this.grid=b;this.ddel=document.createElement("div");this.ddel.className="x-grid-dd-wrap"};Ext.extend(Ext.grid.GridDragZone,Ext.dd.DragZone,{ddGroup:"GridDD",getDragData:function(b){var a=Ext.lib.Event.getTarget(b);var d=this.view.findRowIndex(a);if(d!==false){var c=this.grid.selModel;if(!c.isSelected(d)||b.hasModifier()){c.handleMouseDown(this.grid,d,b)}return{grid:this.grid,ddel:this.ddel,rowIndex:d,selections:c.getSelections()}}return false},onInitDrag:function(b){var a=this.dragData;this.ddel.innerHTML=this.grid.getDragDropText();this.proxy.update(this.ddel)},afterRepair:function(){this.dragging=false},getRepairXY:function(b,a){return false},onEndDrag:function(a,b){},onValidDrop:function(a,b,c){this.hideProxy()},beforeInvalidDrop:function(a,b){}});Ext.grid.ColumnModel=Ext.extend(Ext.util.Observable,{defaultWidth:100,defaultSortable:false,constructor:function(a){if(a.columns){Ext.apply(this,a);this.setConfig(a.columns,true)}else{this.setConfig(a,true)}this.addEvents("widthchange","headerchange","hiddenchange","columnmoved","configchange");Ext.grid.ColumnModel.superclass.constructor.call(this)},getColumnId:function(a){return this.config[a].id},getColumnAt:function(a){return this.config[a]},setConfig:function(d,b){var e,g,a;if(!b){delete this.totalWidth;for(e=0,a=this.config.length;e<a;e++){g=this.config[e];if(g.setEditor){g.setEditor(null)}}}this.defaults=Ext.apply({width:this.defaultWidth,sortable:this.defaultSortable},this.defaults);this.config=d;this.lookup={};for(e=0,a=d.length;e<a;e++){g=Ext.applyIf(d[e],this.defaults);if(Ext.isEmpty(g.id)){g.id=e}if(!g.isColumn){var f=Ext.grid.Column.types[g.xtype||"gridcolumn"];g=new f(g);d[e]=g}this.lookup[g.id]=g}if(!b){this.fireEvent("configchange",this)}},getColumnById:function(a){return this.lookup[a]},getIndexById:function(c){for(var b=0,a=this.config.length;b<a;b++){if(this.config[b].id==c){return b}}return -1},moveColumn:function(e,b){var a=this.config,d=a[e];a.splice(e,1);a.splice(b,0,d);this.dataMap=null;this.fireEvent("columnmoved",this,e,b)},getColumnCount:function(b){var d=this.config.length,e=0,a;if(b===true){for(a=0;a<d;a++){if(!this.isHidden(a)){e++}}return e}return d},getColumnsBy:function(f,e){var b=this.config,g=b.length,a=[],d,h;for(d=0;d<g;d++){h=b[d];if(f.call(e||this,h,d)===true){a[a.length]=h}}return a},isSortable:function(a){return !!this.config[a].sortable},isMenuDisabled:function(a){return !!this.config[a].menuDisabled},getRenderer:function(a){return this.config[a].renderer||Ext.grid.ColumnModel.defaultRenderer},getRendererScope:function(a){return this.config[a].scope},setRenderer:function(a,b){this.config[a].renderer=b},getColumnWidth:function(a){var b=this.config[a].width;if(typeof b!="number"){b=this.defaultWidth}return b},setColumnWidth:function(b,c,a){this.config[b].width=c;this.totalWidth=null;if(!a){this.fireEvent("widthchange",this,b,c)}},getTotalWidth:function(b){if(!this.totalWidth){this.totalWidth=0;for(var c=0,a=this.config.length;c<a;c++){if(b||!this.isHidden(c)){this.totalWidth+=this.getColumnWidth(c)}}}return this.totalWidth},getColumnHeader:function(a){return this.config[a].header},setColumnHeader:function(a,b){this.config[a].header=b;this.fireEvent("headerchange",this,a,b)},getColumnTooltip:function(a){return this.config[a].tooltip},setColumnTooltip:function(a,b){this.config[a].tooltip=b},getDataIndex:function(a){return this.config[a].dataIndex},setDataIndex:function(a,b){this.config[a].dataIndex=b},findColumnIndex:function(d){var e=this.config;for(var b=0,a=e.length;b<a;b++){if(e[b].dataIndex==d){return b}}return -1},isCellEditable:function(b,e){var d=this.config[b],a=d.editable;return !!(a||(!Ext.isDefined(a)&&d.editor))},getCellEditor:function(a,b){return this.config[a].getCellEditor(b)},setEditable:function(a,b){this.config[a].editable=b},isHidden:function(a){return !!this.config[a].hidden},isFixed:function(a){return !!this.config[a].fixed},isResizable:function(a){return a>=0&&this.config[a].resizable!==false&&this.config[a].fixed!==true},setHidden:function(a,b){var d=this.config[a];if(d.hidden!==b){d.hidden=b;this.totalWidth=null;this.fireEvent("hiddenchange",this,a,b)}},setEditor:function(a,b){this.config[a].setEditor(b)},destroy:function(){var b=this.config.length,a=0;for(;a<b;a++){this.config[a].destroy()}delete this.config;delete this.lookup;this.purgeListeners()},setState:function(a,b){b=Ext.applyIf(b,this.defaults);Ext.apply(this.config[a],b)}});Ext.grid.ColumnModel.defaultRenderer=function(a){if(typeof a=="string"&&a.length<1){return"&#160;"}return a};Ext.grid.AbstractSelectionModel=Ext.extend(Ext.util.Observable,{constructor:function(){this.locked=false;Ext.grid.AbstractSelectionModel.superclass.constructor.call(this)},init:function(a){this.grid=a;if(this.lockOnInit){delete this.lockOnInit;this.locked=false;this.lock()}this.initEvents()},lock:function(){if(!this.locked){this.locked=true;var a=this.grid;if(a){a.getView().on({scope:this,beforerefresh:this.sortUnLock,refresh:this.sortLock})}else{this.lockOnInit=true}}},sortLock:function(){this.locked=true},sortUnLock:function(){this.locked=false},unlock:function(){if(this.locked){this.locked=false;var a=this.grid,b;if(a){b=a.getView();b.un("beforerefresh",this.sortUnLock,this);b.un("refresh",this.sortLock,this)}else{delete this.lockOnInit}}},isLocked:function(){return this.locked},destroy:function(){this.unlock();this.purgeListeners()}});Ext.grid.RowSelectionModel=Ext.extend(Ext.grid.AbstractSelectionModel,{singleSelect:false,constructor:function(a){Ext.apply(this,a);this.selections=new Ext.util.MixedCollection(false,function(b){return b.id});this.last=false;this.lastActive=false;this.addEvents("selectionchange","beforerowselect","rowselect","rowdeselect");Ext.grid.RowSelectionModel.superclass.constructor.call(this)},initEvents:function(){if(!this.grid.enableDragDrop&&!this.grid.enableDrag){this.grid.on("rowmousedown",this.handleMouseDown,this)}this.rowNav=new Ext.KeyNav(this.grid.getGridEl(),{up:this.onKeyPress,down:this.onKeyPress,scope:this});this.grid.getView().on({scope:this,refresh:this.onRefresh,rowupdated:this.onRowUpdated,rowremoved:this.onRemove})},onKeyPress:function(f,b){var a=b=="up",g=a?"selectPrevious":"selectNext",d=a?-1:1,c;if(!f.shiftKey||this.singleSelect){this[g](false)}else{if(this.last!==false&&this.lastActive!==false){c=this.last;this.selectRange(this.last,this.lastActive+d);this.grid.getView().focusRow(this.lastActive);if(c!==false){this.last=c}}else{this.selectFirstRow()}}},onRefresh:function(){var f=this.grid.store,d=this.getSelections(),c=0,a=d.length,b,e;this.silent=true;this.clearSelections(true);for(;c<a;c++){e=d[c];if((b=f.indexOfId(e.id))!=-1){this.selectRow(b,true)}}if(d.length!=this.selections.getCount()){this.fireEvent("selectionchange",this)}this.silent=false},onRemove:function(a,b,c){if(this.selections.remove(c)!==false){this.fireEvent("selectionchange",this)}},onRowUpdated:function(a,b,c){if(this.isSelected(c)){a.onRowSelect(b)}},selectRecords:function(b,e){if(!e){this.clearSelections()}var d=this.grid.store,c=0,a=b.length;for(;c<a;c++){this.selectRow(d.indexOf(b[c]),true)}},getCount:function(){return this.selections.length},selectFirstRow:function(){this.selectRow(0)},selectLastRow:function(a){this.selectRow(this.grid.store.getCount()-1,a)},selectNext:function(a){if(this.hasNext()){this.selectRow(this.last+1,a);this.grid.getView().focusRow(this.last);return true}return false},selectPrevious:function(a){if(this.hasPrevious()){this.selectRow(this.last-1,a);this.grid.getView().focusRow(this.last);return true}return false},hasNext:function(){return this.last!==false&&(this.last+1)<this.grid.store.getCount()},hasPrevious:function(){return !!this.last},getSelections:function(){return[].concat(this.selections.items)},getSelected:function(){return this.selections.itemAt(0)},each:function(e,d){var c=this.getSelections(),b=0,a=c.length;for(;b<a;b++){if(e.call(d||this,c[b],b)===false){return false}}return true},clearSelections:function(a){if(this.isLocked()){return}if(a!==true){var c=this.grid.store,b=this.selections;b.each(function(d){this.deselectRow(c.indexOfId(d.id))},this);b.clear()}else{this.selections.clear()}this.last=false},selectAll:function(){if(this.isLocked()){return}this.selections.clear();for(var b=0,a=this.grid.store.getCount();b<a;b++){this.selectRow(b,true)}},hasSelection:function(){return this.selections.length>0},isSelected:function(a){var b=Ext.isNumber(a)?this.grid.store.getAt(a):a;return(b&&this.selections.key(b.id)?true:false)},isIdSelected:function(a){return(this.selections.key(a)?true:false)},handleMouseDown:function(d,h,f){if(f.button!==0||this.isLocked()){return}var a=this.grid.getView();if(f.shiftKey&&!this.singleSelect&&this.last!==false){var c=this.last;this.selectRange(c,h,f.ctrlKey);this.last=c;a.focusRow(h)}else{var b=this.isSelected(h);if(f.ctrlKey&&b){this.deselectRow(h)}else{if(!b||this.getCount()>1){this.selectRow(h,f.ctrlKey||f.shiftKey);a.focusRow(h)}}}},selectRows:function(c,d){if(!d){this.clearSelections()}for(var b=0,a=c.length;b<a;b++){this.selectRow(c[b],true)}},selectRange:function(b,a,d){var c;if(this.isLocked()){return}if(!d){this.clearSelections()}if(b<=a){for(c=b;c<=a;c++){this.selectRow(c,true)}}else{for(c=b;c>=a;c--){this.selectRow(c,true)}}},deselectRange:function(c,b,a){if(this.isLocked()){return}for(var d=c;d<=b;d++){this.deselectRow(d,a)}},selectRow:function(b,d,a){if(this.isLocked()||(b<0||b>=this.grid.store.getCount())||(d&&this.isSelected(b))){return}var c=this.grid.store.getAt(b);if(c&&this.fireEvent("beforerowselect",this,b,d,c)!==false){if(!d||this.singleSelect){this.clearSelections()}this.selections.add(c);this.last=this.lastActive=b;if(!a){this.grid.getView().onRowSelect(b)}if(!this.silent){this.fireEvent("rowselect",this,b,c);this.fireEvent("selectionchange",this)}}},deselectRow:function(b,a){if(this.isLocked()){return}if(this.last==b){this.last=false}if(this.lastActive==b){this.lastActive=false}var c=this.grid.store.getAt(b);if(c){this.selections.remove(c);if(!a){this.grid.getView().onRowDeselect(b)}this.fireEvent("rowdeselect",this,b,c);this.fireEvent("selectionchange",this)}},acceptsNav:function(c,b,a){return !a.isHidden(b)&&a.isCellEditable(b,c)},onEditorKey:function(m,j){var d=j.getKey(),f,h=this.grid,o=h.lastEdit,i=h.activeEditor,b=j.shiftKey,n,o,a,l;if(d==j.TAB){j.stopEvent();i.completeEdit();if(b){f=h.walkCells(i.row,i.col-1,-1,this.acceptsNav,this)}else{f=h.walkCells(i.row,i.col+1,1,this.acceptsNav,this)}}else{if(d==j.ENTER){if(this.moveEditorOnEnter!==false){if(b){f=h.walkCells(o.row-1,o.col,-1,this.acceptsNav,this)}else{f=h.walkCells(o.row+1,o.col,1,this.acceptsNav,this)}}}}if(f){a=f[0];l=f[1];this.onEditorSelect(a,o.row);if(h.isEditor&&h.editing){n=h.activeEditor;if(n&&n.field.triggerBlur){n.field.triggerBlur()}}h.startEditing(a,l)}},onEditorSelect:function(b,a){if(a!=b){this.selectRow(b)}},destroy:function(){Ext.destroy(this.rowNav);this.rowNav=null;Ext.grid.RowSelectionModel.superclass.destroy.call(this)}});Ext.grid.Column=Ext.extend(Ext.util.Observable,{isColumn:true,constructor:function(b){Ext.apply(this,b);if(Ext.isString(this.renderer)){this.renderer=Ext.util.Format[this.renderer]}else{if(Ext.isObject(this.renderer)){this.scope=this.renderer.scope;this.renderer=this.renderer.fn}}if(!this.scope){this.scope=this}var a=this.editor;delete this.editor;this.setEditor(a);this.addEvents("click","contextmenu","dblclick","mousedown");Ext.grid.Column.superclass.constructor.call(this)},processEvent:function(b,d,c,f,a){return this.fireEvent(b,this,c,f,d)},destroy:function(){if(this.setEditor){this.setEditor(null)}this.purgeListeners()},renderer:function(a){return a},getEditor:function(a){return this.editable!==false?this.editor:null},setEditor:function(b){var a=this.editor;if(a){if(a.gridEditor){a.gridEditor.destroy();delete a.gridEditor}else{a.destroy()}}this.editor=null;if(b){if(!b.isXType){b=Ext.create(b,"textfield")}this.editor=b}},getCellEditor:function(b){var a=this.getEditor(b);if(a){if(!a.startEdit){if(!a.gridEditor){a.gridEditor=new Ext.grid.GridEditor(a)}a=a.gridEditor}}return a}});Ext.grid.BooleanColumn=Ext.extend(Ext.grid.Column,{trueText:"true",falseText:"false",undefinedText:"&#160;",constructor:function(a){Ext.grid.BooleanColumn.superclass.constructor.call(this,a);var c=this.trueText,d=this.falseText,b=this.undefinedText;this.renderer=function(e){if(e===undefined){return b}if(!e||e==="false"){return d}return c}}});Ext.grid.NumberColumn=Ext.extend(Ext.grid.Column,{format:"0,000.00",constructor:function(a){Ext.grid.NumberColumn.superclass.constructor.call(this,a);this.renderer=Ext.util.Format.numberRenderer(this.format)}});Ext.grid.DateColumn=Ext.extend(Ext.grid.Column,{format:"m/d/Y",constructor:function(a){Ext.grid.DateColumn.superclass.constructor.call(this,a);this.renderer=Ext.util.Format.dateRenderer(this.format)}});Ext.grid.TemplateColumn=Ext.extend(Ext.grid.Column,{constructor:function(a){Ext.grid.TemplateColumn.superclass.constructor.call(this,a);var b=(!Ext.isPrimitive(this.tpl)&&this.tpl.compile)?this.tpl:new Ext.XTemplate(this.tpl);this.renderer=function(d,e,c){return b.apply(c.data)};this.tpl=b}});Ext.grid.ActionColumn=Ext.extend(Ext.grid.Column,{header:"&#160;",actionIdRe:/x-action-col-(\d+)/,altText:"",constructor:function(b){var f=this,c=b.items||(f.items=[f]),a=c.length,d,e;Ext.grid.ActionColumn.superclass.constructor.call(f,b);f.renderer=function(g,h){g=Ext.isFunction(b.renderer)?b.renderer.apply(this,arguments)||"":"";h.css+=" x-action-col-cell";for(d=0;d<a;d++){e=c[d];g+='<img alt="'+(e.altText||f.altText)+'" src="'+(e.icon||Ext.BLANK_IMAGE_URL)+'" class="x-action-col-icon x-action-col-'+String(d)+" "+(e.iconCls||"")+" "+(Ext.isFunction(e.getClass)?e.getClass.apply(e.scope||this.scope||this,arguments):"")+'"'+((e.tooltip)?' ext:qtip="'+e.tooltip+'"':"")+" />"}return g}},destroy:function(){delete this.items;delete this.renderer;return Ext.grid.ActionColumn.superclass.destroy.apply(this,arguments)},processEvent:function(c,h,d,i,b){var a=h.getTarget().className.match(this.actionIdRe),g,f;if(a&&(g=this.items[parseInt(a[1],10)])){if(c=="click"){(f=g.handler||this.handler)&&f.call(g.scope||this.scope||this,d,i,b,g,h)}else{if((c=="mousedown")&&(g.stopSelection!==false)){return false}}}return Ext.grid.ActionColumn.superclass.processEvent.apply(this,arguments)}});Ext.grid.Column.types={gridcolumn:Ext.grid.Column,booleancolumn:Ext.grid.BooleanColumn,numbercolumn:Ext.grid.NumberColumn,datecolumn:Ext.grid.DateColumn,templatecolumn:Ext.grid.TemplateColumn,actioncolumn:Ext.grid.ActionColumn};Ext.grid.RowNumberer=Ext.extend(Object,{header:"",width:23,sortable:false,constructor:function(a){Ext.apply(this,a);if(this.rowspan){this.renderer=this.renderer.createDelegate(this)}},fixed:true,hideable:false,menuDisabled:true,dataIndex:"",id:"numberer",rowspan:undefined,renderer:function(b,c,a,d){if(this.rowspan){c.cellAttr='rowspan="'+this.rowspan+'"'}return d+1}});Ext.grid.CheckboxSelectionModel=Ext.extend(Ext.grid.RowSelectionModel,{header:'<div class="x-grid3-hd-checker">&#160;</div>',width:20,sortable:false,menuDisabled:true,fixed:true,hideable:false,dataIndex:"",id:"checker",isColumn:true,constructor:function(){Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this,arguments);if(this.checkOnly){this.handleMouseDown=Ext.emptyFn}},initEvents:function(){Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);this.grid.on("render",function(){Ext.fly(this.grid.getView().innerHd).on("mousedown",this.onHdMouseDown,this)},this)},processEvent:function(b,d,c,f,a){if(b=="mousedown"){this.onMouseDown(d,d.getTarget());return false}else{return Ext.grid.Column.prototype.processEvent.apply(this,arguments)}},onMouseDown:function(c,b){if(c.button===0&&b.className=="x-grid3-row-checker"){c.stopEvent();var d=c.getTarget(".x-grid3-row");if(d){var a=d.rowIndex;if(this.isSelected(a)){this.deselectRow(a)}else{this.selectRow(a,true);this.grid.getView().focusRow(a)}}}},onHdMouseDown:function(c,a){if(a.className=="x-grid3-hd-checker"){c.stopEvent();var b=Ext.fly(a.parentNode);var d=b.hasClass("x-grid3-hd-checker-on");if(d){b.removeClass("x-grid3-hd-checker-on");this.clearSelections()}else{b.addClass("x-grid3-hd-checker-on");this.selectAll()}}},renderer:function(b,c,a){return'<div class="x-grid3-row-checker">&#160;</div>'},onEditorSelect:function(b,a){if(a!=b&&!this.checkOnly){this.selectRow(b)}}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.TabPanel=Ext.extend(Ext.Panel,{deferredRender:true,tabWidth:120,minTabWidth:30,resizeTabs:false,enableTabScroll:false,scrollIncrement:0,scrollRepeatInterval:400,scrollDuration:0.35,animScroll:true,tabPosition:"top",baseCls:"x-tab-panel",autoTabs:false,autoTabSelector:"div.x-tab",activeTab:undefined,tabMargin:2,plain:false,wheelIncrement:20,idDelimiter:"__",itemCls:"x-tab-item",elements:"body",headerAsText:false,frame:false,hideBorders:true,initComponent:function(){this.frame=false;Ext.TabPanel.superclass.initComponent.call(this);this.addEvents("beforetabchange","tabchange","contextmenu");this.setLayout(new Ext.layout.CardLayout(Ext.apply({layoutOnCardChange:this.layoutOnTabChange,deferredRender:this.deferredRender},this.layoutConfig)));if(this.tabPosition=="top"){this.elements+=",header";this.stripTarget="header"}else{this.elements+=",footer";this.stripTarget="footer"}if(!this.stack){this.stack=Ext.TabPanel.AccessStack()}this.initItems()},onRender:function(c,a){Ext.TabPanel.superclass.onRender.call(this,c,a);if(this.plain){var f=this.tabPosition=="top"?"header":"footer";this[f].addClass("x-tab-panel-"+f+"-plain")}var b=this[this.stripTarget];this.stripWrap=b.createChild({cls:"x-tab-strip-wrap",cn:{tag:"ul",cls:"x-tab-strip x-tab-strip-"+this.tabPosition}});var e=(this.tabPosition=="bottom"?this.stripWrap:null);b.createChild({cls:"x-tab-strip-spacer"},e);this.strip=new Ext.Element(this.stripWrap.dom.firstChild);this.edge=this.strip.createChild({tag:"li",cls:"x-tab-edge",cn:[{tag:"span",cls:"x-tab-strip-text",cn:"&#160;"}]});this.strip.createChild({cls:"x-clear"});this.body.addClass("x-tab-panel-body-"+this.tabPosition);if(!this.itemTpl){var d=new Ext.Template('<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>','<a class="x-tab-right" href="#"><em class="x-tab-left">','<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',"</em></a></li>");d.disableFormats=true;d.compile();Ext.TabPanel.prototype.itemTpl=d}this.items.each(this.initTab,this)},afterRender:function(){Ext.TabPanel.superclass.afterRender.call(this);if(this.autoTabs){this.readTabs(false)}if(this.activeTab!==undefined){var a=Ext.isObject(this.activeTab)?this.activeTab:this.items.get(this.activeTab);delete this.activeTab;this.setActiveTab(a)}},initEvents:function(){Ext.TabPanel.superclass.initEvents.call(this);this.mon(this.strip,{scope:this,mousedown:this.onStripMouseDown,contextmenu:this.onStripContextMenu});if(this.enableTabScroll){this.mon(this.strip,"mousewheel",this.onWheel,this)}},findTargets:function(c){var b=null,a=c.getTarget("li:not(.x-tab-edge)",this.strip);if(a){b=this.getComponent(a.id.split(this.idDelimiter)[1]);if(b.disabled){return{close:null,item:null,el:null}}}return{close:c.getTarget(".x-tab-strip-close",this.strip),item:b,el:a}},onStripMouseDown:function(b){if(b.button!==0){return}b.preventDefault();var a=this.findTargets(b);if(a.close){if(a.item.fireEvent("beforeclose",a.item)!==false){a.item.fireEvent("close",a.item);this.remove(a.item)}return}if(a.item&&a.item!=this.activeTab){this.setActiveTab(a.item)}},onStripContextMenu:function(b){b.preventDefault();var a=this.findTargets(b);if(a.item){this.fireEvent("contextmenu",this,a.item,b)}},readTabs:function(d){if(d===true){this.items.each(function(g){this.remove(g)},this)}var c=this.el.query(this.autoTabSelector);for(var b=0,a=c.length;b<a;b++){var e=c[b],f=e.getAttribute("title");e.removeAttribute("title");this.add({title:f,contentEl:e})}},initTab:function(d,b){var e=this.strip.dom.childNodes[b],f=this.getTemplateArgs(d),c=e?this.itemTpl.insertBefore(e,f):this.itemTpl.append(this.strip,f),a="x-tab-strip-over",g=Ext.get(c);g.hover(function(){if(!d.disabled){g.addClass(a)}},function(){g.removeClass(a)});if(d.tabTip){g.child("span.x-tab-strip-text",true).qtip=d.tabTip}d.tabEl=c;g.select("a").on("click",function(h){if(!h.getPageX()){this.onStripMouseDown(h)}},this,{preventDefault:true});d.on({scope:this,disable:this.onItemDisabled,enable:this.onItemEnabled,titlechange:this.onItemTitleChanged,iconchange:this.onItemIconChanged,beforeshow:this.onBeforeShowItem})},getTemplateArgs:function(b){var a=b.closable?"x-tab-strip-closable":"";if(b.disabled){a+=" x-item-disabled"}if(b.iconCls){a+=" x-tab-with-icon"}if(b.tabCls){a+=" "+b.tabCls}return{id:this.id+this.idDelimiter+b.getItemId(),text:b.title,cls:a,iconCls:b.iconCls||""}},onAdd:function(b){Ext.TabPanel.superclass.onAdd.call(this,b);if(this.rendered){var a=this.items;this.initTab(b,a.indexOf(b));this.delegateUpdates()}},onBeforeAdd:function(b){var a=b.events?(this.items.containsKey(b.getItemId())?b:null):this.items.get(b);if(a){this.setActiveTab(b);return false}Ext.TabPanel.superclass.onBeforeAdd.apply(this,arguments);var c=b.elements;b.elements=c?c.replace(",header",""):c;b.border=(b.border===true)},onRemove:function(d){var b=Ext.get(d.tabEl);if(b){b.select("a").removeAllListeners();Ext.destroy(b)}Ext.TabPanel.superclass.onRemove.call(this,d);this.stack.remove(d);delete d.tabEl;d.un("disable",this.onItemDisabled,this);d.un("enable",this.onItemEnabled,this);d.un("titlechange",this.onItemTitleChanged,this);d.un("iconchange",this.onItemIconChanged,this);d.un("beforeshow",this.onBeforeShowItem,this);if(d==this.activeTab){var a=this.stack.next();if(a){this.setActiveTab(a)}else{if(this.items.getCount()>0){this.setActiveTab(0)}else{this.setActiveTab(null)}}}if(!this.destroying){this.delegateUpdates()}},onBeforeShowItem:function(a){if(a!=this.activeTab){this.setActiveTab(a);return false}},onItemDisabled:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).addClass("x-item-disabled")}this.stack.remove(b)},onItemEnabled:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).removeClass("x-item-disabled")}},onItemTitleChanged:function(b){var a=this.getTabEl(b);if(a){Ext.fly(a).child("span.x-tab-strip-text",true).innerHTML=b.title}},onItemIconChanged:function(d,a,c){var b=this.getTabEl(d);if(b){b=Ext.get(b);b.child("span.x-tab-strip-text").replaceClass(c,a);b[Ext.isEmpty(a)?"removeClass":"addClass"]("x-tab-with-icon")}},getTabEl:function(a){var b=this.getComponent(a);return b?b.tabEl:null},onResize:function(){Ext.TabPanel.superclass.onResize.apply(this,arguments);this.delegateUpdates()},beginUpdate:function(){this.suspendUpdates=true},endUpdate:function(){this.suspendUpdates=false;this.delegateUpdates()},hideTabStripItem:function(b){b=this.getComponent(b);var a=this.getTabEl(b);if(a){a.style.display="none";this.delegateUpdates()}this.stack.remove(b)},unhideTabStripItem:function(b){b=this.getComponent(b);var a=this.getTabEl(b);if(a){a.style.display="";this.delegateUpdates()}},delegateUpdates:function(){var a=this.rendered;if(this.suspendUpdates){return}if(this.resizeTabs&&a){this.autoSizeTabs()}if(this.enableTabScroll&&a){this.autoScrollTabs()}},autoSizeTabs:function(){var g=this.items.length,b=this.tabPosition!="bottom"?"header":"footer",c=this[b].dom.offsetWidth,a=this[b].dom.clientWidth;if(!this.resizeTabs||g<1||!a){return}var j=Math.max(Math.min(Math.floor((a-4)/g)-this.tabMargin,this.tabWidth),this.minTabWidth);this.lastTabWidth=j;var l=this.strip.query("li:not(.x-tab-edge)");for(var e=0,h=l.length;e<h;e++){var k=l[e],m=Ext.fly(k).child(".x-tab-strip-inner",true),f=k.offsetWidth,d=m.offsetWidth;m.style.width=(j-(f-d))+"px"}},adjustBodyWidth:function(a){if(this.header){this.header.setWidth(a)}if(this.footer){this.footer.setWidth(a)}return a},setActiveTab:function(c){c=this.getComponent(c);if(this.fireEvent("beforetabchange",this,c,this.activeTab)===false){return}if(!this.rendered){this.activeTab=c;return}if(this.activeTab!=c){if(this.activeTab){var a=this.getTabEl(this.activeTab);if(a){Ext.fly(a).removeClass("x-tab-strip-active")}}this.activeTab=c;if(c){var b=this.getTabEl(c);Ext.fly(b).addClass("x-tab-strip-active");this.stack.add(c);this.layout.setActiveItem(c);this.delegateUpdates();if(this.scrolling){this.scrollToTab(c,this.animScroll)}}this.fireEvent("tabchange",this,c)}},getActiveTab:function(){return this.activeTab||null},getItem:function(a){return this.getComponent(a)},autoScrollTabs:function(){this.pos=this.tabPosition=="bottom"?this.footer:this.header;var g=this.items.length,d=this.pos.dom.offsetWidth,c=this.pos.dom.clientWidth,f=this.stripWrap,e=f.dom,b=e.offsetWidth,h=this.getScrollPos(),a=this.edge.getOffsetsTo(this.stripWrap)[0]+h;if(!this.enableTabScroll||b<20){return}if(g==0||a<=c){e.scrollLeft=0;f.setWidth(c);if(this.scrolling){this.scrolling=false;this.pos.removeClass("x-tab-scrolling");this.scrollLeft.hide();this.scrollRight.hide();if(Ext.isAir||Ext.isWebKit){e.style.marginLeft="";e.style.marginRight=""}}}else{if(!this.scrolling){this.pos.addClass("x-tab-scrolling");if(Ext.isAir||Ext.isWebKit){e.style.marginLeft="18px";e.style.marginRight="18px"}}c-=f.getMargins("lr");f.setWidth(c>20?c:20);if(!this.scrolling){if(!this.scrollLeft){this.createScrollers()}else{this.scrollLeft.show();this.scrollRight.show()}}this.scrolling=true;if(h>(a-c)){e.scrollLeft=a-c}else{this.scrollToTab(this.activeTab,false)}this.updateScrollButtons()}},createScrollers:function(){this.pos.addClass("x-tab-scrolling-"+this.tabPosition);var c=this.stripWrap.dom.offsetHeight;var a=this.pos.insertFirst({cls:"x-tab-scroller-left"});a.setHeight(c);a.addClassOnOver("x-tab-scroller-left-over");this.leftRepeater=new Ext.util.ClickRepeater(a,{interval:this.scrollRepeatInterval,handler:this.onScrollLeft,scope:this});this.scrollLeft=a;var b=this.pos.insertFirst({cls:"x-tab-scroller-right"});b.setHeight(c);b.addClassOnOver("x-tab-scroller-right-over");this.rightRepeater=new Ext.util.ClickRepeater(b,{interval:this.scrollRepeatInterval,handler:this.onScrollRight,scope:this});this.scrollRight=b},getScrollWidth:function(){return this.edge.getOffsetsTo(this.stripWrap)[0]+this.getScrollPos()},getScrollPos:function(){return parseInt(this.stripWrap.dom.scrollLeft,10)||0},getScrollArea:function(){return parseInt(this.stripWrap.dom.clientWidth,10)||0},getScrollAnim:function(){return{duration:this.scrollDuration,callback:this.updateScrollButtons,scope:this}},getScrollIncrement:function(){return this.scrollIncrement||(this.resizeTabs?this.lastTabWidth+2:100)},scrollToTab:function(e,a){if(!e){return}var c=this.getTabEl(e),g=this.getScrollPos(),d=this.getScrollArea(),f=Ext.fly(c).getOffsetsTo(this.stripWrap)[0]+g,b=f+c.offsetWidth;if(f<g){this.scrollTo(f,a)}else{if(b>(g+d)){this.scrollTo(b-d,a)}}},scrollTo:function(b,a){this.stripWrap.scrollTo("left",b,a?this.getScrollAnim():false);if(!a){this.updateScrollButtons()}},onWheel:function(f){var g=f.getWheelDelta()*this.wheelIncrement*-1;f.stopEvent();var h=this.getScrollPos(),c=h+g,a=this.getScrollWidth()-this.getScrollArea();var b=Math.max(0,Math.min(a,c));if(b!=h){this.scrollTo(b,false)}},onScrollRight:function(){var a=this.getScrollWidth()-this.getScrollArea(),c=this.getScrollPos(),b=Math.min(a,c+this.getScrollIncrement());if(b!=c){this.scrollTo(b,this.animScroll)}},onScrollLeft:function(){var b=this.getScrollPos(),a=Math.max(0,b-this.getScrollIncrement());if(a!=b){this.scrollTo(a,this.animScroll)}},updateScrollButtons:function(){var a=this.getScrollPos();this.scrollLeft[a===0?"addClass":"removeClass"]("x-tab-scroller-left-disabled");this.scrollRight[a>=(this.getScrollWidth()-this.getScrollArea())?"addClass":"removeClass"]("x-tab-scroller-right-disabled")},beforeDestroy:function(){Ext.destroy(this.leftRepeater,this.rightRepeater);this.deleteMembers("strip","edge","scrollLeft","scrollRight","stripWrap");this.activeTab=null;Ext.TabPanel.superclass.beforeDestroy.apply(this)}});Ext.reg("tabpanel",Ext.TabPanel);Ext.TabPanel.prototype.activate=Ext.TabPanel.prototype.setActiveTab;Ext.TabPanel.AccessStack=function(){var a=[];return{add:function(b){a.push(b);if(a.length>10){a.shift()}},remove:function(e){var d=[];for(var c=0,b=a.length;c<b;c++){if(a[c]!=e){d.push(a[c])}}a=d},next:function(){return a.pop()}}};
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-core-debug.js	(revision 76)
@@ -0,0 +1,7996 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+
+var EXTUTIL = Ext.util,
+    EACH = Ext.each,
+    TRUE = true,
+    FALSE = false;
+/**
+ * @class Ext.util.Observable
+ * Base class that provides a common interface for publishing events. Subclasses are expected to
+ * to have a property "events" with all the events defined, and, optionally, a property "listeners"
+ * with configured listeners defined.<br>
+ * For example:
+ * <pre><code>
+Employee = Ext.extend(Ext.util.Observable, {
+    constructor: function(config){
+        this.name = config.name;
+        this.addEvents({
+            "fired" : true,
+            "quit" : true
+        });
+
+        // Copy configured listeners into *this* object so that the base class&#39;s
+        // constructor will add them.
+        this.listeners = config.listeners;
+
+        // Call our superclass constructor to complete construction process.
+        Employee.superclass.constructor.call(this, config)
+    }
+});
+</code></pre>
+ * This could then be used like this:<pre><code>
+var newEmployee = new Employee({
+    name: employeeName,
+    listeners: {
+        quit: function() {
+            // By default, "this" will be the object that fired the event.
+            alert(this.name + " has quit!");
+        }
+    }
+});
+</code></pre>
+ */
+EXTUTIL.Observable = function(){
+    /**
+     * @cfg {Object} listeners (optional) <p>A config object containing one or more event handlers to be added to this
+     * object during initialization.  This should be a valid listeners config object as specified in the
+     * {@link #addListener} example for attaching multiple handlers at once.</p>
+     * <br><p><b><u>DOM events from ExtJs {@link Ext.Component Components}</u></b></p>
+     * <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
+     * is usually only done when extra value can be added. For example the {@link Ext.DataView DataView}'s
+     * <b><code>{@link Ext.DataView#click click}</code></b> event passing the node clicked on. To access DOM
+     * events directly from a Component's HTMLElement, listeners must be added to the <i>{@link Ext.Component#getEl Element}</i> after the Component
+     * has been rendered. A plugin can simplify this step:<pre><code>
+// Plugin is configured with a listeners config object.
+// The Component is appended to the argument list of all handler functions.
+Ext.DomObserver = Ext.extend(Object, {
+    constructor: function(config) {
+        this.listeners = config.listeners ? config.listeners : config;
+    },
+
+    // Component passes itself into plugin&#39;s init method
+    init: function(c) {
+        var p, l = this.listeners;
+        for (p in l) {
+            if (Ext.isFunction(l[p])) {
+                l[p] = this.createHandler(l[p], c);
+            } else {
+                l[p].fn = this.createHandler(l[p].fn, c);
+            }
+        }
+
+        // Add the listeners to the Element immediately following the render call
+        c.render = c.render.{@link Function#createSequence createSequence}(function() {
+            var e = c.getEl();
+            if (e) {
+                e.on(l);
+            }
+        });
+    },
+
+    createHandler: function(fn, c) {
+        return function(e) {
+            fn.call(this, e, c);
+        };
+    }
+});
+
+var combo = new Ext.form.ComboBox({
+
+    // Collapse combo when its element is clicked on
+    plugins: [ new Ext.DomObserver({
+        click: function(evt, comp) {
+            comp.collapse();
+        }
+    })],
+    store: myStore,
+    typeAhead: true,
+    mode: 'local',
+    triggerAction: 'all'
+});
+     * </code></pre></p>
+     */
+    var me = this, e = me.events;
+    if(me.listeners){
+        me.on(me.listeners);
+        delete me.listeners;
+    }
+    me.events = e || {};
+};
+
+EXTUTIL.Observable.prototype = {
+    // private
+    filterOptRe : /^(?:scope|delay|buffer|single)$/,
+
+    /**
+     * <p>Fires the specified event with the passed parameters (minus the event name).</p>
+     * <p>An event may be set to bubble up an Observable parent hierarchy (See {@link Ext.Component#getBubbleTarget})
+     * by calling {@link #enableBubble}.</p>
+     * @param {String} eventName The name of the event to fire.
+     * @param {Object...} args Variable number of parameters are passed to handlers.
+     * @return {Boolean} returns false if any of the handlers return false otherwise it returns true.
+     */
+    fireEvent : function(){
+        var a = Array.prototype.slice.call(arguments, 0),
+            ename = a[0].toLowerCase(),
+            me = this,
+            ret = TRUE,
+            ce = me.events[ename],
+            cc,
+            q,
+            c;
+        if (me.eventsSuspended === TRUE) {
+            if (q = me.eventQueue) {
+                q.push(a);
+            }
+        }
+        else if(typeof ce == 'object') {
+            if (ce.bubble){
+                if(ce.fire.apply(ce, a.slice(1)) === FALSE) {
+                    return FALSE;
+                }
+                c = me.getBubbleTarget && me.getBubbleTarget();
+                if(c && c.enableBubble) {
+                    cc = c.events[ename];
+                    if(!cc || typeof cc != 'object' || !cc.bubble) {
+                        c.enableBubble(ename);
+                    }
+                    return c.fireEvent.apply(c, a);
+                }
+            }
+            else {
+                a.shift();
+                ret = ce.fire.apply(ce, a);
+            }
+        }
+        return ret;
+    },
+
+    /**
+     * Appends an event handler to this object.
+     * @param {String}   eventName The name of the event to listen for.
+     * @param {Function} handler The method the event invokes.
+     * @param {Object}   scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b>
+     * @param {Object}   options (optional) An object containing handler configuration.
+     * properties. This may contain any of the following properties:<ul>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b></div></li>
+     * <li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * <li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
+     * if the event was bubbled up from a child Observable.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * Using the options argument, it is possible to combine different types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener.
+     * <pre><code>
+myDataView.on('click', this.onClick, this, {
+single: true,
+delay: 100
+});</code></pre>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.
+     * <p>
+     * <pre><code>
+myGridPanel.on({
+'click' : {
+    fn: this.onClick,
+    scope: this,
+    delay: 100
+},
+'mouseover' : {
+    fn: this.onMouseOver,
+    scope: this
+},
+'mouseout' : {
+    fn: this.onMouseOut,
+    scope: this
+}
+});</code></pre>
+ * <p>
+ * Or a shorthand syntax:<br>
+ * <pre><code>
+myGridPanel.on({
+'click' : this.onClick,
+'mouseover' : this.onMouseOver,
+'mouseout' : this.onMouseOut,
+ scope: this
+});</code></pre>
+     */
+    addListener : function(eventName, fn, scope, o){
+        var me = this,
+            e,
+            oe,
+            ce;
+            
+        if (typeof eventName == 'object') {
+            o = eventName;
+            for (e in o) {
+                oe = o[e];
+                if (!me.filterOptRe.test(e)) {
+                    me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o);
+                }
+            }
+        } else {
+            eventName = eventName.toLowerCase();
+            ce = me.events[eventName] || TRUE;
+            if (typeof ce == 'boolean') {
+                me.events[eventName] = ce = new EXTUTIL.Event(me, eventName);
+            }
+            ce.addListener(fn, scope, typeof o == 'object' ? o : {});
+        }
+    },
+
+    /**
+     * Removes an event handler.
+     * @param {String}   eventName The type of event the handler was associated with.
+     * @param {Function} handler   The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object}   scope     (optional) The scope originally specified for the handler.
+     */
+    removeListener : function(eventName, fn, scope){
+        var ce = this.events[eventName.toLowerCase()];
+        if (typeof ce == 'object') {
+            ce.removeListener(fn, scope);
+        }
+    },
+
+    /**
+     * Removes all listeners for this object
+     */
+    purgeListeners : function(){
+        var events = this.events,
+            evt,
+            key;
+        for(key in events){
+            evt = events[key];
+            if(typeof evt == 'object'){
+                evt.clearListeners();
+            }
+        }
+    },
+
+    /**
+     * Adds the specified events to the list of events which this Observable may fire.
+     * @param {Object|String} o Either an object with event names as properties with a value of <code>true</code>
+     * or the first event name string if multiple event names are being passed as separate parameters.
+     * @param {string} Optional. Event name if multiple event names are being passed as separate parameters.
+     * Usage:<pre><code>
+this.addEvents('storeloaded', 'storecleared');
+</code></pre>
+     */
+    addEvents : function(o){
+        var me = this;
+        me.events = me.events || {};
+        if (typeof o == 'string') {
+            var a = arguments,
+                i = a.length;
+            while(i--) {
+                me.events[a[i]] = me.events[a[i]] || TRUE;
+            }
+        } else {
+            Ext.applyIf(me.events, o);
+        }
+    },
+
+    /**
+     * Checks to see if this object has any listeners for a specified event
+     * @param {String} eventName The name of the event to check for
+     * @return {Boolean} True if the event is being listened for, else false
+     */
+    hasListener : function(eventName){
+        var e = this.events[eventName.toLowerCase()];
+        return typeof e == 'object' && e.listeners.length > 0;
+    },
+
+    /**
+     * Suspend the firing of all events. (see {@link #resumeEvents})
+     * @param {Boolean} queueSuspended Pass as true to queue up suspended events to be fired
+     * after the {@link #resumeEvents} call instead of discarding all suspended events;
+     */
+    suspendEvents : function(queueSuspended){
+        this.eventsSuspended = TRUE;
+        if(queueSuspended && !this.eventQueue){
+            this.eventQueue = [];
+        }
+    },
+
+    /**
+     * Resume firing events. (see {@link #suspendEvents})
+     * If events were suspended using the <tt><b>queueSuspended</b></tt> parameter, then all
+     * events fired during event suspension will be sent to any listeners now.
+     */
+    resumeEvents : function(){
+        var me = this,
+            queued = me.eventQueue || [];
+        me.eventsSuspended = FALSE;
+        delete me.eventQueue;
+        EACH(queued, function(e) {
+            me.fireEvent.apply(me, e);
+        });
+    }
+};
+
+var OBSERVABLE = EXTUTIL.Observable.prototype;
+/**
+ * Appends an event handler to this object (shorthand for {@link #addListener}.)
+ * @param {String}   eventName     The type of event to listen for
+ * @param {Function} handler       The method the event invokes
+ * @param {Object}   scope         (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+ * <b>If omitted, defaults to the object which fired the event.</b>
+ * @param {Object}   options       (optional) An object containing handler configuration.
+ * @method
+ */
+OBSERVABLE.on = OBSERVABLE.addListener;
+/**
+ * Removes an event handler (shorthand for {@link #removeListener}.)
+ * @param {String}   eventName     The type of event the handler was associated with.
+ * @param {Function} handler       The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object}   scope         (optional) The scope originally specified for the handler.
+ * @method
+ */
+OBSERVABLE.un = OBSERVABLE.removeListener;
+
+/**
+ * Removes <b>all</b> added captures from the Observable.
+ * @param {Observable} o The Observable to release
+ * @static
+ */
+EXTUTIL.Observable.releaseCapture = function(o){
+    o.fireEvent = OBSERVABLE.fireEvent;
+};
+
+function createTargeted(h, o, scope){
+    return function(){
+        if(o.target == arguments[0]){
+            h.apply(scope, Array.prototype.slice.call(arguments, 0));
+        }
+    };
+};
+
+function createBuffered(h, o, l, scope){
+    l.task = new EXTUTIL.DelayedTask();
+    return function(){
+        l.task.delay(o.buffer, h, scope, Array.prototype.slice.call(arguments, 0));
+    };
+};
+
+function createSingle(h, e, fn, scope){
+    return function(){
+        e.removeListener(fn, scope);
+        return h.apply(scope, arguments);
+    };
+};
+
+function createDelayed(h, o, l, scope){
+    return function(){
+        var task = new EXTUTIL.DelayedTask(),
+            args = Array.prototype.slice.call(arguments, 0);
+        if(!l.tasks) {
+            l.tasks = [];
+        }
+        l.tasks.push(task);
+        task.delay(o.delay || 10, function(){
+            l.tasks.remove(task);
+            h.apply(scope, args);
+        }, scope);
+    };
+};
+
+EXTUTIL.Event = function(obj, name){
+    this.name = name;
+    this.obj = obj;
+    this.listeners = [];
+};
+
+EXTUTIL.Event.prototype = {
+    addListener : function(fn, scope, options){
+        var me = this,
+            l;
+        scope = scope || me.obj;
+        if(!me.isListening(fn, scope)){
+            l = me.createListener(fn, scope, options);
+            if(me.firing){ // if we are currently firing this event, don't disturb the listener loop
+                me.listeners = me.listeners.slice(0);
+            }
+            me.listeners.push(l);
+        }
+    },
+
+    createListener: function(fn, scope, o){
+        o = o || {};
+        scope = scope || this.obj;
+        var l = {
+            fn: fn,
+            scope: scope,
+            options: o
+        }, h = fn;
+        if(o.target){
+            h = createTargeted(h, o, scope);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, l, scope);
+        }
+        if(o.single){
+            h = createSingle(h, this, fn, scope);
+        }
+        if(o.buffer){
+            h = createBuffered(h, o, l, scope);
+        }
+        l.fireFn = h;
+        return l;
+    },
+
+    findListener : function(fn, scope){
+        var list = this.listeners,
+            i = list.length,
+            l;
+
+        scope = scope || this.obj;
+        while(i--){
+            l = list[i];
+            if(l){
+                if(l.fn == fn && l.scope == scope){
+                    return i;
+                }
+            }
+        }
+        return -1;
+    },
+
+    isListening : function(fn, scope){
+        return this.findListener(fn, scope) != -1;
+    },
+
+    removeListener : function(fn, scope){
+        var index,
+            l,
+            k,
+            me = this,
+            ret = FALSE;
+        if((index = me.findListener(fn, scope)) != -1){
+            if (me.firing) {
+                me.listeners = me.listeners.slice(0);
+            }
+            l = me.listeners[index];
+            if(l.task) {
+                l.task.cancel();
+                delete l.task;
+            }
+            k = l.tasks && l.tasks.length;
+            if(k) {
+                while(k--) {
+                    l.tasks[k].cancel();
+                }
+                delete l.tasks;
+            }
+            me.listeners.splice(index, 1);
+            ret = TRUE;
+        }
+        return ret;
+    },
+
+    // Iterate to stop any buffered/delayed events
+    clearListeners : function(){
+        var me = this,
+            l = me.listeners,
+            i = l.length;
+        while(i--) {
+            me.removeListener(l[i].fn, l[i].scope);
+        }
+    },
+
+    fire : function(){
+        var me = this,
+            listeners = me.listeners,
+            len = listeners.length,
+            i = 0,
+            l;
+
+        if(len > 0){
+            me.firing = TRUE;
+            var args = Array.prototype.slice.call(arguments, 0);
+            for (; i < len; i++) {
+                l = listeners[i];
+                if(l && l.fireFn.apply(l.scope || me.obj || window, args) === FALSE) {
+                    return (me.firing = FALSE);
+                }
+            }
+        }
+        me.firing = FALSE;
+        return TRUE;
+    }
+
+};
+})();
+/**
+ * @class Ext.DomHelper
+ * <p>The DomHelper class provides a layer of abstraction from DOM and transparently supports creating
+ * elements via DOM or using HTML fragments. It also has the ability to create HTML fragment templates
+ * from your DOM building code.</p>
+ *
+ * <p><b><u>DomHelper element specification object</u></b></p>
+ * <p>A specification object is used when creating elements. Attributes of this object
+ * are assumed to be element attributes, except for 4 special attributes:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>tag</tt></b> : <div class="sub-desc">The tag name of the element</div></li>
+ * <li><b><tt>children</tt></b> : or <tt>cn</tt><div class="sub-desc">An array of the
+ * same kind of element definition objects to be created and appended. These can be nested
+ * as deep as you want.</div></li>
+ * <li><b><tt>cls</tt></b> : <div class="sub-desc">The class attribute of the element.
+ * This will end up being either the "class" attribute on a HTML fragment or className
+ * for a DOM node, depending on whether DomHelper is using fragments or DOM.</div></li>
+ * <li><b><tt>html</tt></b> : <div class="sub-desc">The innerHTML for the element</div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Insertion methods</u></b></p>
+ * <p>Commonly used insertion methods:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #append}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertBefore}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertAfter}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #overwrite}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #createTemplate}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertHtml}</tt></b> : <div class="sub-desc"></div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Example</u></b></p>
+ * <p>This is an example, where an unordered list with 3 children items is appended to an existing
+ * element with id <tt>'my-div'</tt>:<br>
+ <pre><code>
+var dh = Ext.DomHelper; // create shorthand alias
+// specification object
+var spec = {
+    id: 'my-ul',
+    tag: 'ul',
+    cls: 'my-list',
+    // append children after creating
+    children: [     // may also specify 'cn' instead of 'children'
+        {tag: 'li', id: 'item0', html: 'List Item 0'},
+        {tag: 'li', id: 'item1', html: 'List Item 1'},
+        {tag: 'li', id: 'item2', html: 'List Item 2'}
+    ]
+};
+var list = dh.append(
+    'my-div', // the context element 'my-div' can either be the id or the actual node
+    spec      // the specification object
+);
+ </code></pre></p>
+ * <p>Element creation specification parameters in this class may also be passed as an Array of
+ * specification objects. This can be used to insert multiple sibling nodes into an existing
+ * container very efficiently. For example, to add more list items to the example above:<pre><code>
+dh.append('my-ul', [
+    {tag: 'li', id: 'item3', html: 'List Item 3'},
+    {tag: 'li', id: 'item4', html: 'List Item 4'}
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Templating</u></b></p>
+ * <p>The real power is in the built-in templating. Instead of creating or appending any elements,
+ * <tt>{@link #createTemplate}</tt> returns a Template object which can be used over and over to
+ * insert new elements. Revisiting the example above, we could utilize templating this time:
+ * <pre><code>
+// create the node
+var list = dh.append('my-div', {tag: 'ul', cls: 'my-list'});
+// get template
+var tpl = dh.createTemplate({tag: 'li', id: 'item{0}', html: 'List Item {0}'});
+
+for(var i = 0; i < 5, i++){
+    tpl.append(list, [i]); // use template to append to the actual node
+}
+ * </code></pre></p>
+ * <p>An example using a template:<pre><code>
+var html = '<a id="{0}" href="{1}" class="nav">{2}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', ['link1', 'http://www.jackslocum.com/', "Jack&#39;s Site"]);
+tpl.append('blog-roll', ['link2', 'http://www.dustindiaz.com/', "Dustin&#39;s Site"]);
+ * </code></pre></p>
+ *
+ * <p>The same example using named parameters:<pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', {
+    id: 'link1',
+    url: 'http://www.jackslocum.com/',
+    text: "Jack&#39;s Site"
+});
+tpl.append('blog-roll', {
+    id: 'link2',
+    url: 'http://www.dustindiaz.com/',
+    text: "Dustin&#39;s Site"
+});
+ * </code></pre></p>
+ *
+ * <p><b><u>Compiling Templates</u></b></p>
+ * <p>Templates are applied using regular expressions. The performance is great, but if
+ * you are adding a bunch of DOM elements using the same template, you can increase
+ * performance even further by {@link Ext.Template#compile "compiling"} the template.
+ * The way "{@link Ext.Template#compile compile()}" works is the template is parsed and
+ * broken up at the different variable points and a dynamic function is created and eval'ed.
+ * The generated function performs string concatenation of these parts and the passed
+ * variables instead of using regular expressions.
+ * <pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.compile();
+
+//... use template like normal
+ * </code></pre></p>
+ *
+ * <p><b><u>Performance Boost</u></b></p>
+ * <p>DomHelper will transparently create HTML fragments when it can. Using HTML fragments instead
+ * of DOM can significantly boost performance.</p>
+ * <p>Element creation specification parameters may also be strings. If {@link #useDom} is <tt>false</tt>,
+ * then the string is used as innerHTML. If {@link #useDom} is <tt>true</tt>, a string specification
+ * results in the creation of a text node. Usage:</p>
+ * <pre><code>
+Ext.DomHelper.useDom = true; // force it to use DOM; reduces performance
+ * </code></pre>
+ * @singleton
+ */
+Ext.DomHelper = function(){
+    var tempTableEl = null,
+        emptyTags = /^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,
+        tableRe = /^table|tbody|tr|td$/i,
+        confRe = /tag|children|cn|html$/i,
+        tableElRe = /td|tr|tbody/i,
+        cssRe = /([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,
+        endRe = /end/i,
+        pub,
+        // kill repeat to save bytes
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        ts = '<table>',
+        te = '</table>',
+        tbs = ts+'<tbody>',
+        tbe = '</tbody>'+te,
+        trs = tbs + '<tr>',
+        tre = '</tr>'+tbe;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        var newNode = pub.insertHtml(pos, Ext.getDom(el), createHtml(o));
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as innerHTML where available
+    function createHtml(o){
+        var b = '',
+            attr,
+            val,
+            key,
+            cn;
+
+        if(typeof o == "string"){
+            b = o;
+        } else if (Ext.isArray(o)) {
+            for (var i=0; i < o.length; i++) {
+                if(o[i]) {
+                    b += createHtml(o[i]);
+                }
+            };
+        } else {
+            b += '<' + (o.tag = o.tag || 'div');
+            for (attr in o) {
+                val = o[attr];
+                if(!confRe.test(attr)){
+                    if (typeof val == "object") {
+                        b += ' ' + attr + '="';
+                        for (key in val) {
+                            b += key + ':' + val[key] + ';';
+                        };
+                        b += '"';
+                    }else{
+                        b += ' ' + ({cls : 'class', htmlFor : 'for'}[attr] || attr) + '="' + val + '"';
+                    }
+                }
+            };
+            // Now either just close the tag or try to add children and close the tag.
+            if (emptyTags.test(o.tag)) {
+                b += '/>';
+            } else {
+                b += '>';
+                if ((cn = o.children || o.cn)) {
+                    b += createHtml(cn);
+                } else if(o.html){
+                    b += o.html;
+                }
+                b += '</' + o.tag + '>';
+            }
+        }
+        return b;
+    }
+
+    function ieTable(depth, s, h, e){
+        tempTableEl.innerHTML = [s, h, e].join('');
+        var i = -1,
+            el = tempTableEl,
+            ns;
+        while(++i < depth){
+            el = el.firstChild;
+        }
+//      If the result is multiple siblings, then encapsulate them into one fragment.
+        if(ns = el.nextSibling){
+            var df = document.createDocumentFragment();
+            while(el){
+                ns = el.nextSibling;
+                df.appendChild(el);
+                el = ns;
+            }
+            el = df;
+        }
+        return el;
+    }
+
+    /**
+     * @ignore
+     * Nasty code for IE's broken table implementation
+     */
+    function insertIntoTable(tag, where, el, html) {
+        var node,
+            before;
+
+        tempTableEl = tempTableEl || document.createElement('div');
+
+        if(tag == 'td' && (where == afterbegin || where == beforeend) ||
+           !tableElRe.test(tag) && (where == beforebegin || where == afterend)) {
+            return;
+        }
+        before = where == beforebegin ? el :
+                 where == afterend ? el.nextSibling :
+                 where == afterbegin ? el.firstChild : null;
+
+        if (where == beforebegin || where == afterend) {
+            el = el.parentNode;
+        }
+
+        if (tag == 'td' || (tag == 'tr' && (where == beforeend || where == afterbegin))) {
+            node = ieTable(4, trs, html, tre);
+        } else if ((tag == 'tbody' && (where == beforeend || where == afterbegin)) ||
+                   (tag == 'tr' && (where == beforebegin || where == afterend))) {
+            node = ieTable(3, tbs, html, tbe);
+        } else {
+            node = ieTable(2, ts, html, te);
+        }
+        el.insertBefore(node, before);
+        return node;
+    }
+
+    /**
+     * @ignore
+     * Fix for IE9 createContextualFragment missing method
+     */   
+    function createContextualFragment(html){
+        var div = document.createElement("div"),
+            fragment = document.createDocumentFragment(),
+            i = 0,
+            length, childNodes;
+        
+        div.innerHTML = html;
+        childNodes = div.childNodes;
+        length = childNodes.length;
+        
+        for (; i < length; i++) {
+            fragment.appendChild(childNodes[i].cloneNode(true));
+        }
+        
+        return fragment;
+    }
+    
+    pub = {
+        /**
+         * Returns the markup for the passed Element(s) config.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {String}
+         */
+        markup : function(o){
+            return createHtml(o);
+        },
+
+        /**
+         * Applies a style specification to an element.
+         * @param {String/HTMLElement} el The element to apply styles to
+         * @param {String/Object/Function} styles A style specification string e.g. 'width:100px', or object in the form {width:'100px'}, or
+         * a function which returns such a specification.
+         */
+        applyStyles : function(el, styles){
+            if (styles) {
+                var matches;
+
+                el = Ext.fly(el);
+                if (typeof styles == "function") {
+                    styles = styles.call();
+                }
+                if (typeof styles == "string") {
+                    /**
+                     * Since we're using the g flag on the regex, we need to set the lastIndex.
+                     * This automatically happens on some implementations, but not others, see:
+                     * http://stackoverflow.com/questions/2645273/javascript-regular-expression-literal-persists-between-function-calls
+                     * http://blog.stevenlevithan.com/archives/fixing-javascript-regexp
+                     */
+                    cssRe.lastIndex = 0;
+                    while ((matches = cssRe.exec(styles))) {
+                        el.setStyle(matches[1], matches[2]);
+                    }
+                } else if (typeof styles == "object") {
+                    el.setStyle(styles);
+                }
+            }
+        },
+        /**
+         * Inserts an HTML fragment into the DOM.
+         * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+         * @param {HTMLElement} el The context element
+         * @param {String} html The HTML fragment
+         * @return {HTMLElement} The new node
+         */
+        insertHtml : function(where, el, html){
+            var hash = {},
+                hashVal,
+                range,
+                rangeEl,
+                setStart,
+                frag,
+                rs;
+
+            where = where.toLowerCase();
+            // add these here because they are used in both branches of the condition.
+            hash[beforebegin] = ['BeforeBegin', 'previousSibling'];
+            hash[afterend] = ['AfterEnd', 'nextSibling'];
+
+            if (el.insertAdjacentHTML) {
+                if(tableRe.test(el.tagName) && (rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html))){
+                    return rs;
+                }
+                // add these two to the hash.
+                hash[afterbegin] = ['AfterBegin', 'firstChild'];
+                hash[beforeend] = ['BeforeEnd', 'lastChild'];
+                if ((hashVal = hash[where])) {
+                    el.insertAdjacentHTML(hashVal[0], html);
+                    return el[hashVal[1]];
+                }
+            } else {
+                range = el.ownerDocument.createRange();
+                setStart = 'setStart' + (endRe.test(where) ? 'After' : 'Before');
+                if (hash[where]) {
+                    range[setStart](el);
+                    if (!range.createContextualFragment) {
+                        frag = createContextualFragment(html);
+                    }
+                    else {
+                        frag = range.createContextualFragment(html);
+                    }
+                    el.parentNode.insertBefore(frag, where == beforebegin ? el : el.nextSibling);
+                    return el[(where == beforebegin ? 'previous' : 'next') + 'Sibling'];
+                } else {
+                    rangeEl = (where == afterbegin ? 'first' : 'last') + 'Child';
+                    if (el.firstChild) {
+                        range[setStart](el[rangeEl]);
+                        if (!range.createContextualFragment) {
+                            frag = createContextualFragment(html);
+                        }
+                        else {
+                            frag = range.createContextualFragment(html);
+                        }
+                        if(where == afterbegin){
+                            el.insertBefore(frag, el.firstChild);
+                        }else{
+                            el.appendChild(frag);
+                        }
+                    } else {
+                        el.innerHTML = html;
+                    }
+                    return el[rangeEl];
+                }
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        append : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) and overwrites the contents of el with them.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        overwrite : function(el, o, returnElement){
+            el = Ext.getDom(el);
+            el.innerHTML = createHtml(o);
+            return returnElement ? Ext.get(el.firstChild) : el.firstChild;
+        },
+
+        createHtml : createHtml
+    };
+    return pub;
+}();
+/**
+ * @class Ext.Template
+ * <p>Represents an HTML fragment template. Templates may be {@link #compile precompiled}
+ * for greater performance.</p>
+ * <p>For example usage {@link #Template see the constructor}.</p>
+ *
+ * @constructor
+ * An instance of this class may be created by passing to the constructor either
+ * a single argument, or multiple arguments:
+ * <div class="mdetail-params"><ul>
+ * <li><b>single argument</b> : String/Array
+ * <div class="sub-desc">
+ * The single argument may be either a String or an Array:<ul>
+ * <li><tt>String</tt> : </li><pre><code>
+var t = new Ext.Template("&lt;div>Hello {0}.&lt;/div>");
+t.{@link #append}('some-element', ['foo']);
+ * </code></pre>
+ * <li><tt>Array</tt> : </li>
+ * An Array will be combined with <code>join('')</code>.
+<pre><code>
+var t = new Ext.Template([
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name:trim} {value:ellipsis(10)}&lt;/span&gt;',
+    '&lt;/div&gt;',
+]);
+t.{@link #compile}();
+t.{@link #append}('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
+</code></pre>
+ * </ul></div></li>
+ * <li><b>multiple arguments</b> : String, Object, Array, ...
+ * <div class="sub-desc">
+ * Multiple arguments will be combined with <code>join('')</code>.
+ * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    // a configuration object:
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // See Notes below.
+    }
+);
+ * </code></pre>
+ * <p><b>Notes</b>:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>Formatting and <code>disableFormats</code> are not applicable for Ext Core.</li>
+ * <li>For a list of available format functions, see {@link Ext.util.Format}.</li>
+ * <li><code>disableFormats</code> reduces <code>{@link #apply}</code> time
+ * when no formatting is required.</li>
+ * </ul></div>
+ * </div></li>
+ * </ul></div>
+ * @param {Mixed} config
+ */
+Ext.Template = function(html){
+    var me = this,
+        a = arguments,
+        buf = [],
+        v;
+
+    if (Ext.isArray(html)) {
+        html = html.join("");
+    } else if (a.length > 1) {
+        for(var i = 0, len = a.length; i < len; i++){
+            v = a[i];
+            if(typeof v == 'object'){
+                Ext.apply(me, v);
+            } else {
+                buf.push(v);
+            }
+        };
+        html = buf.join('');
+    }
+
+    /**@private*/
+    me.html = html;
+    /**
+     * @cfg {Boolean} compiled Specify <tt>true</tt> to compile the template
+     * immediately (see <code>{@link #compile}</code>).
+     * Defaults to <tt>false</tt>.
+     */
+    if (me.compiled) {
+        me.compile();
+    }
+};
+Ext.Template.prototype = {
+    /**
+     * @cfg {RegExp} re The regular expression used to match template variables.
+     * Defaults to:<pre><code>
+     * re : /\{([\w\-]+)\}/g                                     // for Ext Core
+     * re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g      // for Ext JS
+     * </code></pre>
+     */
+    re : /\{([\w\-]+)\}/g,
+    /**
+     * See <code>{@link #re}</code>.
+     * @type RegExp
+     * @property re
+     */
+
+    /**
+     * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        var me = this;
+
+        return me.compiled ?
+                me.compiled(values) :
+                me.html.replace(me.re, function(m, name){
+                    return values[name] !== undefined ? values[name] : "";
+                });
+    },
+
+    /**
+     * Sets the HTML used as the template and optionally compiles it.
+     * @param {String} html
+     * @param {Boolean} compile (optional) True to compile the template (defaults to undefined)
+     * @return {Ext.Template} this
+     */
+    set : function(html, compile){
+        var me = this;
+        me.html = html;
+        me.compiled = null;
+        return compile ? me.compile() : me;
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     */
+    compile : function(){
+        var me = this,
+            sep = Ext.isGecko ? "+" : ",";
+
+        function fn(m, name){
+            name = "values['" + name + "']";
+            return "'"+ sep + '(' + name + " == undefined ? '' : " + name + ')' + sep + "'";
+        }
+
+        eval("this.compiled = function(values){ return " + (Ext.isGecko ? "'" : "['") +
+             me.html.replace(/\\/g, '\\\\').replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn) +
+             (Ext.isGecko ?  "';};" : "'].join('');};"));
+        return me;
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) as the first child of el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertFirst: function(el, values, returnElement){
+        return this.doInsert('afterBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) before el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertBefore: function(el, values, returnElement){
+        return this.doInsert('beforeBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) after el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertAfter : function(el, values, returnElement){
+        return this.doInsert('afterEnd', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied <code>values</code> to the template and appends
+     * the new node(s) to the specified <code>el</code>.
+     * <p>For example usage {@link #Template see the constructor}.</p>
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @param {Boolean} returnElement (optional) true to return an Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    append : function(el, values, returnElement){
+        return this.doInsert('beforeEnd', el, values, returnElement);
+    },
+
+    doInsert : function(where, el, values, returnEl){
+        el = Ext.getDom(el);
+        var newNode = Ext.DomHelper.insertHtml(where, el, this.applyTemplate(values));
+        return returnEl ? Ext.get(newNode, true) : newNode;
+    },
+
+    /**
+     * Applies the supplied values to the template and overwrites the content of el with the new node(s).
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    overwrite : function(el, values, returnElement){
+        el = Ext.getDom(el);
+        el.innerHTML = this.applyTemplate(values);
+        return returnElement ? Ext.get(el.firstChild, true) : el.firstChild;
+    }
+};
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+ * @param {Object/Array} values
+ * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+ * or an object (i.e. <code>{foo: 'bar'}</code>).
+ * @return {String} The HTML fragment
+ * @member Ext.Template
+ * @method apply
+ */
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @param {Object} config A configuration object
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.Template.from = function(el, config){
+    el = Ext.getDom(el);
+    return new Ext.Template(el.value || el.innerHTML, config || '');
+};
+/*
+ * This is code is also distributed under MIT license for use
+ * with jQuery and prototype JavaScript libraries.
+ */
+/**
+ * @class Ext.DomQuery
+Provides high performance selector/xpath processing by compiling queries into reusable functions. New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).
+<p>
+DomQuery supports most of the <a href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#selectors">CSS3 selectors spec</a>, along with some custom selectors and basic XPath.</p>
+
+<p>
+All selectors, attribute filters and pseudos below can be combined infinitely in any order. For example "div.foo:nth-child(odd)[@foo=bar].bar:first" would be a perfectly valid selector. Node filters are processed in the order in which they appear, which allows you to optimize your queries for your document structure.
+</p>
+<h4>Element Selectors:</h4>
+<ul class="list">
+    <li> <b>*</b> any element</li>
+    <li> <b>E</b> an element with the tag E</li>
+    <li> <b>E F</b> All descendent elements of E that have the tag F</li>
+    <li> <b>E > F</b> or <b>E/F</b> all direct children elements of E that have the tag F</li>
+    <li> <b>E + F</b> all elements with the tag F that are immediately preceded by an element with the tag E</li>
+    <li> <b>E ~ F</b> all elements with the tag F that are preceded by a sibling element with the tag E</li>
+</ul>
+<h4>Attribute Selectors:</h4>
+<p>The use of &#64; and quotes are optional. For example, div[&#64;foo='bar'] is also a valid attribute selector.</p>
+<ul class="list">
+    <li> <b>E[foo]</b> has an attribute "foo"</li>
+    <li> <b>E[foo=bar]</b> has an attribute "foo" that equals "bar"</li>
+    <li> <b>E[foo^=bar]</b> has an attribute "foo" that starts with "bar"</li>
+    <li> <b>E[foo$=bar]</b> has an attribute "foo" that ends with "bar"</li>
+    <li> <b>E[foo*=bar]</b> has an attribute "foo" that contains the substring "bar"</li>
+    <li> <b>E[foo%=2]</b> has an attribute "foo" that is evenly divisible by 2</li>
+    <li> <b>E[foo!=bar]</b> attribute "foo" does not equal "bar"</li>
+</ul>
+<h4>Pseudo Classes:</h4>
+<ul class="list">
+    <li> <b>E:first-child</b> E is the first child of its parent</li>
+    <li> <b>E:last-child</b> E is the last child of its parent</li>
+    <li> <b>E:nth-child(<i>n</i>)</b> E is the <i>n</i>th child of its parent (1 based as per the spec)</li>
+    <li> <b>E:nth-child(odd)</b> E is an odd child of its parent</li>
+    <li> <b>E:nth-child(even)</b> E is an even child of its parent</li>
+    <li> <b>E:only-child</b> E is the only child of its parent</li>
+    <li> <b>E:checked</b> E is an element that is has a checked attribute that is true (e.g. a radio or checkbox) </li>
+    <li> <b>E:first</b> the first E in the resultset</li>
+    <li> <b>E:last</b> the last E in the resultset</li>
+    <li> <b>E:nth(<i>n</i>)</b> the <i>n</i>th E in the resultset (1 based)</li>
+    <li> <b>E:odd</b> shortcut for :nth-child(odd)</li>
+    <li> <b>E:even</b> shortcut for :nth-child(even)</li>
+    <li> <b>E:contains(foo)</b> E's innerHTML contains the substring "foo"</li>
+    <li> <b>E:nodeValue(foo)</b> E contains a textNode with a nodeValue that equals "foo"</li>
+    <li> <b>E:not(S)</b> an E element that does not match simple selector S</li>
+    <li> <b>E:has(S)</b> an E element that has a descendent that matches simple selector S</li>
+    <li> <b>E:next(S)</b> an E element whose next sibling matches simple selector S</li>
+    <li> <b>E:prev(S)</b> an E element whose previous sibling matches simple selector S</li>
+    <li> <b>E:any(S1|S2|S2)</b> an E element which matches any of the simple selectors S1, S2 or S3//\\</li>
+</ul>
+<h4>CSS Value Selectors:</h4>
+<ul class="list">
+    <li> <b>E{display=none}</b> css value "display" that equals "none"</li>
+    <li> <b>E{display^=none}</b> css value "display" that starts with "none"</li>
+    <li> <b>E{display$=none}</b> css value "display" that ends with "none"</li>
+    <li> <b>E{display*=none}</b> css value "display" that contains the substring "none"</li>
+    <li> <b>E{display%=2}</b> css value "display" that is evenly divisible by 2</li>
+    <li> <b>E{display!=none}</b> css value "display" that does not equal "none"</li>
+</ul>
+ * @singleton
+ */
+Ext.DomQuery = function(){
+    var cache = {}, 
+    	simpleCache = {}, 
+    	valueCache = {},
+    	nonSpace = /\S/,
+    	trimRe = /^\s+|\s+$/g,
+    	tplRe = /\{(\d+)\}/g,
+    	modeRe = /^(\s?[\/>+~]\s?|\s|$)/,
+    	tagTokenRe = /^(#)?([\w\-\*]+)/,
+    	nthRe = /(\d*)n\+?(\d*)/, 
+    	nthRe2 = /\D/,
+    	// This is for IE MSXML which does not support expandos.
+	// IE runs the same speed using setAttribute, however FF slows way down
+	// and Safari completely fails so they need to continue to use expandos.
+	isIE = window.ActiveXObject ? true : false,
+	key = 30803;
+    
+    // this eval is stop the compressor from
+    // renaming the variable to something shorter
+    eval("var batch = 30803;");    	
+
+    // Retrieve the child node from a particular
+    // parent at the specified index.
+    function child(parent, index){
+        var i = 0,
+            n = parent.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               if(++i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    }
+
+    // retrieve the next element node
+    function next(n){	
+        while((n = n.nextSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // retrieve the previous element node 
+    function prev(n){
+        while((n = n.previousSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // Mark each child node with a nodeIndex skipping and
+    // removing empty text nodes.
+    function children(parent){
+        var n = parent.firstChild,
+	    nodeIndex = -1,
+	    nextNode;
+	while(n){
+	    nextNode = n.nextSibling;
+	    // clean worthless empty nodes.
+	    if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+		parent.removeChild(n);
+	    }else{
+		// add an expando nodeIndex
+		n.nodeIndex = ++nodeIndex;
+	    }
+	    n = nextNode;
+	}
+	return this;
+    }
+
+
+    // nodeSet - array of nodes
+    // cls - CSS Class
+    function byClassName(nodeSet, cls){
+        if(!cls){
+            return nodeSet;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = nodeSet[i]; i++){
+            if((' '+ci.className+' ').indexOf(cls) != -1){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    };
+
+    function attrValue(n, attr){
+	// if its an array, use the first node.
+        if(!n.tagName && typeof n.length != "undefined"){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+
+        if(attr == "for"){
+            return n.htmlFor;
+        }
+        if(attr == "class" || attr == "className"){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+
+    };
+
+
+    // ns - nodes
+    // mode - false, /, >, +, ~
+    // tagName - defaults to "*"
+    function getNodes(ns, mode, tagName){
+        var result = [], ri = -1, cs;
+        if(!ns){
+            return result;
+        }
+        tagName = tagName || "*";
+	// convert to array
+        if(typeof ns.getElementsByTagName != "undefined"){
+            ns = [ns];
+        }
+	
+	// no mode specified, grab all elements by tagName
+	// at any depth
+        if(!mode){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                for(var j = 0, ci; ci = cs[j]; j++){
+                    result[++ri] = ci;
+                }
+            }
+	// Direct Child mode (/ or >)
+	// E > F or E/F all direct children elements of E that have the tag 	
+        } else if(mode == "/" || mode == ">"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, ni, cn; ni = ns[i]; i++){
+                cn = ni.childNodes;
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.nodeName == utag || cj.nodeName == tagName  || tagName == '*'){
+                        result[++ri] = cj;
+                    }
+                }
+            }
+	// Immediately Preceding mode (+)
+	// E + F all elements with the tag F that are immediately preceded by an element with the tag E
+        }else if(mode == "+"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling) && n.nodeType != 1);
+                if(n && (n.nodeName == utag || n.nodeName == tagName || tagName == '*')){
+                    result[++ri] = n;
+                }
+            }
+	// Sibling mode (~)
+	// E ~ F all elements with the tag F that are preceded by a sibling element with the tag E
+        }else if(mode == "~"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling)){
+                    if (n.nodeName == utag || n.nodeName == tagName || tagName == '*'){
+                        result[++ri] = n;
+                    }
+                }
+            }
+        }
+        return result;
+    }
+
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var result = [], ri = -1;
+        tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase() == tagName){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byId(cs, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci && ci.id == id){
+                result[++ri] = ci;
+                return result;
+            }
+        }
+        return result;
+    }
+
+    // operators are =, !=, ^=, $=, *=, %=, |= and ~=
+    // custom can be "{"
+    function byAttribute(cs, attr, value, op, custom){
+        var result = [], 
+            ri = -1, 
+            useGetStyle = custom == "{",	    
+            fn = Ext.DomQuery.operators[op],	    
+            a,
+            xml,
+            hasXml;
+            
+        for(var i = 0, ci; ci = cs[i]; i++){
+	    // skip non-element nodes.
+            if(ci.nodeType != 1){
+                continue;
+            }
+            // only need to do this for the first node
+            if(!hasXml){
+                xml = Ext.DomQuery.isXml(ci);
+                hasXml = true;
+            }
+	    
+            // we only need to change the property names if we're dealing with html nodes, not XML
+            if(!xml){
+                if(useGetStyle){
+                    a = Ext.DomQuery.getStyle(ci, attr);
+                } else if (attr == "class" || attr == "className"){
+                    a = ci.className;
+                } else if (attr == "for"){
+                    a = ci.htmlFor;
+                } else if (attr == "href"){
+		    // getAttribute href bug
+		    // http://www.glennjones.net/Post/809/getAttributehrefbug.htm
+                    a = ci.getAttribute("href", 2);
+                } else{
+                    a = ci.getAttribute(attr);
+                }
+            }else{
+                a = ci.getAttribute(attr);
+            }
+            if((fn && fn(a, value)) || (!fn && a)){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    }
+
+    function nodupIEXml(cs){
+        var d = ++key, 
+            r;
+        cs[0].setAttribute("_nodup", d);
+        r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!c.getAttribute("_nodup") != d){
+                c.setAttribute("_nodup", d);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].removeAttribute("_nodup");
+        }
+        return r;
+    }
+
+    function nodup(cs){
+        if(!cs){
+            return [];
+        }
+        var len = cs.length, c, i, r = cs, cj, ri = -1;
+        if(!len || typeof cs.nodeType != "undefined" || len == 1){
+            return cs;
+        }
+        if(isIE && typeof cs[0].selectSingleNode != "undefined"){
+            return nodupIEXml(cs);
+        }
+        var d = ++key;
+        cs[0]._nodup = d;
+        for(i = 1; c = cs[i]; i++){
+            if(c._nodup != d){
+                c._nodup = d;
+            }else{
+                r = [];
+                for(var j = 0; j < i; j++){
+                    r[++ri] = cs[j];
+                }
+                for(j = i+1; cj = cs[j]; j++){
+                    if(cj._nodup != d){
+                        cj._nodup = d;
+                        r[++ri] = cj;
+                    }
+                }
+                return r;
+            }
+        }
+        return r;
+    }
+
+    function quickDiffIEXml(c1, c2){
+        var d = ++key,
+            r = [];
+        for(var i = 0, len = c1.length; i < len; i++){
+            c1[i].setAttribute("_qdiff", d);
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i].getAttribute("_qdiff") != d){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+           c1[i].removeAttribute("_qdiff");
+        }
+        return r;
+    }
+
+    function quickDiff(c1, c2){
+        var len1 = c1.length,
+        	d = ++key,
+        	r = [];
+        if(!len1){
+            return c2;
+        }
+        if(isIE && typeof c1[0].selectSingleNode != "undefined"){
+            return quickDiffIEXml(c1, c2);
+        }        
+        for(var i = 0; i < len1; i++){
+            c1[i]._qdiff = d;
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i]._qdiff != d){
+                r[r.length] = c2[i];
+            }
+        }
+        return r;
+    }
+
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, "*");
+        return byId(ns, id);
+    }
+
+    return {
+        getStyle : function(el, name){
+            return Ext.fly(el).getStyle(name);
+        },
+        /**
+         * Compiles a selector/xpath query into a reusable function. The returned function
+         * takes one parameter "root" (optional), which is the context node from where the query should start.
+         * @param {String} selector The selector/xpath query
+         * @param {String} type (optional) Either "select" (the default) or "simple" for a simple selector match
+         * @return {Function}
+         */
+        compile : function(path, type){
+            type = type || "select";
+
+    	    // setup fn preamble
+            var fn = ["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],
+        		mode,		
+        		lastPath,
+            	matchers = Ext.DomQuery.matchers,
+            	matchersLn = matchers.length,
+            	modeMatch,
+            	// accept leading mode switch
+            	lmode = path.match(modeRe);
+            
+            if(lmode && lmode[1]){
+                fn[fn.length] = 'mode="'+lmode[1].replace(trimRe, "")+'";';
+                path = path.replace(lmode[1], "");
+            }
+	    
+            // strip leading slashes
+            while(path.substr(0, 1)=="/"){
+                path = path.substr(1);
+            }
+
+            while(path && lastPath != path){
+                lastPath = path;
+                var tokenMatch = path.match(tagTokenRe);
+                if(type == "select"){
+                    if(tokenMatch){
+			// ID Selector
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tokenMatch[2]+'");';			
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }else if(path.substr(0, 1) != '@'){
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+		// type of "simple"
+                }else{
+                    if(tokenMatch){
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = byId(n, "'+tokenMatch[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }
+                }
+                while(!(modeMatch = path.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < matchersLn; j++){
+                        var t = matchers[j];
+                        var m = path.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+				return m[i];
+			    });
+                            path = path.replace(m[0], "");
+                            matched = true;
+                            break;
+                        }
+                    }
+                    // prevent infinite loop on bad selector
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + path + '"';
+                    }
+                }
+                if(modeMatch[1]){
+                    fn[fn.length] = 'mode="'+modeMatch[1].replace(trimRe, "")+'";';
+                    path = path.replace(modeMatch[1], "");
+                }
+            }
+	    // close fn out
+            fn[fn.length] = "return nodup(n);\n}";
+	    
+	    // eval fn and return it
+            eval(fn.join(""));
+            return f;
+        },
+
+        /**
+         * Selects a group of elements.
+         * @param {String} selector The selector/xpath query (can be a comma separated list of selectors)
+         * @param {Node/String} root (optional) The start of the query (defaults to document).
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+	jsSelect: function(path, root, type){
+	    // set root to doc if not specified.
+	    root = root || document;
+	    
+            if(typeof root == "string"){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(","),
+            	results = [];
+		
+	    // loop over each selector
+            for(var i = 0, len = paths.length; i < len; i++){		
+                var subPath = paths[i].replace(trimRe, "");
+		// compile and place in cache
+                if(!cache[subPath]){
+                    cache[subPath] = Ext.DomQuery.compile(subPath);
+                    if(!cache[subPath]){
+                        throw subPath + " is not a valid selector";
+                    }
+                }
+                var result = cache[subPath](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+	    
+	    // if there were multiple selectors, make sure dups
+	    // are eliminated
+            if(paths.length > 1){
+                return nodup(results);
+            }
+            return results;
+        },
+	isXml: function(el) {
+	    var docEl = (el ? el.ownerDocument || el : 0).documentElement;
+	    return docEl ? docEl.nodeName !== "HTML" : false;
+	},
+        select : document.querySelectorAll ? function(path, root, type) {
+	    root = root || document;
+	    if (!Ext.DomQuery.isXml(root)) {
+		try {
+		    var cs = root.querySelectorAll(path);
+		    return Ext.toArray(cs);
+		}
+		catch (ex) {}		
+	    }	    
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	} : function(path, root, type) {
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	},
+
+        /**
+         * Selects a single element.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Element} The DOM element which matched the selector.
+         */
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+
+        /**
+         * Selects the value of a node, optionally replacing null with the defaultValue.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {String} defaultValue
+         * @return {String}
+         */
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, "");
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, "select");
+            }
+            var n = valueCache[path](root), v;
+            n = n[0] ? n[0] : n;
+            	    
+	    // overcome a limitation of maximum textnode size
+	    // Rumored to potentially crash IE6 but has not been confirmed.
+	    // http://reference.sitepoint.com/javascript/Node/normalize
+	    // https://developer.mozilla.org/En/DOM/Node.normalize	    
+            if (typeof n.normalize == 'function') n.normalize();
+            
+            v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return ((v === null||v === undefined||v==='') ? defaultValue : v);
+        },
+
+        /**
+         * Selects the value of a node, parsing integers and floats. Returns the defaultValue, or 0 if none is specified.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {Number} defaultValue
+         * @return {Number}
+         */
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+
+        /**
+         * Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)
+         * @param {String/HTMLElement/Array} el An element id, element or array of elements
+         * @param {String} selector The simple selector to test
+         * @return {Boolean}
+         */
+        is : function(el, ss){
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            var isArray = Ext.isArray(el),
+            	result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+
+        /**
+         * Filters an array of elements to only include matches of a simple selector (e.g. div.some-class or span:first-child)
+         * @param {Array} el An array of elements to filter
+         * @param {String} selector The simple selector to test
+         * @param {Boolean} nonMatches If true, it returns the elements that DON'T match
+         * the selector instead of the ones that match
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, "");
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, "simple");
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+
+        /**
+         * Collection of matching regular expressions and code snippets.
+         * Each capture group within () will be replace the {} in the select
+         * statement as specified by their index.
+         */
+        matchers : [{
+                re: /^\.([\w\-]+)/,
+                select: 'n = byClassName(n, " {1} ");'
+            }, {
+                re: /^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w\-]+)/,
+                select: 'n = byId(n, "{1}");'
+            },{
+                re: /^@([\w\-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *=, %=, |= and ~=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c</i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            "=" : function(a, v){
+                return a == v;
+            },
+            "!=" : function(a, v){
+                return a != v;
+            },
+            "^=" : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            "$=" : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            "*=" : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            "%=" : function(a, v){
+                return (a % v) == 0;
+            },
+            "|=" : function(a, v){
+                return a && (a == v || a.substr(0, v.length+1) == v+'-');
+            },
+            "~=" : function(a, v){
+                return a && (' '+a+' ').indexOf(' '+v+' ') != -1;
+            }
+        },
+
+        /**
+         * <p>Object hash of "pseudo class" filter functions which are used when filtering selections. Each function is passed
+         * two parameters:</p><div class="mdetail-params"><ul>
+         * <li><b>c</b> : Array<div class="sub-desc">An Array of DOM elements to filter.</div></li>
+         * <li><b>v</b> : String<div class="sub-desc">The argument (if any) supplied in the selector.</div></li>
+         * </ul></div>
+         * <p>A filter function returns an Array of DOM elements which conform to the pseudo class.</p>
+         * <p>In addition to the provided pseudo classes listed above such as <code>first-child</code> and <code>nth-child</code>,
+         * developers may add additional, custom psuedo class filters to select elements according to application-specific requirements.</p>
+         * <p>For example, to filter <code>&lt;a></code> elements to only return links to <i>external</i> resources:</p>
+         * <code><pre>
+Ext.DomQuery.pseudos.external = function(c, v){
+    var r = [], ri = -1;
+    for(var i = 0, ci; ci = c[i]; i++){
+//      Include in result set only if it's a link to an external resource
+        if(ci.hostname != location.hostname){
+            r[++ri] = ci;
+        }
+    }
+    return r;
+};</pre></code>
+         * Then external links could be gathered with the following statement:<code><pre>
+var externalLinks = Ext.select("a:external");
+</code></pre>
+         */
+        pseudos : {
+            "first-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.previousSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "last-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.nextSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nth-child" : function(c, a) {
+                var r = [], ri = -1,
+                	m = nthRe.exec(a == "even" && "2n" || a == "odd" && "2n+1" || !nthRe2.test(a) && "n+" + a || a),
+                	f = (m[1] || 1) - 0, l = m[2] - 0;
+                for(var i = 0, n; n = c[i]; i++){
+                    var pn = n.parentNode;
+                    if (batch != pn._batch) {
+                        var j = 0;
+                        for(var cn = pn.firstChild; cn; cn = cn.nextSibling){
+                            if(cn.nodeType == 1){
+                               cn.nodeIndex = ++j;
+                            }
+                        }
+                        pn._batch = batch;
+                    }
+                    if (f == 1) {
+                        if (l == 0 || n.nodeIndex == l){
+                            r[++ri] = n;
+                        }
+                    } else if ((n.nodeIndex + l) % f == 0){
+                        r[++ri] = n;
+                    }
+                }
+
+                return r;
+            },
+
+            "only-child" : function(c){
+                var r = [], ri = -1;;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(!prev(ci) && !next(ci)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "empty" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var cns = ci.childNodes, j = 0, cn, empty = true;
+                    while(cn = cns[j]){
+                        ++j;
+                        if(cn.nodeType == 1 || cn.nodeType == 3){
+                            empty = false;
+                            break;
+                        }
+                    }
+                    if(empty){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "contains" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if((ci.textContent||ci.innerText||'').indexOf(v) != -1){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nodeValue" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.firstChild && ci.firstChild.nodeValue == v){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "checked" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.checked == true){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "not" : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+
+            "any" : function(c, selectors){
+                var ss = selectors.split('|'),
+                	r = [], ri = -1, s;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    for(var j = 0; s = ss[j]; j++){
+                        if(Ext.DomQuery.is(ci, s)){
+                            r[++ri] = ci;
+                            break;
+                        }
+                    }
+                }
+                return r;
+            },
+
+            "odd" : function(c){
+                return this["nth-child"](c, "odd");
+            },
+
+            "even" : function(c){
+                return this["nth-child"](c, "even");
+            },
+
+            "nth" : function(c, a){
+                return c[a-1] || [];
+            },
+
+            "first" : function(c){
+                return c[0] || [];
+            },
+
+            "last" : function(c){
+                return c[c.length-1] || [];
+            },
+
+            "has" : function(c, ss){
+                var s = Ext.DomQuery.select,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "next" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "prev" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
+/**
+ * @class Ext.util.DelayedTask
+ * <p> The DelayedTask class provides a convenient way to "buffer" the execution of a method,
+ * performing setTimeout where a new timeout cancels the old timeout. When called, the
+ * task will wait the specified time period before executing. If durng that time period,
+ * the task is called again, the original call will be cancelled. This continues so that
+ * the function is only called a single time for each iteration.</p>
+ * <p>This method is especially useful for things like detecting whether a user has finished
+ * typing in a text field. An example would be performing validation on a keypress. You can
+ * use this class to buffer the keypress events for a certain number of milliseconds, and
+ * perform only if they stop for that amount of time.  Usage:</p><pre><code>
+var task = new Ext.util.DelayedTask(function(){
+    alert(Ext.getDom('myInputField').value.length);
+});
+// Wait 500ms before calling our function. If the user presses another key 
+// during that 500ms, it will be cancelled and we'll wait another 500ms.
+Ext.get('myInputField').on('keypress', function(){
+    task.{@link #delay}(500); 
+});
+ * </code></pre> 
+ * <p>Note that we are using a DelayedTask here to illustrate a point. The configuration
+ * option <tt>buffer</tt> for {@link Ext.util.Observable#addListener addListener/on} will
+ * also setup a delayed task for you to buffer events.</p> 
+ * @constructor The parameters to this constructor serve as defaults and are not required.
+ * @param {Function} fn (optional) The default function to call.
+ * @param {Object} scope The default scope (The <code><b>this</b></code> reference) in which the
+ * function is called. If not specified, <code>this</code> will refer to the browser window.
+ * @param {Array} args (optional) The default Array of arguments.
+ */
+Ext.util.DelayedTask = function(fn, scope, args){
+    var me = this,
+    	id,    	
+    	call = function(){
+    		clearInterval(id);
+	        id = null;
+	        fn.apply(scope, args || []);
+	    };
+	    
+    /**
+     * Cancels any pending timeout and queues a new one
+     * @param {Number} delay The milliseconds to delay
+     * @param {Function} newFn (optional) Overrides function passed to constructor
+     * @param {Object} newScope (optional) Overrides scope passed to constructor. Remember that if no scope
+     * is specified, <code>this</code> will refer to the browser window.
+     * @param {Array} newArgs (optional) Overrides args passed to constructor
+     */
+    me.delay = function(delay, newFn, newScope, newArgs){
+        me.cancel();
+        fn = newFn || fn;
+        scope = newScope || scope;
+        args = newArgs || args;
+        id = setInterval(call, delay);
+    };
+
+    /**
+     * Cancel the last queued timeout
+     */
+    me.cancel = function(){
+        if(id){
+            clearInterval(id);
+            id = null;
+        }
+    };
+};/**
+ * @class Ext.Element
+ * <p>Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.</p>
+ * <p>All instances of this class inherit the methods of {@link Ext.Fx} making visual effects easily available to all DOM elements.</p>
+ * <p>Note that the events documented in this class are not Ext events, they encapsulate browser events. To
+ * access the underlying browser event, see {@link Ext.EventObject#browserEvent}. Some older
+ * browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.</p>
+ * Usage:<br>
+<pre><code>
+// by id
+var el = Ext.get("my-div");
+
+// by DOM element reference
+var el = Ext.get(myDivElement);
+</code></pre>
+ * <b>Animations</b><br />
+ * <p>When an element is manipulated, by default there is no animation.</p>
+ * <pre><code>
+var el = Ext.get("my-div");
+
+// no animation
+el.setWidth(100);
+ * </code></pre>
+ * <p>Many of the functions for manipulating an element have an optional "animate" parameter.  This
+ * parameter can be specified as boolean (<tt>true</tt>) for default animation effects.</p>
+ * <pre><code>
+// default animation
+el.setWidth(100, true);
+ * </code></pre>
+ *
+ * <p>To configure the effects, an object literal with animation options to use as the Element animation
+ * configuration object can also be specified. Note that the supported Element animation configuration
+ * options are a subset of the {@link Ext.Fx} animation options specific to Fx effects.  The supported
+ * Element animation configuration options are:</p>
+<pre>
+Option    Default   Description
+--------- --------  ---------------------------------------------
+{@link Ext.Fx#duration duration}  .35       The duration of the animation in seconds
+{@link Ext.Fx#easing easing}    easeOut   The easing method
+{@link Ext.Fx#callback callback}  none      A function to execute when the anim completes
+{@link Ext.Fx#scope scope}     this      The scope (this) of the callback function
+</pre>
+ *
+ * <pre><code>
+// Element animation options object
+var opt = {
+    {@link Ext.Fx#duration duration}: 1,
+    {@link Ext.Fx#easing easing}: 'elasticIn',
+    {@link Ext.Fx#callback callback}: this.foo,
+    {@link Ext.Fx#scope scope}: this
+};
+// animation with some options set
+el.setWidth(100, opt);
+ * </code></pre>
+ * <p>The Element animation object being used for the animation will be set on the options
+ * object as "anim", which allows you to stop or manipulate the animation. Here is an example:</p>
+ * <pre><code>
+// using the "anim" property to get the Anim object
+if(opt.anim.isAnimated()){
+    opt.anim.stop();
+}
+ * </code></pre>
+ * <p>Also see the <tt>{@link #animate}</tt> method for another animation technique.</p>
+ * <p><b> Composite (Collections of) Elements</b></p>
+ * <p>For working with collections of Elements, see {@link Ext.CompositeElement}</p>
+ * @constructor Create a new Element directly.
+ * @param {String/HTMLElement} element
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
+ */
+(function(){
+var DOC = document;
+
+Ext.Element = function(element, forceNew){
+    var dom = typeof element == "string" ?
+              DOC.getElementById(element) : element,
+        id;
+
+    if(!dom) return null;
+
+    id = dom.id;
+
+    if(!forceNew && id && Ext.elCache[id]){ // element object already exists
+        return Ext.elCache[id].el;
+    }
+
+    /**
+     * The DOM element
+     * @type HTMLElement
+     */
+    this.dom = dom;
+
+    /**
+     * The DOM element ID
+     * @type String
+     */
+    this.id = id || Ext.id(dom);
+};
+
+var DH = Ext.DomHelper,
+    El = Ext.Element,
+    EC = Ext.elCache;
+
+El.prototype = {
+    /**
+     * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
+     * @param {Object} o The object with the attributes
+     * @param {Boolean} useSet (optional) false to override the default setAttribute to use expandos.
+     * @return {Ext.Element} this
+     */
+    set : function(o, useSet){
+        var el = this.dom,
+            attr,
+            val,
+            useSet = (useSet !== false) && !!el.setAttribute;
+
+        for (attr in o) {
+            if (o.hasOwnProperty(attr)) {
+                val = o[attr];
+                if (attr == 'style') {
+                    DH.applyStyles(el, val);
+                } else if (attr == 'cls') {
+                    el.className = val;
+                } else if (useSet) {
+                    el.setAttribute(attr, val);
+                } else {
+                    el[attr] = val;
+                }
+            }
+        }
+        return this;
+    },
+
+//  Mouse events
+    /**
+     * @event click
+     * Fires when a mouse click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event contextmenu
+     * Fires when a right click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event dblclick
+     * Fires when a mouse double click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousedown
+     * Fires when a mousedown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseup
+     * Fires when a mouseup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseover
+     * Fires when a mouseover is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousemove
+     * Fires when a mousemove is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseout
+     * Fires when a mouseout is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseenter
+     * Fires when the mouse enters the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseleave
+     * Fires when the mouse leaves the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Keyboard events
+    /**
+     * @event keypress
+     * Fires when a keypress is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keydown
+     * Fires when a keydown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keyup
+     * Fires when a keyup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+
+//  HTML frame/object events
+    /**
+     * @event load
+     * Fires when the user agent finishes loading all content within the element. Only supported by window, frames, objects and images.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event unload
+     * Fires when the user agent removes all content from a window or frame. For elements, it fires when the target element or any of its content has been removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event abort
+     * Fires when an object/image is stopped from loading before completely loaded.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event error
+     * Fires when an object/image/frame cannot be loaded properly.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event resize
+     * Fires when a document view is resized.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event scroll
+     * Fires when a document view is scrolled.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Form events
+    /**
+     * @event select
+     * Fires when a user selects some text in a text field, including input and textarea.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event change
+     * Fires when a control loses the input focus and its value has been modified since gaining focus.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event submit
+     * Fires when a form is submitted.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event reset
+     * Fires when a form is reset.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event focus
+     * Fires when an element receives focus either via the pointing device or by tab navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event blur
+     * Fires when an element loses focus either via the pointing device or by tabbing navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  User Interface events
+    /**
+     * @event DOMFocusIn
+     * Where supported. Similar to HTML focus event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMFocusOut
+     * Where supported. Similar to HTML blur event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMActivate
+     * Where supported. Fires when an element is activated, for instance, through a mouse click or a keypress.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  DOM Mutation events
+    /**
+     * @event DOMSubtreeModified
+     * Where supported. Fires when the subtree is modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInserted
+     * Where supported. Fires when a node has been added as a child of another node.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemoved
+     * Where supported. Fires when a descendant node of the element is removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemovedFromDocument
+     * Where supported. Fires when a node is being removed from a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInsertedIntoDocument
+     * Where supported. Fires when a node is being inserted into a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMAttrModified
+     * Where supported. Fires when an attribute has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMCharacterDataModified
+     * Where supported. Fires when the character data has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+    /**
+     * The default unit to append to CSS values where a unit isn't provided (defaults to px).
+     * @type String
+     */
+    defaultUnit : "px",
+
+    /**
+     * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)
+     * @param {String} selector The simple selector to test
+     * @return {Boolean} True if this element matches the selector, else false
+     */
+    is : function(simpleSelector){
+        return Ext.DomQuery.is(this.dom, simpleSelector);
+    },
+
+    /**
+     * Tries to focus the element. Any exceptions are caught and ignored.
+     * @param {Number} defer (optional) Milliseconds to defer the focus
+     * @return {Ext.Element} this
+     */
+    focus : function(defer, /* private */ dom) {
+        var me = this,
+            dom = dom || me.dom;
+        try{
+            if(Number(defer)){
+                me.focus.defer(defer, null, [null, dom]);
+            }else{
+                dom.focus();
+            }
+        }catch(e){}
+        return me;
+    },
+
+    /**
+     * Tries to blur the element. Any exceptions are caught and ignored.
+     * @return {Ext.Element} this
+     */
+    blur : function() {
+        try{
+            this.dom.blur();
+        }catch(e){}
+        return this;
+    },
+
+    /**
+     * Returns the value of the "value" attribute
+     * @param {Boolean} asNumber true to parse the value as a number
+     * @return {String/Number}
+     */
+    getValue : function(asNumber){
+        var val = this.dom.value;
+        return asNumber ? parseInt(val, 10) : val;
+    },
+
+    /**
+     * Appends an event handler to this element.  The shorthand version {@link #on} is equivalent.
+     * @param {String} eventName The name of event to handle.
+     * @param {Function} fn The handler function the event invokes. This function is passed
+     * the following parameters:<ul>
+     * <li><b>evt</b> : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+     * <li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.
+     * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+     * <li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b>.
+     * @param {Object} options (optional) An object containing handler configuration properties.
+     * This may contain any of the following properties:<ul>
+     * <li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b></div></li>
+     * <li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>
+     * <li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+     * <li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>
+     * <li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>
+     * <li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+     * <li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+     * <li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * In the following examples, the shorthand form {@link #on} is used rather than the more verbose
+     * addListener.  The two are equivalent.  Using the options argument, it is possible to combine different
+     * types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the
+     * options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">
+     * Code:<pre><code>
+el.on('click', this.onClick, this, {
+    single: true,
+    delay: 100,
+    stopEvent : true,
+    forumId: 4
+});</code></pre></p>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.</p>
+     * <p>
+     * Code:<pre><code>
+el.on({
+    'click' : {
+        fn: this.onClick,
+        scope: this,
+        delay: 100
+    },
+    'mouseover' : {
+        fn: this.onMouseOver,
+        scope: this
+    },
+    'mouseout' : {
+        fn: this.onMouseOut,
+        scope: this
+    }
+});</code></pre>
+     * <p>
+     * Or a shorthand syntax:<br>
+     * Code:<pre><code></p>
+el.on({
+    'click' : this.onClick,
+    'mouseover' : this.onMouseOver,
+    'mouseout' : this.onMouseOut,
+    scope: this
+});
+     * </code></pre></p>
+     * <p><b>delegate</b></p>
+     * <p>This is a configuration option that you can pass along when registering a handler for
+     * an event to assist with event delegation. Event delegation is a technique that is used to
+     * reduce memory consumption and prevent exposure to memory-leaks. By registering an event
+     * for a container element as opposed to each element within a container. By setting this
+     * configuration option to a simple selector, the target element will be filtered to look for
+     * a descendant of the target.
+     * For example:<pre><code>
+// using this markup:
+&lt;div id='elId'>
+    &lt;p id='p1'>paragraph one&lt;/p>
+    &lt;p id='p2' class='clickable'>paragraph two&lt;/p>
+    &lt;p id='p3'>paragraph three&lt;/p>
+&lt;/div>
+// utilize event delegation to registering just one handler on the container element:
+el = Ext.get('elId');
+el.on(
+    'click',
+    function(e,t) {
+        // handle click
+        console.info(t.id); // 'p2'
+    },
+    this,
+    {
+        // filter the target element to be a descendant with the class 'clickable'
+        delegate: '.clickable'
+    }
+);
+     * </code></pre></p>
+     * @return {Ext.Element} this
+     */
+    addListener : function(eventName, fn, scope, options){
+        Ext.EventManager.on(this.dom,  eventName, fn, scope || this, options);
+        return this;
+    },
+
+    /**
+     * Removes an event handler from this element.  The shorthand version {@link #un} is equivalent.
+     * <b>Note</b>: if a <i>scope</i> was explicitly specified when {@link #addListener adding} the
+     * listener, the same scope must be specified here.
+     * Example:
+     * <pre><code>
+el.removeListener('click', this.handlerFn);
+// or
+el.un('click', this.handlerFn);
+</code></pre>
+     * @param {String} eventName The name of the event from which to remove the handler.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @return {Ext.Element} this
+     */
+    removeListener : function(eventName, fn, scope){
+        Ext.EventManager.removeListener(this.dom,  eventName, fn, scope || this);
+        return this;
+    },
+
+    /**
+     * Removes all previous added listeners from this element
+     * @return {Ext.Element} this
+     */
+    removeAllListeners : function(){
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Recursively removes all previous added listeners from this element and its children
+     * @return {Ext.Element} this
+     */
+    purgeAllListeners : function() {
+        Ext.EventManager.purgeElement(this, true);
+        return this;
+    },
+    /**
+     * @private Test if size has a unit, otherwise appends the default
+     */
+    addUnits : function(size){
+        if(size === "" || size == "auto" || size === undefined){
+            size = size || '';
+        } else if(!isNaN(size) || !unitPattern.test(size)){
+            size = size + (this.defaultUnit || 'px');
+        }
+        return size;
+    },
+
+    /**
+     * <p>Updates the <a href="http://developer.mozilla.org/en/DOM/element.innerHTML">innerHTML</a> of this Element
+     * from a specified URL. Note that this is subject to the <a href="http://en.wikipedia.org/wiki/Same_origin_policy">Same Origin Policy</a></p>
+     * <p>Updating innerHTML of an element will <b>not</b> execute embedded <tt>&lt;script></tt> elements. This is a browser restriction.</p>
+     * @param {Mixed} options. Either a sring containing the URL from which to load the HTML, or an {@link Ext.Ajax#request} options object specifying
+     * exactly how to request the HTML.
+     * @return {Ext.Element} this
+     */
+    load : function(url, params, cb){
+        Ext.Ajax.request(Ext.apply({
+            params: params,
+            url: url.url || url,
+            callback: cb,
+            el: this.dom,
+            indicatorText: url.indicatorText || ''
+        }, Ext.isObject(url) ? url : {}));
+        return this;
+    },
+
+    /**
+     * Tests various css rules/browsers to determine if this element uses a border box
+     * @return {Boolean}
+     */
+    isBorderBox : function(){
+        return Ext.isBorderBox || Ext.isForcedBorderBox || noBoxAdjust[(this.dom.tagName || "").toLowerCase()];
+    },
+
+    /**
+     * <p>Removes this element's dom reference.  Note that event and cache removal is handled at {@link Ext#removeNode}</p>
+     */
+    remove : function(){
+        var me = this,
+            dom = me.dom;
+
+        if (dom) {
+            delete me.dom;
+            Ext.removeNode(dom);
+        }
+    },
+
+    /**
+     * Sets up event handlers to call the passed functions when the mouse is moved into and out of the Element.
+     * @param {Function} overFn The function to call when the mouse enters the Element.
+     * @param {Function} outFn The function to call when the mouse leaves the Element.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the functions are executed. Defaults to the Element's DOM element.
+     * @param {Object} options (optional) Options for the listener. See {@link Ext.util.Observable#addListener the <tt>options</tt> parameter}.
+     * @return {Ext.Element} this
+     */
+    hover : function(overFn, outFn, scope, options){
+        var me = this;
+        me.on('mouseenter', overFn, scope || me.dom, options);
+        me.on('mouseleave', outFn, scope || me.dom, options);
+        return me;
+    },
+
+    /**
+     * Returns true if this element is an ancestor of the passed element
+     * @param {HTMLElement/String} el The element to check
+     * @return {Boolean} True if this element is an ancestor of el, else false
+     */
+    contains : function(el){
+        return !el ? false : Ext.lib.Dom.isAncestor(this.dom, el.dom ? el.dom : el);
+    },
+
+    /**
+     * Returns the value of a namespaced attribute from the element's underlying DOM node.
+     * @param {String} namespace The namespace in which to look for the attribute
+     * @param {String} name The attribute name
+     * @return {String} The attribute value
+     * @deprecated
+     */
+    getAttributeNS : function(ns, name){
+        return this.getAttribute(name, ns);
+    },
+
+    /**
+     * Returns the value of an attribute from the element's underlying DOM node.
+     * @param {String} name The attribute name
+     * @param {String} namespace (optional) The namespace in which to look for the attribute
+     * @return {String} The attribute value
+     */
+    getAttribute: (function(){
+        var test = document.createElement('table'),
+            isBrokenOnTable = false,
+            hasGetAttribute = 'getAttribute' in test,
+            unknownRe = /undefined|unknown/;
+            
+        if (hasGetAttribute) {
+            
+            try {
+                test.getAttribute('ext:qtip');
+            } catch (e) {
+                isBrokenOnTable = true;
+            }
+            
+            return function(name, ns) {
+                var el = this.dom,
+                    value;
+                
+                if (el.getAttributeNS) {
+                    value  = el.getAttributeNS(ns, name) || null;
+                }
+            
+                if (value == null) {
+                    if (ns) {
+                        if (isBrokenOnTable && el.tagName.toUpperCase() == 'TABLE') {
+                            try {
+                                value = el.getAttribute(ns + ':' + name);
+                            } catch (e) {
+                                value = '';
+                            }
+                        } else {
+                            value = el.getAttribute(ns + ':' + name);
+                        }
+                    } else {
+                        value = el.getAttribute(name) || el[name];
+                    }
+                }
+                return value || '';
+            };
+        } else {
+            return function(name, ns) {
+                var el = this.om,
+                    value,
+                    attribute;
+                
+                if (ns) {
+                    attribute = el[ns + ':' + name];
+                    value = unknownRe.test(typeof attribute) ? undefined : attribute;
+                } else {
+                    value = el[name];
+                }
+                return value || '';
+            };
+        }
+        test = null;
+    })(),
+        
+    /**
+    * Update the innerHTML of this element
+    * @param {String} html The new HTML
+    * @return {Ext.Element} this
+     */
+    update : function(html) {
+        if (this.dom) {
+            this.dom.innerHTML = html;
+        }
+        return this;
+    }
+};
+
+var ep = El.prototype;
+
+El.addMethods = function(o){
+   Ext.apply(ep, o);
+};
+
+/**
+ * Appends an event handler (shorthand for {@link #addListener}).
+ * @param {String} eventName The name of event to handle.
+ * @param {Function} fn The handler function the event invokes.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+ * @param {Object} options (optional) An object containing standard {@link #addListener} options
+ * @member Ext.Element
+ * @method on
+ */
+ep.on = ep.addListener;
+
+/**
+ * Removes an event handler from this element (see {@link #removeListener} for additional notes).
+ * @param {String} eventName The name of the event from which to remove the handler.
+ * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+ * then this must refer to the same object.
+ * @return {Ext.Element} this
+ * @member Ext.Element
+ * @method un
+ */
+ep.un = ep.removeListener;
+
+/**
+ * true to automatically adjust width and height settings for box-model issues (default to true)
+ */
+ep.autoBoxAdjust = true;
+
+// private
+var unitPattern = /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,
+    docEl;
+
+/**
+ * @private
+ */
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @static
+ * @member Ext.Element
+ * @method get
+ */
+El.get = function(el){
+    var ex,
+        elm,
+        id;
+    if(!el){ return null; }
+    if (typeof el == "string") { // element id
+        if (!(elm = DOC.getElementById(el))) {
+            return null;
+        }
+        if (EC[el] && EC[el].el) {
+            ex = EC[el].el;
+            ex.dom = elm;
+        } else {
+            ex = El.addToCache(new El(elm));
+        }
+        return ex;
+    } else if (el.tagName) { // dom element
+        if(!(id = el.id)){
+            id = Ext.id(el);
+        }
+        if (EC[id] && EC[id].el) {
+            ex = EC[id].el;
+            ex.dom = el;
+        } else {
+            ex = El.addToCache(new El(el));
+        }
+        return ex;
+    } else if (el instanceof El) {
+        if(el != docEl){
+            // refresh dom element in case no longer valid,
+            // catch case where it hasn't been appended
+
+            // If an el instance is passed, don't pass to getElementById without some kind of id
+            if (Ext.isIE && (el.id == undefined || el.id == '')) {
+                el.dom = el.dom;
+            } else {
+                el.dom = DOC.getElementById(el.id) || el.dom;
+            }
+        }
+        return el;
+    } else if(el.isComposite) {
+        return el;
+    } else if(Ext.isArray(el)) {
+        return El.select(el);
+    } else if(el == DOC) {
+        // create a bogus element object representing the document object
+        if(!docEl){
+            var f = function(){};
+            f.prototype = El.prototype;
+            docEl = new f();
+            docEl.dom = DOC;
+        }
+        return docEl;
+    }
+    return null;
+};
+
+El.addToCache = function(el, id){
+    id = id || el.id;
+    EC[id] = {
+        el:  el,
+        data: {},
+        events: {}
+    };
+    return el;
+};
+
+// private method for getting and setting element data
+El.data = function(el, key, value){
+    el = El.get(el);
+    if (!el) {
+        return null;
+    }
+    var c = EC[el.id].data;
+    if(arguments.length == 2){
+        return c[key];
+    }else{
+        return (c[key] = value);
+    }
+};
+
+// private
+// Garbage collection - uncache elements/purge listeners on orphaned elements
+// so we don't hold a reference and cause the browser to retain them
+function garbageCollect(){
+    if(!Ext.enableGarbageCollector){
+        clearInterval(El.collectorThreadId);
+    } else {
+        var eid,
+            el,
+            d,
+            o;
+
+        for(eid in EC){
+            o = EC[eid];
+            if(o.skipGC){
+                continue;
+            }
+            el = o.el;
+            d = el.dom;
+            // -------------------------------------------------------
+            // Determining what is garbage:
+            // -------------------------------------------------------
+            // !d
+            // dom node is null, definitely garbage
+            // -------------------------------------------------------
+            // !d.parentNode
+            // no parentNode == direct orphan, definitely garbage
+            // -------------------------------------------------------
+            // !d.offsetParent && !document.getElementById(eid)
+            // display none elements have no offsetParent so we will
+            // also try to look it up by it's id. However, check
+            // offsetParent first so we don't do unneeded lookups.
+            // This enables collection of elements that are not orphans
+            // directly, but somewhere up the line they have an orphan
+            // parent.
+            // -------------------------------------------------------
+            if(!d || !d.parentNode || (!d.offsetParent && !DOC.getElementById(eid))){
+                if(Ext.enableListenerCollection){
+                    Ext.EventManager.removeAll(d);
+                }
+                delete EC[eid];
+            }
+        }
+        // Cleanup IE Object leaks
+        if (Ext.isIE) {
+            var t = {};
+            for (eid in EC) {
+                t[eid] = EC[eid];
+            }
+            EC = Ext.elCache = t;
+        }
+    }
+}
+El.collectorThreadId = setInterval(garbageCollect, 30000);
+
+var flyFn = function(){};
+flyFn.prototype = El.prototype;
+
+// dom is optional
+El.Flyweight = function(dom){
+    this.dom = dom;
+};
+
+El.Flyweight.prototype = new flyFn();
+El.Flyweight.prototype.isFlyweight = true;
+El._flyweights = {};
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext.Element
+ * @method fly
+ */
+El.fly = function(el, named){
+    var ret = null;
+    named = named || '_global';
+
+    if (el = Ext.getDom(el)) {
+        (El._flyweights[named] = El._flyweights[named] || new El.Flyweight()).dom = el;
+        ret = El._flyweights[named];
+    }
+    return ret;
+};
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * Shorthand of {@link Ext.Element#get}
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @member Ext
+ * @method get
+ */
+Ext.get = El.get;
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext
+ * @method fly
+ */
+Ext.fly = El.fly;
+
+// speedy lookup for elements never to box adjust
+var noBoxAdjust = Ext.isStrict ? {
+    select:1
+} : {
+    input:1, select:1, textarea:1
+};
+if(Ext.isIE || Ext.isGecko){
+    noBoxAdjust['button'] = 1;
+}
+
+})();
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+	var PARENTNODE = 'parentNode',
+		NEXTSIBLING = 'nextSibling',
+		PREVIOUSSIBLING = 'previousSibling',
+		DQ = Ext.DomQuery,
+		GET = Ext.get;
+	
+	return {
+		/**
+	     * Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to search as a number or element (defaults to 50 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParent : function(simpleSelector, maxDepth, returnEl){
+	        var p = this.dom,
+	        	b = document.body, 
+	        	depth = 0, 	        	
+	        	stopEl;	        
+            if(Ext.isGecko && Object.prototype.toString.call(p) == '[object XULElement]') {
+                return null;
+            }
+	        maxDepth = maxDepth || 50;
+	        if (isNaN(maxDepth)) {
+	            stopEl = Ext.getDom(maxDepth);
+	            maxDepth = Number.MAX_VALUE;
+	        }
+	        while(p && p.nodeType == 1 && depth < maxDepth && p != b && p != stopEl){
+	            if(DQ.is(p, simpleSelector)){
+	                return returnEl ? GET(p) : p;
+	            }
+	            depth++;
+	            p = p.parentNode;
+	        }
+	        return null;
+	    },
+	
+	    /**
+	     * Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParentNode : function(simpleSelector, maxDepth, returnEl){
+	        var p = Ext.fly(this.dom.parentNode, '_internal');
+	        return p ? p.findParent(simpleSelector, maxDepth, returnEl) : null;
+	    },
+	
+	    /**
+	     * Walks up the dom looking for a parent node that matches the passed simple selector (e.g. div.some-class or span:first-child).
+	     * This is a shortcut for findParentNode() that always returns an Ext.Element.
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @return {Ext.Element} The matching DOM node (or null if no match was found)
+	     */
+	    up : function(simpleSelector, maxDepth){
+	        return this.findParentNode(simpleSelector, maxDepth, true);
+	    },
+	
+	    /**
+	     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {CompositeElement/CompositeElementLite} The composite element
+	     */
+	    select : function(selector){
+	        return Ext.Element.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {Array} An array of the matched nodes
+	     */
+	    query : function(selector){
+	        return DQ.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    child : function(selector, returnDom){
+	        var n = DQ.selectNode(selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+	    /**
+	     * Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    down : function(selector, returnDom){
+	        var n = DQ.selectNode(" > " + selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+		 /**
+	     * Gets the parent node for this element, optionally chaining up trying to match a selector
+	     * @param {String} selector (optional) Find a parent node that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The parent node or null
+		 */
+	    parent : function(selector, returnDom){
+	        return this.matchNode(PARENTNODE, PARENTNODE, selector, returnDom);
+	    },
+	
+	     /**
+	     * Gets the next sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The next sibling or null
+		 */
+	    next : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, NEXTSIBLING, selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the previous sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The previous sibling or null
+		 */
+	    prev : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, PREVIOUSSIBLING, selector, returnDom);
+	    },
+	
+	
+	    /**
+	     * Gets the first child, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The first child or null
+		 */
+	    first : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, 'firstChild', selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the last child, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The last child or null
+		 */
+	    last : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, 'lastChild', selector, returnDom);
+	    },
+	    
+	    matchNode : function(dir, start, selector, returnDom){
+	        var n = this.dom[start];
+	        while(n){
+	            if(n.nodeType == 1 && (!selector || DQ.is(n, selector))){
+	                return !returnDom ? GET(n) : n;
+	            }
+	            n = n[dir];
+	        }
+	        return null;
+	    }	
+    };
+}());/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {
+	    /**
+	     * Appends the passed element(s) to this element
+	     * @param {String/HTMLElement/Array/Element/CompositeElement} el
+	     * @return {Ext.Element} this
+	     */
+	    appendChild: function(el){        
+	        return GET(el).appendTo(this);        
+	    },
+	
+	    /**
+	     * Appends this element to the passed element
+	     * @param {Mixed} el The new parent element
+	     * @return {Ext.Element} this
+	     */
+	    appendTo: function(el){        
+	        GETDOM(el).appendChild(this.dom);        
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element before the passed element in the DOM
+	     * @param {Mixed} el The element before which this element will be inserted
+	     * @return {Ext.Element} this
+	     */
+	    insertBefore: function(el){  	          
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element after the passed element in the DOM
+	     * @param {Mixed} el The element to insert after
+	     * @return {Ext.Element} this
+	     */
+	    insertAfter: function(el){
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el.nextSibling);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts (or creates) an element (or DomHelper config) as the first child of this element
+	     * @param {Mixed/Object} el The id or element to insert or a DomHelper config to create and insert
+	     * @return {Ext.Element} The new child
+	     */
+	    insertFirst: function(el, returnDom){
+            el = el || {};
+            if(el.nodeType || el.dom || typeof el == 'string'){ // element
+                el = GETDOM(el);
+                this.dom.insertBefore(el, this.dom.firstChild);
+                return !returnDom ? GET(el) : el;
+            }else{ // dh config
+                return this.createChild(el, this.dom.firstChild, returnDom);
+            }
+        },
+	
+	    /**
+	     * Replaces the passed element with this element
+	     * @param {Mixed} el The element to replace
+	     * @return {Ext.Element} this
+	     */
+	    replace: function(el){
+	        el = GET(el);
+	        this.insertBefore(el);
+	        el.remove();
+	        return this;
+	    },
+	
+	    /**
+	     * Replaces this element with the passed element
+	     * @param {Mixed/Object} el The new element or a DomHelper config of an element to create
+	     * @return {Ext.Element} this
+	     */
+	    replaceWith: function(el){
+		    var me = this;
+                
+            if(el.nodeType || el.dom || typeof el == 'string'){
+                el = GETDOM(el);
+                me.dom.parentNode.insertBefore(el, me.dom);
+            }else{
+                el = DH.insertBefore(me.dom, el);
+            }
+	        
+	        delete Ext.elCache[me.id];
+	        Ext.removeNode(me.dom);      
+	        me.id = Ext.id(me.dom = el);
+	        Ext.Element.addToCache(me.isFlyweight ? new Ext.Element(me.dom) : me);     
+            return me;
+	    },
+	    
+		/**
+		 * Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.
+		 * @param {Object} config DomHelper element config object.  If no tag is specified (e.g., {tag:'input'}) then a div will be
+		 * automatically generated with the specified attributes.
+		 * @param {HTMLElement} insertBefore (optional) a child element of this element
+		 * @param {Boolean} returnDom (optional) true to return the dom node instead of creating an Element
+		 * @return {Ext.Element} The new child element
+		 */
+		createChild: function(config, insertBefore, returnDom){
+		    config = config || {tag:'div'};
+		    return insertBefore ? 
+		    	   DH.insertBefore(insertBefore, config, returnDom !== true) :	
+		    	   DH[!this.dom.firstChild ? 'overwrite' : 'append'](this.dom, config,  returnDom !== true);
+		},
+		
+		/**
+		 * Creates and wraps this element with another element
+		 * @param {Object} config (optional) DomHelper element config object for the wrapper element or null for an empty div
+		 * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+		 * @return {HTMLElement/Element} The newly created wrapper element
+		 */
+		wrap: function(config, returnDom){        
+		    var newEl = DH.insertBefore(this.dom, config || {tag: "div"}, !returnDom);
+		    newEl.dom ? newEl.dom.appendChild(this.dom) : newEl.appendChild(this.dom);
+		    return newEl;
+		},
+		
+		/**
+		 * Inserts an html fragment into this element
+		 * @param {String} where Where to insert the html in relation to this element - beforeBegin, afterBegin, beforeEnd, afterEnd.
+		 * @param {String} html The HTML fragment
+		 * @param {Boolean} returnEl (optional) True to return an Ext.Element (defaults to false)
+		 * @return {HTMLElement/Ext.Element} The inserted node (or nearest related if more than 1 inserted)
+		 */
+		insertHtml : function(where, html, returnEl){
+		    var el = DH.insertHtml(where, this.dom, html);
+		    return returnEl ? Ext.get(el) : el;
+		}
+	};
+}());/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+    // local style camelizing for speed
+    var supports = Ext.supports,
+        propCache = {},
+        camelRe = /(-[a-z])/gi,
+        view = document.defaultView,
+        opacityRe = /alpha\(opacity=(.*)\)/i,
+        trimRe = /^\s+|\s+$/g,
+        EL = Ext.Element,
+        spacesRe = /\s+/,
+        wordsRe = /\w/g,
+        PADDING = "padding",
+        MARGIN = "margin",
+        BORDER = "border",
+        LEFT = "-left",
+        RIGHT = "-right",
+        TOP = "-top",
+        BOTTOM = "-bottom",
+        WIDTH = "-width",
+        MATH = Math,
+        HIDDEN = 'hidden',
+        ISCLIPPED = 'isClipped',
+        OVERFLOW = 'overflow',
+        OVERFLOWX = 'overflow-x',
+        OVERFLOWY = 'overflow-y',
+        ORIGINALCLIP = 'originalClip',
+        // special markup used throughout Ext when box wrapping elements
+        borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
+        paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
+        margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
+        data = Ext.Element.data;
+
+
+    // private
+    function camelFn(m, a) {
+        return a.charAt(1).toUpperCase();
+    }
+
+    function chkCache(prop) {
+        return propCache[prop] || (propCache[prop] = prop == 'float' ? (supports.cssFloat ? 'cssFloat' : 'styleFloat') : prop.replace(camelRe, camelFn));
+    }
+
+    return {
+        // private  ==> used by Fx
+        adjustWidth : function(width) {
+            var me = this;
+            var isNum = (typeof width == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+            }
+            return (isNum && width < 0) ? 0 : width;
+        },
+
+        // private   ==> used by Fx
+        adjustHeight : function(height) {
+            var me = this;
+            var isNum = (typeof height == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+            }
+            return (isNum && height < 0) ? 0 : height;
+        },
+
+
+        /**
+         * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        addClass : function(className){
+            var me = this,
+                i,
+                len,
+                v,
+                cls = [];
+            // Separate case is for speed
+            if (!Ext.isArray(className)) {
+                if (typeof className == 'string' && !this.hasClass(className)) {
+                    me.dom.className += " " + className;
+                }
+            }
+            else {
+                for (i = 0, len = className.length; i < len; i++) {
+                    v = className[i];
+                    if (typeof v == 'string' && (' ' + me.dom.className + ' ').indexOf(' ' + v + ' ') == -1) {
+                        cls.push(v);
+                    }
+                }
+                if (cls.length) {
+                    me.dom.className += " " + cls.join(" ");
+                }
+            }
+            return me;
+        },
+
+        /**
+         * Removes one or more CSS classes from the element.
+         * @param {String/Array} className The CSS class to remove, or an array of classes
+         * @return {Ext.Element} this
+         */
+        removeClass : function(className){
+            var me = this,
+                i,
+                idx,
+                len,
+                cls,
+                elClasses;
+            if (!Ext.isArray(className)){
+                className = [className];
+            }
+            if (me.dom && me.dom.className) {
+                elClasses = me.dom.className.replace(trimRe, '').split(spacesRe);
+                for (i = 0, len = className.length; i < len; i++) {
+                    cls = className[i];
+                    if (typeof cls == 'string') {
+                        cls = cls.replace(trimRe, '');
+                        idx = elClasses.indexOf(cls);
+                        if (idx != -1) {
+                            elClasses.splice(idx, 1);
+                        }
+                    }
+                }
+                me.dom.className = elClasses.join(" ");
+            }
+            return me;
+        },
+
+        /**
+         * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        radioClass : function(className){
+            var cn = this.dom.parentNode.childNodes,
+                v,
+                i,
+                len;
+            className = Ext.isArray(className) ? className : [className];
+            for (i = 0, len = cn.length; i < len; i++) {
+                v = cn[i];
+                if (v && v.nodeType == 1) {
+                    Ext.fly(v, '_internal').removeClass(className);
+                }
+            };
+            return this.addClass(className);
+        },
+
+        /**
+         * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).
+         * @param {String} className The CSS class to toggle
+         * @return {Ext.Element} this
+         */
+        toggleClass : function(className){
+            return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);
+        },
+
+        /**
+         * Checks if the specified CSS class exists on this element's DOM node.
+         * @param {String} className The CSS class to check for
+         * @return {Boolean} True if the class exists, else false
+         */
+        hasClass : function(className){
+            return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;
+        },
+
+        /**
+         * Replaces a CSS class on the element with another.  If the old name does not exist, the new name will simply be added.
+         * @param {String} oldClassName The CSS class to replace
+         * @param {String} newClassName The replacement CSS class
+         * @return {Ext.Element} this
+         */
+        replaceClass : function(oldClassName, newClassName){
+            return this.removeClass(oldClassName).addClass(newClassName);
+        },
+
+        isStyle : function(style, val) {
+            return this.getStyle(style) == val;
+        },
+
+        /**
+         * Normalizes currentStyle and computedStyle.
+         * @param {String} property The style property whose value is returned.
+         * @return {String} The current value of the style property for this element.
+         */
+        getStyle : function(){
+            return view && view.getComputedStyle ?
+                function(prop){
+                    var el = this.dom,
+                        v,
+                        cs,
+                        out,
+                        display;
+
+                    if(el == document){
+                        return null;
+                    }
+                    prop = chkCache(prop);
+                    out = (v = el.style[prop]) ? v :
+                           (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;
+                           
+                    // Ignore cases when the margin is correctly reported as 0, the bug only shows
+                    // numbers larger.
+                    if(prop == 'marginRight' && out != '0px' && !supports.correctRightMargin){
+                        display = el.style.display;
+                        el.style.display = 'inline-block';
+                        out = view.getComputedStyle(el, '').marginRight;
+                        el.style.display = display;
+                    }
+                    
+                    if(prop == 'backgroundColor' && out == 'rgba(0, 0, 0, 0)' && !supports.correctTransparentColor){
+                        out = 'transparent';
+                    }
+                    return out;
+                } :
+                function(prop){
+                    var el = this.dom,
+                        m,
+                        cs;
+
+                    if(el == document) return null;
+                    if (prop == 'opacity') {
+                        if (el.style.filter.match) {
+                            if(m = el.style.filter.match(opacityRe)){
+                                var fv = parseFloat(m[1]);
+                                if(!isNaN(fv)){
+                                    return fv ? fv / 100 : 0;
+                                }
+                            }
+                        }
+                        return 1;
+                    }
+                    prop = chkCache(prop);
+                    return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);
+                };
+        }(),
+
+        /**
+         * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
+         * are convert to standard 6 digit hex color.
+         * @param {String} attr The css attribute
+         * @param {String} defaultValue The default value to use when a valid color isn't found
+         * @param {String} prefix (optional) defaults to #. Use an empty string when working with
+         * color anims.
+         */
+        getColor : function(attr, defaultValue, prefix){
+            var v = this.getStyle(attr),
+                color = (typeof prefix != 'undefined') ? prefix : '#',
+                h;
+
+            if(!v || (/transparent|inherit/.test(v))) {
+                return defaultValue;
+            }
+            if(/^r/.test(v)){
+                Ext.each(v.slice(4, v.length -1).split(','), function(s){
+                    h = parseInt(s, 10);
+                    color += (h < 16 ? '0' : '') + h.toString(16);
+                });
+            }else{
+                v = v.replace('#', '');
+                color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;
+            }
+            return(color.length > 5 ? color.toLowerCase() : defaultValue);
+        },
+
+        /**
+         * Wrapper for setting style properties, also takes single object parameter of multiple styles.
+         * @param {String/Object} property The style property to be set, or an object of multiple styles.
+         * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.
+         * @return {Ext.Element} this
+         */
+        setStyle : function(prop, value){
+            var tmp, style;
+            
+            if (typeof prop != 'object') {
+                tmp = {};
+                tmp[prop] = value;
+                prop = tmp;
+            }
+            for (style in prop) {
+                value = prop[style];
+                style == 'opacity' ?
+                    this.setOpacity(value) :
+                    this.dom.style[chkCache(style)] = value;
+            }
+            return this;
+        },
+
+        /**
+         * Set the opacity of the element
+         * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
+         * @param {Boolean/Object} animate (optional) a standard Element animation config object or <tt>true</tt> for
+         * the default animation (<tt>{duration: .35, easing: 'easeIn'}</tt>)
+         * @return {Ext.Element} this
+         */
+         setOpacity : function(opacity, animate){
+            var me = this,
+                s = me.dom.style;
+
+            if(!animate || !me.anim){
+                if(Ext.isIE){
+                    var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '',
+                    val = s.filter.replace(opacityRe, '').replace(trimRe, '');
+
+                    s.zoom = 1;
+                    s.filter = val + (val.length > 0 ? ' ' : '') + opac;
+                }else{
+                    s.opacity = opacity;
+                }
+            }else{
+                me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');
+            }
+            return me;
+        },
+
+        /**
+         * Clears any opacity settings from this element. Required in some cases for IE.
+         * @return {Ext.Element} this
+         */
+        clearOpacity : function(){
+            var style = this.dom.style;
+            if(Ext.isIE){
+                if(!Ext.isEmpty(style.filter)){
+                    style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');
+                }
+            }else{
+                style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';
+            }
+            return this;
+        },
+
+        /**
+         * Returns the offset height of the element
+         * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
+         * @return {Number} The element's height
+         */
+        getHeight : function(contentHeight){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0;
+
+            h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");
+            return h < 0 ? 0 : h;
+        },
+
+        /**
+         * Returns the offset width of the element
+         * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
+         * @return {Number} The element's width
+         */
+        getWidth : function(contentWidth){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                w = MATH.max(dom.offsetWidth, hidden ? 0 : dom.clientWidth) || 0;
+            w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");
+            return w < 0 ? 0 : w;
+        },
+
+        /**
+         * Set the width of this Element.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setWidth : function(width, animate){
+            var me = this;
+            width = me.adjustWidth(width);
+            !animate || !me.anim ?
+                me.dom.style.width = me.addUnits(width) :
+                me.anim({width : {to : width}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Set the height of this Element.
+         * <pre><code>
+// change the height to 200px and animate with default configuration
+Ext.fly('elementId').setHeight(200, true);
+
+// change the height to 150px and animate with a custom configuration
+Ext.fly('elId').setHeight(150, {
+    duration : .5, // animation will have a duration of .5 seconds
+    // will change the content to "finished"
+    callback: function(){ this.{@link #update}("finished"); }
+});
+         * </code></pre>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels.)</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+         setHeight : function(height, animate){
+            var me = this;
+            height = me.adjustHeight(height);
+            !animate || !me.anim ?
+                me.dom.style.height = me.addUnits(height) :
+                me.anim({height : {to : height}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Gets the width of the border(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the border <b><u>l</u></b>eft width + the border <b><u>r</u></b>ight width.
+         * @return {Number} The width of the sides passed added together
+         */
+        getBorderWidth : function(side){
+            return this.addStyles(side, borders);
+        },
+
+        /**
+         * Gets the width of the padding(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the padding <b><u>l</u></b>eft + the padding <b><u>r</u></b>ight.
+         * @return {Number} The padding of the sides passed added together
+         */
+        getPadding : function(side){
+            return this.addStyles(side, paddings);
+        },
+
+        /**
+         *  Store the current overflow setting and clip overflow on the element - use <tt>{@link #unclip}</tt> to remove
+         * @return {Ext.Element} this
+         */
+        clip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(!data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, true);
+                data(dom, ORIGINALCLIP, {
+                    o: me.getStyle(OVERFLOW),
+                    x: me.getStyle(OVERFLOWX),
+                    y: me.getStyle(OVERFLOWY)
+                });
+                me.setStyle(OVERFLOW, HIDDEN);
+                me.setStyle(OVERFLOWX, HIDDEN);
+                me.setStyle(OVERFLOWY, HIDDEN);
+            }
+            return me;
+        },
+
+        /**
+         *  Return clipping (overflow) to original clipping before <tt>{@link #clip}</tt> was called
+         * @return {Ext.Element} this
+         */
+        unclip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, false);
+                var o = data(dom, ORIGINALCLIP);
+                if(o.o){
+                    me.setStyle(OVERFLOW, o.o);
+                }
+                if(o.x){
+                    me.setStyle(OVERFLOWX, o.x);
+                }
+                if(o.y){
+                    me.setStyle(OVERFLOWY, o.y);
+                }
+            }
+            return me;
+        },
+
+        // private
+        addStyles : function(sides, styles){
+            var ttlSize = 0,
+                sidesArr = sides.match(wordsRe),
+                side,
+                size,
+                i,
+                len = sidesArr.length;
+            for (i = 0; i < len; i++) {
+                side = sidesArr[i];
+                size = side && parseInt(this.getStyle(styles[side]), 10);
+                if (size) {
+                    ttlSize += MATH.abs(size);
+                }
+            }
+            return ttlSize;
+        },
+
+        margins : margins
+    };
+}()
+);
+/**
+ * @class Ext.Element
+ */
+(function(){
+var D = Ext.lib.Dom,
+        LEFT = "left",
+        RIGHT = "right",
+        TOP = "top",
+        BOTTOM = "bottom",
+        POSITION = "position",
+        STATIC = "static",
+        RELATIVE = "relative",
+        AUTO = "auto",
+        ZINDEX = "z-index";
+
+Ext.Element.addMethods({
+	/**
+      * Gets the current X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The X position of the element
+      */
+    getX : function(){
+        return D.getX(this.dom);
+    },
+
+    /**
+      * Gets the current Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The Y position of the element
+      */
+    getY : function(){
+        return D.getY(this.dom);
+    },
+
+    /**
+      * Gets the current position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Array} The XY position of the element
+      */
+    getXY : function(){
+        return D.getXY(this.dom);
+    },
+
+    /**
+      * Returns the offsets of this element from the passed element. Both element must be part of the DOM tree and not have display:none to have page coordinates.
+      * @param {Mixed} element The element to get the offsets from.
+      * @return {Array} The XY page offsets (e.g. [100, -200])
+      */
+    getOffsetsTo : function(el){
+        var o = this.getXY(),
+        	e = Ext.fly(el, '_internal').getXY();
+        return [o[0]-e[0],o[1]-e[1]];
+    },
+
+    /**
+     * Sets the X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The X position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setX : function(x, animate){	    
+	    return this.setXY([x, this.getY()], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The Y position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setY : function(y, animate){	    
+	    return this.setXY([this.getX(), y], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the element's left position directly using CSS style (instead of {@link #setX}).
+     * @param {String} left The left CSS property value
+     * @return {Ext.Element} this
+     */
+    setLeft : function(left){
+        this.setStyle(LEFT, this.addUnits(left));
+        return this;
+    },
+
+    /**
+     * Sets the element's top position directly using CSS style (instead of {@link #setY}).
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+    setTop : function(top){
+        this.setStyle(TOP, this.addUnits(top));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS right style.
+     * @param {String} right The right CSS property value
+     * @return {Ext.Element} this
+     */
+    setRight : function(right){
+        this.setStyle(RIGHT, this.addUnits(right));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS bottom style.
+     * @param {String} bottom The bottom CSS property value
+     * @return {Ext.Element} this
+     */
+    setBottom : function(bottom){
+        this.setStyle(BOTTOM, this.addUnits(bottom));
+        return this;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Array} pos Contains X & Y [x, y] values for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setXY : function(pos, animate){
+	    var me = this;
+        if(!animate || !me.anim){
+            D.setXY(me.dom, pos);
+        }else{
+            me.anim({points: {to: pos}}, me.preanim(arguments, 1), 'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setLocation : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    moveTo : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));        
+    },    
+    
+    /**
+     * Gets the left X coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getLeft : function(local){
+	    return !local ? this.getX() : parseInt(this.getStyle(LEFT), 10) || 0;
+    },
+
+    /**
+     * Gets the right X coordinate of the element (element X position + element width)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getRight : function(local){
+	    var me = this;
+	    return !local ? me.getX() + me.getWidth() : (me.getLeft(true) + me.getWidth()) || 0;
+    },
+
+    /**
+     * Gets the top Y coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getTop : function(local) {
+	    return !local ? this.getY() : parseInt(this.getStyle(TOP), 10) || 0;
+    },
+
+    /**
+     * Gets the bottom Y coordinate of the element (element Y position + element height)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getBottom : function(local){
+	    var me = this;
+	    return !local ? me.getY() + me.getHeight() : (me.getTop(true) + me.getHeight()) || 0;
+    },
+
+    /**
+    * Initializes positioning on this element. If a desired position is not passed, it will make the
+    * the element positioned relative IF it is not already positioned.
+    * @param {String} pos (optional) Positioning to use "relative", "absolute" or "fixed"
+    * @param {Number} zIndex (optional) The zIndex to apply
+    * @param {Number} x (optional) Set the page X position
+    * @param {Number} y (optional) Set the page Y position
+    */
+    position : function(pos, zIndex, x, y){
+	    var me = this;
+	    
+        if(!pos && me.isStyle(POSITION, STATIC)){           
+            me.setStyle(POSITION, RELATIVE);           
+        } else if(pos) {
+            me.setStyle(POSITION, pos);
+        }
+        if(zIndex){
+            me.setStyle(ZINDEX, zIndex);
+        }
+        if(x || y) me.setXY([x || false, y || false]);
+    },
+
+    /**
+    * Clear positioning back to the default when the document was loaded
+    * @param {String} value (optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.
+    * @return {Ext.Element} this
+     */
+    clearPositioning : function(value){
+        value = value || '';
+        this.setStyle({
+            left : value,
+            right : value,
+            top : value,
+            bottom : value,
+            "z-index" : "",
+            position : STATIC
+        });
+        return this;
+    },
+
+    /**
+    * Gets an object with all CSS positioning properties. Useful along with setPostioning to get
+    * snapshot before performing an update and then restoring the element.
+    * @return {Object}
+    */
+    getPositioning : function(){
+        var l = this.getStyle(LEFT);
+        var t = this.getStyle(TOP);
+        return {
+            "position" : this.getStyle(POSITION),
+            "left" : l,
+            "right" : l ? "" : this.getStyle(RIGHT),
+            "top" : t,
+            "bottom" : t ? "" : this.getStyle(BOTTOM),
+            "z-index" : this.getStyle(ZINDEX)
+        };
+    },
+    
+    /**
+    * Set positioning with an object returned by getPositioning().
+    * @param {Object} posCfg
+    * @return {Ext.Element} this
+     */
+    setPositioning : function(pc){
+	    var me = this,
+	    	style = me.dom.style;
+	    	
+        me.setStyle(pc);
+        
+        if(pc.right == AUTO){
+            style.right = "";
+        }
+        if(pc.bottom == AUTO){
+            style.bottom = "";
+        }
+        
+        return me;
+    },    
+	
+    /**
+     * Translates the passed page coordinates into left/top css values for this element
+     * @param {Number/Array} x The page x or an array containing [x, y]
+     * @param {Number} y (optional) The page y, required if x is not an array
+     * @return {Object} An object with left and top properties. e.g. {left: (value), top: (value)}
+     */
+    translatePoints : function(x, y){        	     
+	    y = isNaN(x[1]) ? y : x[1];
+        x = isNaN(x[0]) ? x : x[0];
+        var me = this,
+        	relative = me.isStyle(POSITION, RELATIVE),
+        	o = me.getXY(),
+        	l = parseInt(me.getStyle(LEFT), 10),
+        	t = parseInt(me.getStyle(TOP), 10);
+        
+        l = !isNaN(l) ? l : (relative ? 0 : me.dom.offsetLeft);
+        t = !isNaN(t) ? t : (relative ? 0 : me.dom.offsetTop);        
+
+        return {left: (x - o[0] + l), top: (y - o[1] + t)}; 
+    },
+    
+    animTest : function(args, animate, i) {
+        return !!animate && this.preanim ? this.preanim(args, i) : false;
+    }
+});
+})();/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Returns true if this element is scrollable.
+     * @return {Boolean}
+     */
+    isScrollable : function(){
+        var dom = this.dom;
+        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
+    },
+
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value.
+     * @return {Element} this
+     */
+    scrollTo : function(side, value){
+        this.dom["scroll" + (/top/i.test(side) ? "Top" : "Left")] = value;
+        return this;
+    },
+
+    /**
+     * Returns the current scroll position of the element.
+     * @return {Object} An object containing the scroll position in the format {left: (scrollLeft), top: (scrollTop)}
+     */
+    getScroll : function(){
+        var d = this.dom, 
+            doc = document,
+            body = doc.body,
+            docElement = doc.documentElement,
+            l,
+            t,
+            ret;
+
+        if(d == doc || d == body){
+            if(Ext.isIE && Ext.isStrict){
+                l = docElement.scrollLeft; 
+                t = docElement.scrollTop;
+            }else{
+                l = window.pageXOffset;
+                t = window.pageYOffset;
+            }
+            ret = {left: l || (body ? body.scrollLeft : 0), top: t || (body ? body.scrollTop : 0)};
+        }else{
+            ret = {left: d.scrollLeft, top: d.scrollTop};
+        }
+        return ret;
+    }
+});/**
+ * @class Ext.Element
+ */
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use visibility to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.VISIBILITY = 1;
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use display to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.DISPLAY = 2;
+
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use offsets (x and y positioning offscreen)
+ * to hide element.
+ * @static
+ * @type Number
+ */
+Ext.Element.OFFSETS = 3;
+
+
+Ext.Element.ASCLASS = 4;
+
+/**
+ * Defaults to 'x-hide-nosize'
+ * @static
+ * @type String
+ */
+Ext.Element.visibilityCls = 'x-hide-nosize';
+
+Ext.Element.addMethods(function(){
+    var El = Ext.Element,
+        OPACITY = "opacity",
+        VISIBILITY = "visibility",
+        DISPLAY = "display",
+        HIDDEN = "hidden",
+        OFFSETS = "offsets",
+        ASCLASS = "asclass",
+        NONE = "none",
+        NOSIZE = 'nosize',
+        ORIGINALDISPLAY = 'originalDisplay',
+        VISMODE = 'visibilityMode',
+        ISVISIBLE = 'isVisible',
+        data = El.data,
+        getDisplay = function(dom){
+            var d = data(dom, ORIGINALDISPLAY);
+            if(d === undefined){
+                data(dom, ORIGINALDISPLAY, d = '');
+            }
+            return d;
+        },
+        getVisMode = function(dom){
+            var m = data(dom, VISMODE);
+            if(m === undefined){
+                data(dom, VISMODE, m = 1);
+            }
+            return m;
+        };
+
+    return {
+        /**
+         * The element's default display mode  (defaults to "")
+         * @type String
+         */
+        originalDisplay : "",
+        visibilityMode : 1,
+
+        /**
+         * Sets the element's visibility mode. When setVisible() is called it
+         * will use this to determine whether to set the visibility or the display property.
+         * @param {Number} visMode Ext.Element.VISIBILITY or Ext.Element.DISPLAY
+         * @return {Ext.Element} this
+         */
+        setVisibilityMode : function(visMode){
+            data(this.dom, VISMODE, visMode);
+            return this;
+        },
+
+        /**
+         * Perform custom animation on this element.
+         * <div><ul class="mdetail-params">
+         * <li><u>Animation Properties</u></li>
+         *
+         * <p>The Animation Control Object enables gradual transitions for any member of an
+         * element's style object that takes a numeric value including but not limited to
+         * these properties:</p><div><ul class="mdetail-params">
+         * <li><tt>bottom, top, left, right</tt></li>
+         * <li><tt>height, width</tt></li>
+         * <li><tt>margin, padding</tt></li>
+         * <li><tt>borderWidth</tt></li>
+         * <li><tt>opacity</tt></li>
+         * <li><tt>fontSize</tt></li>
+         * <li><tt>lineHeight</tt></li>
+         * </ul></div>
+         *
+         *
+         * <li><u>Animation Property Attributes</u></li>
+         *
+         * <p>Each Animation Property is a config object with optional properties:</p>
+         * <div><ul class="mdetail-params">
+         * <li><tt>by</tt>*  : relative change - start at current value, change by this value</li>
+         * <li><tt>from</tt> : ignore current value, start from this value</li>
+         * <li><tt>to</tt>*  : start at current value, go to this value</li>
+         * <li><tt>unit</tt> : any allowable unit specification</li>
+         * <p>* do not specify both <tt>to</tt> and <tt>by</tt> for an animation property</p>
+         * </ul></div>
+         *
+         * <li><u>Animation Types</u></li>
+         *
+         * <p>The supported animation types:</p><div><ul class="mdetail-params">
+         * <li><tt>'run'</tt> : Default
+         * <pre><code>
+var el = Ext.get('complexEl');
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'run'      // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'color'</tt>
+         * <p>Animates transition of background, text, or border colors.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        color: { to: '#06e' },
+        backgroundColor: { to: '#e06' }
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'color'    // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         *
+         * <li><tt>'motion'</tt>
+         * <p>Animates the motion of an element to/from specific points using optional bezier
+         * way points during transit.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+        points: {
+            to: [50, 100],  // go to this point
+            control: [      // optional bezier way points
+                [ 600, 800],
+                [-100, 200]
+            ]
+        }
+    },
+    3000,      // animation duration (milliseconds!)
+    null,      // callback
+    'easeOut', // easing method
+    'motion'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'scroll'</tt>
+         * <p>Animate horizontal or vertical scrolling of an overflowing page element.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        scroll: {to: [400, 300]}
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'scroll'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * </ul></div>
+         *
+         * </ul></div>
+         *
+         * @param {Object} args The animation control args
+         * @param {Float} duration (optional) How long the animation lasts in seconds (defaults to <tt>.35</tt>)
+         * @param {Function} onComplete (optional) Function to call when animation completes
+         * @param {String} easing (optional) {@link Ext.Fx#easing} method to use (defaults to <tt>'easeOut'</tt>)
+         * @param {String} animType (optional) <tt>'run'</tt> is the default. Can also be <tt>'color'</tt>,
+         * <tt>'motion'</tt>, or <tt>'scroll'</tt>
+         * @return {Ext.Element} this
+         */
+        animate : function(args, duration, onComplete, easing, animType){
+            this.anim(args, {duration: duration, callback: onComplete, easing: easing}, animType);
+            return this;
+        },
+
+        /*
+         * @private Internal animation call
+         */
+        anim : function(args, opt, animType, defaultDur, defaultEase, cb){
+            animType = animType || 'run';
+            opt = opt || {};
+            var me = this,
+                anim = Ext.lib.Anim[animType](
+                    me.dom,
+                    args,
+                    (opt.duration || defaultDur) || .35,
+                    (opt.easing || defaultEase) || 'easeOut',
+                    function(){
+                        if(cb) cb.call(me);
+                        if(opt.callback) opt.callback.call(opt.scope || me, me, opt);
+                    },
+                    me
+                );
+            opt.anim = anim;
+            return anim;
+        },
+
+        // private legacy anim prep
+        preanim : function(a, i){
+            return !a[i] ? false : (typeof a[i] == 'object' ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]});
+        },
+
+        /**
+         * Checks whether the element is currently visible using both visibility and display properties.
+         * @return {Boolean} True if the element is currently visible, else false
+         */
+        isVisible : function() {
+            var me = this,
+                dom = me.dom,
+                visible = data(dom, ISVISIBLE);
+
+            if(typeof visible == 'boolean'){ //return the cached value if registered
+                return visible;
+            }
+            //Determine the current state based on display states
+            visible = !me.isStyle(VISIBILITY, HIDDEN) &&
+                      !me.isStyle(DISPLAY, NONE) &&
+                      !((getVisMode(dom) == El.ASCLASS) && me.hasClass(me.visibilityCls || El.visibilityCls));
+
+            data(dom, ISVISIBLE, visible);
+            return visible;
+        },
+
+        /**
+         * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use
+         * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.
+         * @param {Boolean} visible Whether the element is visible
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setVisible : function(visible, animate){
+            var me = this, isDisplay, isVisibility, isOffsets, isNosize,
+                dom = me.dom,
+                visMode = getVisMode(dom);
+
+
+            // hideMode string override
+            if (typeof animate == 'string'){
+                switch (animate) {
+                    case DISPLAY:
+                        visMode = El.DISPLAY;
+                        break;
+                    case VISIBILITY:
+                        visMode = El.VISIBILITY;
+                        break;
+                    case OFFSETS:
+                        visMode = El.OFFSETS;
+                        break;
+                    case NOSIZE:
+                    case ASCLASS:
+                        visMode = El.ASCLASS;
+                        break;
+                }
+                me.setVisibilityMode(visMode);
+                animate = false;
+            }
+
+            if (!animate || !me.anim) {
+                if(visMode == El.ASCLASS ){
+
+                    me[visible?'removeClass':'addClass'](me.visibilityCls || El.visibilityCls);
+
+                } else if (visMode == El.DISPLAY){
+
+                    return me.setDisplayed(visible);
+
+                } else if (visMode == El.OFFSETS){
+
+                    if (!visible){
+                        me.hideModeStyles = {
+                            position: me.getStyle('position'),
+                            top: me.getStyle('top'),
+                            left: me.getStyle('left')
+                        };
+                        me.applyStyles({position: 'absolute', top: '-10000px', left: '-10000px'});
+                    } else {
+                        me.applyStyles(me.hideModeStyles || {position: '', top: '', left: ''});
+                        delete me.hideModeStyles;
+                    }
+
+                }else{
+                    me.fixDisplay();
+                    dom.style.visibility = visible ? "visible" : HIDDEN;
+                }
+            }else{
+                // closure for composites
+                if(visible){
+                    me.setOpacity(.01);
+                    me.setVisible(true);
+                }
+                me.anim({opacity: { to: (visible?1:0) }},
+                        me.preanim(arguments, 1),
+                        null,
+                        .35,
+                        'easeIn',
+                        function(){
+                            visible || me.setVisible(false).setOpacity(1);
+                        });
+            }
+            data(dom, ISVISIBLE, visible);  //set logical visibility state
+            return me;
+        },
+
+
+        /**
+         * @private
+         * Determine if the Element has a relevant height and width available based
+         * upon current logical visibility state
+         */
+        hasMetrics  : function(){
+            var dom = this.dom;
+            return this.isVisible() || (getVisMode(dom) == El.VISIBILITY);
+        },
+
+        /**
+         * Toggles the element's visibility or display, depending on visibility mode.
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        toggle : function(animate){
+            var me = this;
+            me.setVisible(!me.isVisible(), me.preanim(arguments, 0));
+            return me;
+        },
+
+        /**
+         * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true.
+         * @param {Mixed} value Boolean value to display the element using its default display, or a string to set the display directly.
+         * @return {Ext.Element} this
+         */
+        setDisplayed : function(value) {
+            if(typeof value == "boolean"){
+               value = value ? getDisplay(this.dom) : NONE;
+            }
+            this.setStyle(DISPLAY, value);
+            return this;
+        },
+
+        // private
+        fixDisplay : function(){
+            var me = this;
+            if(me.isStyle(DISPLAY, NONE)){
+                me.setStyle(VISIBILITY, HIDDEN);
+                me.setStyle(DISPLAY, getDisplay(this.dom)); // first try reverting to default
+                if(me.isStyle(DISPLAY, NONE)){ // if that fails, default to block
+                    me.setStyle(DISPLAY, "block");
+                }
+            }
+        },
+
+        /**
+         * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        hide : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(false, animate);
+                return this;
+            }
+            this.setVisible(false, this.preanim(arguments, 0));
+            return this;
+        },
+
+        /**
+        * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+        * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        show : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(true, animate);
+                return this;
+            }
+            this.setVisible(true, this.preanim(arguments, 0));
+            return this;
+        }
+    };
+}());(function(){
+    // contants
+    var NULL = null,
+        UNDEFINED = undefined,
+        TRUE = true,
+        FALSE = false,
+        SETX = "setX",
+        SETY = "setY",
+        SETXY = "setXY",
+        LEFT = "left",
+        BOTTOM = "bottom",
+        TOP = "top",
+        RIGHT = "right",
+        HEIGHT = "height",
+        WIDTH = "width",
+        POINTS = "points",
+        HIDDEN = "hidden",
+        ABSOLUTE = "absolute",
+        VISIBLE = "visible",
+        MOTION = "motion",
+        POSITION = "position",
+        EASEOUT = "easeOut",
+        /*
+         * Use a light flyweight here since we are using so many callbacks and are always assured a DOM element
+         */
+        flyEl = new Ext.Element.Flyweight(),
+        queues = {},
+        getObject = function(o){
+            return o || {};
+        },
+        fly = function(dom){
+            flyEl.dom = dom;
+            flyEl.id = Ext.id(dom);
+            return flyEl;
+        },
+        /*
+         * Queueing now stored outside of the element due to closure issues
+         */
+        getQueue = function(id){
+            if(!queues[id]){
+                queues[id] = [];
+            }
+            return queues[id];
+        },
+        setQueue = function(id, value){
+            queues[id] = value;
+        };
+        
+//Notifies Element that fx methods are available
+Ext.enableFx = TRUE;
+
+/**
+ * @class Ext.Fx
+ * <p>A class to provide basic animation and visual effects support.  <b>Note:</b> This class is automatically applied
+ * to the {@link Ext.Element} interface when included, so all effects calls should be performed via {@link Ext.Element}.
+ * Conversely, since the effects are not actually defined in {@link Ext.Element}, Ext.Fx <b>must</b> be
+ * {@link Ext#enableFx included} in order for the Element effects to work.</p><br/>
+ * 
+ * <p><b><u>Method Chaining</u></b></p>
+ * <p>It is important to note that although the Fx methods and many non-Fx Element methods support "method chaining" in that
+ * they return the Element object itself as the method return value, it is not always possible to mix the two in a single
+ * method chain.  The Fx methods use an internal effects queue so that each effect can be properly timed and sequenced.
+ * Non-Fx methods, on the other hand, have no such internal queueing and will always execute immediately.  For this reason,
+ * while it may be possible to mix certain Fx and non-Fx method calls in a single chain, it may not always provide the
+ * expected results and should be done with care.  Also see <tt>{@link #callback}</tt>.</p><br/>
+ *
+ * <p><b><u>Anchor Options for Motion Effects</u></b></p>
+ * <p>Motion effects support 8-way anchoring, meaning that you can choose one of 8 different anchor points on the Element
+ * that will serve as either the start or end point of the animation.  Following are all of the supported anchor positions:</p>
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+ * <b>Note</b>: some Fx methods accept specific custom config parameters.  The options shown in the Config Options
+ * section below are common options that can be passed to any Fx method unless otherwise noted.</b>
+ * 
+ * @cfg {Function} callback A function called when the effect is finished.  Note that effects are queued internally by the
+ * Fx class, so a callback is not required to specify another effect -- effects can simply be chained together
+ * and called in sequence (see note for <b><u>Method Chaining</u></b> above), for example:<pre><code>
+ * el.slideIn().highlight();
+ * </code></pre>
+ * The callback is intended for any additional code that should run once a particular effect has completed. The Element
+ * being operated upon is passed as the first parameter.
+ * 
+ * @cfg {Object} scope The scope (<code>this</code> reference) in which the <tt>{@link #callback}</tt> function is executed. Defaults to the browser window.
+ * 
+ * @cfg {String} easing A valid Ext.lib.Easing value for the effect:</p><div class="mdetail-params"><ul>
+ * <li><b><tt>backBoth</tt></b></li>
+ * <li><b><tt>backIn</tt></b></li>
+ * <li><b><tt>backOut</tt></b></li>
+ * <li><b><tt>bounceBoth</tt></b></li>
+ * <li><b><tt>bounceIn</tt></b></li>
+ * <li><b><tt>bounceOut</tt></b></li>
+ * <li><b><tt>easeBoth</tt></b></li>
+ * <li><b><tt>easeBothStrong</tt></b></li>
+ * <li><b><tt>easeIn</tt></b></li>
+ * <li><b><tt>easeInStrong</tt></b></li>
+ * <li><b><tt>easeNone</tt></b></li>
+ * <li><b><tt>easeOut</tt></b></li>
+ * <li><b><tt>easeOutStrong</tt></b></li>
+ * <li><b><tt>elasticBoth</tt></b></li>
+ * <li><b><tt>elasticIn</tt></b></li>
+ * <li><b><tt>elasticOut</tt></b></li>
+ * </ul></div>
+ *
+ * @cfg {String} afterCls A css class to apply after the effect
+ * @cfg {Number} duration The length of time (in seconds) that the effect should last
+ * 
+ * @cfg {Number} endOpacity Only applicable for {@link #fadeIn} or {@link #fadeOut}, a number between
+ * <tt>0</tt> and <tt>1</tt> inclusive to configure the ending opacity value.
+ *  
+ * @cfg {Boolean} remove Whether the Element should be removed from the DOM and destroyed after the effect finishes
+ * @cfg {Boolean} useDisplay Whether to use the <i>display</i> CSS property instead of <i>visibility</i> when hiding Elements (only applies to 
+ * effects that end with the element being visually hidden, ignored otherwise)
+ * @cfg {String/Object/Function} afterStyle A style specification string, e.g. <tt>"width:100px"</tt>, or an object
+ * in the form <tt>{width:"100px"}</tt>, or a function which returns such a specification that will be applied to the
+ * Element after the effect finishes.
+ * @cfg {Boolean} block Whether the effect should block other effects from queueing while it runs
+ * @cfg {Boolean} concurrent Whether to allow subsequently-queued effects to run at the same time as the current effect, or to ensure that they run in sequence
+ * @cfg {Boolean} stopFx Whether preceding effects should be stopped and removed before running current effect (only applies to non blocking effects)
+ */
+Ext.Fx = {
+    
+    // private - calls the function taking arguments from the argHash based on the key.  Returns the return value of the function.
+    //           this is useful for replacing switch statements (for example).
+    switchStatements : function(key, fn, argHash){
+        return fn.apply(this, argHash[key]);
+    },
+    
+    /**
+     * Slides the element into view.  An anchor point can be optionally passed to set the point of
+     * origin for the slide effect.  This function automatically handles wrapping the element with
+     * a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element in from the top
+el.slideIn();
+
+// custom: slide the element in from the right with a 2-second duration
+el.slideIn('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideIn('t', {
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideIn : function(anchor, o){ 
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy,
+            r,
+            b,              
+            wrap,               
+            after,
+            st,
+            args, 
+            pt,
+            bw,
+            bh;
+            
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){            
+            xy = fly(dom).getXY();
+            // fix display to visibility
+            fly(dom).fixDisplay();            
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore();      
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+            
+            // fixed size for slide
+            fly(dom).setWidth(b.width).setHeight(b.height);            
+            
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, HIDDEN);
+            
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            
+            // clear out temp styles after slide and unwrap
+            function after(){
+                 fly(dom).fxUnwrap(wrap, r.pos, o);
+                 st.width = r.width;
+                 st.height = r.height;
+                 fly(dom).afterFx(o);
+            }
+            
+            // time to calculate the positions        
+            pt = {to: [b.x, b.y]}; 
+            bw = {to: b.width};
+            bh = {to: b.height};
+                
+            function argCalc(wrap, style, ww, wh, sXY, sXYval, s1, s2, w, h, p){                    
+                var ret = {};
+                fly(wrap).setWidth(ww).setHeight(wh);
+                if(fly(wrap)[sXY]){
+                    fly(wrap)[sXY](sXYval);                  
+                }
+                style[s1] = style[s2] = "0";                    
+                if(w){
+                    ret.width = w;
+                }
+                if(h){
+                    ret.height = h;
+                }
+                if(p){
+                    ret.points = p;
+                }
+                return ret;
+            };
+
+            args = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                    t  : [wrap, st, b.width, 0, NULL, NULL, LEFT, BOTTOM, NULL, bh, NULL],
+                    l  : [wrap, st, 0, b.height, NULL, NULL, RIGHT, TOP, bw, NULL, NULL],
+                    r  : [wrap, st, b.width, b.height, SETX, b.right, LEFT, TOP, NULL, NULL, pt],
+                    b  : [wrap, st, b.width, b.height, SETY, b.bottom, LEFT, TOP, NULL, bh, pt],
+                    tl : [wrap, st, 0, 0, NULL, NULL, RIGHT, BOTTOM, bw, bh, pt],
+                    bl : [wrap, st, 0, 0, SETY, b.y + b.height, RIGHT, TOP, bw, bh, pt],
+                    br : [wrap, st, 0, 0, SETXY, [b.right, b.bottom], LEFT, TOP, bw, bh, pt],
+                    tr : [wrap, st, 0, 0, SETX, b.x + b.width, LEFT, BOTTOM, bw, bh, pt]
+                });
+            
+            st.visibility = VISIBLE;
+            fly(wrap).show();
+
+            arguments.callee.anim = fly(wrap).fxanim(args,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+    
+    /**
+     * Slides the element out of view.  An anchor point can be optionally passed to set the end point
+     * for the slide effect.  When the effect is completed, the element will be hidden (visibility = 
+     * 'hidden') but block elements will still take up space in the document.  The element must be removed
+     * from the DOM using the 'remove' config option if desired.  This function automatically handles 
+     * wrapping the element with a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element out to the top
+el.slideOut();
+
+// custom: slide the element out to the right with a 2-second duration
+el.slideOut('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideOut('t', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideOut : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy = me.getXY(),
+            wrap,
+            r,
+            b,
+            a,
+            zero = {to: 0}; 
+                    
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore(); 
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+                
+            // fixed size for slide   
+            fly(dom).setWidth(b.width).setHeight(b.height);
+
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, VISIBLE);
+                
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            fly(wrap).setWidth(b.width).setHeight(b.height);            
+
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                
+                fly(dom).fxUnwrap(wrap, r.pos, o);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }            
+            
+            function argCalc(style, s1, s2, p1, v1, p2, v2, p3, v3){                    
+                var ret = {};
+                
+                style[s1] = style[s2] = "0";
+                ret[p1] = v1;               
+                if(p2){
+                    ret[p2] = v2;               
+                }
+                if(p3){
+                    ret[p3] = v3;
+                }
+                
+                return ret;
+            };
+            
+            a = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                t  : [st, LEFT, BOTTOM, HEIGHT, zero],
+                l  : [st, RIGHT, TOP, WIDTH, zero],
+                r  : [st, LEFT, TOP, WIDTH, zero, POINTS, {to : [b.right, b.y]}],
+                b  : [st, LEFT, TOP, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                tl : [st, RIGHT, BOTTOM, WIDTH, zero, HEIGHT, zero],
+                bl : [st, RIGHT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                br : [st, LEFT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x + b.width, b.bottom]}],
+                tr : [st, LEFT, BOTTOM, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.right, b.y]}]
+            });
+            
+            arguments.callee.anim = fly(wrap).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+
+    /**
+     * Fades the element out while slowly expanding it in all directions.  When the effect is completed, the 
+     * element will be hidden (visibility = 'hidden') but block elements will still take up space in the document. 
+     * The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.puff();
+
+// common config options shown with default values
+el.puff({
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    puff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            width,
+            height,
+            r;
+
+        me.queueFx(o, function(){
+            width = fly(dom).getWidth();
+            height = fly(dom).getHeight();
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();                   
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                  
+                fly(dom).clearOpacity();  
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                st.fontSize = '';
+                fly(dom).afterFx(o);
+            }   
+
+            arguments.callee.anim = fly(dom).fxanim({
+                    width : {to : fly(dom).adjustWidth(width * 2)},
+                    height : {to : fly(dom).adjustHeight(height * 2)},
+                    points : {by : [-width * .5, -height * .5]},
+                    opacity : {to : 0},
+                    fontSize: {to : 200, unit: "%"}
+                },
+                o,
+                MOTION,
+                .5,
+                EASEOUT,
+                 after);
+        });
+        return me;
+    },
+
+    /**
+     * Blinks the element as if it was clicked and then collapses on its center (similar to switching off a television).
+     * When the effect is completed, the element will be hidden (visibility = 'hidden') but block elements will still 
+     * take up space in the document. The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.switchOff();
+
+// all config options shown with default values
+el.switchOff({
+    easing: 'easeIn',
+    duration: .3,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    switchOff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            r;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).clip();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+                
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();  
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;   
+                fly(dom).afterFx(o);
+            };
+
+            fly(dom).fxanim({opacity : {to : 0.3}}, 
+                NULL, 
+                NULL, 
+                .1, 
+                NULL, 
+                function(){                                 
+                    fly(dom).clearOpacity();
+                        (function(){                            
+                            fly(dom).fxanim({
+                                height : {to : 1},
+                                points : {by : [0, fly(dom).getHeight() * .5]}
+                            }, 
+                            o, 
+                            MOTION, 
+                            0.3, 
+                            'easeIn', 
+                            after);
+                        }).defer(100);
+                });
+        });
+        return me;
+    },
+
+    /**
+     * Highlights the Element by setting a color (applies to the background-color by default, but can be
+     * changed using the "attr" config option) and then fading back to the original color. If no original
+     * color is available, you should provide the "endColor" config option which will be cleared after the animation.
+     * Usage:
+<pre><code>
+// default: highlight background to yellow
+el.highlight();
+
+// custom: highlight foreground text to blue for 2 seconds
+el.highlight("0000ff", { attr: 'color', duration: 2 });
+
+// common config options shown with default values
+el.highlight("ffff9c", {
+    attr: "background-color", //can be any valid CSS property (attribute) that supports a color value
+    endColor: (current color) or "ffffff",
+    easing: 'easeIn',
+    duration: 1
+});
+</code></pre>
+     * @param {String} color (optional) The highlight color. Should be a 6 char hex color without the leading # (defaults to yellow: 'ffff9c')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */ 
+    highlight : function(color, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            attr = o.attr || "backgroundColor",
+            a = {},
+            restore;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            function after(){
+                dom.style[attr] = restore;
+                fly(dom).afterFx(o);
+            }            
+            restore = dom.style[attr];
+            a[attr] = {from: color || "ffff9c", to: o.endColor || fly(dom).getColor(attr) || "ffffff"};
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                'color',
+                1,
+                'easeIn', 
+                after);
+        });
+        return me;
+    },
+
+   /**
+    * Shows a ripple of exploding, attenuating borders to draw attention to an Element.
+    * Usage:
+<pre><code>
+// default: a single light blue ripple
+el.frame();
+
+// custom: 3 red ripples lasting 3 seconds total
+el.frame("ff0000", 3, { duration: 3 });
+
+// common config options shown with default values
+el.frame("C3DAF9", 1, {
+    duration: 1 //duration of each individual ripple.
+    // Note: Easing is not configurable and will be ignored if included
+});
+</code></pre>
+    * @param {String} color (optional) The color of the border.  Should be a 6 char hex color without the leading # (defaults to light blue: 'C3DAF9').
+    * @param {Number} count (optional) The number of ripples to display (defaults to 1)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    frame : function(color, count, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            proxy,
+            active;
+
+        me.queueFx(o, function(){
+            color = color || '#C3DAF9';
+            if(color.length == 6){
+                color = '#' + color;
+            }            
+            count = count || 1;
+            fly(dom).show();
+
+            var xy = fly(dom).getXY(),
+                b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight},
+                queue = function(){
+                    proxy = fly(document.body || document.documentElement).createChild({
+                        style:{
+                            position : ABSOLUTE,
+                            'z-index': 35000, // yee haw
+                            border : '0px solid ' + color
+                        }
+                    });
+                    return proxy.queueFx({}, animFn);
+                };
+            
+            
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function() {
+                    count = 0;
+                    proxy.stopFx();
+                }
+            };
+            
+            function animFn(){
+                var scale = Ext.isBorderBox ? 2 : 1;
+                active = proxy.anim({
+                    top : {from : b.y, to : b.y - 20},
+                    left : {from : b.x, to : b.x - 20},
+                    borderWidth : {from : 0, to : 10},
+                    opacity : {from : 1, to : 0},
+                    height : {from : b.height, to : b.height + 20 * scale},
+                    width : {from : b.width, to : b.width + 20 * scale}
+                },{
+                    duration: o.duration || 1,
+                    callback: function() {
+                        proxy.remove();
+                        --count > 0 ? queue() : fly(dom).afterFx(o);
+                    }
+                });
+                arguments.callee.anim = {
+                    isAnimated: true,
+                    stop: function(){
+                        active.stop();
+                    }
+                };
+            };
+            queue();
+        });
+        return me;
+    },
+
+   /**
+    * Creates a pause before any subsequent queued effects begin.  If there are
+    * no effects queued after the pause it will have no effect.
+    * Usage:
+<pre><code>
+el.pause(1);
+</code></pre>
+    * @param {Number} seconds The length of time to pause (in seconds)
+    * @return {Ext.Element} The Element
+    */
+    pause : function(seconds){        
+        var dom = this.dom,
+            t;
+
+        this.queueFx({}, function(){
+            t = setTimeout(function(){
+                fly(dom).afterFx({});
+            }, seconds * 1000);
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function(){
+                    clearTimeout(t);
+                    fly(dom).afterFx({});
+                }
+            };
+        });
+        return this;
+    },
+
+   /**
+    * Fade an element in (from transparent to opaque).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.
+    * Usage:
+<pre><code>
+// default: fade in from opacity 0 to 100%
+el.fadeIn();
+
+// custom: fade in from opacity 0 to 75% over 2 seconds
+el.fadeIn({ endOpacity: .75, duration: 2});
+
+// common config options shown with default values
+el.fadeIn({
+    endOpacity: 1, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeIn : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            to = o.endOpacity || 1;
+        
+        me.queueFx(o, function(){
+            fly(dom).setOpacity(0);
+            fly(dom).fixDisplay();
+            dom.style.visibility = VISIBLE;
+            arguments.callee.anim = fly(dom).fxanim({opacity:{to:to}},
+                o, NULL, .5, EASEOUT, function(){
+                if(to == 1){
+                    fly(dom).clearOpacity();
+                }
+                fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Fade an element out (from opaque to transparent).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.  Note that IE may require
+    * <tt>{@link #useDisplay}:true</tt> in order to redisplay correctly.
+    * Usage:
+<pre><code>
+// default: fade out from the element's current opacity to 0
+el.fadeOut();
+
+// custom: fade out from the element's current opacity to 25% over 2 seconds
+el.fadeOut({ endOpacity: .25, duration: 2});
+
+// common config options shown with default values
+el.fadeOut({
+    endOpacity: 0, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeOut : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            style = dom.style,
+            to = o.endOpacity || 0;         
+        
+        me.queueFx(o, function(){  
+            arguments.callee.anim = fly(dom).fxanim({ 
+                opacity : {to : to}},
+                o, 
+                NULL, 
+                .5, 
+                EASEOUT, 
+                function(){
+                    if(to == 0){
+                        Ext.Element.data(dom, 'visibilityMode') == Ext.Element.DISPLAY || o.useDisplay ? 
+                            style.display = "none" :
+                            style.visibility = HIDDEN;
+                            
+                        fly(dom).clearOpacity();
+                    }
+                    fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Animates the transition of an element's dimensions from a starting height/width
+    * to an ending height/width.  This method is a convenience implementation of {@link shift}.
+    * Usage:
+<pre><code>
+// change height and width to 100x100 pixels
+el.scale(100, 100);
+
+// common config options shown with default values.  The height and width will default to
+// the element&#39;s existing values if passed as null.
+el.scale(
+    [element&#39;s width],
+    [element&#39;s height], {
+        easing: 'easeOut',
+        duration: .35
+    }
+);
+</code></pre>
+    * @param {Number} width  The new width (pass undefined to keep the original width)
+    * @param {Number} height  The new height (pass undefined to keep the original height)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    scale : function(w, h, o){
+        this.shift(Ext.apply({}, o, {
+            width: w,
+            height: h
+        }));
+        return this;
+    },
+
+   /**
+    * Animates the transition of any combination of an element's dimensions, xy position and/or opacity.
+    * Any of these properties not specified in the config object will not be changed.  This effect 
+    * requires that at least one new dimension, position or opacity setting must be passed in on
+    * the config object in order for the function to have any effect.
+    * Usage:
+<pre><code>
+// slide the element horizontally to x position 200 while changing the height and opacity
+el.shift({ x: 200, height: 50, opacity: .8 });
+
+// common config options shown with default values.
+el.shift({
+    width: [element&#39;s width],
+    height: [element&#39;s height],
+    x: [element&#39;s x position],
+    y: [element&#39;s y position],
+    opacity: [element&#39;s opacity],
+    easing: 'easeOut',
+    duration: .35
+});
+</code></pre>
+    * @param {Object} options  Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    shift : function(o){
+        o = getObject(o);
+        var dom = this.dom,
+            a = {};
+                
+        this.queueFx(o, function(){
+            for (var prop in o) {
+                if (o[prop] != UNDEFINED) {                                                 
+                    a[prop] = {to : o[prop]};                   
+                }
+            } 
+            
+            a.width ? a.width.to = fly(dom).adjustWidth(o.width) : a;
+            a.height ? a.height.to = fly(dom).adjustWidth(o.height) : a;   
+            
+            if (a.x || a.y || a.xy) {
+                a.points = a.xy || 
+                           {to : [ a.x ? a.x.to : fly(dom).getX(),
+                                   a.y ? a.y.to : fly(dom).getY()]};                  
+            }
+
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o, 
+                MOTION, 
+                .35, 
+                EASEOUT, 
+                function(){
+                    fly(dom).afterFx(o);
+                });
+        });
+        return this;
+    },
+
+    /**
+     * Slides the element while fading it out of view.  An anchor point can be optionally passed to set the 
+     * ending point of the effect.
+     * Usage:
+     *<pre><code>
+// default: slide the element downward while fading out
+el.ghost();
+
+// custom: slide the element out to the right with a 2-second duration
+el.ghost('r', { duration: 2 });
+
+// common config options shown with default values
+el.ghost('b', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to bottom: 'b')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    ghost : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            a = {opacity: {to: 0}, points: {}},
+            pt = a.points,
+            r,
+            w,
+            h;
+            
+        anchor = anchor || "b";
+
+        me.queueFx(o, function(){
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+            w = fly(dom).getWidth();
+            h = fly(dom).getHeight();
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();   
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }
+                
+            pt.by = fly(dom).switchStatements(anchor.toLowerCase(), function(v1,v2){ return [v1, v2];}, {
+               t  : [0, -h],
+               l  : [-w, 0],
+               r  : [w, 0],
+               b  : [0, h],
+               tl : [-w, -h],
+               bl : [-w, h],
+               br : [w, h],
+               tr : [w, -h] 
+            });
+                
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, after);
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after syncFx is called on the element are
+     * run concurrently.  This is the opposite of {@link #sequenceFx}.
+     * @return {Ext.Element} The Element
+     */
+    syncFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : TRUE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after sequenceFx is called on the element are
+     * run in sequence.  This is the opposite of {@link #syncFx}.
+     * @return {Ext.Element} The Element
+     */
+    sequenceFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : FALSE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /* @private */
+    nextFx : function(){        
+        var ef = getQueue(this.dom.id)[0];
+        if(ef){
+            ef.call(this);
+        }
+    },
+
+    /**
+     * Returns true if the element has any effects actively running or queued, else returns false.
+     * @return {Boolean} True if element has active effects, else false
+     */
+    hasActiveFx : function(){
+        return getQueue(this.dom.id)[0];
+    },
+
+    /**
+     * Stops any running effects and clears the element's internal effects queue if it contains
+     * any additional effects that haven't started yet.
+     * @return {Ext.Element} The Element
+     */
+    stopFx : function(finish){
+        var me = this,
+            id = me.dom.id;
+        if(me.hasActiveFx()){
+            var cur = getQueue(id)[0];
+            if(cur && cur.anim){
+                if(cur.anim.isAnimated){
+                    setQueue(id, [cur]); //clear
+                    cur.anim.stop(finish !== undefined ? finish : TRUE);
+                }else{
+                    setQueue(id, []);
+                }
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    beforeFx : function(o){
+        if(this.hasActiveFx() && !o.concurrent){
+           if(o.stopFx){
+               this.stopFx();
+               return TRUE;
+           }
+           return FALSE;
+        }
+        return TRUE;
+    },
+
+    /**
+     * Returns true if the element is currently blocking so that no other effect can be queued
+     * until this effect is finished, else returns false if blocking is not set.  This is commonly
+     * used to ensure that an effect initiated by a user action runs to completion prior to the
+     * same effect being restarted (e.g., firing only one effect even if the user clicks several times).
+     * @return {Boolean} True if blocking, else false
+     */
+    hasFxBlock : function(){
+        var q = getQueue(this.dom.id);
+        return q && q[0] && q[0].block;
+    },
+
+    /* @private */
+    queueFx : function(o, fn){
+        var me = fly(this.dom);
+        if(!me.hasFxBlock()){
+            Ext.applyIf(o, me.fxDefaults);
+            if(!o.concurrent){
+                var run = me.beforeFx(o);
+                fn.block = o.block;
+                getQueue(me.dom.id).push(fn);
+                if(run){
+                    me.nextFx();
+                }
+            }else{
+                fn.call(me);
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    fxWrap : function(pos, o, vis){ 
+        var dom = this.dom,
+            wrap,
+            wrapXY;
+        if(!o.wrap || !(wrap = Ext.getDom(o.wrap))){            
+            if(o.fixPosition){
+                wrapXY = fly(dom).getXY();
+            }
+            var div = document.createElement("div");
+            div.style.visibility = vis;
+            wrap = dom.parentNode.insertBefore(div, dom);
+            fly(wrap).setPositioning(pos);
+            if(fly(wrap).isStyle(POSITION, "static")){
+                fly(wrap).position("relative");
+            }
+            fly(dom).clearPositioning('auto');
+            fly(wrap).clip();
+            wrap.appendChild(dom);
+            if(wrapXY){
+                fly(wrap).setXY(wrapXY);
+            }
+        }
+        return wrap;
+    },
+
+    /* @private */
+    fxUnwrap : function(wrap, pos, o){      
+        var dom = this.dom;
+        fly(dom).clearPositioning();
+        fly(dom).setPositioning(pos);
+        if(!o.wrap){
+            var pn = fly(wrap).dom.parentNode;
+            pn.insertBefore(dom, wrap); 
+            fly(wrap).remove();
+        }
+    },
+
+    /* @private */
+    getFxRestore : function(){
+        var st = this.dom.style;
+        return {pos: this.getPositioning(), width: st.width, height : st.height};
+    },
+
+    /* @private */
+    afterFx : function(o){
+        var dom = this.dom,
+            id = dom.id;
+        if(o.afterStyle){
+            fly(dom).setStyle(o.afterStyle);            
+        }
+        if(o.afterCls){
+            fly(dom).addClass(o.afterCls);
+        }
+        if(o.remove == TRUE){
+            fly(dom).remove();
+        }
+        if(o.callback){
+            o.callback.call(o.scope, fly(dom));
+        }
+        if(!o.concurrent){
+            getQueue(id).shift();
+            fly(dom).nextFx();
+        }
+    },
+
+    /* @private */
+    fxanim : function(args, opt, animType, defaultDur, defaultEase, cb){
+        animType = animType || 'run';
+        opt = opt || {};
+        var anim = Ext.lib.Anim[animType](
+                this.dom, 
+                args,
+                (opt.duration || defaultDur) || .35,
+                (opt.easing || defaultEase) || EASEOUT,
+                cb,            
+                this
+            );
+        opt.anim = anim;
+        return anim;
+    }
+};
+
+// backwards compat
+Ext.Fx.resize = Ext.Fx.scale;
+
+//When included, Ext.Fx is automatically applied to Element so that all basic
+//effects are available directly via the Element API
+Ext.Element.addMethods(Ext.Fx);
+})();
+/**
+ * @class Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * Example:<pre><code>
+var els = Ext.select("#some-el div.some-class");
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class');
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code>
+ */
+Ext.CompositeElementLite = function(els, root){
+    /**
+     * <p>The Array of DOM elements which this CompositeElement encapsulates. Read-only.</p>
+     * <p>This will not <i>usually</i> be accessed in developers' code, but developers wishing
+     * to augment the capabilities of the CompositeElementLite class may use it when adding
+     * methods to the class.</p>
+     * <p>For example to add the <code>nextAll</code> method to the class to <b>add</b> all
+     * following siblings of selected elements, the code would be</p><code><pre>
+Ext.override(Ext.CompositeElementLite, {
+    nextAll: function() {
+        var els = this.elements, i, l = els.length, n, r = [], ri = -1;
+
+//      Loop through all elements in this Composite, accumulating
+//      an Array of all siblings.
+        for (i = 0; i < l; i++) {
+            for (n = els[i].nextSibling; n; n = n.nextSibling) {
+                r[++ri] = n;
+            }
+        }
+
+//      Add all found siblings to this Composite
+        return this.add(r);
+    }
+});</pre></code>
+     * @type Array
+     * @property elements
+     */
+    this.elements = [];
+    this.add(els, root);
+    this.el = new Ext.Element.Flyweight();
+};
+
+Ext.CompositeElementLite.prototype = {
+    isComposite: true,
+
+    // private
+    getElement : function(el){
+        // Set the shared flyweight dom property to the current element
+        var e = this.el;
+        e.dom = el;
+        e.id = el.id;
+        return e;
+    },
+
+    // private
+    transformElement : function(el){
+        return Ext.getDom(el);
+    },
+
+    /**
+     * Returns the number of elements in this Composite.
+     * @return Number
+     */
+    getCount : function(){
+        return this.elements.length;
+    },
+    /**
+     * Adds elements to this Composite object.
+     * @param {Mixed} els Either an Array of DOM elements to add, or another Composite object who's elements should be added.
+     * @return {CompositeElement} This Composite object.
+     */
+    add : function(els, root){
+        var me = this,
+            elements = me.elements;
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }else if(els.isComposite){
+            els = els.elements;
+        }else if(!Ext.isIterable(els)){
+            els = [els];
+        }
+
+        for(var i = 0, len = els.length; i < len; ++i){
+            elements.push(me.transformElement(els[i]));
+        }
+        return me;
+    },
+
+    invoke : function(fn, args){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            e,
+            i;
+
+        for(i = 0; i < len; i++) {
+            e = els[i];
+            if(e){
+                Ext.Element.prototype[fn].apply(me.getElement(e), args);
+            }
+        }
+        return me;
+    },
+    /**
+     * Returns a flyweight Element of the dom element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+    item : function(index){
+        var me = this,
+            el = me.elements[index],
+            out = null;
+
+        if(el){
+            out = me.getElement(el);
+        }
+        return out;
+    },
+
+    // fixes scope with flyweight
+    addListener : function(eventName, handler, scope, opt){
+        var els = this.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e) {
+                Ext.EventManager.on(e, eventName, handler, scope || e, opt);
+            }
+        }
+        return this;
+    },
+    /**
+     * <p>Calls the passed function for each element in this composite.</p>
+     * @param {Function} fn The function to call. The function is passed the following parameters:<ul>
+     * <li><b>el</b> : Element<div class="sub-desc">The current Element in the iteration.
+     * <b>This is the flyweight (shared) Ext.Element instance, so if you require a
+     * a reference to the dom node, use el.dom.</b></div></li>
+     * <li><b>c</b> : Composite<div class="sub-desc">This Composite object.</div></li>
+     * <li><b>idx</b> : Number<div class="sub-desc">The zero-based index in the iteration.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<i>this</i> reference) in which the function is executed. (defaults to the Element)
+     * @return {CompositeElement} this
+     */
+    each : function(fn, scope){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e){
+                e = this.getElement(e);
+                if(fn.call(scope || e, e, me, i) === false){
+                    break;
+                }
+            }
+        }
+        return me;
+    },
+
+    /**
+    * Clears this Composite and adds the elements passed.
+    * @param {Mixed} els Either an array of DOM elements, or another Composite from which to fill this Composite.
+    * @return {CompositeElement} this
+    */
+    fill : function(els){
+        var me = this;
+        me.elements = [];
+        me.add(els);
+        return me;
+    },
+
+    /**
+     * Filters this composite to only elements that match the passed selector.
+     * @param {String/Function} selector A string CSS selector or a comparison function.
+     * The comparison function will be called with the following arguments:<ul>
+     * <li><code>el</code> : Ext.Element<div class="sub-desc">The current DOM element.</div></li>
+     * <li><code>index</code> : Number<div class="sub-desc">The current index within the collection.</div></li>
+     * </ul>
+     * @return {CompositeElement} this
+     */
+    filter : function(selector){
+        var els = [],
+            me = this,
+            fn = Ext.isFunction(selector) ? selector
+                : function(el){
+                    return el.is(selector);
+                };
+
+        me.each(function(el, self, i) {
+            if (fn(el, i) !== false) {
+                els[els.length] = me.transformElement(el);
+            }
+        });
+        
+        me.elements = els;
+        return me;
+    },
+
+    /**
+     * Find the index of the passed element within the composite collection.
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Number The index of the passed Ext.Element in the composite collection, or -1 if not found.
+     */
+    indexOf : function(el){
+        return this.elements.indexOf(this.transformElement(el));
+    },
+
+    /**
+    * Replaces the specified element with the passed element.
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * to replace.
+    * @param {Mixed} replacement The id of an element or the Element itself.
+    * @param {Boolean} domReplace (Optional) True to remove and replace the element in the document too.
+    * @return {CompositeElement} this
+    */
+    replaceElement : function(el, replacement, domReplace){
+        var index = !isNaN(el) ? el : this.indexOf(el),
+            d;
+        if(index > -1){
+            replacement = Ext.getDom(replacement);
+            if(domReplace){
+                d = this.elements[index];
+                d.parentNode.insertBefore(replacement, d);
+                Ext.removeNode(d);
+            }
+            this.elements.splice(index, 1, replacement);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all elements.
+     */
+    clear : function(){
+        this.elements = [];
+    }
+};
+
+Ext.CompositeElementLite.prototype.on = Ext.CompositeElementLite.prototype.addListener;
+
+/**
+ * @private
+ * Copies all of the functions from Ext.Element's prototype onto CompositeElementLite's prototype.
+ * This is called twice - once immediately below, and once again after additional Ext.Element
+ * are added in Ext JS
+ */
+Ext.CompositeElementLite.importElementMethods = function() {
+    var fnName,
+        ElProto = Ext.Element.prototype,
+        CelProto = Ext.CompositeElementLite.prototype;
+
+    for (fnName in ElProto) {
+        if (typeof ElProto[fnName] == 'function'){
+            (function(fnName) {
+                CelProto[fnName] = CelProto[fnName] || function() {
+                    return this.invoke(fnName, arguments);
+                };
+            }).call(CelProto, fnName);
+
+        }
+    }
+};
+
+Ext.CompositeElementLite.importElementMethods();
+
+if(Ext.DomQuery){
+    Ext.Element.selectorFunction = Ext.DomQuery.select;
+}
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+    return new Ext.CompositeElementLite(els);
+};
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;
+(function(){
+    var BEFOREREQUEST = "beforerequest",
+        REQUESTCOMPLETE = "requestcomplete",
+        REQUESTEXCEPTION = "requestexception",
+        UNDEFINED = undefined,
+        LOAD = 'load',
+        POST = 'POST',
+        GET = 'GET',
+        WINDOW = window;
+
+    /**
+     * @class Ext.data.Connection
+     * @extends Ext.util.Observable
+     * <p>The class encapsulates a connection to the page's originating domain, allowing requests to be made
+     * either to a configured URL, or to a URL specified at request time.</p>
+     * <p>Requests made by this class are asynchronous, and will return immediately. No data from
+     * the server will be available to the statement immediately following the {@link #request} call.
+     * To process returned data, use a
+     * <a href="#request-option-success" ext:member="request-option-success" ext:cls="Ext.data.Connection">success callback</a>
+     * in the request options object,
+     * or an {@link #requestcomplete event listener}.</p>
+     * <p><h3>File Uploads</h3><a href="#request-option-isUpload" ext:member="request-option-isUpload" ext:cls="Ext.data.Connection">File uploads</a> are not performed using normal "Ajax" techniques, that
+     * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+     * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     * <p>Also note that it's not possible to check the response code of the hidden iframe, so the success handler will ALWAYS fire.</p>
+     * @constructor
+     * @param {Object} config a configuration object.
+     */
+    Ext.data.Connection = function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event beforerequest
+             * Fires before a network request is made to retrieve a data object.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            BEFOREREQUEST,
+            /**
+             * @event requestcomplete
+             * Fires if the request was successfully completed.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTCOMPLETE,
+            /**
+             * @event requestexception
+             * Fires if an error HTTP status was returned from the server.
+             * See <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html">HTTP Status Code Definitions</a>
+             * for details of HTTP status codes.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTEXCEPTION
+        );
+        Ext.data.Connection.superclass.constructor.call(this);
+    };
+
+    Ext.extend(Ext.data.Connection, Ext.util.Observable, {
+        /**
+         * @cfg {String} url (Optional) <p>The default URL to be used for requests to the server. Defaults to undefined.</p>
+         * <p>The <code>url</code> config may be a function which <i>returns</i> the URL to use for the Ajax request. The scope
+         * (<code><b>this</b></code> reference) of the function is the <code>scope</code> option passed to the {@link #request} method.</p>
+         */
+        /**
+         * @cfg {Object} extraParams (Optional) An object containing properties which are used as
+         * extra parameters to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {Object} defaultHeaders (Optional) An object containing request headers which are added
+         *  to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {String} method (Optional) The default HTTP method to be used for requests.
+         * (defaults to undefined; if not set, but {@link #request} params are present, POST will be used;
+         * otherwise, GET will be used.)
+         */
+        /**
+         * @cfg {Number} timeout (Optional) The timeout in milliseconds to be used for requests. (defaults to 30000)
+         */
+        timeout : 30000,
+        /**
+         * @cfg {Boolean} autoAbort (Optional) Whether this request should abort any pending requests. (defaults to false)
+         * @type Boolean
+         */
+        autoAbort:false,
+
+        /**
+         * @cfg {Boolean} disableCaching (Optional) True to add a unique cache-buster param to GET requests. (defaults to true)
+         * @type Boolean
+         */
+        disableCaching: true,
+
+        /**
+         * @cfg {String} disableCachingParam (Optional) Change the parameter which is sent went disabling caching
+         * through a cache buster. Defaults to '_dc'
+         * @type String
+         */
+        disableCachingParam: '_dc',
+
+        /**
+         * <p>Sends an HTTP request to a remote server.</p>
+         * <p><b>Important:</b> Ajax server requests are asynchronous, and this call will
+         * return before the response has been received. Process any returned data
+         * in a callback function.</p>
+         * <pre><code>
+Ext.Ajax.request({
+   url: 'ajax_demo/sample.json',
+   success: function(response, opts) {
+      var obj = Ext.decode(response.responseText);
+      console.dir(obj);
+   },
+   failure: function(response, opts) {
+      console.log('server-side failure with status code ' + response.status);
+   }
+});
+         * </code></pre>
+         * <p>To execute a callback function in the correct scope, use the <tt>scope</tt> option.</p>
+         * @param {Object} options An object which may contain the following properties:<ul>
+         * <li><b>url</b> : String/Function (Optional)<div class="sub-desc">The URL to
+         * which to send the request, or a function to call which returns a URL string. The scope of the
+         * function is specified by the <tt>scope</tt> option. Defaults to the configured
+         * <tt>{@link #url}</tt>.</div></li>
+         * <li><b>params</b> : Object/String/Function (Optional)<div class="sub-desc">
+         * An object containing properties which are used as parameters to the
+         * request, a url encoded string or a function to call to get either. The scope of the function
+         * is specified by the <tt>scope</tt> option.</div></li>
+         * <li><b>method</b> : String (Optional)<div class="sub-desc">The HTTP method to use
+         * for the request. Defaults to the configured method, or if no method was configured,
+         * "GET" if no parameters are being sent, and "POST" if parameters are being sent.  Note that
+         * the method name is case-sensitive and should be all caps.</div></li>
+         * <li><b>callback</b> : Function (Optional)<div class="sub-desc">The
+         * function to be called upon receipt of the HTTP response. The callback is
+         * called regardless of success or failure and is passed the following
+         * parameters:<ul>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * <li><b>success</b> : Boolean<div class="sub-desc">True if the request succeeded.</div></li>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.
+         * See <a href="http://www.w3.org/TR/XMLHttpRequest/">http://www.w3.org/TR/XMLHttpRequest/</a> for details about
+         * accessing elements of the response.</div></li>
+         * </ul></div></li>
+         * <li><a id="request-option-success"></a><b>success</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon success of the request. The callback is passed the following
+         * parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>failure</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon failure of the request. The callback is passed the
+         * following parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>scope</b> : Object (Optional)<div class="sub-desc">The scope in
+         * which to execute the callbacks: The "this" object for the callback function. If the <tt>url</tt>, or <tt>params</tt> options were
+         * specified as functions from which to draw values, then this also serves as the scope for those function calls.
+         * Defaults to the browser window.</div></li>
+         * <li><b>timeout</b> : Number (Optional)<div class="sub-desc">The timeout in milliseconds to be used for this request. Defaults to 30 seconds.</div></li>
+         * <li><b>form</b> : Element/HTMLElement/String (Optional)<div class="sub-desc">The <tt>&lt;form&gt;</tt>
+         * Element or the id of the <tt>&lt;form&gt;</tt> to pull parameters from.</div></li>
+         * <li><a id="request-option-isUpload"></a><b>isUpload</b> : Boolean (Optional)<div class="sub-desc"><b>Only meaningful when used
+         * with the <tt>form</tt> option</b>.
+         * <p>True if the form object is a file upload (will be set automatically if the form was
+         * configured with <b><tt>enctype</tt></b> "multipart/form-data").</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <tt>&lt;form></tt> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+         * server is using JSON to send the return object, then the
+         * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+         * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+         * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+         * is created containing a <tt>responseText</tt> property in order to conform to the
+         * requirements of event handlers and callbacks.</p>
+         * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * </div></li>
+         * <li><b>headers</b> : Object (Optional)<div class="sub-desc">Request
+         * headers to set for the request.</div></li>
+         * <li><b>xmlData</b> : Object (Optional)<div class="sub-desc">XML document
+         * to use for the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>jsonData</b> : Object/String (Optional)<div class="sub-desc">JSON
+         * data to use as the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>disableCaching</b> : Boolean (Optional)<div class="sub-desc">True
+         * to add a unique cache-buster param to GET requests.</div></li>
+         * </ul></p>
+         * <p>The options object may also contain any other property which might be needed to perform
+         * postprocessing in a callback because it is passed to callback functions.</p>
+         * @return {Number} transactionId The id of the server transaction. This may be used
+         * to cancel the request.
+         */
+        request : function(o){
+            var me = this;
+            if(me.fireEvent(BEFOREREQUEST, me, o)){
+                if (o.el) {
+                    if(!Ext.isEmpty(o.indicatorText)){
+                        me.indicatorText = '<div class="loading-indicator">'+o.indicatorText+"</div>";
+                    }
+                    if(me.indicatorText) {
+                        Ext.getDom(o.el).innerHTML = me.indicatorText;
+                    }
+                    o.success = (Ext.isFunction(o.success) ? o.success : function(){}).createInterceptor(function(response) {
+                        Ext.getDom(o.el).innerHTML = response.responseText;
+                    });
+                }
+
+                var p = o.params,
+                    url = o.url || me.url,
+                    method,
+                    cb = {success: me.handleResponse,
+                          failure: me.handleFailure,
+                          scope: me,
+                          argument: {options: o},
+                          timeout : Ext.num(o.timeout, me.timeout)
+                    },
+                    form,
+                    serForm;
+
+
+                if (Ext.isFunction(p)) {
+                    p = p.call(o.scope||WINDOW, o);
+                }
+
+                p = Ext.urlEncode(me.extraParams, Ext.isObject(p) ? Ext.urlEncode(p) : p);
+
+                if (Ext.isFunction(url)) {
+                    url = url.call(o.scope || WINDOW, o);
+                }
+
+                if((form = Ext.getDom(o.form))){
+                    url = url || form.action;
+                     if(o.isUpload || (/multipart\/form-data/i.test(form.getAttribute("enctype")))) {
+                         return me.doFormUpload.call(me, o, p, url);
+                     }
+                    serForm = Ext.lib.Ajax.serializeForm(form);
+                    p = p ? (p + '&' + serForm) : serForm;
+                }
+
+                method = o.method || me.method || ((p || o.xmlData || o.jsonData) ? POST : GET);
+
+                if(method === GET && (me.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
+                    var dcp = o.disableCachingParam || me.disableCachingParam;
+                    url = Ext.urlAppend(url, dcp + '=' + (new Date().getTime()));
+                }
+
+                o.headers = Ext.applyIf(o.headers || {}, me.defaultHeaders || {});
+
+                if(o.autoAbort === true || me.autoAbort) {
+                    me.abort();
+                }
+
+                if((method == GET || o.xmlData || o.jsonData) && p){
+                    url = Ext.urlAppend(url, p);
+                    p = '';
+                }
+                return (me.transId = Ext.lib.Ajax.request(method, url, cb, p, o));
+            }else{
+                return o.callback ? o.callback.apply(o.scope, [o,UNDEFINED,UNDEFINED]) : null;
+            }
+        },
+
+        /**
+         * Determine whether this object has a request outstanding.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         * @return {Boolean} True if there is an outstanding request.
+         */
+        isLoading : function(transId){
+            return transId ? Ext.lib.Ajax.isCallInProgress(transId) : !! this.transId;
+        },
+
+        /**
+         * Aborts any outstanding request.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         */
+        abort : function(transId){
+            if(transId || this.isLoading()){
+                Ext.lib.Ajax.abort(transId || this.transId);
+            }
+        },
+
+        // private
+        handleResponse : function(response){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTCOMPLETE, this, response, options);
+            if(options.success){
+                options.success.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, true, response);
+            }
+        },
+
+        // private
+        handleFailure : function(response, e){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTEXCEPTION, this, response, options, e);
+            if(options.failure){
+                options.failure.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, false, response);
+            }
+        },
+
+        // private
+        doFormUpload : function(o, ps, url){
+            var id = Ext.id(),
+                doc = document,
+                frame = doc.createElement('iframe'),
+                form = Ext.getDom(o.form),
+                hiddens = [],
+                hd,
+                encoding = 'multipart/form-data',
+                buf = {
+                    target: form.target,
+                    method: form.method,
+                    encoding: form.encoding,
+                    enctype: form.enctype,
+                    action: form.action
+                };
+
+            /*
+             * Originally this behaviour was modified for Opera 10 to apply the secure URL after
+             * the frame had been added to the document. It seems this has since been corrected in
+             * Opera so the behaviour has been reverted, the URL will be set before being added.
+             */
+            Ext.fly(frame).set({
+                id: id,
+                name: id,
+                cls: 'x-hidden',
+                src: Ext.SSL_SECURE_URL
+            }); 
+
+            doc.body.appendChild(frame);
+
+            // This is required so that IE doesn't pop the response up in a new window.
+            if(Ext.isIE){
+               document.frames[id].name = id;
+            }
+
+
+            Ext.fly(form).set({
+                target: id,
+                method: POST,
+                enctype: encoding,
+                encoding: encoding,
+                action: url || buf.action
+            });
+
+            // add dynamic params
+            Ext.iterate(Ext.urlDecode(ps, false), function(k, v){
+                hd = doc.createElement('input');
+                Ext.fly(hd).set({
+                    type: 'hidden',
+                    value: v,
+                    name: k
+                });
+                form.appendChild(hd);
+                hiddens.push(hd);
+            });
+
+            function cb(){
+                var me = this,
+                    // bogus response object
+                    r = {responseText : '',
+                         responseXML : null,
+                         argument : o.argument},
+                    doc,
+                    firstChild;
+
+                try{
+                    doc = frame.contentWindow.document || frame.contentDocument || WINDOW.frames[id].document;
+                    if(doc){
+                        if(doc.body){
+                            if(/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)){ // json response wrapped in textarea
+                                r.responseText = firstChild.value;
+                            }else{
+                                r.responseText = doc.body.innerHTML;
+                            }
+                        }
+                        //in IE the document may still have a body even if returns XML.
+                        r.responseXML = doc.XMLDocument || doc;
+                    }
+                }
+                catch(e) {}
+
+                Ext.EventManager.removeListener(frame, LOAD, cb, me);
+
+                me.fireEvent(REQUESTCOMPLETE, me, r, o);
+
+                function runCallback(fn, scope, args){
+                    if(Ext.isFunction(fn)){
+                        fn.apply(scope, args);
+                    }
+                }
+
+                runCallback(o.success, o.scope, [r, o]);
+                runCallback(o.callback, o.scope, [o, true, r]);
+
+                if(!me.debugUploads){
+                    setTimeout(function(){Ext.removeNode(frame);}, 100);
+                }
+            }
+
+            Ext.EventManager.on(frame, LOAD, cb, this);
+            form.submit();
+
+            Ext.fly(form).set(buf);
+            Ext.each(hiddens, function(h) {
+                Ext.removeNode(h);
+            });
+        }
+    });
+})();
+
+/**
+ * @class Ext.Ajax
+ * @extends Ext.data.Connection
+ * <p>The global Ajax request class that provides a simple way to make Ajax requests
+ * with maximum flexibility.</p>
+ * <p>Since Ext.Ajax is a singleton, you can set common properties/events for it once
+ * and override them at the request function level only if necessary.</p>
+ * <p>Common <b>Properties</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #method}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #extraParams}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #url}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Default headers to pass in every request
+Ext.Ajax.defaultHeaders = {
+    'Powered-By': 'Ext'
+};
+ * </code></pre>
+ * </p>
+ * <p>Common <b>Events</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.data.Connection#beforerequest beforerequest}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestcomplete requestcomplete}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestexception requestexception}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Example: show a spinner during all Ajax requests
+Ext.Ajax.on('beforerequest', this.showSpinner, this);
+Ext.Ajax.on('requestcomplete', this.hideSpinner, this);
+Ext.Ajax.on('requestexception', this.hideSpinner, this);
+ * </code></pre>
+ * </p>
+ * <p>An example request:</p>
+ * <pre><code>
+// Basic request
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+   url: 'foo.php',
+   success: someFn,
+   failure: otherFn,
+   headers: {
+       'my-header': 'foo'
+   },
+   params: { foo: 'bar' }
+});
+
+// Simple ajax form submission
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+    form: 'some-form',
+    params: 'foo=bar'
+});
+ * </code></pre>
+ * </p>
+ * @singleton
+ */
+Ext.Ajax = new Ext.data.Connection({
+    /**
+     * @cfg {String} url @hide
+     */
+    /**
+     * @cfg {Object} extraParams @hide
+     */
+    /**
+     * @cfg {Object} defaultHeaders @hide
+     */
+    /**
+     * @cfg {String} method (Optional) @hide
+     */
+    /**
+     * @cfg {Number} timeout (Optional) @hide
+     */
+    /**
+     * @cfg {Boolean} autoAbort (Optional) @hide
+     */
+
+    /**
+     * @cfg {Boolean} disableCaching (Optional) @hide
+     */
+
+    /**
+     * @property  disableCaching
+     * True to add a unique cache-buster param to GET requests. (defaults to true)
+     * @type Boolean
+     */
+    /**
+     * @property  url
+     * The default URL to be used for requests to the server. (defaults to undefined)
+     * If the server receives all requests through one URL, setting this once is easier than
+     * entering it on every request.
+     * @type String
+     */
+    /**
+     * @property  extraParams
+     * An object containing properties which are used as extra parameters to each request made
+     * by this object (defaults to undefined). Session information and other data that you need
+     * to pass with each request are commonly put here.
+     * @type Object
+     */
+    /**
+     * @property  defaultHeaders
+     * An object containing request headers which are added to each request made by this object
+     * (defaults to undefined).
+     * @type Object
+     */
+    /**
+     * @property  method
+     * The default HTTP method to be used for requests. Note that this is case-sensitive and
+     * should be all caps (defaults to undefined; if not set but params are present will use
+     * <tt>"POST"</tt>, otherwise will use <tt>"GET"</tt>.)
+     * @type String
+     */
+    /**
+     * @property  timeout
+     * The timeout in milliseconds to be used for requests. (defaults to 30000)
+     * @type Number
+     */
+
+    /**
+     * @property  autoAbort
+     * Whether a new request should abort any pending requests. (defaults to false)
+     * @type Boolean
+     */
+    autoAbort : false,
+
+    /**
+     * Serialize the passed form into a url encoded string
+     * @param {String/HTMLElement} form
+     * @return {String}
+     */
+    serializeForm : function(form){
+        return Ext.lib.Ajax.serializeForm(form);
+    }
+});
+/**
+ * @class Ext.util.JSON
+ * Modified version of Douglas Crockford"s json.js that doesn"t
+ * mess with the Object prototype
+ * http://www.json.org/js.html
+ * @singleton
+ */
+Ext.util.JSON = new (function(){
+    var useHasOwn = !!{}.hasOwnProperty,
+        isNative = function() {
+            var useNative = null;
+
+            return function() {
+                if (useNative === null) {
+                    useNative = Ext.USE_NATIVE_JSON && window.JSON && JSON.toString() == '[object JSON]';
+                }
+        
+                return useNative;
+            };
+        }(),
+        pad = function(n) {
+            return n < 10 ? "0" + n : n;
+        },
+        doDecode = function(json){
+            return json ? eval("(" + json + ")") : "";    
+        },
+        doEncode = function(o){
+            if(!Ext.isDefined(o) || o === null){
+                return "null";
+            }else if(Ext.isArray(o)){
+                return encodeArray(o);
+            }else if(Ext.isDate(o)){
+                return Ext.util.JSON.encodeDate(o);
+            }else if(Ext.isString(o)){
+                return encodeString(o);
+            }else if(typeof o == "number"){
+                //don't use isNumber here, since finite checks happen inside isNumber
+                return isFinite(o) ? String(o) : "null";
+            }else if(Ext.isBoolean(o)){
+                return String(o);
+            }else {
+                var a = ["{"], b, i, v;
+                for (i in o) {
+                    // don't encode DOM objects
+                    if(!o.getElementsByTagName){
+                        if(!useHasOwn || o.hasOwnProperty(i)) {
+                            v = o[i];
+                            switch (typeof v) {
+                            case "undefined":
+                            case "function":
+                            case "unknown":
+                                break;
+                            default:
+                                if(b){
+                                    a.push(',');
+                                }
+                                a.push(doEncode(i), ":",
+                                        v === null ? "null" : doEncode(v));
+                                b = true;
+                            }
+                        }
+                    }
+                }
+                a.push("}");
+                return a.join("");
+            }    
+        },
+        m = {
+            "\b": '\\b',
+            "\t": '\\t',
+            "\n": '\\n',
+            "\f": '\\f',
+            "\r": '\\r',
+            '"' : '\\"',
+            "\\": '\\\\'
+        },
+        encodeString = function(s){
+            if (/["\\\x00-\x1f]/.test(s)) {
+                return '"' + s.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                    var c = m[b];
+                    if(c){
+                        return c;
+                    }
+                    c = b.charCodeAt();
+                    return "\\u00" +
+                        Math.floor(c / 16).toString(16) +
+                        (c % 16).toString(16);
+                }) + '"';
+            }
+            return '"' + s + '"';
+        },
+        encodeArray = function(o){
+            var a = ["["], b, i, l = o.length, v;
+                for (i = 0; i < l; i += 1) {
+                    v = o[i];
+                    switch (typeof v) {
+                        case "undefined":
+                        case "function":
+                        case "unknown":
+                            break;
+                        default:
+                            if (b) {
+                                a.push(',');
+                            }
+                            a.push(v === null ? "null" : Ext.util.JSON.encode(v));
+                            b = true;
+                    }
+                }
+                a.push("]");
+                return a.join("");
+        };
+
+    /**
+     * <p>Encodes a Date. This returns the actual string which is inserted into the JSON string as the literal expression.
+     * <b>The returned value includes enclosing double quotation marks.</b></p>
+     * <p>The default return format is "yyyy-mm-ddThh:mm:ss".</p>
+     * <p>To override this:</p><pre><code>
+Ext.util.JSON.encodeDate = function(d) {
+    return d.format('"Y-m-d"');
+};
+</code></pre>
+     * @param {Date} d The Date to encode
+     * @return {String} The string literal to use in a JSON string.
+     */
+    this.encodeDate = function(o){
+        return '"' + o.getFullYear() + "-" +
+                pad(o.getMonth() + 1) + "-" +
+                pad(o.getDate()) + "T" +
+                pad(o.getHours()) + ":" +
+                pad(o.getMinutes()) + ":" +
+                pad(o.getSeconds()) + '"';
+    };
+
+    /**
+     * Encodes an Object, Array or other value
+     * @param {Mixed} o The variable to encode
+     * @return {String} The JSON string
+     */
+    this.encode = function() {
+        var ec;
+        return function(o) {
+            if (!ec) {
+                // setup encoding function on first access
+                ec = isNative() ? JSON.stringify : doEncode;
+            }
+            return ec(o);
+        };
+    }();
+
+
+    /**
+     * Decodes (parses) a JSON string to an object. If the JSON is invalid, this function throws a SyntaxError unless the safe option is set.
+     * @param {String} json The JSON string
+     * @return {Object} The resulting object
+     */
+    this.decode = function() {
+        var dc;
+        return function(json) {
+            if (!dc) {
+                // setup decoding function on first access
+                dc = isNative() ? JSON.parse : doDecode;
+            }
+            return dc(json);
+        };
+    }();
+
+})();
+/**
+ * Shorthand for {@link Ext.util.JSON#encode}
+ * @param {Mixed} o The variable to encode
+ * @return {String} The JSON string
+ * @member Ext
+ * @method encode
+ */
+Ext.encode = Ext.util.JSON.encode;
+/**
+ * Shorthand for {@link Ext.util.JSON#decode}
+ * @param {String} json The JSON string
+ * @param {Boolean} safe (optional) Whether to return null or throw an exception if the JSON is invalid.
+ * @return {Object} The resulting object
+ * @member Ext
+ * @method decode
+ */
+Ext.decode = Ext.util.JSON.decode;
+/**
+ * @class Ext.EventManager
+ * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides
+ * several useful events directly.
+ * See {@link Ext.EventObject} for more details on normalized event objects.
+ * @singleton
+ */
+Ext.EventManager = function(){
+    var docReadyEvent,
+        docReadyProcId,
+        docReadyState = false,
+        DETECT_NATIVE = Ext.isGecko || Ext.isWebKit || Ext.isSafari,
+        E = Ext.lib.Event,
+        D = Ext.lib.Dom,
+        DOC = document,
+        WINDOW = window,
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        COMPLETE = 'complete',
+        propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+        /*
+         * This cache is used to hold special js objects, the document and window, that don't have an id. We need to keep
+         * a reference to them so we can look them up at a later point.
+         */
+        specialElCache = [];
+
+     function getId(el){
+        var id = false,
+            i = 0,
+            len = specialElCache.length,
+            skip = false,
+            o;
+            
+        if (el) {
+            if (el.getElementById || el.navigator) {
+                // look up the id
+                for(; i < len; ++i){
+                    o = specialElCache[i];
+                    if(o.el === el){
+                        id = o.id;
+                        break;
+                    }
+                }
+                if(!id){
+                    // for browsers that support it, ensure that give the el the same id
+                    id = Ext.id(el);
+                    specialElCache.push({
+                        id: id,
+                        el: el
+                    });
+                    skip = true;
+                }
+            }else{
+                id = Ext.id(el);
+            }
+            if(!Ext.elCache[id]){
+                Ext.Element.addToCache(new Ext.Element(el), id);
+                if(skip){
+                    Ext.elCache[id].skipGC = true;
+                }
+            }
+        }
+        return id;
+     }
+
+    /// There is some jquery work around stuff here that isn't needed in Ext Core.
+    function addListener(el, ename, fn, task, wrap, scope){
+        el = Ext.getDom(el);
+        var id = getId(el),
+            es = Ext.elCache[id].events,
+            wfn;
+
+        wfn = E.on(el, ename, wrap);
+        es[ename] = es[ename] || [];
+
+        /* 0 = Original Function,
+           1 = Event Manager Wrapped Function,
+           2 = Scope,
+           3 = Adapter Wrapped Function,
+           4 = Buffered Task
+        */
+        es[ename].push([fn, wrap, scope, wfn, task]);
+
+        // this is a workaround for jQuery and should somehow be removed from Ext Core in the future
+        // without breaking ExtJS.
+
+        // workaround for jQuery
+        if(el.addEventListener && ename == "mousewheel"){
+            var args = ["DOMMouseScroll", wrap, false];
+            el.addEventListener.apply(el, args);
+            Ext.EventManager.addListener(WINDOW, 'unload', function(){
+                el.removeEventListener.apply(el, args);
+            });
+        }
+
+        // fix stopped mousedowns on the document
+        if(el == DOC && ename == "mousedown"){
+            Ext.EventManager.stoppedMouseDownEvent.addListener(wrap);
+        }
+    }
+
+    function doScrollChk(){
+        /* Notes:
+             'doScroll' will NOT work in a IFRAME/FRAMESET.
+             The method succeeds but, a DOM query done immediately after -- FAILS.
+          */
+        if(window != top){
+            return false;
+        }
+
+        try{
+            DOC.documentElement.doScroll('left');
+        }catch(e){
+             return false;
+        }
+
+        fireDocReady();
+        return true;
+    }
+    /**
+     * @return {Boolean} True if the document is in a 'complete' state (or was determined to
+     * be true by other means). If false, the state is evaluated again until canceled.
+     */
+    function checkReadyState(e){
+
+        if(Ext.isIE && doScrollChk()){
+            return true;
+        }
+        if(DOC.readyState == COMPLETE){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    var styles;
+    function checkStyleSheets(e){
+        styles || (styles = Ext.query('style, link[rel=stylesheet]'));
+        if(styles.length == DOC.styleSheets.length){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    function OperaDOMContentLoaded(e){
+        DOC.removeEventListener(DOMCONTENTLOADED, arguments.callee, false);
+        checkStyleSheets();
+    }
+
+    function fireDocReady(e){
+        if(!docReadyState){
+            docReadyState = true; //only attempt listener removal once
+
+            if(docReadyProcId){
+                clearTimeout(docReadyProcId);
+            }
+            if(DETECT_NATIVE) {
+                DOC.removeEventListener(DOMCONTENTLOADED, fireDocReady, false);
+            }
+            if(Ext.isIE && checkReadyState.bindIE){  //was this was actually set ??
+                DOC.detachEvent('onreadystatechange', checkReadyState);
+            }
+            E.un(WINDOW, "load", arguments.callee);
+        }
+        if(docReadyEvent && !Ext.isReady){
+            Ext.isReady = true;
+            docReadyEvent.fire();
+            docReadyEvent.listeners = [];
+        }
+
+    }
+
+    function initDocReady(){
+        docReadyEvent || (docReadyEvent = new Ext.util.Event());
+        if (DETECT_NATIVE) {
+            DOC.addEventListener(DOMCONTENTLOADED, fireDocReady, false);
+        }
+        /*
+         * Handle additional (exceptional) detection strategies here
+         */
+        if (Ext.isIE){
+            //Use readystatechange as a backup AND primary detection mechanism for a FRAME/IFRAME
+            //See if page is already loaded
+            if(!checkReadyState()){
+                checkReadyState.bindIE = true;
+                DOC.attachEvent('onreadystatechange', checkReadyState);
+            }
+
+        }else if(Ext.isOpera ){
+            /* Notes:
+               Opera needs special treatment needed here because CSS rules are NOT QUITE
+               available after DOMContentLoaded is raised.
+            */
+
+            //See if page is already loaded and all styleSheets are in place
+            (DOC.readyState == COMPLETE && checkStyleSheets()) ||
+                DOC.addEventListener(DOMCONTENTLOADED, OperaDOMContentLoaded, false);
+
+        }else if (Ext.isWebKit){
+            //Fallback for older Webkits without DOMCONTENTLOADED support
+            checkReadyState();
+        }
+        // no matter what, make sure it fires on load
+        E.on(WINDOW, "load", fireDocReady);
+    }
+
+    function createTargeted(h, o){
+        return function(){
+            var args = Ext.toArray(arguments);
+            if(o.target == Ext.EventObject.setEvent(args[0]).target){
+                h.apply(this, args);
+            }
+        };
+    }
+
+    function createBuffered(h, o, task){
+        return function(e){
+            // create new event object impl so new events don't wipe out properties
+            task.delay(o.buffer, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function createSingle(h, el, ename, fn, scope){
+        return function(e){
+            Ext.EventManager.removeListener(el, ename, fn, scope);
+            h(e);
+        };
+    }
+
+    function createDelayed(h, o, fn){
+        return function(e){
+            var task = new Ext.util.DelayedTask(h);
+            if(!fn.tasks) {
+                fn.tasks = [];
+            }
+            fn.tasks.push(task);
+            task.delay(o.delay || 10, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function listen(element, ename, opt, fn, scope){
+        var o = (!opt || typeof opt == "boolean") ? {} : opt,
+            el = Ext.getDom(element), task;
+
+        fn = fn || o.fn;
+        scope = scope || o.scope;
+
+        if(!el){
+            throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.';
+        }
+        function h(e){
+            // prevent errors while unload occurring
+            if(!Ext){// !window[xname]){  ==> can't we do this?
+                return;
+            }
+            e = Ext.EventObject.setEvent(e);
+            var t;
+            if (o.delegate) {
+                if(!(t = e.getTarget(o.delegate, el))){
+                    return;
+                }
+            } else {
+                t = e.target;
+            }
+            if (o.stopEvent) {
+                e.stopEvent();
+            }
+            if (o.preventDefault) {
+               e.preventDefault();
+            }
+            if (o.stopPropagation) {
+                e.stopPropagation();
+            }
+            if (o.normalized === false) {
+                e = e.browserEvent;
+            }
+
+            fn.call(scope || el, e, t, o);
+        }
+        if(o.target){
+            h = createTargeted(h, o);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, fn);
+        }
+        if(o.single){
+            h = createSingle(h, el, ename, fn, scope);
+        }
+        if(o.buffer){
+            task = new Ext.util.DelayedTask(h);
+            h = createBuffered(h, o, task);
+        }
+
+        addListener(el, ename, fn, task, h, scope);
+        return h;
+    }
+
+    var pub = {
+        /**
+         * Appends an event handler to an element.  The shorthand version {@link #on} is equivalent.  Typically you will
+         * use {@link Ext.Element#addListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The html element or id to assign the event handler to.
+         * @param {String} eventName The name of the event to listen for.
+         * @param {Function} handler The handler function the event invokes. This function is passed
+         * the following parameters:<ul>
+         * <li>evt : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+         * <li>t : Element<div class="sub-desc">The {@link Ext.Element Element} which was the target of the event.
+         * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+         * <li>o : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+         * </ul>
+         * @param {Object} scope (optional) The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.
+         * @param {Object} options (optional) An object containing handler configuration properties.
+         * This may contain any of the following properties:<ul>
+         * <li>scope : Object<div class="sub-desc">The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.</div></li>
+         * <li>delegate : String<div class="sub-desc">A simple selector to filter the target or look for a descendant of the target</div></li>
+         * <li>stopEvent : Boolean<div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+         * <li>preventDefault : Boolean<div class="sub-desc">True to prevent the default action</div></li>
+         * <li>stopPropagation : Boolean<div class="sub-desc">True to prevent event propagation</div></li>
+         * <li>normalized : Boolean<div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+         * <li>delay : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after te event fires.</div></li>
+         * <li>single : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+         * <li>buffer : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+         * by the specified number of milliseconds. If the event fires again within that time, the original
+         * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+         * <li>target : Element<div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+         * </ul><br>
+         * <p>See {@link Ext.Element#addListener} for examples of how to use these options.</p>
+         */
+        addListener : function(element, eventName, fn, scope, options){
+            if(typeof eventName == 'object'){
+                var o = eventName, e, val;
+                for(e in o){
+                    val = o[e];
+                    if(!propRe.test(e)){
+                        if(Ext.isFunction(val)){
+                            // shared options
+                            listen(element, e, o, val, o.scope);
+                        }else{
+                            // individual options
+                            listen(element, e, val);
+                        }
+                    }
+                }
+            } else {
+                listen(element, eventName, options, fn, scope);
+            }
+        },
+
+        /**
+         * Removes an event handler from an element.  The shorthand version {@link #un} is equivalent.  Typically
+         * you will use {@link Ext.Element#removeListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+         * @param {String} eventName The name of the event.
+         * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+         * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+         * then this must refer to the same object.
+         */
+        removeListener : function(el, eventName, fn, scope){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                f = el && (Ext.elCache[id].events)[eventName] || [],
+                wrap, i, l, k, len, fnc;
+
+            for (i = 0, len = f.length; i < len; i++) {
+
+                /* 0 = Original Function,
+                   1 = Event Manager Wrapped Function,
+                   2 = Scope,
+                   3 = Adapter Wrapped Function,
+                   4 = Buffered Task
+                */
+                if (Ext.isArray(fnc = f[i]) && fnc[0] == fn && (!scope || fnc[2] == scope)) {
+                    if(fnc[4]) {
+                        fnc[4].cancel();
+                    }
+                    k = fn.tasks && fn.tasks.length;
+                    if(k) {
+                        while(k--) {
+                            fn.tasks[k].cancel();
+                        }
+                        delete fn.tasks;
+                    }
+                    wrap = fnc[1];
+                    E.un(el, eventName, E.extAdapter ? fnc[3] : wrap);
+
+                    // jQuery workaround that should be removed from Ext Core
+                    if(wrap && el.addEventListener && eventName == "mousewheel"){
+                        el.removeEventListener("DOMMouseScroll", wrap, false);
+                    }
+
+                    // fix stopped mousedowns on the document
+                    if(wrap && el == DOC && eventName == "mousedown"){
+                        Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                    }
+
+                    f.splice(i, 1);
+                    if (f.length === 0) {
+                        delete Ext.elCache[id].events[eventName];
+                    }
+                    for (k in Ext.elCache[id].events) {
+                        return false;
+                    }
+                    Ext.elCache[id].events = {};
+                    return false;
+                }
+            }
+        },
+
+        /**
+         * Removes all event handers from an element.  Typically you will use {@link Ext.Element#removeAllListeners}
+         * directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove all event handlers.
+         */
+        removeAll : function(el){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                f, i, len, ename, fn, k, wrap;
+
+            for(ename in es){
+                if(es.hasOwnProperty(ename)){
+                    f = es[ename];
+                    /* 0 = Original Function,
+                       1 = Event Manager Wrapped Function,
+                       2 = Scope,
+                       3 = Adapter Wrapped Function,
+                       4 = Buffered Task
+                    */
+                    for (i = 0, len = f.length; i < len; i++) {
+                        fn = f[i];
+                        if(fn[4]) {
+                            fn[4].cancel();
+                        }
+                        if(fn[0].tasks && (k = fn[0].tasks.length)) {
+                            while(k--) {
+                                fn[0].tasks[k].cancel();
+                            }
+                            delete fn.tasks;
+                        }
+                        wrap =  fn[1];
+                        E.un(el, ename, E.extAdapter ? fn[3] : wrap);
+
+                        // jQuery workaround that should be removed from Ext Core
+                        if(el.addEventListener && wrap && ename == "mousewheel"){
+                            el.removeEventListener("DOMMouseScroll", wrap, false);
+                        }
+
+                        // fix stopped mousedowns on the document
+                        if(wrap && el == DOC &&  ename == "mousedown"){
+                            Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                        }
+                    }
+                }
+            }
+            if (Ext.elCache[id]) {
+                Ext.elCache[id].events = {};
+            }
+        },
+
+        getListeners : function(el, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                results = [];
+            if (es && es[eventName]) {
+                return es[eventName];
+            } else {
+                return null;
+            }
+        },
+
+        purgeElement : function(el, recurse, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                i, f, len;
+            if (eventName) {
+                if (es && es.hasOwnProperty(eventName)) {
+                    f = es[eventName];
+                    for (i = 0, len = f.length; i < len; i++) {
+                        Ext.EventManager.removeListener(el, eventName, f[i][0]);
+                    }
+                }
+            } else {
+                Ext.EventManager.removeAll(el);
+            }
+            if (recurse && el && el.childNodes) {
+                for (i = 0, len = el.childNodes.length; i < len; i++) {
+                    Ext.EventManager.purgeElement(el.childNodes[i], recurse, eventName);
+                }
+            }
+        },
+
+        _unload : function() {
+            var el;
+            for (el in Ext.elCache) {
+                Ext.EventManager.removeAll(el);
+            }
+            delete Ext.elCache;
+            delete Ext.Element._flyweights;
+
+            // Abort any outstanding Ajax requests
+            var c,
+                conn,
+                tid,
+                ajax = Ext.lib.Ajax;
+            (typeof ajax.conn == 'object') ? conn = ajax.conn : conn = {};
+            for (tid in conn) {
+                c = conn[tid];
+                if (c) {
+                    ajax.abort({conn: c, tId: tid});
+                }
+            }
+        },
+        /**
+         * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Can be
+         * accessed shorthanded as Ext.onReady().
+         * @param {Function} fn The method the event invokes.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+         * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+         * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+         */
+        onDocumentReady : function(fn, scope, options){
+            if (Ext.isReady) { // if it already fired or document.body is present
+                docReadyEvent || (docReadyEvent = new Ext.util.Event());
+                docReadyEvent.addListener(fn, scope, options);
+                docReadyEvent.fire();
+                docReadyEvent.listeners = [];
+            } else {
+                if (!docReadyEvent) {
+                    initDocReady();
+                }
+                options = options || {};
+                options.delay = options.delay || 1;
+                docReadyEvent.addListener(fn, scope, options);
+            }
+        },
+
+        /**
+         * Forces a document ready state transition for the framework.  Used when Ext is loaded
+         * into a DOM structure AFTER initial page load (Google API or other dynamic load scenario.
+         * Any pending 'onDocumentReady' handlers will be fired (if not already handled).
+         */
+        fireDocReady  : fireDocReady
+    };
+     /**
+     * Appends an event handler to an element.  Shorthand for {@link #addListener}.
+     * @param {String/HTMLElement} el The html element or id to assign the event handler to
+     * @param {String} eventName The name of the event to listen for.
+     * @param {Function} handler The handler function the event invokes.
+     * @param {Object} scope (optional) (<code>this</code> reference) in which the handler function executes. <b>Defaults to the Element</b>.
+     * @param {Object} options (optional) An object containing standard {@link #addListener} options
+     * @member Ext.EventManager
+     * @method on
+     */
+    pub.on = pub.addListener;
+    /**
+     * Removes an event handler from an element.  Shorthand for {@link #removeListener}.
+     * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+     * @param {String} eventName The name of the event.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #on} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @member Ext.EventManager
+     * @method un
+     */
+    pub.un = pub.removeListener;
+
+    pub.stoppedMouseDownEvent = new Ext.util.Event();
+    return pub;
+}();
+/**
+  * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Shorthand of {@link Ext.EventManager#onDocumentReady}.
+  * @param {Function} fn The method the event invokes.
+  * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+  * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+  * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+  * @member Ext
+  * @method onReady
+ */
+Ext.onReady = Ext.EventManager.onDocumentReady;
+
+
+//Initialize doc classes
+(function(){
+    var initExtCss = function() {
+        // find the body element
+        var bd = document.body || document.getElementsByTagName('body')[0];
+        if (!bd) {
+            return false;
+        }
+
+        var cls = [' ',
+                Ext.isIE ? "ext-ie " + (Ext.isIE6 ? 'ext-ie6' : (Ext.isIE7 ? 'ext-ie7' : (Ext.isIE8 ? 'ext-ie8' : 'ext-ie9')))
+                : Ext.isGecko ? "ext-gecko " + (Ext.isGecko2 ? 'ext-gecko2' : 'ext-gecko3')
+                : Ext.isOpera ? "ext-opera"
+                : Ext.isWebKit ? "ext-webkit" : ""];
+
+        if (Ext.isSafari) {
+            cls.push("ext-safari " + (Ext.isSafari2 ? 'ext-safari2' : (Ext.isSafari3 ? 'ext-safari3' : 'ext-safari4')));
+        } else if(Ext.isChrome) {
+            cls.push("ext-chrome");
+        }
+
+        if (Ext.isMac) {
+            cls.push("ext-mac");
+        }
+        if (Ext.isLinux) {
+            cls.push("ext-linux");
+        }
+
+        // add to the parent to allow for selectors like ".ext-strict .ext-ie"
+        if (Ext.isStrict || Ext.isBorderBox) {
+            var p = bd.parentNode;
+            if (p) {
+                if (!Ext.isStrict) {
+                    Ext.fly(p, '_internal').addClass('x-quirks');
+                    if (Ext.isIE && !Ext.isStrict) {
+                        Ext.isIEQuirks = true;
+                    }
+                }
+                Ext.fly(p, '_internal').addClass(((Ext.isStrict && Ext.isIE ) || (!Ext.enableForcedBoxModel && !Ext.isIE)) ? ' ext-strict' : ' ext-border-box');
+            }
+        }
+        // Forced border box model class applied to all elements. Bypassing javascript based box model adjustments
+        // in favor of css.  This is for non-IE browsers.
+        if (Ext.enableForcedBoxModel && !Ext.isIE) {
+            Ext.isForcedBorderBox = true;
+            cls.push("ext-forced-border-box");
+        }
+        
+        Ext.fly(bd, '_internal').addClass(cls);
+        return true;
+    };
+    
+    if (!initExtCss()) {
+        Ext.onReady(initExtCss);
+    }
+})();
+
+/**
+ * Code used to detect certain browser feature/quirks/bugs at startup.
+ */
+(function(){
+    var supports = Ext.apply(Ext.supports, {
+        /**
+         * In Webkit, there is an issue with getting the margin right property, see
+         * https://bugs.webkit.org/show_bug.cgi?id=13343
+         */
+        correctRightMargin: true,
+        
+        /**
+         * Webkit browsers return rgba(0, 0, 0) when a transparent color is used
+         */
+        correctTransparentColor: true,
+        
+        /**
+         * IE uses styleFloat, not cssFloat for the float property.
+         */
+        cssFloat: true
+    });
+    
+    var supportTests = function(){
+            var div = document.createElement('div'),
+                doc = document,
+                view,
+                last;
+                
+            div.innerHTML = '<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';
+            doc.body.appendChild(div);
+            last = div.lastChild;
+            
+            if((view = doc.defaultView)){
+                if(view.getComputedStyle(div.firstChild.firstChild, null).marginRight != '0px'){
+                    supports.correctRightMargin = false;
+                }
+                if(view.getComputedStyle(last, null).backgroundColor != 'transparent'){
+                    supports.correctTransparentColor = false;
+                }
+            }
+            supports.cssFloat = !!last.style.cssFloat;
+            doc.body.removeChild(div);
+    };
+    
+    if (Ext.isReady) {
+        supportTests();    
+    } else {
+        Ext.onReady(supportTests);
+    }
+})();
+
+
+/**
+ * @class Ext.EventObject
+ * Just as {@link Ext.Element} wraps around a native DOM node, Ext.EventObject
+ * wraps the browser's native event-object normalizing cross-browser differences,
+ * such as which mouse button is clicked, keys pressed, mechanisms to stop
+ * event-propagation along with a method to prevent default actions from taking place.
+ * <p>For example:</p>
+ * <pre><code>
+function handleClick(e, t){ // e is not a standard event object, it is a Ext.EventObject
+    e.preventDefault();
+    var target = e.getTarget(); // same as t (the target HTMLElement)
+    ...
+}
+var myDiv = {@link Ext#get Ext.get}("myDiv");  // get reference to an {@link Ext.Element}
+myDiv.on(         // 'on' is shorthand for addListener
+    "click",      // perform an action on click of myDiv
+    handleClick   // reference to the action handler
+);
+// other methods to do the same:
+Ext.EventManager.on("myDiv", 'click', handleClick);
+Ext.EventManager.addListener("myDiv", 'click', handleClick);
+ </code></pre>
+ * @singleton
+ */
+Ext.EventObject = function(){
+    var E = Ext.lib.Event,
+        clickRe = /(dbl)?click/,
+        // safari keypress events for special keys return bad keycodes
+        safariKeys = {
+            3 : 13, // enter
+            63234 : 37, // left
+            63235 : 39, // right
+            63232 : 38, // up
+            63233 : 40, // down
+            63276 : 33, // page up
+            63277 : 34, // page down
+            63272 : 46, // delete
+            63273 : 36, // home
+            63275 : 35  // end
+        },
+        // normalize button clicks
+        btnMap = Ext.isIE ? {1:0,4:1,2:2} : {0:0,1:1,2:2};
+
+    Ext.EventObjectImpl = function(e){
+        if(e){
+            this.setEvent(e.browserEvent || e);
+        }
+    };
+
+    Ext.EventObjectImpl.prototype = {
+           /** @private */
+        setEvent : function(e){
+            var me = this;
+            if(e == me || (e && e.browserEvent)){ // already wrapped
+                return e;
+            }
+            me.browserEvent = e;
+            if(e){
+                // normalize buttons
+                me.button = e.button ? btnMap[e.button] : (e.which ? e.which - 1 : -1);
+                if(clickRe.test(e.type) && me.button == -1){
+                    me.button = 0;
+                }
+                me.type = e.type;
+                me.shiftKey = e.shiftKey;
+                // mac metaKey behaves like ctrlKey
+                me.ctrlKey = e.ctrlKey || e.metaKey || false;
+                me.altKey = e.altKey;
+                // in getKey these will be normalized for the mac
+                me.keyCode = e.keyCode;
+                me.charCode = e.charCode;
+                // cache the target for the delayed and or buffered events
+                me.target = E.getTarget(e);
+                // same for XY
+                me.xy = E.getXY(e);
+            }else{
+                me.button = -1;
+                me.shiftKey = false;
+                me.ctrlKey = false;
+                me.altKey = false;
+                me.keyCode = 0;
+                me.charCode = 0;
+                me.target = null;
+                me.xy = [0, 0];
+            }
+            return me;
+        },
+
+        /**
+         * Stop the event (preventDefault and stopPropagation)
+         */
+        stopEvent : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopEvent(me.browserEvent);
+            }
+        },
+
+        /**
+         * Prevents the browsers default handling of the event.
+         */
+        preventDefault : function(){
+            if(this.browserEvent){
+                E.preventDefault(this.browserEvent);
+            }
+        },
+
+        /**
+         * Cancels bubbling of the event.
+         */
+        stopPropagation : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopPropagation(me.browserEvent);
+            }
+        },
+
+        /**
+         * Gets the character code for the event.
+         * @return {Number}
+         */
+        getCharCode : function(){
+            return this.charCode || this.keyCode;
+        },
+
+        /**
+         * Returns a normalized keyCode for the event.
+         * @return {Number} The key code
+         */
+        getKey : function(){
+            return this.normalizeKey(this.keyCode || this.charCode);
+        },
+
+        // private
+        normalizeKey: function(k){
+            return Ext.isSafari ? (safariKeys[k] || k) : k;
+        },
+
+        /**
+         * Gets the x coordinate of the event.
+         * @return {Number}
+         */
+        getPageX : function(){
+            return this.xy[0];
+        },
+
+        /**
+         * Gets the y coordinate of the event.
+         * @return {Number}
+         */
+        getPageY : function(){
+            return this.xy[1];
+        },
+
+        /**
+         * Gets the page coordinates of the event.
+         * @return {Array} The xy values like [x, y]
+         */
+        getXY : function(){
+            return this.xy;
+        },
+
+        /**
+         * Gets the target for the event.
+         * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
+         * @param {Number/Mixed} maxDepth (optional) The max depth to
+                search as a number or element (defaults to 10 || document.body)
+         * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+         * @return {HTMLelement}
+         */
+        getTarget : function(selector, maxDepth, returnEl){
+            return selector ? Ext.fly(this.target).findParent(selector, maxDepth, returnEl) : (returnEl ? Ext.get(this.target) : this.target);
+        },
+
+        /**
+         * Gets the related target.
+         * @return {HTMLElement}
+         */
+        getRelatedTarget : function(){
+            return this.browserEvent ? E.getRelatedTarget(this.browserEvent) : null;
+        },
+
+        /**
+         * Normalizes mouse wheel delta across browsers
+         * @return {Number} The delta
+         */
+        getWheelDelta : function(){
+            var e = this.browserEvent;
+            var delta = 0;
+            if(e.wheelDelta){ /* IE/Opera. */
+                delta = e.wheelDelta/120;
+            }else if(e.detail){ /* Mozilla case. */
+                delta = -e.detail/3;
+            }
+            return delta;
+        },
+
+        /**
+        * Returns true if the target of this event is a child of el.  Unless the allowEl parameter is set, it will return false if if the target is el.
+        * Example usage:<pre><code>
+        // Handle click on any child of an element
+        Ext.getBody().on('click', function(e){
+            if(e.within('some-el')){
+                alert('Clicked on a child of some-el!');
+            }
+        });
+
+        // Handle click directly on an element, ignoring clicks on child nodes
+        Ext.getBody().on('click', function(e,t){
+            if((t.id == 'some-el') && !e.within(t, true)){
+                alert('Clicked directly on some-el!');
+            }
+        });
+        </code></pre>
+         * @param {Mixed} el The id, DOM element or Ext.Element to check
+         * @param {Boolean} related (optional) true to test if the related target is within el instead of the target
+         * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target
+         * @return {Boolean}
+         */
+        within : function(el, related, allowEl){
+            if(el){
+                var t = this[related ? "getRelatedTarget" : "getTarget"]();
+                return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t));
+            }
+            return false;
+        }
+     };
+
+    return new Ext.EventObjectImpl();
+}();/**
+ * @class Ext.Loader
+ * @singleton
+ * Simple class to help load JavaScript files on demand
+ */
+Ext.Loader = Ext.apply({}, {
+    /**
+     * Loads a given set of .js files. Calls the callback function when all files have been loaded
+     * Set preserveOrder to true to ensure non-parallel loading of files if load order is important
+     * @param {Array} fileList Array of all files to load
+     * @param {Function} callback Callback to call after all files have been loaded
+     * @param {Object} scope The scope to call the callback in
+     * @param {Boolean} preserveOrder True to make files load in serial, one after the other (defaults to false)
+     */
+    load: function(fileList, callback, scope, preserveOrder) {
+        var scope       = scope || this,
+            head        = document.getElementsByTagName("head")[0],
+            fragment    = document.createDocumentFragment(),
+            numFiles    = fileList.length,
+            loadedFiles = 0,
+            me          = this;
+        
+        /**
+         * Loads a particular file from the fileList by index. This is used when preserving order
+         */
+        var loadFileIndex = function(index) {
+            head.appendChild(
+                me.buildScriptTag(fileList[index], onFileLoaded)
+            );
+        };
+        
+        /**
+         * Callback function which is called after each file has been loaded. This calls the callback
+         * passed to load once the final file in the fileList has been loaded
+         */
+        var onFileLoaded = function() {
+            loadedFiles ++;
+            
+            //if this was the last file, call the callback, otherwise load the next file
+            if (numFiles == loadedFiles && typeof callback == 'function') {
+                callback.call(scope);
+            } else {
+                if (preserveOrder === true) {
+                    loadFileIndex(loadedFiles);
+                }
+            }
+        };
+        
+        if (preserveOrder === true) {
+            loadFileIndex.call(this, 0);
+        } else {
+            //load each file (most browsers will do this in parallel)
+            Ext.each(fileList, function(file, index) {
+                fragment.appendChild(
+                    this.buildScriptTag(file, onFileLoaded)
+                );  
+            }, this);
+            
+            head.appendChild(fragment);
+        }
+    },
+    
+    /**
+     * @private
+     * Creates and returns a script tag, but does not place it into the document. If a callback function
+     * is passed, this is called when the script has been loaded
+     * @param {String} filename The name of the file to create a script tag for
+     * @param {Function} callback Optional callback, which is called when the script has been loaded
+     * @return {Element} The new script ta
+     */
+    buildScriptTag: function(filename, callback) {
+        var script  = document.createElement('script');
+        script.type = "text/javascript";
+        script.src  = filename;
+        
+        //IE has a different way of handling &lt;script&gt; loads, so we need to check for it here
+        if (script.readyState) {
+            script.onreadystatechange = function() {
+                if (script.readyState == "loaded" || script.readyState == "complete") {
+                    script.onreadystatechange = null;
+                    callback();
+                }
+            };
+        } else {
+            script.onload = callback;
+        }    
+        
+        return script;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-editor-debug.js	(revision 76)
@@ -0,0 +1,621 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.CellSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * This class provides the basic implementation for <i>single</i> <b>cell</b> selection in a grid.
+ * The object stored as the selection contains the following properties:
+ * <div class="mdetail-params"><ul>
+ * <li><b>cell</b> : see {@link #getSelectedCell} 
+ * <li><b>record</b> : Ext.data.record The {@link Ext.data.Record Record}
+ * which provides the data for the row containing the selection</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The object containing the configuration of this model.
+ */
+Ext.grid.CellSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+
+	    this.selection = null;
+	
+	    this.addEvents(
+	        /**
+	         * @event beforecellselect
+	         * Fires before a cell is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "beforecellselect",
+	        /**
+	         * @event cellselect
+	         * Fires when a cell is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "cellselect",
+	        /**
+	         * @event selectionchange
+	         * Fires when the active selection changes.
+	         * @param {SelectionModel} this
+	         * @param {Object} selection null for no selection or an object with two properties
+	         * <div class="mdetail-params"><ul>
+	         * <li><b>cell</b> : see {@link #getSelectedCell} 
+	         * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record Record}
+	         * which provides the data for the row containing the selection</p></li>
+	         * </ul></div>
+	         */
+	        "selectionchange"
+	    );
+	
+	    Ext.grid.CellSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore */
+    initEvents : function(){
+        this.grid.on('cellmousedown', this.handleMouseDown, this);
+        this.grid.on(Ext.EventManager.getKeyEvent(), this.handleKeyDown, this);
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onViewChange,
+            rowupdated: this.onRowUpdated,
+            beforerowremoved: this.clearSelections,
+            beforerowsinserted: this.clearSelections
+        });
+        if(this.grid.isEditor){
+            this.grid.on('beforeedit', this.beforeEdit,  this);
+        }
+    },
+
+	//private
+    beforeEdit : function(e){
+        this.select(e.row, e.column, false, true, e.record);
+    },
+
+	//private
+    onRowUpdated : function(v, index, r){
+        if(this.selection && this.selection.record == r){
+            v.onCellSelect(index, this.selection.cell[1]);
+        }
+    },
+
+	//private
+    onViewChange : function(){
+        this.clearSelections(true);
+    },
+
+	/**
+     * Returns an array containing the row and column indexes of the currently selected cell
+     * (e.g., [0, 0]), or null if none selected. The array has elements:
+     * <div class="mdetail-params"><ul>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The index of the selected row</p></li>
+     * <li><b>cellIndex</b> : Number<p class="sub-desc">The index of the selected cell. 
+     * Due to possible column reordering, the cellIndex should <b>not</b> be used as an
+     * index into the Record's data. Instead, use the cellIndex to determine the <i>name</i>
+     * of the selected cell and use the field name to retrieve the data value from the record:<pre><code>
+// get name
+var fieldName = grid.getColumnModel().getDataIndex(cellIndex);
+// get data value based on name
+var data = record.get(fieldName);
+     * </code></pre></p></li>
+     * </ul></div>
+     * @return {Array} An array containing the row and column indexes of the selected cell, or null if none selected.
+	 */
+    getSelectedCell : function(){
+        return this.selection ? this.selection.cell : null;
+    },
+
+    /**
+     * If anything is selected, clears all selections and fires the selectionchange event.
+     * @param {Boolean} preventNotify <tt>true</tt> to prevent the gridview from
+     * being notified about the change.
+     */
+    clearSelections : function(preventNotify){
+        var s = this.selection;
+        if(s){
+            if(preventNotify !== true){
+                this.grid.view.onCellDeselect(s.cell[0], s.cell[1]);
+            }
+            this.selection = null;
+            this.fireEvent("selectionchange", this, null);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selection ? true : false;
+    },
+
+    /** @ignore */
+    handleMouseDown : function(g, row, cell, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        this.select(row, cell);
+    },
+
+    /**
+     * Selects a cell.  Before selecting a cell, fires the
+     * {@link #beforecellselect} event.  If this check is satisfied the cell
+     * will be selected and followed up by  firing the {@link #cellselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} rowIndex The index of the row to select
+     * @param {Number} colIndex The index of the column to select
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     * @param {Boolean} preventFocus (optional) Whether to prevent the cell at
+     * the specified rowIndex / colIndex from being focused.
+     * @param {Ext.data.Record} r (optional) The record to select
+     */
+    select : function(rowIndex, colIndex, preventViewNotify, preventFocus, /*internal*/ r){
+        if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){
+            this.clearSelections();
+            r = r || this.grid.store.getAt(rowIndex);
+            this.selection = {
+                record : r,
+                cell : [rowIndex, colIndex]
+            };
+            if(!preventViewNotify){
+                var v = this.grid.getView();
+                v.onCellSelect(rowIndex, colIndex);
+                if(preventFocus !== true){
+                    v.focusCell(rowIndex, colIndex);
+                }
+            }
+            this.fireEvent("cellselect", this, rowIndex, colIndex);
+            this.fireEvent("selectionchange", this, this.selection);
+        }
+    },
+
+	//private
+    isSelectable : function(rowIndex, colIndex, cm){
+        return !cm.isHidden(colIndex);
+    },
+    
+    // private
+    onEditorKey: function(field, e){
+        if(e.getKey() == e.TAB){
+            this.handleKeyDown(e);
+        }
+    },
+
+    /** @ignore */
+    handleKeyDown : function(e){
+        if(!e.isNavKeyPress()){
+            return;
+        }
+        
+        var k = e.getKey(),
+            g = this.grid,
+            s = this.selection,
+            sm = this,
+            walk = function(row, col, step){
+                return g.walkCells(
+                    row,
+                    col,
+                    step,
+                    g.isEditor && g.editing ? sm.acceptsNav : sm.isSelectable, // *** handle tabbing while editorgrid is in edit mode
+                    sm
+                );
+            },
+            cell, newCell, r, c, ae;
+
+        switch(k){
+            case e.ESC:
+            case e.PAGE_UP:
+            case e.PAGE_DOWN:
+                // do nothing
+                break;
+            default:
+                // *** call e.stopEvent() only for non ESC, PAGE UP/DOWN KEYS
+                e.stopEvent();
+                break;
+        }
+
+        if(!s){
+            cell = walk(0, 0, 1); // *** use private walk() function defined above
+            if(cell){
+                this.select(cell[0], cell[1]);
+            }
+            return;
+        }
+
+        cell = s.cell;  // currently selected cell
+        r = cell[0];    // current row
+        c = cell[1];    // current column
+        
+        switch(k){
+            case e.TAB:
+                if(e.shiftKey){
+                    newCell = walk(r, c - 1, -1);
+                }else{
+                    newCell = walk(r, c + 1, 1);
+                }
+                break;
+            case e.DOWN:
+                newCell = walk(r + 1, c, 1);
+                break;
+            case e.UP:
+                newCell = walk(r - 1, c, -1);
+                break;
+            case e.RIGHT:
+                newCell = walk(r, c + 1, 1);
+                break;
+            case e.LEFT:
+                newCell = walk(r, c - 1, -1);
+                break;
+            case e.ENTER:
+                if (g.isEditor && !g.editing) {
+                    g.startEditing(r, c);
+                    return;
+                }
+                break;
+        }
+
+        if(newCell){
+            // *** reassign r & c variables to newly-selected cell's row and column
+            r = newCell[0];
+            c = newCell[1];
+
+            this.select(r, c); // *** highlight newly-selected cell and update selection
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+                g.startEditing(r, c);
+            }
+        }
+    },
+
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    }
+});/**
+ * @class Ext.grid.EditorGridPanel
+ * @extends Ext.grid.GridPanel
+ * <p>This class extends the {@link Ext.grid.GridPanel GridPanel Class} to provide cell editing
+ * on selected {@link Ext.grid.Column columns}. The editable columns are specified by providing
+ * an {@link Ext.grid.ColumnModel#editor editor} in the {@link Ext.grid.Column column configuration}.</p>
+ * <p>Editability of columns may be controlled programatically by inserting an implementation
+ * of {@link Ext.grid.ColumnModel#isCellEditable isCellEditable} into the
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>Editing is performed on the value of the <i>field</i> specified by the column's
+ * <tt>{@link Ext.grid.ColumnModel#dataIndex dataIndex}</tt> in the backing {@link Ext.data.Store Store}
+ * (so if you are using a {@link Ext.grid.ColumnModel#setRenderer renderer} in order to display
+ * transformed data, this must be accounted for).</p>
+ * <p>If a value-to-description mapping is used to render a column, then a {@link Ext.form.Field#ComboBox ComboBox}
+ * which uses the same {@link Ext.form.Field#valueField value}-to-{@link Ext.form.Field#displayFieldField description}
+ * mapping would be an appropriate editor.</p>
+ * If there is a more complex mismatch between the visible data in the grid, and the editable data in
+ * the {@link Edt.data.Store Store}, then code to transform the data both before and after editing can be
+ * injected using the {@link #beforeedit} and {@link #afteredit} events.
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype editorgrid
+ */
+Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    /**
+     * @cfg {Number} clicksToEdit
+     * <p>The number of clicks on a cell required to display the cell's editor (defaults to 2).</p>
+     * <p>Setting this option to 'auto' means that mousedown <i>on the selected cell</i> starts
+     * editing that cell.</p>
+     */
+    clicksToEdit: 2,
+
+    /**
+    * @cfg {Boolean} forceValidation
+    * True to force validation even if the value is unmodified (defaults to false)
+    */
+    forceValidation: false,
+
+    // private
+    isEditor : true,
+    // private
+    detectEdit: false,
+
+    /**
+     * @cfg {Boolean} autoEncode
+     * True to automatically HTML encode and decode values pre and post edit (defaults to false)
+     */
+    autoEncode : false,
+
+    /**
+     * @cfg {Boolean} trackMouseOver @hide
+     */
+    // private
+    trackMouseOver: false, // causes very odd FF errors
+
+    // private
+    initComponent : function(){
+        Ext.grid.EditorGridPanel.superclass.initComponent.call(this);
+
+        if(!this.selModel){
+            /**
+             * @cfg {Object} selModel Any subclass of AbstractSelectionModel that will provide the selection model for
+             * the grid (defaults to {@link Ext.grid.CellSelectionModel} if not specified).
+             */
+            this.selModel = new Ext.grid.CellSelectionModel();
+        }
+
+        this.activeEditor = null;
+
+        this.addEvents(
+            /**
+             * @event beforeedit
+             * Fires before cell editing is triggered. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value for the field being edited.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "beforeedit",
+            /**
+             * @event afteredit
+             * Fires after a cell is edited. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * </ul>
+             *
+             * <pre><code>
+grid.on('afteredit', afterEdit, this );
+
+function afterEdit(e) {
+    // execute an XHR to send/commit data to the server, in callback do (if successful):
+    e.record.commit();
+};
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "afteredit",
+            /**
+             * @event validateedit
+             * Fires after a cell is edited, but before the value is set in the record. Return false
+             * to cancel the change. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * Usage example showing how to remove the red triangle (dirty record indicator) from some
+             * records (not all).  By observing the grid's validateedit event, it can be cancelled if
+             * the edit occurs on a targeted row (for example) and then setting the field's new value
+             * in the Record directly:
+             * <pre><code>
+grid.on('validateedit', function(e) {
+  var myTargetRow = 6;
+
+  if (e.row == myTargetRow) {
+    e.cancel = true;
+    e.record.data[e.field] = e.value;
+  }
+});
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "validateedit"
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.EditorGridPanel.superclass.initEvents.call(this);
+
+        this.getGridEl().on('mousewheel', this.stopEditing.createDelegate(this, [true]), this);
+        this.on('columnresize', this.stopEditing, this, [true]);
+
+        if(this.clicksToEdit == 1){
+            this.on("cellclick", this.onCellDblClick, this);
+        }else {
+            var view = this.getView();
+            if(this.clicksToEdit == 'auto' && view.mainBody){
+                view.mainBody.on('mousedown', this.onAutoEditClick, this);
+            }
+            this.on('celldblclick', this.onCellDblClick, this);
+        }
+    },
+
+    onResize : function(){
+        Ext.grid.EditorGridPanel.superclass.onResize.apply(this, arguments);
+        var ae = this.activeEditor;
+        if(this.editing && ae){
+            ae.realign(true);
+        }
+    },
+
+    // private
+    onCellDblClick : function(g, row, col){
+        this.startEditing(row, col);
+    },
+
+    // private
+    onAutoEditClick : function(e, t){
+        if(e.button !== 0){
+            return;
+        }
+        var row = this.view.findRowIndex(t),
+            col = this.view.findCellIndex(t);
+        if(row !== false && col !== false){
+            this.stopEditing();
+            if(this.selModel.getSelectedCell){ // cell sm
+                var sc = this.selModel.getSelectedCell();
+                if(sc && sc[0] === row && sc[1] === col){
+                    this.startEditing(row, col);
+                }
+            }else{
+                if(this.selModel.isSelected(row)){
+                    this.startEditing(row, col);
+                }
+            }
+        }
+    },
+
+    // private
+    onEditComplete : function(ed, value, startValue){
+        this.editing = false;
+        this.lastActiveEditor = this.activeEditor;
+        this.activeEditor = null;
+
+        var r = ed.record,
+            field = this.colModel.getDataIndex(ed.col);
+        value = this.postEditValue(value, startValue, r, field);
+        if(this.forceValidation === true || String(value) !== String(startValue)){
+            var e = {
+                grid: this,
+                record: r,
+                field: field,
+                originalValue: startValue,
+                value: value,
+                row: ed.row,
+                column: ed.col,
+                cancel:false
+            };
+            if(this.fireEvent("validateedit", e) !== false && !e.cancel && String(value) !== String(startValue)){
+                r.set(field, e.value);
+                delete e.cancel;
+                this.fireEvent("afteredit", e);
+            }
+        }
+        this.view.focusCell(ed.row, ed.col);
+    },
+
+    /**
+     * Starts editing the specified for the specified row/column
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    startEditing : function(row, col){
+        this.stopEditing();
+        if(this.colModel.isCellEditable(col, row)){
+            this.view.ensureVisible(row, col, true);
+            var r = this.store.getAt(row),
+                field = this.colModel.getDataIndex(col),
+                e = {
+                    grid: this,
+                    record: r,
+                    field: field,
+                    value: r.data[field],
+                    row: row,
+                    column: col,
+                    cancel:false
+                };
+            if(this.fireEvent("beforeedit", e) !== false && !e.cancel){
+                this.editing = true;
+                var ed = this.colModel.getCellEditor(col, row);
+                if(!ed){
+                    return;
+                }
+                if(!ed.rendered){
+                    ed.parentEl = this.view.getEditorParent(ed);
+                    ed.on({
+                        scope: this,
+                        render: {
+                            fn: function(c){
+                                c.field.focus(false, true);
+                            },
+                            single: true,
+                            scope: this
+                        },
+                        specialkey: function(field, e){
+                            this.getSelectionModel().onEditorKey(field, e);
+                        },
+                        complete: this.onEditComplete,
+                        canceledit: this.stopEditing.createDelegate(this, [true])
+                    });
+                }
+                Ext.apply(ed, {
+                    row     : row,
+                    col     : col,
+                    record  : r
+                });
+                this.lastEdit = {
+                    row: row,
+                    col: col
+                };
+                this.activeEditor = ed;
+                // Set the selectSameEditor flag if we are reusing the same editor again and
+                // need to prevent the editor from firing onBlur on itself.
+                ed.selectSameEditor = (this.activeEditor == this.lastActiveEditor);
+                var v = this.preEditValue(r, field);
+                ed.startEdit(this.view.getCell(row, col).firstChild, Ext.isDefined(v) ? v : '');
+
+                // Clear the selectSameEditor flag
+                (function(){
+                    delete ed.selectSameEditor;
+                }).defer(50);
+            }
+        }
+    },
+
+    // private
+    preEditValue : function(r, field){
+        var value = r.data[field];
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlDecode(value) : value;
+    },
+
+    // private
+    postEditValue : function(value, originalValue, r, field){
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
+    },
+
+    /**
+     * Stops any active editing
+     * @param {Boolean} cancel (optional) True to cancel any changes
+     */
+    stopEditing : function(cancel){
+        if(this.editing){
+            // Store the lastActiveEditor to check if it is changing
+            var ae = this.lastActiveEditor = this.activeEditor;
+            if(ae){
+                ae[cancel === true ? 'cancelEdit' : 'completeEdit']();
+                this.view.focusCell(ae.row, ae.col);
+            }
+            this.activeEditor = null;
+        }
+        this.editing = false;
+    }
+});
+Ext.reg('editorgrid', Ext.grid.EditorGridPanel);// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridEditor = function(field, config){
+    Ext.grid.GridEditor.superclass.constructor.call(this, field, config);
+    field.monitorTab = false;
+};
+
+Ext.extend(Ext.grid.GridEditor, Ext.Editor, {
+    alignment: "tl-tl",
+    autoSize: "width",
+    hideEl : false,
+    cls: "x-small-editor x-grid-editor",
+    shim:false,
+    shadow:false
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Button=Ext.extend(Ext.BoxComponent,{hidden:false,disabled:false,pressed:false,enableToggle:false,menuAlign:"tl-bl?",type:"button",menuClassTarget:"tr:nth(2)",clickEvent:"click",handleMouseEvents:true,tooltipType:"qtip",buttonSelector:"button:first-child",scale:"small",iconAlign:"left",arrowAlign:"right",initComponent:function(){if(this.menu){if(Ext.isArray(this.menu)){this.menu={items:this.menu}}if(Ext.isObject(this.menu)){this.menu.ownerCt=this}this.menu=Ext.menu.MenuMgr.get(this.menu);this.menu.ownerCt=undefined}Ext.Button.superclass.initComponent.call(this);this.addEvents("click","toggle","mouseover","mouseout","menushow","menuhide","menutriggerover","menutriggerout");if(Ext.isString(this.toggleGroup)){this.enableToggle=true}},getTemplateArgs:function(){return[this.type,"x-btn-"+this.scale+" x-btn-icon-"+this.scale+"-"+this.iconAlign,this.getMenuClass(),this.cls,this.id]},setButtonClass:function(){if(this.useSetClass){if(!Ext.isEmpty(this.oldCls)){this.el.removeClass([this.oldCls,"x-btn-pressed"])}this.oldCls=(this.iconCls||this.icon)?(this.text?"x-btn-text-icon":"x-btn-icon"):"x-btn-noicon";this.el.addClass([this.oldCls,this.pressed?"x-btn-pressed":null])}},getMenuClass:function(){return this.menu?(this.arrowAlign!="bottom"?"x-btn-arrow":"x-btn-arrow-bottom"):""},onRender:function(c,a){if(!this.template){if(!Ext.Button.buttonTemplate){Ext.Button.buttonTemplate=new Ext.Template('<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">','<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>','<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>','<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',"</tbody></table>");Ext.Button.buttonTemplate.compile()}this.template=Ext.Button.buttonTemplate}var b,d=this.getTemplateArgs();if(a){b=this.template.insertBefore(a,d,true)}else{b=this.template.append(c,d,true)}this.btnEl=b.child(this.buttonSelector);this.mon(this.btnEl,{scope:this,focus:this.onFocus,blur:this.onBlur});this.initButtonEl(b,this.btnEl);Ext.ButtonToggleMgr.register(this)},initButtonEl:function(b,c){this.el=b;this.setIcon(this.icon);this.setText(this.text);this.setIconClass(this.iconCls);if(Ext.isDefined(this.tabIndex)){c.dom.tabIndex=this.tabIndex}if(this.tooltip){this.setTooltip(this.tooltip,true)}if(this.handleMouseEvents){this.mon(b,{scope:this,mouseover:this.onMouseOver,mousedown:this.onMouseDown})}if(this.menu){this.mon(this.menu,{scope:this,show:this.onMenuShow,hide:this.onMenuHide})}if(this.repeat){var a=new Ext.util.ClickRepeater(b,Ext.isObject(this.repeat)?this.repeat:{});this.mon(a,"click",this.onRepeatClick,this)}else{this.mon(b,this.clickEvent,this.onClick,this)}},afterRender:function(){Ext.Button.superclass.afterRender.call(this);this.useSetClass=true;this.setButtonClass();this.doc=Ext.getDoc();this.doAutoWidth()},setIconClass:function(a){this.iconCls=a;if(this.el){this.btnEl.dom.className="";this.btnEl.addClass(["x-btn-text",a||""]);this.setButtonClass()}return this},setTooltip:function(b,a){if(this.rendered){if(!a){this.clearTip()}if(Ext.isObject(b)){Ext.QuickTips.register(Ext.apply({target:this.btnEl.id},b));this.tooltip=b}else{this.btnEl.dom[this.tooltipType]=b}}else{this.tooltip=b}return this},clearTip:function(){if(Ext.isObject(this.tooltip)){Ext.QuickTips.unregister(this.btnEl)}},beforeDestroy:function(){if(this.rendered){this.clearTip()}if(this.menu&&this.destroyMenu!==false){Ext.destroy(this.btnEl,this.menu)}Ext.destroy(this.repeater)},onDestroy:function(){if(this.rendered){this.doc.un("mouseover",this.monitorMouseOver,this);this.doc.un("mouseup",this.onMouseUp,this);delete this.doc;delete this.btnEl;Ext.ButtonToggleMgr.unregister(this)}Ext.Button.superclass.onDestroy.call(this)},doAutoWidth:function(){if(this.autoWidth!==false&&this.el&&this.text&&this.width===undefined){this.el.setWidth("auto");if(Ext.isIE7&&Ext.isStrict){var a=this.btnEl;if(a&&a.getWidth()>20){a.clip();a.setWidth(Ext.util.TextMetrics.measure(a,this.text).width+a.getFrameWidth("lr"))}}if(this.minWidth){if(this.el.getWidth()<this.minWidth){this.el.setWidth(this.minWidth)}}}},setHandler:function(b,a){this.handler=b;this.scope=a;return this},setText:function(a){this.text=a;if(this.el){this.btnEl.update(a||"&#160;");this.setButtonClass()}this.doAutoWidth();return this},setIcon:function(a){this.icon=a;if(this.el){this.btnEl.setStyle("background-image",a?"url("+a+")":"");this.setButtonClass()}return this},getText:function(){return this.text},toggle:function(b,a){b=b===undefined?!this.pressed:!!b;if(b!=this.pressed){if(this.rendered){this.el[b?"addClass":"removeClass"]("x-btn-pressed")}this.pressed=b;if(!a){this.fireEvent("toggle",this,b);if(this.toggleHandler){this.toggleHandler.call(this.scope||this,this,b)}}}return this},onDisable:function(){this.onDisableChange(true)},onEnable:function(){this.onDisableChange(false)},onDisableChange:function(a){if(this.el){if(!Ext.isIE6||!this.text){this.el[a?"addClass":"removeClass"](this.disabledClass)}this.el.dom.disabled=a}this.disabled=a},showMenu:function(){if(this.rendered&&this.menu){if(this.tooltip){Ext.QuickTips.getQuickTip().cancelShow(this.btnEl)}if(this.menu.isVisible()){this.menu.hide()}this.menu.ownerCt=this;this.menu.show(this.el,this.menuAlign)}return this},hideMenu:function(){if(this.hasVisibleMenu()){this.menu.hide()}return this},hasVisibleMenu:function(){return this.menu&&this.menu.ownerCt==this&&this.menu.isVisible()},onRepeatClick:function(a,b){this.onClick(b)},onClick:function(a){if(a){a.preventDefault()}if(a.button!==0){return}if(!this.disabled){this.doToggle();if(this.menu&&!this.hasVisibleMenu()&&!this.ignoreNextClick){this.showMenu()}this.fireEvent("click",this,a);if(this.handler){this.handler.call(this.scope||this,this,a)}}},doToggle:function(){if(this.enableToggle&&(this.allowDepress!==false||!this.pressed)){this.toggle()}},isMenuTriggerOver:function(b,a){return this.menu&&!a},isMenuTriggerOut:function(b,a){return this.menu&&!a},onMouseOver:function(b){if(!this.disabled){var a=b.within(this.el,true);if(!a){this.el.addClass("x-btn-over");if(!this.monitoringMouseOver){this.doc.on("mouseover",this.monitorMouseOver,this);this.monitoringMouseOver=true}this.fireEvent("mouseover",this,b)}if(this.isMenuTriggerOver(b,a)){this.fireEvent("menutriggerover",this,this.menu,b)}}},monitorMouseOver:function(a){if(a.target!=this.el.dom&&!a.within(this.el)){if(this.monitoringMouseOver){this.doc.un("mouseover",this.monitorMouseOver,this);this.monitoringMouseOver=false}this.onMouseOut(a)}},onMouseOut:function(b){var a=b.within(this.el)&&b.target!=this.el.dom;this.el.removeClass("x-btn-over");this.fireEvent("mouseout",this,b);if(this.isMenuTriggerOut(b,a)){this.fireEvent("menutriggerout",this,this.menu,b)}},focus:function(){this.btnEl.focus()},blur:function(){this.btnEl.blur()},onFocus:function(a){if(!this.disabled){this.el.addClass("x-btn-focus")}},onBlur:function(a){this.el.removeClass("x-btn-focus")},getClickEl:function(b,a){return this.el},onMouseDown:function(a){if(!this.disabled&&a.button===0){this.getClickEl(a).addClass("x-btn-click");this.doc.on("mouseup",this.onMouseUp,this)}},onMouseUp:function(a){if(a.button===0){this.getClickEl(a,true).removeClass("x-btn-click");this.doc.un("mouseup",this.onMouseUp,this)}},onMenuShow:function(a){if(this.menu.ownerCt==this){this.menu.ownerCt=this;this.ignoreNextClick=0;this.el.addClass("x-btn-menu-active");this.fireEvent("menushow",this,this.menu)}},onMenuHide:function(a){if(this.menu.ownerCt==this){this.el.removeClass("x-btn-menu-active");this.ignoreNextClick=this.restoreClick.defer(250,this);this.fireEvent("menuhide",this,this.menu);delete this.menu.ownerCt}},restoreClick:function(){this.ignoreNextClick=0}});Ext.reg("button",Ext.Button);Ext.ButtonToggleMgr=function(){var a={};function b(e,h){if(h){var f=a[e.toggleGroup];for(var d=0,c=f.length;d<c;d++){if(f[d]!=e){f[d].toggle(false)}}}}return{register:function(c){if(!c.toggleGroup){return}var d=a[c.toggleGroup];if(!d){d=a[c.toggleGroup]=[]}d.push(c);c.on("toggle",b)},unregister:function(c){if(!c.toggleGroup){return}var d=a[c.toggleGroup];if(d){d.remove(c);c.un("toggle",b)}},getPressed:function(f){var e=a[f];if(e){for(var d=0,c=e.length;d<c;d++){if(e[d].pressed===true){return e[d]}}}return null}}}();Ext.SplitButton=Ext.extend(Ext.Button,{arrowSelector:"em",split:true,initComponent:function(){Ext.SplitButton.superclass.initComponent.call(this);this.addEvents("arrowclick")},onRender:function(){Ext.SplitButton.superclass.onRender.apply(this,arguments);if(this.arrowTooltip){this.el.child(this.arrowSelector).dom[this.tooltipType]=this.arrowTooltip}},setArrowHandler:function(b,a){this.arrowHandler=b;this.scope=a},getMenuClass:function(){return"x-btn-split"+(this.arrowAlign=="bottom"?"-bottom":"")},isClickOnArrow:function(c){if(this.arrowAlign!="bottom"){var b=this.el.child("em.x-btn-split");var a=b.getRegion().right-b.getPadding("r");return c.getPageX()>a}else{return c.getPageY()>this.btnEl.getRegion().bottom}},onClick:function(b,a){b.preventDefault();if(!this.disabled){if(this.isClickOnArrow(b)){if(this.menu&&!this.menu.isVisible()&&!this.ignoreNextClick){this.showMenu()}this.fireEvent("arrowclick",this,b);if(this.arrowHandler){this.arrowHandler.call(this.scope||this,this,b)}}else{this.doToggle();this.fireEvent("click",this,b);if(this.handler){this.handler.call(this.scope||this,this,b)}}}},isMenuTriggerOver:function(a){return this.menu&&a.target.tagName==this.arrowSelector},isMenuTriggerOut:function(b,a){return this.menu&&b.target.tagName!=this.arrowSelector}});Ext.reg("splitbutton",Ext.SplitButton);Ext.CycleButton=Ext.extend(Ext.SplitButton,{getItemText:function(a){if(a&&this.showText===true){var b="";if(this.prependText){b+=this.prependText}b+=a.text;return b}return undefined},setActiveItem:function(c,a){if(!Ext.isObject(c)){c=this.menu.getComponent(c)}if(c){if(!this.rendered){this.text=this.getItemText(c);this.iconCls=c.iconCls}else{var b=this.getItemText(c);if(b){this.setText(b)}this.setIconClass(c.iconCls)}this.activeItem=c;if(!c.checked){c.setChecked(true,a)}if(this.forceIcon){this.setIconClass(this.forceIcon)}if(!a){this.fireEvent("change",this,c)}}},getActiveItem:function(){return this.activeItem},initComponent:function(){this.addEvents("change");if(this.changeHandler){this.on("change",this.changeHandler,this.scope||this);delete this.changeHandler}this.itemCount=this.items.length;this.menu={cls:"x-cycle-menu",items:[]};var a=0;Ext.each(this.items,function(c,b){Ext.apply(c,{group:c.group||this.id,itemIndex:b,checkHandler:this.checkHandler,scope:this,checked:c.checked||false});this.menu.items.push(c);if(c.checked){a=b}},this);Ext.CycleButton.superclass.initComponent.call(this);this.on("click",this.toggleSelected,this);this.setActiveItem(a,true)},checkHandler:function(a,b){if(b){this.setActiveItem(a)}},toggleSelected:function(){var a=this.menu;a.render();if(!a.hasLayout){a.doLayout()}var d,b;for(var c=1;c<this.itemCount;c++){d=(this.activeItem.itemIndex+c)%this.itemCount;b=a.items.itemAt(d);if(!b.disabled){b.setChecked(true);break}}}});Ext.reg("cycle",Ext.CycleButton);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.DataView=Ext.extend(Ext.BoxComponent,{selectedClass:"x-view-selected",emptyText:"",deferEmptyText:true,trackOver:false,blockRefresh:false,last:false,initComponent:function(){Ext.DataView.superclass.initComponent.call(this);if(Ext.isString(this.tpl)||Ext.isArray(this.tpl)){this.tpl=new Ext.XTemplate(this.tpl)}this.addEvents("beforeclick","click","mouseenter","mouseleave","containerclick","dblclick","contextmenu","containercontextmenu","selectionchange","beforeselect");this.store=Ext.StoreMgr.lookup(this.store);this.all=new Ext.CompositeElementLite();this.selected=new Ext.CompositeElementLite()},afterRender:function(){Ext.DataView.superclass.afterRender.call(this);this.mon(this.getTemplateTarget(),{click:this.onClick,dblclick:this.onDblClick,contextmenu:this.onContextMenu,scope:this});if(this.overClass||this.trackOver){this.mon(this.getTemplateTarget(),{mouseover:this.onMouseOver,mouseout:this.onMouseOut,scope:this})}if(this.store){this.bindStore(this.store,true)}},refresh:function(){this.clearSelections(false,true);var b=this.getTemplateTarget(),a=this.store.getRange();b.update("");if(a.length<1){if(!this.deferEmptyText||this.hasSkippedEmptyText){b.update(this.emptyText)}this.all.clear()}else{this.tpl.overwrite(b,this.collectData(a,0));this.all.fill(Ext.query(this.itemSelector,b.dom));this.updateIndexes(0)}this.hasSkippedEmptyText=true},getTemplateTarget:function(){return this.el},prepareData:function(a){return a},collectData:function(b,e){var d=[],c=0,a=b.length;for(;c<a;c++){d[d.length]=this.prepareData(b[c].data,e+c,b[c])}return d},bufferRender:function(a,b){var c=document.createElement("div");this.tpl.overwrite(c,this.collectData(a,b));return Ext.query(this.itemSelector,c)},onUpdate:function(f,a){var b=this.store.indexOf(a);if(b>-1){var e=this.isSelected(b),c=this.all.elements[b],d=this.bufferRender([a],b)[0];this.all.replaceElement(b,d,true);if(e){this.selected.replaceElement(c,d);this.all.item(b).addClass(this.selectedClass)}this.updateIndexes(b,b)}},onAdd:function(f,d,e){if(this.all.getCount()===0){this.refresh();return}var c=this.bufferRender(d,e),g,b=this.all.elements;if(e<this.all.getCount()){g=this.all.item(e).insertSibling(c,"before",true);b.splice.apply(b,[e,0].concat(c))}else{g=this.all.last().insertSibling(c,"after",true);b.push.apply(b,c)}this.updateIndexes(e)},onRemove:function(c,a,b){this.deselect(b);this.all.removeElement(b,true);this.updateIndexes(b);if(this.store.getCount()===0){this.refresh()}},refreshNode:function(a){this.onUpdate(this.store,this.store.getAt(a))},updateIndexes:function(d,c){var b=this.all.elements;d=d||0;c=c||((c===0)?0:(b.length-1));for(var a=d;a<=c;a++){b[a].viewIndex=a}},getStore:function(){return this.store},bindStore:function(a,b){if(!b&&this.store){if(a!==this.store&&this.store.autoDestroy){this.store.destroy()}else{this.store.un("beforeload",this.onBeforeLoad,this);this.store.un("datachanged",this.onDataChanged,this);this.store.un("add",this.onAdd,this);this.store.un("remove",this.onRemove,this);this.store.un("update",this.onUpdate,this);this.store.un("clear",this.refresh,this)}if(!a){this.store=null}}if(a){a=Ext.StoreMgr.lookup(a);a.on({scope:this,beforeload:this.onBeforeLoad,datachanged:this.onDataChanged,add:this.onAdd,remove:this.onRemove,update:this.onUpdate,clear:this.refresh})}this.store=a;if(a){this.refresh()}},onDataChanged:function(){if(this.blockRefresh!==true){this.refresh.apply(this,arguments)}},findItemFromChild:function(a){return Ext.fly(a).findParent(this.itemSelector,this.getTemplateTarget())},onClick:function(c){var b=c.getTarget(this.itemSelector,this.getTemplateTarget()),a;if(b){a=this.indexOf(b);if(this.onItemClick(b,a,c)!==false){this.fireEvent("click",this,a,b,c)}}else{if(this.fireEvent("containerclick",this,c)!==false){this.onContainerClick(c)}}},onContainerClick:function(a){this.clearSelections()},onContextMenu:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a){this.fireEvent("contextmenu",this,this.indexOf(a),a,b)}else{this.fireEvent("containercontextmenu",this,b)}},onDblClick:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a){this.fireEvent("dblclick",this,this.indexOf(a),a,b)}},onMouseOver:function(b){var a=b.getTarget(this.itemSelector,this.getTemplateTarget());if(a&&a!==this.lastItem){this.lastItem=a;Ext.fly(a).addClass(this.overClass);this.fireEvent("mouseenter",this,this.indexOf(a),a,b)}},onMouseOut:function(a){if(this.lastItem){if(!a.within(this.lastItem,true,true)){Ext.fly(this.lastItem).removeClass(this.overClass);this.fireEvent("mouseleave",this,this.indexOf(this.lastItem),this.lastItem,a);delete this.lastItem}}},onItemClick:function(b,a,c){if(this.fireEvent("beforeclick",this,a,b,c)===false){return false}if(this.multiSelect){this.doMultiSelection(b,a,c);c.preventDefault()}else{if(this.singleSelect){this.doSingleSelection(b,a,c);c.preventDefault()}}return true},doSingleSelection:function(b,a,c){if(c.ctrlKey&&this.isSelected(a)){this.deselect(a)}else{this.select(a,false)}},doMultiSelection:function(c,a,d){if(d.shiftKey&&this.last!==false){var b=this.last;this.selectRange(b,a,d.ctrlKey);this.last=b}else{if((d.ctrlKey||this.simpleSelect)&&this.isSelected(a)){this.deselect(a)}else{this.select(a,d.ctrlKey||d.shiftKey||this.simpleSelect)}}},getSelectionCount:function(){return this.selected.getCount()},getSelectedNodes:function(){return this.selected.elements},getSelectedIndexes:function(){var b=[],d=this.selected.elements,c=0,a=d.length;for(;c<a;c++){b.push(d[c].viewIndex)}return b},getSelectedRecords:function(){return this.getRecords(this.selected.elements)},getRecords:function(c){var b=[],d=0,a=c.length;for(;d<a;d++){b[b.length]=this.store.getAt(c[d].viewIndex)}return b},getRecord:function(a){return this.store.getAt(a.viewIndex)},clearSelections:function(a,b){if((this.multiSelect||this.singleSelect)&&this.selected.getCount()>0){if(!b){this.selected.removeClass(this.selectedClass)}this.selected.clear();this.last=false;if(!a){this.fireEvent("selectionchange",this,this.selected.elements)}}},isSelected:function(a){return this.selected.contains(this.getNode(a))},deselect:function(a){if(this.isSelected(a)){a=this.getNode(a);this.selected.removeElement(a);if(this.last==a.viewIndex){this.last=false}Ext.fly(a).removeClass(this.selectedClass);this.fireEvent("selectionchange",this,this.selected.elements)}},select:function(d,f,b){if(Ext.isArray(d)){if(!f){this.clearSelections(true)}for(var c=0,a=d.length;c<a;c++){this.select(d[c],true,true)}if(!b){this.fireEvent("selectionchange",this,this.selected.elements)}}else{var e=this.getNode(d);if(!f){this.clearSelections(true)}if(e&&!this.isSelected(e)){if(this.fireEvent("beforeselect",this,e,this.selected.elements)!==false){Ext.fly(e).addClass(this.selectedClass);this.selected.add(e);this.last=e.viewIndex;if(!b){this.fireEvent("selectionchange",this,this.selected.elements)}}}}},selectRange:function(c,a,b){if(!b){this.clearSelections(true)}this.select(this.getNodes(c,a),true)},getNode:function(b){if(Ext.isString(b)){return document.getElementById(b)}else{if(Ext.isNumber(b)){return this.all.elements[b]}else{if(b instanceof Ext.data.Record){var a=this.store.indexOf(b);return this.all.elements[a]}}}return b},getNodes:function(e,a){var d=this.all.elements,b=[],c;e=e||0;a=!Ext.isDefined(a)?Math.max(d.length-1,0):a;if(e<=a){for(c=e;c<=a&&d[c];c++){b.push(d[c])}}else{for(c=e;c>=a&&d[c];c--){b.push(d[c])}}return b},indexOf:function(a){a=this.getNode(a);if(Ext.isNumber(a.viewIndex)){return a.viewIndex}return this.all.indexOf(a)},onBeforeLoad:function(){if(this.loadingText){this.clearSelections(false,true);this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+"</div>");this.all.clear()}},onDestroy:function(){this.all.clear();this.selected.clear();Ext.DataView.superclass.onDestroy.call(this);this.bindStore(null)}});Ext.DataView.prototype.setStore=Ext.DataView.prototype.bindStore;Ext.reg("dataview",Ext.DataView);Ext.list.ListView=Ext.extend(Ext.DataView,{itemSelector:"dl",selectedClass:"x-list-selected",overClass:"x-list-over",scrollOffset:undefined,columnResize:true,columnSort:true,maxColumnWidth:Ext.isIE?99:100,initComponent:function(){if(this.columnResize){this.colResizer=new Ext.list.ColumnResizer(this.colResizer);this.colResizer.init(this)}if(this.columnSort){this.colSorter=new Ext.list.Sorter(this.columnSort);this.colSorter.init(this)}if(!this.internalTpl){this.internalTpl=new Ext.XTemplate('<div class="x-list-header"><div class="x-list-header-inner">','<tpl for="columns">','<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id,'-xlhd-{#}">',"{header}","</em></div>","</tpl>",'<div class="x-clear"></div>',"</div></div>",'<div class="x-list-body"><div class="x-list-body-inner">',"</div></div>")}if(!this.tpl){this.tpl=new Ext.XTemplate('<tpl for="rows">',"<dl>",'<tpl for="parent.columns">','<dt style="width:{[values.width*100]}%;text-align:{align};">','<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',"{[values.tpl.apply(parent)]}","</em></dt>","</tpl>",'<div class="x-clear"></div>',"</dl>","</tpl>")}var k=this.columns,g=0,h=0,l=k.length,b=[];for(var f=0;f<l;f++){var m=k[f];if(!m.isColumn){m.xtype=m.xtype?(/^lv/.test(m.xtype)?m.xtype:"lv"+m.xtype):"lvcolumn";m=Ext.create(m)}if(m.width){g+=m.width*100;if(g>this.maxColumnWidth){m.width-=(g-this.maxColumnWidth)/100}h++}b.push(m)}k=this.columns=b;if(h<l){var d=l-h;if(g<this.maxColumnWidth){var a=((this.maxColumnWidth-g)/d)/100;for(var e=0;e<l;e++){var m=k[e];if(!m.width){m.width=a}}}}Ext.list.ListView.superclass.initComponent.call(this)},onRender:function(){this.autoEl={cls:"x-list-wrap"};Ext.list.ListView.superclass.onRender.apply(this,arguments);this.internalTpl.overwrite(this.el,{columns:this.columns});this.innerBody=Ext.get(this.el.dom.childNodes[1].firstChild);this.innerHd=Ext.get(this.el.dom.firstChild.firstChild);if(this.hideHeaders){this.el.dom.firstChild.style.display="none"}},getTemplateTarget:function(){return this.innerBody},collectData:function(){var a=Ext.list.ListView.superclass.collectData.apply(this,arguments);return{columns:this.columns,rows:a}},verifyInternalSize:function(){if(this.lastSize){this.onResize(this.lastSize.width,this.lastSize.height)}},onResize:function(c,e){var b=this.innerBody.dom,f=this.innerHd.dom,d=c-Ext.num(this.scrollOffset,Ext.getScrollBarWidth())+"px",a;if(!b){return}a=b.parentNode;if(Ext.isNumber(c)){if(this.reserveScrollOffset||((a.offsetWidth-a.clientWidth)>10)){b.style.width=d;f.style.width=d}else{b.style.width=c+"px";f.style.width=c+"px";setTimeout(function(){if((a.offsetWidth-a.clientWidth)>10){b.style.width=d;f.style.width=d}},10)}}if(Ext.isNumber(e)){a.style.height=Math.max(0,e-f.parentNode.offsetHeight)+"px"}},updateIndexes:function(){Ext.list.ListView.superclass.updateIndexes.apply(this,arguments);this.verifyInternalSize()},findHeaderIndex:function(f){f=f.dom||f;var a=f.parentNode,d=a.parentNode.childNodes,b=0,e;for(;e=d[b];b++){if(e==a){return b}}return -1},setHdWidths:function(){var d=this.innerHd.dom.getElementsByTagName("div"),c=0,b=this.columns,a=b.length;for(;c<a;c++){d[c].style.width=(b[c].width*100)+"%"}}});Ext.reg("listview",Ext.list.ListView);Ext.ListView=Ext.list.ListView;Ext.list.Column=Ext.extend(Object,{isColumn:true,align:"left",header:"",width:null,cls:"",constructor:function(a){if(!a.tpl){a.tpl=new Ext.XTemplate("{"+a.dataIndex+"}")}else{if(Ext.isString(a.tpl)){a.tpl=new Ext.XTemplate(a.tpl)}}Ext.apply(this,a)}});Ext.reg("lvcolumn",Ext.list.Column);Ext.list.NumberColumn=Ext.extend(Ext.list.Column,{format:"0,000.00",constructor:function(a){a.tpl=a.tpl||new Ext.XTemplate("{"+a.dataIndex+':number("'+(a.format||this.format)+'")}');Ext.list.NumberColumn.superclass.constructor.call(this,a)}});Ext.reg("lvnumbercolumn",Ext.list.NumberColumn);Ext.list.DateColumn=Ext.extend(Ext.list.Column,{format:"m/d/Y",constructor:function(a){a.tpl=a.tpl||new Ext.XTemplate("{"+a.dataIndex+':date("'+(a.format||this.format)+'")}');Ext.list.DateColumn.superclass.constructor.call(this,a)}});Ext.reg("lvdatecolumn",Ext.list.DateColumn);Ext.list.BooleanColumn=Ext.extend(Ext.list.Column,{trueText:"true",falseText:"false",undefinedText:"&#160;",constructor:function(e){e.tpl=e.tpl||new Ext.XTemplate("{"+e.dataIndex+":this.format}");var b=this.trueText,d=this.falseText,a=this.undefinedText;e.tpl.format=function(c){if(c===undefined){return a}if(!c||c==="false"){return d}return b};Ext.list.DateColumn.superclass.constructor.call(this,e)}});Ext.reg("lvbooleancolumn",Ext.list.BooleanColumn);Ext.list.ColumnResizer=Ext.extend(Ext.util.Observable,{minPct:0.05,constructor:function(a){Ext.apply(this,a);Ext.list.ColumnResizer.superclass.constructor.call(this)},init:function(a){this.view=a;a.on("render",this.initEvents,this)},initEvents:function(a){a.mon(a.innerHd,"mousemove",this.handleHdMove,this);this.tracker=new Ext.dd.DragTracker({onBeforeStart:this.onBeforeStart.createDelegate(this),onStart:this.onStart.createDelegate(this),onDrag:this.onDrag.createDelegate(this),onEnd:this.onEnd.createDelegate(this),tolerance:3,autoStart:300});this.tracker.initEl(a.innerHd);a.on("beforedestroy",this.tracker.destroy,this.tracker)},handleHdMove:function(h,d){var c=5,b=h.getPageX(),i=h.getTarget("em",3,true);if(i){var g=i.getRegion(),f=i.dom.style,a=i.dom.parentNode;if(b-g.left<=c&&a!=a.parentNode.firstChild){this.activeHd=Ext.get(a.previousSibling.firstChild);f.cursor=Ext.isWebKit?"e-resize":"col-resize"}else{if(g.right-b<=c&&a!=a.parentNode.lastChild.previousSibling){this.activeHd=i;f.cursor=Ext.isWebKit?"w-resize":"col-resize"}else{delete this.activeHd;f.cursor=""}}}},onBeforeStart:function(a){this.dragHd=this.activeHd;return !!this.dragHd},onStart:function(f){var d=this,b=d.view,c=d.dragHd,a=d.tracker.getXY()[0];d.proxy=b.el.createChild({cls:"x-list-resizer"});d.dragX=c.getX();d.headerIndex=b.findHeaderIndex(c);d.headersDisabled=b.disableHeaders;b.disableHeaders=true;d.proxy.setHeight(b.el.getHeight());d.proxy.setX(d.dragX);d.proxy.setWidth(a-d.dragX);this.setBoundaries()},setBoundaries:function(i){var j=this.view,g=this.headerIndex,c=j.innerHd.getWidth(),i=j.innerHd.getX(),b=Math.ceil(c*this.minPct),k=c-b,e=j.columns.length,d=j.innerHd.select("em",true),f=b+i,a=k+i,h;if(e==2){this.minX=f;this.maxX=a}else{h=d.item(g+2);this.minX=d.item(g).getX()+b;this.maxX=h?h.getX()-b:a;if(g==0){this.minX=f}else{if(g==e-2){this.maxX=a}}}},onDrag:function(c){var b=this,a=b.tracker.getXY()[0].constrain(b.minX,b.maxX);b.proxy.setWidth(a-this.dragX)},onEnd:function(h){var f=this.proxy.getWidth(),g=this.headerIndex,k=this.view,c=k.columns,b=k.innerHd.getWidth(),j=Math.ceil(f*k.maxColumnWidth/b)/100,d=this.headersDisabled,l=c[g],i=c[g+1],a=l.width+i.width;this.proxy.remove();l.width=j;i.width=a-j;delete this.dragHd;k.setHdWidths();k.refresh();setTimeout(function(){k.disableHeaders=d},100)}});Ext.ListView.ColumnResizer=Ext.list.ColumnResizer;Ext.list.Sorter=Ext.extend(Ext.util.Observable,{sortClasses:["sort-asc","sort-desc"],constructor:function(a){Ext.apply(this,a);Ext.list.Sorter.superclass.constructor.call(this)},init:function(a){this.view=a;a.on("render",this.initEvents,this)},initEvents:function(a){a.mon(a.innerHd,"click",this.onHdClick,this);a.innerHd.setStyle("cursor","pointer");a.mon(a.store,"datachanged",this.updateSortState,this);this.updateSortState.defer(10,this,[a.store])},updateSortState:function(c){var f=c.getSortState();if(!f){return}this.sortState=f;var e=this.view.columns,g=-1;for(var d=0,a=e.length;d<a;d++){if(e[d].dataIndex==f.field){g=d;break}}if(g!=-1){var b=f.direction;this.updateSortIcon(g,b)}},updateSortIcon:function(b,a){var d=this.sortClasses;var c=this.view.innerHd.select("em").removeClass(d);c.item(b).addClass(d[a=="DESC"?1:0])},onHdClick:function(c){var b=c.getTarget("em",3);if(b&&!this.view.disableHeaders){var a=this.view.findHeaderIndex(b);this.view.store.sort(this.view.columns[a].dataIndex)}}});Ext.ListView.Sorter=Ext.list.Sorter;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-grouping-debug.js	(revision 76)
@@ -0,0 +1,611 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GroupingView
+ * @extends Ext.grid.GridView
+ * Adds the ability for single level grouping to the grid. A {@link Ext.data.GroupingStore GroupingStore}
+ * must be used to enable grouping.  Some grouping characteristics may also be configured at the
+ * {@link Ext.grid.Column Column level}<div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.grid.Column#emptyGroupText emptyGroupText}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupable groupable}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupName groupName}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupRender groupRender}</code></li>
+ * </ul></div>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    // A groupingStore is required for a GroupingView
+    store: new {@link Ext.data.GroupingStore}({
+        autoDestroy: true,
+        reader: reader,
+        data: xg.dummyData,
+        sortInfo: {field: 'company', direction: 'ASC'},
+        {@link Ext.data.GroupingStore#groupOnSort groupOnSort}: true,
+        {@link Ext.data.GroupingStore#remoteGroup remoteGroup}: true,
+        {@link Ext.data.GroupingStore#groupField groupField}: 'industry'
+    }),
+    colModel: new {@link Ext.grid.ColumnModel}({
+        columns:[
+            {id:'company',header: 'Company', width: 60, dataIndex: 'company'},
+            // {@link Ext.grid.Column#groupable groupable}, {@link Ext.grid.Column#groupName groupName}, {@link Ext.grid.Column#groupRender groupRender} are also configurable at column level
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price', {@link Ext.grid.Column#groupable groupable}: false},
+            {header: 'Change', dataIndex: 'change', renderer: Ext.util.Format.usMoney},
+            {header: 'Industry', dataIndex: 'industry'},
+            {header: 'Last Updated', renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
+        ],
+        defaults: {
+            sortable: true,
+            menuDisabled: false,
+            width: 20
+        }
+    }),
+
+    view: new Ext.grid.GroupingView({
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+        // custom grouping text template to display the number of items per group
+        {@link #groupTextTpl}: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+
+    frame:true,
+    width: 700,
+    height: 450,
+    collapsible: true,
+    animCollapse: false,
+    title: 'Grouping Example',
+    iconCls: 'icon-grid',
+    renderTo: document.body
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {
+
+    /**
+     * @cfg {String} groupByText Text displayed in the grid header menu for grouping by a column
+     * (defaults to 'Group By This Field').
+     */
+    groupByText : 'Group By This Field',
+    /**
+     * @cfg {String} showGroupsText Text displayed in the grid header for enabling/disabling grouping
+     * (defaults to 'Show in Groups').
+     */
+    showGroupsText : 'Show in Groups',
+    /**
+     * @cfg {Boolean} hideGroupedColumn <tt>true</tt> to hide the column that is currently grouped (defaults to <tt>false</tt>)
+     */
+    hideGroupedColumn : false,
+    /**
+     * @cfg {Boolean} showGroupName If <tt>true</tt> will display a prefix plus a ': ' before the group field value
+     * in the group header line.  The prefix will consist of the <tt><b>{@link Ext.grid.Column#groupName groupName}</b></tt>
+     * (or the configured <tt><b>{@link Ext.grid.Column#header header}</b></tt> if not provided) configured in the
+     * {@link Ext.grid.Column} for each set of grouped rows (defaults to <tt>true</tt>).
+     */
+    showGroupName : true,
+    /**
+     * @cfg {Boolean} startCollapsed <tt>true</tt> to start all groups collapsed (defaults to <tt>false</tt>)
+     */
+    startCollapsed : false,
+    /**
+     * @cfg {Boolean} enableGrouping <tt>false</tt> to disable grouping functionality (defaults to <tt>true</tt>)
+     */
+    enableGrouping : true,
+    /**
+     * @cfg {Boolean} enableGroupingMenu <tt>true</tt> to enable the grouping control in the column menu (defaults to <tt>true</tt>)
+     */
+    enableGroupingMenu : true,
+    /**
+     * @cfg {Boolean} enableNoGroups <tt>true</tt> to allow the user to turn off grouping (defaults to <tt>true</tt>)
+     */
+    enableNoGroups : true,
+    /**
+     * @cfg {String} emptyGroupText The text to display when there is an empty group value (defaults to <tt>'(None)'</tt>).
+     * May also be specified per column, see {@link Ext.grid.Column}.{@link Ext.grid.Column#emptyGroupText emptyGroupText}.
+     */
+    emptyGroupText : '(None)',
+    /**
+     * @cfg {Boolean} ignoreAdd <tt>true</tt> to skip refreshing the view when new rows are added (defaults to <tt>false</tt>)
+     */
+    ignoreAdd : false,
+    /**
+     * @cfg {String} groupTextTpl The template used to render the group header (defaults to <tt>'{text}'</tt>).
+     * This is used to format an object which contains the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>group</b> : String<p class="sub-desc">The <i>rendered</i> value of the group field.
+     * By default this is the unchanged value of the group field. If a <tt><b>{@link Ext.grid.Column#groupRenderer groupRenderer}</b></tt>
+     * is specified, it is the result of a call to that function.</p></li>
+     * <li><b>gvalue</b> : Object<p class="sub-desc">The <i>raw</i> value of the group field.</p></li>
+     * <li><b>text</b> : String<p class="sub-desc">The configured header (as described in <tt>{@link #showGroupName})</tt>
+     * if <tt>{@link #showGroupName}</tt> is <tt>true</tt>) plus the <i>rendered</i> group field value.</p></li>
+     * <li><b>groupId</b> : String<p class="sub-desc">A unique, generated ID which is applied to the
+     * View Element which contains the group.</p></li>
+     * <li><b>startRow</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>rs</b> : Array<p class="sub-desc">Contains a single element: The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>cls</b> : String<p class="sub-desc">The generated class name string to apply to the group header Element.</p></li>
+     * <li><b>style</b> : String<p class="sub-desc">The inline style rules to apply to the group header Element.</p></li>
+     * </ul></div></p>
+     * See {@link Ext.XTemplate} for information on how to format data using a template. Possible usage:<pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    view: new Ext.grid.GroupingView({
+        groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+});
+     * </code></pre>
+     */
+    groupTextTpl : '{text}',
+
+    /**
+     * @cfg {String} groupMode Indicates how to construct the group identifier. <tt>'value'</tt> constructs the id using
+     * raw value, <tt>'display'</tt> constructs the id using the rendered value. Defaults to <tt>'value'</tt>.
+     */
+    groupMode: 'value',
+
+    /**
+     * @cfg {Function} groupRenderer This property must be configured in the {@link Ext.grid.Column} for
+     * each column.
+     */
+    
+    /**
+     * @cfg {Boolean} cancelEditOnToggle True to cancel any editing when the group header is toggled. Defaults to <tt>true</tt>.
+     */
+    cancelEditOnToggle: true,
+
+    // private
+    initTemplates : function(){
+        Ext.grid.GroupingView.superclass.initTemplates.call(this);
+        this.state = {};
+
+        var sm = this.grid.getSelectionModel();
+        sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',
+                this.onBeforeRowSelect, this);
+
+        if(!this.startGroup){
+            this.startGroup = new Ext.XTemplate(
+                '<div id="{groupId}" class="x-grid-group {cls}">',
+                    '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">', this.groupTextTpl ,'</div></div>',
+                    '<div id="{groupId}-bd" class="x-grid-group-body">'
+            );
+        }
+        this.startGroup.compile();
+
+        if (!this.endGroup) {
+            this.endGroup = '</div></div>';
+        }
+    },
+
+    // private
+    findGroup : function(el){
+        return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);
+    },
+
+    // private
+    getGroups : function(){
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // private
+    onAdd : function(ds, records, index) {
+        if (this.canGroup() && !this.ignoreAdd) {
+            var ss = this.getScrollState();
+            this.fireEvent('beforerowsinserted', ds, index, index + (records.length-1));
+            this.refresh();
+            this.restoreScroll(ss);
+            this.fireEvent('rowsinserted', ds, index, index + (records.length-1));
+        } else if (!this.canGroup()) {
+            Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);
+        }
+    },
+
+    // private
+    onRemove : function(ds, record, index, isUpdate){
+        Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);
+        var g = document.getElementById(record._groupId);
+        if(g && g.childNodes[1].childNodes.length < 1){
+            Ext.removeNode(g);
+        }
+        this.applyEmptyText();
+    },
+
+    // private
+    refreshRow : function(record){
+        if(this.ds.getCount()==1){
+            this.refresh();
+        }else{
+            this.isUpdating = true;
+            Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);
+            this.isUpdating = false;
+        }
+    },
+
+    // private
+    beforeMenuShow : function(){
+        var item, items = this.hmenu.items, disabled = this.cm.config[this.hdCtxIndex].groupable === false;
+        if((item = items.get('groupBy'))){
+            item.setDisabled(disabled);
+        }
+        if((item = items.get('showGroups'))){
+            item.setDisabled(disabled);
+            item.setChecked(this.canGroup(), true);
+        }
+    },
+
+    // private
+    renderUI : function(){
+        var markup = Ext.grid.GroupingView.superclass.renderUI.call(this);
+
+        if(this.enableGroupingMenu && this.hmenu){
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            if(this.enableNoGroups){
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+        return markup;
+    },
+
+    processEvent: function(name, e){
+        Ext.grid.GroupingView.superclass.processEvent.call(this, name, e);
+        var hd = e.getTarget('.x-grid-group-hd', this.mainBody);
+        if(hd){
+            // group value is at the end of the string
+            var field = this.getGroupField(),
+                prefix = this.getPrefix(field),
+                groupValue = hd.id.substring(prefix.length),
+                emptyRe = new RegExp('gp-' + Ext.escapeRe(field) + '--hd');
+
+            // remove trailing '-hd'
+            groupValue = groupValue.substr(0, groupValue.length - 3);
+            
+            // also need to check for empty groups
+            if(groupValue || emptyRe.test(hd.id)){
+                this.grid.fireEvent('group' + name, this.grid, field, groupValue, e);
+            }
+            if(name == 'mousedown' && e.button == 0){
+                this.toggleGroup(hd.parentNode);
+            }
+        }
+
+    },
+
+    // private
+    onGroupByClick : function(){
+        var grid = this.grid;
+        this.enableGrouping = true;
+        grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));
+        grid.fireEvent('groupchange', grid, grid.store.getGroupState());
+        this.beforeMenuShow(); // Make sure the checkboxes get properly set when changing groups
+        this.refresh();
+    },
+
+    // private
+    onShowGroupsClick : function(mi, checked){
+        this.enableGrouping = checked;
+        if(checked){
+            this.onGroupByClick();
+        }else{
+            this.grid.store.clearGrouping();
+            this.grid.fireEvent('groupchange', this, null);
+        }
+    },
+
+    /**
+     * Toggle the group that contains the specific row.
+     * @param {Number} rowIndex The row inside the group
+     * @param {Boolean} expanded (optional)
+     */
+    toggleRowIndex : function(rowIndex, expanded){
+        if(!this.canGroup()){
+            return;
+        }
+        var row = this.getRow(rowIndex);
+        if(row){
+            this.toggleGroup(this.findGroup(row), expanded);
+        }
+    },
+
+    /**
+     * Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed.
+     * @param {String} groupId The groupId assigned to the group (see getGroupId)
+     * @param {Boolean} expanded (optional)
+     */
+    toggleGroup : function(group, expanded){
+        var gel = Ext.get(group),
+            id = Ext.util.Format.htmlEncode(gel.id);
+ 
+        expanded = Ext.isDefined(expanded) ? expanded : gel.hasClass('x-grid-group-collapsed');
+        if(this.state[id] !== expanded){
+            if (this.cancelEditOnToggle !== false) {
+                this.grid.stopEditing(true);
+            }
+            this.state[id] = expanded;
+            gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');
+        }
+    },
+
+    /**
+     * Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed.
+     * @param {Boolean} expanded (optional)
+     */
+    toggleAllGroups : function(expanded){
+        var groups = this.getGroups();
+        for(var i = 0, len = groups.length; i < len; i++){
+            this.toggleGroup(groups[i], expanded);
+        }
+    },
+
+    /**
+     * Expands all grouped rows.
+     */
+    expandAllGroups : function(){
+        this.toggleAllGroups(true);
+    },
+
+    /**
+     * Collapses all grouped rows.
+     */
+    collapseAllGroups : function(){
+        this.toggleAllGroups(false);
+    },
+
+    // private
+    getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){
+        var column = this.cm.config[colIndex],
+            g = groupRenderer ? groupRenderer.call(column.scope, v, {}, r, rowIndex, colIndex, ds) : String(v);
+        if(g === '' || g === '&#160;'){
+            g = column.emptyGroupText || this.emptyGroupText;
+        }
+        return g;
+    },
+
+    // private
+    getGroupField : function(){
+        return this.grid.store.getGroupState();
+    },
+
+    // private
+    afterRender : function(){
+        if(!this.ds || !this.cm){
+            return;
+        }
+        Ext.grid.GroupingView.superclass.afterRender.call(this);
+        if(this.grid.deferRowRender){
+            this.updateGroupWidths();
+        }
+    },
+    
+    afterRenderUI: function () {
+        Ext.grid.GroupingView.superclass.afterRenderUI.call(this);
+
+        if (this.enableGroupingMenu && this.hmenu) {
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            
+            if (this.enableNoGroups) {
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+    },
+
+    // private
+    renderRows : function(){
+        var groupField = this.getGroupField();
+        var eg = !!groupField;
+        // if they turned off grouping and the last grouped field is hidden
+        if(this.hideGroupedColumn) {
+            var colIndex = this.cm.findColumnIndex(groupField),
+                hasLastGroupField = Ext.isDefined(this.lastGroupField);
+            if(!eg && hasLastGroupField){
+                this.mainBody.update('');
+                this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);
+                delete this.lastGroupField;
+            }else if (eg && !hasLastGroupField){
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }else if (eg && hasLastGroupField && groupField !== this.lastGroupField) {
+                this.mainBody.update('');
+                var oldIndex = this.cm.findColumnIndex(this.lastGroupField);
+                this.cm.setHidden(oldIndex, false);
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }
+        }
+        return Ext.grid.GroupingView.superclass.renderRows.apply(
+                    this, arguments);
+    },
+
+    // private
+    doRender : function(cs, rs, ds, startRow, colCount, stripe){
+        if(rs.length < 1){
+            return '';
+        }
+
+        if(!this.canGroup() || this.isUpdating){
+            return Ext.grid.GroupingView.superclass.doRender.apply(this, arguments);
+        }
+
+        var groupField = this.getGroupField(),
+            colIndex = this.cm.findColumnIndex(groupField),
+            g,
+            gstyle = 'width:' + this.getTotalWidth() + ';',
+            cfg = this.cm.config[colIndex],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            prefix = this.showGroupName ? (cfg.groupName || cfg.header)+': ' : '',
+            groups = [],
+            curGroup, i, len, gid;
+
+        for(i = 0, len = rs.length; i < len; i++){
+            var rowIndex = startRow + i,
+                r = rs[i],
+                gvalue = r.data[groupField];
+
+                g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);
+            if(!curGroup || curGroup.group != g){
+                gid = this.constructId(gvalue, groupField, colIndex);
+                // if state is defined use it, however state is in terms of expanded
+                // so negate it, otherwise use the default.
+                this.state[gid] = !(Ext.isDefined(this.state[gid]) ? !this.state[gid] : this.startCollapsed);
+                curGroup = {
+                    group: g,
+                    gvalue: gvalue,
+                    text: prefix + g,
+                    groupId: gid,
+                    startRow: rowIndex,
+                    rs: [r],
+                    cls: this.state[gid] ? '' : 'x-grid-group-collapsed',
+                    style: gstyle
+                };
+                groups.push(curGroup);
+            }else{
+                curGroup.rs.push(r);
+            }
+            r._groupId = gid;
+        }
+
+        var buf = [];
+        for(i = 0, len = groups.length; i < len; i++){
+            g = groups[i];
+            this.doGroupStart(buf, g, cs, ds, colCount);
+            buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(
+                    this, cs, g.rs, ds, g.startRow, colCount, stripe);
+
+            this.doGroupEnd(buf, g, cs, ds, colCount);
+        }
+        return buf.join('');
+    },
+
+    /**
+     * Dynamically tries to determine the groupId of a specific value
+     * @param {String} value
+     * @return {String} The group id
+     */
+    getGroupId : function(value){
+        var field = this.getGroupField();
+        return this.constructId(value, field, this.cm.findColumnIndex(field));
+    },
+
+    // private
+    constructId : function(value, field, idx){
+        var cfg = this.cm.config[idx],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            val = (this.groupMode == 'value') ? value : this.getGroup(value, {data:{}}, groupRenderer, 0, idx, this.ds);
+
+        return this.getPrefix(field) + Ext.util.Format.htmlEncode(val);
+    },
+
+    // private
+    canGroup  : function(){
+        return this.enableGrouping && !!this.getGroupField();
+    },
+
+    // private
+    getPrefix: function(field){
+        return this.grid.getGridEl().id + '-gp-' + field + '-';
+    },
+
+    // private
+    doGroupStart : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.startGroup.apply(g);
+    },
+
+    // private
+    doGroupEnd : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.endGroup;
+    },
+
+    // private
+    getRows : function(){
+        if(!this.canGroup()){
+            return Ext.grid.GroupingView.superclass.getRows.call(this);
+        }
+        var r = [],
+            gs = this.getGroups(),
+            g,
+            i = 0,
+            len = gs.length,
+            j,
+            jlen;
+        for(; i < len; ++i){
+            g = gs[i].childNodes[1];
+            if(g){
+                g = g.childNodes;
+                for(j = 0, jlen = g.length; j < jlen; ++j){
+                    r[r.length] = g[j];
+                }
+            }
+        }
+        return r;
+    },
+
+    // private
+    updateGroupWidths : function(){
+        if(!this.canGroup() || !this.hasRows()){
+            return;
+        }
+        var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.getScrollOffset()) +'px';
+        var gs = this.getGroups();
+        for(var i = 0, len = gs.length; i < len; i++){
+            gs[i].firstChild.style.width = tw;
+        }
+    },
+
+    // private
+    onColumnWidthUpdated : function(col, w, tw){
+        Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this, col, w, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onAllColumnWidthsUpdated : function(ws, tw){
+        Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this, ws, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onColumnHiddenUpdated : function(col, hidden, tw){
+        Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this, col, hidden, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onLayout : function(){
+        this.updateGroupWidths();
+    },
+
+    // private
+    onBeforeRowSelect : function(sm, rowIndex){
+        this.toggleRowIndex(rowIndex, true);
+    }
+});
+// private
+Ext.grid.GroupingView.GROUP_ID = 1000;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-menu.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.menu.Menu=Ext.extend(Ext.Container,{minWidth:120,shadow:"sides",subMenuAlign:"tl-tr?",defaultAlign:"tl-bl?",allowOtherMenus:false,ignoreParentClicks:false,enableScrolling:true,maxHeight:null,scrollIncrement:24,showSeparator:true,defaultOffsets:[0,0],plain:false,floating:true,zIndex:15000,hidden:true,layout:"menu",hideMode:"offsets",scrollerHeight:8,autoLayout:true,defaultType:"menuitem",bufferResize:false,initComponent:function(){if(Ext.isArray(this.initialConfig)){Ext.apply(this,{items:this.initialConfig})}this.addEvents("click","mouseover","mouseout","itemclick");Ext.menu.MenuMgr.register(this);if(this.floating){Ext.EventManager.onWindowResize(this.hide,this)}else{if(this.initialConfig.hidden!==false){this.hidden=false}this.internalDefaults={hideOnClick:false}}Ext.menu.Menu.superclass.initComponent.call(this);if(this.autoLayout){var a=this.doLayout.createDelegate(this,[]);this.on({add:a,remove:a})}},getLayoutTarget:function(){return this.ul},onRender:function(b,a){if(!b){b=Ext.getBody()}var c={id:this.getId(),cls:"x-menu "+((this.floating)?"x-menu-floating x-layer ":"")+(this.cls||"")+(this.plain?" x-menu-plain":"")+(this.showSeparator?"":" x-menu-nosep"),style:this.style,cn:[{tag:"a",cls:"x-menu-focus",href:"#",onclick:"return false;",tabIndex:"-1"},{tag:"ul",cls:"x-menu-list"}]};if(this.floating){this.el=new Ext.Layer({shadow:this.shadow,dh:c,constrain:false,parentEl:b,zindex:this.zIndex})}else{this.el=b.createChild(c)}Ext.menu.Menu.superclass.onRender.call(this,b,a);if(!this.keyNav){this.keyNav=new Ext.menu.MenuNav(this)}this.focusEl=this.el.child("a.x-menu-focus");this.ul=this.el.child("ul.x-menu-list");this.mon(this.ul,{scope:this,click:this.onClick,mouseover:this.onMouseOver,mouseout:this.onMouseOut});if(this.enableScrolling){this.mon(this.el,{scope:this,delegate:".x-menu-scroller",click:this.onScroll,mouseover:this.deactivateActive})}},findTargetItem:function(b){var a=b.getTarget(".x-menu-list-item",this.ul,true);if(a&&a.menuItemId){return this.items.get(a.menuItemId)}},onClick:function(b){var a=this.findTargetItem(b);if(a){if(a.isFormField){this.setActiveItem(a)}else{if(a instanceof Ext.menu.BaseItem){if(a.menu&&this.ignoreParentClicks){a.expandMenu();b.preventDefault()}else{if(a.onClick){a.onClick(b);this.fireEvent("click",this,a,b)}}}}}},setActiveItem:function(a,b){if(a!=this.activeItem){this.deactivateActive();if((this.activeItem=a).isFormField){a.focus()}else{a.activate(b)}}else{if(b){a.expandMenu()}}},deactivateActive:function(){var b=this.activeItem;if(b){if(b.isFormField){if(b.collapse){b.collapse()}}else{b.deactivate()}delete this.activeItem}},tryActivate:function(f,e){var b=this.items;for(var c=f,a=b.length;c>=0&&c<a;c+=e){var d=b.get(c);if(d.isVisible()&&!d.disabled&&(d.canActivate||d.isFormField)){this.setActiveItem(d,false);return d}}return false},onMouseOver:function(b){var a=this.findTargetItem(b);if(a){if(a.canActivate&&!a.disabled){this.setActiveItem(a,true)}}this.over=true;this.fireEvent("mouseover",this,b,a)},onMouseOut:function(b){var a=this.findTargetItem(b);if(a){if(a==this.activeItem&&a.shouldDeactivate&&a.shouldDeactivate(b)){this.activeItem.deactivate();delete this.activeItem}}this.over=false;this.fireEvent("mouseout",this,b,a)},onScroll:function(d,b){if(d){d.stopEvent()}var a=this.ul.dom,c=Ext.fly(b).is(".x-menu-scroller-top");a.scrollTop+=this.scrollIncrement*(c?-1:1);if(c?a.scrollTop<=0:a.scrollTop+this.activeMax>=a.scrollHeight){this.onScrollerOut(null,b)}},onScrollerIn:function(d,b){var a=this.ul.dom,c=Ext.fly(b).is(".x-menu-scroller-top");if(c?a.scrollTop>0:a.scrollTop+this.activeMax<a.scrollHeight){Ext.fly(b).addClass(["x-menu-item-active","x-menu-scroller-active"])}},onScrollerOut:function(b,a){Ext.fly(a).removeClass(["x-menu-item-active","x-menu-scroller-active"])},show:function(b,c,a){if(this.floating){this.parentMenu=a;if(!this.el){this.render();this.doLayout(false,true)}this.showAt(this.el.getAlignToXY(b,c||this.defaultAlign,this.defaultOffsets),a)}else{Ext.menu.Menu.superclass.show.call(this)}},showAt:function(b,a){if(this.fireEvent("beforeshow",this)!==false){this.parentMenu=a;if(!this.el){this.render()}if(this.enableScrolling){this.el.setXY(b);b[1]=this.constrainScroll(b[1]);b=[this.el.adjustForConstraints(b)[0],b[1]]}else{b=this.el.adjustForConstraints(b)}this.el.setXY(b);this.el.show();Ext.menu.Menu.superclass.onShow.call(this);if(Ext.isIE){this.fireEvent("autosize",this);if(!Ext.isIE8){this.el.repaint()}}this.hidden=false;this.focus();this.fireEvent("show",this)}},constrainScroll:function(h){var b,d=this.ul.setHeight("auto").getHeight(),a=h,g,e,f,c;if(this.floating){e=Ext.fly(this.el.dom.parentNode);f=e.getScroll().top;c=e.getViewSize().height;g=h-f;b=this.maxHeight?this.maxHeight:c-g;if(d>c){b=c;a=h-g}else{if(b<d){a=h-(d-b);b=d}}}else{b=this.getHeight()}if(this.maxHeight){b=Math.min(this.maxHeight,b)}if(d>b&&b>0){this.activeMax=b-this.scrollerHeight*2-this.el.getFrameWidth("tb")-Ext.num(this.el.shadowOffset,0);this.ul.setHeight(this.activeMax);this.createScrollers();this.el.select(".x-menu-scroller").setDisplayed("")}else{this.ul.setHeight(d);this.el.select(".x-menu-scroller").setDisplayed("none")}this.ul.dom.scrollTop=0;return a},createScrollers:function(){if(!this.scroller){this.scroller={pos:0,top:this.el.insertFirst({tag:"div",cls:"x-menu-scroller x-menu-scroller-top",html:"&#160;"}),bottom:this.el.createChild({tag:"div",cls:"x-menu-scroller x-menu-scroller-bottom",html:"&#160;"})};this.scroller.top.hover(this.onScrollerIn,this.onScrollerOut,this);this.scroller.topRepeater=new Ext.util.ClickRepeater(this.scroller.top,{listeners:{click:this.onScroll.createDelegate(this,[null,this.scroller.top],false)}});this.scroller.bottom.hover(this.onScrollerIn,this.onScrollerOut,this);this.scroller.bottomRepeater=new Ext.util.ClickRepeater(this.scroller.bottom,{listeners:{click:this.onScroll.createDelegate(this,[null,this.scroller.bottom],false)}})}},onLayout:function(){if(this.isVisible()){if(this.enableScrolling){this.constrainScroll(this.el.getTop())}if(this.floating){this.el.sync()}}},focus:function(){if(!this.hidden){this.doFocus.defer(50,this)}},doFocus:function(){if(!this.hidden){this.focusEl.focus()}},hide:function(a){if(!this.isDestroyed){this.deepHide=a;Ext.menu.Menu.superclass.hide.call(this);delete this.deepHide}},onHide:function(){Ext.menu.Menu.superclass.onHide.call(this);this.deactivateActive();if(this.el&&this.floating){this.el.hide()}var a=this.parentMenu;if(this.deepHide===true&&a){if(a.floating){a.hide(true)}else{a.deactivateActive()}}},lookupComponent:function(a){if(Ext.isString(a)){a=(a=="separator"||a=="-")?new Ext.menu.Separator():new Ext.menu.TextItem(a);this.applyDefaults(a)}else{if(Ext.isObject(a)){a=this.getMenuItem(a)}else{if(a.tagName||a.el){a=new Ext.BoxComponent({el:a})}}}return a},applyDefaults:function(b){if(!Ext.isString(b)){b=Ext.menu.Menu.superclass.applyDefaults.call(this,b);var a=this.internalDefaults;if(a){if(b.events){Ext.applyIf(b.initialConfig,a);Ext.apply(b,a)}else{Ext.applyIf(b,a)}}}return b},getMenuItem:function(a){a.ownerCt=this;if(!a.isXType){if(!a.xtype&&Ext.isBoolean(a.checked)){return new Ext.menu.CheckItem(a)}return Ext.create(a,this.defaultType)}return a},addSeparator:function(){return this.add(new Ext.menu.Separator())},addElement:function(a){return this.add(new Ext.menu.BaseItem({el:a}))},addItem:function(a){return this.add(a)},addMenuItem:function(a){return this.add(this.getMenuItem(a))},addText:function(a){return this.add(new Ext.menu.TextItem(a))},onDestroy:function(){Ext.EventManager.removeResizeListener(this.hide,this);var a=this.parentMenu;if(a&&a.activeChild==this){delete a.activeChild}delete this.parentMenu;Ext.menu.Menu.superclass.onDestroy.call(this);Ext.menu.MenuMgr.unregister(this);if(this.keyNav){this.keyNav.disable()}var b=this.scroller;if(b){Ext.destroy(b.topRepeater,b.bottomRepeater,b.top,b.bottom)}Ext.destroy(this.el,this.focusEl,this.ul)}});Ext.reg("menu",Ext.menu.Menu);Ext.menu.MenuNav=Ext.extend(Ext.KeyNav,function(){function a(d,c){if(!c.tryActivate(c.items.indexOf(c.activeItem)-1,-1)){c.tryActivate(c.items.length-1,-1)}}function b(d,c){if(!c.tryActivate(c.items.indexOf(c.activeItem)+1,1)){c.tryActivate(0,1)}}return{constructor:function(c){Ext.menu.MenuNav.superclass.constructor.call(this,c.el);this.scope=this.menu=c},doRelay:function(f,d){var c=f.getKey();if(this.menu.activeItem&&this.menu.activeItem.isFormField&&c!=f.TAB){return false}if(!this.menu.activeItem&&f.isNavKeyPress()&&c!=f.SPACE&&c!=f.RETURN){this.menu.tryActivate(0,1);return false}return d.call(this.scope||this,f,this.menu)},tab:function(d,c){d.stopEvent();if(d.shiftKey){a(d,c)}else{b(d,c)}},up:a,down:b,right:function(d,c){if(c.activeItem){c.activeItem.expandMenu(true)}},left:function(d,c){c.hide();if(c.parentMenu&&c.parentMenu.activeItem){c.parentMenu.activeItem.activate()}},enter:function(d,c){if(c.activeItem){d.stopPropagation();c.activeItem.onClick(d);c.fireEvent("click",this,c.activeItem);return true}}}}());Ext.menu.MenuMgr=function(){var g,e,b,d={},a=false,k=new Date();function m(){g={};e=new Ext.util.MixedCollection();b=Ext.getDoc().addKeyListener(27,i);b.disable()}function i(){if(e&&e.length>0){var n=e.clone();n.each(function(o){o.hide()});return true}return false}function f(n){e.remove(n);if(e.length<1){b.disable();Ext.getDoc().un("mousedown",l);a=false}}function j(n){var o=e.last();k=new Date();e.add(n);if(!a){b.enable();Ext.getDoc().on("mousedown",l);a=true}if(n.parentMenu){n.getEl().setZIndex(parseInt(n.parentMenu.getEl().getStyle("z-index"),10)+3);n.parentMenu.activeChild=n}else{if(o&&!o.isDestroyed&&o.isVisible()){n.getEl().setZIndex(parseInt(o.getEl().getStyle("z-index"),10)+3)}}}function c(n){if(n.activeChild){n.activeChild.hide()}if(n.autoHideTimer){clearTimeout(n.autoHideTimer);delete n.autoHideTimer}}function h(n){var o=n.parentMenu;if(!o&&!n.allowOtherMenus){i()}else{if(o&&o.activeChild){o.activeChild.hide()}}}function l(n){if(k.getElapsed()>50&&e.length>0&&!n.getTarget(".x-menu")){i()}}return{hideAll:function(){return i()},register:function(n){if(!g){m()}g[n.id]=n;n.on({beforehide:c,hide:f,beforeshow:h,show:j})},get:function(n){if(typeof n=="string"){if(!g){return null}return g[n]}else{if(n.events){return n}else{if(typeof n.length=="number"){return new Ext.menu.Menu({items:n})}else{return Ext.create(n,"menu")}}}},unregister:function(n){delete g[n.id];n.un("beforehide",c);n.un("hide",f);n.un("beforeshow",h);n.un("show",j)},registerCheckable:function(n){var o=n.group;if(o){if(!d[o]){d[o]=[]}d[o].push(n)}},unregisterCheckable:function(n){var o=n.group;if(o){d[o].remove(n)}},onCheckChange:function(p,q){if(p.group&&q){var s=d[p.group],o=0,n=s.length,r;for(;o<n;o++){r=s[o];if(r!=p){r.setChecked(false)}}}},getCheckedItem:function(p){var q=d[p];if(q){for(var o=0,n=q.length;o<n;o++){if(q[o].checked){return q[o]}}}return null},setCheckedItem:function(p,r){var q=d[p];if(q){for(var o=0,n=q.length;o<n;o++){if(q[o].id==r){q[o].setChecked(true)}}}return null}}}();Ext.menu.BaseItem=Ext.extend(Ext.Component,{canActivate:false,activeClass:"x-menu-item-active",hideOnClick:true,clickHideDelay:1,ctype:"Ext.menu.BaseItem",actionMode:"container",initComponent:function(){Ext.menu.BaseItem.superclass.initComponent.call(this);this.addEvents("click","activate","deactivate");if(this.handler){this.on("click",this.handler,this.scope)}},onRender:function(b,a){Ext.menu.BaseItem.superclass.onRender.apply(this,arguments);if(this.ownerCt&&this.ownerCt instanceof Ext.menu.Menu){this.parentMenu=this.ownerCt}else{this.container.addClass("x-menu-list-item");this.mon(this.el,{scope:this,click:this.onClick,mouseenter:this.activate,mouseleave:this.deactivate})}},setHandler:function(b,a){if(this.handler){this.un("click",this.handler,this.scope)}this.on("click",this.handler=b,this.scope=a)},onClick:function(a){if(!this.disabled&&this.fireEvent("click",this,a)!==false&&(this.parentMenu&&this.parentMenu.fireEvent("itemclick",this,a)!==false)){this.handleClick(a)}else{a.stopEvent()}},activate:function(){if(this.disabled){return false}var a=this.container;a.addClass(this.activeClass);this.region=a.getRegion().adjust(2,2,-2,-2);this.fireEvent("activate",this);return true},deactivate:function(){this.container.removeClass(this.activeClass);this.fireEvent("deactivate",this)},shouldDeactivate:function(a){return !this.region||!this.region.contains(a.getPoint())},handleClick:function(b){var a=this.parentMenu;if(this.hideOnClick){if(a.floating){this.clickHideDelayTimer=a.hide.defer(this.clickHideDelay,a,[true])}else{a.deactivateActive()}}},beforeDestroy:function(){clearTimeout(this.clickHideDelayTimer);Ext.menu.BaseItem.superclass.beforeDestroy.call(this)},expandMenu:Ext.emptyFn,hideMenu:Ext.emptyFn});Ext.reg("menubaseitem",Ext.menu.BaseItem);Ext.menu.TextItem=Ext.extend(Ext.menu.BaseItem,{hideOnClick:false,itemCls:"x-menu-text",constructor:function(a){if(typeof a=="string"){a={text:a}}Ext.menu.TextItem.superclass.constructor.call(this,a)},onRender:function(){var a=document.createElement("span");a.className=this.itemCls;a.innerHTML=this.text;this.el=a;Ext.menu.TextItem.superclass.onRender.apply(this,arguments)}});Ext.reg("menutextitem",Ext.menu.TextItem);Ext.menu.Separator=Ext.extend(Ext.menu.BaseItem,{itemCls:"x-menu-sep",hideOnClick:false,activeClass:"",onRender:function(a){var b=document.createElement("span");b.className=this.itemCls;b.innerHTML="&#160;";this.el=b;a.addClass("x-menu-sep-li");Ext.menu.Separator.superclass.onRender.apply(this,arguments)}});Ext.reg("menuseparator",Ext.menu.Separator);Ext.menu.Item=Ext.extend(Ext.menu.BaseItem,{itemCls:"x-menu-item",canActivate:true,showDelay:200,altText:"",hideDelay:200,ctype:"Ext.menu.Item",initComponent:function(){Ext.menu.Item.superclass.initComponent.call(this);if(this.menu){if(Ext.isArray(this.menu)){this.menu={items:this.menu}}if(Ext.isObject(this.menu)){this.menu.ownerCt=this}this.menu=Ext.menu.MenuMgr.get(this.menu);this.menu.ownerCt=undefined}},onRender:function(d,b){if(!this.itemTpl){this.itemTpl=Ext.menu.Item.prototype.itemTpl=new Ext.XTemplate('<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"','<tpl if="hrefTarget">',' target="{hrefTarget}"',"</tpl>",">",'<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>','<span class="x-menu-item-text">{text}</span>',"</a>")}var c=this.getTemplateArgs();this.el=b?this.itemTpl.insertBefore(b,c,true):this.itemTpl.append(d,c,true);this.iconEl=this.el.child("img.x-menu-item-icon");this.textEl=this.el.child(".x-menu-item-text");if(!this.href){this.mon(this.el,"click",Ext.emptyFn,null,{preventDefault:true})}Ext.menu.Item.superclass.onRender.call(this,d,b)},getTemplateArgs:function(){return{id:this.id,cls:this.itemCls+(this.menu?" x-menu-item-arrow":"")+(this.cls?" "+this.cls:""),href:this.href||"#",hrefTarget:this.hrefTarget,icon:this.icon||Ext.BLANK_IMAGE_URL,iconCls:this.iconCls||"",text:this.itemText||this.text||"&#160;",altText:this.altText||""}},setText:function(a){this.text=a||"&#160;";if(this.rendered){this.textEl.update(this.text);this.parentMenu.layout.doAutoSize()}},setIconClass:function(a){var b=this.iconCls;this.iconCls=a;if(this.rendered){this.iconEl.replaceClass(b,this.iconCls)}},beforeDestroy:function(){clearTimeout(this.showTimer);clearTimeout(this.hideTimer);if(this.menu){delete this.menu.ownerCt;this.menu.destroy()}Ext.menu.Item.superclass.beforeDestroy.call(this)},handleClick:function(a){if(!this.href){a.stopEvent()}Ext.menu.Item.superclass.handleClick.apply(this,arguments)},activate:function(a){if(Ext.menu.Item.superclass.activate.apply(this,arguments)){this.focus();if(a){this.expandMenu()}}return true},shouldDeactivate:function(a){if(Ext.menu.Item.superclass.shouldDeactivate.call(this,a)){if(this.menu&&this.menu.isVisible()){return !this.menu.getEl().getRegion().contains(a.getPoint())}return true}return false},deactivate:function(){Ext.menu.Item.superclass.deactivate.apply(this,arguments);this.hideMenu()},expandMenu:function(a){if(!this.disabled&&this.menu){clearTimeout(this.hideTimer);delete this.hideTimer;if(!this.menu.isVisible()&&!this.showTimer){this.showTimer=this.deferExpand.defer(this.showDelay,this,[a])}else{if(this.menu.isVisible()&&a){this.menu.tryActivate(0,1)}}}},deferExpand:function(a){delete this.showTimer;this.menu.show(this.container,this.parentMenu.subMenuAlign||"tl-tr?",this.parentMenu);if(a){this.menu.tryActivate(0,1)}},hideMenu:function(){clearTimeout(this.showTimer);delete this.showTimer;if(!this.hideTimer&&this.menu&&this.menu.isVisible()){this.hideTimer=this.deferHide.defer(this.hideDelay,this)}},deferHide:function(){delete this.hideTimer;if(this.menu.over){this.parentMenu.setActiveItem(this,false)}else{this.menu.hide()}}});Ext.reg("menuitem",Ext.menu.Item);Ext.menu.CheckItem=Ext.extend(Ext.menu.Item,{itemCls:"x-menu-item x-menu-check-item",groupClass:"x-menu-group-item",checked:false,ctype:"Ext.menu.CheckItem",initComponent:function(){Ext.menu.CheckItem.superclass.initComponent.call(this);this.addEvents("beforecheckchange","checkchange");if(this.checkHandler){this.on("checkchange",this.checkHandler,this.scope)}Ext.menu.MenuMgr.registerCheckable(this)},onRender:function(a){Ext.menu.CheckItem.superclass.onRender.apply(this,arguments);if(this.group){this.el.addClass(this.groupClass)}if(this.checked){this.checked=false;this.setChecked(true,true)}},destroy:function(){Ext.menu.MenuMgr.unregisterCheckable(this);Ext.menu.CheckItem.superclass.destroy.apply(this,arguments)},setChecked:function(b,a){var c=a===true;if(this.checked!=b&&(c||this.fireEvent("beforecheckchange",this,b)!==false)){Ext.menu.MenuMgr.onCheckChange(this,b);if(this.container){this.container[b?"addClass":"removeClass"]("x-menu-item-checked")}this.checked=b;if(!c){this.fireEvent("checkchange",this,b)}}},handleClick:function(a){if(!this.disabled&&!(this.checked&&this.group)){this.setChecked(!this.checked)}Ext.menu.CheckItem.superclass.handleClick.apply(this,arguments)}});Ext.reg("menucheckitem",Ext.menu.CheckItem);Ext.menu.DateMenu=Ext.extend(Ext.menu.Menu,{enableScrolling:false,hideOnClick:true,pickerId:null,cls:"x-date-menu",initComponent:function(){this.on("beforeshow",this.onBeforeShow,this);if(this.strict=(Ext.isIE7&&Ext.isStrict)){this.on("show",this.onShow,this,{single:true,delay:20})}Ext.apply(this,{plain:true,showSeparator:false,items:this.picker=new Ext.DatePicker(Ext.applyIf({internalRender:this.strict||!Ext.isIE,ctCls:"x-menu-date-item",id:this.pickerId},this.initialConfig))});this.picker.purgeListeners();Ext.menu.DateMenu.superclass.initComponent.call(this);this.relayEvents(this.picker,["select"]);this.on("show",this.picker.focus,this.picker);this.on("select",this.menuHide,this);if(this.handler){this.on("select",this.handler,this.scope||this)}},menuHide:function(){if(this.hideOnClick){this.hide(true)}},onBeforeShow:function(){if(this.picker){this.picker.hideMonthPicker(true)}},onShow:function(){var a=this.picker.getEl();a.setWidth(a.getWidth())}});Ext.reg("datemenu",Ext.menu.DateMenu);Ext.menu.ColorMenu=Ext.extend(Ext.menu.Menu,{enableScrolling:false,hideOnClick:true,cls:"x-color-menu",paletteId:null,initComponent:function(){Ext.apply(this,{plain:true,showSeparator:false,items:this.palette=new Ext.ColorPalette(Ext.applyIf({id:this.paletteId},this.initialConfig))});this.palette.purgeListeners();Ext.menu.ColorMenu.superclass.initComponent.call(this);this.relayEvents(this.palette,["select"]);this.on("select",this.menuHide,this);if(this.handler){this.on("select",this.handler,this.scope||this)}},menuHide:function(){if(this.hideOnClick){this.hide(true)}}});Ext.reg("colormenu",Ext.menu.ColorMenu);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/ext-dd.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){var a=Ext.EventManager;var b=Ext.lib.Dom;Ext.dd.DragDrop=function(e,c,d){if(e){this.init(e,c,d)}};Ext.dd.DragDrop.prototype={id:null,config:null,dragElId:null,handleElId:null,invalidHandleTypes:null,invalidHandleIds:null,invalidHandleClasses:null,startPageX:0,startPageY:0,groups:null,locked:false,lock:function(){this.locked=true},moveOnly:false,unlock:function(){this.locked=false},isTarget:true,padding:null,_domRef:null,__ygDragDrop:true,constrainX:false,constrainY:false,minX:0,maxX:0,minY:0,maxY:0,maintainOffset:false,xTicks:null,yTicks:null,primaryButtonOnly:true,available:false,hasOuterHandles:false,b4StartDrag:function(c,d){},startDrag:function(c,d){},b4Drag:function(c){},onDrag:function(c){},onDragEnter:function(c,d){},b4DragOver:function(c){},onDragOver:function(c,d){},b4DragOut:function(c){},onDragOut:function(c,d){},b4DragDrop:function(c){},onDragDrop:function(c,d){},onInvalidDrop:function(c){},b4EndDrag:function(c){},endDrag:function(c){},b4MouseDown:function(c){},onMouseDown:function(c){},onMouseUp:function(c){},onAvailable:function(){},defaultPadding:{left:0,right:0,top:0,bottom:0},constrainTo:function(i,g,n){if(Ext.isNumber(g)){g={left:g,right:g,top:g,bottom:g}}g=g||this.defaultPadding;var k=Ext.get(this.getEl()).getBox(),d=Ext.get(i),m=d.getScroll(),j,e=d.dom;if(e==document.body){j={x:m.left,y:m.top,width:Ext.lib.Dom.getViewWidth(),height:Ext.lib.Dom.getViewHeight()}}else{var l=d.getXY();j={x:l[0],y:l[1],width:e.clientWidth,height:e.clientHeight}}var h=k.y-j.y,f=k.x-j.x;this.resetConstraints();this.setXConstraint(f-(g.left||0),j.width-f-k.width-(g.right||0),this.xTickSize);this.setYConstraint(h-(g.top||0),j.height-h-k.height-(g.bottom||0),this.yTickSize)},getEl:function(){if(!this._domRef){this._domRef=Ext.getDom(this.id)}return this._domRef},getDragEl:function(){return Ext.getDom(this.dragElId)},init:function(e,c,d){this.initTarget(e,c,d);a.on(this.id,"mousedown",this.handleMouseDown,this)},initTarget:function(e,c,d){this.config=d||{};this.DDM=Ext.dd.DDM;this.groups={};if(typeof e!=="string"){e=Ext.id(e)}this.id=e;this.addToGroup((c)?c:"default");this.handleElId=e;this.setDragElId(e);this.invalidHandleTypes={A:"A"};this.invalidHandleIds={};this.invalidHandleClasses=[];this.applyConfig();this.handleOnAvailable()},applyConfig:function(){this.padding=this.config.padding||[0,0,0,0];this.isTarget=(this.config.isTarget!==false);this.maintainOffset=(this.config.maintainOffset);this.primaryButtonOnly=(this.config.primaryButtonOnly!==false)},handleOnAvailable:function(){this.available=true;this.resetConstraints();this.onAvailable()},setPadding:function(e,c,f,d){if(!c&&0!==c){this.padding=[e,e,e,e]}else{if(!f&&0!==f){this.padding=[e,c,e,c]}else{this.padding=[e,c,f,d]}}},setInitPosition:function(f,e){var g=this.getEl();if(!this.DDM.verifyEl(g)){return}var d=f||0;var c=e||0;var h=b.getXY(g);this.initPageX=h[0]-d;this.initPageY=h[1]-c;this.lastPageX=h[0];this.lastPageY=h[1];this.setStartPosition(h)},setStartPosition:function(d){var c=d||b.getXY(this.getEl());this.deltaSetXY=null;this.startPageX=c[0];this.startPageY=c[1]},addToGroup:function(c){this.groups[c]=true;this.DDM.regDragDrop(this,c)},removeFromGroup:function(c){if(this.groups[c]){delete this.groups[c]}this.DDM.removeDDFromGroup(this,c)},setDragElId:function(c){this.dragElId=c},setHandleElId:function(c){if(typeof c!=="string"){c=Ext.id(c)}this.handleElId=c;this.DDM.regHandle(this.id,c)},setOuterHandleElId:function(c){if(typeof c!=="string"){c=Ext.id(c)}a.on(c,"mousedown",this.handleMouseDown,this);this.setHandleElId(c);this.hasOuterHandles=true},unreg:function(){a.un(this.id,"mousedown",this.handleMouseDown);this._domRef=null;this.DDM._remove(this)},destroy:function(){this.unreg()},isLocked:function(){return(this.DDM.isLocked()||this.locked)},handleMouseDown:function(f,d){if(this.primaryButtonOnly&&f.button!=0){return}if(this.isLocked()){return}this.DDM.refreshCache(this.groups);var c=new Ext.lib.Point(Ext.lib.Event.getPageX(f),Ext.lib.Event.getPageY(f));if(!this.hasOuterHandles&&!this.DDM.isOverTarget(c,this)){}else{if(this.clickValidator(f)){this.setStartPosition();this.b4MouseDown(f);this.onMouseDown(f);this.DDM.handleMouseDown(f,this);this.DDM.stopEvent(f)}else{}}},clickValidator:function(d){var c=d.getTarget();return(this.isValidHandleChild(c)&&(this.id==this.handleElId||this.DDM.handleWasClicked(c,this.id)))},addInvalidHandleType:function(c){var d=c.toUpperCase();this.invalidHandleTypes[d]=d},addInvalidHandleId:function(c){if(typeof c!=="string"){c=Ext.id(c)}this.invalidHandleIds[c]=c},addInvalidHandleClass:function(c){this.invalidHandleClasses.push(c)},removeInvalidHandleType:function(c){var d=c.toUpperCase();delete this.invalidHandleTypes[d]},removeInvalidHandleId:function(c){if(typeof c!=="string"){c=Ext.id(c)}delete this.invalidHandleIds[c]},removeInvalidHandleClass:function(d){for(var e=0,c=this.invalidHandleClasses.length;e<c;++e){if(this.invalidHandleClasses[e]==d){delete this.invalidHandleClasses[e]}}},isValidHandleChild:function(g){var f=true;var j;try{j=g.nodeName.toUpperCase()}catch(h){j=g.nodeName}f=f&&!this.invalidHandleTypes[j];f=f&&!this.invalidHandleIds[g.id];for(var d=0,c=this.invalidHandleClasses.length;f&&d<c;++d){f=!Ext.fly(g).hasClass(this.invalidHandleClasses[d])}return f},setXTicks:function(f,c){this.xTicks=[];this.xTickSize=c;var e={};for(var d=this.initPageX;d>=this.minX;d=d-c){if(!e[d]){this.xTicks[this.xTicks.length]=d;e[d]=true}}for(d=this.initPageX;d<=this.maxX;d=d+c){if(!e[d]){this.xTicks[this.xTicks.length]=d;e[d]=true}}this.xTicks.sort(this.DDM.numericSort)},setYTicks:function(f,c){this.yTicks=[];this.yTickSize=c;var e={};for(var d=this.initPageY;d>=this.minY;d=d-c){if(!e[d]){this.yTicks[this.yTicks.length]=d;e[d]=true}}for(d=this.initPageY;d<=this.maxY;d=d+c){if(!e[d]){this.yTicks[this.yTicks.length]=d;e[d]=true}}this.yTicks.sort(this.DDM.numericSort)},setXConstraint:function(e,d,c){this.leftConstraint=e;this.rightConstraint=d;this.minX=this.initPageX-e;this.maxX=this.initPageX+d;if(c){this.setXTicks(this.initPageX,c)}this.constrainX=true},clearConstraints:function(){this.constrainX=false;this.constrainY=false;this.clearTicks()},clearTicks:function(){this.xTicks=null;this.yTicks=null;this.xTickSize=0;this.yTickSize=0},setYConstraint:function(c,e,d){this.topConstraint=c;this.bottomConstraint=e;this.minY=this.initPageY-c;this.maxY=this.initPageY+e;if(d){this.setYTicks(this.initPageY,d)}this.constrainY=true},resetConstraints:function(){if(this.initPageX||this.initPageX===0){var d=(this.maintainOffset)?this.lastPageX-this.initPageX:0;var c=(this.maintainOffset)?this.lastPageY-this.initPageY:0;this.setInitPosition(d,c)}else{this.setInitPosition()}if(this.constrainX){this.setXConstraint(this.leftConstraint,this.rightConstraint,this.xTickSize)}if(this.constrainY){this.setYConstraint(this.topConstraint,this.bottomConstraint,this.yTickSize)}},getTick:function(j,f){if(!f){return j}else{if(f[0]>=j){return f[0]}else{for(var d=0,c=f.length;d<c;++d){var e=d+1;if(f[e]&&f[e]>=j){var h=j-f[d];var g=f[e]-j;return(g>h)?f[d]:f[e]}}return f[f.length-1]}}},toString:function(){return("DragDrop "+this.id)}}})();if(!Ext.dd.DragDropMgr){Ext.dd.DragDropMgr=function(){var a=Ext.EventManager;return{ids:{},handleIds:{},dragCurrent:null,dragOvers:{},deltaX:0,deltaY:0,preventDefault:true,stopPropagation:true,initialized:false,locked:false,init:function(){this.initialized=true},POINT:0,INTERSECT:1,mode:0,_execOnAll:function(d,c){for(var e in this.ids){for(var b in this.ids[e]){var f=this.ids[e][b];if(!this.isTypeOfDD(f)){continue}f[d].apply(f,c)}}},_onLoad:function(){this.init();a.on(document,"mouseup",this.handleMouseUp,this,true);a.on(document,"mousemove",this.handleMouseMove,this,true);a.on(window,"unload",this._onUnload,this,true);a.on(window,"resize",this._onResize,this,true)},_onResize:function(b){this._execOnAll("resetConstraints",[])},lock:function(){this.locked=true},unlock:function(){this.locked=false},isLocked:function(){return this.locked},locationCache:{},useCache:true,clickPixelThresh:3,clickTimeThresh:350,dragThreshMet:false,clickTimeout:null,startX:0,startY:0,regDragDrop:function(c,b){if(!this.initialized){this.init()}if(!this.ids[b]){this.ids[b]={}}this.ids[b][c.id]=c},removeDDFromGroup:function(d,b){if(!this.ids[b]){this.ids[b]={}}var c=this.ids[b];if(c&&c[d.id]){delete c[d.id]}},_remove:function(c){for(var b in c.groups){if(b&&this.ids[b]&&this.ids[b][c.id]){delete this.ids[b][c.id]}}delete this.handleIds[c.id]},regHandle:function(c,b){if(!this.handleIds[c]){this.handleIds[c]={}}this.handleIds[c][b]=b},isDragDrop:function(b){return(this.getDDById(b))?true:false},getRelated:function(g,c){var f=[];for(var e in g.groups){for(var d in this.ids[e]){var b=this.ids[e][d];if(!this.isTypeOfDD(b)){continue}if(!c||b.isTarget){f[f.length]=b}}}return f},isLegalTarget:function(f,e){var c=this.getRelated(f,true);for(var d=0,b=c.length;d<b;++d){if(c[d].id==e.id){return true}}return false},isTypeOfDD:function(b){return(b&&b.__ygDragDrop)},isHandle:function(c,b){return(this.handleIds[c]&&this.handleIds[c][b])},getDDById:function(c){for(var b in this.ids){if(this.ids[b][c]){return this.ids[b][c]}}return null},handleMouseDown:function(d,c){if(Ext.QuickTips){Ext.QuickTips.ddDisable()}if(this.dragCurrent){this.handleMouseUp(d)}this.currentTarget=d.getTarget();this.dragCurrent=c;var b=c.getEl();this.startX=d.getPageX();this.startY=d.getPageY();this.deltaX=this.startX-b.offsetLeft;this.deltaY=this.startY-b.offsetTop;this.dragThreshMet=false;this.clickTimeout=setTimeout(function(){var e=Ext.dd.DDM;e.startDrag(e.startX,e.startY)},this.clickTimeThresh)},startDrag:function(b,c){clearTimeout(this.clickTimeout);if(this.dragCurrent){this.dragCurrent.b4StartDrag(b,c);this.dragCurrent.startDrag(b,c)}this.dragThreshMet=true},handleMouseUp:function(b){if(Ext.QuickTips){Ext.QuickTips.ddEnable()}if(!this.dragCurrent){return}clearTimeout(this.clickTimeout);if(this.dragThreshMet){this.fireEvents(b,true)}else{}this.stopDrag(b);this.stopEvent(b)},stopEvent:function(b){if(this.stopPropagation){b.stopPropagation()}if(this.preventDefault){b.preventDefault()}},stopDrag:function(b){if(this.dragCurrent){if(this.dragThreshMet){this.dragCurrent.b4EndDrag(b);this.dragCurrent.endDrag(b)}this.dragCurrent.onMouseUp(b)}this.dragCurrent=null;this.dragOvers={}},handleMouseMove:function(d){if(!this.dragCurrent){return true}if(Ext.isIE&&(d.button!==0&&d.button!==1&&d.button!==2)){this.stopEvent(d);return this.handleMouseUp(d)}if(!this.dragThreshMet){var c=Math.abs(this.startX-d.getPageX());var b=Math.abs(this.startY-d.getPageY());if(c>this.clickPixelThresh||b>this.clickPixelThresh){this.startDrag(this.startX,this.startY)}}if(this.dragThreshMet){this.dragCurrent.b4Drag(d);this.dragCurrent.onDrag(d);if(!this.dragCurrent.moveOnly){this.fireEvents(d,false)}}this.stopEvent(d);return true},fireEvents:function(m,n){var p=this.dragCurrent;if(!p||p.isLocked()){return}var q=m.getPoint();var b=[];var f=[];var k=[];var h=[];var d=[];for(var g in this.dragOvers){var c=this.dragOvers[g];if(!this.isTypeOfDD(c)){continue}if(!this.isOverTarget(q,c,this.mode)){f.push(c)}b[g]=true;delete this.dragOvers[g]}for(var o in p.groups){if("string"!=typeof o){continue}for(g in this.ids[o]){var j=this.ids[o][g];if(!this.isTypeOfDD(j)){continue}if(j.isTarget&&!j.isLocked()&&((j!=p)||(p.ignoreSelf===false))){if(this.isOverTarget(q,j,this.mode)){if(n){h.push(j)}else{if(!b[j.id]){d.push(j)}else{k.push(j)}this.dragOvers[j.id]=j}}}}}if(this.mode){if(f.length){p.b4DragOut(m,f);p.onDragOut(m,f)}if(d.length){p.onDragEnter(m,d)}if(k.length){p.b4DragOver(m,k);p.onDragOver(m,k)}if(h.length){p.b4DragDrop(m,h);p.onDragDrop(m,h)}}else{var l=0;for(g=0,l=f.length;g<l;++g){p.b4DragOut(m,f[g].id);p.onDragOut(m,f[g].id)}for(g=0,l=d.length;g<l;++g){p.onDragEnter(m,d[g].id)}for(g=0,l=k.length;g<l;++g){p.b4DragOver(m,k[g].id);p.onDragOver(m,k[g].id)}for(g=0,l=h.length;g<l;++g){p.b4DragDrop(m,h[g].id);p.onDragDrop(m,h[g].id)}}if(n&&!h.length){p.onInvalidDrop(m)}},getBestMatch:function(d){var f=null;var c=d.length;if(c==1){f=d[0]}else{for(var e=0;e<c;++e){var b=d[e];if(b.cursorIsOver){f=b;break}else{if(!f||f.overlap.getArea()<b.overlap.getArea()){f=b}}}}return f},refreshCache:function(c){for(var b in c){if("string"!=typeof b){continue}for(var d in this.ids[b]){var e=this.ids[b][d];if(this.isTypeOfDD(e)){var f=this.getLocation(e);if(f){this.locationCache[e.id]=f}else{delete this.locationCache[e.id]}}}}},verifyEl:function(c){if(c){var b;if(Ext.isIE){try{b=c.offsetParent}catch(d){}}else{b=c.offsetParent}if(b){return true}}return false},getLocation:function(i){if(!this.isTypeOfDD(i)){return null}var g=i.getEl(),n,f,d,p,o,q,c,m,h,k;try{n=Ext.lib.Dom.getXY(g)}catch(j){}if(!n){return null}f=n[0];d=f+g.offsetWidth;p=n[1];o=p+g.offsetHeight;q=p-i.padding[0];c=d+i.padding[1];m=o+i.padding[2];h=f-i.padding[3];k=new Ext.lib.Region(q,c,m,h);g=Ext.get(g.parentNode);while(g&&k){if(g.isScrollable()){k=k.intersect(g.getRegion())}g=g.parent()}return k},isOverTarget:function(j,b,d){var f=this.locationCache[b.id];if(!f||!this.useCache){f=this.getLocation(b);this.locationCache[b.id]=f}if(!f){return false}b.cursorIsOver=f.contains(j);var i=this.dragCurrent;if(!i||!i.getTargetCoord||(!d&&!i.constrainX&&!i.constrainY)){return b.cursorIsOver}b.overlap=null;var g=i.getTargetCoord(j.x,j.y);var c=i.getDragEl();var e=new Ext.lib.Region(g.y,g.x+c.offsetWidth,g.y+c.offsetHeight,g.x);var h=e.intersect(f);if(h){b.overlap=h;return(d)?true:b.cursorIsOver}else{return false}},_onUnload:function(c,b){a.removeListener(document,"mouseup",this.handleMouseUp,this);a.removeListener(document,"mousemove",this.handleMouseMove,this);a.removeListener(window,"resize",this._onResize,this);Ext.dd.DragDropMgr.unregAll()},unregAll:function(){if(this.dragCurrent){this.stopDrag();this.dragCurrent=null}this._execOnAll("unreg",[]);for(var b in this.elementCache){delete this.elementCache[b]}this.elementCache={};this.ids={}},elementCache:{},getElWrapper:function(c){var b=this.elementCache[c];if(!b||!b.el){b=this.elementCache[c]=new this.ElementWrapper(Ext.getDom(c))}return b},getElement:function(b){return Ext.getDom(b)},getCss:function(c){var b=Ext.getDom(c);return(b)?b.style:null},ElementWrapper:function(b){this.el=b||null;this.id=this.el&&b.id;this.css=this.el&&b.style},getPosX:function(b){return Ext.lib.Dom.getX(b)},getPosY:function(b){return Ext.lib.Dom.getY(b)},swapNode:function(d,b){if(d.swapNode){d.swapNode(b)}else{var e=b.parentNode;var c=b.nextSibling;if(c==d){e.insertBefore(d,b)}else{if(b==d.nextSibling){e.insertBefore(b,d)}else{d.parentNode.replaceChild(b,d);e.insertBefore(d,c)}}}},getScroll:function(){var d,b,e=document.documentElement,c=document.body;if(e&&(e.scrollTop||e.scrollLeft)){d=e.scrollTop;b=e.scrollLeft}else{if(c){d=c.scrollTop;b=c.scrollLeft}else{}}return{top:d,left:b}},getStyle:function(c,b){return Ext.fly(c).getStyle(b)},getScrollTop:function(){return this.getScroll().top},getScrollLeft:function(){return this.getScroll().left},moveToEl:function(b,d){var c=Ext.lib.Dom.getXY(d);Ext.lib.Dom.setXY(b,c)},numericSort:function(d,c){return(d-c)},_timeoutCount:0,_addListeners:function(){var b=Ext.dd.DDM;if(Ext.lib.Event&&document){b._onLoad()}else{if(b._timeoutCount>2000){}else{setTimeout(b._addListeners,10);if(document&&document.body){b._timeoutCount+=1}}}},handleWasClicked:function(b,d){if(this.isHandle(d,b.id)){return true}else{var c=b.parentNode;while(c){if(this.isHandle(d,c.id)){return true}else{c=c.parentNode}}}return false}}}();Ext.dd.DDM=Ext.dd.DragDropMgr;Ext.dd.DDM._addListeners()}Ext.dd.DD=function(c,a,b){if(c){this.init(c,a,b)}};Ext.extend(Ext.dd.DD,Ext.dd.DragDrop,{scroll:true,autoOffset:function(c,b){var a=c-this.startPageX;var d=b-this.startPageY;this.setDelta(a,d)},setDelta:function(b,a){this.deltaX=b;this.deltaY=a},setDragElPos:function(c,b){var a=this.getDragEl();this.alignElWithMouse(a,c,b)},alignElWithMouse:function(c,g,f){var e=this.getTargetCoord(g,f);var b=c.dom?c:Ext.fly(c,"_dd");if(!this.deltaSetXY){var h=[e.x,e.y];b.setXY(h);var d=b.getLeft(true);var a=b.getTop(true);this.deltaSetXY=[d-e.x,a-e.y]}else{b.setLeftTop(e.x+this.deltaSetXY[0],e.y+this.deltaSetXY[1])}this.cachePosition(e.x,e.y);this.autoScroll(e.x,e.y,c.offsetHeight,c.offsetWidth);return e},cachePosition:function(b,a){if(b){this.lastPageX=b;this.lastPageY=a}else{var c=Ext.lib.Dom.getXY(this.getEl());this.lastPageX=c[0];this.lastPageY=c[1]}},autoScroll:function(k,j,e,l){if(this.scroll){var m=Ext.lib.Dom.getViewHeight();var b=Ext.lib.Dom.getViewWidth();var o=this.DDM.getScrollTop();var d=this.DDM.getScrollLeft();var i=e+j;var n=l+k;var g=(m+o-j-this.deltaY);var f=(b+d-k-this.deltaX);var c=40;var a=(document.all)?80:30;if(i>m&&g<c){window.scrollTo(d,o+a)}if(j<o&&o>0&&j-o<c){window.scrollTo(d,o-a)}if(n>b&&f<c){window.scrollTo(d+a,o)}if(k<d&&d>0&&k-d<c){window.scrollTo(d-a,o)}}},getTargetCoord:function(c,b){var a=c-this.deltaX;var d=b-this.deltaY;if(this.constrainX){if(a<this.minX){a=this.minX}if(a>this.maxX){a=this.maxX}}if(this.constrainY){if(d<this.minY){d=this.minY}if(d>this.maxY){d=this.maxY}}a=this.getTick(a,this.xTicks);d=this.getTick(d,this.yTicks);return{x:a,y:d}},applyConfig:function(){Ext.dd.DD.superclass.applyConfig.call(this);this.scroll=(this.config.scroll!==false)},b4MouseDown:function(a){this.autoOffset(a.getPageX(),a.getPageY())},b4Drag:function(a){this.setDragElPos(a.getPageX(),a.getPageY())},toString:function(){return("DD "+this.id)}});Ext.dd.DDProxy=function(c,a,b){if(c){this.init(c,a,b);this.initFrame()}};Ext.dd.DDProxy.dragElId="ygddfdiv";Ext.extend(Ext.dd.DDProxy,Ext.dd.DD,{resizeFrame:true,centerFrame:false,createFrame:function(){var b=this;var a=document.body;if(!a||!a.firstChild){setTimeout(function(){b.createFrame()},50);return}var d=this.getDragEl();if(!d){d=document.createElement("div");d.id=this.dragElId;var c=d.style;c.position="absolute";c.visibility="hidden";c.cursor="move";c.border="2px solid #aaa";c.zIndex=999;a.insertBefore(d,a.firstChild)}},initFrame:function(){this.createFrame()},applyConfig:function(){Ext.dd.DDProxy.superclass.applyConfig.call(this);this.resizeFrame=(this.config.resizeFrame!==false);this.centerFrame=(this.config.centerFrame);this.setDragElId(this.config.dragElId||Ext.dd.DDProxy.dragElId)},showFrame:function(e,d){var c=this.getEl();var a=this.getDragEl();var b=a.style;this._resizeProxy();if(this.centerFrame){this.setDelta(Math.round(parseInt(b.width,10)/2),Math.round(parseInt(b.height,10)/2))}this.setDragElPos(e,d);Ext.fly(a).show()},_resizeProxy:function(){if(this.resizeFrame){var a=this.getEl();Ext.fly(this.getDragEl()).setSize(a.offsetWidth,a.offsetHeight)}},b4MouseDown:function(b){var a=b.getPageX();var c=b.getPageY();this.autoOffset(a,c);this.setDragElPos(a,c)},b4StartDrag:function(a,b){this.showFrame(a,b)},b4EndDrag:function(a){Ext.fly(this.getDragEl()).hide()},endDrag:function(c){var b=this.getEl();var a=this.getDragEl();a.style.visibility="";this.beforeMove();b.style.visibility="hidden";Ext.dd.DDM.moveToEl(b,a);a.style.visibility="hidden";b.style.visibility="";this.afterDrag()},beforeMove:function(){},afterDrag:function(){},toString:function(){return("DDProxy "+this.id)}});Ext.dd.DDTarget=function(c,a,b){if(c){this.initTarget(c,a,b)}};Ext.extend(Ext.dd.DDTarget,Ext.dd.DragDrop,{getDragEl:Ext.emptyFn,isValidHandleChild:Ext.emptyFn,startDrag:Ext.emptyFn,endDrag:Ext.emptyFn,onDrag:Ext.emptyFn,onDragDrop:Ext.emptyFn,onDragEnter:Ext.emptyFn,onDragOut:Ext.emptyFn,onDragOver:Ext.emptyFn,onInvalidDrop:Ext.emptyFn,onMouseDown:Ext.emptyFn,onMouseUp:Ext.emptyFn,setXConstraint:Ext.emptyFn,setYConstraint:Ext.emptyFn,resetConstraints:Ext.emptyFn,clearConstraints:Ext.emptyFn,clearTicks:Ext.emptyFn,setInitPosition:Ext.emptyFn,setDragElId:Ext.emptyFn,setHandleElId:Ext.emptyFn,setOuterHandleElId:Ext.emptyFn,addInvalidHandleClass:Ext.emptyFn,addInvalidHandleId:Ext.emptyFn,addInvalidHandleType:Ext.emptyFn,removeInvalidHandleClass:Ext.emptyFn,removeInvalidHandleId:Ext.emptyFn,removeInvalidHandleType:Ext.emptyFn,toString:function(){return("DDTarget "+this.id)}});Ext.dd.DragTracker=Ext.extend(Ext.util.Observable,{active:false,tolerance:5,autoStart:false,constructor:function(a){Ext.apply(this,a);this.addEvents("mousedown","mouseup","mousemove","dragstart","dragend","drag");this.dragRegion=new Ext.lib.Region(0,0,0,0);if(this.el){this.initEl(this.el)}Ext.dd.DragTracker.superclass.constructor.call(this,a)},initEl:function(a){this.el=Ext.get(a);a.on("mousedown",this.onMouseDown,this,this.delegate?{delegate:this.delegate}:undefined)},destroy:function(){this.el.un("mousedown",this.onMouseDown,this);delete this.el},onMouseDown:function(b,a){if(this.fireEvent("mousedown",this,b)!==false&&this.onBeforeStart(b)!==false){this.startXY=this.lastXY=b.getXY();this.dragTarget=this.delegate?a:this.el.dom;if(this.preventDefault!==false){b.preventDefault()}Ext.getDoc().on({scope:this,mouseup:this.onMouseUp,mousemove:this.onMouseMove,selectstart:this.stopSelect});if(this.autoStart){this.timer=this.triggerStart.defer(this.autoStart===true?1000:this.autoStart,this,[b])}}},onMouseMove:function(d,c){if(this.active&&Ext.isIE&&!d.browserEvent.button){d.preventDefault();this.onMouseUp(d);return}d.preventDefault();var b=d.getXY(),a=this.startXY;this.lastXY=b;if(!this.active){if(Math.abs(a[0]-b[0])>this.tolerance||Math.abs(a[1]-b[1])>this.tolerance){this.triggerStart(d)}else{return}}this.fireEvent("mousemove",this,d);this.onDrag(d);this.fireEvent("drag",this,d)},onMouseUp:function(c){var b=Ext.getDoc(),a=this.active;b.un("mousemove",this.onMouseMove,this);b.un("mouseup",this.onMouseUp,this);b.un("selectstart",this.stopSelect,this);c.preventDefault();this.clearStart();this.active=false;delete this.elRegion;this.fireEvent("mouseup",this,c);if(a){this.onEnd(c);this.fireEvent("dragend",this,c)}},triggerStart:function(a){this.clearStart();this.active=true;this.onStart(a);this.fireEvent("dragstart",this,a)},clearStart:function(){if(this.timer){clearTimeout(this.timer);delete this.timer}},stopSelect:function(a){a.stopEvent();return false},onBeforeStart:function(a){},onStart:function(a){},onDrag:function(a){},onEnd:function(a){},getDragTarget:function(){return this.dragTarget},getDragCt:function(){return this.el},getXY:function(a){return a?this.constrainModes[a].call(this,this.lastXY):this.lastXY},getOffset:function(c){var b=this.getXY(c),a=this.startXY;return[a[0]-b[0],a[1]-b[1]]},constrainModes:{point:function(b){if(!this.elRegion){this.elRegion=this.getDragCt().getRegion()}var a=this.dragRegion;a.left=b[0];a.top=b[1];a.right=b[0];a.bottom=b[1];a.constrainTo(this.elRegion);return[a.left,a.top]}}});Ext.dd.ScrollManager=function(){var c=Ext.dd.DragDropMgr;var e={};var b=null;var h={};var g=function(k){b=null;a()};var i=function(){if(c.dragCurrent){c.refreshCache(c.dragCurrent.groups)}};var d=function(){if(c.dragCurrent){var k=Ext.dd.ScrollManager;var l=h.el.ddScrollConfig?h.el.ddScrollConfig.increment:k.increment;if(!k.animate){if(h.el.scroll(h.dir,l)){i()}}else{h.el.scroll(h.dir,l,true,k.animDuration,i)}}};var a=function(){if(h.id){clearInterval(h.id)}h.id=0;h.el=null;h.dir=""};var f=function(l,k){a();h.el=l;h.dir=k;var n=l.ddScrollConfig?l.ddScrollConfig.ddGroup:undefined,m=(l.ddScrollConfig&&l.ddScrollConfig.frequency)?l.ddScrollConfig.frequency:Ext.dd.ScrollManager.frequency;if(n===undefined||c.dragCurrent.ddGroup==n){h.id=setInterval(d,m)}};var j=function(n,p){if(p||!c.dragCurrent){return}var q=Ext.dd.ScrollManager;if(!b||b!=c.dragCurrent){b=c.dragCurrent;q.refreshCache()}var s=Ext.lib.Event.getXY(n);var t=new Ext.lib.Point(s[0],s[1]);for(var l in e){var m=e[l],k=m._region;var o=m.ddScrollConfig?m.ddScrollConfig:q;if(k&&k.contains(t)&&m.isScrollable()){if(k.bottom-t.y<=o.vthresh){if(h.el!=m){f(m,"down")}return}else{if(k.right-t.x<=o.hthresh){if(h.el!=m){f(m,"left")}return}else{if(t.y-k.top<=o.vthresh){if(h.el!=m){f(m,"up")}return}else{if(t.x-k.left<=o.hthresh){if(h.el!=m){f(m,"right")}return}}}}}}a()};c.fireEvents=c.fireEvents.createSequence(j,c);c.stopDrag=c.stopDrag.createSequence(g,c);return{register:function(m){if(Ext.isArray(m)){for(var l=0,k=m.length;l<k;l++){this.register(m[l])}}else{m=Ext.get(m);e[m.id]=m}},unregister:function(m){if(Ext.isArray(m)){for(var l=0,k=m.length;l<k;l++){this.unregister(m[l])}}else{m=Ext.get(m);delete e[m.id]}},vthresh:25,hthresh:25,increment:100,frequency:500,animate:true,animDuration:0.4,ddGroup:undefined,refreshCache:function(){for(var k in e){if(typeof e[k]=="object"){e[k]._region=e[k].getRegion()}}}}}();Ext.dd.Registry=function(){var d={};var b={};var a=0;var c=function(f,e){if(typeof f=="string"){return f}var g=f.id;if(!g&&e!==false){g="extdd-"+(++a);f.id=g}return g};return{register:function(h,j){j=j||{};if(typeof h=="string"){h=document.getElementById(h)}j.ddel=h;d[c(h)]=j;if(j.isHandle!==false){b[j.ddel.id]=j}if(j.handles){var g=j.handles;for(var f=0,e=g.length;f<e;f++){b[c(g[f])]=j}}},unregister:function(h){var k=c(h,false);var j=d[k];if(j){delete d[k];if(j.handles){var g=j.handles;for(var f=0,e=g.length;f<e;f++){delete b[c(g[f],false)]}}}},getHandle:function(e){if(typeof e!="string"){e=e.id}return b[e]},getHandleFromEvent:function(g){var f=Ext.lib.Event.getTarget(g);return f?b[f.id]:null},getTarget:function(e){if(typeof e!="string"){e=e.id}return d[e]},getTargetFromEvent:function(g){var f=Ext.lib.Event.getTarget(g);return f?d[f.id]||b[f.id]:null}}}();Ext.dd.StatusProxy=function(a){Ext.apply(this,a);this.id=this.id||Ext.id();this.el=new Ext.Layer({dh:{id:this.id,tag:"div",cls:"x-dd-drag-proxy "+this.dropNotAllowed,children:[{tag:"div",cls:"x-dd-drop-icon"},{tag:"div",cls:"x-dd-drag-ghost"}]},shadow:!a||a.shadow!==false});this.ghost=Ext.get(this.el.dom.childNodes[1]);this.dropStatus=this.dropNotAllowed};Ext.dd.StatusProxy.prototype={dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",setStatus:function(a){a=a||this.dropNotAllowed;if(this.dropStatus!=a){this.el.replaceClass(this.dropStatus,a);this.dropStatus=a}},reset:function(a){this.el.dom.className="x-dd-drag-proxy "+this.dropNotAllowed;this.dropStatus=this.dropNotAllowed;if(a){this.ghost.update("")}},update:function(a){if(typeof a=="string"){this.ghost.update(a)}else{this.ghost.update("");a.style.margin="0";this.ghost.dom.appendChild(a)}var b=this.ghost.dom.firstChild;if(b){Ext.fly(b).setStyle("float","none")}},getEl:function(){return this.el},getGhost:function(){return this.ghost},hide:function(a){this.el.hide();if(a){this.reset(true)}},stop:function(){if(this.anim&&this.anim.isAnimated&&this.anim.isAnimated()){this.anim.stop()}},show:function(){this.el.show()},sync:function(){this.el.sync()},repair:function(b,c,a){this.callback=c;this.scope=a;if(b&&this.animRepair!==false){this.el.addClass("x-dd-drag-repair");this.el.hideUnders(true);this.anim=this.el.shift({duration:this.repairDuration||0.5,easing:"easeOut",xy:b,stopFx:true,callback:this.afterRepair,scope:this})}else{this.afterRepair()}},afterRepair:function(){this.hide(true);if(typeof this.callback=="function"){this.callback.call(this.scope||this)}this.callback=null;this.scope=null},destroy:function(){Ext.destroy(this.ghost,this.el)}};Ext.dd.DragSource=function(b,a){this.el=Ext.get(b);if(!this.dragData){this.dragData={}}Ext.apply(this,a);if(!this.proxy){this.proxy=new Ext.dd.StatusProxy()}Ext.dd.DragSource.superclass.constructor.call(this,this.el.dom,this.ddGroup||this.group,{dragElId:this.proxy.id,resizeFrame:false,isTarget:false,scroll:this.scroll===true});this.dragging=false};Ext.extend(Ext.dd.DragSource,Ext.dd.DDProxy,{dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",getDragData:function(a){return this.dragData},onDragEnter:function(c,d){var b=Ext.dd.DragDropMgr.getDDById(d);this.cachedTarget=b;if(this.beforeDragEnter(b,c,d)!==false){if(b.isNotifyTarget){var a=b.notifyEnter(this,c,this.dragData);this.proxy.setStatus(a)}else{this.proxy.setStatus(this.dropAllowed)}if(this.afterDragEnter){this.afterDragEnter(b,c,d)}}},beforeDragEnter:function(b,a,c){return true},alignElWithMouse:function(){Ext.dd.DragSource.superclass.alignElWithMouse.apply(this,arguments);this.proxy.sync()},onDragOver:function(c,d){var b=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(d);if(this.beforeDragOver(b,c,d)!==false){if(b.isNotifyTarget){var a=b.notifyOver(this,c,this.dragData);this.proxy.setStatus(a)}if(this.afterDragOver){this.afterDragOver(b,c,d)}}},beforeDragOver:function(b,a,c){return true},onDragOut:function(b,c){var a=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(c);if(this.beforeDragOut(a,b,c)!==false){if(a.isNotifyTarget){a.notifyOut(this,b,this.dragData)}this.proxy.reset();if(this.afterDragOut){this.afterDragOut(a,b,c)}}this.cachedTarget=null},beforeDragOut:function(b,a,c){return true},onDragDrop:function(b,c){var a=this.cachedTarget||Ext.dd.DragDropMgr.getDDById(c);if(this.beforeDragDrop(a,b,c)!==false){if(a.isNotifyTarget){if(a.notifyDrop(this,b,this.dragData)){this.onValidDrop(a,b,c)}else{this.onInvalidDrop(a,b,c)}}else{this.onValidDrop(a,b,c)}if(this.afterDragDrop){this.afterDragDrop(a,b,c)}}delete this.cachedTarget},beforeDragDrop:function(b,a,c){return true},onValidDrop:function(b,a,c){this.hideProxy();if(this.afterValidDrop){this.afterValidDrop(b,a,c)}},getRepairXY:function(b,a){return this.el.getXY()},onInvalidDrop:function(b,a,c){this.beforeInvalidDrop(b,a,c);if(this.cachedTarget){if(this.cachedTarget.isNotifyTarget){this.cachedTarget.notifyOut(this,a,this.dragData)}this.cacheTarget=null}this.proxy.repair(this.getRepairXY(a,this.dragData),this.afterRepair,this);if(this.afterInvalidDrop){this.afterInvalidDrop(a,c)}},afterRepair:function(){if(Ext.enableFx){this.el.highlight(this.hlColor||"c3daf9")}this.dragging=false},beforeInvalidDrop:function(b,a,c){return true},handleMouseDown:function(b){if(this.dragging){return}var a=this.getDragData(b);if(a&&this.onBeforeDrag(a,b)!==false){this.dragData=a;this.proxy.stop();Ext.dd.DragSource.superclass.handleMouseDown.apply(this,arguments)}},onBeforeDrag:function(a,b){return true},onStartDrag:Ext.emptyFn,startDrag:function(a,b){this.proxy.reset();this.dragging=true;this.proxy.update("");this.onInitDrag(a,b);this.proxy.show()},onInitDrag:function(a,c){var b=this.el.dom.cloneNode(true);b.id=Ext.id();this.proxy.update(b);this.onStartDrag(a,c);return true},getProxy:function(){return this.proxy},hideProxy:function(){this.proxy.hide();this.proxy.reset(true);this.dragging=false},triggerCacheRefresh:function(){Ext.dd.DDM.refreshCache(this.groups)},b4EndDrag:function(a){},endDrag:function(a){this.onEndDrag(this.dragData,a)},onEndDrag:function(a,b){},autoOffset:function(a,b){this.setDelta(-12,-20)},destroy:function(){Ext.dd.DragSource.superclass.destroy.call(this);Ext.destroy(this.proxy)}});Ext.dd.DropTarget=Ext.extend(Ext.dd.DDTarget,{constructor:function(b,a){this.el=Ext.get(b);Ext.apply(this,a);if(this.containerScroll){Ext.dd.ScrollManager.register(this.el)}Ext.dd.DropTarget.superclass.constructor.call(this,this.el.dom,this.ddGroup||this.group,{isTarget:true})},dropAllowed:"x-dd-drop-ok",dropNotAllowed:"x-dd-drop-nodrop",isTarget:true,isNotifyTarget:true,notifyEnter:function(a,c,b){if(this.overClass){this.el.addClass(this.overClass)}return this.dropAllowed},notifyOver:function(a,c,b){return this.dropAllowed},notifyOut:function(a,c,b){if(this.overClass){this.el.removeClass(this.overClass)}},notifyDrop:function(a,c,b){return false},destroy:function(){Ext.dd.DropTarget.superclass.destroy.call(this);if(this.containerScroll){Ext.dd.ScrollManager.unregister(this.el)}}});Ext.dd.DragZone=Ext.extend(Ext.dd.DragSource,{constructor:function(b,a){Ext.dd.DragZone.superclass.constructor.call(this,b,a);if(this.containerScroll){Ext.dd.ScrollManager.register(this.el)}},getDragData:function(a){return Ext.dd.Registry.getHandleFromEvent(a)},onInitDrag:function(a,b){this.proxy.update(this.dragData.ddel.cloneNode(true));this.onStartDrag(a,b);return true},afterRepair:function(){if(Ext.enableFx){Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor||"c3daf9")}this.dragging=false},getRepairXY:function(a){return Ext.Element.fly(this.dragData.ddel).getXY()},destroy:function(){Ext.dd.DragZone.superclass.destroy.call(this);if(this.containerScroll){Ext.dd.ScrollManager.unregister(this.el)}}});Ext.dd.DropZone=function(b,a){Ext.dd.DropZone.superclass.constructor.call(this,b,a)};Ext.extend(Ext.dd.DropZone,Ext.dd.DropTarget,{getTargetFromEvent:function(a){return Ext.dd.Registry.getTargetFromEvent(a)},onNodeEnter:function(d,a,c,b){},onNodeOver:function(d,a,c,b){return this.dropAllowed},onNodeOut:function(d,a,c,b){},onNodeDrop:function(d,a,c,b){return false},onContainerOver:function(a,c,b){return this.dropNotAllowed},onContainerDrop:function(a,c,b){return false},notifyEnter:function(a,c,b){return this.dropNotAllowed},notifyOver:function(a,c,b){var d=this.getTargetFromEvent(c);if(!d){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}return this.onContainerOver(a,c,b)}if(this.lastOverNode!=d){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b)}this.onNodeEnter(d,a,c,b);this.lastOverNode=d}return this.onNodeOver(d,a,c,b)},notifyOut:function(a,c,b){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}},notifyDrop:function(a,c,b){if(this.lastOverNode){this.onNodeOut(this.lastOverNode,a,c,b);this.lastOverNode=null}var d=this.getTargetFromEvent(c);return d?this.onNodeDrop(d,a,c,b):this.onContainerDrop(a,c,b)},triggerCacheRefresh:function(){Ext.dd.DDM.refreshCache(this.groups)}});Ext.Element.addMethods({initDD:function(c,b,d){var a=new Ext.dd.DD(Ext.id(this.dom),c,b);return Ext.apply(a,d)},initDDProxy:function(c,b,d){var a=new Ext.dd.DDProxy(Ext.id(this.dom),c,b);return Ext.apply(a,d)},initDDTarget:function(c,b,d){var a=new Ext.dd.DDTarget(Ext.id(this.dom),c,b);return Ext.apply(a,d)}});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-property.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.grid.PropertyRecord=Ext.data.Record.create([{name:"name",type:"string"},"value"]);Ext.grid.PropertyStore=Ext.extend(Ext.util.Observable,{constructor:function(a,b){this.grid=a;this.store=new Ext.data.Store({recordType:Ext.grid.PropertyRecord});this.store.on("update",this.onUpdate,this);if(b){this.setSource(b)}Ext.grid.PropertyStore.superclass.constructor.call(this)},setSource:function(c){this.source=c;this.store.removeAll();var b=[];for(var a in c){if(this.isEditableValue(c[a])){b.push(new Ext.grid.PropertyRecord({name:a,value:c[a]},a))}}this.store.loadRecords({records:b},{},true)},onUpdate:function(e,a,d){if(d==Ext.data.Record.EDIT){var b=a.data.value;var c=a.modified.value;if(this.grid.fireEvent("beforepropertychange",this.source,a.id,b,c)!==false){this.source[a.id]=b;a.commit();this.grid.fireEvent("propertychange",this.source,a.id,b,c)}else{a.reject()}}},getProperty:function(a){return this.store.getAt(a)},isEditableValue:function(a){return Ext.isPrimitive(a)||Ext.isDate(a)},setValue:function(d,c,a){var b=this.getRec(d);if(b){b.set("value",c);this.source[d]=c}else{if(a){this.source[d]=c;b=new Ext.grid.PropertyRecord({name:d,value:c},d);this.store.add(b)}}},remove:function(b){var a=this.getRec(b);if(a){this.store.remove(a);delete this.source[b]}},getRec:function(a){return this.store.getById(a)},getSource:function(){return this.source}});Ext.grid.PropertyColumnModel=Ext.extend(Ext.grid.ColumnModel,{nameText:"Name",valueText:"Value",dateFormat:"m/j/Y",trueText:"true",falseText:"false",constructor:function(c,b){var d=Ext.grid,e=Ext.form;this.grid=c;d.PropertyColumnModel.superclass.constructor.call(this,[{header:this.nameText,width:50,sortable:true,dataIndex:"name",id:"name",menuDisabled:true},{header:this.valueText,width:50,resizable:false,dataIndex:"value",id:"value",menuDisabled:true}]);this.store=b;var a=new e.Field({autoCreate:{tag:"select",children:[{tag:"option",value:"true",html:this.trueText},{tag:"option",value:"false",html:this.falseText}]},getValue:function(){return this.el.dom.value=="true"}});this.editors={date:new d.GridEditor(new e.DateField({selectOnFocus:true})),string:new d.GridEditor(new e.TextField({selectOnFocus:true})),number:new d.GridEditor(new e.NumberField({selectOnFocus:true,style:"text-align:left;"})),"boolean":new d.GridEditor(a,{autoSize:"both"})};this.renderCellDelegate=this.renderCell.createDelegate(this);this.renderPropDelegate=this.renderProp.createDelegate(this)},renderDate:function(a){return a.dateFormat(this.dateFormat)},renderBool:function(a){return this[a?"trueText":"falseText"]},isCellEditable:function(a,b){return a==1},getRenderer:function(a){return a==1?this.renderCellDelegate:this.renderPropDelegate},renderProp:function(a){return this.getPropertyName(a)},renderCell:function(d,b,c){var a=this.grid.customRenderers[c.get("name")];if(a){return a.apply(this,arguments)}var e=d;if(Ext.isDate(d)){e=this.renderDate(d)}else{if(typeof d=="boolean"){e=this.renderBool(d)}}return Ext.util.Format.htmlEncode(e)},getPropertyName:function(b){var a=this.grid.propertyNames;return a&&a[b]?a[b]:b},getCellEditor:function(a,e){var b=this.store.getProperty(e),d=b.data.name,c=b.data.value;if(this.grid.customEditors[d]){return this.grid.customEditors[d]}if(Ext.isDate(c)){return this.editors.date}else{if(typeof c=="number"){return this.editors.number}else{if(typeof c=="boolean"){return this.editors["boolean"]}else{return this.editors.string}}}},destroy:function(){Ext.grid.PropertyColumnModel.superclass.destroy.call(this);this.destroyEditors(this.editors);this.destroyEditors(this.grid.customEditors)},destroyEditors:function(b){for(var a in b){Ext.destroy(b[a])}}});Ext.grid.PropertyGrid=Ext.extend(Ext.grid.EditorGridPanel,{enableColumnMove:false,stripeRows:false,trackMouseOver:false,clicksToEdit:1,enableHdMenu:false,viewConfig:{forceFit:true},initComponent:function(){this.customRenderers=this.customRenderers||{};this.customEditors=this.customEditors||{};this.lastEditRow=null;var b=new Ext.grid.PropertyStore(this);this.propStore=b;var a=new Ext.grid.PropertyColumnModel(this,b);b.store.sort("name","ASC");this.addEvents("beforepropertychange","propertychange");this.cm=a;this.ds=b.store;Ext.grid.PropertyGrid.superclass.initComponent.call(this);this.mon(this.selModel,"beforecellselect",function(e,d,c){if(c===0){this.startEditing.defer(200,this,[d,1]);return false}},this)},onRender:function(){Ext.grid.PropertyGrid.superclass.onRender.apply(this,arguments);this.getGridEl().addClass("x-props-grid")},afterRender:function(){Ext.grid.PropertyGrid.superclass.afterRender.apply(this,arguments);if(this.source){this.setSource(this.source)}},setSource:function(a){this.propStore.setSource(a)},getSource:function(){return this.propStore.getSource()},setProperty:function(c,b,a){this.propStore.setValue(c,b,a)},removeProperty:function(a){this.propStore.remove(a)}});Ext.reg("propertygrid",Ext.grid.PropertyGrid);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-charts-debug.js	(revision 76)
@@ -0,0 +1,1928 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*! SWFObject v2.2 <http://code.google.com/p/swfobject/> 
+    is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
+*/
+
+var swfobject = function() {
+    
+    var UNDEF = "undefined",
+        OBJECT = "object",
+        SHOCKWAVE_FLASH = "Shockwave Flash",
+        SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash",
+        FLASH_MIME_TYPE = "application/x-shockwave-flash",
+        EXPRESS_INSTALL_ID = "SWFObjectExprInst",
+        ON_READY_STATE_CHANGE = "onreadystatechange",
+        
+        win = window,
+        doc = document,
+        nav = navigator,
+        
+        plugin = false,
+        domLoadFnArr = [main],
+        regObjArr = [],
+        objIdArr = [],
+        listenersArr = [],
+        storedAltContent,
+        storedAltContentId,
+        storedCallbackFn,
+        storedCallbackObj,
+        isDomLoaded = false,
+        isExpressInstallActive = false,
+        dynamicStylesheet,
+        dynamicStylesheetMedia,
+        autoHideShow = true,
+    
+    /* Centralized function for browser feature detection
+        - User agent string detection is only used when no good alternative is possible
+        - Is executed directly for optimal performance
+    */  
+    ua = function() {
+        var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF,
+            u = nav.userAgent.toLowerCase(),
+            p = nav.platform.toLowerCase(),
+            windows = p ? (/win/).test(p) : /win/.test(u),
+            mac = p ? (/mac/).test(p) : /mac/.test(u),
+            webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, // returns either the webkit version or false if not webkit
+            ie = !+"\v1", // feature detection based on Andrea Giammarchi's solution: http://webreflection.blogspot.com/2009/01/32-bytes-to-know-if-your-browser-is-ie.html
+            playerVersion = [0,0,0],
+            d = null;
+        if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) {
+            d = nav.plugins[SHOCKWAVE_FLASH].description;
+            if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { // navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin indicates whether plug-ins are enabled or disabled in Safari 3+
+                plugin = true;
+                ie = false; // cascaded feature detection for Internet Explorer
+                d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
+                playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10);
+                playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10);
+                playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0;
+            }
+        }
+        else if (typeof win.ActiveXObject != UNDEF) {
+            try {
+                var a = new ActiveXObject(SHOCKWAVE_FLASH_AX);
+                if (a) { // a will return null when ActiveX is disabled
+                    d = a.GetVariable("$version");
+                    if (d) {
+                        ie = true; // cascaded feature detection for Internet Explorer
+                        d = d.split(" ")[1].split(",");
+                        playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+            }
+            catch(e) {}
+        }
+        return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac };
+    }(),
+    
+    /* Cross-browser onDomLoad
+        - Will fire an event as soon as the DOM of a web page is loaded
+        - Internet Explorer workaround based on Diego Perini's solution: http://javascript.nwbox.com/IEContentLoaded/
+        - Regular onload serves as fallback
+    */ 
+    onDomLoad = function() {
+        if (!ua.w3) { return; }
+        if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { // function is fired after onload, e.g. when script is inserted dynamically 
+            callDomLoadFunctions();
+        }
+        if (!isDomLoaded) {
+            if (typeof doc.addEventListener != UNDEF) {
+                doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false);
+            }       
+            if (ua.ie && ua.win) {
+                doc.attachEvent(ON_READY_STATE_CHANGE, function() {
+                    if (doc.readyState == "complete") {
+                        doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee);
+                        callDomLoadFunctions();
+                    }
+                });
+                if (win == top) { // if not inside an iframe
+                    (function(){
+                        if (isDomLoaded) { return; }
+                        try {
+                            doc.documentElement.doScroll("left");
+                        }
+                        catch(e) {
+                            setTimeout(arguments.callee, 0);
+                            return;
+                        }
+                        callDomLoadFunctions();
+                    })();
+                }
+            }
+            if (ua.wk) {
+                (function(){
+                    if (isDomLoaded) { return; }
+                    if (!(/loaded|complete/).test(doc.readyState)) {
+                        setTimeout(arguments.callee, 0);
+                        return;
+                    }
+                    callDomLoadFunctions();
+                })();
+            }
+            addLoadEvent(callDomLoadFunctions);
+        }
+    }();
+    
+    function callDomLoadFunctions() {
+        if (isDomLoaded) { return; }
+        try { // test if we can really add/remove elements to/from the DOM; we don't want to fire it too early
+            var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span"));
+            t.parentNode.removeChild(t);
+        }
+        catch (e) { return; }
+        isDomLoaded = true;
+        var dl = domLoadFnArr.length;
+        for (var i = 0; i < dl; i++) {
+            domLoadFnArr[i]();
+        }
+    }
+    
+    function addDomLoadEvent(fn) {
+        if (isDomLoaded) {
+            fn();
+        }
+        else { 
+            domLoadFnArr[domLoadFnArr.length] = fn; // Array.push() is only available in IE5.5+
+        }
+    }
+    
+    /* Cross-browser onload
+        - Based on James Edwards' solution: http://brothercake.com/site/resources/scripts/onload/
+        - Will fire an event as soon as a web page including all of its assets are loaded 
+     */
+    function addLoadEvent(fn) {
+        if (typeof win.addEventListener != UNDEF) {
+            win.addEventListener("load", fn, false);
+        }
+        else if (typeof doc.addEventListener != UNDEF) {
+            doc.addEventListener("load", fn, false);
+        }
+        else if (typeof win.attachEvent != UNDEF) {
+            addListener(win, "onload", fn);
+        }
+        else if (typeof win.onload == "function") {
+            var fnOld = win.onload;
+            win.onload = function() {
+                fnOld();
+                fn();
+            };
+        }
+        else {
+            win.onload = fn;
+        }
+    }
+    
+    /* Main function
+        - Will preferably execute onDomLoad, otherwise onload (as a fallback)
+    */
+    function main() { 
+        if (plugin) {
+            testPlayerVersion();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Detect the Flash Player version for non-Internet Explorer browsers
+        - Detecting the plug-in version via the object element is more precise than using the plugins collection item's description:
+          a. Both release and build numbers can be detected
+          b. Avoid wrong descriptions by corrupt installers provided by Adobe
+          c. Avoid wrong descriptions by multiple Flash Player entries in the plugin Array, caused by incorrect browser imports
+        - Disadvantage of this method is that it depends on the availability of the DOM, while the plugins collection is immediately available
+    */
+    function testPlayerVersion() {
+        var b = doc.getElementsByTagName("body")[0];
+        var o = createElement(OBJECT);
+        o.setAttribute("type", FLASH_MIME_TYPE);
+        var t = b.appendChild(o);
+        if (t) {
+            var counter = 0;
+            (function(){
+                if (typeof t.GetVariable != UNDEF) {
+                    var d = t.GetVariable("$version");
+                    if (d) {
+                        d = d.split(" ")[1].split(",");
+                        ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+                else if (counter < 10) {
+                    counter++;
+                    setTimeout(arguments.callee, 10);
+                    return;
+                }
+                b.removeChild(o);
+                t = null;
+                matchVersions();
+            })();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Perform Flash Player and SWF version matching; static publishing only
+    */
+    function matchVersions() {
+        var rl = regObjArr.length;
+        if (rl > 0) {
+            for (var i = 0; i < rl; i++) { // for each registered object element
+                var id = regObjArr[i].id;
+                var cb = regObjArr[i].callbackFn;
+                var cbObj = {success:false, id:id};
+                if (ua.pv[0] > 0) {
+                    var obj = getElementById(id);
+                    if (obj) {
+                        if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { // Flash Player version >= published SWF version: Houston, we have a match!
+                            setVisibility(id, true);
+                            if (cb) {
+                                cbObj.success = true;
+                                cbObj.ref = getObjectById(id);
+                                cb(cbObj);
+                            }
+                        }
+                        else if (regObjArr[i].expressInstall && canExpressInstall()) { // show the Adobe Express Install dialog if set by the web page author and if supported
+                            var att = {};
+                            att.data = regObjArr[i].expressInstall;
+                            att.width = obj.getAttribute("width") || "0";
+                            att.height = obj.getAttribute("height") || "0";
+                            if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); }
+                            if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); }
+                            // parse HTML object param element's name-value pairs
+                            var par = {};
+                            var p = obj.getElementsByTagName("param");
+                            var pl = p.length;
+                            for (var j = 0; j < pl; j++) {
+                                if (p[j].getAttribute("name").toLowerCase() != "movie") {
+                                    par[p[j].getAttribute("name")] = p[j].getAttribute("value");
+                                }
+                            }
+                            showExpressInstall(att, par, id, cb);
+                        }
+                        else { // Flash Player and SWF version mismatch or an older Webkit engine that ignores the HTML object element's nested param elements: display alternative content instead of SWF
+                            displayAltContent(obj);
+                            if (cb) { cb(cbObj); }
+                        }
+                    }
+                }
+                else {  // if no Flash Player is installed or the fp version cannot be detected we let the HTML object element do its job (either show a SWF or alternative content)
+                    setVisibility(id, true);
+                    if (cb) {
+                        var o = getObjectById(id); // test whether there is an HTML object element or not
+                        if (o && typeof o.SetVariable != UNDEF) { 
+                            cbObj.success = true;
+                            cbObj.ref = o;
+                        }
+                        cb(cbObj);
+                    }
+                }
+            }
+        }
+    }
+    
+    function getObjectById(objectIdStr) {
+        var r = null;
+        var o = getElementById(objectIdStr);
+        if (o && o.nodeName == "OBJECT") {
+            if (typeof o.SetVariable != UNDEF) {
+                r = o;
+            }
+            else {
+                var n = o.getElementsByTagName(OBJECT)[0];
+                if (n) {
+                    r = n;
+                }
+            }
+        }
+        return r;
+    }
+    
+    /* Requirements for Adobe Express Install
+        - only one instance can be active at a time
+        - fp 6.0.65 or higher
+        - Win/Mac OS only
+        - no Webkit engines older than version 312
+    */
+    function canExpressInstall() {
+        return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312);
+    }
+    
+    /* Show the Adobe Express Install dialog
+        - Reference: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75
+    */
+    function showExpressInstall(att, par, replaceElemIdStr, callbackFn) {
+        isExpressInstallActive = true;
+        storedCallbackFn = callbackFn || null;
+        storedCallbackObj = {success:false, id:replaceElemIdStr};
+        var obj = getElementById(replaceElemIdStr);
+        if (obj) {
+            if (obj.nodeName == "OBJECT") { // static publishing
+                storedAltContent = abstractAltContent(obj);
+                storedAltContentId = null;
+            }
+            else { // dynamic publishing
+                storedAltContent = obj;
+                storedAltContentId = replaceElemIdStr;
+            }
+            att.id = EXPRESS_INSTALL_ID;
+            if (typeof att.width == UNDEF || (!(/%$/).test(att.width) && parseInt(att.width, 10) < 310)) {
+                att.width = "310";
+            }
+            
+            if (typeof att.height == UNDEF || (!(/%$/).test(att.height) && parseInt(att.height, 10) < 137)) {
+                att.height = "137";
+            }
+            doc.title = doc.title.slice(0, 47) + " - Flash Player Installation";
+            var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn",
+                fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title;
+            if (typeof par.flashvars != UNDEF) {
+                par.flashvars += "&" + fv;
+            }
+            else {
+                par.flashvars = fv;
+            }
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            if (ua.ie && ua.win && obj.readyState != 4) {
+                var newObj = createElement("div");
+                replaceElemIdStr += "SWFObjectNew";
+                newObj.setAttribute("id", replaceElemIdStr);
+                obj.parentNode.insertBefore(newObj, obj); // insert placeholder div that will be replaced by the object element that loads expressinstall.swf
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        obj.parentNode.removeChild(obj);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            createSWF(att, par, replaceElemIdStr);
+        }
+    }
+    
+    /* Functions to abstract and display alternative content
+    */
+    function displayAltContent(obj) {
+        if (ua.ie && ua.win && obj.readyState != 4) {
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            var el = createElement("div");
+            obj.parentNode.insertBefore(el, obj); // insert placeholder div that will be replaced by the alternative content
+            el.parentNode.replaceChild(abstractAltContent(obj), el);
+            obj.style.display = "none";
+            (function(){
+                if (obj.readyState == 4) {
+                    obj.parentNode.removeChild(obj);
+                }
+                else {
+                    setTimeout(arguments.callee, 10);
+                }
+            })();
+        }
+        else {
+            obj.parentNode.replaceChild(abstractAltContent(obj), obj);
+        }
+    } 
+
+    function abstractAltContent(obj) {
+        var ac = createElement("div");
+        if (ua.win && ua.ie) {
+            ac.innerHTML = obj.innerHTML;
+        }
+        else {
+            var nestedObj = obj.getElementsByTagName(OBJECT)[0];
+            if (nestedObj) {
+                var c = nestedObj.childNodes;
+                if (c) {
+                    var cl = c.length;
+                    for (var i = 0; i < cl; i++) {
+                        if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) {
+                            ac.appendChild(c[i].cloneNode(true));
+                        }
+                    }
+                }
+            }
+        }
+        return ac;
+    }
+    
+    /* Cross-browser dynamic SWF creation
+    */
+    function createSWF(attObj, parObj, id) {
+        var r, el = getElementById(id);
+        if (ua.wk && ua.wk < 312) { return r; }
+        if (el) {
+            if (typeof attObj.id == UNDEF) { // if no 'id' is defined for the object element, it will inherit the 'id' from the alternative content
+                attObj.id = id;
+            }
+            if (ua.ie && ua.win) { // Internet Explorer + the HTML object element + W3C DOM methods do not combine: fall back to outerHTML
+                var att = "";
+                for (var i in attObj) {
+                    if (attObj[i] != Object.prototype[i]) { // filter out prototype additions from other potential libraries
+                        if (i.toLowerCase() == "data") {
+                            parObj.movie = attObj[i];
+                        }
+                        else if (i.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            att += ' class="' + attObj[i] + '"';
+                        }
+                        else if (i.toLowerCase() != "classid") {
+                            att += ' ' + i + '="' + attObj[i] + '"';
+                        }
+                    }
+                }
+                var par = "";
+                for (var j in parObj) {
+                    if (parObj[j] != Object.prototype[j]) { // filter out prototype additions from other potential libraries
+                        par += '<param name="' + j + '" value="' + parObj[j] + '" />';
+                    }
+                }
+                el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';
+                objIdArr[objIdArr.length] = attObj.id; // stored to fix object 'leaks' on unload (dynamic publishing only)
+                r = getElementById(attObj.id);  
+            }
+            else { // well-behaving browsers
+                var o = createElement(OBJECT);
+                o.setAttribute("type", FLASH_MIME_TYPE);
+                for (var m in attObj) {
+                    if (attObj[m] != Object.prototype[m]) { // filter out prototype additions from other potential libraries
+                        if (m.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            o.setAttribute("class", attObj[m]);
+                        }
+                        else if (m.toLowerCase() != "classid") { // filter out IE specific attribute
+                            o.setAttribute(m, attObj[m]);
+                        }
+                    }
+                }
+                for (var n in parObj) {
+                    if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { // filter out prototype additions from other potential libraries and IE specific param element
+                        createObjParam(o, n, parObj[n]);
+                    }
+                }
+                el.parentNode.replaceChild(o, el);
+                r = o;
+            }
+        }
+        return r;
+    }
+    
+    function createObjParam(el, pName, pValue) {
+        var p = createElement("param");
+        p.setAttribute("name", pName);  
+        p.setAttribute("value", pValue);
+        el.appendChild(p);
+    }
+    
+    /* Cross-browser SWF removal
+        - Especially needed to safely and completely remove a SWF in Internet Explorer
+    */
+    function removeSWF(id) {
+        var obj = getElementById(id);
+        if (obj && obj.nodeName == "OBJECT") {
+            if (ua.ie && ua.win) {
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        removeObjectInIE(id);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            else {
+                obj.parentNode.removeChild(obj);
+            }
+        }
+    }
+    
+    function removeObjectInIE(id) {
+        var obj = getElementById(id);
+        if (obj) {
+            for (var i in obj) {
+                if (typeof obj[i] == "function") {
+                    obj[i] = null;
+                }
+            }
+            obj.parentNode.removeChild(obj);
+        }
+    }
+    
+    /* Functions to optimize JavaScript compression
+    */
+    function getElementById(id) {
+        var el = null;
+        try {
+            el = doc.getElementById(id);
+        }
+        catch (e) {}
+        return el;
+    }
+    
+    function createElement(el) {
+        return doc.createElement(el);
+    }
+    
+    /* Updated attachEvent function for Internet Explorer
+        - Stores attachEvent information in an Array, so on unload the detachEvent functions can be called to avoid memory leaks
+    */  
+    function addListener(target, eventType, fn) {
+        target.attachEvent(eventType, fn);
+        listenersArr[listenersArr.length] = [target, eventType, fn];
+    }
+    
+    /* Flash Player and SWF content version matching
+    */
+    function hasPlayerVersion(rv) {
+        var pv = ua.pv, v = rv.split(".");
+        v[0] = parseInt(v[0], 10);
+        v[1] = parseInt(v[1], 10) || 0; // supports short notation, e.g. "9" instead of "9.0.0"
+        v[2] = parseInt(v[2], 10) || 0;
+        return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false;
+    }
+    
+    /* Cross-browser dynamic CSS creation
+        - Based on Bobby van der Sluis' solution: http://www.bobbyvandersluis.com/articles/dynamicCSS.php
+    */  
+    function createCSS(sel, decl, media, newStyle) {
+        if (ua.ie && ua.mac) { return; }
+        var h = doc.getElementsByTagName("head")[0];
+        if (!h) { return; } // to also support badly authored HTML pages that lack a head element
+        var m = (media && typeof media == "string") ? media : "screen";
+        if (newStyle) {
+            dynamicStylesheet = null;
+            dynamicStylesheetMedia = null;
+        }
+        if (!dynamicStylesheet || dynamicStylesheetMedia != m) { 
+            // create dynamic stylesheet + get a global reference to it
+            var s = createElement("style");
+            s.setAttribute("type", "text/css");
+            s.setAttribute("media", m);
+            dynamicStylesheet = h.appendChild(s);
+            if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) {
+                dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1];
+            }
+            dynamicStylesheetMedia = m;
+        }
+        // add style rule
+        if (ua.ie && ua.win) {
+            if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) {
+                dynamicStylesheet.addRule(sel, decl);
+            }
+        }
+        else {
+            if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) {
+                dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}"));
+            }
+        }
+    }
+    
+    function setVisibility(id, isVisible) {
+        if (!autoHideShow) { return; }
+        var v = isVisible ? "visible" : "hidden";
+        if (isDomLoaded && getElementById(id)) {
+            getElementById(id).style.visibility = v;
+        }
+        else {
+            createCSS("#" + id, "visibility:" + v);
+        }
+    }
+
+    /* Filter to avoid XSS attacks
+    */
+    function urlEncodeIfNecessary(s) {
+        var regex = /[\\\"<>\.;]/;
+        var hasBadChars = regex.exec(s) != null;
+        return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s;
+    }
+    
+    /* Release memory to avoid memory leaks caused by closures, fix hanging audio/video threads and force open sockets/NetConnections to disconnect (Internet Explorer only)
+    */
+    var cleanup = function() {
+        if (ua.ie && ua.win) {
+            window.attachEvent("onunload", function() {
+                // remove listeners to avoid memory leaks
+                var ll = listenersArr.length;
+                for (var i = 0; i < ll; i++) {
+                    listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]);
+                }
+                // cleanup dynamically embedded objects to fix audio/video threads and force open sockets and NetConnections to disconnect
+                var il = objIdArr.length;
+                for (var j = 0; j < il; j++) {
+                    removeSWF(objIdArr[j]);
+                }
+                // cleanup library's main closures to avoid memory leaks
+                for (var k in ua) {
+                    ua[k] = null;
+                }
+                ua = null;
+                for (var l in swfobject) {
+                    swfobject[l] = null;
+                }
+                swfobject = null;
+                window.detachEvent('onunload', arguments.callee);
+            });
+        }
+    }();
+    
+    return {
+        /* Public API
+            - Reference: http://code.google.com/p/swfobject/wiki/documentation
+        */ 
+        registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) {
+            if (ua.w3 && objectIdStr && swfVersionStr) {
+                var regObj = {};
+                regObj.id = objectIdStr;
+                regObj.swfVersion = swfVersionStr;
+                regObj.expressInstall = xiSwfUrlStr;
+                regObj.callbackFn = callbackFn;
+                regObjArr[regObjArr.length] = regObj;
+                setVisibility(objectIdStr, false);
+            }
+            else if (callbackFn) {
+                callbackFn({success:false, id:objectIdStr});
+            }
+        },
+        
+        getObjectById: function(objectIdStr) {
+            if (ua.w3) {
+                return getObjectById(objectIdStr);
+            }
+        },
+        
+        embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) {
+            var callbackObj = {success:false, id:replaceElemIdStr};
+            if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) {
+                setVisibility(replaceElemIdStr, false);
+                addDomLoadEvent(function() {
+                    widthStr += ""; // auto-convert to string
+                    heightStr += "";
+                    var att = {};
+                    if (attObj && typeof attObj === OBJECT) {
+                        for (var i in attObj) { // copy object to avoid the use of references, because web authors often reuse attObj for multiple SWFs
+                            att[i] = attObj[i];
+                        }
+                    }
+                    att.data = swfUrlStr;
+                    att.width = widthStr;
+                    att.height = heightStr;
+                    var par = {}; 
+                    if (parObj && typeof parObj === OBJECT) {
+                        for (var j in parObj) { // copy object to avoid the use of references, because web authors often reuse parObj for multiple SWFs
+                            par[j] = parObj[j];
+                        }
+                    }
+                    if (flashvarsObj && typeof flashvarsObj === OBJECT) {
+                        for (var k in flashvarsObj) { // copy object to avoid the use of references, because web authors often reuse flashvarsObj for multiple SWFs
+                            if (typeof par.flashvars != UNDEF) {
+                                par.flashvars += "&" + k + "=" + flashvarsObj[k];
+                            }
+                            else {
+                                par.flashvars = k + "=" + flashvarsObj[k];
+                            }
+                        }
+                    }
+                    if (hasPlayerVersion(swfVersionStr)) { // create SWF
+                        var obj = createSWF(att, par, replaceElemIdStr);
+                        if (att.id == replaceElemIdStr) {
+                            setVisibility(replaceElemIdStr, true);
+                        }
+                        callbackObj.success = true;
+                        callbackObj.ref = obj;
+                    }
+                    else if (xiSwfUrlStr && canExpressInstall()) { // show Adobe Express Install
+                        att.data = xiSwfUrlStr;
+                        showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+                        return;
+                    }
+                    else { // show alternative content
+                        setVisibility(replaceElemIdStr, true);
+                    }
+                    if (callbackFn) { callbackFn(callbackObj); }
+                });
+            }
+            else if (callbackFn) { callbackFn(callbackObj); }
+        },
+        
+        switchOffAutoHideShow: function() {
+            autoHideShow = false;
+        },
+        
+        ua: ua,
+        
+        getFlashPlayerVersion: function() {
+            return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] };
+        },
+        
+        hasFlashPlayerVersion: hasPlayerVersion,
+        
+        createSWF: function(attObj, parObj, replaceElemIdStr) {
+            if (ua.w3) {
+                return createSWF(attObj, parObj, replaceElemIdStr);
+            }
+            else {
+                return undefined;
+            }
+        },
+        
+        showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) {
+            if (ua.w3 && canExpressInstall()) {
+                showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+            }
+        },
+        
+        removeSWF: function(objElemIdStr) {
+            if (ua.w3) {
+                removeSWF(objElemIdStr);
+            }
+        },
+        
+        createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) {
+            if (ua.w3) {
+                createCSS(selStr, declStr, mediaStr, newStyleBoolean);
+            }
+        },
+        
+        addDomLoadEvent: addDomLoadEvent,
+        
+        addLoadEvent: addLoadEvent,
+        
+        getQueryParamValue: function(param) {
+            var q = doc.location.search || doc.location.hash;
+            if (q) {
+                if (/\?/.test(q)) { q = q.split("?")[1]; } // strip question mark
+                if (param == null) {
+                    return urlEncodeIfNecessary(q);
+                }
+                var pairs = q.split("&");
+                for (var i = 0; i < pairs.length; i++) {
+                    if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) {
+                        return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1)));
+                    }
+                }
+            }
+            return "";
+        },
+        
+        // For internal usage only
+        expressInstallCallback: function() {
+            if (isExpressInstallActive) {
+                var obj = getElementById(EXPRESS_INSTALL_ID);
+                if (obj && storedAltContent) {
+                    obj.parentNode.replaceChild(storedAltContent, obj);
+                    if (storedAltContentId) {
+                        setVisibility(storedAltContentId, true);
+                        if (ua.ie && ua.win) { storedAltContent.style.display = "block"; }
+                    }
+                    if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); }
+                }
+                isExpressInstallActive = false;
+            } 
+        }
+    };
+}();
+/**
+ * @class Ext.FlashComponent
+ * @extends Ext.BoxComponent
+ * @constructor
+ * @xtype flash
+ */
+Ext.FlashComponent = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} flashVersion
+     * Indicates the version the flash content was published for. Defaults to <tt>'9.0.115'</tt>.
+     */
+    flashVersion : '9.0.115',
+
+    /**
+     * @cfg {String} backgroundColor
+     * The background color of the chart. Defaults to <tt>'#ffffff'</tt>.
+     */
+    backgroundColor: '#ffffff',
+
+    /**
+     * @cfg {String} wmode
+     * The wmode of the flash object. This can be used to control layering. Defaults to <tt>'opaque'</tt>.
+     */
+    wmode: 'opaque',
+
+    /**
+     * @cfg {Object} flashVars
+     * A set of key value pairs to be passed to the flash object as flash variables. Defaults to <tt>undefined</tt>.
+     */
+    flashVars: undefined,
+
+    /**
+     * @cfg {Object} flashParams
+     * A set of key value pairs to be passed to the flash object as parameters. Possible parameters can be found here:
+     * http://kb2.adobe.com/cps/127/tn_12701.html Defaults to <tt>undefined</tt>.
+     */
+    flashParams: undefined,
+
+    /**
+     * @cfg {String} url
+     * The URL of the chart to include. Defaults to <tt>undefined</tt>.
+     */
+    url: undefined,
+    swfId : undefined,
+    swfWidth: '100%',
+    swfHeight: '100%',
+
+    /**
+     * @cfg {Boolean} expressInstall
+     * True to prompt the user to install flash if not installed. Note that this uses
+     * Ext.FlashComponent.EXPRESS_INSTALL_URL, which should be set to the local resource. Defaults to <tt>false</tt>.
+     */
+    expressInstall: false,
+
+    initComponent : function(){
+        Ext.FlashComponent.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event initialize
+             *
+             * @param {Chart} this
+             */
+            'initialize'
+        );
+    },
+
+    onRender : function(){
+        Ext.FlashComponent.superclass.onRender.apply(this, arguments);
+
+        var params = Ext.apply({
+            allowScriptAccess: 'always',
+            bgcolor: this.backgroundColor,
+            wmode: this.wmode
+        }, this.flashParams), vars = Ext.apply({
+            allowedDomain: document.location.hostname,
+            YUISwfId: this.getId(),
+            YUIBridgeCallback: 'Ext.FlashEventProxy.onEvent'
+        }, this.flashVars);
+
+        new swfobject.embedSWF(this.url, this.id, this.swfWidth, this.swfHeight, this.flashVersion,
+            this.expressInstall ? Ext.FlashComponent.EXPRESS_INSTALL_URL : undefined, vars, params);
+
+        this.swf = Ext.getDom(this.id);
+        this.el = Ext.get(this.swf);
+    },
+
+    getSwfId : function(){
+        return this.swfId || (this.swfId = "extswf" + (++Ext.Component.AUTO_ID));
+    },
+
+    getId : function(){
+        return this.id || (this.id = "extflashcmp" + (++Ext.Component.AUTO_ID));
+    },
+
+    onFlashEvent : function(e){
+        switch(e.type){
+            case "swfReady":
+                this.initSwf();
+                return;
+            case "log":
+                return;
+        }
+        e.component = this;
+        this.fireEvent(e.type.toLowerCase().replace(/event$/, ''), e);
+    },
+
+    initSwf : function(){
+        this.onSwfReady(!!this.isInitialized);
+        this.isInitialized = true;
+        this.fireEvent('initialize', this);
+    },
+
+    beforeDestroy: function(){
+        if(this.rendered){
+            swfobject.removeSWF(this.swf.id);
+        }
+        Ext.FlashComponent.superclass.beforeDestroy.call(this);
+    },
+
+    onSwfReady : Ext.emptyFn
+});
+
+/**
+ * Sets the url for installing flash if it doesn't exist. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.FlashComponent.EXPRESS_INSTALL_URL = 'http:/' + '/swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf';
+
+Ext.reg('flash', Ext.FlashComponent);/**
+ * @class Ext.FlashProxy
+ * @singleton
+ */
+Ext.FlashEventProxy = {
+    onEvent : function(id, e){
+        var fp = Ext.getCmp(id);
+        if(fp){
+            fp.onFlashEvent(e);
+        }else{
+            arguments.callee.defer(10, this, [id, e]);
+        }
+    }
+};/**
+ * @class Ext.chart.Chart
+ * @extends Ext.FlashComponent
+ * The Ext.chart package provides the capability to visualize data with flash based charting.
+ * Each chart binds directly to an Ext.data.Store enabling automatic updates of the chart.
+ * To change the look and feel of a chart, see the {@link #chartStyle} and {@link #extraStyle} config options.
+ * @constructor
+ * @xtype chart
+ */
+
+ Ext.chart.Chart = Ext.extend(Ext.FlashComponent, {
+    refreshBuffer: 100,
+
+    /**
+     * @cfg {String} backgroundColor
+     * @hide
+     */
+
+    /**
+     * @cfg {Object} chartStyle
+     * Sets styles for this chart. This contains default styling, so modifying this property will <b>override</b>
+     * the built in styles of the chart. Use {@link #extraStyle} to add customizations to the default styling.
+     */
+    chartStyle: {
+        padding: 10,
+        animationEnabled: true,
+        font: {
+            name: 'Tahoma',
+            color: 0x444444,
+            size: 11
+        },
+        dataTip: {
+            padding: 5,
+            border: {
+                color: 0x99bbe8,
+                size:1
+            },
+            background: {
+                color: 0xDAE7F6,
+                alpha: .9
+            },
+            font: {
+                name: 'Tahoma',
+                color: 0x15428B,
+                size: 10,
+                bold: true
+            }
+        }
+    },
+
+    /**
+     * @cfg {String} url
+     * The url to load the chart from. This defaults to Ext.chart.Chart.CHART_URL, which should
+     * be modified to point to the local charts resource.
+     */
+
+    /**
+     * @cfg {Object} extraStyle
+     * Contains extra styles that will be added or overwritten to the default chartStyle. Defaults to <tt>null</tt>.
+     * For a detailed list of the options available, visit the YUI Charts site
+     * at <a href="http://developer.yahoo.com/yui/charts/#basicstyles">http://developer.yahoo.com/yui/charts/#basicstyles</a><br/>
+     * Some of the options availabe:<br />
+     * <ul style="padding:5px;padding-left:16px;list-style-type:inherit;">
+     * <li><b>padding</b> - The space around the edge of the chart's contents. Padding does not increase the size of the chart.</li>
+     * <li><b>animationEnabled</b> - A Boolean value that specifies whether marker animations are enabled or not. Enabled by default.</li>
+     * <li><b>font</b> - An Object defining the font style to be used in the chart. Defaults to <tt>{ name: 'Tahoma', color: 0x444444, size: 11 }</tt><br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>name</b> - font name</li>
+     *      <li><b>color</b> - font color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - font size in points (numeric portion only, ie: 11)</li>
+     *      <li><b>bold</b> - boolean</li>
+     *      <li><b>italic</b> - boolean</li>
+     *      <li><b>underline</b> - boolean</li>
+     *  </ul>
+     * </li>
+     * <li><b>border</b> - An object defining the border style around the chart. The chart itself will decrease in dimensions to accomodate the border.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - border size in pixels (numeric portion only, ie: 1)</li>
+     *  </ul>
+     * </li>
+     * <li><b>background</b> - An object defining the background style of the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>image</b> - an image URL. May be relative to the current document or absolute.</li>
+     *  </ul>
+     * </li>
+     * <li><b>legend</b> - An object defining the legend style<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>display</b> - location of the legend. Possible values are "none", "left", "right", "top", and "bottom".</li>
+     *      <li><b>spacing</b> - an image URL. May be relative to the current document or absolute.</li>
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>dataTip</b> - An object defining the style of the data tip (tooltip).<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>xAxis and yAxis</b> - An object defining the style of the style of either axis.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - same option as described above.</li>
+     *      <li><b>size</b> - same option as described above.</li>
+     *      <li><b>showLabels</b> - boolean</li>
+     *      <li><b>labelRotation</b> - a value in degrees from -90 through 90. Default is zero.</li>
+     *  </ul></li>
+     * <li><b>majorGridLines and minorGridLines</b> - An object defining the style of the style of the grid lines.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>zeroGridLine</b> - An object defining the style of the style of the zero grid line.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>majorTicks and minorTicks</b> - An object defining the style of the style of ticks in the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *      <li><b>length</b> - the length of each tick in pixels extending from the axis.</li>
+     *      <li><b>display</b> - how the ticks are drawn. Possible values are "none", "inside", "outside", and "cross".</li>
+     *  </ul></li></li>
+     * </ul>
+     */
+    extraStyle: null,
+
+    /**
+     * @cfg {Object} seriesStyles
+     * Contains styles to apply to the series after a refresh. Defaults to <tt>null</tt>.
+     */
+    seriesStyles: null,
+
+    /**
+     * @cfg {Boolean} disableCaching
+     * True to add a "cache buster" to the end of the chart url. Defaults to true for Opera and IE.
+     */
+    disableCaching: Ext.isIE || Ext.isOpera,
+    disableCacheParam: '_dc',
+
+    initComponent : function(){
+        Ext.chart.Chart.superclass.initComponent.call(this);
+        if(!this.url){
+            this.url = Ext.chart.Chart.CHART_URL;
+        }
+        if(this.disableCaching){
+            this.url = Ext.urlAppend(this.url, String.format('{0}={1}', this.disableCacheParam, new Date().getTime()));
+        }
+        this.addEvents(
+            'itemmouseover',
+            'itemmouseout',
+            'itemclick',
+            'itemdoubleclick',
+            'itemdragstart',
+            'itemdrag',
+            'itemdragend',
+            /**
+             * @event beforerefresh
+             * Fires before a refresh to the chart data is called.  If the beforerefresh handler returns
+             * <tt>false</tt> the {@link #refresh} action will be cancelled.
+             * @param {Chart} this
+             */
+            'beforerefresh',
+            /**
+             * @event refresh
+             * Fires after the chart data has been refreshed.
+             * @param {Chart} this
+             */
+            'refresh'
+        );
+        this.store = Ext.StoreMgr.lookup(this.store);
+    },
+
+    /**
+     * Sets a single style value on the Chart instance.
+     *
+     * @param name {String} Name of the Chart style value to change.
+     * @param value {Object} New value to pass to the Chart style.
+     */
+     setStyle: function(name, value){
+         this.swf.setStyle(name, Ext.encode(value));
+     },
+
+    /**
+     * Resets all styles on the Chart instance.
+     *
+     * @param styles {Object} Initializer for all Chart styles.
+     */
+    setStyles: function(styles){
+        this.swf.setStyles(Ext.encode(styles));
+    },
+
+    /**
+     * Sets the styles on all series in the Chart.
+     *
+     * @param styles {Array} Initializer for all Chart series styles.
+     */
+    setSeriesStyles: function(styles){
+        this.seriesStyles = styles;
+        var s = [];
+        Ext.each(styles, function(style){
+            s.push(Ext.encode(style));
+        });
+        this.swf.setSeriesStyles(s);
+    },
+
+    setCategoryNames : function(names){
+        this.swf.setCategoryNames(names);
+    },
+
+    setLegendRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.legendFnName);
+        chart.legendFnName = chart.createFnProxy(function(name){
+            return fn.call(scope, name);
+        });
+        chart.swf.setLegendLabelFunction(chart.legendFnName);
+    },
+
+    setTipRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.tipFnName);
+        chart.tipFnName = chart.createFnProxy(function(item, index, series){
+            var record = chart.store.getAt(index);
+            return fn.call(scope, chart, record, index, series);
+        });
+        chart.swf.setDataTipFunction(chart.tipFnName);
+    },
+
+    setSeries : function(series){
+        this.series = series;
+        this.refresh();
+    },
+
+    /**
+     * Changes the data store bound to this chart and refreshes it.
+     * @param {Store} store The store to bind to this chart
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("datachanged", this.refresh, this);
+                this.store.un("add", this.delayRefresh, this);
+                this.store.un("remove", this.delayRefresh, this);
+                this.store.un("update", this.delayRefresh, this);
+                this.store.un("clear", this.refresh, this);
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                datachanged: this.refresh,
+                add: this.delayRefresh,
+                remove: this.delayRefresh,
+                update: this.delayRefresh,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store && !initial){
+            this.refresh();
+        }
+    },
+
+    onSwfReady : function(isReset){
+        Ext.chart.Chart.superclass.onSwfReady.call(this, isReset);
+        var ref;
+        this.swf.setType(this.type);
+
+        if(this.chartStyle){
+            this.setStyles(Ext.apply({}, this.extraStyle, this.chartStyle));
+        }
+
+        if(this.categoryNames){
+            this.setCategoryNames(this.categoryNames);
+        }
+
+        if(this.tipRenderer){
+            ref = this.getFunctionRef(this.tipRenderer);
+            this.setTipRenderer(ref.fn, ref.scope);
+        }
+        if(this.legendRenderer){
+            ref = this.getFunctionRef(this.legendRenderer);
+            this.setLegendRenderer(ref.fn, ref.scope);
+        }
+        if(!isReset){
+            this.bindStore(this.store, true);
+        }
+        this.refresh.defer(10, this);
+    },
+
+    delayRefresh : function(){
+        if(!this.refreshTask){
+            this.refreshTask = new Ext.util.DelayedTask(this.refresh, this);
+        }
+        this.refreshTask.delay(this.refreshBuffer);
+    },
+
+    refresh : function(){
+        if(this.fireEvent('beforerefresh', this) !== false){
+            var styleChanged = false;
+            // convert the store data into something YUI charts can understand
+            var data = [], rs = this.store.data.items;
+            for(var j = 0, len = rs.length; j < len; j++){
+                data[j] = rs[j].data;
+            }
+            //make a copy of the series definitions so that we aren't
+            //editing them directly.
+            var dataProvider = [];
+            var seriesCount = 0;
+            var currentSeries = null;
+            var i = 0;
+            if(this.series){
+                seriesCount = this.series.length;
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = this.series[i];
+                    var clonedSeries = {};
+                    for(var prop in currentSeries){
+                        if(prop == "style" && currentSeries.style !== null){
+                            clonedSeries.style = Ext.encode(currentSeries.style);
+                            styleChanged = true;
+                            //we don't want to modify the styles again next time
+                            //so null out the style property.
+                            // this causes issues
+                            // currentSeries.style = null;
+                        } else{
+                            clonedSeries[prop] = currentSeries[prop];
+                        }
+                    }
+                    dataProvider.push(clonedSeries);
+                }
+            }
+
+            if(seriesCount > 0){
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = dataProvider[i];
+                    if(!currentSeries.type){
+                        currentSeries.type = this.type;
+                    }
+                    currentSeries.dataProvider = data;
+                }
+            } else{
+                dataProvider.push({type: this.type, dataProvider: data});
+            }
+            this.swf.setDataProvider(dataProvider);
+            if(this.seriesStyles){
+                this.setSeriesStyles(this.seriesStyles);
+            }
+            this.fireEvent('refresh', this);
+        }
+    },
+
+    // private
+    createFnProxy : function(fn){
+        var fnName = 'extFnProxy' + (++Ext.chart.Chart.PROXY_FN_ID);
+        Ext.chart.Chart.proxyFunction[fnName] = fn;
+        return 'Ext.chart.Chart.proxyFunction.' + fnName;
+    },
+
+    // private
+    removeFnProxy : function(fn){
+        if(!Ext.isEmpty(fn)){
+            fn = fn.replace('Ext.chart.Chart.proxyFunction.', '');
+            delete Ext.chart.Chart.proxyFunction[fn];
+        }
+    },
+
+    // private
+    getFunctionRef : function(val){
+        if(Ext.isFunction(val)){
+            return {
+                fn: val,
+                scope: this
+            };
+        }else{
+            return {
+                fn: val.fn,
+                scope: val.scope || this
+            };
+        }
+    },
+
+    // private
+    onDestroy: function(){
+        if (this.refreshTask && this.refreshTask.cancel){
+            this.refreshTask.cancel();
+        }
+        Ext.chart.Chart.superclass.onDestroy.call(this);
+        this.bindStore(null);
+        this.removeFnProxy(this.tipFnName);
+        this.removeFnProxy(this.legendFnName);
+    }
+});
+Ext.reg('chart', Ext.chart.Chart);
+Ext.chart.Chart.PROXY_FN_ID = 0;
+Ext.chart.Chart.proxyFunction = {};
+
+/**
+ * Sets the url to load the chart from. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf';
+
+/**
+ * @class Ext.chart.PieChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype piechart
+ */
+Ext.chart.PieChart = Ext.extend(Ext.chart.Chart, {
+    type: 'pie',
+
+    onSwfReady : function(isReset){
+        Ext.chart.PieChart.superclass.onSwfReady.call(this, isReset);
+
+        this.setDataField(this.dataField);
+        this.setCategoryField(this.categoryField);
+    },
+
+    setDataField : function(field){
+        this.dataField = field;
+        this.swf.setDataField(field);
+    },
+
+    setCategoryField : function(field){
+        this.categoryField = field;
+        this.swf.setCategoryField(field);
+    }
+});
+Ext.reg('piechart', Ext.chart.PieChart);
+
+/**
+ * @class Ext.chart.CartesianChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype cartesianchart
+ */
+Ext.chart.CartesianChart = Ext.extend(Ext.chart.Chart, {
+    onSwfReady : function(isReset){
+        Ext.chart.CartesianChart.superclass.onSwfReady.call(this, isReset);
+        this.labelFn = [];
+        if(this.xField){
+            this.setXField(this.xField);
+        }
+        if(this.yField){
+            this.setYField(this.yField);
+        }
+        if(this.xAxis){
+            this.setXAxis(this.xAxis);
+        }
+        if(this.xAxes){
+            this.setXAxes(this.xAxes);
+        }
+        if(this.yAxis){
+            this.setYAxis(this.yAxis);
+        }
+        if(this.yAxes){
+            this.setYAxes(this.yAxes);
+        }
+        if(Ext.isDefined(this.constrainViewport)){
+            this.swf.setConstrainViewport(this.constrainViewport);
+        }
+    },
+
+    setXField : function(value){
+        this.xField = value;
+        this.swf.setHorizontalField(value);
+    },
+
+    setYField : function(value){
+        this.yField = value;
+        this.swf.setVerticalField(value);
+    },
+
+    setXAxis : function(value){
+        this.xAxis = this.createAxis('xAxis', value);
+        this.swf.setHorizontalAxis(this.xAxis);
+    },
+
+    setXAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('xAxis' + i, value[i]);
+            this.swf.setHorizontalAxis(axis);
+        }
+    },
+
+    setYAxis : function(value){
+        this.yAxis = this.createAxis('yAxis', value);
+        this.swf.setVerticalAxis(this.yAxis);
+    },
+
+    setYAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('yAxis' + i, value[i]);
+            this.swf.setVerticalAxis(axis);
+        }
+    },
+
+    createAxis : function(axis, value){
+        var o = Ext.apply({}, value),
+            ref,
+            old;
+
+        if(this[axis]){
+            old = this[axis].labelFunction;
+            this.removeFnProxy(old);
+            this.labelFn.remove(old);
+        }
+        if(o.labelRenderer){
+            ref = this.getFunctionRef(o.labelRenderer);
+            o.labelFunction = this.createFnProxy(function(v){
+                return ref.fn.call(ref.scope, v);
+            });
+            delete o.labelRenderer;
+            this.labelFn.push(o.labelFunction);
+        }
+        if(axis.indexOf('xAxis') > -1 && o.position == 'left'){
+            o.position = 'bottom';
+        }
+        return o;
+    },
+
+    onDestroy : function(){
+        Ext.chart.CartesianChart.superclass.onDestroy.call(this);
+        Ext.each(this.labelFn, function(fn){
+            this.removeFnProxy(fn);
+        }, this);
+    }
+});
+Ext.reg('cartesianchart', Ext.chart.CartesianChart);
+
+/**
+ * @class Ext.chart.LineChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype linechart
+ */
+Ext.chart.LineChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'line'
+});
+Ext.reg('linechart', Ext.chart.LineChart);
+
+/**
+ * @class Ext.chart.ColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype columnchart
+ */
+Ext.chart.ColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'column'
+});
+Ext.reg('columnchart', Ext.chart.ColumnChart);
+
+/**
+ * @class Ext.chart.StackedColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedcolumnchart
+ */
+Ext.chart.StackedColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackcolumn'
+});
+Ext.reg('stackedcolumnchart', Ext.chart.StackedColumnChart);
+
+/**
+ * @class Ext.chart.BarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype barchart
+ */
+Ext.chart.BarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'bar'
+});
+Ext.reg('barchart', Ext.chart.BarChart);
+
+/**
+ * @class Ext.chart.StackedBarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedbarchart
+ */
+Ext.chart.StackedBarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackbar'
+});
+Ext.reg('stackedbarchart', Ext.chart.StackedBarChart);
+
+
+
+/**
+ * @class Ext.chart.Axis
+ * Defines a CartesianChart's vertical or horizontal axis.
+ * @constructor
+ */
+Ext.chart.Axis = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.chart.Axis.prototype =
+{
+    /**
+     * The type of axis.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The direction in which the axis is drawn. May be "horizontal" or "vertical".
+     *
+     * @property orientation
+     * @type String
+     */
+    orientation: "horizontal",
+
+    /**
+     * If true, the items on the axis will be drawn in opposite direction.
+     *
+     * @property reverse
+     * @type Boolean
+     */
+    reverse: false,
+
+    /**
+     * A string reference to the globally-accessible function that may be called to
+     * determine each of the label values for this axis.
+     *
+     * @property labelFunction
+     * @type String
+     */
+    labelFunction: null,
+
+    /**
+     * If true, labels that overlap previously drawn labels on the axis will be hidden.
+     *
+     * @property hideOverlappingLabels
+     * @type Boolean
+     */
+    hideOverlappingLabels: true,
+
+    /**
+     * The space, in pixels, between labels on an axis.
+     *
+     * @property labelSpacing
+     * @type Number
+     */
+    labelSpacing: 2
+};
+
+/**
+ * @class Ext.chart.NumericAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in numeric values.
+ * @constructor
+ */
+Ext.chart.NumericAxis = Ext.extend(Ext.chart.Axis, {
+    type: "numeric",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Number
+     */
+    minimum: NaN,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: NaN,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property minorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * If true, and the bounds are calculated automatically, either the minimum
+     * or maximum will be set to zero.
+     *
+     * @property alwaysShowZero
+     * @type Boolean
+     */
+    alwaysShowZero: true,
+
+    /**
+     * The scaling algorithm to use on this axis. May be "linear" or
+     * "logarithmic".
+     *
+     * @property scale
+     * @type String
+     */
+    scale: "linear",
+
+    /**
+     * Indicates whether to round the major unit.
+     *
+     * @property roundMajorUnit
+     * @type Boolean
+     */
+    roundMajorUnit: true,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true,
+
+    /**
+     * Indicates the position of the axis relative to the chart
+     *
+     * @property position
+     * @type String
+     */
+    position: 'left',
+
+    /**
+     * Indicates whether to extend maximum beyond data's maximum to the nearest
+     * majorUnit.
+     *
+     * @property adjustMaximumByMajorUnit
+     * @type Boolean
+     */
+    adjustMaximumByMajorUnit: true,
+
+    /**
+     * Indicates whether to extend the minimum beyond data's minimum to the
+     * nearest majorUnit.
+     *
+     * @property adjustMinimumByMajorUnit
+     * @type Boolean
+     */
+    adjustMinimumByMajorUnit: true
+
+});
+
+/**
+ * @class Ext.chart.TimeAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in time-based values.
+ * @constructor
+ */
+Ext.chart.TimeAxis = Ext.extend(Ext.chart.Axis, {
+    type: "time",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Date
+     */
+    minimum: null,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: null,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The time unit used by the majorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    majorTimeUnit: null,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * The time unit used by the minorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    minorTimeUnit: null,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * Series that are stackable will only stack when this value is set to true.
+     *
+     * @property stackingEnabled
+     * @type Boolean
+     */
+    stackingEnabled: false,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true
+
+});
+
+/**
+ * @class Ext.chart.CategoryAxis
+ * @extends Ext.chart.Axis
+ * A type of axis that displays items in categories.
+ * @constructor
+ */
+Ext.chart.CategoryAxis = Ext.extend(Ext.chart.Axis, {
+    type: "category",
+
+    /**
+     * A list of category names to display along this axis.
+     *
+     * @property categoryNames
+     * @type Array
+     */
+    categoryNames: null,
+
+    /**
+     * Indicates whether or not to calculate the number of categories (ticks and
+     * labels) when there is not enough room to display all labels on the axis.
+     * If set to true, the axis will determine the number of categories to plot.
+     * If not, all categories will be plotted.
+     *
+     * @property calculateCategoryCount
+     * @type Boolean
+     */
+    calculateCategoryCount: false
+
+});
+
+/**
+ * @class Ext.chart.Series
+ * Series class for the charts widget.
+ * @constructor
+ */
+Ext.chart.Series = function(config) { Ext.apply(this, config); };
+
+Ext.chart.Series.prototype =
+{
+    /**
+     * The type of series.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The human-readable name of the series.
+     *
+     * @property displayName
+     * @type String
+     */
+    displayName: null
+};
+
+/**
+ * @class Ext.chart.CartesianSeries
+ * @extends Ext.chart.Series
+ * CartesianSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.CartesianSeries = Ext.extend(Ext.chart.Series, {
+    /**
+     * The field used to access the x-axis value from the items from the data
+     * source.
+     *
+     * @property xField
+     * @type String
+     */
+    xField: null,
+
+    /**
+     * The field used to access the y-axis value from the items from the data
+     * source.
+     *
+     * @property yField
+     * @type String
+     */
+    yField: null,
+
+    /**
+     * False to not show this series in the legend. Defaults to <tt>true</tt>.
+     *
+     * @property showInLegend
+     * @type Boolean
+     */
+    showInLegend: true,
+
+    /**
+     * Indicates which axis the series will bind to
+     *
+     * @property axis
+     * @type String
+     */
+    axis: 'primary'
+});
+
+/**
+ * @class Ext.chart.ColumnSeries
+ * @extends Ext.chart.CartesianSeries
+ * ColumnSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.ColumnSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "column"
+});
+
+/**
+ * @class Ext.chart.LineSeries
+ * @extends Ext.chart.CartesianSeries
+ * LineSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.LineSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "line"
+});
+
+/**
+ * @class Ext.chart.BarSeries
+ * @extends Ext.chart.CartesianSeries
+ * BarSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.BarSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "bar"
+});
+
+
+/**
+ * @class Ext.chart.PieSeries
+ * @extends Ext.chart.Series
+ * PieSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.PieSeries = Ext.extend(Ext.chart.Series, {
+    type: "pie",
+    dataField: null,
+    categoryField: null
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-forms-debug.js	(revision 76)
@@ -0,0 +1,9237 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Field
+ * @extends Ext.BoxComponent
+ * Base class for form fields that provides default event handling, sizing, value handling and other functionality.
+ * @constructor
+ * Creates a new Field
+ * @param {Object} config Configuration options
+ * @xtype field
+ */
+Ext.form.Field = Ext.extend(Ext.BoxComponent,  {
+    /**
+     * <p>The label Element associated with this Field. <b>Only available after this Field has been rendered by a
+     * {@link form Ext.layout.FormLayout} layout manager.</b></p>
+     * @type Ext.Element
+     * @property label
+     */
+    /**
+     * @cfg {String} inputType The type attribute for input fields -- e.g. radio, text, password, file (defaults
+     * to 'text'). The types 'file' and 'password' must be used to render those field types currently -- there are
+     * no separate Ext components for those. Note that if you use <tt>inputType:'file'</tt>, {@link #emptyText}
+     * is not supported and should be avoided.
+     */
+    /**
+     * @cfg {Number} tabIndex The tabIndex for this field. Note this only applies to fields that are rendered,
+     * not those which are built via applyTo (defaults to undefined).
+     */
+    /**
+     * @cfg {Mixed} value A value to initialize this field with (defaults to undefined).
+     */
+    /**
+     * @cfg {String} name The field's HTML name attribute (defaults to '').
+     * <b>Note</b>: this property must be set if this field is to be automatically included with
+     * {@link Ext.form.BasicForm#submit form submit()}.
+     */
+    /**
+     * @cfg {String} cls A custom CSS class to apply to the field's underlying element (defaults to '').
+     */
+
+    /**
+     * @cfg {String} invalidClass The CSS class to use when marking a field invalid (defaults to 'x-form-invalid')
+     */
+    invalidClass : 'x-form-invalid',
+    /**
+     * @cfg {String} invalidText The error text to use when marking a field invalid and no message is provided
+     * (defaults to 'The value in this field is invalid')
+     */
+    invalidText : 'The value in this field is invalid',
+    /**
+     * @cfg {String} focusClass The CSS class to use when the field receives focus (defaults to 'x-form-focus')
+     */
+    focusClass : 'x-form-focus',
+    /**
+     * @cfg {Boolean} preventMark
+     * <tt>true</tt> to disable {@link #markInvalid marking the field invalid}.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String/Boolean} validationEvent The event that should initiate field validation. Set to false to disable
+      automatic validation (defaults to 'keyup').
+     */
+    validationEvent : 'keyup',
+    /**
+     * @cfg {Boolean} validateOnBlur Whether the field should validate when it loses focus (defaults to true).
+     */
+    validateOnBlur : true,
+    /**
+     * @cfg {Number} validationDelay The length of time in milliseconds after user input begins until validation
+     * is initiated (defaults to 250)
+     */
+    validationDelay : 250,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: 'input', type: 'text', size: '20', autocomplete: 'off'}</code></pre>
+     */
+    defaultAutoCreate : {tag: 'input', type: 'text', size: '20', autocomplete: 'off'},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {String} msgTarget <p>The location where the message text set through {@link #markInvalid} should display.
+     * Must be one of the following values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>qtip</code> Display a quick tip containing the message when the user hovers over the field. This is the default.
+     * <div class="subdesc"><b>{@link Ext.QuickTips#init Ext.QuickTips.init} must have been called for this setting to work.</b></div</li>
+     * <li><code>title</code> Display the message in a default browser title attribute popup.</li>
+     * <li><code>under</code> Add a block div beneath the field containing the error message.</li>
+     * <li><code>side</code> Add an error icon to the right of the field, displaying the message in a popup on hover.</li>
+     * <li><code>[element id]</code> Add the error message directly to the innerHTML of the specified element.</li>
+     * </ul></div>
+     */
+    msgTarget : 'qtip',
+    /**
+     * @cfg {String} msgFx <b>Experimental</b> The effect used when displaying a validation message under the field
+     * (defaults to 'normal').
+     */
+    msgFx : 'normal',
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to mark the field as readOnly in HTML
+     * (defaults to <tt>false</tt>).
+     * <br><p><b>Note</b>: this only sets the element's readOnly DOM attribute.
+     * Setting <code>readOnly=true</code>, for example, will not disable triggering a
+     * ComboBox or DateField; it gives you the option of forcing the user to choose
+     * via the trigger without typing in the text box. To hide the trigger use
+     * <code>{@link Ext.form.TriggerField#hideTrigger hideTrigger}</code>.</p>
+     */
+    readOnly : false,
+    /**
+     * @cfg {Boolean} disabled True to disable the field (defaults to false).
+     * <p>Be aware that conformant with the <a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.12.1">HTML specification</a>,
+     * disabled Fields will not be {@link Ext.form.BasicForm#submit submitted}.</p>
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * Defaults to <tt>true</tt>.
+     */
+    submitValue: true,
+
+    // private
+    isFormField : true,
+
+    // private
+    msgDisplay: '',
+
+    // private
+    hasFocus : false,
+
+    // private
+    initComponent : function(){
+        Ext.form.Field.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event focus
+             * Fires when this field receives input focus.
+             * @param {Ext.form.Field} this
+             */
+            'focus',
+            /**
+             * @event blur
+             * Fires when this field loses input focus.
+             * @param {Ext.form.Field} this
+             */
+            'blur',
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.
+             * To handle other keys see {@link Ext.Panel#keys} or {@link Ext.KeyMap}.
+             * You can check {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * For example: <pre><code>
+var form = new Ext.form.FormPanel({
+    ...
+    items: [{
+            fieldLabel: 'Field 1',
+            name: 'field1',
+            allowBlank: false
+        },{
+            fieldLabel: 'Field 2',
+            name: 'field2',
+            listeners: {
+                specialkey: function(field, e){
+                    // e.HOME, e.END, e.PAGE_UP, e.PAGE_DOWN,
+                    // e.TAB, e.ESC, arrow keys: e.LEFT, e.RIGHT, e.UP, e.DOWN
+                    if (e.{@link Ext.EventObject#getKey getKey()} == e.ENTER) {
+                        var form = field.ownerCt.getForm();
+                        form.submit();
+                    }
+                }
+            }
+        }
+    ],
+    ...
+});
+             * </code></pre>
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            'specialkey',
+            /**
+             * @event change
+             * Fires just before the field blurs if the field value has changed.
+             * @param {Ext.form.Field} this
+             * @param {Mixed} newValue The new value
+             * @param {Mixed} oldValue The original value
+             */
+            'change',
+            /**
+             * @event invalid
+             * Fires after the field has been marked as invalid.
+             * @param {Ext.form.Field} this
+             * @param {String} msg The validation message
+             */
+            'invalid',
+            /**
+             * @event valid
+             * Fires after the field has been validated with no errors.
+             * @param {Ext.form.Field} this
+             */
+            'valid'
+        );
+    },
+
+    /**
+     * Returns the {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     * attribute of the field if available.
+     * @return {String} name The field {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     */
+    getName : function(){
+        return this.rendered && this.el.dom.name ? this.el.dom.name : this.name || this.id || '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var cfg = this.getAutoCreate();
+
+            if(!cfg.name){
+                cfg.name = this.name || this.id;
+            }
+            if(this.inputType){
+                cfg.type = this.inputType;
+            }
+            this.autoEl = cfg;
+        }
+        Ext.form.Field.superclass.onRender.call(this, ct, position);
+        if(this.submitValue === false){
+            this.el.dom.removeAttribute('name');
+        }
+        var type = this.el.dom.type;
+        if(type){
+            if(type == 'password'){
+                type = 'text';
+            }
+            this.el.addClass('x-form-'+type);
+        }
+        if(this.readOnly){
+            this.setReadOnly(true);
+        }
+        if(this.tabIndex !== undefined){
+            this.el.dom.setAttribute('tabIndex', this.tabIndex);
+        }
+
+        this.el.addClass([this.fieldClass, this.cls]);
+    },
+
+    // private
+    getItemCt : function(){
+        return this.itemCt;
+    },
+
+    // private
+    initValue : function(){
+        if(this.value !== undefined){
+            this.setValue(this.value);
+        }else if(!Ext.isEmpty(this.el.dom.value) && this.el.dom.value != this.emptyText){
+            this.setValue(this.el.dom.value);
+        }
+        /**
+         * The original value of the field as configured in the {@link #value} configuration, or
+         * as loaded by the last form load operation if the form's {@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+         * setting is <code>true</code>.
+         * @type mixed
+         * @property originalValue
+         */
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * <p>Returns true if the value of this Field has been changed from its original value.
+     * Will return false if the field is disabled or has not been rendered yet.</p>
+     * <p>Note that if the owning {@link Ext.form.BasicForm form} was configured with
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     * then the <i>original value</i> is updated when the values are loaded by
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#setValues setValues}.</p>
+     * @return {Boolean} True if this field has been changed from its original value (and
+     * is not disabled), false otherwise.
+     */
+    isDirty : function() {
+        if(this.disabled || !this.rendered) {
+            return false;
+        }
+        return String(this.getValue()) !== String(this.originalValue);
+    },
+
+    /**
+     * Sets the read only state of this field.
+     * @param {Boolean} readOnly Whether the field should be read only.
+     */
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.el.dom.readOnly = readOnly;
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.form.Field.superclass.afterRender.call(this);
+        this.initEvents();
+        this.initValue();
+    },
+
+    // private
+    fireKey : function(e){
+        if(e.isSpecialKey()){
+            this.fireEvent('specialkey', this, e);
+        }
+    },
+
+    /**
+     * Resets the current field value to the originally loaded value and clears any validation messages.
+     * See {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     */
+    reset : function(){
+        this.setValue(this.originalValue);
+        this.clearInvalid();
+    },
+
+    // private
+    initEvents : function(){
+        this.mon(this.el, Ext.EventManager.getKeyEvent(), this.fireKey,  this);
+        this.mon(this.el, 'focus', this.onFocus, this);
+
+        // standardise buffer across all browsers + OS-es for consistent event order.
+        // (the 10ms buffer for Editors fixes a weird FF/Win editor issue when changing OS window focus)
+        this.mon(this.el, 'blur', this.onBlur, this, this.inEditor ? {buffer:10} : null);
+    },
+
+    // private
+    preFocus: Ext.emptyFn,
+
+    // private
+    onFocus : function(){
+        this.preFocus();
+        if(this.focusClass){
+            this.el.addClass(this.focusClass);
+        }
+        if(!this.hasFocus){
+            this.hasFocus = true;
+            /**
+             * <p>The value that the Field had at the time it was last focused. This is the value that is passed
+             * to the {@link #change} event which is fired if the value has been changed when the Field is blurred.</p>
+             * <p><b>This will be undefined until the Field has been visited.</b> Compare {@link #originalValue}.</p>
+             * @type mixed
+             * @property startValue
+             */
+            this.startValue = this.getValue();
+            this.fireEvent('focus', this);
+        }
+    },
+
+    // private
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    onBlur : function(){
+        this.beforeBlur();
+        if(this.focusClass){
+            this.el.removeClass(this.focusClass);
+        }
+        this.hasFocus = false;
+        if(this.validationEvent !== false && (this.validateOnBlur || this.validationEvent == 'blur')){
+            this.validate();
+        }
+        var v = this.getValue();
+        if(String(v) !== String(this.startValue)){
+            this.fireEvent('change', this, v, this.startValue);
+        }
+        this.fireEvent('blur', this);
+        this.postBlur();
+    },
+
+    // private
+    postBlur : Ext.emptyFn,
+
+    /**
+     * Returns whether or not the field value is currently valid by
+     * {@link #validateValue validating} the {@link #processValue processed value}
+     * of the field. <b>Note</b>: {@link #disabled} fields are ignored.
+     * @param {Boolean} preventMark True to disable marking the field invalid
+     * @return {Boolean} True if the value is valid, else false
+     */
+    isValid : function(preventMark){
+        if(this.disabled){
+            return true;
+        }
+        var restore = this.preventMark;
+        this.preventMark = preventMark === true;
+        var v = this.validateValue(this.processValue(this.getRawValue()), preventMark);
+        this.preventMark = restore;
+        return v;
+    },
+
+    /**
+     * Validates the field value
+     * @return {Boolean} True if the value is valid, else false
+     */
+    validate : function(){
+        if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){
+            this.clearInvalid();
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * This method should only be overridden if necessary to prepare raw values
+     * for validation (see {@link #validate} and {@link #isValid}).  This method
+     * is expected to return the processed value for the field which will
+     * be used for validation (see validateValue method).
+     * @param {Mixed} value
+     */
+    processValue : function(value){
+        return value;
+    },
+
+    /**
+     * Uses getErrors to build an array of validation errors. If any errors are found, markInvalid is called
+     * with the first and false is returned, otherwise true is returned. Previously, subclasses were invited
+     * to provide an implementation of this to process validations - from 3.2 onwards getErrors should be
+     * overridden instead.
+     * @param {Mixed} The current value of the field
+     * @return {Boolean} True if all validations passed, false if one or more failed
+     */
+     validateValue : function(value) {
+         //currently, we only show 1 error at a time for a field, so just use the first one
+         var error = this.getErrors(value)[0];
+
+         if (error == undefined) {
+             return true;
+         } else {
+             this.markInvalid(error);
+             return false;
+         }
+     },
+    
+    /**
+     * Runs this field's validators and returns an array of error messages for any validation failures.
+     * This is called internally during validation and would not usually need to be used manually.
+     * Each subclass should override or augment the return value to provide their own errors
+     * @return {Array} All error messages for this field
+     */
+    getErrors: function() {
+        return [];
+    },
+
+    /**
+     * Gets the active error message for this field.
+     * @return {String} Returns the active error message on the field, if there is no error, an empty string is returned.
+     */
+    getActiveError : function(){
+        return this.activeError || '';
+    },
+
+    /**
+     * <p>Display an error message associated with this field, using {@link #msgTarget} to determine how to
+     * display the message and applying {@link #invalidClass} to the field's UI element.</p>
+     * <p><b>Note</b>: this method does not cause the Field's {@link #validate} method to return <code>false</code>
+     * if the value does <i>pass</i> validation. So simply marking a Field as invalid will not prevent
+     * submission of forms submitted with the {@link Ext.form.Action.Submit#clientValidation} option set.</p>
+     * {@link #isValid invalid}.
+     * @param {String} msg (optional) The validation message (defaults to {@link #invalidText})
+     */
+    markInvalid : function(msg){
+        //don't set the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            msg = msg || this.invalidText;
+
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.mark(this, msg);
+            }else if(this.msgTarget){
+                this.el.addClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = msg;
+                    t.style.display = this.msgDisplay;
+                }
+            }
+        }
+        
+        this.setActiveError(msg);
+    },
+    
+    /**
+     * Clear any invalid styles/messages for this field
+     */
+    clearInvalid : function(){
+        //don't remove the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            this.el.removeClass(this.invalidClass);
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.clear(this);
+            }else if(this.msgTarget){
+                this.el.removeClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = '';
+                    t.style.display = 'none';
+                }
+            }
+        }
+        
+        this.unsetActiveError();
+    },
+
+    /**
+     * Sets the current activeError to the given string. Fires the 'invalid' event.
+     * This does not set up the error icon, only sets the message and fires the event. To show the error icon,
+     * use markInvalid instead, which calls this method internally
+     * @param {String} msg The error message
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    setActiveError: function(msg, suppressEvent) {
+        this.activeError = msg;
+        if (suppressEvent !== true) this.fireEvent('invalid', this, msg);
+    },
+    
+    /**
+     * Clears the activeError and fires the 'valid' event. This is called internally by clearInvalid and would not
+     * usually need to be called manually
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    unsetActiveError: function(suppressEvent) {
+        delete this.activeError;
+        if (suppressEvent !== true) this.fireEvent('valid', this);
+    },
+
+    // private
+    getMessageHandler : function(){
+        return Ext.form.MessageTargets[this.msgTarget];
+    },
+
+    // private
+    getErrorCt : function(){
+        return this.el.findParent('.x-form-element', 5, true) || // use form element wrap if available
+            this.el.findParent('.x-form-field-wrap', 5, true);   // else direct field wrap
+    },
+
+    // Alignment for 'under' target
+    alignErrorEl : function(){
+        this.errorEl.setWidth(this.getErrorCt().getWidth(true) - 20);
+    },
+
+    // Alignment for 'side' target
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.el, 'tl-tr', [2, 0]);
+    },
+
+    /**
+     * Returns the raw data value which may or may not be a valid, defined value.  To return a normalized value see {@link #getValue}.
+     * @return {Mixed} value The field value
+     */
+    getRawValue : function(){
+        var v = this.rendered ? this.el.getValue() : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
+     * @return {Mixed} value The field value
+     */
+    getValue : function(){
+        if(!this.rendered) {
+            return this.value;
+        }
+        var v = this.el.getValue();
+        if(v === this.emptyText || v === undefined){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Sets the underlying DOM field's value directly, bypassing validation.  To set the value with validation see {@link #setValue}.
+     * @param {Mixed} value The value to set
+     * @return {Mixed} value The field value that is set
+     */
+    setRawValue : function(v){
+        return this.rendered ? (this.el.dom.value = (Ext.isEmpty(v) ? '' : v)) : '';
+    },
+
+    /**
+     * Sets a data value into the field and validates it.  To set the value directly without validation see {@link #setRawValue}.
+     * @param {Mixed} value The value to set
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        this.value = v;
+        if(this.rendered){
+            this.el.dom.value = (Ext.isEmpty(v) ? '' : v);
+            this.validate();
+        }
+        return this;
+    },
+
+    // private, does not work for all fields
+    append : function(v){
+         this.setValue([this.getValue(), v].join(''));
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+
+Ext.form.MessageTargets = {
+    'qtip' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.qtip = msg;
+            field.el.dom.qclass = 'x-form-invalid-tip';
+            if(Ext.QuickTips){ // fix for floating editors interacting with DND
+                Ext.QuickTips.enable();
+            }
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            field.el.dom.qtip = '';
+        }
+    },
+    'title' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.title = msg;
+        },
+        clear: function(field){
+            field.el.dom.title = '';
+        }
+    },
+    'under' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorEl){
+                var elp = field.getErrorCt();
+                if(!elp){ // field has no container el
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorEl = elp.createChild({cls:'x-form-invalid-msg'});
+                field.on('resize', field.alignErrorEl, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorEl);
+                }, field);
+            }
+            field.alignErrorEl();
+            field.errorEl.update(msg);
+            Ext.form.Field.msgFx[field.msgFx].show(field.errorEl, field);
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorEl){
+                Ext.form.Field.msgFx[field.msgFx].hide(field.errorEl, field);
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    },
+    'side' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorIcon){
+                var elp = field.getErrorCt();
+                // field has no container el
+                if(!elp){
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});
+                if (field.ownerCt) {
+                    field.ownerCt.on('afterlayout', field.alignErrorIcon, field);
+                    field.ownerCt.on('expand', field.alignErrorIcon, field);
+                }
+                field.on('resize', field.alignErrorIcon, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorIcon);
+                }, field);
+            }
+            field.alignErrorIcon();
+            field.errorIcon.dom.qtip = msg;
+            field.errorIcon.dom.qclass = 'x-form-invalid-tip';
+            field.errorIcon.show();
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorIcon){
+                field.errorIcon.dom.qtip = '';
+                field.errorIcon.hide();
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    }
+};
+
+// anything other than normal should be considered experimental
+Ext.form.Field.msgFx = {
+    normal : {
+        show: function(msgEl, f){
+            msgEl.setDisplayed('block');
+        },
+
+        hide : function(msgEl, f){
+            msgEl.setDisplayed(false).update('');
+        }
+    },
+
+    slide : {
+        show: function(msgEl, f){
+            msgEl.slideIn('t', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('t', {stopFx:true,useDisplay:true});
+        }
+    },
+
+    slideRight : {
+        show: function(msgEl, f){
+            msgEl.fixDisplay();
+            msgEl.alignTo(f.el, 'tl-tr');
+            msgEl.slideIn('l', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('l', {stopFx:true,useDisplay:true});
+        }
+    }
+};
+Ext.reg('field', Ext.form.Field);
+/**
+ * @class Ext.form.TextField
+ * @extends Ext.form.Field
+ * <p>Basic text field.  Can be used as a direct replacement for traditional text inputs,
+ * or as the base class for more sophisticated input controls (like {@link Ext.form.TextArea}
+ * and {@link Ext.form.ComboBox}).</p>
+ * <p><b><u>Validation</u></b></p>
+ * <p>The validation procedure is described in the documentation for {@link #validateValue}.</p>
+ * <p><b><u>Alter Validation Behavior</u></b></p>
+ * <p>Validation behavior for each field can be configured:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.form.TextField#invalidText invalidText}</code> : the default validation message to
+ * show if any validation step above does not provide a message when invalid</li>
+ * <li><code>{@link Ext.form.TextField#maskRe maskRe}</code> : filter out keystrokes before any validation occurs</li>
+ * <li><code>{@link Ext.form.TextField#stripCharsRe stripCharsRe}</code> : filter characters after being typed in,
+ * but before being validated</li>
+ * <li><code>{@link Ext.form.Field#invalidClass invalidClass}</code> : alternate style when invalid</li>
+ * <li><code>{@link Ext.form.Field#validateOnBlur validateOnBlur}</code>,
+ * <code>{@link Ext.form.Field#validationDelay validationDelay}</code>, and
+ * <code>{@link Ext.form.Field#validationEvent validationEvent}</code> : modify how/when validation is triggered</li>
+ * </ul></div>
+ * 
+ * @constructor Creates a new TextField
+ * @param {Object} config Configuration options
+ * 
+ * @xtype textfield
+ */
+Ext.form.TextField = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} vtypeText A custom error message to display in place of the default message provided
+     * for the <b><code>{@link #vtype}</code></b> currently set for this field (defaults to <tt>''</tt>).  <b>Note</b>:
+     * only applies if <b><code>{@link #vtype}</code></b> is set, else ignored.
+     */
+    /**
+     * @cfg {RegExp} stripCharsRe A JavaScript RegExp object used to strip unwanted content from the value
+     * before validation (defaults to <tt>null</tt>).
+     */
+    /**
+     * @cfg {Boolean} grow <tt>true</tt> if this field should automatically grow and shrink to its content
+     * (defaults to <tt>false</tt>)
+     */
+    grow : false,
+    /**
+     * @cfg {Number} growMin The minimum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>30</tt>)
+     */
+    growMin : 30,
+    /**
+     * @cfg {Number} growMax The maximum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>800</tt>)
+     */
+    growMax : 800,
+    /**
+     * @cfg {String} vtype A validation type name as defined in {@link Ext.form.VTypes} (defaults to <tt>null</tt>)
+     */
+    vtype : null,
+    /**
+     * @cfg {RegExp} maskRe An input mask regular expression that will be used to filter keystrokes that do
+     * not match (defaults to <tt>null</tt>). The maskRe will not operate on any paste events.
+     */
+    maskRe : null,
+    /**
+     * @cfg {Boolean} disableKeyFilter Specify <tt>true</tt> to disable input keystroke filtering (defaults
+     * to <tt>false</tt>)
+     */
+    disableKeyFilter : false,
+    /**
+     * @cfg {Boolean} allowBlank Specify <tt>false</tt> to validate that the value's length is > 0 (defaults to
+     * <tt>true</tt>)
+     */
+    allowBlank : true,
+    /**
+     * @cfg {Number} minLength Minimum input field length required (defaults to <tt>0</tt>)
+     */
+    minLength : 0,
+    /**
+     * @cfg {Number} maxLength Maximum input field length allowed by validation (defaults to Number.MAX_VALUE).
+     * This behavior is intended to provide instant feedback to the user by improving usability to allow pasting
+     * and editing or overtyping and back tracking. To restrict the maximum number of characters that can be
+     * entered into the field use <tt><b>{@link Ext.form.Field#autoCreate autoCreate}</b></tt> to add
+     * any attributes you want to a field, for example:<pre><code>
+var myField = new Ext.form.NumberField({
+    id: 'mobile',
+    anchor:'90%',
+    fieldLabel: 'Mobile',
+    maxLength: 16, // for validation
+    autoCreate: {tag: 'input', type: 'text', size: '20', autocomplete: 'off', maxlength: '10'}
+});
+</code></pre>
+     */
+    maxLength : Number.MAX_VALUE,
+    /**
+     * @cfg {String} minLengthText Error text to display if the <b><tt>{@link #minLength minimum length}</tt></b>
+     * validation fails (defaults to <tt>'The minimum length for this field is {minLength}'</tt>)
+     */
+    minLengthText : 'The minimum length for this field is {0}',
+    /**
+     * @cfg {String} maxLengthText Error text to display if the <b><tt>{@link #maxLength maximum length}</tt></b>
+     * validation fails (defaults to <tt>'The maximum length for this field is {maxLength}'</tt>)
+     */
+    maxLengthText : 'The maximum length for this field is {0}',
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to automatically select any existing field text when the field
+     * receives input focus (defaults to <tt>false</tt>)
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} blankText The error text to display if the <b><tt>{@link #allowBlank}</tt></b> validation
+     * fails (defaults to <tt>'This field is required'</tt>)
+     */
+    blankText : 'This field is required',
+    /**
+     * @cfg {Function} validator
+     * <p>A custom validation function to be called during field validation ({@link #validateValue})
+     * (defaults to <tt>null</tt>). If specified, this function will be called first, allowing the
+     * developer to override the default validation process.</p>
+     * <br><p>This function will be passed the following Parameters:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>value</code>: <i>Mixed</i>
+     * <div class="sub-desc">The current field value</div></li>
+     * </ul></div>
+     * <br><p>This function is to Return:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>true</code>: <i>Boolean</i>
+     * <div class="sub-desc"><code>true</code> if the value is valid</div></li>
+     * <li><code>msg</code>: <i>String</i>
+     * <div class="sub-desc">An error message if the value is invalid</div></li>
+     * </ul></div>
+     */
+    validator : null,
+    /**
+     * @cfg {RegExp} regex A JavaScript RegExp object to be tested against the field value during validation
+     * (defaults to <tt>null</tt>). If the test fails, the field will be marked invalid using
+     * <b><tt>{@link #regexText}</tt></b>.
+     */
+    regex : null,
+    /**
+     * @cfg {String} regexText The error text to display if <b><tt>{@link #regex}</tt></b> is used and the
+     * test fails during validation (defaults to <tt>''</tt>)
+     */
+    regexText : '',
+    /**
+     * @cfg {String} emptyText The default text to place into an empty field (defaults to <tt>null</tt>).
+     * <b>Note</b>: that this value will be submitted to the server if this field is enabled and configured
+     * with a {@link #name}.
+     */
+    emptyText : null,
+    /**
+     * @cfg {String} emptyClass The CSS class to apply to an empty field to style the <b><tt>{@link #emptyText}</tt></b>
+     * (defaults to <tt>'x-form-empty-field'</tt>).  This class is automatically added and removed as needed
+     * depending on the current field value.
+     */
+    emptyClass : 'x-form-empty-field',
+
+    /**
+     * @cfg {Boolean} enableKeyEvents <tt>true</tt> to enable the proxying of key events for the HTML input
+     * field (defaults to <tt>false</tt>)
+     */
+
+    initComponent : function(){
+        Ext.form.TextField.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event autosize
+             * Fires when the <tt><b>{@link #autoSize}</b></tt> function is triggered. The field may or
+             * may not have actually changed size according to the default logic, but this event provides
+             * a hook for the developer to apply additional logic at runtime to resize the field if needed.
+             * @param {Ext.form.Field} this This text field
+             * @param {Number} width The new field width
+             */
+            'autosize',
+
+            /**
+             * @event keydown
+             * Keydown input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+            /**
+             * @event keyup
+             * Keyup input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keyup',
+            /**
+             * @event keypress
+             * Keypress input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keypress'
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.TextField.superclass.initEvents.call(this);
+        if(this.validationEvent == 'keyup'){
+            this.validationTask = new Ext.util.DelayedTask(this.validate, this);
+            this.mon(this.el, 'keyup', this.filterValidation, this);
+        }
+        else if(this.validationEvent !== false && this.validationEvent != 'blur'){
+        	this.mon(this.el, this.validationEvent, this.validate, this, {buffer: this.validationDelay});
+        }
+        if(this.selectOnFocus || this.emptyText){            
+            this.mon(this.el, 'mousedown', this.onMouseDown, this);
+            
+            if(this.emptyText){
+                this.applyEmptyText();
+            }
+        }
+        if(this.maskRe || (this.vtype && this.disableKeyFilter !== true && (this.maskRe = Ext.form.VTypes[this.vtype+'Mask']))){
+        	this.mon(this.el, 'keypress', this.filterKeys, this);
+        }
+        if(this.grow){
+        	this.mon(this.el, 'keyup', this.onKeyUpBuffered, this, {buffer: 50});
+			this.mon(this.el, 'click', this.autoSize, this);
+        }
+        if(this.enableKeyEvents){
+            this.mon(this.el, {
+                scope: this,
+                keyup: this.onKeyUp,
+                keydown: this.onKeyDown,
+                keypress: this.onKeyPress
+            });
+        }
+    },
+    
+    onMouseDown: function(e){
+        if(!this.hasFocus){
+            this.mon(this.el, 'mouseup', Ext.emptyFn, this, { single: true, preventDefault: true });
+        }
+    },
+
+    processValue : function(value){
+        if(this.stripCharsRe){
+            var newValue = value.replace(this.stripCharsRe, '');
+            if(newValue !== value){
+                this.setRawValue(newValue);
+                return newValue;
+            }
+        }
+        return value;
+    },
+
+    filterValidation : function(e){
+        if(!e.isNavKeyPress()){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+    
+    //private
+    onDisable: function(){
+        Ext.form.TextField.superclass.onDisable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = 'on';
+        }
+    },
+    
+    //private
+    onEnable: function(){
+        Ext.form.TextField.superclass.onEnable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = '';
+        }
+    },
+
+    // private
+    onKeyUpBuffered : function(e){
+        if(this.doAutoSize(e)){
+            this.autoSize();
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress();
+    },
+
+    // private
+    onKeyUp : function(e){
+        this.fireEvent('keyup', this, e);
+    },
+
+    // private
+    onKeyDown : function(e){
+        this.fireEvent('keydown', this, e);
+    },
+
+    // private
+    onKeyPress : function(e){
+        this.fireEvent('keypress', this, e);
+    },
+
+    /**
+     * Resets the current field value to the originally-loaded value and clears any validation messages.
+     * Also adds <tt><b>{@link #emptyText}</b></tt> and <tt><b>{@link #emptyClass}</b></tt> if the
+     * original value was blank.
+     */
+    reset : function(){
+        Ext.form.TextField.superclass.reset.call(this);
+        this.applyEmptyText();
+    },
+
+    applyEmptyText : function(){
+        if(this.rendered && this.emptyText && this.getRawValue().length < 1 && !this.hasFocus){
+            this.setRawValue(this.emptyText);
+            this.el.addClass(this.emptyClass);
+        }
+    },
+
+    // private
+    preFocus : function(){
+        var el = this.el,
+            isEmpty;
+        if(this.emptyText){
+            if(el.dom.value == this.emptyText){
+                this.setRawValue('');
+                isEmpty = true;
+            }
+            el.removeClass(this.emptyClass);
+        }
+        if(this.selectOnFocus || isEmpty){
+            el.dom.select();
+        }
+    },
+
+    // private
+    postBlur : function(){
+        this.applyEmptyText();
+    },
+
+    // private
+    filterKeys : function(e){
+        if(e.ctrlKey){
+            return;
+        }
+        var k = e.getKey();
+        if(Ext.isGecko && (e.isNavKeyPress() || k == e.BACKSPACE || (k == e.DELETE && e.button == -1))){
+            return;
+        }
+        var cc = String.fromCharCode(e.getCharCode());
+        if(!Ext.isGecko && e.isSpecialKey() && !cc){
+            return;
+        }
+        if(!this.maskRe.test(cc)){
+            e.stopEvent();
+        }
+    },
+
+    setValue : function(v){
+        if(this.emptyText && this.el && !Ext.isEmpty(v)){
+            this.el.removeClass(this.emptyClass);
+        }
+        Ext.form.TextField.superclass.setValue.apply(this, arguments);
+        this.applyEmptyText();
+        this.autoSize();
+        return this;
+    },
+
+    /**
+     * <p>Validates a value according to the field's validation rules and returns an array of errors
+     * for any failing validations. Validation rules are processed in the following order:</p>
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><b>1. Field specific validator</b>
+     * <div class="sub-desc">
+     * <p>A validator offers a way to customize and reuse a validation specification.
+     * If a field is configured with a <code>{@link #validator}</code>
+     * function, it will be passed the current field value.  The <code>{@link #validator}</code>
+     * function is expected to return either:
+     * <div class="mdetail-params"><ul>
+     * <li>Boolean <tt>true</tt> if the value is valid (validation continues).</li>
+     * <li>a String to represent the invalid message if invalid (validation halts).</li>
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>2. Basic Validation</b>
+     * <div class="sub-desc">
+     * <p>If the <code>{@link #validator}</code> has not halted validation,
+     * basic validation proceeds as follows:</p>
+     * 
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><code>{@link #allowBlank}</code> : (Invalid message =
+     * <code>{@link #emptyText}</code>)<div class="sub-desc">
+     * Depending on the configuration of <code>{@link #allowBlank}</code>, a
+     * blank field will cause validation to halt at this step and return
+     * Boolean true or false accordingly.  
+     * </div></li>
+     * 
+     * <li><code>{@link #minLength}</code> : (Invalid message =
+     * <code>{@link #minLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #minLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * <li><code>{@link #maxLength}</code> : (Invalid message =
+     * <code>{@link #maxLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #maxLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>3. Preconfigured Validation Types (VTypes)</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field
+     * configured with a <code>{@link #vtype}</code> will utilize the
+     * corresponding {@link Ext.form.VTypes VTypes} validation function.
+     * If invalid, either the field's <code>{@link #vtypeText}</code> or
+     * the VTypes vtype Text property will be used for the invalid message.
+     * Keystrokes on the field will be filtered according to the VTypes
+     * vtype Mask property.</p>
+     * </div></li>
+     * 
+     * <li><b>4. Field specific regex test</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field's
+     * configured <code>{@link #regex}</code> test will be processed.
+     * The invalid message for this test is configured with
+     * <code>{@link #regexText}</code>.</p>
+     * </div></li>
+     * 
+     * @param {Mixed} value The value to validate. The processed raw value will be used if nothing is passed
+     * @return {Array} Array of any validation errors
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.TextField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());        
+        
+        if (Ext.isFunction(this.validator)) {
+            var msg = this.validator(value);
+            if (msg !== true) {
+                errors.push(msg);
+            }
+        }
+        
+        if (value.length < 1 || value === this.emptyText) {
+            if (this.allowBlank) {
+                //if value is blank and allowBlank is true, there cannot be any additional errors
+                return errors;
+            } else {
+                errors.push(this.blankText);
+            }
+        }
+        
+        if (!this.allowBlank && (value.length < 1 || value === this.emptyText)) { // if it's blank
+            errors.push(this.blankText);
+        }
+        
+        if (value.length < this.minLength) {
+            errors.push(String.format(this.minLengthText, this.minLength));
+        }
+        
+        if (value.length > this.maxLength) {
+            errors.push(String.format(this.maxLengthText, this.maxLength));
+        }
+        
+        if (this.vtype) {
+            var vt = Ext.form.VTypes;
+            if(!vt[this.vtype](value, this)){
+                errors.push(this.vtypeText || vt[this.vtype +'Text']);
+            }
+        }
+        
+        if (this.regex && !this.regex.test(value)) {
+            errors.push(this.regexText);
+        }
+        
+        return errors;
+    },
+
+    /**
+     * Selects text in this field
+     * @param {Number} start (optional) The index where the selection should start (defaults to 0)
+     * @param {Number} end (optional) The index where the selection should end (defaults to the text length)
+     */
+    selectText : function(start, end){
+        var v = this.getRawValue();
+        var doFocus = false;
+        if(v.length > 0){
+            start = start === undefined ? 0 : start;
+            end = end === undefined ? v.length : end;
+            var d = this.el.dom;
+            if(d.setSelectionRange){
+                d.setSelectionRange(start, end);
+            }else if(d.createTextRange){
+                var range = d.createTextRange();
+                range.moveStart('character', start);
+                range.moveEnd('character', end-v.length);
+                range.select();
+            }
+            doFocus = Ext.isGecko || Ext.isOpera;
+        }else{
+            doFocus = true;
+        }
+        if(doFocus){
+            this.focus();
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
+     * This only takes effect if <tt><b>{@link #grow}</b> = true</tt>, and fires the {@link #autosize} event.
+     */
+    autoSize : function(){
+        if(!this.grow || !this.rendered){
+            return;
+        }
+        if(!this.metrics){
+            this.metrics = Ext.util.TextMetrics.createInstance(this.el);
+        }
+        var el = this.el;
+        var v = el.dom.value;
+        var d = document.createElement('div');
+        d.appendChild(document.createTextNode(v));
+        v = d.innerHTML;
+        Ext.removeNode(d);
+        d = null;
+        v += '&#160;';
+        var w = Math.min(this.growMax, Math.max(this.metrics.getWidth(v) + /* add extra padding */ 10, this.growMin));
+        this.el.setWidth(w);
+        this.fireEvent('autosize', this, w);
+    },
+	
+	onDestroy: function(){
+		if(this.validationTask){
+			this.validationTask.cancel();
+			this.validationTask = null;
+		}
+		Ext.form.TextField.superclass.onDestroy.call(this);
+	}
+});
+Ext.reg('textfield', Ext.form.TextField);
+/**
+ * @class Ext.form.TriggerField
+ * @extends Ext.form.TextField
+ * Provides a convenient wrapper for TextFields that adds a clickable trigger button (looks like a combobox by default).
+ * The trigger has no default action, so you must assign a function to implement the trigger click handler by
+ * overriding {@link #onTriggerClick}. You can create a TriggerField directly, as it renders exactly like a combobox
+ * for which you can provide a custom implementation.  For example:
+ * <pre><code>
+var trigger = new Ext.form.TriggerField();
+trigger.onTriggerClick = myTriggerFn;
+trigger.applyToMarkup('my-field');
+</code></pre>
+ *
+ * However, in general you will most likely want to use TriggerField as the base class for a reusable component.
+ * {@link Ext.form.DateField} and {@link Ext.form.ComboBox} are perfect examples of this.
+ *
+ * @constructor
+ * Create a new TriggerField.
+ * @param {Object} config Configuration options (valid {@Ext.form.TextField} config options will also be applied
+ * to the base TextField)
+ * @xtype trigger
+ */
+Ext.form.TriggerField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the
+     * trigger element for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to act as the trigger button for a TriggerField.</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing, positioning
+     * and appearance of the trigger.  Defaults to:</p>
+     * <pre><code>{tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.triggerClass}</code></pre>
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "16", autocomplete: "off"}</code></pre>
+     */
+    defaultAutoCreate : {tag: "input", type: "text", size: "16", autocomplete: "off"},
+    /**
+     * @cfg {Boolean} hideTrigger <tt>true</tt> to hide the trigger element and display only the base
+     * text field (defaults to <tt>false</tt>)
+     */
+    hideTrigger:false,
+    /**
+     * @cfg {Boolean} editable <tt>false</tt> to prevent the user from typing text directly into the field,
+     * the field will only respond to a click on the trigger to set the value. (defaults to <tt>true</tt>).
+     */
+    editable: true,
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to prevent the user from changing the field, and
+     * hides the trigger.  Superceeds the editable and hideTrigger options if the value is true.
+     * (defaults to <tt>false</tt>)
+     */
+    readOnly: false,
+    /**
+     * @cfg {String} wrapFocusClass The class added to the to the wrap of the trigger element. Defaults to
+     * <tt>x-trigger-wrap-focus</tt>.
+     */
+    wrapFocusClass: 'x-trigger-wrap-focus',
+    /**
+     * @hide
+     * @method autoSize
+     */
+    autoSize: Ext.emptyFn,
+    // private
+    monitorTab : true,
+    // private
+    deferHeight : true,
+    // private
+    mimicing : false,
+
+    actionMode: 'wrap',
+
+    defaultTriggerWidth: 17,
+
+    // private
+    onResize : function(w, h){
+        Ext.form.TriggerField.superclass.onResize.call(this, w, h);
+        var tw = this.getTriggerWidth();
+        if(Ext.isNumber(w)){
+            this.el.setWidth(w - tw);
+        }
+        this.wrap.setWidth(this.el.getWidth() + tw);
+    },
+
+    getTriggerWidth: function(){
+        var tw = this.trigger.getWidth();
+        if(!this.hideTrigger && !this.readOnly && tw === 0){
+            tw = this.defaultTriggerWidth;
+        }
+        return tw;
+    },
+
+    // private
+    alignErrorIcon : function(){
+        if(this.wrap){
+            this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.doc = Ext.isIE ? Ext.getBody() : Ext.getDoc();
+        Ext.form.TriggerField.superclass.onRender.call(this, ct, position);
+
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap x-form-field-trigger-wrap'});
+        this.trigger = this.wrap.createChild(this.triggerConfig ||
+                {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.triggerClass});
+        this.initTrigger();
+        if(!this.width){
+            this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    getWidth: function() {
+        return(this.el.getWidth() + this.trigger.getWidth());
+    },
+
+    updateEditState: function(){
+        if(this.rendered){
+            if (this.readOnly) {
+                this.el.dom.readOnly = true;
+                this.el.addClass('x-trigger-noedit');
+                this.mun(this.el, 'click', this.onTriggerClick, this);
+                this.trigger.setDisplayed(false);
+            } else {
+                if (!this.editable) {
+                    this.el.dom.readOnly = true;
+                    this.el.addClass('x-trigger-noedit');
+                    this.mon(this.el, 'click', this.onTriggerClick, this);
+                } else {
+                    this.el.dom.readOnly = false;
+                    this.el.removeClass('x-trigger-noedit');
+                    this.mun(this.el, 'click', this.onTriggerClick, this);
+                }
+                this.trigger.setDisplayed(!this.hideTrigger);
+            }
+            this.onResize(this.width || this.wrap.getWidth());
+        }
+    },
+
+    /**
+     * Changes the hidden status of the trigger.
+     * @param {Boolean} hideTrigger True to hide the trigger, false to show it.
+     */
+    setHideTrigger: function(hideTrigger){
+        if(hideTrigger != this.hideTrigger){
+            this.hideTrigger = hideTrigger;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Allow or prevent the user from directly editing the field text.  If false is passed,
+     * the user will only be able to modify the field using the trigger.  Will also add
+     * a click event to the text field which will call the trigger. This method
+     * is the runtime equivalent of setting the {@link #editable} config option at config time.
+     * @param {Boolean} value True to allow the user to directly edit the field text.
+     */
+    setEditable: function(editable){
+        if(editable != this.editable){
+            this.editable = editable;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Setting this to true will supersede settings {@link #editable} and {@link #hideTrigger}.
+     * Setting this to false will defer back to {@link #editable} and {@link #hideTrigger}. This method
+     * is the runtime equivalent of setting the {@link #readOnly} config option at config time.
+     * @param {Boolean} value True to prevent the user changing the field and explicitly
+     * hide the trigger.
+     */
+    setReadOnly: function(readOnly){
+        if(readOnly != this.readOnly){
+            this.readOnly = readOnly;
+            this.updateEditState();
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.TriggerField.superclass.afterRender.call(this);
+        this.updateEditState();
+    },
+
+    // private
+    initTrigger : function(){
+        this.mon(this.trigger, 'click', this.onTriggerClick, this, {preventDefault:true});
+        this.trigger.addClassOnOver('x-form-trigger-over');
+        this.trigger.addClassOnClick('x-form-trigger-click');
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.trigger, this.wrap);
+        if (this.mimicing){
+            this.doc.un('mousedown', this.mimicBlur, this);
+        }
+        delete this.doc;
+        Ext.form.TriggerField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    onFocus : function(){
+        Ext.form.TriggerField.superclass.onFocus.call(this);
+        if(!this.mimicing){
+            this.wrap.addClass(this.wrapFocusClass);
+            this.mimicing = true;
+            this.doc.on('mousedown', this.mimicBlur, this, {delay: 10});
+            if(this.monitorTab){
+                this.on('specialkey', this.checkTab, this);
+            }
+        }
+    },
+
+    // private
+    checkTab : function(me, e){
+        if(e.getKey() == e.TAB){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    onBlur : Ext.emptyFn,
+
+    // private
+    mimicBlur : function(e){
+        if(!this.isDestroyed && !this.wrap.contains(e.target) && this.validateBlur(e)){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    triggerBlur : function(){
+        this.mimicing = false;
+        this.doc.un('mousedown', this.mimicBlur, this);
+        if(this.monitorTab && this.el){
+            this.un('specialkey', this.checkTab, this);
+        }
+        Ext.form.TriggerField.superclass.onBlur.call(this);
+        if(this.wrap){
+            this.wrap.removeClass(this.wrapFocusClass);
+        }
+    },
+
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    // This should be overriden by any subclass that needs to check whether or not the field can be blurred.
+    validateBlur : function(e){
+        return true;
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function.  See Ext.form.ComboBox and Ext.form.DateField for
+     * sample implementations.
+     * @method
+     * @param {EventObject} e
+     */
+    onTriggerClick : Ext.emptyFn
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+});
+
+/**
+ * @class Ext.form.TwinTriggerField
+ * @extends Ext.form.TriggerField
+ * TwinTriggerField is not a public class to be used directly.  It is meant as an abstract base class
+ * to be extended by an implementing class.  For an example of implementing this class, see the custom
+ * SearchField implementation here:
+ * <a href="http://extjs.com/deploy/ext/examples/form/custom.html">http://extjs.com/deploy/ext/examples/form/custom.html</a>
+ */
+Ext.form.TwinTriggerField = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the trigger elements
+     * for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to contain the two trigger elements for this Field.
+     * Each trigger element must be marked by the CSS class <tt>x-form-trigger</tt> (also see
+     * <tt>{@link #trigger1Class}</tt> and <tt>{@link #trigger2Class}</tt>).</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing,
+     * positioning and appearance of the triggers.</p>
+     */
+    /**
+     * @cfg {String} trigger1Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {String} trigger2Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+
+    initComponent : function(){
+        Ext.form.TwinTriggerField.superclass.initComponent.call(this);
+
+        this.triggerConfig = {
+            tag:'span', cls:'x-form-twin-triggers', cn:[
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger1Class},
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger2Class}
+        ]};
+    },
+
+    getTrigger : function(index){
+        return this.triggers[index];
+    },
+    
+    afterRender: function(){
+        Ext.form.TwinTriggerField.superclass.afterRender.call(this);
+        var triggers = this.triggers,
+            i = 0,
+            len = triggers.length;
+            
+        for(; i < len; ++i){
+            if(this['hideTrigger' + (i + 1)]){
+                    triggers[i].hide();
+                }
+
+        }    
+    },
+
+    initTrigger : function(){
+        var ts = this.trigger.select('.x-form-trigger', true),
+            triggerField = this;
+            
+        ts.each(function(t, all, index){
+            var triggerIndex = 'Trigger'+(index+1);
+            t.hide = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = 'none';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = true;
+            };
+            t.show = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = '';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = false;
+            };
+            this.mon(t, 'click', this['on'+triggerIndex+'Click'], this, {preventDefault:true});
+            t.addClassOnOver('x-form-trigger-over');
+            t.addClassOnClick('x-form-trigger-click');
+        }, this);
+        this.triggers = ts.elements;
+    },
+
+    getTriggerWidth: function(){
+        var tw = 0;
+        Ext.each(this.triggers, function(t, index){
+            var triggerIndex = 'Trigger' + (index + 1),
+                w = t.getWidth();
+            if(w === 0 && !this['hidden' + triggerIndex]){
+                tw += this.defaultTriggerWidth;
+            }else{
+                tw += w;
+            }
+        }, this);
+        return tw;
+    },
+
+    // private
+    onDestroy : function() {
+        Ext.destroy(this.triggers);
+        Ext.form.TwinTriggerField.superclass.onDestroy.call(this);
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger1Click : Ext.emptyFn,
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger2Click : Ext.emptyFn
+});
+Ext.reg('trigger', Ext.form.TriggerField);
+/**
+ * @class Ext.form.TextArea
+ * @extends Ext.form.TextField
+ * Multiline text field.  Can be used as a direct replacement for traditional textarea fields, plus adds
+ * support for auto-sizing.
+ * @constructor
+ * Creates a new TextArea
+ * @param {Object} config Configuration options
+ * @xtype textarea
+ */
+Ext.form.TextArea = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {Number} growMin The minimum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>60</tt>)
+     */
+    growMin : 60,
+    /**
+     * @cfg {Number} growMax The maximum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>1000</tt>)
+     */
+    growMax: 1000,
+    growAppend : '&#160;\n&#160;',
+
+    enterIsSpecial : false,
+
+    /**
+     * @cfg {Boolean} preventScrollbars <tt>true</tt> to prevent scrollbars from appearing regardless of how much text is
+     * in the field. This option is only relevant when {@link #grow} is <tt>true</tt>. Equivalent to setting overflow: hidden, defaults to 
+     * <tt>false</tt>.
+     */
+    preventScrollbars: false,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "textarea", style: "width:100px;height:60px;", autocomplete: "off"}</code></pre>
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.defaultAutoCreate = {
+                tag: "textarea",
+                style:"width:100px;height:60px;",
+                autocomplete: "off"
+            };
+        }
+        Ext.form.TextArea.superclass.onRender.call(this, ct, position);
+        if(this.grow){
+            this.textSizeEl = Ext.DomHelper.append(document.body, {
+                tag: "pre", cls: "x-form-grow-sizer"
+            });
+            if(this.preventScrollbars){
+                this.el.setStyle("overflow", "hidden");
+            }
+            this.el.setHeight(this.growMin);
+        }
+    },
+
+    onDestroy : function(){
+        Ext.removeNode(this.textSizeEl);
+        Ext.form.TextArea.superclass.onDestroy.call(this);
+    },
+
+    fireKey : function(e){
+        if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
+            this.fireEvent("specialkey", this, e);
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress() || e.getKey() == e.ENTER;
+    },
+    
+    // inherit docs
+    filterValidation: function(e) {            
+        if(!e.isNavKeyPress() || (!this.enterIsSpecial && e.keyCode == e.ENTER)){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the height of the text up to the maximum field height allowed.
+     * This only takes effect if grow = true, and fires the {@link #autosize} event if the height changes.
+     */
+    autoSize: function(){
+        if(!this.grow || !this.textSizeEl){
+            return;
+        }
+        var el = this.el,
+            v = Ext.util.Format.htmlEncode(el.dom.value),
+            ts = this.textSizeEl,
+            h;
+            
+        Ext.fly(ts).setWidth(this.el.getWidth());
+        if(v.length < 1){
+            v = "&#160;&#160;";
+        }else{
+            v += this.growAppend;
+            if(Ext.isIE){
+                v = v.replace(/\n/g, '&#160;<br />');
+            }
+        }
+        ts.innerHTML = v;
+        h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin));
+        if(h != this.lastHeight){
+            this.lastHeight = h;
+            this.el.setHeight(h);
+            this.fireEvent("autosize", this, h);
+        }
+    }
+});
+Ext.reg('textarea', Ext.form.TextArea);/**
+ * @class Ext.form.NumberField
+ * @extends Ext.form.TextField
+ * Numeric text field that provides automatic keystroke filtering and numeric validation.
+ * @constructor
+ * Creates a new NumberField
+ * @param {Object} config Configuration options
+ * @xtype numberfield
+ */
+Ext.form.NumberField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {RegExp} stripCharsRe @hide
+     */
+    /**
+     * @cfg {RegExp} maskRe @hide
+     */
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to "x-form-field x-form-num-field")
+     */
+    fieldClass: "x-form-field x-form-num-field",
+    
+    /**
+     * @cfg {Boolean} allowDecimals False to disallow decimal values (defaults to true)
+     */
+    allowDecimals : true,
+    
+    /**
+     * @cfg {String} decimalSeparator Character(s) to allow as the decimal separator (defaults to '.')
+     */
+    decimalSeparator : ".",
+    
+    /**
+     * @cfg {Number} decimalPrecision The maximum precision to display after the decimal separator (defaults to 2)
+     */
+    decimalPrecision : 2,
+    
+    /**
+     * @cfg {Boolean} allowNegative False to prevent entering a negative sign (defaults to true)
+     */
+    allowNegative : true,
+    
+    /**
+     * @cfg {Number} minValue The minimum allowed value (defaults to Number.NEGATIVE_INFINITY)
+     */
+    minValue : Number.NEGATIVE_INFINITY,
+    
+    /**
+     * @cfg {Number} maxValue The maximum allowed value (defaults to Number.MAX_VALUE)
+     */
+    maxValue : Number.MAX_VALUE,
+    
+    /**
+     * @cfg {String} minText Error text to display if the minimum value validation fails (defaults to "The minimum value for this field is {minValue}")
+     */
+    minText : "The minimum value for this field is {0}",
+    
+    /**
+     * @cfg {String} maxText Error text to display if the maximum value validation fails (defaults to "The maximum value for this field is {maxValue}")
+     */
+    maxText : "The maximum value for this field is {0}",
+    
+    /**
+     * @cfg {String} nanText Error text to display if the value is not a valid number.  For example, this can happen
+     * if a valid character like '.' or '-' is left in the field with no number (defaults to "{value} is not a valid number")
+     */
+    nanText : "{0} is not a valid number",
+    
+    /**
+     * @cfg {String} baseChars The base set of characters to evaluate as valid numbers (defaults to '0123456789').
+     */
+    baseChars : "0123456789",
+    
+    /**
+     * @cfg {Boolean} autoStripChars True to automatically strip not allowed characters from the field. Defaults to <tt>false</tt>
+     */
+    autoStripChars: false,
+
+    // private
+    initEvents : function() {
+        var allowed = this.baseChars + '';
+        if (this.allowDecimals) {
+            allowed += this.decimalSeparator;
+        }
+        if (this.allowNegative) {
+            allowed += '-';
+        }
+        allowed = Ext.escapeRe(allowed);
+        this.maskRe = new RegExp('[' + allowed + ']');
+        if (this.autoStripChars) {
+            this.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
+        }
+        
+        Ext.form.NumberField.superclass.initEvents.call(this);
+    },
+    
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validations run test that the value is a number, and that it is within the
+     * configured min and max values.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.NumberField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());
+        
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+        
+        value = String(value).replace(this.decimalSeparator, ".");
+        
+        if(isNaN(value)){
+            errors.push(String.format(this.nanText, value));
+        }
+        
+        var num = this.parseValue(value);
+        
+        if (num < this.minValue) {
+            errors.push(String.format(this.minText, this.minValue));
+        }
+        
+        if (num > this.maxValue) {
+            errors.push(String.format(this.maxText, this.maxValue));
+        }
+        
+        return errors;
+    },
+
+    getValue : function() {
+        return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));
+    },
+
+    setValue : function(v) {
+    	v = Ext.isNumber(v) ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
+        v = this.fixPrecision(v);
+        v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
+        return Ext.form.NumberField.superclass.setValue.call(this, v);
+    },
+    
+    /**
+     * Replaces any existing {@link #minValue} with the new value.
+     * @param {Number} value The minimum value
+     */
+    setMinValue : function(value) {
+        this.minValue = Ext.num(value, Number.NEGATIVE_INFINITY);
+    },
+    
+    /**
+     * Replaces any existing {@link #maxValue} with the new value.
+     * @param {Number} value The maximum value
+     */
+    setMaxValue : function(value) {
+        this.maxValue = Ext.num(value, Number.MAX_VALUE);    
+    },
+
+    // private
+    parseValue : function(value) {
+        value = parseFloat(String(value).replace(this.decimalSeparator, "."));
+        return isNaN(value) ? '' : value;
+    },
+
+    /**
+     * @private
+     * 
+     */
+    fixPrecision : function(value) {
+        var nan = isNaN(value);
+        
+        if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
+            return nan ? '' : value;
+        }
+        
+        return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
+    },
+
+    beforeBlur : function() {
+        var v = this.parseValue(this.getRawValue());
+        
+        if (!Ext.isEmpty(v)) {
+            this.setValue(v);
+        }
+    }
+});
+
+Ext.reg('numberfield', Ext.form.NumberField);
+/**
+ * @class Ext.form.DateField
+ * @extends Ext.form.TriggerField
+ * Provides a date input field with a {@link Ext.DatePicker} dropdown and automatic date validation.
+ * @constructor
+ * Create a new DateField
+ * @param {Object} config
+ * @xtype datefield
+ */
+Ext.form.DateField = Ext.extend(Ext.form.TriggerField,  {
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : "m/d/Y",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "<tt>|</tt>" to try when parsing a user input value and it
+     * does not match the defined format (defaults to
+     * <tt>'m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j'</tt>).
+     */
+    altFormats : "m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDaysText : "Disabled",
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDatesText : "Disabled",
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before <tt>{@link #minValue}</tt> (defaults to
+     * <tt>'The date in this field must be after {minValue}'</tt>).
+     */
+    minText : "The date in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the date in the cell is after <tt>{@link #maxValue}</tt> (defaults to
+     * <tt>'The date in this field must be before {maxValue}'</tt>).
+     */
+    maxText : "The date in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the date in the field is invalid (defaults to
+     * <tt>'{value} is not a valid date - it must be in the format {format}'</tt>).
+     */
+    invalidText : "{0} is not a valid date - it must be in the format {1}",
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-date-trigger'</tt> which displays a calendar icon).
+     */
+    triggerClass : 'x-form-date-trigger',
+    /**
+     * @cfg {Boolean} showToday
+     * <tt>false</tt> to hide the footer area of the DatePicker containing the Today button and disable
+     * the keyboard handler for spacebar that selects the current date (defaults to <tt>true</tt>).
+     */
+    showToday : true,
+    
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0 based (defaults to null). Some examples:<pre><code>
+// disable Sunday and Saturday:
+disabledDays:  [0, 6]
+// disable weekdays:
+disabledDays: [1,2,3,4,5]
+     * </code></pre>
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of "dates" to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:<pre><code>
+// disable these exact dates:
+disabledDates: ["03/08/2003", "09/16/2003"]
+// disable these days for every year:
+disabledDates: ["03/08", "09/16"]
+// only match the beginning (useful if you are using short years):
+disabledDates: ["^03/08"]
+// disable every day in March 2006:
+disabledDates: ["03/../2006"]
+// disable every day in every March:
+disabledDates: ["^03"]
+     * </code></pre>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a {@link #format date format} that has "." in
+     * it, you will have to escape the dot when restricting dates. For example: <tt>["03\\.08\\.03"]</tt>.
+     */
+    /**
+     * @cfg {String/Object} autoCreate
+     * A {@link Ext.DomHelper DomHelper element specification object}, or <tt>true</tt> for the default element
+     * specification object:<pre><code>
+     * autoCreate: {tag: "input", type: "text", size: "10", autocomplete: "off"}
+     * </code></pre>
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "10", autocomplete: "off"},
+
+    // in the absence of a time value, a default value of 12 noon will be used
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initTime: '12', // 24 hour format
+
+    initTimeFormat: 'H',
+
+    // PUBLIC -- to be documented
+    safeParse : function(value, format) {
+        if (Date.formatContainsHourInfo(format)) {
+            // if parse format contains hour information, no DST adjustment is necessary
+            return Date.parseDate(value, format);
+        } else {
+            // set time to 12 noon, then clear the time
+            var parsedDate = Date.parseDate(value + ' ' + this.initTime, format + ' ' + this.initTimeFormat);
+ 
+            if (parsedDate) {
+                return parsedDate.clearTime();
+            }
+        }
+    },
+
+    initComponent : function(){
+        Ext.form.DateField.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected via the date picker.
+             * @param {Ext.form.DateField} this
+             * @param {Date} date The date that was selected
+             */
+            'select'
+        );
+
+        if(Ext.isString(this.minValue)){
+            this.minValue = this.parseDate(this.minValue);
+        }
+        if(Ext.isString(this.maxValue)){
+            this.maxValue = this.parseDate(this.maxValue);
+        }
+        this.disabledDatesRE = null;
+        this.initDisabledDays();
+    },
+
+    initEvents: function() {
+        Ext.form.DateField.superclass.initEvents.call(this);
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "down": function(e) {
+                this.onTriggerClick();
+            },
+            scope: this,
+            forceKeyDown: true
+        });
+    },
+
+
+    // private
+    initDisabledDays : function(){
+        if(this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = "(?:";
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array} disabledDates An array of date strings (see the <tt>{@link #disabledDates}</tt> config
+     * for details on supported values) used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        this.disabledDates = dd;
+        this.initDisabledDays();
+        if(this.menu){
+            this.menu.picker.setDisabledDates(this.disabledDatesRE);
+        }
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the <tt>{@link #disabledDays}</tt>
+     * config for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        if(this.menu){
+            this.menu.picker.setDisabledDays(dd);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #minValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinValue : function(dt){
+        this.minValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMinDate(this.minValue);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #maxValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxValue : function(dt){
+        this.maxValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMaxDate(this.maxValue);
+        }
+    },
+
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validation checks are testing that the date format is valid, that the chosen
+     * date is within the min and max date constraints set, that the date chosen is not in the disabledDates
+     * regex and that the day chosed is not one of the disabledDays.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.DateField.superclass.getErrors.apply(this, arguments);
+
+        value = this.formatDate(value || this.processValue(this.getRawValue()));
+
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+
+        var svalue = value;
+        value = this.parseDate(value);
+        if (!value) {
+            errors.push(String.format(this.invalidText, svalue, this.format));
+            return errors;
+        }
+
+        var time = value.getTime();
+        if (this.minValue && time < this.minValue.clearTime().getTime()) {
+            errors.push(String.format(this.minText, this.formatDate(this.minValue)));
+        }
+
+        if (this.maxValue && time > this.maxValue.clearTime().getTime()) {
+            errors.push(String.format(this.maxText, this.formatDate(this.maxValue)));
+        }
+
+        if (this.disabledDays) {
+            var day = value.getDay();
+
+            for(var i = 0; i < this.disabledDays.length; i++) {
+                if (day === this.disabledDays[i]) {
+                    errors.push(this.disabledDaysText);
+                    break;
+                }
+            }
+        }
+
+        var fvalue = this.formatDate(value);
+        if (this.disabledDatesRE && this.disabledDatesRE.test(fvalue)) {
+            errors.push(String.format(this.disabledDatesText, fvalue));
+        }
+
+        return errors;
+    },
+
+    // private
+    // Provides logic to override the default TriggerField.validateBlur which just returns true
+    validateBlur : function(){
+        return !this.menu || !this.menu.isVisible();
+    },
+
+    /**
+     * Returns the current date value of the date field.
+     * @return {Date} The date value
+     */
+    getValue : function(){
+        return this.parseDate(Ext.form.DateField.superclass.getValue.call(this)) || "";
+    },
+
+    /**
+     * Sets the value of the date field.  You can pass a date object or any string that can be
+     * parsed into a valid date, using <tt>{@link #format}</tt> as the date format, according
+     * to the same rules as {@link Date#parseDate} (the default format used is <tt>"m/d/Y"</tt>).
+     * <br />Usage:
+     * <pre><code>
+//All of these calls set the same date value (May 4, 2006)
+
+//Pass a date object:
+var dt = new Date('5/4/2006');
+dateField.setValue(dt);
+
+//Pass a date string (default format):
+dateField.setValue('05/04/2006');
+
+//Pass a date string (custom format):
+dateField.format = 'Y-m-d';
+dateField.setValue('2006-05-04');
+</code></pre>
+     * @param {String/Date} date The date or valid date string
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(date){
+        return Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));
+    },
+
+    // private
+    parseDate : function(value) {
+        if(!value || Ext.isDate(value)){
+            return value;
+        }
+
+        var v = this.safeParse(value, this.format),
+            af = this.altFormats,
+            afa = this.altFormatsArray;
+
+        if (!v && af) {
+            afa = afa || af.split("|");
+
+            for (var i = 0, len = afa.length; i < len && !v; i++) {
+                v = this.safeParse(value, afa[i]);
+            }
+        }
+        return v;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.menu, this.keyNav);
+        Ext.form.DateField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    formatDate : function(date){
+        return Ext.isDate(date) ? date.dateFormat(this.format) : date;
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
+    onTriggerClick : function(){
+        if(this.disabled){
+            return;
+        }
+        if(this.menu == null){
+            this.menu = new Ext.menu.DateMenu({
+                hideOnClick: false,
+                focusOnSelect: false
+            });
+        }
+        this.onFocus();
+        Ext.apply(this.menu.picker,  {
+            minDate : this.minValue,
+            maxDate : this.maxValue,
+            disabledDatesRE : this.disabledDatesRE,
+            disabledDatesText : this.disabledDatesText,
+            disabledDays : this.disabledDays,
+            disabledDaysText : this.disabledDaysText,
+            format : this.format,
+            showToday : this.showToday,
+            startDay: this.startDay,
+            minText : String.format(this.minText, this.formatDate(this.minValue)),
+            maxText : String.format(this.maxText, this.formatDate(this.maxValue))
+        });
+        this.menu.picker.setValue(this.getValue() || new Date());
+        this.menu.show(this.el, "tl-bl?");
+        this.menuEvents('on');
+    },
+
+    //private
+    menuEvents: function(method){
+        this.menu[method]('select', this.onSelect, this);
+        this.menu[method]('hide', this.onMenuHide, this);
+        this.menu[method]('show', this.onFocus, this);
+    },
+
+    onSelect: function(m, d){
+        this.setValue(d);
+        this.fireEvent('select', this, d);
+        this.menu.hide();
+    },
+
+    onMenuHide: function(){
+        this.focus(false, 60);
+        this.menuEvents('un');
+    },
+
+    // private
+    beforeBlur : function(){
+        var v = this.parseDate(this.getRawValue());
+        if(v){
+            this.setValue(v);
+        }
+    }
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+    /**
+     * @hide
+     * @method autoSize
+     */
+});
+Ext.reg('datefield', Ext.form.DateField);
+/**
+ * @class Ext.form.DisplayField
+ * @extends Ext.form.Field
+ * A display-only text field which is not validated and not submitted.
+ * @constructor
+ * Creates a new DisplayField.
+ * @param {Object} config Configuration options
+ * @xtype displayfield
+ */
+Ext.form.DisplayField = Ext.extend(Ext.form.Field,  {
+    validationEvent : false,
+    validateOnBlur : false,
+    defaultAutoCreate : {tag: "div"},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to <tt>"x-form-display-field"</tt>)
+     */
+    fieldClass : "x-form-display-field",
+    /**
+     * @cfg {Boolean} htmlEncode <tt>false</tt> to skip HTML-encoding the text when rendering it (defaults to
+     * <tt>false</tt>). This might be useful if you want to include tags in the field's innerHTML rather than
+     * rendering them as string literals per the default logic.
+     */
+    htmlEncode: false,
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    isValid : function(){
+        return true;
+    },
+
+    validate : function(){
+        return true;
+    },
+
+    getRawValue : function(){
+        var v = this.rendered ? this.el.dom.innerHTML : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlDecode(v);
+        }
+        return v;
+    },
+
+    getValue : function(){
+        return this.getRawValue();
+    },
+    
+    getName: function() {
+        return this.name;
+    },
+
+    setRawValue : function(v){
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlEncode(v);
+        }
+        return this.rendered ? (this.el.dom.innerHTML = (Ext.isEmpty(v) ? '' : v)) : (this.value = v);
+    },
+
+    setValue : function(v){
+        this.setRawValue(v);
+        return this;
+    }
+    /** 
+     * @cfg {String} inputType 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} disabled 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} readOnly 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} validateOnBlur 
+     * @hide
+     */
+    /** 
+     * @cfg {Number} validationDelay 
+     * @hide
+     */
+    /** 
+     * @cfg {String/Boolean} validationEvent 
+     * @hide
+     */
+});
+
+Ext.reg('displayfield', Ext.form.DisplayField);
+/**
+ * @class Ext.form.ComboBox
+ * @extends Ext.form.TriggerField
+ * <p>A combobox control with support for autocomplete, remote-loading, paging and many other features.</p>
+ * <p>A ComboBox works in a similar manner to a traditional HTML &lt;select> field. The difference is
+ * that to submit the {@link #valueField}, you must specify a {@link #hiddenName} to create a hidden input
+ * field to hold the value of the valueField. The <i>{@link #displayField}</i> is shown in the text field
+ * which is named according to the {@link #name}.</p>
+ * <p><b><u>Events</u></b></p>
+ * <p>To do something when something in ComboBox is selected, configure the select event:<pre><code>
+var cb = new Ext.form.ComboBox({
+    // all of your config options
+    listeners:{
+         scope: yourScope,
+         'select': yourFunction
+    }
+});
+
+// Alternatively, you can assign events after the object is created:
+var cb = new Ext.form.ComboBox(yourOptions);
+cb.on('select', yourFunction, yourScope);
+ * </code></pre></p>
+ *
+ * <p><b><u>ComboBox in Grid</u></b></p>
+ * <p>If using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a {@link Ext.grid.Column#renderer renderer}
+ * will be needed to show the displayField when the editor is not active.  Set up the renderer manually, or implement
+ * a reusable render, for example:<pre><code>
+// create reusable renderer
+Ext.util.Format.comboRenderer = function(combo){
+    return function(value){
+        var record = combo.findRecord(combo.{@link #valueField}, value);
+        return record ? record.get(combo.{@link #displayField}) : combo.{@link #valueNotFoundText};
+    }
+}
+
+// create the combo instance
+var combo = new Ext.form.ComboBox({
+    {@link #typeAhead}: true,
+    {@link #triggerAction}: 'all',
+    {@link #lazyRender}:true,
+    {@link #mode}: 'local',
+    {@link #store}: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]
+    }),
+    {@link #valueField}: 'myId',
+    {@link #displayField}: 'displayText'
+});
+
+// snippet of column model used within grid
+var cm = new Ext.grid.ColumnModel([{
+       ...
+    },{
+       header: "Some Header",
+       dataIndex: 'whatever',
+       width: 130,
+       editor: combo, // specify reference to combo instance
+       renderer: Ext.util.Format.comboRenderer(combo) // pass combo instance to reusable renderer
+    },
+    ...
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Filtering</u></b></p>
+ * <p>A ComboBox {@link #doQuery uses filtering itself}, for information about filtering the ComboBox
+ * store manually see <tt>{@link #lastQuery}</tt>.</p>
+ * @constructor
+ * Create a new ComboBox.
+ * @param {Object} config Configuration options
+ * @xtype combo
+ */
+Ext.form.ComboBox = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} transform The id, DOM node or element of an existing HTML SELECT to convert to a ComboBox.
+     * Note that if you specify this and the combo is going to be in an {@link Ext.form.BasicForm} or
+     * {@link Ext.form.FormPanel}, you must also set <tt>{@link #lazyRender} = true</tt>.
+     */
+    /**
+     * @cfg {Boolean} lazyRender <tt>true</tt> to prevent the ComboBox from rendering until requested
+     * (should always be used when rendering into an {@link Ext.Editor} (e.g. {@link Ext.grid.EditorGridPanel Grids}),
+     * defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or <tt>true</tt> for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "24", autocomplete: "off"}</code></pre>
+     */
+    /**
+     * @cfg {Ext.data.Store/Array} store The data source to which this combo is bound (defaults to <tt>undefined</tt>).
+     * Acceptable values for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b>any {@link Ext.data.Store Store} subclass</b></li>
+     * <li><b>an Array</b> : Arrays will be converted to a {@link Ext.data.ArrayStore} internally,
+     * automatically generating {@link Ext.data.Field#name field names} to work with all data components.
+     * <div class="mdetail-params"><ul>
+     * <li><b>1-dimensional array</b> : (e.g., <tt>['Foo','Bar']</tt>)<div class="sub-desc">
+     * A 1-dimensional array will automatically be expanded (each array item will be used for both the combo
+     * {@link #valueField} and {@link #displayField})</div></li>
+     * <li><b>2-dimensional array</b> : (e.g., <tt>[['f','Foo'],['b','Bar']]</tt>)<div class="sub-desc">
+     * For a multi-dimensional array, the value in index 0 of each item will be assumed to be the combo
+     * {@link #valueField}, while the value at index 1 is assumed to be the combo {@link #displayField}.
+     * </div></li></ul></div></li></ul></div>
+     * <p>See also <tt>{@link #mode}</tt>.</p>
+     */
+    /**
+     * @cfg {String} title If supplied, a header element is created containing this text and added into the top of
+     * the dropdown list (defaults to undefined, with no header element)
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "24", autocomplete: "off"},
+    /**
+     * @cfg {Number} listWidth The width (used as a parameter to {@link Ext.Element#setWidth}) of the dropdown
+     * list (defaults to the width of the ComboBox field).  See also <tt>{@link #minListWidth}
+     */
+    /**
+     * @cfg {String} displayField The underlying {@link Ext.data.Field#name data field name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field1'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p>See also <tt>{@link #valueField}</tt>.</p>
+     * <p><b>Note</b>: if using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a
+     * {@link Ext.grid.Column#renderer renderer} will be needed to show the displayField when the editor is not
+     * active.</p>
+     */
+    /**
+     * @cfg {String} valueField The underlying {@link Ext.data.Field#name data value name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field2'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p><b>Note</b>: use of a <tt>valueField</tt> requires the user to make a selection in order for a value to be
+     * mapped.  See also <tt>{@link #hiddenName}</tt>, <tt>{@link #hiddenValue}</tt>, and <tt>{@link #displayField}</tt>.</p>
+     */
+    /**
+     * @cfg {String} hiddenName If specified, a hidden form field with this name is dynamically generated to store the
+     * field's data value (defaults to the underlying DOM element's name). Required for the combo's value to automatically
+     * post during a form submission.  See also {@link #valueField}.
+     */
+    /**
+     * @cfg {String} hiddenId If <tt>{@link #hiddenName}</tt> is specified, <tt>hiddenId</tt> can also be provided
+     * to give the hidden field a unique id.  The <tt>hiddenId</tt> and combo {@link Ext.Component#id id} should be 
+     * different, since no two DOM nodes should share the same id.
+     */
+    /**
+     * @cfg {String} hiddenValue Sets the initial value of the hidden field if {@link #hiddenName} is
+     * specified to contain the selected {@link #valueField}, from the Store. Defaults to the configured
+     * <tt>{@link Ext.form.Field#value value}</tt>.
+     */
+    /**
+     * @cfg {String} listClass The CSS class to add to the predefined <tt>'x-combo-list'</tt> class
+     * applied the dropdown list element (defaults to '').
+     */
+    listClass : '',
+    /**
+     * @cfg {String} selectedClass CSS class to apply to the selected item in the dropdown list
+     * (defaults to <tt>'x-combo-selected'</tt>)
+     */
+    selectedClass : 'x-combo-selected',
+    /**
+     * @cfg {String} listEmptyText The empty text to display in the data view if no items are found.
+     * (defaults to '')
+     */
+    listEmptyText: '',
+    /**
+     * @cfg {String} triggerClass An additional CSS class used to style the trigger button.  The trigger will always
+     * get the class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-arrow-trigger'</tt> which displays a downward arrow icon).
+     */
+    triggerClass : 'x-form-arrow-trigger',
+    /**
+     * @cfg {Boolean/String} shadow <tt>true</tt> or <tt>"sides"</tt> for the default effect, <tt>"frame"</tt> for
+     * 4-way shadow, and <tt>"drop"</tt> for bottom-right
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String/Array} listAlign A valid anchor position value. See <tt>{@link Ext.Element#alignTo}</tt> for details
+     * on supported anchor positions and offsets. To specify x/y offsets as well, this value
+     * may be specified as an Array of <tt>{@link Ext.Element#alignTo}</tt> method arguments.</p>
+     * <pre><code>[ 'tl-bl?', [6,0] ]</code></pre>(defaults to <tt>'tl-bl?'</tt>)
+     */
+    listAlign : 'tl-bl?',
+    /**
+     * @cfg {Number} maxHeight The maximum height in pixels of the dropdown list before scrollbars are shown
+     * (defaults to <tt>300</tt>)
+     */
+    maxHeight : 300,
+    /**
+     * @cfg {Number} minHeight The minimum height in pixels of the dropdown list when the list is constrained by its
+     * distance to the viewport edges (defaults to <tt>90</tt>)
+     */
+    minHeight : 90,
+    /**
+     * @cfg {String} triggerAction The action to execute when the trigger is clicked.
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'query'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">{@link #doQuery run the query} using the {@link Ext.form.Field#getRawValue raw value}.</p></li>
+     * <li><b><tt>'all'</tt></b> :
+     * <p class="sub-desc">{@link #doQuery run the query} specified by the <tt>{@link #allQuery}</tt> config option</p></li>
+     * </ul></div>
+     * <p>See also <code>{@link #queryParam}</code>.</p>
+     */
+    triggerAction : 'query',
+    /**
+     * @cfg {Number} minChars The minimum number of characters the user must type before autocomplete and
+     * {@link #typeAhead} activate (defaults to <tt>4</tt> if <tt>{@link #mode} = 'remote'</tt> or <tt>0</tt> if
+     * <tt>{@link #mode} = 'local'</tt>, does not apply if
+     * <tt>{@link Ext.form.TriggerField#editable editable} = false</tt>).
+     */
+    minChars : 4,
+    /**
+     * @cfg {Boolean} autoSelect <tt>true</tt> to select the first result gathered by the data store (defaults
+     * to <tt>true</tt>).  A false value would require a manual selection from the dropdown list to set the components value
+     * unless the value of ({@link #typeAheadDelay}) were true.
+     */
+    autoSelect : true,
+    /**
+     * @cfg {Boolean} typeAhead <tt>true</tt> to populate and autoselect the remainder of the text being
+     * typed after a configurable delay ({@link #typeAheadDelay}) if it matches a known value (defaults
+     * to <tt>false</tt>)
+     */
+    typeAhead : false,
+    /**
+     * @cfg {Number} queryDelay The length of time in milliseconds to delay between the start of typing and
+     * sending the query to filter the dropdown list (defaults to <tt>500</tt> if <tt>{@link #mode} = 'remote'</tt>
+     * or <tt>10</tt> if <tt>{@link #mode} = 'local'</tt>)
+     */
+    queryDelay : 500,
+    /**
+     * @cfg {Number} pageSize If greater than <tt>0</tt>, a {@link Ext.PagingToolbar} is displayed in the
+     * footer of the dropdown list and the {@link #doQuery filter queries} will execute with page start and
+     * {@link Ext.PagingToolbar#pageSize limit} parameters. Only applies when <tt>{@link #mode} = 'remote'</tt>
+     * (defaults to <tt>0</tt>).
+     */
+    pageSize : 0,
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to select any existing text in the field immediately on focus.
+     * Only applies when <tt>{@link Ext.form.TriggerField#editable editable} = true</tt> (defaults to
+     * <tt>false</tt>).
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} queryParam Name of the query ({@link Ext.data.Store#baseParam baseParam} name for the store)
+     * as it will be passed on the querystring (defaults to <tt>'query'</tt>)
+     */
+    queryParam : 'query',
+    /**
+     * @cfg {String} loadingText The text to display in the dropdown list while data is loading.  Only applies
+     * when <tt>{@link #mode} = 'remote'</tt> (defaults to <tt>'Loading...'</tt>)
+     */
+    loadingText : 'Loading...',
+    /**
+     * @cfg {Boolean} resizable <tt>true</tt> to add a resize handle to the bottom of the dropdown list
+     * (creates an {@link Ext.Resizable} with 'se' {@link Ext.Resizable#pinned pinned} handles).
+     * Defaults to <tt>false</tt>.
+     */
+    resizable : false,
+    /**
+     * @cfg {Number} handleHeight The height in pixels of the dropdown list resize handle if
+     * <tt>{@link #resizable} = true</tt> (defaults to <tt>8</tt>)
+     */
+    handleHeight : 8,
+    /**
+     * @cfg {String} allQuery The text query to send to the server to return all records for the list
+     * with no filtering (defaults to '')
+     */
+    allQuery: '',
+    /**
+     * @cfg {String} mode Acceptable values are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'remote'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">Automatically loads the <tt>{@link #store}</tt> the <b>first</b> time the trigger
+     * is clicked. If you do not want the store to be automatically loaded the first time the trigger is
+     * clicked, set to <tt>'local'</tt> and manually load the store.  To force a requery of the store
+     * <b>every</b> time the trigger is clicked see <tt>{@link #lastQuery}</tt>.</p></li>
+     * <li><b><tt>'local'</tt></b> :
+     * <p class="sub-desc">ComboBox loads local data</p>
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    renderTo: document.body,
+    mode: 'local',
+    store: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',  // numeric value is the key
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]  // data is local
+    }),
+    valueField: 'myId',
+    displayField: 'displayText',
+    triggerAction: 'all'
+});
+     * </code></pre></li>
+     * </ul></div>
+     */
+    mode: 'remote',
+    /**
+     * @cfg {Number} minListWidth The minimum width of the dropdown list in pixels (defaults to <tt>70</tt>, will
+     * be ignored if <tt>{@link #listWidth}</tt> has a higher value)
+     */
+    minListWidth : 70,
+    /**
+     * @cfg {Boolean} forceSelection <tt>true</tt> to restrict the selected value to one of the values in the list,
+     * <tt>false</tt> to allow the user to set arbitrary text into the field (defaults to <tt>false</tt>)
+     */
+    forceSelection : false,
+    /**
+     * @cfg {Number} typeAheadDelay The length of time in milliseconds to wait until the typeahead text is displayed
+     * if <tt>{@link #typeAhead} = true</tt> (defaults to <tt>250</tt>)
+     */
+    typeAheadDelay : 250,
+    /**
+     * @cfg {String} valueNotFoundText When using a name/value combo, if the value passed to setValue is not found in
+     * the store, valueNotFoundText will be displayed as the field text if defined (defaults to undefined). If this
+     * default text is used, it means there is no value set and no validation will occur on this field.
+     */
+
+    /**
+     * @cfg {Boolean} lazyInit <tt>true</tt> to not initialize the list for this combo until the field is focused
+     * (defaults to <tt>true</tt>)
+     */
+    lazyInit : true,
+
+    /**
+     * @cfg {Boolean} clearFilterOnReset <tt>true</tt> to clear any filters on the store (when in local mode) when reset is called
+     * (defaults to <tt>true</tt>)
+     */
+    clearFilterOnReset : true,
+
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * If a hiddenName is specified, setting this to true will cause both the hidden field and the element to be submitted.
+     * Defaults to <tt>undefined</tt>.
+     */
+    submitValue: undefined,
+
+    /**
+     * The value of the match string used to filter the store. Delete this property to force a requery.
+     * Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'remote',
+    ...
+    listeners: {
+        // delete the previous query in the beforequery event or set
+        // combo.lastQuery = null (this will reload the store the next time it expands)
+        beforequery: function(qe){
+            delete qe.combo.lastQuery;
+        }
+    }
+});
+     * </code></pre>
+     * To make sure the filter in the store is not cleared the first time the ComboBox trigger is used
+     * configure the combo with <tt>lastQuery=''</tt>. Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'local',
+    triggerAction: 'all',
+    lastQuery: ''
+});
+     * </code></pre>
+     * @property lastQuery
+     * @type String
+     */
+
+    // private
+    initComponent : function(){
+        Ext.form.ComboBox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event expand
+             * Fires when the dropdown list is expanded
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'expand',
+            /**
+             * @event collapse
+             * Fires when the dropdown list is collapsed
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'collapse',
+
+            /**
+             * @event beforeselect
+             * Fires before a list item is selected. Return false to cancel the selection.
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'beforeselect',
+            /**
+             * @event select
+             * Fires when a list item is selected
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'select',
+            /**
+             * @event beforequery
+             * Fires before all queries are processed. Return false to cancel the query or set the queryEvent's
+             * cancel property to true.
+             * @param {Object} queryEvent An object that has these properties:<ul>
+             * <li><code>combo</code> : Ext.form.ComboBox <div class="sub-desc">This combo box</div></li>
+             * <li><code>query</code> : String <div class="sub-desc">The query</div></li>
+             * <li><code>forceAll</code> : Boolean <div class="sub-desc">True to force "all" query</div></li>
+             * <li><code>cancel</code> : Boolean <div class="sub-desc">Set to true to cancel the query</div></li>
+             * </ul>
+             */
+            'beforequery'
+        );
+        if(this.transform){
+            var s = Ext.getDom(this.transform);
+            if(!this.hiddenName){
+                this.hiddenName = s.name;
+            }
+            if(!this.store){
+                this.mode = 'local';
+                var d = [], opts = s.options;
+                for(var i = 0, len = opts.length;i < len; i++){
+                    var o = opts[i],
+                        value = (o.hasAttribute ? o.hasAttribute('value') : o.getAttributeNode('value').specified) ? o.value : o.text;
+                    if(o.selected && Ext.isEmpty(this.value, true)) {
+                        this.value = value;
+                    }
+                    d.push([value, o.text]);
+                }
+                this.store = new Ext.data.ArrayStore({
+                    idIndex: 0,
+                    fields: ['value', 'text'],
+                    data : d,
+                    autoDestroy: true
+                });
+                this.valueField = 'value';
+                this.displayField = 'text';
+            }
+            s.name = Ext.id(); // wipe out the name in case somewhere else they have a reference
+            if(!this.lazyRender){
+                this.target = true;
+                this.el = Ext.DomHelper.insertBefore(s, this.autoCreate || this.defaultAutoCreate);
+                this.render(this.el.parentNode, s);
+            }
+            Ext.removeNode(s);
+        }
+        //auto-configure store from local array data
+        else if(this.store){
+            this.store = Ext.StoreMgr.lookup(this.store);
+            if(this.store.autoCreated){
+                this.displayField = this.valueField = 'field1';
+                if(!this.store.expandData){
+                    this.displayField = 'field2';
+                }
+                this.mode = 'local';
+            }
+        }
+
+        this.selectedIndex = -1;
+        if(this.mode == 'local'){
+            if(!Ext.isDefined(this.initialConfig.queryDelay)){
+                this.queryDelay = 10;
+            }
+            if(!Ext.isDefined(this.initialConfig.minChars)){
+                this.minChars = 0;
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(this.hiddenName && !Ext.isDefined(this.submitValue)){
+            this.submitValue = false;
+        }
+        Ext.form.ComboBox.superclass.onRender.call(this, ct, position);
+        if(this.hiddenName){
+            this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName,
+                    id: (this.hiddenId || Ext.id())}, 'before', true);
+
+        }
+        if(Ext.isGecko){
+            this.el.dom.setAttribute('autocomplete', 'off');
+        }
+
+        if(!this.lazyInit){
+            this.initList();
+        }else{
+            this.on('focus', this.initList, this, {single: true});
+        }
+    },
+
+    // private
+    initValue : function(){
+        Ext.form.ComboBox.superclass.initValue.call(this);
+        if(this.hiddenField){
+            this.hiddenField.value =
+                Ext.value(Ext.isDefined(this.hiddenValue) ? this.hiddenValue : this.value, '');
+        }
+    },
+
+    getParentZIndex : function(){
+        var zindex;
+        if (this.ownerCt){
+            this.findParentBy(function(ct){
+                zindex = parseInt(ct.getPositionEl().getStyle('z-index'), 10);
+                return !!zindex;
+            });
+        }
+        return zindex;
+    },
+    
+    getZIndex : function(listParent){
+        listParent = listParent || Ext.getDom(this.getListParent() || Ext.getBody());
+        var zindex = parseInt(Ext.fly(listParent).getStyle('z-index'), 10);
+        if(!zindex){
+            zindex = this.getParentZIndex();
+        }
+        return (zindex || 12000) + 5;
+    },
+
+    // private
+    initList : function(){
+        if(!this.list){
+            var cls = 'x-combo-list',
+                listParent = Ext.getDom(this.getListParent() || Ext.getBody());
+
+            this.list = new Ext.Layer({
+                parentEl: listParent,
+                shadow: this.shadow,
+                cls: [cls, this.listClass].join(' '),
+                constrain:false,
+                zindex: this.getZIndex(listParent)
+            });
+
+            var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
+            this.list.setSize(lw, 0);
+            this.list.swallowEvent('mousewheel');
+            this.assetHeight = 0;
+            if(this.syncFont !== false){
+                this.list.setStyle('font-size', this.el.getStyle('font-size'));
+            }
+            if(this.title){
+                this.header = this.list.createChild({cls:cls+'-hd', html: this.title});
+                this.assetHeight += this.header.getHeight();
+            }
+
+            this.innerList = this.list.createChild({cls:cls+'-inner'});
+            this.mon(this.innerList, 'mouseover', this.onViewOver, this);
+            this.mon(this.innerList, 'mousemove', this.onViewMove, this);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+
+            if(this.pageSize){
+                this.footer = this.list.createChild({cls:cls+'-ft'});
+                this.pageTb = new Ext.PagingToolbar({
+                    store: this.store,
+                    pageSize: this.pageSize,
+                    renderTo:this.footer
+                });
+                this.assetHeight += this.footer.getHeight();
+            }
+
+            if(!this.tpl){
+                /**
+                * @cfg {String/Ext.XTemplate} tpl <p>The template string, or {@link Ext.XTemplate} instance to
+                * use to display each item in the dropdown list. The dropdown list is displayed in a
+                * DataView. See {@link #view}.</p>
+                * <p>The default template string is:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div class="x-combo-list-item">{' + this.displayField + '}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>Override the default value to create custom UI layouts for items in the list.
+                * For example:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div ext:qtip="{state}. {nick}" class="x-combo-list-item">{state}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>The template <b>must</b> contain one or more substitution parameters using field
+                * names from the Combo's</b> {@link #store Store}. In the example above an
+                * <pre>ext:qtip</pre> attribute is added to display other fields from the Store.</p>
+                * <p>To preserve the default visual look of list items, add the CSS class name
+                * <pre>x-combo-list-item</pre> to the template's container element.</p>
+                * <p>Also see {@link #itemSelector} for additional details.</p>
+                */
+                this.tpl = '<tpl for="."><div class="'+cls+'-item">{' + this.displayField + '}</div></tpl>';
+                /**
+                 * @cfg {String} itemSelector
+                 * <p>A simple CSS selector (e.g. div.some-class or span:first-child) that will be
+                 * used to determine what nodes the {@link #view Ext.DataView} which handles the dropdown
+                 * display will be working with.</p>
+                 * <p><b>Note</b>: this setting is <b>required</b> if a custom XTemplate has been
+                 * specified in {@link #tpl} which assigns a class other than <pre>'x-combo-list-item'</pre>
+                 * to dropdown list items</b>
+                 */
+            }
+
+            /**
+            * The {@link Ext.DataView DataView} used to display the ComboBox's options.
+            * @type Ext.DataView
+            */
+            this.view = new Ext.DataView({
+                applyTo: this.innerList,
+                tpl: this.tpl,
+                singleSelect: true,
+                selectedClass: this.selectedClass,
+                itemSelector: this.itemSelector || '.' + cls + '-item',
+                emptyText: this.listEmptyText,
+                deferEmptyText: false
+            });
+
+            this.mon(this.view, {
+                containerclick : this.onViewClick,
+                click : this.onViewClick,
+                scope :this
+            });
+
+            this.bindStore(this.store, true);
+
+            if(this.resizable){
+                this.resizer = new Ext.Resizable(this.list,  {
+                   pinned:true, handles:'se'
+                });
+                this.mon(this.resizer, 'resize', function(r, w, h){
+                    this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;
+                    this.listWidth = w;
+                    this.innerList.setWidth(w - this.list.getFrameWidth('lr'));
+                    this.restrictHeight();
+                }, this);
+
+                this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');
+            }
+        }
+    },
+
+    /**
+     * <p>Returns the element used to house this ComboBox's pop-up list. Defaults to the document body.</p>
+     * A custom implementation may be provided as a configuration option if the floating list needs to be rendered
+     * to a different Element. An example might be rendering the list inside a Menu so that clicking
+     * the list does not hide the Menu:<pre><code>
+var store = new Ext.data.ArrayStore({
+    autoDestroy: true,
+    fields: ['initials', 'fullname'],
+    data : [
+        ['FF', 'Fred Flintstone'],
+        ['BR', 'Barney Rubble']
+    ]
+});
+
+var combo = new Ext.form.ComboBox({
+    store: store,
+    displayField: 'fullname',
+    emptyText: 'Select a name...',
+    forceSelection: true,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon', //use iconCls if placing within menu to shift to right side of menu
+    mode: 'local',
+    selectOnFocus: true,
+    triggerAction: 'all',
+    typeAhead: true,
+    width: 135
+});
+
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+</code></pre>
+     */
+    getListParent : function() {
+        return document.body;
+    },
+
+    /**
+     * Returns the store associated with this combo.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    // private
+    bindStore : function(store, initial){
+        if(this.store && !initial){
+            if(this.store !== store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.onBeforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.collapse, this);
+            }
+            if(!store){
+                this.store = null;
+                if(this.view){
+                    this.view.bindStore(null);
+                }
+                if(this.pageTb){
+                    this.pageTb.bindStore(null);
+                }
+            }
+        }
+        if(store){
+            if(!initial) {
+                this.lastQuery = null;
+                if(this.pageTb) {
+                    this.pageTb.bindStore(store);
+                }
+            }
+
+            this.store = Ext.StoreMgr.lookup(store);
+            this.store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                load: this.onLoad,
+                exception: this.collapse
+            });
+
+            if(this.view){
+                this.view.bindStore(store);
+            }
+        }
+    },
+
+    reset : function(){
+        if(this.clearFilterOnReset && this.mode == 'local'){
+            this.store.clearFilter();
+        }
+        Ext.form.ComboBox.superclass.reset.call(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.ComboBox.superclass.initEvents.call(this);
+
+        /**
+         * @property keyNav
+         * @type Ext.KeyNav
+         * <p>A {@link Ext.KeyNav KeyNav} object which handles navigation keys for this ComboBox. This performs actions
+         * based on keystrokes typed when the input field is focused.</p>
+         * <p><b>After the ComboBox has been rendered</b>, you may override existing navigation key functionality,
+         * or add your own based upon key names as specified in the {@link Ext.KeyNav KeyNav} class.</p>
+         * <p>The function is executed in the scope (<code>this</code> reference of the ComboBox. Example:</p><pre><code>
+myCombo.keyNav.esc = function(e) {  // Override ESC handling function
+    this.collapse();                // Standard behaviour of Ext's ComboBox.
+    this.setValue(this.startValue); // We reset to starting value on ESC
+};
+myCombo.keyNav.tab = function() {   // Override TAB handling function
+    this.onViewClick(false);        // Select the currently highlighted row
+};
+</code></pre>
+         */
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "up" : function(e){
+                this.inKeyMode = true;
+                this.selectPrev();
+            },
+
+            "down" : function(e){
+                if(!this.isExpanded()){
+                    this.onTriggerClick();
+                }else{
+                    this.inKeyMode = true;
+                    this.selectNext();
+                }
+            },
+
+            "enter" : function(e){
+                this.onViewClick();
+            },
+
+            "esc" : function(e){
+                this.collapse();
+            },
+
+            "tab" : function(e){
+                if (this.forceSelection === true) {
+                    this.collapse();
+                } else {
+                    this.onViewClick(false);
+                }
+                return true;
+            },
+
+            scope : this,
+
+            doRelay : function(e, h, hname){
+                if(hname == 'down' || this.scope.isExpanded()){
+                    // this MUST be called before ComboBox#fireKey()
+                    var relay = Ext.KeyNav.prototype.doRelay.apply(this, arguments);
+                    if(!Ext.isIE && Ext.EventManager.useKeydown){
+                        // call Combo#fireKey() for browsers which use keydown event (except IE)
+                        this.scope.fireKey(e);
+                    }
+                    return relay;
+                }
+                return true;
+            },
+
+            forceKeyDown : true,
+            defaultEventAction: 'stopEvent'
+        });
+        this.queryDelay = Math.max(this.queryDelay || 10,
+                this.mode == 'local' ? 10 : 250);
+        this.dqTask = new Ext.util.DelayedTask(this.initQuery, this);
+        if(this.typeAhead){
+            this.taTask = new Ext.util.DelayedTask(this.onTypeAhead, this);
+        }
+        if(!this.enableKeyEvents){
+            this.mon(this.el, 'keyup', this.onKeyUp, this);
+        }
+    },
+
+
+    // private
+    onDestroy : function(){
+        if (this.dqTask){
+            this.dqTask.cancel();
+            this.dqTask = null;
+        }
+        this.bindStore(null);
+        Ext.destroy(
+            this.resizer,
+            this.view,
+            this.pageTb,
+            this.list
+        );
+        Ext.destroyMembers(this, 'hiddenField');
+        Ext.form.ComboBox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    fireKey : function(e){
+        if (!this.isExpanded()) {
+            Ext.form.ComboBox.superclass.fireKey.call(this, e);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.ComboBox.superclass.onResize.apply(this, arguments);
+        if(!isNaN(w) && this.isVisible() && this.list){
+            this.doResize(w);
+        }else{
+            this.bufferSize = w;
+        }
+    },
+
+    doResize: function(w){
+        if(!Ext.isDefined(this.listWidth)){
+            var lw = Math.max(w, this.minListWidth);
+            this.list.setWidth(lw);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.form.ComboBox.superclass.onEnable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = false;
+        }
+    },
+
+    // private
+    onDisable : function(){
+        Ext.form.ComboBox.superclass.onDisable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = true;
+        }
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        this.innerList.update(this.loadingText ?
+               '<div class="loading-indicator">'+this.loadingText+'</div>' : '');
+        this.restrictHeight();
+        this.selectedIndex = -1;
+    },
+
+    // private
+    onLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        if(this.store.getCount() > 0 || this.listEmptyText){
+            this.expand();
+            this.restrictHeight();
+            if(this.lastQuery == this.allQuery){
+                if(this.editable){
+                    this.el.dom.select();
+                }
+
+                if(this.autoSelect !== false && !this.selectByValue(this.value, true)){
+                    this.select(0, true);
+                }
+            }else{
+                if(this.autoSelect !== false){
+                    this.selectNext();
+                }
+                if(this.typeAhead && this.lastKey != Ext.EventObject.BACKSPACE && this.lastKey != Ext.EventObject.DELETE){
+                    this.taTask.delay(this.typeAheadDelay);
+                }
+            }
+        }else{
+            this.collapse();
+        }
+
+    },
+
+    // private
+    onTypeAhead : function(){
+        if(this.store.getCount() > 0){
+            var r = this.store.getAt(0);
+            var newValue = r.data[this.displayField];
+            var len = newValue.length;
+            var selStart = this.getRawValue().length;
+            if(selStart != len){
+                this.setRawValue(newValue);
+                this.selectText(selStart, newValue.length);
+            }
+        }
+    },
+
+    // private
+    assertValue : function(){
+        var val = this.getRawValue(),
+            rec;
+
+        if(this.valueField && Ext.isDefined(this.value)){
+            rec = this.findRecord(this.valueField, this.value);
+        }
+        if(!rec || rec.get(this.displayField) != val){
+            rec = this.findRecord(this.displayField, val);
+        }
+        if(!rec && this.forceSelection){
+            if(val.length > 0 && val != this.emptyText){
+                this.el.dom.value = Ext.value(this.lastSelectionText, '');
+                this.applyEmptyText();
+            }else{
+                this.clearValue();
+            }
+        }else{
+            if(rec && this.valueField){
+                // onSelect may have already set the value and by doing so
+                // set the display field properly.  Let's not wipe out the
+                // valueField here by just sending the displayField.
+                if (this.value == val){
+                    return;
+                }
+                val = rec.get(this.valueField || this.displayField);
+            }
+            this.setValue(val);
+        }
+    },
+
+    // private
+    onSelect : function(record, index){
+        if(this.fireEvent('beforeselect', this, record, index) !== false){
+            this.setValue(record.data[this.valueField || this.displayField]);
+            this.collapse();
+            this.fireEvent('select', this, record, index);
+        }
+    },
+
+    // inherit docs
+    getName: function(){
+        var hf = this.hiddenField;
+        return hf && hf.name ? hf.name : this.hiddenName || Ext.form.ComboBox.superclass.getName.call(this);
+    },
+
+    /**
+     * Returns the currently selected field value or empty string if no value is set.
+     * @return {String} value The selected value
+     */
+    getValue : function(){
+        if(this.valueField){
+            return Ext.isDefined(this.value) ? this.value : '';
+        }else{
+            return Ext.form.ComboBox.superclass.getValue.call(this);
+        }
+    },
+
+    /**
+     * Clears any text/value currently set in the field
+     */
+    clearValue : function(){
+        if(this.hiddenField){
+            this.hiddenField.value = '';
+        }
+        this.setRawValue('');
+        this.lastSelectionText = '';
+        this.applyEmptyText();
+        this.value = '';
+    },
+
+    /**
+     * Sets the specified value into the field.  If the value finds a match, the corresponding record text
+     * will be displayed in the field.  If the value does not match the data value of an existing item,
+     * and the valueNotFoundText config option is defined, it will be displayed as the default field text.
+     * Otherwise the field will be blank (although the value will still be set).
+     * @param {String} value The value to match
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var text = v;
+        if(this.valueField){
+            var r = this.findRecord(this.valueField, v);
+            if(r){
+                text = r.data[this.displayField];
+            }else if(Ext.isDefined(this.valueNotFoundText)){
+                text = this.valueNotFoundText;
+            }
+        }
+        this.lastSelectionText = text;
+        if(this.hiddenField){
+            this.hiddenField.value = Ext.value(v, '');
+        }
+        Ext.form.ComboBox.superclass.setValue.call(this, text);
+        this.value = v;
+        return this;
+    },
+
+    // private
+    findRecord : function(prop, value){
+        var record;
+        if(this.store.getCount() > 0){
+            this.store.each(function(r){
+                if(r.data[prop] == value){
+                    record = r;
+                    return false;
+                }
+            });
+        }
+        return record;
+    },
+
+    // private
+    onViewMove : function(e, t){
+        this.inKeyMode = false;
+    },
+
+    // private
+    onViewOver : function(e, t){
+        if(this.inKeyMode){ // prevent key nav and mouse over conflicts
+            return;
+        }
+        var item = this.view.findItemFromChild(t);
+        if(item){
+            var index = this.view.indexOf(item);
+            this.select(index, false);
+        }
+    },
+
+    // private
+    onViewClick : function(doFocus){
+        var index = this.view.getSelectedIndexes()[0],
+            s = this.store,
+            r = s.getAt(index);
+        if(r){
+            this.onSelect(r, index);
+        }else {
+            this.collapse();
+        }
+        if(doFocus !== false){
+            this.el.focus();
+        }
+    },
+
+
+    // private
+    restrictHeight : function(){
+        this.innerList.dom.style.height = '';
+        var inner = this.innerList.dom,
+            pad = this.list.getFrameWidth('tb') + (this.resizable ? this.handleHeight : 0) + this.assetHeight,
+            h = Math.max(inner.clientHeight, inner.offsetHeight, inner.scrollHeight),
+            ha = this.getPosition()[1]-Ext.getBody().getScroll().top,
+            hb = Ext.lib.Dom.getViewHeight()-ha-this.getSize().height,
+            space = Math.max(ha, hb, this.minHeight || 0)-this.list.shadowOffset-pad-5;
+
+        h = Math.min(h, space, this.maxHeight);
+
+        this.innerList.setHeight(h);
+        this.list.beginUpdate();
+        this.list.setHeight(h+pad);
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+        this.list.endUpdate();
+    },
+
+    /**
+     * Returns true if the dropdown list is expanded, else false.
+     */
+    isExpanded : function(){
+        return this.list && this.list.isVisible();
+    },
+
+    /**
+     * Select an item in the dropdown list by its data value. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {String} value The data value of the item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     * @return {Boolean} True if the value matched an item in the list, else false
+     */
+    selectByValue : function(v, scrollIntoView){
+        if(!Ext.isEmpty(v, true)){
+            var r = this.findRecord(this.valueField || this.displayField, v);
+            if(r){
+                this.select(this.store.indexOf(r), scrollIntoView);
+                return true;
+            }
+        }
+        return false;
+    },
+
+    /**
+     * Select an item in the dropdown list by its numeric index in the list. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {Number} index The zero-based index of the list item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     */
+    select : function(index, scrollIntoView){
+        this.selectedIndex = index;
+        this.view.select(index);
+        if(scrollIntoView !== false){
+            var el = this.view.getNode(index);
+            if(el){
+                this.innerList.scrollChildIntoView(el, false);
+            }
+        }
+
+    },
+
+    // private
+    selectNext : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex < ct-1){
+                this.select(this.selectedIndex+1);
+            }
+        }
+    },
+
+    // private
+    selectPrev : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex !== 0){
+                this.select(this.selectedIndex-1);
+            }
+        }
+    },
+
+    // private
+    onKeyUp : function(e){
+        var k = e.getKey();
+        if(this.editable !== false && this.readOnly !== true && (k == e.BACKSPACE || !e.isSpecialKey())){
+
+            this.lastKey = k;
+            this.dqTask.delay(this.queryDelay);
+        }
+        Ext.form.ComboBox.superclass.onKeyUp.call(this, e);
+    },
+
+    // private
+    validateBlur : function(){
+        return !this.list || !this.list.isVisible();
+    },
+
+    // private
+    initQuery : function(){
+        this.doQuery(this.getRawValue());
+    },
+
+    // private
+    beforeBlur : function(){
+        this.assertValue();
+    },
+
+    // private
+    postBlur  : function(){
+        Ext.form.ComboBox.superclass.postBlur.call(this);
+        this.collapse();
+        this.inKeyMode = false;
+    },
+
+    /**
+     * Execute a query to filter the dropdown list.  Fires the {@link #beforequery} event prior to performing the
+     * query allowing the query action to be canceled if needed.
+     * @param {String} query The SQL query to execute
+     * @param {Boolean} forceAll <tt>true</tt> to force the query to execute even if there are currently fewer
+     * characters in the field than the minimum specified by the <tt>{@link #minChars}</tt> config option.  It
+     * also clears any filter previously saved in the current store (defaults to <tt>false</tt>)
+     */
+    doQuery : function(q, forceAll){
+        q = Ext.isEmpty(q) ? '' : q;
+        var qe = {
+            query: q,
+            forceAll: forceAll,
+            combo: this,
+            cancel:false
+        };
+        if(this.fireEvent('beforequery', qe)===false || qe.cancel){
+            return false;
+        }
+        q = qe.query;
+        forceAll = qe.forceAll;
+        if(forceAll === true || (q.length >= this.minChars)){
+            if(this.lastQuery !== q){
+                this.lastQuery = q;
+                if(this.mode == 'local'){
+                    this.selectedIndex = -1;
+                    if(forceAll){
+                        this.store.clearFilter();
+                    }else{
+                        this.store.filter(this.displayField, q);
+                    }
+                    this.onLoad();
+                }else{
+                    this.store.baseParams[this.queryParam] = q;
+                    this.store.load({
+                        params: this.getParams(q)
+                    });
+                    this.expand();
+                }
+            }else{
+                this.selectedIndex = -1;
+                this.onLoad();
+            }
+        }
+    },
+
+    // private
+    getParams : function(q){
+        var params = {},
+            paramNames = this.store.paramNames;
+        if(this.pageSize){
+            params[paramNames.start] = 0;
+            params[paramNames.limit] = this.pageSize;
+        }
+        return params;
+    },
+
+    /**
+     * Hides the dropdown list if it is currently expanded. Fires the {@link #collapse} event on completion.
+     */
+    collapse : function(){
+        if(!this.isExpanded()){
+            return;
+        }
+        this.list.hide();
+        Ext.getDoc().un('mousewheel', this.collapseIf, this);
+        Ext.getDoc().un('mousedown', this.collapseIf, this);
+        this.fireEvent('collapse', this);
+    },
+
+    // private
+    collapseIf : function(e){
+        if(!this.isDestroyed && !e.within(this.wrap) && !e.within(this.list)){
+            this.collapse();
+        }
+    },
+
+    /**
+     * Expands the dropdown list if it is currently hidden. Fires the {@link #expand} event on completion.
+     */
+    expand : function(){
+        if(this.isExpanded() || !this.hasFocus){
+            return;
+        }
+
+        if(this.title || this.pageSize){
+            this.assetHeight = 0;
+            if(this.title){
+                this.assetHeight += this.header.getHeight();
+            }
+            if(this.pageSize){
+                this.assetHeight += this.footer.getHeight();
+            }
+        }
+
+        if(this.bufferSize){
+            this.doResize(this.bufferSize);
+            delete this.bufferSize;
+        }
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+
+        // zindex can change, re-check it and set it if necessary
+        this.list.setZIndex(this.getZIndex());
+        this.list.show();
+        if(Ext.isGecko2){
+            this.innerList.setOverflow('auto'); // necessary for FF 2.0/Mac
+        }
+        this.mon(Ext.getDoc(), {
+            scope: this,
+            mousewheel: this.collapseIf,
+            mousedown: this.collapseIf
+        });
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function
+    onTriggerClick : function(){
+        if(this.readOnly || this.disabled){
+            return;
+        }
+        if(this.isExpanded()){
+            this.collapse();
+            this.el.focus();
+        }else {
+            this.onFocus({});
+            if(this.triggerAction == 'all') {
+                this.doQuery(this.allQuery, true);
+            } else {
+                this.doQuery(this.getRawValue());
+            }
+            this.el.focus();
+        }
+    }
+
+    /**
+     * @hide
+     * @method autoSize
+     */
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+
+});
+Ext.reg('combo', Ext.form.ComboBox);
+/**
+ * @class Ext.form.Checkbox
+ * @extends Ext.form.Field
+ * Single checkbox field.  Can be used as a direct replacement for traditional checkbox fields.
+ * @constructor
+ * Creates a new Checkbox
+ * @param {Object} config Configuration options
+ * @xtype checkbox
+ */
+Ext.form.Checkbox = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
+     */
+    focusClass : undefined,
+    /**
+     * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {Boolean} checked <tt>true</tt> if the checkbox should render initially checked (defaults to <tt>false</tt>)
+     */
+    checked : false,
+    /**
+     * @cfg {String} boxLabel The text that appears beside the checkbox
+     */
+    boxLabel: '&#160;',
+    /**
+     * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
+     * {tag: 'input', type: 'checkbox', autocomplete: 'off'})
+     */
+    defaultAutoCreate : { tag: 'input', type: 'checkbox', autocomplete: 'off'},
+    /**
+     * @cfg {String} inputValue The value that should go into the generated input element's value attribute
+     */
+    /**
+     * @cfg {Function} handler A function called when the {@link #checked} value changes (can be used instead of
+     * handling the check event). The handler is passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>checkbox</b> : Ext.form.Checkbox<div class="sub-desc">The Checkbox being toggled.</div></li>
+     * <li><b>checked</b> : Boolean<div class="sub-desc">The new checked state of the checkbox.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope An object to use as the scope ('this' reference) of the {@link #handler} function
+     * (defaults to this Checkbox).
+     */
+
+    // private
+    actionMode : 'wrap',
+
+	// private
+    initComponent : function(){
+        Ext.form.Checkbox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event check
+             * Fires when the checkbox is checked or unchecked.
+             * @param {Ext.form.Checkbox} this This checkbox
+             * @param {Boolean} checked The new checked value
+             */
+            'check'
+        );
+    },
+
+    // private
+    onResize : function(){
+        Ext.form.Checkbox.superclass.onResize.apply(this, arguments);
+        if(!this.boxLabel && !this.fieldLabel){
+            this.el.alignTo(this.wrap, 'c-c');
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.Checkbox.superclass.initEvents.call(this);
+        this.mon(this.el, {
+            scope: this,
+            click: this.onClick,
+            change: this.onClick
+        });
+    },
+
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.Checkbox.superclass.onRender.call(this, ct, position);
+        if(this.inputValue !== undefined){
+            this.el.dom.value = this.inputValue;
+        }
+        this.wrap = this.el.wrap({cls: 'x-form-check-wrap'});
+        if(this.boxLabel){
+            this.wrap.createChild({tag: 'label', htmlFor: this.el.id, cls: 'x-form-cb-label', html: this.boxLabel});
+        }
+        if(this.checked){
+            this.setValue(true);
+        }else{
+            this.checked = this.el.dom.checked;
+        }
+        // Need to repaint for IE, otherwise positioning is broken
+        if (Ext.isIE && !Ext.isStrict) {
+            this.wrap.repaint();
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.wrap);
+        Ext.form.Checkbox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initValue : function() {
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Returns the checked state of the checkbox.
+     * @return {Boolean} True if checked, else false
+     */
+    getValue : function(){
+        if(this.rendered){
+            return this.el.dom.checked;
+        }
+        return this.checked;
+    },
+
+	// private
+    onClick : function(){
+        if(this.el.dom.checked != this.checked){
+            this.setValue(this.el.dom.checked);
+        }
+    },
+
+    /**
+     * Sets the checked state of the checkbox, fires the 'check' event, and calls a
+     * <code>{@link #handler}</code> (if configured).
+     * @param {Boolean/String} checked The following values will check the checkbox:
+     * <code>true, 'true', '1', or 'on'</code>. Any other value will uncheck the checkbox.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var checked = this.checked,
+            inputVal = this.inputValue;
+            
+        if (v === false) {
+            this.checked = false;
+        } else {
+            this.checked = (v === true || v === 'true' || v == '1' || (inputVal ? v == inputVal : String(v).toLowerCase() == 'on'));
+        }
+        
+        if(this.rendered){
+            this.el.dom.checked = this.checked;
+            this.el.dom.defaultChecked = this.checked;
+        }
+        if(checked != this.checked){
+            this.fireEvent('check', this, this.checked);
+            if(this.handler){
+                this.handler.call(this.scope || this, this, this.checked);
+            }
+        }
+        return this;
+    }
+});
+Ext.reg('checkbox', Ext.form.Checkbox);
+/**
+ * @class Ext.form.CheckboxGroup
+ * @extends Ext.form.Field
+ * <p>A grouping container for {@link Ext.form.Checkbox} controls.</p>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var myCheckboxGroup = new Ext.form.CheckboxGroup({
+    id:'myGroup',
+    xtype: 'checkboxgroup',
+    fieldLabel: 'Single Column',
+    itemCls: 'x-check-group-alt',
+    // Put all controls in a single column with width 100%
+    columns: 1,
+    items: [
+        {boxLabel: 'Item 1', name: 'cb-col-1'},
+        {boxLabel: 'Item 2', name: 'cb-col-2', checked: true},
+        {boxLabel: 'Item 3', name: 'cb-col-3'}
+    ]
+});
+ * </code></pre>
+ * @constructor
+ * Creates a new CheckboxGroup
+ * @param {Object} config Configuration options
+ * @xtype checkboxgroup
+ */
+Ext.form.CheckboxGroup = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Checkbox Checkbox}es or Checkbox config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {String/Number/Array} columns Specifies the number of columns to use when displaying grouped
+     * checkbox/radio controls using automatic layout.  This config can take several types of values:
+     * <ul><li><b>'auto'</b> : <p class="sub-desc">The controls will be rendered one per column on one row and the width
+     * of each column will be evenly distributed based on the width of the overall field container. This is the default.</p></li>
+     * <li><b>Number</b> : <p class="sub-desc">If you specific a number (e.g., 3) that number of columns will be
+     * created and the contained controls will be automatically distributed based on the value of {@link #vertical}.</p></li>
+     * <li><b>Array</b> : Object<p class="sub-desc">You can also specify an array of column widths, mixing integer
+     * (fixed width) and float (percentage width) values as needed (e.g., [100, .25, .75]). Any integer values will
+     * be rendered first, then any float values will be calculated as a percentage of the remaining space. Float
+     * values do not have to add up to 1 (100%) although if you want the controls to take up the entire field
+     * container you should do so.</p></li></ul>
+     */
+    columns : 'auto',
+    /**
+     * @cfg {Boolean} vertical True to distribute contained controls across columns, completely filling each column
+     * top to bottom before starting on the next column.  The number of controls in each column will be automatically
+     * calculated to keep columns as even as possible.  The default value is false, so that controls will be added
+     * to columns one at a time, completely filling each row left to right before starting on the next row.
+     */
+    vertical : false,
+    /**
+     * @cfg {Boolean} allowBlank False to validate that at least one item in the group is checked (defaults to true).
+     * If no items are selected at validation time, {@link @blankText} will be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails (defaults to "You must
+     * select at least one item in this group")
+     */
+    blankText : "You must select at least one item in this group",
+
+    // private
+    defaultType : 'checkbox',
+
+    // private
+    groupCls : 'x-form-check-group',
+
+    // private
+    initComponent: function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires when the state of a child checkbox changes.
+             * @param {Ext.form.CheckboxGroup} this
+             * @param {Array} checked An array containing the checked boxes.
+             */
+            'change'
+        );
+        this.on('change', this.validate, this);
+        Ext.form.CheckboxGroup.superclass.initComponent.call(this);
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var panelCfg = {
+                autoEl: {
+                    id: this.id
+                },
+                cls: this.groupCls,
+                layout: 'column',
+                renderTo: ct,
+                bufferResize: false // Default this to false, since it doesn't really have a proper ownerCt.
+            };
+            var colCfg = {
+                xtype: 'container',
+                defaultType: this.defaultType,
+                layout: 'form',
+                defaults: {
+                    hideLabel: true,
+                    anchor: '100%'
+                }
+            };
+
+            if(this.items[0].items){
+
+                // The container has standard ColumnLayout configs, so pass them in directly
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: this.items.length},
+                    defaults: this.defaults,
+                    items: this.items
+                });
+                for(var i=0, len=this.items.length; i<len; i++){
+                    Ext.applyIf(this.items[i], colCfg);
+                }
+
+            }else{
+
+                // The container has field item configs, so we have to generate the column
+                // panels first then move the items into the columns as needed.
+
+                var numCols, cols = [];
+
+                if(typeof this.columns == 'string'){ // 'auto' so create a col per item
+                    this.columns = this.items.length;
+                }
+                if(!Ext.isArray(this.columns)){
+                    var cs = [];
+                    for(var i=0; i<this.columns; i++){
+                        cs.push((100/this.columns)*.01); // distribute by even %
+                    }
+                    this.columns = cs;
+                }
+
+                numCols = this.columns.length;
+
+                // Generate the column configs with the correct width setting
+                for(var i=0; i<numCols; i++){
+                    var cc = Ext.apply({items:[]}, colCfg);
+                    cc[this.columns[i] <= 1 ? 'columnWidth' : 'width'] = this.columns[i];
+                    if(this.defaults){
+                        cc.defaults = Ext.apply(cc.defaults || {}, this.defaults);
+                    }
+                    cols.push(cc);
+                };
+
+                // Distribute the original items into the columns
+                if(this.vertical){
+                    var rows = Math.ceil(this.items.length / numCols), ri = 0;
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        if(i>0 && i%rows==0){
+                            ri++;
+                        }
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ri].items.push(this.items[i]);
+                    };
+                }else{
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        var ci = i % numCols;
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ci].items.push(this.items[i]);
+                    };
+                }
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: numCols},
+                    items: cols
+                });
+            }
+
+            this.panel = new Ext.Container(panelCfg);
+            this.panel.ownerCt = this;
+            this.el = this.panel.getEl();
+
+            if(this.forId && this.itemCls){
+                var l = this.el.up(this.itemCls).child('label', true);
+                if(l){
+                    l.setAttribute('htmlFor', this.forId);
+                }
+            }
+
+            var fields = this.panel.findBy(function(c){
+                return c.isFormField;
+            }, this);
+
+            this.items = new Ext.util.MixedCollection();
+            this.items.addAll(fields);
+        }
+        Ext.form.CheckboxGroup.superclass.onRender.call(this, ct, position);
+    },
+
+    initValue : function(){
+        if(this.value){
+            this.setValue.apply(this, this.buffered ? this.value : [this.value]);
+            delete this.buffered;
+            delete this.value;
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.CheckboxGroup.superclass.afterRender.call(this);
+        this.eachItem(function(item){
+            item.on('check', this.fireChecked, this);
+            item.inGroup = true;
+        });
+    },
+
+    // private
+    doLayout: function(){
+        //ugly method required to layout hidden items
+        if(this.rendered){
+            this.panel.forceLayout = this.ownerCt.forceLayout;
+            this.panel.doLayout();
+        }
+    },
+
+    // private
+    fireChecked: function(){
+        var arr = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                arr.push(item);
+            }
+        });
+        this.fireEvent('change', this, arr);
+    },
+    
+    /**
+     * Runs CheckboxGroup's validations and returns an array of any errors. The only error by default
+     * is if allowBlank is set to true and no items are checked.
+     * @return {Array} Array of all validation errors
+     */
+    getErrors: function() {
+        var errors = Ext.form.CheckboxGroup.superclass.getErrors.apply(this, arguments);
+        
+        if (!this.allowBlank) {
+            var blank = true;
+            
+            this.eachItem(function(f){
+                if (f.checked) {
+                    return (blank = false);
+                }
+            });
+            
+            if (blank) errors.push(this.blankText);
+        }
+        
+        return errors;
+    },
+
+    // private
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        
+        return dirty;
+    },
+
+    // private
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        this.panel.setSize(w, h);
+        this.panel.doLayout();
+    },
+
+    // inherit docs from Field
+    reset : function(){
+        if (this.originalValue) {
+            // Clear all items
+            this.eachItem(function(c){
+                if(c.setValue){
+                    c.setValue(false);
+                    c.originalValue = c.getValue();
+                }
+            });
+            // Set items stored in originalValue, ugly - set a flag to reset the originalValue
+            // during the horrible onSetValue.  This will allow trackResetOnLoad to function.
+            this.resetOriginal = true;
+            this.setValue(this.originalValue);
+            delete this.resetOriginal;
+        } else {
+            this.eachItem(function(c){
+                if(c.reset){
+                    c.reset();
+                }
+            });
+        }
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+
+    /**
+     * {@link Ext.form.Checkbox#setValue Set the value(s)} of an item or items
+     * in the group. Examples illustrating how this method may be called:
+     * <pre><code>
+// call with name and value
+myCheckboxGroup.setValue('cb-col-1', true);
+// call with an array of boolean values
+myCheckboxGroup.setValue([true, false, false]);
+// call with an object literal specifying item:value pairs
+myCheckboxGroup.setValue({
+    'cb-col-2': false,
+    'cb-col-3': true
+});
+// use comma separated string to set items with name to true (checked)
+myCheckboxGroup.setValue('cb-col-1,cb-col-3');
+     * </code></pre>
+     * See {@link Ext.form.Checkbox#setValue} for additional information.
+     * @param {Mixed} id The checkbox to check, or as described by example shown.
+     * @param {Boolean} value (optional) The value to set the item.
+     * @return {Ext.form.CheckboxGroup} this
+     */
+    setValue: function(){
+        if(this.rendered){
+            this.onSetValue.apply(this, arguments);
+        }else{
+            this.buffered = true;
+            this.value = arguments;
+        }
+        return this;
+    },
+
+    /**
+     * @private
+     * Sets the values of one or more of the items within the CheckboxGroup
+     * @param {String|Array|Object} id Can take multiple forms. Can be optionally:
+     * <ul>
+     *   <li>An ID string to be used with a second argument</li>
+     *   <li>An array of the form ['some', 'list', 'of', 'ids', 'to', 'mark', 'checked']</li>
+     *   <li>An array in the form [true, true, false, true, false] etc, where each item relates to the check status of
+     *       the checkbox at the same index</li>
+     *   <li>An object containing ids of the checkboxes as keys and check values as properties</li>
+     * </ul>
+     * @param {String} value The value to set the field to if the first argument was a string
+     */
+    onSetValue: function(id, value){
+        if(arguments.length == 1){
+            if(Ext.isArray(id)){
+                Ext.each(id, function(val, idx){
+                    if (Ext.isObject(val) && val.setValue){ // array of checkbox components to be checked
+                        val.setValue(true);
+                        if (this.resetOriginal === true) {
+                            val.originalValue = val.getValue();
+                        }
+                    } else { // an array of boolean values
+                        var item = this.items.itemAt(idx);
+                        if(item){
+                            item.setValue(val);
+                        }
+                    }
+                }, this);
+            }else if(Ext.isObject(id)){
+                // set of name/value pairs
+                for(var i in id){
+                    var f = this.getBox(i);
+                    if(f){
+                        f.setValue(id[i]);
+                    }
+                }
+            }else{
+                this.setValueForItem(id);
+            }
+        }else{
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+            }
+        }
+    },
+
+    // private
+    beforeDestroy: function(){
+        Ext.destroy(this.panel);
+        if (!this.rendered) {
+            Ext.destroy(this.items);
+        }
+        Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this);
+
+    },
+
+    setValueForItem : function(val){
+        val = String(val).split(',');
+        this.eachItem(function(item){
+            if(val.indexOf(item.inputValue)> -1){
+                item.setValue(true);
+            }
+        });
+    },
+
+    // private
+    getBox : function(id){
+        var box = null;
+        this.eachItem(function(f){
+            if(id == f || f.dataIndex == id || f.id == id || f.getName() == id){
+                box = f;
+                return false;
+            }
+        });
+        return box;
+    },
+
+    /**
+     * Gets an array of the selected {@link Ext.form.Checkbox} in the group.
+     * @return {Array} An array of the selected checkboxes.
+     */
+    getValue : function(){
+        var out = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                out.push(item);
+            }
+        });
+        return out;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @cfg {String} name
+     * @hide
+     */
+
+    /**
+     * @method getRawValue
+     * @hide
+     */
+    getRawValue : Ext.emptyFn,
+
+    /**
+     * @method setRawValue
+     * @hide
+     */
+    setRawValue : Ext.emptyFn
+
+});
+
+Ext.reg('checkboxgroup', Ext.form.CheckboxGroup);
+/**
+ * @class Ext.form.CompositeField
+ * @extends Ext.form.Field
+ * Composite field allowing a number of form Fields to be rendered on the same row. The fields are rendered
+ * using an hbox layout internally, so all of the normal HBox layout config items are available. Example usage:
+ * <pre>
+{
+    xtype: 'compositefield',
+    labelWidth: 120
+    items: [
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Title',
+            width     : 20
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'First',
+            flex      : 1
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Last',
+            flex      : 1
+        }
+    ]
+}
+ * </pre>
+ * In the example above the composite's fieldLabel will be set to 'Title, First, Last' as it groups the fieldLabels
+ * of each of its children. This can be overridden by setting a fieldLabel on the compositefield itself:
+ * <pre>
+{
+    xtype: 'compositefield',
+    fieldLabel: 'Custom label',
+    items: [...]
+}
+ * </pre>
+ * Any Ext.form.* component can be placed inside a composite field.
+ */
+Ext.form.CompositeField = Ext.extend(Ext.form.Field, {
+
+    /**
+     * @property defaultMargins
+     * @type String
+     * The margins to apply by default to each field in the composite
+     */
+    defaultMargins: '0 5 0 0',
+
+    /**
+     * @property skipLastItemMargin
+     * @type Boolean
+     * If true, the defaultMargins are not applied to the last item in the composite field set (defaults to true)
+     */
+    skipLastItemMargin: true,
+
+    /**
+     * @property isComposite
+     * @type Boolean
+     * Signifies that this is a Composite field
+     */
+    isComposite: true,
+
+    /**
+     * @property combineErrors
+     * @type Boolean
+     * True to combine errors from the individual fields into a single error message at the CompositeField level (defaults to true)
+     */
+    combineErrors: true,
+    
+    /**
+     * @cfg {String} labelConnector The string to use when joining segments of the built label together (defaults to ', ')
+     */
+    labelConnector: ', ',
+    
+    /**
+     * @cfg {Object} defaults Any default properties to assign to the child fields.
+     */
+
+    //inherit docs
+    //Builds the composite field label
+    initComponent: function() {
+        var labels = [],
+            items  = this.items,
+            item;
+
+        for (var i=0, j = items.length; i < j; i++) {
+            item = items[i];
+            
+            if (!Ext.isEmpty(item.ref)){
+                item.ref = '../' + item.ref;
+            }
+
+            labels.push(item.fieldLabel);
+
+            //apply any defaults
+            Ext.applyIf(item, this.defaults);
+
+            //apply default margins to each item except the last
+            if (!(i == j - 1 && this.skipLastItemMargin)) {
+                Ext.applyIf(item, {margins: this.defaultMargins});
+            }
+        }
+
+        this.fieldLabel = this.fieldLabel || this.buildLabel(labels);
+
+        /**
+         * @property fieldErrors
+         * @type Ext.util.MixedCollection
+         * MixedCollection of current errors on the Composite's subfields. This is used internally to track when
+         * to show and hide error messages at the Composite level. Listeners are attached to the MixedCollection's
+         * add, remove and replace events to update the error icon in the UI as errors are added or removed.
+         */
+        this.fieldErrors = new Ext.util.MixedCollection(true, function(item) {
+            return item.field;
+        });
+
+        this.fieldErrors.on({
+            scope  : this,
+            add    : this.updateInvalidMark,
+            remove : this.updateInvalidMark,
+            replace: this.updateInvalidMark
+        });
+
+        Ext.form.CompositeField.superclass.initComponent.apply(this, arguments);
+        
+        this.innerCt = new Ext.Container({
+            layout  : 'hbox',
+            items   : this.items,
+            cls     : 'x-form-composite',
+            defaultMargins: '0 3 0 0',
+            ownerCt: this
+        });
+        this.innerCt.ownerCt = undefined;
+        
+        var fields = this.innerCt.findBy(function(c) {
+            return c.isFormField;
+        }, this);
+
+        /**
+         * @property items
+         * @type Ext.util.MixedCollection
+         * Internal collection of all of the subfields in this Composite
+         */
+        this.items = new Ext.util.MixedCollection();
+        this.items.addAll(fields);
+        
+    },
+
+    /**
+     * @private
+     * Creates an internal container using hbox and renders the fields to it
+     */
+    onRender: function(ct, position) {
+        if (!this.el) {
+            /**
+             * @property innerCt
+             * @type Ext.Container
+             * A container configured with hbox layout which is responsible for laying out the subfields
+             */
+            var innerCt = this.innerCt;
+            innerCt.render(ct);
+
+            this.el = innerCt.getEl();
+
+            //if we're combining subfield errors into a single message, override the markInvalid and clearInvalid
+            //methods of each subfield and show them at the Composite level instead
+            if (this.combineErrors) {
+                this.eachItem(function(field) {
+                    Ext.apply(field, {
+                        markInvalid : this.onFieldMarkInvalid.createDelegate(this, [field], 0),
+                        clearInvalid: this.onFieldClearInvalid.createDelegate(this, [field], 0)
+                    });
+                });
+            }
+
+            //set the label 'for' to the first item
+            var l = this.el.parent().parent().child('label', true);
+            if (l) {
+                l.setAttribute('for', this.items.items[0].id);
+            }
+        }
+
+        Ext.form.CompositeField.superclass.onRender.apply(this, arguments);
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's markInvalid method is called.
+     * By default this just adds the subfield's error to the internal fieldErrors MixedCollection
+     * @param {Ext.form.Field} field The field that was marked invalid
+     * @param {String} message The error message
+     */
+    onFieldMarkInvalid: function(field, message) {
+        var name  = field.getName(),
+            error = {
+                field: name, 
+                errorName: field.fieldLabel || name,
+                error: message
+            };
+
+        this.fieldErrors.replace(name, error);
+
+        if (!field.preventMark) {
+            field.el.addClass(field.invalidClass);
+        }
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's clearInvalid method is called.
+     * By default this just updates the internal fieldErrors MixedCollection.
+     * @param {Ext.form.Field} field The field that was marked invalid
+     */
+    onFieldClearInvalid: function(field) {
+        this.fieldErrors.removeKey(field.getName());
+
+        field.el.removeClass(field.invalidClass);
+    },
+
+    /**
+     * @private
+     * Called after a subfield is marked valid or invalid, this checks to see if any of the subfields are
+     * currently invalid. If any subfields are invalid it builds a combined error message marks the composite
+     * invalid, otherwise clearInvalid is called
+     */
+    updateInvalidMark: function() {
+        var ieStrict = Ext.isIE6 && Ext.isStrict;
+
+        if (this.fieldErrors.length == 0) {
+            this.clearInvalid();
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.clearInvalid.defer(50, this);
+            }
+        } else {
+            var message = this.buildCombinedErrorMessage(this.fieldErrors.items);
+
+            this.sortErrors();
+            this.markInvalid(message);
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.markInvalid(message);
+            }
+        }
+    },
+
+    /**
+     * Performs validation checks on each subfield and returns false if any of them fail validation.
+     * @return {Boolean} False if any subfield failed validation
+     */
+    validateValue: function(value, preventMark) {
+        var valid = true;
+
+        this.eachItem(function(field) {
+            if (!field.isValid(preventMark)) {
+                valid = false;
+            }
+        });
+
+        return valid;
+    },
+
+    /**
+     * Takes an object containing error messages for contained fields, returning a combined error
+     * string (defaults to just placing each item on a new line). This can be overridden to provide
+     * custom combined error message handling.
+     * @param {Array} errors Array of errors in format: [{field: 'title', error: 'some error'}]
+     * @return {String} The combined error message
+     */
+    buildCombinedErrorMessage: function(errors) {
+        var combined = [],
+            error;
+
+        for (var i = 0, j = errors.length; i < j; i++) {
+            error = errors[i];
+
+            combined.push(String.format("{0}: {1}", error.errorName, error.error));
+        }
+
+        return combined.join("<br />");
+    },
+
+    /**
+     * Sorts the internal fieldErrors MixedCollection by the order in which the fields are defined.
+     * This is called before displaying errors to ensure that the errors are presented in the expected order.
+     * This function can be overridden to provide a custom sorting order if needed.
+     */
+    sortErrors: function() {
+        var fields = this.items;
+
+        this.fieldErrors.sort("ASC", function(a, b) {
+            var findByName = function(key) {
+                return function(field) {
+                    return field.getName() == key;
+                };
+            };
+
+            var aIndex = fields.findIndexBy(findByName(a.field)),
+                bIndex = fields.findIndexBy(findByName(b.field));
+
+            return aIndex < bIndex ? -1 : 1;
+        });
+    },
+
+    /**
+     * Resets each field in the composite to their previous value
+     */
+    reset: function() {
+        this.eachItem(function(item) {
+            item.reset();
+        });
+
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+    
+    /**
+     * Calls clearInvalid on all child fields. This is a convenience function and should not often need to be called
+     * as fields usually take care of clearing themselves
+     */
+    clearInvalidChildren: function() {
+        this.eachItem(function(item) {
+            item.clearInvalid();
+        });
+    },
+
+    /**
+     * Builds a label string from an array of subfield labels.
+     * By default this just joins the labels together with a comma
+     * @param {Array} segments Array of each of the labels in the composite field's subfields
+     * @return {String} The built label
+     */
+    buildLabel: function(segments) {
+        return Ext.clean(segments).join(this.labelConnector);
+    },
+
+    /**
+     * Checks each field in the composite and returns true if any is dirty
+     * @return {Boolean} True if any field is dirty
+     */
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        return dirty;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @private
+     * Passes the resize call through to the inner panel
+     */
+    onResize: function(adjWidth, adjHeight, rawWidth, rawHeight) {
+        var innerCt = this.innerCt;
+
+        if (this.rendered && innerCt.rendered) {
+            innerCt.setSize(adjWidth, adjHeight);
+        }
+
+        Ext.form.CompositeField.superclass.onResize.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Forces the internal container to be laid out again
+     */
+    doLayout: function(shallow, force) {
+        if (this.rendered) {
+            var innerCt = this.innerCt;
+
+            innerCt.forceLayout = this.ownerCt.forceLayout;
+            innerCt.doLayout(shallow, force);
+        }
+    },
+
+    /**
+     * @private
+     */
+    beforeDestroy: function(){
+        Ext.destroy(this.innerCt);
+
+        Ext.form.CompositeField.superclass.beforeDestroy.call(this);
+    },
+
+    //override the behaviour to check sub items.
+    setReadOnly : function(readOnly) {
+        if (readOnly == undefined) {
+            readOnly = true;
+        }
+        readOnly = !!readOnly;
+
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    onShow : function() {
+        Ext.form.CompositeField.superclass.onShow.call(this);
+        this.doLayout();
+    },
+
+    //override the behaviour to check sub items.
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    //override the behaviour to check sub items.
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    }
+});
+
+Ext.reg('compositefield', Ext.form.CompositeField);/**
+ * @class Ext.form.Radio
+ * @extends Ext.form.Checkbox
+ * Single radio field.  Same as Checkbox, but provided as a convenience for automatically setting the input type.
+ * Radio grouping is handled automatically by the browser if you give each radio in a group the same name.
+ * @constructor
+ * Creates a new Radio
+ * @param {Object} config Configuration options
+ * @xtype radio
+ */
+Ext.form.Radio = Ext.extend(Ext.form.Checkbox, {
+    inputType: 'radio',
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    /**
+     * If this radio is part of a group, it will return the selected value
+     * @return {String}
+     */
+    getGroupValue : function(){
+    	var p = this.el.up('form') || Ext.getBody();
+        var c = p.child('input[name="'+this.el.dom.name+'"]:checked', true);
+        return c ? c.value : null;
+    },
+
+    /**
+     * Sets either the checked/unchecked status of this Radio, or, if a string value
+     * is passed, checks a sibling Radio of the same name whose value is the value specified.
+     * @param value {String/Boolean} Checked value, or the value of the sibling radio button to check.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+    	var checkEl,
+            els,
+            radio;
+    	if (typeof v == 'boolean') {
+            Ext.form.Radio.superclass.setValue.call(this, v);
+        } else if (this.rendered) {
+            checkEl = this.getCheckEl();
+            radio = checkEl.child('input[name="' + this.el.dom.name + '"][value="' + v + '"]', true);
+            if(radio){
+                Ext.getCmp(radio.id).setValue(true);
+            }
+        }
+        if(this.rendered && this.checked){
+            checkEl = checkEl || this.getCheckEl();
+            els = this.getCheckEl().select('input[name="' + this.el.dom.name + '"]');
+			els.each(function(el){
+				if(el.dom.id != this.id){
+					Ext.getCmp(el.dom.id).setValue(false);
+				}
+			}, this);
+        }
+        return this;
+    },
+
+    // private
+    getCheckEl: function(){
+        if(this.inGroup){
+            return this.el.up('.x-form-radio-group');
+        }
+        return this.el.up('form') || Ext.getBody();
+    }
+});
+Ext.reg('radio', Ext.form.Radio);
+/**
+ * @class Ext.form.RadioGroup
+ * @extends Ext.form.CheckboxGroup
+ * A grouping container for {@link Ext.form.Radio} controls.
+ * @constructor
+ * Creates a new RadioGroup
+ * @param {Object} config Configuration options
+ * @xtype radiogroup
+ */
+Ext.form.RadioGroup = Ext.extend(Ext.form.CheckboxGroup, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Radio Radio}s or Radio config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {Boolean} allowBlank True to allow every item in the group to be blank (defaults to true).
+     * If allowBlank = false and no items are selected at validation time, {@link @blankText} will
+     * be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails
+     * (defaults to 'You must select one item in this group')
+     */
+    blankText : 'You must select one item in this group',
+    
+    // private
+    defaultType : 'radio',
+    
+    // private
+    groupCls : 'x-form-radio-group',
+    
+    /**
+     * @event change
+     * Fires when the state of a child radio changes.
+     * @param {Ext.form.RadioGroup} this
+     * @param {Ext.form.Radio} checked The checked radio
+     */
+    
+    /**
+     * Gets the selected {@link Ext.form.Radio} in the group, if it exists.
+     * @return {Ext.form.Radio} The selected radio.
+     */
+    getValue : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        return out;
+    },
+    
+    /**
+     * Sets the checked radio in the group.
+     * @param {String/Ext.form.Radio} id The radio to check.
+     * @param {Boolean} value The value to set the radio.
+     * @return {Ext.form.RadioGroup} this
+     */
+    onSetValue : function(id, value){
+        if(arguments.length > 1){
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+                if(f.checked){
+                    this.eachItem(function(item){
+                        if (item !== f){
+                            item.setValue(false);
+                        }
+                    });
+                }
+            }
+        }else{
+            this.setValueForItem(id);
+        }
+    },
+    
+    setValueForItem : function(val){
+        val = String(val).split(',')[0];
+        this.eachItem(function(item){
+            item.setValue(val == item.inputValue);
+        });
+    },
+    
+    // private
+    fireChecked : function(){
+        if(!this.checkTask){
+            this.checkTask = new Ext.util.DelayedTask(this.bufferChecked, this);
+        }
+        this.checkTask.delay(10);
+    },
+    
+    // private
+    bufferChecked : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        this.fireEvent('change', this, out);
+    },
+    
+    onDestroy : function(){
+        if(this.checkTask){
+            this.checkTask.cancel();
+            this.checkTask = null;
+        }
+        Ext.form.RadioGroup.superclass.onDestroy.call(this);
+    }
+
+});
+
+Ext.reg('radiogroup', Ext.form.RadioGroup);
+/**
+ * @class Ext.form.Hidden
+ * @extends Ext.form.Field
+ * A basic hidden field for storing hidden values in forms that need to be passed in the form submit.
+ * @constructor
+ * Create a new Hidden field.
+ * @param {Object} config Configuration options
+ * @xtype hidden
+ */
+Ext.form.Hidden = Ext.extend(Ext.form.Field, {
+    // private
+    inputType : 'hidden',
+    
+    shouldLayout: false,
+
+    // private
+    onRender : function(){
+        Ext.form.Hidden.superclass.onRender.apply(this, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    // These are all private overrides
+    setSize : Ext.emptyFn,
+    setWidth : Ext.emptyFn,
+    setHeight : Ext.emptyFn,
+    setPosition : Ext.emptyFn,
+    setPagePosition : Ext.emptyFn,
+    markInvalid : Ext.emptyFn,
+    clearInvalid : Ext.emptyFn
+});
+Ext.reg('hidden', Ext.form.Hidden);/**
+ * @class Ext.form.BasicForm
+ * @extends Ext.util.Observable
+ * <p>Encapsulates the DOM &lt;form> element at the heart of the {@link Ext.form.FormPanel FormPanel} class, and provides
+ * input field management, validation, submission, and form loading services.</p>
+ * <p>By default, Ext Forms are submitted through Ajax, using an instance of {@link Ext.form.Action.Submit}.
+ * To enable normal browser submission of an Ext Form, use the {@link #standardSubmit} config option.</p>
+ * <p><b><u>File Uploads</u></b></p>
+ * <p>{@link #fileUpload File uploads} are not performed using Ajax submission, that
+ * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+ * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+ * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+ * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+ * but removed after the return data has been gathered.</p>
+ * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+ * server is using JSON to send the return object, then the
+ * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+ * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+ * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+ * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+ * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+ * is created containing a <tt>responseText</tt> property in order to conform to the
+ * requirements of event handlers and callbacks.</p>
+ * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+ * and some server technologies (notably JEE) may require some custom processing in order to
+ * retrieve parameter names and parameter values from the packet content.</p>
+ * @constructor
+ * @param {Mixed} el The form element or its id
+ * @param {Object} config Configuration options
+ */
+Ext.form.BasicForm = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        Ext.apply(this, config);
+        if(Ext.isString(this.paramOrder)){
+            this.paramOrder = this.paramOrder.split(/[\s,|]/);
+        }
+        /**
+         * A {@link Ext.util.MixedCollection MixedCollection} containing all the Ext.form.Fields in this form.
+         * @type MixedCollection
+         * @property items
+         */
+        this.items = new Ext.util.MixedCollection(false, function(o){
+            return o.getItemId();
+        });
+        this.addEvents(
+            /**
+             * @event beforeaction
+             * Fires before any action is performed. Return false to cancel the action.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} to be performed
+             */
+            'beforeaction',
+            /**
+             * @event actionfailed
+             * Fires when an action fails.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that failed
+             */
+            'actionfailed',
+            /**
+             * @event actioncomplete
+             * Fires when an action is completed.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that completed
+             */
+            'actioncomplete'
+        );
+
+        if(el){
+            this.initEl(el);
+        }
+        Ext.form.BasicForm.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {String} method
+     * The request method to use (GET or POST) for form actions if one isn't supplied in the action options.
+     */
+    /**
+     * @cfg {DataReader} reader
+     * An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to read
+     * data when executing 'load' actions. This is optional as there is built-in
+     * support for processing JSON.  For additional information on using an XMLReader
+     * see the example provided in examples/form/xml-form.html.
+     */
+    /**
+     * @cfg {DataReader} errorReader
+     * <p>An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to
+     * read field error messages returned from 'submit' actions. This is optional
+     * as there is built-in support for processing JSON.</p>
+     * <p>The Records which provide messages for the invalid Fields must use the
+     * Field name (or id) as the Record ID, and must contain a field called 'msg'
+     * which contains the error message.</p>
+     * <p>The errorReader does not have to be a full-blown implementation of a
+     * DataReader. It simply needs to implement a <tt>read(xhr)</tt> function
+     * which returns an Array of Records in an object with the following
+     * structure:</p><pre><code>
+{
+    records: recordArray
+}
+</code></pre>
+     */
+    /**
+     * @cfg {String} url
+     * The URL to use for form actions if one isn't supplied in the
+     * <code>{@link #doAction doAction} options</code>.
+     */
+    /**
+     * @cfg {Boolean} fileUpload
+     * Set to true if this form is a file upload.
+     * <p>File uploads are not performed using normal 'Ajax' techniques, that is they are <b>not</b>
+     * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+     * DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     */
+    /**
+     * @cfg {Object} baseParams
+     * <p>Parameters to pass with all requests. e.g. baseParams: {id: '123', foo: 'bar'}.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     */
+    /**
+     * @cfg {Number} timeout Timeout for form actions in seconds (default is 30 seconds).
+     */
+    timeout: 30,
+
+    /**
+     * @cfg {Object} api (Optional) If specified load and submit actions will be handled
+     * with {@link Ext.form.Action.DirectLoad} and {@link Ext.form.Action.DirectSubmit}.
+     * Methods which have been imported by Ext.Direct can be specified here to load and submit
+     * forms.
+     * Such as the following:<pre><code>
+api: {
+    load: App.ss.MyProfile.load,
+    submit: App.ss.MyProfile.submit
+}
+</code></pre>
+     * <p>Load actions can use <code>{@link #paramOrder}</code> or <code>{@link #paramsAsHash}</code>
+     * to customize how the load method is invoked.
+     * Submit actions will always use a standard form submit. The formHandler configuration must
+     * be set on the associated server-side method which has been imported by Ext.Direct</p>
+     */
+
+    /**
+     * @cfg {Array/String} paramOrder <p>A list of params to be executed server side.
+     * Defaults to <tt>undefined</tt>. Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration.</p>
+     * <br><p>Specify the params in the order in which they must be executed on the
+     * server-side as either (1) an Array of String values, or (2) a String of params
+     * delimited by either whitespace, comma, or pipe. For example,
+     * any of the following would be acceptable:</p><pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration. Send parameters as a collection of named
+     * arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} waitTitle
+     * The default title to show for the waiting message box (defaults to <tt>'Please Wait...'</tt>)
+     */
+    waitTitle: 'Please Wait...',
+
+    // private
+    activeAction : null,
+
+    /**
+     * @cfg {Boolean} trackResetOnLoad If set to <tt>true</tt>, {@link #reset}() resets to the last loaded
+     * or {@link #setValues}() data instead of when the form was first created.  Defaults to <tt>false</tt>.
+     */
+    trackResetOnLoad : false,
+
+    /**
+     * @cfg {Boolean} standardSubmit
+     * <p>If set to <tt>true</tt>, standard HTML form submits are used instead
+     * of XHR (Ajax) style form submissions. Defaults to <tt>false</tt>.</p>
+     * <br><p><b>Note:</b> When using <code>standardSubmit</code>, the
+     * <code>options</code> to <code>{@link #submit}</code> are ignored because
+     * Ext's Ajax infrastracture is bypassed. To pass extra parameters (e.g.
+     * <code>baseParams</code> and <code>params</code>), utilize hidden fields
+     * to submit extra data, for example:</p>
+     * <pre><code>
+new Ext.FormPanel({
+    standardSubmit: true,
+    baseParams: {
+        foo: 'bar'
+    },
+    {@link url}: 'myProcess.php',
+    items: [{
+        xtype: 'textfield',
+        name: 'userName'
+    }],
+    buttons: [{
+        text: 'Save',
+        handler: function(){
+            var fp = this.ownerCt.ownerCt,
+                form = fp.getForm();
+            if (form.isValid()) {
+                // check if there are baseParams and if
+                // hiddent items have been added already
+                if (fp.baseParams && !fp.paramsAdded) {
+                    // add hidden items for all baseParams
+                    for (i in fp.baseParams) {
+                        fp.add({
+                            xtype: 'hidden',
+                            name: i,
+                            value: fp.baseParams[i]
+                        });
+                    }
+                    fp.doLayout();
+                    // set a custom flag to prevent re-adding
+                    fp.paramsAdded = true;
+                }
+                form.{@link #submit}();
+            }
+        }
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * By default wait messages are displayed with Ext.MessageBox.wait. You can target a specific
+     * element by passing it or its id or mask the form itself by passing in true.
+     * @type Mixed
+     * @property waitMsgTarget
+     */
+
+    // private
+    initEl : function(el){
+        this.el = Ext.get(el);
+        this.id = this.el.id || Ext.id();
+        if(!this.standardSubmit){
+            this.el.on('submit', this.onSubmit, this);
+        }
+        this.el.addClass('x-form');
+    },
+
+    /**
+     * Get the HTML form Element
+     * @return Ext.Element
+     */
+    getEl: function(){
+        return this.el;
+    },
+
+    // private
+    onSubmit : function(e){
+        e.stopEvent();
+    },
+
+    /**
+     * Destroys this object.
+     * @private
+     * @param {Boolean} bound true if the object is bound to a form panel. If this is the case
+     * the FormPanel will take care of destroying certain things, so we're just doubling up.
+     */
+    destroy: function(bound){
+        if(bound !== true){
+            this.items.each(function(f){
+                Ext.destroy(f);
+            });
+            Ext.destroy(this.el);
+        }
+        this.items.clear();
+        this.purgeListeners();
+    },
+
+    /**
+     * Returns true if client-side validation on the form is successful.
+     * @return Boolean
+     */
+    isValid : function(){
+        var valid = true;
+        this.items.each(function(f){
+           if(!f.validate()){
+               valid = false;
+           }
+        });
+        return valid;
+    },
+
+    /**
+     * <p>Returns true if any fields in this form have changed from their original values.</p>
+     * <p>Note that if this BasicForm was configured with {@link #trackResetOnLoad} then the
+     * Fields' <i>original values</i> are updated when the values are loaded by {@link #setValues}
+     * or {@link #loadRecord}.</p>
+     * @return Boolean
+     */
+    isDirty : function(){
+        var dirty = false;
+        this.items.each(function(f){
+           if(f.isDirty()){
+               dirty = true;
+               return false;
+           }
+        });
+        return dirty;
+    },
+
+    /**
+     * Performs a predefined action ({@link Ext.form.Action.Submit} or
+     * {@link Ext.form.Action.Load}) or a custom extension of {@link Ext.form.Action}
+     * to perform application-specific processing.
+     * @param {String/Object} actionName The name of the predefined action type,
+     * or instance of {@link Ext.form.Action} to perform.
+     * @param {Object} options (optional) The options to pass to the {@link Ext.form.Action}.
+     * All of the config options listed below are supported by both the
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * actions unless otherwise noted (custom actions could also accept
+     * other config options):<ul>
+     *
+     * <li><b>url</b> : String<div class="sub-desc">The url for the action (defaults
+     * to the form's {@link #url}.)</div></li>
+     *
+     * <li><b>method</b> : String<div class="sub-desc">The form method to use (defaults
+     * to the form's method, or POST if not defined)</div></li>
+     *
+     * <li><b>params</b> : String/Object<div class="sub-desc"><p>The params to pass
+     * (defaults to the form's baseParams, or none if not defined)</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     *
+     * <li><b>headers</b> : Object<div class="sub-desc">Request headers to set for the action
+     * (defaults to the form's default headers)</div></li>
+     *
+     * <li><b>success</b> : Function<div class="sub-desc">The callback that will
+     * be invoked after a successful response (see top of
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * for a description of what constitutes a successful response).
+     * The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>failure</b> : Function<div class="sub-desc">The callback that will be invoked after a
+     * failed transaction attempt. The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : The {@link Ext.form.BasicForm} that requested the action.</li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#failureType failureType}</tt></li>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the
+     * callback functions (The <tt>this</tt> reference for the callback functions).</div></li>
+     *
+     * <li><b>clientValidation</b> : Boolean<div class="sub-desc">Submit Action only.
+     * Determines whether a Form's fields are validated in a final call to
+     * {@link Ext.form.BasicForm#isValid isValid} prior to submission. Set to <tt>false</tt>
+     * to prevent this. If undefined, pre-submission field validation is performed.</div></li></ul>
+     *
+     * @return {BasicForm} this
+     */
+    doAction : function(action, options){
+        if(Ext.isString(action)){
+            action = new Ext.form.Action.ACTION_TYPES[action](this, options);
+        }
+        if(this.fireEvent('beforeaction', this, action) !== false){
+            this.beforeAction(action);
+            action.run.defer(100, action);
+        }
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Submit submit action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details).<br>
+     * <p><b>Note:</b> this is ignored when using the {@link #standardSubmit} option.</p>
+     * <p>The following code:</p><pre><code>
+myFormPanel.getForm().submit({
+    clientValidation: true,
+    url: 'updateConsignment.php',
+    params: {
+        newStatus: 'delivered'
+    },
+    success: function(form, action) {
+       Ext.Msg.alert('Success', action.result.msg);
+    },
+    failure: function(form, action) {
+        switch (action.failureType) {
+            case Ext.form.Action.CLIENT_INVALID:
+                Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
+                break;
+            case Ext.form.Action.CONNECT_FAILURE:
+                Ext.Msg.alert('Failure', 'Ajax communication failed');
+                break;
+            case Ext.form.Action.SERVER_INVALID:
+               Ext.Msg.alert('Failure', action.result.msg);
+       }
+    }
+});
+</code></pre>
+     * would process the following server response for a successful submission:<pre><code>
+{
+    "success":true, // note this is Boolean, not string
+    "msg":"Consignment updated"
+}
+</code></pre>
+     * and the following server response for a failed submission:<pre><code>
+{
+    "success":false, // note this is Boolean, not string
+    "msg":"You do not have permission to perform this operation"
+}
+</code></pre>
+     * @return {BasicForm} this
+     */
+    submit : function(options){
+        options = options || {};
+        if(this.standardSubmit){
+            var v = options.clientValidation === false || this.isValid();
+            if(v){
+                var el = this.el.dom;
+                if(this.url && Ext.isEmpty(el.action)){
+                    el.action = this.url;
+                }
+                el.submit();
+            }
+            return v;
+        }
+        var submitAction = String.format('{0}submit', this.api ? 'direct' : '');
+        this.doAction(submitAction, options);
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Load load action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details)
+     * @return {BasicForm} this
+     */
+    load : function(options){
+        var loadAction = String.format('{0}load', this.api ? 'direct' : '');
+        this.doAction(loadAction, options);
+        return this;
+    },
+
+    /**
+     * Persists the values in this form into the passed {@link Ext.data.Record} object in a beginEdit/endEdit block.
+     * @param {Record} record The record to edit
+     * @return {BasicForm} this
+     */
+    updateRecord : function(record){
+        record.beginEdit();
+        var fs = record.fields,
+            field,
+            value;
+        fs.each(function(f){
+            field = this.findField(f.name);
+            if(field){
+                value = field.getValue();
+                if (Ext.type(value) !== false && value.getGroupValue) {
+                    value = value.getGroupValue();
+                } else if ( field.eachItem ) {
+                    value = [];
+                    field.eachItem(function(item){
+                        value.push(item.getValue());
+                    });
+                }
+                record.set(f.name, value);
+            }
+        }, this);
+        record.endEdit();
+        return this;
+    },
+
+    /**
+     * Loads an {@link Ext.data.Record} into this form by calling {@link #setValues} with the
+     * {@link Ext.data.Record#data record data}.
+     * See also {@link #trackResetOnLoad}.
+     * @param {Record} record The record to load
+     * @return {BasicForm} this
+     */
+    loadRecord : function(record){
+        this.setValues(record.data);
+        return this;
+    },
+
+    // private
+    beforeAction : function(action){
+        // Call HtmlEditor's syncValue before actions
+        this.items.each(function(f){
+            if(f.isFormField && f.syncValue){
+                f.syncValue();
+            }
+        });
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.mask(o.waitMsg, 'x-mask-loading');
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget = Ext.get(this.waitMsgTarget);
+                this.waitMsgTarget.mask(o.waitMsg, 'x-mask-loading');
+            }else{
+                Ext.MessageBox.wait(o.waitMsg, o.waitTitle || this.waitTitle);
+            }
+        }
+    },
+
+    // private
+    afterAction : function(action, success){
+        this.activeAction = null;
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.unmask();
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget.unmask();
+            }else{
+                Ext.MessageBox.updateProgress(1);
+                Ext.MessageBox.hide();
+            }
+        }
+        if(success){
+            if(o.reset){
+                this.reset();
+            }
+            Ext.callback(o.success, o.scope, [this, action]);
+            this.fireEvent('actioncomplete', this, action);
+        }else{
+            Ext.callback(o.failure, o.scope, [this, action]);
+            this.fireEvent('actionfailed', this, action);
+        }
+    },
+
+    /**
+     * Find a {@link Ext.form.Field} in this form.
+     * @param {String} id The value to search for (specify either a {@link Ext.Component#id id},
+     * {@link Ext.grid.Column#dataIndex dataIndex}, {@link Ext.form.Field#getName name or hiddenName}).
+     * @return Field
+     */
+    findField : function(id) {
+        var field = this.items.get(id);
+
+        if (!Ext.isObject(field)) {
+            //searches for the field corresponding to the given id. Used recursively for composite fields
+            var findMatchingField = function(f) {
+                if (f.isFormField) {
+                    if (f.dataIndex == id || f.id == id || f.getName() == id) {
+                        field = f;
+                        return false;
+                    } else if (f.isComposite) {
+                        return f.items.each(findMatchingField);
+                    } else if (f instanceof Ext.form.CheckboxGroup && f.rendered) {
+                        return f.eachItem(findMatchingField);
+                    }
+                }
+            };
+
+            this.items.each(findMatchingField);
+        }
+        return field || null;
+    },
+
+
+    /**
+     * Mark fields in this form invalid in bulk.
+     * @param {Array/Object} errors Either an array in the form [{id:'fieldId', msg:'The message'},...] or an object hash of {id: msg, id2: msg2}
+     * @return {BasicForm} this
+     */
+    markInvalid : function(errors){
+        if (Ext.isArray(errors)) {
+            for(var i = 0, len = errors.length; i < len; i++){
+                var fieldError = errors[i];
+                var f = this.findField(fieldError.id);
+                if(f){
+                    f.markInvalid(fieldError.msg);
+                }
+            }
+        } else {
+            var field, id;
+            for(id in errors){
+                if(!Ext.isFunction(errors[id]) && (field = this.findField(id))){
+                    field.markInvalid(errors[id]);
+                }
+            }
+        }
+
+        return this;
+    },
+
+    /**
+     * Set values for fields in this form in bulk.
+     * @param {Array/Object} values Either an array in the form:<pre><code>
+[{id:'clientName', value:'Fred. Olsen Lines'},
+ {id:'portOfLoading', value:'FXT'},
+ {id:'portOfDischarge', value:'OSL'} ]</code></pre>
+     * or an object hash of the form:<pre><code>
+{
+    clientName: 'Fred. Olsen Lines',
+    portOfLoading: 'FXT',
+    portOfDischarge: 'OSL'
+}</code></pre>
+     * @return {BasicForm} this
+     */
+    setValues : function(values){
+        if(Ext.isArray(values)){ // array of objects
+            for(var i = 0, len = values.length; i < len; i++){
+                var v = values[i];
+                var f = this.findField(v.id);
+                if(f){
+                    f.setValue(v.value);
+                    if(this.trackResetOnLoad){
+                        f.originalValue = f.getValue();
+                    }
+                }
+            }
+        }else{ // object hash
+            var field, id;
+            for(id in values){
+                if(!Ext.isFunction(values[id]) && (field = this.findField(id))){
+                    field.setValue(values[id]);
+                    if(this.trackResetOnLoad){
+                        field.originalValue = field.getValue();
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * <p>Returns the fields in this form as an object with key/value pairs as they would be submitted using a standard form submit.
+     * If multiple fields exist with the same name they are returned as an array.</p>
+     * <p><b>Note:</b> The values are collected from all enabled HTML input elements within the form, <u>not</u> from
+     * the Ext Field objects. This means that all returned values are Strings (or Arrays of Strings) and that the
+     * value can potentially be the emptyText of a field.</p>
+     * @param {Boolean} asString (optional) Pass true to return the values as a string. (defaults to false, returning an Object)
+     * @return {String/Object}
+     */
+    getValues : function(asString){
+        var fs = Ext.lib.Ajax.serializeForm(this.el.dom);
+        if(asString === true){
+            return fs;
+        }
+        return Ext.urlDecode(fs);
+    },
+
+    /**
+     * Retrieves the fields in the form as a set of key/value pairs, using the {@link Ext.form.Field#getValue getValue()} method.
+     * If multiple fields exist with the same name they are returned as an array.
+     * @param {Boolean} dirtyOnly (optional) True to return only fields that are dirty.
+     * @return {Object} The values in the form
+     */
+    getFieldValues : function(dirtyOnly){
+        var o = {},
+            n,
+            key,
+            val;
+        this.items.each(function(f) {
+            if (!f.disabled && (dirtyOnly !== true || f.isDirty())) {
+                n = f.getName();
+                key = o[n];
+                val = f.getValue();
+
+                if(Ext.isDefined(key)){
+                    if(Ext.isArray(key)){
+                        o[n].push(val);
+                    }else{
+                        o[n] = [key, val];
+                    }
+                }else{
+                    o[n] = val;
+                }
+            }
+        });
+        return o;
+    },
+
+    /**
+     * Clears all invalid messages in this form.
+     * @return {BasicForm} this
+     */
+    clearInvalid : function(){
+        this.items.each(function(f){
+           f.clearInvalid();
+        });
+        return this;
+    },
+
+    /**
+     * Resets this form.
+     * @return {BasicForm} this
+     */
+    reset : function(){
+        this.items.each(function(f){
+            f.reset();
+        });
+        return this;
+    },
+
+    /**
+     * Add Ext.form Components to this form's Collection. This does not result in rendering of
+     * the passed Component, it just enables the form to validate Fields, and distribute values to
+     * Fields.
+     * <p><b>You will not usually call this function. In order to be rendered, a Field must be added
+     * to a {@link Ext.Container Container}, usually an {@link Ext.form.FormPanel FormPanel}.
+     * The FormPanel to which the field is added takes care of adding the Field to the BasicForm's
+     * collection.</b></p>
+     * @param {Field} field1
+     * @param {Field} field2 (optional)
+     * @param {Field} etc (optional)
+     * @return {BasicForm} this
+     */
+    add : function(){
+        this.items.addAll(Array.prototype.slice.call(arguments, 0));
+        return this;
+    },
+
+    /**
+     * Removes a field from the items collection (does NOT remove its markup).
+     * @param {Field} field
+     * @return {BasicForm} this
+     */
+    remove : function(field){
+        this.items.remove(field);
+        return this;
+    },
+
+    /**
+     * Removes all fields from the collection that have been destroyed.
+     */
+    cleanDestroyed : function() {
+        this.items.filterBy(function(o) { return !!o.isDestroyed; }).each(this.remove, this);
+    },
+
+    /**
+     * Iterates through the {@link Ext.form.Field Field}s which have been {@link #add add}ed to this BasicForm,
+     * checks them for an id attribute, and calls {@link Ext.form.Field#applyToMarkup} on the existing dom element with that id.
+     * @return {BasicForm} this
+     */
+    render : function(){
+        this.items.each(function(f){
+            if(f.isFormField && !f.rendered && document.getElementById(f.id)){ // if the element exists
+                f.applyToMarkup(f.id);
+            }
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#apply} for all fields in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyToFields : function(o){
+        this.items.each(function(f){
+           Ext.apply(f, o);
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#applyIf} for all field in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyIfToFields : function(o){
+        this.items.each(function(f){
+           Ext.applyIf(f, o);
+        });
+        return this;
+    },
+
+    callFieldMethod : function(fnName, args){
+        args = args || [];
+        this.items.each(function(f){
+            if(Ext.isFunction(f[fnName])){
+                f[fnName].apply(f, args);
+            }
+        });
+        return this;
+    }
+});
+
+// back compat
+Ext.BasicForm = Ext.form.BasicForm;
+/**
+ * @class Ext.form.FormPanel
+ * @extends Ext.Panel
+ * <p>Standard form container.</p>
+ *
+ * <p><b><u>Layout</u></b></p>
+ * <p>By default, FormPanel is configured with <tt>layout:'form'</tt> to use an {@link Ext.layout.FormLayout}
+ * layout manager, which styles and renders fields and labels correctly. When nesting additional Containers
+ * within a FormPanel, you should ensure that any descendant Containers which host input Fields use the
+ * {@link Ext.layout.FormLayout} layout manager.</p>
+ *
+ * <p><b><u>BasicForm</u></b></p>
+ * <p>Although <b>not listed</b> as configuration options of FormPanel, the FormPanel class accepts all
+ * of the config options required to configure its internal {@link Ext.form.BasicForm} for:
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.BasicForm#fileUpload file uploads}</li>
+ * <li>functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form</li>
+ * </ul></div>
+ *
+ * <p><b>Note</b>: If subclassing FormPanel, any configuration options for the BasicForm must be applied to
+ * the <tt><b>initialConfig</b></tt> property of the FormPanel. Applying {@link Ext.form.BasicForm BasicForm}
+ * configuration settings to <b><tt>this</tt></b> will <b>not</b> affect the BasicForm's configuration.</p>
+ *
+ * <p><b><u>Form Validation</u></b></p>
+ * <p>For information on form validation see the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.TextField}</li>
+ * <li>{@link Ext.form.VTypes}</li>
+ * <li>{@link Ext.form.BasicForm#doAction BasicForm.doAction <b>clientValidation</b> notes}</li>
+ * <li><tt>{@link Ext.form.FormPanel#monitorValid monitorValid}</tt></li>
+ * </ul></div>
+ *
+ * <p><b><u>Form Submission</u></b></p>
+ * <p>By default, Ext Forms are submitted through Ajax, using {@link Ext.form.Action}. To enable normal browser
+ * submission of the {@link Ext.form.BasicForm BasicForm} contained in this FormPanel, see the
+ * <tt><b>{@link Ext.form.BasicForm#standardSubmit standardSubmit}</b></tt> option.</p>
+ *
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype form
+ */
+Ext.FormPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} formId (optional) The id of the FORM tag (defaults to an auto-generated id).
+     */
+    /**
+     * @cfg {Boolean} hideLabels
+     * <p><tt>true</tt> to hide field labels by default (sets <tt>display:none</tt>). Defaults to
+     * <tt>false</tt>.</p>
+     * <p>Also see {@link Ext.Component}.<tt>{@link Ext.Component#hideLabel hideLabel}</tt>.
+     */
+    /**
+     * @cfg {Number} labelPad
+     * The default padding in pixels for field labels (defaults to <tt>5</tt>). <tt>labelPad</tt> only
+     * applies if <tt>{@link #labelWidth}</tt> is also specified, otherwise it will be ignored.
+     */
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.Component}.<tt>{@link Ext.Component#labelSeparator labelSeparator}</tt>
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels in pixels. This property cascades to child containers
+     * and can be overridden on any child container (e.g., a fieldset can specify a different <tt>labelWidth</tt>
+     * for its fields) (defaults to <tt>100</tt>).
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the x-form-item of fields. This property cascades to child containers.
+     */
+    /**
+     * @cfg {Array} buttons
+     * An array of {@link Ext.Button}s or {@link Ext.Button} configs used to add buttons to the footer of this FormPanel.<br>
+     * <p>Buttons in the footer of a FormPanel may be configured with the option <tt>formBind: true</tt>. This causes
+     * the form's {@link #monitorValid valid state monitor task} to enable/disable those Buttons depending on
+     * the form's valid/invalid state.</p>
+     */
+
+
+    /**
+     * @cfg {Number} minButtonWidth Minimum width of all buttons in pixels (defaults to <tt>75</tt>).
+     */
+    minButtonWidth : 75,
+
+    /**
+     * @cfg {String} labelAlign The label alignment value used for the <tt>text-align</tt> specification
+     * for the <b>container</b>. Valid values are <tt>"left</tt>", <tt>"top"</tt> or <tt>"right"</tt>
+     * (defaults to <tt>"left"</tt>). This property cascades to child <b>containers</b> and can be
+     * overridden on any child <b>container</b> (e.g., a fieldset can specify a different <tt>labelAlign</tt>
+     * for its fields).
+     */
+    labelAlign : 'left',
+
+    /**
+     * @cfg {Boolean} monitorValid If <tt>true</tt>, the form monitors its valid state <b>client-side</b> and
+     * regularly fires the {@link #clientvalidation} event passing that state.<br>
+     * <p>When monitoring valid state, the FormPanel enables/disables any of its configured
+     * {@link #buttons} which have been configured with <code>formBind: true</code> depending
+     * on whether the {@link Ext.form.BasicForm#isValid form is valid} or not. Defaults to <tt>false</tt></p>
+     */
+    monitorValid : false,
+
+    /**
+     * @cfg {Number} monitorPoll The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200)
+     */
+    monitorPoll : 200,
+
+    /**
+     * @cfg {String} layout Defaults to <tt>'form'</tt>.  Normally this configuration property should not be altered.
+     * For additional details see {@link Ext.layout.FormLayout} and {@link Ext.Container#layout Ext.Container.layout}.
+     */
+    layout : 'form',
+
+    // private
+    initComponent : function(){
+        this.form = this.createForm();
+        Ext.FormPanel.superclass.initComponent.call(this);
+
+        this.bodyCfg = {
+            tag: 'form',
+            cls: this.baseCls + '-body',
+            method : this.method || 'POST',
+            id : this.formId || Ext.id()
+        };
+        if(this.fileUpload) {
+            this.bodyCfg.enctype = 'multipart/form-data';
+        }
+        this.initItems();
+
+        this.addEvents(
+            /**
+             * @event clientvalidation
+             * If the monitorValid config option is true, this event fires repetitively to notify of valid state
+             * @param {Ext.form.FormPanel} this
+             * @param {Boolean} valid true if the form has passed client-side validation
+             */
+            'clientvalidation'
+        );
+
+        this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);
+    },
+
+    // private
+    createForm : function(){
+        var config = Ext.applyIf({listeners: {}}, this.initialConfig);
+        return new Ext.form.BasicForm(null, config);
+    },
+
+    // private
+    initFields : function(){
+        var f = this.form;
+        var formPanel = this;
+        var fn = function(c){
+            if(formPanel.isField(c)){
+                f.add(c);
+            }else if(c.findBy && c != formPanel){
+                formPanel.applySettings(c);
+                //each check required for check/radio groups.
+                if(c.items && c.items.each){
+                    c.items.each(fn, this);
+                }
+            }
+        };
+        this.items.each(fn, this);
+    },
+
+    // private
+    applySettings: function(c){
+        var ct = c.ownerCt;
+        Ext.applyIf(c, {
+            labelAlign: ct.labelAlign,
+            labelWidth: ct.labelWidth,
+            itemCls: ct.itemCls
+        });
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.form.el;
+    },
+
+    /**
+     * Provides access to the {@link Ext.form.BasicForm Form} which this Panel contains.
+     * @return {Ext.form.BasicForm} The {@link Ext.form.BasicForm Form} which this Panel contains.
+     */
+    getForm : function(){
+        return this.form;
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.initFields();
+        Ext.FormPanel.superclass.onRender.call(this, ct, position);
+        this.form.initEl(this.body);
+    },
+
+    // private
+    beforeDestroy : function(){
+        this.stopMonitoring();
+        this.form.destroy(true);
+        Ext.FormPanel.superclass.beforeDestroy.call(this);
+    },
+
+    // Determine if a Component is usable as a form Field.
+    isField : function(c) {
+        return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid;
+    },
+
+    // private
+    initEvents : function(){
+        Ext.FormPanel.superclass.initEvents.call(this);
+        // Listeners are required here to catch bubbling events from children.
+        this.on({
+            scope: this,
+            add: this.onAddEvent,
+            remove: this.onRemoveEvent
+        });
+        if(this.monitorValid){ // initialize after render
+            this.startMonitoring();
+        }
+    },
+
+    // private
+    onAdd: function(c){
+        Ext.FormPanel.superclass.onAdd.call(this, c);
+        this.processAdd(c);
+    },
+
+    // private
+    onAddEvent: function(ct, c){
+        if(ct !== this){
+            this.processAdd(c);
+        }
+    },
+
+    // private
+    processAdd : function(c){
+        // If a single form Field, add it
+        if(this.isField(c)){
+            this.form.add(c);
+        // If a Container, add any Fields it might contain
+        }else if(c.findBy){
+            this.applySettings(c);
+            this.form.add.apply(this.form, c.findBy(this.isField));
+        }
+    },
+
+    // private
+    onRemove: function(c){
+        Ext.FormPanel.superclass.onRemove.call(this, c);
+        this.processRemove(c);
+    },
+
+    onRemoveEvent: function(ct, c){
+        if(ct !== this){
+            this.processRemove(c);
+        }
+    },
+
+    // private
+    processRemove: function(c){
+        if(!this.destroying){
+            // If a single form Field, remove it
+            if(this.isField(c)){
+                this.form.remove(c);
+            // If a Container, its already destroyed by the time it gets here.  Remove any references to destroyed fields.
+            }else if (c.findBy){
+                Ext.each(c.findBy(this.isField), this.form.remove, this.form);
+                /*
+                 * This isn't the most efficient way of getting rid of the items, however it's the most
+                 * correct, which in this case is most important.
+                 */
+                this.form.cleanDestroyed();
+            }
+        }
+    },
+
+    /**
+     * Starts monitoring of the valid state of this form. Usually this is done by passing the config
+     * option "monitorValid"
+     */
+    startMonitoring : function(){
+        if(!this.validTask){
+            this.validTask = new Ext.util.TaskRunner();
+            this.validTask.start({
+                run : this.bindHandler,
+                interval : this.monitorPoll || 200,
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Stops monitoring of the valid state of this form
+     */
+    stopMonitoring : function(){
+        if(this.validTask){
+            this.validTask.stopAll();
+            this.validTask = null;
+        }
+    },
+
+    /**
+     * This is a proxy for the underlying BasicForm's {@link Ext.form.BasicForm#load} call.
+     * @param {Object} options The options to pass to the action (see {@link Ext.form.BasicForm#doAction} for details)
+     */
+    load : function(){
+        this.form.load.apply(this.form, arguments);
+    },
+
+    // private
+    onDisable : function(){
+        Ext.FormPanel.superclass.onDisable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.disable();
+            });
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.FormPanel.superclass.onEnable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.enable();
+            });
+        }
+    },
+
+    // private
+    bindHandler : function(){
+        var valid = true;
+        this.form.items.each(function(f){
+            if(!f.isValid(true)){
+                valid = false;
+                return false;
+            }
+        });
+        if(this.fbar){
+            var fitems = this.fbar.items.items;
+            for(var i = 0, len = fitems.length; i < len; i++){
+                var btn = fitems[i];
+                if(btn.formBind === true && btn.disabled === valid){
+                    btn.setDisabled(!valid);
+                }
+            }
+        }
+        this.fireEvent('clientvalidation', this, valid);
+    }
+});
+Ext.reg('form', Ext.FormPanel);
+
+Ext.form.FormPanel = Ext.FormPanel;
+/**
+ * @class Ext.form.FieldSet
+ * @extends Ext.Panel
+ * Standard container used for grouping items within a {@link Ext.form.FormPanel form}.
+ * <pre><code>
+var form = new Ext.FormPanel({
+    title: 'Simple Form with FieldSets',
+    labelWidth: 75, // label settings here cascade unless overridden
+    url: 'save-form.php',
+    frame:true,
+    bodyStyle:'padding:5px 5px 0',
+    width: 700,
+    renderTo: document.body,
+    layout:'column', // arrange items in columns
+    defaults: {      // defaults applied to items
+        layout: 'form',
+        border: false,
+        bodyStyle: 'padding:4px'
+    },
+    items: [{
+        // Fieldset in Column 1
+        xtype:'fieldset',
+        columnWidth: 0.5,
+        title: 'Fieldset 1',
+        collapsible: true,
+        autoHeight:true,
+        defaults: {
+            anchor: '-20' // leave room for error icon
+        },
+        defaultType: 'textfield',
+        items :[{
+                fieldLabel: 'Field 1'
+            }, {
+                fieldLabel: 'Field 2'
+            }, {
+                fieldLabel: 'Field 3'
+            }
+        ]
+    },{
+        // Fieldset in Column 2 - Panel inside
+        xtype:'fieldset',
+        title: 'Show Panel', // title, header, or checkboxToggle creates fieldset header
+        autoHeight:true,
+        columnWidth: 0.5,
+        checkboxToggle: true,
+        collapsed: true, // fieldset initially collapsed
+        layout:'anchor',
+        items :[{
+            xtype: 'panel',
+            anchor: '100%',
+            title: 'Panel inside a fieldset',
+            frame: true,
+            height: 100
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype fieldset
+ */
+Ext.form.FieldSet = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Mixed} checkboxToggle <tt>true</tt> to render a checkbox into the fieldset frame just
+     * in front of the legend to expand/collapse the fieldset when the checkbox is toggled. (defaults
+     * to <tt>false</tt>).
+     * <p>A {@link Ext.DomHelper DomHelper} element spec may also be specified to create the checkbox.
+     * If <tt>true</tt> is specified, the default DomHelper config object used to create the element
+     * is:</p><pre><code>
+     * {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'}
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} checkboxName The name to assign to the fieldset's checkbox if <tt>{@link #checkboxToggle} = true</tt>
+     * (defaults to <tt>'[checkbox id]-checkbox'</tt>).
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <tt>true</tt> to make the fieldset collapsible and have the expand/collapse toggle button automatically
+     * rendered into the legend element, <tt>false</tt> to keep the fieldset statically sized with no collapse
+     * button (defaults to <tt>false</tt>). Another option is to configure <tt>{@link #checkboxToggle}</tt>.
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels. This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).
+     * This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).
+     */
+    baseCls : 'x-fieldset',
+    /**
+     * @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).
+     */
+    layout : 'form',
+    /**
+     * @cfg {Boolean} animCollapse
+     * <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the
+     * animation (defaults to <tt>false</tt>).
+     */
+    animCollapse : false,
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('fieldset');
+            this.el.id = this.id;
+            if (this.title || this.header || this.checkboxToggle) {
+                this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';
+            }
+        }
+
+        Ext.form.FieldSet.superclass.onRender.call(this, ct, position);
+
+        if(this.checkboxToggle){
+            var o = typeof this.checkboxToggle == 'object' ?
+                    this.checkboxToggle :
+                    {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
+            this.checkbox = this.header.insertFirst(o);
+            this.checkbox.dom.checked = !this.collapsed;
+            this.mon(this.checkbox, 'click', this.onCheckClick, this);
+        }
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = false;
+        }
+        Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);
+
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = true;
+        }
+        Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
+    },
+
+    /**
+     * This function is called by the fieldset's checkbox when it is toggled (only applies when
+     * checkboxToggle = true).  This method should never be called externally, but can be
+     * overridden to provide custom behavior when the checkbox is toggled if needed.
+     */
+    onCheckClick : function(){
+        this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} border
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapseFirst
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {String} disabledClass
+     * @hide
+     */
+    /**
+     * @cfg {String} elements
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} floating
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} footer
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} frame
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {String} iconCls
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * @hide
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} shim
+     * @hide
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {String} xtype
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @property footer
+     * @hide
+     */
+    /**
+     * @method focus
+     * @hide
+     */
+    /**
+     * @method getBottomToolbar
+     * @hide
+     */
+    /**
+     * @method getTopToolbar
+     * @hide
+     */
+    /**
+     * @method setIconClass
+     * @hide
+     */
+    /**
+     * @event activate
+     * @hide
+     */
+    /**
+     * @event beforeclose
+     * @hide
+     */
+    /**
+     * @event bodyresize
+     * @hide
+     */
+    /**
+     * @event close
+     * @hide
+     */
+    /**
+     * @event deactivate
+     * @hide
+     */
+});
+Ext.reg('fieldset', Ext.form.FieldSet);/**
+ * @class Ext.form.HtmlEditor
+ * @extends Ext.form.Field
+ * Provides a lightweight HTML Editor component. Some toolbar features are not supported by Safari and will be
+ * automatically hidden when needed.  These are noted in the config options where appropriate.
+ * <br><br>The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not
+ * enabled by default unless the global {@link Ext.QuickTips} singleton is {@link Ext.QuickTips#init initialized}.
+ * <br><br><b>Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT
+ * supported by this editor.</b>
+ * <br><br>An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within
+ * any element that has display set to 'none' can cause problems in Safari and Firefox due to their default iframe reloading bugs.
+ * <br><br>Example usage:
+ * <pre><code>
+// Simple example rendered with default options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.form.HtmlEditor({
+    renderTo: Ext.getBody(),
+    width: 800,
+    height: 300
+});
+
+// Passed via xtype into a container and with custom options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.Panel({
+    title: 'HTML Editor',
+    renderTo: Ext.getBody(),
+    width: 600,
+    height: 300,
+    frame: true,
+    layout: 'fit',
+    items: {
+        xtype: 'htmleditor',
+        enableColors: false,
+        enableAlignments: false
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new HtmlEditor
+ * @param {Object} config
+ * @xtype htmleditor
+ */
+
+Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Boolean} enableFormat Enable the bold, italic and underline buttons (defaults to true)
+     */
+    enableFormat : true,
+    /**
+     * @cfg {Boolean} enableFontSize Enable the increase/decrease font size buttons (defaults to true)
+     */
+    enableFontSize : true,
+    /**
+     * @cfg {Boolean} enableColors Enable the fore/highlight color buttons (defaults to true)
+     */
+    enableColors : true,
+    /**
+     * @cfg {Boolean} enableAlignments Enable the left, center, right alignment buttons (defaults to true)
+     */
+    enableAlignments : true,
+    /**
+     * @cfg {Boolean} enableLists Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true)
+     */
+    enableLists : true,
+    /**
+     * @cfg {Boolean} enableSourceEdit Enable the switch to source edit button. Not available in Safari. (defaults to true)
+     */
+    enableSourceEdit : true,
+    /**
+     * @cfg {Boolean} enableLinks Enable the create link button. Not available in Safari. (defaults to true)
+     */
+    enableLinks : true,
+    /**
+     * @cfg {Boolean} enableFont Enable font selection. Not available in Safari. (defaults to true)
+     */
+    enableFont : true,
+    /**
+     * @cfg {String} createLinkText The default text for the create link prompt
+     */
+    createLinkText : 'Please enter the URL for the link:',
+    /**
+     * @cfg {String} defaultLinkValue The default value for the create link prompt (defaults to http:/ /)
+     */
+    defaultLinkValue : 'http:/'+'/',
+    /**
+     * @cfg {Array} fontFamilies An array of available font families
+     */
+    fontFamilies : [
+        'Arial',
+        'Courier New',
+        'Tahoma',
+        'Times New Roman',
+        'Verdana'
+    ],
+    defaultFont: 'tahoma',
+    /**
+     * @cfg {String} defaultValue A default value to be put into the editor to resolve focus issues (defaults to &#160; (Non-breaking space) in Opera and IE6, &#8203; (Zero-width space) in all other browsers).
+     */
+    defaultValue: (Ext.isOpera || Ext.isIE6) ? '&#160;' : '&#8203;',
+
+    // private properties
+    actionMode: 'wrap',
+    validationEvent : false,
+    deferHeight: true,
+    initialized : false,
+    activated : false,
+    sourceEditMode : false,
+    onFocus : Ext.emptyFn,
+    iframePad:3,
+    hideMode:'offsets',
+    defaultAutoCreate : {
+        tag: "textarea",
+        style:"width:500px;height:300px;",
+        autocomplete: "off"
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event initialize
+             * Fires when the editor is fully initialized (including the iframe)
+             * @param {HtmlEditor} this
+             */
+            'initialize',
+            /**
+             * @event activate
+             * Fires when the editor is first receives the focus. Any insertion must wait
+             * until after this event.
+             * @param {HtmlEditor} this
+             */
+            'activate',
+             /**
+             * @event beforesync
+             * Fires before the textarea is updated with content from the editor iframe. Return false
+             * to cancel the sync.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforesync',
+             /**
+             * @event beforepush
+             * Fires before the iframe editor is updated with content from the textarea. Return false
+             * to cancel the push.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforepush',
+             /**
+             * @event sync
+             * Fires when the textarea is updated with content from the editor iframe.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'sync',
+             /**
+             * @event push
+             * Fires when the iframe editor is updated with content from the textarea.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'push',
+             /**
+             * @event editmodechange
+             * Fires when the editor switches edit modes
+             * @param {HtmlEditor} this
+             * @param {Boolean} sourceEdit True if source edit, false if standard editing.
+             */
+            'editmodechange'
+        );
+        Ext.form.HtmlEditor.superclass.initComponent.call(this);
+    },
+
+    // private
+    createFontOptions : function(){
+        var buf = [], fs = this.fontFamilies, ff, lc;
+        for(var i = 0, len = fs.length; i< len; i++){
+            ff = fs[i];
+            lc = ff.toLowerCase();
+            buf.push(
+                '<option value="',lc,'" style="font-family:',ff,';"',
+                    (this.defaultFont == lc ? ' selected="true">' : '>'),
+                    ff,
+                '</option>'
+            );
+        }
+        return buf.join('');
+    },
+
+    /*
+     * Protected method that will not generally be called directly. It
+     * is called when the editor creates its toolbar. Override this method if you need to
+     * add custom toolbar buttons.
+     * @param {HtmlEditor} editor
+     */
+    createToolbar : function(editor){
+        var items = [];
+        var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();
+
+
+        function btn(id, toggle, handler){
+            return {
+                itemId : id,
+                cls : 'x-btn-icon',
+                iconCls: 'x-edit-'+id,
+                enableToggle:toggle !== false,
+                scope: editor,
+                handler:handler||editor.relayBtnCmd,
+                clickEvent:'mousedown',
+                tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined,
+                overflowText: editor.buttonTips[id].title || undefined,
+                tabIndex:-1
+            };
+        }
+
+
+        if(this.enableFont && !Ext.isSafari2){
+            var fontSelectItem = new Ext.Toolbar.Item({
+               autoEl: {
+                    tag:'select',
+                    cls:'x-font-select',
+                    html: this.createFontOptions()
+               }
+            });
+
+            items.push(
+                fontSelectItem,
+                '-'
+            );
+        }
+
+        if(this.enableFormat){
+            items.push(
+                btn('bold'),
+                btn('italic'),
+                btn('underline')
+            );
+        }
+
+        if(this.enableFontSize){
+            items.push(
+                '-',
+                btn('increasefontsize', false, this.adjustFont),
+                btn('decreasefontsize', false, this.adjustFont)
+            );
+        }
+
+        if(this.enableColors){
+            items.push(
+                '-', {
+                    itemId:'forecolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-forecolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.forecolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        allowReselect: true,
+                        focus: Ext.emptyFn,
+                        value:'000000',
+                        plain:true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                this.execCmd('forecolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                this.deferFocus();
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }, {
+                    itemId:'backcolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-backcolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.backcolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        focus: Ext.emptyFn,
+                        value:'FFFFFF',
+                        plain:true,
+                        allowReselect: true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                if(Ext.isGecko){
+                                    this.execCmd('useCSS', false);
+                                    this.execCmd('hilitecolor', color);
+                                    this.execCmd('useCSS', true);
+                                    this.deferFocus();
+                                }else{
+                                    this.execCmd(Ext.isOpera ? 'hilitecolor' : 'backcolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                    this.deferFocus();
+                                }
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }
+            );
+        }
+
+        if(this.enableAlignments){
+            items.push(
+                '-',
+                btn('justifyleft'),
+                btn('justifycenter'),
+                btn('justifyright')
+            );
+        }
+
+        if(!Ext.isSafari2){
+            if(this.enableLinks){
+                items.push(
+                    '-',
+                    btn('createlink', false, this.createLink)
+                );
+            }
+
+            if(this.enableLists){
+                items.push(
+                    '-',
+                    btn('insertorderedlist'),
+                    btn('insertunorderedlist')
+                );
+            }
+            if(this.enableSourceEdit){
+                items.push(
+                    '-',
+                    btn('sourceedit', true, function(btn){
+                        this.toggleSourceEdit(!this.sourceEditMode);
+                    })
+                );
+            }
+        }
+
+        // build the toolbar
+        var tb = new Ext.Toolbar({
+            renderTo: this.wrap.dom.firstChild,
+            items: items
+        });
+
+        if (fontSelectItem) {
+            this.fontSelect = fontSelectItem.el;
+
+            this.mon(this.fontSelect, 'change', function(){
+                var font = this.fontSelect.dom.value;
+                this.relayCmd('fontname', font);
+                this.deferFocus();
+            }, this);
+        }
+
+        // stop form submits
+        this.mon(tb.el, 'click', function(e){
+            e.preventDefault();
+        });
+
+        this.tb = tb;
+        this.tb.doLayout();
+    },
+
+    onDisable: function(){
+        this.wrap.mask();
+        Ext.form.HtmlEditor.superclass.onDisable.call(this);
+    },
+
+    onEnable: function(){
+        this.wrap.unmask();
+        Ext.form.HtmlEditor.superclass.onEnable.call(this);
+    },
+
+    setReadOnly: function(readOnly){
+
+        Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);
+        if(this.initialized){
+            if(Ext.isIE){
+                this.getEditorBody().contentEditable = !readOnly;
+            }else{
+                this.setDesignMode(!readOnly);
+            }
+            var bd = this.getEditorBody();
+            if(bd){
+                bd.style.cursor = this.readOnly ? 'default' : 'text';
+            }
+            this.disableItems(readOnly);
+        }
+    },
+
+    /**
+     * Protected method that will not generally be called directly. It
+     * is called when the editor initializes the iframe with HTML contents. Override this method if you
+     * want to change the initialization markup of the iframe (e.g. to add stylesheets).
+     *
+     * Note: IE8-Standards has unwanted scroller behavior, so the default meta tag forces IE7 compatibility
+     */
+    getDocMarkup : function(){
+        var h = Ext.fly(this.iframe).getHeight() - this.iframePad * 2;
+        return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>', this.iframePad, h);
+    },
+
+    // private
+    getEditorBody : function(){
+        var doc = this.getDoc();
+        return doc.body || doc.documentElement;
+    },
+
+    // private
+    getDoc : function(){
+        return Ext.isIE ? this.getWin().document : (this.iframe.contentDocument || this.getWin().document);
+    },
+
+    // private
+    getWin : function(){
+        return Ext.isIE ? this.iframe.contentWindow : window.frames[this.iframe.name];
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.HtmlEditor.superclass.onRender.call(this, ct, position);
+        this.el.dom.style.border = '0 none';
+        this.el.dom.setAttribute('tabIndex', -1);
+        this.el.addClass('x-hidden');
+        if(Ext.isIE){ // fix IE 1px bogus margin
+            this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;');
+        }
+        this.wrap = this.el.wrap({
+            cls:'x-html-editor-wrap', cn:{cls:'x-html-editor-tb'}
+        });
+
+        this.createToolbar(this);
+
+        this.disableItems(true);
+
+        this.tb.doLayout();
+
+        this.createIFrame();
+
+        if(!this.width){
+            var sz = this.el.getSize();
+            this.setSize(sz.width, this.height || sz.height);
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    createIFrame: function(){
+        var iframe = document.createElement('iframe');
+        iframe.name = Ext.id();
+        iframe.frameBorder = '0';
+        iframe.style.overflow = 'auto';
+        iframe.src = Ext.SSL_SECURE_URL;
+
+        this.wrap.dom.appendChild(iframe);
+        this.iframe = iframe;
+
+        this.monitorTask = Ext.TaskMgr.start({
+            run: this.checkDesignMode,
+            scope: this,
+            interval:100
+        });
+    },
+
+    initFrame : function(){
+        Ext.TaskMgr.stop(this.monitorTask);
+        var doc = this.getDoc();
+        this.win = this.getWin();
+
+        doc.open();
+        doc.write(this.getDocMarkup());
+        doc.close();
+
+        var task = { // must defer to wait for browser to be ready
+            run : function(){
+                var doc = this.getDoc();
+                if(doc.body || doc.readyState == 'complete'){
+                    Ext.TaskMgr.stop(task);
+                    this.setDesignMode(true);
+                    this.initEditor.defer(10, this);
+                }
+            },
+            interval : 10,
+            duration:10000,
+            scope: this
+        };
+        Ext.TaskMgr.start(task);
+    },
+
+
+    checkDesignMode : function(){
+        if(this.wrap && this.wrap.dom.offsetWidth){
+            var doc = this.getDoc();
+            if(!doc){
+                return;
+            }
+            if(!doc.editorInitialized || this.getDesignMode() != 'on'){
+                this.initFrame();
+            }
+        }
+    },
+
+    /* private
+     * set current design mode. To enable, mode can be true or 'on', off otherwise
+     */
+    setDesignMode : function(mode){
+        var doc = this.getDoc();
+        if (doc) {
+            if(this.readOnly){
+                mode = false;
+            }
+            doc.designMode = (/on|true/i).test(String(mode).toLowerCase()) ?'on':'off';
+        }
+
+    },
+
+    // private
+    getDesignMode : function(){
+        var doc = this.getDoc();
+        if(!doc){ return ''; }
+        return String(doc.designMode).toLowerCase();
+
+    },
+
+    disableItems: function(disabled){
+        if(this.fontSelect){
+            this.fontSelect.dom.disabled = disabled;
+        }
+        this.tb.items.each(function(item){
+            if(item.getItemId() != 'sourceedit'){
+                item.setDisabled(disabled);
+            }
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.HtmlEditor.superclass.onResize.apply(this, arguments);
+        if(this.el && this.iframe){
+            if(Ext.isNumber(w)){
+                var aw = w - this.wrap.getFrameWidth('lr');
+                this.el.setWidth(aw);
+                this.tb.setWidth(aw);
+                this.iframe.style.width = Math.max(aw, 0) + 'px';
+            }
+            if(Ext.isNumber(h)){
+                var ah = h - this.wrap.getFrameWidth('tb') - this.tb.el.getHeight();
+                this.el.setHeight(ah);
+                this.iframe.style.height = Math.max(ah, 0) + 'px';
+                var bd = this.getEditorBody();
+                if(bd){
+                    bd.style.height = Math.max((ah - (this.iframePad*2)), 0) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * Toggles the editor between standard and source edit mode.
+     * @param {Boolean} sourceEdit (optional) True for source edit, false for standard
+     */
+    toggleSourceEdit : function(sourceEditMode){
+        var iframeHeight,
+            elHeight;
+
+        if (sourceEditMode === undefined) {
+            sourceEditMode = !this.sourceEditMode;
+        }
+        this.sourceEditMode = sourceEditMode === true;
+        var btn = this.tb.getComponent('sourceedit');
+
+        if (btn.pressed !== this.sourceEditMode) {
+            btn.toggle(this.sourceEditMode);
+            if (!btn.xtbHidden) {
+                return;
+            }
+        }
+        if (this.sourceEditMode) {
+            // grab the height of the containing panel before we hide the iframe
+            this.previousSize = this.getSize();
+
+            iframeHeight = Ext.get(this.iframe).getHeight();
+
+            this.disableItems(true);
+            this.syncValue();
+            this.iframe.className = 'x-hidden';
+            this.el.removeClass('x-hidden');
+            this.el.dom.removeAttribute('tabIndex');
+            this.el.focus();
+            this.el.dom.style.height = iframeHeight + 'px';
+        }
+        else {
+            elHeight = parseInt(this.el.dom.style.height, 10);
+            if (this.initialized) {
+                this.disableItems(this.readOnly);
+            }
+            this.pushValue();
+            this.iframe.className = '';
+            this.el.addClass('x-hidden');
+            this.el.dom.setAttribute('tabIndex', -1);
+            this.deferFocus();
+
+            this.setSize(this.previousSize);
+            delete this.previousSize;
+            this.iframe.style.height = elHeight + 'px';
+        }
+        this.fireEvent('editmodechange', this, this.sourceEditMode);
+    },
+
+    // private used internally
+    createLink : function() {
+        var url = prompt(this.createLinkText, this.defaultLinkValue);
+        if(url && url != 'http:/'+'/'){
+            this.relayCmd('createlink', url);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // docs inherit from Field
+    setValue : function(v){
+        Ext.form.HtmlEditor.superclass.setValue.call(this, v);
+        this.pushValue();
+        return this;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. If you need/want
+     * custom HTML cleanup, this is the method you should override.
+     * @param {String} html The HTML to be cleaned
+     * @return {String} The cleaned HTML
+     */
+    cleanHtml: function(html) {
+        html = String(html);
+        if(Ext.isWebKit){ // strip safari nonsense
+            html = html.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi, '');
+        }
+
+        /*
+         * Neat little hack. Strips out all the non-digit characters from the default
+         * value and compares it to the character code of the first character in the string
+         * because it can cause encoding issues when posted to the server.
+         */
+        if(html.charCodeAt(0) == this.defaultValue.replace(/\D/g, '')){
+            html = html.substring(1);
+        }
+        return html;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Syncs the contents
+     * of the editor iframe with the textarea.
+     */
+    syncValue : function(){
+        if(this.initialized){
+            var bd = this.getEditorBody();
+            var html = bd.innerHTML;
+            if(Ext.isWebKit){
+                var bs = bd.getAttribute('style'); // Safari puts text-align styles on the body element!
+                var m = bs.match(/text-align:(.*?);/i);
+                if(m && m[1]){
+                    html = '<div style="'+m[0]+'">' + html + '</div>';
+                }
+            }
+            html = this.cleanHtml(html);
+            if(this.fireEvent('beforesync', this, html) !== false){
+                this.el.dom.value = html;
+                this.fireEvent('sync', this, html);
+            }
+        }
+    },
+
+    //docs inherit from Field
+    getValue : function() {
+        this[this.sourceEditMode ? 'pushValue' : 'syncValue']();
+        return Ext.form.HtmlEditor.superclass.getValue.call(this);
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Pushes the value of the textarea
+     * into the iframe editor.
+     */
+    pushValue : function(){
+        if(this.initialized){
+            var v = this.el.dom.value;
+            if(!this.activated && v.length < 1){
+                v = this.defaultValue;
+            }
+            if(this.fireEvent('beforepush', this, v) !== false){
+                this.getEditorBody().innerHTML = v;
+                if(Ext.isGecko){
+                    // Gecko hack, see: https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8
+                    this.setDesignMode(false);  //toggle off first
+                    this.setDesignMode(true);
+                }
+                this.fireEvent('push', this, v);
+            }
+
+        }
+    },
+
+    // private
+    deferFocus : function(){
+        this.focus.defer(10, this);
+    },
+
+    // docs inherit from Field
+    focus : function(){
+        if(this.win && !this.sourceEditMode){
+            this.win.focus();
+        }else{
+            this.el.focus();
+        }
+    },
+
+    // private
+    initEditor : function(){
+        //Destroying the component during/before initEditor can cause issues.
+        try{
+            var dbody = this.getEditorBody(),
+                ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat', 'background-color', 'color'),
+                doc,
+                fn;
+
+            ss['background-attachment'] = 'fixed'; // w3c
+            dbody.bgProperties = 'fixed'; // ie
+
+            Ext.DomHelper.applyStyles(dbody, ss);
+
+            doc = this.getDoc();
+
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                }catch(e){}
+            }
+
+            /*
+             * We need to use createDelegate here, because when using buffer, the delayed task is added
+             * as a property to the function. When the listener is removed, the task is deleted from the function.
+             * Since onEditorEvent is shared on the prototype, if we have multiple html editors, the first time one of the editors
+             * is destroyed, it causes the fn to be deleted from the prototype, which causes errors. Essentially, we're just anonymizing the function.
+             */
+            fn = this.onEditorEvent.createDelegate(this);
+            Ext.EventManager.on(doc, {
+                mousedown: fn,
+                dblclick: fn,
+                click: fn,
+                keyup: fn,
+                buffer:100
+            });
+
+            if(Ext.isGecko){
+                Ext.EventManager.on(doc, 'keypress', this.applyCommand, this);
+            }
+            if(Ext.isIE || Ext.isWebKit || Ext.isOpera){
+                Ext.EventManager.on(doc, 'keydown', this.fixKeys, this);
+            }
+            doc.editorInitialized = true;
+            this.initialized = true;
+            this.pushValue();
+            this.setReadOnly(this.readOnly);
+            this.fireEvent('initialize', this);
+        }catch(e){}
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.monitorTask){
+            Ext.TaskMgr.stop(this.monitorTask);
+        }
+        if(this.rendered){
+            Ext.destroy(this.tb);
+            var doc = this.getDoc();
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                    for (var prop in doc){
+                        delete doc[prop];
+                    }
+                }catch(e){}
+            }
+            if(this.wrap){
+                this.wrap.dom.innerHTML = '';
+                this.wrap.remove();
+            }
+        }
+        Ext.form.HtmlEditor.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onFirstFocus : function(){
+        this.activated = true;
+        this.disableItems(this.readOnly);
+        if(Ext.isGecko){ // prevent silly gecko errors
+            this.win.focus();
+            var s = this.win.getSelection();
+            if(!s.focusNode || s.focusNode.nodeType != 3){
+                var r = s.getRangeAt(0);
+                r.selectNodeContents(this.getEditorBody());
+                r.collapse(true);
+                this.deferFocus();
+            }
+            try{
+                this.execCmd('useCSS', true);
+                this.execCmd('styleWithCSS', false);
+            }catch(e){}
+        }
+        this.fireEvent('activate', this);
+    },
+
+    // private
+    adjustFont: function(btn){
+        var adjust = btn.getItemId() == 'increasefontsize' ? 1 : -1,
+            doc = this.getDoc(),
+            v = parseInt(doc.queryCommandValue('FontSize') || 2, 10);
+        if((Ext.isSafari && !Ext.isSafari2) || Ext.isChrome || Ext.isAir){
+            // Safari 3 values
+            // 1 = 10px, 2 = 13px, 3 = 16px, 4 = 18px, 5 = 24px, 6 = 32px
+            if(v <= 10){
+                v = 1 + adjust;
+            }else if(v <= 13){
+                v = 2 + adjust;
+            }else if(v <= 16){
+                v = 3 + adjust;
+            }else if(v <= 18){
+                v = 4 + adjust;
+            }else if(v <= 24){
+                v = 5 + adjust;
+            }else {
+                v = 6 + adjust;
+            }
+            v = v.constrain(1, 6);
+        }else{
+            if(Ext.isSafari){ // safari
+                adjust *= 2;
+            }
+            v = Math.max(1, v+adjust) + (Ext.isSafari ? 'px' : 0);
+        }
+        this.execCmd('FontSize', v);
+    },
+
+    // private
+    onEditorEvent : function(e){
+        this.updateToolbar();
+    },
+
+
+    /**
+     * Protected method that will not generally be called directly. It triggers
+     * a toolbar update by reading the markup state of the current selection in the editor.
+     */
+    updateToolbar: function(){
+
+        if(this.readOnly){
+            return;
+        }
+
+        if(!this.activated){
+            this.onFirstFocus();
+            return;
+        }
+
+        var btns = this.tb.items.map,
+            doc = this.getDoc();
+
+        if(this.enableFont && !Ext.isSafari2){
+            var name = (doc.queryCommandValue('FontName')||this.defaultFont).toLowerCase();
+            if(name != this.fontSelect.dom.value){
+                this.fontSelect.dom.value = name;
+            }
+        }
+        if(this.enableFormat){
+            btns.bold.toggle(doc.queryCommandState('bold'));
+            btns.italic.toggle(doc.queryCommandState('italic'));
+            btns.underline.toggle(doc.queryCommandState('underline'));
+        }
+        if(this.enableAlignments){
+            btns.justifyleft.toggle(doc.queryCommandState('justifyleft'));
+            btns.justifycenter.toggle(doc.queryCommandState('justifycenter'));
+            btns.justifyright.toggle(doc.queryCommandState('justifyright'));
+        }
+        if(!Ext.isSafari2 && this.enableLists){
+            btns.insertorderedlist.toggle(doc.queryCommandState('insertorderedlist'));
+            btns.insertunorderedlist.toggle(doc.queryCommandState('insertunorderedlist'));
+        }
+
+        Ext.menu.MenuMgr.hideAll();
+
+        this.syncValue();
+    },
+
+    // private
+    relayBtnCmd : function(btn){
+        this.relayCmd(btn.getItemId());
+    },
+
+    /**
+     * Executes a Midas editor command on the editor document and performs necessary focus and
+     * toolbar updates. <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    relayCmd : function(cmd, value){
+        (function(){
+            this.focus();
+            this.execCmd(cmd, value);
+            this.updateToolbar();
+        }).defer(10, this);
+    },
+
+    /**
+     * Executes a Midas editor command directly on the editor document.
+     * For visual commands, you should use {@link #relayCmd} instead.
+     * <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    execCmd : function(cmd, value){
+        var doc = this.getDoc();
+        doc.execCommand(cmd, false, value === undefined ? null : value);
+        this.syncValue();
+    },
+
+    // private
+    applyCommand : function(e){
+        if(e.ctrlKey){
+            var c = e.getCharCode(), cmd;
+            if(c > 0){
+                c = String.fromCharCode(c);
+                switch(c){
+                    case 'b':
+                        cmd = 'bold';
+                    break;
+                    case 'i':
+                        cmd = 'italic';
+                    break;
+                    case 'u':
+                        cmd = 'underline';
+                    break;
+                }
+                if(cmd){
+                    this.win.focus();
+                    this.execCmd(cmd);
+                    this.deferFocus();
+                    e.preventDefault();
+                }
+            }
+        }
+    },
+
+    /**
+     * Inserts the passed text at the current cursor position. Note: the editor must be initialized and activated
+     * to insert text.
+     * @param {String} text
+     */
+    insertAtCursor : function(text){
+        if(!this.activated){
+            return;
+        }
+        if(Ext.isIE){
+            this.win.focus();
+            var doc = this.getDoc(),
+                r = doc.selection.createRange();
+            if(r){
+                r.pasteHTML(text);
+                this.syncValue();
+                this.deferFocus();
+            }
+        }else{
+            this.win.focus();
+            this.execCmd('InsertHTML', text);
+            this.deferFocus();
+        }
+    },
+
+    // private
+    fixKeys : function(){ // load time branching for fastest keydown performance
+        if(Ext.isIE){
+            return function(e){
+                var k = e.getKey(),
+                    doc = this.getDoc(),
+                        r;
+                if(k == e.TAB){
+                    e.stopEvent();
+                    r = doc.selection.createRange();
+                    if(r){
+                        r.collapse(true);
+                        r.pasteHTML('&nbsp;&nbsp;&nbsp;&nbsp;');
+                        this.deferFocus();
+                    }
+                }else if(k == e.ENTER){
+                    r = doc.selection.createRange();
+                    if(r){
+                        var target = r.parentElement();
+                        if(!target || target.tagName.toLowerCase() != 'li'){
+                            e.stopEvent();
+                            r.pasteHTML('<br />');
+                            r.collapse(false);
+                            r.select();
+                        }
+                    }
+                }
+            };
+        }else if(Ext.isOpera){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.win.focus();
+                    this.execCmd('InsertHTML','&nbsp;&nbsp;&nbsp;&nbsp;');
+                    this.deferFocus();
+                }
+            };
+        }else if(Ext.isWebKit){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.execCmd('InsertText','\t');
+                    this.deferFocus();
+                }else if(k == e.ENTER){
+                    e.stopEvent();
+                    this.execCmd('InsertHtml','<br /><br />');
+                    this.deferFocus();
+                }
+             };
+        }
+    }(),
+
+    /**
+     * Returns the editor's toolbar. <b>This is only available after the editor has been rendered.</b>
+     * @return {Ext.Toolbar}
+     */
+    getToolbar : function(){
+        return this.tb;
+    },
+
+    /**
+     * Object collection of toolbar tooltips for the buttons in the editor. The key
+     * is the command id associated with that button and the value is a valid QuickTips object.
+     * For example:
+<pre><code>
+{
+    bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+    },
+    italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+    },
+    ...
+</code></pre>
+    * @type Object
+     */
+    buttonTips : {
+        bold : {
+            title: 'Bold (Ctrl+B)',
+            text: 'Make the selected text bold.',
+            cls: 'x-html-editor-tip'
+        },
+        italic : {
+            title: 'Italic (Ctrl+I)',
+            text: 'Make the selected text italic.',
+            cls: 'x-html-editor-tip'
+        },
+        underline : {
+            title: 'Underline (Ctrl+U)',
+            text: 'Underline the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        increasefontsize : {
+            title: 'Grow Text',
+            text: 'Increase the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        decreasefontsize : {
+            title: 'Shrink Text',
+            text: 'Decrease the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        backcolor : {
+            title: 'Text Highlight Color',
+            text: 'Change the background color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        forecolor : {
+            title: 'Font Color',
+            text: 'Change the color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyleft : {
+            title: 'Align Text Left',
+            text: 'Align text to the left.',
+            cls: 'x-html-editor-tip'
+        },
+        justifycenter : {
+            title: 'Center Text',
+            text: 'Center text in the editor.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyright : {
+            title: 'Align Text Right',
+            text: 'Align text to the right.',
+            cls: 'x-html-editor-tip'
+        },
+        insertunorderedlist : {
+            title: 'Bullet List',
+            text: 'Start a bulleted list.',
+            cls: 'x-html-editor-tip'
+        },
+        insertorderedlist : {
+            title: 'Numbered List',
+            text: 'Start a numbered list.',
+            cls: 'x-html-editor-tip'
+        },
+        createlink : {
+            title: 'Hyperlink',
+            text: 'Make the selected text a hyperlink.',
+            cls: 'x-html-editor-tip'
+        },
+        sourceedit : {
+            title: 'Source Edit',
+            text: 'Switch to source editing mode.',
+            cls: 'x-html-editor-tip'
+        }
+    }
+
+    // hide stuff that is not compatible
+    /**
+     * @event blur
+     * @hide
+     */
+    /**
+     * @event change
+     * @hide
+     */
+    /**
+     * @event focus
+     * @hide
+     */
+    /**
+     * @event specialkey
+     * @hide
+     */
+    /**
+     * @cfg {String} fieldClass @hide
+     */
+    /**
+     * @cfg {String} focusClass @hide
+     */
+    /**
+     * @cfg {String} autoCreate @hide
+     */
+    /**
+     * @cfg {String} inputType @hide
+     */
+    /**
+     * @cfg {String} invalidClass @hide
+     */
+    /**
+     * @cfg {String} invalidText @hide
+     */
+    /**
+     * @cfg {String} msgFx @hide
+     */
+    /**
+     * @cfg {String} validateOnBlur @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} applyTo @hide
+     */
+    /**
+     * @cfg {String} autoHeight  @hide
+     */
+    /**
+     * @cfg {String} autoWidth  @hide
+     */
+    /**
+     * @cfg {String} cls  @hide
+     */
+    /**
+     * @cfg {String} disabled  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} msgTarget  @hide
+     */
+    /**
+     * @cfg {String} readOnly  @hide
+     */
+    /**
+     * @cfg {String} style  @hide
+     */
+    /**
+     * @cfg {String} validationDelay  @hide
+     */
+    /**
+     * @cfg {String} validationEvent  @hide
+     */
+    /**
+     * @cfg {String} tabIndex  @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method validate
+     * @hide
+     */
+    /**
+     * @event valid
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+    /**
+     * @cfg keys
+     * @hide
+     */
+});
+Ext.reg('htmleditor', Ext.form.HtmlEditor);
+/**
+ * @class Ext.form.TimeField
+ * @extends Ext.form.ComboBox
+ * Provides a time input field with a time dropdown and automatic time validation.  Example usage:
+ * <pre><code>
+new Ext.form.TimeField({
+    minValue: '9:00 AM',
+    maxValue: '6:00 PM',
+    increment: 30
+});
+</code></pre>
+ * @constructor
+ * Create a new TimeField
+ * @param {Object} config
+ * @xtype timefield
+ */
+Ext.form.TimeField = Ext.extend(Ext.form.ComboBox, {
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    minValue : undefined,
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    maxValue : undefined,
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before minValue (defaults to
+     * 'The time in this field must be equal to or after {0}').
+     */
+    minText : "The time in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the time is after maxValue (defaults to
+     * 'The time in this field must be equal to or before {0}').
+     */
+    maxText : "The time in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the time in the field is invalid (defaults to
+     * '{value} is not a valid time').
+     */
+    invalidText : "{0} is not a valid time",
+    /**
+     * @cfg {String} format
+     * The default time format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to 'g:i A', e.g., '3:15 PM').  For 24-hour time
+     * format try 'H:i' instead.
+     */
+    format : "g:i A",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "|" to try when parsing a user input value and it doesn't match the defined
+     * format (defaults to 'g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A').
+     */
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",
+    /**
+     * @cfg {Number} increment
+     * The number of minutes between each time value in the list (defaults to 15).
+     */
+    increment: 15,
+
+    // private override
+    mode: 'local',
+    // private override
+    triggerAction: 'all',
+    // private override
+    typeAhead: false,
+
+    // private - This is the date to use when generating time values in the absence of either minValue
+    // or maxValue.  Using the current date causes DST issues on DST boundary dates, so this is an
+    // arbitrary "safe" date that can be any date aside from DST boundary dates.
+    initDate: '1/1/2008',
+
+    initDateFormat: 'j/n/Y',
+
+    // private
+    initComponent : function(){
+        if(Ext.isDefined(this.minValue)){
+            this.setMinValue(this.minValue, true);
+        }
+        if(Ext.isDefined(this.maxValue)){
+            this.setMaxValue(this.maxValue, true);
+        }
+        if(!this.store){
+            this.generateStore(true);
+        }
+        Ext.form.TimeField.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Replaces any existing {@link #minValue} with the new time and refreshes the store.
+     * @param {Date/String} value The minimum time that can be selected
+     */
+    setMinValue: function(value, /* private */ initial){
+        this.setLimit(value, true, initial);
+        return this;
+    },
+
+    /**
+     * Replaces any existing {@link #maxValue} with the new time and refreshes the store.
+     * @param {Date/String} value The maximum time that can be selected
+     */
+    setMaxValue: function(value, /* private */ initial){
+        this.setLimit(value, false, initial);
+        return this;
+    },
+
+    // private
+    generateStore: function(initial){
+        var min = this.minValue || new Date(this.initDate).clearTime(),
+            max = this.maxValue || new Date(this.initDate).clearTime().add('mi', (24 * 60) - 1),
+            times = [];
+
+        while(min <= max){
+            times.push(min.dateFormat(this.format));
+            min = min.add('mi', this.increment);
+        }
+        this.bindStore(times, initial);
+    },
+
+    // private
+    setLimit: function(value, isMin, initial){
+        var d;
+        if(Ext.isString(value)){
+            d = this.parseDate(value);
+        }else if(Ext.isDate(value)){
+            d = value;
+        }
+        if(d){
+            var val = new Date(this.initDate).clearTime();
+            val.setHours(d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds());
+            this[isMin ? 'minValue' : 'maxValue'] = val;
+            if(!initial){
+                this.generateStore();
+            }
+        }
+    },
+
+    // inherited docs
+    getValue : function(){
+        var v = Ext.form.TimeField.superclass.getValue.call(this);
+        return this.formatDate(this.parseDate(v)) || '';
+    },
+
+    // inherited docs
+    setValue : function(value){
+        return Ext.form.TimeField.superclass.setValue.call(this, this.formatDate(this.parseDate(value)));
+    },
+
+    // private overrides
+    validateValue : Ext.form.DateField.prototype.validateValue,
+
+    formatDate : Ext.form.DateField.prototype.formatDate,
+
+    parseDate: function(value) {
+        if (!value || Ext.isDate(value)) {
+            return value;
+        }
+
+        var id = this.initDate + ' ',
+            idf = this.initDateFormat + ' ',
+            v = Date.parseDate(id + value, idf + this.format), // *** handle DST. note: this.format is a TIME-only format
+            af = this.altFormats;
+
+        if (!v && af) {
+            if (!this.altFormatsArray) {
+                this.altFormatsArray = af.split("|");
+            }
+            for (var i = 0, afa = this.altFormatsArray, len = afa.length; i < len && !v; i++) {
+                v = Date.parseDate(id + value, idf + afa[i]);
+            }
+        }
+
+        return v;
+    }
+});
+Ext.reg('timefield', Ext.form.TimeField);/**
+ * @class Ext.form.SliderField
+ * @extends Ext.form.Field
+ * Wraps a {@link Ext.slider.MultiSlider Slider} so it can be used as a form field.
+ * @constructor
+ * Creates a new SliderField
+ * @param {Object} config Configuration options. Note that you can pass in any slider configuration options, as well as
+ * as any field configuration options.
+ * @xtype sliderfield
+ */
+Ext.form.SliderField = Ext.extend(Ext.form.Field, {
+    
+    /**
+     * @cfg {Boolean} useTips
+     * True to use an Ext.slider.Tip to display tips for the value. Defaults to <tt>true</tt>.
+     */
+    useTips : true,
+    
+    /**
+     * @cfg {Function} tipText
+     * A function used to display custom text for the slider tip. Defaults to <tt>null</tt>, which will
+     * use the default on the plugin.
+     */
+    tipText : null,
+    
+    // private override
+    actionMode: 'wrap',
+    
+    /**
+     * Initialize the component.
+     * @private
+     */
+    initComponent : function() {
+        var cfg = Ext.copyTo({
+            id: this.id + '-slider'
+        }, this.initialConfig, ['vertical', 'minValue', 'maxValue', 'decimalPrecision', 'keyIncrement', 'increment', 'clickToChange', 'animate']);
+        
+        // only can use it if it exists.
+        if (this.useTips) {
+            var plug = this.tipText ? {getText: this.tipText} : {};
+            cfg.plugins = [new Ext.slider.Tip(plug)];
+        }
+        this.slider = new Ext.Slider(cfg);
+        Ext.form.SliderField.superclass.initComponent.call(this);
+    },    
+    
+    /**
+     * Set up the hidden field
+     * @param {Object} ct The container to render to.
+     * @param {Object} position The position in the container to render to.
+     * @private
+     */
+    onRender : function(ct, position){
+        this.autoCreate = {
+            id: this.id,
+            name: this.name,
+            type: 'hidden',
+            tag: 'input'    
+        };
+        Ext.form.SliderField.superclass.onRender.call(this, ct, position);
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
+        this.resizeEl = this.positionEl = this.wrap;
+        this.slider.render(this.wrap);
+    },
+    
+    /**
+     * Ensure that the slider size is set automatically when the field resizes.
+     * @param {Object} w The width
+     * @param {Object} h The height
+     * @param {Object} aw The adjusted width
+     * @param {Object} ah The adjusted height
+     * @private
+     */
+    onResize : function(w, h, aw, ah){
+        Ext.form.SliderField.superclass.onResize.call(this, w, h, aw, ah);
+        this.slider.setSize(w, h);    
+    },
+    
+    /**
+     * Initialize any events for this class.
+     * @private
+     */
+    initEvents : function(){
+        Ext.form.SliderField.superclass.initEvents.call(this);
+        this.slider.on('change', this.onChange, this);   
+    },
+    
+    /**
+     * Utility method to set the value of the field when the slider changes.
+     * @param {Object} slider The slider object.
+     * @param {Object} v The new value.
+     * @private
+     */
+    onChange : function(slider, v){
+        this.setValue(v, undefined, true);
+    },
+    
+    /**
+     * Enable the slider when the field is enabled.
+     * @private
+     */
+    onEnable : function(){
+        Ext.form.SliderField.superclass.onEnable.call(this);
+        this.slider.enable();
+    },
+    
+    /**
+     * Disable the slider when the field is disabled.
+     * @private
+     */
+    onDisable : function(){
+        Ext.form.SliderField.superclass.onDisable.call(this);
+        this.slider.disable();    
+    },
+    
+    /**
+     * Ensure the slider is destroyed when the field is destroyed.
+     * @private
+     */
+    beforeDestroy : function(){
+        Ext.destroy(this.slider);
+        Ext.form.SliderField.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * If a side icon is shown, do alignment to the slider
+     * @private
+     */
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.slider.el, 'tl-tr', [2, 0]);
+    },
+    
+    /**
+     * Sets the minimum field value.
+     * @param {Number} v The new minimum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMinValue : function(v){
+        this.slider.setMinValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the maximum field value.
+     * @param {Number} v The new maximum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMaxValue : function(v){
+        this.slider.setMaxValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the value for this field.
+     * @param {Number} v The new value.
+     * @param {Boolean} animate (optional) Whether to animate the transition. If not specified, it will default to the animate config.
+     * @return {Ext.form.SliderField} this
+     */
+    setValue : function(v, animate, /* private */ silent){
+        // silent is used if the setValue method is invoked by the slider
+        // which means we don't need to set the value on the slider.
+        if(!silent){
+            this.slider.setValue(v, animate);
+        }
+        return Ext.form.SliderField.superclass.setValue.call(this, this.slider.getValue());
+    },
+    
+    /**
+     * Gets the current value for this field.
+     * @return {Number} The current value.
+     */
+    getValue : function(){
+        return this.slider.getValue();    
+    }
+});
+
+Ext.reg('sliderfield', Ext.form.SliderField);/**
+ * @class Ext.form.Label
+ * @extends Ext.BoxComponent
+ * Basic Label field.
+ * @constructor
+ * Creates a new Label
+ * @param {Ext.Element/String/Object} config The configuration options.  If an element is passed, it is set as the internal
+ * element and its id used as the component id.  If a string is passed, it is assumed to be the id of an existing element
+ * and is used as the component id.  Otherwise, it is assumed to be a standard config object and is applied to the component.
+ * @xtype label
+ */
+Ext.form.Label = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} text The plain text to display within the label (defaults to ''). If you need to include HTML
+     * tags within the label's innerHTML, use the {@link #html} config instead.
+     */
+    /**
+     * @cfg {String} forId The id of the input element to which this label will be bound via the standard HTML 'for'
+     * attribute. If not specified, the attribute will not be added to the label.
+     */
+    /**
+     * @cfg {String} html An HTML fragment that will be used as the label's innerHTML (defaults to '').
+     * Note that if {@link #text} is specified it will take precedence and this value will be ignored.
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('label');
+            this.el.id = this.getId();
+            this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');
+            if(this.forId){
+                this.el.setAttribute('for', this.forId);
+            }
+        }
+        Ext.form.Label.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates the label's innerHTML with the specified string.
+     * @param {String} text The new label text
+     * @param {Boolean} encode (optional) False to skip HTML-encoding the text when rendering it
+     * to the label (defaults to true which encodes the value). This might be useful if you want to include
+     * tags in the label's innerHTML rather than rendering them as string literals per the default logic.
+     * @return {Label} this
+     */
+    setText : function(t, encode){
+        var e = encode === false;
+        this[!e ? 'text' : 'html'] = t;
+        delete this[e ? 'text' : 'html'];
+        if(this.rendered){
+            this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;
+        }
+        return this;
+    }
+});
+
+Ext.reg('label', Ext.form.Label);/**
+ * @class Ext.form.Action
+ * <p>The subclasses of this class provide actions to perform upon {@link Ext.form.BasicForm Form}s.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * the Form needs to perform an action such as submit or load. The Configuration options
+ * listed for this class are set through the Form's action methods: {@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}</p>
+ * <p>The instance of Action which performed the action is passed to the success
+ * and failure callbacks of the Form's action methods ({@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}),
+ * and to the {@link Ext.form.BasicForm#actioncomplete actioncomplete} and
+ * {@link Ext.form.BasicForm#actionfailed actionfailed} event handlers.</p>
+ */
+Ext.form.Action = function(form, options){
+    this.form = form;
+    this.options = options || {};
+};
+
+/**
+ * Failure type returned when client side validation of the Form fails
+ * thus aborting a submit action. Client side validation is performed unless
+ * {@link #clientValidation} is explicitly set to <tt>false</tt>.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CLIENT_INVALID = 'client';
+/**
+ * <p>Failure type returned when server side processing fails and the {@link #result}'s
+ * <tt style="font-weight:bold">success</tt> property is set to <tt>false</tt>.</p>
+ * <p>In the case of a form submission, field-specific error messages may be returned in the
+ * {@link #result}'s <tt style="font-weight:bold">errors</tt> property.</p>
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.SERVER_INVALID = 'server';
+/**
+ * Failure type returned when a communication error happens when attempting
+ * to send a request to the remote server. The {@link #response} may be examined to
+ * provide further information.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CONNECT_FAILURE = 'connect';
+/**
+ * Failure type returned when the response's <tt style="font-weight:bold">success</tt>
+ * property is set to <tt>false</tt>, or no field values are returned in the response's
+ * <tt style="font-weight:bold">data</tt> property.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.LOAD_FAILURE = 'load';
+
+Ext.form.Action.prototype = {
+/**
+ * @cfg {String} url The URL that the Action is to invoke.
+ */
+/**
+ * @cfg {Boolean} reset When set to <tt><b>true</b></tt>, causes the Form to be
+ * {@link Ext.form.BasicForm.reset reset} on Action success. If specified, this happens
+ * <b>before</b> the {@link #success} callback is called and before the Form's
+ * {@link Ext.form.BasicForm.actioncomplete actioncomplete} event fires.
+ */
+/**
+ * @cfg {String} method The HTTP method to use to access the requested URL. Defaults to the
+ * {@link Ext.form.BasicForm}'s method, or if that is not specified, the underlying DOM form's method.
+ */
+/**
+ * @cfg {Mixed} params <p>Extra parameter values to pass. These are added to the Form's
+ * {@link Ext.form.BasicForm#baseParams} and passed to the specified URL along with the Form's
+ * input fields.</p>
+ * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+ */
+/**
+ * @cfg {Number} timeout The number of seconds to wait for a server response before
+ * failing with the {@link #failureType} as {@link #Action.CONNECT_FAILURE}. If not specified,
+ * defaults to the configured <tt>{@link Ext.form.BasicForm#timeout timeout}</tt> of the
+ * {@link Ext.form.BasicForm form}.
+ */
+/**
+ * @cfg {Function} success The function to call when a valid success return packet is recieved.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Function} failure The function to call when a failure packet was recieved, or when an
+ * error ocurred in the Ajax communication.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. If an Ajax
+ * error ocurred, the failure type will be in {@link #failureType}. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Object} scope The scope in which to call the callback functions (The <tt>this</tt> reference
+ * for the callback functions).
+ */
+/**
+ * @cfg {String} waitMsg The message to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+/**
+ * @cfg {String} waitTitle The title to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+
+/**
+ * @cfg {Boolean} submitEmptyText If set to <tt>true</tt>, the emptyText value will be sent with the form
+ * when it is submitted.  Defaults to <tt>true</tt>.
+ */
+
+/**
+ * The type of action this Action instance performs.
+ * Currently only "submit" and "load" are supported.
+ * @type {String}
+ */
+    type : 'default',
+/**
+ * The type of failure detected will be one of these: {@link #CLIENT_INVALID},
+ * {@link #SERVER_INVALID}, {@link #CONNECT_FAILURE}, or {@link #LOAD_FAILURE}.  Usage:
+ * <pre><code>
+var fp = new Ext.form.FormPanel({
+...
+buttons: [{
+    text: 'Save',
+    formBind: true,
+    handler: function(){
+        if(fp.getForm().isValid()){
+            fp.getForm().submit({
+                url: 'form-submit.php',
+                waitMsg: 'Submitting your data...',
+                success: function(form, action){
+                    // server responded with success = true
+                    var result = action.{@link #result};
+                },
+                failure: function(form, action){
+                    if (action.{@link #failureType} === Ext.form.Action.{@link #CONNECT_FAILURE}) {
+                        Ext.Msg.alert('Error',
+                            'Status:'+action.{@link #response}.status+': '+
+                            action.{@link #response}.statusText);
+                    }
+                    if (action.failureType === Ext.form.Action.{@link #SERVER_INVALID}){
+                        // server responded with success = false
+                        Ext.Msg.alert('Invalid', action.{@link #result}.errormsg);
+                    }
+                }
+            });
+        }
+    }
+},{
+    text: 'Reset',
+    handler: function(){
+        fp.getForm().reset();
+    }
+}]
+ * </code></pre>
+ * @property failureType
+ * @type {String}
+ */
+ /**
+ * The XMLHttpRequest object used to perform the action.
+ * @property response
+ * @type {Object}
+ */
+ /**
+ * The decoded response object containing a boolean <tt style="font-weight:bold">success</tt> property and
+ * other, action-specific properties.
+ * @property result
+ * @type {Object}
+ */
+
+    // interface method
+    run : function(options){
+
+    },
+
+    // interface method
+    success : function(response){
+
+    },
+
+    // interface method
+    handleResponse : function(response){
+
+    },
+
+    // default connection failure
+    failure : function(response){
+        this.response = response;
+        this.failureType = Ext.form.Action.CONNECT_FAILURE;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    // shared code among all Actions to validate that there was a response
+    // with either responseText or responseXml
+    processResponse : function(response){
+        this.response = response;
+        if(!response.responseText && !response.responseXML){
+            return true;
+        }
+        this.result = this.handleResponse(response);
+        return this.result;
+    },
+    
+    decodeResponse: function(response) {
+        try {
+            return Ext.decode(response.responseText);
+        } catch(e) {
+            return false;
+        } 
+    },
+
+    // utility functions used internally
+    getUrl : function(appendParams){
+        var url = this.options.url || this.form.url || this.form.el.dom.action;
+        if(appendParams){
+            var p = this.getParams();
+            if(p){
+                url = Ext.urlAppend(url, p);
+            }
+        }
+        return url;
+    },
+
+    // private
+    getMethod : function(){
+        return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();
+    },
+
+    // private
+    getParams : function(){
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        if(p){
+            if(typeof p == "object"){
+                p = Ext.urlEncode(Ext.applyIf(p, bp));
+            }else if(typeof p == 'string' && bp){
+                p += '&' + Ext.urlEncode(bp);
+            }
+        }else if(bp){
+            p = Ext.urlEncode(bp);
+        }
+        return p;
+    },
+
+    // private
+    createCallback : function(opts){
+        var opts = opts || {};
+        return {
+            success: this.success,
+            failure: this.failure,
+            scope: this,
+            timeout: (opts.timeout*1000) || (this.form.timeout*1000),
+            upload: this.form.fileUpload ? this.success : undefined
+        };
+    }
+};
+
+/**
+ * @class Ext.form.Action.Submit
+ * @extends Ext.form.Action
+ * <p>A class which handles submission of data from {@link Ext.form.BasicForm Form}s
+ * and processes the returned response.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#submit submit}ting.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet may contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean
+ * <div class="sub-desc">The <code>success</code> property is required.</div></li>
+ * <li><b><code>errors</code></b> property : Object
+ * <div class="sub-desc"><div class="sub-desc">The <code>errors</code> property,
+ * which is optional, contains error messages for invalid fields.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so a typical response
+ * packet may look like this:</p><pre><code>
+{
+    success: false,
+    errors: {
+        clientCode: "Client not found",
+        portOfLoading: "This field must not be null"
+    }
+}</code></pre>
+ * <p>Other data may be placed into the response for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ * <p>Alternatively, if an {@link #errorReader} is specified as an {@link Ext.data.XmlReader XmlReader}:</p><pre><code>
+    errorReader: new Ext.data.XmlReader({
+            record : 'field',
+            success: '@success'
+        }, [
+            'id', 'msg'
+        ]
+    )
+</code></pre>
+ * <p>then the results may be sent back in XML format:</p><pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;message success="false"&gt;
+&lt;errors&gt;
+    &lt;field&gt;
+        &lt;id&gt;clientCode&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Code not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+    &lt;field&gt;
+        &lt;id&gt;portOfLoading&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Port not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+&lt;/errors&gt;
+&lt;/message&gt;
+</code></pre>
+ * <p>Other elements may be placed into the response XML for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The XML document is available in the {@link #errorReader}'s {@link Ext.data.XmlReader#xmlData xmlData} property.</p>
+ */
+Ext.form.Action.Submit = function(form, options){
+    Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
+};
+
+Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
+    /**
+     * @cfg {Ext.data.DataReader} errorReader <p><b>Optional. JSON is interpreted with
+     * no need for an errorReader.</b></p>
+     * <p>A Reader which reads a single record from the returned data. The DataReader's
+     * <b>success</b> property specifies how submission success is determined. The Record's
+     * data provides the error messages to apply to any invalid form Fields.</p>
+     */
+    /**
+     * @cfg {boolean} clientValidation Determines whether a Form's fields are validated
+     * in a final call to {@link Ext.form.BasicForm#isValid isValid} prior to submission.
+     * Pass <tt>false</tt> in the Form's submit options to prevent this. If not defined, pre-submission field validation
+     * is performed.
+     */
+    type : 'submit',
+
+    // private
+    run : function(){
+        var o = this.options,
+            method = this.getMethod(),
+            isGet = method == 'GET';
+        if(o.clientValidation === false || this.form.isValid()){
+            if (o.submitEmptyText === false) {
+                var fields = this.form.items,
+                    emptyFields = [],
+                    setupEmptyFields = function(f){
+                        if (f.el.getValue() == f.emptyText) {
+                            emptyFields.push(f);
+                            f.el.dom.value = "";
+                        }
+                        if(f.isComposite && f.rendered){
+                            f.items.each(setupEmptyFields);
+                        }
+                    };
+                    
+                fields.each(setupEmptyFields);
+            }
+            Ext.Ajax.request(Ext.apply(this.createCallback(o), {
+                form:this.form.el.dom,
+                url:this.getUrl(isGet),
+                method: method,
+                headers: o.headers,
+                params:!isGet ? this.getParams() : null,
+                isUpload: this.form.fileUpload
+            }));
+            if (o.submitEmptyText === false) {
+                Ext.each(emptyFields, function(f) {
+                    if (f.applyEmptyText) {
+                        f.applyEmptyText();
+                    }
+                });
+            }
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || result.success){
+            this.form.afterAction(this, true);
+            return;
+        }
+        if(result.errors){
+            this.form.markInvalid(result.errors);
+        }
+        this.failureType = Ext.form.Action.SERVER_INVALID;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.errorReader){
+            var rs = this.form.errorReader.read(response);
+            var errors = [];
+            if(rs.records){
+                for(var i = 0, len = rs.records.length; i < len; i++) {
+                    var r = rs.records[i];
+                    errors[i] = r.data;
+                }
+            }
+            if(errors.length < 1){
+                errors = null;
+            }
+            return {
+                success : rs.success,
+                errors : errors
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+/**
+ * @class Ext.form.Action.Load
+ * @extends Ext.form.Action
+ * <p>A class which handles loading of data from a server into the Fields of an {@link Ext.form.BasicForm}.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#load load}ing.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet <b>must</b> contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean</li>
+ * <li><b><code>data</code></b> property : Object</li>
+ * <div class="sub-desc">The <code>data</code> property contains the values of Fields to load.
+ * The individual value object for each Field is passed to the Field's
+ * {@link Ext.form.Field#setValue setValue} method.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so for the following form load call:<pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    title: 'Client and routing info',
+    items: [{
+        fieldLabel: 'Client',
+        name: 'clientName'
+    }, {
+        fieldLabel: 'Port of loading',
+        name: 'portOfLoading'
+    }, {
+        fieldLabel: 'Port of discharge',
+        name: 'portOfDischarge'
+    }]
+});
+myFormPanel.{@link Ext.form.FormPanel#getForm getForm}().{@link Ext.form.BasicForm#load load}({
+    url: '/getRoutingInfo.php',
+    params: {
+        consignmentRef: myConsignmentRef
+    },
+    failure: function(form, action) {
+        Ext.Msg.alert("Load failed", action.result.errorMessage);
+    }
+});
+</code></pre>
+ * a <b>success response</b> packet may look like this:</p><pre><code>
+{
+    success: true,
+    data: {
+        clientName: "Fred. Olsen Lines",
+        portOfLoading: "FXT",
+        portOfDischarge: "OSL"
+    }
+}</code></pre>
+ * while a <b>failure response</b> packet may look like this:</p><pre><code>
+{
+    success: false,
+    errorMessage: "Consignment reference not found"
+}</code></pre>
+ * <p>Other data may be placed into the response for processing the {@link Ext.form.BasicForm Form}'s
+ * callback or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ */
+Ext.form.Action.Load = function(form, options){
+    Ext.form.Action.Load.superclass.constructor.call(this, form, options);
+    this.reader = this.form.reader;
+};
+
+Ext.extend(Ext.form.Action.Load, Ext.form.Action, {
+    // private
+    type : 'load',
+
+    // private
+    run : function(){
+        Ext.Ajax.request(Ext.apply(
+                this.createCallback(this.options), {
+                    method:this.getMethod(),
+                    url:this.getUrl(false),
+                    headers: this.options.headers,
+                    params:this.getParams()
+        }));
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || !result.success || !result.data){
+            this.failureType = Ext.form.Action.LOAD_FAILURE;
+            this.form.afterAction(this, false);
+            return;
+        }
+        this.form.clearInvalid();
+        this.form.setValues(result.data);
+        this.form.afterAction(this, true);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.reader){
+            var rs = this.form.reader.read(response);
+            var data = rs.records && rs.records[0] ? rs.records[0].data : null;
+            return {
+                success : rs.success,
+                data : data
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+
+/**
+ * @class Ext.form.Action.DirectLoad
+ * @extends Ext.form.Action.Load
+ * <p>Provides Ext.direct support for loading form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>load</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+
+// load the form
+myFormPanel.getForm().load({
+    // pass 2 arguments to server side getBasicInfo method (len=2)
+    params: {
+        foo: 'bar',
+        uid: 34
+    }
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "data":[34,"bar"] // note the order of the params
+    }
+]
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following format:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "result":{
+            "success":true,
+            "data":{
+                "name":"Fred Flintstone",
+                "company":"Slate Rock and Gravel",
+                "email":"fred.flintstone@slaterg.com"
+            }
+        }
+    }
+]
+ * </code></pre>
+ */
+Ext.form.Action.DirectLoad = Ext.extend(Ext.form.Action.Load, {
+    constructor: function(form, opts) {
+        Ext.form.Action.DirectLoad.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directload',
+
+    run : function(){
+        var args = this.getParams();
+        args.push(this.success, this);
+        this.form.api.load.apply(window, args);
+    },
+
+    getParams : function() {
+        var buf = [], o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        var paramOrder = this.form.paramOrder;
+        if(paramOrder){
+            for(var i = 0, len = paramOrder.length; i < len; i++){
+                buf.push(o[paramOrder[i]]);
+            }
+        }else if(this.form.paramsAsHash){
+            buf.push(o);
+        }
+        return buf;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectLoad.superclass.success.call(this, response);
+    }
+});
+
+/**
+ * @class Ext.form.Action.DirectSubmit
+ * @extends Ext.form.Action.Submit
+ * <p>Provides Ext.direct support for submitting form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>submit</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+    buttons:[{
+        text: 'Submit',
+        handler: function(){
+            myFormPanel.getForm().submit({
+                params: {
+                    foo: 'bar',
+                    uid: 34
+                }
+            });
+        }
+    }],
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+{
+    "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+    "result":{
+        "success":true,
+        "id":{
+            "extAction":"Profile","extMethod":"updateBasicInfo",
+            "extType":"rpc","extTID":"6","extUpload":"false",
+            "name":"Aaron Conran","email":"aaron@extjs.com","company":"Ext JS, LLC"
+        }
+    }
+}
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following:
+ * <pre><code>
+// sample success packet (batched requests)
+[
+    {
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
+        "result":{
+            "success":true
+        }
+    }
+]
+
+// sample failure packet (one request)
+{
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+        "result":{
+            "errors":{
+                "email":"already taken"
+            },
+            "success":false,
+            "foo":"bar"
+        }
+}
+ * </code></pre>
+ * Also see the discussion in {@link Ext.form.Action.DirectLoad}.
+ */
+Ext.form.Action.DirectSubmit = Ext.extend(Ext.form.Action.Submit, {
+    constructor : function(form, opts) {
+        Ext.form.Action.DirectSubmit.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directsubmit',
+    // override of Submit
+    run : function(){
+        var o = this.options;
+        if(o.clientValidation === false || this.form.isValid()){
+            // tag on any additional params to be posted in the
+            // form scope
+            this.success.params = this.getParams();
+            this.form.api.submit(this.form.el.dom, this.success, this);
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    getParams : function() {
+        var o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        return o;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectSubmit.superclass.success.call(this, response);
+    }
+});
+
+Ext.form.Action.ACTION_TYPES = {
+    'load' : Ext.form.Action.Load,
+    'submit' : Ext.form.Action.Submit,
+    'directload' : Ext.form.Action.DirectLoad,
+    'directsubmit' : Ext.form.Action.DirectSubmit
+};
+/**
+ * @class Ext.form.VTypes
+ * <p>This is a singleton object which contains a set of commonly used field validation functions.
+ * The validations provided are basic and intended to be easily customizable and extended.</p>
+ * <p>To add custom VTypes specify the <code>{@link Ext.form.TextField#vtype vtype}</code> validation
+ * test function, and optionally specify any corresponding error text to display and any keystroke
+ * filtering mask to apply. For example:</p>
+ * <pre><code>
+// custom Vtype for vtype:'time'
+var timeTest = /^([1-9]|1[0-9]):([0-5][0-9])(\s[a|p]m)$/i;
+Ext.apply(Ext.form.VTypes, {
+    //  vtype validation function
+    time: function(val, field) {
+        return timeTest.test(val);
+    },
+    // vtype Text property: The error text to display when the validation function returns false
+    timeText: 'Not a valid time.  Must be in the format "12:34 PM".',
+    // vtype Mask property: The keystroke filter mask
+    timeMask: /[\d\s:amp]/i
+});
+ * </code></pre>
+ * Another example:
+ * <pre><code>
+// custom Vtype for vtype:'IPAddress'
+Ext.apply(Ext.form.VTypes, {
+    IPAddress:  function(v) {
+        return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
+    },
+    IPAddressText: 'Must be a numeric IP address',
+    IPAddressMask: /[\d\.]/i
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.form.VTypes = function(){
+    // closure these in so they are only created once.
+    var alpha = /^[a-zA-Z_]+$/,
+        alphanum = /^[a-zA-Z0-9_]+$/,
+        email = /^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,
+        url = /(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
+
+    // All these messages and functions are configurable
+    return {
+        /**
+         * The function used to validate email addresses.  Note that this is a very basic validation -- complete
+         * validation per the email RFC specifications is very complex and beyond the scope of this class, although
+         * this function can be overridden if a more comprehensive validation scheme is desired.  See the validation
+         * section of the <a href="http://en.wikipedia.org/wiki/E-mail_address">Wikipedia article on email addresses</a>
+         * for additional information.  This implementation is intended to validate the following emails:<tt>
+         * 'barney@example.de', 'barney.rubble@example.com', 'barney-rubble@example.coop', 'barney+rubble@example.com'
+         * </tt>.
+         * @param {String} value The email address
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'email' : function(v){
+            return email.test(v);
+        },
+        /**
+         * The error text to display when the email validation function returns false.  Defaults to:
+         * <tt>'This field should be an e-mail address in the format "user@example.com"'</tt>
+         * @type String
+         */
+        'emailText' : 'This field should be an e-mail address in the format "user@example.com"',
+        /**
+         * The keystroke filter mask to be applied on email input.  See the {@link #email} method for
+         * information about more complex email validation. Defaults to:
+         * <tt>/[a-z0-9_\.\-\+\'@]/i</tt>
+         * @type RegExp
+         */
+        'emailMask' : /[a-z0-9_\.\-\+\'@]/i,
+
+        /**
+         * The function used to validate URLs
+         * @param {String} value The URL
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'url' : function(v){
+            return url.test(v);
+        },
+        /**
+         * The error text to display when the url validation function returns false.  Defaults to:
+         * <tt>'This field should be a URL in the format "http:/'+'/www.example.com"'</tt>
+         * @type String
+         */
+        'urlText' : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+
+        /**
+         * The function used to validate alpha values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alpha' : function(v){
+            return alpha.test(v);
+        },
+        /**
+         * The error text to display when the alpha validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters and _'</tt>
+         * @type String
+         */
+        'alphaText' : 'This field should only contain letters and _',
+        /**
+         * The keystroke filter mask to be applied on alpha input.  Defaults to:
+         * <tt>/[a-z_]/i</tt>
+         * @type RegExp
+         */
+        'alphaMask' : /[a-z_]/i,
+
+        /**
+         * The function used to validate alphanumeric values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alphanum' : function(v){
+            return alphanum.test(v);
+        },
+        /**
+         * The error text to display when the alphanumeric validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters, numbers and _'</tt>
+         * @type String
+         */
+        'alphanumText' : 'This field should only contain letters, numbers and _',
+        /**
+         * The keystroke filter mask to be applied on alphanumeric input.  Defaults to:
+         * <tt>/[a-z0-9_]/i</tt>
+         * @type RegExp
+         */
+        'alphanumMask' : /[a-z0-9_]/i
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-xml-debug.js	(revision 76)
@@ -0,0 +1,479 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.XmlWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action via XML.
+ * XmlWriter uses an instance of {@link Ext.XTemplate} for maximum flexibility in defining your own custom XML schema if the default schema is not appropriate for your needs.
+ * See the {@link #tpl} configuration-property.
+ */
+Ext.data.XmlWriter = function(params) {
+    Ext.data.XmlWriter.superclass.constructor.apply(this, arguments);
+    // compile the XTemplate for rendering XML documents.
+    this.tpl = (typeof(this.tpl) === 'string') ? new Ext.XTemplate(this.tpl).compile() : this.tpl.compile();
+};
+Ext.extend(Ext.data.XmlWriter, Ext.data.DataWriter, {
+    /**
+     * @cfg {String} documentRoot [xrequest] (Optional) The name of the XML document root-node.  <b>Note:</b>
+     * this parameter is required </b>only when</b> sending extra {@link Ext.data.Store#baseParams baseParams} to the server
+     * during a write-request -- if no baseParams are set, the {@link Ext.data.XmlReader#record} meta-property can
+     * suffice as the XML document root-node for write-actions involving just a <b>single record</b>.  For requests
+     * involving <b>multiple</b> records and <b>NO</b> baseParams, the {@link Ext.data.XmlWriter#root} property can
+     * act as the XML document root.
+     */
+    documentRoot: 'xrequest',
+    /**
+     * @cfg {Boolean} forceDocumentRoot [false] Set to <tt>true</tt> to force XML documents having a root-node as defined
+     * by {@link #documentRoot}, even with no baseParams defined.
+     */
+    forceDocumentRoot: false,
+    /**
+     * @cfg {String} root [records] The name of the containing element which will contain the nodes of an write-action involving <b>multiple</b> records.  Each
+     * xml-record written to the server will be wrapped in an element named after {@link Ext.data.XmlReader#record} property.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;user>&lt;first>Barney&lt;/first>&lt;/user>
+</code></pre>
+     * However, when <b>multiple</b> records are written in a batch-operation, these records must be wrapped in a containing
+     * Element.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+    &lt;records>
+        &lt;first>Barney&lt;/first>&lt;/user>
+        &lt;records>&lt;first>Barney&lt;/first>&lt;/user>
+    &lt;/records>
+</code></pre>
+     * Defaults to <tt>records</tt>.  Do not confuse the nature of this property with that of {@link #documentRoot}
+     */
+    root: 'records',
+    /**
+     * @cfg {String} xmlVersion [1.0] The <tt>version</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlVersion : '1.0',
+    /**
+     * @cfg {String} xmlEncoding [ISO-8859-15] The <tt>encoding</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlEncoding: 'ISO-8859-15',
+    /**
+     * @cfg {String/Ext.XTemplate} tpl The XML template used to render {@link Ext.data.Api#actions write-actions} to your server.
+     * <p>One can easily provide his/her own custom {@link Ext.XTemplate#constructor template-definition} if the default does not suffice.</p>
+     * <p>Defaults to:</p>
+<code><pre>
+&lt;?xml version="{version}" encoding="{encoding}"?>
+    &lt;tpl if="documentRoot">&lt;{documentRoot}>
+    &lt;tpl for="baseParams">
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;{root}>',
+    &lt;tpl for="records">
+        &lt;{parent.record}>
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+        &lt;/{parent.record}>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;/{root}>&lt;/tpl>
+    &lt;tpl if="documentRoot">&lt;/{documentRoot}>&lt;/tpl>
+</pre></code>
+     * <p>Templates will be called with the following API</p>
+     * <ul>
+     * <li>{String} version [1.0] The xml version.</li>
+     * <li>{String} encoding [ISO-8859-15] The xml encoding.</li>
+     * <li>{String/false} documentRoot The XML document root-node name or <tt>false</tt> if not required.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * <li>{String} record The meta-data parameter defined on your {@link Ext.data.XmlReader#record} configuration represents the name of the xml-tag containing each record.</li>
+     * <li>{String} root The meta-data parameter defined by {@link Ext.data.XmlWriter#root} configuration-parameter.  Represents the name of the xml root-tag when sending <b>multiple</b> records to the server.</li>
+     * <li>{Array} records The records being sent to the server, ie: the subject of the write-action being performed.  The records parameter will be always be an array, even when only a single record is being acted upon.
+     *     Each item within the records array will contain an array of field objects having the following properties:
+     *     <ul>
+     *         <li>{String} name The field-name of the record as defined by your {@link Ext.data.Record#create Ext.data.Record definition}.  The "mapping" property will be used, otherwise it will match the "name" property.  Use this parameter to define the XML tag-name of the property.</li>
+     *         <li>{Mixed} value The record value of the field enclosed within XML tags specified by name property above.</li>
+     *     </ul></li>
+     * <li>{Array} baseParams.  The baseParams as defined upon {@link Ext.data.Store#baseParams}.  Note that the baseParams have been converted into an array of [{name : "foo", value: "bar"}, ...] pairs in the same manner as the <b>records</b> parameter above.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * </ul>
+     */
+    // Encoding the ? here in case it's being included by some kind of page that will parse it (eg. PHP)
+    tpl: '<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',
+
+
+    /**
+     * XmlWriter implementation of the final stage of a write action.
+     * @param {Object} params Transport-proxy's (eg: {@link Ext.Ajax#request}) params-object to write-to.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data-object representing the compiled Store-recordset.
+     */
+    render : function(params, baseParams, data) {
+        baseParams = this.toArray(baseParams);
+        params.xmlData = this.tpl.applyTemplate({
+            version: this.xmlVersion,
+            encoding: this.xmlEncoding,
+            documentRoot: (baseParams.length > 0 || this.forceDocumentRoot === true) ? this.documentRoot : false,
+            record: this.meta.record,
+            root: this.root,
+            baseParams: baseParams,
+            records: (Ext.isArray(data[0])) ? data : [data]
+        });
+    },
+
+    /**
+     * createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of <tt>name:value</tt> pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    createRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+    },
+
+    /**
+     * updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of {name:value} pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    updateRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+
+    },
+    /**
+     * destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array containing a attribute-object (name/value pair) representing the {@link Ext.data.DataReader#idProperty idProperty}.
+     */
+    destroyRecord : function(rec) {
+        var data = {};
+        data[this.meta.idProperty] = rec.id;
+        return this.toArray(data);
+    }
+});
+/**
+ * @class Ext.data.XmlReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an XML document
+ * based on mappings in a provided {@link Ext.data.Record} constructor.</p>
+ * <p><b>Note</b>: that in order for the browser to parse a returned XML document, the Content-Type
+ * header in the HTTP response must be set to "text/xml" or "application/xml".</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+   {name: 'name', mapping: 'name'},     // "mapping" property not needed if it is the same as "name"
+   {name: 'occupation'}                 // This field will use "occupation" as the mapping.
+]);
+var myReader = new Ext.data.XmlReader({
+   totalProperty: "results", // The element which contains the total dataset size (optional)
+   record: "row",           // The repeated element which contains row information
+   idProperty: "id"         // The element within the row that provides an ID for the record (optional)
+   messageProperty: "msg"   // The element within the response that provides a user-feedback message (optional)
+}, Employee);
+</code></pre>
+ * <p>
+ * This would consume an XML file like this:
+ * <pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;dataset>
+ &lt;results>2&lt;/results>
+ &lt;row>
+   &lt;id>1&lt;/id>
+   &lt;name>Bill&lt;/name>
+   &lt;occupation>Gardener&lt;/occupation>
+ &lt;/row>
+ &lt;row>
+   &lt;id>2&lt;/id>
+   &lt;name>Ben&lt;/name>
+   &lt;occupation>Horticulturalist&lt;/occupation>
+ &lt;/row>
+&lt;/dataset>
+</code></pre>
+ * @cfg {String} totalProperty The DomQuery path from which to retrieve the total number of records
+ * in the dataset. This is only needed if the whole dataset is not passed in one go, but is being
+ * paged from the remote server.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} successProperty The DomQuery path to the success attribute used by forms.
+ * @cfg {String} idPath The DomQuery path relative from the record element to the element that contains
+ * a record identifier value.
+ * @constructor
+ * Create a new XmlReader.
+ * @param {Object} meta Metadata configuration options
+ * @param {Object} recordType Either an Array of field definition objects as passed to
+ * {@link Ext.data.Record#create}, or a Record constructor object created using {@link Ext.data.Record#create}.
+ */
+Ext.data.XmlReader = function(meta, recordType){
+    meta = meta || {};
+
+    // backwards compat, convert idPath or id / success
+    Ext.applyIf(meta, {
+        idProperty: meta.idProperty || meta.idPath || meta.id,
+        successProperty: meta.successProperty || meta.success
+    });
+
+    Ext.data.XmlReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.XmlReader, Ext.data.DataReader, {
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the parsed XML document.  The response is expected
+     * to contain a property called <tt>responseXML</tt> which refers to an XML document object.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var doc = response.responseXML;
+        if(!doc) {
+            throw {message: "XmlReader.read: XML Document not available"};
+        }
+        return this.readRecords(doc);
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from an XML document.
+     * @param {Object} doc A parsed XML document.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(doc){
+        /**
+         * After any data loads/reads, the raw XML Document is available for further custom processing.
+         * @type XMLDocument
+         */
+        this.xmlData = doc;
+
+        var root    = doc.documentElement || doc,
+            q       = Ext.DomQuery,
+            totalRecords = 0,
+            success = true;
+
+        if(this.meta.totalProperty){
+            totalRecords = this.getTotal(root, 0);
+        }
+        if(this.meta.successProperty){
+            success = this.getSuccess(root);
+        }
+
+        var records = this.extractData(q.select(this.meta.record, root), true); // <-- true to return Ext.data.Record[]
+
+        // TODO return Ext.data.Response instance.  @see #readResponse
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords || records.length
+        };
+    },
+
+    /**
+     * Decode an XML response from server.
+     * @param {String} action [{@link Ext.data.Api#actions} create|read|update|destroy]
+     * @param {Object} response HTTP Response object from browser.
+     * @return {Ext.data.Response} An instance of {@link Ext.data.Response}
+     */
+    readResponse : function(action, response) {
+        var q = Ext.DomQuery,
+            doc = response.responseXML,
+            root = doc.documentElement || doc;
+
+        // create general Response instance.
+        var res = new Ext.data.Response({
+            action: action,
+            success : this.getSuccess(root),
+            message: this.getMessage(root),
+            data: this.extractData(q.select(this.meta.record, root) || q.select(this.meta.root, root), false),
+            raw: doc
+        });
+
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.DataReader.Error('successProperty-response', this.meta.successProperty);
+        }
+
+        // Create actions from a response having status 200 must return pk
+        if (action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(res.data);
+            if (def && Ext.isEmpty(res.data)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+        return res;
+    },
+
+    getSuccess : function() {
+        return true;
+    },
+
+    /**
+     * build response-data extractor functions.
+     * @private
+     * @ignore
+     */
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s       = this.meta,
+            Record  = this.recordType,
+            f       = Record.prototype.fields,
+            fi      = f.items,
+            fl      = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = function(res) {
+            return (!Ext.isEmpty(res[this.meta.record])) ? res[this.meta.record] : res[this.meta.root];
+        };
+        if (s.idPath || s.idProperty) {
+            var g = this.createAccessor(s.idPath || s.idProperty);
+            this.getId = function(rec) {
+                var id = g(rec) || rec.id;
+                return (id === undefined || id === '') ? null : id;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * Creates a function to return some particular key of data from a response.
+     * @param {String} key
+     * @return {Function}
+     * @private
+     * @ignore
+     */
+    createAccessor : function(){
+        var q = Ext.DomQuery;
+        return function(key) {
+            if (Ext.isFunction(key)) {
+                return key;
+            }
+            switch(key) {
+                case this.meta.totalProperty:
+                    return function(root, def){
+                        return q.selectNumber(key, root, def);
+                    };
+                    break;
+                case this.meta.successProperty:
+                    return function(root, def) {
+                        var sv = q.selectValue(key, root, true);
+                        var success = sv !== false && sv !== 'false';
+                        return success;
+                    };
+                    break;
+                default:
+                    return function(root, def) {
+                        return q.selectValue(key, root, def);
+                    };
+                    break;
+            }
+        };
+    }(),
+
+    /**
+     * extracts values and type-casts a row of data from server, extracted by #extractData
+     * @param {Hash} data
+     * @param {Ext.data.Field[]} items
+     * @param {Number} len
+     * @private
+     * @ignore
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});/**
+ * @class Ext.data.XmlStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from XML data easier.
+ * A XmlStore will be automatically configured with a {@link Ext.data.XmlReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.XmlStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    url: 'sheldon.xml', // automatically configures a HttpProxy
+    // reader configs
+    record: 'Item', // records will have an "Item" tag
+    idPath: 'ASIN',
+    totalRecords: '@TotalResults'
+    fields: [
+        // set up the fields mapping into the xml doc
+        // The first needs mapping, the others are very basic
+        {name: 'Author', mapping: 'ItemAttributes > Author'},
+        'Title', 'Manufacturer', 'ProductGroup'
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+&#60?xml version="1.0" encoding="UTF-8"?>
+&#60ItemSearchResponse xmlns="http://webservices.amazon.com/AWSECommerceService/2009-05-15">
+    &#60Items>
+        &#60Request>
+            &#60IsValid>True&#60/IsValid>
+            &#60ItemSearchRequest>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60SearchIndex>Books&#60/SearchIndex>
+            &#60/ItemSearchRequest>
+        &#60/Request>
+        &#60TotalResults>203&#60/TotalResults>
+        &#60TotalPages>21&#60/TotalPages>
+        &#60Item>
+            &#60ASIN>0446355453&#60/ASIN>
+            &#60DetailPageURL>
+                http://www.amazon.com/
+            &#60/DetailPageURL>
+            &#60ItemAttributes>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60Manufacturer>Warner Books&#60/Manufacturer>
+                &#60ProductGroup>Book&#60/ProductGroup>
+                &#60Title>Master of the Game&#60/Title>
+            &#60/ItemAttributes>
+        &#60/Item>
+    &#60/Items>
+&#60/ItemSearchResponse>
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.XmlReader XmlReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype xmlstore
+ */
+Ext.data.XmlStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.XmlStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.XmlReader(config)
+        }));
+    }
+});
+Ext.reg('xmlstore', Ext.data.XmlStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/window-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/window-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/window-debug.js	(revision 76)
@@ -0,0 +1,2027 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Window
+ * @extends Ext.Panel
+ * <p>A specialized panel intended for use as an application window.  Windows are floated, {@link #resizable}, and
+ * {@link #draggable} by default.  Windows can be {@link #maximizable maximized} to fill the viewport,
+ * restored to their prior size, and can be {@link #minimize}d.</p>
+ * <p>Windows can also be linked to a {@link Ext.WindowGroup} or managed by the {@link Ext.WindowMgr} to provide
+ * grouping, activation, to front, to back and other application-specific behavior.</p>
+ * <p>By default, Windows will be rendered to document.body. To {@link #constrain} a Window to another element
+ * specify {@link Ext.Component#renderTo renderTo}.</p>
+ * <p><b>Note:</b> By default, the <code>{@link #closable close}</code> header tool <i>destroys</i> the Window resulting in
+ * destruction of any child Components. This makes the Window object, and all its descendants <b>unusable</b>. To enable
+ * re-use of a Window, use <b><code>{@link #closeAction closeAction: 'hide'}</code></b>.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype window
+ */
+Ext.Window = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} x
+     * The X position of the left edge of the window on initial showing. Defaults to centering the Window within
+     * the width of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Number} y
+     * The Y position of the top edge of the window on initial showing. Defaults to centering the Window within
+     * the height of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Boolean} modal
+     * True to make the window modal and mask everything behind it when displayed, false to display it without
+     * restricting access to other UI elements (defaults to false).
+     */
+    /**
+     * @cfg {String/Element} animateTarget
+     * Id or element from which the window should animate while opening (defaults to null with no animation).
+     */
+    /**
+     * @cfg {String} resizeHandles
+     * A valid {@link Ext.Resizable} handles config string (defaults to 'all').  Only applies when resizable = true.
+     */
+    /**
+     * @cfg {Ext.WindowGroup} manager
+     * A reference to the WindowGroup that should manage this window (defaults to {@link Ext.WindowMgr}).
+     */
+    /**
+    * @cfg {String/Number/Component} defaultButton
+    * <p>Specifies a Component to receive focus when this Window is focussed.</p>
+    * <p>This may be one of:</p><div class="mdetail-params"><ul>
+    * <li>The index of a footer Button.</li>
+    * <li>The id of a Component.</li>
+    * <li>A Component.</li>
+    * </ul></div>
+    */
+    /**
+    * @cfg {Function} onEsc
+    * Allows override of the built-in processing for the escape key. Default action
+    * is to close the Window (performing whatever action is specified in {@link #closeAction}.
+    * To prevent the Window closing when the escape key is pressed, specify this as
+    * Ext.emptyFn (See {@link Ext#emptyFn}).
+    */
+    /**
+     * @cfg {Boolean} collapsed
+     * True to render the window collapsed, false to render it expanded (defaults to false). Note that if
+     * {@link #expandOnShow} is true (the default) it will override the <tt>collapsed</tt> config and the window
+     * will always be expanded when shown.
+     */
+    /**
+     * @cfg {Boolean} maximized
+     * True to initially display the window in a maximized state. (Defaults to false).
+     */
+
+    /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to this panel's element (defaults to 'x-window').
+    */
+    baseCls : 'x-window',
+    /**
+     * @cfg {Boolean} resizable
+     * True to allow user resizing at each edge and corner of the window, false to disable resizing (defaults to true).
+     */
+    resizable : true,
+    /**
+     * @cfg {Boolean} draggable
+     * True to allow the window to be dragged by the header bar, false to disable dragging (defaults to true).  Note
+     * that by default the window will be centered in the viewport, so if dragging is disabled the window may need
+     * to be positioned programmatically after render (e.g., myWindow.setPosition(100, 100);).
+     */
+    draggable : true,
+    /**
+     * @cfg {Boolean} closable
+     * <p>True to display the 'close' tool button and allow the user to close the window, false to
+     * hide the button and disallow closing the window (defaults to true).</p>
+     * <p>By default, when close is requested by either clicking the close button in the header
+     * or pressing ESC when the Window has focus, the {@link #close} method will be called. This
+     * will <i>{@link Ext.Component#destroy destroy}</i> the Window and its content meaning that
+     * it may not be reused.</p>
+     * <p>To make closing a Window <i>hide</i> the Window so that it may be reused, set
+     * {@link #closeAction} to 'hide'.
+     */
+    closable : true,
+    /**
+     * @cfg {String} closeAction
+     * <p>The action to take when the close header tool is clicked:
+     * <div class="mdetail-params"><ul>
+     * <li><b><code>'{@link #close}'</code></b> : <b>Default</b><div class="sub-desc">
+     * {@link #close remove} the window from the DOM and {@link Ext.Component#destroy destroy}
+     * it and all descendant Components. The window will <b>not</b> be available to be
+     * redisplayed via the {@link #show} method.
+     * </div></li>
+     * <li><b><code>'{@link #hide}'</code></b> : <div class="sub-desc">
+     * {@link #hide} the window by setting visibility to hidden and applying negative offsets.
+     * The window will be available to be redisplayed via the {@link #show} method.
+     * </div></li>
+     * </ul></div>
+     * <p><b>Note:</b> This setting does not affect the {@link #close} method
+     * which will always {@link Ext.Component#destroy destroy} the window. To
+     * programatically <i>hide</i> a window, call {@link #hide}.</p>
+     */
+    closeAction : 'close',
+    /**
+     * @cfg {Boolean} constrain
+     * True to constrain the window within its containing element, false to allow it to fall outside of its
+     * containing element. By default the window will be rendered to document.body.  To render and constrain the
+     * window within another element specify {@link #renderTo}.
+     * (defaults to false).  Optionally the header only can be constrained using {@link #constrainHeader}.
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} constrainHeader
+     * True to constrain the window header within its containing element (allowing the window body to fall outside
+     * of its containing element) or false to allow the header to fall outside its containing element (defaults to
+     * false). Optionally the entire window can be constrained using {@link #constrain}.
+     */
+    constrainHeader : false,
+    /**
+     * @cfg {Boolean} plain
+     * True to render the window body with a transparent background so that it will blend into the framing
+     * elements, false to add a lighter background color to visually highlight the body element and separate it
+     * more distinctly from the surrounding frame (defaults to false).
+     */
+    plain : false,
+    /**
+     * @cfg {Boolean} minimizable
+     * True to display the 'minimize' tool button and allow the user to minimize the window, false to hide the button
+     * and disallow minimizing the window (defaults to false).  Note that this button provides no implementation --
+     * the behavior of minimizing a window is implementation-specific, so the minimize event must be handled and a
+     * custom minimize behavior implemented for this option to be useful.
+     */
+    minimizable : false,
+    /**
+     * @cfg {Boolean} maximizable
+     * True to display the 'maximize' tool button and allow the user to maximize the window, false to hide the button
+     * and disallow maximizing the window (defaults to false).  Note that when a window is maximized, the tool button
+     * will automatically change to a 'restore' button with the appropriate behavior already built-in that will
+     * restore the window to its previous size.
+     */
+    maximizable : false,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum height in pixels allowed for this window (defaults to 100).  Only applies when resizable = true.
+     */
+    minHeight : 100,
+    /**
+     * @cfg {Number} minWidth
+     * The minimum width in pixels allowed for this window (defaults to 200).  Only applies when resizable = true.
+     */
+    minWidth : 200,
+    /**
+     * @cfg {Boolean} expandOnShow
+     * True to always expand the window when it is displayed, false to keep it in its current state (which may be
+     * {@link #collapsed}) when displayed (defaults to true).
+     */
+    expandOnShow : true,
+    
+    /**
+     * @cfg {Number} showAnimDuration The number of seconds that the window show animation takes if enabled.
+     * Defaults to 0.25
+     */
+    showAnimDuration: 0.25,
+    
+    /**
+     * @cfg {Number} hideAnimDuration The number of seconds that the window hide animation takes if enabled.
+     * Defaults to 0.25
+     */
+    hideAnimDuration: 0.25,
+
+    // inherited docs, same default
+    collapsible : false,
+
+    /**
+     * @cfg {Boolean} initHidden
+     * True to hide the window until show() is explicitly called (defaults to true).
+     * @deprecated
+     */
+    initHidden : undefined,
+
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is <tt>true</tt>). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : true,
+
+    // The following configs are set to provide the basic functionality of a window.
+    // Changing them would require additional code to handle correctly and should
+    // usually only be done in subclasses that can provide custom behavior.  Changing them
+    // may have unexpected or undesirable results.
+    /** @cfg {String} elements @hide */
+    elements : 'header,body',
+    /** @cfg {Boolean} frame @hide */
+    frame : true,
+    /** @cfg {Boolean} floating @hide */
+    floating : true,
+
+    // private
+    initComponent : function(){
+        this.initTools();
+        Ext.Window.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event activate
+             * Fires after the window has been visually activated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event deactivate
+             * Fires after the window has been visually deactivated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event resize
+             * Fires after the window has been resized.
+             * @param {Ext.Window} this
+             * @param {Number} width The window's new width
+             * @param {Number} height The window's new height
+             */
+            'resize',
+            /**
+             * @event maximize
+             * Fires after the window has been maximized.
+             * @param {Ext.Window} this
+             */
+            'maximize',
+            /**
+             * @event minimize
+             * Fires after the window has been minimized.
+             * @param {Ext.Window} this
+             */
+            'minimize',
+            /**
+             * @event restore
+             * Fires after the window has been restored to its original size after being maximized.
+             * @param {Ext.Window} this
+             */
+            'restore'
+        );
+        // for backwards compat, this should be removed at some point
+        if(Ext.isDefined(this.initHidden)){
+            this.hidden = this.initHidden;
+        }
+        if(this.hidden === false){
+            this.hidden = true;
+            this.show();
+        }
+    },
+
+    // private
+    getState : function(){
+        return Ext.apply(Ext.Window.superclass.getState.call(this) || {}, this.getBox(true));
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Window.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            this.el.addClass('x-window-plain');
+        }
+
+        // this element allows the Window to be focused for keyboard events
+        this.focusEl = this.el.createChild({
+                    tag: 'a', href:'#', cls:'x-dlg-focus',
+                    tabIndex:'-1', html: '&#160;'});
+        this.focusEl.swallowEvent('click', true);
+
+        this.proxy = this.el.createProxy('x-window-proxy');
+        this.proxy.enableDisplayMode('block');
+
+        if(this.modal){
+            this.mask = this.container.createChild({cls:'ext-el-mask'}, this.el.dom);
+            this.mask.enableDisplayMode('block');
+            this.mask.hide();
+            this.mon(this.mask, 'click', this.focus, this);
+        }
+        if(this.maximizable){
+            this.mon(this.header, 'dblclick', this.toggleMaximize, this);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.Window.superclass.initEvents.call(this);
+        if(this.animateTarget){
+            this.setAnimateTarget(this.animateTarget);
+        }
+
+        if(this.resizable){
+            this.resizer = new Ext.Resizable(this.el, {
+                minWidth: this.minWidth,
+                minHeight:this.minHeight,
+                handles: this.resizeHandles || 'all',
+                pinned: true,
+                resizeElement : this.resizerAction,
+                handleCls: 'x-window-handle'
+            });
+            this.resizer.window = this;
+            this.mon(this.resizer, 'beforeresize', this.beforeResize, this);
+        }
+
+        if(this.draggable){
+            this.header.addClass('x-window-draggable');
+        }
+        this.mon(this.el, 'mousedown', this.toFront, this);
+        this.manager = this.manager || Ext.WindowMgr;
+        this.manager.register(this);
+        if(this.maximized){
+            this.maximized = false;
+            this.maximize();
+        }
+        if(this.closable){
+            var km = this.getKeyMap();
+            km.on(27, this.onEsc, this);
+            km.disable();
+        }
+    },
+
+    initDraggable : function(){
+        /**
+         * <p>If this Window is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DD} which handles dragging the Window's DOM Element.</p>
+         * <p>This has implementations of <code>startDrag</code>, <code>onDrag</code> and <code>endDrag</code>
+         * which perform the dragging action. If extra logic is needed at these points, use
+         * {@link Function#createInterceptor createInterceptor} or {@link Function#createSequence createSequence} to
+         * augment the existing implementations.</p>
+         * @type Ext.dd.DD
+         * @property dd
+         */
+        this.dd = new Ext.Window.DD(this);
+    },
+
+   // private
+    onEsc : function(k, e){
+        if (this.activeGhost) {
+            this.unghost();
+        }
+        e.stopEvent();
+        this[this.closeAction]();
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.hide();
+            this.clearAnchor();
+            Ext.destroy(
+                this.focusEl,
+                this.resizer,
+                this.dd,
+                this.proxy,
+                this.mask
+            );
+        }
+        Ext.Window.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.manager){
+            this.manager.unregister(this);
+        }
+        Ext.Window.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initTools : function(){
+        if(this.minimizable){
+            this.addTool({
+                id: 'minimize',
+                handler: this.minimize.createDelegate(this, [])
+            });
+        }
+        if(this.maximizable){
+            this.addTool({
+                id: 'maximize',
+                handler: this.maximize.createDelegate(this, [])
+            });
+            this.addTool({
+                id: 'restore',
+                handler: this.restore.createDelegate(this, []),
+                hidden:true
+            });
+        }
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction].createDelegate(this, [])
+            });
+        }
+    },
+
+    // private
+    resizerAction : function(){
+        var box = this.proxy.getBox();
+        this.proxy.hide();
+        this.window.handleResize(box);
+        return box;
+    },
+
+    // private
+    beforeResize : function(){
+        this.resizer.minHeight = Math.max(this.minHeight, this.getFrameHeight() + 40); // 40 is a magic minimum content size?
+        this.resizer.minWidth = Math.max(this.minWidth, this.getFrameWidth() + 40);
+        this.resizeBox = this.el.getBox();
+    },
+
+    // private
+    updateHandles : function(){
+        if(Ext.isIE && this.resizer){
+            this.resizer.syncHandleHeight();
+            this.el.repaint();
+        }
+    },
+
+    // private
+    handleResize : function(box){
+        var rz = this.resizeBox;
+        if(rz.x != box.x || rz.y != box.y){
+            this.updateBox(box);
+        }else{
+            this.setSize(box);
+            if (Ext.isIE6 && Ext.isStrict) {
+                this.doLayout();
+            }
+        }
+        this.focus();
+        this.updateHandles();
+        this.saveState();
+    },
+
+    /**
+     * Focuses the window.  If a defaultButton is set, it will receive focus, otherwise the
+     * window itself will receive focus.
+     */
+    focus : function(){
+        var f = this.focusEl,
+            db = this.defaultButton,
+            t = typeof db,
+            el,
+            ct;
+        if(Ext.isDefined(db)){
+            if(Ext.isNumber(db) && this.fbar){
+                f = this.fbar.items.get(db);
+            }else if(Ext.isString(db)){
+                f = Ext.getCmp(db);
+            }else{
+                f = db;
+            }
+            el = f.getEl();
+            ct = Ext.getDom(this.container);
+            if (el && ct) {
+                if (ct != document.body && !Ext.lib.Region.getRegion(ct).contains(Ext.lib.Region.getRegion(el.dom))){
+                    return;
+                }
+            }
+        }
+        f = f || this.focusEl;
+        f.focus.defer(10, f);
+    },
+
+    /**
+     * Sets the target element from which the window should animate while opening.
+     * @param {String/Element} el The target element or id
+     */
+    setAnimateTarget : function(el){
+        el = Ext.get(el);
+        this.animateTarget = el;
+    },
+
+    // private
+    beforeShow : function(){
+        delete this.el.lastXY;
+        delete this.el.lastLT;
+        if(this.x === undefined || this.y === undefined){
+            var xy = this.el.getAlignToXY(this.container, 'c-c');
+            var pos = this.el.translatePoints(xy[0], xy[1]);
+            this.x = this.x === undefined? pos.left : this.x;
+            this.y = this.y === undefined? pos.top : this.y;
+        }
+        this.el.setLeftTop(this.x, this.y);
+
+        if(this.expandOnShow){
+            this.expand(false);
+        }
+
+        if(this.modal){
+            Ext.getBody().addClass('x-body-masked');
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.mask.show();
+        }
+    },
+
+    /**
+     * Shows the window, rendering it first if necessary, or activates it and brings it to front if hidden.
+     * @param {String/Element} animateTarget (optional) The target element or id from which the window should
+     * animate while opening (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is displayed
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    show : function(animateTarget, cb, scope){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        if(this.hidden === false){
+            this.toFront();
+            return this;
+        }
+        if(this.fireEvent('beforeshow', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('show', cb, scope, {single:true});
+        }
+        this.hidden = false;
+        if(Ext.isDefined(animateTarget)){
+            this.setAnimateTarget(animateTarget);
+        }
+        this.beforeShow();
+        if(this.animateTarget){
+            this.animShow();
+        }else{
+            this.afterShow();
+        }
+        return this;
+    },
+
+    // private
+    afterShow : function(isAnim){
+        if (this.isDestroyed){
+            return false;
+        }
+        this.proxy.hide();
+        this.el.setStyle('display', 'block');
+        this.el.show();
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+            this.cascade(this.setAutoScroll);
+        }
+
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.onWindowResize(this.onWindowResize, this);
+        }
+        this.doConstrain();
+        this.doLayout();
+        if(this.keyMap){
+            this.keyMap.enable();
+        }
+        this.toFront();
+        this.updateHandles();
+        if(isAnim && (Ext.isIE || Ext.isWebKit)){
+            var sz = this.getSize();
+            this.onResize(sz.width, sz.height);
+        }
+        this.onShow();
+        this.fireEvent('show', this);
+    },
+
+    // private
+    animShow : function(){
+        this.proxy.show();
+        this.proxy.setBox(this.animateTarget.getBox());
+        this.proxy.setOpacity(0);
+        var b = this.getBox();
+        this.el.setStyle('display', 'none');
+        this.proxy.shift(Ext.apply(b, {
+            callback: this.afterShow.createDelegate(this, [true], false),
+            scope: this,
+            easing: 'easeNone',
+            duration: this.showAnimDuration,
+            opacity: 0.5
+        }));
+    },
+
+    /**
+     * Hides the window, setting it to invisible and applying negative offsets.
+     * @param {String/Element} animateTarget (optional) The target element or id to which the window should
+     * animate while hiding (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is hidden
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    hide : function(animateTarget, cb, scope){
+        if(this.hidden || this.fireEvent('beforehide', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('hide', cb, scope, {single:true});
+        }
+        this.hidden = true;
+        if(animateTarget !== undefined){
+            this.setAnimateTarget(animateTarget);
+        }
+        if(this.modal){
+            this.mask.hide();
+            Ext.getBody().removeClass('x-body-masked');
+        }
+        if(this.animateTarget){
+            this.animHide();
+        }else{
+            this.el.hide();
+            this.afterHide();
+        }
+        return this;
+    },
+
+    // private
+    afterHide : function(){
+        this.proxy.hide();
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.removeResizeListener(this.onWindowResize, this);
+        }
+        if(this.keyMap){
+            this.keyMap.disable();
+        }
+        this.onHide();
+        this.fireEvent('hide', this);
+    },
+
+    // private
+    animHide : function(){
+        this.proxy.setOpacity(0.5);
+        this.proxy.show();
+        var tb = this.getBox(false);
+        this.proxy.setBox(tb);
+        this.el.hide();
+        this.proxy.shift(Ext.apply(this.animateTarget.getBox(), {
+            callback: this.afterHide,
+            scope: this,
+            duration: this.hideAnimDuration,
+            easing: 'easeNone',
+            opacity: 0
+        }));
+    },
+
+    /**
+     * Method that is called immediately before the <code>show</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onShow : Ext.emptyFn,
+
+    /**
+     * Method that is called immediately before the <code>hide</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onHide : Ext.emptyFn,
+
+    // private
+    onWindowResize : function(){
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(this.modal){
+            this.mask.setSize('100%', '100%');
+            var force = this.mask.dom.offsetHeight;
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        }
+        this.doConstrain();
+    },
+
+    // private
+    doConstrain : function(){
+        if(this.constrain || this.constrainHeader){
+            var offsets;
+            if(this.constrain){
+                offsets = {
+                    right:this.el.shadowOffset,
+                    left:this.el.shadowOffset,
+                    bottom:this.el.shadowOffset
+                };
+            }else {
+                var s = this.getSize();
+                offsets = {
+                    right:-(s.width - 100),
+                    bottom:-(s.height - 25 + this.el.getConstrainOffset())
+                };
+            }
+
+            var xy = this.el.getConstrainToXY(this.container, true, offsets);
+            if(xy){
+                this.setPosition(xy[0], xy[1]);
+            }
+        }
+    },
+
+    // private - used for dragging
+    ghost : function(cls){
+        var ghost = this.createGhost(cls);
+        var box = this.getBox(true);
+        ghost.setLeftTop(box.x, box.y);
+        ghost.setWidth(box.width);
+        this.el.hide();
+        this.activeGhost = ghost;
+        return ghost;
+    },
+
+    // private
+    unghost : function(show, matchPosition){
+        if(!this.activeGhost) {
+            return;
+        }
+        if(show !== false){
+            this.el.show();
+            this.focus.defer(10, this);
+            if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                this.cascade(this.setAutoScroll);
+            }
+        }
+        if(matchPosition !== false){
+            this.setPosition(this.activeGhost.getLeft(true), this.activeGhost.getTop(true));
+        }
+        this.activeGhost.hide();
+        this.activeGhost.remove();
+        delete this.activeGhost;
+    },
+
+    /**
+     * Placeholder method for minimizing the window.  By default, this method simply fires the {@link #minimize} event
+     * since the behavior of minimizing a window is application-specific.  To implement custom minimize behavior,
+     * either the minimize event can be handled or this method can be overridden.
+     * @return {Ext.Window} this
+     */
+    minimize : function(){
+        this.fireEvent('minimize', this);
+        return this;
+    },
+
+    /**
+     * <p>Closes the Window, removes it from the DOM, {@link Ext.Component#destroy destroy}s
+     * the Window object and all its descendant Components. The {@link Ext.Panel#beforeclose beforeclose}
+     * event is fired before the close happens and will cancel the close action if it returns false.<p>
+     * <p><b>Note:</b> This method is not affected by the {@link #closeAction} setting which
+     * only affects the action triggered when clicking the {@link #closable 'close' tool in the header}.
+     * To hide the Window without destroying it, call {@link #hide}.</p>
+     */
+    close : function(){
+        if(this.fireEvent('beforeclose', this) !== false){
+            if(this.hidden){
+                this.doClose();
+            }else{
+                this.hide(null, this.doClose, this);
+            }
+        }
+    },
+
+    // private
+    doClose : function(){
+        this.fireEvent('close', this);
+        this.destroy();
+    },
+
+    /**
+     * Fits the window within its current container and automatically replaces
+     * the {@link #maximizable 'maximize' tool button} with the 'restore' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    maximize : function(){
+        if(!this.maximized){
+            this.expand(false);
+            this.restoreSize = this.getSize();
+            this.restorePos = this.getPosition(true);
+            if (this.maximizable){
+                this.tools.maximize.hide();
+                this.tools.restore.show();
+            }
+            this.maximized = true;
+            this.el.disableShadow();
+
+            if(this.dd){
+                this.dd.lock();
+            }
+            if(this.collapsible){
+                this.tools.toggle.hide();
+            }
+            this.el.addClass('x-window-maximized');
+            this.container.addClass('x-window-maximized-ct');
+
+            this.setPosition(0, 0);
+            this.fitContainer();
+            this.fireEvent('maximize', this);
+        }
+        return this;
+    },
+
+    /**
+     * Restores a {@link #maximizable maximized}  window back to its original
+     * size and position prior to being maximized and also replaces
+     * the 'restore' tool button with the 'maximize' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    restore : function(){
+        if(this.maximized){
+            var t = this.tools;
+            this.el.removeClass('x-window-maximized');
+            if(t.restore){
+                t.restore.hide();
+            }
+            if(t.maximize){
+                t.maximize.show();
+            }
+            this.setPosition(this.restorePos[0], this.restorePos[1]);
+            this.setSize(this.restoreSize.width, this.restoreSize.height);
+            delete this.restorePos;
+            delete this.restoreSize;
+            this.maximized = false;
+            this.el.enableShadow(true);
+
+            if(this.dd){
+                this.dd.unlock();
+            }
+            if(this.collapsible && t.toggle){
+                t.toggle.show();
+            }
+            this.container.removeClass('x-window-maximized-ct');
+
+            this.doConstrain();
+            this.fireEvent('restore', this);
+        }
+        return this;
+    },
+
+    /**
+     * A shortcut method for toggling between {@link #maximize} and {@link #restore} based on the current maximized
+     * state of the window.
+     * @return {Ext.Window} this
+     */
+    toggleMaximize : function(){
+        return this[this.maximized ? 'restore' : 'maximize']();
+    },
+
+    // private
+    fitContainer : function(){
+        var vs = this.container.getViewSize(false);
+        this.setSize(vs.width, vs.height);
+    },
+
+    // private
+    // z-index is managed by the WindowManager and may be overwritten at any time
+    setZIndex : function(index){
+        if(this.modal){
+            this.mask.setStyle('z-index', index);
+        }
+        this.el.setZIndex(++index);
+        index += 5;
+
+        if(this.resizer){
+            this.resizer.proxy.setStyle('z-index', ++index);
+        }
+
+        this.lastZIndex = index;
+    },
+
+    /**
+     * Aligns the window to the specified element
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to (see {@link Ext.Element#alignTo} for more details).
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Ext.Window} this
+     */
+    alignTo : function(element, position, offsets){
+        var xy = this.el.getAlignToXY(element, position, offsets);
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    },
+
+    /**
+     * Anchors this window to another element and realigns it when the window is resized or scrolled.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to (see {@link Ext.Element#alignTo} for more details)
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Number} monitorScroll (optional) true to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @return {Ext.Window} this
+     */
+    anchorTo : function(el, alignment, offsets, monitorScroll){
+        this.clearAnchor();
+        this.anchorTarget = {
+            el: el,
+            alignment: alignment,
+            offsets: offsets
+        };
+
+        Ext.EventManager.onWindowResize(this.doAnchor, this);
+        var tm = typeof monitorScroll;
+        if(tm != 'undefined'){
+            Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
+                {buffer: tm == 'number' ? monitorScroll : 50});
+        }
+        return this.doAnchor();
+    },
+
+    /**
+     * Performs the anchor, using the saved anchorTarget property.
+     * @return {Ext.Window} this
+     * @private
+     */
+    doAnchor : function(){
+        var o = this.anchorTarget;
+        this.alignTo(o.el, o.alignment, o.offsets);
+        return this;
+    },
+
+    /**
+     * Removes any existing anchor from this window. See {@link #anchorTo}.
+     * @return {Ext.Window} this
+     */
+    clearAnchor : function(){
+        if(this.anchorTarget){
+            Ext.EventManager.removeResizeListener(this.doAnchor, this);
+            Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
+            delete this.anchorTarget;
+        }
+        return this;
+    },
+
+    /**
+     * Brings this window to the front of any other visible windows
+     * @param {Boolean} e (optional) Specify <tt>false</tt> to prevent the window from being focused.
+     * @return {Ext.Window} this
+     */
+    toFront : function(e){
+        if(this.manager.bringToFront(this)){
+            if(!e || !e.getTarget().focus){
+                this.focus();
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Makes this the active window by showing its shadow, or deactivates it by hiding its shadow.  This method also
+     * fires the {@link #activate} or {@link #deactivate} event depending on which action occurred. This method is
+     * called internally by {@link Ext.WindowMgr}.
+     * @param {Boolean} active True to activate the window, false to deactivate it (defaults to false)
+     */
+    setActive : function(active){
+        if(active){
+            if(!this.maximized){
+                this.el.enableShadow(true);
+            }
+            this.fireEvent('activate', this);
+        }else{
+            this.el.disableShadow();
+            this.fireEvent('deactivate', this);
+        }
+    },
+
+    /**
+     * Sends this window to the back of (lower z-index than) any other visible windows
+     * @return {Ext.Window} this
+     */
+    toBack : function(){
+        this.manager.sendToBack(this);
+        return this;
+    },
+
+    /**
+     * Centers this window in the viewport
+     * @return {Ext.Window} this
+     */
+    center : function(){
+        var xy = this.el.getAlignToXY(this.container, 'c-c');
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     **/
+});
+Ext.reg('window', Ext.Window);
+
+// private - custom Window DD implementation
+Ext.Window.DD = Ext.extend(Ext.dd.DD, {
+    
+    constructor : function(win){
+        this.win = win;
+        Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
+        this.setHandleElId(win.header.id);
+        this.scroll = false;        
+    },
+    
+    moveOnly:true,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        var w = this.win;
+        this.proxy = w.ghost(w.initialConfig.cls);
+        if(w.constrain !== false){
+            var so = w.el.shadowOffset;
+            this.constrainTo(w.container, {right: so, left: so, bottom: so});
+        }else if(w.constrainHeader !== false){
+            var s = this.proxy.getSize();
+            this.constrainTo(w.container, {right: -(s.width-this.headerOffsets[0]), bottom: -(s.height-this.headerOffsets[1])});
+        }
+    },
+    b4Drag : Ext.emptyFn,
+
+    onDrag : function(e){
+        this.alignElWithMouse(this.proxy, e.getPageX(), e.getPageY());
+    },
+
+    endDrag : function(e){
+        this.win.unghost();
+        this.win.saveState();
+    }
+});
+/**
+ * @class Ext.WindowGroup
+ * An object that manages a group of {@link Ext.Window} instances and provides z-order management
+ * and window activation behavior.
+ * @constructor
+ */
+Ext.WindowGroup = function(){
+    var list = {};
+    var accessList = [];
+    var front = null;
+
+    // private
+    var sortWindows = function(d1, d2){
+        return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;
+    };
+
+    // private
+    var orderWindows = function(){
+        var a = accessList, len = a.length;
+        if(len > 0){
+            a.sort(sortWindows);
+            var seed = a[0].manager.zseed;
+            for(var i = 0; i < len; i++){
+                var win = a[i];
+                if(win && !win.hidden){
+                    win.setZIndex(seed + (i*10));
+                }
+            }
+        }
+        activateLast();
+    };
+
+    // private
+    var setActiveWin = function(win){
+        if(win != front){
+            if(front){
+                front.setActive(false);
+            }
+            front = win;
+            if(win){
+                win.setActive(true);
+            }
+        }
+    };
+
+    // private
+    var activateLast = function(){
+        for(var i = accessList.length-1; i >=0; --i) {
+            if(!accessList[i].hidden){
+                setActiveWin(accessList[i]);
+                return;
+            }
+        }
+        // none to activate
+        setActiveWin(null);
+    };
+
+    return {
+        /**
+         * The starting z-index for windows in this WindowGroup (defaults to 9000)
+         * @type Number The z-index value
+         */
+        zseed : 9000,
+
+        /**
+         * <p>Registers a {@link Ext.Window Window} with this WindowManager. This should not
+         * need to be called under normal circumstances. Windows are automatically registered
+         * with a {@link Ext.Window#manager manager} at construction time.</p>
+         * <p>Where this may be useful is moving Windows between two WindowManagers. For example,
+         * to bring the Ext.MessageBox dialog under the same manager as the Desktop's
+         * WindowManager in the desktop sample app:</p><code><pre>
+var msgWin = Ext.MessageBox.getDialog();
+MyDesktop.getDesktop().getManager().register(msgWin);
+</pre></code>
+         * @param {Window} win The Window to register.
+         */
+        register : function(win){
+            if(win.manager){
+                win.manager.unregister(win);
+            }
+            win.manager = this;
+
+            list[win.id] = win;
+            accessList.push(win);
+            win.on('hide', activateLast);
+        },
+
+        /**
+         * <p>Unregisters a {@link Ext.Window Window} from this WindowManager. This should not
+         * need to be called. Windows are automatically unregistered upon destruction.
+         * See {@link #register}.</p>
+         * @param {Window} win The Window to unregister.
+         */
+        unregister : function(win){
+            delete win.manager;
+            delete list[win.id];
+            win.un('hide', activateLast);
+            accessList.remove(win);
+        },
+
+        /**
+         * Gets a registered window by id.
+         * @param {String/Object} id The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window}
+         */
+        get : function(id){
+            return typeof id == "object" ? id : list[id];
+        },
+
+        /**
+         * Brings the specified window to the front of any other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Boolean} True if the dialog was brought to the front, else false
+         * if it was already in front
+         */
+        bringToFront : function(win){
+            win = this.get(win);
+            if(win != front){
+                win._lastAccess = new Date().getTime();
+                orderWindows();
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Sends the specified window to the back of other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window} The window
+         */
+        sendToBack : function(win){
+            win = this.get(win);
+            win._lastAccess = -(new Date().getTime());
+            orderWindows();
+            return win;
+        },
+
+        /**
+         * Hides all windows in this WindowGroup.
+         */
+        hideAll : function(){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function" && list[id].isVisible()){
+                    list[id].hide();
+                }
+            }
+        },
+
+        /**
+         * Gets the currently-active window in this WindowGroup.
+         * @return {Ext.Window} The active window
+         */
+        getActive : function(){
+            return front;
+        },
+
+        /**
+         * Returns zero or more windows in this WindowGroup using the custom search function passed to this method.
+         * The function should accept a single {@link Ext.Window} reference as its only argument and should
+         * return true if the window matches the search criteria, otherwise it should return false.
+         * @param {Function} fn The search function
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Window being tested.
+         * that gets passed to the function if not specified)
+         * @return {Array} An array of zero or more matching windows
+         */
+        getBy : function(fn, scope){
+            var r = [];
+            for(var i = accessList.length-1; i >=0; --i) {
+                var win = accessList[i];
+                if(fn.call(scope||win, win) !== false){
+                    r.push(win);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Executes the specified function once for every window in this WindowGroup, passing each
+         * window as the only parameter. Returning false from the function will stop the iteration.
+         * @param {Function} fn The function to execute for each item
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Window in the iteration.
+         */
+        each : function(fn, scope){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function"){
+                    if(fn.call(scope || list[id], list[id]) === false){
+                        return;
+                    }
+                }
+            }
+        }
+    };
+};
+
+
+/**
+ * @class Ext.WindowMgr
+ * @extends Ext.WindowGroup
+ * The default global window group that is available automatically.  To have more than one group of windows
+ * with separate z-order stacks, create additional instances of {@link Ext.WindowGroup} as needed.
+ * @singleton
+ */
+Ext.WindowMgr = new Ext.WindowGroup();/**
+ * @class Ext.MessageBox
+ * <p>Utility class for generating different styles of message boxes.  The alias Ext.Msg can also be used.<p/>
+ * <p>Note that the MessageBox is asynchronous.  Unlike a regular JavaScript <code>alert</code> (which will halt
+ * browser execution), showing a MessageBox will not cause the code to stop.  For this reason, if you have code
+ * that should only run <em>after</em> some user feedback from the MessageBox, you must use a callback function
+ * (see the <code>function</code> parameter for {@link #show} for more details).</p>
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic alert:
+Ext.Msg.alert('Status', 'Changes saved successfully.');
+
+// Prompt for user data and process the result using a callback:
+Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
+    if (btn == 'ok'){
+        // process text value and close...
+    }
+});
+
+// Show a dialog using config options:
+Ext.Msg.show({
+   title:'Save Changes?',
+   msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
+   buttons: Ext.Msg.YESNOCANCEL,
+   fn: processResult,
+   animEl: 'elId',
+   icon: Ext.MessageBox.QUESTION
+});
+</code></pre>
+ * @singleton
+ */
+Ext.MessageBox = function(){
+    var dlg, opt, mask, waitTimer,
+        bodyEl, msgEl, textboxEl, textareaEl, progressBar, pp, iconEl, spacerEl,
+        buttons, activeTextEl, bwidth, bufferIcon = '', iconCls = '',
+        buttonNames = ['ok', 'yes', 'no', 'cancel'];
+
+    // private
+    var handleButton = function(button){
+        buttons[button].blur();
+        if(dlg.isVisible()){
+            dlg.hide();
+            handleHide();
+            Ext.callback(opt.fn, opt.scope||window, [button, activeTextEl.dom.value, opt], 1);
+        }
+    };
+
+    // private
+    var handleHide = function(){
+        if(opt && opt.cls){
+            dlg.el.removeClass(opt.cls);
+        }
+        progressBar.reset();        
+    };
+
+    // private
+    var handleEsc = function(d, k, e){
+        if(opt && opt.closable !== false){
+            dlg.hide();
+            handleHide();
+        }
+        if(e){
+            e.stopEvent();
+        }
+    };
+
+    // private
+    var updateButtons = function(b){
+        var width = 0,
+            cfg;
+        if(!b){
+            Ext.each(buttonNames, function(name){
+                buttons[name].hide();
+            });
+            return width;
+        }
+        dlg.footer.dom.style.display = '';
+        Ext.iterate(buttons, function(name, btn){
+            cfg = b[name];
+            if(cfg){
+                btn.show();
+                btn.setText(Ext.isString(cfg) ? cfg : Ext.MessageBox.buttonText[name]);
+                width += btn.getEl().getWidth() + 15;
+            }else{
+                btn.hide();
+            }
+        });
+        return width;
+    };
+
+    return {
+        /**
+         * Returns a reference to the underlying {@link Ext.Window} element
+         * @return {Ext.Window} The window
+         */
+        getDialog : function(titleText){
+           if(!dlg){
+                var btns = [];
+                
+                buttons = {};
+                Ext.each(buttonNames, function(name){
+                    btns.push(buttons[name] = new Ext.Button({
+                        text: this.buttonText[name],
+                        handler: handleButton.createCallback(name),
+                        hideMode: 'offsets'
+                    }));
+                }, this);
+                dlg = new Ext.Window({
+                    autoCreate : true,
+                    title:titleText,
+                    resizable:false,
+                    constrain:true,
+                    constrainHeader:true,
+                    minimizable : false,
+                    maximizable : false,
+                    stateful: false,
+                    modal: true,
+                    shim:true,
+                    buttonAlign:"center",
+                    width:400,
+                    height:100,
+                    minHeight: 80,
+                    plain:true,
+                    footer:true,
+                    closable:true,
+                    close : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton("no");
+                        }else{
+                            handleButton("cancel");
+                        }
+                    },
+                    fbar: new Ext.Toolbar({
+                        items: btns,
+                        enableOverflow: false
+                    })
+                });
+                dlg.render(document.body);
+                dlg.getEl().addClass('x-window-dlg');
+                mask = dlg.mask;
+                bodyEl = dlg.body.createChild({
+                    html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'
+                });
+                iconEl = Ext.get(bodyEl.dom.firstChild);
+                var contentEl = bodyEl.dom.childNodes[1];
+                msgEl = Ext.get(contentEl.firstChild);
+                textboxEl = Ext.get(contentEl.childNodes[2].firstChild);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton("ok");
+                        }else if(opt.buttons.yes){
+                            handleButton("yes");
+                        }
+                    }
+                });
+                textareaEl = Ext.get(contentEl.childNodes[2].childNodes[1]);
+                textareaEl.enableDisplayMode();
+                progressBar = new Ext.ProgressBar({
+                    renderTo:bodyEl
+                });
+               bodyEl.createChild({cls:'x-clear'});
+            }
+            return dlg;
+        },
+
+        /**
+         * Updates the message box body text
+         * @param {String} text (optional) Replaces the message box element's innerHTML with the specified string (defaults to
+         * the XHTML-compliant non-breaking space character '&amp;#160;')
+         * @return {Ext.MessageBox} this
+         */
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.setSize(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            // Append a space here for sizing. In IE, for some reason, it wraps text incorrectly without one in some cases
+            msgEl.update(text ? text + ' ' : '&#160;');
+
+            var iw = iconCls != '' ? (iconEl.getWidth() + iconEl.getMargins('lr')) : 0,
+                mw = msgEl.getWidth() + msgEl.getMargins('lr'),
+                fw = dlg.getFrameWidth('lr'),
+                bw = dlg.body.getFrameWidth('lr'),
+                w;
+                
+            w = Math.max(Math.min(opt.width || iw+mw+fw+bw, opt.maxWidth || this.maxWidth),
+                    Math.max(opt.minWidth || this.minWidth, bwidth || 0));
+
+            if(opt.prompt === true){
+                activeTextEl.setWidth(w-iw-fw-bw);
+            }
+            if(opt.progress === true || opt.wait === true){
+                progressBar.setSize(w-iw-fw-bw);
+            }
+            if(Ext.isIE && w == bwidth){
+                w += 4; //Add offset when the content width is smaller than the buttons.    
+            }
+            msgEl.update(text || '&#160;');
+            dlg.setSize(w, 'auto').center();
+            return this;
+        },
+
+        /**
+         * Updates a progress-style message box's text and progress bar. Only relevant on message boxes
+         * initiated via {@link Ext.MessageBox#progress} or {@link Ext.MessageBox#wait},
+         * or by calling {@link Ext.MessageBox#show} with progress: true.
+         * @param {Number} value Any number between 0 and 1 (e.g., .5, defaults to 0)
+         * @param {String} progressText The progress text to display inside the progress bar (defaults to '')
+         * @param {String} msg The message box's body text is replaced with the specified string (defaults to undefined
+         * so that any existing body text will not get overwritten by default unless a new value is passed in)
+         * @return {Ext.MessageBox} this
+         */
+        updateProgress : function(value, progressText, msg){
+            progressBar.updateProgress(value, progressText);
+            if(msg){
+                this.updateText(msg);
+            }
+            return this;
+        },
+
+        /**
+         * Returns true if the message box is currently displayed
+         * @return {Boolean} True if the message box is visible, else false
+         */
+        isVisible : function(){
+            return dlg && dlg.isVisible();
+        },
+
+        /**
+         * Hides the message box if it is displayed
+         * @return {Ext.MessageBox} this
+         */
+        hide : function(){
+            var proxy = dlg ? dlg.activeGhost : null;
+            if(this.isVisible() || proxy){
+                dlg.hide();
+                handleHide();
+                if (proxy){
+                    // unghost is a private function, but i saw no better solution
+                    // to fix the locking problem when dragging while it closes
+                    dlg.unghost(false, false);
+                } 
+            }
+            return this;
+        },
+
+        /**
+         * Displays a new message box, or reinitializes an existing message box, based on the config options
+         * passed in. All display functions (e.g. prompt, alert, etc.) on MessageBox call this function internally,
+         * although those calls are basic shortcuts and do not support all of the config options allowed here.
+         * @param {Object} config The following config options are supported: <ul>
+         * <li><b>animEl</b> : String/Element<div class="sub-desc">An id or Element from which the message box should animate as it
+         * opens and closes (defaults to undefined)</div></li>
+         * <li><b>buttons</b> : Object/Boolean<div class="sub-desc">A button config object (e.g., Ext.MessageBox.OKCANCEL or {ok:'Foo',
+         * cancel:'Bar'}), or false to not show any buttons (defaults to false)</div></li>
+         * <li><b>closable</b> : Boolean<div class="sub-desc">False to hide the top-right close button (defaults to true). Note that
+         * progress and wait dialogs will ignore this property and always hide the close button as they can only
+         * be closed programmatically.</div></li>
+         * <li><b>cls</b> : String<div class="sub-desc">A custom CSS class to apply to the message box's container element</div></li>
+         * <li><b>defaultTextHeight</b> : Number<div class="sub-desc">The default height in pixels of the message box's multiline textarea
+         * if displayed (defaults to 75)</div></li>
+         * <li><b>fn</b> : Function<div class="sub-desc">A callback function which is called when the dialog is dismissed either
+         * by clicking on the configured buttons, or on the dialog close button, or by pressing
+         * the return button to enter input.
+         * <p>Progress and wait dialogs will ignore this option since they do not respond to user
+         * actions and can only be closed programmatically, so any required function should be called
+         * by the same code after it closes the dialog. Parameters passed:<ul>
+         * <li><b>buttonId</b> : String<div class="sub-desc">The ID of the button pressed, one of:<div class="sub-desc"><ul>
+         * <li><tt>ok</tt></li>
+         * <li><tt>yes</tt></li>
+         * <li><tt>no</tt></li>
+         * <li><tt>cancel</tt></li>
+         * </ul></div></div></li>
+         * <li><b>text</b> : String<div class="sub-desc">Value of the input field if either <tt><a href="#show-option-prompt" ext:member="show-option-prompt" ext:cls="Ext.MessageBox">prompt</a></tt>
+         * or <tt><a href="#show-option-multiline" ext:member="show-option-multiline" ext:cls="Ext.MessageBox">multiline</a></tt> is true</div></li>
+         * <li><b>opt</b> : Object<div class="sub-desc">The config object passed to show.</div></li>
+         * </ul></p></div></li>
+         * <li><b>scope</b> : Object<div class="sub-desc">The scope of the callback function</div></li>
+         * <li><b>icon</b> : String<div class="sub-desc">A CSS class that provides a background image to be used as the body icon for the
+         * dialog (e.g. Ext.MessageBox.WARNING or 'custom-class') (defaults to '')</div></li>
+         * <li><b>iconCls</b> : String<div class="sub-desc">The standard {@link Ext.Window#iconCls} to
+         * add an optional header icon (defaults to '')</div></li>
+         * <li><b>maxWidth</b> : Number<div class="sub-desc">The maximum width in pixels of the message box (defaults to 600)</div></li>
+         * <li><b>minWidth</b> : Number<div class="sub-desc">The minimum width in pixels of the message box (defaults to 100)</div></li>
+         * <li><b>modal</b> : Boolean<div class="sub-desc">False to allow user interaction with the page while the message box is
+         * displayed (defaults to true)</div></li>
+         * <li><b>msg</b> : String<div class="sub-desc">A string that will replace the existing message box body text (defaults to the
+         * XHTML-compliant non-breaking space character '&amp;#160;')</div></li>
+         * <li><a id="show-option-multiline"></a><b>multiline</b> : Boolean<div class="sub-desc">
+         * True to prompt the user to enter multi-line text (defaults to false)</div></li>
+         * <li><b>progress</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>progressText</b> : String<div class="sub-desc">The text to display inside the progress bar if progress = true (defaults to '')</div></li>
+         * <li><a id="show-option-prompt"></a><b>prompt</b> : Boolean<div class="sub-desc">True to prompt the user to enter single-line text (defaults to false)</div></li>
+         * <li><b>proxyDrag</b> : Boolean<div class="sub-desc">True to display a lightweight proxy while dragging (defaults to false)</div></li>
+         * <li><b>title</b> : String<div class="sub-desc">The title text</div></li>
+         * <li><b>value</b> : String<div class="sub-desc">The string value to set into the active textbox element if displayed</div></li>
+         * <li><b>wait</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>waitConfig</b> : Object<div class="sub-desc">A {@link Ext.ProgressBar#waitConfig} object (applies only if wait = true)</div></li>
+         * <li><b>width</b> : Number<div class="sub-desc">The width of the dialog in pixels</div></li>
+         * </ul>
+         * Example usage:
+         * <pre><code>
+Ext.Msg.show({
+   title: 'Address',
+   msg: 'Please enter your address:',
+   width: 300,
+   buttons: Ext.MessageBox.OKCANCEL,
+   multiline: true,
+   fn: saveAddress,
+   animEl: 'addAddressBtn',
+   icon: Ext.MessageBox.INFO
+});
+</code></pre>
+         * @return {Ext.MessageBox} this
+         */
+        show : function(options){
+            if(this.isVisible()){
+                this.hide();
+            }
+            opt = options;
+            var d = this.getDialog(opt.title || "&#160;");
+
+            d.setTitle(opt.title || "&#160;");
+            var allowClose = (opt.closable !== false && opt.progress !== true && opt.wait !== true);
+            d.tools.close.setDisplayed(allowClose);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false);
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(Ext.isNumber(opt.multiline) ? opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            activeTextEl.dom.value = opt.value || "";
+            if(opt.prompt){
+                d.focusEl = activeTextEl;
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons["ok"];
+                }else if(bs && bs.yes){
+                    db = buttons["yes"];
+                }
+                if (db){
+                    d.focusEl = db;
+                }
+            }
+            if(Ext.isDefined(opt.iconCls)){
+              d.setIconClass(opt.iconCls);
+            }
+            this.setIcon(Ext.isDefined(opt.icon) ? opt.icon : bufferIcon);
+            bwidth = updateButtons(opt.buttons);
+            progressBar.setVisible(opt.progress === true || opt.wait === true);
+            this.updateProgress(0, opt.progressText);
+            this.updateText(opt.msg);
+            if(opt.cls){
+                d.el.addClass(opt.cls);
+            }
+            d.proxyDrag = opt.proxyDrag === true;
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            if(!d.isVisible()){
+                // force it to the end of the z-index stack so it gets a cursor in FF
+                document.body.appendChild(dlg.el.dom);
+                d.setAnimateTarget(opt.animEl);
+                //workaround for window internally enabling keymap in afterShow
+                d.on('show', function(){
+                    if(allowClose === true){
+                        d.keyMap.enable();
+                    }else{
+                        d.keyMap.disable();
+                    }
+                }, this, {single:true});
+                d.show(opt.animEl);
+            }
+            if(opt.wait === true){
+                progressBar.wait(opt.waitConfig);
+            }
+            return this;
+        },
+
+        /**
+         * Adds the specified icon to the dialog.  By default, the class 'ext-mb-icon' is applied for default
+         * styling, and the class passed in is expected to supply the background image url. Pass in empty string ('')
+         * to clear any existing icon. This method must be called before the MessageBox is shown.
+         * The following built-in icon classes are supported, but you can also pass in a custom class name:
+         * <pre>
+Ext.MessageBox.INFO
+Ext.MessageBox.WARNING
+Ext.MessageBox.QUESTION
+Ext.MessageBox.ERROR
+         *</pre>
+         * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon
+         * @return {Ext.MessageBox} this
+         */
+        setIcon : function(icon){
+            if(!dlg){
+                bufferIcon = icon;
+                return;
+            }
+            bufferIcon = undefined;
+            if(icon && icon != ''){
+                iconEl.removeClass('x-hidden');
+                iconEl.replaceClass(iconCls, icon);
+                bodyEl.addClass('x-dlg-icon');
+                iconCls = icon;
+            }else{
+                iconEl.replaceClass(iconCls, 'x-hidden');
+                bodyEl.removeClass('x-dlg-icon');
+                iconCls = '';
+            }
+            return this;
+        },
+
+        /**
+         * Displays a message box with a progress bar.  This message box has no buttons and is not closeable by
+         * the user.  You are responsible for updating the progress bar as needed via {@link Ext.MessageBox#updateProgress}
+         * and closing the message box when the process is complete.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {String} progressText (optional) The text to display inside the progress bar (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        progress : function(title, msg, progressText){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false,
+                minWidth: this.minProgressWidth,
+                progressText: progressText
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with an infinitely auto-updating progress bar.  This can be used to block user
+         * interaction while waiting for a long-running process to complete that does not have defined intervals.
+         * You are responsible for closing the message box when the process is complete.
+         * @param {String} msg The message box body text
+         * @param {String} title (optional) The title bar text
+         * @param {Object} config (optional) A {@link Ext.ProgressBar#waitConfig} object
+         * @return {Ext.MessageBox} this
+         */
+        wait : function(msg, title, config){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                closable:false,
+                wait:true,
+                modal:true,
+                minWidth: this.minProgressWidth,
+                waitConfig: config
+            });
+            return this;
+        },
+
+        /**
+         * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt).
+         * If a callback function is passed it will be called after the user clicks the button, and the
+         * id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
+         * If a callback function is passed it will be called after the user clicks either button,
+         * and the id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope,
+                icon: this.QUESTION,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
+         * The prompt can be a single-line or multi-line textbox.  If a callback function is passed it will be called after the user
+         * clicks either button, and the id of the button that was clicked (could also be the top-right
+         * close button) and the text that was entered will be passed as the two parameters to the callback.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @param {Boolean/Number} multiline (optional) True to create a multiline textbox using the defaultTextHeight
+         * property, or the height in pixels to create the textbox (defaults to false / single-line)
+         * @param {String} value (optional) Default value of the text input element (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        prompt : function(title, msg, fn, scope, multiline, value){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth: this.minPromptWidth,
+                scope : scope,
+                prompt:true,
+                multiline: multiline,
+                value: value
+            });
+            return this;
+        },
+
+        /**
+         * Button config that displays a single OK button
+         * @type Object
+         */
+        OK : {ok:true},
+        /**
+         * Button config that displays a single Cancel button
+         * @type Object
+         */
+        CANCEL : {cancel:true},
+        /**
+         * Button config that displays OK and Cancel buttons
+         * @type Object
+         */
+        OKCANCEL : {ok:true, cancel:true},
+        /**
+         * Button config that displays Yes and No buttons
+         * @type Object
+         */
+        YESNO : {yes:true, no:true},
+        /**
+         * Button config that displays Yes, No and Cancel buttons
+         * @type Object
+         */
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        /**
+         * The CSS class that provides the INFO icon image
+         * @type String
+         */
+        INFO : 'ext-mb-info',
+        /**
+         * The CSS class that provides the WARNING icon image
+         * @type String
+         */
+        WARNING : 'ext-mb-warning',
+        /**
+         * The CSS class that provides the QUESTION icon image
+         * @type String
+         */
+        QUESTION : 'ext-mb-question',
+        /**
+         * The CSS class that provides the ERROR icon image
+         * @type String
+         */
+        ERROR : 'ext-mb-error',
+
+        /**
+         * The default height in pixels of the message box's multiline textarea if displayed (defaults to 75)
+         * @type Number
+         */
+        defaultTextHeight : 75,
+        /**
+         * The maximum width in pixels of the message box (defaults to 600)
+         * @type Number
+         */
+        maxWidth : 600,
+        /**
+         * The minimum width in pixels of the message box (defaults to 100)
+         * @type Number
+         */
+        minWidth : 100,
+        /**
+         * The minimum width in pixels of the message box if it is a progress-style dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minProgressWidth : 250,
+        /**
+         * The minimum width in pixels of the message box if it is a prompt dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minPromptWidth: 250,
+        /**
+         * An object containing the default button text strings that can be overriden for localized language support.
+         * Supported properties are: ok, cancel, yes and no.  Generally you should include a locale-specific
+         * resource file for handling language support across the framework.
+         * Customize the default text like so: Ext.MessageBox.buttonText.yes = "oui"; //french
+         * @type Object
+         */
+        buttonText : {
+            ok : "OK",
+            cancel : "Cancel",
+            yes : "Yes",
+            no : "No"
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.MessageBox}
+ */
+Ext.Msg = Ext.MessageBox;/**
+ * @class Ext.dd.PanelProxy
+ * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
+ * for the Panel's drag drop implementation, and should never need to be created directly.
+ * @constructor
+ * @param panel The {@link Ext.Panel} to proxy for
+ * @param config Configuration options
+ */
+Ext.dd.PanelProxy  = Ext.extend(Object, {
+    
+    constructor : function(panel, config){
+        this.panel = panel;
+        this.id = this.panel.id +'-ddproxy';
+        Ext.apply(this, config);        
+    },
+    
+    /**
+     * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
+     * false to drag with no proxy (defaults to true).
+     */
+    insertProxy : true,
+
+    // private overrides
+    setStatus : Ext.emptyFn,
+    reset : Ext.emptyFn,
+    update : Ext.emptyFn,
+    stop : Ext.emptyFn,
+    sync: Ext.emptyFn,
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getEl : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's ghost element
+     * @return {Element} The proxy's ghost element
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getProxy : function(){
+        return this.proxy;
+    },
+
+    /**
+     * Hides the proxy
+     */
+    hide : function(){
+        if(this.ghost){
+            if(this.proxy){
+                this.proxy.remove();
+                delete this.proxy;
+            }
+            this.panel.el.dom.style.display = '';
+            this.ghost.remove();
+            delete this.ghost;
+        }
+    },
+
+    /**
+     * Shows the proxy
+     */
+    show : function(){
+        if(!this.ghost){
+            this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
+            this.ghost.setXY(this.panel.el.getXY());
+            if(this.insertProxy){
+                this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
+                this.proxy.setSize(this.panel.getSize());
+            }
+            this.panel.el.dom.style.display = 'none';
+        }
+    },
+
+    // private
+    repair : function(xy, callback, scope){
+        this.hide();
+        if(typeof callback == "function"){
+            callback.call(scope || this);
+        }
+    },
+
+    /**
+     * Moves the proxy to a different position in the DOM.  This is typically called while dragging the Panel
+     * to keep the proxy sync'd to the Panel's location.
+     * @param {HTMLElement} parentNode The proxy's parent DOM node
+     * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
+     * to the parent's last child if not specified)
+     */
+    moveProxy : function(parentNode, before){
+        if(this.proxy){
+            parentNode.insertBefore(this.proxy.dom, before);
+        }
+    }
+});
+
+// private - DD implementation for Panels
+Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(panel, cfg){
+        this.panel = panel;
+        this.dragData = {panel: panel};
+        this.proxy = new Ext.dd.PanelProxy(panel, cfg);
+        Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
+        var h = panel.header,
+            el = panel.body;
+        if(h){
+            this.setHandleElId(h.id);
+            el = panel.header;
+        }
+        el.setStyle('cursor', 'move');
+        this.scroll = false;        
+    },
+    
+    showFrame: Ext.emptyFn,
+    startDrag: Ext.emptyFn,
+    b4StartDrag: function(x, y) {
+        this.proxy.show();
+    },
+    b4MouseDown: function(e) {
+        var x = e.getPageX(),
+            y = e.getPageY();
+        this.autoOffset(x, y);
+    },
+    onInitDrag : function(x, y){
+        this.onStartDrag(x, y);
+        return true;
+    },
+    createFrame : Ext.emptyFn,
+    getDragEl : function(e){
+        return this.proxy.ghost.dom;
+    },
+    endDrag : function(e){
+        this.proxy.hide();
+        this.panel.saveState();
+    },
+
+    autoOffset : function(x, y) {
+        x -= this.startPageX;
+        y -= this.startPageY;
+        this.setDelta(x, y);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-grid-foundation-debug.js	(revision 76)
@@ -0,0 +1,7229 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GridPanel
+ * @extends Ext.Panel
+ * <p>This class represents the primary interface of a component based grid control to represent data
+ * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior
+ * <div class="sub-desc"></div></li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    {@link #store}: new {@link Ext.data.Store}({
+        {@link Ext.data.Store#autoDestroy autoDestroy}: true,
+        {@link Ext.data.Store#reader reader}: reader,
+        {@link Ext.data.Store#data data}: xg.dummyData
+    }),
+    {@link #colModel}: new {@link Ext.grid.ColumnModel}({
+        {@link Ext.grid.ColumnModel#defaults defaults}: {
+            width: 120,
+            sortable: true
+        },
+        {@link Ext.grid.ColumnModel#columns columns}: [
+            {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
+            {header: 'Change', dataIndex: 'change'},
+            {header: '% Change', dataIndex: 'pctChange'},
+            // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype
+            {
+                header: 'Last Updated', width: 135, dataIndex: 'lastChange',
+                xtype: 'datecolumn', format: 'M d, Y'
+            }
+        ]
+    }),
+    {@link #viewConfig}: {
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+
+//      Return CSS class to apply to rows depending upon data values
+        {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {
+            var c = record.{@link Ext.data.Record#get get}('change');
+            if (c < 0) {
+                return 'price-fall';
+            } else if (c > 0) {
+                return 'price-rise';
+            }
+        }
+    },
+    {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),
+    width: 600,
+    height: 300,
+    frame: true,
+    title: 'Framed with Row Selection and Horizontal Scrolling',
+    iconCls: 'icon-grid'
+});
+ * </code></pre>
+ * <p><b><u>Notes:</u></b></p>
+ * <div class="mdetail-params"><ul>
+ * <li>Although this class inherits many configuration options from base classes, some of them
+ * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will
+ * have no effect.</li>
+ * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to
+ * scroll its rows. These dimensions can either be set explicitly through the
+ * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>
+ * configuration options or implicitly set by using the grid as a child item of a
+ * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}
+ * provide the sizing of its child items (for example the Container of the Grid may specify
+ * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>
+ * <li>To access the data in a Grid, it is necessary to use the data model encapsulated
+ * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype grid
+ */
+Ext.grid.GridPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} autoExpandColumn
+     * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in
+     * this grid that should expand to fill unused space. This value specified here can not
+     * be <tt>0</tt>.</p>
+     * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with
+     * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>
+     * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>
+     * for additional details.</p>
+     * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>
+     */
+    autoExpandColumn : false,
+    
+    /**
+     * @cfg {Number} autoExpandMax The maximum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>1000</tt>.
+     */
+    autoExpandMax : 1000,
+    
+    /**
+     * @cfg {Number} autoExpandMin The minimum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>50</tt>.
+     */
+    autoExpandMin : 50,
+    
+    /**
+     * @cfg {Boolean} columnLines <tt>true</tt> to add css for column separation lines.
+     * Default is <tt>false</tt>.
+     */
+    columnLines : false,
+    
+    /**
+     * @cfg {Object} cm Shorthand for <tt>{@link #colModel}</tt>.
+     */
+    /**
+     * @cfg {Object} colModel The {@link Ext.grid.ColumnModel} to use when rendering the grid (required).
+     */
+    /**
+     * @cfg {Array} columns An array of {@link Ext.grid.Column columns} to auto create a
+     * {@link Ext.grid.ColumnModel}.  The ColumnModel may be explicitly created via the
+     * <tt>{@link #colModel}</tt> configuration property.
+     */
+    /**
+     * @cfg {String} ddGroup The DD group this GridPanel belongs to. Defaults to <tt>'GridDD'</tt> if not specified.
+     */
+    /**
+     * @cfg {String} ddText
+     * Configures the text in the drag proxy.  Defaults to:
+     * <pre><code>
+     * ddText : '{0} selected row{1}'
+     * </code></pre>
+     * <tt>{0}</tt> is replaced with the number of selected rows.
+     */
+    ddText : '{0} selected row{1}',
+    
+    /**
+     * @cfg {Boolean} deferRowRender <P>Defaults to <tt>true</tt> to enable deferred row rendering.</p>
+     * <p>This allows the GridPanel to be initially rendered empty, with the expensive update of the row
+     * structure deferred so that layouts with GridPanels appear more quickly.</p>
+     */
+    deferRowRender : true,
+    
+    /**
+     * @cfg {Boolean} disableSelection <p><tt>true</tt> to disable selections in the grid. Defaults to <tt>false</tt>.</p>
+     * <p>Ignored if a {@link #selModel SelectionModel} is specified.</p>
+     */
+    /**
+     * @cfg {Boolean} enableColumnResize <tt>false</tt> to turn off column resizing for the whole grid. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} enableColumnHide
+     * Defaults to <tt>true</tt> to enable {@link Ext.grid.Column#hidden hiding of columns}
+     * with the {@link #enableHdMenu header menu}.
+     */
+    enableColumnHide : true,
+    
+    /**
+     * @cfg {Boolean} enableColumnMove Defaults to <tt>true</tt> to enable drag and drop reorder of columns. <tt>false</tt>
+     * to turn off column reordering via drag drop.
+     */
+    enableColumnMove : true,
+    
+    /**
+     * @cfg {Boolean} enableDragDrop <p>Enables dragging of the selected rows of the GridPanel. Defaults to <tt>false</tt>.</p>
+     * <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's {@link #getView GridView} to
+     * create an instance of {@link Ext.grid.GridDragZone}. <b>Note</b>: this is available only <b>after</b>
+     * the Grid has been rendered as the GridView's <tt>{@link Ext.grid.GridView#dragZone dragZone}</tt>
+     * property.</p>
+     * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's implementations of
+     * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} are able
+     * to process the {@link Ext.grid.GridDragZone#getDragData data} which is provided.</p>
+     */
+    enableDragDrop : false,
+    
+    /**
+     * @cfg {Boolean} enableHdMenu Defaults to <tt>true</tt> to enable the drop down button for menu in the headers.
+     */
+    enableHdMenu : true,
+    
+    /**
+     * @cfg {Boolean} hideHeaders True to hide the grid's header. Defaults to <code>false</code>.
+     */
+    /**
+     * @cfg {Object} loadMask An {@link Ext.LoadMask} config or true to mask the grid while
+     * loading. Defaults to <code>false</code>.
+     */
+    loadMask : false,
+    
+    /**
+     * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if <tt>autoHeight</tt> is not on.
+     */
+    /**
+     * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Defaults to <tt>25</tt>.
+     */
+    minColumnWidth : 25,
+    
+    /**
+     * @cfg {Object} sm Shorthand for <tt>{@link #selModel}</tt>.
+     */
+    /**
+     * @cfg {Object} selModel Any subclass of {@link Ext.grid.AbstractSelectionModel} that will provide
+     * the selection model for the grid (defaults to {@link Ext.grid.RowSelectionModel} if not specified).
+     */
+    /**
+     * @cfg {Ext.data.Store} store The {@link Ext.data.Store} the grid should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.
+     * <p>This causes the CSS class <tt><b>x-grid3-row-alt</b></tt> to be added to alternate rows of
+     * the grid. A default CSS rule is provided which sets a background colour, but you can override this
+     * with a rule which either overrides the <b>background-color</b> style using the '!important'
+     * modifier, or which uses a CSS selector of higher specificity.</p>
+     */
+    stripeRows : false,
+    
+    /**
+     * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is <tt>true</tt>
+     * for GridPanel, but <tt>false</tt> for EditorGridPanel.
+     */
+    trackMouseOver : true,
+    
+    /**
+     * @cfg {Array} stateEvents
+     * An array of events that, when fired, should trigger this component to save its state.
+     * Defaults to:<pre><code>
+     * stateEvents: ['columnmove', 'columnresize', 'sortchange', 'groupchange']
+     * </code></pre>
+     * <p>These can be any types of events supported by this component, including browser or
+     * custom events (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See {@link Ext.Component#stateful} for an explanation of saving and restoring
+     * Component state.</p>
+     */
+    stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],
+    
+    /**
+     * @cfg {Object} view The {@link Ext.grid.GridView} used by the grid. This can be set
+     * before a call to {@link Ext.Component#render render()}.
+     */
+    view : null,
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+    /**
+     * @cfg {Object} viewConfig A config object that will be applied to the grid's UI view.  Any of
+     * the config options available for {@link Ext.grid.GridView} can be specified here. This option
+     * is ignored if <tt>{@link #view}</tt> is specified.
+     */
+
+    // private
+    rendered : false,
+    
+    // private
+    viewReady : false,
+
+    // private
+    initComponent : function() {
+        Ext.grid.GridPanel.superclass.initComponent.call(this);
+
+        if (this.columnLines) {
+            this.cls = (this.cls || '') + ' x-grid-with-col-lines';
+        }
+        // override any provided value since it isn't valid
+        // and is causing too many bug reports ;)
+        this.autoScroll = false;
+        this.autoWidth = false;
+
+        if(Ext.isArray(this.columns)){
+            this.colModel = new Ext.grid.ColumnModel(this.columns);
+            delete this.columns;
+        }
+
+        // check and correct shorthanded configs
+        if(this.ds){
+            this.store = this.ds;
+            delete this.ds;
+        }
+        if(this.cm){
+            this.colModel = this.cm;
+            delete this.cm;
+        }
+        if(this.sm){
+            this.selModel = this.sm;
+            delete this.sm;
+        }
+        this.store = Ext.StoreMgr.lookup(this.store);
+
+        this.addEvents(
+            // raw events
+            /**
+             * @event click
+             * The raw click event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event dblclick
+             * The raw dblclick event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event contextmenu
+             * The raw contextmenu event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event mousedown
+             * The raw mousedown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mousedown',
+            /**
+             * @event mouseup
+             * The raw mouseup event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseup',
+            /**
+             * @event mouseover
+             * The raw mouseover event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * The raw mouseout event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseout',
+            /**
+             * @event keypress
+             * The raw keypress event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keypress',
+            /**
+             * @event keydown
+             * The raw keydown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+
+            // custom events
+            /**
+             * @event cellmousedown
+             * Fires before a cell is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellmousedown',
+            /**
+             * @event rowmousedown
+             * Fires before a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowmousedown',
+            /**
+             * @event headermousedown
+             * Fires before a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headermousedown',
+
+            /**
+             * @event groupmousedown
+             * Fires before a group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupmousedown',
+
+            /**
+             * @event rowbodymousedown
+             * Fires before the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodymousedown',
+
+            /**
+             * @event containermousedown
+             * Fires before the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containermousedown',
+
+            /**
+             * @event cellclick
+             * Fires when a cell is clicked.
+             * The data for the cell is drawn from the {@link Ext.data.Record Record}
+             * for this row. To access the data in the listener function use the
+             * following technique:
+             * <pre><code>
+function(grid, rowIndex, columnIndex, e) {
+    var record = grid.getStore().getAt(rowIndex);  // Get the Record
+    var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name
+    var data = record.get(fieldName);
+}
+</code></pre>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellclick',
+            /**
+             * @event celldblclick
+             * Fires when a cell is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'celldblclick',
+            /**
+             * @event rowclick
+             * Fires when a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowclick',
+            /**
+             * @event rowdblclick
+             * Fires when a row is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowdblclick',
+            /**
+             * @event headerclick
+             * Fires when a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerclick',
+            /**
+             * @event headerdblclick
+             * Fires when a header cell is double clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerdblclick',
+            /**
+             * @event groupclick
+             * Fires when group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupclick',
+            /**
+             * @event groupdblclick
+             * Fires when group header is double clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupdblclick',
+            /**
+             * @event containerclick
+             * Fires when the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerclick',
+            /**
+             * @event containerdblclick
+             * Fires when the container is double clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerdblclick',
+
+            /**
+             * @event rowbodyclick
+             * Fires when the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodyclick',
+            /**
+             * @event rowbodydblclick
+             * Fires when the row body is double clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodydblclick',
+
+            /**
+             * @event rowcontextmenu
+             * Fires when a row is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowcontextmenu',
+            /**
+             * @event cellcontextmenu
+             * Fires when a cell is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} cellIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellcontextmenu',
+            /**
+             * @event headercontextmenu
+             * Fires when a header is right clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headercontextmenu',
+            /**
+             * @event groupcontextmenu
+             * Fires when group header is right clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupcontextmenu',
+            /**
+             * @event containercontextmenu
+             * Fires when the container is right clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containercontextmenu',
+            /**
+             * @event rowbodycontextmenu
+             * Fires when the row body is right clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodycontextmenu',
+            /**
+             * @event bodyscroll
+             * Fires when the body element is scrolled
+             * @param {Number} scrollLeft
+             * @param {Number} scrollTop
+             */
+            'bodyscroll',
+            /**
+             * @event columnresize
+             * Fires when the user resizes a column
+             * @param {Number} columnIndex
+             * @param {Number} newSize
+             */
+            'columnresize',
+            /**
+             * @event columnmove
+             * Fires when the user moves a column
+             * @param {Number} oldIndex
+             * @param {Number} newIndex
+             */
+            'columnmove',
+            /**
+             * @event sortchange
+             * Fires when the grid's store sort changes
+             * @param {Grid} this
+             * @param {Object} sortInfo An object with the keys field and direction
+             */
+            'sortchange',
+            /**
+             * @event groupchange
+             * Fires when the grid's grouping changes (only applies for grids with a {@link Ext.grid.GroupingView GroupingView})
+             * @param {Grid} this
+             * @param {String} groupField A string with the grouping field, null if the store is not grouped.
+             */
+            'groupchange',
+            /**
+             * @event reconfigure
+             * Fires when the grid is reconfigured with a new store and/or column model.
+             * @param {Grid} this
+             * @param {Ext.data.Store} store The new store
+             * @param {Ext.grid.ColumnModel} colModel The new column model
+             */
+            'reconfigure',
+            /**
+             * @event viewready
+             * Fires when the grid view is available (use this for selecting a default row).
+             * @param {Grid} this
+             */
+            'viewready'
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);
+
+        var c = this.getGridEl();
+
+        this.el.addClass('x-grid-panel');
+
+        this.mon(c, {
+            scope: this,
+            mousedown: this.onMouseDown,
+            click: this.onClick,
+            dblclick: this.onDblClick,
+            contextmenu: this.onContextMenu
+        });
+
+        this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);
+
+        var view = this.getView();
+        view.init(this);
+        view.render();
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.GridPanel.superclass.initEvents.call(this);
+
+        if(this.loadMask){
+            this.loadMask = new Ext.LoadMask(this.bwrap,
+                    Ext.apply({store:this.store}, this.loadMask));
+        }
+    },
+
+    initStateEvents : function(){
+        Ext.grid.GridPanel.superclass.initStateEvents.call(this);
+        this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});
+    },
+
+    applyState : function(state){
+        var cm = this.colModel,
+            cs = state.columns,
+            store = this.store,
+            s,
+            c,
+            colIndex;
+
+        if(cs){
+            for(var i = 0, len = cs.length; i < len; i++){
+                s = cs[i];
+                c = cm.getColumnById(s.id);
+                if(c){
+                    colIndex = cm.getIndexById(s.id);
+                    cm.setState(colIndex, {
+                        hidden: s.hidden,
+                        width: s.width,
+                        sortable: s.sortable
+                    });
+                    if(colIndex != i){
+                        cm.moveColumn(colIndex, i);
+                    }
+                }
+            }
+        }
+        if(store){
+            s = state.sort;
+            if(s){
+                store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);
+            }
+            s = state.group;
+            if(store.groupBy){
+                if(s){
+                    store.groupBy(s);
+                }else{
+                    store.clearGrouping();
+                }
+            }
+
+        }
+        var o = Ext.apply({}, state);
+        delete o.columns;
+        delete o.sort;
+        Ext.grid.GridPanel.superclass.applyState.call(this, o);
+    },
+
+    getState : function(){
+        var o = {columns: []},
+            store = this.store,
+            ss,
+            gs;
+
+        for(var i = 0, c; (c = this.colModel.config[i]); i++){
+            o.columns[i] = {
+                id: c.id,
+                width: c.width
+            };
+            if(c.hidden){
+                o.columns[i].hidden = true;
+            }
+            if(c.sortable){
+                o.columns[i].sortable = true;
+            }
+        }
+        if(store){
+            ss = store.getSortState();
+            if(ss){
+                o.sort = ss;
+            }
+            if(store.getGroupState){
+                gs = store.getGroupState();
+                if(gs){
+                    o.group = gs;
+                }
+            }
+        }
+        return o;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.grid.GridPanel.superclass.afterRender.call(this);
+        var v = this.view;
+        this.on('bodyresize', v.layout, v);
+        v.layout(true);
+        if(this.deferRowRender){
+            if (!this.deferRowRenderTask){
+                this.deferRowRenderTask = new Ext.util.DelayedTask(v.afterRender, this.view);
+            }
+            this.deferRowRenderTask.delay(10);
+        }else{
+            v.afterRender();
+        }
+        this.viewReady = true;
+    },
+
+    /**
+     * <p>Reconfigures the grid to use a different Store and Column Model
+     * and fires the 'reconfigure' event. The View will be bound to the new
+     * objects and refreshed.</p>
+     * <p>Be aware that upon reconfiguring a GridPanel, certain existing settings <i>may</i> become
+     * invalidated. For example the configured {@link #autoExpandColumn} may no longer exist in the
+     * new ColumnModel. Also, an existing {@link Ext.PagingToolbar PagingToolbar} will still be bound
+     * to the old Store, and will need rebinding. Any {@link #plugins} might also need reconfiguring
+     * with the new data.</p>
+     * @param {Ext.data.Store} store The new {@link Ext.data.Store} object
+     * @param {Ext.grid.ColumnModel} colModel The new {@link Ext.grid.ColumnModel} object
+     */
+    reconfigure : function(store, colModel){
+        var rendered = this.rendered;
+        if(rendered){
+            if(this.loadMask){
+                this.loadMask.destroy();
+                this.loadMask = new Ext.LoadMask(this.bwrap,
+                        Ext.apply({}, {store:store}, this.initialConfig.loadMask));
+            }
+        }
+        if(this.view){
+            this.view.initData(store, colModel);
+        }
+        this.store = store;
+        this.colModel = colModel;
+        if(rendered){
+            this.view.refresh(true);
+        }
+        this.fireEvent('reconfigure', this, store, colModel);
+    },
+
+    // private
+    onDestroy : function(){
+        if (this.deferRowRenderTask && this.deferRowRenderTask.cancel){
+            this.deferRowRenderTask.cancel();
+        }
+        if(this.rendered){
+            Ext.destroy(this.view, this.loadMask);
+        }else if(this.store && this.store.autoDestroy){
+            this.store.destroy();
+        }
+        Ext.destroy(this.colModel, this.selModel);
+        this.store = this.selModel = this.colModel = this.view = this.loadMask = null;
+        Ext.grid.GridPanel.superclass.onDestroy.call(this);
+    },
+
+    // private
+    processEvent : function(name, e){
+        this.view.processEvent(name, e);
+    },
+
+    // private
+    onClick : function(e){
+        this.processEvent('click', e);
+    },
+
+    // private
+    onMouseDown : function(e){
+        this.processEvent('mousedown', e);
+    },
+
+    // private
+    onContextMenu : function(e, t){
+        this.processEvent('contextmenu', e);
+    },
+
+    // private
+    onDblClick : function(e){
+        this.processEvent('dblclick', e);
+    },
+
+    // private
+    walkCells : function(row, col, step, fn, scope){
+        var cm    = this.colModel,
+            clen  = cm.getColumnCount(),
+            ds    = this.store,
+            rlen  = ds.getCount(),
+            first = true;
+
+        if(step < 0){
+            if(col < 0){
+                row--;
+                first = false;
+            }
+            while(row >= 0){
+                if(!first){
+                    col = clen-1;
+                }
+                first = false;
+                while(col >= 0){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col--;
+                }
+                row--;
+            }
+        } else {
+            if(col >= clen){
+                row++;
+                first = false;
+            }
+            while(row < rlen){
+                if(!first){
+                    col = 0;
+                }
+                first = false;
+                while(col < clen){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col++;
+                }
+                row++;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the grid's underlying element.
+     * @return {Element} The element
+     */
+    getGridEl : function(){
+        return this.body;
+    },
+
+    // private for compatibility, overridden by editor grid
+    stopEditing : Ext.emptyFn,
+
+    /**
+     * Returns the grid's selection model configured by the <code>{@link #selModel}</code>
+     * configuration option. If no selection model was configured, this will create
+     * and return a {@link Ext.grid.RowSelectionModel RowSelectionModel}.
+     * @return {SelectionModel}
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.grid.RowSelectionModel(
+                    this.disableSelection ? {selectRow: Ext.emptyFn} : null);
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Returns the grid's data store.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Returns the grid's ColumnModel.
+     * @return {Ext.grid.ColumnModel} The column model
+     */
+    getColumnModel : function(){
+        return this.colModel;
+    },
+
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.GridView} The grid view
+     */
+    getView : function() {
+        if (!this.view) {
+            this.view = new Ext.grid.GridView(this.viewConfig);
+        }
+        
+        return this.view;
+    },
+    /**
+     * Called to get grid's drag proxy text, by default returns this.ddText.
+     * @return {String} The text
+     */
+    getDragDropText : function(){
+        var count = this.selModel.getCount();
+        return String.format(this.ddText, count, count == 1 ? '' : 's');
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method add
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @event afterlayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} autoScroll  @hide
+     */
+    /**
+     * @cfg {String} bodyBorder  @hide
+     */
+    /**
+     * @cfg {String} bodyStyle  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+Ext.reg('grid', Ext.grid.GridPanel);/**
+ * @class Ext.grid.PivotGrid
+ * @extends Ext.grid.GridPanel
+ * <p>The PivotGrid component enables rapid summarization of large data sets. It provides a way to reduce a large set of
+ * data down into a format where trends and insights become more apparent. A classic example is in sales data; a company
+ * will often have a record of all sales it makes for a given period - this will often encompass thousands of rows of
+ * data. The PivotGrid allows you to see how well each salesperson performed, which cities generate the most revenue, 
+ * how products perform between cities and so on.</p>
+ * <p>A PivotGrid is composed of two axes (left and top), one {@link #measure} and one {@link #aggregator aggregation}
+ * function. Each axis can contain one or more {@link #dimension}, which are ordered into a hierarchy. Dimensions on the 
+ * left axis can also specify a width. Each dimension in each axis can specify its sort ordering, defaulting to "ASC", 
+ * and must specify one of the fields in the {@link Ext.data.Record Record} used by the PivotGrid's 
+ * {@link Ext.data.Store Store}.</p>
+<pre><code>
+// This is the record representing a single sale
+var SaleRecord = Ext.data.Record.create([
+    {name: 'person',   type: 'string'},
+    {name: 'product',  type: 'string'},
+    {name: 'city',     type: 'string'},
+    {name: 'state',    type: 'string'},
+    {name: 'year',     type: 'int'},
+    {name: 'value',    type: 'int'}
+]);
+
+// A simple store that loads SaleRecord data from a url
+var myStore = new Ext.data.Store({
+    url: 'data.json',
+    autoLoad: true,
+    reader: new Ext.data.JsonReader({
+        root: 'rows',
+        idProperty: 'id'
+    }, SaleRecord)
+});
+
+// Create the PivotGrid itself, referencing the store
+var pivot = new Ext.grid.PivotGrid({
+    store     : myStore,
+    aggregator: 'sum',
+    measure   : 'value',
+
+    leftAxis: [
+        {
+            width: 60,
+            dataIndex: 'product'
+        },
+        {
+            width: 120,
+            dataIndex: 'person',
+            direction: 'DESC'
+        }
+    ],
+
+    topAxis: [
+        {
+            dataIndex: 'year'
+        }
+    ]
+});
+</code></pre>
+ * <p>The specified {@link #measure} is the field from SaleRecord that is extracted from each combination
+ * of product and person (on the left axis) and year on the top axis. There may be several SaleRecords in the 
+ * data set that share this combination, so an array of measure fields is produced. This array is then 
+ * aggregated using the {@link #aggregator} function.</p>
+ * <p>The default aggregator function is sum, which simply adds up all of the extracted measure values. Other
+ * built-in aggregator functions are count, avg, min and max. In addition, you can specify your own function.
+ * In this example we show the code used to sum the measures, but you can return any value you like. See
+ * {@link #aggregator} for more details.</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    aggregator: function(records, measure) {
+        var length = records.length,
+            total  = 0,
+            i;
+
+        for (i = 0; i < length; i++) {
+            total += records[i].get(measure);
+        }
+
+        return total;
+    },
+    
+    renderer: function(value) {
+        return Math.round(value);
+    },
+    
+    //your normal config here
+});
+</code></pre>
+ * <p><u>Renderers</u></p>
+ * <p>PivotGrid optionally accepts a {@link #renderer} function which can modify the data in each cell before it
+ * is rendered. The renderer is passed the value that would usually be placed in the cell and is expected to return
+ * the new value. For example let's imagine we had height data expressed as a decimal - here's how we might use a
+ * renderer to display the data in feet and inches notation:</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    //in each case the value is a decimal number of feet
+    renderer  : function(value) {
+        var feet   = Math.floor(value),
+            inches = Math.round((value - feet) * 12);
+
+        return String.format("{0}' {1}\"", feet, inches);
+    },
+    //normal config here
+});
+</code></pre>
+ * <p><u>Reconfiguring</u></p>
+ * <p>All aspects PivotGrid's configuration can be updated at runtime. It is easy to change the {@link #setMeasure measure}, 
+ * {@link #setAggregator aggregation function}, {@link #setLeftAxis left} and {@link #setTopAxis top} axes and refresh the grid.</p>
+ * <p>In this case we reconfigure the PivotGrid to have city and year as the top axis dimensions, rendering the average sale
+ * value into the cells:</p>
+<pre><code>
+//the left axis can also be changed
+pivot.topAxis.setDimensions([
+    {dataIndex: 'city', direction: 'DESC'},
+    {dataIndex: 'year', direction: 'ASC'}
+]);
+
+pivot.setMeasure('value');
+pivot.setAggregator('avg');
+
+pivot.view.refresh(true);
+</code></pre>
+ * <p>See the {@link Ext.grid.PivotAxis PivotAxis} documentation for further detail on reconfiguring axes.</p>
+ */
+Ext.grid.PivotGrid = Ext.extend(Ext.grid.GridPanel, {
+    
+    /**
+     * @cfg {String|Function} aggregator The aggregation function to use to combine the measures extracted
+     * for each dimension combination. Can be any of the built-in aggregators (sum, count, avg, min, max).
+     * Can also be a function which accepts two arguments (an array of Records to aggregate, and the measure 
+     * to aggregate them on) and should return a String.
+     */
+    aggregator: 'sum',
+    
+    /**
+     * @cfg {Function} renderer Optional renderer to pass values through before they are rendered to the dom. This
+     * gives an opportunity to modify cell contents after the value has been computed.
+     */
+    renderer: undefined,
+    
+    /**
+     * @cfg {String} measure The field to extract from each Record when pivoting around the two axes. See the class
+     * introduction docs for usage
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} leftAxis Either and array of {@link #dimension} to use on the left axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} topAxis Either and array of {@link #dimension} to use on the top axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    //inherit docs
+    initComponent: function() {
+        Ext.grid.PivotGrid.superclass.initComponent.apply(this, arguments);
+        
+        this.initAxes();
+        
+        //no resizing of columns is allowed yet in PivotGrid
+        this.enableColumnResize = false;
+        
+        this.viewConfig = Ext.apply(this.viewConfig || {}, {
+            forceFit: true
+        });
+        
+        //TODO: dummy col model that is never used - GridView is too tightly integrated with ColumnModel
+        //in 3.x to remove this altogether.
+        this.colModel = new Ext.grid.ColumnModel({});
+    },
+    
+    /**
+     * Returns the function currently used to aggregate the records in each Pivot cell
+     * @return {Function} The current aggregator function
+     */
+    getAggregator: function() {
+        if (typeof this.aggregator == 'string') {
+            return Ext.grid.PivotAggregatorMgr.types[this.aggregator];
+        } else {
+            return this.aggregator;
+        }
+    },
+    
+    /**
+     * Sets the function to use when aggregating data for each cell.
+     * @param {String|Function} aggregator The new aggregator function or named function string
+     */
+    setAggregator: function(aggregator) {
+        this.aggregator = aggregator;
+    },
+    
+    /**
+     * Sets the field name to use as the Measure in this Pivot Grid
+     * @param {String} measure The field to make the measure
+     */
+    setMeasure: function(measure) {
+        this.measure = measure;
+    },
+    
+    /**
+     * Sets the left axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setLeftAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the left Axis for this Pivot Grid
+         * @property leftAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.leftAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * Sets the top axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setTopAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the top Axis for this Pivot Grid
+         * @property topAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.topAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the top and left axes. Should usually only need to be called once from initComponent
+     */
+    initAxes: function() {
+        var PivotAxis = Ext.grid.PivotAxis;
+        
+        if (!(this.leftAxis instanceof PivotAxis)) {
+            this.setLeftAxis(new PivotAxis({
+                orientation: 'vertical',
+                dimensions : this.leftAxis || [],
+                store      : this.store
+            }));
+        };
+        
+        if (!(this.topAxis instanceof PivotAxis)) {
+            this.setTopAxis(new PivotAxis({
+                orientation: 'horizontal',
+                dimensions : this.topAxis || [],
+                store      : this.store
+            }));
+        };
+    },
+    
+    /**
+     * @private
+     * @return {Array} 2-dimensional array of cell data
+     */
+    extractData: function() {
+        var records  = this.store.data.items,
+            recCount = records.length,
+            cells    = [],
+            record, i, j, k;
+        
+        if (recCount == 0) {
+            return [];
+        }
+        
+        var leftTuples = this.leftAxis.getTuples(),
+            leftCount  = leftTuples.length,
+            topTuples  = this.topAxis.getTuples(),
+            topCount   = topTuples.length,
+            aggregator = this.getAggregator();
+        
+        for (i = 0; i < recCount; i++) {
+            record = records[i];
+            
+            for (j = 0; j < leftCount; j++) {
+                cells[j] = cells[j] || [];
+                
+                if (leftTuples[j].matcher(record) === true) {
+                    for (k = 0; k < topCount; k++) {
+                        cells[j][k] = cells[j][k] || [];
+                        
+                        if (topTuples[k].matcher(record)) {
+                            cells[j][k].push(record);
+                        }
+                    }
+                }
+            }
+        }
+        
+        var rowCount = cells.length,
+            colCount, row;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = cells[i];
+            colCount = row.length;
+            
+            for (j = 0; j < colCount; j++) {
+                cells[i][j] = aggregator(cells[i][j], this.measure);
+            }
+        }
+        
+        return cells;
+    },
+    
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.PivotGridView} The grid view
+     */
+    getView: function() {
+        if (!this.view) {
+            this.view = new Ext.grid.PivotGridView(this.viewConfig);
+        }
+        
+        return this.view;
+    }
+});
+
+Ext.reg('pivotgrid', Ext.grid.PivotGrid);
+
+
+Ext.grid.PivotAggregatorMgr = new Ext.AbstractManager();
+
+Ext.grid.PivotAggregatorMgr.registerType('sum', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return total;
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('avg', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return (total / length) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('min', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.min.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('max', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.max.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('count', function(records, measure) {
+    return records.length;
+});/**
+ * @class Ext.grid.GridView
+ * @extends Ext.util.Observable
+ * <p>This class encapsulates the user interface of an {@link Ext.grid.GridPanel}.
+ * Methods of this class may be used to access user interface elements to enable
+ * special display effects. Do not change the DOM structure of the user interface.</p>
+ * <p>This class does not provide ways to manipulate the underlying data. The data
+ * model of a Grid is held in an {@link Ext.data.Store}.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GridView = Ext.extend(Ext.util.Observable, {
+    /**
+     * Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
+     * parameters to the row template for the current row to customize how it is rendered using the <b>rowParams</b>
+     * parameter.  This function should return the CSS class name (or empty string '' for none) that will be added
+     * to the row's wrapping div.  To apply multiple class names, simply return them space-delimited within the string
+     * (e.g., 'my-class another-class'). Example usage:
+    <pre><code>
+viewConfig: {
+    forceFit: true,
+    showPreview: true, // custom property
+    enableRowBody: true, // required to create a second, full-width row to show expanded Record data
+    getRowClass: function(record, rowIndex, rp, ds){ // rp = rowParams
+        if(this.showPreview){
+            rp.body = '&lt;p>'+record.data.excerpt+'&lt;/p>';
+            return 'x-grid3-row-expanded';
+        }
+        return 'x-grid3-row-collapsed';
+    }
+},
+    </code></pre>
+     * @param {Record} record The {@link Ext.data.Record} corresponding to the current row.
+     * @param {Number} index The row index.
+     * @param {Object} rowParams A config object that is passed to the row template during rendering that allows
+     * customization of various aspects of a grid row.
+     * <p>If {@link #enableRowBody} is configured <b><tt></tt>true</b>, then the following properties may be set
+     * by this function, and will be used to render a full-width expansion row below each grid row:</p>
+     * <ul>
+     * <li><code>body</code> : String <div class="sub-desc">An HTML fragment to be used as the expansion row's body content (defaults to '').</div></li>
+     * <li><code>bodyStyle</code> : String <div class="sub-desc">A CSS style specification that will be applied to the expansion row's &lt;tr> element. (defaults to '').</div></li>
+     * </ul>
+     * The following property will be passed in, and may be appended to:
+     * <ul>
+     * <li><code>tstyle</code> : String <div class="sub-desc">A CSS style specification that willl be applied to the &lt;table> element which encapsulates
+     * both the standard grid row, and any expansion row.</div></li>
+     * </ul>
+     * @param {Store} store The {@link Ext.data.Store} this grid is bound to
+     * @method getRowClass
+     * @return {String} a CSS class name to add to the row.
+     */
+
+    /**
+     * @cfg {Boolean} enableRowBody True to add a second TR element per row that can be used to provide a row body
+     * that spans beneath the data row.  Use the {@link #getRowClass} method's rowParams config to customize the row body.
+     */
+
+    /**
+     * @cfg {String} emptyText Default text (html tags are accepted) to display in the grid body when no rows
+     * are available (defaults to ''). This value will be used to update the <tt>{@link #mainBody}</tt>:
+    <pre><code>
+    this.mainBody.update('&lt;div class="x-grid-empty">' + this.emptyText + '&lt;/div>');
+    </code></pre>
+     */
+
+    /**
+     * @cfg {Boolean} headersDisabled True to disable the grid column headers (defaults to <tt>false</tt>).
+     * Use the {@link Ext.grid.ColumnModel ColumnModel} <tt>{@link Ext.grid.ColumnModel#menuDisabled menuDisabled}</tt>
+     * config to disable the <i>menu</i> for individual columns.  While this config is true the
+     * following will be disabled:<div class="mdetail-params"><ul>
+     * <li>clicking on header to sort</li>
+     * <li>the trigger to reveal the menu.</li>
+     * </ul></div>
+     */
+
+    /**
+     * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations
+     * of the template methods of DragZone to enable dragging of the selected rows of a GridPanel.
+     * See {@link Ext.grid.GridDragZone} for details.</p>
+     * <p>This will <b>only</b> be present:<div class="mdetail-params"><ul>
+     * <li><i>if</i> the owning GridPanel was configured with {@link Ext.grid.GridPanel#enableDragDrop enableDragDrop}: <tt>true</tt>.</li>
+     * <li><i>after</i> the owning GridPanel has been rendered.</li>
+     * </ul></div>
+     * @property dragZone
+     * @type {Ext.grid.GridDragZone}
+     */
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer <tt>{@link #emptyText}</tt> being applied until the store's
+     * first load (defaults to <tt>true</tt>).
+     */
+    deferEmptyText : true,
+
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the vertical scrollbar
+     * (defaults to <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+
+    /**
+     * @cfg {Boolean} autoFill
+     * Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * when the grid is <b>initially rendered</b>.  The
+     * {@link Ext.grid.Column#width initially configured width}</tt> of each column will be adjusted
+     * to fit the grid width and prevent horizontal scrolling. If columns are later resized (manually
+     * or programmatically), the other columns in the grid will <b>not</b> be resized to fit the grid width.
+     * See <tt>{@link #forceFit}</tt> also.
+     */
+    autoFill : false,
+
+    /**
+     * @cfg {Boolean} forceFit
+     * <p>Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * at <b>all times</b>.</p>
+     * <p>The {@link Ext.grid.Column#width initially configured width}</tt> of each
+     * column will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are
+     * later resized (manually or programmatically), the other columns in the grid <b>will</b> be resized
+     * to fit the grid width.</p>
+     * <p>Columns which are configured with <code>fixed: true</code> are omitted from being resized.</p>
+     * <p>See <tt>{@link #autoFill}</tt>.</p>
+     */
+    forceFit : false,
+
+    /**
+     * @cfg {Array} sortClasses The CSS classes applied to a header when it is sorted. (defaults to <tt>['sort-asc', 'sort-desc']</tt>)
+     */
+    sortClasses : ['sort-asc', 'sort-desc'],
+
+    /**
+     * @cfg {String} sortAscText The text displayed in the 'Sort Ascending' menu item (defaults to <tt>'Sort Ascending'</tt>)
+     */
+    sortAscText : 'Sort Ascending',
+
+    /**
+     * @cfg {String} sortDescText The text displayed in the 'Sort Descending' menu item (defaults to <tt>'Sort Descending'</tt>)
+     */
+    sortDescText : 'Sort Descending',
+
+    /**
+     * @cfg {String} columnsText The text displayed in the 'Columns' menu item (defaults to <tt>'Columns'</tt>)
+     */
+    columnsText : 'Columns',
+
+    /**
+     * @cfg {String} selectedRowClass The CSS class applied to a selected row (defaults to <tt>'x-grid3-row-selected'</tt>). An
+     * example overriding the default styling:
+    <pre><code>
+    .x-grid3-row-selected {background-color: yellow;}
+    </code></pre>
+     * Note that this only controls the row, and will not do anything for the text inside it.  To style inner
+     * facets (like text) use something like:
+    <pre><code>
+    .x-grid3-row-selected .x-grid3-cell-inner {
+        color: #FFCC00;
+    }
+    </code></pre>
+     * @type String
+     */
+    selectedRowClass : 'x-grid3-row-selected',
+
+    // private
+    borderWidth : 2,
+    tdClass : 'x-grid3-cell',
+    hdCls : 'x-grid3-hd',
+    
+    
+    /**
+     * @cfg {Boolean} markDirty True to show the dirty cell indicator when a cell has been modified. Defaults to <tt>true</tt>.
+     */
+    markDirty : true,
+
+    /**
+     * @cfg {Number} cellSelectorDepth The number of levels to search for cells in event delegation (defaults to <tt>4</tt>)
+     */
+    cellSelectorDepth : 4,
+    
+    /**
+     * @cfg {Number} rowSelectorDepth The number of levels to search for rows in event delegation (defaults to <tt>10</tt>)
+     */
+    rowSelectorDepth : 10,
+
+    /**
+     * @cfg {Number} rowBodySelectorDepth The number of levels to search for row bodies in event delegation (defaults to <tt>10</tt>)
+     */
+    rowBodySelectorDepth : 10,
+
+    /**
+     * @cfg {String} cellSelector The selector used to find cells internally (defaults to <tt>'td.x-grid3-cell'</tt>)
+     */
+    cellSelector : 'td.x-grid3-cell',
+    
+    /**
+     * @cfg {String} rowSelector The selector used to find rows internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowSelector : 'div.x-grid3-row',
+
+    /**
+     * @cfg {String} rowBodySelector The selector used to find row bodies internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowBodySelector : 'div.x-grid3-row-body',
+
+    // private
+    firstRowCls: 'x-grid3-row-first',
+    lastRowCls: 'x-grid3-row-last',
+    rowClsRe: /(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,
+    
+    /**
+     * @cfg {String} headerMenuOpenCls The CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open'
+     */
+    headerMenuOpenCls: 'x-grid3-hd-menu-open',
+    
+    /**
+     * @cfg {String} rowOverCls The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over'
+     */
+    rowOverCls: 'x-grid3-row-over',
+
+    constructor : function(config) {
+        Ext.apply(this, config);
+        
+        // These events are only used internally by the grid components
+        this.addEvents(
+            /**
+             * @event beforerowremoved
+             * Internal UI Event. Fired before a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row to be removed.
+             * @param {Ext.data.Record} record The Record to be removed
+             */
+            'beforerowremoved',
+            
+            /**
+             * @event beforerowsinserted
+             * Internal UI Event. Fired before rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first row to be inserted.
+             * @param {Number} lastRow The index of the last row to be inserted.
+             */
+            'beforerowsinserted',
+            
+            /**
+             * @event beforerefresh
+             * Internal UI Event. Fired before the view is refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'beforerefresh',
+            
+            /**
+             * @event rowremoved
+             * Internal UI Event. Fired after a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row that was removed.
+             * @param {Ext.data.Record} record The Record that was removed
+             */
+            'rowremoved',
+            
+            /**
+             * @event rowsinserted
+             * Internal UI Event. Fired after rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first inserted.
+             * @param {Number} lastRow The index of the last row inserted.
+             */
+            'rowsinserted',
+            
+            /**
+             * @event rowupdated
+             * Internal UI Event. Fired after a row has been updated.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the row updated.
+             * @param {Ext.data.record} record The Record backing the row updated.
+             */
+            'rowupdated',
+            
+            /**
+             * @event refresh
+             * Internal UI Event. Fired after the GridView's body has been refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'refresh'
+        );
+        
+        Ext.grid.GridView.superclass.constructor.call(this);
+    },
+
+    /* -------------------------------- UI Specific ----------------------------- */
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * The template to use when rendering headers. Has a default template
+     * @property headerTpl
+     * @type Ext.Template
+     */
+    headerTpl: new Ext.Template(
+        '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+            '<thead>',
+                '<tr class="x-grid3-hd-row">{cells}</tr>',
+            '</thead>',
+        '</table>'
+    ),
+    
+    /**
+     * The template to use when rendering the body. Has a default template
+     * @property bodyTpl
+     * @type Ext.Template
+     */
+    bodyTpl: new Ext.Template('{rows}'),
+    
+    /**
+     * The template to use to render each cell. Has a default template
+     * @property cellTpl
+     * @type Ext.Template
+     */
+    cellTpl: new Ext.Template(
+        '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>',
+            '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',
+        '</td>'
+    ),
+    
+    /**
+     * @private
+     * Provides default templates if they are not given for this particular instance. Most of the templates are defined on
+     * the prototype, the ones defined inside this function are done so because they are based on Grid or GridView configuration
+     */
+    initTemplates : function() {
+        var templates = this.templates || {},
+            template, name,
+            
+            headerCellTpl = new Ext.Template(
+                '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">',
+                    '<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '',
+                        '{value}',
+                        '<img alt="" class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />',
+                    '</div>',
+                '</td>'
+            ),
+        
+            rowBodyText = [
+                '<tr class="x-grid3-row-body-tr" style="{bodyStyle}">',
+                    '<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">',
+                        '<div class="x-grid3-row-body">{body}</div>',
+                    '</td>',
+                '</tr>'
+            ].join(""),
+        
+            innerText = [
+                '<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+                     '<tbody>',
+                        '<tr>{cells}</tr>',
+                        this.enableRowBody ? rowBodyText : '',
+                     '</tbody>',
+                '</table>'
+            ].join("");
+        
+        Ext.applyIf(templates, {
+            hcell   : headerCellTpl,
+            cell    : this.cellTpl,
+            body    : this.bodyTpl,
+            header  : this.headerTpl,
+            master  : this.masterTpl,
+            row     : new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">' + innerText + '</div>'),
+            rowInner: new Ext.Template(innerText)
+        });
+
+        for (name in templates) {
+            template = templates[name];
+            
+            if (template && Ext.isFunction(template.compile) && !template.compiled) {
+                template.disableFormats = true;
+                template.compile();
+            }
+        }
+
+        this.templates = templates;
+        this.colRe = new RegExp('x-grid3-td-([^\\s]+)', '');
+    },
+
+    /**
+     * @private
+     * Each GridView has its own private flyweight, accessed through this method
+     */
+    fly : function(el) {
+        if (!this._flyweight) {
+            this._flyweight = new Ext.Element.Flyweight(document.body);
+        }
+        this._flyweight.dom = el;
+        return this._flyweight;
+    },
+
+    // private
+    getEditorParent : function() {
+        return this.scroller.dom;
+    },
+
+    /**
+     * @private
+     * Finds and stores references to important elements
+     */
+    initElements : function() {
+        var Element  = Ext.Element,
+            el       = Ext.get(this.grid.getGridEl().dom.firstChild),
+            mainWrap = new Element(el.child('div.x-grid3-viewport')),
+            mainHd   = new Element(mainWrap.child('div.x-grid3-header')),
+            scroller = new Element(mainWrap.child('div.x-grid3-scroller'));
+        
+        if (this.grid.hideHeaders) {
+            mainHd.setDisplayed(false);
+        }
+        
+        if (this.forceFit) {
+            scroller.setStyle('overflow-x', 'hidden');
+        }
+        
+        /**
+         * <i>Read-only</i>. The GridView's body Element which encapsulates all rows in the Grid.
+         * This {@link Ext.Element Element} is only available after the GridPanel has been rendered.
+         * @type Ext.Element
+         * @property mainBody
+         */
+        
+        Ext.apply(this, {
+            el      : el,
+            mainWrap: mainWrap,
+            scroller: scroller,
+            mainHd  : mainHd,
+            innerHd : mainHd.child('div.x-grid3-header-inner').dom,
+            mainBody: new Element(Element.fly(scroller).child('div.x-grid3-body')),
+            focusEl : new Element(Element.fly(scroller).child('a')),
+            
+            resizeMarker: new Element(el.child('div.x-grid3-resize-marker')),
+            resizeProxy : new Element(el.child('div.x-grid3-resize-proxy'))
+        });
+        
+        this.focusEl.swallowEvent('click', true);
+    },
+
+    // private
+    getRows : function() {
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // finder methods, used with delegation
+
+    // private
+    findCell : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth);
+    },
+
+    /**
+     * <p>Return the index of the grid column which contains the passed HTMLElement.</p>
+     * See also {@link #findRowIndex}
+     * @param {HTMLElement} el The target element
+     * @return {Number} The column index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findCellIndex : function(el, requiredCls) {
+        var cell = this.findCell(el),
+            hasCls;
+        
+        if (cell) {
+            hasCls = this.fly(cell).hasClass(requiredCls);
+            if (!requiredCls || hasCls) {
+                return this.getCellIndex(cell);
+            }
+        }
+        return false;
+    },
+
+    // private
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe);
+            
+            if (match && match[1]) {
+                return this.cm.getIndexById(match[1]);
+            }
+        }
+        return false;
+    },
+
+    // private
+    findHeaderCell : function(el) {
+        var cell = this.findCell(el);
+        return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null;
+    },
+
+    // private
+    findHeaderIndex : function(el){
+        return this.findCellIndex(el, this.hdCls);
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row element, or null if the target element is not within a row of this GridView.
+     */
+    findRow : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth);
+    },
+
+    /**
+     * Return the index of the grid row which contains the passed HTMLElement.
+     * See also {@link #findCellIndex}
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {Number} The row index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findRowIndex : function(el) {
+        var row = this.findRow(el);
+        return row ? row.rowIndex : false;
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row body which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row body element, or null if the target element is not within a row body of this GridView.
+     */
+    findRowBody : function(el) {
+        if (!el) {
+            return false;
+        }
+        
+        return this.fly(el).findParent(this.rowBodySelector, this.rowBodySelectorDepth);
+    },
+
+    // getter methods for fetching elements dynamically in the grid
+
+    /**
+     * Return the <tt>&lt;div></tt> HtmlElement which represents a Grid row for the specified index.
+     * @param {Number} index The row index
+     * @return {HtmlElement} The div element.
+     */
+    getRow : function(row) {
+        return this.getRows()[row];
+    },
+
+    /**
+     * Returns the grid's <tt>&lt;td></tt> HtmlElement at the specified coordinates.
+     * @param {Number} row The row index in which to find the cell.
+     * @param {Number} col The column index of the cell.
+     * @return {HtmlElement} The td at the specified coordinates.
+     */
+    getCell : function(row, col) {
+        return Ext.fly(this.getRow(row)).query(this.cellSelector)[col]; 
+    },
+
+    /**
+     * Return the <tt>&lt;td></tt> HtmlElement which represents the Grid's header cell for the specified column index.
+     * @param {Number} index The column index
+     * @return {HtmlElement} The td element.
+     */
+    getHeaderCell : function(index) {
+        return this.mainHd.dom.getElementsByTagName('td')[index];
+    },
+
+    // manipulating elements
+
+    // private - use getRowClass to apply custom row classes
+    addRowClass : function(rowId, cls) {
+        var row = this.getRow(rowId);
+        if (row) {
+            this.fly(row).addClass(cls);
+        }
+    },
+
+    // private
+    removeRowClass : function(row, cls) {
+        var r = this.getRow(row);
+        if(r){
+            this.fly(r).removeClass(cls);
+        }
+    },
+
+    // private
+    removeRow : function(row) {
+        Ext.removeNode(this.getRow(row));
+        this.syncFocusEl(row);
+    },
+
+    // private
+    removeRows : function(firstRow, lastRow) {
+        var bd = this.mainBody.dom,
+            rowIndex;
+            
+        for (rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            Ext.removeNode(bd.childNodes[firstRow]);
+        }
+        
+        this.syncFocusEl(firstRow);
+    },
+
+    /* ----------------------------------- Scrolling functions -------------------------------------------*/
+    
+    // private
+    getScrollState : function() {
+        var sb = this.scroller.dom;
+        
+        return {
+            left: sb.scrollLeft, 
+            top : sb.scrollTop
+        };
+    },
+
+    // private
+    restoreScroll : function(state) {
+        var sb = this.scroller.dom;
+        sb.scrollLeft = state.left;
+        sb.scrollTop  = state.top;
+    },
+
+    /**
+     * Scrolls the grid to the top
+     */
+    scrollToTop : function() {
+        var dom = this.scroller.dom;
+        
+        dom.scrollTop  = 0;
+        dom.scrollLeft = 0;
+    },
+
+    // private
+    syncScroll : function() {
+        this.syncHeaderScroll();
+        var mb = this.scroller.dom;
+        this.grid.fireEvent('bodyscroll', mb.scrollLeft, mb.scrollTop);
+    },
+
+    // private
+    syncHeaderScroll : function() {
+        var innerHd    = this.innerHd,
+            scrollLeft = this.scroller.dom.scrollLeft;
+        
+        innerHd.scrollLeft = scrollLeft;
+        innerHd.scrollLeft = scrollLeft; // second time for IE (1/2 time first fails, other browsers ignore)
+    },
+    
+    /**
+     * @private
+     * Ensures the given column has the given icon class
+     */
+    updateSortIcon : function(col, dir) {
+        var sortClasses = this.sortClasses,
+            sortClass   = sortClasses[dir == "DESC" ? 1 : 0],
+            headers     = this.mainHd.select('td').removeClass(sortClasses);
+        
+        headers.item(col).addClass(sortClass);
+    },
+
+    /**
+     * @private
+     * Updates the size of every column and cell in the grid
+     */
+    updateAllColumnWidths : function() {
+        var totalWidth = this.getTotalWidth(),
+            colCount   = this.cm.getColumnCount(),
+            rows       = this.getRows(),
+            rowCount   = rows.length,
+            widths     = [],
+            row, rowFirstChild, trow, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            widths[i] = this.getColumnWidth(i);
+            this.getHeaderCell(i).style.width = widths[i];
+        }
+        
+        this.updateHeaderWidth();
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                trow = rowFirstChild.rows[0];
+                
+                for (j = 0; j < colCount; j++) {
+                    trow.childNodes[j].style.width = widths[j];
+                }
+            }
+        }
+        
+        this.onAllColumnWidthsUpdated(widths, totalWidth);
+    },
+
+    /**
+     * @private
+     * Called after a column's width has been updated, this resizes all of the cells for that column in each row
+     * @param {Number} column The column index
+     */
+    updateColumnWidth : function(column, width) {
+        var columnWidth = this.getColumnWidth(column),
+            totalWidth  = this.getTotalWidth(),
+            headerCell  = this.getHeaderCell(column),
+            nodes       = this.getRows(),
+            nodeCount   = nodes.length,
+            row, i, firstChild;
+        
+        this.updateHeaderWidth();
+        headerCell.style.width = columnWidth;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            firstChild = row.firstChild;
+            
+            row.style.width = totalWidth;
+            if (firstChild) {
+                firstChild.style.width = totalWidth;
+                firstChild.rows[0].childNodes[column].style.width = columnWidth;
+            }
+        }
+        
+        this.onColumnWidthUpdated(column, columnWidth, totalWidth);
+    },
+    
+    /**
+     * @private
+     * Sets the hidden status of a given column.
+     * @param {Number} col The column index
+     * @param {Boolean} hidden True to make the column hidden
+     */
+    updateColumnHidden : function(col, hidden) {
+        var totalWidth = this.getTotalWidth(),
+            display    = hidden ? 'none' : '',
+            headerCell = this.getHeaderCell(col),
+            nodes      = this.getRows(),
+            nodeCount  = nodes.length,
+            row, rowFirstChild, i;
+        
+        this.updateHeaderWidth();
+        headerCell.style.display = display;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                rowFirstChild.rows[0].childNodes[col].style.display = display;
+            }
+        }
+        
+        this.onColumnHiddenUpdated(col, hidden, totalWidth);
+        delete this.lastViewWidth; //recalc
+        this.layout();
+    },
+
+    /**
+     * @private
+     * Renders all of the rows to a string buffer and returns the string. This is called internally
+     * by renderRows and performs the actual string building for the rows - it does not inject HTML into the DOM.
+     * @param {Array} columns The column data acquired from getColumnData.
+     * @param {Array} records The array of records to render
+     * @param {Ext.data.Store} store The store to render the rows from
+     * @param {Number} startRow The index of the first row being rendered. Sometimes we only render a subset of
+     * the rows so this is used to maintain logic for striping etc
+     * @param {Number} colCount The total number of columns in the column model
+     * @param {Boolean} stripe True to stripe the rows
+     * @return {String} A string containing the HTML for the rendered rows
+     */
+    doRender : function(columns, records, store, startRow, colCount, stripe) {
+        var templates = this.templates,
+            cellTemplate = templates.cell,
+            rowTemplate = templates.row,
+            last = colCount - 1,
+            tstyle = 'width:' + this.getTotalWidth() + ';',
+            // buffers
+            rowBuffer = [],
+            colBuffer = [],
+            rowParams = {tstyle: tstyle},
+            meta = {},
+            len  = records.length,
+            alt,
+            column,
+            record, i, j, rowIndex;
+
+        //build up each row's HTML
+        for (j = 0; j < len; j++) {
+            record    = records[j];
+            colBuffer = [];
+
+            rowIndex = j + startRow;
+
+            //build up each column's HTML
+            for (i = 0; i < colCount; i++) {
+                column = columns[i];
+                
+                meta.id    = column.id;
+                meta.css   = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.style = column.style;
+                meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+
+                if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                    meta.css += ' x-grid3-dirty-cell';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+
+            alt = [];
+            //set up row striping and row dirtiness CSS classes
+            if (stripe && ((rowIndex + 1) % 2 === 0)) {
+                alt[0] = 'x-grid3-row-alt';
+            }
+
+            if (record.dirty) {
+                alt[1] = ' x-grid3-dirty-row';
+            }
+
+            rowParams.cols = colCount;
+
+            if (this.getRowClass) {
+                alt[2] = this.getRowClass(record, rowIndex, rowParams, store);
+            }
+
+            rowParams.alt   = alt.join(' ');
+            rowParams.cells = colBuffer.join('');
+
+            rowBuffer[rowBuffer.length] = rowTemplate.apply(rowParams);
+        }
+
+        return rowBuffer.join('');
+    },
+
+    /**
+     * @private
+     * Adds CSS classes and rowIndex to each row
+     * @param {Number} startRow The row to start from (defaults to 0)
+     */
+    processRows : function(startRow, skipStripe) {
+        if (!this.ds || this.ds.getCount() < 1) {
+            return;
+        }
+
+        var rows   = this.getRows(),
+            length = rows.length,
+            row, i;
+
+        skipStripe = skipStripe || !this.grid.stripeRows;
+        startRow   = startRow   || 0;
+
+        for (i = 0; i < length; i++) {
+            row = rows[i];
+            if (row) {
+                row.rowIndex = i;
+                if (!skipStripe) {
+                    row.className = row.className.replace(this.rowClsRe, ' ');
+                    if ((i + 1) % 2 === 0){
+                        row.className += ' x-grid3-row-alt';
+                    }
+                }
+            }
+        }
+
+        // add first/last-row classes
+        if (startRow === 0) {
+            Ext.fly(rows[0]).addClass(this.firstRowCls);
+        }
+
+        Ext.fly(rows[length - 1]).addClass(this.lastRowCls);
+    },
+    
+    /**
+     * @private
+     */
+    afterRender : function() {
+        if (!this.ds || !this.cm) {
+            return;
+        }
+        
+        this.mainBody.dom.innerHTML = this.renderBody() || '&#160;';
+        this.processRows(0, true);
+
+        if (this.deferEmptyText !== true) {
+            this.applyEmptyText();
+        }
+        
+        this.grid.fireEvent('viewready', this.grid);
+    },
+    
+    /**
+     * @private
+     * This is always intended to be called after renderUI. Sets up listeners on the UI elements
+     * and sets up options like column menus, moving and resizing.
+     */
+    afterRenderUI: function() {
+        var grid = this.grid;
+        
+        this.initElements();
+
+        // get mousedowns early
+        Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
+
+        this.mainHd.on({
+            scope    : this,
+            mouseover: this.handleHdOver,
+            mouseout : this.handleHdOut,
+            mousemove: this.handleHdMove
+        });
+
+        this.scroller.on('scroll', this.syncScroll,  this);
+        
+        if (grid.enableColumnResize !== false) {
+            this.splitZone = new Ext.grid.GridView.SplitDragZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableColumnMove) {
+            this.columnDrag = new Ext.grid.GridView.ColumnDragZone(grid, this.innerHd);
+            this.columnDrop = new Ext.grid.HeaderDropZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableHdMenu !== false) {
+            this.hmenu = new Ext.menu.Menu({id: grid.id + '-hctx'});
+            this.hmenu.add(
+                {itemId:'asc',  text: this.sortAscText,  cls: 'xg-hmenu-sort-asc'},
+                {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
+            );
+
+            if (grid.enableColumnHide !== false) {
+                this.colMenu = new Ext.menu.Menu({id:grid.id + '-hcols-menu'});
+                this.colMenu.on({
+                    scope     : this,
+                    beforeshow: this.beforeColMenuShow,
+                    itemclick : this.handleHdMenuClick
+                });
+                this.hmenu.add('-', {
+                    itemId:'columns',
+                    hideOnClick: false,
+                    text: this.columnsText,
+                    menu: this.colMenu,
+                    iconCls: 'x-cols-icon'
+                });
+            }
+
+            this.hmenu.on('itemclick', this.handleHdMenuClick, this);
+        }
+
+        if (grid.trackMouseOver) {
+            this.mainBody.on({
+                scope    : this,
+                mouseover: this.onRowOver,
+                mouseout : this.onRowOut
+            });
+        }
+
+        if (grid.enableDragDrop || grid.enableDrag) {
+            this.dragZone = new Ext.grid.GridDragZone(grid, {
+                ddGroup : grid.ddGroup || 'GridDD'
+            });
+        }
+
+        this.updateHeaderSortState();
+    },
+
+    /**
+     * @private
+     * Renders each of the UI elements in turn. This is called internally, once, by this.render. It does not
+     * render rows from the store, just the surrounding UI elements.
+     */
+    renderUI : function() {
+        var templates = this.templates;
+
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            header: this.renderHeaders(),
+            ostyle: 'width:' + this.getOffsetWidth() + ';',
+            bstyle: 'width:' + this.getTotalWidth()  + ';'
+        });
+    },
+
+    // private
+    processEvent : function(name, e) {
+        var target = e.getTarget(),
+            grid   = this.grid,
+            header = this.findHeaderIndex(target),
+            row, cell, col, body;
+
+        grid.fireEvent(name, e);
+
+        if (header !== false) {
+            grid.fireEvent('header' + name, grid, header, e);
+        } else {
+            row = this.findRowIndex(target);
+
+//          Grid's value-added events must bubble correctly to allow cancelling via returning false: cell->column->row
+//          We must allow a return of false at any of these levels to cancel the event processing.
+//          Particularly allowing rowmousedown to be cancellable by prior handlers which need to prevent selection.
+            if (row !== false) {
+                cell = this.findCellIndex(target);
+                if (cell !== false) {
+                    col = grid.colModel.getColumnAt(cell);
+                    if (grid.fireEvent('cell' + name, grid, row, cell, e) !== false) {
+                        if (!col || (col.processEvent && (col.processEvent(name, e, grid, row, cell) !== false))) {
+                            grid.fireEvent('row' + name, grid, row, e);
+                        }
+                    }
+                } else {
+                    if (grid.fireEvent('row' + name, grid, row, e) !== false) {
+                        (body = this.findRowBody(target)) && grid.fireEvent('rowbody' + name, grid, row, e);
+                    }
+                }
+            } else {
+                grid.fireEvent('container' + name, grid, e);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Sizes the grid's header and body elements
+     */
+    layout : function(initial) {
+        if (!this.mainBody) {
+            return; // not rendered
+        }
+
+        var grid       = this.grid,
+            gridEl     = grid.getGridEl(),
+            gridSize   = gridEl.getSize(true),
+            gridWidth  = gridSize.width,
+            gridHeight = gridSize.height,
+            scroller   = this.scroller,
+            scrollStyle, headerHeight, scrollHeight;
+        
+        if (gridWidth < 20 || gridHeight < 20) {
+            return;
+        }
+        
+        if (grid.autoHeight) {
+            scrollStyle = scroller.dom.style;
+            scrollStyle.overflow = 'visible';
+            
+            if (Ext.isWebKit) {
+                scrollStyle.position = 'static';
+            }
+        } else {
+            this.el.setSize(gridWidth, gridHeight);
+            
+            headerHeight = this.mainHd.getHeight();
+            scrollHeight = gridHeight - headerHeight;
+            
+            scroller.setSize(gridWidth, scrollHeight);
+            
+            if (this.innerHd) {
+                this.innerHd.style.width = (gridWidth) + "px";
+            }
+        }
+        
+        if (this.forceFit || (initial === true && this.autoFill)) {
+            if (this.lastViewWidth != gridWidth) {
+                this.fitColumns(false, false);
+                this.lastViewWidth = gridWidth;
+            }
+        } else {
+            this.autoExpand();
+            this.syncHeaderScroll();
+        }
+        
+        this.onLayout(gridWidth, scrollHeight);
+    },
+
+    // template functions for subclasses and plugins
+    // these functions include precalculated values
+    onLayout : function(vw, vh) {
+        // do nothing
+    },
+
+    onColumnWidthUpdated : function(col, w, tw) {
+        //template method
+    },
+
+    onAllColumnWidthsUpdated : function(ws, tw) {
+        //template method
+    },
+
+    onColumnHiddenUpdated : function(col, hidden, tw) {
+        // template method
+    },
+
+    updateColumnText : function(col, text) {
+        // template method
+    },
+
+    afterMove : function(colIndex) {
+        // template method
+    },
+
+    /* ----------------------------------- Core Specific -------------------------------------------*/
+    // private
+    init : function(grid) {
+        this.grid = grid;
+
+        this.initTemplates();
+        this.initData(grid.store, grid.colModel);
+        this.initUI(grid);
+    },
+
+    // private
+    getColumnId : function(index){
+        return this.cm.getColumnId(index);
+    },
+
+    // private
+    getOffsetWidth : function() {
+        return (this.cm.getTotalWidth() + this.getScrollOffset()) + 'px';
+    },
+
+    // private
+    getScrollOffset: function() {
+        return Ext.num(this.scrollOffset, Ext.getScrollBarWidth());
+    },
+
+    /**
+     * @private
+     * Renders the header row using the 'header' template. Does not inject the HTML into the DOM, just
+     * returns a string.
+     * @return {String} Rendered header row
+     */
+    renderHeaders : function() {
+        var colModel   = this.cm,
+            templates  = this.templates,
+            headerTpl  = templates.hcell,
+            properties = {},
+            colCount   = colModel.getColumnCount(),
+            last       = colCount - 1,
+            cells      = [],
+            i, cssCls;
+        
+        for (i = 0; i < colCount; i++) {
+            if (i == 0) {
+                cssCls = 'x-grid3-cell-first ';
+            } else {
+                cssCls = i == last ? 'x-grid3-cell-last ' : '';
+            }
+            
+            properties = {
+                id     : colModel.getColumnId(i),
+                value  : colModel.getColumnHeader(i) || '',
+                style  : this.getColumnStyle(i, true),
+                css    : cssCls,
+                tooltip: this.getColumnTooltip(i)
+            };
+            
+            if (colModel.config[i].align == 'right') {
+                properties.istyle = 'padding-right: 16px;';
+            } else {
+                delete properties.istyle;
+            }
+            
+            cells[i] = headerTpl.apply(properties);
+        }
+        
+        return templates.header.apply({
+            cells : cells.join(""),
+            tstyle: String.format("width: {0};", this.getTotalWidth())
+        });
+    },
+
+    /**
+     * @private
+     */
+    getColumnTooltip : function(i) {
+        var tooltip = this.cm.getColumnTooltip(i);
+        if (tooltip) {
+            if (Ext.QuickTips.isEnabled()) {
+                return 'ext:qtip="' + tooltip + '"';
+            } else {
+                return 'title="' + tooltip + '"';
+            }
+        }
+        
+        return '';
+    },
+
+    // private
+    beforeUpdate : function() {
+        this.grid.stopEditing(true);
+    },
+
+    /**
+     * @private
+     * Re-renders the headers and ensures they are sized correctly
+     */
+    updateHeaders : function() {
+        this.innerHd.firstChild.innerHTML = this.renderHeaders();
+        
+        this.updateHeaderWidth(false);
+    },
+    
+    /**
+     * @private
+     * Ensures that the header is sized to the total width available to it
+     * @param {Boolean} updateMain True to update the mainBody's width also (defaults to true)
+     */
+    updateHeaderWidth: function(updateMain) {
+        var innerHdChild = this.innerHd.firstChild,
+            totalWidth   = this.getTotalWidth();
+        
+        innerHdChild.style.width = this.getOffsetWidth();
+        innerHdChild.firstChild.style.width = totalWidth;
+        
+        if (updateMain !== false) {
+            this.mainBody.dom.style.width = totalWidth;
+        }
+    },
+
+    /**
+     * Focuses the specified row.
+     * @param {Number} row The row index
+     */
+    focusRow : function(row) {
+        this.focusCell(row, 0, false);
+    },
+
+    /**
+     * Focuses the specified cell.
+     * @param {Number} row The row index
+     * @param {Number} col The column index
+     */
+    focusCell : function(row, col, hscroll) {
+        this.syncFocusEl(this.ensureVisible(row, col, hscroll));
+        
+        var focusEl = this.focusEl;
+        
+        if (Ext.isGecko) {
+            focusEl.focus();
+        } else {
+            focusEl.focus.defer(1, focusEl);
+        }
+    },
+
+    /**
+     * @private
+     * Finds the Elements corresponding to the given row and column indexes
+     */
+    resolveCell : function(row, col, hscroll) {
+        if (!Ext.isNumber(row)) {
+            row = row.rowIndex;
+        }
+        
+        if (!this.ds) {
+            return null;
+        }
+        
+        if (row < 0 || row >= this.ds.getCount()) {
+            return null;
+        }
+        col = (col !== undefined ? col : 0);
+
+        var rowEl    = this.getRow(row),
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            cellEl;
+            
+        if (!(hscroll === false && col === 0)) {
+            while (col < colCount && colModel.isHidden(col)) {
+                col++;
+            }
+            
+            cellEl = this.getCell(row, col);
+        }
+
+        return {row: rowEl, cell: cellEl};
+    },
+
+    /**
+     * @private
+     * Returns the XY co-ordinates of a given row/cell resolution (see {@link #resolveCell})
+     * @return {Array} X and Y coords
+     */
+    getResolvedXY : function(resolved) {
+        if (!resolved) {
+            return null;
+        }
+        
+        var cell = resolved.cell,
+            row  = resolved.row;
+        
+        if (cell) {
+            return Ext.fly(cell).getXY();
+        } else {
+            return [this.el.getX(), Ext.fly(row).getY()];
+        }
+    },
+
+    /**
+     * @private
+     * Moves the focus element to the x and y co-ordinates of the given row and column
+     */
+    syncFocusEl : function(row, col, hscroll) {
+        var xy = row;
+        
+        if (!Ext.isArray(xy)) {
+            row = Math.min(row, Math.max(0, this.getRows().length-1));
+            
+            if (isNaN(row)) {
+                return;
+            }
+            
+            xy = this.getResolvedXY(this.resolveCell(row, col, hscroll));
+        }
+        
+        this.focusEl.setXY(xy || this.scroller.getXY());
+    },
+
+    /**
+     * @private
+     */
+    ensureVisible : function(row, col, hscroll) {
+        var resolved = this.resolveCell(row, col, hscroll);
+        
+        if (!resolved || !resolved.row) {
+            return null;
+        }
+
+        var rowEl  = resolved.row,
+            cellEl = resolved.cell,
+            c = this.scroller.dom,
+            p = rowEl,
+            ctop = 0,
+            stop = this.el.dom;
+
+        while (p && p != stop) {
+            ctop += p.offsetTop;
+            p = p.offsetParent;
+        }
+
+        ctop -= this.mainHd.dom.offsetHeight;
+        stop = parseInt(c.scrollTop, 10);
+
+        var cbot = ctop + rowEl.offsetHeight,
+            ch = c.clientHeight,
+            sbot = stop + ch;
+
+
+        if (ctop < stop) {
+          c.scrollTop = ctop;
+        } else if(cbot > sbot) {
+            c.scrollTop = cbot-ch;
+        }
+
+        if (hscroll !== false) {
+            var cleft  = parseInt(cellEl.offsetLeft, 10),
+                cright = cleft + cellEl.offsetWidth,
+                sleft  = parseInt(c.scrollLeft, 10),
+                sright = sleft + c.clientWidth;
+                
+            if (cleft < sleft) {
+                c.scrollLeft = cleft;
+            } else if(cright > sright) {
+                c.scrollLeft = cright-c.clientWidth;
+            }
+        }
+        
+        return this.getResolvedXY(resolved);
+    },
+
+    // private
+    insertRows : function(dm, firstRow, lastRow, isUpdate) {
+        var last = dm.getCount() - 1;
+        if( !isUpdate && firstRow === 0 && lastRow >= last) {
+            this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+                this.refresh();
+            this.fireEvent('rowsinserted', this, firstRow, lastRow);
+        } else {
+            if (!isUpdate) {
+                this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+            }
+            var html = this.renderRows(firstRow, lastRow),
+                before = this.getRow(firstRow);
+            if (before) {
+                if(firstRow === 0){
+                    Ext.fly(this.getRow(0)).removeClass(this.firstRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeBegin', before, html);
+            } else {
+                var r = this.getRow(last - 1);
+                if(r){
+                    Ext.fly(r).removeClass(this.lastRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html);
+            }
+            if (!isUpdate) {
+                this.processRows(firstRow);
+                this.fireEvent('rowsinserted', this, firstRow, lastRow);
+            } else if (firstRow === 0 || firstRow >= last) {
+                //ensure first/last row is kept after an update.
+                Ext.fly(this.getRow(firstRow)).addClass(firstRow === 0 ? this.firstRowCls : this.lastRowCls);
+            }
+        }
+        this.syncFocusEl(firstRow);
+    },
+
+    /**
+     * @private
+     * DEPRECATED - this doesn't appear to be called anywhere in the library, remove in 4.0. 
+     */
+    deleteRows : function(dm, firstRow, lastRow) {
+        if (dm.getRowCount() < 1) {
+            this.refresh();
+        } else {
+            this.fireEvent('beforerowsdeleted', this, firstRow, lastRow);
+
+            this.removeRows(firstRow, lastRow);
+
+            this.processRows(firstRow);
+            this.fireEvent('rowsdeleted', this, firstRow, lastRow);
+        }
+    },
+
+    /**
+     * @private
+     * Builds a CSS string for the given column index
+     * @param {Number} colIndex The column index
+     * @param {Boolean} isHeader True if getting the style for the column's header
+     * @return {String} The CSS string
+     */
+    getColumnStyle : function(colIndex, isHeader) {
+        var colModel  = this.cm,
+            colConfig = colModel.config,
+            style     = isHeader ? '' : colConfig[colIndex].css || '',
+            align     = colConfig[colIndex].align;
+        
+        style += String.format("width: {0};", this.getColumnWidth(colIndex));
+        
+        if (colModel.isHidden(colIndex)) {
+            style += 'display: none; ';
+        }
+        
+        if (align) {
+            style += String.format("text-align: {0};", align);
+        }
+        
+        return style;
+    },
+
+    /**
+     * @private
+     * Returns the width of a given column minus its border width
+     * @return {Number} The column index
+     * @return {String|Number} The width in pixels
+     */
+    getColumnWidth : function(column) {
+        var columnWidth = this.cm.getColumnWidth(column),
+            borderWidth = this.borderWidth;
+        
+        if (Ext.isNumber(columnWidth)) {
+            if (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2)) {
+                return columnWidth + "px";
+            } else {
+                return Math.max(columnWidth - borderWidth, 0) + "px";
+            }
+        } else {
+            return columnWidth;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the total width of all visible columns
+     * @return {String} 
+     */
+    getTotalWidth : function() {
+        return this.cm.getTotalWidth() + 'px';
+    },
+
+    /**
+     * @private
+     * Resizes each column to fit the available grid width.
+     * TODO: The second argument isn't even used, remove it in 4.0
+     * @param {Boolean} preventRefresh True to prevent resizing of each row to the new column sizes (defaults to false)
+     * @param {null} onlyExpand NOT USED, will be removed in 4.0
+     * @param {Number} omitColumn The index of a column to leave at its current width. Defaults to undefined
+     * @return {Boolean} True if the operation succeeded, false if not or undefined if the grid view is not yet initialized
+     */
+    fitColumns : function(preventRefresh, onlyExpand, omitColumn) {
+        var grid          = this.grid,
+            colModel      = this.cm,
+            totalColWidth = colModel.getTotalWidth(false),
+            gridWidth     = this.getGridInnerWidth(),
+            extraWidth    = gridWidth - totalColWidth,
+            columns       = [],
+            extraCol      = 0,
+            width         = 0,
+            colWidth, fraction, i;
+        
+        // not initialized, so don't screw up the default widths
+        if (gridWidth < 20 || extraWidth === 0) {
+            return false;
+        }
+        
+        var visibleColCount = colModel.getColumnCount(true),
+            totalColCount   = colModel.getColumnCount(false),
+            adjCount        = visibleColCount - (Ext.isNumber(omitColumn) ? 1 : 0);
+        
+        if (adjCount === 0) {
+            adjCount = 1;
+            omitColumn = undefined;
+        }
+        
+        //FIXME: the algorithm used here is odd and potentially confusing. Includes this for loop and the while after it.
+        for (i = 0; i < totalColCount; i++) {
+            if (!colModel.isFixed(i) && i !== omitColumn) {
+                colWidth = colModel.getColumnWidth(i);
+                columns.push(i, colWidth);
+                
+                if (!colModel.isHidden(i)) {
+                    extraCol = i;
+                    width += colWidth;
+                }
+            }
+        }
+        
+        fraction = (gridWidth - colModel.getTotalWidth()) / width;
+        
+        while (columns.length) {
+            colWidth = columns.pop();
+            i        = columns.pop();
+            
+            colModel.setColumnWidth(i, Math.max(grid.minColumnWidth, Math.floor(colWidth + colWidth * fraction)), true);
+        }
+        
+        //this has been changed above so remeasure now
+        totalColWidth = colModel.getTotalWidth(false);
+        
+        if (totalColWidth > gridWidth) {
+            var adjustCol = (adjCount == visibleColCount) ? extraCol : omitColumn,
+                newWidth  = Math.max(1, colModel.getColumnWidth(adjustCol) - (totalColWidth - gridWidth));
+            
+            colModel.setColumnWidth(adjustCol, newWidth, true);
+        }
+        
+        if (preventRefresh !== true) {
+            this.updateAllColumnWidths();
+        }
+        
+        return true;
+    },
+
+    /**
+     * @private
+     * Resizes the configured autoExpandColumn to take the available width after the other columns have 
+     * been accounted for
+     * @param {Boolean} preventUpdate True to prevent the resizing of all rows (defaults to false)
+     */
+    autoExpand : function(preventUpdate) {
+        var grid             = this.grid,
+            colModel         = this.cm,
+            gridWidth        = this.getGridInnerWidth(),
+            totalColumnWidth = colModel.getTotalWidth(false),
+            autoExpandColumn = grid.autoExpandColumn;
+        
+        if (!this.userResized && autoExpandColumn) {
+            if (gridWidth != totalColumnWidth) {
+                //if we are not already using all available width, resize the autoExpandColumn
+                var colIndex     = colModel.getIndexById(autoExpandColumn),
+                    currentWidth = colModel.getColumnWidth(colIndex),
+                    desiredWidth = gridWidth - totalColumnWidth + currentWidth,
+                    newWidth     = Math.min(Math.max(desiredWidth, grid.autoExpandMin), grid.autoExpandMax);
+                
+                if (currentWidth != newWidth) {
+                    colModel.setColumnWidth(colIndex, newWidth, true);
+                    
+                    if (preventUpdate !== true) {
+                        this.updateColumnWidth(colIndex, newWidth);
+                    }
+                }
+            }
+        }
+    },
+    
+    /**
+     * Returns the total internal width available to the grid, taking the scrollbar into account
+     * @return {Number} The total width
+     */
+    getGridInnerWidth: function() {
+        return this.grid.getGridEl().getWidth(true) - this.getScrollOffset();
+    },
+
+    /**
+     * @private
+     * Returns an array of column configurations - one for each column
+     * @return {Array} Array of column config objects. This includes the column name, renderer, id style and renderer
+     */
+    getColumnData : function() {
+        var columns  = [],
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            fields   = this.ds.fields,
+            i, name;
+        
+        for (i = 0; i < colCount; i++) {
+            name = colModel.getDataIndex(i);
+            
+            columns[i] = {
+                name    : Ext.isDefined(name) ? name : (fields.get(i) ? fields.get(i).name : undefined),
+                renderer: colModel.getRenderer(i),
+                scope   : colModel.getRendererScope(i),
+                id      : colModel.getColumnId(i),
+                style   : this.getColumnStyle(i)
+            };
+        }
+        
+        return columns;
+    },
+
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid     = this.grid,
+            store    = grid.store,
+            stripe   = grid.stripeRows,
+            colModel = grid.colModel,
+            colCount = colModel.getColumnCount(),
+            rowCount = store.getCount(),
+            records;
+        
+        if (rowCount < 1) {
+            return '';
+        }
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        records  = store.getRange(startRow, endRow);
+        
+        return this.doRender(this.getColumnData(), records, store, startRow, colCount, stripe);
+    },
+
+    // private
+    renderBody : function(){
+        var markup = this.renderRows() || '&#160;';
+        return this.templates.body.apply({rows: markup});
+    },
+
+    /**
+     * @private
+     * Refreshes a row by re-rendering it. Fires the rowupdated event when done
+     */
+    refreshRow: function(record) {
+        var store     = this.ds,
+            colCount  = this.cm.getColumnCount(),
+            columns   = this.getColumnData(),
+            last      = colCount - 1,
+            cls       = ['x-grid3-row'],
+            rowParams = {
+                tstyle: String.format("width: {0};", this.getTotalWidth())
+            },
+            colBuffer = [],
+            cellTpl   = this.templates.cell,
+            rowIndex, row, column, meta, css, i;
+        
+        if (Ext.isNumber(record)) {
+            rowIndex = record;
+            record   = store.getAt(rowIndex);
+        } else {
+            rowIndex = store.indexOf(record);
+        }
+        
+        //the record could not be found
+        if (!record || rowIndex < 0) {
+            return;
+        }
+        
+        //builds each column in this row
+        for (i = 0; i < colCount; i++) {
+            column = columns[i];
+            
+            if (i == 0) {
+                css = 'x-grid3-cell-first';
+            } else {
+                css = (i == last) ? 'x-grid3-cell-last ' : '';
+            }
+            
+            meta = {
+                id      : column.id,
+                style   : column.style,
+                css     : css,
+                attr    : "",
+                cellAttr: ""
+            };
+            // Need to set this after, because we pass meta to the renderer
+            meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+            
+            if (Ext.isEmpty(meta.value)) {
+                meta.value = '&#160;';
+            }
+            
+            if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                meta.css += ' x-grid3-dirty-cell';
+            }
+            
+            colBuffer[i] = cellTpl.apply(meta);
+        }
+        
+        row = this.getRow(rowIndex);
+        row.className = '';
+        
+        if (this.grid.stripeRows && ((rowIndex + 1) % 2 === 0)) {
+            cls.push('x-grid3-row-alt');
+        }
+        
+        if (this.getRowClass) {
+            rowParams.cols = colCount;
+            cls.push(this.getRowClass(record, rowIndex, rowParams, store));
+        }
+        
+        this.fly(row).addClass(cls).setStyle(rowParams.tstyle);
+        rowParams.cells = colBuffer.join("");
+        row.innerHTML = this.templates.rowInner.apply(rowParams);
+        
+        this.fireEvent('rowupdated', this, rowIndex, record);
+    },
+
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getTotalWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+
+    /**
+     * @private
+     * Displays the configured emptyText if there are currently no rows to display
+     */
+    applyEmptyText : function() {
+        if (this.emptyText && !this.hasRows()) {
+            this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
+        }
+    },
+
+    /**
+     * @private
+     * Adds sorting classes to the column headers based on the bound store's sortInfo. Fires the 'sortchange' event
+     * if the sorting has changed since this function was last run.
+     */
+    updateHeaderSortState : function() {
+        var state = this.ds.getSortState();
+        if (!state) {
+            return;
+        }
+
+        if (!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)) {
+            this.grid.fireEvent('sortchange', this.grid, state);
+        }
+
+        this.sortState = state;
+
+        var sortColumn = this.cm.findColumnIndex(state.field);
+        if (sortColumn != -1) {
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    /**
+     * @private
+     * Removes any sorting indicator classes from the column headers
+     */
+    clearHeaderSortState : function() {
+        if (!this.sortState) {
+            return;
+        }
+        this.grid.fireEvent('sortchange', this.grid, null);
+        this.mainHd.select('td').removeClass(this.sortClasses);
+        delete this.sortState;
+    },
+
+    /**
+     * @private
+     * Destroys all objects associated with the GridView
+     */
+    destroy : function() {
+        var me              = this,
+            grid            = me.grid,
+            gridEl          = grid.getGridEl(),
+            dragZone        = me.dragZone,
+            splitZone       = me.splitZone,
+            columnDrag      = me.columnDrag,
+            columnDrop      = me.columnDrop,
+            scrollToTopTask = me.scrollToTopTask,
+            columnDragData,
+            columnDragProxy;
+        
+        if (scrollToTopTask && scrollToTopTask.cancel) {
+            scrollToTopTask.cancel();
+        }
+        
+        Ext.destroyMembers(me, 'colMenu', 'hmenu');
+
+        me.initData(null, null);
+        me.purgeListeners();
+        
+        Ext.fly(me.innerHd).un("click", me.handleHdDown, me);
+
+        if (grid.enableColumnMove) {
+            columnDragData = columnDrag.dragData;
+            columnDragProxy = columnDrag.proxy;
+            Ext.destroy(
+                columnDrag.el,
+                columnDragProxy.ghost,
+                columnDragProxy.el,
+                columnDrop.el,
+                columnDrop.proxyTop,
+                columnDrop.proxyBottom,
+                columnDragData.ddel,
+                columnDragData.header
+            );
+            
+            if (columnDragProxy.anim) {
+                Ext.destroy(columnDragProxy.anim);
+            }
+            
+            delete columnDragProxy.ghost;
+            delete columnDragData.ddel;
+            delete columnDragData.header;
+            columnDrag.destroy();
+            
+            delete Ext.dd.DDM.locationCache[columnDrag.id];
+            delete columnDrag._domRef;
+
+            delete columnDrop.proxyTop;
+            delete columnDrop.proxyBottom;
+            columnDrop.destroy();
+            delete Ext.dd.DDM.locationCache["gridHeader" + gridEl.id];
+            delete columnDrop._domRef;
+            delete Ext.dd.DDM.ids[columnDrop.ddGroup];
+        }
+
+        if (splitZone) { // enableColumnResize
+            splitZone.destroy();
+            delete splitZone._domRef;
+            delete Ext.dd.DDM.ids["gridSplitters" + gridEl.id];
+        }
+
+        Ext.fly(me.innerHd).removeAllListeners();
+        Ext.removeNode(me.innerHd);
+        delete me.innerHd;
+
+        Ext.destroy(
+            me.el,
+            me.mainWrap,
+            me.mainHd,
+            me.scroller,
+            me.mainBody,
+            me.focusEl,
+            me.resizeMarker,
+            me.resizeProxy,
+            me.activeHdBtn,
+            me._flyweight,
+            dragZone,
+            splitZone
+        );
+
+        delete grid.container;
+
+        if (dragZone) {
+            dragZone.destroy();
+        }
+
+        Ext.dd.DDM.currentTarget = null;
+        delete Ext.dd.DDM.locationCache[gridEl.id];
+
+        Ext.EventManager.removeResizeListener(me.onWindowResize, me);
+    },
+
+    // private
+    onDenyColumnHide : function() {
+
+    },
+
+    // private
+    render : function() {
+        if (this.autoFill) {
+            var ct = this.grid.ownerCt;
+            
+            if (ct && ct.getLayout()) {
+                ct.on('afterlayout', function() {
+                    this.fitColumns(true, true);
+                    this.updateHeaders();
+                    this.updateHeaderSortState();
+                }, this, {single: true});
+            }
+        } else if (this.forceFit) {
+            this.fitColumns(true, false);
+        } else if (this.grid.autoExpandColumn) {
+            this.autoExpand(true);
+        }
+        
+        this.grid.getGridEl().dom.innerHTML = this.renderUI();
+        
+        this.afterRenderUI();
+    },
+
+    /* --------------------------------- Model Events and Handlers --------------------------------*/
+    
+    /**
+     * @private
+     * Binds a new Store and ColumnModel to this GridView. Removes any listeners from the old objects (if present)
+     * and adds listeners to the new ones
+     * @param {Ext.data.Store} newStore The new Store instance
+     * @param {Ext.grid.ColumnModel} newColModel The new ColumnModel instance
+     */
+    initData : function(newStore, newColModel) {
+        var me = this;
+        
+        if (me.ds) {
+            var oldStore = me.ds;
+            
+            oldStore.un('add', me.onAdd, me);
+            oldStore.un('load', me.onLoad, me);
+            oldStore.un('clear', me.onClear, me);
+            oldStore.un('remove', me.onRemove, me);
+            oldStore.un('update', me.onUpdate, me);
+            oldStore.un('datachanged', me.onDataChange, me);
+            
+            if (oldStore !== newStore && oldStore.autoDestroy) {
+                oldStore.destroy();
+            }
+        }
+        
+        if (newStore) {
+            newStore.on({
+                scope      : me,
+                load       : me.onLoad,
+                add        : me.onAdd,
+                remove     : me.onRemove,
+                update     : me.onUpdate,
+                clear      : me.onClear,
+                datachanged: me.onDataChange
+            });
+        }
+        
+        if (me.cm) {
+            var oldColModel = me.cm;
+            
+            oldColModel.un('configchange', me.onColConfigChange, me);
+            oldColModel.un('widthchange',  me.onColWidthChange, me);
+            oldColModel.un('headerchange', me.onHeaderChange, me);
+            oldColModel.un('hiddenchange', me.onHiddenChange, me);
+            oldColModel.un('columnmoved',  me.onColumnMove, me);
+        }
+        
+        if (newColModel) {
+            delete me.lastViewWidth;
+            
+            newColModel.on({
+                scope       : me,
+                configchange: me.onColConfigChange,
+                widthchange : me.onColWidthChange,
+                headerchange: me.onHeaderChange,
+                hiddenchange: me.onHiddenChange,
+                columnmoved : me.onColumnMove
+            });
+        }
+        
+        me.ds = newStore;
+        me.cm = newColModel;
+    },
+
+    // private
+    onDataChange : function(){
+        this.refresh(true);
+        this.updateHeaderSortState();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onClear : function() {
+        this.refresh();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onUpdate : function(store, record) {
+        this.refreshRow(record);
+    },
+
+    // private
+    onAdd : function(store, records, index) {
+        this.insertRows(store, index, index + (records.length-1));
+    },
+
+    // private
+    onRemove : function(store, record, index, isUpdate) {
+        if (isUpdate !== true) {
+            this.fireEvent('beforerowremoved', this, index, record);
+        }
+        
+        this.removeRow(index);
+        
+        if (isUpdate !== true) {
+            this.processRows(index);
+            this.applyEmptyText();
+            this.fireEvent('rowremoved', this, index, record);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a store is loaded, scrolls to the top row
+     */
+    onLoad : function() {
+        if (Ext.isGecko) {
+            if (!this.scrollToTopTask) {
+                this.scrollToTopTask = new Ext.util.DelayedTask(this.scrollToTop, this);
+            }
+            this.scrollToTopTask.delay(1);
+        } else {
+            this.scrollToTop();
+        }
+    },
+
+    // private
+    onColWidthChange : function(cm, col, width) {
+        this.updateColumnWidth(col, width);
+    },
+
+    // private
+    onHeaderChange : function(cm, col, text) {
+        this.updateHeaders();
+    },
+
+    // private
+    onHiddenChange : function(cm, col, hidden) {
+        this.updateColumnHidden(col, hidden);
+    },
+
+    // private
+    onColumnMove : function(cm, oldIndex, newIndex) {
+        this.indexMap = null;
+        this.refresh(true);
+        this.restoreScroll(this.getScrollState());
+        
+        this.afterMove(newIndex);
+        this.grid.fireEvent('columnmove', oldIndex, newIndex);
+    },
+
+    // private
+    onColConfigChange : function() {
+        delete this.lastViewWidth;
+        this.indexMap = null;
+        this.refresh(true);
+    },
+
+    /* -------------------- UI Events and Handlers ------------------------------ */
+    // private
+    initUI : function(grid) {
+        grid.on('headerclick', this.onHeaderClick, this);
+    },
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    // private
+    onHeaderClick : function(g, index) {
+        if (this.headersDisabled || !this.cm.isSortable(index)) {
+            return;
+        }
+        g.stopEditing(true);
+        g.store.sort(this.cm.getDataIndex(index));
+    },
+
+    /**
+     * @private
+     * Adds the hover class to a row when hovered over
+     */
+    onRowOver : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false) {
+            this.addRowClass(row, this.rowOverCls);
+        }
+    },
+
+    /**
+     * @private
+     * Removes the hover class from a row on mouseout
+     */
+    onRowOut : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false && !e.within(this.getRow(row), true)) {
+            this.removeRowClass(row, this.rowOverCls);
+        }
+    },
+
+    // private
+    onRowSelect : function(row) {
+        this.addRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onRowDeselect : function(row) {
+        this.removeRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onCellSelect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).addClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    onCellDeselect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).removeClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    handleWheel : function(e) {
+        e.stopPropagation();
+    },
+
+    /**
+     * @private
+     * Called by the SplitDragZone when a drag has been completed. Resizes the columns
+     */
+    onColumnSplitterMoved : function(cellIndex, width) {
+        this.userResized = true;
+        this.grid.colModel.setColumnWidth(cellIndex, width, true);
+
+        if (this.forceFit) {
+            this.fitColumns(true, false, cellIndex);
+            this.updateAllColumnWidths();
+        } else {
+            this.updateColumnWidth(cellIndex, width);
+            this.syncHeaderScroll();
+        }
+
+        this.grid.fireEvent('columnresize', cellIndex, width);
+    },
+
+    /**
+     * @private
+     * Click handler for the shared column dropdown menu, called on beforeshow. Builds the menu
+     * which displays the list of columns for the user to show or hide.
+     */
+    beforeColMenuShow : function() {
+        var colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            colMenu  = this.colMenu,
+            i;
+
+        colMenu.removeAll();
+
+        for (i = 0; i < colCount; i++) {
+            if (colModel.config[i].hideable !== false) {
+                colMenu.add(new Ext.menu.CheckItem({
+                    text       : colModel.getColumnHeader(i),
+                    itemId     : 'col-' + colModel.getColumnId(i),
+                    checked    : !colModel.isHidden(i),
+                    disabled   : colModel.config[i].hideable === false,
+                    hideOnClick: false
+                }));
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Attached as the 'itemclick' handler to the header menu and the column show/hide submenu (if available).
+     * Performs sorting if the sorter buttons were clicked, otherwise hides/shows the column that was clicked.
+     */
+    handleHdMenuClick : function(item) {
+        var store     = this.ds,
+            dataIndex = this.cm.getDataIndex(this.hdCtxIndex);
+
+        switch (item.getItemId()) {
+            case 'asc':
+                store.sort(dataIndex, 'ASC');
+                break;
+            case 'desc':
+                store.sort(dataIndex, 'DESC');
+                break;
+            default:
+                this.handleHdMenuClickDefault(item);
+        }
+        return true;
+    },
+    
+    /**
+     * Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides
+     * the column hide/show functionality based on the check state of the menu item. A different implementation can be provided
+     * if needed.
+     * @param {Ext.menu.BaseItem} item The menu item that was clicked
+     */
+    handleHdMenuClickDefault: function(item) {
+        var colModel = this.cm,
+            itemId   = item.getItemId(),
+            index    = colModel.getIndexById(itemId.substr(4));
+
+        if (index != -1) {
+            if (item.checked && colModel.getColumnsBy(this.isHideableColumn, this).length <= 1) {
+                this.onDenyColumnHide();
+                return;
+            }
+            colModel.setHidden(index, item.checked);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a header cell is clicked - shows the menu if the click happened over a trigger button
+     */
+    handleHdDown : function(e, target) {
+        if (Ext.fly(target).hasClass('x-grid3-hd-btn')) {
+            e.stopEvent();
+            
+            var colModel  = this.cm,
+                header    = this.findHeaderCell(target),
+                index     = this.getCellIndex(header),
+                sortable  = colModel.isSortable(index),
+                menu      = this.hmenu,
+                menuItems = menu.items,
+                menuCls   = this.headerMenuOpenCls;
+            
+            this.hdCtxIndex = index;
+            
+            Ext.fly(header).addClass(menuCls);
+            menuItems.get('asc').setDisabled(!sortable);
+            menuItems.get('desc').setDisabled(!sortable);
+            
+            menu.on('hide', function() {
+                Ext.fly(header).removeClass(menuCls);
+            }, this, {single:true});
+            
+            menu.show(target, 'tl-bl?');
+        }
+    },
+
+    /**
+     * @private
+     * Attached to the headers' mousemove event. This figures out the CSS cursor to use based on where the mouse is currently
+     * pointed. If the mouse is currently hovered over the extreme left or extreme right of any header cell and the cell next 
+     * to it is resizable it is given the resize cursor, otherwise the cursor is set to an empty string.
+     */
+    handleHdMove : function(e) {
+        var header = this.findHeaderCell(this.activeHdRef);
+        
+        if (header && !this.headersDisabled) {
+            var handleWidth  = this.splitHandleWidth || 5,
+                activeRegion = this.activeHdRegion,
+                headerStyle  = header.style,
+                colModel     = this.cm,
+                cursor       = '',
+                pageX        = e.getPageX();
+                
+            if (this.grid.enableColumnResize !== false) {
+                var activeHeaderIndex = this.activeHdIndex,
+                    previousVisible   = this.getPreviousVisible(activeHeaderIndex),
+                    currentResizable  = colModel.isResizable(activeHeaderIndex),
+                    previousResizable = previousVisible && colModel.isResizable(previousVisible),
+                    inLeftResizer     = pageX - activeRegion.left <= handleWidth,
+                    inRightResizer    = activeRegion.right - pageX <= (!this.activeHdBtn ? handleWidth : 2);
+                
+                if (inLeftResizer && previousResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'e-resize' : 'col-resize'; // col-resize not always supported
+                } else if (inRightResizer && currentResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'w-resize' : 'col-resize';
+                }
+            }
+            
+            headerStyle.cursor = cursor;
+        }
+    },
+    
+    /**
+     * @private
+     * Returns the index of the nearest currently visible header to the left of the given index.
+     * @param {Number} index The header index
+     * @return {Number/undefined} The index of the nearest visible header
+     */
+    getPreviousVisible: function(index) {
+        while (index > 0) {
+            if (!this.cm.isHidden(index - 1)) {
+                return index;
+            }
+            index--;
+        }
+        return undefined;
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseover event - adds the over class to the header cell if the menu is not disabled
+     * for that cell
+     */
+    handleHdOver : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && !this.headersDisabled) {
+            var fly = this.fly(header);
+            
+            this.activeHdRef = target;
+            this.activeHdIndex = this.getCellIndex(header);
+            this.activeHdRegion = fly.getRegion();
+            
+            if (!this.isMenuDisabled(this.activeHdIndex, fly)) {
+                fly.addClass('x-grid3-hd-over');
+                this.activeHdBtn = fly.child('.x-grid3-hd-btn');
+                
+                if (this.activeHdBtn) {
+                    this.activeHdBtn.dom.style.height = (header.firstChild.offsetHeight - 1) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseout event. Removes the hover class from the header cell
+     */
+    handleHdOut : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && (!Ext.isIE || !e.within(header, true))) {
+            this.activeHdRef = null;
+            this.fly(header).removeClass('x-grid3-hd-over');
+            header.style.cursor = '';
+        }
+    },
+    
+    /**
+     * @private
+     * Used by {@link #handleHdOver} to determine whether or not to show the header menu class on cell hover
+     * @param {Number} cellIndex The header cell index
+     * @param {Ext.Element} el The cell element currently being hovered over
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return this.cm.isMenuDisabled(cellIndex);
+    },
+
+    /**
+     * @private
+     * Returns true if there are any rows rendered into the GridView
+     * @return {Boolean} True if any rows have been rendered
+     */
+    hasRows : function() {
+        var fc = this.mainBody.dom.firstChild;
+        return fc && fc.nodeType == 1 && fc.className != 'x-grid-empty';
+    },
+    
+    /**
+     * @private
+     */
+    isHideableColumn : function(c) {
+        return !c.hidden;
+    },
+
+    /**
+     * @private
+     * DEPRECATED - will be removed in Ext JS 5.0
+     */
+    bind : function(d, c) {
+        this.initData(d, c);
+    }
+});
+
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridView.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+
+    constructor: function(grid, hd){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.marker = this.view.resizeMarker;
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,
+            'gridSplitters' + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.scroll = false;
+        this.hw = this.view.splitHandleWidth || 5;
+    },
+
+    b4StartDrag : function(x, y){
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var h = this.view.mainWrap.getHeight();
+        this.marker.setHeight(h);
+        this.marker.show();
+        this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);
+        this.proxy.setHeight(h);
+        var w = this.cm.getColumnWidth(this.cellIndex),
+            minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+    allowHeaderDrag : function(e){
+        return true;
+    },
+
+    handleMouseDown : function(e){
+        var t = this.view.findHeaderCell(e.getTarget());
+        if(t && this.allowHeaderDrag(e)){
+            var xy = this.view.fly(t).getXY(), 
+                x = xy[0],
+                exy = e.getXY(), 
+                ex = exy[0],
+                w = t.offsetWidth, 
+                adjust = false;
+                
+            if((ex - x) <= this.hw){
+                adjust = -1;
+            }else if((x+w) - ex <= this.hw){
+                adjust = 0;
+            }
+            if(adjust !== false){
+                this.cm = this.grid.colModel;
+                var ci = this.view.getCellIndex(t);
+                if(adjust == -1){
+                  if (ci + adjust < 0) {
+                    return;
+                  }
+                    while(this.cm.isHidden(ci+adjust)){
+                        --adjust;
+                        if(ci+adjust < 0){
+                            return;
+                        }
+                    }
+                }
+                this.cellIndex = ci+adjust;
+                this.split = t.dom;
+                if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                    Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+                }
+            }else if(this.view.columnDrag){
+                this.view.columnDrag.callHandleMouseDown(e);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.marker.hide();
+        var v = this.view,
+            endX = Math.max(this.minX, e.getPageX()),
+            diff = endX - this.startPos,
+            disabled = this.dragHeadersDisabled;
+            
+        v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
+/**
+ * @class Ext.grid.PivotGridView
+ * @extends Ext.grid.GridView
+ * Specialised GridView for rendering Pivot Grid components. Config can be passed to the PivotGridView via the PivotGrid constructor's
+ * viewConfig option:
+<pre><code>
+new Ext.grid.PivotGrid({
+    viewConfig: {
+        title: 'My Pivot Grid',
+        getCellCls: function(value) {
+            return value > 10 'red' : 'green';
+        }
+    }
+});
+</code></pre>
+ * <p>Currently {@link #title} and {@link #getCellCls} are the only configuration options accepted by PivotGridView. All other 
+ * interaction is performed via the {@link Ext.grid.PivotGrid PivotGrid} class.</p>
+ */
+Ext.grid.PivotGridView = Ext.extend(Ext.grid.GridView, {
+    
+    /**
+     * The CSS class added to all group header cells. Defaults to 'grid-hd-group-cell'
+     * @property colHeaderCellCls
+     * @type String
+     */
+    colHeaderCellCls: 'grid-hd-group-cell',
+    
+    /**
+     * @cfg {String} title Optional title to be placed in the top left corner of the PivotGrid. Defaults to an empty string.
+     */
+    title: '',
+    
+    /**
+     * @cfg {Function} getCellCls Optional function which should return a CSS class name for each cell value. This is useful when
+     * color coding cells based on their value. Defaults to undefined.
+     */
+    
+    /**
+     * Returns the headers to be rendered at the top of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of columns it groups (column in this case refers to normal grid columns). In the example below we have 5 city groups, which are
+     * each part of a continent supergroup. The colspan for each city group refers to the number of normal grid columns that group spans,
+     * so in this case the grid would be expected to have a total of 12 columns:
+<pre><code>
+[
+    {
+        items: [
+            {header: 'England',   colspan: 5},
+            {header: 'USA',       colspan: 3}
+        ]
+    },
+    {
+        items: [
+            {header: 'London',    colspan: 2},
+            {header: 'Cambridge', colspan: 3},
+            {header: 'Palo Alto', colspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     */
+    getColumnHeaders: function() {
+        return this.grid.topAxis.buildHeaders();;
+    },
+    
+    /**
+     * Returns the headers to be rendered on the left of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of rows it groups. In the example below we have 5 city groups, which are each part of a continent supergroup. The rowspan for each 
+     * city group refers to the number of normal grid columns that group spans, so in this case the grid would be expected to have a 
+     * total of 12 rows:
+<pre><code>
+[
+    {
+        width: 90,
+        items: [
+            {header: 'England',   rowspan: 5},
+            {header: 'USA',       rowspan: 3}
+        ]
+    },
+    {
+        width: 50,
+        items: [
+            {header: 'London',    rowspan: 2},
+            {header: 'Cambridge', rowspan: 3},
+            {header: 'Palo Alto', rowspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     * Each group may specify the width it should be rendered with.
+     * @return {Array} The row groups
+     */
+    getRowHeaders: function() {
+        return this.grid.leftAxis.buildHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid          = this.grid,
+            rows          = grid.extractData(),
+            rowCount      = rows.length,
+            templates     = this.templates,
+            renderer      = grid.renderer,
+            hasRenderer   = typeof renderer == 'function',
+            getCellCls    = this.getCellCls,
+            hasGetCellCls = typeof getCellCls == 'function',
+            cellTemplate  = templates.cell,
+            rowTemplate   = templates.row,
+            rowBuffer     = [],
+            meta          = {},
+            tstyle        = 'width:' + this.getGridInnerWidth() + 'px;',
+            colBuffer, colCount, column, i, row;
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            colCount  = row.length;
+            colBuffer = [];
+            
+            //build up each column's HTML
+            for (var j = 0; j < colCount; j++) {
+                
+                meta.id    = i + '-' + j;
+                meta.css   = j === 0 ? 'x-grid3-cell-first ' : (j == (colCount - 1) ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.value = row[j];
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+                
+                if (hasRenderer) {
+                    meta.value = renderer(meta.value);
+                }
+                
+                if (hasGetCellCls) {
+                    meta.css += getCellCls(meta.value) + ' ';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+            
+            rowBuffer[rowBuffer.length] = rowTemplate.apply({
+                tstyle: tstyle,
+                cols  : colCount,
+                cells : colBuffer.join(""),
+                alt   : ''
+            });
+        }
+        
+        return rowBuffer.join("");
+    },
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3 x-pivotgrid" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-title"><span>{title}</span></div>',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}"></div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-row-headers"></div>',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * @private
+     * Adds a gcell template to the internal templates object. This is used to render the headers in a multi-level column header.
+     */
+    initTemplates: function() {
+        Ext.grid.PivotGridView.superclass.initTemplates.apply(this, arguments);
+        
+        var templates = this.templates || {};
+        if (!templates.gcell) {
+            templates.gcell = new Ext.XTemplate(
+                '<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} ' + this.colHeaderCellCls + '" style="{style}">',
+                    '<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '', '{value}',
+                    '</div>',
+                '</td>'
+            );
+        }
+        
+        this.templates = templates;
+        this.hrowRe = new RegExp("ux-grid-hd-group-row-(\\d+)", "");
+    },
+    
+    /**
+     * @private
+     * Sets up the reference to the row headers element
+     */
+    initElements: function() {
+        Ext.grid.PivotGridView.superclass.initElements.apply(this, arguments);
+        
+        /**
+         * @property rowHeadersEl
+         * @type Ext.Element
+         * The element containing all row headers
+         */
+        this.rowHeadersEl = new Ext.Element(this.scroller.child('div.x-grid3-row-headers'));
+        
+        /**
+         * @property headerTitleEl
+         * @type Ext.Element
+         * The element that contains the optional title (top left section of the pivot grid)
+         */
+        this.headerTitleEl = new Ext.Element(this.mainHd.child('div.x-grid3-header-title'));
+    },
+    
+    /**
+     * @private
+     * Takes row headers into account when calculating total available width
+     */
+    getGridInnerWidth: function() {
+        var previousWidth = Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this, arguments);
+        
+        return previousWidth - this.getTotalRowHeaderWidth();
+    },
+    
+    /**
+     * Returns the total width of all row headers as specified by {@link #getRowHeaders}
+     * @return {Number} The total width
+     */
+    getTotalRowHeaderWidth: function() {
+        var headers = this.getRowHeaders(),
+            length  = headers.length,
+            total   = 0,
+            i;
+        
+        for (i = 0; i< length; i++) {
+            total += headers[i].width;
+        }
+        
+        return total;
+    },
+    
+    /**
+     * @private
+     * Returns the total height of all column headers
+     * @return {Number} The total height
+     */
+    getTotalColumnHeaderHeight: function() {
+        return this.getColumnHeaders().length * 21;
+    },
+    
+    /**
+     * Inherit docs
+     * @private
+     * @param {HTMLElement} el
+     */
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe),
+                data;
+ 
+            if (match && (data = match[1])) {
+                return parseInt(data.split('-')[1], 10);
+            }
+        }
+        return false;
+    },
+    
+    
+    /**
+     * @private
+     * Slight specialisation of the GridView renderUI - just adds the row headers
+     */
+    renderUI : function() {
+        var templates  = this.templates,
+            innerWidth = this.getGridInnerWidth();
+            
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            ostyle: 'width:' + innerWidth + 'px',
+            bstyle: 'width:' + innerWidth + 'px'
+        });
+    },
+    
+    /**
+     * @private
+     * Make sure that the headers and rows are all sized correctly during layout
+     */
+    onLayout: function(width, height) {
+        Ext.grid.PivotGridView.superclass.onLayout.apply(this, arguments);
+        
+        var width = this.getGridInnerWidth();
+        
+        this.resizeColumnHeaders(width);
+        this.resizeAllRows(width);
+    },
+    
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+        
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getGridInnerWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+    
+    /**
+     * @private
+     * Bypasses GridView's renderHeaders as they are taken care of separately by the PivotAxis instances
+     */
+    renderHeaders: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Taken care of by PivotAxis
+     */
+    fitColumns: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Called on layout, ensures that the width of each column header is correct. Omitting this can lead to faulty
+     * layouts when nested in a container.
+     * @param {Number} width The new width
+     */
+    resizeColumnHeaders: function(width) {
+        var topAxis = this.grid.topAxis;
+        
+        if (topAxis.rendered) {
+            topAxis.el.setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Sets the row header div to the correct width. Should be called after rendering and reconfiguration of headers
+     */
+    resizeRowHeaders: function() {
+        var rowHeaderWidth = this.getTotalRowHeaderWidth(),
+            marginStyle    = String.format("margin-left: {0}px;", rowHeaderWidth);
+        
+        this.rowHeadersEl.setWidth(rowHeaderWidth);
+        this.mainBody.applyStyles(marginStyle);
+        Ext.fly(this.innerHd).applyStyles(marginStyle);
+        
+        this.headerTitleEl.setWidth(rowHeaderWidth);
+        this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight());
+    },
+    
+    /**
+     * @private
+     * Resizes all rendered rows to the given width. Usually called by onLayout
+     * @param {Number} width The new width
+     */
+    resizeAllRows: function(width) {
+        var rows   = this.getRows(),
+            length = rows.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            Ext.fly(rows[i]).setWidth(width);
+            Ext.fly(rows[i]).child('table').setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Updates the Row Headers, deferring the updating of Column Headers to GridView
+     */
+    updateHeaders: function() {
+        this.renderGroupRowHeaders();
+        this.renderGroupColumnHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders all row header groups at all levels based on the structure fetched from {@link #getGroupRowHeaders}
+     */
+    renderGroupRowHeaders: function() {
+        var leftAxis = this.grid.leftAxis;
+        
+        this.resizeRowHeaders();
+        leftAxis.rendered = false;
+        leftAxis.render(this.rowHeadersEl);
+        
+        this.setTitle(this.title);
+    },
+    
+    /**
+     * Sets the title text in the top left segment of the PivotGridView
+     * @param {String} title The title
+     */
+    setTitle: function(title) {
+        this.headerTitleEl.child('span').dom.innerHTML = title;
+    },
+    
+    /**
+     * @private
+     * Renders all column header groups at all levels based on the structure fetched from {@link #getColumnHeaders}
+     */
+    renderGroupColumnHeaders: function() {
+        var topAxis = this.grid.topAxis;
+        
+        topAxis.rendered = false;
+        topAxis.render(this.innerHd.firstChild);
+    },
+    
+    /**
+     * @private
+     * Overridden to test whether the user is hovering over a group cell, in which case we don't show the menu
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return true;
+    }
+});/**
+ * @class Ext.grid.PivotAxis
+ * @extends Ext.Component
+ * <p>PivotAxis is a class that supports a {@link Ext.grid.PivotGrid}. Each PivotGrid contains two PivotAxis instances - the left
+ * axis and the top axis. Each PivotAxis defines an ordered set of dimensions, each of which should correspond to a field in a
+ * Store's Record (see {@link Ext.grid.PivotGrid} documentation for further explanation).</p>
+ * <p>Developers should have little interaction with the PivotAxis instances directly as most of their management is performed by
+ * the PivotGrid. An exception is the dynamic reconfiguration of axes at run time - to achieve this we use PivotAxis's 
+ * {@link #setDimensions} function and refresh the grid:</p>
+<pre><code>
+var pivotGrid = new Ext.grid.PivotGrid({
+    //some PivotGrid config here
+});
+
+//change the left axis dimensions
+pivotGrid.leftAxis.setDimensions([
+    {
+        dataIndex: 'person',
+        direction: 'DESC',
+        width    : 100
+    },
+    {
+        dataIndex: 'product',
+        direction: 'ASC',
+        width    : 80
+    }
+]);
+
+pivotGrid.view.refresh(true);
+</code></pre>
+ * This clears the previous dimensions on the axis and redraws the grid with the new dimensions.
+ */
+Ext.grid.PivotAxis = Ext.extend(Ext.Component, {
+    /**
+     * @cfg {String} orientation One of 'vertical' or 'horizontal'. Defaults to horizontal
+     */
+    orientation: 'horizontal',
+    
+    /**
+     * @cfg {Number} defaultHeaderWidth The width to render each row header that does not have a width specified via 
+     {@link #getRowGroupHeaders}. Defaults to 80.
+     */
+    defaultHeaderWidth: 80,
+    
+    /**
+     * @private
+     * @cfg {Number} paddingWidth The amount of padding used by each cell.
+     * TODO: From 4.x onwards this can be removed as it won't be needed. For now it is used to account for the differences between
+     * the content box and border box measurement models
+     */
+    paddingWidth: 7,
+    
+    /**
+     * Updates the dimensions used by this axis
+     * @param {Array} dimensions The new dimensions
+     */
+    setDimensions: function(dimensions) {
+        this.dimensions = dimensions;
+    },
+    
+    /**
+     * @private
+     * Builds the html table that contains the dimensions for this axis. This branches internally between vertical
+     * and horizontal orientations because the table structure is slightly different in each case
+     */
+    onRender: function(ct, position) {
+        var rows = this.orientation == 'horizontal'
+                 ? this.renderHorizontalRows()
+                 : this.renderVerticalRows();
+        
+        this.el = Ext.DomHelper.overwrite(ct.dom, {tag: 'table', cn: rows}, true);
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for horizontal oriented axes
+     * @return {Object} The HTML Domspec for a horizontal oriented axis
+     */
+    renderHorizontalRows: function() {
+        var headers  = this.buildHeaders(),
+            rowCount = headers.length,
+            rows     = [],
+            cells, cols, colCount, i, j;
+        
+        for (i = 0; i < rowCount; i++) {
+            cells = [];
+            cols  = headers[i].items;
+            colCount = cols.length;
+
+            for (j = 0; j < colCount; j++) {
+                cells.push({
+                    tag: 'td',
+                    html: cols[j].header,
+                    colspan: cols[j].span
+                });
+            }
+
+            rows[i] = {
+                tag: 'tr',
+                cn: cells
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for vertical oriented axes
+     * @return {Object} The HTML Domspec for a vertical oriented axis
+     */
+    renderVerticalRows: function() {
+        var headers  = this.buildHeaders(),
+            colCount = headers.length,
+            rowCells = [],
+            rows     = [],
+            rowCount, col, row, colWidth, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            col = headers[i];
+            colWidth = col.width || 80;
+            rowCount = col.items.length;
+            
+            for (j = 0; j < rowCount; j++) {
+                row = col.items[j];
+                
+                rowCells[row.start] = rowCells[row.start] || [];
+                rowCells[row.start].push({
+                    tag    : 'td',
+                    html   : row.header,
+                    rowspan: row.span,
+                    width  : Ext.isBorderBox ? colWidth : colWidth - this.paddingWidth
+                });
+            }
+        }
+        
+        rowCount = rowCells.length;
+        for (i = 0; i < rowCount; i++) {
+            rows[i] = {
+                tag: 'tr',
+                cn : rowCells[i]
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Returns the set of all unique tuples based on the bound store and dimension definitions.
+     * Internally we construct a new, temporary store to make use of the multi-sort capabilities of Store. In
+     * 4.x this functionality should have been moved to MixedCollection so this step should not be needed.
+     * @return {Array} All unique tuples
+     */
+    getTuples: function() {
+        var newStore = new Ext.data.Store({});
+        
+        newStore.data = this.store.data.clone();
+        newStore.fields = this.store.fields;
+        
+        var sorters    = [],
+            dimensions = this.dimensions,
+            length     = dimensions.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            sorters.push({
+                field    : dimensions[i].dataIndex,
+                direction: dimensions[i].direction || 'ASC'
+            });
+        }
+        
+        newStore.sort(sorters);
+        
+        var records = newStore.data.items,
+            hashes  = [],
+            tuples  = [],
+            recData, hash, info, data, key;
+        
+        length = records.length;
+        
+        for (i = 0; i < length; i++) {
+            info = this.getRecordInfo(records[i]);
+            data = info.data;
+            hash = "";
+            
+            for (key in data) {
+                hash += data[key] + '---';
+            }
+            
+            if (hashes.indexOf(hash) == -1) {
+                hashes.push(hash);
+                tuples.push(info);
+            }
+        }
+        
+        newStore.destroy();
+        
+        return tuples;
+    },
+    
+    /**
+     * @private
+     */
+    getRecordInfo: function(record) {
+        var dimensions = this.dimensions,
+            length  = dimensions.length,
+            data    = {},
+            dimension, dataIndex, i;
+        
+        //get an object containing just the data we are interested in based on the configured dimensions
+        for (i = 0; i < length; i++) {
+            dimension = dimensions[i];
+            dataIndex = dimension.dataIndex;
+            
+            data[dataIndex] = record.get(dataIndex);
+        }
+        
+        //creates a specialised matcher function for a given tuple. The returned function will return
+        //true if the record passed to it matches the dataIndex values of each dimension in this axis
+        var createMatcherFunction = function(data) {
+            return function(record) {
+                for (var dataIndex in data) {
+                    if (record.get(dataIndex) != data[dataIndex]) {
+                        return false;
+                    }
+                }
+                
+                return true;
+            };
+        };
+        
+        return {
+            data: data,
+            matcher: createMatcherFunction(data)
+        };
+    },
+    
+    /**
+     * @private
+     * Uses the calculated set of tuples to build an array of headers that can be rendered into a table using rowspan or
+     * colspan. Basically this takes the set of tuples and spans any cells that run into one another, so if we had dimensions
+     * of Person and Product and several tuples containing different Products for the same Person, those Products would be
+     * spanned.
+     * @return {Array} The headers
+     */
+    buildHeaders: function() {
+        var tuples     = this.getTuples(),
+            rowCount   = tuples.length,
+            dimensions = this.dimensions,
+            dimension,
+            colCount   = dimensions.length,
+            headers    = [],
+            tuple, rows, currentHeader, previousHeader, span, start, isLast, changed, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            dimension = dimensions[i];
+            rows  = [];
+            span  = 0;
+            start = 0;
+            
+            for (j = 0; j < rowCount; j++) {
+                tuple  = tuples[j];
+                isLast = j == (rowCount - 1);
+                currentHeader = tuple.data[dimension.dataIndex];
+                
+                /*
+                 * 'changed' indicates that we need to create a new cell. This should be true whenever the cell
+                 * above (previousHeader) is different from this cell, or when the cell on the previous dimension
+                 * changed (e.g. if the current dimension is Product and the previous was Person, we need to start
+                 * a new cell if Product is the same but Person changed, so we check the previous dimension and tuple)
+                 */
+                changed = previousHeader != undefined && previousHeader != currentHeader;
+                if (i > 0 && j > 0) {
+                    changed = changed || tuple.data[dimensions[i-1].dataIndex] != tuples[j-1].data[dimensions[i-1].dataIndex];
+                }
+                
+                if (changed) {                    
+                    rows.push({
+                        header: previousHeader,
+                        span  : span,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                if (isLast) {
+                    rows.push({
+                        header: currentHeader,
+                        span  : span + 1,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                previousHeader = currentHeader;
+                span++;
+            }
+            
+            headers.push({
+                items: rows,
+                width: dimension.width || this.defaultHeaderWidth
+            });
+            
+            previousHeader = undefined;
+        }
+        
+        return headers;
+    }
+});
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDragZone = Ext.extend(Ext.dd.DragZone, {
+    maxDragWidth: 120,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
+        if(hd2){
+            this.setHandleElId(Ext.id(hd));
+            this.setOuterHandleElId(Ext.id(hd2));
+        }
+        this.scroll = false;
+    },
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            h = this.view.findHeaderCell(t);
+        if(h){
+            return {ddel: h.firstChild, header:h};
+        }
+        return false;
+    },
+
+    onInitDrag : function(e){
+        // keep the value here so we can restore it;
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var clone = this.dragData.ddel.cloneNode(true);
+        clone.id = Ext.id();
+        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
+        this.proxy.update(clone);
+        return true;
+    },
+
+    afterValidDrop : function(){
+        this.completeDrop();
+    },
+
+    afterInvalidDrop : function(){
+        this.completeDrop();
+    },
+    
+    completeDrop: function(){
+        var v = this.view,
+            disabled = this.dragHeadersDisabled;
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    }
+});
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDropZone = Ext.extend(Ext.dd.DropZone, {
+    proxyOffsets : [-4, -9],
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        // split the proxies so they don't interfere with mouse events
+        this.proxyTop = Ext.DomHelper.append(document.body, {
+            cls:"col-move-top", html:"&#160;"
+        }, true);
+        this.proxyBottom = Ext.DomHelper.append(document.body, {
+            cls:"col-move-bottom", html:"&#160;"
+        }, true);
+        this.proxyTop.hide = this.proxyBottom.hide = function(){
+            this.setLeftTop(-100,-100);
+            this.setStyle("visibility", "hidden");
+        };
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        // temporarily disabled
+        //Ext.dd.ScrollManager.register(this.view.scroller.dom);
+        Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
+    },
+
+    getTargetFromEvent : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            cindex = this.view.findCellIndex(t);
+        if(cindex !== false){
+            return this.view.getHeaderCell(cindex);
+        }
+    },
+
+    nextVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.nextSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.nextSibling;
+        }
+        return null;
+    },
+
+    prevVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.prevSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.prevSibling;
+        }
+        return null;
+    },
+
+    positionIndicator : function(h, n, e){
+        var x = Ext.lib.Event.getPageX(e),
+            r = Ext.lib.Dom.getRegion(n.firstChild),
+            px, 
+            pt, 
+            py = r.top + this.proxyOffsets[1];
+        if((r.right - x) <= (r.right-r.left)/2){
+            px = r.right+this.view.borderWidth;
+            pt = "after";
+        }else{
+            px = r.left;
+            pt = "before";
+        }
+
+        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){
+            return false;
+        }
+
+        px +=  this.proxyOffsets[0];
+        this.proxyTop.setLeftTop(px, py);
+        this.proxyTop.show();
+        if(!this.bottomOffset){
+            this.bottomOffset = this.view.mainHd.getHeight();
+        }
+        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
+        this.proxyBottom.show();
+        return pt;
+    },
+
+    onNodeEnter : function(n, dd, e, data){
+        if(data.header != n){
+            this.positionIndicator(data.header, n, e);
+        }
+    },
+
+    onNodeOver : function(n, dd, e, data){
+        var result = false;
+        if(data.header != n){
+            result = this.positionIndicator(data.header, n, e);
+        }
+        if(!result){
+            this.proxyTop.hide();
+            this.proxyBottom.hide();
+        }
+        return result ? this.dropAllowed : this.dropNotAllowed;
+    },
+
+    onNodeOut : function(n, dd, e, data){
+        this.proxyTop.hide();
+        this.proxyBottom.hide();
+    },
+
+    onNodeDrop : function(n, dd, e, data){
+        var h = data.header;
+        if(h != n){
+            var cm = this.grid.colModel,
+                x = Ext.lib.Event.getPageX(e),
+                r = Ext.lib.Dom.getRegion(n.firstChild),
+                pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before",
+                oldIndex = this.view.getCellIndex(h),
+                newIndex = this.view.getCellIndex(n);
+            if(pt == "after"){
+                newIndex++;
+            }
+            if(oldIndex < newIndex){
+                newIndex--;
+            }
+            cm.moveColumn(oldIndex, newIndex);
+            return true;
+        }
+        return false;
+    }
+});
+
+Ext.grid.GridView.ColumnDragZone = Ext.extend(Ext.grid.HeaderDragZone, {
+    
+    constructor : function(grid, hd){
+        Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
+        this.proxy.el.addClass('x-grid3-col-dd');
+    },
+    
+    handleMouseDown : function(e){
+    },
+
+    callHandleMouseDown : function(e){
+        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
+    }
+});// private
+// This is a support class used internally by the Grid components
+Ext.grid.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.SplitDragZone.superclass.constructor.call(this, hd,
+            "gridSplitters" + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.setHandleElId(Ext.id(hd));
+        this.setOuterHandleElId(Ext.id(hd2));
+        this.scroll = false;
+    },
+
+    b4StartDrag : function(x, y){
+        this.view.headersDisabled = true;
+        this.proxy.setHeight(this.view.mainWrap.getHeight());
+        var w = this.cm.getColumnWidth(this.cellIndex);
+        var minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+
+    handleMouseDown : function(e){
+        var ev = Ext.EventObject.setEvent(e);
+        var t = this.fly(ev.getTarget());
+        if(t.hasClass("x-grid-split")){
+            this.cellIndex = this.view.getCellIndex(t.dom);
+            this.split = t.dom;
+            this.cm = this.grid.colModel;
+            if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.view.headersDisabled = false;
+        var endX = Math.max(this.minX, Ext.lib.Event.getPageX(e));
+        var diff = endX - this.startPos;
+        this.view.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});/**
+ * @class Ext.grid.GridDragZone
+ * @extends Ext.dd.DragZone
+ * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
+ * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
+ * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
+ * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+ * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
+ * to process the {@link #getDragData data} which is provided.
+ */
+Ext.grid.GridDragZone = function(grid, config){
+    this.view = grid.getView();
+    Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
+    this.scroll = false;
+    this.grid = grid;
+    this.ddel = document.createElement('div');
+    this.ddel.className = 'x-grid-dd-wrap';
+};
+
+Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
+    ddGroup : "GridDD",
+
+    /**
+     * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
+     * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
+     * <p>The data object contains the following properties:<ul>
+     * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
+     * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
+     * <li><b>rowIndex</b> : Number<div class="sub-desc">The index of the row which receieved the mousedown gesture which triggered the drag.</div></li>
+     * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
+     * </ul></p>
+     */
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e);
+        var rowIndex = this.view.findRowIndex(t);
+        if(rowIndex !== false){
+            var sm = this.grid.selModel;
+            if(!sm.isSelected(rowIndex) || e.hasModifier()){
+                sm.handleMouseDown(this.grid, rowIndex, e);
+            }
+            return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
+        }
+        return false;
+    },
+
+    /**
+     * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
+     * of the data being dragged.</p>
+     * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
+     */
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.ddel.innerHTML = this.grid.getDragDropText();
+        this.proxy.update(this.ddel);
+        // fire start drag?
+    },
+
+    /**
+     * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
+     * the selected rows to show that they have not been dragged.
+     */
+    afterRepair : function(){
+        this.dragging = false;
+    },
+
+    /**
+     * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
+     * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e, data){
+        return false;
+    },
+
+    onEndDrag : function(data, e){
+        // fire end drag?
+    },
+
+    onValidDrop : function(dd, e, id){
+        // fire drag drop?
+        this.hideProxy();
+    },
+
+    beforeInvalidDrop : function(e, id){
+
+    }
+});
+/**
+ * @class Ext.grid.ColumnModel
+ * @extends Ext.util.Observable
+ * <p>After the data has been read into the client side cache (<b>{@link Ext.data.Store Store}</b>),
+ * the ColumnModel is used to configure how and what parts of that data will be displayed in the
+ * vertical slices (columns) of the grid. The Ext.grid.ColumnModel Class is the default implementation
+ * of a ColumnModel used by implentations of {@link Ext.grid.GridPanel GridPanel}.</p>
+ * <p>Data is mapped into the store's records and then indexed into the ColumnModel using the
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt>:</p>
+ * <pre><code>
+{data source} == mapping ==> {data store} == <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> ==> {ColumnModel}
+ * </code></pre>
+ * <p>Each {@link Ext.grid.Column Column} in the grid's ColumnModel is configured with a
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt> to specify how the data within
+ * each record in the store is indexed into the ColumnModel.</p>
+ * <p>There are two ways to initialize the ColumnModel class:</p>
+ * <p><u>Initialization Method 1: an Array</u></p>
+<pre><code>
+ var colModel = new Ext.grid.ColumnModel([
+    { header: "Ticker", width: 60, sortable: true},
+    { header: "Company Name", width: 150, sortable: true, id: 'company'},
+    { header: "Market Cap.", width: 100, sortable: true},
+    { header: "$ Sales", width: 100, sortable: true, renderer: money},
+    { header: "Employees", width: 100, sortable: true, resizable: false}
+ ]);
+ </code></pre>
+ * <p>The ColumnModel may be initialized with an Array of {@link Ext.grid.Column} column configuration
+ * objects to define the initial layout / display of the columns in the Grid. The order of each
+ * {@link Ext.grid.Column} column configuration object within the specified Array defines the initial
+ * order of the column display.  A Column's display may be initially hidden using the
+ * <tt>{@link Ext.grid.Column#hidden hidden}</tt></b> config property (and then shown using the column
+ * header menu).  Fields that are not included in the ColumnModel will not be displayable at all.</p>
+ * <p>How each column in the grid correlates (maps) to the {@link Ext.data.Record} field in the
+ * {@link Ext.data.Store Store} the column draws its data from is configured through the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b>.  If the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> is not explicitly defined (as shown in the
+ * example above) it will use the column configuration's index in the Array as the index.</p>
+ * <p>See <b><tt>{@link Ext.grid.Column}</tt></b> for additional configuration options for each column.</p>
+ * <p><u>Initialization Method 2: an Object</u></p>
+ * <p>In order to use configuration options from <tt>Ext.grid.ColumnModel</tt>, an Object may be used to
+ * initialize the ColumnModel.  The column configuration Array will be specified in the <tt><b>{@link #columns}</b></tt>
+ * config property. The <tt><b>{@link #defaults}</b></tt> config property can be used to apply defaults
+ * for all columns, e.g.:</p><pre><code>
+ var colModel = new Ext.grid.ColumnModel({
+    columns: [
+        { header: "Ticker", width: 60, menuDisabled: false},
+        { header: "Company Name", width: 150, id: 'company'},
+        { header: "Market Cap."},
+        { header: "$ Sales", renderer: money},
+        { header: "Employees", resizable: false}
+    ],
+    defaults: {
+        sortable: true,
+        menuDisabled: true,
+        width: 100
+    },
+    listeners: {
+        {@link #hiddenchange}: function(cm, colIndex, hidden) {
+            saveConfig(colIndex, hidden);
+        }
+    }
+});
+ </code></pre>
+ * <p>In both examples above, the ability to apply a CSS class to all cells in a column (including the
+ * header) is demonstrated through the use of the <b><tt>{@link Ext.grid.Column#id id}</tt></b> config
+ * option. This column could be styled by including the following css:</p><pre><code>
+ //add this css *after* the core css is loaded
+.x-grid3-td-company {
+    color: red; // entire column will have red font
+}
+// modify the header row only, adding an icon to the column header
+.x-grid3-hd-company {
+    background: transparent
+        url(../../resources/images/icons/silk/building.png)
+        no-repeat 3px 3px ! important;
+        padding-left:20px;
+}
+ </code></pre>
+ * Note that the "Company Name" column could be specified as the
+ * <b><tt>{@link Ext.grid.GridPanel}.{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></b>.
+ * @constructor
+ * @param {Mixed} config Specify either an Array of {@link Ext.grid.Column} configuration objects or specify
+ * a configuration Object (see introductory section discussion utilizing Initialization Method 2 above).
+ */
+Ext.grid.ColumnModel = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} defaultWidth (optional) The width of columns which have no <tt>{@link #width}</tt>
+     * specified (defaults to <tt>100</tt>).  This property shall preferably be configured through the
+     * <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultWidth: 100,
+
+    /**
+     * @cfg {Boolean} defaultSortable (optional) Default sortable of columns which have no
+     * sortable specified (defaults to <tt>false</tt>).  This property shall preferably be configured
+     * through the <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultSortable: false,
+
+    /**
+     * @cfg {Array} columns An Array of object literals.  The config options defined by
+     * <b>{@link Ext.grid.Column}</b> are the options which may appear in the object literal for each
+     * individual column definition.
+     */
+
+    /**
+     * @cfg {Object} defaults Object literal which will be used to apply {@link Ext.grid.Column}
+     * configuration options to all <tt><b>{@link #columns}</b></tt>.  Configuration options specified with
+     * individual {@link Ext.grid.Column column} configs will supersede these <tt><b>{@link #defaults}</b></tt>.
+     */
+
+    constructor : function(config) {
+        /**
+	     * An Array of {@link Ext.grid.Column Column definition} objects representing the configuration
+	     * of this ColumnModel.  See {@link Ext.grid.Column} for the configuration properties that may
+	     * be specified.
+	     * @property config
+	     * @type Array
+	     */
+	    if (config.columns) {
+	        Ext.apply(this, config);
+	        this.setConfig(config.columns, true);
+	    } else {
+	        this.setConfig(config, true);
+	    }
+	    
+	    this.addEvents(
+	        /**
+	         * @event widthchange
+	         * Fires when the width of a column is programmaticially changed using
+	         * <code>{@link #setColumnWidth}</code>.
+	         * Note internal resizing suppresses the event from firing. See also
+	         * {@link Ext.grid.GridPanel}.<code>{@link #columnresize}</code>.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Number} newWidth The new width
+	         */
+	        "widthchange",
+	        
+	        /**
+	         * @event headerchange
+	         * Fires when the text of a header changes.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {String} newText The new header text
+	         */
+	        "headerchange",
+	        
+	        /**
+	         * @event hiddenchange
+	         * Fires when a column is hidden or "unhidden".
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Boolean} hidden true if hidden, false otherwise
+	         */
+	        "hiddenchange",
+	        
+	        /**
+	         * @event columnmoved
+	         * Fires when a column is moved.
+	         * @param {ColumnModel} this
+	         * @param {Number} oldIndex
+	         * @param {Number} newIndex
+	         */
+	        "columnmoved",
+	        
+	        /**
+	         * @event configchange
+	         * Fires when the configuration is changed
+	         * @param {ColumnModel} this
+	         */
+	        "configchange"
+	    );
+	    
+	    Ext.grid.ColumnModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * Returns the id of the column at the specified index.
+     * @param {Number} index The column index
+     * @return {String} the id
+     */
+    getColumnId : function(index) {
+        return this.config[index].id;
+    },
+
+    getColumnAt : function(index) {
+        return this.config[index];
+    },
+
+    /**
+     * <p>Reconfigures this column model according to the passed Array of column definition objects.
+     * For a description of the individual properties of a column definition object, see the
+     * <a href="#Ext.grid.ColumnModel-configs">Config Options</a>.</p>
+     * <p>Causes the {@link #configchange} event to be fired. A {@link Ext.grid.GridPanel GridPanel}
+     * using this ColumnModel will listen for this event and refresh its UI automatically.</p>
+     * @param {Array} config Array of Column definition objects.
+     * @param {Boolean} initial Specify <tt>true</tt> to bypass cleanup which deletes the <tt>totalWidth</tt>
+     * and destroys existing editors.
+     */
+    setConfig : function(config, initial) {
+        var i, c, len;
+        
+        if (!initial) { // cleanup
+            delete this.totalWidth;
+            
+            for (i = 0, len = this.config.length; i < len; i++) {
+                c = this.config[i];
+                
+                if (c.setEditor) {
+                    //check here, in case we have a special column like a CheckboxSelectionModel
+                    c.setEditor(null);
+                }
+            }
+        }
+
+        // backward compatibility
+        this.defaults = Ext.apply({
+            width: this.defaultWidth,
+            sortable: this.defaultSortable
+        }, this.defaults);
+
+        this.config = config;
+        this.lookup = {};
+
+        for (i = 0, len = config.length; i < len; i++) {
+            c = Ext.applyIf(config[i], this.defaults);
+            
+            // if no id, create one using column's ordinal position
+            if (Ext.isEmpty(c.id)) {
+                c.id = i;
+            }
+            
+            if (!c.isColumn) {
+                var Cls = Ext.grid.Column.types[c.xtype || 'gridcolumn'];
+                c = new Cls(c);
+                config[i] = c;
+            }
+            
+            this.lookup[c.id] = c;
+        }
+        
+        if (!initial) {
+            this.fireEvent('configchange', this);
+        }
+    },
+
+    /**
+     * Returns the column for a specified id.
+     * @param {String} id The column id
+     * @return {Object} the column
+     */
+    getColumnById : function(id) {
+        return this.lookup[id];
+    },
+
+    /**
+     * Returns the index for a specified column id.
+     * @param {String} id The column id
+     * @return {Number} the index, or -1 if not found
+     */
+    getIndexById : function(id) {
+        for (var i = 0, len = this.config.length; i < len; i++) {
+            if (this.config[i].id == id) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Moves a column from one position to another.
+     * @param {Number} oldIndex The index of the column to move.
+     * @param {Number} newIndex The position at which to reinsert the coolumn.
+     */
+    moveColumn : function(oldIndex, newIndex) {
+        var config = this.config,
+            c      = config[oldIndex];
+            
+        config.splice(oldIndex, 1);
+        config.splice(newIndex, 0, c);
+        this.dataMap = null;
+        this.fireEvent("columnmoved", this, oldIndex, newIndex);
+    },
+
+    /**
+     * Returns the number of columns.
+     * @param {Boolean} visibleOnly Optional. Pass as true to only include visible columns.
+     * @return {Number}
+     */
+    getColumnCount : function(visibleOnly) {
+        var length = this.config.length,
+            c = 0,
+            i;
+        
+        if (visibleOnly === true) {
+            for (i = 0; i < length; i++) {
+                if (!this.isHidden(i)) {
+                    c++;
+                }
+            }
+            
+            return c;
+        }
+        
+        return length;
+    },
+
+    /**
+     * Returns the column configs that return true by the passed function that is called
+     * with (columnConfig, index)
+<pre><code>
+// returns an array of column config objects for all hidden columns
+var columns = grid.getColumnModel().getColumnsBy(function(c){
+  return c.hidden;
+});
+</code></pre>
+     * @param {Function} fn A function which, when passed a {@link Ext.grid.Column Column} object, must
+     * return <code>true</code> if the column is to be included in the returned Array.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function
+     * is executed. Defaults to this ColumnModel.
+     * @return {Array} result
+     */
+    getColumnsBy : function(fn, scope) {
+        var config = this.config,
+            length = config.length,
+            result = [],
+            i, c;
+            
+        for (i = 0; i < length; i++){
+            c = config[i];
+            
+            if (fn.call(scope || this, c, i) === true) {
+                result[result.length] = c;
+            }
+        }
+        
+        return result;
+    },
+
+    /**
+     * Returns true if the specified column is sortable.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isSortable : function(col) {
+        return !!this.config[col].sortable;
+    },
+
+    /**
+     * Returns true if the specified column menu is disabled.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isMenuDisabled : function(col) {
+        return !!this.config[col].menuDisabled;
+    },
+
+    /**
+     * Returns the rendering (formatting) function defined for the column.
+     * @param {Number} col The column index.
+     * @return {Function} The function used to render the cell. See {@link #setRenderer}.
+     */
+    getRenderer : function(col) {
+        return this.config[col].renderer || Ext.grid.ColumnModel.defaultRenderer;
+    },
+
+    getRendererScope : function(col) {
+        return this.config[col].scope;
+    },
+
+    /**
+     * Sets the rendering (formatting) function for a column.  See {@link Ext.util.Format} for some
+     * default formatting functions.
+     * @param {Number} col The column index
+     * @param {Function} fn The function to use to process the cell's raw data
+     * to return HTML markup for the grid view. The render function is called with
+     * the following parameters:<ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     * (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record was extracted.</p></li></ul>
+     */
+    setRenderer : function(col, fn) {
+        this.config[col].renderer = fn;
+    },
+
+    /**
+     * Returns the width for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getColumnWidth : function(col) {
+        var width = this.config[col].width;
+        if(typeof width != 'number'){
+            width = this.defaultWidth;
+        }
+        return width;
+    },
+
+    /**
+     * Sets the width for a column.
+     * @param {Number} col The column index
+     * @param {Number} width The new width
+     * @param {Boolean} suppressEvent True to suppress firing the <code>{@link #widthchange}</code>
+     * event. Defaults to false.
+     */
+    setColumnWidth : function(col, width, suppressEvent) {
+        this.config[col].width = width;
+        this.totalWidth = null;
+        
+        if (!suppressEvent) {
+             this.fireEvent("widthchange", this, col, width);
+        }
+    },
+
+    /**
+     * Returns the total width of all columns.
+     * @param {Boolean} includeHidden True to include hidden column widths
+     * @return {Number}
+     */
+    getTotalWidth : function(includeHidden) {
+        if (!this.totalWidth) {
+            this.totalWidth = 0;
+            for (var i = 0, len = this.config.length; i < len; i++) {
+                if (includeHidden || !this.isHidden(i)) {
+                    this.totalWidth += this.getColumnWidth(i);
+                }
+            }
+        }
+        return this.totalWidth;
+    },
+
+    /**
+     * Returns the header for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnHeader : function(col) {
+        return this.config[col].header;
+    },
+
+    /**
+     * Sets the header for a column.
+     * @param {Number} col The column index
+     * @param {String} header The new header
+     */
+    setColumnHeader : function(col, header) {
+        this.config[col].header = header;
+        this.fireEvent("headerchange", this, col, header);
+    },
+
+    /**
+     * Returns the tooltip for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnTooltip : function(col) {
+            return this.config[col].tooltip;
+    },
+    /**
+     * Sets the tooltip for a column.
+     * @param {Number} col The column index
+     * @param {String} tooltip The new tooltip
+     */
+    setColumnTooltip : function(col, tooltip) {
+            this.config[col].tooltip = tooltip;
+    },
+
+    /**
+     * Returns the dataIndex for the specified column.
+<pre><code>
+// Get field name for the column
+var fieldName = grid.getColumnModel().getDataIndex(columnIndex);
+</code></pre>
+     * @param {Number} col The column index
+     * @return {String} The column's dataIndex
+     */
+    getDataIndex : function(col) {
+        return this.config[col].dataIndex;
+    },
+
+    /**
+     * Sets the dataIndex for a column.
+     * @param {Number} col The column index
+     * @param {String} dataIndex The new dataIndex
+     */
+    setDataIndex : function(col, dataIndex) {
+        this.config[col].dataIndex = dataIndex;
+    },
+
+    /**
+     * Finds the index of the first matching column for the given dataIndex.
+     * @param {String} col The dataIndex to find
+     * @return {Number} The column index, or -1 if no match was found
+     */
+    findColumnIndex : function(dataIndex) {
+        var c = this.config;
+        for(var i = 0, len = c.length; i < len; i++){
+            if(c[i].dataIndex == dataIndex){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns true if the cell is editable.
+<pre><code>
+var store = new Ext.data.Store({...});
+var colModel = new Ext.grid.ColumnModel({
+  columns: [...],
+  isCellEditable: function(col, row) {
+    var record = store.getAt(row);
+    if (record.get('readonly')) { // replace with your condition
+      return false;
+    }
+    return Ext.grid.ColumnModel.prototype.isCellEditable.call(this, col, row);
+  }
+});
+var grid = new Ext.grid.GridPanel({
+  store: store,
+  colModel: colModel,
+  ...
+});
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Boolean}
+     */
+    isCellEditable : function(colIndex, rowIndex) {
+        var c = this.config[colIndex],
+            ed = c.editable;
+
+        //force boolean
+        return !!(ed || (!Ext.isDefined(ed) && c.editor));
+    },
+
+    /**
+     * Returns the editor defined for the cell/column.
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor} The {@link Ext.Editor Editor} that was created to wrap
+     * the {@link Ext.form.Field Field} used to edit the cell.
+     */
+    getCellEditor : function(colIndex, rowIndex) {
+        return this.config[colIndex].getCellEditor(rowIndex);
+    },
+
+    /**
+     * Sets if a column is editable.
+     * @param {Number} col The column index
+     * @param {Boolean} editable True if the column is editable
+     */
+    setEditable : function(col, editable) {
+        this.config[col].editable = editable;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#hidden hidden}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isHidden : function(colIndex) {
+        return !!this.config[colIndex].hidden; // ensure returns boolean
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#fixed fixed}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isFixed : function(colIndex) {
+        return !!this.config[colIndex].fixed;
+    },
+
+    /**
+     * Returns true if the column can be resized
+     * @return {Boolean}
+     */
+    isResizable : function(colIndex) {
+        return colIndex >= 0 && this.config[colIndex].resizable !== false && this.config[colIndex].fixed !== true;
+    },
+    
+    /**
+     * Sets if a column is hidden.
+<pre><code>
+myGrid.getColumnModel().setHidden(0, true); // hide column 0 (0 = the first column).
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Boolean} hidden True if the column is hidden
+     */
+    setHidden : function(colIndex, hidden) {
+        var c = this.config[colIndex];
+        if(c.hidden !== hidden){
+            c.hidden = hidden;
+            this.totalWidth = null;
+            this.fireEvent("hiddenchange", this, colIndex, hidden);
+        }
+    },
+
+    /**
+     * Sets the editor for a column and destroys the prior editor.
+     * @param {Number} col The column index
+     * @param {Object} editor The editor object
+     */
+    setEditor : function(col, editor) {
+        this.config[col].setEditor(editor);
+    },
+
+    /**
+     * Destroys this column model by purging any event listeners. Destroys and dereferences all Columns.
+     */
+    destroy : function() {
+        var length = this.config.length,
+            i = 0;
+
+        for (; i < length; i++){
+            this.config[i].destroy(); // Column's destroy encapsulates all cleanup.
+        }
+        delete this.config;
+        delete this.lookup;
+        this.purgeListeners();
+    },
+
+    /**
+     * @private
+     * Setup any saved state for the column, ensures that defaults are applied.
+     */
+    setState : function(col, state) {
+        state = Ext.applyIf(state, this.defaults);
+        Ext.apply(this.config[col], state);
+    }
+});
+
+// private
+Ext.grid.ColumnModel.defaultRenderer = function(value) {
+    if (typeof value == "string" && value.length < 1) {
+        return "&#160;";
+    }
+    return value;
+};/**
+ * @class Ext.grid.AbstractSelectionModel
+ * @extends Ext.util.Observable
+ * Abstract base class for grid SelectionModels.  It provides the interface that should be
+ * implemented by descendant classes.  This class should not be directly instantiated.
+ * @constructor
+ */
+Ext.grid.AbstractSelectionModel = Ext.extend(Ext.util.Observable,  {
+    /**
+     * The GridPanel for which this SelectionModel is handling selection. Read-only.
+     * @type Object
+     * @property grid
+     */
+
+    constructor : function(){
+        this.locked = false;
+        Ext.grid.AbstractSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore Called by the grid automatically. Do not call directly. */
+    init : function(grid){
+        this.grid = grid;
+        if(this.lockOnInit){
+            delete this.lockOnInit;
+            this.locked = false;
+            this.lock();
+        }
+        this.initEvents();
+    },
+
+    /**
+     * Locks the selections.
+     */
+    lock : function(){
+        if(!this.locked){
+            this.locked = true;
+            // If the grid has been set, then the view is already initialized.
+            var g = this.grid;
+            if(g){
+                g.getView().on({
+                    scope: this,
+                    beforerefresh: this.sortUnLock,
+                    refresh: this.sortLock
+                });
+            }else{
+                this.lockOnInit = true;
+            }
+        }
+    },
+
+    // set the lock states before and after a view refresh
+    sortLock : function() {
+        this.locked = true;
+    },
+
+    // set the lock states before and after a view refresh
+    sortUnLock : function() {
+        this.locked = false;
+    },
+
+    /**
+     * Unlocks the selections.
+     */
+    unlock : function(){
+        if(this.locked){
+            this.locked = false;
+            var g = this.grid,
+                gv;
+                
+            // If the grid has been set, then the view is already initialized.
+            if(g){
+                gv = g.getView();
+                gv.un('beforerefresh', this.sortUnLock, this);
+                gv.un('refresh', this.sortLock, this);    
+            }else{
+                delete this.lockOnInit;
+            }
+        }
+    },
+
+    /**
+     * Returns true if the selections are locked.
+     * @return {Boolean}
+     */
+    isLocked : function(){
+        return this.locked;
+    },
+
+    destroy: function(){
+        this.unlock();
+        this.purgeListeners();
+    }
+});/**
+ * @class Ext.grid.RowSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * The default SelectionModel used by {@link Ext.grid.GridPanel}.
+ * It supports multiple selections and keyboard selection/navigation. The objects stored
+ * as selections and returned by {@link #getSelected}, and {@link #getSelections} are
+ * the {@link Ext.data.Record Record}s which provide the data for the selected rows.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.RowSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    /**
+     * @cfg {Boolean} singleSelect
+     * <tt>true</tt> to allow selection of only one row at a time (defaults to <tt>false</tt>
+     * allowing multiple selections)
+     */
+    singleSelect : false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.selections = new Ext.util.MixedCollection(false, function(o){
+            return o.id;
+        });
+
+        this.last = false;
+        this.lastActive = false;
+
+        this.addEvents(
+	        /**
+	         * @event selectionchange
+	         * Fires when the selection changes
+	         * @param {SelectionModel} this
+	         */
+	        'selectionchange',
+	        /**
+	         * @event beforerowselect
+	         * Fires before a row is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The index to be selected
+	         * @param {Boolean} keepExisting False if other selections will be cleared
+	         * @param {Record} record The record to be selected
+	         */
+	        'beforerowselect',
+	        /**
+	         * @event rowselect
+	         * Fires when a row is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected index
+	         * @param {Ext.data.Record} r The selected record
+	         */
+	        'rowselect',
+	        /**
+	         * @event rowdeselect
+	         * Fires when a row is deselected.  To prevent deselection
+	         * {@link Ext.grid.AbstractSelectionModel#lock lock the selections}. 
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex
+	         * @param {Record} record
+	         */
+	        'rowdeselect'
+        );
+        Ext.grid.RowSelectionModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Boolean} moveEditorOnEnter
+     * <tt>false</tt> to turn off moving the editor to the next row down when the enter key is pressed
+     * or the next row up when shift + enter keys are pressed.
+     */
+    // private
+    initEvents : function(){
+
+        if(!this.grid.enableDragDrop && !this.grid.enableDrag){
+            this.grid.on('rowmousedown', this.handleMouseDown, this);
+        }
+
+        this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
+            up: this.onKeyPress, 
+            down: this.onKeyPress,
+            scope: this
+        });
+
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onRefresh,
+            rowupdated: this.onRowUpdated,
+            rowremoved: this.onRemove
+        });
+    },
+    
+    onKeyPress : function(e, name){
+        var up = name == 'up',
+            method = up ? 'selectPrevious' : 'selectNext',
+            add = up ? -1 : 1,
+            last;
+        if(!e.shiftKey || this.singleSelect){
+            this[method](false);
+        }else if(this.last !== false && this.lastActive !== false){
+            last = this.last;
+            this.selectRange(this.last,  this.lastActive + add);
+            this.grid.getView().focusRow(this.lastActive);
+            if(last !== false){
+                this.last = last;
+            }
+        }else{
+           this.selectFirstRow();
+        }
+    },
+
+    // private
+    onRefresh : function(){
+        var ds = this.grid.store,
+            s = this.getSelections(),
+            i = 0,
+            len = s.length, 
+            index, r;
+            
+        this.silent = true;
+        this.clearSelections(true);
+        for(; i < len; i++){
+            r = s[i];
+            if((index = ds.indexOfId(r.id)) != -1){
+                this.selectRow(index, true);
+            }
+        }
+        if(s.length != this.selections.getCount()){
+            this.fireEvent('selectionchange', this);
+        }
+        this.silent = false;
+    },
+
+    // private
+    onRemove : function(v, index, r){
+        if(this.selections.remove(r) !== false){
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    onRowUpdated : function(v, index, r){
+        if(this.isSelected(r)){
+            v.onRowSelect(index);
+        }
+    },
+
+    /**
+     * Select records.
+     * @param {Array} records The records to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectRecords : function(records, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        var ds = this.grid.store,
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            this.selectRow(ds.indexOf(records[i]), true);
+        }
+    },
+
+    /**
+     * Gets the number of selected rows.
+     * @return {Number}
+     */
+    getCount : function(){
+        return this.selections.length;
+    },
+
+    /**
+     * Selects the first row in the grid.
+     */
+    selectFirstRow : function(){
+        this.selectRow(0);
+    },
+
+    /**
+     * Select the last row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectLastRow : function(keepExisting){
+        this.selectRow(this.grid.store.getCount() - 1, keepExisting);
+    },
+
+    /**
+     * Selects the row immediately following the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a next row, else <tt>false</tt>
+     */
+    selectNext : function(keepExisting){
+        if(this.hasNext()){
+            this.selectRow(this.last+1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Selects the row that precedes the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a previous row, else <tt>false</tt>
+     */
+    selectPrevious : function(keepExisting){
+        if(this.hasPrevious()){
+            this.selectRow(this.last-1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Returns true if there is a next record to select
+     * @return {Boolean}
+     */
+    hasNext : function(){
+        return this.last !== false && (this.last+1) < this.grid.store.getCount();
+    },
+
+    /**
+     * Returns true if there is a previous record to select
+     * @return {Boolean}
+     */
+    hasPrevious : function(){
+        return !!this.last;
+    },
+
+
+    /**
+     * Returns the selected records
+     * @return {Array} Array of selected records
+     */
+    getSelections : function(){
+        return [].concat(this.selections.items);
+    },
+
+    /**
+     * Returns the first selected record.
+     * @return {Record}
+     */
+    getSelected : function(){
+        return this.selections.itemAt(0);
+    },
+
+    /**
+     * Calls the passed function with each selection. If the function returns
+     * <tt>false</tt>, iteration is stopped and this function returns
+     * <tt>false</tt>. Otherwise it returns <tt>true</tt>.
+     * @param {Function} fn The function to call upon each iteration. It is passed the selected {@link Ext.data.Record Record}.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this RowSelectionModel.
+     * @return {Boolean} true if all selections were iterated
+     */
+    each : function(fn, scope){
+        var s = this.getSelections(),
+            i = 0,
+            len = s.length;
+            
+        for(; i < len; i++){
+            if(fn.call(scope || this, s[i], i) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Clears all selections if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * @param {Boolean} fast (optional) <tt>true</tt> to bypass the
+     * conditional checks and events described in {@link #deselectRow}.
+     */
+    clearSelections : function(fast){
+        if(this.isLocked()){
+            return;
+        }
+        if(fast !== true){
+            var ds = this.grid.store,
+                s = this.selections;
+            s.each(function(r){
+                this.deselectRow(ds.indexOfId(r.id));
+            }, this);
+            s.clear();
+        }else{
+            this.selections.clear();
+        }
+        this.last = false;
+    },
+
+
+    /**
+     * Selects all rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}. 
+     */
+    selectAll : function(){
+        if(this.isLocked()){
+            return;
+        }
+        this.selections.clear();
+        for(var i = 0, len = this.grid.store.getCount(); i < len; i++){
+            this.selectRow(i, true);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selections.length > 0;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified row is selected.
+     * @param {Number/Record} index The record or index of the record to check
+     * @return {Boolean}
+     */
+    isSelected : function(index){
+        var r = Ext.isNumber(index) ? this.grid.store.getAt(index) : index;
+        return (r && this.selections.key(r.id) ? true : false);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified record id is selected.
+     * @param {String} id The id of record to check
+     * @return {Boolean}
+     */
+    isIdSelected : function(id){
+        return (this.selections.key(id) ? true : false);
+    },
+
+    // private
+    handleMouseDown : function(g, rowIndex, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        var view = this.grid.getView();
+        if(e.shiftKey && !this.singleSelect && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, rowIndex, e.ctrlKey);
+            this.last = last; // reset the last
+            view.focusRow(rowIndex);
+        }else{
+            var isSelected = this.isSelected(rowIndex);
+            if(e.ctrlKey && isSelected){
+                this.deselectRow(rowIndex);
+            }else if(!isSelected || this.getCount() > 1){
+                this.selectRow(rowIndex, e.ctrlKey || e.shiftKey);
+                view.focusRow(rowIndex);
+            }
+        }
+    },
+
+    /**
+     * Selects multiple rows.
+     * @param {Array} rows Array of the indexes of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep
+     * existing selections (defaults to <tt>false</tt>)
+     */
+    selectRows : function(rows, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        for(var i = 0, len = rows.length; i < len; i++){
+            this.selectRow(rows[i], true);
+        }
+    },
+
+    /**
+     * Selects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * All rows in between startRow and endRow are also selected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(startRow, endRow, keepExisting){
+        var i;
+        if(this.isLocked()){
+            return;
+        }
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        if(startRow <= endRow){
+            for(i = startRow; i <= endRow; i++){
+                this.selectRow(i, true);
+            }
+        }else{
+            for(i = startRow; i >= endRow; i--){
+                this.selectRow(i, true);
+            }
+        }
+    },
+
+    /**
+     * Deselects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.  
+     * All rows in between startRow and endRow are also deselected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     */
+    deselectRange : function(startRow, endRow, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        for(var i = startRow; i <= endRow; i++){
+            this.deselectRow(i, preventViewNotify);
+        }
+    },
+
+    /**
+     * Selects a row.  Before selecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked} and fires the
+     * {@link #beforerowselect} event.  If these checks are satisfied the row
+     * will be selected and followed up by  firing the {@link #rowselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} row The index of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    selectRow : function(index, keepExisting, preventViewNotify){
+        if(this.isLocked() || (index < 0 || index >= this.grid.store.getCount()) || (keepExisting && this.isSelected(index))){
+            return;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r && this.fireEvent('beforerowselect', this, index, keepExisting, r) !== false){
+            if(!keepExisting || this.singleSelect){
+                this.clearSelections();
+            }
+            this.selections.add(r);
+            this.last = this.lastActive = index;
+            if(!preventViewNotify){
+                this.grid.getView().onRowSelect(index);
+            }
+            if(!this.silent){
+                this.fireEvent('rowselect', this, index, r);
+                this.fireEvent('selectionchange', this);
+            }
+        }
+    },
+
+    /**
+     * Deselects a row.  Before deselecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked}.
+     * If this check is satisfied the row will be deselected and followed up by
+     * firing the {@link #rowdeselect} and {@link #selectionchange} events.
+     * @param {Number} row The index of the row to deselect
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    deselectRow : function(index, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        if(this.last == index){
+            this.last = false;
+        }
+        if(this.lastActive == index){
+            this.lastActive = false;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r){
+            this.selections.remove(r);
+            if(!preventViewNotify){
+                this.grid.getView().onRowDeselect(index);
+            }
+            this.fireEvent('rowdeselect', this, index, r);
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    },
+
+    // private
+    onEditorKey : function(field, e){
+        var k = e.getKey(), 
+            newCell, 
+            g = this.grid, 
+            last = g.lastEdit,
+            ed = g.activeEditor,
+            shift = e.shiftKey,
+            ae, last, r, c;
+            
+        if(k == e.TAB){
+            e.stopEvent();
+            ed.completeEdit();
+            if(shift){
+                newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
+            }else{
+                newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
+            }
+        }else if(k == e.ENTER){
+            if(this.moveEditorOnEnter !== false){
+                if(shift){
+                    newCell = g.walkCells(last.row - 1, last.col, -1, this.acceptsNav, this);
+                }else{
+                    newCell = g.walkCells(last.row + 1, last.col, 1, this.acceptsNav, this);
+                }
+            }
+        }
+        if(newCell){
+            r = newCell[0];
+            c = newCell[1];
+
+            this.onEditorSelect(r, last.row);
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+            }
+            g.startEditing(r, c);
+        }
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    },
+    
+    destroy : function(){
+        Ext.destroy(this.rowNav);
+        this.rowNav = null;
+        Ext.grid.RowSelectionModel.superclass.destroy.call(this);
+    }
+});
+/**
+ * @class Ext.grid.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.grid.Column = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} editable Optional. Defaults to <tt>true</tt>, enabling the configured
+     * <tt>{@link #editor}</tt>.  Set to <tt>false</tt> to initially disable editing on this column.
+     * The initial configuration may be dynamically altered using
+     * {@link Ext.grid.ColumnModel}.{@link Ext.grid.ColumnModel#setEditable setEditable()}.
+     */
+    /**
+     * @cfg {String} id Optional. A name which identifies this column (defaults to the column's initial
+     * ordinal position.) The <tt>id</tt> is used to create a CSS <b>class</b> name which is applied to all
+     * table cells (including headers) in that column (in this context the <tt>id</tt> does not need to be
+     * unique). The class name takes the form of <pre>x-grid3-td-<b>id</b></pre>
+     * Header cells will also receive this class name, but will also have the class <pre>x-grid3-hd</pre>
+     * So, to target header cells, use CSS selectors such as:<pre>.x-grid3-hd-row .x-grid3-td-<b>id</b></pre>
+     * The {@link Ext.grid.GridPanel#autoExpandColumn} grid config option references the column via this
+     * unique identifier.
+     */
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the Grid view.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&amp;#160;'</tt>.
+     */
+    /**
+     * @cfg {Boolean} groupable Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to disable the header menu item to group by the column selected. Defaults to <tt>true</tt>,
+     * which enables the header menu group option.  Set to <tt>false</tt> to disable (but still show) the
+     * group option in the header menu for the column. See also <code>{@link #groupName}</code>.
+     */
+    /**
+     * @cfg {String} groupName Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text with which to prefix the group field value in the group header line.
+     * See also {@link #groupRenderer} and
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#showGroupName showGroupName}.
+     */
+    /**
+     * @cfg {Function} groupRenderer <p>Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the function used to format the grouping field value for display in the group
+     * {@link #groupName header}.  If a <tt><b>groupRenderer</b></tt> is not specified, the configured
+     * <tt><b>{@link #renderer}</b></tt> will be called; if a <tt><b>{@link #renderer}</b></tt> is also not specified
+     * the new value of the group field will be used.</p>
+     * <p>The called function (either the <tt><b>groupRenderer</b></tt> or <tt><b>{@link #renderer}</b></tt>) will be
+     * passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>v</b> : Object<p class="sub-desc">The new value of the group field.</p></li>
+     * <li><b>unused</b> : undefined<p class="sub-desc">Unused parameter.</p></li>
+     * <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">The column index of the group field.</p></li>
+     * <li><b>ds</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></p>
+     * <p>The function should return a string value.</p>
+     */
+    /**
+     * @cfg {String} emptyGroupText Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text to display when there is an empty group value. Defaults to the
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#emptyGroupText emptyGroupText}.
+     */
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * grid's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    /**
+     * @cfg {Number} width
+     * Optional. The initial width in pixels of the column.
+     * The width of each column can also be affected if any of the following are configured:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#forceFit forceFit}</tt>
+     * <div class="sub-desc">
+     * <p>By specifying <tt>forceFit:true</tt>, {@link #fixed non-fixed width} columns will be
+     * re-proportioned (based on the relative initial widths) to fill the width of the grid so
+     * that no horizontal scrollbar is shown.</p>
+     * </div></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#autoFill autoFill}</tt></li>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#minColumnWidth minColumnWidth}</tt></li>
+     * <br><p><b>Note</b>: when the width of each column is determined, a space on the right side
+     * is reserved for the vertical scrollbar.  The
+     * {@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#scrollOffset scrollOffset}</tt>
+     * can be modified to reduce or eliminate the reserved offset.</p>
+     */
+    /**
+     * @cfg {Boolean} sortable Optional. <tt>true</tt> if sorting is to be allowed on this column.
+     * Defaults to the value of the <code>{@link Ext.grid.ColumnModel#defaultSortable}</code> property.
+     * Whether local/remote sorting is used is specified in <code>{@link Ext.data.Store#remoteSort}</code>.
+     */
+    /**
+     * @cfg {Boolean} fixed Optional. <tt>true</tt> if the column width cannot be changed.  Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} resizable Optional. <tt>false</tt> to disable column resizing. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} menuDisabled Optional. <tt>true</tt> to disable the column menu. Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} hidden
+     * Optional. <tt>true</tt> to initially hide this column. Defaults to <tt>false</tt>.
+     * A hidden column {@link Ext.grid.GridPanel#enableColumnHide may be shown via the header row menu}.
+     * If a column is never to be shown, simply do not include this column in the Column Model at all.
+     */
+    /**
+     * @cfg {String} tooltip Optional. A text string to use as the column header's tooltip.  If Quicktips
+     * are enabled, this value will be used as the text of the quick tip, otherwise it will be set as the
+     * header's HTML title attribute. Defaults to ''.
+     */
+    /**
+     * @cfg {Mixed} renderer
+     * <p>For an alternative to specifying a renderer see <code>{@link #xtype}</code></p>
+     * <p>Optional. A renderer is an 'interceptor' method which can be used transform data (value,
+     * appearance, etc.) before it is rendered). This may be specified in either of three ways:
+     * <div class="mdetail-params"><ul>
+     * <li>A renderer function used to return HTML markup for a cell given the cell's data value.</li>
+     * <li>A string which references a property name of the {@link Ext.util.Format} class which
+     * provides a renderer function.</li>
+     * <li>An object specifying both the renderer function, and its execution scope (<tt><b>this</b></tt>
+     * reference) e.g.:<pre style="margin-left:1.2em"><code>
+{
+    fn: this.gridRenderer,
+    scope: this
+}
+</code></pre></li></ul></div>
+     * If not specified, the default renderer uses the raw data value.</p>
+     * <p>For information about the renderer function (passed parameters, etc.), see
+     * {@link Ext.grid.ColumnModel#setRenderer}. An example of specifying renderer function inline:</p><pre><code>
+var companyColumn = {
+   header: 'Company Name',
+   dataIndex: 'company',
+   renderer: function(value, metaData, record, rowIndex, colIndex, store) {
+      // provide the logic depending on business rules
+      // name of your own choosing to manipulate the cell depending upon
+      // the data in the underlying Record object.
+      if (value == 'whatever') {
+          //metaData.css : String : A CSS class name to add to the TD element of the cell.
+          //metaData.attr : String : An html attribute definition string to apply to
+          //                         the data container element within the table
+          //                         cell (e.g. 'style="color:red;"').
+          metaData.css = 'name-of-css-class-you-will-define';
+      }
+      return value;
+   }
+}
+     * </code></pre>
+     * See also {@link #scope}.
+     */
+    /**
+     * @cfg {String} xtype Optional. A String which references a predefined {@link Ext.grid.Column} subclass
+     * type which is preconfigured with an appropriate <code>{@link #renderer}</code> to be easily
+     * configured into a ColumnModel. The predefined {@link Ext.grid.Column} subclass types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>gridcolumn</tt></b> : {@link Ext.grid.Column} (<b>Default</b>)<p class="sub-desc"></p></li>
+     * <li><b><tt>booleancolumn</tt></b> : {@link Ext.grid.BooleanColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>numbercolumn</tt></b> : {@link Ext.grid.NumberColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>datecolumn</tt></b> : {@link Ext.grid.DateColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>templatecolumn</tt></b> : {@link Ext.grid.TemplateColumn}<p class="sub-desc"></p></li>
+     * </ul></div>
+     * <p>Configuration properties for the specified <code>xtype</code> may be specified with
+     * the Column configuration properties, for example:</p>
+     * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    columns: [{
+        header: 'Last Updated',
+        dataIndex: 'lastChange',
+        width: 85,
+        sortable: true,
+        //renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+        xtype: 'datecolumn', // use xtype instead of renderer
+        format: 'M/d/Y' // configuration property for {@link Ext.grid.DateColumn}
+    }, {
+        ...
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} scope Optional. The scope (<tt><b>this</b></tt> reference) in which to execute the
+     * renderer.  Defaults to the Column configuration object.
+     */
+    /**
+     * @cfg {String} align Optional. Set the CSS text-align property of the column.  Defaults to undefined.
+     */
+    /**
+     * @cfg {String} css Optional. An inline style definition string which is applied to all table cells in the column
+     * (excluding headers). Defaults to undefined.
+     */
+    /**
+     * @cfg {Boolean} hideable Optional. Specify as <tt>false</tt> to prevent the user from hiding this column
+     * (defaults to true).  To disallow column hiding globally for all columns in the grid, use
+     * {@link Ext.grid.GridPanel#enableColumnHide} instead.
+     */
+    /**
+     * @cfg {Ext.form.Field} editor Optional. The {@link Ext.form.Field} to use when editing values in this column
+     * if editing is supported by the grid. See <tt>{@link #editable}</tt> also.
+     */
+
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ColumnModel setConfig method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ColumnModel will recreate a new Ext.grid.Column
+     * Defaults to true.
+     */
+    isColumn : true,
+
+    constructor : function(config){
+        Ext.apply(this, config);
+
+        if(Ext.isString(this.renderer)){
+            this.renderer = Ext.util.Format[this.renderer];
+        }else if(Ext.isObject(this.renderer)){
+            this.scope = this.renderer.scope;
+            this.renderer = this.renderer.fn;
+        }
+        if(!this.scope){
+            this.scope = this;
+        }
+
+        var ed = this.editor;
+        delete this.editor;
+        this.setEditor(ed);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this Column is clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event contextmenu
+             * Fires when this Column is right clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event dblclick
+             * Fires when this Column is double clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event mousedown
+             * Fires when this Column receives a mousedown event.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'mousedown'
+        );
+        Ext.grid.Column.superclass.constructor.call(this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        return this.fireEvent(name, this, grid, rowIndex, e);
+    },
+
+    /**
+     * @private
+     * Clean up. Remove any Editor. Remove any listeners.
+     */
+    destroy: function() {
+        if(this.setEditor){
+            this.setEditor(null);
+        }
+        this.purgeListeners();
+    },
+
+    /**
+     * Optional. A function which returns displayable data when passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container
+     * element <i>within</i> the table cell (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was
+     * extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record
+     * was extracted.</p></li>
+     * </ul></div>
+     * @property renderer
+     * @type Function
+     */
+    renderer : function(value){
+        return value;
+    },
+
+    // private
+    getEditor: function(rowIndex){
+        return this.editable !== false ? this.editor : null;
+    },
+
+    /**
+     * Sets a new editor for this column.
+     * @param {Ext.Editor/Ext.form.Field} editor The editor to set
+     */
+    setEditor : function(editor){
+        var ed = this.editor;
+        if(ed){
+            if(ed.gridEditor){
+                ed.gridEditor.destroy();
+                delete ed.gridEditor;
+            }else{
+                ed.destroy();
+            }
+        }
+        this.editor = null;
+        if(editor){
+            //not an instance, create it
+            if(!editor.isXType){
+                editor = Ext.create(editor, 'textfield');
+            }
+            this.editor = editor;
+        }
+    },
+
+    /**
+     * Returns the {@link Ext.Editor editor} defined for this column that was created to wrap the {@link Ext.form.Field Field}
+     * used to edit the cell.
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor}
+     */
+    getCellEditor: function(rowIndex){
+        var ed = this.getEditor(rowIndex);
+        if(ed){
+            if(!ed.startEdit){
+                if(!ed.gridEditor){
+                    ed.gridEditor = new Ext.grid.GridEditor(ed);
+                }
+                ed = ed.gridEditor;
+            }
+        }
+        return ed;
+    }
+});
+
+/**
+ * @class Ext.grid.BooleanColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.grid.Column#xtype xtype}
+ * config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.BooleanColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsy (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsy (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&amp;#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+
+    constructor: function(cfg){
+        Ext.grid.BooleanColumn.superclass.constructor.call(this, cfg);
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        this.renderer = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+    }
+});
+
+/**
+ * @class Ext.grid.NumberColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.NumberColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */
+    format : '0,000.00',
+    constructor: function(cfg){
+        Ext.grid.NumberColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.numberRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.DateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column}
+ * for more details.</p>
+ */
+Ext.grid.DateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Date#format} to format a Date for this Column
+     * (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : 'm/d/Y',
+    constructor: function(cfg){
+        Ext.grid.DateColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.dateRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.TemplateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a value by processing a {@link Ext.data.Record Record}'s
+ * {@link Ext.data.Record#data data} using a {@link #tpl configured} {@link Ext.XTemplate XTemplate}.
+ * See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more
+ * details.</p>
+ */
+Ext.grid.TemplateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String/XTemplate} tpl
+     * An {@link Ext.XTemplate XTemplate}, or an XTemplate <i>definition string</i> to use to process a
+     * {@link Ext.data.Record Record}'s {@link Ext.data.Record#data data} to produce a column's rendered value.
+     */
+    constructor: function(cfg){
+        Ext.grid.TemplateColumn.superclass.constructor.call(this, cfg);
+        var tpl = (!Ext.isPrimitive(this.tpl) && this.tpl.compile) ? this.tpl : new Ext.XTemplate(this.tpl);
+        this.renderer = function(value, p, r){
+            return tpl.apply(r.data);
+        };
+        this.tpl = tpl;
+    }
+});
+
+/**
+ * @class Ext.grid.ActionColumn
+ * @extends Ext.grid.Column
+ * <p>A Grid column type which renders an icon, or a series of icons in a grid cell, and offers a scoped click
+ * handler for each icon. Example usage:</p>
+<pre><code>
+new Ext.grid.GridPanel({
+    store: myStore,
+    columns: [
+        {
+            xtype: 'actioncolumn',
+            width: 50,
+            items: [
+                {
+                    icon   : 'sell.gif',                // Use a URL in the icon config
+                    tooltip: 'Sell stock',
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Sell " + rec.get('company'));
+                    }
+                },
+                {
+                    getClass: function(v, meta, rec) {  // Or return a class from a function
+                        if (rec.get('change') < 0) {
+                            this.items[1].tooltip = 'Do not buy!';
+                            return 'alert-col';
+                        } else {
+                            this.items[1].tooltip = 'Buy stock';
+                            return 'buy-col';
+                        }
+                    },
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Buy " + rec.get('company'));
+                    }
+                }
+            ]
+        }
+        //any other columns here
+    ]
+});
+</pre></code>
+ * <p>The action column can be at any index in the columns array, and a grid can have any number of
+ * action columns. </p>
+ */
+Ext.grid.ActionColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} icon
+     * The URL of an image to display as the clickable element in the column. 
+     * Optional - defaults to <code>{@link Ext#BLANK_IMAGE_URL Ext.BLANK_IMAGE_URL}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a <code>{@link #getClass}</code> function.
+     */
+    /**
+     * @cfg {Function} handler A function called when the icon is clicked.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>grid</code> : GridPanel<div class="sub-desc">The owning GridPanel.</div></li>
+     * <li><code>rowIndex</code> : Number<div class="sub-desc">The row index clicked on.</div></li>
+     * <li><code>colIndex</code> : Number<div class="sub-desc">The column index clicked on.</div></li>
+     * <li><code>item</code> : Object<div class="sub-desc">The clicked item (or this Column if multiple 
+     * {@link #items} were not configured).</div></li>
+     * <li><code>e</code> : Event<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * and <code>{@link #getClass}</code> fuctions are executed. Defaults to this Column.
+     */
+    /**
+     * @cfg {String} tooltip A tooltip message to be displayed on hover. {@link Ext.QuickTips#init Ext.QuickTips} must have 
+     * been initialized.
+     */
+    /**
+     * @cfg {Boolean} stopSelection Defaults to <code>true</code>. Prevent grid <i>row</i> selection upon mousedown.
+     */
+    /**
+     * @cfg {Function} getClass A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<div class="mdetail-params"><ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Array} items An Array which may contain multiple icon definitions, each element of which may contain:
+     * <div class="mdetail-params"><ul>
+     * <li><code>icon</code> : String<div class="sub-desc">The url of an image to display as the clickable element 
+     * in the column.</div></li>
+     * <li><code>iconCls</code> : String<div class="sub-desc">A CSS class to apply to the icon image.
+     * To determine the class dynamically, configure the item with a <code>getClass</code> function.</div></li>
+     * <li><code>getClass</code> : Function<div class="sub-desc">A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></li>
+     * <li><code>handler</code> : Function<div class="sub-desc">A function called when the icon is clicked.</div></li>
+     * <li><code>scope</code> : Scope<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the 
+     * <code>handler</code> and <code>getClass</code> functions are executed. Fallback defaults are this Column's
+     * configured scope, then this Column.</div></li>
+     * <li><code>tooltip</code> : String<div class="sub-desc">A tooltip message to be displayed on hover. 
+     * {@link Ext.QuickTips#init Ext.QuickTips} must have been initialized.</div></li>
+     * </ul></div>
+     */
+    header: '&#160;',
+
+    actionIdRe: /x-action-col-(\d+)/,
+    
+    /**
+     * @cfg {String} altText The alt text to use for the image element. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+
+    constructor: function(cfg) {
+        var me = this,
+            items = cfg.items || (me.items = [me]),
+            l = items.length,
+            i,
+            item;
+
+        Ext.grid.ActionColumn.superclass.constructor.call(me, cfg);
+
+//      Renderer closure iterates through items creating an <img> element for each and tagging with an identifying 
+//      class name x-action-col-{n}
+        me.renderer = function(v, meta) {
+//          Allow a configured renderer to create initial value (And set the other values in the "metadata" argument!)
+            v = Ext.isFunction(cfg.renderer) ? cfg.renderer.apply(this, arguments)||'' : '';
+
+            meta.css += ' x-action-col-cell';
+            for (i = 0; i < l; i++) {
+                item = items[i];
+                v += '<img alt="' + (item.altText || me.altText) + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
+                    '" class="x-action-col-icon x-action-col-' + String(i) + ' ' + (item.iconCls || '') +
+                    ' ' + (Ext.isFunction(item.getClass) ? item.getClass.apply(item.scope||this.scope||this, arguments) : '') + '"' +
+                    ((item.tooltip) ? ' ext:qtip="' + item.tooltip + '"' : '') + ' />';
+            }
+            return v;
+        };
+    },
+
+    destroy: function() {
+        delete this.items;
+        delete this.renderer;
+        return Ext.grid.ActionColumn.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Also fires any configured click handlers. By default, cancels the mousedown event to prevent selection.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        var m = e.getTarget().className.match(this.actionIdRe),
+            item, fn;
+        if (m && (item = this.items[parseInt(m[1], 10)])) {
+            if (name == 'click') {
+                (fn = item.handler || this.handler) && fn.call(item.scope||this.scope||this, grid, rowIndex, colIndex, item, e);
+            } else if ((name == 'mousedown') && (item.stopSelection !== false)) {
+                return false;
+            }
+        }
+        return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments);
+    }
+});
+
+/*
+ * @property types
+ * @type Object
+ * @member Ext.grid.Column
+ * @static
+ * <p>An object containing predefined Column classes keyed by a mnemonic code which may be referenced
+ * by the {@link Ext.grid.ColumnModel#xtype xtype} config option of ColumnModel.</p>
+ * <p>This contains the following properties</p><div class="mdesc-details"><ul>
+ * <li>gridcolumn : <b>{@link Ext.grid.Column Column constructor}</b></li>
+ * <li>booleancolumn : <b>{@link Ext.grid.BooleanColumn BooleanColumn constructor}</b></li>
+ * <li>numbercolumn : <b>{@link Ext.grid.NumberColumn NumberColumn constructor}</b></li>
+ * <li>datecolumn : <b>{@link Ext.grid.DateColumn DateColumn constructor}</b></li>
+ * <li>templatecolumn : <b>{@link Ext.grid.TemplateColumn TemplateColumn constructor}</b></li>
+ * </ul></div>
+ */
+Ext.grid.Column.types = {
+    gridcolumn : Ext.grid.Column,
+    booleancolumn: Ext.grid.BooleanColumn,
+    numbercolumn: Ext.grid.NumberColumn,
+    datecolumn: Ext.grid.DateColumn,
+    templatecolumn: Ext.grid.TemplateColumn,
+    actioncolumn: Ext.grid.ActionColumn
+};/**
+ * @class Ext.grid.RowNumberer
+ * This is a utility class that can be passed into a {@link Ext.grid.ColumnModel} as a column config that provides
+ * an automatic row numbering column.
+ * <br>Usage:<br>
+ <pre><code>
+ // This is a typical column config with the first column providing row numbers
+ var colModel = new Ext.grid.ColumnModel([
+    new Ext.grid.RowNumberer(),
+    {header: "Name", width: 80, sortable: true},
+    {header: "Code", width: 50, sortable: true},
+    {header: "Description", width: 200, sortable: true}
+ ]);
+ </code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.RowNumberer = Ext.extend(Object, {
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the row
+     * number column (defaults to '').
+     */
+    header: "",
+    /**
+     * @cfg {Number} width The default width in pixels of the row number column (defaults to 23).
+     */
+    width: 23,
+    /**
+     * @cfg {Boolean} sortable True if the row number column is sortable (defaults to false).
+     * @hide
+     */
+    sortable: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        if(this.rowspan){
+            this.renderer = this.renderer.createDelegate(this);
+        }
+    },
+
+    // private
+    fixed:true,
+    hideable: false,
+    menuDisabled:true,
+    dataIndex: '',
+    id: 'numberer',
+    rowspan: undefined,
+
+    // private
+    renderer : function(v, p, record, rowIndex){
+        if(this.rowspan){
+            p.cellAttr = 'rowspan="'+this.rowspan+'"';
+        }
+        return rowIndex+1;
+    }
+});/**
+ * @class Ext.grid.CheckboxSelectionModel
+ * @extends Ext.grid.RowSelectionModel
+ * A custom selection model that renders a column of checkboxes that can be toggled to select or deselect rows.
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
+
+    /**
+     * @cfg {Boolean} checkOnly <tt>true</tt> if rows can only be selected by clicking on the
+     * checkbox column (defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the
+     * checkbox column.  Defaults to:<pre><code>
+     * '&lt;div class="x-grid3-hd-checker">&#38;#160;&lt;/div>'</tt>
+     * </code></pre>
+     * The default CSS class of <tt>'x-grid3-hd-checker'</tt> displays a checkbox in the header
+     * and provides support for automatic check all/none behavior on header click. This string
+     * can be replaced by any valid HTML fragment, including a simple text string (e.g.,
+     * <tt>'Select Rows'</tt>), but the automatic check all/none behavior will only work if the
+     * <tt>'x-grid3-hd-checker'</tt> class is supplied.
+     */
+    header : '<div class="x-grid3-hd-checker">&#160;</div>',
+    /**
+     * @cfg {Number} width The default width in pixels of the checkbox column (defaults to <tt>20</tt>).
+     */
+    width : 20,
+    /**
+     * @cfg {Boolean} sortable <tt>true</tt> if the checkbox column is sortable (defaults to
+     * <tt>false</tt>).
+     */
+    sortable : false,
+
+    // private
+    menuDisabled : true,
+    fixed : true,
+    hideable: false,
+    dataIndex : '',
+    id : 'checker',
+    isColumn: true, // So that ColumnModel doesn't feed this through the Column constructor
+
+    constructor : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this, arguments);
+        if(this.checkOnly){
+            this.handleMouseDown = Ext.emptyFn;
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
+        this.grid.on('render', function(){
+            Ext.fly(this.grid.getView().innerHd).on('mousedown', this.onHdMouseDown, this);
+        }, this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        if (name == 'mousedown') {
+            this.onMouseDown(e, e.getTarget());
+            return false;
+        } else {
+            return Ext.grid.Column.prototype.processEvent.apply(this, arguments);
+        }
+    },
+
+    // private
+    onMouseDown : function(e, t){
+        if(e.button === 0 && t.className == 'x-grid3-row-checker'){ // Only fire if left-click
+            e.stopEvent();
+            var row = e.getTarget('.x-grid3-row');
+            if(row){
+                var index = row.rowIndex;
+                if(this.isSelected(index)){
+                    this.deselectRow(index);
+                }else{
+                    this.selectRow(index, true);
+                    this.grid.getView().focusRow(index);
+                }
+            }
+        }
+    },
+
+    // private
+    onHdMouseDown : function(e, t) {
+        if(t.className == 'x-grid3-hd-checker'){
+            e.stopEvent();
+            var hd = Ext.fly(t.parentNode);
+            var isChecked = hd.hasClass('x-grid3-hd-checker-on');
+            if(isChecked){
+                hd.removeClass('x-grid3-hd-checker-on');
+                this.clearSelections();
+            }else{
+                hd.addClass('x-grid3-hd-checker-on');
+                this.selectAll();
+            }
+        }
+    },
+
+    // private
+    renderer : function(v, p, record){
+        return '<div class="x-grid3-row-checker">&#160;</div>';
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row && !this.checkOnly){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tabs-debug.js	(revision 76)
@@ -0,0 +1,1132 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.TabPanel
+ * <p>A basic tab container. TabPanels can be used exactly like a standard {@link Ext.Panel}
+ * for layout purposes, but also have special support for containing child Components
+ * (<tt>{@link Ext.Container#items items}</tt>) that are managed using a
+ * {@link Ext.layout.CardLayout CardLayout layout manager}, and displayed as separate tabs.</p>
+ *
+ * <b>Note:</b> By default, a tab's close tool <i>destroys</i> the child tab Component
+ * and all its descendants. This makes the child tab Component, and all its descendants <b>unusable</b>. To enable
+ * re-use of a tab, configure the TabPanel with <b><code>{@link #autoDestroy autoDestroy: false}</code></b>.
+ *
+ * <p><b><u>TabPanel header/footer elements</u></b></p>
+ * <p>TabPanels use their {@link Ext.Panel#header header} or {@link Ext.Panel#footer footer} element
+ * (depending on the {@link #tabPosition} configuration) to accommodate the tab selector buttons.
+ * This means that a TabPanel will not display any configured title, and will not display any
+ * configured header {@link Ext.Panel#tools tools}.</p>
+ * <p>To display a header, embed the TabPanel in a {@link Ext.Panel Panel} which uses
+ * <b><tt>{@link Ext.Container#layout layout:'fit'}</tt></b>.</p>
+ *
+ * <p><b><u>Tab Events</u></b></p>
+ * <p>There is no actual tab class &mdash; each tab is simply a {@link Ext.BoxComponent Component}
+ * such as a {@link Ext.Panel Panel}. However, when rendered in a TabPanel, each child Component
+ * can fire additional events that only exist for tabs and are not available from other Components.
+ * These events are:</p>
+ * <div><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.Panel#activate activate}</b></tt> : Fires when this Component becomes
+ * the active tab.</li>
+ * <li><tt><b>{@link Ext.Panel#deactivate deactivate}</b></tt> : Fires when the Component that
+ * was the active tab becomes deactivated.</li>
+ * <li><tt><b>{@link Ext.Panel#beforeclose beforeclose}</b></tt> : Fires when the user clicks on the close tool of a closeable tab.
+ * May be vetoed by returning <code>false</code> from a handler.</li>
+ * <li><tt><b>{@link Ext.Panel#close close}</b></tt> : Fires a closeable tab has been closed by the user.</li>
+ * </ul></div>
+ * <p><b><u>Creating TabPanels from Code</u></b></p>
+ * <p>TabPanels can be created and rendered completely in code, as in this example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: Ext.getBody(),
+    activeTab: 0,
+    items: [{
+        title: 'Tab 1',
+        html: 'A simple tab'
+    },{
+        title: 'Tab 2',
+        html: 'Another one'
+    }]
+});
+</code></pre>
+ * <p><b><u>Creating TabPanels from Existing Markup</u></b></p>
+ * <p>TabPanels can also be rendered from pre-existing markup in a couple of ways.</p>
+ * <div><ul class="mdetail-params">
+ *
+ * <li>Pre-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A container div with one or more nested tab divs with class <tt>'x-tab'</tt> can be rendered entirely
+ * from existing markup (See the {@link #autoTabs} example).</p>
+ * </div>
+ *
+ * <li>Un-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A TabPanel can also be rendered from markup that is not strictly structured by simply specifying by id
+ * which elements should be the container and the tabs. Using this method tab content can be pulled from different
+ * elements within the page by id regardless of page structure. For example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: 'my-tabs',
+    activeTab: 0,
+    items:[
+        {contentEl:'tab1', title:'Tab 1'},
+        {contentEl:'tab2', title:'Tab 2'}
+    ]
+});
+
+// Note that the tabs do not have to be nested within the container (although they can be)
+&lt;div id="my-tabs">&lt;/div>
+&lt;div id="tab1" class="x-hide-display">A simple tab&lt;/div>
+&lt;div id="tab2" class="x-hide-display">Another one&lt;/div>
+</code></pre>
+ * Note that the tab divs in this example contain the class <tt>'x-hide-display'</tt> so that they can be rendered
+ * deferred without displaying outside the tabs. You could alternately set <tt>{@link #deferredRender} = false </tt>
+ * to render all content tabs on page load.
+ * </div>
+ *
+ * </ul></div>
+ *
+ * @extends Ext.Panel
+ * @constructor
+ * @param {Object} config The configuration options
+ * @xtype tabpanel
+ */
+Ext.TabPanel = Ext.extend(Ext.Panel,  {
+    /**
+     * @cfg {Boolean} layoutOnTabChange
+     * Set to true to force a layout of the active tab when the tab is changed. Defaults to false.
+     * See {@link Ext.layout.CardLayout}.<code>{@link Ext.layout.CardLayout#layoutOnCardChange layoutOnCardChange}</code>.
+     */
+    /**
+     * @cfg {String} tabCls <b>This config option is used on <u>child Components</u> of ths TabPanel.</b> A CSS
+     * class name applied to the tab strip item representing the child Component, allowing special
+     * styling to be applied.
+     */
+    /**
+     * @cfg {Boolean} deferredRender
+     * <p><tt>true</tt> by default to defer the rendering of child <tt>{@link Ext.Container#items items}</tt>
+     * to the browsers DOM until a tab is activated. <tt>false</tt> will render all contained
+     * <tt>{@link Ext.Container#items items}</tt> as soon as the {@link Ext.layout.CardLayout layout}
+     * is rendered. If there is a significant amount of content or a lot of heavy controls being
+     * rendered into panels that are not displayed by default, setting this to <tt>true</tt> might
+     * improve performance.</p>
+     * <br><p>The <tt>deferredRender</tt> property is internally passed to the layout manager for
+     * TabPanels ({@link Ext.layout.CardLayout}) as its {@link Ext.layout.CardLayout#deferredRender}
+     * configuration value.</p>
+     * <br><p><b>Note</b>: leaving <tt>deferredRender</tt> as <tt>true</tt> means that the content
+     * within an unactivated tab will not be available. For example, this means that if the TabPanel
+     * is within a {@link Ext.form.FormPanel form}, then until a tab is activated, any Fields within
+     * unactivated tabs will not be rendered, and will therefore not be submitted and will not be
+     * available to either {@link Ext.form.BasicForm#getValues getValues} or
+     * {@link Ext.form.BasicForm#setValues setValues}.</p>
+     */
+    deferredRender : true,
+    /**
+     * @cfg {Number} tabWidth The initial width in pixels of each new tab (defaults to 120).
+     */
+    tabWidth : 120,
+    /**
+     * @cfg {Number} minTabWidth The minimum width in pixels for each tab when {@link #resizeTabs} = true (defaults to 30).
+     */
+    minTabWidth : 30,
+    /**
+     * @cfg {Boolean} resizeTabs True to automatically resize each tab so that the tabs will completely fill the
+     * tab strip (defaults to false).  Setting this to true may cause specific widths that might be set per tab to
+     * be overridden in order to fit them all into view (although {@link #minTabWidth} will always be honored).
+     */
+    resizeTabs : false,
+    /**
+     * @cfg {Boolean} enableTabScroll True to enable scrolling to tabs that may be invisible due to overflowing the
+     * overall TabPanel width. Only available with tabPosition:'top' (defaults to false).
+     */
+    enableTabScroll : false,
+    /**
+     * @cfg {Number} scrollIncrement The number of pixels to scroll each time a tab scroll button is pressed
+     * (defaults to <tt>100</tt>, or if <tt>{@link #resizeTabs} = true</tt>, the calculated tab width).  Only
+     * applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    scrollIncrement : 0,
+    /**
+     * @cfg {Number} scrollRepeatInterval Number of milliseconds between each scroll while a tab scroll button is
+     * continuously pressed (defaults to <tt>400</tt>).
+     */
+    scrollRepeatInterval : 400,
+    /**
+     * @cfg {Float} scrollDuration The number of milliseconds that each scroll animation should last (defaults
+     * to <tt>.35</tt>). Only applies when <tt>{@link #animScroll} = true</tt>.
+     */
+    scrollDuration : 0.35,
+    /**
+     * @cfg {Boolean} animScroll True to animate tab scrolling so that hidden tabs slide smoothly into view (defaults
+     * to <tt>true</tt>).  Only applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    animScroll : true,
+    /**
+     * @cfg {String} tabPosition The position where the tab strip should be rendered (defaults to <tt>'top'</tt>).
+     * The only other supported value is <tt>'bottom'</tt>.  <b>Note</b>: tab scrolling is only supported for
+     * <tt>tabPosition: 'top'</tt>.
+     */
+    tabPosition : 'top',
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the panel (defaults to <tt>'x-tab-panel'</tt>).
+     */
+    baseCls : 'x-tab-panel',
+    /**
+     * @cfg {Boolean} autoTabs
+     * <p><tt>true</tt> to query the DOM for any divs with a class of 'x-tab' to be automatically converted
+     * to tabs and added to this panel (defaults to <tt>false</tt>).  Note that the query will be executed within
+     * the scope of the container element only (so that multiple tab panels from markup can be supported via this
+     * method).</p>
+     * <p>This method is only possible when the markup is structured correctly as a container with nested divs
+     * containing the class <tt>'x-tab'</tt>. To create TabPanels without these limitations, or to pull tab content
+     * from other elements on the page, see the example at the top of the class for generating tabs from markup.</p>
+     * <p>There are a couple of things to note when using this method:<ul>
+     * <li>When using the <tt>autoTabs</tt> config (as opposed to passing individual tab configs in the TabPanel's
+     * {@link #items} collection), you must use <tt>{@link #applyTo}</tt> to correctly use the specified <tt>id</tt>
+     * as the tab container. The <tt>autoTabs</tt> method <em>replaces</em> existing content with the TabPanel
+     * components.</li>
+     * <li>Make sure that you set <tt>{@link #deferredRender}: false</tt> so that the content elements for each
+     * tab will be rendered into the TabPanel immediately upon page load, otherwise they will not be transformed
+     * until each tab is activated and will be visible outside the TabPanel.</li>
+     * </ul>Example usage:</p>
+     * <pre><code>
+var tabs = new Ext.TabPanel({
+    applyTo: 'my-tabs',
+    activeTab: 0,
+    deferredRender: false,
+    autoTabs: true
+});
+
+// This markup will be converted to a TabPanel from the code above
+&lt;div id="my-tabs">
+    &lt;div class="x-tab" title="Tab 1">A simple tab&lt;/div>
+    &lt;div class="x-tab" title="Tab 2">Another one&lt;/div>
+&lt;/div>
+</code></pre>
+     */
+    autoTabs : false,
+    /**
+     * @cfg {String} autoTabSelector The CSS selector used to search for tabs in existing markup when
+     * <tt>{@link #autoTabs} = true</tt> (defaults to <tt>'div.x-tab'</tt>).  This can be any valid selector
+     * supported by {@link Ext.DomQuery#select}. Note that the query will be executed within the scope of this
+     * tab panel only (so that multiple tab panels from markup can be supported on a page).
+     */
+    autoTabSelector : 'div.x-tab',
+    /**
+     * @cfg {String/Number} activeTab A string id or the numeric index of the tab that should be initially
+     * activated on render (defaults to undefined).
+     */
+    activeTab : undefined,
+    /**
+     * @cfg {Number} tabMargin The number of pixels of space to calculate into the sizing and scrolling of
+     * tabs. If you change the margin in CSS, you will need to update this value so calculations are correct
+     * with either <tt>{@link #resizeTabs}</tt> or scrolling tabs. (defaults to <tt>2</tt>)
+     */
+    tabMargin : 2,
+    /**
+     * @cfg {Boolean} plain </tt>true</tt> to render the tab strip without a background container image
+     * (defaults to <tt>false</tt>).
+     */
+    plain : false,
+    /**
+     * @cfg {Number} wheelIncrement For scrolling tabs, the number of pixels to increment on mouse wheel
+     * scrolling (defaults to <tt>20</tt>).
+     */
+    wheelIncrement : 20,
+
+    /*
+     * This is a protected property used when concatenating tab ids to the TabPanel id for internal uniqueness.
+     * It does not generally need to be changed, but can be if external code also uses an id scheme that can
+     * potentially clash with this one.
+     */
+    idDelimiter : '__',
+
+    // private
+    itemCls : 'x-tab-item',
+
+    // private config overrides
+    elements : 'body',
+    headerAsText : false,
+    frame : false,
+    hideBorders :true,
+
+    // private
+    initComponent : function(){
+        this.frame = false;
+        Ext.TabPanel.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforetabchange
+             * Fires before the active tab changes. Handlers can <tt>return false</tt> to cancel the tab change.
+             * @param {TabPanel} this
+             * @param {Panel} newTab The tab being activated
+             * @param {Panel} currentTab The current active tab
+             */
+            'beforetabchange',
+            /**
+             * @event tabchange
+             * Fires after the active tab has changed.
+             * @param {TabPanel} this
+             * @param {Panel} tab The new active tab
+             */
+            'tabchange',
+            /**
+             * @event contextmenu
+             * Relays the contextmenu event from a tab selector element in the tab strip.
+             * @param {TabPanel} this
+             * @param {Panel} tab The target tab
+             * @param {EventObject} e
+             */
+            'contextmenu'
+        );
+        /**
+         * @cfg {Object} layoutConfig
+         * TabPanel implicitly uses {@link Ext.layout.CardLayout} as its layout manager.
+         * <code>layoutConfig</code> may be used to configure this layout manager.
+         * <code>{@link #deferredRender}</code> and <code>{@link #layoutOnTabChange}</code>
+         * configured on the TabPanel will be applied as configs to the layout manager.
+         */
+        this.setLayout(new Ext.layout.CardLayout(Ext.apply({
+            layoutOnCardChange: this.layoutOnTabChange,
+            deferredRender: this.deferredRender
+        }, this.layoutConfig)));
+
+        if(this.tabPosition == 'top'){
+            this.elements += ',header';
+            this.stripTarget = 'header';
+        }else {
+            this.elements += ',footer';
+            this.stripTarget = 'footer';
+        }
+        if(!this.stack){
+            this.stack = Ext.TabPanel.AccessStack();
+        }
+        this.initItems();
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.TabPanel.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            var pos = this.tabPosition == 'top' ? 'header' : 'footer';
+            this[pos].addClass('x-tab-panel-'+pos+'-plain');
+        }
+
+        var st = this[this.stripTarget];
+
+        this.stripWrap = st.createChild({cls:'x-tab-strip-wrap', cn:{
+            tag:'ul', cls:'x-tab-strip x-tab-strip-'+this.tabPosition}});
+
+        var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);
+        st.createChild({cls:'x-tab-strip-spacer'}, beforeEl);
+        this.strip = new Ext.Element(this.stripWrap.dom.firstChild);
+
+        // create an empty span with class x-tab-strip-text to force the height of the header element when there's no tabs.
+        this.edge = this.strip.createChild({tag:'li', cls:'x-tab-edge', cn: [{tag: 'span', cls: 'x-tab-strip-text', cn: '&#160;'}]});
+        this.strip.createChild({cls:'x-clear'});
+
+        this.body.addClass('x-tab-panel-body-'+this.tabPosition);
+
+        /**
+         * @cfg {Template/XTemplate} itemTpl <p>(Optional) A {@link Ext.Template Template} or
+         * {@link Ext.XTemplate XTemplate} which may be provided to process the data object returned from
+         * <tt>{@link #getTemplateArgs}</tt> to produce a clickable selector element in the tab strip.</p>
+         * <p>The main element created should be a <tt>&lt;li></tt> element. In order for a click event on
+         * a selector element to be connected to its item, it must take its <i>id</i> from the TabPanel's
+         * native <tt>{@link #getTemplateArgs}</tt>.</p>
+         * <p>The child element which contains the title text must be marked by the CSS class
+         * <tt>x-tab-strip-inner</tt>.</p>
+         * <p>To enable closability, the created element should contain an element marked by the CSS class
+         * <tt>x-tab-strip-close</tt>.</p>
+         * <p>If a custom <tt>itemTpl</tt> is supplied, it is the developer's responsibility to create CSS
+         * style rules to create the desired appearance.</p>
+         * Below is an example of how to create customized tab selector items:<pre><code>
+new Ext.TabPanel({
+    renderTo: document.body,
+    minTabWidth: 115,
+    tabWidth: 135,
+    enableTabScroll: true,
+    width: 600,
+    height: 250,
+    defaults: {autoScroll:true},
+    itemTpl: new Ext.XTemplate(
+    '&lt;li class="{cls}" id="{id}" style="overflow:hidden">',
+         '&lt;tpl if="closable">',
+            '&lt;a class="x-tab-strip-close">&lt;/a>',
+         '&lt;/tpl>',
+         '&lt;a class="x-tab-right" href="#" style="padding-left:6px">',
+            '&lt;em class="x-tab-left">',
+                '&lt;span class="x-tab-strip-inner">',
+                    '&lt;img src="{src}" style="float:left;margin:3px 3px 0 0">',
+                    '&lt;span style="margin-left:20px" class="x-tab-strip-text {iconCls}">{text} {extra}&lt;/span>',
+                '&lt;/span>',
+            '&lt;/em>',
+        '&lt;/a>',
+    '&lt;/li>'
+    ),
+    getTemplateArgs: function(item) {
+//      Call the native method to collect the base data. Like the ID!
+        var result = Ext.TabPanel.prototype.getTemplateArgs.call(this, item);
+
+//      Add stuff used in our template
+        return Ext.apply(result, {
+            closable: item.closable,
+            src: item.iconSrc,
+            extra: item.extraText || ''
+        });
+    },
+    items: [{
+        title: 'New Tab 1',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 1',
+        closable: true
+    }, {
+        title: 'New Tab 2',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 2',
+        extraText: 'Extra stuff in the tab button'
+    }]
+});
+</code></pre>
+         */
+        if(!this.itemTpl){
+            var tt = new Ext.Template(
+                 '<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>',
+                 '<a class="x-tab-right" href="#"><em class="x-tab-left">',
+                 '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',
+                 '</em></a></li>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.TabPanel.prototype.itemTpl = tt;
+        }
+
+        this.items.each(this.initTab, this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.TabPanel.superclass.afterRender.call(this);
+        if(this.autoTabs){
+            this.readTabs(false);
+        }
+        if(this.activeTab !== undefined){
+            var item = Ext.isObject(this.activeTab) ? this.activeTab : this.items.get(this.activeTab);
+            delete this.activeTab;
+            this.setActiveTab(item);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.TabPanel.superclass.initEvents.call(this);
+        this.mon(this.strip, {
+            scope: this,
+            mousedown: this.onStripMouseDown,
+            contextmenu: this.onStripContextMenu
+        });
+        if(this.enableTabScroll){
+            this.mon(this.strip, 'mousewheel', this.onWheel, this);
+        }
+    },
+
+    // private
+    findTargets : function(e){
+        var item = null,
+            itemEl = e.getTarget('li:not(.x-tab-edge)', this.strip);
+
+        if(itemEl){
+            item = this.getComponent(itemEl.id.split(this.idDelimiter)[1]);
+            if(item.disabled){
+                return {
+                    close : null,
+                    item : null,
+                    el : null
+                };
+            }
+        }
+        return {
+            close : e.getTarget('.x-tab-strip-close', this.strip),
+            item : item,
+            el : itemEl
+        };
+    },
+
+    // private
+    onStripMouseDown : function(e){
+        if(e.button !== 0){
+            return;
+        }
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.close){
+            if (t.item.fireEvent('beforeclose', t.item) !== false) {
+                t.item.fireEvent('close', t.item);
+                this.remove(t.item);
+            }
+            return;
+        }
+        if(t.item && t.item != this.activeTab){
+            this.setActiveTab(t.item);
+        }
+    },
+
+    // private
+    onStripContextMenu : function(e){
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.item){
+            this.fireEvent('contextmenu', this, t.item, e);
+        }
+    },
+
+    /**
+     * True to scan the markup in this tab panel for <tt>{@link #autoTabs}</tt> using the
+     * <tt>{@link #autoTabSelector}</tt>
+     * @param {Boolean} removeExisting True to remove existing tabs
+     */
+    readTabs : function(removeExisting){
+        if(removeExisting === true){
+            this.items.each(function(item){
+                this.remove(item);
+            }, this);
+        }
+        var tabs = this.el.query(this.autoTabSelector);
+        for(var i = 0, len = tabs.length; i < len; i++){
+            var tab = tabs[i],
+                title = tab.getAttribute('title');
+            tab.removeAttribute('title');
+            this.add({
+                title: title,
+                contentEl: tab
+            });
+        }
+    },
+
+    // private
+    initTab : function(item, index){
+        var before = this.strip.dom.childNodes[index],
+            p = this.getTemplateArgs(item),
+            el = before ?
+                 this.itemTpl.insertBefore(before, p) :
+                 this.itemTpl.append(this.strip, p),
+            cls = 'x-tab-strip-over',
+            tabEl = Ext.get(el);
+
+        tabEl.hover(function(){
+            if(!item.disabled){
+                tabEl.addClass(cls);
+            }
+        }, function(){
+            tabEl.removeClass(cls);
+        });
+
+        if(item.tabTip){
+            tabEl.child('span.x-tab-strip-text', true).qtip = item.tabTip;
+        }
+        item.tabEl = el;
+
+        // Route *keyboard triggered* click events to the tab strip mouse handler.
+        tabEl.select('a').on('click', function(e){
+            if(!e.getPageX()){
+                this.onStripMouseDown(e);
+            }
+        }, this, {preventDefault: true});
+
+        item.on({
+            scope: this,
+            disable: this.onItemDisabled,
+            enable: this.onItemEnabled,
+            titlechange: this.onItemTitleChanged,
+            iconchange: this.onItemIconChanged,
+            beforeshow: this.onBeforeShowItem
+        });
+    },
+
+
+
+    /**
+     * <p>Provides template arguments for rendering a tab selector item in the tab strip.</p>
+     * <p>This method returns an object hash containing properties used by the TabPanel's <tt>{@link #itemTpl}</tt>
+     * to create a formatted, clickable tab selector element. The properties which must be returned
+     * are:</p><div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc">A unique identifier which links to the item</div></li>
+     * <li><b>text</b> : String<div class="sub-desc">The text to display</div></li>
+     * <li><b>cls</b> : String<div class="sub-desc">The CSS class name</div></li>
+     * <li><b>iconCls</b> : String<div class="sub-desc">A CSS class to provide appearance for an icon.</div></li>
+     * </ul></div>
+     * @param {Ext.BoxComponent} item The {@link Ext.BoxComponent BoxComponent} for which to create a selector element in the tab strip.
+     * @return {Object} An object hash containing the properties required to render the selector element.
+     */
+    getTemplateArgs : function(item) {
+        var cls = item.closable ? 'x-tab-strip-closable' : '';
+        if(item.disabled){
+            cls += ' x-item-disabled';
+        }
+        if(item.iconCls){
+            cls += ' x-tab-with-icon';
+        }
+        if(item.tabCls){
+            cls += ' ' + item.tabCls;
+        }
+
+        return {
+            id: this.id + this.idDelimiter + item.getItemId(),
+            text: item.title,
+            cls: cls,
+            iconCls: item.iconCls || ''
+        };
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.TabPanel.superclass.onAdd.call(this, c);
+        if(this.rendered){
+            var items = this.items;
+            this.initTab(c, items.indexOf(c));
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        var existing = item.events ? (this.items.containsKey(item.getItemId()) ? item : null) : this.items.get(item);
+        if(existing){
+            this.setActiveTab(item);
+            return false;
+        }
+        Ext.TabPanel.superclass.onBeforeAdd.apply(this, arguments);
+        var es = item.elements;
+        item.elements = es ? es.replace(',header', '') : es;
+        item.border = (item.border === true);
+    },
+
+    // private
+    onRemove : function(c){
+        var te = Ext.get(c.tabEl);
+        // check if the tabEl exists, it won't if the tab isn't rendered
+        if(te){
+            te.select('a').removeAllListeners();
+            Ext.destroy(te);
+        }
+        Ext.TabPanel.superclass.onRemove.call(this, c);
+        this.stack.remove(c);
+        delete c.tabEl;
+        c.un('disable', this.onItemDisabled, this);
+        c.un('enable', this.onItemEnabled, this);
+        c.un('titlechange', this.onItemTitleChanged, this);
+        c.un('iconchange', this.onItemIconChanged, this);
+        c.un('beforeshow', this.onBeforeShowItem, this);
+        if(c == this.activeTab){
+            var next = this.stack.next();
+            if(next){
+                this.setActiveTab(next);
+            }else if(this.items.getCount() > 0){
+                this.setActiveTab(0);
+            }else{
+                this.setActiveTab(null);
+            }
+        }
+        if(!this.destroying){
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeShowItem : function(item){
+        if(item != this.activeTab){
+            this.setActiveTab(item);
+            return false;
+        }
+    },
+
+    // private
+    onItemDisabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).addClass('x-item-disabled');
+        }
+        this.stack.remove(item);
+    },
+
+    // private
+    onItemEnabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).removeClass('x-item-disabled');
+        }
+    },
+
+    // private
+    onItemTitleChanged : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).child('span.x-tab-strip-text', true).innerHTML = item.title;
+        }
+    },
+
+    //private
+    onItemIconChanged : function(item, iconCls, oldCls){
+        var el = this.getTabEl(item);
+        if(el){
+            el = Ext.get(el);
+            el.child('span.x-tab-strip-text').replaceClass(oldCls, iconCls);
+            el[Ext.isEmpty(iconCls) ? 'removeClass' : 'addClass']('x-tab-with-icon');
+        }
+    },
+
+    /**
+     * Gets the DOM element for the tab strip item which activates the child panel with the specified
+     * ID. Access this to change the visual treatment of the item, for example by changing the CSS class name.
+     * @param {Panel/Number/String} tab The tab component, or the tab's index, or the tabs id or itemId.
+     * @return {HTMLElement} The DOM node
+     */
+    getTabEl : function(item){
+        var c = this.getComponent(item);
+        return c ? c.tabEl : null;
+    },
+
+    // private
+    onResize : function(){
+        Ext.TabPanel.superclass.onResize.apply(this, arguments);
+        this.delegateUpdates();
+    },
+
+    /**
+     * Suspends any internal calculations or scrolling while doing a bulk operation. See {@link #endUpdate}
+     */
+    beginUpdate : function(){
+        this.suspendUpdates = true;
+    },
+
+    /**
+     * Resumes calculations and scrolling at the end of a bulk operation. See {@link #beginUpdate}
+     */
+    endUpdate : function(){
+        this.suspendUpdates = false;
+        this.delegateUpdates();
+    },
+
+    /**
+     * Hides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    hideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = 'none';
+            this.delegateUpdates();
+        }
+        this.stack.remove(item);
+    },
+
+    /**
+     * Unhides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    unhideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = '';
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    delegateUpdates : function(){
+        var rendered = this.rendered;
+        if(this.suspendUpdates){
+            return;
+        }
+        if(this.resizeTabs && rendered){
+            this.autoSizeTabs();
+        }
+        if(this.enableTabScroll && rendered){
+            this.autoScrollTabs();
+        }
+    },
+
+    // private
+    autoSizeTabs : function(){
+        var count = this.items.length,
+            ce = this.tabPosition != 'bottom' ? 'header' : 'footer',
+            ow = this[ce].dom.offsetWidth,
+            aw = this[ce].dom.clientWidth;
+
+        if(!this.resizeTabs || count < 1 || !aw){ // !aw for display:none
+            return;
+        }
+
+        var each = Math.max(Math.min(Math.floor((aw-4) / count) - this.tabMargin, this.tabWidth), this.minTabWidth); // -4 for float errors in IE
+        this.lastTabWidth = each;
+        var lis = this.strip.query('li:not(.x-tab-edge)');
+        for(var i = 0, len = lis.length; i < len; i++) {
+            var li = lis[i],
+                inner = Ext.fly(li).child('.x-tab-strip-inner', true),
+                tw = li.offsetWidth,
+                iw = inner.offsetWidth;
+            inner.style.width = (each - (tw-iw)) + 'px';
+        }
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        if(this.header){
+            this.header.setWidth(w);
+        }
+        if(this.footer){
+            this.footer.setWidth(w);
+        }
+        return w;
+    },
+
+    /**
+     * Sets the specified tab as the active tab. This method fires the {@link #beforetabchange} event which
+     * can <tt>return false</tt> to cancel the tab change.
+     * @param {String/Number} item
+     * The id or tab Panel to activate. This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><tt>String</tt></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><tt>Number</tt></b> : representing the position of the child component
+     * within the <code>{@link Ext.Container#items items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     */
+    setActiveTab : function(item){
+        item = this.getComponent(item);
+        if(this.fireEvent('beforetabchange', this, item, this.activeTab) === false){
+            return;
+        }
+        if(!this.rendered){
+            this.activeTab = item;
+            return;
+        }
+        if(this.activeTab != item){
+            if(this.activeTab){
+                var oldEl = this.getTabEl(this.activeTab);
+                if(oldEl){
+                    Ext.fly(oldEl).removeClass('x-tab-strip-active');
+                }
+            }
+            this.activeTab = item;
+            if(item){
+                var el = this.getTabEl(item);
+                Ext.fly(el).addClass('x-tab-strip-active');
+                this.stack.add(item);
+
+                this.layout.setActiveItem(item);
+                // Need to do this here, since setting the active tab slightly changes the size
+                this.delegateUpdates();
+                if(this.scrolling){
+                    this.scrollToTab(item, this.animScroll);
+                }
+            }
+            this.fireEvent('tabchange', this, item);
+        }
+    },
+
+    /**
+     * Returns the Component which is the currently active tab. <b>Note that before the TabPanel
+     * first activates a child Component, this method will return whatever was configured in the
+     * {@link #activeTab} config option.</b>
+     * @return {BoxComponent} The currently active child Component if one <i>is</i> active, or the {@link #activeTab} config value.
+     */
+    getActiveTab : function(){
+        return this.activeTab || null;
+    },
+
+    /**
+     * Gets the specified tab by id.
+     * @param {String} id The tab id
+     * @return {Panel} The tab
+     */
+    getItem : function(item){
+        return this.getComponent(item);
+    },
+
+    // private
+    autoScrollTabs : function(){
+        this.pos = this.tabPosition=='bottom' ? this.footer : this.header;
+        var count = this.items.length,
+            ow = this.pos.dom.offsetWidth,
+            tw = this.pos.dom.clientWidth,
+            wrap = this.stripWrap,
+            wd = wrap.dom,
+            cw = wd.offsetWidth,
+            pos = this.getScrollPos(),
+            l = this.edge.getOffsetsTo(this.stripWrap)[0] + pos;
+
+        if(!this.enableTabScroll || cw < 20){ // 20 to prevent display:none issues
+            return;
+        }
+        if(count == 0 || l <= tw){
+            // ensure the width is set if there's no tabs
+            wd.scrollLeft = 0;
+            wrap.setWidth(tw);
+            if(this.scrolling){
+                this.scrolling = false;
+                this.pos.removeClass('x-tab-scrolling');
+                this.scrollLeft.hide();
+                this.scrollRight.hide();
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '';
+                    wd.style.marginRight = '';
+                }
+            }
+        }else{
+            if(!this.scrolling){
+                this.pos.addClass('x-tab-scrolling');
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '18px';
+                    wd.style.marginRight = '18px';
+                }
+            }
+            tw -= wrap.getMargins('lr');
+            wrap.setWidth(tw > 20 ? tw : 20);
+            if(!this.scrolling){
+                if(!this.scrollLeft){
+                    this.createScrollers();
+                }else{
+                    this.scrollLeft.show();
+                    this.scrollRight.show();
+                }
+            }
+            this.scrolling = true;
+            if(pos > (l-tw)){ // ensure it stays within bounds
+                wd.scrollLeft = l-tw;
+            }else{ // otherwise, make sure the active tab is still visible
+                this.scrollToTab(this.activeTab, false);
+            }
+            this.updateScrollButtons();
+        }
+    },
+
+    // private
+    createScrollers : function(){
+        this.pos.addClass('x-tab-scrolling-' + this.tabPosition);
+        var h = this.stripWrap.dom.offsetHeight;
+
+        // left
+        var sl = this.pos.insertFirst({
+            cls:'x-tab-scroller-left'
+        });
+        sl.setHeight(h);
+        sl.addClassOnOver('x-tab-scroller-left-over');
+        this.leftRepeater = new Ext.util.ClickRepeater(sl, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollLeft,
+            scope: this
+        });
+        this.scrollLeft = sl;
+
+        // right
+        var sr = this.pos.insertFirst({
+            cls:'x-tab-scroller-right'
+        });
+        sr.setHeight(h);
+        sr.addClassOnOver('x-tab-scroller-right-over');
+        this.rightRepeater = new Ext.util.ClickRepeater(sr, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollRight,
+            scope: this
+        });
+        this.scrollRight = sr;
+    },
+
+    // private
+    getScrollWidth : function(){
+        return this.edge.getOffsetsTo(this.stripWrap)[0] + this.getScrollPos();
+    },
+
+    // private
+    getScrollPos : function(){
+        return parseInt(this.stripWrap.dom.scrollLeft, 10) || 0;
+    },
+
+    // private
+    getScrollArea : function(){
+        return parseInt(this.stripWrap.dom.clientWidth, 10) || 0;
+    },
+
+    // private
+    getScrollAnim : function(){
+        return {duration:this.scrollDuration, callback: this.updateScrollButtons, scope: this};
+    },
+
+    // private
+    getScrollIncrement : function(){
+        return this.scrollIncrement || (this.resizeTabs ? this.lastTabWidth+2 : 100);
+    },
+
+    /**
+     * Scrolls to a particular tab if tab scrolling is enabled
+     * @param {Panel} item The item to scroll to
+     * @param {Boolean} animate True to enable animations
+     */
+
+    scrollToTab : function(item, animate){
+        if(!item){
+            return;
+        }
+        var el = this.getTabEl(item),
+            pos = this.getScrollPos(),
+            area = this.getScrollArea(),
+            left = Ext.fly(el).getOffsetsTo(this.stripWrap)[0] + pos,
+            right = left + el.offsetWidth;
+        if(left < pos){
+            this.scrollTo(left, animate);
+        }else if(right > (pos + area)){
+            this.scrollTo(right - area, animate);
+        }
+    },
+
+    // private
+    scrollTo : function(pos, animate){
+        this.stripWrap.scrollTo('left', pos, animate ? this.getScrollAnim() : false);
+        if(!animate){
+            this.updateScrollButtons();
+        }
+    },
+
+    onWheel : function(e){
+        var d = e.getWheelDelta()*this.wheelIncrement*-1;
+        e.stopEvent();
+
+        var pos = this.getScrollPos(),
+            newpos = pos + d,
+            sw = this.getScrollWidth()-this.getScrollArea();
+
+        var s = Math.max(0, Math.min(sw, newpos));
+        if(s != pos){
+            this.scrollTo(s, false);
+        }
+    },
+
+    // private
+    onScrollRight : function(){
+        var sw = this.getScrollWidth()-this.getScrollArea(),
+            pos = this.getScrollPos(),
+            s = Math.min(sw, pos + this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    onScrollLeft : function(){
+        var pos = this.getScrollPos(),
+            s = Math.max(0, pos - this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    updateScrollButtons : function(){
+        var pos = this.getScrollPos();
+        this.scrollLeft[pos === 0 ? 'addClass' : 'removeClass']('x-tab-scroller-left-disabled');
+        this.scrollRight[pos >= (this.getScrollWidth()-this.getScrollArea()) ? 'addClass' : 'removeClass']('x-tab-scroller-right-disabled');
+    },
+
+    // private
+    beforeDestroy : function() {
+        Ext.destroy(this.leftRepeater, this.rightRepeater);
+        this.deleteMembers('strip', 'edge', 'scrollLeft', 'scrollRight', 'stripWrap');
+        this.activeTab = null;
+        Ext.TabPanel.superclass.beforeDestroy.apply(this);
+    }
+
+    /**
+     * @cfg {Boolean} collapsible
+     * @hide
+     */
+    /**
+     * @cfg {String} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @cfg title
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Array} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapsed
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+});
+Ext.reg('tabpanel', Ext.TabPanel);
+
+/**
+ * See {@link #setActiveTab}. Sets the specified tab as the active tab. This method fires
+ * the {@link #beforetabchange} event which can <tt>return false</tt> to cancel the tab change.
+ * @param {String/Panel} tab The id or tab Panel to activate
+ * @method activate
+ */
+Ext.TabPanel.prototype.activate = Ext.TabPanel.prototype.setActiveTab;
+
+// private utility class used by TabPanel
+Ext.TabPanel.AccessStack = function(){
+    var items = [];
+    return {
+        add : function(item){
+            items.push(item);
+            if(items.length > 10){
+                items.shift();
+            }
+        },
+
+        remove : function(item){
+            var s = [];
+            for(var i = 0, len = items.length; i < len; i++) {
+                if(items[i] != item){
+                    s.push(items[i]);
+                }
+            }
+            items = s;
+        },
+
+        next : function(){
+            return items.pop();
+        }
+    };
+};
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-tips.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Tip=Ext.extend(Ext.Panel,{minWidth:40,maxWidth:300,shadow:"sides",defaultAlign:"tl-bl?",autoRender:true,quickShowInterval:250,frame:true,hidden:true,baseCls:"x-tip",floating:{shadow:true,shim:true,useDisplay:true,constrain:false},autoHeight:true,closeAction:"hide",initComponent:function(){Ext.Tip.superclass.initComponent.call(this);if(this.closable&&!this.title){this.elements+=",header"}},afterRender:function(){Ext.Tip.superclass.afterRender.call(this);if(this.closable){this.addTool({id:"close",handler:this[this.closeAction],scope:this})}},showAt:function(a){Ext.Tip.superclass.show.call(this);if(this.measureWidth!==false&&(!this.initialConfig||typeof this.initialConfig.width!="number")){this.doAutoWidth()}if(this.constrainPosition){a=this.el.adjustForConstraints(a)}this.setPagePosition(a[0],a[1])},doAutoWidth:function(a){a=a||0;var b=this.body.getTextWidth();if(this.title){b=Math.max(b,this.header.child("span").getTextWidth(this.title))}b+=this.getFrameWidth()+(this.closable?20:0)+this.body.getPadding("lr")+a;this.setWidth(b.constrain(this.minWidth,this.maxWidth));if(Ext.isIE7&&!this.repainted){this.el.repaint();this.repainted=true}},showBy:function(a,b){if(!this.rendered){this.render(Ext.getBody())}this.showAt(this.el.getAlignToXY(a,b||this.defaultAlign))},initDraggable:function(){this.dd=new Ext.Tip.DD(this,typeof this.draggable=="boolean"?null:this.draggable);this.header.addClass("x-tip-draggable")}});Ext.reg("tip",Ext.Tip);Ext.Tip.DD=function(b,a){Ext.apply(this,a);this.tip=b;Ext.Tip.DD.superclass.constructor.call(this,b.el.id,"WindowDD-"+b.id);this.setHandleElId(b.header.id);this.scroll=false};Ext.extend(Ext.Tip.DD,Ext.dd.DD,{moveOnly:true,scroll:false,headerOffsets:[100,25],startDrag:function(){this.tip.el.disableShadow()},endDrag:function(a){this.tip.el.enableShadow(true)}});Ext.ToolTip=Ext.extend(Ext.Tip,{showDelay:500,hideDelay:200,dismissDelay:5000,trackMouse:false,anchorToTarget:true,anchorOffset:0,targetCounter:0,constrainPosition:false,initComponent:function(){Ext.ToolTip.superclass.initComponent.call(this);this.lastActive=new Date();this.initTarget(this.target);this.origAnchor=this.anchor},onRender:function(b,a){Ext.ToolTip.superclass.onRender.call(this,b,a);this.anchorCls="x-tip-anchor-"+this.getAnchorPosition();this.anchorEl=this.el.createChild({cls:"x-tip-anchor "+this.anchorCls})},afterRender:function(){Ext.ToolTip.superclass.afterRender.call(this);this.anchorEl.setStyle("z-index",this.el.getZIndex()+1).setVisibilityMode(Ext.Element.DISPLAY)},initTarget:function(c){var a;if((a=Ext.get(c))){if(this.target){var b=Ext.get(this.target);this.mun(b,"mouseover",this.onTargetOver,this);this.mun(b,"mouseout",this.onTargetOut,this);this.mun(b,"mousemove",this.onMouseMove,this)}this.mon(a,{mouseover:this.onTargetOver,mouseout:this.onTargetOut,mousemove:this.onMouseMove,scope:this});this.target=a}if(this.anchor){this.anchorTarget=this.target}},onMouseMove:function(b){var a=this.delegate?b.getTarget(this.delegate):this.triggerElement=true;if(a){this.targetXY=b.getXY();if(a===this.triggerElement){if(!this.hidden&&this.trackMouse){this.setPagePosition(this.getTargetXY())}}else{this.hide();this.lastActive=new Date(0);this.onTargetOver(b)}}else{if(!this.closable&&this.isVisible()){this.hide()}}},getTargetXY:function(){if(this.delegate){this.anchorTarget=this.triggerElement}if(this.anchor){this.targetCounter++;var c=this.getOffsets(),k=(this.anchorToTarget&&!this.trackMouse)?this.el.getAlignToXY(this.anchorTarget,this.getAnchorAlign()):this.targetXY,a=Ext.lib.Dom.getViewWidth()-5,g=Ext.lib.Dom.getViewHeight()-5,h=document.documentElement,e=document.body,j=(h.scrollLeft||e.scrollLeft||0)+5,i=(h.scrollTop||e.scrollTop||0)+5,b=[k[0]+c[0],k[1]+c[1]],f=this.getSize();this.anchorEl.removeClass(this.anchorCls);if(this.targetCounter<2){if(b[0]<j){if(this.anchorToTarget){this.defaultAlign="l-r";if(this.mouseOffset){this.mouseOffset[0]*=-1}}this.anchor="left";return this.getTargetXY()}if(b[0]+f.width>a){if(this.anchorToTarget){this.defaultAlign="r-l";if(this.mouseOffset){this.mouseOffset[0]*=-1}}this.anchor="right";return this.getTargetXY()}if(b[1]<i){if(this.anchorToTarget){this.defaultAlign="t-b";if(this.mouseOffset){this.mouseOffset[1]*=-1}}this.anchor="top";return this.getTargetXY()}if(b[1]+f.height>g){if(this.anchorToTarget){this.defaultAlign="b-t";if(this.mouseOffset){this.mouseOffset[1]*=-1}}this.anchor="bottom";return this.getTargetXY()}}this.anchorCls="x-tip-anchor-"+this.getAnchorPosition();this.anchorEl.addClass(this.anchorCls);this.targetCounter=0;return b}else{var d=this.getMouseOffset();return[this.targetXY[0]+d[0],this.targetXY[1]+d[1]]}},getMouseOffset:function(){var a=this.anchor?[0,0]:[15,18];if(this.mouseOffset){a[0]+=this.mouseOffset[0];a[1]+=this.mouseOffset[1]}return a},getAnchorPosition:function(){if(this.anchor){this.tipAnchor=this.anchor.charAt(0)}else{var a=this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);if(!a){throw"AnchorTip.defaultAlign is invalid"}this.tipAnchor=a[1].charAt(0)}switch(this.tipAnchor){case"t":return"top";case"b":return"bottom";case"r":return"right"}return"left"},getAnchorAlign:function(){switch(this.anchor){case"top":return"tl-bl";case"left":return"tl-tr";case"right":return"tr-tl";default:return"bl-tl"}},getOffsets:function(){var b,a=this.getAnchorPosition().charAt(0);if(this.anchorToTarget&&!this.trackMouse){switch(a){case"t":b=[0,9];break;case"b":b=[0,-13];break;case"r":b=[-13,0];break;default:b=[9,0];break}}else{switch(a){case"t":b=[-15-this.anchorOffset,30];break;case"b":b=[-19-this.anchorOffset,-13-this.el.dom.offsetHeight];break;case"r":b=[-15-this.el.dom.offsetWidth,-13-this.anchorOffset];break;default:b=[25,-13-this.anchorOffset];break}}var c=this.getMouseOffset();b[0]+=c[0];b[1]+=c[1];return b},onTargetOver:function(b){if(this.disabled||b.within(this.target.dom,true)){return}var a=b.getTarget(this.delegate);if(a){this.triggerElement=a;this.clearTimer("hide");this.targetXY=b.getXY();this.delayShow()}},delayShow:function(){if(this.hidden&&!this.showTimer){if(this.lastActive.getElapsed()<this.quickShowInterval){this.show()}else{this.showTimer=this.show.defer(this.showDelay,this)}}else{if(!this.hidden&&this.autoHide!==false){this.show()}}},onTargetOut:function(a){if(this.disabled||a.within(this.target.dom,true)){return}this.clearTimer("show");if(this.autoHide!==false){this.delayHide()}},delayHide:function(){if(!this.hidden&&!this.hideTimer){this.hideTimer=this.hide.defer(this.hideDelay,this)}},hide:function(){this.clearTimer("dismiss");this.lastActive=new Date();if(this.anchorEl){this.anchorEl.hide()}Ext.ToolTip.superclass.hide.call(this);delete this.triggerElement},show:function(){if(this.anchor){this.showAt([-1000,-1000]);this.origConstrainPosition=this.constrainPosition;this.constrainPosition=false;this.anchor=this.origAnchor}this.showAt(this.getTargetXY());if(this.anchor){this.anchorEl.show();this.syncAnchor();this.constrainPosition=this.origConstrainPosition}else{this.anchorEl.hide()}},showAt:function(a){this.lastActive=new Date();this.clearTimers();Ext.ToolTip.superclass.showAt.call(this,a);if(this.dismissDelay&&this.autoHide!==false){this.dismissTimer=this.hide.defer(this.dismissDelay,this)}if(this.anchor&&!this.anchorEl.isVisible()){this.syncAnchor();this.anchorEl.show()}else{this.anchorEl.hide()}},syncAnchor:function(){var a,b,c;switch(this.tipAnchor.charAt(0)){case"t":a="b";b="tl";c=[20+this.anchorOffset,2];break;case"r":a="l";b="tr";c=[-2,11+this.anchorOffset];break;case"b":a="t";b="bl";c=[20+this.anchorOffset,-2];break;default:a="r";b="tl";c=[2,11+this.anchorOffset];break}this.anchorEl.alignTo(this.el,a+"-"+b,c)},setPagePosition:function(a,b){Ext.ToolTip.superclass.setPagePosition.call(this,a,b);if(this.anchor){this.syncAnchor()}},clearTimer:function(a){a=a+"Timer";clearTimeout(this[a]);delete this[a]},clearTimers:function(){this.clearTimer("show");this.clearTimer("dismiss");this.clearTimer("hide")},onShow:function(){Ext.ToolTip.superclass.onShow.call(this);Ext.getDoc().on("mousedown",this.onDocMouseDown,this)},onHide:function(){Ext.ToolTip.superclass.onHide.call(this);Ext.getDoc().un("mousedown",this.onDocMouseDown,this)},onDocMouseDown:function(a){if(this.autoHide!==true&&!this.closable&&!a.within(this.el.dom)){this.disable();this.doEnable.defer(100,this)}},doEnable:function(){if(!this.isDestroyed){this.enable()}},onDisable:function(){this.clearTimers();this.hide()},adjustPosition:function(a,d){if(this.constrainPosition){var c=this.targetXY[1],b=this.getSize().height;if(d<=c&&(d+b)>=c){d=c-b-5}}return{x:a,y:d}},beforeDestroy:function(){this.clearTimers();Ext.destroy(this.anchorEl);delete this.anchorEl;delete this.target;delete this.anchorTarget;delete this.triggerElement;Ext.ToolTip.superclass.beforeDestroy.call(this)},onDestroy:function(){Ext.getDoc().un("mousedown",this.onDocMouseDown,this);Ext.ToolTip.superclass.onDestroy.call(this)}});Ext.reg("tooltip",Ext.ToolTip);Ext.QuickTip=Ext.extend(Ext.ToolTip,{interceptTitles:false,tagConfig:{namespace:"ext",attribute:"qtip",width:"qwidth",target:"target",title:"qtitle",hide:"hide",cls:"qclass",align:"qalign",anchor:"anchor"},initComponent:function(){this.target=this.target||Ext.getDoc();this.targets=this.targets||{};Ext.QuickTip.superclass.initComponent.call(this)},register:function(e){var g=Ext.isArray(e)?e:arguments;for(var f=0,a=g.length;f<a;f++){var k=g[f];var h=k.target;if(h){if(Ext.isArray(h)){for(var d=0,b=h.length;d<b;d++){this.targets[Ext.id(h[d])]=k}}else{this.targets[Ext.id(h)]=k}}}},unregister:function(a){delete this.targets[Ext.id(a)]},cancelShow:function(b){var a=this.activeTarget;b=Ext.get(b).dom;if(this.isVisible()){if(a&&a.el==b){this.hide()}}else{if(a&&a.el==b){this.clearTimer("show")}}},getTipCfg:function(d){var b=d.getTarget(),c,a;if(this.interceptTitles&&b.title&&Ext.isString(b.title)){c=b.title;b.qtip=c;b.removeAttribute("title");d.preventDefault()}else{a=this.tagConfig;c=b.qtip||Ext.fly(b).getAttribute(a.attribute,a.namespace)}return c},onTargetOver:function(h){if(this.disabled){return}this.targetXY=h.getXY();var c=h.getTarget();if(!c||c.nodeType!==1||c==document||c==document.body){return}if(this.activeTarget&&((c==this.activeTarget.el)||Ext.fly(this.activeTarget.el).contains(c))){this.clearTimer("hide");this.show();return}if(c&&this.targets[c.id]){this.activeTarget=this.targets[c.id];this.activeTarget.el=c;this.anchor=this.activeTarget.anchor;if(this.anchor){this.anchorTarget=c}this.delayShow();return}var f,g=Ext.fly(c),b=this.tagConfig,d=b.namespace;if(f=this.getTipCfg(h)){var a=g.getAttribute(b.hide,d);this.activeTarget={el:c,text:f,width:g.getAttribute(b.width,d),autoHide:a!="user"&&a!=="false",title:g.getAttribute(b.title,d),cls:g.getAttribute(b.cls,d),align:g.getAttribute(b.align,d)};this.anchor=g.getAttribute(b.anchor,d);if(this.anchor){this.anchorTarget=c}this.delayShow()}},onTargetOut:function(a){if(this.activeTarget&&a.within(this.activeTarget.el)&&!this.getTipCfg(a)){return}this.clearTimer("show");if(this.autoHide!==false){this.delayHide()}},showAt:function(b){var a=this.activeTarget;if(a){if(!this.rendered){this.render(Ext.getBody());this.activeTarget=a}if(a.width){this.setWidth(a.width);this.body.setWidth(this.adjustBodyWidth(a.width-this.getFrameWidth()));this.measureWidth=false}else{this.measureWidth=true}this.setTitle(a.title||"");this.body.update(a.text);this.autoHide=a.autoHide;this.dismissDelay=a.dismissDelay||this.dismissDelay;if(this.lastCls){this.el.removeClass(this.lastCls);delete this.lastCls}if(a.cls){this.el.addClass(a.cls);this.lastCls=a.cls}if(this.anchor){this.constrainPosition=false}else{if(a.align){b=this.el.getAlignToXY(a.el,a.align);this.constrainPosition=false}else{this.constrainPosition=true}}}Ext.QuickTip.superclass.showAt.call(this,b)},hide:function(){delete this.activeTarget;Ext.QuickTip.superclass.hide.call(this)}});Ext.reg("quicktip",Ext.QuickTip);Ext.QuickTips=function(){var b,a=false;return{init:function(c){if(!b){if(!Ext.isReady){Ext.onReady(function(){Ext.QuickTips.init(c)});return}b=new Ext.QuickTip({elements:"header,body",disabled:a});if(c!==false){b.render(Ext.getBody())}}},ddDisable:function(){if(b&&!a){b.disable()}},ddEnable:function(){if(b&&!a){b.enable()}},enable:function(){if(b){b.enable()}a=false},disable:function(){if(b){b.disable()}a=true},isEnabled:function(){return b!==undefined&&!b.disabled},getQuickTip:function(){return b},register:function(){b.register.apply(b,arguments)},unregister:function(){b.unregister.apply(b,arguments)},tips:function(){b.register.apply(b,arguments)}}}();Ext.slider.Tip=Ext.extend(Ext.Tip,{minWidth:10,offsets:[0,-10],init:function(a){a.on({scope:this,dragstart:this.onSlide,drag:this.onSlide,dragend:this.hide,destroy:this.destroy})},onSlide:function(b,c,a){this.show();this.body.update(this.getText(a));this.doAutoWidth();this.el.alignTo(a.el,"b-t?",this.offsets)},getText:function(a){return String(a.value)}});Ext.ux.SliderTip=Ext.slider.Tip;
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/pkg-buttons-debug.js	(revision 76)
@@ -0,0 +1,1155 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Button
+ * @extends Ext.BoxComponent
+ * Simple Button class
+ * @cfg {String} text The button text to be used as innerHTML (html tags are accepted)
+ * @cfg {String} icon The path to an image to display in the button (the image will be set as the background-image
+ * CSS property of the button by default, so if you want a mixed icon/text button, set cls:'x-btn-text-icon')
+ * @cfg {Function} handler A function called when the button is clicked (can be used instead of click event).
+ * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+ * <li><code>b</code> : Button<div class="sub-desc">This Button.</div></li>
+ * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+ * </ul></div>
+ * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width).
+ * See also {@link Ext.Panel}.<tt>{@link Ext.Panel#minButtonWidth minButtonWidth}</tt>.
+ * @cfg {String/Object} tooltip The tooltip for the button - can be a string to be used as innerHTML (html tags are accepted) or QuickTips config object
+ * @cfg {Boolean} hidden True to start hidden (defaults to false)
+ * @cfg {Boolean} disabled True to start disabled (defaults to false)
+ * @cfg {Boolean} pressed True to start pressed (only if enableToggle = true)
+ * @cfg {String} toggleGroup The group this toggle button is a member of (only 1 per group can be pressed)
+ * @cfg {Boolean/Object} repeat True to repeat fire the click event while the mouse is down. This can also be
+ * a {@link Ext.util.ClickRepeater ClickRepeater} config object (defaults to false).
+ * @constructor
+ * Create a new button
+ * @param {Object} config The config object
+ * @xtype button
+ */
+Ext.Button = Ext.extend(Ext.BoxComponent, {
+    /**
+     * Read-only. True if this button is hidden
+     * @type Boolean
+     */
+    hidden : false,
+    /**
+     * Read-only. True if this button is disabled
+     * @type Boolean
+     */
+    disabled : false,
+    /**
+     * Read-only. True if this button is pressed (only if enableToggle = true)
+     * @type Boolean
+     */
+    pressed : false,
+
+    /**
+     * @cfg {Number} tabIndex Set a DOM tabIndex for this button (defaults to undefined)
+     */
+
+    /**
+     * @cfg {Boolean} allowDepress
+     * False to not allow a pressed Button to be depressed (defaults to undefined). Only valid when {@link #enableToggle} is true.
+     */
+
+    /**
+     * @cfg {Boolean} enableToggle
+     * True to enable pressed/not pressed toggling (defaults to false)
+     */
+    enableToggle : false,
+    /**
+     * @cfg {Function} toggleHandler
+     * Function called when a Button with {@link #enableToggle} set to true is clicked. Two arguments are passed:<ul class="mdetail-params">
+     * <li><b>button</b> : Ext.Button<div class="sub-desc">this Button object</div></li>
+     * <li><b>state</b> : Boolean<div class="sub-desc">The next state of the Button, true means pressed.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {Mixed} menu
+     * Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).
+     */
+    /**
+     * @cfg {String} menuAlign
+     * The position to align the menu to (see {@link Ext.Element#alignTo} for more details, defaults to 'tl-bl?').
+     */
+    menuAlign : 'tl-bl?',
+
+    /**
+     * @cfg {String} overflowText If used in a {@link Ext.Toolbar Toolbar}, the
+     * text to be used if this item is shown in the overflow menu. See also
+     * {@link Ext.Toolbar.Item}.<code>{@link Ext.Toolbar.Item#overflowText overflowText}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A css class which sets a background image to be used as the icon for this button
+     */
+    /**
+     * @cfg {String} type
+     * submit, reset or button - defaults to 'button'
+     */
+    type : 'button',
+
+    // private
+    menuClassTarget : 'tr:nth(2)',
+
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will fire the handler of the button. This can be any valid event name (dblclick, contextmenu).
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent : 'click',
+
+    /**
+     * @cfg {Boolean} handleMouseEvents
+     * False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)
+     */
+    handleMouseEvents : true,
+
+    /**
+     * @cfg {String} tooltipType
+     * The type of tooltip to use. Either 'qtip' (default) for QuickTips or 'title' for title attribute.
+     */
+    tooltipType : 'qtip',
+
+    /**
+     * @cfg {String} buttonSelector
+     * <p>(Optional) A {@link Ext.DomQuery DomQuery} selector which is used to extract the active, clickable element from the
+     * DOM structure created.</p>
+     * <p>When a custom {@link #template} is used, you  must ensure that this selector results in the selection of
+     * a focussable element.</p>
+     * <p>Defaults to <b><tt>'button:first-child'</tt></b>.</p>
+     */
+    buttonSelector : 'button:first-child',
+
+    /**
+     * @cfg {String} scale
+     * <p>(Optional) The size of the Button. Three values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'small'<div class="sub-desc">Results in the button element being 16px high.</div></li>
+     * <li>'medium'<div class="sub-desc">Results in the button element being 24px high.</div></li>
+     * <li>'large'<div class="sub-desc">Results in the button element being 32px high.</div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'small'</tt></b>.</p>
+     */
+    scale : 'small',
+
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> and <code>{@link #toggleHandler}</code> is
+     * executed. Defaults to this Button.
+     */
+
+    /**
+     * @cfg {String} iconAlign
+     * <p>(Optional) The side of the Button box to render the icon. Four values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'top'<div class="sub-desc"></div></li>
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * <li>'left'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'left'</tt></b>.</p>
+     */
+    iconAlign : 'left',
+
+    /**
+     * @cfg {String} arrowAlign
+     * <p>(Optional) The side of the Button box to render the arrow if the button has an associated {@link #menu}.
+     * Two values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'right'</tt></b>.</p>
+     */
+    arrowAlign : 'right',
+
+    /**
+     * @cfg {Ext.Template} template (Optional)
+     * <p>A {@link Ext.Template Template} used to create the Button's DOM structure.</p>
+     * Instances, or subclasses which need a different DOM structure may provide a different
+     * template layout in conjunction with an implementation of {@link #getTemplateArgs}.
+     * @type Ext.Template
+     * @property template
+     */
+    /**
+     * @cfg {String} cls
+     * A CSS class string to apply to the button's main element.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object associated with this Button when configured with the {@link #menu} config option.
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * By default, if a width is not specified the button will attempt to stretch horizontally to fit its content.
+     * If the button is being managed by a width sizing layout (hbox, fit, anchor), set this to false to prevent
+     * the button from doing this automatic sizing.
+     * Defaults to <tt>undefined</tt>.
+     */
+
+    initComponent : function(){
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+        
+        Ext.Button.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this button is clicked
+             * @param {Button} this
+             * @param {EventObject} e The click event
+             */
+            'click',
+            /**
+             * @event toggle
+             * Fires when the 'pressed' state of this button changes (only if enableToggle = true)
+             * @param {Button} this
+             * @param {Boolean} pressed
+             */
+            'toggle',
+            /**
+             * @event mouseover
+             * Fires when the mouse hovers over the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseout',
+            /**
+             * @event menushow
+             * If this button has a menu, this event fires when it is shown
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menushow',
+            /**
+             * @event menuhide
+             * If this button has a menu, this event fires when it is hidden
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menuhide',
+            /**
+             * @event menutriggerover
+             * If this button has a menu, this event fires when the mouse enters the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerover',
+            /**
+             * @event menutriggerout
+             * If this button has a menu, this event fires when the mouse leaves the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerout'
+        );
+        
+        if(Ext.isString(this.toggleGroup)){
+            this.enableToggle = true;
+        }
+    },
+
+/**
+  * <p>This method returns an Array which provides substitution parameters for the {@link #template Template} used
+  * to create this Button's DOM structure.</p>
+  * <p>Instances or subclasses which use a different Template to create a different DOM structure may need to provide their
+  * own implementation of this method.</p>
+  * <p>The default implementation which provides data for the default {@link #template} returns an Array containing the
+  * following items:</p><div class="mdetail-params"><ul>
+  * <li>The &lt;button&gt;'s {@link #type}</li>
+  * <li>A CSS class name applied to the Button's main &lt;tbody&gt; element which determines the button's scale and icon alignment.</li>
+  * <li>A CSS class to determine the presence and position of an arrow icon. (<code>'x-btn-arrow'</code> or <code>'x-btn-arrow-bottom'</code> or <code>''</code>)</li>
+  * <li>The {@link #cls} CSS class name applied to the button's wrapping &lt;table&gt; element.</li>
+  * <li>The Component id which is applied to the button's wrapping &lt;table&gt; element.</li>
+  * </ul></div>
+  * @return {Array} Substitution data for a Template.
+ */
+    getTemplateArgs : function(){
+        return [this.type, 'x-btn-' + this.scale + ' x-btn-icon-' + this.scale + '-' + this.iconAlign, this.getMenuClass(), this.cls, this.id];
+    },
+
+    // private
+    setButtonClass : function(){
+        if(this.useSetClass){
+            if(!Ext.isEmpty(this.oldCls)){
+                this.el.removeClass([this.oldCls, 'x-btn-pressed']);
+            }
+            this.oldCls = (this.iconCls || this.icon) ? (this.text ? 'x-btn-text-icon' : 'x-btn-icon') : 'x-btn-noicon';
+            this.el.addClass([this.oldCls, this.pressed ? 'x-btn-pressed' : null]);
+        }
+    },
+
+    // protected
+    getMenuClass : function(){
+        return this.menu ? (this.arrowAlign != 'bottom' ? 'x-btn-arrow' : 'x-btn-arrow-bottom') : '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.template){
+            if(!Ext.Button.buttonTemplate){
+                // hideous table template
+                Ext.Button.buttonTemplate = new Ext.Template(
+                    '<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
+                    '<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',
+                    '</tbody></table>');
+                Ext.Button.buttonTemplate.compile();
+            }
+            this.template = Ext.Button.buttonTemplate;
+        }
+
+        var btn, targs = this.getTemplateArgs();
+
+        if(position){
+            btn = this.template.insertBefore(position, targs, true);
+        }else{
+            btn = this.template.append(ct, targs, true);
+        }
+        /**
+         * An {@link Ext.Element Element} encapsulating the Button's clickable element. By default,
+         * this references a <tt>&lt;button&gt;</tt> element. Read only.
+         * @type Ext.Element
+         * @property btnEl
+         */
+        this.btnEl = btn.child(this.buttonSelector);
+        this.mon(this.btnEl, {
+            scope: this,
+            focus: this.onFocus,
+            blur: this.onBlur
+        });
+
+        this.initButtonEl(btn, this.btnEl);
+
+        Ext.ButtonToggleMgr.register(this);
+    },
+
+    // private
+    initButtonEl : function(btn, btnEl){
+        this.el = btn;
+        this.setIcon(this.icon);
+        this.setText(this.text);
+        this.setIconClass(this.iconCls);
+        if(Ext.isDefined(this.tabIndex)){
+            btnEl.dom.tabIndex = this.tabIndex;
+        }
+        if(this.tooltip){
+            this.setTooltip(this.tooltip, true);
+        }
+
+        if(this.handleMouseEvents){
+            this.mon(btn, {
+                scope: this,
+                mouseover: this.onMouseOver,
+                mousedown: this.onMouseDown
+            });
+
+            // new functionality for monitoring on the document level
+            //this.mon(btn, 'mouseout', this.onMouseOut, this);
+        }
+
+        if(this.menu){
+            this.mon(this.menu, {
+                scope: this,
+                show: this.onMenuShow,
+                hide: this.onMenuHide
+            });
+        }
+
+        if(this.repeat){
+            var repeater = new Ext.util.ClickRepeater(btn, Ext.isObject(this.repeat) ? this.repeat : {});
+            this.mon(repeater, 'click', this.onRepeatClick, this);
+        }else{
+            this.mon(btn, this.clickEvent, this.onClick, this);
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Button.superclass.afterRender.call(this);
+        this.useSetClass = true;
+        this.setButtonClass();
+        this.doc = Ext.getDoc();
+        this.doAutoWidth();
+    },
+
+    /**
+     * Sets the CSS class that provides a background image to use as the button's icon.  This method also changes
+     * the value of the {@link iconCls} config internally.
+     * @param {String} cls The CSS class providing the icon image
+     * @return {Ext.Button} this
+     */
+    setIconClass : function(cls){
+        this.iconCls = cls;
+        if(this.el){
+            this.btnEl.dom.className = '';
+            this.btnEl.addClass(['x-btn-text', cls || '']);
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Sets the tooltip for this Button.
+     * @param {String/Object} tooltip. This may be:<div class="mdesc-details"><ul>
+     * <li><b>String</b> : A string to be used as innerHTML (html tags are accepted) to show in a tooltip</li>
+     * <li><b>Object</b> : A configuration object for {@link Ext.QuickTips#register}.</li>
+     * </ul></div>
+     * @return {Ext.Button} this
+     */
+    setTooltip : function(tooltip, /* private */ initial){
+        if(this.rendered){
+            if(!initial){
+                this.clearTip();
+            }
+            if(Ext.isObject(tooltip)){
+                Ext.QuickTips.register(Ext.apply({
+                      target: this.btnEl.id
+                }, tooltip));
+                this.tooltip = tooltip;
+            }else{
+                this.btnEl.dom[this.tooltipType] = tooltip;
+            }
+        }else{
+            this.tooltip = tooltip;
+        }
+        return this;
+    },
+
+    // private
+    clearTip : function(){
+        if(Ext.isObject(this.tooltip)){
+            Ext.QuickTips.unregister(this.btnEl);
+        }
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.clearTip();
+        }
+        if(this.menu && this.destroyMenu !== false) {
+            Ext.destroy(this.btnEl, this.menu);
+        }
+        Ext.destroy(this.repeater);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.rendered){
+            this.doc.un('mouseover', this.monitorMouseOver, this);
+            this.doc.un('mouseup', this.onMouseUp, this);
+            delete this.doc;
+            delete this.btnEl;
+            Ext.ButtonToggleMgr.unregister(this);
+        }
+        Ext.Button.superclass.onDestroy.call(this);
+    },
+
+    // private
+    doAutoWidth : function(){
+        if(this.autoWidth !== false && this.el && this.text && this.width === undefined){
+            this.el.setWidth('auto');
+            if(Ext.isIE7 && Ext.isStrict){
+                var ib = this.btnEl;
+                if(ib && ib.getWidth() > 20){
+                    ib.clip();
+                    ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));
+                }
+            }
+            if(this.minWidth){
+                if(this.el.getWidth() < this.minWidth){
+                    this.el.setWidth(this.minWidth);
+                }
+            }
+        }
+    },
+
+    /**
+     * Assigns this Button's click handler
+     * @param {Function} handler The function to call when the button is clicked
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+     * Defaults to this Button.
+     * @return {Ext.Button} this
+     */
+    setHandler : function(handler, scope){
+        this.handler = handler;
+        this.scope = scope;
+        return this;
+    },
+
+    /**
+     * Sets this Button's text
+     * @param {String} text The button text
+     * @return {Ext.Button} this
+     */
+    setText : function(text){
+        this.text = text;
+        if(this.el){
+            this.btnEl.update(text || '&#160;');
+            this.setButtonClass();
+        }
+        this.doAutoWidth();
+        return this;
+    },
+
+    /**
+     * Sets the background image (inline style) of the button.  This method also changes
+     * the value of the {@link icon} config internally.
+     * @param {String} icon The path to an image to display in the button
+     * @return {Ext.Button} this
+     */
+    setIcon : function(icon){
+        this.icon = icon;
+        if(this.el){
+            this.btnEl.setStyle('background-image', icon ? 'url(' + icon + ')' : '');
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Gets the text for this Button
+     * @return {String} The button text
+     */
+    getText : function(){
+        return this.text;
+    },
+
+    /**
+     * If a state it passed, it becomes the pressed state otherwise the current state is toggled.
+     * @param {Boolean} state (optional) Force a particular state
+     * @param {Boolean} supressEvent (optional) True to stop events being fired when calling this method.
+     * @return {Ext.Button} this
+     */
+    toggle : function(state, suppressEvent){
+        state = state === undefined ? !this.pressed : !!state;
+        if(state != this.pressed){
+            if(this.rendered){
+                this.el[state ? 'addClass' : 'removeClass']('x-btn-pressed');
+            }
+            this.pressed = state;
+            if(!suppressEvent){
+                this.fireEvent('toggle', this, state);
+                if(this.toggleHandler){
+                    this.toggleHandler.call(this.scope || this, this, state);
+                }
+            }
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.onDisableChange(true);
+    },
+
+    // private
+    onEnable : function(){
+        this.onDisableChange(false);
+    },
+
+    onDisableChange : function(disabled){
+        if(this.el){
+            if(!Ext.isIE6 || !this.text){
+                this.el[disabled ? 'addClass' : 'removeClass'](this.disabledClass);
+            }
+            this.el.dom.disabled = disabled;
+        }
+        this.disabled = disabled;
+    },
+
+    /**
+     * Show this button's menu (if it has one)
+     */
+    showMenu : function(){
+        if(this.rendered && this.menu){
+            if(this.tooltip){
+                Ext.QuickTips.getQuickTip().cancelShow(this.btnEl);
+            }
+            if(this.menu.isVisible()){
+                this.menu.hide();
+            }
+            this.menu.ownerCt = this;
+            this.menu.show(this.el, this.menuAlign);
+        }
+        return this;
+    },
+
+    /**
+     * Hide this button's menu (if it has one)
+     */
+    hideMenu : function(){
+        if(this.hasVisibleMenu()){
+            this.menu.hide();
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the button has a menu and it is visible
+     * @return {Boolean}
+     */
+    hasVisibleMenu : function(){
+        return this.menu && this.menu.ownerCt == this && this.menu.isVisible();
+    },
+    
+    // private
+    onRepeatClick : function(repeat, e){
+        this.onClick(e);
+    },
+
+    // private
+    onClick : function(e){
+        if(e){
+            e.preventDefault();
+        }
+        if(e.button !== 0){
+            return;
+        }
+        if(!this.disabled){
+            this.doToggle();
+            if(this.menu && !this.hasVisibleMenu() && !this.ignoreNextClick){
+                this.showMenu();
+            }
+            this.fireEvent('click', this, e);
+            if(this.handler){
+                //this.el.removeClass('x-btn-over');
+                this.handler.call(this.scope || this, this, e);
+            }
+        }
+    },
+    
+    // private
+    doToggle: function(){
+        if (this.enableToggle && (this.allowDepress !== false || !this.pressed)) {
+            this.toggle();
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    onMouseOver : function(e){
+        if(!this.disabled){
+            var internal = e.within(this.el,  true);
+            if(!internal){
+                this.el.addClass('x-btn-over');
+                if(!this.monitoringMouseOver){
+                    this.doc.on('mouseover', this.monitorMouseOver, this);
+                    this.monitoringMouseOver = true;
+                }
+                this.fireEvent('mouseover', this, e);
+            }
+            if(this.isMenuTriggerOver(e, internal)){
+                this.fireEvent('menutriggerover', this, this.menu, e);
+            }
+        }
+    },
+
+    // private
+    monitorMouseOver : function(e){
+        if(e.target != this.el.dom && !e.within(this.el)){
+            if(this.monitoringMouseOver){
+                this.doc.un('mouseover', this.monitorMouseOver, this);
+                this.monitoringMouseOver = false;
+            }
+            this.onMouseOut(e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        var internal = e.within(this.el) && e.target != this.el.dom;
+        this.el.removeClass('x-btn-over');
+        this.fireEvent('mouseout', this, e);
+        if(this.isMenuTriggerOut(e, internal)){
+            this.fireEvent('menutriggerout', this, this.menu, e);
+        }
+    },
+
+    focus : function() {
+        this.btnEl.focus();
+    },
+
+    blur : function() {
+        this.btnEl.blur();
+    },
+
+    // private
+    onFocus : function(e){
+        if(!this.disabled){
+            this.el.addClass('x-btn-focus');
+        }
+    },
+    // private
+    onBlur : function(e){
+        this.el.removeClass('x-btn-focus');
+    },
+
+    // private
+    getClickEl : function(e, isUp){
+       return this.el;
+    },
+
+    // private
+    onMouseDown : function(e){
+        if(!this.disabled && e.button === 0){
+            this.getClickEl(e).addClass('x-btn-click');
+            this.doc.on('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMouseUp : function(e){
+        if(e.button === 0){
+            this.getClickEl(e, true).removeClass('x-btn-click');
+            this.doc.un('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMenuShow : function(e){
+        if(this.menu.ownerCt == this){
+            this.menu.ownerCt = this;
+            this.ignoreNextClick = 0;
+            this.el.addClass('x-btn-menu-active');
+            this.fireEvent('menushow', this, this.menu);
+        }
+    },
+    // private
+    onMenuHide : function(e){
+        if(this.menu.ownerCt == this){
+            this.el.removeClass('x-btn-menu-active');
+            this.ignoreNextClick = this.restoreClick.defer(250, this);
+            this.fireEvent('menuhide', this, this.menu);
+            delete this.menu.ownerCt;
+        }
+    },
+
+    // private
+    restoreClick : function(){
+        this.ignoreNextClick = 0;
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String/Object} html @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+});
+Ext.reg('button', Ext.Button);
+
+// Private utility class used by Button
+Ext.ButtonToggleMgr = function(){
+   var groups = {};
+
+   function toggleGroup(btn, state){
+       if(state){
+           var g = groups[btn.toggleGroup];
+           for(var i = 0, l = g.length; i < l; i++){
+               if(g[i] != btn){
+                   g[i].toggle(false);
+               }
+           }
+       }
+   }
+
+   return {
+       register : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(!g){
+               g = groups[btn.toggleGroup] = [];
+           }
+           g.push(btn);
+           btn.on('toggle', toggleGroup);
+       },
+
+       unregister : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(g){
+               g.remove(btn);
+               btn.un('toggle', toggleGroup);
+           }
+       },
+
+       /**
+        * Gets the pressed button in the passed group or null
+        * @param {String} group
+        * @return Button
+        */
+       getPressed : function(group){
+           var g = groups[group];
+           if(g){
+               for(var i = 0, len = g.length; i < len; i++){
+                   if(g[i].pressed === true){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+/**
+ * @class Ext.SplitButton
+ * @extends Ext.Button
+ * A split button that provides a built-in dropdown arrow that can fire an event separately from the default
+ * click event of the button.  Typically this would be used to display a dropdown menu that provides additional
+ * options to the primary button action, but any custom handler can provide the arrowclick implementation.  Example usage:
+ * <pre><code>
+// display a dropdown menu:
+new Ext.SplitButton({
+	renderTo: 'button-ct', // the container id
+   	text: 'Options',
+   	handler: optionsHandler, // handle a click on the button itself
+   	menu: new Ext.menu.Menu({
+        items: [
+        	// these items will render as dropdown menu items when the arrow is clicked:
+	        {text: 'Item 1', handler: item1Handler},
+	        {text: 'Item 2', handler: item2Handler}
+        ]
+   	})
+});
+
+// Instead of showing a menu, you provide any type of custom
+// functionality you want when the dropdown arrow is clicked:
+new Ext.SplitButton({
+	renderTo: 'button-ct',
+   	text: 'Options',
+   	handler: optionsHandler,
+   	arrowHandler: myCustomHandler
+});
+</code></pre>
+ * @cfg {Function} arrowHandler A function called when the arrow button is clicked (can be used instead of click event)
+ * @cfg {String} arrowTooltip The title attribute of the arrow
+ * @constructor
+ * Create a new menu button
+ * @param {Object} config The config object
+ * @xtype splitbutton
+ */
+Ext.SplitButton = Ext.extend(Ext.Button, {
+	// private
+    arrowSelector : 'em',
+    split: true,
+
+    // private
+    initComponent : function(){
+        Ext.SplitButton.superclass.initComponent.call(this);
+        /**
+         * @event arrowclick
+         * Fires when this button's arrow is clicked
+         * @param {MenuButton} this
+         * @param {EventObject} e The click event
+         */
+        this.addEvents("arrowclick");
+    },
+
+    // private
+    onRender : function(){
+        Ext.SplitButton.superclass.onRender.apply(this, arguments);
+        if(this.arrowTooltip){
+            this.el.child(this.arrowSelector).dom[this.tooltipType] = this.arrowTooltip;
+        }
+    },
+
+    /**
+     * Sets this button's arrow click handler.
+     * @param {Function} handler The function to call when the arrow is clicked
+     * @param {Object} scope (optional) Scope for the function passed above
+     */
+    setArrowHandler : function(handler, scope){
+        this.arrowHandler = handler;
+        this.scope = scope;
+    },
+
+    getMenuClass : function(){
+        return 'x-btn-split' + (this.arrowAlign == 'bottom' ? '-bottom' : '');
+    },
+
+    isClickOnArrow : function(e){
+	if (this.arrowAlign != 'bottom') {
+	    var visBtn = this.el.child('em.x-btn-split');
+	    var right = visBtn.getRegion().right - visBtn.getPadding('r');
+	    return e.getPageX() > right;
+	} else {
+	    return e.getPageY() > this.btnEl.getRegion().bottom;
+	}
+    },
+
+    // private
+    onClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            if(this.isClickOnArrow(e)){
+                if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){
+                    this.showMenu();
+                }
+                this.fireEvent("arrowclick", this, e);
+                if(this.arrowHandler){
+                    this.arrowHandler.call(this.scope || this, this, e);
+                }
+            }else{
+                this.doToggle();
+                this.fireEvent("click", this, e);
+                if(this.handler){
+                    this.handler.call(this.scope || this, this, e);
+                }
+            }
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e){
+        return this.menu && e.target.tagName == this.arrowSelector;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && e.target.tagName != this.arrowSelector;
+    }
+});
+
+Ext.reg('splitbutton', Ext.SplitButton);/**
+ * @class Ext.CycleButton
+ * @extends Ext.SplitButton
+ * A specialized SplitButton that contains a menu of {@link Ext.menu.CheckItem} elements.  The button automatically
+ * cycles through each menu item on click, raising the button's {@link #change} event (or calling the button's
+ * {@link #changeHandler} function, if supplied) for the active menu item. Clicking on the arrow section of the
+ * button displays the dropdown menu just like a normal SplitButton.  Example usage:
+ * <pre><code>
+var btn = new Ext.CycleButton({
+    showText: true,
+    prependText: 'View as ',
+    items: [{
+        text:'text only',
+        iconCls:'view-text',
+        checked:true
+    },{
+        text:'HTML',
+        iconCls:'view-html'
+    }],
+    changeHandler:function(btn, item){
+        Ext.Msg.alert('Change View', item.text);
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new split button
+ * @param {Object} config The config object
+ * @xtype cycle
+ */
+Ext.CycleButton = Ext.extend(Ext.SplitButton, {
+    /**
+     * @cfg {Array} items An array of {@link Ext.menu.CheckItem} <b>config</b> objects to be used when creating the
+     * button's menu items (e.g., {text:'Foo', iconCls:'foo-icon'})
+     */
+    /**
+     * @cfg {Boolean} showText True to display the active item's text as the button text (defaults to false)
+     */
+    /**
+     * @cfg {String} prependText A static string to prepend before the active item's text when displayed as the
+     * button's text (only applies when showText = true, defaults to '')
+     */
+    /**
+     * @cfg {Function} changeHandler A callback function that will be invoked each time the active menu
+     * item in the button's menu has changed.  If this callback is not supplied, the SplitButton will instead
+     * fire the {@link #change} event on active item change.  The changeHandler function will be called with the
+     * following argument list: (SplitButton this, Ext.menu.CheckItem item)
+     */
+    /**
+     * @cfg {String} forceIcon A css class which sets an image to be used as the static icon for this button.  This
+     * icon will always be displayed regardless of which item is selected in the dropdown list.  This overrides the 
+     * default behavior of changing the button's icon to match the selected item's icon on change.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object used to display the {@link Ext.menu.CheckItem CheckItems} representing the available choices.
+     */
+
+    // private
+    getItemText : function(item){
+        if(item && this.showText === true){
+            var text = '';
+            if(this.prependText){
+                text += this.prependText;
+            }
+            text += item.text;
+            return text;
+        }
+        return undefined;
+    },
+
+    /**
+     * Sets the button's active menu item.
+     * @param {Ext.menu.CheckItem} item The item to activate
+     * @param {Boolean} suppressEvent True to prevent the button's change event from firing (defaults to false)
+     */
+    setActiveItem : function(item, suppressEvent){
+        if(!Ext.isObject(item)){
+            item = this.menu.getComponent(item);
+        }
+        if(item){
+            if(!this.rendered){
+                this.text = this.getItemText(item);
+                this.iconCls = item.iconCls;
+            }else{
+                var t = this.getItemText(item);
+                if(t){
+                    this.setText(t);
+                }
+                this.setIconClass(item.iconCls);
+            }
+            this.activeItem = item;
+            if(!item.checked){
+                item.setChecked(true, suppressEvent);
+            }
+            if(this.forceIcon){
+                this.setIconClass(this.forceIcon);
+            }
+            if(!suppressEvent){
+                this.fireEvent('change', this, item);
+            }
+        }
+    },
+
+    /**
+     * Gets the currently active menu item.
+     * @return {Ext.menu.CheckItem} The active item
+     */
+    getActiveItem : function(){
+        return this.activeItem;
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the button's active menu item has changed.  Note that if a {@link #changeHandler} function
+             * is set on this CycleButton, it will be called instead on active item change and this change event will
+             * not be fired.
+             * @param {Ext.CycleButton} this
+             * @param {Ext.menu.CheckItem} item The menu item that was selected
+             */
+            "change"
+        );
+
+        if(this.changeHandler){
+            this.on('change', this.changeHandler, this.scope||this);
+            delete this.changeHandler;
+        }
+
+        this.itemCount = this.items.length;
+
+        this.menu = {cls:'x-cycle-menu', items:[]};
+        var checked = 0;
+        Ext.each(this.items, function(item, i){
+            Ext.apply(item, {
+                group: item.group || this.id,
+                itemIndex: i,
+                checkHandler: this.checkHandler,
+                scope: this,
+                checked: item.checked || false
+            });
+            this.menu.items.push(item);
+            if(item.checked){
+                checked = i;
+            }
+        }, this);
+        Ext.CycleButton.superclass.initComponent.call(this);
+        this.on('click', this.toggleSelected, this);
+        this.setActiveItem(checked, true);
+    },
+
+    // private
+    checkHandler : function(item, pressed){
+        if(pressed){
+            this.setActiveItem(item);
+        }
+    },
+
+    /**
+     * This is normally called internally on button click, but can be called externally to advance the button's
+     * active item programmatically to the next one in the menu.  If the current item is the last one in the menu
+     * the active item will be set to the first item in the menu.
+     */
+    toggleSelected : function(){
+        var m = this.menu;
+        m.render();
+        // layout if we haven't before so the items are active
+        if(!m.hasLayout){
+            m.doLayout();
+        }
+        
+        var nextIdx, checkItem;
+        for (var i = 1; i < this.itemCount; i++) {
+            nextIdx = (this.activeItem.itemIndex + i) % this.itemCount;
+            // check the potential item
+            checkItem = m.items.itemAt(nextIdx);
+            // if its not disabled then check it.
+            if (!checkItem.disabled) {
+                checkItem.setChecked(true);
+                break;
+            }
+        }
+    }
+});
+Ext.reg('cycle', Ext.CycleButton);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-grouping.js	(revision 76)
@@ -0,0 +1,7 @@
+/*
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.data.GroupingStore=Ext.extend(Ext.data.Store,{constructor:function(d){d=d||{};this.hasMultiSort=true;this.multiSortInfo=this.multiSortInfo||{sorters:[]};var e=this.multiSortInfo.sorters,c=d.groupField||this.groupField,b=d.sortInfo||this.sortInfo,a=d.groupDir||this.groupDir;if(c){e.push({field:c,direction:a})}if(b){e.push(b)}Ext.data.GroupingStore.superclass.constructor.call(this,d);this.addEvents("groupchange");this.applyGroupField()},remoteGroup:false,groupOnSort:false,groupDir:"ASC",clearGrouping:function(){this.groupField=false;if(this.remoteGroup){if(this.baseParams){delete this.baseParams.groupBy;delete this.baseParams.groupDir}var a=this.lastOptions;if(a&&a.params){delete a.params.groupBy;delete a.params.groupDir}this.reload()}else{this.sort();this.fireEvent("datachanged",this)}},groupBy:function(e,a,d){d=d?(String(d).toUpperCase()=="DESC"?"DESC":"ASC"):this.groupDir;if(this.groupField==e&&this.groupDir==d&&!a){return}var c=this.multiSortInfo.sorters;if(c.length>0&&c[0].field==this.groupField){c.shift()}this.groupField=e;this.groupDir=d;this.applyGroupField();var b=function(){this.fireEvent("groupchange",this,this.getGroupState())};if(this.groupOnSort){this.sort(e,d);b.call(this);return}if(this.remoteGroup){this.on("load",b,this,{single:true});this.reload()}else{this.sort(c);b.call(this)}},sort:function(g,c){if(this.remoteSort){return Ext.data.GroupingStore.superclass.sort.call(this,g,c)}var f=[];if(Ext.isArray(arguments[0])){f=arguments[0]}else{if(g==undefined){f=this.sortInfo?[this.sortInfo]:[]}else{var e=this.fields.get(g);if(!e){return false}var b=e.name,a=this.sortInfo||null,d=this.sortToggle?this.sortToggle[b]:null;if(!c){if(a&&a.field==b){c=(this.sortToggle[b]||"ASC").toggle("ASC","DESC")}else{c=e.sortDir}}this.sortToggle[b]=c;this.sortInfo={field:b,direction:c};f=[this.sortInfo]}}if(this.groupField){f.unshift({direction:this.groupDir,field:this.groupField})}return this.multiSort.call(this,f,c)},applyGroupField:function(){if(this.remoteGroup){if(!this.baseParams){this.baseParams={}}Ext.apply(this.baseParams,{groupBy:this.groupField,groupDir:this.groupDir});var a=this.lastOptions;if(a&&a.params){a.params.groupDir=this.groupDir;delete a.params.groupBy}}},applyGrouping:function(a){if(this.groupField!==false){this.groupBy(this.groupField,true,this.groupDir);return true}else{if(a===true){this.fireEvent("datachanged",this)}return false}},getGroupState:function(){return this.groupOnSort&&this.groupField!==false?(this.sortInfo?this.sortInfo.field:undefined):this.groupField}});Ext.reg("groupingstore",Ext.data.GroupingStore);
Index: /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/pkgs/data-list-views-debug.js	(revision 76)
@@ -0,0 +1,1539 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.DataView
+ * @extends Ext.BoxComponent
+ * A mechanism for displaying data using custom layout templates and formatting. DataView uses an {@link Ext.XTemplate}
+ * as its internal templating mechanism, and is bound to an {@link Ext.data.Store}
+ * so that as the data in the store changes the view is automatically updated to reflect the changes.  The view also
+ * provides built-in behavior for many common events that can occur for its contained items including click, doubleclick,
+ * mouseover, mouseout, etc. as well as a built-in selection model. <b>In order to use these features, an {@link #itemSelector}
+ * config must be provided for the DataView to determine what nodes it will be working with.</b>
+ *
+ * <p>The example below binds a DataView to a {@link Ext.data.Store} and renders it into an {@link Ext.Panel}.</p>
+ * <pre><code>
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var tpl = new Ext.XTemplate(
+    '&lt;tpl for="."&gt;',
+        '&lt;div class="thumb-wrap" id="{name}"&gt;',
+        '&lt;div class="thumb"&gt;&lt;img src="{url}" title="{name}"&gt;&lt;/div&gt;',
+        '&lt;span class="x-editable"&gt;{shortName}&lt;/span&gt;&lt;/div&gt;',
+    '&lt;/tpl&gt;',
+    '&lt;div class="x-clear"&gt;&lt;/div&gt;'
+);
+
+var panel = new Ext.Panel({
+    id:'images-view',
+    frame:true,
+    width:535,
+    autoHeight:true,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple DataView',
+
+    items: new Ext.DataView({
+        store: store,
+        tpl: tpl,
+        autoHeight:true,
+        multiSelect: true,
+        overClass:'x-view-over',
+        itemSelector:'div.thumb-wrap',
+        emptyText: 'No images to display'
+    })
+});
+panel.render(document.body);
+</code></pre>
+ * @constructor
+ * Create a new DataView
+ * @param {Object} config The config object
+ * @xtype dataview
+ */
+Ext.DataView = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String/Array} tpl
+     * The HTML fragment or an array of fragments that will make up the template used by this DataView.  This should
+     * be specified in the same format expected by the constructor of {@link Ext.XTemplate}.
+     */
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} to bind this DataView to.
+     */
+    /**
+     * @cfg {String} itemSelector
+     * <b>This is a required setting</b>. A simple CSS selector (e.g. <tt>div.some-class</tt> or 
+     * <tt>span:first-child</tt>) that will be used to determine what nodes this DataView will be
+     * working with.
+     */
+    /**
+     * @cfg {Boolean} multiSelect
+     * True to allow selection of more than one item at a time, false to allow selection of only a single item
+     * at a time or no selection at all, depending on the value of {@link #singleSelect} (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} singleSelect
+     * True to allow selection of exactly one item at a time, false to allow no selection at all (defaults to false).
+     * Note that if {@link #multiSelect} = true, this value will be ignored.
+     */
+    /**
+     * @cfg {Boolean} simpleSelect
+     * True to enable multiselection by clicking on multiple items without requiring the user to hold Shift or Ctrl,
+     * false to force the user to hold Ctrl or Shift to select more than on item (defaults to false).
+     */
+    /**
+     * @cfg {String} overClass
+     * A CSS class to apply to each item in the view on mouseover (defaults to undefined).
+     */
+    /**
+     * @cfg {String} loadingText
+     * A string to display during data load operations (defaults to undefined).  If specified, this text will be
+     * displayed in a loading div and the view's contents will be cleared while loading, otherwise the view's
+     * contents will continue to display normally until the new data is loaded and the contents are replaced.
+     */
+    /**
+     * @cfg {String} selectedClass
+     * A CSS class to apply to each selected item in the view (defaults to 'x-view-selected').
+     */
+    selectedClass : "x-view-selected",
+    /**
+     * @cfg {String} emptyText
+     * The text to display in the view when there is no data to display (defaults to '').
+     */
+    emptyText : "",
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer emptyText being applied until the store's first load
+     */
+    deferEmptyText: true,
+    /**
+     * @cfg {Boolean} trackOver True to enable mouseenter and mouseleave events
+     */
+    trackOver: false,
+    
+    /**
+     * @cfg {Boolean} blockRefresh Set this to true to ignore datachanged events on the bound store. This is useful if
+     * you wish to provide custom transition animations via a plugin (defaults to false)
+     */
+    blockRefresh: false,
+
+    //private
+    last: false,
+
+    // private
+    initComponent : function(){
+        Ext.DataView.superclass.initComponent.call(this);
+        if(Ext.isString(this.tpl) || Ext.isArray(this.tpl)){
+            this.tpl = new Ext.XTemplate(this.tpl);
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeclick
+             * Fires before a click is processed. Returns false to cancel the default action.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "beforeclick",
+            /**
+             * @event click
+             * Fires when a template node is clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "click",
+            /**
+             * @event mouseenter
+             * Fires when the mouse enters a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseenter",
+            /**
+             * @event mouseleave
+             * Fires when the mouse leaves a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseleave",
+            /**
+             * @event containerclick
+             * Fires when a click occurs and it is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containerclick",
+            /**
+             * @event dblclick
+             * Fires when a template node is double clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "dblclick",
+            /**
+             * @event contextmenu
+             * Fires when a template node is right clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "contextmenu",
+            /**
+             * @event containercontextmenu
+             * Fires when a right click occurs that is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containercontextmenu",
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change.
+             * @param {Ext.DataView} this
+             * @param {Array} selections Array of the selected nodes
+             */
+            "selectionchange",
+
+            /**
+             * @event beforeselect
+             * Fires before a selection is made. If any handlers return false, the selection is cancelled.
+             * @param {Ext.DataView} this
+             * @param {HTMLElement} node The node to be selected
+             * @param {Array} selections Array of currently selected nodes
+             */
+            "beforeselect"
+        );
+
+        this.store = Ext.StoreMgr.lookup(this.store);
+        this.all = new Ext.CompositeElementLite();
+        this.selected = new Ext.CompositeElementLite();
+    },
+
+    // private
+    afterRender : function(){
+        Ext.DataView.superclass.afterRender.call(this);
+
+		this.mon(this.getTemplateTarget(), {
+            "click": this.onClick,
+            "dblclick": this.onDblClick,
+            "contextmenu": this.onContextMenu,
+            scope:this
+        });
+
+        if(this.overClass || this.trackOver){
+            this.mon(this.getTemplateTarget(), {
+                "mouseover": this.onMouseOver,
+                "mouseout": this.onMouseOut,
+                scope:this
+            });
+        }
+
+        if(this.store){
+            this.bindStore(this.store, true);
+        }
+    },
+
+    /**
+     * Refreshes the view by reloading the data from the store and re-rendering the template.
+     */
+    refresh : function() {
+        this.clearSelections(false, true);
+        var el = this.getTemplateTarget(),
+            records = this.store.getRange();
+            
+        el.update('');
+        if(records.length < 1){
+            if(!this.deferEmptyText || this.hasSkippedEmptyText){
+                el.update(this.emptyText);
+            }
+            this.all.clear();
+        }else{
+            this.tpl.overwrite(el, this.collectData(records, 0));
+            this.all.fill(Ext.query(this.itemSelector, el.dom));
+            this.updateIndexes(0);
+        }
+        this.hasSkippedEmptyText = true;
+    },
+
+    getTemplateTarget: function(){
+        return this.el;
+    },
+
+    /**
+     * Function which can be overridden to provide custom formatting for each Record that is used by this
+     * DataView's {@link #tpl template} to render each node.
+     * @param {Array/Object} data The raw data object that was used to create the Record.
+     * @param {Number} recordIndex the index number of the Record being prepared for rendering.
+     * @param {Record} record The Record being prepared for rendering.
+     * @return {Array/Object} The formatted data in a format expected by the internal {@link #tpl template}'s overwrite() method.
+     * (either an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}))
+     */
+    prepareData : function(data){
+        return data;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * DataView's {@link #tpl template} to render the whole DataView.</p>
+     * <p>This is usually an Array of data objects, each element of which is processed by an
+     * {@link Ext.XTemplate XTemplate} which uses <tt>'&lt;tpl for="."&gt;'</tt> to iterate over its supplied
+     * data object as an Array. However, <i>named</i> properties may be placed into the data object to
+     * provide non-repeating data such as headings, totals etc.</p>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Array} An Array of data objects to be processed by a repeating XTemplate. May also
+     * contain <i>named</i> properties.
+     */
+    collectData : function(records, startIndex){
+        var r = [],
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            r[r.length] = this.prepareData(records[i].data, startIndex + i, records[i]);
+        }
+        return r;
+    },
+
+    // private
+    bufferRender : function(records, index){
+        var div = document.createElement('div');
+        this.tpl.overwrite(div, this.collectData(records, index));
+        return Ext.query(this.itemSelector, div);
+    },
+
+    // private
+    onUpdate : function(ds, record){
+        var index = this.store.indexOf(record);
+        if(index > -1){
+            var sel = this.isSelected(index),
+                original = this.all.elements[index],
+                node = this.bufferRender([record], index)[0];
+
+            this.all.replaceElement(index, node, true);
+            if(sel){
+                this.selected.replaceElement(original, node);
+                this.all.item(index).addClass(this.selectedClass);
+            }
+            this.updateIndexes(index, index);
+        }
+    },
+
+    // private
+    onAdd : function(ds, records, index){
+        if(this.all.getCount() === 0){
+            this.refresh();
+            return;
+        }
+        var nodes = this.bufferRender(records, index), n, a = this.all.elements;
+        if(index < this.all.getCount()){
+            n = this.all.item(index).insertSibling(nodes, 'before', true);
+            a.splice.apply(a, [index, 0].concat(nodes));
+        }else{
+            n = this.all.last().insertSibling(nodes, 'after', true);
+            a.push.apply(a, nodes);
+        }
+        this.updateIndexes(index);
+    },
+
+    // private
+    onRemove : function(ds, record, index){
+        this.deselect(index);
+        this.all.removeElement(index, true);
+        this.updateIndexes(index);
+        if (this.store.getCount() === 0){
+            this.refresh();
+        }
+    },
+
+    /**
+     * Refreshes an individual node's data from the store.
+     * @param {Number} index The item's data index in the store
+     */
+    refreshNode : function(index){
+        this.onUpdate(this.store, this.store.getAt(index));
+    },
+
+    // private
+    updateIndexes : function(startIndex, endIndex){
+        var ns = this.all.elements;
+        startIndex = startIndex || 0;
+        endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));
+        for(var i = startIndex; i <= endIndex; i++){
+            ns[i].viewIndex = i;
+        }
+    },
+    
+    /**
+     * Returns the store associated with this DataView.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Changes the data store bound to this view and refreshes it.
+     * @param {Store} store The store to bind to this view
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("beforeload", this.onBeforeLoad, this);
+                this.store.un("datachanged", this.onDataChanged, this);
+                this.store.un("add", this.onAdd, this);
+                this.store.un("remove", this.onRemove, this);
+                this.store.un("update", this.onUpdate, this);
+                this.store.un("clear", this.refresh, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                datachanged: this.onDataChanged,
+                add: this.onAdd,
+                remove: this.onRemove,
+                update: this.onUpdate,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store){
+            this.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Calls this.refresh if this.blockRefresh is not true
+     */
+    onDataChanged: function() {
+        if (this.blockRefresh !== true) {
+            this.refresh.apply(this, arguments);
+        }
+    },
+
+    /**
+     * Returns the template node the passed child belongs to, or null if it doesn't belong to one.
+     * @param {HTMLElement} node
+     * @return {HTMLElement} The template node
+     */
+    findItemFromChild : function(node){
+        return Ext.fly(node).findParent(this.itemSelector, this.getTemplateTarget());
+    },
+
+    // private
+    onClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget()),
+            index;
+        if(item){
+            index = this.indexOf(item);
+            if(this.onItemClick(item, index, e) !== false){
+                this.fireEvent("click", this, index, item, e);
+            }
+        }else{
+            if(this.fireEvent("containerclick", this, e) !== false){
+                this.onContainerClick(e);
+            }
+        }
+    },
+
+    onContainerClick : function(e){
+        this.clearSelections();
+    },
+
+    // private
+    onContextMenu : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("contextmenu", this, this.indexOf(item), item, e);
+        }else{
+            this.fireEvent("containercontextmenu", this, e);
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("dblclick", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOver : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item && item !== this.lastItem){
+            this.lastItem = item;
+            Ext.fly(item).addClass(this.overClass);
+            this.fireEvent("mouseenter", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        if(this.lastItem){
+            if(!e.within(this.lastItem, true, true)){
+                Ext.fly(this.lastItem).removeClass(this.overClass);
+                this.fireEvent("mouseleave", this, this.indexOf(this.lastItem), this.lastItem, e);
+                delete this.lastItem;
+            }
+        }
+    },
+
+    // private
+    onItemClick : function(item, index, e){
+        if(this.fireEvent("beforeclick", this, index, item, e) === false){
+            return false;
+        }
+        if(this.multiSelect){
+            this.doMultiSelection(item, index, e);
+            e.preventDefault();
+        }else if(this.singleSelect){
+            this.doSingleSelection(item, index, e);
+            e.preventDefault();
+        }
+        return true;
+    },
+
+    // private
+    doSingleSelection : function(item, index, e){
+        if(e.ctrlKey && this.isSelected(index)){
+            this.deselect(index);
+        }else{
+            this.select(index, false);
+        }
+    },
+
+    // private
+    doMultiSelection : function(item, index, e){
+        if(e.shiftKey && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, index, e.ctrlKey);
+            this.last = last; // reset the last
+        }else{
+            if((e.ctrlKey||this.simpleSelect) && this.isSelected(index)){
+                this.deselect(index);
+            }else{
+                this.select(index, e.ctrlKey || e.shiftKey || this.simpleSelect);
+            }
+        }
+    },
+
+    /**
+     * Gets the number of selected nodes.
+     * @return {Number} The node count
+     */
+    getSelectionCount : function(){
+        return this.selected.getCount();
+    },
+
+    /**
+     * Gets the currently selected nodes.
+     * @return {Array} An array of HTMLElements
+     */
+    getSelectedNodes : function(){
+        return this.selected.elements;
+    },
+
+    /**
+     * Gets the indexes of the selected nodes.
+     * @return {Array} An array of numeric indexes
+     */
+    getSelectedIndexes : function(){
+        var indexes = [], 
+            selected = this.selected.elements,
+            i = 0,
+            len = selected.length;
+            
+        for(; i < len; i++){
+            indexes.push(selected[i].viewIndex);
+        }
+        return indexes;
+    },
+
+    /**
+     * Gets an array of the selected records
+     * @return {Array} An array of {@link Ext.data.Record} objects
+     */
+    getSelectedRecords : function(){
+        return this.getRecords(this.selected.elements);
+    },
+
+    /**
+     * Gets an array of the records from an array of nodes
+     * @param {Array} nodes The nodes to evaluate
+     * @return {Array} records The {@link Ext.data.Record} objects
+     */
+    getRecords : function(nodes){
+        var records = [], 
+            i = 0,
+            len = nodes.length;
+            
+        for(; i < len; i++){
+            records[records.length] = this.store.getAt(nodes[i].viewIndex);
+        }
+        return records;
+    },
+
+    /**
+     * Gets a record from a node
+     * @param {HTMLElement} node The node to evaluate
+     * @return {Record} record The {@link Ext.data.Record} object
+     */
+    getRecord : function(node){
+        return this.store.getAt(node.viewIndex);
+    },
+
+    /**
+     * Clears all selections.
+     * @param {Boolean} suppressEvent (optional) True to skip firing of the selectionchange event
+     */
+    clearSelections : function(suppressEvent, skipUpdate){
+        if((this.multiSelect || this.singleSelect) && this.selected.getCount() > 0){
+            if(!skipUpdate){
+                this.selected.removeClass(this.selectedClass);
+            }
+            this.selected.clear();
+            this.last = false;
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        }
+    },
+
+    /**
+     * Returns true if the passed node is selected, else false.
+     * @param {HTMLElement/Number/Ext.data.Record} node The node, node index or record to check
+     * @return {Boolean} True if selected, else false
+     */
+    isSelected : function(node){
+        return this.selected.contains(this.getNode(node));
+    },
+
+    /**
+     * Deselects a node.
+     * @param {HTMLElement/Number/Record} node The node, node index or record to deselect
+     */
+    deselect : function(node){
+        if(this.isSelected(node)){
+            node = this.getNode(node);
+            this.selected.removeElement(node);
+            if(this.last == node.viewIndex){
+                this.last = false;
+            }
+            Ext.fly(node).removeClass(this.selectedClass);
+            this.fireEvent("selectionchange", this, this.selected.elements);
+        }
+    },
+
+    /**
+     * Selects a set of nodes.
+     * @param {Array/HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node,
+     * id of a template node, record associated with a node or an array of any of those to select
+     * @param {Boolean} keepExisting (optional) true to keep existing selections
+     * @param {Boolean} suppressEvent (optional) true to skip firing of the selectionchange vent
+     */
+    select : function(nodeInfo, keepExisting, suppressEvent){
+        if(Ext.isArray(nodeInfo)){
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            for(var i = 0, len = nodeInfo.length; i < len; i++){
+                this.select(nodeInfo[i], true, true);
+            }
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        } else{
+            var node = this.getNode(nodeInfo);
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            if(node && !this.isSelected(node)){
+                if(this.fireEvent("beforeselect", this, node, this.selected.elements) !== false){
+                    Ext.fly(node).addClass(this.selectedClass);
+                    this.selected.add(node);
+                    this.last = node.viewIndex;
+                    if(!suppressEvent){
+                        this.fireEvent("selectionchange", this, this.selected.elements);
+                    }
+                }
+            }
+        }
+    },
+
+    /**
+     * Selects a range of nodes. All nodes between start and end are selected.
+     * @param {Number} start The index of the first node in the range
+     * @param {Number} end The index of the last node in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(start, end, keepExisting){
+        if(!keepExisting){
+            this.clearSelections(true);
+        }
+        this.select(this.getNodes(start, end), true);
+    },
+
+    /**
+     * Gets a template node.
+     * @param {HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node, 
+     * the id of a template node or the record associated with the node.
+     * @return {HTMLElement} The node or null if it wasn't found
+     */
+    getNode : function(nodeInfo){
+        if(Ext.isString(nodeInfo)){
+            return document.getElementById(nodeInfo);
+        }else if(Ext.isNumber(nodeInfo)){
+            return this.all.elements[nodeInfo];
+        }else if(nodeInfo instanceof Ext.data.Record){
+            var idx = this.store.indexOf(nodeInfo);
+            return this.all.elements[idx];
+        }
+        return nodeInfo;
+    },
+
+    /**
+     * Gets a range nodes.
+     * @param {Number} start (optional) The index of the first node in the range
+     * @param {Number} end (optional) The index of the last node in the range
+     * @return {Array} An array of nodes
+     */
+    getNodes : function(start, end){
+        var ns = this.all.elements,
+            nodes = [],
+            i;
+            
+        start = start || 0;
+        end = !Ext.isDefined(end) ? Math.max(ns.length - 1, 0) : end;
+        if(start <= end){
+            for(i = start; i <= end && ns[i]; i++){
+                nodes.push(ns[i]);
+            }
+        } else{
+            for(i = start; i >= end && ns[i]; i--){
+                nodes.push(ns[i]);
+            }
+        }
+        return nodes;
+    },
+
+    /**
+     * Finds the index of the passed node.
+     * @param {HTMLElement/String/Number/Record} nodeInfo An HTMLElement template node, index of a template node, the id of a template node
+     * or a record associated with a node.
+     * @return {Number} The index of the node or -1
+     */
+    indexOf : function(node){
+        node = this.getNode(node);
+        if(Ext.isNumber(node.viewIndex)){
+            return node.viewIndex;
+        }
+        return this.all.indexOf(node);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(this.loadingText){
+            this.clearSelections(false, true);
+            this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+'</div>');
+            this.all.clear();
+        }
+    },
+
+    onDestroy : function(){
+        this.all.clear();
+        this.selected.clear();
+        Ext.DataView.superclass.onDestroy.call(this);
+        this.bindStore(null);
+    }
+});
+
+/**
+ * Changes the data store bound to this view and refreshes it. (deprecated in favor of bindStore)
+ * @param {Store} store The store to bind to this view
+ */
+Ext.DataView.prototype.setStore = Ext.DataView.prototype.bindStore;
+
+Ext.reg('dataview', Ext.DataView);
+/**
+ * @class Ext.list.ListView
+ * @extends Ext.DataView
+ * <p>Ext.list.ListView is a fast and light-weight implentation of a
+ * {@link Ext.grid.GridPanel Grid} like view with the following characteristics:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>resizable columns</li>
+ * <li>selectable</li>
+ * <li>column widths are initially proportioned by percentage based on the container
+ * width and number of columns</li>
+ * <li>uses templates to render the data in any required format</li>
+ * <li>no horizontal scrolling</li>
+ * <li>no editing</li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+// consume JSON of this form:
+{
+   "images":[
+      {
+         "name":"dance_fever.jpg",
+         "size":2067,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/dance_fever.jpg"
+      },
+      {
+         "name":"zack_sink.jpg",
+         "size":2303,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/zack_sink.jpg"
+      }
+   ]
+}
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var listView = new Ext.list.ListView({
+    store: store,
+    multiSelect: true,
+    emptyText: 'No images to display',
+    reserveScrollOffset: true,
+    columns: [{
+        header: 'File',
+        width: .5,
+        dataIndex: 'name'
+    },{
+        header: 'Last Modified',
+        width: .35,
+        dataIndex: 'lastmod',
+        tpl: '{lastmod:date("m-d h:i a")}'
+    },{
+        header: 'Size',
+        dataIndex: 'size',
+        tpl: '{size:fileSize}', // format using Ext.util.Format.fileSize()
+        align: 'right'
+    }]
+});
+
+// put it in a Panel so it looks pretty
+var panel = new Ext.Panel({
+    id:'images-view',
+    width:425,
+    height:250,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple ListView <i>(0 items selected)</i>',
+    items: listView
+});
+panel.render(document.body);
+
+// little bit of feedback
+listView.on('selectionchange', function(view, nodes){
+    var l = nodes.length;
+    var s = l != 1 ? 's' : '';
+    panel.setTitle('Simple ListView <i>('+l+' item'+s+' selected)</i>');
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ * @xtype listview
+ */
+Ext.list.ListView = Ext.extend(Ext.DataView, {
+    /**
+     * Set this property to <tt>true</tt> to disable the header click handler disabling sort
+     * (defaults to <tt>false</tt>).
+     * @type Boolean
+     * @property disableHeaders
+     */
+    /**
+     * @cfg {Boolean} hideHeaders
+     * <tt>true</tt> to hide the {@link #internalTpl header row} (defaults to <tt>false</tt> so
+     * the {@link #internalTpl header row} will be shown).
+     */
+    /**
+     * @cfg {String} itemSelector
+     * Defaults to <tt>'dl'</tt> to work with the preconfigured <b><tt>{@link Ext.DataView#tpl tpl}</tt></b>.
+     * This setting specifies the CSS selector (e.g. <tt>div.some-class</tt> or <tt>span:first-child</tt>)
+     * that will be used to determine what nodes the ListView will be working with.
+     */
+    itemSelector: 'dl',
+    /**
+     * @cfg {String} selectedClass The CSS class applied to a selected row (defaults to
+     * <tt>'x-list-selected'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-selected {background-color: yellow;}
+    </code></pre>
+     * @type String
+     */
+    selectedClass:'x-list-selected',
+    /**
+     * @cfg {String} overClass The CSS class applied when over a row (defaults to
+     * <tt>'x-list-over'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-over {background-color: orange;}
+    </code></pre>
+     * @type String
+     */
+    overClass:'x-list-over',
+    /**
+     * @cfg {Boolean} reserveScrollOffset
+     * By default will defer accounting for the configured <b><tt>{@link #scrollOffset}</tt></b>
+     * for 10 milliseconds.  Specify <tt>true</tt> to account for the configured
+     * <b><tt>{@link #scrollOffset}</tt></b> immediately.
+     */
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the scrollbar (defaults to
+     * <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+    /**
+     * @cfg {Boolean/Object} columnResize
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.ColumnResizer}
+     * to enable the columns to be resizable (defaults to <tt>true</tt>).
+     */
+    columnResize: true,
+    /**
+     * @cfg {Array} columns An array of column configuration objects, for example:
+     * <pre><code>
+{
+    align: 'right',
+    dataIndex: 'size',
+    header: 'Size',
+    tpl: '{size:fileSize}',
+    width: .35
+}
+     * </code></pre>
+     * Acceptable properties for each column configuration object are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>align</tt></b> : String<div class="sub-desc">Set the CSS text-align property
+     * of the column. Defaults to <tt>'left'</tt>.</div></li>
+     * <li><b><tt>dataIndex</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#dataIndex dataIndex} for details.</div></li>
+     * <li><b><tt>header</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#header header} for details.</div></li>
+     * <li><b><tt>tpl</tt></b> : String<div class="sub-desc">Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.</div></li>
+     * <li><b><tt>width</tt></b> : Number<div class="sub-desc">Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/Object} columnSort
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.Sorter}
+     * to enable the columns to be sortable (defaults to <tt>true</tt>).
+     */
+    columnSort: true,
+    /**
+     * @cfg {String/Array} internalTpl
+     * The template to be used for the header row.  See {@link #tpl} for more details.
+     */
+
+    /*
+     * IE has issues when setting percentage based widths to 100%. Default to 99.
+     */
+    maxColumnWidth: Ext.isIE ? 99 : 100,
+
+    initComponent : function(){
+        if(this.columnResize){
+            this.colResizer = new Ext.list.ColumnResizer(this.colResizer);
+            this.colResizer.init(this);
+        }
+        if(this.columnSort){
+            this.colSorter = new Ext.list.Sorter(this.columnSort);
+            this.colSorter.init(this);
+        }
+        if(!this.internalTpl){
+            this.internalTpl = new Ext.XTemplate(
+                '<div class="x-list-header"><div class="x-list-header-inner">',
+                    '<tpl for="columns">',
+                    '<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',
+                        '{header}',
+                    '</em></div>',
+                    '</tpl>',
+                    '<div class="x-clear"></div>',
+                '</div></div>',
+                '<div class="x-list-body"><div class="x-list-body-inner">',
+                '</div></div>'
+            );
+        }
+        if(!this.tpl){
+            this.tpl = new Ext.XTemplate(
+                '<tpl for="rows">',
+                    '<dl>',
+                        '<tpl for="parent.columns">',
+                        '<dt style="width:{[values.width*100]}%;text-align:{align};">',
+                        '<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',
+                            '{[values.tpl.apply(parent)]}',
+                        '</em></dt>',
+                        '</tpl>',
+                        '<div class="x-clear"></div>',
+                    '</dl>',
+                '</tpl>'
+            );
+        };
+
+        var cs = this.columns,
+            allocatedWidth = 0,
+            colsWithWidth = 0,
+            len = cs.length,
+            columns = [];
+
+        for(var i = 0; i < len; i++){
+            var c = cs[i];
+            if(!c.isColumn) {
+                c.xtype = c.xtype ? (/^lv/.test(c.xtype) ? c.xtype : 'lv' + c.xtype) : 'lvcolumn';
+                c = Ext.create(c);
+            }
+            if(c.width) {
+                allocatedWidth += c.width*100;
+                if(allocatedWidth > this.maxColumnWidth){
+                    c.width -= (allocatedWidth - this.maxColumnWidth) / 100;
+                }
+                colsWithWidth++;
+            }
+            columns.push(c);
+        }
+
+        cs = this.columns = columns;
+
+        // auto calculate missing column widths
+        if(colsWithWidth < len){
+            var remaining = len - colsWithWidth;
+            if(allocatedWidth < this.maxColumnWidth){
+                var perCol = ((this.maxColumnWidth-allocatedWidth) / remaining)/100;
+                for(var j = 0; j < len; j++){
+                    var c = cs[j];
+                    if(!c.width){
+                        c.width = perCol;
+                    }
+                }
+            }
+        }
+        Ext.list.ListView.superclass.initComponent.call(this);
+    },
+
+    onRender : function(){
+        this.autoEl = {
+            cls: 'x-list-wrap'
+        };
+        Ext.list.ListView.superclass.onRender.apply(this, arguments);
+
+        this.internalTpl.overwrite(this.el, {columns: this.columns});
+
+        this.innerBody = Ext.get(this.el.dom.childNodes[1].firstChild);
+        this.innerHd = Ext.get(this.el.dom.firstChild.firstChild);
+
+        if(this.hideHeaders){
+            this.el.dom.firstChild.style.display = 'none';
+        }
+    },
+
+    getTemplateTarget : function(){
+        return this.innerBody;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * view's {@link #tpl template} to render the whole ListView. The returned object
+     * shall contain the following properties:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><b>columns</b> : String<div class="sub-desc">See <tt>{@link #columns}</tt></div></li>
+     * <li><b>rows</b> : String<div class="sub-desc">See
+     * <tt>{@link Ext.DataView}.{@link Ext.DataView#collectData collectData}</div></li>
+     * </ul></div>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Object} A data object containing properties to be processed by a repeating
+     * XTemplate as described above.
+     */
+    collectData : function(){
+        var rs = Ext.list.ListView.superclass.collectData.apply(this, arguments);
+        return {
+            columns: this.columns,
+            rows: rs
+        };
+    },
+
+    verifyInternalSize : function(){
+        if(this.lastSize){
+            this.onResize(this.lastSize.width, this.lastSize.height);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        var body = this.innerBody.dom,
+            header = this.innerHd.dom,
+            scrollWidth = w - Ext.num(this.scrollOffset, Ext.getScrollBarWidth()) + 'px',
+            parentNode;
+            
+        if(!body){
+            return;
+        }
+        parentNode = body.parentNode;
+        if(Ext.isNumber(w)){
+            if(this.reserveScrollOffset || ((parentNode.offsetWidth - parentNode.clientWidth) > 10)){
+                body.style.width = scrollWidth;
+                header.style.width = scrollWidth;
+            }else{
+                body.style.width = w + 'px';
+                header.style.width = w + 'px';
+                setTimeout(function(){
+                    if((parentNode.offsetWidth - parentNode.clientWidth) > 10){
+                        body.style.width = scrollWidth;
+                        header.style.width = scrollWidth;
+                    }
+                }, 10);
+            }
+        }
+        if(Ext.isNumber(h)){
+            parentNode.style.height = Math.max(0, h - header.parentNode.offsetHeight) + 'px';
+        }
+    },
+
+    updateIndexes : function(){
+        Ext.list.ListView.superclass.updateIndexes.apply(this, arguments);
+        this.verifyInternalSize();
+    },
+
+    findHeaderIndex : function(header){
+        header = header.dom || header;
+        var parentNode = header.parentNode, 
+            children = parentNode.parentNode.childNodes,
+            i = 0,
+            c;
+        for(; c = children[i]; i++){
+            if(c == parentNode){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    setHdWidths : function(){
+        var els = this.innerHd.dom.getElementsByTagName('div'),
+            i = 0,
+            columns = this.columns,
+            len = columns.length;
+            
+        for(; i < len; i++){
+            els[i].style.width = (columns[i].width*100) + '%';
+        }
+    }
+});
+
+Ext.reg('listview', Ext.list.ListView);
+
+// Backwards compatibility alias
+Ext.ListView = Ext.list.ListView;/**
+ * @class Ext.list.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.list.ListView ListView}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.list.Column = Ext.extend(Object, {
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ListView constructor method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ListView will recreate a new Ext.list.Column
+     * Defaults to true.
+     */
+    isColumn: true,
+    
+    /**
+     * @cfg {String} align
+     * Set the CSS text-align property of the column. Defaults to <tt>'left'</tt>.
+     */        
+    align: 'left',
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the ListView.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&#160;'</tt>.
+     */    
+    header: '',
+    
+    /**
+     * @cfg {Number} width Optional. Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.
+     */    
+    width: null,
+
+    /**
+     * @cfg {String} cls Optional. This option can be used to add a CSS class to the cell of each
+     * row for this column.
+     */
+    cls: '',
+    
+    /**
+     * @cfg {String} tpl Optional. Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.
+     */
+
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * ListViews's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    
+    constructor : function(c){
+        if(!c.tpl){
+            c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');
+        }
+        else if(Ext.isString(c.tpl)){
+            c.tpl = new Ext.XTemplate(c.tpl);
+        }
+        
+        Ext.apply(this, c);
+    }
+});
+
+Ext.reg('lvcolumn', Ext.list.Column);
+
+/**
+ * @class Ext.list.NumberColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.NumberColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */    
+    format: '0,000.00',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':number("' + (c.format || this.format) + '")}');       
+        Ext.list.NumberColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvnumbercolumn', Ext.list.NumberColumn);
+
+/**
+ * @class Ext.list.DateColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column}
+ * for more details.</p>
+ */
+Ext.list.DateColumn = Ext.extend(Ext.list.Column, {
+    format: 'm/d/Y',
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':date("' + (c.format || this.format) + '")}');      
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+Ext.reg('lvdatecolumn', Ext.list.DateColumn);
+
+/**
+ * @class Ext.list.BooleanColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.list.Column#xtype xtype}
+ * config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.BooleanColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsey (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}');
+        
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        c.tpl.format = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+        
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvbooleancolumn', Ext.list.BooleanColumn);/**
+ * @class Ext.list.ColumnResizer
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.ColumnResizer = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} minPct The minimum percentage to allot for any column (defaults to <tt>.05</tt>)
+     */
+    minPct: .05,
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.ColumnResizer.superclass.constructor.call(this);
+    },
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeStart.createDelegate(this),
+            onStart: this.onStart.createDelegate(this),
+            onDrag: this.onDrag.createDelegate(this),
+            onEnd: this.onEnd.createDelegate(this),
+            tolerance: 3,
+            autoStart: 300
+        });
+        this.tracker.initEl(view.innerHd);
+        view.on('beforedestroy', this.tracker.destroy, this.tracker);
+    },
+
+    handleHdMove : function(e, t){
+        var handleWidth = 5,
+            x = e.getPageX(),
+            header = e.getTarget('em', 3, true);
+        if(header){
+            var region = header.getRegion(),
+                style = header.dom.style,
+                parentNode = header.dom.parentNode;
+
+            if(x - region.left <= handleWidth && parentNode != parentNode.parentNode.firstChild){
+                this.activeHd = Ext.get(parentNode.previousSibling.firstChild);
+                style.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';
+            } else if(region.right - x <= handleWidth && parentNode != parentNode.parentNode.lastChild.previousSibling){
+                this.activeHd = header;
+                style.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';
+            } else{
+                delete this.activeHd;
+                style.cursor = '';
+            }
+        }
+    },
+
+    onBeforeStart : function(e){
+        this.dragHd = this.activeHd;
+        return !!this.dragHd;
+    },
+
+    onStart: function(e){
+        
+        var me = this,
+            view = me.view,
+            dragHeader = me.dragHd,
+            x = me.tracker.getXY()[0];            
+        
+        me.proxy = view.el.createChild({cls:'x-list-resizer'});
+        me.dragX = dragHeader.getX();
+        me.headerIndex = view.findHeaderIndex(dragHeader);
+        
+        me.headersDisabled = view.disableHeaders;
+        view.disableHeaders = true;
+        
+        me.proxy.setHeight(view.el.getHeight());
+        me.proxy.setX(me.dragX);
+        me.proxy.setWidth(x - me.dragX);
+        
+        this.setBoundaries();
+        
+    },
+    
+    // Sets up the boundaries for the drag/drop operation
+    setBoundaries: function(relativeX){
+        var view = this.view,
+            headerIndex = this.headerIndex,
+            width = view.innerHd.getWidth(),
+            relativeX = view.innerHd.getX(),
+            minWidth = Math.ceil(width * this.minPct),
+            maxWidth = width - minWidth,
+            numColumns = view.columns.length,
+            headers = view.innerHd.select('em', true),
+            minX = minWidth + relativeX,
+            maxX = maxWidth + relativeX,
+            header;
+          
+        if (numColumns == 2) {
+            this.minX = minX;
+            this.maxX = maxX;
+        }else{
+            header = headers.item(headerIndex + 2);
+            this.minX = headers.item(headerIndex).getX() + minWidth;
+            this.maxX = header ? header.getX() - minWidth : maxX;
+            if (headerIndex == 0) {
+                // First
+                this.minX = minX;
+            } else if (headerIndex == numColumns - 2) {
+                // Last
+                this.maxX = maxX;
+            }
+        }
+    },
+
+    onDrag: function(e){
+        var me = this,
+            cursorX = me.tracker.getXY()[0].constrain(me.minX, me.maxX);
+            
+        me.proxy.setWidth(cursorX - this.dragX);
+    },
+
+    onEnd: function(e){
+        /* calculate desired width by measuring proxy and then remove it */
+        var newWidth = this.proxy.getWidth(),
+            index = this.headerIndex,
+            view = this.view,
+            columns = view.columns,
+            width = view.innerHd.getWidth(),
+            newPercent = Math.ceil(newWidth * view.maxColumnWidth / width) / 100,
+            disabled = this.headersDisabled,
+            headerCol = columns[index],
+            otherCol = columns[index + 1],
+            totalPercent = headerCol.width + otherCol.width;
+
+        this.proxy.remove();
+
+        headerCol.width = newPercent;
+        otherCol.width = totalPercent - newPercent;
+      
+        delete this.dragHd;
+        view.setHdWidths();
+        view.refresh();
+        
+        setTimeout(function(){
+            view.disableHeaders = disabled;
+        }, 100);
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.ColumnResizer = Ext.list.ColumnResizer;/**
+ * @class Ext.list.Sorter
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.Sorter = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Array} sortClasses
+     * The CSS classes applied to a header when it is sorted. (defaults to <tt>["sort-asc", "sort-desc"]</tt>)
+     */
+    sortClasses : ["sort-asc", "sort-desc"],
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.Sorter.superclass.constructor.call(this);
+    },
+
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'click', this.onHdClick, this);
+        view.innerHd.setStyle('cursor', 'pointer');
+        view.mon(view.store, 'datachanged', this.updateSortState, this);
+        this.updateSortState.defer(10, this, [view.store]);
+    },
+
+    updateSortState : function(store){
+        var state = store.getSortState();
+        if(!state){
+            return;
+        }
+        this.sortState = state;
+        var cs = this.view.columns, sortColumn = -1;
+        for(var i = 0, len = cs.length; i < len; i++){
+            if(cs[i].dataIndex == state.field){
+                sortColumn = i;
+                break;
+            }
+        }
+        if(sortColumn != -1){
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    updateSortIcon : function(col, dir){
+        var sc = this.sortClasses;
+        var hds = this.view.innerHd.select('em').removeClass(sc);
+        hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);
+    },
+
+    onHdClick : function(e){
+        var hd = e.getTarget('em', 3);
+        if(hd && !this.view.disableHeaders){
+            var index = this.view.findHeaderIndex(hd);
+            this.view.store.sort(this.view.columns[index].dataIndex);
+        }
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.Sorter = Ext.list.Sorter;
Index: /trunk/workshop-routing-foss4g/web/ext/ext-all-debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/ext-all-debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/ext-all-debug.js	(revision 76)
@@ -0,0 +1,52079 @@
+
+(function(){
+
+var EXTUTIL = Ext.util,
+    EACH = Ext.each,
+    TRUE = true,
+    FALSE = false;
+
+EXTUTIL.Observable = function(){
+    
+    var me = this, e = me.events;
+    if(me.listeners){
+        me.on(me.listeners);
+        delete me.listeners;
+    }
+    me.events = e || {};
+};
+
+EXTUTIL.Observable.prototype = {
+    
+    filterOptRe : /^(?:scope|delay|buffer|single)$/,
+
+    
+    fireEvent : function(){
+        var a = Array.prototype.slice.call(arguments, 0),
+            ename = a[0].toLowerCase(),
+            me = this,
+            ret = TRUE,
+            ce = me.events[ename],
+            cc,
+            q,
+            c;
+        if (me.eventsSuspended === TRUE) {
+            if (q = me.eventQueue) {
+                q.push(a);
+            }
+        }
+        else if(typeof ce == 'object') {
+            if (ce.bubble){
+                if(ce.fire.apply(ce, a.slice(1)) === FALSE) {
+                    return FALSE;
+                }
+                c = me.getBubbleTarget && me.getBubbleTarget();
+                if(c && c.enableBubble) {
+                    cc = c.events[ename];
+                    if(!cc || typeof cc != 'object' || !cc.bubble) {
+                        c.enableBubble(ename);
+                    }
+                    return c.fireEvent.apply(c, a);
+                }
+            }
+            else {
+                a.shift();
+                ret = ce.fire.apply(ce, a);
+            }
+        }
+        return ret;
+    },
+
+    
+    addListener : function(eventName, fn, scope, o){
+        var me = this,
+            e,
+            oe,
+            ce;
+            
+        if (typeof eventName == 'object') {
+            o = eventName;
+            for (e in o) {
+                oe = o[e];
+                if (!me.filterOptRe.test(e)) {
+                    me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o);
+                }
+            }
+        } else {
+            eventName = eventName.toLowerCase();
+            ce = me.events[eventName] || TRUE;
+            if (typeof ce == 'boolean') {
+                me.events[eventName] = ce = new EXTUTIL.Event(me, eventName);
+            }
+            ce.addListener(fn, scope, typeof o == 'object' ? o : {});
+        }
+    },
+
+    
+    removeListener : function(eventName, fn, scope){
+        var ce = this.events[eventName.toLowerCase()];
+        if (typeof ce == 'object') {
+            ce.removeListener(fn, scope);
+        }
+    },
+
+    
+    purgeListeners : function(){
+        var events = this.events,
+            evt,
+            key;
+        for(key in events){
+            evt = events[key];
+            if(typeof evt == 'object'){
+                evt.clearListeners();
+            }
+        }
+    },
+
+    
+    addEvents : function(o){
+        var me = this;
+        me.events = me.events || {};
+        if (typeof o == 'string') {
+            var a = arguments,
+                i = a.length;
+            while(i--) {
+                me.events[a[i]] = me.events[a[i]] || TRUE;
+            }
+        } else {
+            Ext.applyIf(me.events, o);
+        }
+    },
+
+    
+    hasListener : function(eventName){
+        var e = this.events[eventName.toLowerCase()];
+        return typeof e == 'object' && e.listeners.length > 0;
+    },
+
+    
+    suspendEvents : function(queueSuspended){
+        this.eventsSuspended = TRUE;
+        if(queueSuspended && !this.eventQueue){
+            this.eventQueue = [];
+        }
+    },
+
+    
+    resumeEvents : function(){
+        var me = this,
+            queued = me.eventQueue || [];
+        me.eventsSuspended = FALSE;
+        delete me.eventQueue;
+        EACH(queued, function(e) {
+            me.fireEvent.apply(me, e);
+        });
+    }
+};
+
+var OBSERVABLE = EXTUTIL.Observable.prototype;
+
+OBSERVABLE.on = OBSERVABLE.addListener;
+
+OBSERVABLE.un = OBSERVABLE.removeListener;
+
+
+EXTUTIL.Observable.releaseCapture = function(o){
+    o.fireEvent = OBSERVABLE.fireEvent;
+};
+
+function createTargeted(h, o, scope){
+    return function(){
+        if(o.target == arguments[0]){
+            h.apply(scope, Array.prototype.slice.call(arguments, 0));
+        }
+    };
+};
+
+function createBuffered(h, o, l, scope){
+    l.task = new EXTUTIL.DelayedTask();
+    return function(){
+        l.task.delay(o.buffer, h, scope, Array.prototype.slice.call(arguments, 0));
+    };
+};
+
+function createSingle(h, e, fn, scope){
+    return function(){
+        e.removeListener(fn, scope);
+        return h.apply(scope, arguments);
+    };
+};
+
+function createDelayed(h, o, l, scope){
+    return function(){
+        var task = new EXTUTIL.DelayedTask(),
+            args = Array.prototype.slice.call(arguments, 0);
+        if(!l.tasks) {
+            l.tasks = [];
+        }
+        l.tasks.push(task);
+        task.delay(o.delay || 10, function(){
+            l.tasks.remove(task);
+            h.apply(scope, args);
+        }, scope);
+    };
+};
+
+EXTUTIL.Event = function(obj, name){
+    this.name = name;
+    this.obj = obj;
+    this.listeners = [];
+};
+
+EXTUTIL.Event.prototype = {
+    addListener : function(fn, scope, options){
+        var me = this,
+            l;
+        scope = scope || me.obj;
+        if(!me.isListening(fn, scope)){
+            l = me.createListener(fn, scope, options);
+            if(me.firing){ 
+                me.listeners = me.listeners.slice(0);
+            }
+            me.listeners.push(l);
+        }
+    },
+
+    createListener: function(fn, scope, o){
+        o = o || {};
+        scope = scope || this.obj;
+        var l = {
+            fn: fn,
+            scope: scope,
+            options: o
+        }, h = fn;
+        if(o.target){
+            h = createTargeted(h, o, scope);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, l, scope);
+        }
+        if(o.single){
+            h = createSingle(h, this, fn, scope);
+        }
+        if(o.buffer){
+            h = createBuffered(h, o, l, scope);
+        }
+        l.fireFn = h;
+        return l;
+    },
+
+    findListener : function(fn, scope){
+        var list = this.listeners,
+            i = list.length,
+            l;
+
+        scope = scope || this.obj;
+        while(i--){
+            l = list[i];
+            if(l){
+                if(l.fn == fn && l.scope == scope){
+                    return i;
+                }
+            }
+        }
+        return -1;
+    },
+
+    isListening : function(fn, scope){
+        return this.findListener(fn, scope) != -1;
+    },
+
+    removeListener : function(fn, scope){
+        var index,
+            l,
+            k,
+            me = this,
+            ret = FALSE;
+        if((index = me.findListener(fn, scope)) != -1){
+            if (me.firing) {
+                me.listeners = me.listeners.slice(0);
+            }
+            l = me.listeners[index];
+            if(l.task) {
+                l.task.cancel();
+                delete l.task;
+            }
+            k = l.tasks && l.tasks.length;
+            if(k) {
+                while(k--) {
+                    l.tasks[k].cancel();
+                }
+                delete l.tasks;
+            }
+            me.listeners.splice(index, 1);
+            ret = TRUE;
+        }
+        return ret;
+    },
+
+    
+    clearListeners : function(){
+        var me = this,
+            l = me.listeners,
+            i = l.length;
+        while(i--) {
+            me.removeListener(l[i].fn, l[i].scope);
+        }
+    },
+
+    fire : function(){
+        var me = this,
+            listeners = me.listeners,
+            len = listeners.length,
+            i = 0,
+            l;
+
+        if(len > 0){
+            me.firing = TRUE;
+            var args = Array.prototype.slice.call(arguments, 0);
+            for (; i < len; i++) {
+                l = listeners[i];
+                if(l && l.fireFn.apply(l.scope || me.obj || window, args) === FALSE) {
+                    return (me.firing = FALSE);
+                }
+            }
+        }
+        me.firing = FALSE;
+        return TRUE;
+    }
+
+};
+})();
+
+Ext.DomHelper = function(){
+    var tempTableEl = null,
+        emptyTags = /^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,
+        tableRe = /^table|tbody|tr|td$/i,
+        confRe = /tag|children|cn|html$/i,
+        tableElRe = /td|tr|tbody/i,
+        cssRe = /([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,
+        endRe = /end/i,
+        pub,
+        
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        ts = '<table>',
+        te = '</table>',
+        tbs = ts+'<tbody>',
+        tbe = '</tbody>'+te,
+        trs = tbs + '<tr>',
+        tre = '</tr>'+tbe;
+
+    
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        var newNode = pub.insertHtml(pos, Ext.getDom(el), createHtml(o));
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    
+    function createHtml(o){
+        var b = '',
+            attr,
+            val,
+            key,
+            cn;
+
+        if(typeof o == "string"){
+            b = o;
+        } else if (Ext.isArray(o)) {
+            for (var i=0; i < o.length; i++) {
+                if(o[i]) {
+                    b += createHtml(o[i]);
+                }
+            };
+        } else {
+            b += '<' + (o.tag = o.tag || 'div');
+            for (attr in o) {
+                val = o[attr];
+                if(!confRe.test(attr)){
+                    if (typeof val == "object") {
+                        b += ' ' + attr + '="';
+                        for (key in val) {
+                            b += key + ':' + val[key] + ';';
+                        };
+                        b += '"';
+                    }else{
+                        b += ' ' + ({cls : 'class', htmlFor : 'for'}[attr] || attr) + '="' + val + '"';
+                    }
+                }
+            };
+            
+            if (emptyTags.test(o.tag)) {
+                b += '/>';
+            } else {
+                b += '>';
+                if ((cn = o.children || o.cn)) {
+                    b += createHtml(cn);
+                } else if(o.html){
+                    b += o.html;
+                }
+                b += '</' + o.tag + '>';
+            }
+        }
+        return b;
+    }
+
+    function ieTable(depth, s, h, e){
+        tempTableEl.innerHTML = [s, h, e].join('');
+        var i = -1,
+            el = tempTableEl,
+            ns;
+        while(++i < depth){
+            el = el.firstChild;
+        }
+
+        if(ns = el.nextSibling){
+            var df = document.createDocumentFragment();
+            while(el){
+                ns = el.nextSibling;
+                df.appendChild(el);
+                el = ns;
+            }
+            el = df;
+        }
+        return el;
+    }
+
+    
+    function insertIntoTable(tag, where, el, html) {
+        var node,
+            before;
+
+        tempTableEl = tempTableEl || document.createElement('div');
+
+        if(tag == 'td' && (where == afterbegin || where == beforeend) ||
+           !tableElRe.test(tag) && (where == beforebegin || where == afterend)) {
+            return;
+        }
+        before = where == beforebegin ? el :
+                 where == afterend ? el.nextSibling :
+                 where == afterbegin ? el.firstChild : null;
+
+        if (where == beforebegin || where == afterend) {
+            el = el.parentNode;
+        }
+
+        if (tag == 'td' || (tag == 'tr' && (where == beforeend || where == afterbegin))) {
+            node = ieTable(4, trs, html, tre);
+        } else if ((tag == 'tbody' && (where == beforeend || where == afterbegin)) ||
+                   (tag == 'tr' && (where == beforebegin || where == afterend))) {
+            node = ieTable(3, tbs, html, tbe);
+        } else {
+            node = ieTable(2, ts, html, te);
+        }
+        el.insertBefore(node, before);
+        return node;
+    }
+
+       
+    function createContextualFragment(html){
+        var div = document.createElement("div"),
+            fragment = document.createDocumentFragment(),
+            i = 0,
+            length, childNodes;
+        
+        div.innerHTML = html;
+        childNodes = div.childNodes;
+        length = childNodes.length;
+        
+        for (; i < length; i++) {
+            fragment.appendChild(childNodes[i].cloneNode(true));
+        }
+        
+        return fragment;
+    }
+    
+    pub = {
+        
+        markup : function(o){
+            return createHtml(o);
+        },
+
+        
+        applyStyles : function(el, styles){
+            if (styles) {
+                var matches;
+
+                el = Ext.fly(el);
+                if (typeof styles == "function") {
+                    styles = styles.call();
+                }
+                if (typeof styles == "string") {
+                    
+                    cssRe.lastIndex = 0;
+                    while ((matches = cssRe.exec(styles))) {
+                        el.setStyle(matches[1], matches[2]);
+                    }
+                } else if (typeof styles == "object") {
+                    el.setStyle(styles);
+                }
+            }
+        },
+        
+        insertHtml : function(where, el, html){
+            var hash = {},
+                hashVal,
+                range,
+                rangeEl,
+                setStart,
+                frag,
+                rs;
+
+            where = where.toLowerCase();
+            
+            hash[beforebegin] = ['BeforeBegin', 'previousSibling'];
+            hash[afterend] = ['AfterEnd', 'nextSibling'];
+
+            if (el.insertAdjacentHTML) {
+                if(tableRe.test(el.tagName) && (rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html))){
+                    return rs;
+                }
+                
+                hash[afterbegin] = ['AfterBegin', 'firstChild'];
+                hash[beforeend] = ['BeforeEnd', 'lastChild'];
+                if ((hashVal = hash[where])) {
+                    el.insertAdjacentHTML(hashVal[0], html);
+                    return el[hashVal[1]];
+                }
+            } else {
+                range = el.ownerDocument.createRange();
+                setStart = 'setStart' + (endRe.test(where) ? 'After' : 'Before');
+                if (hash[where]) {
+                    range[setStart](el);
+                    if (!range.createContextualFragment) {
+                        frag = createContextualFragment(html);
+                    }
+                    else {
+                        frag = range.createContextualFragment(html);
+                    }
+                    el.parentNode.insertBefore(frag, where == beforebegin ? el : el.nextSibling);
+                    return el[(where == beforebegin ? 'previous' : 'next') + 'Sibling'];
+                } else {
+                    rangeEl = (where == afterbegin ? 'first' : 'last') + 'Child';
+                    if (el.firstChild) {
+                        range[setStart](el[rangeEl]);
+                        if (!range.createContextualFragment) {
+                            frag = createContextualFragment(html);
+                        }
+                        else {
+                            frag = range.createContextualFragment(html);
+                        }
+                        if(where == afterbegin){
+                            el.insertBefore(frag, el.firstChild);
+                        }else{
+                            el.appendChild(frag);
+                        }
+                    } else {
+                        el.innerHTML = html;
+                    }
+                    return el[rangeEl];
+                }
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        },
+
+        
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        
+        append : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        
+        overwrite : function(el, o, returnElement){
+            el = Ext.getDom(el);
+            el.innerHTML = createHtml(o);
+            return returnElement ? Ext.get(el.firstChild) : el.firstChild;
+        },
+
+        createHtml : createHtml
+    };
+    return pub;
+}();
+
+Ext.Template = function(html){
+    var me = this,
+        a = arguments,
+        buf = [],
+        v;
+
+    if (Ext.isArray(html)) {
+        html = html.join("");
+    } else if (a.length > 1) {
+        for(var i = 0, len = a.length; i < len; i++){
+            v = a[i];
+            if(typeof v == 'object'){
+                Ext.apply(me, v);
+            } else {
+                buf.push(v);
+            }
+        };
+        html = buf.join('');
+    }
+
+    
+    me.html = html;
+    
+    if (me.compiled) {
+        me.compile();
+    }
+};
+Ext.Template.prototype = {
+    
+    re : /\{([\w\-]+)\}/g,
+    
+
+    
+    applyTemplate : function(values){
+        var me = this;
+
+        return me.compiled ?
+                me.compiled(values) :
+                me.html.replace(me.re, function(m, name){
+                    return values[name] !== undefined ? values[name] : "";
+                });
+    },
+
+    
+    set : function(html, compile){
+        var me = this;
+        me.html = html;
+        me.compiled = null;
+        return compile ? me.compile() : me;
+    },
+
+    
+    compile : function(){
+        var me = this,
+            sep = Ext.isGecko ? "+" : ",";
+
+        function fn(m, name){
+            name = "values['" + name + "']";
+            return "'"+ sep + '(' + name + " == undefined ? '' : " + name + ')' + sep + "'";
+        }
+
+        eval("this.compiled = function(values){ return " + (Ext.isGecko ? "'" : "['") +
+             me.html.replace(/\\/g, '\\\\').replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn) +
+             (Ext.isGecko ?  "';};" : "'].join('');};"));
+        return me;
+    },
+
+    
+    insertFirst: function(el, values, returnElement){
+        return this.doInsert('afterBegin', el, values, returnElement);
+    },
+
+    
+    insertBefore: function(el, values, returnElement){
+        return this.doInsert('beforeBegin', el, values, returnElement);
+    },
+
+    
+    insertAfter : function(el, values, returnElement){
+        return this.doInsert('afterEnd', el, values, returnElement);
+    },
+
+    
+    append : function(el, values, returnElement){
+        return this.doInsert('beforeEnd', el, values, returnElement);
+    },
+
+    doInsert : function(where, el, values, returnEl){
+        el = Ext.getDom(el);
+        var newNode = Ext.DomHelper.insertHtml(where, el, this.applyTemplate(values));
+        return returnEl ? Ext.get(newNode, true) : newNode;
+    },
+
+    
+    overwrite : function(el, values, returnElement){
+        el = Ext.getDom(el);
+        el.innerHTML = this.applyTemplate(values);
+        return returnElement ? Ext.get(el.firstChild, true) : el.firstChild;
+    }
+};
+
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+
+
+Ext.Template.from = function(el, config){
+    el = Ext.getDom(el);
+    return new Ext.Template(el.value || el.innerHTML, config || '');
+};
+
+
+Ext.DomQuery = function(){
+    var cache = {}, 
+    	simpleCache = {}, 
+    	valueCache = {},
+    	nonSpace = /\S/,
+    	trimRe = /^\s+|\s+$/g,
+    	tplRe = /\{(\d+)\}/g,
+    	modeRe = /^(\s?[\/>+~]\s?|\s|$)/,
+    	tagTokenRe = /^(#)?([\w\-\*]+)/,
+    	nthRe = /(\d*)n\+?(\d*)/, 
+    	nthRe2 = /\D/,
+    	
+	
+	
+	isIE = window.ActiveXObject ? true : false,
+	key = 30803;
+    
+    
+    
+    eval("var batch = 30803;");    	
+
+    
+    
+    function child(parent, index){
+        var i = 0,
+            n = parent.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               if(++i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    }
+
+    
+    function next(n){	
+        while((n = n.nextSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    
+    function prev(n){
+        while((n = n.previousSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    
+    
+    function children(parent){
+        var n = parent.firstChild,
+	    nodeIndex = -1,
+	    nextNode;
+	while(n){
+	    nextNode = n.nextSibling;
+	    
+	    if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+		parent.removeChild(n);
+	    }else{
+		
+		n.nodeIndex = ++nodeIndex;
+	    }
+	    n = nextNode;
+	}
+	return this;
+    }
+
+
+    
+    
+    function byClassName(nodeSet, cls){
+        if(!cls){
+            return nodeSet;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = nodeSet[i]; i++){
+            if((' '+ci.className+' ').indexOf(cls) != -1){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    };
+
+    function attrValue(n, attr){
+	
+        if(!n.tagName && typeof n.length != "undefined"){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+
+        if(attr == "for"){
+            return n.htmlFor;
+        }
+        if(attr == "class" || attr == "className"){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+
+    };
+
+
+    
+    
+    
+    function getNodes(ns, mode, tagName){
+        var result = [], ri = -1, cs;
+        if(!ns){
+            return result;
+        }
+        tagName = tagName || "*";
+	
+        if(typeof ns.getElementsByTagName != "undefined"){
+            ns = [ns];
+        }
+	
+	
+	
+        if(!mode){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                for(var j = 0, ci; ci = cs[j]; j++){
+                    result[++ri] = ci;
+                }
+            }
+	
+	
+        } else if(mode == "/" || mode == ">"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, ni, cn; ni = ns[i]; i++){
+                cn = ni.childNodes;
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.nodeName == utag || cj.nodeName == tagName  || tagName == '*'){
+                        result[++ri] = cj;
+                    }
+                }
+            }
+	
+	
+        }else if(mode == "+"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling) && n.nodeType != 1);
+                if(n && (n.nodeName == utag || n.nodeName == tagName || tagName == '*')){
+                    result[++ri] = n;
+                }
+            }
+	
+	
+        }else if(mode == "~"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling)){
+                    if (n.nodeName == utag || n.nodeName == tagName || tagName == '*'){
+                        result[++ri] = n;
+                    }
+                }
+            }
+        }
+        return result;
+    }
+
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var result = [], ri = -1;
+        tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase() == tagName){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byId(cs, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci && ci.id == id){
+                result[++ri] = ci;
+                return result;
+            }
+        }
+        return result;
+    }
+
+    
+    
+    function byAttribute(cs, attr, value, op, custom){
+        var result = [], 
+            ri = -1, 
+            useGetStyle = custom == "{",	    
+            fn = Ext.DomQuery.operators[op],	    
+            a,
+            xml,
+            hasXml;
+            
+        for(var i = 0, ci; ci = cs[i]; i++){
+	    
+            if(ci.nodeType != 1){
+                continue;
+            }
+            
+            if(!hasXml){
+                xml = Ext.DomQuery.isXml(ci);
+                hasXml = true;
+            }
+	    
+            
+            if(!xml){
+                if(useGetStyle){
+                    a = Ext.DomQuery.getStyle(ci, attr);
+                } else if (attr == "class" || attr == "className"){
+                    a = ci.className;
+                } else if (attr == "for"){
+                    a = ci.htmlFor;
+                } else if (attr == "href"){
+		    
+		    
+                    a = ci.getAttribute("href", 2);
+                } else{
+                    a = ci.getAttribute(attr);
+                }
+            }else{
+                a = ci.getAttribute(attr);
+            }
+            if((fn && fn(a, value)) || (!fn && a)){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    }
+
+    function nodupIEXml(cs){
+        var d = ++key, 
+            r;
+        cs[0].setAttribute("_nodup", d);
+        r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!c.getAttribute("_nodup") != d){
+                c.setAttribute("_nodup", d);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].removeAttribute("_nodup");
+        }
+        return r;
+    }
+
+    function nodup(cs){
+        if(!cs){
+            return [];
+        }
+        var len = cs.length, c, i, r = cs, cj, ri = -1;
+        if(!len || typeof cs.nodeType != "undefined" || len == 1){
+            return cs;
+        }
+        if(isIE && typeof cs[0].selectSingleNode != "undefined"){
+            return nodupIEXml(cs);
+        }
+        var d = ++key;
+        cs[0]._nodup = d;
+        for(i = 1; c = cs[i]; i++){
+            if(c._nodup != d){
+                c._nodup = d;
+            }else{
+                r = [];
+                for(var j = 0; j < i; j++){
+                    r[++ri] = cs[j];
+                }
+                for(j = i+1; cj = cs[j]; j++){
+                    if(cj._nodup != d){
+                        cj._nodup = d;
+                        r[++ri] = cj;
+                    }
+                }
+                return r;
+            }
+        }
+        return r;
+    }
+
+    function quickDiffIEXml(c1, c2){
+        var d = ++key,
+            r = [];
+        for(var i = 0, len = c1.length; i < len; i++){
+            c1[i].setAttribute("_qdiff", d);
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i].getAttribute("_qdiff") != d){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+           c1[i].removeAttribute("_qdiff");
+        }
+        return r;
+    }
+
+    function quickDiff(c1, c2){
+        var len1 = c1.length,
+        	d = ++key,
+        	r = [];
+        if(!len1){
+            return c2;
+        }
+        if(isIE && typeof c1[0].selectSingleNode != "undefined"){
+            return quickDiffIEXml(c1, c2);
+        }        
+        for(var i = 0; i < len1; i++){
+            c1[i]._qdiff = d;
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i]._qdiff != d){
+                r[r.length] = c2[i];
+            }
+        }
+        return r;
+    }
+
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, "*");
+        return byId(ns, id);
+    }
+
+    return {
+        getStyle : function(el, name){
+            return Ext.fly(el).getStyle(name);
+        },
+        
+        compile : function(path, type){
+            type = type || "select";
+
+    	    
+            var fn = ["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],
+        		mode,		
+        		lastPath,
+            	matchers = Ext.DomQuery.matchers,
+            	matchersLn = matchers.length,
+            	modeMatch,
+            	
+            	lmode = path.match(modeRe);
+            
+            if(lmode && lmode[1]){
+                fn[fn.length] = 'mode="'+lmode[1].replace(trimRe, "")+'";';
+                path = path.replace(lmode[1], "");
+            }
+	    
+            
+            while(path.substr(0, 1)=="/"){
+                path = path.substr(1);
+            }
+
+            while(path && lastPath != path){
+                lastPath = path;
+                var tokenMatch = path.match(tagTokenRe);
+                if(type == "select"){
+                    if(tokenMatch){
+			
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tokenMatch[2]+'");';			
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }else if(path.substr(0, 1) != '@'){
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+		
+                }else{
+                    if(tokenMatch){
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = byId(n, "'+tokenMatch[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }
+                }
+                while(!(modeMatch = path.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < matchersLn; j++){
+                        var t = matchers[j];
+                        var m = path.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+				return m[i];
+			    });
+                            path = path.replace(m[0], "");
+                            matched = true;
+                            break;
+                        }
+                    }
+                    
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + path + '"';
+                    }
+                }
+                if(modeMatch[1]){
+                    fn[fn.length] = 'mode="'+modeMatch[1].replace(trimRe, "")+'";';
+                    path = path.replace(modeMatch[1], "");
+                }
+            }
+	    
+            fn[fn.length] = "return nodup(n);\n}";
+	    
+	    
+            eval(fn.join(""));
+            return f;
+        },
+
+        
+	jsSelect: function(path, root, type){
+	    
+	    root = root || document;
+	    
+            if(typeof root == "string"){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(","),
+            	results = [];
+		
+	    
+            for(var i = 0, len = paths.length; i < len; i++){		
+                var subPath = paths[i].replace(trimRe, "");
+		
+                if(!cache[subPath]){
+                    cache[subPath] = Ext.DomQuery.compile(subPath);
+                    if(!cache[subPath]){
+                        throw subPath + " is not a valid selector";
+                    }
+                }
+                var result = cache[subPath](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+	    
+	    
+	    
+            if(paths.length > 1){
+                return nodup(results);
+            }
+            return results;
+        },
+	isXml: function(el) {
+	    var docEl = (el ? el.ownerDocument || el : 0).documentElement;
+	    return docEl ? docEl.nodeName !== "HTML" : false;
+	},
+        select : document.querySelectorAll ? function(path, root, type) {
+	    root = root || document;
+	    if (!Ext.DomQuery.isXml(root)) {
+		try {
+		    var cs = root.querySelectorAll(path);
+		    return Ext.toArray(cs);
+		}
+		catch (ex) {}		
+	    }	    
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	} : function(path, root, type) {
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	},
+
+        
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+
+        
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, "");
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, "select");
+            }
+            var n = valueCache[path](root), v;
+            n = n[0] ? n[0] : n;
+            	    
+	    
+	    
+	    
+	    
+            if (typeof n.normalize == 'function') n.normalize();
+            
+            v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return ((v === null||v === undefined||v==='') ? defaultValue : v);
+        },
+
+        
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+
+        
+        is : function(el, ss){
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            var isArray = Ext.isArray(el),
+            	result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+
+        
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, "");
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, "simple");
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+
+        
+        matchers : [{
+                re: /^\.([\w\-]+)/,
+                select: 'n = byClassName(n, " {1} ");'
+            }, {
+                re: /^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w\-]+)/,
+                select: 'n = byId(n, "{1}");'
+            },{
+                re: /^@([\w\-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *=, %=, |= and ~=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c</i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            "=" : function(a, v){
+                return a == v;
+            },
+            "!=" : function(a, v){
+                return a != v;
+            },
+            "^=" : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            "$=" : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            "*=" : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            "%=" : function(a, v){
+                return (a % v) == 0;
+            },
+            "|=" : function(a, v){
+                return a && (a == v || a.substr(0, v.length+1) == v+'-');
+            },
+            "~=" : function(a, v){
+                return a && (' '+a+' ').indexOf(' '+v+' ') != -1;
+            }
+        },
+
+        /**
+         * <p>Object hash of "pseudo class" filter functions which are used when filtering selections. Each function is passed
+         * two parameters:</p><div class="mdetail-params"><ul>
+         * <li><b>c</b> : Array<div class="sub-desc">An Array of DOM elements to filter.</div></li>
+         * <li><b>v</b> : String<div class="sub-desc">The argument (if any) supplied in the selector.</div></li>
+         * </ul></div>
+         * <p>A filter function returns an Array of DOM elements which conform to the pseudo class.</p>
+         * <p>In addition to the provided pseudo classes listed above such as <code>first-child</code> and <code>nth-child</code>,
+         * developers may add additional, custom psuedo class filters to select elements according to application-specific requirements.</p>
+         * <p>For example, to filter <code>&lt;a></code> elements to only return links to <i>external</i> resources:</p>
+         * <code><pre>
+Ext.DomQuery.pseudos.external = function(c, v){
+    var r = [], ri = -1;
+    for(var i = 0, ci; ci = c[i]; i++){
+//      Include in result set only if it's a link to an external resource
+        if(ci.hostname != location.hostname){
+            r[++ri] = ci;
+        }
+    }
+    return r;
+};</pre></code>
+         * Then external links could be gathered with the following statement:<code><pre>
+var externalLinks = Ext.select("a:external");
+</code></pre>
+         */
+        pseudos : {
+            "first-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.previousSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "last-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.nextSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nth-child" : function(c, a) {
+                var r = [], ri = -1,
+                	m = nthRe.exec(a == "even" && "2n" || a == "odd" && "2n+1" || !nthRe2.test(a) && "n+" + a || a),
+                	f = (m[1] || 1) - 0, l = m[2] - 0;
+                for(var i = 0, n; n = c[i]; i++){
+                    var pn = n.parentNode;
+                    if (batch != pn._batch) {
+                        var j = 0;
+                        for(var cn = pn.firstChild; cn; cn = cn.nextSibling){
+                            if(cn.nodeType == 1){
+                               cn.nodeIndex = ++j;
+                            }
+                        }
+                        pn._batch = batch;
+                    }
+                    if (f == 1) {
+                        if (l == 0 || n.nodeIndex == l){
+                            r[++ri] = n;
+                        }
+                    } else if ((n.nodeIndex + l) % f == 0){
+                        r[++ri] = n;
+                    }
+                }
+
+                return r;
+            },
+
+            "only-child" : function(c){
+                var r = [], ri = -1;;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(!prev(ci) && !next(ci)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "empty" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var cns = ci.childNodes, j = 0, cn, empty = true;
+                    while(cn = cns[j]){
+                        ++j;
+                        if(cn.nodeType == 1 || cn.nodeType == 3){
+                            empty = false;
+                            break;
+                        }
+                    }
+                    if(empty){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "contains" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if((ci.textContent||ci.innerText||'').indexOf(v) != -1){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nodeValue" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.firstChild && ci.firstChild.nodeValue == v){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "checked" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.checked == true){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "not" : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+
+            "any" : function(c, selectors){
+                var ss = selectors.split('|'),
+                	r = [], ri = -1, s;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    for(var j = 0; s = ss[j]; j++){
+                        if(Ext.DomQuery.is(ci, s)){
+                            r[++ri] = ci;
+                            break;
+                        }
+                    }
+                }
+                return r;
+            },
+
+            "odd" : function(c){
+                return this["nth-child"](c, "odd");
+            },
+
+            "even" : function(c){
+                return this["nth-child"](c, "even");
+            },
+
+            "nth" : function(c, a){
+                return c[a-1] || [];
+            },
+
+            "first" : function(c){
+                return c[0] || [];
+            },
+
+            "last" : function(c){
+                return c[c.length-1] || [];
+            },
+
+            "has" : function(c, ss){
+                var s = Ext.DomQuery.select,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "next" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "prev" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
+/**
+ * @class Ext.util.DelayedTask
+ * <p> The DelayedTask class provides a convenient way to "buffer" the execution of a method,
+ * performing setTimeout where a new timeout cancels the old timeout. When called, the
+ * task will wait the specified time period before executing. If durng that time period,
+ * the task is called again, the original call will be cancelled. This continues so that
+ * the function is only called a single time for each iteration.</p>
+ * <p>This method is especially useful for things like detecting whether a user has finished
+ * typing in a text field. An example would be performing validation on a keypress. You can
+ * use this class to buffer the keypress events for a certain number of milliseconds, and
+ * perform only if they stop for that amount of time.  Usage:</p><pre><code>
+var task = new Ext.util.DelayedTask(function(){
+    alert(Ext.getDom('myInputField').value.length);
+});
+// Wait 500ms before calling our function. If the user presses another key 
+// during that 500ms, it will be cancelled and we'll wait another 500ms.
+Ext.get('myInputField').on('keypress', function(){
+    task.{@link #delay}(500); 
+});
+ * </code></pre> 
+ * <p>Note that we are using a DelayedTask here to illustrate a point. The configuration
+ * option <tt>buffer</tt> for {@link Ext.util.Observable#addListener addListener/on} will
+ * also setup a delayed task for you to buffer events.</p> 
+ * @constructor The parameters to this constructor serve as defaults and are not required.
+ * @param {Function} fn (optional) The default function to call.
+ * @param {Object} scope The default scope (The <code><b>this</b></code> reference) in which the
+ * function is called. If not specified, <code>this</code> will refer to the browser window.
+ * @param {Array} args (optional) The default Array of arguments.
+ */
+Ext.util.DelayedTask = function(fn, scope, args){
+    var me = this,
+    	id,    	
+    	call = function(){
+    		clearInterval(id);
+	        id = null;
+	        fn.apply(scope, args || []);
+	    };
+	    
+    /**
+     * Cancels any pending timeout and queues a new one
+     * @param {Number} delay The milliseconds to delay
+     * @param {Function} newFn (optional) Overrides function passed to constructor
+     * @param {Object} newScope (optional) Overrides scope passed to constructor. Remember that if no scope
+     * is specified, <code>this</code> will refer to the browser window.
+     * @param {Array} newArgs (optional) Overrides args passed to constructor
+     */
+    me.delay = function(delay, newFn, newScope, newArgs){
+        me.cancel();
+        fn = newFn || fn;
+        scope = newScope || scope;
+        args = newArgs || args;
+        id = setInterval(call, delay);
+    };
+
+    /**
+     * Cancel the last queued timeout
+     */
+    me.cancel = function(){
+        if(id){
+            clearInterval(id);
+            id = null;
+        }
+    };
+};/**
+ * @class Ext.Element
+ * <p>Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.</p>
+ * <p>All instances of this class inherit the methods of {@link Ext.Fx} making visual effects easily available to all DOM elements.</p>
+ * <p>Note that the events documented in this class are not Ext events, they encapsulate browser events. To
+ * access the underlying browser event, see {@link Ext.EventObject#browserEvent}. Some older
+ * browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.</p>
+ * Usage:<br>
+<pre><code>
+// by id
+var el = Ext.get("my-div");
+
+// by DOM element reference
+var el = Ext.get(myDivElement);
+</code></pre>
+ * <b>Animations</b><br />
+ * <p>When an element is manipulated, by default there is no animation.</p>
+ * <pre><code>
+var el = Ext.get("my-div");
+
+// no animation
+el.setWidth(100);
+ * </code></pre>
+ * <p>Many of the functions for manipulating an element have an optional "animate" parameter.  This
+ * parameter can be specified as boolean (<tt>true</tt>) for default animation effects.</p>
+ * <pre><code>
+// default animation
+el.setWidth(100, true);
+ * </code></pre>
+ *
+ * <p>To configure the effects, an object literal with animation options to use as the Element animation
+ * configuration object can also be specified. Note that the supported Element animation configuration
+ * options are a subset of the {@link Ext.Fx} animation options specific to Fx effects.  The supported
+ * Element animation configuration options are:</p>
+<pre>
+Option    Default   Description
+--------- --------  ---------------------------------------------
+{@link Ext.Fx#duration duration}  .35       The duration of the animation in seconds
+{@link Ext.Fx#easing easing}    easeOut   The easing method
+{@link Ext.Fx#callback callback}  none      A function to execute when the anim completes
+{@link Ext.Fx#scope scope}     this      The scope (this) of the callback function
+</pre>
+ *
+ * <pre><code>
+// Element animation options object
+var opt = {
+    {@link Ext.Fx#duration duration}: 1,
+    {@link Ext.Fx#easing easing}: 'elasticIn',
+    {@link Ext.Fx#callback callback}: this.foo,
+    {@link Ext.Fx#scope scope}: this
+};
+// animation with some options set
+el.setWidth(100, opt);
+ * </code></pre>
+ * <p>The Element animation object being used for the animation will be set on the options
+ * object as "anim", which allows you to stop or manipulate the animation. Here is an example:</p>
+ * <pre><code>
+// using the "anim" property to get the Anim object
+if(opt.anim.isAnimated()){
+    opt.anim.stop();
+}
+ * </code></pre>
+ * <p>Also see the <tt>{@link #animate}</tt> method for another animation technique.</p>
+ * <p><b> Composite (Collections of) Elements</b></p>
+ * <p>For working with collections of Elements, see {@link Ext.CompositeElement}</p>
+ * @constructor Create a new Element directly.
+ * @param {String/HTMLElement} element
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
+ */
+(function(){
+var DOC = document;
+
+Ext.Element = function(element, forceNew){
+    var dom = typeof element == "string" ?
+              DOC.getElementById(element) : element,
+        id;
+
+    if(!dom) return null;
+
+    id = dom.id;
+
+    if(!forceNew && id && Ext.elCache[id]){ // element object already exists
+        return Ext.elCache[id].el;
+    }
+
+    /**
+     * The DOM element
+     * @type HTMLElement
+     */
+    this.dom = dom;
+
+    /**
+     * The DOM element ID
+     * @type String
+     */
+    this.id = id || Ext.id(dom);
+};
+
+var DH = Ext.DomHelper,
+    El = Ext.Element,
+    EC = Ext.elCache;
+
+El.prototype = {
+    /**
+     * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
+     * @param {Object} o The object with the attributes
+     * @param {Boolean} useSet (optional) false to override the default setAttribute to use expandos.
+     * @return {Ext.Element} this
+     */
+    set : function(o, useSet){
+        var el = this.dom,
+            attr,
+            val,
+            useSet = (useSet !== false) && !!el.setAttribute;
+
+        for (attr in o) {
+            if (o.hasOwnProperty(attr)) {
+                val = o[attr];
+                if (attr == 'style') {
+                    DH.applyStyles(el, val);
+                } else if (attr == 'cls') {
+                    el.className = val;
+                } else if (useSet) {
+                    el.setAttribute(attr, val);
+                } else {
+                    el[attr] = val;
+                }
+            }
+        }
+        return this;
+    },
+
+//  Mouse events
+    /**
+     * @event click
+     * Fires when a mouse click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event contextmenu
+     * Fires when a right click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event dblclick
+     * Fires when a mouse double click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousedown
+     * Fires when a mousedown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseup
+     * Fires when a mouseup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseover
+     * Fires when a mouseover is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousemove
+     * Fires when a mousemove is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseout
+     * Fires when a mouseout is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseenter
+     * Fires when the mouse enters the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseleave
+     * Fires when the mouse leaves the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Keyboard events
+    /**
+     * @event keypress
+     * Fires when a keypress is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keydown
+     * Fires when a keydown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keyup
+     * Fires when a keyup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+
+//  HTML frame/object events
+    /**
+     * @event load
+     * Fires when the user agent finishes loading all content within the element. Only supported by window, frames, objects and images.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event unload
+     * Fires when the user agent removes all content from a window or frame. For elements, it fires when the target element or any of its content has been removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event abort
+     * Fires when an object/image is stopped from loading before completely loaded.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event error
+     * Fires when an object/image/frame cannot be loaded properly.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event resize
+     * Fires when a document view is resized.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event scroll
+     * Fires when a document view is scrolled.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Form events
+    /**
+     * @event select
+     * Fires when a user selects some text in a text field, including input and textarea.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event change
+     * Fires when a control loses the input focus and its value has been modified since gaining focus.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event submit
+     * Fires when a form is submitted.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event reset
+     * Fires when a form is reset.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event focus
+     * Fires when an element receives focus either via the pointing device or by tab navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event blur
+     * Fires when an element loses focus either via the pointing device or by tabbing navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  User Interface events
+    /**
+     * @event DOMFocusIn
+     * Where supported. Similar to HTML focus event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMFocusOut
+     * Where supported. Similar to HTML blur event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMActivate
+     * Where supported. Fires when an element is activated, for instance, through a mouse click or a keypress.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  DOM Mutation events
+    /**
+     * @event DOMSubtreeModified
+     * Where supported. Fires when the subtree is modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInserted
+     * Where supported. Fires when a node has been added as a child of another node.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemoved
+     * Where supported. Fires when a descendant node of the element is removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemovedFromDocument
+     * Where supported. Fires when a node is being removed from a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInsertedIntoDocument
+     * Where supported. Fires when a node is being inserted into a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMAttrModified
+     * Where supported. Fires when an attribute has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMCharacterDataModified
+     * Where supported. Fires when the character data has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+    /**
+     * The default unit to append to CSS values where a unit isn't provided (defaults to px).
+     * @type String
+     */
+    defaultUnit : "px",
+
+    /**
+     * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)
+     * @param {String} selector The simple selector to test
+     * @return {Boolean} True if this element matches the selector, else false
+     */
+    is : function(simpleSelector){
+        return Ext.DomQuery.is(this.dom, simpleSelector);
+    },
+
+    /**
+     * Tries to focus the element. Any exceptions are caught and ignored.
+     * @param {Number} defer (optional) Milliseconds to defer the focus
+     * @return {Ext.Element} this
+     */
+    focus : function(defer, /* private */ dom) {
+        var me = this,
+            dom = dom || me.dom;
+        try{
+            if(Number(defer)){
+                me.focus.defer(defer, null, [null, dom]);
+            }else{
+                dom.focus();
+            }
+        }catch(e){}
+        return me;
+    },
+
+    /**
+     * Tries to blur the element. Any exceptions are caught and ignored.
+     * @return {Ext.Element} this
+     */
+    blur : function() {
+        try{
+            this.dom.blur();
+        }catch(e){}
+        return this;
+    },
+
+    /**
+     * Returns the value of the "value" attribute
+     * @param {Boolean} asNumber true to parse the value as a number
+     * @return {String/Number}
+     */
+    getValue : function(asNumber){
+        var val = this.dom.value;
+        return asNumber ? parseInt(val, 10) : val;
+    },
+
+    /**
+     * Appends an event handler to this element.  The shorthand version {@link #on} is equivalent.
+     * @param {String} eventName The name of event to handle.
+     * @param {Function} fn The handler function the event invokes. This function is passed
+     * the following parameters:<ul>
+     * <li><b>evt</b> : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+     * <li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.
+     * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+     * <li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b>.
+     * @param {Object} options (optional) An object containing handler configuration properties.
+     * This may contain any of the following properties:<ul>
+     * <li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b></div></li>
+     * <li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>
+     * <li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+     * <li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>
+     * <li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>
+     * <li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+     * <li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+     * <li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * In the following examples, the shorthand form {@link #on} is used rather than the more verbose
+     * addListener.  The two are equivalent.  Using the options argument, it is possible to combine different
+     * types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the
+     * options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">
+     * Code:<pre><code>
+el.on('click', this.onClick, this, {
+    single: true,
+    delay: 100,
+    stopEvent : true,
+    forumId: 4
+});</code></pre></p>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.</p>
+     * <p>
+     * Code:<pre><code>
+el.on({
+    'click' : {
+        fn: this.onClick,
+        scope: this,
+        delay: 100
+    },
+    'mouseover' : {
+        fn: this.onMouseOver,
+        scope: this
+    },
+    'mouseout' : {
+        fn: this.onMouseOut,
+        scope: this
+    }
+});</code></pre>
+     * <p>
+     * Or a shorthand syntax:<br>
+     * Code:<pre><code></p>
+el.on({
+    'click' : this.onClick,
+    'mouseover' : this.onMouseOver,
+    'mouseout' : this.onMouseOut,
+    scope: this
+});
+     * </code></pre></p>
+     * <p><b>delegate</b></p>
+     * <p>This is a configuration option that you can pass along when registering a handler for
+     * an event to assist with event delegation. Event delegation is a technique that is used to
+     * reduce memory consumption and prevent exposure to memory-leaks. By registering an event
+     * for a container element as opposed to each element within a container. By setting this
+     * configuration option to a simple selector, the target element will be filtered to look for
+     * a descendant of the target.
+     * For example:<pre><code>
+// using this markup:
+&lt;div id='elId'>
+    &lt;p id='p1'>paragraph one&lt;/p>
+    &lt;p id='p2' class='clickable'>paragraph two&lt;/p>
+    &lt;p id='p3'>paragraph three&lt;/p>
+&lt;/div>
+// utilize event delegation to registering just one handler on the container element:
+el = Ext.get('elId');
+el.on(
+    'click',
+    function(e,t) {
+        // handle click
+        console.info(t.id); // 'p2'
+    },
+    this,
+    {
+        // filter the target element to be a descendant with the class 'clickable'
+        delegate: '.clickable'
+    }
+);
+     * </code></pre></p>
+     * @return {Ext.Element} this
+     */
+    addListener : function(eventName, fn, scope, options){
+        Ext.EventManager.on(this.dom,  eventName, fn, scope || this, options);
+        return this;
+    },
+
+    /**
+     * Removes an event handler from this element.  The shorthand version {@link #un} is equivalent.
+     * <b>Note</b>: if a <i>scope</i> was explicitly specified when {@link #addListener adding} the
+     * listener, the same scope must be specified here.
+     * Example:
+     * <pre><code>
+el.removeListener('click', this.handlerFn);
+// or
+el.un('click', this.handlerFn);
+</code></pre>
+     * @param {String} eventName The name of the event from which to remove the handler.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @return {Ext.Element} this
+     */
+    removeListener : function(eventName, fn, scope){
+        Ext.EventManager.removeListener(this.dom,  eventName, fn, scope || this);
+        return this;
+    },
+
+    /**
+     * Removes all previous added listeners from this element
+     * @return {Ext.Element} this
+     */
+    removeAllListeners : function(){
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Recursively removes all previous added listeners from this element and its children
+     * @return {Ext.Element} this
+     */
+    purgeAllListeners : function() {
+        Ext.EventManager.purgeElement(this, true);
+        return this;
+    },
+    /**
+     * @private Test if size has a unit, otherwise appends the default
+     */
+    addUnits : function(size){
+        if(size === "" || size == "auto" || size === undefined){
+            size = size || '';
+        } else if(!isNaN(size) || !unitPattern.test(size)){
+            size = size + (this.defaultUnit || 'px');
+        }
+        return size;
+    },
+
+    /**
+     * <p>Updates the <a href="http:
+     * from a specified URL. Note that this is subject to the <a href="http://en.wikipedia.org/wiki/Same_origin_policy">Same Origin Policy</a></p>
+     * <p>Updating innerHTML of an element will <b>not</b> execute embedded <tt>&lt;script></tt> elements. This is a browser restriction.</p>
+     * @param {Mixed} options. Either a sring containing the URL from which to load the HTML, or an {@link Ext.Ajax#request} options object specifying
+     * exactly how to request the HTML.
+     * @return {Ext.Element} this
+     */
+    load : function(url, params, cb){
+        Ext.Ajax.request(Ext.apply({
+            params: params,
+            url: url.url || url,
+            callback: cb,
+            el: this.dom,
+            indicatorText: url.indicatorText || ''
+        }, Ext.isObject(url) ? url : {}));
+        return this;
+    },
+
+    
+    isBorderBox : function(){
+        return Ext.isBorderBox || Ext.isForcedBorderBox || noBoxAdjust[(this.dom.tagName || "").toLowerCase()];
+    },
+
+    
+    remove : function(){
+        var me = this,
+            dom = me.dom;
+
+        if (dom) {
+            delete me.dom;
+            Ext.removeNode(dom);
+        }
+    },
+
+    
+    hover : function(overFn, outFn, scope, options){
+        var me = this;
+        me.on('mouseenter', overFn, scope || me.dom, options);
+        me.on('mouseleave', outFn, scope || me.dom, options);
+        return me;
+    },
+
+    
+    contains : function(el){
+        return !el ? false : Ext.lib.Dom.isAncestor(this.dom, el.dom ? el.dom : el);
+    },
+
+    
+    getAttributeNS : function(ns, name){
+        return this.getAttribute(name, ns);
+    },
+
+    
+    getAttribute: (function(){
+        var test = document.createElement('table'),
+            isBrokenOnTable = false,
+            hasGetAttribute = 'getAttribute' in test,
+            unknownRe = /undefined|unknown/;
+            
+        if (hasGetAttribute) {
+            
+            try {
+                test.getAttribute('ext:qtip');
+            } catch (e) {
+                isBrokenOnTable = true;
+            }
+            
+            return function(name, ns) {
+                var el = this.dom,
+                    value;
+                
+                if (el.getAttributeNS) {
+                    value  = el.getAttributeNS(ns, name) || null;
+                }
+            
+                if (value == null) {
+                    if (ns) {
+                        if (isBrokenOnTable && el.tagName.toUpperCase() == 'TABLE') {
+                            try {
+                                value = el.getAttribute(ns + ':' + name);
+                            } catch (e) {
+                                value = '';
+                            }
+                        } else {
+                            value = el.getAttribute(ns + ':' + name);
+                        }
+                    } else {
+                        value = el.getAttribute(name) || el[name];
+                    }
+                }
+                return value || '';
+            };
+        } else {
+            return function(name, ns) {
+                var el = this.om,
+                    value,
+                    attribute;
+                
+                if (ns) {
+                    attribute = el[ns + ':' + name];
+                    value = unknownRe.test(typeof attribute) ? undefined : attribute;
+                } else {
+                    value = el[name];
+                }
+                return value || '';
+            };
+        }
+        test = null;
+    })(),
+        
+    
+    update : function(html) {
+        if (this.dom) {
+            this.dom.innerHTML = html;
+        }
+        return this;
+    }
+};
+
+var ep = El.prototype;
+
+El.addMethods = function(o){
+   Ext.apply(ep, o);
+};
+
+
+ep.on = ep.addListener;
+
+
+ep.un = ep.removeListener;
+
+
+ep.autoBoxAdjust = true;
+
+
+var unitPattern = /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,
+    docEl;
+
+
+
+
+El.get = function(el){
+    var ex,
+        elm,
+        id;
+    if(!el){ return null; }
+    if (typeof el == "string") { 
+        if (!(elm = DOC.getElementById(el))) {
+            return null;
+        }
+        if (EC[el] && EC[el].el) {
+            ex = EC[el].el;
+            ex.dom = elm;
+        } else {
+            ex = El.addToCache(new El(elm));
+        }
+        return ex;
+    } else if (el.tagName) { 
+        if(!(id = el.id)){
+            id = Ext.id(el);
+        }
+        if (EC[id] && EC[id].el) {
+            ex = EC[id].el;
+            ex.dom = el;
+        } else {
+            ex = El.addToCache(new El(el));
+        }
+        return ex;
+    } else if (el instanceof El) {
+        if(el != docEl){
+            
+            
+
+            
+            if (Ext.isIE && (el.id == undefined || el.id == '')) {
+                el.dom = el.dom;
+            } else {
+                el.dom = DOC.getElementById(el.id) || el.dom;
+            }
+        }
+        return el;
+    } else if(el.isComposite) {
+        return el;
+    } else if(Ext.isArray(el)) {
+        return El.select(el);
+    } else if(el == DOC) {
+        
+        if(!docEl){
+            var f = function(){};
+            f.prototype = El.prototype;
+            docEl = new f();
+            docEl.dom = DOC;
+        }
+        return docEl;
+    }
+    return null;
+};
+
+El.addToCache = function(el, id){
+    id = id || el.id;
+    EC[id] = {
+        el:  el,
+        data: {},
+        events: {}
+    };
+    return el;
+};
+
+
+El.data = function(el, key, value){
+    el = El.get(el);
+    if (!el) {
+        return null;
+    }
+    var c = EC[el.id].data;
+    if(arguments.length == 2){
+        return c[key];
+    }else{
+        return (c[key] = value);
+    }
+};
+
+
+
+
+function garbageCollect(){
+    if(!Ext.enableGarbageCollector){
+        clearInterval(El.collectorThreadId);
+    } else {
+        var eid,
+            el,
+            d,
+            o;
+
+        for(eid in EC){
+            o = EC[eid];
+            if(o.skipGC){
+                continue;
+            }
+            el = o.el;
+            d = el.dom;
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            
+            if(!d || !d.parentNode || (!d.offsetParent && !DOC.getElementById(eid))){
+                if(Ext.enableListenerCollection){
+                    Ext.EventManager.removeAll(d);
+                }
+                delete EC[eid];
+            }
+        }
+        
+        if (Ext.isIE) {
+            var t = {};
+            for (eid in EC) {
+                t[eid] = EC[eid];
+            }
+            EC = Ext.elCache = t;
+        }
+    }
+}
+El.collectorThreadId = setInterval(garbageCollect, 30000);
+
+var flyFn = function(){};
+flyFn.prototype = El.prototype;
+
+
+El.Flyweight = function(dom){
+    this.dom = dom;
+};
+
+El.Flyweight.prototype = new flyFn();
+El.Flyweight.prototype.isFlyweight = true;
+El._flyweights = {};
+
+
+El.fly = function(el, named){
+    var ret = null;
+    named = named || '_global';
+
+    if (el = Ext.getDom(el)) {
+        (El._flyweights[named] = El._flyweights[named] || new El.Flyweight()).dom = el;
+        ret = El._flyweights[named];
+    }
+    return ret;
+};
+
+
+Ext.get = El.get;
+
+
+Ext.fly = El.fly;
+
+
+var noBoxAdjust = Ext.isStrict ? {
+    select:1
+} : {
+    input:1, select:1, textarea:1
+};
+if(Ext.isIE || Ext.isGecko){
+    noBoxAdjust['button'] = 1;
+}
+
+})();
+
+Ext.Element.addMethods(function(){
+	var PARENTNODE = 'parentNode',
+		NEXTSIBLING = 'nextSibling',
+		PREVIOUSSIBLING = 'previousSibling',
+		DQ = Ext.DomQuery,
+		GET = Ext.get;
+	
+	return {
+		
+	    findParent : function(simpleSelector, maxDepth, returnEl){
+	        var p = this.dom,
+	        	b = document.body, 
+	        	depth = 0, 	        	
+	        	stopEl;	        
+            if(Ext.isGecko && Object.prototype.toString.call(p) == '[object XULElement]') {
+                return null;
+            }
+	        maxDepth = maxDepth || 50;
+	        if (isNaN(maxDepth)) {
+	            stopEl = Ext.getDom(maxDepth);
+	            maxDepth = Number.MAX_VALUE;
+	        }
+	        while(p && p.nodeType == 1 && depth < maxDepth && p != b && p != stopEl){
+	            if(DQ.is(p, simpleSelector)){
+	                return returnEl ? GET(p) : p;
+	            }
+	            depth++;
+	            p = p.parentNode;
+	        }
+	        return null;
+	    },
+	
+	    
+	    findParentNode : function(simpleSelector, maxDepth, returnEl){
+	        var p = Ext.fly(this.dom.parentNode, '_internal');
+	        return p ? p.findParent(simpleSelector, maxDepth, returnEl) : null;
+	    },
+	
+	    
+	    up : function(simpleSelector, maxDepth){
+	        return this.findParentNode(simpleSelector, maxDepth, true);
+	    },
+	
+	    
+	    select : function(selector){
+	        return Ext.Element.select(selector, this.dom);
+	    },
+	
+	    
+	    query : function(selector){
+	        return DQ.select(selector, this.dom);
+	    },
+	
+	    
+	    child : function(selector, returnDom){
+	        var n = DQ.selectNode(selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+	    
+	    down : function(selector, returnDom){
+	        var n = DQ.selectNode(" > " + selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+		 
+	    parent : function(selector, returnDom){
+	        return this.matchNode(PARENTNODE, PARENTNODE, selector, returnDom);
+	    },
+	
+	     
+	    next : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, NEXTSIBLING, selector, returnDom);
+	    },
+	
+	    
+	    prev : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, PREVIOUSSIBLING, selector, returnDom);
+	    },
+	
+	
+	    
+	    first : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, 'firstChild', selector, returnDom);
+	    },
+	
+	    
+	    last : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, 'lastChild', selector, returnDom);
+	    },
+	    
+	    matchNode : function(dir, start, selector, returnDom){
+	        var n = this.dom[start];
+	        while(n){
+	            if(n.nodeType == 1 && (!selector || DQ.is(n, selector))){
+	                return !returnDom ? GET(n) : n;
+	            }
+	            n = n[dir];
+	        }
+	        return null;
+	    }	
+    };
+}());
+Ext.Element.addMethods(
+function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {
+	    
+	    appendChild: function(el){        
+	        return GET(el).appendTo(this);        
+	    },
+	
+	    
+	    appendTo: function(el){        
+	        GETDOM(el).appendChild(this.dom);        
+	        return this;
+	    },
+	
+	    
+	    insertBefore: function(el){  	          
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el);
+	        return this;
+	    },
+	
+	    
+	    insertAfter: function(el){
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el.nextSibling);
+	        return this;
+	    },
+	
+	    
+	    insertFirst: function(el, returnDom){
+            el = el || {};
+            if(el.nodeType || el.dom || typeof el == 'string'){ 
+                el = GETDOM(el);
+                this.dom.insertBefore(el, this.dom.firstChild);
+                return !returnDom ? GET(el) : el;
+            }else{ 
+                return this.createChild(el, this.dom.firstChild, returnDom);
+            }
+        },
+	
+	    
+	    replace: function(el){
+	        el = GET(el);
+	        this.insertBefore(el);
+	        el.remove();
+	        return this;
+	    },
+	
+	    
+	    replaceWith: function(el){
+		    var me = this;
+                
+            if(el.nodeType || el.dom || typeof el == 'string'){
+                el = GETDOM(el);
+                me.dom.parentNode.insertBefore(el, me.dom);
+            }else{
+                el = DH.insertBefore(me.dom, el);
+            }
+	        
+	        delete Ext.elCache[me.id];
+	        Ext.removeNode(me.dom);      
+	        me.id = Ext.id(me.dom = el);
+	        Ext.Element.addToCache(me.isFlyweight ? new Ext.Element(me.dom) : me);     
+            return me;
+	    },
+	    
+		
+		createChild: function(config, insertBefore, returnDom){
+		    config = config || {tag:'div'};
+		    return insertBefore ? 
+		    	   DH.insertBefore(insertBefore, config, returnDom !== true) :	
+		    	   DH[!this.dom.firstChild ? 'overwrite' : 'append'](this.dom, config,  returnDom !== true);
+		},
+		
+		
+		wrap: function(config, returnDom){        
+		    var newEl = DH.insertBefore(this.dom, config || {tag: "div"}, !returnDom);
+		    newEl.dom ? newEl.dom.appendChild(this.dom) : newEl.appendChild(this.dom);
+		    return newEl;
+		},
+		
+		
+		insertHtml : function(where, html, returnEl){
+		    var el = DH.insertHtml(where, this.dom, html);
+		    return returnEl ? Ext.get(el) : el;
+		}
+	};
+}());
+Ext.Element.addMethods(function(){
+    
+    var supports = Ext.supports,
+        propCache = {},
+        camelRe = /(-[a-z])/gi,
+        view = document.defaultView,
+        opacityRe = /alpha\(opacity=(.*)\)/i,
+        trimRe = /^\s+|\s+$/g,
+        EL = Ext.Element,
+        spacesRe = /\s+/,
+        wordsRe = /\w/g,
+        PADDING = "padding",
+        MARGIN = "margin",
+        BORDER = "border",
+        LEFT = "-left",
+        RIGHT = "-right",
+        TOP = "-top",
+        BOTTOM = "-bottom",
+        WIDTH = "-width",
+        MATH = Math,
+        HIDDEN = 'hidden',
+        ISCLIPPED = 'isClipped',
+        OVERFLOW = 'overflow',
+        OVERFLOWX = 'overflow-x',
+        OVERFLOWY = 'overflow-y',
+        ORIGINALCLIP = 'originalClip',
+        
+        borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
+        paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
+        margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
+        data = Ext.Element.data;
+
+
+    
+    function camelFn(m, a) {
+        return a.charAt(1).toUpperCase();
+    }
+
+    function chkCache(prop) {
+        return propCache[prop] || (propCache[prop] = prop == 'float' ? (supports.cssFloat ? 'cssFloat' : 'styleFloat') : prop.replace(camelRe, camelFn));
+    }
+
+    return {
+        
+        adjustWidth : function(width) {
+            var me = this;
+            var isNum = (typeof width == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+            }
+            return (isNum && width < 0) ? 0 : width;
+        },
+
+        
+        adjustHeight : function(height) {
+            var me = this;
+            var isNum = (typeof height == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+            }
+            return (isNum && height < 0) ? 0 : height;
+        },
+
+
+        
+        addClass : function(className){
+            var me = this,
+                i,
+                len,
+                v,
+                cls = [];
+            
+            if (!Ext.isArray(className)) {
+                if (typeof className == 'string' && !this.hasClass(className)) {
+                    me.dom.className += " " + className;
+                }
+            }
+            else {
+                for (i = 0, len = className.length; i < len; i++) {
+                    v = className[i];
+                    if (typeof v == 'string' && (' ' + me.dom.className + ' ').indexOf(' ' + v + ' ') == -1) {
+                        cls.push(v);
+                    }
+                }
+                if (cls.length) {
+                    me.dom.className += " " + cls.join(" ");
+                }
+            }
+            return me;
+        },
+
+        
+        removeClass : function(className){
+            var me = this,
+                i,
+                idx,
+                len,
+                cls,
+                elClasses;
+            if (!Ext.isArray(className)){
+                className = [className];
+            }
+            if (me.dom && me.dom.className) {
+                elClasses = me.dom.className.replace(trimRe, '').split(spacesRe);
+                for (i = 0, len = className.length; i < len; i++) {
+                    cls = className[i];
+                    if (typeof cls == 'string') {
+                        cls = cls.replace(trimRe, '');
+                        idx = elClasses.indexOf(cls);
+                        if (idx != -1) {
+                            elClasses.splice(idx, 1);
+                        }
+                    }
+                }
+                me.dom.className = elClasses.join(" ");
+            }
+            return me;
+        },
+
+        
+        radioClass : function(className){
+            var cn = this.dom.parentNode.childNodes,
+                v,
+                i,
+                len;
+            className = Ext.isArray(className) ? className : [className];
+            for (i = 0, len = cn.length; i < len; i++) {
+                v = cn[i];
+                if (v && v.nodeType == 1) {
+                    Ext.fly(v, '_internal').removeClass(className);
+                }
+            };
+            return this.addClass(className);
+        },
+
+        
+        toggleClass : function(className){
+            return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);
+        },
+
+        
+        hasClass : function(className){
+            return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;
+        },
+
+        
+        replaceClass : function(oldClassName, newClassName){
+            return this.removeClass(oldClassName).addClass(newClassName);
+        },
+
+        isStyle : function(style, val) {
+            return this.getStyle(style) == val;
+        },
+
+        
+        getStyle : function(){
+            return view && view.getComputedStyle ?
+                function(prop){
+                    var el = this.dom,
+                        v,
+                        cs,
+                        out,
+                        display;
+
+                    if(el == document){
+                        return null;
+                    }
+                    prop = chkCache(prop);
+                    out = (v = el.style[prop]) ? v :
+                           (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;
+                           
+                    
+                    
+                    if(prop == 'marginRight' && out != '0px' && !supports.correctRightMargin){
+                        display = el.style.display;
+                        el.style.display = 'inline-block';
+                        out = view.getComputedStyle(el, '').marginRight;
+                        el.style.display = display;
+                    }
+                    
+                    if(prop == 'backgroundColor' && out == 'rgba(0, 0, 0, 0)' && !supports.correctTransparentColor){
+                        out = 'transparent';
+                    }
+                    return out;
+                } :
+                function(prop){
+                    var el = this.dom,
+                        m,
+                        cs;
+
+                    if(el == document) return null;
+                    if (prop == 'opacity') {
+                        if (el.style.filter.match) {
+                            if(m = el.style.filter.match(opacityRe)){
+                                var fv = parseFloat(m[1]);
+                                if(!isNaN(fv)){
+                                    return fv ? fv / 100 : 0;
+                                }
+                            }
+                        }
+                        return 1;
+                    }
+                    prop = chkCache(prop);
+                    return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);
+                };
+        }(),
+
+        
+        getColor : function(attr, defaultValue, prefix){
+            var v = this.getStyle(attr),
+                color = (typeof prefix != 'undefined') ? prefix : '#',
+                h;
+
+            if(!v || (/transparent|inherit/.test(v))) {
+                return defaultValue;
+            }
+            if(/^r/.test(v)){
+                Ext.each(v.slice(4, v.length -1).split(','), function(s){
+                    h = parseInt(s, 10);
+                    color += (h < 16 ? '0' : '') + h.toString(16);
+                });
+            }else{
+                v = v.replace('#', '');
+                color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;
+            }
+            return(color.length > 5 ? color.toLowerCase() : defaultValue);
+        },
+
+        
+        setStyle : function(prop, value){
+            var tmp, style;
+            
+            if (typeof prop != 'object') {
+                tmp = {};
+                tmp[prop] = value;
+                prop = tmp;
+            }
+            for (style in prop) {
+                value = prop[style];
+                style == 'opacity' ?
+                    this.setOpacity(value) :
+                    this.dom.style[chkCache(style)] = value;
+            }
+            return this;
+        },
+
+        
+         setOpacity : function(opacity, animate){
+            var me = this,
+                s = me.dom.style;
+
+            if(!animate || !me.anim){
+                if(Ext.isIE){
+                    var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '',
+                    val = s.filter.replace(opacityRe, '').replace(trimRe, '');
+
+                    s.zoom = 1;
+                    s.filter = val + (val.length > 0 ? ' ' : '') + opac;
+                }else{
+                    s.opacity = opacity;
+                }
+            }else{
+                me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');
+            }
+            return me;
+        },
+
+        
+        clearOpacity : function(){
+            var style = this.dom.style;
+            if(Ext.isIE){
+                if(!Ext.isEmpty(style.filter)){
+                    style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');
+                }
+            }else{
+                style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';
+            }
+            return this;
+        },
+
+        
+        getHeight : function(contentHeight){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0;
+
+            h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");
+            return h < 0 ? 0 : h;
+        },
+
+        
+        getWidth : function(contentWidth){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                w = MATH.max(dom.offsetWidth, hidden ? 0 : dom.clientWidth) || 0;
+            w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");
+            return w < 0 ? 0 : w;
+        },
+
+        
+        setWidth : function(width, animate){
+            var me = this;
+            width = me.adjustWidth(width);
+            !animate || !me.anim ?
+                me.dom.style.width = me.addUnits(width) :
+                me.anim({width : {to : width}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        
+         setHeight : function(height, animate){
+            var me = this;
+            height = me.adjustHeight(height);
+            !animate || !me.anim ?
+                me.dom.style.height = me.addUnits(height) :
+                me.anim({height : {to : height}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        
+        getBorderWidth : function(side){
+            return this.addStyles(side, borders);
+        },
+
+        
+        getPadding : function(side){
+            return this.addStyles(side, paddings);
+        },
+
+        
+        clip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(!data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, true);
+                data(dom, ORIGINALCLIP, {
+                    o: me.getStyle(OVERFLOW),
+                    x: me.getStyle(OVERFLOWX),
+                    y: me.getStyle(OVERFLOWY)
+                });
+                me.setStyle(OVERFLOW, HIDDEN);
+                me.setStyle(OVERFLOWX, HIDDEN);
+                me.setStyle(OVERFLOWY, HIDDEN);
+            }
+            return me;
+        },
+
+        
+        unclip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, false);
+                var o = data(dom, ORIGINALCLIP);
+                if(o.o){
+                    me.setStyle(OVERFLOW, o.o);
+                }
+                if(o.x){
+                    me.setStyle(OVERFLOWX, o.x);
+                }
+                if(o.y){
+                    me.setStyle(OVERFLOWY, o.y);
+                }
+            }
+            return me;
+        },
+
+        
+        addStyles : function(sides, styles){
+            var ttlSize = 0,
+                sidesArr = sides.match(wordsRe),
+                side,
+                size,
+                i,
+                len = sidesArr.length;
+            for (i = 0; i < len; i++) {
+                side = sidesArr[i];
+                size = side && parseInt(this.getStyle(styles[side]), 10);
+                if (size) {
+                    ttlSize += MATH.abs(size);
+                }
+            }
+            return ttlSize;
+        },
+
+        margins : margins
+    };
+}()
+);
+
+(function(){
+var D = Ext.lib.Dom,
+        LEFT = "left",
+        RIGHT = "right",
+        TOP = "top",
+        BOTTOM = "bottom",
+        POSITION = "position",
+        STATIC = "static",
+        RELATIVE = "relative",
+        AUTO = "auto",
+        ZINDEX = "z-index";
+
+Ext.Element.addMethods({
+	
+    getX : function(){
+        return D.getX(this.dom);
+    },
+
+    
+    getY : function(){
+        return D.getY(this.dom);
+    },
+
+    
+    getXY : function(){
+        return D.getXY(this.dom);
+    },
+
+    
+    getOffsetsTo : function(el){
+        var o = this.getXY(),
+        	e = Ext.fly(el, '_internal').getXY();
+        return [o[0]-e[0],o[1]-e[1]];
+    },
+
+    
+    setX : function(x, animate){	    
+	    return this.setXY([x, this.getY()], this.animTest(arguments, animate, 1));
+    },
+
+    
+    setY : function(y, animate){	    
+	    return this.setXY([this.getX(), y], this.animTest(arguments, animate, 1));
+    },
+
+    
+    setLeft : function(left){
+        this.setStyle(LEFT, this.addUnits(left));
+        return this;
+    },
+
+    
+    setTop : function(top){
+        this.setStyle(TOP, this.addUnits(top));
+        return this;
+    },
+
+    
+    setRight : function(right){
+        this.setStyle(RIGHT, this.addUnits(right));
+        return this;
+    },
+
+    
+    setBottom : function(bottom){
+        this.setStyle(BOTTOM, this.addUnits(bottom));
+        return this;
+    },
+
+    
+    setXY : function(pos, animate){
+	    var me = this;
+        if(!animate || !me.anim){
+            D.setXY(me.dom, pos);
+        }else{
+            me.anim({points: {to: pos}}, me.preanim(arguments, 1), 'motion');
+        }
+        return me;
+    },
+
+    
+    setLocation : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));
+    },
+
+    
+    moveTo : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));        
+    },    
+    
+    
+    getLeft : function(local){
+	    return !local ? this.getX() : parseInt(this.getStyle(LEFT), 10) || 0;
+    },
+
+    
+    getRight : function(local){
+	    var me = this;
+	    return !local ? me.getX() + me.getWidth() : (me.getLeft(true) + me.getWidth()) || 0;
+    },
+
+    
+    getTop : function(local) {
+	    return !local ? this.getY() : parseInt(this.getStyle(TOP), 10) || 0;
+    },
+
+    
+    getBottom : function(local){
+	    var me = this;
+	    return !local ? me.getY() + me.getHeight() : (me.getTop(true) + me.getHeight()) || 0;
+    },
+
+    
+    position : function(pos, zIndex, x, y){
+	    var me = this;
+	    
+        if(!pos && me.isStyle(POSITION, STATIC)){           
+            me.setStyle(POSITION, RELATIVE);           
+        } else if(pos) {
+            me.setStyle(POSITION, pos);
+        }
+        if(zIndex){
+            me.setStyle(ZINDEX, zIndex);
+        }
+        if(x || y) me.setXY([x || false, y || false]);
+    },
+
+    
+    clearPositioning : function(value){
+        value = value || '';
+        this.setStyle({
+            left : value,
+            right : value,
+            top : value,
+            bottom : value,
+            "z-index" : "",
+            position : STATIC
+        });
+        return this;
+    },
+
+    
+    getPositioning : function(){
+        var l = this.getStyle(LEFT);
+        var t = this.getStyle(TOP);
+        return {
+            "position" : this.getStyle(POSITION),
+            "left" : l,
+            "right" : l ? "" : this.getStyle(RIGHT),
+            "top" : t,
+            "bottom" : t ? "" : this.getStyle(BOTTOM),
+            "z-index" : this.getStyle(ZINDEX)
+        };
+    },
+    
+    
+    setPositioning : function(pc){
+	    var me = this,
+	    	style = me.dom.style;
+	    	
+        me.setStyle(pc);
+        
+        if(pc.right == AUTO){
+            style.right = "";
+        }
+        if(pc.bottom == AUTO){
+            style.bottom = "";
+        }
+        
+        return me;
+    },    
+	
+    
+    translatePoints : function(x, y){        	     
+	    y = isNaN(x[1]) ? y : x[1];
+        x = isNaN(x[0]) ? x : x[0];
+        var me = this,
+        	relative = me.isStyle(POSITION, RELATIVE),
+        	o = me.getXY(),
+        	l = parseInt(me.getStyle(LEFT), 10),
+        	t = parseInt(me.getStyle(TOP), 10);
+        
+        l = !isNaN(l) ? l : (relative ? 0 : me.dom.offsetLeft);
+        t = !isNaN(t) ? t : (relative ? 0 : me.dom.offsetTop);        
+
+        return {left: (x - o[0] + l), top: (y - o[1] + t)}; 
+    },
+    
+    animTest : function(args, animate, i) {
+        return !!animate && this.preanim ? this.preanim(args, i) : false;
+    }
+});
+})();
+Ext.Element.addMethods({
+    
+    isScrollable : function(){
+        var dom = this.dom;
+        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
+    },
+
+    
+    scrollTo : function(side, value){
+        this.dom["scroll" + (/top/i.test(side) ? "Top" : "Left")] = value;
+        return this;
+    },
+
+    
+    getScroll : function(){
+        var d = this.dom, 
+            doc = document,
+            body = doc.body,
+            docElement = doc.documentElement,
+            l,
+            t,
+            ret;
+
+        if(d == doc || d == body){
+            if(Ext.isIE && Ext.isStrict){
+                l = docElement.scrollLeft; 
+                t = docElement.scrollTop;
+            }else{
+                l = window.pageXOffset;
+                t = window.pageYOffset;
+            }
+            ret = {left: l || (body ? body.scrollLeft : 0), top: t || (body ? body.scrollTop : 0)};
+        }else{
+            ret = {left: d.scrollLeft, top: d.scrollTop};
+        }
+        return ret;
+    }
+});
+
+Ext.Element.VISIBILITY = 1;
+
+Ext.Element.DISPLAY = 2;
+
+
+Ext.Element.OFFSETS = 3;
+
+
+Ext.Element.ASCLASS = 4;
+
+
+Ext.Element.visibilityCls = 'x-hide-nosize';
+
+Ext.Element.addMethods(function(){
+    var El = Ext.Element,
+        OPACITY = "opacity",
+        VISIBILITY = "visibility",
+        DISPLAY = "display",
+        HIDDEN = "hidden",
+        OFFSETS = "offsets",
+        ASCLASS = "asclass",
+        NONE = "none",
+        NOSIZE = 'nosize',
+        ORIGINALDISPLAY = 'originalDisplay',
+        VISMODE = 'visibilityMode',
+        ISVISIBLE = 'isVisible',
+        data = El.data,
+        getDisplay = function(dom){
+            var d = data(dom, ORIGINALDISPLAY);
+            if(d === undefined){
+                data(dom, ORIGINALDISPLAY, d = '');
+            }
+            return d;
+        },
+        getVisMode = function(dom){
+            var m = data(dom, VISMODE);
+            if(m === undefined){
+                data(dom, VISMODE, m = 1);
+            }
+            return m;
+        };
+
+    return {
+        
+        originalDisplay : "",
+        visibilityMode : 1,
+
+        
+        setVisibilityMode : function(visMode){
+            data(this.dom, VISMODE, visMode);
+            return this;
+        },
+
+        
+        animate : function(args, duration, onComplete, easing, animType){
+            this.anim(args, {duration: duration, callback: onComplete, easing: easing}, animType);
+            return this;
+        },
+
+        
+        anim : function(args, opt, animType, defaultDur, defaultEase, cb){
+            animType = animType || 'run';
+            opt = opt || {};
+            var me = this,
+                anim = Ext.lib.Anim[animType](
+                    me.dom,
+                    args,
+                    (opt.duration || defaultDur) || .35,
+                    (opt.easing || defaultEase) || 'easeOut',
+                    function(){
+                        if(cb) cb.call(me);
+                        if(opt.callback) opt.callback.call(opt.scope || me, me, opt);
+                    },
+                    me
+                );
+            opt.anim = anim;
+            return anim;
+        },
+
+        
+        preanim : function(a, i){
+            return !a[i] ? false : (typeof a[i] == 'object' ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]});
+        },
+
+        
+        isVisible : function() {
+            var me = this,
+                dom = me.dom,
+                visible = data(dom, ISVISIBLE);
+
+            if(typeof visible == 'boolean'){ 
+                return visible;
+            }
+            
+            visible = !me.isStyle(VISIBILITY, HIDDEN) &&
+                      !me.isStyle(DISPLAY, NONE) &&
+                      !((getVisMode(dom) == El.ASCLASS) && me.hasClass(me.visibilityCls || El.visibilityCls));
+
+            data(dom, ISVISIBLE, visible);
+            return visible;
+        },
+
+        
+        setVisible : function(visible, animate){
+            var me = this, isDisplay, isVisibility, isOffsets, isNosize,
+                dom = me.dom,
+                visMode = getVisMode(dom);
+
+
+            
+            if (typeof animate == 'string'){
+                switch (animate) {
+                    case DISPLAY:
+                        visMode = El.DISPLAY;
+                        break;
+                    case VISIBILITY:
+                        visMode = El.VISIBILITY;
+                        break;
+                    case OFFSETS:
+                        visMode = El.OFFSETS;
+                        break;
+                    case NOSIZE:
+                    case ASCLASS:
+                        visMode = El.ASCLASS;
+                        break;
+                }
+                me.setVisibilityMode(visMode);
+                animate = false;
+            }
+
+            if (!animate || !me.anim) {
+                if(visMode == El.ASCLASS ){
+
+                    me[visible?'removeClass':'addClass'](me.visibilityCls || El.visibilityCls);
+
+                } else if (visMode == El.DISPLAY){
+
+                    return me.setDisplayed(visible);
+
+                } else if (visMode == El.OFFSETS){
+
+                    if (!visible){
+                        me.hideModeStyles = {
+                            position: me.getStyle('position'),
+                            top: me.getStyle('top'),
+                            left: me.getStyle('left')
+                        };
+                        me.applyStyles({position: 'absolute', top: '-10000px', left: '-10000px'});
+                    } else {
+                        me.applyStyles(me.hideModeStyles || {position: '', top: '', left: ''});
+                        delete me.hideModeStyles;
+                    }
+
+                }else{
+                    me.fixDisplay();
+                    dom.style.visibility = visible ? "visible" : HIDDEN;
+                }
+            }else{
+                
+                if(visible){
+                    me.setOpacity(.01);
+                    me.setVisible(true);
+                }
+                me.anim({opacity: { to: (visible?1:0) }},
+                        me.preanim(arguments, 1),
+                        null,
+                        .35,
+                        'easeIn',
+                        function(){
+                            visible || me.setVisible(false).setOpacity(1);
+                        });
+            }
+            data(dom, ISVISIBLE, visible);  
+            return me;
+        },
+
+
+        
+        hasMetrics  : function(){
+            var dom = this.dom;
+            return this.isVisible() || (getVisMode(dom) == El.VISIBILITY);
+        },
+
+        
+        toggle : function(animate){
+            var me = this;
+            me.setVisible(!me.isVisible(), me.preanim(arguments, 0));
+            return me;
+        },
+
+        
+        setDisplayed : function(value) {
+            if(typeof value == "boolean"){
+               value = value ? getDisplay(this.dom) : NONE;
+            }
+            this.setStyle(DISPLAY, value);
+            return this;
+        },
+
+        
+        fixDisplay : function(){
+            var me = this;
+            if(me.isStyle(DISPLAY, NONE)){
+                me.setStyle(VISIBILITY, HIDDEN);
+                me.setStyle(DISPLAY, getDisplay(this.dom)); 
+                if(me.isStyle(DISPLAY, NONE)){ 
+                    me.setStyle(DISPLAY, "block");
+                }
+            }
+        },
+
+        
+        hide : function(animate){
+            
+            if (typeof animate == 'string'){
+                this.setVisible(false, animate);
+                return this;
+            }
+            this.setVisible(false, this.preanim(arguments, 0));
+            return this;
+        },
+
+        
+        show : function(animate){
+            
+            if (typeof animate == 'string'){
+                this.setVisible(true, animate);
+                return this;
+            }
+            this.setVisible(true, this.preanim(arguments, 0));
+            return this;
+        }
+    };
+}());(function(){
+    
+    var NULL = null,
+        UNDEFINED = undefined,
+        TRUE = true,
+        FALSE = false,
+        SETX = "setX",
+        SETY = "setY",
+        SETXY = "setXY",
+        LEFT = "left",
+        BOTTOM = "bottom",
+        TOP = "top",
+        RIGHT = "right",
+        HEIGHT = "height",
+        WIDTH = "width",
+        POINTS = "points",
+        HIDDEN = "hidden",
+        ABSOLUTE = "absolute",
+        VISIBLE = "visible",
+        MOTION = "motion",
+        POSITION = "position",
+        EASEOUT = "easeOut",
+        
+        flyEl = new Ext.Element.Flyweight(),
+        queues = {},
+        getObject = function(o){
+            return o || {};
+        },
+        fly = function(dom){
+            flyEl.dom = dom;
+            flyEl.id = Ext.id(dom);
+            return flyEl;
+        },
+        
+        getQueue = function(id){
+            if(!queues[id]){
+                queues[id] = [];
+            }
+            return queues[id];
+        },
+        setQueue = function(id, value){
+            queues[id] = value;
+        };
+        
+
+Ext.enableFx = TRUE;
+
+
+Ext.Fx = {
+    
+    
+    
+    switchStatements : function(key, fn, argHash){
+        return fn.apply(this, argHash[key]);
+    },
+    
+    
+    slideIn : function(anchor, o){ 
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy,
+            r,
+            b,              
+            wrap,               
+            after,
+            st,
+            args, 
+            pt,
+            bw,
+            bh;
+            
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){            
+            xy = fly(dom).getXY();
+            
+            fly(dom).fixDisplay();            
+            
+            
+            r = fly(dom).getFxRestore();      
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+            
+            
+            fly(dom).setWidth(b.width).setHeight(b.height);            
+            
+            
+            wrap = fly(dom).fxWrap(r.pos, o, HIDDEN);
+            
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            
+            
+            function after(){
+                 fly(dom).fxUnwrap(wrap, r.pos, o);
+                 st.width = r.width;
+                 st.height = r.height;
+                 fly(dom).afterFx(o);
+            }
+            
+            
+            pt = {to: [b.x, b.y]}; 
+            bw = {to: b.width};
+            bh = {to: b.height};
+                
+            function argCalc(wrap, style, ww, wh, sXY, sXYval, s1, s2, w, h, p){                    
+                var ret = {};
+                fly(wrap).setWidth(ww).setHeight(wh);
+                if(fly(wrap)[sXY]){
+                    fly(wrap)[sXY](sXYval);                  
+                }
+                style[s1] = style[s2] = "0";                    
+                if(w){
+                    ret.width = w;
+                }
+                if(h){
+                    ret.height = h;
+                }
+                if(p){
+                    ret.points = p;
+                }
+                return ret;
+            };
+
+            args = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                    t  : [wrap, st, b.width, 0, NULL, NULL, LEFT, BOTTOM, NULL, bh, NULL],
+                    l  : [wrap, st, 0, b.height, NULL, NULL, RIGHT, TOP, bw, NULL, NULL],
+                    r  : [wrap, st, b.width, b.height, SETX, b.right, LEFT, TOP, NULL, NULL, pt],
+                    b  : [wrap, st, b.width, b.height, SETY, b.bottom, LEFT, TOP, NULL, bh, pt],
+                    tl : [wrap, st, 0, 0, NULL, NULL, RIGHT, BOTTOM, bw, bh, pt],
+                    bl : [wrap, st, 0, 0, SETY, b.y + b.height, RIGHT, TOP, bw, bh, pt],
+                    br : [wrap, st, 0, 0, SETXY, [b.right, b.bottom], LEFT, TOP, bw, bh, pt],
+                    tr : [wrap, st, 0, 0, SETX, b.x + b.width, LEFT, BOTTOM, bw, bh, pt]
+                });
+            
+            st.visibility = VISIBLE;
+            fly(wrap).show();
+
+            arguments.callee.anim = fly(wrap).fxanim(args,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+    
+    
+    slideOut : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy = me.getXY(),
+            wrap,
+            r,
+            b,
+            a,
+            zero = {to: 0}; 
+                    
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){
+            
+            
+            r = fly(dom).getFxRestore(); 
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+                
+            
+            fly(dom).setWidth(b.width).setHeight(b.height);
+
+            
+            wrap = fly(dom).fxWrap(r.pos, o, VISIBLE);
+                
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            fly(wrap).setWidth(b.width).setHeight(b.height);            
+
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                
+                fly(dom).fxUnwrap(wrap, r.pos, o);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }            
+            
+            function argCalc(style, s1, s2, p1, v1, p2, v2, p3, v3){                    
+                var ret = {};
+                
+                style[s1] = style[s2] = "0";
+                ret[p1] = v1;               
+                if(p2){
+                    ret[p2] = v2;               
+                }
+                if(p3){
+                    ret[p3] = v3;
+                }
+                
+                return ret;
+            };
+            
+            a = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                t  : [st, LEFT, BOTTOM, HEIGHT, zero],
+                l  : [st, RIGHT, TOP, WIDTH, zero],
+                r  : [st, LEFT, TOP, WIDTH, zero, POINTS, {to : [b.right, b.y]}],
+                b  : [st, LEFT, TOP, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                tl : [st, RIGHT, BOTTOM, WIDTH, zero, HEIGHT, zero],
+                bl : [st, RIGHT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                br : [st, LEFT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x + b.width, b.bottom]}],
+                tr : [st, LEFT, BOTTOM, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.right, b.y]}]
+            });
+            
+            arguments.callee.anim = fly(wrap).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+
+    
+    puff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            width,
+            height,
+            r;
+
+        me.queueFx(o, function(){
+            width = fly(dom).getWidth();
+            height = fly(dom).getHeight();
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            
+            r = fly(dom).getFxRestore();                   
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                  
+                fly(dom).clearOpacity();  
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                st.fontSize = '';
+                fly(dom).afterFx(o);
+            }   
+
+            arguments.callee.anim = fly(dom).fxanim({
+                    width : {to : fly(dom).adjustWidth(width * 2)},
+                    height : {to : fly(dom).adjustHeight(height * 2)},
+                    points : {by : [-width * .5, -height * .5]},
+                    opacity : {to : 0},
+                    fontSize: {to : 200, unit: "%"}
+                },
+                o,
+                MOTION,
+                .5,
+                EASEOUT,
+                 after);
+        });
+        return me;
+    },
+
+    
+    switchOff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            r;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).clip();
+
+            
+            r = fly(dom).getFxRestore();
+                
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();  
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;   
+                fly(dom).afterFx(o);
+            };
+
+            fly(dom).fxanim({opacity : {to : 0.3}}, 
+                NULL, 
+                NULL, 
+                .1, 
+                NULL, 
+                function(){                                 
+                    fly(dom).clearOpacity();
+                        (function(){                            
+                            fly(dom).fxanim({
+                                height : {to : 1},
+                                points : {by : [0, fly(dom).getHeight() * .5]}
+                            }, 
+                            o, 
+                            MOTION, 
+                            0.3, 
+                            'easeIn', 
+                            after);
+                        }).defer(100);
+                });
+        });
+        return me;
+    },
+
+     
+    highlight : function(color, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            attr = o.attr || "backgroundColor",
+            a = {},
+            restore;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            function after(){
+                dom.style[attr] = restore;
+                fly(dom).afterFx(o);
+            }            
+            restore = dom.style[attr];
+            a[attr] = {from: color || "ffff9c", to: o.endColor || fly(dom).getColor(attr) || "ffffff"};
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                'color',
+                1,
+                'easeIn', 
+                after);
+        });
+        return me;
+    },
+
+   
+    frame : function(color, count, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            proxy,
+            active;
+
+        me.queueFx(o, function(){
+            color = color || '#C3DAF9';
+            if(color.length == 6){
+                color = '#' + color;
+            }            
+            count = count || 1;
+            fly(dom).show();
+
+            var xy = fly(dom).getXY(),
+                b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight},
+                queue = function(){
+                    proxy = fly(document.body || document.documentElement).createChild({
+                        style:{
+                            position : ABSOLUTE,
+                            'z-index': 35000, 
+                            border : '0px solid ' + color
+                        }
+                    });
+                    return proxy.queueFx({}, animFn);
+                };
+            
+            
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function() {
+                    count = 0;
+                    proxy.stopFx();
+                }
+            };
+            
+            function animFn(){
+                var scale = Ext.isBorderBox ? 2 : 1;
+                active = proxy.anim({
+                    top : {from : b.y, to : b.y - 20},
+                    left : {from : b.x, to : b.x - 20},
+                    borderWidth : {from : 0, to : 10},
+                    opacity : {from : 1, to : 0},
+                    height : {from : b.height, to : b.height + 20 * scale},
+                    width : {from : b.width, to : b.width + 20 * scale}
+                },{
+                    duration: o.duration || 1,
+                    callback: function() {
+                        proxy.remove();
+                        --count > 0 ? queue() : fly(dom).afterFx(o);
+                    }
+                });
+                arguments.callee.anim = {
+                    isAnimated: true,
+                    stop: function(){
+                        active.stop();
+                    }
+                };
+            };
+            queue();
+        });
+        return me;
+    },
+
+   
+    pause : function(seconds){        
+        var dom = this.dom,
+            t;
+
+        this.queueFx({}, function(){
+            t = setTimeout(function(){
+                fly(dom).afterFx({});
+            }, seconds * 1000);
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function(){
+                    clearTimeout(t);
+                    fly(dom).afterFx({});
+                }
+            };
+        });
+        return this;
+    },
+
+   
+    fadeIn : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            to = o.endOpacity || 1;
+        
+        me.queueFx(o, function(){
+            fly(dom).setOpacity(0);
+            fly(dom).fixDisplay();
+            dom.style.visibility = VISIBLE;
+            arguments.callee.anim = fly(dom).fxanim({opacity:{to:to}},
+                o, NULL, .5, EASEOUT, function(){
+                if(to == 1){
+                    fly(dom).clearOpacity();
+                }
+                fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   
+    fadeOut : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            style = dom.style,
+            to = o.endOpacity || 0;         
+        
+        me.queueFx(o, function(){  
+            arguments.callee.anim = fly(dom).fxanim({ 
+                opacity : {to : to}},
+                o, 
+                NULL, 
+                .5, 
+                EASEOUT, 
+                function(){
+                    if(to == 0){
+                        Ext.Element.data(dom, 'visibilityMode') == Ext.Element.DISPLAY || o.useDisplay ? 
+                            style.display = "none" :
+                            style.visibility = HIDDEN;
+                            
+                        fly(dom).clearOpacity();
+                    }
+                    fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   
+    scale : function(w, h, o){
+        this.shift(Ext.apply({}, o, {
+            width: w,
+            height: h
+        }));
+        return this;
+    },
+
+   
+    shift : function(o){
+        o = getObject(o);
+        var dom = this.dom,
+            a = {};
+                
+        this.queueFx(o, function(){
+            for (var prop in o) {
+                if (o[prop] != UNDEFINED) {                                                 
+                    a[prop] = {to : o[prop]};                   
+                }
+            } 
+            
+            a.width ? a.width.to = fly(dom).adjustWidth(o.width) : a;
+            a.height ? a.height.to = fly(dom).adjustWidth(o.height) : a;   
+            
+            if (a.x || a.y || a.xy) {
+                a.points = a.xy || 
+                           {to : [ a.x ? a.x.to : fly(dom).getX(),
+                                   a.y ? a.y.to : fly(dom).getY()]};                  
+            }
+
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o, 
+                MOTION, 
+                .35, 
+                EASEOUT, 
+                function(){
+                    fly(dom).afterFx(o);
+                });
+        });
+        return this;
+    },
+
+    
+    ghost : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            a = {opacity: {to: 0}, points: {}},
+            pt = a.points,
+            r,
+            w,
+            h;
+            
+        anchor = anchor || "b";
+
+        me.queueFx(o, function(){
+            
+            r = fly(dom).getFxRestore();
+            w = fly(dom).getWidth();
+            h = fly(dom).getHeight();
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();   
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }
+                
+            pt.by = fly(dom).switchStatements(anchor.toLowerCase(), function(v1,v2){ return [v1, v2];}, {
+               t  : [0, -h],
+               l  : [-w, 0],
+               r  : [w, 0],
+               b  : [0, h],
+               tl : [-w, -h],
+               bl : [-w, h],
+               br : [w, h],
+               tr : [w, -h] 
+            });
+                
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, after);
+        });
+        return me;
+    },
+
+    
+    syncFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : TRUE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    
+    sequenceFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : FALSE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    
+    nextFx : function(){        
+        var ef = getQueue(this.dom.id)[0];
+        if(ef){
+            ef.call(this);
+        }
+    },
+
+    
+    hasActiveFx : function(){
+        return getQueue(this.dom.id)[0];
+    },
+
+    
+    stopFx : function(finish){
+        var me = this,
+            id = me.dom.id;
+        if(me.hasActiveFx()){
+            var cur = getQueue(id)[0];
+            if(cur && cur.anim){
+                if(cur.anim.isAnimated){
+                    setQueue(id, [cur]); 
+                    cur.anim.stop(finish !== undefined ? finish : TRUE);
+                }else{
+                    setQueue(id, []);
+                }
+            }
+        }
+        return me;
+    },
+
+    
+    beforeFx : function(o){
+        if(this.hasActiveFx() && !o.concurrent){
+           if(o.stopFx){
+               this.stopFx();
+               return TRUE;
+           }
+           return FALSE;
+        }
+        return TRUE;
+    },
+
+    
+    hasFxBlock : function(){
+        var q = getQueue(this.dom.id);
+        return q && q[0] && q[0].block;
+    },
+
+    
+    queueFx : function(o, fn){
+        var me = fly(this.dom);
+        if(!me.hasFxBlock()){
+            Ext.applyIf(o, me.fxDefaults);
+            if(!o.concurrent){
+                var run = me.beforeFx(o);
+                fn.block = o.block;
+                getQueue(me.dom.id).push(fn);
+                if(run){
+                    me.nextFx();
+                }
+            }else{
+                fn.call(me);
+            }
+        }
+        return me;
+    },
+
+    
+    fxWrap : function(pos, o, vis){ 
+        var dom = this.dom,
+            wrap,
+            wrapXY;
+        if(!o.wrap || !(wrap = Ext.getDom(o.wrap))){            
+            if(o.fixPosition){
+                wrapXY = fly(dom).getXY();
+            }
+            var div = document.createElement("div");
+            div.style.visibility = vis;
+            wrap = dom.parentNode.insertBefore(div, dom);
+            fly(wrap).setPositioning(pos);
+            if(fly(wrap).isStyle(POSITION, "static")){
+                fly(wrap).position("relative");
+            }
+            fly(dom).clearPositioning('auto');
+            fly(wrap).clip();
+            wrap.appendChild(dom);
+            if(wrapXY){
+                fly(wrap).setXY(wrapXY);
+            }
+        }
+        return wrap;
+    },
+
+    
+    fxUnwrap : function(wrap, pos, o){      
+        var dom = this.dom;
+        fly(dom).clearPositioning();
+        fly(dom).setPositioning(pos);
+        if(!o.wrap){
+            var pn = fly(wrap).dom.parentNode;
+            pn.insertBefore(dom, wrap); 
+            fly(wrap).remove();
+        }
+    },
+
+    
+    getFxRestore : function(){
+        var st = this.dom.style;
+        return {pos: this.getPositioning(), width: st.width, height : st.height};
+    },
+
+    
+    afterFx : function(o){
+        var dom = this.dom,
+            id = dom.id;
+        if(o.afterStyle){
+            fly(dom).setStyle(o.afterStyle);            
+        }
+        if(o.afterCls){
+            fly(dom).addClass(o.afterCls);
+        }
+        if(o.remove == TRUE){
+            fly(dom).remove();
+        }
+        if(o.callback){
+            o.callback.call(o.scope, fly(dom));
+        }
+        if(!o.concurrent){
+            getQueue(id).shift();
+            fly(dom).nextFx();
+        }
+    },
+
+    
+    fxanim : function(args, opt, animType, defaultDur, defaultEase, cb){
+        animType = animType || 'run';
+        opt = opt || {};
+        var anim = Ext.lib.Anim[animType](
+                this.dom, 
+                args,
+                (opt.duration || defaultDur) || .35,
+                (opt.easing || defaultEase) || EASEOUT,
+                cb,            
+                this
+            );
+        opt.anim = anim;
+        return anim;
+    }
+};
+
+
+Ext.Fx.resize = Ext.Fx.scale;
+
+
+
+Ext.Element.addMethods(Ext.Fx);
+})();
+
+Ext.CompositeElementLite = function(els, root){
+    
+    this.elements = [];
+    this.add(els, root);
+    this.el = new Ext.Element.Flyweight();
+};
+
+Ext.CompositeElementLite.prototype = {
+    isComposite: true,
+
+    
+    getElement : function(el){
+        
+        var e = this.el;
+        e.dom = el;
+        e.id = el.id;
+        return e;
+    },
+
+    
+    transformElement : function(el){
+        return Ext.getDom(el);
+    },
+
+    
+    getCount : function(){
+        return this.elements.length;
+    },
+    
+    add : function(els, root){
+        var me = this,
+            elements = me.elements;
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }else if(els.isComposite){
+            els = els.elements;
+        }else if(!Ext.isIterable(els)){
+            els = [els];
+        }
+
+        for(var i = 0, len = els.length; i < len; ++i){
+            elements.push(me.transformElement(els[i]));
+        }
+        return me;
+    },
+
+    invoke : function(fn, args){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            e,
+            i;
+
+        for(i = 0; i < len; i++) {
+            e = els[i];
+            if(e){
+                Ext.Element.prototype[fn].apply(me.getElement(e), args);
+            }
+        }
+        return me;
+    },
+    
+    item : function(index){
+        var me = this,
+            el = me.elements[index],
+            out = null;
+
+        if(el){
+            out = me.getElement(el);
+        }
+        return out;
+    },
+
+    
+    addListener : function(eventName, handler, scope, opt){
+        var els = this.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e) {
+                Ext.EventManager.on(e, eventName, handler, scope || e, opt);
+            }
+        }
+        return this;
+    },
+    
+    each : function(fn, scope){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e){
+                e = this.getElement(e);
+                if(fn.call(scope || e, e, me, i) === false){
+                    break;
+                }
+            }
+        }
+        return me;
+    },
+
+    
+    fill : function(els){
+        var me = this;
+        me.elements = [];
+        me.add(els);
+        return me;
+    },
+
+    
+    filter : function(selector){
+        var els = [],
+            me = this,
+            fn = Ext.isFunction(selector) ? selector
+                : function(el){
+                    return el.is(selector);
+                };
+
+        me.each(function(el, self, i) {
+            if (fn(el, i) !== false) {
+                els[els.length] = me.transformElement(el);
+            }
+        });
+        
+        me.elements = els;
+        return me;
+    },
+
+    
+    indexOf : function(el){
+        return this.elements.indexOf(this.transformElement(el));
+    },
+
+    
+    replaceElement : function(el, replacement, domReplace){
+        var index = !isNaN(el) ? el : this.indexOf(el),
+            d;
+        if(index > -1){
+            replacement = Ext.getDom(replacement);
+            if(domReplace){
+                d = this.elements[index];
+                d.parentNode.insertBefore(replacement, d);
+                Ext.removeNode(d);
+            }
+            this.elements.splice(index, 1, replacement);
+        }
+        return this;
+    },
+
+    
+    clear : function(){
+        this.elements = [];
+    }
+};
+
+Ext.CompositeElementLite.prototype.on = Ext.CompositeElementLite.prototype.addListener;
+
+
+Ext.CompositeElementLite.importElementMethods = function() {
+    var fnName,
+        ElProto = Ext.Element.prototype,
+        CelProto = Ext.CompositeElementLite.prototype;
+
+    for (fnName in ElProto) {
+        if (typeof ElProto[fnName] == 'function'){
+            (function(fnName) {
+                CelProto[fnName] = CelProto[fnName] || function() {
+                    return this.invoke(fnName, arguments);
+                };
+            }).call(CelProto, fnName);
+
+        }
+    }
+};
+
+Ext.CompositeElementLite.importElementMethods();
+
+if(Ext.DomQuery){
+    Ext.Element.selectorFunction = Ext.DomQuery.select;
+}
+
+
+Ext.Element.select = function(selector, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+    return new Ext.CompositeElementLite(els);
+};
+
+Ext.select = Ext.Element.select;
+(function(){
+    var BEFOREREQUEST = "beforerequest",
+        REQUESTCOMPLETE = "requestcomplete",
+        REQUESTEXCEPTION = "requestexception",
+        UNDEFINED = undefined,
+        LOAD = 'load',
+        POST = 'POST',
+        GET = 'GET',
+        WINDOW = window;
+
+    
+    Ext.data.Connection = function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            
+            BEFOREREQUEST,
+            
+            REQUESTCOMPLETE,
+            
+            REQUESTEXCEPTION
+        );
+        Ext.data.Connection.superclass.constructor.call(this);
+    };
+
+    Ext.extend(Ext.data.Connection, Ext.util.Observable, {
+        
+        
+        
+        
+        
+        timeout : 30000,
+        
+        autoAbort:false,
+
+        
+        disableCaching: true,
+
+        
+        disableCachingParam: '_dc',
+
+        
+        request : function(o){
+            var me = this;
+            if(me.fireEvent(BEFOREREQUEST, me, o)){
+                if (o.el) {
+                    if(!Ext.isEmpty(o.indicatorText)){
+                        me.indicatorText = '<div class="loading-indicator">'+o.indicatorText+"</div>";
+                    }
+                    if(me.indicatorText) {
+                        Ext.getDom(o.el).innerHTML = me.indicatorText;
+                    }
+                    o.success = (Ext.isFunction(o.success) ? o.success : function(){}).createInterceptor(function(response) {
+                        Ext.getDom(o.el).innerHTML = response.responseText;
+                    });
+                }
+
+                var p = o.params,
+                    url = o.url || me.url,
+                    method,
+                    cb = {success: me.handleResponse,
+                          failure: me.handleFailure,
+                          scope: me,
+                          argument: {options: o},
+                          timeout : Ext.num(o.timeout, me.timeout)
+                    },
+                    form,
+                    serForm;
+
+
+                if (Ext.isFunction(p)) {
+                    p = p.call(o.scope||WINDOW, o);
+                }
+
+                p = Ext.urlEncode(me.extraParams, Ext.isObject(p) ? Ext.urlEncode(p) : p);
+
+                if (Ext.isFunction(url)) {
+                    url = url.call(o.scope || WINDOW, o);
+                }
+
+                if((form = Ext.getDom(o.form))){
+                    url = url || form.action;
+                     if(o.isUpload || (/multipart\/form-data/i.test(form.getAttribute("enctype")))) {
+                         return me.doFormUpload.call(me, o, p, url);
+                     }
+                    serForm = Ext.lib.Ajax.serializeForm(form);
+                    p = p ? (p + '&' + serForm) : serForm;
+                }
+
+                method = o.method || me.method || ((p || o.xmlData || o.jsonData) ? POST : GET);
+
+                if(method === GET && (me.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
+                    var dcp = o.disableCachingParam || me.disableCachingParam;
+                    url = Ext.urlAppend(url, dcp + '=' + (new Date().getTime()));
+                }
+
+                o.headers = Ext.applyIf(o.headers || {}, me.defaultHeaders || {});
+
+                if(o.autoAbort === true || me.autoAbort) {
+                    me.abort();
+                }
+
+                if((method == GET || o.xmlData || o.jsonData) && p){
+                    url = Ext.urlAppend(url, p);
+                    p = '';
+                }
+                return (me.transId = Ext.lib.Ajax.request(method, url, cb, p, o));
+            }else{
+                return o.callback ? o.callback.apply(o.scope, [o,UNDEFINED,UNDEFINED]) : null;
+            }
+        },
+
+        
+        isLoading : function(transId){
+            return transId ? Ext.lib.Ajax.isCallInProgress(transId) : !! this.transId;
+        },
+
+        
+        abort : function(transId){
+            if(transId || this.isLoading()){
+                Ext.lib.Ajax.abort(transId || this.transId);
+            }
+        },
+
+        
+        handleResponse : function(response){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTCOMPLETE, this, response, options);
+            if(options.success){
+                options.success.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, true, response);
+            }
+        },
+
+        
+        handleFailure : function(response, e){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTEXCEPTION, this, response, options, e);
+            if(options.failure){
+                options.failure.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, false, response);
+            }
+        },
+
+        
+        doFormUpload : function(o, ps, url){
+            var id = Ext.id(),
+                doc = document,
+                frame = doc.createElement('iframe'),
+                form = Ext.getDom(o.form),
+                hiddens = [],
+                hd,
+                encoding = 'multipart/form-data',
+                buf = {
+                    target: form.target,
+                    method: form.method,
+                    encoding: form.encoding,
+                    enctype: form.enctype,
+                    action: form.action
+                };
+
+            
+            Ext.fly(frame).set({
+                id: id,
+                name: id,
+                cls: 'x-hidden',
+                src: Ext.SSL_SECURE_URL
+            }); 
+
+            doc.body.appendChild(frame);
+
+            
+            if(Ext.isIE){
+               document.frames[id].name = id;
+            }
+
+
+            Ext.fly(form).set({
+                target: id,
+                method: POST,
+                enctype: encoding,
+                encoding: encoding,
+                action: url || buf.action
+            });
+
+            
+            Ext.iterate(Ext.urlDecode(ps, false), function(k, v){
+                hd = doc.createElement('input');
+                Ext.fly(hd).set({
+                    type: 'hidden',
+                    value: v,
+                    name: k
+                });
+                form.appendChild(hd);
+                hiddens.push(hd);
+            });
+
+            function cb(){
+                var me = this,
+                    
+                    r = {responseText : '',
+                         responseXML : null,
+                         argument : o.argument},
+                    doc,
+                    firstChild;
+
+                try{
+                    doc = frame.contentWindow.document || frame.contentDocument || WINDOW.frames[id].document;
+                    if(doc){
+                        if(doc.body){
+                            if(/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)){ 
+                                r.responseText = firstChild.value;
+                            }else{
+                                r.responseText = doc.body.innerHTML;
+                            }
+                        }
+                        
+                        r.responseXML = doc.XMLDocument || doc;
+                    }
+                }
+                catch(e) {}
+
+                Ext.EventManager.removeListener(frame, LOAD, cb, me);
+
+                me.fireEvent(REQUESTCOMPLETE, me, r, o);
+
+                function runCallback(fn, scope, args){
+                    if(Ext.isFunction(fn)){
+                        fn.apply(scope, args);
+                    }
+                }
+
+                runCallback(o.success, o.scope, [r, o]);
+                runCallback(o.callback, o.scope, [o, true, r]);
+
+                if(!me.debugUploads){
+                    setTimeout(function(){Ext.removeNode(frame);}, 100);
+                }
+            }
+
+            Ext.EventManager.on(frame, LOAD, cb, this);
+            form.submit();
+
+            Ext.fly(form).set(buf);
+            Ext.each(hiddens, function(h) {
+                Ext.removeNode(h);
+            });
+        }
+    });
+})();
+
+
+Ext.Ajax = new Ext.data.Connection({
+    
+    
+    
+    
+    
+    
+
+    
+
+    
+    
+    
+    
+    
+    
+
+    
+    autoAbort : false,
+
+    
+    serializeForm : function(form){
+        return Ext.lib.Ajax.serializeForm(form);
+    }
+});
+
+Ext.util.JSON = new (function(){
+    var useHasOwn = !!{}.hasOwnProperty,
+        isNative = function() {
+            var useNative = null;
+
+            return function() {
+                if (useNative === null) {
+                    useNative = Ext.USE_NATIVE_JSON && window.JSON && JSON.toString() == '[object JSON]';
+                }
+        
+                return useNative;
+            };
+        }(),
+        pad = function(n) {
+            return n < 10 ? "0" + n : n;
+        },
+        doDecode = function(json){
+            return json ? eval("(" + json + ")") : "";    
+        },
+        doEncode = function(o){
+            if(!Ext.isDefined(o) || o === null){
+                return "null";
+            }else if(Ext.isArray(o)){
+                return encodeArray(o);
+            }else if(Ext.isDate(o)){
+                return Ext.util.JSON.encodeDate(o);
+            }else if(Ext.isString(o)){
+                return encodeString(o);
+            }else if(typeof o == "number"){
+                
+                return isFinite(o) ? String(o) : "null";
+            }else if(Ext.isBoolean(o)){
+                return String(o);
+            }else {
+                var a = ["{"], b, i, v;
+                for (i in o) {
+                    
+                    if(!o.getElementsByTagName){
+                        if(!useHasOwn || o.hasOwnProperty(i)) {
+                            v = o[i];
+                            switch (typeof v) {
+                            case "undefined":
+                            case "function":
+                            case "unknown":
+                                break;
+                            default:
+                                if(b){
+                                    a.push(',');
+                                }
+                                a.push(doEncode(i), ":",
+                                        v === null ? "null" : doEncode(v));
+                                b = true;
+                            }
+                        }
+                    }
+                }
+                a.push("}");
+                return a.join("");
+            }    
+        },
+        m = {
+            "\b": '\\b',
+            "\t": '\\t',
+            "\n": '\\n',
+            "\f": '\\f',
+            "\r": '\\r',
+            '"' : '\\"',
+            "\\": '\\\\'
+        },
+        encodeString = function(s){
+            if (/["\\\x00-\x1f]/.test(s)) {
+                return '"' + s.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                    var c = m[b];
+                    if(c){
+                        return c;
+                    }
+                    c = b.charCodeAt();
+                    return "\\u00" +
+                        Math.floor(c / 16).toString(16) +
+                        (c % 16).toString(16);
+                }) + '"';
+            }
+            return '"' + s + '"';
+        },
+        encodeArray = function(o){
+            var a = ["["], b, i, l = o.length, v;
+                for (i = 0; i < l; i += 1) {
+                    v = o[i];
+                    switch (typeof v) {
+                        case "undefined":
+                        case "function":
+                        case "unknown":
+                            break;
+                        default:
+                            if (b) {
+                                a.push(',');
+                            }
+                            a.push(v === null ? "null" : Ext.util.JSON.encode(v));
+                            b = true;
+                    }
+                }
+                a.push("]");
+                return a.join("");
+        };
+
+    
+    this.encodeDate = function(o){
+        return '"' + o.getFullYear() + "-" +
+                pad(o.getMonth() + 1) + "-" +
+                pad(o.getDate()) + "T" +
+                pad(o.getHours()) + ":" +
+                pad(o.getMinutes()) + ":" +
+                pad(o.getSeconds()) + '"';
+    };
+
+    
+    this.encode = function() {
+        var ec;
+        return function(o) {
+            if (!ec) {
+                
+                ec = isNative() ? JSON.stringify : doEncode;
+            }
+            return ec(o);
+        };
+    }();
+
+
+    
+    this.decode = function() {
+        var dc;
+        return function(json) {
+            if (!dc) {
+                
+                dc = isNative() ? JSON.parse : doDecode;
+            }
+            return dc(json);
+        };
+    }();
+
+})();
+
+Ext.encode = Ext.util.JSON.encode;
+
+Ext.decode = Ext.util.JSON.decode;
+
+Ext.EventManager = function(){
+    var docReadyEvent,
+        docReadyProcId,
+        docReadyState = false,
+        DETECT_NATIVE = Ext.isGecko || Ext.isWebKit || Ext.isSafari,
+        E = Ext.lib.Event,
+        D = Ext.lib.Dom,
+        DOC = document,
+        WINDOW = window,
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        COMPLETE = 'complete',
+        propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+        
+        specialElCache = [];
+
+     function getId(el){
+        var id = false,
+            i = 0,
+            len = specialElCache.length,
+            skip = false,
+            o;
+            
+        if (el) {
+            if (el.getElementById || el.navigator) {
+                
+                for(; i < len; ++i){
+                    o = specialElCache[i];
+                    if(o.el === el){
+                        id = o.id;
+                        break;
+                    }
+                }
+                if(!id){
+                    
+                    id = Ext.id(el);
+                    specialElCache.push({
+                        id: id,
+                        el: el
+                    });
+                    skip = true;
+                }
+            }else{
+                id = Ext.id(el);
+            }
+            if(!Ext.elCache[id]){
+                Ext.Element.addToCache(new Ext.Element(el), id);
+                if(skip){
+                    Ext.elCache[id].skipGC = true;
+                }
+            }
+        }
+        return id;
+     }
+
+    
+    function addListener(el, ename, fn, task, wrap, scope){
+        el = Ext.getDom(el);
+        var id = getId(el),
+            es = Ext.elCache[id].events,
+            wfn;
+
+        wfn = E.on(el, ename, wrap);
+        es[ename] = es[ename] || [];
+
+        
+        es[ename].push([fn, wrap, scope, wfn, task]);
+
+        
+        
+
+        
+        if(el.addEventListener && ename == "mousewheel"){
+            var args = ["DOMMouseScroll", wrap, false];
+            el.addEventListener.apply(el, args);
+            Ext.EventManager.addListener(WINDOW, 'unload', function(){
+                el.removeEventListener.apply(el, args);
+            });
+        }
+
+        
+        if(el == DOC && ename == "mousedown"){
+            Ext.EventManager.stoppedMouseDownEvent.addListener(wrap);
+        }
+    }
+
+    function doScrollChk(){
+        
+        if(window != top){
+            return false;
+        }
+
+        try{
+            DOC.documentElement.doScroll('left');
+        }catch(e){
+             return false;
+        }
+
+        fireDocReady();
+        return true;
+    }
+    
+    function checkReadyState(e){
+
+        if(Ext.isIE && doScrollChk()){
+            return true;
+        }
+        if(DOC.readyState == COMPLETE){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    var styles;
+    function checkStyleSheets(e){
+        styles || (styles = Ext.query('style, link[rel=stylesheet]'));
+        if(styles.length == DOC.styleSheets.length){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    function OperaDOMContentLoaded(e){
+        DOC.removeEventListener(DOMCONTENTLOADED, arguments.callee, false);
+        checkStyleSheets();
+    }
+
+    function fireDocReady(e){
+        if(!docReadyState){
+            docReadyState = true; 
+
+            if(docReadyProcId){
+                clearTimeout(docReadyProcId);
+            }
+            if(DETECT_NATIVE) {
+                DOC.removeEventListener(DOMCONTENTLOADED, fireDocReady, false);
+            }
+            if(Ext.isIE && checkReadyState.bindIE){  
+                DOC.detachEvent('onreadystatechange', checkReadyState);
+            }
+            E.un(WINDOW, "load", arguments.callee);
+        }
+        if(docReadyEvent && !Ext.isReady){
+            Ext.isReady = true;
+            docReadyEvent.fire();
+            docReadyEvent.listeners = [];
+        }
+
+    }
+
+    function initDocReady(){
+        docReadyEvent || (docReadyEvent = new Ext.util.Event());
+        if (DETECT_NATIVE) {
+            DOC.addEventListener(DOMCONTENTLOADED, fireDocReady, false);
+        }
+        
+        if (Ext.isIE){
+            
+            
+            if(!checkReadyState()){
+                checkReadyState.bindIE = true;
+                DOC.attachEvent('onreadystatechange', checkReadyState);
+            }
+
+        }else if(Ext.isOpera ){
+            
+
+            
+            (DOC.readyState == COMPLETE && checkStyleSheets()) ||
+                DOC.addEventListener(DOMCONTENTLOADED, OperaDOMContentLoaded, false);
+
+        }else if (Ext.isWebKit){
+            
+            checkReadyState();
+        }
+        
+        E.on(WINDOW, "load", fireDocReady);
+    }
+
+    function createTargeted(h, o){
+        return function(){
+            var args = Ext.toArray(arguments);
+            if(o.target == Ext.EventObject.setEvent(args[0]).target){
+                h.apply(this, args);
+            }
+        };
+    }
+
+    function createBuffered(h, o, task){
+        return function(e){
+            
+            task.delay(o.buffer, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function createSingle(h, el, ename, fn, scope){
+        return function(e){
+            Ext.EventManager.removeListener(el, ename, fn, scope);
+            h(e);
+        };
+    }
+
+    function createDelayed(h, o, fn){
+        return function(e){
+            var task = new Ext.util.DelayedTask(h);
+            if(!fn.tasks) {
+                fn.tasks = [];
+            }
+            fn.tasks.push(task);
+            task.delay(o.delay || 10, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function listen(element, ename, opt, fn, scope){
+        var o = (!opt || typeof opt == "boolean") ? {} : opt,
+            el = Ext.getDom(element), task;
+
+        fn = fn || o.fn;
+        scope = scope || o.scope;
+
+        if(!el){
+            throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.';
+        }
+        function h(e){
+            
+            if(!Ext){
+                return;
+            }
+            e = Ext.EventObject.setEvent(e);
+            var t;
+            if (o.delegate) {
+                if(!(t = e.getTarget(o.delegate, el))){
+                    return;
+                }
+            } else {
+                t = e.target;
+            }
+            if (o.stopEvent) {
+                e.stopEvent();
+            }
+            if (o.preventDefault) {
+               e.preventDefault();
+            }
+            if (o.stopPropagation) {
+                e.stopPropagation();
+            }
+            if (o.normalized === false) {
+                e = e.browserEvent;
+            }
+
+            fn.call(scope || el, e, t, o);
+        }
+        if(o.target){
+            h = createTargeted(h, o);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, fn);
+        }
+        if(o.single){
+            h = createSingle(h, el, ename, fn, scope);
+        }
+        if(o.buffer){
+            task = new Ext.util.DelayedTask(h);
+            h = createBuffered(h, o, task);
+        }
+
+        addListener(el, ename, fn, task, h, scope);
+        return h;
+    }
+
+    var pub = {
+        
+        addListener : function(element, eventName, fn, scope, options){
+            if(typeof eventName == 'object'){
+                var o = eventName, e, val;
+                for(e in o){
+                    val = o[e];
+                    if(!propRe.test(e)){
+                        if(Ext.isFunction(val)){
+                            
+                            listen(element, e, o, val, o.scope);
+                        }else{
+                            
+                            listen(element, e, val);
+                        }
+                    }
+                }
+            } else {
+                listen(element, eventName, options, fn, scope);
+            }
+        },
+
+        
+        removeListener : function(el, eventName, fn, scope){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                f = el && (Ext.elCache[id].events)[eventName] || [],
+                wrap, i, l, k, len, fnc;
+
+            for (i = 0, len = f.length; i < len; i++) {
+
+                
+                if (Ext.isArray(fnc = f[i]) && fnc[0] == fn && (!scope || fnc[2] == scope)) {
+                    if(fnc[4]) {
+                        fnc[4].cancel();
+                    }
+                    k = fn.tasks && fn.tasks.length;
+                    if(k) {
+                        while(k--) {
+                            fn.tasks[k].cancel();
+                        }
+                        delete fn.tasks;
+                    }
+                    wrap = fnc[1];
+                    E.un(el, eventName, E.extAdapter ? fnc[3] : wrap);
+
+                    
+                    if(wrap && el.addEventListener && eventName == "mousewheel"){
+                        el.removeEventListener("DOMMouseScroll", wrap, false);
+                    }
+
+                    
+                    if(wrap && el == DOC && eventName == "mousedown"){
+                        Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                    }
+
+                    f.splice(i, 1);
+                    if (f.length === 0) {
+                        delete Ext.elCache[id].events[eventName];
+                    }
+                    for (k in Ext.elCache[id].events) {
+                        return false;
+                    }
+                    Ext.elCache[id].events = {};
+                    return false;
+                }
+            }
+        },
+
+        
+        removeAll : function(el){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                f, i, len, ename, fn, k, wrap;
+
+            for(ename in es){
+                if(es.hasOwnProperty(ename)){
+                    f = es[ename];
+                    
+                    for (i = 0, len = f.length; i < len; i++) {
+                        fn = f[i];
+                        if(fn[4]) {
+                            fn[4].cancel();
+                        }
+                        if(fn[0].tasks && (k = fn[0].tasks.length)) {
+                            while(k--) {
+                                fn[0].tasks[k].cancel();
+                            }
+                            delete fn.tasks;
+                        }
+                        wrap =  fn[1];
+                        E.un(el, ename, E.extAdapter ? fn[3] : wrap);
+
+                        
+                        if(el.addEventListener && wrap && ename == "mousewheel"){
+                            el.removeEventListener("DOMMouseScroll", wrap, false);
+                        }
+
+                        
+                        if(wrap && el == DOC &&  ename == "mousedown"){
+                            Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                        }
+                    }
+                }
+            }
+            if (Ext.elCache[id]) {
+                Ext.elCache[id].events = {};
+            }
+        },
+
+        getListeners : function(el, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                results = [];
+            if (es && es[eventName]) {
+                return es[eventName];
+            } else {
+                return null;
+            }
+        },
+
+        purgeElement : function(el, recurse, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                i, f, len;
+            if (eventName) {
+                if (es && es.hasOwnProperty(eventName)) {
+                    f = es[eventName];
+                    for (i = 0, len = f.length; i < len; i++) {
+                        Ext.EventManager.removeListener(el, eventName, f[i][0]);
+                    }
+                }
+            } else {
+                Ext.EventManager.removeAll(el);
+            }
+            if (recurse && el && el.childNodes) {
+                for (i = 0, len = el.childNodes.length; i < len; i++) {
+                    Ext.EventManager.purgeElement(el.childNodes[i], recurse, eventName);
+                }
+            }
+        },
+
+        _unload : function() {
+            var el;
+            for (el in Ext.elCache) {
+                Ext.EventManager.removeAll(el);
+            }
+            delete Ext.elCache;
+            delete Ext.Element._flyweights;
+
+            
+            var c,
+                conn,
+                tid,
+                ajax = Ext.lib.Ajax;
+            (typeof ajax.conn == 'object') ? conn = ajax.conn : conn = {};
+            for (tid in conn) {
+                c = conn[tid];
+                if (c) {
+                    ajax.abort({conn: c, tId: tid});
+                }
+            }
+        },
+        
+        onDocumentReady : function(fn, scope, options){
+            if (Ext.isReady) { 
+                docReadyEvent || (docReadyEvent = new Ext.util.Event());
+                docReadyEvent.addListener(fn, scope, options);
+                docReadyEvent.fire();
+                docReadyEvent.listeners = [];
+            } else {
+                if (!docReadyEvent) {
+                    initDocReady();
+                }
+                options = options || {};
+                options.delay = options.delay || 1;
+                docReadyEvent.addListener(fn, scope, options);
+            }
+        },
+
+        
+        fireDocReady  : fireDocReady
+    };
+     
+    pub.on = pub.addListener;
+    
+    pub.un = pub.removeListener;
+
+    pub.stoppedMouseDownEvent = new Ext.util.Event();
+    return pub;
+}();
+
+Ext.onReady = Ext.EventManager.onDocumentReady;
+
+
+
+(function(){
+    var initExtCss = function() {
+        
+        var bd = document.body || document.getElementsByTagName('body')[0];
+        if (!bd) {
+            return false;
+        }
+
+        var cls = [' ',
+                Ext.isIE ? "ext-ie " + (Ext.isIE6 ? 'ext-ie6' : (Ext.isIE7 ? 'ext-ie7' : (Ext.isIE8 ? 'ext-ie8' : 'ext-ie9')))
+                : Ext.isGecko ? "ext-gecko " + (Ext.isGecko2 ? 'ext-gecko2' : 'ext-gecko3')
+                : Ext.isOpera ? "ext-opera"
+                : Ext.isWebKit ? "ext-webkit" : ""];
+
+        if (Ext.isSafari) {
+            cls.push("ext-safari " + (Ext.isSafari2 ? 'ext-safari2' : (Ext.isSafari3 ? 'ext-safari3' : 'ext-safari4')));
+        } else if(Ext.isChrome) {
+            cls.push("ext-chrome");
+        }
+
+        if (Ext.isMac) {
+            cls.push("ext-mac");
+        }
+        if (Ext.isLinux) {
+            cls.push("ext-linux");
+        }
+
+        
+        if (Ext.isStrict || Ext.isBorderBox) {
+            var p = bd.parentNode;
+            if (p) {
+                if (!Ext.isStrict) {
+                    Ext.fly(p, '_internal').addClass('x-quirks');
+                    if (Ext.isIE && !Ext.isStrict) {
+                        Ext.isIEQuirks = true;
+                    }
+                }
+                Ext.fly(p, '_internal').addClass(((Ext.isStrict && Ext.isIE ) || (!Ext.enableForcedBoxModel && !Ext.isIE)) ? ' ext-strict' : ' ext-border-box');
+            }
+        }
+        
+        
+        if (Ext.enableForcedBoxModel && !Ext.isIE) {
+            Ext.isForcedBorderBox = true;
+            cls.push("ext-forced-border-box");
+        }
+        
+        Ext.fly(bd, '_internal').addClass(cls);
+        return true;
+    };
+    
+    if (!initExtCss()) {
+        Ext.onReady(initExtCss);
+    }
+})();
+
+
+(function(){
+    var supports = Ext.apply(Ext.supports, {
+        
+        correctRightMargin: true,
+        
+        
+        correctTransparentColor: true,
+        
+        
+        cssFloat: true
+    });
+    
+    var supportTests = function(){
+            var div = document.createElement('div'),
+                doc = document,
+                view,
+                last;
+                
+            div.innerHTML = '<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';
+            doc.body.appendChild(div);
+            last = div.lastChild;
+            
+            if((view = doc.defaultView)){
+                if(view.getComputedStyle(div.firstChild.firstChild, null).marginRight != '0px'){
+                    supports.correctRightMargin = false;
+                }
+                if(view.getComputedStyle(last, null).backgroundColor != 'transparent'){
+                    supports.correctTransparentColor = false;
+                }
+            }
+            supports.cssFloat = !!last.style.cssFloat;
+            doc.body.removeChild(div);
+    };
+    
+    if (Ext.isReady) {
+        supportTests();    
+    } else {
+        Ext.onReady(supportTests);
+    }
+})();
+
+
+
+Ext.EventObject = function(){
+    var E = Ext.lib.Event,
+        clickRe = /(dbl)?click/,
+        
+        safariKeys = {
+            3 : 13, 
+            63234 : 37, 
+            63235 : 39, 
+            63232 : 38, 
+            63233 : 40, 
+            63276 : 33, 
+            63277 : 34, 
+            63272 : 46, 
+            63273 : 36, 
+            63275 : 35  
+        },
+        
+        btnMap = Ext.isIE ? {1:0,4:1,2:2} : {0:0,1:1,2:2};
+
+    Ext.EventObjectImpl = function(e){
+        if(e){
+            this.setEvent(e.browserEvent || e);
+        }
+    };
+
+    Ext.EventObjectImpl.prototype = {
+           
+        setEvent : function(e){
+            var me = this;
+            if(e == me || (e && e.browserEvent)){ 
+                return e;
+            }
+            me.browserEvent = e;
+            if(e){
+                
+                me.button = e.button ? btnMap[e.button] : (e.which ? e.which - 1 : -1);
+                if(clickRe.test(e.type) && me.button == -1){
+                    me.button = 0;
+                }
+                me.type = e.type;
+                me.shiftKey = e.shiftKey;
+                
+                me.ctrlKey = e.ctrlKey || e.metaKey || false;
+                me.altKey = e.altKey;
+                
+                me.keyCode = e.keyCode;
+                me.charCode = e.charCode;
+                
+                me.target = E.getTarget(e);
+                
+                me.xy = E.getXY(e);
+            }else{
+                me.button = -1;
+                me.shiftKey = false;
+                me.ctrlKey = false;
+                me.altKey = false;
+                me.keyCode = 0;
+                me.charCode = 0;
+                me.target = null;
+                me.xy = [0, 0];
+            }
+            return me;
+        },
+
+        
+        stopEvent : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopEvent(me.browserEvent);
+            }
+        },
+
+        
+        preventDefault : function(){
+            if(this.browserEvent){
+                E.preventDefault(this.browserEvent);
+            }
+        },
+
+        
+        stopPropagation : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopPropagation(me.browserEvent);
+            }
+        },
+
+        
+        getCharCode : function(){
+            return this.charCode || this.keyCode;
+        },
+
+        
+        getKey : function(){
+            return this.normalizeKey(this.keyCode || this.charCode);
+        },
+
+        
+        normalizeKey: function(k){
+            return Ext.isSafari ? (safariKeys[k] || k) : k;
+        },
+
+        
+        getPageX : function(){
+            return this.xy[0];
+        },
+
+        
+        getPageY : function(){
+            return this.xy[1];
+        },
+
+        
+        getXY : function(){
+            return this.xy;
+        },
+
+        
+        getTarget : function(selector, maxDepth, returnEl){
+            return selector ? Ext.fly(this.target).findParent(selector, maxDepth, returnEl) : (returnEl ? Ext.get(this.target) : this.target);
+        },
+
+        
+        getRelatedTarget : function(){
+            return this.browserEvent ? E.getRelatedTarget(this.browserEvent) : null;
+        },
+
+        
+        getWheelDelta : function(){
+            var e = this.browserEvent;
+            var delta = 0;
+            if(e.wheelDelta){ 
+                delta = e.wheelDelta/120;
+            }else if(e.detail){ 
+                delta = -e.detail/3;
+            }
+            return delta;
+        },
+
+        
+        within : function(el, related, allowEl){
+            if(el){
+                var t = this[related ? "getRelatedTarget" : "getTarget"]();
+                return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t));
+            }
+            return false;
+        }
+     };
+
+    return new Ext.EventObjectImpl();
+}();
+Ext.Loader = Ext.apply({}, {
+    
+    load: function(fileList, callback, scope, preserveOrder) {
+        var scope       = scope || this,
+            head        = document.getElementsByTagName("head")[0],
+            fragment    = document.createDocumentFragment(),
+            numFiles    = fileList.length,
+            loadedFiles = 0,
+            me          = this;
+        
+        
+        var loadFileIndex = function(index) {
+            head.appendChild(
+                me.buildScriptTag(fileList[index], onFileLoaded)
+            );
+        };
+        
+        
+        var onFileLoaded = function() {
+            loadedFiles ++;
+            
+            
+            if (numFiles == loadedFiles && typeof callback == 'function') {
+                callback.call(scope);
+            } else {
+                if (preserveOrder === true) {
+                    loadFileIndex(loadedFiles);
+                }
+            }
+        };
+        
+        if (preserveOrder === true) {
+            loadFileIndex.call(this, 0);
+        } else {
+            
+            Ext.each(fileList, function(file, index) {
+                fragment.appendChild(
+                    this.buildScriptTag(file, onFileLoaded)
+                );  
+            }, this);
+            
+            head.appendChild(fragment);
+        }
+    },
+    
+    
+    buildScriptTag: function(filename, callback) {
+        var script  = document.createElement('script');
+        script.type = "text/javascript";
+        script.src  = filename;
+        
+        
+        if (script.readyState) {
+            script.onreadystatechange = function() {
+                if (script.readyState == "loaded" || script.readyState == "complete") {
+                    script.onreadystatechange = null;
+                    callback();
+                }
+            };
+        } else {
+            script.onload = callback;
+        }    
+        
+        return script;
+    }
+});
+
+
+Ext.ns("Ext.grid", "Ext.list", "Ext.dd", "Ext.tree", "Ext.form", "Ext.menu",
+       "Ext.state", "Ext.layout.boxOverflow", "Ext.app", "Ext.ux", "Ext.chart", "Ext.direct", "Ext.slider");
+    
+
+Ext.apply(Ext, function(){
+    var E = Ext,
+        idSeed = 0,
+        scrollWidth = null;
+
+    return {
+        
+        emptyFn : function(){},
+
+        
+        BLANK_IMAGE_URL : Ext.isIE6 || Ext.isIE7 || Ext.isAir ?
+                            'http:/' + '/www.extjs.com/s.gif' :
+                            'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
+
+        extendX : function(supr, fn){
+            return Ext.extend(supr, fn(supr.prototype));
+        },
+
+        
+        getDoc : function(){
+            return Ext.get(document);
+        },
+
+        
+        num : function(v, defaultValue){
+            v = Number(Ext.isEmpty(v) || Ext.isArray(v) || typeof v == 'boolean' || (typeof v == 'string' && v.trim().length == 0) ? NaN : v);
+            return isNaN(v) ? defaultValue : v;
+        },
+
+        
+        value : function(v, defaultValue, allowBlank){
+            return Ext.isEmpty(v, allowBlank) ? defaultValue : v;
+        },
+
+        
+        escapeRe : function(s) {
+            return s.replace(/([-.*+?^${}()|[\]\/\\])/g, "\\$1");
+        },
+
+        sequence : function(o, name, fn, scope){
+            o[name] = o[name].createSequence(fn, scope);
+        },
+
+        
+        addBehaviors : function(o){
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.addBehaviors(o);
+                });
+            } else {
+                var cache = {}, 
+                    parts,
+                    b,
+                    s;
+                for (b in o) {
+                    if ((parts = b.split('@'))[1]) { 
+                        s = parts[0];
+                        if(!cache[s]){
+                            cache[s] = Ext.select(s);
+                        }
+                        cache[s].on(parts[1], o[b]);
+                    }
+                }
+                cache = null;
+            }
+        },
+
+        
+        getScrollBarWidth: function(force){
+            if(!Ext.isReady){
+                return 0;
+            }
+
+            if(force === true || scrollWidth === null){
+                    
+                var div = Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),
+                    child = div.child('div', true);
+                var w1 = child.offsetWidth;
+                div.setStyle('overflow', (Ext.isWebKit || Ext.isGecko) ? 'auto' : 'scroll');
+                var w2 = child.offsetWidth;
+                div.remove();
+                
+                scrollWidth = w1 - w2 + 2;
+            }
+            return scrollWidth;
+        },
+
+
+        
+        combine : function(){
+            var as = arguments, l = as.length, r = [];
+            for(var i = 0; i < l; i++){
+                var a = as[i];
+                if(Ext.isArray(a)){
+                    r = r.concat(a);
+                }else if(a.length !== undefined && !a.substr){
+                    r = r.concat(Array.prototype.slice.call(a, 0));
+                }else{
+                    r.push(a);
+                }
+            }
+            return r;
+        },
+
+        
+        copyTo : function(dest, source, names){
+            if(typeof names == 'string'){
+                names = names.split(/[,;\s]/);
+            }
+            Ext.each(names, function(name){
+                if(source.hasOwnProperty(name)){
+                    dest[name] = source[name];
+                }
+            }, this);
+            return dest;
+        },
+
+        
+        destroy : function(){
+            Ext.each(arguments, function(arg){
+                if(arg){
+                    if(Ext.isArray(arg)){
+                        this.destroy.apply(this, arg);
+                    }else if(typeof arg.destroy == 'function'){
+                        arg.destroy();
+                    }else if(arg.dom){
+                        arg.remove();
+                    }
+                }
+            }, this);
+        },
+
+        
+        destroyMembers : function(o, arg1, arg2, etc){
+            for(var i = 1, a = arguments, len = a.length; i < len; i++) {
+                Ext.destroy(o[a[i]]);
+                delete o[a[i]];
+            }
+        },
+
+        
+        clean : function(arr){
+            var ret = [];
+            Ext.each(arr, function(v){
+                if(!!v){
+                    ret.push(v);
+                }
+            });
+            return ret;
+        },
+
+        
+        unique : function(arr){
+            var ret = [],
+                collect = {};
+
+            Ext.each(arr, function(v) {
+                if(!collect[v]){
+                    ret.push(v);
+                }
+                collect[v] = true;
+            });
+            return ret;
+        },
+
+        
+        flatten : function(arr){
+            var worker = [];
+            function rFlatten(a) {
+                Ext.each(a, function(v) {
+                    if(Ext.isArray(v)){
+                        rFlatten(v);
+                    }else{
+                        worker.push(v);
+                    }
+                });
+                return worker;
+            }
+            return rFlatten(arr);
+        },
+
+        
+        min : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a < b ? -1 : 1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == -1 ? ret : v;
+            });
+            return ret;
+        },
+
+        
+        max : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a > b ? 1 : -1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == 1 ? ret : v;
+            });
+            return ret;
+        },
+
+        
+        mean : function(arr){
+           return arr.length > 0 ? Ext.sum(arr) / arr.length : undefined;
+        },
+
+        
+        sum : function(arr){
+           var ret = 0;
+           Ext.each(arr, function(v) {
+               ret += v;
+           });
+           return ret;
+        },
+
+        
+        partition : function(arr, truth){
+            var ret = [[],[]];
+            Ext.each(arr, function(v, i, a) {
+                ret[ (truth && truth(v, i, a)) || (!truth && v) ? 0 : 1].push(v);
+            });
+            return ret;
+        },
+
+        
+        invoke : function(arr, methodName){
+            var ret = [],
+                args = Array.prototype.slice.call(arguments, 2);
+            Ext.each(arr, function(v,i) {
+                if (v && typeof v[methodName] == 'function') {
+                    ret.push(v[methodName].apply(v, args));
+                } else {
+                    ret.push(undefined);
+                }
+            });
+            return ret;
+        },
+
+        
+        pluck : function(arr, prop){
+            var ret = [];
+            Ext.each(arr, function(v) {
+                ret.push( v[prop] );
+            });
+            return ret;
+        },
+
+        
+        zip : function(){
+            var parts = Ext.partition(arguments, function( val ){ return typeof val != 'function'; }),
+                arrs = parts[0],
+                fn = parts[1][0],
+                len = Ext.max(Ext.pluck(arrs, "length")),
+                ret = [];
+
+            for (var i = 0; i < len; i++) {
+                ret[i] = [];
+                if(fn){
+                    ret[i] = fn.apply(fn, Ext.pluck(arrs, i));
+                }else{
+                    for (var j = 0, aLen = arrs.length; j < aLen; j++){
+                        ret[i].push( arrs[j][i] );
+                    }
+                }
+            }
+            return ret;
+        },
+
+        
+        getCmp : function(id){
+            return Ext.ComponentMgr.get(id);
+        },
+
+        
+        useShims: E.isIE6 || (E.isMac && E.isGecko2),
+
+        
+        
+        type : function(o){
+            if(o === undefined || o === null){
+                return false;
+            }
+            if(o.htmlElement){
+                return 'element';
+            }
+            var t = typeof o;
+            if(t == 'object' && o.nodeName) {
+                switch(o.nodeType) {
+                    case 1: return 'element';
+                    case 3: return (/\S/).test(o.nodeValue) ? 'textnode' : 'whitespace';
+                }
+            }
+            if(t == 'object' || t == 'function') {
+                switch(o.constructor) {
+                    case Array: return 'array';
+                    case RegExp: return 'regexp';
+                    case Date: return 'date';
+                }
+                if(typeof o.length == 'number' && typeof o.item == 'function') {
+                    return 'nodelist';
+                }
+            }
+            return t;
+        },
+
+        intercept : function(o, name, fn, scope){
+            o[name] = o[name].createInterceptor(fn, scope);
+        },
+
+        
+        callback : function(cb, scope, args, delay){
+            if(typeof cb == 'function'){
+                if(delay){
+                    cb.defer(delay, scope, args || []);
+                }else{
+                    cb.apply(scope, args || []);
+                }
+            }
+        }
+    };
+}());
+
+
+Ext.apply(Function.prototype, {
+    
+    createSequence : function(fcn, scope){
+        var method = this;
+        return (typeof fcn != 'function') ?
+                this :
+                function(){
+                    var retval = method.apply(this || window, arguments);
+                    fcn.apply(scope || this || window, arguments);
+                    return retval;
+                };
+    }
+});
+
+
+
+Ext.applyIf(String, {
+
+    
+    escape : function(string) {
+        return string.replace(/('|\\)/g, "\\$1");
+    },
+
+    
+    leftPad : function (val, size, ch) {
+        var result = String(val);
+        if(!ch) {
+            ch = " ";
+        }
+        while (result.length < size) {
+            result = ch + result;
+        }
+        return result;
+    }
+});
+
+
+String.prototype.toggle = function(value, other){
+    return this == value ? other : value;
+};
+
+
+String.prototype.trim = function(){
+    var re = /^\s+|\s+$/g;
+    return function(){ return this.replace(re, ""); };
+}();
+
+
+
+Date.prototype.getElapsed = function(date) {
+    return Math.abs((date || new Date()).getTime()-this.getTime());
+};
+
+
+
+Ext.applyIf(Number.prototype, {
+    
+    constrain : function(min, max){
+        return Math.min(Math.max(this, min), max);
+    }
+});
+Ext.lib.Dom.getRegion = function(el) {
+    return Ext.lib.Region.getRegion(el);
+};	Ext.lib.Region = function(t, r, b, l) {
+		var me = this;
+        me.top = t;
+        me[1] = t;
+        me.right = r;
+        me.bottom = b;
+        me.left = l;
+        me[0] = l;
+    };
+
+    Ext.lib.Region.prototype = {
+        contains : function(region) {
+	        var me = this;
+            return ( region.left >= me.left &&
+                     region.right <= me.right &&
+                     region.top >= me.top &&
+                     region.bottom <= me.bottom );
+
+        },
+
+        getArea : function() {
+	        var me = this;
+            return ( (me.bottom - me.top) * (me.right - me.left) );
+        },
+
+        intersect : function(region) {
+            var me = this,
+            	t = Math.max(me.top, region.top),
+            	r = Math.min(me.right, region.right),
+            	b = Math.min(me.bottom, region.bottom),
+            	l = Math.max(me.left, region.left);
+
+            if (b >= t && r >= l) {
+                return new Ext.lib.Region(t, r, b, l);
+            }
+        },
+        
+        union : function(region) {
+	        var me = this,
+            	t = Math.min(me.top, region.top),
+            	r = Math.max(me.right, region.right),
+            	b = Math.max(me.bottom, region.bottom),
+            	l = Math.min(me.left, region.left);
+
+            return new Ext.lib.Region(t, r, b, l);
+        },
+
+        constrainTo : function(r) {
+	        var me = this;
+            me.top = me.top.constrain(r.top, r.bottom);
+            me.bottom = me.bottom.constrain(r.top, r.bottom);
+            me.left = me.left.constrain(r.left, r.right);
+            me.right = me.right.constrain(r.left, r.right);
+            return me;
+        },
+
+        adjust : function(t, l, b, r) {
+	        var me = this;
+            me.top += t;
+            me.left += l;
+            me.right += r;
+            me.bottom += b;
+            return me;
+        }
+    };
+
+    Ext.lib.Region.getRegion = function(el) {
+        var p = Ext.lib.Dom.getXY(el),
+        	t = p[1],
+        	r = p[0] + el.offsetWidth,
+        	b = p[1] + el.offsetHeight,
+        	l = p[0];
+
+        return new Ext.lib.Region(t, r, b, l);
+    };	Ext.lib.Point = function(x, y) {
+        if (Ext.isArray(x)) {
+            y = x[1];
+            x = x[0];
+        }
+        var me = this;
+        me.x = me.right = me.left = me[0] = x;
+        me.y = me.top = me.bottom = me[1] = y;
+    };
+
+    Ext.lib.Point.prototype = new Ext.lib.Region();
+
+Ext.apply(Ext.DomHelper,
+function(){
+    var pub,
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        confRe = /tag|children|cn|html$/i;
+
+    
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        el = Ext.getDom(el);
+        var newNode;
+        if (pub.useDom) {
+            newNode = createDom(o, null);
+            if (append) {
+                el.appendChild(newNode);
+            } else {
+                (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
+            }
+        } else {
+            newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
+        }
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    
+    
+    function createDom(o, parentNode){
+        var el,
+            doc = document,
+            useSet,
+            attr,
+            val,
+            cn;
+
+        if (Ext.isArray(o)) {                       
+            el = doc.createDocumentFragment(); 
+            for (var i = 0, l = o.length; i < l; i++) {
+                createDom(o[i], el);
+            }
+        } else if (typeof o == 'string') {         
+            el = doc.createTextNode(o);
+        } else {
+            el = doc.createElement( o.tag || 'div' );
+            useSet = !!el.setAttribute; 
+            for (var attr in o) {
+                if(!confRe.test(attr)){
+                    val = o[attr];
+                    if(attr == 'cls'){
+                        el.className = val;
+                    }else{
+                        if(useSet){
+                            el.setAttribute(attr, val);
+                        }else{
+                            el[attr] = val;
+                        }
+                    }
+                }
+            }
+            Ext.DomHelper.applyStyles(el, o.style);
+
+            if ((cn = o.children || o.cn)) {
+                createDom(cn, el);
+            } else if (o.html) {
+                el.innerHTML = o.html;
+            }
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    }
+
+    pub = {
+        
+        createTemplate : function(o){
+            var html = Ext.DomHelper.createHtml(o);
+            return new Ext.Template(html);
+        },
+
+        
+        useDom : false,
+
+        
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        
+        append: function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        
+        createDom: createDom
+    };
+    return pub;
+}());
+
+Ext.apply(Ext.Template.prototype, {
+    
+    disableFormats : false,
+    
+
+    
+    re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
+    argsRe : /^\s*['"](.*)["']\s*$/,
+    compileARe : /\\/g,
+    compileBRe : /(\r\n|\n)/g,
+    compileCRe : /'/g,
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     * @hide repeat doc
+     */
+    applyTemplate : function(values){
+        var me = this,
+            useF = me.disableFormats !== true,
+            fm = Ext.util.Format,
+            tpl = me;
+
+        if(me.compiled){
+            return me.compiled(values);
+        }
+        function fn(m, name, format, args){
+            if (format && useF) {
+                if (format.substr(0, 5) == "this.") {
+                    return tpl.call(format.substr(5), values[name], values);
+                } else {
+                    if (args) {
+                        // quoted values are required for strings in compiled templates,
+                        // but for non compiled we need to strip them
+                        // quoted reversed for jsmin
+                        var re = me.argsRe;
+                        args = args.split(',');
+                        for(var i = 0, len = args.length; i < len; i++){
+                            args[i] = args[i].replace(re, "$1");
+                        }
+                        args = [values[name]].concat(args);
+                    } else {
+                        args = [values[name]];
+                    }
+                    return fm[format].apply(fm, args);
+                }
+            } else {
+                return values[name] !== undefined ? values[name] : "";
+            }
+        }
+        return me.html.replace(me.re, fn);
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     * @hide repeat doc
+     */
+    compile : function(){
+        var me = this,
+            fm = Ext.util.Format,
+            useF = me.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args){
+            if(format && useF){
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            }else{
+                args= ''; format = "(values['" + name + "'] == undefined ? '' : ";
+            }
+            return "'"+ sep + format + "values['" + name + "']" + args + ")"+sep+"'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "this.compiled = function(values){ return '" +
+                   me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn) +
+                    "';};";
+        }else{
+            body = ["this.compiled = function(values){ return ['"];
+            body.push(me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return me;
+    },
+
+    // private function used to call members
+    call : function(fnName, value, allValues){
+        return this[fnName](value, allValues);
+    }
+});
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+/**
+ * @class Ext.util.Functions
+ * @singleton
+ */
+Ext.util.Functions = {
+    /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = Ext.createInterceptor(sayHi, function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+       </code></pre>
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor: function(origFn, newFn, scope) { 
+        var method = origFn;
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var me = this,
+                    args = arguments;
+                newFn.target = me;
+                newFn.method = origFn;
+                return (newFn.apply(scope || me || window, args) !== false) ?
+                        origFn.apply(me || window, args) :
+                        null;
+            };
+        }
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>Ext.createDelegate(this.myFunction, this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', Ext.createDelegate(sayHi, btn, ['Fred']));
+       </code></pre>
+     * @param {Function} fn The function to delegate.
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate: function(fn, obj, args, appendArgs) {
+        if (!Ext.isFunction(fn)) {
+            return fn;
+        }
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }
+            else if (Ext.isNumber(appendArgs)) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args);
+                // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs);
+                // splice them in
+            }
+            return fn.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+Ext.defer(sayHi, 2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+Ext.defer(function(){
+    alert('Anonymous');
+}, 100);
+       </code></pre>
+     * @param {Function} fn The function to defer.
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer: function(fn, millis, obj, args, appendArgs) {
+        fn = Ext.util.Functions.createDelegate(fn, obj, args, appendArgs);
+        if (millis > 0) {
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    },
+
+
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * 
+
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = Ext.createSequence(sayHi, function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to sequence
+     * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+     * If omitted, defaults to the scope in which the original function is called or the browser window.
+     * @return {Function} The new function
+     */
+    createSequence: function(origFn, newFn, scope) {
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var retval = origFn.apply(this || window, arguments);
+                newFn.apply(scope || this || window, arguments);
+                return retval;
+            };
+        }
+    }
+};
+
+/**
+ * Shorthand for {@link Ext.util.Functions#defer}   
+ * @param {Function} fn The function to defer.
+ * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Number} The timeout id that can be used with clearTimeout
+ * @member Ext
+ * @method defer
+ */
+
+Ext.defer = Ext.util.Functions.defer;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createInterceptor}   
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to call before the original
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+ * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createInterceptor = Ext.util.Functions.createInterceptor;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createSequence}
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to sequence
+ * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+ * If omitted, defaults to the scope in which the original function is called or the browser window.
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createSequence = Ext.util.Functions.createSequence;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createDelegate}
+ * @param {Function} fn The function to delegate.
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+Ext.createDelegate = Ext.util.Functions.createDelegate;
+/**
+ * @class Ext.util.Observable
+ */
+Ext.apply(Ext.util.Observable.prototype, function(){
+    // this is considered experimental (along with beforeMethod, afterMethod, removeMethodListener?)
+    // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+    // private
+    function getMethodEvent(method){
+        var e = (this.methodEvents = this.methodEvents ||
+        {})[method], returnValue, v, cancel, obj = this;
+
+        if (!e) {
+            this.methodEvents[method] = e = {};
+            e.originalFn = this[method];
+            e.methodName = method;
+            e.before = [];
+            e.after = [];
+
+            var makeCall = function(fn, scope, args){
+                if((v = fn.apply(scope || obj, args)) !== undefined){
+                    if (typeof v == 'object') {
+                        if(v.returnValue !== undefined){
+                            returnValue = v.returnValue;
+                        }else{
+                            returnValue = v;
+                        }
+                        cancel = !!v.cancel;
+                    }
+                    else
+                        if (v === false) {
+                            cancel = true;
+                        }
+                        else {
+                            returnValue = v;
+                        }
+                }
+            };
+
+            this[method] = function(){
+                var args = Array.prototype.slice.call(arguments, 0),
+                    b;
+                returnValue = v = undefined;
+                cancel = false;
+
+                for(var i = 0, len = e.before.length; i < len; i++){
+                    b = e.before[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+
+                if((v = e.originalFn.apply(obj, args)) !== undefined){
+                    returnValue = v;
+                }
+
+                for(var i = 0, len = e.after.length; i < len; i++){
+                    b = e.after[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+                return returnValue;
+            };
+        }
+        return e;
+    }
+
+    return {
+        // these are considered experimental
+        // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+        // adds an 'interceptor' called before the original method
+        beforeMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).before.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        // adds a 'sequence' called after the original method
+        afterMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).after.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        removeMethodListener: function(method, fn, scope){
+            var e = this.getMethodEvent(method);
+            for(var i = 0, len = e.before.length; i < len; i++){
+                if(e.before[i].fn == fn && e.before[i].scope == scope){
+                    e.before.splice(i, 1);
+                    return;
+                }
+            }
+            for(var i = 0, len = e.after.length; i < len; i++){
+                if(e.after[i].fn == fn && e.after[i].scope == scope){
+                    e.after.splice(i, 1);
+                    return;
+                }
+            }
+        },
+
+        /**
+         * Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.
+         * @param {Object} o The Observable whose events this object is to relay.
+         * @param {Array} events Array of event names to relay.
+         */
+        relayEvents : function(o, events){
+            var me = this;
+            function createHandler(ename){
+                return function(){
+                    return me.fireEvent.apply(me, [ename].concat(Array.prototype.slice.call(arguments, 0)));
+                };
+            }
+            for(var i = 0, len = events.length; i < len; i++){
+                var ename = events[i];
+                me.events[ename] = me.events[ename] || true;
+                o.on(ename, createHandler(ename), me);
+            }
+        },
+
+        /**
+         * <p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
+         * <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
+         * <p>This is commonly used by Ext.Components to bubble events to owner Containers. See {@link Ext.Component.getBubbleTarget}. The default
+         * implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+         * access the required target more quickly.</p>
+         * <p>Example:</p><pre><code>
+Ext.override(Ext.form.Field, {
+    
+    initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
+        this.enableBubble('change');
+    }),
+
+    
+    getBubbleTarget : function() {
+        if (!this.formPanel) {
+            this.formPanel = this.findParentByType('form');
+        }
+        return this.formPanel;
+    }
+});
+
+var myForm = new Ext.formPanel({
+    title: 'User Details',
+    items: [{
+        ...
+    }],
+    listeners: {
+        change: function() {
+            
+            myForm.header.setStyle('color', 'red');
+        }
+    }
+});
+</code></pre>
+         * @param {String/Array} events The event name to bubble, or an Array of event names.
+         */
+        enableBubble : function(events){
+            var me = this;
+            if(!Ext.isEmpty(events)){
+                events = Ext.isArray(events) ? events : Array.prototype.slice.call(arguments, 0);
+                for(var i = 0, len = events.length; i < len; i++){
+                    var ename = events[i];
+                    ename = ename.toLowerCase();
+                    var ce = me.events[ename] || true;
+                    if (typeof ce == 'boolean') {
+                        ce = new Ext.util.Event(me, ename);
+                        me.events[ename] = ce;
+                    }
+                    ce.bubble = true;
+                }
+            }
+        }
+    };
+}());
+
+
+
+Ext.util.Observable.capture = function(o, fn, scope){
+    o.fireEvent = o.fireEvent.createInterceptor(fn, scope);
+};
+
+
+
+Ext.util.Observable.observeClass = function(c, listeners){
+    if(c){
+      if(!c.fireEvent){
+          Ext.apply(c, new Ext.util.Observable());
+          Ext.util.Observable.capture(c.prototype, c.fireEvent, c);
+      }
+      if(typeof listeners == 'object'){
+          c.on(listeners);
+      }
+      return c;
+   }
+};
+
+Ext.apply(Ext.EventManager, function(){
+   var resizeEvent,
+       resizeTask,
+       textEvent,
+       textSize,
+       D = Ext.lib.Dom,
+       propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+       unload = Ext.EventManager._unload,
+       curWidth = 0,
+       curHeight = 0,
+       
+       
+       
+       useKeydown = Ext.isWebKit ?
+                   Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1]) >= 525 :
+                   !((Ext.isGecko && !Ext.isWindows) || Ext.isOpera);
+
+   return {
+       _unload: function(){
+           Ext.EventManager.un(window, "resize", this.fireWindowResize, this);
+           unload.call(Ext.EventManager);    
+       },
+       
+       
+       doResizeEvent: function(){
+           var h = D.getViewHeight(),
+               w = D.getViewWidth();
+
+            
+            if(curHeight != h || curWidth != w){
+               resizeEvent.fire(curWidth = w, curHeight = h);
+            }
+       },
+
+       
+       onWindowResize : function(fn, scope, options){
+           if(!resizeEvent){
+               resizeEvent = new Ext.util.Event();
+               resizeTask = new Ext.util.DelayedTask(this.doResizeEvent);
+               Ext.EventManager.on(window, "resize", this.fireWindowResize, this);
+           }
+           resizeEvent.addListener(fn, scope, options);
+       },
+
+       
+       fireWindowResize : function(){
+           if(resizeEvent){
+               resizeTask.delay(100);
+           }
+       },
+
+       
+       onTextResize : function(fn, scope, options){
+           if(!textEvent){
+               textEvent = new Ext.util.Event();
+               var textEl = new Ext.Element(document.createElement('div'));
+               textEl.dom.className = 'x-text-resize';
+               textEl.dom.innerHTML = 'X';
+               textEl.appendTo(document.body);
+               textSize = textEl.dom.offsetHeight;
+               setInterval(function(){
+                   if(textEl.dom.offsetHeight != textSize){
+                       textEvent.fire(textSize, textSize = textEl.dom.offsetHeight);
+                   }
+               }, this.textResizeInterval);
+           }
+           textEvent.addListener(fn, scope, options);
+       },
+
+       
+       removeResizeListener : function(fn, scope){
+           if(resizeEvent){
+               resizeEvent.removeListener(fn, scope);
+           }
+       },
+
+       
+       fireResize : function(){
+           if(resizeEvent){
+               resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
+           }
+       },
+
+        
+       textResizeInterval : 50,
+
+       
+       ieDeferSrc : false,
+       
+       
+       getKeyEvent : function(){
+           return useKeydown ? 'keydown' : 'keypress';
+       },
+
+       
+       
+       useKeydown: useKeydown
+   };
+}());
+
+Ext.EventManager.on = Ext.EventManager.addListener;
+
+
+Ext.apply(Ext.EventObjectImpl.prototype, {
+   
+   BACKSPACE: 8,
+   
+   TAB: 9,
+   
+   NUM_CENTER: 12,
+   
+   ENTER: 13,
+   
+   RETURN: 13,
+   
+   SHIFT: 16,
+   
+   CTRL: 17,
+   CONTROL : 17, 
+   
+   ALT: 18,
+   
+   PAUSE: 19,
+   
+   CAPS_LOCK: 20,
+   
+   ESC: 27,
+   
+   SPACE: 32,
+   
+   PAGE_UP: 33,
+   PAGEUP : 33, 
+   
+   PAGE_DOWN: 34,
+   PAGEDOWN : 34, 
+   
+   END: 35,
+   
+   HOME: 36,
+   
+   LEFT: 37,
+   
+   UP: 38,
+   
+   RIGHT: 39,
+   
+   DOWN: 40,
+   
+   PRINT_SCREEN: 44,
+   
+   INSERT: 45,
+   
+   DELETE: 46,
+   
+   ZERO: 48,
+   
+   ONE: 49,
+   
+   TWO: 50,
+   
+   THREE: 51,
+   
+   FOUR: 52,
+   
+   FIVE: 53,
+   
+   SIX: 54,
+   
+   SEVEN: 55,
+   
+   EIGHT: 56,
+   
+   NINE: 57,
+   
+   A: 65,
+   
+   B: 66,
+   
+   C: 67,
+   
+   D: 68,
+   
+   E: 69,
+   
+   F: 70,
+   
+   G: 71,
+   
+   H: 72,
+   
+   I: 73,
+   
+   J: 74,
+   
+   K: 75,
+   
+   L: 76,
+   
+   M: 77,
+   
+   N: 78,
+   
+   O: 79,
+   
+   P: 80,
+   
+   Q: 81,
+   
+   R: 82,
+   
+   S: 83,
+   
+   T: 84,
+   
+   U: 85,
+   
+   V: 86,
+   
+   W: 87,
+   
+   X: 88,
+   
+   Y: 89,
+   
+   Z: 90,
+   
+   CONTEXT_MENU: 93,
+   
+   NUM_ZERO: 96,
+   
+   NUM_ONE: 97,
+   
+   NUM_TWO: 98,
+   
+   NUM_THREE: 99,
+   
+   NUM_FOUR: 100,
+   
+   NUM_FIVE: 101,
+   
+   NUM_SIX: 102,
+   
+   NUM_SEVEN: 103,
+   
+   NUM_EIGHT: 104,
+   
+   NUM_NINE: 105,
+   
+   NUM_MULTIPLY: 106,
+   
+   NUM_PLUS: 107,
+   
+   NUM_MINUS: 109,
+   
+   NUM_PERIOD: 110,
+   
+   NUM_DIVISION: 111,
+   
+   F1: 112,
+   
+   F2: 113,
+   
+   F3: 114,
+   
+   F4: 115,
+   
+   F5: 116,
+   
+   F6: 117,
+   
+   F7: 118,
+   
+   F8: 119,
+   
+   F9: 120,
+   
+   F10: 121,
+   
+   F11: 122,
+   
+   F12: 123,
+
+   
+   isNavKeyPress : function(){
+       var me = this,
+           k = this.normalizeKey(me.keyCode);
+       return (k >= 33 && k <= 40) ||  
+       k == me.RETURN ||
+       k == me.TAB ||
+       k == me.ESC;
+   },
+
+   isSpecialKey : function(){
+       var k = this.normalizeKey(this.keyCode);
+       return (this.type == 'keypress' && this.ctrlKey) ||
+       this.isNavKeyPress() ||
+       (k == this.BACKSPACE) || 
+       (k >= 16 && k <= 20) || 
+       (k >= 44 && k <= 46);   
+   },
+
+   getPoint : function(){
+       return new Ext.lib.Point(this.xy[0], this.xy[1]);
+   },
+
+   
+   hasModifier : function(){
+       return ((this.ctrlKey || this.altKey) || this.shiftKey);
+   }
+});
+Ext.Element.addMethods({
+    
+    swallowEvent : function(eventName, preventDefault) {
+        var me = this;
+        function fn(e) {
+            e.stopPropagation();
+            if (preventDefault) {
+                e.preventDefault();
+            }
+        }
+        
+        if (Ext.isArray(eventName)) {
+            Ext.each(eventName, function(e) {
+                 me.on(e, fn);
+            });
+            return me;
+        }
+        me.on(eventName, fn);
+        return me;
+    },
+
+    
+    relayEvent : function(eventName, observable) {
+        this.on(eventName, function(e) {
+            observable.fireEvent(eventName, e);
+        });
+    },
+
+    
+    clean : function(forceReclean) {
+        var me  = this,
+            dom = me.dom,
+            n   = dom.firstChild,
+            ni  = -1;
+
+        if (Ext.Element.data(dom, 'isCleaned') && forceReclean !== true) {
+            return me;
+        }
+
+        while (n) {
+            var nx = n.nextSibling;
+            if (n.nodeType == 3 && !(/\S/.test(n.nodeValue))) {
+                dom.removeChild(n);
+            } else {
+                n.nodeIndex = ++ni;
+            }
+            n = nx;
+        }
+        
+        Ext.Element.data(dom, 'isCleaned', true);
+        return me;
+    },
+
+    
+    load : function() {
+        var updateManager = this.getUpdater();
+        updateManager.update.apply(updateManager, arguments);
+        
+        return this;
+    },
+
+    
+    getUpdater : function() {
+        return this.updateManager || (this.updateManager = new Ext.Updater(this));
+    },
+
+    
+    update : function(html, loadScripts, callback) {
+        if (!this.dom) {
+            return this;
+        }
+        html = html || "";
+
+        if (loadScripts !== true) {
+            this.dom.innerHTML = html;
+            if (typeof callback == 'function') {
+                callback();
+            }
+            return this;
+        }
+
+        var id  = Ext.id(),
+            dom = this.dom;
+
+        html += '<span id="' + id + '"></span>';
+
+        Ext.lib.Event.onAvailable(id, function() {
+            var DOC    = document,
+                hd     = DOC.getElementsByTagName("head")[0],
+                re     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+                srcRe  = /\ssrc=([\'\"])(.*?)\1/i,
+                typeRe = /\stype=([\'\"])(.*?)\1/i,
+                match,
+                attrs,
+                srcMatch,
+                typeMatch,
+                el,
+                s;
+
+            while ((match = re.exec(html))) {
+                attrs = match[1];
+                srcMatch = attrs ? attrs.match(srcRe) : false;
+                if (srcMatch && srcMatch[2]) {
+                   s = DOC.createElement("script");
+                   s.src = srcMatch[2];
+                   typeMatch = attrs.match(typeRe);
+                   if (typeMatch && typeMatch[2]) {
+                       s.type = typeMatch[2];
+                   }
+                   hd.appendChild(s);
+                } else if (match[2] && match[2].length > 0) {
+                    if (window.execScript) {
+                       window.execScript(match[2]);
+                    } else {
+                       window.eval(match[2]);
+                    }
+                }
+            }
+            
+            el = DOC.getElementById(id);
+            if (el) {
+                Ext.removeNode(el);
+            }
+            
+            if (typeof callback == 'function') {
+                callback();
+            }
+        });
+        dom.innerHTML = html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig, "");
+        return this;
+    },
+
+    
+    removeAllListeners : function() {
+        this.removeAnchor();
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    
+    createProxy : function(config, renderTo, matchBox) {
+        config = (typeof config == 'object') ? config : {tag : "div", cls: config};
+
+        var me = this,
+            proxy = renderTo ? Ext.DomHelper.append(renderTo, config, true) :
+                               Ext.DomHelper.insertBefore(me.dom, config, true);
+
+        if (matchBox && me.setBox && me.getBox) { 
+           proxy.setBox(me.getBox());
+        }
+        return proxy;
+    }
+});
+
+Ext.Element.prototype.getUpdateManager = Ext.Element.prototype.getUpdater;
+
+Ext.Element.addMethods({
+    
+    getAnchorXY : function(anchor, local, s){
+        
+        
+		anchor = (anchor || "tl").toLowerCase();
+        s = s || {};
+        
+        var me = this,        
+        	vp = me.dom == document.body || me.dom == document,
+        	w = s.width || vp ? Ext.lib.Dom.getViewWidth() : me.getWidth(),
+        	h = s.height || vp ? Ext.lib.Dom.getViewHeight() : me.getHeight(),         	        	
+        	xy,       	
+        	r = Math.round,
+        	o = me.getXY(),
+        	scroll = me.getScroll(),
+        	extraX = vp ? scroll.left : !local ? o[0] : 0,
+        	extraY = vp ? scroll.top : !local ? o[1] : 0,
+        	hash = {
+	        	c  : [r(w * 0.5), r(h * 0.5)],
+	        	t  : [r(w * 0.5), 0],
+	        	l  : [0, r(h * 0.5)],
+	        	r  : [w, r(h * 0.5)],
+	        	b  : [r(w * 0.5), h],
+	        	tl : [0, 0],	
+	        	bl : [0, h],
+	        	br : [w, h],
+	        	tr : [w, 0]
+        	};
+        
+        xy = hash[anchor];	
+        return [xy[0] + extraX, xy[1] + extraY]; 
+    },
+
+    
+    anchorTo : function(el, alignment, offsets, animate, monitorScroll, callback){        
+	    var me = this,
+            dom = me.dom,
+            scroll = !Ext.isEmpty(monitorScroll),
+            action = function(){
+                Ext.fly(dom).alignTo(el, alignment, offsets, animate);
+                Ext.callback(callback, Ext.fly(dom));
+            },
+            anchor = this.getAnchor();
+            
+        
+        this.removeAnchor();
+        Ext.apply(anchor, {
+            fn: action,
+            scroll: scroll
+        });
+
+        Ext.EventManager.onWindowResize(action, null);
+        
+        if(scroll){
+            Ext.EventManager.on(window, 'scroll', action, null,
+                {buffer: !isNaN(monitorScroll) ? monitorScroll : 50});
+        }
+        action.call(me); 
+        return me;
+    },
+    
+    
+    removeAnchor : function(){
+        var me = this,
+            anchor = this.getAnchor();
+            
+        if(anchor && anchor.fn){
+            Ext.EventManager.removeResizeListener(anchor.fn);
+            if(anchor.scroll){
+                Ext.EventManager.un(window, 'scroll', anchor.fn);
+            }
+            delete anchor.fn;
+        }
+        return me;
+    },
+    
+    
+    getAnchor : function(){
+        var data = Ext.Element.data,
+            dom = this.dom;
+            if (!dom) {
+                return;
+            }
+            var anchor = data(dom, '_anchor');
+            
+        if(!anchor){
+            anchor = data(dom, '_anchor', {});
+        }
+        return anchor;
+    },
+
+    
+    getAlignToXY : function(el, p, o){	    
+        el = Ext.get(el);
+        
+        if(!el || !el.dom){
+            throw "Element.alignToXY with an element that doesn't exist";
+        }
+        
+        o = o || [0,0];
+        p = (!p || p == "?" ? "tl-bl?" : (!(/-/).test(p) && p !== "" ? "tl-" + p : p || "tl-bl")).toLowerCase();       
+                
+        var me = this,
+        	d = me.dom,
+        	a1,
+        	a2,
+        	x,
+        	y,
+        	
+        	w,
+        	h,
+        	r,
+        	dw = Ext.lib.Dom.getViewWidth() -10, 
+        	dh = Ext.lib.Dom.getViewHeight()-10, 
+        	p1y,
+        	p1x,        	
+        	p2y,
+        	p2x,
+        	swapY,
+        	swapX,
+        	doc = document,
+        	docElement = doc.documentElement,
+        	docBody = doc.body,
+        	scrollX = (docElement.scrollLeft || docBody.scrollLeft || 0)+5,
+        	scrollY = (docElement.scrollTop || docBody.scrollTop || 0)+5,
+        	c = false, 
+        	p1 = "", 
+        	p2 = "",
+        	m = p.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+        
+        if(!m){
+           throw "Element.alignTo with an invalid alignment " + p;
+        }
+        
+        p1 = m[1]; 
+        p2 = m[2]; 
+        c = !!m[3];
+
+        
+        
+        a1 = me.getAnchorXY(p1, true);
+        a2 = el.getAnchorXY(p2, false);
+
+        x = a2[0] - a1[0] + o[0];
+        y = a2[1] - a1[1] + o[1];
+
+        if(c){    
+	       w = me.getWidth();
+           h = me.getHeight();
+           r = el.getRegion();       
+           
+           
+           
+           p1y = p1.charAt(0);
+           p1x = p1.charAt(p1.length-1);
+           p2y = p2.charAt(0);
+           p2x = p2.charAt(p2.length-1);
+           swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t"));
+           swapX = ((p1x=="r" && p2x=="l") || (p1x=="l" && p2x=="r"));          
+           
+
+           if (x + w > dw + scrollX) {
+                x = swapX ? r.left-w : dw+scrollX-w;
+           }
+           if (x < scrollX) {
+               x = swapX ? r.right : scrollX;
+           }
+           if (y + h > dh + scrollY) {
+                y = swapY ? r.top-h : dh+scrollY-h;
+            }
+           if (y < scrollY){
+               y = swapY ? r.bottom : scrollY;
+           }
+        }
+        return [x,y];
+    },
+
+    
+    alignTo : function(element, position, offsets, animate){
+	    var me = this;
+        return me.setXY(me.getAlignToXY(element, position, offsets),
+          		        me.preanim && !!animate ? me.preanim(arguments, 3) : false);
+    },
+    
+    
+    adjustForConstraints : function(xy, parent, offsets){
+        return this.getConstrainToXY(parent || document, false, offsets, xy) ||  xy;
+    },
+
+    
+    getConstrainToXY : function(el, local, offsets, proposedXY){   
+	    var os = {top:0, left:0, bottom:0, right: 0};
+
+        return function(el, local, offsets, proposedXY){
+            el = Ext.get(el);
+            offsets = offsets ? Ext.applyIf(offsets, os) : os;
+
+            var vw, vh, vx = 0, vy = 0;
+            if(el.dom == document.body || el.dom == document){
+                vw =Ext.lib.Dom.getViewWidth();
+                vh = Ext.lib.Dom.getViewHeight();
+            }else{
+                vw = el.dom.clientWidth;
+                vh = el.dom.clientHeight;
+                if(!local){
+                    var vxy = el.getXY();
+                    vx = vxy[0];
+                    vy = vxy[1];
+                }
+            }
+
+            var s = el.getScroll();
+
+            vx += offsets.left + s.left;
+            vy += offsets.top + s.top;
+
+            vw -= offsets.right;
+            vh -= offsets.bottom;
+
+            var vr = vx + vw,
+                vb = vy + vh,
+                xy = proposedXY || (!local ? this.getXY() : [this.getLeft(true), this.getTop(true)]),
+                x = xy[0], y = xy[1],
+                offset = this.getConstrainOffset(),
+                w = this.dom.offsetWidth + offset, 
+                h = this.dom.offsetHeight + offset;
+
+            
+            var moved = false;
+
+            
+            if((x + w) > vr){
+                x = vr - w;
+                moved = true;
+            }
+            if((y + h) > vb){
+                y = vb - h;
+                moved = true;
+            }
+            
+            if(x < vx){
+                x = vx;
+                moved = true;
+            }
+            if(y < vy){
+                y = vy;
+                moved = true;
+            }
+            return moved ? [x, y] : false;
+        };
+    }(),
+	    
+	    
+	        
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    
+    getConstrainOffset : function(){
+        return 0;
+    },
+    
+    
+    getCenterXY : function(){
+        return this.getAlignToXY(document, 'c-c');
+    },
+
+    
+    center : function(centerIn){
+        return this.alignTo(centerIn || document, 'c-c');        
+    }    
+});
+
+Ext.Element.addMethods({
+    
+    select : function(selector, unique){
+        return Ext.Element.select(selector, unique, this.dom);
+    }
+});
+Ext.apply(Ext.Element.prototype, function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {	
+		
+	    insertSibling: function(el, where, returnDom){
+	        var me = this,
+	        	rt,
+                isAfter = (where || 'before').toLowerCase() == 'after',
+                insertEl;
+	        	
+	        if(Ext.isArray(el)){
+                insertEl = me;
+	            Ext.each(el, function(e) {
+		            rt = Ext.fly(insertEl, '_internal').insertSibling(e, where, returnDom);
+                    if(isAfter){
+                        insertEl = rt;
+                    }
+	            });
+	            return rt;
+	        }
+	                
+	        el = el || {};
+	       	
+            if(el.nodeType || el.dom){
+                rt = me.dom.parentNode.insertBefore(GETDOM(el), isAfter ? me.dom.nextSibling : me.dom);
+                if (!returnDom) {
+                    rt = GET(rt);
+                }
+            }else{
+                if (isAfter && !me.dom.nextSibling) {
+                    rt = DH.append(me.dom.parentNode, el, !returnDom);
+                } else {                    
+                    rt = DH[isAfter ? 'insertAfter' : 'insertBefore'](me.dom, el, !returnDom);
+                }
+            }
+	        return rt;
+	    }
+    };
+}());
+
+
+Ext.Element.boxMarkup = '<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';
+
+Ext.Element.addMethods(function(){
+    var INTERNAL = "_internal",
+        pxMatch = /(\d+\.?\d+)px/;
+    return {
+        
+        applyStyles : function(style){
+            Ext.DomHelper.applyStyles(this.dom, style);
+            return this;
+        },
+
+        
+        getStyles : function(){
+            var ret = {};
+            Ext.each(arguments, function(v) {
+               ret[v] = this.getStyle(v);
+            },
+            this);
+            return ret;
+        },
+
+        
+        setOverflow : function(v){
+            var dom = this.dom;
+            if(v=='auto' && Ext.isMac && Ext.isGecko2){ 
+                dom.style.overflow = 'hidden';
+                (function(){dom.style.overflow = 'auto';}).defer(1);
+            }else{
+                dom.style.overflow = v;
+            }
+        },
+
+       
+        boxWrap : function(cls){
+            cls = cls || 'x-box';
+            var el = Ext.get(this.insertHtml("beforeBegin", "<div class='" + cls + "'>" + String.format(Ext.Element.boxMarkup, cls) + "</div>"));        
+            Ext.DomQuery.selectNode('.' + cls + '-mc', el.dom).appendChild(this.dom);
+            return el;
+        },
+
+        
+        setSize : function(width, height, animate){
+            var me = this;
+            if(typeof width == 'object'){ 
+                height = width.height;
+                width = width.width;
+            }
+            width = me.adjustWidth(width);
+            height = me.adjustHeight(height);
+            if(!animate || !me.anim){
+                me.dom.style.width = me.addUnits(width);
+                me.dom.style.height = me.addUnits(height);
+            }else{
+                me.anim({width: {to: width}, height: {to: height}}, me.preanim(arguments, 2));
+            }
+            return me;
+        },
+
+        
+        getComputedHeight : function(){
+            var me = this,
+                h = Math.max(me.dom.offsetHeight, me.dom.clientHeight);
+            if(!h){
+                h = parseFloat(me.getStyle('height')) || 0;
+                if(!me.isBorderBox()){
+                    h += me.getFrameWidth('tb');
+                }
+            }
+            return h;
+        },
+
+        
+        getComputedWidth : function(){
+            var w = Math.max(this.dom.offsetWidth, this.dom.clientWidth);
+            if(!w){
+                w = parseFloat(this.getStyle('width')) || 0;
+                if(!this.isBorderBox()){
+                    w += this.getFrameWidth('lr');
+                }
+            }
+            return w;
+        },
+
+        
+        getFrameWidth : function(sides, onlyContentBox){
+            return onlyContentBox && this.isBorderBox() ? 0 : (this.getPadding(sides) + this.getBorderWidth(sides));
+        },
+
+        
+        addClassOnOver : function(className){
+            this.hover(
+                function(){
+                    Ext.fly(this, INTERNAL).addClass(className);
+                },
+                function(){
+                    Ext.fly(this, INTERNAL).removeClass(className);
+                }
+            );
+            return this;
+        },
+
+        
+        addClassOnFocus : function(className){
+            this.on("focus", function(){
+                Ext.fly(this, INTERNAL).addClass(className);
+            }, this.dom);
+            this.on("blur", function(){
+                Ext.fly(this, INTERNAL).removeClass(className);
+            }, this.dom);
+            return this;
+        },
+
+        
+        addClassOnClick : function(className){
+            var dom = this.dom;
+            this.on("mousedown", function(){
+                Ext.fly(dom, INTERNAL).addClass(className);
+                var d = Ext.getDoc(),
+                    fn = function(){
+                        Ext.fly(dom, INTERNAL).removeClass(className);
+                        d.removeListener("mouseup", fn);
+                    };
+                d.on("mouseup", fn);
+            });
+            return this;
+        },
+
+        
+
+        getViewSize : function(){
+            var doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body);
+
+            
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+
+            
+            } else {
+                return {
+                    width : d.clientWidth,
+                    height : d.clientHeight
+                };
+            }
+        },
+
+        
+
+        getStyleSize : function(){
+            var me = this,
+                w, h,
+                doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body),
+                s = d.style;
+
+            
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+            }
+            
+            if(s.width && s.width != 'auto'){
+                w = parseFloat(s.width);
+                if(me.isBorderBox()){
+                   w -= me.getFrameWidth('lr');
+                }
+            }
+            
+            if(s.height && s.height != 'auto'){
+                h = parseFloat(s.height);
+                if(me.isBorderBox()){
+                   h -= me.getFrameWidth('tb');
+                }
+            }
+            
+            return {width: w || me.getWidth(true), height: h || me.getHeight(true)};
+        },
+
+        
+        getSize : function(contentSize){
+            return {width: this.getWidth(contentSize), height: this.getHeight(contentSize)};
+        },
+
+        
+        repaint : function(){
+            var dom = this.dom;
+            this.addClass("x-repaint");
+            setTimeout(function(){
+                Ext.fly(dom).removeClass("x-repaint");
+            }, 1);
+            return this;
+        },
+
+        
+        unselectable : function(){
+            this.dom.unselectable = "on";
+            return this.swallowEvent("selectstart", true).
+                        applyStyles("-moz-user-select:none;-khtml-user-select:none;").
+                        addClass("x-unselectable");
+        },
+
+        
+        getMargins : function(side){
+            var me = this,
+                key,
+                hash = {t:"top", l:"left", r:"right", b: "bottom"},
+                o = {};
+
+            if (!side) {
+                for (key in me.margins){
+                    o[hash[key]] = parseFloat(me.getStyle(me.margins[key])) || 0;
+                }
+                return o;
+            } else {
+                return me.addStyles.call(me, side, me.margins);
+            }
+        }
+    };
+}());
+
+Ext.Element.addMethods({
+    
+    setBox : function(box, adjust, animate){
+        var me = this,
+        	w = box.width, 
+        	h = box.height;
+        if((adjust && !me.autoBoxAdjust) && !me.isBorderBox()){
+           w -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+           h -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+        }
+        me.setBounds(box.x, box.y, w, h, me.animTest.call(me, arguments, animate, 2));
+        return me;
+    },
+
+    
+	getBox : function(contentBox, local) {	    
+	    var me = this,
+        	xy,
+        	left,
+        	top,
+        	getBorderWidth = me.getBorderWidth,
+        	getPadding = me.getPadding, 
+        	l,
+        	r,
+        	t,
+        	b;
+        if(!local){
+            xy = me.getXY();
+        }else{
+            left = parseInt(me.getStyle("left"), 10) || 0;
+            top = parseInt(me.getStyle("top"), 10) || 0;
+            xy = [left, top];
+        }
+        var el = me.dom, w = el.offsetWidth, h = el.offsetHeight, bx;
+        if(!contentBox){
+            bx = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: w, height: h};
+        }else{
+            l = getBorderWidth.call(me, "l") + getPadding.call(me, "l");
+            r = getBorderWidth.call(me, "r") + getPadding.call(me, "r");
+            t = getBorderWidth.call(me, "t") + getPadding.call(me, "t");
+            b = getBorderWidth.call(me, "b") + getPadding.call(me, "b");
+            bx = {x: xy[0]+l, y: xy[1]+t, 0: xy[0]+l, 1: xy[1]+t, width: w-(l+r), height: h-(t+b)};
+        }
+        bx.right = bx.x + bx.width;
+        bx.bottom = bx.y + bx.height;
+        return bx;
+	},
+	
+    
+     move : function(direction, distance, animate){
+        var me = this,        	
+        	xy = me.getXY(),
+        	x = xy[0],
+        	y = xy[1],        	
+        	left = [x - distance, y],
+        	right = [x + distance, y],
+        	top = [x, y - distance],
+        	bottom = [x, y + distance],
+	       	hash = {
+	        	l :	left,
+	        	left : left,
+	        	r : right,
+	        	right : right,
+	        	t : top,
+	        	top : top,
+	        	up : top,
+	        	b : bottom, 
+	        	bottom : bottom,
+	        	down : bottom	        		
+	        };
+        
+ 	    direction = direction.toLowerCase();    
+ 	    me.moveTo(hash[direction][0], hash[direction][1], me.animTest.call(me, arguments, animate, 2));
+    },
+    
+    
+     setLeftTop : function(left, top){
+	    var me = this,
+	    	style = me.dom.style;
+        style.left = me.addUnits(left);
+        style.top = me.addUnits(top);
+        return me;
+    },
+    
+    
+    getRegion : function(){
+        return Ext.lib.Dom.getRegion(this.dom);
+    },
+    
+    
+    setBounds : function(x, y, width, height, animate){
+	    var me = this;
+        if (!animate || !me.anim) {
+            me.setSize(width, height);
+            me.setLocation(x, y);
+        } else {
+            me.anim({points: {to: [x, y]}, 
+            		 width: {to: me.adjustWidth(width)}, 
+            		 height: {to: me.adjustHeight(height)}},
+                     me.preanim(arguments, 4), 
+                     'motion');
+        }
+        return me;
+    },
+
+    
+    setRegion : function(region, animate) {
+        return this.setBounds(region.left, region.top, region.right-region.left, region.bottom-region.top, this.animTest.call(this, arguments, animate, 1));
+    }
+});
+Ext.Element.addMethods({
+    
+    scrollTo : function(side, value, animate) {
+        
+        var top = /top/i.test(side),
+            me = this,
+            dom = me.dom,
+            prop;
+        if (!animate || !me.anim) {
+            
+            prop = 'scroll' + (top ? 'Top' : 'Left');
+            dom[prop] = value;
+        }
+        else {
+            
+            prop = 'scroll' + (top ? 'Left' : 'Top');
+            me.anim({scroll: {to: top ? [dom[prop], value] : [value, dom[prop]]}}, me.preanim(arguments, 2), 'scroll');
+        }
+        return me;
+    },
+    
+    
+    scrollIntoView : function(container, hscroll) {
+        var c = Ext.getDom(container) || Ext.getBody().dom,
+            el = this.dom,
+            o = this.getOffsetsTo(c),
+            l = o[0] + c.scrollLeft,
+            t = o[1] + c.scrollTop,
+            b = t + el.offsetHeight,
+            r = l + el.offsetWidth,
+            ch = c.clientHeight,
+            ct = parseInt(c.scrollTop, 10),
+            cl = parseInt(c.scrollLeft, 10),
+            cb = ct + ch,
+            cr = cl + c.clientWidth;
+
+        if (el.offsetHeight > ch || t < ct) {
+            c.scrollTop = t;
+        }
+        else if (b > cb) {
+            c.scrollTop = b-ch;
+        }
+        
+        c.scrollTop = c.scrollTop;
+
+        if (hscroll !== false) {
+            if (el.offsetWidth > c.clientWidth || l < cl) {
+                c.scrollLeft = l;
+            }
+            else if (r > cr) {
+                c.scrollLeft = r - c.clientWidth;
+            }
+            c.scrollLeft = c.scrollLeft;
+        }
+        return this;
+    },
+
+    
+    scrollChildIntoView : function(child, hscroll) {
+        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
+    },
+    
+    
+     scroll : function(direction, distance, animate) {
+        if (!this.isScrollable()) {
+            return false;
+        }
+        var el = this.dom,
+            l = el.scrollLeft, t = el.scrollTop,
+            w = el.scrollWidth, h = el.scrollHeight,
+            cw = el.clientWidth, ch = el.clientHeight,
+            scrolled = false, v,
+            hash = {
+                l: Math.min(l + distance, w-cw),
+                r: v = Math.max(l - distance, 0),
+                t: Math.max(t - distance, 0),
+                b: Math.min(t + distance, h-ch)
+            };
+            hash.d = hash.b;
+            hash.u = hash.t;
+        
+        direction = direction.substr(0, 1);
+        if ((v = hash[direction]) > -1) {
+            scrolled = true;
+            this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.preanim(arguments, 2));
+        }
+        return scrolled;
+    }
+});
+Ext.Element.addMethods(
+    function() {
+        var VISIBILITY      = "visibility",
+            DISPLAY         = "display",
+            HIDDEN          = "hidden",
+            NONE            = "none",
+            XMASKED         = "x-masked",
+            XMASKEDRELATIVE = "x-masked-relative",
+            data            = Ext.Element.data;
+
+        return {
+            
+            isVisible : function(deep) {
+                var vis = !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE),
+                    p   = this.dom.parentNode;
+                
+                if (deep !== true || !vis) {
+                    return vis;
+                }
+                
+                while (p && !(/^body/i.test(p.tagName))) {
+                    if (!Ext.fly(p, '_isVisible').isVisible()) {
+                        return false;
+                    }
+                    p = p.parentNode;
+                }
+                return true;
+            },
+
+            
+            isDisplayed : function() {
+                return !this.isStyle(DISPLAY, NONE);
+            },
+
+            
+            enableDisplayMode : function(display) {
+                this.setVisibilityMode(Ext.Element.DISPLAY);
+                
+                if (!Ext.isEmpty(display)) {
+                    data(this.dom, 'originalDisplay', display);
+                }
+                
+                return this;
+            },
+
+            
+            mask : function(msg, msgCls) {
+                var me  = this,
+                    dom = me.dom,
+                    dh  = Ext.DomHelper,
+                    EXTELMASKMSG = "ext-el-mask-msg",
+                    el,
+                    mask;
+
+                if (!/^body/i.test(dom.tagName) && me.getStyle('position') == 'static') {
+                    me.addClass(XMASKEDRELATIVE);
+                }
+                if (el = data(dom, 'maskMsg')) {
+                    el.remove();
+                }
+                if (el = data(dom, 'mask')) {
+                    el.remove();
+                }
+
+                mask = dh.append(dom, {cls : "ext-el-mask"}, true);
+                data(dom, 'mask', mask);
+
+                me.addClass(XMASKED);
+                mask.setDisplayed(true);
+                
+                if (typeof msg == 'string') {
+                    var mm = dh.append(dom, {cls : EXTELMASKMSG, cn:{tag:'div'}}, true);
+                    data(dom, 'maskMsg', mm);
+                    mm.dom.className = msgCls ? EXTELMASKMSG + " " + msgCls : EXTELMASKMSG;
+                    mm.dom.firstChild.innerHTML = msg;
+                    mm.setDisplayed(true);
+                    mm.center(me);
+                }
+                
+                
+                if (Ext.isIE && !(Ext.isIE7 && Ext.isStrict) && me.getStyle('height') == 'auto') {
+                    mask.setSize(undefined, me.getHeight());
+                }
+                
+                return mask;
+            },
+
+            
+            unmask : function() {
+                var me      = this,
+                    dom     = me.dom,
+                    mask    = data(dom, 'mask'),
+                    maskMsg = data(dom, 'maskMsg');
+
+                if (mask) {
+                    if (maskMsg) {
+                        maskMsg.remove();
+                        data(dom, 'maskMsg', undefined);
+                    }
+                    
+                    mask.remove();
+                    data(dom, 'mask', undefined);
+                    me.removeClass([XMASKED, XMASKEDRELATIVE]);
+                }
+            },
+
+            
+            isMasked : function() {
+                var m = data(this.dom, 'mask');
+                return m && m.isVisible();
+            },
+
+            
+            createShim : function() {
+                var el = document.createElement('iframe'),
+                    shim;
+                
+                el.frameBorder = '0';
+                el.className = 'ext-shim';
+                el.src = Ext.SSL_SECURE_URL;
+                shim = Ext.get(this.dom.parentNode.insertBefore(el, this.dom));
+                shim.autoBoxAdjust = false;
+                return shim;
+            }
+        };
+    }()
+);
+Ext.Element.addMethods({
+    
+    addKeyListener : function(key, fn, scope){
+        var config;
+        if(typeof key != 'object' || Ext.isArray(key)){
+            config = {
+                key: key,
+                fn: fn,
+                scope: scope
+            };
+        }else{
+            config = {
+                key : key.key,
+                shift : key.shift,
+                ctrl : key.ctrl,
+                alt : key.alt,
+                fn: fn,
+                scope: scope
+            };
+        }
+        return new Ext.KeyMap(this, config);
+    },
+
+    
+    addKeyMap : function(config){
+        return new Ext.KeyMap(this, config);
+    }
+});
+
+
+
+Ext.CompositeElementLite.importElementMethods();
+Ext.apply(Ext.CompositeElementLite.prototype, {
+    addElements : function(els, root){
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }
+        var yels = this.elements;
+        Ext.each(els, function(e) {
+            yels.push(Ext.get(e));
+        });
+        return this;
+    },
+
+    
+    first : function(){
+        return this.item(0);
+    },
+
+    
+    last : function(){
+        return this.item(this.getCount()-1);
+    },
+
+    
+    contains : function(el){
+        return this.indexOf(el) != -1;
+    },
+
+    
+    removeElement : function(keys, removeDom){
+        var me = this,
+            els = this.elements,
+            el;
+        Ext.each(keys, function(val){
+            if ((el = (els[val] || els[val = me.indexOf(val)]))) {
+                if(removeDom){
+                    if(el.dom){
+                        el.remove();
+                    }else{
+                        Ext.removeNode(el);
+                    }
+                }
+                els.splice(val, 1);
+            }
+        });
+        return this;
+    }
+});
+
+Ext.CompositeElement = Ext.extend(Ext.CompositeElementLite, {
+    
+    constructor : function(els, root){
+        this.elements = [];
+        this.add(els, root);
+    },
+    
+    
+    getElement : function(el){
+        
+        return el;
+    },
+    
+    
+    transformElement : function(el){
+        return Ext.get(el);
+    }
+
+    
+
+    
+
+    
+});
+
+
+Ext.Element.select = function(selector, unique, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+
+    return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);
+};
+
+
+Ext.select = Ext.Element.select;
+Ext.UpdateManager = Ext.Updater = Ext.extend(Ext.util.Observable,
+function() {
+    var BEFOREUPDATE = "beforeupdate",
+        UPDATE = "update",
+        FAILURE = "failure";
+
+    
+    function processSuccess(response){
+        var me = this;
+        me.transaction = null;
+        if (response.argument.form && response.argument.reset) {
+            try { 
+                response.argument.form.reset();
+            } catch(e){}
+        }
+        if (me.loadScripts) {
+            me.renderer.render(me.el, response, me,
+               updateComplete.createDelegate(me, [response]));
+        } else {
+            me.renderer.render(me.el, response, me);
+            updateComplete.call(me, response);
+        }
+    }
+
+    
+    function updateComplete(response, type, success){
+        this.fireEvent(type || UPDATE, this.el, response);
+        if(Ext.isFunction(response.argument.callback)){
+            response.argument.callback.call(response.argument.scope, this.el, Ext.isEmpty(success) ? true : false, response, response.argument.options);
+        }
+    }
+
+    
+    function processFailure(response){
+        updateComplete.call(this, response, FAILURE, !!(this.transaction = null));
+    }
+
+    return {
+        constructor: function(el, forceNew){
+            var me = this;
+            el = Ext.get(el);
+            if(!forceNew && el.updateManager){
+                return el.updateManager;
+            }
+            
+            me.el = el;
+            
+            me.defaultUrl = null;
+
+            me.addEvents(
+                
+                BEFOREUPDATE,
+                
+                UPDATE,
+                
+                FAILURE
+            );
+
+            Ext.apply(me, Ext.Updater.defaults);
+            
+            
+            
+            
+            
+            
+
+            
+            me.transaction = null;
+            
+            me.refreshDelegate = me.refresh.createDelegate(me);
+            
+            me.updateDelegate = me.update.createDelegate(me);
+            
+            me.formUpdateDelegate = (me.formUpdate || function(){}).createDelegate(me);
+
+            
+            me.renderer = me.renderer || me.getDefaultRenderer();
+
+            Ext.Updater.superclass.constructor.call(me);
+        },
+
+        
+        setRenderer : function(renderer){
+            this.renderer = renderer;
+        },
+
+        
+        getRenderer : function(){
+           return this.renderer;
+        },
+
+        
+        getDefaultRenderer: function() {
+            return new Ext.Updater.BasicRenderer();
+        },
+
+        
+        setDefaultUrl : function(defaultUrl){
+            this.defaultUrl = defaultUrl;
+        },
+
+        
+        getEl : function(){
+            return this.el;
+        },
+
+        
+        update : function(url, params, callback, discardUrl){
+            var me = this,
+                cfg,
+                callerScope;
+
+            if(me.fireEvent(BEFOREUPDATE, me.el, url, params) !== false){
+                if(Ext.isObject(url)){ 
+                    cfg = url;
+                    url = cfg.url;
+                    params = params || cfg.params;
+                    callback = callback || cfg.callback;
+                    discardUrl = discardUrl || cfg.discardUrl;
+                    callerScope = cfg.scope;
+                    if(!Ext.isEmpty(cfg.nocache)){me.disableCaching = cfg.nocache;};
+                    if(!Ext.isEmpty(cfg.text)){me.indicatorText = '<div class="loading-indicator">'+cfg.text+"</div>";};
+                    if(!Ext.isEmpty(cfg.scripts)){me.loadScripts = cfg.scripts;};
+                    if(!Ext.isEmpty(cfg.timeout)){me.timeout = cfg.timeout;};
+                }
+                me.showLoading();
+
+                if(!discardUrl){
+                    me.defaultUrl = url;
+                }
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+
+                var o = Ext.apply({}, {
+                    url : url,
+                    params: (Ext.isFunction(params) && callerScope) ? params.createDelegate(callerScope) : params,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    callback: undefined,
+                    timeout: (me.timeout*1000),
+                    disableCaching: me.disableCaching,
+                    argument: {
+                        "options": cfg,
+                        "url": url,
+                        "form": null,
+                        "callback": callback,
+                        "scope": callerScope || window,
+                        "params": params
+                    }
+                }, cfg);
+
+                me.transaction = Ext.Ajax.request(o);
+            }
+        },
+
+        
+        formUpdate : function(form, url, reset, callback){
+            var me = this;
+            if(me.fireEvent(BEFOREUPDATE, me.el, form, url) !== false){
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+                form = Ext.getDom(form);
+                me.transaction = Ext.Ajax.request({
+                    form: form,
+                    url:url,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    timeout: (me.timeout*1000),
+                    argument: {
+                        "url": url,
+                        "form": form,
+                        "callback": callback,
+                        "reset": reset
+                    }
+                });
+                me.showLoading.defer(1, me);
+            }
+        },
+
+        
+        startAutoRefresh : function(interval, url, params, callback, refreshNow){
+            var me = this;
+            if(refreshNow){
+                me.update(url || me.defaultUrl, params, callback, true);
+            }
+            if(me.autoRefreshProcId){
+                clearInterval(me.autoRefreshProcId);
+            }
+            me.autoRefreshProcId = setInterval(me.update.createDelegate(me, [url || me.defaultUrl, params, callback, true]), interval * 1000);
+        },
+
+        
+        stopAutoRefresh : function(){
+            if(this.autoRefreshProcId){
+                clearInterval(this.autoRefreshProcId);
+                delete this.autoRefreshProcId;
+            }
+        },
+
+        
+        isAutoRefreshing : function(){
+           return !!this.autoRefreshProcId;
+        },
+
+        
+        showLoading : function(){
+            if(this.showLoadIndicator){
+                this.el.dom.innerHTML = this.indicatorText;
+            }
+        },
+
+        
+        abort : function(){
+            if(this.transaction){
+                Ext.Ajax.abort(this.transaction);
+            }
+        },
+
+        
+        isUpdating : function(){
+            return this.transaction ? Ext.Ajax.isLoading(this.transaction) : false;
+        },
+
+        
+        refresh : function(callback){
+            if(this.defaultUrl){
+                this.update(this.defaultUrl, null, callback, true);
+            }
+        }
+    };
+}());
+
+
+Ext.Updater.defaults = {
+   
+    timeout : 30,
+    
+    disableCaching : false,
+    
+    showLoadIndicator : true,
+    
+    indicatorText : '<div class="loading-indicator">Loading...</div>',
+     
+    loadScripts : false,
+    
+    sslBlankUrl : Ext.SSL_SECURE_URL
+};
+
+
+
+Ext.Updater.updateElement = function(el, url, params, options){
+    var um = Ext.get(el).getUpdater();
+    Ext.apply(um, options);
+    um.update(url, params, options ? options.callback : null);
+};
+
+
+Ext.Updater.BasicRenderer = function(){};
+
+Ext.Updater.BasicRenderer.prototype = {
+    
+     render : function(el, response, updateManager, callback){
+        el.update(response.responseText, updateManager.loadScripts, callback);
+    }
+};
+
+
+
+(function() {
+
+
+Date.useStrict = false;
+
+
+
+
+
+function xf(format) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return format.replace(/\{(\d+)\}/g, function(m, i) {
+        return args[i];
+    });
+}
+
+
+
+Date.formatCodeToRegex = function(character, currentGroup) {
+    
+    var p = Date.parseCodes[character];
+
+    if (p) {
+      p = typeof p == 'function'? p() : p;
+      Date.parseCodes[character] = p; 
+    }
+
+    return p ? Ext.applyIf({
+      c: p.c ? xf(p.c, currentGroup || "{0}") : p.c
+    }, p) : {
+        g:0,
+        c:null,
+        s:Ext.escapeRe(character) 
+    };
+};
+
+
+var $f = Date.formatCodeToRegex;
+
+Ext.apply(Date, {
+    
+    parseFunctions: {
+        "M$": function(input, strict) {
+            
+            
+            var re = new RegExp('\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/');
+            var r = (input || '').match(re);
+            return r? new Date(((r[1] || '') + r[2]) * 1) : null;
+        }
+    },
+    parseRegexes: [],
+
+    
+    formatFunctions: {
+        "M$": function() {
+            
+            return '\\/Date(' + this.getTime() + ')\\/';
+        }
+    },
+
+    y2kYear : 50,
+
+    
+    MILLI : "ms",
+
+    
+    SECOND : "s",
+
+    
+    MINUTE : "mi",
+
+    
+    HOUR : "h",
+
+    
+    DAY : "d",
+
+    
+    MONTH : "mo",
+
+    
+    YEAR : "y",
+
+    
+    defaults: {},
+
+    
+    dayNames : [
+        "Sunday",
+        "Monday",
+        "Tuesday",
+        "Wednesday",
+        "Thursday",
+        "Friday",
+        "Saturday"
+    ],
+
+    
+    monthNames : [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July",
+        "August",
+        "September",
+        "October",
+        "November",
+        "December"
+    ],
+
+    
+    monthNumbers : {
+        Jan:0,
+        Feb:1,
+        Mar:2,
+        Apr:3,
+        May:4,
+        Jun:5,
+        Jul:6,
+        Aug:7,
+        Sep:8,
+        Oct:9,
+        Nov:10,
+        Dec:11
+    },
+
+    
+    getShortMonthName : function(month) {
+        return Date.monthNames[month].substring(0, 3);
+    },
+
+    
+    getShortDayName : function(day) {
+        return Date.dayNames[day].substring(0, 3);
+    },
+
+    
+    getMonthNumber : function(name) {
+        
+        return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+    },
+    
+    
+    formatContainsHourInfo : (function(){
+        var stripEscapeRe = /(\\.)/g,
+            hourInfoRe = /([gGhHisucUOPZ]|M\$)/;
+        return function(format){
+            return hourInfoRe.test(format.replace(stripEscapeRe, ''));
+        };
+    })(),
+
+    
+    formatCodes : {
+        d: "String.leftPad(this.getDate(), 2, '0')",
+        D: "Date.getShortDayName(this.getDay())", 
+        j: "this.getDate()",
+        l: "Date.dayNames[this.getDay()]",
+        N: "(this.getDay() ? this.getDay() : 7)",
+        S: "this.getSuffix()",
+        w: "this.getDay()",
+        z: "this.getDayOfYear()",
+        W: "String.leftPad(this.getWeekOfYear(), 2, '0')",
+        F: "Date.monthNames[this.getMonth()]",
+        m: "String.leftPad(this.getMonth() + 1, 2, '0')",
+        M: "Date.getShortMonthName(this.getMonth())", 
+        n: "(this.getMonth() + 1)",
+        t: "this.getDaysInMonth()",
+        L: "(this.isLeapYear() ? 1 : 0)",
+        o: "(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",
+        Y: "String.leftPad(this.getFullYear(), 4, '0')",
+        y: "('' + this.getFullYear()).substring(2, 4)",
+        a: "(this.getHours() < 12 ? 'am' : 'pm')",
+        A: "(this.getHours() < 12 ? 'AM' : 'PM')",
+        g: "((this.getHours() % 12) ? this.getHours() % 12 : 12)",
+        G: "this.getHours()",
+        h: "String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",
+        H: "String.leftPad(this.getHours(), 2, '0')",
+        i: "String.leftPad(this.getMinutes(), 2, '0')",
+        s: "String.leftPad(this.getSeconds(), 2, '0')",
+        u: "String.leftPad(this.getMilliseconds(), 3, '0')",
+        O: "this.getGMTOffset()",
+        P: "this.getGMTOffset(true)",
+        T: "this.getTimezone()",
+        Z: "(this.getTimezoneOffset() * -60)",
+
+        c: function() { 
+            for (var c = "Y-m-dTH:i:sP", code = [], i = 0, l = c.length; i < l; ++i) {
+                var e = c.charAt(i);
+                code.push(e == "T" ? "'T'" : Date.getFormatCode(e)); 
+            }
+            return code.join(" + ");
+        },
+        
+
+        U: "Math.round(this.getTime() / 1000)"
+    },
+
+    
+    isValid : function(y, m, d, h, i, s, ms) {
+        
+        h = h || 0;
+        i = i || 0;
+        s = s || 0;
+        ms = ms || 0;
+
+        
+        var dt = new Date(y < 100 ? 100 : y, m - 1, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);
+
+        return y == dt.getFullYear() &&
+            m == dt.getMonth() + 1 &&
+            d == dt.getDate() &&
+            h == dt.getHours() &&
+            i == dt.getMinutes() &&
+            s == dt.getSeconds() &&
+            ms == dt.getMilliseconds();
+    },
+
+    
+    parseDate : function(input, format, strict) {
+        var p = Date.parseFunctions;
+        if (p[format] == null) {
+            Date.createParser(format);
+        }
+        return p[format](input, Ext.isDefined(strict) ? strict : Date.useStrict);
+    },
+
+    
+    getFormatCode : function(character) {
+        var f = Date.formatCodes[character];
+
+        if (f) {
+          f = typeof f == 'function'? f() : f;
+          Date.formatCodes[character] = f; 
+        }
+
+        
+        return f || ("'" + String.escape(character) + "'");
+    },
+
+    
+    createFormat : function(format) {
+        var code = [],
+            special = false,
+            ch = '';
+
+        for (var i = 0; i < format.length; ++i) {
+            ch = format.charAt(i);
+            if (!special && ch == "\\") {
+                special = true;
+            } else if (special) {
+                special = false;
+                code.push("'" + String.escape(ch) + "'");
+            } else {
+                code.push(Date.getFormatCode(ch));
+            }
+        }
+        Date.formatFunctions[format] = new Function("return " + code.join('+'));
+    },
+
+    
+    createParser : function() {
+        var code = [
+            "var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,",
+                "def = Date.defaults,",
+                "results = String(input).match(Date.parseRegexes[{0}]);", 
+
+            "if(results){",
+                "{1}",
+
+                "if(u != null){", 
+                    "v = new Date(u * 1000);", 
+                "}else{",
+                    
+                    
+                    
+                    "dt = (new Date()).clearTime();",
+
+                    
+                    "y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));",
+                    "m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));",
+                    "d = Ext.num(d, Ext.num(def.d, dt.getDate()));",
+
+                    
+                    "h  = Ext.num(h, Ext.num(def.h, dt.getHours()));",
+                    "i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));",
+                    "s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));",
+                    "ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));",
+
+                    "if(z >= 0 && y >= 0){",
+                        
+                        
+
+                        
+                        
+                        "v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+
+                        
+                        "v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);",
+                    "}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){", 
+                        "v = null;", 
+                    "}else{",
+                        
+                        
+                        "v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+                    "}",
+                "}",
+            "}",
+
+            "if(v){",
+                
+                "if(zz != null){",
+                    
+                    "v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);",
+                "}else if(o){",
+                    
+                    "v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));",
+                "}",
+            "}",
+
+            "return v;"
+        ].join('\n');
+
+        return function(format) {
+            var regexNum = Date.parseRegexes.length,
+                currentGroup = 1,
+                calc = [],
+                regex = [],
+                special = false,
+                ch = "",
+                i = 0,
+                obj,
+                last;
+
+            for (; i < format.length; ++i) {
+                ch = format.charAt(i);
+                if (!special && ch == "\\") {
+                    special = true;
+                } else if (special) {
+                    special = false;
+                    regex.push(String.escape(ch));
+                } else {
+                    obj = $f(ch, currentGroup);
+                    currentGroup += obj.g;
+                    regex.push(obj.s);
+                    if (obj.g && obj.c) {
+                        if (obj.calcLast) {
+                            last = obj.c;
+                        } else {
+                            calc.push(obj.c);
+                        }
+                    }
+                }
+            }
+            
+            if (last) {
+                calc.push(last);
+            }
+
+            Date.parseRegexes[regexNum] = new RegExp("^" + regex.join('') + "$", 'i');
+            Date.parseFunctions[format] = new Function("input", "strict", xf(code, regexNum, calc.join('')));
+        };
+    }(),
+
+    
+    parseCodes : {
+        
+        d: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" 
+        },
+        j: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" 
+        },
+        D: function() {
+            for (var a = [], i = 0; i < 7; a.push(Date.getShortDayName(i)), ++i); 
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + a.join("|") +")"
+            };
+        },
+        l: function() {
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + Date.dayNames.join("|") + ")"
+            };
+        },
+        N: {
+            g:0,
+            c:null,
+            s:"[1-7]" 
+        },
+        S: {
+            g:0,
+            c:null,
+            s:"(?:st|nd|rd|th)"
+        },
+        w: {
+            g:0,
+            c:null,
+            s:"[0-6]" 
+        },
+        z: {
+            g:1,
+            c:"z = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,3})" 
+        },
+        W: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" 
+        },
+        F: function() {
+            return {
+                g:1,
+                c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n", 
+                s:"(" + Date.monthNames.join("|") + ")"
+            };
+        },
+        M: function() {
+            for (var a = [], i = 0; i < 12; a.push(Date.getShortMonthName(i)), ++i); 
+            return Ext.applyIf({
+                s:"(" + a.join("|") + ")"
+            }, $f("F"));
+        },
+        m: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{2})" 
+        },
+        n: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{1,2})" 
+        },
+        t: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" 
+        },
+        L: {
+            g:0,
+            c:null,
+            s:"(?:1|0)"
+        },
+        o: function() {
+            return $f("Y");
+        },
+        Y: {
+            g:1,
+            c:"y = parseInt(results[{0}], 10);\n",
+            s:"(\\d{4})" 
+        },
+        y: {
+            g:1,
+            c:"var ty = parseInt(results[{0}], 10);\n"
+                + "y = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n", 
+            s:"(\\d{1,2})"
+        },
+        
+        a: function(){
+            return $f("A");
+        },
+        A: {
+            
+            calcLast: true,
+            g:1,
+            c:"if (/(am)/i.test(results[{0}])) {\n"
+                + "if (!h || h == 12) { h = 0; }\n"
+                + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
+            s:"(AM|PM|am|pm)"
+        },
+        g: function() {
+            return $f("G");
+        },
+        G: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" 
+        },
+        h: function() {
+            return $f("H");
+        },
+        H: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" 
+        },
+        i: {
+            g:1,
+            c:"i = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" 
+        },
+        s: {
+            g:1,
+            c:"s = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" 
+        },
+        u: {
+            g:1,
+            c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",
+            s:"(\\d+)" 
+        },
+        O: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", 
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),", 
+                    "mn = o.substring(3,5) % 60;", 
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" 
+            ].join("\n"),
+            s: "([+\-]\\d{4})" 
+        },
+        P: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", 
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),", 
+                    "mn = o.substring(4,6) % 60;", 
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" 
+            ].join("\n"),
+            s: "([+\-]\\d{2}:\\d{2})" 
+        },
+        T: {
+            g:0,
+            c:null,
+            s:"[A-Z]{1,4}" 
+        },
+        Z: {
+            g:1,
+            c:"zz = results[{0}] * 1;\n" 
+                  + "zz = (-43200 <= zz && zz <= 50400)? zz : null;\n",
+            s:"([+\-]?\\d{1,5})" 
+        },
+        c: function() {
+            var calc = [],
+                arr = [
+                    $f("Y", 1), 
+                    $f("m", 2), 
+                    $f("d", 3), 
+                    $f("h", 4), 
+                    $f("i", 5), 
+                    $f("s", 6), 
+                    {c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"}, 
+                    {c:[ 
+                        "if(results[8]) {", 
+                            "if(results[8] == 'Z'){",
+                                "zz = 0;", 
+                            "}else if (results[8].indexOf(':') > -1){",
+                                $f("P", 8).c, 
+                            "}else{",
+                                $f("O", 8).c, 
+                            "}",
+                        "}"
+                    ].join('\n')}
+                ];
+
+            for (var i = 0, l = arr.length; i < l; ++i) {
+                calc.push(arr[i].c);
+            }
+
+            return {
+                g:1,
+                c:calc.join(""),
+                s:[
+                    arr[0].s, 
+                    "(?:", "-", arr[1].s, 
+                        "(?:", "-", arr[2].s, 
+                            "(?:",
+                                "(?:T| )?", 
+                                arr[3].s, ":", arr[4].s,  
+                                "(?::", arr[5].s, ")?", 
+                                "(?:(?:\\.|,)(\\d+))?", 
+                                "(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?", 
+                            ")?",
+                        ")?",
+                    ")?"
+                ].join("")
+            };
+        },
+        U: {
+            g:1,
+            c:"u = parseInt(results[{0}], 10);\n",
+            s:"(-?\\d+)" 
+        }
+    }
+});
+
+}());
+
+Ext.apply(Date.prototype, {
+    
+    dateFormat : function(format) {
+        if (Date.formatFunctions[format] == null) {
+            Date.createFormat(format);
+        }
+        return Date.formatFunctions[format].call(this);
+    },
+
+    
+    getTimezone : function() {
+        
+        
+        
+        
+        
+        
+        
+        
+        
+        
+        
+        
+        return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/, "$1$2").replace(/[^A-Z]/g, "");
+    },
+
+    
+    getGMTOffset : function(colon) {
+        return (this.getTimezoneOffset() > 0 ? "-" : "+")
+            + String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset()) / 60), 2, "0")
+            + (colon ? ":" : "")
+            + String.leftPad(Math.abs(this.getTimezoneOffset() % 60), 2, "0");
+    },
+
+    
+    getDayOfYear: function() {
+        var num = 0,
+            d = this.clone(),
+            m = this.getMonth(),
+            i;
+
+        for (i = 0, d.setDate(1), d.setMonth(0); i < m; d.setMonth(++i)) {
+            num += d.getDaysInMonth();
+        }
+        return num + this.getDate() - 1;
+    },
+
+    
+    getWeekOfYear : function() {
+        
+        var ms1d = 864e5, 
+            ms7d = 7 * ms1d; 
+
+        return function() { 
+            var DC3 = Date.UTC(this.getFullYear(), this.getMonth(), this.getDate() + 3) / ms1d, 
+                AWN = Math.floor(DC3 / 7), 
+                Wyr = new Date(AWN * ms7d).getUTCFullYear();
+
+            return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1;
+        };
+    }(),
+
+    
+    isLeapYear : function() {
+        var year = this.getFullYear();
+        return !!((year & 3) == 0 && (year % 100 || (year % 400 == 0 && year)));
+    },
+
+    
+    getFirstDayOfMonth : function() {
+        var day = (this.getDay() - (this.getDate() - 1)) % 7;
+        return (day < 0) ? (day + 7) : day;
+    },
+
+    
+    getLastDayOfMonth : function() {
+        return this.getLastDateOfMonth().getDay();
+    },
+
+
+    
+    getFirstDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), 1);
+    },
+
+    
+    getLastDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), this.getDaysInMonth());
+    },
+
+    
+    getDaysInMonth: function() {
+        var daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+
+        return function() { 
+            var m = this.getMonth();
+
+            return m == 1 && this.isLeapYear() ? 29 : daysInMonth[m];
+        };
+    }(),
+
+    
+    getSuffix : function() {
+        switch (this.getDate()) {
+            case 1:
+            case 21:
+            case 31:
+                return "st";
+            case 2:
+            case 22:
+                return "nd";
+            case 3:
+            case 23:
+                return "rd";
+            default:
+                return "th";
+        }
+    },
+
+    
+    clone : function() {
+        return new Date(this.getTime());
+    },
+
+    
+    isDST : function() {
+        
+        
+        return new Date(this.getFullYear(), 0, 1).getTimezoneOffset() != this.getTimezoneOffset();
+    },
+
+    
+    clearTime : function(clone) {
+        if (clone) {
+            return this.clone().clearTime();
+        }
+
+        
+        var d = this.getDate();
+
+        
+        this.setHours(0);
+        this.setMinutes(0);
+        this.setSeconds(0);
+        this.setMilliseconds(0);
+
+        if (this.getDate() != d) { 
+            
+            
+
+            
+            for (var hr = 1, c = this.add(Date.HOUR, hr); c.getDate() != d; hr++, c = this.add(Date.HOUR, hr));
+
+            this.setDate(d);
+            this.setHours(c.getHours());
+        }
+
+        return this;
+    },
+
+    
+    add : function(interval, value) {
+        var d = this.clone();
+        if (!interval || value === 0) return d;
+
+        switch(interval.toLowerCase()) {
+            case Date.MILLI:
+                d.setMilliseconds(this.getMilliseconds() + value);
+                break;
+            case Date.SECOND:
+                d.setSeconds(this.getSeconds() + value);
+                break;
+            case Date.MINUTE:
+                d.setMinutes(this.getMinutes() + value);
+                break;
+            case Date.HOUR:
+                d.setHours(this.getHours() + value);
+                break;
+            case Date.DAY:
+                d.setDate(this.getDate() + value);
+                break;
+            case Date.MONTH:
+                var day = this.getDate();
+                if (day > 28) {
+                    day = Math.min(day, this.getFirstDateOfMonth().add('mo', value).getLastDateOfMonth().getDate());
+                }
+                d.setDate(day);
+                d.setMonth(this.getMonth() + value);
+                break;
+            case Date.YEAR:
+                d.setFullYear(this.getFullYear() + value);
+                break;
+        }
+        return d;
+    },
+
+    
+    between : function(start, end) {
+        var t = this.getTime();
+        return start.getTime() <= t && t <= end.getTime();
+    }
+});
+
+
+
+Date.prototype.format = Date.prototype.dateFormat;
+
+
+
+if (Ext.isSafari && (navigator.userAgent.match(/WebKit\/(\d+)/)[1] || NaN) < 420) {
+    Ext.apply(Date.prototype, {
+        _xMonth : Date.prototype.setMonth,
+        _xDate  : Date.prototype.setDate,
+
+        
+        
+        setMonth : function(num) {
+            if (num <= -1) {
+                var n = Math.ceil(-num),
+                    back_year = Math.ceil(n / 12),
+                    month = (n % 12) ? 12 - n % 12 : 0;
+
+                this.setFullYear(this.getFullYear() - back_year);
+
+                return this._xMonth(month);
+            } else {
+                return this._xMonth(num);
+            }
+        },
+
+        
+        
+        
+        setDate : function(d) {
+            
+            
+            return this.setTime(this.getTime() - (this.getDate() - d) * 864e5);
+        }
+    });
+}
+
+
+
+
+
+Ext.util.MixedCollection = function(allowFunctions, keyFn){
+    this.items = [];
+    this.map = {};
+    this.keys = [];
+    this.length = 0;
+    this.addEvents(
+        
+        'clear',
+        
+        'add',
+        
+        'replace',
+        
+        'remove',
+        'sort'
+    );
+    this.allowFunctions = allowFunctions === true;
+    if(keyFn){
+        this.getKey = keyFn;
+    }
+    Ext.util.MixedCollection.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
+
+    
+    allowFunctions : false,
+
+    
+    add : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        if(typeof key != 'undefined' && key !== null){
+            var old = this.map[key];
+            if(typeof old != 'undefined'){
+                return this.replace(key, o);
+            }
+            this.map[key] = o;
+        }
+        this.length++;
+        this.items.push(o);
+        this.keys.push(key);
+        this.fireEvent('add', this.length-1, o, key);
+        return o;
+    },
+
+    
+    getKey : function(o){
+         return o.id;
+    },
+
+    
+    replace : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        var old = this.map[key];
+        if(typeof key == 'undefined' || key === null || typeof old == 'undefined'){
+             return this.add(key, o);
+        }
+        var index = this.indexOfKey(key);
+        this.items[index] = o;
+        this.map[key] = o;
+        this.fireEvent('replace', key, old, o);
+        return o;
+    },
+
+    
+    addAll : function(objs){
+        if(arguments.length > 1 || Ext.isArray(objs)){
+            var args = arguments.length > 1 ? arguments : objs;
+            for(var i = 0, len = args.length; i < len; i++){
+                this.add(args[i]);
+            }
+        }else{
+            for(var key in objs){
+                if(this.allowFunctions || typeof objs[key] != 'function'){
+                    this.add(key, objs[key]);
+                }
+            }
+        }
+    },
+
+    
+    each : function(fn, scope){
+        var items = [].concat(this.items); 
+        for(var i = 0, len = items.length; i < len; i++){
+            if(fn.call(scope || items[i], items[i], i, len) === false){
+                break;
+            }
+        }
+    },
+
+    
+    eachKey : function(fn, scope){
+        for(var i = 0, len = this.keys.length; i < len; i++){
+            fn.call(scope || window, this.keys[i], this.items[i], i, len);
+        }
+    },
+
+    
+    find : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            if(fn.call(scope || window, this.items[i], this.keys[i])){
+                return this.items[i];
+            }
+        }
+        return null;
+    },
+
+    
+    insert : function(index, key, o){
+        if(arguments.length == 2){
+            o = arguments[1];
+            key = this.getKey(o);
+        }
+        if(this.containsKey(key)){
+            this.suspendEvents();
+            this.removeKey(key);
+            this.resumeEvents();
+        }
+        if(index >= this.length){
+            return this.add(key, o);
+        }
+        this.length++;
+        this.items.splice(index, 0, o);
+        if(typeof key != 'undefined' && key !== null){
+            this.map[key] = o;
+        }
+        this.keys.splice(index, 0, key);
+        this.fireEvent('add', index, o, key);
+        return o;
+    },
+
+    
+    remove : function(o){
+        return this.removeAt(this.indexOf(o));
+    },
+
+    
+    removeAt : function(index){
+        if(index < this.length && index >= 0){
+            this.length--;
+            var o = this.items[index];
+            this.items.splice(index, 1);
+            var key = this.keys[index];
+            if(typeof key != 'undefined'){
+                delete this.map[key];
+            }
+            this.keys.splice(index, 1);
+            this.fireEvent('remove', o, key);
+            return o;
+        }
+        return false;
+    },
+
+    
+    removeKey : function(key){
+        return this.removeAt(this.indexOfKey(key));
+    },
+
+    
+    getCount : function(){
+        return this.length;
+    },
+
+    
+    indexOf : function(o){
+        return this.items.indexOf(o);
+    },
+
+    
+    indexOfKey : function(key){
+        return this.keys.indexOf(key);
+    },
+
+    
+    item : function(key){
+        var mk = this.map[key],
+            item = mk !== undefined ? mk : (typeof key == 'number') ? this.items[key] : undefined;
+        return typeof item != 'function' || this.allowFunctions ? item : null; 
+    },
+
+    
+    itemAt : function(index){
+        return this.items[index];
+    },
+
+    
+    key : function(key){
+        return this.map[key];
+    },
+
+    
+    contains : function(o){
+        return this.indexOf(o) != -1;
+    },
+
+    
+    containsKey : function(key){
+        return typeof this.map[key] != 'undefined';
+    },
+
+    
+    clear : function(){
+        this.length = 0;
+        this.items = [];
+        this.keys = [];
+        this.map = {};
+        this.fireEvent('clear');
+    },
+
+    
+    first : function(){
+        return this.items[0];
+    },
+
+    
+    last : function(){
+        return this.items[this.length-1];
+    },
+
+    
+    _sort : function(property, dir, fn){
+        var i, len,
+            dsc   = String(dir).toUpperCase() == 'DESC' ? -1 : 1,
+
+            
+            c     = [],
+            keys  = this.keys,
+            items = this.items;
+
+        
+        fn = fn || function(a, b) {
+            return a - b;
+        };
+
+        
+        for(i = 0, len = items.length; i < len; i++){
+            c[c.length] = {
+                key  : keys[i],
+                value: items[i],
+                index: i
+            };
+        }
+
+        
+        c.sort(function(a, b){
+            var v = fn(a[property], b[property]) * dsc;
+            if(v === 0){
+                v = (a.index < b.index ? -1 : 1);
+            }
+            return v;
+        });
+
+        
+        for(i = 0, len = c.length; i < len; i++){
+            items[i] = c[i].value;
+            keys[i]  = c[i].key;
+        }
+
+        this.fireEvent('sort', this);
+    },
+
+    
+    sort : function(dir, fn){
+        this._sort('value', dir, fn);
+    },
+
+    
+    reorder: function(mapping) {
+        this.suspendEvents();
+
+        var items = this.items,
+            index = 0,
+            length = items.length,
+            order = [],
+            remaining = [],
+            oldIndex;
+
+        
+        for (oldIndex in mapping) {
+            order[mapping[oldIndex]] = items[oldIndex];
+        }
+
+        for (index = 0; index < length; index++) {
+            if (mapping[index] == undefined) {
+                remaining.push(items[index]);
+            }
+        }
+
+        for (index = 0; index < length; index++) {
+            if (order[index] == undefined) {
+                order[index] = remaining.shift();
+            }
+        }
+
+        this.clear();
+        this.addAll(order);
+
+        this.resumeEvents();
+        this.fireEvent('sort', this);
+    },
+
+    
+    keySort : function(dir, fn){
+        this._sort('key', dir, fn || function(a, b){
+            var v1 = String(a).toUpperCase(), v2 = String(b).toUpperCase();
+            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
+        });
+    },
+
+    
+    getRange : function(start, end){
+        var items = this.items;
+        if(items.length < 1){
+            return [];
+        }
+        start = start || 0;
+        end = Math.min(typeof end == 'undefined' ? this.length-1 : end, this.length-1);
+        var i, r = [];
+        if(start <= end){
+            for(i = start; i <= end; i++) {
+                r[r.length] = items[i];
+            }
+        }else{
+            for(i = start; i >= end; i--) {
+                r[r.length] = items[i];
+            }
+        }
+        return r;
+    },
+
+    
+    filter : function(property, value, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return this.clone();
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.filterBy(function(o){
+            return o && value.test(o[property]);
+        });
+    },
+
+    
+    filterBy : function(fn, scope){
+        var r = new Ext.util.MixedCollection();
+        r.getKey = this.getKey;
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                r.add(k[i], it[i]);
+            }
+        }
+        return r;
+    },
+
+    
+    findIndex : function(property, value, start, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return -1;
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.findIndexBy(function(o){
+            return o && value.test(o[property]);
+        }, null, start);
+    },
+
+    
+    findIndexBy : function(fn, scope, start){
+        var k = this.keys, it = this.items;
+        for(var i = (start||0), len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    
+    createValueMatcher : function(value, anyMatch, caseSensitive, exactMatch) {
+        if (!value.exec) { 
+            var er = Ext.escapeRe;
+            value = String(value);
+
+            if (anyMatch === true) {
+                value = er(value);
+            } else {
+                value = '^' + er(value);
+                if (exactMatch === true) {
+                    value += '$';
+                }
+            }
+            value = new RegExp(value, caseSensitive ? '' : 'i');
+         }
+         return value;
+    },
+
+    
+    clone : function(){
+        var r = new Ext.util.MixedCollection();
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            r.add(k[i], it[i]);
+        }
+        r.getKey = this.getKey;
+        return r;
+    }
+});
+
+Ext.util.MixedCollection.prototype.get = Ext.util.MixedCollection.prototype.item;
+
+Ext.AbstractManager = Ext.extend(Object, {
+    typeName: 'type',
+    
+    constructor: function(config) {
+        Ext.apply(this, config || {});
+        
+        
+        this.all = new Ext.util.MixedCollection();
+        
+        this.types = {};
+    },
+    
+    
+    get : function(id){
+        return this.all.get(id);
+    },
+    
+    
+    register: function(item) {
+        this.all.add(item);
+    },
+    
+    
+    unregister: function(item) {
+        this.all.remove(item);        
+    },
+    
+    
+    registerType : function(type, cls){
+        this.types[type] = cls;
+        cls[this.typeName] = type;
+    },
+    
+    
+    isRegistered : function(type){
+        return this.types[type] !== undefined;    
+    },
+    
+    
+    create: function(config, defaultType) {
+        var type        = config[this.typeName] || config.type || defaultType,
+            Constructor = this.types[type];
+        
+        if (Constructor == undefined) {
+            throw new Error(String.format("The '{0}' type has not been registered with this manager", type));
+        }
+        
+        return new Constructor(config);
+    },
+    
+    
+    onAvailable : function(id, fn, scope){
+        var all = this.all;
+        
+        all.on("add", function(index, o){
+            if (o.id == id) {
+                fn.call(scope || o, o);
+                all.un("add", fn, scope);
+            }
+        });
+    }
+});
+Ext.util.Format = function() {
+    var trimRe         = /^\s+|\s+$/g,
+        stripTagsRE    = /<\/?[^>]+>/gi,
+        stripScriptsRe = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+        nl2brRe        = /\r?\n/g;
+
+    return {
+        
+        ellipsis : function(value, len, word) {
+            if (value && value.length > len) {
+                if (word) {
+                    var vs    = value.substr(0, len - 2),
+                        index = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'));
+                    if (index == -1 || index < (len - 15)) {
+                        return value.substr(0, len - 3) + "...";
+                    } else {
+                        return vs.substr(0, index) + "...";
+                    }
+                } else {
+                    return value.substr(0, len - 3) + "...";
+                }
+            }
+            return value;
+        },
+
+        
+        undef : function(value) {
+            return value !== undefined ? value : "";
+        },
+
+        
+        defaultValue : function(value, defaultValue) {
+            return value !== undefined && value !== '' ? value : defaultValue;
+        },
+
+        
+        htmlEncode : function(value) {
+            return !value ? value : String(value).replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
+        },
+
+        
+        htmlDecode : function(value) {
+            return !value ? value : String(value).replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, '"').replace(/&amp;/g, "&");
+        },
+
+        
+        trim : function(value) {
+            return String(value).replace(trimRe, "");
+        },
+
+        
+        substr : function(value, start, length) {
+            return String(value).substr(start, length);
+        },
+
+        
+        lowercase : function(value) {
+            return String(value).toLowerCase();
+        },
+
+        
+        uppercase : function(value) {
+            return String(value).toUpperCase();
+        },
+
+        
+        capitalize : function(value) {
+            return !value ? value : value.charAt(0).toUpperCase() + value.substr(1).toLowerCase();
+        },
+
+        
+        call : function(value, fn) {
+            if (arguments.length > 2) {
+                var args = Array.prototype.slice.call(arguments, 2);
+                args.unshift(value);
+                return eval(fn).apply(window, args);
+            } else {
+                return eval(fn).call(window, value);
+            }
+        },
+
+        
+        usMoney : function(v) {
+            v = (Math.round((v-0)*100))/100;
+            v = (v == Math.floor(v)) ? v + ".00" : ((v*10 == Math.floor(v*10)) ? v + "0" : v);
+            v = String(v);
+            var ps = v.split('.'),
+                whole = ps[0],
+                sub = ps[1] ? '.'+ ps[1] : '.00',
+                r = /(\d+)(\d{3})/;
+            while (r.test(whole)) {
+                whole = whole.replace(r, '$1' + ',' + '$2');
+            }
+            v = whole + sub;
+            if (v.charAt(0) == '-') {
+                return '-$' + v.substr(1);
+            }
+            return "$" +  v;
+        },
+
+        
+        date : function(v, format) {
+            if (!v) {
+                return "";
+            }
+            if (!Ext.isDate(v)) {
+                v = new Date(Date.parse(v));
+            }
+            return v.dateFormat(format || "m/d/Y");
+        },
+
+        
+        dateRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.date(v, format);
+            };
+        },
+
+        
+        stripTags : function(v) {
+            return !v ? v : String(v).replace(stripTagsRE, "");
+        },
+
+        
+        stripScripts : function(v) {
+            return !v ? v : String(v).replace(stripScriptsRe, "");
+        },
+
+        
+        fileSize : function(size) {
+            if (size < 1024) {
+                return size + " bytes";
+            } else if (size < 1048576) {
+                return (Math.round(((size*10) / 1024))/10) + " KB";
+            } else {
+                return (Math.round(((size*10) / 1048576))/10) + " MB";
+            }
+        },
+
+        
+        math : function(){
+            var fns = {};
+            
+            return function(v, a){
+                if (!fns[a]) {
+                    fns[a] = new Function('v', 'return v ' + a + ';');
+                }
+                return fns[a](v);
+            };
+        }(),
+
+        
+        round : function(value, precision) {
+            var result = Number(value);
+            if (typeof precision == 'number') {
+                precision = Math.pow(10, precision);
+                result = Math.round(value * precision) / precision;
+            }
+            return result;
+        },
+
+        
+        number: function(v, format) {
+            if (!format) {
+                return v;
+            }
+            v = Ext.num(v, NaN);
+            if (isNaN(v)) {
+                return '';
+            }
+            var comma = ',',
+                dec   = '.',
+                i18n  = false,
+                neg   = v < 0;
+
+            v = Math.abs(v);
+            if (format.substr(format.length - 2) == '/i') {
+                format = format.substr(0, format.length - 2);
+                i18n   = true;
+                comma  = '.';
+                dec    = ',';
+            }
+
+            var hasComma = format.indexOf(comma) != -1,
+                psplit   = (i18n ? format.replace(/[^\d\,]/g, '') : format.replace(/[^\d\.]/g, '')).split(dec);
+
+            if (1 < psplit.length) {
+                v = v.toFixed(psplit[1].length);
+            } else if(2 < psplit.length) {
+                throw ('NumberFormatException: invalid format, formats should have no more than 1 period: ' + format);
+            } else {
+                v = v.toFixed(0);
+            }
+
+            var fnum = v.toString();
+
+            psplit = fnum.split('.');
+
+            if (hasComma) {
+                var cnum = psplit[0], 
+                    parr = [], 
+                    j    = cnum.length, 
+                    m    = Math.floor(j / 3),
+                    n    = cnum.length % 3 || 3,
+                    i;
+
+                for (i = 0; i < j; i += n) {
+                    if (i != 0) {
+                        n = 3;
+                    }
+                    
+                    parr[parr.length] = cnum.substr(i, n);
+                    m -= 1;
+                }
+                fnum = parr.join(comma);
+                if (psplit[1]) {
+                    fnum += dec + psplit[1];
+                }
+            } else {
+                if (psplit[1]) {
+                    fnum = psplit[0] + dec + psplit[1];
+                }
+            }
+
+            return (neg ? '-' : '') + format.replace(/[\d,?\.?]+/, fnum);
+        },
+
+        
+        numberRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.number(v, format);
+            };
+        },
+
+        
+        plural : function(v, s, p) {
+            return v +' ' + (v == 1 ? s : (p ? p : s+'s'));
+        },
+
+        
+        nl2br : function(v) {
+            return Ext.isEmpty(v) ? '' : v.replace(nl2brRe, '<br/>');
+        }
+    };
+}();
+
+Ext.XTemplate = function(){
+    Ext.XTemplate.superclass.constructor.apply(this, arguments);
+
+    var me = this,
+        s = me.html,
+        re = /<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,
+        nameRe = /^<tpl\b[^>]*?for="(.*?)"/,
+        ifRe = /^<tpl\b[^>]*?if="(.*?)"/,
+        execRe = /^<tpl\b[^>]*?exec="(.*?)"/,
+        m,
+        id = 0,
+        tpls = [],
+        VALUES = 'values',
+        PARENT = 'parent',
+        XINDEX = 'xindex',
+        XCOUNT = 'xcount',
+        RETURN = 'return ',
+        WITHVALUES = 'with(values){ ';
+
+    s = ['<tpl>', s, '</tpl>'].join('');
+
+    while((m = s.match(re))){
+        var m2 = m[0].match(nameRe),
+            m3 = m[0].match(ifRe),
+            m4 = m[0].match(execRe),
+            exp = null,
+            fn = null,
+            exec = null,
+            name = m2 && m2[1] ? m2[1] : '';
+
+       if (m3) {
+           exp = m3 && m3[1] ? m3[1] : null;
+           if(exp){
+               fn = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES + RETURN +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if (m4) {
+           exp = m4 && m4[1] ? m4[1] : null;
+           if(exp){
+               exec = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if(name){
+           switch(name){
+               case '.': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + VALUES + '; }'); break;
+               case '..': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + PARENT + '; }'); break;
+               default: name = new Function(VALUES, PARENT, WITHVALUES + RETURN + name + '; }');
+           }
+       }
+       tpls.push({
+            id: id,
+            target: name,
+            exec: exec,
+            test: fn,
+            body: m[1]||''
+        });
+       s = s.replace(m[0], '{xtpl'+ id + '}');
+       ++id;
+    }
+    for(var i = tpls.length-1; i >= 0; --i){
+        me.compileTpl(tpls[i]);
+    }
+    me.master = tpls[tpls.length-1];
+    me.tpls = tpls;
+};
+Ext.extend(Ext.XTemplate, Ext.Template, {
+    
+    re : /\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,
+    
+    codeRe : /\{\[((?:\\\]|.|\n)*?)\]\}/g,
+
+    
+    applySubTemplate : function(id, values, parent, xindex, xcount){
+        var me = this,
+            len,
+            t = me.tpls[id],
+            vs,
+            buf = [];
+        if ((t.test && !t.test.call(me, values, parent, xindex, xcount)) ||
+            (t.exec && t.exec.call(me, values, parent, xindex, xcount))) {
+            return '';
+        }
+        vs = t.target ? t.target.call(me, values, parent) : values;
+        len = vs.length;
+        parent = t.target ? values : parent;
+        if(t.target && Ext.isArray(vs)){
+            for(var i = 0, len = vs.length; i < len; i++){
+                buf[buf.length] = t.compiled.call(me, vs[i], parent, i+1, len);
+            }
+            return buf.join('');
+        }
+        return t.compiled.call(me, vs, parent, xindex, xcount);
+    },
+
+    
+    compileTpl : function(tpl){
+        var fm = Ext.util.Format,
+            useF = this.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args, math){
+            if(name.substr(0, 4) == 'xtpl'){
+                return "'"+ sep +'this.applySubTemplate('+name.substr(4)+', values, parent, xindex, xcount)'+sep+"'";
+            }
+            var v;
+            if(name === '.'){
+                v = 'values';
+            }else if(name === '#'){
+                v = 'xindex';
+            }else if(name.indexOf('.') != -1){
+                v = name;
+            }else{
+                v = "values['" + name + "']";
+            }
+            if(math){
+                v = '(' + v + math + ')';
+            }
+            if (format && useF) {
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            } else {
+                args= ''; format = "("+v+" === undefined ? '' : ";
+            }
+            return "'"+ sep + format + v + args + ")"+sep+"'";
+        }
+
+        function codeFn(m, code){
+            
+            return "'" + sep + '(' + code.replace(/\\'/g, "'") + ')' + sep + "'";
+        }
+
+        
+        if(Ext.isGecko){
+            body = "tpl.compiled = function(values, parent, xindex, xcount){ return '" +
+                   tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn) +
+                    "';};";
+        }else{
+            body = ["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];
+            body.push(tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return this;
+    },
+
+    
+    applyTemplate : function(values){
+        return this.master.compiled.call(this, values, {}, 1, 1);
+    },
+
+    
+    compile : function(){return this;}
+
+    
+    
+    
+
+});
+
+Ext.XTemplate.prototype.apply = Ext.XTemplate.prototype.applyTemplate;
+
+
+Ext.XTemplate.from = function(el){
+    el = Ext.getDom(el);
+    return new Ext.XTemplate(el.value || el.innerHTML);
+};
+
+Ext.util.CSS = function(){
+	var rules = null;
+   	var doc = document;
+
+    var camelRe = /(-[a-z])/gi;
+    var camelFn = function(m, a){ return a.charAt(1).toUpperCase(); };
+
+   return {
+   
+   createStyleSheet : function(cssText, id){
+       var ss;
+       var head = doc.getElementsByTagName("head")[0];
+       var rules = doc.createElement("style");
+       rules.setAttribute("type", "text/css");
+       if(id){
+           rules.setAttribute("id", id);
+       }
+       if(Ext.isIE){
+           head.appendChild(rules);
+           ss = rules.styleSheet;
+           ss.cssText = cssText;
+       }else{
+           try{
+                rules.appendChild(doc.createTextNode(cssText));
+           }catch(e){
+               rules.cssText = cssText;
+           }
+           head.appendChild(rules);
+           ss = rules.styleSheet ? rules.styleSheet : (rules.sheet || doc.styleSheets[doc.styleSheets.length-1]);
+       }
+       this.cacheStyleSheet(ss);
+       return ss;
+   },
+
+   
+   removeStyleSheet : function(id){
+       var existing = doc.getElementById(id);
+       if(existing){
+           existing.parentNode.removeChild(existing);
+       }
+   },
+
+   
+   swapStyleSheet : function(id, url){
+       this.removeStyleSheet(id);
+       var ss = doc.createElement("link");
+       ss.setAttribute("rel", "stylesheet");
+       ss.setAttribute("type", "text/css");
+       ss.setAttribute("id", id);
+       ss.setAttribute("href", url);
+       doc.getElementsByTagName("head")[0].appendChild(ss);
+   },
+   
+   
+   refreshCache : function(){
+       return this.getRules(true);
+   },
+
+   
+   cacheStyleSheet : function(ss){
+       if(!rules){
+           rules = {};
+       }
+       try{
+           var ssRules = ss.cssRules || ss.rules;
+           for(var j = ssRules.length-1; j >= 0; --j){
+               rules[ssRules[j].selectorText.toLowerCase()] = ssRules[j];
+           }
+       }catch(e){}
+   },
+   
+   
+   getRules : function(refreshCache){
+   		if(rules === null || refreshCache){
+   			rules = {};
+   			var ds = doc.styleSheets;
+   			for(var i =0, len = ds.length; i < len; i++){
+   			    try{
+    		        this.cacheStyleSheet(ds[i]);
+    		    }catch(e){} 
+	        }
+   		}
+   		return rules;
+   	},
+   	
+   	
+   getRule : function(selector, refreshCache){
+   		var rs = this.getRules(refreshCache);
+   		if(!Ext.isArray(selector)){
+   		    return rs[selector.toLowerCase()];
+   		}
+   		for(var i = 0; i < selector.length; i++){
+			if(rs[selector[i]]){
+				return rs[selector[i].toLowerCase()];
+			}
+		}
+		return null;
+   	},
+   	
+   	
+   	
+   updateRule : function(selector, property, value){
+   		if(!Ext.isArray(selector)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				rule.style[property.replace(camelRe, camelFn)] = value;
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.updateRule(selector[i], property, value)){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	}
+   };	
+}();
+Ext.util.ClickRepeater = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+        this.el.unselectable();
+
+        Ext.apply(this, config);
+
+        this.addEvents(
+        
+        "mousedown",
+        
+        "click",
+        
+        "mouseup"
+        );
+
+        if(!this.disabled){
+            this.disabled = true;
+            this.enable();
+        }
+
+        
+        if(this.handler){
+            this.on("click", this.handler,  this.scope || this);
+        }
+
+        Ext.util.ClickRepeater.superclass.constructor.call(this);        
+    },
+    
+    interval : 20,
+    delay: 250,
+    preventDefault : true,
+    stopDefault : false,
+    timer : 0,
+
+    
+    enable: function(){
+        if(this.disabled){
+            this.el.on('mousedown', this.handleMouseDown, this);
+            if (Ext.isIE){
+                this.el.on('dblclick', this.handleDblClick, this);
+            }
+            if(this.preventDefault || this.stopDefault){
+                this.el.on('click', this.eventOptions, this);
+            }
+        }
+        this.disabled = false;
+    },
+
+    
+    disable: function( force){
+        if(force || !this.disabled){
+            clearTimeout(this.timer);
+            if(this.pressClass){
+                this.el.removeClass(this.pressClass);
+            }
+            Ext.getDoc().un('mouseup', this.handleMouseUp, this);
+            this.el.removeAllListeners();
+        }
+        this.disabled = true;
+    },
+
+    
+    setDisabled: function(disabled){
+        this[disabled ? 'disable' : 'enable']();
+    },
+
+    eventOptions: function(e){
+        if(this.preventDefault){
+            e.preventDefault();
+        }
+        if(this.stopDefault){
+            e.stopEvent();
+        }
+    },
+
+    
+    destroy : function() {
+        this.disable(true);
+        Ext.destroy(this.el);
+        this.purgeListeners();
+    },
+
+    handleDblClick : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+    },
+
+    
+    handleMouseDown : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.mousedownTime = new Date();
+
+        Ext.getDoc().on("mouseup", this.handleMouseUp, this);
+        this.el.on("mouseout", this.handleMouseOut, this);
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+
+        
+        if (this.accelerate) {
+            this.delay = 400;
+        }
+        this.timer = this.click.defer(this.delay || this.interval, this, [e]);
+    },
+
+    
+    click : function(e){
+        this.fireEvent("click", this, e);
+        this.timer = this.click.defer(this.accelerate ?
+            this.easeOutExpo(this.mousedownTime.getElapsed(),
+                400,
+                -390,
+                12000) :
+            this.interval, this, [e]);
+    },
+
+    easeOutExpo : function (t, b, c, d) {
+        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+    },
+
+    
+    handleMouseOut : function(){
+        clearTimeout(this.timer);
+        if(this.pressClass){
+            this.el.removeClass(this.pressClass);
+        }
+        this.el.on("mouseover", this.handleMouseReturn, this);
+    },
+
+    
+    handleMouseReturn : function(){
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.click();
+    },
+
+    
+    handleMouseUp : function(e){
+        clearTimeout(this.timer);
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        this.el.un("mouseout", this.handleMouseOut, this);
+        Ext.getDoc().un("mouseup", this.handleMouseUp, this);
+        this.el.removeClass(this.pressClass);
+        this.fireEvent("mouseup", this, e);
+    }
+});
+Ext.KeyNav = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(!this.disabled){
+        this.disabled = true;
+        this.enable();
+    }
+};
+
+Ext.KeyNav.prototype = {
+    
+    disabled : false,
+    
+    defaultEventAction: "stopEvent",
+    
+    forceKeyDown : false,
+
+    
+    relay : function(e){
+        var k = e.getKey(),
+            h = this.keyToHandler[k];
+        if(h && this[h]){
+            if(this.doRelay(e, this[h], h) !== true){
+                e[this.defaultEventAction]();
+            }
+        }
+    },
+
+    
+    doRelay : function(e, h, hname){
+        return h.call(this.scope || this, e, hname);
+    },
+
+    
+    enter : false,
+    left : false,
+    right : false,
+    up : false,
+    down : false,
+    tab : false,
+    esc : false,
+    pageUp : false,
+    pageDown : false,
+    del : false,
+    home : false,
+    end : false,
+    space : false,
+
+    
+    keyToHandler : {
+        37 : "left",
+        39 : "right",
+        38 : "up",
+        40 : "down",
+        33 : "pageUp",
+        34 : "pageDown",
+        46 : "del",
+        36 : "home",
+        35 : "end",
+        13 : "enter",
+        27 : "esc",
+        9  : "tab",
+        32 : "space"
+    },
+    
+    stopKeyUp: function(e) {
+        var k = e.getKey();
+
+        if (k >= 37 && k <= 40) {
+            
+            
+            e.stopEvent();
+        }
+    },
+    
+    
+    destroy: function(){
+        this.disable();    
+    },
+
+	
+	enable: function() {
+        if (this.disabled) {
+            if (Ext.isSafari2) {
+                
+                this.el.on('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.on(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = false;
+        }
+    },
+
+	
+	disable: function() {
+        if (!this.disabled) {
+            if (Ext.isSafari2) {
+                
+                this.el.un('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.un(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = true;
+        }
+    },
+    
+    
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    },
+    
+    
+    isKeydown: function(){
+        return this.forceKeyDown || Ext.EventManager.useKeydown;
+    }
+};
+
+Ext.KeyMap = function(el, config, eventName){
+    this.el  = Ext.get(el);
+    this.eventName = eventName || "keydown";
+    this.bindings = [];
+    if(config){
+        this.addBinding(config);
+    }
+    this.enable();
+};
+
+Ext.KeyMap.prototype = {
+    
+    stopEvent : false,
+
+    
+	addBinding : function(config){
+        if(Ext.isArray(config)){
+            Ext.each(config, function(c){
+                this.addBinding(c);
+            }, this);
+            return;
+        }
+        var keyCode = config.key,
+            fn = config.fn || config.handler,
+            scope = config.scope;
+
+	if (config.stopEvent) {
+	    this.stopEvent = config.stopEvent;    
+	}	
+
+        if(typeof keyCode == "string"){
+            var ks = [];
+            var keyString = keyCode.toUpperCase();
+            for(var j = 0, len = keyString.length; j < len; j++){
+                ks.push(keyString.charCodeAt(j));
+            }
+            keyCode = ks;
+        }
+        var keyArray = Ext.isArray(keyCode);
+        
+        var handler = function(e){
+            if(this.checkModifiers(config, e)){
+                var k = e.getKey();
+                if(keyArray){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          if(this.stopEvent){
+                              e.stopEvent();
+                          }
+                          fn.call(scope || window, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        if(this.stopEvent){
+                           e.stopEvent();
+                        }
+                        fn.call(scope || window, k, e);
+                    }
+                }
+            }
+        };
+        this.bindings.push(handler);
+	},
+    
+    
+    checkModifiers: function(config, e){
+        var val, key, keys = ['shift', 'ctrl', 'alt'];
+        for (var i = 0, len = keys.length; i < len; ++i){
+            key = keys[i];
+            val = config[key];
+            if(!(val === undefined || (val === e[key + 'Key']))){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    
+    on : function(key, fn, scope){
+        var keyCode, shift, ctrl, alt;
+        if(typeof key == "object" && !Ext.isArray(key)){
+            keyCode = key.key;
+            shift = key.shift;
+            ctrl = key.ctrl;
+            alt = key.alt;
+        }else{
+            keyCode = key;
+        }
+        this.addBinding({
+            key: keyCode,
+            shift: shift,
+            ctrl: ctrl,
+            alt: alt,
+            fn: fn,
+            scope: scope
+        });
+    },
+
+    
+    handleKeyDown : function(e){
+	    if(this.enabled){ 
+    	    var b = this.bindings;
+    	    for(var i = 0, len = b.length; i < len; i++){
+    	        b[i].call(this, e);
+    	    }
+	    }
+	},
+
+	
+	isEnabled : function(){
+	    return this.enabled;
+	},
+
+	
+	enable: function(){
+		if(!this.enabled){
+		    this.el.on(this.eventName, this.handleKeyDown, this);
+		    this.enabled = true;
+		}
+	},
+
+	
+	disable: function(){
+		if(this.enabled){
+		    this.el.removeListener(this.eventName, this.handleKeyDown, this);
+		    this.enabled = false;
+		}
+	},
+    
+    
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    }
+};
+Ext.util.TextMetrics = function(){
+    var shared;
+    return {
+        
+        measure : function(el, text, fixedWidth){
+            if(!shared){
+                shared = Ext.util.TextMetrics.Instance(el, fixedWidth);
+            }
+            shared.bind(el);
+            shared.setFixedWidth(fixedWidth || 'auto');
+            return shared.getSize(text);
+        },
+
+        
+        createInstance : function(el, fixedWidth){
+            return Ext.util.TextMetrics.Instance(el, fixedWidth);
+        }
+    };
+}();
+
+Ext.util.TextMetrics.Instance = function(bindTo, fixedWidth){
+    var ml = new Ext.Element(document.createElement('div'));
+    document.body.appendChild(ml.dom);
+    ml.position('absolute');
+    ml.setLeftTop(-1000, -1000);
+    ml.hide();
+
+    if(fixedWidth){
+        ml.setWidth(fixedWidth);
+    }
+
+    var instance = {
+        
+        getSize : function(text){
+            ml.update(text);
+            var s = ml.getSize();
+            ml.update('');
+            return s;
+        },
+
+        
+        bind : function(el){
+            ml.setStyle(
+                Ext.fly(el).getStyles('font-size','font-style', 'font-weight', 'font-family','line-height', 'text-transform', 'letter-spacing')
+            );
+        },
+
+        
+        setFixedWidth : function(width){
+            ml.setWidth(width);
+        },
+
+        
+        getWidth : function(text){
+            ml.dom.style.width = 'auto';
+            return this.getSize(text).width;
+        },
+
+        
+        getHeight : function(text){
+            return this.getSize(text).height;
+        }
+    };
+
+    instance.bind(bindTo);
+
+    return instance;
+};
+
+Ext.Element.addMethods({
+    
+    getTextWidth : function(text, min, max){
+        return (Ext.util.TextMetrics.measure(this.dom, Ext.value(text, this.dom.innerHTML, true)).width).constrain(min || 0, max || 1000000);
+    }
+});
+
+Ext.util.Cookies = {
+    
+    set : function(name, value){
+        var argv = arguments;
+        var argc = arguments.length;
+        var expires = (argc > 2) ? argv[2] : null;
+        var path = (argc > 3) ? argv[3] : '/';
+        var domain = (argc > 4) ? argv[4] : null;
+        var secure = (argc > 5) ? argv[5] : false;
+        document.cookie = name + "=" + escape(value) + ((expires === null) ? "" : ("; expires=" + expires.toGMTString())) + ((path === null) ? "" : ("; path=" + path)) + ((domain === null) ? "" : ("; domain=" + domain)) + ((secure === true) ? "; secure" : "");
+    },
+
+    
+    get : function(name){
+        var arg = name + "=";
+        var alen = arg.length;
+        var clen = document.cookie.length;
+        var i = 0;
+        var j = 0;
+        while(i < clen){
+            j = i + alen;
+            if(document.cookie.substring(i, j) == arg){
+                return Ext.util.Cookies.getCookieVal(j);
+            }
+            i = document.cookie.indexOf(" ", i) + 1;
+            if(i === 0){
+                break;
+            }
+        }
+        return null;
+    },
+
+    
+    clear : function(name){
+        if(Ext.util.Cookies.get(name)){
+            document.cookie = name + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
+        }
+    },
+    
+    getCookieVal : function(offset){
+        var endstr = document.cookie.indexOf(";", offset);
+        if(endstr == -1){
+            endstr = document.cookie.length;
+        }
+        return unescape(document.cookie.substring(offset, endstr));
+    }
+};
+Ext.handleError = function(e) {
+    throw e;
+};
+
+
+Ext.Error = function(message) {
+    
+    this.message = (this.lang[message]) ? this.lang[message] : message;
+};
+
+Ext.Error.prototype = new Error();
+Ext.apply(Ext.Error.prototype, {
+    
+    lang: {},
+
+    name: 'Ext.Error',
+    
+    getName : function() {
+        return this.name;
+    },
+    
+    getMessage : function() {
+        return this.message;
+    },
+    
+    toJson : function() {
+        return Ext.encode(this);
+    }
+});
+
+Ext.ComponentMgr = function(){
+    var all = new Ext.util.MixedCollection();
+    var types = {};
+    var ptypes = {};
+
+    return {
+        
+        register : function(c){
+            all.add(c);
+        },
+
+        
+        unregister : function(c){
+            all.remove(c);
+        },
+
+        
+        get : function(id){
+            return all.get(id);
+        },
+
+        
+        onAvailable : function(id, fn, scope){
+            all.on("add", function(index, o){
+                if(o.id == id){
+                    fn.call(scope || o, o);
+                    all.un("add", fn, scope);
+                }
+            });
+        },
+
+        
+        all : all,
+        
+        
+        types : types,
+        
+        
+        ptypes: ptypes,
+        
+        
+        isRegistered : function(xtype){
+            return types[xtype] !== undefined;    
+        },
+        
+        
+        isPluginRegistered : function(ptype){
+            return ptypes[ptype] !== undefined;    
+        },        
+
+        
+        registerType : function(xtype, cls){
+            types[xtype] = cls;
+            cls.xtype = xtype;
+        },
+
+        
+        create : function(config, defaultType){
+            return config.render ? config : new types[config.xtype || defaultType](config);
+        },
+
+        
+        registerPlugin : function(ptype, cls){
+            ptypes[ptype] = cls;
+            cls.ptype = ptype;
+        },
+
+        
+        createPlugin : function(config, defaultType){
+            var PluginCls = ptypes[config.ptype || defaultType];
+            if (PluginCls.init) {
+                return PluginCls;                
+            } else {
+                return new PluginCls(config);
+            }            
+        }
+    };
+}();
+
+
+Ext.reg = Ext.ComponentMgr.registerType; 
+
+Ext.preg = Ext.ComponentMgr.registerPlugin;
+
+Ext.create = Ext.ComponentMgr.create;
+Ext.Component = function(config){
+    config = config || {};
+    if(config.initialConfig){
+        if(config.isAction){           
+            this.baseAction = config;
+        }
+        config = config.initialConfig; 
+    }else if(config.tagName || config.dom || Ext.isString(config)){ 
+        config = {applyTo: config, id: config.id || config};
+    }
+
+    
+    this.initialConfig = config;
+
+    Ext.apply(this, config);
+    this.addEvents(
+        
+        'added',
+        
+        'disable',
+        
+        'enable',
+        
+        'beforeshow',
+        
+        'show',
+        
+        'beforehide',
+        
+        'hide',
+        
+        'removed',
+        
+        'beforerender',
+        
+        'render',
+        
+        'afterrender',
+        
+        'beforedestroy',
+        
+        'destroy',
+        
+        'beforestaterestore',
+        
+        'staterestore',
+        
+        'beforestatesave',
+        
+        'statesave'
+    );
+    this.getId();
+    Ext.ComponentMgr.register(this);
+    Ext.Component.superclass.constructor.call(this);
+
+    if(this.baseAction){
+        this.baseAction.addComponent(this);
+    }
+
+    this.initComponent();
+
+    if(this.plugins){
+        if(Ext.isArray(this.plugins)){
+            for(var i = 0, len = this.plugins.length; i < len; i++){
+                this.plugins[i] = this.initPlugin(this.plugins[i]);
+            }
+        }else{
+            this.plugins = this.initPlugin(this.plugins);
+        }
+    }
+
+    if(this.stateful !== false){
+        this.initState();
+    }
+
+    if(this.applyTo){
+        this.applyToMarkup(this.applyTo);
+        delete this.applyTo;
+    }else if(this.renderTo){
+        this.render(this.renderTo);
+        delete this.renderTo;
+    }
+};
+
+
+Ext.Component.AUTO_ID = 1000;
+
+Ext.extend(Ext.Component, Ext.util.Observable, {
+    
+    
+    
+    
+    
+    
+    
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    disabled : false,
+    
+    hidden : false,
+    
+    
+    
+    
+    
+    
+    
+    autoEl : 'div',
+
+    
+    disabledClass : 'x-item-disabled',
+    
+    allowDomMove : true,
+    
+    autoShow : false,
+    
+    hideMode : 'display',
+    
+    hideParent : false,
+    
+    
+    
+    
+    
+    rendered : false,
+
+    
+    
+
+    
+
+    
+    tplWriteMode : 'overwrite',
+
+    
+    
+    
+    bubbleEvents: [],
+
+
+    
+    ctype : 'Ext.Component',
+
+    
+    actionMode : 'el',
+
+    
+    getActionEl : function(){
+        return this[this.actionMode];
+    },
+
+    initPlugin : function(p){
+        if(p.ptype && !Ext.isFunction(p.init)){
+            p = Ext.ComponentMgr.createPlugin(p);
+        }else if(Ext.isString(p)){
+            p = Ext.ComponentMgr.createPlugin({
+                ptype: p
+            });
+        }
+        p.init(this);
+        return p;
+    },
+
+    
+    initComponent : function(){
+        
+        if(this.listeners){
+            this.on(this.listeners);
+            delete this.listeners;
+        }
+        this.enableBubble(this.bubbleEvents);
+    },
+
+    
+    render : function(container, position){
+        if(!this.rendered && this.fireEvent('beforerender', this) !== false){
+            if(!container && this.el){
+                this.el = Ext.get(this.el);
+                container = this.el.dom.parentNode;
+                this.allowDomMove = false;
+            }
+            this.container = Ext.get(container);
+            if(this.ctCls){
+                this.container.addClass(this.ctCls);
+            }
+            this.rendered = true;
+            if(position !== undefined){
+                if(Ext.isNumber(position)){
+                    position = this.container.dom.childNodes[position];
+                }else{
+                    position = Ext.getDom(position);
+                }
+            }
+            this.onRender(this.container, position || null);
+            if(this.autoShow){
+                this.el.removeClass(['x-hidden','x-hide-' + this.hideMode]);
+            }
+            if(this.cls){
+                this.el.addClass(this.cls);
+                delete this.cls;
+            }
+            if(this.style){
+                this.el.applyStyles(this.style);
+                delete this.style;
+            }
+            if(this.overCls){
+                this.el.addClassOnOver(this.overCls);
+            }
+            this.fireEvent('render', this);
+
+
+            
+            
+            var contentTarget = this.getContentTarget();
+            if (this.html){
+                contentTarget.update(Ext.DomHelper.markup(this.html));
+                delete this.html;
+            }
+            if (this.contentEl){
+                var ce = Ext.getDom(this.contentEl);
+                Ext.fly(ce).removeClass(['x-hidden', 'x-hide-display']);
+                contentTarget.appendChild(ce);
+            }
+            if (this.tpl) {
+                if (!this.tpl.compile) {
+                    this.tpl = new Ext.XTemplate(this.tpl);
+                }
+                if (this.data) {
+                    this.tpl[this.tplWriteMode](contentTarget, this.data);
+                    delete this.data;
+                }
+            }
+            this.afterRender(this.container);
+
+
+            if(this.hidden){
+                
+                this.doHide();
+            }
+            if(this.disabled){
+                
+                this.disable(true);
+            }
+
+            if(this.stateful !== false){
+                this.initStateEvents();
+            }
+            this.fireEvent('afterrender', this);
+        }
+        return this;
+    },
+
+
+    
+    update: function(htmlOrData, loadScripts, cb) {
+        var contentTarget = this.getContentTarget();
+        if (this.tpl && typeof htmlOrData !== "string") {
+            this.tpl[this.tplWriteMode](contentTarget, htmlOrData || {});
+        } else {
+            var html = Ext.isObject(htmlOrData) ? Ext.DomHelper.markup(htmlOrData) : htmlOrData;
+            contentTarget.update(html, loadScripts, cb);
+        }
+    },
+
+
+    
+    onAdded : function(container, pos) {
+        this.ownerCt = container;
+        this.initRef();
+        this.fireEvent('added', this, container, pos);
+    },
+
+    
+    onRemoved : function() {
+        this.removeRef();
+        this.fireEvent('removed', this, this.ownerCt);
+        delete this.ownerCt;
+    },
+
+    
+    initRef : function() {
+        
+        if(this.ref && !this.refOwner){
+            var levels = this.ref.split('/'),
+                last = levels.length,
+                i = 0,
+                t = this;
+
+            while(t && i < last){
+                t = t.ownerCt;
+                ++i;
+            }
+            if(t){
+                t[this.refName = levels[--i]] = this;
+                
+                this.refOwner = t;
+            }
+        }
+    },
+
+    removeRef : function() {
+        if (this.refOwner && this.refName) {
+            delete this.refOwner[this.refName];
+            delete this.refOwner;
+        }
+    },
+
+    
+    initState : function(){
+        if(Ext.state.Manager){
+            var id = this.getStateId();
+            if(id){
+                var state = Ext.state.Manager.get(id);
+                if(state){
+                    if(this.fireEvent('beforestaterestore', this, state) !== false){
+                        this.applyState(Ext.apply({}, state));
+                        this.fireEvent('staterestore', this, state);
+                    }
+                }
+            }
+        }
+    },
+
+    
+    getStateId : function(){
+        return this.stateId || ((/^(ext-comp-|ext-gen)/).test(String(this.id)) ? null : this.id);
+    },
+
+    
+    initStateEvents : function(){
+        if(this.stateEvents){
+            for(var i = 0, e; e = this.stateEvents[i]; i++){
+                this.on(e, this.saveState, this, {delay:100});
+            }
+        }
+    },
+
+    
+    applyState : function(state){
+        if(state){
+            Ext.apply(this, state);
+        }
+    },
+
+    
+    getState : function(){
+        return null;
+    },
+
+    
+    saveState : function(){
+        if(Ext.state.Manager && this.stateful !== false){
+            var id = this.getStateId();
+            if(id){
+                var state = this.getState();
+                if(this.fireEvent('beforestatesave', this, state) !== false){
+                    Ext.state.Manager.set(id, state);
+                    this.fireEvent('statesave', this, state);
+                }
+            }
+        }
+    },
+
+    
+    applyToMarkup : function(el){
+        this.allowDomMove = false;
+        this.el = Ext.get(el);
+        this.render(this.el.dom.parentNode);
+    },
+
+    
+    addClass : function(cls){
+        if(this.el){
+            this.el.addClass(cls);
+        }else{
+            this.cls = this.cls ? this.cls + ' ' + cls : cls;
+        }
+        return this;
+    },
+
+    
+    removeClass : function(cls){
+        if(this.el){
+            this.el.removeClass(cls);
+        }else if(this.cls){
+            this.cls = this.cls.split(' ').remove(cls).join(' ');
+        }
+        return this;
+    },
+
+    
+    
+    onRender : function(ct, position){
+        if(!this.el && this.autoEl){
+            if(Ext.isString(this.autoEl)){
+                this.el = document.createElement(this.autoEl);
+            }else{
+                var div = document.createElement('div');
+                Ext.DomHelper.overwrite(div, this.autoEl);
+                this.el = div.firstChild;
+            }
+            if (!this.el.id) {
+                this.el.id = this.getId();
+            }
+        }
+        if(this.el){
+            this.el = Ext.get(this.el);
+            if(this.allowDomMove !== false){
+                ct.dom.insertBefore(this.el.dom, position);
+                if (div) {
+                    Ext.removeNode(div);
+                    div = null;
+                }
+            }
+        }
+    },
+
+    
+    getAutoCreate : function(){
+        var cfg = Ext.isObject(this.autoCreate) ?
+                      this.autoCreate : Ext.apply({}, this.defaultAutoCreate);
+        if(this.id && !cfg.id){
+            cfg.id = this.id;
+        }
+        return cfg;
+    },
+
+    
+    afterRender : Ext.emptyFn,
+
+    
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.fireEvent('beforedestroy', this) !== false){
+                this.destroying = true;
+                this.beforeDestroy();
+                if(this.ownerCt && this.ownerCt.remove){
+                    this.ownerCt.remove(this, false);
+                }
+                if(this.rendered){
+                    this.el.remove();
+                    if(this.actionMode == 'container' || this.removeMode == 'container'){
+                        this.container.remove();
+                    }
+                }
+                
+                if(this.focusTask && this.focusTask.cancel){
+                    this.focusTask.cancel();
+                }
+                this.onDestroy();
+                Ext.ComponentMgr.unregister(this);
+                this.fireEvent('destroy', this);
+                this.purgeListeners();
+                this.destroying = false;
+                this.isDestroyed = true;
+            }
+        }
+    },
+
+    deleteMembers : function(){
+        var args = arguments;
+        for(var i = 0, len = args.length; i < len; ++i){
+            delete this[args[i]];
+        }
+    },
+
+    
+    beforeDestroy : Ext.emptyFn,
+
+    
+    onDestroy  : Ext.emptyFn,
+
+    
+    getEl : function(){
+        return this.el;
+    },
+
+    
+    getContentTarget : function(){
+        return this.el;
+    },
+
+    
+    getId : function(){
+        return this.id || (this.id = 'ext-comp-' + (++Ext.Component.AUTO_ID));
+    },
+
+    
+    getItemId : function(){
+        return this.itemId || this.getId();
+    },
+
+    
+    focus : function(selectText, delay){
+        if(delay){
+            this.focusTask = new Ext.util.DelayedTask(this.focus, this, [selectText, false]);
+            this.focusTask.delay(Ext.isNumber(delay) ? delay : 10);
+            return this;
+        }
+        if(this.rendered && !this.isDestroyed){
+            this.el.focus();
+            if(selectText === true){
+                this.el.dom.select();
+            }
+        }
+        return this;
+    },
+
+    
+    blur : function(){
+        if(this.rendered){
+            this.el.blur();
+        }
+        return this;
+    },
+
+    
+    disable : function( silent){
+        if(this.rendered){
+            this.onDisable();
+        }
+        this.disabled = true;
+        if(silent !== true){
+            this.fireEvent('disable', this);
+        }
+        return this;
+    },
+
+    
+    onDisable : function(){
+        this.getActionEl().addClass(this.disabledClass);
+        this.el.dom.disabled = true;
+    },
+
+    
+    enable : function(){
+        if(this.rendered){
+            this.onEnable();
+        }
+        this.disabled = false;
+        this.fireEvent('enable', this);
+        return this;
+    },
+
+    
+    onEnable : function(){
+        this.getActionEl().removeClass(this.disabledClass);
+        this.el.dom.disabled = false;
+    },
+
+    
+    setDisabled : function(disabled){
+        return this[disabled ? 'disable' : 'enable']();
+    },
+
+    
+    show : function(){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.hidden = false;
+            if(this.autoRender){
+                this.render(Ext.isBoolean(this.autoRender) ? Ext.getBody() : this.autoRender);
+            }
+            if(this.rendered){
+                this.onShow();
+            }
+            this.fireEvent('show', this);
+        }
+        return this;
+    },
+
+    
+    onShow : function(){
+        this.getVisibilityEl().removeClass('x-hide-' + this.hideMode);
+    },
+
+    
+    hide : function(){
+        if(this.fireEvent('beforehide', this) !== false){
+            this.doHide();
+            this.fireEvent('hide', this);
+        }
+        return this;
+    },
+
+    
+    doHide: function(){
+        this.hidden = true;
+        if(this.rendered){
+            this.onHide();
+        }
+    },
+
+    
+    onHide : function(){
+        this.getVisibilityEl().addClass('x-hide-' + this.hideMode);
+    },
+
+    
+    getVisibilityEl : function(){
+        return this.hideParent ? this.container : this.getActionEl();
+    },
+
+    
+    setVisible : function(visible){
+        return this[visible ? 'show' : 'hide']();
+    },
+
+    
+    isVisible : function(){
+        return this.rendered && this.getVisibilityEl().isVisible();
+    },
+
+    
+    cloneConfig : function(overrides){
+        overrides = overrides || {};
+        var id = overrides.id || Ext.id();
+        var cfg = Ext.applyIf(overrides, this.initialConfig);
+        cfg.id = id; 
+        return new this.constructor(cfg);
+    },
+
+    
+    getXType : function(){
+        return this.constructor.xtype;
+    },
+
+    
+    isXType : function(xtype, shallow){
+        
+        if (Ext.isFunction(xtype)){
+            xtype = xtype.xtype; 
+        }else if (Ext.isObject(xtype)){
+            xtype = xtype.constructor.xtype; 
+        }
+
+        return !shallow ? ('/' + this.getXTypes() + '/').indexOf('/' + xtype + '/') != -1 : this.constructor.xtype == xtype;
+    },
+
+    
+    getXTypes : function(){
+        var tc = this.constructor;
+        if(!tc.xtypes){
+            var c = [], sc = this;
+            while(sc && sc.constructor.xtype){
+                c.unshift(sc.constructor.xtype);
+                sc = sc.constructor.superclass;
+            }
+            tc.xtypeChain = c;
+            tc.xtypes = c.join('/');
+        }
+        return tc.xtypes;
+    },
+
+    
+    findParentBy : function(fn) {
+        for (var p = this.ownerCt; (p != null) && !fn(p, this); p = p.ownerCt);
+        return p || null;
+    },
+
+    
+    findParentByType : function(xtype, shallow){
+        return this.findParentBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+    
+    
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.ownerCt;
+        }
+        return this;
+    },
+
+    
+    getPositionEl : function(){
+        return this.positionEl || this.el;
+    },
+
+    
+    purgeListeners : function(){
+        Ext.Component.superclass.purgeListeners.call(this);
+        if(this.mons){
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    
+    clearMons : function(){
+        Ext.each(this.mons, function(m){
+            m.item.un(m.ename, m.fn, m.scope);
+        }, this);
+        this.mons = [];
+    },
+
+    
+    createMons: function(){
+        if(!this.mons){
+            this.mons = [];
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    
+    mon : function(item, ename, fn, scope, opt){
+        this.createMons();
+        if(Ext.isObject(ename)){
+            var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
+
+            var o = ename;
+            for(var e in o){
+                if(propRe.test(e)){
+                    continue;
+                }
+                if(Ext.isFunction(o[e])){
+                    
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e], o.scope, o);
+                }else{
+                    
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e]);
+                }
+            }
+            return;
+        }
+
+        this.mons.push({
+            item: item, ename: ename, fn: fn, scope: scope
+        });
+        item.on(ename, fn, scope, opt);
+    },
+
+    
+    mun : function(item, ename, fn, scope){
+        var found, mon;
+        this.createMons();
+        for(var i = 0, len = this.mons.length; i < len; ++i){
+            mon = this.mons[i];
+            if(item === mon.item && ename == mon.ename && fn === mon.fn && scope === mon.scope){
+                this.mons.splice(i, 1);
+                item.un(ename, fn, scope);
+                found = true;
+                break;
+            }
+        }
+        return found;
+    },
+
+    
+    nextSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index != -1 && index+1 < this.ownerCt.items.getCount()){
+                return this.ownerCt.items.itemAt(index+1);
+            }
+        }
+        return null;
+    },
+
+    
+    previousSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index > 0){
+                return this.ownerCt.items.itemAt(index-1);
+            }
+        }
+        return null;
+    },
+
+    
+    getBubbleTarget : function(){
+        return this.ownerCt;
+    }
+});
+
+Ext.reg('component', Ext.Component);
+
+Ext.Action = Ext.extend(Object, {
+    
+    
+    
+    
+    
+    
+    
+
+    constructor : function(config){
+        this.initialConfig = config;
+        this.itemId = config.itemId = (config.itemId || config.id || Ext.id());
+        this.items = [];
+    },
+    
+    
+    isAction : true,
+
+    
+    setText : function(text){
+        this.initialConfig.text = text;
+        this.callEach('setText', [text]);
+    },
+
+    
+    getText : function(){
+        return this.initialConfig.text;
+    },
+
+    
+    setIconClass : function(cls){
+        this.initialConfig.iconCls = cls;
+        this.callEach('setIconClass', [cls]);
+    },
+
+    
+    getIconClass : function(){
+        return this.initialConfig.iconCls;
+    },
+
+    
+    setDisabled : function(v){
+        this.initialConfig.disabled = v;
+        this.callEach('setDisabled', [v]);
+    },
+
+    
+    enable : function(){
+        this.setDisabled(false);
+    },
+
+    
+    disable : function(){
+        this.setDisabled(true);
+    },
+
+    
+    isDisabled : function(){
+        return this.initialConfig.disabled;
+    },
+
+    
+    setHidden : function(v){
+        this.initialConfig.hidden = v;
+        this.callEach('setVisible', [!v]);
+    },
+
+    
+    show : function(){
+        this.setHidden(false);
+    },
+
+    
+    hide : function(){
+        this.setHidden(true);
+    },
+
+    
+    isHidden : function(){
+        return this.initialConfig.hidden;
+    },
+
+    
+    setHandler : function(fn, scope){
+        this.initialConfig.handler = fn;
+        this.initialConfig.scope = scope;
+        this.callEach('setHandler', [fn, scope]);
+    },
+
+    
+    each : function(fn, scope){
+        Ext.each(this.items, fn, scope);
+    },
+
+    
+    callEach : function(fnName, args){
+        var cs = this.items;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i][fnName].apply(cs[i], args);
+        }
+    },
+
+    
+    addComponent : function(comp){
+        this.items.push(comp);
+        comp.on('destroy', this.removeComponent, this);
+    },
+
+    
+    removeComponent : function(comp){
+        this.items.remove(comp);
+    },
+
+    
+    execute : function(){
+        this.initialConfig.handler.apply(this.initialConfig.scope || window, arguments);
+    }
+});
+
+(function(){
+Ext.Layer = function(config, existingEl){
+    config = config || {};
+    var dh = Ext.DomHelper,
+        cp = config.parentEl, pel = cp ? Ext.getDom(cp) : document.body;
+        
+    if (existingEl) {
+        this.dom = Ext.getDom(existingEl);
+    }
+    if(!this.dom){
+        var o = config.dh || {tag: 'div', cls: 'x-layer'};
+        this.dom = dh.append(pel, o);
+    }
+    if(config.cls){
+        this.addClass(config.cls);
+    }
+    this.constrain = config.constrain !== false;
+    this.setVisibilityMode(Ext.Element.VISIBILITY);
+    if(config.id){
+        this.id = this.dom.id = config.id;
+    }else{
+        this.id = Ext.id(this.dom);
+    }
+    this.zindex = config.zindex || this.getZIndex();
+    this.position('absolute', this.zindex);
+    if(config.shadow){
+        this.shadowOffset = config.shadowOffset || 4;
+        this.shadow = new Ext.Shadow({
+            offset : this.shadowOffset,
+            mode : config.shadow
+        });
+    }else{
+        this.shadowOffset = 0;
+    }
+    this.useShim = config.shim !== false && Ext.useShims;
+    this.useDisplay = config.useDisplay;
+    this.hide();
+};
+
+var supr = Ext.Element.prototype;
+
+
+var shims = [];
+
+Ext.extend(Ext.Layer, Ext.Element, {
+
+    getZIndex : function(){
+        return this.zindex || parseInt((this.getShim() || this).getStyle('z-index'), 10) || 11000;
+    },
+
+    getShim : function(){
+        if(!this.useShim){
+            return null;
+        }
+        if(this.shim){
+            return this.shim;
+        }
+        var shim = shims.shift();
+        if(!shim){
+            shim = this.createShim();
+            shim.enableDisplayMode('block');
+            shim.dom.style.display = 'none';
+            shim.dom.style.visibility = 'visible';
+        }
+        var pn = this.dom.parentNode;
+        if(shim.dom.parentNode != pn){
+            pn.insertBefore(shim.dom, this.dom);
+        }
+        shim.setStyle('z-index', this.getZIndex()-2);
+        this.shim = shim;
+        return shim;
+    },
+
+    hideShim : function(){
+        if(this.shim){
+            this.shim.setDisplayed(false);
+            shims.push(this.shim);
+            delete this.shim;
+        }
+    },
+
+    disableShadow : function(){
+        if(this.shadow){
+            this.shadowDisabled = true;
+            this.shadow.hide();
+            this.lastShadowOffset = this.shadowOffset;
+            this.shadowOffset = 0;
+        }
+    },
+
+    enableShadow : function(show){
+        if(this.shadow){
+            this.shadowDisabled = false;
+            if(Ext.isDefined(this.lastShadowOffset)) {
+                this.shadowOffset = this.lastShadowOffset;
+                delete this.lastShadowOffset;
+            }
+            if(show){
+                this.sync(true);
+            }
+        }
+    },
+
+    
+    
+    
+    sync : function(doShow){
+        var shadow = this.shadow;
+        if(!this.updating && this.isVisible() && (shadow || this.useShim)){
+            var shim = this.getShim(),
+                w = this.getWidth(),
+                h = this.getHeight(),
+                l = this.getLeft(true),
+                t = this.getTop(true);
+
+            if(shadow && !this.shadowDisabled){
+                if(doShow && !shadow.isVisible()){
+                    shadow.show(this);
+                }else{
+                    shadow.realign(l, t, w, h);
+                }
+                if(shim){
+                    if(doShow){
+                       shim.show();
+                    }
+                    
+                    var shadowAdj = shadow.el.getXY(), shimStyle = shim.dom.style,
+                        shadowSize = shadow.el.getSize();
+                    shimStyle.left = (shadowAdj[0])+'px';
+                    shimStyle.top = (shadowAdj[1])+'px';
+                    shimStyle.width = (shadowSize.width)+'px';
+                    shimStyle.height = (shadowSize.height)+'px';
+                }
+            }else if(shim){
+                if(doShow){
+                   shim.show();
+                }
+                shim.setSize(w, h);
+                shim.setLeftTop(l, t);
+            }
+        }
+    },
+
+    
+    destroy : function(){
+        this.hideShim();
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.removeAllListeners();
+        Ext.removeNode(this.dom);
+        delete this.dom;
+    },
+
+    remove : function(){
+        this.destroy();
+    },
+
+    
+    beginUpdate : function(){
+        this.updating = true;
+    },
+
+    
+    endUpdate : function(){
+        this.updating = false;
+        this.sync(true);
+    },
+
+    
+    hideUnders : function(negOffset){
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.hideShim();
+    },
+
+    
+    constrainXY : function(){
+        if(this.constrain){
+            var vw = Ext.lib.Dom.getViewWidth(),
+                vh = Ext.lib.Dom.getViewHeight();
+            var s = Ext.getDoc().getScroll();
+
+            var xy = this.getXY();
+            var x = xy[0], y = xy[1];
+            var so = this.shadowOffset;
+            var w = this.dom.offsetWidth+so, h = this.dom.offsetHeight+so;
+            
+            var moved = false;
+            
+            if((x + w) > vw+s.left){
+                x = vw - w - so;
+                moved = true;
+            }
+            if((y + h) > vh+s.top){
+                y = vh - h - so;
+                moved = true;
+            }
+            
+            if(x < s.left){
+                x = s.left;
+                moved = true;
+            }
+            if(y < s.top){
+                y = s.top;
+                moved = true;
+            }
+            if(moved){
+                if(this.avoidY){
+                    var ay = this.avoidY;
+                    if(y <= ay && (y+h) >= ay){
+                        y = ay-h-5;
+                    }
+                }
+                xy = [x, y];
+                this.storeXY(xy);
+                supr.setXY.call(this, xy);
+                this.sync();
+            }
+        }
+        return this;
+    },
+    
+    getConstrainOffset : function(){
+        return this.shadowOffset;    
+    },
+
+    isVisible : function(){
+        return this.visible;
+    },
+
+    
+    showAction : function(){
+        this.visible = true; 
+        if(this.useDisplay === true){
+            this.setDisplayed('');
+        }else if(this.lastXY){
+            supr.setXY.call(this, this.lastXY);
+        }else if(this.lastLT){
+            supr.setLeftTop.call(this, this.lastLT[0], this.lastLT[1]);
+        }
+    },
+
+    
+    hideAction : function(){
+        this.visible = false;
+        if(this.useDisplay === true){
+            this.setDisplayed(false);
+        }else{
+            this.setLeftTop(-10000,-10000);
+        }
+    },
+
+    
+    setVisible : function(v, a, d, c, e){
+        if(v){
+            this.showAction();
+        }
+        if(a && v){
+            var cb = function(){
+                this.sync(true);
+                if(c){
+                    c();
+                }
+            }.createDelegate(this);
+            supr.setVisible.call(this, true, true, d, cb, e);
+        }else{
+            if(!v){
+                this.hideUnders(true);
+            }
+            var cb = c;
+            if(a){
+                cb = function(){
+                    this.hideAction();
+                    if(c){
+                        c();
+                    }
+                }.createDelegate(this);
+            }
+            supr.setVisible.call(this, v, a, d, cb, e);
+            if(v){
+                this.sync(true);
+            }else if(!a){
+                this.hideAction();
+            }
+        }
+        return this;
+    },
+
+    storeXY : function(xy){
+        delete this.lastLT;
+        this.lastXY = xy;
+    },
+
+    storeLeftTop : function(left, top){
+        delete this.lastXY;
+        this.lastLT = [left, top];
+    },
+
+    
+    beforeFx : function(){
+        this.beforeAction();
+        return Ext.Layer.superclass.beforeFx.apply(this, arguments);
+    },
+
+    
+    afterFx : function(){
+        Ext.Layer.superclass.afterFx.apply(this, arguments);
+        this.sync(this.isVisible());
+    },
+
+    
+    beforeAction : function(){
+        if(!this.updating && this.shadow){
+            this.shadow.hide();
+        }
+    },
+
+    
+    setLeft : function(left){
+        this.storeLeftTop(left, this.getTop(true));
+        supr.setLeft.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setTop : function(top){
+        this.storeLeftTop(this.getLeft(true), top);
+        supr.setTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setLeftTop : function(left, top){
+        this.storeLeftTop(left, top);
+        supr.setLeftTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setXY : function(xy, a, d, c, e){
+        this.fixDisplay();
+        this.beforeAction();
+        this.storeXY(xy);
+        var cb = this.createCB(c);
+        supr.setXY.call(this, xy, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    
+    createCB : function(c){
+        var el = this;
+        return function(){
+            el.constrainXY();
+            el.sync(true);
+            if(c){
+                c();
+            }
+        };
+    },
+
+    
+    setX : function(x, a, d, c, e){
+        this.setXY([x, this.getY()], a, d, c, e);
+        return this;
+    },
+
+    
+    setY : function(y, a, d, c, e){
+        this.setXY([this.getX(), y], a, d, c, e);
+        return this;
+    },
+
+    
+    setSize : function(w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setSize.call(this, w, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    
+    setWidth : function(w, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setWidth.call(this, w, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    
+    setHeight : function(h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setHeight.call(this, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    
+    setBounds : function(x, y, w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        if(!a){
+            this.storeXY([x, y]);
+            supr.setXY.call(this, [x, y]);
+            supr.setSize.call(this, w, h, a, d, cb, e);
+            cb();
+        }else{
+            supr.setBounds.call(this, x, y, w, h, a, d, cb, e);
+        }
+        return this;
+    },
+
+    
+    setZIndex : function(zindex){
+        this.zindex = zindex;
+        this.setStyle('z-index', zindex + 2);
+        if(this.shadow){
+            this.shadow.setZIndex(zindex + 1);
+        }
+        if(this.shim){
+            this.shim.setStyle('z-index', zindex);
+        }
+        return this;
+    }
+});
+})();
+
+Ext.Shadow = function(config) {
+    Ext.apply(this, config);
+    if (typeof this.mode != "string") {
+        this.mode = this.defaultMode;
+    }
+    var o = this.offset,
+        a = {
+            h: 0
+        },
+        rad = Math.floor(this.offset / 2);
+    switch (this.mode.toLowerCase()) {
+        
+        case "drop":
+            a.w = 0;
+            a.l = a.t = o;
+            a.t -= 1;
+            if (Ext.isIE) {
+                a.l -= this.offset + rad;
+                a.t -= this.offset + rad;
+                a.w -= rad;
+                a.h -= rad;
+                a.t += 1;
+            }
+        break;
+        case "sides":
+            a.w = (o * 2);
+            a.l = -o;
+            a.t = o - 1;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= this.offset + rad;
+                a.l += 1;
+                a.w -= (this.offset - rad) * 2;
+                a.w -= rad + 1;
+                a.h -= 1;
+            }
+        break;
+        case "frame":
+            a.w = a.h = (o * 2);
+            a.l = a.t = -o;
+            a.t += 1;
+            a.h -= 2;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= (this.offset - rad);
+                a.l += 1;
+                a.w -= (this.offset + rad + 1);
+                a.h -= (this.offset + rad);
+                a.h += 1;
+            }
+        break;
+    };
+
+    this.adjusts = a;
+};
+
+Ext.Shadow.prototype = {
+    
+    
+    offset: 4,
+
+    
+    defaultMode: "drop",
+
+    
+    show: function(target) {
+        target = Ext.get(target);
+        if (!this.el) {
+            this.el = Ext.Shadow.Pool.pull();
+            if (this.el.dom.nextSibling != target.dom) {
+                this.el.insertBefore(target);
+            }
+        }
+        this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10) - 1);
+        if (Ext.isIE) {
+            this.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (this.offset) + ")";
+        }
+        this.realign(
+        target.getLeft(true),
+        target.getTop(true),
+        target.getWidth(),
+        target.getHeight()
+        );
+        this.el.dom.style.display = "block";
+    },
+
+    
+    isVisible: function() {
+        return this.el ? true: false;
+    },
+
+    
+    realign: function(l, t, w, h) {
+        if (!this.el) {
+            return;
+        }
+        var a = this.adjusts,
+            d = this.el.dom,
+            s = d.style,
+            iea = 0,
+            sw = (w + a.w),
+            sh = (h + a.h),
+            sws = sw + "px",
+            shs = sh + "px",
+            cn,
+            sww;
+        s.left = (l + a.l) + "px";
+        s.top = (t + a.t) + "px";
+        if (s.width != sws || s.height != shs) {
+            s.width = sws;
+            s.height = shs;
+            if (!Ext.isIE) {
+                cn = d.childNodes;
+                sww = Math.max(0, (sw - 12)) + "px";
+                cn[0].childNodes[1].style.width = sww;
+                cn[1].childNodes[1].style.width = sww;
+                cn[2].childNodes[1].style.width = sww;
+                cn[1].style.height = Math.max(0, (sh - 12)) + "px";
+            }
+        }
+    },
+
+    
+    hide: function() {
+        if (this.el) {
+            this.el.dom.style.display = "none";
+            Ext.Shadow.Pool.push(this.el);
+            delete this.el;
+        }
+    },
+
+    
+    setZIndex: function(z) {
+        this.zIndex = z;
+        if (this.el) {
+            this.el.setStyle("z-index", z);
+        }
+    }
+};
+
+
+Ext.Shadow.Pool = function() {
+    var p = [],
+        markup = Ext.isIE ?
+            '<div class="x-ie-shadow"></div>':
+            '<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';
+    return {
+        pull: function() {
+            var sh = p.shift();
+            if (!sh) {
+                sh = Ext.get(Ext.DomHelper.insertHtml("beforeBegin", document.body.firstChild, markup));
+                sh.autoBoxAdjust = false;
+            }
+            return sh;
+        },
+
+        push: function(sh) {
+            p.push(sh);
+        }
+    };
+}();
+Ext.BoxComponent = Ext.extend(Ext.Component, {
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+    
+
+    
+    initComponent : function(){
+        Ext.BoxComponent.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'resize',
+            
+            'move'
+        );
+    },
+
+    
+    boxReady : false,
+    
+    deferHeight: false,
+
+    
+    setSize : function(w, h){
+
+        
+        if(typeof w == 'object'){
+            h = w.height;
+            w = w.width;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMinWidth) && (w < this.boxMinWidth)) {
+            w = this.boxMinWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMinHeight) && (h < this.boxMinHeight)) {
+            h = this.boxMinHeight;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMaxWidth) && (w > this.boxMaxWidth)) {
+            w = this.boxMaxWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMaxHeight) && (h > this.boxMaxHeight)) {
+            h = this.boxMaxHeight;
+        }
+        
+        if(!this.boxReady){
+            this.width  = w;
+            this.height = h;
+            return this;
+        }
+
+        
+        if(this.cacheSizes !== false && this.lastSize && this.lastSize.width == w && this.lastSize.height == h){
+            return this;
+        }
+        this.lastSize = {width: w, height: h};
+        var adj = this.adjustSize(w, h),
+            aw = adj.width,
+            ah = adj.height,
+            rz;
+        if(aw !== undefined || ah !== undefined){ 
+            rz = this.getResizeEl();
+            if(!this.deferHeight && aw !== undefined && ah !== undefined){
+                rz.setSize(aw, ah);
+            }else if(!this.deferHeight && ah !== undefined){
+                rz.setHeight(ah);
+            }else if(aw !== undefined){
+                rz.setWidth(aw);
+            }
+            this.onResize(aw, ah, w, h);
+            this.fireEvent('resize', this, aw, ah, w, h);
+        }
+        return this;
+    },
+
+    
+    setWidth : function(width){
+        return this.setSize(width);
+    },
+
+    
+    setHeight : function(height){
+        return this.setSize(undefined, height);
+    },
+
+    
+    getSize : function(){
+        return this.getResizeEl().getSize();
+    },
+
+    
+    getWidth : function(){
+        return this.getResizeEl().getWidth();
+    },
+
+    
+    getHeight : function(){
+        return this.getResizeEl().getHeight();
+    },
+
+    
+    getOuterSize : function(){
+        var el = this.getResizeEl();
+        return {width: el.getWidth() + el.getMargins('lr'),
+                height: el.getHeight() + el.getMargins('tb')};
+    },
+
+    
+    getPosition : function(local){
+        var el = this.getPositionEl();
+        if(local === true){
+            return [el.getLeft(true), el.getTop(true)];
+        }
+        return this.xy || el.getXY();
+    },
+
+    
+    getBox : function(local){
+        var pos = this.getPosition(local);
+        var s = this.getSize();
+        s.x = pos[0];
+        s.y = pos[1];
+        return s;
+    },
+
+    
+    updateBox : function(box){
+        this.setSize(box.width, box.height);
+        this.setPagePosition(box.x, box.y);
+        return this;
+    },
+
+    
+    getResizeEl : function(){
+        return this.resizeEl || this.el;
+    },
+
+    
+    setAutoScroll : function(scroll){
+        if(this.rendered){
+            this.getContentTarget().setOverflow(scroll ? 'auto' : '');
+        }
+        this.autoScroll = scroll;
+        return this;
+    },
+
+    
+    setPosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.x = x;
+        this.y = y;
+        if(!this.boxReady){
+            return this;
+        }
+        var adj = this.adjustPosition(x, y);
+        var ax = adj.x, ay = adj.y;
+
+        var el = this.getPositionEl();
+        if(ax !== undefined || ay !== undefined){
+            if(ax !== undefined && ay !== undefined){
+                el.setLeftTop(ax, ay);
+            }else if(ax !== undefined){
+                el.setLeft(ax);
+            }else if(ay !== undefined){
+                el.setTop(ay);
+            }
+            this.onPosition(ax, ay);
+            this.fireEvent('move', this, ax, ay);
+        }
+        return this;
+    },
+
+    
+    setPagePosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.pageX = x;
+        this.pageY = y;
+        if(!this.boxReady){
+            return;
+        }
+        if(x === undefined || y === undefined){ 
+            return;
+        }
+        var p = this.getPositionEl().translatePoints(x, y);
+        this.setPosition(p.left, p.top);
+        return this;
+    },
+
+    
+    afterRender : function(){
+        Ext.BoxComponent.superclass.afterRender.call(this);
+        if(this.resizeEl){
+            this.resizeEl = Ext.get(this.resizeEl);
+        }
+        if(this.positionEl){
+            this.positionEl = Ext.get(this.positionEl);
+        }
+        this.boxReady = true;
+        Ext.isDefined(this.autoScroll) && this.setAutoScroll(this.autoScroll);
+        this.setSize(this.width, this.height);
+        if(this.x || this.y){
+            this.setPosition(this.x, this.y);
+        }else if(this.pageX || this.pageY){
+            this.setPagePosition(this.pageX, this.pageY);
+        }
+    },
+
+    
+    syncSize : function(){
+        delete this.lastSize;
+        this.setSize(this.autoWidth ? undefined : this.getResizeEl().getWidth(), this.autoHeight ? undefined : this.getResizeEl().getHeight());
+        return this;
+    },
+
+    
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+    },
+
+    
+    onPosition : function(x, y){
+
+    },
+
+    
+    adjustSize : function(w, h){
+        if(this.autoWidth){
+            w = 'auto';
+        }
+        if(this.autoHeight){
+            h = 'auto';
+        }
+        return {width : w, height: h};
+    },
+
+    
+    adjustPosition : function(x, y){
+        return {x : x, y: y};
+    }
+});
+Ext.reg('box', Ext.BoxComponent);
+
+
+
+Ext.Spacer = Ext.extend(Ext.BoxComponent, {
+    autoEl:'div'
+});
+Ext.reg('spacer', Ext.Spacer);
+Ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){
+
+    
+    this.el = Ext.get(dragElement, true);
+    this.el.dom.unselectable = "on";
+    
+    this.resizingEl = Ext.get(resizingElement, true);
+
+    
+    this.orientation = orientation || Ext.SplitBar.HORIZONTAL;
+
+    
+    
+    this.minSize = 0;
+
+    
+    this.maxSize = 2000;
+
+    
+    this.animate = false;
+
+    
+    this.useShim = false;
+
+    
+    this.shim = null;
+
+    if(!existingProxy){
+        
+        this.proxy = Ext.SplitBar.createProxy(this.orientation);
+    }else{
+        this.proxy = Ext.get(existingProxy).dom;
+    }
+    
+    this.dd = new Ext.dd.DDProxy(this.el.dom.id, "XSplitBars", {dragElId : this.proxy.id});
+
+    
+    this.dd.b4StartDrag = this.onStartProxyDrag.createDelegate(this);
+
+    
+    this.dd.endDrag = this.onEndProxyDrag.createDelegate(this);
+
+    
+    this.dragSpecs = {};
+
+    
+    this.adapter = new Ext.SplitBar.BasicLayoutAdapter();
+    this.adapter.init(this);
+
+    if(this.orientation == Ext.SplitBar.HORIZONTAL){
+        
+        this.placement = placement || (this.el.getX() > this.resizingEl.getX() ? Ext.SplitBar.LEFT : Ext.SplitBar.RIGHT);
+        this.el.addClass("x-splitbar-h");
+    }else{
+        
+        this.placement = placement || (this.el.getY() > this.resizingEl.getY() ? Ext.SplitBar.TOP : Ext.SplitBar.BOTTOM);
+        this.el.addClass("x-splitbar-v");
+    }
+
+    this.addEvents(
+        
+        "resize",
+        
+        "moved",
+        
+        "beforeresize",
+
+        "beforeapply"
+    );
+
+    Ext.SplitBar.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.SplitBar, Ext.util.Observable, {
+    onStartProxyDrag : function(x, y){
+        this.fireEvent("beforeresize", this);
+        this.overlay =  Ext.DomHelper.append(document.body,  {cls: "x-drag-overlay", html: "&#160;"}, true);
+        this.overlay.unselectable();
+        this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        this.overlay.show();
+        Ext.get(this.proxy).setDisplayed("block");
+        var size = this.adapter.getElementSize(this);
+        this.activeMinSize = this.getMinimumSize();
+        this.activeMaxSize = this.getMaximumSize();
+        var c1 = size - this.activeMinSize;
+        var c2 = Math.max(this.activeMaxSize - size, 0);
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(
+                this.placement == Ext.SplitBar.LEFT ? c1 : c2,
+                this.placement == Ext.SplitBar.LEFT ? c2 : c1,
+                this.tickSize
+            );
+            this.dd.setYConstraint(0, 0);
+        }else{
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(0, 0);
+            this.dd.setYConstraint(
+                this.placement == Ext.SplitBar.TOP ? c1 : c2,
+                this.placement == Ext.SplitBar.TOP ? c2 : c1,
+                this.tickSize
+            );
+         }
+        this.dragSpecs.startSize = size;
+        this.dragSpecs.startPoint = [x, y];
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd, x, y);
+    },
+
+    
+    onEndProxyDrag : function(e){
+        Ext.get(this.proxy).setDisplayed(false);
+        var endPoint = Ext.lib.Event.getXY(e);
+        if(this.overlay){
+            Ext.destroy(this.overlay);
+            delete this.overlay;
+        }
+        var newSize;
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.LEFT ?
+                    endPoint[0] - this.dragSpecs.startPoint[0] :
+                    this.dragSpecs.startPoint[0] - endPoint[0]
+                );
+        }else{
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.TOP ?
+                    endPoint[1] - this.dragSpecs.startPoint[1] :
+                    this.dragSpecs.startPoint[1] - endPoint[1]
+                );
+        }
+        newSize = Math.min(Math.max(newSize, this.activeMinSize), this.activeMaxSize);
+        if(newSize != this.dragSpecs.startSize){
+            if(this.fireEvent('beforeapply', this, newSize) !== false){
+                this.adapter.setElementSize(this, newSize);
+                this.fireEvent("moved", this, newSize);
+                this.fireEvent("resize", this, newSize);
+            }
+        }
+    },
+
+    
+    getAdapter : function(){
+        return this.adapter;
+    },
+
+    
+    setAdapter : function(adapter){
+        this.adapter = adapter;
+        this.adapter.init(this);
+    },
+
+    
+    getMinimumSize : function(){
+        return this.minSize;
+    },
+
+    
+    setMinimumSize : function(minSize){
+        this.minSize = minSize;
+    },
+
+    
+    getMaximumSize : function(){
+        return this.maxSize;
+    },
+
+    
+    setMaximumSize : function(maxSize){
+        this.maxSize = maxSize;
+    },
+
+    
+    setCurrentSize : function(size){
+        var oldAnimate = this.animate;
+        this.animate = false;
+        this.adapter.setElementSize(this, size);
+        this.animate = oldAnimate;
+    },
+
+    
+    destroy : function(removeEl){
+        Ext.destroy(this.shim, Ext.get(this.proxy));
+        this.dd.unreg();
+        if(removeEl){
+            this.el.remove();
+        }
+        this.purgeListeners();
+    }
+});
+
+
+Ext.SplitBar.createProxy = function(dir){
+    var proxy = new Ext.Element(document.createElement("div"));
+    document.body.appendChild(proxy.dom);
+    proxy.unselectable();
+    var cls = 'x-splitbar-proxy';
+    proxy.addClass(cls + ' ' + (dir == Ext.SplitBar.HORIZONTAL ? cls +'-h' : cls + '-v'));
+    return proxy.dom;
+};
+
+
+Ext.SplitBar.BasicLayoutAdapter = function(){
+};
+
+Ext.SplitBar.BasicLayoutAdapter.prototype = {
+    
+    init : function(s){
+
+    },
+    
+     getElementSize : function(s){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            return s.resizingEl.getWidth();
+        }else{
+            return s.resizingEl.getHeight();
+        }
+    },
+
+    
+    setElementSize : function(s, newSize, onComplete){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            if(!s.animate){
+                s.resizingEl.setWidth(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setWidth(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }else{
+
+            if(!s.animate){
+                s.resizingEl.setHeight(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setHeight(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }
+    }
+};
+
+
+Ext.SplitBar.AbsoluteLayoutAdapter = function(container){
+    this.basic = new Ext.SplitBar.BasicLayoutAdapter();
+    this.container = Ext.get(container);
+};
+
+Ext.SplitBar.AbsoluteLayoutAdapter.prototype = {
+    init : function(s){
+        this.basic.init(s);
+    },
+
+    getElementSize : function(s){
+        return this.basic.getElementSize(s);
+    },
+
+    setElementSize : function(s, newSize, onComplete){
+        this.basic.setElementSize(s, newSize, this.moveSplitter.createDelegate(this, [s]));
+    },
+
+    moveSplitter : function(s){
+        var yes = Ext.SplitBar;
+        switch(s.placement){
+            case yes.LEFT:
+                s.el.setX(s.resizingEl.getRight());
+                break;
+            case yes.RIGHT:
+                s.el.setStyle("right", (this.container.getWidth() - s.resizingEl.getLeft()) + "px");
+                break;
+            case yes.TOP:
+                s.el.setY(s.resizingEl.getBottom());
+                break;
+            case yes.BOTTOM:
+                s.el.setY(s.resizingEl.getTop() - s.el.getHeight());
+                break;
+        }
+    }
+};
+
+
+Ext.SplitBar.VERTICAL = 1;
+
+
+Ext.SplitBar.HORIZONTAL = 2;
+
+
+Ext.SplitBar.LEFT = 1;
+
+
+Ext.SplitBar.RIGHT = 2;
+
+
+Ext.SplitBar.TOP = 3;
+
+
+Ext.SplitBar.BOTTOM = 4;
+
+Ext.Container = Ext.extend(Ext.BoxComponent, {
+    
+    
+    
+    
+    bufferResize: 50,
+
+    
+    
+    
+
+
+    
+    autoDestroy : true,
+
+    
+    forceLayout: false,
+
+    
+    
+    defaultType : 'panel',
+
+    
+    resizeEvent: 'resize',
+
+    
+    bubbleEvents: ['add', 'remove'],
+
+    
+    initComponent : function(){
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents(
+            
+            'afterlayout',
+            
+            'beforeadd',
+            
+            'beforeremove',
+            
+            'add',
+            
+            'remove'
+        );
+
+        
+        var items = this.items;
+        if(items){
+            delete this.items;
+            this.add(items);
+        }
+    },
+
+    
+    initItems : function(){
+        if(!this.items){
+            this.items = new Ext.util.MixedCollection(false, this.getComponentId);
+            this.getLayout(); 
+        }
+    },
+
+    
+    setLayout : function(layout){
+        if(this.layout && this.layout != layout){
+            this.layout.setContainer(null);
+        }
+        this.layout = layout;
+        this.initItems();
+        layout.setContainer(this);
+    },
+
+    afterRender: function(){
+        
+        
+        Ext.Container.superclass.afterRender.call(this);
+        if(!this.layout){
+            this.layout = 'auto';
+        }
+        if(Ext.isObject(this.layout) && !this.layout.layout){
+            this.layoutConfig = this.layout;
+            this.layout = this.layoutConfig.type;
+        }
+        if(Ext.isString(this.layout)){
+            this.layout = new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig);
+        }
+        this.setLayout(this.layout);
+
+        
+        if(this.activeItem !== undefined && this.layout.setActiveItem){
+            var item = this.activeItem;
+            delete this.activeItem;
+            this.layout.setActiveItem(item);
+        }
+
+        
+        if(!this.ownerCt){
+            this.doLayout(false, true);
+        }
+
+        
+        
+        if(this.monitorResize === true){
+            Ext.EventManager.onWindowResize(this.doLayout, this, [false]);
+        }
+    },
+
+    
+    getLayoutTarget : function(){
+        return this.el;
+    },
+
+    
+    getComponentId : function(comp){
+        return comp.getItemId();
+    },
+
+    
+    add : function(comp){
+        this.initItems();
+        var args = arguments.length > 1;
+        if(args || Ext.isArray(comp)){
+            var result = [];
+            Ext.each(args ? arguments : comp, function(c){
+                result.push(this.add(c));
+            }, this);
+            return result;
+        }
+        var c = this.lookupComponent(this.applyDefaults(comp));
+        var index = this.items.length;
+        if(this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false){
+            this.items.add(c);
+            
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        return c;
+    },
+
+    onAdd : function(c){
+        
+    },
+
+    
+    onAdded : function(container, pos) {
+        
+        this.ownerCt = container;
+        this.initRef();
+        
+        this.cascade(function(c){
+            c.initRef();
+        });
+        this.fireEvent('added', this, container, pos);
+    },
+
+    
+    insert : function(index, comp) {
+        var args   = arguments,
+            length = args.length,
+            result = [],
+            i, c;
+        
+        this.initItems();
+        
+        if (length > 2) {
+            for (i = length - 1; i >= 1; --i) {
+                result.push(this.insert(index, args[i]));
+            }
+            return result;
+        }
+        
+        c = this.lookupComponent(this.applyDefaults(comp));
+        index = Math.min(index, this.items.length);
+        
+        if (this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false) {
+            if (c.ownerCt == this) {
+                this.items.remove(c);
+            }
+            this.items.insert(index, c);
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        
+        return c;
+    },
+
+    
+    applyDefaults : function(c){
+        var d = this.defaults;
+        if(d){
+            if(Ext.isFunction(d)){
+                d = d.call(this, c);
+            }
+            if(Ext.isString(c)){
+                c = Ext.ComponentMgr.get(c);
+                Ext.apply(c, d);
+            }else if(!c.events){
+                Ext.applyIf(c.isAction ? c.initialConfig : c, d);
+            }else{
+                Ext.apply(c, d);
+            }
+        }
+        return c;
+    },
+
+    
+    onBeforeAdd : function(item){
+        if(item.ownerCt){
+            item.ownerCt.remove(item, false);
+        }
+        if(this.hideBorders === true){
+            item.border = (item.border === true);
+        }
+    },
+
+    
+    remove : function(comp, autoDestroy){
+        this.initItems();
+        var c = this.getComponent(comp);
+        if(c && this.fireEvent('beforeremove', this, c) !== false){
+            this.doRemove(c, autoDestroy);
+            this.fireEvent('remove', this, c);
+        }
+        return c;
+    },
+
+    onRemove: function(c){
+        
+    },
+
+    
+    doRemove: function(c, autoDestroy){
+        var l = this.layout,
+            hasLayout = l && this.rendered;
+
+        if(hasLayout){
+            l.onRemove(c);
+        }
+        this.items.remove(c);
+        c.onRemoved();
+        this.onRemove(c);
+        if(autoDestroy === true || (autoDestroy !== false && this.autoDestroy)){
+            c.destroy();
+        }
+        if(hasLayout){
+            l.afterRemove(c);
+        }
+    },
+
+    
+    removeAll: function(autoDestroy){
+        this.initItems();
+        var item, rem = [], items = [];
+        this.items.each(function(i){
+            rem.push(i);
+        });
+        for (var i = 0, len = rem.length; i < len; ++i){
+            item = rem[i];
+            this.remove(item, autoDestroy);
+            if(item.ownerCt !== this){
+                items.push(item);
+            }
+        }
+        return items;
+    },
+
+    
+    getComponent : function(comp){
+        if(Ext.isObject(comp)){
+            comp = comp.getItemId();
+        }
+        return this.items.get(comp);
+    },
+
+    
+    lookupComponent : function(comp){
+        if(Ext.isString(comp)){
+            return Ext.ComponentMgr.get(comp);
+        }else if(!comp.events){
+            return this.createComponent(comp);
+        }
+        return comp;
+    },
+
+    
+    createComponent : function(config, defaultType){
+        if (config.render) {
+            return config;
+        }
+        
+        
+        var c = Ext.create(Ext.apply({
+            ownerCt: this
+        }, config), defaultType || this.defaultType);
+        delete c.initialConfig.ownerCt;
+        delete c.ownerCt;
+        return c;
+    },
+
+    
+    canLayout : function() {
+        var el = this.getVisibilityEl();
+        return el && el.dom && !el.isStyle("display", "none");
+    },
+
+    
+
+    doLayout : function(shallow, force){
+        var rendered = this.rendered,
+            forceLayout = force || this.forceLayout;
+
+        if(this.collapsed || !this.canLayout()){
+            this.deferLayout = this.deferLayout || !shallow;
+            if(!forceLayout){
+                return;
+            }
+            shallow = shallow && !this.deferLayout;
+        } else {
+            delete this.deferLayout;
+        }
+        if(rendered && this.layout){
+            this.layout.layout();
+        }
+        if(shallow !== true && this.items){
+            var cs = this.items.items;
+            for(var i = 0, len = cs.length; i < len; i++){
+                var c = cs[i];
+                if(c.doLayout){
+                    c.doLayout(false, forceLayout);
+                }
+            }
+        }
+        if(rendered){
+            this.onLayout(shallow, forceLayout);
+        }
+        
+        this.hasLayout = true;
+        delete this.forceLayout;
+    },
+
+    onLayout : Ext.emptyFn,
+
+    
+    shouldBufferLayout: function(){
+        
+        var hl = this.hasLayout;
+        if(this.ownerCt){
+            
+            return hl ? !this.hasLayoutPending() : false;
+        }
+        
+        return hl;
+    },
+
+    
+    hasLayoutPending: function(){
+        
+        var pending = false;
+        this.ownerCt.bubble(function(c){
+            if(c.layoutPending){
+                pending = true;
+                return false;
+            }
+        });
+        return pending;
+    },
+
+    onShow : function(){
+        
+        Ext.Container.superclass.onShow.call(this);
+        
+        if(Ext.isDefined(this.deferLayout)){
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+    },
+
+    
+    getLayout : function(){
+        if(!this.layout){
+            var layout = new Ext.layout.AutoLayout(this.layoutConfig);
+            this.setLayout(layout);
+        }
+        return this.layout;
+    },
+
+    
+    beforeDestroy : function(){
+        var c;
+        if(this.items){
+            while(c = this.items.first()){
+                this.doRemove(c, true);
+            }
+        }
+        if(this.monitorResize){
+            Ext.EventManager.removeResizeListener(this.doLayout, this);
+        }
+        Ext.destroy(this.layout);
+        Ext.Container.superclass.beforeDestroy.call(this);
+    },
+
+    
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            if(this.items){
+                var cs = this.items.items;
+                for(var i = 0, len = cs.length; i < len; i++){
+                    if(cs[i].cascade){
+                        cs[i].cascade(fn, scope, args);
+                    }else{
+                        fn.apply(scope || cs[i], args || [cs[i]]);
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    
+    findById : function(id){
+        var m = null, 
+            ct = this;
+        this.cascade(function(c){
+            if(ct != c && c.id === id){
+                m = c;
+                return false;
+            }
+        });
+        return m;
+    },
+
+    
+    findByType : function(xtype, shallow){
+        return this.findBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+
+    
+    find : function(prop, value){
+        return this.findBy(function(c){
+            return c[prop] === value;
+        });
+    },
+
+    
+    findBy : function(fn, scope){
+        var m = [], ct = this;
+        this.cascade(function(c){
+            if(ct != c && fn.call(scope || c, c, ct) === true){
+                m.push(c);
+            }
+        });
+        return m;
+    },
+
+    
+    get : function(key){
+        return this.getComponent(key);
+    }
+});
+
+Ext.Container.LAYOUTS = {};
+Ext.reg('container', Ext.Container);
+
+Ext.layout.ContainerLayout = Ext.extend(Object, {
+    
+    
+
+    
+
+    
+    monitorResize:false,
+    
+    activeItem : null,
+
+    constructor : function(config){
+        this.id = Ext.id(null, 'ext-layout-');
+        Ext.apply(this, config);
+    },
+
+    type: 'container',
+
+    
+    IEMeasureHack : function(target, viewFlag) {
+        var tChildren = target.dom.childNodes, tLen = tChildren.length, c, d = [], e, i, ret;
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                d[i] = e.getStyle('display');
+                e.setStyle({display: 'none'});
+            }
+        }
+        ret = target ? target.getViewSize(viewFlag) : {};
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                e.setStyle({display: d[i]});
+            }
+        }
+        return ret;
+    },
+
+    
+    getLayoutTargetSize : Ext.EmptyFn,
+
+    
+    layout : function(){
+        var ct = this.container, target = ct.getLayoutTarget();
+        if(!(this.hasLayout || Ext.isEmpty(this.targetCls))){
+            target.addClass(this.targetCls);
+        }
+        this.onLayout(ct, target);
+        ct.fireEvent('afterlayout', ct, this);
+    },
+
+    
+    onLayout : function(ct, target){
+        this.renderAll(ct, target);
+    },
+
+    
+    isValidParent : function(c, target){
+        return target && c.getPositionEl().dom.parentNode == (target.dom || target);
+    },
+
+    
+    renderAll : function(ct, target){
+        var items = ct.items.items, i, c, len = items.length;
+        for(i = 0; i < len; i++) {
+            c = items[i];
+            if(c && (!c.rendered || !this.isValidParent(c, target))){
+                this.renderItem(c, i, target);
+            }
+        }
+    },
+
+    
+    renderItem : function(c, position, target){
+        if (c) {
+            if (!c.rendered) {
+                c.render(target, position);
+                this.configureItem(c);
+            } else if (!this.isValidParent(c, target)) {
+                if (Ext.isNumber(position)) {
+                    position = target.dom.childNodes[position];
+                }
+                
+                target.dom.insertBefore(c.getPositionEl().dom, position || null);
+                c.container = target;
+                this.configureItem(c);
+            }
+        }
+    },
+
+    
+    
+    getRenderedItems: function(ct){
+        var t = ct.getLayoutTarget(), cti = ct.items.items, len = cti.length, i, c, items = [];
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.shouldLayout !== false){
+                items.push(c);
+            }
+        };
+        return items;
+    },
+
+    
+    configureItem: function(c){
+        if (this.extraCls) {
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.addClass(this.extraCls);
+        }
+        
+        
+        if (c.doLayout && this.forceLayout) {
+            c.doLayout();
+        }
+        if (this.renderHidden && c != this.activeItem) {
+            c.hide();
+        }
+    },
+
+    onRemove: function(c){
+        if(this.activeItem == c){
+            delete this.activeItem;
+        }
+        if(c.rendered && this.extraCls){
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.removeClass(this.extraCls);
+        }
+    },
+
+    afterRemove: function(c){
+        if(c.removeRestore){
+            c.removeMode = 'container';
+            delete c.removeRestore;
+        }
+    },
+
+    
+    onResize: function(){
+        var ct = this.container,
+            b;
+        if(ct.collapsed){
+            return;
+        }
+        if(b = ct.bufferResize && ct.shouldBufferLayout()){
+            if(!this.resizeTask){
+                this.resizeTask = new Ext.util.DelayedTask(this.runLayout, this);
+                this.resizeBuffer = Ext.isNumber(b) ? b : 50;
+            }
+            ct.layoutPending = true;
+            this.resizeTask.delay(this.resizeBuffer);
+        }else{
+            this.runLayout();
+        }
+    },
+
+    runLayout: function(){
+        var ct = this.container;
+        this.layout();
+        ct.onLayout();
+        delete ct.layoutPending;
+    },
+
+    
+    setContainer : function(ct){
+        
+        if(this.monitorResize && ct != this.container){
+            var old = this.container;
+            if(old){
+                old.un(old.resizeEvent, this.onResize, this);
+            }
+            if(ct){
+                ct.on(ct.resizeEvent, this.onResize, this);
+            }
+        }
+        this.container = ct;
+    },
+
+    
+    parseMargins : function(v){
+        if (Ext.isNumber(v)) {
+            v = v.toString();
+        }
+        var ms  = v.split(' '),
+            len = ms.length;
+            
+        if (len == 1) {
+            ms[1] = ms[2] = ms[3] = ms[0];
+        } else if(len == 2) {
+            ms[2] = ms[0];
+            ms[3] = ms[1];
+        } else if(len == 3) {
+            ms[3] = ms[1];
+        }
+        
+        return {
+            top   :parseInt(ms[0], 10) || 0,
+            right :parseInt(ms[1], 10) || 0,
+            bottom:parseInt(ms[2], 10) || 0,
+            left  :parseInt(ms[3], 10) || 0
+        };
+    },
+
+    
+    fieldTpl: (function() {
+        var t = new Ext.Template(
+            '<div class="x-form-item {itemCls}" tabIndex="-1">',
+                '<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>',
+                '<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">',
+                '</div><div class="{clearCls}"></div>',
+            '</div>'
+        );
+        t.disableFormats = true;
+        return t.compile();
+    })(),
+
+    
+    destroy : function(){
+        
+        if(this.resizeTask && this.resizeTask.cancel){
+            this.resizeTask.cancel();
+        }
+        if(this.container) {
+            this.container.un(this.container.resizeEvent, this.onResize, this);
+        }
+        if(!Ext.isEmpty(this.targetCls)){
+            var target = this.container.getLayoutTarget();
+            if(target){
+                target.removeClass(this.targetCls);
+            }
+        }
+    }
+});
+Ext.layout.AutoLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    type: 'auto',
+
+    monitorResize: true,
+
+    onLayout : function(ct, target){
+        Ext.layout.AutoLayout.superclass.onLayout.call(this, ct, target);
+        var cs = this.getRenderedItems(ct), len = cs.length, i, c;
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            if (c.doLayout){
+                
+                c.doLayout(true);
+            }
+        }
+    }
+});
+
+Ext.Container.LAYOUTS['auto'] = Ext.layout.AutoLayout;
+
+Ext.layout.FitLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+    monitorResize:true,
+
+    type: 'fit',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        if (!target) {
+            return {};
+        }
+        
+        return target.getStyleSize();
+    },
+
+    
+    onLayout : function(ct, target){
+        Ext.layout.FitLayout.superclass.onLayout.call(this, ct, target);
+        if(!ct.collapsed){
+            this.setItemSize(this.activeItem || ct.items.itemAt(0), this.getLayoutTargetSize());
+        }
+    },
+
+    
+    setItemSize : function(item, size){
+        if(item && size.height > 0){ 
+            item.setSize(size);
+        }
+    }
+});
+Ext.Container.LAYOUTS['fit'] = Ext.layout.FitLayout;
+Ext.layout.CardLayout = Ext.extend(Ext.layout.FitLayout, {
+    
+    deferredRender : false,
+
+    
+    layoutOnCardChange : false,
+
+    
+    
+    renderHidden : true,
+
+    type: 'card',
+
+    
+    setActiveItem : function(item){
+        var ai = this.activeItem,
+            ct = this.container;
+        item = ct.getComponent(item);
+
+        
+        if(item && ai != item){
+
+            
+            if(ai){
+                ai.hide();
+                if (ai.hidden !== true) {
+                    return false;
+                }
+                ai.fireEvent('deactivate', ai);
+            }
+
+            var layout = item.doLayout && (this.layoutOnCardChange || !item.rendered);
+
+            
+            this.activeItem = item;
+
+            
+            
+            delete item.deferLayout;
+
+            
+            item.show();
+
+            this.layout();
+
+            if(layout){
+                item.doLayout();
+            }
+            item.fireEvent('activate', item);
+        }
+    },
+
+    
+    renderAll : function(ct, target){
+        if(this.deferredRender){
+            this.renderItem(this.activeItem, undefined, target);
+        }else{
+            Ext.layout.CardLayout.superclass.renderAll.call(this, ct, target);
+        }
+    }
+});
+Ext.Container.LAYOUTS['card'] = Ext.layout.CardLayout;
+
+Ext.layout.AnchorLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+
+    
+    monitorResize : true,
+
+    type : 'anchor',
+
+    
+    defaultAnchor : '100%',
+
+    parseAnchorRE : /^(r|right|b|bottom)$/i,
+
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret = {};
+        if (target) {
+            ret = target.getViewSize();
+
+            
+            
+            
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    
+    onLayout : function(container, target) {
+        Ext.layout.AnchorLayout.superclass.onLayout.call(this, container, target);
+
+        var size = this.getLayoutTargetSize(),
+            containerWidth = size.width,
+            containerHeight = size.height,
+            overflow = target.getStyle('overflow'),
+            components = this.getRenderedItems(container),
+            len = components.length,
+            boxes = [],
+            box,
+            anchorWidth,
+            anchorHeight,
+            component,
+            anchorSpec,
+            calcWidth,
+            calcHeight,
+            anchorsArray,
+            totalHeight = 0,
+            i,
+            el;
+
+        if(containerWidth < 20 && containerHeight < 20){
+            return;
+        }
+
+        
+        if(container.anchorSize) {
+            if(typeof container.anchorSize == 'number') {
+                anchorWidth = container.anchorSize;
+            } else {
+                anchorWidth = container.anchorSize.width;
+                anchorHeight = container.anchorSize.height;
+            }
+        } else {
+            anchorWidth = container.initialConfig.width;
+            anchorHeight = container.initialConfig.height;
+        }
+
+        for(i = 0; i < len; i++) {
+            component = components[i];
+            el = component.getPositionEl();
+
+            
+            if (!component.anchor && component.items && !Ext.isNumber(component.width) && !(Ext.isIE6 && Ext.isStrict)){
+                component.anchor = this.defaultAnchor;
+            }
+
+            if(component.anchor) {
+                anchorSpec = component.anchorSpec;
+                
+                if(!anchorSpec){
+                    anchorsArray = component.anchor.split(' ');
+                    component.anchorSpec = anchorSpec = {
+                        right: this.parseAnchor(anchorsArray[0], component.initialConfig.width, anchorWidth),
+                        bottom: this.parseAnchor(anchorsArray[1], component.initialConfig.height, anchorHeight)
+                    };
+                }
+                calcWidth = anchorSpec.right ? this.adjustWidthAnchor(anchorSpec.right(containerWidth) - el.getMargins('lr'), component) : undefined;
+                calcHeight = anchorSpec.bottom ? this.adjustHeightAnchor(anchorSpec.bottom(containerHeight) - el.getMargins('tb'), component) : undefined;
+
+                if(calcWidth || calcHeight) {
+                    boxes.push({
+                        component: component,
+                        width: calcWidth || undefined,
+                        height: calcHeight || undefined
+                    });
+                }
+            }
+        }
+        for (i = 0, len = boxes.length; i < len; i++) {
+            box = boxes[i];
+            box.component.setSize(box.width, box.height);
+        }
+
+        if (overflow && overflow != 'hidden' && !this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != size.width || newTargetSize.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    
+    parseAnchor : function(a, start, cstart) {
+        if (a && a != 'none') {
+            var last;
+            
+            if (this.parseAnchorRE.test(a)) {
+                var diff = cstart - start;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return v - diff;
+                    }
+                };
+            
+            } else if(a.indexOf('%') != -1) {
+                var ratio = parseFloat(a.replace('%', ''))*.01;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return Math.floor(v*ratio);
+                    }
+                };
+            
+            } else {
+                a = parseInt(a, 10);
+                if (!isNaN(a)) {
+                    return function(v) {
+                        if (v !== last) {
+                            last = v;
+                            return v + a;
+                        }
+                    };
+                }
+            }
+        }
+        return false;
+    },
+
+    
+    adjustWidthAnchor : function(value, comp){
+        return value;
+    },
+
+    
+    adjustHeightAnchor : function(value, comp){
+        return value;
+    }
+
+    
+});
+Ext.Container.LAYOUTS['anchor'] = Ext.layout.AnchorLayout;
+
+Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+    monitorResize:true,
+
+    type: 'column',
+
+    extraCls: 'x-column',
+
+    scrollOffset : 0,
+
+    
+
+    targetCls: 'x-column-layout-ct',
+
+    isValidParent : function(c, target){
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        if (target) {
+            ret = target.getViewSize();
+
+            
+            
+            
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    renderAll : function(ct, target) {
+        if(!this.innerCt){
+            
+            
+            this.innerCt = target.createChild({cls:'x-column-inner'});
+            this.innerCt.createChild({cls:'x-clear'});
+        }
+        Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    
+    onLayout : function(ct, target){
+        var cs = ct.items.items,
+            len = cs.length,
+            c,
+            i,
+            m,
+            margins = [];
+
+        this.renderAll(ct, target);
+
+        var size = this.getLayoutTargetSize();
+
+        if(size.width < 1 && size.height < 1){ 
+            return;
+        }
+
+        var w = size.width - this.scrollOffset,
+            h = size.height,
+            pw = w;
+
+        this.innerCt.setWidth(w);
+
+        
+        
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = c.getPositionEl().getMargins('lr');
+            margins[i] = m;
+            if(!c.columnWidth){
+                pw -= (c.getWidth() + m);
+            }
+        }
+
+        pw = pw < 0 ? 0 : pw;
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = margins[i];
+            if(c.columnWidth){
+                c.setSize(Math.floor(c.columnWidth * pw) - m);
+            }
+        }
+
+        
+        
+        if (Ext.isIE) {
+            if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+                var ts = this.getLayoutTargetSize();
+                if (ts.width != size.width){
+                    this.adjustmentPass = true;
+                    this.onLayout(ct, target);
+                }
+            }
+        }
+        delete this.adjustmentPass;
+    }
+
+    
+});
+
+Ext.Container.LAYOUTS['column'] = Ext.layout.ColumnLayout;
+
+Ext.layout.BorderLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+    monitorResize:true,
+    
+    rendered : false,
+
+    type: 'border',
+
+    targetCls: 'x-border-layout-ct',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        return target ? target.getViewSize() : {};
+    },
+
+    
+    onLayout : function(ct, target){
+        var collapsed, i, c, pos, items = ct.items.items, len = items.length;
+        if(!this.rendered){
+            collapsed = [];
+            for(i = 0; i < len; i++) {
+                c = items[i];
+                pos = c.region;
+                if(c.collapsed){
+                    collapsed.push(c);
+                }
+                c.collapsed = false;
+                if(!c.rendered){
+                    c.render(target, i);
+                    c.getPositionEl().addClass('x-border-panel');
+                }
+                this[pos] = pos != 'center' && c.split ?
+                    new Ext.layout.BorderLayout.SplitRegion(this, c.initialConfig, pos) :
+                    new Ext.layout.BorderLayout.Region(this, c.initialConfig, pos);
+                this[pos].render(target, c);
+            }
+            this.rendered = true;
+        }
+
+        var size = this.getLayoutTargetSize();
+        if(size.width < 20 || size.height < 20){ 
+            if(collapsed){
+                this.restoreCollapsed = collapsed;
+            }
+            return;
+        }else if(this.restoreCollapsed){
+            collapsed = this.restoreCollapsed;
+            delete this.restoreCollapsed;
+        }
+
+        var w = size.width, h = size.height,
+            centerW = w, centerH = h, centerY = 0, centerX = 0,
+            n = this.north, s = this.south, west = this.west, e = this.east, c = this.center,
+            b, m, totalWidth, totalHeight;
+        if(!c && Ext.layout.BorderLayout.WARN !== false){
+            throw 'No center region defined in BorderLayout ' + ct.id;
+        }
+
+        if(n && n.isVisible()){
+            b = n.getSize();
+            m = n.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            b.y = m.top;
+            centerY = b.height + b.y + m.bottom;
+            centerH -= centerY;
+            n.applyLayout(b);
+        }
+        if(s && s.isVisible()){
+            b = s.getSize();
+            m = s.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            totalHeight = (b.height + m.top + m.bottom);
+            b.y = h - totalHeight + m.top;
+            centerH -= totalHeight;
+            s.applyLayout(b);
+        }
+        if(west && west.isVisible()){
+            b = west.getSize();
+            m = west.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            b.x = m.left;
+            b.y = centerY + m.top;
+            totalWidth = (b.width + m.left + m.right);
+            centerX += totalWidth;
+            centerW -= totalWidth;
+            west.applyLayout(b);
+        }
+        if(e && e.isVisible()){
+            b = e.getSize();
+            m = e.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            totalWidth = (b.width + m.left + m.right);
+            b.x = w - totalWidth + m.left;
+            b.y = centerY + m.top;
+            centerW -= totalWidth;
+            e.applyLayout(b);
+        }
+        if(c){
+            m = c.getMargins();
+            var centerBox = {
+                x: centerX + m.left,
+                y: centerY + m.top,
+                width: centerW - (m.left+m.right),
+                height: centerH - (m.top+m.bottom)
+            };
+            c.applyLayout(centerBox);
+        }
+        if(collapsed){
+            for(i = 0, len = collapsed.length; i < len; i++){
+                collapsed[i].collapse(false);
+            }
+        }
+        if(Ext.isIE && Ext.isStrict){ 
+            target.repaint();
+        }
+        
+        if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+            var ts = this.getLayoutTargetSize();
+            if (ts.width != size.width || ts.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(ct, target);
+            }
+        }
+        delete this.adjustmentPass;
+    },
+
+    destroy: function() {
+        var r = ['north', 'south', 'east', 'west'], i, region;
+        for (i = 0; i < r.length; i++) {
+            region = this[r[i]];
+            if(region){
+                if(region.destroy){
+                    region.destroy();
+                }else if (region.split){
+                    region.split.destroy(true);
+                }
+            }
+        }
+        Ext.layout.BorderLayout.superclass.destroy.call(this);
+    }
+
+    
+});
+
+
+Ext.layout.BorderLayout.Region = function(layout, config, pos){
+    Ext.apply(this, config);
+    this.layout = layout;
+    this.position = pos;
+    this.state = {};
+    if(typeof this.margins == 'string'){
+        this.margins = this.layout.parseMargins(this.margins);
+    }
+    this.margins = Ext.applyIf(this.margins || {}, this.defaultMargins);
+    if(this.collapsible){
+        if(typeof this.cmargins == 'string'){
+            this.cmargins = this.layout.parseMargins(this.cmargins);
+        }
+        if(this.collapseMode == 'mini' && !this.cmargins){
+            this.cmargins = {left:0,top:0,right:0,bottom:0};
+        }else{
+            this.cmargins = Ext.applyIf(this.cmargins || {},
+                pos == 'north' || pos == 'south' ? this.defaultNSCMargins : this.defaultEWCMargins);
+        }
+    }
+};
+
+Ext.layout.BorderLayout.Region.prototype = {
+    
+    
+    
+    
+    
+    
+    collapsible : false,
+    
+    split:false,
+    
+    floatable: true,
+    
+    minWidth:50,
+    
+    minHeight:50,
+
+    
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    
+    defaultNSCMargins : {left:5,top:5,right:5,bottom:5},
+    
+    defaultEWCMargins : {left:5,top:0,right:5,bottom:0},
+    floatingZIndex: 100,
+
+    
+    isCollapsed : false,
+
+    
+    
+    
+
+    
+    render : function(ct, p){
+        this.panel = p;
+        p.el.enableDisplayMode();
+        this.targetEl = ct;
+        this.el = p.el;
+
+        var gs = p.getState, ps = this.position;
+        p.getState = function(){
+            return Ext.apply(gs.call(p) || {}, this.state);
+        }.createDelegate(this);
+
+        if(ps != 'center'){
+            p.allowQueuedExpand = false;
+            p.on({
+                beforecollapse: this.beforeCollapse,
+                collapse: this.onCollapse,
+                beforeexpand: this.beforeExpand,
+                expand: this.onExpand,
+                hide: this.onHide,
+                show: this.onShow,
+                scope: this
+            });
+            if(this.collapsible || this.floatable){
+                p.collapseEl = 'el';
+                p.slideAnchor = this.getSlideAnchor();
+            }
+            if(p.tools && p.tools.toggle){
+                p.tools.toggle.addClass('x-tool-collapse-'+ps);
+                p.tools.toggle.addClassOnOver('x-tool-collapse-'+ps+'-over');
+            }
+        }
+    },
+
+    
+    getCollapsedEl : function(){
+        if(!this.collapsedEl){
+            if(!this.toolTemplate){
+                var tt = new Ext.Template(
+                     '<div class="x-tool x-tool-{id}">&#160;</div>'
+                );
+                tt.disableFormats = true;
+                tt.compile();
+                Ext.layout.BorderLayout.Region.prototype.toolTemplate = tt;
+            }
+            this.collapsedEl = this.targetEl.createChild({
+                cls: "x-layout-collapsed x-layout-collapsed-"+this.position,
+                id: this.panel.id + '-xcollapsed'
+            });
+            this.collapsedEl.enableDisplayMode('block');
+
+            if(this.collapseMode == 'mini'){
+                this.collapsedEl.addClass('x-layout-cmini-'+this.position);
+                this.miniCollapsedEl = this.collapsedEl.createChild({
+                    cls: "x-layout-mini x-layout-mini-"+this.position, html: "&#160;"
+                });
+                this.miniCollapsedEl.addClassOnOver('x-layout-mini-over');
+                this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                this.collapsedEl.on('click', this.onExpandClick, this, {stopEvent:true});
+            }else {
+                if(this.collapsible !== false && !this.hideCollapseTool) {
+                    var t = this.expandToolEl = this.toolTemplate.append(
+                            this.collapsedEl.dom,
+                            {id:'expand-'+this.position}, true);
+                    t.addClassOnOver('x-tool-expand-'+this.position+'-over');
+                    t.on('click', this.onExpandClick, this, {stopEvent:true});
+                }
+                if(this.floatable !== false || this.titleCollapse){
+                   this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                   this.collapsedEl.on("click", this[this.floatable ? 'collapseClick' : 'onExpandClick'], this);
+                }
+            }
+        }
+        return this.collapsedEl;
+    },
+
+    
+    onExpandClick : function(e){
+        if(this.isSlid){
+            this.panel.expand(false);
+        }else{
+            this.panel.expand();
+        }
+    },
+
+    
+    onCollapseClick : function(e){
+        this.panel.collapse();
+    },
+
+    
+    beforeCollapse : function(p, animate){
+        this.lastAnim = animate;
+        if(this.splitEl){
+            this.splitEl.hide();
+        }
+        this.getCollapsedEl().show();
+        var el = this.panel.getEl();
+        this.originalZIndex = el.getStyle('z-index');
+        el.setStyle('z-index', 100);
+        this.isCollapsed = true;
+        this.layout.layout();
+    },
+
+    
+    onCollapse : function(animate){
+        this.panel.el.setStyle('z-index', 1);
+        if(this.lastAnim === false || this.panel.animCollapse === false){
+            this.getCollapsedEl().dom.style.visibility = 'visible';
+        }else{
+            this.getCollapsedEl().slideIn(this.panel.slideAnchor, {duration:.2});
+        }
+        this.state.collapsed = true;
+        this.panel.saveState();
+    },
+
+    
+    beforeExpand : function(animate){
+        if(this.isSlid){
+            this.afterSlideIn();
+        }
+        var c = this.getCollapsedEl();
+        this.el.show();
+        if(this.position == 'east' || this.position == 'west'){
+            this.panel.setSize(undefined, c.getHeight());
+        }else{
+            this.panel.setSize(c.getWidth(), undefined);
+        }
+        c.hide();
+        c.dom.style.visibility = 'hidden';
+        this.panel.el.setStyle('z-index', this.floatingZIndex);
+    },
+
+    
+    onExpand : function(){
+        this.isCollapsed = false;
+        if(this.splitEl){
+            this.splitEl.show();
+        }
+        this.layout.layout();
+        this.panel.el.setStyle('z-index', this.originalZIndex);
+        this.state.collapsed = false;
+        this.panel.saveState();
+    },
+
+    
+    collapseClick : function(e){
+        if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+        }else{
+           e.stopPropagation();
+           this.slideOut();
+        }
+    },
+
+    
+    onHide : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().hide();
+        }else if(this.splitEl){
+            this.splitEl.hide();
+        }
+    },
+
+    
+    onShow : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().show();
+        }else if(this.splitEl){
+            this.splitEl.show();
+        }
+    },
+
+    
+    isVisible : function(){
+        return !this.panel.hidden;
+    },
+
+    
+    getMargins : function(){
+        return this.isCollapsed && this.cmargins ? this.cmargins : this.margins;
+    },
+
+    
+    getSize : function(){
+        return this.isCollapsed ? this.getCollapsedEl().getSize() : this.panel.getSize();
+    },
+
+    
+    setPanel : function(panel){
+        this.panel = panel;
+    },
+
+    
+    getMinWidth: function(){
+        return this.minWidth;
+    },
+
+    
+    getMinHeight: function(){
+        return this.minHeight;
+    },
+
+    
+    applyLayoutCollapsed : function(box){
+        var ce = this.getCollapsedEl();
+        ce.setLeftTop(box.x, box.y);
+        ce.setSize(box.width, box.height);
+    },
+
+    
+    applyLayout : function(box){
+        if(this.isCollapsed){
+            this.applyLayoutCollapsed(box);
+        }else{
+            this.panel.setPosition(box.x, box.y);
+            this.panel.setSize(box.width, box.height);
+        }
+    },
+
+    
+    beforeSlide: function(){
+        this.panel.beforeEffect();
+    },
+
+    
+    afterSlide : function(){
+        this.panel.afterEffect();
+    },
+
+    
+    initAutoHide : function(){
+        if(this.autoHide !== false){
+            if(!this.autoHideHd){
+                this.autoHideSlideTask = new Ext.util.DelayedTask(this.slideIn, this);
+                this.autoHideHd = {
+                    "mouseout": function(e){
+                        if(!e.within(this.el, true)){
+                            this.autoHideSlideTask.delay(500);
+                        }
+                    },
+                    "mouseover" : function(e){
+                        this.autoHideSlideTask.cancel();
+                    },
+                    scope : this
+                };
+            }
+            this.el.on(this.autoHideHd);
+            this.collapsedEl.on(this.autoHideHd);
+        }
+    },
+
+    
+    clearAutoHide : function(){
+        if(this.autoHide !== false){
+            this.el.un("mouseout", this.autoHideHd.mouseout);
+            this.el.un("mouseover", this.autoHideHd.mouseover);
+            this.collapsedEl.un("mouseout", this.autoHideHd.mouseout);
+            this.collapsedEl.un("mouseover", this.autoHideHd.mouseover);
+        }
+    },
+
+    
+    clearMonitor : function(){
+        Ext.getDoc().un("click", this.slideInIf, this);
+    },
+
+    
+    slideOut : function(){
+        if(this.isSlid || this.el.hasActiveFx()){
+            return;
+        }
+        this.isSlid = true;
+        var ts = this.panel.tools, dh, pc;
+        if(ts && ts.toggle){
+            ts.toggle.hide();
+        }
+        this.el.show();
+
+        
+        pc = this.panel.collapsed;
+        this.panel.collapsed = false;
+
+        if(this.position == 'east' || this.position == 'west'){
+            
+            dh = this.panel.deferHeight;
+            this.panel.deferHeight = false;
+
+            this.panel.setSize(undefined, this.collapsedEl.getHeight());
+
+            
+            this.panel.deferHeight = dh;
+        }else{
+            this.panel.setSize(this.collapsedEl.getWidth(), undefined);
+        }
+
+        
+        this.panel.collapsed = pc;
+
+        this.restoreLT = [this.el.dom.style.left, this.el.dom.style.top];
+        this.el.alignTo(this.collapsedEl, this.getCollapseAnchor());
+        this.el.setStyle("z-index", this.floatingZIndex+2);
+        this.panel.el.replaceClass('x-panel-collapsed', 'x-panel-floating');
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideIn(this.getSlideAnchor(), {
+                callback: function(){
+                    this.afterSlide();
+                    this.initAutoHide();
+                    Ext.getDoc().on("click", this.slideInIf, this);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.initAutoHide();
+             Ext.getDoc().on("click", this.slideInIf, this);
+        }
+    },
+
+    
+    afterSlideIn : function(){
+        this.clearAutoHide();
+        this.isSlid = false;
+        this.clearMonitor();
+        this.el.setStyle("z-index", "");
+        this.panel.el.replaceClass('x-panel-floating', 'x-panel-collapsed');
+        this.el.dom.style.left = this.restoreLT[0];
+        this.el.dom.style.top = this.restoreLT[1];
+
+        var ts = this.panel.tools;
+        if(ts && ts.toggle){
+            ts.toggle.show();
+        }
+    },
+
+    
+    slideIn : function(cb){
+        if(!this.isSlid || this.el.hasActiveFx()){
+            Ext.callback(cb);
+            return;
+        }
+        this.isSlid = false;
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideOut(this.getSlideAnchor(), {
+                callback: function(){
+                    this.el.hide();
+                    this.afterSlide();
+                    this.afterSlideIn();
+                    Ext.callback(cb);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.el.hide();
+            this.afterSlideIn();
+        }
+    },
+
+    
+    slideInIf : function(e){
+        if(!e.within(this.el)){
+            this.slideIn();
+        }
+    },
+
+    
+    anchors : {
+        "west" : "left",
+        "east" : "right",
+        "north" : "top",
+        "south" : "bottom"
+    },
+
+    
+    sanchors : {
+        "west" : "l",
+        "east" : "r",
+        "north" : "t",
+        "south" : "b"
+    },
+
+    
+    canchors : {
+        "west" : "tl-tr",
+        "east" : "tr-tl",
+        "north" : "tl-bl",
+        "south" : "bl-tl"
+    },
+
+    
+    getAnchor : function(){
+        return this.anchors[this.position];
+    },
+
+    
+    getCollapseAnchor : function(){
+        return this.canchors[this.position];
+    },
+
+    
+    getSlideAnchor : function(){
+        return this.sanchors[this.position];
+    },
+
+    
+    getAlignAdj : function(){
+        var cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [0, 0];
+            break;
+            case "east":
+                return [0, 0];
+            break;
+            case "north":
+                return [0, 0];
+            break;
+            case "south":
+                return [0, 0];
+            break;
+        }
+    },
+
+    
+    getExpandAdj : function(){
+        var c = this.collapsedEl, cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [-(cm.right+c.getWidth()+cm.left), 0];
+            break;
+            case "east":
+                return [cm.right+c.getWidth()+cm.left, 0];
+            break;
+            case "north":
+                return [0, -(cm.top+cm.bottom+c.getHeight())];
+            break;
+            case "south":
+                return [0, cm.top+cm.bottom+c.getHeight()];
+            break;
+        }
+    },
+
+    destroy : function(){
+        if (this.autoHideSlideTask && this.autoHideSlideTask.cancel){
+            this.autoHideSlideTask.cancel();
+        }
+        Ext.destroyMembers(this, 'miniCollapsedEl', 'collapsedEl', 'expandToolEl');
+    }
+};
+
+
+Ext.layout.BorderLayout.SplitRegion = function(layout, config, pos){
+    Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this, layout, config, pos);
+    
+    this.applyLayout = this.applyFns[pos];
+};
+
+Ext.extend(Ext.layout.BorderLayout.SplitRegion, Ext.layout.BorderLayout.Region, {
+    
+    
+    splitTip : "Drag to resize.",
+    
+    collapsibleSplitTip : "Drag to resize. Double click to hide.",
+    
+    useSplitTips : false,
+
+    
+    splitSettings : {
+        north : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.TOP,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        south : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.BOTTOM,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        east : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.RIGHT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        },
+        west : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.LEFT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        }
+    },
+
+    
+    applyFns : {
+        west : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            this.panel.setPosition(box.x, box.y);
+            var sw = sd.offsetWidth;
+            s.left = (box.x+box.width-sw)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        east : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sw = sd.offsetWidth;
+            this.panel.setPosition(box.x+sw, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        north : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y+box.height-sh)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        },
+        south : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y+sh);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        }
+    },
+
+    
+    render : function(ct, p){
+        Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this, ct, p);
+
+        var ps = this.position;
+
+        this.splitEl = ct.createChild({
+            cls: "x-layout-split x-layout-split-"+ps, html: "&#160;",
+            id: this.panel.id + '-xsplit'
+        });
+
+        if(this.collapseMode == 'mini'){
+            this.miniSplitEl = this.splitEl.createChild({
+                cls: "x-layout-mini x-layout-mini-"+ps, html: "&#160;"
+            });
+            this.miniSplitEl.addClassOnOver('x-layout-mini-over');
+            this.miniSplitEl.on('click', this.onCollapseClick, this, {stopEvent:true});
+        }
+
+        var s = this.splitSettings[ps];
+
+        this.split = new Ext.SplitBar(this.splitEl.dom, p.el, s.orientation);
+        this.split.tickSize = this.tickSize;
+        this.split.placement = s.placement;
+        this.split.getMaximumSize = this[s.maxFn].createDelegate(this);
+        this.split.minSize = this.minSize || this[s.minProp];
+        this.split.on("beforeapply", this.onSplitMove, this);
+        this.split.useShim = this.useShim === true;
+        this.maxSize = this.maxSize || this[s.maxProp];
+
+        if(p.hidden){
+            this.splitEl.hide();
+        }
+
+        if(this.useSplitTips){
+            this.splitEl.dom.title = this.collapsible ? this.collapsibleSplitTip : this.splitTip;
+        }
+        if(this.collapsible){
+            this.splitEl.on("dblclick", this.onCollapseClick,  this);
+        }
+    },
+
+    
+    getSize : function(){
+        if(this.isCollapsed){
+            return this.collapsedEl.getSize();
+        }
+        var s = this.panel.getSize();
+        if(this.position == 'north' || this.position == 'south'){
+            s.height += this.splitEl.dom.offsetHeight;
+        }else{
+            s.width += this.splitEl.dom.offsetWidth;
+        }
+        return s;
+    },
+
+    
+    getHMaxSize : function(){
+         var cmax = this.maxSize || 10000;
+         var center = this.layout.center;
+         return Math.min(cmax, (this.el.getWidth()+center.el.getWidth())-center.getMinWidth());
+    },
+
+    
+    getVMaxSize : function(){
+        var cmax = this.maxSize || 10000;
+        var center = this.layout.center;
+        return Math.min(cmax, (this.el.getHeight()+center.el.getHeight())-center.getMinHeight());
+    },
+
+    
+    onSplitMove : function(split, newSize){
+        var s = this.panel.getSize();
+        this.lastSplitSize = newSize;
+        if(this.position == 'north' || this.position == 'south'){
+            this.panel.setSize(s.width, newSize);
+            this.state.height = newSize;
+        }else{
+            this.panel.setSize(newSize, s.height);
+            this.state.width = newSize;
+        }
+        this.layout.layout();
+        this.panel.saveState();
+        return false;
+    },
+
+    
+    getSplitBar : function(){
+        return this.split;
+    },
+
+    
+    destroy : function() {
+        Ext.destroy(this.miniSplitEl, this.split, this.splitEl);
+        Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS['border'] = Ext.layout.BorderLayout;
+
+Ext.layout.FormLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    
+    labelSeparator : ':',
+
+    
+
+    
+    trackLabels: true,
+
+    type: 'form',
+
+    onRemove: function(c){
+        Ext.layout.FormLayout.superclass.onRemove.call(this, c);
+        if(this.trackLabels){
+            c.un('show', this.onFieldShow, this);
+            c.un('hide', this.onFieldHide, this);
+        }
+        
+        var el = c.getPositionEl(),
+            ct = c.getItemCt && c.getItemCt();
+        if (c.rendered && ct) {
+            if (el && el.dom) {
+                el.insertAfter(ct);
+            }
+            Ext.destroy(ct);
+            Ext.destroyMembers(c, 'label', 'itemCt');
+            if (c.customItemCt) {
+                Ext.destroyMembers(c, 'getItemCt', 'customItemCt');
+            }
+        }
+    },
+
+    
+    setContainer : function(ct){
+        Ext.layout.FormLayout.superclass.setContainer.call(this, ct);
+        if(ct.labelAlign){
+            ct.addClass('x-form-label-'+ct.labelAlign);
+        }
+
+        if(ct.hideLabels){
+            Ext.apply(this, {
+                labelStyle: 'display:none',
+                elementStyle: 'padding-left:0;',
+                labelAdjust: 0
+            });
+        }else{
+            this.labelSeparator = Ext.isDefined(ct.labelSeparator) ? ct.labelSeparator : this.labelSeparator;
+            ct.labelWidth = ct.labelWidth || 100;
+            if(Ext.isNumber(ct.labelWidth)){
+                var pad = Ext.isNumber(ct.labelPad) ? ct.labelPad : 5;
+                Ext.apply(this, {
+                    labelAdjust: ct.labelWidth + pad,
+                    labelStyle: 'width:' + ct.labelWidth + 'px;',
+                    elementStyle: 'padding-left:' + (ct.labelWidth + pad) + 'px'
+                });
+            }
+            if(ct.labelAlign == 'top'){
+                Ext.apply(this, {
+                    labelStyle: 'width:auto;',
+                    labelAdjust: 0,
+                    elementStyle: 'padding-left:0;'
+                });
+            }
+        }
+    },
+
+    
+    isHide: function(c){
+        return c.hideLabel || this.container.hideLabels;
+    },
+
+    onFieldShow: function(c){
+        c.getItemCt().removeClass('x-hide-' + c.hideMode);
+
+        
+        if (c.isComposite) {
+            c.doLayout();
+        }
+    },
+
+    onFieldHide: function(c){
+        c.getItemCt().addClass('x-hide-' + c.hideMode);
+    },
+
+    
+    getLabelStyle: function(s){
+        var ls = '', items = [this.labelStyle, s];
+        for (var i = 0, len = items.length; i < len; ++i){
+            if (items[i]){
+                ls += items[i];
+                if (ls.substr(-1, 1) != ';'){
+                    ls += ';';
+                }
+            }
+        }
+        return ls;
+    },
+
+    
+
+    
+    renderItem : function(c, position, target){
+        if(c && (c.isFormField || c.fieldLabel) && c.inputType != 'hidden'){
+            var args = this.getTemplateArgs(c);
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position] || null;
+            }
+            if(position){
+                c.itemCt = this.fieldTpl.insertBefore(position, args, true);
+            }else{
+                c.itemCt = this.fieldTpl.append(target, args, true);
+            }
+            if(!c.getItemCt){
+                
+                
+                Ext.apply(c, {
+                    getItemCt: function(){
+                        return c.itemCt;
+                    },
+                    customItemCt: true
+                });
+            }
+            c.label = c.getItemCt().child('label.x-form-item-label');
+            if(!c.rendered){
+                c.render('x-form-el-' + c.id);
+            }else if(!this.isValidParent(c, target)){
+                Ext.fly('x-form-el-' + c.id).appendChild(c.getPositionEl());
+            }
+            if(this.trackLabels){
+                if(c.hidden){
+                    this.onFieldHide(c);
+                }
+                c.on({
+                    scope: this,
+                    show: this.onFieldShow,
+                    hide: this.onFieldHide
+                });
+            }
+            this.configureItem(c);
+        }else {
+            Ext.layout.FormLayout.superclass.renderItem.apply(this, arguments);
+        }
+    },
+
+    
+    getTemplateArgs: function(field) {
+        var noLabelSep = !field.fieldLabel || field.hideLabel,
+            itemCls = (field.itemCls || this.container.itemCls || '') + (field.hideLabel ? ' x-hide-label' : '');
+
+        
+        if (Ext.isIE9 && Ext.isIEQuirks && field instanceof Ext.form.TextField) {
+            itemCls += ' x-input-wrapper';
+        }
+
+        return {
+            id            : field.id,
+            label         : field.fieldLabel,
+            itemCls       : itemCls,
+            clearCls      : field.clearCls || 'x-form-clear-left',
+            labelStyle    : this.getLabelStyle(field.labelStyle),
+            elementStyle  : this.elementStyle || '',
+            labelSeparator: noLabelSep ? '' : (Ext.isDefined(field.labelSeparator) ? field.labelSeparator : this.labelSeparator)
+        };
+    },
+
+    
+    adjustWidthAnchor: function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign != 'top')){
+            var adjust = Ext.isIE6 || (Ext.isIE && !Ext.isStrict);
+            return value - this.labelAdjust + (adjust ? -3 : 0);
+        }
+        return value;
+    },
+
+    adjustHeightAnchor : function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign == 'top')){
+            return value - c.label.getHeight();
+        }
+        return value;
+    },
+
+    
+    isValidParent : function(c, target){
+        return target && this.container.getEl().contains(c.getPositionEl());
+    }
+
+    
+});
+
+Ext.Container.LAYOUTS['form'] = Ext.layout.FormLayout;
+
+Ext.layout.AccordionLayout = Ext.extend(Ext.layout.FitLayout, {
+    
+    fill : true,
+    
+    autoWidth : true,
+    
+    titleCollapse : true,
+    
+    hideCollapseTool : false,
+    
+    collapseFirst : false,
+    
+    animate : false,
+    
+    sequence : false,
+    
+    activeOnTop : false,
+
+    type: 'accordion',
+
+    renderItem : function(c){
+        if(this.animate === false){
+            c.animCollapse = false;
+        }
+        c.collapsible = true;
+        if(this.autoWidth){
+            c.autoWidth = true;
+        }
+        if(this.titleCollapse){
+            c.titleCollapse = true;
+        }
+        if(this.hideCollapseTool){
+            c.hideCollapseTool = true;
+        }
+        if(this.collapseFirst !== undefined){
+            c.collapseFirst = this.collapseFirst;
+        }
+        if(!this.activeItem && !c.collapsed){
+            this.setActiveItem(c, true);
+        }else if(this.activeItem && this.activeItem != c){
+            c.collapsed = true;
+        }
+        Ext.layout.AccordionLayout.superclass.renderItem.apply(this, arguments);
+        c.header.addClass('x-accordion-hd');
+        c.on('beforeexpand', this.beforeExpand, this);
+    },
+
+    onRemove: function(c){
+        Ext.layout.AccordionLayout.superclass.onRemove.call(this, c);
+        if(c.rendered){
+            c.header.removeClass('x-accordion-hd');
+        }
+        c.un('beforeexpand', this.beforeExpand, this);
+    },
+
+    
+    beforeExpand : function(p, anim){
+        var ai = this.activeItem;
+        if(ai){
+            if(this.sequence){
+                delete this.activeItem;
+                if (!ai.collapsed){
+                    ai.collapse({callback:function(){
+                        p.expand(anim || true);
+                    }, scope: this});
+                    return false;
+                }
+            }else{
+                ai.collapse(this.animate);
+            }
+        }
+        this.setActive(p);
+        if(this.activeOnTop){
+            p.el.dom.parentNode.insertBefore(p.el.dom, p.el.dom.parentNode.firstChild);
+        }
+        
+        this.layout();
+    },
+
+    
+    setItemSize : function(item, size){
+        if(this.fill && item){
+            var hh = 0, i, ct = this.getRenderedItems(this.container), len = ct.length, p;
+            
+            for (i = 0; i < len; i++) {
+                if((p = ct[i]) != item && !p.hidden){
+                    hh += p.header.getHeight();
+                }
+            };
+            
+            size.height -= hh;
+            
+            
+            item.setSize(size);
+        }
+    },
+
+    
+    setActiveItem : function(item){
+        this.setActive(item, true);
+    },
+
+    
+    setActive : function(item, expand){
+        var ai = this.activeItem;
+        item = this.container.getComponent(item);
+        if(ai != item){
+            if(item.rendered && item.collapsed && expand){
+                item.expand();
+            }else{
+                if(ai){
+                   ai.fireEvent('deactivate', ai);
+                }
+                this.activeItem = item;
+                item.fireEvent('activate', item);
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS.accordion = Ext.layout.AccordionLayout;
+
+
+Ext.layout.Accordion = Ext.layout.AccordionLayout;
+Ext.layout.TableLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+
+    
+    monitorResize:false,
+
+    type: 'table',
+
+    targetCls: 'x-table-layout-ct',
+
+    
+    tableAttrs:null,
+
+    
+    setContainer : function(ct){
+        Ext.layout.TableLayout.superclass.setContainer.call(this, ct);
+
+        this.currentRow = 0;
+        this.currentColumn = 0;
+        this.cells = [];
+    },
+    
+    
+    onLayout : function(ct, target){
+        var cs = ct.items.items, len = cs.length, c, i;
+
+        if(!this.table){
+            target.addClass('x-table-layout-ct');
+
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        this.renderAll(ct, target);
+    },
+
+    
+    getRow : function(index){
+        var row = this.table.tBodies[0].childNodes[index];
+        if(!row){
+            row = document.createElement('tr');
+            this.table.tBodies[0].appendChild(row);
+        }
+        return row;
+    },
+
+    
+    getNextCell : function(c){
+        var cell = this.getNextNonSpan(this.currentColumn, this.currentRow);
+        var curCol = this.currentColumn = cell[0], curRow = this.currentRow = cell[1];
+        for(var rowIndex = curRow; rowIndex < curRow + (c.rowspan || 1); rowIndex++){
+            if(!this.cells[rowIndex]){
+                this.cells[rowIndex] = [];
+            }
+            for(var colIndex = curCol; colIndex < curCol + (c.colspan || 1); colIndex++){
+                this.cells[rowIndex][colIndex] = true;
+            }
+        }
+        var td = document.createElement('td');
+        if(c.cellId){
+            td.id = c.cellId;
+        }
+        var cls = 'x-table-layout-cell';
+        if(c.cellCls){
+            cls += ' ' + c.cellCls;
+        }
+        td.className = cls;
+        if(c.colspan){
+            td.colSpan = c.colspan;
+        }
+        if(c.rowspan){
+            td.rowSpan = c.rowspan;
+        }
+        this.getRow(curRow).appendChild(td);
+        return td;
+    },
+
+    
+    getNextNonSpan: function(colIndex, rowIndex){
+        var cols = this.columns;
+        while((cols && colIndex >= cols) || (this.cells[rowIndex] && this.cells[rowIndex][colIndex])) {
+            if(cols && colIndex >= cols){
+                rowIndex++;
+                colIndex = 0;
+            }else{
+                colIndex++;
+            }
+        }
+        return [colIndex, rowIndex];
+    },
+
+    
+    renderItem : function(c, position, target){
+        
+        if(!this.table){
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        if(c && !c.rendered){
+            c.render(this.getNextCell(c));
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            var container = this.getNextCell(c);
+            container.insertBefore(c.getPositionEl().dom, null);
+            c.container = Ext.get(container);
+            this.configureItem(c);
+        }
+    },
+
+    
+    isValidParent : function(c, target){
+        return c.getPositionEl().up('table', 5).dom.parentNode === (target.dom || target);
+    },
+    
+    destroy: function(){
+        delete this.table;
+        Ext.layout.TableLayout.superclass.destroy.call(this);
+    }
+
+    
+});
+
+Ext.Container.LAYOUTS['table'] = Ext.layout.TableLayout;
+Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    extraCls: 'x-abs-layout-item',
+
+    type: 'absolute',
+
+    onLayout : function(ct, target){
+        target.position();
+        this.paddingLeft = target.getPadding('l');
+        this.paddingTop = target.getPadding('t');
+        Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);
+    },
+
+    
+    adjustWidthAnchor : function(value, comp){
+        return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;
+    },
+
+    
+    adjustHeightAnchor : function(value, comp){
+        return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;
+    }
+    
+});
+Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;
+
+Ext.layout.BoxLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    
+    padding : '0',
+    
+    pack : 'start',
+
+    
+    monitorResize : true,
+    type: 'box',
+    scrollOffset : 0,
+    extraCls : 'x-box-item',
+    targetCls : 'x-box-layout-ct',
+    innerCls : 'x-box-inner',
+
+    constructor : function(config){
+        Ext.layout.BoxLayout.superclass.constructor.call(this, config);
+
+        if (Ext.isString(this.defaultMargins)) {
+            this.defaultMargins = this.parseMargins(this.defaultMargins);
+        }
+        
+        var handler = this.overflowHandler;
+        
+        if (typeof handler == 'string') {
+            handler = {
+                type: handler
+            };
+        }
+        
+        var handlerType = 'none';
+        if (handler && handler.type != undefined) {
+            handlerType = handler.type;
+        }
+        
+        var constructor = Ext.layout.boxOverflow[handlerType];
+        if (constructor[this.type]) {
+            constructor = constructor[this.type];
+        }
+        
+        this.overflowHandler = new constructor(this, handler);
+    },
+
+    
+    onLayout: function(container, target) {
+        Ext.layout.BoxLayout.superclass.onLayout.call(this, container, target);
+
+        var tSize = this.getLayoutTargetSize(),
+            items = this.getVisibleItems(container),
+            calcs = this.calculateChildBoxes(items, tSize),
+            boxes = calcs.boxes,
+            meta  = calcs.meta;
+        
+        
+        if (tSize.width > 0) {
+            var handler = this.overflowHandler,
+                method  = meta.tooNarrow ? 'handleOverflow' : 'clearOverflow';
+            
+            var results = handler[method](calcs, tSize);
+            
+            if (results) {
+                if (results.targetSize) {
+                    tSize = results.targetSize;
+                }
+                
+                if (results.recalculate) {
+                    items = this.getVisibleItems(container);
+                    calcs = this.calculateChildBoxes(items, tSize);
+                    boxes = calcs.boxes;
+                }
+            }
+        }
+        
+        
+        this.layoutTargetLastSize = tSize;
+        
+        
+        this.childBoxCache = calcs;
+        
+        this.updateInnerCtSize(tSize, calcs);
+        this.updateChildBoxes(boxes);
+
+        
+        this.handleTargetOverflow(tSize, container, target);
+    },
+
+    
+    updateChildBoxes: function(boxes) {
+        for (var i = 0, length = boxes.length; i < length; i++) {
+            var box  = boxes[i],
+                comp = box.component;
+            
+            if (box.dirtySize) {
+                comp.setSize(box.width, box.height);
+            }
+            
+            if (isNaN(box.left) || isNaN(box.top)) {
+                continue;
+            }
+            
+            comp.setPosition(box.left, box.top);
+        }
+    },
+
+    
+    updateInnerCtSize: function(tSize, calcs) {
+        var align   = this.align,
+            padding = this.padding,
+            width   = tSize.width,
+            height  = tSize.height;
+        
+        if (this.type == 'hbox') {
+            var innerCtWidth  = width,
+                innerCtHeight = calcs.meta.maxHeight + padding.top + padding.bottom;
+
+            if (align == 'stretch') {
+                innerCtHeight = height;
+            } else if (align == 'middle') {
+                innerCtHeight = Math.max(height, innerCtHeight);
+            }
+        } else {
+            var innerCtHeight = height,
+                innerCtWidth  = calcs.meta.maxWidth + padding.left + padding.right;
+
+            if (align == 'stretch') {
+                innerCtWidth = width;
+            } else if (align == 'center') {
+                innerCtWidth = Math.max(width, innerCtWidth);
+            }
+        }
+
+        this.innerCt.setSize(innerCtWidth || undefined, innerCtHeight || undefined);
+    },
+
+    
+    handleTargetOverflow: function(previousTargetSize, container, target) {
+        var overflow = target.getStyle('overflow');
+
+        if (overflow && overflow != 'hidden' &&!this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != previousTargetSize.width || newTargetSize.height != previousTargetSize.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    
+    isValidParent : function(c, target) {
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    
+    getVisibleItems: function(ct) {
+        var ct  = ct || this.container,
+            t   = ct.getLayoutTarget(),
+            cti = ct.items.items,
+            len = cti.length,
+
+            i, c, items = [];
+
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.hidden !== true  && c.collapsed !== true && c.shouldLayout !== false){
+                items.push(c);
+            }
+        }
+
+        return items;
+    },
+
+    
+    renderAll : function(ct, target) {
+        if (!this.innerCt) {
+            
+            this.innerCt = target.createChild({cls:this.innerCls});
+            this.padding = this.parseMargins(this.padding);
+        }
+        Ext.layout.BoxLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        
+        if (target) {
+            ret = target.getViewSize();
+
+            
+            
+            
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width  -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        
+        return ret;
+    },
+
+    
+    renderItem : function(c) {
+        if(Ext.isString(c.margins)){
+            c.margins = this.parseMargins(c.margins);
+        }else if(!c.margins){
+            c.margins = this.defaultMargins;
+        }
+        Ext.layout.BoxLayout.superclass.renderItem.apply(this, arguments);
+    },
+    
+    
+    destroy: function() {
+        Ext.destroy(this.overflowHandler);
+        
+        Ext.layout.BoxLayout.superclass.destroy.apply(this, arguments);
+    }
+});
+
+
+
+Ext.layout.boxOverflow.None = Ext.extend(Object, {
+    constructor: function(layout, config) {
+        this.layout = layout;
+        
+        Ext.apply(this, config || {});
+    },
+    
+    handleOverflow: Ext.emptyFn,
+    
+    clearOverflow: Ext.emptyFn
+});
+
+
+Ext.layout.boxOverflow.none = Ext.layout.boxOverflow.None;
+
+Ext.layout.boxOverflow.Menu = Ext.extend(Ext.layout.boxOverflow.None, {
+    
+    afterCls: 'x-strip-right',
+    
+    
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+    
+    constructor: function(layout) {
+        Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this, arguments);
+        
+        
+        this.menuItems = [];
+    },
+    
+    
+    createInnerElements: function() {
+        if (!this.afterCt) {
+            this.afterCt  = this.layout.innerCt.insertSibling({cls: this.afterCls},  'before');
+        }
+    },
+    
+    
+    clearOverflow: function(calculations, targetSize) {
+        var newWidth = targetSize.width + (this.afterCt ? this.afterCt.getWidth() : 0),
+            items    = this.menuItems;
+        
+        this.hideTrigger();
+        
+        for (var index = 0, length = items.length; index < length; index++) {
+            items.pop().component.show();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            }
+        };
+    },
+    
+    
+    showTrigger: function() {
+        this.createMenu();
+        this.menuTrigger.show();
+    },
+    
+    
+    hideTrigger: function() {
+        if (this.menuTrigger != undefined) {
+            this.menuTrigger.hide();
+        }
+    },
+    
+    
+    beforeMenuShow: function(menu) {
+        var items = this.menuItems,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+        
+        this.clearMenu();
+        menu.removeAll();
+        
+        for (var i = 0; i < len; i++) {
+            item = items[i].component;
+            
+            if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                menu.add('-');
+            }
+            
+            this.addComponentToMenu(menu, item);
+            prev = item;
+        }
+
+        
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+    
+    
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+    
+    
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+    
+    
+    createMenu: function() {
+        if (!this.menuTrigger) {
+            this.createInnerElements();
+            
+            
+            this.menu = new Ext.menu.Menu({
+                ownerCt : this.layout.container,
+                listeners: {
+                    scope: this,
+                    beforeshow: this.beforeMenuShow
+                }
+            });
+
+            
+            this.menuTrigger = new Ext.Button({
+                iconCls : 'x-toolbar-more-icon',
+                cls     : 'x-toolbar-more',
+                menu    : this.menu,
+                renderTo: this.afterCt
+            });
+        }
+    },
+    
+    
+    destroy: function() {
+        Ext.destroy(this.menu, this.menuTrigger);
+    }
+});
+
+Ext.layout.boxOverflow.menu = Ext.layout.boxOverflow.Menu;
+
+
+
+Ext.layout.boxOverflow.HorizontalMenu = Ext.extend(Ext.layout.boxOverflow.Menu, {
+    
+    constructor: function() {
+        Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this, arguments);
+        
+        var me = this,
+            layout = me.layout,
+            origFunction = layout.calculateChildBoxes;
+        
+        layout.calculateChildBoxes = function(visibleItems, targetSize) {
+            var calcs = origFunction.apply(layout, arguments),
+                meta  = calcs.meta,
+                items = me.menuItems;
+            
+            
+            
+            var hiddenWidth = 0;
+            for (var index = 0, length = items.length; index < length; index++) {
+                hiddenWidth += items[index].width;
+            }
+            
+            meta.minimumWidth += hiddenWidth;
+            meta.tooNarrow = meta.minimumWidth > targetSize.width;
+            
+            return calcs;
+        };        
+    },
+    
+    handleOverflow: function(calculations, targetSize) {
+        this.showTrigger();
+        
+        var newWidth    = targetSize.width - this.afterCt.getWidth(),
+            boxes       = calculations.boxes,
+            usedWidth   = 0,
+            recalculate = false;
+        
+        
+        for (var index = 0, length = boxes.length; index < length; index++) {
+            usedWidth += boxes[index].width;
+        }
+        
+        var spareWidth = newWidth - usedWidth,
+            showCount  = 0;
+        
+        
+        for (var index = 0, length = this.menuItems.length; index < length; index++) {
+            var hidden = this.menuItems[index],
+                comp   = hidden.component,
+                width  = hidden.width;
+            
+            if (width < spareWidth) {
+                comp.show();
+                
+                spareWidth -= width;
+                showCount ++;
+                recalculate = true;
+            } else {
+                break;
+            }
+        }
+                
+        if (recalculate) {
+            this.menuItems = this.menuItems.slice(showCount);
+        } else {
+            for (var i = boxes.length - 1; i >= 0; i--) {
+                var item  = boxes[i].component,
+                    right = boxes[i].left + boxes[i].width;
+
+                if (right >= newWidth) {
+                    this.menuItems.unshift({
+                        component: item,
+                        width    : boxes[i].width
+                    });
+
+                    item.hide();
+                } else {
+                    break;
+                }
+            }
+        }
+        
+        if (this.menuItems.length == 0) {
+            this.hideTrigger();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            },
+            recalculate: recalculate
+        };
+    }
+});
+
+Ext.layout.boxOverflow.menu.hbox = Ext.layout.boxOverflow.HorizontalMenu;
+Ext.layout.boxOverflow.Scroller = Ext.extend(Ext.layout.boxOverflow.None, {
+    
+    animateScroll: true,
+    
+    
+    scrollIncrement: 100,
+    
+    
+    wheelIncrement: 3,
+    
+    
+    scrollRepeatInterval: 400,
+    
+    
+    scrollDuration: 0.4,
+    
+    
+    beforeCls: 'x-strip-left',
+    
+    
+    afterCls: 'x-strip-right',
+    
+    
+    scrollerCls: 'x-strip-scroller',
+    
+    
+    beforeScrollerCls: 'x-strip-scroller-left',
+    
+    
+    afterScrollerCls: 'x-strip-scroller-right',
+    
+    
+    createWheelListener: function() {
+        this.layout.innerCt.on({
+            scope     : this,
+            mousewheel: function(e) {
+                e.stopEvent();
+
+                this.scrollBy(e.getWheelDelta() * this.wheelIncrement * -1, false);
+            }
+        });
+    },
+    
+    
+    handleOverflow: function(calculations, targetSize) {
+        this.createInnerElements();
+        this.showScrollers();
+    },
+    
+    
+    clearOverflow: function() {
+        this.hideScrollers();
+    },
+    
+    
+    showScrollers: function() {
+        this.createScrollers();
+        
+        this.beforeScroller.show();
+        this.afterScroller.show();
+        
+        this.updateScrollButtons();
+    },
+    
+    
+    hideScrollers: function() {
+        if (this.beforeScroller != undefined) {
+            this.beforeScroller.hide();
+            this.afterScroller.hide();          
+        }
+    },
+    
+    
+    createScrollers: function() {
+        if (!this.beforeScroller && !this.afterScroller) {
+            var before = this.beforeCt.createChild({
+                cls: String.format("{0} {1} ", this.scrollerCls, this.beforeScrollerCls)
+            });
+            
+            var after = this.afterCt.createChild({
+                cls: String.format("{0} {1}", this.scrollerCls, this.afterScrollerCls)
+            });
+            
+            before.addClassOnOver(this.beforeScrollerCls + '-hover');
+            after.addClassOnOver(this.afterScrollerCls + '-hover');
+            
+            before.setVisibilityMode(Ext.Element.DISPLAY);
+            after.setVisibilityMode(Ext.Element.DISPLAY);
+            
+            this.beforeRepeater = new Ext.util.ClickRepeater(before, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollLeft,
+                scope   : this
+            });
+            
+            this.afterRepeater = new Ext.util.ClickRepeater(after, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollRight,
+                scope   : this
+            });
+            
+            
+            this.beforeScroller = before;
+            
+            
+            this.afterScroller = after;
+        }
+    },
+    
+    
+    destroy: function() {
+        Ext.destroy(this.beforeScroller, this.afterScroller, this.beforeRepeater, this.afterRepeater, this.beforeCt, this.afterCt);
+    },
+    
+    
+    scrollBy: function(delta, animate) {
+        this.scrollTo(this.getScrollPosition() + delta, animate);
+    },
+    
+    
+    getItem: function(item) {
+        if (Ext.isString(item)) {
+            item = Ext.getCmp(item);
+        } else if (Ext.isNumber(item)) {
+            item = this.items[item];
+        }
+        
+        return item;
+    },
+    
+    
+    getScrollAnim: function() {
+        return {
+            duration: this.scrollDuration, 
+            callback: this.updateScrollButtons, 
+            scope   : this
+        };
+    },
+    
+    
+    updateScrollButtons: function() {
+        if (this.beforeScroller == undefined || this.afterScroller == undefined) {
+            return;
+        }
+        
+        var beforeMeth = this.atExtremeBefore()  ? 'addClass' : 'removeClass',
+            afterMeth  = this.atExtremeAfter() ? 'addClass' : 'removeClass',
+            beforeCls  = this.beforeScrollerCls + '-disabled',
+            afterCls   = this.afterScrollerCls  + '-disabled';
+        
+        this.beforeScroller[beforeMeth](beforeCls);
+        this.afterScroller[afterMeth](afterCls);
+        this.scrolling = false;
+    },
+    
+    
+    atExtremeBefore: function() {
+        return this.getScrollPosition() === 0;
+    },
+    
+    
+    scrollLeft: function(animate) {
+        this.scrollBy(-this.scrollIncrement, animate);
+    },
+    
+    
+    scrollRight: function(animate) {
+        this.scrollBy(this.scrollIncrement, animate);
+    },
+    
+    
+    scrollToItem: function(item, animate) {
+        item = this.getItem(item);
+        
+        if (item != undefined) {
+            var visibility = this.getItemVisibility(item);
+            
+            if (!visibility.fullyVisible) {
+                var box  = item.getBox(true, true),
+                    newX = box.x;
+                    
+                if (visibility.hiddenRight) {
+                    newX -= (this.layout.innerCt.getWidth() - box.width);
+                }
+                
+                this.scrollTo(newX, animate);
+            }
+        }
+    },
+    
+    
+    getItemVisibility: function(item) {
+        var box         = this.getItem(item).getBox(true, true),
+            itemLeft    = box.x,
+            itemRight   = box.x + box.width,
+            scrollLeft  = this.getScrollPosition(),
+            scrollRight = this.layout.innerCt.getWidth() + scrollLeft;
+        
+        return {
+            hiddenLeft  : itemLeft < scrollLeft,
+            hiddenRight : itemRight > scrollRight,
+            fullyVisible: itemLeft > scrollLeft && itemRight < scrollRight
+        };
+    }
+});
+
+Ext.layout.boxOverflow.scroller = Ext.layout.boxOverflow.Scroller;
+
+
+
+Ext.layout.boxOverflow.VerticalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    scrollIncrement: 75,
+    wheelIncrement : 2,
+    
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height - (this.beforeCt.getHeight() + this.afterCt.getHeight()),
+                width : targetSize.width
+            }
+        };
+    },
+    
+    
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        
+        
+        if (!this.beforeCt) {
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'after');
+
+            this.createWheelListener();
+        }
+    },
+    
+    
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollBottom());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('top', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollTop, 10) || 0;
+    },
+    
+    
+    getMaxScrollBottom: function() {
+        return this.layout.innerCt.dom.scrollHeight - this.layout.innerCt.getHeight();
+    },
+    
+    
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollBottom();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.vbox = Ext.layout.boxOverflow.VerticalScroller;
+
+
+
+Ext.layout.boxOverflow.HorizontalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : targetSize.width - (this.beforeCt.getWidth() + this.afterCt.getWidth())
+            }
+        };
+    },
+    
+    
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        
+        
+        if (!this.beforeCt) {
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'before');
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            
+            this.createWheelListener();
+        }
+    },
+    
+    
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollRight());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('left', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollLeft, 10) || 0;
+    },
+    
+    
+    getMaxScrollRight: function() {
+        return this.layout.innerCt.dom.scrollWidth - this.layout.innerCt.getWidth();
+    },
+    
+    
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollRight();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.hbox = Ext.layout.boxOverflow.HorizontalScroller;
+Ext.layout.HBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    
+    align: 'top', 
+
+    type : 'hbox',
+
+    
+    
+
+    
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availHeight  = Math.max(0, height - paddingVert),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexWidth = 0,
+            maxHeight    = 0,
+            totalFlex    = 0,
+            desiredWidth = 0,
+            minimumWidth = 0,
+
+            
+            boxes        = [],
+
+            
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedWidth, 
+            horizMargins, vertMargins, stretchHeight;
+
+        
+        for (i = 0; i < visibleCount; i++) {
+            child       = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            
+            if (typeof childWidth != 'number') {
+
+                
+                if (child.flex && !childWidth) {
+                    totalFlex += child.flex;
+
+                
+                } else {
+                    
+                    
+                    if (!childWidth && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize   = child.getSize();
+                    childWidth  = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+
+            childMargins = child.margins;
+            horizMargins = childMargins.left + childMargins.right;
+
+            nonFlexWidth += horizMargins + (childWidth || 0);
+            desiredWidth += horizMargins + (child.flex ? child.minWidth || 0 : childWidth);
+            minimumWidth += horizMargins + (child.minWidth || childWidth || 0);
+
+            
+            if (typeof childHeight != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childHeight = child.getHeight();
+            }
+
+            maxHeight = Math.max(maxHeight, childHeight + childMargins.top + childMargins.bottom);
+
+            
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth  || undefined
+            });
+        }
+                
+        var shortfall = desiredWidth - width,
+            tooNarrow = minimumWidth > width;
+            
+        
+        var availableWidth = Math.max(0, width - nonFlexWidth - paddingHoriz);
+        
+        if (tooNarrow) {
+            for (i = 0; i < visibleCount; i++) {
+                boxes[i].width = visibleItems[i].minWidth || visibleItems[i].width || boxes[i].width;
+            }
+        } else {
+            
+            
+            if (shortfall > 0) {
+                var minWidths = [];
+                
+                
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item     = visibleItems[index],
+                        minWidth = item.minWidth || 0;
+
+                    
+                    
+                    if (item.flex) {
+                        boxes[index].width = minWidth;
+                    } else {
+                        minWidths.push({
+                            minWidth : minWidth,
+                            available: boxes[index].width - minWidth,
+                            index    : index
+                        });
+                    }
+                }
+                
+                
+                minWidths.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+                
+                
+                for (var i = 0, length = minWidths.length; i < length; i++) {
+                    var itemIndex = minWidths[i].index;
+                    
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+                        
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldWidth  = box.width,
+                        minWidth  = item.minWidth,
+                        newWidth  = Math.max(minWidth, oldWidth - Math.ceil(shortfall / (length - i))),
+                        reduction = oldWidth - newWidth;
+                    
+                    boxes[itemIndex].width = newWidth;
+                    shortfall -= reduction;                    
+                }
+            } else {
+                
+                var remainingWidth = availableWidth,
+                    remainingFlex  = totalFlex;
+
+                
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    vertMargins  = childMargins.top + childMargins.bottom;
+
+                    if (isStart && child.flex && !child.width) {
+                        flexedWidth     = Math.ceil((child.flex / remainingFlex) * remainingWidth);
+                        remainingWidth -= flexedWidth;
+                        remainingFlex  -= child.flex;
+
+                        calcs.width = flexedWidth;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+        
+        if (isCenter) {
+            leftOffset += availableWidth / 2;
+        } else if (isEnd) {
+            leftOffset += availableWidth;
+        }
+        
+        
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+            
+            childMargins = child.margins;
+            leftOffset  += childMargins.left;
+            vertMargins  = childMargins.top + childMargins.bottom;
+            
+            calcs.left = leftOffset;
+            calcs.top  = topOffset + childMargins.top;
+
+            switch (this.align) {
+                case 'stretch':
+                    stretchHeight = availHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchHeight = maxHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'middle':
+                    var diff = availHeight - calcs.height - vertMargins;
+                    if (diff > 0) {
+                        calcs.top = topOffset + vertMargins + (diff / 2);
+                    }
+            }
+            
+            leftOffset += calcs.width + childMargins.right;
+        }
+
+        return {
+            boxes: boxes,
+            meta : {
+                maxHeight   : maxHeight,
+                nonFlexWidth: nonFlexWidth,
+                desiredWidth: desiredWidth,
+                minimumWidth: minimumWidth,
+                shortfall   : desiredWidth - width,
+                tooNarrow   : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.hbox = Ext.layout.HBoxLayout;
+Ext.layout.VBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    
+    align : 'left', 
+    type: 'vbox',
+
+    
+
+    
+
+    
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availWidth   = Math.max(0, width - paddingHoriz),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexHeight= 0,
+            maxWidth     = 0,
+            totalFlex    = 0,
+            desiredHeight= 0,
+            minimumHeight= 0,
+
+            
+            boxes        = [],
+            
+            
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedHeight, 
+            horizMargins, vertMargins, stretchWidth, length;
+
+        
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            
+            if (typeof childHeight != 'number') {
+
+                
+                if (child.flex && !childHeight) {
+                    totalFlex += child.flex;
+
+                
+                } else {
+                    
+                    
+                    if (!childHeight && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize = child.getSize();
+                    childWidth = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+            
+            childMargins = child.margins;
+            vertMargins  = childMargins.top + childMargins.bottom;
+
+            nonFlexHeight += vertMargins + (childHeight || 0);
+            desiredHeight += vertMargins + (child.flex ? child.minHeight || 0 : childHeight);
+            minimumHeight += vertMargins + (child.minHeight || childHeight || 0);
+
+            
+            if (typeof childWidth != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childWidth = child.getWidth();
+            }
+
+            maxWidth = Math.max(maxWidth, childWidth + childMargins.left + childMargins.right);
+
+            
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth || undefined
+            });
+        }
+                
+        var shortfall = desiredHeight - height,
+            tooNarrow = minimumHeight > height;
+
+        
+        var availableHeight = Math.max(0, (height - nonFlexHeight - paddingVert));
+        
+        if (tooNarrow) {
+            for (i = 0, length = visibleCount; i < length; i++) {
+                boxes[i].height = visibleItems[i].minHeight || visibleItems[i].height || boxes[i].height;
+            }
+        } else {
+            
+            
+            if (shortfall > 0) {
+                var minHeights = [];
+
+                
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item      = visibleItems[index],
+                        minHeight = item.minHeight || 0;
+
+                    
+                    
+                    if (item.flex) {
+                        boxes[index].height = minHeight;
+                    } else {
+                        minHeights.push({
+                            minHeight: minHeight, 
+                            available: boxes[index].height - minHeight,
+                            index    : index
+                        });
+                    }
+                }
+
+                
+                minHeights.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+
+                
+                for (var i = 0, length = minHeights.length; i < length; i++) {
+                    var itemIndex = minHeights[i].index;
+
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldHeight  = box.height,
+                        minHeight  = item.minHeight,
+                        newHeight  = Math.max(minHeight, oldHeight - Math.ceil(shortfall / (length - i))),
+                        reduction = oldHeight - newHeight;
+
+                    boxes[itemIndex].height = newHeight;
+                    shortfall -= reduction;
+                }
+            } else {
+                
+                var remainingHeight = availableHeight,
+                    remainingFlex   = totalFlex;
+                
+                
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    horizMargins = childMargins.left + childMargins.right;
+
+                    if (isStart && child.flex && !child.height) {
+                        flexedHeight     = Math.ceil((child.flex / remainingFlex) * remainingHeight);
+                        remainingHeight -= flexedHeight;
+                        remainingFlex   -= child.flex;
+
+                        calcs.height = flexedHeight;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+
+        if (isCenter) {
+            topOffset += availableHeight / 2;
+        } else if (isEnd) {
+            topOffset += availableHeight;
+        }
+
+        
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+
+            childMargins = child.margins;
+            topOffset   += childMargins.top;
+            horizMargins = childMargins.left + childMargins.right;
+            
+
+            calcs.left = leftOffset + childMargins.left;
+            calcs.top  = topOffset;
+            
+            switch (this.align) {
+                case 'stretch':
+                    stretchWidth = availWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchWidth = maxWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'center':
+                    var diff = availWidth - calcs.width - horizMargins;
+                    if (diff > 0) {
+                        calcs.left = leftOffset + horizMargins + (diff / 2);
+                    }
+            }
+
+            topOffset += calcs.height + childMargins.bottom;
+        }
+        
+        return {
+            boxes: boxes,
+            meta : {
+                maxWidth     : maxWidth,
+                nonFlexHeight: nonFlexHeight,
+                desiredHeight: desiredHeight,
+                minimumHeight: minimumHeight,
+                shortfall    : desiredHeight - height,
+                tooNarrow    : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.vbox = Ext.layout.VBoxLayout;
+
+Ext.layout.ToolbarLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'toolbar',
+
+    
+    triggerWidth: 18,
+
+    
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+
+    
+    lastOverflow: false,
+
+    
+    tableHTML: [
+        '<table cellspacing="0" class="x-toolbar-ct">',
+            '<tbody>',
+                '<tr>',
+                    '<td class="x-toolbar-left" align="{0}">',
+                        '<table cellspacing="0">',
+                            '<tbody>',
+                                '<tr class="x-toolbar-left-row"></tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                    '<td class="x-toolbar-right" align="right">',
+                        '<table cellspacing="0" class="x-toolbar-right-ct">',
+                            '<tbody>',
+                                '<tr>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-right-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-extras-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                '</tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                '</tr>',
+            '</tbody>',
+        '</table>'
+    ].join(""),
+
+    
+    onLayout : function(ct, target) {
+        
+        if (!this.leftTr) {
+            var align = ct.buttonAlign == 'center' ? 'center' : 'left';
+
+            target.addClass('x-toolbar-layout-ct');
+            target.insertHtml('beforeEnd', String.format(this.tableHTML, align));
+
+            this.leftTr   = target.child('tr.x-toolbar-left-row', true);
+            this.rightTr  = target.child('tr.x-toolbar-right-row', true);
+            this.extrasTr = target.child('tr.x-toolbar-extras-row', true);
+
+            if (this.hiddenItem == undefined) {
+                
+                this.hiddenItems = [];
+            }
+        }
+
+        var side     = ct.buttonAlign == 'right' ? this.rightTr : this.leftTr,
+            items    = ct.items.items,
+            position = 0;
+
+        
+        for (var i = 0, len = items.length, c; i < len; i++, position++) {
+            c = items[i];
+
+            if (c.isFill) {
+                side   = this.rightTr;
+                position = -1;
+            } else if (!c.rendered) {
+                c.render(this.insertCell(c, side, position));
+                this.configureItem(c);
+            } else {
+                if (!c.xtbHidden && !this.isValidParent(c, side.childNodes[position])) {
+                    var td = this.insertCell(c, side, position);
+                    td.appendChild(c.getPositionEl().dom);
+                    c.container = Ext.get(td);
+                }
+            }
+        }
+
+        
+        this.cleanup(this.leftTr);
+        this.cleanup(this.rightTr);
+        this.cleanup(this.extrasTr);
+        this.fitToSize(target);
+    },
+
+    
+    cleanup : function(el) {
+        var cn = el.childNodes, i, c;
+
+        for (i = cn.length-1; i >= 0 && (c = cn[i]); i--) {
+            if (!c.firstChild) {
+                el.removeChild(c);
+            }
+        }
+    },
+
+    
+    insertCell : function(c, target, position) {
+        var td = document.createElement('td');
+        td.className = 'x-toolbar-cell';
+
+        target.insertBefore(td, target.childNodes[position] || null);
+
+        return td;
+    },
+
+    
+    hideItem : function(item) {
+        this.hiddenItems.push(item);
+
+        item.xtbHidden = true;
+        item.xtbWidth = item.getPositionEl().dom.parentNode.offsetWidth;
+        item.hide();
+    },
+
+    
+    unhideItem : function(item) {
+        item.show();
+        item.xtbHidden = false;
+        this.hiddenItems.remove(item);
+    },
+
+    
+    getItemWidth : function(c) {
+        return c.hidden ? (c.xtbWidth || 0) : c.getPositionEl().dom.parentNode.offsetWidth;
+    },
+
+    
+    fitToSize : function(target) {
+        if (this.container.enableOverflow === false) {
+            return;
+        }
+
+        var width       = target.dom.clientWidth,
+            tableWidth  = target.dom.firstChild.offsetWidth,
+            clipWidth   = width - this.triggerWidth,
+            lastWidth   = this.lastWidth || 0,
+
+            hiddenItems = this.hiddenItems,
+            hasHiddens  = hiddenItems.length != 0,
+            isLarger    = width >= lastWidth;
+
+        this.lastWidth  = width;
+
+        if (tableWidth > width || (hasHiddens && isLarger)) {
+            var items     = this.container.items.items,
+                len       = items.length,
+                loopWidth = 0,
+                item;
+
+            for (var i = 0; i < len; i++) {
+                item = items[i];
+
+                if (!item.isFill) {
+                    loopWidth += this.getItemWidth(item);
+                    if (loopWidth > clipWidth) {
+                        if (!(item.hidden || item.xtbHidden)) {
+                            this.hideItem(item);
+                        }
+                    } else if (item.xtbHidden) {
+                        this.unhideItem(item);
+                    }
+                }
+            }
+        }
+
+        
+        hasHiddens = hiddenItems.length != 0;
+
+        if (hasHiddens) {
+            this.initMore();
+
+            if (!this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, true);
+                this.lastOverflow = true;
+            }
+        } else if (this.more) {
+            this.clearMenu();
+            this.more.destroy();
+            delete this.more;
+
+            if (this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, false);
+                this.lastOverflow = false;
+            }
+        }
+    },
+
+    
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+
+    
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+
+    
+    beforeMoreShow : function(menu) {
+        var items = this.container.items.items,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+
+        this.clearMenu();
+        menu.removeAll();
+        for (var i = 0; i < len; i++) {
+            item = items[i];
+            if (item.xtbHidden) {
+                if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                    menu.add('-');
+                }
+                this.addComponentToMenu(menu, item);
+                prev = item;
+            }
+        }
+
+        
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+
+    
+    initMore : function(){
+        if (!this.more) {
+            
+            this.moreMenu = new Ext.menu.Menu({
+                ownerCt : this.container,
+                listeners: {
+                    beforeshow: this.beforeMoreShow,
+                    scope: this
+                }
+            });
+
+            
+            this.more = new Ext.Button({
+                iconCls: 'x-toolbar-more-icon',
+                cls    : 'x-toolbar-more',
+                menu   : this.moreMenu,
+                ownerCt: this.container
+            });
+
+            var td = this.insertCell(this.more, this.extrasTr, 100);
+            this.more.render(td);
+        }
+    },
+
+    destroy : function(){
+        Ext.destroy(this.more, this.moreMenu);
+        delete this.leftTr;
+        delete this.rightTr;
+        delete this.extrasTr;
+        Ext.layout.ToolbarLayout.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS.toolbar = Ext.layout.ToolbarLayout;
+
+ Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'menu',
+
+    setContainer : function(ct){
+        this.monitorResize = !ct.floating;
+        
+        
+        ct.on('autosize', this.doAutoSize, this);
+        Ext.layout.MenuLayout.superclass.setContainer.call(this, ct);
+    },
+
+    renderItem : function(c, position, target){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
+                '<li id="{itemId}" class="{itemCls}">',
+                    '<tpl if="needsIcon">',
+                        '<img alt="{altText}" src="{icon}" class="{iconCls}"/>',
+                    '</tpl>',
+                '</li>'
+            );
+        }
+
+        if(c && !c.rendered){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            var a = this.getItemArgs(c);
+
+
+            c.render(c.positionEl = position ?
+                this.itemTpl.insertBefore(position, a, true) :
+                this.itemTpl.append(target, a, true));
+
+
+            c.positionEl.menuItemId = c.getItemId();
+
+
+
+            if (!a.isMenuItem && a.needsIcon) {
+                c.positionEl.addClass('x-menu-list-item-indent');
+            }
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            target.dom.insertBefore(c.getActionEl().dom, position || null);
+        }
+    },
+
+    getItemArgs : function(c) {
+        var isMenuItem = c instanceof Ext.menu.Item,
+            canHaveIcon = !(isMenuItem || c instanceof Ext.menu.Separator);
+
+        return {
+            isMenuItem: isMenuItem,
+            needsIcon: canHaveIcon && (c.icon || c.iconCls),
+            icon: c.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: 'x-menu-item-icon ' + (c.iconCls || ''),
+            itemId: 'x-menu-el-' + c.id,
+            itemCls: 'x-menu-list-item ',
+            altText: c.altText || ''
+        };
+    },
+
+    
+    isValidParent : function(c, target) {
+        return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target);
+    },
+
+    onLayout : function(ct, target){
+        Ext.layout.MenuLayout.superclass.onLayout.call(this, ct, target);
+        this.doAutoSize();
+    },
+
+    doAutoSize : function(){
+        var ct = this.container, w = ct.width;
+        if(ct.floating){
+            if(w){
+                ct.setWidth(w);
+            }else if(Ext.isIE){
+                ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8 || Ext.isIE9) ? 'auto' : ct.minWidth);
+                var el = ct.getEl(), t = el.dom.offsetWidth; 
+                ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr'));
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout;
+
+Ext.Viewport = Ext.extend(Ext.Container, {
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+    initComponent : function() {
+        Ext.Viewport.superclass.initComponent.call(this);
+        document.getElementsByTagName('html')[0].className += ' x-viewport';
+        this.el = Ext.getBody();
+        this.el.setHeight = Ext.emptyFn;
+        this.el.setWidth = Ext.emptyFn;
+        this.el.setSize = Ext.emptyFn;
+        this.el.dom.scroll = 'no';
+        this.allowDomMove = false;
+        this.autoWidth = true;
+        this.autoHeight = true;
+        Ext.EventManager.onWindowResize(this.fireResize, this);
+        this.renderTo = this.el;
+    },
+
+    fireResize : function(w, h){
+        this.fireEvent('resize', this, w, h, w, h);
+    }
+});
+Ext.reg('viewport', Ext.Viewport);
+
+Ext.Panel = Ext.extend(Ext.Container, {
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+    
+    
+    
+    
+    
+    
+    
+    
+
+
+    
+    baseCls : 'x-panel',
+    
+    collapsedCls : 'x-panel-collapsed',
+    
+    maskDisabled : true,
+    
+    animCollapse : Ext.enableFx,
+    
+    headerAsText : true,
+    
+    buttonAlign : 'right',
+    
+    collapsed : false,
+    
+    collapseFirst : true,
+    
+    minButtonWidth : 75,
+    
+    
+    elements : 'body',
+    
+    preventBodyReset : false,
+
+    
+    padding: undefined,
+
+    
+    resizeEvent: 'bodyresize',
+
+    
+    
+    
+    toolTarget : 'header',
+    collapseEl : 'bwrap',
+    slideAnchor : 't',
+    disabledClass : '',
+
+    
+    deferHeight : true,
+    
+    expandDefaults: {
+        duration : 0.25
+    },
+    
+    collapseDefaults : {
+        duration : 0.25
+    },
+
+    
+    initComponent : function(){
+        Ext.Panel.superclass.initComponent.call(this);
+
+        this.addEvents(
+            
+            'bodyresize',
+            
+            'titlechange',
+            
+            'iconchange',
+            
+            'collapse',
+            
+            'expand',
+            
+            'beforecollapse',
+            
+            'beforeexpand',
+            
+            'beforeclose',
+            
+            'close',
+            
+            'activate',
+            
+            'deactivate'
+        );
+
+        if(this.unstyled){
+            this.baseCls = 'x-plain';
+        }
+
+
+        this.toolbars = [];
+        
+        if(this.tbar){
+            this.elements += ',tbar';
+            this.topToolbar = this.createToolbar(this.tbar);
+            this.tbar = null;
+
+        }
+        if(this.bbar){
+            this.elements += ',bbar';
+            this.bottomToolbar = this.createToolbar(this.bbar);
+            this.bbar = null;
+        }
+
+        if(this.header === true){
+            this.elements += ',header';
+            this.header = null;
+        }else if(this.headerCfg || (this.title && this.header !== false)){
+            this.elements += ',header';
+        }
+
+        if(this.footerCfg || this.footer === true){
+            this.elements += ',footer';
+            this.footer = null;
+        }
+
+        if(this.buttons){
+            this.fbar = this.buttons;
+            this.buttons = null;
+        }
+        if(this.fbar){
+            this.createFbar(this.fbar);
+        }
+        if(this.autoLoad){
+            this.on('render', this.doAutoLoad, this, {delay:10});
+        }
+    },
+
+    
+    createFbar : function(fbar){
+        var min = this.minButtonWidth;
+        this.elements += ',footer';
+        this.fbar = this.createToolbar(fbar, {
+            buttonAlign: this.buttonAlign,
+            toolbarCls: 'x-panel-fbar',
+            enableOverflow: false,
+            defaults: function(c){
+                return {
+                    minWidth: c.minWidth || min
+                };
+            }
+        });
+        
+        
+        
+        this.fbar.items.each(function(c){
+            c.minWidth = c.minWidth || this.minButtonWidth;
+        }, this);
+        this.buttons = this.fbar.items.items;
+    },
+
+    
+    createToolbar: function(tb, options){
+        var result;
+        
+        if(Ext.isArray(tb)){
+            tb = {
+                items: tb
+            };
+        }
+        result = tb.events ? Ext.apply(tb, options) : this.createComponent(Ext.apply({}, tb, options), 'toolbar');
+        this.toolbars.push(result);
+        return result;
+    },
+
+    
+    createElement : function(name, pnode){
+        if(this[name]){
+            pnode.appendChild(this[name].dom);
+            return;
+        }
+
+        if(name === 'bwrap' || this.elements.indexOf(name) != -1){
+            if(this[name+'Cfg']){
+                this[name] = Ext.fly(pnode).createChild(this[name+'Cfg']);
+            }else{
+                var el = document.createElement('div');
+                el.className = this[name+'Cls'];
+                this[name] = Ext.get(pnode.appendChild(el));
+            }
+            if(this[name+'CssClass']){
+                this[name].addClass(this[name+'CssClass']);
+            }
+            if(this[name+'Style']){
+                this[name].applyStyles(this[name+'Style']);
+            }
+        }
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.Panel.superclass.onRender.call(this, ct, position);
+        this.createClasses();
+
+        var el = this.el,
+            d = el.dom,
+            bw,
+            ts;
+
+
+        if(this.collapsible && !this.hideCollapseTool){
+            this.tools = this.tools ? this.tools.slice(0) : [];
+            this.tools[this.collapseFirst?'unshift':'push']({
+                id: 'toggle',
+                handler : this.toggleCollapse,
+                scope: this
+            });
+        }
+
+        if(this.tools){
+            ts = this.tools;
+            this.elements += (this.header !== false) ? ',header' : '';
+        }
+        this.tools = {};
+
+        el.addClass(this.baseCls);
+        if(d.firstChild){ 
+            this.header = el.down('.'+this.headerCls);
+            this.bwrap = el.down('.'+this.bwrapCls);
+            var cp = this.bwrap ? this.bwrap : el;
+            this.tbar = cp.down('.'+this.tbarCls);
+            this.body = cp.down('.'+this.bodyCls);
+            this.bbar = cp.down('.'+this.bbarCls);
+            this.footer = cp.down('.'+this.footerCls);
+            this.fromMarkup = true;
+        }
+        if (this.preventBodyReset === true) {
+            el.addClass('x-panel-reset');
+        }
+        if(this.cls){
+            el.addClass(this.cls);
+        }
+
+        if(this.buttons){
+            this.elements += ',footer';
+        }
+
+        
+
+        
+        if(this.frame){
+            el.insertHtml('afterBegin', String.format(Ext.Element.boxMarkup, this.baseCls));
+
+            this.createElement('header', d.firstChild.firstChild.firstChild);
+            this.createElement('bwrap', d);
+
+            
+            bw = this.bwrap.dom;
+            var ml = d.childNodes[1], bl = d.childNodes[2];
+            bw.appendChild(ml);
+            bw.appendChild(bl);
+
+            var mc = bw.firstChild.firstChild.firstChild;
+            this.createElement('tbar', mc);
+            this.createElement('body', mc);
+            this.createElement('bbar', mc);
+            this.createElement('footer', bw.lastChild.firstChild.firstChild);
+
+            if(!this.footer){
+                this.bwrap.dom.lastChild.className += ' x-panel-nofooter';
+            }
+            
+            this.ft = Ext.get(this.bwrap.dom.lastChild);
+            this.mc = Ext.get(mc);
+        }else{
+            this.createElement('header', d);
+            this.createElement('bwrap', d);
+
+            
+            bw = this.bwrap.dom;
+            this.createElement('tbar', bw);
+            this.createElement('body', bw);
+            this.createElement('bbar', bw);
+            this.createElement('footer', bw);
+
+            if(!this.header){
+                this.body.addClass(this.bodyCls + '-noheader');
+                if(this.tbar){
+                    this.tbar.addClass(this.tbarCls + '-noheader');
+                }
+            }
+        }
+
+        if(Ext.isDefined(this.padding)){
+            this.body.setStyle('padding', this.body.addUnits(this.padding));
+        }
+
+        if(this.border === false){
+            this.el.addClass(this.baseCls + '-noborder');
+            this.body.addClass(this.bodyCls + '-noborder');
+            if(this.header){
+                this.header.addClass(this.headerCls + '-noborder');
+            }
+            if(this.footer){
+                this.footer.addClass(this.footerCls + '-noborder');
+            }
+            if(this.tbar){
+                this.tbar.addClass(this.tbarCls + '-noborder');
+            }
+            if(this.bbar){
+                this.bbar.addClass(this.bbarCls + '-noborder');
+            }
+        }
+
+        if(this.bodyBorder === false){
+           this.body.addClass(this.bodyCls + '-noborder');
+        }
+
+        this.bwrap.enableDisplayMode('block');
+
+        if(this.header){
+            this.header.unselectable();
+
+            
+            if(this.headerAsText){
+                this.header.dom.innerHTML =
+                    '<span class="' + this.headerTextCls + '">'+this.header.dom.innerHTML+'</span>';
+
+                if(this.iconCls){
+                    this.setIconClass(this.iconCls);
+                }
+            }
+        }
+
+        if(this.floating){
+            this.makeFloating(this.floating);
+        }
+
+        if(this.collapsible && this.titleCollapse && this.header){
+            this.mon(this.header, 'click', this.toggleCollapse, this);
+            this.header.setStyle('cursor', 'pointer');
+        }
+        if(ts){
+            this.addTool.apply(this, ts);
+        }
+
+        
+        if(this.fbar){
+            this.footer.addClass('x-panel-btns');
+            this.fbar.ownerCt = this;
+            this.fbar.render(this.footer);
+            this.footer.createChild({cls:'x-clear'});
+        }
+        if(this.tbar && this.topToolbar){
+            this.topToolbar.ownerCt = this;
+            this.topToolbar.render(this.tbar);
+        }
+        if(this.bbar && this.bottomToolbar){
+            this.bottomToolbar.ownerCt = this;
+            this.bottomToolbar.render(this.bbar);
+        }
+    },
+
+    
+    setIconClass : function(cls){
+        var old = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered && this.header){
+            if(this.frame){
+                this.header.addClass('x-panel-icon');
+                this.header.replaceClass(old, this.iconCls);
+            }else{
+                var hd = this.header,
+                    img = hd.child('img.x-panel-inline-icon');
+                if(img){
+                    Ext.fly(img).replaceClass(old, this.iconCls);
+                }else{
+                    var hdspan = hd.child('span.' + this.headerTextCls);
+                    if (hdspan) {
+                        Ext.DomHelper.insertBefore(hdspan.dom, {
+                            tag:'img', alt: '', src: Ext.BLANK_IMAGE_URL, cls:'x-panel-inline-icon '+this.iconCls
+                        });
+                    }
+                 }
+            }
+        }
+        this.fireEvent('iconchange', this, cls, old);
+    },
+
+    
+    makeFloating : function(cfg){
+        this.floating = true;
+        this.el = new Ext.Layer(Ext.apply({}, cfg, {
+            shadow: Ext.isDefined(this.shadow) ? this.shadow : 'sides',
+            shadowOffset: this.shadowOffset,
+            constrain:false,
+            shim: this.shim === false ? false : undefined
+        }), this.el);
+    },
+
+    
+    getTopToolbar : function(){
+        return this.topToolbar;
+    },
+
+    
+    getBottomToolbar : function(){
+        return this.bottomToolbar;
+    },
+
+    
+    getFooterToolbar : function() {
+        return this.fbar;
+    },
+
+    
+    addButton : function(config, handler, scope){
+        if(!this.fbar){
+            this.createFbar([]);
+        }
+        if(handler){
+            if(Ext.isString(config)){
+                config = {text: config};
+            }
+            config = Ext.apply({
+                handler: handler,
+                scope: scope
+            }, config);
+        }
+        return this.fbar.add(config);
+    },
+
+    
+    addTool : function(){
+        if(!this.rendered){
+            if(!this.tools){
+                this.tools = [];
+            }
+            Ext.each(arguments, function(arg){
+                this.tools.push(arg);
+            }, this);
+            return;
+        }
+         
+        if(!this[this.toolTarget]){
+            return;
+        }
+        if(!this.toolTemplate){
+            
+            var tt = new Ext.Template(
+                 '<div class="x-tool x-tool-{id}">&#160;</div>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.Panel.prototype.toolTemplate = tt;
+        }
+        for(var i = 0, a = arguments, len = a.length; i < len; i++) {
+            var tc = a[i];
+            if(!this.tools[tc.id]){
+                var overCls = 'x-tool-'+tc.id+'-over';
+                var t = this.toolTemplate.insertFirst(this[this.toolTarget], tc, true);
+                this.tools[tc.id] = t;
+                t.enableDisplayMode('block');
+                this.mon(t, 'click',  this.createToolHandler(t, tc, overCls, this));
+                if(tc.on){
+                    this.mon(t, tc.on);
+                }
+                if(tc.hidden){
+                    t.hide();
+                }
+                if(tc.qtip){
+                    if(Ext.isObject(tc.qtip)){
+                        Ext.QuickTips.register(Ext.apply({
+                              target: t.id
+                        }, tc.qtip));
+                    } else {
+                        t.dom.qtip = tc.qtip;
+                    }
+                }
+                t.addClassOnOver(overCls);
+            }
+        }
+    },
+
+    onLayout : function(shallow, force){
+        Ext.Panel.superclass.onLayout.apply(this, arguments);
+        if(this.hasLayout && this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout(undefined, force);
+            });
+            this.syncHeight();
+        }
+    },
+
+    syncHeight : function(){
+        var h = this.toolbarHeight,
+                bd = this.body,
+                lsh = this.lastSize.height,
+                sz;
+
+        if(this.autoHeight || !Ext.isDefined(lsh) || lsh == 'auto'){
+            return;
+        }
+
+
+        if(h != this.getToolbarHeight()){
+            h = Math.max(0, lsh - this.getFrameHeight());
+            bd.setHeight(h);
+            sz = bd.getSize();
+            this.toolbarHeight = this.getToolbarHeight();
+            this.onBodyResize(sz.width, sz.height);
+        }
+    },
+
+    
+    onShow : function(){
+        if(this.floating){
+            return this.el.show();
+        }
+        Ext.Panel.superclass.onShow.call(this);
+    },
+
+    
+    onHide : function(){
+        if(this.floating){
+            return this.el.hide();
+        }
+        Ext.Panel.superclass.onHide.call(this);
+    },
+
+    
+    createToolHandler : function(t, tc, overCls, panel){
+        return function(e){
+            t.removeClass(overCls);
+            if(tc.stopEvent !== false){
+                e.stopEvent();
+            }
+            if(tc.handler){
+                tc.handler.call(tc.scope || t, e, t, panel, tc);
+            }
+        };
+    },
+
+    
+    afterRender : function(){
+        if(this.floating && !this.hidden){
+            this.el.show();
+        }
+        if(this.title){
+            this.setTitle(this.title);
+        }
+        Ext.Panel.superclass.afterRender.call(this); 
+        if (this.collapsed) {
+            this.collapsed = false;
+            this.collapse(false);
+        }
+        this.initEvents();
+    },
+
+    
+    getKeyMap : function(){
+        if(!this.keyMap){
+            this.keyMap = new Ext.KeyMap(this.el, this.keys);
+        }
+        return this.keyMap;
+    },
+
+    
+    initEvents : function(){
+        if(this.keys){
+            this.getKeyMap();
+        }
+        if(this.draggable){
+            this.initDraggable();
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout();
+                tb.on({
+                    scope: this,
+                    afterlayout: this.syncHeight,
+                    remove: this.syncHeight
+                });
+            }, this);
+            this.syncHeight();
+        }
+
+    },
+
+    
+    initDraggable : function(){
+        
+        this.dd = new Ext.Panel.DD(this, Ext.isBoolean(this.draggable) ? null : this.draggable);
+    },
+
+    
+    beforeEffect : function(anim){
+        if(this.floating){
+            this.el.beforeAction();
+        }
+        if(anim !== false){
+            this.el.addClass('x-panel-animated');
+        }
+    },
+
+    
+    afterEffect : function(anim){
+        this.syncShadow();
+        this.el.removeClass('x-panel-animated');
+    },
+
+    
+    createEffect : function(a, cb, scope){
+        var o = {
+            scope:scope,
+            block:true
+        };
+        if(a === true){
+            o.callback = cb;
+            return o;
+        }else if(!a.callback){
+            o.callback = cb;
+        }else { 
+            o.callback = function(){
+                cb.call(scope);
+                Ext.callback(a.callback, a.scope);
+            };
+        }
+        return Ext.applyIf(o, a);
+    },
+
+    
+    collapse : function(animate){
+        if(this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforecollapse', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.beforeEffect(doAnim);
+        this.onCollapse(doAnim, animate);
+        return this;
+    },
+
+    
+    onCollapse : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideOut(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterCollapse, this),
+                        this.collapseDefaults));
+        }else{
+            this[this.collapseEl].hide(this.hideMode);
+            this.afterCollapse(false);
+        }
+    },
+
+    
+    afterCollapse : function(anim){
+        this.collapsed = true;
+        this.el.addClass(this.collapsedCls);
+        if(anim !== false){
+            this[this.collapseEl].hide(this.hideMode);
+        }
+        this.afterEffect(anim);
+
+        
+        this.cascade(function(c) {
+            if (c.lastSize) {
+                c.lastSize = { width: undefined, height: undefined };
+            }
+        });
+        this.fireEvent('collapse', this);
+    },
+
+    
+    expand : function(animate){
+        if(!this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforeexpand', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.el.removeClass(this.collapsedCls);
+        this.beforeEffect(doAnim);
+        this.onExpand(doAnim, animate);
+        return this;
+    },
+
+    
+    onExpand : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideIn(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterExpand, this),
+                        this.expandDefaults));
+        }else{
+            this[this.collapseEl].show(this.hideMode);
+            this.afterExpand(false);
+        }
+    },
+
+    
+    afterExpand : function(anim){
+        this.collapsed = false;
+        if(anim !== false){
+            this[this.collapseEl].show(this.hideMode);
+        }
+        this.afterEffect(anim);
+        if (this.deferLayout) {
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+        this.fireEvent('expand', this);
+    },
+
+    
+    toggleCollapse : function(animate){
+        this[this.collapsed ? 'expand' : 'collapse'](animate);
+        return this;
+    },
+
+    
+    onDisable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.mask();
+        }
+        Ext.Panel.superclass.onDisable.call(this);
+    },
+
+    
+    onEnable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.unmask();
+        }
+        Ext.Panel.superclass.onEnable.call(this);
+    },
+
+    
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+        var w = adjWidth,
+            h = adjHeight;
+
+        if(Ext.isDefined(w) || Ext.isDefined(h)){
+            if(!this.collapsed){
+                
+                
+                
+
+                if(Ext.isNumber(w)){
+                    this.body.setWidth(w = this.adjustBodyWidth(w - this.getFrameWidth()));
+                } else if (w == 'auto') {
+                    w = this.body.setWidth('auto').dom.offsetWidth;
+                } else {
+                    w = this.body.dom.offsetWidth;
+                }
+
+                if(this.tbar){
+                    this.tbar.setWidth(w);
+                    if(this.topToolbar){
+                        this.topToolbar.setSize(w);
+                    }
+                }
+                if(this.bbar){
+                    this.bbar.setWidth(w);
+                    if(this.bottomToolbar){
+                        this.bottomToolbar.setSize(w);
+                        
+                        if (Ext.isIE) {
+                            this.bbar.setStyle('position', 'static');
+                            this.bbar.setStyle('position', '');
+                        }
+                    }
+                }
+                if(this.footer){
+                    this.footer.setWidth(w);
+                    if(this.fbar){
+                        this.fbar.setSize(Ext.isIE ? (w - this.footer.getFrameWidth('lr')) : 'auto');
+                    }
+                }
+
+                
+                if(Ext.isNumber(h)){
+                    h = Math.max(0, h - this.getFrameHeight());
+                    
+                    this.body.setHeight(h);
+                }else if(h == 'auto'){
+                    this.body.setHeight(h);
+                }
+
+                if(this.disabled && this.el._mask){
+                    this.el._mask.setSize(this.el.dom.clientWidth, this.el.getHeight());
+                }
+            }else{
+                
+                this.queuedBodySize = {width: w, height: h};
+                if(!this.queuedExpand && this.allowQueuedExpand !== false){
+                    this.queuedExpand = true;
+                    this.on('expand', function(){
+                        delete this.queuedExpand;
+                        this.onResize(this.queuedBodySize.width, this.queuedBodySize.height);
+                    }, this, {single:true});
+                }
+            }
+            this.onBodyResize(w, h);
+        }
+        this.syncShadow();
+        Ext.Panel.superclass.onResize.call(this, adjWidth, adjHeight, rawWidth, rawHeight);
+
+    },
+
+    
+    onBodyResize: function(w, h){
+        this.fireEvent('bodyresize', this, w, h);
+    },
+
+    
+    getToolbarHeight: function(){
+        var h = 0;
+        if(this.rendered){
+            Ext.each(this.toolbars, function(tb){
+                h += tb.getHeight();
+            }, this);
+        }
+        return h;
+    },
+
+    
+    adjustBodyHeight : function(h){
+        return h;
+    },
+
+    
+    adjustBodyWidth : function(w){
+        return w;
+    },
+
+    
+    onPosition : function(){
+        this.syncShadow();
+    },
+
+    
+    getFrameWidth : function(){
+        var w = this.el.getFrameWidth('lr') + this.bwrap.getFrameWidth('lr');
+
+        if(this.frame){
+            var l = this.bwrap.dom.firstChild;
+            w += (Ext.fly(l).getFrameWidth('l') + Ext.fly(l.firstChild).getFrameWidth('r'));
+            w += this.mc.getFrameWidth('lr');
+        }
+        return w;
+    },
+
+    
+    getFrameHeight : function() {
+        var h  = this.el.getFrameWidth('tb') + this.bwrap.getFrameWidth('tb');
+        h += (this.tbar ? this.tbar.getHeight() : 0) +
+             (this.bbar ? this.bbar.getHeight() : 0);
+
+        if(this.frame){
+            h += this.el.dom.firstChild.offsetHeight + this.ft.dom.offsetHeight + this.mc.getFrameWidth('tb');
+        }else{
+            h += (this.header ? this.header.getHeight() : 0) +
+                (this.footer ? this.footer.getHeight() : 0);
+        }
+        return h;
+    },
+
+    
+    getInnerWidth : function(){
+        return this.getSize().width - this.getFrameWidth();
+    },
+
+    
+    getInnerHeight : function(){
+        return this.body.getHeight();
+        
+    },
+
+    
+    syncShadow : function(){
+        if(this.floating){
+            this.el.sync(true);
+        }
+    },
+
+    
+    getLayoutTarget : function(){
+        return this.body;
+    },
+
+    
+    getContentTarget : function(){
+        return this.body;
+    },
+
+    
+    setTitle : function(title, iconCls){
+        this.title = title;
+        if(this.header && this.headerAsText){
+            this.header.child('span').update(title);
+        }
+        if(iconCls){
+            this.setIconClass(iconCls);
+        }
+        this.fireEvent('titlechange', this, title);
+        return this;
+    },
+
+    
+    getUpdater : function(){
+        return this.body.getUpdater();
+    },
+
+     
+    load : function(){
+        var um = this.body.getUpdater();
+        um.update.apply(um, arguments);
+        return this;
+    },
+
+    
+    beforeDestroy : function(){
+        Ext.Panel.superclass.beforeDestroy.call(this);
+        if(this.header){
+            this.header.removeAllListeners();
+        }
+        if(this.tools){
+            for(var k in this.tools){
+                Ext.destroy(this.tools[k]);
+            }
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.un('afterlayout', this.syncHeight, this);
+                tb.un('remove', this.syncHeight, this);
+            }, this);
+        }
+        if(Ext.isArray(this.buttons)){
+            while(this.buttons.length) {
+                Ext.destroy(this.buttons[0]);
+            }
+        }
+        if(this.rendered){
+            Ext.destroy(
+                this.ft,
+                this.header,
+                this.footer,
+                this.tbar,
+                this.bbar,
+                this.body,
+                this.mc,
+                this.bwrap,
+                this.dd
+            );
+            if (this.fbar) {
+                Ext.destroy(
+                    this.fbar,
+                    this.fbar.el
+                );
+            }
+        }
+        Ext.destroy(this.toolbars);
+    },
+
+    
+    createClasses : function(){
+        this.headerCls = this.baseCls + '-header';
+        this.headerTextCls = this.baseCls + '-header-text';
+        this.bwrapCls = this.baseCls + '-bwrap';
+        this.tbarCls = this.baseCls + '-tbar';
+        this.bodyCls = this.baseCls + '-body';
+        this.bbarCls = this.baseCls + '-bbar';
+        this.footerCls = this.baseCls + '-footer';
+    },
+
+    
+    createGhost : function(cls, useShim, appendTo){
+        var el = document.createElement('div');
+        el.className = 'x-panel-ghost ' + (cls ? cls : '');
+        if(this.header){
+            el.appendChild(this.el.dom.firstChild.cloneNode(true));
+        }
+        Ext.fly(el.appendChild(document.createElement('ul'))).setHeight(this.bwrap.getHeight());
+        el.style.width = this.el.dom.offsetWidth + 'px';;
+        if(!appendTo){
+            this.container.dom.appendChild(el);
+        }else{
+            Ext.getDom(appendTo).appendChild(el);
+        }
+        if(useShim !== false && this.el.useShim !== false){
+            var layer = new Ext.Layer({shadow:false, useDisplay:true, constrain:false}, el);
+            layer.show();
+            return layer;
+        }else{
+            return new Ext.Element(el);
+        }
+    },
+
+    
+    doAutoLoad : function(){
+        var u = this.body.getUpdater();
+        if(this.renderer){
+            u.setRenderer(this.renderer);
+        }
+        u.update(Ext.isObject(this.autoLoad) ? this.autoLoad : {url: this.autoLoad});
+    },
+
+    
+    getTool : function(id) {
+        return this.tools[id];
+    }
+
+
+});
+Ext.reg('panel', Ext.Panel);
+
+Ext.Editor = function(field, config){
+    if(field.field){
+        this.field = Ext.create(field.field, 'textfield');
+        config = Ext.apply({}, field); 
+        delete config.field;
+    }else{
+        this.field = field;
+    }
+    Ext.Editor.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.Editor, Ext.Component, {
+    
+    
+    allowBlur: true,
+    
+    
+    
+    
+    
+    value : "",
+    
+    alignment: "c-c?",
+    
+    offsets: [0, 0],
+    
+    shadow : "frame",
+    
+    constrain : false,
+    
+    swallowKeys : true,
+    
+    completeOnEnter : true,
+    
+    cancelOnEsc : true,
+    
+    updateEl : false,
+
+    initComponent : function(){
+        Ext.Editor.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            "beforestartedit",
+            
+            "startedit",
+            
+            "beforecomplete",
+            
+            "complete",
+            
+            "canceledit",
+            
+            "specialkey"
+        );
+    },
+
+    
+    onRender : function(ct, position){
+        this.el = new Ext.Layer({
+            shadow: this.shadow,
+            cls: "x-editor",
+            parentEl : ct,
+            shim : this.shim,
+            shadowOffset: this.shadowOffset || 4,
+            id: this.id,
+            constrain: this.constrain
+        });
+        if(this.zIndex){
+            this.el.setZIndex(this.zIndex);
+        }
+        this.el.setStyle("overflow", Ext.isGecko ? "auto" : "hidden");
+        if(this.field.msgTarget != 'title'){
+            this.field.msgTarget = 'qtip';
+        }
+        this.field.inEditor = true;
+        this.mon(this.field, {
+            scope: this,
+            blur: this.onBlur,
+            specialkey: this.onSpecialKey
+        });
+        if(this.field.grow){
+            this.mon(this.field, "autosize", this.el.sync,  this.el, {delay:1});
+        }
+        this.field.render(this.el).show();
+        this.field.getEl().dom.name = '';
+        if(this.swallowKeys){
+            this.field.el.swallowEvent([
+                'keypress', 
+                'keydown'   
+            ]);
+        }
+    },
+
+    
+    onSpecialKey : function(field, e){
+        var key = e.getKey(),
+            complete = this.completeOnEnter && key == e.ENTER,
+            cancel = this.cancelOnEsc && key == e.ESC;
+        if(complete || cancel){
+            e.stopEvent();
+            if(complete){
+                this.completeEdit();
+            }else{
+                this.cancelEdit();
+            }
+            if(field.triggerBlur){
+                field.triggerBlur();
+            }
+        }
+        this.fireEvent('specialkey', field, e);
+    },
+
+    
+    startEdit : function(el, value){
+        if(this.editing){
+            this.completeEdit();
+        }
+        this.boundEl = Ext.get(el);
+        var v = value !== undefined ? value : this.boundEl.dom.innerHTML;
+        if(!this.rendered){
+            this.render(this.parentEl || document.body);
+        }
+        if(this.fireEvent("beforestartedit", this, this.boundEl, v) !== false){
+            this.startValue = v;
+            this.field.reset();
+            this.field.setValue(v);
+            this.realign(true);
+            this.editing = true;
+            this.show();
+        }
+    },
+
+    
+    doAutoSize : function(){
+        if(this.autoSize){
+            var sz = this.boundEl.getSize(),
+                fs = this.field.getSize();
+
+            switch(this.autoSize){
+                case "width":
+                    this.setSize(sz.width, fs.height);
+                    break;
+                case "height":
+                    this.setSize(fs.width, sz.height);
+                    break;
+                case "none":
+                    this.setSize(fs.width, fs.height);
+                    break;
+                default:
+                    this.setSize(sz.width, sz.height);
+            }
+        }
+    },
+
+    
+    setSize : function(w, h){
+        delete this.field.lastSize;
+        this.field.setSize(w, h);
+        if(this.el){
+            
+            if(Ext.isGecko2 || Ext.isOpera || (Ext.isIE7 && Ext.isStrict)){
+                
+                this.el.setSize(w, h);
+            }
+            this.el.sync();
+        }
+    },
+
+    
+    realign : function(autoSize){
+        if(autoSize === true){
+            this.doAutoSize();
+        }
+        this.el.alignTo(this.boundEl, this.alignment, this.offsets);
+    },
+
+    
+    completeEdit : function(remainVisible){
+        if(!this.editing){
+            return;
+        }
+        
+        if (this.field.assertValue) {
+            this.field.assertValue();
+        }
+        var v = this.getValue();
+        if(!this.field.isValid()){
+            if(this.revertInvalid !== false){
+                this.cancelEdit(remainVisible);
+            }
+            return;
+        }
+        if(String(v) === String(this.startValue) && this.ignoreNoChange){
+            this.hideEdit(remainVisible);
+            return;
+        }
+        if(this.fireEvent("beforecomplete", this, v, this.startValue) !== false){
+            v = this.getValue();
+            if(this.updateEl && this.boundEl){
+                this.boundEl.update(v);
+            }
+            this.hideEdit(remainVisible);
+            this.fireEvent("complete", this, v, this.startValue);
+        }
+    },
+
+    
+    onShow : function(){
+        this.el.show();
+        if(this.hideEl !== false){
+            this.boundEl.hide();
+        }
+        this.field.show().focus(false, true);
+        this.fireEvent("startedit", this.boundEl, this.startValue);
+    },
+
+    
+    cancelEdit : function(remainVisible){
+        if(this.editing){
+            var v = this.getValue();
+            this.setValue(this.startValue);
+            this.hideEdit(remainVisible);
+            this.fireEvent("canceledit", this, v, this.startValue);
+        }
+    },
+
+    
+    hideEdit: function(remainVisible){
+        if(remainVisible !== true){
+            this.editing = false;
+            this.hide();
+        }
+    },
+
+    
+    onBlur : function(){
+        
+        if(this.allowBlur === true && this.editing && this.selectSameEditor !== true){
+            this.completeEdit();
+        }
+    },
+
+    
+    onHide : function(){
+        if(this.editing){
+            this.completeEdit();
+            return;
+        }
+        this.field.blur();
+        if(this.field.collapse){
+            this.field.collapse();
+        }
+        this.el.hide();
+        if(this.hideEl !== false){
+            this.boundEl.show();
+        }
+    },
+
+    
+    setValue : function(v){
+        this.field.setValue(v);
+    },
+
+    
+    getValue : function(){
+        return this.field.getValue();
+    },
+
+    beforeDestroy : function(){
+        Ext.destroyMembers(this, 'field');
+
+        delete this.parentEl;
+        delete this.boundEl;
+    }
+});
+Ext.reg('editor', Ext.Editor);
+
+Ext.ColorPalette = Ext.extend(Ext.Component, {
+	
+    
+    itemCls : 'x-color-palette',
+    
+    value : null,
+    
+    clickEvent :'click',
+    
+    ctype : 'Ext.ColorPalette',
+
+    
+    allowReselect : false,
+
+    
+    colors : [
+        '000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333',
+        '800000', 'FF6600', '808000', '008000', '008080', '0000FF', '666699', '808080',
+        'FF0000', 'FF9900', '99CC00', '339966', '33CCCC', '3366FF', '800080', '969696',
+        'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0',
+        'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', '99CCFF', 'CC99FF', 'FFFFFF'
+    ],
+
+    
+    
+    
+    
+    initComponent : function(){
+        Ext.ColorPalette.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler, this.scope, true);
+        }    
+    },
+
+    
+    onRender : function(container, position){
+        this.autoEl = {
+            tag: 'div',
+            cls: this.itemCls
+        };
+        Ext.ColorPalette.superclass.onRender.call(this, container, position);
+        var t = this.tpl || new Ext.XTemplate(
+            '<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>'
+        );
+        t.overwrite(this.el, this.colors);
+        this.mon(this.el, this.clickEvent, this.handleClick, this, {delegate: 'a'});
+        if(this.clickEvent != 'click'){
+        	this.mon(this.el, 'click', Ext.emptyFn, this, {delegate: 'a', preventDefault: true});
+        }
+    },
+
+    
+    afterRender : function(){
+        Ext.ColorPalette.superclass.afterRender.call(this);
+        if(this.value){
+            var s = this.value;
+            this.value = null;
+            this.select(s, true);
+        }
+    },
+
+    
+    handleClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            var c = t.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];
+            this.select(c.toUpperCase());
+        }
+    },
+
+    
+    select : function(color, suppressEvent){
+        color = color.replace('#', '');
+        if(color != this.value || this.allowReselect){
+            var el = this.el;
+            if(this.value){
+                el.child('a.color-'+this.value).removeClass('x-color-palette-sel');
+            }
+            el.child('a.color-'+color).addClass('x-color-palette-sel');
+            this.value = color;
+            if(suppressEvent !== true){
+                this.fireEvent('select', this, color);
+            }
+        }
+    }
+
+    
+});
+Ext.reg('colorpalette', Ext.ColorPalette);
+Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
+    
+    todayText : 'Today',
+    
+    okText : '&#160;OK&#160;',
+    
+    cancelText : 'Cancel',
+    
+    
+    
+    todayTip : '{0} (Spacebar)',
+    
+    minText : 'This date is before the minimum date',
+    
+    maxText : 'This date is after the maximum date',
+    
+    format : 'm/d/y',
+    
+    disabledDaysText : 'Disabled',
+    
+    disabledDatesText : 'Disabled',
+    
+    monthNames : Date.monthNames,
+    
+    dayNames : Date.dayNames,
+    
+    nextText : 'Next Month (Control+Right)',
+    
+    prevText : 'Previous Month (Control+Left)',
+    
+    monthYearText : 'Choose a month (Control+Up/Down to move years)',
+    
+    startDay : 0,
+    
+    showToday : true,
+    
+    
+    
+    
+    
+
+    
+    
+    focusOnSelect: true,
+
+    
+    
+    initHour: 12, 
+
+    
+    initComponent : function(){
+        Ext.DatePicker.superclass.initComponent.call(this);
+
+        this.value = this.value ?
+                 this.value.clearTime(true) : new Date().clearTime();
+
+        this.addEvents(
+            
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler,  this.scope || this);
+        }
+
+        this.initDisabledDays();
+    },
+
+    
+    initDisabledDays : function(){
+        if(!this.disabledDatesRE && this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = '(?:';
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    
+    setDisabledDates : function(dd){
+        if(Ext.isArray(dd)){
+            this.disabledDates = dd;
+            this.disabledDatesRE = null;
+        }else{
+            this.disabledDatesRE = dd;
+        }
+        this.initDisabledDays();
+        this.update(this.value, true);
+    },
+
+    
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        this.update(this.value, true);
+    },
+
+    
+    setMinDate : function(dt){
+        this.minDate = dt;
+        this.update(this.value, true);
+    },
+
+    
+    setMaxDate : function(dt){
+        this.maxDate = dt;
+        this.update(this.value, true);
+    },
+
+    
+    setValue : function(value){
+        this.value = value.clearTime(true);
+        this.update(this.value);
+    },
+
+    
+    getValue : function(){
+        return this.value;
+    },
+
+    
+    focus : function(){
+        this.update(this.activeDate);
+    },
+
+    
+    onEnable: function(initial){
+        Ext.DatePicker.superclass.onEnable.call(this);
+        this.doDisabled(false);
+        this.update(initial ? this.value : this.activeDate);
+        if(Ext.isIE){
+            this.el.repaint();
+        }
+
+    },
+
+    
+    onDisable : function(){
+        Ext.DatePicker.superclass.onDisable.call(this);
+        this.doDisabled(true);
+        if(Ext.isIE && !Ext.isIE8){
+            
+             Ext.each([].concat(this.textNodes, this.el.query('th span')), function(el){
+                 Ext.fly(el).repaint();
+             });
+        }
+    },
+
+    
+    doDisabled : function(disabled){
+        this.keyNav.setDisabled(disabled);
+        this.prevRepeater.setDisabled(disabled);
+        this.nextRepeater.setDisabled(disabled);
+        if(this.showToday){
+            this.todayKeyListener.setDisabled(disabled);
+            this.todayBtn.setDisabled(disabled);
+        }
+    },
+
+    
+    onRender : function(container, position){
+        var m = [
+             '<table cellspacing="0">',
+                '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr>',
+                '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],
+                dn = this.dayNames,
+                i;
+        for(i = 0; i < 7; i++){
+            var d = this.startDay+i;
+            if(d > 6){
+                d = d-7;
+            }
+            m.push('<th><span>', dn[d].substr(0,1), '</span></th>');
+        }
+        m[m.length] = '</tr></thead><tbody><tr>';
+        for(i = 0; i < 42; i++) {
+            if(i % 7 === 0 && i !== 0){
+                m[m.length] = '</tr><tr>';
+            }
+            m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
+        }
+        m.push('</tr></tbody></table></td></tr>',
+                this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '',
+                '</table><div class="x-date-mp"></div>');
+
+        var el = document.createElement('div');
+        el.className = 'x-date-picker';
+        el.innerHTML = m.join('');
+
+        container.dom.insertBefore(el, position);
+
+        this.el = Ext.get(el);
+        this.eventEl = Ext.get(el.firstChild);
+
+        this.prevRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-left a'), {
+            handler: this.showPrevMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.nextRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-right a'), {
+            handler: this.showNextMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.monthPicker = this.el.down('div.x-date-mp');
+        this.monthPicker.enableDisplayMode('block');
+
+        this.keyNav = new Ext.KeyNav(this.eventEl, {
+            'left' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevMonth();
+                }else{
+                    this.update(this.activeDate.add('d', -1));
+                }
+            },
+
+            'right' : function(e){
+                if(e.ctrlKey){
+                    this.showNextMonth();
+                }else{
+                    this.update(this.activeDate.add('d', 1));
+                }
+            },
+
+            'up' : function(e){
+                if(e.ctrlKey){
+                    this.showNextYear();
+                }else{
+                    this.update(this.activeDate.add('d', -7));
+                }
+            },
+
+            'down' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevYear();
+                }else{
+                    this.update(this.activeDate.add('d', 7));
+                }
+            },
+
+            'pageUp' : function(e){
+                this.showNextMonth();
+            },
+
+            'pageDown' : function(e){
+                this.showPrevMonth();
+            },
+
+            'enter' : function(e){
+                e.stopPropagation();
+                return true;
+            },
+
+            scope : this
+        });
+
+        this.el.unselectable();
+
+        this.cells = this.el.select('table.x-date-inner tbody td');
+        this.textNodes = this.el.query('table.x-date-inner tbody span');
+
+        this.mbtn = new Ext.Button({
+            text: '&#160;',
+            tooltip: this.monthYearText,
+            renderTo: this.el.child('td.x-date-middle', true)
+        });
+        this.mbtn.el.child('em').addClass('x-btn-arrow');
+
+        if(this.showToday){
+            this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,  this);
+            var today = (new Date()).dateFormat(this.format);
+            this.todayBtn = new Ext.Button({
+                renderTo: this.el.child('td.x-date-bottom', true),
+                text: String.format(this.todayText, today),
+                tooltip: String.format(this.todayTip, today),
+                handler: this.selectToday,
+                scope: this
+            });
+        }
+        this.mon(this.eventEl, 'mousewheel', this.handleMouseWheel, this);
+        this.mon(this.eventEl, 'click', this.handleDateClick,  this, {delegate: 'a.x-date-date'});
+        this.mon(this.mbtn, 'click', this.showMonthPicker, this);
+        this.onEnable(true);
+    },
+
+    
+    createMonthPicker : function(){
+        if(!this.monthPicker.dom.firstChild){
+            var buf = ['<table border="0" cellspacing="0">'];
+            for(var i = 0; i < 6; i++){
+                buf.push(
+                    '<tr><td class="x-date-mp-month"><a href="#">', Date.getShortMonthName(i), '</a></td>',
+                    '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', Date.getShortMonthName(i + 6), '</a></td>',
+                    i === 0 ?
+                    '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
+                    '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
+                );
+            }
+            buf.push(
+                '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
+                    this.okText,
+                    '</button><button type="button" class="x-date-mp-cancel">',
+                    this.cancelText,
+                    '</button></td></tr>',
+                '</table>'
+            );
+            this.monthPicker.update(buf.join(''));
+
+            this.mon(this.monthPicker, 'click', this.onMonthClick, this);
+            this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
+
+            this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
+            this.mpYears = this.monthPicker.select('td.x-date-mp-year');
+
+            this.mpMonths.each(function(m, a, i){
+                i += 1;
+                if((i%2) === 0){
+                    m.dom.xmonth = 5 + Math.round(i * 0.5);
+                }else{
+                    m.dom.xmonth = Math.round((i-1) * 0.5);
+                }
+            });
+        }
+    },
+
+    
+    showMonthPicker : function(){
+        if(!this.disabled){
+            this.createMonthPicker();
+            var size = this.el.getSize();
+            this.monthPicker.setSize(size);
+            this.monthPicker.child('table').setSize(size);
+
+            this.mpSelMonth = (this.activeDate || this.value).getMonth();
+            this.updateMPMonth(this.mpSelMonth);
+            this.mpSelYear = (this.activeDate || this.value).getFullYear();
+            this.updateMPYear(this.mpSelYear);
+
+            this.monthPicker.slideIn('t', {duration:0.2});
+        }
+    },
+
+    
+    updateMPYear : function(y){
+        this.mpyear = y;
+        var ys = this.mpYears.elements;
+        for(var i = 1; i <= 10; i++){
+            var td = ys[i-1], y2;
+            if((i%2) === 0){
+                y2 = y + Math.round(i * 0.5);
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }else{
+                y2 = y - (5-Math.round(i * 0.5));
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }
+            this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        }
+    },
+
+    
+    updateMPMonth : function(sm){
+        this.mpMonths.each(function(m, a, i){
+            m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        });
+    },
+
+    
+    selectMPMonth : function(m){
+
+    },
+
+    
+    onMonthClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if(el.is('button.x-date-mp-cancel')){
+            this.hideMonthPicker();
+        }
+        else if(el.is('button.x-date-mp-ok')){
+            var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
+            if(d.getMonth() != this.mpSelMonth){
+                
+                d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
+            }
+            this.update(d);
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-month', 2))){
+            this.mpMonths.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelMonth = pn.dom.xmonth;
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.mpYears.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelYear = pn.dom.xyear;
+        }
+        else if(el.is('a.x-date-mp-prev')){
+            this.updateMPYear(this.mpyear-10);
+        }
+        else if(el.is('a.x-date-mp-next')){
+            this.updateMPYear(this.mpyear+10);
+        }
+    },
+
+    
+    onMonthDblClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if((pn = el.up('td.x-date-mp-month', 2))){
+            this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+    },
+
+    
+    hideMonthPicker : function(disableAnim){
+        if(this.monthPicker){
+            if(disableAnim === true){
+                this.monthPicker.hide();
+            }else{
+                this.monthPicker.slideOut('t', {duration:0.2});
+            }
+        }
+    },
+
+    
+    showPrevMonth : function(e){
+        this.update(this.activeDate.add('mo', -1));
+    },
+
+    
+    showNextMonth : function(e){
+        this.update(this.activeDate.add('mo', 1));
+    },
+
+    
+    showPrevYear : function(){
+        this.update(this.activeDate.add('y', -1));
+    },
+
+    
+    showNextYear : function(){
+        this.update(this.activeDate.add('y', 1));
+    },
+
+    
+    handleMouseWheel : function(e){
+        e.stopEvent();
+        if(!this.disabled){
+            var delta = e.getWheelDelta();
+            if(delta > 0){
+                this.showPrevMonth();
+            } else if(delta < 0){
+                this.showNextMonth();
+            }
+        }
+    },
+
+    
+    handleDateClick : function(e, t){
+        e.stopEvent();
+        if(!this.disabled && t.dateValue && !Ext.fly(t.parentNode).hasClass('x-date-disabled')){
+            this.cancelFocus = this.focusOnSelect === false;
+            this.setValue(new Date(t.dateValue));
+            delete this.cancelFocus;
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    
+    selectToday : function(){
+        if(this.todayBtn && !this.todayBtn.disabled){
+            this.setValue(new Date().clearTime());
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    
+    update : function(date, forceRefresh){
+        if(this.rendered){
+            var vd = this.activeDate, vis = this.isVisible();
+            this.activeDate = date;
+            if(!forceRefresh && vd && this.el){
+                var t = date.getTime();
+                if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
+                    this.cells.removeClass('x-date-selected');
+                    this.cells.each(function(c){
+                       if(c.dom.firstChild.dateValue == t){
+                           c.addClass('x-date-selected');
+                           if(vis && !this.cancelFocus){
+                               Ext.fly(c.dom.firstChild).focus(50);
+                           }
+                           return false;
+                       }
+                    }, this);
+                    return;
+                }
+            }
+            var days = date.getDaysInMonth(),
+                firstOfMonth = date.getFirstDateOfMonth(),
+                startingPos = firstOfMonth.getDay()-this.startDay;
+
+            if(startingPos < 0){
+                startingPos += 7;
+            }
+            days += startingPos;
+
+            var pm = date.add('mo', -1),
+                prevStart = pm.getDaysInMonth()-startingPos,
+                cells = this.cells.elements,
+                textEls = this.textNodes,
+                
+                d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart, this.initHour)),
+                today = new Date().clearTime().getTime(),
+                sel = date.clearTime(true).getTime(),
+                min = this.minDate ? this.minDate.clearTime(true) : Number.NEGATIVE_INFINITY,
+                max = this.maxDate ? this.maxDate.clearTime(true) : Number.POSITIVE_INFINITY,
+                ddMatch = this.disabledDatesRE,
+                ddText = this.disabledDatesText,
+                ddays = this.disabledDays ? this.disabledDays.join('') : false,
+                ddaysText = this.disabledDaysText,
+                format = this.format;
+
+            if(this.showToday){
+                var td = new Date().clearTime(),
+                    disable = (td < min || td > max ||
+                    (ddMatch && format && ddMatch.test(td.dateFormat(format))) ||
+                    (ddays && ddays.indexOf(td.getDay()) != -1));
+
+                if(!this.disabled){
+                    this.todayBtn.setDisabled(disable);
+                    this.todayKeyListener[disable ? 'disable' : 'enable']();
+                }
+            }
+
+            var setCellClass = function(cal, cell){
+                cell.title = '';
+                var t = d.clearTime(true).getTime();
+                cell.firstChild.dateValue = t;
+                if(t == today){
+                    cell.className += ' x-date-today';
+                    cell.title = cal.todayText;
+                }
+                if(t == sel){
+                    cell.className += ' x-date-selected';
+                    if(vis){
+                        Ext.fly(cell.firstChild).focus(50);
+                    }
+                }
+                
+                if(t < min) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.minText;
+                    return;
+                }
+                if(t > max) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.maxText;
+                    return;
+                }
+                if(ddays){
+                    if(ddays.indexOf(d.getDay()) != -1){
+                        cell.title = ddaysText;
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+                if(ddMatch && format){
+                    var fvalue = d.dateFormat(format);
+                    if(ddMatch.test(fvalue)){
+                        cell.title = ddText.replace('%0', fvalue);
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+            };
+
+            var i = 0;
+            for(; i < startingPos; i++) {
+                textEls[i].innerHTML = (++prevStart);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-prevday';
+                setCellClass(this, cells[i]);
+            }
+            for(; i < days; i++){
+                var intDay = i - startingPos + 1;
+                textEls[i].innerHTML = (intDay);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-active';
+                setCellClass(this, cells[i]);
+            }
+            var extraDays = 0;
+            for(; i < 42; i++) {
+                 textEls[i].innerHTML = (++extraDays);
+                 d.setDate(d.getDate()+1);
+                 cells[i].className = 'x-date-nextday';
+                 setCellClass(this, cells[i]);
+            }
+
+            this.mbtn.setText(this.monthNames[date.getMonth()] + ' ' + date.getFullYear());
+
+            if(!this.internalRender){
+                var main = this.el.dom.firstChild,
+                    w = main.offsetWidth;
+                this.el.setWidth(w + this.el.getBorderWidth('lr'));
+                Ext.fly(main).setWidth(w);
+                this.internalRender = true;
+                
+                
+                
+                if(Ext.isOpera && !this.secondPass){
+                    main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + 'px';
+                    this.secondPass = true;
+                    this.update.defer(10, this, [date]);
+                }
+            }
+        }
+    },
+
+    
+    beforeDestroy : function() {
+        if(this.rendered){
+            Ext.destroy(
+                this.keyNav,
+                this.monthPicker,
+                this.eventEl,
+                this.mbtn,
+                this.nextRepeater,
+                this.prevRepeater,
+                this.cells.el,
+                this.todayBtn
+            );
+            delete this.textNodes;
+            delete this.cells.elements;
+        }
+    }
+
+    
+});
+
+Ext.reg('datepicker', Ext.DatePicker);
+
+Ext.LoadMask = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(this.store){
+        this.store.on({
+            scope: this,
+            beforeload: this.onBeforeLoad,
+            load: this.onLoad,
+            exception: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, false);
+    }else{
+        var um = this.el.getUpdater();
+        um.showLoadIndicator = false; 
+        um.on({
+            scope: this,
+            beforeupdate: this.onBeforeLoad,
+            update: this.onLoad,
+            failure: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, true);
+    }
+};
+
+Ext.LoadMask.prototype = {
+    
+    
+    
+    msg : 'Loading...',
+    
+    msgCls : 'x-mask-loading',
+
+    
+    disabled: false,
+
+    
+    disable : function(){
+       this.disabled = true;
+    },
+
+    
+    enable : function(){
+        this.disabled = false;
+    },
+
+    
+    onLoad : function(){
+        this.el.unmask(this.removeMask);
+    },
+
+    
+    onBeforeLoad : function(){
+        if(!this.disabled){
+            this.el.mask(this.msg, this.msgCls);
+        }
+    },
+
+    
+    show: function(){
+        this.onBeforeLoad();
+    },
+
+    
+    hide: function(){
+        this.onLoad();
+    },
+
+    
+    destroy : function(){
+        if(this.store){
+            this.store.un('beforeload', this.onBeforeLoad, this);
+            this.store.un('load', this.onLoad, this);
+            this.store.un('exception', this.onLoad, this);
+        }else{
+            var um = this.el.getUpdater();
+            um.un('beforeupdate', this.onBeforeLoad, this);
+            um.un('update', this.onLoad, this);
+            um.un('failure', this.onLoad, this);
+        }
+    }
+};
+Ext.slider.Thumb = Ext.extend(Object, {
+    
+    
+    dragging: false,
+
+    
+    constructor: function(config) {
+        
+        Ext.apply(this, config || {}, {
+            cls: 'x-slider-thumb',
+
+            
+            constrain: false
+        });
+
+        Ext.slider.Thumb.superclass.constructor.call(this, config);
+
+        if (this.slider.vertical) {
+            Ext.apply(this, Ext.slider.Thumb.Vertical);
+        }
+    },
+
+    
+    render: function() {
+        this.el = this.slider.innerEl.insertFirst({cls: this.cls});
+
+        this.initEvents();
+    },
+
+    
+    enable: function() {
+        this.disabled = false;
+        this.el.removeClass(this.slider.disabledClass);
+    },
+
+    
+    disable: function() {
+        this.disabled = true;
+        this.el.addClass(this.slider.disabledClass);
+    },
+
+    
+    initEvents: function() {
+        var el = this.el;
+
+        el.addClassOnOver('x-slider-thumb-over');
+
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeDragStart.createDelegate(this),
+            onStart      : this.onDragStart.createDelegate(this),
+            onDrag       : this.onDrag.createDelegate(this),
+            onEnd        : this.onDragEnd.createDelegate(this),
+            tolerance    : 3,
+            autoStart    : 300
+        });
+
+        this.tracker.initEl(el);
+    },
+
+    
+    onBeforeDragStart : function(e) {
+        if (this.disabled) {
+            return false;
+        } else {
+            this.slider.promoteThumb(this);
+            return true;
+        }
+    },
+
+    
+    onDragStart: function(e){
+        this.el.addClass('x-slider-thumb-drag');
+        this.dragging = true;
+        this.dragStartValue = this.value;
+
+        this.slider.fireEvent('dragstart', this.slider, e, this);
+    },
+
+    
+    onDrag: function(e) {
+        var slider   = this.slider,
+            index    = this.index,
+            newValue = this.getNewValue();
+
+        if (this.constrain) {
+            var above = slider.thumbs[index + 1],
+                below = slider.thumbs[index - 1];
+
+            if (below != undefined && newValue <= below.value) newValue = below.value;
+            if (above != undefined && newValue >= above.value) newValue = above.value;
+        }
+
+        slider.setValue(index, newValue, false);
+        slider.fireEvent('drag', slider, e, this);
+    },
+
+    getNewValue: function() {
+        var slider   = this.slider,
+            pos      = slider.innerEl.translatePoints(this.tracker.getXY());
+
+        return Ext.util.Format.round(slider.reverseValue(pos.left), slider.decimalPrecision);
+    },
+
+    
+    onDragEnd: function(e) {
+        var slider = this.slider,
+            value  = this.value;
+
+        this.el.removeClass('x-slider-thumb-drag');
+
+        this.dragging = false;
+        slider.fireEvent('dragend', slider, e);
+
+        if (this.dragStartValue != value) {
+            slider.fireEvent('changecomplete', slider, value, this);
+        }
+    },
+    
+    
+    destroy: function(){
+        Ext.destroyMembers(this, 'tracker', 'el');
+    }
+});
+
+
+Ext.slider.MultiSlider = Ext.extend(Ext.BoxComponent, {
+    
+    
+    vertical: false,
+    
+    minValue: 0,
+    
+    maxValue: 100,
+    
+    decimalPrecision: 0,
+    
+    keyIncrement: 1,
+    
+    increment: 0,
+
+    
+    clickRange: [5,15],
+
+    
+    clickToChange : true,
+    
+    animate: true,
+    
+    constrainThumbs: true,
+
+    
+    topThumbZIndex: 10000,
+
+    
+    initComponent : function(){
+        if(!Ext.isDefined(this.value)){
+            this.value = this.minValue;
+        }
+
+        
+        this.thumbs = [];
+
+        Ext.slider.MultiSlider.superclass.initComponent.call(this);
+
+        this.keyIncrement = Math.max(this.increment, this.keyIncrement);
+        this.addEvents(
+            
+            'beforechange',
+
+            
+            'change',
+
+            
+            'changecomplete',
+
+            
+            'dragstart',
+
+            
+            'drag',
+
+            
+            'dragend'
+        );
+
+        
+        if (this.values == undefined || Ext.isEmpty(this.values)) this.values = [0];
+
+        var values = this.values;
+
+        for (var i=0; i < values.length; i++) {
+            this.addThumb(values[i]);
+        }
+
+        if(this.vertical){
+            Ext.apply(this, Ext.slider.Vertical);
+        }
+    },
+
+    
+    addThumb: function(value) {
+        var thumb = new Ext.slider.Thumb({
+            value    : value,
+            slider   : this,
+            index    : this.thumbs.length,
+            constrain: this.constrainThumbs
+        });
+        this.thumbs.push(thumb);
+
+        
+        if (this.rendered) thumb.render();
+    },
+
+    
+    promoteThumb: function(topThumb) {
+        var thumbs = this.thumbs,
+            zIndex, thumb;
+
+        for (var i = 0, j = thumbs.length; i < j; i++) {
+            thumb = thumbs[i];
+
+            if (thumb == topThumb) {
+                zIndex = this.topThumbZIndex;
+            } else {
+                zIndex = '';
+            }
+
+            thumb.el.setStyle('zIndex', zIndex);
+        }
+    },
+
+    
+    onRender : function() {
+        this.autoEl = {
+            cls: 'x-slider ' + (this.vertical ? 'x-slider-vert' : 'x-slider-horz'),
+            cn : {
+                cls: 'x-slider-end',
+                cn : {
+                    cls:'x-slider-inner',
+                    cn : [{tag:'a', cls:'x-slider-focus', href:"#", tabIndex: '-1', hidefocus:'on'}]
+                }
+            }
+        };
+
+        Ext.slider.MultiSlider.superclass.onRender.apply(this, arguments);
+
+        this.endEl   = this.el.first();
+        this.innerEl = this.endEl.first();
+        this.focusEl = this.innerEl.child('.x-slider-focus');
+
+        
+        for (var i=0; i < this.thumbs.length; i++) {
+            this.thumbs[i].render();
+        }
+
+        
+        var thumb      = this.innerEl.child('.x-slider-thumb');
+        this.halfThumb = (this.vertical ? thumb.getHeight() : thumb.getWidth()) / 2;
+
+        this.initEvents();
+    },
+
+    
+    initEvents : function(){
+        this.mon(this.el, {
+            scope    : this,
+            mousedown: this.onMouseDown,
+            keydown  : this.onKeyDown
+        });
+
+        this.focusEl.swallowEvent("click", true);
+    },
+
+    
+    onMouseDown : function(e){
+        if(this.disabled){
+            return;
+        }
+
+        
+        var thumbClicked = false;
+        for (var i=0; i < this.thumbs.length; i++) {
+            thumbClicked = thumbClicked || e.target == this.thumbs[i].el.dom;
+        }
+
+        if (this.clickToChange && !thumbClicked) {
+            var local = this.innerEl.translatePoints(e.getXY());
+            this.onClickChange(local);
+        }
+        this.focus();
+    },
+
+    
+    onClickChange : function(local) {
+        if (local.top > this.clickRange[0] && local.top < this.clickRange[1]) {
+            
+            var thumb = this.getNearest(local, 'left'),
+                index = thumb.index;
+
+            this.setValue(index, Ext.util.Format.round(this.reverseValue(local.left), this.decimalPrecision), undefined, true);
+        }
+    },
+
+    
+    getNearest: function(local, prop) {
+        var localValue = prop == 'top' ? this.innerEl.getHeight() - local[prop] : local[prop],
+            clickValue = this.reverseValue(localValue),
+            nearestDistance = (this.maxValue - this.minValue) + 5, 
+            index = 0,
+            nearest = null;
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                value = thumb.value,
+                dist  = Math.abs(value - clickValue);
+
+            if (Math.abs(dist <= nearestDistance)) {
+                nearest = thumb;
+                index = i;
+                nearestDistance = dist;
+            }
+        }
+        return nearest;
+    },
+
+    
+    onKeyDown : function(e){
+        
+        if(this.disabled || this.thumbs.length !== 1){
+            e.preventDefault();
+            return;
+        }
+        var k = e.getKey(),
+            val;
+        switch(k){
+            case e.UP:
+            case e.RIGHT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.maxValue : this.getValue(0) + this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            case e.DOWN:
+            case e.LEFT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.minValue : this.getValue(0) - this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            default:
+                e.preventDefault();
+        }
+    },
+
+    
+    doSnap : function(value){
+        if (!(this.increment && value)) {
+            return value;
+        }
+        var newValue = value,
+            inc = this.increment,
+            m = value % inc;
+        if (m != 0) {
+            newValue -= m;
+            if (m * 2 >= inc) {
+                newValue += inc;
+            } else if (m * 2 < -inc) {
+                newValue -= inc;
+            }
+        }
+        return newValue.constrain(this.minValue,  this.maxValue);
+    },
+
+    
+    afterRender : function(){
+        Ext.slider.MultiSlider.superclass.afterRender.apply(this, arguments);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i];
+
+            if (thumb.value !== undefined) {
+                var v = this.normalizeValue(thumb.value);
+
+                if (v !== thumb.value) {
+                    
+                    this.setValue(i, v, false);
+                } else {
+                    this.moveThumb(i, this.translateValue(v), false);
+                }
+            }
+        };
+    },
+
+    
+    getRatio : function(){
+        var w = this.innerEl.getWidth(),
+            v = this.maxValue - this.minValue;
+        return v == 0 ? w : (w/v);
+    },
+
+    
+    normalizeValue : function(v){
+        v = this.doSnap(v);
+        v = Ext.util.Format.round(v, this.decimalPrecision);
+        v = v.constrain(this.minValue, this.maxValue);
+        return v;
+    },
+
+    
+    setMinValue : function(val){
+        this.minValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value < val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    
+    setMaxValue : function(val){
+        this.maxValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value > val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    
+    setValue : function(index, v, animate, changeComplete) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        v = this.normalizeValue(v);
+
+        if (v !== thumb.value && this.fireEvent('beforechange', this, v, thumb.value, thumb) !== false) {
+            thumb.value = v;
+            if(this.rendered){
+                this.moveThumb(index, this.translateValue(v), animate !== false);
+                this.fireEvent('change', this, v, thumb);
+                if(changeComplete){
+                    this.fireEvent('changecomplete', this, v, thumb);
+                }
+            }
+        }
+    },
+
+    
+    translateValue : function(v) {
+        var ratio = this.getRatio();
+        return (v * ratio) - (this.minValue * ratio) - this.halfThumb;
+    },
+
+    
+    reverseValue : function(pos){
+        var ratio = this.getRatio();
+        return (pos + (this.minValue * ratio)) / ratio;
+    },
+
+    
+    moveThumb: function(index, v, animate){
+        var thumb = this.thumbs[index].el;
+
+        if(!animate || this.animate === false){
+            thumb.setLeft(v);
+        }else{
+            thumb.shift({left: v, stopFx: true, duration:.35});
+        }
+    },
+
+    
+    focus : function(){
+        this.focusEl.focus(10);
+    },
+
+    
+    onResize : function(w, h){
+        var thumbs = this.thumbs,
+            len = thumbs.length,
+            i = 0;
+            
+        
+        for(; i < len; ++i){
+            thumbs[i].el.stopFx();    
+        }
+        
+        if(Ext.isNumber(w)){
+            this.innerEl.setWidth(w - (this.el.getPadding('l') + this.endEl.getPadding('r')));
+        }
+        this.syncThumb();
+        Ext.slider.MultiSlider.superclass.onResize.apply(this, arguments);
+    },
+
+    
+    onDisable: function(){
+        Ext.slider.MultiSlider.superclass.onDisable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.disable();
+
+            if(Ext.isIE){
+                
+                
+                var xy = el.getXY();
+                el.hide();
+
+                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
+
+                if (!this.thumbHolder) {
+                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
+                }
+
+                this.thumbHolder.show().setXY(xy);
+            }
+        }
+    },
+
+    
+    onEnable: function(){
+        Ext.slider.MultiSlider.superclass.onEnable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.enable();
+
+            if (Ext.isIE) {
+                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
+
+                if (this.thumbHolder) this.thumbHolder.hide();
+
+                el.show();
+                this.syncThumb();
+            }
+        }
+    },
+
+    
+    syncThumb : function() {
+        if (this.rendered) {
+            for (var i=0; i < this.thumbs.length; i++) {
+                this.moveThumb(i, this.translateValue(this.thumbs[i].value));
+            }
+        }
+    },
+
+    
+    getValue : function(index) {
+        return this.thumbs[index].value;
+    },
+
+    
+    getValues: function() {
+        var values = [];
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            values.push(this.thumbs[i].value);
+        }
+
+        return values;
+    },
+
+    
+    beforeDestroy : function(){
+        var thumbs = this.thumbs;
+        for(var i = 0, len = thumbs.length; i < len; ++i){
+            thumbs[i].destroy();
+            thumbs[i] = null;
+        }
+        Ext.destroyMembers(this, 'endEl', 'innerEl', 'focusEl', 'thumbHolder');
+        Ext.slider.MultiSlider.superclass.beforeDestroy.call(this);
+    }
+});
+
+Ext.reg('multislider', Ext.slider.MultiSlider);
+
+
+Ext.slider.SingleSlider = Ext.extend(Ext.slider.MultiSlider, {
+    constructor: function(config) {
+      config = config || {};
+
+      Ext.applyIf(config, {
+          values: [config.value || 0]
+      });
+
+      Ext.slider.SingleSlider.superclass.constructor.call(this, config);
+    },
+
+    
+    getValue: function() {
+        
+        return Ext.slider.SingleSlider.superclass.getValue.call(this, 0);
+    },
+
+    
+    setValue: function(value, animate) {
+        var args = Ext.toArray(arguments),
+            len  = args.length;
+
+        
+        
+        
+        if (len == 1 || (len <= 3 && typeof arguments[1] != 'number')) {
+            args.unshift(0);
+        }
+
+        return Ext.slider.SingleSlider.superclass.setValue.apply(this, args);
+    },
+
+    
+    syncThumb : function() {
+        return Ext.slider.SingleSlider.superclass.syncThumb.apply(this, [0].concat(arguments));
+    },
+    
+    
+    getNearest : function(){
+        
+        return this.thumbs[0];    
+    }
+});
+
+
+Ext.Slider = Ext.slider.SingleSlider;
+
+Ext.reg('slider', Ext.slider.SingleSlider);
+
+
+Ext.slider.Vertical = {
+    onResize : function(w, h){
+        this.innerEl.setHeight(h - (this.el.getPadding('t') + this.endEl.getPadding('b')));
+        this.syncThumb();
+    },
+
+    getRatio : function(){
+        var h = this.innerEl.getHeight(),
+            v = this.maxValue - this.minValue;
+        return h/v;
+    },
+
+    moveThumb: function(index, v, animate) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        if (!animate || this.animate === false) {
+            el.setBottom(v);
+        } else {
+            el.shift({bottom: v, stopFx: true, duration:.35});
+        }
+    },
+
+    onClickChange : function(local) {
+        if (local.left > this.clickRange[0] && local.left < this.clickRange[1]) {
+            var thumb = this.getNearest(local, 'top'),
+                index = thumb.index,
+                value = this.minValue + this.reverseValue(this.innerEl.getHeight() - local.top);
+
+            this.setValue(index, Ext.util.Format.round(value, this.decimalPrecision), undefined, true);
+        }
+    }
+};
+
+
+Ext.slider.Thumb.Vertical = {
+    getNewValue: function() {
+        var slider   = this.slider,
+            innerEl  = slider.innerEl,
+            pos      = innerEl.translatePoints(this.tracker.getXY()),
+            bottom   = innerEl.getHeight() - pos.top;
+
+        return slider.minValue + Ext.util.Format.round(bottom / slider.getRatio(), slider.decimalPrecision);
+    }
+};
+
+Ext.ProgressBar = Ext.extend(Ext.BoxComponent, {
+   
+    baseCls : 'x-progress',
+    
+    
+    animate : false,
+
+    
+    waitTimer : null,
+
+    
+    initComponent : function(){
+        Ext.ProgressBar.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            "update"
+        );
+    },
+
+    
+    onRender : function(ct, position){
+        var tpl = new Ext.Template(
+            '<div class="{cls}-wrap">',
+                '<div class="{cls}-inner">',
+                    '<div class="{cls}-bar">',
+                        '<div class="{cls}-text">',
+                            '<div>&#160;</div>',
+                        '</div>',
+                    '</div>',
+                    '<div class="{cls}-text {cls}-text-back">',
+                        '<div>&#160;</div>',
+                    '</div>',
+                '</div>',
+            '</div>'
+        );
+
+        this.el = position ? tpl.insertBefore(position, {cls: this.baseCls}, true)
+            : tpl.append(ct, {cls: this.baseCls}, true);
+                
+        if(this.id){
+            this.el.dom.id = this.id;
+        }
+        var inner = this.el.dom.firstChild;
+        this.progressBar = Ext.get(inner.firstChild);
+
+        if(this.textEl){
+            
+            this.textEl = Ext.get(this.textEl);
+            delete this.textTopEl;
+        }else{
+            
+            this.textTopEl = Ext.get(this.progressBar.dom.firstChild);
+            var textBackEl = Ext.get(inner.childNodes[1]);
+            this.textTopEl.setStyle("z-index", 99).addClass('x-hidden');
+            this.textEl = new Ext.CompositeElement([this.textTopEl.dom.firstChild, textBackEl.dom.firstChild]);
+            this.textEl.setWidth(inner.offsetWidth);
+        }
+        this.progressBar.setHeight(inner.offsetHeight);
+    },
+    
+    
+    afterRender : function(){
+        Ext.ProgressBar.superclass.afterRender.call(this);
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }else{
+            this.updateText(this.text);
+        }
+    },
+
+    
+    updateProgress : function(value, text, animate){
+        this.value = value || 0;
+        if(text){
+            this.updateText(text);
+        }
+        if(this.rendered && !this.isDestroyed){
+            var w = Math.floor(value*this.el.dom.firstChild.offsetWidth);
+            this.progressBar.setWidth(w, animate === true || (animate !== false && this.animate));
+            if(this.textTopEl){
+                
+                this.textTopEl.removeClass('x-hidden').setWidth(w);
+            }
+        }
+        this.fireEvent('update', this, value, text);
+        return this;
+    },
+
+    
+    wait : function(o){
+        if(!this.waitTimer){
+            var scope = this;
+            o = o || {};
+            this.updateText(o.text);
+            this.waitTimer = Ext.TaskMgr.start({
+                run: function(i){
+                    var inc = o.increment || 10;
+                    i -= 1;
+                    this.updateProgress(((((i+inc)%inc)+1)*(100/inc))*0.01, null, o.animate);
+                },
+                interval: o.interval || 1000,
+                duration: o.duration,
+                onStop: function(){
+                    if(o.fn){
+                        o.fn.apply(o.scope || this);
+                    }
+                    this.reset();
+                },
+                scope: scope
+            });
+        }
+        return this;
+    },
+
+    
+    isWaiting : function(){
+        return this.waitTimer !== null;
+    },
+
+    
+    updateText : function(text){
+        this.text = text || '&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+        }
+        return this;
+    },
+    
+    
+    syncProgressBar : function(){
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }
+        return this;
+    },
+
+    
+    setSize : function(w, h){
+        Ext.ProgressBar.superclass.setSize.call(this, w, h);
+        if(this.textTopEl){
+            var inner = this.el.dom.firstChild;
+            this.textEl.setSize(inner.offsetWidth, inner.offsetHeight);
+        }
+        this.syncProgressBar();
+        return this;
+    },
+
+    
+    reset : function(hide){
+        this.updateProgress(0);
+        if(this.textTopEl){
+            this.textTopEl.addClass('x-hidden');
+        }
+        this.clearTimer();
+        if(hide === true){
+            this.hide();
+        }
+        return this;
+    },
+    
+    
+    clearTimer : function(){
+        if(this.waitTimer){
+            this.waitTimer.onStop = null; 
+            Ext.TaskMgr.stop(this.waitTimer);
+            this.waitTimer = null;
+        }
+    },
+    
+    onDestroy: function(){
+        this.clearTimer();
+        if(this.rendered){
+            if(this.textEl.isComposite){
+                this.textEl.clear();
+            }
+            Ext.destroyMembers(this, 'textEl', 'progressBar', 'textTopEl');
+        }
+        Ext.ProgressBar.superclass.onDestroy.call(this);
+    }
+});
+Ext.reg('progress', Ext.ProgressBar);
+
+(function() {
+
+var Event=Ext.EventManager;
+var Dom=Ext.lib.Dom;
+
+
+Ext.dd.DragDrop = function(id, sGroup, config) {
+    if(id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.dd.DragDrop.prototype = {
+
+    
+
+    
+    id: null,
+
+    
+    config: null,
+
+    
+    dragElId: null,
+
+    
+    handleElId: null,
+
+    
+    invalidHandleTypes: null,
+
+    
+    invalidHandleIds: null,
+
+    
+    invalidHandleClasses: null,
+
+    
+    startPageX: 0,
+
+    
+    startPageY: 0,
+
+    
+    groups: null,
+
+    
+    locked: false,
+
+    
+    lock: function() {
+        this.locked = true;
+    },
+
+    
+    moveOnly: false,
+
+    
+    unlock: function() {
+        this.locked = false;
+    },
+
+    
+    isTarget: true,
+
+    
+    padding: null,
+
+    
+    _domRef: null,
+
+    
+    __ygDragDrop: true,
+
+    
+    constrainX: false,
+
+    
+    constrainY: false,
+
+    
+    minX: 0,
+
+    
+    maxX: 0,
+
+    
+    minY: 0,
+
+    
+    maxY: 0,
+
+    
+    maintainOffset: false,
+
+    
+    xTicks: null,
+
+    
+    yTicks: null,
+
+    
+    primaryButtonOnly: true,
+
+    
+    available: false,
+
+    
+    hasOuterHandles: false,
+
+    
+    b4StartDrag: function(x, y) { },
+
+    
+    startDrag: function(x, y) {  },
+
+    
+    b4Drag: function(e) { },
+
+    
+    onDrag: function(e) {  },
+
+    
+    onDragEnter: function(e, id) {  },
+
+    
+    b4DragOver: function(e) { },
+
+    
+    onDragOver: function(e, id) {  },
+
+    
+    b4DragOut: function(e) { },
+
+    
+    onDragOut: function(e, id) {  },
+
+    
+    b4DragDrop: function(e) { },
+
+    
+    onDragDrop: function(e, id) {  },
+
+    
+    onInvalidDrop: function(e) {  },
+
+    
+    b4EndDrag: function(e) { },
+
+    
+    endDrag: function(e) {  },
+
+    
+    b4MouseDown: function(e) {  },
+
+    
+    onMouseDown: function(e) {  },
+
+    
+    onMouseUp: function(e) {  },
+
+    
+    onAvailable: function () {
+    },
+
+    
+    defaultPadding : {left:0, right:0, top:0, bottom:0},
+
+    
+    constrainTo : function(constrainTo, pad, inContent){
+        if(Ext.isNumber(pad)){
+            pad = {left: pad, right:pad, top:pad, bottom:pad};
+        }
+        pad = pad || this.defaultPadding;
+        var b = Ext.get(this.getEl()).getBox(),
+            ce = Ext.get(constrainTo),
+            s = ce.getScroll(),
+            c, 
+            cd = ce.dom;
+        if(cd == document.body){
+            c = { x: s.left, y: s.top, width: Ext.lib.Dom.getViewWidth(), height: Ext.lib.Dom.getViewHeight()};
+        }else{
+            var xy = ce.getXY();
+            c = {x : xy[0], y: xy[1], width: cd.clientWidth, height: cd.clientHeight};
+        }
+
+
+        var topSpace = b.y - c.y,
+            leftSpace = b.x - c.x;
+
+        this.resetConstraints();
+        this.setXConstraint(leftSpace - (pad.left||0), 
+                c.width - leftSpace - b.width - (pad.right||0), 
+				this.xTickSize
+        );
+        this.setYConstraint(topSpace - (pad.top||0), 
+                c.height - topSpace - b.height - (pad.bottom||0), 
+				this.yTickSize
+        );
+    },
+
+    
+    getEl: function() {
+        if (!this._domRef) {
+            this._domRef = Ext.getDom(this.id);
+        }
+
+        return this._domRef;
+    },
+
+    
+    getDragEl: function() {
+        return Ext.getDom(this.dragElId);
+    },
+
+    
+    init: function(id, sGroup, config) {
+        this.initTarget(id, sGroup, config);
+        Event.on(this.id, "mousedown", this.handleMouseDown, this);
+        
+    },
+
+    
+    initTarget: function(id, sGroup, config) {
+
+        
+        this.config = config || {};
+
+        
+        this.DDM = Ext.dd.DDM;
+        
+        this.groups = {};
+
+        
+        
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+
+        
+        this.id = id;
+
+        
+        this.addToGroup((sGroup) ? sGroup : "default");
+
+        
+        
+        this.handleElId = id;
+
+        
+        this.setDragElId(id);
+
+        
+        this.invalidHandleTypes = { A: "A" };
+        this.invalidHandleIds = {};
+        this.invalidHandleClasses = [];
+
+        this.applyConfig();
+
+        this.handleOnAvailable();
+    },
+
+    
+    applyConfig: function() {
+
+        
+        
+        this.padding           = this.config.padding || [0, 0, 0, 0];
+        this.isTarget          = (this.config.isTarget !== false);
+        this.maintainOffset    = (this.config.maintainOffset);
+        this.primaryButtonOnly = (this.config.primaryButtonOnly !== false);
+
+    },
+
+    
+    handleOnAvailable: function() {
+        this.available = true;
+        this.resetConstraints();
+        this.onAvailable();
+    },
+
+     
+    setPadding: function(iTop, iRight, iBot, iLeft) {
+        
+        if (!iRight && 0 !== iRight) {
+            this.padding = [iTop, iTop, iTop, iTop];
+        } else if (!iBot && 0 !== iBot) {
+            this.padding = [iTop, iRight, iTop, iRight];
+        } else {
+            this.padding = [iTop, iRight, iBot, iLeft];
+        }
+    },
+
+    
+    setInitPosition: function(diffX, diffY) {
+        var el = this.getEl();
+
+        if (!this.DDM.verifyEl(el)) {
+            return;
+        }
+
+        var dx = diffX || 0;
+        var dy = diffY || 0;
+
+        var p = Dom.getXY( el );
+
+        this.initPageX = p[0] - dx;
+        this.initPageY = p[1] - dy;
+
+        this.lastPageX = p[0];
+        this.lastPageY = p[1];
+
+        this.setStartPosition(p);
+    },
+
+    
+    setStartPosition: function(pos) {
+        var p = pos || Dom.getXY( this.getEl() );
+        this.deltaSetXY = null;
+
+        this.startPageX = p[0];
+        this.startPageY = p[1];
+    },
+
+    
+    addToGroup: function(sGroup) {
+        this.groups[sGroup] = true;
+        this.DDM.regDragDrop(this, sGroup);
+    },
+
+    
+    removeFromGroup: function(sGroup) {
+        if (this.groups[sGroup]) {
+            delete this.groups[sGroup];
+        }
+
+        this.DDM.removeDDFromGroup(this, sGroup);
+    },
+
+    
+    setDragElId: function(id) {
+        this.dragElId = id;
+    },
+
+    
+    setHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.handleElId = id;
+        this.DDM.regHandle(this.id, id);
+    },
+
+    
+    setOuterHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        Event.on(id, "mousedown",
+                this.handleMouseDown, this);
+        this.setHandleElId(id);
+
+        this.hasOuterHandles = true;
+    },
+
+    
+    unreg: function() {
+        Event.un(this.id, "mousedown",
+                this.handleMouseDown);
+        this._domRef = null;
+        this.DDM._remove(this);
+    },
+
+    destroy : function(){
+        this.unreg();
+    },
+
+    
+    isLocked: function() {
+        return (this.DDM.isLocked() || this.locked);
+    },
+
+    
+    handleMouseDown: function(e, oDD){
+        if (this.primaryButtonOnly && e.button != 0) {
+            return;
+        }
+
+        if (this.isLocked()) {
+            return;
+        }
+
+        this.DDM.refreshCache(this.groups);
+
+        var pt = new Ext.lib.Point(Ext.lib.Event.getPageX(e), Ext.lib.Event.getPageY(e));
+        if (!this.hasOuterHandles && !this.DDM.isOverTarget(pt, this) )  {
+        } else {
+            if (this.clickValidator(e)) {
+
+                
+                this.setStartPosition();
+
+                this.b4MouseDown(e);
+                this.onMouseDown(e);
+
+                this.DDM.handleMouseDown(e, this);
+
+                this.DDM.stopEvent(e);
+            } else {
+
+
+            }
+        }
+    },
+
+    clickValidator: function(e) {
+        var target = e.getTarget();
+        return ( this.isValidHandleChild(target) &&
+                    (this.id == this.handleElId ||
+                        this.DDM.handleWasClicked(target, this.id)) );
+    },
+
+    
+    addInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        this.invalidHandleTypes[type] = type;
+    },
+
+    
+    addInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.invalidHandleIds[id] = id;
+    },
+
+    
+    addInvalidHandleClass: function(cssClass) {
+        this.invalidHandleClasses.push(cssClass);
+    },
+
+    
+    removeInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        
+        delete this.invalidHandleTypes[type];
+    },
+
+    
+    removeInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        delete this.invalidHandleIds[id];
+    },
+
+    
+    removeInvalidHandleClass: function(cssClass) {
+        for (var i=0, len=this.invalidHandleClasses.length; i<len; ++i) {
+            if (this.invalidHandleClasses[i] == cssClass) {
+                delete this.invalidHandleClasses[i];
+            }
+        }
+    },
+
+    
+    isValidHandleChild: function(node) {
+
+        var valid = true;
+        
+        var nodeName;
+        try {
+            nodeName = node.nodeName.toUpperCase();
+        } catch(e) {
+            nodeName = node.nodeName;
+        }
+        valid = valid && !this.invalidHandleTypes[nodeName];
+        valid = valid && !this.invalidHandleIds[node.id];
+
+        for (var i=0, len=this.invalidHandleClasses.length; valid && i<len; ++i) {
+            valid = !Ext.fly(node).hasClass(this.invalidHandleClasses[i]);
+        }
+
+
+        return valid;
+
+    },
+
+    
+    setXTicks: function(iStartX, iTickSize) {
+        this.xTicks = [];
+        this.xTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.xTicks.sort(this.DDM.numericSort) ;
+    },
+
+    
+    setYTicks: function(iStartY, iTickSize) {
+        this.yTicks = [];
+        this.yTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.yTicks.sort(this.DDM.numericSort) ;
+    },
+
+    
+    setXConstraint: function(iLeft, iRight, iTickSize) {
+        this.leftConstraint = iLeft;
+        this.rightConstraint = iRight;
+
+        this.minX = this.initPageX - iLeft;
+        this.maxX = this.initPageX + iRight;
+        if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); }
+
+        this.constrainX = true;
+    },
+
+    
+    clearConstraints: function() {
+        this.constrainX = false;
+        this.constrainY = false;
+        this.clearTicks();
+    },
+
+    
+    clearTicks: function() {
+        this.xTicks = null;
+        this.yTicks = null;
+        this.xTickSize = 0;
+        this.yTickSize = 0;
+    },
+
+    
+    setYConstraint: function(iUp, iDown, iTickSize) {
+        this.topConstraint = iUp;
+        this.bottomConstraint = iDown;
+
+        this.minY = this.initPageY - iUp;
+        this.maxY = this.initPageY + iDown;
+        if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); }
+
+        this.constrainY = true;
+
+    },
+
+    
+    resetConstraints: function() {
+        
+        if (this.initPageX || this.initPageX === 0) {
+            
+            var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0;
+            var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0;
+
+            this.setInitPosition(dx, dy);
+
+        
+        } else {
+            this.setInitPosition();
+        }
+
+        if (this.constrainX) {
+            this.setXConstraint( this.leftConstraint,
+                                 this.rightConstraint,
+                                 this.xTickSize        );
+        }
+
+        if (this.constrainY) {
+            this.setYConstraint( this.topConstraint,
+                                 this.bottomConstraint,
+                                 this.yTickSize         );
+        }
+    },
+
+    
+    getTick: function(val, tickArray) {
+        if (!tickArray) {
+            
+            
+            return val;
+        } else if (tickArray[0] >= val) {
+            
+            
+            return tickArray[0];
+        } else {
+            for (var i=0, len=tickArray.length; i<len; ++i) {
+                var next = i + 1;
+                if (tickArray[next] && tickArray[next] >= val) {
+                    var diff1 = val - tickArray[i];
+                    var diff2 = tickArray[next] - val;
+                    return (diff2 > diff1) ? tickArray[i] : tickArray[next];
+                }
+            }
+
+            
+            
+            return tickArray[tickArray.length - 1];
+        }
+    },
+
+    
+    toString: function() {
+        return ("DragDrop " + this.id);
+    }
+
+};
+
+})();
+
+
+
+
+if (!Ext.dd.DragDropMgr) {
+
+
+Ext.dd.DragDropMgr = function() {
+
+    var Event = Ext.EventManager;
+
+    return {
+
+        
+        ids: {},
+
+        
+        handleIds: {},
+
+        
+        dragCurrent: null,
+
+        
+        dragOvers: {},
+
+        
+        deltaX: 0,
+
+        
+        deltaY: 0,
+
+        
+        preventDefault: true,
+
+        
+        stopPropagation: true,
+
+        
+        initialized: false,
+
+        
+        locked: false,
+
+        
+        init: function() {
+            this.initialized = true;
+        },
+
+        
+        POINT: 0,
+
+        
+        INTERSECT: 1,
+
+        
+        mode: 0,
+
+        
+        _execOnAll: function(sMethod, args) {
+            for (var i in this.ids) {
+                for (var j in this.ids[i]) {
+                    var oDD = this.ids[i][j];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+                    oDD[sMethod].apply(oDD, args);
+                }
+            }
+        },
+
+        
+        _onLoad: function() {
+
+            this.init();
+
+
+            Event.on(document, "mouseup",   this.handleMouseUp, this, true);
+            Event.on(document, "mousemove", this.handleMouseMove, this, true);
+            Event.on(window,   "unload",    this._onUnload, this, true);
+            Event.on(window,   "resize",    this._onResize, this, true);
+            
+
+        },
+
+        
+        _onResize: function(e) {
+            this._execOnAll("resetConstraints", []);
+        },
+
+        
+        lock: function() { this.locked = true; },
+
+        
+        unlock: function() { this.locked = false; },
+
+        
+        isLocked: function() { return this.locked; },
+
+        
+        locationCache: {},
+
+        
+        useCache: true,
+
+        
+        clickPixelThresh: 3,
+
+        
+        clickTimeThresh: 350,
+
+        
+        dragThreshMet: false,
+
+        
+        clickTimeout: null,
+
+        
+        startX: 0,
+
+        
+        startY: 0,
+
+        
+        regDragDrop: function(oDD, sGroup) {
+            if (!this.initialized) { this.init(); }
+
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+            this.ids[sGroup][oDD.id] = oDD;
+        },
+
+        
+        removeDDFromGroup: function(oDD, sGroup) {
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+
+            var obj = this.ids[sGroup];
+            if (obj && obj[oDD.id]) {
+                delete obj[oDD.id];
+            }
+        },
+
+        
+        _remove: function(oDD) {
+            for (var g in oDD.groups) {
+                if (g && this.ids[g] && this.ids[g][oDD.id]) {
+                    delete this.ids[g][oDD.id];
+                }
+            }
+            delete this.handleIds[oDD.id];
+        },
+
+        
+        regHandle: function(sDDId, sHandleId) {
+            if (!this.handleIds[sDDId]) {
+                this.handleIds[sDDId] = {};
+            }
+            this.handleIds[sDDId][sHandleId] = sHandleId;
+        },
+
+        
+        isDragDrop: function(id) {
+            return ( this.getDDById(id) ) ? true : false;
+        },
+
+        
+        getRelated: function(p_oDD, bTargetsOnly) {
+            var oDDs = [];
+            for (var i in p_oDD.groups) {
+                for (var j in this.ids[i]) {
+                    var dd = this.ids[i][j];
+                    if (! this.isTypeOfDD(dd)) {
+                        continue;
+                    }
+                    if (!bTargetsOnly || dd.isTarget) {
+                        oDDs[oDDs.length] = dd;
+                    }
+                }
+            }
+
+            return oDDs;
+        },
+
+        
+        isLegalTarget: function (oDD, oTargetDD) {
+            var targets = this.getRelated(oDD, true);
+            for (var i=0, len=targets.length;i<len;++i) {
+                if (targets[i].id == oTargetDD.id) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        
+        isTypeOfDD: function (oDD) {
+            return (oDD && oDD.__ygDragDrop);
+        },
+
+        
+        isHandle: function(sDDId, sHandleId) {
+            return ( this.handleIds[sDDId] &&
+                            this.handleIds[sDDId][sHandleId] );
+        },
+
+        
+        getDDById: function(id) {
+            for (var i in this.ids) {
+                if (this.ids[i][id]) {
+                    return this.ids[i][id];
+                }
+            }
+            return null;
+        },
+
+        
+        handleMouseDown: function(e, oDD) {
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddDisable();
+            }
+            if(this.dragCurrent){
+                
+                
+                this.handleMouseUp(e);
+            }
+            
+            this.currentTarget = e.getTarget();
+            this.dragCurrent = oDD;
+
+            var el = oDD.getEl();
+
+            
+            this.startX = e.getPageX();
+            this.startY = e.getPageY();
+
+            this.deltaX = this.startX - el.offsetLeft;
+            this.deltaY = this.startY - el.offsetTop;
+
+            this.dragThreshMet = false;
+
+            this.clickTimeout = setTimeout(
+                    function() {
+                        var DDM = Ext.dd.DDM;
+                        DDM.startDrag(DDM.startX, DDM.startY);
+                    },
+                    this.clickTimeThresh );
+        },
+
+        
+        startDrag: function(x, y) {
+            clearTimeout(this.clickTimeout);
+            if (this.dragCurrent) {
+                this.dragCurrent.b4StartDrag(x, y);
+                this.dragCurrent.startDrag(x, y);
+            }
+            this.dragThreshMet = true;
+        },
+
+        
+        handleMouseUp: function(e) {
+
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddEnable();
+            }
+            if (! this.dragCurrent) {
+                return;
+            }
+
+            clearTimeout(this.clickTimeout);
+
+            if (this.dragThreshMet) {
+                this.fireEvents(e, true);
+            } else {
+            }
+
+            this.stopDrag(e);
+
+            this.stopEvent(e);
+        },
+
+        
+        stopEvent: function(e){
+            if(this.stopPropagation) {
+                e.stopPropagation();
+            }
+
+            if (this.preventDefault) {
+                e.preventDefault();
+            }
+        },
+
+        
+        stopDrag: function(e) {
+            
+            if (this.dragCurrent) {
+                if (this.dragThreshMet) {
+                    this.dragCurrent.b4EndDrag(e);
+                    this.dragCurrent.endDrag(e);
+                }
+
+                this.dragCurrent.onMouseUp(e);
+            }
+
+            this.dragCurrent = null;
+            this.dragOvers = {};
+        },
+
+        
+        handleMouseMove: function(e) {
+            if (! this.dragCurrent) {
+                return true;
+            }
+            
+
+            
+            if (Ext.isIE && (e.button !== 0 && e.button !== 1 && e.button !== 2)) {
+                this.stopEvent(e);
+                return this.handleMouseUp(e);
+            }
+
+            if (!this.dragThreshMet) {
+                var diffX = Math.abs(this.startX - e.getPageX());
+                var diffY = Math.abs(this.startY - e.getPageY());
+                if (diffX > this.clickPixelThresh ||
+                            diffY > this.clickPixelThresh) {
+                    this.startDrag(this.startX, this.startY);
+                }
+            }
+
+            if (this.dragThreshMet) {
+                this.dragCurrent.b4Drag(e);
+                this.dragCurrent.onDrag(e);
+                if(!this.dragCurrent.moveOnly){
+                    this.fireEvents(e, false);
+                }
+            }
+
+            this.stopEvent(e);
+
+            return true;
+        },
+
+        
+        fireEvents: function(e, isDrop) {
+            var dc = this.dragCurrent;
+
+            
+            
+            if (!dc || dc.isLocked()) {
+                return;
+            }
+
+            var pt = e.getPoint();
+
+            
+            var oldOvers = [];
+
+            var outEvts   = [];
+            var overEvts  = [];
+            var dropEvts  = [];
+            var enterEvts = [];
+
+            
+            
+            for (var i in this.dragOvers) {
+
+                var ddo = this.dragOvers[i];
+
+                if (! this.isTypeOfDD(ddo)) {
+                    continue;
+                }
+
+                if (! this.isOverTarget(pt, ddo, this.mode)) {
+                    outEvts.push( ddo );
+                }
+
+                oldOvers[i] = true;
+                delete this.dragOvers[i];
+            }
+
+            for (var sGroup in dc.groups) {
+
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+
+                for (i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+
+                    if (oDD.isTarget && !oDD.isLocked() && ((oDD != dc) || (dc.ignoreSelf === false))) {
+                        if (this.isOverTarget(pt, oDD, this.mode)) {
+                            
+                            if (isDrop) {
+                                dropEvts.push( oDD );
+                            
+                            } else {
+
+                                
+                                if (!oldOvers[oDD.id]) {
+                                    enterEvts.push( oDD );
+                                
+                                } else {
+                                    overEvts.push( oDD );
+                                }
+
+                                this.dragOvers[oDD.id] = oDD;
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (this.mode) {
+                if (outEvts.length) {
+                    dc.b4DragOut(e, outEvts);
+                    dc.onDragOut(e, outEvts);
+                }
+
+                if (enterEvts.length) {
+                    dc.onDragEnter(e, enterEvts);
+                }
+
+                if (overEvts.length) {
+                    dc.b4DragOver(e, overEvts);
+                    dc.onDragOver(e, overEvts);
+                }
+
+                if (dropEvts.length) {
+                    dc.b4DragDrop(e, dropEvts);
+                    dc.onDragDrop(e, dropEvts);
+                }
+
+            } else {
+                
+                var len = 0;
+                for (i=0, len=outEvts.length; i<len; ++i) {
+                    dc.b4DragOut(e, outEvts[i].id);
+                    dc.onDragOut(e, outEvts[i].id);
+                }
+
+                
+                for (i=0,len=enterEvts.length; i<len; ++i) {
+                    
+                    dc.onDragEnter(e, enterEvts[i].id);
+                }
+
+                
+                for (i=0,len=overEvts.length; i<len; ++i) {
+                    dc.b4DragOver(e, overEvts[i].id);
+                    dc.onDragOver(e, overEvts[i].id);
+                }
+
+                
+                for (i=0, len=dropEvts.length; i<len; ++i) {
+                    dc.b4DragDrop(e, dropEvts[i].id);
+                    dc.onDragDrop(e, dropEvts[i].id);
+                }
+
+            }
+
+            
+            if (isDrop && !dropEvts.length) {
+                dc.onInvalidDrop(e);
+            }
+
+        },
+
+        
+        getBestMatch: function(dds) {
+            var winner = null;
+            
+            
+               
+            
+            
+
+            var len = dds.length;
+
+            if (len == 1) {
+                winner = dds[0];
+            } else {
+                
+                for (var i=0; i<len; ++i) {
+                    var dd = dds[i];
+                    
+                    
+                    
+                    if (dd.cursorIsOver) {
+                        winner = dd;
+                        break;
+                    
+                    } else {
+                        if (!winner ||
+                            winner.overlap.getArea() < dd.overlap.getArea()) {
+                            winner = dd;
+                        }
+                    }
+                }
+            }
+
+            return winner;
+        },
+
+        
+        refreshCache: function(groups) {
+            for (var sGroup in groups) {
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+                for (var i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+
+                    if (this.isTypeOfDD(oDD)) {
+                    
+                        var loc = this.getLocation(oDD);
+                        if (loc) {
+                            this.locationCache[oDD.id] = loc;
+                        } else {
+                            delete this.locationCache[oDD.id];
+                            
+                            
+                            
+                        }
+                    }
+                }
+            }
+        },
+
+        
+        verifyEl: function(el) {
+            if (el) {
+                var parent;
+                if(Ext.isIE){
+                    try{
+                        parent = el.offsetParent;
+                    }catch(e){}
+                }else{
+                    parent = el.offsetParent;
+                }
+                if (parent) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        
+        getLocation: function(oDD) {
+            if (! this.isTypeOfDD(oDD)) {
+                return null;
+            }
+
+            var el = oDD.getEl(), pos, x1, x2, y1, y2, t, r, b, l, region;
+
+            try {
+                pos= Ext.lib.Dom.getXY(el);
+            } catch (e) { }
+
+            if (!pos) {
+                return null;
+            }
+
+            x1 = pos[0];
+            x2 = x1 + el.offsetWidth;
+            y1 = pos[1];
+            y2 = y1 + el.offsetHeight;
+
+            t = y1 - oDD.padding[0];
+            r = x2 + oDD.padding[1];
+            b = y2 + oDD.padding[2];
+            l = x1 - oDD.padding[3];
+
+            region = new Ext.lib.Region( t, r, b, l );
+            
+            el = Ext.get(el.parentNode);
+            while (el && region) {
+	            if (el.isScrollable()) {
+	                
+	                region = region.intersect(el.getRegion());
+	            }
+	            el = el.parent();
+            }
+            return region;
+        },
+
+        
+        isOverTarget: function(pt, oTarget, intersect) {
+            
+            var loc = this.locationCache[oTarget.id];
+            if (!loc || !this.useCache) {
+                loc = this.getLocation(oTarget);
+                this.locationCache[oTarget.id] = loc;
+
+            }
+
+            if (!loc) {
+                return false;
+            }
+
+            oTarget.cursorIsOver = loc.contains( pt );
+
+            
+            
+            
+            
+            
+            var dc = this.dragCurrent;
+            if (!dc || !dc.getTargetCoord ||
+                    (!intersect && !dc.constrainX && !dc.constrainY)) {
+                return oTarget.cursorIsOver;
+            }
+
+            oTarget.overlap = null;
+
+            
+            
+            
+            
+            var pos = dc.getTargetCoord(pt.x, pt.y);
+
+            var el = dc.getDragEl();
+            var curRegion = new Ext.lib.Region( pos.y,
+                                                   pos.x + el.offsetWidth,
+                                                   pos.y + el.offsetHeight,
+                                                   pos.x );
+
+            var overlap = curRegion.intersect(loc);
+
+            if (overlap) {
+                oTarget.overlap = overlap;
+                return (intersect) ? true : oTarget.cursorIsOver;
+            } else {
+                return false;
+            }
+        },
+
+        
+        _onUnload: function(e, me) {
+            Event.removeListener(document, "mouseup",   this.handleMouseUp, this);
+            Event.removeListener(document, "mousemove", this.handleMouseMove, this);
+            Event.removeListener(window,   "resize",    this._onResize, this);
+            Ext.dd.DragDropMgr.unregAll();
+        },
+
+        
+        unregAll: function() {
+
+            if (this.dragCurrent) {
+                this.stopDrag();
+                this.dragCurrent = null;
+            }
+
+            this._execOnAll("unreg", []);
+
+            for (var i in this.elementCache) {
+                delete this.elementCache[i];
+            }
+
+            this.elementCache = {};
+            this.ids = {};
+        },
+
+        
+        elementCache: {},
+
+        
+        getElWrapper: function(id) {
+            var oWrapper = this.elementCache[id];
+            if (!oWrapper || !oWrapper.el) {
+                oWrapper = this.elementCache[id] =
+                    new this.ElementWrapper(Ext.getDom(id));
+            }
+            return oWrapper;
+        },
+
+        
+        getElement: function(id) {
+            return Ext.getDom(id);
+        },
+
+        
+        getCss: function(id) {
+            var el = Ext.getDom(id);
+            return (el) ? el.style : null;
+        },
+
+        
+        ElementWrapper: function(el) {
+                
+                this.el = el || null;
+                
+                this.id = this.el && el.id;
+                
+                this.css = this.el && el.style;
+            },
+
+        
+        getPosX: function(el) {
+            return Ext.lib.Dom.getX(el);
+        },
+
+        
+        getPosY: function(el) {
+            return Ext.lib.Dom.getY(el);
+        },
+
+        
+        swapNode: function(n1, n2) {
+            if (n1.swapNode) {
+                n1.swapNode(n2);
+            } else {
+                var p = n2.parentNode;
+                var s = n2.nextSibling;
+
+                if (s == n1) {
+                    p.insertBefore(n1, n2);
+                } else if (n2 == n1.nextSibling) {
+                    p.insertBefore(n2, n1);
+                } else {
+                    n1.parentNode.replaceChild(n2, n1);
+                    p.insertBefore(n1, s);
+                }
+            }
+        },
+
+        
+        getScroll: function () {
+            var t, l, dde=document.documentElement, db=document.body;
+            if (dde && (dde.scrollTop || dde.scrollLeft)) {
+                t = dde.scrollTop;
+                l = dde.scrollLeft;
+            } else if (db) {
+                t = db.scrollTop;
+                l = db.scrollLeft;
+            } else {
+
+            }
+            return { top: t, left: l };
+        },
+
+        
+        getStyle: function(el, styleProp) {
+            return Ext.fly(el).getStyle(styleProp);
+        },
+
+        
+        getScrollTop: function () {
+            return this.getScroll().top;
+        },
+
+        
+        getScrollLeft: function () {
+            return this.getScroll().left;
+        },
+
+        
+        moveToEl: function (moveEl, targetEl) {
+            var aCoord = Ext.lib.Dom.getXY(targetEl);
+            Ext.lib.Dom.setXY(moveEl, aCoord);
+        },
+
+        
+        numericSort: function(a, b) {
+            return (a - b);
+        },
+
+        
+        _timeoutCount: 0,
+
+        
+        _addListeners: function() {
+            var DDM = Ext.dd.DDM;
+            if ( Ext.lib.Event && document ) {
+                DDM._onLoad();
+            } else {
+                if (DDM._timeoutCount > 2000) {
+                } else {
+                    setTimeout(DDM._addListeners, 10);
+                    if (document && document.body) {
+                        DDM._timeoutCount += 1;
+                    }
+                }
+            }
+        },
+
+        
+        handleWasClicked: function(node, id) {
+            if (this.isHandle(id, node.id)) {
+                return true;
+            } else {
+                
+                var p = node.parentNode;
+
+                while (p) {
+                    if (this.isHandle(id, p.id)) {
+                        return true;
+                    } else {
+                        p = p.parentNode;
+                    }
+                }
+            }
+
+            return false;
+        }
+
+    };
+
+}();
+
+
+Ext.dd.DDM = Ext.dd.DragDropMgr;
+Ext.dd.DDM._addListeners();
+
+}
+
+
+Ext.dd.DD = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.extend(Ext.dd.DD, Ext.dd.DragDrop, {
+
+    
+    scroll: true,
+
+    
+    autoOffset: function(iPageX, iPageY) {
+        var x = iPageX - this.startPageX;
+        var y = iPageY - this.startPageY;
+        this.setDelta(x, y);
+    },
+
+    
+    setDelta: function(iDeltaX, iDeltaY) {
+        this.deltaX = iDeltaX;
+        this.deltaY = iDeltaY;
+    },
+
+    
+    setDragElPos: function(iPageX, iPageY) {
+        
+        
+
+        var el = this.getDragEl();
+        this.alignElWithMouse(el, iPageX, iPageY);
+    },
+
+    
+    alignElWithMouse: function(el, iPageX, iPageY) {
+        var oCoord = this.getTargetCoord(iPageX, iPageY);
+        var fly = el.dom ? el : Ext.fly(el, '_dd');
+        if (!this.deltaSetXY) {
+            var aCoord = [oCoord.x, oCoord.y];
+            fly.setXY(aCoord);
+            var newLeft = fly.getLeft(true);
+            var newTop  = fly.getTop(true);
+            this.deltaSetXY = [ newLeft - oCoord.x, newTop - oCoord.y ];
+        } else {
+            fly.setLeftTop(oCoord.x + this.deltaSetXY[0], oCoord.y + this.deltaSetXY[1]);
+        }
+
+        this.cachePosition(oCoord.x, oCoord.y);
+        this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth);
+        return oCoord;
+    },
+
+    
+    cachePosition: function(iPageX, iPageY) {
+        if (iPageX) {
+            this.lastPageX = iPageX;
+            this.lastPageY = iPageY;
+        } else {
+            var aCoord = Ext.lib.Dom.getXY(this.getEl());
+            this.lastPageX = aCoord[0];
+            this.lastPageY = aCoord[1];
+        }
+    },
+
+    
+    autoScroll: function(x, y, h, w) {
+
+        if (this.scroll) {
+            
+            var clientH = Ext.lib.Dom.getViewHeight();
+
+            
+            var clientW = Ext.lib.Dom.getViewWidth();
+
+            
+            var st = this.DDM.getScrollTop();
+
+            
+            var sl = this.DDM.getScrollLeft();
+
+            
+            var bot = h + y;
+
+            
+            var right = w + x;
+
+            
+            
+            
+            var toBot = (clientH + st - y - this.deltaY);
+
+            
+            var toRight = (clientW + sl - x - this.deltaX);
+
+
+            
+            
+            var thresh = 40;
+
+            
+            
+            
+            var scrAmt = (document.all) ? 80 : 30;
+
+            
+            
+            if ( bot > clientH && toBot < thresh ) {
+                window.scrollTo(sl, st + scrAmt);
+            }
+
+            
+            
+            if ( y < st && st > 0 && y - st < thresh ) {
+                window.scrollTo(sl, st - scrAmt);
+            }
+
+            
+            
+            if ( right > clientW && toRight < thresh ) {
+                window.scrollTo(sl + scrAmt, st);
+            }
+
+            
+            
+            if ( x < sl && sl > 0 && x - sl < thresh ) {
+                window.scrollTo(sl - scrAmt, st);
+            }
+        }
+    },
+
+    
+    getTargetCoord: function(iPageX, iPageY) {
+        var x = iPageX - this.deltaX;
+        var y = iPageY - this.deltaY;
+
+        if (this.constrainX) {
+            if (x < this.minX) { x = this.minX; }
+            if (x > this.maxX) { x = this.maxX; }
+        }
+
+        if (this.constrainY) {
+            if (y < this.minY) { y = this.minY; }
+            if (y > this.maxY) { y = this.maxY; }
+        }
+
+        x = this.getTick(x, this.xTicks);
+        y = this.getTick(y, this.yTicks);
+
+
+        return {x:x, y:y};
+    },
+
+    
+    applyConfig: function() {
+        Ext.dd.DD.superclass.applyConfig.call(this);
+        this.scroll = (this.config.scroll !== false);
+    },
+
+    
+    b4MouseDown: function(e) {
+        
+        this.autoOffset(e.getPageX(),
+                            e.getPageY());
+    },
+
+    
+    b4Drag: function(e) {
+        this.setDragElPos(e.getPageX(),
+                            e.getPageY());
+    },
+
+    toString: function() {
+        return ("DD " + this.id);
+    }
+
+    
+    
+    
+    
+
+});
+
+Ext.dd.DDProxy = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+    }
+};
+
+
+Ext.dd.DDProxy.dragElId = "ygddfdiv";
+
+Ext.extend(Ext.dd.DDProxy, Ext.dd.DD, {
+
+    
+    resizeFrame: true,
+
+    
+    centerFrame: false,
+
+    
+    createFrame: function() {
+        var self = this;
+        var body = document.body;
+
+        if (!body || !body.firstChild) {
+            setTimeout( function() { self.createFrame(); }, 50 );
+            return;
+        }
+
+        var div = this.getDragEl();
+
+        if (!div) {
+            div    = document.createElement("div");
+            div.id = this.dragElId;
+            var s  = div.style;
+
+            s.position   = "absolute";
+            s.visibility = "hidden";
+            s.cursor     = "move";
+            s.border     = "2px solid #aaa";
+            s.zIndex     = 999;
+
+            
+            
+            
+            body.insertBefore(div, body.firstChild);
+        }
+    },
+
+    
+    initFrame: function() {
+        this.createFrame();
+    },
+
+    applyConfig: function() {
+        Ext.dd.DDProxy.superclass.applyConfig.call(this);
+
+        this.resizeFrame = (this.config.resizeFrame !== false);
+        this.centerFrame = (this.config.centerFrame);
+        this.setDragElId(this.config.dragElId || Ext.dd.DDProxy.dragElId);
+    },
+
+    
+    showFrame: function(iPageX, iPageY) {
+        var el = this.getEl();
+        var dragEl = this.getDragEl();
+        var s = dragEl.style;
+
+        this._resizeProxy();
+
+        if (this.centerFrame) {
+            this.setDelta( Math.round(parseInt(s.width,  10)/2),
+                           Math.round(parseInt(s.height, 10)/2) );
+        }
+
+        this.setDragElPos(iPageX, iPageY);
+
+        Ext.fly(dragEl).show();
+    },
+
+    
+    _resizeProxy: function() {
+        if (this.resizeFrame) {
+            var el = this.getEl();
+            Ext.fly(this.getDragEl()).setSize(el.offsetWidth, el.offsetHeight);
+        }
+    },
+
+    
+    b4MouseDown: function(e) {
+        var x = e.getPageX();
+        var y = e.getPageY();
+        this.autoOffset(x, y);
+        this.setDragElPos(x, y);
+    },
+
+    
+    b4StartDrag: function(x, y) {
+        
+        this.showFrame(x, y);
+    },
+
+    
+    b4EndDrag: function(e) {
+        Ext.fly(this.getDragEl()).hide();
+    },
+
+    
+    
+    
+    endDrag: function(e) {
+
+        var lel = this.getEl();
+        var del = this.getDragEl();
+
+        
+        del.style.visibility = "";
+
+        this.beforeMove();
+        
+        
+        lel.style.visibility = "hidden";
+        Ext.dd.DDM.moveToEl(lel, del);
+        del.style.visibility = "hidden";
+        lel.style.visibility = "";
+
+        this.afterDrag();
+    },
+
+    beforeMove : function(){
+
+    },
+
+    afterDrag : function(){
+
+    },
+
+    toString: function() {
+        return ("DDProxy " + this.id);
+    }
+
+});
+
+Ext.dd.DDTarget = function(id, sGroup, config) {
+    if (id) {
+        this.initTarget(id, sGroup, config);
+    }
+};
+
+
+Ext.extend(Ext.dd.DDTarget, Ext.dd.DragDrop, {
+    
+    getDragEl: Ext.emptyFn,
+    
+    isValidHandleChild: Ext.emptyFn,
+    
+    startDrag: Ext.emptyFn,
+    
+    endDrag: Ext.emptyFn,
+    
+    onDrag: Ext.emptyFn,
+    
+    onDragDrop: Ext.emptyFn,
+    
+    onDragEnter: Ext.emptyFn,
+    
+    onDragOut: Ext.emptyFn,
+    
+    onDragOver: Ext.emptyFn,
+    
+    onInvalidDrop: Ext.emptyFn,
+    
+    onMouseDown: Ext.emptyFn,
+    
+    onMouseUp: Ext.emptyFn,
+    
+    setXConstraint: Ext.emptyFn,
+    
+    setYConstraint: Ext.emptyFn,
+    
+    resetConstraints: Ext.emptyFn,
+    
+    clearConstraints: Ext.emptyFn,
+    
+    clearTicks: Ext.emptyFn,
+    
+    setInitPosition: Ext.emptyFn,
+    
+    setDragElId: Ext.emptyFn,
+    
+    setHandleElId: Ext.emptyFn,
+    
+    setOuterHandleElId: Ext.emptyFn,
+    
+    addInvalidHandleClass: Ext.emptyFn,
+    
+    addInvalidHandleId: Ext.emptyFn,
+    
+    addInvalidHandleType: Ext.emptyFn,
+    
+    removeInvalidHandleClass: Ext.emptyFn,
+    
+    removeInvalidHandleId: Ext.emptyFn,
+    
+    removeInvalidHandleType: Ext.emptyFn,
+
+    toString: function() {
+        return ("DDTarget " + this.id);
+    }
+});
+Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
+    	
+    active: false,
+    	
+    tolerance: 5,
+    	
+    autoStart: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+	    this.addEvents(
+	        
+	        'mousedown',
+	        
+	        'mouseup',
+	        
+	        'mousemove',
+	        
+	        'dragstart',
+	        
+	        'dragend',
+	        
+	        'drag'
+	    );
+	
+	    this.dragRegion = new Ext.lib.Region(0,0,0,0);
+	
+	    if(this.el){
+	        this.initEl(this.el);
+	    }
+        Ext.dd.DragTracker.superclass.constructor.call(this, config);
+    },
+
+    initEl: function(el){
+        this.el = Ext.get(el);
+        el.on('mousedown', this.onMouseDown, this,
+                this.delegate ? {delegate: this.delegate} : undefined);
+    },
+
+    destroy : function(){
+        this.el.un('mousedown', this.onMouseDown, this);
+        delete this.el;
+    },
+
+    onMouseDown: function(e, target){
+        if(this.fireEvent('mousedown', this, e) !== false && this.onBeforeStart(e) !== false){
+            this.startXY = this.lastXY = e.getXY();
+            this.dragTarget = this.delegate ? target : this.el.dom;
+            if(this.preventDefault !== false){
+                e.preventDefault();
+            }
+            Ext.getDoc().on({
+                scope: this,
+                mouseup: this.onMouseUp,
+                mousemove: this.onMouseMove,
+                selectstart: this.stopSelect
+            });
+            if(this.autoStart){
+                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this, [e]);
+            }
+        }
+    },
+
+    onMouseMove: function(e, target){
+        
+        if(this.active && Ext.isIE && !e.browserEvent.button){
+            e.preventDefault();
+            this.onMouseUp(e);
+            return;
+        }
+
+        e.preventDefault();
+        var xy = e.getXY(), s = this.startXY;
+        this.lastXY = xy;
+        if(!this.active){
+            if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
+                this.triggerStart(e);
+            }else{
+                return;
+            }
+        }
+        this.fireEvent('mousemove', this, e);
+        this.onDrag(e);
+        this.fireEvent('drag', this, e);
+    },
+
+    onMouseUp: function(e) {
+        var doc = Ext.getDoc(),
+            wasActive = this.active;
+            
+        doc.un('mousemove', this.onMouseMove, this);
+        doc.un('mouseup', this.onMouseUp, this);
+        doc.un('selectstart', this.stopSelect, this);
+        e.preventDefault();
+        this.clearStart();
+        this.active = false;
+        delete this.elRegion;
+        this.fireEvent('mouseup', this, e);
+        if(wasActive){
+            this.onEnd(e);
+            this.fireEvent('dragend', this, e);
+        }
+    },
+
+    triggerStart: function(e) {
+        this.clearStart();
+        this.active = true;
+        this.onStart(e);
+        this.fireEvent('dragstart', this, e);
+    },
+
+    clearStart : function() {
+        if(this.timer){
+            clearTimeout(this.timer);
+            delete this.timer;
+        }
+    },
+
+    stopSelect : function(e) {
+        e.stopEvent();
+        return false;
+    },
+    
+    
+    onBeforeStart : function(e) {
+
+    },
+
+    
+    onStart : function(xy) {
+
+    },
+
+    
+    onDrag : function(e) {
+
+    },
+
+    
+    onEnd : function(e) {
+
+    },
+
+    
+    getDragTarget : function(){
+        return this.dragTarget;
+    },
+
+    getDragCt : function(){
+        return this.el;
+    },
+
+    getXY : function(constrain){
+        return constrain ?
+               this.constrainModes[constrain].call(this, this.lastXY) : this.lastXY;
+    },
+
+    getOffset : function(constrain){
+        var xy = this.getXY(constrain),
+            s = this.startXY;
+        return [s[0]-xy[0], s[1]-xy[1]];
+    },
+
+    constrainModes: {
+        'point' : function(xy){
+
+            if(!this.elRegion){
+                this.elRegion = this.getDragCt().getRegion();
+            }
+
+            var dr = this.dragRegion;
+
+            dr.left = xy[0];
+            dr.top = xy[1];
+            dr.right = xy[0];
+            dr.bottom = xy[1];
+
+            dr.constrainTo(this.elRegion);
+
+            return [dr.left, dr.top];
+        }
+    }
+});
+Ext.dd.ScrollManager = function(){
+    var ddm = Ext.dd.DragDropMgr;
+    var els = {};
+    var dragEl = null;
+    var proc = {};
+    
+    var onStop = function(e){
+        dragEl = null;
+        clearProc();
+    };
+    
+    var triggerRefresh = function(){
+        if(ddm.dragCurrent){
+             ddm.refreshCache(ddm.dragCurrent.groups);
+        }
+    };
+    
+    var doScroll = function(){
+        if(ddm.dragCurrent){
+            var dds = Ext.dd.ScrollManager;
+            var inc = proc.el.ddScrollConfig ?
+                      proc.el.ddScrollConfig.increment : dds.increment;
+            if(!dds.animate){
+                if(proc.el.scroll(proc.dir, inc)){
+                    triggerRefresh();
+                }
+            }else{
+                proc.el.scroll(proc.dir, inc, true, dds.animDuration, triggerRefresh);
+            }
+        }
+    };
+    
+    var clearProc = function(){
+        if(proc.id){
+            clearInterval(proc.id);
+        }
+        proc.id = 0;
+        proc.el = null;
+        proc.dir = "";
+    };
+
+    var startProc = function(el, dir){
+        clearProc();
+        proc.el = el;
+        proc.dir = dir;
+        var group = el.ddScrollConfig ? el.ddScrollConfig.ddGroup : undefined,
+            freq  = (el.ddScrollConfig && el.ddScrollConfig.frequency)
+                  ? el.ddScrollConfig.frequency
+                  : Ext.dd.ScrollManager.frequency;
+
+        if (group === undefined || ddm.dragCurrent.ddGroup == group) {
+            proc.id = setInterval(doScroll, freq);
+        }
+    };
+    
+    var onFire = function(e, isDrop){
+        if(isDrop || !ddm.dragCurrent){ return; }
+        var dds = Ext.dd.ScrollManager;
+        if(!dragEl || dragEl != ddm.dragCurrent){
+            dragEl = ddm.dragCurrent;
+            
+            dds.refreshCache();
+        }
+        
+        var xy = Ext.lib.Event.getXY(e);
+        var pt = new Ext.lib.Point(xy[0], xy[1]);
+        for(var id in els){
+            var el = els[id], r = el._region;
+            var c = el.ddScrollConfig ? el.ddScrollConfig : dds;
+            if(r && r.contains(pt) && el.isScrollable()){
+                if(r.bottom - pt.y <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "down");
+                    }
+                    return;
+                }else if(r.right - pt.x <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "left");
+                    }
+                    return;
+                }else if(pt.y - r.top <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "up");
+                    }
+                    return;
+                }else if(pt.x - r.left <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "right");
+                    }
+                    return;
+                }
+            }
+        }
+        clearProc();
+    };
+    
+    ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);
+    ddm.stopDrag = ddm.stopDrag.createSequence(onStop, ddm);
+    
+    return {
+        
+        register : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.register(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                els[el.id] = el;
+            }
+        },
+        
+        
+        unregister : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.unregister(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                delete els[el.id];
+            }
+        },
+        
+        
+        vthresh : 25,
+        
+        hthresh : 25,
+
+        
+        increment : 100,
+        
+        
+        frequency : 500,
+        
+        
+        animate: true,
+        
+        
+        animDuration: .4,
+        
+        
+        ddGroup: undefined,
+        
+        
+        refreshCache : function(){
+            for(var id in els){
+                if(typeof els[id] == 'object'){ 
+                    els[id]._region = els[id].getRegion();
+                }
+            }
+        }
+    };
+}();
+Ext.dd.Registry = function(){
+    var elements = {}; 
+    var handles = {}; 
+    var autoIdSeed = 0;
+
+    var getId = function(el, autogen){
+        if(typeof el == "string"){
+            return el;
+        }
+        var id = el.id;
+        if(!id && autogen !== false){
+            id = "extdd-" + (++autoIdSeed);
+            el.id = id;
+        }
+        return id;
+    };
+    
+    return {
+    
+        register : function(el, data){
+            data = data || {};
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            data.ddel = el;
+            elements[getId(el)] = data;
+            if(data.isHandle !== false){
+                handles[data.ddel.id] = data;
+            }
+            if(data.handles){
+                var hs = data.handles;
+                for(var i = 0, len = hs.length; i < len; i++){
+                	handles[getId(hs[i])] = data;
+                }
+            }
+        },
+
+    
+        unregister : function(el){
+            var id = getId(el, false);
+            var data = elements[id];
+            if(data){
+                delete elements[id];
+                if(data.handles){
+                    var hs = data.handles;
+                    for(var i = 0, len = hs.length; i < len; i++){
+                    	delete handles[getId(hs[i], false)];
+                    }
+                }
+            }
+        },
+
+    
+        getHandle : function(id){
+            if(typeof id != "string"){ 
+                id = id.id;
+            }
+            return handles[id];
+        },
+
+    
+        getHandleFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? handles[t.id] : null;
+        },
+
+    
+        getTarget : function(id){
+            if(typeof id != "string"){ 
+                id = id.id;
+            }
+            return elements[id];
+        },
+
+    
+        getTargetFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? elements[t.id] || handles[t.id] : null;
+        }
+    };
+}();
+Ext.dd.StatusProxy = function(config){
+    Ext.apply(this, config);
+    this.id = this.id || Ext.id();
+    this.el = new Ext.Layer({
+        dh: {
+            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
+                {tag: "div", cls: "x-dd-drop-icon"},
+                {tag: "div", cls: "x-dd-drag-ghost"}
+            ]
+        }, 
+        shadow: !config || config.shadow !== false
+    });
+    this.ghost = Ext.get(this.el.dom.childNodes[1]);
+    this.dropStatus = this.dropNotAllowed;
+};
+
+Ext.dd.StatusProxy.prototype = {
+    
+    dropAllowed : "x-dd-drop-ok",
+    
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    
+    setStatus : function(cssClass){
+        cssClass = cssClass || this.dropNotAllowed;
+        if(this.dropStatus != cssClass){
+            this.el.replaceClass(this.dropStatus, cssClass);
+            this.dropStatus = cssClass;
+        }
+    },
+
+    
+    reset : function(clearGhost){
+        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
+        this.dropStatus = this.dropNotAllowed;
+        if(clearGhost){
+            this.ghost.update("");
+        }
+    },
+
+    
+    update : function(html){
+        if(typeof html == "string"){
+            this.ghost.update(html);
+        }else{
+            this.ghost.update("");
+            html.style.margin = "0";
+            this.ghost.dom.appendChild(html);
+        }
+        var el = this.ghost.dom.firstChild; 
+        if(el){
+            Ext.fly(el).setStyle('float', 'none');
+        }
+    },
+
+    
+    getEl : function(){
+        return this.el;
+    },
+
+    
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    
+    hide : function(clear){
+        this.el.hide();
+        if(clear){
+            this.reset(true);
+        }
+    },
+
+    
+    stop : function(){
+        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
+            this.anim.stop();
+        }
+    },
+
+    
+    show : function(){
+        this.el.show();
+    },
+
+    
+    sync : function(){
+        this.el.sync();
+    },
+
+    
+    repair : function(xy, callback, scope){
+        this.callback = callback;
+        this.scope = scope;
+        if(xy && this.animRepair !== false){
+            this.el.addClass("x-dd-drag-repair");
+            this.el.hideUnders(true);
+            this.anim = this.el.shift({
+                duration: this.repairDuration || .5,
+                easing: 'easeOut',
+                xy: xy,
+                stopFx: true,
+                callback: this.afterRepair,
+                scope: this
+            });
+        }else{
+            this.afterRepair();
+        }
+    },
+
+    
+    afterRepair : function(){
+        this.hide(true);
+        if(typeof this.callback == "function"){
+            this.callback.call(this.scope || this);
+        }
+        this.callback = null;
+        this.scope = null;
+    },
+    
+    destroy: function(){
+        Ext.destroy(this.ghost, this.el);    
+    }
+};
+Ext.dd.DragSource = function(el, config){
+    this.el = Ext.get(el);
+    if(!this.dragData){
+        this.dragData = {};
+    }
+    
+    Ext.apply(this, config);
+    
+    if(!this.proxy){
+        this.proxy = new Ext.dd.StatusProxy();
+    }
+    Ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
+    
+    this.dragging = false;
+};
+
+Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
+    
+    
+    dropAllowed : "x-dd-drop-ok",
+    
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    
+    getDragData : function(e){
+        return this.dragData;
+    },
+
+    
+    onDragEnter : function(e, id){
+        var target = Ext.dd.DragDropMgr.getDDById(id);
+        this.cachedTarget = target;
+        if(this.beforeDragEnter(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyEnter(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }else{
+                this.proxy.setStatus(this.dropAllowed);
+            }
+            
+            if(this.afterDragEnter){
+                
+                this.afterDragEnter(target, e, id);
+            }
+        }
+    },
+
+    
+    beforeDragEnter : function(target, e, id){
+        return true;
+    },
+
+    
+    alignElWithMouse: function() {
+        Ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.proxy.sync();
+    },
+
+    
+    onDragOver : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOver(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyOver(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }
+
+            if(this.afterDragOver){
+                
+                this.afterDragOver(target, e, id);
+            }
+        }
+    },
+
+    
+    beforeDragOver : function(target, e, id){
+        return true;
+    },
+
+    
+    onDragOut : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOut(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                target.notifyOut(this, e, this.dragData);
+            }
+            this.proxy.reset();
+            if(this.afterDragOut){
+                
+                this.afterDragOut(target, e, id);
+            }
+        }
+        this.cachedTarget = null;
+    },
+
+    
+    beforeDragOut : function(target, e, id){
+        return true;
+    },
+    
+    
+    onDragDrop : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragDrop(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                if(target.notifyDrop(this, e, this.dragData)){ 
+                    this.onValidDrop(target, e, id);
+                }else{
+                    this.onInvalidDrop(target, e, id);
+                }
+            }else{
+                this.onValidDrop(target, e, id);
+            }
+            
+            if(this.afterDragDrop){
+                
+                this.afterDragDrop(target, e, id);
+            }
+        }
+        delete this.cachedTarget;
+    },
+
+    
+    beforeDragDrop : function(target, e, id){
+        return true;
+    },
+
+    
+    onValidDrop : function(target, e, id){
+        this.hideProxy();
+        if(this.afterValidDrop){
+            
+            this.afterValidDrop(target, e, id);
+        }
+    },
+
+    
+    getRepairXY : function(e, data){
+        return this.el.getXY();  
+    },
+
+    
+    onInvalidDrop : function(target, e, id){
+        this.beforeInvalidDrop(target, e, id);
+        if(this.cachedTarget){
+            if(this.cachedTarget.isNotifyTarget){
+                this.cachedTarget.notifyOut(this, e, this.dragData);
+            }
+            this.cacheTarget = null;
+        }
+        this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
+
+        if(this.afterInvalidDrop){
+            
+            this.afterInvalidDrop(e, id);
+        }
+    },
+
+    
+    afterRepair : function(){
+        if(Ext.enableFx){
+            this.el.highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    
+    beforeInvalidDrop : function(target, e, id){
+        return true;
+    },
+
+    
+    handleMouseDown : function(e){
+        if(this.dragging) {
+            return;
+        }
+        var data = this.getDragData(e);
+        if(data && this.onBeforeDrag(data, e) !== false){
+            this.dragData = data;
+            this.proxy.stop();
+            Ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
+        } 
+    },
+
+    
+    onBeforeDrag : function(data, e){
+        return true;
+    },
+
+    
+    onStartDrag : Ext.emptyFn,
+
+    
+    startDrag : function(x, y){
+        this.proxy.reset();
+        this.dragging = true;
+        this.proxy.update("");
+        this.onInitDrag(x, y);
+        this.proxy.show();
+    },
+
+    
+    onInitDrag : function(x, y){
+        var clone = this.el.dom.cloneNode(true);
+        clone.id = Ext.id(); 
+        this.proxy.update(clone);
+        this.onStartDrag(x, y);
+        return true;
+    },
+
+    
+    getProxy : function(){
+        return this.proxy;  
+    },
+
+    
+    hideProxy : function(){
+        this.proxy.hide();  
+        this.proxy.reset(true);
+        this.dragging = false;
+    },
+
+    
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    },
+
+    
+    b4EndDrag: function(e) {
+    },
+
+    
+    endDrag : function(e){
+        this.onEndDrag(this.dragData, e);
+    },
+
+    
+    onEndDrag : function(data, e){
+    },
+    
+    
+    autoOffset : function(x, y) {
+        this.setDelta(-12, -20);
+    },
+    
+    destroy: function(){
+        Ext.dd.DragSource.superclass.destroy.call(this);
+        Ext.destroy(this.proxy);
+    }
+});
+Ext.dd.DropTarget = Ext.extend(Ext.dd.DDTarget, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+    
+        Ext.apply(this, config);
+    
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    
+        Ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+              {isTarget: true});        
+    },
+    
+    
+    
+    
+    dropAllowed : "x-dd-drop-ok",
+    
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    
+    isTarget : true,
+
+    
+    isNotifyTarget : true,
+
+    
+    notifyEnter : function(dd, e, data){
+        if(this.overClass){
+            this.el.addClass(this.overClass);
+        }
+        return this.dropAllowed;
+    },
+
+    
+    notifyOver : function(dd, e, data){
+        return this.dropAllowed;
+    },
+
+    
+    notifyOut : function(dd, e, data){
+        if(this.overClass){
+            this.el.removeClass(this.overClass);
+        }
+    },
+
+    
+    notifyDrop : function(dd, e, data){
+        return false;
+    },
+    
+    destroy : function(){
+        Ext.dd.DropTarget.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});
+Ext.dd.DragZone = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(el, config){
+        Ext.dd.DragZone.superclass.constructor.call(this, el, config);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    },
+    
+    
+    
+    
+
+    
+    getDragData : function(e){
+        return Ext.dd.Registry.getHandleFromEvent(e);
+    },
+    
+    
+    onInitDrag : function(x, y){
+        this.proxy.update(this.dragData.ddel.cloneNode(true));
+        this.onStartDrag(x, y);
+        return true;
+    },
+    
+    
+    afterRepair : function(){
+        if(Ext.enableFx){
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    
+    getRepairXY : function(e){
+        return Ext.Element.fly(this.dragData.ddel).getXY();  
+    },
+    
+    destroy : function(){
+        Ext.dd.DragZone.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});
+Ext.dd.DropZone = function(el, config){
+    Ext.dd.DropZone.superclass.constructor.call(this, el, config);
+};
+
+Ext.extend(Ext.dd.DropZone, Ext.dd.DropTarget, {
+    
+    getTargetFromEvent : function(e){
+        return Ext.dd.Registry.getTargetFromEvent(e);
+    },
+
+    
+    onNodeEnter : function(n, dd, e, data){
+        
+    },
+
+    
+    onNodeOver : function(n, dd, e, data){
+        return this.dropAllowed;
+    },
+
+    
+    onNodeOut : function(n, dd, e, data){
+        
+    },
+
+    
+    onNodeDrop : function(n, dd, e, data){
+        return false;
+    },
+
+    
+    onContainerOver : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    
+    onContainerDrop : function(dd, e, data){
+        return false;
+    },
+
+    
+    notifyEnter : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    
+    notifyOver : function(dd, e, data){
+        var n = this.getTargetFromEvent(e);
+        if(!n){ 
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+                this.lastOverNode = null;
+            }
+            return this.onContainerOver(dd, e, data);
+        }
+        if(this.lastOverNode != n){
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+            }
+            this.onNodeEnter(n, dd, e, data);
+            this.lastOverNode = n;
+        }
+        return this.onNodeOver(n, dd, e, data);
+    },
+
+    
+    notifyOut : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+    },
+
+    
+    notifyDrop : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+        var n = this.getTargetFromEvent(e);
+        return n ?
+            this.onNodeDrop(n, dd, e, data) :
+            this.onContainerDrop(dd, e, data);
+    },
+
+    
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    }  
+});
+Ext.Element.addMethods({
+    
+    initDD : function(group, config, overrides){
+        var dd = new Ext.dd.DD(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    
+    initDDProxy : function(group, config, overrides){
+        var dd = new Ext.dd.DDProxy(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    
+    initDDTarget : function(group, config, overrides){
+        var dd = new Ext.dd.DDTarget(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    }
+});
+
+Ext.data.Api = (function() {
+
+    
+    
+    
+    
+    var validActions = {};
+
+    return {
+        
+        actions : {
+            create  : 'create',
+            read    : 'read',
+            update  : 'update',
+            destroy : 'destroy'
+        },
+
+        
+        restActions : {
+            create  : 'POST',
+            read    : 'GET',
+            update  : 'PUT',
+            destroy : 'DELETE'
+        },
+
+        
+        isAction : function(action) {
+            return (Ext.data.Api.actions[action]) ? true : false;
+        },
+
+        
+        getVerb : function(name) {
+            if (validActions[name]) {
+                return validActions[name];  
+            }
+            for (var verb in this.actions) {
+                if (this.actions[verb] === name) {
+                    validActions[name] = verb;
+                    break;
+                }
+            }
+            return (validActions[name] !== undefined) ? validActions[name] : null;
+        },
+
+        
+        isValid : function(api){
+            var invalid = [];
+            var crud = this.actions; 
+            for (var action in api) {
+                if (!(action in crud)) {
+                    invalid.push(action);
+                }
+            }
+            return (!invalid.length) ? true : invalid;
+        },
+
+        
+        hasUniqueUrl : function(proxy, verb) {
+            var url = (proxy.api[verb]) ? proxy.api[verb].url : null;
+            var unique = true;
+            for (var action in proxy.api) {
+                if ((unique = (action === verb) ? true : (proxy.api[action].url != url) ? true : false) === false) {
+                    break;
+                }
+            }
+            return unique;
+        },
+
+        
+        prepare : function(proxy) {
+            if (!proxy.api) {
+                proxy.api = {}; 
+            }
+            for (var verb in this.actions) {
+                var action = this.actions[verb];
+                proxy.api[action] = proxy.api[action] || proxy.url || proxy.directFn;
+                if (typeof(proxy.api[action]) == 'string') {
+                    proxy.api[action] = {
+                        url: proxy.api[action],
+                        method: (proxy.restful === true) ? Ext.data.Api.restActions[action] : undefined
+                    };
+                }
+            }
+        },
+
+        
+        restify : function(proxy) {
+            proxy.restful = true;
+            for (var verb in this.restActions) {
+                proxy.api[this.actions[verb]].method ||
+                    (proxy.api[this.actions[verb]].method = this.restActions[verb]);
+            }
+            
+            
+            proxy.onWrite = proxy.onWrite.createInterceptor(function(action, o, response, rs) {
+                var reader = o.reader;
+                var res = new Ext.data.Response({
+                    action: action,
+                    raw: response
+                });
+
+                switch (response.status) {
+                    case 200:   
+                        return true;
+                        break;
+                    case 201:   
+                        if (Ext.isEmpty(res.raw.responseText)) {
+                          res.success = true;
+                        } else {
+                          
+                          return true;
+                        }
+                        break;
+                    case 204:  
+                        res.success = true;
+                        res.data = null;
+                        break;
+                    default:
+                        return true;
+                        break;
+                }
+                if (res.success === true) {
+                    this.fireEvent("write", this, action, res.data, res, rs, o.request.arg);
+                } else {
+                    this.fireEvent('exception', this, 'remote', action, o, res, rs);
+                }
+                o.request.callback.call(o.request.scope, res.data, res, res.success);
+
+                return false;   
+            }, proxy);
+        }
+    };
+})();
+
+
+Ext.data.Response = function(params, response) {
+    Ext.apply(this, params, {
+        raw: response
+    });
+};
+Ext.data.Response.prototype = {
+    message : null,
+    success : false,
+    status : null,
+    root : null,
+    raw : null,
+
+    getMessage : function() {
+        return this.message;
+    },
+    getSuccess : function() {
+        return this.success;
+    },
+    getStatus : function() {
+        return this.status;
+    },
+    getRoot : function() {
+        return this.root;
+    },
+    getRawResponse : function() {
+        return this.raw;
+    }
+};
+
+
+Ext.data.Api.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.Api'
+});
+Ext.apply(Ext.data.Api.Error.prototype, {
+    lang: {
+        'action-url-undefined': 'No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.',
+        'invalid': 'received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions',
+        'invalid-url': 'Invalid url.  Please review your proxy configuration.',
+        'execute': 'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'
+    }
+});
+
+
+
+
+Ext.data.SortTypes = {
+    
+    none : function(s){
+        return s;
+    },
+    
+    
+    stripTagsRE : /<\/?[^>]+>/gi,
+    
+    
+    asText : function(s){
+        return String(s).replace(this.stripTagsRE, "");
+    },
+    
+    
+    asUCText : function(s){
+        return String(s).toUpperCase().replace(this.stripTagsRE, "");
+    },
+    
+    
+    asUCString : function(s) {
+    	return String(s).toUpperCase();
+    },
+    
+    
+    asDate : function(s) {
+        if(!s){
+            return 0;
+        }
+        if(Ext.isDate(s)){
+            return s.getTime();
+        }
+    	return Date.parse(String(s));
+    },
+    
+    
+    asFloat : function(s) {
+    	var val = parseFloat(String(s).replace(/,/g, ""));
+    	return isNaN(val) ? 0 : val;
+    },
+    
+    
+    asInt : function(s) {
+        var val = parseInt(String(s).replace(/,/g, ""), 10);
+        return isNaN(val) ? 0 : val;
+    }
+};
+Ext.data.Record = function(data, id){
+    
+    this.id = (id || id === 0) ? id : Ext.data.Record.id(this);
+    this.data = data || {};
+};
+
+
+Ext.data.Record.create = function(o){
+    var f = Ext.extend(Ext.data.Record, {});
+    var p = f.prototype;
+    p.fields = new Ext.util.MixedCollection(false, function(field){
+        return field.name;
+    });
+    for(var i = 0, len = o.length; i < len; i++){
+        p.fields.add(new Ext.data.Field(o[i]));
+    }
+    f.getField = function(name){
+        return p.fields.get(name);
+    };
+    return f;
+};
+
+Ext.data.Record.PREFIX = 'ext-record';
+Ext.data.Record.AUTO_ID = 1;
+Ext.data.Record.EDIT = 'edit';
+Ext.data.Record.REJECT = 'reject';
+Ext.data.Record.COMMIT = 'commit';
+
+
+
+Ext.data.Record.id = function(rec) {
+    rec.phantom = true;
+    return [Ext.data.Record.PREFIX, '-', Ext.data.Record.AUTO_ID++].join('');
+};
+
+Ext.data.Record.prototype = {
+    
+    
+    
+    
+    
+    
+    dirty : false,
+    editing : false,
+    error : null,
+    
+    modified : null,
+    
+    phantom : false,
+
+    
+    join : function(store){
+        
+        this.store = store;
+    },
+
+    
+    set : function(name, value){
+        var encode = Ext.isPrimitive(value) ? String : Ext.encode;
+        if(encode(this.data[name]) == encode(value)) {
+            return;
+        }        
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        if(this.modified[name] === undefined){
+            this.modified[name] = this.data[name];
+        }
+        this.data[name] = value;
+        if(!this.editing){
+            this.afterEdit();
+        }
+    },
+
+    
+    afterEdit : function(){
+        if (this.store != undefined && typeof this.store.afterEdit == "function") {
+            this.store.afterEdit(this);
+        }
+    },
+
+    
+    afterReject : function(){
+        if(this.store){
+            this.store.afterReject(this);
+        }
+    },
+
+    
+    afterCommit : function(){
+        if(this.store){
+            this.store.afterCommit(this);
+        }
+    },
+
+    
+    get : function(name){
+        return this.data[name];
+    },
+
+    
+    beginEdit : function(){
+        this.editing = true;
+        this.modified = this.modified || {};
+    },
+
+    
+    cancelEdit : function(){
+        this.editing = false;
+        delete this.modified;
+    },
+
+    
+    endEdit : function(){
+        this.editing = false;
+        if(this.dirty){
+            this.afterEdit();
+        }
+    },
+
+    
+    reject : function(silent){
+        var m = this.modified;
+        for(var n in m){
+            if(typeof m[n] != "function"){
+                this.data[n] = m[n];
+            }
+        }
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterReject();
+        }
+    },
+
+    
+    commit : function(silent){
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterCommit();
+        }
+    },
+
+    
+    getChanges : function(){
+        var m = this.modified, cs = {};
+        for(var n in m){
+            if(m.hasOwnProperty(n)){
+                cs[n] = this.data[n];
+            }
+        }
+        return cs;
+    },
+
+    
+    hasError : function(){
+        return this.error !== null;
+    },
+
+    
+    clearError : function(){
+        this.error = null;
+    },
+
+    
+    copy : function(newId) {
+        return new this.constructor(Ext.apply({}, this.data), newId || this.id);
+    },
+
+    
+    isModified : function(fieldName){
+        return !!(this.modified && this.modified.hasOwnProperty(fieldName));
+    },
+
+    
+    isValid : function() {
+        return this.fields.find(function(f) {
+            return (f.allowBlank === false && Ext.isEmpty(this.data[f.name])) ? true : false;
+        },this) ? false : true;
+    },
+
+    
+    markDirty : function(){
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        this.fields.each(function(f) {
+            this.modified[f.name] = this.data[f.name];
+        },this);
+    }
+};
+
+Ext.StoreMgr = Ext.apply(new Ext.util.MixedCollection(), {
+    
+
+    
+    register : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.add(s);
+        }
+    },
+
+    
+    unregister : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.remove(this.lookup(s));
+        }
+    },
+
+    
+    lookup : function(id){
+        if(Ext.isArray(id)){
+            var fields = ['field1'], expand = !Ext.isArray(id[0]);
+            if(!expand){
+                for(var i = 2, len = id[0].length; i <= len; ++i){
+                    fields.push('field' + i);
+                }
+            }
+            return new Ext.data.ArrayStore({
+                fields: fields,
+                data: id,
+                expandData: expand,
+                autoDestroy: true,
+                autoCreated: true
+
+            });
+        }
+        return Ext.isObject(id) ? (id.events ? id : Ext.create(id, 'store')) : this.get(id);
+    },
+
+    
+    getKey : function(o){
+         return o.storeId;
+    }
+});
+Ext.data.Store = Ext.extend(Ext.util.Observable, {
+    
+    
+    
+    
+    
+    
+    
+    writer : undefined,
+    
+    
+    
+    remoteSort : false,
+
+    
+    autoDestroy : false,
+
+    
+    pruneModifiedRecords : false,
+
+    
+    lastOptions : null,
+
+    
+    autoSave : true,
+
+    
+    batch : true,
+
+    
+    restful: false,
+
+    
+    paramNames : undefined,
+
+    
+    defaultParamNames : {
+        start : 'start',
+        limit : 'limit',
+        sort : 'sort',
+        dir : 'dir'
+    },
+
+    isDestroyed: false,    
+    hasMultiSort: false,
+
+    
+    batchKey : '_ext_batch_',
+
+    constructor : function(config){
+        
+        
+        
+        
+        this.data = new Ext.util.MixedCollection(false);
+        this.data.getKey = function(o){
+            return o.id;
+        };
+        
+
+        
+        this.removed = [];
+
+        if(config && config.data){
+            this.inlineData = config.data;
+            delete config.data;
+        }
+
+        Ext.apply(this, config);
+
+        
+        this.baseParams = Ext.isObject(this.baseParams) ? this.baseParams : {};
+
+        this.paramNames = Ext.applyIf(this.paramNames || {}, this.defaultParamNames);
+
+        if((this.url || this.api) && !this.proxy){
+            this.proxy = new Ext.data.HttpProxy({url: this.url, api: this.api});
+        }
+        
+        if (this.restful === true && this.proxy) {
+            
+            
+            this.batch = false;
+            Ext.data.Api.restify(this.proxy);
+        }
+
+        if(this.reader){ 
+            if(!this.recordType){
+                this.recordType = this.reader.recordType;
+            }
+            if(this.reader.onMetaChange){
+                this.reader.onMetaChange = this.reader.onMetaChange.createSequence(this.onMetaChange, this);
+            }
+            if (this.writer) { 
+                if (this.writer instanceof(Ext.data.DataWriter) === false) {    
+                    this.writer = this.buildWriter(this.writer);
+                }
+                this.writer.meta = this.reader.meta;
+                this.pruneModifiedRecords = true;
+            }
+        }
+
+        
+
+        if(this.recordType){
+            
+            this.fields = this.recordType.prototype.fields;
+        }
+        this.modified = [];
+
+        this.addEvents(
+            
+            'datachanged',
+            
+            'metachange',
+            
+            'add',
+            
+            'remove',
+            
+            'update',
+            
+            'clear',
+            
+            'exception',
+            
+            'beforeload',
+            
+            'load',
+            
+            'loadexception',
+            
+            'beforewrite',
+            
+            'write',
+            
+            'beforesave',
+            
+            'save'
+
+        );
+
+        if(this.proxy){
+            
+            this.relayEvents(this.proxy,  ['loadexception', 'exception']);
+        }
+        
+        if (this.writer) {
+            this.on({
+                scope: this,
+                add: this.createRecords,
+                remove: this.destroyRecord,
+                update: this.updateRecord,
+                clear: this.onClear
+            });
+        }
+
+        this.sortToggle = {};
+        if(this.sortField){
+            this.setDefaultSort(this.sortField, this.sortDir);
+        }else if(this.sortInfo){
+            this.setDefaultSort(this.sortInfo.field, this.sortInfo.direction);
+        }
+
+        Ext.data.Store.superclass.constructor.call(this);
+
+        if(this.id){
+            this.storeId = this.id;
+            delete this.id;
+        }
+        if(this.storeId){
+            Ext.StoreMgr.register(this);
+        }
+        if(this.inlineData){
+            this.loadData(this.inlineData);
+            delete this.inlineData;
+        }else if(this.autoLoad){
+            this.load.defer(10, this, [
+                typeof this.autoLoad == 'object' ?
+                    this.autoLoad : undefined]);
+        }
+        
+        this.batchCounter = 0;
+        this.batches = {};
+    },
+
+    
+    buildWriter : function(config) {
+        var klass = undefined,
+            type = (config.format || 'json').toLowerCase();
+        switch (type) {
+            case 'json':
+                klass = Ext.data.JsonWriter;
+                break;
+            case 'xml':
+                klass = Ext.data.XmlWriter;
+                break;
+            default:
+                klass = Ext.data.JsonWriter;
+        }
+        return new klass(config);
+    },
+
+    
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.storeId){
+                Ext.StoreMgr.unregister(this);
+            }
+            this.clearData();
+            this.data = null;
+            Ext.destroy(this.proxy);
+            this.reader = this.writer = null;
+            this.purgeListeners();
+            this.isDestroyed = true;
+        }
+    },
+
+    
+    add : function(records) {
+        var i, len, record, index;
+        
+        records = [].concat(records);
+        if (records.length < 1) {
+            return;
+        }
+        
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        index = this.data.length;
+        this.data.addAll(records);
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    
+    addSorted : function(record){
+        var index = this.findInsertIndex(record);
+        this.insert(index, record);
+    },
+    
+    
+    doUpdate: function(rec){
+        var id = rec.id;
+        
+        this.getById(id).join(null);
+        
+        this.data.replace(id, rec);
+        if (this.snapshot) {
+            this.snapshot.replace(id, rec);
+        }
+        rec.join(this);
+        this.fireEvent('update', this, rec, Ext.data.Record.COMMIT);
+    },
+
+    
+    remove : function(record){
+        if(Ext.isArray(record)){
+            Ext.each(record, function(r){
+                this.remove(r);
+            }, this);
+            return;
+        }
+        var index = this.data.indexOf(record);
+        if(index > -1){
+            record.join(null);
+            this.data.removeAt(index);
+        }
+        if(this.pruneModifiedRecords){
+            this.modified.remove(record);
+        }
+        if(this.snapshot){
+            this.snapshot.remove(record);
+        }
+        if(index > -1){
+            this.fireEvent('remove', this, record, index);
+        }
+    },
+
+    
+    removeAt : function(index){
+        this.remove(this.getAt(index));
+    },
+
+    
+    removeAll : function(silent){
+        var items = [];
+        this.each(function(rec){
+            items.push(rec);
+        });
+        this.clearData();
+        if(this.snapshot){
+            this.snapshot.clear();
+        }
+        if(this.pruneModifiedRecords){
+            this.modified = [];
+        }
+        if (silent !== true) {  
+            this.fireEvent('clear', this, items);
+        }
+    },
+
+    
+    onClear: function(store, records){
+        Ext.each(records, function(rec, index){
+            this.destroyRecord(this, rec, index);
+        }, this);
+    },
+
+    
+    insert : function(index, records) {
+        var i, len, record;
+        
+        records = [].concat(records);
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            this.data.insert(index + i, record);
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    
+    indexOf : function(record){
+        return this.data.indexOf(record);
+    },
+
+    
+    indexOfId : function(id){
+        return this.data.indexOfKey(id);
+    },
+
+    
+    getById : function(id){
+        return (this.snapshot || this.data).key(id);
+    },
+
+    
+    getAt : function(index){
+        return this.data.itemAt(index);
+    },
+
+    
+    getRange : function(start, end){
+        return this.data.getRange(start, end);
+    },
+
+    
+    storeOptions : function(o){
+        o = Ext.apply({}, o);
+        delete o.callback;
+        delete o.scope;
+        this.lastOptions = o;
+    },
+
+    
+    clearData: function(){
+        this.data.each(function(rec) {
+            rec.join(null);
+        });
+        this.data.clear();
+    },
+
+    
+    load : function(options) {
+        options = Ext.apply({}, options);
+        this.storeOptions(options);
+        if(this.sortInfo && this.remoteSort){
+            var pn = this.paramNames;
+            options.params = Ext.apply({}, options.params);
+            options.params[pn.sort] = this.sortInfo.field;
+            options.params[pn.dir] = this.sortInfo.direction;
+        }
+        try {
+            return this.execute('read', null, options); 
+        } catch(e) {
+            this.handleException(e);
+            return false;
+        }
+    },
+
+    
+    updateRecord : function(store, record, action) {
+        if (action == Ext.data.Record.EDIT && this.autoSave === true && (!record.phantom || (record.phantom && record.isValid()))) {
+            this.save();
+        }
+    },
+
+    
+    createRecords : function(store, records, index) {
+        var modified = this.modified,
+            length   = records.length,
+            record, i;
+        
+        for (i = 0; i < length; i++) {
+            record = records[i];
+            
+            if (record.phantom && record.isValid()) {
+                record.markDirty();  
+                
+                if (modified.indexOf(record) == -1) {
+                    modified.push(record);
+                }
+            }
+        }
+        if (this.autoSave === true) {
+            this.save();
+        }
+    },
+
+    
+    destroyRecord : function(store, record, index) {
+        if (this.modified.indexOf(record) != -1) {  
+            this.modified.remove(record);
+        }
+        if (!record.phantom) {
+            this.removed.push(record);
+
+            
+            
+            
+            record.lastIndex = index;
+
+            if (this.autoSave === true) {
+                this.save();
+            }
+        }
+    },
+
+    
+    execute : function(action, rs, options,  batch) {
+        
+        if (!Ext.data.Api.isAction(action)) {
+            throw new Ext.data.Api.Error('execute', action);
+        }
+        
+        options = Ext.applyIf(options||{}, {
+            params: {}
+        });
+        if(batch !== undefined){
+            this.addToBatch(batch);
+        }
+        
+        
+        var doRequest = true;
+
+        if (action === 'read') {
+            doRequest = this.fireEvent('beforeload', this, options);
+            Ext.applyIf(options.params, this.baseParams);
+        }
+        else {
+            
+            
+            if (this.writer.listful === true && this.restful !== true) {
+                rs = (Ext.isArray(rs)) ? rs : [rs];
+            }
+            
+            else if (Ext.isArray(rs) && rs.length == 1) {
+                rs = rs.shift();
+            }
+            
+            if ((doRequest = this.fireEvent('beforewrite', this, action, rs, options)) !== false) {
+                this.writer.apply(options.params, this.baseParams, action, rs);
+            }
+        }
+        if (doRequest !== false) {
+            
+            if (this.writer && this.proxy.url && !this.proxy.restful && !Ext.data.Api.hasUniqueUrl(this.proxy, action)) {
+                options.params.xaction = action;    
+            }
+            
+            
+            
+            
+            
+            this.proxy.request(Ext.data.Api.actions[action], rs, options.params, this.reader, this.createCallback(action, rs, batch), this, options);
+        }
+        return doRequest;
+    },
+
+    
+    save : function() {
+        if (!this.writer) {
+            throw new Ext.data.Store.Error('writer-undefined');
+        }
+
+        var queue = [],
+            len,
+            trans,
+            batch,
+            data = {},
+            i;
+        
+        if(this.removed.length){
+            queue.push(['destroy', this.removed]);
+        }
+
+        
+        var rs = [].concat(this.getModifiedRecords());
+        if(rs.length){
+            
+            var phantoms = [];
+            for(i = rs.length-1; i >= 0; i--){
+                if(rs[i].phantom === true){
+                    var rec = rs.splice(i, 1).shift();
+                    if(rec.isValid()){
+                        phantoms.push(rec);
+                    }
+                }else if(!rs[i].isValid()){ 
+                    rs.splice(i,1);
+                }
+            }
+            
+            if(phantoms.length){
+                queue.push(['create', phantoms]);
+            }
+
+            
+            if(rs.length){
+                queue.push(['update', rs]);
+            }
+        }
+        len = queue.length;
+        if(len){
+            batch = ++this.batchCounter;
+            for(i = 0; i < len; ++i){
+                trans = queue[i];
+                data[trans[0]] = trans[1];
+            }
+            if(this.fireEvent('beforesave', this, data) !== false){
+                for(i = 0; i < len; ++i){
+                    trans = queue[i];
+                    this.doTransaction(trans[0], trans[1], batch);
+                }
+                return batch;
+            }
+        }
+        return -1;
+    },
+
+    
+    doTransaction : function(action, rs, batch) {
+        function transaction(records) {
+            try{
+                this.execute(action, records, undefined, batch);
+            }catch (e){
+                this.handleException(e);
+            }
+        }
+        if(this.batch === false){
+            for(var i = 0, len = rs.length; i < len; i++){
+                transaction.call(this, rs[i]);
+            }
+        }else{
+            transaction.call(this, rs);
+        }
+    },
+
+    
+    addToBatch : function(batch){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key];
+
+        if(!o){
+            b[key] = o = {
+                id: batch,
+                count: 0,
+                data: {}
+            };
+        }
+        ++o.count;
+    },
+
+    removeFromBatch : function(batch, action, data){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key],
+            arr;
+
+
+        if(o){
+            arr = o.data[action] || [];
+            o.data[action] = arr.concat(data);
+            if(o.count === 1){
+                data = o.data;
+                delete b[key];
+                this.fireEvent('save', this, batch, data);
+            }else{
+                --o.count;
+            }
+        }
+    },
+
+    
+    
+    createCallback : function(action, rs, batch) {
+        var actions = Ext.data.Api.actions;
+        return (action == 'read') ? this.loadRecords : function(data, response, success) {
+            
+            this['on' + Ext.util.Format.capitalize(action) + 'Records'](success, rs, [].concat(data));
+            
+            if (success === true) {
+                this.fireEvent('write', this, action, data, response, rs);
+            }
+            this.removeFromBatch(batch, action, data);
+        };
+    },
+
+    
+    
+    
+    clearModified : function(rs) {
+        if (Ext.isArray(rs)) {
+            for (var n=rs.length-1;n>=0;n--) {
+                this.modified.splice(this.modified.indexOf(rs[n]), 1);
+            }
+        } else {
+            this.modified.splice(this.modified.indexOf(rs), 1);
+        }
+    },
+
+    
+    reMap : function(record) {
+        if (Ext.isArray(record)) {
+            for (var i = 0, len = record.length; i < len; i++) {
+                this.reMap(record[i]);
+            }
+        } else {
+            delete this.data.map[record._phid];
+            this.data.map[record.id] = record;
+            var index = this.data.keys.indexOf(record._phid);
+            this.data.keys.splice(index, 1, record.id);
+            delete record._phid;
+        }
+    },
+
+    
+    onCreateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.realize(rs, data);
+            }
+            catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    
+                    this.onCreateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    
+    onUpdateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.update(rs, data);
+            } catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    
+                    this.onUpdateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    
+    onDestroyRecords : function(success, rs, data) {
+        
+        rs = (rs instanceof Ext.data.Record) ? [rs] : [].concat(rs);
+        for (var i=0,len=rs.length;i<len;i++) {
+            this.removed.splice(this.removed.indexOf(rs[i]), 1);
+        }
+        if (success === false) {
+            
+            
+            for (i=rs.length-1;i>=0;i--) {
+                this.insert(rs[i].lastIndex, rs[i]);    
+            }
+        }
+    },
+
+    
+    handleException : function(e) {
+        
+        Ext.handleError(e);
+    },
+
+    
+    reload : function(options){
+        this.load(Ext.applyIf(options||{}, this.lastOptions));
+    },
+
+    
+    
+    loadRecords : function(o, options, success){
+        var i, len;
+        
+        if (this.isDestroyed === true) {
+            return;
+        }
+        if(!o || success === false){
+            if(success !== false){
+                this.fireEvent('load', this, [], options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope || this, [], options, false, o);
+            }
+            return;
+        }
+        var r = o.records, t = o.totalRecords || r.length;
+        if(!options || options.add !== true){
+            if(this.pruneModifiedRecords){
+                this.modified = [];
+            }
+            for(i = 0, len = r.length; i < len; i++){
+                r[i].join(this);
+            }
+            if(this.snapshot){
+                this.data = this.snapshot;
+                delete this.snapshot;
+            }
+            this.clearData();
+            this.data.addAll(r);
+            this.totalLength = t;
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }else{
+            var toAdd = [],
+                rec,
+                cnt = 0;
+            for(i = 0, len = r.length; i < len; ++i){
+                rec = r[i];
+                if(this.indexOfId(rec.id) > -1){
+                    this.doUpdate(rec);
+                }else{
+                    toAdd.push(rec);
+                    ++cnt;
+                }
+            }
+            this.totalLength = Math.max(t, this.data.length + cnt);
+            this.add(toAdd);
+        }
+        this.fireEvent('load', this, r, options);
+        if(options.callback){
+            options.callback.call(options.scope || this, r, options, true);
+        }
+    },
+
+    
+    loadData : function(o, append){
+        var r = this.reader.readRecords(o);
+        this.loadRecords(r, {add: append}, true);
+    },
+
+    
+    getCount : function(){
+        return this.data.length || 0;
+    },
+
+    
+    getTotalCount : function(){
+        return this.totalLength || 0;
+    },
+
+    
+    getSortState : function(){
+        return this.sortInfo;
+    },
+
+    
+    applySort : function(){
+        if ((this.sortInfo || this.multiSortInfo) && !this.remoteSort) {
+            this.sortData();
+        }
+    },
+
+    
+    sortData : function() {
+        var sortInfo  = this.hasMultiSort ? this.multiSortInfo : this.sortInfo,
+            direction = sortInfo.direction || "ASC",
+            sorters   = sortInfo.sorters,
+            sortFns   = [];
+
+        
+        if (!this.hasMultiSort) {
+            sorters = [{direction: direction, field: sortInfo.field}];
+        }
+
+        
+        for (var i=0, j = sorters.length; i < j; i++) {
+            sortFns.push(this.createSortFunction(sorters[i].field, sorters[i].direction));
+        }
+        
+        if (sortFns.length == 0) {
+            return;
+        }
+
+        
+        
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        
+        var fn = function(r1, r2) {
+          var result = sortFns[0].call(this, r1, r2);
+
+          
+          if (sortFns.length > 1) {
+              for (var i=1, j = sortFns.length; i < j; i++) {
+                  result = result || sortFns[i].call(this, r1, r2);
+              }
+          }
+
+          return directionModifier * result;
+        };
+
+        
+        this.data.sort(direction, fn);
+        if (this.snapshot && this.snapshot != this.data) {
+            this.snapshot.sort(direction, fn);
+        }
+    },
+
+    
+    createSortFunction: function(field, direction) {
+        direction = direction || "ASC";
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        var sortType = this.fields.get(field).sortType;
+
+        
+        
+        return function(r1, r2) {
+            var v1 = sortType(r1.data[field]),
+                v2 = sortType(r2.data[field]);
+
+            return directionModifier * (v1 > v2 ? 1 : (v1 < v2 ? -1 : 0));
+        };
+    },
+
+    
+    setDefaultSort : function(field, dir) {
+        dir = dir ? dir.toUpperCase() : 'ASC';
+        this.sortInfo = {field: field, direction: dir};
+        this.sortToggle[field] = dir;
+    },
+
+    
+    sort : function(fieldName, dir) {
+        if (Ext.isArray(arguments[0])) {
+            return this.multiSort.call(this, fieldName, dir);
+        } else {
+            return this.singleSort(fieldName, dir);
+        }
+    },
+
+    
+    singleSort: function(fieldName, dir) {
+        var field = this.fields.get(fieldName);
+        if (!field) {
+            return false;
+        }
+
+        var name       = field.name,
+            sortInfo   = this.sortInfo || null,
+            sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+        if (!dir) {
+            if (sortInfo && sortInfo.field == name) { 
+                dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+            } else {
+                dir = field.sortDir;
+            }
+        }
+
+        this.sortToggle[name] = dir;
+        this.sortInfo = {field: name, direction: dir};
+        this.hasMultiSort = false;
+
+        if (this.remoteSort) {
+            if (!this.load(this.lastOptions)) {
+                if (sortToggle) {
+                    this.sortToggle[name] = sortToggle;
+                }
+                if (sortInfo) {
+                    this.sortInfo = sortInfo;
+                }
+            }
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+        return true;
+    },
+
+    
+    multiSort: function(sorters, direction) {
+        this.hasMultiSort = true;
+        direction = direction || "ASC";
+
+        
+        if (this.multiSortInfo && direction == this.multiSortInfo.direction) {
+            direction = direction.toggle("ASC", "DESC");
+        }
+
+        
+        this.multiSortInfo = {
+            sorters  : sorters,
+            direction: direction
+        };
+        
+        if (this.remoteSort) {
+            this.singleSort(sorters[0].field, sorters[0].direction);
+
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    
+    each : function(fn, scope){
+        this.data.each(fn, scope);
+    },
+
+    
+    getModifiedRecords : function(){
+        return this.modified;
+    },
+
+    
+    sum : function(property, start, end){
+        var rs = this.data.items, v = 0;
+        start = start || 0;
+        end = (end || end === 0) ? end : rs.length-1;
+
+        for(var i = start; i <= end; i++){
+            v += (rs[i].data[property] || 0);
+        }
+        return v;
+    },
+
+    
+    createFilterFn : function(property, value, anyMatch, caseSensitive, exactMatch){
+        if(Ext.isEmpty(value, false)){
+            return false;
+        }
+        value = this.data.createValueMatcher(value, anyMatch, caseSensitive, exactMatch);
+        return function(r) {
+            return value.test(r.data[property]);
+        };
+    },
+
+    
+    createMultipleFilterFn: function(filters) {
+        return function(record) {
+            var isMatch = true;
+
+            for (var i=0, j = filters.length; i < j; i++) {
+                var filter = filters[i],
+                    fn     = filter.fn,
+                    scope  = filter.scope;
+
+                isMatch = isMatch && fn.call(scope, record);
+            }
+
+            return isMatch;
+        };
+    },
+
+    
+    filter : function(property, value, anyMatch, caseSensitive, exactMatch){
+        var fn;
+        
+        if (Ext.isObject(property)) {
+            property = [property];
+        }
+
+        if (Ext.isArray(property)) {
+            var filters = [];
+
+            
+            for (var i=0, j = property.length; i < j; i++) {
+                var filter = property[i],
+                    func   = filter.fn,
+                    scope  = filter.scope || this;
+
+                
+                if (!Ext.isFunction(func)) {
+                    func = this.createFilterFn(filter.property, filter.value, filter.anyMatch, filter.caseSensitive, filter.exactMatch);
+                }
+
+                filters.push({fn: func, scope: scope});
+            }
+
+            fn = this.createMultipleFilterFn(filters);
+        } else {
+            
+            fn = this.createFilterFn(property, value, anyMatch, caseSensitive, exactMatch);
+        }
+
+        return fn ? this.filterBy(fn) : this.clearFilter();
+    },
+
+    
+    filterBy : function(fn, scope){
+        this.snapshot = this.snapshot || this.data;
+        this.data = this.queryBy(fn, scope || this);
+        this.fireEvent('datachanged', this);
+    },
+
+    
+    clearFilter : function(suppressEvent){
+        if(this.isFiltered()){
+            this.data = this.snapshot;
+            delete this.snapshot;
+            if(suppressEvent !== true){
+                this.fireEvent('datachanged', this);
+            }
+        }
+    },
+
+    
+    isFiltered : function(){
+        return !!this.snapshot && this.snapshot != this.data;
+    },
+
+    
+    query : function(property, value, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.queryBy(fn) : this.data.clone();
+    },
+
+    
+    queryBy : function(fn, scope){
+        var data = this.snapshot || this.data;
+        return data.filterBy(fn, scope||this);
+    },
+
+    
+    find : function(property, value, start, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.data.findIndexBy(fn, null, start) : -1;
+    },
+
+    
+    findExact: function(property, value, start){
+        return this.data.findIndexBy(function(rec){
+            return rec.get(property) === value;
+        }, this, start);
+    },
+
+    
+    findBy : function(fn, scope, start){
+        return this.data.findIndexBy(fn, scope, start);
+    },
+
+    
+    collect : function(dataIndex, allowNull, bypassFilter){
+        var d = (bypassFilter === true && this.snapshot) ?
+                this.snapshot.items : this.data.items;
+        var v, sv, r = [], l = {};
+        for(var i = 0, len = d.length; i < len; i++){
+            v = d[i].data[dataIndex];
+            sv = String(v);
+            if((allowNull || !Ext.isEmpty(v)) && !l[sv]){
+                l[sv] = true;
+                r[r.length] = v;
+            }
+        }
+        return r;
+    },
+
+    
+    afterEdit : function(record){
+        if(this.modified.indexOf(record) == -1){
+            this.modified.push(record);
+        }
+        this.fireEvent('update', this, record, Ext.data.Record.EDIT);
+    },
+
+    
+    afterReject : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.REJECT);
+    },
+
+    
+    afterCommit : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.COMMIT);
+    },
+
+    
+    commitChanges : function(){
+        var modified = this.modified.slice(0),
+            length   = modified.length,
+            i;
+            
+        for (i = 0; i < length; i++){
+            modified[i].commit();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    
+    rejectChanges : function() {
+        var modified = this.modified.slice(0),
+            removed  = this.removed.slice(0).reverse(),
+            mLength  = modified.length,
+            rLength  = removed.length,
+            i;
+        
+        for (i = 0; i < mLength; i++) {
+            modified[i].reject();
+        }
+        
+        for (i = 0; i < rLength; i++) {
+            this.insert(removed[i].lastIndex || 0, removed[i]);
+            removed[i].reject();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    
+    onMetaChange : function(meta){
+        this.recordType = this.reader.recordType;
+        this.fields = this.recordType.prototype.fields;
+        delete this.snapshot;
+        if(this.reader.meta.sortInfo){
+            this.sortInfo = this.reader.meta.sortInfo;
+        }else if(this.sortInfo  && !this.fields.get(this.sortInfo.field)){
+            delete this.sortInfo;
+        }
+        if(this.writer){
+            this.writer.meta = this.reader.meta;
+        }
+        this.modified = [];
+        this.fireEvent('metachange', this, this.reader.meta);
+    },
+
+    
+    findInsertIndex : function(record){
+        this.suspendEvents();
+        var data = this.data.clone();
+        this.data.add(record);
+        this.applySort();
+        var index = this.data.indexOf(record);
+        this.data = data;
+        this.resumeEvents();
+        return index;
+    },
+
+    
+    setBaseParam : function (name, value){
+        this.baseParams = this.baseParams || {};
+        this.baseParams[name] = value;
+    }
+});
+
+Ext.reg('store', Ext.data.Store);
+
+
+Ext.data.Store.Error = Ext.extend(Ext.Error, {
+    name: 'Ext.data.Store'
+});
+Ext.apply(Ext.data.Store.Error.prototype, {
+    lang: {
+        'writer-undefined' : 'Attempted to execute a write-action without a DataWriter installed.'
+    }
+});
+
+Ext.data.Field = Ext.extend(Object, {
+    
+    constructor : function(config){
+        if(Ext.isString(config)){
+            config = {name: config};
+        }
+        Ext.apply(this, config);
+        
+        var types = Ext.data.Types,
+            st = this.sortType,
+            t;
+
+        if(this.type){
+            if(Ext.isString(this.type)){
+                this.type = Ext.data.Types[this.type.toUpperCase()] || types.AUTO;
+            }
+        }else{
+            this.type = types.AUTO;
+        }
+
+        
+        if(Ext.isString(st)){
+            this.sortType = Ext.data.SortTypes[st];
+        }else if(Ext.isEmpty(st)){
+            this.sortType = this.type.sortType;
+        }
+
+        if(!this.convert){
+            this.convert = this.type.convert;
+        }
+    },
+    
+    
+    
+    
+    
+    dateFormat: null,
+    
+    
+    useNull: false,
+    
+    
+    defaultValue: "",
+    
+    mapping: null,
+    
+    sortType : null,
+    
+    sortDir : "ASC",
+    
+    allowBlank : true
+});
+
+Ext.data.DataReader = function(meta, recordType){
+    
+    this.meta = meta;
+    
+    this.recordType = Ext.isArray(recordType) ?
+        Ext.data.Record.create(recordType) : recordType;
+
+    
+    if (this.recordType){
+        this.buildExtractors();
+    }
+};
+
+Ext.data.DataReader.prototype = {
+    
+    
+    getTotal: Ext.emptyFn,
+    
+    getRoot: Ext.emptyFn,
+    
+    getMessage: Ext.emptyFn,
+    
+    getSuccess: Ext.emptyFn,
+    
+    getId: Ext.emptyFn,
+    
+    buildExtractors : Ext.emptyFn,
+    
+    extractValues : Ext.emptyFn,
+
+    
+    realize: function(rs, data){
+        if (Ext.isArray(rs)) {
+            for (var i = rs.length - 1; i >= 0; i--) {
+                
+                if (Ext.isArray(data)) {
+                    this.realize(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    
+                    
+                    this.realize(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (!this.isData(data)) {
+                
+                
+                throw new Ext.data.DataReader.Error('realize', rs);
+            }
+            rs.phantom = false; 
+            rs._phid = rs.id;  
+            rs.id = this.getId(data);
+            rs.data = data;
+
+            rs.commit();
+            rs.store.reMap(rs);
+        }
+    },
+
+    
+    update : function(rs, data) {
+        if (Ext.isArray(rs)) {
+            for (var i=rs.length-1; i >= 0; i--) {
+                if (Ext.isArray(data)) {
+                    this.update(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    
+                    
+                    this.update(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (this.isData(data)) {
+                rs.data = Ext.apply(rs.data, data);
+            }
+            rs.commit();
+        }
+    },
+
+    
+    extractData : function(root, returnRecords) {
+        
+        var rawName = (this instanceof Ext.data.JsonReader) ? 'json' : 'node';
+
+        var rs = [];
+
+        
+        
+        if (this.isData(root) && !(this instanceof Ext.data.XmlReader)) {
+            root = [root];
+        }
+        var f       = this.recordType.prototype.fields,
+            fi      = f.items,
+            fl      = f.length,
+            rs      = [];
+        if (returnRecords === true) {
+            var Record = this.recordType;
+            for (var i = 0; i < root.length; i++) {
+                var n = root[i];
+                var record = new Record(this.extractValues(n, fi, fl), this.getId(n));
+                record[rawName] = n;    
+                rs.push(record);
+            }
+        }
+        else {
+            for (var i = 0; i < root.length; i++) {
+                var data = this.extractValues(root[i], fi, fl);
+                data[this.meta.idProperty] = this.getId(root[i]);
+                rs.push(data);
+            }
+        }
+        return rs;
+    },
+
+    
+    isData : function(data) {
+        return (data && Ext.isObject(data) && !Ext.isEmpty(this.getId(data))) ? true : false;
+    },
+
+    
+    onMetaChange : function(meta){
+        delete this.ef;
+        this.meta = meta;
+        this.recordType = Ext.data.Record.create(meta.fields);
+        this.buildExtractors();
+    }
+};
+
+
+Ext.data.DataReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataReader'
+});
+Ext.apply(Ext.data.DataReader.Error.prototype, {
+    lang : {
+        'update': "#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",
+        'realize': "#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.",
+        'invalid-response': "#readResponse received an invalid response from the server."
+    }
+});
+
+Ext.data.DataWriter = function(config){
+    Ext.apply(this, config);
+};
+Ext.data.DataWriter.prototype = {
+
+    
+    writeAllFields : false,
+    
+    listful : false,    
+
+    
+    apply : function(params, baseParams, action, rs) {
+        var data    = [],
+        renderer    = action + 'Record';
+        
+        if (Ext.isArray(rs)) {
+            Ext.each(rs, function(rec){
+                data.push(this[renderer](rec));
+            }, this);
+        }
+        else if (rs instanceof Ext.data.Record) {
+            data = this[renderer](rs);
+        }
+        this.render(params, baseParams, data);
+    },
+
+    
+    render : Ext.emptyFn,
+
+    
+    updateRecord : Ext.emptyFn,
+
+    
+    createRecord : Ext.emptyFn,
+
+    
+    destroyRecord : Ext.emptyFn,
+
+    
+    toHash : function(rec, config) {
+        var map = rec.fields.map,
+            data = {},
+            raw = (this.writeAllFields === false && rec.phantom === false) ? rec.getChanges() : rec.data,
+            m;
+        Ext.iterate(raw, function(prop, value){
+            if((m = map[prop])){
+                data[m.mapping ? m.mapping : m.name] = value;
+            }
+        });
+        
+        
+        
+        if (rec.phantom) {
+            if (rec.fields.containsKey(this.meta.idProperty) && Ext.isEmpty(rec.data[this.meta.idProperty])) {
+                delete data[this.meta.idProperty];
+            }
+        } else {
+            data[this.meta.idProperty] = rec.id;
+        }
+        return data;
+    },
+
+    
+    toArray : function(data) {
+        var fields = [];
+        Ext.iterate(data, function(k, v) {fields.push({name: k, value: v});},this);
+        return fields;
+    }
+};
+Ext.data.DataProxy = function(conn){
+    
+    
+    conn = conn || {};
+
+    
+    
+    
+
+    this.api     = conn.api;
+    this.url     = conn.url;
+    this.restful = conn.restful;
+    this.listeners = conn.listeners;
+
+    
+    this.prettyUrls = conn.prettyUrls;
+
+    
+
+    this.addEvents(
+        
+        'exception',
+        
+        'beforeload',
+        
+        'load',
+        
+        'loadexception',
+        
+        'beforewrite',
+        
+        'write'
+    );
+    Ext.data.DataProxy.superclass.constructor.call(this);
+
+    
+    try {
+        Ext.data.Api.prepare(this);
+    } catch (e) {
+        if (e instanceof Ext.data.Api.Error) {
+            e.toConsole();
+        }
+    }
+    
+    Ext.data.DataProxy.relayEvents(this, ['beforewrite', 'write', 'exception']);
+};
+
+Ext.extend(Ext.data.DataProxy, Ext.util.Observable, {
+    
+    restful: false,
+
+    
+    setApi : function() {
+        if (arguments.length == 1) {
+            var valid = Ext.data.Api.isValid(arguments[0]);
+            if (valid === true) {
+                this.api = arguments[0];
+            }
+            else {
+                throw new Ext.data.Api.Error('invalid', valid);
+            }
+        }
+        else if (arguments.length == 2) {
+            if (!Ext.data.Api.isAction(arguments[0])) {
+                throw new Ext.data.Api.Error('invalid', arguments[0]);
+            }
+            this.api[arguments[0]] = arguments[1];
+        }
+        Ext.data.Api.prepare(this);
+    },
+
+    
+    isApiAction : function(action) {
+        return (this.api[action]) ? true : false;
+    },
+
+    
+    request : function(action, rs, params, reader, callback, scope, options) {
+        if (!this.api[action] && !this.load) {
+            throw new Ext.data.DataProxy.Error('action-undefined', action);
+        }
+        params = params || {};
+        if ((action === Ext.data.Api.actions.read) ? this.fireEvent("beforeload", this, params) : this.fireEvent("beforewrite", this, action, rs, params) !== false) {
+            this.doRequest.apply(this, arguments);
+        }
+        else {
+            callback.call(scope || this, null, options, false);
+        }
+    },
+
+
+    
+    load : null,
+
+    
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        
+        
+        
+        this.load(params, reader, callback, scope, options);
+    },
+
+    
+    onRead : Ext.emptyFn,
+    
+    onWrite : Ext.emptyFn,
+    
+    buildUrl : function(action, record) {
+        record = record || null;
+
+        
+        
+        
+        var url = (this.conn && this.conn.url) ? this.conn.url : (this.api[action]) ? this.api[action].url : this.url;
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', action);
+        }
+
+        
+        
+        
+        
+        
+        
+        var provides = null;
+        var m = url.match(/(.*)(\.json|\.xml|\.html)$/);
+        if (m) {
+            provides = m[2];    
+            url      = m[1];    
+        }
+        
+        if ((this.restful === true || this.prettyUrls === true) && record instanceof Ext.data.Record && !record.phantom) {
+            url += '/' + record.id;
+        }
+        return (provides === null) ? url : url + provides;
+    },
+
+    
+    destroy: function(){
+        this.purgeListeners();
+    }
+});
+
+
+
+Ext.apply(Ext.data.DataProxy, Ext.util.Observable.prototype);
+Ext.util.Observable.call(Ext.data.DataProxy);
+
+
+Ext.data.DataProxy.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataProxy'
+});
+Ext.apply(Ext.data.DataProxy.Error.prototype, {
+    lang: {
+        'action-undefined': "DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.",
+        'api-invalid': 'Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions.'
+    }
+});
+
+
+
+Ext.data.Request = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Request.prototype = {
+    
+    action : undefined,
+    
+    rs : undefined,
+    
+    params: undefined,
+    
+    callback : Ext.emptyFn,
+    
+    scope : undefined,
+    
+    reader : undefined
+};
+
+Ext.data.Response = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Response.prototype = {
+    
+    action: undefined,
+    
+    success : undefined,
+    
+    message : undefined,
+    
+    data: undefined,
+    
+    raw: undefined,
+    
+    records: undefined
+};
+
+Ext.data.ScriptTagProxy = function(config){
+    Ext.apply(this, config);
+
+    Ext.data.ScriptTagProxy.superclass.constructor.call(this, config);
+
+    this.head = document.getElementsByTagName("head")[0];
+
+    
+};
+
+Ext.data.ScriptTagProxy.TRANS_ID = 1000;
+
+Ext.extend(Ext.data.ScriptTagProxy, Ext.data.DataProxy, {
+    
+    
+    timeout : 30000,
+    
+    callbackParam : "callback",
+    
+    nocache : true,
+
+    
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        var p = Ext.urlEncode(Ext.apply(params, this.extraParams));
+
+        var url = this.buildUrl(action, rs);
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', url);
+        }
+        url = Ext.urlAppend(url, p);
+
+        if(this.nocache){
+            url = Ext.urlAppend(url, '_dc=' + (new Date().getTime()));
+        }
+        var transId = ++Ext.data.ScriptTagProxy.TRANS_ID;
+        var trans = {
+            id : transId,
+            action: action,
+            cb : "stcCallback"+transId,
+            scriptId : "stcScript"+transId,
+            params : params,
+            arg : arg,
+            url : url,
+            callback : callback,
+            scope : scope,
+            reader : reader
+        };
+        window[trans.cb] = this.createCallback(action, rs, trans);
+        url += String.format("&{0}={1}", this.callbackParam, trans.cb);
+        if(this.autoAbort !== false){
+            this.abort();
+        }
+
+        trans.timeoutId = this.handleFailure.defer(this.timeout, this, [trans]);
+
+        var script = document.createElement("script");
+        script.setAttribute("src", url);
+        script.setAttribute("type", "text/javascript");
+        script.setAttribute("id", trans.scriptId);
+        this.head.appendChild(script);
+
+        this.trans = trans;
+    },
+
+    
+    createCallback : function(action, rs, trans) {
+        var self = this;
+        return function(res) {
+            self.trans = false;
+            self.destroyTrans(trans, true);
+            if (action === Ext.data.Api.actions.read) {
+                self.onRead.call(self, action, trans, res);
+            } else {
+                self.onWrite.call(self, action, trans, res, rs);
+            }
+        };
+    },
+    
+    onRead : function(action, trans, res) {
+        var result;
+        try {
+            result = trans.reader.readRecords(res);
+        }catch(e){
+            
+            this.fireEvent("loadexception", this, trans, res, e);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, trans.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            
+            this.fireEvent('loadexception', this, trans, res);
+
+            this.fireEvent('exception', this, 'remote', action, trans, res, null);
+        } else {
+            this.fireEvent("load", this, res, trans.arg);
+        }
+        trans.callback.call(trans.scope||window, result, trans.arg, result.success);
+    },
+    
+    onWrite : function(action, trans, response, rs) {
+        var reader = trans.reader;
+        try {
+            
+            var res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        if(!res.success === true){
+            this.fireEvent('exception', this, 'remote', action, trans, res, rs);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        this.fireEvent("write", this, action, res.data, res, rs, trans.arg );
+        trans.callback.call(trans.scope||window, res.data, res, true);
+    },
+
+    
+    isLoading : function(){
+        return this.trans ? true : false;
+    },
+
+    
+    abort : function(){
+        if(this.isLoading()){
+            this.destroyTrans(this.trans);
+        }
+    },
+
+    
+    destroyTrans : function(trans, isLoaded){
+        this.head.removeChild(document.getElementById(trans.scriptId));
+        clearTimeout(trans.timeoutId);
+        if(isLoaded){
+            window[trans.cb] = undefined;
+            try{
+                delete window[trans.cb];
+            }catch(e){}
+        }else{
+            
+            window[trans.cb] = function(){
+                window[trans.cb] = undefined;
+                try{
+                    delete window[trans.cb];
+                }catch(e){}
+            };
+        }
+    },
+
+    
+    handleFailure : function(trans){
+        this.trans = false;
+        this.destroyTrans(trans, false);
+        if (trans.action === Ext.data.Api.actions.read) {
+            
+            this.fireEvent("loadexception", this, null, trans.arg);
+        }
+
+        this.fireEvent('exception', this, 'response', trans.action, {
+            response: null,
+            options: trans.arg
+        });
+        trans.callback.call(trans.scope||window, null, trans.arg, false);
+    },
+
+    
+    destroy: function(){
+        this.abort();
+        Ext.data.ScriptTagProxy.superclass.destroy.call(this);
+    }
+});
+Ext.data.HttpProxy = function(conn){
+    Ext.data.HttpProxy.superclass.constructor.call(this, conn);
+
+    
+    this.conn = conn;
+
+    
+    
+    
+    
+    this.conn.url = null;
+
+    this.useAjax = !conn || !conn.events;
+
+    
+    var actions = Ext.data.Api.actions;
+    this.activeRequest = {};
+    for (var verb in actions) {
+        this.activeRequest[actions[verb]] = undefined;
+    }
+};
+
+Ext.extend(Ext.data.HttpProxy, Ext.data.DataProxy, {
+    
+    getConnection : function() {
+        return this.useAjax ? Ext.Ajax : this.conn;
+    },
+
+    
+    setUrl : function(url, makePermanent) {
+        this.conn.url = url;
+        if (makePermanent === true) {
+            this.url = url;
+            this.api = null;
+            Ext.data.Api.prepare(this);
+        }
+    },
+
+    
+    doRequest : function(action, rs, params, reader, cb, scope, arg) {
+        var  o = {
+            method: (this.api[action]) ? this.api[action]['method'] : undefined,
+            request: {
+                callback : cb,
+                scope : scope,
+                arg : arg
+            },
+            reader: reader,
+            callback : this.createCallback(action, rs),
+            scope: this
+        };
+
+        
+        
+        if (params.jsonData) {
+            o.jsonData = params.jsonData;
+        } else if (params.xmlData) {
+            o.xmlData = params.xmlData;
+        } else {
+            o.params = params || {};
+        }
+        
+        
+        
+        this.conn.url = this.buildUrl(action, rs);
+
+        if(this.useAjax){
+
+            Ext.applyIf(o, this.conn);
+
+            
+            if (this.activeRequest[action]) {
+                
+                
+                
+                
+                
+            }
+            this.activeRequest[action] = Ext.Ajax.request(o);
+        }else{
+            this.conn.request(o);
+        }
+        
+        this.conn.url = null;
+    },
+
+    
+    createCallback : function(action, rs) {
+        return function(o, success, response) {
+            this.activeRequest[action] = undefined;
+            if (!success) {
+                if (action === Ext.data.Api.actions.read) {
+                    
+                    
+                    this.fireEvent('loadexception', this, o, response);
+                }
+                this.fireEvent('exception', this, 'response', action, o, response);
+                o.request.callback.call(o.request.scope, null, o.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                this.onRead(action, o, response);
+            } else {
+                this.onWrite(action, o, response, rs);
+            }
+        };
+    },
+
+    
+    onRead : function(action, o, response) {
+        var result;
+        try {
+            result = o.reader.read(response);
+        }catch(e){
+            
+            
+            this.fireEvent('loadexception', this, o, response, e);
+
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            
+            
+            this.fireEvent('loadexception', this, o, response);
+
+            
+            var res = o.reader.readResponse(action, response);
+            this.fireEvent('exception', this, 'remote', action, o, res, null);
+        }
+        else {
+            this.fireEvent('load', this, o, o.request.arg);
+        }
+        
+        
+        
+        o.request.callback.call(o.request.scope, result, o.request.arg, result.success);
+    },
+    
+    onWrite : function(action, o, response, rs) {
+        var reader = o.reader;
+        var res;
+        try {
+            res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (res.success === true) {
+            this.fireEvent('write', this, action, res.data, res, rs, o.request.arg);
+        } else {
+            this.fireEvent('exception', this, 'remote', action, o, res, rs);
+        }
+        
+        
+        
+        o.request.callback.call(o.request.scope, res.data, res, res.success);
+    },
+
+    
+    destroy: function(){
+        if(!this.useAjax){
+            this.conn.abort();
+        }else if(this.activeRequest){
+            var actions = Ext.data.Api.actions;
+            for (var verb in actions) {
+                if(this.activeRequest[actions[verb]]){
+                    Ext.Ajax.abort(this.activeRequest[actions[verb]]);
+                }
+            }
+        }
+        Ext.data.HttpProxy.superclass.destroy.call(this);
+    }
+});
+Ext.data.MemoryProxy = function(data){
+    
+    var api = {};
+    api[Ext.data.Api.actions.read] = true;
+    Ext.data.MemoryProxy.superclass.constructor.call(this, {
+        api: api
+    });
+    this.data = data;
+};
+
+Ext.extend(Ext.data.MemoryProxy, Ext.data.DataProxy, {
+    
+
+       
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        
+        params = params || {};
+        var result;
+        try {
+            result = reader.readRecords(this.data);
+        }catch(e){
+            
+            this.fireEvent("loadexception", this, null, arg, e);
+
+            this.fireEvent('exception', this, 'response', action, arg, null, e);
+            callback.call(scope, null, arg, false);
+            return;
+        }
+        callback.call(scope, result, arg, true);
+    }
+});
+Ext.data.Types = new function(){
+    var st = Ext.data.SortTypes;
+    Ext.apply(this, {
+        
+        stripRe: /[\$,%]/g,
+        
+        
+        AUTO: {
+            convert: function(v){ return v; },
+            sortType: st.none,
+            type: 'auto'
+        },
+
+        
+        STRING: {
+            convert: function(v){ return (v === undefined || v === null) ? '' : String(v); },
+            sortType: st.asUCString,
+            type: 'string'
+        },
+
+        
+        INT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseInt(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'int'
+        },
+        
+        
+        FLOAT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseFloat(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'float'
+        },
+        
+        
+        BOOL: {
+            convert: function(v){ return v === true || v === 'true' || v == 1; },
+            sortType: st.none,
+            type: 'bool'
+        },
+        
+        
+        DATE: {
+            convert: function(v){
+                var df = this.dateFormat;
+                if(!v){
+                    return null;
+                }
+                if(Ext.isDate(v)){
+                    return v;
+                }
+                if(df){
+                    if(df == 'timestamp'){
+                        return new Date(v*1000);
+                    }
+                    if(df == 'time'){
+                        return new Date(parseInt(v, 10));
+                    }
+                    return Date.parseDate(v, df);
+                }
+                var parsed = Date.parse(v);
+                return parsed ? new Date(parsed) : null;
+            },
+            sortType: st.asDate,
+            type: 'date'
+        }
+    });
+    
+    Ext.apply(this, {
+        
+        BOOLEAN: this.BOOL,
+        
+        INTEGER: this.INT,
+        
+        NUMBER: this.FLOAT    
+    });
+};
+Ext.data.JsonWriter = Ext.extend(Ext.data.DataWriter, {
+    
+    encode : true,
+    
+    encodeDelete: false,
+    
+    constructor : function(config){
+        Ext.data.JsonWriter.superclass.constructor.call(this, config);    
+    },
+
+    
+    render : function(params, baseParams, data) {
+        if (this.encode === true) {
+            
+            Ext.apply(params, baseParams);
+            params[this.meta.root] = Ext.encode(data);
+        } else {
+            
+            var jdata = Ext.apply({}, baseParams);
+            jdata[this.meta.root] = data;
+            params.jsonData = jdata;
+        }
+    },
+    
+    createRecord : function(rec) {
+       return this.toHash(rec);
+    },
+    
+    updateRecord : function(rec) {
+        return this.toHash(rec);
+
+    },
+    
+    destroyRecord : function(rec){
+        if(this.encodeDelete){
+            var data = {};
+            data[this.meta.idProperty] = rec.id;
+            return data;
+        }else{
+            return rec.id;
+        }
+    }
+});
+Ext.data.JsonReader = function(meta, recordType){
+    meta = meta || {};
+    
+    
+    
+    
+    Ext.applyIf(meta, {
+        idProperty: 'id',
+        successProperty: 'success',
+        totalProperty: 'total'
+    });
+
+    Ext.data.JsonReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.JsonReader, Ext.data.DataReader, {
+    
+    
+    read : function(response){
+        var json = response.responseText;
+        var o = Ext.decode(json);
+        if(!o) {
+            throw {message: 'JsonReader.read: Json object not found'};
+        }
+        return this.readRecords(o);
+    },
+
+    
+    
+    readResponse : function(action, response) {
+        var o = (response.responseText !== undefined) ? Ext.decode(response.responseText) : response;
+        if(!o) {
+            throw new Ext.data.JsonReader.Error('response');
+        }
+
+        var root = this.getRoot(o),
+            success = this.getSuccess(o);
+        if (success && action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(root);
+            if (def && Ext.isEmpty(root)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+
+        
+        var res = new Ext.data.Response({
+            action: action,
+            success: success,
+            data: (root) ? this.extractData(root, false) : [],
+            message: this.getMessage(o),
+            raw: o
+        });
+
+        
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.JsonReader.Error('successProperty-response', this.meta.successProperty);
+        }
+        return res;
+    },
+
+    
+    readRecords : function(o){
+        
+        this.jsonData = o;
+        if(o.metaData){
+            this.onMetaChange(o.metaData);
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length, v;
+
+        var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
+        if(s.totalProperty){
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)){
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        
+        return {
+            success : success,
+            records : this.extractData(root, true), 
+            totalRecords : totalRecords
+        };
+    },
+
+    
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = s.root ? this.createAccessor(s.root) : function(p){return p;};
+        if (s.id || s.idProperty) {
+            var g = this.createAccessor(s.id || s.idProperty);
+            this.getId = function(rec) {
+                var r = g(rec);
+                return (r === undefined || r === '') ? null : r;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    
+    simpleAccess : function(obj, subsc) {
+        return obj[subsc];
+    },
+
+    
+    createAccessor : function(){
+        var re = /[\[\.]/;
+        return function(expr) {
+            if(Ext.isEmpty(expr)){
+                return Ext.emptyFn;
+            }
+            if(Ext.isFunction(expr)){
+                return expr;
+            }
+            var i = String(expr).search(re);
+            if(i >= 0){
+                return new Function('obj', 'return obj' + (i > 0 ? '.' : '') + expr);
+            }
+            return function(obj){
+                return obj[expr];
+            };
+
+        };
+    }(),
+
+    
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
+
+
+Ext.data.JsonReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name : 'Ext.data.JsonReader'
+});
+Ext.apply(Ext.data.JsonReader.Error.prototype, {
+    lang: {
+        'response': 'An error occurred while json-decoding your server response',
+        'successProperty-response': 'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',
+        'root-undefined-config': 'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',
+        'idProperty-undefined' : 'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',
+        'root-empty': 'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'
+    }
+});
+
+Ext.data.ArrayReader = Ext.extend(Ext.data.JsonReader, {
+    
+    
+    
+    
+    readRecords : function(o){
+        this.arrayData = o;
+        var s = this.meta,
+            sid = s ? Ext.num(s.idIndex, s.id) : null,
+            recordType = this.recordType,
+            fields = recordType.prototype.fields,
+            records = [],
+            success = true,
+            v;
+
+        var root = this.getRoot(o);
+
+        for(var i = 0, len = root.length; i < len; i++) {
+            var n = root[i],
+                values = {},
+                id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null);
+            for(var j = 0, jlen = fields.length; j < jlen; j++) {
+                var f = fields.items[j],
+                    k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j;
+                v = n[k] !== undefined ? n[k] : f.defaultValue;
+                v = f.convert(v, n);
+                values[f.name] = v;
+            }
+            var record = new recordType(values, id);
+            record.json = n;
+            records[records.length] = record;
+        }
+
+        var totalRecords = records.length;
+
+        if(s.totalProperty) {
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)) {
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords
+        };
+    }
+});
+Ext.data.ArrayStore = Ext.extend(Ext.data.Store, {
+    
+    constructor: function(config){
+        Ext.data.ArrayStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.ArrayReader(config)
+        }));
+    },
+
+    loadData : function(data, append){
+        if(this.expandData === true){
+            var r = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                r[r.length] = [data[i]];
+            }
+            data = r;
+        }
+        Ext.data.ArrayStore.superclass.loadData.call(this, data, append);
+    }
+});
+Ext.reg('arraystore', Ext.data.ArrayStore);
+
+
+Ext.data.SimpleStore = Ext.data.ArrayStore;
+Ext.reg('simplestore', Ext.data.SimpleStore);
+Ext.data.JsonStore = Ext.extend(Ext.data.Store, {
+    
+    constructor: function(config){
+        Ext.data.JsonStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.JsonReader(config)
+        }));
+    }
+});
+Ext.reg('jsonstore', Ext.data.JsonStore);
+Ext.data.XmlWriter = function(params) {
+    Ext.data.XmlWriter.superclass.constructor.apply(this, arguments);
+    
+    this.tpl = (typeof(this.tpl) === 'string') ? new Ext.XTemplate(this.tpl).compile() : this.tpl.compile();
+};
+Ext.extend(Ext.data.XmlWriter, Ext.data.DataWriter, {
+    
+    documentRoot: 'xrequest',
+    
+    forceDocumentRoot: false,
+    
+    root: 'records',
+    
+    xmlVersion : '1.0',
+    
+    xmlEncoding: 'ISO-8859-15',
+    
+    
+    tpl: '<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',
+
+
+    
+    render : function(params, baseParams, data) {
+        baseParams = this.toArray(baseParams);
+        params.xmlData = this.tpl.applyTemplate({
+            version: this.xmlVersion,
+            encoding: this.xmlEncoding,
+            documentRoot: (baseParams.length > 0 || this.forceDocumentRoot === true) ? this.documentRoot : false,
+            record: this.meta.record,
+            root: this.root,
+            baseParams: baseParams,
+            records: (Ext.isArray(data[0])) ? data : [data]
+        });
+    },
+
+    
+    createRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+    },
+
+    
+    updateRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+
+    },
+    
+    destroyRecord : function(rec) {
+        var data = {};
+        data[this.meta.idProperty] = rec.id;
+        return this.toArray(data);
+    }
+});
+
+Ext.data.XmlReader = function(meta, recordType){
+    meta = meta || {};
+
+    
+    Ext.applyIf(meta, {
+        idProperty: meta.idProperty || meta.idPath || meta.id,
+        successProperty: meta.successProperty || meta.success
+    });
+
+    Ext.data.XmlReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.XmlReader, Ext.data.DataReader, {
+    
+    read : function(response){
+        var doc = response.responseXML;
+        if(!doc) {
+            throw {message: "XmlReader.read: XML Document not available"};
+        }
+        return this.readRecords(doc);
+    },
+
+    
+    readRecords : function(doc){
+        
+        this.xmlData = doc;
+
+        var root    = doc.documentElement || doc,
+            q       = Ext.DomQuery,
+            totalRecords = 0,
+            success = true;
+
+        if(this.meta.totalProperty){
+            totalRecords = this.getTotal(root, 0);
+        }
+        if(this.meta.successProperty){
+            success = this.getSuccess(root);
+        }
+
+        var records = this.extractData(q.select(this.meta.record, root), true); 
+
+        
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords || records.length
+        };
+    },
+
+    
+    readResponse : function(action, response) {
+        var q = Ext.DomQuery,
+            doc = response.responseXML,
+            root = doc.documentElement || doc;
+
+        
+        var res = new Ext.data.Response({
+            action: action,
+            success : this.getSuccess(root),
+            message: this.getMessage(root),
+            data: this.extractData(q.select(this.meta.record, root) || q.select(this.meta.root, root), false),
+            raw: doc
+        });
+
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.DataReader.Error('successProperty-response', this.meta.successProperty);
+        }
+
+        
+        if (action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(res.data);
+            if (def && Ext.isEmpty(res.data)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+        return res;
+    },
+
+    getSuccess : function() {
+        return true;
+    },
+
+    
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s       = this.meta,
+            Record  = this.recordType,
+            f       = Record.prototype.fields,
+            fi      = f.items,
+            fl      = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = function(res) {
+            return (!Ext.isEmpty(res[this.meta.record])) ? res[this.meta.record] : res[this.meta.root];
+        };
+        if (s.idPath || s.idProperty) {
+            var g = this.createAccessor(s.idPath || s.idProperty);
+            this.getId = function(rec) {
+                var id = g(rec) || rec.id;
+                return (id === undefined || id === '') ? null : id;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    
+    createAccessor : function(){
+        var q = Ext.DomQuery;
+        return function(key) {
+            if (Ext.isFunction(key)) {
+                return key;
+            }
+            switch(key) {
+                case this.meta.totalProperty:
+                    return function(root, def){
+                        return q.selectNumber(key, root, def);
+                    };
+                    break;
+                case this.meta.successProperty:
+                    return function(root, def) {
+                        var sv = q.selectValue(key, root, true);
+                        var success = sv !== false && sv !== 'false';
+                        return success;
+                    };
+                    break;
+                default:
+                    return function(root, def) {
+                        return q.selectValue(key, root, def);
+                    };
+                    break;
+            }
+        };
+    }(),
+
+    
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
+Ext.data.XmlStore = Ext.extend(Ext.data.Store, {
+    
+    constructor: function(config){
+        Ext.data.XmlStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.XmlReader(config)
+        }));
+    }
+});
+Ext.reg('xmlstore', Ext.data.XmlStore);
+Ext.data.GroupingStore = Ext.extend(Ext.data.Store, {
+
+    
+    constructor: function(config) {
+        config = config || {};
+
+        
+        
+        
+        
+        this.hasMultiSort  = true;
+        this.multiSortInfo = this.multiSortInfo || {sorters: []};
+
+        var sorters    = this.multiSortInfo.sorters,
+            groupField = config.groupField || this.groupField,
+            sortInfo   = config.sortInfo || this.sortInfo,
+            groupDir   = config.groupDir || this.groupDir;
+
+        
+        if(groupField){
+            sorters.push({
+                field    : groupField,
+                direction: groupDir
+            });
+        }
+
+        
+        if (sortInfo) {
+            sorters.push(sortInfo);
+        }
+
+        Ext.data.GroupingStore.superclass.constructor.call(this, config);
+
+        this.addEvents(
+          
+          'groupchange'
+        );
+
+        this.applyGroupField();
+    },
+
+    
+    
+    remoteGroup : false,
+    
+    groupOnSort:false,
+
+    
+    groupDir : 'ASC',
+
+    
+    clearGrouping : function(){
+        this.groupField = false;
+
+        if(this.remoteGroup){
+            if(this.baseParams){
+                delete this.baseParams.groupBy;
+                delete this.baseParams.groupDir;
+            }
+            var lo = this.lastOptions;
+            if(lo && lo.params){
+                delete lo.params.groupBy;
+                delete lo.params.groupDir;
+            }
+
+            this.reload();
+        }else{
+            this.sort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    
+    groupBy : function(field, forceRegroup, direction) {
+        direction = direction ? (String(direction).toUpperCase() == 'DESC' ? 'DESC' : 'ASC') : this.groupDir;
+
+        if (this.groupField == field && this.groupDir == direction && !forceRegroup) {
+            return; 
+        }
+
+        
+        
+        var sorters = this.multiSortInfo.sorters;
+        if (sorters.length > 0 && sorters[0].field == this.groupField) {
+            sorters.shift();
+        }
+
+        this.groupField = field;
+        this.groupDir = direction;
+        this.applyGroupField();
+
+        var fireGroupEvent = function() {
+            this.fireEvent('groupchange', this, this.getGroupState());
+        };
+
+        if (this.groupOnSort) {
+            this.sort(field, direction);
+            fireGroupEvent.call(this);
+            return;
+        }
+
+        if (this.remoteGroup) {
+            this.on('load', fireGroupEvent, this, {single: true});
+            this.reload();
+        } else {
+            this.sort(sorters);
+            fireGroupEvent.call(this);
+        }
+    },
+
+    
+    
+    sort : function(fieldName, dir) {
+        if (this.remoteSort) {
+            return Ext.data.GroupingStore.superclass.sort.call(this, fieldName, dir);
+        }
+
+        var sorters = [];
+
+        
+        if (Ext.isArray(arguments[0])) {
+            sorters = arguments[0];
+        } else if (fieldName == undefined) {
+            
+            
+            sorters = this.sortInfo ? [this.sortInfo] : [];
+        } else {
+            
+            
+            var field = this.fields.get(fieldName);
+            if (!field) return false;
+
+            var name       = field.name,
+                sortInfo   = this.sortInfo || null,
+                sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+            if (!dir) {
+                if (sortInfo && sortInfo.field == name) { 
+                    dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+                } else {
+                    dir = field.sortDir;
+                }
+            }
+
+            this.sortToggle[name] = dir;
+            this.sortInfo = {field: name, direction: dir};
+
+            sorters = [this.sortInfo];
+        }
+
+        
+        if (this.groupField) {
+            sorters.unshift({direction: this.groupDir, field: this.groupField});
+        }
+
+        return this.multiSort.call(this, sorters, dir);
+    },
+
+    
+    applyGroupField: function(){
+        if (this.remoteGroup) {
+            if(!this.baseParams){
+                this.baseParams = {};
+            }
+
+            Ext.apply(this.baseParams, {
+                groupBy : this.groupField,
+                groupDir: this.groupDir
+            });
+
+            var lo = this.lastOptions;
+            if (lo && lo.params) {
+                lo.params.groupDir = this.groupDir;
+
+                
+                delete lo.params.groupBy;
+            }
+        }
+    },
+
+    
+    applyGrouping : function(alwaysFireChange){
+        if(this.groupField !== false){
+            this.groupBy(this.groupField, true, this.groupDir);
+            return true;
+        }else{
+            if(alwaysFireChange === true){
+                this.fireEvent('datachanged', this);
+            }
+            return false;
+        }
+    },
+
+    
+    getGroupState : function(){
+        return this.groupOnSort && this.groupField !== false ?
+               (this.sortInfo ? this.sortInfo.field : undefined) : this.groupField;
+    }
+});
+Ext.reg('groupingstore', Ext.data.GroupingStore);
+
+Ext.data.DirectProxy = function(config){
+    Ext.apply(this, config);
+    if(typeof this.paramOrder == 'string'){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+    Ext.data.DirectProxy.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.data.DirectProxy, Ext.data.DataProxy, {
+    
+    paramOrder: undefined,
+
+    
+    paramsAsHash: true,
+
+    
+    directFn : undefined,
+
+    
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        var args = [],
+            directFn = this.api[action] || this.directFn;
+
+        switch (action) {
+            case Ext.data.Api.actions.create:
+                args.push(params.jsonData);		
+                break;
+            case Ext.data.Api.actions.read:
+                
+                if(directFn.directCfg.method.len > 0){
+                    if(this.paramOrder){
+                        for(var i = 0, len = this.paramOrder.length; i < len; i++){
+                            args.push(params[this.paramOrder[i]]);
+                        }
+                    }else if(this.paramsAsHash){
+                        args.push(params);
+                    }
+                }
+                break;
+            case Ext.data.Api.actions.update:
+                args.push(params.jsonData);        
+                break;
+            case Ext.data.Api.actions.destroy:
+                args.push(params.jsonData);        
+                break;
+        }
+
+        var trans = {
+            params : params || {},
+            request: {
+                callback : callback,
+                scope : scope,
+                arg : options
+            },
+            reader: reader
+        };
+
+        args.push(this.createCallback(action, rs, trans), this);
+        directFn.apply(window, args);
+    },
+
+    
+    createCallback : function(action, rs, trans) {
+        var me = this;
+        return function(result, res) {
+            if (!res.status) {
+                
+                if (action === Ext.data.Api.actions.read) {
+                    me.fireEvent("loadexception", me, trans, res, null);
+                }
+                me.fireEvent('exception', me, 'remote', action, trans, res, null);
+                trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                me.onRead(action, trans, result, res);
+            } else {
+                me.onWrite(action, trans, result, res, rs);
+            }
+        };
+    },
+
+    
+    onRead : function(action, trans, result, res) {
+        var records;
+        try {
+            records = trans.reader.readRecords(result);
+        }
+        catch (ex) {
+            
+            this.fireEvent("loadexception", this, trans, res, ex);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, ex);
+            trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+            return;
+        }
+        this.fireEvent("load", this, res, trans.request.arg);
+        trans.request.callback.call(trans.request.scope, records, trans.request.arg, true);
+    },
+    
+    onWrite : function(action, trans, result, res, rs) {
+        var data = trans.reader.extractData(trans.reader.getRoot(result), false);
+        var success = trans.reader.getSuccess(result);
+        success = (success !== false);
+        if (success){
+            this.fireEvent("write", this, action, data, res, rs, trans.request.arg);
+        }else{
+            this.fireEvent('exception', this, 'remote', action, trans, result, rs);
+        }
+        trans.request.callback.call(trans.request.scope, data, res, success);
+    }
+});
+
+Ext.data.DirectStore = Ext.extend(Ext.data.Store, {
+    constructor : function(config){
+        
+        var c = Ext.apply({}, {
+            batchTransactions: false
+        }, config);
+        Ext.data.DirectStore.superclass.constructor.call(this, Ext.apply(c, {
+            proxy: Ext.isDefined(c.proxy) ? c.proxy : new Ext.data.DirectProxy(Ext.copyTo({}, c, 'paramOrder,paramsAsHash,directFn,api')),
+            reader: (!Ext.isDefined(c.reader) && c.fields) ? new Ext.data.JsonReader(Ext.copyTo({}, c, 'totalProperty,root,idProperty'), c.fields) : c.reader
+        }));
+    }
+});
+Ext.reg('directstore', Ext.data.DirectStore);
+
+Ext.Direct = Ext.extend(Ext.util.Observable, {
+    
+
+    
+    exceptions: {
+        TRANSPORT: 'xhr',
+        PARSE: 'parse',
+        LOGIN: 'login',
+        SERVER: 'exception'
+    },
+
+    
+    constructor: function(){
+        this.addEvents(
+            
+            'event',
+            
+            'exception'
+        );
+        this.transactions = {};
+        this.providers = {};
+    },
+
+    
+    addProvider : function(provider){
+        var a = arguments;
+        if(a.length > 1){
+            for(var i = 0, len = a.length; i < len; i++){
+                this.addProvider(a[i]);
+            }
+            return;
+        }
+
+        
+        if(!provider.events){
+            provider = new Ext.Direct.PROVIDERS[provider.type](provider);
+        }
+        provider.id = provider.id || Ext.id();
+        this.providers[provider.id] = provider;
+
+        provider.on('data', this.onProviderData, this);
+        provider.on('exception', this.onProviderException, this);
+
+
+        if(!provider.isConnected()){
+            provider.connect();
+        }
+
+        return provider;
+    },
+
+    
+    getProvider : function(id){
+        return this.providers[id];
+    },
+
+    removeProvider : function(id){
+        var provider = id.id ? id : this.providers[id];
+        provider.un('data', this.onProviderData, this);
+        provider.un('exception', this.onProviderException, this);
+        delete this.providers[provider.id];
+        return provider;
+    },
+
+    addTransaction: function(t){
+        this.transactions[t.tid] = t;
+        return t;
+    },
+
+    removeTransaction: function(t){
+        delete this.transactions[t.tid || t];
+        return t;
+    },
+
+    getTransaction: function(tid){
+        return this.transactions[tid.tid || tid];
+    },
+
+    onProviderData : function(provider, e){
+        if(Ext.isArray(e)){
+            for(var i = 0, len = e.length; i < len; i++){
+                this.onProviderData(provider, e[i]);
+            }
+            return;
+        }
+        if(e.name && e.name != 'event' && e.name != 'exception'){
+            this.fireEvent(e.name, e);
+        }else if(e.type == 'exception'){
+            this.fireEvent('exception', e);
+        }
+        this.fireEvent('event', e, provider);
+    },
+
+    createEvent : function(response, extraProps){
+        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));
+    }
+});
+
+Ext.Direct = new Ext.Direct();
+
+Ext.Direct.TID = 1;
+Ext.Direct.PROVIDERS = {};
+Ext.Direct.Transaction = function(config){
+    Ext.apply(this, config);
+    this.tid = ++Ext.Direct.TID;
+    this.retryCount = 0;
+};
+Ext.Direct.Transaction.prototype = {
+    send: function(){
+        this.provider.queueTransaction(this);
+    },
+
+    retry: function(){
+        this.retryCount++;
+        this.send();
+    },
+
+    getProvider: function(){
+        return this.provider;
+    }
+};Ext.Direct.Event = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.Direct.Event.prototype = {
+    status: true,
+    getData: function(){
+        return this.data;
+    }
+};
+
+Ext.Direct.RemotingEvent = Ext.extend(Ext.Direct.Event, {
+    type: 'rpc',
+    getTransaction: function(){
+        return this.transaction || Ext.Direct.getTransaction(this.tid);
+    }
+});
+
+Ext.Direct.ExceptionEvent = Ext.extend(Ext.Direct.RemotingEvent, {
+    status: false,
+    type: 'exception'
+});
+
+Ext.Direct.eventTypes = {
+    'rpc':  Ext.Direct.RemotingEvent,
+    'event':  Ext.Direct.Event,
+    'exception':  Ext.Direct.ExceptionEvent
+};
+
+Ext.direct.Provider = Ext.extend(Ext.util.Observable, {    
+    
+        
+        
+    priority: 1,
+
+        
+ 
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+                        
+            'connect',
+                        
+            'disconnect',
+                        
+            'data',
+                                    
+            'exception'
+        );
+        Ext.direct.Provider.superclass.constructor.call(this, config);
+    },
+
+    
+    isConnected: function(){
+        return false;
+    },
+
+    
+    connect: Ext.emptyFn,
+    
+    
+    disconnect: Ext.emptyFn
+});
+
+Ext.direct.JsonProvider = Ext.extend(Ext.direct.Provider, {
+    parseResponse: function(xhr){
+        if(!Ext.isEmpty(xhr.responseText)){
+            if(typeof xhr.responseText == 'object'){
+                return xhr.responseText;
+            }
+            return Ext.decode(xhr.responseText);
+        }
+        return null;
+    },
+
+    getEvents: function(xhr){
+        var data = null;
+        try{
+            data = this.parseResponse(xhr);
+        }catch(e){
+            var event = new Ext.Direct.ExceptionEvent({
+                data: e,
+                xhr: xhr,
+                code: Ext.Direct.exceptions.PARSE,
+                message: 'Error parsing json response: \n\n ' + data
+            });
+            return [event];
+        }
+        var events = [];
+        if(Ext.isArray(data)){
+            for(var i = 0, len = data.length; i < len; i++){
+                events.push(Ext.Direct.createEvent(data[i]));
+            }
+        }else{
+            events.push(Ext.Direct.createEvent(data));
+        }
+        return events;
+    }
+});
+Ext.direct.PollingProvider = Ext.extend(Ext.direct.JsonProvider, {
+    
+    
+    priority: 3,
+    
+    
+    interval: 3000,
+
+    
+    
+    
+
+    
+    constructor : function(config){
+        Ext.direct.PollingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            
+            'beforepoll',            
+            
+            'poll'
+        );
+    },
+
+    
+    isConnected: function(){
+        return !!this.pollTask;
+    },
+
+    
+    connect: function(){
+        if(this.url && !this.pollTask){
+            this.pollTask = Ext.TaskMgr.start({
+                run: function(){
+                    if(this.fireEvent('beforepoll', this) !== false){
+                        if(typeof this.url == 'function'){
+                            this.url(this.baseParams);
+                        }else{
+                            Ext.Ajax.request({
+                                url: this.url,
+                                callback: this.onData,
+                                scope: this,
+                                params: this.baseParams
+                            });
+                        }
+                    }
+                },
+                interval: this.interval,
+                scope: this
+            });
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing PollingProvider, no url configured.';
+        }
+    },
+
+    
+    disconnect: function(){
+        if(this.pollTask){
+            Ext.TaskMgr.stop(this.pollTask);
+            delete this.pollTask;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i];
+                this.fireEvent('data', this, e);
+            }
+        }else{
+            var e = new Ext.Direct.ExceptionEvent({
+                data: e,
+                code: Ext.Direct.exceptions.TRANSPORT,
+                message: 'Unable to connect to the server.',
+                xhr: xhr
+            });
+            this.fireEvent('data', this, e);
+        }
+    }
+});
+
+Ext.Direct.PROVIDERS['polling'] = Ext.direct.PollingProvider;
+Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, {       
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    enableBuffer: 10,
+    
+    
+    maxRetries: 1,
+    
+    
+    timeout: undefined,
+
+    constructor : function(config){
+        Ext.direct.RemotingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+                        
+            'beforecall',            
+                        
+            'call'
+        );
+        this.namespace = (Ext.isString(this.namespace)) ? Ext.ns(this.namespace) : this.namespace || window;
+        this.transactions = {};
+        this.callBuffer = [];
+    },
+
+    
+    initAPI : function(){
+        var o = this.actions;
+        for(var c in o){
+            var cls = this.namespace[c] || (this.namespace[c] = {}),
+                ms = o[c];
+            for(var i = 0, len = ms.length; i < len; i++){
+                var m = ms[i];
+                cls[m.name] = this.createMethod(c, m);
+            }
+        }
+    },
+
+    
+    isConnected: function(){
+        return !!this.connected;
+    },
+
+    connect: function(){
+        if(this.url){
+            this.initAPI();
+            this.connected = true;
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing RemotingProvider, no url configured.';
+        }
+    },
+
+    disconnect: function(){
+        if(this.connected){
+            this.connected = false;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i],
+                    t = this.getTransaction(e);
+                this.fireEvent('data', this, e);
+                if(t){
+                    this.doCallback(t, e, true);
+                    Ext.Direct.removeTransaction(t);
+                }
+            }
+        }else{
+            var ts = [].concat(opt.ts);
+            for(var i = 0, len = ts.length; i < len; i++){
+                var t = this.getTransaction(ts[i]);
+                if(t && t.retryCount < this.maxRetries){
+                    t.retry();
+                }else{
+                    var e = new Ext.Direct.ExceptionEvent({
+                        data: e,
+                        transaction: t,
+                        code: Ext.Direct.exceptions.TRANSPORT,
+                        message: 'Unable to connect to the server.',
+                        xhr: xhr
+                    });
+                    this.fireEvent('data', this, e);
+                    if(t){
+                        this.doCallback(t, e, false);
+                        Ext.Direct.removeTransaction(t);
+                    }
+                }
+            }
+        }
+    },
+
+    getCallData: function(t){
+        return {
+            action: t.action,
+            method: t.method,
+            data: t.data,
+            type: 'rpc',
+            tid: t.tid
+        };
+    },
+
+    doSend : function(data){
+        var o = {
+            url: this.url,
+            callback: this.onData,
+            scope: this,
+            ts: data,
+            timeout: this.timeout
+        }, callData;
+
+        if(Ext.isArray(data)){
+            callData = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                callData.push(this.getCallData(data[i]));
+            }
+        }else{
+            callData = this.getCallData(data);
+        }
+
+        if(this.enableUrlEncode){
+            var params = {};
+            params[Ext.isString(this.enableUrlEncode) ? this.enableUrlEncode : 'data'] = Ext.encode(callData);
+            o.params = params;
+        }else{
+            o.jsonData = callData;
+        }
+        Ext.Ajax.request(o);
+    },
+
+    combineAndSend : function(){
+        var len = this.callBuffer.length;
+        if(len > 0){
+            this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer);
+            this.callBuffer = [];
+        }
+    },
+
+    queueTransaction: function(t){
+        if(t.form){
+            this.processForm(t);
+            return;
+        }
+        this.callBuffer.push(t);
+        if(this.enableBuffer){
+            if(!this.callTask){
+                this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this);
+            }
+            this.callTask.delay(Ext.isNumber(this.enableBuffer) ? this.enableBuffer : 10);
+        }else{
+            this.combineAndSend();
+        }
+    },
+
+    doCall : function(c, m, args){
+        var data = null, hs = args[m.len], scope = args[m.len+1];
+
+        if(m.len !== 0){
+            data = args.slice(0, m.len);
+        }
+
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            args: args,
+            action: c,
+            method: m.name,
+            data: data,
+            cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            this.queueTransaction(t);
+            this.fireEvent('call', this, t, m);
+        }
+    },
+
+    doForm : function(c, m, form, callback, scope){
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            action: c,
+            method: m.name,
+            args:[form, callback, scope],
+            cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback,
+            isForm: true
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data',
+                params = {
+                    extTID: t.tid,
+                    extAction: c,
+                    extMethod: m.name,
+                    extType: 'rpc',
+                    extUpload: String(isUpload)
+                };
+            
+            
+            
+            Ext.apply(t, {
+                form: Ext.getDom(form),
+                isUpload: isUpload,
+                params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params
+            });
+            this.fireEvent('call', this, t, m);
+            this.processForm(t);
+        }
+    },
+    
+    processForm: function(t){
+        Ext.Ajax.request({
+            url: this.url,
+            params: t.params,
+            callback: this.onData,
+            scope: this,
+            form: t.form,
+            isUpload: t.isUpload,
+            ts: t
+        });
+    },
+
+    createMethod : function(c, m){
+        var f;
+        if(!m.formHandler){
+            f = function(){
+                this.doCall(c, m, Array.prototype.slice.call(arguments, 0));
+            }.createDelegate(this);
+        }else{
+            f = function(form, callback, scope){
+                this.doForm(c, m, form, callback, scope);
+            }.createDelegate(this);
+        }
+        f.directCfg = {
+            action: c,
+            method: m
+        };
+        return f;
+    },
+
+    getTransaction: function(opt){
+        return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null;
+    },
+
+    doCallback: function(t, e){
+        var fn = e.status ? 'success' : 'failure';
+        if(t && t.cb){
+            var hs = t.cb,
+                result = Ext.isDefined(e.result) ? e.result : e.data;
+            if(Ext.isFunction(hs)){
+                hs(result, e);
+            } else{
+                Ext.callback(hs[fn], hs.scope, [result, e]);
+                Ext.callback(hs.callback, hs.scope, [result, e]);
+            }
+        }
+    }
+});
+Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;
+Ext.Resizable = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        this.el = Ext.get(el);
+        if(config && config.wrap){
+            config.resizeChild = this.el;
+            this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : {cls:'xresizable-wrap'});
+            this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
+            this.el.setStyle('overflow', 'hidden');
+            this.el.setPositioning(config.resizeChild.getPositioning());
+            config.resizeChild.clearPositioning();
+            if(!config.width || !config.height){
+                var csize = config.resizeChild.getSize();
+                this.el.setSize(csize.width, csize.height);
+            }
+            if(config.pinned && !config.adjustments){
+                config.adjustments = 'auto';
+            }
+        }
+
+        
+        this.proxy = this.el.createProxy({tag: 'div', cls: 'x-resizable-proxy', id: this.el.id + '-rzproxy'}, Ext.getBody());
+        this.proxy.unselectable();
+        this.proxy.enableDisplayMode('block');
+
+        Ext.apply(this, config);
+
+        if(this.pinned){
+            this.disableTrackOver = true;
+            this.el.addClass('x-resizable-pinned');
+        }
+        
+        var position = this.el.getStyle('position');
+        if(position != 'absolute' && position != 'fixed'){
+            this.el.setStyle('position', 'relative');
+        }
+        if(!this.handles){ 
+            this.handles = 's,e,se';
+            if(this.multiDirectional){
+                this.handles += ',n,w';
+            }
+        }
+        if(this.handles == 'all'){
+            this.handles = 'n s e w ne nw se sw';
+        }
+        var hs = this.handles.split(/\s*?[,;]\s*?| /);
+        var ps = Ext.Resizable.positions;
+        for(var i = 0, len = hs.length; i < len; i++){
+            if(hs[i] && ps[hs[i]]){
+                var pos = ps[hs[i]];
+                this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent, this.handleCls);
+            }
+        }
+        
+        this.corner = this.southeast;
+
+        if(this.handles.indexOf('n') != -1 || this.handles.indexOf('w') != -1){
+            this.updateBox = true;
+        }
+
+        this.activeHandle = null;
+
+        if(this.resizeChild){
+            if(typeof this.resizeChild == 'boolean'){
+                this.resizeChild = Ext.get(this.el.dom.firstChild, true);
+            }else{
+                this.resizeChild = Ext.get(this.resizeChild, true);
+            }
+        }
+
+        if(this.adjustments == 'auto'){
+            var rc = this.resizeChild;
+            var hw = this.west, he = this.east, hn = this.north, hs = this.south;
+            if(rc && (hw || hn)){
+                rc.position('relative');
+                rc.setLeft(hw ? hw.el.getWidth() : 0);
+                rc.setTop(hn ? hn.el.getHeight() : 0);
+            }
+            this.adjustments = [
+                (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
+                (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1
+            ];
+        }
+
+        if(this.draggable){
+            this.dd = this.dynamic ?
+                this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
+            this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
+            if(this.constrainTo){
+                this.dd.constrainTo(this.constrainTo);
+            }
+        }
+
+        this.addEvents(
+            
+            'beforeresize',
+            
+            'resize'
+        );
+
+        if(this.width !== null && this.height !== null){
+            this.resizeTo(this.width, this.height);
+        }else{
+            this.updateChildSize();
+        }
+        if(Ext.isIE){
+            this.el.dom.style.zoom = 1;
+        }
+        Ext.Resizable.superclass.constructor.call(this);
+    },
+
+    
+    adjustments : [0, 0],
+    
+    animate : false,
+    
+    
+    disableTrackOver : false,
+    
+    draggable: false,
+    
+    duration : 0.35,
+    
+    dynamic : false,
+    
+    easing : 'easeOutStrong',
+    
+    enabled : true,
+    
+    
+    handles : false,
+    
+    multiDirectional : false,
+    
+    height : null,
+    
+    width : null,
+    
+    heightIncrement : 0,
+    
+    widthIncrement : 0,
+    
+    minHeight : 5,
+    
+    minWidth : 5,
+    
+    maxHeight : 10000,
+    
+    maxWidth : 10000,
+    
+    minX: 0,
+    
+    minY: 0,
+    
+    pinned : false,
+    
+    preserveRatio : false,
+    
+    resizeChild : false,
+    
+    transparent: false,
+    
+    
+    
+
+
+    
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.updateChildSize();
+        this.fireEvent('resize', this, width, height, null);
+    },
+
+    
+    startSizing : function(e, handle){
+        this.fireEvent('beforeresize', this, e);
+        if(this.enabled){ 
+
+            if(!this.overlay){
+                this.overlay = this.el.createProxy({tag: 'div', cls: 'x-resizable-overlay', html: '&#160;'}, Ext.getBody());
+                this.overlay.unselectable();
+                this.overlay.enableDisplayMode('block');
+                this.overlay.on({
+                    scope: this,
+                    mousemove: this.onMouseMove,
+                    mouseup: this.onMouseUp
+                });
+            }
+            this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
+
+            this.resizing = true;
+            this.startBox = this.el.getBox();
+            this.startPoint = e.getXY();
+            this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
+                            (this.startBox.y + this.startBox.height) - this.startPoint[1]];
+
+            this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.overlay.show();
+
+            if(this.constrainTo) {
+                var ct = Ext.get(this.constrainTo);
+                this.resizeRegion = ct.getRegion().adjust(
+                    ct.getFrameWidth('t'),
+                    ct.getFrameWidth('l'),
+                    -ct.getFrameWidth('b'),
+                    -ct.getFrameWidth('r')
+                );
+            }
+
+            this.proxy.setStyle('visibility', 'hidden'); 
+            this.proxy.show();
+            this.proxy.setBox(this.startBox);
+            if(!this.dynamic){
+                this.proxy.setStyle('visibility', 'visible');
+            }
+        }
+    },
+
+    
+    onMouseDown : function(handle, e){
+        if(this.enabled){
+            e.stopEvent();
+            this.activeHandle = handle;
+            this.startSizing(e, handle);
+        }
+    },
+
+    
+    onMouseUp : function(e){
+        this.activeHandle = null;
+        var size = this.resizeElement();
+        this.resizing = false;
+        this.handleOut();
+        this.overlay.hide();
+        this.proxy.hide();
+        this.fireEvent('resize', this, size.width, size.height, e);
+    },
+
+    
+    updateChildSize : function(){
+        if(this.resizeChild){
+            var el = this.el;
+            var child = this.resizeChild;
+            var adj = this.adjustments;
+            if(el.dom.offsetWidth){
+                var b = el.getSize(true);
+                child.setSize(b.width+adj[0], b.height+adj[1]);
+            }
+            
+            
+            
+            
+            if(Ext.isIE){
+                setTimeout(function(){
+                    if(el.dom.offsetWidth){
+                        var b = el.getSize(true);
+                        child.setSize(b.width+adj[0], b.height+adj[1]);
+                    }
+                }, 10);
+            }
+        }
+    },
+
+    
+    snap : function(value, inc, min){
+        if(!inc || !value){
+            return value;
+        }
+        var newValue = value;
+        var m = value % inc;
+        if(m > 0){
+            if(m > (inc/2)){
+                newValue = value + (inc-m);
+            }else{
+                newValue = value - m;
+            }
+        }
+        return Math.max(min, newValue);
+    },
+
+    
+    resizeElement : function(){
+        var box = this.proxy.getBox();
+        if(this.updateBox){
+            this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
+        }else{
+            this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
+        }
+        this.updateChildSize();
+        if(!this.dynamic){
+            this.proxy.hide();
+        }
+        if(this.draggable && this.constrainTo){
+            this.dd.resetConstraints();
+            this.dd.constrainTo(this.constrainTo);
+        }
+        return box;
+    },
+
+    
+    constrain : function(v, diff, m, mx){
+        if(v - diff < m){
+            diff = v - m;
+        }else if(v - diff > mx){
+            diff = v - mx;
+        }
+        return diff;
+    },
+
+    
+    onMouseMove : function(e){
+        if(this.enabled && this.activeHandle){
+            try{
+
+            if(this.resizeRegion && !this.resizeRegion.contains(e.getPoint())) {
+                return;
+            }
+
+            
+            var curSize = this.curSize || this.startBox,
+                x = this.startBox.x, y = this.startBox.y,
+                ox = x,
+                oy = y,
+                w = curSize.width,
+                h = curSize.height,
+                ow = w,
+                oh = h,
+                mw = this.minWidth,
+                mh = this.minHeight,
+                mxw = this.maxWidth,
+                mxh = this.maxHeight,
+                wi = this.widthIncrement,
+                hi = this.heightIncrement,
+                eventXY = e.getXY(),
+                diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0])),
+                diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1])),
+                pos = this.activeHandle.position,
+                tw,
+                th;
+
+            switch(pos){
+                case 'east':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    break;
+                case 'south':
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'southeast':
+                    w += diffX;
+                    h += diffY;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'north':
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'west':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+                case 'northeast':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'northwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    x += diffX;
+                    w -= diffX;
+                    break;
+               case 'southwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+            }
+
+            var sw = this.snap(w, wi, mw);
+            var sh = this.snap(h, hi, mh);
+            if(sw != w || sh != h){
+                switch(pos){
+                    case 'northeast':
+                        y -= sh - h;
+                    break;
+                    case 'north':
+                        y -= sh - h;
+                        break;
+                    case 'southwest':
+                        x -= sw - w;
+                    break;
+                    case 'west':
+                        x -= sw - w;
+                        break;
+                    case 'northwest':
+                        x -= sw - w;
+                        y -= sh - h;
+                    break;
+                }
+                w = sw;
+                h = sh;
+            }
+
+            if(this.preserveRatio){
+                switch(pos){
+                    case 'southeast':
+                    case 'east':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                       break;
+                    case 'south':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        break;
+                    case 'northeast':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                    break;
+                    case 'north':
+                        tw = w;
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        x += (tw - w) / 2;
+                        break;
+                    case 'southwest':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                        break;
+                    case 'west':
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        y += (th - h) / 2;
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                       break;
+                    case 'northwest':
+                        tw = w;
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                        y += th - h;
+                        x += tw - w;
+                        break;
+
+                }
+            }
+            this.proxy.setBounds(x, y, w, h);
+            if(this.dynamic){
+                this.resizeElement();
+            }
+            }catch(ex){}
+        }
+    },
+
+    
+    handleOver : function(){
+        if(this.enabled){
+            this.el.addClass('x-resizable-over');
+        }
+    },
+
+    
+    handleOut : function(){
+        if(!this.resizing){
+            this.el.removeClass('x-resizable-over');
+        }
+    },
+
+    
+    getEl : function(){
+        return this.el;
+    },
+
+    
+    getResizeChild : function(){
+        return this.resizeChild;
+    },
+
+    
+    destroy : function(removeEl){
+        Ext.destroy(this.dd, this.overlay, this.proxy);
+        this.overlay = null;
+        this.proxy = null;
+
+        var ps = Ext.Resizable.positions;
+        for(var k in ps){
+            if(typeof ps[k] != 'function' && this[ps[k]]){
+                this[ps[k]].destroy();
+            }
+        }
+        if(removeEl){
+            this.el.update('');
+            Ext.destroy(this.el);
+            this.el = null;
+        }
+        this.purgeListeners();
+    },
+
+    syncHandleHeight : function(){
+        var h = this.el.getHeight(true);
+        if(this.west){
+            this.west.el.setHeight(h);
+        }
+        if(this.east){
+            this.east.el.setHeight(h);
+        }
+    }
+});
+
+
+
+Ext.Resizable.positions = {
+    n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast'
+};
+
+Ext.Resizable.Handle = Ext.extend(Object, {
+    constructor : function(rz, pos, disableTrackOver, transparent, cls){
+       if(!this.tpl){
+            
+            var tpl = Ext.DomHelper.createTemplate(
+                {tag: 'div', cls: 'x-resizable-handle x-resizable-handle-{0}'}
+            );
+            tpl.compile();
+            Ext.Resizable.Handle.prototype.tpl = tpl;
+        }
+        this.position = pos;
+        this.rz = rz;
+        this.el = this.tpl.append(rz.el.dom, [this.position], true);
+        this.el.unselectable();
+        if(transparent){
+            this.el.setOpacity(0);
+        }
+        if(!Ext.isEmpty(cls)){
+            this.el.addClass(cls);
+        }
+        this.el.on('mousedown', this.onMouseDown, this);
+        if(!disableTrackOver){
+            this.el.on({
+                scope: this,
+                mouseover: this.onMouseOver,
+                mouseout: this.onMouseOut
+            });
+        }
+    },
+
+    
+    afterResize : function(rz){
+        
+    },
+    
+    onMouseDown : function(e){
+        this.rz.onMouseDown(this, e);
+    },
+    
+    onMouseOver : function(e){
+        this.rz.handleOver(this, e);
+    },
+    
+    onMouseOut : function(e){
+        this.rz.handleOut(this, e);
+    },
+    
+    destroy : function(){
+        Ext.destroy(this.el);
+        this.el = null;
+    }
+});
+
+Ext.Window = Ext.extend(Ext.Panel, {
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+    
+    baseCls : 'x-window',
+    
+    resizable : true,
+    
+    draggable : true,
+    
+    closable : true,
+    
+    closeAction : 'close',
+    
+    constrain : false,
+    
+    constrainHeader : false,
+    
+    plain : false,
+    
+    minimizable : false,
+    
+    maximizable : false,
+    
+    minHeight : 100,
+    
+    minWidth : 200,
+    
+    expandOnShow : true,
+    
+    
+    showAnimDuration: 0.25,
+    
+    
+    hideAnimDuration: 0.25,
+
+    
+    collapsible : false,
+
+    
+    initHidden : undefined,
+
+    
+    hidden : true,
+
+    
+    
+    
+    
+    
+    elements : 'header,body',
+    
+    frame : true,
+    
+    floating : true,
+
+    
+    initComponent : function(){
+        this.initTools();
+        Ext.Window.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            
+            
+            'resize',
+            
+            'maximize',
+            
+            'minimize',
+            
+            'restore'
+        );
+        
+        if(Ext.isDefined(this.initHidden)){
+            this.hidden = this.initHidden;
+        }
+        if(this.hidden === false){
+            this.hidden = true;
+            this.show();
+        }
+    },
+
+    
+    getState : function(){
+        return Ext.apply(Ext.Window.superclass.getState.call(this) || {}, this.getBox(true));
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.Window.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            this.el.addClass('x-window-plain');
+        }
+
+        
+        this.focusEl = this.el.createChild({
+                    tag: 'a', href:'#', cls:'x-dlg-focus',
+                    tabIndex:'-1', html: '&#160;'});
+        this.focusEl.swallowEvent('click', true);
+
+        this.proxy = this.el.createProxy('x-window-proxy');
+        this.proxy.enableDisplayMode('block');
+
+        if(this.modal){
+            this.mask = this.container.createChild({cls:'ext-el-mask'}, this.el.dom);
+            this.mask.enableDisplayMode('block');
+            this.mask.hide();
+            this.mon(this.mask, 'click', this.focus, this);
+        }
+        if(this.maximizable){
+            this.mon(this.header, 'dblclick', this.toggleMaximize, this);
+        }
+    },
+
+    
+    initEvents : function(){
+        Ext.Window.superclass.initEvents.call(this);
+        if(this.animateTarget){
+            this.setAnimateTarget(this.animateTarget);
+        }
+
+        if(this.resizable){
+            this.resizer = new Ext.Resizable(this.el, {
+                minWidth: this.minWidth,
+                minHeight:this.minHeight,
+                handles: this.resizeHandles || 'all',
+                pinned: true,
+                resizeElement : this.resizerAction,
+                handleCls: 'x-window-handle'
+            });
+            this.resizer.window = this;
+            this.mon(this.resizer, 'beforeresize', this.beforeResize, this);
+        }
+
+        if(this.draggable){
+            this.header.addClass('x-window-draggable');
+        }
+        this.mon(this.el, 'mousedown', this.toFront, this);
+        this.manager = this.manager || Ext.WindowMgr;
+        this.manager.register(this);
+        if(this.maximized){
+            this.maximized = false;
+            this.maximize();
+        }
+        if(this.closable){
+            var km = this.getKeyMap();
+            km.on(27, this.onEsc, this);
+            km.disable();
+        }
+    },
+
+    initDraggable : function(){
+        
+        this.dd = new Ext.Window.DD(this);
+    },
+
+   
+    onEsc : function(k, e){
+        if (this.activeGhost) {
+            this.unghost();
+        }
+        e.stopEvent();
+        this[this.closeAction]();
+    },
+
+    
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.hide();
+            this.clearAnchor();
+            Ext.destroy(
+                this.focusEl,
+                this.resizer,
+                this.dd,
+                this.proxy,
+                this.mask
+            );
+        }
+        Ext.Window.superclass.beforeDestroy.call(this);
+    },
+
+    
+    onDestroy : function(){
+        if(this.manager){
+            this.manager.unregister(this);
+        }
+        Ext.Window.superclass.onDestroy.call(this);
+    },
+
+    
+    initTools : function(){
+        if(this.minimizable){
+            this.addTool({
+                id: 'minimize',
+                handler: this.minimize.createDelegate(this, [])
+            });
+        }
+        if(this.maximizable){
+            this.addTool({
+                id: 'maximize',
+                handler: this.maximize.createDelegate(this, [])
+            });
+            this.addTool({
+                id: 'restore',
+                handler: this.restore.createDelegate(this, []),
+                hidden:true
+            });
+        }
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction].createDelegate(this, [])
+            });
+        }
+    },
+
+    
+    resizerAction : function(){
+        var box = this.proxy.getBox();
+        this.proxy.hide();
+        this.window.handleResize(box);
+        return box;
+    },
+
+    
+    beforeResize : function(){
+        this.resizer.minHeight = Math.max(this.minHeight, this.getFrameHeight() + 40); 
+        this.resizer.minWidth = Math.max(this.minWidth, this.getFrameWidth() + 40);
+        this.resizeBox = this.el.getBox();
+    },
+
+    
+    updateHandles : function(){
+        if(Ext.isIE && this.resizer){
+            this.resizer.syncHandleHeight();
+            this.el.repaint();
+        }
+    },
+
+    
+    handleResize : function(box){
+        var rz = this.resizeBox;
+        if(rz.x != box.x || rz.y != box.y){
+            this.updateBox(box);
+        }else{
+            this.setSize(box);
+            if (Ext.isIE6 && Ext.isStrict) {
+                this.doLayout();
+            }
+        }
+        this.focus();
+        this.updateHandles();
+        this.saveState();
+    },
+
+    
+    focus : function(){
+        var f = this.focusEl,
+            db = this.defaultButton,
+            t = typeof db,
+            el,
+            ct;
+        if(Ext.isDefined(db)){
+            if(Ext.isNumber(db) && this.fbar){
+                f = this.fbar.items.get(db);
+            }else if(Ext.isString(db)){
+                f = Ext.getCmp(db);
+            }else{
+                f = db;
+            }
+            el = f.getEl();
+            ct = Ext.getDom(this.container);
+            if (el && ct) {
+                if (ct != document.body && !Ext.lib.Region.getRegion(ct).contains(Ext.lib.Region.getRegion(el.dom))){
+                    return;
+                }
+            }
+        }
+        f = f || this.focusEl;
+        f.focus.defer(10, f);
+    },
+
+    
+    setAnimateTarget : function(el){
+        el = Ext.get(el);
+        this.animateTarget = el;
+    },
+
+    
+    beforeShow : function(){
+        delete this.el.lastXY;
+        delete this.el.lastLT;
+        if(this.x === undefined || this.y === undefined){
+            var xy = this.el.getAlignToXY(this.container, 'c-c');
+            var pos = this.el.translatePoints(xy[0], xy[1]);
+            this.x = this.x === undefined? pos.left : this.x;
+            this.y = this.y === undefined? pos.top : this.y;
+        }
+        this.el.setLeftTop(this.x, this.y);
+
+        if(this.expandOnShow){
+            this.expand(false);
+        }
+
+        if(this.modal){
+            Ext.getBody().addClass('x-body-masked');
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.mask.show();
+        }
+    },
+
+    
+    show : function(animateTarget, cb, scope){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        if(this.hidden === false){
+            this.toFront();
+            return this;
+        }
+        if(this.fireEvent('beforeshow', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('show', cb, scope, {single:true});
+        }
+        this.hidden = false;
+        if(Ext.isDefined(animateTarget)){
+            this.setAnimateTarget(animateTarget);
+        }
+        this.beforeShow();
+        if(this.animateTarget){
+            this.animShow();
+        }else{
+            this.afterShow();
+        }
+        return this;
+    },
+
+    
+    afterShow : function(isAnim){
+        if (this.isDestroyed){
+            return false;
+        }
+        this.proxy.hide();
+        this.el.setStyle('display', 'block');
+        this.el.show();
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(Ext.isMac && Ext.isGecko2){ 
+            this.cascade(this.setAutoScroll);
+        }
+
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.onWindowResize(this.onWindowResize, this);
+        }
+        this.doConstrain();
+        this.doLayout();
+        if(this.keyMap){
+            this.keyMap.enable();
+        }
+        this.toFront();
+        this.updateHandles();
+        if(isAnim && (Ext.isIE || Ext.isWebKit)){
+            var sz = this.getSize();
+            this.onResize(sz.width, sz.height);
+        }
+        this.onShow();
+        this.fireEvent('show', this);
+    },
+
+    
+    animShow : function(){
+        this.proxy.show();
+        this.proxy.setBox(this.animateTarget.getBox());
+        this.proxy.setOpacity(0);
+        var b = this.getBox();
+        this.el.setStyle('display', 'none');
+        this.proxy.shift(Ext.apply(b, {
+            callback: this.afterShow.createDelegate(this, [true], false),
+            scope: this,
+            easing: 'easeNone',
+            duration: this.showAnimDuration,
+            opacity: 0.5
+        }));
+    },
+
+    
+    hide : function(animateTarget, cb, scope){
+        if(this.hidden || this.fireEvent('beforehide', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('hide', cb, scope, {single:true});
+        }
+        this.hidden = true;
+        if(animateTarget !== undefined){
+            this.setAnimateTarget(animateTarget);
+        }
+        if(this.modal){
+            this.mask.hide();
+            Ext.getBody().removeClass('x-body-masked');
+        }
+        if(this.animateTarget){
+            this.animHide();
+        }else{
+            this.el.hide();
+            this.afterHide();
+        }
+        return this;
+    },
+
+    
+    afterHide : function(){
+        this.proxy.hide();
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.removeResizeListener(this.onWindowResize, this);
+        }
+        if(this.keyMap){
+            this.keyMap.disable();
+        }
+        this.onHide();
+        this.fireEvent('hide', this);
+    },
+
+    
+    animHide : function(){
+        this.proxy.setOpacity(0.5);
+        this.proxy.show();
+        var tb = this.getBox(false);
+        this.proxy.setBox(tb);
+        this.el.hide();
+        this.proxy.shift(Ext.apply(this.animateTarget.getBox(), {
+            callback: this.afterHide,
+            scope: this,
+            duration: this.hideAnimDuration,
+            easing: 'easeNone',
+            opacity: 0
+        }));
+    },
+
+    
+    onShow : Ext.emptyFn,
+
+    
+    onHide : Ext.emptyFn,
+
+    
+    onWindowResize : function(){
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(this.modal){
+            this.mask.setSize('100%', '100%');
+            var force = this.mask.dom.offsetHeight;
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        }
+        this.doConstrain();
+    },
+
+    
+    doConstrain : function(){
+        if(this.constrain || this.constrainHeader){
+            var offsets;
+            if(this.constrain){
+                offsets = {
+                    right:this.el.shadowOffset,
+                    left:this.el.shadowOffset,
+                    bottom:this.el.shadowOffset
+                };
+            }else {
+                var s = this.getSize();
+                offsets = {
+                    right:-(s.width - 100),
+                    bottom:-(s.height - 25 + this.el.getConstrainOffset())
+                };
+            }
+
+            var xy = this.el.getConstrainToXY(this.container, true, offsets);
+            if(xy){
+                this.setPosition(xy[0], xy[1]);
+            }
+        }
+    },
+
+    
+    ghost : function(cls){
+        var ghost = this.createGhost(cls);
+        var box = this.getBox(true);
+        ghost.setLeftTop(box.x, box.y);
+        ghost.setWidth(box.width);
+        this.el.hide();
+        this.activeGhost = ghost;
+        return ghost;
+    },
+
+    
+    unghost : function(show, matchPosition){
+        if(!this.activeGhost) {
+            return;
+        }
+        if(show !== false){
+            this.el.show();
+            this.focus.defer(10, this);
+            if(Ext.isMac && Ext.isGecko2){ 
+                this.cascade(this.setAutoScroll);
+            }
+        }
+        if(matchPosition !== false){
+            this.setPosition(this.activeGhost.getLeft(true), this.activeGhost.getTop(true));
+        }
+        this.activeGhost.hide();
+        this.activeGhost.remove();
+        delete this.activeGhost;
+    },
+
+    
+    minimize : function(){
+        this.fireEvent('minimize', this);
+        return this;
+    },
+
+    
+    close : function(){
+        if(this.fireEvent('beforeclose', this) !== false){
+            if(this.hidden){
+                this.doClose();
+            }else{
+                this.hide(null, this.doClose, this);
+            }
+        }
+    },
+
+    
+    doClose : function(){
+        this.fireEvent('close', this);
+        this.destroy();
+    },
+
+    
+    maximize : function(){
+        if(!this.maximized){
+            this.expand(false);
+            this.restoreSize = this.getSize();
+            this.restorePos = this.getPosition(true);
+            if (this.maximizable){
+                this.tools.maximize.hide();
+                this.tools.restore.show();
+            }
+            this.maximized = true;
+            this.el.disableShadow();
+
+            if(this.dd){
+                this.dd.lock();
+            }
+            if(this.collapsible){
+                this.tools.toggle.hide();
+            }
+            this.el.addClass('x-window-maximized');
+            this.container.addClass('x-window-maximized-ct');
+
+            this.setPosition(0, 0);
+            this.fitContainer();
+            this.fireEvent('maximize', this);
+        }
+        return this;
+    },
+
+    
+    restore : function(){
+        if(this.maximized){
+            var t = this.tools;
+            this.el.removeClass('x-window-maximized');
+            if(t.restore){
+                t.restore.hide();
+            }
+            if(t.maximize){
+                t.maximize.show();
+            }
+            this.setPosition(this.restorePos[0], this.restorePos[1]);
+            this.setSize(this.restoreSize.width, this.restoreSize.height);
+            delete this.restorePos;
+            delete this.restoreSize;
+            this.maximized = false;
+            this.el.enableShadow(true);
+
+            if(this.dd){
+                this.dd.unlock();
+            }
+            if(this.collapsible && t.toggle){
+                t.toggle.show();
+            }
+            this.container.removeClass('x-window-maximized-ct');
+
+            this.doConstrain();
+            this.fireEvent('restore', this);
+        }
+        return this;
+    },
+
+    
+    toggleMaximize : function(){
+        return this[this.maximized ? 'restore' : 'maximize']();
+    },
+
+    
+    fitContainer : function(){
+        var vs = this.container.getViewSize(false);
+        this.setSize(vs.width, vs.height);
+    },
+
+    
+    
+    setZIndex : function(index){
+        if(this.modal){
+            this.mask.setStyle('z-index', index);
+        }
+        this.el.setZIndex(++index);
+        index += 5;
+
+        if(this.resizer){
+            this.resizer.proxy.setStyle('z-index', ++index);
+        }
+
+        this.lastZIndex = index;
+    },
+
+    
+    alignTo : function(element, position, offsets){
+        var xy = this.el.getAlignToXY(element, position, offsets);
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    },
+
+    
+    anchorTo : function(el, alignment, offsets, monitorScroll){
+        this.clearAnchor();
+        this.anchorTarget = {
+            el: el,
+            alignment: alignment,
+            offsets: offsets
+        };
+
+        Ext.EventManager.onWindowResize(this.doAnchor, this);
+        var tm = typeof monitorScroll;
+        if(tm != 'undefined'){
+            Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
+                {buffer: tm == 'number' ? monitorScroll : 50});
+        }
+        return this.doAnchor();
+    },
+
+    
+    doAnchor : function(){
+        var o = this.anchorTarget;
+        this.alignTo(o.el, o.alignment, o.offsets);
+        return this;
+    },
+
+    
+    clearAnchor : function(){
+        if(this.anchorTarget){
+            Ext.EventManager.removeResizeListener(this.doAnchor, this);
+            Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
+            delete this.anchorTarget;
+        }
+        return this;
+    },
+
+    
+    toFront : function(e){
+        if(this.manager.bringToFront(this)){
+            if(!e || !e.getTarget().focus){
+                this.focus();
+            }
+        }
+        return this;
+    },
+
+    
+    setActive : function(active){
+        if(active){
+            if(!this.maximized){
+                this.el.enableShadow(true);
+            }
+            this.fireEvent('activate', this);
+        }else{
+            this.el.disableShadow();
+            this.fireEvent('deactivate', this);
+        }
+    },
+
+    
+    toBack : function(){
+        this.manager.sendToBack(this);
+        return this;
+    },
+
+    
+    center : function(){
+        var xy = this.el.getAlignToXY(this.container, 'c-c');
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    }
+
+    
+});
+Ext.reg('window', Ext.Window);
+
+
+Ext.Window.DD = Ext.extend(Ext.dd.DD, {
+    
+    constructor : function(win){
+        this.win = win;
+        Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
+        this.setHandleElId(win.header.id);
+        this.scroll = false;        
+    },
+    
+    moveOnly:true,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        var w = this.win;
+        this.proxy = w.ghost(w.initialConfig.cls);
+        if(w.constrain !== false){
+            var so = w.el.shadowOffset;
+            this.constrainTo(w.container, {right: so, left: so, bottom: so});
+        }else if(w.constrainHeader !== false){
+            var s = this.proxy.getSize();
+            this.constrainTo(w.container, {right: -(s.width-this.headerOffsets[0]), bottom: -(s.height-this.headerOffsets[1])});
+        }
+    },
+    b4Drag : Ext.emptyFn,
+
+    onDrag : function(e){
+        this.alignElWithMouse(this.proxy, e.getPageX(), e.getPageY());
+    },
+
+    endDrag : function(e){
+        this.win.unghost();
+        this.win.saveState();
+    }
+});
+
+Ext.WindowGroup = function(){
+    var list = {};
+    var accessList = [];
+    var front = null;
+
+    
+    var sortWindows = function(d1, d2){
+        return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;
+    };
+
+    
+    var orderWindows = function(){
+        var a = accessList, len = a.length;
+        if(len > 0){
+            a.sort(sortWindows);
+            var seed = a[0].manager.zseed;
+            for(var i = 0; i < len; i++){
+                var win = a[i];
+                if(win && !win.hidden){
+                    win.setZIndex(seed + (i*10));
+                }
+            }
+        }
+        activateLast();
+    };
+
+    
+    var setActiveWin = function(win){
+        if(win != front){
+            if(front){
+                front.setActive(false);
+            }
+            front = win;
+            if(win){
+                win.setActive(true);
+            }
+        }
+    };
+
+    
+    var activateLast = function(){
+        for(var i = accessList.length-1; i >=0; --i) {
+            if(!accessList[i].hidden){
+                setActiveWin(accessList[i]);
+                return;
+            }
+        }
+        
+        setActiveWin(null);
+    };
+
+    return {
+        
+        zseed : 9000,
+
+        
+        register : function(win){
+            if(win.manager){
+                win.manager.unregister(win);
+            }
+            win.manager = this;
+
+            list[win.id] = win;
+            accessList.push(win);
+            win.on('hide', activateLast);
+        },
+
+        
+        unregister : function(win){
+            delete win.manager;
+            delete list[win.id];
+            win.un('hide', activateLast);
+            accessList.remove(win);
+        },
+
+        
+        get : function(id){
+            return typeof id == "object" ? id : list[id];
+        },
+
+        
+        bringToFront : function(win){
+            win = this.get(win);
+            if(win != front){
+                win._lastAccess = new Date().getTime();
+                orderWindows();
+                return true;
+            }
+            return false;
+        },
+
+        
+        sendToBack : function(win){
+            win = this.get(win);
+            win._lastAccess = -(new Date().getTime());
+            orderWindows();
+            return win;
+        },
+
+        
+        hideAll : function(){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function" && list[id].isVisible()){
+                    list[id].hide();
+                }
+            }
+        },
+
+        
+        getActive : function(){
+            return front;
+        },
+
+        
+        getBy : function(fn, scope){
+            var r = [];
+            for(var i = accessList.length-1; i >=0; --i) {
+                var win = accessList[i];
+                if(fn.call(scope||win, win) !== false){
+                    r.push(win);
+                }
+            }
+            return r;
+        },
+
+        
+        each : function(fn, scope){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function"){
+                    if(fn.call(scope || list[id], list[id]) === false){
+                        return;
+                    }
+                }
+            }
+        }
+    };
+};
+
+
+
+Ext.WindowMgr = new Ext.WindowGroup();
+Ext.MessageBox = function(){
+    var dlg, opt, mask, waitTimer,
+        bodyEl, msgEl, textboxEl, textareaEl, progressBar, pp, iconEl, spacerEl,
+        buttons, activeTextEl, bwidth, bufferIcon = '', iconCls = '',
+        buttonNames = ['ok', 'yes', 'no', 'cancel'];
+
+    
+    var handleButton = function(button){
+        buttons[button].blur();
+        if(dlg.isVisible()){
+            dlg.hide();
+            handleHide();
+            Ext.callback(opt.fn, opt.scope||window, [button, activeTextEl.dom.value, opt], 1);
+        }
+    };
+
+    
+    var handleHide = function(){
+        if(opt && opt.cls){
+            dlg.el.removeClass(opt.cls);
+        }
+        progressBar.reset();        
+    };
+
+    
+    var handleEsc = function(d, k, e){
+        if(opt && opt.closable !== false){
+            dlg.hide();
+            handleHide();
+        }
+        if(e){
+            e.stopEvent();
+        }
+    };
+
+    
+    var updateButtons = function(b){
+        var width = 0,
+            cfg;
+        if(!b){
+            Ext.each(buttonNames, function(name){
+                buttons[name].hide();
+            });
+            return width;
+        }
+        dlg.footer.dom.style.display = '';
+        Ext.iterate(buttons, function(name, btn){
+            cfg = b[name];
+            if(cfg){
+                btn.show();
+                btn.setText(Ext.isString(cfg) ? cfg : Ext.MessageBox.buttonText[name]);
+                width += btn.getEl().getWidth() + 15;
+            }else{
+                btn.hide();
+            }
+        });
+        return width;
+    };
+
+    return {
+        
+        getDialog : function(titleText){
+           if(!dlg){
+                var btns = [];
+                
+                buttons = {};
+                Ext.each(buttonNames, function(name){
+                    btns.push(buttons[name] = new Ext.Button({
+                        text: this.buttonText[name],
+                        handler: handleButton.createCallback(name),
+                        hideMode: 'offsets'
+                    }));
+                }, this);
+                dlg = new Ext.Window({
+                    autoCreate : true,
+                    title:titleText,
+                    resizable:false,
+                    constrain:true,
+                    constrainHeader:true,
+                    minimizable : false,
+                    maximizable : false,
+                    stateful: false,
+                    modal: true,
+                    shim:true,
+                    buttonAlign:"center",
+                    width:400,
+                    height:100,
+                    minHeight: 80,
+                    plain:true,
+                    footer:true,
+                    closable:true,
+                    close : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton("no");
+                        }else{
+                            handleButton("cancel");
+                        }
+                    },
+                    fbar: new Ext.Toolbar({
+                        items: btns,
+                        enableOverflow: false
+                    })
+                });
+                dlg.render(document.body);
+                dlg.getEl().addClass('x-window-dlg');
+                mask = dlg.mask;
+                bodyEl = dlg.body.createChild({
+                    html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'
+                });
+                iconEl = Ext.get(bodyEl.dom.firstChild);
+                var contentEl = bodyEl.dom.childNodes[1];
+                msgEl = Ext.get(contentEl.firstChild);
+                textboxEl = Ext.get(contentEl.childNodes[2].firstChild);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton("ok");
+                        }else if(opt.buttons.yes){
+                            handleButton("yes");
+                        }
+                    }
+                });
+                textareaEl = Ext.get(contentEl.childNodes[2].childNodes[1]);
+                textareaEl.enableDisplayMode();
+                progressBar = new Ext.ProgressBar({
+                    renderTo:bodyEl
+                });
+               bodyEl.createChild({cls:'x-clear'});
+            }
+            return dlg;
+        },
+
+        
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.setSize(this.maxWidth, 100); 
+            }
+            
+            msgEl.update(text ? text + ' ' : '&#160;');
+
+            var iw = iconCls != '' ? (iconEl.getWidth() + iconEl.getMargins('lr')) : 0,
+                mw = msgEl.getWidth() + msgEl.getMargins('lr'),
+                fw = dlg.getFrameWidth('lr'),
+                bw = dlg.body.getFrameWidth('lr'),
+                w;
+                
+            w = Math.max(Math.min(opt.width || iw+mw+fw+bw, opt.maxWidth || this.maxWidth),
+                    Math.max(opt.minWidth || this.minWidth, bwidth || 0));
+
+            if(opt.prompt === true){
+                activeTextEl.setWidth(w-iw-fw-bw);
+            }
+            if(opt.progress === true || opt.wait === true){
+                progressBar.setSize(w-iw-fw-bw);
+            }
+            if(Ext.isIE && w == bwidth){
+                w += 4; 
+            }
+            msgEl.update(text || '&#160;');
+            dlg.setSize(w, 'auto').center();
+            return this;
+        },
+
+        
+        updateProgress : function(value, progressText, msg){
+            progressBar.updateProgress(value, progressText);
+            if(msg){
+                this.updateText(msg);
+            }
+            return this;
+        },
+
+        
+        isVisible : function(){
+            return dlg && dlg.isVisible();
+        },
+
+        
+        hide : function(){
+            var proxy = dlg ? dlg.activeGhost : null;
+            if(this.isVisible() || proxy){
+                dlg.hide();
+                handleHide();
+                if (proxy){
+                    
+                    
+                    dlg.unghost(false, false);
+                } 
+            }
+            return this;
+        },
+
+        
+        show : function(options){
+            if(this.isVisible()){
+                this.hide();
+            }
+            opt = options;
+            var d = this.getDialog(opt.title || "&#160;");
+
+            d.setTitle(opt.title || "&#160;");
+            var allowClose = (opt.closable !== false && opt.progress !== true && opt.wait !== true);
+            d.tools.close.setDisplayed(allowClose);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false);
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(Ext.isNumber(opt.multiline) ? opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            activeTextEl.dom.value = opt.value || "";
+            if(opt.prompt){
+                d.focusEl = activeTextEl;
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons["ok"];
+                }else if(bs && bs.yes){
+                    db = buttons["yes"];
+                }
+                if (db){
+                    d.focusEl = db;
+                }
+            }
+            if(Ext.isDefined(opt.iconCls)){
+              d.setIconClass(opt.iconCls);
+            }
+            this.setIcon(Ext.isDefined(opt.icon) ? opt.icon : bufferIcon);
+            bwidth = updateButtons(opt.buttons);
+            progressBar.setVisible(opt.progress === true || opt.wait === true);
+            this.updateProgress(0, opt.progressText);
+            this.updateText(opt.msg);
+            if(opt.cls){
+                d.el.addClass(opt.cls);
+            }
+            d.proxyDrag = opt.proxyDrag === true;
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            if(!d.isVisible()){
+                
+                document.body.appendChild(dlg.el.dom);
+                d.setAnimateTarget(opt.animEl);
+                
+                d.on('show', function(){
+                    if(allowClose === true){
+                        d.keyMap.enable();
+                    }else{
+                        d.keyMap.disable();
+                    }
+                }, this, {single:true});
+                d.show(opt.animEl);
+            }
+            if(opt.wait === true){
+                progressBar.wait(opt.waitConfig);
+            }
+            return this;
+        },
+
+        
+        setIcon : function(icon){
+            if(!dlg){
+                bufferIcon = icon;
+                return;
+            }
+            bufferIcon = undefined;
+            if(icon && icon != ''){
+                iconEl.removeClass('x-hidden');
+                iconEl.replaceClass(iconCls, icon);
+                bodyEl.addClass('x-dlg-icon');
+                iconCls = icon;
+            }else{
+                iconEl.replaceClass(iconCls, 'x-hidden');
+                bodyEl.removeClass('x-dlg-icon');
+                iconCls = '';
+            }
+            return this;
+        },
+
+        
+        progress : function(title, msg, progressText){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false,
+                minWidth: this.minProgressWidth,
+                progressText: progressText
+            });
+            return this;
+        },
+
+        
+        wait : function(msg, title, config){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                closable:false,
+                wait:true,
+                modal:true,
+                minWidth: this.minProgressWidth,
+                waitConfig: config
+            });
+            return this;
+        },
+
+        
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope,
+                icon: this.QUESTION,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        
+        prompt : function(title, msg, fn, scope, multiline, value){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth: this.minPromptWidth,
+                scope : scope,
+                prompt:true,
+                multiline: multiline,
+                value: value
+            });
+            return this;
+        },
+
+        
+        OK : {ok:true},
+        
+        CANCEL : {cancel:true},
+        
+        OKCANCEL : {ok:true, cancel:true},
+        
+        YESNO : {yes:true, no:true},
+        
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        
+        INFO : 'ext-mb-info',
+        
+        WARNING : 'ext-mb-warning',
+        
+        QUESTION : 'ext-mb-question',
+        
+        ERROR : 'ext-mb-error',
+
+        
+        defaultTextHeight : 75,
+        
+        maxWidth : 600,
+        
+        minWidth : 100,
+        
+        minProgressWidth : 250,
+        
+        minPromptWidth: 250,
+        
+        buttonText : {
+            ok : "OK",
+            cancel : "Cancel",
+            yes : "Yes",
+            no : "No"
+        }
+    };
+}();
+
+
+Ext.Msg = Ext.MessageBox;
+Ext.dd.PanelProxy  = Ext.extend(Object, {
+    
+    constructor : function(panel, config){
+        this.panel = panel;
+        this.id = this.panel.id +'-ddproxy';
+        Ext.apply(this, config);        
+    },
+    
+    
+    insertProxy : true,
+
+    
+    setStatus : Ext.emptyFn,
+    reset : Ext.emptyFn,
+    update : Ext.emptyFn,
+    stop : Ext.emptyFn,
+    sync: Ext.emptyFn,
+
+    
+    getEl : function(){
+        return this.ghost;
+    },
+
+    
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    
+    getProxy : function(){
+        return this.proxy;
+    },
+
+    
+    hide : function(){
+        if(this.ghost){
+            if(this.proxy){
+                this.proxy.remove();
+                delete this.proxy;
+            }
+            this.panel.el.dom.style.display = '';
+            this.ghost.remove();
+            delete this.ghost;
+        }
+    },
+
+    
+    show : function(){
+        if(!this.ghost){
+            this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
+            this.ghost.setXY(this.panel.el.getXY());
+            if(this.insertProxy){
+                this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
+                this.proxy.setSize(this.panel.getSize());
+            }
+            this.panel.el.dom.style.display = 'none';
+        }
+    },
+
+    
+    repair : function(xy, callback, scope){
+        this.hide();
+        if(typeof callback == "function"){
+            callback.call(scope || this);
+        }
+    },
+
+    
+    moveProxy : function(parentNode, before){
+        if(this.proxy){
+            parentNode.insertBefore(this.proxy.dom, before);
+        }
+    }
+});
+
+
+Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(panel, cfg){
+        this.panel = panel;
+        this.dragData = {panel: panel};
+        this.proxy = new Ext.dd.PanelProxy(panel, cfg);
+        Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
+        var h = panel.header,
+            el = panel.body;
+        if(h){
+            this.setHandleElId(h.id);
+            el = panel.header;
+        }
+        el.setStyle('cursor', 'move');
+        this.scroll = false;        
+    },
+    
+    showFrame: Ext.emptyFn,
+    startDrag: Ext.emptyFn,
+    b4StartDrag: function(x, y) {
+        this.proxy.show();
+    },
+    b4MouseDown: function(e) {
+        var x = e.getPageX(),
+            y = e.getPageY();
+        this.autoOffset(x, y);
+    },
+    onInitDrag : function(x, y){
+        this.onStartDrag(x, y);
+        return true;
+    },
+    createFrame : Ext.emptyFn,
+    getDragEl : function(e){
+        return this.proxy.ghost.dom;
+    },
+    endDrag : function(e){
+        this.proxy.hide();
+        this.panel.saveState();
+    },
+
+    autoOffset : function(x, y) {
+        x -= this.startPageX;
+        y -= this.startPageY;
+        this.setDelta(x, y);
+    }
+});
+Ext.state.Provider = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(){
+        
+        this.addEvents("statechange");
+        this.state = {};
+        Ext.state.Provider.superclass.constructor.call(this);
+    },
+    
+    
+    get : function(name, defaultValue){
+        return typeof this.state[name] == "undefined" ?
+            defaultValue : this.state[name];
+    },
+
+    
+    clear : function(name){
+        delete this.state[name];
+        this.fireEvent("statechange", this, name, null);
+    },
+
+    
+    set : function(name, value){
+        this.state[name] = value;
+        this.fireEvent("statechange", this, name, value);
+    },
+
+    
+    decodeValue : function(cookie){
+        
+        var re = /^(a|n|d|b|s|o|e)\:(.*)$/,
+            matches = re.exec(unescape(cookie)),
+            all,
+            type,
+            v,
+            kv;
+        if(!matches || !matches[1]){
+            return; 
+        }
+        type = matches[1];
+        v = matches[2];
+        switch(type){
+            case 'e':
+                return null;
+            case 'n':
+                return parseFloat(v);
+            case 'd':
+                return new Date(Date.parse(v));
+            case 'b':
+                return (v == '1');
+            case 'a':
+                all = [];
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        all.push(this.decodeValue(val));
+                    }, this);
+                }
+                return all;
+           case 'o':
+                all = {};
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        kv = val.split('=');
+                        all[kv[0]] = this.decodeValue(kv[1]);
+                    }, this);
+                }
+                return all;
+           default:
+                return v;
+        }
+    },
+
+    
+    encodeValue : function(v){
+        var enc,
+            flat = '',
+            i = 0,
+            len,
+            key;
+        if(v == null){
+            return 'e:1';    
+        }else if(typeof v == 'number'){
+            enc = 'n:' + v;
+        }else if(typeof v == 'boolean'){
+            enc = 'b:' + (v ? '1' : '0');
+        }else if(Ext.isDate(v)){
+            enc = 'd:' + v.toGMTString();
+        }else if(Ext.isArray(v)){
+            for(len = v.length; i < len; i++){
+                flat += this.encodeValue(v[i]);
+                if(i != len - 1){
+                    flat += '^';
+                }
+            }
+            enc = 'a:' + flat;
+        }else if(typeof v == 'object'){
+            for(key in v){
+                if(typeof v[key] != 'function' && v[key] !== undefined){
+                    flat += key + '=' + this.encodeValue(v[key]) + '^';
+                }
+            }
+            enc = 'o:' + flat.substring(0, flat.length-1);
+        }else{
+            enc = 's:' + v;
+        }
+        return escape(enc);
+    }
+});
+
+Ext.state.Manager = function(){
+    var provider = new Ext.state.Provider();
+
+    return {
+        
+        setProvider : function(stateProvider){
+            provider = stateProvider;
+        },
+
+        
+        get : function(key, defaultValue){
+            return provider.get(key, defaultValue);
+        },
+
+        
+         set : function(key, value){
+            provider.set(key, value);
+        },
+
+        
+        clear : function(key){
+            provider.clear(key);
+        },
+
+        
+        getProvider : function(){
+            return provider;
+        }
+    };
+}();
+
+Ext.state.CookieProvider = Ext.extend(Ext.state.Provider, {
+    
+    constructor : function(config){
+        Ext.state.CookieProvider.superclass.constructor.call(this);
+        this.path = "/";
+        this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); 
+        this.domain = null;
+        this.secure = false;
+        Ext.apply(this, config);
+        this.state = this.readCookies();
+    },
+    
+    
+    set : function(name, value){
+        if(typeof value == "undefined" || value === null){
+            this.clear(name);
+            return;
+        }
+        this.setCookie(name, value);
+        Ext.state.CookieProvider.superclass.set.call(this, name, value);
+    },
+
+    
+    clear : function(name){
+        this.clearCookie(name);
+        Ext.state.CookieProvider.superclass.clear.call(this, name);
+    },
+
+    
+    readCookies : function(){
+        var cookies = {},
+            c = document.cookie + ";",
+            re = /\s?(.*?)=(.*?);/g,
+    	    matches,
+            name,
+            value;
+    	while((matches = re.exec(c)) != null){
+            name = matches[1];
+            value = matches[2];
+            if(name && name.substring(0,3) == "ys-"){
+                cookies[name.substr(3)] = this.decodeValue(value);
+            }
+        }
+        return cookies;
+    },
+
+    
+    setCookie : function(name, value){
+        document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +
+           ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    },
+
+    
+    clearCookie : function(name){
+        document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    }
+});
+Ext.DataView = Ext.extend(Ext.BoxComponent, {
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    selectedClass : "x-view-selected",
+    
+    emptyText : "",
+
+    
+    deferEmptyText: true,
+    
+    trackOver: false,
+    
+    
+    blockRefresh: false,
+
+    
+    last: false,
+
+    
+    initComponent : function(){
+        Ext.DataView.superclass.initComponent.call(this);
+        if(Ext.isString(this.tpl) || Ext.isArray(this.tpl)){
+            this.tpl = new Ext.XTemplate(this.tpl);
+        }
+
+        this.addEvents(
+            
+            "beforeclick",
+            
+            "click",
+            
+            "mouseenter",
+            
+            "mouseleave",
+            
+            "containerclick",
+            
+            "dblclick",
+            
+            "contextmenu",
+            
+            "containercontextmenu",
+            
+            "selectionchange",
+
+            
+            "beforeselect"
+        );
+
+        this.store = Ext.StoreMgr.lookup(this.store);
+        this.all = new Ext.CompositeElementLite();
+        this.selected = new Ext.CompositeElementLite();
+    },
+
+    
+    afterRender : function(){
+        Ext.DataView.superclass.afterRender.call(this);
+
+		this.mon(this.getTemplateTarget(), {
+            "click": this.onClick,
+            "dblclick": this.onDblClick,
+            "contextmenu": this.onContextMenu,
+            scope:this
+        });
+
+        if(this.overClass || this.trackOver){
+            this.mon(this.getTemplateTarget(), {
+                "mouseover": this.onMouseOver,
+                "mouseout": this.onMouseOut,
+                scope:this
+            });
+        }
+
+        if(this.store){
+            this.bindStore(this.store, true);
+        }
+    },
+
+    
+    refresh : function() {
+        this.clearSelections(false, true);
+        var el = this.getTemplateTarget(),
+            records = this.store.getRange();
+            
+        el.update('');
+        if(records.length < 1){
+            if(!this.deferEmptyText || this.hasSkippedEmptyText){
+                el.update(this.emptyText);
+            }
+            this.all.clear();
+        }else{
+            this.tpl.overwrite(el, this.collectData(records, 0));
+            this.all.fill(Ext.query(this.itemSelector, el.dom));
+            this.updateIndexes(0);
+        }
+        this.hasSkippedEmptyText = true;
+    },
+
+    getTemplateTarget: function(){
+        return this.el;
+    },
+
+    
+    prepareData : function(data){
+        return data;
+    },
+
+    
+    collectData : function(records, startIndex){
+        var r = [],
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            r[r.length] = this.prepareData(records[i].data, startIndex + i, records[i]);
+        }
+        return r;
+    },
+
+    
+    bufferRender : function(records, index){
+        var div = document.createElement('div');
+        this.tpl.overwrite(div, this.collectData(records, index));
+        return Ext.query(this.itemSelector, div);
+    },
+
+    
+    onUpdate : function(ds, record){
+        var index = this.store.indexOf(record);
+        if(index > -1){
+            var sel = this.isSelected(index),
+                original = this.all.elements[index],
+                node = this.bufferRender([record], index)[0];
+
+            this.all.replaceElement(index, node, true);
+            if(sel){
+                this.selected.replaceElement(original, node);
+                this.all.item(index).addClass(this.selectedClass);
+            }
+            this.updateIndexes(index, index);
+        }
+    },
+
+    
+    onAdd : function(ds, records, index){
+        if(this.all.getCount() === 0){
+            this.refresh();
+            return;
+        }
+        var nodes = this.bufferRender(records, index), n, a = this.all.elements;
+        if(index < this.all.getCount()){
+            n = this.all.item(index).insertSibling(nodes, 'before', true);
+            a.splice.apply(a, [index, 0].concat(nodes));
+        }else{
+            n = this.all.last().insertSibling(nodes, 'after', true);
+            a.push.apply(a, nodes);
+        }
+        this.updateIndexes(index);
+    },
+
+    
+    onRemove : function(ds, record, index){
+        this.deselect(index);
+        this.all.removeElement(index, true);
+        this.updateIndexes(index);
+        if (this.store.getCount() === 0){
+            this.refresh();
+        }
+    },
+
+    
+    refreshNode : function(index){
+        this.onUpdate(this.store, this.store.getAt(index));
+    },
+
+    
+    updateIndexes : function(startIndex, endIndex){
+        var ns = this.all.elements;
+        startIndex = startIndex || 0;
+        endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));
+        for(var i = startIndex; i <= endIndex; i++){
+            ns[i].viewIndex = i;
+        }
+    },
+    
+    
+    getStore : function(){
+        return this.store;
+    },
+
+    
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("beforeload", this.onBeforeLoad, this);
+                this.store.un("datachanged", this.onDataChanged, this);
+                this.store.un("add", this.onAdd, this);
+                this.store.un("remove", this.onRemove, this);
+                this.store.un("update", this.onUpdate, this);
+                this.store.un("clear", this.refresh, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                datachanged: this.onDataChanged,
+                add: this.onAdd,
+                remove: this.onRemove,
+                update: this.onUpdate,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store){
+            this.refresh();
+        }
+    },
+    
+    
+    onDataChanged: function() {
+        if (this.blockRefresh !== true) {
+            this.refresh.apply(this, arguments);
+        }
+    },
+
+    
+    findItemFromChild : function(node){
+        return Ext.fly(node).findParent(this.itemSelector, this.getTemplateTarget());
+    },
+
+    
+    onClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget()),
+            index;
+        if(item){
+            index = this.indexOf(item);
+            if(this.onItemClick(item, index, e) !== false){
+                this.fireEvent("click", this, index, item, e);
+            }
+        }else{
+            if(this.fireEvent("containerclick", this, e) !== false){
+                this.onContainerClick(e);
+            }
+        }
+    },
+
+    onContainerClick : function(e){
+        this.clearSelections();
+    },
+
+    
+    onContextMenu : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("contextmenu", this, this.indexOf(item), item, e);
+        }else{
+            this.fireEvent("containercontextmenu", this, e);
+        }
+    },
+
+    
+    onDblClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("dblclick", this, this.indexOf(item), item, e);
+        }
+    },
+
+    
+    onMouseOver : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item && item !== this.lastItem){
+            this.lastItem = item;
+            Ext.fly(item).addClass(this.overClass);
+            this.fireEvent("mouseenter", this, this.indexOf(item), item, e);
+        }
+    },
+
+    
+    onMouseOut : function(e){
+        if(this.lastItem){
+            if(!e.within(this.lastItem, true, true)){
+                Ext.fly(this.lastItem).removeClass(this.overClass);
+                this.fireEvent("mouseleave", this, this.indexOf(this.lastItem), this.lastItem, e);
+                delete this.lastItem;
+            }
+        }
+    },
+
+    
+    onItemClick : function(item, index, e){
+        if(this.fireEvent("beforeclick", this, index, item, e) === false){
+            return false;
+        }
+        if(this.multiSelect){
+            this.doMultiSelection(item, index, e);
+            e.preventDefault();
+        }else if(this.singleSelect){
+            this.doSingleSelection(item, index, e);
+            e.preventDefault();
+        }
+        return true;
+    },
+
+    
+    doSingleSelection : function(item, index, e){
+        if(e.ctrlKey && this.isSelected(index)){
+            this.deselect(index);
+        }else{
+            this.select(index, false);
+        }
+    },
+
+    
+    doMultiSelection : function(item, index, e){
+        if(e.shiftKey && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, index, e.ctrlKey);
+            this.last = last; 
+        }else{
+            if((e.ctrlKey||this.simpleSelect) && this.isSelected(index)){
+                this.deselect(index);
+            }else{
+                this.select(index, e.ctrlKey || e.shiftKey || this.simpleSelect);
+            }
+        }
+    },
+
+    
+    getSelectionCount : function(){
+        return this.selected.getCount();
+    },
+
+    
+    getSelectedNodes : function(){
+        return this.selected.elements;
+    },
+
+    
+    getSelectedIndexes : function(){
+        var indexes = [], 
+            selected = this.selected.elements,
+            i = 0,
+            len = selected.length;
+            
+        for(; i < len; i++){
+            indexes.push(selected[i].viewIndex);
+        }
+        return indexes;
+    },
+
+    
+    getSelectedRecords : function(){
+        return this.getRecords(this.selected.elements);
+    },
+
+    
+    getRecords : function(nodes){
+        var records = [], 
+            i = 0,
+            len = nodes.length;
+            
+        for(; i < len; i++){
+            records[records.length] = this.store.getAt(nodes[i].viewIndex);
+        }
+        return records;
+    },
+
+    
+    getRecord : function(node){
+        return this.store.getAt(node.viewIndex);
+    },
+
+    
+    clearSelections : function(suppressEvent, skipUpdate){
+        if((this.multiSelect || this.singleSelect) && this.selected.getCount() > 0){
+            if(!skipUpdate){
+                this.selected.removeClass(this.selectedClass);
+            }
+            this.selected.clear();
+            this.last = false;
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        }
+    },
+
+    
+    isSelected : function(node){
+        return this.selected.contains(this.getNode(node));
+    },
+
+    
+    deselect : function(node){
+        if(this.isSelected(node)){
+            node = this.getNode(node);
+            this.selected.removeElement(node);
+            if(this.last == node.viewIndex){
+                this.last = false;
+            }
+            Ext.fly(node).removeClass(this.selectedClass);
+            this.fireEvent("selectionchange", this, this.selected.elements);
+        }
+    },
+
+    
+    select : function(nodeInfo, keepExisting, suppressEvent){
+        if(Ext.isArray(nodeInfo)){
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            for(var i = 0, len = nodeInfo.length; i < len; i++){
+                this.select(nodeInfo[i], true, true);
+            }
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        } else{
+            var node = this.getNode(nodeInfo);
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            if(node && !this.isSelected(node)){
+                if(this.fireEvent("beforeselect", this, node, this.selected.elements) !== false){
+                    Ext.fly(node).addClass(this.selectedClass);
+                    this.selected.add(node);
+                    this.last = node.viewIndex;
+                    if(!suppressEvent){
+                        this.fireEvent("selectionchange", this, this.selected.elements);
+                    }
+                }
+            }
+        }
+    },
+
+    
+    selectRange : function(start, end, keepExisting){
+        if(!keepExisting){
+            this.clearSelections(true);
+        }
+        this.select(this.getNodes(start, end), true);
+    },
+
+    
+    getNode : function(nodeInfo){
+        if(Ext.isString(nodeInfo)){
+            return document.getElementById(nodeInfo);
+        }else if(Ext.isNumber(nodeInfo)){
+            return this.all.elements[nodeInfo];
+        }else if(nodeInfo instanceof Ext.data.Record){
+            var idx = this.store.indexOf(nodeInfo);
+            return this.all.elements[idx];
+        }
+        return nodeInfo;
+    },
+
+    
+    getNodes : function(start, end){
+        var ns = this.all.elements,
+            nodes = [],
+            i;
+            
+        start = start || 0;
+        end = !Ext.isDefined(end) ? Math.max(ns.length - 1, 0) : end;
+        if(start <= end){
+            for(i = start; i <= end && ns[i]; i++){
+                nodes.push(ns[i]);
+            }
+        } else{
+            for(i = start; i >= end && ns[i]; i--){
+                nodes.push(ns[i]);
+            }
+        }
+        return nodes;
+    },
+
+    
+    indexOf : function(node){
+        node = this.getNode(node);
+        if(Ext.isNumber(node.viewIndex)){
+            return node.viewIndex;
+        }
+        return this.all.indexOf(node);
+    },
+
+    
+    onBeforeLoad : function(){
+        if(this.loadingText){
+            this.clearSelections(false, true);
+            this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+'</div>');
+            this.all.clear();
+        }
+    },
+
+    onDestroy : function(){
+        this.all.clear();
+        this.selected.clear();
+        Ext.DataView.superclass.onDestroy.call(this);
+        this.bindStore(null);
+    }
+});
+
+
+Ext.DataView.prototype.setStore = Ext.DataView.prototype.bindStore;
+
+Ext.reg('dataview', Ext.DataView);
+
+Ext.list.ListView = Ext.extend(Ext.DataView, {
+    
+    
+    
+    itemSelector: 'dl',
+    
+    selectedClass:'x-list-selected',
+    
+    overClass:'x-list-over',
+    
+    
+    scrollOffset : undefined,
+    
+    columnResize: true,
+    
+    
+    columnSort: true,
+    
+
+    
+    maxColumnWidth: Ext.isIE ? 99 : 100,
+
+    initComponent : function(){
+        if(this.columnResize){
+            this.colResizer = new Ext.list.ColumnResizer(this.colResizer);
+            this.colResizer.init(this);
+        }
+        if(this.columnSort){
+            this.colSorter = new Ext.list.Sorter(this.columnSort);
+            this.colSorter.init(this);
+        }
+        if(!this.internalTpl){
+            this.internalTpl = new Ext.XTemplate(
+                '<div class="x-list-header"><div class="x-list-header-inner">',
+                    '<tpl for="columns">',
+                    '<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',
+                        '{header}',
+                    '</em></div>',
+                    '</tpl>',
+                    '<div class="x-clear"></div>',
+                '</div></div>',
+                '<div class="x-list-body"><div class="x-list-body-inner">',
+                '</div></div>'
+            );
+        }
+        if(!this.tpl){
+            this.tpl = new Ext.XTemplate(
+                '<tpl for="rows">',
+                    '<dl>',
+                        '<tpl for="parent.columns">',
+                        '<dt style="width:{[values.width*100]}%;text-align:{align};">',
+                        '<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',
+                            '{[values.tpl.apply(parent)]}',
+                        '</em></dt>',
+                        '</tpl>',
+                        '<div class="x-clear"></div>',
+                    '</dl>',
+                '</tpl>'
+            );
+        };
+
+        var cs = this.columns,
+            allocatedWidth = 0,
+            colsWithWidth = 0,
+            len = cs.length,
+            columns = [];
+
+        for(var i = 0; i < len; i++){
+            var c = cs[i];
+            if(!c.isColumn) {
+                c.xtype = c.xtype ? (/^lv/.test(c.xtype) ? c.xtype : 'lv' + c.xtype) : 'lvcolumn';
+                c = Ext.create(c);
+            }
+            if(c.width) {
+                allocatedWidth += c.width*100;
+                if(allocatedWidth > this.maxColumnWidth){
+                    c.width -= (allocatedWidth - this.maxColumnWidth) / 100;
+                }
+                colsWithWidth++;
+            }
+            columns.push(c);
+        }
+
+        cs = this.columns = columns;
+
+        
+        if(colsWithWidth < len){
+            var remaining = len - colsWithWidth;
+            if(allocatedWidth < this.maxColumnWidth){
+                var perCol = ((this.maxColumnWidth-allocatedWidth) / remaining)/100;
+                for(var j = 0; j < len; j++){
+                    var c = cs[j];
+                    if(!c.width){
+                        c.width = perCol;
+                    }
+                }
+            }
+        }
+        Ext.list.ListView.superclass.initComponent.call(this);
+    },
+
+    onRender : function(){
+        this.autoEl = {
+            cls: 'x-list-wrap'
+        };
+        Ext.list.ListView.superclass.onRender.apply(this, arguments);
+
+        this.internalTpl.overwrite(this.el, {columns: this.columns});
+
+        this.innerBody = Ext.get(this.el.dom.childNodes[1].firstChild);
+        this.innerHd = Ext.get(this.el.dom.firstChild.firstChild);
+
+        if(this.hideHeaders){
+            this.el.dom.firstChild.style.display = 'none';
+        }
+    },
+
+    getTemplateTarget : function(){
+        return this.innerBody;
+    },
+
+    
+    collectData : function(){
+        var rs = Ext.list.ListView.superclass.collectData.apply(this, arguments);
+        return {
+            columns: this.columns,
+            rows: rs
+        };
+    },
+
+    verifyInternalSize : function(){
+        if(this.lastSize){
+            this.onResize(this.lastSize.width, this.lastSize.height);
+        }
+    },
+
+    
+    onResize : function(w, h){
+        var body = this.innerBody.dom,
+            header = this.innerHd.dom,
+            scrollWidth = w - Ext.num(this.scrollOffset, Ext.getScrollBarWidth()) + 'px',
+            parentNode;
+            
+        if(!body){
+            return;
+        }
+        parentNode = body.parentNode;
+        if(Ext.isNumber(w)){
+            if(this.reserveScrollOffset || ((parentNode.offsetWidth - parentNode.clientWidth) > 10)){
+                body.style.width = scrollWidth;
+                header.style.width = scrollWidth;
+            }else{
+                body.style.width = w + 'px';
+                header.style.width = w + 'px';
+                setTimeout(function(){
+                    if((parentNode.offsetWidth - parentNode.clientWidth) > 10){
+                        body.style.width = scrollWidth;
+                        header.style.width = scrollWidth;
+                    }
+                }, 10);
+            }
+        }
+        if(Ext.isNumber(h)){
+            parentNode.style.height = Math.max(0, h - header.parentNode.offsetHeight) + 'px';
+        }
+    },
+
+    updateIndexes : function(){
+        Ext.list.ListView.superclass.updateIndexes.apply(this, arguments);
+        this.verifyInternalSize();
+    },
+
+    findHeaderIndex : function(header){
+        header = header.dom || header;
+        var parentNode = header.parentNode, 
+            children = parentNode.parentNode.childNodes,
+            i = 0,
+            c;
+        for(; c = children[i]; i++){
+            if(c == parentNode){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    setHdWidths : function(){
+        var els = this.innerHd.dom.getElementsByTagName('div'),
+            i = 0,
+            columns = this.columns,
+            len = columns.length;
+            
+        for(; i < len; i++){
+            els[i].style.width = (columns[i].width*100) + '%';
+        }
+    }
+});
+
+Ext.reg('listview', Ext.list.ListView);
+
+
+Ext.ListView = Ext.list.ListView;
+Ext.list.Column = Ext.extend(Object, {
+    
+    isColumn: true,
+    
+            
+    align: 'left',
+        
+    header: '',
+    
+        
+    width: null,
+
+    
+    cls: '',
+    
+    
+
+    
+    
+    constructor : function(c){
+        if(!c.tpl){
+            c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');
+        }
+        else if(Ext.isString(c.tpl)){
+            c.tpl = new Ext.XTemplate(c.tpl);
+        }
+        
+        Ext.apply(this, c);
+    }
+});
+
+Ext.reg('lvcolumn', Ext.list.Column);
+
+
+Ext.list.NumberColumn = Ext.extend(Ext.list.Column, {
+        
+    format: '0,000.00',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':number("' + (c.format || this.format) + '")}');       
+        Ext.list.NumberColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvnumbercolumn', Ext.list.NumberColumn);
+
+
+Ext.list.DateColumn = Ext.extend(Ext.list.Column, {
+    format: 'm/d/Y',
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':date("' + (c.format || this.format) + '")}');      
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+Ext.reg('lvdatecolumn', Ext.list.DateColumn);
+
+
+Ext.list.BooleanColumn = Ext.extend(Ext.list.Column, {
+    
+    trueText: 'true',
+    
+    falseText: 'false',
+    
+    undefinedText: '&#160;',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}');
+        
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        c.tpl.format = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+        
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvbooleancolumn', Ext.list.BooleanColumn);
+Ext.list.ColumnResizer = Ext.extend(Ext.util.Observable, {
+    
+    minPct: .05,
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.ColumnResizer.superclass.constructor.call(this);
+    },
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeStart.createDelegate(this),
+            onStart: this.onStart.createDelegate(this),
+            onDrag: this.onDrag.createDelegate(this),
+            onEnd: this.onEnd.createDelegate(this),
+            tolerance: 3,
+            autoStart: 300
+        });
+        this.tracker.initEl(view.innerHd);
+        view.on('beforedestroy', this.tracker.destroy, this.tracker);
+    },
+
+    handleHdMove : function(e, t){
+        var handleWidth = 5,
+            x = e.getPageX(),
+            header = e.getTarget('em', 3, true);
+        if(header){
+            var region = header.getRegion(),
+                style = header.dom.style,
+                parentNode = header.dom.parentNode;
+
+            if(x - region.left <= handleWidth && parentNode != parentNode.parentNode.firstChild){
+                this.activeHd = Ext.get(parentNode.previousSibling.firstChild);
+                style.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';
+            } else if(region.right - x <= handleWidth && parentNode != parentNode.parentNode.lastChild.previousSibling){
+                this.activeHd = header;
+                style.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';
+            } else{
+                delete this.activeHd;
+                style.cursor = '';
+            }
+        }
+    },
+
+    onBeforeStart : function(e){
+        this.dragHd = this.activeHd;
+        return !!this.dragHd;
+    },
+
+    onStart: function(e){
+        
+        var me = this,
+            view = me.view,
+            dragHeader = me.dragHd,
+            x = me.tracker.getXY()[0];            
+        
+        me.proxy = view.el.createChild({cls:'x-list-resizer'});
+        me.dragX = dragHeader.getX();
+        me.headerIndex = view.findHeaderIndex(dragHeader);
+        
+        me.headersDisabled = view.disableHeaders;
+        view.disableHeaders = true;
+        
+        me.proxy.setHeight(view.el.getHeight());
+        me.proxy.setX(me.dragX);
+        me.proxy.setWidth(x - me.dragX);
+        
+        this.setBoundaries();
+        
+    },
+    
+    
+    setBoundaries: function(relativeX){
+        var view = this.view,
+            headerIndex = this.headerIndex,
+            width = view.innerHd.getWidth(),
+            relativeX = view.innerHd.getX(),
+            minWidth = Math.ceil(width * this.minPct),
+            maxWidth = width - minWidth,
+            numColumns = view.columns.length,
+            headers = view.innerHd.select('em', true),
+            minX = minWidth + relativeX,
+            maxX = maxWidth + relativeX,
+            header;
+          
+        if (numColumns == 2) {
+            this.minX = minX;
+            this.maxX = maxX;
+        }else{
+            header = headers.item(headerIndex + 2);
+            this.minX = headers.item(headerIndex).getX() + minWidth;
+            this.maxX = header ? header.getX() - minWidth : maxX;
+            if (headerIndex == 0) {
+                
+                this.minX = minX;
+            } else if (headerIndex == numColumns - 2) {
+                
+                this.maxX = maxX;
+            }
+        }
+    },
+
+    onDrag: function(e){
+        var me = this,
+            cursorX = me.tracker.getXY()[0].constrain(me.minX, me.maxX);
+            
+        me.proxy.setWidth(cursorX - this.dragX);
+    },
+
+    onEnd: function(e){
+        
+        var newWidth = this.proxy.getWidth(),
+            index = this.headerIndex,
+            view = this.view,
+            columns = view.columns,
+            width = view.innerHd.getWidth(),
+            newPercent = Math.ceil(newWidth * view.maxColumnWidth / width) / 100,
+            disabled = this.headersDisabled,
+            headerCol = columns[index],
+            otherCol = columns[index + 1],
+            totalPercent = headerCol.width + otherCol.width;
+
+        this.proxy.remove();
+
+        headerCol.width = newPercent;
+        otherCol.width = totalPercent - newPercent;
+      
+        delete this.dragHd;
+        view.setHdWidths();
+        view.refresh();
+        
+        setTimeout(function(){
+            view.disableHeaders = disabled;
+        }, 100);
+    }
+});
+
+
+Ext.ListView.ColumnResizer = Ext.list.ColumnResizer;
+Ext.list.Sorter = Ext.extend(Ext.util.Observable, {
+    
+    sortClasses : ["sort-asc", "sort-desc"],
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.Sorter.superclass.constructor.call(this);
+    },
+
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'click', this.onHdClick, this);
+        view.innerHd.setStyle('cursor', 'pointer');
+        view.mon(view.store, 'datachanged', this.updateSortState, this);
+        this.updateSortState.defer(10, this, [view.store]);
+    },
+
+    updateSortState : function(store){
+        var state = store.getSortState();
+        if(!state){
+            return;
+        }
+        this.sortState = state;
+        var cs = this.view.columns, sortColumn = -1;
+        for(var i = 0, len = cs.length; i < len; i++){
+            if(cs[i].dataIndex == state.field){
+                sortColumn = i;
+                break;
+            }
+        }
+        if(sortColumn != -1){
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    updateSortIcon : function(col, dir){
+        var sc = this.sortClasses;
+        var hds = this.view.innerHd.select('em').removeClass(sc);
+        hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);
+    },
+
+    onHdClick : function(e){
+        var hd = e.getTarget('em', 3);
+        if(hd && !this.view.disableHeaders){
+            var index = this.view.findHeaderIndex(hd);
+            this.view.store.sort(this.view.columns[index].dataIndex);
+        }
+    }
+});
+
+
+Ext.ListView.Sorter = Ext.list.Sorter;
+Ext.TabPanel = Ext.extend(Ext.Panel,  {
+    
+    
+    
+    deferredRender : true,
+    
+    tabWidth : 120,
+    
+    minTabWidth : 30,
+    
+    resizeTabs : false,
+    
+    enableTabScroll : false,
+    
+    scrollIncrement : 0,
+    
+    scrollRepeatInterval : 400,
+    
+    scrollDuration : 0.35,
+    
+    animScroll : true,
+    
+    tabPosition : 'top',
+    
+    baseCls : 'x-tab-panel',
+    
+    autoTabs : false,
+    
+    autoTabSelector : 'div.x-tab',
+    
+    activeTab : undefined,
+    
+    tabMargin : 2,
+    
+    plain : false,
+    
+    wheelIncrement : 20,
+
+    
+    idDelimiter : '__',
+
+    
+    itemCls : 'x-tab-item',
+
+    
+    elements : 'body',
+    headerAsText : false,
+    frame : false,
+    hideBorders :true,
+
+    
+    initComponent : function(){
+        this.frame = false;
+        Ext.TabPanel.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'beforetabchange',
+            
+            'tabchange',
+            
+            'contextmenu'
+        );
+        
+        this.setLayout(new Ext.layout.CardLayout(Ext.apply({
+            layoutOnCardChange: this.layoutOnTabChange,
+            deferredRender: this.deferredRender
+        }, this.layoutConfig)));
+
+        if(this.tabPosition == 'top'){
+            this.elements += ',header';
+            this.stripTarget = 'header';
+        }else {
+            this.elements += ',footer';
+            this.stripTarget = 'footer';
+        }
+        if(!this.stack){
+            this.stack = Ext.TabPanel.AccessStack();
+        }
+        this.initItems();
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.TabPanel.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            var pos = this.tabPosition == 'top' ? 'header' : 'footer';
+            this[pos].addClass('x-tab-panel-'+pos+'-plain');
+        }
+
+        var st = this[this.stripTarget];
+
+        this.stripWrap = st.createChild({cls:'x-tab-strip-wrap', cn:{
+            tag:'ul', cls:'x-tab-strip x-tab-strip-'+this.tabPosition}});
+
+        var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);
+        st.createChild({cls:'x-tab-strip-spacer'}, beforeEl);
+        this.strip = new Ext.Element(this.stripWrap.dom.firstChild);
+
+        
+        this.edge = this.strip.createChild({tag:'li', cls:'x-tab-edge', cn: [{tag: 'span', cls: 'x-tab-strip-text', cn: '&#160;'}]});
+        this.strip.createChild({cls:'x-clear'});
+
+        this.body.addClass('x-tab-panel-body-'+this.tabPosition);
+
+        
+        if(!this.itemTpl){
+            var tt = new Ext.Template(
+                 '<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>',
+                 '<a class="x-tab-right" href="#"><em class="x-tab-left">',
+                 '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',
+                 '</em></a></li>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.TabPanel.prototype.itemTpl = tt;
+        }
+
+        this.items.each(this.initTab, this);
+    },
+
+    
+    afterRender : function(){
+        Ext.TabPanel.superclass.afterRender.call(this);
+        if(this.autoTabs){
+            this.readTabs(false);
+        }
+        if(this.activeTab !== undefined){
+            var item = Ext.isObject(this.activeTab) ? this.activeTab : this.items.get(this.activeTab);
+            delete this.activeTab;
+            this.setActiveTab(item);
+        }
+    },
+
+    
+    initEvents : function(){
+        Ext.TabPanel.superclass.initEvents.call(this);
+        this.mon(this.strip, {
+            scope: this,
+            mousedown: this.onStripMouseDown,
+            contextmenu: this.onStripContextMenu
+        });
+        if(this.enableTabScroll){
+            this.mon(this.strip, 'mousewheel', this.onWheel, this);
+        }
+    },
+
+    
+    findTargets : function(e){
+        var item = null,
+            itemEl = e.getTarget('li:not(.x-tab-edge)', this.strip);
+
+        if(itemEl){
+            item = this.getComponent(itemEl.id.split(this.idDelimiter)[1]);
+            if(item.disabled){
+                return {
+                    close : null,
+                    item : null,
+                    el : null
+                };
+            }
+        }
+        return {
+            close : e.getTarget('.x-tab-strip-close', this.strip),
+            item : item,
+            el : itemEl
+        };
+    },
+
+    
+    onStripMouseDown : function(e){
+        if(e.button !== 0){
+            return;
+        }
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.close){
+            if (t.item.fireEvent('beforeclose', t.item) !== false) {
+                t.item.fireEvent('close', t.item);
+                this.remove(t.item);
+            }
+            return;
+        }
+        if(t.item && t.item != this.activeTab){
+            this.setActiveTab(t.item);
+        }
+    },
+
+    
+    onStripContextMenu : function(e){
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.item){
+            this.fireEvent('contextmenu', this, t.item, e);
+        }
+    },
+
+    
+    readTabs : function(removeExisting){
+        if(removeExisting === true){
+            this.items.each(function(item){
+                this.remove(item);
+            }, this);
+        }
+        var tabs = this.el.query(this.autoTabSelector);
+        for(var i = 0, len = tabs.length; i < len; i++){
+            var tab = tabs[i],
+                title = tab.getAttribute('title');
+            tab.removeAttribute('title');
+            this.add({
+                title: title,
+                contentEl: tab
+            });
+        }
+    },
+
+    
+    initTab : function(item, index){
+        var before = this.strip.dom.childNodes[index],
+            p = this.getTemplateArgs(item),
+            el = before ?
+                 this.itemTpl.insertBefore(before, p) :
+                 this.itemTpl.append(this.strip, p),
+            cls = 'x-tab-strip-over',
+            tabEl = Ext.get(el);
+
+        tabEl.hover(function(){
+            if(!item.disabled){
+                tabEl.addClass(cls);
+            }
+        }, function(){
+            tabEl.removeClass(cls);
+        });
+
+        if(item.tabTip){
+            tabEl.child('span.x-tab-strip-text', true).qtip = item.tabTip;
+        }
+        item.tabEl = el;
+
+        
+        tabEl.select('a').on('click', function(e){
+            if(!e.getPageX()){
+                this.onStripMouseDown(e);
+            }
+        }, this, {preventDefault: true});
+
+        item.on({
+            scope: this,
+            disable: this.onItemDisabled,
+            enable: this.onItemEnabled,
+            titlechange: this.onItemTitleChanged,
+            iconchange: this.onItemIconChanged,
+            beforeshow: this.onBeforeShowItem
+        });
+    },
+
+
+
+    
+    getTemplateArgs : function(item) {
+        var cls = item.closable ? 'x-tab-strip-closable' : '';
+        if(item.disabled){
+            cls += ' x-item-disabled';
+        }
+        if(item.iconCls){
+            cls += ' x-tab-with-icon';
+        }
+        if(item.tabCls){
+            cls += ' ' + item.tabCls;
+        }
+
+        return {
+            id: this.id + this.idDelimiter + item.getItemId(),
+            text: item.title,
+            cls: cls,
+            iconCls: item.iconCls || ''
+        };
+    },
+
+    
+    onAdd : function(c){
+        Ext.TabPanel.superclass.onAdd.call(this, c);
+        if(this.rendered){
+            var items = this.items;
+            this.initTab(c, items.indexOf(c));
+            this.delegateUpdates();
+        }
+    },
+
+    
+    onBeforeAdd : function(item){
+        var existing = item.events ? (this.items.containsKey(item.getItemId()) ? item : null) : this.items.get(item);
+        if(existing){
+            this.setActiveTab(item);
+            return false;
+        }
+        Ext.TabPanel.superclass.onBeforeAdd.apply(this, arguments);
+        var es = item.elements;
+        item.elements = es ? es.replace(',header', '') : es;
+        item.border = (item.border === true);
+    },
+
+    
+    onRemove : function(c){
+        var te = Ext.get(c.tabEl);
+        
+        if(te){
+            te.select('a').removeAllListeners();
+            Ext.destroy(te);
+        }
+        Ext.TabPanel.superclass.onRemove.call(this, c);
+        this.stack.remove(c);
+        delete c.tabEl;
+        c.un('disable', this.onItemDisabled, this);
+        c.un('enable', this.onItemEnabled, this);
+        c.un('titlechange', this.onItemTitleChanged, this);
+        c.un('iconchange', this.onItemIconChanged, this);
+        c.un('beforeshow', this.onBeforeShowItem, this);
+        if(c == this.activeTab){
+            var next = this.stack.next();
+            if(next){
+                this.setActiveTab(next);
+            }else if(this.items.getCount() > 0){
+                this.setActiveTab(0);
+            }else{
+                this.setActiveTab(null);
+            }
+        }
+        if(!this.destroying){
+            this.delegateUpdates();
+        }
+    },
+
+    
+    onBeforeShowItem : function(item){
+        if(item != this.activeTab){
+            this.setActiveTab(item);
+            return false;
+        }
+    },
+
+    
+    onItemDisabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).addClass('x-item-disabled');
+        }
+        this.stack.remove(item);
+    },
+
+    
+    onItemEnabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).removeClass('x-item-disabled');
+        }
+    },
+
+    
+    onItemTitleChanged : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).child('span.x-tab-strip-text', true).innerHTML = item.title;
+        }
+    },
+
+    
+    onItemIconChanged : function(item, iconCls, oldCls){
+        var el = this.getTabEl(item);
+        if(el){
+            el = Ext.get(el);
+            el.child('span.x-tab-strip-text').replaceClass(oldCls, iconCls);
+            el[Ext.isEmpty(iconCls) ? 'removeClass' : 'addClass']('x-tab-with-icon');
+        }
+    },
+
+    
+    getTabEl : function(item){
+        var c = this.getComponent(item);
+        return c ? c.tabEl : null;
+    },
+
+    
+    onResize : function(){
+        Ext.TabPanel.superclass.onResize.apply(this, arguments);
+        this.delegateUpdates();
+    },
+
+    
+    beginUpdate : function(){
+        this.suspendUpdates = true;
+    },
+
+    
+    endUpdate : function(){
+        this.suspendUpdates = false;
+        this.delegateUpdates();
+    },
+
+    
+    hideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = 'none';
+            this.delegateUpdates();
+        }
+        this.stack.remove(item);
+    },
+
+    
+    unhideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = '';
+            this.delegateUpdates();
+        }
+    },
+
+    
+    delegateUpdates : function(){
+        var rendered = this.rendered;
+        if(this.suspendUpdates){
+            return;
+        }
+        if(this.resizeTabs && rendered){
+            this.autoSizeTabs();
+        }
+        if(this.enableTabScroll && rendered){
+            this.autoScrollTabs();
+        }
+    },
+
+    
+    autoSizeTabs : function(){
+        var count = this.items.length,
+            ce = this.tabPosition != 'bottom' ? 'header' : 'footer',
+            ow = this[ce].dom.offsetWidth,
+            aw = this[ce].dom.clientWidth;
+
+        if(!this.resizeTabs || count < 1 || !aw){ 
+            return;
+        }
+
+        var each = Math.max(Math.min(Math.floor((aw-4) / count) - this.tabMargin, this.tabWidth), this.minTabWidth); 
+        this.lastTabWidth = each;
+        var lis = this.strip.query('li:not(.x-tab-edge)');
+        for(var i = 0, len = lis.length; i < len; i++) {
+            var li = lis[i],
+                inner = Ext.fly(li).child('.x-tab-strip-inner', true),
+                tw = li.offsetWidth,
+                iw = inner.offsetWidth;
+            inner.style.width = (each - (tw-iw)) + 'px';
+        }
+    },
+
+    
+    adjustBodyWidth : function(w){
+        if(this.header){
+            this.header.setWidth(w);
+        }
+        if(this.footer){
+            this.footer.setWidth(w);
+        }
+        return w;
+    },
+
+    
+    setActiveTab : function(item){
+        item = this.getComponent(item);
+        if(this.fireEvent('beforetabchange', this, item, this.activeTab) === false){
+            return;
+        }
+        if(!this.rendered){
+            this.activeTab = item;
+            return;
+        }
+        if(this.activeTab != item){
+            if(this.activeTab){
+                var oldEl = this.getTabEl(this.activeTab);
+                if(oldEl){
+                    Ext.fly(oldEl).removeClass('x-tab-strip-active');
+                }
+            }
+            this.activeTab = item;
+            if(item){
+                var el = this.getTabEl(item);
+                Ext.fly(el).addClass('x-tab-strip-active');
+                this.stack.add(item);
+
+                this.layout.setActiveItem(item);
+                
+                this.delegateUpdates();
+                if(this.scrolling){
+                    this.scrollToTab(item, this.animScroll);
+                }
+            }
+            this.fireEvent('tabchange', this, item);
+        }
+    },
+
+    
+    getActiveTab : function(){
+        return this.activeTab || null;
+    },
+
+    
+    getItem : function(item){
+        return this.getComponent(item);
+    },
+
+    
+    autoScrollTabs : function(){
+        this.pos = this.tabPosition=='bottom' ? this.footer : this.header;
+        var count = this.items.length,
+            ow = this.pos.dom.offsetWidth,
+            tw = this.pos.dom.clientWidth,
+            wrap = this.stripWrap,
+            wd = wrap.dom,
+            cw = wd.offsetWidth,
+            pos = this.getScrollPos(),
+            l = this.edge.getOffsetsTo(this.stripWrap)[0] + pos;
+
+        if(!this.enableTabScroll || cw < 20){ 
+            return;
+        }
+        if(count == 0 || l <= tw){
+            
+            wd.scrollLeft = 0;
+            wrap.setWidth(tw);
+            if(this.scrolling){
+                this.scrolling = false;
+                this.pos.removeClass('x-tab-scrolling');
+                this.scrollLeft.hide();
+                this.scrollRight.hide();
+                
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '';
+                    wd.style.marginRight = '';
+                }
+            }
+        }else{
+            if(!this.scrolling){
+                this.pos.addClass('x-tab-scrolling');
+                
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '18px';
+                    wd.style.marginRight = '18px';
+                }
+            }
+            tw -= wrap.getMargins('lr');
+            wrap.setWidth(tw > 20 ? tw : 20);
+            if(!this.scrolling){
+                if(!this.scrollLeft){
+                    this.createScrollers();
+                }else{
+                    this.scrollLeft.show();
+                    this.scrollRight.show();
+                }
+            }
+            this.scrolling = true;
+            if(pos > (l-tw)){ 
+                wd.scrollLeft = l-tw;
+            }else{ 
+                this.scrollToTab(this.activeTab, false);
+            }
+            this.updateScrollButtons();
+        }
+    },
+
+    
+    createScrollers : function(){
+        this.pos.addClass('x-tab-scrolling-' + this.tabPosition);
+        var h = this.stripWrap.dom.offsetHeight;
+
+        
+        var sl = this.pos.insertFirst({
+            cls:'x-tab-scroller-left'
+        });
+        sl.setHeight(h);
+        sl.addClassOnOver('x-tab-scroller-left-over');
+        this.leftRepeater = new Ext.util.ClickRepeater(sl, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollLeft,
+            scope: this
+        });
+        this.scrollLeft = sl;
+
+        
+        var sr = this.pos.insertFirst({
+            cls:'x-tab-scroller-right'
+        });
+        sr.setHeight(h);
+        sr.addClassOnOver('x-tab-scroller-right-over');
+        this.rightRepeater = new Ext.util.ClickRepeater(sr, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollRight,
+            scope: this
+        });
+        this.scrollRight = sr;
+    },
+
+    
+    getScrollWidth : function(){
+        return this.edge.getOffsetsTo(this.stripWrap)[0] + this.getScrollPos();
+    },
+
+    
+    getScrollPos : function(){
+        return parseInt(this.stripWrap.dom.scrollLeft, 10) || 0;
+    },
+
+    
+    getScrollArea : function(){
+        return parseInt(this.stripWrap.dom.clientWidth, 10) || 0;
+    },
+
+    
+    getScrollAnim : function(){
+        return {duration:this.scrollDuration, callback: this.updateScrollButtons, scope: this};
+    },
+
+    
+    getScrollIncrement : function(){
+        return this.scrollIncrement || (this.resizeTabs ? this.lastTabWidth+2 : 100);
+    },
+
+    
+
+    scrollToTab : function(item, animate){
+        if(!item){
+            return;
+        }
+        var el = this.getTabEl(item),
+            pos = this.getScrollPos(),
+            area = this.getScrollArea(),
+            left = Ext.fly(el).getOffsetsTo(this.stripWrap)[0] + pos,
+            right = left + el.offsetWidth;
+        if(left < pos){
+            this.scrollTo(left, animate);
+        }else if(right > (pos + area)){
+            this.scrollTo(right - area, animate);
+        }
+    },
+
+    
+    scrollTo : function(pos, animate){
+        this.stripWrap.scrollTo('left', pos, animate ? this.getScrollAnim() : false);
+        if(!animate){
+            this.updateScrollButtons();
+        }
+    },
+
+    onWheel : function(e){
+        var d = e.getWheelDelta()*this.wheelIncrement*-1;
+        e.stopEvent();
+
+        var pos = this.getScrollPos(),
+            newpos = pos + d,
+            sw = this.getScrollWidth()-this.getScrollArea();
+
+        var s = Math.max(0, Math.min(sw, newpos));
+        if(s != pos){
+            this.scrollTo(s, false);
+        }
+    },
+
+    
+    onScrollRight : function(){
+        var sw = this.getScrollWidth()-this.getScrollArea(),
+            pos = this.getScrollPos(),
+            s = Math.min(sw, pos + this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    
+    onScrollLeft : function(){
+        var pos = this.getScrollPos(),
+            s = Math.max(0, pos - this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    
+    updateScrollButtons : function(){
+        var pos = this.getScrollPos();
+        this.scrollLeft[pos === 0 ? 'addClass' : 'removeClass']('x-tab-scroller-left-disabled');
+        this.scrollRight[pos >= (this.getScrollWidth()-this.getScrollArea()) ? 'addClass' : 'removeClass']('x-tab-scroller-right-disabled');
+    },
+
+    
+    beforeDestroy : function() {
+        Ext.destroy(this.leftRepeater, this.rightRepeater);
+        this.deleteMembers('strip', 'edge', 'scrollLeft', 'scrollRight', 'stripWrap');
+        this.activeTab = null;
+        Ext.TabPanel.superclass.beforeDestroy.apply(this);
+    }
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+});
+Ext.reg('tabpanel', Ext.TabPanel);
+
+
+Ext.TabPanel.prototype.activate = Ext.TabPanel.prototype.setActiveTab;
+
+
+Ext.TabPanel.AccessStack = function(){
+    var items = [];
+    return {
+        add : function(item){
+            items.push(item);
+            if(items.length > 10){
+                items.shift();
+            }
+        },
+
+        remove : function(item){
+            var s = [];
+            for(var i = 0, len = items.length; i < len; i++) {
+                if(items[i] != item){
+                    s.push(items[i]);
+                }
+            }
+            items = s;
+        },
+
+        next : function(){
+            return items.pop();
+        }
+    };
+};
+
+Ext.Button = Ext.extend(Ext.BoxComponent, {
+    
+    hidden : false,
+    
+    disabled : false,
+    
+    pressed : false,
+
+    
+
+    
+
+    
+    enableToggle : false,
+    
+    
+    
+    menuAlign : 'tl-bl?',
+
+    
+    
+    
+    type : 'button',
+
+    
+    menuClassTarget : 'tr:nth(2)',
+
+    
+    clickEvent : 'click',
+
+    
+    handleMouseEvents : true,
+
+    
+    tooltipType : 'qtip',
+
+    
+    buttonSelector : 'button:first-child',
+
+    
+    scale : 'small',
+
+    
+
+    
+    iconAlign : 'left',
+
+    
+    arrowAlign : 'right',
+
+    
+    
+    
+    
+
+    initComponent : function(){
+        if(this.menu){
+            
+            
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            
+            
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+        
+        Ext.Button.superclass.initComponent.call(this);
+
+        this.addEvents(
+            
+            'click',
+            
+            'toggle',
+            
+            'mouseover',
+            
+            'mouseout',
+            
+            'menushow',
+            
+            'menuhide',
+            
+            'menutriggerover',
+            
+            'menutriggerout'
+        );
+        
+        if(Ext.isString(this.toggleGroup)){
+            this.enableToggle = true;
+        }
+    },
+
+
+    getTemplateArgs : function(){
+        return [this.type, 'x-btn-' + this.scale + ' x-btn-icon-' + this.scale + '-' + this.iconAlign, this.getMenuClass(), this.cls, this.id];
+    },
+
+    
+    setButtonClass : function(){
+        if(this.useSetClass){
+            if(!Ext.isEmpty(this.oldCls)){
+                this.el.removeClass([this.oldCls, 'x-btn-pressed']);
+            }
+            this.oldCls = (this.iconCls || this.icon) ? (this.text ? 'x-btn-text-icon' : 'x-btn-icon') : 'x-btn-noicon';
+            this.el.addClass([this.oldCls, this.pressed ? 'x-btn-pressed' : null]);
+        }
+    },
+
+    
+    getMenuClass : function(){
+        return this.menu ? (this.arrowAlign != 'bottom' ? 'x-btn-arrow' : 'x-btn-arrow-bottom') : '';
+    },
+
+    
+    onRender : function(ct, position){
+        if(!this.template){
+            if(!Ext.Button.buttonTemplate){
+                
+                Ext.Button.buttonTemplate = new Ext.Template(
+                    '<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
+                    '<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',
+                    '</tbody></table>');
+                Ext.Button.buttonTemplate.compile();
+            }
+            this.template = Ext.Button.buttonTemplate;
+        }
+
+        var btn, targs = this.getTemplateArgs();
+
+        if(position){
+            btn = this.template.insertBefore(position, targs, true);
+        }else{
+            btn = this.template.append(ct, targs, true);
+        }
+        
+        this.btnEl = btn.child(this.buttonSelector);
+        this.mon(this.btnEl, {
+            scope: this,
+            focus: this.onFocus,
+            blur: this.onBlur
+        });
+
+        this.initButtonEl(btn, this.btnEl);
+
+        Ext.ButtonToggleMgr.register(this);
+    },
+
+    
+    initButtonEl : function(btn, btnEl){
+        this.el = btn;
+        this.setIcon(this.icon);
+        this.setText(this.text);
+        this.setIconClass(this.iconCls);
+        if(Ext.isDefined(this.tabIndex)){
+            btnEl.dom.tabIndex = this.tabIndex;
+        }
+        if(this.tooltip){
+            this.setTooltip(this.tooltip, true);
+        }
+
+        if(this.handleMouseEvents){
+            this.mon(btn, {
+                scope: this,
+                mouseover: this.onMouseOver,
+                mousedown: this.onMouseDown
+            });
+
+            
+            
+        }
+
+        if(this.menu){
+            this.mon(this.menu, {
+                scope: this,
+                show: this.onMenuShow,
+                hide: this.onMenuHide
+            });
+        }
+
+        if(this.repeat){
+            var repeater = new Ext.util.ClickRepeater(btn, Ext.isObject(this.repeat) ? this.repeat : {});
+            this.mon(repeater, 'click', this.onRepeatClick, this);
+        }else{
+            this.mon(btn, this.clickEvent, this.onClick, this);
+        }
+    },
+
+    
+    afterRender : function(){
+        Ext.Button.superclass.afterRender.call(this);
+        this.useSetClass = true;
+        this.setButtonClass();
+        this.doc = Ext.getDoc();
+        this.doAutoWidth();
+    },
+
+    
+    setIconClass : function(cls){
+        this.iconCls = cls;
+        if(this.el){
+            this.btnEl.dom.className = '';
+            this.btnEl.addClass(['x-btn-text', cls || '']);
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    
+    setTooltip : function(tooltip,  initial){
+        if(this.rendered){
+            if(!initial){
+                this.clearTip();
+            }
+            if(Ext.isObject(tooltip)){
+                Ext.QuickTips.register(Ext.apply({
+                      target: this.btnEl.id
+                }, tooltip));
+                this.tooltip = tooltip;
+            }else{
+                this.btnEl.dom[this.tooltipType] = tooltip;
+            }
+        }else{
+            this.tooltip = tooltip;
+        }
+        return this;
+    },
+
+    
+    clearTip : function(){
+        if(Ext.isObject(this.tooltip)){
+            Ext.QuickTips.unregister(this.btnEl);
+        }
+    },
+
+    
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.clearTip();
+        }
+        if(this.menu && this.destroyMenu !== false) {
+            Ext.destroy(this.btnEl, this.menu);
+        }
+        Ext.destroy(this.repeater);
+    },
+
+    
+    onDestroy : function(){
+        if(this.rendered){
+            this.doc.un('mouseover', this.monitorMouseOver, this);
+            this.doc.un('mouseup', this.onMouseUp, this);
+            delete this.doc;
+            delete this.btnEl;
+            Ext.ButtonToggleMgr.unregister(this);
+        }
+        Ext.Button.superclass.onDestroy.call(this);
+    },
+
+    
+    doAutoWidth : function(){
+        if(this.autoWidth !== false && this.el && this.text && this.width === undefined){
+            this.el.setWidth('auto');
+            if(Ext.isIE7 && Ext.isStrict){
+                var ib = this.btnEl;
+                if(ib && ib.getWidth() > 20){
+                    ib.clip();
+                    ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));
+                }
+            }
+            if(this.minWidth){
+                if(this.el.getWidth() < this.minWidth){
+                    this.el.setWidth(this.minWidth);
+                }
+            }
+        }
+    },
+
+    
+    setHandler : function(handler, scope){
+        this.handler = handler;
+        this.scope = scope;
+        return this;
+    },
+
+    
+    setText : function(text){
+        this.text = text;
+        if(this.el){
+            this.btnEl.update(text || '&#160;');
+            this.setButtonClass();
+        }
+        this.doAutoWidth();
+        return this;
+    },
+
+    
+    setIcon : function(icon){
+        this.icon = icon;
+        if(this.el){
+            this.btnEl.setStyle('background-image', icon ? 'url(' + icon + ')' : '');
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    
+    getText : function(){
+        return this.text;
+    },
+
+    
+    toggle : function(state, suppressEvent){
+        state = state === undefined ? !this.pressed : !!state;
+        if(state != this.pressed){
+            if(this.rendered){
+                this.el[state ? 'addClass' : 'removeClass']('x-btn-pressed');
+            }
+            this.pressed = state;
+            if(!suppressEvent){
+                this.fireEvent('toggle', this, state);
+                if(this.toggleHandler){
+                    this.toggleHandler.call(this.scope || this, this, state);
+                }
+            }
+        }
+        return this;
+    },
+
+    
+    onDisable : function(){
+        this.onDisableChange(true);
+    },
+
+    
+    onEnable : function(){
+        this.onDisableChange(false);
+    },
+
+    onDisableChange : function(disabled){
+        if(this.el){
+            if(!Ext.isIE6 || !this.text){
+                this.el[disabled ? 'addClass' : 'removeClass'](this.disabledClass);
+            }
+            this.el.dom.disabled = disabled;
+        }
+        this.disabled = disabled;
+    },
+
+    
+    showMenu : function(){
+        if(this.rendered && this.menu){
+            if(this.tooltip){
+                Ext.QuickTips.getQuickTip().cancelShow(this.btnEl);
+            }
+            if(this.menu.isVisible()){
+                this.menu.hide();
+            }
+            this.menu.ownerCt = this;
+            this.menu.show(this.el, this.menuAlign);
+        }
+        return this;
+    },
+
+    
+    hideMenu : function(){
+        if(this.hasVisibleMenu()){
+            this.menu.hide();
+        }
+        return this;
+    },
+
+    
+    hasVisibleMenu : function(){
+        return this.menu && this.menu.ownerCt == this && this.menu.isVisible();
+    },
+    
+    
+    onRepeatClick : function(repeat, e){
+        this.onClick(e);
+    },
+
+    
+    onClick : function(e){
+        if(e){
+            e.preventDefault();
+        }
+        if(e.button !== 0){
+            return;
+        }
+        if(!this.disabled){
+            this.doToggle();
+            if(this.menu && !this.hasVisibleMenu() && !this.ignoreNextClick){
+                this.showMenu();
+            }
+            this.fireEvent('click', this, e);
+            if(this.handler){
+                
+                this.handler.call(this.scope || this, this, e);
+            }
+        }
+    },
+    
+    
+    doToggle: function(){
+        if (this.enableToggle && (this.allowDepress !== false || !this.pressed)) {
+            this.toggle();
+        }
+    },
+
+    
+    isMenuTriggerOver : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    
+    onMouseOver : function(e){
+        if(!this.disabled){
+            var internal = e.within(this.el,  true);
+            if(!internal){
+                this.el.addClass('x-btn-over');
+                if(!this.monitoringMouseOver){
+                    this.doc.on('mouseover', this.monitorMouseOver, this);
+                    this.monitoringMouseOver = true;
+                }
+                this.fireEvent('mouseover', this, e);
+            }
+            if(this.isMenuTriggerOver(e, internal)){
+                this.fireEvent('menutriggerover', this, this.menu, e);
+            }
+        }
+    },
+
+    
+    monitorMouseOver : function(e){
+        if(e.target != this.el.dom && !e.within(this.el)){
+            if(this.monitoringMouseOver){
+                this.doc.un('mouseover', this.monitorMouseOver, this);
+                this.monitoringMouseOver = false;
+            }
+            this.onMouseOut(e);
+        }
+    },
+
+    
+    onMouseOut : function(e){
+        var internal = e.within(this.el) && e.target != this.el.dom;
+        this.el.removeClass('x-btn-over');
+        this.fireEvent('mouseout', this, e);
+        if(this.isMenuTriggerOut(e, internal)){
+            this.fireEvent('menutriggerout', this, this.menu, e);
+        }
+    },
+
+    focus : function() {
+        this.btnEl.focus();
+    },
+
+    blur : function() {
+        this.btnEl.blur();
+    },
+
+    
+    onFocus : function(e){
+        if(!this.disabled){
+            this.el.addClass('x-btn-focus');
+        }
+    },
+    
+    onBlur : function(e){
+        this.el.removeClass('x-btn-focus');
+    },
+
+    
+    getClickEl : function(e, isUp){
+       return this.el;
+    },
+
+    
+    onMouseDown : function(e){
+        if(!this.disabled && e.button === 0){
+            this.getClickEl(e).addClass('x-btn-click');
+            this.doc.on('mouseup', this.onMouseUp, this);
+        }
+    },
+    
+    onMouseUp : function(e){
+        if(e.button === 0){
+            this.getClickEl(e, true).removeClass('x-btn-click');
+            this.doc.un('mouseup', this.onMouseUp, this);
+        }
+    },
+    
+    onMenuShow : function(e){
+        if(this.menu.ownerCt == this){
+            this.menu.ownerCt = this;
+            this.ignoreNextClick = 0;
+            this.el.addClass('x-btn-menu-active');
+            this.fireEvent('menushow', this, this.menu);
+        }
+    },
+    
+    onMenuHide : function(e){
+        if(this.menu.ownerCt == this){
+            this.el.removeClass('x-btn-menu-active');
+            this.ignoreNextClick = this.restoreClick.defer(250, this);
+            this.fireEvent('menuhide', this, this.menu);
+            delete this.menu.ownerCt;
+        }
+    },
+
+    
+    restoreClick : function(){
+        this.ignoreNextClick = 0;
+    }
+
+    
+    
+    
+    
+    
+    
+});
+Ext.reg('button', Ext.Button);
+
+
+Ext.ButtonToggleMgr = function(){
+   var groups = {};
+
+   function toggleGroup(btn, state){
+       if(state){
+           var g = groups[btn.toggleGroup];
+           for(var i = 0, l = g.length; i < l; i++){
+               if(g[i] != btn){
+                   g[i].toggle(false);
+               }
+           }
+       }
+   }
+
+   return {
+       register : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(!g){
+               g = groups[btn.toggleGroup] = [];
+           }
+           g.push(btn);
+           btn.on('toggle', toggleGroup);
+       },
+
+       unregister : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(g){
+               g.remove(btn);
+               btn.un('toggle', toggleGroup);
+           }
+       },
+
+       
+       getPressed : function(group){
+           var g = groups[group];
+           if(g){
+               for(var i = 0, len = g.length; i < len; i++){
+                   if(g[i].pressed === true){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+
+Ext.SplitButton = Ext.extend(Ext.Button, {
+	
+    arrowSelector : 'em',
+    split: true,
+
+    
+    initComponent : function(){
+        Ext.SplitButton.superclass.initComponent.call(this);
+        
+        this.addEvents("arrowclick");
+    },
+
+    
+    onRender : function(){
+        Ext.SplitButton.superclass.onRender.apply(this, arguments);
+        if(this.arrowTooltip){
+            this.el.child(this.arrowSelector).dom[this.tooltipType] = this.arrowTooltip;
+        }
+    },
+
+    
+    setArrowHandler : function(handler, scope){
+        this.arrowHandler = handler;
+        this.scope = scope;
+    },
+
+    getMenuClass : function(){
+        return 'x-btn-split' + (this.arrowAlign == 'bottom' ? '-bottom' : '');
+    },
+
+    isClickOnArrow : function(e){
+	if (this.arrowAlign != 'bottom') {
+	    var visBtn = this.el.child('em.x-btn-split');
+	    var right = visBtn.getRegion().right - visBtn.getPadding('r');
+	    return e.getPageX() > right;
+	} else {
+	    return e.getPageY() > this.btnEl.getRegion().bottom;
+	}
+    },
+
+    
+    onClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            if(this.isClickOnArrow(e)){
+                if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){
+                    this.showMenu();
+                }
+                this.fireEvent("arrowclick", this, e);
+                if(this.arrowHandler){
+                    this.arrowHandler.call(this.scope || this, this, e);
+                }
+            }else{
+                this.doToggle();
+                this.fireEvent("click", this, e);
+                if(this.handler){
+                    this.handler.call(this.scope || this, this, e);
+                }
+            }
+        }
+    },
+
+    
+    isMenuTriggerOver : function(e){
+        return this.menu && e.target.tagName == this.arrowSelector;
+    },
+
+    
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && e.target.tagName != this.arrowSelector;
+    }
+});
+
+Ext.reg('splitbutton', Ext.SplitButton);
+Ext.CycleButton = Ext.extend(Ext.SplitButton, {
+    
+    
+    
+    
+    
+    
+
+    
+    getItemText : function(item){
+        if(item && this.showText === true){
+            var text = '';
+            if(this.prependText){
+                text += this.prependText;
+            }
+            text += item.text;
+            return text;
+        }
+        return undefined;
+    },
+
+    
+    setActiveItem : function(item, suppressEvent){
+        if(!Ext.isObject(item)){
+            item = this.menu.getComponent(item);
+        }
+        if(item){
+            if(!this.rendered){
+                this.text = this.getItemText(item);
+                this.iconCls = item.iconCls;
+            }else{
+                var t = this.getItemText(item);
+                if(t){
+                    this.setText(t);
+                }
+                this.setIconClass(item.iconCls);
+            }
+            this.activeItem = item;
+            if(!item.checked){
+                item.setChecked(true, suppressEvent);
+            }
+            if(this.forceIcon){
+                this.setIconClass(this.forceIcon);
+            }
+            if(!suppressEvent){
+                this.fireEvent('change', this, item);
+            }
+        }
+    },
+
+    
+    getActiveItem : function(){
+        return this.activeItem;
+    },
+
+    
+    initComponent : function(){
+        this.addEvents(
+            
+            "change"
+        );
+
+        if(this.changeHandler){
+            this.on('change', this.changeHandler, this.scope||this);
+            delete this.changeHandler;
+        }
+
+        this.itemCount = this.items.length;
+
+        this.menu = {cls:'x-cycle-menu', items:[]};
+        var checked = 0;
+        Ext.each(this.items, function(item, i){
+            Ext.apply(item, {
+                group: item.group || this.id,
+                itemIndex: i,
+                checkHandler: this.checkHandler,
+                scope: this,
+                checked: item.checked || false
+            });
+            this.menu.items.push(item);
+            if(item.checked){
+                checked = i;
+            }
+        }, this);
+        Ext.CycleButton.superclass.initComponent.call(this);
+        this.on('click', this.toggleSelected, this);
+        this.setActiveItem(checked, true);
+    },
+
+    
+    checkHandler : function(item, pressed){
+        if(pressed){
+            this.setActiveItem(item);
+        }
+    },
+
+    
+    toggleSelected : function(){
+        var m = this.menu;
+        m.render();
+        
+        if(!m.hasLayout){
+            m.doLayout();
+        }
+        
+        var nextIdx, checkItem;
+        for (var i = 1; i < this.itemCount; i++) {
+            nextIdx = (this.activeItem.itemIndex + i) % this.itemCount;
+            
+            checkItem = m.items.itemAt(nextIdx);
+            
+            if (!checkItem.disabled) {
+                checkItem.setChecked(true);
+                break;
+            }
+        }
+    }
+});
+Ext.reg('cycle', Ext.CycleButton);
+Ext.Toolbar = function(config){
+    if(Ext.isArray(config)){
+        config = {items: config, layout: 'toolbar'};
+    } else {
+        config = Ext.apply({
+            layout: 'toolbar'
+        }, config);
+        if(config.buttons) {
+            config.items = config.buttons;
+        }
+    }
+    Ext.Toolbar.superclass.constructor.call(this, config);
+};
+
+(function(){
+
+var T = Ext.Toolbar;
+
+Ext.extend(T, Ext.Container, {
+
+    defaultType: 'button',
+
+    
+
+    enableOverflow : false,
+
+    
+    
+
+    trackMenus : true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+    toolbarCls: 'x-toolbar',
+
+    initComponent : function(){
+        T.superclass.initComponent.call(this);
+
+        
+        this.addEvents('overflowchange');
+    },
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            if(!this.autoCreate){
+                this.autoCreate = {
+                    cls: this.toolbarCls + ' x-small-editor'
+                };
+            }
+            this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);
+            Ext.Toolbar.superclass.onRender.apply(this, arguments);
+        }
+    },
+
+    
+
+    
+    lookupComponent : function(c){
+        if(Ext.isString(c)){
+            if(c == '-'){
+                c = new T.Separator();
+            }else if(c == ' '){
+                c = new T.Spacer();
+            }else if(c == '->'){
+                c = new T.Fill();
+            }else{
+                c = new T.TextItem(c);
+            }
+            this.applyDefaults(c);
+        }else{
+            if(c.isFormField || c.render){ 
+                c = this.createComponent(c);
+            }else if(c.tag){ 
+                c = new T.Item({autoEl: c});
+            }else if(c.tagName){ 
+                c = new T.Item({el:c});
+            }else if(Ext.isObject(c)){ 
+                c = c.xtype ? this.createComponent(c) : this.constructButton(c);
+            }
+        }
+        return c;
+    },
+
+    
+    applyDefaults : function(c){
+        if(!Ext.isString(c)){
+            c = Ext.Toolbar.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(c.events){
+                Ext.applyIf(c.initialConfig, d);
+                Ext.apply(c, d);
+            }else{
+                Ext.applyIf(c, d);
+            }
+        }
+        return c;
+    },
+
+    
+    addSeparator : function(){
+        return this.add(new T.Separator());
+    },
+
+    
+    addSpacer : function(){
+        return this.add(new T.Spacer());
+    },
+
+    
+    addFill : function(){
+        this.add(new T.Fill());
+    },
+
+    
+    addElement : function(el){
+        return this.addItem(new T.Item({el:el}));
+    },
+
+    
+    addItem : function(item){
+        return this.add.apply(this, arguments);
+    },
+
+    
+    addButton : function(config){
+        if(Ext.isArray(config)){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+                buttons.push(this.addButton(config[i]));
+            }
+            return buttons;
+        }
+        return this.add(this.constructButton(config));
+    },
+
+    
+    addText : function(text){
+        return this.addItem(new T.TextItem(text));
+    },
+
+    
+    addDom : function(config){
+        return this.add(new T.Item({autoEl: config}));
+    },
+
+    
+    addField : function(field){
+        return this.add(field);
+    },
+
+    
+    insertButton : function(index, item){
+        if(Ext.isArray(item)){
+            var buttons = [];
+            for(var i = 0, len = item.length; i < len; i++) {
+               buttons.push(this.insertButton(index + i, item[i]));
+            }
+            return buttons;
+        }
+        return Ext.Toolbar.superclass.insert.call(this, index, item);
+    },
+
+    
+    trackMenu : function(item, remove){
+        if(this.trackMenus && item.menu){
+            var method = remove ? 'mun' : 'mon';
+            this[method](item, 'menutriggerover', this.onButtonTriggerOver, this);
+            this[method](item, 'menushow', this.onButtonMenuShow, this);
+            this[method](item, 'menuhide', this.onButtonMenuHide, this);
+        }
+    },
+
+    
+    constructButton : function(item){
+        var b = item.events ? item : this.createComponent(item, item.split ? 'splitbutton' : this.defaultType);
+        return b;
+    },
+
+    
+    onAdd : function(c){
+        Ext.Toolbar.superclass.onAdd.call(this);
+        this.trackMenu(c);
+        if(this.disabled){
+            c.disable();
+        }
+    },
+
+    
+    onRemove : function(c){
+        Ext.Toolbar.superclass.onRemove.call(this);
+        if (c == this.activeMenuBtn) {
+            delete this.activeMenuBtn;
+        }
+        this.trackMenu(c, true);
+    },
+
+    
+    onDisable : function(){
+        this.items.each(function(item){
+             if(item.disable){
+                 item.disable();
+             }
+        });
+    },
+
+    
+    onEnable : function(){
+        this.items.each(function(item){
+             if(item.enable){
+                 item.enable();
+             }
+        });
+    },
+
+    
+    onButtonTriggerOver : function(btn){
+        if(this.activeMenuBtn && this.activeMenuBtn != btn){
+            this.activeMenuBtn.hideMenu();
+            btn.showMenu();
+            this.activeMenuBtn = btn;
+        }
+    },
+
+    
+    onButtonMenuShow : function(btn){
+        this.activeMenuBtn = btn;
+    },
+
+    
+    onButtonMenuHide : function(btn){
+        delete this.activeMenuBtn;
+    }
+});
+Ext.reg('toolbar', Ext.Toolbar);
+
+
+T.Item = Ext.extend(Ext.BoxComponent, {
+    hideParent: true, 
+    enable:Ext.emptyFn,
+    disable:Ext.emptyFn,
+    focus:Ext.emptyFn
+    
+});
+Ext.reg('tbitem', T.Item);
+
+
+T.Separator = Ext.extend(T.Item, {
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'span', cls:'xtb-sep'}, position);
+    }
+});
+Ext.reg('tbseparator', T.Separator);
+
+
+T.Spacer = Ext.extend(T.Item, {
+    
+
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'div', cls:'xtb-spacer', style: this.width?'width:'+this.width+'px':''}, position);
+    }
+});
+Ext.reg('tbspacer', T.Spacer);
+
+
+T.Fill = Ext.extend(T.Item, {
+    
+    render : Ext.emptyFn,
+    isFill : true
+});
+Ext.reg('tbfill', T.Fill);
+
+
+T.TextItem = Ext.extend(T.Item, {
+    
+
+    constructor: function(config){
+        T.TextItem.superclass.constructor.call(this, Ext.isString(config) ? {text: config} : config);
+    },
+
+    
+    onRender : function(ct, position) {
+        this.autoEl = {cls: 'xtb-text', html: this.text || ''};
+        T.TextItem.superclass.onRender.call(this, ct, position);
+    },
+
+    
+    setText : function(t) {
+        if(this.rendered){
+            this.el.update(t);
+        }else{
+            this.text = t;
+        }
+    }
+});
+Ext.reg('tbtext', T.TextItem);
+
+
+T.Button = Ext.extend(Ext.Button, {});
+T.SplitButton = Ext.extend(Ext.SplitButton, {});
+Ext.reg('tbbutton', T.Button);
+Ext.reg('tbsplit', T.SplitButton);
+
+})();
+
+Ext.ButtonGroup = Ext.extend(Ext.Panel, {
+    
+    
+    baseCls: 'x-btn-group',
+    
+    layout:'table',
+    defaultType: 'button',
+    
+    frame: true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+
+    initComponent : function(){
+        this.layoutConfig = this.layoutConfig || {};
+        Ext.applyIf(this.layoutConfig, {
+            columns : this.columns
+        });
+        if(!this.title){
+            this.addClass('x-btn-group-notitle');
+        }
+        this.on('afterlayout', this.onAfterLayout, this);
+        Ext.ButtonGroup.superclass.initComponent.call(this);
+    },
+
+    applyDefaults : function(c){
+        c = Ext.ButtonGroup.superclass.applyDefaults.call(this, c);
+        var d = this.internalDefaults;
+        if(c.events){
+            Ext.applyIf(c.initialConfig, d);
+            Ext.apply(c, d);
+        }else{
+            Ext.applyIf(c, d);
+        }
+        return c;
+    },
+
+    onAfterLayout : function(){
+        var bodyWidth = this.body.getFrameWidth('lr') + this.body.dom.firstChild.offsetWidth;
+        this.body.setWidth(bodyWidth);
+        this.el.setWidth(bodyWidth + this.getFrameWidth());
+    }
+    
+});
+
+Ext.reg('buttongroup', Ext.ButtonGroup);
+
+(function() {
+
+var T = Ext.Toolbar;
+
+Ext.PagingToolbar = Ext.extend(Ext.Toolbar, {
+    
+    
+    
+    pageSize : 20,
+    
+    
+    displayMsg : 'Displaying {0} - {1} of {2}',
+    
+    emptyMsg : 'No data to display',
+    
+    beforePageText : 'Page',
+    
+    afterPageText : 'of {0}',
+    
+    firstText : 'First Page',
+    
+    prevText : 'Previous Page',
+    
+    nextText : 'Next Page',
+    
+    lastText : 'Last Page',
+    
+    refreshText : 'Refresh',
+
+    
+
+    
+
+    
+
+    initComponent : function(){
+        var pagingItems = [this.first = new T.Button({
+            tooltip: this.firstText,
+            overflowText: this.firstText,
+            iconCls: 'x-tbar-page-first',
+            disabled: true,
+            handler: this.moveFirst,
+            scope: this
+        }), this.prev = new T.Button({
+            tooltip: this.prevText,
+            overflowText: this.prevText,
+            iconCls: 'x-tbar-page-prev',
+            disabled: true,
+            handler: this.movePrevious,
+            scope: this
+        }), '-', this.beforePageText,
+        this.inputItem = new Ext.form.NumberField({
+            cls: 'x-tbar-page-number',
+            allowDecimals: false,
+            allowNegative: false,
+            enableKeyEvents: true,
+            selectOnFocus: true,
+            submitValue: false,
+            listeners: {
+                scope: this,
+                keydown: this.onPagingKeyDown,
+                blur: this.onPagingBlur
+            }
+        }), this.afterTextItem = new T.TextItem({
+            text: String.format(this.afterPageText, 1)
+        }), '-', this.next = new T.Button({
+            tooltip: this.nextText,
+            overflowText: this.nextText,
+            iconCls: 'x-tbar-page-next',
+            disabled: true,
+            handler: this.moveNext,
+            scope: this
+        }), this.last = new T.Button({
+            tooltip: this.lastText,
+            overflowText: this.lastText,
+            iconCls: 'x-tbar-page-last',
+            disabled: true,
+            handler: this.moveLast,
+            scope: this
+        }), '-', this.refresh = new T.Button({
+            tooltip: this.refreshText,
+            overflowText: this.refreshText,
+            iconCls: 'x-tbar-loading',
+            handler: this.doRefresh,
+            scope: this
+        })];
+
+
+        var userItems = this.items || this.buttons || [];
+        if (this.prependButtons) {
+            this.items = userItems.concat(pagingItems);
+        }else{
+            this.items = pagingItems.concat(userItems);
+        }
+        delete this.buttons;
+        if(this.displayInfo){
+            this.items.push('->');
+            this.items.push(this.displayItem = new T.TextItem({}));
+        }
+        Ext.PagingToolbar.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'change',
+            
+            'beforechange'
+        );
+        this.on('afterlayout', this.onFirstLayout, this, {single: true});
+        this.cursor = 0;
+        this.bindStore(this.store, true);
+    },
+
+    
+    onFirstLayout : function(){
+        if(this.dsLoaded){
+            this.onLoad.apply(this, this.dsLoaded);
+        }
+    },
+
+    
+    updateInfo : function(){
+        if(this.displayItem){
+            var count = this.store.getCount();
+            var msg = count == 0 ?
+                this.emptyMsg :
+                String.format(
+                    this.displayMsg,
+                    this.cursor+1, this.cursor+count, this.store.getTotalCount()
+                );
+            this.displayItem.setText(msg);
+        }
+    },
+
+    
+    onLoad : function(store, r, o){
+        if(!this.rendered){
+            this.dsLoaded = [store, r, o];
+            return;
+        }
+        var p = this.getParams();
+        this.cursor = (o.params && o.params[p.start]) ? o.params[p.start] : 0;
+        var d = this.getPageData(), ap = d.activePage, ps = d.pages;
+
+        this.afterTextItem.setText(String.format(this.afterPageText, d.pages));
+        this.inputItem.setValue(ap);
+        this.first.setDisabled(ap == 1);
+        this.prev.setDisabled(ap == 1);
+        this.next.setDisabled(ap == ps);
+        this.last.setDisabled(ap == ps);
+        this.refresh.enable();
+        this.updateInfo();
+        this.fireEvent('change', this, d);
+    },
+
+    
+    getPageData : function(){
+        var total = this.store.getTotalCount();
+        return {
+            total : total,
+            activePage : Math.ceil((this.cursor+this.pageSize)/this.pageSize),
+            pages :  total < this.pageSize ? 1 : Math.ceil(total/this.pageSize)
+        };
+    },
+
+    
+    changePage : function(page){
+        this.doLoad(((page-1) * this.pageSize).constrain(0, this.store.getTotalCount()));
+    },
+
+    
+    onLoadError : function(){
+        if(!this.rendered){
+            return;
+        }
+        this.refresh.enable();
+    },
+
+    
+    readPage : function(d){
+        var v = this.inputItem.getValue(), pageNum;
+        if (!v || isNaN(pageNum = parseInt(v, 10))) {
+            this.inputItem.setValue(d.activePage);
+            return false;
+        }
+        return pageNum;
+    },
+
+    onPagingFocus : function(){
+        this.inputItem.select();
+    },
+
+    
+    onPagingBlur : function(e){
+        this.inputItem.setValue(this.getPageData().activePage);
+    },
+
+    
+    onPagingKeyDown : function(field, e){
+        var k = e.getKey(), d = this.getPageData(), pageNum;
+        if (k == e.RETURN) {
+            e.stopEvent();
+            pageNum = this.readPage(d);
+            if(pageNum !== false){
+                pageNum = Math.min(Math.max(1, pageNum), d.pages) - 1;
+                this.doLoad(pageNum * this.pageSize);
+            }
+        }else if (k == e.HOME || k == e.END){
+            e.stopEvent();
+            pageNum = k == e.HOME ? 1 : d.pages;
+            field.setValue(pageNum);
+        }else if (k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){
+            e.stopEvent();
+            if((pageNum = this.readPage(d))){
+                var increment = e.shiftKey ? 10 : 1;
+                if(k == e.DOWN || k == e.PAGEDOWN){
+                    increment *= -1;
+                }
+                pageNum += increment;
+                if(pageNum >= 1 & pageNum <= d.pages){
+                    field.setValue(pageNum);
+                }
+            }
+        }
+    },
+
+    
+    getParams : function(){
+        
+        return this.paramNames || this.store.paramNames;
+    },
+
+    
+    beforeLoad : function(){
+        if(this.rendered && this.refresh){
+            this.refresh.disable();
+        }
+    },
+
+    
+    doLoad : function(start){
+        var o = {}, pn = this.getParams();
+        o[pn.start] = start;
+        o[pn.limit] = this.pageSize;
+        if(this.fireEvent('beforechange', this, o) !== false){
+            this.store.load({params:o});
+        }
+    },
+
+    
+    moveFirst : function(){
+        this.doLoad(0);
+    },
+
+    
+    movePrevious : function(){
+        this.doLoad(Math.max(0, this.cursor-this.pageSize));
+    },
+
+    
+    moveNext : function(){
+        this.doLoad(this.cursor+this.pageSize);
+    },
+
+    
+    moveLast : function(){
+        var total = this.store.getTotalCount(),
+            extra = total % this.pageSize;
+
+        this.doLoad(extra ? (total - extra) : total - this.pageSize);
+    },
+
+    
+    doRefresh : function(){
+        this.doLoad(this.cursor);
+    },
+
+    
+    bindStore : function(store, initial){
+        var doLoad;
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.beforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.onLoadError, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.beforeLoad,
+                load: this.onLoad,
+                exception: this.onLoadError
+            });
+            doLoad = true;
+        }
+        this.store = store;
+        if(doLoad){
+            this.onLoad(store, null, {});
+        }
+    },
+
+    
+    unbind : function(store){
+        this.bindStore(null);
+    },
+
+    
+    bind : function(store){
+        this.bindStore(store);
+    },
+
+    
+    onDestroy : function(){
+        this.bindStore(null);
+        Ext.PagingToolbar.superclass.onDestroy.call(this);
+    }
+});
+
+})();
+Ext.reg('paging', Ext.PagingToolbar);
+Ext.History = (function () {
+    var iframe, hiddenField;
+    var ready = false;
+    var currentToken;
+
+    function getHash() {
+        var href = location.href, i = href.indexOf("#"),
+            hash = i >= 0 ? href.substr(i + 1) : null;
+             
+        if (Ext.isGecko) {
+            hash = decodeURIComponent(hash);
+        }
+        return hash;
+    }
+
+    function doSave() {
+        hiddenField.value = currentToken;
+    }
+
+    function handleStateChange(token) {
+        currentToken = token;
+        Ext.History.fireEvent('change', token);
+    }
+
+    function updateIFrame (token) {
+        var html = ['<html><body><div id="state">',Ext.util.Format.htmlEncode(token),'</div></body></html>'].join('');
+        try {
+            var doc = iframe.contentWindow.document;
+            doc.open();
+            doc.write(html);
+            doc.close();
+            return true;
+        } catch (e) {
+            return false;
+        }
+    }
+
+    function checkIFrame() {
+        if (!iframe.contentWindow || !iframe.contentWindow.document) {
+            setTimeout(checkIFrame, 10);
+            return;
+        }
+
+        var doc = iframe.contentWindow.document;
+        var elem = doc.getElementById("state");
+        var token = elem ? elem.innerText : null;
+
+        var hash = getHash();
+
+        setInterval(function () {
+
+            doc = iframe.contentWindow.document;
+            elem = doc.getElementById("state");
+
+            var newtoken = elem ? elem.innerText : null;
+
+            var newHash = getHash();
+
+            if (newtoken !== token) {
+                token = newtoken;
+                handleStateChange(token);
+                location.hash = token;
+                hash = token;
+                doSave();
+            } else if (newHash !== hash) {
+                hash = newHash;
+                updateIFrame(newHash);
+            }
+
+        }, 50);
+
+        ready = true;
+
+        Ext.History.fireEvent('ready', Ext.History);
+    }
+
+    function startUp() {
+        currentToken = hiddenField.value ? hiddenField.value : getHash();
+
+        if (Ext.isIE) {
+            checkIFrame();
+        } else {
+            var hash = getHash();
+            setInterval(function () {
+                var newHash = getHash();
+                if (newHash !== hash) {
+                    hash = newHash;
+                    handleStateChange(hash);
+                    doSave();
+                }
+            }, 50);
+            ready = true;
+            Ext.History.fireEvent('ready', Ext.History);
+        }
+    }
+
+    return {
+        
+        fieldId: 'x-history-field',
+        
+        iframeId: 'x-history-frame',
+
+        events:{},
+
+        
+        init: function (onReady, scope) {
+            if(ready) {
+                Ext.callback(onReady, scope, [this]);
+                return;
+            }
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.History.init(onReady, scope);
+                });
+                return;
+            }
+            hiddenField = Ext.getDom(Ext.History.fieldId);
+            if (Ext.isIE) {
+                iframe = Ext.getDom(Ext.History.iframeId);
+            }
+            this.addEvents(
+                
+                'ready',
+                
+                'change'
+            );
+            if(onReady){
+                this.on('ready', onReady, scope, {single:true});
+            }
+            startUp();
+        },
+
+        
+        add: function (token, preventDup) {
+            if(preventDup !== false){
+                if(this.getToken() == token){
+                    return true;
+                }
+            }
+            if (Ext.isIE) {
+                return updateIFrame(token);
+            } else {
+                location.hash = token;
+                return true;
+            }
+        },
+
+        
+        back: function(){
+            history.go(-1);
+        },
+
+        
+        forward: function(){
+            history.go(1);
+        },
+
+        
+        getToken: function() {
+            return ready ? currentToken : getHash();
+        }
+    };
+})();
+Ext.apply(Ext.History, new Ext.util.Observable());
+Ext.Tip = Ext.extend(Ext.Panel, {
+    
+    
+    
+    minWidth : 40,
+    
+    maxWidth : 300,
+    
+    shadow : "sides",
+    
+    defaultAlign : "tl-bl?",
+    autoRender: true,
+    quickShowInterval : 250,
+
+    
+    frame:true,
+    hidden:true,
+    baseCls: 'x-tip',
+    floating:{shadow:true,shim:true,useDisplay:true,constrain:false},
+    autoHeight:true,
+
+    closeAction: 'hide',
+
+    
+    initComponent : function(){
+        Ext.Tip.superclass.initComponent.call(this);
+        if(this.closable && !this.title){
+            this.elements += ',header';
+        }
+    },
+
+    
+    afterRender : function(){
+        Ext.Tip.superclass.afterRender.call(this);
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction],
+                scope: this
+            });
+        }
+    },
+
+    
+    showAt : function(xy){
+        Ext.Tip.superclass.show.call(this);
+        if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){
+            this.doAutoWidth();
+        }
+        if(this.constrainPosition){
+            xy = this.el.adjustForConstraints(xy);
+        }
+        this.setPagePosition(xy[0], xy[1]);
+    },
+
+    
+    doAutoWidth : function(adjust){
+        adjust = adjust || 0;
+        var bw = this.body.getTextWidth();
+        if(this.title){
+            bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));
+        }
+        bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr") + adjust;
+        this.setWidth(bw.constrain(this.minWidth, this.maxWidth));
+        
+        
+        if(Ext.isIE7 && !this.repainted){
+            this.el.repaint();
+            this.repainted = true;
+        }
+    },
+
+    
+    showBy : function(el, pos){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));
+    },
+
+    initDraggable : function(){
+        this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);
+        this.header.addClass('x-tip-draggable');
+    }
+});
+
+Ext.reg('tip', Ext.Tip);
+
+
+Ext.Tip.DD = function(tip, config){
+    Ext.apply(this, config);
+    this.tip = tip;
+    Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);
+    this.setHandleElId(tip.header.id);
+    this.scroll = false;
+};
+
+Ext.extend(Ext.Tip.DD, Ext.dd.DD, {
+    moveOnly:true,
+    scroll:false,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        this.tip.el.disableShadow();
+    },
+    endDrag : function(e){
+        this.tip.el.enableShadow(true);
+    }
+});
+Ext.ToolTip = Ext.extend(Ext.Tip, {
+    
+    
+    
+    
+    showDelay : 500,
+    
+    hideDelay : 200,
+    
+    dismissDelay : 5000,
+    
+    
+    trackMouse : false,
+    
+    anchorToTarget : true,
+    
+    anchorOffset : 0,
+    
+
+    
+    targetCounter : 0,
+
+    constrainPosition : false,
+
+    
+    initComponent : function(){
+        Ext.ToolTip.superclass.initComponent.call(this);
+        this.lastActive = new Date();
+        this.initTarget(this.target);
+        this.origAnchor = this.anchor;
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.ToolTip.superclass.onRender.call(this, ct, position);
+        this.anchorCls = 'x-tip-anchor-' + this.getAnchorPosition();
+        this.anchorEl = this.el.createChild({
+            cls: 'x-tip-anchor ' + this.anchorCls
+        });
+    },
+
+    
+    afterRender : function(){
+        Ext.ToolTip.superclass.afterRender.call(this);
+        this.anchorEl.setStyle('z-index', this.el.getZIndex() + 1).setVisibilityMode(Ext.Element.DISPLAY);
+    },
+
+    
+    initTarget : function(target){
+        var t;
+        if((t = Ext.get(target))){
+            if(this.target){
+                var tg = Ext.get(this.target);
+                this.mun(tg, 'mouseover', this.onTargetOver, this);
+                this.mun(tg, 'mouseout', this.onTargetOut, this);
+                this.mun(tg, 'mousemove', this.onMouseMove, this);
+            }
+            this.mon(t, {
+                mouseover: this.onTargetOver,
+                mouseout: this.onTargetOut,
+                mousemove: this.onMouseMove,
+                scope: this
+            });
+            this.target = t;
+        }
+        if(this.anchor){
+            this.anchorTarget = this.target;
+        }
+    },
+
+    
+    onMouseMove : function(e){
+        var t = this.delegate ? e.getTarget(this.delegate) : this.triggerElement = true;
+        if (t) {
+            this.targetXY = e.getXY();
+            if (t === this.triggerElement) {
+                if(!this.hidden && this.trackMouse){
+                    this.setPagePosition(this.getTargetXY());
+                }
+            } else {
+                this.hide();
+                this.lastActive = new Date(0);
+                this.onTargetOver(e);
+            }
+        } else if (!this.closable && this.isVisible()) {
+            this.hide();
+        }
+    },
+
+    
+    getTargetXY : function(){
+        if(this.delegate){
+            this.anchorTarget = this.triggerElement;
+        }
+        if(this.anchor){
+            this.targetCounter++;
+            var offsets = this.getOffsets(),
+                xy = (this.anchorToTarget && !this.trackMouse) ? this.el.getAlignToXY(this.anchorTarget, this.getAnchorAlign()) : this.targetXY,
+                dw = Ext.lib.Dom.getViewWidth() - 5,
+                dh = Ext.lib.Dom.getViewHeight() - 5,
+                de = document.documentElement,
+                bd = document.body,
+                scrollX = (de.scrollLeft || bd.scrollLeft || 0) + 5,
+                scrollY = (de.scrollTop || bd.scrollTop || 0) + 5,
+                axy = [xy[0] + offsets[0], xy[1] + offsets[1]],
+                sz = this.getSize();
+                
+            this.anchorEl.removeClass(this.anchorCls);
+
+            if(this.targetCounter < 2){
+                if(axy[0] < scrollX){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'l-r';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'left';
+                    return this.getTargetXY();
+                }
+                if(axy[0]+sz.width > dw){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'r-l';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'right';
+                    return this.getTargetXY();
+                }
+                if(axy[1] < scrollY){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 't-b';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'top';
+                    return this.getTargetXY();
+                }
+                if(axy[1]+sz.height > dh){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'b-t';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'bottom';
+                    return this.getTargetXY();
+                }
+            }
+
+            this.anchorCls = 'x-tip-anchor-'+this.getAnchorPosition();
+            this.anchorEl.addClass(this.anchorCls);
+            this.targetCounter = 0;
+            return axy;
+        }else{
+            var mouseOffset = this.getMouseOffset();
+            return [this.targetXY[0]+mouseOffset[0], this.targetXY[1]+mouseOffset[1]];
+        }
+    },
+
+    getMouseOffset : function(){
+        var offset = this.anchor ? [0,0] : [15,18];
+        if(this.mouseOffset){
+            offset[0] += this.mouseOffset[0];
+            offset[1] += this.mouseOffset[1];
+        }
+        return offset;
+    },
+
+    
+    getAnchorPosition : function(){
+        if(this.anchor){
+            this.tipAnchor = this.anchor.charAt(0);
+        }else{
+            var m = this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+            if(!m){
+               throw 'AnchorTip.defaultAlign is invalid';
+            }
+            this.tipAnchor = m[1].charAt(0);
+        }
+
+        switch(this.tipAnchor){
+            case 't': return 'top';
+            case 'b': return 'bottom';
+            case 'r': return 'right';
+        }
+        return 'left';
+    },
+
+    
+    getAnchorAlign : function(){
+        switch(this.anchor){
+            case 'top'  : return 'tl-bl';
+            case 'left' : return 'tl-tr';
+            case 'right': return 'tr-tl';
+            default     : return 'bl-tl';
+        }
+    },
+
+    
+    getOffsets : function(){
+        var offsets, 
+            ap = this.getAnchorPosition().charAt(0);
+        if(this.anchorToTarget && !this.trackMouse){
+            switch(ap){
+                case 't':
+                    offsets = [0, 9];
+                    break;
+                case 'b':
+                    offsets = [0, -13];
+                    break;
+                case 'r':
+                    offsets = [-13, 0];
+                    break;
+                default:
+                    offsets = [9, 0];
+                    break;
+            }
+        }else{
+            switch(ap){
+                case 't':
+                    offsets = [-15-this.anchorOffset, 30];
+                    break;
+                case 'b':
+                    offsets = [-19-this.anchorOffset, -13-this.el.dom.offsetHeight];
+                    break;
+                case 'r':
+                    offsets = [-15-this.el.dom.offsetWidth, -13-this.anchorOffset];
+                    break;
+                default:
+                    offsets = [25, -13-this.anchorOffset];
+                    break;
+            }
+        }
+        var mouseOffset = this.getMouseOffset();
+        offsets[0] += mouseOffset[0];
+        offsets[1] += mouseOffset[1];
+
+        return offsets;
+    },
+
+    
+    onTargetOver : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        var t = e.getTarget(this.delegate);
+        if (t) {
+            this.triggerElement = t;
+            this.clearTimer('hide');
+            this.targetXY = e.getXY();
+            this.delayShow();
+        }
+    },
+
+    
+    delayShow : function(){
+        if(this.hidden && !this.showTimer){
+            if(this.lastActive.getElapsed() < this.quickShowInterval){
+                this.show();
+            }else{
+                this.showTimer = this.show.defer(this.showDelay, this);
+            }
+        }else if(!this.hidden && this.autoHide !== false){
+            this.show();
+        }
+    },
+
+    
+    onTargetOut : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    
+    delayHide : function(){
+        if(!this.hidden && !this.hideTimer){
+            this.hideTimer = this.hide.defer(this.hideDelay, this);
+        }
+    },
+
+    
+    hide: function(){
+        this.clearTimer('dismiss');
+        this.lastActive = new Date();
+        if(this.anchorEl){
+            this.anchorEl.hide();
+        }
+        Ext.ToolTip.superclass.hide.call(this);
+        delete this.triggerElement;
+    },
+
+    
+    show : function(){
+        if(this.anchor){
+            
+            
+            this.showAt([-1000,-1000]);
+            this.origConstrainPosition = this.constrainPosition;
+            this.constrainPosition = false;
+            this.anchor = this.origAnchor;
+        }
+        this.showAt(this.getTargetXY());
+
+        if(this.anchor){
+            this.anchorEl.show();
+            this.syncAnchor();
+            this.constrainPosition = this.origConstrainPosition;
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    
+    showAt : function(xy){
+        this.lastActive = new Date();
+        this.clearTimers();
+        Ext.ToolTip.superclass.showAt.call(this, xy);
+        if(this.dismissDelay && this.autoHide !== false){
+            this.dismissTimer = this.hide.defer(this.dismissDelay, this);
+        }
+        if(this.anchor && !this.anchorEl.isVisible()){
+            this.syncAnchor();
+            this.anchorEl.show();
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    
+    syncAnchor : function(){
+        var anchorPos, targetPos, offset;
+        switch(this.tipAnchor.charAt(0)){
+            case 't':
+                anchorPos = 'b';
+                targetPos = 'tl';
+                offset = [20+this.anchorOffset, 2];
+                break;
+            case 'r':
+                anchorPos = 'l';
+                targetPos = 'tr';
+                offset = [-2, 11+this.anchorOffset];
+                break;
+            case 'b':
+                anchorPos = 't';
+                targetPos = 'bl';
+                offset = [20+this.anchorOffset, -2];
+                break;
+            default:
+                anchorPos = 'r';
+                targetPos = 'tl';
+                offset = [2, 11+this.anchorOffset];
+                break;
+        }
+        this.anchorEl.alignTo(this.el, anchorPos+'-'+targetPos, offset);
+    },
+
+    
+    setPagePosition : function(x, y){
+        Ext.ToolTip.superclass.setPagePosition.call(this, x, y);
+        if(this.anchor){
+            this.syncAnchor();
+        }
+    },
+
+    
+    clearTimer : function(name){
+        name = name + 'Timer';
+        clearTimeout(this[name]);
+        delete this[name];
+    },
+
+    
+    clearTimers : function(){
+        this.clearTimer('show');
+        this.clearTimer('dismiss');
+        this.clearTimer('hide');
+    },
+
+    
+    onShow : function(){
+        Ext.ToolTip.superclass.onShow.call(this);
+        Ext.getDoc().on('mousedown', this.onDocMouseDown, this);
+    },
+
+    
+    onHide : function(){
+        Ext.ToolTip.superclass.onHide.call(this);
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+    },
+
+    
+    onDocMouseDown : function(e){
+        if(this.autoHide !== true && !this.closable && !e.within(this.el.dom)){
+            this.disable();
+            this.doEnable.defer(100, this);
+        }
+    },
+    
+    
+    doEnable : function(){
+        if(!this.isDestroyed){
+            this.enable();
+        }
+    },
+
+    
+    onDisable : function(){
+        this.clearTimers();
+        this.hide();
+    },
+
+    
+    adjustPosition : function(x, y){
+        if(this.constrainPosition){
+            var ay = this.targetXY[1], h = this.getSize().height;
+            if(y <= ay && (y+h) >= ay){
+                y = ay-h-5;
+            }
+        }
+        return {x : x, y: y};
+    },
+    
+    beforeDestroy : function(){
+        this.clearTimers();
+        Ext.destroy(this.anchorEl);
+        delete this.anchorEl;
+        delete this.target;
+        delete this.anchorTarget;
+        delete this.triggerElement;
+        Ext.ToolTip.superclass.beforeDestroy.call(this);    
+    },
+
+    
+    onDestroy : function(){
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+        Ext.ToolTip.superclass.onDestroy.call(this);
+    }
+});
+
+Ext.reg('tooltip', Ext.ToolTip);
+Ext.QuickTip = Ext.extend(Ext.ToolTip, {
+    
+    
+    interceptTitles : false,
+
+    
+    tagConfig : {
+        namespace : "ext",
+        attribute : "qtip",
+        width : "qwidth",
+        target : "target",
+        title : "qtitle",
+        hide : "hide",
+        cls : "qclass",
+        align : "qalign",
+        anchor : "anchor"
+    },
+
+    
+    initComponent : function(){
+        this.target = this.target || Ext.getDoc();
+        this.targets = this.targets || {};
+        Ext.QuickTip.superclass.initComponent.call(this);
+    },
+
+    
+    register : function(config){
+        var cs = Ext.isArray(config) ? config : arguments;
+        for(var i = 0, len = cs.length; i < len; i++){
+            var c = cs[i];
+            var target = c.target;
+            if(target){
+                if(Ext.isArray(target)){
+                    for(var j = 0, jlen = target.length; j < jlen; j++){
+                        this.targets[Ext.id(target[j])] = c;
+                    }
+                } else{
+                    this.targets[Ext.id(target)] = c;
+                }
+            }
+        }
+    },
+
+    
+    unregister : function(el){
+        delete this.targets[Ext.id(el)];
+    },
+    
+    
+    cancelShow: function(el){
+        var at = this.activeTarget;
+        el = Ext.get(el).dom;
+        if(this.isVisible()){
+            if(at && at.el == el){
+                this.hide();
+            }
+        }else if(at && at.el == el){
+            this.clearTimer('show');
+        }
+    },
+    
+    getTipCfg: function(e) {
+        var t = e.getTarget(), 
+            ttp, 
+            cfg;
+        if(this.interceptTitles && t.title && Ext.isString(t.title)){
+            ttp = t.title;
+            t.qtip = ttp;
+            t.removeAttribute("title");
+            e.preventDefault();
+        }else{
+            cfg = this.tagConfig;
+            ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
+        }
+        return ttp;
+    },
+
+    
+    onTargetOver : function(e){
+        if(this.disabled){
+            return;
+        }
+        this.targetXY = e.getXY();
+        var t = e.getTarget();
+        if(!t || t.nodeType !== 1 || t == document || t == document.body){
+            return;
+        }
+        if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
+            this.clearTimer('hide');
+            this.show();
+            return;
+        }
+        if(t && this.targets[t.id]){
+            this.activeTarget = this.targets[t.id];
+            this.activeTarget.el = t;
+            this.anchor = this.activeTarget.anchor;
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+            return;
+        }
+        var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
+        if(ttp = this.getTipCfg(e)){
+            var autoHide = et.getAttribute(cfg.hide, ns);
+            this.activeTarget = {
+                el: t,
+                text: ttp,
+                width: et.getAttribute(cfg.width, ns),
+                autoHide: autoHide != "user" && autoHide !== 'false',
+                title: et.getAttribute(cfg.title, ns),
+                cls: et.getAttribute(cfg.cls, ns),
+                align: et.getAttribute(cfg.align, ns)
+                
+            };
+            this.anchor = et.getAttribute(cfg.anchor, ns);
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+        }
+    },
+
+    
+    onTargetOut : function(e){
+
+        
+        if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
+            return;
+        }
+
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    
+    showAt : function(xy){
+        var t = this.activeTarget;
+        if(t){
+            if(!this.rendered){
+                this.render(Ext.getBody());
+                this.activeTarget = t;
+            }
+            if(t.width){
+                this.setWidth(t.width);
+                this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
+                this.measureWidth = false;
+            } else{
+                this.measureWidth = true;
+            }
+            this.setTitle(t.title || '');
+            this.body.update(t.text);
+            this.autoHide = t.autoHide;
+            this.dismissDelay = t.dismissDelay || this.dismissDelay;
+            if(this.lastCls){
+                this.el.removeClass(this.lastCls);
+                delete this.lastCls;
+            }
+            if(t.cls){
+                this.el.addClass(t.cls);
+                this.lastCls = t.cls;
+            }
+            if(this.anchor){
+                this.constrainPosition = false;
+            }else if(t.align){ 
+                xy = this.el.getAlignToXY(t.el, t.align);
+                this.constrainPosition = false;
+            }else{
+                this.constrainPosition = true;
+            }
+        }
+        Ext.QuickTip.superclass.showAt.call(this, xy);
+    },
+
+    
+    hide: function(){
+        delete this.activeTarget;
+        Ext.QuickTip.superclass.hide.call(this);
+    }
+});
+Ext.reg('quicktip', Ext.QuickTip);
+Ext.QuickTips = function(){
+    var tip,
+        disabled = false;
+        
+    return {
+        
+        init : function(autoRender){
+            if(!tip){
+                if(!Ext.isReady){
+                    Ext.onReady(function(){
+                        Ext.QuickTips.init(autoRender);
+                    });
+                    return;
+                }
+                tip = new Ext.QuickTip({
+                    elements:'header,body', 
+                    disabled: disabled
+                });
+                if(autoRender !== false){
+                    tip.render(Ext.getBody());
+                }
+            }
+        },
+        
+        
+        ddDisable : function(){
+            
+            if(tip && !disabled){
+                tip.disable();
+            }    
+        },
+        
+        
+        ddEnable : function(){
+            
+            if(tip && !disabled){
+                tip.enable();
+            }
+        },
+
+        
+        enable : function(){
+            if(tip){
+                tip.enable();
+            }
+            disabled = false;
+        },
+
+        
+        disable : function(){
+            if(tip){
+                tip.disable();
+            }
+            disabled = true;
+        },
+
+        
+        isEnabled : function(){
+            return tip !== undefined && !tip.disabled;
+        },
+
+        
+        getQuickTip : function(){
+            return tip;
+        },
+
+        
+        register : function(){
+            tip.register.apply(tip, arguments);
+        },
+
+        
+        unregister : function(){
+            tip.unregister.apply(tip, arguments);
+        },
+
+        
+        tips : function(){
+            tip.register.apply(tip, arguments);
+        }
+    };
+}();
+Ext.slider.Tip = Ext.extend(Ext.Tip, {
+    minWidth: 10,
+    offsets : [0, -10],
+    
+    init: function(slider) {
+        slider.on({
+            scope    : this,
+            dragstart: this.onSlide,
+            drag     : this.onSlide,
+            dragend  : this.hide,
+            destroy  : this.destroy
+        });
+    },
+    
+    
+    onSlide : function(slider, e, thumb) {
+        this.show();
+        this.body.update(this.getText(thumb));
+        this.doAutoWidth();
+        this.el.alignTo(thumb.el, 'b-t?', this.offsets);
+    },
+
+    
+    getText : function(thumb) {
+        return String(thumb.value);
+    }
+});
+
+
+Ext.ux.SliderTip = Ext.slider.Tip;
+Ext.tree.TreePanel = Ext.extend(Ext.Panel, {
+    rootVisible : true,
+    animate : Ext.enableFx,
+    lines : true,
+    enableDD : false,
+    hlDrop : Ext.enableFx,
+    pathSeparator : '/',
+
+    
+    bubbleEvents : [],
+
+    initComponent : function(){
+        Ext.tree.TreePanel.superclass.initComponent.call(this);
+
+        if(!this.eventModel){
+            this.eventModel = new Ext.tree.TreeEventModel(this);
+        }
+
+        
+        var l = this.loader;
+        if(!l){
+            l = new Ext.tree.TreeLoader({
+                dataUrl: this.dataUrl,
+                requestMethod: this.requestMethod
+            });
+        }else if(Ext.isObject(l) && !l.load){
+            l = new Ext.tree.TreeLoader(l);
+        }
+        this.loader = l;
+
+        this.nodeHash = {};
+
+        
+        if(this.root){
+            var r = this.root;
+            delete this.root;
+            this.setRootNode(r);
+        }
+
+
+        this.addEvents(
+
+            
+           'append',
+           
+           'remove',
+           
+           'movenode',
+           
+           'insert',
+           
+           'beforeappend',
+           
+           'beforeremove',
+           
+           'beforemovenode',
+           
+            'beforeinsert',
+
+            
+            'beforeload',
+            
+            'load',
+            
+            'textchange',
+            
+            'beforeexpandnode',
+            
+            'beforecollapsenode',
+            
+            'expandnode',
+            
+            'disabledchange',
+            
+            'collapsenode',
+            
+            'beforeclick',
+            
+            'click',
+            
+            'containerclick',
+            
+            'checkchange',
+            
+            'beforedblclick',
+            
+            'dblclick',
+            
+            'containerdblclick',
+            
+            'contextmenu',
+            
+            'containercontextmenu',
+            
+            'beforechildrenrendered',
+           
+            'startdrag',
+            
+            'enddrag',
+            
+            'dragdrop',
+            
+            'beforenodedrop',
+            
+            'nodedrop',
+             
+            'nodedragover'
+        );
+        if(this.singleExpand){
+            this.on('beforeexpandnode', this.restrictExpand, this);
+        }
+    },
+
+    
+    proxyNodeEvent : function(ename, a1, a2, a3, a4, a5, a6){
+        if(ename == 'collapse' || ename == 'expand' || ename == 'beforecollapse' || ename == 'beforeexpand' || ename == 'move' || ename == 'beforemove'){
+            ename = ename+'node';
+        }
+        
+        return this.fireEvent(ename, a1, a2, a3, a4, a5, a6);
+    },
+
+
+    
+    getRootNode : function(){
+        return this.root;
+    },
+
+    
+    setRootNode : function(node){
+        this.destroyRoot();
+        if(!node.render){ 
+            node = this.loader.createNode(node);
+        }
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        if(!this.rootVisible){
+            var uiP = node.attributes.uiProvider;
+            node.ui = uiP ? new uiP(node) : new Ext.tree.RootTreeNodeUI(node);
+        }
+        if(this.innerCt){
+            this.clearInnerCt();
+            this.renderRoot();
+        }
+        return node;
+    },
+    
+    clearInnerCt : function(){
+        this.innerCt.update('');    
+    },
+    
+    
+    renderRoot : function(){
+        this.root.render();
+        if(!this.rootVisible){
+            this.root.renderChildren();
+        }
+    },
+
+    
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    
+    toString : function(){
+        return '[Tree'+(this.id?' '+this.id:'')+']';
+    },
+
+    
+    restrictExpand : function(node){
+        var p = node.parentNode;
+        if(p){
+            if(p.expandedChild && p.expandedChild.parentNode == p){
+                p.expandedChild.collapse();
+            }
+            p.expandedChild = node;
+        }
+    },
+
+    
+    getChecked : function(a, startNode){
+        startNode = startNode || this.root;
+        var r = [];
+        var f = function(){
+            if(this.attributes.checked){
+                r.push(!a ? this : (a == 'id' ? this.id : this.attributes[a]));
+            }
+        };
+        startNode.cascade(f);
+        return r;
+    },
+
+    
+    getLoader : function(){
+        return this.loader;
+    },
+
+    
+    expandAll : function(){
+        this.root.expand(true);
+    },
+
+    
+    collapseAll : function(){
+        this.root.collapse(true);
+    },
+
+    
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.tree.DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+
+    
+    expandPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var curNode = this.root;
+        if(curNode.attributes[attr] != keys[1]){ 
+            if(callback){
+                callback(false, null);
+            }
+            return;
+        }
+        var index = 1;
+        var f = function(){
+            if(++index == keys.length){
+                if(callback){
+                    callback(true, curNode);
+                }
+                return;
+            }
+            var c = curNode.findChild(attr, keys[index]);
+            if(!c){
+                if(callback){
+                    callback(false, curNode);
+                }
+                return;
+            }
+            curNode = c;
+            c.expand(false, false, f);
+        };
+        curNode.expand(false, false, f);
+    },
+
+    
+    selectPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator),
+            v = keys.pop();
+        if(keys.length > 1){
+            var f = function(success, node){
+                if(success && node){
+                    var n = node.findChild(attr, v);
+                    if(n){
+                        n.select();
+                        if(callback){
+                            callback(true, n);
+                        }
+                    }else if(callback){
+                        callback(false, n);
+                    }
+                }else{
+                    if(callback){
+                        callback(false, n);
+                    }
+                }
+            };
+            this.expandPath(keys.join(this.pathSeparator), attr, f);
+        }else{
+            this.root.select();
+            if(callback){
+                callback(true, this.root);
+            }
+        }
+    },
+
+    
+    getTreeEl : function(){
+        return this.body;
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.tree.TreePanel.superclass.onRender.call(this, ct, position);
+        this.el.addClass('x-tree');
+        this.innerCt = this.body.createChild({tag:'ul',
+               cls:'x-tree-root-ct ' +
+               (this.useArrows ? 'x-tree-arrows' : this.lines ? 'x-tree-lines' : 'x-tree-no-lines')});
+    },
+
+    
+    initEvents : function(){
+        Ext.tree.TreePanel.superclass.initEvents.call(this);
+
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.body);
+        }
+        if((this.enableDD || this.enableDrop) && !this.dropZone){
+           
+             this.dropZone = new Ext.tree.TreeDropZone(this, this.dropConfig || {
+               ddGroup: this.ddGroup || 'TreeDD', appendOnly: this.ddAppendOnly === true
+           });
+        }
+        if((this.enableDD || this.enableDrag) && !this.dragZone){
+           
+            this.dragZone = new Ext.tree.TreeDragZone(this, this.dragConfig || {
+               ddGroup: this.ddGroup || 'TreeDD',
+               scroll: this.ddScroll
+           });
+        }
+        this.getSelectionModel().init(this);
+    },
+
+    
+    afterRender : function(){
+        Ext.tree.TreePanel.superclass.afterRender.call(this);
+        this.renderRoot();
+    },
+
+    beforeDestroy : function(){
+        if(this.rendered){
+            Ext.dd.ScrollManager.unregister(this.body);
+            Ext.destroy(this.dropZone, this.dragZone);
+        }
+        this.destroyRoot();
+        Ext.destroy(this.loader);
+        this.nodeHash = this.root = this.loader = null;
+        Ext.tree.TreePanel.superclass.beforeDestroy.call(this);
+    },
+    
+    
+    destroyRoot : function(){
+        if(this.root && this.root.destroy){
+            this.root.destroy(true);
+        }
+    }
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+});
+
+Ext.tree.TreePanel.nodeTypes = {};
+
+Ext.reg('treepanel', Ext.tree.TreePanel);Ext.tree.TreeEventModel = function(tree){
+    this.tree = tree;
+    this.tree.on('render', this.initEvents, this);
+};
+
+Ext.tree.TreeEventModel.prototype = {
+    initEvents : function(){
+        var t = this.tree;
+
+        if(t.trackMouseOver !== false){
+            t.mon(t.innerCt, {
+                scope: this,
+                mouseover: this.delegateOver,
+                mouseout: this.delegateOut
+            });
+        }
+        t.mon(t.getTreeEl(), {
+            scope: this,
+            click: this.delegateClick,
+            dblclick: this.delegateDblClick,
+            contextmenu: this.delegateContextMenu
+        });
+    },
+
+    getNode : function(e){
+        var t;
+        if(t = e.getTarget('.x-tree-node-el', 10)){
+            var id = Ext.fly(t, '_treeEvents').getAttribute('tree-node-id', 'ext');
+            if(id){
+                return this.tree.getNodeById(id);
+            }
+        }
+        return null;
+    },
+
+    getNodeTarget : function(e){
+        var t = e.getTarget('.x-tree-node-icon', 1);
+        if(!t){
+            t = e.getTarget('.x-tree-node-el', 6);
+        }
+        return t;
+    },
+
+    delegateOut : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            var n = this.getNode(e);
+            this.onIconOut(e, n);
+            if(n == this.lastEcOver){
+                delete this.lastEcOver;
+            }
+        }
+        if((t = this.getNodeTarget(e)) && !e.within(t, true)){
+            this.onNodeOut(e, this.getNode(e));
+        }
+    },
+
+    delegateOver : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(Ext.isGecko && !this.trackingDoc){ 
+            Ext.getBody().on('mouseover', this.trackExit, this);
+            this.trackingDoc = true;
+        }
+        if(this.lastEcOver){ 
+            this.onIconOut(e, this.lastEcOver);
+            delete this.lastEcOver;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            this.lastEcOver = this.getNode(e);
+            this.onIconOver(e, this.lastEcOver);
+        }
+        if(t = this.getNodeTarget(e)){
+            this.onNodeOver(e, this.getNode(e));
+        }
+    },
+
+    trackExit : function(e){
+        if(this.lastOverNode){
+            if(this.lastOverNode.ui && !e.within(this.lastOverNode.ui.getEl())){
+                this.onNodeOut(e, this.lastOverNode);
+            }
+            delete this.lastOverNode;
+            Ext.getBody().un('mouseover', this.trackExit, this);
+            this.trackingDoc = false;
+        }
+
+    },
+
+    delegateClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(e.getTarget('input[type=checkbox]', 1)){
+                this.onCheckboxClick(e, this.getNode(e));
+            }else if(e.getTarget('.x-tree-ec-icon', 1)){
+                this.onIconClick(e, this.getNode(e));
+            }else if(this.getNodeTarget(e)){
+                this.onNodeClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'click');
+        }
+    },
+
+    delegateDblClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeDblClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'dblclick');
+        }
+    },
+
+    delegateContextMenu : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeContextMenu(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'contextmenu');
+        }
+    },
+    
+    checkContainerEvent: function(e, type){
+        if(this.disabled){
+            e.stopEvent();
+            return false;
+        }
+        this.onContainerEvent(e, type);    
+    },
+
+    onContainerEvent: function(e, type){
+        this.tree.fireEvent('container' + type, this.tree, e);
+    },
+
+    onNodeClick : function(e, node){
+        node.ui.onClick(e);
+    },
+
+    onNodeOver : function(e, node){
+        this.lastOverNode = node;
+        node.ui.onOver(e);
+    },
+
+    onNodeOut : function(e, node){
+        node.ui.onOut(e);
+    },
+
+    onIconOver : function(e, node){
+        node.ui.addClass('x-tree-ec-over');
+    },
+
+    onIconOut : function(e, node){
+        node.ui.removeClass('x-tree-ec-over');
+    },
+
+    onIconClick : function(e, node){
+        node.ui.ecClick(e);
+    },
+
+    onCheckboxClick : function(e, node){
+        node.ui.onCheckChange(e);
+    },
+
+    onNodeDblClick : function(e, node){
+        node.ui.onDblClick(e);
+    },
+
+    onNodeContextMenu : function(e, node){
+        node.ui.onContextMenu(e);
+    },
+
+    beforeEvent : function(e){
+        var node = this.getNode(e);
+        if(this.disabled || !node || !node.ui){
+            e.stopEvent();
+            return false;
+        }
+        return true;
+    },
+
+    disable: function(){
+        this.disabled = true;
+    },
+
+    enable: function(){
+        this.disabled = false;
+    }
+};
+Ext.tree.DefaultSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNode = null;
+   
+        this.addEvents(
+            
+            'selectionchange',
+
+            
+            'beforeselect'
+        );
+
+        Ext.apply(this, config);
+        Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node);
+    },
+    
+    
+    select : function(node,  selectNextNode){
+        
+        if (!Ext.fly(node.ui.wrap).isVisible() && selectNextNode) {
+            return selectNextNode.call(this, node);
+        }
+        var last = this.selNode;
+        if(node == last){
+            node.ui.onSelectedChange(true);
+        }else if(this.fireEvent('beforeselect', this, node, last) !== false){
+            if(last && last.ui){
+                last.ui.onSelectedChange(false);
+            }
+            this.selNode = node;
+            node.ui.onSelectedChange(true);
+            this.fireEvent('selectionchange', this, node, last);
+        }
+        return node;
+    },
+    
+    
+    unselect : function(node, silent){
+        if(this.selNode == node){
+            this.clearSelections(silent);
+        }    
+    },
+    
+    
+    clearSelections : function(silent){
+        var n = this.selNode;
+        if(n){
+            n.ui.onSelectedChange(false);
+            this.selNode = null;
+            if(silent !== true){
+                this.fireEvent('selectionchange', this, null);
+            }
+        }
+        return n;
+    },
+    
+    
+    getSelectedNode : function(){
+        return this.selNode;    
+    },
+    
+    
+    isSelected : function(node){
+        return this.selNode == node;  
+    },
+
+    
+    selectPrevious : function( s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        
+        var ps = s.previousSibling;
+        if(ps){
+            if(!ps.isExpanded() || ps.childNodes.length < 1){
+                return this.select(ps, this.selectPrevious);
+            } else{
+                var lc = ps.lastChild;
+                while(lc && lc.isExpanded() && Ext.fly(lc.ui.wrap).isVisible() && lc.childNodes.length > 0){
+                    lc = lc.lastChild;
+                }
+                return this.select(lc, this.selectPrevious);
+            }
+        } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
+            return this.select(s.parentNode, this.selectPrevious);
+        }
+        return null;
+    },
+
+    
+    selectNext : function( s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        
+        if(s.firstChild && s.isExpanded() && Ext.fly(s.ui.wrap).isVisible()){
+             return this.select(s.firstChild, this.selectNext);
+         }else if(s.nextSibling){
+             return this.select(s.nextSibling, this.selectNext);
+         }else if(s.parentNode){
+            var newS = null;
+            s.parentNode.bubble(function(){
+                if(this.nextSibling){
+                    newS = this.getOwnerTree().selModel.select(this.nextSibling, this.selectNext);
+                    return false;
+                }
+            });
+            return newS;
+         }
+        return null;
+    },
+
+    onKeyDown : function(e){
+        var s = this.selNode || this.lastSelNode;
+        
+        var sm = this;
+        if(!s){
+            return;
+        }
+        var k = e.getKey();
+        switch(k){
+             case e.DOWN:
+                 e.stopEvent();
+                 this.selectNext();
+             break;
+             case e.UP:
+                 e.stopEvent();
+                 this.selectPrevious();
+             break;
+             case e.RIGHT:
+                 e.preventDefault();
+                 if(s.hasChildNodes()){
+                     if(!s.isExpanded()){
+                         s.expand();
+                     }else if(s.firstChild){
+                         this.select(s.firstChild, e);
+                     }
+                 }
+             break;
+             case e.LEFT:
+                 e.preventDefault();
+                 if(s.hasChildNodes() && s.isExpanded()){
+                     s.collapse();
+                 }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+        };
+    }
+});
+
+
+Ext.tree.MultiSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNodes = [];
+        this.selMap = {};
+        this.addEvents(
+            
+            'selectionchange'
+        );
+        Ext.apply(this, config);
+        Ext.tree.MultiSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        if(e.ctrlKey && this.isSelected(node)){
+            this.unselect(node);
+        }else{
+            this.select(node, e, e.ctrlKey);
+        }
+    },
+    
+    
+    select : function(node, e, keepExisting){
+        if(keepExisting !== true){
+            this.clearSelections(true);
+        }
+        if(this.isSelected(node)){
+            this.lastSelNode = node;
+            return node;
+        }
+        this.selNodes.push(node);
+        this.selMap[node.id] = node;
+        this.lastSelNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, this.selNodes);
+        return node;
+    },
+    
+    
+    unselect : function(node){
+        if(this.selMap[node.id]){
+            node.ui.onSelectedChange(false);
+            var sn = this.selNodes;
+            var index = sn.indexOf(node);
+            if(index != -1){
+                this.selNodes.splice(index, 1);
+            }
+            delete this.selMap[node.id];
+            this.fireEvent('selectionchange', this, this.selNodes);
+        }
+    },
+    
+    
+    clearSelections : function(suppressEvent){
+        var sn = this.selNodes;
+        if(sn.length > 0){
+            for(var i = 0, len = sn.length; i < len; i++){
+                sn[i].ui.onSelectedChange(false);
+            }
+            this.selNodes = [];
+            this.selMap = {};
+            if(suppressEvent !== true){
+                this.fireEvent('selectionchange', this, this.selNodes);
+            }
+        }
+    },
+    
+    
+    isSelected : function(node){
+        return this.selMap[node.id] ? true : false;  
+    },
+    
+    
+    getSelectedNodes : function(){
+        return this.selNodes.concat([]);
+    },
+
+    onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,
+
+    selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,
+
+    selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious
+});
+Ext.data.Tree = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(root){
+        this.nodeHash = {};
+        
+        this.root = null;
+        if(root){
+            this.setRootNode(root);
+        }
+        this.addEvents(
+            
+            "append",
+            
+            "remove",
+            
+            "move",
+            
+            "insert",
+            
+            "beforeappend",
+            
+            "beforeremove",
+            
+            "beforemove",
+            
+            "beforeinsert"
+        );
+        Ext.data.Tree.superclass.constructor.call(this);        
+    },
+    
+    
+    pathSeparator: "/",
+
+    
+    proxyNodeEvent : function(){
+        return this.fireEvent.apply(this, arguments);
+    },
+
+    
+    getRootNode : function(){
+        return this.root;
+    },
+
+    
+    setRootNode : function(node){
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        return node;
+    },
+
+    
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    toString : function(){
+        return "[Tree"+(this.id?" "+this.id:"")+"]";
+    }
+});
+
+
+Ext.data.Node = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(attributes){
+        
+        this.attributes = attributes || {};
+        this.leaf = this.attributes.leaf;
+        
+        this.id = this.attributes.id;
+        if(!this.id){
+            this.id = Ext.id(null, "xnode-");
+            this.attributes.id = this.id;
+        }
+        
+        this.childNodes = [];
+        
+        this.parentNode = null;
+        
+        this.firstChild = null;
+        
+        this.lastChild = null;
+        
+        this.previousSibling = null;
+        
+        this.nextSibling = null;
+
+        this.addEvents({
+            
+            "append" : true,
+            
+            "remove" : true,
+            
+            "move" : true,
+            
+            "insert" : true,
+            
+            "beforeappend" : true,
+            
+            "beforeremove" : true,
+            
+            "beforemove" : true,
+             
+            "beforeinsert" : true
+        });
+        this.listeners = this.attributes.listeners;
+        Ext.data.Node.superclass.constructor.call(this);    
+    },
+    
+    
+    fireEvent : function(evtName){
+        
+        if(Ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
+            return false;
+        }
+        
+        var ot = this.getOwnerTree();
+        if(ot){
+            if(ot.proxyNodeEvent.apply(ot, arguments) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    
+    isLeaf : function(){
+        return this.leaf === true;
+    },
+
+    
+    setFirstChild : function(node){
+        this.firstChild = node;
+    },
+
+    
+    setLastChild : function(node){
+        this.lastChild = node;
+    },
+
+
+    
+    isLast : function(){
+       return (!this.parentNode ? true : this.parentNode.lastChild == this);
+    },
+
+    
+    isFirst : function(){
+       return (!this.parentNode ? true : this.parentNode.firstChild == this);
+    },
+
+    
+    hasChildNodes : function(){
+        return !this.isLeaf() && this.childNodes.length > 0;
+    },
+
+    
+    isExpandable : function(){
+        return this.attributes.expandable || this.hasChildNodes();
+    },
+
+    
+    appendChild : function(node){
+        var multi = false;
+        if(Ext.isArray(node)){
+            multi = node;
+        }else if(arguments.length > 1){
+            multi = arguments;
+        }
+        
+        if(multi){
+            for(var i = 0, len = multi.length; i < len; i++) {
+                this.appendChild(multi[i]);
+            }
+        }else{
+            if(this.fireEvent("beforeappend", this.ownerTree, this, node) === false){
+                return false;
+            }
+            var index = this.childNodes.length;
+            var oldParent = node.parentNode;
+            
+            if(oldParent){
+                if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index) === false){
+                    return false;
+                }
+                oldParent.removeChild(node);
+            }
+            index = this.childNodes.length;
+            if(index === 0){
+                this.setFirstChild(node);
+            }
+            this.childNodes.push(node);
+            node.parentNode = this;
+            var ps = this.childNodes[index-1];
+            if(ps){
+                node.previousSibling = ps;
+                ps.nextSibling = node;
+            }else{
+                node.previousSibling = null;
+            }
+            node.nextSibling = null;
+            this.setLastChild(node);
+            node.setOwnerTree(this.getOwnerTree());
+            this.fireEvent("append", this.ownerTree, this, node, index);
+            if(oldParent){
+                node.fireEvent("move", this.ownerTree, node, oldParent, this, index);
+            }
+            return node;
+        }
+    },
+
+    
+    removeChild : function(node, destroy){
+        var index = this.childNodes.indexOf(node);
+        if(index == -1){
+            return false;
+        }
+        if(this.fireEvent("beforeremove", this.ownerTree, this, node) === false){
+            return false;
+        }
+
+        
+        this.childNodes.splice(index, 1);
+
+        
+        if(node.previousSibling){
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+        if(node.nextSibling){
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+
+        
+        if(this.firstChild == node){
+            this.setFirstChild(node.nextSibling);
+        }
+        if(this.lastChild == node){
+            this.setLastChild(node.previousSibling);
+        }
+
+        this.fireEvent("remove", this.ownerTree, this, node);
+        if(destroy){
+            node.destroy(true);
+        }else{
+            node.clear();
+        }
+        return node;
+    },
+
+    
+    clear : function(destroy){
+        
+        this.setOwnerTree(null, destroy);
+        this.parentNode = this.previousSibling = this.nextSibling = null;
+        if(destroy){
+            this.firstChild = this.lastChild = null;
+        }
+    },
+
+    
+    destroy : function( silent){
+        
+        if(silent === true){
+            this.purgeListeners();
+            this.clear(true);
+            Ext.each(this.childNodes, function(n){
+                n.destroy(true);
+            });
+            this.childNodes = null;
+        }else{
+            this.remove(true);
+        }
+    },
+
+    
+    insertBefore : function(node, refNode){
+        if(!refNode){ 
+            return this.appendChild(node);
+        }
+        
+        if(node == refNode){
+            return false;
+        }
+
+        if(this.fireEvent("beforeinsert", this.ownerTree, this, node, refNode) === false){
+            return false;
+        }
+        var index = this.childNodes.indexOf(refNode);
+        var oldParent = node.parentNode;
+        var refIndex = index;
+
+        
+        if(oldParent == this && this.childNodes.indexOf(node) < index){
+            refIndex--;
+        }
+
+        
+        if(oldParent){
+            if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index, refNode) === false){
+                return false;
+            }
+            oldParent.removeChild(node);
+        }
+        if(refIndex === 0){
+            this.setFirstChild(node);
+        }
+        this.childNodes.splice(refIndex, 0, node);
+        node.parentNode = this;
+        var ps = this.childNodes[refIndex-1];
+        if(ps){
+            node.previousSibling = ps;
+            ps.nextSibling = node;
+        }else{
+            node.previousSibling = null;
+        }
+        node.nextSibling = refNode;
+        refNode.previousSibling = node;
+        node.setOwnerTree(this.getOwnerTree());
+        this.fireEvent("insert", this.ownerTree, this, node, refNode);
+        if(oldParent){
+            node.fireEvent("move", this.ownerTree, node, oldParent, this, refIndex, refNode);
+        }
+        return node;
+    },
+
+    
+    remove : function(destroy){
+        if (this.parentNode) {
+            this.parentNode.removeChild(this, destroy);
+        }
+        return this;
+    },
+
+    
+    removeAll : function(destroy){
+        var cn = this.childNodes,
+            n;
+        while((n = cn[0])){
+            this.removeChild(n, destroy);
+        }
+        return this;
+    },
+
+    
+    item : function(index){
+        return this.childNodes[index];
+    },
+
+    
+    replaceChild : function(newChild, oldChild){
+        var s = oldChild ? oldChild.nextSibling : null;
+        this.removeChild(oldChild);
+        this.insertBefore(newChild, s);
+        return oldChild;
+    },
+
+    
+    indexOf : function(child){
+        return this.childNodes.indexOf(child);
+    },
+
+    
+    getOwnerTree : function(){
+        
+        if(!this.ownerTree){
+            var p = this;
+            while(p){
+                if(p.ownerTree){
+                    this.ownerTree = p.ownerTree;
+                    break;
+                }
+                p = p.parentNode;
+            }
+        }
+        return this.ownerTree;
+    },
+
+    
+    getDepth : function(){
+        var depth = 0;
+        var p = this;
+        while(p.parentNode){
+            ++depth;
+            p = p.parentNode;
+        }
+        return depth;
+    },
+
+    
+    setOwnerTree : function(tree, destroy){
+        
+        if(tree != this.ownerTree){
+            if(this.ownerTree){
+                this.ownerTree.unregisterNode(this);
+            }
+            this.ownerTree = tree;
+            
+            if(destroy !== true){
+                Ext.each(this.childNodes, function(n){
+                    n.setOwnerTree(tree);
+                });
+            }
+            if(tree){
+                tree.registerNode(this);
+            }
+        }
+    },
+
+    
+    setId: function(id){
+        if(id !== this.id){
+            var t = this.ownerTree;
+            if(t){
+                t.unregisterNode(this);
+            }
+            this.id = this.attributes.id = id;
+            if(t){
+                t.registerNode(this);
+            }
+            this.onIdChange(id);
+        }
+    },
+
+    
+    onIdChange: Ext.emptyFn,
+
+    
+    getPath : function(attr){
+        attr = attr || "id";
+        var p = this.parentNode;
+        var b = [this.attributes[attr]];
+        while(p){
+            b.unshift(p.attributes[attr]);
+            p = p.parentNode;
+        }
+        var sep = this.getOwnerTree().pathSeparator;
+        return sep + b.join(sep);
+    },
+
+    
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.parentNode;
+        }
+    },
+
+    
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+                cs[i].cascade(fn, scope, args);
+            }
+        }
+    },
+
+    
+    eachChild : function(fn, scope, args){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+            if(fn.apply(scope || cs[i], args || [cs[i]]) === false){
+                break;
+            }
+        }
+    },
+
+    
+    findChild : function(attribute, value, deep){
+        return this.findChildBy(function(){
+            return this.attributes[attribute] == value;
+        }, null, deep);
+    },
+
+    
+    findChildBy : function(fn, scope, deep){
+        var cs = this.childNodes,
+            len = cs.length,
+            i = 0,
+            n,
+            res;
+        for(; i < len; i++){
+            n = cs[i];
+            if(fn.call(scope || n, n) === true){
+                return n;
+            }else if (deep){
+                res = n.findChildBy(fn, scope, deep);
+                if(res != null){
+                    return res;
+                }
+            }
+            
+        }
+        return null;
+    },
+
+    
+    sort : function(fn, scope){
+        var cs = this.childNodes;
+        var len = cs.length;
+        if(len > 0){
+            var sortFn = scope ? function(){fn.apply(scope, arguments);} : fn;
+            cs.sort(sortFn);
+            for(var i = 0; i < len; i++){
+                var n = cs[i];
+                n.previousSibling = cs[i-1];
+                n.nextSibling = cs[i+1];
+                if(i === 0){
+                    this.setFirstChild(n);
+                }
+                if(i == len-1){
+                    this.setLastChild(n);
+                }
+            }
+        }
+    },
+
+    
+    contains : function(node){
+        return node.isAncestor(this);
+    },
+
+    
+    isAncestor : function(node){
+        var p = this.parentNode;
+        while(p){
+            if(p == node){
+                return true;
+            }
+            p = p.parentNode;
+        }
+        return false;
+    },
+
+    toString : function(){
+        return "[Node"+(this.id?" "+this.id:"")+"]";
+    }
+});
+Ext.tree.TreeNode = Ext.extend(Ext.data.Node, {
+    
+    constructor : function(attributes){
+        attributes = attributes || {};
+        if(Ext.isString(attributes)){
+            attributes = {text: attributes};
+        }
+        this.childrenRendered = false;
+        this.rendered = false;
+        Ext.tree.TreeNode.superclass.constructor.call(this, attributes);
+        this.expanded = attributes.expanded === true;
+        this.isTarget = attributes.isTarget !== false;
+        this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;
+        this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;
+
+        
+        this.text = attributes.text;
+        
+        this.disabled = attributes.disabled === true;
+        
+        this.hidden = attributes.hidden === true;
+    
+        this.addEvents(
+            
+            'textchange',
+            
+            'beforeexpand',
+            
+            'beforecollapse',
+            
+            'expand',
+            
+            'disabledchange',
+            
+            'collapse',
+            
+            'beforeclick',
+            
+            'click',
+            
+            'checkchange',
+            
+            'beforedblclick',
+            
+            'dblclick',
+            
+            'contextmenu',
+            
+            'beforechildrenrendered'
+        );
+    
+        var uiClass = this.attributes.uiProvider || this.defaultUI || Ext.tree.TreeNodeUI;
+    
+        
+        this.ui = new uiClass(this);    
+    },
+    
+    preventHScroll : true,
+    
+    isExpanded : function(){
+        return this.expanded;
+    },
+
+
+    getUI : function(){
+        return this.ui;
+    },
+
+    getLoader : function(){
+        var owner;
+        return this.loader || ((owner = this.getOwnerTree()) && owner.loader ? owner.loader : (this.loader = new Ext.tree.TreeLoader()));
+    },
+
+    
+    setFirstChild : function(node){
+        var of = this.firstChild;
+        Ext.tree.TreeNode.superclass.setFirstChild.call(this, node);
+        if(this.childrenRendered && of && node != of){
+            of.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    
+    setLastChild : function(node){
+        var ol = this.lastChild;
+        Ext.tree.TreeNode.superclass.setLastChild.call(this, node);
+        if(this.childrenRendered && ol && node != ol){
+            ol.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    
+    
+    appendChild : function(n){
+        if(!n.render && !Ext.isArray(n)){
+            n = this.getLoader().createNode(n);
+        }
+        var node = Ext.tree.TreeNode.superclass.appendChild.call(this, n);
+        if(node && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return node;
+    },
+
+    
+    removeChild : function(node, destroy){
+        this.ownerTree.getSelectionModel().unselect(node);
+        Ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);
+        
+        if(!destroy){
+            var rendered = node.ui.rendered;
+            
+            if(rendered){
+                node.ui.remove();
+            }
+            if(rendered && this.childNodes.length < 1){
+                this.collapse(false, false);
+            }else{
+                this.ui.updateExpandIcon();
+            }
+            if(!this.firstChild && !this.isHiddenRoot()){
+                this.childrenRendered = false;
+            }
+        }
+        return node;
+    },
+
+    
+    insertBefore : function(node, refNode){
+        if(!node.render){
+            node = this.getLoader().createNode(node);
+        }
+        var newNode = Ext.tree.TreeNode.superclass.insertBefore.call(this, node, refNode);
+        if(newNode && refNode && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return newNode;
+    },
+
+    
+    setText : function(text){
+        var oldText = this.text;
+        this.text = this.attributes.text = text;
+        if(this.rendered){ 
+            this.ui.onTextChange(this, text, oldText);
+        }
+        this.fireEvent('textchange', this, text, oldText);
+    },
+    
+    
+    setIconCls : function(cls){
+        var old = this.attributes.iconCls;
+        this.attributes.iconCls = cls;
+        if(this.rendered){
+            this.ui.onIconClsChange(this, cls, old);
+        }
+    },
+    
+    
+    setTooltip : function(tip, title){
+        this.attributes.qtip = tip;
+        this.attributes.qtipTitle = title;
+        if(this.rendered){
+            this.ui.onTipChange(this, tip, title);
+        }
+    },
+    
+    
+    setIcon : function(icon){
+        this.attributes.icon = icon;
+        if(this.rendered){
+            this.ui.onIconChange(this, icon);
+        }
+    },
+    
+    
+    setHref : function(href, target){
+        this.attributes.href = href;
+        this.attributes.hrefTarget = target;
+        if(this.rendered){
+            this.ui.onHrefChange(this, href, target);
+        }
+    },
+    
+    
+    setCls : function(cls){
+        var old = this.attributes.cls;
+        this.attributes.cls = cls;
+        if(this.rendered){
+            this.ui.onClsChange(this, cls, old);
+        }
+    },
+
+    
+    select : function(){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().select(this);
+        }
+    },
+
+    
+    unselect : function(silent){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().unselect(this, silent);
+        }
+    },
+
+    
+    isSelected : function(){
+        var t = this.getOwnerTree();
+        return t ? t.getSelectionModel().isSelected(this) : false;
+    },
+
+    
+    expand : function(deep, anim, callback, scope){
+        if(!this.expanded){
+            if(this.fireEvent('beforeexpand', this, deep, anim) === false){
+                return;
+            }
+            if(!this.childrenRendered){
+                this.renderChildren();
+            }
+            this.expanded = true;
+            if(!this.isHiddenRoot() && (this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animExpand(function(){
+                    this.fireEvent('expand', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.expandChildNodes(true, true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.expand();
+                this.fireEvent('expand', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else{
+           this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            this.expandChildNodes(true);
+        }
+    },
+
+    runCallback : function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isHiddenRoot : function(){
+        return this.isRoot && !this.getOwnerTree().rootVisible;
+    },
+
+    
+    collapse : function(deep, anim, callback, scope){
+        if(this.expanded && !this.isHiddenRoot()){
+            if(this.fireEvent('beforecollapse', this, deep, anim) === false){
+                return;
+            }
+            this.expanded = false;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animCollapse(function(){
+                    this.fireEvent('collapse', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.collapseChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.collapse();
+                this.fireEvent('collapse', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else if(!this.expanded){
+            this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].collapse(true, false);
+            }
+        }
+    },
+
+    
+    delayedExpand : function(delay){
+        if(!this.expandProcId){
+            this.expandProcId = this.expand.defer(delay, this);
+        }
+    },
+
+    
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+        }
+        this.expandProcId = false;
+    },
+
+    
+    toggle : function(){
+        if(this.expanded){
+            this.collapse();
+        }else{
+            this.expand();
+        }
+    },
+
+    
+    ensureVisible : function(callback, scope){
+        var tree = this.getOwnerTree();
+        tree.expandPath(this.parentNode ? this.parentNode.getPath() : this.getPath(), false, function(){
+            var node = tree.getNodeById(this.id);  
+            tree.getTreeEl().scrollChildIntoView(node.ui.anchor);
+            this.runCallback(callback, scope || this, [this]);
+        }.createDelegate(this));
+    },
+
+    
+    expandChildNodes : function(deep, anim) {
+        var cs = this.childNodes,
+            i,
+            len = cs.length;
+        for (i = 0; i < len; i++) {
+        	cs[i].expand(deep, anim);
+        }
+    },
+
+    
+    collapseChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].collapse(deep);
+        }
+    },
+
+    
+    disable : function(){
+        this.disabled = true;
+        this.unselect();
+        if(this.rendered && this.ui.onDisableChange){ 
+            this.ui.onDisableChange(this, true);
+        }
+        this.fireEvent('disabledchange', this, true);
+    },
+
+    
+    enable : function(){
+        this.disabled = false;
+        if(this.rendered && this.ui.onDisableChange){ 
+            this.ui.onDisableChange(this, false);
+        }
+        this.fireEvent('disabledchange', this, false);
+    },
+
+    
+    renderChildren : function(suppressEvent){
+        if(suppressEvent !== false){
+            this.fireEvent('beforechildrenrendered', this);
+        }
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].render(true);
+        }
+        this.childrenRendered = true;
+    },
+
+    
+    sort : function(fn, scope){
+        Ext.tree.TreeNode.superclass.sort.apply(this, arguments);
+        if(this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].render(true);
+            }
+        }
+    },
+
+    
+    render : function(bulkRender){
+        this.ui.render(bulkRender);
+        if(!this.rendered){
+            
+            this.getOwnerTree().registerNode(this);
+            this.rendered = true;
+            if(this.expanded){
+                this.expanded = false;
+                this.expand(false, false);
+            }
+        }
+    },
+
+    
+    renderIndent : function(deep, refresh){
+        if(refresh){
+            this.ui.childIndent = null;
+        }
+        this.ui.renderIndent();
+        if(deep === true && this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].renderIndent(true, refresh);
+            }
+        }
+    },
+
+    beginUpdate : function(){
+        this.childrenRendered = false;
+    },
+
+    endUpdate : function(){
+        if(this.expanded && this.rendered){
+            this.renderChildren();
+        }
+    },
+
+    
+    destroy : function(silent){
+        if(silent === true){
+            this.unselect(true);
+        }
+        Ext.tree.TreeNode.superclass.destroy.call(this, silent);
+        Ext.destroy(this.ui, this.loader);
+        this.ui = this.loader = null;
+    },
+
+    
+    onIdChange : function(id){
+        this.ui.onIdChange(id);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.node = Ext.tree.TreeNode;
+ Ext.tree.AsyncTreeNode = function(config){
+    this.loaded = config && config.loaded === true;
+    this.loading = false;
+    Ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);
+    
+    this.addEvents('beforeload', 'load');
+    
+    
+};
+Ext.extend(Ext.tree.AsyncTreeNode, Ext.tree.TreeNode, {
+    expand : function(deep, anim, callback, scope){
+        if(this.loading){ 
+            var timer;
+            var f = function(){
+                if(!this.loading){ 
+                    clearInterval(timer);
+                    this.expand(deep, anim, callback, scope);
+                }
+            }.createDelegate(this);
+            timer = setInterval(f, 200);
+            return;
+        }
+        if(!this.loaded){
+            if(this.fireEvent("beforeload", this) === false){
+                return;
+            }
+            this.loading = true;
+            this.ui.beforeLoad(this);
+            var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();
+            if(loader){
+                loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback, scope]), this);
+                return;
+            }
+        }
+        Ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback, scope);
+    },
+    
+    
+    isLoading : function(){
+        return this.loading;  
+    },
+    
+    loadComplete : function(deep, anim, callback, scope){
+        this.loading = false;
+        this.loaded = true;
+        this.ui.afterLoad(this);
+        this.fireEvent("load", this);
+        this.expand(deep, anim, callback, scope);
+    },
+    
+    
+    isLoaded : function(){
+        return this.loaded;
+    },
+    
+    hasChildNodes : function(){
+        if(!this.isLeaf() && !this.loaded){
+            return true;
+        }else{
+            return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);
+        }
+    },
+
+    
+    reload : function(callback, scope){
+        this.collapse(false, false);
+        while(this.firstChild){
+            this.removeChild(this.firstChild).destroy();
+        }
+        this.childrenRendered = false;
+        this.loaded = false;
+        if(this.isHiddenRoot()){
+            this.expanded = false;
+        }
+        this.expand(false, false, callback, scope);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.async = Ext.tree.AsyncTreeNode;
+Ext.tree.TreeNodeUI = Ext.extend(Object, {
+    
+    constructor : function(node){
+        Ext.apply(this, {
+            node: node,
+            rendered: false,
+            animating: false,
+            wasLeaf: true,
+            ecc: 'x-tree-ec-icon x-tree-elbow',
+            emptyIcon: Ext.BLANK_IMAGE_URL    
+        });
+    },
+    
+    
+    removeChild : function(node){
+        if(this.rendered){
+            this.ctNode.removeChild(node.ui.getEl());
+        }
+    },
+
+    
+    beforeLoad : function(){
+         this.addClass("x-tree-node-loading");
+    },
+
+    
+    afterLoad : function(){
+         this.removeClass("x-tree-node-loading");
+    },
+
+    
+    onTextChange : function(node, text, oldText){
+        if(this.rendered){
+            this.textNode.innerHTML = text;
+        }
+    },
+    
+    
+    onIconClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.iconNode).replaceClass(oldCls, cls);
+        }
+    },
+    
+    
+    onIconChange : function(node, icon){
+        if(this.rendered){
+            
+            var empty = Ext.isEmpty(icon);
+            this.iconNode.src = empty ? this.emptyIcon : icon;
+            Ext.fly(this.iconNode)[empty ? 'removeClass' : 'addClass']('x-tree-node-inline-icon');
+        }
+    },
+    
+    
+    onTipChange : function(node, tip, title){
+        if(this.rendered){
+            var hasTitle = Ext.isDefined(title);
+            if(this.textNode.setAttributeNS){
+                this.textNode.setAttributeNS("ext", "qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttributeNS("ext", "qtitle", title);
+                }
+            }else{
+                this.textNode.setAttribute("ext:qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttribute("ext:qtitle", title);
+                }
+            }
+        }
+    },
+    
+    
+    onHrefChange : function(node, href, target){
+        if(this.rendered){
+            this.anchor.href = this.getHref(href);
+            if(Ext.isDefined(target)){
+                this.anchor.target = target;
+            }
+        }
+    },
+    
+    
+    onClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.elNode).replaceClass(oldCls, cls);
+        }    
+    },
+
+    
+    onDisableChange : function(node, state){
+        this.disabled = state;
+        if (this.checkbox) {
+            this.checkbox.disabled = state;
+        }
+        this[state ? 'addClass' : 'removeClass']('x-tree-node-disabled');
+    },
+
+    
+    onSelectedChange : function(state){
+        if(state){
+            this.focus();
+            this.addClass("x-tree-selected");
+        }else{
+            
+            this.removeClass("x-tree-selected");
+        }
+    },
+
+    
+    onMove : function(tree, node, oldParent, newParent, index, refNode){
+        this.childIndent = null;
+        if(this.rendered){
+            var targetNode = newParent.ui.getContainer();
+            if(!targetNode){
+                this.holder = document.createElement("div");
+                this.holder.appendChild(this.wrap);
+                return;
+            }
+            var insertBefore = refNode ? refNode.ui.getEl() : null;
+            if(insertBefore){
+                targetNode.insertBefore(this.wrap, insertBefore);
+            }else{
+                targetNode.appendChild(this.wrap);
+            }
+            this.node.renderIndent(true, oldParent != newParent);
+        }
+    },
+
+
+    addClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).addClass(cls);
+        }
+    },
+
+
+    removeClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).removeClass(cls);
+        }
+    },
+
+    
+    remove : function(){
+        if(this.rendered){
+            this.holder = document.createElement("div");
+            this.holder.appendChild(this.wrap);
+        }
+    },
+
+    
+    fireEvent : function(){
+        return this.node.fireEvent.apply(this.node, arguments);
+    },
+
+    
+    initEvents : function(){
+        this.node.on("move", this.onMove, this);
+
+        if(this.node.disabled){
+            this.onDisableChange(this.node, true);
+        }
+        if(this.node.hidden){
+            this.hide();
+        }
+        var ot = this.node.getOwnerTree();
+        var dd = ot.enableDD || ot.enableDrag || ot.enableDrop;
+        if(dd && (!this.node.isRoot || ot.rootVisible)){
+            Ext.dd.Registry.register(this.elNode, {
+                node: this.node,
+                handles: this.getDDHandles(),
+                isHandle: false
+            });
+        }
+    },
+
+    
+    getDDHandles : function(){
+        return [this.iconNode, this.textNode, this.elNode];
+    },
+
+
+    hide : function(){
+        this.node.hidden = true;
+        if(this.wrap){
+            this.wrap.style.display = "none";
+        }
+    },
+
+
+    show : function(){
+        this.node.hidden = false;
+        if(this.wrap){
+            this.wrap.style.display = "";
+        }
+    },
+
+    
+    onContextMenu : function(e){
+        if (this.node.hasListener("contextmenu") || this.node.getOwnerTree().hasListener("contextmenu")) {
+            e.preventDefault();
+            this.focus();
+            this.fireEvent("contextmenu", this.node, e);
+        }
+    },
+
+    
+    onClick : function(e){
+        if(this.dropping){
+            e.stopEvent();
+            return;
+        }
+        if(this.fireEvent("beforeclick", this.node, e) !== false){
+            var a = e.getTarget('a');
+            if(!this.disabled && this.node.attributes.href && a){
+                this.fireEvent("click", this.node, e);
+                return;
+            }else if(a && e.ctrlKey){
+                e.stopEvent();
+            }
+            e.preventDefault();
+            if(this.disabled){
+                return;
+            }
+
+            if(this.node.attributes.singleClickExpand && !this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+
+            this.fireEvent("click", this.node, e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    
+    onDblClick : function(e){
+        e.preventDefault();
+        if(this.disabled){
+            return;
+        }
+        if(this.fireEvent("beforedblclick", this.node, e) !== false){
+            if(this.checkbox){
+                this.toggleCheck();
+            }
+            if(!this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+            this.fireEvent("dblclick", this.node, e);
+        }
+    },
+
+    onOver : function(e){
+        this.addClass('x-tree-node-over');
+    },
+
+    onOut : function(e){
+        this.removeClass('x-tree-node-over');
+    },
+
+    
+    onCheckChange : function(){
+        var checked = this.checkbox.checked;
+        
+        this.checkbox.defaultChecked = checked;
+        this.node.attributes.checked = checked;
+        this.fireEvent('checkchange', this.node, checked);
+    },
+
+    
+    ecClick : function(e){
+        if(!this.animating && this.node.isExpandable()){
+            this.node.toggle();
+        }
+    },
+
+    
+    startDrop : function(){
+        this.dropping = true;
+    },
+
+    
+    endDrop : function(){
+       setTimeout(function(){
+           this.dropping = false;
+       }.createDelegate(this), 50);
+    },
+
+    
+    expand : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "";
+    },
+
+    
+    focus : function(){
+        if(!this.node.preventHScroll){
+            try{this.anchor.focus();
+            }catch(e){}
+        }else{
+            try{
+                var noscroll = this.node.getOwnerTree().getTreeEl().dom;
+                var l = noscroll.scrollLeft;
+                this.anchor.focus();
+                noscroll.scrollLeft = l;
+            }catch(e){}
+        }
+    },
+
+
+    toggleCheck : function(value){
+        var cb = this.checkbox;
+        if(cb){
+            cb.checked = (value === undefined ? !cb.checked : value);
+            this.onCheckChange();
+        }
+    },
+
+    
+    blur : function(){
+        try{
+            this.anchor.blur();
+        }catch(e){}
+    },
+
+    
+    animExpand : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.stopFx();
+        if(!this.node.isExpandable()){
+            this.updateExpandIcon();
+            this.ctNode.style.display = "";
+            Ext.callback(callback);
+            return;
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideIn('t', {
+           callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    
+    highlight : function(){
+        var tree = this.node.getOwnerTree();
+        Ext.fly(this.wrap).highlight(
+            tree.hlColor || "C3DAF9",
+            {endColor: tree.hlBaseColor}
+        );
+    },
+
+    
+    collapse : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "none";
+    },
+
+    
+    animCollapse : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.enableDisplayMode('block');
+        ct.stopFx();
+
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideOut('t', {
+            callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    
+    getContainer : function(){
+        return this.ctNode;
+    },
+
+
+    getEl : function(){
+        return this.wrap;
+    },
+
+    
+    appendDDGhost : function(ghostNode){
+        ghostNode.appendChild(this.elNode.cloneNode(true));
+    },
+
+    
+    getDDRepairXY : function(){
+        return Ext.lib.Dom.getXY(this.iconNode);
+    },
+
+    
+    onRender : function(){
+        this.render();
+    },
+
+    
+    render : function(bulkRender){
+        var n = this.node, a = n.attributes;
+        var targetNode = n.parentNode ?
+              n.parentNode.ui.getContainer() : n.ownerTree.innerCt.dom;
+
+        if(!this.rendered){
+            this.rendered = true;
+
+            this.renderElements(n, a, targetNode, bulkRender);
+
+            if(a.qtip){
+                this.onTipChange(n, a.qtip, a.qtipTitle);
+            }else if(a.qtipCfg){
+                a.qtipCfg.target = Ext.id(this.textNode);
+                Ext.QuickTips.register(a.qtipCfg);
+            }
+            this.initEvents();
+            if(!this.node.expanded){
+                this.updateExpandIcon(true);
+            }
+        }else{
+            if(bulkRender === true) {
+                targetNode.appendChild(this.wrap);
+            }
+        }
+    },
+
+    
+    renderElements : function(n, a, targetNode, bulkRender){
+        
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var cb = Ext.isBoolean(a.checked),
+            nel,
+            href = this.getHref(a.href),
+            buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',
+            '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+            '<img alt="" src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+            '<img alt="" src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',
+            '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+             a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",
+            '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+            "</li>"].join('');
+
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+        var index = 3;
+        if(cb){
+            this.checkbox = cs[3];
+            
+            this.checkbox.defaultChecked = this.checkbox.checked;
+            index++;
+        }
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+    
+    
+    getHref : function(href){
+        return Ext.isEmpty(href) ? (Ext.isGecko ? '' : '#') : href;
+    },
+
+
+    getAnchor : function(){
+        return this.anchor;
+    },
+
+
+    getTextEl : function(){
+        return this.textNode;
+    },
+
+
+    getIconEl : function(){
+        return this.iconNode;
+    },
+
+
+    isChecked : function(){
+        return this.checkbox ? this.checkbox.checked : false;
+    },
+
+    
+    updateExpandIcon : function(){
+        if(this.rendered){
+            var n = this.node,
+                c1,
+                c2,
+                cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow",
+                hasChild = n.hasChildNodes();
+            if(hasChild || n.attributes.expandable){
+                if(n.expanded){
+                    cls += "-minus";
+                    c1 = "x-tree-node-collapsed";
+                    c2 = "x-tree-node-expanded";
+                }else{
+                    cls += "-plus";
+                    c1 = "x-tree-node-expanded";
+                    c2 = "x-tree-node-collapsed";
+                }
+                if(this.wasLeaf){
+                    this.removeClass("x-tree-node-leaf");
+                    this.wasLeaf = false;
+                }
+                if(this.c1 != c1 || this.c2 != c2){
+                    Ext.fly(this.elNode).replaceClass(c1, c2);
+                    this.c1 = c1; this.c2 = c2;
+                }
+            }else{
+                if(!this.wasLeaf){
+                    Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-collapsed");
+                    delete this.c1;
+                    delete this.c2;
+                    this.wasLeaf = true;
+                }
+            }
+            var ecc = "x-tree-ec-icon "+cls;
+            if(this.ecc != ecc){
+                this.ecNode.className = ecc;
+                this.ecc = ecc;
+            }
+        }
+    },
+
+    
+    onIdChange: function(id){
+        if(this.rendered){
+            this.elNode.setAttribute('ext:tree-node-id', id);
+        }
+    },
+
+    
+    getChildIndent : function(){
+        if(!this.childIndent){
+            var buf = [],
+                p = this.node;
+            while(p){
+                if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){
+                    if(!p.isLast()) {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />');
+                    } else {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />');
+                    }
+                }
+                p = p.parentNode;
+            }
+            this.childIndent = buf.join("");
+        }
+        return this.childIndent;
+    },
+
+    
+    renderIndent : function(){
+        if(this.rendered){
+            var indent = "",
+                p = this.node.parentNode;
+            if(p){
+                indent = p.ui.getChildIndent();
+            }
+            if(this.indentMarkup != indent){ 
+                this.indentNode.innerHTML = indent;
+                this.indentMarkup = indent;
+            }
+            this.updateExpandIcon();
+        }
+    },
+
+    destroy : function(){
+        if(this.elNode){
+            Ext.dd.Registry.unregister(this.elNode.id);
+        }
+
+        Ext.each(['textnode', 'anchor', 'checkbox', 'indentNode', 'ecNode', 'iconNode', 'elNode', 'ctNode', 'wrap', 'holder'], function(el){
+            if(this[el]){
+                Ext.fly(this[el]).remove();
+                delete this[el];
+            }
+        }, this);
+        delete this.node;
+    }
+});
+
+
+Ext.tree.RootTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    
+    render : function(){
+        if(!this.rendered){
+            var targetNode = this.node.ownerTree.innerCt.dom;
+            this.node.expanded = true;
+            targetNode.innerHTML = '<div class="x-tree-root-node"></div>';
+            this.wrap = this.ctNode = targetNode.firstChild;
+        }
+    },
+    collapse : Ext.emptyFn,
+    expand : Ext.emptyFn
+});
+Ext.tree.TreeLoader = function(config){
+    this.baseParams = {};
+    Ext.apply(this, config);
+
+    this.addEvents(
+        
+        "beforeload",
+        
+        "load",
+        
+        "loadexception"
+    );
+    Ext.tree.TreeLoader.superclass.constructor.call(this);
+    if(Ext.isString(this.paramOrder)){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+};
+
+Ext.extend(Ext.tree.TreeLoader, Ext.util.Observable, {
+    
+    
+    
+    
+    
+    
+    
+    uiProviders : {},
+
+    
+    clearOnLoad : true,
+
+    
+    paramOrder: undefined,
+
+    
+    paramsAsHash: false,
+
+    
+    nodeParameter: 'node',
+
+    
+    directFn : undefined,
+
+    
+    load : function(node, callback, scope){
+        if(this.clearOnLoad){
+            while(node.firstChild){
+                node.removeChild(node.firstChild);
+            }
+        }
+        if(this.doPreload(node)){ 
+            this.runCallback(callback, scope || node, [node]);
+        }else if(this.directFn || this.dataUrl || this.url){
+            this.requestData(node, callback, scope || node);
+        }
+    },
+
+    doPreload : function(node){
+        if(node.attributes.children){
+            if(node.childNodes.length < 1){ 
+                var cs = node.attributes.children;
+                node.beginUpdate();
+                for(var i = 0, len = cs.length; i < len; i++){
+                    var cn = node.appendChild(this.createNode(cs[i]));
+                    if(this.preloadChildren){
+                        this.doPreload(cn);
+                    }
+                }
+                node.endUpdate();
+            }
+            return true;
+        }
+        return false;
+    },
+
+    getParams: function(node){
+        var bp = Ext.apply({}, this.baseParams),
+            np = this.nodeParameter,
+            po = this.paramOrder;
+
+        np && (bp[ np ] = node.id);
+
+        if(this.directFn){
+            var buf = [node.id];
+            if(po){
+                
+                if(np && po.indexOf(np) > -1){
+                    buf = [];
+                }
+
+                for(var i = 0, len = po.length; i < len; i++){
+                    buf.push(bp[ po[i] ]);
+                }
+            }else if(this.paramsAsHash){
+                buf = [bp];
+            }
+            return buf;
+        }else{
+            return bp;
+        }
+    },
+
+    requestData : function(node, callback, scope){
+        if(this.fireEvent("beforeload", this, node, callback) !== false){
+            if(this.directFn){
+                var args = this.getParams(node);
+                args.push(this.processDirectResponse.createDelegate(this, [{callback: callback, node: node, scope: scope}], true));
+                this.directFn.apply(window, args);
+            }else{
+                this.transId = Ext.Ajax.request({
+                    method:this.requestMethod,
+                    url: this.dataUrl||this.url,
+                    success: this.handleResponse,
+                    failure: this.handleFailure,
+                    scope: this,
+                    argument: {callback: callback, node: node, scope: scope},
+                    params: this.getParams(node)
+                });
+            }
+        }else{
+            
+            
+            this.runCallback(callback, scope || node, []);
+        }
+    },
+
+    processDirectResponse: function(result, response, args){
+        if(response.status){
+            this.handleResponse({
+                responseData: Ext.isArray(result) ? result : null,
+                responseText: result,
+                argument: args
+            });
+        }else{
+            this.handleFailure({
+                argument: args
+            });
+        }
+    },
+
+    
+    runCallback: function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isLoading : function(){
+        return !!this.transId;
+    },
+
+    abort : function(){
+        if(this.isLoading()){
+            Ext.Ajax.abort(this.transId);
+        }
+    },
+
+    
+    createNode : function(attr){
+        
+        if(this.baseAttrs){
+            Ext.applyIf(attr, this.baseAttrs);
+        }
+        if(this.applyLoader !== false && !attr.loader){
+            attr.loader = this;
+        }
+        if(Ext.isString(attr.uiProvider)){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        if(attr.nodeType){
+            return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+        }else{
+            return attr.leaf ?
+                        new Ext.tree.TreeNode(attr) :
+                        new Ext.tree.AsyncTreeNode(attr);
+        }
+    },
+
+    processResponse : function(response, node, callback, scope){
+        var json = response.responseText;
+        try {
+            var o = response.responseData || Ext.decode(json);
+            node.beginUpdate();
+            for(var i = 0, len = o.length; i < len; i++){
+                var n = this.createNode(o[i]);
+                if(n){
+                    node.appendChild(n);
+                }
+            }
+            node.endUpdate();
+            this.runCallback(callback, scope || node, [node]);
+        }catch(e){
+            this.handleFailure(response);
+        }
+    },
+
+    handleResponse : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.processResponse(response, a.node, a.callback, a.scope);
+        this.fireEvent("load", this, a.node, response);
+    },
+
+    handleFailure : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.fireEvent("loadexception", this, a.node, response);
+        this.runCallback(a.callback, a.scope || a.node, [a.node]);
+    },
+
+    destroy : function(){
+        this.abort();
+        this.purgeListeners();
+    }
+});
+Ext.tree.TreeFilter = function(tree, config){
+    this.tree = tree;
+    this.filtered = {};
+    Ext.apply(this, config);
+};
+
+Ext.tree.TreeFilter.prototype = {
+    clearBlank:false,
+    reverse:false,
+    autoClear:false,
+    remove:false,
+
+     
+    filter : function(value, attr, startNode){
+        attr = attr || "text";
+        var f;
+        if(typeof value == "string"){
+            var vlen = value.length;
+            
+            if(vlen == 0 && this.clearBlank){
+                this.clear();
+                return;
+            }
+            value = value.toLowerCase();
+            f = function(n){
+                return n.attributes[attr].substr(0, vlen).toLowerCase() == value;
+            };
+        }else if(value.exec){ 
+            f = function(n){
+                return value.test(n.attributes[attr]);
+            };
+        }else{
+            throw 'Illegal filter type, must be string or regex';
+        }
+        this.filterBy(f, null, startNode);
+	},
+
+    
+    filterBy : function(fn, scope, startNode){
+        startNode = startNode || this.tree.root;
+        if(this.autoClear){
+            this.clear();
+        }
+        var af = this.filtered, rv = this.reverse;
+        var f = function(n){
+            if(n == startNode){
+                return true;
+            }
+            if(af[n.id]){
+                return false;
+            }
+            var m = fn.call(scope || n, n);
+            if(!m || rv){
+                af[n.id] = n;
+                n.ui.hide();
+                return false;
+            }
+            return true;
+        };
+        startNode.cascade(f);
+        if(this.remove){
+           for(var id in af){
+               if(typeof id != "function"){
+                   var n = af[id];
+                   if(n && n.parentNode){
+                       n.parentNode.removeChild(n);
+                   }
+               }
+           }
+        }
+    },
+
+    
+    clear : function(){
+        var t = this.tree;
+        var af = this.filtered;
+        for(var id in af){
+            if(typeof id != "function"){
+                var n = af[id];
+                if(n){
+                    n.ui.show();
+                }
+            }
+        }
+        this.filtered = {};
+    }
+};
+
+Ext.tree.TreeSorter = Ext.extend(Object, {
+    
+    constructor: function(tree, config){
+        
+    
+    
+    
+    
+    
+
+    Ext.apply(this, config);
+    tree.on({
+        scope: this,
+        beforechildrenrendered: this.doSort,
+        append: this.updateSort,
+        insert: this.updateSort,
+        textchange: this.updateSortParent
+    });
+
+    var desc = this.dir && this.dir.toLowerCase() == 'desc',
+        prop = this.property || 'text',
+        sortType = this.sortType,
+        folderSort = this.folderSort,
+        caseSensitive = this.caseSensitive === true,
+        leafAttr = this.leafAttr || 'leaf';
+
+    if(Ext.isString(sortType)){
+        sortType = Ext.data.SortTypes[sortType];
+    }
+    this.sortFn = function(n1, n2){
+        var attr1 = n1.attributes,
+            attr2 = n2.attributes;
+            
+        if(folderSort){
+            if(attr1[leafAttr] && !attr2[leafAttr]){
+                return 1;
+            }
+            if(!attr1[leafAttr] && attr2[leafAttr]){
+                return -1;
+            }
+        }
+        var prop1 = attr1[prop],
+            prop2 = attr2[prop],
+            v1 = sortType ? sortType(prop1) : (caseSensitive ? prop1 : prop1.toUpperCase()),
+            v2 = sortType ? sortType(prop2) : (caseSensitive ? prop2 : prop2.toUpperCase());
+            
+        if(v1 < v2){
+            return desc ? 1 : -1;
+        }else if(v1 > v2){
+            return desc ? -1 : 1;
+        }
+        return 0;
+    };
+    },
+    
+    doSort : function(node){
+        node.sort(this.sortFn);
+    },
+
+    updateSort : function(tree, node){
+        if(node.childrenRendered){
+            this.doSort.defer(1, this, [node]);
+        }
+    },
+
+    updateSortParent : function(node){
+        var p = node.parentNode;
+        if(p && p.childrenRendered){
+            this.doSort.defer(1, this, [p]);
+        }
+    }    
+});
+
+if(Ext.dd.DropZone){
+    
+Ext.tree.TreeDropZone = function(tree, config){
+    
+    this.allowParentInsert = config.allowParentInsert || false;
+    
+    this.allowContainerDrop = config.allowContainerDrop || false;
+    
+    this.appendOnly = config.appendOnly || false;
+
+    Ext.tree.TreeDropZone.superclass.constructor.call(this, tree.getTreeEl(), config);
+    
+    this.tree = tree;
+    
+    this.dragOverData = {};
+    
+    this.lastInsertClass = "x-tree-no-status";
+};
+
+Ext.extend(Ext.tree.TreeDropZone, Ext.dd.DropZone, {
+    
+    ddGroup : "TreeDD",
+
+    
+    expandDelay : 1000,
+
+    
+    expandNode : function(node){
+        if(node.hasChildNodes() && !node.isExpanded()){
+            node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));
+        }
+    },
+
+    
+    queueExpand : function(node){
+        this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);
+    },
+
+    
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+            this.expandProcId = false;
+        }
+    },
+
+    
+    isValidDropPoint : function(n, pt, dd, e, data){
+        if(!n || !data){ return false; }
+        var targetNode = n.node;
+        var dropNode = data.node;
+        
+        if(!(targetNode && targetNode.isTarget && pt)){
+            return false;
+        }
+        if(pt == "append" && targetNode.allowChildren === false){
+            return false;
+        }
+        if((pt == "above" || pt == "below") && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){
+            return false;
+        }
+        if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){
+            return false;
+        }
+        
+        var overEvent = this.dragOverData;
+        overEvent.tree = this.tree;
+        overEvent.target = targetNode;
+        overEvent.data = data;
+        overEvent.point = pt;
+        overEvent.source = dd;
+        overEvent.rawEvent = e;
+        overEvent.dropNode = dropNode;
+        overEvent.cancel = false;  
+        var result = this.tree.fireEvent("nodedragover", overEvent);
+        return overEvent.cancel === false && result !== false;
+    },
+
+    
+    getDropPoint : function(e, n, dd){
+        var tn = n.node;
+        if(tn.isRoot){
+            return tn.allowChildren !== false ? "append" : false; 
+        }
+        var dragEl = n.ddel;
+        var t = Ext.lib.Dom.getY(dragEl), b = t + dragEl.offsetHeight;
+        var y = Ext.lib.Event.getPageY(e);
+        var noAppend = tn.allowChildren === false || tn.isLeaf();
+        if(this.appendOnly || tn.parentNode.allowChildren === false){
+            return noAppend ? false : "append";
+        }
+        var noBelow = false;
+        if(!this.allowParentInsert){
+            noBelow = tn.hasChildNodes() && tn.isExpanded();
+        }
+        var q = (b - t) / (noAppend ? 2 : 3);
+        if(y >= t && y < (t + q)){
+            return "above";
+        }else if(!noBelow && (noAppend || y >= b-q && y <= b)){
+            return "below";
+        }else{
+            return "append";
+        }
+    },
+
+    
+    onNodeEnter : function(n, dd, e, data){
+        this.cancelExpand();
+    },
+    
+    onContainerOver : function(dd, e, data) {
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            return this.dropAllowed;
+        }
+        return this.dropNotAllowed;
+    },
+
+    
+    onNodeOver : function(n, dd, e, data){
+        var pt = this.getDropPoint(e, n, dd);
+        var node = n.node;
+        
+        
+        if(!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()){
+            this.queueExpand(node);
+        }else if(pt != "append"){
+            this.cancelExpand();
+        }
+        
+        
+        var returnCls = this.dropNotAllowed;
+        if(this.isValidDropPoint(n, pt, dd, e, data)){
+           if(pt){
+               var el = n.ddel;
+               var cls;
+               if(pt == "above"){
+                   returnCls = n.node.isFirst() ? "x-tree-drop-ok-above" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-above";
+               }else if(pt == "below"){
+                   returnCls = n.node.isLast() ? "x-tree-drop-ok-below" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-below";
+               }else{
+                   returnCls = "x-tree-drop-ok-append";
+                   cls = "x-tree-drag-append";
+               }
+               if(this.lastInsertClass != cls){
+                   Ext.fly(el).replaceClass(this.lastInsertClass, cls);
+                   this.lastInsertClass = cls;
+               }
+           }
+       }
+       return returnCls;
+    },
+
+    
+    onNodeOut : function(n, dd, e, data){
+        this.cancelExpand();
+        this.removeDropIndicators(n);
+    },
+
+    
+    onNodeDrop : function(n, dd, e, data){
+        var point = this.getDropPoint(e, n, dd);
+        var targetNode = n.node;
+        targetNode.ui.startDrop();
+        if(!this.isValidDropPoint(n, point, dd, e, data)){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        
+        var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);
+        return this.processDrop(targetNode, data, point, dd, e, dropNode);
+    },
+    
+    onContainerDrop : function(dd, e, data){
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            var targetNode = this.tree.getRootNode();       
+            targetNode.ui.startDrop();
+            var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, 'append', e) : null);
+            return this.processDrop(targetNode, data, 'append', dd, e, dropNode);
+        }
+        return false;
+    },
+    
+    
+    processDrop: function(target, data, point, dd, e, dropNode){
+        var dropEvent = {
+            tree : this.tree,
+            target: target,
+            data: data,
+            point: point,
+            source: dd,
+            rawEvent: e,
+            dropNode: dropNode,
+            cancel: !dropNode,
+            dropStatus: false
+        };
+        var retval = this.tree.fireEvent("beforenodedrop", dropEvent);
+        if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){
+            target.ui.endDrop();
+            return dropEvent.dropStatus;
+        }
+    
+        target = dropEvent.target;
+        if(point == 'append' && !target.isExpanded()){
+            target.expand(false, null, function(){
+                this.completeDrop(dropEvent);
+            }.createDelegate(this));
+        }else{
+            this.completeDrop(dropEvent);
+        }
+        return true;
+    },
+
+    
+    completeDrop : function(de){
+        var ns = de.dropNode, p = de.point, t = de.target;
+        if(!Ext.isArray(ns)){
+            ns = [ns];
+        }
+        var n;
+        for(var i = 0, len = ns.length; i < len; i++){
+            n = ns[i];
+            if(p == "above"){
+                t.parentNode.insertBefore(n, t);
+            }else if(p == "below"){
+                t.parentNode.insertBefore(n, t.nextSibling);
+            }else{
+                t.appendChild(n);
+            }
+        }
+        n.ui.focus();
+        if(Ext.enableFx && this.tree.hlDrop){
+            n.ui.highlight();
+        }
+        t.ui.endDrop();
+        this.tree.fireEvent("nodedrop", de);
+    },
+
+    
+    afterNodeMoved : function(dd, data, e, targetNode, dropNode){
+        if(Ext.enableFx && this.tree.hlDrop){
+            dropNode.ui.focus();
+            dropNode.ui.highlight();
+        }
+        this.tree.fireEvent("nodedrop", this.tree, targetNode, data, dd, e);
+    },
+
+    
+    getTree : function(){
+        return this.tree;
+    },
+
+    
+    removeDropIndicators : function(n){
+        if(n && n.ddel){
+            var el = n.ddel;
+            Ext.fly(el).removeClass([
+                    "x-tree-drag-insert-above",
+                    "x-tree-drag-insert-below",
+                    "x-tree-drag-append"]);
+            this.lastInsertClass = "_noclass";
+        }
+    },
+
+    
+    beforeDragDrop : function(target, e, id){
+        this.cancelExpand();
+        return true;
+    },
+
+    
+    afterRepair : function(data){
+        if(data && Ext.enableFx){
+            data.node.ui.highlight();
+        }
+        this.hideProxy();
+    }    
+});
+
+}
+if(Ext.dd.DragZone){
+Ext.tree.TreeDragZone = function(tree, config){
+    Ext.tree.TreeDragZone.superclass.constructor.call(this, tree.innerCt, config);
+    
+    this.tree = tree;
+};
+
+Ext.extend(Ext.tree.TreeDragZone, Ext.dd.DragZone, {
+    
+    ddGroup : "TreeDD",
+
+    
+    onBeforeDrag : function(data, e){
+        var n = data.node;
+        return n && n.draggable && !n.disabled;
+    },
+
+    
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.tree.getSelectionModel().select(data.node);
+        this.tree.eventModel.disable();
+        this.proxy.update("");
+        data.node.ui.appendDDGhost(this.proxy.ghost.dom);
+        this.tree.fireEvent("startdrag", this.tree, data.node, e);
+    },
+
+    
+    getRepairXY : function(e, data){
+        return data.node.ui.getDDRepairXY();
+    },
+
+    
+    onEndDrag : function(data, e){
+        this.tree.eventModel.enable.defer(100, this.tree.eventModel);
+        this.tree.fireEvent("enddrag", this.tree, data.node, e);
+    },
+
+    
+    onValidDrop : function(dd, e, id){
+        this.tree.fireEvent("dragdrop", this.tree, this.dragData.node, dd, e);
+        this.hideProxy();
+    },
+
+    
+    beforeInvalidDrop : function(e, id){
+        
+        var sm = this.tree.getSelectionModel();
+        sm.clearSelections();
+        sm.select(this.dragData.node);
+    },
+    
+    
+    afterRepair : function(){
+        if (Ext.enableFx && this.tree.hlDrop) {
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    }
+});
+}
+Ext.tree.TreeEditor = function(tree, fc, config){
+    fc = fc || {};
+    var field = fc.events ? fc : new Ext.form.TextField(fc);
+    
+    Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);
+
+    this.tree = tree;
+
+    if(!tree.rendered){
+        tree.on('render', this.initEditor, this);
+    }else{
+        this.initEditor(tree);
+    }
+};
+
+Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {
+    
+    alignment: "l-l",
+    
+    autoSize: false,
+    
+    hideEl : false,
+    
+    cls: "x-small-editor x-tree-editor",
+    
+    shim:false,
+    
+    shadow:"frame",
+    
+    maxWidth: 250,
+    
+    editDelay : 350,
+
+    initEditor : function(tree){
+        tree.on({
+            scope      : this,
+            beforeclick: this.beforeNodeClick,
+            dblclick   : this.onNodeDblClick
+        });
+        
+        this.on({
+            scope          : this,
+            complete       : this.updateNode,
+            beforestartedit: this.fitToTree,
+            specialkey     : this.onSpecialKey
+        });
+        
+        this.on('startedit', this.bindScroll, this, {delay:10});
+    },
+
+    
+    fitToTree : function(ed, el){
+        var td = this.tree.getTreeEl().dom, nd = el.dom;
+        if(td.scrollLeft >  nd.offsetLeft){ 
+            td.scrollLeft = nd.offsetLeft;
+        }
+        var w = Math.min(
+                this.maxWidth,
+                (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - 5);
+        this.setSize(w, '');
+    },
+
+    
+    triggerEdit : function(node, defer){
+        this.completeEdit();
+		if(node.attributes.editable !== false){
+           
+			this.editNode = node;
+            if(this.tree.autoScroll){
+                Ext.fly(node.ui.getEl()).scrollIntoView(this.tree.body);
+            }
+            var value = node.text || '';
+            if (!Ext.isGecko && Ext.isEmpty(node.text)){
+                node.setText('&#160;');
+            }
+            this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, value]);
+            return false;
+        }
+    },
+
+    
+    bindScroll : function(){
+        this.tree.getTreeEl().on('scroll', this.cancelEdit, this);
+    },
+
+    
+    beforeNodeClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+        if(this.tree.getSelectionModel().isSelected(node)){
+            e.stopEvent();
+            return this.triggerEdit(node);
+        }
+    },
+
+    onNodeDblClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+    },
+
+    
+    updateNode : function(ed, value){
+        this.tree.getTreeEl().un('scroll', this.cancelEdit, this);
+        this.editNode.setText(value);
+    },
+
+    
+    onHide : function(){
+        Ext.tree.TreeEditor.superclass.onHide.call(this);
+        if(this.editNode){
+            this.editNode.ui.focus.defer(50, this.editNode.ui);
+        }
+    },
+
+    
+    onSpecialKey : function(field, e){
+        var k = e.getKey();
+        if(k == e.ESC){
+            e.stopEvent();
+            this.cancelEdit();
+        }else if(k == e.ENTER && !e.hasModifier()){
+            e.stopEvent();
+            this.completeEdit();
+        }
+    },
+    
+    onDestroy : function(){
+        clearTimeout(this.autoEditTimer);
+        Ext.tree.TreeEditor.superclass.onDestroy.call(this);
+        var tree = this.tree;
+        tree.un('beforeclick', this.beforeNodeClick, this);
+        tree.un('dblclick', this.onNodeDblClick, this);
+    }
+});
+
+var swfobject = function() {
+    
+    var UNDEF = "undefined",
+        OBJECT = "object",
+        SHOCKWAVE_FLASH = "Shockwave Flash",
+        SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash",
+        FLASH_MIME_TYPE = "application/x-shockwave-flash",
+        EXPRESS_INSTALL_ID = "SWFObjectExprInst",
+        ON_READY_STATE_CHANGE = "onreadystatechange",
+        
+        win = window,
+        doc = document,
+        nav = navigator,
+        
+        plugin = false,
+        domLoadFnArr = [main],
+        regObjArr = [],
+        objIdArr = [],
+        listenersArr = [],
+        storedAltContent,
+        storedAltContentId,
+        storedCallbackFn,
+        storedCallbackObj,
+        isDomLoaded = false,
+        isExpressInstallActive = false,
+        dynamicStylesheet,
+        dynamicStylesheetMedia,
+        autoHideShow = true,
+    
+      
+    ua = function() {
+        var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF,
+            u = nav.userAgent.toLowerCase(),
+            p = nav.platform.toLowerCase(),
+            windows = p ? (/win/).test(p) : /win/.test(u),
+            mac = p ? (/mac/).test(p) : /mac/.test(u),
+            webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, 
+            ie = !+"\v1", 
+            playerVersion = [0,0,0],
+            d = null;
+        if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) {
+            d = nav.plugins[SHOCKWAVE_FLASH].description;
+            if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { 
+                plugin = true;
+                ie = false; 
+                d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
+                playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10);
+                playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10);
+                playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0;
+            }
+        }
+        else if (typeof win.ActiveXObject != UNDEF) {
+            try {
+                var a = new ActiveXObject(SHOCKWAVE_FLASH_AX);
+                if (a) { 
+                    d = a.GetVariable("$version");
+                    if (d) {
+                        ie = true; 
+                        d = d.split(" ")[1].split(",");
+                        playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+            }
+            catch(e) {}
+        }
+        return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac };
+    }(),
+    
+     
+    onDomLoad = function() {
+        if (!ua.w3) { return; }
+        if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { 
+            callDomLoadFunctions();
+        }
+        if (!isDomLoaded) {
+            if (typeof doc.addEventListener != UNDEF) {
+                doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false);
+            }       
+            if (ua.ie && ua.win) {
+                doc.attachEvent(ON_READY_STATE_CHANGE, function() {
+                    if (doc.readyState == "complete") {
+                        doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee);
+                        callDomLoadFunctions();
+                    }
+                });
+                if (win == top) { 
+                    (function(){
+                        if (isDomLoaded) { return; }
+                        try {
+                            doc.documentElement.doScroll("left");
+                        }
+                        catch(e) {
+                            setTimeout(arguments.callee, 0);
+                            return;
+                        }
+                        callDomLoadFunctions();
+                    })();
+                }
+            }
+            if (ua.wk) {
+                (function(){
+                    if (isDomLoaded) { return; }
+                    if (!(/loaded|complete/).test(doc.readyState)) {
+                        setTimeout(arguments.callee, 0);
+                        return;
+                    }
+                    callDomLoadFunctions();
+                })();
+            }
+            addLoadEvent(callDomLoadFunctions);
+        }
+    }();
+    
+    function callDomLoadFunctions() {
+        if (isDomLoaded) { return; }
+        try { 
+            var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span"));
+            t.parentNode.removeChild(t);
+        }
+        catch (e) { return; }
+        isDomLoaded = true;
+        var dl = domLoadFnArr.length;
+        for (var i = 0; i < dl; i++) {
+            domLoadFnArr[i]();
+        }
+    }
+    
+    function addDomLoadEvent(fn) {
+        if (isDomLoaded) {
+            fn();
+        }
+        else { 
+            domLoadFnArr[domLoadFnArr.length] = fn; 
+        }
+    }
+    
+    
+    function addLoadEvent(fn) {
+        if (typeof win.addEventListener != UNDEF) {
+            win.addEventListener("load", fn, false);
+        }
+        else if (typeof doc.addEventListener != UNDEF) {
+            doc.addEventListener("load", fn, false);
+        }
+        else if (typeof win.attachEvent != UNDEF) {
+            addListener(win, "onload", fn);
+        }
+        else if (typeof win.onload == "function") {
+            var fnOld = win.onload;
+            win.onload = function() {
+                fnOld();
+                fn();
+            };
+        }
+        else {
+            win.onload = fn;
+        }
+    }
+    
+    
+    function main() { 
+        if (plugin) {
+            testPlayerVersion();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    
+    function testPlayerVersion() {
+        var b = doc.getElementsByTagName("body")[0];
+        var o = createElement(OBJECT);
+        o.setAttribute("type", FLASH_MIME_TYPE);
+        var t = b.appendChild(o);
+        if (t) {
+            var counter = 0;
+            (function(){
+                if (typeof t.GetVariable != UNDEF) {
+                    var d = t.GetVariable("$version");
+                    if (d) {
+                        d = d.split(" ")[1].split(",");
+                        ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+                else if (counter < 10) {
+                    counter++;
+                    setTimeout(arguments.callee, 10);
+                    return;
+                }
+                b.removeChild(o);
+                t = null;
+                matchVersions();
+            })();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    
+    function matchVersions() {
+        var rl = regObjArr.length;
+        if (rl > 0) {
+            for (var i = 0; i < rl; i++) { 
+                var id = regObjArr[i].id;
+                var cb = regObjArr[i].callbackFn;
+                var cbObj = {success:false, id:id};
+                if (ua.pv[0] > 0) {
+                    var obj = getElementById(id);
+                    if (obj) {
+                        if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { 
+                            setVisibility(id, true);
+                            if (cb) {
+                                cbObj.success = true;
+                                cbObj.ref = getObjectById(id);
+                                cb(cbObj);
+                            }
+                        }
+                        else if (regObjArr[i].expressInstall && canExpressInstall()) { 
+                            var att = {};
+                            att.data = regObjArr[i].expressInstall;
+                            att.width = obj.getAttribute("width") || "0";
+                            att.height = obj.getAttribute("height") || "0";
+                            if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); }
+                            if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); }
+                            
+                            var par = {};
+                            var p = obj.getElementsByTagName("param");
+                            var pl = p.length;
+                            for (var j = 0; j < pl; j++) {
+                                if (p[j].getAttribute("name").toLowerCase() != "movie") {
+                                    par[p[j].getAttribute("name")] = p[j].getAttribute("value");
+                                }
+                            }
+                            showExpressInstall(att, par, id, cb);
+                        }
+                        else { 
+                            displayAltContent(obj);
+                            if (cb) { cb(cbObj); }
+                        }
+                    }
+                }
+                else {  
+                    setVisibility(id, true);
+                    if (cb) {
+                        var o = getObjectById(id); 
+                        if (o && typeof o.SetVariable != UNDEF) { 
+                            cbObj.success = true;
+                            cbObj.ref = o;
+                        }
+                        cb(cbObj);
+                    }
+                }
+            }
+        }
+    }
+    
+    function getObjectById(objectIdStr) {
+        var r = null;
+        var o = getElementById(objectIdStr);
+        if (o && o.nodeName == "OBJECT") {
+            if (typeof o.SetVariable != UNDEF) {
+                r = o;
+            }
+            else {
+                var n = o.getElementsByTagName(OBJECT)[0];
+                if (n) {
+                    r = n;
+                }
+            }
+        }
+        return r;
+    }
+    
+    
+    function canExpressInstall() {
+        return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312);
+    }
+    
+    
+    function showExpressInstall(att, par, replaceElemIdStr, callbackFn) {
+        isExpressInstallActive = true;
+        storedCallbackFn = callbackFn || null;
+        storedCallbackObj = {success:false, id:replaceElemIdStr};
+        var obj = getElementById(replaceElemIdStr);
+        if (obj) {
+            if (obj.nodeName == "OBJECT") { 
+                storedAltContent = abstractAltContent(obj);
+                storedAltContentId = null;
+            }
+            else { 
+                storedAltContent = obj;
+                storedAltContentId = replaceElemIdStr;
+            }
+            att.id = EXPRESS_INSTALL_ID;
+            if (typeof att.width == UNDEF || (!(/%$/).test(att.width) && parseInt(att.width, 10) < 310)) {
+                att.width = "310";
+            }
+            
+            if (typeof att.height == UNDEF || (!(/%$/).test(att.height) && parseInt(att.height, 10) < 137)) {
+                att.height = "137";
+            }
+            doc.title = doc.title.slice(0, 47) + " - Flash Player Installation";
+            var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn",
+                fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title;
+            if (typeof par.flashvars != UNDEF) {
+                par.flashvars += "&" + fv;
+            }
+            else {
+                par.flashvars = fv;
+            }
+            
+            
+            if (ua.ie && ua.win && obj.readyState != 4) {
+                var newObj = createElement("div");
+                replaceElemIdStr += "SWFObjectNew";
+                newObj.setAttribute("id", replaceElemIdStr);
+                obj.parentNode.insertBefore(newObj, obj); 
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        obj.parentNode.removeChild(obj);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            createSWF(att, par, replaceElemIdStr);
+        }
+    }
+    
+    
+    function displayAltContent(obj) {
+        if (ua.ie && ua.win && obj.readyState != 4) {
+            
+            
+            var el = createElement("div");
+            obj.parentNode.insertBefore(el, obj); 
+            el.parentNode.replaceChild(abstractAltContent(obj), el);
+            obj.style.display = "none";
+            (function(){
+                if (obj.readyState == 4) {
+                    obj.parentNode.removeChild(obj);
+                }
+                else {
+                    setTimeout(arguments.callee, 10);
+                }
+            })();
+        }
+        else {
+            obj.parentNode.replaceChild(abstractAltContent(obj), obj);
+        }
+    } 
+
+    function abstractAltContent(obj) {
+        var ac = createElement("div");
+        if (ua.win && ua.ie) {
+            ac.innerHTML = obj.innerHTML;
+        }
+        else {
+            var nestedObj = obj.getElementsByTagName(OBJECT)[0];
+            if (nestedObj) {
+                var c = nestedObj.childNodes;
+                if (c) {
+                    var cl = c.length;
+                    for (var i = 0; i < cl; i++) {
+                        if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) {
+                            ac.appendChild(c[i].cloneNode(true));
+                        }
+                    }
+                }
+            }
+        }
+        return ac;
+    }
+    
+    
+    function createSWF(attObj, parObj, id) {
+        var r, el = getElementById(id);
+        if (ua.wk && ua.wk < 312) { return r; }
+        if (el) {
+            if (typeof attObj.id == UNDEF) { 
+                attObj.id = id;
+            }
+            if (ua.ie && ua.win) { 
+                var att = "";
+                for (var i in attObj) {
+                    if (attObj[i] != Object.prototype[i]) { 
+                        if (i.toLowerCase() == "data") {
+                            parObj.movie = attObj[i];
+                        }
+                        else if (i.toLowerCase() == "styleclass") { 
+                            att += ' class="' + attObj[i] + '"';
+                        }
+                        else if (i.toLowerCase() != "classid") {
+                            att += ' ' + i + '="' + attObj[i] + '"';
+                        }
+                    }
+                }
+                var par = "";
+                for (var j in parObj) {
+                    if (parObj[j] != Object.prototype[j]) { 
+                        par += '<param name="' + j + '" value="' + parObj[j] + '" />';
+                    }
+                }
+                el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';
+                objIdArr[objIdArr.length] = attObj.id; 
+                r = getElementById(attObj.id);  
+            }
+            else { 
+                var o = createElement(OBJECT);
+                o.setAttribute("type", FLASH_MIME_TYPE);
+                for (var m in attObj) {
+                    if (attObj[m] != Object.prototype[m]) { 
+                        if (m.toLowerCase() == "styleclass") { 
+                            o.setAttribute("class", attObj[m]);
+                        }
+                        else if (m.toLowerCase() != "classid") { 
+                            o.setAttribute(m, attObj[m]);
+                        }
+                    }
+                }
+                for (var n in parObj) {
+                    if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { 
+                        createObjParam(o, n, parObj[n]);
+                    }
+                }
+                el.parentNode.replaceChild(o, el);
+                r = o;
+            }
+        }
+        return r;
+    }
+    
+    function createObjParam(el, pName, pValue) {
+        var p = createElement("param");
+        p.setAttribute("name", pName);  
+        p.setAttribute("value", pValue);
+        el.appendChild(p);
+    }
+    
+    
+    function removeSWF(id) {
+        var obj = getElementById(id);
+        if (obj && obj.nodeName == "OBJECT") {
+            if (ua.ie && ua.win) {
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        removeObjectInIE(id);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            else {
+                obj.parentNode.removeChild(obj);
+            }
+        }
+    }
+    
+    function removeObjectInIE(id) {
+        var obj = getElementById(id);
+        if (obj) {
+            for (var i in obj) {
+                if (typeof obj[i] == "function") {
+                    obj[i] = null;
+                }
+            }
+            obj.parentNode.removeChild(obj);
+        }
+    }
+    
+    
+    function getElementById(id) {
+        var el = null;
+        try {
+            el = doc.getElementById(id);
+        }
+        catch (e) {}
+        return el;
+    }
+    
+    function createElement(el) {
+        return doc.createElement(el);
+    }
+    
+      
+    function addListener(target, eventType, fn) {
+        target.attachEvent(eventType, fn);
+        listenersArr[listenersArr.length] = [target, eventType, fn];
+    }
+    
+    
+    function hasPlayerVersion(rv) {
+        var pv = ua.pv, v = rv.split(".");
+        v[0] = parseInt(v[0], 10);
+        v[1] = parseInt(v[1], 10) || 0; 
+        v[2] = parseInt(v[2], 10) || 0;
+        return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false;
+    }
+    
+      
+    function createCSS(sel, decl, media, newStyle) {
+        if (ua.ie && ua.mac) { return; }
+        var h = doc.getElementsByTagName("head")[0];
+        if (!h) { return; } 
+        var m = (media && typeof media == "string") ? media : "screen";
+        if (newStyle) {
+            dynamicStylesheet = null;
+            dynamicStylesheetMedia = null;
+        }
+        if (!dynamicStylesheet || dynamicStylesheetMedia != m) { 
+            
+            var s = createElement("style");
+            s.setAttribute("type", "text/css");
+            s.setAttribute("media", m);
+            dynamicStylesheet = h.appendChild(s);
+            if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) {
+                dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1];
+            }
+            dynamicStylesheetMedia = m;
+        }
+        
+        if (ua.ie && ua.win) {
+            if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) {
+                dynamicStylesheet.addRule(sel, decl);
+            }
+        }
+        else {
+            if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) {
+                dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}"));
+            }
+        }
+    }
+    
+    function setVisibility(id, isVisible) {
+        if (!autoHideShow) { return; }
+        var v = isVisible ? "visible" : "hidden";
+        if (isDomLoaded && getElementById(id)) {
+            getElementById(id).style.visibility = v;
+        }
+        else {
+            createCSS("#" + id, "visibility:" + v);
+        }
+    }
+
+    
+    function urlEncodeIfNecessary(s) {
+        var regex = /[\\\"<>\.;]/;
+        var hasBadChars = regex.exec(s) != null;
+        return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s;
+    }
+    
+    
+    var cleanup = function() {
+        if (ua.ie && ua.win) {
+            window.attachEvent("onunload", function() {
+                
+                var ll = listenersArr.length;
+                for (var i = 0; i < ll; i++) {
+                    listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]);
+                }
+                
+                var il = objIdArr.length;
+                for (var j = 0; j < il; j++) {
+                    removeSWF(objIdArr[j]);
+                }
+                
+                for (var k in ua) {
+                    ua[k] = null;
+                }
+                ua = null;
+                for (var l in swfobject) {
+                    swfobject[l] = null;
+                }
+                swfobject = null;
+                window.detachEvent('onunload', arguments.callee);
+            });
+        }
+    }();
+    
+    return {
+         
+        registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) {
+            if (ua.w3 && objectIdStr && swfVersionStr) {
+                var regObj = {};
+                regObj.id = objectIdStr;
+                regObj.swfVersion = swfVersionStr;
+                regObj.expressInstall = xiSwfUrlStr;
+                regObj.callbackFn = callbackFn;
+                regObjArr[regObjArr.length] = regObj;
+                setVisibility(objectIdStr, false);
+            }
+            else if (callbackFn) {
+                callbackFn({success:false, id:objectIdStr});
+            }
+        },
+        
+        getObjectById: function(objectIdStr) {
+            if (ua.w3) {
+                return getObjectById(objectIdStr);
+            }
+        },
+        
+        embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) {
+            var callbackObj = {success:false, id:replaceElemIdStr};
+            if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) {
+                setVisibility(replaceElemIdStr, false);
+                addDomLoadEvent(function() {
+                    widthStr += ""; 
+                    heightStr += "";
+                    var att = {};
+                    if (attObj && typeof attObj === OBJECT) {
+                        for (var i in attObj) { 
+                            att[i] = attObj[i];
+                        }
+                    }
+                    att.data = swfUrlStr;
+                    att.width = widthStr;
+                    att.height = heightStr;
+                    var par = {}; 
+                    if (parObj && typeof parObj === OBJECT) {
+                        for (var j in parObj) { 
+                            par[j] = parObj[j];
+                        }
+                    }
+                    if (flashvarsObj && typeof flashvarsObj === OBJECT) {
+                        for (var k in flashvarsObj) { 
+                            if (typeof par.flashvars != UNDEF) {
+                                par.flashvars += "&" + k + "=" + flashvarsObj[k];
+                            }
+                            else {
+                                par.flashvars = k + "=" + flashvarsObj[k];
+                            }
+                        }
+                    }
+                    if (hasPlayerVersion(swfVersionStr)) { 
+                        var obj = createSWF(att, par, replaceElemIdStr);
+                        if (att.id == replaceElemIdStr) {
+                            setVisibility(replaceElemIdStr, true);
+                        }
+                        callbackObj.success = true;
+                        callbackObj.ref = obj;
+                    }
+                    else if (xiSwfUrlStr && canExpressInstall()) { 
+                        att.data = xiSwfUrlStr;
+                        showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+                        return;
+                    }
+                    else { 
+                        setVisibility(replaceElemIdStr, true);
+                    }
+                    if (callbackFn) { callbackFn(callbackObj); }
+                });
+            }
+            else if (callbackFn) { callbackFn(callbackObj); }
+        },
+        
+        switchOffAutoHideShow: function() {
+            autoHideShow = false;
+        },
+        
+        ua: ua,
+        
+        getFlashPlayerVersion: function() {
+            return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] };
+        },
+        
+        hasFlashPlayerVersion: hasPlayerVersion,
+        
+        createSWF: function(attObj, parObj, replaceElemIdStr) {
+            if (ua.w3) {
+                return createSWF(attObj, parObj, replaceElemIdStr);
+            }
+            else {
+                return undefined;
+            }
+        },
+        
+        showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) {
+            if (ua.w3 && canExpressInstall()) {
+                showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+            }
+        },
+        
+        removeSWF: function(objElemIdStr) {
+            if (ua.w3) {
+                removeSWF(objElemIdStr);
+            }
+        },
+        
+        createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) {
+            if (ua.w3) {
+                createCSS(selStr, declStr, mediaStr, newStyleBoolean);
+            }
+        },
+        
+        addDomLoadEvent: addDomLoadEvent,
+        
+        addLoadEvent: addLoadEvent,
+        
+        getQueryParamValue: function(param) {
+            var q = doc.location.search || doc.location.hash;
+            if (q) {
+                if (/\?/.test(q)) { q = q.split("?")[1]; } 
+                if (param == null) {
+                    return urlEncodeIfNecessary(q);
+                }
+                var pairs = q.split("&");
+                for (var i = 0; i < pairs.length; i++) {
+                    if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) {
+                        return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1)));
+                    }
+                }
+            }
+            return "";
+        },
+        
+        
+        expressInstallCallback: function() {
+            if (isExpressInstallActive) {
+                var obj = getElementById(EXPRESS_INSTALL_ID);
+                if (obj && storedAltContent) {
+                    obj.parentNode.replaceChild(storedAltContent, obj);
+                    if (storedAltContentId) {
+                        setVisibility(storedAltContentId, true);
+                        if (ua.ie && ua.win) { storedAltContent.style.display = "block"; }
+                    }
+                    if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); }
+                }
+                isExpressInstallActive = false;
+            } 
+        }
+    };
+}();
+
+Ext.FlashComponent = Ext.extend(Ext.BoxComponent, {
+    
+    flashVersion : '9.0.115',
+
+    
+    backgroundColor: '#ffffff',
+
+    
+    wmode: 'opaque',
+
+    
+    flashVars: undefined,
+
+    
+    flashParams: undefined,
+
+    
+    url: undefined,
+    swfId : undefined,
+    swfWidth: '100%',
+    swfHeight: '100%',
+
+    
+    expressInstall: false,
+
+    initComponent : function(){
+        Ext.FlashComponent.superclass.initComponent.call(this);
+
+        this.addEvents(
+            
+            'initialize'
+        );
+    },
+
+    onRender : function(){
+        Ext.FlashComponent.superclass.onRender.apply(this, arguments);
+
+        var params = Ext.apply({
+            allowScriptAccess: 'always',
+            bgcolor: this.backgroundColor,
+            wmode: this.wmode
+        }, this.flashParams), vars = Ext.apply({
+            allowedDomain: document.location.hostname,
+            YUISwfId: this.getId(),
+            YUIBridgeCallback: 'Ext.FlashEventProxy.onEvent'
+        }, this.flashVars);
+
+        new swfobject.embedSWF(this.url, this.id, this.swfWidth, this.swfHeight, this.flashVersion,
+            this.expressInstall ? Ext.FlashComponent.EXPRESS_INSTALL_URL : undefined, vars, params);
+
+        this.swf = Ext.getDom(this.id);
+        this.el = Ext.get(this.swf);
+    },
+
+    getSwfId : function(){
+        return this.swfId || (this.swfId = "extswf" + (++Ext.Component.AUTO_ID));
+    },
+
+    getId : function(){
+        return this.id || (this.id = "extflashcmp" + (++Ext.Component.AUTO_ID));
+    },
+
+    onFlashEvent : function(e){
+        switch(e.type){
+            case "swfReady":
+                this.initSwf();
+                return;
+            case "log":
+                return;
+        }
+        e.component = this;
+        this.fireEvent(e.type.toLowerCase().replace(/event$/, ''), e);
+    },
+
+    initSwf : function(){
+        this.onSwfReady(!!this.isInitialized);
+        this.isInitialized = true;
+        this.fireEvent('initialize', this);
+    },
+
+    beforeDestroy: function(){
+        if(this.rendered){
+            swfobject.removeSWF(this.swf.id);
+        }
+        Ext.FlashComponent.superclass.beforeDestroy.call(this);
+    },
+
+    onSwfReady : Ext.emptyFn
+});
+
+
+Ext.FlashComponent.EXPRESS_INSTALL_URL = 'http:/' + '/swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf';
+
+Ext.reg('flash', Ext.FlashComponent);
+Ext.FlashEventProxy = {
+    onEvent : function(id, e){
+        var fp = Ext.getCmp(id);
+        if(fp){
+            fp.onFlashEvent(e);
+        }else{
+            arguments.callee.defer(10, this, [id, e]);
+        }
+    }
+};
+
+ Ext.chart.Chart = Ext.extend(Ext.FlashComponent, {
+    refreshBuffer: 100,
+
+    
+
+    
+    chartStyle: {
+        padding: 10,
+        animationEnabled: true,
+        font: {
+            name: 'Tahoma',
+            color: 0x444444,
+            size: 11
+        },
+        dataTip: {
+            padding: 5,
+            border: {
+                color: 0x99bbe8,
+                size:1
+            },
+            background: {
+                color: 0xDAE7F6,
+                alpha: .9
+            },
+            font: {
+                name: 'Tahoma',
+                color: 0x15428B,
+                size: 10,
+                bold: true
+            }
+        }
+    },
+
+    
+
+    
+    extraStyle: null,
+
+    
+    seriesStyles: null,
+
+    
+    disableCaching: Ext.isIE || Ext.isOpera,
+    disableCacheParam: '_dc',
+
+    initComponent : function(){
+        Ext.chart.Chart.superclass.initComponent.call(this);
+        if(!this.url){
+            this.url = Ext.chart.Chart.CHART_URL;
+        }
+        if(this.disableCaching){
+            this.url = Ext.urlAppend(this.url, String.format('{0}={1}', this.disableCacheParam, new Date().getTime()));
+        }
+        this.addEvents(
+            'itemmouseover',
+            'itemmouseout',
+            'itemclick',
+            'itemdoubleclick',
+            'itemdragstart',
+            'itemdrag',
+            'itemdragend',
+            
+            'beforerefresh',
+            
+            'refresh'
+        );
+        this.store = Ext.StoreMgr.lookup(this.store);
+    },
+
+    
+     setStyle: function(name, value){
+         this.swf.setStyle(name, Ext.encode(value));
+     },
+
+    
+    setStyles: function(styles){
+        this.swf.setStyles(Ext.encode(styles));
+    },
+
+    
+    setSeriesStyles: function(styles){
+        this.seriesStyles = styles;
+        var s = [];
+        Ext.each(styles, function(style){
+            s.push(Ext.encode(style));
+        });
+        this.swf.setSeriesStyles(s);
+    },
+
+    setCategoryNames : function(names){
+        this.swf.setCategoryNames(names);
+    },
+
+    setLegendRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.legendFnName);
+        chart.legendFnName = chart.createFnProxy(function(name){
+            return fn.call(scope, name);
+        });
+        chart.swf.setLegendLabelFunction(chart.legendFnName);
+    },
+
+    setTipRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.tipFnName);
+        chart.tipFnName = chart.createFnProxy(function(item, index, series){
+            var record = chart.store.getAt(index);
+            return fn.call(scope, chart, record, index, series);
+        });
+        chart.swf.setDataTipFunction(chart.tipFnName);
+    },
+
+    setSeries : function(series){
+        this.series = series;
+        this.refresh();
+    },
+
+    
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("datachanged", this.refresh, this);
+                this.store.un("add", this.delayRefresh, this);
+                this.store.un("remove", this.delayRefresh, this);
+                this.store.un("update", this.delayRefresh, this);
+                this.store.un("clear", this.refresh, this);
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                datachanged: this.refresh,
+                add: this.delayRefresh,
+                remove: this.delayRefresh,
+                update: this.delayRefresh,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store && !initial){
+            this.refresh();
+        }
+    },
+
+    onSwfReady : function(isReset){
+        Ext.chart.Chart.superclass.onSwfReady.call(this, isReset);
+        var ref;
+        this.swf.setType(this.type);
+
+        if(this.chartStyle){
+            this.setStyles(Ext.apply({}, this.extraStyle, this.chartStyle));
+        }
+
+        if(this.categoryNames){
+            this.setCategoryNames(this.categoryNames);
+        }
+
+        if(this.tipRenderer){
+            ref = this.getFunctionRef(this.tipRenderer);
+            this.setTipRenderer(ref.fn, ref.scope);
+        }
+        if(this.legendRenderer){
+            ref = this.getFunctionRef(this.legendRenderer);
+            this.setLegendRenderer(ref.fn, ref.scope);
+        }
+        if(!isReset){
+            this.bindStore(this.store, true);
+        }
+        this.refresh.defer(10, this);
+    },
+
+    delayRefresh : function(){
+        if(!this.refreshTask){
+            this.refreshTask = new Ext.util.DelayedTask(this.refresh, this);
+        }
+        this.refreshTask.delay(this.refreshBuffer);
+    },
+
+    refresh : function(){
+        if(this.fireEvent('beforerefresh', this) !== false){
+            var styleChanged = false;
+            
+            var data = [], rs = this.store.data.items;
+            for(var j = 0, len = rs.length; j < len; j++){
+                data[j] = rs[j].data;
+            }
+            
+            
+            var dataProvider = [];
+            var seriesCount = 0;
+            var currentSeries = null;
+            var i = 0;
+            if(this.series){
+                seriesCount = this.series.length;
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = this.series[i];
+                    var clonedSeries = {};
+                    for(var prop in currentSeries){
+                        if(prop == "style" && currentSeries.style !== null){
+                            clonedSeries.style = Ext.encode(currentSeries.style);
+                            styleChanged = true;
+                            
+                            
+                            
+                            
+                        } else{
+                            clonedSeries[prop] = currentSeries[prop];
+                        }
+                    }
+                    dataProvider.push(clonedSeries);
+                }
+            }
+
+            if(seriesCount > 0){
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = dataProvider[i];
+                    if(!currentSeries.type){
+                        currentSeries.type = this.type;
+                    }
+                    currentSeries.dataProvider = data;
+                }
+            } else{
+                dataProvider.push({type: this.type, dataProvider: data});
+            }
+            this.swf.setDataProvider(dataProvider);
+            if(this.seriesStyles){
+                this.setSeriesStyles(this.seriesStyles);
+            }
+            this.fireEvent('refresh', this);
+        }
+    },
+
+    
+    createFnProxy : function(fn){
+        var fnName = 'extFnProxy' + (++Ext.chart.Chart.PROXY_FN_ID);
+        Ext.chart.Chart.proxyFunction[fnName] = fn;
+        return 'Ext.chart.Chart.proxyFunction.' + fnName;
+    },
+
+    
+    removeFnProxy : function(fn){
+        if(!Ext.isEmpty(fn)){
+            fn = fn.replace('Ext.chart.Chart.proxyFunction.', '');
+            delete Ext.chart.Chart.proxyFunction[fn];
+        }
+    },
+
+    
+    getFunctionRef : function(val){
+        if(Ext.isFunction(val)){
+            return {
+                fn: val,
+                scope: this
+            };
+        }else{
+            return {
+                fn: val.fn,
+                scope: val.scope || this
+            };
+        }
+    },
+
+    
+    onDestroy: function(){
+        if (this.refreshTask && this.refreshTask.cancel){
+            this.refreshTask.cancel();
+        }
+        Ext.chart.Chart.superclass.onDestroy.call(this);
+        this.bindStore(null);
+        this.removeFnProxy(this.tipFnName);
+        this.removeFnProxy(this.legendFnName);
+    }
+});
+Ext.reg('chart', Ext.chart.Chart);
+Ext.chart.Chart.PROXY_FN_ID = 0;
+Ext.chart.Chart.proxyFunction = {};
+
+
+Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf';
+
+
+Ext.chart.PieChart = Ext.extend(Ext.chart.Chart, {
+    type: 'pie',
+
+    onSwfReady : function(isReset){
+        Ext.chart.PieChart.superclass.onSwfReady.call(this, isReset);
+
+        this.setDataField(this.dataField);
+        this.setCategoryField(this.categoryField);
+    },
+
+    setDataField : function(field){
+        this.dataField = field;
+        this.swf.setDataField(field);
+    },
+
+    setCategoryField : function(field){
+        this.categoryField = field;
+        this.swf.setCategoryField(field);
+    }
+});
+Ext.reg('piechart', Ext.chart.PieChart);
+
+
+Ext.chart.CartesianChart = Ext.extend(Ext.chart.Chart, {
+    onSwfReady : function(isReset){
+        Ext.chart.CartesianChart.superclass.onSwfReady.call(this, isReset);
+        this.labelFn = [];
+        if(this.xField){
+            this.setXField(this.xField);
+        }
+        if(this.yField){
+            this.setYField(this.yField);
+        }
+        if(this.xAxis){
+            this.setXAxis(this.xAxis);
+        }
+        if(this.xAxes){
+            this.setXAxes(this.xAxes);
+        }
+        if(this.yAxis){
+            this.setYAxis(this.yAxis);
+        }
+        if(this.yAxes){
+            this.setYAxes(this.yAxes);
+        }
+        if(Ext.isDefined(this.constrainViewport)){
+            this.swf.setConstrainViewport(this.constrainViewport);
+        }
+    },
+
+    setXField : function(value){
+        this.xField = value;
+        this.swf.setHorizontalField(value);
+    },
+
+    setYField : function(value){
+        this.yField = value;
+        this.swf.setVerticalField(value);
+    },
+
+    setXAxis : function(value){
+        this.xAxis = this.createAxis('xAxis', value);
+        this.swf.setHorizontalAxis(this.xAxis);
+    },
+
+    setXAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('xAxis' + i, value[i]);
+            this.swf.setHorizontalAxis(axis);
+        }
+    },
+
+    setYAxis : function(value){
+        this.yAxis = this.createAxis('yAxis', value);
+        this.swf.setVerticalAxis(this.yAxis);
+    },
+
+    setYAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('yAxis' + i, value[i]);
+            this.swf.setVerticalAxis(axis);
+        }
+    },
+
+    createAxis : function(axis, value){
+        var o = Ext.apply({}, value),
+            ref,
+            old;
+
+        if(this[axis]){
+            old = this[axis].labelFunction;
+            this.removeFnProxy(old);
+            this.labelFn.remove(old);
+        }
+        if(o.labelRenderer){
+            ref = this.getFunctionRef(o.labelRenderer);
+            o.labelFunction = this.createFnProxy(function(v){
+                return ref.fn.call(ref.scope, v);
+            });
+            delete o.labelRenderer;
+            this.labelFn.push(o.labelFunction);
+        }
+        if(axis.indexOf('xAxis') > -1 && o.position == 'left'){
+            o.position = 'bottom';
+        }
+        return o;
+    },
+
+    onDestroy : function(){
+        Ext.chart.CartesianChart.superclass.onDestroy.call(this);
+        Ext.each(this.labelFn, function(fn){
+            this.removeFnProxy(fn);
+        }, this);
+    }
+});
+Ext.reg('cartesianchart', Ext.chart.CartesianChart);
+
+
+Ext.chart.LineChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'line'
+});
+Ext.reg('linechart', Ext.chart.LineChart);
+
+
+Ext.chart.ColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'column'
+});
+Ext.reg('columnchart', Ext.chart.ColumnChart);
+
+
+Ext.chart.StackedColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackcolumn'
+});
+Ext.reg('stackedcolumnchart', Ext.chart.StackedColumnChart);
+
+
+Ext.chart.BarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'bar'
+});
+Ext.reg('barchart', Ext.chart.BarChart);
+
+
+Ext.chart.StackedBarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackbar'
+});
+Ext.reg('stackedbarchart', Ext.chart.StackedBarChart);
+
+
+
+
+Ext.chart.Axis = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.chart.Axis.prototype =
+{
+    
+    type: null,
+
+    
+    orientation: "horizontal",
+
+    
+    reverse: false,
+
+    
+    labelFunction: null,
+
+    
+    hideOverlappingLabels: true,
+
+    
+    labelSpacing: 2
+};
+
+
+Ext.chart.NumericAxis = Ext.extend(Ext.chart.Axis, {
+    type: "numeric",
+
+    
+    minimum: NaN,
+
+    
+    maximum: NaN,
+
+    
+    majorUnit: NaN,
+
+    
+    minorUnit: NaN,
+
+    
+    snapToUnits: true,
+
+    
+    alwaysShowZero: true,
+
+    
+    scale: "linear",
+
+    
+    roundMajorUnit: true,
+
+    
+    calculateByLabelSize: true,
+
+    
+    position: 'left',
+
+    
+    adjustMaximumByMajorUnit: true,
+
+    
+    adjustMinimumByMajorUnit: true
+
+});
+
+
+Ext.chart.TimeAxis = Ext.extend(Ext.chart.Axis, {
+    type: "time",
+
+    
+    minimum: null,
+
+    
+    maximum: null,
+
+    
+    majorUnit: NaN,
+
+    
+    majorTimeUnit: null,
+
+    
+    minorUnit: NaN,
+
+    
+    minorTimeUnit: null,
+
+    
+    snapToUnits: true,
+
+    
+    stackingEnabled: false,
+
+    
+    calculateByLabelSize: true
+
+});
+
+
+Ext.chart.CategoryAxis = Ext.extend(Ext.chart.Axis, {
+    type: "category",
+
+    
+    categoryNames: null,
+
+    
+    calculateCategoryCount: false
+
+});
+
+
+Ext.chart.Series = function(config) { Ext.apply(this, config); };
+
+Ext.chart.Series.prototype =
+{
+    
+    type: null,
+
+    
+    displayName: null
+};
+
+
+Ext.chart.CartesianSeries = Ext.extend(Ext.chart.Series, {
+    
+    xField: null,
+
+    
+    yField: null,
+
+    
+    showInLegend: true,
+
+    
+    axis: 'primary'
+});
+
+
+Ext.chart.ColumnSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "column"
+});
+
+
+Ext.chart.LineSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "line"
+});
+
+
+Ext.chart.BarSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "bar"
+});
+
+
+
+Ext.chart.PieSeries = Ext.extend(Ext.chart.Series, {
+    type: "pie",
+    dataField: null,
+    categoryField: null
+});
+Ext.menu.Menu = Ext.extend(Ext.Container, {
+    
+    
+    
+    minWidth : 120,
+    
+    shadow : 'sides',
+    
+    subMenuAlign : 'tl-tr?',
+    
+    defaultAlign : 'tl-bl?',
+    
+    allowOtherMenus : false,
+    
+    ignoreParentClicks : false,
+    
+    enableScrolling : true,
+    
+    maxHeight : null,
+    
+    scrollIncrement : 24,
+    
+    showSeparator : true,
+    
+    defaultOffsets : [0, 0],
+
+    
+    plain : false,
+
+    
+    floating : true,
+
+
+    
+    zIndex: 15000,
+
+    
+    hidden : true,
+
+    
+    layout : 'menu',
+    hideMode : 'offsets',    
+    scrollerHeight : 8,
+    autoLayout : true,       
+    defaultType : 'menuitem',
+    bufferResize : false,
+
+    initComponent : function(){
+        if(Ext.isArray(this.initialConfig)){
+            Ext.apply(this, {items:this.initialConfig});
+        }
+        this.addEvents(
+            
+            'click',
+            
+            'mouseover',
+            
+            'mouseout',
+            
+            'itemclick'
+        );
+        Ext.menu.MenuMgr.register(this);
+        if(this.floating){
+            Ext.EventManager.onWindowResize(this.hide, this);
+        }else{
+            if(this.initialConfig.hidden !== false){
+                this.hidden = false;
+            }
+            this.internalDefaults = {hideOnClick: false};
+        }
+        Ext.menu.Menu.superclass.initComponent.call(this);
+        if(this.autoLayout){
+            var fn = this.doLayout.createDelegate(this, []);
+            this.on({
+                add: fn,
+                remove: fn
+            });
+        }
+    },
+
+    
+    getLayoutTarget : function() {
+        return this.ul;
+    },
+
+    
+    onRender : function(ct, position){
+        if(!ct){
+            ct = Ext.getBody();
+        }
+
+        var dh = {
+            id: this.getId(),
+            cls: 'x-menu ' + ((this.floating) ? 'x-menu-floating x-layer ' : '') + (this.cls || '') + (this.plain ? ' x-menu-plain' : '') + (this.showSeparator ? '' : ' x-menu-nosep'),
+            style: this.style,
+            cn: [
+                {tag: 'a', cls: 'x-menu-focus', href: '#', onclick: 'return false;', tabIndex: '-1'},
+                {tag: 'ul', cls: 'x-menu-list'}
+            ]
+        };
+        if(this.floating){
+            this.el = new Ext.Layer({
+                shadow: this.shadow,
+                dh: dh,
+                constrain: false,
+                parentEl: ct,
+                zindex: this.zIndex
+            });
+        }else{
+            this.el = ct.createChild(dh);
+        }
+        Ext.menu.Menu.superclass.onRender.call(this, ct, position);
+
+        if(!this.keyNav){
+            this.keyNav = new Ext.menu.MenuNav(this);
+        }
+        
+        this.focusEl = this.el.child('a.x-menu-focus');
+        this.ul = this.el.child('ul.x-menu-list');
+        this.mon(this.ul, {
+            scope: this,
+            click: this.onClick,
+            mouseover: this.onMouseOver,
+            mouseout: this.onMouseOut
+        });
+        if(this.enableScrolling){
+            this.mon(this.el, {
+                scope: this,
+                delegate: '.x-menu-scroller',
+                click: this.onScroll,
+                mouseover: this.deactivateActive
+            });
+        }
+    },
+
+    
+    findTargetItem : function(e){
+        var t = e.getTarget('.x-menu-list-item', this.ul, true);
+        if(t && t.menuItemId){
+            return this.items.get(t.menuItemId);
+        }
+    },
+
+    
+    onClick : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.isFormField){
+                this.setActiveItem(t);
+            }else if(t instanceof Ext.menu.BaseItem){
+                if(t.menu && this.ignoreParentClicks){
+                    t.expandMenu();
+                    e.preventDefault();
+                }else if(t.onClick){
+                    t.onClick(e);
+                    this.fireEvent('click', this, t, e);
+                }
+            }
+        }
+    },
+
+    
+    setActiveItem : function(item, autoExpand){
+        if(item != this.activeItem){
+            this.deactivateActive();
+            if((this.activeItem = item).isFormField){
+                item.focus();
+            }else{
+                item.activate(autoExpand);
+            }
+        }else if(autoExpand){
+            item.expandMenu();
+        }
+    },
+
+    deactivateActive : function(){
+        var a = this.activeItem;
+        if(a){
+            if(a.isFormField){
+                
+                if(a.collapse){
+                    a.collapse();
+                }
+            }else{
+                a.deactivate();
+            }
+            delete this.activeItem;
+        }
+    },
+
+    
+    tryActivate : function(start, step){
+        var items = this.items;
+        for(var i = start, len = items.length; i >= 0 && i < len; i+= step){
+            var item = items.get(i);
+            if(item.isVisible() && !item.disabled && (item.canActivate || item.isFormField)){
+                this.setActiveItem(item, false);
+                return item;
+            }
+        }
+        return false;
+    },
+
+    
+    onMouseOver : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.canActivate && !t.disabled){
+                this.setActiveItem(t, true);
+            }
+        }
+        this.over = true;
+        this.fireEvent('mouseover', this, e, t);
+    },
+
+    
+    onMouseOut : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t == this.activeItem && t.shouldDeactivate && t.shouldDeactivate(e)){
+                this.activeItem.deactivate();
+                delete this.activeItem;
+            }
+        }
+        this.over = false;
+        this.fireEvent('mouseout', this, e, t);
+    },
+
+    
+    onScroll : function(e, t){
+        if(e){
+            e.stopEvent();
+        }
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        ul.scrollTop += this.scrollIncrement * (top ? -1 : 1);
+        if(top ? ul.scrollTop <= 0 : ul.scrollTop + this.activeMax >= ul.scrollHeight){
+           this.onScrollerOut(null, t);
+        }
+    },
+
+    
+    onScrollerIn : function(e, t){
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        if(top ? ul.scrollTop > 0 : ul.scrollTop + this.activeMax < ul.scrollHeight){
+            Ext.fly(t).addClass(['x-menu-item-active', 'x-menu-scroller-active']);
+        }
+    },
+
+    
+    onScrollerOut : function(e, t){
+        Ext.fly(t).removeClass(['x-menu-item-active', 'x-menu-scroller-active']);
+    },
+
+    
+    show : function(el, pos, parentMenu){
+        if(this.floating){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+                this.doLayout(false, true);
+            }
+            this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign, this.defaultOffsets), parentMenu);
+        }else{
+            Ext.menu.Menu.superclass.show.call(this);
+        }
+    },
+
+    
+    showAt : function(xy, parentMenu){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+            }
+            if(this.enableScrolling){
+                
+                this.el.setXY(xy);
+                
+                xy[1] = this.constrainScroll(xy[1]);
+                xy = [this.el.adjustForConstraints(xy)[0], xy[1]];
+            }else{
+                
+                xy = this.el.adjustForConstraints(xy);
+            }
+            this.el.setXY(xy);
+            this.el.show();
+            Ext.menu.Menu.superclass.onShow.call(this);
+            if(Ext.isIE){
+                
+                this.fireEvent('autosize', this);
+                if(!Ext.isIE8){
+                    this.el.repaint();
+                }
+            }
+            this.hidden = false;
+            this.focus();
+            this.fireEvent('show', this);
+        }
+    },
+
+    constrainScroll : function(y){
+        var max, full = this.ul.setHeight('auto').getHeight(),
+            returnY = y, normalY, parentEl, scrollTop, viewHeight;
+        if(this.floating){
+            parentEl = Ext.fly(this.el.dom.parentNode);
+            scrollTop = parentEl.getScroll().top;
+            viewHeight = parentEl.getViewSize().height;
+            
+            
+            normalY = y - scrollTop;
+            max = this.maxHeight ? this.maxHeight : viewHeight - normalY;
+            if(full > viewHeight) {
+                max = viewHeight;
+                
+                returnY = y - normalY;
+            } else if(max < full) {
+                returnY = y - (full - max);
+                max = full;
+            }
+        }else{
+            max = this.getHeight();
+        }
+        
+        if (this.maxHeight){
+            max = Math.min(this.maxHeight, max);
+        }
+        if(full > max && max > 0){
+            this.activeMax = max - this.scrollerHeight * 2 - this.el.getFrameWidth('tb') - Ext.num(this.el.shadowOffset, 0);
+            this.ul.setHeight(this.activeMax);
+            this.createScrollers();
+            this.el.select('.x-menu-scroller').setDisplayed('');
+        }else{
+            this.ul.setHeight(full);
+            this.el.select('.x-menu-scroller').setDisplayed('none');
+        }
+        this.ul.dom.scrollTop = 0;
+        return returnY;
+    },
+
+    createScrollers : function(){
+        if(!this.scroller){
+            this.scroller = {
+                pos: 0,
+                top: this.el.insertFirst({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-top',
+                    html: '&#160;'
+                }),
+                bottom: this.el.createChild({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-bottom',
+                    html: '&#160;'
+                })
+            };
+            this.scroller.top.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.topRepeater = new Ext.util.ClickRepeater(this.scroller.top, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.top], false)
+                }
+            });
+            this.scroller.bottom.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.bottomRepeater = new Ext.util.ClickRepeater(this.scroller.bottom, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.bottom], false)
+                }
+            });
+        }
+    },
+
+    onLayout : function(){
+        if(this.isVisible()){
+            if(this.enableScrolling){
+                this.constrainScroll(this.el.getTop());
+            }
+            if(this.floating){
+                this.el.sync();
+            }
+        }
+    },
+
+    focus : function(){
+        if(!this.hidden){
+            this.doFocus.defer(50, this);
+        }
+    },
+
+    doFocus : function(){
+        if(!this.hidden){
+            this.focusEl.focus();
+        }
+    },
+
+    
+    hide : function(deep){
+        if (!this.isDestroyed) {
+            this.deepHide = deep;
+            Ext.menu.Menu.superclass.hide.call(this);
+            delete this.deepHide;
+        }
+    },
+
+    
+    onHide : function(){
+        Ext.menu.Menu.superclass.onHide.call(this);
+        this.deactivateActive();
+        if(this.el && this.floating){
+            this.el.hide();
+        }
+        var pm = this.parentMenu;
+        if(this.deepHide === true && pm){
+            if(pm.floating){
+                pm.hide(true);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+
+    
+    lookupComponent : function(c){
+         if(Ext.isString(c)){
+            c = (c == 'separator' || c == '-') ? new Ext.menu.Separator() : new Ext.menu.TextItem(c);
+             this.applyDefaults(c);
+         }else{
+            if(Ext.isObject(c)){
+                c = this.getMenuItem(c);
+            }else if(c.tagName || c.el){ 
+                c = new Ext.BoxComponent({
+                    el: c
+                });
+            }
+         }
+         return c;
+    },
+
+    applyDefaults : function(c) {
+        if (!Ext.isString(c)) {
+            c = Ext.menu.Menu.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(d){
+                if(c.events){
+                    Ext.applyIf(c.initialConfig, d);
+                    Ext.apply(c, d);
+                }else{
+                    Ext.applyIf(c, d);
+                }
+            }
+        }
+        return c;
+    },
+
+    
+    getMenuItem : function(config) {
+        config.ownerCt = this;
+        
+        if (!config.isXType) {
+            if (!config.xtype && Ext.isBoolean(config.checked)) {
+                return new Ext.menu.CheckItem(config);
+            }
+            return Ext.create(config, this.defaultType);
+        }
+        return config;
+    },
+
+    
+    addSeparator : function() {
+        return this.add(new Ext.menu.Separator());
+    },
+
+    
+    addElement : function(el) {
+        return this.add(new Ext.menu.BaseItem({
+            el: el
+        }));
+    },
+
+    
+    addItem : function(item) {
+        return this.add(item);
+    },
+
+    
+    addMenuItem : function(config) {
+        return this.add(this.getMenuItem(config));
+    },
+
+    
+    addText : function(text){
+        return this.add(new Ext.menu.TextItem(text));
+    },
+
+    
+    onDestroy : function(){
+        Ext.EventManager.removeResizeListener(this.hide, this);
+        var pm = this.parentMenu;
+        if(pm && pm.activeChild == this){
+            delete pm.activeChild;
+        }
+        delete this.parentMenu;
+        Ext.menu.Menu.superclass.onDestroy.call(this);
+        Ext.menu.MenuMgr.unregister(this);
+        if(this.keyNav) {
+            this.keyNav.disable();
+        }
+        var s = this.scroller;
+        if(s){
+            Ext.destroy(s.topRepeater, s.bottomRepeater, s.top, s.bottom);
+        }
+        Ext.destroy(
+            this.el,
+            this.focusEl,
+            this.ul
+        );
+    }
+});
+
+Ext.reg('menu', Ext.menu.Menu);
+
+
+Ext.menu.MenuNav = Ext.extend(Ext.KeyNav, function(){
+    function up(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){
+            m.tryActivate(m.items.length-1, -1);
+        }
+    }
+    function down(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){
+            m.tryActivate(0, 1);
+        }
+    }
+    return {
+        constructor : function(menu){
+            Ext.menu.MenuNav.superclass.constructor.call(this, menu.el);
+            this.scope = this.menu = menu;
+        },
+
+        doRelay : function(e, h){
+            var k = e.getKey();
+
+            if (this.menu.activeItem && this.menu.activeItem.isFormField && k != e.TAB) {
+                return false;
+            }
+            if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){
+                this.menu.tryActivate(0, 1);
+                return false;
+            }
+            return h.call(this.scope || this, e, this.menu);
+        },
+
+        tab: function(e, m) {
+            e.stopEvent();
+            if (e.shiftKey) {
+                up(e, m);
+            } else {
+                down(e, m);
+            }
+        },
+
+        up : up,
+
+        down : down,
+
+        right : function(e, m){
+            if(m.activeItem){
+                m.activeItem.expandMenu(true);
+            }
+        },
+
+        left : function(e, m){
+            m.hide();
+            if(m.parentMenu && m.parentMenu.activeItem){
+                m.parentMenu.activeItem.activate();
+            }
+        },
+
+        enter : function(e, m){
+            if(m.activeItem){
+                e.stopPropagation();
+                m.activeItem.onClick(e);
+                m.fireEvent('click', this, m.activeItem);
+                return true;
+            }
+        }
+    };
+}());
+
+Ext.menu.MenuMgr = function(){
+   var menus, 
+       active, 
+       map,
+       groups = {}, 
+       attached = false, 
+       lastShow = new Date();
+   
+
+   
+   function init(){
+       menus = {};
+       active = new Ext.util.MixedCollection();
+       map = Ext.getDoc().addKeyListener(27, hideAll);
+       map.disable();
+   }
+
+   
+   function hideAll(){
+       if(active && active.length > 0){
+           var c = active.clone();
+           c.each(function(m){
+               m.hide();
+           });
+           return true;
+       }
+       return false;
+   }
+
+   
+   function onHide(m){
+       active.remove(m);
+       if(active.length < 1){
+           map.disable();
+           Ext.getDoc().un("mousedown", onMouseDown);
+           attached = false;
+       }
+   }
+
+   
+   function onShow(m){
+       var last = active.last();
+       lastShow = new Date();
+       active.add(m);
+       if(!attached){
+           map.enable();
+           Ext.getDoc().on("mousedown", onMouseDown);
+           attached = true;
+       }
+       if(m.parentMenu){
+          m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3);
+          m.parentMenu.activeChild = m;
+       }else if(last && !last.isDestroyed && last.isVisible()){
+          m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3);
+       }
+   }
+
+   
+   function onBeforeHide(m){
+       if(m.activeChild){
+           m.activeChild.hide();
+       }
+       if(m.autoHideTimer){
+           clearTimeout(m.autoHideTimer);
+           delete m.autoHideTimer;
+       }
+   }
+
+   
+   function onBeforeShow(m){
+       var pm = m.parentMenu;
+       if(!pm && !m.allowOtherMenus){
+           hideAll();
+       }else if(pm && pm.activeChild){
+           pm.activeChild.hide();
+       }
+   }
+
+   
+   function onMouseDown(e){
+       if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){
+           hideAll();
+       }
+   }
+
+   return {
+
+       
+       hideAll : function(){
+            return hideAll();
+       },
+
+       
+       register : function(menu){
+           if(!menus){
+               init();
+           }
+           menus[menu.id] = menu;
+           menu.on({
+               beforehide: onBeforeHide,
+               hide: onHide,
+               beforeshow: onBeforeShow,
+               show: onShow
+           });
+       },
+
+        
+       get : function(menu){
+           if(typeof menu == "string"){ 
+               if(!menus){  
+                   return null;
+               }
+               return menus[menu];
+           }else if(menu.events){  
+               return menu;
+           }else if(typeof menu.length == 'number'){ 
+               return new Ext.menu.Menu({items:menu});
+           }else{ 
+               return Ext.create(menu, 'menu');
+           }
+       },
+
+       
+       unregister : function(menu){
+           delete menus[menu.id];
+           menu.un("beforehide", onBeforeHide);
+           menu.un("hide", onHide);
+           menu.un("beforeshow", onBeforeShow);
+           menu.un("show", onShow);
+       },
+
+       
+       registerCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               if(!groups[g]){
+                   groups[g] = [];
+               }
+               groups[g].push(menuItem);
+           }
+       },
+
+       
+       unregisterCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               groups[g].remove(menuItem);
+           }
+       },
+       
+       
+       onCheckChange: function(item, state){
+           if(item.group && state){
+               var group = groups[item.group],
+                   i = 0,
+                   len = group.length,
+                   current;
+                   
+               for(; i < len; i++){
+                   current = group[i];
+                   if(current != item){
+                       current.setChecked(false);
+                   }
+               }
+           }
+       },
+
+       getCheckedItem : function(groupId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].checked){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       },
+
+       setCheckedItem : function(groupId, itemId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].id == itemId){
+                       g[i].setChecked(true);
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+
+Ext.menu.BaseItem = Ext.extend(Ext.Component, {
+    
+    
+    
+    
+    canActivate : false,
+    
+    activeClass : "x-menu-item-active",
+    
+    hideOnClick : true,
+    
+    clickHideDelay : 1,
+
+    
+    ctype : "Ext.menu.BaseItem",
+
+    
+    actionMode : "container",
+
+    initComponent : function(){
+        Ext.menu.BaseItem.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'click',
+            
+            'activate',
+            
+            'deactivate'
+        );
+        if(this.handler){
+            this.on("click", this.handler, this.scope);
+        }
+    },
+
+    
+    onRender : function(container, position){
+        Ext.menu.BaseItem.superclass.onRender.apply(this, arguments);
+        if(this.ownerCt && this.ownerCt instanceof Ext.menu.Menu){
+            this.parentMenu = this.ownerCt;
+        }else{
+            this.container.addClass('x-menu-list-item');
+            this.mon(this.el, {
+                scope: this,
+                click: this.onClick,
+                mouseenter: this.activate,
+                mouseleave: this.deactivate
+            });
+        }
+    },
+
+    
+    setHandler : function(handler, scope){
+        if(this.handler){
+            this.un("click", this.handler, this.scope);
+        }
+        this.on("click", this.handler = handler, this.scope = scope);
+    },
+
+    
+    onClick : function(e){
+        if(!this.disabled && this.fireEvent("click", this, e) !== false
+                && (this.parentMenu && this.parentMenu.fireEvent("itemclick", this, e) !== false)){
+            this.handleClick(e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    
+    activate : function(){
+        if(this.disabled){
+            return false;
+        }
+        var li = this.container;
+        li.addClass(this.activeClass);
+        this.region = li.getRegion().adjust(2, 2, -2, -2);
+        this.fireEvent("activate", this);
+        return true;
+    },
+
+    
+    deactivate : function(){
+        this.container.removeClass(this.activeClass);
+        this.fireEvent("deactivate", this);
+    },
+
+    
+    shouldDeactivate : function(e){
+        return !this.region || !this.region.contains(e.getPoint());
+    },
+
+    
+    handleClick : function(e){
+        var pm = this.parentMenu;
+        if(this.hideOnClick){
+            if(pm.floating){
+                this.clickHideDelayTimer = pm.hide.defer(this.clickHideDelay, pm, [true]);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+    
+    beforeDestroy: function(){
+        clearTimeout(this.clickHideDelayTimer);
+        Ext.menu.BaseItem.superclass.beforeDestroy.call(this);    
+    },
+
+    
+    expandMenu : Ext.emptyFn,
+
+    
+    hideMenu : Ext.emptyFn
+});
+Ext.reg('menubaseitem', Ext.menu.BaseItem);
+Ext.menu.TextItem = Ext.extend(Ext.menu.BaseItem, {
+    
+    
+    hideOnClick : false,
+    
+    itemCls : "x-menu-text",
+    
+    constructor : function(config) {
+        if (typeof config == 'string') {
+            config = {
+                text: config
+            };
+        }
+        Ext.menu.TextItem.superclass.constructor.call(this, config);
+    },
+
+    
+    onRender : function() {
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = this.text;
+        this.el = s;
+        Ext.menu.TextItem.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menutextitem', Ext.menu.TextItem);
+Ext.menu.Separator = Ext.extend(Ext.menu.BaseItem, {
+    
+    itemCls : "x-menu-sep",
+    
+    hideOnClick : false,
+    
+    
+    activeClass: '',
+
+    
+    onRender : function(li){
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = "&#160;";
+        this.el = s;
+        li.addClass("x-menu-sep-li");
+        Ext.menu.Separator.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menuseparator', Ext.menu.Separator);
+Ext.menu.Item = Ext.extend(Ext.menu.BaseItem, {
+    
+    
+    
+    
+    
+    
+    
+    
+    itemCls : 'x-menu-item',
+    
+    canActivate : true,
+    
+    showDelay: 200,
+    
+    
+    altText: '',
+    
+    
+    hideDelay: 200,
+
+    
+    ctype: 'Ext.menu.Item',
+
+    initComponent : function(){
+        Ext.menu.Item.superclass.initComponent.call(this);
+        if(this.menu){
+            
+            
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            
+            
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+    },
+
+    
+    onRender : function(container, position){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.menu.Item.prototype.itemTpl = new Ext.XTemplate(
+                '<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"',
+                    '<tpl if="hrefTarget">',
+                        ' target="{hrefTarget}"',
+                    '</tpl>',
+                 '>',
+                     '<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>',
+                     '<span class="x-menu-item-text">{text}</span>',
+                 '</a>'
+             );
+        }
+        var a = this.getTemplateArgs();
+        this.el = position ? this.itemTpl.insertBefore(position, a, true) : this.itemTpl.append(container, a, true);
+        this.iconEl = this.el.child('img.x-menu-item-icon');
+        this.textEl = this.el.child('.x-menu-item-text');
+        if(!this.href) { 
+            this.mon(this.el, 'click', Ext.emptyFn, null, { preventDefault: true });
+        }
+        Ext.menu.Item.superclass.onRender.call(this, container, position);
+    },
+
+    getTemplateArgs: function() {
+        return {
+            id: this.id,
+            cls: this.itemCls + (this.menu ?  ' x-menu-item-arrow' : '') + (this.cls ?  ' ' + this.cls : ''),
+            href: this.href || '#',
+            hrefTarget: this.hrefTarget,
+            icon: this.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: this.iconCls || '',
+            text: this.itemText||this.text||'&#160;',
+            altText: this.altText || ''
+        };
+    },
+
+    
+    setText : function(text){
+        this.text = text||'&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+            this.parentMenu.layout.doAutoSize();
+        }
+    },
+
+    
+    setIconClass : function(cls){
+        var oldCls = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered){
+            this.iconEl.replaceClass(oldCls, this.iconCls);
+        }
+    },
+
+    
+    beforeDestroy: function(){
+        clearTimeout(this.showTimer);
+        clearTimeout(this.hideTimer);
+        if (this.menu){
+            delete this.menu.ownerCt;
+            this.menu.destroy();
+        }
+        Ext.menu.Item.superclass.beforeDestroy.call(this);
+    },
+
+    
+    handleClick : function(e){
+        if(!this.href){ 
+            e.stopEvent();
+        }
+        Ext.menu.Item.superclass.handleClick.apply(this, arguments);
+    },
+
+    
+    activate : function(autoExpand){
+        if(Ext.menu.Item.superclass.activate.apply(this, arguments)){
+            this.focus();
+            if(autoExpand){
+                this.expandMenu();
+            }
+        }
+        return true;
+    },
+
+    
+    shouldDeactivate : function(e){
+        if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){
+            if(this.menu && this.menu.isVisible()){
+                return !this.menu.getEl().getRegion().contains(e.getPoint());
+            }
+            return true;
+        }
+        return false;
+    },
+
+    
+    deactivate : function(){
+        Ext.menu.Item.superclass.deactivate.apply(this, arguments);
+        this.hideMenu();
+    },
+
+    
+    expandMenu : function(autoActivate){
+        if(!this.disabled && this.menu){
+            clearTimeout(this.hideTimer);
+            delete this.hideTimer;
+            if(!this.menu.isVisible() && !this.showTimer){
+                this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]);
+            }else if (this.menu.isVisible() && autoActivate){
+                this.menu.tryActivate(0, 1);
+            }
+        }
+    },
+
+    
+    deferExpand : function(autoActivate){
+        delete this.showTimer;
+        this.menu.show(this.container, this.parentMenu.subMenuAlign || 'tl-tr?', this.parentMenu);
+        if(autoActivate){
+            this.menu.tryActivate(0, 1);
+        }
+    },
+
+    
+    hideMenu : function(){
+        clearTimeout(this.showTimer);
+        delete this.showTimer;
+        if(!this.hideTimer && this.menu && this.menu.isVisible()){
+            this.hideTimer = this.deferHide.defer(this.hideDelay, this);
+        }
+    },
+
+    
+    deferHide : function(){
+        delete this.hideTimer;
+        if(this.menu.over){
+            this.parentMenu.setActiveItem(this, false);
+        }else{
+            this.menu.hide();
+        }
+    }
+});
+Ext.reg('menuitem', Ext.menu.Item);
+Ext.menu.CheckItem = Ext.extend(Ext.menu.Item, {
+    
+    
+    itemCls : "x-menu-item x-menu-check-item",
+    
+    groupClass : "x-menu-group-item",
+
+    
+    checked: false,
+
+    
+    ctype: "Ext.menu.CheckItem",
+    
+    initComponent : function(){
+        Ext.menu.CheckItem.superclass.initComponent.call(this);
+	    this.addEvents(
+	        
+	        "beforecheckchange" ,
+	        
+	        "checkchange"
+	    );
+	    
+	    if(this.checkHandler){
+	        this.on('checkchange', this.checkHandler, this.scope);
+	    }
+	    Ext.menu.MenuMgr.registerCheckable(this);
+    },
+
+    
+    onRender : function(c){
+        Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);
+        if(this.group){
+            this.el.addClass(this.groupClass);
+        }
+        if(this.checked){
+            this.checked = false;
+            this.setChecked(true, true);
+        }
+    },
+
+    
+    destroy : function(){
+        Ext.menu.MenuMgr.unregisterCheckable(this);
+        Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);
+    },
+
+    
+    setChecked : function(state, suppressEvent){
+        var suppress = suppressEvent === true;
+        if(this.checked != state && (suppress || this.fireEvent("beforecheckchange", this, state) !== false)){
+            Ext.menu.MenuMgr.onCheckChange(this, state);
+            if(this.container){
+                this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");
+            }
+            this.checked = state;
+            if(!suppress){
+                this.fireEvent("checkchange", this, state);
+            }
+        }
+    },
+
+    
+    handleClick : function(e){
+       if(!this.disabled && !(this.checked && this.group)){
+           this.setChecked(!this.checked);
+       }
+       Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);
+    }
+});
+Ext.reg('menucheckitem', Ext.menu.CheckItem);
+ Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, {
+    
+    enableScrolling : false,
+    
+        
+    
+    hideOnClick : true,
+    
+    
+    pickerId : null,
+    
+    
+    
+    
+    cls : 'x-date-menu',
+    
+    
+    
+    
+
+    initComponent : function(){
+        this.on('beforeshow', this.onBeforeShow, this);
+        if(this.strict = (Ext.isIE7 && Ext.isStrict)){
+            this.on('show', this.onShow, this, {single: true, delay: 20});
+        }
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.picker = new Ext.DatePicker(Ext.applyIf({
+                internalRender: this.strict || !Ext.isIE,
+                ctCls: 'x-menu-date-item',
+                id: this.pickerId
+            }, this.initialConfig))
+        });
+        this.picker.purgeListeners();
+        Ext.menu.DateMenu.superclass.initComponent.call(this);
+        
+        this.relayEvents(this.picker, ['select']);
+        this.on('show', this.picker.focus, this.picker);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function() {
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    },
+
+    onBeforeShow : function(){
+        if(this.picker){
+            this.picker.hideMonthPicker(true);
+        }
+    },
+
+    onShow : function(){
+        var el = this.picker.getEl();
+        el.setWidth(el.getWidth()); 
+    }
+ });
+ Ext.reg('datemenu', Ext.menu.DateMenu);
+ 
+ Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, {
+    
+    enableScrolling : false,
+    
+        
+    
+    
+    hideOnClick : true,
+    
+    cls : 'x-color-menu',
+    
+    
+    paletteId : null,
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    initComponent : function(){
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.palette = new Ext.ColorPalette(Ext.applyIf({
+                id: this.paletteId
+            }, this.initialConfig))
+        });
+        this.palette.purgeListeners();
+        Ext.menu.ColorMenu.superclass.initComponent.call(this);
+        
+        this.relayEvents(this.palette, ['select']);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function(){
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    }
+});
+Ext.reg('colormenu', Ext.menu.ColorMenu);
+
+Ext.form.Field = Ext.extend(Ext.BoxComponent,  {
+    
+    
+    
+    
+    
+    
+
+    
+    invalidClass : 'x-form-invalid',
+    
+    invalidText : 'The value in this field is invalid',
+    
+    focusClass : 'x-form-focus',
+    
+    
+    validationEvent : 'keyup',
+    
+    validateOnBlur : true,
+    
+    validationDelay : 250,
+    
+    defaultAutoCreate : {tag: 'input', type: 'text', size: '20', autocomplete: 'off'},
+    
+    fieldClass : 'x-form-field',
+    
+    msgTarget : 'qtip',
+    
+    msgFx : 'normal',
+    
+    readOnly : false,
+    
+    disabled : false,
+    
+    submitValue: true,
+
+    
+    isFormField : true,
+
+    
+    msgDisplay: '',
+
+    
+    hasFocus : false,
+
+    
+    initComponent : function(){
+        Ext.form.Field.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'focus',
+            
+            'blur',
+            
+            'specialkey',
+            
+            'change',
+            
+            'invalid',
+            
+            'valid'
+        );
+    },
+
+    
+    getName : function(){
+        return this.rendered && this.el.dom.name ? this.el.dom.name : this.name || this.id || '';
+    },
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            var cfg = this.getAutoCreate();
+
+            if(!cfg.name){
+                cfg.name = this.name || this.id;
+            }
+            if(this.inputType){
+                cfg.type = this.inputType;
+            }
+            this.autoEl = cfg;
+        }
+        Ext.form.Field.superclass.onRender.call(this, ct, position);
+        if(this.submitValue === false){
+            this.el.dom.removeAttribute('name');
+        }
+        var type = this.el.dom.type;
+        if(type){
+            if(type == 'password'){
+                type = 'text';
+            }
+            this.el.addClass('x-form-'+type);
+        }
+        if(this.readOnly){
+            this.setReadOnly(true);
+        }
+        if(this.tabIndex !== undefined){
+            this.el.dom.setAttribute('tabIndex', this.tabIndex);
+        }
+
+        this.el.addClass([this.fieldClass, this.cls]);
+    },
+
+    
+    getItemCt : function(){
+        return this.itemCt;
+    },
+
+    
+    initValue : function(){
+        if(this.value !== undefined){
+            this.setValue(this.value);
+        }else if(!Ext.isEmpty(this.el.dom.value) && this.el.dom.value != this.emptyText){
+            this.setValue(this.el.dom.value);
+        }
+        
+        this.originalValue = this.getValue();
+    },
+
+    
+    isDirty : function() {
+        if(this.disabled || !this.rendered) {
+            return false;
+        }
+        return String(this.getValue()) !== String(this.originalValue);
+    },
+
+    
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.el.dom.readOnly = readOnly;
+        }
+        this.readOnly = readOnly;
+    },
+
+    
+    afterRender : function(){
+        Ext.form.Field.superclass.afterRender.call(this);
+        this.initEvents();
+        this.initValue();
+    },
+
+    
+    fireKey : function(e){
+        if(e.isSpecialKey()){
+            this.fireEvent('specialkey', this, e);
+        }
+    },
+
+    
+    reset : function(){
+        this.setValue(this.originalValue);
+        this.clearInvalid();
+    },
+
+    
+    initEvents : function(){
+        this.mon(this.el, Ext.EventManager.getKeyEvent(), this.fireKey,  this);
+        this.mon(this.el, 'focus', this.onFocus, this);
+
+        
+        
+        this.mon(this.el, 'blur', this.onBlur, this, this.inEditor ? {buffer:10} : null);
+    },
+
+    
+    preFocus: Ext.emptyFn,
+
+    
+    onFocus : function(){
+        this.preFocus();
+        if(this.focusClass){
+            this.el.addClass(this.focusClass);
+        }
+        if(!this.hasFocus){
+            this.hasFocus = true;
+            
+            this.startValue = this.getValue();
+            this.fireEvent('focus', this);
+        }
+    },
+
+    
+    beforeBlur : Ext.emptyFn,
+
+    
+    onBlur : function(){
+        this.beforeBlur();
+        if(this.focusClass){
+            this.el.removeClass(this.focusClass);
+        }
+        this.hasFocus = false;
+        if(this.validationEvent !== false && (this.validateOnBlur || this.validationEvent == 'blur')){
+            this.validate();
+        }
+        var v = this.getValue();
+        if(String(v) !== String(this.startValue)){
+            this.fireEvent('change', this, v, this.startValue);
+        }
+        this.fireEvent('blur', this);
+        this.postBlur();
+    },
+
+    
+    postBlur : Ext.emptyFn,
+
+    
+    isValid : function(preventMark){
+        if(this.disabled){
+            return true;
+        }
+        var restore = this.preventMark;
+        this.preventMark = preventMark === true;
+        var v = this.validateValue(this.processValue(this.getRawValue()), preventMark);
+        this.preventMark = restore;
+        return v;
+    },
+
+    
+    validate : function(){
+        if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){
+            this.clearInvalid();
+            return true;
+        }
+        return false;
+    },
+
+    
+    processValue : function(value){
+        return value;
+    },
+
+    
+     validateValue : function(value) {
+         
+         var error = this.getErrors(value)[0];
+
+         if (error == undefined) {
+             return true;
+         } else {
+             this.markInvalid(error);
+             return false;
+         }
+     },
+    
+    
+    getErrors: function() {
+        return [];
+    },
+
+    
+    getActiveError : function(){
+        return this.activeError || '';
+    },
+
+    
+    markInvalid : function(msg){
+        
+        if (this.rendered && !this.preventMark) {
+            msg = msg || this.invalidText;
+
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.mark(this, msg);
+            }else if(this.msgTarget){
+                this.el.addClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = msg;
+                    t.style.display = this.msgDisplay;
+                }
+            }
+        }
+        
+        this.setActiveError(msg);
+    },
+    
+    
+    clearInvalid : function(){
+        
+        if (this.rendered && !this.preventMark) {
+            this.el.removeClass(this.invalidClass);
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.clear(this);
+            }else if(this.msgTarget){
+                this.el.removeClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = '';
+                    t.style.display = 'none';
+                }
+            }
+        }
+        
+        this.unsetActiveError();
+    },
+
+    
+    setActiveError: function(msg, suppressEvent) {
+        this.activeError = msg;
+        if (suppressEvent !== true) this.fireEvent('invalid', this, msg);
+    },
+    
+    
+    unsetActiveError: function(suppressEvent) {
+        delete this.activeError;
+        if (suppressEvent !== true) this.fireEvent('valid', this);
+    },
+
+    
+    getMessageHandler : function(){
+        return Ext.form.MessageTargets[this.msgTarget];
+    },
+
+    
+    getErrorCt : function(){
+        return this.el.findParent('.x-form-element', 5, true) || 
+            this.el.findParent('.x-form-field-wrap', 5, true);   
+    },
+
+    
+    alignErrorEl : function(){
+        this.errorEl.setWidth(this.getErrorCt().getWidth(true) - 20);
+    },
+
+    
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.el, 'tl-tr', [2, 0]);
+    },
+
+    
+    getRawValue : function(){
+        var v = this.rendered ? this.el.getValue() : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        return v;
+    },
+
+    
+    getValue : function(){
+        if(!this.rendered) {
+            return this.value;
+        }
+        var v = this.el.getValue();
+        if(v === this.emptyText || v === undefined){
+            v = '';
+        }
+        return v;
+    },
+
+    
+    setRawValue : function(v){
+        return this.rendered ? (this.el.dom.value = (Ext.isEmpty(v) ? '' : v)) : '';
+    },
+
+    
+    setValue : function(v){
+        this.value = v;
+        if(this.rendered){
+            this.el.dom.value = (Ext.isEmpty(v) ? '' : v);
+            this.validate();
+        }
+        return this;
+    },
+
+    
+    append : function(v){
+         this.setValue([this.getValue(), v].join(''));
+    }
+
+    
+    
+
+    
+});
+
+
+Ext.form.MessageTargets = {
+    'qtip' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.qtip = msg;
+            field.el.dom.qclass = 'x-form-invalid-tip';
+            if(Ext.QuickTips){ 
+                Ext.QuickTips.enable();
+            }
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            field.el.dom.qtip = '';
+        }
+    },
+    'title' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.title = msg;
+        },
+        clear: function(field){
+            field.el.dom.title = '';
+        }
+    },
+    'under' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorEl){
+                var elp = field.getErrorCt();
+                if(!elp){ 
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorEl = elp.createChild({cls:'x-form-invalid-msg'});
+                field.on('resize', field.alignErrorEl, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorEl);
+                }, field);
+            }
+            field.alignErrorEl();
+            field.errorEl.update(msg);
+            Ext.form.Field.msgFx[field.msgFx].show(field.errorEl, field);
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorEl){
+                Ext.form.Field.msgFx[field.msgFx].hide(field.errorEl, field);
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    },
+    'side' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorIcon){
+                var elp = field.getErrorCt();
+                
+                if(!elp){
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});
+                if (field.ownerCt) {
+                    field.ownerCt.on('afterlayout', field.alignErrorIcon, field);
+                    field.ownerCt.on('expand', field.alignErrorIcon, field);
+                }
+                field.on('resize', field.alignErrorIcon, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorIcon);
+                }, field);
+            }
+            field.alignErrorIcon();
+            field.errorIcon.dom.qtip = msg;
+            field.errorIcon.dom.qclass = 'x-form-invalid-tip';
+            field.errorIcon.show();
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorIcon){
+                field.errorIcon.dom.qtip = '';
+                field.errorIcon.hide();
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    }
+};
+
+
+Ext.form.Field.msgFx = {
+    normal : {
+        show: function(msgEl, f){
+            msgEl.setDisplayed('block');
+        },
+
+        hide : function(msgEl, f){
+            msgEl.setDisplayed(false).update('');
+        }
+    },
+
+    slide : {
+        show: function(msgEl, f){
+            msgEl.slideIn('t', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('t', {stopFx:true,useDisplay:true});
+        }
+    },
+
+    slideRight : {
+        show: function(msgEl, f){
+            msgEl.fixDisplay();
+            msgEl.alignTo(f.el, 'tl-tr');
+            msgEl.slideIn('l', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('l', {stopFx:true,useDisplay:true});
+        }
+    }
+};
+Ext.reg('field', Ext.form.Field);
+
+Ext.form.TextField = Ext.extend(Ext.form.Field,  {
+    
+    
+    
+    grow : false,
+    
+    growMin : 30,
+    
+    growMax : 800,
+    
+    vtype : null,
+    
+    maskRe : null,
+    
+    disableKeyFilter : false,
+    
+    allowBlank : true,
+    
+    minLength : 0,
+    
+    maxLength : Number.MAX_VALUE,
+    
+    minLengthText : 'The minimum length for this field is {0}',
+    
+    maxLengthText : 'The maximum length for this field is {0}',
+    
+    selectOnFocus : false,
+    
+    blankText : 'This field is required',
+    
+    validator : null,
+    
+    regex : null,
+    
+    regexText : '',
+    
+    emptyText : null,
+    
+    emptyClass : 'x-form-empty-field',
+
+    
+
+    initComponent : function(){
+        Ext.form.TextField.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'autosize',
+
+            
+            'keydown',
+            
+            'keyup',
+            
+            'keypress'
+        );
+    },
+
+    
+    initEvents : function(){
+        Ext.form.TextField.superclass.initEvents.call(this);
+        if(this.validationEvent == 'keyup'){
+            this.validationTask = new Ext.util.DelayedTask(this.validate, this);
+            this.mon(this.el, 'keyup', this.filterValidation, this);
+        }
+        else if(this.validationEvent !== false && this.validationEvent != 'blur'){
+        	this.mon(this.el, this.validationEvent, this.validate, this, {buffer: this.validationDelay});
+        }
+        if(this.selectOnFocus || this.emptyText){            
+            this.mon(this.el, 'mousedown', this.onMouseDown, this);
+            
+            if(this.emptyText){
+                this.applyEmptyText();
+            }
+        }
+        if(this.maskRe || (this.vtype && this.disableKeyFilter !== true && (this.maskRe = Ext.form.VTypes[this.vtype+'Mask']))){
+        	this.mon(this.el, 'keypress', this.filterKeys, this);
+        }
+        if(this.grow){
+        	this.mon(this.el, 'keyup', this.onKeyUpBuffered, this, {buffer: 50});
+			this.mon(this.el, 'click', this.autoSize, this);
+        }
+        if(this.enableKeyEvents){
+            this.mon(this.el, {
+                scope: this,
+                keyup: this.onKeyUp,
+                keydown: this.onKeyDown,
+                keypress: this.onKeyPress
+            });
+        }
+    },
+    
+    onMouseDown: function(e){
+        if(!this.hasFocus){
+            this.mon(this.el, 'mouseup', Ext.emptyFn, this, { single: true, preventDefault: true });
+        }
+    },
+
+    processValue : function(value){
+        if(this.stripCharsRe){
+            var newValue = value.replace(this.stripCharsRe, '');
+            if(newValue !== value){
+                this.setRawValue(newValue);
+                return newValue;
+            }
+        }
+        return value;
+    },
+
+    filterValidation : function(e){
+        if(!e.isNavKeyPress()){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+    
+    
+    onDisable: function(){
+        Ext.form.TextField.superclass.onDisable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = 'on';
+        }
+    },
+    
+    
+    onEnable: function(){
+        Ext.form.TextField.superclass.onEnable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = '';
+        }
+    },
+
+    
+    onKeyUpBuffered : function(e){
+        if(this.doAutoSize(e)){
+            this.autoSize();
+        }
+    },
+    
+    
+    doAutoSize : function(e){
+        return !e.isNavKeyPress();
+    },
+
+    
+    onKeyUp : function(e){
+        this.fireEvent('keyup', this, e);
+    },
+
+    
+    onKeyDown : function(e){
+        this.fireEvent('keydown', this, e);
+    },
+
+    
+    onKeyPress : function(e){
+        this.fireEvent('keypress', this, e);
+    },
+
+    
+    reset : function(){
+        Ext.form.TextField.superclass.reset.call(this);
+        this.applyEmptyText();
+    },
+
+    applyEmptyText : function(){
+        if(this.rendered && this.emptyText && this.getRawValue().length < 1 && !this.hasFocus){
+            this.setRawValue(this.emptyText);
+            this.el.addClass(this.emptyClass);
+        }
+    },
+
+    
+    preFocus : function(){
+        var el = this.el,
+            isEmpty;
+        if(this.emptyText){
+            if(el.dom.value == this.emptyText){
+                this.setRawValue('');
+                isEmpty = true;
+            }
+            el.removeClass(this.emptyClass);
+        }
+        if(this.selectOnFocus || isEmpty){
+            el.dom.select();
+        }
+    },
+
+    
+    postBlur : function(){
+        this.applyEmptyText();
+    },
+
+    
+    filterKeys : function(e){
+        if(e.ctrlKey){
+            return;
+        }
+        var k = e.getKey();
+        if(Ext.isGecko && (e.isNavKeyPress() || k == e.BACKSPACE || (k == e.DELETE && e.button == -1))){
+            return;
+        }
+        var cc = String.fromCharCode(e.getCharCode());
+        if(!Ext.isGecko && e.isSpecialKey() && !cc){
+            return;
+        }
+        if(!this.maskRe.test(cc)){
+            e.stopEvent();
+        }
+    },
+
+    setValue : function(v){
+        if(this.emptyText && this.el && !Ext.isEmpty(v)){
+            this.el.removeClass(this.emptyClass);
+        }
+        Ext.form.TextField.superclass.setValue.apply(this, arguments);
+        this.applyEmptyText();
+        this.autoSize();
+        return this;
+    },
+
+    
+    getErrors: function(value) {
+        var errors = Ext.form.TextField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());        
+        
+        if (Ext.isFunction(this.validator)) {
+            var msg = this.validator(value);
+            if (msg !== true) {
+                errors.push(msg);
+            }
+        }
+        
+        if (value.length < 1 || value === this.emptyText) {
+            if (this.allowBlank) {
+                
+                return errors;
+            } else {
+                errors.push(this.blankText);
+            }
+        }
+        
+        if (!this.allowBlank && (value.length < 1 || value === this.emptyText)) { 
+            errors.push(this.blankText);
+        }
+        
+        if (value.length < this.minLength) {
+            errors.push(String.format(this.minLengthText, this.minLength));
+        }
+        
+        if (value.length > this.maxLength) {
+            errors.push(String.format(this.maxLengthText, this.maxLength));
+        }
+        
+        if (this.vtype) {
+            var vt = Ext.form.VTypes;
+            if(!vt[this.vtype](value, this)){
+                errors.push(this.vtypeText || vt[this.vtype +'Text']);
+            }
+        }
+        
+        if (this.regex && !this.regex.test(value)) {
+            errors.push(this.regexText);
+        }
+        
+        return errors;
+    },
+
+    
+    selectText : function(start, end){
+        var v = this.getRawValue();
+        var doFocus = false;
+        if(v.length > 0){
+            start = start === undefined ? 0 : start;
+            end = end === undefined ? v.length : end;
+            var d = this.el.dom;
+            if(d.setSelectionRange){
+                d.setSelectionRange(start, end);
+            }else if(d.createTextRange){
+                var range = d.createTextRange();
+                range.moveStart('character', start);
+                range.moveEnd('character', end-v.length);
+                range.select();
+            }
+            doFocus = Ext.isGecko || Ext.isOpera;
+        }else{
+            doFocus = true;
+        }
+        if(doFocus){
+            this.focus();
+        }
+    },
+
+    
+    autoSize : function(){
+        if(!this.grow || !this.rendered){
+            return;
+        }
+        if(!this.metrics){
+            this.metrics = Ext.util.TextMetrics.createInstance(this.el);
+        }
+        var el = this.el;
+        var v = el.dom.value;
+        var d = document.createElement('div');
+        d.appendChild(document.createTextNode(v));
+        v = d.innerHTML;
+        Ext.removeNode(d);
+        d = null;
+        v += '&#160;';
+        var w = Math.min(this.growMax, Math.max(this.metrics.getWidth(v) +  10, this.growMin));
+        this.el.setWidth(w);
+        this.fireEvent('autosize', this, w);
+    },
+	
+	onDestroy: function(){
+		if(this.validationTask){
+			this.validationTask.cancel();
+			this.validationTask = null;
+		}
+		Ext.form.TextField.superclass.onDestroy.call(this);
+	}
+});
+Ext.reg('textfield', Ext.form.TextField);
+
+Ext.form.TriggerField = Ext.extend(Ext.form.TextField,  {
+    
+    
+    
+    defaultAutoCreate : {tag: "input", type: "text", size: "16", autocomplete: "off"},
+    
+    hideTrigger:false,
+    
+    editable: true,
+    
+    readOnly: false,
+    
+    wrapFocusClass: 'x-trigger-wrap-focus',
+    
+    autoSize: Ext.emptyFn,
+    
+    monitorTab : true,
+    
+    deferHeight : true,
+    
+    mimicing : false,
+
+    actionMode: 'wrap',
+
+    defaultTriggerWidth: 17,
+
+    
+    onResize : function(w, h){
+        Ext.form.TriggerField.superclass.onResize.call(this, w, h);
+        var tw = this.getTriggerWidth();
+        if(Ext.isNumber(w)){
+            this.el.setWidth(w - tw);
+        }
+        this.wrap.setWidth(this.el.getWidth() + tw);
+    },
+
+    getTriggerWidth: function(){
+        var tw = this.trigger.getWidth();
+        if(!this.hideTrigger && !this.readOnly && tw === 0){
+            tw = this.defaultTriggerWidth;
+        }
+        return tw;
+    },
+
+    
+    alignErrorIcon : function(){
+        if(this.wrap){
+            this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
+        }
+    },
+
+    
+    onRender : function(ct, position){
+        this.doc = Ext.isIE ? Ext.getBody() : Ext.getDoc();
+        Ext.form.TriggerField.superclass.onRender.call(this, ct, position);
+
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap x-form-field-trigger-wrap'});
+        this.trigger = this.wrap.createChild(this.triggerConfig ||
+                {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.triggerClass});
+        this.initTrigger();
+        if(!this.width){
+            this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    getWidth: function() {
+        return(this.el.getWidth() + this.trigger.getWidth());
+    },
+
+    updateEditState: function(){
+        if(this.rendered){
+            if (this.readOnly) {
+                this.el.dom.readOnly = true;
+                this.el.addClass('x-trigger-noedit');
+                this.mun(this.el, 'click', this.onTriggerClick, this);
+                this.trigger.setDisplayed(false);
+            } else {
+                if (!this.editable) {
+                    this.el.dom.readOnly = true;
+                    this.el.addClass('x-trigger-noedit');
+                    this.mon(this.el, 'click', this.onTriggerClick, this);
+                } else {
+                    this.el.dom.readOnly = false;
+                    this.el.removeClass('x-trigger-noedit');
+                    this.mun(this.el, 'click', this.onTriggerClick, this);
+                }
+                this.trigger.setDisplayed(!this.hideTrigger);
+            }
+            this.onResize(this.width || this.wrap.getWidth());
+        }
+    },
+
+    
+    setHideTrigger: function(hideTrigger){
+        if(hideTrigger != this.hideTrigger){
+            this.hideTrigger = hideTrigger;
+            this.updateEditState();
+        }
+    },
+
+    
+    setEditable: function(editable){
+        if(editable != this.editable){
+            this.editable = editable;
+            this.updateEditState();
+        }
+    },
+
+    
+    setReadOnly: function(readOnly){
+        if(readOnly != this.readOnly){
+            this.readOnly = readOnly;
+            this.updateEditState();
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.TriggerField.superclass.afterRender.call(this);
+        this.updateEditState();
+    },
+
+    
+    initTrigger : function(){
+        this.mon(this.trigger, 'click', this.onTriggerClick, this, {preventDefault:true});
+        this.trigger.addClassOnOver('x-form-trigger-over');
+        this.trigger.addClassOnClick('x-form-trigger-click');
+    },
+
+    
+    onDestroy : function(){
+        Ext.destroy(this.trigger, this.wrap);
+        if (this.mimicing){
+            this.doc.un('mousedown', this.mimicBlur, this);
+        }
+        delete this.doc;
+        Ext.form.TriggerField.superclass.onDestroy.call(this);
+    },
+
+    
+    onFocus : function(){
+        Ext.form.TriggerField.superclass.onFocus.call(this);
+        if(!this.mimicing){
+            this.wrap.addClass(this.wrapFocusClass);
+            this.mimicing = true;
+            this.doc.on('mousedown', this.mimicBlur, this, {delay: 10});
+            if(this.monitorTab){
+                this.on('specialkey', this.checkTab, this);
+            }
+        }
+    },
+
+    
+    checkTab : function(me, e){
+        if(e.getKey() == e.TAB){
+            this.triggerBlur();
+        }
+    },
+
+    
+    onBlur : Ext.emptyFn,
+
+    
+    mimicBlur : function(e){
+        if(!this.isDestroyed && !this.wrap.contains(e.target) && this.validateBlur(e)){
+            this.triggerBlur();
+        }
+    },
+
+    
+    triggerBlur : function(){
+        this.mimicing = false;
+        this.doc.un('mousedown', this.mimicBlur, this);
+        if(this.monitorTab && this.el){
+            this.un('specialkey', this.checkTab, this);
+        }
+        Ext.form.TriggerField.superclass.onBlur.call(this);
+        if(this.wrap){
+            this.wrap.removeClass(this.wrapFocusClass);
+        }
+    },
+
+    beforeBlur : Ext.emptyFn,
+
+    
+    
+    validateBlur : function(e){
+        return true;
+    },
+
+    
+    onTriggerClick : Ext.emptyFn
+
+    
+    
+    
+});
+
+
+Ext.form.TwinTriggerField = Ext.extend(Ext.form.TriggerField, {
+    
+    
+    
+
+    initComponent : function(){
+        Ext.form.TwinTriggerField.superclass.initComponent.call(this);
+
+        this.triggerConfig = {
+            tag:'span', cls:'x-form-twin-triggers', cn:[
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger1Class},
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger2Class}
+        ]};
+    },
+
+    getTrigger : function(index){
+        return this.triggers[index];
+    },
+    
+    afterRender: function(){
+        Ext.form.TwinTriggerField.superclass.afterRender.call(this);
+        var triggers = this.triggers,
+            i = 0,
+            len = triggers.length;
+            
+        for(; i < len; ++i){
+            if(this['hideTrigger' + (i + 1)]){
+                    triggers[i].hide();
+                }
+
+        }    
+    },
+
+    initTrigger : function(){
+        var ts = this.trigger.select('.x-form-trigger', true),
+            triggerField = this;
+            
+        ts.each(function(t, all, index){
+            var triggerIndex = 'Trigger'+(index+1);
+            t.hide = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = 'none';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = true;
+            };
+            t.show = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = '';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = false;
+            };
+            this.mon(t, 'click', this['on'+triggerIndex+'Click'], this, {preventDefault:true});
+            t.addClassOnOver('x-form-trigger-over');
+            t.addClassOnClick('x-form-trigger-click');
+        }, this);
+        this.triggers = ts.elements;
+    },
+
+    getTriggerWidth: function(){
+        var tw = 0;
+        Ext.each(this.triggers, function(t, index){
+            var triggerIndex = 'Trigger' + (index + 1),
+                w = t.getWidth();
+            if(w === 0 && !this['hidden' + triggerIndex]){
+                tw += this.defaultTriggerWidth;
+            }else{
+                tw += w;
+            }
+        }, this);
+        return tw;
+    },
+
+    
+    onDestroy : function() {
+        Ext.destroy(this.triggers);
+        Ext.form.TwinTriggerField.superclass.onDestroy.call(this);
+    },
+
+    
+    onTrigger1Click : Ext.emptyFn,
+    
+    onTrigger2Click : Ext.emptyFn
+});
+Ext.reg('trigger', Ext.form.TriggerField);
+
+Ext.form.TextArea = Ext.extend(Ext.form.TextField,  {
+    
+    growMin : 60,
+    
+    growMax: 1000,
+    growAppend : '&#160;\n&#160;',
+
+    enterIsSpecial : false,
+
+    
+    preventScrollbars: false,
+    
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            this.defaultAutoCreate = {
+                tag: "textarea",
+                style:"width:100px;height:60px;",
+                autocomplete: "off"
+            };
+        }
+        Ext.form.TextArea.superclass.onRender.call(this, ct, position);
+        if(this.grow){
+            this.textSizeEl = Ext.DomHelper.append(document.body, {
+                tag: "pre", cls: "x-form-grow-sizer"
+            });
+            if(this.preventScrollbars){
+                this.el.setStyle("overflow", "hidden");
+            }
+            this.el.setHeight(this.growMin);
+        }
+    },
+
+    onDestroy : function(){
+        Ext.removeNode(this.textSizeEl);
+        Ext.form.TextArea.superclass.onDestroy.call(this);
+    },
+
+    fireKey : function(e){
+        if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
+            this.fireEvent("specialkey", this, e);
+        }
+    },
+    
+    
+    doAutoSize : function(e){
+        return !e.isNavKeyPress() || e.getKey() == e.ENTER;
+    },
+    
+    
+    filterValidation: function(e) {            
+        if(!e.isNavKeyPress() || (!this.enterIsSpecial && e.keyCode == e.ENTER)){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+
+    
+    autoSize: function(){
+        if(!this.grow || !this.textSizeEl){
+            return;
+        }
+        var el = this.el,
+            v = Ext.util.Format.htmlEncode(el.dom.value),
+            ts = this.textSizeEl,
+            h;
+            
+        Ext.fly(ts).setWidth(this.el.getWidth());
+        if(v.length < 1){
+            v = "&#160;&#160;";
+        }else{
+            v += this.growAppend;
+            if(Ext.isIE){
+                v = v.replace(/\n/g, '&#160;<br />');
+            }
+        }
+        ts.innerHTML = v;
+        h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin));
+        if(h != this.lastHeight){
+            this.lastHeight = h;
+            this.el.setHeight(h);
+            this.fireEvent("autosize", this, h);
+        }
+    }
+});
+Ext.reg('textarea', Ext.form.TextArea);
+Ext.form.NumberField = Ext.extend(Ext.form.TextField,  {
+    
+    
+    
+    fieldClass: "x-form-field x-form-num-field",
+    
+    
+    allowDecimals : true,
+    
+    
+    decimalSeparator : ".",
+    
+    
+    decimalPrecision : 2,
+    
+    
+    allowNegative : true,
+    
+    
+    minValue : Number.NEGATIVE_INFINITY,
+    
+    
+    maxValue : Number.MAX_VALUE,
+    
+    
+    minText : "The minimum value for this field is {0}",
+    
+    
+    maxText : "The maximum value for this field is {0}",
+    
+    
+    nanText : "{0} is not a valid number",
+    
+    
+    baseChars : "0123456789",
+    
+    
+    autoStripChars: false,
+
+    
+    initEvents : function() {
+        var allowed = this.baseChars + '';
+        if (this.allowDecimals) {
+            allowed += this.decimalSeparator;
+        }
+        if (this.allowNegative) {
+            allowed += '-';
+        }
+        allowed = Ext.escapeRe(allowed);
+        this.maskRe = new RegExp('[' + allowed + ']');
+        if (this.autoStripChars) {
+            this.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
+        }
+        
+        Ext.form.NumberField.superclass.initEvents.call(this);
+    },
+    
+    
+    getErrors: function(value) {
+        var errors = Ext.form.NumberField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());
+        
+        if (value.length < 1) { 
+             return errors;
+        }
+        
+        value = String(value).replace(this.decimalSeparator, ".");
+        
+        if(isNaN(value)){
+            errors.push(String.format(this.nanText, value));
+        }
+        
+        var num = this.parseValue(value);
+        
+        if (num < this.minValue) {
+            errors.push(String.format(this.minText, this.minValue));
+        }
+        
+        if (num > this.maxValue) {
+            errors.push(String.format(this.maxText, this.maxValue));
+        }
+        
+        return errors;
+    },
+
+    getValue : function() {
+        return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));
+    },
+
+    setValue : function(v) {
+    	v = Ext.isNumber(v) ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
+        v = this.fixPrecision(v);
+        v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
+        return Ext.form.NumberField.superclass.setValue.call(this, v);
+    },
+    
+    
+    setMinValue : function(value) {
+        this.minValue = Ext.num(value, Number.NEGATIVE_INFINITY);
+    },
+    
+    
+    setMaxValue : function(value) {
+        this.maxValue = Ext.num(value, Number.MAX_VALUE);    
+    },
+
+    
+    parseValue : function(value) {
+        value = parseFloat(String(value).replace(this.decimalSeparator, "."));
+        return isNaN(value) ? '' : value;
+    },
+
+    
+    fixPrecision : function(value) {
+        var nan = isNaN(value);
+        
+        if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
+            return nan ? '' : value;
+        }
+        
+        return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
+    },
+
+    beforeBlur : function() {
+        var v = this.parseValue(this.getRawValue());
+        
+        if (!Ext.isEmpty(v)) {
+            this.setValue(v);
+        }
+    }
+});
+
+Ext.reg('numberfield', Ext.form.NumberField);
+
+Ext.form.DateField = Ext.extend(Ext.form.TriggerField,  {
+    
+    format : "m/d/Y",
+    
+    altFormats : "m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",
+    
+    disabledDaysText : "Disabled",
+    
+    disabledDatesText : "Disabled",
+    
+    minText : "The date in this field must be equal to or after {0}",
+    
+    maxText : "The date in this field must be equal to or before {0}",
+    
+    invalidText : "{0} is not a valid date - it must be in the format {1}",
+    
+    triggerClass : 'x-form-date-trigger',
+    
+    showToday : true,
+    
+    
+    startDay : 0,
+    
+    
+    
+    
+    
+    
+
+    
+    defaultAutoCreate : {tag: "input", type: "text", size: "10", autocomplete: "off"},
+
+    
+    
+    initTime: '12', 
+
+    initTimeFormat: 'H',
+
+    
+    safeParse : function(value, format) {
+        if (Date.formatContainsHourInfo(format)) {
+            
+            return Date.parseDate(value, format);
+        } else {
+            
+            var parsedDate = Date.parseDate(value + ' ' + this.initTime, format + ' ' + this.initTimeFormat);
+ 
+            if (parsedDate) {
+                return parsedDate.clearTime();
+            }
+        }
+    },
+
+    initComponent : function(){
+        Ext.form.DateField.superclass.initComponent.call(this);
+
+        this.addEvents(
+            
+            'select'
+        );
+
+        if(Ext.isString(this.minValue)){
+            this.minValue = this.parseDate(this.minValue);
+        }
+        if(Ext.isString(this.maxValue)){
+            this.maxValue = this.parseDate(this.maxValue);
+        }
+        this.disabledDatesRE = null;
+        this.initDisabledDays();
+    },
+
+    initEvents: function() {
+        Ext.form.DateField.superclass.initEvents.call(this);
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "down": function(e) {
+                this.onTriggerClick();
+            },
+            scope: this,
+            forceKeyDown: true
+        });
+    },
+
+
+    
+    initDisabledDays : function(){
+        if(this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = "(?:";
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    
+    setDisabledDates : function(dd){
+        this.disabledDates = dd;
+        this.initDisabledDays();
+        if(this.menu){
+            this.menu.picker.setDisabledDates(this.disabledDatesRE);
+        }
+    },
+
+    
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        if(this.menu){
+            this.menu.picker.setDisabledDays(dd);
+        }
+    },
+
+    
+    setMinValue : function(dt){
+        this.minValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMinDate(this.minValue);
+        }
+    },
+
+    
+    setMaxValue : function(dt){
+        this.maxValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMaxDate(this.maxValue);
+        }
+    },
+
+    
+    getErrors: function(value) {
+        var errors = Ext.form.DateField.superclass.getErrors.apply(this, arguments);
+
+        value = this.formatDate(value || this.processValue(this.getRawValue()));
+
+        if (value.length < 1) { 
+             return errors;
+        }
+
+        var svalue = value;
+        value = this.parseDate(value);
+        if (!value) {
+            errors.push(String.format(this.invalidText, svalue, this.format));
+            return errors;
+        }
+
+        var time = value.getTime();
+        if (this.minValue && time < this.minValue.clearTime().getTime()) {
+            errors.push(String.format(this.minText, this.formatDate(this.minValue)));
+        }
+
+        if (this.maxValue && time > this.maxValue.clearTime().getTime()) {
+            errors.push(String.format(this.maxText, this.formatDate(this.maxValue)));
+        }
+
+        if (this.disabledDays) {
+            var day = value.getDay();
+
+            for(var i = 0; i < this.disabledDays.length; i++) {
+                if (day === this.disabledDays[i]) {
+                    errors.push(this.disabledDaysText);
+                    break;
+                }
+            }
+        }
+
+        var fvalue = this.formatDate(value);
+        if (this.disabledDatesRE && this.disabledDatesRE.test(fvalue)) {
+            errors.push(String.format(this.disabledDatesText, fvalue));
+        }
+
+        return errors;
+    },
+
+    
+    
+    validateBlur : function(){
+        return !this.menu || !this.menu.isVisible();
+    },
+
+    
+    getValue : function(){
+        return this.parseDate(Ext.form.DateField.superclass.getValue.call(this)) || "";
+    },
+
+    
+    setValue : function(date){
+        return Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));
+    },
+
+    
+    parseDate : function(value) {
+        if(!value || Ext.isDate(value)){
+            return value;
+        }
+
+        var v = this.safeParse(value, this.format),
+            af = this.altFormats,
+            afa = this.altFormatsArray;
+
+        if (!v && af) {
+            afa = afa || af.split("|");
+
+            for (var i = 0, len = afa.length; i < len && !v; i++) {
+                v = this.safeParse(value, afa[i]);
+            }
+        }
+        return v;
+    },
+
+    
+    onDestroy : function(){
+        Ext.destroy(this.menu, this.keyNav);
+        Ext.form.DateField.superclass.onDestroy.call(this);
+    },
+
+    
+    formatDate : function(date){
+        return Ext.isDate(date) ? date.dateFormat(this.format) : date;
+    },
+
+    
+    
+    
+    onTriggerClick : function(){
+        if(this.disabled){
+            return;
+        }
+        if(this.menu == null){
+            this.menu = new Ext.menu.DateMenu({
+                hideOnClick: false,
+                focusOnSelect: false
+            });
+        }
+        this.onFocus();
+        Ext.apply(this.menu.picker,  {
+            minDate : this.minValue,
+            maxDate : this.maxValue,
+            disabledDatesRE : this.disabledDatesRE,
+            disabledDatesText : this.disabledDatesText,
+            disabledDays : this.disabledDays,
+            disabledDaysText : this.disabledDaysText,
+            format : this.format,
+            showToday : this.showToday,
+            startDay: this.startDay,
+            minText : String.format(this.minText, this.formatDate(this.minValue)),
+            maxText : String.format(this.maxText, this.formatDate(this.maxValue))
+        });
+        this.menu.picker.setValue(this.getValue() || new Date());
+        this.menu.show(this.el, "tl-bl?");
+        this.menuEvents('on');
+    },
+
+    
+    menuEvents: function(method){
+        this.menu[method]('select', this.onSelect, this);
+        this.menu[method]('hide', this.onMenuHide, this);
+        this.menu[method]('show', this.onFocus, this);
+    },
+
+    onSelect: function(m, d){
+        this.setValue(d);
+        this.fireEvent('select', this, d);
+        this.menu.hide();
+    },
+
+    onMenuHide: function(){
+        this.focus(false, 60);
+        this.menuEvents('un');
+    },
+
+    
+    beforeBlur : function(){
+        var v = this.parseDate(this.getRawValue());
+        if(v){
+            this.setValue(v);
+        }
+    }
+
+    
+    
+    
+    
+});
+Ext.reg('datefield', Ext.form.DateField);
+
+Ext.form.DisplayField = Ext.extend(Ext.form.Field,  {
+    validationEvent : false,
+    validateOnBlur : false,
+    defaultAutoCreate : {tag: "div"},
+    
+    fieldClass : "x-form-display-field",
+    
+    htmlEncode: false,
+
+    
+    initEvents : Ext.emptyFn,
+
+    isValid : function(){
+        return true;
+    },
+
+    validate : function(){
+        return true;
+    },
+
+    getRawValue : function(){
+        var v = this.rendered ? this.el.dom.innerHTML : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlDecode(v);
+        }
+        return v;
+    },
+
+    getValue : function(){
+        return this.getRawValue();
+    },
+    
+    getName: function() {
+        return this.name;
+    },
+
+    setRawValue : function(v){
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlEncode(v);
+        }
+        return this.rendered ? (this.el.dom.innerHTML = (Ext.isEmpty(v) ? '' : v)) : (this.value = v);
+    },
+
+    setValue : function(v){
+        this.setRawValue(v);
+        return this;
+    }
+    
+    
+    
+    
+    
+    
+});
+
+Ext.reg('displayfield', Ext.form.DisplayField);
+
+Ext.form.ComboBox = Ext.extend(Ext.form.TriggerField, {
+    
+    
+    
+    
+    
+
+    
+    defaultAutoCreate : {tag: "input", type: "text", size: "24", autocomplete: "off"},
+    
+    
+    
+    
+    
+    
+    
+    listClass : '',
+    
+    selectedClass : 'x-combo-selected',
+    
+    listEmptyText: '',
+    
+    triggerClass : 'x-form-arrow-trigger',
+    
+    shadow : 'sides',
+    
+    listAlign : 'tl-bl?',
+    
+    maxHeight : 300,
+    
+    minHeight : 90,
+    
+    triggerAction : 'query',
+    
+    minChars : 4,
+    
+    autoSelect : true,
+    
+    typeAhead : false,
+    
+    queryDelay : 500,
+    
+    pageSize : 0,
+    
+    selectOnFocus : false,
+    
+    queryParam : 'query',
+    
+    loadingText : 'Loading...',
+    
+    resizable : false,
+    
+    handleHeight : 8,
+    
+    allQuery: '',
+    
+    mode: 'remote',
+    
+    minListWidth : 70,
+    
+    forceSelection : false,
+    
+    typeAheadDelay : 250,
+    
+
+    
+    lazyInit : true,
+
+    
+    clearFilterOnReset : true,
+
+    
+    submitValue: undefined,
+
+    
+
+    
+    initComponent : function(){
+        Ext.form.ComboBox.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'expand',
+            
+            'collapse',
+
+            
+            'beforeselect',
+            
+            'select',
+            
+            'beforequery'
+        );
+        if(this.transform){
+            var s = Ext.getDom(this.transform);
+            if(!this.hiddenName){
+                this.hiddenName = s.name;
+            }
+            if(!this.store){
+                this.mode = 'local';
+                var d = [], opts = s.options;
+                for(var i = 0, len = opts.length;i < len; i++){
+                    var o = opts[i],
+                        value = (o.hasAttribute ? o.hasAttribute('value') : o.getAttributeNode('value').specified) ? o.value : o.text;
+                    if(o.selected && Ext.isEmpty(this.value, true)) {
+                        this.value = value;
+                    }
+                    d.push([value, o.text]);
+                }
+                this.store = new Ext.data.ArrayStore({
+                    idIndex: 0,
+                    fields: ['value', 'text'],
+                    data : d,
+                    autoDestroy: true
+                });
+                this.valueField = 'value';
+                this.displayField = 'text';
+            }
+            s.name = Ext.id(); 
+            if(!this.lazyRender){
+                this.target = true;
+                this.el = Ext.DomHelper.insertBefore(s, this.autoCreate || this.defaultAutoCreate);
+                this.render(this.el.parentNode, s);
+            }
+            Ext.removeNode(s);
+        }
+        
+        else if(this.store){
+            this.store = Ext.StoreMgr.lookup(this.store);
+            if(this.store.autoCreated){
+                this.displayField = this.valueField = 'field1';
+                if(!this.store.expandData){
+                    this.displayField = 'field2';
+                }
+                this.mode = 'local';
+            }
+        }
+
+        this.selectedIndex = -1;
+        if(this.mode == 'local'){
+            if(!Ext.isDefined(this.initialConfig.queryDelay)){
+                this.queryDelay = 10;
+            }
+            if(!Ext.isDefined(this.initialConfig.minChars)){
+                this.minChars = 0;
+            }
+        }
+    },
+
+    
+    onRender : function(ct, position){
+        if(this.hiddenName && !Ext.isDefined(this.submitValue)){
+            this.submitValue = false;
+        }
+        Ext.form.ComboBox.superclass.onRender.call(this, ct, position);
+        if(this.hiddenName){
+            this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName,
+                    id: (this.hiddenId || Ext.id())}, 'before', true);
+
+        }
+        if(Ext.isGecko){
+            this.el.dom.setAttribute('autocomplete', 'off');
+        }
+
+        if(!this.lazyInit){
+            this.initList();
+        }else{
+            this.on('focus', this.initList, this, {single: true});
+        }
+    },
+
+    
+    initValue : function(){
+        Ext.form.ComboBox.superclass.initValue.call(this);
+        if(this.hiddenField){
+            this.hiddenField.value =
+                Ext.value(Ext.isDefined(this.hiddenValue) ? this.hiddenValue : this.value, '');
+        }
+    },
+
+    getParentZIndex : function(){
+        var zindex;
+        if (this.ownerCt){
+            this.findParentBy(function(ct){
+                zindex = parseInt(ct.getPositionEl().getStyle('z-index'), 10);
+                return !!zindex;
+            });
+        }
+        return zindex;
+    },
+    
+    getZIndex : function(listParent){
+        listParent = listParent || Ext.getDom(this.getListParent() || Ext.getBody());
+        var zindex = parseInt(Ext.fly(listParent).getStyle('z-index'), 10);
+        if(!zindex){
+            zindex = this.getParentZIndex();
+        }
+        return (zindex || 12000) + 5;
+    },
+
+    
+    initList : function(){
+        if(!this.list){
+            var cls = 'x-combo-list',
+                listParent = Ext.getDom(this.getListParent() || Ext.getBody());
+
+            this.list = new Ext.Layer({
+                parentEl: listParent,
+                shadow: this.shadow,
+                cls: [cls, this.listClass].join(' '),
+                constrain:false,
+                zindex: this.getZIndex(listParent)
+            });
+
+            var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
+            this.list.setSize(lw, 0);
+            this.list.swallowEvent('mousewheel');
+            this.assetHeight = 0;
+            if(this.syncFont !== false){
+                this.list.setStyle('font-size', this.el.getStyle('font-size'));
+            }
+            if(this.title){
+                this.header = this.list.createChild({cls:cls+'-hd', html: this.title});
+                this.assetHeight += this.header.getHeight();
+            }
+
+            this.innerList = this.list.createChild({cls:cls+'-inner'});
+            this.mon(this.innerList, 'mouseover', this.onViewOver, this);
+            this.mon(this.innerList, 'mousemove', this.onViewMove, this);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+
+            if(this.pageSize){
+                this.footer = this.list.createChild({cls:cls+'-ft'});
+                this.pageTb = new Ext.PagingToolbar({
+                    store: this.store,
+                    pageSize: this.pageSize,
+                    renderTo:this.footer
+                });
+                this.assetHeight += this.footer.getHeight();
+            }
+
+            if(!this.tpl){
+                
+                this.tpl = '<tpl for="."><div class="'+cls+'-item">{' + this.displayField + '}</div></tpl>';
+                
+            }
+
+            
+            this.view = new Ext.DataView({
+                applyTo: this.innerList,
+                tpl: this.tpl,
+                singleSelect: true,
+                selectedClass: this.selectedClass,
+                itemSelector: this.itemSelector || '.' + cls + '-item',
+                emptyText: this.listEmptyText,
+                deferEmptyText: false
+            });
+
+            this.mon(this.view, {
+                containerclick : this.onViewClick,
+                click : this.onViewClick,
+                scope :this
+            });
+
+            this.bindStore(this.store, true);
+
+            if(this.resizable){
+                this.resizer = new Ext.Resizable(this.list,  {
+                   pinned:true, handles:'se'
+                });
+                this.mon(this.resizer, 'resize', function(r, w, h){
+                    this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;
+                    this.listWidth = w;
+                    this.innerList.setWidth(w - this.list.getFrameWidth('lr'));
+                    this.restrictHeight();
+                }, this);
+
+                this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');
+            }
+        }
+    },
+
+    
+    getListParent : function() {
+        return document.body;
+    },
+
+    
+    getStore : function(){
+        return this.store;
+    },
+
+    
+    bindStore : function(store, initial){
+        if(this.store && !initial){
+            if(this.store !== store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.onBeforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.collapse, this);
+            }
+            if(!store){
+                this.store = null;
+                if(this.view){
+                    this.view.bindStore(null);
+                }
+                if(this.pageTb){
+                    this.pageTb.bindStore(null);
+                }
+            }
+        }
+        if(store){
+            if(!initial) {
+                this.lastQuery = null;
+                if(this.pageTb) {
+                    this.pageTb.bindStore(store);
+                }
+            }
+
+            this.store = Ext.StoreMgr.lookup(store);
+            this.store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                load: this.onLoad,
+                exception: this.collapse
+            });
+
+            if(this.view){
+                this.view.bindStore(store);
+            }
+        }
+    },
+
+    reset : function(){
+        if(this.clearFilterOnReset && this.mode == 'local'){
+            this.store.clearFilter();
+        }
+        Ext.form.ComboBox.superclass.reset.call(this);
+    },
+
+    
+    initEvents : function(){
+        Ext.form.ComboBox.superclass.initEvents.call(this);
+
+        
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "up" : function(e){
+                this.inKeyMode = true;
+                this.selectPrev();
+            },
+
+            "down" : function(e){
+                if(!this.isExpanded()){
+                    this.onTriggerClick();
+                }else{
+                    this.inKeyMode = true;
+                    this.selectNext();
+                }
+            },
+
+            "enter" : function(e){
+                this.onViewClick();
+            },
+
+            "esc" : function(e){
+                this.collapse();
+            },
+
+            "tab" : function(e){
+                if (this.forceSelection === true) {
+                    this.collapse();
+                } else {
+                    this.onViewClick(false);
+                }
+                return true;
+            },
+
+            scope : this,
+
+            doRelay : function(e, h, hname){
+                if(hname == 'down' || this.scope.isExpanded()){
+                    
+                    var relay = Ext.KeyNav.prototype.doRelay.apply(this, arguments);
+                    if(!Ext.isIE && Ext.EventManager.useKeydown){
+                        
+                        this.scope.fireKey(e);
+                    }
+                    return relay;
+                }
+                return true;
+            },
+
+            forceKeyDown : true,
+            defaultEventAction: 'stopEvent'
+        });
+        this.queryDelay = Math.max(this.queryDelay || 10,
+                this.mode == 'local' ? 10 : 250);
+        this.dqTask = new Ext.util.DelayedTask(this.initQuery, this);
+        if(this.typeAhead){
+            this.taTask = new Ext.util.DelayedTask(this.onTypeAhead, this);
+        }
+        if(!this.enableKeyEvents){
+            this.mon(this.el, 'keyup', this.onKeyUp, this);
+        }
+    },
+
+
+    
+    onDestroy : function(){
+        if (this.dqTask){
+            this.dqTask.cancel();
+            this.dqTask = null;
+        }
+        this.bindStore(null);
+        Ext.destroy(
+            this.resizer,
+            this.view,
+            this.pageTb,
+            this.list
+        );
+        Ext.destroyMembers(this, 'hiddenField');
+        Ext.form.ComboBox.superclass.onDestroy.call(this);
+    },
+
+    
+    fireKey : function(e){
+        if (!this.isExpanded()) {
+            Ext.form.ComboBox.superclass.fireKey.call(this, e);
+        }
+    },
+
+    
+    onResize : function(w, h){
+        Ext.form.ComboBox.superclass.onResize.apply(this, arguments);
+        if(!isNaN(w) && this.isVisible() && this.list){
+            this.doResize(w);
+        }else{
+            this.bufferSize = w;
+        }
+    },
+
+    doResize: function(w){
+        if(!Ext.isDefined(this.listWidth)){
+            var lw = Math.max(w, this.minListWidth);
+            this.list.setWidth(lw);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+        }
+    },
+
+    
+    onEnable : function(){
+        Ext.form.ComboBox.superclass.onEnable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = false;
+        }
+    },
+
+    
+    onDisable : function(){
+        Ext.form.ComboBox.superclass.onDisable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = true;
+        }
+    },
+
+    
+    onBeforeLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        this.innerList.update(this.loadingText ?
+               '<div class="loading-indicator">'+this.loadingText+'</div>' : '');
+        this.restrictHeight();
+        this.selectedIndex = -1;
+    },
+
+    
+    onLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        if(this.store.getCount() > 0 || this.listEmptyText){
+            this.expand();
+            this.restrictHeight();
+            if(this.lastQuery == this.allQuery){
+                if(this.editable){
+                    this.el.dom.select();
+                }
+
+                if(this.autoSelect !== false && !this.selectByValue(this.value, true)){
+                    this.select(0, true);
+                }
+            }else{
+                if(this.autoSelect !== false){
+                    this.selectNext();
+                }
+                if(this.typeAhead && this.lastKey != Ext.EventObject.BACKSPACE && this.lastKey != Ext.EventObject.DELETE){
+                    this.taTask.delay(this.typeAheadDelay);
+                }
+            }
+        }else{
+            this.collapse();
+        }
+
+    },
+
+    
+    onTypeAhead : function(){
+        if(this.store.getCount() > 0){
+            var r = this.store.getAt(0);
+            var newValue = r.data[this.displayField];
+            var len = newValue.length;
+            var selStart = this.getRawValue().length;
+            if(selStart != len){
+                this.setRawValue(newValue);
+                this.selectText(selStart, newValue.length);
+            }
+        }
+    },
+
+    
+    assertValue : function(){
+        var val = this.getRawValue(),
+            rec;
+
+        if(this.valueField && Ext.isDefined(this.value)){
+            rec = this.findRecord(this.valueField, this.value);
+        }
+        if(!rec || rec.get(this.displayField) != val){
+            rec = this.findRecord(this.displayField, val);
+        }
+        if(!rec && this.forceSelection){
+            if(val.length > 0 && val != this.emptyText){
+                this.el.dom.value = Ext.value(this.lastSelectionText, '');
+                this.applyEmptyText();
+            }else{
+                this.clearValue();
+            }
+        }else{
+            if(rec && this.valueField){
+                
+                
+                
+                if (this.value == val){
+                    return;
+                }
+                val = rec.get(this.valueField || this.displayField);
+            }
+            this.setValue(val);
+        }
+    },
+
+    
+    onSelect : function(record, index){
+        if(this.fireEvent('beforeselect', this, record, index) !== false){
+            this.setValue(record.data[this.valueField || this.displayField]);
+            this.collapse();
+            this.fireEvent('select', this, record, index);
+        }
+    },
+
+    
+    getName: function(){
+        var hf = this.hiddenField;
+        return hf && hf.name ? hf.name : this.hiddenName || Ext.form.ComboBox.superclass.getName.call(this);
+    },
+
+    
+    getValue : function(){
+        if(this.valueField){
+            return Ext.isDefined(this.value) ? this.value : '';
+        }else{
+            return Ext.form.ComboBox.superclass.getValue.call(this);
+        }
+    },
+
+    
+    clearValue : function(){
+        if(this.hiddenField){
+            this.hiddenField.value = '';
+        }
+        this.setRawValue('');
+        this.lastSelectionText = '';
+        this.applyEmptyText();
+        this.value = '';
+    },
+
+    
+    setValue : function(v){
+        var text = v;
+        if(this.valueField){
+            var r = this.findRecord(this.valueField, v);
+            if(r){
+                text = r.data[this.displayField];
+            }else if(Ext.isDefined(this.valueNotFoundText)){
+                text = this.valueNotFoundText;
+            }
+        }
+        this.lastSelectionText = text;
+        if(this.hiddenField){
+            this.hiddenField.value = Ext.value(v, '');
+        }
+        Ext.form.ComboBox.superclass.setValue.call(this, text);
+        this.value = v;
+        return this;
+    },
+
+    
+    findRecord : function(prop, value){
+        var record;
+        if(this.store.getCount() > 0){
+            this.store.each(function(r){
+                if(r.data[prop] == value){
+                    record = r;
+                    return false;
+                }
+            });
+        }
+        return record;
+    },
+
+    
+    onViewMove : function(e, t){
+        this.inKeyMode = false;
+    },
+
+    
+    onViewOver : function(e, t){
+        if(this.inKeyMode){ 
+            return;
+        }
+        var item = this.view.findItemFromChild(t);
+        if(item){
+            var index = this.view.indexOf(item);
+            this.select(index, false);
+        }
+    },
+
+    
+    onViewClick : function(doFocus){
+        var index = this.view.getSelectedIndexes()[0],
+            s = this.store,
+            r = s.getAt(index);
+        if(r){
+            this.onSelect(r, index);
+        }else {
+            this.collapse();
+        }
+        if(doFocus !== false){
+            this.el.focus();
+        }
+    },
+
+
+    
+    restrictHeight : function(){
+        this.innerList.dom.style.height = '';
+        var inner = this.innerList.dom,
+            pad = this.list.getFrameWidth('tb') + (this.resizable ? this.handleHeight : 0) + this.assetHeight,
+            h = Math.max(inner.clientHeight, inner.offsetHeight, inner.scrollHeight),
+            ha = this.getPosition()[1]-Ext.getBody().getScroll().top,
+            hb = Ext.lib.Dom.getViewHeight()-ha-this.getSize().height,
+            space = Math.max(ha, hb, this.minHeight || 0)-this.list.shadowOffset-pad-5;
+
+        h = Math.min(h, space, this.maxHeight);
+
+        this.innerList.setHeight(h);
+        this.list.beginUpdate();
+        this.list.setHeight(h+pad);
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+        this.list.endUpdate();
+    },
+
+    
+    isExpanded : function(){
+        return this.list && this.list.isVisible();
+    },
+
+    
+    selectByValue : function(v, scrollIntoView){
+        if(!Ext.isEmpty(v, true)){
+            var r = this.findRecord(this.valueField || this.displayField, v);
+            if(r){
+                this.select(this.store.indexOf(r), scrollIntoView);
+                return true;
+            }
+        }
+        return false;
+    },
+
+    
+    select : function(index, scrollIntoView){
+        this.selectedIndex = index;
+        this.view.select(index);
+        if(scrollIntoView !== false){
+            var el = this.view.getNode(index);
+            if(el){
+                this.innerList.scrollChildIntoView(el, false);
+            }
+        }
+
+    },
+
+    
+    selectNext : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex < ct-1){
+                this.select(this.selectedIndex+1);
+            }
+        }
+    },
+
+    
+    selectPrev : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex !== 0){
+                this.select(this.selectedIndex-1);
+            }
+        }
+    },
+
+    
+    onKeyUp : function(e){
+        var k = e.getKey();
+        if(this.editable !== false && this.readOnly !== true && (k == e.BACKSPACE || !e.isSpecialKey())){
+
+            this.lastKey = k;
+            this.dqTask.delay(this.queryDelay);
+        }
+        Ext.form.ComboBox.superclass.onKeyUp.call(this, e);
+    },
+
+    
+    validateBlur : function(){
+        return !this.list || !this.list.isVisible();
+    },
+
+    
+    initQuery : function(){
+        this.doQuery(this.getRawValue());
+    },
+
+    
+    beforeBlur : function(){
+        this.assertValue();
+    },
+
+    
+    postBlur  : function(){
+        Ext.form.ComboBox.superclass.postBlur.call(this);
+        this.collapse();
+        this.inKeyMode = false;
+    },
+
+    
+    doQuery : function(q, forceAll){
+        q = Ext.isEmpty(q) ? '' : q;
+        var qe = {
+            query: q,
+            forceAll: forceAll,
+            combo: this,
+            cancel:false
+        };
+        if(this.fireEvent('beforequery', qe)===false || qe.cancel){
+            return false;
+        }
+        q = qe.query;
+        forceAll = qe.forceAll;
+        if(forceAll === true || (q.length >= this.minChars)){
+            if(this.lastQuery !== q){
+                this.lastQuery = q;
+                if(this.mode == 'local'){
+                    this.selectedIndex = -1;
+                    if(forceAll){
+                        this.store.clearFilter();
+                    }else{
+                        this.store.filter(this.displayField, q);
+                    }
+                    this.onLoad();
+                }else{
+                    this.store.baseParams[this.queryParam] = q;
+                    this.store.load({
+                        params: this.getParams(q)
+                    });
+                    this.expand();
+                }
+            }else{
+                this.selectedIndex = -1;
+                this.onLoad();
+            }
+        }
+    },
+
+    
+    getParams : function(q){
+        var params = {},
+            paramNames = this.store.paramNames;
+        if(this.pageSize){
+            params[paramNames.start] = 0;
+            params[paramNames.limit] = this.pageSize;
+        }
+        return params;
+    },
+
+    
+    collapse : function(){
+        if(!this.isExpanded()){
+            return;
+        }
+        this.list.hide();
+        Ext.getDoc().un('mousewheel', this.collapseIf, this);
+        Ext.getDoc().un('mousedown', this.collapseIf, this);
+        this.fireEvent('collapse', this);
+    },
+
+    
+    collapseIf : function(e){
+        if(!this.isDestroyed && !e.within(this.wrap) && !e.within(this.list)){
+            this.collapse();
+        }
+    },
+
+    
+    expand : function(){
+        if(this.isExpanded() || !this.hasFocus){
+            return;
+        }
+
+        if(this.title || this.pageSize){
+            this.assetHeight = 0;
+            if(this.title){
+                this.assetHeight += this.header.getHeight();
+            }
+            if(this.pageSize){
+                this.assetHeight += this.footer.getHeight();
+            }
+        }
+
+        if(this.bufferSize){
+            this.doResize(this.bufferSize);
+            delete this.bufferSize;
+        }
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+
+        
+        this.list.setZIndex(this.getZIndex());
+        this.list.show();
+        if(Ext.isGecko2){
+            this.innerList.setOverflow('auto'); 
+        }
+        this.mon(Ext.getDoc(), {
+            scope: this,
+            mousewheel: this.collapseIf,
+            mousedown: this.collapseIf
+        });
+        this.fireEvent('expand', this);
+    },
+
+    
+    
+    
+    onTriggerClick : function(){
+        if(this.readOnly || this.disabled){
+            return;
+        }
+        if(this.isExpanded()){
+            this.collapse();
+            this.el.focus();
+        }else {
+            this.onFocus({});
+            if(this.triggerAction == 'all') {
+                this.doQuery(this.allQuery, true);
+            } else {
+                this.doQuery(this.getRawValue());
+            }
+            this.el.focus();
+        }
+    }
+
+    
+    
+    
+    
+
+});
+Ext.reg('combo', Ext.form.ComboBox);
+
+Ext.form.Checkbox = Ext.extend(Ext.form.Field,  {
+    
+    focusClass : undefined,
+    
+    fieldClass : 'x-form-field',
+    
+    checked : false,
+    
+    boxLabel: '&#160;',
+    
+    defaultAutoCreate : { tag: 'input', type: 'checkbox', autocomplete: 'off'},
+    
+    
+    
+
+    
+    actionMode : 'wrap',
+
+	
+    initComponent : function(){
+        Ext.form.Checkbox.superclass.initComponent.call(this);
+        this.addEvents(
+            
+            'check'
+        );
+    },
+
+    
+    onResize : function(){
+        Ext.form.Checkbox.superclass.onResize.apply(this, arguments);
+        if(!this.boxLabel && !this.fieldLabel){
+            this.el.alignTo(this.wrap, 'c-c');
+        }
+    },
+
+    
+    initEvents : function(){
+        Ext.form.Checkbox.superclass.initEvents.call(this);
+        this.mon(this.el, {
+            scope: this,
+            click: this.onClick,
+            change: this.onClick
+        });
+    },
+
+    
+    markInvalid : Ext.emptyFn,
+    
+    clearInvalid : Ext.emptyFn,
+
+    
+    onRender : function(ct, position){
+        Ext.form.Checkbox.superclass.onRender.call(this, ct, position);
+        if(this.inputValue !== undefined){
+            this.el.dom.value = this.inputValue;
+        }
+        this.wrap = this.el.wrap({cls: 'x-form-check-wrap'});
+        if(this.boxLabel){
+            this.wrap.createChild({tag: 'label', htmlFor: this.el.id, cls: 'x-form-cb-label', html: this.boxLabel});
+        }
+        if(this.checked){
+            this.setValue(true);
+        }else{
+            this.checked = this.el.dom.checked;
+        }
+        
+        if (Ext.isIE && !Ext.isStrict) {
+            this.wrap.repaint();
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    
+    onDestroy : function(){
+        Ext.destroy(this.wrap);
+        Ext.form.Checkbox.superclass.onDestroy.call(this);
+    },
+
+    
+    initValue : function() {
+        this.originalValue = this.getValue();
+    },
+
+    
+    getValue : function(){
+        if(this.rendered){
+            return this.el.dom.checked;
+        }
+        return this.checked;
+    },
+
+	
+    onClick : function(){
+        if(this.el.dom.checked != this.checked){
+            this.setValue(this.el.dom.checked);
+        }
+    },
+
+    
+    setValue : function(v){
+        var checked = this.checked,
+            inputVal = this.inputValue;
+            
+        if (v === false) {
+            this.checked = false;
+        } else {
+            this.checked = (v === true || v === 'true' || v == '1' || (inputVal ? v == inputVal : String(v).toLowerCase() == 'on'));
+        }
+        
+        if(this.rendered){
+            this.el.dom.checked = this.checked;
+            this.el.dom.defaultChecked = this.checked;
+        }
+        if(checked != this.checked){
+            this.fireEvent('check', this, this.checked);
+            if(this.handler){
+                this.handler.call(this.scope || this, this, this.checked);
+            }
+        }
+        return this;
+    }
+});
+Ext.reg('checkbox', Ext.form.Checkbox);
+
+Ext.form.CheckboxGroup = Ext.extend(Ext.form.Field, {
+    
+    
+    columns : 'auto',
+    
+    vertical : false,
+    
+    allowBlank : true,
+    
+    blankText : "You must select at least one item in this group",
+
+    
+    defaultType : 'checkbox',
+
+    
+    groupCls : 'x-form-check-group',
+
+    
+    initComponent: function(){
+        this.addEvents(
+            
+            'change'
+        );
+        this.on('change', this.validate, this);
+        Ext.form.CheckboxGroup.superclass.initComponent.call(this);
+    },
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            var panelCfg = {
+                autoEl: {
+                    id: this.id
+                },
+                cls: this.groupCls,
+                layout: 'column',
+                renderTo: ct,
+                bufferResize: false 
+            };
+            var colCfg = {
+                xtype: 'container',
+                defaultType: this.defaultType,
+                layout: 'form',
+                defaults: {
+                    hideLabel: true,
+                    anchor: '100%'
+                }
+            };
+
+            if(this.items[0].items){
+
+                
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: this.items.length},
+                    defaults: this.defaults,
+                    items: this.items
+                });
+                for(var i=0, len=this.items.length; i<len; i++){
+                    Ext.applyIf(this.items[i], colCfg);
+                }
+
+            }else{
+
+                
+                
+
+                var numCols, cols = [];
+
+                if(typeof this.columns == 'string'){ 
+                    this.columns = this.items.length;
+                }
+                if(!Ext.isArray(this.columns)){
+                    var cs = [];
+                    for(var i=0; i<this.columns; i++){
+                        cs.push((100/this.columns)*.01); 
+                    }
+                    this.columns = cs;
+                }
+
+                numCols = this.columns.length;
+
+                
+                for(var i=0; i<numCols; i++){
+                    var cc = Ext.apply({items:[]}, colCfg);
+                    cc[this.columns[i] <= 1 ? 'columnWidth' : 'width'] = this.columns[i];
+                    if(this.defaults){
+                        cc.defaults = Ext.apply(cc.defaults || {}, this.defaults);
+                    }
+                    cols.push(cc);
+                };
+
+                
+                if(this.vertical){
+                    var rows = Math.ceil(this.items.length / numCols), ri = 0;
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        if(i>0 && i%rows==0){
+                            ri++;
+                        }
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ri].items.push(this.items[i]);
+                    };
+                }else{
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        var ci = i % numCols;
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ci].items.push(this.items[i]);
+                    };
+                }
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: numCols},
+                    items: cols
+                });
+            }
+
+            this.panel = new Ext.Container(panelCfg);
+            this.panel.ownerCt = this;
+            this.el = this.panel.getEl();
+
+            if(this.forId && this.itemCls){
+                var l = this.el.up(this.itemCls).child('label', true);
+                if(l){
+                    l.setAttribute('htmlFor', this.forId);
+                }
+            }
+
+            var fields = this.panel.findBy(function(c){
+                return c.isFormField;
+            }, this);
+
+            this.items = new Ext.util.MixedCollection();
+            this.items.addAll(fields);
+        }
+        Ext.form.CheckboxGroup.superclass.onRender.call(this, ct, position);
+    },
+
+    initValue : function(){
+        if(this.value){
+            this.setValue.apply(this, this.buffered ? this.value : [this.value]);
+            delete this.buffered;
+            delete this.value;
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.CheckboxGroup.superclass.afterRender.call(this);
+        this.eachItem(function(item){
+            item.on('check', this.fireChecked, this);
+            item.inGroup = true;
+        });
+    },
+
+    
+    doLayout: function(){
+        
+        if(this.rendered){
+            this.panel.forceLayout = this.ownerCt.forceLayout;
+            this.panel.doLayout();
+        }
+    },
+
+    
+    fireChecked: function(){
+        var arr = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                arr.push(item);
+            }
+        });
+        this.fireEvent('change', this, arr);
+    },
+    
+    
+    getErrors: function() {
+        var errors = Ext.form.CheckboxGroup.superclass.getErrors.apply(this, arguments);
+        
+        if (!this.allowBlank) {
+            var blank = true;
+            
+            this.eachItem(function(f){
+                if (f.checked) {
+                    return (blank = false);
+                }
+            });
+            
+            if (blank) errors.push(this.blankText);
+        }
+        
+        return errors;
+    },
+
+    
+    isDirty: function(){
+        
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        
+        return dirty;
+    },
+
+    
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    },
+
+    
+    onResize : function(w, h){
+        this.panel.setSize(w, h);
+        this.panel.doLayout();
+    },
+
+    
+    reset : function(){
+        if (this.originalValue) {
+            
+            this.eachItem(function(c){
+                if(c.setValue){
+                    c.setValue(false);
+                    c.originalValue = c.getValue();
+                }
+            });
+            
+            
+            this.resetOriginal = true;
+            this.setValue(this.originalValue);
+            delete this.resetOriginal;
+        } else {
+            this.eachItem(function(c){
+                if(c.reset){
+                    c.reset();
+                }
+            });
+        }
+        
+        
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+
+    
+    setValue: function(){
+        if(this.rendered){
+            this.onSetValue.apply(this, arguments);
+        }else{
+            this.buffered = true;
+            this.value = arguments;
+        }
+        return this;
+    },
+
+    
+    onSetValue: function(id, value){
+        if(arguments.length == 1){
+            if(Ext.isArray(id)){
+                Ext.each(id, function(val, idx){
+                    if (Ext.isObject(val) && val.setValue){ 
+                        val.setValue(true);
+                        if (this.resetOriginal === true) {
+                            val.originalValue = val.getValue();
+                        }
+                    } else { 
+                        var item = this.items.itemAt(idx);
+                        if(item){
+                            item.setValue(val);
+                        }
+                    }
+                }, this);
+            }else if(Ext.isObject(id)){
+                
+                for(var i in id){
+                    var f = this.getBox(i);
+                    if(f){
+                        f.setValue(id[i]);
+                    }
+                }
+            }else{
+                this.setValueForItem(id);
+            }
+        }else{
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+            }
+        }
+    },
+
+    
+    beforeDestroy: function(){
+        Ext.destroy(this.panel);
+        if (!this.rendered) {
+            Ext.destroy(this.items);
+        }
+        Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this);
+
+    },
+
+    setValueForItem : function(val){
+        val = String(val).split(',');
+        this.eachItem(function(item){
+            if(val.indexOf(item.inputValue)> -1){
+                item.setValue(true);
+            }
+        });
+    },
+
+    
+    getBox : function(id){
+        var box = null;
+        this.eachItem(function(f){
+            if(id == f || f.dataIndex == id || f.id == id || f.getName() == id){
+                box = f;
+                return false;
+            }
+        });
+        return box;
+    },
+
+    
+    getValue : function(){
+        var out = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                out.push(item);
+            }
+        });
+        return out;
+    },
+
+    
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    
+
+    
+    getRawValue : Ext.emptyFn,
+
+    
+    setRawValue : Ext.emptyFn
+
+});
+
+Ext.reg('checkboxgroup', Ext.form.CheckboxGroup);
+
+Ext.form.CompositeField = Ext.extend(Ext.form.Field, {
+
+    
+    defaultMargins: '0 5 0 0',
+
+    
+    skipLastItemMargin: true,
+
+    
+    isComposite: true,
+
+    
+    combineErrors: true,
+    
+    
+    labelConnector: ', ',
+    
+    
+
+    
+    
+    initComponent: function() {
+        var labels = [],
+            items  = this.items,
+            item;
+
+        for (var i=0, j = items.length; i < j; i++) {
+            item = items[i];
+            
+            if (!Ext.isEmpty(item.ref)){
+                item.ref = '../' + item.ref;
+            }
+
+            labels.push(item.fieldLabel);
+
+            
+            Ext.applyIf(item, this.defaults);
+
+            
+            if (!(i == j - 1 && this.skipLastItemMargin)) {
+                Ext.applyIf(item, {margins: this.defaultMargins});
+            }
+        }
+
+        this.fieldLabel = this.fieldLabel || this.buildLabel(labels);
+
+        
+        this.fieldErrors = new Ext.util.MixedCollection(true, function(item) {
+            return item.field;
+        });
+
+        this.fieldErrors.on({
+            scope  : this,
+            add    : this.updateInvalidMark,
+            remove : this.updateInvalidMark,
+            replace: this.updateInvalidMark
+        });
+
+        Ext.form.CompositeField.superclass.initComponent.apply(this, arguments);
+        
+        this.innerCt = new Ext.Container({
+            layout  : 'hbox',
+            items   : this.items,
+            cls     : 'x-form-composite',
+            defaultMargins: '0 3 0 0',
+            ownerCt: this
+        });
+        this.innerCt.ownerCt = undefined;
+        
+        var fields = this.innerCt.findBy(function(c) {
+            return c.isFormField;
+        }, this);
+
+        
+        this.items = new Ext.util.MixedCollection();
+        this.items.addAll(fields);
+        
+    },
+
+    
+    onRender: function(ct, position) {
+        if (!this.el) {
+            
+            var innerCt = this.innerCt;
+            innerCt.render(ct);
+
+            this.el = innerCt.getEl();
+
+            
+            
+            if (this.combineErrors) {
+                this.eachItem(function(field) {
+                    Ext.apply(field, {
+                        markInvalid : this.onFieldMarkInvalid.createDelegate(this, [field], 0),
+                        clearInvalid: this.onFieldClearInvalid.createDelegate(this, [field], 0)
+                    });
+                });
+            }
+
+            
+            var l = this.el.parent().parent().child('label', true);
+            if (l) {
+                l.setAttribute('for', this.items.items[0].id);
+            }
+        }
+
+        Ext.form.CompositeField.superclass.onRender.apply(this, arguments);
+    },
+
+    
+    onFieldMarkInvalid: function(field, message) {
+        var name  = field.getName(),
+            error = {
+                field: name, 
+                errorName: field.fieldLabel || name,
+                error: message
+            };
+
+        this.fieldErrors.replace(name, error);
+
+        if (!field.preventMark) {
+            field.el.addClass(field.invalidClass);
+        }
+    },
+
+    
+    onFieldClearInvalid: function(field) {
+        this.fieldErrors.removeKey(field.getName());
+
+        field.el.removeClass(field.invalidClass);
+    },
+
+    
+    updateInvalidMark: function() {
+        var ieStrict = Ext.isIE6 && Ext.isStrict;
+
+        if (this.fieldErrors.length == 0) {
+            this.clearInvalid();
+
+            
+            if (ieStrict) {
+                this.clearInvalid.defer(50, this);
+            }
+        } else {
+            var message = this.buildCombinedErrorMessage(this.fieldErrors.items);
+
+            this.sortErrors();
+            this.markInvalid(message);
+
+            
+            if (ieStrict) {
+                this.markInvalid(message);
+            }
+        }
+    },
+
+    
+    validateValue: function(value, preventMark) {
+        var valid = true;
+
+        this.eachItem(function(field) {
+            if (!field.isValid(preventMark)) {
+                valid = false;
+            }
+        });
+
+        return valid;
+    },
+
+    
+    buildCombinedErrorMessage: function(errors) {
+        var combined = [],
+            error;
+
+        for (var i = 0, j = errors.length; i < j; i++) {
+            error = errors[i];
+
+            combined.push(String.format("{0}: {1}", error.errorName, error.error));
+        }
+
+        return combined.join("<br />");
+    },
+
+    
+    sortErrors: function() {
+        var fields = this.items;
+
+        this.fieldErrors.sort("ASC", function(a, b) {
+            var findByName = function(key) {
+                return function(field) {
+                    return field.getName() == key;
+                };
+            };
+
+            var aIndex = fields.findIndexBy(findByName(a.field)),
+                bIndex = fields.findIndexBy(findByName(b.field));
+
+            return aIndex < bIndex ? -1 : 1;
+        });
+    },
+
+    
+    reset: function() {
+        this.eachItem(function(item) {
+            item.reset();
+        });
+
+        
+        
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+    
+    
+    clearInvalidChildren: function() {
+        this.eachItem(function(item) {
+            item.clearInvalid();
+        });
+    },
+
+    
+    buildLabel: function(segments) {
+        return Ext.clean(segments).join(this.labelConnector);
+    },
+
+    
+    isDirty: function(){
+        
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        return dirty;
+    },
+
+    
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    
+    onResize: function(adjWidth, adjHeight, rawWidth, rawHeight) {
+        var innerCt = this.innerCt;
+
+        if (this.rendered && innerCt.rendered) {
+            innerCt.setSize(adjWidth, adjHeight);
+        }
+
+        Ext.form.CompositeField.superclass.onResize.apply(this, arguments);
+    },
+
+    
+    doLayout: function(shallow, force) {
+        if (this.rendered) {
+            var innerCt = this.innerCt;
+
+            innerCt.forceLayout = this.ownerCt.forceLayout;
+            innerCt.doLayout(shallow, force);
+        }
+    },
+
+    
+    beforeDestroy: function(){
+        Ext.destroy(this.innerCt);
+
+        Ext.form.CompositeField.superclass.beforeDestroy.call(this);
+    },
+
+    
+    setReadOnly : function(readOnly) {
+        if (readOnly == undefined) {
+            readOnly = true;
+        }
+        readOnly = !!readOnly;
+
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    onShow : function() {
+        Ext.form.CompositeField.superclass.onShow.call(this);
+        this.doLayout();
+    },
+
+    
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    }
+});
+
+Ext.reg('compositefield', Ext.form.CompositeField);
+Ext.form.Radio = Ext.extend(Ext.form.Checkbox, {
+    inputType: 'radio',
+
+    
+    markInvalid : Ext.emptyFn,
+    
+    clearInvalid : Ext.emptyFn,
+
+    
+    getGroupValue : function(){
+    	var p = this.el.up('form') || Ext.getBody();
+        var c = p.child('input[name="'+this.el.dom.name+'"]:checked', true);
+        return c ? c.value : null;
+    },
+
+    
+    setValue : function(v){
+    	var checkEl,
+            els,
+            radio;
+    	if (typeof v == 'boolean') {
+            Ext.form.Radio.superclass.setValue.call(this, v);
+        } else if (this.rendered) {
+            checkEl = this.getCheckEl();
+            radio = checkEl.child('input[name="' + this.el.dom.name + '"][value="' + v + '"]', true);
+            if(radio){
+                Ext.getCmp(radio.id).setValue(true);
+            }
+        }
+        if(this.rendered && this.checked){
+            checkEl = checkEl || this.getCheckEl();
+            els = this.getCheckEl().select('input[name="' + this.el.dom.name + '"]');
+			els.each(function(el){
+				if(el.dom.id != this.id){
+					Ext.getCmp(el.dom.id).setValue(false);
+				}
+			}, this);
+        }
+        return this;
+    },
+
+    
+    getCheckEl: function(){
+        if(this.inGroup){
+            return this.el.up('.x-form-radio-group');
+        }
+        return this.el.up('form') || Ext.getBody();
+    }
+});
+Ext.reg('radio', Ext.form.Radio);
+
+Ext.form.RadioGroup = Ext.extend(Ext.form.CheckboxGroup, {
+    
+    
+    allowBlank : true,
+    
+    blankText : 'You must select one item in this group',
+    
+    
+    defaultType : 'radio',
+    
+    
+    groupCls : 'x-form-radio-group',
+    
+    
+    
+    
+    getValue : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        return out;
+    },
+    
+    
+    onSetValue : function(id, value){
+        if(arguments.length > 1){
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+                if(f.checked){
+                    this.eachItem(function(item){
+                        if (item !== f){
+                            item.setValue(false);
+                        }
+                    });
+                }
+            }
+        }else{
+            this.setValueForItem(id);
+        }
+    },
+    
+    setValueForItem : function(val){
+        val = String(val).split(',')[0];
+        this.eachItem(function(item){
+            item.setValue(val == item.inputValue);
+        });
+    },
+    
+    
+    fireChecked : function(){
+        if(!this.checkTask){
+            this.checkTask = new Ext.util.DelayedTask(this.bufferChecked, this);
+        }
+        this.checkTask.delay(10);
+    },
+    
+    
+    bufferChecked : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        this.fireEvent('change', this, out);
+    },
+    
+    onDestroy : function(){
+        if(this.checkTask){
+            this.checkTask.cancel();
+            this.checkTask = null;
+        }
+        Ext.form.RadioGroup.superclass.onDestroy.call(this);
+    }
+
+});
+
+Ext.reg('radiogroup', Ext.form.RadioGroup);
+
+Ext.form.Hidden = Ext.extend(Ext.form.Field, {
+    
+    inputType : 'hidden',
+    
+    shouldLayout: false,
+
+    
+    onRender : function(){
+        Ext.form.Hidden.superclass.onRender.apply(this, arguments);
+    },
+
+    
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    
+    setSize : Ext.emptyFn,
+    setWidth : Ext.emptyFn,
+    setHeight : Ext.emptyFn,
+    setPosition : Ext.emptyFn,
+    setPagePosition : Ext.emptyFn,
+    markInvalid : Ext.emptyFn,
+    clearInvalid : Ext.emptyFn
+});
+Ext.reg('hidden', Ext.form.Hidden);
+Ext.form.BasicForm = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        Ext.apply(this, config);
+        if(Ext.isString(this.paramOrder)){
+            this.paramOrder = this.paramOrder.split(/[\s,|]/);
+        }
+        
+        this.items = new Ext.util.MixedCollection(false, function(o){
+            return o.getItemId();
+        });
+        this.addEvents(
+            
+            'beforeaction',
+            
+            'actionfailed',
+            
+            'actioncomplete'
+        );
+
+        if(el){
+            this.initEl(el);
+        }
+        Ext.form.BasicForm.superclass.constructor.call(this);
+    },
+
+    
+    
+    
+    
+    
+    
+    
+    timeout: 30,
+
+    
+
+    
+    paramOrder: undefined,
+
+    
+    paramsAsHash: false,
+
+    
+    waitTitle: 'Please Wait...',
+
+    
+    activeAction : null,
+
+    
+    trackResetOnLoad : false,
+
+    
+    
+
+    
+    initEl : function(el){
+        this.el = Ext.get(el);
+        this.id = this.el.id || Ext.id();
+        if(!this.standardSubmit){
+            this.el.on('submit', this.onSubmit, this);
+        }
+        this.el.addClass('x-form');
+    },
+
+    
+    getEl: function(){
+        return this.el;
+    },
+
+    
+    onSubmit : function(e){
+        e.stopEvent();
+    },
+
+    
+    destroy: function(bound){
+        if(bound !== true){
+            this.items.each(function(f){
+                Ext.destroy(f);
+            });
+            Ext.destroy(this.el);
+        }
+        this.items.clear();
+        this.purgeListeners();
+    },
+
+    
+    isValid : function(){
+        var valid = true;
+        this.items.each(function(f){
+           if(!f.validate()){
+               valid = false;
+           }
+        });
+        return valid;
+    },
+
+    
+    isDirty : function(){
+        var dirty = false;
+        this.items.each(function(f){
+           if(f.isDirty()){
+               dirty = true;
+               return false;
+           }
+        });
+        return dirty;
+    },
+
+    
+    doAction : function(action, options){
+        if(Ext.isString(action)){
+            action = new Ext.form.Action.ACTION_TYPES[action](this, options);
+        }
+        if(this.fireEvent('beforeaction', this, action) !== false){
+            this.beforeAction(action);
+            action.run.defer(100, action);
+        }
+        return this;
+    },
+
+    
+    submit : function(options){
+        options = options || {};
+        if(this.standardSubmit){
+            var v = options.clientValidation === false || this.isValid();
+            if(v){
+                var el = this.el.dom;
+                if(this.url && Ext.isEmpty(el.action)){
+                    el.action = this.url;
+                }
+                el.submit();
+            }
+            return v;
+        }
+        var submitAction = String.format('{0}submit', this.api ? 'direct' : '');
+        this.doAction(submitAction, options);
+        return this;
+    },
+
+    
+    load : function(options){
+        var loadAction = String.format('{0}load', this.api ? 'direct' : '');
+        this.doAction(loadAction, options);
+        return this;
+    },
+
+    
+    updateRecord : function(record){
+        record.beginEdit();
+        var fs = record.fields,
+            field,
+            value;
+        fs.each(function(f){
+            field = this.findField(f.name);
+            if(field){
+                value = field.getValue();
+                if (Ext.type(value) !== false && value.getGroupValue) {
+                    value = value.getGroupValue();
+                } else if ( field.eachItem ) {
+                    value = [];
+                    field.eachItem(function(item){
+                        value.push(item.getValue());
+                    });
+                }
+                record.set(f.name, value);
+            }
+        }, this);
+        record.endEdit();
+        return this;
+    },
+
+    
+    loadRecord : function(record){
+        this.setValues(record.data);
+        return this;
+    },
+
+    
+    beforeAction : function(action){
+        
+        this.items.each(function(f){
+            if(f.isFormField && f.syncValue){
+                f.syncValue();
+            }
+        });
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.mask(o.waitMsg, 'x-mask-loading');
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget = Ext.get(this.waitMsgTarget);
+                this.waitMsgTarget.mask(o.waitMsg, 'x-mask-loading');
+            }else{
+                Ext.MessageBox.wait(o.waitMsg, o.waitTitle || this.waitTitle);
+            }
+        }
+    },
+
+    
+    afterAction : function(action, success){
+        this.activeAction = null;
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.unmask();
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget.unmask();
+            }else{
+                Ext.MessageBox.updateProgress(1);
+                Ext.MessageBox.hide();
+            }
+        }
+        if(success){
+            if(o.reset){
+                this.reset();
+            }
+            Ext.callback(o.success, o.scope, [this, action]);
+            this.fireEvent('actioncomplete', this, action);
+        }else{
+            Ext.callback(o.failure, o.scope, [this, action]);
+            this.fireEvent('actionfailed', this, action);
+        }
+    },
+
+    
+    findField : function(id) {
+        var field = this.items.get(id);
+
+        if (!Ext.isObject(field)) {
+            
+            var findMatchingField = function(f) {
+                if (f.isFormField) {
+                    if (f.dataIndex == id || f.id == id || f.getName() == id) {
+                        field = f;
+                        return false;
+                    } else if (f.isComposite) {
+                        return f.items.each(findMatchingField);
+                    } else if (f instanceof Ext.form.CheckboxGroup && f.rendered) {
+                        return f.eachItem(findMatchingField);
+                    }
+                }
+            };
+
+            this.items.each(findMatchingField);
+        }
+        return field || null;
+    },
+
+
+    
+    markInvalid : function(errors){
+        if (Ext.isArray(errors)) {
+            for(var i = 0, len = errors.length; i < len; i++){
+                var fieldError = errors[i];
+                var f = this.findField(fieldError.id);
+                if(f){
+                    f.markInvalid(fieldError.msg);
+                }
+            }
+        } else {
+            var field, id;
+            for(id in errors){
+                if(!Ext.isFunction(errors[id]) && (field = this.findField(id))){
+                    field.markInvalid(errors[id]);
+                }
+            }
+        }
+
+        return this;
+    },
+
+    
+    setValues : function(values){
+        if(Ext.isArray(values)){ 
+            for(var i = 0, len = values.length; i < len; i++){
+                var v = values[i];
+                var f = this.findField(v.id);
+                if(f){
+                    f.setValue(v.value);
+                    if(this.trackResetOnLoad){
+                        f.originalValue = f.getValue();
+                    }
+                }
+            }
+        }else{ 
+            var field, id;
+            for(id in values){
+                if(!Ext.isFunction(values[id]) && (field = this.findField(id))){
+                    field.setValue(values[id]);
+                    if(this.trackResetOnLoad){
+                        field.originalValue = field.getValue();
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    
+    getValues : function(asString){
+        var fs = Ext.lib.Ajax.serializeForm(this.el.dom);
+        if(asString === true){
+            return fs;
+        }
+        return Ext.urlDecode(fs);
+    },
+
+    
+    getFieldValues : function(dirtyOnly){
+        var o = {},
+            n,
+            key,
+            val;
+        this.items.each(function(f) {
+            if (!f.disabled && (dirtyOnly !== true || f.isDirty())) {
+                n = f.getName();
+                key = o[n];
+                val = f.getValue();
+
+                if(Ext.isDefined(key)){
+                    if(Ext.isArray(key)){
+                        o[n].push(val);
+                    }else{
+                        o[n] = [key, val];
+                    }
+                }else{
+                    o[n] = val;
+                }
+            }
+        });
+        return o;
+    },
+
+    
+    clearInvalid : function(){
+        this.items.each(function(f){
+           f.clearInvalid();
+        });
+        return this;
+    },
+
+    
+    reset : function(){
+        this.items.each(function(f){
+            f.reset();
+        });
+        return this;
+    },
+
+    
+    add : function(){
+        this.items.addAll(Array.prototype.slice.call(arguments, 0));
+        return this;
+    },
+
+    
+    remove : function(field){
+        this.items.remove(field);
+        return this;
+    },
+
+    
+    cleanDestroyed : function() {
+        this.items.filterBy(function(o) { return !!o.isDestroyed; }).each(this.remove, this);
+    },
+
+    
+    render : function(){
+        this.items.each(function(f){
+            if(f.isFormField && !f.rendered && document.getElementById(f.id)){ 
+                f.applyToMarkup(f.id);
+            }
+        });
+        return this;
+    },
+
+    
+    applyToFields : function(o){
+        this.items.each(function(f){
+           Ext.apply(f, o);
+        });
+        return this;
+    },
+
+    
+    applyIfToFields : function(o){
+        this.items.each(function(f){
+           Ext.applyIf(f, o);
+        });
+        return this;
+    },
+
+    callFieldMethod : function(fnName, args){
+        args = args || [];
+        this.items.each(function(f){
+            if(Ext.isFunction(f[fnName])){
+                f[fnName].apply(f, args);
+            }
+        });
+        return this;
+    }
+});
+
+
+Ext.BasicForm = Ext.form.BasicForm;
+
+Ext.FormPanel = Ext.extend(Ext.Panel, {
+    
+    
+    
+    
+    
+    
+    
+
+
+    
+    minButtonWidth : 75,
+
+    
+    labelAlign : 'left',
+
+    
+    monitorValid : false,
+
+    
+    monitorPoll : 200,
+
+    
+    layout : 'form',
+
+    
+    initComponent : function(){
+        this.form = this.createForm();
+        Ext.FormPanel.superclass.initComponent.call(this);
+
+        this.bodyCfg = {
+            tag: 'form',
+            cls: this.baseCls + '-body',
+            method : this.method || 'POST',
+            id : this.formId || Ext.id()
+        };
+        if(this.fileUpload) {
+            this.bodyCfg.enctype = 'multipart/form-data';
+        }
+        this.initItems();
+
+        this.addEvents(
+            
+            'clientvalidation'
+        );
+
+        this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);
+    },
+
+    
+    createForm : function(){
+        var config = Ext.applyIf({listeners: {}}, this.initialConfig);
+        return new Ext.form.BasicForm(null, config);
+    },
+
+    
+    initFields : function(){
+        var f = this.form;
+        var formPanel = this;
+        var fn = function(c){
+            if(formPanel.isField(c)){
+                f.add(c);
+            }else if(c.findBy && c != formPanel){
+                formPanel.applySettings(c);
+                
+                if(c.items && c.items.each){
+                    c.items.each(fn, this);
+                }
+            }
+        };
+        this.items.each(fn, this);
+    },
+
+    
+    applySettings: function(c){
+        var ct = c.ownerCt;
+        Ext.applyIf(c, {
+            labelAlign: ct.labelAlign,
+            labelWidth: ct.labelWidth,
+            itemCls: ct.itemCls
+        });
+    },
+
+    
+    getLayoutTarget : function(){
+        return this.form.el;
+    },
+
+    
+    getForm : function(){
+        return this.form;
+    },
+
+    
+    onRender : function(ct, position){
+        this.initFields();
+        Ext.FormPanel.superclass.onRender.call(this, ct, position);
+        this.form.initEl(this.body);
+    },
+
+    
+    beforeDestroy : function(){
+        this.stopMonitoring();
+        this.form.destroy(true);
+        Ext.FormPanel.superclass.beforeDestroy.call(this);
+    },
+
+    
+    isField : function(c) {
+        return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid;
+    },
+
+    
+    initEvents : function(){
+        Ext.FormPanel.superclass.initEvents.call(this);
+        
+        this.on({
+            scope: this,
+            add: this.onAddEvent,
+            remove: this.onRemoveEvent
+        });
+        if(this.monitorValid){ 
+            this.startMonitoring();
+        }
+    },
+
+    
+    onAdd: function(c){
+        Ext.FormPanel.superclass.onAdd.call(this, c);
+        this.processAdd(c);
+    },
+
+    
+    onAddEvent: function(ct, c){
+        if(ct !== this){
+            this.processAdd(c);
+        }
+    },
+
+    
+    processAdd : function(c){
+        
+        if(this.isField(c)){
+            this.form.add(c);
+        
+        }else if(c.findBy){
+            this.applySettings(c);
+            this.form.add.apply(this.form, c.findBy(this.isField));
+        }
+    },
+
+    
+    onRemove: function(c){
+        Ext.FormPanel.superclass.onRemove.call(this, c);
+        this.processRemove(c);
+    },
+
+    onRemoveEvent: function(ct, c){
+        if(ct !== this){
+            this.processRemove(c);
+        }
+    },
+
+    
+    processRemove: function(c){
+        if(!this.destroying){
+            
+            if(this.isField(c)){
+                this.form.remove(c);
+            
+            }else if (c.findBy){
+                Ext.each(c.findBy(this.isField), this.form.remove, this.form);
+                
+                this.form.cleanDestroyed();
+            }
+        }
+    },
+
+    
+    startMonitoring : function(){
+        if(!this.validTask){
+            this.validTask = new Ext.util.TaskRunner();
+            this.validTask.start({
+                run : this.bindHandler,
+                interval : this.monitorPoll || 200,
+                scope: this
+            });
+        }
+    },
+
+    
+    stopMonitoring : function(){
+        if(this.validTask){
+            this.validTask.stopAll();
+            this.validTask = null;
+        }
+    },
+
+    
+    load : function(){
+        this.form.load.apply(this.form, arguments);
+    },
+
+    
+    onDisable : function(){
+        Ext.FormPanel.superclass.onDisable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.disable();
+            });
+        }
+    },
+
+    
+    onEnable : function(){
+        Ext.FormPanel.superclass.onEnable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.enable();
+            });
+        }
+    },
+
+    
+    bindHandler : function(){
+        var valid = true;
+        this.form.items.each(function(f){
+            if(!f.isValid(true)){
+                valid = false;
+                return false;
+            }
+        });
+        if(this.fbar){
+            var fitems = this.fbar.items.items;
+            for(var i = 0, len = fitems.length; i < len; i++){
+                var btn = fitems[i];
+                if(btn.formBind === true && btn.disabled === valid){
+                    btn.setDisabled(!valid);
+                }
+            }
+        }
+        this.fireEvent('clientvalidation', this, valid);
+    }
+});
+Ext.reg('form', Ext.FormPanel);
+
+Ext.form.FormPanel = Ext.FormPanel;
+
+Ext.form.FieldSet = Ext.extend(Ext.Panel, {
+    
+    
+    
+    
+    
+    
+    baseCls : 'x-fieldset',
+    
+    layout : 'form',
+    
+    animCollapse : false,
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('fieldset');
+            this.el.id = this.id;
+            if (this.title || this.header || this.checkboxToggle) {
+                this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';
+            }
+        }
+
+        Ext.form.FieldSet.superclass.onRender.call(this, ct, position);
+
+        if(this.checkboxToggle){
+            var o = typeof this.checkboxToggle == 'object' ?
+                    this.checkboxToggle :
+                    {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
+            this.checkbox = this.header.insertFirst(o);
+            this.checkbox.dom.checked = !this.collapsed;
+            this.mon(this.checkbox, 'click', this.onCheckClick, this);
+        }
+    },
+
+    
+    onCollapse : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = false;
+        }
+        Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);
+
+    },
+
+    
+    onExpand : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = true;
+        }
+        Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
+    },
+
+    
+    onCheckClick : function(){
+        this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
+    }
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+});
+Ext.reg('fieldset', Ext.form.FieldSet);
+
+Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
+    
+    enableFormat : true,
+    
+    enableFontSize : true,
+    
+    enableColors : true,
+    
+    enableAlignments : true,
+    
+    enableLists : true,
+    
+    enableSourceEdit : true,
+    
+    enableLinks : true,
+    
+    enableFont : true,
+    
+    createLinkText : 'Please enter the URL for the link:',
+    
+    defaultLinkValue : 'http:/'+'/',
+    
+    fontFamilies : [
+        'Arial',
+        'Courier New',
+        'Tahoma',
+        'Times New Roman',
+        'Verdana'
+    ],
+    defaultFont: 'tahoma',
+    
+    defaultValue: (Ext.isOpera || Ext.isIE6) ? '&#160;' : '&#8203;',
+
+    
+    actionMode: 'wrap',
+    validationEvent : false,
+    deferHeight: true,
+    initialized : false,
+    activated : false,
+    sourceEditMode : false,
+    onFocus : Ext.emptyFn,
+    iframePad:3,
+    hideMode:'offsets',
+    defaultAutoCreate : {
+        tag: "textarea",
+        style:"width:500px;height:300px;",
+        autocomplete: "off"
+    },
+
+    
+    initComponent : function(){
+        this.addEvents(
+            
+            'initialize',
+            
+            'activate',
+             
+            'beforesync',
+             
+            'beforepush',
+             
+            'sync',
+             
+            'push',
+             
+            'editmodechange'
+        );
+        Ext.form.HtmlEditor.superclass.initComponent.call(this);
+    },
+
+    
+    createFontOptions : function(){
+        var buf = [], fs = this.fontFamilies, ff, lc;
+        for(var i = 0, len = fs.length; i< len; i++){
+            ff = fs[i];
+            lc = ff.toLowerCase();
+            buf.push(
+                '<option value="',lc,'" style="font-family:',ff,';"',
+                    (this.defaultFont == lc ? ' selected="true">' : '>'),
+                    ff,
+                '</option>'
+            );
+        }
+        return buf.join('');
+    },
+
+    
+    createToolbar : function(editor){
+        var items = [];
+        var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();
+
+
+        function btn(id, toggle, handler){
+            return {
+                itemId : id,
+                cls : 'x-btn-icon',
+                iconCls: 'x-edit-'+id,
+                enableToggle:toggle !== false,
+                scope: editor,
+                handler:handler||editor.relayBtnCmd,
+                clickEvent:'mousedown',
+                tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined,
+                overflowText: editor.buttonTips[id].title || undefined,
+                tabIndex:-1
+            };
+        }
+
+
+        if(this.enableFont && !Ext.isSafari2){
+            var fontSelectItem = new Ext.Toolbar.Item({
+               autoEl: {
+                    tag:'select',
+                    cls:'x-font-select',
+                    html: this.createFontOptions()
+               }
+            });
+
+            items.push(
+                fontSelectItem,
+                '-'
+            );
+        }
+
+        if(this.enableFormat){
+            items.push(
+                btn('bold'),
+                btn('italic'),
+                btn('underline')
+            );
+        }
+
+        if(this.enableFontSize){
+            items.push(
+                '-',
+                btn('increasefontsize', false, this.adjustFont),
+                btn('decreasefontsize', false, this.adjustFont)
+            );
+        }
+
+        if(this.enableColors){
+            items.push(
+                '-', {
+                    itemId:'forecolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-forecolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.forecolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        allowReselect: true,
+                        focus: Ext.emptyFn,
+                        value:'000000',
+                        plain:true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                this.execCmd('forecolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                this.deferFocus();
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }, {
+                    itemId:'backcolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-backcolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.backcolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        focus: Ext.emptyFn,
+                        value:'FFFFFF',
+                        plain:true,
+                        allowReselect: true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                if(Ext.isGecko){
+                                    this.execCmd('useCSS', false);
+                                    this.execCmd('hilitecolor', color);
+                                    this.execCmd('useCSS', true);
+                                    this.deferFocus();
+                                }else{
+                                    this.execCmd(Ext.isOpera ? 'hilitecolor' : 'backcolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                    this.deferFocus();
+                                }
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }
+            );
+        }
+
+        if(this.enableAlignments){
+            items.push(
+                '-',
+                btn('justifyleft'),
+                btn('justifycenter'),
+                btn('justifyright')
+            );
+        }
+
+        if(!Ext.isSafari2){
+            if(this.enableLinks){
+                items.push(
+                    '-',
+                    btn('createlink', false, this.createLink)
+                );
+            }
+
+            if(this.enableLists){
+                items.push(
+                    '-',
+                    btn('insertorderedlist'),
+                    btn('insertunorderedlist')
+                );
+            }
+            if(this.enableSourceEdit){
+                items.push(
+                    '-',
+                    btn('sourceedit', true, function(btn){
+                        this.toggleSourceEdit(!this.sourceEditMode);
+                    })
+                );
+            }
+        }
+
+        
+        var tb = new Ext.Toolbar({
+            renderTo: this.wrap.dom.firstChild,
+            items: items
+        });
+
+        if (fontSelectItem) {
+            this.fontSelect = fontSelectItem.el;
+
+            this.mon(this.fontSelect, 'change', function(){
+                var font = this.fontSelect.dom.value;
+                this.relayCmd('fontname', font);
+                this.deferFocus();
+            }, this);
+        }
+
+        
+        this.mon(tb.el, 'click', function(e){
+            e.preventDefault();
+        });
+
+        this.tb = tb;
+        this.tb.doLayout();
+    },
+
+    onDisable: function(){
+        this.wrap.mask();
+        Ext.form.HtmlEditor.superclass.onDisable.call(this);
+    },
+
+    onEnable: function(){
+        this.wrap.unmask();
+        Ext.form.HtmlEditor.superclass.onEnable.call(this);
+    },
+
+    setReadOnly: function(readOnly){
+
+        Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);
+        if(this.initialized){
+            if(Ext.isIE){
+                this.getEditorBody().contentEditable = !readOnly;
+            }else{
+                this.setDesignMode(!readOnly);
+            }
+            var bd = this.getEditorBody();
+            if(bd){
+                bd.style.cursor = this.readOnly ? 'default' : 'text';
+            }
+            this.disableItems(readOnly);
+        }
+    },
+
+    
+    getDocMarkup : function(){
+        var h = Ext.fly(this.iframe).getHeight() - this.iframePad * 2;
+        return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>', this.iframePad, h);
+    },
+
+    
+    getEditorBody : function(){
+        var doc = this.getDoc();
+        return doc.body || doc.documentElement;
+    },
+
+    
+    getDoc : function(){
+        return Ext.isIE ? this.getWin().document : (this.iframe.contentDocument || this.getWin().document);
+    },
+
+    
+    getWin : function(){
+        return Ext.isIE ? this.iframe.contentWindow : window.frames[this.iframe.name];
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.form.HtmlEditor.superclass.onRender.call(this, ct, position);
+        this.el.dom.style.border = '0 none';
+        this.el.dom.setAttribute('tabIndex', -1);
+        this.el.addClass('x-hidden');
+        if(Ext.isIE){ 
+            this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;');
+        }
+        this.wrap = this.el.wrap({
+            cls:'x-html-editor-wrap', cn:{cls:'x-html-editor-tb'}
+        });
+
+        this.createToolbar(this);
+
+        this.disableItems(true);
+
+        this.tb.doLayout();
+
+        this.createIFrame();
+
+        if(!this.width){
+            var sz = this.el.getSize();
+            this.setSize(sz.width, this.height || sz.height);
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    createIFrame: function(){
+        var iframe = document.createElement('iframe');
+        iframe.name = Ext.id();
+        iframe.frameBorder = '0';
+        iframe.style.overflow = 'auto';
+        iframe.src = Ext.SSL_SECURE_URL;
+
+        this.wrap.dom.appendChild(iframe);
+        this.iframe = iframe;
+
+        this.monitorTask = Ext.TaskMgr.start({
+            run: this.checkDesignMode,
+            scope: this,
+            interval:100
+        });
+    },
+
+    initFrame : function(){
+        Ext.TaskMgr.stop(this.monitorTask);
+        var doc = this.getDoc();
+        this.win = this.getWin();
+
+        doc.open();
+        doc.write(this.getDocMarkup());
+        doc.close();
+
+        var task = { 
+            run : function(){
+                var doc = this.getDoc();
+                if(doc.body || doc.readyState == 'complete'){
+                    Ext.TaskMgr.stop(task);
+                    this.setDesignMode(true);
+                    this.initEditor.defer(10, this);
+                }
+            },
+            interval : 10,
+            duration:10000,
+            scope: this
+        };
+        Ext.TaskMgr.start(task);
+    },
+
+
+    checkDesignMode : function(){
+        if(this.wrap && this.wrap.dom.offsetWidth){
+            var doc = this.getDoc();
+            if(!doc){
+                return;
+            }
+            if(!doc.editorInitialized || this.getDesignMode() != 'on'){
+                this.initFrame();
+            }
+        }
+    },
+
+    
+    setDesignMode : function(mode){
+        var doc = this.getDoc();
+        if (doc) {
+            if(this.readOnly){
+                mode = false;
+            }
+            doc.designMode = (/on|true/i).test(String(mode).toLowerCase()) ?'on':'off';
+        }
+
+    },
+
+    
+    getDesignMode : function(){
+        var doc = this.getDoc();
+        if(!doc){ return ''; }
+        return String(doc.designMode).toLowerCase();
+
+    },
+
+    disableItems: function(disabled){
+        if(this.fontSelect){
+            this.fontSelect.dom.disabled = disabled;
+        }
+        this.tb.items.each(function(item){
+            if(item.getItemId() != 'sourceedit'){
+                item.setDisabled(disabled);
+            }
+        });
+    },
+
+    
+    onResize : function(w, h){
+        Ext.form.HtmlEditor.superclass.onResize.apply(this, arguments);
+        if(this.el && this.iframe){
+            if(Ext.isNumber(w)){
+                var aw = w - this.wrap.getFrameWidth('lr');
+                this.el.setWidth(aw);
+                this.tb.setWidth(aw);
+                this.iframe.style.width = Math.max(aw, 0) + 'px';
+            }
+            if(Ext.isNumber(h)){
+                var ah = h - this.wrap.getFrameWidth('tb') - this.tb.el.getHeight();
+                this.el.setHeight(ah);
+                this.iframe.style.height = Math.max(ah, 0) + 'px';
+                var bd = this.getEditorBody();
+                if(bd){
+                    bd.style.height = Math.max((ah - (this.iframePad*2)), 0) + 'px';
+                }
+            }
+        }
+    },
+
+    
+    toggleSourceEdit : function(sourceEditMode){
+        var iframeHeight,
+            elHeight;
+
+        if (sourceEditMode === undefined) {
+            sourceEditMode = !this.sourceEditMode;
+        }
+        this.sourceEditMode = sourceEditMode === true;
+        var btn = this.tb.getComponent('sourceedit');
+
+        if (btn.pressed !== this.sourceEditMode) {
+            btn.toggle(this.sourceEditMode);
+            if (!btn.xtbHidden) {
+                return;
+            }
+        }
+        if (this.sourceEditMode) {
+            
+            this.previousSize = this.getSize();
+
+            iframeHeight = Ext.get(this.iframe).getHeight();
+
+            this.disableItems(true);
+            this.syncValue();
+            this.iframe.className = 'x-hidden';
+            this.el.removeClass('x-hidden');
+            this.el.dom.removeAttribute('tabIndex');
+            this.el.focus();
+            this.el.dom.style.height = iframeHeight + 'px';
+        }
+        else {
+            elHeight = parseInt(this.el.dom.style.height, 10);
+            if (this.initialized) {
+                this.disableItems(this.readOnly);
+            }
+            this.pushValue();
+            this.iframe.className = '';
+            this.el.addClass('x-hidden');
+            this.el.dom.setAttribute('tabIndex', -1);
+            this.deferFocus();
+
+            this.setSize(this.previousSize);
+            delete this.previousSize;
+            this.iframe.style.height = elHeight + 'px';
+        }
+        this.fireEvent('editmodechange', this, this.sourceEditMode);
+    },
+
+    
+    createLink : function() {
+        var url = prompt(this.createLinkText, this.defaultLinkValue);
+        if(url && url != 'http:/'+'/'){
+            this.relayCmd('createlink', url);
+        }
+    },
+
+    
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    
+    markInvalid : Ext.emptyFn,
+
+    
+    clearInvalid : Ext.emptyFn,
+
+    
+    setValue : function(v){
+        Ext.form.HtmlEditor.superclass.setValue.call(this, v);
+        this.pushValue();
+        return this;
+    },
+
+    
+    cleanHtml: function(html) {
+        html = String(html);
+        if(Ext.isWebKit){ 
+            html = html.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi, '');
+        }
+
+        
+        if(html.charCodeAt(0) == this.defaultValue.replace(/\D/g, '')){
+            html = html.substring(1);
+        }
+        return html;
+    },
+
+    
+    syncValue : function(){
+        if(this.initialized){
+            var bd = this.getEditorBody();
+            var html = bd.innerHTML;
+            if(Ext.isWebKit){
+                var bs = bd.getAttribute('style'); 
+                var m = bs.match(/text-align:(.*?);/i);
+                if(m && m[1]){
+                    html = '<div style="'+m[0]+'">' + html + '</div>';
+                }
+            }
+            html = this.cleanHtml(html);
+            if(this.fireEvent('beforesync', this, html) !== false){
+                this.el.dom.value = html;
+                this.fireEvent('sync', this, html);
+            }
+        }
+    },
+
+    
+    getValue : function() {
+        this[this.sourceEditMode ? 'pushValue' : 'syncValue']();
+        return Ext.form.HtmlEditor.superclass.getValue.call(this);
+    },
+
+    
+    pushValue : function(){
+        if(this.initialized){
+            var v = this.el.dom.value;
+            if(!this.activated && v.length < 1){
+                v = this.defaultValue;
+            }
+            if(this.fireEvent('beforepush', this, v) !== false){
+                this.getEditorBody().innerHTML = v;
+                if(Ext.isGecko){
+                    
+                    this.setDesignMode(false);  
+                    this.setDesignMode(true);
+                }
+                this.fireEvent('push', this, v);
+            }
+
+        }
+    },
+
+    
+    deferFocus : function(){
+        this.focus.defer(10, this);
+    },
+
+    
+    focus : function(){
+        if(this.win && !this.sourceEditMode){
+            this.win.focus();
+        }else{
+            this.el.focus();
+        }
+    },
+
+    
+    initEditor : function(){
+        
+        try{
+            var dbody = this.getEditorBody(),
+                ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat', 'background-color', 'color'),
+                doc,
+                fn;
+
+            ss['background-attachment'] = 'fixed'; 
+            dbody.bgProperties = 'fixed'; 
+
+            Ext.DomHelper.applyStyles(dbody, ss);
+
+            doc = this.getDoc();
+
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                }catch(e){}
+            }
+
+            
+            fn = this.onEditorEvent.createDelegate(this);
+            Ext.EventManager.on(doc, {
+                mousedown: fn,
+                dblclick: fn,
+                click: fn,
+                keyup: fn,
+                buffer:100
+            });
+
+            if(Ext.isGecko){
+                Ext.EventManager.on(doc, 'keypress', this.applyCommand, this);
+            }
+            if(Ext.isIE || Ext.isWebKit || Ext.isOpera){
+                Ext.EventManager.on(doc, 'keydown', this.fixKeys, this);
+            }
+            doc.editorInitialized = true;
+            this.initialized = true;
+            this.pushValue();
+            this.setReadOnly(this.readOnly);
+            this.fireEvent('initialize', this);
+        }catch(e){}
+    },
+
+    
+    beforeDestroy : function(){
+        if(this.monitorTask){
+            Ext.TaskMgr.stop(this.monitorTask);
+        }
+        if(this.rendered){
+            Ext.destroy(this.tb);
+            var doc = this.getDoc();
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                    for (var prop in doc){
+                        delete doc[prop];
+                    }
+                }catch(e){}
+            }
+            if(this.wrap){
+                this.wrap.dom.innerHTML = '';
+                this.wrap.remove();
+            }
+        }
+        Ext.form.HtmlEditor.superclass.beforeDestroy.call(this);
+    },
+
+    
+    onFirstFocus : function(){
+        this.activated = true;
+        this.disableItems(this.readOnly);
+        if(Ext.isGecko){ 
+            this.win.focus();
+            var s = this.win.getSelection();
+            if(!s.focusNode || s.focusNode.nodeType != 3){
+                var r = s.getRangeAt(0);
+                r.selectNodeContents(this.getEditorBody());
+                r.collapse(true);
+                this.deferFocus();
+            }
+            try{
+                this.execCmd('useCSS', true);
+                this.execCmd('styleWithCSS', false);
+            }catch(e){}
+        }
+        this.fireEvent('activate', this);
+    },
+
+    
+    adjustFont: function(btn){
+        var adjust = btn.getItemId() == 'increasefontsize' ? 1 : -1,
+            doc = this.getDoc(),
+            v = parseInt(doc.queryCommandValue('FontSize') || 2, 10);
+        if((Ext.isSafari && !Ext.isSafari2) || Ext.isChrome || Ext.isAir){
+            
+            
+            if(v <= 10){
+                v = 1 + adjust;
+            }else if(v <= 13){
+                v = 2 + adjust;
+            }else if(v <= 16){
+                v = 3 + adjust;
+            }else if(v <= 18){
+                v = 4 + adjust;
+            }else if(v <= 24){
+                v = 5 + adjust;
+            }else {
+                v = 6 + adjust;
+            }
+            v = v.constrain(1, 6);
+        }else{
+            if(Ext.isSafari){ 
+                adjust *= 2;
+            }
+            v = Math.max(1, v+adjust) + (Ext.isSafari ? 'px' : 0);
+        }
+        this.execCmd('FontSize', v);
+    },
+
+    
+    onEditorEvent : function(e){
+        this.updateToolbar();
+    },
+
+
+    
+    updateToolbar: function(){
+
+        if(this.readOnly){
+            return;
+        }
+
+        if(!this.activated){
+            this.onFirstFocus();
+            return;
+        }
+
+        var btns = this.tb.items.map,
+            doc = this.getDoc();
+
+        if(this.enableFont && !Ext.isSafari2){
+            var name = (doc.queryCommandValue('FontName')||this.defaultFont).toLowerCase();
+            if(name != this.fontSelect.dom.value){
+                this.fontSelect.dom.value = name;
+            }
+        }
+        if(this.enableFormat){
+            btns.bold.toggle(doc.queryCommandState('bold'));
+            btns.italic.toggle(doc.queryCommandState('italic'));
+            btns.underline.toggle(doc.queryCommandState('underline'));
+        }
+        if(this.enableAlignments){
+            btns.justifyleft.toggle(doc.queryCommandState('justifyleft'));
+            btns.justifycenter.toggle(doc.queryCommandState('justifycenter'));
+            btns.justifyright.toggle(doc.queryCommandState('justifyright'));
+        }
+        if(!Ext.isSafari2 && this.enableLists){
+            btns.insertorderedlist.toggle(doc.queryCommandState('insertorderedlist'));
+            btns.insertunorderedlist.toggle(doc.queryCommandState('insertunorderedlist'));
+        }
+
+        Ext.menu.MenuMgr.hideAll();
+
+        this.syncValue();
+    },
+
+    
+    relayBtnCmd : function(btn){
+        this.relayCmd(btn.getItemId());
+    },
+
+    
+    relayCmd : function(cmd, value){
+        (function(){
+            this.focus();
+            this.execCmd(cmd, value);
+            this.updateToolbar();
+        }).defer(10, this);
+    },
+
+    
+    execCmd : function(cmd, value){
+        var doc = this.getDoc();
+        doc.execCommand(cmd, false, value === undefined ? null : value);
+        this.syncValue();
+    },
+
+    
+    applyCommand : function(e){
+        if(e.ctrlKey){
+            var c = e.getCharCode(), cmd;
+            if(c > 0){
+                c = String.fromCharCode(c);
+                switch(c){
+                    case 'b':
+                        cmd = 'bold';
+                    break;
+                    case 'i':
+                        cmd = 'italic';
+                    break;
+                    case 'u':
+                        cmd = 'underline';
+                    break;
+                }
+                if(cmd){
+                    this.win.focus();
+                    this.execCmd(cmd);
+                    this.deferFocus();
+                    e.preventDefault();
+                }
+            }
+        }
+    },
+
+    
+    insertAtCursor : function(text){
+        if(!this.activated){
+            return;
+        }
+        if(Ext.isIE){
+            this.win.focus();
+            var doc = this.getDoc(),
+                r = doc.selection.createRange();
+            if(r){
+                r.pasteHTML(text);
+                this.syncValue();
+                this.deferFocus();
+            }
+        }else{
+            this.win.focus();
+            this.execCmd('InsertHTML', text);
+            this.deferFocus();
+        }
+    },
+
+    
+    fixKeys : function(){ 
+        if(Ext.isIE){
+            return function(e){
+                var k = e.getKey(),
+                    doc = this.getDoc(),
+                        r;
+                if(k == e.TAB){
+                    e.stopEvent();
+                    r = doc.selection.createRange();
+                    if(r){
+                        r.collapse(true);
+                        r.pasteHTML('&nbsp;&nbsp;&nbsp;&nbsp;');
+                        this.deferFocus();
+                    }
+                }else if(k == e.ENTER){
+                    r = doc.selection.createRange();
+                    if(r){
+                        var target = r.parentElement();
+                        if(!target || target.tagName.toLowerCase() != 'li'){
+                            e.stopEvent();
+                            r.pasteHTML('<br />');
+                            r.collapse(false);
+                            r.select();
+                        }
+                    }
+                }
+            };
+        }else if(Ext.isOpera){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.win.focus();
+                    this.execCmd('InsertHTML','&nbsp;&nbsp;&nbsp;&nbsp;');
+                    this.deferFocus();
+                }
+            };
+        }else if(Ext.isWebKit){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.execCmd('InsertText','\t');
+                    this.deferFocus();
+                }else if(k == e.ENTER){
+                    e.stopEvent();
+                    this.execCmd('InsertHtml','<br /><br />');
+                    this.deferFocus();
+                }
+             };
+        }
+    }(),
+
+    
+    getToolbar : function(){
+        return this.tb;
+    },
+
+    
+    buttonTips : {
+        bold : {
+            title: 'Bold (Ctrl+B)',
+            text: 'Make the selected text bold.',
+            cls: 'x-html-editor-tip'
+        },
+        italic : {
+            title: 'Italic (Ctrl+I)',
+            text: 'Make the selected text italic.',
+            cls: 'x-html-editor-tip'
+        },
+        underline : {
+            title: 'Underline (Ctrl+U)',
+            text: 'Underline the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        increasefontsize : {
+            title: 'Grow Text',
+            text: 'Increase the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        decreasefontsize : {
+            title: 'Shrink Text',
+            text: 'Decrease the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        backcolor : {
+            title: 'Text Highlight Color',
+            text: 'Change the background color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        forecolor : {
+            title: 'Font Color',
+            text: 'Change the color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyleft : {
+            title: 'Align Text Left',
+            text: 'Align text to the left.',
+            cls: 'x-html-editor-tip'
+        },
+        justifycenter : {
+            title: 'Center Text',
+            text: 'Center text in the editor.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyright : {
+            title: 'Align Text Right',
+            text: 'Align text to the right.',
+            cls: 'x-html-editor-tip'
+        },
+        insertunorderedlist : {
+            title: 'Bullet List',
+            text: 'Start a bulleted list.',
+            cls: 'x-html-editor-tip'
+        },
+        insertorderedlist : {
+            title: 'Numbered List',
+            text: 'Start a numbered list.',
+            cls: 'x-html-editor-tip'
+        },
+        createlink : {
+            title: 'Hyperlink',
+            text: 'Make the selected text a hyperlink.',
+            cls: 'x-html-editor-tip'
+        },
+        sourceedit : {
+            title: 'Source Edit',
+            text: 'Switch to source editing mode.',
+            cls: 'x-html-editor-tip'
+        }
+    }
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+});
+Ext.reg('htmleditor', Ext.form.HtmlEditor);
+
+Ext.form.TimeField = Ext.extend(Ext.form.ComboBox, {
+    
+    minValue : undefined,
+    
+    maxValue : undefined,
+    
+    minText : "The time in this field must be equal to or after {0}",
+    
+    maxText : "The time in this field must be equal to or before {0}",
+    
+    invalidText : "{0} is not a valid time",
+    
+    format : "g:i A",
+    
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",
+    
+    increment: 15,
+
+    
+    mode: 'local',
+    
+    triggerAction: 'all',
+    
+    typeAhead: false,
+
+    
+    
+    
+    initDate: '1/1/2008',
+
+    initDateFormat: 'j/n/Y',
+
+    
+    initComponent : function(){
+        if(Ext.isDefined(this.minValue)){
+            this.setMinValue(this.minValue, true);
+        }
+        if(Ext.isDefined(this.maxValue)){
+            this.setMaxValue(this.maxValue, true);
+        }
+        if(!this.store){
+            this.generateStore(true);
+        }
+        Ext.form.TimeField.superclass.initComponent.call(this);
+    },
+
+    
+    setMinValue: function(value,  initial){
+        this.setLimit(value, true, initial);
+        return this;
+    },
+
+    
+    setMaxValue: function(value,  initial){
+        this.setLimit(value, false, initial);
+        return this;
+    },
+
+    
+    generateStore: function(initial){
+        var min = this.minValue || new Date(this.initDate).clearTime(),
+            max = this.maxValue || new Date(this.initDate).clearTime().add('mi', (24 * 60) - 1),
+            times = [];
+
+        while(min <= max){
+            times.push(min.dateFormat(this.format));
+            min = min.add('mi', this.increment);
+        }
+        this.bindStore(times, initial);
+    },
+
+    
+    setLimit: function(value, isMin, initial){
+        var d;
+        if(Ext.isString(value)){
+            d = this.parseDate(value);
+        }else if(Ext.isDate(value)){
+            d = value;
+        }
+        if(d){
+            var val = new Date(this.initDate).clearTime();
+            val.setHours(d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds());
+            this[isMin ? 'minValue' : 'maxValue'] = val;
+            if(!initial){
+                this.generateStore();
+            }
+        }
+    },
+
+    
+    getValue : function(){
+        var v = Ext.form.TimeField.superclass.getValue.call(this);
+        return this.formatDate(this.parseDate(v)) || '';
+    },
+
+    
+    setValue : function(value){
+        return Ext.form.TimeField.superclass.setValue.call(this, this.formatDate(this.parseDate(value)));
+    },
+
+    
+    validateValue : Ext.form.DateField.prototype.validateValue,
+
+    formatDate : Ext.form.DateField.prototype.formatDate,
+
+    parseDate: function(value) {
+        if (!value || Ext.isDate(value)) {
+            return value;
+        }
+
+        var id = this.initDate + ' ',
+            idf = this.initDateFormat + ' ',
+            v = Date.parseDate(id + value, idf + this.format), 
+            af = this.altFormats;
+
+        if (!v && af) {
+            if (!this.altFormatsArray) {
+                this.altFormatsArray = af.split("|");
+            }
+            for (var i = 0, afa = this.altFormatsArray, len = afa.length; i < len && !v; i++) {
+                v = Date.parseDate(id + value, idf + afa[i]);
+            }
+        }
+
+        return v;
+    }
+});
+Ext.reg('timefield', Ext.form.TimeField);
+Ext.form.SliderField = Ext.extend(Ext.form.Field, {
+    
+    
+    useTips : true,
+    
+    
+    tipText : null,
+    
+    
+    actionMode: 'wrap',
+    
+    
+    initComponent : function() {
+        var cfg = Ext.copyTo({
+            id: this.id + '-slider'
+        }, this.initialConfig, ['vertical', 'minValue', 'maxValue', 'decimalPrecision', 'keyIncrement', 'increment', 'clickToChange', 'animate']);
+        
+        
+        if (this.useTips) {
+            var plug = this.tipText ? {getText: this.tipText} : {};
+            cfg.plugins = [new Ext.slider.Tip(plug)];
+        }
+        this.slider = new Ext.Slider(cfg);
+        Ext.form.SliderField.superclass.initComponent.call(this);
+    },    
+    
+    
+    onRender : function(ct, position){
+        this.autoCreate = {
+            id: this.id,
+            name: this.name,
+            type: 'hidden',
+            tag: 'input'    
+        };
+        Ext.form.SliderField.superclass.onRender.call(this, ct, position);
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
+        this.resizeEl = this.positionEl = this.wrap;
+        this.slider.render(this.wrap);
+    },
+    
+    
+    onResize : function(w, h, aw, ah){
+        Ext.form.SliderField.superclass.onResize.call(this, w, h, aw, ah);
+        this.slider.setSize(w, h);    
+    },
+    
+    
+    initEvents : function(){
+        Ext.form.SliderField.superclass.initEvents.call(this);
+        this.slider.on('change', this.onChange, this);   
+    },
+    
+    
+    onChange : function(slider, v){
+        this.setValue(v, undefined, true);
+    },
+    
+    
+    onEnable : function(){
+        Ext.form.SliderField.superclass.onEnable.call(this);
+        this.slider.enable();
+    },
+    
+    
+    onDisable : function(){
+        Ext.form.SliderField.superclass.onDisable.call(this);
+        this.slider.disable();    
+    },
+    
+    
+    beforeDestroy : function(){
+        Ext.destroy(this.slider);
+        Ext.form.SliderField.superclass.beforeDestroy.call(this);
+    },
+    
+    
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.slider.el, 'tl-tr', [2, 0]);
+    },
+    
+    
+    setMinValue : function(v){
+        this.slider.setMinValue(v);
+        return this;    
+    },
+    
+    
+    setMaxValue : function(v){
+        this.slider.setMaxValue(v);
+        return this;    
+    },
+    
+    
+    setValue : function(v, animate,  silent){
+        
+        
+        if(!silent){
+            this.slider.setValue(v, animate);
+        }
+        return Ext.form.SliderField.superclass.setValue.call(this, this.slider.getValue());
+    },
+    
+    
+    getValue : function(){
+        return this.slider.getValue();    
+    }
+});
+
+Ext.reg('sliderfield', Ext.form.SliderField);
+Ext.form.Label = Ext.extend(Ext.BoxComponent, {
+    
+    
+    
+
+    
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('label');
+            this.el.id = this.getId();
+            this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');
+            if(this.forId){
+                this.el.setAttribute('for', this.forId);
+            }
+        }
+        Ext.form.Label.superclass.onRender.call(this, ct, position);
+    },
+
+    
+    setText : function(t, encode){
+        var e = encode === false;
+        this[!e ? 'text' : 'html'] = t;
+        delete this[e ? 'text' : 'html'];
+        if(this.rendered){
+            this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;
+        }
+        return this;
+    }
+});
+
+Ext.reg('label', Ext.form.Label);
+Ext.form.Action = function(form, options){
+    this.form = form;
+    this.options = options || {};
+};
+
+
+Ext.form.Action.CLIENT_INVALID = 'client';
+
+Ext.form.Action.SERVER_INVALID = 'server';
+
+Ext.form.Action.CONNECT_FAILURE = 'connect';
+
+Ext.form.Action.LOAD_FAILURE = 'load';
+
+Ext.form.Action.prototype = {
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    type : 'default',
+
+ 
+ 
+
+    
+    run : function(options){
+
+    },
+
+    
+    success : function(response){
+
+    },
+
+    
+    handleResponse : function(response){
+
+    },
+
+    
+    failure : function(response){
+        this.response = response;
+        this.failureType = Ext.form.Action.CONNECT_FAILURE;
+        this.form.afterAction(this, false);
+    },
+
+    
+    
+    
+    processResponse : function(response){
+        this.response = response;
+        if(!response.responseText && !response.responseXML){
+            return true;
+        }
+        this.result = this.handleResponse(response);
+        return this.result;
+    },
+    
+    decodeResponse: function(response) {
+        try {
+            return Ext.decode(response.responseText);
+        } catch(e) {
+            return false;
+        } 
+    },
+
+    
+    getUrl : function(appendParams){
+        var url = this.options.url || this.form.url || this.form.el.dom.action;
+        if(appendParams){
+            var p = this.getParams();
+            if(p){
+                url = Ext.urlAppend(url, p);
+            }
+        }
+        return url;
+    },
+
+    
+    getMethod : function(){
+        return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();
+    },
+
+    
+    getParams : function(){
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        if(p){
+            if(typeof p == "object"){
+                p = Ext.urlEncode(Ext.applyIf(p, bp));
+            }else if(typeof p == 'string' && bp){
+                p += '&' + Ext.urlEncode(bp);
+            }
+        }else if(bp){
+            p = Ext.urlEncode(bp);
+        }
+        return p;
+    },
+
+    
+    createCallback : function(opts){
+        var opts = opts || {};
+        return {
+            success: this.success,
+            failure: this.failure,
+            scope: this,
+            timeout: (opts.timeout*1000) || (this.form.timeout*1000),
+            upload: this.form.fileUpload ? this.success : undefined
+        };
+    }
+};
+
+
+Ext.form.Action.Submit = function(form, options){
+    Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
+};
+
+Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
+    
+    
+    type : 'submit',
+
+    
+    run : function(){
+        var o = this.options,
+            method = this.getMethod(),
+            isGet = method == 'GET';
+        if(o.clientValidation === false || this.form.isValid()){
+            if (o.submitEmptyText === false) {
+                var fields = this.form.items,
+                    emptyFields = [],
+                    setupEmptyFields = function(f){
+                        if (f.el.getValue() == f.emptyText) {
+                            emptyFields.push(f);
+                            f.el.dom.value = "";
+                        }
+                        if(f.isComposite && f.rendered){
+                            f.items.each(setupEmptyFields);
+                        }
+                    };
+                    
+                fields.each(setupEmptyFields);
+            }
+            Ext.Ajax.request(Ext.apply(this.createCallback(o), {
+                form:this.form.el.dom,
+                url:this.getUrl(isGet),
+                method: method,
+                headers: o.headers,
+                params:!isGet ? this.getParams() : null,
+                isUpload: this.form.fileUpload
+            }));
+            if (o.submitEmptyText === false) {
+                Ext.each(emptyFields, function(f) {
+                    if (f.applyEmptyText) {
+                        f.applyEmptyText();
+                    }
+                });
+            }
+        }else if (o.clientValidation !== false){ 
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || result.success){
+            this.form.afterAction(this, true);
+            return;
+        }
+        if(result.errors){
+            this.form.markInvalid(result.errors);
+        }
+        this.failureType = Ext.form.Action.SERVER_INVALID;
+        this.form.afterAction(this, false);
+    },
+
+    
+    handleResponse : function(response){
+        if(this.form.errorReader){
+            var rs = this.form.errorReader.read(response);
+            var errors = [];
+            if(rs.records){
+                for(var i = 0, len = rs.records.length; i < len; i++) {
+                    var r = rs.records[i];
+                    errors[i] = r.data;
+                }
+            }
+            if(errors.length < 1){
+                errors = null;
+            }
+            return {
+                success : rs.success,
+                errors : errors
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+
+Ext.form.Action.Load = function(form, options){
+    Ext.form.Action.Load.superclass.constructor.call(this, form, options);
+    this.reader = this.form.reader;
+};
+
+Ext.extend(Ext.form.Action.Load, Ext.form.Action, {
+    
+    type : 'load',
+
+    
+    run : function(){
+        Ext.Ajax.request(Ext.apply(
+                this.createCallback(this.options), {
+                    method:this.getMethod(),
+                    url:this.getUrl(false),
+                    headers: this.options.headers,
+                    params:this.getParams()
+        }));
+    },
+
+    
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || !result.success || !result.data){
+            this.failureType = Ext.form.Action.LOAD_FAILURE;
+            this.form.afterAction(this, false);
+            return;
+        }
+        this.form.clearInvalid();
+        this.form.setValues(result.data);
+        this.form.afterAction(this, true);
+    },
+
+    
+    handleResponse : function(response){
+        if(this.form.reader){
+            var rs = this.form.reader.read(response);
+            var data = rs.records && rs.records[0] ? rs.records[0].data : null;
+            return {
+                success : rs.success,
+                data : data
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+
+
+Ext.form.Action.DirectLoad = Ext.extend(Ext.form.Action.Load, {
+    constructor: function(form, opts) {
+        Ext.form.Action.DirectLoad.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directload',
+
+    run : function(){
+        var args = this.getParams();
+        args.push(this.success, this);
+        this.form.api.load.apply(window, args);
+    },
+
+    getParams : function() {
+        var buf = [], o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        var paramOrder = this.form.paramOrder;
+        if(paramOrder){
+            for(var i = 0, len = paramOrder.length; i < len; i++){
+                buf.push(o[paramOrder[i]]);
+            }
+        }else if(this.form.paramsAsHash){
+            buf.push(o);
+        }
+        return buf;
+    },
+    
+    
+    
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectLoad.superclass.success.call(this, response);
+    }
+});
+
+
+Ext.form.Action.DirectSubmit = Ext.extend(Ext.form.Action.Submit, {
+    constructor : function(form, opts) {
+        Ext.form.Action.DirectSubmit.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directsubmit',
+    
+    run : function(){
+        var o = this.options;
+        if(o.clientValidation === false || this.form.isValid()){
+            
+            
+            this.success.params = this.getParams();
+            this.form.api.submit(this.form.el.dom, this.success, this);
+        }else if (o.clientValidation !== false){ 
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    getParams : function() {
+        var o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        return o;
+    },
+    
+    
+    
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectSubmit.superclass.success.call(this, response);
+    }
+});
+
+Ext.form.Action.ACTION_TYPES = {
+    'load' : Ext.form.Action.Load,
+    'submit' : Ext.form.Action.Submit,
+    'directload' : Ext.form.Action.DirectLoad,
+    'directsubmit' : Ext.form.Action.DirectSubmit
+};
+
+Ext.form.VTypes = function(){
+    
+    var alpha = /^[a-zA-Z_]+$/,
+        alphanum = /^[a-zA-Z0-9_]+$/,
+        email = /^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,
+        url = /(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
+
+    
+    return {
+        
+        'email' : function(v){
+            return email.test(v);
+        },
+        
+        'emailText' : 'This field should be an e-mail address in the format "user@example.com"',
+        
+        'emailMask' : /[a-z0-9_\.\-\+\'@]/i,
+
+        /**
+         * The function used to validate URLs
+         * @param {String} value The URL
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'url' : function(v){
+            return url.test(v);
+        },
+        /**
+         * The error text to display when the url validation function returns false.  Defaults to:
+         * <tt>'This field should be a URL in the format "http:/'+'/www.example.com"'</tt>
+         * @type String
+         */
+        'urlText' : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+
+        /**
+         * The function used to validate alpha values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alpha' : function(v){
+            return alpha.test(v);
+        },
+        /**
+         * The error text to display when the alpha validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters and _'</tt>
+         * @type String
+         */
+        'alphaText' : 'This field should only contain letters and _',
+        /**
+         * The keystroke filter mask to be applied on alpha input.  Defaults to:
+         * <tt>/[a-z_]/i</tt>
+         * @type RegExp
+         */
+        'alphaMask' : /[a-z_]/i,
+
+        /**
+         * The function used to validate alphanumeric values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alphanum' : function(v){
+            return alphanum.test(v);
+        },
+        /**
+         * The error text to display when the alphanumeric validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters, numbers and _'</tt>
+         * @type String
+         */
+        'alphanumText' : 'This field should only contain letters, numbers and _',
+        /**
+         * The keystroke filter mask to be applied on alphanumeric input.  Defaults to:
+         * <tt>/[a-z0-9_]/i</tt>
+         * @type RegExp
+         */
+        'alphanumMask' : /[a-z0-9_]/i
+    };
+}();
+/**
+ * @class Ext.grid.GridPanel
+ * @extends Ext.Panel
+ * <p>This class represents the primary interface of a component based grid control to represent data
+ * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior
+ * <div class="sub-desc"></div></li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    {@link #store}: new {@link Ext.data.Store}({
+        {@link Ext.data.Store#autoDestroy autoDestroy}: true,
+        {@link Ext.data.Store#reader reader}: reader,
+        {@link Ext.data.Store#data data}: xg.dummyData
+    }),
+    {@link #colModel}: new {@link Ext.grid.ColumnModel}({
+        {@link Ext.grid.ColumnModel#defaults defaults}: {
+            width: 120,
+            sortable: true
+        },
+        {@link Ext.grid.ColumnModel#columns columns}: [
+            {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
+            {header: 'Change', dataIndex: 'change'},
+            {header: '% Change', dataIndex: 'pctChange'},
+            // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype
+            {
+                header: 'Last Updated', width: 135, dataIndex: 'lastChange',
+                xtype: 'datecolumn', format: 'M d, Y'
+            }
+        ]
+    }),
+    {@link #viewConfig}: {
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+
+//      Return CSS class to apply to rows depending upon data values
+        {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {
+            var c = record.{@link Ext.data.Record#get get}('change');
+            if (c < 0) {
+                return 'price-fall';
+            } else if (c > 0) {
+                return 'price-rise';
+            }
+        }
+    },
+    {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),
+    width: 600,
+    height: 300,
+    frame: true,
+    title: 'Framed with Row Selection and Horizontal Scrolling',
+    iconCls: 'icon-grid'
+});
+ * </code></pre>
+ * <p><b><u>Notes:</u></b></p>
+ * <div class="mdetail-params"><ul>
+ * <li>Although this class inherits many configuration options from base classes, some of them
+ * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will
+ * have no effect.</li>
+ * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to
+ * scroll its rows. These dimensions can either be set explicitly through the
+ * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>
+ * configuration options or implicitly set by using the grid as a child item of a
+ * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}
+ * provide the sizing of its child items (for example the Container of the Grid may specify
+ * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>
+ * <li>To access the data in a Grid, it is necessary to use the data model encapsulated
+ * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype grid
+ */
+Ext.grid.GridPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} autoExpandColumn
+     * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in
+     * this grid that should expand to fill unused space. This value specified here can not
+     * be <tt>0</tt>.</p>
+     * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with
+     * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>
+     * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>
+     * for additional details.</p>
+     * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>
+     */
+    autoExpandColumn : false,
+    
+    
+    autoExpandMax : 1000,
+    
+    
+    autoExpandMin : 50,
+    
+    
+    columnLines : false,
+    
+    
+    
+    
+    
+    
+    ddText : '{0} selected row{1}',
+    
+    
+    deferRowRender : true,
+    
+    
+    
+    
+    enableColumnHide : true,
+    
+    
+    enableColumnMove : true,
+    
+    
+    enableDragDrop : false,
+    
+    
+    enableHdMenu : true,
+    
+    
+    
+    loadMask : false,
+    
+    
+    
+    minColumnWidth : 25,
+    
+    
+    
+    
+    
+    stripeRows : false,
+    
+    
+    trackMouseOver : true,
+    
+    
+    stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],
+    
+    
+    view : null,
+
+    
+    bubbleEvents: [],
+
+    
+
+    
+    rendered : false,
+    
+    
+    viewReady : false,
+
+    
+    initComponent : function() {
+        Ext.grid.GridPanel.superclass.initComponent.call(this);
+
+        if (this.columnLines) {
+            this.cls = (this.cls || '') + ' x-grid-with-col-lines';
+        }
+        
+        
+        this.autoScroll = false;
+        this.autoWidth = false;
+
+        if(Ext.isArray(this.columns)){
+            this.colModel = new Ext.grid.ColumnModel(this.columns);
+            delete this.columns;
+        }
+
+        
+        if(this.ds){
+            this.store = this.ds;
+            delete this.ds;
+        }
+        if(this.cm){
+            this.colModel = this.cm;
+            delete this.cm;
+        }
+        if(this.sm){
+            this.selModel = this.sm;
+            delete this.sm;
+        }
+        this.store = Ext.StoreMgr.lookup(this.store);
+
+        this.addEvents(
+            
+            
+            'click',
+            
+            'dblclick',
+            
+            'contextmenu',
+            
+            'mousedown',
+            
+            'mouseup',
+            
+            'mouseover',
+            
+            'mouseout',
+            
+            'keypress',
+            
+            'keydown',
+
+            
+            
+            'cellmousedown',
+            
+            'rowmousedown',
+            
+            'headermousedown',
+
+            
+            'groupmousedown',
+
+            
+            'rowbodymousedown',
+
+            
+            'containermousedown',
+
+            
+            'cellclick',
+            
+            'celldblclick',
+            
+            'rowclick',
+            
+            'rowdblclick',
+            
+            'headerclick',
+            
+            'headerdblclick',
+            
+            'groupclick',
+            
+            'groupdblclick',
+            
+            'containerclick',
+            
+            'containerdblclick',
+
+            
+            'rowbodyclick',
+            
+            'rowbodydblclick',
+
+            
+            'rowcontextmenu',
+            
+            'cellcontextmenu',
+            
+            'headercontextmenu',
+            
+            'groupcontextmenu',
+            
+            'containercontextmenu',
+            
+            'rowbodycontextmenu',
+            
+            'bodyscroll',
+            
+            'columnresize',
+            
+            'columnmove',
+            
+            'sortchange',
+            
+            'groupchange',
+            
+            'reconfigure',
+            
+            'viewready'
+        );
+    },
+
+    
+    onRender : function(ct, position){
+        Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);
+
+        var c = this.getGridEl();
+
+        this.el.addClass('x-grid-panel');
+
+        this.mon(c, {
+            scope: this,
+            mousedown: this.onMouseDown,
+            click: this.onClick,
+            dblclick: this.onDblClick,
+            contextmenu: this.onContextMenu
+        });
+
+        this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);
+
+        var view = this.getView();
+        view.init(this);
+        view.render();
+        this.getSelectionModel().init(this);
+    },
+
+    
+    initEvents : function(){
+        Ext.grid.GridPanel.superclass.initEvents.call(this);
+
+        if(this.loadMask){
+            this.loadMask = new Ext.LoadMask(this.bwrap,
+                    Ext.apply({store:this.store}, this.loadMask));
+        }
+    },
+
+    initStateEvents : function(){
+        Ext.grid.GridPanel.superclass.initStateEvents.call(this);
+        this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});
+    },
+
+    applyState : function(state){
+        var cm = this.colModel,
+            cs = state.columns,
+            store = this.store,
+            s,
+            c,
+            colIndex;
+
+        if(cs){
+            for(var i = 0, len = cs.length; i < len; i++){
+                s = cs[i];
+                c = cm.getColumnById(s.id);
+                if(c){
+                    colIndex = cm.getIndexById(s.id);
+                    cm.setState(colIndex, {
+                        hidden: s.hidden,
+                        width: s.width,
+                        sortable: s.sortable
+                    });
+                    if(colIndex != i){
+                        cm.moveColumn(colIndex, i);
+                    }
+                }
+            }
+        }
+        if(store){
+            s = state.sort;
+            if(s){
+                store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);
+            }
+            s = state.group;
+            if(store.groupBy){
+                if(s){
+                    store.groupBy(s);
+                }else{
+                    store.clearGrouping();
+                }
+            }
+
+        }
+        var o = Ext.apply({}, state);
+        delete o.columns;
+        delete o.sort;
+        Ext.grid.GridPanel.superclass.applyState.call(this, o);
+    },
+
+    getState : function(){
+        var o = {columns: []},
+            store = this.store,
+            ss,
+            gs;
+
+        for(var i = 0, c; (c = this.colModel.config[i]); i++){
+            o.columns[i] = {
+                id: c.id,
+                width: c.width
+            };
+            if(c.hidden){
+                o.columns[i].hidden = true;
+            }
+            if(c.sortable){
+                o.columns[i].sortable = true;
+            }
+        }
+        if(store){
+            ss = store.getSortState();
+            if(ss){
+                o.sort = ss;
+            }
+            if(store.getGroupState){
+                gs = store.getGroupState();
+                if(gs){
+                    o.group = gs;
+                }
+            }
+        }
+        return o;
+    },
+
+    
+    afterRender : function(){
+        Ext.grid.GridPanel.superclass.afterRender.call(this);
+        var v = this.view;
+        this.on('bodyresize', v.layout, v);
+        v.layout(true);
+        if(this.deferRowRender){
+            if (!this.deferRowRenderTask){
+                this.deferRowRenderTask = new Ext.util.DelayedTask(v.afterRender, this.view);
+            }
+            this.deferRowRenderTask.delay(10);
+        }else{
+            v.afterRender();
+        }
+        this.viewReady = true;
+    },
+
+    
+    reconfigure : function(store, colModel){
+        var rendered = this.rendered;
+        if(rendered){
+            if(this.loadMask){
+                this.loadMask.destroy();
+                this.loadMask = new Ext.LoadMask(this.bwrap,
+                        Ext.apply({}, {store:store}, this.initialConfig.loadMask));
+            }
+        }
+        if(this.view){
+            this.view.initData(store, colModel);
+        }
+        this.store = store;
+        this.colModel = colModel;
+        if(rendered){
+            this.view.refresh(true);
+        }
+        this.fireEvent('reconfigure', this, store, colModel);
+    },
+
+    
+    onDestroy : function(){
+        if (this.deferRowRenderTask && this.deferRowRenderTask.cancel){
+            this.deferRowRenderTask.cancel();
+        }
+        if(this.rendered){
+            Ext.destroy(this.view, this.loadMask);
+        }else if(this.store && this.store.autoDestroy){
+            this.store.destroy();
+        }
+        Ext.destroy(this.colModel, this.selModel);
+        this.store = this.selModel = this.colModel = this.view = this.loadMask = null;
+        Ext.grid.GridPanel.superclass.onDestroy.call(this);
+    },
+
+    
+    processEvent : function(name, e){
+        this.view.processEvent(name, e);
+    },
+
+    
+    onClick : function(e){
+        this.processEvent('click', e);
+    },
+
+    
+    onMouseDown : function(e){
+        this.processEvent('mousedown', e);
+    },
+
+    
+    onContextMenu : function(e, t){
+        this.processEvent('contextmenu', e);
+    },
+
+    
+    onDblClick : function(e){
+        this.processEvent('dblclick', e);
+    },
+
+    
+    walkCells : function(row, col, step, fn, scope){
+        var cm    = this.colModel,
+            clen  = cm.getColumnCount(),
+            ds    = this.store,
+            rlen  = ds.getCount(),
+            first = true;
+
+        if(step < 0){
+            if(col < 0){
+                row--;
+                first = false;
+            }
+            while(row >= 0){
+                if(!first){
+                    col = clen-1;
+                }
+                first = false;
+                while(col >= 0){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col--;
+                }
+                row--;
+            }
+        } else {
+            if(col >= clen){
+                row++;
+                first = false;
+            }
+            while(row < rlen){
+                if(!first){
+                    col = 0;
+                }
+                first = false;
+                while(col < clen){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col++;
+                }
+                row++;
+            }
+        }
+        return null;
+    },
+
+    
+    getGridEl : function(){
+        return this.body;
+    },
+
+    
+    stopEditing : Ext.emptyFn,
+
+    
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.grid.RowSelectionModel(
+                    this.disableSelection ? {selectRow: Ext.emptyFn} : null);
+        }
+        return this.selModel;
+    },
+
+    
+    getStore : function(){
+        return this.store;
+    },
+
+    
+    getColumnModel : function(){
+        return this.colModel;
+    },
+
+    
+    getView : function() {
+        if (!this.view) {
+            this.view = new Ext.grid.GridView(this.viewConfig);
+        }
+        
+        return this.view;
+    },
+    
+    getDragDropText : function(){
+        var count = this.selModel.getCount();
+        return String.format(this.ddText, count, count == 1 ? '' : 's');
+    }
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+
+
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+});
+Ext.reg('grid', Ext.grid.GridPanel);
+Ext.grid.PivotGrid = Ext.extend(Ext.grid.GridPanel, {
+    
+    
+    aggregator: 'sum',
+    
+    
+    renderer: undefined,
+    
+    
+    
+    
+    
+    
+    
+    
+    initComponent: function() {
+        Ext.grid.PivotGrid.superclass.initComponent.apply(this, arguments);
+        
+        this.initAxes();
+        
+        
+        this.enableColumnResize = false;
+        
+        this.viewConfig = Ext.apply(this.viewConfig || {}, {
+            forceFit: true
+        });
+        
+        
+        
+        this.colModel = new Ext.grid.ColumnModel({});
+    },
+    
+    
+    getAggregator: function() {
+        if (typeof this.aggregator == 'string') {
+            return Ext.grid.PivotAggregatorMgr.types[this.aggregator];
+        } else {
+            return this.aggregator;
+        }
+    },
+    
+    
+    setAggregator: function(aggregator) {
+        this.aggregator = aggregator;
+    },
+    
+    
+    setMeasure: function(measure) {
+        this.measure = measure;
+    },
+    
+    
+    setLeftAxis: function(axis, refresh) {
+        
+        this.leftAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    
+    setTopAxis: function(axis, refresh) {
+        
+        this.topAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    
+    initAxes: function() {
+        var PivotAxis = Ext.grid.PivotAxis;
+        
+        if (!(this.leftAxis instanceof PivotAxis)) {
+            this.setLeftAxis(new PivotAxis({
+                orientation: 'vertical',
+                dimensions : this.leftAxis || [],
+                store      : this.store
+            }));
+        };
+        
+        if (!(this.topAxis instanceof PivotAxis)) {
+            this.setTopAxis(new PivotAxis({
+                orientation: 'horizontal',
+                dimensions : this.topAxis || [],
+                store      : this.store
+            }));
+        };
+    },
+    
+    
+    extractData: function() {
+        var records  = this.store.data.items,
+            recCount = records.length,
+            cells    = [],
+            record, i, j, k;
+        
+        if (recCount == 0) {
+            return [];
+        }
+        
+        var leftTuples = this.leftAxis.getTuples(),
+            leftCount  = leftTuples.length,
+            topTuples  = this.topAxis.getTuples(),
+            topCount   = topTuples.length,
+            aggregator = this.getAggregator();
+        
+        for (i = 0; i < recCount; i++) {
+            record = records[i];
+            
+            for (j = 0; j < leftCount; j++) {
+                cells[j] = cells[j] || [];
+                
+                if (leftTuples[j].matcher(record) === true) {
+                    for (k = 0; k < topCount; k++) {
+                        cells[j][k] = cells[j][k] || [];
+                        
+                        if (topTuples[k].matcher(record)) {
+                            cells[j][k].push(record);
+                        }
+                    }
+                }
+            }
+        }
+        
+        var rowCount = cells.length,
+            colCount, row;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = cells[i];
+            colCount = row.length;
+            
+            for (j = 0; j < colCount; j++) {
+                cells[i][j] = aggregator(cells[i][j], this.measure);
+            }
+        }
+        
+        return cells;
+    },
+    
+    
+    getView: function() {
+        if (!this.view) {
+            this.view = new Ext.grid.PivotGridView(this.viewConfig);
+        }
+        
+        return this.view;
+    }
+});
+
+Ext.reg('pivotgrid', Ext.grid.PivotGrid);
+
+
+Ext.grid.PivotAggregatorMgr = new Ext.AbstractManager();
+
+Ext.grid.PivotAggregatorMgr.registerType('sum', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return total;
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('avg', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return (total / length) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('min', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.min.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('max', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.max.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('count', function(records, measure) {
+    return records.length;
+});
+Ext.grid.GridView = Ext.extend(Ext.util.Observable, {
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+    deferEmptyText : true,
+
+    
+    scrollOffset : undefined,
+
+    
+    autoFill : false,
+
+    
+    forceFit : false,
+
+    
+    sortClasses : ['sort-asc', 'sort-desc'],
+
+    
+    sortAscText : 'Sort Ascending',
+
+    
+    sortDescText : 'Sort Descending',
+
+    
+    columnsText : 'Columns',
+
+    
+    selectedRowClass : 'x-grid3-row-selected',
+
+    
+    borderWidth : 2,
+    tdClass : 'x-grid3-cell',
+    hdCls : 'x-grid3-hd',
+    
+    
+    
+    markDirty : true,
+
+    
+    cellSelectorDepth : 4,
+    
+    
+    rowSelectorDepth : 10,
+
+    
+    rowBodySelectorDepth : 10,
+
+    
+    cellSelector : 'td.x-grid3-cell',
+    
+    
+    rowSelector : 'div.x-grid3-row',
+
+    
+    rowBodySelector : 'div.x-grid3-row-body',
+
+    
+    firstRowCls: 'x-grid3-row-first',
+    lastRowCls: 'x-grid3-row-last',
+    rowClsRe: /(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,
+    
+    
+    headerMenuOpenCls: 'x-grid3-hd-menu-open',
+    
+    
+    rowOverCls: 'x-grid3-row-over',
+
+    constructor : function(config) {
+        Ext.apply(this, config);
+        
+        
+        this.addEvents(
+            
+            'beforerowremoved',
+            
+            
+            'beforerowsinserted',
+            
+            
+            'beforerefresh',
+            
+            
+            'rowremoved',
+            
+            
+            'rowsinserted',
+            
+            
+            'rowupdated',
+            
+            
+            'refresh'
+        );
+        
+        Ext.grid.GridView.superclass.constructor.call(this);
+    },
+
+    
+    
+    
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    
+    headerTpl: new Ext.Template(
+        '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+            '<thead>',
+                '<tr class="x-grid3-hd-row">{cells}</tr>',
+            '</thead>',
+        '</table>'
+    ),
+    
+    
+    bodyTpl: new Ext.Template('{rows}'),
+    
+    
+    cellTpl: new Ext.Template(
+        '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>',
+            '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',
+        '</td>'
+    ),
+    
+    
+    initTemplates : function() {
+        var templates = this.templates || {},
+            template, name,
+            
+            headerCellTpl = new Ext.Template(
+                '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">',
+                    '<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '',
+                        '{value}',
+                        '<img alt="" class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />',
+                    '</div>',
+                '</td>'
+            ),
+        
+            rowBodyText = [
+                '<tr class="x-grid3-row-body-tr" style="{bodyStyle}">',
+                    '<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">',
+                        '<div class="x-grid3-row-body">{body}</div>',
+                    '</td>',
+                '</tr>'
+            ].join(""),
+        
+            innerText = [
+                '<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+                     '<tbody>',
+                        '<tr>{cells}</tr>',
+                        this.enableRowBody ? rowBodyText : '',
+                     '</tbody>',
+                '</table>'
+            ].join("");
+        
+        Ext.applyIf(templates, {
+            hcell   : headerCellTpl,
+            cell    : this.cellTpl,
+            body    : this.bodyTpl,
+            header  : this.headerTpl,
+            master  : this.masterTpl,
+            row     : new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">' + innerText + '</div>'),
+            rowInner: new Ext.Template(innerText)
+        });
+
+        for (name in templates) {
+            template = templates[name];
+            
+            if (template && Ext.isFunction(template.compile) && !template.compiled) {
+                template.disableFormats = true;
+                template.compile();
+            }
+        }
+
+        this.templates = templates;
+        this.colRe = new RegExp('x-grid3-td-([^\\s]+)', '');
+    },
+
+    
+    fly : function(el) {
+        if (!this._flyweight) {
+            this._flyweight = new Ext.Element.Flyweight(document.body);
+        }
+        this._flyweight.dom = el;
+        return this._flyweight;
+    },
+
+    
+    getEditorParent : function() {
+        return this.scroller.dom;
+    },
+
+    
+    initElements : function() {
+        var Element  = Ext.Element,
+            el       = Ext.get(this.grid.getGridEl().dom.firstChild),
+            mainWrap = new Element(el.child('div.x-grid3-viewport')),
+            mainHd   = new Element(mainWrap.child('div.x-grid3-header')),
+            scroller = new Element(mainWrap.child('div.x-grid3-scroller'));
+        
+        if (this.grid.hideHeaders) {
+            mainHd.setDisplayed(false);
+        }
+        
+        if (this.forceFit) {
+            scroller.setStyle('overflow-x', 'hidden');
+        }
+        
+        
+        
+        Ext.apply(this, {
+            el      : el,
+            mainWrap: mainWrap,
+            scroller: scroller,
+            mainHd  : mainHd,
+            innerHd : mainHd.child('div.x-grid3-header-inner').dom,
+            mainBody: new Element(Element.fly(scroller).child('div.x-grid3-body')),
+            focusEl : new Element(Element.fly(scroller).child('a')),
+            
+            resizeMarker: new Element(el.child('div.x-grid3-resize-marker')),
+            resizeProxy : new Element(el.child('div.x-grid3-resize-proxy'))
+        });
+        
+        this.focusEl.swallowEvent('click', true);
+    },
+
+    
+    getRows : function() {
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    
+
+    
+    findCell : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth);
+    },
+
+    
+    findCellIndex : function(el, requiredCls) {
+        var cell = this.findCell(el),
+            hasCls;
+        
+        if (cell) {
+            hasCls = this.fly(cell).hasClass(requiredCls);
+            if (!requiredCls || hasCls) {
+                return this.getCellIndex(cell);
+            }
+        }
+        return false;
+    },
+
+    
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe);
+            
+            if (match && match[1]) {
+                return this.cm.getIndexById(match[1]);
+            }
+        }
+        return false;
+    },
+
+    
+    findHeaderCell : function(el) {
+        var cell = this.findCell(el);
+        return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null;
+    },
+
+    
+    findHeaderIndex : function(el){
+        return this.findCellIndex(el, this.hdCls);
+    },
+
+    
+    findRow : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth);
+    },
+
+    
+    findRowIndex : function(el) {
+        var row = this.findRow(el);
+        return row ? row.rowIndex : false;
+    },
+
+    
+    findRowBody : function(el) {
+        if (!el) {
+            return false;
+        }
+        
+        return this.fly(el).findParent(this.rowBodySelector, this.rowBodySelectorDepth);
+    },
+
+    
+
+    
+    getRow : function(row) {
+        return this.getRows()[row];
+    },
+
+    
+    getCell : function(row, col) {
+        return Ext.fly(this.getRow(row)).query(this.cellSelector)[col]; 
+    },
+
+    
+    getHeaderCell : function(index) {
+        return this.mainHd.dom.getElementsByTagName('td')[index];
+    },
+
+    
+
+    
+    addRowClass : function(rowId, cls) {
+        var row = this.getRow(rowId);
+        if (row) {
+            this.fly(row).addClass(cls);
+        }
+    },
+
+    
+    removeRowClass : function(row, cls) {
+        var r = this.getRow(row);
+        if(r){
+            this.fly(r).removeClass(cls);
+        }
+    },
+
+    
+    removeRow : function(row) {
+        Ext.removeNode(this.getRow(row));
+        this.syncFocusEl(row);
+    },
+
+    
+    removeRows : function(firstRow, lastRow) {
+        var bd = this.mainBody.dom,
+            rowIndex;
+            
+        for (rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            Ext.removeNode(bd.childNodes[firstRow]);
+        }
+        
+        this.syncFocusEl(firstRow);
+    },
+
+    
+    
+    
+    getScrollState : function() {
+        var sb = this.scroller.dom;
+        
+        return {
+            left: sb.scrollLeft, 
+            top : sb.scrollTop
+        };
+    },
+
+    
+    restoreScroll : function(state) {
+        var sb = this.scroller.dom;
+        sb.scrollLeft = state.left;
+        sb.scrollTop  = state.top;
+    },
+
+    
+    scrollToTop : function() {
+        var dom = this.scroller.dom;
+        
+        dom.scrollTop  = 0;
+        dom.scrollLeft = 0;
+    },
+
+    
+    syncScroll : function() {
+        this.syncHeaderScroll();
+        var mb = this.scroller.dom;
+        this.grid.fireEvent('bodyscroll', mb.scrollLeft, mb.scrollTop);
+    },
+
+    
+    syncHeaderScroll : function() {
+        var innerHd    = this.innerHd,
+            scrollLeft = this.scroller.dom.scrollLeft;
+        
+        innerHd.scrollLeft = scrollLeft;
+        innerHd.scrollLeft = scrollLeft; 
+    },
+    
+    
+    updateSortIcon : function(col, dir) {
+        var sortClasses = this.sortClasses,
+            sortClass   = sortClasses[dir == "DESC" ? 1 : 0],
+            headers     = this.mainHd.select('td').removeClass(sortClasses);
+        
+        headers.item(col).addClass(sortClass);
+    },
+
+    
+    updateAllColumnWidths : function() {
+        var totalWidth = this.getTotalWidth(),
+            colCount   = this.cm.getColumnCount(),
+            rows       = this.getRows(),
+            rowCount   = rows.length,
+            widths     = [],
+            row, rowFirstChild, trow, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            widths[i] = this.getColumnWidth(i);
+            this.getHeaderCell(i).style.width = widths[i];
+        }
+        
+        this.updateHeaderWidth();
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                trow = rowFirstChild.rows[0];
+                
+                for (j = 0; j < colCount; j++) {
+                    trow.childNodes[j].style.width = widths[j];
+                }
+            }
+        }
+        
+        this.onAllColumnWidthsUpdated(widths, totalWidth);
+    },
+
+    
+    updateColumnWidth : function(column, width) {
+        var columnWidth = this.getColumnWidth(column),
+            totalWidth  = this.getTotalWidth(),
+            headerCell  = this.getHeaderCell(column),
+            nodes       = this.getRows(),
+            nodeCount   = nodes.length,
+            row, i, firstChild;
+        
+        this.updateHeaderWidth();
+        headerCell.style.width = columnWidth;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            firstChild = row.firstChild;
+            
+            row.style.width = totalWidth;
+            if (firstChild) {
+                firstChild.style.width = totalWidth;
+                firstChild.rows[0].childNodes[column].style.width = columnWidth;
+            }
+        }
+        
+        this.onColumnWidthUpdated(column, columnWidth, totalWidth);
+    },
+    
+    
+    updateColumnHidden : function(col, hidden) {
+        var totalWidth = this.getTotalWidth(),
+            display    = hidden ? 'none' : '',
+            headerCell = this.getHeaderCell(col),
+            nodes      = this.getRows(),
+            nodeCount  = nodes.length,
+            row, rowFirstChild, i;
+        
+        this.updateHeaderWidth();
+        headerCell.style.display = display;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                rowFirstChild.rows[0].childNodes[col].style.display = display;
+            }
+        }
+        
+        this.onColumnHiddenUpdated(col, hidden, totalWidth);
+        delete this.lastViewWidth; 
+        this.layout();
+    },
+
+    
+    doRender : function(columns, records, store, startRow, colCount, stripe) {
+        var templates = this.templates,
+            cellTemplate = templates.cell,
+            rowTemplate = templates.row,
+            last = colCount - 1,
+            tstyle = 'width:' + this.getTotalWidth() + ';',
+            
+            rowBuffer = [],
+            colBuffer = [],
+            rowParams = {tstyle: tstyle},
+            meta = {},
+            len  = records.length,
+            alt,
+            column,
+            record, i, j, rowIndex;
+
+        
+        for (j = 0; j < len; j++) {
+            record    = records[j];
+            colBuffer = [];
+
+            rowIndex = j + startRow;
+
+            
+            for (i = 0; i < colCount; i++) {
+                column = columns[i];
+                
+                meta.id    = column.id;
+                meta.css   = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.style = column.style;
+                meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+
+                if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                    meta.css += ' x-grid3-dirty-cell';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+
+            alt = [];
+            
+            if (stripe && ((rowIndex + 1) % 2 === 0)) {
+                alt[0] = 'x-grid3-row-alt';
+            }
+
+            if (record.dirty) {
+                alt[1] = ' x-grid3-dirty-row';
+            }
+
+            rowParams.cols = colCount;
+
+            if (this.getRowClass) {
+                alt[2] = this.getRowClass(record, rowIndex, rowParams, store);
+            }
+
+            rowParams.alt   = alt.join(' ');
+            rowParams.cells = colBuffer.join('');
+
+            rowBuffer[rowBuffer.length] = rowTemplate.apply(rowParams);
+        }
+
+        return rowBuffer.join('');
+    },
+
+    
+    processRows : function(startRow, skipStripe) {
+        if (!this.ds || this.ds.getCount() < 1) {
+            return;
+        }
+
+        var rows   = this.getRows(),
+            length = rows.length,
+            row, i;
+
+        skipStripe = skipStripe || !this.grid.stripeRows;
+        startRow   = startRow   || 0;
+
+        for (i = 0; i < length; i++) {
+            row = rows[i];
+            if (row) {
+                row.rowIndex = i;
+                if (!skipStripe) {
+                    row.className = row.className.replace(this.rowClsRe, ' ');
+                    if ((i + 1) % 2 === 0){
+                        row.className += ' x-grid3-row-alt';
+                    }
+                }
+            }
+        }
+
+        
+        if (startRow === 0) {
+            Ext.fly(rows[0]).addClass(this.firstRowCls);
+        }
+
+        Ext.fly(rows[length - 1]).addClass(this.lastRowCls);
+    },
+    
+    
+    afterRender : function() {
+        if (!this.ds || !this.cm) {
+            return;
+        }
+        
+        this.mainBody.dom.innerHTML = this.renderBody() || '&#160;';
+        this.processRows(0, true);
+
+        if (this.deferEmptyText !== true) {
+            this.applyEmptyText();
+        }
+        
+        this.grid.fireEvent('viewready', this.grid);
+    },
+    
+    
+    afterRenderUI: function() {
+        var grid = this.grid;
+        
+        this.initElements();
+
+        
+        Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
+
+        this.mainHd.on({
+            scope    : this,
+            mouseover: this.handleHdOver,
+            mouseout : this.handleHdOut,
+            mousemove: this.handleHdMove
+        });
+
+        this.scroller.on('scroll', this.syncScroll,  this);
+        
+        if (grid.enableColumnResize !== false) {
+            this.splitZone = new Ext.grid.GridView.SplitDragZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableColumnMove) {
+            this.columnDrag = new Ext.grid.GridView.ColumnDragZone(grid, this.innerHd);
+            this.columnDrop = new Ext.grid.HeaderDropZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableHdMenu !== false) {
+            this.hmenu = new Ext.menu.Menu({id: grid.id + '-hctx'});
+            this.hmenu.add(
+                {itemId:'asc',  text: this.sortAscText,  cls: 'xg-hmenu-sort-asc'},
+                {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
+            );
+
+            if (grid.enableColumnHide !== false) {
+                this.colMenu = new Ext.menu.Menu({id:grid.id + '-hcols-menu'});
+                this.colMenu.on({
+                    scope     : this,
+                    beforeshow: this.beforeColMenuShow,
+                    itemclick : this.handleHdMenuClick
+                });
+                this.hmenu.add('-', {
+                    itemId:'columns',
+                    hideOnClick: false,
+                    text: this.columnsText,
+                    menu: this.colMenu,
+                    iconCls: 'x-cols-icon'
+                });
+            }
+
+            this.hmenu.on('itemclick', this.handleHdMenuClick, this);
+        }
+
+        if (grid.trackMouseOver) {
+            this.mainBody.on({
+                scope    : this,
+                mouseover: this.onRowOver,
+                mouseout : this.onRowOut
+            });
+        }
+
+        if (grid.enableDragDrop || grid.enableDrag) {
+            this.dragZone = new Ext.grid.GridDragZone(grid, {
+                ddGroup : grid.ddGroup || 'GridDD'
+            });
+        }
+
+        this.updateHeaderSortState();
+    },
+
+    
+    renderUI : function() {
+        var templates = this.templates;
+
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            header: this.renderHeaders(),
+            ostyle: 'width:' + this.getOffsetWidth() + ';',
+            bstyle: 'width:' + this.getTotalWidth()  + ';'
+        });
+    },
+
+    
+    processEvent : function(name, e) {
+        var target = e.getTarget(),
+            grid   = this.grid,
+            header = this.findHeaderIndex(target),
+            row, cell, col, body;
+
+        grid.fireEvent(name, e);
+
+        if (header !== false) {
+            grid.fireEvent('header' + name, grid, header, e);
+        } else {
+            row = this.findRowIndex(target);
+
+
+
+
+            if (row !== false) {
+                cell = this.findCellIndex(target);
+                if (cell !== false) {
+                    col = grid.colModel.getColumnAt(cell);
+                    if (grid.fireEvent('cell' + name, grid, row, cell, e) !== false) {
+                        if (!col || (col.processEvent && (col.processEvent(name, e, grid, row, cell) !== false))) {
+                            grid.fireEvent('row' + name, grid, row, e);
+                        }
+                    }
+                } else {
+                    if (grid.fireEvent('row' + name, grid, row, e) !== false) {
+                        (body = this.findRowBody(target)) && grid.fireEvent('rowbody' + name, grid, row, e);
+                    }
+                }
+            } else {
+                grid.fireEvent('container' + name, grid, e);
+            }
+        }
+    },
+
+    
+    layout : function(initial) {
+        if (!this.mainBody) {
+            return; 
+        }
+
+        var grid       = this.grid,
+            gridEl     = grid.getGridEl(),
+            gridSize   = gridEl.getSize(true),
+            gridWidth  = gridSize.width,
+            gridHeight = gridSize.height,
+            scroller   = this.scroller,
+            scrollStyle, headerHeight, scrollHeight;
+        
+        if (gridWidth < 20 || gridHeight < 20) {
+            return;
+        }
+        
+        if (grid.autoHeight) {
+            scrollStyle = scroller.dom.style;
+            scrollStyle.overflow = 'visible';
+            
+            if (Ext.isWebKit) {
+                scrollStyle.position = 'static';
+            }
+        } else {
+            this.el.setSize(gridWidth, gridHeight);
+            
+            headerHeight = this.mainHd.getHeight();
+            scrollHeight = gridHeight - headerHeight;
+            
+            scroller.setSize(gridWidth, scrollHeight);
+            
+            if (this.innerHd) {
+                this.innerHd.style.width = (gridWidth) + "px";
+            }
+        }
+        
+        if (this.forceFit || (initial === true && this.autoFill)) {
+            if (this.lastViewWidth != gridWidth) {
+                this.fitColumns(false, false);
+                this.lastViewWidth = gridWidth;
+            }
+        } else {
+            this.autoExpand();
+            this.syncHeaderScroll();
+        }
+        
+        this.onLayout(gridWidth, scrollHeight);
+    },
+
+    
+    
+    onLayout : function(vw, vh) {
+        
+    },
+
+    onColumnWidthUpdated : function(col, w, tw) {
+        
+    },
+
+    onAllColumnWidthsUpdated : function(ws, tw) {
+        
+    },
+
+    onColumnHiddenUpdated : function(col, hidden, tw) {
+        
+    },
+
+    updateColumnText : function(col, text) {
+        
+    },
+
+    afterMove : function(colIndex) {
+        
+    },
+
+    
+    
+    init : function(grid) {
+        this.grid = grid;
+
+        this.initTemplates();
+        this.initData(grid.store, grid.colModel);
+        this.initUI(grid);
+    },
+
+    
+    getColumnId : function(index){
+        return this.cm.getColumnId(index);
+    },
+
+    
+    getOffsetWidth : function() {
+        return (this.cm.getTotalWidth() + this.getScrollOffset()) + 'px';
+    },
+
+    
+    getScrollOffset: function() {
+        return Ext.num(this.scrollOffset, Ext.getScrollBarWidth());
+    },
+
+    
+    renderHeaders : function() {
+        var colModel   = this.cm,
+            templates  = this.templates,
+            headerTpl  = templates.hcell,
+            properties = {},
+            colCount   = colModel.getColumnCount(),
+            last       = colCount - 1,
+            cells      = [],
+            i, cssCls;
+        
+        for (i = 0; i < colCount; i++) {
+            if (i == 0) {
+                cssCls = 'x-grid3-cell-first ';
+            } else {
+                cssCls = i == last ? 'x-grid3-cell-last ' : '';
+            }
+            
+            properties = {
+                id     : colModel.getColumnId(i),
+                value  : colModel.getColumnHeader(i) || '',
+                style  : this.getColumnStyle(i, true),
+                css    : cssCls,
+                tooltip: this.getColumnTooltip(i)
+            };
+            
+            if (colModel.config[i].align == 'right') {
+                properties.istyle = 'padding-right: 16px;';
+            } else {
+                delete properties.istyle;
+            }
+            
+            cells[i] = headerTpl.apply(properties);
+        }
+        
+        return templates.header.apply({
+            cells : cells.join(""),
+            tstyle: String.format("width: {0};", this.getTotalWidth())
+        });
+    },
+
+    
+    getColumnTooltip : function(i) {
+        var tooltip = this.cm.getColumnTooltip(i);
+        if (tooltip) {
+            if (Ext.QuickTips.isEnabled()) {
+                return 'ext:qtip="' + tooltip + '"';
+            } else {
+                return 'title="' + tooltip + '"';
+            }
+        }
+        
+        return '';
+    },
+
+    
+    beforeUpdate : function() {
+        this.grid.stopEditing(true);
+    },
+
+    
+    updateHeaders : function() {
+        this.innerHd.firstChild.innerHTML = this.renderHeaders();
+        
+        this.updateHeaderWidth(false);
+    },
+    
+    
+    updateHeaderWidth: function(updateMain) {
+        var innerHdChild = this.innerHd.firstChild,
+            totalWidth   = this.getTotalWidth();
+        
+        innerHdChild.style.width = this.getOffsetWidth();
+        innerHdChild.firstChild.style.width = totalWidth;
+        
+        if (updateMain !== false) {
+            this.mainBody.dom.style.width = totalWidth;
+        }
+    },
+
+    
+    focusRow : function(row) {
+        this.focusCell(row, 0, false);
+    },
+
+    
+    focusCell : function(row, col, hscroll) {
+        this.syncFocusEl(this.ensureVisible(row, col, hscroll));
+        
+        var focusEl = this.focusEl;
+        
+        if (Ext.isGecko) {
+            focusEl.focus();
+        } else {
+            focusEl.focus.defer(1, focusEl);
+        }
+    },
+
+    
+    resolveCell : function(row, col, hscroll) {
+        if (!Ext.isNumber(row)) {
+            row = row.rowIndex;
+        }
+        
+        if (!this.ds) {
+            return null;
+        }
+        
+        if (row < 0 || row >= this.ds.getCount()) {
+            return null;
+        }
+        col = (col !== undefined ? col : 0);
+
+        var rowEl    = this.getRow(row),
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            cellEl;
+            
+        if (!(hscroll === false && col === 0)) {
+            while (col < colCount && colModel.isHidden(col)) {
+                col++;
+            }
+            
+            cellEl = this.getCell(row, col);
+        }
+
+        return {row: rowEl, cell: cellEl};
+    },
+
+    
+    getResolvedXY : function(resolved) {
+        if (!resolved) {
+            return null;
+        }
+        
+        var cell = resolved.cell,
+            row  = resolved.row;
+        
+        if (cell) {
+            return Ext.fly(cell).getXY();
+        } else {
+            return [this.el.getX(), Ext.fly(row).getY()];
+        }
+    },
+
+    
+    syncFocusEl : function(row, col, hscroll) {
+        var xy = row;
+        
+        if (!Ext.isArray(xy)) {
+            row = Math.min(row, Math.max(0, this.getRows().length-1));
+            
+            if (isNaN(row)) {
+                return;
+            }
+            
+            xy = this.getResolvedXY(this.resolveCell(row, col, hscroll));
+        }
+        
+        this.focusEl.setXY(xy || this.scroller.getXY());
+    },
+
+    
+    ensureVisible : function(row, col, hscroll) {
+        var resolved = this.resolveCell(row, col, hscroll);
+        
+        if (!resolved || !resolved.row) {
+            return null;
+        }
+
+        var rowEl  = resolved.row,
+            cellEl = resolved.cell,
+            c = this.scroller.dom,
+            p = rowEl,
+            ctop = 0,
+            stop = this.el.dom;
+
+        while (p && p != stop) {
+            ctop += p.offsetTop;
+            p = p.offsetParent;
+        }
+
+        ctop -= this.mainHd.dom.offsetHeight;
+        stop = parseInt(c.scrollTop, 10);
+
+        var cbot = ctop + rowEl.offsetHeight,
+            ch = c.clientHeight,
+            sbot = stop + ch;
+
+
+        if (ctop < stop) {
+          c.scrollTop = ctop;
+        } else if(cbot > sbot) {
+            c.scrollTop = cbot-ch;
+        }
+
+        if (hscroll !== false) {
+            var cleft  = parseInt(cellEl.offsetLeft, 10),
+                cright = cleft + cellEl.offsetWidth,
+                sleft  = parseInt(c.scrollLeft, 10),
+                sright = sleft + c.clientWidth;
+                
+            if (cleft < sleft) {
+                c.scrollLeft = cleft;
+            } else if(cright > sright) {
+                c.scrollLeft = cright-c.clientWidth;
+            }
+        }
+        
+        return this.getResolvedXY(resolved);
+    },
+
+    
+    insertRows : function(dm, firstRow, lastRow, isUpdate) {
+        var last = dm.getCount() - 1;
+        if( !isUpdate && firstRow === 0 && lastRow >= last) {
+            this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+                this.refresh();
+            this.fireEvent('rowsinserted', this, firstRow, lastRow);
+        } else {
+            if (!isUpdate) {
+                this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+            }
+            var html = this.renderRows(firstRow, lastRow),
+                before = this.getRow(firstRow);
+            if (before) {
+                if(firstRow === 0){
+                    Ext.fly(this.getRow(0)).removeClass(this.firstRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeBegin', before, html);
+            } else {
+                var r = this.getRow(last - 1);
+                if(r){
+                    Ext.fly(r).removeClass(this.lastRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html);
+            }
+            if (!isUpdate) {
+                this.processRows(firstRow);
+                this.fireEvent('rowsinserted', this, firstRow, lastRow);
+            } else if (firstRow === 0 || firstRow >= last) {
+                
+                Ext.fly(this.getRow(firstRow)).addClass(firstRow === 0 ? this.firstRowCls : this.lastRowCls);
+            }
+        }
+        this.syncFocusEl(firstRow);
+    },
+
+    
+    deleteRows : function(dm, firstRow, lastRow) {
+        if (dm.getRowCount() < 1) {
+            this.refresh();
+        } else {
+            this.fireEvent('beforerowsdeleted', this, firstRow, lastRow);
+
+            this.removeRows(firstRow, lastRow);
+
+            this.processRows(firstRow);
+            this.fireEvent('rowsdeleted', this, firstRow, lastRow);
+        }
+    },
+
+    
+    getColumnStyle : function(colIndex, isHeader) {
+        var colModel  = this.cm,
+            colConfig = colModel.config,
+            style     = isHeader ? '' : colConfig[colIndex].css || '',
+            align     = colConfig[colIndex].align;
+        
+        style += String.format("width: {0};", this.getColumnWidth(colIndex));
+        
+        if (colModel.isHidden(colIndex)) {
+            style += 'display: none; ';
+        }
+        
+        if (align) {
+            style += String.format("text-align: {0};", align);
+        }
+        
+        return style;
+    },
+
+    
+    getColumnWidth : function(column) {
+        var columnWidth = this.cm.getColumnWidth(column),
+            borderWidth = this.borderWidth;
+        
+        if (Ext.isNumber(columnWidth)) {
+            if (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2)) {
+                return columnWidth + "px";
+            } else {
+                return Math.max(columnWidth - borderWidth, 0) + "px";
+            }
+        } else {
+            return columnWidth;
+        }
+    },
+
+    
+    getTotalWidth : function() {
+        return this.cm.getTotalWidth() + 'px';
+    },
+
+    
+    fitColumns : function(preventRefresh, onlyExpand, omitColumn) {
+        var grid          = this.grid,
+            colModel      = this.cm,
+            totalColWidth = colModel.getTotalWidth(false),
+            gridWidth     = this.getGridInnerWidth(),
+            extraWidth    = gridWidth - totalColWidth,
+            columns       = [],
+            extraCol      = 0,
+            width         = 0,
+            colWidth, fraction, i;
+        
+        
+        if (gridWidth < 20 || extraWidth === 0) {
+            return false;
+        }
+        
+        var visibleColCount = colModel.getColumnCount(true),
+            totalColCount   = colModel.getColumnCount(false),
+            adjCount        = visibleColCount - (Ext.isNumber(omitColumn) ? 1 : 0);
+        
+        if (adjCount === 0) {
+            adjCount = 1;
+            omitColumn = undefined;
+        }
+        
+        
+        for (i = 0; i < totalColCount; i++) {
+            if (!colModel.isFixed(i) && i !== omitColumn) {
+                colWidth = colModel.getColumnWidth(i);
+                columns.push(i, colWidth);
+                
+                if (!colModel.isHidden(i)) {
+                    extraCol = i;
+                    width += colWidth;
+                }
+            }
+        }
+        
+        fraction = (gridWidth - colModel.getTotalWidth()) / width;
+        
+        while (columns.length) {
+            colWidth = columns.pop();
+            i        = columns.pop();
+            
+            colModel.setColumnWidth(i, Math.max(grid.minColumnWidth, Math.floor(colWidth + colWidth * fraction)), true);
+        }
+        
+        
+        totalColWidth = colModel.getTotalWidth(false);
+        
+        if (totalColWidth > gridWidth) {
+            var adjustCol = (adjCount == visibleColCount) ? extraCol : omitColumn,
+                newWidth  = Math.max(1, colModel.getColumnWidth(adjustCol) - (totalColWidth - gridWidth));
+            
+            colModel.setColumnWidth(adjustCol, newWidth, true);
+        }
+        
+        if (preventRefresh !== true) {
+            this.updateAllColumnWidths();
+        }
+        
+        return true;
+    },
+
+    
+    autoExpand : function(preventUpdate) {
+        var grid             = this.grid,
+            colModel         = this.cm,
+            gridWidth        = this.getGridInnerWidth(),
+            totalColumnWidth = colModel.getTotalWidth(false),
+            autoExpandColumn = grid.autoExpandColumn;
+        
+        if (!this.userResized && autoExpandColumn) {
+            if (gridWidth != totalColumnWidth) {
+                
+                var colIndex     = colModel.getIndexById(autoExpandColumn),
+                    currentWidth = colModel.getColumnWidth(colIndex),
+                    desiredWidth = gridWidth - totalColumnWidth + currentWidth,
+                    newWidth     = Math.min(Math.max(desiredWidth, grid.autoExpandMin), grid.autoExpandMax);
+                
+                if (currentWidth != newWidth) {
+                    colModel.setColumnWidth(colIndex, newWidth, true);
+                    
+                    if (preventUpdate !== true) {
+                        this.updateColumnWidth(colIndex, newWidth);
+                    }
+                }
+            }
+        }
+    },
+    
+    
+    getGridInnerWidth: function() {
+        return this.grid.getGridEl().getWidth(true) - this.getScrollOffset();
+    },
+
+    
+    getColumnData : function() {
+        var columns  = [],
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            fields   = this.ds.fields,
+            i, name;
+        
+        for (i = 0; i < colCount; i++) {
+            name = colModel.getDataIndex(i);
+            
+            columns[i] = {
+                name    : Ext.isDefined(name) ? name : (fields.get(i) ? fields.get(i).name : undefined),
+                renderer: colModel.getRenderer(i),
+                scope   : colModel.getRendererScope(i),
+                id      : colModel.getColumnId(i),
+                style   : this.getColumnStyle(i)
+            };
+        }
+        
+        return columns;
+    },
+
+    
+    renderRows : function(startRow, endRow) {
+        var grid     = this.grid,
+            store    = grid.store,
+            stripe   = grid.stripeRows,
+            colModel = grid.colModel,
+            colCount = colModel.getColumnCount(),
+            rowCount = store.getCount(),
+            records;
+        
+        if (rowCount < 1) {
+            return '';
+        }
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        records  = store.getRange(startRow, endRow);
+        
+        return this.doRender(this.getColumnData(), records, store, startRow, colCount, stripe);
+    },
+
+    
+    renderBody : function(){
+        var markup = this.renderRows() || '&#160;';
+        return this.templates.body.apply({rows: markup});
+    },
+
+    
+    refreshRow: function(record) {
+        var store     = this.ds,
+            colCount  = this.cm.getColumnCount(),
+            columns   = this.getColumnData(),
+            last      = colCount - 1,
+            cls       = ['x-grid3-row'],
+            rowParams = {
+                tstyle: String.format("width: {0};", this.getTotalWidth())
+            },
+            colBuffer = [],
+            cellTpl   = this.templates.cell,
+            rowIndex, row, column, meta, css, i;
+        
+        if (Ext.isNumber(record)) {
+            rowIndex = record;
+            record   = store.getAt(rowIndex);
+        } else {
+            rowIndex = store.indexOf(record);
+        }
+        
+        
+        if (!record || rowIndex < 0) {
+            return;
+        }
+        
+        
+        for (i = 0; i < colCount; i++) {
+            column = columns[i];
+            
+            if (i == 0) {
+                css = 'x-grid3-cell-first';
+            } else {
+                css = (i == last) ? 'x-grid3-cell-last ' : '';
+            }
+            
+            meta = {
+                id      : column.id,
+                style   : column.style,
+                css     : css,
+                attr    : "",
+                cellAttr: ""
+            };
+            
+            meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+            
+            if (Ext.isEmpty(meta.value)) {
+                meta.value = '&#160;';
+            }
+            
+            if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                meta.css += ' x-grid3-dirty-cell';
+            }
+            
+            colBuffer[i] = cellTpl.apply(meta);
+        }
+        
+        row = this.getRow(rowIndex);
+        row.className = '';
+        
+        if (this.grid.stripeRows && ((rowIndex + 1) % 2 === 0)) {
+            cls.push('x-grid3-row-alt');
+        }
+        
+        if (this.getRowClass) {
+            rowParams.cols = colCount;
+            cls.push(this.getRowClass(record, rowIndex, rowParams, store));
+        }
+        
+        this.fly(row).addClass(cls).setStyle(rowParams.tstyle);
+        rowParams.cells = colBuffer.join("");
+        row.innerHTML = this.templates.rowInner.apply(rowParams);
+        
+        this.fireEvent('rowupdated', this, rowIndex, record);
+    },
+
+    
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getTotalWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+
+    
+    applyEmptyText : function() {
+        if (this.emptyText && !this.hasRows()) {
+            this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
+        }
+    },
+
+    
+    updateHeaderSortState : function() {
+        var state = this.ds.getSortState();
+        if (!state) {
+            return;
+        }
+
+        if (!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)) {
+            this.grid.fireEvent('sortchange', this.grid, state);
+        }
+
+        this.sortState = state;
+
+        var sortColumn = this.cm.findColumnIndex(state.field);
+        if (sortColumn != -1) {
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    
+    clearHeaderSortState : function() {
+        if (!this.sortState) {
+            return;
+        }
+        this.grid.fireEvent('sortchange', this.grid, null);
+        this.mainHd.select('td').removeClass(this.sortClasses);
+        delete this.sortState;
+    },
+
+    
+    destroy : function() {
+        var me              = this,
+            grid            = me.grid,
+            gridEl          = grid.getGridEl(),
+            dragZone        = me.dragZone,
+            splitZone       = me.splitZone,
+            columnDrag      = me.columnDrag,
+            columnDrop      = me.columnDrop,
+            scrollToTopTask = me.scrollToTopTask,
+            columnDragData,
+            columnDragProxy;
+        
+        if (scrollToTopTask && scrollToTopTask.cancel) {
+            scrollToTopTask.cancel();
+        }
+        
+        Ext.destroyMembers(me, 'colMenu', 'hmenu');
+
+        me.initData(null, null);
+        me.purgeListeners();
+        
+        Ext.fly(me.innerHd).un("click", me.handleHdDown, me);
+
+        if (grid.enableColumnMove) {
+            columnDragData = columnDrag.dragData;
+            columnDragProxy = columnDrag.proxy;
+            Ext.destroy(
+                columnDrag.el,
+                columnDragProxy.ghost,
+                columnDragProxy.el,
+                columnDrop.el,
+                columnDrop.proxyTop,
+                columnDrop.proxyBottom,
+                columnDragData.ddel,
+                columnDragData.header
+            );
+            
+            if (columnDragProxy.anim) {
+                Ext.destroy(columnDragProxy.anim);
+            }
+            
+            delete columnDragProxy.ghost;
+            delete columnDragData.ddel;
+            delete columnDragData.header;
+            columnDrag.destroy();
+            
+            delete Ext.dd.DDM.locationCache[columnDrag.id];
+            delete columnDrag._domRef;
+
+            delete columnDrop.proxyTop;
+            delete columnDrop.proxyBottom;
+            columnDrop.destroy();
+            delete Ext.dd.DDM.locationCache["gridHeader" + gridEl.id];
+            delete columnDrop._domRef;
+            delete Ext.dd.DDM.ids[columnDrop.ddGroup];
+        }
+
+        if (splitZone) { 
+            splitZone.destroy();
+            delete splitZone._domRef;
+            delete Ext.dd.DDM.ids["gridSplitters" + gridEl.id];
+        }
+
+        Ext.fly(me.innerHd).removeAllListeners();
+        Ext.removeNode(me.innerHd);
+        delete me.innerHd;
+
+        Ext.destroy(
+            me.el,
+            me.mainWrap,
+            me.mainHd,
+            me.scroller,
+            me.mainBody,
+            me.focusEl,
+            me.resizeMarker,
+            me.resizeProxy,
+            me.activeHdBtn,
+            me._flyweight,
+            dragZone,
+            splitZone
+        );
+
+        delete grid.container;
+
+        if (dragZone) {
+            dragZone.destroy();
+        }
+
+        Ext.dd.DDM.currentTarget = null;
+        delete Ext.dd.DDM.locationCache[gridEl.id];
+
+        Ext.EventManager.removeResizeListener(me.onWindowResize, me);
+    },
+
+    
+    onDenyColumnHide : function() {
+
+    },
+
+    
+    render : function() {
+        if (this.autoFill) {
+            var ct = this.grid.ownerCt;
+            
+            if (ct && ct.getLayout()) {
+                ct.on('afterlayout', function() {
+                    this.fitColumns(true, true);
+                    this.updateHeaders();
+                    this.updateHeaderSortState();
+                }, this, {single: true});
+            }
+        } else if (this.forceFit) {
+            this.fitColumns(true, false);
+        } else if (this.grid.autoExpandColumn) {
+            this.autoExpand(true);
+        }
+        
+        this.grid.getGridEl().dom.innerHTML = this.renderUI();
+        
+        this.afterRenderUI();
+    },
+
+    
+    
+    
+    initData : function(newStore, newColModel) {
+        var me = this;
+        
+        if (me.ds) {
+            var oldStore = me.ds;
+            
+            oldStore.un('add', me.onAdd, me);
+            oldStore.un('load', me.onLoad, me);
+            oldStore.un('clear', me.onClear, me);
+            oldStore.un('remove', me.onRemove, me);
+            oldStore.un('update', me.onUpdate, me);
+            oldStore.un('datachanged', me.onDataChange, me);
+            
+            if (oldStore !== newStore && oldStore.autoDestroy) {
+                oldStore.destroy();
+            }
+        }
+        
+        if (newStore) {
+            newStore.on({
+                scope      : me,
+                load       : me.onLoad,
+                add        : me.onAdd,
+                remove     : me.onRemove,
+                update     : me.onUpdate,
+                clear      : me.onClear,
+                datachanged: me.onDataChange
+            });
+        }
+        
+        if (me.cm) {
+            var oldColModel = me.cm;
+            
+            oldColModel.un('configchange', me.onColConfigChange, me);
+            oldColModel.un('widthchange',  me.onColWidthChange, me);
+            oldColModel.un('headerchange', me.onHeaderChange, me);
+            oldColModel.un('hiddenchange', me.onHiddenChange, me);
+            oldColModel.un('columnmoved',  me.onColumnMove, me);
+        }
+        
+        if (newColModel) {
+            delete me.lastViewWidth;
+            
+            newColModel.on({
+                scope       : me,
+                configchange: me.onColConfigChange,
+                widthchange : me.onColWidthChange,
+                headerchange: me.onHeaderChange,
+                hiddenchange: me.onHiddenChange,
+                columnmoved : me.onColumnMove
+            });
+        }
+        
+        me.ds = newStore;
+        me.cm = newColModel;
+    },
+
+    
+    onDataChange : function(){
+        this.refresh(true);
+        this.updateHeaderSortState();
+        this.syncFocusEl(0);
+    },
+
+    
+    onClear : function() {
+        this.refresh();
+        this.syncFocusEl(0);
+    },
+
+    
+    onUpdate : function(store, record) {
+        this.refreshRow(record);
+    },
+
+    
+    onAdd : function(store, records, index) {
+        this.insertRows(store, index, index + (records.length-1));
+    },
+
+    
+    onRemove : function(store, record, index, isUpdate) {
+        if (isUpdate !== true) {
+            this.fireEvent('beforerowremoved', this, index, record);
+        }
+        
+        this.removeRow(index);
+        
+        if (isUpdate !== true) {
+            this.processRows(index);
+            this.applyEmptyText();
+            this.fireEvent('rowremoved', this, index, record);
+        }
+    },
+
+    
+    onLoad : function() {
+        if (Ext.isGecko) {
+            if (!this.scrollToTopTask) {
+                this.scrollToTopTask = new Ext.util.DelayedTask(this.scrollToTop, this);
+            }
+            this.scrollToTopTask.delay(1);
+        } else {
+            this.scrollToTop();
+        }
+    },
+
+    
+    onColWidthChange : function(cm, col, width) {
+        this.updateColumnWidth(col, width);
+    },
+
+    
+    onHeaderChange : function(cm, col, text) {
+        this.updateHeaders();
+    },
+
+    
+    onHiddenChange : function(cm, col, hidden) {
+        this.updateColumnHidden(col, hidden);
+    },
+
+    
+    onColumnMove : function(cm, oldIndex, newIndex) {
+        this.indexMap = null;
+        this.refresh(true);
+        this.restoreScroll(this.getScrollState());
+        
+        this.afterMove(newIndex);
+        this.grid.fireEvent('columnmove', oldIndex, newIndex);
+    },
+
+    
+    onColConfigChange : function() {
+        delete this.lastViewWidth;
+        this.indexMap = null;
+        this.refresh(true);
+    },
+
+    
+    
+    initUI : function(grid) {
+        grid.on('headerclick', this.onHeaderClick, this);
+    },
+
+    
+    initEvents : Ext.emptyFn,
+
+    
+    onHeaderClick : function(g, index) {
+        if (this.headersDisabled || !this.cm.isSortable(index)) {
+            return;
+        }
+        g.stopEditing(true);
+        g.store.sort(this.cm.getDataIndex(index));
+    },
+
+    
+    onRowOver : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false) {
+            this.addRowClass(row, this.rowOverCls);
+        }
+    },
+
+    
+    onRowOut : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false && !e.within(this.getRow(row), true)) {
+            this.removeRowClass(row, this.rowOverCls);
+        }
+    },
+
+    
+    onRowSelect : function(row) {
+        this.addRowClass(row, this.selectedRowClass);
+    },
+
+    
+    onRowDeselect : function(row) {
+        this.removeRowClass(row, this.selectedRowClass);
+    },
+
+    
+    onCellSelect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).addClass('x-grid3-cell-selected');
+        }
+    },
+
+    
+    onCellDeselect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).removeClass('x-grid3-cell-selected');
+        }
+    },
+
+    
+    handleWheel : function(e) {
+        e.stopPropagation();
+    },
+
+    
+    onColumnSplitterMoved : function(cellIndex, width) {
+        this.userResized = true;
+        this.grid.colModel.setColumnWidth(cellIndex, width, true);
+
+        if (this.forceFit) {
+            this.fitColumns(true, false, cellIndex);
+            this.updateAllColumnWidths();
+        } else {
+            this.updateColumnWidth(cellIndex, width);
+            this.syncHeaderScroll();
+        }
+
+        this.grid.fireEvent('columnresize', cellIndex, width);
+    },
+
+    
+    beforeColMenuShow : function() {
+        var colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            colMenu  = this.colMenu,
+            i;
+
+        colMenu.removeAll();
+
+        for (i = 0; i < colCount; i++) {
+            if (colModel.config[i].hideable !== false) {
+                colMenu.add(new Ext.menu.CheckItem({
+                    text       : colModel.getColumnHeader(i),
+                    itemId     : 'col-' + colModel.getColumnId(i),
+                    checked    : !colModel.isHidden(i),
+                    disabled   : colModel.config[i].hideable === false,
+                    hideOnClick: false
+                }));
+            }
+        }
+    },
+    
+    
+    handleHdMenuClick : function(item) {
+        var store     = this.ds,
+            dataIndex = this.cm.getDataIndex(this.hdCtxIndex);
+
+        switch (item.getItemId()) {
+            case 'asc':
+                store.sort(dataIndex, 'ASC');
+                break;
+            case 'desc':
+                store.sort(dataIndex, 'DESC');
+                break;
+            default:
+                this.handleHdMenuClickDefault(item);
+        }
+        return true;
+    },
+    
+    
+    handleHdMenuClickDefault: function(item) {
+        var colModel = this.cm,
+            itemId   = item.getItemId(),
+            index    = colModel.getIndexById(itemId.substr(4));
+
+        if (index != -1) {
+            if (item.checked && colModel.getColumnsBy(this.isHideableColumn, this).length <= 1) {
+                this.onDenyColumnHide();
+                return;
+            }
+            colModel.setHidden(index, item.checked);
+        }
+    },
+
+    
+    handleHdDown : function(e, target) {
+        if (Ext.fly(target).hasClass('x-grid3-hd-btn')) {
+            e.stopEvent();
+            
+            var colModel  = this.cm,
+                header    = this.findHeaderCell(target),
+                index     = this.getCellIndex(header),
+                sortable  = colModel.isSortable(index),
+                menu      = this.hmenu,
+                menuItems = menu.items,
+                menuCls   = this.headerMenuOpenCls;
+            
+            this.hdCtxIndex = index;
+            
+            Ext.fly(header).addClass(menuCls);
+            menuItems.get('asc').setDisabled(!sortable);
+            menuItems.get('desc').setDisabled(!sortable);
+            
+            menu.on('hide', function() {
+                Ext.fly(header).removeClass(menuCls);
+            }, this, {single:true});
+            
+            menu.show(target, 'tl-bl?');
+        }
+    },
+
+    
+    handleHdMove : function(e) {
+        var header = this.findHeaderCell(this.activeHdRef);
+        
+        if (header && !this.headersDisabled) {
+            var handleWidth  = this.splitHandleWidth || 5,
+                activeRegion = this.activeHdRegion,
+                headerStyle  = header.style,
+                colModel     = this.cm,
+                cursor       = '',
+                pageX        = e.getPageX();
+                
+            if (this.grid.enableColumnResize !== false) {
+                var activeHeaderIndex = this.activeHdIndex,
+                    previousVisible   = this.getPreviousVisible(activeHeaderIndex),
+                    currentResizable  = colModel.isResizable(activeHeaderIndex),
+                    previousResizable = previousVisible && colModel.isResizable(previousVisible),
+                    inLeftResizer     = pageX - activeRegion.left <= handleWidth,
+                    inRightResizer    = activeRegion.right - pageX <= (!this.activeHdBtn ? handleWidth : 2);
+                
+                if (inLeftResizer && previousResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'e-resize' : 'col-resize'; 
+                } else if (inRightResizer && currentResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'w-resize' : 'col-resize';
+                }
+            }
+            
+            headerStyle.cursor = cursor;
+        }
+    },
+    
+    
+    getPreviousVisible: function(index) {
+        while (index > 0) {
+            if (!this.cm.isHidden(index - 1)) {
+                return index;
+            }
+            index--;
+        }
+        return undefined;
+    },
+
+    
+    handleHdOver : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && !this.headersDisabled) {
+            var fly = this.fly(header);
+            
+            this.activeHdRef = target;
+            this.activeHdIndex = this.getCellIndex(header);
+            this.activeHdRegion = fly.getRegion();
+            
+            if (!this.isMenuDisabled(this.activeHdIndex, fly)) {
+                fly.addClass('x-grid3-hd-over');
+                this.activeHdBtn = fly.child('.x-grid3-hd-btn');
+                
+                if (this.activeHdBtn) {
+                    this.activeHdBtn.dom.style.height = (header.firstChild.offsetHeight - 1) + 'px';
+                }
+            }
+        }
+    },
+
+    
+    handleHdOut : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && (!Ext.isIE || !e.within(header, true))) {
+            this.activeHdRef = null;
+            this.fly(header).removeClass('x-grid3-hd-over');
+            header.style.cursor = '';
+        }
+    },
+    
+    
+    isMenuDisabled: function(cellIndex, el) {
+        return this.cm.isMenuDisabled(cellIndex);
+    },
+
+    
+    hasRows : function() {
+        var fc = this.mainBody.dom.firstChild;
+        return fc && fc.nodeType == 1 && fc.className != 'x-grid-empty';
+    },
+    
+    
+    isHideableColumn : function(c) {
+        return !c.hidden;
+    },
+
+    
+    bind : function(d, c) {
+        this.initData(d, c);
+    }
+});
+
+
+
+
+Ext.grid.GridView.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+
+    constructor: function(grid, hd){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.marker = this.view.resizeMarker;
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,
+            'gridSplitters' + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.scroll = false;
+        this.hw = this.view.splitHandleWidth || 5;
+    },
+
+    b4StartDrag : function(x, y){
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var h = this.view.mainWrap.getHeight();
+        this.marker.setHeight(h);
+        this.marker.show();
+        this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);
+        this.proxy.setHeight(h);
+        var w = this.cm.getColumnWidth(this.cellIndex),
+            minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+    allowHeaderDrag : function(e){
+        return true;
+    },
+
+    handleMouseDown : function(e){
+        var t = this.view.findHeaderCell(e.getTarget());
+        if(t && this.allowHeaderDrag(e)){
+            var xy = this.view.fly(t).getXY(), 
+                x = xy[0],
+                exy = e.getXY(), 
+                ex = exy[0],
+                w = t.offsetWidth, 
+                adjust = false;
+                
+            if((ex - x) <= this.hw){
+                adjust = -1;
+            }else if((x+w) - ex <= this.hw){
+                adjust = 0;
+            }
+            if(adjust !== false){
+                this.cm = this.grid.colModel;
+                var ci = this.view.getCellIndex(t);
+                if(adjust == -1){
+                  if (ci + adjust < 0) {
+                    return;
+                  }
+                    while(this.cm.isHidden(ci+adjust)){
+                        --adjust;
+                        if(ci+adjust < 0){
+                            return;
+                        }
+                    }
+                }
+                this.cellIndex = ci+adjust;
+                this.split = t.dom;
+                if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                    Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+                }
+            }else if(this.view.columnDrag){
+                this.view.columnDrag.callHandleMouseDown(e);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.marker.hide();
+        var v = this.view,
+            endX = Math.max(this.minX, e.getPageX()),
+            diff = endX - this.startPos,
+            disabled = this.dragHeadersDisabled;
+            
+        v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
+
+Ext.grid.PivotGridView = Ext.extend(Ext.grid.GridView, {
+    
+    
+    colHeaderCellCls: 'grid-hd-group-cell',
+    
+    
+    title: '',
+    
+    
+    
+    
+    getColumnHeaders: function() {
+        return this.grid.topAxis.buildHeaders();;
+    },
+    
+    
+    getRowHeaders: function() {
+        return this.grid.leftAxis.buildHeaders();
+    },
+    
+    
+    renderRows : function(startRow, endRow) {
+        var grid          = this.grid,
+            rows          = grid.extractData(),
+            rowCount      = rows.length,
+            templates     = this.templates,
+            renderer      = grid.renderer,
+            hasRenderer   = typeof renderer == 'function',
+            getCellCls    = this.getCellCls,
+            hasGetCellCls = typeof getCellCls == 'function',
+            cellTemplate  = templates.cell,
+            rowTemplate   = templates.row,
+            rowBuffer     = [],
+            meta          = {},
+            tstyle        = 'width:' + this.getGridInnerWidth() + 'px;',
+            colBuffer, colCount, column, i, row;
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            colCount  = row.length;
+            colBuffer = [];
+            
+            
+            for (var j = 0; j < colCount; j++) {
+                
+                meta.id    = i + '-' + j;
+                meta.css   = j === 0 ? 'x-grid3-cell-first ' : (j == (colCount - 1) ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.value = row[j];
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+                
+                if (hasRenderer) {
+                    meta.value = renderer(meta.value);
+                }
+                
+                if (hasGetCellCls) {
+                    meta.css += getCellCls(meta.value) + ' ';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+            
+            rowBuffer[rowBuffer.length] = rowTemplate.apply({
+                tstyle: tstyle,
+                cols  : colCount,
+                cells : colBuffer.join(""),
+                alt   : ''
+            });
+        }
+        
+        return rowBuffer.join("");
+    },
+    
+    
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3 x-pivotgrid" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-title"><span>{title}</span></div>',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}"></div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-row-headers"></div>',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    
+    initTemplates: function() {
+        Ext.grid.PivotGridView.superclass.initTemplates.apply(this, arguments);
+        
+        var templates = this.templates || {};
+        if (!templates.gcell) {
+            templates.gcell = new Ext.XTemplate(
+                '<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} ' + this.colHeaderCellCls + '" style="{style}">',
+                    '<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '', '{value}',
+                    '</div>',
+                '</td>'
+            );
+        }
+        
+        this.templates = templates;
+        this.hrowRe = new RegExp("ux-grid-hd-group-row-(\\d+)", "");
+    },
+    
+    
+    initElements: function() {
+        Ext.grid.PivotGridView.superclass.initElements.apply(this, arguments);
+        
+        
+        this.rowHeadersEl = new Ext.Element(this.scroller.child('div.x-grid3-row-headers'));
+        
+        
+        this.headerTitleEl = new Ext.Element(this.mainHd.child('div.x-grid3-header-title'));
+    },
+    
+    
+    getGridInnerWidth: function() {
+        var previousWidth = Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this, arguments);
+        
+        return previousWidth - this.getTotalRowHeaderWidth();
+    },
+    
+    
+    getTotalRowHeaderWidth: function() {
+        var headers = this.getRowHeaders(),
+            length  = headers.length,
+            total   = 0,
+            i;
+        
+        for (i = 0; i< length; i++) {
+            total += headers[i].width;
+        }
+        
+        return total;
+    },
+    
+    
+    getTotalColumnHeaderHeight: function() {
+        return this.getColumnHeaders().length * 21;
+    },
+    
+    
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe),
+                data;
+ 
+            if (match && (data = match[1])) {
+                return parseInt(data.split('-')[1], 10);
+            }
+        }
+        return false;
+    },
+    
+    
+    
+    renderUI : function() {
+        var templates  = this.templates,
+            innerWidth = this.getGridInnerWidth();
+            
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            ostyle: 'width:' + innerWidth + 'px',
+            bstyle: 'width:' + innerWidth + 'px'
+        });
+    },
+    
+    
+    onLayout: function(width, height) {
+        Ext.grid.PivotGridView.superclass.onLayout.apply(this, arguments);
+        
+        var width = this.getGridInnerWidth();
+        
+        this.resizeColumnHeaders(width);
+        this.resizeAllRows(width);
+    },
+    
+    
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+        
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getGridInnerWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+    
+    
+    renderHeaders: Ext.emptyFn,
+    
+    
+    fitColumns: Ext.emptyFn,
+    
+    
+    resizeColumnHeaders: function(width) {
+        var topAxis = this.grid.topAxis;
+        
+        if (topAxis.rendered) {
+            topAxis.el.setWidth(width);
+        }
+    },
+    
+    
+    resizeRowHeaders: function() {
+        var rowHeaderWidth = this.getTotalRowHeaderWidth(),
+            marginStyle    = String.format("margin-left: {0}px;", rowHeaderWidth);
+        
+        this.rowHeadersEl.setWidth(rowHeaderWidth);
+        this.mainBody.applyStyles(marginStyle);
+        Ext.fly(this.innerHd).applyStyles(marginStyle);
+        
+        this.headerTitleEl.setWidth(rowHeaderWidth);
+        this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight());
+    },
+    
+    
+    resizeAllRows: function(width) {
+        var rows   = this.getRows(),
+            length = rows.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            Ext.fly(rows[i]).setWidth(width);
+            Ext.fly(rows[i]).child('table').setWidth(width);
+        }
+    },
+    
+    
+    updateHeaders: function() {
+        this.renderGroupRowHeaders();
+        this.renderGroupColumnHeaders();
+    },
+    
+    
+    renderGroupRowHeaders: function() {
+        var leftAxis = this.grid.leftAxis;
+        
+        this.resizeRowHeaders();
+        leftAxis.rendered = false;
+        leftAxis.render(this.rowHeadersEl);
+        
+        this.setTitle(this.title);
+    },
+    
+    
+    setTitle: function(title) {
+        this.headerTitleEl.child('span').dom.innerHTML = title;
+    },
+    
+    
+    renderGroupColumnHeaders: function() {
+        var topAxis = this.grid.topAxis;
+        
+        topAxis.rendered = false;
+        topAxis.render(this.innerHd.firstChild);
+    },
+    
+    
+    isMenuDisabled: function(cellIndex, el) {
+        return true;
+    }
+});
+Ext.grid.PivotAxis = Ext.extend(Ext.Component, {
+    
+    orientation: 'horizontal',
+    
+    
+    defaultHeaderWidth: 80,
+    
+    
+    paddingWidth: 7,
+    
+    
+    setDimensions: function(dimensions) {
+        this.dimensions = dimensions;
+    },
+    
+    
+    onRender: function(ct, position) {
+        var rows = this.orientation == 'horizontal'
+                 ? this.renderHorizontalRows()
+                 : this.renderVerticalRows();
+        
+        this.el = Ext.DomHelper.overwrite(ct.dom, {tag: 'table', cn: rows}, true);
+    },
+    
+    
+    renderHorizontalRows: function() {
+        var headers  = this.buildHeaders(),
+            rowCount = headers.length,
+            rows     = [],
+            cells, cols, colCount, i, j;
+        
+        for (i = 0; i < rowCount; i++) {
+            cells = [];
+            cols  = headers[i].items;
+            colCount = cols.length;
+
+            for (j = 0; j < colCount; j++) {
+                cells.push({
+                    tag: 'td',
+                    html: cols[j].header,
+                    colspan: cols[j].span
+                });
+            }
+
+            rows[i] = {
+                tag: 'tr',
+                cn: cells
+            };
+        }
+        
+        return rows;
+    },
+    
+    
+    renderVerticalRows: function() {
+        var headers  = this.buildHeaders(),
+            colCount = headers.length,
+            rowCells = [],
+            rows     = [],
+            rowCount, col, row, colWidth, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            col = headers[i];
+            colWidth = col.width || 80;
+            rowCount = col.items.length;
+            
+            for (j = 0; j < rowCount; j++) {
+                row = col.items[j];
+                
+                rowCells[row.start] = rowCells[row.start] || [];
+                rowCells[row.start].push({
+                    tag    : 'td',
+                    html   : row.header,
+                    rowspan: row.span,
+                    width  : Ext.isBorderBox ? colWidth : colWidth - this.paddingWidth
+                });
+            }
+        }
+        
+        rowCount = rowCells.length;
+        for (i = 0; i < rowCount; i++) {
+            rows[i] = {
+                tag: 'tr',
+                cn : rowCells[i]
+            };
+        }
+        
+        return rows;
+    },
+    
+    
+    getTuples: function() {
+        var newStore = new Ext.data.Store({});
+        
+        newStore.data = this.store.data.clone();
+        newStore.fields = this.store.fields;
+        
+        var sorters    = [],
+            dimensions = this.dimensions,
+            length     = dimensions.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            sorters.push({
+                field    : dimensions[i].dataIndex,
+                direction: dimensions[i].direction || 'ASC'
+            });
+        }
+        
+        newStore.sort(sorters);
+        
+        var records = newStore.data.items,
+            hashes  = [],
+            tuples  = [],
+            recData, hash, info, data, key;
+        
+        length = records.length;
+        
+        for (i = 0; i < length; i++) {
+            info = this.getRecordInfo(records[i]);
+            data = info.data;
+            hash = "";
+            
+            for (key in data) {
+                hash += data[key] + '---';
+            }
+            
+            if (hashes.indexOf(hash) == -1) {
+                hashes.push(hash);
+                tuples.push(info);
+            }
+        }
+        
+        newStore.destroy();
+        
+        return tuples;
+    },
+    
+    
+    getRecordInfo: function(record) {
+        var dimensions = this.dimensions,
+            length  = dimensions.length,
+            data    = {},
+            dimension, dataIndex, i;
+        
+        
+        for (i = 0; i < length; i++) {
+            dimension = dimensions[i];
+            dataIndex = dimension.dataIndex;
+            
+            data[dataIndex] = record.get(dataIndex);
+        }
+        
+        
+        
+        var createMatcherFunction = function(data) {
+            return function(record) {
+                for (var dataIndex in data) {
+                    if (record.get(dataIndex) != data[dataIndex]) {
+                        return false;
+                    }
+                }
+                
+                return true;
+            };
+        };
+        
+        return {
+            data: data,
+            matcher: createMatcherFunction(data)
+        };
+    },
+    
+    
+    buildHeaders: function() {
+        var tuples     = this.getTuples(),
+            rowCount   = tuples.length,
+            dimensions = this.dimensions,
+            dimension,
+            colCount   = dimensions.length,
+            headers    = [],
+            tuple, rows, currentHeader, previousHeader, span, start, isLast, changed, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            dimension = dimensions[i];
+            rows  = [];
+            span  = 0;
+            start = 0;
+            
+            for (j = 0; j < rowCount; j++) {
+                tuple  = tuples[j];
+                isLast = j == (rowCount - 1);
+                currentHeader = tuple.data[dimension.dataIndex];
+                
+                
+                changed = previousHeader != undefined && previousHeader != currentHeader;
+                if (i > 0 && j > 0) {
+                    changed = changed || tuple.data[dimensions[i-1].dataIndex] != tuples[j-1].data[dimensions[i-1].dataIndex];
+                }
+                
+                if (changed) {                    
+                    rows.push({
+                        header: previousHeader,
+                        span  : span,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                if (isLast) {
+                    rows.push({
+                        header: currentHeader,
+                        span  : span + 1,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                previousHeader = currentHeader;
+                span++;
+            }
+            
+            headers.push({
+                items: rows,
+                width: dimension.width || this.defaultHeaderWidth
+            });
+            
+            previousHeader = undefined;
+        }
+        
+        return headers;
+    }
+});
+
+
+Ext.grid.HeaderDragZone = Ext.extend(Ext.dd.DragZone, {
+    maxDragWidth: 120,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
+        if(hd2){
+            this.setHandleElId(Ext.id(hd));
+            this.setOuterHandleElId(Ext.id(hd2));
+        }
+        this.scroll = false;
+    },
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            h = this.view.findHeaderCell(t);
+        if(h){
+            return {ddel: h.firstChild, header:h};
+        }
+        return false;
+    },
+
+    onInitDrag : function(e){
+        
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var clone = this.dragData.ddel.cloneNode(true);
+        clone.id = Ext.id();
+        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
+        this.proxy.update(clone);
+        return true;
+    },
+
+    afterValidDrop : function(){
+        this.completeDrop();
+    },
+
+    afterInvalidDrop : function(){
+        this.completeDrop();
+    },
+    
+    completeDrop: function(){
+        var v = this.view,
+            disabled = this.dragHeadersDisabled;
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    }
+});
+
+
+
+Ext.grid.HeaderDropZone = Ext.extend(Ext.dd.DropZone, {
+    proxyOffsets : [-4, -9],
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        
+        this.proxyTop = Ext.DomHelper.append(document.body, {
+            cls:"col-move-top", html:"&#160;"
+        }, true);
+        this.proxyBottom = Ext.DomHelper.append(document.body, {
+            cls:"col-move-bottom", html:"&#160;"
+        }, true);
+        this.proxyTop.hide = this.proxyBottom.hide = function(){
+            this.setLeftTop(-100,-100);
+            this.setStyle("visibility", "hidden");
+        };
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        
+        
+        Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
+    },
+
+    getTargetFromEvent : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            cindex = this.view.findCellIndex(t);
+        if(cindex !== false){
+            return this.view.getHeaderCell(cindex);
+        }
+    },
+
+    nextVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.nextSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.nextSibling;
+        }
+        return null;
+    },
+
+    prevVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.prevSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.prevSibling;
+        }
+        return null;
+    },
+
+    positionIndicator : function(h, n, e){
+        var x = Ext.lib.Event.getPageX(e),
+            r = Ext.lib.Dom.getRegion(n.firstChild),
+            px, 
+            pt, 
+            py = r.top + this.proxyOffsets[1];
+        if((r.right - x) <= (r.right-r.left)/2){
+            px = r.right+this.view.borderWidth;
+            pt = "after";
+        }else{
+            px = r.left;
+            pt = "before";
+        }
+
+        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){
+            return false;
+        }
+
+        px +=  this.proxyOffsets[0];
+        this.proxyTop.setLeftTop(px, py);
+        this.proxyTop.show();
+        if(!this.bottomOffset){
+            this.bottomOffset = this.view.mainHd.getHeight();
+        }
+        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
+        this.proxyBottom.show();
+        return pt;
+    },
+
+    onNodeEnter : function(n, dd, e, data){
+        if(data.header != n){
+            this.positionIndicator(data.header, n, e);
+        }
+    },
+
+    onNodeOver : function(n, dd, e, data){
+        var result = false;
+        if(data.header != n){
+            result = this.positionIndicator(data.header, n, e);
+        }
+        if(!result){
+            this.proxyTop.hide();
+            this.proxyBottom.hide();
+        }
+        return result ? this.dropAllowed : this.dropNotAllowed;
+    },
+
+    onNodeOut : function(n, dd, e, data){
+        this.proxyTop.hide();
+        this.proxyBottom.hide();
+    },
+
+    onNodeDrop : function(n, dd, e, data){
+        var h = data.header;
+        if(h != n){
+            var cm = this.grid.colModel,
+                x = Ext.lib.Event.getPageX(e),
+                r = Ext.lib.Dom.getRegion(n.firstChild),
+                pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before",
+                oldIndex = this.view.getCellIndex(h),
+                newIndex = this.view.getCellIndex(n);
+            if(pt == "after"){
+                newIndex++;
+            }
+            if(oldIndex < newIndex){
+                newIndex--;
+            }
+            cm.moveColumn(oldIndex, newIndex);
+            return true;
+        }
+        return false;
+    }
+});
+
+Ext.grid.GridView.ColumnDragZone = Ext.extend(Ext.grid.HeaderDragZone, {
+    
+    constructor : function(grid, hd){
+        Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
+        this.proxy.el.addClass('x-grid3-col-dd');
+    },
+    
+    handleMouseDown : function(e){
+    },
+
+    callHandleMouseDown : function(e){
+        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
+    }
+});
+
+Ext.grid.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.SplitDragZone.superclass.constructor.call(this, hd,
+            "gridSplitters" + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.setHandleElId(Ext.id(hd));
+        this.setOuterHandleElId(Ext.id(hd2));
+        this.scroll = false;
+    },
+
+    b4StartDrag : function(x, y){
+        this.view.headersDisabled = true;
+        this.proxy.setHeight(this.view.mainWrap.getHeight());
+        var w = this.cm.getColumnWidth(this.cellIndex);
+        var minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+
+    handleMouseDown : function(e){
+        var ev = Ext.EventObject.setEvent(e);
+        var t = this.fly(ev.getTarget());
+        if(t.hasClass("x-grid-split")){
+            this.cellIndex = this.view.getCellIndex(t.dom);
+            this.split = t.dom;
+            this.cm = this.grid.colModel;
+            if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.view.headersDisabled = false;
+        var endX = Math.max(this.minX, Ext.lib.Event.getPageX(e));
+        var diff = endX - this.startPos;
+        this.view.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
+Ext.grid.GridDragZone = function(grid, config){
+    this.view = grid.getView();
+    Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
+    this.scroll = false;
+    this.grid = grid;
+    this.ddel = document.createElement('div');
+    this.ddel.className = 'x-grid-dd-wrap';
+};
+
+Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
+    ddGroup : "GridDD",
+
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e);
+        var rowIndex = this.view.findRowIndex(t);
+        if(rowIndex !== false){
+            var sm = this.grid.selModel;
+            if(!sm.isSelected(rowIndex) || e.hasModifier()){
+                sm.handleMouseDown(this.grid, rowIndex, e);
+            }
+            return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
+        }
+        return false;
+    },
+
+    
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.ddel.innerHTML = this.grid.getDragDropText();
+        this.proxy.update(this.ddel);
+        
+    },
+
+    
+    afterRepair : function(){
+        this.dragging = false;
+    },
+
+    
+    getRepairXY : function(e, data){
+        return false;
+    },
+
+    onEndDrag : function(data, e){
+        
+    },
+
+    onValidDrop : function(dd, e, id){
+        
+        this.hideProxy();
+    },
+
+    beforeInvalidDrop : function(e, id){
+
+    }
+});
+
+Ext.grid.ColumnModel = Ext.extend(Ext.util.Observable, {
+    
+    defaultWidth: 100,
+
+    
+    defaultSortable: false,
+
+    
+
+    
+
+    constructor : function(config) {
+        
+	    if (config.columns) {
+	        Ext.apply(this, config);
+	        this.setConfig(config.columns, true);
+	    } else {
+	        this.setConfig(config, true);
+	    }
+	    
+	    this.addEvents(
+	        
+	        "widthchange",
+	        
+	        
+	        "headerchange",
+	        
+	        
+	        "hiddenchange",
+	        
+	        
+	        "columnmoved",
+	        
+	        
+	        "configchange"
+	    );
+	    
+	    Ext.grid.ColumnModel.superclass.constructor.call(this);
+    },
+
+    
+    getColumnId : function(index) {
+        return this.config[index].id;
+    },
+
+    getColumnAt : function(index) {
+        return this.config[index];
+    },
+
+    
+    setConfig : function(config, initial) {
+        var i, c, len;
+        
+        if (!initial) { 
+            delete this.totalWidth;
+            
+            for (i = 0, len = this.config.length; i < len; i++) {
+                c = this.config[i];
+                
+                if (c.setEditor) {
+                    
+                    c.setEditor(null);
+                }
+            }
+        }
+
+        
+        this.defaults = Ext.apply({
+            width: this.defaultWidth,
+            sortable: this.defaultSortable
+        }, this.defaults);
+
+        this.config = config;
+        this.lookup = {};
+
+        for (i = 0, len = config.length; i < len; i++) {
+            c = Ext.applyIf(config[i], this.defaults);
+            
+            
+            if (Ext.isEmpty(c.id)) {
+                c.id = i;
+            }
+            
+            if (!c.isColumn) {
+                var Cls = Ext.grid.Column.types[c.xtype || 'gridcolumn'];
+                c = new Cls(c);
+                config[i] = c;
+            }
+            
+            this.lookup[c.id] = c;
+        }
+        
+        if (!initial) {
+            this.fireEvent('configchange', this);
+        }
+    },
+
+    
+    getColumnById : function(id) {
+        return this.lookup[id];
+    },
+
+    
+    getIndexById : function(id) {
+        for (var i = 0, len = this.config.length; i < len; i++) {
+            if (this.config[i].id == id) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    
+    moveColumn : function(oldIndex, newIndex) {
+        var config = this.config,
+            c      = config[oldIndex];
+            
+        config.splice(oldIndex, 1);
+        config.splice(newIndex, 0, c);
+        this.dataMap = null;
+        this.fireEvent("columnmoved", this, oldIndex, newIndex);
+    },
+
+    
+    getColumnCount : function(visibleOnly) {
+        var length = this.config.length,
+            c = 0,
+            i;
+        
+        if (visibleOnly === true) {
+            for (i = 0; i < length; i++) {
+                if (!this.isHidden(i)) {
+                    c++;
+                }
+            }
+            
+            return c;
+        }
+        
+        return length;
+    },
+
+    
+    getColumnsBy : function(fn, scope) {
+        var config = this.config,
+            length = config.length,
+            result = [],
+            i, c;
+            
+        for (i = 0; i < length; i++){
+            c = config[i];
+            
+            if (fn.call(scope || this, c, i) === true) {
+                result[result.length] = c;
+            }
+        }
+        
+        return result;
+    },
+
+    
+    isSortable : function(col) {
+        return !!this.config[col].sortable;
+    },
+
+    
+    isMenuDisabled : function(col) {
+        return !!this.config[col].menuDisabled;
+    },
+
+    
+    getRenderer : function(col) {
+        return this.config[col].renderer || Ext.grid.ColumnModel.defaultRenderer;
+    },
+
+    getRendererScope : function(col) {
+        return this.config[col].scope;
+    },
+
+    
+    setRenderer : function(col, fn) {
+        this.config[col].renderer = fn;
+    },
+
+    
+    getColumnWidth : function(col) {
+        var width = this.config[col].width;
+        if(typeof width != 'number'){
+            width = this.defaultWidth;
+        }
+        return width;
+    },
+
+    
+    setColumnWidth : function(col, width, suppressEvent) {
+        this.config[col].width = width;
+        this.totalWidth = null;
+        
+        if (!suppressEvent) {
+             this.fireEvent("widthchange", this, col, width);
+        }
+    },
+
+    
+    getTotalWidth : function(includeHidden) {
+        if (!this.totalWidth) {
+            this.totalWidth = 0;
+            for (var i = 0, len = this.config.length; i < len; i++) {
+                if (includeHidden || !this.isHidden(i)) {
+                    this.totalWidth += this.getColumnWidth(i);
+                }
+            }
+        }
+        return this.totalWidth;
+    },
+
+    
+    getColumnHeader : function(col) {
+        return this.config[col].header;
+    },
+
+    
+    setColumnHeader : function(col, header) {
+        this.config[col].header = header;
+        this.fireEvent("headerchange", this, col, header);
+    },
+
+    
+    getColumnTooltip : function(col) {
+            return this.config[col].tooltip;
+    },
+    
+    setColumnTooltip : function(col, tooltip) {
+            this.config[col].tooltip = tooltip;
+    },
+
+    
+    getDataIndex : function(col) {
+        return this.config[col].dataIndex;
+    },
+
+    
+    setDataIndex : function(col, dataIndex) {
+        this.config[col].dataIndex = dataIndex;
+    },
+
+    
+    findColumnIndex : function(dataIndex) {
+        var c = this.config;
+        for(var i = 0, len = c.length; i < len; i++){
+            if(c[i].dataIndex == dataIndex){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    
+    isCellEditable : function(colIndex, rowIndex) {
+        var c = this.config[colIndex],
+            ed = c.editable;
+
+        
+        return !!(ed || (!Ext.isDefined(ed) && c.editor));
+    },
+
+    
+    getCellEditor : function(colIndex, rowIndex) {
+        return this.config[colIndex].getCellEditor(rowIndex);
+    },
+
+    
+    setEditable : function(col, editable) {
+        this.config[col].editable = editable;
+    },
+
+    
+    isHidden : function(colIndex) {
+        return !!this.config[colIndex].hidden; 
+    },
+
+    
+    isFixed : function(colIndex) {
+        return !!this.config[colIndex].fixed;
+    },
+
+    
+    isResizable : function(colIndex) {
+        return colIndex >= 0 && this.config[colIndex].resizable !== false && this.config[colIndex].fixed !== true;
+    },
+    
+    
+    setHidden : function(colIndex, hidden) {
+        var c = this.config[colIndex];
+        if(c.hidden !== hidden){
+            c.hidden = hidden;
+            this.totalWidth = null;
+            this.fireEvent("hiddenchange", this, colIndex, hidden);
+        }
+    },
+
+    
+    setEditor : function(col, editor) {
+        this.config[col].setEditor(editor);
+    },
+
+    
+    destroy : function() {
+        var length = this.config.length,
+            i = 0;
+
+        for (; i < length; i++){
+            this.config[i].destroy(); 
+        }
+        delete this.config;
+        delete this.lookup;
+        this.purgeListeners();
+    },
+
+    
+    setState : function(col, state) {
+        state = Ext.applyIf(state, this.defaults);
+        Ext.apply(this.config[col], state);
+    }
+});
+
+
+Ext.grid.ColumnModel.defaultRenderer = function(value) {
+    if (typeof value == "string" && value.length < 1) {
+        return "&#160;";
+    }
+    return value;
+};
+Ext.grid.AbstractSelectionModel = Ext.extend(Ext.util.Observable,  {
+    
+
+    constructor : function(){
+        this.locked = false;
+        Ext.grid.AbstractSelectionModel.superclass.constructor.call(this);
+    },
+
+    
+    init : function(grid){
+        this.grid = grid;
+        if(this.lockOnInit){
+            delete this.lockOnInit;
+            this.locked = false;
+            this.lock();
+        }
+        this.initEvents();
+    },
+
+    
+    lock : function(){
+        if(!this.locked){
+            this.locked = true;
+            
+            var g = this.grid;
+            if(g){
+                g.getView().on({
+                    scope: this,
+                    beforerefresh: this.sortUnLock,
+                    refresh: this.sortLock
+                });
+            }else{
+                this.lockOnInit = true;
+            }
+        }
+    },
+
+    
+    sortLock : function() {
+        this.locked = true;
+    },
+
+    
+    sortUnLock : function() {
+        this.locked = false;
+    },
+
+    
+    unlock : function(){
+        if(this.locked){
+            this.locked = false;
+            var g = this.grid,
+                gv;
+                
+            
+            if(g){
+                gv = g.getView();
+                gv.un('beforerefresh', this.sortUnLock, this);
+                gv.un('refresh', this.sortLock, this);    
+            }else{
+                delete this.lockOnInit;
+            }
+        }
+    },
+
+    
+    isLocked : function(){
+        return this.locked;
+    },
+
+    destroy: function(){
+        this.unlock();
+        this.purgeListeners();
+    }
+});
+Ext.grid.RowSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    
+    singleSelect : false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.selections = new Ext.util.MixedCollection(false, function(o){
+            return o.id;
+        });
+
+        this.last = false;
+        this.lastActive = false;
+
+        this.addEvents(
+	        
+	        'selectionchange',
+	        
+	        'beforerowselect',
+	        
+	        'rowselect',
+	        
+	        'rowdeselect'
+        );
+        Ext.grid.RowSelectionModel.superclass.constructor.call(this);
+    },
+
+    
+    
+    initEvents : function(){
+
+        if(!this.grid.enableDragDrop && !this.grid.enableDrag){
+            this.grid.on('rowmousedown', this.handleMouseDown, this);
+        }
+
+        this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
+            up: this.onKeyPress, 
+            down: this.onKeyPress,
+            scope: this
+        });
+
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onRefresh,
+            rowupdated: this.onRowUpdated,
+            rowremoved: this.onRemove
+        });
+    },
+    
+    onKeyPress : function(e, name){
+        var up = name == 'up',
+            method = up ? 'selectPrevious' : 'selectNext',
+            add = up ? -1 : 1,
+            last;
+        if(!e.shiftKey || this.singleSelect){
+            this[method](false);
+        }else if(this.last !== false && this.lastActive !== false){
+            last = this.last;
+            this.selectRange(this.last,  this.lastActive + add);
+            this.grid.getView().focusRow(this.lastActive);
+            if(last !== false){
+                this.last = last;
+            }
+        }else{
+           this.selectFirstRow();
+        }
+    },
+
+    
+    onRefresh : function(){
+        var ds = this.grid.store,
+            s = this.getSelections(),
+            i = 0,
+            len = s.length, 
+            index, r;
+            
+        this.silent = true;
+        this.clearSelections(true);
+        for(; i < len; i++){
+            r = s[i];
+            if((index = ds.indexOfId(r.id)) != -1){
+                this.selectRow(index, true);
+            }
+        }
+        if(s.length != this.selections.getCount()){
+            this.fireEvent('selectionchange', this);
+        }
+        this.silent = false;
+    },
+
+    
+    onRemove : function(v, index, r){
+        if(this.selections.remove(r) !== false){
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    
+    onRowUpdated : function(v, index, r){
+        if(this.isSelected(r)){
+            v.onRowSelect(index);
+        }
+    },
+
+    
+    selectRecords : function(records, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        var ds = this.grid.store,
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            this.selectRow(ds.indexOf(records[i]), true);
+        }
+    },
+
+    
+    getCount : function(){
+        return this.selections.length;
+    },
+
+    
+    selectFirstRow : function(){
+        this.selectRow(0);
+    },
+
+    
+    selectLastRow : function(keepExisting){
+        this.selectRow(this.grid.store.getCount() - 1, keepExisting);
+    },
+
+    
+    selectNext : function(keepExisting){
+        if(this.hasNext()){
+            this.selectRow(this.last+1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    
+    selectPrevious : function(keepExisting){
+        if(this.hasPrevious()){
+            this.selectRow(this.last-1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    
+    hasNext : function(){
+        return this.last !== false && (this.last+1) < this.grid.store.getCount();
+    },
+
+    
+    hasPrevious : function(){
+        return !!this.last;
+    },
+
+
+    
+    getSelections : function(){
+        return [].concat(this.selections.items);
+    },
+
+    
+    getSelected : function(){
+        return this.selections.itemAt(0);
+    },
+
+    
+    each : function(fn, scope){
+        var s = this.getSelections(),
+            i = 0,
+            len = s.length;
+            
+        for(; i < len; i++){
+            if(fn.call(scope || this, s[i], i) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    
+    clearSelections : function(fast){
+        if(this.isLocked()){
+            return;
+        }
+        if(fast !== true){
+            var ds = this.grid.store,
+                s = this.selections;
+            s.each(function(r){
+                this.deselectRow(ds.indexOfId(r.id));
+            }, this);
+            s.clear();
+        }else{
+            this.selections.clear();
+        }
+        this.last = false;
+    },
+
+
+    
+    selectAll : function(){
+        if(this.isLocked()){
+            return;
+        }
+        this.selections.clear();
+        for(var i = 0, len = this.grid.store.getCount(); i < len; i++){
+            this.selectRow(i, true);
+        }
+    },
+
+    
+    hasSelection : function(){
+        return this.selections.length > 0;
+    },
+
+    
+    isSelected : function(index){
+        var r = Ext.isNumber(index) ? this.grid.store.getAt(index) : index;
+        return (r && this.selections.key(r.id) ? true : false);
+    },
+
+    
+    isIdSelected : function(id){
+        return (this.selections.key(id) ? true : false);
+    },
+
+    
+    handleMouseDown : function(g, rowIndex, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        var view = this.grid.getView();
+        if(e.shiftKey && !this.singleSelect && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, rowIndex, e.ctrlKey);
+            this.last = last; 
+            view.focusRow(rowIndex);
+        }else{
+            var isSelected = this.isSelected(rowIndex);
+            if(e.ctrlKey && isSelected){
+                this.deselectRow(rowIndex);
+            }else if(!isSelected || this.getCount() > 1){
+                this.selectRow(rowIndex, e.ctrlKey || e.shiftKey);
+                view.focusRow(rowIndex);
+            }
+        }
+    },
+
+    
+    selectRows : function(rows, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        for(var i = 0, len = rows.length; i < len; i++){
+            this.selectRow(rows[i], true);
+        }
+    },
+
+    
+    selectRange : function(startRow, endRow, keepExisting){
+        var i;
+        if(this.isLocked()){
+            return;
+        }
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        if(startRow <= endRow){
+            for(i = startRow; i <= endRow; i++){
+                this.selectRow(i, true);
+            }
+        }else{
+            for(i = startRow; i >= endRow; i--){
+                this.selectRow(i, true);
+            }
+        }
+    },
+
+    
+    deselectRange : function(startRow, endRow, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        for(var i = startRow; i <= endRow; i++){
+            this.deselectRow(i, preventViewNotify);
+        }
+    },
+
+    
+    selectRow : function(index, keepExisting, preventViewNotify){
+        if(this.isLocked() || (index < 0 || index >= this.grid.store.getCount()) || (keepExisting && this.isSelected(index))){
+            return;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r && this.fireEvent('beforerowselect', this, index, keepExisting, r) !== false){
+            if(!keepExisting || this.singleSelect){
+                this.clearSelections();
+            }
+            this.selections.add(r);
+            this.last = this.lastActive = index;
+            if(!preventViewNotify){
+                this.grid.getView().onRowSelect(index);
+            }
+            if(!this.silent){
+                this.fireEvent('rowselect', this, index, r);
+                this.fireEvent('selectionchange', this);
+            }
+        }
+    },
+
+    
+    deselectRow : function(index, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        if(this.last == index){
+            this.last = false;
+        }
+        if(this.lastActive == index){
+            this.lastActive = false;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r){
+            this.selections.remove(r);
+            if(!preventViewNotify){
+                this.grid.getView().onRowDeselect(index);
+            }
+            this.fireEvent('rowdeselect', this, index, r);
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    },
+
+    
+    onEditorKey : function(field, e){
+        var k = e.getKey(), 
+            newCell, 
+            g = this.grid, 
+            last = g.lastEdit,
+            ed = g.activeEditor,
+            shift = e.shiftKey,
+            ae, last, r, c;
+            
+        if(k == e.TAB){
+            e.stopEvent();
+            ed.completeEdit();
+            if(shift){
+                newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
+            }else{
+                newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
+            }
+        }else if(k == e.ENTER){
+            if(this.moveEditorOnEnter !== false){
+                if(shift){
+                    newCell = g.walkCells(last.row - 1, last.col, -1, this.acceptsNav, this);
+                }else{
+                    newCell = g.walkCells(last.row + 1, last.col, 1, this.acceptsNav, this);
+                }
+            }
+        }
+        if(newCell){
+            r = newCell[0];
+            c = newCell[1];
+
+            this.onEditorSelect(r, last.row);
+
+            if(g.isEditor && g.editing){ 
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    
+                    ae.field.triggerBlur();
+                }
+            }
+            g.startEditing(r, c);
+        }
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row){
+            this.selectRow(row); 
+        }
+    },
+    
+    destroy : function(){
+        Ext.destroy(this.rowNav);
+        this.rowNav = null;
+        Ext.grid.RowSelectionModel.superclass.destroy.call(this);
+    }
+});
+
+Ext.grid.Column = Ext.extend(Ext.util.Observable, {
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+
+    
+    isColumn : true,
+
+    constructor : function(config){
+        Ext.apply(this, config);
+
+        if(Ext.isString(this.renderer)){
+            this.renderer = Ext.util.Format[this.renderer];
+        }else if(Ext.isObject(this.renderer)){
+            this.scope = this.renderer.scope;
+            this.renderer = this.renderer.fn;
+        }
+        if(!this.scope){
+            this.scope = this;
+        }
+
+        var ed = this.editor;
+        delete this.editor;
+        this.setEditor(ed);
+        this.addEvents(
+            
+            'click',
+            
+            'contextmenu',
+            
+            'dblclick',
+            
+            'mousedown'
+        );
+        Ext.grid.Column.superclass.constructor.call(this);
+    },
+
+    
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        return this.fireEvent(name, this, grid, rowIndex, e);
+    },
+
+    
+    destroy: function() {
+        if(this.setEditor){
+            this.setEditor(null);
+        }
+        this.purgeListeners();
+    },
+
+    
+    renderer : function(value){
+        return value;
+    },
+
+    
+    getEditor: function(rowIndex){
+        return this.editable !== false ? this.editor : null;
+    },
+
+    
+    setEditor : function(editor){
+        var ed = this.editor;
+        if(ed){
+            if(ed.gridEditor){
+                ed.gridEditor.destroy();
+                delete ed.gridEditor;
+            }else{
+                ed.destroy();
+            }
+        }
+        this.editor = null;
+        if(editor){
+            
+            if(!editor.isXType){
+                editor = Ext.create(editor, 'textfield');
+            }
+            this.editor = editor;
+        }
+    },
+
+    
+    getCellEditor: function(rowIndex){
+        var ed = this.getEditor(rowIndex);
+        if(ed){
+            if(!ed.startEdit){
+                if(!ed.gridEditor){
+                    ed.gridEditor = new Ext.grid.GridEditor(ed);
+                }
+                ed = ed.gridEditor;
+            }
+        }
+        return ed;
+    }
+});
+
+
+Ext.grid.BooleanColumn = Ext.extend(Ext.grid.Column, {
+    
+    trueText: 'true',
+    
+    falseText: 'false',
+    
+    undefinedText: '&#160;',
+
+    constructor: function(cfg){
+        Ext.grid.BooleanColumn.superclass.constructor.call(this, cfg);
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        this.renderer = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+    }
+});
+
+
+Ext.grid.NumberColumn = Ext.extend(Ext.grid.Column, {
+    
+    format : '0,000.00',
+    constructor: function(cfg){
+        Ext.grid.NumberColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.numberRenderer(this.format);
+    }
+});
+
+
+Ext.grid.DateColumn = Ext.extend(Ext.grid.Column, {
+    
+    format : 'm/d/Y',
+    constructor: function(cfg){
+        Ext.grid.DateColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.dateRenderer(this.format);
+    }
+});
+
+
+Ext.grid.TemplateColumn = Ext.extend(Ext.grid.Column, {
+    
+    constructor: function(cfg){
+        Ext.grid.TemplateColumn.superclass.constructor.call(this, cfg);
+        var tpl = (!Ext.isPrimitive(this.tpl) && this.tpl.compile) ? this.tpl : new Ext.XTemplate(this.tpl);
+        this.renderer = function(value, p, r){
+            return tpl.apply(r.data);
+        };
+        this.tpl = tpl;
+    }
+});
+
+
+Ext.grid.ActionColumn = Ext.extend(Ext.grid.Column, {
+    
+    
+    
+    
+    
+    
+    
+    
+    header: '&#160;',
+
+    actionIdRe: /x-action-col-(\d+)/,
+    
+    
+    altText: '',
+
+    constructor: function(cfg) {
+        var me = this,
+            items = cfg.items || (me.items = [me]),
+            l = items.length,
+            i,
+            item;
+
+        Ext.grid.ActionColumn.superclass.constructor.call(me, cfg);
+
+
+
+        me.renderer = function(v, meta) {
+
+            v = Ext.isFunction(cfg.renderer) ? cfg.renderer.apply(this, arguments)||'' : '';
+
+            meta.css += ' x-action-col-cell';
+            for (i = 0; i < l; i++) {
+                item = items[i];
+                v += '<img alt="' + (item.altText || me.altText) + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
+                    '" class="x-action-col-icon x-action-col-' + String(i) + ' ' + (item.iconCls || '') +
+                    ' ' + (Ext.isFunction(item.getClass) ? item.getClass.apply(item.scope||this.scope||this, arguments) : '') + '"' +
+                    ((item.tooltip) ? ' ext:qtip="' + item.tooltip + '"' : '') + ' />';
+            }
+            return v;
+        };
+    },
+
+    destroy: function() {
+        delete this.items;
+        delete this.renderer;
+        return Ext.grid.ActionColumn.superclass.destroy.apply(this, arguments);
+    },
+
+    
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        var m = e.getTarget().className.match(this.actionIdRe),
+            item, fn;
+        if (m && (item = this.items[parseInt(m[1], 10)])) {
+            if (name == 'click') {
+                (fn = item.handler || this.handler) && fn.call(item.scope||this.scope||this, grid, rowIndex, colIndex, item, e);
+            } else if ((name == 'mousedown') && (item.stopSelection !== false)) {
+                return false;
+            }
+        }
+        return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments);
+    }
+});
+
+
+Ext.grid.Column.types = {
+    gridcolumn : Ext.grid.Column,
+    booleancolumn: Ext.grid.BooleanColumn,
+    numbercolumn: Ext.grid.NumberColumn,
+    datecolumn: Ext.grid.DateColumn,
+    templatecolumn: Ext.grid.TemplateColumn,
+    actioncolumn: Ext.grid.ActionColumn
+};
+Ext.grid.RowNumberer = Ext.extend(Object, {
+    
+    header: "",
+    
+    width: 23,
+    
+    sortable: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        if(this.rowspan){
+            this.renderer = this.renderer.createDelegate(this);
+        }
+    },
+
+    
+    fixed:true,
+    hideable: false,
+    menuDisabled:true,
+    dataIndex: '',
+    id: 'numberer',
+    rowspan: undefined,
+
+    
+    renderer : function(v, p, record, rowIndex){
+        if(this.rowspan){
+            p.cellAttr = 'rowspan="'+this.rowspan+'"';
+        }
+        return rowIndex+1;
+    }
+});
+Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
+
+    
+    
+    header : '<div class="x-grid3-hd-checker">&#160;</div>',
+    
+    width : 20,
+    
+    sortable : false,
+
+    
+    menuDisabled : true,
+    fixed : true,
+    hideable: false,
+    dataIndex : '',
+    id : 'checker',
+    isColumn: true, 
+
+    constructor : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this, arguments);
+        if(this.checkOnly){
+            this.handleMouseDown = Ext.emptyFn;
+        }
+    },
+
+    
+    initEvents : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
+        this.grid.on('render', function(){
+            Ext.fly(this.grid.getView().innerHd).on('mousedown', this.onHdMouseDown, this);
+        }, this);
+    },
+
+    
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        if (name == 'mousedown') {
+            this.onMouseDown(e, e.getTarget());
+            return false;
+        } else {
+            return Ext.grid.Column.prototype.processEvent.apply(this, arguments);
+        }
+    },
+
+    
+    onMouseDown : function(e, t){
+        if(e.button === 0 && t.className == 'x-grid3-row-checker'){ 
+            e.stopEvent();
+            var row = e.getTarget('.x-grid3-row');
+            if(row){
+                var index = row.rowIndex;
+                if(this.isSelected(index)){
+                    this.deselectRow(index);
+                }else{
+                    this.selectRow(index, true);
+                    this.grid.getView().focusRow(index);
+                }
+            }
+        }
+    },
+
+    
+    onHdMouseDown : function(e, t) {
+        if(t.className == 'x-grid3-hd-checker'){
+            e.stopEvent();
+            var hd = Ext.fly(t.parentNode);
+            var isChecked = hd.hasClass('x-grid3-hd-checker-on');
+            if(isChecked){
+                hd.removeClass('x-grid3-hd-checker-on');
+                this.clearSelections();
+            }else{
+                hd.addClass('x-grid3-hd-checker-on');
+                this.selectAll();
+            }
+        }
+    },
+
+    
+    renderer : function(v, p, record){
+        return '<div class="x-grid3-row-checker">&#160;</div>';
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row && !this.checkOnly){
+            this.selectRow(row); 
+        }
+    }
+});
+Ext.grid.CellSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+
+	    this.selection = null;
+	
+	    this.addEvents(
+	        
+	        "beforecellselect",
+	        
+	        "cellselect",
+	        
+	        "selectionchange"
+	    );
+	
+	    Ext.grid.CellSelectionModel.superclass.constructor.call(this);
+    },
+
+    
+    initEvents : function(){
+        this.grid.on('cellmousedown', this.handleMouseDown, this);
+        this.grid.on(Ext.EventManager.getKeyEvent(), this.handleKeyDown, this);
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onViewChange,
+            rowupdated: this.onRowUpdated,
+            beforerowremoved: this.clearSelections,
+            beforerowsinserted: this.clearSelections
+        });
+        if(this.grid.isEditor){
+            this.grid.on('beforeedit', this.beforeEdit,  this);
+        }
+    },
+
+	
+    beforeEdit : function(e){
+        this.select(e.row, e.column, false, true, e.record);
+    },
+
+	
+    onRowUpdated : function(v, index, r){
+        if(this.selection && this.selection.record == r){
+            v.onCellSelect(index, this.selection.cell[1]);
+        }
+    },
+
+	
+    onViewChange : function(){
+        this.clearSelections(true);
+    },
+
+	
+    getSelectedCell : function(){
+        return this.selection ? this.selection.cell : null;
+    },
+
+    
+    clearSelections : function(preventNotify){
+        var s = this.selection;
+        if(s){
+            if(preventNotify !== true){
+                this.grid.view.onCellDeselect(s.cell[0], s.cell[1]);
+            }
+            this.selection = null;
+            this.fireEvent("selectionchange", this, null);
+        }
+    },
+
+    
+    hasSelection : function(){
+        return this.selection ? true : false;
+    },
+
+    
+    handleMouseDown : function(g, row, cell, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        this.select(row, cell);
+    },
+
+    
+    select : function(rowIndex, colIndex, preventViewNotify, preventFocus,  r){
+        if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){
+            this.clearSelections();
+            r = r || this.grid.store.getAt(rowIndex);
+            this.selection = {
+                record : r,
+                cell : [rowIndex, colIndex]
+            };
+            if(!preventViewNotify){
+                var v = this.grid.getView();
+                v.onCellSelect(rowIndex, colIndex);
+                if(preventFocus !== true){
+                    v.focusCell(rowIndex, colIndex);
+                }
+            }
+            this.fireEvent("cellselect", this, rowIndex, colIndex);
+            this.fireEvent("selectionchange", this, this.selection);
+        }
+    },
+
+	
+    isSelectable : function(rowIndex, colIndex, cm){
+        return !cm.isHidden(colIndex);
+    },
+    
+    
+    onEditorKey: function(field, e){
+        if(e.getKey() == e.TAB){
+            this.handleKeyDown(e);
+        }
+    },
+
+    
+    handleKeyDown : function(e){
+        if(!e.isNavKeyPress()){
+            return;
+        }
+        
+        var k = e.getKey(),
+            g = this.grid,
+            s = this.selection,
+            sm = this,
+            walk = function(row, col, step){
+                return g.walkCells(
+                    row,
+                    col,
+                    step,
+                    g.isEditor && g.editing ? sm.acceptsNav : sm.isSelectable, 
+                    sm
+                );
+            },
+            cell, newCell, r, c, ae;
+
+        switch(k){
+            case e.ESC:
+            case e.PAGE_UP:
+            case e.PAGE_DOWN:
+                
+                break;
+            default:
+                
+                e.stopEvent();
+                break;
+        }
+
+        if(!s){
+            cell = walk(0, 0, 1); 
+            if(cell){
+                this.select(cell[0], cell[1]);
+            }
+            return;
+        }
+
+        cell = s.cell;  
+        r = cell[0];    
+        c = cell[1];    
+        
+        switch(k){
+            case e.TAB:
+                if(e.shiftKey){
+                    newCell = walk(r, c - 1, -1);
+                }else{
+                    newCell = walk(r, c + 1, 1);
+                }
+                break;
+            case e.DOWN:
+                newCell = walk(r + 1, c, 1);
+                break;
+            case e.UP:
+                newCell = walk(r - 1, c, -1);
+                break;
+            case e.RIGHT:
+                newCell = walk(r, c + 1, 1);
+                break;
+            case e.LEFT:
+                newCell = walk(r, c - 1, -1);
+                break;
+            case e.ENTER:
+                if (g.isEditor && !g.editing) {
+                    g.startEditing(r, c);
+                    return;
+                }
+                break;
+        }
+
+        if(newCell){
+            
+            r = newCell[0];
+            c = newCell[1];
+
+            this.select(r, c); 
+
+            if(g.isEditor && g.editing){ 
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    
+                    ae.field.triggerBlur();
+                }
+                g.startEditing(r, c);
+            }
+        }
+    },
+
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    }
+});
+Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    
+    clicksToEdit: 2,
+
+    
+    forceValidation: false,
+
+    
+    isEditor : true,
+    
+    detectEdit: false,
+
+    
+    autoEncode : false,
+
+    
+    
+    trackMouseOver: false, 
+
+    
+    initComponent : function(){
+        Ext.grid.EditorGridPanel.superclass.initComponent.call(this);
+
+        if(!this.selModel){
+            
+            this.selModel = new Ext.grid.CellSelectionModel();
+        }
+
+        this.activeEditor = null;
+
+        this.addEvents(
+            
+            "beforeedit",
+            
+            "afteredit",
+            
+            "validateedit"
+        );
+    },
+
+    
+    initEvents : function(){
+        Ext.grid.EditorGridPanel.superclass.initEvents.call(this);
+
+        this.getGridEl().on('mousewheel', this.stopEditing.createDelegate(this, [true]), this);
+        this.on('columnresize', this.stopEditing, this, [true]);
+
+        if(this.clicksToEdit == 1){
+            this.on("cellclick", this.onCellDblClick, this);
+        }else {
+            var view = this.getView();
+            if(this.clicksToEdit == 'auto' && view.mainBody){
+                view.mainBody.on('mousedown', this.onAutoEditClick, this);
+            }
+            this.on('celldblclick', this.onCellDblClick, this);
+        }
+    },
+
+    onResize : function(){
+        Ext.grid.EditorGridPanel.superclass.onResize.apply(this, arguments);
+        var ae = this.activeEditor;
+        if(this.editing && ae){
+            ae.realign(true);
+        }
+    },
+
+    
+    onCellDblClick : function(g, row, col){
+        this.startEditing(row, col);
+    },
+
+    
+    onAutoEditClick : function(e, t){
+        if(e.button !== 0){
+            return;
+        }
+        var row = this.view.findRowIndex(t),
+            col = this.view.findCellIndex(t);
+        if(row !== false && col !== false){
+            this.stopEditing();
+            if(this.selModel.getSelectedCell){ 
+                var sc = this.selModel.getSelectedCell();
+                if(sc && sc[0] === row && sc[1] === col){
+                    this.startEditing(row, col);
+                }
+            }else{
+                if(this.selModel.isSelected(row)){
+                    this.startEditing(row, col);
+                }
+            }
+        }
+    },
+
+    
+    onEditComplete : function(ed, value, startValue){
+        this.editing = false;
+        this.lastActiveEditor = this.activeEditor;
+        this.activeEditor = null;
+
+        var r = ed.record,
+            field = this.colModel.getDataIndex(ed.col);
+        value = this.postEditValue(value, startValue, r, field);
+        if(this.forceValidation === true || String(value) !== String(startValue)){
+            var e = {
+                grid: this,
+                record: r,
+                field: field,
+                originalValue: startValue,
+                value: value,
+                row: ed.row,
+                column: ed.col,
+                cancel:false
+            };
+            if(this.fireEvent("validateedit", e) !== false && !e.cancel && String(value) !== String(startValue)){
+                r.set(field, e.value);
+                delete e.cancel;
+                this.fireEvent("afteredit", e);
+            }
+        }
+        this.view.focusCell(ed.row, ed.col);
+    },
+
+    
+    startEditing : function(row, col){
+        this.stopEditing();
+        if(this.colModel.isCellEditable(col, row)){
+            this.view.ensureVisible(row, col, true);
+            var r = this.store.getAt(row),
+                field = this.colModel.getDataIndex(col),
+                e = {
+                    grid: this,
+                    record: r,
+                    field: field,
+                    value: r.data[field],
+                    row: row,
+                    column: col,
+                    cancel:false
+                };
+            if(this.fireEvent("beforeedit", e) !== false && !e.cancel){
+                this.editing = true;
+                var ed = this.colModel.getCellEditor(col, row);
+                if(!ed){
+                    return;
+                }
+                if(!ed.rendered){
+                    ed.parentEl = this.view.getEditorParent(ed);
+                    ed.on({
+                        scope: this,
+                        render: {
+                            fn: function(c){
+                                c.field.focus(false, true);
+                            },
+                            single: true,
+                            scope: this
+                        },
+                        specialkey: function(field, e){
+                            this.getSelectionModel().onEditorKey(field, e);
+                        },
+                        complete: this.onEditComplete,
+                        canceledit: this.stopEditing.createDelegate(this, [true])
+                    });
+                }
+                Ext.apply(ed, {
+                    row     : row,
+                    col     : col,
+                    record  : r
+                });
+                this.lastEdit = {
+                    row: row,
+                    col: col
+                };
+                this.activeEditor = ed;
+                
+                
+                ed.selectSameEditor = (this.activeEditor == this.lastActiveEditor);
+                var v = this.preEditValue(r, field);
+                ed.startEdit(this.view.getCell(row, col).firstChild, Ext.isDefined(v) ? v : '');
+
+                
+                (function(){
+                    delete ed.selectSameEditor;
+                }).defer(50);
+            }
+        }
+    },
+
+    
+    preEditValue : function(r, field){
+        var value = r.data[field];
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlDecode(value) : value;
+    },
+
+    
+    postEditValue : function(value, originalValue, r, field){
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
+    },
+
+    
+    stopEditing : function(cancel){
+        if(this.editing){
+            
+            var ae = this.lastActiveEditor = this.activeEditor;
+            if(ae){
+                ae[cancel === true ? 'cancelEdit' : 'completeEdit']();
+                this.view.focusCell(ae.row, ae.col);
+            }
+            this.activeEditor = null;
+        }
+        this.editing = false;
+    }
+});
+Ext.reg('editorgrid', Ext.grid.EditorGridPanel);
+
+Ext.grid.GridEditor = function(field, config){
+    Ext.grid.GridEditor.superclass.constructor.call(this, field, config);
+    field.monitorTab = false;
+};
+
+Ext.extend(Ext.grid.GridEditor, Ext.Editor, {
+    alignment: "tl-tl",
+    autoSize: "width",
+    hideEl : false,
+    cls: "x-small-editor x-grid-editor",
+    shim:false,
+    shadow:false
+});
+Ext.grid.PropertyRecord = Ext.data.Record.create([
+    {name:'name',type:'string'}, 'value'
+]);
+
+
+Ext.grid.PropertyStore = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(grid, source){
+        this.grid = grid;
+        this.store = new Ext.data.Store({
+            recordType : Ext.grid.PropertyRecord
+        });
+        this.store.on('update', this.onUpdate,  this);
+        if(source){
+            this.setSource(source);
+        }
+        Ext.grid.PropertyStore.superclass.constructor.call(this);    
+    },
+    
+    
+    setSource : function(o){
+        this.source = o;
+        this.store.removeAll();
+        var data = [];
+        for(var k in o){
+            if(this.isEditableValue(o[k])){
+                data.push(new Ext.grid.PropertyRecord({name: k, value: o[k]}, k));
+            }
+        }
+        this.store.loadRecords({records: data}, {}, true);
+    },
+
+    
+    onUpdate : function(ds, record, type){
+        if(type == Ext.data.Record.EDIT){
+            var v = record.data.value;
+            var oldValue = record.modified.value;
+            if(this.grid.fireEvent('beforepropertychange', this.source, record.id, v, oldValue) !== false){
+                this.source[record.id] = v;
+                record.commit();
+                this.grid.fireEvent('propertychange', this.source, record.id, v, oldValue);
+            }else{
+                record.reject();
+            }
+        }
+    },
+
+    
+    getProperty : function(row){
+       return this.store.getAt(row);
+    },
+
+    
+    isEditableValue: function(val){
+        return Ext.isPrimitive(val) || Ext.isDate(val);
+    },
+
+    
+    setValue : function(prop, value, create){
+        var r = this.getRec(prop);
+        if(r){
+            r.set('value', value);
+            this.source[prop] = value;
+        }else if(create){
+            
+            this.source[prop] = value;
+            r = new Ext.grid.PropertyRecord({name: prop, value: value}, prop);
+            this.store.add(r);
+
+        }
+    },
+    
+    
+    remove : function(prop){
+        var r = this.getRec(prop);
+        if(r){
+            this.store.remove(r);
+            delete this.source[prop];
+        }
+    },
+    
+    
+    getRec : function(prop){
+        return this.store.getById(prop);
+    },
+
+    
+    getSource : function(){
+        return this.source;
+    }
+});
+
+
+Ext.grid.PropertyColumnModel = Ext.extend(Ext.grid.ColumnModel, {
+    
+    nameText : 'Name',
+    valueText : 'Value',
+    dateFormat : 'm/j/Y',
+    trueText: 'true',
+    falseText: 'false',
+    
+    constructor : function(grid, store){
+        var g = Ext.grid,
+	        f = Ext.form;
+	        
+	    this.grid = grid;
+	    g.PropertyColumnModel.superclass.constructor.call(this, [
+	        {header: this.nameText, width:50, sortable: true, dataIndex:'name', id: 'name', menuDisabled:true},
+	        {header: this.valueText, width:50, resizable:false, dataIndex: 'value', id: 'value', menuDisabled:true}
+	    ]);
+	    this.store = store;
+	
+	    var bfield = new f.Field({
+	        autoCreate: {tag: 'select', children: [
+	            {tag: 'option', value: 'true', html: this.trueText},
+	            {tag: 'option', value: 'false', html: this.falseText}
+	        ]},
+	        getValue : function(){
+	            return this.el.dom.value == 'true';
+	        }
+	    });
+	    this.editors = {
+	        'date' : new g.GridEditor(new f.DateField({selectOnFocus:true})),
+	        'string' : new g.GridEditor(new f.TextField({selectOnFocus:true})),
+	        'number' : new g.GridEditor(new f.NumberField({selectOnFocus:true, style:'text-align:left;'})),
+	        'boolean' : new g.GridEditor(bfield, {
+	            autoSize: 'both'
+	        })
+	    };
+	    this.renderCellDelegate = this.renderCell.createDelegate(this);
+	    this.renderPropDelegate = this.renderProp.createDelegate(this);
+    },
+
+    
+    renderDate : function(dateVal){
+        return dateVal.dateFormat(this.dateFormat);
+    },
+
+    
+    renderBool : function(bVal){
+        return this[bVal ? 'trueText' : 'falseText'];
+    },
+
+    
+    isCellEditable : function(colIndex, rowIndex){
+        return colIndex == 1;
+    },
+
+    
+    getRenderer : function(col){
+        return col == 1 ?
+            this.renderCellDelegate : this.renderPropDelegate;
+    },
+
+    
+    renderProp : function(v){
+        return this.getPropertyName(v);
+    },
+
+    
+    renderCell : function(val, meta, rec){
+        var renderer = this.grid.customRenderers[rec.get('name')];
+        if(renderer){
+            return renderer.apply(this, arguments);
+        }
+        var rv = val;
+        if(Ext.isDate(val)){
+            rv = this.renderDate(val);
+        }else if(typeof val == 'boolean'){
+            rv = this.renderBool(val);
+        }
+        return Ext.util.Format.htmlEncode(rv);
+    },
+
+    
+    getPropertyName : function(name){
+        var pn = this.grid.propertyNames;
+        return pn && pn[name] ? pn[name] : name;
+    },
+
+    
+    getCellEditor : function(colIndex, rowIndex){
+        var p = this.store.getProperty(rowIndex),
+            n = p.data.name, 
+            val = p.data.value;
+        if(this.grid.customEditors[n]){
+            return this.grid.customEditors[n];
+        }
+        if(Ext.isDate(val)){
+            return this.editors.date;
+        }else if(typeof val == 'number'){
+            return this.editors.number;
+        }else if(typeof val == 'boolean'){
+            return this.editors['boolean'];
+        }else{
+            return this.editors.string;
+        }
+    },
+
+    
+    destroy : function(){
+        Ext.grid.PropertyColumnModel.superclass.destroy.call(this);
+        this.destroyEditors(this.editors);
+        this.destroyEditors(this.grid.customEditors);
+    },
+    
+    destroyEditors: function(editors){
+        for(var ed in editors){
+            Ext.destroy(editors[ed]);
+        }
+    }
+});
+
+
+Ext.grid.PropertyGrid = Ext.extend(Ext.grid.EditorGridPanel, {
+    
+    
+    
+    
+    
+
+    
+    enableColumnMove:false,
+    stripeRows:false,
+    trackMouseOver: false,
+    clicksToEdit:1,
+    enableHdMenu : false,
+    viewConfig : {
+        forceFit:true
+    },
+
+    
+    initComponent : function(){
+        this.customRenderers = this.customRenderers || {};
+        this.customEditors = this.customEditors || {};
+        this.lastEditRow = null;
+        var store = new Ext.grid.PropertyStore(this);
+        this.propStore = store;
+        var cm = new Ext.grid.PropertyColumnModel(this, store);
+        store.store.sort('name', 'ASC');
+        this.addEvents(
+            
+            'beforepropertychange',
+            
+            'propertychange'
+        );
+        this.cm = cm;
+        this.ds = store.store;
+        Ext.grid.PropertyGrid.superclass.initComponent.call(this);
+
+		this.mon(this.selModel, 'beforecellselect', function(sm, rowIndex, colIndex){
+            if(colIndex === 0){
+                this.startEditing.defer(200, this, [rowIndex, 1]);
+                return false;
+            }
+        }, this);
+    },
+
+    
+    onRender : function(){
+        Ext.grid.PropertyGrid.superclass.onRender.apply(this, arguments);
+
+        this.getGridEl().addClass('x-props-grid');
+    },
+
+    
+    afterRender: function(){
+        Ext.grid.PropertyGrid.superclass.afterRender.apply(this, arguments);
+        if(this.source){
+            this.setSource(this.source);
+        }
+    },
+
+    
+    setSource : function(source){
+        this.propStore.setSource(source);
+    },
+
+    
+    getSource : function(){
+        return this.propStore.getSource();
+    },
+    
+    
+    setProperty : function(prop, value, create){
+        this.propStore.setValue(prop, value, create);    
+    },
+    
+    
+    removeProperty : function(prop){
+        this.propStore.remove(prop);
+    }
+
+    
+    
+    
+    
+});
+Ext.reg("propertygrid", Ext.grid.PropertyGrid);
+
+Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {
+
+    
+    groupByText : 'Group By This Field',
+    
+    showGroupsText : 'Show in Groups',
+    
+    hideGroupedColumn : false,
+    
+    showGroupName : true,
+    
+    startCollapsed : false,
+    
+    enableGrouping : true,
+    
+    enableGroupingMenu : true,
+    
+    enableNoGroups : true,
+    
+    emptyGroupText : '(None)',
+    
+    ignoreAdd : false,
+    
+    groupTextTpl : '{text}',
+
+    
+    groupMode: 'value',
+
+    
+    
+    
+    cancelEditOnToggle: true,
+
+    
+    initTemplates : function(){
+        Ext.grid.GroupingView.superclass.initTemplates.call(this);
+        this.state = {};
+
+        var sm = this.grid.getSelectionModel();
+        sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',
+                this.onBeforeRowSelect, this);
+
+        if(!this.startGroup){
+            this.startGroup = new Ext.XTemplate(
+                '<div id="{groupId}" class="x-grid-group {cls}">',
+                    '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">', this.groupTextTpl ,'</div></div>',
+                    '<div id="{groupId}-bd" class="x-grid-group-body">'
+            );
+        }
+        this.startGroup.compile();
+
+        if (!this.endGroup) {
+            this.endGroup = '</div></div>';
+        }
+    },
+
+    
+    findGroup : function(el){
+        return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);
+    },
+
+    
+    getGroups : function(){
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    
+    onAdd : function(ds, records, index) {
+        if (this.canGroup() && !this.ignoreAdd) {
+            var ss = this.getScrollState();
+            this.fireEvent('beforerowsinserted', ds, index, index + (records.length-1));
+            this.refresh();
+            this.restoreScroll(ss);
+            this.fireEvent('rowsinserted', ds, index, index + (records.length-1));
+        } else if (!this.canGroup()) {
+            Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);
+        }
+    },
+
+    
+    onRemove : function(ds, record, index, isUpdate){
+        Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);
+        var g = document.getElementById(record._groupId);
+        if(g && g.childNodes[1].childNodes.length < 1){
+            Ext.removeNode(g);
+        }
+        this.applyEmptyText();
+    },
+
+    
+    refreshRow : function(record){
+        if(this.ds.getCount()==1){
+            this.refresh();
+        }else{
+            this.isUpdating = true;
+            Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);
+            this.isUpdating = false;
+        }
+    },
+
+    
+    beforeMenuShow : function(){
+        var item, items = this.hmenu.items, disabled = this.cm.config[this.hdCtxIndex].groupable === false;
+        if((item = items.get('groupBy'))){
+            item.setDisabled(disabled);
+        }
+        if((item = items.get('showGroups'))){
+            item.setDisabled(disabled);
+            item.setChecked(this.canGroup(), true);
+        }
+    },
+
+    
+    renderUI : function(){
+        var markup = Ext.grid.GroupingView.superclass.renderUI.call(this);
+
+        if(this.enableGroupingMenu && this.hmenu){
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            if(this.enableNoGroups){
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+        return markup;
+    },
+
+    processEvent: function(name, e){
+        Ext.grid.GroupingView.superclass.processEvent.call(this, name, e);
+        var hd = e.getTarget('.x-grid-group-hd', this.mainBody);
+        if(hd){
+            
+            var field = this.getGroupField(),
+                prefix = this.getPrefix(field),
+                groupValue = hd.id.substring(prefix.length),
+                emptyRe = new RegExp('gp-' + Ext.escapeRe(field) + '--hd');
+
+            
+            groupValue = groupValue.substr(0, groupValue.length - 3);
+            
+            
+            if(groupValue || emptyRe.test(hd.id)){
+                this.grid.fireEvent('group' + name, this.grid, field, groupValue, e);
+            }
+            if(name == 'mousedown' && e.button == 0){
+                this.toggleGroup(hd.parentNode);
+            }
+        }
+
+    },
+
+    
+    onGroupByClick : function(){
+        var grid = this.grid;
+        this.enableGrouping = true;
+        grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));
+        grid.fireEvent('groupchange', grid, grid.store.getGroupState());
+        this.beforeMenuShow(); 
+        this.refresh();
+    },
+
+    
+    onShowGroupsClick : function(mi, checked){
+        this.enableGrouping = checked;
+        if(checked){
+            this.onGroupByClick();
+        }else{
+            this.grid.store.clearGrouping();
+            this.grid.fireEvent('groupchange', this, null);
+        }
+    },
+
+    
+    toggleRowIndex : function(rowIndex, expanded){
+        if(!this.canGroup()){
+            return;
+        }
+        var row = this.getRow(rowIndex);
+        if(row){
+            this.toggleGroup(this.findGroup(row), expanded);
+        }
+    },
+
+    
+    toggleGroup : function(group, expanded){
+        var gel = Ext.get(group),
+            id = Ext.util.Format.htmlEncode(gel.id);
+ 
+        expanded = Ext.isDefined(expanded) ? expanded : gel.hasClass('x-grid-group-collapsed');
+        if(this.state[id] !== expanded){
+            if (this.cancelEditOnToggle !== false) {
+                this.grid.stopEditing(true);
+            }
+            this.state[id] = expanded;
+            gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');
+        }
+    },
+
+    
+    toggleAllGroups : function(expanded){
+        var groups = this.getGroups();
+        for(var i = 0, len = groups.length; i < len; i++){
+            this.toggleGroup(groups[i], expanded);
+        }
+    },
+
+    
+    expandAllGroups : function(){
+        this.toggleAllGroups(true);
+    },
+
+    
+    collapseAllGroups : function(){
+        this.toggleAllGroups(false);
+    },
+
+    
+    getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){
+        var column = this.cm.config[colIndex],
+            g = groupRenderer ? groupRenderer.call(column.scope, v, {}, r, rowIndex, colIndex, ds) : String(v);
+        if(g === '' || g === '&#160;'){
+            g = column.emptyGroupText || this.emptyGroupText;
+        }
+        return g;
+    },
+
+    
+    getGroupField : function(){
+        return this.grid.store.getGroupState();
+    },
+
+    
+    afterRender : function(){
+        if(!this.ds || !this.cm){
+            return;
+        }
+        Ext.grid.GroupingView.superclass.afterRender.call(this);
+        if(this.grid.deferRowRender){
+            this.updateGroupWidths();
+        }
+    },
+    
+    afterRenderUI: function () {
+        Ext.grid.GroupingView.superclass.afterRenderUI.call(this);
+
+        if (this.enableGroupingMenu && this.hmenu) {
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            
+            if (this.enableNoGroups) {
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+    },
+
+    
+    renderRows : function(){
+        var groupField = this.getGroupField();
+        var eg = !!groupField;
+        
+        if(this.hideGroupedColumn) {
+            var colIndex = this.cm.findColumnIndex(groupField),
+                hasLastGroupField = Ext.isDefined(this.lastGroupField);
+            if(!eg && hasLastGroupField){
+                this.mainBody.update('');
+                this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);
+                delete this.lastGroupField;
+            }else if (eg && !hasLastGroupField){
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }else if (eg && hasLastGroupField && groupField !== this.lastGroupField) {
+                this.mainBody.update('');
+                var oldIndex = this.cm.findColumnIndex(this.lastGroupField);
+                this.cm.setHidden(oldIndex, false);
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }
+        }
+        return Ext.grid.GroupingView.superclass.renderRows.apply(
+                    this, arguments);
+    },
+
+    
+    doRender : function(cs, rs, ds, startRow, colCount, stripe){
+        if(rs.length < 1){
+            return '';
+        }
+
+        if(!this.canGroup() || this.isUpdating){
+            return Ext.grid.GroupingView.superclass.doRender.apply(this, arguments);
+        }
+
+        var groupField = this.getGroupField(),
+            colIndex = this.cm.findColumnIndex(groupField),
+            g,
+            gstyle = 'width:' + this.getTotalWidth() + ';',
+            cfg = this.cm.config[colIndex],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            prefix = this.showGroupName ? (cfg.groupName || cfg.header)+': ' : '',
+            groups = [],
+            curGroup, i, len, gid;
+
+        for(i = 0, len = rs.length; i < len; i++){
+            var rowIndex = startRow + i,
+                r = rs[i],
+                gvalue = r.data[groupField];
+
+                g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);
+            if(!curGroup || curGroup.group != g){
+                gid = this.constructId(gvalue, groupField, colIndex);
+                
+                
+                this.state[gid] = !(Ext.isDefined(this.state[gid]) ? !this.state[gid] : this.startCollapsed);
+                curGroup = {
+                    group: g,
+                    gvalue: gvalue,
+                    text: prefix + g,
+                    groupId: gid,
+                    startRow: rowIndex,
+                    rs: [r],
+                    cls: this.state[gid] ? '' : 'x-grid-group-collapsed',
+                    style: gstyle
+                };
+                groups.push(curGroup);
+            }else{
+                curGroup.rs.push(r);
+            }
+            r._groupId = gid;
+        }
+
+        var buf = [];
+        for(i = 0, len = groups.length; i < len; i++){
+            g = groups[i];
+            this.doGroupStart(buf, g, cs, ds, colCount);
+            buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(
+                    this, cs, g.rs, ds, g.startRow, colCount, stripe);
+
+            this.doGroupEnd(buf, g, cs, ds, colCount);
+        }
+        return buf.join('');
+    },
+
+    
+    getGroupId : function(value){
+        var field = this.getGroupField();
+        return this.constructId(value, field, this.cm.findColumnIndex(field));
+    },
+
+    
+    constructId : function(value, field, idx){
+        var cfg = this.cm.config[idx],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            val = (this.groupMode == 'value') ? value : this.getGroup(value, {data:{}}, groupRenderer, 0, idx, this.ds);
+
+        return this.getPrefix(field) + Ext.util.Format.htmlEncode(val);
+    },
+
+    
+    canGroup  : function(){
+        return this.enableGrouping && !!this.getGroupField();
+    },
+
+    
+    getPrefix: function(field){
+        return this.grid.getGridEl().id + '-gp-' + field + '-';
+    },
+
+    
+    doGroupStart : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.startGroup.apply(g);
+    },
+
+    
+    doGroupEnd : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.endGroup;
+    },
+
+    
+    getRows : function(){
+        if(!this.canGroup()){
+            return Ext.grid.GroupingView.superclass.getRows.call(this);
+        }
+        var r = [],
+            gs = this.getGroups(),
+            g,
+            i = 0,
+            len = gs.length,
+            j,
+            jlen;
+        for(; i < len; ++i){
+            g = gs[i].childNodes[1];
+            if(g){
+                g = g.childNodes;
+                for(j = 0, jlen = g.length; j < jlen; ++j){
+                    r[r.length] = g[j];
+                }
+            }
+        }
+        return r;
+    },
+
+    
+    updateGroupWidths : function(){
+        if(!this.canGroup() || !this.hasRows()){
+            return;
+        }
+        var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.getScrollOffset()) +'px';
+        var gs = this.getGroups();
+        for(var i = 0, len = gs.length; i < len; i++){
+            gs[i].firstChild.style.width = tw;
+        }
+    },
+
+    
+    onColumnWidthUpdated : function(col, w, tw){
+        Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this, col, w, tw);
+        this.updateGroupWidths();
+    },
+
+    
+    onAllColumnWidthsUpdated : function(ws, tw){
+        Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this, ws, tw);
+        this.updateGroupWidths();
+    },
+
+    
+    onColumnHiddenUpdated : function(col, hidden, tw){
+        Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this, col, hidden, tw);
+        this.updateGroupWidths();
+    },
+
+    
+    onLayout : function(){
+        this.updateGroupWidths();
+    },
+
+    
+    onBeforeRowSelect : function(sm, rowIndex){
+        this.toggleRowIndex(rowIndex, true);
+    }
+});
+
+Ext.grid.GroupingView.GROUP_ID = 1000;
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-bg.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-bg.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-bg.js	(revision 76)
@@ -0,0 +1,280 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Bulgarian Translation
+ *
+ * By ÐÐµÐŸÑÐ³Ðž ÐÐŸÑÑÐ°ÐŽÐžÐœÐŸÐ², ÐÐ°Ð»Ð³Ð°ÑÐž, ÐÐ°ÐœÐ°ÐŽÐ°
+ * 10 October 2007
+ * By Nedko Penev 
+ * 26 October 2007
+ *
+ * (utf-8 encoding)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÐÐ°ÑÐµÐ¶ÐŽÐ°ÐœÐµ...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} ÐžÐ·Ð±ÑÐ°ÐœÐž ÐºÐŸÐ»ÐŸÐœÐž";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "ÐÐ°ÑÐ²ÐŸÑÐž ÑÐ°Ð±";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "ÐÐµÐ²Ð°Ð»ÐžÐŽÐœÐ° ÑÑÐŸÐ¹ÐœÐŸÑÑ ÐœÐ° Ð¿ÐŸÐ»ÐµÑÐŸ";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "ÐÐ°ÑÐµÐ¶ÐŽÐ°ÐœÐµ...";
+}
+
+Date.monthNames = [
+  "Ð¯ÐœÑÐ°ÑÐž",
+  "Ð€ÐµÐ²ÑÑÐ°ÑÐž",
+  "ÐÐ°ÑÑ",
+  "ÐÐ¿ÑÐžÐ»",
+  "ÐÐ°Ð¹",
+  "Ð®ÐœÐž",
+  "Ð®Ð»Ðž",
+  "ÐÐ²Ð³ÑÑÑ",
+  "Ð¡ÐµÐ¿ÑÐµÐŒÐ²ÑÐž",
+  "ÐÐºÑÐŸÐŒÐ²ÑÐž",
+  "ÐÐŸÐµÐŒÐ²ÑÐž",
+  "ÐÐµÐºÐµÐŒÐ²ÑÐž"
+];
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.dayNames = [
+  "ÐÐµÐŽÐµÐ»Ñ",
+  "ÐÐŸÐœÐµÐŽÐµÐ»ÐœÐžÐº",
+  "ÐÑÐŸÑÐœÐžÐº",
+  "Ð¡ÑÑÐŽÐ°",
+  "Ð§ÐµÑÐ²ÑÑÑÑÐº",
+  "ÐÐµÑÑÐº",
+  "Ð¡ÑÐ±ÐŸÑÐ°"
+];
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "ÐÑÐŒÐµÐœÐž",
+    yes    : "ÐÐ°",
+    no     : "ÐÐµ"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d.m.Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "ÐÐœÐµÑ",
+    minText           : "Ð¢Ð°Ð·Ðž ÐŽÐ°ÑÐ° Ðµ Ð¿ÑÐµÐŽÐž ÐŒÐžÐœÐžÐŒÐ°Ð»ÐœÐ°ÑÐ°",
+    maxText           : "Ð¢Ð°Ð·Ðž ÐŽÐ°ÑÐ° Ðµ ÑÐ»ÐµÐŽ ÐŒÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ°ÑÐ°",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Ð¡Ð»ÐµÐŽÐ²Ð°Ñ ÐŒÐµÑÐµÑ (Control+Right)',
+    prevText          : 'ÐÑÐµÐŽÐžÑÐµÐœ ÐŒÐµÑÐµÑ (Control+Left)',
+    monthYearText     : 'ÐÐ·Ð±ÐµÑÐž ÐŒÐµÑÐµÑ (Control+Up/Down Ð·Ð° Ð¿ÑÐµÐŒÐµÑÑÐ²Ð°ÐœÐµ Ð¿ÐŸ Ð³ÐŸÐŽÐžÐœÐž)',
+    todayTip          : "{0} (Spacebar)",
+    format            : "d.m.y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "ÐÑÐŒÐµÐœÐž",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+    afterPageText  : "ÐŸÑ {0}",
+    firstText      : "ÐÑÑÐ²Ð° ÑÑÑÐ°ÐœÐžÑÐ°",
+    prevText       : "ÐÑÐµÐŽÐžÑÐœÐ° ÑÑÑÐ°ÐœÐžÑÐ°",
+    nextText       : "Ð¡Ð»ÐµÐŽÐ²Ð°ÑÐ° ÑÑÑÐ°ÐœÐžÑÐ°",
+    lastText       : "ÐÐŸÑÐ»ÐµÐŽÐœÐ° ÑÑÑÐ°ÐœÐžÑÐ°",
+    refreshText    : "ÐÑÐµÐ·Ð°ÑÐµÐŽÐž",
+    displayMsg     : "ÐÐŸÐºÐ°Ð·Ð²Ð°Ð¹ÐºÐž {0} - {1} ÐŸÑ {2}",
+    emptyMsg       : 'ÐÑÐŒÐ° ÐŽÐ°ÐœÐœÐž Ð·Ð° Ð¿ÐŸÐºÐ°Ð·Ð²Ð°ÐœÐµ'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÐŽÑÐ»Ð¶ÐžÐœÐ° ÐœÐ° ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+    maxLengthText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÐŽÑÐ»Ð¶ÐžÐœÐ° ÐœÐ° ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+    blankText     : "Ð¢ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ Ð·Ð°ÐŽÑÐ»Ð¶ÐžÑÐµÐ»ÐœÐŸ",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÑÑÐŸÐ¹ÐœÐŸÑÑ Ð·Ð° ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+    maxText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÑÑÐŸÐ¹ÐœÐŸÑÑ Ð·Ð° ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+    nanText : "{0} ÐœÐµ Ðµ Ð²Ð°Ð»ÐžÐŽÐœÐŸ ÑÐžÑÐ»ÐŸ"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "ÐÐµÐŽÐŸÑÑÑÐ¿ÐµÐœ",
+    disabledDatesText : "ÐÐµÐŽÐŸÑÑÑÐ¿ÐµÐœ",
+    minText           : "ÐÐ°ÑÐ°ÑÐ° Ð² ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° Ðµ ÑÐ»ÐµÐŽ {0}",
+    maxText           : "ÐÐ°ÑÐ°ÑÐ° Ð² ÑÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° Ðµ Ð¿ÑÐµÐŽÐž {0}",
+    invalidText       : "{0} ÐœÐµ Ðµ Ð²Ð°Ð»ÐžÐŽÐœÐ° ÐŽÐ°ÑÐ° - ÑÑÑÐ±Ð²Ð° ÐŽÐ° Ð±ÑÐŽÐµ Ð²ÑÐ² ÑÐŸÑÐŒÐ°Ñ {1}",
+    format            : "d.m.y",
+    altFormats        : "d.m.y|d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "ÐÐ°ÑÐµÐ¶ÐŽÐ°ÐœÐµ...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Ð¢ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° Ð±ÑÐŽÐµ ÐµÐŒÐµÐ¹Ð» Ð²ÑÐ² ÑÐŸÑÐŒÐ°Ñ "user@example.com"',
+    urlText      : 'Ð¢ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° Ð±ÑÐŽÐµ URL Ð²ÑÐ² ÑÐŸÑÐŒÐ°Ñ "http:/'+'/www.example.com"',
+    alphaText    : 'Ð¢ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° ÑÑÐŽÑÑÐ¶Ð° ÑÐ°ÐŒÐŸ Ð±ÑÐºÐ²Ðž Ðž _',
+    alphanumText : 'Ð¢ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÑÐ±Ð²Ð° ÐŽÐ° ÑÑÐŽÑÑÐ¶Ð° ÑÐ°ÐŒÐŸ Ð±ÑÐºÐ²Ðž, ÑÐžÑÑÐž Ðž _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'ÐÐŸÐ»Ñ, Ð²ÑÐ²ÐµÐŽÐµÑÐµ URL Ð·Ð° Ð²ÑÑÐ·ÐºÐ°ÑÐ°:',
+    buttonTips : {
+      bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Ð£ÐŽÐµÐ±ÐµÐ»ÑÐ²Ð° ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'ÐÑÐ°Ð²Ðž ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ ÐºÑÑÑÐžÐ².',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Underline (Ctrl+U)',
+        text: 'ÐÐŸÐŽÑÐµÑÑÐ°Ð²Ð° ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Ð£Ð³ÐŸÐ»ÐµÐŒÐž ÑÐµÐºÑÑÐ°',
+        text: 'Ð£Ð³ÐŸÐ»ÐµÐŒÑÐ²Ð° ÑÐ°Ð·ÐŒÐµÑÐ° ÐœÐ° ÑÑÐžÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'ÐÐ°ÐŒÐ°Ð»Ðž ÑÐµÐºÑÑÐ°',
+        text: 'ÐÐ°ÐŒÐ°Ð»ÑÐ²Ð° ÑÐ°Ð·ÐŒÐµÑÐ° ÐœÐ° ÑÑÐžÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'ÐŠÐ²ÑÑ ÐœÐ° ÐŒÐ°ÑÐºÐžÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ',
+        text: 'ÐÑÐŸÐŒÐµÐœÑ ÑÐŸÐœÐŸÐ²ÐžÑ ÑÐ²ÑÑ ÐœÐ° ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'ÐŠÐ²ÑÑ ÐœÐ° ÑÑÐžÑÑÐ°',
+        text: 'ÐÑÐŸÐŒÐµÐœÑ ÑÐ²ÐµÑÐ° ÐœÐ° ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'ÐÑÐ²ÐŸ Ð¿ÐŸÐŽÑÐ°Ð²ÐœÑÐ²Ð°ÐœÐµ',
+        text: 'ÐÐŸÐŽÑÐ°Ð²ÐœÑÐ²Ð° ÑÐµÐºÑÑÐ° ÐœÐ° Ð»ÑÐ²ÐŸ.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'ÐŠÐµÐœÑÑÐžÑÐ°ÐœÐµ',
+        text: 'ÐŠÐµÐœÑÑÐžÑÐ° ÑÐµÐºÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'ÐÑÑÐœÐŸ Ð¿ÐŸÐŽÑÐ°Ð²ÐœÑÐ²Ð°ÐœÐµ',
+        text: 'ÐÐŸÐŽÑÐ°Ð²ÐœÑÐ²Ð° ÑÐµÐºÑÑÐ° ÐœÐ° ÐŽÑÑÐœÐŸ.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'ÐÐµÐœÐŸÐŒÐµÑÐžÑÐ°Ðœ ÑÐ¿ÐžÑÑÐº',
+        text: 'ÐÐ°Ð¿ÐŸÑÐ²Ð° ÐœÐµÐœÐŸÐŒÐµÑÐžÑÐ°Ðœ ÑÐ¿ÐžÑÑÐº.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ÐÐŸÐŒÐµÑÐžÑÐ°Ðœ ÑÐ¿ÐžÑÑÐº',
+        text: 'ÐÐ°Ð¿ÐŸÑÐ²Ð° ÐœÐŸÐŒÐµÑÐžÑÐ°Ðœ ÑÐ¿ÐžÑÑÐº.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Ð¥ÐžÐ¿ÐµÑÐ²ÑÑÐ·ÐºÐ°',
+        text: 'ÐÑÐµÐ²ÑÑÑÐ° ÐžÐ·Ð±ÑÐ°ÐœÐžÑ ÑÐµÐºÑÑ Ð² Ñ
+ÐžÐ¿ÐµÑÐ²ÑÑÐ·ÐºÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Ð ÐµÐŽÐ°ÐºÑÐžÑÐ°ÐœÐµ ÐœÐ° ÐºÐŸÐŽÐ°',
+        text: 'ÐÑÐµÐŒÐžÐœÐ°Ð²Ð°ÐœÐµ Ð² ÑÐµÐ¶ÐžÐŒ ÐœÐ° ÑÐµÐŽÐ°ÐºÑÐžÑÐ°ÐœÐµ ÐœÐ° ÐºÐŸÐŽÐ°.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "ÐÐŸÐŽÑÐµÐŽÐž Ð² ÐœÐ°ÑÐ°ÑÑÐ²Ð°Ñ ÑÐµÐŽ",
+    sortDescText : "ÐÐŸÐŽÑÐµÐŽÐž Ð² ÐœÐ°ÐŒÐ°Ð»ÑÐ²Ð°Ñ ÑÐµÐŽ",
+    lockText     : "ÐÐ°ÐºÐ»ÑÑÐž ÐºÐŸÐ»ÐŸÐœÐ°",
+    unlockText   : "ÐÑÐºÐ»ÑÑÐž ÐºÐŸÐ»ÐŸÐœÐ°",
+    columnsText  : "ÐÐŸÐ»ÐŸÐœÐž"
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "ÐÐŒÐµ",
+    valueText  : "Ð¡ÑÐŸÐ¹ÐœÐŸÑÑ",
+    dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "ÐÐ»Ð°ÑÐµÑÐµ Ñ ÐŒÐžÑÐºÐ°ÑÐ° Ð·Ð° ÐŽÐ° Ð¿ÑÐŸÐŒÐµÐœÐžÑÐµ ÑÐ°Ð·ÐŒÐµÑÐ°.",
+    collapsibleSplitTip : "ÐÐ»Ð°ÑÐµÑÐµ Ñ ÐŒÐžÑÐºÐ°ÑÐ° Ð·Ð° ÐŽÐ° Ð¿ÑÐŸÐŒÐµÐœÐžÑÐµ ÑÐ°Ð·ÐŒÐµÑÐ°. Ð§ÑÐºÐœÐµÑÐµ ÐŽÐ²Ð° Ð¿ÑÑÐž Ð·Ð° ÐŽÐ° ÑÐºÑÐžÐµÑÐµ."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-de.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-de.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-de.js	(revision 76)
@@ -0,0 +1,346 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * German translation
+ * 2007-Apr-07 update by schmidetzki and humpdi
+ * 2007-Oct-31 update by wm003
+ * 2009-Jul-10 update by Patrick Matsumura and Rupert Quaderer
+ * 2010-Mar-10 update by Volker Grabsch
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Ãbertrage Daten ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} Zeile(n) ausgewÃ€hlt";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Diesen Tab schlieÃen";
+}
+
+if(Ext.form.BasicForm){
+   Ext.form.BasicForm.prototype.waitTitle = "Bitte warten...";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Der Wert des Feldes ist nicht korrekt";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Ãbertrage Daten...";
+}
+
+Date.monthNames = [
+   "Januar",
+   "Februar",
+   "MÃ€rz",
+   "April",
+   "Mai",
+   "Juni",
+   "Juli",
+   "August",
+   "September",
+   "Oktober",
+   "November",
+   "Dezember"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  "M\u00e4r" : 2,
+  Apr : 3,
+  Mai : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Okt : 9,
+  Nov : 10,
+  Dez : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "Sonntag",
+   "Montag",
+   "Dienstag",
+   "Mittwoch",
+   "Donnerstag",
+   "Freitag",
+   "Samstag"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Abbrechen",
+      yes    : "Ja",
+      no     : "Nein"
+   };
+}
+
+if(Ext.util.Format){
+    Ext.util.Format.__number = Ext.util.Format.number;
+    Ext.util.Format.number = function(v, format) {
+        return Ext.util.Format.__number(v, format || "0.000,00/i");
+    };
+
+   Ext.util.Format.date = function(v, format) {
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Heute",
+      minText           : "Dieses Datum liegt von dem erstmÃ¶glichen Datum",
+      maxText           : "Dieses Datum liegt nach dem letztmÃ¶glichen Datum",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : "NÃ€chster Monat (Strg/Control + Rechts)",
+      prevText          : "Vorheriger Monat (Strg/Control + Links)",
+      monthYearText     : "Monat auswÃ€hlen (Strg/Control + Hoch/Runter, um ein Jahr auszuwÃ€hlen)",
+      todayTip          : "Heute ({0}) (Leertaste)",
+      format            : "d.m.Y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "Abbrechen",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Seite",
+      afterPageText  : "von {0}",
+      firstText      : "Erste Seite",
+      prevText       : "vorherige Seite",
+      nextText       : "nÃ€chste Seite",
+      lastText       : "letzte Seite",
+      refreshText    : "Aktualisieren",
+      displayMsg     : "Anzeige Eintrag {0} - {1} von {2}",
+      emptyMsg       : "Keine Daten vorhanden"
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Bitte geben Sie mindestens {0} Zeichen ein",
+      maxLengthText : "Bitte geben Sie maximal {0} Zeichen ein",
+      blankText     : "Dieses Feld darf nicht leer sein",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Der Mindestwert fÃŒr dieses Feld ist {0}",
+      maxText : "Der Maximalwert fÃŒr dieses Feld ist {0}",
+      nanText : "{0} ist keine Zahl",
+      decimalSeparator : ","
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "nicht erlaubt",
+      disabledDatesText : "nicht erlaubt",
+      minText           : "Das Datum in diesem Feld muss nach dem {0} liegen",
+      maxText           : "Das Datum in diesem Feld muss vor dem {0} liegen",
+      invalidText       : "{0} ist kein gÃŒltiges Datum - es muss im Format {1} eingegeben werden",
+      format            : "d.m.Y",
+      altFormats        : "j.n.Y|j.n.y|j.n.|j.|j/n/Y|j/n/y|j-n-y|j-n-Y|j/n|j-n|dm|dmy|dmY|j|Y-n-j",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Lade Daten ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Dieses Feld sollte eine E-Mail-Adresse enthalten. Format: "user@example.com"',
+      urlText      : 'Dieses Feld sollte eine URL enthalten. Format: "http:/'+'/www.example.com"',
+      alphaText    : 'Dieses Feld darf nur Buchstaben enthalten und _',
+      alphanumText : 'Dieses Feld darf nur Buchstaben und Zahlen enthalten und _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Bitte geben Sie die URL fÃŒr den Link ein:',
+    buttonTips : {
+      bold : {
+        title: 'Fett (Ctrl+B)',
+        text: 'Erstellt den ausgewÃ€hlten Text in Fettschrift.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursiv (Ctrl+I)',
+        text: 'Erstellt den ausgewÃ€hlten Text in SchrÃ€gschrift.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Unterstrichen (Ctrl+U)',
+        text: 'Unterstreicht den ausgewÃ€hlten Text.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Text vergÃ¶Ãern',
+        text: 'ErhÃ¶ht die SchriftgrÃ¶Ãe.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Text verkleinern',
+        text: 'Verringert die SchriftgrÃ¶Ãe.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Text farblich hervorheben',
+        text: 'Hintergrundfarbe des ausgewÃ€hlten Textes Ã€ndern.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Schriftfarbe',
+        text: 'Farbe des ausgewÃ€hlten Textes Ã€ndern.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'LinksbÃŒndig',
+        text: 'Setzt den Text linksbÃŒndig.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Zentrieren',
+        text: 'Zentriert den Text in Editor.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'RechtsbÃŒndig',
+        text: 'Setzt den Text rechtsbÃŒndig.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'AufzÃ€hlungsliste',
+        text: 'Beginnt eine AufzÃ€hlungsliste mit Spiegelstrichen.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numerierte Liste',
+        text: 'Beginnt eine numerierte Liste.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Erstellt einen Hyperlink aus dem ausgewÃ€hlten text.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Source bearbeiten',
+        text: 'Zur Bearbeitung des Quelltextes wechseln.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Aufsteigend sortieren",
+      sortDescText : "Absteigend sortieren",
+      lockText     : "Spalte sperren",
+      unlockText   : "Spalte freigeben (entsperren)",
+      columnsText  : "Spalten"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Keine)',
+    groupByText    : 'Dieses Feld gruppieren',
+    showGroupsText : 'In Gruppen anzeigen'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Name",
+      valueText  : "Wert",
+      dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.grid.BooleanColumn){
+   Ext.apply(Ext.grid.BooleanColumn.prototype, {
+      trueText  : "wahr",
+      falseText : "falsch"
+   });
+}
+
+if(Ext.grid.NumberColumn){
+    Ext.apply(Ext.grid.NumberColumn.prototype, {
+        format : '0.000,00/i'
+    });
+}
+
+if(Ext.grid.DateColumn){
+    Ext.apply(Ext.grid.DateColumn.prototype, {
+        format : 'd.m.Y'
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Ziehen, um GrÃ¶Ãe zu Ã€ndern.",
+    collapsibleSplitTip : "Ziehen, um GrÃ¶Ãe zu Ã€ndern. Doppelklick um Panel auszublenden."
+  });
+}
+
+if(Ext.form.TimeField){
+   Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "Die Zeit muss gleich oder nach {0} liegen",
+    maxText : "Die Zeit muss gleich oder vor {0} liegen",
+    invalidText : "{0} ist keine gÃŒltige Zeit",
+    format : "H:i"
+   });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "Du muÃt mehr als einen Eintrag aus der Gruppe auswÃ€hlen"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "Du muÃt einen Eintrag aus der Gruppe auswÃ€hlen"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-el_GR.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-el_GR.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-el_GR.js	(revision 76)
@@ -0,0 +1,361 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Greek translation
+ * By thesilentman (utf8 encoding)
+ * 27 Apr 2008
+ *
+ * Changes since previous (second) Version:
+ * + added Date.shortMonthNames 
+ * + added Date.getShortMonthName 
+ * + added Date.monthNumbers
+ * + added Ext.grid.GroupingView
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÎÎµÏÎ±ÏÏÏÏÏÏÎ· ÎŽÎµÎŽÎ¿ÎŒÎ­ÎœÏÎœ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ÎÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎµÏ ÏÎµÎ¹ÏÎ­Ï";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÎÎ»ÎµÎ¯ÏÏÎµ ÏÎ¿ tab";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Î€Î¿ ÏÎµÏÎ¹ÎµÏÏÎŒÎµÎœÎ¿ ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+ ÎŽÎµÎœ ÎµÎ¯ÎœÎ±Î¹ Î±ÏÎ¿ÎŽÎµÎºÏÏ";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ÎÎµÏÎ±ÏÏÏÏÏÏÎ· ÎŽÎµÎŽÎ¿ÎŒÎ­ÎœÏÎœ...";
+}
+
+Date.monthNames = [
+   "ÎÎ±ÎœÎ¿Ï
+Î¬ÏÎ¹Î¿Ï",
+   "ÎŠÎµÎ²ÏÎ¿Ï
+Î¬ÏÎ¹Î¿Ï",
+   "ÎÎ¬ÏÏÎ¹Î¿Ï",
+   "ÎÏÏÎ¯Î»Î¹Î¿Ï",
+   "ÎÎ¬Î¹Î¿Ï",
+   "ÎÎ¿ÏÎœÎ¹Î¿Ï",
+   "ÎÎ¿ÏÎ»Î¹Î¿Ï",
+   "ÎÏÎ³Î¿Ï
+ÏÏÎ¿Ï",
+   "Î£ÎµÏÏÎ­ÎŒÎ²ÏÎ¹Î¿Ï",
+   "ÎÎºÏÏÎ²ÏÎ¹Î¿Ï",
+   "ÎÎ¿Î­ÎŒÎ²ÏÎ¹Î¿Ï",
+   "ÎÎµÎºÎ­ÎŒÎ²ÏÎ¹Î¿Ï"
+];
+
+Date.shortMonthNames = [
+   "ÎÎ±Îœ",
+   "ÎŠÎµÎ²",
+   "ÎÎ¬Ï",
+   "ÎÏÏ",
+   "ÎÎ¬Î¹",
+   "ÎÎ¿Ï",
+   "ÎÎ¿Ï",
+   "ÎÏÎ³",
+   "Î£ÎµÏ",
+   "ÎÎºÏ",
+   "ÎÎ¿Î­",
+   "ÎÎµÎº"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+
+Date.dayNames = [
+   "ÎÏ
+ÏÎ¹Î±ÎºÎ®",
+   "ÎÎµÏ
+ÏÎ­ÏÎ±",
+   "Î€ÏÎ¯ÏÎ·",
+   "Î€ÎµÏÎ¬ÏÏÎ·",
+   "Î Î­ÎŒÏÏÎ·",
+   "Î Î±ÏÎ±ÏÎºÎµÏ
+Î®",
+   "Î£Î¬Î²Î²Î±ÏÎ¿"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "ÎÎºÏ
+ÏÎ¿",
+      yes    : "ÎÎ±Î¹",
+      no     : "ÎÏÎ¹"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Î£Î®ÎŒÎµÏÎ±",
+      minText           : "Î ÎÎŒÎµÏÎ¿ÎŒÎ·ÎœÎ¯Î± ÎµÎ¯ÎœÎ±Î¹ ÏÏÎ¿Î³ÎµÎœÎ­ÏÏÎµÏÎ· Î±ÏÏ ÏÎ·Îœ ÏÎ±Î»Î±Î¹ÏÏÎµÏÎ· Î±ÏÎ¿ÎŽÎµÎºÏÎ®",
+      maxText           : "Î ÎÎŒÎµÏÎ¿ÎŒÎ·ÎœÎ¯Î± ÎµÎ¯ÎœÎ±Î¹ ÎŒÎµÏÎ±Î³ÎµÎœÎ­ÏÏÎµÏÎ· Î±ÏÏ ÏÎ·Îœ ÎœÎµÏÏÎµÏÎ· Î±ÏÎ¿ÎŽÎµÎºÏÎ®",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames  : Date.monthNames,
+      dayNames    : Date.dayNames,
+      nextText          : 'ÎÏÏÎŒÎµÎœÎ¿Ï ÎÎ®ÎœÎ±Ï (Control+ÎÎµÎŸÎ¯ ÎÎ­Î»Î¿Ï)',
+      prevText          : 'Î ÏÎ¿Î·Î³Î¿ÏÎŒÎµÎœÎ¿Ï ÎÎ®ÎœÎ±Ï (Control + ÎÏÎ¹ÏÏÎµÏÏ ÎÎ­Î»Î¿Ï)',
+      monthYearText     : 'ÎÏÎ¹Î»Î¿Î³Î® ÎÎ·ÎœÏÏ (Control + ÎÏÎ¬ÎœÏ/ÎÎ¬ÏÏ ÎÎ­Î»Î¿Ï Î³Î¹Î± ÎŒÎµÏÎ±Î²Î¿Î»Î® ÎµÏÏÎœ)',
+      todayTip          : "{0} (Î ÎÎ®ÎºÏÏÎ¿ ÎÎ¹Î±ÏÏÎ®ÎŒÎ±ÏÎ¿Ï)",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Î£ÎµÎ»Î¯ÎŽÎ±",
+      afterPageText  : "Î±ÏÏ {0}",
+      firstText      : "Î ÏÏÏÎ· Î£ÎµÎ»Î¯ÎŽÎ±",
+      prevText       : "Î ÏÎ¿Î·Î³Î¿ÏÎŒÎµÎœÎ· Î£ÎµÎ»Î¯ÎŽÎ±",
+      nextText       : "ÎÏÏÎŒÎµÎœÎ· Î£ÎµÎ»Î¯ÎŽÎ±",
+      lastText       : "Î€ÎµÎ»ÎµÏ
+ÏÎ±Î¯Î± Î£ÎµÎ»Î¯ÎŽÎ±",
+      refreshText    : "ÎÎœÎ±ÎœÎ­ÏÏÎ·",
+      displayMsg     : "ÎÎŒÏÎ¬ÎœÎ¹ÏÎ· {0} - {1} Î±ÏÏ {2}",
+      emptyMsg       : 'ÎÎµÎœ Ï
+ÏÎ¬ÏÏÎ¿Ï
+Îœ ÎŽÎµÎŽÎ¿ÎŒÎ­ÎœÎ±'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Î€Î¿ ÎŒÎ¹ÎºÏÏÏÎµÏÎ¿ Î±ÏÎ¿ÎŽÎµÎºÏÏ ÎŒÎ®ÎºÎ¿Ï Î³Î¹Î± ÏÎ¿ ÏÎµÎŽÎ¯Î¿ ÎµÎ¯ÎœÎ±Î¹ {0}",
+      maxLengthText : "Î€Î¿ ÎŒÎµÎ³Î±Î»ÏÏÎµÏÎ¿ Î±ÏÎ¿ÎŽÎµÎºÏÏ ÎŒÎ®ÎºÎ¿Ï Î³Î¹Î± ÏÎ¿ ÏÎµÎŽÎ¯Î¿ ÎµÎ¯ÎœÎ±Î¹ {0}",
+      blankText     : "Î€Î¿ ÏÎµÎŽÎ¯Î¿ ÎµÎ¯ÎœÎ±Î¹ Ï
+ÏÎ¿ÏÏÎµÏÏÎ¹ÎºÏ",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Î ÎŒÎ¹ÎºÏÏÏÎµÏÎ· ÏÎ¹ÎŒÎ® ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+ ÎµÎ¯ÎœÎ±Î¹ {0}",
+      maxText : "Î ÎŒÎµÎ³Î±Î»ÏÏÎµÏÎ· ÏÎ¹ÎŒÎ® ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+ ÎµÎ¯ÎœÎ±Î¹ {0}",
+      nanText : "{0} ÎŽÎµÎœ ÎµÎ¯ÎœÎ±Î¹ Î±ÏÎ¿ÎŽÎµÎºÏÏÏ Î±ÏÎ¹ÎžÎŒÏÏ"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ÎÎœÎµÎœÎµÏÎ³Ï",
+      disabledDatesText : "ÎÎœÎµÎœÎµÏÎ³Ï",
+      minText           : "Î Î·ÎŒÎµÏÎ¿ÎŒÎ·ÎœÎ¯Î± Î±Ï
+ÏÎ¿Ï ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+ ÏÏÎ­ÏÎµÎ¹ ÎœÎ± ÎµÎ¯ÎœÎ±Î¹ ÎŒÎµÏÎ¬ ÏÎ·Îœ {0}",
+      maxText           : "Î Î·ÎŒÎµÏÎ¿ÎŒÎ·ÎœÎ¯Î± Î±Ï
+ÏÎ¿Ï ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+ ÏÏÎ­ÏÎµÎ¹ ÎœÎ± ÎµÎ¯ÎœÎ±Î¹ ÏÏÎ¹Îœ ÏÎ·Îœ {0}",
+      invalidText       : "{0} ÎŽÎµÎœ ÎµÎ¯ÎœÎ±Î¹ Î­Î³ÎºÏ
+ÏÎ· Î·ÎŒÎµÏÎ¿ÎŒÎ·ÎœÎ¯Î± - ÏÏÎ­ÏÎµÎ¹ ÎœÎ± ÎµÎ¯ÎœÎ±Î¹ ÏÏÎ· ÎŒÎ¿ÏÏÎ® {1}",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ÎÎµÏÎ±ÏÏÏÏÏÏÎ· ÎŽÎµÎŽÎ¿ÎŒÎ­ÎœÏÎœ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Î€Î¿ ÏÎµÎŽÎ¯Î¿ ÎŽÎ­ÏÎµÏÎ±Î¹ ÎŒÏÎœÎ¿ ÎŽÎ¹ÎµÏ
+ÎžÏÎœÏÎµÎ¹Ï Email ÏÎµ ÎŒÎ¿ÏÏÎ® "user@example.com"',
+      urlText      : 'Î€Î¿ ÏÎµÎŽÎ¯Î¿ ÎŽÎ­ÏÎµÏÎ±Î¹ ÎŒÏÎœÎ¿ URL ÏÎµ ÎŒÎ¿ÏÏÎ® "http:/'+'/www.example.com"',
+      alphaText    : 'Î€Î¿ ÏÎµÎŽÎ¯Î¿ ÎŽÎ­ÏÎµÏÎ±Î¹ ÎŒÏÎœÎ¿ ÏÎ±ÏÎ±ÎºÏÎ®ÏÎµÏ ÎºÎ±Î¹ _',
+      alphanumText : 'Î€Î¿ ÏÎµÎŽÎ¯Î¿ ÎŽÎ­ÏÎµÏÎ±Î¹ ÎŒÏÎœÎ¿ ÏÎ±ÏÎ±ÎºÏÎ®ÏÎµÏ, Î±ÏÎ¹ÎžÎŒÎ¿ÏÏ ÎºÎ±Î¹ _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+        createLinkText : 'ÎÏÏÏÎµ ÏÎ· ÎŽÎ¹ÎµÏÎžÏ
+ÎœÏÎ· (URL) Î³Î¹Î± ÏÎ¿ ÏÏÎœÎŽÎµÏÎŒÎ¿ (link):',
+        buttonTips : {
+            bold : {
+               title: 'ÎÎœÏÎ¿ÎœÎ± (Ctrl+B)',
+               text: 'ÎÎ¬ÎœÎµÏÎµ ÏÎ¿ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ Î­ÎœÏÎ¿ÎœÎ¿.',
+               cls: 'x-html-editor-tip'
+            },
+            italic : {
+               title: 'Î Î»Î¬Î³Î¹Î± (Ctrl+I)',
+               text: 'ÎÎ¬ÎœÎµÏÎµ ÏÎ¿ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ ÏÎ»Î¬Î³Î¹Î¿.',
+               cls: 'x-html-editor-tip'
+            },
+            underline : {
+               title: 'Î¥ÏÎ¿Î³ÏÎ¬ÎŒÎŒÎ¹ÏÎ· (Ctrl+U)',
+               text: 'Î¥ÏÎ¿Î³ÏÎ±ÎŒÎŒÎ¯Î¶ÎµÏÎµ ÏÎ¿ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿.',
+               cls: 'x-html-editor-tip'
+           },
+           increasefontsize : {
+               title: 'ÎÎµÎ³Î­ÎžÏ
+ÎœÏÎ· ÎºÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'ÎÎµÎ³Î±Î»ÏÎœÎµÏÎµ ÏÎ· Î³ÏÎ±ÎŒÎŒÎ±ÏÎ¿ÏÎµÎ¹ÏÎ¬.',
+               cls: 'x-html-editor-tip'
+           },
+           decreasefontsize : {
+               title: 'Î£ÎŒÎ¯ÎºÏÏ
+ÎœÏÎ· ÎºÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'ÎÎ¹ÎºÏÎ±Î¯ÎœÎµÏÎµ ÏÎ· Î³ÏÎ±ÎŒÎŒÎ±ÏÎ¿ÏÎµÎ¹ÏÎ¬.',
+               cls: 'x-html-editor-tip'
+           },
+           backcolor : {
+               title: 'Î§ÏÏÎŒÎ± ÎŠÏÎœÏÎ¿Ï
+ ÎÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'ÎÎ»Î»Î¬Î¶ÎµÏÎµ ÏÎ¿ ÏÏÏÎŒÎ± ÏÏÎ¿ ÏÏÎœÏÎ¿ ÏÎ¿Ï
+ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿Ï
+ ÎºÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+.',
+               cls: 'x-html-editor-tip'
+           },
+           forecolor : {
+               title: 'Î§ÏÏÎŒÎ± ÎÏÎ±ÎŒÎŒÎ±ÏÎ¿ÏÎµÎ¹ÏÎ¬Ï',
+               text: 'ÎÎ»Î»Î¬Î¶ÎµÏÎµ ÏÎ¿ ÏÏÏÎŒÎ± ÏÏÎ· Î³ÏÎ±ÎŒÎŒÎ±ÏÎ¿ÏÎµÎ¹ÏÎ¬ ÏÎ¿Ï
+ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿Ï
+ ÎºÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+.',               
+               cls: 'x-html-editor-tip'
+           },
+           justifyleft : {
+               title: 'ÎÏÎ¹ÏÏÎµÏÎ® Î£ÏÎ¿Î¯ÏÎ¹ÏÎ· ÎÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'Î£ÏÎ¿Î¹ÏÎ¯Î¶ÎµÏÎµ ÏÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ ÏÏÎ± Î±ÏÎ¹ÏÏÎµÏÎ¬.',
+               cls: 'x-html-editor-tip'
+           },
+           justifycenter : {
+               title: 'ÎÎµÎœÏÏÎ¬ÏÎ¹ÏÎŒÎ± ÎÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'Î£ÏÎ¿Î¹ÏÎ¯Î¶ÎµÏÎµ ÏÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ ÏÏÎ¿ ÎºÎ­ÎœÏÏÎ¿.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyright : {
+               title: 'ÎÎµÎŸÎ¹Î¬ Î£ÏÎ¿Î¯ÏÎ¹ÏÎ· ÎÎµÎ¹ÎŒÎ­ÎœÎ¿Ï
+',
+               text: 'Î£ÏÎ¿Î¹ÏÎ¯Î¶ÎµÏÎµ ÏÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ ÏÏÎ± ÎŽÎµÎŸÎ¹Î¬.',
+               cls: 'x-html-editor-tip'
+           },
+           insertunorderedlist : {
+               title: 'ÎÎ¹ÏÎ±Î³ÏÎ³Î® ÎÎ¯ÏÏÎ±Ï ÎÎ¿Ï
+ÎºÎ¯ÎŽÏÎœ',
+               text: 'ÎÎµÎºÎ¹ÎœÎ®ÏÏÎµ ÎŒÎ¹Î± Î»Î¯ÏÏÎ± ÎŒÎµ ÎºÎ¿Ï
+ÎºÎ¯ÎŽÎµÏ.',
+               cls: 'x-html-editor-tip'
+           },
+           insertorderedlist : {
+               title: 'ÎÎ¹ÏÎ±Î³ÏÎ³Î® ÎÎ¯ÏÏÎ±Ï ÎÏÎ¯ÎžÎŒÎ·ÏÎ·Ï',
+               text: 'ÎÎµÎºÎ¹ÎœÎ®ÏÏÎµ ÎŒÎ¹Î± Î»Î¯ÏÏÎ± ÎŒÎµ Î±ÏÎ¯ÎžÎŒÎ·ÏÎ·.',
+               cls: 'x-html-editor-tip'
+           },
+           createlink : {
+               title: 'Hyperlink',
+               text: 'ÎÎµÏÎ±ÏÏÎ­ÏÎµÏÎµ ÏÎ¿ ÏÏÎ¿ÎµÏÎ¹Î»ÎµÎ³ÎŒÎ­ÎœÎ¿ ÎºÎµÎ¯ÎŒÎµÎœÎ¿ ÏÎµ Link.',
+               cls: 'x-html-editor-tip'
+           },
+           sourceedit : {
+               title: 'ÎÏÎµÎŸÎµÏÎ³Î±ÏÎ¯Î± ÎÏÎŽÎ¹ÎºÎ±',
+               text: 'ÎÎµÏÎ±Î²Î±Î¯ÎœÎµÏÎµ ÏÏÎ· Î»ÎµÎ¹ÏÎ¿Ï
+ÏÎ³Î¯Î± ÎµÏÎµÎŸÎµÏÎ³Î±ÏÎ¯Î±Ï ÎºÏÎŽÎ¹ÎºÎ±.',
+               cls: 'x-html-editor-tip'
+           }
+        }
+   });
+}
+
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "ÎÏÎŸÎ¿Ï
+ÏÎ± ÏÎ±ÎŸÎ¹ÎœÏÎŒÎ·ÏÎ·",
+      sortDescText : "ÎŠÎžÎ¯ÎœÎ¿Ï
+ÏÎ± ÏÎ±ÎŸÎ¹ÎœÏÎŒÎ·ÏÎ·",
+      lockText     : "ÎÎ»ÎµÎ¯ÎŽÏÎŒÎ± ÏÏÎ®Î»Î·Ï",
+      unlockText   : "ÎÎµÎºÎ»ÎµÎ¯ÎŽÏÎŒÎ± ÏÏÎ®Î»Î·Ï",
+      columnsText  : "Î£ÏÎ®Î»ÎµÏ"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+  emptyGroupText : '(ÎÎ±ÎŒÎŒÎ¯Î±)',
+  groupByText    : 'ÎÎŒÎ±ÎŽÎ¿ÏÎ¿Î¯Î·ÏÎ· Î²Î¬ÏÎµÎ¹ Î±Ï
+ÏÎ¿Ï ÏÎ¿Ï
+ ÏÎµÎŽÎ¯Î¿Ï
+',
+  showGroupsText : 'ÎÎ± ÎµÎŒÏÎ±ÎœÎ¯Î¶ÎµÏÎ±Î¹ ÏÏÎ¹Ï Î¿ÎŒÎ¬ÎŽÎµÏ'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÎÎœÎ¿ÎŒÎ±",
+      valueText  : "Î ÎµÏÎ¹ÎµÏÏÎŒÎµÎœÎ¿",
+      dateFormat : "d/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Î£ÏÏÎµÏÎµ Î³Î¹Î± Î±Î»Î»Î±Î³Î® ÎŒÎµÎ³Î­ÎžÎ¿Ï
+Ï.",
+      collapsibleSplitTip : "Î£ÏÏÎµÏÎµ Î³Î¹Î± Î±Î»Î»Î±Î³Î® ÎŒÎµÎ³Î­ÎžÎ¿Ï
+Ï. ÎÎ¹ÏÎ»Ï ÎºÎ»Î¹Îº Î³Î¹Î± Î±ÏÏÎºÏÏ
+ÏÎ·."
+   });
+}
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr_RS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr_RS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr_RS.js	(revision 76)
@@ -0,0 +1,185 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/*
+ * Serbian Cyrillic Translation
+ * by Äolovic Vladan (cyrillic, utf8 encoding)
+ * sr_RS (ex: sr_CS, sr_YU)
+ * 12 May 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Ð£ÑÐžÑÐ°Ð²Ð°ÐŒ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ÐžÐ·Ð°Ð±ÑÐ°ÐœÐžÑ
+ ÑÐµÐŽÐŸÐ²Ð°";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÐÐ°ÑÐ²ÐŸÑÐž ÐŸÐ²Ñ Â»ÐºÐ°ÑÑÐžÑÑÂ«";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Ð£ÐœÐµÑÐµÐœÐ° Ð²ÑÐµÐŽÐœÐŸÑÑ ÐœÐžÑÐµ Ð¿ÑÐ°Ð²ÐžÐ»ÐœÐ°";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Ð£ÑÐžÑÐ°Ð²Ð°ÐŒ...";
+}
+
+Date.monthNames = [
+   "ÐÐ°ÐœÑÐ°Ñ",
+   "Ð€ÐµÐ±ÑÑÐ°Ñ",
+   "ÐÐ°ÑÑ",
+   "ÐÐ¿ÑÐžÐ»",
+   "ÐÐ°Ñ",
+   "ÐÑÐœ",
+   "ÐÑÐ»",
+   "ÐÐ²Ð³ÑÑÑ",
+   "Ð¡ÐµÐ¿ÑÐµÐŒÐ±Ð°Ñ",
+   "ÐÐºÑÐŸÐ±Ð°Ñ",
+   "ÐÐŸÐ²ÐµÐŒÐ±Ð°Ñ",
+   "ÐÐµÑÐµÐŒÐ±Ð°Ñ"
+];
+
+Date.dayNames = [
+   "ÐÐµÐŽÐµÑÐ°",
+   "ÐÐŸÐœÐµÐŽÐµÑÐ°Ðº",
+   "Ð£ÑÐŸÑÐ°Ðº",
+   "Ð¡ÑÐµÐŽÐ°",
+   "Ð§ÐµÑÐ²ÑÑÐ°Ðº",
+   "ÐÐµÑÐ°Ðº",
+   "Ð¡ÑÐ±ÐŸÑÐ°"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "Ð£ ÑÐµÐŽÑ",
+      cancel : "ÐÐŽÑÑÑÐ°ÐœÐž",
+      yes    : "ÐÐ°",
+      no     : "ÐÐµ"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "ÐÐ°ÐœÐ°Ñ",
+      minText           : "ÐÐ°ÑÑÐŒ ÑÐµ ÐžÑÐ¿ÑÐµÐŽ ÐœÐ°ÑÐŒÐ°ÑÐµÐ³ ÐŽÐŸÐ·Ð²ÐŸÑÐµÐœÐŸÐ³ ÐŽÐ°ÑÑÐŒÐ°",
+      maxText           : "ÐÐ°ÑÑÐŒ ÑÐµ ÐœÐ°ÐºÐŸÐœ ÐœÐ°ÑÐ²ÐµÑÐµÐ³ ÐŽÐŸÐ·Ð²ÐŸÑÐµÐœÐŸÐ³ ÐŽÐ°ÑÑÐŒÐ°",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'Ð¡Ð»ÐµÐŽÐµÑÐž ÐŒÐµÑÐµÑ (Control+ÐÐµÑÐœÐŸ)',
+      prevText          : 'ÐÑÐµÑÑ
+ÐŸÐŽÐœÐž ÐŒÐµÑÐµÑ (Control+ÐÐµÐ²ÐŸ)',
+      monthYearText     : 'ÐÐ·Ð°Ð±ÐµÑÐžÑÐµ ÐŒÐµÑÐµÑ (Control+ÐÐŸÑÐµ/ÐÐŸÐ»Ðµ Ð·Ð° ÐžÐ·Ð±ÐŸÑ Ð³ÐŸÐŽÐžÐœÐµ)',
+      todayTip          : "{0} (Ð Ð°Ð·ÐŒÐ°ÐºÐœÐžÑÐ°)",
+      format            : "d.m.y",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Ð¡ÑÑÐ°ÐœÐ°",
+      afterPageText  : "ÐŸÐŽ {0}",
+      firstText      : "ÐÑÐ²Ð° ÑÑÑÐ°ÐœÐ°",
+      prevText       : "ÐÑÐµÑÑ
+ÐŸÐŽÐœÐ° ÑÑÑÐ°ÐœÐ°",
+      nextText       : "Ð¡Ð»ÐµÐŽÐµÑÐ° ÑÑÑÐ°ÐœÐ°",
+      lastText       : "ÐÐŸÑÐ»ÐµÐŽÑÐ° ÑÑÑÐ°ÐœÐ°",
+      refreshText    : "ÐÑÐ²ÐµÐ¶Ðž",
+      displayMsg     : "ÐÑÐžÐºÐ°Ð·Ð°ÐœÐ° {0} - {1} ÐŸÐŽ {2}",
+      emptyMsg       : 'ÐÐµÐŒÐ°ÐŒ ÑÑÐ° Ð¿ÑÐžÐºÐ°Ð·Ð°ÑÐž'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ° ÐŽÑÐ¶ÐžÐœÐ° ÐŸÐ²ÐŸÐ³ Ð¿ÐŸÑÐ° ÑÐµ {0}",
+      maxLengthText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ° ÐŽÑÐ¶ÐžÐœÐ° ÐŸÐ²ÐŸÐ³ Ð¿ÐŸÑÐ° ÑÐµ {0}",
+      blankText     : "ÐÐŸÑÐµ ÑÐµ ÐŸÐ±Ð°Ð²ÐµÐ·ÐœÐŸ",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ° Ð²ÑÐµÐŽÐœÐŸÑÑ Ñ Ð¿ÐŸÑÑ ÑÐµ {0}",
+      maxText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ° Ð²ÑÐµÐŽÐœÐŸÑÑ Ñ Ð¿ÐŸÑÑ ÑÐµ {0}",
+      nanText : "{0} ÐœÐžÑÐµ Ð¿ÑÐ°Ð²ÐžÐ»Ð°Ðœ Ð±ÑÐŸÑ"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ÐÐ°ÑÐžÐ²ÐœÐŸ",
+      disabledDatesText : "ÐÐ°ÑÐžÐ²ÐœÐŸ",
+      minText           : "ÐÐ°ÑÑÐŒ Ñ ÐŸÐ²ÐŸÐŒ Ð¿ÐŸÑÑ ÐŒÐŸÑÐ° Ð±ÐžÑÐž ÐœÐ°ÐºÐŸÐœ {0}",
+      maxText           : "ÐÐ°ÑÑÐŒ Ñ ÐŸÐ²ÐŸÐŒ Ð¿ÐŸÑÑ ÐŒÐŸÑÐ° Ð±ÐžÑÐž Ð¿ÑÐµ {0}",
+      invalidText       : "{0} ÐœÐžÑÐµ Ð¿ÑÐ°Ð²ÐžÐ»Ð°Ðœ ÐŽÐ°ÑÑÐŒ - Ð·Ð°Ñ
+ÑÐµÐ²Ð°ÐœÐž ÐŸÐ±Ð»ÐžÐº ÑÐµ {1}",
+      format            : "d.m.y",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Ð£ÑÐžÑÐ°Ð²Ð°ÐŒ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'ÐÐ²ÐŸ Ð¿ÐŸÑÐµ Ð¿ÑÐžÑ
+Ð²Ð°ÑÐ° e-mail Ð°ÐŽÑÐµÑÑ ÐžÑÐºÑÑÑÐžÐ²ÐŸ Ñ ÐŸÐ±Ð»ÐžÐºÑ "korisnik@domen.com"',
+      urlText      : 'ÐÐ²ÐŸ Ð¿ÐŸÑÐµ Ð¿ÑÐžÑ
+Ð²Ð°ÑÐ° URL Ð°ÐŽÑÐµÑÑ ÐžÑÐºÑÑÑÐžÐ²ÐŸ Ñ ÐŸÐ±Ð»ÐžÐºÑ "http:/'+'/www.domen.com"',
+      alphaText    : 'ÐÐ²ÐŸ Ð¿ÐŸÑÐµ ÐŒÐŸÐ¶Ðµ ÑÐ°ÐŽÑÐ¶Ð°ÑÐž ÐžÑÐºÑÑÑÐžÐ²ÐŸ ÑÐ»ÐŸÐ²Ð° Ðž Ð·ÐœÐ°Ðº _',
+      alphanumText : 'ÐÐ²ÐŸ Ð¿ÐŸÑÐµ ÐŒÐŸÐ¶Ðµ ÑÐ°ÐŽÑÐ¶Ð°ÑÐž ÑÐ°ÐŒÐŸ ÑÐ»ÐŸÐ²Ð°, Ð±ÑÐŸÑÐµÐ²Ðµ Ðž Ð·ÐœÐ°Ðº _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ð Ð°ÑÑÑÑÐž ÑÐµÐŽÐŸÑÐ»ÐµÐŽ",
+      sortDescText : "ÐÐ¿Ð°ÐŽÐ°ÑÑÑÐž ÑÐµÐŽÐŸÑÐ»ÐµÐŽ",
+      lockText     : "ÐÐ°ÐºÑÑÑÐ°Ñ ÐºÐŸÐ»ÐŸÐœÑ",
+      unlockText   : "ÐÑÐºÑÑÑÐ°Ñ ÐºÐŸÐ»ÐŸÐœÑ",
+      columnsText  : "ÐÐŸÐ»ÐŸÐœÐµ"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÐÐ°Ð·ÐžÐ²",
+      valueText  : "ÐÑÐµÐŽÐœÐŸÑÑ",
+      dateFormat : "d.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "ÐÐŸÐ²ÑÑÐž Ð·Ð° ÐžÐ·ÐŒÐµÐœÑ Ð²ÐµÐ»ÐžÑÐžÐœÐµ.",
+      collapsibleSplitTip : "ÐÐŸÐ²ÑÑÐž Ð·Ð° ÐžÐ·ÐŒÐµÐœÑ Ð²ÐµÐ»ÐžÑÐžÐœÐµ. ÐÐ²ÐŸÑÑÑÑÐºÐž ÐºÐ»ÐžÐº Ð·Ð° ÑÐ°ÐºÑÐžÐ²Ð°ÑÐµ."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ja.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ja.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ja.js	(revision 76)
@@ -0,0 +1,327 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Japanese translation
+ * By tyama
+ * 04-08-2007, 05:49 AM
+ *
+ * update based on English Translations by Condor (8 Aug 2008)
+ * By sakuro (30 Aug 2008)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">èª­ã¿èŸŒã¿äž­...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} è¡éžæ";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "èª­ã¿èŸŒã¿äž­...";
+}
+
+Date.monthNames = [
+  '1æ',
+  '2æ',
+  '3æ',
+  '4æ',
+  '5æ',
+  '6æ',
+  '7æ',
+  '8æ',
+  '9æ',
+  '10æ',
+  '11æ',
+  '12æ'
+];
+
+Date.getShortMonthName = function(month) {
+  return "" + (month + 1);
+};
+
+Date.monthNumbers = {
+  "1" : 0,
+  "2" : 1,
+  "3" : 2,
+  "4" : 3,
+  "5" : 4,
+  "6" : 5,
+  "7" : 6,
+  "8" : 7,
+  "9" : 8,
+  "10" : 9,
+  "11" : 10,
+  "12" : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, name.length - 1)];
+  // or simply parseInt(name.substring(0, name.length - 1)) - 1
+};
+
+Date.dayNames = [
+  "æ¥ææ¥",
+  "æææ¥",
+  "ç«ææ¥",
+  "æ°Žææ¥",
+  "æšææ¥",
+  "éææ¥",
+  "åææ¥"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 1); // just remove "ææ¥" suffix
+};
+
+Date.formatCodes.a = "(this.getHours() < 12 ? 'åå' : 'ååŸ')";
+Date.formatCodes.A = "(this.getHours() < 12 ? 'åå' : 'ååŸ')"; // no case difference
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "ã­ã£ã³ã»ã«",
+    yes    : "ã¯ã",
+    no     : "ããã"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "Y/m/d");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "ä»æ¥",
+    minText           : "éžæããæ¥ä»ã¯æå°å€ä»¥äžã§ãã",
+    maxText           : "éžæããæ¥ä»ã¯æå€§å€ä»¥äžã§ãã",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'æ¬¡æãž (ã³ã³ãã­ãŒã«+å³)',
+    prevText          : 'åæãž (ã³ã³ãã­ãŒã«+å·Š)',
+    monthYearText     : 'æéžæ (ã³ã³ãã­ãŒã«+äž/äžã§å¹Žç§»å)',
+    todayTip          : "{0} (ã¹ããŒã¹ã­ãŒ)",
+    format            : "Y/m/d",
+    okText            : "OK",
+    cancelText        : "ã­ã£ã³ã»ã«",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "ããŒãž",
+    afterPageText  : "/ {0}",
+    firstText      : "æåã®ããŒãž",
+    prevText       : "åã®ããŒãž",
+    nextText       : "æ¬¡ã®ããŒãž",
+    lastText       : "æåŸã®ããŒãž",
+    refreshText    : "æŽæ°",
+    displayMsg     : "{2} ä»¶äž­ {0} - {1} ãè¡šç€º",
+    emptyMsg       : 'è¡šç€ºããããŒã¿ããããŸããã'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "ãã£ãŒã«ãã®å€ãäžæ­£ã§ãã";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "ãã®ãã£ãŒã«ãã®æå°å€ã¯ {0} ã§ãã",
+    maxLengthText : "ãã®ãã£ãŒã«ãã®æå€§å€ã¯ {0} ã§ãã",
+    blankText     : "å¿
+é é 
+ç®ã§ãã",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ".",
+    decimalPrecision : 2,
+    minText : "ãã®ãã£ãŒã«ãã®æå°å€ã¯ {0} ã§ãã",
+    maxText : "ãã®ãã£ãŒã«ãã®æå€§å€ã¯ {0} ã§ãã",
+    nanText : "{0} ã¯æ°å€ã§ã¯ãããŸããã"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "ç¡å¹",
+    disabledDatesText : "ç¡å¹",
+    minText           : "ãã®ãã£ãŒã«ãã®æ¥ä»ã¯ã {0} ä»¥éã®æ¥ä»ã«èš­å®ããŠãã ããã",
+    maxText           : "ãã®ãã£ãŒã«ãã®æ¥ä»ã¯ã {0} ä»¥åã®æ¥ä»ã«èš­å®ããŠãã ããã",
+    invalidText       : "{0} ã¯ééã£ãæ¥ä»å
+¥åã§ãã - å
+¥ååœ¢åŒã¯ã{1}ãã§ãã",
+    format            : "Y/m/d",
+    altFormats        : "y/m/d|m/d/y|m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "èª­ã¿èŸŒã¿äž­...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'ã¡ãŒã«ã¢ãã¬ã¹ã"user@example.com"ã®åœ¢åŒã§å
+¥åããŠãã ããã',
+    urlText      : 'URLã"http:/'+'/www.example.com"ã®åœ¢åŒã§å
+¥åããŠãã ããã',
+    alphaText    : 'åè§è±å­ãš"_"ã®ã¿ã§ãã',
+    alphanumText : 'åè§è±æ°ãš"_"ã®ã¿ã§ãã'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'ãªã³ã¯ã®URLãå
+¥åããŠãã ãã:',
+    buttonTips : {
+      bold : {
+        title: 'å€ªå­ (ã³ã³ãã­ãŒã«+B)',
+        text: 'éžæãã­ã¹ããå€ªå­ã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'æäœ (ã³ã³ãã­ãŒã«+I)',
+        text: 'éžæãã­ã¹ããæäœã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'äžç· (ã³ã³ãã­ãŒã«+U)',
+        text: 'éžæãã­ã¹ãã«äžç·ãåŒããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'æå­ãå€§ãã',
+        text: 'ãã©ã³ããµã€ãºãå€§ããããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'æå­ãå°ãã',
+        text: 'ãã©ã³ããµã€ãºãå°ããããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'æå­ã®ãã€ã©ã€ã',
+        text: 'éžæãã­ã¹ãã®èæ¯è²ãå€æŽããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'æå­ã®è²',
+        text: 'éžæãã­ã¹ãã®è²ãå€æŽããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'å·Šæã',
+        text: 'ãã­ã¹ããå·Šæãã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'äž­å€®æã',
+        text: 'ãã­ã¹ããäž­å€®æãã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'å³æã',
+        text: 'ãã­ã¹ããå³æãã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'çªå·ãªãç®æ¡æžã',
+        text: 'çªå·ãªãç®æ¡æžããéå§ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'çªå·ä»ãç®æ¡æžã',
+        text: 'çªå·ä»ãç®æ¡æžããéå§ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'ãã€ããŒãªã³ã¯',
+        text: 'éžæãã­ã¹ãããã€ããŒãªã³ã¯ã«ããŸãã',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ãœãŒã¹ç·šé',
+        text: 'ãœãŒã¹ç·šéã¢ãŒãã«åãæ¿ããŸãã',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "æé ",
+    sortDescText : "éé ",
+    columnsText  : "ã«ã©ã "
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ãªã)',
+    groupByText    : 'ãã®ã«ã©ã ã§ã°ã«ãŒãã³ã°',
+    showGroupsText : 'ã°ã«ãŒãã³ã°'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "åç§°",
+    valueText  : "å€",
+    dateFormat : "Y/m/d"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "ãã©ãã°ãããšãªãµã€ãºã§ããŸãã",
+    collapsibleSplitTip : "ãã©ãã°ã§ãªãµã€ãºã ããã«ã¯ãªãã¯ã§é ãã"
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "ãã®ãã£ãŒã«ãã®æå»ã¯ã {0} ä»¥éã®æå»ã«èš­å®ããŠãã ããã",
+    maxText : "ãã®ãã£ãŒã«ãã®æå»ã¯ã {0} ä»¥åã®æå»ã«èš­å®ããŠãã ããã",
+    invalidText : "{0} ã¯ééã£ãæå»å
+¥åã§ãã",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "ãã®ã°ã«ãŒãããæäœïŒã€ã®ã¢ã€ãã ãéžæããªããã°ãªããŸããã"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "ãã®ã°ã«ãŒãããïŒã€ã®ã¢ã€ãã ãéžæããªããã°ãªããŸããã"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-he.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-he.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-he.js	(revision 76)
@@ -0,0 +1,293 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Hebrew Translations
+ * By spartacus (from forums) 06-12-2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">...ï¿œï¿œï¿œï¿œ</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ {0}";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "...ï¿œï¿œï¿œï¿œ";
+}
+
+Date.monthNames = [
+  "ï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+  "ï¿œï¿œï¿œï¿œï¿œ"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "ï¿œ",
+  "ï¿œ",
+  "ï¿œ",
+  "ï¿œ",
+  "ï¿œ",
+  "ï¿œ",
+  "ï¿œ"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "ï¿œï¿œï¿œï¿œï¿œ",
+    cancel : "ï¿œï¿œï¿œï¿œï¿œ",
+    yes    : "ï¿œï¿œ",
+    no     : "ï¿œï¿œ"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "ï¿œï¿œï¿œï¿œ",
+    minText           : ".ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    maxText           : ".ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : '(Control+Right) ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œ',
+    prevText          : '(Control+Left) ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+    monthYearText     : '(ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œ Control+Up/Down) ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+    todayTip          : "ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ) {0})",
+    format            : "d/m/Y",
+    okText            : "&#160;ï¿œï¿œï¿œï¿œï¿œ&#160;",
+    cancelText        : "ï¿œï¿œï¿œï¿œï¿œ",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "ï¿œï¿œï¿œï¿œ",
+    afterPageText  : "{0} ï¿œï¿œï¿œï¿œ",
+    firstText      : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    prevText       : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    nextText       : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œ",
+    lastText       : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    refreshText    : "ï¿œï¿œï¿œï¿œ",
+    displayMsg     : "ï¿œï¿œï¿œï¿œ {0} - {1} ï¿œï¿œï¿œï¿œ {2}",
+    emptyMsg       : 'ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "{0} ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ",
+    maxLengthText : "{0} ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ",
+    blankText     : "ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "{0} ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ",
+    maxText : "{0} ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ",
+    nanText : "ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ {0}"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+    disabledDatesText : "ï¿œï¿œï¿œï¿œï¿œï¿œ",
+    minText           : "{0} ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    maxText           : "{0} ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    invalidText       : "{1} ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ - ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ {0}",
+    format            : "m/d/y",
+    altFormats        : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "...ï¿œï¿œï¿œï¿œ",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : '"user@example.com" ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+    urlText      : '"http:/'+'/www.example.com" ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+    alphaText    : '_ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œ',
+    alphanumText : '_ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ, ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œ'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : ':ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+    buttonTips : {
+      bold : {
+        title: '(Ctrl+B) ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: '(Ctrl+I) ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: '(Ctrl+U) ï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'ï¿œï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'ï¿œï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œï¿œ ï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        text: '.ï¿œï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    sortDescText : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    lockText     : "ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    unlockText   : "ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ",
+    columnsText  : "ï¿œï¿œï¿œï¿œï¿œï¿œ"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ï¿œï¿œï¿œ)',
+    groupByText    : 'ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œï¿œ ï¿œï¿œ',
+    showGroupsText : 'ï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œï¿œ'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "ï¿œï¿œ",
+    valueText  : "ï¿œï¿œï¿œ",
+    dateFormat : "m/j/Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : ".ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ",
+    collapsibleSplitTip : ".ï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œ. ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œ ï¿œï¿œï¿œï¿œï¿œï¿œ"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-am.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-am.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-am.js	(revision 76)
@@ -0,0 +1,398 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/**
+ * List compiled by Tewodros Wondimu on the extjs.com forums Oct 18, 2010.
+ *
+ * Amharic Translations
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">á¥á«áµáá£ áá...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} áá­á¥ ášáµá {1}";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "á¥á«áµáá£ áá...";
+}
+
+Date.shortMonthNames = [
+   "ááµáš",
+   "á¥á
+á",
+   "á
+á³á­",
+   "á³á
+á³",
+   "á¥á­",
+   "ášá«á²",
+   "ááá¢",
+   "áá«á",
+   "áááŠ",
+   "á°á",
+   "ááá",
+   "áááŽ",
+   "á·áá"
+];
+
+
+Date.monthNames = [
+  "ááµášášá",
+  "á¥á
+ááµ",
+  "á
+á³á­",
+  "á³á
+á³áµ",
+  "á¥á­",
+  "ášá«á²áµ",
+  "ááá¢áµ",
+  "áá«áá«",
+  "áááŠáµ",
+  "á°á",
+  "ááá",
+  "áááŽ",
+  "á·áá"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  "ááµášášá" : 0,
+  "á¥á
+ááµ" : 1,
+  "á
+á³á­" : 2,
+  "á³á
+á³áµ" : 3,
+  "á¥á­" : 4,
+  "ášá«á²áµ" : 5,
+  "ááá¢áµ" : 6,
+  "áá«áá«" : 7,
+  "áááŠáµ" : 8,
+  "á°á" : 9,
+  "ááá" : 10,  
+  "áááŽ" : 11,
+  "á·áá" : 12
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "á¥ááµ",
+  "á°á",
+  "áá­á°á",
+  "áá®á¥",
+  "áááµ",
+  "á á­á¥",
+  "á
+á³á"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:st|nd|rd|th)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "á­áá",
+    cancel : "á°á­á",
+    yes    : "á á",
+    no     : "ášáá / á á­"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "á/á/á ");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "áá¬",
+    minText           : "á­á áá  ášáášášá» áµáá¹ áá á ááµ áá",
+    maxText           : "á­á áá ášáášášá» áµáá áá á ááµ áá",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'ášááá¥áá áá­(ááá£á£áªá«  ááá+áá)',
+    prevText          : 'á«ááá áá­(ááá£á£áªá«  ááá+áá«)',
+    monthYearText     : 'áá­ áášá¥ (á ááµ ááááá¥ ááá£á£áªá«  ááá+áá°áá­/áá°á³áœ)',
+    todayTip          : "{0} (ášáŠá³ ááá)",
+    format            : "d/m/Y",
+    okText            : "á­áá",
+    cancelText        : "á°á­á",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "áááœ",
+    afterPageText  : "áš {0}",
+    firstText      : "ášááááªá«á áááœ",
+    prevText       : "á«ááá áááœ",
+    nextText       : "ášááá¥áá áááœ",
+    lastText       : "ášáášášá»á áááœ",
+    refreshText    : "ášááµ",
+    displayMsg     : "{0} - {1} á²á«á³á­ áš {2}",
+    emptyMsg       : 'ášáá³á­ á³á³ ášáá'
+  });
+}
+
+if(Ext.form.BasicForm){
+    Ext.form.BasicForm.prototype.waitTitle = "á¥á£á­áá á­á á¥á..."
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "ášáá
+ ááµá­ á¥áŽáµ ášá°á³á³á° áá";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "ášáá
+ ááµá­ ášáášášá» áµááœ á­áááµ {0} áá",
+    maxLengthText : "ášáá
+ ááµá­ ášáášášá» áµáá
+ á­áááµ {0} áá",
+    blankText     : "á­á ááµá­ á áµááá áá",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ".",
+    decimalPrecision : 2,
+    minText : "ášáá
+ ááµá­ ášáášášá» áµááœ á¥áŽáµ {0} áá",
+    maxText : "ášáá
+ ááµá­ ášáášášá» áµáá
+ á¥áŽáµ {0} áá",
+    nanText : "{0} ášá°á³á³á° áá¥á­ áá"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "áŠááá / áµá« á ááá",
+    disabledDatesText : "áŠááá / áµá« á ááá",
+    minText           : "á¥á á¥áŽáµ ááµá¥ á«áá áá áš{0} á áá á ááá á áá áµ",
+    maxText           : "á¥á á¥áŽáµ ááµá¥ á«áá áá áš{0} á ááµ ááá á áá áµ",
+    invalidText       : "{0} ášá°á³á³á° áá áá - á áá
+ á
+á­ááµ ááá á áá áµ {1}",
+    format            : "d/m/y",
+    altFormats        : "d/m/Y|d/m/y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "á¥á«áµáá£ áá...",
+    valueNotFoundText : "á áá°áá°áá"
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'á­á á¥áŽáµ á¢áá­á ááá á áá áµ - á áá
+ á
+á­ááµ ááá á áá áµ "user@example.com"',
+    urlText      : 'á­á á¥áŽáµ  á©á á­á€á ááá á áá áµ - á áá
+ á
+á­ááµ ááá á áá áµ "http:/'+'/www.example.com"',
+    alphaText    : 'á­á á¥áŽáµ áá«á á«áá áµ áááµá _ á¥á» áá',
+    alphanumText : 'á­á á¥áŽáµ áá«á á«áá áµ áááµá€ áá¥á­á _ á¥á» áá'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'á¥á£á®áµá áá á©á á­á€á á ááá á áµáá£:',
+    buttonTips : {
+      bold : {
+        title: 'á°áá
+ (ááá£á£áªá«  ááá+B)',
+        text: 'ášá°áášá áá áœáá á áµáá
+::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      italic : {
+        title: 'á°á«á (ááá£á£áªá«  ááá+I)',
+        text: 'ášá°áášá áá áœáá á°á«á á áµá­á::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      underline : {
+        title: 'ááµáášáá­á (ááá£á£áªá«  ááá+U)',
+        text: 'ášá°áášá áá áœáá ášáá­á á áµáá­::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      increasefontsize : {
+        title: 'áœááá á á³áµá',
+        text: 'á
+á­áž ááá á á³áµáá::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      decreasefontsize : {
+        title: 'áœááá á á³ááµ',
+        text: 'á
+á­áž ááá á á³ááµ::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      backcolor : {
+        title: 'áœáá áášá¥ ááá',
+        text: 'ášá°áášá áá áœáá á³á« ááá ááá¥::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      forecolor : {
+        title: 'á
+á­áž ááá ááá',
+        text: 'ášá°áášá áá áœáá ááá ááá¥::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      justifyleft : {
+        title: 'áœáá áá« á á°áá',
+        text: 'áœááá áá°áá« á á°áá::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      justifycenter : {
+        title: 'áœáá á áá­á',
+        text: 'á á­á³á¢á áá­ áœááá á áá­á::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      justifyright : {
+        title: 'áœáá áá á á°áá',
+        text: 'áœááá áá°áá á á°áá::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      insertunorderedlist : {
+        title: 'áá¥á  ááá­áµ áá­áá­',
+        text: 'áá¥á  ááá­áµ áá­áá­ ááá­::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      insertorderedlist : {
+        title: 'áá¥á«á áá­áá­',
+        text: 'áá¥á«á áá­áá­ ááá­::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      createlink : {
+        title: 'áá
+ á ááá',
+        text: 'ášá°áášá áá áœáá áá
+ á ááá á áµá­á::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      },
+      sourceedit : {
+        title: 'ááá­ á á­áµá¥',
+        text: 'áá° ááá­ á á­áµá¥ ááá³ áá­á­::',
+        cls: 'á€á­áµ-á€áœá²á€áá€á-á á­á³á¢-á áá áá­á­'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "áœá
+á¥ á°á­áµá­",
+    sortDescText : "áááá á°á­áµá­",
+    columnsText  : "á áá¶áœ"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ááá)',
+    groupByText    : 'á á ááµá­ áŠáµá',
+    showGroupsText : 'á á¡áµá á á³á­'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "áµá",
+    valueText  : "á¥áŽáµ ",
+    dateFormat : "m/j/Y",
+    trueText: "á¥áá",
+    falseText: "áá°áµ"
+  });
+}
+
+if(Ext.grid.BooleanColumn){
+   Ext.apply(Ext.grid.BooleanColumn.prototype, {
+      trueText  : "á¥áá",
+      falseText : "áá°áµ",
+      undefinedText: '&#160;'
+   });
+}
+
+if(Ext.grid.NumberColumn){
+    Ext.apply(Ext.grid.NumberColumn.prototype, {
+        format : '0,000.00'
+    });
+}
+
+if(Ext.grid.DateColumn){
+    Ext.apply(Ext.grid.DateColumn.prototype, {
+        format : 'm/d/Y'
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "áá á áááá­á­ ááµáµ::",
+    collapsibleSplitTip : "áá á áááá­á­ ááµáµ:: ááá°á á
+ áááŽ á á
+ á áµá­á::"
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "á¥áá
+ ááµá­ ááµá¥ á«áá á°ááµ áš{0} á¥á©á áá­á á áá ááá á áá áµ",
+    maxText : "á¥áá
+ ááµá­ ááµá¥ á«áá á°ááµ áš{0} á¥á©á áá­á á ááµ ááá á áá áµ",
+    invalidText : "{0} ášá°á³á³á° á°ááµ áá",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "á¥áá
+ á¡áµá ááµá¥ á¢á«ááµ á ááµ áá­ááµ ááášá¥ á áá¥á
+"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "á¥áá
+ á¡áµá ááµá¥ á¢á«ááµ á ááµ áá­ááµ ááášá¥ á áá¥á
+"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fi.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fi.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fi.js	(revision 76)
@@ -0,0 +1,303 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Finnish Translations
+ * <tuomas.salo (at) iki.fi>
+ * 'Ã€' should read as lowercase 'a' with two dots on top (&auml;)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Ladataan...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} rivi(Ã€) valittu";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Sulje tÃ€mÃ€ vÃ€lilehti";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Ladataan...";
+}
+
+Date.monthNames = [
+  "tammikuu",
+  "helmikuu",
+  "maaliskuu",
+  "huhtikuu",
+  "toukokuu",
+  "kesÃ€kuu",
+  "heinÃ€kuu",
+  "elokuu",
+  "syyskuu",
+  "lokakuu",
+  "marraskuu",
+  "joulukuu"
+];
+
+Date.getShortMonthName = function(month) {
+  //return Date.monthNames[month].substring(0, 3);
+  return (month+1) + ".";
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  if(name.match(/^(1?\d)\./)) {
+	return -1+RegExp.$1;
+  } else {
+	return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+  }
+};
+
+Date.dayNames = [
+  "sunnuntai",
+  "maanantai",
+  "tiistai",
+  "keskiviikko",
+  "torstai",
+  "perjantai",
+  "lauantai"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 2);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Peruuta",
+    yes    : "KyllÃ€",
+    no     : "Ei"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "j.n.Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "TÃ€nÃ€Ã€n",
+    minText           : "TÃ€mÃ€ pÃ€ivÃ€mÃ€Ã€rÃ€ on aikaisempi kuin ensimmÃ€inen sallittu",
+    maxText           : "TÃ€mÃ€ pÃ€ivÃ€mÃ€Ã€rÃ€ on myÃ¶hÃ€isempi kuin viimeinen sallittu",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Seuraava kuukausi (Control+oikealle)',
+    prevText          : 'Edellinen kuukausi (Control+vasemmalle)',
+    monthYearText     : 'Valitse kuukausi (vaihda vuotta painamalla Control+ylÃ¶s/alas)',
+    todayTip          : "{0} (vÃ€lilyÃ¶nti)",
+    format            : "j.n.Y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Peruuta",
+    startDay          : 1 // viikko alkaa maanantaista
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Sivu",
+    afterPageText  : "/ {0}",
+    firstText      : "EnsimmÃ€inen sivu",
+    prevText       : "Edellinen sivu",
+    nextText       : "Seuraava sivu",
+    lastText       : "Viimeinen sivu",
+    refreshText    : "PÃ€ivitÃ€",
+    displayMsg     : "NÃ€ytetÃ€Ã€n {0} - {1} / {2}",
+    emptyMsg       : 'Ei tietoja'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "TÃ€mÃ€n kentÃ€n arvo ei kelpaa";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "TÃ€mÃ€n kentÃ€n minimipituus on {0}",
+    maxLengthText : "TÃ€mÃ€n kentÃ€n maksimipituus on {0}",
+    blankText     : "TÃ€mÃ€ kenttÃ€ on pakollinen",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "TÃ€mÃ€n kentÃ€n pienin sallittu arvo on {0}",
+    maxText : "TÃ€mÃ€n kentÃ€n suurin sallittu arvo on {0}",
+    nanText : "{0} ei ole numero"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Ei kÃ€ytÃ¶ssÃ€",
+    disabledDatesText : "Ei kÃ€ytÃ¶ssÃ€",
+    minText           : "TÃ€mÃ€n kentÃ€n pÃ€ivÃ€mÃ€Ã€rÃ€n tulee olla {0} jÃ€lkeen",
+    maxText           : "TÃ€mÃ€n kentÃ€n pÃ€ivÃ€mÃ€Ã€rÃ€n tulee olla ennen {0}",
+    invalidText       : "PÃ€ivÃ€mÃ€Ã€rÃ€ {0} ei ole oikeassa muodossa - kirjoita pÃ€ivÃ€mÃ€Ã€rÃ€ muodossa {1}",
+    format            : "j.n.Y",
+    altFormats        : "j.n.|d.m.|mdy|mdY|d|Y-m-d|Y/m/d",
+    startDay          : 1 // viikko alkaa maanantaista
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Ladataan...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'SyÃ¶tÃ€ tÃ€hÃ€n kenttÃ€Ã€n sÃ€hkÃ¶postiosoite, esim. "etunimi.sukunimi@osoite.fi"',
+    urlText      : 'SyÃ¶tÃ€ tÃ€hÃ€n kenttÃ€Ã€n URL-osoite, esim. "http:/'+'/www.osoite.fi"',
+    alphaText    : 'SyÃ¶tÃ€ tÃ€hÃ€n kenttÃ€Ã€n vain kirjaimia (a-z, A-Z) ja alaviivoja (_)',
+    alphanumText : 'SyÃ¶tÃ€ tÃ€hÃ€n kenttÃ€Ã€n vain kirjaimia (a-z, A-Z), numeroita (0-9) ja alaviivoja (_)'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Anna linkin URL-osoite:',
+    buttonTips : {
+      bold : {
+        title: 'Lihavoi (Ctrl+B)',
+        text: 'Lihavoi valittu teksti.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursivoi (Ctrl+I)',
+        text: 'Kursivoi valittu teksti.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Alleviivaa (Ctrl+U)',
+        text: 'Alleviivaa valittu teksti.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Suurenna tekstiÃ€',
+        text: 'Kasvata tekstin kirjasinkokoa.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'PienennÃ€ tekstiÃ€',
+        text: 'PienennÃ€ tekstin kirjasinkokoa.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Tekstin korostusvÃ€ri',
+        text: 'Vaihda valitun tekstin taustavÃ€riÃ€.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Tekstin vÃ€ri',
+        text: 'Vaihda valitun tekstin vÃ€riÃ€.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Tasaa vasemmalle',
+        text: 'Tasaa teksti vasempaan reunaan.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'KeskitÃ€',
+        text: 'KeskitÃ€ teksti.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Tasaa oikealle',
+        text: 'Tasaa teksti oikeaan reunaan.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Luettelo',
+        text: 'Luo luettelo.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numeroitu luettelo',
+        text: 'Luo numeroitu luettelo.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Linkki',
+        text: 'Tee valitusta tekstistÃ€ hyperlinkki.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'LÃ€hdekoodin muokkaus',
+        text: 'Vaihda lÃ€hdekoodin muokkausnÃ€kymÃ€Ã€n.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.form.BasicForm){
+  Ext.form.BasicForm.prototype.waitTitle = "Odota...";
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "JÃ€rjestÃ€ A-Ã",
+    sortDescText : "JÃ€rjestÃ€ Ã-A",
+    lockText     : "Lukitse sarake",
+    unlockText   : "Vapauta sarakkeen lukitus",
+    columnsText  : "Sarakkeet"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ei mitÃ€Ã€n)',
+    groupByText    : 'Ryhmittele tÃ€mÃ€n kentÃ€n mukaan',
+    showGroupsText : 'NÃ€ytÃ€ ryhmissÃ€'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nimi",
+    valueText  : "Arvo",
+    dateFormat : "j.m.Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Muuta kokoa vetÃ€mÃ€llÃ€.",
+    collapsibleSplitTip : "Muuta kokoa vetÃ€mÃ€llÃ€. Piilota kaksoisklikkauksella."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-cs.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-cs.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-cs.js	(revision 76)
@@ -0,0 +1,311 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Czech Translations
+ * Translated by TomÃ¡Å¡ KorÄÃ¡k (72)
+ * 2008/02/08 18:02, Ext-2.0.1
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ProsÃ­m Äekejte...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} vybranÃœch ÅÃ¡dkÅ¯";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ZavÅÃ­t zÃ¡loÅŸku";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Hodnota v tomto poli je neplatnÃ¡";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ProsÃ­m Äekejte...";
+}
+
+Date.monthNames = [
+   "Leden",
+   "Ãnor",
+   "BÅezen",
+   "Duben",
+   "KvÄten",
+   "Äerven",
+   "Äervenec",
+   "Srpen",
+   "ZÃ¡ÅÃ­",
+   "ÅÃ­jen",
+   "Listopad",
+   "Prosinec"
+];
+
+Date.shortMonthNames = {
+    "Leden"     : "Led",
+    "Ãnor"      : "Ãno",
+    "BÅezen"    : "BÅe",
+    "Duben"     : "Dub",
+    "KvÄten"    : "KvÄ",
+    "Äerven"    : "Äer",
+    "Äervenec"  : "Ävc",
+    "Srpen"     : "Srp",
+    "ZÃ¡ÅÃ­"      : "ZÃ¡Å",
+    "ÅÃ­jen"     : "ÅÃ­j",
+    "Listopad"  : "Lis",
+    "Prosinec"  : "Pro"
+};
+
+
+Date.getShortMonthName = function(month) {
+  return Date.shortMonthNames[Date.monthNames[month]];
+};
+
+Date.monthNumbers = {
+   "Leden"      : 0,
+   "Ãnor"       : 1,
+   "BÅezen"     : 2,
+   "Duben"      : 3,
+   "KvÄten"     : 4,
+   "Äerven"     : 5,
+   "Äervenec"   : 6,
+   "Srpen"      : 7,
+   "ZÃ¡ÅÃ­"       : 8,
+   "ÅÃ­jen"      : 9,
+   "Listopad"   : 10,
+   "Prosinec"   : 11
+};
+
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1).toLowerCase()];
+};
+
+Date.dayNames = [
+   "NedÄle",
+   "PondÄlÃ­",
+   "ÃterÃœ",
+   "StÅeda",
+   "Ätvrtek",
+   "PÃ¡tek",
+   "Sobota"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Storno",
+      yes    : "Ano",
+      no     : "Ne"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Dnes",
+      minText           : "Datum nesmÃ­ bÃœt starÅ¡Ã­ neÅŸ je minimÃ¡lnÃ­",
+      maxText           : "Datum nesmÃ­ bÃœt dÅÃ­vÄjÅ¡Ã­ neÅŸ je maximÃ¡lnÃ­",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'NÃ¡sledujÃ­cÃ­ mÄsÃ­c (Control+Right)',
+      prevText          : 'PÅedchÃ¡zejÃ­cÃ­ mÄsÃ­c (Control+Left)',
+      monthYearText     : 'Zvolte mÄsÃ­c (ke zmÄnÄ let pouÅŸijte Control+Up/Down)',
+      todayTip          : "{0} (Spacebar)",
+      format            : "d.m.Y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "Storno",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Strana",
+      afterPageText  : "z {0}",
+      firstText      : "PrvnÃ­ strana",
+      prevText       : "PÅechÃ¡zejÃ­cÃ­ strana",
+      nextText       : "NÃ¡sledujÃ­cÃ­ strana",
+      lastText       : "PoslednÃ­ strana",
+      refreshText    : "Aktualizovat",
+      displayMsg     : "Zobrazeno {0} - {1} z celkovÃœch {2}",
+      emptyMsg       : 'ÅœÃ¡dnÃ© zÃ¡znamy nebyly nalezeny'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Pole nesmÃ­ mÃ­t mÃ©nÄ {0} znakÅ¯",
+      maxLengthText : "Pole nesmÃ­ bÃœt delÅ¡Ã­ neÅŸ {0} znakÅ¯",
+      blankText     : "This field is required",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Hodnota v tomto poli nesmÃ­ bÃœt menÅ¡Ã­ neÅŸ {0}",
+      maxText : "Hodnota v tomto poli nesmÃ­ bÃœt vÄtÅ¡Ã­ neÅŸ {0}",
+      nanText : "{0} nenÃ­ platnÃ© ÄÃ­slo"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "NeaktivnÃ­",
+      disabledDatesText : "NeaktivnÃ­",
+      minText           : "Datum v tomto poli nesmÃ­ bÃœt starÅ¡Ã­ neÅŸ {0}",
+      maxText           : "Datum v tomto poli nesmÃ­ bÃœt novÄjÅ¡Ã­ neÅŸ {0}",
+      invalidText       : "{0} nenÃ­ platnÃœm datem - zkontrolujte zda-li je ve formÃ¡tu {1}",
+      format            : "d.m.Y",
+      altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ProsÃ­m Äekejte...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'V tomto poli mÅ¯ÅŸe bÃœt vyplnÄna pouze emailovÃ¡ adresa ve formÃ¡tu "uÅŸivatel@domÃ©na.cz"',
+      urlText      : 'V tomto poli mÅ¯ÅŸe bÃœt vyplnÄna pouze URL (adresa internetovÃ© strÃ¡nky) ve formÃ¡tu "http:/'+'/www.domÃ©na.cz"',
+      alphaText    : 'Toto pole mÅ¯ÅŸe obsahovat pouze pÃ­smena abecedy a znak _',
+      alphanumText : 'Toto pole mÅ¯ÅŸe obsahovat pouze pÃ­smena abecedy, ÄÃ­sla a znak _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Zadejte URL adresu odkazu:',
+    buttonTips : {
+      bold : {
+        title: 'TuÄnÃ© (Ctrl+B)',
+        text: 'OznaÄÃ­ vybranÃœ text tuÄnÄ.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'KurzÃ­va (Ctrl+I)',
+        text: 'OznaÄÃ­ vybranÃœ text kurzÃ­vou.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'PodtrÅŸenÃ­ (Ctrl+U)',
+        text: 'Podtrhne vybranÃœ text.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ZvÄtÅ¡it pÃ­smo',
+        text: 'ZvÄtÅ¡Ã­ velikost pÃ­sma.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'ZÃºÅŸit pÃ­smo',
+        text: 'ZmenÅ¡Ã­ velikost pÃ­sma.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Barva zvÃœraznÄnÃ­ textu',
+        text: 'OznaÄÃ­ vybranÃœ text tak, aby vypadal jako oznaÄenÃœ zvÃœrazÅovaÄem.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Barva pÃ­sma',
+        text: 'ZmÄnÃ­ barvu textu.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Zarovnat text vlevo',
+        text: 'ZarovnÃ¡ text doleva.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Zarovnat na stÅed',
+        text: 'ZarovnÃ¡ text na stÅed.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Zarovnat text vpravo',
+        text: 'ZarovnÃ¡ text doprava.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'OdrÃ¡ÅŸky',
+        text: 'ZaÄne seznam s odrÃ¡ÅŸkami.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ÄÃ­slovÃ¡nÃ­',
+        text: 'ZaÄne ÄÃ­slovanÃœ seznam.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'InternetovÃœ odkaz',
+        text: 'Z vybranÃ©ho textu vytvoÅÃ­ internetovÃœ odkaz.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ZdrojovÃœ kÃ³d',
+        text: 'PÅepne do mÃ³du Ãºpravy zdrojovÃ©ho kÃ³du.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Åadit vzestupnÄ",
+      sortDescText : "Åadit sestupnÄ",
+      lockText     : "Ukotvit sloupec",
+      unlockText   : "Uvolnit sloupec",
+      columnsText  : "Sloupce"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ÅœÃ¡dnÃ¡ data)',
+    groupByText    : 'Seskupit dle tohoto pole',
+    showGroupsText : 'Zobrazit ve skupinÄ'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "NÃ¡zev",
+      valueText  : "Hodnota",
+      dateFormat : "j.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Tahem zmÄnit velikost.",
+      collapsibleSplitTip : "Tahem zmÄnit velikost. Dvojklikem skrÃœt."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-mk.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-mk.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-mk.js	(revision 76)
@@ -0,0 +1,178 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Macedonia translation
+ * By PetarD petar.dimitrijevic@vorteksed.com.mk (utf8 encoding)
+ * 23 April 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÐÑÐžÑÑÐ²Ð°ÐŒ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ÐžÐ·Ð±ÑÐ°ÐœÐž ÑÐµÐŽÐžÑÐž";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÐÐ°ÑÐ²ÐŸÑÐž tab";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "ÐÑÐµÐŽÐœÐŸÑÑÐ° Ð²ÐŸ ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ ÐœÐµÐ²Ð°Ð»ÐžÐŽÐœÐ°";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ÐÑÐžÑÑÐ²Ð°ÐŒ...";
+}
+
+Date.monthNames = [
+   "ÐÐ°ÐœÑÐ°ÑÐž",
+   "Ð€ÐµÐ²ÑÑÐ°ÑÐž",
+   "ÐÐ°ÑÑ",
+   "ÐÐ¿ÑÐžÐ»",
+   "ÐÐ°Ñ",
+   "ÐÑÐœÐž",
+   "ÐÑÐ»Ðž",
+   "ÐÐ²Ð³ÑÑÑ",
+   "Ð¡ÐµÐ¿ÑÐµÐŒÐ²ÑÐž",
+   "ÐÐºÑÐŸÐŒÐ²ÑÐž",
+   "ÐÐŸÐµÐŒÐ²ÑÐž",
+   "ÐÐµÐºÐµÐŒÐ²ÑÐž"
+];
+
+Date.dayNames = [
+   "ÐÐµÐŽÐµÐ»Ð°",
+   "ÐÐŸÐœÐµÐŽÐµÐ»ÐœÐžÐº",
+   "ÐÑÐŸÑÐœÐžÐº",
+   "Ð¡ÑÐµÐŽÐ°",
+   "Ð§ÐµÑÐ²ÑÑÐŸÐº",
+   "ÐÐµÑÐŸÐº",
+   "Ð¡Ð°Ð±ÐŸÑÐ°"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "ÐÐŸÑÐ²ÑÐŽÐž",
+      cancel : "ÐÐŸÐœÐžÑÑÐž",
+      yes    : "ÐÐ°",
+      no     : "ÐÐµ"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "ÐÐµÐœÐµÑÐºÐ°",
+      minText           : "ÐÐ²ÐŸÑ ÐŽÐ°ÑÑÐŒ Ðµ Ð¿ÑÐµÐŽ ÐœÐ°ÑÐŒÐ°Ð»ÐžÐŸÑ ÐŽÐ°ÑÑÐŒ",
+      maxText           : "ÐÐ²ÐŸÑ ÐŽÐ°ÑÑÐŒ Ðµ Ð¿ÑÐµÐŽ ÐœÐ°ÑÐ³ÐŸÐ»ÐµÐŒÐžÐŸÑ ÐŽÐ°ÑÑÐŒ",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'Ð¡Ð»ÐµÐŽÐµÐœ ÐŒÐµÑÐµÑ (Control+Ð¡ÑÑÐµÐ»ÐºÐ° ÐŽÐµÑÐœÐŸ)',
+      prevText          : 'ÐÑÐµÑÑ
+ÐŸÐŽÐµÐœ ÐŒÐµÑÐµÑ (Control+Ð¡ÑÑÐµÐ»ÐºÐ° Ð»ÐµÐ²ÐŸ)',
+      monthYearText     : 'ÐÐ·Ð±ÐµÑÐµÑÐµ ÐŒÐµÑÐµÑ (Control+Ð¡ÑÑÐµÐ»ÐºÐ° Ð³ÐŸÑÐµ/Ð¡ÑÑÐµÐ»ÐºÐ° ÐŽÐµÑÐœÐŸ Ð·Ð° ÐŒÐµÐœÑÐ²Ð°ÑÐµ Ð³ÐŸÐŽÐžÐœÐ°)',
+      todayTip          : "{0} (Spacebar)",
+      format            : "d.m.y"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+      afterPageText  : "ÐŸÐŽ {0}",
+      firstText      : "ÐÑÐ²Ð° Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+      prevText       : "ÐÑÐµÑÑ
+ÐŸÐŽÐœÐ° Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+      nextText       : "Ð¡Ð»ÐµÐŽÐœÐ° Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+      lastText       : "ÐÐŸÑÐ»ÐµÐŽÐœÐ° Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+      refreshText    : "ÐÑÐ²ÐµÐ¶Ðž",
+      displayMsg     : "ÐÑÐžÐºÐ°Ð¶ÑÐ²Ð°ÐŒ {0} - {1} ÐŸÐŽ {2}",
+      emptyMsg       : 'ÐÐµÐŒÐ° Ð¿ÐŸÐŽÐ°ÑÐŸÑÐž Ð·Ð° Ð¿ÑÐžÐºÐ°Ð·'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÐŽÐŸÐ»Ð¶ÐžÐœÐ° Ð·Ð° ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+      maxLengthText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° ÐŽÐŸÐ»Ð¶ÐžÐœÐ° Ð·Ð° ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+      blankText     : "ÐÐŸÐŽÐ°ÑÐŸÑÐžÑÐµ Ð²ÐŸ ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÐµ Ð¿ÐŸÑÑÐµÐ±ÐœÐž",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "ÐÐžÐœÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° Ð²ÑÐµÐŽÐœÐŸÑÑ Ð·Ð° ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+      maxText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÐœÐ°ÑÐ° Ð²ÑÐµÐŽÐœÐŸÑÑ Ð·Ð° ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ Ðµ {0}",
+      nanText : "{0} ÐœÐµ Ðµ Ð²Ð°Ð»ÐžÐŽÐµÐœ Ð±ÑÐŸÑ"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ÐÐµÐ°ÐºÑÐžÐ²ÐœÐŸ",
+      disabledDatesText : "ÐÐµÐ°ÐºÑÐžÐ²ÐœÐŸ",
+      minText           : "ÐÐ°ÑÑÐŒÐŸÑ Ð²ÐŸ ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÐŒÐŸÑÐ° ÐŽÐ° Ð±ÐžÐŽÐµ Ð¿ÑÐµÐŽ {0}",
+      maxText           : "ÐÐ°ÑÑÐŒÐŸÑ Ð²ÐŸ ÐŸÐ²Ð° Ð¿ÐŸÐ»Ðµ ÐŒÐŸÑÐ° ÐŽÐ° Ð±ÐžÐŽÐµ Ð¿ÐŸ {0}",
+      invalidText       : "{0} ÐœÐµ Ðµ Ð²Ð°Ð»ÐžÐŽÐµÐœ ÐŽÐ°ÑÑÐŒ - ÐŒÐŸÑÐ° ÐŽÐ° Ð±ÐžÐŽÐµ Ð²ÐŸ ÑÐŸÑÐŒÐ°Ñ {1}",
+      format            : "d.m.y"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ÐÑÐžÑÑÐ²Ð°ÐŒ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'ÐÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÐµÐ±Ð° ÐŽÐ° Ð±ÐžÐŽÐµ e-mail Ð°ÐŽÑÐµÑÐ° Ð²ÐŸ ÑÐŸÑÐŒÐ°Ñ "user@example.com"',
+      urlText      : 'ÐÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÐµÐ±Ð° ÐŽÐ° Ð±ÐžÐŽÐµ URL Ð²ÐŸ ÑÐŸÑÐŒÐ°Ñ "http:/'+'/www.example.com"',
+      alphaText    : 'ÐÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÐµÐ±Ð° ÐŽÐ° ÑÐŸÐŽÑÐ¶Ðž ÑÐ°ÐŒÐŸ Ð±ÑÐºÐ²Ðž Ðž _',
+      alphanumText : 'ÐÐ²Ð° Ð¿ÐŸÐ»Ðµ ÑÑÐµÐ±Ð° ÐŽÐ° ÑÐŸÐŽÑÐ¶Ðž ÑÐ°ÐŒÐŸ Ð±ÑÐºÐ²Ðž, Ð±ÑÐŸÑÐºÐž Ðž _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ð¡ÐŸÑÑÐžÑÐ°Ñ Ð Ð°ÑÑÐµÑÐºÐž",
+      sortDescText : "Ð¡ÐŸÑÑÐžÑÐ°Ñ ÐÐ¿Ð°ÑÐ°ÑÐºÐž",
+      lockText     : "ÐÐ°ÐºÐ»ÑÑÐž ÐÐŸÐ»ÐŸÐœÐ°",
+      unlockText   : "ÐÑÐºÐ»ÑÑÐž ÐºÐŸÐ»ÐŸÐœÐ°",
+      columnsText  : "ÐÐŸÐ»ÐŸÐœÐž"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÐÐŒÐµ",
+      valueText  : "ÐÑÐµÐŽÐœÐŸÑÑ",
+      dateFormat : "m.d.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "ÐÐŸÐ²Ð»ÐµÑÐµÑÐµ Ð·Ð° ÐŒÐµÐœÑÐ²Ð°ÑÐµ ÐœÐ° Ð³ÐŸÐ»ÐµÐŒÐžÐœÐ°ÑÐ°.",
+      collapsibleSplitTip : "ÐÐŸÐ²Ð»ÐµÑÐµÑÐµ Ð·Ð° ÐŒÐµÐœÑÐ²Ð°ÑÐµ ÐœÐ° Ð³ÐŸÐ»ÐµÐŒÐžÐœÐ°ÑÐ°. ÐÑÐ¿Ð»Ðž ÐºÐ»ÐžÐº Ð·Ð° ÐºÑÐžÐµÑÐµ."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-es.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-es.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-es.js	(revision 76)
@@ -0,0 +1,319 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Spanish/Latin American Translation by genius551v 04-08-2007
+ * Revised by efege, 2007-04-15.
+ * Revised by Rafaga2k 10-01-2007 (mm/dd/yyyy)
+ * Revised by FeDe 12-13-2007 (mm/dd/yyyy)
+ * Synchronized with 2.2 version of ext-lang-en.js (provided by Condor 8 aug 2008) 
+ *     by halkon_polako 14-aug-2008
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Cargando...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} fila(s) seleccionada(s)";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Cargando...";
+}
+
+Date.monthNames = [
+  "Enero",
+  "Febrero",
+  "Marzo",
+  "Abril",
+  "Mayo",
+  "Junio",
+  "Julio",
+  "Agosto",
+  "Septiembre",
+  "Octubre",
+  "Noviembre",
+  "Diciembre"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Ene : 0,
+  Feb : 1,
+  Mar : 2,
+  Abr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Ago : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dic : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Domingo",
+  "Lunes",
+  "Martes",
+  "Mi\u00E9rcoles",
+  "Jueves",
+  "Viernes",
+  "S\u00E1bado"
+];
+
+Date.getShortDayName = function(day) {
+  if (day==3) return "MiÃ©";
+  if (day==6) return "SÃ¡b";
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:st|nd|rd|th)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "Aceptar",
+    cancel : "Cancelar",
+    yes    : "S\u00ED",
+    no     : "No"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Hoy",
+    minText           : "Esta fecha es anterior a la fecha m\u00EDnima",
+    maxText           : "Esta fecha es posterior a la fecha m\u00E1xima",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames	      : Date.monthNames,
+    dayNames		  : Date.dayNames,
+    nextText          : 'Mes Siguiente (Control+Right)',
+    prevText          : 'Mes Anterior (Control+Left)',
+    monthYearText     : 'Seleccione un mes (Control+Up/Down para desplazar el a\u00F1o)',
+    todayTip          : "{0} (Barra espaciadora)",
+    format            : "d/m/Y",
+    okText            : "&#160;Ok&#160;",
+    cancelText        : "Cancelar",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "P\u00E1gina",
+    afterPageText  : "de {0}",
+    firstText      : "Primera p\u00E1gina",
+    prevText       : "P\u00E1gina anterior",
+    nextText       : "P\u00E1gina siguiente",
+    lastText       : "Ãltima p\u00E1gina",
+    refreshText    : "Actualizar",
+    displayMsg     : "Mostrando {0} - {1} de {2}",
+    emptyMsg       : 'Sin datos para mostrar'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "El valor en este campo es inv\u00E1lido";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "El tama\u00F1o m\u00EDnimo para este campo es de {0}",
+    maxLengthText : "El tama\u00F1o m\u00E1ximo para este campo es de {0}",
+    blankText     : "Este campo es obligatorio",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ".",
+    decimalPrecision : 2,
+    minText : "El valor m\u00EDnimo para este campo es de {0}",
+    maxText : "El valor m\u00E1ximo para este campo es de {0}",
+    nanText : "{0} no es un n\u00FAmero v\u00E1lido"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Deshabilitado",
+    disabledDatesText : "Deshabilitado",
+    minText           : "La fecha para este campo debe ser posterior a {0}",
+    maxText           : "La fecha para este campo debe ser anterior a {0}",
+    invalidText       : "{0} no es una fecha v\u00E1lida - debe tener el formato {1}",
+    format            : "d/m/Y",
+    altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Cargando...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Este campo debe ser una direcci\u00F3n de correo electr\u00F3nico con el formato "usuario@dominio.com"',
+    urlText      : 'Este campo debe ser una URL con el formato "http:/'+'/www.dominio.com"',
+    alphaText    : 'Este campo s\u00F3lo debe contener letras y _',
+    alphanumText : 'Este campo s\u00F3lo debe contener letras, n\u00FAmeros y _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : "Por favor proporcione la URL para el enlace:",
+    buttonTips : {
+      bold : {
+        title: 'Negritas (Ctrl+B)',
+	    text: 'Transforma el texto seleccionado en Negritas.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'It\u00E1lica (Ctrl+I)',
+        text: 'Transforma el texto seleccionado en It\u00E1licas.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Subrayado (Ctrl+U)',
+        text: 'Subraya el texto seleccionado.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Aumentar la fuente',
+        text: 'Aumenta el tama\u00F1o de la fuente',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Reducir la fuente',
+        text: 'Reduce el tama\u00F1o de la fuente.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Color de fondo',
+        text: 'Modifica el color de fondo del texto seleccionado.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Color de la fuente',
+        text: 'Modifica el color del texto seleccionado.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Alinear a la izquierda',
+        text: 'Alinea el texto a la izquierda.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centrar',
+        text: 'Centrar el texto.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Alinear a la derecha',
+        text: 'Alinea el texto a la derecha.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Lista de vi\u00F1etas',
+        text: 'Inicia una lista con vi\u00F1etas.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Lista numerada',
+        text: 'Inicia una lista numerada.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Enlace',
+        text: 'Inserta un enlace de hipertexto.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'C\u00F3digo Fuente',
+        text: 'Pasar al modo de edici\u00F3n de c\u00F3digo fuente.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Ordenar en forma ascendente",
+    sortDescText : "Ordenar en forma descendente",
+    columnsText  : "Columnas"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Ninguno)',
+    groupByText    : 'Agrupar por este campo',
+    showGroupsText : 'Mostrar en grupos'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nombre",
+    valueText  : "Valor",
+    dateFormat : "j/m/Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Arrastre para redimensionar.",
+    collapsibleSplitTip : "Arrastre para redimensionar. Doble clic para ocultar."
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "La hora en este campo debe ser igual o posterior a {0}",
+    maxText : "La hora en este campo debe ser igual o anterior a {0}",
+    invalidText : "{0} no es una hora v\u00E1lida",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "Debe seleccionar al menos un \u00E9tem de este grupo"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "Debe seleccionar un \u00E9tem de este grupo"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ko.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ko.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ko.js	(revision 76)
@@ -0,0 +1,290 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Korean Translations By nicetip
+ * 05 September 2007
+ * Modify by techbug / 25 February 2008
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ë¡ë©ì€...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ê°ê° ì íëììµëë€.";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ë«êž°";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "ì¬ë°ë¥ž ê°ìŽ ìëëë€.";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ë¡ë©ì€...";
+}
+
+Date.monthNames = [
+   "1ì",
+   "2ì",
+   "3ì",
+   "4ì",
+   "5ì",
+   "6ì",
+   "7ì",
+   "8ì",
+   "9ì",
+   "10ì",
+   "11ì",
+   "12ì"
+];
+
+Date.dayNames = [
+   "ìŒ",
+   "ì",
+   "í",
+   "ì",
+   "ëª©",
+   "êž",
+   "í "
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "íìž",
+      cancel : "ì·šì",
+      yes    : "ì",
+      no     : "ìëì€"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "m/d/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "ì€ë",
+      minText           : "ìµì ë ì§ë²ìë¥Œ ëììµëë€.",
+      maxText           : "ìµë ë ì§ë²ìë¥Œ ëììµëë€.",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'ë€ìë¬(ì»šížë¡€í€+ì€ë¥žìªœ íìŽí)',
+      prevText          : 'ìŽì ë¬ (ì»šížë¡€í€+ìŒì¡± íìŽí)',
+      monthYearText     : 'ìì ì ííŽì£Œìžì. (ì»šížë¡€í€+ì/ìë íìŽí)',
+      todayTip          : "{0} (ì€íìŽì€ë°)",
+      format            : "m/d/y",
+      okText            : "íìž",
+      cancelText        : "ì·šì",
+      startDay          : 0
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "íìŽì§",
+      afterPageText  : "/ {0}",
+      firstText      : "ì²« íìŽì§",
+      prevText       : "ìŽì  íìŽì§",
+      nextText       : "ë€ì íìŽì§",
+      lastText       : "ë§ì§ë§ íìŽì§",
+      refreshText    : "ìë¡ê³ ì¹š",
+      displayMsg     : "ì ì²Ž {2} ì€ {0} - {1}",
+      emptyMsg       : 'íìí  ë°ìŽí°ê° ììµëë€.'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "ìµìêžžìŽë {0}ì
+ëë€.",
+      maxLengthText : "ìµëêžžìŽë {0}ì
+ëë€.",
+      blankText     : "ê°ì ì
+ë ¥íŽì£Œìžì.",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "ìµìê°ì {0}ì
+ëë€.",
+      maxText : "ìµëê°ì {0}ì
+ëë€.",
+      nanText : "{0}ë ì¬ë°ë¥ž ì«ìê° ìëëë€."
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ë¹íì±",
+      disabledDatesText : "ë¹íì±",
+      minText           : "{0}ìŒ ìŽíì¬ìŒ í©ëë€.",
+      maxText           : "{0}ìŒ ìŽì ìŽìŽìŒ í©ëë€.",
+      invalidText       : "{0}ë ì¬ë°ë¥ž ë ì§íììŽ ìëëë€. - ë€ìê³Œ ê°ì íììŽìŽìŒ í©ëë€. {1}",
+      format            : "m/d/y",
+      startDay          : 0
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ë¡ë©ì€...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'ìŽë©ìŒ ì£Œì íìì ë§ê² ì
+ë ¥íŽìŒí©ëë€. (ì: "user@example.com")',
+      urlText      : 'URL íìì ë§ê² ì
+ë ¥íŽìŒí©ëë€. (ì: "http:/'+'/www.example.com")',
+      alphaText    : 'ìë¬ž, ë°ì€(_)ë§ ì
+ë ¥í  ì ììµëë€.',
+      alphanumText : 'ìë¬ž, ì«ì, ë°ì€(_)ë§ ì
+ë ¥í  ì ììµëë€.'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+   createLinkText : 'URLì ì
+ë ¥íŽì£Œìžì:',
+   buttonTips : {
+            bold : {
+               title: 'êµµê² (Ctrl+B)',
+               text: 'ì íí í
+ì€ížë¥Œ êµµê² íìí©ëë€.',
+               cls: 'x-html-editor-tip'
+            },
+            italic : {
+               title: 'êž°ìžìêŒŽ (Ctrl+I)',
+               text: 'ì íí í
+ì€ížë¥Œ êž°ìžìêŒŽë¡ íìí©ëë€.',
+               cls: 'x-html-editor-tip'
+            },
+            underline : {
+               title: 'ë°ì€ (Ctrl+U)',
+               text: 'ì íí í
+ì€ížì ë°ì€ì íìí©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           increasefontsize : {
+               title: 'êžêŒŽí¬êž° ëëŠŒ',
+               text: 'êžêŒŽ í¬êž°ë¥Œ í¬ê² í©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           decreasefontsize : {
+               title: 'êžêŒŽí¬êž° ì€ì',
+               text: 'êžêŒŽ í¬êž°ë¥Œ ìê² í©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           backcolor : {
+               title: 'í
+ì€íž ê°ì¡° ì',
+               text: 'ì íí í
+ì€ížì ë°°ê²œìì ë³ê²œí©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           forecolor : {
+               title: 'êžêŒŽì',
+               text: 'ì íí í
+ì€ížì ìì ë³ê²œí©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyleft : {
+               title: 'í
+ì€íž ìŒìªœ ë§ì¶€',
+               text: 'ìŒìªœì í
+ì€ížë¥Œ ë§ì¶¥ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           justifycenter : {
+               title: 'ê°ìŽë° ë§ì¶€',
+               text: 'ê°ìŽë°ì í
+ì€ížë¥Œ ë§ì¶¥ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyright : {
+               title: 'í
+ì€íž ì€ë¥žìªœ ë§ì¶€',
+               text: 'ì€ë¥žìªœì í
+ì€ížë¥Œ ë§ì¶¥ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           insertunorderedlist : {
+               title: 'êžëšžëŠ¬ êž°íž',
+               text: 'êžëšžëŠ¬ êž°íž ëª©ë¡ì ììí©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           insertorderedlist : {
+               title: 'ë²íž ë§€êž°êž°',
+               text: 'ë²íž ë§€êž°êž° ëª©ë¡ì ììí©ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           createlink : {
+               title: 'íìŽíŒë§í¬',
+               text: 'ì íí í
+ì€ížì íìŽíŒë§í¬ë¥Œ ë§ë­ëë€.',
+               cls: 'x-html-editor-tip'
+           },
+           sourceedit : {
+               title: 'ìì€ížì§',
+               text: 'ìì€ížì§ ëªšëë¡ ë³íí©ëë€.',
+               cls: 'x-html-editor-tip'
+           }
+        }
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "ì€ëŠì°šì ì ë ¬",
+      sortDescText : "ëŽëŠŒì°šì ì ë ¬",
+      lockText     : "ì¹ŒëŒ ì êž",
+      unlockText   : "ì¹ŒëŒ ì êžíŽì ",
+      columnsText  : "ì¹ŒëŒ ëª©ë¡"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(None)',
+    groupByText    : 'íì¬ íëë¡ ê·žë£¹íí©ëë€.',
+    showGroupsText : 'ê·žë£¹ìŒë¡ ë³Žì¬ì£Œêž°'
+
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "í­ëª©",
+      valueText  : "ê°",
+      dateFormat : "m/j/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "í¬êž°ë³ê²œì ìíŽ ëëê·žíìžì.",
+      collapsibleSplitTip : "í¬êž°ë³ê²œì ìíŽ ëëê·ž, ìšêž°êž° ìíŽ ëëžíŽëŠ­ íìžì."
+   });
+}
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hu.js	(revision 76)
@@ -0,0 +1,297 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * Hungarian Translations (utf-8 encoded)
+ * by Amon <amon@theba.hu> (27 Apr 2008)
+ * encoding fixed by Vili (17 Feb 2009)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">BetÃ¶ltÃ©s...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} kivÃ¡lasztott sor";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "FÃŒl bezÃ¡rÃ¡sa";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "HibÃ¡s Ã©rtÃ©k!";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "BetÃ¶ltÃ©s...";
+}
+
+Date.monthNames = [
+  "JanuÃ¡r",
+  "FebruÃ¡r",
+  "MÃ¡rcius",
+  "Ãprilis",
+  "MÃ¡jus",
+  "JÃºnius",
+  "JÃºlius",
+  "Augusztus",
+  "Szeptember",
+  "OktÃ³ber",
+  "November",
+  "December"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  'Jan' : 0,
+  'Feb' : 1,
+  'MÃ¡r' : 2,
+  'Ãpr' : 3,
+  'MÃ¡j' : 4,
+  'JÃºn' : 5,
+  'JÃºl' : 6,
+  'Aug' : 7,
+  'Sze' : 8,
+  'Okt' : 9,
+  'Nov' : 10,
+  'Dec' : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "VasÃ¡rnap",
+  "HÃ©tfÅ",
+  "Kedd",
+  "Szerda",
+  "CsÃŒtÃ¶rtÃ¶k",
+  "PÃ©ntek",
+  "Szombat"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "MÃ©gsem",
+    yes    : "Igen",
+    no     : "Nem"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "Y m d");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Mai nap",
+    minText           : "A dÃ¡tum korÃ¡bbi a megengedettnÃ©l",
+    maxText           : "A dÃ¡tum kÃ©sÅbbi a megengedettnÃ©l",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'KÃ¶v. hÃ³nap (CTRL+Jobbra)',
+    prevText          : 'ElÅzÅ hÃ³nap (CTRL+Balra)',
+    monthYearText     : 'VÃ¡lassz hÃ³napot (ÃvvÃ¡lasztÃ¡s: CTRL+Fel/Le)',
+    todayTip          : "{0} (SzÃ³kÃ¶z)",
+    format            : "y-m-d",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "MÃ©gsem",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Oldal",
+    afterPageText  : "a {0}-bÃ³l/bÅl",
+    firstText      : "ElsÅ oldal",
+    prevText       : "ElÅzÅ oldal",
+    nextText       : "KÃ¶vetkezÅ oldal",
+    lastText       : "UtolsÃ³ oldal",
+    refreshText    : "FrissÃ­tÃ©s",
+    displayMsg     : "{0} - {1} sorok lÃ¡thatÃ³k a {2}-bÃ³l/bÅl",
+    emptyMsg       : 'Nincs megjelenÃ­thetÅ adat'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "A mezÅ tartalma legalÃ¡bb {0} hosszÃº kell legyen",
+    maxLengthText : "A mezÅ tartalma legfeljebb {0} hosszÃº lehet",
+    blankText     : "KÃ¶telezÅen kitÃ¶ltendÅ mezÅ",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "A mezÅ tartalma nem lehet kissebb, mint {0}",
+    maxText : "A mezÅ tartalma nem lehet nagyobb, mint {0}",
+    nanText : "{0} nem szÃ¡m"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Nem vÃ¡laszthatÃ³",
+    disabledDatesText : "Nem vÃ¡laszthatÃ³",
+    minText           : "A dÃ¡tum nem lehet korÃ¡bbi, mint {0}",
+    maxText           : "A dÃ¡tum nem lehet kÃ©sÅbbi, mint {0}",
+    invalidText       : "{0} nem megfelelÅ dÃ¡tum - a helyes formÃ¡tum: {1}",
+    format            : "Y m d",
+    altFormats        : "Y-m-d|y-m-d|y/m/d|m/d|m-d|md|ymd|Ymd|d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "BetÃ¶ltÃ©s...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'A mezÅ email cÃ­met tartalmazhat, melynek formÃ¡tuma "felhasznÃ¡lÃ³@szolgÃ¡ltatÃ³.hu"',
+    urlText      : 'A mezÅ webcÃ­met tartalmazhat, melynek formÃ¡tuma "http:/'+'/www.weboldal.hu"',
+    alphaText    : 'A mezÅ csak betÅ±ket Ã©s alÃ¡hÃºzÃ¡st (_) tartalmazhat',
+    alphanumText : 'A mezÅ csak betÅ±ket, szÃ¡mokat Ã©s alÃ¡hÃºzÃ¡st (_) tartalmazhat'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Add meg a webcÃ­met:',
+    buttonTips : {
+      bold : {
+        title: 'FÃ©lkÃ¶vÃ©r (Ctrl+B)',
+        text: 'FÃ©lkÃ¶vÃ©rrÃ© teszi a kijelÃ¶lt szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'DÅlt (Ctrl+I)',
+        text: 'DÅltÃ© teszi a kijelÃ¶lt szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'AlÃ¡hÃºzÃ¡s (Ctrl+U)',
+        text: 'AlÃ¡hÃºzza a kijelÃ¶lt szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'SzÃ¶veg nagyÃ­tÃ¡s',
+        text: 'NÃ¶veli a szÃ¶vegmÃ©retet.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'SzÃ¶veg kicsinyÃ­tÃ©s',
+        text: 'CsÃ¶kkenti a szÃ¶vegmÃ©retet.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'HÃ¡ttÃ©rszÃ­n',
+        text: 'A kijelÃ¶lt szÃ¶veg hÃ¡ttÃ©rszÃ­nÃ©t mÃ³dosÃ­tja.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'SzÃ¶vegszÃ­n',
+        text: 'A kijelÃ¶lt szÃ¶veg szÃ­nÃ©t mÃ³dosÃ­tja.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Balra zÃ¡rt',
+        text: 'Balra zÃ¡rja a szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'KÃ¶zÃ©pre zÃ¡rt',
+        text: 'KÃ¶zÃ©pre zÃ¡rja a szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Jobbra zÃ¡rt',
+        text: 'Jobbra zÃ¡rja a szÃ¶veget.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'FelsorolÃ¡s',
+        text: 'FelsorolÃ¡st kezd.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'SzÃ¡mozÃ¡s',
+        text: 'SzÃ¡mozott listÃ¡t kezd.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hiperlink',
+        text: 'A kijelÃ¶lt szÃ¶veget linkkÃ© teszi.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ForrÃ¡s nÃ©zet',
+        text: 'ForrÃ¡s nÃ©zetbe kapcsol.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "NÃ¶vekvÅ rendezÃ©s",
+    sortDescText : "CsÃ¶kkenÅ rendezÃ©s",
+    lockText     : "Oszlop zÃ¡rolÃ¡s",
+    unlockText   : "Oszlop feloldÃ¡s",
+    columnsText  : "Oszlopok"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Nincs)',
+    groupByText    : 'Oszlop szerint csoportosÃ­tÃ¡s',
+    showGroupsText : 'Csoportos nÃ©zet'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "NÃ©v",
+    valueText  : "ÃrtÃ©k",
+    dateFormat : "Y m j"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "ÃtmÃ©retezÃ©s hÃºzÃ¡sra.",
+    collapsibleSplitTip : "ÃtmÃ©retezÃ©s hÃºzÃ¡sra. EltÃŒntetÃ©s duplaklikk."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sk.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sk.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sk.js	(revision 76)
@@ -0,0 +1,182 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ */
+ 
+ /*  Slovak Translation by Michal Thomka
+  *  14 April 2007
+  */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">NahrÃ¡vam...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} oznaÄenÃœch riadkov";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ZavrieÅ¥ tÃºto zÃ¡loÅŸku";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Hodnota v tomto poli je nesprÃ¡vna";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "NahrÃ¡vam...";
+}
+
+Date.monthNames = [
+   "JanuÃ¡r",
+   "FebruÃ¡r",
+   "Marec",
+   "AprÃ­l",
+   "MÃ¡j",
+   "JÃºn",
+   "JÃºl",
+   "August",
+   "September",
+   "OktÃ³ber",
+   "November",
+   "December"
+];
+
+Date.dayNames = [
+   "NedeÄŸa",
+   "Pondelok",
+   "Utorok",
+   "Streda",
+   "Å tvrtok",
+   "Piatok",
+   "Sobota"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "ZruÅ¡iÅ¥",
+      yes    : "Ãno",
+      no     : "Nie"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Dnes",
+      minText           : "Tento dÃ¡tum je menÅ¡Ã­ ako minimÃ¡lny moÅŸnÃœ dÃ¡tum",
+      maxText           : "Tento dÃ¡tum je vÃ€ÄÅ¡Ã­ ako maximÃ¡lny moÅŸnÃœ dÃ¡tum",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'ÄalÅ¡Ã­ Mesiac (Control+Doprava)',
+      prevText          : 'Predch. Mesiac (Control+DoÄŸava)',
+      monthYearText     : 'Vyberte Mesiac (Control+Hore/Dole pre posun rokov)',
+      todayTip          : "{0} (MedzernÃ­k)",
+      format            : "d.m.Y"
+   });
+}
+
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Strana",
+      afterPageText  : "z {0}",
+      firstText      : "PrvÃ¡ Strana",
+      prevText       : "Predch. Strana",
+      nextText       : "ÄalÅ¡ia Strana",
+      lastText       : "PoslednÃ¡ strana",
+      refreshText    : "ObnoviÅ¥",
+      displayMsg     : "Zobrazujem {0} - {1} z {2}",
+      emptyMsg       : 'Âiadne dÃ¡ta'
+   });
+}
+
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "MinimÃ¡lna dÄºÅŸka pre toto pole je {0}",
+      maxLengthText : "MaximÃ¡lna dÄºÅŸka pre toto pole je {0}",
+      blankText     : "Toto pole je povinnÃ©",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "MinimÃ¡lna hodnota pre toto pole je {0}",
+      maxText : "MaximÃ¡lna hodnota pre toto pole je {0}",
+      nanText : "{0} je nesprÃ¡vne ÄÃ­slo"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ZablokovanÃ©",
+      disabledDatesText : "ZablokovanÃ©",
+      minText           : "DÃ¡tum v tomto poli musÃ­ byÅ¥ aÅŸ po {0}",
+      maxText           : "DÃ¡tum v tomto poli musÃ­ byÅ¥ pred {0}",
+      invalidText       : "{0} nie je sprÃ¡vny dÃ¡tum - musÃ­ byÅ¥ vo formÃ¡te {1}",
+      format            : "d.m.Y"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "NahrÃ¡vam...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Toto pole musÃ­ byÅ¥ e-mailovÃ¡ adresa vo formÃ¡te "user@example.com"',
+      urlText      : 'Toto pole musÃ­ byÅ¥ URL vo formÃ¡te "http:/'+'/www.example.com"',
+      alphaText    : 'Toto pole moÅŸe obsahovaÅ¥ iba pÃ­smenÃ¡ a znak _',
+      alphanumText : 'Toto pole moÅŸe obsahovaÅ¥ iba pÃ­smenÃ¡, ÄÃ­sla a znak _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "ZoradiÅ¥ vzostupne",
+      sortDescText : "ZoradiÅ¥ zostupne",
+      lockText     : "ZamknÃºÅ¥ stÄŸpec",
+      unlockText   : "OdomknÃºÅ¥ stÄŸpec",
+      columnsText  : "StÄŸpce"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "NÃ¡zov",
+      valueText  : "Hodnota",
+      dateFormat : "d.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Potiahnite pre zmenu rozmeru",
+      collapsibleSplitTip : "Potiahnite pre zmenu rozmeru. Dvojklikom schovÃ¡te."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ro.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ro.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ro.js	(revision 76)
@@ -0,0 +1,296 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Romanian translations for ExtJS 2.1
+ * First released by Lucian Lature on 2007-04-24
+ * Changed locale for Romania (date formats) as suggested by keypoint
+ * on ExtJS forums: http://www.extjs.com/forum/showthread.php?p=129524#post129524
+ * Removed some useless parts
+ * Changed by: Emil Cazamir, 2008-04-24
+ * Fixed some errors left behind
+ * Changed by: Emil Cazamir, 2008-09-01
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÃncÄrcare...</div>';
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} rÃ¢nd(uri) selectate";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Ãnchide acest tab";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Valoarea acestui cÃ¢mp este invalidÄ";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ÃncÄrcare...";
+}
+
+Date.monthNames = [
+   "Ianuarie",
+   "Februarie",
+   "Martie",
+   "Aprilie",
+   "Mai",
+   "Iunie",
+   "Iulie",
+   "August",
+   "Septembrie",
+   "Octombrie",
+   "Noiembrie",
+   "Decembrie"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Ian : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  Mai : 4,
+  Iun : 5,
+  Iul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Noi : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "DuminicÄ",
+   "Luni",
+   "MarÅ£i",
+   "Miercuri",
+   "Joi",
+   "Vineri",
+   "SÃ¢mbÄtÄ"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "RenunÅ£Ä",
+      yes    : "Da",
+      no     : "Nu"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "AstÄzi",
+    minText           : "AceastÄ datÄ este anterioarÄ datei minime",
+    maxText           : "AceastÄ datÄ este ulterioarÄ datei maxime",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Luna urmÄtoare (Control+Dreapta)',
+    prevText          : 'Luna precedentÄ (Control+StÃ¢nga)',
+    monthYearText     : 'Alege o lunÄ (Control+Sus/Jos pentru a parcurge anii)',
+    todayTip          : "{0} (Bara spaÈiu)",
+    format            : "d.m.Y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "RenunÈÄ",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Pagina",
+    afterPageText  : "din {0}",
+    firstText      : "Prima paginÄ",
+    prevText       : "Pagina anterioarÄ",
+    nextText       : "Pagina urmÄtoare",
+    lastText       : "Ultima paginÄ",
+    refreshText    : "ÃmprospÄteazÄ",
+    displayMsg     : "AfiÈare Ã®nregistrÄrile {0} - {1} din {2}",
+    emptyMsg       : 'Nu sunt date de afiÈat'
+  });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Lungimea minimÄ pentru acest cÃ¢mp este de {0}",
+      maxLengthText : "Lungimea maximÄ pentru acest cÃ¢mp este {0}",
+      blankText     : "Acest cÃ¢mp este obligatoriu",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Valoarea minimÄ permisÄ a acestui cÃ¢mp este {0}",
+      maxText : "Valaorea maximÄ permisÄ a acestui cÃ¢mp este {0}",
+      nanText : "{0} nu este un numÄr valid"
+   });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Indisponibil",
+    disabledDatesText : "Indisponibil",
+    minText           : "Data din aceastÄ casetÄ trebuie sÄ fie dupÄ {0}",
+    maxText           : "Data din aceastÄ casetÄ trebuie sÄ fie inainte de {0}",
+    invalidText       : "{0} nu este o datÄ validÄ, trebuie sÄ fie Ã®n formatul {1}",
+    format            : "d.m.Y",
+    altFormats        : "d-m-Y|d.m.y|d-m-y|d.m|d-m|dm|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "ÃncÄrcare...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Acest cÃ¢mp trebuie sÄ conÅ£inÄ o adresÄ de e-mail Ã®n formatul "user@domeniu.com"',
+      urlText      : 'Acest cÃ¢mp trebuie sÄ conÅ£inÄ o adresÄ URL Ã®n formatul "http:/'+'/www.domeniu.com"',
+      alphaText    : 'Acest cÃ¢mp trebuie sÄ conÅ£inÄ doar litere Åi _',
+      alphanumText : 'Acest cÃ¢mp trebuie sÄ conÅ£inÄ doar litere, cifre Åi _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'VÄ rugÄm introduceti un URL pentru aceastÄ legÄturÄ web:',
+    buttonTips : {
+      bold : {
+        title: 'ÃngroÅat (Ctrl+B)',
+        text: 'ÃngroÅati caracterele textului selectat.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Ãnclinat (Ctrl+I)',
+        text: 'ÃnclinaÅ£i caracterele textului selectat.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Subliniat (Ctrl+U)',
+        text: 'SubliniaÅ£i caracterele textului selectat.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'MÄrit',
+        text: 'MÄreÅte dimensiunea fontului.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'MicÅorat',
+        text: 'MicÅoreazÄ dimensiunea textului.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Culoarea fundalului',
+        text: 'SchimbÄ culoarea fundalului pentru textul selectat.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Culoarea textului',
+        text: 'SchimbÄ culoarea textului selectat.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Aliniat la stÃ¢nga',
+        text: 'AliniazÄ textul la stÃ¢nga.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centrat',
+        text: 'CentreazÄ textul Ã®n editor.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Aliniat la dreapta',
+        text: 'AliniazÄ textul la dreapta.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'ListÄ cu puncte',
+        text: 'InsereazÄ listÄ cu puncte.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ListÄ numerotatÄ',
+        text: 'InsereazÄ o listÄ numerotatÄ.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'LegÄturÄ web',
+        text: 'TransformÄ textul selectat Ã®n legÄturÄ web.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Editare sursÄ',
+        text: 'SchimbÄ pe modul de editare al codului HTML.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Sortare ascendentÄ",
+      sortDescText : "Sortare descendentÄ",
+      lockText     : "BlocheazÄ coloana",
+      unlockText   : "DeblocheazÄ coloana",
+      columnsText  : "Coloane"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(FÄrÄ)',
+    groupByText    : 'GrupeazÄ dupÄ aceastÄ coloanÄ',
+    showGroupsText : 'AfiÈeazÄ grupat'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nume",
+    valueText  : "Valoare",
+    dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Trage pentru redimensionare.",
+      collapsibleSplitTip : "Trage pentru redimensionare. Dublu-click pentru ascundere."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ru.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ru.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ru.js	(revision 76)
@@ -0,0 +1,325 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/*
+ * Russian translation
+ * By ZooKeeper (utf-8 encoding)
+ * 6 November 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÐÐŽÐµÑ Ð·Ð°Ð³ÑÑÐ·ÐºÐ°...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} Ð²ÑÐ±ÑÐ°ÐœÐœÑÑ
+ ÑÑÑÐŸÐº";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "ÐÐ°ÐºÑÑÑÑ ÑÑÑ Ð²ÐºÐ»Ð°ÐŽÐºÑ";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "ÐÐœÐ°ÑÐµÐœÐžÐµ Ð² ÑÑÐŸÐŒ Ð¿ÐŸÐ»Ðµ ÐœÐµÐ²ÐµÑÐœÐŸÐµ";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "ÐÐ°Ð³ÑÑÐ·ÐºÐ°...";
+}
+
+Date.monthNames = [
+    "Ð¯ÐœÐ²Ð°ÑÑ",
+    "Ð€ÐµÐ²ÑÐ°Ð»Ñ",
+    "ÐÐ°ÑÑ",
+    "ÐÐ¿ÑÐµÐ»Ñ",
+    "ÐÐ°Ð¹",
+    "ÐÑÐœÑ",
+    "ÐÑÐ»Ñ",
+    "ÐÐ²Ð³ÑÑÑ",
+    "Ð¡ÐµÐœÑÑÐ±ÑÑ",
+    "ÐÐºÑÑÐ±ÑÑ",
+    "ÐÐŸÑÐ±ÑÑ",
+    "ÐÐµÐºÐ°Ð±ÑÑ"
+];
+
+Date.shortMonthNames = [
+  "Ð¯ÐœÐ²",
+  "Ð€ÐµÐ²Ñ",
+  "ÐÐ°ÑÑ",
+  "ÐÐ¿Ñ",
+  "ÐÐ°Ð¹",
+  "ÐÑÐœÑ",
+  "ÐÑÐ»Ñ",
+  "ÐÐ²Ð³",
+  "Ð¡ÐµÐœÑ",
+  "ÐÐºÑ",
+  "ÐÐŸÑÐ±",
+  "ÐÐµÐº"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.shortMonthNames[month];
+};
+
+Date.monthNumbers = {
+  'Ð¯ÐœÐ²': 0,
+  'Ð€ÐµÐ²': 1,
+  'ÐÐ°Ñ': 2,
+  'ÐÐ¿Ñ': 3,
+  'ÐÐ°Ð¹': 4,
+  'ÐÑÐœ': 5,
+  'ÐÑÐ»': 6,
+  'ÐÐ²Ð³': 7,
+  'Ð¡ÐµÐœ': 8,
+  'ÐÐºÑ': 9,
+  'ÐÐŸÑ': 10,
+  'ÐÐµÐº': 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "ÐÐŸÑÐºÑÐµÑÐµÐœÑÐµ",
+  "ÐÐŸÐœÐµÐŽÐµÐ»ÑÐœÐžÐº",
+  "ÐÑÐŸÑÐœÐžÐº",
+  "Ð¡ÑÐµÐŽÐ°",
+  "Ð§ÐµÑÐ²ÐµÑÐ³",
+  "ÐÑÑÐœÐžÑÐ°",
+  "Ð¡ÑÐ±Ð±ÐŸÑÐ°"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "ÐÑÐŒÐµÐœÐ°",
+    yes    : "ÐÐ°",
+    no     : "ÐÐµÑ"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d.m.Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText          : "Ð¡ÐµÐ³ÐŸÐŽÐœÑ",
+    minText            : "Ð­ÑÐ° ÐŽÐ°ÑÐ° ÑÐ°ÐœÑÑÐµ ÐŒÐžÐœÐžÐŒÐ°Ð»ÑÐœÐŸÐ¹ ÐŽÐ°ÑÑ",
+    maxText            : "Ð­ÑÐ° ÐŽÐ°ÑÐ° Ð¿ÐŸÐ·Ð¶Ðµ ÐŒÐ°ÐºÑÐžÐŒÐ°Ð»ÑÐœÐŸÐ¹ ÐŽÐ°ÑÑ",
+    disabledDaysText   : "",
+    disabledDatesText  : "",
+    monthNames         : Date.monthNames,
+    dayNames           : Date.dayNames,
+    nextText           : 'Ð¡Ð»ÐµÐŽÑÑÑÐžÐ¹ ÐŒÐµÑÑÑ (Control+ÐÐ¿ÑÐ°Ð²ÐŸ)',
+    prevText           : 'ÐÑÐµÐŽÑÐŽÑÑÐžÐ¹ ÐŒÐµÑÑÑ (Control+ÐÐ»ÐµÐ²ÐŸ)',
+    monthYearText      : 'ÐÑÐ±ÐŸÑ ÐŒÐµÑÑÑÐ° (Control+ÐÐ²ÐµÑÑ
+/ÐÐœÐžÐ· ÐŽÐ»Ñ Ð²ÑÐ±ÐŸÑÐ° Ð³ÐŸÐŽÐ°)',
+    todayTip           : "{0} (ÐÑÐŸÐ±ÐµÐ»)",
+    format             : "d.m.y",
+    okText             : "&#160;OK&#160;",
+    cancelText         : "ÐÑÐŒÐµÐœÐ°",
+    startDay           : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Ð¡ÑÑÐ°ÐœÐžÑÐ°",
+    afterPageText  : "ÐžÐ· {0}",
+    firstText      : "ÐÐµÑÐ²Ð°Ñ ÑÑÑÐ°ÐœÐžÑÐ°",
+    prevText       : "ÐÑÐµÐŽÑÐŽÑÑÐ°Ñ ÑÑÑÐ°ÐœÐžÑÐ°",
+    nextText       : "Ð¡Ð»ÐµÐŽÑÑÑÐ°Ñ ÑÑÑÐ°ÐœÐžÑÐ°",
+    lastText       : "ÐÐŸÑÐ»ÐµÐŽÐœÑÑ ÑÑÑÐ°ÐœÐžÑÐ°",
+    refreshText    : "ÐÐ±ÐœÐŸÐ²ÐžÑÑ",
+    displayMsg     : "ÐÑÐŸÐ±ÑÐ°Ð¶Ð°ÑÑÑÑ Ð·Ð°Ð¿ÐžÑÐž Ñ {0} Ð¿ÐŸ {1}, Ð²ÑÐµÐ³ÐŸ {2}",
+    emptyMsg       : 'ÐÐµÑ ÐŽÐ°ÐœÐœÑÑ
+ ÐŽÐ»Ñ ÐŸÑÐŸÐ±ÑÐ°Ð¶ÐµÐœÐžÑ'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "ÐÐžÐœÐžÐŒÐ°Ð»ÑÐœÐ°Ñ ÐŽÐ»ÐžÐœÐ° ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ {0}",
+    maxLengthText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÑÐœÐ°Ñ ÐŽÐ»ÐžÐœÐ° ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ {0}",
+    blankText     : "Ð­ÑÐŸ Ð¿ÐŸÐ»Ðµ ÐŸÐ±ÑÐ·Ð°ÑÐµÐ»ÑÐœÐŸ ÐŽÐ»Ñ Ð·Ð°Ð¿ÐŸÐ»ÐœÐµÐœÐžÑ",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "ÐÐœÐ°ÑÐµÐœÐžÐµ ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ ÐœÐµ ÐŒÐŸÐ¶ÐµÑ Ð±ÑÑÑ ÐŒÐµÐœÑÑÐµ {0}",
+    maxText : "ÐÐœÐ°ÑÐµÐœÐžÐµ ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ ÐœÐµ ÐŒÐŸÐ¶ÐµÑ Ð±ÑÑÑ Ð±ÐŸÐ»ÑÑÐµ {0}",
+    nanText : "{0} ÐœÐµ ÑÐ²Ð»ÑÐµÑÑÑ ÑÐžÑÐ»ÐŸÐŒ"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "ÐÐµ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ",
+    disabledDatesText : "ÐÐµ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ",
+    minText           : "ÐÐ°ÑÐ° Ð² ÑÑÐŸÐŒ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐ° Ð±ÑÑÑ Ð¿ÐŸÐ·ÐŽÐµ {0}",
+    maxText           : "ÐÐ°ÑÐ° Ð² ÑÑÐŸÐŒ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐ° Ð±ÑÑÑ ÑÐ°ÐœÑÑÐµ {0}",
+    invalidText       : "{0} ÐœÐµ ÑÐ²Ð»ÑÐµÑÑÑ Ð¿ÑÐ°Ð²ÐžÐ»ÑÐœÐŸÐ¹ ÐŽÐ°ÑÐŸÐ¹ - ÐŽÐ°ÑÐ° ÐŽÐŸÐ»Ð¶ÐœÐ° Ð±ÑÑÑ ÑÐºÐ°Ð·Ð°ÐœÐ° Ð² ÑÐŸÑÐŒÐ°ÑÐµ {1}",
+    format            : "d.m.y",
+    altFormats        : "d.m.y|d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay           : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "ÐÐ°Ð³ÑÑÐ·ÐºÐ°...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText     : 'Ð­ÑÐŸ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐŸ ÑÐŸÐŽÐµÑÐ¶Ð°ÑÑ Ð°ÐŽÑÐµÑ ÑÐ»ÐµÐºÑÑÐŸÐœÐœÐŸÐ¹ Ð¿ÐŸÑÑÑ Ð² ÑÐŸÑÐŒÐ°ÑÐµ "user@example.com"',
+    urlText       : 'Ð­ÑÐŸ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐŸ ÑÐŸÐŽÐµÑÐ¶Ð°ÑÑ URL Ð² ÑÐŸÑÐŒÐ°ÑÐµ "http:/'+'/www.example.com"',
+    alphaText     : 'Ð­ÑÐŸ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐŸ ÑÐŸÐŽÐµÑÐ¶Ð°ÑÑ ÑÐŸÐ»ÑÐºÐŸ Ð»Ð°ÑÐžÐœÑÐºÐžÐµ Ð±ÑÐºÐ²Ñ Ðž ÑÐžÐŒÐ²ÐŸÐ» Ð¿ÐŸÐŽÑÐµÑÐºÐžÐ²Ð°ÐœÐžÑ "_"',
+    alphanumText  : 'Ð­ÑÐŸ Ð¿ÐŸÐ»Ðµ ÐŽÐŸÐ»Ð¶ÐœÐŸ ÑÐŸÐŽÐµÑÐ¶Ð°ÑÑ ÑÐŸÐ»ÑÐºÐŸ Ð»Ð°ÑÐžÐœÑÐºÐžÐµ Ð±ÑÐºÐ²Ñ, ÑÐžÑÑÑ Ðž ÑÐžÐŒÐ²ÐŸÐ» Ð¿ÐŸÐŽÑÐµÑÐºÐžÐ²Ð°ÐœÐžÑ "_"'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ° Ð²Ð²ÐµÐŽÐžÑÐµ Ð°ÐŽÑÐµÑ:',
+    buttonTips : {
+      bold : {
+        title: 'ÐÐŸÐ»ÑÐ¶ÐžÑÐœÑÐ¹ (Ctrl+B)',
+        text: 'ÐÑÐžÐŒÐµÐœÐµÐœÐžÐµ Ð¿ÐŸÐ»ÑÐ¶ÐžÑÐœÐŸÐ³ÐŸ ÐœÐ°ÑÐµÑÑÐ°ÐœÐžÑ Ðº Ð²ÑÐŽÐµÐ»ÐµÐœÐœÐŸÐŒÑ ÑÐµÐºÑÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'ÐÑÑÑÐžÐ² (Ctrl+I)',
+        text: 'ÐÑÐžÐŒÐµÐœÐµÐœÐžÐµ ÐºÑÑÑÐžÐ²ÐœÐŸÐ³ÐŸ ÐœÐ°ÑÐµÑÑÐ°ÐœÐžÑ Ðº Ð²ÑÐŽÐµÐ»ÐµÐœÐœÐŸÐŒÑ ÑÐµÐºÑÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'ÐÐŸÐŽÑÑÑÐºÐœÑÑÑÐ¹ (Ctrl+U)',
+        text: 'ÐÐŸÐŽÑÑÑÐºÐžÐ²Ð°ÐœÐžÐµ Ð²ÑÐŽÐµÐ»ÐµÐœÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Ð£Ð²ÐµÐ»ÐžÑÐžÑÑ ÑÐ°Ð·ÐŒÐµÑ',
+        text: 'Ð£Ð²ÐµÐ»ÐžÑÐµÐœÐžÐµ ÑÐ°Ð·ÐŒÐµÑÐ° ÑÑÐžÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Ð£ÐŒÐµÐœÑÑÐžÑÑ ÑÐ°Ð·ÐŒÐµÑ',
+        text: 'Ð£ÐŒÐµÐœÑÑÐµÐœÐžÐµ ÑÐ°Ð·ÐŒÐµÑÐ° ÑÑÐžÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'ÐÐ°Ð»ÐžÐ²ÐºÐ°',
+        text: 'ÐÐ·ÐŒÐµÐœÐµÐœÐžÐµ ÑÐ²ÐµÑÐ° ÑÐŸÐœÐ° ÐŽÐ»Ñ Ð²ÑÐŽÐµÐ»ÐµÐœÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÐ° ÐžÐ»Ðž Ð°Ð±Ð·Ð°ÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'ÐŠÐ²ÐµÑ ÑÐµÐºÑÑÐ°',
+        text: 'ÐÐ·ÐŒÐµÐœÐžÐµ ÑÐ²ÐµÑÐ° ÑÐµÐºÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'ÐÑÑÐŸÐ²ÐœÑÑÑ ÑÐµÐºÑÑ Ð¿ÐŸ Ð»ÐµÐ²ÐŸÐŒÑ ÐºÑÐ°Ñ',
+        text: 'ÐÑÑÐŸÐ²ÐœÐžÐ²Ð°ÐœÐžÐµ ÑÐµÐºÑÑÐ° Ð¿ÐŸ Ð»ÐµÐ²ÐŸÐŒÑ ÐºÑÐ°Ñ.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'ÐÐŸ ÑÐµÐœÑÑÑ',
+        text: 'ÐÑÑÐŸÐ²ÐœÐžÐ²Ð°ÐœÐžÐµ ÑÐµÐºÑÑÐ° Ð¿ÐŸ ÑÐµÐœÑÑÑ.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'ÐÑÑÐŸÐ²ÐœÑÑÑ ÑÐµÐºÑÑ Ð¿ÐŸ Ð¿ÑÐ°Ð²ÐŸÐŒÑ ÐºÑÐ°Ñ',
+        text: 'ÐÑÑÐŸÐ²ÐœÐžÐ²Ð°ÐœÐžÐµ ÑÐµÐºÑÑÐ° Ð¿ÐŸ Ð¿ÑÐ°Ð²ÐŸÐŒÑ ÐºÑÐ°Ñ.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'ÐÐ°ÑÐºÐµÑÑ',
+        text: 'ÐÐ°ÑÐ°ÑÑ ÐŒÐ°ÑÐºÐžÑÐŸÐ²Ð°ÐœÐœÑÐ¹ ÑÐ¿ÐžÑÐŸÐº.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ÐÑÐŒÐµÑÐ°ÑÐžÑ',
+        text: 'ÐÐ°ÑÐ°ÑÑ ÐœÑÐŒÐµÑÐœÐŸÐ²Ð°ÐœÐœÑÐ¹ ÑÐ¿ÐžÑÐŸÐº.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'ÐÑÑÐ°Ð²ÐžÑÑ Ð³ÐžÐ¿ÐµÑÑÑÑÐ»ÐºÑ',
+        text: 'Ð¡ÐŸÐ·ÐŽÐ°ÐœÐžÐµ ÑÑÑÐ»ÐºÐž ÐžÐ· Ð²ÑÐŽÐµÐ»ÐµÐœÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÐ°.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ÐÑÑ
+ÐŸÐŽÐœÑÐ¹ ÐºÐŸÐŽ',
+        text: 'ÐÐµÑÐµÐºÐ»ÑÑÐžÑÑÑÑ ÐœÐ° ÐžÑÑ
+ÐŸÐŽÐœÑÐ¹ ÐºÐŸÐŽ.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.form.BasicForm){
+  Ext.form.BasicForm.prototype.waitTitle = "ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ° Ð¿ÐŸÐŽÐŸÐ¶ÐŽÐžÑÐµ...";
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Ð¡ÐŸÑÑÐžÑÐŸÐ²Ð°ÑÑ Ð¿ÐŸ Ð²ÐŸÐ·ÑÐ°ÑÑÐ°ÐœÐžÑ",
+    sortDescText : "Ð¡ÐŸÑÑÐžÑÐŸÐ²Ð°ÑÑ Ð¿ÐŸ ÑÐ±ÑÐ²Ð°ÐœÐžÑ",
+    lockText     : "ÐÐ°ÐºÑÐµÐ¿ÐžÑÑ ÑÑÐŸÐ»Ð±ÐµÑ",
+    unlockText   : "Ð¡ÐœÑÑÑ Ð·Ð°ÐºÑÐµÐ¿Ð»ÐµÐœÐžÐµ ÑÑÐŸÐ»Ð±ÑÐ°",
+    columnsText  : "Ð¡ÑÐŸÐ»Ð±ÑÑ"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(ÐÑÑÑÐŸ)',
+    groupByText    : 'ÐÑÑÐ¿Ð¿ÐžÑÐŸÐ²Ð°ÑÑ Ð¿ÐŸ ÑÑÐŸÐŒÑ Ð¿ÐŸÐ»Ñ',
+    showGroupsText : 'ÐÑÐŸÐ±ÑÐ°Ð¶Ð°ÑÑ Ð¿ÐŸ Ð³ÑÑÐ¿Ð¿Ð°ÐŒ'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "ÐÐ°Ð·Ð²Ð°ÐœÐžÐµ",
+    valueText  : "ÐÐœÐ°ÑÐµÐœÐžÐµ",
+    dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.SplitLayoutRegion){
+  Ext.apply(Ext.SplitLayoutRegion.prototype, {
+    splitTip            : "Ð¢ÑÐœÐžÑÐµ ÐŽÐ»Ñ ÐžÐ·ÐŒÐµÐœÐµÐœÐžÑ ÑÐ°Ð·ÐŒÐµÑÐ°.",
+    collapsibleSplitTip : "Ð¢ÑÐœÐžÑÐµ ÐŽÐ»Ñ ÐžÐ·ÐŒÐµÐœÐµÐœÐžÑ ÑÐ°Ð·ÐŒÐµÑÐ°. ÐÐ²ÐŸÐ¹ÐœÐŸÐ¹ ÑÐµÐ»ÑÐŸÐº ÑÐ¿ÑÑÑÐµÑ Ð¿Ð°ÐœÐµÐ»Ñ."
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Ð¢ÑÐœÐžÑÐµ ÐŽÐ»Ñ ÐžÐ·ÐŒÐµÐœÐµÐœÐžÑ ÑÐ°Ð·ÐŒÐµÑÐ°.",
+    collapsibleSplitTip : "Ð¢ÑÐœÐžÑÐµ ÐŽÐ»Ñ ÐžÐ·ÐŒÐµÐœÐµÐœÐžÑ ÑÐ°Ð·ÐŒÐµÑÐ°. ÐÐ²ÐŸÐ¹ÐœÐŸÐ¹ ÑÐµÐ»ÑÐŸÐº ÑÐ¿ÑÑÑÐµÑ Ð¿Ð°ÐœÐµÐ»Ñ."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-af.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-af.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-af.js	(revision 76)
@@ -0,0 +1,185 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * Afrikaans Translations
+ * by Thys Meintjes (20 July 2007)
+ */
+
+/* Ext Core translations */
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Besig om te laai...</div>';
+
+/* Ext single string translations */
+if(Ext.View){
+    Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+    Ext.grid.GridPanel.prototype.ddText = "{0} geselekteerde ry(e)";
+}
+
+if(Ext.TabPanelItem){
+    Ext.TabPanelItem.prototype.closeText = "Maak die oortjie toe";
+}
+
+if(Ext.form.Field){
+    Ext.form.Field.prototype.invalidText = "Die waarde in hierdie veld is foutief";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Besig om te laai...";
+}
+
+/* Javascript month and days translations */
+Date.monthNames = [
+   "Januarie",
+   "Februarie",
+   "Maart",
+   "April",
+   "Mei",
+   "Junie",
+   "Julie",
+   "Augustus",
+   "September",
+   "Oktober",
+   "November",
+   "Desember"
+];
+
+Date.dayNames = [
+   "Sondag",
+   "Maandag",
+   "Dinsdag",
+   "Woensdag",
+   "Donderdag",
+   "Vrydag",
+   "Saterdag"
+];
+
+/* Ext components translations */
+if(Ext.MessageBox){
+    Ext.MessageBox.buttonText = {
+       ok     : "OK",
+       cancel : "Kanselleer",
+       yes    : "Ja",
+       no     : "Nee"
+    };
+}
+
+if(Ext.util.Format){
+    Ext.util.Format.date = function(v, format){
+       if(!v) return "";
+       if(!(v instanceof Date)) v = new Date(Date.parse(v));
+       return v.dateFormat(format || "d-m-y");
+    };
+}
+
+if(Ext.DatePicker){
+    Ext.apply(Ext.DatePicker.prototype, {
+       todayText         : "Vandag",
+       minText           : "Hierdie datum is vroÃ«r as die minimum datum",
+       maxText           : "Hierdie dataum is later as die maximum datum",
+       disabledDaysText  : "",
+       disabledDatesText : "",
+       monthNames	 : Date.monthNames,
+       dayNames		 : Date.dayNames,
+       nextText          : 'Volgende Maand (Beheer+Regs)',
+       prevText          : 'Vorige Maand (Beheer+Links)',
+       monthYearText     : "Kies 'n maand (Beheer+Op/Af volgende/vorige jaar)",
+       todayTip          : "{0} (Spasie)",
+       format            : "d-m-y",
+       startDay          : 0
+    });
+}
+
+if(Ext.PagingToolbar){
+    Ext.apply(Ext.PagingToolbar.prototype, {
+       beforePageText : "Bladsy",
+       afterPageText  : "van {0}",
+       firstText      : "Eerste Bladsy",
+       prevText       : "Vorige Bladsy",
+       nextText       : "Volgende Bladsy",
+       lastText       : "Laatste Bladsy",
+       refreshText    : "Verfris",
+       displayMsg     : "Wys {0} - {1} van {2}",
+       emptyMsg       : 'Geen data om te wys nie'
+    });
+}
+
+if(Ext.form.TextField){
+    Ext.apply(Ext.form.TextField.prototype, {
+       minLengthText : "Die minimum lengte van die veld is {0}",
+       maxLengthText : "Die maximum lengte van die veld is {0}",
+       blankText     : "Die veld is verpligtend",
+       regexText     : "",
+       emptyText     : null
+    });
+}
+
+if(Ext.form.NumberField){
+    Ext.apply(Ext.form.NumberField.prototype, {
+       minText : "Die minimum waarde vir die veld is {0}",
+       maxText : "Die maximum waarde vir die veld is {0}",
+       nanText : "{0} is nie 'n geldige waarde nie"
+    });
+}
+
+if(Ext.form.DateField){
+    Ext.apply(Ext.form.DateField.prototype, {
+       disabledDaysText  : "Afgeskakel",
+       disabledDatesText : "Afgeskakel",
+       minText           : "Die datum in hierdie veld moet na {0} wees",
+       maxText           : "Die datum in hierdie veld moet voor {0} wees",
+       invalidText       : "{0} is nie 'n geldige datum nie - datumformaat is {1}",
+       format            : "d/m/y",
+       altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+       startDay          : 0
+    });
+}
+
+if(Ext.form.ComboBox){
+    Ext.apply(Ext.form.ComboBox.prototype, {
+       loadingText       : "Besig om te laai...",
+       valueNotFoundText : undefined
+    });
+}
+
+if(Ext.form.VTypes){
+    Ext.apply(Ext.form.VTypes, {
+       emailText    : "Hierdie veld moet 'n e-pos adres wees met die formaat 'gebruiker@domein.za'",
+       urlText      : "Hierdie veld moet 'n URL wees me die formaat 'http:/'+'/www.domein.za'",
+       alphaText    : 'Die veld mag alleenlik letters en _ bevat',
+       alphanumText : 'Die veld mag alleenlik letters, syfers en _ bevat'
+    });
+}
+
+if(Ext.grid.GridView){
+    Ext.apply(Ext.grid.GridView.prototype, {
+       sortAscText  : "Sorteer Oplopend",
+       sortDescText : "Sorteer Aflopend",
+       lockText     : "Vries Kolom",
+       unlockText   : "Ontvries Kolom",
+       columnsText  : "Kolomme"
+    });
+}
+
+if(Ext.grid.PropertyColumnModel){
+    Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+       nameText   : "Naam",
+       valueText  : "Waarde",
+       dateFormat : "Y-m-j"
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+    Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+       splitTip            : "Trek om grootte aan te pas.",
+       collapsibleSplitTip : "Trek om grootte aan te pas. Dubbel-klik om weg te steek."
+    });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_TW.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_TW.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_TW.js	(revision 76)
@@ -0,0 +1,201 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/*
+ * Traditional Chinese translation
+ * By hata1234
+ * 09 April 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">è®åäž­...</div>';
+
+if(Ext.View){
+    Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+    Ext.grid.GridPanel.prototype.ddText = "éžæäº {0} è¡";
+}
+
+if(Ext.TabPanelItem){
+    Ext.TabPanelItem.prototype.closeText = "ééæ­€æšç±€";
+}
+
+if(Ext.form.Field){
+    Ext.form.Field.prototype.invalidText = "æžåŒäžç¬Šåæ¬äœèŠå®";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "è®åäž­...";
+}
+
+Date.monthNames = [
+    "äžæ",
+    "äºæ",
+    "äžæ",
+    "åæ",
+    "äºæ",
+    "å
+­æ",
+    "äžæ",
+    "å
+«æ",
+    "ä¹æ",
+    "åæ",
+    "åäžæ",
+    "åäºæ"
+];
+
+Date.dayNames = [
+    "æ¥",
+    "äž",
+    "äº",
+    "äž",
+    "å",
+    "äº",
+    "å
+­"
+];
+
+if(Ext.MessageBox){
+    Ext.MessageBox.buttonText = {
+        ok : "ç¢ºå®",
+        cancel : "åæ¶",
+        yes : "æ¯",
+        no : "åŠ"
+    };
+}
+
+if(Ext.util.Format){
+    Ext.util.Format.date = function(v, format){
+       if(!v) return "";
+       if(!(v instanceof Date)) v = new Date(Date.parse(v));
+       return v.dateFormat(format || "Y/m/d");
+    };
+}
+
+if(Ext.DatePicker){
+    Ext.apply(Ext.DatePicker.prototype, {
+       todayText         : "ä»å€©",
+       minText           : "æ¥æå¿
+é å€§æŒæå°å®¹èš±æ¥æ",
+       maxText           : "æ¥æå¿
+é å°æŒæå€§å®¹èš±æ¥æ",
+       disabledDaysText  : "",
+       disabledDatesText : "",
+       monthNames        : Date.monthNames,
+       dayNames          : Date.dayNames,
+       nextText          : "äžåæ (Ctrl+å³æ¹åéµ)",
+       prevText          : "äžåæ (Ctrl+å·Šæ¹åéµ)",
+       monthYearText     : "éžææä»œ (Ctrl+äž/äžæ¹åéµéžæå¹Žä»œ)",
+       todayTip          : "{0} (ç©ºçœéµ)",
+       format            : "y/m/d",
+       okText            : "ç¡®å®",
+       cancelText        : "åæ¶"
+    });
+}
+
+if(Ext.PagingToolbar){
+    Ext.apply(Ext.PagingToolbar.prototype, {
+       beforePageText : "ç¬¬",
+       afterPageText  : "é ïŒå
+±{0}é ",
+       firstText      : "ç¬¬äžé ",
+       prevText       : "äžäžé ",
+       nextText       : "äžäžé ",
+       lastText       : "æåŸé ",
+       refreshText    : "éæ°æŽç",
+       displayMsg     : "é¡¯ç€º{0} - {1}ç­,å
+±{2}ç­",
+       emptyMsg       : 'æ²æä»»äœè³æ'
+    });
+}
+
+if(Ext.form.TextField){
+    Ext.apply(Ext.form.TextField.prototype, {
+       minLengthText : "æ­€æ¬äœæå°èŠèŒžå
+¥ {0} åå­",
+       maxLengthText : "æ­€æ¬äœæå€èŒžå
+¥ {0} åå­",
+       blankText     : "æ­€æ¬äœçºå¿
+å¡«",
+       regexText     : "",
+       emptyText     : null
+    });
+}
+
+if(Ext.form.NumberField){
+    Ext.apply(Ext.form.NumberField.prototype, {
+       minText : "æ­€æ¬äœä¹æžåŒå¿
+é å€§æŒ {0}",
+       maxText : "æ­€æ¬äœä¹æžåŒå¿
+é å°æŒ {0}",
+       nanText : "{0} äžæ¯åæ³çæžå­"
+    });
+}
+
+if(Ext.form.DateField){
+    Ext.apply(Ext.form.DateField.prototype, {
+       disabledDaysText  : "ç¡æ³äœ¿çš",
+       disabledDatesText : "ç¡æ³äœ¿çš",
+       minText           : "æ­€æ¬äœä¹æ¥æå¿
+é åš {0} ä¹åŸ",
+       maxText           : "æ­€æ¬äœä¹æ¥æå¿
+é åš {0} ä¹å",
+       invalidText       : "{0} äžæ¯æ­£ç¢ºçæ¥ææ ŒåŒ - å¿
+é åæ¯ ã {1} ã éæš£çæ ŒåŒ",
+       format            : "Y/m/d"
+    });
+}
+
+if(Ext.form.ComboBox){
+    Ext.apply(Ext.form.ComboBox.prototype, {
+       loadingText       : "è®åäž­ ...",
+       valueNotFoundText : undefined
+    });
+}
+
+if(Ext.form.VTypes){
+    Ext.apply(Ext.form.VTypes, {
+       emailText    : 'æ­€æ¬äœå¿
+é èŒžå
+¥å "user@example.com" ä¹E-Mailæ ŒåŒ',
+       urlText      : 'æ­€æ¬äœå¿
+é èŒžå
+¥å "http:/'+'/www.example.com" ä¹ç¶²åæ ŒåŒ',
+       alphaText    : 'æ­€æ¬äœå
+èœèŒžå
+¥ååœ¢è±æå­æ¯ååºç·( _ )ç¬Šè',
+       alphanumText : 'æ­€æ¬äœå
+èœèŒžå
+¥ååœ¢è±æå­æ¯ãæžå­ååºç·( _ )ç¬Šè'
+    });
+}
+
+if(Ext.grid.GridView){
+    Ext.apply(Ext.grid.GridView.prototype, {
+       sortAscText  : "æ­£åæåº",
+       sortDescText : "ååæåº",
+       lockText     : "éå®æ¬äœ",
+       unlockText   : "è§£éæ¬äœéå®",
+       columnsText  : "æ¬äœ"
+    });
+}
+
+if(Ext.grid.PropertyColumnModel){
+    Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+       nameText   : "åçš±",
+       valueText  : "æžåŒ",
+       dateFormat : "Y/m/d"
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+    Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+       splitTip            : "ææ³çž®æŸå€§å°.",
+       collapsibleSplitTip : "ææ³çž®æŸå€§å°. æ»éŒ éæé±è."
+    });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NB.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NB.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NB.js	(revision 76)
@@ -0,0 +1,295 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ *
+ * Norwegian translation (BokmÃ¥l: no-NB)
+ * By Tore KjÃžrsvik 21-January-2008
+ *  
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Laster...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} markert(e) rad(er)";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Lukk denne fanen";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "Verdien i dette feltet er ugyldig";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Laster...";
+}
+
+Date.monthNames = [
+  "Januar",
+  "Februar",
+  "Mars",
+  "April",
+  "Mai",
+  "Juni",
+  "Juli",
+  "August",
+  "September",
+  "Oktober",
+  "November",
+  "Desember"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  Mai : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Okt : 9,
+  Nov : 10,
+  Des : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "SÃžndag",
+  "Mandag",
+  "Tirsdag",
+  "Onsdag",
+  "Torsdag",
+  "Fredag",
+  "LÃžrdag"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Avbryt",
+    yes    : "Ja",
+    no     : "Nei"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d.m.Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "I dag",
+    minText           : "Denne datoen er fÃžr tidligste tillatte dato",
+    maxText           : "Denne datoen er etter seneste tillatte dato",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames	      : Date.monthNames,
+    dayNames		      : Date.dayNames,
+    nextText          : 'Neste mÃ¥ned (Control+Pil HÃžyre)',
+    prevText          : 'Forrige mÃ¥ned (Control+Pil Venstre)',
+    monthYearText     : 'Velg en mÃ¥ned (Control+Pil Opp/Ned for Ã¥ skifte Ã¥r)',
+    todayTip          : "{0} (Mellomrom)",
+    format            : "d.m.y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Avbryt",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Side",
+    afterPageText  : "av {0}",
+    firstText      : "FÃžrste side",
+    prevText       : "Forrige side",
+    nextText       : "Neste side",
+    lastText       : "Siste side",
+    refreshText    : "Oppdater",
+    displayMsg     : "Viser {0} - {1} av {2}",
+    emptyMsg       : 'Ingen data Ã¥ vise'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "Den minste lengden for dette feltet er {0}",
+    maxLengthText : "Den stÃžrste lengden for dette feltet er {0}",
+    blankText     : "Dette feltet er pÃ¥krevd",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "Den minste verdien for dette feltet er {0}",
+    maxText : "Den stÃžrste verdien for dette feltet er {0}",
+    nanText : "{0} er ikke et gyldig nummer"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Deaktivert",
+    disabledDatesText : "Deaktivert",
+    minText           : "Datoen i dette feltet mÃ¥ vÃŠre etter {0}",
+    maxText           : "Datoen i dette feltet mÃ¥ vÃŠre fÃžr {0}",
+    invalidText       : "{0} er ikke en gyldig dato - den mÃ¥ vÃŠre pÃ¥ formatet {1}",
+    format            : "d.m.y",
+    altFormats        : "d.m.Y|d/m/y|d/m/Y|d-m-y|d-m-Y|d.m|d/m|d-m|dm|dmy|dmY|Y-m-d|d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Laster...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Dette feltet skal vÃŠre en epost adresse pÃ¥ formatet "bruker@domene.no"',
+      urlText      : 'Dette feltet skal vÃŠre en link (URL) pÃ¥ formatet "http:/'+'/www.domene.no"',
+      alphaText    : 'Dette feltet skal kun inneholde bokstaver og _',
+      alphanumText : 'Dette feltet skal kun inneholde bokstaver, tall og _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Vennligst skriv inn URL for lenken:',
+    buttonTips : {
+      bold : {
+        title: 'Fet (Ctrl+B)',
+        text: 'GjÃžr den valgte teksten fet.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursiv (Ctrl+I)',
+        text: 'GjÃžr den valgte teksten kursiv.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Understrek (Ctrl+U)',
+        text: 'Understrek den valgte teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ForstÃžrr tekst',
+        text: 'GjÃžr fontstÃžrrelse stÃžrre.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Forminsk tekst',
+        text: 'GjÃžr fontstÃžrrelse mindre.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Tekst markeringsfarge',
+        text: 'Endre bakgrunnsfarge til den valgte teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Font farge',
+        text: 'Endre farge pÃ¥ den valgte teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Venstrejuster tekst',
+        text: 'Venstrejuster teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Sentrer tekst',
+        text: 'Sentrer teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'HÃžyrejuster tekst',
+        text: 'HÃžyrejuster teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Punktliste',
+        text: 'Start en punktliste.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Nummerert liste',
+        text: 'Start en nummerert liste.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Lenke',
+        text: 'GjÃžr den valgte teksten til en lenke.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Rediger kilde',
+        text: 'Bytt til kilderedigeringsvisning.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Sorter stigende",
+    sortDescText : "Sorter synkende",
+    lockText     : "LÃ¥s kolonne",
+    unlockText   : "LÃ¥s opp kolonne",
+    columnsText  : "Kolonner"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Ingen)',
+    groupByText    : 'Grupper etter dette feltet',
+    showGroupsText : 'Vis i grupper'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Navn",
+    valueText  : "Verdi",
+    dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Dra for Ã¥ endre stÃžrrelse.",
+    collapsibleSplitTip : "Dra for Ã¥ endre stÃžrrelse. Dobbelklikk for Ã¥ skjule."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-id.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-id.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-id.js	(revision 76)
@@ -0,0 +1,303 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Pedoman translasi:
+ * http://id.wikisource.org/wiki/Panduan_Pembakuan_Istilah,_Pelaksanaan_Instruksi_Presiden_Nomor_2_Tahun_2001_Tentang_Penggunaan_Komputer_Dengan_Aplikasi_Komputer_Berbahasa_Indonesia
+ * Original source: http://vlsm.org/etc/baku-0.txt
+ * by Farid GS
+ * farid [at] pulen.net
+ * 10:13 04 Desember 2007
+ * Indonesian Translations
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Pemuatan...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} selected row(s)";
+  Ext.grid.GridPanel.prototype.ddText = "{0} baris terpilih";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Close this tab";
+  Ext.TabPanelItem.prototype.closeText = "Tutup tab ini";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "The value in this field is invalid";
+  Ext.form.Field.prototype.invalidText = "Isian belum benar";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Loading...";
+  Ext.LoadMask.prototype.msg = "Pemuatan...";
+}
+
+Date.monthNames = [
+  "Januari",
+  "Februari",
+  "Maret",
+  "April",
+  "Mei",
+  "Juni",
+  "Juli",
+  "Agustus",
+  "September",
+  "Oktober",
+  "November",
+  "Desember"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  Mei : 4,
+  Jun : 5,
+  Jul : 6,
+  Agu : 7,
+  Sep : 8,
+  Okt : 9,
+  Nov : 10,
+  Des : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Minggu",
+  "Senin",
+  "Selasa",
+  "Rabu",
+  "Kamis",
+  "Jumat",
+  "Sabtu"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Batal",
+    yes    : "Ya",
+    no     : "Tidak"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Hari ini",
+    minText           : "Tanggal ini sebelum batas tanggal minimal", 
+    maxText           : "Tanggal ini setelah batas tanggal maksimal", 
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Bulan Berikut (Kontrol+Kanan)', 
+    prevText          : 'Bulan Sebelum (Kontrol+Kiri)', 
+    monthYearText     : 'Pilih bulan (Kontrol+Atas/Bawah untuk pindah tahun)', 
+    todayTip          : "{0} (Spacebar)",
+    format            : "d/m/y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Batal",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Hal",
+    afterPageText  : "dari {0}",
+    firstText      : "Hal. Pertama",
+    prevText       : "Hal. Sebelum",
+    nextText       : "Hal. Berikut",
+    lastText       : "Hal. Akhir",
+    refreshText    : "Segarkan", 
+    displayMsg     : "Menampilkan {0} - {1} dari {2}",
+    emptyMsg       : 'Data tidak ditemukan' 
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "Panjang minimal untuk field ini adalah {0}",  
+    maxLengthText : "Panjang maksimal untuk field ini adalah {0}", 
+    blankText     : "Field ini wajib diisi", 
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "Nilai minimal untuk field ini adalah {0}",  
+    maxText : "Nilai maksimal untuk field ini adalah {0}",  
+    nanText : "{0} bukan angka" 
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Disfungsi",  
+    disabledDatesText : "Disfungsi",  
+    minText           : "Tanggal dalam field ini harus setelah {0}", 
+    maxText           : "Tanggal dalam field ini harus sebelum {0}", 
+    invalidText       : "{0} tanggal salah - Harus dalam format {1}", 
+    format            : "d/m/y", 
+    //altFormats        : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d"
+    altFormats        : "d/m/Y|d-m-y|d-m-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Pemuatan...",  
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Field ini harus dalam format email seperti "user@example.com"', 
+    urlText      : 'Field ini harus dalam format URL seperti "http:/'+'/www.example.com"', 
+    alphaText    : 'Field ini harus terdiri dari huruf dan _', 
+    alphanumText : 'Field ini haris terdiri dari huruf, angka dan _'  
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Silakan masukkan URL untuk tautan:', 
+    buttonTips : {
+      bold : {
+        title: 'Tebal (Ctrl+B)', 
+        text: 'Buat tebal teks terpilih', 
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Miring (CTRL+I)', 
+        text: 'Buat miring teks terpilih', 
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Garisbawah (CTRl+U)', 
+        text: 'Garisbawahi teks terpilih', 
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Perbesar teks', 
+        text: 'Perbesar ukuran fonta', 
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Perkecil teks',  
+        text: 'Perkecil ukuran fonta', 
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Sorot Warna Teks',  
+        text: 'Ubah warna latar teks terpilih', 
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Warna Fonta', 
+        text: 'Ubah warna teks terpilih',  
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Rata Kiri', 
+        text: 'Ratakan teks ke kiri', 
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Rata Tengah', 
+        text: 'Ratakan teks ke tengah editor', 
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Rata Kanan', 
+        text: 'Ratakan teks ke kanan', 
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Daftar Bulet', 
+        text: 'Membuat daftar berbasis bulet', 
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Daftar Angka', 
+        text: 'Membuat daftar berbasis angka', 
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hipertaut', 
+        text: 'Buat teks terpilih sebagai Hipertaut', 
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Edit Kode Sumber', 
+        text: 'Pindah dalam mode kode sumber', 
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Urut Naik", 
+    sortDescText : "Urut Turun", 
+    lockText     : "Kancing Kolom", 
+    unlockText   : "Lepas Kunci Kolom", 
+    columnsText  : "Kolom"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Kosong)', 
+    groupByText    : 'Kelompokkan Berdasar Field Ini', 
+    showGroupsText : 'Tampil Dalam Kelompok' 
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nama", 
+    valueText  : "Nilai", 
+    dateFormat : "d/m/Y" 
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Seret untuk ubah ukuran.", 
+    collapsibleSplitTip : "Seret untuk ubah ukuran, Dobel klik untuk sembunyikan." 
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_CN.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_CN.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-zh_CN.js	(revision 76)
@@ -0,0 +1,299 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Simplified Chinese translation
+ * By DavidHu
+ * 09 April 2007
+ * 
+ * update by andy_ghg
+ * 2009-10-22 15:00:57
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">å èœœäž­...</div>';
+
+if(Ext.DataView){
+   Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "éæ©äº {0} è¡";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "å
+³é­æ­€æ ç­Ÿ";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "èŸå
+¥åŒéæ³";
+}
+
+if (Ext.LoadMask) {
+    Ext.LoadMask.prototype.msg = "è¯»åäž­...";
+}
+
+Date.monthNames = [
+   "äžæ",
+   "äºæ",
+   "äžæ",
+   "åæ",
+   "äºæ",
+   "å
+­æ",
+   "äžæ",
+   "å
+«æ",
+   "ä¹æ",
+   "åæ",
+   "åäžæ",
+   "åäºæ"
+];
+
+Date.dayNames = [
+   "æ¥",
+   "äž",
+   "äº",
+   "äž",
+   "å",
+   "äº",
+   "å
+­"
+];
+
+Date.formatCodes.a = "(this.getHours() < 12 ? 'äžå' : 'äžå')";
+Date.formatCodes.A = "(this.getHours() < 12 ? 'äžå' : 'äžå')";
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "ç¡®å®",
+      cancel : "åæ¶",
+      yes    : "æ¯",
+      no     : "åŠ"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "yå¹Žmædæ¥");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "ä»å€©",
+      minText           : "æ¥æå¿
+é¡»å€§äºæå°å
+è®žæ¥æ",//update
+      maxText           : "æ¥æå¿
+é¡»å°äºæå€§å
+è®žæ¥æ",//update
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'äžäžªæ (Ctrl+Right)',
+      prevText          : 'äžäžªæ (Ctrl+Left)',
+      monthYearText     : 'éæ©äžäžªæ (Control+Up/Down æ¥æ¹åå¹Žä»œ)',//update
+      todayTip          : "{0} (ç©ºæ Œé®éæ©)",
+      format            : "yå¹Žmædæ¥",
+      okText            : "ç¡®å®",
+      cancelText        : "åæ¶"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "ç¬¬",//update
+      afterPageText  : "é¡µ,å
+± {0} é¡µ",//update
+      firstText      : "ç¬¬äžé¡µ",
+      prevText       : "äžäžé¡µ",//update
+      nextText       : "äžäžé¡µ",
+      lastText       : "æåé¡µ",
+      refreshText    : "å·æ°",
+      displayMsg     : "æŸç€º {0} - {1}æ¡ïŒå
+± {2} æ¡",//update
+      emptyMsg       : 'æ²¡ææ°æ®'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "è¯¥èŸå
+¥é¡¹çæå°é¿åºŠæ¯ {0} äžªå­ç¬Š",
+      maxLengthText : "è¯¥èŸå
+¥é¡¹çæå€§é¿åºŠæ¯ {0} äžªå­ç¬Š",
+      blankText     : "è¯¥èŸå
+¥é¡¹äžºå¿
+èŸé¡¹",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "è¯¥èŸå
+¥é¡¹çæå°åŒæ¯ {0}",
+      maxText : "è¯¥èŸå
+¥é¡¹çæå€§åŒæ¯ {0}",
+      nanText : "{0} äžæ¯æææ°åŒ"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "çŠçš",
+      disabledDatesText : "çŠçš",
+      minText           : "è¯¥èŸå
+¥é¡¹çæ¥æå¿
+é¡»åš {0} ä¹å",
+      maxText           : "è¯¥èŸå
+¥é¡¹çæ¥æå¿
+é¡»åš {0} ä¹å",
+      invalidText       : "{0} æ¯æ æçæ¥æ - å¿
+é¡»ç¬Šåæ ŒåŒïŒ {1}",
+      format            : "yå¹Žmædæ¥"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "å èœœäž­...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'è¯¥èŸå
+¥é¡¹å¿
+é¡»æ¯çµå­é®ä»¶å°åïŒæ ŒåŒåŠïŒ "user@example.com"',
+      urlText      : 'è¯¥èŸå
+¥é¡¹å¿
+é¡»æ¯URLå°åïŒæ ŒåŒåŠïŒ "http:/'+'/www.example.com"',
+      alphaText    : 'è¯¥èŸå
+¥é¡¹åªèœå
+å«åè§å­æ¯å_',//update
+      alphanumText : 'è¯¥èŸå
+¥é¡¹åªèœå
+å«åè§å­æ¯,æ°å­å_'//update
+   });
+}
+//add HTMLEditor's tips by andy_ghg
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'æ·»å è¶
+çº§éŸæ¥:',
+    buttonTips : {
+      bold : {
+        title: 'ç²äœ (Ctrl+B)',
+        text: 'å°éäž­çæå­è®Ÿçœ®äžºç²äœ',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'æäœ (Ctrl+I)',
+        text: 'å°éäž­çæå­è®Ÿçœ®äžºæäœ',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'äžåçº¿ (Ctrl+U)',
+        text: 'ç»æéæå­å äžåçº¿',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'å¢å€§å­äœ',
+        text: 'å¢å€§å­å·',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'çŒ©å°å­äœ',
+        text: 'åå°å­å·',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'ä»¥äžåé¢è²çªåºæŸç€ºææ¬',
+        text: 'äœ¿æå­çäžå»åæ¯çšè§å
+ç¬åäºæ è®°äžæ ·',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'å­äœé¢è²',
+        text: 'æŽæ¹å­äœé¢è²',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'å·Šå¯¹éœ',
+        text: 'å°æå­å·Šå¯¹éœ',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'å±
+äž­',
+        text: 'å°æå­å±
+äž­å¯¹éœ',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'å³å¯¹éœ',
+        text: 'å°æå­å³å¯¹éœ',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'é¡¹ç®ç¬Šå·',
+        text: 'åŒå§åå»ºé¡¹ç®ç¬Šå·åè¡š',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'çŒå·',
+        text: 'åŒå§åå»ºçŒå·åè¡š',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'èœ¬æè¶
+çº§éŸæ¥',
+        text: 'å°æéææ¬èœ¬æ¢æè¶
+çº§éŸæ¥',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ä»£ç è§åŸ',
+        text: 'ä»¥ä»£ç çåœ¢åŒå±ç°ææ¬',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "æ­£åº",//update
+      sortDescText : "ååº",//update
+      lockText     : "éå®å",//update
+      unlockText   : "è§£é€éå®",//update
+      columnsText  : "å"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "åç§°",
+      valueText  : "åŒ",
+      dateFormat : "yå¹Žmædæ¥"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "æåšæ¥æ¹åå°ºå¯ž.",
+      collapsibleSplitTip : "æåšæ¥æ¹åå°ºå¯ž. åå»éè."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ukr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ukr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ukr.js	(revision 76)
@@ -0,0 +1,267 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Ukrainian translations for ExtJS (UTF-8 encoding)
+ *
+ * Original translation by zlatko
+ * 3 October 2007
+ *
+ * Updated by dev.ashevchuk@gmail.com
+ * 01.09.2009
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÐÐ°Ð²Ð°ÐœÑÐ°Ð¶ÐµÐœÐœÑ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "<ÐÐŸÑÐŸÐ¶ÐœÑÐŸ>";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ÐŸÐ±ÑÐ°ÐœÐžÑ
+ ÑÑÐŽÐºÑÐ²";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÐÐ°ÐºÑÐžÑÐž ÑÑ Ð²ÐºÐ»Ð°ÐŽÐºÑ";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Ð¥ÐžÐ±ÐœÐµ Ð·ÐœÐ°ÑÐµÐœÐœÑ";
+}
+
+if(Ext.LoadMask){
+   Ext.LoadMask.prototype.msg = "ÐÐ°Ð²Ð°ÐœÑÐ°Ð¶ÐµÐœÐœÑ...";
+}
+
+Date.monthNames = [
+   "Ð¡ÑÑÐµÐœÑ",
+   "ÐÑÑÐžÐ¹",
+   "ÐÐµÑÐµÐ·ÐµÐœÑ",
+   "ÐÐ²ÑÑÐµÐœÑ",
+   "Ð¢ÑÐ°Ð²ÐµÐœÑ",
+   "Ð§ÐµÑÐ²ÐµÐœÑ",
+   "ÐÐžÐ¿ÐµÐœÑ",
+   "Ð¡ÐµÑÐ¿ÐµÐœÑ",
+   "ÐÐµÑÐµÑÐµÐœÑ",
+   "ÐÐŸÐ²ÑÐµÐœÑ",
+   "ÐÐžÑÑÐŸÐ¿Ð°ÐŽ",
+   "ÐÑÑÐŽÐµÐœÑ"
+];
+
+Date.dayNames = [
+   "ÐÐµÐŽÑÐ»Ñ",
+   "ÐÐŸÐœÐµÐŽÑÐ»ÐŸÐº",
+   "ÐÑÐ²ÑÐŸÑÐŸÐº",
+   "Ð¡ÐµÑÐµÐŽÐ°",
+   "Ð§ÐµÑÐ²ÐµÑ",
+   "ÐâÑÑÐœÐžÑÑ",
+   "Ð¡ÑÐ±ÐŸÑÐ°"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "ÐÑÐŽÐŒÑÐœÐ°",
+      yes    : "Ð¢Ð°Ðº",
+      no     : "ÐÑ"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Ð¡ÑÐŸÐ³ÐŸÐŽÐœÑ",
+      minText           : "ÐŠÑ ÐŽÐ°ÑÐ° ÐŒÐµÐœÑÑÐ° Ð·Ð° ÐŒÑÐœÑÐŒÐ°Ð»ÑÐœÑ ÐŽÐŸÐ¿ÑÑÑÐžÐŒÑ ÐŽÐ°ÑÑ",
+      maxText           : "ÐŠÑ ÐŽÐ°ÑÐ° Ð±ÑÐ»ÑÑÐ° Ð·Ð° ÐŒÐ°ÐºÑÐžÐŒÐ°Ð»ÑÐœÑ ÐŽÐŸÐ¿ÑÑÑÐžÐŒÑ ÐŽÐ°ÑÑ",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'ÐÐ°ÑÑÑÐ¿ÐœÐžÐ¹ ÐŒÑÑÑÑÑ (Control+ÐÐ¿ÑÐ°Ð²ÐŸ)',
+      prevText          : 'ÐÐŸÐ¿ÐµÑÐµÐŽÐœÑÐ¹ ÐŒÑÑÑÑÑ (Control+ÐÐ»ÑÐ²ÐŸ)',
+      monthYearText     : 'ÐÐžÐ±ÑÑ ÐŒÑÑÑÑÑ (Control+ÐÐ²ÐµÑÑ
+/ÐÐœÐžÐ· ÐŽÐ»Ñ Ð²ÐžÐ±ÐŸÑÑ ÑÐŸÐºÑ)',
+      todayTip          : "{0} (ÐÑÐŸÐ±ÑÐ»)",
+      format            : "d.m.y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "ÐÑÐŽÐŒÑÐœÐ°",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Ð¡ÑÐŸÑÑÐœÐºÐ°",
+      afterPageText  : "Ð· {0}",
+      firstText      : "ÐÐµÑÑÐ° ÑÑÐŸÑÑÐœÐºÐ°",
+      prevText       : "ÐÐŸÐ¿ÐµÑÐµÐŽÐœÑ ÑÑÐŸÑÑÐœÐºÐ°",
+      nextText       : "ÐÐ°ÑÑÑÐ¿ÐœÐ° ÑÑÐŸÑÑÐœÐºÐ°",
+      lastText       : "ÐÑÑÐ°ÐœÐœÑ ÑÑÐŸÑÑÐœÐºÐ°",
+      refreshText    : "ÐÑÐ²ÑÐ¶ÐžÑÐž",
+      displayMsg     : "ÐÑÐŽÐŸÐ±ÑÐ°Ð¶ÐµÐœÐœÑ Ð·Ð°Ð¿ÐžÑÑÐ² Ð· {0} Ð¿ÐŸ {1}, Ð²ÑÑÐŸÐ³ÐŸ {2}",
+      emptyMsg       : 'ÐÐ°ÐœÑ ÐŽÐ»Ñ Ð²ÑÐŽÐŸÐ±ÑÐ°Ð¶ÐµÐœÐœÑ Ð²ÑÐŽÑÑÑÐœÑ'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "ÐÑÐœÑÐŒÐ°Ð»ÑÐœÐ° ÐŽÐŸÐ²Ð¶ÐžÐœÐ° ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ {0}",
+      maxLengthText : "ÐÐ°ÐºÑÐžÐŒÐ°Ð»ÑÐœÐ° ÐŽÐŸÐ²Ð¶ÐžÐœÐ° ÑÑÐŸÐ³ÐŸ Ð¿ÐŸÐ»Ñ {0}",
+      blankText     : "ÐŠÐµ Ð¿ÐŸÐ»Ðµ Ñ ÐŸÐ±ÐŸÐ²âÑÐ·ÐºÐŸÐ²ÐžÐŒ ÐŽÐ»Ñ Ð·Ð°Ð¿ÐŸÐ²ÐœÐµÐœÐœÑ",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "ÐÐœÐ°ÑÐµÐœÐœÑ Ñ ÑÑÐŸÐŒÑ Ð¿ÐŸÐ»Ñ ÐœÐµ ÐŒÐŸÐ¶Ðµ Ð±ÑÑÐž ÐŒÐµÐœÑÑÐµ {0}",
+      maxText : "ÐÐœÐ°ÑÐµÐœÐœÑ Ñ ÑÑÐŸÐŒÑ Ð¿ÐŸÐ»Ñ ÐœÐµ ÐŒÐŸÐ¶Ðµ Ð±ÑÑÐž Ð±ÑÐ»ÑÑÐµ {0}",
+      nanText : "{0} ÐœÐµ Ñ ÑÐžÑÐ»ÐŸÐŒ"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ÐÐµ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ",
+      disabledDatesText : "ÐÐµ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ",
+      minText           : "ÐÐ°ÑÐ° Ñ ÑÑÐŸÐŒÑ Ð¿ÐŸÐ»Ñ Ð¿ÐŸÐ²ÐžÐœÐœÐ° Ð±ÑÑÐž Ð±ÑÐ»ÑÑÐ° {0}",
+      maxText           : "ÐÐ°ÑÐ° Ñ ÑÑÐŸÐŒÑ Ð¿ÐŸÐ»Ñ Ð¿ÐŸÐ²ÐžÐœÐœÐ° Ð±ÑÑÐž ÐŒÐµÐœÑÑÐ° {0}",
+      invalidText       : "{0} Ñ
+ÐžÐ±ÐœÐ° ÐŽÐ°ÑÐ° - ÐŽÐ°ÑÐ° Ð¿ÐŸÐ²ÐžÐœÐœÐ° Ð±ÑÑÐž Ð²ÐºÐ°Ð·Ð°ÐœÐ° Ñ ÑÐŸÑÐŒÐ°ÑÑ {1}",
+      format            : "d.m.y",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ÐÐ°Ð²Ð°ÐœÑÐ°Ð¶ÐµÐœÐœÑ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'ÐŠÐµ Ð¿ÐŸÐ»Ðµ Ð¿ÐŸÐ²ÐžÐœÐœÐŸ ÐŒÑÑÑÐžÑÐž Ð°ÐŽÑÐµÑÑ ÐµÐ»ÐµÐºÑÑÐŸÐœÐœÐŸÑ Ð¿ÐŸÑÑÐž Ñ ÑÐŸÑÐŒÐ°ÑÑ "user@example.com"',
+      urlText      : 'ÐŠÐµ Ð¿ÐŸÐ»Ðµ Ð¿ÐŸÐ²ÐžÐœÐœÐŸ ÐŒÑÑÑÐžÑÐž URL Ñ ÑÐŸÑÐŒÐ°ÑÑ "http:/'+'/www.example.com"',
+      alphaText    : 'ÐŠÐµ Ð¿ÐŸÐ»Ðµ Ð¿ÐŸÐ²ÐžÐœÐœÐŸ ÐŒÑÑÑÐžÑÐž Ð²ÐžÐºÐ»ÑÑÐœÐŸ Ð»Ð°ÑÐžÐœÑÑÐºÑ Ð»ÑÑÐµÑÐž ÑÐ° ÑÐžÐŒÐ²ÐŸÐ» Ð¿ÑÐŽÐºÑÐµÑÐ»ÐµÐœÐœÑ "_"',
+      alphanumText : 'ÐŠÐµ Ð¿ÐŸÐ»Ðµ Ð¿ÐŸÐ²ÐžÐœÐœÐŸ ÐŒÑÑÑÐžÑÐž Ð²ÐžÐºÐ»ÑÑÐœÐŸ Ð»Ð°ÑÐžÐœÑÑÐºÑ Ð»ÑÑÐµÑÐž, ÑÐžÑÑÐž ÑÐ° ÑÐžÐŒÐ²ÐŸÐ» Ð¿ÑÐŽÐºÑÐµÑÐ»ÐµÐœÐœÑ "_"'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+     createLinkText : 'ÐÑÐŽÑ-Ð»Ð°ÑÐºÐ° Ð²Ð²ÐµÐŽÑÑÑ Ð°ÐŽÑÐµÑÑ:',
+     buttonTips : {
+            bold : {
+               title: 'ÐÐ°Ð¿ÑÐ²Ð¶ÐžÑÐœÐžÐ¹ (Ctrl+B)',
+               text: 'ÐÑÐŸÐ±ÐžÑÐž ÐœÐ°Ð¿ÑÐ²Ð¶ÐžÑÐœÐžÐŒ Ð²ÐžÐŽÑÐ»ÐµÐœÐžÐ¹ ÑÐµÐºÑÑ.',
+               cls: 'x-html-editor-tip'
+            },
+            italic : {
+               title: 'ÐÑÑÑÐžÐ² (Ctrl+I)',
+               text: 'ÐÑÐŸÐ±ÐžÑÐž ÐºÑÑÑÐžÐ²ÐŸÐŒ Ð²ÐžÐŽÑÐ»ÐµÐœÐžÐ¹ ÑÐµÐºÑÑ.',
+               cls: 'x-html-editor-tip'
+            },
+            underline : {
+               title: 'ÐÑÐŽÐºÑÐµÑÐ»ÐµÐœÐžÐ¹ (Ctrl+U)',
+               text: 'ÐÑÐŸÐ±ÐžÑÐž Ð¿ÑÐŽÐºÑÐµÑÐ»ÐµÐœÐžÐŒ Ð²ÐžÐŽÑÐ»ÐµÐœÐžÐ¹ ÑÐµÐºÑÑ.',
+               cls: 'x-html-editor-tip'
+           },
+           increasefontsize : {
+               title: 'ÐÐ±ÑÐ»ÑÑÐžÑÐž ÑÐŸÐ·ÐŒÑÑ',
+               text: 'ÐÐ±ÑÐ»ÑÑÐžÑÐž ÑÐŸÐ·ÐŒÑÑ ÑÑÐžÑÑÐ°.',
+               cls: 'x-html-editor-tip'
+           },
+           decreasefontsize : {
+               title: 'ÐÐŒÐµÐœÑÑÐžÑÐž ÑÐŸÐ·ÐŒÑÑ',
+               text: 'ÐÐŒÐµÐœÑÑÐžÑÐž ÑÐŸÐ·ÐŒÑÑ ÑÑÐžÑÑÐ°.',
+               cls: 'x-html-editor-tip'
+           },
+           backcolor : {
+               title: 'ÐÐ°Ð»ÐžÐ²ÐºÐ°',
+               text: 'ÐÐŒÑÐœÐžÑÐž ÐºÐŸÐ»ÑÑ ÑÐŸÐœÑ ÐŽÐ»Ñ Ð²ÐžÐŽÑÐ»ÐµÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÑ Ð°Ð±ÐŸ Ð°Ð±Ð·Ð°ÑÑ.',
+               cls: 'x-html-editor-tip'
+           },
+           forecolor : {
+               title: 'ÐÐŸÐ»ÑÑ ÑÐµÐºÑÑÑ',
+               text: 'ÐÐŒÑÐœÐžÑÐž ÐºÐŸÐ»ÑÑ Ð²ÐžÐŽÑÐ»ÐµÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÑ Ð°Ð±ÐŸ Ð°Ð±Ð·Ð°ÑÑ.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyleft : {
+               title: 'ÐÐžÑÑÐ²ÐœÑÑÐž ÑÐµÐºÑÑ Ð¿ÐŸ Ð»ÑÐ²ÐŸÐŒÑ Ð¿ÐŸÐ»Ñ',
+               text: 'ÐÐžÑÑÐ²ÐœÑÐ²Ð°ÐœÐœÑ ÑÐµÐºÑÑÑ Ð¿ÐŸ Ð»ÑÐ²ÐŸÐŒÑ Ð¿ÐŸÐ»Ñ.',
+               cls: 'x-html-editor-tip'
+           },
+           justifycenter : {
+               title: 'ÐÐžÑÑÐ²ÐœÑÑÐž ÑÐµÐºÑÑ Ð¿ÐŸ ÑÐµÐœÑÑÑ',
+               text: 'ÐÐžÑÑÐ²ÐœÑÐ²Ð°ÐœÐœÑ ÑÐµÐºÑÑÑ Ð¿ÐŸ ÑÐµÐœÑÑÑ.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyright : {
+               title: 'ÐÐžÑÑÐ²ÐœÑÑÐž ÑÐµÐºÑÑ Ð¿ÐŸ Ð¿ÑÐ°Ð²ÐŸÐŒÑ Ð¿ÐŸÐ»Ñ',
+               text: 'ÐÐžÑÑÐ²ÐœÑÐ²Ð°ÐœÐœÑ ÑÐµÐºÑÑÑ Ð¿ÐŸ Ð¿ÑÐ°Ð²ÐŸÐŒÑ Ð¿ÐŸÐ»Ñ.',
+               cls: 'x-html-editor-tip'
+           },
+           insertunorderedlist : {
+               title: 'ÐÐ°ÑÐºÐµÑÐž',
+               text: 'ÐÐŸÑÐ°ÑÐž ÐŒÐ°ÑÐºÐŸÐ²Ð°ÐœÐžÐ¹ ÑÐ¿ÐžÑÐŸÐº.',
+               cls: 'x-html-editor-tip'
+           },
+           insertorderedlist : {
+               title: 'ÐÑÐŒÐµÑÐ°ÑÑÑ',
+               text: 'ÐÐŸÑÐ°ÑÐž ÐœÑÐŒÐµÑÐœÐŸÐ²Ð°ÐœÐžÐ¹ ÑÐ¿ÐžÑÐŸÐº.',
+               cls: 'x-html-editor-tip'
+           },
+           createlink : {
+               title: 'ÐÑÑÐ°Ð²ÐžÑÐž Ð³ÑÐ¿ÐµÑÐ¿ÐŸÑÐžÐ»Ð°ÐœÐœÑ',
+               text: 'Ð¡ÑÐ²ÐŸÑÐµÐœÐœÑ Ð¿ÐŸÑÐžÐ»Ð°ÐœÐœÑ ÑÐ· Ð²ÐžÐŽÑÐ»ÐµÐœÐŸÐ³ÐŸ ÑÐµÐºÑÑÑ.',
+               cls: 'x-html-editor-tip'
+           },
+           sourceedit : {
+               title: 'ÐÐ¶ÐµÑÐµÐ»ÑÐœÐžÐ¹ ÐºÐŸÐŽ',
+               text: 'Ð ÐµÐ¶ÐžÐŒ ÑÐµÐŽÐ°Ð³ÑÐ²Ð°ÐœÐœÑ ÐŽÐ¶ÐµÑÐµÐ»ÑÐœÐŸÐ³ÐŸ ÐºÐŸÐŽÑ.',
+               cls: 'x-html-editor-tip'
+           }
+        }
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ð¡ÐŸÑÑÑÐ²Ð°ÑÐž Ð¿ÐŸ Ð·ÑÐŸÑÑÐ°ÐœÐœÑ",
+      sortDescText : "Ð¡ÐŸÑÑÑÐ²Ð°ÑÐž Ð¿ÐŸ ÑÐ¿Ð°ÐŽÐ°ÐœÐœÑ",
+      lockText     : "ÐÐ°ÐºÑÑÐ¿ÐžÑÐž ÑÑÐŸÐ²Ð¿ÐµÑÑ",
+      unlockText   : "ÐÑÐŽÐºÑÑÐ¿ÐžÑÐž ÑÑÐŸÐ²Ð¿ÐµÑÑ",
+      columnsText  : "Ð¡ÑÐŸÐ²Ð¿ÑÑ"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÐÐ°Ð·Ð²Ð°",
+      valueText  : "ÐÐœÐ°ÑÐµÐœÐœÑ",
+      dateFormat : "j.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Ð¢ÑÐ³ÐœÑÑÑ ÐŽÐ»Ñ Ð·ÐŒÑÐœÐž ÑÐŸÐ·ÐŒÑÑÑ.",
+      collapsibleSplitTip : "Ð¢ÑÐ³ÐœÑÑÑ ÐŽÐ»Ñ Ð·ÐŒÑÐœÐž ÑÐŸÐ·ÐŒÑÑÑ. ÐÐŸÐŽÐ²ÑÐ¹ÐœÐžÐ¹ ÐºÐ»ÑÐº ÑÑ
+ÐŸÐ²Ð°Ñ Ð¿Ð°ÐœÐµÐ»Ñ."
+   });
+}
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en.js	(revision 76)
@@ -0,0 +1,346 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * English Translations
+ * updated to 2.2 by Condor (8 Aug 2008)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Loading...</div>';
+
+if(Ext.data.Types){
+    Ext.data.Types.stripRe = /[\$,%]/g;
+}
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} selected row{1}";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Loading...";
+}
+
+Date.monthNames = [
+  "January",
+  "February",
+  "March",
+  "April",
+  "May",
+  "June",
+  "July",
+  "August",
+  "September",
+  "October",
+  "November",
+  "December"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Sunday",
+  "Monday",
+  "Tuesday",
+  "Wednesday",
+  "Thursday",
+  "Friday",
+  "Saturday"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:st|nd|rd|th)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Cancel",
+    yes    : "Yes",
+    no     : "No"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "m/d/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Today",
+    minText           : "This date is before the minimum date",
+    maxText           : "This date is after the maximum date",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Next Month (Control+Right)',
+    prevText          : 'Previous Month (Control+Left)',
+    monthYearText     : 'Choose a month (Control+Up/Down to move years)',
+    todayTip          : "{0} (Spacebar)",
+    format            : "m/d/y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Cancel",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Page",
+    afterPageText  : "of {0}",
+    firstText      : "First Page",
+    prevText       : "Previous Page",
+    nextText       : "Next Page",
+    lastText       : "Last Page",
+    refreshText    : "Refresh",
+    displayMsg     : "Displaying {0} - {1} of {2}",
+    emptyMsg       : 'No data to display'
+  });
+}
+
+if(Ext.form.BasicForm){
+    Ext.form.BasicForm.prototype.waitTitle = "Please Wait..."
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "The value in this field is invalid";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "The minimum length for this field is {0}",
+    maxLengthText : "The maximum length for this field is {0}",
+    blankText     : "This field is required",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ".",
+    decimalPrecision : 2,
+    minText : "The minimum value for this field is {0}",
+    maxText : "The maximum value for this field is {0}",
+    nanText : "{0} is not a valid number"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Disabled",
+    disabledDatesText : "Disabled",
+    minText           : "The date in this field must be after {0}",
+    maxText           : "The date in this field must be before {0}",
+    invalidText       : "{0} is not a valid date - it must be in the format {1}",
+    format            : "m/d/y",
+    altFormats        : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Loading...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'This field should be an e-mail address in the format "user@example.com"',
+    urlText      : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+    alphaText    : 'This field should only contain letters and _',
+    alphanumText : 'This field should only contain letters, numbers and _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Please enter the URL for the link:',
+    buttonTips : {
+      bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Underline (Ctrl+U)',
+        text: 'Underline the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Grow Text',
+        text: 'Increase the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Shrink Text',
+        text: 'Decrease the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Text Highlight Color',
+        text: 'Change the background color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Font Color',
+        text: 'Change the color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Align Text Left',
+        text: 'Align text to the left.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Center Text',
+        text: 'Center text in the editor.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Align Text Right',
+        text: 'Align text to the right.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Bullet List',
+        text: 'Start a bulleted list.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numbered List',
+        text: 'Start a numbered list.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Make the selected text a hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Source Edit',
+        text: 'Switch to source editing mode.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Sort Ascending",
+    sortDescText : "Sort Descending",
+    columnsText  : "Columns"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(None)',
+    groupByText    : 'Group By This Field',
+    showGroupsText : 'Show in Groups'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Name",
+    valueText  : "Value",
+    dateFormat : "m/j/Y",
+    trueText: "true",
+    falseText: "false"
+  });
+}
+
+if(Ext.grid.BooleanColumn){
+   Ext.apply(Ext.grid.BooleanColumn.prototype, {
+      trueText  : "true",
+      falseText : "false",
+      undefinedText: '&#160;'
+   });
+}
+
+if(Ext.grid.NumberColumn){
+    Ext.apply(Ext.grid.NumberColumn.prototype, {
+        format : '0,000.00'
+    });
+}
+
+if(Ext.grid.DateColumn){
+    Ext.apply(Ext.grid.DateColumn.prototype, {
+        format : 'm/d/Y'
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Drag to resize.",
+    collapsibleSplitTip : "Drag to resize. Double click to hide."
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "The time in this field must be equal to or after {0}",
+    maxText : "The time in this field must be equal to or before {0}",
+    invalidText : "{0} is not a valid time",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "You must select at least one item in this group"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "You must select one item in this group"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_BR.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_BR.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_BR.js	(revision 76)
@@ -0,0 +1,303 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Portuguese/Brazil Translation by Weber Souza
+ * 08 April 2007
+ * Updated by Allan Brazute Alves (EthraZa)
+ * 06 September 2007
+ * Updated by Leonardo Lima
+ * 05 March 2008
+ * Updated by Juliano Tarini (jtarini)
+ * 22 April 2008
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Carregando...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} linha(s) selecionada(s)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Fechar";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "O valor para este campo &eacute; inv&aacute;lido";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Carregando...";
+}
+
+Date.monthNames = [
+   "Janeiro",
+   "Fevereiro",
+   "Mar&ccedil;o",
+   "Abril",
+   "Maio",
+   "Junho",
+   "Julho",
+   "Agosto",
+   "Setembro",
+   "Outubro",
+   "Novembro",
+   "Dezembro"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Fev : 1,
+  Mar : 2,
+  Abr : 3,
+  Mai : 4,
+  Jun : 5,
+  Jul : 6,
+  Ago : 7,
+  Set : 8,
+  Out : 9,
+  Nov : 10,
+  Dez : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "Domingo",
+   "Segunda",
+   "Ter&ccedil;a",
+   "Quarta",
+   "Quinta",
+   "Sexta",
+   "S&aacute;bado"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Cancelar",
+      yes    : "Sim",
+      no     : "N&atilde;o"
+   };
+}
+
+if (Ext.util.Format) {
+  Ext.util.Format.date = function(v, format){
+    if (!v) return "";
+    if (!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+  Ext.util.Format.brMoney = function(v){
+    v = (Math.round((v - 0) * 100)) / 100;
+    v = (v == Math.floor(v)) ? v + ".00" : ((v * 10 == Math.floor(v * 10)) ? v + "0" : v);
+    v = String(v);
+    var ps = v.split('.');
+    var whole = ps[0];
+    var sub = ps[1] ? '.' + ps[1] : '.00';
+    var r = /(\d+)(\d{3})/;
+    while (r.test(whole)) {
+      whole = whole.replace(r, '$1' + '.' + '$2');
+    }
+    v = whole + sub;
+    if (v.charAt(0) == '-') {
+      return '- R$ ' + v.substr(1);
+    }
+    return "R$ " + v;
+  }
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Hoje",
+      minText           : "Esta data &eacute; anterior a menor data",
+      maxText           : "Esta data &eacute; posterior a maior data",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'Pr&oacute;ximo M&ecirc;s (Control+Direita)',
+      prevText          : 'M&ecirc;s Anterior (Control+Esquerda)',
+      monthYearText     : 'Escolha um M&ecirc;s (Control+Cima/Baixo para mover entre os anos)',
+      todayTip          : "{0} (Espa&ccedil;o)",
+      format            : "d/m/Y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "Cancelar",
+      startDay          : 0
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "P&aacute;gina",
+      afterPageText  : "de {0}",
+      firstText      : "Primeira P&aacute;gina",
+      prevText       : "P&aacute;gina Anterior",
+      nextText       : "Pr&oacute;xima P&aacute;gina",
+      lastText       : "&Uacute;ltima P&aacute;gina",
+      refreshText    : "Atualizar",
+      displayMsg     : "<b>{0} &agrave; {1} de {2} registro(s)</b>",
+      emptyMsg       : 'Sem registros para exibir'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "O tamanho m&iacute;nimo para este campo &eacute; {0}",
+      maxLengthText : "O tamanho m&aacute;ximo para este campo &eacute; {0}",
+      blankText     : "Este campo &eacute; obrigat&oacute;rio.",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "O valor m&iacute;nimo para este campo &eacute; {0}",
+      maxText : "O valor m&aacute;ximo para este campo &eacute; {0}",
+      nanText : "{0} n&atilde;o &eacute; um n&uacute;mero v&aacute;lido"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Desabilitado",
+      disabledDatesText : "Desabilitado",
+      minText           : "A data deste campo deve ser posterior a {0}",
+      maxText           : "A data deste campo deve ser anterior a {0}",
+      invalidText       : "{0} n&atilde;o &eacute; uma data v&aacute;lida - deve ser informado no formato {1}",
+      format            : "d/m/Y",
+      startDay          : 0
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Carregando...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Este campo deve ser um endere&ccedil;o de e-mail v&aacute;lido, no formato "usuario@dominio.com.br"',
+      urlText      : 'Este campo deve ser uma URL no formato "http:/'+'/www.dominio.com.br"',
+      alphaText    : 'Este campo deve conter apenas letras e _',
+      alphanumText : 'Este campo deve conter apenas letras, n&uacute;meros e _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+        createLinkText : 'Por favor, entre com a URL do link:',
+        buttonTips : {
+            bold : {
+               title: 'Negrito (Ctrl+B)',
+               text: 'Deixa o texto selecionado em negrito.',
+               cls: 'x-html-editor-tip'
+            },
+            italic : {
+               title: 'It&aacute;lico (Ctrl+I)',
+               text: 'Deixa o texto selecionado em it&aacute;lico.',
+               cls: 'x-html-editor-tip'
+            },
+            underline : {
+               title: 'Sublinhado (Ctrl+U)',
+               text: 'Sublinha o texto selecionado.',
+               cls: 'x-html-editor-tip'
+           },
+           increasefontsize : {
+               title: 'Aumentar Texto',
+               text: 'Aumenta o tamanho da fonte.',
+               cls: 'x-html-editor-tip'
+           },
+           decreasefontsize : {
+               title: 'Diminuir Texto',
+               text: 'Diminui o tamanho da fonte.',
+               cls: 'x-html-editor-tip'
+           },
+           backcolor : {
+               title: 'Cor de Fundo',
+               text: 'Muda a cor do fundo do texto selecionado.',
+               cls: 'x-html-editor-tip'
+           },
+           forecolor : {
+               title: 'Cor da Fonte',
+               text: 'Muda a cor do texto selecionado.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyleft : {
+               title: 'Alinhar &agrave; Esquerda',
+               text: 'Alinha o texto &agrave; esquerda.',
+               cls: 'x-html-editor-tip'
+           },
+           justifycenter : {
+               title: 'Centralizar Texto',
+               text: 'Centraliza o texto no editor.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyright : {
+               title: 'Alinhar &agrave; Direita',
+               text: 'Alinha o texto &agrave; direita.',
+               cls: 'x-html-editor-tip'
+           },
+           insertunorderedlist : {
+               title: 'Lista com Marcadores',
+               text: 'Inicia uma lista com marcadores.',
+               cls: 'x-html-editor-tip'
+           },
+           insertorderedlist : {
+               title: 'Lista Numerada',
+               text: 'Inicia uma lista numerada.',
+               cls: 'x-html-editor-tip'
+           },
+           createlink : {
+               title: 'Link',
+               text: 'Transforma o texto selecionado em um link.',
+               cls: 'x-html-editor-tip'
+           },
+           sourceedit : {
+               title: 'Editar Fonte',
+               text: 'Troca para o modo de edi&ccedil;&atilde;o de c&oacute;digo fonte.',
+               cls: 'x-html-editor-tip'
+           }
+        }
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ordem Ascendente",
+      sortDescText : "Ordem Descendente",
+      lockText     : "Bloquear Coluna",
+      unlockText   : "Desbloquear Coluna",
+      columnsText  : "Colunas"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Nome",
+      valueText  : "Valor",
+      dateFormat : "d/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Arraste para redimensionar.",
+      collapsibleSplitTip : "Arraste para redimensionar. Duplo clique para esconder."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr.js	(revision 76)
@@ -0,0 +1,346 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/*
+ * France (France) translation
+ * By Thylia
+ * 09-11-2007, 02:22 PM
+ * updated by disizben (22 Sep 2008)
+ * updated by Thylia (20 Apr 2010)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">En cours de chargement...</div>';
+
+if(Ext.DataView){
+   Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ligne{1} sÃ©lectionnÃ©e{1}";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "En cours de chargement...";
+}
+
+Date.shortMonthNames = [
+   "Janv",
+   "FÃ©vr",
+   "Mars",
+   "Avr",
+   "Mai",
+   "Juin",
+   "Juil",
+   "AoÃ»t",
+   "Sept",
+   "Oct",
+   "Nov",
+   "DÃ©c"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.shortMonthNames[month];
+};
+
+Date.monthNames = [
+   "Janvier",
+   "FÃ©vrier",
+   "Mars",
+   "Avril",
+   "Mai",
+   "Juin",
+   "Juillet",
+   "AoÃ»t",
+   "Septembre",
+   "Octobre",
+   "Novembre",
+   "DÃ©cembre"
+];
+
+Date.monthNumbers = {
+  "Janvier" : 0,
+  "FÃ©vrier" : 1,
+  "Mars" : 2,
+  "Avril" : 3,
+  "Mai" : 4,
+  "Juin" : 5,
+  "Juillet" : 6,
+  "AoÃ»t" : 7,
+  "Septembre" : 8,
+  "Octobre" : 9,
+  "Novembre" : 10,
+  "DÃ©cembre" : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[Ext.util.Format.capitalize(name)];
+};
+
+Date.dayNames = [
+   "Dimanche",
+   "Lundi",
+   "Mardi",
+   "Mercredi",
+   "Jeudi",
+   "Vendredi",
+   "Samedi"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:er)";
+
+Ext.override(Date, {
+    getSuffix : function() {
+        return (this.getDate() == 1) ? "er" : "";
+    }
+});
+
+if(Ext.MessageBox){
+    Ext.MessageBox.buttonText = {
+        ok     : "OK",
+        cancel : "Annuler",
+        yes    : "Oui",
+        no     : "Non"
+    };
+}
+
+if(Ext.util.Format){
+    Ext.util.Format.date = function(v, format){
+        if(!v) return "";
+        if(!Ext.isDate(v)) v = new Date(Date.parse(v));
+        return v.dateFormat(format || "d/m/Y");
+    };
+    Ext.util.Format.plural = function(v, s, p) {
+        return v + ' ' + (v <= 1 ? s : (p ? p : s + 's'));
+    };
+}
+
+if(Ext.DatePicker){
+    Ext.apply(Ext.DatePicker.prototype, {
+        todayText         : "Aujourd'hui",
+        minText           : "Cette date est antÃ©rieure Ã  la date minimum",
+        maxText           : "Cette date est postÃ©rieure Ã  la date maximum",
+        disabledDaysText  : "",
+        disabledDatesText : "",
+        monthNames        : Date.monthNames,
+        dayNames          : Date.dayNames,
+        nextText          : 'Mois suivant (CTRL+FlÃšche droite)',
+        prevText          : "Mois prÃ©cÃ©dent (CTRL+FlÃšche gauche)",
+        monthYearText     : "Choisissez un mois (CTRL+FlÃšche haut ou bas pour changer d'annÃ©e.)",
+        todayTip          : "{0} (Barre d'espace)",
+        okText            : "&#160;OK&#160;",
+        cancelText        : "Annuler",
+        format            : "d/m/y",
+        startDay          : 1
+    });
+}
+
+if(Ext.PagingToolbar){
+    Ext.apply(Ext.PagingToolbar.prototype, {
+        beforePageText : "Page",
+        afterPageText  : "sur {0}",
+        firstText      : "PremiÃšre page",
+        prevText       : "Page prÃ©cÃ©dente",
+        nextText       : "Page suivante",
+        lastText       : "DerniÃšre page",
+        refreshText    : "Actualiser la page",
+        displayMsg     : "Page courante {0} - {1} sur {2}",
+        emptyMsg       : 'Aucune donnÃ©e Ã  afficher'
+    });
+}
+
+if(Ext.form.BasicForm){
+    Ext.form.BasicForm.prototype.waitTitle = "Veuillez patienter...";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "La valeur de ce champ est invalide";
+}
+
+if(Ext.form.TextField){
+    Ext.apply(Ext.form.TextField.prototype, {
+        minLengthText : "La longueur minimum de ce champ est de {0} caractÃšre(s)",
+        maxLengthText : "La longueur maximum de ce champ est de {0} caractÃšre(s)",
+        blankText     : "Ce champ est obligatoire",
+        regexText     : "",
+        emptyText     : null
+    });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      decimalSeparator : ",",
+      decimalPrecision : 2,
+      minText : "La valeur minimum de ce champ doit Ãªtre de {0}",
+      maxText : "La valeur maximum de ce champ doit Ãªtre de {0}",
+      nanText : "{0} n'est pas un nombre valide"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "DÃ©sactivÃ©",
+      disabledDatesText : "DÃ©sactivÃ©",
+      minText           : "La date de ce champ ne peut Ãªtre antÃ©rieure au {0}",
+      maxText           : "La date de ce champ ne peut Ãªtre postÃ©rieure au {0}",
+      invalidText       : "{0} n'est pas une date valide - elle doit Ãªtre au format suivant: {1}",
+      format            : "d/m/y",
+      altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "En cours de chargement...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Ce champ doit contenir une adresse email au format: "usager@example.com"',
+      urlText      : 'Ce champ doit contenir une URL au format suivant: "http:/'+'/www.example.com"',
+      alphaText    : 'Ce champ ne peut contenir que des lettres et le caractÃšre soulignÃ© (_)',
+      alphanumText : 'Ce champ ne peut contenir que des caractÃšres alphanumÃ©riques ainsi que le caractÃšre soulignÃ© (_)'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+      createLinkText : "Veuillez entrer l'URL pour ce lien:",
+          buttonTips : {
+              bold : {
+                  title: 'Gras (Ctrl+B)',
+                  text: 'Met le texte sÃ©lectionnÃ© en gras.',
+                  cls: 'x-html-editor-tip'
+              },
+              italic : {
+                  title: 'Italique (Ctrl+I)',
+                  text: 'Met le texte sÃ©lectionnÃ© en italique.',
+                  cls: 'x-html-editor-tip'
+              },
+              underline : {
+                  title: 'SoulignÃ© (Ctrl+U)',
+                  text: 'Souligne le texte sÃ©lectionnÃ©.',
+                  cls: 'x-html-editor-tip'
+              },
+              increasefontsize : {
+                  title: 'Agrandir la police',
+                  text: 'Augmente la taille de la police.',
+                  cls: 'x-html-editor-tip'
+              },
+              decreasefontsize : {
+                  title: 'RÃ©duire la police',
+                  text: 'RÃ©duit la taille de la police.',
+                  cls: 'x-html-editor-tip'
+              },
+              backcolor : {
+                  title: 'Couleur de surbrillance',
+                  text: 'Modifie la couleur de fond du texte sÃ©lectionnÃ©.',
+                  cls: 'x-html-editor-tip'
+              },
+              forecolor : {
+                  title: 'Couleur de police',
+                  text: 'Modifie la couleur du texte sÃ©lectionnÃ©.',
+                  cls: 'x-html-editor-tip'
+              },
+              justifyleft : {
+                  title: 'Aligner Ã  gauche',
+                  text: 'Aligne le texte Ã  gauche.',
+                  cls: 'x-html-editor-tip'
+              },
+              justifycenter : {
+                  title: 'Centrer',
+                  text: 'Centre le texte.',
+                  cls: 'x-html-editor-tip'
+              },
+              justifyright : {
+                  title: 'Aligner Ã  droite',
+                  text: 'Aligner le texte Ã  droite.',
+                  cls: 'x-html-editor-tip'
+              },
+              insertunorderedlist : {
+                  title: 'Liste Ã  puce',
+                  text: 'DÃ©marre une liste Ã  puce.',
+                  cls: 'x-html-editor-tip'
+              },
+              insertorderedlist : {
+                  title: 'Liste numÃ©rotÃ©e',
+                  text: 'DÃ©marre une liste numÃ©rotÃ©e.',
+                  cls: 'x-html-editor-tip'
+              },
+              createlink : {
+                  title: 'Lien hypertexte',
+                  text: 'Transforme en lien hypertexte.',
+                  cls: 'x-html-editor-tip'
+              },
+              sourceedit : {
+                  title: 'Code source',
+                  text: 'Basculer en mode Ã©dition du code source.',
+                  cls: 'x-html-editor-tip'
+              }
+        }
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Tri croissant",
+      sortDescText : "Tri dÃ©croissant",
+      columnsText  : "Colonnes"
+   });
+}
+
+if(Ext.grid.GroupingView){
+   Ext.apply(Ext.grid.GroupingView.prototype, {
+      emptyGroupText : '(Aucun)',
+      groupByText    : 'Grouper par ce champ',
+      showGroupsText : 'Afficher par groupes'
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+    Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+        nameText   : "PropriÃ©tÃ©",
+        valueText  : "Valeur",
+        dateFormat : "d/m/Y",
+        trueText   : "vrai",
+        falseText  : "faux"
+    });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Cliquer et glisser pour redimensionner le panneau.",
+      collapsibleSplitTip : "Cliquer et glisser pour redimensionner le panneau. Double-cliquer pour le cacher."
+   });
+}
+
+if(Ext.form.TimeField){
+   Ext.apply(Ext.form.TimeField.prototype, {
+      minText     : "L'heure de ce champ ne peut Ãªtre antÃ©rieure Ã  {0}",
+      maxText     : "L'heure de ce champ ne peut Ãªtre postÃ©rieure Ã  {0}",
+      invalidText : "{0} n'est pas une heure valide",
+      format      : "H:i",
+      altFormats  : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|h a|g a|g A|gi|hi|Hi|gia|hia|g|H"
+   });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "Vous devez sÃ©lectionner au moins un Ã©lÃ©ment dans ce groupe"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "Vous devez sÃ©lectionner au moins un Ã©lÃ©ment dans ce groupe"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NN.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NN.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-no_NN.js	(revision 76)
@@ -0,0 +1,295 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ *
+ * Norwegian translation (Nynorsk: no-NN)
+ * By Tore KjÃžrsvik 21-January-2008
+ *  
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Lastar...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} markert(e) rad(er)";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Lukk denne fana";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "Verdien i dette feltet er ugyldig";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Lastar...";
+}
+
+Date.monthNames = [
+  "Januar",
+  "Februar",
+  "Mars",
+  "April",
+  "Mai",
+  "Juni",
+  "Juli",
+  "August",
+  "September",
+  "Oktober",
+  "November",
+  "Desember"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  Mai : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Okt : 9,
+  Nov : 10,
+  Des : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "SÃžndag",
+  "MÃ¥ndag",
+  "Tysdag",
+  "Onsdag",
+  "Torsdag",
+  "Fredag",
+  "Laurdag"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Avbryt",
+    yes    : "Ja",
+    no     : "Nei"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d.m.Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "I dag",
+    minText           : "Denne datoen er fÃžr tidlegaste tillatne dato",
+    maxText           : "Denne datoen er etter seinaste tillatne dato",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames	      : Date.monthNames,
+    dayNames		      : Date.dayNames,
+    nextText          : 'Neste mÃ¥nad (Control+Pil HÃžgre)',
+    prevText          : 'FÃžrre mÃ¥nad (Control+Pil Venstre)',
+    monthYearText     : 'Velj ein mÃ¥nad (Control+Pil Opp/Ned for Ã¥ skifte Ã¥r)',
+    todayTip          : "{0} (Mellomrom)",
+    format            : "d.m.y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Avbryt",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Side",
+    afterPageText  : "av {0}",
+    firstText      : "FÃžrste sida",
+    prevText       : "FÃžrre sida",
+    nextText       : "Neste sida",
+    lastText       : "Siste sida",
+    refreshText    : "Oppdater",
+    displayMsg     : "Viser {0} - {1} av {2}",
+    emptyMsg       : 'Ingen data Ã¥ vise'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "Den minste lengda for dette feltet er {0}",
+    maxLengthText : "Den stÃžrste lengda for dette feltet er {0}",
+    blankText     : "Dette feltet er pÃ¥kravd",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "Den minste verdien for dette feltet er {0}",
+    maxText : "Den stÃžrste verdien for dette feltet er {0}",
+    nanText : "{0} er ikkje eit gyldig nummer"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Deaktivert",
+    disabledDatesText : "Deaktivert",
+    minText           : "Datoen i dette feltet mÃ¥ vere etter {0}",
+    maxText           : "Datoen i dette feltet mÃ¥ vere fÃžr {0}",
+    invalidText       : "{0} er ikkje ein gyldig dato - han mÃ¥ vere pÃ¥ formatet {1}",
+    format            : "d.m.y",
+    altFormats        : "d.m.Y|d/m/y|d/m/Y|d-m-y|d-m-Y|d.m|d/m|d-m|dm|dmy|dmY|Y-m-d|d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Lastar...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Dette feltet skal vere ei epost adresse pÃ¥ formatet "bruker@domene.no"',
+      urlText      : 'Dette feltet skal vere ein link (URL) pÃ¥ formatet "http:/'+'/www.domene.no"',
+      alphaText    : 'Dette feltet skal berre innehalde bokstavar og _',
+      alphanumText : 'Dette feltet skal berre innehalde bokstavar, tal og _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Ver venleg og skriv inn URL for lenken:',
+    buttonTips : {
+      bold : {
+        title: 'Feit (Ctrl+B)',
+        text: 'Gjer den valde teksten feit.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursiv (Ctrl+I)',
+        text: 'Gjer den valde teksten kursiv.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Understrek (Ctrl+U)',
+        text: 'Understrek den valde teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ForstÃžrr tekst',
+        text: 'Gjer fontstorleik stÃžrre.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Forminsk tekst',
+        text: 'Gjer fontstorleik mindre.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Tekst markeringsfarge',
+        text: 'Endre bakgrunnsfarge til den valde teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Font farge',
+        text: 'Endre farge pÃ¥ den valde teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Venstrejuster tekst',
+        text: 'Venstrejuster teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Sentrer tekst',
+        text: 'Sentrer teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'HÃžgrejuster tekst',
+        text: 'HÃžgrejuster teksten.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Punktliste',
+        text: 'Start ei punktliste.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Nummerert liste',
+        text: 'Start ei nummerert liste.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Lenke',
+        text: 'Gjer den valde teksten til ei lenke.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Rediger kjelde',
+        text: 'Bytt til kjelderedigeringsvising.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Sorter stigande",
+    sortDescText : "Sorter fallande",
+    lockText     : "LÃ¥s kolonne",
+    unlockText   : "LÃ¥s opp kolonne",
+    columnsText  : "Kolonner"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Ingen)',
+    groupByText    : 'Grupper etter dette feltet',
+    showGroupsText : 'Vis i grupper'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Namn",
+    valueText  : "Verdi",
+    dateFormat : "d.m.Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Dra for Ã¥ endre storleik.",
+    collapsibleSplitTip : "Dra for Ã¥ endre storleik. Dobbelklikk for Ã¥ skjule."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-gr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-gr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-gr.js	(revision 76)
@@ -0,0 +1,184 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Greek (Old Version) Translations by Vagelis
+ * 03-June-2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">ÃÃŒÃ±ÃŽÃ¹Ã³Ã§...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} Ã¥Ã°Ã©Ã«Ã¥Ã£Ã¬ÃÃ­Ã§(Ã¥Ã²) Ã£Ã±Ã¡Ã¬Ã¬Ã(ÃÃ²)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÃÃ«Ã¥ÃÃ³ÃŽÃ¥ Ã¡ÃµÃŽÃ ÃŽÃ§Ã­ ÃªÃ¡Ã±ÃŽÃÃ«Ã¡";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Ã ÃŽÃ©Ã¬Ã Ã³ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã€Ã¥Ã­ Ã¥ÃÃ­Ã¡Ã© ÃÃ£ÃªÃµÃ±Ã§";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "ÃÃŒÃ±ÃŽÃ¹Ã³Ã§...";
+}
+
+Date.monthNames = [
+   "ÃÃ¡Ã­Ã¯ÃµÃÃ±Ã©Ã¯Ã²",
+   "ÃÃ¥Ã¢Ã±Ã¯ÃµÃÃ±Ã©Ã¯Ã²",
+   "ÃÃÃ±ÃŽÃ©Ã¯Ã²",
+   "ÃÃ°Ã±ÃÃ«Ã©Ã¯Ã²",
+   "ÃÃÃ©Ã¯Ã²",
+   "ÃÃ¯ÃœÃ­Ã©Ã¯Ã²",
+   "ÃÃ¯ÃœÃ«Ã©Ã¯Ã²",
+   "ÃÃœÃ£Ã¯ÃµÃ³ÃŽÃ¯Ã²",
+   "ÃÃ¥Ã°ÃŽÃÃ¬Ã¢Ã±Ã©Ã¯Ã²",
+   "ÃÃªÃŽÃŸÃ¢Ã±Ã©Ã¯Ã²",
+   "ÃÃ¯ÃÃ¬Ã¢Ã±Ã©Ã¯Ã²",
+   "ÃÃ¥ÃªÃÃ¬Ã¢Ã±Ã©Ã¯Ã²"
+];
+
+Date.dayNames = [
+   "ÃÃµÃ±Ã©Ã¡ÃªÃ",
+   "ÃÃ¥ÃµÃŽÃÃ±Ã¡",
+   "ÃÃ±ÃÃŽÃ§",
+   "ÃÃ¥ÃŽÃÃ±ÃŽÃ§",
+   "ÃÃÃ¬Ã°ÃŽÃ§",
+   "ÃÃ¡Ã±Ã¡Ã³ÃªÃ¥ÃµÃ",
+   "ÃÃÃ¢Ã¢Ã¡ÃŽÃ¯"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "Ã
+Ã­ÃŽÃÃ®Ã¥Ã©",
+      cancel : "ÃÃªÃœÃ±Ã¹Ã³Ã§",
+      yes    : "ÃÃ¡Ã©",
+      no     : "ÂŒÃ·Ã©"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "Ã¬/Ã§/Ã
+");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "ÃÃÃ¬Ã¥Ã±Ã¡",
+      minText           : "Ã Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡ Ã¡ÃµÃŽÃ Ã¥ÃÃ­Ã¡Ã© Ã°Ã±Ã©Ã­ ÃŽÃ§Ã­ Ã¬Ã©ÃªÃ±ÃŒÃŽÃ¥Ã±Ã§ Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡",
+      maxText           : "Ã Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡ Ã¡ÃµÃŽÃ Ã¥ÃÃ­Ã¡Ã© Ã¬Ã¥ÃŽÃ ÃŽÃ§Ã­ Ã¬Ã¥Ã£Ã¡Ã«ÃœÃŽÃ¥Ã±Ã§ Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'Ã
+Ã°ÃŒÃ¬Ã¥Ã­Ã¯Ã² ÃÃÃ­Ã¡Ã² (Control+Right)',
+      prevText          : 'ÃÃ±Ã¯Ã§Ã£Ã¯ÃœÃ¬Ã¥Ã­Ã¯Ã² ÃÃÃ­Ã¡Ã² (Control+Left)',
+      monthYearText     : 'Ã
+Ã°Ã©Ã«ÃÃ®ÃŽÃ¥ ÃÃÃ­Ã¡ (Control+Up/Down Ã£Ã©Ã¡ Ã¬Ã¥ÃŽÃ¡ÃªÃÃ­Ã§Ã³Ã§ Ã³ÃŽÃ¡ ÃÃŽÃ§)',
+      todayTip          : "{0} (Spacebar)",
+      format            : "Ã¬/Ã§/Ã
+"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "ÃÃ¥Ã«ÃÃ€Ã¡",
+      afterPageText  : "Ã¡Ã°ÃŒ {0}",
+      firstText      : "ÃÃ±ÃŸÃŽÃ§ Ã³Ã¥Ã«ÃÃ€Ã¡",
+      prevText       : "ÃÃ±Ã¯Ã§Ã£Ã¯ÃœÃ¬Ã¥Ã­Ã§ Ã³Ã¥Ã«ÃÃ€Ã¡",
+      nextText       : "Ã
+Ã°ÃŒÃ¬Ã¥Ã­Ã§ Ã³Ã¥Ã«ÃÃ€Ã¡",
+      lastText       : "ÃÃ¥Ã«Ã¥ÃµÃŽÃ¡ÃÃ¡ Ã³Ã¥Ã«ÃÃ€Ã¡",
+      refreshText    : "ÃÃ­Ã¡Ã­ÃÃ¹Ã³Ã§",
+      displayMsg     : "Ã
+Ã¬Ã¶ÃÃ­Ã©Ã³Ã§ {0} - {1} Ã¡Ã°ÃŒ {2}",
+      emptyMsg       : 'ÃÃ¥Ã­ Ã¢Ã±ÃÃšÃ§ÃªÃ¡Ã­ Ã¥Ã£Ã£Ã±Ã¡Ã¶ÃÃ² Ã£Ã©Ã¡ Ã¥Ã¬Ã¶ÃÃ­Ã©Ã³Ã§'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "ÃÃ¯ Ã¥Ã«ÃÃ·Ã©Ã³ÃŽÃ¯ Ã¬ÃÃ£Ã¥ÃšÃ¯Ã² Ã£Ã©Ã¡ Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã¥ÃÃ­Ã¡Ã© {0}",
+      maxLengthText : "ÃÃ¯ Ã¬ÃÃ£Ã©Ã³ÃŽÃ¯ Ã¬ÃÃ£Ã¥ÃšÃ¯Ã² Ã£Ã©Ã¡ Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã¥ÃÃ­Ã¡Ã© {0}",
+      blankText     : "ÃÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã¡ÃµÃŽÃŒ Ã¥ÃÃ­Ã¡Ã© ÃµÃ°Ã¯Ã·Ã±Ã¥Ã¹ÃŽÃ¯ÃªÃŒ",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Ã Ã¥Ã«ÃÃ·Ã©Ã³ÃŽÃ§ ÃŽÃ©Ã¬Ã Ã£Ã©Ã¡ Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã¥ÃÃ­Ã¡Ã© {0}",
+      maxText : "Ã Ã¬ÃÃ£Ã©Ã³ÃŽÃ§ ÃŽÃ©Ã¬Ã Ã£Ã©Ã¡ Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã¥ÃÃ­Ã¡Ã© {0}",
+      nanText : "{0} Ã€Ã¥Ã­ Ã¥ÃÃ­Ã¡Ã© ÃÃ£ÃªÃµÃ±Ã¯Ã² Ã¡Ã±Ã©ÃšÃ¬ÃŒÃ²"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ÃÃ°Ã¥Ã­Ã¥Ã±Ã£Ã¯Ã°Ã¯Ã©Ã§Ã¬ÃÃ­Ã¯",
+      disabledDatesText : "ÃÃ°Ã¥Ã­Ã¥Ã±Ã£Ã¯Ã°Ã¯Ã©Ã§Ã¬ÃÃ­Ã¯",
+      minText           : "Ã Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡ Ã³' Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã¥ÃÃ­Ã¡Ã© Ã¬Ã¥ÃŽÃ Ã¡Ã°ÃŒ {0}",
+      maxText           : "Ã Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡ Ã³' Ã¡ÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã¥ÃÃ­Ã¡Ã© Ã°Ã±Ã©Ã­ Ã¡Ã°ÃŒ {0}",
+      invalidText       : "{0} Ã€Ã¥Ã­ Ã¥ÃÃ­Ã¡Ã© ÃÃ£ÃªÃµÃ±Ã§ Ã§Ã¬Ã¥Ã±Ã¯Ã¬Ã§Ã­ÃÃ¡ - Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã¥ÃÃ­Ã¡Ã© ÃŽÃ§Ã² Ã¬Ã¯Ã±Ã¶ÃÃ² {1}",
+      format            : "Ã¬/Ã§/Ã
+"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "ÃÃŒÃ±ÃŽÃ¹Ã³Ã§...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'ÃÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã¥ÃÃ­Ã¡Ã© e-mail address ÃŽÃ§Ã² Ã¬Ã¯Ã±Ã¶ÃÃ² "user@example.com"',
+      urlText      : 'ÃÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã¥ÃÃ­Ã¡Ã© Ã¬Ã©Ã¡ Ã€Ã©Ã¥ÃœÃšÃµÃ­Ã³Ã§ URL ÃŽÃ§Ã² Ã¬Ã¯Ã±Ã¶ÃÃ² "http:/'+'/www.example.com"',
+      alphaText    : 'ÃÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã°Ã¥Ã±Ã©ÃÃ·Ã¥Ã© Ã£Ã±ÃÃ¬Ã¬Ã¡ÃŽÃ¡ ÃªÃ¡Ã© _',
+      alphanumText : 'ÃÃµÃŽÃŒ ÃŽÃ¯ Ã°Ã¥Ã€ÃÃ¯ Ã°Ã±ÃÃ°Ã¥Ã© Ã­Ã¡ Ã°Ã¥Ã±Ã©ÃÃ·Ã¥Ã© Ã£Ã±ÃÃ¬Ã¬Ã¡ÃŽÃ¡, Ã¡Ã±Ã©ÃšÃ¬Ã¯ÃœÃ² ÃªÃ¡Ã© _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "ÃÃœÃ®Ã¯ÃµÃ³Ã¡ ÃÃ¡Ã®Ã©Ã­ÃŒÃ¬Ã§Ã³Ã§",
+      sortDescText : "ÃÃšÃÃ­Ã¯ÃµÃ³Ã¡ ÃÃ¡Ã®Ã©Ã­ÃŒÃ¬Ã§Ã³Ã§",
+      lockText     : "ÃÃ«Ã¥ÃÃ€Ã¹Ã¬Ã¡ Ã³ÃŽÃÃ«Ã§Ã²",
+      unlockText   : "ÃÃ¥ÃªÃ«Ã¥ÃÃ€Ã¹Ã¬Ã¡ Ã³ÃŽÃÃ«Ã§Ã²",
+      columnsText  : "ÃÃŽÃÃ«Ã¥Ã²"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÂŒÃ­Ã¯Ã¬Ã¡",
+      valueText  : "ÃÃ©Ã¬Ã",
+      dateFormat : "Ã¬/Ã§/Ã
+"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "ÃÃœÃ±Ã¥ÃŽÃ¥ Ã£Ã©Ã¡ Ã¡Ã«Ã«Ã¡Ã£Ã Ã¬Ã¥Ã£ÃÃšÃ¯ÃµÃ².",
+      collapsibleSplitTip : "ÃÃœÃ±Ã¥ÃŽÃ¥ Ã£Ã©Ã¡ Ã¡Ã«Ã«Ã¡Ã£Ã Ã¬Ã¥Ã£ÃÃšÃ¯ÃµÃ². Double click Ã£Ã©Ã¡ Ã¡Ã°ÃŒÃªÃ±ÃµÃžÃ§."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-hr.js	(revision 76)
@@ -0,0 +1,296 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Croatian translation
+ * By Ylodi (utf8 encoding)
+ * 8 May 2007
+ *
+ * By Stjepan at gmail dot com (utf8 encoding)
+ * 17 May 2008
+ */
+ 
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">UÄitavanje...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} odabranih redova";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Zatvori ovaj tab";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Unesena vrijednost u ovom polju je neispravna";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "UÄitavanje...";
+}
+
+Date.monthNames = [
+   "SijeÄanj",
+   "VeljaÄa",
+   "OÅŸujak",
+   "Travanj",
+   "Svibanj",
+   "Lipanj",
+   "Srpanj",
+   "Kolovoz",
+   "Rujan",
+   "Listopad",
+   "Studeni",
+   "Prosinac"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "Nedjelja",
+   "Ponedjeljak",
+   "Utorak",
+   "Srijeda",
+   "Äetvrtak",
+   "Petak",
+   "Subota"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "U redu",
+      cancel : "Odustani",
+      yes    : "Da",
+      no     : "Ne"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Danas",
+      minText           : "Taj datum je prije najmanjeg datuma",
+      maxText           : "Taj datum je poslije najveÄeg datuma",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'SlijedeÄi mjesec (Control+Desno)',
+      prevText          : 'Prethodni mjesec (Control+Lijevo)',
+      monthYearText     : 'Odaberite mjesec (Control+Gore/Dolje za promjenu godine)',
+      todayTip          : "{0} (Razmaknica)",
+      format            : "d.m.y",
+      okText            : "&#160;U redu&#160;",
+      cancelText        : "Odustani",      
+      startDay 		: 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Stranica",
+      afterPageText  : "od {0}",
+      firstText      : "Prva stranica",
+      prevText       : "Prethodna stranica",
+      nextText       : "SlijedeÄa stranica",
+      lastText       : "Posljednja stranica",
+      refreshText    : "Obnovi",
+      displayMsg     : "Prikazujem {0} - {1} od {2}",
+      emptyMsg       : 'Nema podataka za prikaz'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Minimalna duÅŸina za ovo polje je {0}",
+      maxLengthText : "Maksimalna duÅŸina za ovo polje je {0}",
+      blankText     : "Ovo polje je obavezno",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Minimalna vrijednost za ovo polje je {0}",
+      maxText : "Maksimalna vrijednost za ovo polje je {0}",
+      nanText : "{0} nije ispravan broj"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Neaktivno",
+      disabledDatesText : "Neaktivno",
+      minText           : "Datum u ovom polje mora biti poslije {0}",
+      maxText           : "Datum u ovom polju mora biti prije {0}",
+      invalidText       : "{0} nije ispravan datum - mora biti u obliku {1}",
+      format            : "d.m.y",
+      startDay 		: 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "UÄitavanje...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Ovdje moÅŸete unijeti samo e-mail adresu u obliku "korisnik@domena.com"',
+      urlText      : 'Ovdje moÅŸete unijeti samo URL u obliku "http:/'+'/www.domena.com"',
+      alphaText    : 'Ovo polje moÅŸe sadrÅŸavati samo slova i znak _',
+      alphanumText : 'Ovo polje moÅŸe sadrÅŸavati samo slova, brojeve i znak _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Unesite URL za link:',
+    buttonTips : {
+      bold : {
+        title: 'Podebljano (Ctrl+B)',
+        text: 'Podebljavanje oznaÄenog teksta.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kurziv (Ctrl+I)',
+        text: 'Pretvaranje oznaÄenog tekst u kurziv',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Podcrtano (Ctrl+U)',
+        text: 'Potcrtavanje oznaÄenog teksta',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'PoveÄanje teksta',
+        text: 'PoveÄavanje veliÄine fonta.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Smanjivanje teksta',
+        text: 'Smanjivanje veliÄine fonta.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Boja oznaÄenog teksta',
+        text: 'Promjena boje pozadine oznaÄenog teksta.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Boja fonta',
+        text: 'Promjena boje oznaÄenog teksta.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Lijevo poravnanje teksta',
+        text: 'Poravnanje teksta na lijevu stranu.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centriranje teksta',
+        text: 'Centriranje teksta u ureÄivaÄu teksta.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Desno poravnanje teksta',
+        text: 'Poravnanje teksta na desnu stranu.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'OznaÄena lista',
+        text: 'ZapoÄinjanje oznaÄene liste.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numerirana lista',
+        text: 'ZapoÄinjanje numerirane liste.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hiperveza',
+        text: 'Stvaranje hiperveze od oznaÄenog teksta.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'UreÄivanje izvornog koda',
+        text: 'Prebacivanje u naÄin rada za ureÄivanje izvornog koda.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Sortiraj rastuÄim redoslijedom",
+      sortDescText : "Sortiraj padajuÄim redoslijedom",
+      lockText     : "ZakljuÄaj stupac",
+      unlockText   : "OtkljuÄaj stupac",
+      columnsText  : "Stupci"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(NiÅ¡ta)',
+    groupByText    : 'Grupiranje po ovom polju',
+    showGroupsText : 'Prikaz u grupama'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Naziv",
+      valueText  : "Vrijednost",
+      dateFormat : "d.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Povuci za promjenu veliÄine.",
+      collapsibleSplitTip : "Povuci za promjenu veliÄine. Dvostruki klik za skrivanje."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-nl.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-nl.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-nl.js	(revision 76)
@@ -0,0 +1,324 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * Dutch Translations
+ * by Ido Sebastiaan Bas van Oostveen (12 Oct 2007)
+ * updated to 2.2 by Condor (8 Aug 2008)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Bezig met laden...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = '';
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = '{0} geselecteerde rij(en)';
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = 'Bezig met laden...';
+}
+
+Date.monthNames = [
+  'januari',
+  'februari',
+  'maart',
+  'april',
+  'mei',
+  'juni',
+  'juli',
+  'augustus',
+  'september',
+  'oktober',
+  'november',
+  'december'
+];
+
+Date.getShortMonthName = function(month) {
+  if (month == 2) {
+    return 'mrt';
+  }
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  jan: 0,
+  feb: 1,
+  mrt: 2,
+  apr: 3,
+  mei: 4,
+  jun: 5,
+  jul: 6,
+  aug: 7,
+  sep: 8,
+  okt: 9,
+  nov: 10,
+  dec: 11
+};
+
+Date.getMonthNumber = function(name) {
+  var sname = name.substring(0, 3).toLowerCase();
+  if (sname == 'maa') {
+    return 2;
+  }
+  return Date.monthNumbers[sname];
+};
+
+Date.dayNames = [
+  'zondag',
+  'maandag',
+  'dinsdag',
+  'woensdag',
+  'donderdag',
+  'vrijdag',
+  'zaterdag'
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:ste|e)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok: 'OK',
+    cancel: 'Annuleren',
+    yes: 'Ja',
+    no: 'Nee'
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if (!v) return '';
+    if (!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || 'j-m-y');
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText: 'Vandaag',
+    minText: 'Deze datum is eerder dan de minimale datum',
+    maxText: 'Deze datum is later dan de maximale datum',
+    disabledDaysText: '',
+    disabledDatesText: '',
+    monthNames: Date.monthNames,
+    dayNames: Date.dayNames,
+    nextText: 'Volgende maand (Ctrl+rechts)',
+    prevText: 'Vorige maand (Ctrl+links)',
+    monthYearText: 'Kies een maand (Ctrl+omhoog/omlaag volgend/vorig jaar)',
+    todayTip: '{0} (spatie)',
+    format: 'j-m-y',
+    okText: '&#160;OK&#160;',
+    cancelText: 'Annuleren',
+    startDay: 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText: 'Pagina',
+    afterPageText: 'van {0}',
+    firstText: 'Eerste pagina',
+    prevText: 'Vorige pagina',
+    nextText: 'Volgende pagina',
+    lastText: 'Laatste pagina',
+    refreshText: 'Ververs',
+    displayMsg: 'Getoond {0} - {1} van {2}',
+    emptyMsg: 'Geen gegevens om weer te geven'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = 'De waarde van dit veld is ongeldig';
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText: 'De minimale lengte van dit veld is {0}',
+    maxLengthText: 'De maximale lengte van dit veld is {0}',
+    blankText: 'Dit veld is verplicht',
+    regexText: '',
+    emptyText: null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ",",
+    decimalPrecision : 2,
+    minText: 'De minimale waarde van dit veld is {0}',
+    maxText: 'De maximale waarde van dit veld is {0}',
+    nanText: '{0} is geen geldig getal'
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText: 'Uitgeschakeld',
+    disabledDatesText: 'Uitgeschakeld',
+    minText: 'De datum in dit veld moet na {0} liggen',
+    maxText: 'De datum in dit veld moet voor {0} liggen',
+    invalidText: '{0} is geen geldige datum - formaat voor datum is {1}',
+    format: 'j-m-y',
+    altFormats: 'd/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d',
+    startDay: 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText: 'Bezig met laden...',
+    valueNotFoundText: undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText: 'Dit veld moet een e-mail adres bevatten in het formaat "gebruiker@domein.nl"',
+    urlText: 'Dit veld moet een URL bevatten in het formaat "http:/'+'/www.domein.nl"',
+    alphaText: 'Dit veld mag alleen letters en _ bevatten',
+    alphanumText: 'Dit veld mag alleen letters, cijfers en _ bevatten'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText: 'Vul hier de URL voor de hyperlink in:',
+    buttonTips: {
+      bold: {
+        title: 'Vet (Ctrl+B)',
+        text: 'Maak de geselecteerde tekst vet.',
+        cls: 'x-html-editor-tip'
+      },
+      italic: {
+        title: 'Cursief (Ctrl+I)',
+        text: 'Maak de geselecteerde tekst cursief.',
+        cls: 'x-html-editor-tip'
+      },
+      underline: {
+        title: 'Onderstrepen (Ctrl+U)',
+        text: 'Onderstreep de geselecteerde tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize: {
+        title: 'Tekst vergroten',
+        text: 'Vergroot het lettertype.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize: {
+        title: 'Tekst verkleinen',
+        text: 'Verklein het lettertype.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor: {
+        title: 'Tekst achtergrondkleur',
+        text: 'Verander de achtergrondkleur van de geselecteerde tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor: {
+        title: 'Tekst kleur',
+        text: 'Verander de kleur van de geselecteerde tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft: {
+        title: 'Tekst links uitlijnen',
+        text: 'Lijn de tekst links uit.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter: {
+        title: 'Tekst centreren',
+        text: 'Centreer de tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright: {
+        title: 'Tekst rechts uitlijnen',
+        text: 'Lijn de tekst rechts uit.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist: {
+        title: 'Opsommingstekens',
+        text: 'Begin een ongenummerde lijst.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist: {
+        title: 'Genummerde lijst',
+        text: 'Begin een genummerde lijst.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink: {
+        title: 'Hyperlink',
+        text: 'Maak van de geselecteerde tekst een hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit: {
+        title: 'Bron aanpassen',
+        text: 'Schakel modus over naar bron aanpassen.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText: 'Sorteer oplopend',
+    sortDescText: 'Sorteer aflopend',
+    columnsText: 'Kolommen'
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+  emptyGroupText: '(Geen)',
+  groupByText: 'Dit veld groeperen',
+  showGroupsText: 'Toon in groepen'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText: 'Naam',
+    valueText: 'Waarde',
+    dateFormat: 'j-m-Y'
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip: 'Sleep om grootte aan te passen.',
+    collapsibleSplitTip: 'Sleep om grootte aan te passen. Dubbel klikken om te verbergen.'
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText: 'De tijd in dit veld moet op of na {0} liggen',
+    maxText: 'De tijd in dit veld moet op of voor {0} liggen',
+    invalidText: '{0} is geen geldig tijdstip',
+    format: 'G:i',
+    altFormats: 'g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H'
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : 'Selecteer minimaal een element in deze groep'
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : 'Selecteer een element in deze groep'
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr_CA.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr_CA.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fr_CA.js	(revision 76)
@@ -0,0 +1,218 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/*
+ * France (Canadian) translation
+ * By BernardChhun
+ * 04-08-2007, 03:07 AM
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">En cours de chargement...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} ligne(s) sÃ©lectionnÃ©(s)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Fermer cette onglet";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "La valeur de ce champ est invalide";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "En cours de chargement...";
+}
+
+Date.shortMonthNames = [
+   "Janv",
+   "FÃ©vr",
+   "Mars",
+   "Avr",
+   "Mai",
+   "Juin",
+   "Juil",
+   "AoÃ»t",
+   "Sept",
+   "Oct",
+   "Nov",
+   "DÃ©c"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.shortMonthNames[month];
+};
+
+Date.monthNames = [
+   "Janvier",
+   "FÃ©vrier",
+   "Mars",
+   "Avril",
+   "Mai",
+   "Juin",
+   "Juillet",
+   "AoÃ»t",
+   "Septembre",
+   "Octobre",
+   "Novembre",
+   "DÃ©cembre"
+];
+
+Date.monthNumbers = {
+  "Janvier" : 0,
+  "FÃ©vrier" : 1,
+  "Mars" : 2,
+  "Avril" : 3,
+  "Mai" : 4,
+  "Juin" : 5,
+  "Juillet" : 6,
+  "AoÃ»t" : 7,
+  "Septembre" : 8,
+  "Octobre" : 9,
+  "Novembre" : 10,
+  "DÃ©cembre" : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[Ext.util.Format.capitalize(name)];
+};
+
+Date.dayNames = [
+   "Dimanche",
+   "Lundi",
+   "Mardi",
+   "Mercredi",
+   "Jeudi",
+   "Vendredi",
+   "Samedi"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Annuler",
+      yes    : "Oui",
+      no     : "Non"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Aujourd'hui",
+      minText           : "Cette date est plus petite que la date minimum",
+      maxText           : "Cette date est plus grande que la date maximum",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'Prochain mois (CTRL+FlÃ©che droite)',
+      prevText          : 'Mois prÃ©cÃ©dent (CTRL+FlÃ©che gauche)',
+      monthYearText     : 'Choissisez un mois (CTRL+FlÃ©che haut ou bas pour changer d\'annÃ©e.)',
+      todayTip          : "{0} (Barre d'espace)",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Page",
+      afterPageText  : "de {0}",
+      firstText      : "PremiÃšre page",
+      prevText       : "Page prÃ©cÃ©dente",
+      nextText       : "Prochaine page",
+      lastText       : "DerniÃšre page",
+      refreshText    : "Recharger la page",
+      displayMsg     : "Page courante {0} - {1} de {2}",
+      emptyMsg       : 'Aucune donnÃ©e Ã  afficher'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "La longueur minimum de ce champ est de {0} caractÃšres",
+      maxLengthText : "La longueur maximum de ce champ est de {0} caractÃšres",
+      blankText     : "Ce champ est obligatoire",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "La valeur minimum de ce champ doit Ãªtre de {0}",
+      maxText : "La valeur maximum de ce champ doit Ãªtre de {0}",
+      nanText : "{0} n'est pas un nombre valide"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "DÃ©sactivÃ©",
+      disabledDatesText : "DÃ©sactivÃ©",
+      minText           : "La date de ce champ doit Ãªtre avant le {0}",
+      maxText           : "La date de ce champ doit Ãªtre aprÃšs le {0}",
+      invalidText       : "{0} n'est pas une date valide - il doit Ãªtre au format suivant: {1}",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "En cours de chargement...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Ce champ doit contenir un courriel et doit Ãªtre sous ce format: "usager@example.com"',
+      urlText      : 'Ce champ doit contenir une URL sous le format suivant: "http:/'+'/www.example.com"',
+      alphaText    : 'Ce champ ne peut contenir que des lettres et le caractÃšre soulignÃ© (_)',
+      alphanumText : 'Ce champ ne peut contenir que des caractÃšres alphanumÃ©riques ainsi que le caractÃšre soulignÃ© (_)'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Tri ascendant",
+      sortDescText : "Tri descendant",
+      lockText     : "VerrouillÃ© la colonne",
+      unlockText   : "DÃ©verrouillÃ© la colonne",
+      columnsText  : "Colonnes"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "PropriÃ©tÃ©",
+      valueText  : "Valeur",
+      dateFormat : "d/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Cliquer et glisser pour redimensionner le panneau.",
+      collapsibleSplitTip : "Cliquer et glisser pour redimensionner le panneau. Double-cliquer pour cacher le panneau."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en_GB.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en_GB.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-en_GB.js	(revision 76)
@@ -0,0 +1,322 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * English (UK) Translations
+ * updated to 2.2 by Condor (8 Aug 2008)
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Loading...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} selected row{1}";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Loading...";
+}
+
+Date.monthNames = [
+  "January",
+  "February",
+  "March",
+  "April",
+  "May",
+  "June",
+  "July",
+  "August",
+  "September",
+  "October",
+  "November",
+  "December"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Sunday",
+  "Monday",
+  "Tuesday",
+  "Wednesday",
+  "Thursday",
+  "Friday",
+  "Saturday"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:st|nd|rd|th)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Cancel",
+    yes    : "Yes",
+    no     : "No"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Today",
+    minText           : "This date is before the minimum date",
+    maxText           : "This date is after the maximum date",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Next Month (Control+Right)',
+    prevText          : 'Previous Month (Control+Left)',
+    monthYearText     : 'Choose a month (Control+Up/Down to move years)',
+    todayTip          : "{0} (Spacebar)",
+    format            : "d/m/Y",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Cancel",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Page",
+    afterPageText  : "of {0}",
+    firstText      : "First Page",
+    prevText       : "Previous Page",
+    nextText       : "Next Page",
+    lastText       : "Last Page",
+    refreshText    : "Refresh",
+    displayMsg     : "Displaying {0} - {1} of {2}",
+    emptyMsg       : 'No data to display'
+  });
+}
+
+if(Ext.form.BasicForm){
+    Ext.form.BasicForm.prototype.waitTitle = "Please Wait..."
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "The value in this field is invalid";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "The minimum length for this field is {0}",
+    maxLengthText : "The maximum length for this field is {0}",
+    blankText     : "This field is required",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ".",
+    decimalPrecision : 2,
+    minText : "The minimum value for this field is {0}",
+    maxText : "The maximum value for this field is {0}",
+    nanText : "{0} is not a valid number"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Disabled",
+    disabledDatesText : "Disabled",
+    minText           : "The date in this field must be after {0}",
+    maxText           : "The date in this field must be before {0}",
+    invalidText       : "{0} is not a valid date - it must be in the format {1}",
+    format            : "d/m/y",
+    altFormats        : "d/m/Y|d/m/y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Loading...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'This field should be an e-mail address in the format "user@example.com"',
+    urlText      : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+    alphaText    : 'This field should only contain letters and _',
+    alphanumText : 'This field should only contain letters, numbers and _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Please enter the URL for the link:',
+    buttonTips : {
+      bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Underline (Ctrl+U)',
+        text: 'Underline the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Grow Text',
+        text: 'Increase the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Shrink Text',
+        text: 'Decrease the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Text Highlight Color',
+        text: 'Change the background color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Font Color',
+        text: 'Change the color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Align Text Left',
+        text: 'Align text to the left.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Center Text',
+        text: 'Center text in the editor.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Align Text Right',
+        text: 'Align text to the right.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Bullet List',
+        text: 'Start a bulleted list.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numbered List',
+        text: 'Start a numbered list.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Make the selected text a hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Source Edit',
+        text: 'Switch to source editing mode.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Sort Ascending",
+    sortDescText : "Sort Descending",
+    columnsText  : "Columns"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(None)',
+    groupByText    : 'Group By This Field',
+    showGroupsText : 'Show in Groups'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Name",
+    valueText  : "Value",
+    dateFormat : "j/m/Y",
+    trueText: "true",
+    falseText: "false"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Drag to resize.",
+    collapsibleSplitTip : "Drag to resize. Double click to hide."
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "The time in this field must be equal to or after {0}",
+    maxText : "The time in this field must be equal to or before {0}",
+    invalidText : "{0} is not a valid time",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "You must select at least one item in this group"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "You must select one item in this group"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pl.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pl.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pl.js	(revision 76)
@@ -0,0 +1,319 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Polish Translations
+ * By vbert 17-April-2007
+ * Updated by mmar 16-November-2007
+ * Encoding: utf-8
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Wczytywanie danych...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} wybrano wiersze(y)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Zamknij zakÅadkÄ";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "WartoÅÄ tego pola jest niewÅaÅciwa";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Wczytywanie danych...";
+}
+
+Date.monthNames = [
+    "StyczeÅ",
+    "Luty",
+    "Marzec",
+    "KwiecieÅ",
+    "Maj",
+    "Czerwiec",
+    "Lipiec",
+    "SierpieÅ",
+    "WrzesieÅ",
+    "PaÅºdziernik",
+    "Listopad",
+    "GrudzieÅ"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Sty : 0,
+  Lut : 1,
+  Mar : 2,
+  Kwi : 3,
+  Maj : 4,
+  Cze : 5,
+  Lip : 6,
+  Sie : 7,
+  Wrz : 8,
+  PaÅº : 9,
+  Lis : 10,
+  Gru : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+    "Niedziela",
+    "PoniedziaÅek",
+    "Wtorek",
+    "Åroda",
+    "Czwartek",
+    "PiÄ
+tek",
+    "Sobota"
+];
+
+Date.getShortDayName = function(day) {
+	switch(day) {
+		case 0: return 'ndz';
+		case 1: return 'pon';
+		case 2: return 'wt';
+		case 3: return 'År';
+		case 4: return 'czw';
+		case 5: return 'pt';				
+		case 6: return 'sob';
+                default: return '';
+	}
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Anuluj",
+      yes    : "Tak",
+      no     : "Nie"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "Y-m-d");
+   };
+}
+
+if(Ext.DatePicker){
+	Ext.apply(Ext.DatePicker.prototype, {
+		todayText			: "Dzisiaj",
+		minText				: "Data jest wczeÅniejsza od daty minimalnej",
+		maxText				: "Data jest pÃ³Åºniejsza od daty maksymalnej",
+		disabledDaysText	: "",
+		disabledDatesText	: "",
+		monthNames			: Date.monthNames,
+		dayNames			: Date.dayNames,
+		nextText			: "NastÄpny miesiÄ
+c (Control+StrzaÅkaWPrawo)",
+		prevText			: "Poprzedni miesiÄ
+c (Control+StrzaÅkaWLewo)",
+		monthYearText		: "Wybierz miesiÄ
+c (Control+Up/Down aby zmieniÄ rok)",
+		todayTip			: "{0} (Spacja)",
+		format				: "Y-m-d",
+		okText            	: "&#160;OK&#160;",
+    	cancelText        	: "Anuluj",
+    	startDay          	: 1
+	});
+}
+
+if(Ext.PagingToolbar){
+	Ext.apply(Ext.PagingToolbar.prototype, {
+		beforePageText	: "Strona",
+		afterPageText	: "z {0}",
+		firstText		: "Pierwsza strona",
+	    prevText		: "Poprzednia strona",
+		nextText		: "NastÄpna strona",
+	    lastText		: "Ostatnia strona",
+		refreshText		: "OdÅwieÅŒ",
+	    displayMsg		: "WyÅwietlono {0} - {1} z {2}",
+		emptyMsg		: "Brak danych do wyÅwietlenia"
+	});
+}
+
+if(Ext.form.TextField){
+	Ext.apply(Ext.form.TextField.prototype, {
+	    minLengthText	: "Minimalna iloÅÄ znakÃ³w dla tego pola to {0}",
+		maxLengthText	: "Maksymalna iloÅÄ znakÃ³w dla tego pola to {0}",
+	    blankText		: "To pole jest wymagane",
+		regexText		: "",
+	    emptyText		: null
+	});
+}
+
+if(Ext.form.NumberField){
+	Ext.apply(Ext.form.NumberField.prototype, {
+	    minText	: "Minimalna wartoÅÄ dla tego pola to {0}",
+	    maxText	: "Maksymalna wartoÅÄ dla tego pola to {0}",
+		nanText	: "{0} to nie jest wÅaÅciwa wartoÅÄ"
+	});
+}
+
+if(Ext.form.DateField){
+	Ext.apply(Ext.form.DateField.prototype, {
+	    disabledDaysText	: "WyÅÄ
+czony",
+	    disabledDatesText	: "WyÅÄ
+czony",
+		minText				: "Data w tym polu musi byÄ pÃ³Åºniejsza od {0}",
+	    maxText				: "Data w tym polu musi byÄ wczeÅniejsza od {0}",
+		invalidText			: "{0} to nie jest prawidÅowa data - prawidÅowy format daty {1}",
+	    format				: "Y-m-d",
+    	altFormats    	    : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    	startDay            : 1
+	});
+}
+
+if(Ext.form.ComboBox){
+	Ext.apply(Ext.form.ComboBox.prototype, {
+		loadingText       : "WczytujÄ...",
+		valueNotFoundText : undefined
+	});
+}
+
+if(Ext.form.VTypes){
+	Ext.apply(Ext.form.VTypes, {
+	    emailText		: 'To pole wymaga podania adresu e-mail w formacie: "nazwa@domena.pl"',
+	    urlText			: 'To pole wymaga podania adresu strony www w formacie: "http:/'+'/www.domena.pl"',
+		alphaText		: 'To pole wymaga podania tylko liter i _',
+		alphanumText	: 'To pole wymaga podania tylko liter, cyfr i _'
+	});
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'WprowadÅº adres URL strony:',
+    buttonTips : {
+      bold : {
+        title: 'Pogrubienie (Ctrl+B)',
+        text: 'Ustaw styl zaznaczonego tekstu na pogrubiony.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursywa (Ctrl+I)',
+        text: 'Ustaw styl zaznaczonego tekstu na kursywÄ.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'PodkreÅlenie (Ctrl+U)',
+        text: 'PodkreÅl zaznaczony tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ZwiÄksz czcionkÄ',
+        text: 'ZwiÄksz rozmiar czcionki.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Zmniejsz czcionkÄ',
+        text: 'Zmniejsz rozmiar czcionki.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'WyrÃ³ÅŒnienie',
+        text: 'ZmieÅ kolor wyrÃ³ÅŒnienia zaznaczonego tekstu.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Kolor czcionki',
+        text: 'ZmieÅ kolor zaznaczonego tekstu.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Do lewej',
+        text: 'WyrÃ³wnaj tekst do lewej.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'WyÅrodkuj',
+        text: 'WyrÃ³wnaj tekst do Årodka.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Do prawej',
+        text: 'WyrÃ³wnaj tekst do prawej.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Lista wypunktowana',
+        text: 'Rozpocznij listÄ wypunktowanÄ
+.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Lista numerowana',
+        text: 'Rozpocznij listÄ numerowanÄ
+.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'HiperÅÄ
+cze',
+        text: 'PrzeksztaÅÄ zaznaczony tekst w hiperÅÄ
+cze.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Edycja ÅºrÃ³dÅa',
+        text: 'PrzeÅÄ
+cz w tryb edycji ÅºrÃ³dÅa.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+	Ext.apply(Ext.grid.GridView.prototype, {
+	    sortAscText		: "Sortuj rosnÄ
+co",
+	    sortDescText	: "Sortuj malejÄ
+co",
+		lockText		: "Zablokuj kolumnÄ",
+	    unlockText		: "Odblokuj kolumnÄ",
+		columnsText		: "Kolumny"
+	});
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(None)',
+    groupByText    : 'Grupuj po tym polu',
+    showGroupsText : 'PokaÅŒ w grupach'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+	Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+	    nameText	: "Nazwa",
+	    valueText	: "WartoÅÄ",
+		dateFormat	: "Y-m-d"
+	});
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+	Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+	    splitTip			: "PrzeciÄ
+gnij aby zmieniÄ rozmiar.",
+		collapsibleSplitTip	: "PrzeciÄ
+gnij aby zmieniÄ rozmiar. Kliknij dwukrotnie aby ukryÄ."
+	});
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-th.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-th.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-th.js	(revision 76)
@@ -0,0 +1,311 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by KillerNay on the extjs.com forums.
+ * Thank you KillerNay!
+ *
+ * Thailand Translations
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Â¡ÃÃ
+ÃÂ§Ã¢ÃÃ
+Åœ...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} Ã Ã
+ÃÃÂ¡Ã¡Ã
+Ã©ÃÂ·ÃÃ©Â§ÃÃÅœÃ¡Â¶Ã";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Â»ÃÅœÃ¡Â·Ã§ÂºÂ¹ÃÃ©";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "â¬ÃšÃÂ¢ÃÂ§ÂªÃšÃÂ§Â¹ÃÃ©Ã€ÃÃšÂ¶ÃÂ¡ÂµÃ©ÃÂ§";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Â¡ÃÃ
+ÃÂ§Ã¢ÃÃ
+Åœ...";
+}
+
+Date.monthNames = [
+  "ÃÂ¡ÃÃâ¬Ã",
+  "Â¡ÃÃÅžÃÃÅžÃÂ¹ÅŸÃ¬",
+  "ÃÃÂ¹Ãâ¬Ã",
+  "Ã ÃÃÃÃÂ¹",
+  "ÅžÃÃÃÃâ¬Ã",
+  "ÃÃÂ¶ÃÂ¹ÃÃÂ¹",
+  "Â¡ÃÂ¡Â¯Ãâ¬Ã",
+  "ÃÃÂ§ÃÃâ¬Ã",
+  "Â¡ÃÂ¹ÃÃÃÂ¹",
+  "ÂµÃÃ
+Ãâ¬Ã",
+  "ÅžÃÃÅ¡ÃÂ¡ÃÃÂ¹",
+  "ÅŸÃÂ¹ÃÃâ¬Ã"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  "Ãâ¬" : 0,
+  "Â¡Åž" : 1,
+  "ÃÃâ¬" : 2,
+  "Ã ÃÃ" : 3,
+  "Åžâ¬" : 4,
+  "ÃÃÃ" : 5,
+  "Â¡â¬" : 6,
+  "Ãâ¬" : 7,
+  "Â¡Ã" : 8,
+  "Âµâ¬" : 9,
+  "ÅžÃ" : 10,
+  "ÅŸâ¬" : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "ÃÃÂ·ÃÂµÃÃ¬",
+  "Å¡ÃÂ¹Â·ÃÃ¬",
+  "ÃÃÂ§â¬ÃÃ",
+  "ÅžÃÃÅŸ",
+  "ÅžÃÃÃÃÂºÅœÃ",
+  "ÃÃÂ¡ÃÃ¬",
+  "Ã ÃÃÃÃ¬"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "ÂµÂ¡Ã
+Â§",
+    cancel : "ÃÂ¡Ã Ã
+ÃÂ¡",
+    yes    : "Ã£ÂªÃš",
+    no     : "Ã€ÃÃšÃ£ÂªÃš"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "m/d/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "ÃÃÂ¹Â¹ÃÃ©",
+    minText           : "This date is before the minimum date",
+    maxText           : "This date is after the maximum date",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Ã ÅœÃÃÂ¹Â¶ÃÅœÃ€Â» (Control+Right)',
+    prevText          : 'Ã ÅœÃÃÂ¹Â¡ÃšÃÂ¹ÃÂ¹Ã©Ã (Control+Left)',
+    monthYearText     : 'Ã Ã
+ÃÃÂ¡Ã ÅœÃÃÂ¹ (Control+Up/Down to move years)',
+    todayTip          : "{0} (Spacebar)",
+    format            : "m/d/y",
+    okText            : "&#160;ÂµÂ¡Ã
+Â§&#160;",
+    cancelText        : "ÃÂ¡Ã Ã
+ÃÂ¡",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "ÃÂ¹Ã©Ã",
+    afterPageText  : "of {0}",
+    firstText      : "ÃÂ¹Ã©ÃÃ¡ÃÂ¡",
+    prevText       : "Â¡ÃšÃÂ¹ÃÂ¹Ã©Ã",
+    nextText       : "Â¶ÃÅœÃ€Â»",
+    lastText       : "ÃÂ¹Ã©ÃÃÃÅœÂ·Ã©ÃÃ",
+    refreshText    : "ÃÃÃ Â¿ÃÂª",
+    displayMsg     : "Â¡ÃÃ
+ÃÂ§Ã¡ÃÅœÂ§ {0} - {1} Å¡ÃÂ¡ {2}",
+    emptyMsg       : 'Ã€ÃÃšÃÃÂ¢Ã©ÃÃÃÃ
+Ã¡ÃÅœÂ§'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "The minimum length for this field is {0}",
+    maxLengthText : "The maximum length for this field is {0}",
+    blankText     : "This field is required",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "The minimum value for this field is {0}",
+    maxText : "The maximum value for this field is {0}",
+    nanText : "{0} is not a valid number"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Â»ÃÅœ",
+    disabledDatesText : "Â»ÃÅœ",
+    minText           : "The date in this field must be after {0}",
+    maxText           : "The date in this field must be before {0}",
+    invalidText       : "{0} is not a valid date - it must be in the format {1}",
+    format            : "m/d/y",
+    altFormats        : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Â¡ÃÃ
+ÃÂ§Ã¢ÃÃ
+Åœ...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'This field should be an e-mail address in the format "user@example.com"',
+    urlText      : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+    alphaText    : 'This field should only contain letters and _',
+    alphanumText : 'This field should only contain letters, numbers and _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Please enter the URL for the link:',
+    buttonTips : {
+      bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Underline (Ctrl+U)',
+        text: 'Underline the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Grow Text',
+        text: 'Increase the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Shrink Text',
+        text: 'Decrease the font size.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Text Highlight Color',
+        text: 'Change the background color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Font Color',
+        text: 'Change the color of the selected text.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Align Text Left',
+        text: 'Align text to the left.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Center Text',
+        text: 'Center text in the editor.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Align Text Right',
+        text: 'Align text to the right.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Bullet List',
+        text: 'Start a bulleted list.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numbered List',
+        text: 'Start a numbered list.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Make the selected text a hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Source Edit',
+        text: 'Switch to source editing mode.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Sort Ascending",
+    sortDescText : "Sort Descending",
+    lockText     : "Lock Column",
+    unlockText   : "Unlock Column",
+    columnsText  : "Columns"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(None)',
+    groupByText    : 'Group By This Field',
+    showGroupsText : 'Show in Groups'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Name",
+    valueText  : "Value",
+    dateFormat : "m/j/Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Drag to resize.",
+    collapsibleSplitTip : "Drag to resize. Double click to hide."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-it.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-it.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-it.js	(revision 76)
@@ -0,0 +1,298 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Italian translation
+ * By eric_void
+ * 04-10-2007, 11:25 AM
+ * Updated by Federico Grilli 21/12/2007 
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Caricamento in corso...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} righe selezionate";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Chiudi pannello";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Valore non valido";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Caricamento in corso...";
+}
+
+Date.monthNames = [
+   "Gennaio",
+   "Febbraio",
+   "Marzo",
+   "Aprile",
+   "Maggio",
+   "Giugno",
+   "Luglio",
+   "Agosto",
+   "Settembre",
+   "Ottobre",
+   "Novembre",
+   "Dicembre"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Gen : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  Mag : 4,
+  Giu : 5,
+  Lug : 6,
+  Ago : 7,
+  Set : 8,
+  Ott : 9,
+  Nov : 10,
+  Dic : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "Domenica",
+   "Luned\u00EC",
+   "Marted\u00EC",
+   "Mercoled\u00EC",
+   "Gioved\u00EC",
+   "Venerd\u00EC",
+   "Sabato"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Annulla",
+      yes    : "S\u00EC",
+      no     : "No"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Oggi",
+      minText           : "Data precedente alla data minima",
+      maxText           : "Data successiva alla data massima",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'Mese successivo (Ctrl+Destra)',
+      prevText          : 'Mese precedente (Ctrl+Sinistra)',
+      monthYearText     : 'Scegli un mese (Ctrl+Su/Giu per cambiare anno)',
+      todayTip          : "{0} (Barra spaziatrice)",
+      format            : "d/m/y",
+      cancelText        : "Annulla",
+      okText            : "&#160;OK&#160;",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Pagina",
+      afterPageText  : "di {0}",
+      firstText      : "Prima pagina",
+      prevText       : "Pagina precedente",
+      nextText       : "Pagina successiva",
+      lastText       : "Ultima pagina",
+      refreshText    : "Aggiorna",
+      displayMsg     : "Record {0} - {1} di {2}",
+      emptyMsg       : 'Nessun dato da mostrare'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "La lunghezza minima \u00E8 {0}",
+      maxLengthText : "La lunghezza massima \u00E8 {0}",
+      blankText     : "Campo obbligatorio",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      decimalSeparator : ",",
+      decimalPrecision : 2,
+      minText : "Il valore minimo \u00E8 {0}",
+      maxText : "Il valore massimo \u00E8 {0}",
+      nanText : "{0} non \u00E8 un valore numerico corretto"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Disabilitato",
+      disabledDatesText : "Disabilitato",
+      minText           : "La data deve essere successiva al {0}",
+      maxText           : "La data deve essere precedente al {0}",
+      invalidText       : "{0} non \u00E8 una data valida. Deve essere nel formato {1}",
+      format            : "d/m/y",
+      altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Caricamento in corso...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Il campo deve essere un indirizzo e-mail nel formato "user@example.com"',
+      urlText      : 'Il campo deve essere un indirizzo web nel formato "http:/'+'/www.example.com"',
+      alphaText    : 'Il campo deve contenere solo lettere e _',
+      alphanumText : 'Il campo deve contenere solo lettere, numeri e _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Inserire un URL per il link:',
+    buttonTips : {
+      bold : {
+        title: 'Grassetto (Ctrl+B)',
+        text: 'Rende il testo selezionato in grassetto.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Corsivo (Ctrl+I)',
+        text: 'Rende il testo selezionato in corsivo.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Sottolinea (Ctrl+U)',
+        text: 'Sottolinea il testo selezionato.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Ingrandisci testo',
+        text: 'Aumenta la dimensione del carattere.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Rimpicciolisci testo',
+        text: 'Diminuisce la dimensione del carattere.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Colore evidenziatore testo',
+        text: 'Modifica il colore di sfondo del testo selezionato.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Colore carattere',
+        text: 'Modifica il colore del testo selezionato.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Allinea a sinistra',
+        text: 'Allinea il testo a sinistra.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centra',
+        text: 'Centra il testo.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Allinea a destra',
+        text: 'Allinea il testo a destra.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Elenco puntato',
+        text: 'Elenco puntato.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Elenco numerato',
+        text: 'Elenco numerato.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Collegamento',
+        text: 'Trasforma il testo selezionato in un collegamanto.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Sorgente',
+        text: 'Passa alla modalit\u00E0 editing del sorgente.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ordinamento crescente",
+      sortDescText : "Ordinamento decrescente",
+      lockText     : "Blocca colonna",
+      unlockText   : "Sblocca colonna",
+      columnsText  : "Colonne"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Nessun dato)',
+    groupByText    : 'Raggruppa per questo campo',
+    showGroupsText : 'Mostra nei gruppi'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Nome",
+      valueText  : "Valore",
+      dateFormat : "j/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Trascina per cambiare dimensioni.",
+      collapsibleSplitTip : "Trascina per cambiare dimensioni. Doppio click per nascondere."
+   });
+}
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sl.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sl.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sl.js	(revision 76)
@@ -0,0 +1,177 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Slovenian translation by MatjaÅŸ (UTF-8 encoding)
+ * 25 April 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Nalagam...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} izbranih vrstic";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Zapri zavihek";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Neveljavna vrednost";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Nalagam...";
+}
+
+Date.monthNames = [
+   "Januar",
+   "Februar",
+   "Marec",
+   "April",
+   "Maj",
+   "Junij",
+   "Julij",
+   "Avgust",
+   "September",
+   "Oktober",
+   "November",
+   "December"
+];
+
+Date.dayNames = [
+   "Nedelja",
+   "Ponedeljek",
+   "Torek",
+   "Sreda",
+   "Äetrtek",
+   "Petek",
+   "Sobota"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "V redu",
+      cancel : "PrekliÄi",
+      yes    : "Da",
+      no     : "Ne"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Danes",
+      minText           : "Navedeni datum je pred spodnjim datumom",
+      maxText           : "Navedeni datum je za zgornjim datumom",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'Naslednji mesec (Control+Desno)',
+      prevText          : 'PrejÅ¡nji mesec (Control+Levo)',
+      monthYearText     : 'Izberite mesec (Control+Gor/Dol za premik let)',
+      todayTip          : "{0} (Preslednica)",
+      format            : "d.m.y",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Stran",
+      afterPageText  : "od {0}",
+      firstText      : "Prva stran",
+      prevText       : "PrejÅ¡nja stran",
+      nextText       : "Naslednja stran",
+      lastText       : "Zadnja stran",
+      refreshText    : "OsveÅŸi",
+      displayMsg     : "Prikazujem {0} - {1} od {2}",
+      emptyMsg       : 'Ni podatkov za prikaz'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Minimalna dolÅŸina tega polja je {0}",
+      maxLengthText : "Maksimalna dolÅŸina tega polja je {0}",
+      blankText     : "To polje je obvezno",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Minimalna vrednost tega polja je {0}",
+      maxText : "Maksimalna vrednost tega polja je {0}",
+      nanText : "{0} ni veljavna Å¡tevilka"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "OnemogoÄen",
+      disabledDatesText : "OnemogoÄen",
+      minText           : "Datum mora biti po {0}",
+      maxText           : "Datum mora biti pred {0}",
+      invalidText       : "{0} ni veljaven datum - mora biti v tem formatu {1}",
+      format            : "d.m.y",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Nalagam...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'To polje je e-mail naslov formata "ime@domena.si"',
+      urlText      : 'To polje je URL naslov formata "http:/'+'/www.domena.si"',
+      alphaText    : 'To polje lahko vsebuje samo Ärke in _',
+      alphanumText : 'To polje lahko vsebuje samo Ärke, Å¡tevilke in _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Sortiraj naraÅ¡ÄajoÄe",
+      sortDescText : "Sortiraj padajoÄe",
+      lockText     : "Zakleni stolpec",
+      unlockText   : "Odkleni stolpec",
+      columnsText  : "Stolpci"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Ime",
+      valueText  : "Vrednost",
+      dateFormat : "j.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Potegni za razÅ¡iritev.",
+      collapsibleSplitTip : "Potegni za razÅ¡iritev. Dvojni klik, Äe ÅŸelite skriti."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lt.js	(revision 76)
@@ -0,0 +1,362 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Lithuanian Translations (UTF-8)
+ * Vladas Saulis (vladas at prodata dot lt),  03-29-2009
+ * Vladas Saulis (vladas at prodata dot lt),  10-18-2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Kraunasi...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} paÅŸymÄtÅ³ eiluÄiÅ³";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "UÅŸdaryti Å¡iÄ
+ uÅŸsklandÄ
+";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "Å io lauko reikÅ¡mÄ neteisinga";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Kraunasi...";
+}
+
+Date.monthNames = [
+  "Sausis",
+  "Vasaris",
+  "Kovas",
+  "Balandis",
+  "GeguÅŸÄ",
+  "BirÅŸelis",
+  "Liepa",
+  "RugpjÅ«tis",
+  "RugsÄjis",
+  "Spalis",
+  "Lapkritis",
+  "Gruodis"
+];
+
+Date.getShortMonthName = function(month) {
+    // Uncommons
+    if (month == 7) return "Rgp";
+    if (month == 8) return "Rgs";
+    if (month == 11) return "Grd";
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Sau : 0,
+  Vas : 1,
+  Kov : 2,
+  Bal : 3,
+  Geg : 4,
+  Bir : 5,
+  Lie : 6,
+  Rgp : 7,
+  Rgs : 8,
+  Spa : 9,
+  Lap : 10,
+  Grd : 11
+};
+
+Date.getMonthNumber = function(name) {
+
+    // Some uncommons
+    if (name == "RugpjÅ«tis") return 7;
+    if (name == "RugsÄjis") return 8;
+    if (name == "Gruodis") return 11;
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Sekmadienis",
+  "Pirmadienis",
+  "Antradienis",
+  "TreÄiadienis",
+  "Ketvirtadienis",
+  "Penktadienis",
+  "Å eÅ¡tadienis"
+];
+
+Date.parseCodes.S.s = "(?:as|as|as|as)";
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "Gerai",
+    cancel : "Atsisakyti",
+    yes    : "Taip",
+    no     : "Ne"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "Y-m-d");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Å iandien",
+    minText           : "Å i data yra maÅŸesnÄ uÅŸ leistinÄ
+",
+    maxText           : "Å i data yra didesnÄ uÅŸ leistinÄ
+",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Kitas mÄnuo (Control+Right)',
+    prevText          : 'Ankstesnis mÄnuo (Control+Left)',
+    monthYearText     : 'Pasirinkti mÄnesÄ¯ (Control+Up/Down perÄjimui tarp metÅ³)',
+    todayTip          : "{0} (Tarpas)",
+    format            : "y-m-d",
+    okText            : "&#160;Gerai&#160;",
+    cancelText        : "Atsisaktyi",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Puslapis",
+    afterPageText  : "iÅ¡ {0}",
+    firstText      : "Pirmas puslapis",
+    prevText       : "Ankstesnis pusl.",
+    nextText       : "Kitas puslapis",
+    lastText       : "Pakutinis pusl.",
+    refreshText    : "Atnaujinti",
+    displayMsg     : "Rodomi Ä¯raÅ¡ai {0} - {1} iÅ¡ {2}",
+    emptyMsg       : 'NÄra duomenÅ³'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "Minimalus Å¡io lauko ilgis yra {0}",
+    maxLengthText : "Maksimalus Å¡io lauko ilgis yra {0}",
+    blankText     : "Å is laukas yra privalomas",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "Minimalus Å¡io lauko ilgis yra {0}",
+    maxText : "Maksimalus Å¡io lauko ilgis yra {0}",
+    nanText : "{0} yra neleistina reikÅ¡mÄ"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Neprieinama",
+    disabledDatesText : "Neprieinama",
+    minText           : "Å iame lauke data turi bÅ«ti didesnÄ uÅŸ {0}",
+    maxText           : "Å iame lauke data turi bÅ«ti maÅŸesnÄÄ uÅŸ {0}",
+    invalidText       : "{0} yra neteisinga data - ji turi bÅ«ti Ä¯vesta formatu {1}",
+    format            : "y-m-d",
+    altFormats        : "y-m-d|y/m/d|Y-m-d|m/d|m-d|md|ymd|Ymd|d|Y-m-d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Kraunasi...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Å iame lauke turi bÅ«ti el.paÅ¡to adresas formatu "user@example.com"',
+    urlText      : 'Å iame lauke turi bÅ«ti nuoroda (URL) formatu "http:/'+'/www.example.com"',
+    alphaText    : 'Å iame lauke gali bÅ«ti tik raidÄs ir ÅŸenklas "_"',
+    alphanumText : 'Å iame lauke gali bÅ«ti tik raidÄs, skaiÄiai ir ÅŸenklas "_"'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Ä®veskite URL Å¡iai nuorodai:',
+    buttonTips : {
+      bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Teksto paryÅ¡kinimas.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Kursyvinis tekstas.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Underline (Ctrl+U)',
+        text: 'Teksto pabraukimas.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Padidinti Å¡riftÄ
+',
+        text: 'Padidinti Å¡rifto dydÄ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'SumaÅŸinti Å¡riftÄ
+',
+        text: 'SumaÅŸinti Å¡rifto dydÄ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Nuspalvinti teksto fonÄ
+',
+        text: 'Pakeisti teksto fono spalvÄ
+.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Teksto spalva',
+        text: 'Pakeisti paÅŸymÄto teksto spalvÄ
+.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'IÅ¡lyginti kairen',
+        text: 'IÅ¡lyginti tekstÄ
+ Ä¯ kairÄ.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centruoti tekstÄ
+',
+        text: 'Centruoti tektÄ
+ redaktoriaus lange.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'IÅ¡lyginti deÅ¡inÄn',
+        text: 'IÅ¡lyginti tekstÄ
+ Ä¯ deÅ¡inÄ.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Paprastas sÄ
+raÅ¡as',
+        text: 'PradÄti neorganizuotÄ
+ sÄ
+raÅ¡Ä
+.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Numeruotas sÄ
+raÅ¡as',
+        text: 'PradÄti numeruotÄ
+ sÄ
+raÅ¡Ä
+.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Nuoroda',
+        text: 'Padaryti paÅŸymÄta tekstÄ
+ nuoroda.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'IÅ¡eities tekstas',
+        text: 'Persijungti Ä¯ iÅ¡eities teksto koregavimo reÅŸimÄ
+.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.form.BasicForm){
+  Ext.form.BasicForm.prototype.waitTitle = "Palaukite...";
+}
+  
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "RÅ«Å¡iuoti didÄjanÄia tvarka",
+    sortDescText : "RÅ«Å¡iuoti maÅŸÄjanÄia tvarka",
+    lockText     : "UÅŸfiksuoti stulpelÄ¯",
+    unlockText   : "Atlaisvinti stulpelÄ¯",
+    columnsText  : "Stulpeliai"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(NÄra)',
+    groupByText    : 'Grupuoti pagal Å¡Ä¯ laukÄ
+',
+    showGroupsText : 'Rodyti grupÄse'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Pavadinimas",
+    valueText  : "ReikÅ¡mÄ",
+    dateFormat : "Y-m-d"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Patraukite juostelÄ.",
+    collapsibleSplitTip : "Patraukite juostelÄ arba Paspauskite dvigubai kad paslÄpti."
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "Laikas turi buti lygus arba vÄlesnis uÅŸ {0}",
+    maxText : "Laikas turi bÅ«ti lygus arba ankstesnis uÅŸ {0}",
+    invalidText : "{0} yra neteisingas laikas",
+    format : "H:i",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+			
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "JÅ«s turite padaryti bent vienÄ
+ pasirinkimÄ
+ Å¡ioje grupÄje"
+  });
+}
+	
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+      blankText : "JÅ«s turite padaryti bent vienÄ
+ pasirinkimÄ
+ Å¡ioje grupÄje"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sv_SE.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sv_SE.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sv_SE.js	(revision 76)
@@ -0,0 +1,179 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Swedish translation (utf8-encoding)
+ * By Erik Andersson, Monator Technologies
+ * 24 April 2007
+ * Changed by Cariad, 29 July 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Laddar...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} markerade rad(er)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "StÃ€ng denna flik";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "VÃ€rdet i detta fÃ€lt Ã€r inte tillÃ¥tet";
+}
+
+if(Ext.LoadMask){
+   Ext.LoadMask.prototype.msg = "Laddar...";
+}
+
+Date.monthNames = [
+   "januari",
+   "februari",
+   "mars",
+   "april",
+   "maj",
+   "juni",
+   "juli",
+   "augusti",
+   "september",
+   "oktober",
+   "november",
+   "december"
+];
+
+Date.dayNames = [
+   "sÃ¶ndag",
+   "mÃ¥ndag",
+   "tisdag",
+   "onsdag",
+   "torsdag",
+   "fredag",
+   "lÃ¶rdag"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Avbryt",
+      yes    : "Ja",
+      no     : "Nej"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "Y-m-d");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Idag",
+      minText           : "Detta datum intrÃ€ffar fÃ¶re det tidigast tillÃ¥tna",
+      maxText           : "Detta datum intrÃ€ffar efter det senast tillÃ¥tna",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'NÃ€sta mÃ¥nad (Ctrl + hÃ¶gerpil)',
+      prevText          : 'FÃ¶regÃ¥ende mÃ¥nad (Ctrl + vÃ€nsterpil)',
+      monthYearText     : 'VÃ€lj en mÃ¥nad (Ctrl + uppÃ¥tpil/nerÃ¥tpil fÃ¶r att Ã€ndra Ã¥rtal)',
+      todayTip          : "{0} (mellanslag)",
+      format            : "Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Sida",
+      afterPageText  : "av {0}",
+      firstText      : "FÃ¶rsta sidan",
+      prevText       : "FÃ¶regÃ¥ende sida",
+      nextText       : "NÃ€sta sida",
+      lastText       : "Sista sidan",
+      refreshText    : "Uppdatera",
+      displayMsg     : "Visar {0} - {1} av {2}",
+      emptyMsg       : 'Det finns ingen data att visa'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Minsta tillÃ¥tna lÃ€ngd fÃ¶r detta fÃ€lt Ã€r {0}",
+      maxLengthText : "StÃ¶rsta tillÃ¥tna lÃ€ngd fÃ¶r detta fÃ€lt Ã€r {0}",
+      blankText     : "Detta fÃ€lt Ã€r obligatoriskt",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Minsta tillÃ¥tna vÃ€rde fÃ¶r detta fÃ€lt Ã€r {0}",
+      maxText : "StÃ¶rsta tillÃ¥tna vÃ€rde fÃ¶r detta fÃ€lt Ã€r {0}",
+      nanText : "{0} Ã€r inte ett tillÃ¥tet nummer"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Inaktiverad",
+      disabledDatesText : "Inaktiverad",
+      minText           : "Datumet i detta fÃ€lt mÃ¥ste intrÃ€ffa efter {0}",
+      maxText           : "Datumet i detta fÃ€lt mÃ¥ste intrÃ€ffa fÃ¶re {0}",
+      invalidText       : "{0} Ã€r inte ett tillÃ¥tet datum - datum ska anges i formatet {1}",
+      format            : "Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Laddar...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Detta fÃ€lt ska innehÃ¥lla en e-post adress i formatet "anvÃ€ndare@domÃ€n.se"',
+      urlText      : 'Detta fÃ€lt ska innehÃ¥lla en lÃ€nk (URL) i formatet "http:/'+'/www.domÃ€n.se"',
+      alphaText    : 'Detta fÃ€lt fÃ¥r bara innehÃ¥lla bokstÃ€ver och "_"',
+      alphanumText : 'Detta fÃ€lt fÃ¥r bara innehÃ¥lla bokstÃ€ver, nummer och "_"'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Sortera stigande",
+      sortDescText : "Sortera fallande",
+      lockText     : "LÃ¥s kolumn",
+      unlockText   : "LÃ¥s upp kolumn",
+      columnsText  : "Kolumner"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Namn",
+      valueText  : "VÃ€rde",
+      dateFormat : "Y-m-d"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Dra fÃ¶r att Ã€ndra storleken.",
+      collapsibleSplitTip : "Dra fÃ¶r att Ã€ndra storleken. Dubbelklicka fÃ¶r att gÃ¶mma."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lv.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lv.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-lv.js	(revision 76)
@@ -0,0 +1,177 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Latvian Translations
+ * By salix 17 April 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Notiek ielÄde...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} iezÄ«mÄtu rindu";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Aizver Å¡o zÄ«mni";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "VÄrtÄ«ba Å¡ajÄ laukÄ nav pareiza";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "IelÄdÄ...";
+}
+
+Date.monthNames = [
+   "JanvÄris",
+   "FebruÄris",
+   "Marts",
+   "AprÄ«lis",
+   "Maijs",
+   "JÅ«nijs",
+   "JÅ«lijs",
+   "Augusts",
+   "Septembris",
+   "Oktobris",
+   "Novembris",
+   "Decembris"
+];
+
+Date.dayNames = [
+   "SvÄtdiena",
+   "Pirmdiena",
+   "Otrdiena",
+   "TreÅ¡diena",
+   "Ceturtdiena",
+   "Piektdiena",
+   "Sestdiena"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "Labi",
+      cancel : "Atcelt",
+      yes    : "JÄ",
+      no     : "NÄ"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Å odiena",
+      minText           : "NorÄdÄ«tais datums ir mazÄks par minimÄlo datumu",
+      maxText           : "NorÄdÄ«tais datums ir lielÄks par maksimÄlo datumu",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'NÄkamais mÄnesis (Control+pa labi)',
+      prevText          : 'IepriekÅ¡Äjais mÄnesis (Control+pa kreisi)',
+      monthYearText     : 'MÄneÅ¡a izvÄle (Control+uz augÅ¡u/uz leju lai pÄrslÄgtu gadus)',
+      todayTip          : "{0} (TukÅ¡umzÄ«me)",
+      format            : "d.m.Y",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Lapa",
+      afterPageText  : "no {0}",
+      firstText      : "PirmÄ lapa",
+      prevText       : "iepriekÅ¡ÄjÄ lapa",
+      nextText       : "NÄkamÄ lapa",
+      lastText       : "PÄdÄjÄ lapa",
+      refreshText    : "AtsvaidzinÄt",
+      displayMsg     : "RÄda no {0} lÄ«dz {1} ierakstiem, kopÄ {2}",
+      emptyMsg       : 'Nav datu, ko parÄdÄ«t'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "MinimÄlais garums Å¡im laukam ir {0}",
+      maxLengthText : "MaksimÄlais garums Å¡im laukam ir {0}",
+      blankText     : "Å is ir obligÄts lauks",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "MinimÄlais garums Å¡im laukam ir  {0}",
+      maxText : "MaksimÄlais garums Å¡im laukam ir  {0}",
+      nanText : "{0} nav pareizs skaitlis"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "AtspÄjots",
+      disabledDatesText : "AtspÄjots",
+      minText           : "Datumam Å¡ajÄ laukÄ jÄbÅ«t lielÄkam kÄ {0}",
+      maxText           : "Datumam Å¡ajÄ laukÄ jÄbÅ«t mazÄkam kÄ {0}",
+      invalidText       : "{0} nav pareizs datums - tam jÄbÅ«t Å¡ÄdÄ formÄtÄ: {1}",
+      format            : "d.m.Y",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "IelÄdÄ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Å ajÄ laukÄ jÄieraksta e-pasta adrese formÄtÄ "lietotÄs@domÄns.lv"',
+      urlText      : 'Å ajÄ laukÄ jÄieraksta URL formÄtÄ "http:/'+'/www.domÄns.lv"',
+      alphaText    : 'Å is lauks drÄ«kst saturÄt tikai burtus un _ zÄ«mi',
+      alphanumText : 'Å is lauks drÄ«kst saturÄt tikai burtus, ciparus un _ zÄ«mi'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "KÄrtot pieaugoÅ¡Ä secÄ«bÄ",
+      sortDescText : "KÄrtot dilstoÅ¡Ä secÄ«bÄ",
+      lockText     : "NoslÄgt kolonnu",
+      unlockText   : "AtslÄgt kolonnu",
+      columnsText  : "Kolonnas"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Nosaukums",
+      valueText  : "VÄrtÄ«ba",
+      dateFormat : "j.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Velc, lai mainÄ«tu izmÄru.",
+      collapsibleSplitTip : "Velc, lai mainÄ«tu izmÄru. DubultklikÅ¡Ä·is noslÄpj apgabalu."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt.js	(revision 76)
@@ -0,0 +1,261 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Portuguese/Brazil Translation by Weber Souza
+ * 08 April 2007
+ * Updated by Allan Brazute Alves (EthraZa)
+ * 06 September 2007
+ * Adapted to European Portuguese by Helder Batista (hbatista)
+ * 31 January 2008
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Carregando...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} linha(s) seleccionada(s)";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Fechar";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "O valor para este campo &eacute; inv&aacute;lido";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Carregando...";
+}
+
+Date.monthNames = [
+   "Janeiro",
+   "Fevereiro",
+   "Mar&ccedil;o",
+   "Abril",
+   "Maio",
+   "Junho",
+   "Julho",
+   "Agosto",
+   "Setembro",
+   "Outubro",
+   "Novembro",
+   "Dezembro"
+];
+
+Date.dayNames = [
+   "Domingo",
+   "Segunda",
+   "Ter&ccedil;a",
+   "Quarta",
+   "Quinta",
+   "Sexta",
+   "S&aacute;bado"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Cancelar",
+      yes    : "Sim",
+      no     : "N&atilde;o"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Hoje",
+      minText           : "Esta data &eacute; anterior &agrave; menor data",
+      maxText           : "Esta data &eacute; posterior &agrave; maior data",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,
+      nextText          : 'Pr&oacute;ximo M&ecirc;s (Control+Direita)',
+      prevText          : 'M&ecirc;s Anterior (Control+Esquerda)',
+      monthYearText     : 'Escolha um M&ecirc;s (Control+Cima/Baixo para mover entre os anos)',
+      todayTip          : "{0} (Espa&ccedil;o)",
+      format            : "d/m/Y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "Cancelar",
+      startDay          : 0
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "P&aacute;gina",
+      afterPageText  : "de {0}",
+      firstText      : "Primeira P&aacute;gina",
+      prevText       : "P&aacute;gina Anterior",
+      nextText       : "Pr&oacute;xima P&aacute;gina",
+      lastText       : "&Uacute;ltima P&aacute;gina",
+      refreshText    : "Atualizar",
+      displayMsg     : "<b>{0} &agrave; {1} de {2} registo(s)</b>",
+      emptyMsg       : 'Sem registos para exibir'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "O tamanho m&iacute;nimo para este campo &eacute; {0}",
+      maxLengthText : "O tamanho m&aacute;ximo para este campo &eacute; {0}",
+      blankText     : "Este campo &eacute; obrigat&oacute;rio.",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "O valor m&iacute;nimo para este campo &eacute; {0}",
+      maxText : "O valor m&aacute;ximo para este campo &eacute; {0}",
+      nanText : "{0} n&atilde;o &eacute; um n&uacute;mero v&aacute;lido"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Desabilitado",
+      disabledDatesText : "Desabilitado",
+      minText           : "A data deste campo deve ser posterior a {0}",
+      maxText           : "A data deste campo deve ser anterior a {0}",
+      invalidText       : "{0} n&atilde;o &eacute; uma data v&aacute;lida - deve ser usado o formato {1}",
+      format            : "d/m/Y",
+      startDay          : 0
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Carregando...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Este campo deve ser um endere&ccedil;o de e-mail v&aacute;lido, no formato "utilizador@dominio.com"',
+      urlText      : 'Este campo deve ser um URL no formato "http:/'+'/www.dominio.com"',
+      alphaText    : 'Este campo deve conter apenas letras e _',
+      alphanumText : 'Este campo deve conter apenas letras, n&uacute;meros e _'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+   Ext.apply(Ext.form.HtmlEditor.prototype, {
+	 createLinkText : 'Por favor, entre com o URL do link:',
+	 buttonTips : {
+            bold : {
+               title: 'Negrito (Ctrl+B)',
+               text: 'Deixa o texto seleccionado em negrito.',
+               cls: 'x-html-editor-tip'
+            },
+            italic : {
+               title: 'Italico (Ctrl+I)',
+               text: 'Deixa o texto seleccionado em italico.',
+               cls: 'x-html-editor-tip'
+            },
+            underline : {
+               title: 'Sublinhado (Ctrl+U)',
+               text: 'Sublinha o texto seleccionado.',
+               cls: 'x-html-editor-tip'
+           },
+           increasefontsize : {
+               title: 'Aumentar Texto',
+               text: 'Aumenta o tamanho da fonte.',
+               cls: 'x-html-editor-tip'
+           },
+           decreasefontsize : {
+               title: 'Diminuir Texto',
+               text: 'Diminui o tamanho da fonte.',
+               cls: 'x-html-editor-tip'
+           },
+           backcolor : {
+               title: 'Cor de Fundo',
+               text: 'Muda a cor do fundo do texto seleccionado.',
+               cls: 'x-html-editor-tip'
+           },
+           forecolor : {
+               title: 'Cor da Fonte',
+               text: 'Muda a cor do texto seleccionado.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyleft : {
+               title: 'Alinhar &agrave; Esquerda',
+               text: 'Alinha o texto &agrave; esquerda.',
+               cls: 'x-html-editor-tip'
+           },
+           justifycenter : {
+               title: 'Centrar Texto',
+               text: 'Centra o texto no editor.',
+               cls: 'x-html-editor-tip'
+           },
+           justifyright : {
+               title: 'Alinhar &agrave; Direita',
+               text: 'Alinha o texto &agrave; direita.',
+               cls: 'x-html-editor-tip'
+           },
+           insertunorderedlist : {
+               title: 'Lista com Marcadores',
+               text: 'Inicia uma lista com marcadores.',
+               cls: 'x-html-editor-tip'
+           },
+           insertorderedlist : {
+               title: 'Lista Numerada',
+               text: 'Inicia uma lista numerada.',
+               cls: 'x-html-editor-tip'
+           },
+           createlink : {
+               title: 'Hyperliga&ccedil;&atilde;o',
+               text: 'Transforma o texto selecionado num hyperlink.',
+               cls: 'x-html-editor-tip'
+           },
+           sourceedit : {
+               title: 'Editar Fonte',
+               text: 'Troca para o modo de edi&ccedil;&atilde;o de c&oacute;digo fonte.',
+               cls: 'x-html-editor-tip'
+           }
+        }
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ordem Ascendente",
+      sortDescText : "Ordem Descendente",
+      lockText     : "Bloquear Coluna",
+      unlockText   : "Desbloquear Coluna",
+      columnsText  : "Colunas"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Nome",
+      valueText  : "Valor",
+      dateFormat : "d/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Arraste para redimensionar.",
+      collapsibleSplitTip : "Arraste para redimensionar. Duplo clique para esconder."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ca.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ca.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-ca.js	(revision 76)
@@ -0,0 +1,316 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Catalonian Translation by halkon_polako 6-12-2007
+ * December correction halkon_polako 11-12-2007
+ *
+ * Synchronized with 2.2 version of ext-lang-en.js (provided by Condor 8 aug 2008) 
+ *     by halkon_polako 14-aug-2008
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Carregant...</div>';
+
+if(Ext.DataView){
+  Ext.DataView.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} fila(es) seleccionada(es)";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "Carregant...";
+}
+
+Date.monthNames = [
+  "Gener",
+  "Febrer",
+  "Mar&#231;",
+  "Abril",
+  "Maig",
+  "Juny",
+  "Juliol",
+  "Agost",
+  "Setembre",
+  "Octubre",
+  "Novembre",
+  "Desembre"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Gen : 0,
+  Feb : 1,
+  Mar : 2,
+  Abr : 3,
+  Mai : 4,
+  Jun : 5,
+  Jul : 6,
+  Ago : 7,
+  Set : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Diumenge",
+  "Dilluns",
+  "Dimarts",
+  "Dimecres",
+  "Dijous",
+  "Divendres",
+  "Dissabte"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+Date.parseCodes.S.s = "(?:st|nd|rd|th)";
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "Acceptar",
+    cancel : "Cancel&#183;lar",
+    yes    : "S&#237;",
+    no     : "No"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Avui",
+    minText           : "Aquesta data &#233;s anterior a la data m&#237;nima",
+    maxText           : "Aquesta data &#233;s posterior a la data m&#224;xima",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Mes Seg&#252;ent (Control+Fletxa Dreta)',
+    prevText          : 'Mes Anterior (Control+Fletxa Esquerra)',
+    monthYearText     : 'Seleccioni un mes (Control+Fletxa a Dalt o Abaix per canviar els anys)',
+    todayTip          : "{0} (Barra d&#39;espai)",
+    format            : "d/m/Y",
+    okText            : "&#160;Acceptar&#160;",
+    cancelText        : "Cancel&#183;lar",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "P&#224;gina",
+    afterPageText  : "de {0}",
+    firstText      : "Primera P&#224;gina",
+    prevText       : "P&#224;gina Anterior",
+    nextText       : "P&#224;gina Seg&#252;ent",
+    lastText       : "Darrera P&#224;gina",
+    refreshText    : "Refrescar",
+    displayMsg     : "Mostrant {0} - {1} de {2}",
+    emptyMsg       : 'Sense dades per mostrar'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "El valor d&#39;aquest camp &#233;s inv&#224;lid";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "El tamany m&#237;nim per aquest camp &#233;s {0}",
+    maxLengthText : "El tamany m&#224;xim per aquest camp &#233;s {0}",
+    blankText     : "Aquest camp &#233;s obligatori",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    decimalSeparator : ",",
+    decimalPrecision : 2,
+    minText : "El valor m&#237;nim per aquest camp &#233;s {0}",
+    maxText : "El valor m&#224;xim per aquest camp &#233;s {0}",
+    nanText : "{0} no &#233;s un nombre v&#224;lid"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Deshabilitat",
+    disabledDatesText : "Deshabilitat",
+    minText           : "La data en aquest camp ha de ser posterior a {0}",
+    maxText           : "La data en aquest camp ha de ser inferior a {0}",
+    invalidText       : "{0} no &#233;s una data v&#224;lida - ha de tenir el format {1}",
+    format            : "d/m/Y",
+    altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "Carregant...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Aquest camp ha de ser una adre&#231;a de e-mail amb el format "user@example.com"',
+    urlText      : 'Aquest camp ha de ser una URL amb el format "http:/'+'/www.example.com"',
+    alphaText    : 'Aquest camp nom&#233;s pot contenir lletres i _',
+    alphanumText : 'Aquest camp nom&#233;s por contenir lletres, nombres i _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Si us plau, tecleixi la URL per l\'enlla&#231;:',
+    buttonTips : {
+      bold : {
+        title: 'Negreta (Ctrl+B)',
+        text: 'Posa el text seleccionat en negreta.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'It&#224;lica (Ctrl+I)',
+        text: 'Posa el text seleccionat en it&#224;lica.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Subratllat (Ctrl+U)',
+        text: 'Subratlla el text seleccionat.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Augmentar Text',
+        text: 'Augmenta el tamany de la font de text.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Disminuir Text',
+        text: 'Disminueix el tamany de la font de text.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Color de fons',
+        text: 'Canvia el color de fons del text seleccionat.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Color de la font de text',
+        text: 'Canvia el color del text seleccionat.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Alinear a la esquerra',
+        text: 'Alinea el text a la esquerra.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centrar el text',
+        text: 'Centra el text a l\'editor',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Alinear a la dreta',
+        text: 'Alinea el text a la dreta.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Llista amb vinyetes',
+        text: 'Comen&#231;a una llista amb vinyetes.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Llista numerada',
+        text: 'Comen&#231;a una llista numerada.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Enlla&#231;',
+        text: 'Transforma el text seleccionat en un enlla&#231;.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Editar Codi',
+        text: 'Canvia al mode d\'edici&#243; de codi.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Ordenaci&#243; Ascendent",
+    sortDescText : "Ordenaci&#243; Descendent",
+    columnsText  : "Columnes"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Buit)',
+    groupByText    : 'Agrupar Per Aquest Camp',
+    showGroupsText : 'Mostrar en Grups'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nom",
+    valueText  : "Valor",
+    dateFormat : "d/m/Y"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Cliqueu i arrossegueu per canviar el tamany del panell.",
+    collapsibleSplitTip : "Cliqueu i arrossegueu per canviar el tamany del panell. Doble clic per ocultar-ho."
+  });
+}
+
+if(Ext.form.TimeField){
+  Ext.apply(Ext.form.TimeField.prototype, {
+    minText : "L\'hora en aquest camp ha de ser igual o posterior a {0}",
+    maxText : "L\'hora en aquest camp ha de ser igual o anterior {0}",
+    invalidText : "{0} no &#233;s un hora v&#224;lida",
+    format : "g:i A",
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H"
+  });
+}
+
+if(Ext.form.CheckboxGroup){
+  Ext.apply(Ext.form.CheckboxGroup.prototype, {
+    blankText : "Ha de seleccionar almenys un &#233;tem d\'aquest group"
+  });
+}
+
+if(Ext.form.RadioGroup){
+  Ext.apply(Ext.form.RadioGroup.prototype, {
+    blankText : "Ha de seleccionar un &#233;tem d\'aquest grup"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-vn.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-vn.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-vn.js	(revision 76)
@@ -0,0 +1,181 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ */
+
+/**
+ * Vietnamese translation
+ * By bpmtri
+ * 12-April-2007 04:06PM
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Äang táº£i...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} dÃ²ng ÄÆ°á»£c chá»n";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ÄÃ³ng tháº» nÃ y";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "GiÃ¡ trá» cá»§a ÃŽ nÃ y khÃŽng há»£p lá».";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Äang táº£i...";
+}
+
+Date.monthNames = [
+   "ThÃ¡ng 1",
+   "ThÃ¡ng 2",
+   "ThÃ¡ng 3",
+   "ThÃ¡ng 4",
+   "ThÃ¡ng 5",
+   "ThÃ¡ng 6",
+   "ThÃ¡ng 7",
+   "ThÃ¡ng 8",
+   "ThÃ¡ng 9",
+   "ThÃ¡ng 10",
+   "ThÃ¡ng 11",
+   "ThÃ¡ng 12"
+];
+
+Date.dayNames = [
+   "Chá»§ nháº­t",
+   "Thá»© hai",
+   "Thá»© ba",
+   "Thá»© tÆ°",
+   "Thá»© nÄm",
+   "Thá»© sÃ¡u",
+   "Thá»© báº£y"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "Äá»ng Ãœ",
+      cancel : "Há»§y bá»",
+      yes    : "CÃ³",
+      no     : "KhÃŽng"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "HÃŽm nay",
+      minText           : "NgÃ y nÃ y nhá» hÆ¡n ngÃ y nhá» nháº¥t",
+      maxText           : "NgÃ y nÃ y lá»n hÆ¡n ngÃ y lá»n nháº¥t",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'ThÃ¡ng sau (Control+Right)',
+      prevText          : 'ThÃ¡ng trÆ°á»c (Control+Left)',
+      monthYearText     : 'Chá»n má»t thÃ¡ng (Control+Up/Down Äá» thay Äá»i nÄm)',
+      todayTip          : "{0} (Spacebar - PhÃ­m tráº¯ng)",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Trang",
+      afterPageText  : "of {0}",
+      firstText      : "Trang Äáº§u",
+      prevText       : "Trang trÆ°á»c",
+      nextText       : "Trang sau",
+      lastText       : "Trang cuá»i",
+      refreshText    : "Táº£i láº¡i",
+      displayMsg     : "Hiá»n thá» {0} - {1} cá»§a {2}",
+      emptyMsg       : 'KhÃŽng cÃ³ dá»¯ liá»u Äá» hiá»n thá»'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Chiá»u dÃ i tá»i thiá»u cá»§a ÃŽ nÃ y lÃ  {0}",
+      maxLengthText : "Chiá»u dÃ i tá»i Äa cá»§a ÃŽ nÃ y lÃ  {0}",
+      blankText     : "Ã nÃ y cáº§n pháº£i nháº­p giÃ¡ trá»",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "GiÃ¡ trá» nhá» nháº¥t cá»§a ÃŽ nÃ y lÃ  {0}",
+      maxText : "GiÃ¡ trá» lá»n nháº¥t cá»§a ÃŽ nÃ y lÃ   {0}",
+      nanText : "{0} hÃŽng pháº£i lÃ  má»t sá» há»£p lá»"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "VÃŽ hiá»u",
+      disabledDatesText : "VÃŽ hiá»u",
+      minText           : "NgÃ y nháº­p trong ÃŽ nÃ y pháº£i sau ngÃ y {0}",
+      maxText           : "NgÃ y nháº­p trong ÃŽ nÃ y pháº£i trÆ°á»c ngÃ y {0}",
+      invalidText       : "{0} khÃŽng pháº£i lÃ  má»t ngÃ y há»£p lá» - pháº£i cÃ³ dáº¡ng {1}",
+      format            : "d/m/y"
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Äang táº£i...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'GiÃ¡ trá» cá»§a ÃŽ nÃ y pháº£i lÃ  má»t Äá»a chá» email cÃ³ dáº¡ng nhÆ° "ten@abc.com"',
+      urlText      : 'GiÃ¡ trá» cá»§a ÃŽ nÃ y pháº£i lÃ  má»t Äá»a chá» web(URL) há»£p lá», cÃ³ dáº¡ng nhÆ° "http:/'+'/www.example.com"',
+      alphaText    : 'Ã nÃ y chá» ÄÆ°á»£c nháº­p cÃ¡c kÃ­ tá»± vÃ  gáº¡ch dÆ°á»i(_)',
+      alphanumText : 'Ã nÃ y chá» ÄÆ°á»£c nháº­p cÃ¡c kÃ­ tá»±, sá» vÃ  gáº¡ch dÆ°á»i(_)'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "TÄng dáº§n",
+      sortDescText : "Giáº£m dáº§n",
+      lockText     : "KhÃ³a cá»t",
+      unlockText   : "Bá» khÃ³a cá»t",
+      columnsText  : "CÃ¡c cá»t"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "TÃªn",
+      valueText  : "GiÃ¡ trá»",
+      dateFormat : "j/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "KÃ©o giá»¯ chuá»t Äá» thay Äá»i kÃ­ch thÆ°á»c.",
+      collapsibleSplitTip : "KÃ©o giá»¯ chuá»t Äá» thay Äá»i kÃ­ch thÆ°á»c. Nháº¥p ÄÃºp Äá» áº©n Äi."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-da.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-da.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-da.js	(revision 76)
@@ -0,0 +1,297 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Danish translation
+ * By JohnF
+ * 04-09-2007, 05:28 AM
+ * 
+ * Extended and modified by Karl Krukow, 
+ * December, 2007.
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Henter...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} markerede rÃŠkker";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Luk denne fane";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "VÃŠrdien i dette felt er ugyldig";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Henter...";
+}
+
+Date.monthNames = [
+   "januar",
+   "februar",
+   "marts",
+   "april",
+   "maj",
+   "juni",
+   "juli",
+   "august",
+   "september",
+   "oktober",
+   "november",
+   "december"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+   "sÃžndag",
+   "mandag",
+   "tirsdag",
+   "onsdag",
+   "torsdag",
+   "fredag",
+   "lÃžrdag"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "OK",
+      cancel : "Fortryd",
+      yes    : "Ja",
+      no     : "Nej"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d/m/Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "I dag",
+      minText           : "Denne dato er fÃžr den tidligst tilladte",
+      maxText           : "Denne dato er senere end den senest tilladte",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames        : Date.monthNames,
+      dayNames          : Date.dayNames,      
+      nextText          : 'NÃŠste mÃ¥ned (Ctrl + hÃžjre piltast)',
+      prevText          : 'Forrige mÃ¥ned (Ctrl + venstre piltast)',
+      monthYearText     : 'VÃŠlg en mÃ¥ned (Ctrl + op/ned pil for at ÃŠndre Ã¥rstal)',
+      todayTip          : "{0} (mellemrum)",
+      format            : "d/m/y",
+      okText            : "&#160;OK&#160;",
+      cancelText        : "Cancel",
+      startDay          : 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Side",
+      afterPageText  : "af {0}",
+      firstText      : "FÃžrste side",
+      prevText       : "Forrige side",
+      nextText       : "NÃŠste side",
+      lastText       : "Sidste side",
+      refreshText    : "Opfrisk",
+      displayMsg     : "Viser {0} - {1} af {2}",
+      emptyMsg       : 'Der er ingen data at vise'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Minimum lÃŠngden for dette felt er {0}",
+      maxLengthText : "Maksimum lÃŠngden for dette felt er {0}",
+      blankText     : "Dette felt skal udfyldes",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Mindste-vÃŠrdien for dette felt er {0}",
+      maxText : "Maksimum-vÃŠrdien for dette felt er {0}",
+      nanText : "{0} er ikke et tilladt nummer"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Inaktiveret",
+      disabledDatesText : "Inaktiveret",
+      minText           : "Datoen i dette felt skal vÃŠre efter {0}",
+      maxText           : "Datoen i dette felt skal vÃŠre fÃžr {0}",
+      invalidText       : "{0} er ikke en tilladt dato - datoer skal angives i formatet {1}",
+      format            : "d/m/y",
+      altFormats        : "d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+      startDay          : 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Henter...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Dette felt skal vÃŠre en email adresse i formatet "xxx@yyy.zzz"',
+      urlText      : 'Dette felt skal vÃŠre en URL i formatet "http:/'+'/xxx.yyy"',
+      alphaText    : 'Dette felt kan kun indeholde bogstaver og "_" (understregning)',
+      alphanumText : 'Dette felt kan kun indeholde bogstaver, tal og "_" (understregning)'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Indtast URL:',
+    buttonTips : {
+      bold : {
+        title: 'Fed (Ctrl+B)', //Can I change this to Ctrl+F?
+        text: 'Formater det markerede tekst med fed.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Kursiv (Ctrl+I)',//Ctrl+K
+        text: 'Formater det markerede tekst med kursiv.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Understreg (Ctrl+U)',
+        text: 'Understreg det markerede tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'ForstÃžr tekst',
+        text: 'ForÃžg fontstÃžrrelsen.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Formindsk tekst',
+        text: 'Formindsk fontstÃžrrelsen.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Farve for tekstfremhÃŠvelse',
+        text: 'Skift baggrundsfarve for det markerede tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Skriftfarve',
+        text: 'Skift skriftfarve for det markerede tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Juster venstre',
+        text: 'Venstrestil tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centreret',
+        text: 'Centrer tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'Juster hÃžjre',
+        text: 'HÃžjrestil tekst.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Punktopstilling',
+        text: 'PÃ¥begynd punktopstilling.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Nummereret opstilling',
+        text: 'PÃ¥begynd nummereret opstilling.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Lav det markerede test til et hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Kildetekstredigering',
+        text: 'Skift til redigering af kildetekst.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "SortÃ©r stigende",
+      sortDescText : "SortÃ©r faldende",
+      lockText     : "LÃ¥s kolonne",
+      unlockText   : "Fjern lÃ¥s fra kolonne",
+      columnsText  : "Kolonner"
+   });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Ingen)',
+    groupByText    : 'GruppÃ©r efter dette felt',
+    showGroupsText : 'Vis i grupper' //should this be sort in groups?
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Navn",
+      valueText  : "VÃŠrdi",
+      dateFormat : "j/m/Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "TrÃŠk for at ÃŠndre stÃžrrelsen.",
+      collapsibleSplitTip : "TrÃŠk for at ÃŠndre stÃžrrelsen. Dobbelt-klik for at skjule."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-sr.js	(revision 76)
@@ -0,0 +1,180 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Serbian Latin Translation
+ * by Atila Hajnal (latin, utf8 encoding)
+ * sr
+ * 14 Sep 2007
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">UÄitavam...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "Ne postoji ni jedan slog";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} izabranih redova";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "Zatvori ÐŸvu Â»karticuÂ«";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "UneÅ¡ena vrednost nije pravilna";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "UÄitavam...";
+}
+
+Date.monthNames = [
+   "Januar",
+   "Februar",
+   "Mart",
+   "April",
+   "ÐÐ°Ñ",
+   "Jun",
+   "Ðul",
+   "Avgust",
+   "Septembar",
+   "Oktobar",
+   "Novembar",
+   "Decembar"
+];
+
+Date.dayNames = [
+   "Nedelja",
+   "Ponedeljak",
+   "Utorak",
+   "Sreda",
+   "Äetvrtak",
+   "Petak",
+   "Subota"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "U redu",
+      cancel : "Odustani",
+      yes    : "Da",
+      no     : "Ne"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "d.m.Y");
+   };
+}
+
+if(Ext.DatePicker){
+   Ext.apply(Ext.DatePicker.prototype, {
+      todayText         : "Danas",
+      minText           : "Datum ÑÐµ ispred najmanjeg dozvoljenog datuma",
+      maxText           : "Datum ÑÐµ nakon najveÄeg dozvoljenog datuma",
+      disabledDaysText  : "",
+      disabledDatesText : "",
+      monthNames	: Date.monthNames,
+      dayNames		: Date.dayNames,
+      nextText          : 'SledeÄi mesec (Control+Desno)',
+      prevText          : 'Prethodni mesec (Control+Levo)',
+      monthYearText     : 'Izaberite mesec (Control+Gore/Dole za izbor godine)',
+      todayTip          : "{0} (Razmaknica)",
+      format            : "d.m.y",
+      startDay 		: 1
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "Strana",
+      afterPageText  : "od {0}",
+      firstText      : "Prva strana",
+      prevText       : "Prethodna strana",
+      nextText       : "SledeÄa strana",
+      lastText       : "Poslednja strana",
+      refreshText    : "OsveÅŸi",
+      displayMsg     : "Prikazana {0} - {1} od {2}",
+      emptyMsg       : 'Nemam Å¡ta prikazati'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Minimalna duÅŸina ovog polja ÑÐµ {0}",
+      maxLengthText : "Maksimalna duÅŸina ovog polja ÑÐµ {0}",
+      blankText     : "Polje ÑÐµ obavezno",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Minimalna vrednost u polju ÑÐµ {0}",
+      maxText : "Maksimalna vrednost u polju ÑÐµ {0}",
+      nanText : "{0} nije pravilan broj"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "Pasivno",
+      disabledDatesText : "Pasivno",
+      minText           : "Datum u ovom polju mora biti nakon {0}",
+      maxText           : "Datum u ovom polju mora biti pre {0}",
+      invalidText       : "{0} nije pravilan datum - zahtevani oblik je {1}",
+      format            : "d.m.y",
+      altFormats        : "d.m.y|d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|Y-m-d",
+      startDay 		: 1
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "UÄitavam...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Ovo polje prihavata e-mail adresu iskljuÄivo u obliku "korisnik@domen.com"',
+      urlText      : 'Ovo polje prihavata URL adresu iskljuÄivo u obliku "http:/'+'/www.domen.com"',
+      alphaText    : 'Ovo polje moÅŸe sadrÅŸati iskljuÄivo slova i znak _',
+      alphanumText : 'Ovo polje moÅŸe sadrÅŸati ÑÐ°ÐŒÐŸ slova, brojeve i znak _'
+   });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "RastuÄi redosled",
+      sortDescText : "OpadajuÄi redosled",
+      lockText     : "ZakljuÄaj kolonu",
+      unlockText   : "OtkljuÄaj kolonu",
+      columnsText  : "Kolone"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "Naziv",
+      valueText  : "Vrednost",
+      dateFormat : "d.m.Y"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "PovuÄi za izmenu veliÄine.",
+      collapsibleSplitTip : "PovuÄi za izmenu veliÄine. Dvostruku klik za sakrivanje."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-tr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-tr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-tr.js	(revision 76)
@@ -0,0 +1,307 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * List compiled by mystix on the extjs.com forums.
+ * Thank you Mystix!
+ *
+ * Turkish translation by Alper YAZGAN
+ * 2008-01-24, 10:29 AM 
+ * 
+ * Updated to 2.2 by YargicX
+ * 2008-10-05, 06:22 PM
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">YÃŒkleniyor ...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.Grid){
+  Ext.grid.Grid.prototype.ddText = "SeÃ§ili satÃœr sayÃœsÃœ : {0}";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Sekmeyi kapat";
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "Bu alandaki deÃ°er geÃ§ersiz";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "YÃŒkleniyor ...";
+}
+
+Date.monthNames = [
+  "Ocak",
+  "ÃÅŸubat",
+  "Mart",
+  "Nisan",
+  "MayÃœs",
+  "Haziran",
+  "Temmuz",
+  "AÃ°ustos",
+  "EylÃŒl",
+  "Ekim",
+  "KasÃœm",
+  "AralÃœk"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Pazar",
+  "Pazartesi",
+  "SalÃœ",
+  "Ãâ¡arÃŸÅžamba",
+  "PerÃŸÅžembe",
+  "Cuma",
+  "Cumartesi"
+];
+
+Date.shortDayNames = [
+  "Paz",
+  "Pzt",
+  "Sal",
+  "ÃrÃŸÅž",
+  "PrÃŸ",
+  "Cum",
+  "Cmt"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.shortDayNames[day];
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "Tamam",
+    cancel : "ÃÂ°ptal",
+    yes    : "Evet",
+    no     : "HayÃœr"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "d/m/Y");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "BugÃŒn",
+    minText           : "Bu tarih izin verilen en kÃŒÃ§ÃŒk tarihten daha Ã¶nce",
+    maxText           : "Bu tarih izin verilen en bÃŒyÃŒk tarihten daha sonra",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Gelecek Ay (Control+Right)',
+    prevText          : 'Ãânceki Ay (Control+Left)',
+    monthYearText     : 'Bir ay sÅžeÃ§iniz (YÃœlÃœ artÃœrmak/azaltmak iÃ§in Control+Up/Down)',
+    todayTip          : "{0} (BoÃŸÅžluk TuÃŸÅžu - Spacebar)",
+    format            : "d/m/Y",
+    okText            : "&#160;Tamam&#160;",
+    cancelText        : "ÃÂ°ptal",
+    startDay          : 1
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "Sayfa",
+    afterPageText  : " / {0}",
+    firstText      : "ÃÂ°lk Sayfa",
+    prevText       : "Ãânceki Sayfa",
+    nextText       : "Sonraki Sayfa",
+    lastText       : "Son Sayfa",
+    refreshText    : "Yenile",
+    displayMsg     : "GÃ¶sterilen {0} - {1} / {2}",
+    emptyMsg       : 'GÃ¶sterilebilecek veri yok'
+  });
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "Girilen verinin uzunluÃ°u en az {0} olabilir",
+    maxLengthText : "Girilen verinin uzunluÃ°u en fazla {0} olabilir",
+    blankText     : "Bu alan boÃŸÅž bÃœrakÃœlamaz",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "En az {0} girilebilir",
+    maxText : "En Ã§ok {0} girilebilir",
+    nanText : "{0} geÃ§ersiz bir sayÃœdÃœr"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Disabled",
+    disabledDatesText : "Disabled",
+    minText           : "Bu tarih, {0} tarihinden daha sonra olmalÃœdÃœr", 
+    maxText           : "Bu tarih, {0} tarihinden daha Ã¶nce olmalÃœdÃœr",
+    invalidText       : "{0} geÃ§ersiz bir tarihdir - tarih formatÃœ {1} ÃŸÅžeklinde olmalÃœdÃœr",
+    format            : "d/m/Y",
+    altFormats        : "d.m.y|d.m.Y|d/m/y|d-m-Y|d-m-y|d.m|d/m|d-m|dm|dmY|dmy|d|Y.m.d|Y-m-d|Y/m/d",
+    startDay          : 1
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "YÃŒkleniyor ...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+	Ext.form.VTypes["emailText"]='Bu alan "user@example.com" ÃŸÅžeklinde elektronik posta formatÃœnda olmalÃœdÃœr';
+	Ext.form.VTypes["urlText"]='Bu alan "http://www.example.com" ÃŸÅžeklinde URL adres formatÃœnda olmalÃœdÃœr';
+	Ext.form.VTypes["alphaText"]='Bu alan sadece harf ve _ iÃ§ermeli';
+	Ext.form.VTypes["alphanumText"]='Bu alan sadece harf, sayÃœ ve _ iÃ§ermeli';
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'LÃŒtfen bu baÃ°lantÃœ iÃ§in gerekli URL adresini giriniz:',
+    buttonTips : {
+      bold : {
+        title: 'KalÃœn(Bold) (Ctrl+B)',
+        text: 'ÃÅŸeÃ§ili yazÃœyÃœ kalÃœn yapar.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'ÃÂ°talik(Italic) (Ctrl+I)',
+        text: 'ÃÅŸeÃ§ili yazÃœyÃœ italik yapar.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Alt Ãâ¡izgi(Underline) (Ctrl+U)',
+        text: 'ÃÅŸeÃ§ili yazÃœnÃœn altÃœnÃœ Ã§izer.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Fontu bÃŒyÃŒlt',
+        text: 'YazÃœ fontunu bÃŒyÃŒtÃŒr.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Fontu kÃŒÃ§ÃŒlt',
+        text: 'YazÃœ fontunu kÃŒÃ§ÃŒltÃŒr.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Arka Plan Rengi',
+        text: 'SeÃ§ili yazÃœnÃœn arka plan rengini deÃ°iÃŸÅžtir.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'YazÃœ Rengi',
+        text: 'SeÃ§ili yazÃœnÃœn rengini deÃ°iÃŸÅžtir.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'Sola Daya',
+        text: 'YazÃœyÃœ sola daya.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Ortala',
+        text: 'YazÃœyÃœ editÃ¶rde ortala.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'SaÃ°a daya',
+        text: 'YazÃœyÃœ saÃ°a daya.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'NoktalÃœ Liste',
+        text: 'NoktalÃœ listeye baÃŸÅžla.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'NumaralÃœ Liste',
+        text: 'NumaralÃœ lisyeye baÃŸÅžla.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Web Adresi(Hyperlink)',
+        text: 'SeÃ§ili yazÃœyÃœ web adresi(hyperlink) yap.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Kaynak kodu DÃŒzenleme',
+        text: 'Kaynak kodu dÃŒzenleme moduna geÃ§.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Artan sÃœrada sÃœrala",
+    sortDescText : "Azalan sÃœrada sÃœrala",
+    lockText     : "Kolonu kilitle",
+    unlockText   : "Kolon kilidini kaldÃœr",
+    columnsText  : "Kolonlar"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Yok)',
+    groupByText    : 'Bu Alana GÃ¶re Grupla',
+    showGroupsText : 'Gruplar Halinde GÃ¶ster'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Ad",
+    valueText  : "DeÃ°er",
+    dateFormat : "d/m/Y"
+  });
+}
+
+if(Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Yeniden boyutlandÃœrmak iÃ§in sÃŒrÃŒkle.",
+    collapsibleSplitTip : "Yeniden boyutlandÃœrmak iÃ§in sÃŒrÃŒkle. Saklamak iÃ§in Ã§ift tÃœkla."
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fa.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fa.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-fa.js	(revision 76)
@@ -0,0 +1,342 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Farsi (Persian) translation
+ * By Mohaqa
+ * 03-10-2007, 06:23 PM
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Ø¯Ø± Ø­Ø§Ù ØšØ§Ø±Ú¯Ø°Ø§Ø±Û ...</div>';
+
+if(Ext.View){
+   Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+   Ext.grid.GridPanel.prototype.ddText = "{0} Ø±Ú©ÙØ±Ø¯ Ø§ÙØªØ®Ø§Øš ØŽØ¯Ù";
+}
+
+if(Ext.TabPanelItem){
+   Ext.TabPanelItem.prototype.closeText = "ØšØ³ØªÙ";
+}
+
+if(Ext.form.Field){
+   Ext.form.Field.prototype.invalidText = "Ù
+ÙØ¯Ø§Ø± ÙÛÙØ¯ ØµØ­ÛØ­ ÙÛØ³Øª";
+}
+
+if(Ext.LoadMask){
+    Ext.LoadMask.prototype.msg = "Ø¯Ø± Ø­Ø§Ù ØšØ§Ø±Ú¯Ø°Ø§Ø±Û ...";
+}
+
+Date.monthNames = [
+   "ÚØ§ÙÙÛÙ",
+   "ÙÙØ±ÛÙ",
+   "Ù
+Ø§Ø±Ø³",
+   "Ø¢ÙŸØ±ÛÙ",
+   "Ù
+Û",
+   "ÚÙØŠÙ",
+   "Ø¬ÙÙØ§Û",
+   "Ø¢Ú¯ÙØ³Øª",
+   "Ø³ÙŸØªØ§Ù
+ØšØ±",
+   "Ø§Ú©ØªØšØ±",
+   "ÙÙØ§Ù
+ØšØ±",
+   "Ø¯Ø³Ø§Ù
+ØšØ±"
+];
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.dayNames = [
+   "ÛÚ©ØŽÙØšÙ",
+   "Ø¯ÙØŽÙØšÙ",
+   "Ø³Ù ØŽÙØšÙ",
+   "ÚÙØ§Ø±ØŽÙØšÙ",
+   "ÙŸÙØ¬ØŽÙØšÙ",
+   "Ø¬Ù
+Ø¹Ù",
+   "ØŽÙØšÙ"
+];
+
+if(Ext.MessageBox){
+   Ext.MessageBox.buttonText = {
+      ok     : "ØªØ§ÛÛØ¯",
+      cancel : "ØšØ§Ø²Ú¯ØŽØª",
+      yes    : "ØšÙÙ",
+      no     : "Ø®ÛØ±"
+   };
+}
+
+if(Ext.util.Format){
+   Ext.util.Format.date = function(v, format){
+      if(!v) return "";
+      if(!(v instanceof Date)) v = new Date(Date.parse(v));
+      return v.dateFormat(format || "Y/m/d");
+   };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Ø§Ù
+Ø±ÙØ²",
+    minText           : "Ø§ÛÙ ØªØ§Ø±ÛØ® ÙØšÙ Ø§Ø² Ù
+Ø­Ø¯ÙØ¯Ù Ù
+Ø¬Ø§Ø² Ø§Ø³Øª",
+    maxText           : "Ø§ÛÙ ØªØ§Ø±ÛØ® ÙŸØ³ Ø§Ø² Ù
+Ø­Ø¯ÙØ¯Ù Ù
+Ø¬Ø§Ø² Ø§Ø³Øª",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'Ù
+Ø§Ù ØšØ¹Ø¯ (Control + Right)',
+    prevText          : 'Ù
+Ø§Ù ÙØšÙ (Control+Left)',
+    monthYearText     : 'ÛÚ© Ù
+Ø§Ù Ø±Ø§ Ø§ÙØªØ®Ø§Øš Ú©ÙÛØ¯ (Control+Up/Down ØšØ±Ø§Û Ø§ÙØªÙØ§Ù Ø¯Ø± Ø³Ø§Ù)',
+    todayTip          : "{0} (Spacebar)",
+    format            : "y/m/d",
+    okText            : "&#160;OK&#160;",
+    cancelText        : "Cancel",
+    startDay          : 0
+   });
+}
+
+if(Ext.PagingToolbar){
+   Ext.apply(Ext.PagingToolbar.prototype, {
+      beforePageText : "ØµÙØ­Ù",
+      afterPageText  : "Ø§Ø² {0}",
+      firstText      : "ØµÙØ­Ù Ø§ÙÙ",
+      prevText       : "ØµÙØ­Ù ÙØšÙ",
+      nextText       : "ØµÙØ­Ù ØšØ¹Ø¯",
+      lastText       : "ØµÙØ­Ù Ø¢Ø®Ø±",
+      refreshText    : "ØšØ§Ø²Ø®ÙØ§ÙÛ",
+      displayMsg     : "ÙÙ
+Ø§ÛØŽ {0} - {1} of {2}",
+      emptyMsg       : 'Ø¯Ø§Ø¯Ù Ø§Û ØšØ±Ø§Û ÙÙ
+Ø§ÛØŽ ÙØ¬ÙØ¯ ÙØ¯Ø§Ø±Ø¯'
+   });
+}
+
+if(Ext.form.TextField){
+   Ext.apply(Ext.form.TextField.prototype, {
+      minLengthText : "Ø­Ø¯Ø§ÙÙ Ø·ÙÙ Ø§ÛÙ ÙÛÙØ¯ ØšØ±Ø§ØšØ± Ø§Ø³Øª ØšØ§ {0}",
+      maxLengthText : "Ø­Ø¯Ø§Ú©Ø«Ø± Ø·ÙÙ Ø§ÛÙ ÙÛÙØ¯ ØšØ±Ø§ØšØ± Ø§Ø³Øª ØšØ§ {0}",
+      blankText     : "Ø§ÛÙ ÙÛÙØ¯ ØšØ§ÛØ¯ Ù
+ÙØ¯Ø§Ø±Û Ø¯Ø§ØŽØªÙ ØšØ§ØŽØ¯",
+      regexText     : "",
+      emptyText     : null
+   });
+}
+
+if(Ext.form.NumberField){
+   Ext.apply(Ext.form.NumberField.prototype, {
+      minText : "Ø­Ø¯Ø§ÙÙ Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ ÙÛÙØ¯ ØšØ±Ø§ØšØ± Ø§Ø³Øª ØšØ§ {0}",
+      maxText : "Ø­Ø¯Ø§Ú©Ø«Ø± Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ ÙÛÙØ¯ ØšØ±Ø§ØšØ± Ø§Ø³Øª ØšØ§ {0}",
+      nanText : "{0} ÛÚ© Ø¹Ø¯Ø¯ ÙÛØ³Øª"
+   });
+}
+
+if(Ext.form.DateField){
+   Ext.apply(Ext.form.DateField.prototype, {
+      disabledDaysText  : "ØºÛØ±ÙØ¹Ø§Ù",
+      disabledDatesText : "ØºÛØ±ÙØ¹Ø§Ù",
+      minText           : "ØªØ§Ø±ÛØ® ØšØ§ÛØ¯ ÙŸØ³ Ø§Ø² {0} ØšØ§ØŽØ¯",
+      maxText           : "ØªØ§Ø±ÛØ® ØšØ§ÛØ¯ ÙŸØ³ Ø§Ø² {0} ØšØ§ØŽØ¯",
+      invalidText       : "{0} ØªØ§Ø±ÛØ® ØµØ­ÛØ­Û ÙÛØ³Øª - ÙØ±Ù
+Øª ØµØ­ÛØ­ {1}",
+      format            : "y/m/d",
+      startDay          : 0
+   });
+}
+
+if(Ext.form.ComboBox){
+   Ext.apply(Ext.form.ComboBox.prototype, {
+      loadingText       : "Ø¯Ø± Ø­Ø§Ù ØšØ§Ø±Ú¯Ø°Ø§Ø±Û ...",
+      valueNotFoundText : undefined
+   });
+}
+
+if(Ext.form.VTypes){
+   Ext.apply(Ext.form.VTypes, {
+      emailText    : 'Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ ÙÛÙØ¯ ØšØ§ÛØ¯ ÛÚ© Ø§ÛÙ
+ÛÙ ØšØ§ Ø§ÛÙ ÙØ±Ù
+Øª ØšØ§ØŽØ¯ "user@example.com"',
+      urlText      : 'Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ Ø¢Ø¯Ø±Ø³ ØšØ§ÛØ¯ ÛÚ© Ø¢Ø¯Ø±Ø³ Ø³Ø§ÛØª ØšØ§ Ø§ÛÙ ÙØ±Ù
+Øª ØšØ§ØŽØ¯ "http:/'+'/www.example.com"',
+      alphaText    : 'Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ ÙÛÙØ¯ ØšØ§ÛØ¯ ÙÙØ· Ø§Ø² Ø­Ø±ÙÙ Ø§ÙÙØšØ§ Ù _ ØªØŽÚ©ÛÙ ØŽØ¯Ù ØšØ§ØŽØ¯ ',
+      alphanumText : 'Ù
+ÙØ¯Ø§Ø± Ø§ÛÙ ÙÛÙØ¯ ØšØ§ÛØ¯ ÙÙØ· Ø§Ø² Ø­Ø±ÙÙ Ø§ÙÙØšØ§Ø Ø§Ø¹Ø¯Ø§Ø¯ Ù _ ØªØŽÚ©ÛÙ ØŽØ¯Ù ØšØ§ØŽØ¯'
+   });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'ÙØ·ÙØ§ Ø¢Ø¯Ø±Ø³ ÙÛÙÚ© Ø±Ø§ ÙØ§Ø±Ø¯ Ú©ÙÛØ¯:',
+    buttonTips : {
+      bold : {
+        title: 'ØªÛØ±Ù (Ctrl+B)',
+        text: 'Ù
+ØªÙ Ø§ÙØªØ®Ø§Øš ØŽØ¯Ù Ø±Ø§ ØªÛØ±Ù Ù
+Û Ú©ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'Ø§ÛØªØ§ÙÛÚ© (Ctrl+I)',
+        text: 'Ù
+ØªÙ Ø§ÙØªØ®Ø§Øš ØŽØ¯Ù Ø±Ø§ Ø§ÛØªØ§ÙÛÚ© Ù
+Û Ú©ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Ø²ÛØ±Ø®Ø· (Ctrl+U)',
+        text: 'Ø²ÛØ± ÙØ± ÙÙØŽØªÙ ÛÚ© Ø®Ø· ÙÙ
+Ø§ÛØŽ Ù
+Û Ø¯ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Ø§ÙØ²Ø§ÛØŽ Ø§ÙØ¯Ø§Ø²Ù',
+        text: 'Ø§ÙØ¯Ø§Ø²Ù ÙÙÙØª Ø±Ø§ Ø§ÙØ²Ø§ÛØŽ Ù
+Û Ø¯ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Ú©Ø§ÙØŽ Ø§ÙØ¯Ø§Ø²Ù',
+        text: 'Ø§ÙØ¯Ø§Ø²Ù Ù
+ØªÙ Ø±Ø§ Ú©Ø§ÙØŽ Ù
+Û Ø¯ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'Ø±ÙÚ¯ Ø²Ù
+ÛÙÙ Ù
+ØªÙ',
+        text: 'ØšØ±Ø§Û ØªØºÛÛØ± Ø±ÙÚ¯ Ø²Ù
+ÛÙÙ Ù
+ØªÙ Ø§Ø³ØªÙØ§Ø¯Ù Ù
+Û ØŽÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'Ø±ÙÚ¯ ÙÙÙ
+',
+        text: 'Ø±ÙÚ¯  ÙÙÙ
+ Ù
+ØªÙ Ø±Ø§ ØªØºÛÛØ± Ù
+Û Ø¯ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'ÚÛØ¯Ù Ù
+ØªÙ Ø§Ø² Ø³Ù
+Øª ÚÙŸ',
+        text: 'Ù
+ØªÙ Ø§Ø² Ø³Ù
+Øª ÚÙŸ ÚÛØ¯Ù ØŽØ¯Ù Ù
+Û ØŽÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Ù
+ØªÙ Ø¯Ø± ÙØ³Ø· ',
+        text: 'ÙÙ
+Ø§ÛØŽ Ù
+ØªÙ Ø¯Ø± ÙØ³Ù
+Øª ÙØ³Ø· ØµÙØ­Ù Ù Ø±Ø¹Ø§ØšØª Ø³Ù
+Øª ÚÙŸ Ù Ø±Ø§Ø³Øª.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'ÚÛØ¯Ù Ù
+ØªÙ Ø§Ø² Ø³Ù
+Øª Ø±Ø§Ø³Øª',
+        text: 'Ù
+ØªÙ Ø§Ø² Ø³Ù
+Øª Ø±Ø§Ø³Øª ÙŸÛØ¯Ù Ø®ÙØ§ÙØ¯ ØŽØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'ÙÛØ³Øª ÙÙ
+Ø±Ø§Ù ØšØ§ Ø¹ÙØ§Ù
+Øª',
+        text: 'ÛÚ© ÙÛØ³Øª Ø¬Ø¯ÛØ¯ Ø§ÛØ¬Ø§Ø¯ Ù
+Û Ú©ÙØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'ÙÛØ³Øª Ø¹Ø¯Ø¯Û',
+        text: 'ÛÚ© ÙÛØ³Øª Ø¹Ø¯Ø¯Û Ø§ÛØ¬Ø§Ø¯ Ù
+Û Ú©ÙØ¯. ',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'ÙÛÙÚ©',
+        text: 'Ù
+ØªÙ Ø§ÙØªØ®Ø§Øš ØŽØ¯Ù Ø±Ø§ ØšÙ ÙÛÙÚ© ØªØšØ¯ÛÙ Ú©ÙÛØ¯.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'ÙÛØ±Ø§ÛØŽ Ø³ÙØ±Ø³',
+        text: 'Ø±ÙØªÙ ØšÙ Ø­Ø§ÙØª ÙÛØ±Ø§ÛØŽ Ø³ÙØ±Ø³.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.grid.GridView){
+   Ext.apply(Ext.grid.GridView.prototype, {
+      sortAscText  : "Ù
+Ø±ØªØš Ø³Ø§Ø²Û Ø§ÙØ²Ø§ÛØŽÛ",
+      sortDescText : "Ù
+Ø±ØªØš Ø³Ø§Ø²Û Ú©Ø§ÙØŽÛ",
+      lockText     : "ÙÙÙ Ø³ØªÙÙ ÙØ§",
+      unlockText   : "ØšØ§Ø²Ú©Ø±Ø¯Ù Ø³ØªÙÙ ÙØ§",
+      columnsText  : "Ø³ØªÙÙ ÙØ§"
+   });
+}
+
+if(Ext.grid.PropertyColumnModel){
+   Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+      nameText   : "ÙØ§Ù
+",
+      valueText  : "Ù
+ÙØ¯Ø§Ø±",
+      dateFormat : "Y/m/d"
+   });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+   Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+      splitTip            : "Ø¯Ø±Ú¯ ØšØ±Ø§Û ØªØºÛÛØ± Ø§ÙØ¯Ø§Ø²Ù.",
+      collapsibleSplitTip : "ØšØ±Ø§Û ØªØºÛÛØ± Ø§ÙØ¯Ø§Ø²Ù Ø¯Ø±Ú¯ Ú©ÙÛØ¯."
+   });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_PT.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_PT.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/locale/ext-lang-pt_PT.js	(revision 76)
@@ -0,0 +1,298 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+ï»¿/**
+ * Portuguese/Portugal (pt_PT) Translation
+ * by Nuno Franco da Costa - francodacosta.com
+ * translated from ext-lang-en.js
+ */
+
+Ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">A carregar...</div>';
+
+if(Ext.View){
+  Ext.View.prototype.emptyText = "";
+}
+
+if(Ext.grid.GridPanel){
+  Ext.grid.GridPanel.prototype.ddText = "{0} linha(s) seleccionada(s)";
+}
+
+if(Ext.TabPanelItem){
+  Ext.TabPanelItem.prototype.closeText = "Fechar aba";
+}
+
+if(Ext.LoadMask){
+  Ext.LoadMask.prototype.msg = "A carregar...";
+}
+
+Date.monthNames = [
+  "Janeiro",
+  "Fevereiro",
+  "Mar&ccedil;o",
+  "Abril",
+  "Maio",
+  "Junho",
+  "Julho",
+  "Agosto",
+  "Setembro",
+  "Outubro",
+  "Novembro",
+  "Dezembro"
+];
+
+Date.getShortMonthName = function(month) {
+  return Date.monthNames[month].substring(0, 3);
+};
+
+Date.monthNumbers = {
+  Jan : 0,
+  Feb : 1,
+  Mar : 2,
+  Apr : 3,
+  May : 4,
+  Jun : 5,
+  Jul : 6,
+  Aug : 7,
+  Sep : 8,
+  Oct : 9,
+  Nov : 10,
+  Dec : 11
+};
+
+Date.getMonthNumber = function(name) {
+  return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+};
+
+Date.dayNames = [
+  "Domingo",
+  "Segunda",
+  "Ter&ccedil;a",
+  "Quarta",
+  "Quinta",
+  "Sexta",
+  "Sabado"
+];
+
+Date.getShortDayName = function(day) {
+  return Date.dayNames[day].substring(0, 3);
+};
+
+if(Ext.MessageBox){
+  Ext.MessageBox.buttonText = {
+    ok     : "OK",
+    cancel : "Cancelar",
+    yes    : "Sim",
+    no     : "N&atilde;o"
+  };
+}
+
+if(Ext.util.Format){
+  Ext.util.Format.date = function(v, format){
+    if(!v) return "";
+    if(!(v instanceof Date)) v = new Date(Date.parse(v));
+    return v.dateFormat(format || "Y/m/d");
+  };
+}
+
+if(Ext.DatePicker){
+  Ext.apply(Ext.DatePicker.prototype, {
+    todayText         : "Hoje",
+    minText           : "A data &eacute; anterior ao m&iacute;nimo definido",
+    maxText           : "A data &eacute; posterior ao mï¿œximo definido",
+    disabledDaysText  : "",
+    disabledDatesText : "",
+    monthNames        : Date.monthNames,
+    dayNames          : Date.dayNames,
+    nextText          : 'M&ecirc;s Seguinte (Control+Right)',
+    prevText          : 'M&ecirc;s Anterior (Control+Left)',
+    monthYearText     : 'Escolha um m&ecirc;s (Control+Up/Down ava&ccedil;ar/recuar anos)',
+    todayTip          : "{0} (barra de espaï¿œo)",
+    format            : "y/m/d",
+    okText            : "*OK*",
+    cancelText        : "Cancelar",
+    startDay          : 0
+  });
+}
+
+if(Ext.PagingToolbar){
+  Ext.apply(Ext.PagingToolbar.prototype, {
+    beforePageText : "P&aacute;gina",
+    afterPageText  : "de {0}",
+    firstText      : "Primeira P&aacute;gina",
+    prevText       : "P&aacute;gina Anterior",
+    nextText       : "Pr%oacute;xima P&aacute;gina",
+    lastText       : "&Uacute;ltima P&aacute;gina",
+    refreshText    : "Recaregar",
+    displayMsg     : "A mostrar {0} - {1} de {2}",
+    emptyMsg       : 'Sem dados para mostrar'
+  });
+}
+
+if(Ext.form.Field){
+  Ext.form.Field.prototype.invalidText = "O valor deste campo &eacute; inv&aacute;lido";
+}
+
+if(Ext.form.TextField){
+  Ext.apply(Ext.form.TextField.prototype, {
+    minLengthText : "O comprimento m&iacute;nimo deste campo &eaute; {0}",
+    maxLengthText : "O comprimento m&aacute;ximo deste campo &eaute; {0}",
+    blankText     : "Este campo &eacute; de preenchimento obrigat&oacute;rio",
+    regexText     : "",
+    emptyText     : null
+  });
+}
+
+if(Ext.form.NumberField){
+  Ext.apply(Ext.form.NumberField.prototype, {
+    minText : "O valor m&iacute;nimo deste campo &eaute; {0}",
+    maxText : "O valor m&aacute;ximo deste campo &eaute; {0}",
+    nanText : "{0} n&atilde;o &eacute; um numero"
+  });
+}
+
+if(Ext.form.DateField){
+  Ext.apply(Ext.form.DateField.prototype, {
+    disabledDaysText  : "Desabilitado",
+    disabledDatesText : "Desabilitado",
+    minText           : "A data deste campo deve ser posterior a {0}",
+    maxText           : "A data deste campo deve ser anterior a {0}",
+    invalidText       : "{0} n&atilde;o &eacute; uma data v&aacute;lida - deve estar no seguinte formato{1}",
+    format            : "y/m/d",
+    altFormats        : "m/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",
+    startDay          : 0
+  });
+}
+
+if(Ext.form.ComboBox){
+  Ext.apply(Ext.form.ComboBox.prototype, {
+    loadingText       : "A Carregar...",
+    valueNotFoundText : undefined
+  });
+}
+
+if(Ext.form.VTypes){
+  Ext.apply(Ext.form.VTypes, {
+    emailText    : 'Este campo deve ser um endere&ccedil;o de email no formato "utilizador@dominio.com"',
+    urlText      : 'Este campo deve ser um URL no formato "http:/'+'/www.dominio.com"',
+    alphaText    : 'Este campo deve conter apenas letras e _',
+    alphanumText : 'Este campo deve conter apenas letras, n@uacute;meros e _'
+  });
+}
+
+if(Ext.form.HtmlEditor){
+  Ext.apply(Ext.form.HtmlEditor.prototype, {
+    createLinkText : 'Indique o endere&ccedil;o do link:',
+    buttonTips : {
+      bold : {
+        title: 'Negrito (Ctrl+B)',
+        text: 'Transforma o texto em Negrito.',
+        cls: 'x-html-editor-tip'
+      },
+      italic : {
+        title: 'It&aacute;lico (Ctrl+I)',
+        text: 'Transforma o texto em it&aacute;lico.',
+        cls: 'x-html-editor-tip'
+      },
+      underline : {
+        title: 'Sublinhar (Ctrl+U)',
+        text: 'Sublinha o texto.',
+        cls: 'x-html-editor-tip'
+      },
+      increasefontsize : {
+        title: 'Aumentar texto',
+        text: 'Aumenta o tamanho da fonte.',
+        cls: 'x-html-editor-tip'
+      },
+      decreasefontsize : {
+        title: 'Encolher texto',
+        text: 'Diminui o tamanho da fonte.',
+        cls: 'x-html-editor-tip'
+      },
+      backcolor : {
+        title: 'C&ocirc;r de fundo do texto',
+        text: 'Altera a c&ocirc;r de fundo do texto.',
+        cls: 'x-html-editor-tip'
+      },
+      forecolor : {
+        title: 'C&ocirc;r do texo',
+        text: 'Altera a a&ocirc;r do texo.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyleft : {
+        title: 'ALinhar &agrave; esquerda',
+        text: 'ALinha o texto &agrave; esquerda.',
+        cls: 'x-html-editor-tip'
+      },
+      justifycenter : {
+        title: 'Centrar',
+        text: 'Centra o texto.',
+        cls: 'x-html-editor-tip'
+      },
+      justifyright : {
+        title: 'ALinhar &agrave; direita',
+        text: 'ALinha o texto &agravce; direita.',
+        cls: 'x-html-editor-tip'
+      },
+      insertunorderedlist : {
+        title: 'Lista',
+        text: 'Inicia uma lista.',
+        cls: 'x-html-editor-tip'
+      },
+      insertorderedlist : {
+        title: 'Lista Numerada',
+        text: 'Inicia uma lista numerada.',
+        cls: 'x-html-editor-tip'
+      },
+      createlink : {
+        title: 'Hyperlink',
+        text: 'Transforma o texto num hyperlink.',
+        cls: 'x-html-editor-tip'
+      },
+      sourceedit : {
+        title: 'Editar c&oacute;digo',
+        text: 'Alterar para o modo de edi&ccedil;&atilde;o de c&oacute;digo.',
+        cls: 'x-html-editor-tip'
+      }
+    }
+  });
+}
+
+if(Ext.form.BasicForm){
+  Ext.form.BasicForm.prototype.waitTitle = "Por favor espere...";
+}
+
+if(Ext.grid.GridView){
+  Ext.apply(Ext.grid.GridView.prototype, {
+    sortAscText  : "Ordena&ccedil;&atilde;o Crescente",
+    sortDescText : "Ordena&ccedil;&atilde;o Decrescente",
+    lockText     : "Fixar Coluna",
+    unlockText   : "Libertar Coluna",
+    columnsText  : "Colunas"
+  });
+}
+
+if(Ext.grid.GroupingView){
+  Ext.apply(Ext.grid.GroupingView.prototype, {
+    emptyGroupText : '(Nenhum)',
+    groupByText    : 'Agrupar por este campo',
+    showGroupsText : 'Mostrar nos Grupos'
+  });
+}
+
+if(Ext.grid.PropertyColumnModel){
+  Ext.apply(Ext.grid.PropertyColumnModel.prototype, {
+    nameText   : "Nome",
+    valueText  : "Valor",
+    dateFormat : "Y/j/m"
+  });
+}
+
+if(Ext.layout.BorderLayout && Ext.layout.BorderLayout.SplitRegion){
+  Ext.apply(Ext.layout.BorderLayout.SplitRegion.prototype, {
+    splitTip            : "Arastar para redimensionar.",
+    collapsibleSplitTip : "Arastar para redimensionar. DUplo clique para esconder"
+  });
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/adapter/ext-base-dom-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/adapter/ext-base-dom-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/adapter/ext-base-dom-more.js	(revision 76)
@@ -0,0 +1,9 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.lib.Dom.getRegion = function(el) {
+    return Ext.lib.Region.getRegion(el);
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/adapter/jquery-bridge.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/adapter/jquery-bridge.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/adapter/jquery-bridge.js	(revision 76)
@@ -0,0 +1,579 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+if(typeof jQuery == "undefined"){
+    throw "Unable to load Ext, jQuery not found.";
+}
+
+(function(){
+var libFlyweight;
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        // jQuery doesn't report full window size on document query, so max both
+        return full ? Math.max(jQuery(document).width(),jQuery(window).width()) : jQuery(window).width();
+    },
+
+    getViewHeight : function(full){
+        // jQuery doesn't report full window size on document query, so max both
+        return full ? Math.max(jQuery(document).height(),jQuery(window).height()) : jQuery(window).height();
+    },
+
+    isAncestor : function(p, c){
+        var ret = false;
+
+        p = Ext.getDom(p);
+        c = Ext.getDom(c);
+        if (p && c) {
+            if (p.contains) {
+                return p.contains(c);
+            } else if (p.compareDocumentPosition) {
+                return !!(p.compareDocumentPosition(c) & 16);
+            } else {
+                while (c = c.parentNode) {
+                    ret = c == p || ret;
+                }
+            }
+        }
+        return ret;
+    },
+
+    getRegion : function(el){
+        return Ext.lib.Region.getRegion(el);
+    },
+
+    //////////////////////////////////////////////////////////////////////////////////////
+    // Use of jQuery.offset() removed to promote consistent behavior across libs.
+    // JVS 05/23/07
+    //////////////////////////////////////////////////////////////////////////////////////
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    getXY : function(el) {
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+Ext.lib.Event = {
+    getPageX : function(e){
+        e = e.browserEvent || e;
+        return e.pageX;
+    },
+
+    getPageY : function(e){
+        e = e.browserEvent || e;
+        return e.pageY;
+    },
+
+    getXY : function(e){
+        e = e.browserEvent || e;
+        return [e.pageX, e.pageY];
+    },
+
+    getTarget : function(e){
+        return e.target;
+    },
+
+    // all Ext events will go through event manager which provides scoping
+    on : function(el, eventName, fn, scope, override){
+        jQuery(el).bind(eventName, fn);
+    },
+
+    un : function(el, eventName, fn){
+        jQuery(el).unbind(eventName, fn);
+    },
+
+    purgeElement : function(el){
+        jQuery(el).unbind();
+    },
+
+    preventDefault : function(e){
+        e = e.browserEvent || e;
+        if(e.preventDefault){
+            e.preventDefault();
+        }else{
+            e.returnValue = false;
+        }
+    },
+
+    stopPropagation : function(e){
+        e = e.browserEvent || e;
+        if(e.stopPropagation){
+            e.stopPropagation();
+        }else{
+            e.cancelBubble = true;
+        }
+    },
+
+    stopEvent : function(e){
+        this.preventDefault(e);
+        this.stopPropagation(e);
+    },
+
+    onAvailable : function(id, fn, scope){
+        var start = new Date();
+        var f = function(){
+            if(start.getElapsed() > 10000){
+                clearInterval(iid);
+            }
+            var el = document.getElementById(id);
+            if(el){
+                clearInterval(iid);
+                fn.call(scope||window, el);
+            }
+        };
+        var iid = setInterval(f, 50);
+    },
+
+    resolveTextNode: Ext.isGecko ? function(node){
+        if(!node){
+            return;
+        }
+        var s = HTMLElement.prototype.toString.call(node);
+        if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+            return;
+        }
+        return node.nodeType == 3 ? node.parentNode : node;
+    } : function(node){
+        return node && node.nodeType == 3 ? node.parentNode : node;
+    },
+
+    getRelatedTarget: function(ev) {
+        ev = ev.browserEvent || ev;
+        var t = ev.relatedTarget;
+        if (!t) {
+            if (ev.type == "mouseout") {
+                t = ev.toElement;
+            } else if (ev.type == "mouseover") {
+                t = ev.fromElement;
+            }
+        }
+
+        return this.resolveTextNode(t);
+    }
+};
+
+Ext.lib.Ajax = function(){
+    var createComplete = function(cb){
+         return function(xhr, status){
+            if((status == 'error' || status == 'timeout') && cb.failure){
+                cb.failure.call(cb.scope||window, createResponse(cb, xhr));
+            }else if(cb.success){
+                cb.success.call(cb.scope||window, createResponse(cb, xhr));
+            }
+         };
+    };
+
+    var createResponse = function(cb, xhr){
+        var headerObj = {},
+            headerStr,
+            t,
+            s;
+
+        try {
+            headerStr = xhr.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            responseText: xhr.responseText,
+            responseXML : xhr.responseXML,
+            argument: cb.argument,
+            status: xhr.status,
+            statusText: xhr.statusText,
+            getResponseHeader : function(header){
+                return headerObj[header.toLowerCase()];
+            },
+            getAllResponseHeaders : function(){
+                return headerStr;
+            }
+        };
+    };
+    return {
+        request : function(method, uri, cb, data, options){
+            var o = {
+                type: method,
+                url: uri,
+                data: data,
+                timeout: cb.timeout,
+                complete: createComplete(cb)
+            };
+
+            if(options){
+                var hs = options.headers;
+                if(options.xmlData){
+                    o.data = options.xmlData;
+                    o.processData = false;
+                    o.type = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'text/xml';
+                    }
+                }else if(options.jsonData){
+                    o.data = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+                    o.processData = false;
+                    o.type = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'application/json';
+                    }
+                }
+                if(hs){
+                    o.beforeSend = function(xhr){
+                        for (var h in hs) {
+                            if (hs.hasOwnProperty(h)) {
+                                xhr.setRequestHeader(h, hs[h]);
+                            }
+                        }
+                    };
+                }
+            }
+            jQuery.ajax(o);
+        },
+
+        formRequest : function(form, uri, cb, data, isUpload, sslUri){
+            jQuery.ajax({
+                type: Ext.getDom(form).method ||'POST',
+                url: uri,
+                data: jQuery(form).serialize()+(data?'&'+data:''),
+                timeout: cb.timeout,
+                complete: createComplete(cb)
+            });
+        },
+
+        isCallInProgress : function(trans){
+            return false;
+        },
+
+        abort : function(trans){
+            return false;
+        },
+
+        serializeForm : function(form){
+            return jQuery(form.dom||form).serialize();
+        }
+    };
+}();
+
+Ext.lib.Anim = function(){
+    var createAnim = function(cb, scope){
+        var animated = true;
+        return {
+            stop : function(skipToLast){
+                // do nothing
+            },
+
+            isAnimated : function(){
+                return animated;
+            },
+
+            proxyCallback : function(){
+                animated = false;
+                Ext.callback(cb, scope);
+            }
+        };
+    };
+    return {
+        scroll : function(el, args, duration, easing, cb, scope){
+            // scroll anim not supported so just scroll immediately
+            var anim = createAnim(cb, scope);
+            el = Ext.getDom(el);
+            if(typeof args.scroll.to[0] == 'number'){
+                el.scrollLeft = args.scroll.to[0];
+            }
+            if(typeof args.scroll.to[1] == 'number'){
+                el.scrollTop = args.scroll.to[1];
+            }
+            anim.proxyCallback();
+            return anim;
+        },
+
+        motion : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        color : function(el, args, duration, easing, cb, scope){
+            // color anim not supported, so execute callback immediately
+            var anim = createAnim(cb, scope);
+            anim.proxyCallback();
+            return anim;
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type){
+            var anim = createAnim(cb, scope), e = Ext.fly(el, '_animrun');
+            var o = {};
+            for(var k in args){
+                switch(k){   // jquery doesn't support, so convert
+                    case 'points':
+                        var by, pts;
+                        e.position();
+                        if(by = args.points.by){
+                            var xy = e.getXY();
+                            pts = e.translatePoints([xy[0]+by[0], xy[1]+by[1]]);
+                        }else{
+                            pts = e.translatePoints(args.points.to);
+                        }
+                        o.left = pts.left;
+                        o.top = pts.top;
+                        if(!parseInt(e.getStyle('left'), 10)){ // auto bug
+                            e.setLeft(0);
+                        }
+                        if(!parseInt(e.getStyle('top'), 10)){
+                            e.setTop(0);
+                        }
+                        if(args.points.from){
+                            e.setXY(args.points.from);
+                        }
+                    break;
+                    case 'width':
+                        o.width = args.width.to;
+                        if (args.width.from)
+                            e.setWidth(args.width.from);
+                    break;
+                    case 'height':
+                        o.height = args.height.to;
+                        if (args.height.from)
+                            e.setHeight(args.height.from);
+                    break;
+                    case 'opacity':
+                        o.opacity = args.opacity.to;
+                        if (args.opacity.from)
+                            e.setOpacity(args.opacity.from);
+                    break;
+                    case 'left':
+                        o.left = args.left.to;
+                        if (args.left.from)
+                            e.setLeft(args.left.from);
+                    break;
+                    case 'top':
+                        o.top = args.top.to;
+                        if (args.top.from)
+                            e.setTop(args.top.from);
+                    break;
+                        // jQuery can't handle callback, scope, and xy arguments, so break here
+                    case 'callback':
+                    case 'scope':
+                    case 'xy':
+                    break;
+
+                    default:
+                        o[k] = args[k].to;
+                        if (args[k].from)
+                            e.setStyle(k, args[k].from);
+                    break;
+                }
+            }
+            // TODO: find out about easing plug in?
+            jQuery(el).animate(o, duration*1000, undefined, anim.proxyCallback);
+            return anim;
+        }
+    };
+}();
+
+
+Ext.lib.Region = function(t, r, b, l) {
+    this.top = t;
+    this[1] = t;
+    this.right = r;
+    this.bottom = b;
+    this.left = l;
+    this[0] = l;
+};
+
+Ext.lib.Region.prototype = {
+    contains : function(region) {
+        return ( region.left   >= this.left   &&
+                 region.right  <= this.right  &&
+                 region.top    >= this.top    &&
+                 region.bottom <= this.bottom    );
+
+    },
+
+    getArea : function() {
+        return ( (this.bottom - this.top) * (this.right - this.left) );
+    },
+
+    intersect : function(region) {
+        var t = Math.max( this.top,    region.top    );
+        var r = Math.min( this.right,  region.right  );
+        var b = Math.min( this.bottom, region.bottom );
+        var l = Math.max( this.left,   region.left   );
+
+        if (b >= t && r >= l) {
+            return new Ext.lib.Region(t, r, b, l);
+        } else {
+            return null;
+        }
+    },
+    union : function(region) {
+        var t = Math.min( this.top,    region.top    );
+        var r = Math.max( this.right,  region.right  );
+        var b = Math.max( this.bottom, region.bottom );
+        var l = Math.min( this.left,   region.left   );
+
+        return new Ext.lib.Region(t, r, b, l);
+    },
+
+    constrainTo : function(r) {
+            this.top = this.top.constrain(r.top, r.bottom);
+            this.bottom = this.bottom.constrain(r.top, r.bottom);
+            this.left = this.left.constrain(r.left, r.right);
+            this.right = this.right.constrain(r.left, r.right);
+            return this;
+    },
+
+    adjust : function(t, l, b, r){
+        this.top += t;
+        this.left += l;
+        this.right += r;
+        this.bottom += b;
+        return this;
+    }
+};
+
+Ext.lib.Region.getRegion = function(el) {
+    var p = Ext.lib.Dom.getXY(el);
+
+    var t = p[1];
+    var r = p[0] + el.offsetWidth;
+    var b = p[1] + el.offsetHeight;
+    var l = p[0];
+
+    return new Ext.lib.Region(t, r, b, l);
+};
+
+Ext.lib.Point = function(x, y) {
+   if (Ext.isArray(x)) {
+      y = x[1];
+      x = x[0];
+   }
+    this.x = this.right = this.left = this[0] = x;
+    this.y = this.top = this.bottom = this[1] = y;
+};
+
+Ext.lib.Point.prototype = new Ext.lib.Region();
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/adapter/prototype-bridge.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/adapter/prototype-bridge.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/adapter/prototype-bridge.js	(revision 76)
@@ -0,0 +1,608 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+
+var libFlyweight,
+    version = Prototype.Version.split('.'),
+    mouseEnterSupported = (parseInt(version[0], 10) >= 2) || (parseInt(version[1], 10) >= 7) || (parseInt(version[2], 10) >= 1),
+    mouseCache = {},
+    elContains = function(parent, child) {
+       if(parent && parent.firstChild){
+         while(child) {
+            if(child === parent) {
+                return true;
+            }
+            child = child.parentNode;
+            if(child && (child.nodeType != 1)) {
+                child = null;
+            }
+          }
+        }
+        return false;
+    },
+    checkRelatedTarget = function(e) {
+        return !elContains(e.currentTarget, Ext.lib.Event.getRelatedTarget(e));
+    };
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        return full ? this.getDocumentWidth() : this.getViewportWidth();
+    },
+
+    getViewHeight : function(full){
+        return full ? this.getDocumentHeight() : this.getViewportHeight();
+    },
+
+    getDocumentHeight: function() { // missing from prototype?
+        var scrollHeight = (document.compatMode != "CSS1Compat") ? document.body.scrollHeight : document.documentElement.scrollHeight;
+        return Math.max(scrollHeight, this.getViewportHeight());
+    },
+
+    getDocumentWidth: function() { // missing from prototype?
+        var scrollWidth = (document.compatMode != "CSS1Compat") ? document.body.scrollWidth : document.documentElement.scrollWidth;
+        return Math.max(scrollWidth, this.getViewportWidth());
+    },
+
+    getViewportHeight: function() { // missing from prototype?
+        var height = self.innerHeight;
+        var mode = document.compatMode;
+
+        if ( (mode || Ext.isIE) && !Ext.isOpera ) {
+            height = (mode == "CSS1Compat") ?
+                    document.documentElement.clientHeight : // Standards
+                    document.body.clientHeight; // Quirks
+        }
+
+        return height;
+    },
+
+    getViewportWidth: function() { // missing from prototype?
+        var width = self.innerWidth;  // Safari
+        var mode = document.compatMode;
+
+        if (mode || Ext.isIE) { // IE, Gecko, Opera
+            width = (mode == "CSS1Compat") ?
+                    document.documentElement.clientWidth : // Standards
+                    document.body.clientWidth; // Quirks
+        }
+        return width;
+    },
+
+    isAncestor : function(p, c){ // missing from prototype?
+        var ret = false;
+
+        p = Ext.getDom(p);
+        c = Ext.getDom(c);
+        if (p && c) {
+            if (p.contains) {
+                return p.contains(c);
+            } else if (p.compareDocumentPosition) {
+                return !!(p.compareDocumentPosition(c) & 16);
+            } else {
+                while (c = c.parentNode) {
+                    ret = c == p || ret;
+                }
+            }
+        }
+        return ret;
+    },
+
+    getRegion : function(el){
+        return Ext.lib.Region.getRegion(el);
+    },
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    getXY : function(el){ // this initially used Position.cumulativeOffset but it is not accurate enough
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){ // this initially used Position.cumulativeOffset but it is not accurate enough
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+Ext.lib.Event = {
+    getPageX : function(e){
+        return Event.pointerX(e.browserEvent || e);
+    },
+
+    getPageY : function(e){
+        return Event.pointerY(e.browserEvent || e);
+    },
+
+    getXY : function(e){
+        e = e.browserEvent || e;
+        return [Event.pointerX(e), Event.pointerY(e)];
+    },
+
+    getTarget : function(e){
+        return Event.element(e.browserEvent || e);
+    },
+
+    resolveTextNode: Ext.isGecko ? function(node){
+        if(!node){
+            return;
+        }
+        var s = HTMLElement.prototype.toString.call(node);
+        if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+            return;
+        }
+        return node.nodeType == 3 ? node.parentNode : node;
+    } : function(node){
+        return node && node.nodeType == 3 ? node.parentNode : node;
+    },
+
+    getRelatedTarget: function(ev) { // missing from prototype?
+        ev = ev.browserEvent || ev;
+        var t = ev.relatedTarget;
+        if (!t) {
+            if (ev.type == "mouseout") {
+                t = ev.toElement;
+            } else if (ev.type == "mouseover") {
+                t = ev.fromElement;
+            }
+        }
+
+        return this.resolveTextNode(t);
+    },
+
+    on : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id] || (mouseCache[el.id] = {});
+            item[eventName] = fn;
+            fn = fn.createInterceptor(checkRelatedTarget);
+            eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+        }
+        Event.observe(el, eventName, fn, false);
+    },
+
+    un : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id],
+                ev = item && item[eventName];
+
+            if(ev){
+                fn = ev.fn;
+                delete item[eventName];
+                eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+            }
+        }
+        Event.stopObserving(el, eventName, fn, false);
+    },
+
+    purgeElement : function(el){
+        // no equiv?
+    },
+
+    preventDefault : function(e){   // missing from prototype?
+        e = e.browserEvent || e;
+        if(e.preventDefault) {
+            e.preventDefault();
+        } else {
+            e.returnValue = false;
+        }
+    },
+
+    stopPropagation : function(e){   // missing from prototype?
+        e = e.browserEvent || e;
+        if(e.stopPropagation) {
+            e.stopPropagation();
+        } else {
+            e.cancelBubble = true;
+        }
+    },
+
+    stopEvent : function(e){
+        Event.stop(e.browserEvent || e);
+    },
+
+    onAvailable : function(id, fn, scope){  // no equiv
+        var start = new Date(), iid;
+        var f = function(){
+            if(start.getElapsed() > 10000){
+                clearInterval(iid);
+            }
+            var el = document.getElementById(id);
+            if(el){
+                clearInterval(iid);
+                fn.call(scope||window, el);
+            }
+        };
+        iid = setInterval(f, 50);
+    }
+};
+
+Ext.lib.Ajax = function(){
+    var createSuccess = function(cb){
+         return cb.success ? function(xhr){
+            cb.success.call(cb.scope||window, createResponse(cb, xhr));
+         } : Ext.emptyFn;
+    };
+    var createFailure = function(cb){
+         return cb.failure ? function(xhr){
+            cb.failure.call(cb.scope||window, createResponse(cb, xhr));
+         } : Ext.emptyFn;
+    };
+    var createResponse = function(cb, xhr){
+        var headerObj = {},
+            headerStr,
+            t,
+            s;
+
+        try {
+            headerStr = xhr.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            responseText: xhr.responseText,
+            responseXML : xhr.responseXML,
+            argument: cb.argument,
+            status: xhr.status,
+            statusText: xhr.statusText,
+            getResponseHeader : function(header){
+                return headerObj[header.toLowerCase()];
+            },
+            getAllResponseHeaders : function(){
+                return headerStr;
+            }
+        };
+    };
+    return {
+        request : function(method, uri, cb, data, options){
+            var o = {
+                method: method,
+                parameters: data || '',
+                timeout: cb.timeout,
+                onSuccess: createSuccess(cb),
+                onFailure: createFailure(cb)
+            };
+            if(options){
+                var hs = options.headers;
+                if(hs){
+                    o.requestHeaders = hs;
+                }
+                if(options.xmlData){
+                    method = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'text/xml';
+                    }
+                    o.postBody = options.xmlData;
+                    delete o.parameters;
+                }
+                if(options.jsonData){
+                    method = (method ? method : (options.method ? options.method : 'POST'));
+                    if (!hs || !hs['Content-Type']){
+                        o.contentType = 'application/json';
+                    }
+                    o.postBody = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+                    delete o.parameters;
+                }
+            }
+            new Ajax.Request(uri, o);
+        },
+
+        formRequest : function(form, uri, cb, data, isUpload, sslUri){
+            new Ajax.Request(uri, {
+                method: Ext.getDom(form).method ||'POST',
+                parameters: Form.serialize(form)+(data?'&'+data:''),
+                timeout: cb.timeout,
+                onSuccess: createSuccess(cb),
+                onFailure: createFailure(cb)
+            });
+        },
+
+        isCallInProgress : function(trans){
+            return false;
+        },
+
+        abort : function(trans){
+            return false;
+        },
+
+        serializeForm : function(form){
+            return Form.serialize(form.dom||form);
+        }
+    };
+}();
+
+
+Ext.lib.Anim = function(){
+
+    var easings = {
+        easeOut: function(pos) {
+            return 1-Math.pow(1-pos,2);
+        },
+        easeIn: function(pos) {
+            return 1-Math.pow(1-pos,2);
+        }
+    };
+    var createAnim = function(cb, scope){
+        return {
+            stop : function(skipToLast){
+                this.effect.cancel();
+            },
+
+            isAnimated : function(){
+                return this.effect.state == 'running';
+            },
+
+            proxyCallback : function(){
+                Ext.callback(cb, scope);
+            }
+        };
+    };
+    return {
+        scroll : function(el, args, duration, easing, cb, scope){
+            // not supported so scroll immediately?
+            var anim = createAnim(cb, scope);
+            el = Ext.getDom(el);
+            if(typeof args.scroll.to[0] == 'number'){
+                el.scrollLeft = args.scroll.to[0];
+            }
+            if(typeof args.scroll.to[1] == 'number'){
+                el.scrollTop = args.scroll.to[1];
+            }
+            anim.proxyCallback();
+            return anim;
+        },
+
+        motion : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        color : function(el, args, duration, easing, cb, scope){
+            return this.run(el, args, duration, easing, cb, scope);
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type){
+            var o = {};
+            for(var k in args){
+                switch(k){   // scriptaculous doesn't support, so convert these
+                    case 'points':
+                        var by, pts, e = Ext.fly(el, '_animrun');
+                        e.position();
+                        if(by = args.points.by){
+                            var xy = e.getXY();
+                            pts = e.translatePoints([xy[0]+by[0], xy[1]+by[1]]);
+                        }else{
+                            pts = e.translatePoints(args.points.to);
+                        }
+                        o.left = pts.left+'px';
+                        o.top = pts.top+'px';
+                    break;
+                    case 'width':
+                        o.width = args.width.to+'px';
+                    break;
+                    case 'height':
+                        o.height = args.height.to+'px';
+                    break;
+                    case 'opacity':
+                        o.opacity = String(args.opacity.to);
+                    break;
+                    default:
+                        o[k] = String(args[k].to);
+                    break;
+                }
+            }
+            var anim = createAnim(cb, scope);
+            anim.effect = new Effect.Morph(Ext.id(el), {
+                duration: duration,
+                afterFinish: anim.proxyCallback,
+                transition: easings[easing] || Effect.Transitions.linear,
+                style: o
+            });
+            return anim;
+        }
+    };
+}();
+
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+
+Ext.lib.Region = function(t, r, b, l) {
+    this.top = t;
+    this[1] = t;
+    this.right = r;
+    this.bottom = b;
+    this.left = l;
+    this[0] = l;
+};
+
+Ext.lib.Region.prototype = {
+    contains : function(region) {
+        return ( region.left   >= this.left   &&
+                 region.right  <= this.right  &&
+                 region.top    >= this.top    &&
+                 region.bottom <= this.bottom    );
+
+    },
+
+    getArea : function() {
+        return ( (this.bottom - this.top) * (this.right - this.left) );
+    },
+
+    intersect : function(region) {
+        var t = Math.max( this.top,    region.top    );
+        var r = Math.min( this.right,  region.right  );
+        var b = Math.min( this.bottom, region.bottom );
+        var l = Math.max( this.left,   region.left   );
+
+        if (b >= t && r >= l) {
+            return new Ext.lib.Region(t, r, b, l);
+        } else {
+            return null;
+        }
+    },
+    union : function(region) {
+        var t = Math.min( this.top,    region.top    );
+        var r = Math.max( this.right,  region.right  );
+        var b = Math.max( this.bottom, region.bottom );
+        var l = Math.min( this.left,   region.left   );
+
+        return new Ext.lib.Region(t, r, b, l);
+    },
+
+    constrainTo : function(r) {
+            this.top = this.top.constrain(r.top, r.bottom);
+            this.bottom = this.bottom.constrain(r.top, r.bottom);
+            this.left = this.left.constrain(r.left, r.right);
+            this.right = this.right.constrain(r.left, r.right);
+            return this;
+    },
+
+    adjust : function(t, l, b, r){
+        this.top += t;
+        this.left += l;
+        this.right += r;
+        this.bottom += b;
+        return this;
+    }
+};
+
+Ext.lib.Region.getRegion = function(el) {
+    var p = Ext.lib.Dom.getXY(el);
+
+    var t = p[1];
+    var r = p[0] + el.offsetWidth;
+    var b = p[1] + el.offsetHeight;
+    var l = p[0];
+
+    return new Ext.lib.Region(t, r, b, l);
+};
+
+Ext.lib.Point = function(x, y) {
+   if (Ext.isArray(x)) {
+      y = x[1];
+      x = x[0];
+   }
+    this.x = this.right = this.left = this[0] = x;
+    this.y = this.top = this.bottom = this[1] = y;
+};
+
+Ext.lib.Point.prototype = new Ext.lib.Region();
+
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/adapter/yui-bridge.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/adapter/yui-bridge.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/adapter/yui-bridge.js	(revision 76)
@@ -0,0 +1,374 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+if(typeof YAHOO == "undefined"){
+    throw "Unable to load Ext, core YUI utilities (yahoo, dom, event) not found.";
+}
+
+(function(){
+    var E = YAHOO.util.Event,
+        D = YAHOO.util.Dom,
+        CN = YAHOO.util.Connect,
+        ES = YAHOO.util.Easing,
+        A = YAHOO.util.Anim,
+        libFlyweight,
+        version = YAHOO.env.getVersion('yahoo').version.split('.'),
+        mouseEnterSupported = parseInt(version[0], 10) >= 3,
+        mouseCache = {},
+        elContains = function(parent, child){
+            if(parent && parent.firstChild){
+                while(child){
+                    if(child === parent){
+                        return true;
+                    }
+                    child = child.parentNode;
+                    if(child && (child.nodeType != 1)){
+                        child = null;
+                    }
+                }
+            }
+            return false;
+        }, checkRelatedTarget = function(e){
+            return !elContains(e.currentTarget, Ext.lib.Event.getRelatedTarget(e));
+        };
+
+Ext.lib.Dom = {
+    getViewWidth : function(full){
+        return full ? D.getDocumentWidth() : D.getViewportWidth();
+    },
+
+    getViewHeight : function(full){
+        return full ? D.getDocumentHeight() : D.getViewportHeight();
+    },
+
+    isAncestor : function(haystack, needle){
+        return D.isAncestor(haystack, needle);
+    },
+
+    getRegion : function(el){
+        return D.getRegion(el);
+    },
+
+    getY : function(el){
+        return this.getXY(el)[1];
+    },
+
+    getX : function(el){
+        return this.getXY(el)[0];
+    },
+
+    // original version based on YahooUI getXY
+    // this version fixes several issues in Safari and FF
+    // and boosts performance by removing the batch overhead, repetitive dom lookups and array index calls
+    getXY : function(el){
+        var p, pe, b, scroll, bd = (document.body || document.documentElement);
+        el = Ext.getDom(el);
+
+        if(el == bd){
+            return [0, 0];
+        }
+
+        if (el.getBoundingClientRect) {
+            b = el.getBoundingClientRect();
+            scroll = fly(document).getScroll();
+            return [Math.round(b.left + scroll.left), Math.round(b.top + scroll.top)];
+        }
+        var x = 0, y = 0;
+
+        p = el;
+
+        var hasAbsolute = fly(el).getStyle("position") == "absolute";
+
+        while (p) {
+
+            x += p.offsetLeft;
+            y += p.offsetTop;
+
+            if (!hasAbsolute && fly(p).getStyle("position") == "absolute") {
+                hasAbsolute = true;
+            }
+
+            if (Ext.isGecko) {
+                pe = fly(p);
+
+                var bt = parseInt(pe.getStyle("borderTopWidth"), 10) || 0;
+                var bl = parseInt(pe.getStyle("borderLeftWidth"), 10) || 0;
+
+
+                x += bl;
+                y += bt;
+
+
+                if (p != el && pe.getStyle('overflow') != 'visible') {
+                    x += bl;
+                    y += bt;
+                }
+            }
+            p = p.offsetParent;
+        }
+
+        if (Ext.isSafari && hasAbsolute) {
+            x -= bd.offsetLeft;
+            y -= bd.offsetTop;
+        }
+
+        if (Ext.isGecko && !hasAbsolute) {
+            var dbd = fly(bd);
+            x += parseInt(dbd.getStyle("borderLeftWidth"), 10) || 0;
+            y += parseInt(dbd.getStyle("borderTopWidth"), 10) || 0;
+        }
+
+        p = el.parentNode;
+        while (p && p != bd) {
+            if (!Ext.isOpera || (p.tagName != 'TR' && fly(p).getStyle("display") != "inline")) {
+                x -= p.scrollLeft;
+                y -= p.scrollTop;
+            }
+            p = p.parentNode;
+        }
+        return [x, y];
+    },
+
+    setXY : function(el, xy){
+        el = Ext.fly(el, '_setXY');
+        el.position();
+        var pts = el.translatePoints(xy);
+        if(xy[0] !== false){
+            el.dom.style.left = pts.left + "px";
+        }
+        if(xy[1] !== false){
+            el.dom.style.top = pts.top + "px";
+        }
+    },
+
+    setX : function(el, x){
+        this.setXY(el, [x, false]);
+    },
+
+    setY : function(el, y){
+        this.setXY(el, [false, y]);
+    }
+};
+
+Ext.lib.Event = {
+    getPageX : function(e){
+        return E.getPageX(e.browserEvent || e);
+    },
+
+    getPageY : function(e){
+        return E.getPageY(e.browserEvent || e);
+    },
+
+    getXY : function(e){
+        return E.getXY(e.browserEvent || e);
+    },
+
+    getTarget : function(e){
+        return E.getTarget(e.browserEvent || e);
+    },
+
+    getRelatedTarget : function(e){
+        return E.getRelatedTarget(e.browserEvent || e);
+    },
+
+    on : function(el, eventName, fn, scope, override){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id] || (mouseCache[el.id] = {});
+            item[eventName] = fn;
+            fn = fn.createInterceptor(checkRelatedTarget);
+            eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+        }
+        E.on(el, eventName, fn, scope, override);
+    },
+
+    un : function(el, eventName, fn){
+        if((eventName == 'mouseenter' || eventName == 'mouseleave') && !mouseEnterSupported){
+            var item = mouseCache[el.id], 
+                ev = item && item[eventName];
+
+            if(ev){
+                fn = ev.fn;
+                delete item[eventName];
+                eventName = (eventName == 'mouseenter') ? 'mouseover' : 'mouseout';
+            }
+        }
+        E.removeListener(el, eventName, fn);;
+    },
+
+    purgeElement : function(el){
+        E.purgeElement(el);
+    },
+
+    preventDefault : function(e){
+        E.preventDefault(e.browserEvent || e);
+    },
+
+    stopPropagation : function(e){
+        E.stopPropagation(e.browserEvent || e);
+    },
+
+    stopEvent : function(e){
+        E.stopEvent(e.browserEvent || e);
+    },
+
+    onAvailable : function(el, fn, scope, override){
+        return E.onAvailable(el, fn, scope, override);
+    }
+};
+
+Ext.lib.Ajax = {
+    request : function(method, uri, cb, data, options){
+        if(options){
+            var hs = options.headers;
+            if(hs){
+                for(var h in hs){
+                    if(hs.hasOwnProperty(h)){
+                        CN.initHeader(h, hs[h], false);
+                    }
+                }
+            }
+            if(options.xmlData){
+                if (!hs || !hs['Content-Type']){
+                    CN.initHeader('Content-Type', 'text/xml', false);
+                }
+                method = (method ? method : (options.method ? options.method : 'POST'));
+                data = options.xmlData;
+            }else if(options.jsonData){
+                if (!hs || !hs['Content-Type']){
+                    CN.initHeader('Content-Type', 'application/json', false);
+                }
+                method = (method ? method : (options.method ? options.method : 'POST'));
+                data = typeof options.jsonData == 'object' ? Ext.encode(options.jsonData) : options.jsonData;
+            }
+        }
+        return CN.asyncRequest(method, uri, cb, data);
+    },
+
+    formRequest : function(form, uri, cb, data, isUpload, sslUri){
+        CN.setForm(form, isUpload, sslUri);
+        return CN.asyncRequest(Ext.getDom(form).method ||'POST', uri, cb, data);
+    },
+
+    isCallInProgress : function(trans){
+        return CN.isCallInProgress(trans);
+    },
+
+    abort : function(trans){
+        return CN.abort(trans);
+    },
+
+    serializeForm : function(form){
+        var d = CN.setForm(form.dom || form);
+        CN.resetFormState();
+        return d;
+    }
+};
+
+Ext.lib.Region = YAHOO.util.Region;
+Ext.lib.Point = YAHOO.util.Point;
+
+
+Ext.lib.Anim = {
+    scroll : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.Scroll);
+    },
+
+    motion : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.Motion);
+    },
+
+    color : function(el, args, duration, easing, cb, scope){
+        this.run(el, args, duration, easing, cb, scope, YAHOO.util.ColorAnim);
+    },
+
+    run : function(el, args, duration, easing, cb, scope, type){
+        type = type || YAHOO.util.Anim;
+        if(typeof easing == "string"){
+            easing = YAHOO.util.Easing[easing];
+        }
+        var anim = new type(el, args, duration, easing);
+        anim.animateX(function(){
+            Ext.callback(cb, scope);
+        });
+        return anim;
+    }
+};
+
+// all lib flyweight calls use their own flyweight to prevent collisions with developer flyweights
+function fly(el){
+    if(!libFlyweight){
+        libFlyweight = new Ext.Element.Flyweight();
+    }
+    libFlyweight.dom = el;
+    return libFlyweight;
+}
+
+// prevent IE leaks
+if(Ext.isIE) {
+    function fnCleanUp() {
+        var p = Function.prototype;
+        delete p.createSequence;
+        delete p.defer;
+        delete p.createDelegate;
+        delete p.createCallback;
+        delete p.createInterceptor;
+
+        window.detachEvent("onunload", fnCleanUp);
+    }
+    window.attachEvent("onunload", fnCleanUp);
+}
+// various overrides
+
+// add ability for callbacks with animations
+if(YAHOO.util.Anim){
+    YAHOO.util.Anim.prototype.animateX = function(callback, scope){
+        var f = function(){
+            this.onComplete.unsubscribe(f);
+            if(typeof callback == "function"){
+                callback.call(scope || this, this);
+            }
+        };
+        this.onComplete.subscribe(f, this, true);
+        this.animate();
+    };
+}
+
+if(YAHOO.util.DragDrop && Ext.dd.DragDrop){
+    YAHOO.util.DragDrop.defaultPadding = Ext.dd.DragDrop.defaultPadding;
+    YAHOO.util.DragDrop.constrainTo = Ext.dd.DragDrop.constrainTo;
+}
+
+YAHOO.util.Dom.getXY = function(el) {
+    var f = function(el) {
+        return Ext.lib.Dom.getXY(el);
+    };
+    return YAHOO.util.Dom.batch(el, f, YAHOO.util.Dom, true);
+};
+
+
+// workaround for Safari anim duration speed problems
+if(YAHOO.util.AnimMgr){
+    YAHOO.util.AnimMgr.fps = 1000;
+}
+
+YAHOO.util.Region.prototype.adjust = function(t, l, b, r){
+    this.top += t;
+    this.left += l;
+    this.right += r;
+    this.bottom += b;
+    return this;
+};
+    
+YAHOO.util.Region.prototype.constrainTo = function(r) {
+    this.top = this.top.constrain(r.top, r.bottom);
+    this.bottom = this.bottom.constrain(r.top, r.bottom);
+    this.left = this.left.constrain(r.left, r.right);
+    this.right = this.right.constrain(r.left, r.right);
+    return this;
+};
+
+
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/state/CookieProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/state/CookieProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/state/CookieProvider.js	(revision 76)
@@ -0,0 +1,94 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+
+/**
+ * @class Ext.state.CookieProvider
+ * @extends Ext.state.Provider
+ * The default Provider implementation which saves state via cookies.
+ * <br />Usage:
+ <pre><code>
+   var cp = new Ext.state.CookieProvider({
+       path: "/cgi-bin/",
+       expires: new Date(new Date().getTime()+(1000*60*60*24*30)), //30 days
+       domain: "extjs.com"
+   });
+   Ext.state.Manager.setProvider(cp);
+ </code></pre>
+ * @cfg {String} path The path for which the cookie is active (defaults to root '/' which makes it active for all pages in the site)
+ * @cfg {Date} expires The cookie expiration date (defaults to 7 days from now)
+ * @cfg {String} domain The domain to save the cookie for.  Note that you cannot specify a different domain than
+ * your page is on, but you can specify a sub-domain, or simply the domain itself like 'extjs.com' to include
+ * all sub-domains if you need to access cookies across different sub-domains (defaults to null which uses the same
+ * domain the page is running on including the 'www' like 'www.extjs.com')
+ * @cfg {Boolean} secure True if the site is using SSL (defaults to false)
+ * @constructor
+ * Create a new CookieProvider
+ * @param {Object} config The configuration object
+ */
+Ext.state.CookieProvider = Ext.extend(Ext.state.Provider, {
+    
+    constructor : function(config){
+        Ext.state.CookieProvider.superclass.constructor.call(this);
+        this.path = "/";
+        this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days
+        this.domain = null;
+        this.secure = false;
+        Ext.apply(this, config);
+        this.state = this.readCookies();
+    },
+    
+    // private
+    set : function(name, value){
+        if(typeof value == "undefined" || value === null){
+            this.clear(name);
+            return;
+        }
+        this.setCookie(name, value);
+        Ext.state.CookieProvider.superclass.set.call(this, name, value);
+    },
+
+    // private
+    clear : function(name){
+        this.clearCookie(name);
+        Ext.state.CookieProvider.superclass.clear.call(this, name);
+    },
+
+    // private
+    readCookies : function(){
+        var cookies = {},
+            c = document.cookie + ";",
+            re = /\s?(.*?)=(.*?);/g,
+    	    matches,
+            name,
+            value;
+    	while((matches = re.exec(c)) != null){
+            name = matches[1];
+            value = matches[2];
+            if(name && name.substring(0,3) == "ys-"){
+                cookies[name.substr(3)] = this.decodeValue(value);
+            }
+        }
+        return cookies;
+    },
+
+    // private
+    setCookie : function(name, value){
+        document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +
+           ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    },
+
+    // private
+    clearCookie : function(name){
+        document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/state/Provider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/state/Provider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/state/Provider.js	(revision 76)
@@ -0,0 +1,154 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.state.Provider
+ * Abstract base class for state provider implementations. This class provides methods
+ * for encoding and decoding <b>typed</b> variables including dates and defines the
+ * Provider interface.
+ */
+Ext.state.Provider = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(){
+        /**
+         * @event statechange
+         * Fires when a state change occurs.
+         * @param {Provider} this This state provider
+         * @param {String} key The state key which was changed
+         * @param {String} value The encoded value for the state
+         */
+        this.addEvents("statechange");
+        this.state = {};
+        Ext.state.Provider.superclass.constructor.call(this);
+    },
+    
+    /**
+     * Returns the current value for a key
+     * @param {String} name The key name
+     * @param {Mixed} defaultValue A default value to return if the key's value is not found
+     * @return {Mixed} The state data
+     */
+    get : function(name, defaultValue){
+        return typeof this.state[name] == "undefined" ?
+            defaultValue : this.state[name];
+    },
+
+    /**
+     * Clears a value from the state
+     * @param {String} name The key name
+     */
+    clear : function(name){
+        delete this.state[name];
+        this.fireEvent("statechange", this, name, null);
+    },
+
+    /**
+     * Sets the value for a key
+     * @param {String} name The key name
+     * @param {Mixed} value The value to set
+     */
+    set : function(name, value){
+        this.state[name] = value;
+        this.fireEvent("statechange", this, name, value);
+    },
+
+    /**
+     * Decodes a string previously encoded with {@link #encodeValue}.
+     * @param {String} value The value to decode
+     * @return {Mixed} The decoded value
+     */
+    decodeValue : function(cookie){
+        /**
+         * a -> Array
+         * n -> Number
+         * d -> Date
+         * b -> Boolean
+         * s -> String
+         * o -> Object
+         * -> Empty (null)
+         */
+        var re = /^(a|n|d|b|s|o|e)\:(.*)$/,
+            matches = re.exec(unescape(cookie)),
+            all,
+            type,
+            v,
+            kv;
+        if(!matches || !matches[1]){
+            return; // non state cookie
+        }
+        type = matches[1];
+        v = matches[2];
+        switch(type){
+            case 'e':
+                return null;
+            case 'n':
+                return parseFloat(v);
+            case 'd':
+                return new Date(Date.parse(v));
+            case 'b':
+                return (v == '1');
+            case 'a':
+                all = [];
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        all.push(this.decodeValue(val));
+                    }, this);
+                }
+                return all;
+           case 'o':
+                all = {};
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        kv = val.split('=');
+                        all[kv[0]] = this.decodeValue(kv[1]);
+                    }, this);
+                }
+                return all;
+           default:
+                return v;
+        }
+    },
+
+    /**
+     * Encodes a value including type information.  Decode with {@link #decodeValue}.
+     * @param {Mixed} value The value to encode
+     * @return {String} The encoded value
+     */
+    encodeValue : function(v){
+        var enc,
+            flat = '',
+            i = 0,
+            len,
+            key;
+        if(v == null){
+            return 'e:1';    
+        }else if(typeof v == 'number'){
+            enc = 'n:' + v;
+        }else if(typeof v == 'boolean'){
+            enc = 'b:' + (v ? '1' : '0');
+        }else if(Ext.isDate(v)){
+            enc = 'd:' + v.toGMTString();
+        }else if(Ext.isArray(v)){
+            for(len = v.length; i < len; i++){
+                flat += this.encodeValue(v[i]);
+                if(i != len - 1){
+                    flat += '^';
+                }
+            }
+            enc = 'a:' + flat;
+        }else if(typeof v == 'object'){
+            for(key in v){
+                if(typeof v[key] != 'function' && v[key] !== undefined){
+                    flat += key + '=' + this.encodeValue(v[key]) + '^';
+                }
+            }
+            enc = 'o:' + flat.substring(0, flat.length-1);
+        }else{
+            enc = 's:' + v;
+        }
+        return escape(enc);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/state/StateManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/state/StateManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/state/StateManager.js	(revision 76)
@@ -0,0 +1,69 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.state.Manager
+ * This is the global state manager. By default all components that are "state aware" check this class
+ * for state information if you don't pass them a custom state provider. In order for this class
+ * to be useful, it must be initialized with a provider when your application initializes. Example usage:
+ <pre><code>
+// in your initialization function
+init : function(){
+   Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+   var win = new Window(...);
+   win.restoreState();
+}
+ </code></pre>
+ * @singleton
+ */
+Ext.state.Manager = function(){
+    var provider = new Ext.state.Provider();
+
+    return {
+        /**
+         * Configures the default state provider for your application
+         * @param {Provider} stateProvider The state provider to set
+         */
+        setProvider : function(stateProvider){
+            provider = stateProvider;
+        },
+
+        /**
+         * Returns the current value for a key
+         * @param {String} name The key name
+         * @param {Mixed} defaultValue The default value to return if the key lookup does not match
+         * @return {Mixed} The state data
+         */
+        get : function(key, defaultValue){
+            return provider.get(key, defaultValue);
+        },
+
+        /**
+         * Sets the value for a key
+         * @param {String} name The key name
+         * @param {Mixed} value The state data
+         */
+         set : function(key, value){
+            provider.set(key, value);
+        },
+
+        /**
+         * Clears a value from the state
+         * @param {String} name The key name
+         */
+        clear : function(key){
+            provider.clear(key);
+        },
+
+        /**
+         * Gets the currently configured state provider
+         * @return {Provider} The state provider
+         */
+        getProvider : function(){
+            return provider;
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/debug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/debug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/debug.js	(revision 76)
@@ -0,0 +1,907 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.debug = {};
+
+(function(){
+
+var cp;
+
+function createConsole(){
+
+    var scriptPanel = new Ext.debug.ScriptsPanel();
+    var logView = new Ext.debug.LogPanel();
+    var tree = new Ext.debug.DomTree();
+    var compInspector = new Ext.debug.ComponentInspector();
+    var compInfoPanel = new Ext.debug.ComponentInfoPanel();
+    var storeInspector = new Ext.debug.StoreInspector();
+    var objInspector = new Ext.debug.ObjectInspector();
+
+    var tabs = new Ext.TabPanel({
+        activeTab: 0,
+        border: false,
+        tabPosition: 'bottom',
+        items: [{
+            title: 'Debug Console',
+            layout:'border',
+            items: [logView, scriptPanel]
+        },{
+            title: 'HTML Inspector',
+            layout:'border',
+            items: [tree]
+        },{
+            title: 'Component Inspector',
+            layout: 'border',
+            items: [compInspector,compInfoPanel]
+        },{
+            title: 'Object Inspector',
+            layout: 'border',
+            items: [objInspector]
+        },{
+            title: 'Data Stores',
+            layout: 'border',
+            items: [storeInspector]
+        }]
+    });
+
+    cp = new Ext.Panel({
+        id: 'x-debug-browser',
+        title: 'Console',
+        collapsible: true,
+        animCollapse: false,
+        style: 'position:absolute;left:0;bottom:0;z-index:101',
+        height:200,
+        logView: logView,
+        layout: 'fit',
+
+        tools:[{
+            id: 'close',
+            handler: function(){
+                cp.destroy();
+                cp = null;
+                Ext.EventManager.removeResizeListener(handleResize);
+            }
+        }],
+
+        items: tabs
+    });
+
+    cp.render(Ext.getBody());
+
+    cp.resizer = new Ext.Resizable(cp.el, {
+        minHeight:50,
+        handles: "n",
+        pinned: true,
+        transparent:true,
+        resizeElement : function(){
+            var box = this.proxy.getBox();
+            this.proxy.hide();
+            cp.setHeight(box.height);
+            return box;
+        }
+    });
+
+//     function handleResize(){
+//         cp.setWidth(Ext.getBody().getViewSize().width);
+//     }
+//     Ext.EventManager.onWindowResize(handleResize);
+//
+//     handleResize();
+
+    function handleResize(){
+        var b = Ext.getBody();
+        var size = b.getViewSize();
+        if(size.height < b.dom.scrollHeight) {
+            size.width -= 18;
+        }
+        cp.setWidth(size.width);
+    }
+    Ext.EventManager.onWindowResize(handleResize);
+    handleResize();
+}
+
+
+Ext.apply(Ext, {
+    log : function(){
+        if(!cp){
+            createConsole();
+        }
+        cp.logView.log.apply(cp.logView, arguments);
+    },
+
+    logf : function(format, arg1, arg2, etc){
+        Ext.log(String.format.apply(String, arguments));
+    },
+
+    dump : function(o){
+        if(typeof o == 'string' || typeof o == 'number' || typeof o == 'undefined' || Ext.isDate(o)){
+            Ext.log(o);
+        }else if(!o){
+            Ext.log("null");
+        }else if(typeof o != "object"){
+            Ext.log('Unknown return type');
+        }else if(Ext.isArray(o)){
+            Ext.log('['+o.join(',')+']');
+        }else{
+            var b = ["{\n"];
+            for(var key in o){
+                var to = typeof o[key];
+                if(to != "function" && to != "object"){
+                    b.push(String.format("  {0}: {1},\n", key, o[key]));
+                }
+            }
+            var s = b.join("");
+            if(s.length > 3){
+                s = s.substr(0, s.length-2);
+            }
+            Ext.log(s + "\n}");
+        }
+    },
+
+    _timers : {},
+
+    time : function(name){
+        name = name || "def";
+        Ext._timers[name] = new Date().getTime();
+    },
+
+    timeEnd : function(name, printResults){
+        var t = new Date().getTime();
+        name = name || "def";
+        var v = String.format("{0} ms", t-Ext._timers[name]);
+        Ext._timers[name] = new Date().getTime();
+        if(printResults !== false){
+            Ext.log('Timer ' + (name == "def" ? v : name + ": " + v));
+        }
+        return v;
+    }
+});
+
+})();
+
+
+Ext.debug.ScriptsPanel = Ext.extend(Ext.Panel, {
+    id:'x-debug-scripts',
+    region: 'east',
+    minWidth: 200,
+    split: true,
+    width: 350,
+    border: false,
+    layout:'anchor',
+    style:'border-width:0 0 0 1px;',
+
+    initComponent : function(){
+
+        this.scriptField = new Ext.form.TextArea({
+            anchor: '100% -26',
+            style:'border-width:0;'
+        });
+
+        this.trapBox = new Ext.form.Checkbox({
+            id: 'console-trap',
+            boxLabel: 'Trap Errors',
+            checked: true
+        });
+
+        this.toolbar = new Ext.Toolbar([{
+                text: 'Run',
+                scope: this,
+                handler: this.evalScript
+            },{
+                text: 'Clear',
+                scope: this,
+                handler: this.clear
+            },
+            '->',
+            this.trapBox,
+            ' ', ' '
+        ]);
+
+        this.items = [this.toolbar, this.scriptField];
+
+        Ext.debug.ScriptsPanel.superclass.initComponent.call(this);
+    },
+
+    evalScript : function(){
+        var s = this.scriptField.getValue();
+        if(this.trapBox.getValue()){
+            try{
+                var rt = eval(s);
+                Ext.dump(rt === undefined? '(no return)' : rt);
+            }catch(e){
+                Ext.log(e.message || e.descript);
+            }
+        }else{
+            var rt = eval(s);
+            Ext.dump(rt === undefined? '(no return)' : rt);
+        }
+    },
+
+    clear : function(){
+        this.scriptField.setValue('');
+        this.scriptField.focus();
+    }
+
+});
+
+Ext.debug.LogPanel = Ext.extend(Ext.Panel, {
+    autoScroll: true,
+    region: 'center',
+    border: false,
+    style:'border-width:0 1px 0 0',
+
+    log : function(){
+        var markup = [  '<div style="padding:5px !important;border-bottom:1px solid #ccc;">',
+                    Ext.util.Format.htmlEncode(Array.prototype.join.call(arguments, ', ')).replace(/\n/g, '<br/>').replace(/\s/g, '&#160;'),
+                    '</div>'].join(''),
+            bd = this.body.dom;
+
+        this.body.insertHtml('beforeend', markup);
+        bd.scrollTop = bd.scrollHeight;
+    },
+
+    clear : function(){
+        this.body.update('');
+        this.body.dom.scrollTop = 0;
+    }
+});
+
+Ext.debug.DomTree = Ext.extend(Ext.tree.TreePanel, {
+    enableDD:false ,
+    lines:false,
+    rootVisible:false,
+    animate:false,
+    hlColor:'ffff9c',
+    autoScroll: true,
+    region:'center',
+    border:false,
+
+    initComponent : function(){
+
+
+        Ext.debug.DomTree.superclass.initComponent.call(this);
+
+        // tree related stuff
+        var styles = false, hnode;
+        var nonSpace = /^\s*$/;
+        var html = Ext.util.Format.htmlEncode;
+        var ellipsis = Ext.util.Format.ellipsis;
+        var styleRe = /\s?([a-z\-]*)\:([^;]*)(?:[;\s\n\r]*)/gi;
+
+        function findNode(n){
+            if(!n || n.nodeType != 1 || n == document.body || n == document){
+                return false;
+            }
+            var pn = [n], p = n;
+            while((p = p.parentNode) && p.nodeType == 1 && p.tagName.toUpperCase() != 'HTML'){
+                pn.unshift(p);
+            }
+            var cn = hnode;
+            for(var i = 0, len = pn.length; i < len; i++){
+                cn.expand();
+                cn = cn.findChild('htmlNode', pn[i]);
+                if(!cn){ // in this dialog?
+                    return false;
+                }
+            }
+            cn.select();
+            var a = cn.ui.anchor;
+            this.getTreeEl().dom.scrollTop = Math.max(0 ,a.offsetTop-10);
+            //treeEl.dom.scrollLeft = Math.max(0 ,a.offsetLeft-10); no likey
+            cn.highlight();
+            return true;
+        }
+
+        function nodeTitle(n){
+            var s = n.tagName;
+            if(n.id){
+                s += '#'+n.id;
+            }else if(n.className){
+                s += '.'+n.className;
+            }
+            return s;
+        }
+
+        /*
+        function onNodeSelect(t, n, last){
+            return;
+            if(last && last.unframe){
+                last.unframe();
+            }
+            var props = {};
+            if(n && n.htmlNode){
+                if(frameEl.pressed){
+                    n.frame();
+                }
+                if(inspecting){
+                    return;
+                }
+                addStyle.enable();
+                reload.setDisabled(n.leaf);
+                var dom = n.htmlNode;
+                stylePanel.setTitle(nodeTitle(dom));
+                if(styles && !showAll.pressed){
+                    var s = dom.style ? dom.style.cssText : '';
+                    if(s){
+                        var m;
+                        while ((m = styleRe.exec(s)) != null){
+                            props[m[1].toLowerCase()] = m[2];
+                        }
+                    }
+                }else if(styles){
+                    var cl = Ext.debug.cssList;
+                    var s = dom.style, fly = Ext.fly(dom);
+                    if(s){
+                        for(var i = 0, len = cl.length; i<len; i++){
+                            var st = cl[i];
+                            var v = s[st] || fly.getStyle(st);
+                            if(v != undefined && v !== null && v !== ''){
+                                props[st] = v;
+                            }
+                        }
+                    }
+                }else{
+                    for(var a in dom){
+                        var v = dom[a];
+                        if((isNaN(a+10)) && v != undefined && v !== null && v !== '' && !(Ext.isGecko && a[0] == a[0].toUpperCase())){
+                            props[a] = v;
+                        }
+                    }
+                }
+            }else{
+                if(inspecting){
+                    return;
+                }
+                addStyle.disable();
+                reload.disabled();
+            }
+            stylesGrid.setSource(props);
+            stylesGrid.treeNode = n;
+            stylesGrid.view.fitColumns();
+        }
+        */
+
+        this.loader = new Ext.tree.TreeLoader();
+        this.loader.load = function(n, cb){
+            var isBody = n.htmlNode == document.body;
+            var cn = n.htmlNode.childNodes;
+            for(var i = 0, c; c = cn[i]; i++){
+                if(isBody && c.id == 'x-debug-browser'){
+                    continue;
+                }
+                if(c.nodeType == 1){
+                    n.appendChild(new Ext.debug.HtmlNode(c));
+                }else if(c.nodeType == 3 && !nonSpace.test(c.nodeValue)){
+                    n.appendChild(new Ext.tree.TreeNode({
+                        text:'<em>' + ellipsis(html(String(c.nodeValue)), 35) + '</em>',
+                        cls: 'x-tree-noicon'
+                    }));
+                }
+            }
+            cb();
+        };
+
+        //tree.getSelectionModel().on('selectionchange', onNodeSelect, null, {buffer:250});
+
+        this.root = this.setRootNode(new Ext.tree.TreeNode('Ext'));
+
+        hnode = this.root.appendChild(new Ext.debug.HtmlNode(
+                document.getElementsByTagName('html')[0]
+        ));
+
+    }
+});
+
+Ext.debug.ComponentNodeUI = Ext.extend(Ext.tree.TreeNodeUI,{
+    onOver : function(e){
+        Ext.debug.ComponentNodeUI.superclass.onOver.call(this);
+        var cmp = this.node.attributes.component;
+        if (cmp.el && cmp.el.mask && cmp.id !='x-debug-browser') {
+            try { // Oddly bombs on some elements in IE, gets any we care about though
+                cmp.el.mask();
+            } catch(e) {}
+        }
+    },
+
+    onOut : function(e){
+        Ext.debug.ComponentNodeUI.superclass.onOut.call(this);
+        var cmp = this.node.attributes.component;
+        if (cmp.el && cmp.el.unmask && cmp.id !='x-debug-browser') {
+            try {
+                cmp.el.unmask();
+            } catch(e) {}
+        }
+    }
+});
+
+Ext.debug.ComponentInspector = Ext.extend(Ext.tree.TreePanel, {
+    enableDD:false ,
+    lines:false,
+    rootVisible:false,
+    animate:false,
+    hlColor:'ffff9c',
+    autoScroll: true,
+    region:'center',
+    border:false,
+
+    initComponent : function(){
+        this.loader = new Ext.tree.TreeLoader();
+        this.bbar = new Ext.Toolbar([{
+            text: 'Refresh',
+            handler: this.refresh,
+            scope: this
+        }]);
+        Ext.debug.ComponentInspector.superclass.initComponent.call(this);
+
+        this.root = this.setRootNode(new Ext.tree.TreeNode({
+            text: 'Ext Components',
+            component: Ext.ComponentMgr.all,
+            leaf: false
+        }));
+        this.parseRootNode();
+
+        this.on('click', this.onClick, this);
+    },
+
+    createNode: function(n,c) {
+        var leaf = (c.items && c.items.length > 0);
+        return n.appendChild(new Ext.tree.TreeNode({
+            text: c.id + (c.getXType() ? ' [ ' + c.getXType() + ' ]': '' ),
+            component: c,
+            uiProvider:Ext.debug.ComponentNodeUI,
+            leaf: !leaf
+        }));
+    },
+
+    parseChildItems: function(n) {
+        var cn = n.attributes.component.items;
+        if (cn) {
+            for (var i = 0;i < cn.length; i++) {
+                var c = cn.get(i);
+                if (c.id != this.id && c.id != this.bottomToolbar.id) {
+                    var newNode = this.createNode(n,c);
+                    if (!newNode.leaf) {
+                        this.parseChildItems(newNode);
+                    }
+                }
+            }
+        }
+    },
+
+    parseRootNode: function() {
+        var n = this.root;
+        var cn = n.attributes.component.items;
+        for (var i = 0,c;c = cn[i];i++) {
+            if (c.id != this.id && c.id != this.bottomToolbar.id) {
+                if (!c.ownerCt) {
+                    var newNode = this.createNode(n,c);
+                    if (!newNode.leaf) {
+                        this.parseChildItems(newNode);
+                    }
+                }
+            }
+        }
+    },
+
+    onClick: function(node, e) {
+        var oi = Ext.getCmp('x-debug-objinspector');
+        oi.refreshNodes(node.attributes.component);
+        oi.ownerCt.show();
+    },
+
+    refresh: function() {
+        while (this.root.firstChild) {
+            this.root.removeChild(this.root.firstChild);
+        }
+        this.parseRootNode();
+        var ci = Ext.getCmp('x-debug-compinfo');
+        if (ci) {
+            ci.message('refreshed component tree - '+Ext.ComponentMgr.all.length);
+        }
+    }
+});
+
+Ext.debug.ComponentInfoPanel = Ext.extend(Ext.Panel,{
+    id:'x-debug-compinfo',
+    region: 'east',
+    minWidth: 200,
+    split: true,
+    width: 350,
+    border: false,
+    autoScroll: true,
+    layout:'anchor',
+    style:'border-width:0 0 0 1px;',
+
+    initComponent: function() {
+        this.watchBox = new Ext.form.Checkbox({
+            id: 'x-debug-watchcomp',
+            boxLabel: 'Watch ComponentMgr',
+            listeners: {
+                check: function(cb, val) {
+                    if (val) {
+                        Ext.ComponentMgr.all.on('add', this.onAdd, this);
+                        Ext.ComponentMgr.all.on('remove', this.onRemove, this);
+                    } else {
+                        Ext.ComponentMgr.all.un('add', this.onAdd, this);
+                        Ext.ComponentMgr.all.un('remove', this.onRemove, this);
+                    }
+                },
+                scope: this
+            }
+        });
+
+        this.tbar = new Ext.Toolbar([{
+            text: 'Clear',
+            handler: this.clear,
+            scope: this
+        },'->',this.watchBox
+        ]);
+        Ext.debug.ComponentInfoPanel.superclass.initComponent.call(this);
+    },
+
+    onAdd: function(i, o, key) {
+        var markup = ['<div style="padding:5px !important;border-bottom:1px solid #ccc;">',
+                    'Added: '+o.id,
+                    '</div>'].join('');
+        this.insertMarkup(markup);
+    },
+
+    onRemove: function(o, key) {
+        var markup = ['<div style="padding:5px !important;border-bottom:1px solid #ccc;">',
+                    'Removed: '+o.id,
+                    '</div>'].join('');
+        this.insertMarkup(markup);
+    },
+
+    message: function(msg) {
+        var markup = ['<div style="padding:5px !important;border-bottom:1px solid #ccc;">',
+                    msg,
+                    '</div>'].join('');
+        this.insertMarkup(markup);
+    },
+    insertMarkup: function(markup) {
+        this.body.insertHtml('beforeend', markup);
+        this.body.scrollTo('top', 100000);
+    },
+    clear : function(){
+        this.body.update('');
+        this.body.dom.scrollTop = 0;
+    }
+});
+
+Ext.debug.ColumnNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    focus: Ext.emptyFn, // prevent odd scrolling behavior
+
+    renderElements : function(n, a, targetNode, bulkRender){
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var t = n.getOwnerTree();
+        var cols = t.columns;
+        var bw = t.borderWidth;
+        var c = cols[0];
+
+        var buf = [
+             '<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ', a.cls,'">',
+                '<div class="x-tree-col" style="width:',c.width-bw,'px;">',
+                    '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+                    '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow"/>',
+                    '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on"/>',
+                    '<a hidefocus="on" class="x-tree-node-anchor" href="',a.href ? a.href : "#",'" tabIndex="1" ',
+                    a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '>',
+                    '<span unselectable="on">', n.text || (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</span></a>",
+                "</div>"];
+         for(var i = 1, len = cols.length; i < len; i++){
+             c = cols[i];
+
+             buf.push('<div class="x-tree-col ',(c.cls?c.cls:''),'" style="width:',c.width-bw,'px;">',
+                        '<div class="x-tree-col-text">',(c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</div>",
+                      "</div>");
+         }
+         buf.push(
+            '<div class="x-clear"></div></div>',
+            '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+            "</li>");
+
+        if(bulkRender !== true && n.nextSibling && n.nextSibling.ui.getEl()){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin",
+                                n.nextSibling.ui.getEl(), buf.join(""));
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf.join(""));
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.firstChild.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+        this.anchor = cs[3];
+        this.textNode = cs[3].firstChild;
+    }
+});
+
+Ext.debug.ObjectInspector = Ext.extend(Ext.tree.TreePanel, {
+    id: 'x-debug-objinspector',
+    enableDD:false ,
+    lines:false,
+    rootVisible:false,
+    animate:false,
+    hlColor:'ffff9c',
+    autoScroll: true,
+    region:'center',
+    border:false,
+    lines:false,
+    borderWidth: Ext.isBorderBox ? 0 : 2, // the combined left/right border for each cell
+    cls:'x-column-tree',
+
+    initComponent : function(){
+        this.showFunc = false;
+        this.toggleFunc = function() {
+            this.showFunc = !this.showFunc;
+            this.refreshNodes(this.currentObject);
+        };
+        this.bbar = new Ext.Toolbar([{
+            text: 'Show Functions',
+            enableToggle: true,
+            pressed: false,
+            handler: this.toggleFunc,
+            scope: this
+        }]);
+
+        Ext.apply(this,{
+            title: ' ',
+            loader: new Ext.tree.TreeLoader(),
+            columns:[{
+                header:'Property',
+                width: 300,
+                dataIndex:'name'
+            },{
+                header:'Value',
+                width: 900,
+                dataIndex:'value'
+            }]
+        });
+
+        Ext.debug.ObjectInspector.superclass.initComponent.call(this);
+
+        this.root = this.setRootNode(new Ext.tree.TreeNode({
+            text: 'Dummy Node',
+            leaf: false
+        }));
+
+        if (this.currentObject) {
+            this.parseNodes();
+        }
+    },
+
+    refreshNodes: function(newObj) {
+        this.currentObject = newObj;
+        var node = this.root;
+        while(node.firstChild){
+            node.removeChild(node.firstChild);
+        }
+        this.parseNodes();
+    },
+
+    parseNodes: function() {
+        for (var o in this.currentObject) {
+            if (!this.showFunc) {
+                if (Ext.isFunction(this.currentObject[o])) {
+                    continue;
+                }
+            }
+            this.createNode(o);
+        }
+    },
+
+    createNode: function(o) {
+        return this.root.appendChild(new Ext.tree.TreeNode({
+            name: o,
+            value: this.currentObject[o],
+            uiProvider:Ext.debug.ColumnNodeUI,
+            iconCls: 'x-debug-node',
+            leaf: true
+        }));
+    },
+
+    onRender : function(){
+        Ext.debug.ObjectInspector.superclass.onRender.apply(this, arguments);
+        this.headers = this.header.createChild({cls:'x-tree-headers'});
+
+        var cols = this.columns, c;
+        var totalWidth = 0;
+
+        for(var i = 0, len = cols.length; i < len; i++){
+             c = cols[i];
+             totalWidth += c.width;
+             this.headers.createChild({
+                 cls:'x-tree-hd ' + (c.cls?c.cls+'-hd':''),
+                 cn: {
+                     cls:'x-tree-hd-text',
+                     html: c.header
+                 },
+                 style:'width:'+(c.width-this.borderWidth)+'px;'
+             });
+        }
+        this.headers.createChild({cls:'x-clear'});
+        // prevent floats from wrapping when clipped
+        this.headers.setWidth(totalWidth);
+        this.innerCt.setWidth(totalWidth);
+    }
+});
+
+
+Ext.debug.StoreInspector = Ext.extend(Ext.tree.TreePanel, {
+    enableDD:false ,
+    lines:false,
+    rootVisible:false,
+    animate:false,
+    hlColor:'ffff9c',
+    autoScroll: true,
+    region:'center',
+    border:false,
+
+    initComponent: function() {
+        this.bbar = new Ext.Toolbar([{
+            text: 'Refresh',
+            handler: this.refresh,
+            scope: this
+        }]);
+        Ext.debug.StoreInspector.superclass.initComponent.call(this);
+
+        this.root = this.setRootNode(new Ext.tree.TreeNode({
+            text: 'Data Stores',
+            leaf: false
+        }));
+        this.on('click', this.onClick, this);
+
+        this.parseStores();
+    },
+
+    parseStores: function() {
+        var cn = Ext.StoreMgr.items;
+        for (var i = 0,c;c = cn[i];i++) {
+            this.root.appendChild({
+                text: c.storeId + ' - ' + c.totalLength + ' records',
+                component: c,
+                leaf: true
+            });
+        }
+    },
+
+    onClick: function(node, e) {
+        var oi = Ext.getCmp('x-debug-objinspector');
+        oi.refreshNodes(node.attributes.component);
+        oi.ownerCt.show();
+    },
+
+    refresh: function() {
+        while (this.root.firstChild) {
+            this.root.removeChild(this.root.firstChild);
+        }
+        this.parseStores();
+    }
+});
+
+// highly unusual class declaration
+Ext.debug.HtmlNode = function(){
+    var html = Ext.util.Format.htmlEncode;
+    var ellipsis = Ext.util.Format.ellipsis;
+    var nonSpace = /^\s*$/;
+
+    var attrs = [
+        {n: 'id', v: 'id'},
+        {n: 'className', v: 'class'},
+        {n: 'name', v: 'name'},
+        {n: 'type', v: 'type'},
+        {n: 'src', v: 'src'},
+        {n: 'href', v: 'href'}
+    ];
+
+    function hasChild(n){
+        for(var i = 0, c; c = n.childNodes[i]; i++){
+            if(c.nodeType == 1){
+                return true;
+            }
+        }
+        return false;
+    }
+
+    function renderNode(n, leaf){
+        var tag = n.tagName.toLowerCase();
+        var s = '&lt;' + tag;
+        for(var i = 0, len = attrs.length; i < len; i++){
+            var a = attrs[i];
+            var v = n[a.n];
+            if(v && !nonSpace.test(v)){
+                s += ' ' + a.v + '=&quot;<i>' + html(v) +'</i>&quot;';
+            }
+        }
+        var style = n.style ? n.style.cssText : '';
+        if(style){
+            s += ' style=&quot;<i>' + html(style.toLowerCase()) +'</i>&quot;';
+        }
+        if(leaf && n.childNodes.length > 0){
+            s+='&gt;<em>' + ellipsis(html(String(n.innerHTML)), 35) + '</em>&lt;/'+tag+'&gt;';
+        }else if(leaf){
+            s += ' /&gt;';
+        }else{
+            s += '&gt;';
+        }
+        return s;
+    }
+
+    var HtmlNode = function(n){
+        var leaf = !hasChild(n);
+        this.htmlNode = n;
+        this.tagName = n.tagName.toLowerCase();
+        var attr = {
+            text : renderNode(n, leaf),
+            leaf : leaf,
+            cls: 'x-tree-noicon'
+        };
+        HtmlNode.superclass.constructor.call(this, attr);
+        this.attributes.htmlNode = n; // for searching
+        if(!leaf){
+            this.on('expand', this.onExpand,  this);
+            this.on('collapse', this.onCollapse,  this);
+        }
+    };
+
+
+    Ext.extend(HtmlNode, Ext.tree.AsyncTreeNode, {
+        cls: 'x-tree-noicon',
+        preventHScroll: true,
+        refresh : function(highlight){
+            var leaf = !hasChild(this.htmlNode);
+            this.setText(renderNode(this.htmlNode, leaf));
+            if(highlight){
+                Ext.fly(this.ui.textNode).highlight();
+            }
+        },
+
+        onExpand : function(){
+            if(!this.closeNode && this.parentNode){
+                this.closeNode = this.parentNode.insertBefore(new Ext.tree.TreeNode({
+                    text:'&lt;/' + this.tagName + '&gt;',
+                    cls: 'x-tree-noicon'
+                }), this.nextSibling);
+            }else if(this.closeNode){
+                this.closeNode.ui.show();
+            }
+        },
+
+        onCollapse : function(){
+            if(this.closeNode){
+                this.closeNode.ui.hide();
+            }
+        },
+
+        render : function(bulkRender){
+            HtmlNode.superclass.render.call(this, bulkRender);
+        },
+
+        highlightNode : function(){
+            //Ext.fly(this.htmlNode).highlight();
+        },
+
+        highlight : function(){
+            //Ext.fly(this.ui.textNode).highlight();
+        },
+
+        frame : function(){
+            this.htmlNode.style.border = '1px solid #0000ff';
+            //this.highlightNode();
+        },
+
+        unframe : function(){
+            //Ext.fly(this.htmlNode).removeClass('x-debug-frame');
+            this.htmlNode.style.border = '';
+        }
+    });
+
+    return HtmlNode;
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/logger/logger-min.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/logger/logger-min.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/logger/logger-min.js	(revision 76)
@@ -0,0 +1,15 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+Copyright (c) 2008, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 2.6.0
+*/
+YAHOO.widget.LogMsg=function(A){this.msg=this.time=this.category=this.source=this.sourceDetail=null;if(A&&(A.constructor==Object)){for(var B in A){if(A.hasOwnProperty(B)){this[B]=A[B];}}}};YAHOO.widget.LogWriter=function(A){if(!A){YAHOO.log("Could not instantiate LogWriter due to invalid source.","error","LogWriter");return ;}this._source=A;};YAHOO.widget.LogWriter.prototype.toString=function(){return"LogWriter "+this._sSource;};YAHOO.widget.LogWriter.prototype.log=function(A,B){YAHOO.widget.Logger.log(A,B,this._source);};YAHOO.widget.LogWriter.prototype.getSource=function(){return this._source;};YAHOO.widget.LogWriter.prototype.setSource=function(A){if(!A){YAHOO.log("Could not set source due to invalid source.","error",this.toString());return ;}else{this._source=A;}};YAHOO.widget.LogWriter.prototype._source=null;YAHOO.widget.LogReader=function(B,A){this._sName=YAHOO.widget.LogReader._index;YAHOO.widget.LogReader._index++;this._buffer=[];this._filterCheckboxes={};this._lastTime=YAHOO.widget.Logger.getStartTime();if(A&&(A.constructor==Object)){for(var C in A){if(A.hasOwnProperty(C)){this[C]=A[C];}}}this._initContainerEl(B);if(!this._elContainer){YAHOO.log("Could not instantiate LogReader due to an invalid container element "+B,"error",this.toString());return ;}this._initHeaderEl();this._initConsoleEl();this._initFooterEl();this._initDragDrop();this._initCategories();this._initSources();YAHOO.widget.Logger.newLogEvent.subscribe(this._onNewLog,this);YAHOO.widget.Logger.logResetEvent.subscribe(this._onReset,this);YAHOO.widget.Logger.categoryCreateEvent.subscribe(this._onCategoryCreate,this);YAHOO.widget.Logger.sourceCreateEvent.subscribe(this._onSourceCreate,this);this._filterLogs();YAHOO.log("LogReader initialized",null,this.toString());};YAHOO.lang.augmentObject(YAHOO.widget.LogReader,{_index:0,ENTRY_TEMPLATE:(function(){var A=document.createElement("pre");YAHOO.util.Dom.addClass(A,"yui-log-entry");return A;})(),VERBOSE_TEMPLATE:"<p><span class='{category}'>{label}</span> {totalTime}ms (+{elapsedTime}) {localTime}:</p><p>{sourceAndDetail}</p><p>{message}</p>",BASIC_TEMPLATE:"<p><span class='{category}'>{label}</span> {totalTime}ms (+{elapsedTime}) {localTime}: {sourceAndDetail}: {message}</p>"});YAHOO.widget.LogReader.prototype={logReaderEnabled:true,width:null,height:null,top:null,left:null,right:null,bottom:null,fontSize:null,footerEnabled:true,verboseOutput:true,entryFormat:null,newestOnTop:true,outputBuffer:100,thresholdMax:500,thresholdMin:100,isCollapsed:false,isPaused:false,draggable:true,toString:function(){return"LogReader instance"+this._sName;},pause:function(){this.isPaused=true;this._timeout=null;this.logReaderEnabled=false;if(this._btnPause){this._btnPause.value="Resume";}},resume:function(){this.isPaused=false;this.logReaderEnabled=true;this._printBuffer();if(this._btnPause){this._btnPause.value="Pause";}},hide:function(){this._elContainer.style.display="none";},show:function(){this._elContainer.style.display="block";},collapse:function(){this._elConsole.style.display="none";if(this._elFt){this._elFt.style.display="none";}this._btnCollapse.value="Expand";this.isCollapsed=true;},expand:function(){this._elConsole.style.display="block";if(this._elFt){this._elFt.style.display="block";}this._btnCollapse.value="Collapse";this.isCollapsed=false;},getCheckbox:function(A){return this._filterCheckboxes[A];},getCategories:function(){return this._categoryFilters;},showCategory:function(B){var D=this._categoryFilters;if(D.indexOf){if(D.indexOf(B)>-1){return ;}}else{for(var A=0;A<D.length;A++){if(D[A]===B){return ;}}}this._categoryFilters.push(B);this._filterLogs();var C=this.getCheckbox(B);if(C){C.checked=true;}},hideCategory:function(B){var D=this._categoryFilters;for(var A=0;A<D.length;A++){if(B==D[A]){D.splice(A,1);break;}}this._filterLogs();var C=this.getCheckbox(B);if(C){C.checked=false;}},getSources:function(){return this._sourceFilters;},showSource:function(A){var D=this._sourceFilters;if(D.indexOf){if(D.indexOf(A)>-1){return ;}}else{for(var B=0;B<D.length;B++){if(A==D[B]){return ;}}}D.push(A);this._filterLogs();var C=this.getCheckbox(A);if(C){C.checked=true;}},hideSource:function(A){var D=this._sourceFilters;for(var B=0;B<D.length;B++){if(A==D[B]){D.splice(B,1);break;}}this._filterLogs();var C=this.getCheckbox(A);if(C){C.checked=false;}},clearConsole:function(){this._timeout=null;this._buffer=[];this._consoleMsgCount=0;var A=this._elConsole;A.innerHTML="";},setTitle:function(A){this._title.innerHTML=this.html2Text(A);},getLastTime:function(){return this._lastTime;},formatMsg:function(C){var B=YAHOO.widget.LogReader,A=this.entryFormat||(this.verboseOutput?B.VERBOSE_TEMPLATE:B.BASIC_TEMPLATE),D={category:C.category,label:C.category.substring(0,4).toUpperCase(),sourceAndDetail:C.sourceDetail?C.source+" "+C.sourceDetail:C.source,message:this.html2Text(C.msg||C.message||"")};if(C.time&&C.time.getTime){D.localTime=C.time.toLocaleTimeString?C.time.toLocaleTimeString():C.time.toString();D.elapsedTime=C.time.getTime()-this.getLastTime();D.totalTime=C.time.getTime()-YAHOO.widget.Logger.getStartTime();}var E=B.ENTRY_TEMPLATE.cloneNode(true);if(this.verboseOutput){E.className+=" yui-log-verbose";}E.innerHTML=A.replace(/\{(\w+)\}/g,function(F,G){return(G in D)?D[G]:"";});return E;},html2Text:function(A){if(A){A+="";return A.replace(/&/g,"&#38;").replace(/</g,"&#60;").replace(/>/g,"&#62;");}return"";},_sName:null,_buffer:null,_consoleMsgCount:0,_lastTime:null,_timeout:null,_filterCheckboxes:null,_categoryFilters:null,_sourceFilters:null,_elContainer:null,_elHd:null,_elCollapse:null,_btnCollapse:null,_title:null,_elConsole:null,_elFt:null,_elBtns:null,_elCategoryFilters:null,_elSourceFilters:null,_btnPause:null,_btnClear:null,_initContainerEl:function(B){B=YAHOO.util.Dom.get(B);if(B&&B.tagName&&(B.tagName.toLowerCase()=="div")){this._elContainer=B;YAHOO.util.Dom.addClass(this._elContainer,"yui-log");}else{this._elContainer=document.body.appendChild(document.createElement("div"));YAHOO.util.Dom.addClass(this._elContainer,"yui-log");
+YAHOO.util.Dom.addClass(this._elContainer,"yui-log-container");var A=this._elContainer.style;if(this.width){A.width=this.width;}if(this.right){A.right=this.right;}if(this.top){A.top=this.top;}if(this.left){A.left=this.left;A.right="auto";}if(this.bottom){A.bottom=this.bottom;A.top="auto";}if(this.fontSize){A.fontSize=this.fontSize;}if(navigator.userAgent.toLowerCase().indexOf("opera")!=-1){document.body.style+="";}}},_initHeaderEl:function(){var A=this;if(this._elHd){YAHOO.util.Event.purgeElement(this._elHd,true);this._elHd.innerHTML="";}this._elHd=this._elContainer.appendChild(document.createElement("div"));this._elHd.id="yui-log-hd"+this._sName;this._elHd.className="yui-log-hd";this._elCollapse=this._elHd.appendChild(document.createElement("div"));this._elCollapse.className="yui-log-btns";this._btnCollapse=document.createElement("input");this._btnCollapse.type="button";this._btnCollapse.className="yui-log-button";this._btnCollapse.value="Collapse";this._btnCollapse=this._elCollapse.appendChild(this._btnCollapse);YAHOO.util.Event.addListener(A._btnCollapse,"click",A._onClickCollapseBtn,A);this._title=this._elHd.appendChild(document.createElement("h4"));this._title.innerHTML="Logger Console";},_initConsoleEl:function(){if(this._elConsole){YAHOO.util.Event.purgeElement(this._elConsole,true);this._elConsole.innerHTML="";}this._elConsole=this._elContainer.appendChild(document.createElement("div"));this._elConsole.className="yui-log-bd";if(this.height){this._elConsole.style.height=this.height;}},_initFooterEl:function(){var A=this;if(this.footerEnabled){if(this._elFt){YAHOO.util.Event.purgeElement(this._elFt,true);this._elFt.innerHTML="";}this._elFt=this._elContainer.appendChild(document.createElement("div"));this._elFt.className="yui-log-ft";this._elBtns=this._elFt.appendChild(document.createElement("div"));this._elBtns.className="yui-log-btns";this._btnPause=document.createElement("input");this._btnPause.type="button";this._btnPause.className="yui-log-button";this._btnPause.value="Pause";this._btnPause=this._elBtns.appendChild(this._btnPause);YAHOO.util.Event.addListener(A._btnPause,"click",A._onClickPauseBtn,A);this._btnClear=document.createElement("input");this._btnClear.type="button";this._btnClear.className="yui-log-button";this._btnClear.value="Clear";this._btnClear=this._elBtns.appendChild(this._btnClear);YAHOO.util.Event.addListener(A._btnClear,"click",A._onClickClearBtn,A);this._elCategoryFilters=this._elFt.appendChild(document.createElement("div"));this._elCategoryFilters.className="yui-log-categoryfilters";this._elSourceFilters=this._elFt.appendChild(document.createElement("div"));this._elSourceFilters.className="yui-log-sourcefilters";}},_initDragDrop:function(){if(YAHOO.util.DD&&this.draggable&&this._elHd){var A=new YAHOO.util.DD(this._elContainer);A.setHandleElId(this._elHd.id);this._elHd.style.cursor="move";}},_initCategories:function(){this._categoryFilters=[];var C=YAHOO.widget.Logger.categories;for(var A=0;A<C.length;A++){var B=C[A];this._categoryFilters.push(B);if(this._elCategoryFilters){this._createCategoryCheckbox(B);}}},_initSources:function(){this._sourceFilters=[];var C=YAHOO.widget.Logger.sources;for(var B=0;B<C.length;B++){var A=C[B];this._sourceFilters.push(A);if(this._elSourceFilters){this._createSourceCheckbox(A);}}},_createCategoryCheckbox:function(B){var A=this;if(this._elFt){var E=this._elCategoryFilters;var D=E.appendChild(document.createElement("span"));D.className="yui-log-filtergrp";var C=document.createElement("input");C.id="yui-log-filter-"+B+this._sName;C.className="yui-log-filter-"+B;C.type="checkbox";C.category=B;C=D.appendChild(C);C.checked=true;YAHOO.util.Event.addListener(C,"click",A._onCheckCategory,A);var F=D.appendChild(document.createElement("label"));F.htmlFor=C.id;F.className=B;F.innerHTML=B;this._filterCheckboxes[B]=C;}},_createSourceCheckbox:function(A){var D=this;if(this._elFt){var F=this._elSourceFilters;var E=F.appendChild(document.createElement("span"));E.className="yui-log-filtergrp";var C=document.createElement("input");C.id="yui-log-filter"+A+this._sName;C.className="yui-log-filter"+A;C.type="checkbox";C.source=A;C=E.appendChild(C);C.checked=true;YAHOO.util.Event.addListener(C,"click",D._onCheckSource,D);var B=E.appendChild(document.createElement("label"));B.htmlFor=C.id;B.className=A;B.innerHTML=A;this._filterCheckboxes[A]=C;}},_filterLogs:function(){if(this._elConsole!==null){this.clearConsole();this._printToConsole(YAHOO.widget.Logger.getStack());}},_printBuffer:function(){this._timeout=null;if(this._elConsole!==null){var B=this.thresholdMax;B=(B&&!isNaN(B))?B:500;if(this._consoleMsgCount<B){var A=[];for(var C=0;C<this._buffer.length;C++){A[C]=this._buffer[C];}this._buffer=[];this._printToConsole(A);}else{this._filterLogs();}if(!this.newestOnTop){this._elConsole.scrollTop=this._elConsole.scrollHeight;}}},_printToConsole:function(I){var B=I.length,M=document.createDocumentFragment(),P=[],Q=this.thresholdMin,C=this._sourceFilters.length,N=this._categoryFilters.length,K,H,G,F,L;if(isNaN(Q)||(Q>this.thresholdMax)){Q=0;}K=(B>Q)?(B-Q):0;for(H=K;H<B;H++){var E=false;var J=false;var O=I[H];var A=O.source;var D=O.category;for(G=0;G<C;G++){if(A==this._sourceFilters[G]){J=true;break;}}if(J){for(G=0;G<N;G++){if(D==this._categoryFilters[G]){E=true;break;}}}if(E){F=this.formatMsg(O);if(typeof F==="string"){P[P.length]=F;}else{M.insertBefore(F,this.newestOnTop?M.firstChild||null:null);}this._consoleMsgCount++;this._lastTime=O.time.getTime();}}if(P.length){P.splice(0,0,this._elConsole.innerHTML);this._elConsole.innerHTML=this.newestOnTop?P.reverse().join(""):P.join("");}else{if(M.firstChild){this._elConsole.insertBefore(M,this.newestOnTop?this._elConsole.firstChild||null:null);}}},_onCategoryCreate:function(D,C,A){var B=C[0];A._categoryFilters.push(B);if(A._elFt){A._createCategoryCheckbox(B);}},_onSourceCreate:function(D,C,A){var B=C[0];A._sourceFilters.push(B);if(A._elFt){A._createSourceCheckbox(B);}},_onCheckCategory:function(A,B){var C=this.category;
+if(!this.checked){B.hideCategory(C);}else{B.showCategory(C);}},_onCheckSource:function(A,B){var C=this.source;if(!this.checked){B.hideSource(C);}else{B.showSource(C);}},_onClickCollapseBtn:function(A,B){if(!B.isCollapsed){B.collapse();}else{B.expand();}},_onClickPauseBtn:function(A,B){if(!B.isPaused){B.pause();}else{B.resume();}},_onClickClearBtn:function(A,B){B.clearConsole();},_onNewLog:function(D,C,A){var B=C[0];A._buffer.push(B);if(A.logReaderEnabled===true&&A._timeout===null){A._timeout=setTimeout(function(){A._printBuffer();},A.outputBuffer);}},_onReset:function(C,B,A){A._filterLogs();}};if(!YAHOO.widget.Logger){YAHOO.widget.Logger={loggerEnabled:true,_browserConsoleEnabled:false,categories:["info","warn","error","time","window"],sources:["global"],_stack:[],maxStackEntries:2500,_startTime:new Date().getTime(),_lastTime:null,_windowErrorsHandled:false,_origOnWindowError:null};YAHOO.widget.Logger.log=function(B,F,G){if(this.loggerEnabled){if(!F){F="info";}else{F=F.toLocaleLowerCase();if(this._isNewCategory(F)){this._createNewCategory(F);}}var C="global";var A=null;if(G){var D=G.indexOf(" ");if(D>0){C=G.substring(0,D);A=G.substring(D,G.length);}else{C=G;}if(this._isNewSource(C)){this._createNewSource(C);}}var H=new Date();var J=new YAHOO.widget.LogMsg({msg:B,time:H,category:F,source:C,sourceDetail:A});var I=this._stack;var E=this.maxStackEntries;if(E&&!isNaN(E)&&(I.length>=E)){I.shift();}I.push(J);this.newLogEvent.fire(J);if(this._browserConsoleEnabled){this._printToBrowserConsole(J);}return true;}else{return false;}};YAHOO.widget.Logger.reset=function(){this._stack=[];this._startTime=new Date().getTime();this.loggerEnabled=true;this.log("Logger reset");this.logResetEvent.fire();};YAHOO.widget.Logger.getStack=function(){return this._stack;};YAHOO.widget.Logger.getStartTime=function(){return this._startTime;};YAHOO.widget.Logger.disableBrowserConsole=function(){YAHOO.log("Logger output to the function console.log() has been disabled.");this._browserConsoleEnabled=false;};YAHOO.widget.Logger.enableBrowserConsole=function(){this._browserConsoleEnabled=true;YAHOO.log("Logger output to the function console.log() has been enabled.");};YAHOO.widget.Logger.handleWindowErrors=function(){if(!YAHOO.widget.Logger._windowErrorsHandled){if(window.error){YAHOO.widget.Logger._origOnWindowError=window.onerror;}window.onerror=YAHOO.widget.Logger._onWindowError;YAHOO.widget.Logger._windowErrorsHandled=true;YAHOO.log("Logger handling of window.onerror has been enabled.");}else{YAHOO.log("Logger handling of window.onerror had already been enabled.");}};YAHOO.widget.Logger.unhandleWindowErrors=function(){if(YAHOO.widget.Logger._windowErrorsHandled){if(YAHOO.widget.Logger._origOnWindowError){window.onerror=YAHOO.widget.Logger._origOnWindowError;YAHOO.widget.Logger._origOnWindowError=null;}else{window.onerror=null;}YAHOO.widget.Logger._windowErrorsHandled=false;YAHOO.log("Logger handling of window.onerror has been disabled.");}else{YAHOO.log("Logger handling of window.onerror had already been disabled.");}};YAHOO.widget.Logger.categoryCreateEvent=new YAHOO.util.CustomEvent("categoryCreate",this,true);YAHOO.widget.Logger.sourceCreateEvent=new YAHOO.util.CustomEvent("sourceCreate",this,true);YAHOO.widget.Logger.newLogEvent=new YAHOO.util.CustomEvent("newLog",this,true);YAHOO.widget.Logger.logResetEvent=new YAHOO.util.CustomEvent("logReset",this,true);YAHOO.widget.Logger._createNewCategory=function(A){this.categories.push(A);this.categoryCreateEvent.fire(A);};YAHOO.widget.Logger._isNewCategory=function(B){for(var A=0;A<this.categories.length;A++){if(B==this.categories[A]){return false;}}return true;};YAHOO.widget.Logger._createNewSource=function(A){this.sources.push(A);this.sourceCreateEvent.fire(A);};YAHOO.widget.Logger._isNewSource=function(A){if(A){for(var B=0;B<this.sources.length;B++){if(A==this.sources[B]){return false;}}return true;}};YAHOO.widget.Logger._printToBrowserConsole=function(C){if(window.console&&console.log){var E=C.category;var D=C.category.substring(0,4).toUpperCase();var G=C.time;var F;if(G.toLocaleTimeString){F=G.toLocaleTimeString();}else{F=G.toString();}var H=G.getTime();var B=(YAHOO.widget.Logger._lastTime)?(H-YAHOO.widget.Logger._lastTime):0;YAHOO.widget.Logger._lastTime=H;var A=F+" ("+B+"ms): "+C.source+": ";if(YAHOO.env.ua.webkit){A+=C.msg;}console.log(A,C.msg);}};YAHOO.widget.Logger._onWindowError=function(A,C,B){try{YAHOO.widget.Logger.log(A+" ("+C+", line "+B+")","window");if(YAHOO.widget.Logger._origOnWindowError){YAHOO.widget.Logger._origOnWindowError();}}catch(D){return false;}};YAHOO.widget.Logger.log("Logger initialized");}YAHOO.register("logger",YAHOO.widget.Logger,{version:"2.6.0",build:"1321"});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yuitest/yuitest-min.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yuitest/yuitest-min.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yuitest/yuitest-min.js	(revision 76)
@@ -0,0 +1,17 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+Copyright (c) 2008, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 2.6.0
+*/
+YAHOO.namespace("tool");(function(){var A=0;YAHOO.tool.TestCase=function(B){this._should={};for(var C in B){this[C]=B[C];}if(!YAHOO.lang.isString(this.name)){this.name="testCase"+(A++);}};YAHOO.tool.TestCase.prototype={resume:function(B){YAHOO.tool.TestRunner.resume(B);},wait:function(D,C){var B=arguments;if(YAHOO.lang.isFunction(B[0])){throw new YAHOO.tool.TestCase.Wait(B[0],B[1]);}else{throw new YAHOO.tool.TestCase.Wait(function(){YAHOO.util.Assert.fail("Timeout: wait() called but resume() never called.");},(YAHOO.lang.isNumber(B[0])?B[0]:10000));}},setUp:function(){},tearDown:function(){}};YAHOO.tool.TestCase.Wait=function(C,B){this.segment=(YAHOO.lang.isFunction(C)?C:null);this.delay=(YAHOO.lang.isNumber(B)?B:0);};})();YAHOO.namespace("tool");YAHOO.tool.TestSuite=function(A){this.name="";this.items=[];if(YAHOO.lang.isString(A)){this.name=A;}else{if(YAHOO.lang.isObject(A)){YAHOO.lang.augmentObject(this,A,true);}}if(this.name===""){this.name=YAHOO.util.Dom.generateId(null,"testSuite");}};YAHOO.tool.TestSuite.prototype={add:function(A){if(A instanceof YAHOO.tool.TestSuite||A instanceof YAHOO.tool.TestCase){this.items.push(A);}},setUp:function(){},tearDown:function(){}};YAHOO.namespace("tool");YAHOO.tool.TestRunner=(function(){function B(C){this.testObject=C;this.firstChild=null;this.lastChild=null;this.parent=null;this.next=null;this.results={passed:0,failed:0,total:0,ignored:0};if(C instanceof YAHOO.tool.TestSuite){this.results.type="testsuite";this.results.name=C.name;}else{if(C instanceof YAHOO.tool.TestCase){this.results.type="testcase";this.results.name=C.name;}}}B.prototype={appendChild:function(C){var D=new B(C);if(this.firstChild===null){this.firstChild=this.lastChild=D;}else{this.lastChild.next=D;this.lastChild=D;}D.parent=this;return D;}};function A(){A.superclass.constructor.apply(this,arguments);this.masterSuite=new YAHOO.tool.TestSuite("YUI Test Results");this._cur=null;this._root=null;var D=[this.TEST_CASE_BEGIN_EVENT,this.TEST_CASE_COMPLETE_EVENT,this.TEST_SUITE_BEGIN_EVENT,this.TEST_SUITE_COMPLETE_EVENT,this.TEST_PASS_EVENT,this.TEST_FAIL_EVENT,this.TEST_IGNORE_EVENT,this.COMPLETE_EVENT,this.BEGIN_EVENT];for(var C=0;C<D.length;C++){this.createEvent(D[C],{scope:this});}}YAHOO.lang.extend(A,YAHOO.util.EventProvider,{TEST_CASE_BEGIN_EVENT:"testcasebegin",TEST_CASE_COMPLETE_EVENT:"testcasecomplete",TEST_SUITE_BEGIN_EVENT:"testsuitebegin",TEST_SUITE_COMPLETE_EVENT:"testsuitecomplete",TEST_PASS_EVENT:"pass",TEST_FAIL_EVENT:"fail",TEST_IGNORE_EVENT:"ignore",COMPLETE_EVENT:"complete",BEGIN_EVENT:"begin",_addTestCaseToTestTree:function(C,D){var E=C.appendChild(D);for(var F in D){if(F.indexOf("test")===0&&YAHOO.lang.isFunction(D[F])){E.appendChild(F);}}},_addTestSuiteToTestTree:function(C,F){var E=C.appendChild(F);for(var D=0;D<F.items.length;D++){if(F.items[D] instanceof YAHOO.tool.TestSuite){this._addTestSuiteToTestTree(E,F.items[D]);}else{if(F.items[D] instanceof YAHOO.tool.TestCase){this._addTestCaseToTestTree(E,F.items[D]);}}}},_buildTestTree:function(){this._root=new B(this.masterSuite);this._cur=this._root;for(var C=0;C<this.masterSuite.items.length;C++){if(this.masterSuite.items[C] instanceof YAHOO.tool.TestSuite){this._addTestSuiteToTestTree(this._root,this.masterSuite.items[C]);}else{if(this.masterSuite.items[C] instanceof YAHOO.tool.TestCase){this._addTestCaseToTestTree(this._root,this.masterSuite.items[C]);}}}},_handleTestObjectComplete:function(C){if(YAHOO.lang.isObject(C.testObject)){C.parent.results.passed+=C.results.passed;C.parent.results.failed+=C.results.failed;C.parent.results.total+=C.results.total;C.parent.results.ignored+=C.results.ignored;C.parent.results[C.testObject.name]=C.results;if(C.testObject instanceof YAHOO.tool.TestSuite){C.testObject.tearDown();this.fireEvent(this.TEST_SUITE_COMPLETE_EVENT,{testSuite:C.testObject,results:C.results});}else{if(C.testObject instanceof YAHOO.tool.TestCase){this.fireEvent(this.TEST_CASE_COMPLETE_EVENT,{testCase:C.testObject,results:C.results});}}}},_next:function(){if(this._cur.firstChild){this._cur=this._cur.firstChild;}else{if(this._cur.next){this._cur=this._cur.next;}else{while(this._cur&&!this._cur.next&&this._cur!==this._root){this._handleTestObjectComplete(this._cur);this._cur=this._cur.parent;}if(this._cur==this._root){this._cur.results.type="report";this._cur.results.timestamp=(new Date()).toLocaleString();this._cur.results.duration=(new Date())-this._cur.results.duration;this.fireEvent(this.COMPLETE_EVENT,{results:this._cur.results});this._cur=null;}else{this._handleTestObjectComplete(this._cur);this._cur=this._cur.next;}}}return this._cur;},_run:function(){var E=false;var D=this._next();if(D!==null){var C=D.testObject;if(YAHOO.lang.isObject(C)){if(C instanceof YAHOO.tool.TestSuite){this.fireEvent(this.TEST_SUITE_BEGIN_EVENT,{testSuite:C});C.setUp();}else{if(C instanceof YAHOO.tool.TestCase){this.fireEvent(this.TEST_CASE_BEGIN_EVENT,{testCase:C});}}if(typeof setTimeout!="undefined"){setTimeout(function(){YAHOO.tool.TestRunner._run();},0);}else{this._run();}}else{this._runTest(D);}}},_resumeTest:function(G){var C=this._cur;var H=C.testObject;var E=C.parent.testObject;if(E.__yui_wait){clearTimeout(E.__yui_wait);delete E.__yui_wait;}var K=(E._should.fail||{})[H];var D=(E._should.error||{})[H];var F=false;var I=null;try{G.apply(E);if(K){I=new YAHOO.util.ShouldFail();F=true;}else{if(D){I=new YAHOO.util.ShouldError();F=true;}}}catch(J){if(J instanceof YAHOO.util.AssertionError){if(!K){I=J;F=true;}}else{if(J instanceof YAHOO.tool.TestCase.Wait){if(YAHOO.lang.isFunction(J.segment)){if(YAHOO.lang.isNumber(J.delay)){if(typeof setTimeout!="undefined"){E.__yui_wait=setTimeout(function(){YAHOO.tool.TestRunner._resumeTest(J.segment);},J.delay);}else{throw new Error("Asynchronous tests not supported in this environment.");}}}return ;}else{if(!D){I=new YAHOO.util.UnexpectedError(J);F=true;}else{if(YAHOO.lang.isString(D)){if(J.message!=D){I=new YAHOO.util.UnexpectedError(J);F=true;}}else{if(YAHOO.lang.isFunction(D)){if(!(J instanceof D)){I=new YAHOO.util.UnexpectedError(J);
+F=true;}}else{if(YAHOO.lang.isObject(D)){if(!(J instanceof D.constructor)||J.message!=D.message){I=new YAHOO.util.UnexpectedError(J);F=true;}}}}}}}}if(F){this.fireEvent(this.TEST_FAIL_EVENT,{testCase:E,testName:H,error:I});}else{this.fireEvent(this.TEST_PASS_EVENT,{testCase:E,testName:H});}E.tearDown();C.parent.results[H]={result:F?"fail":"pass",message:I?I.getMessage():"Test passed",type:"test",name:H};if(F){C.parent.results.failed++;}else{C.parent.results.passed++;}C.parent.results.total++;if(typeof setTimeout!="undefined"){setTimeout(function(){YAHOO.tool.TestRunner._run();},0);}else{this._run();}},_runTest:function(F){var C=F.testObject;var D=F.parent.testObject;var G=D[C];var E=(D._should.ignore||{})[C];if(E){F.parent.results[C]={result:"ignore",message:"Test ignored",type:"test",name:C};F.parent.results.ignored++;F.parent.results.total++;this.fireEvent(this.TEST_IGNORE_EVENT,{testCase:D,testName:C});if(typeof setTimeout!="undefined"){setTimeout(function(){YAHOO.tool.TestRunner._run();},0);}else{this._run();}}else{D.setUp();this._resumeTest(G);}},fireEvent:function(C,D){D=D||{};D.type=C;A.superclass.fireEvent.call(this,C,D);},add:function(C){this.masterSuite.add(C);},clear:function(){this.masterSuite.items=[];},resume:function(C){this._resumeTest(C||function(){});},run:function(C){var D=YAHOO.tool.TestRunner;D._buildTestTree();D._root.results.duration=(new Date()).valueOf();D.fireEvent(D.BEGIN_EVENT);D._run();}});return new A();})();YAHOO.namespace("util");YAHOO.util.Assert={_formatMessage:function(B,A){var C=B;if(YAHOO.lang.isString(B)&&B.length>0){return YAHOO.lang.substitute(B,{message:A});}else{return A;}},fail:function(A){throw new YAHOO.util.AssertionError(this._formatMessage(A,"Test force-failed."));},areEqual:function(B,C,A){if(B!=C){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Values should be equal."),B,C);}},areNotEqual:function(A,C,B){if(A==C){throw new YAHOO.util.UnexpectedValue(this._formatMessage(B,"Values should not be equal."),A);}},areNotSame:function(A,C,B){if(A===C){throw new YAHOO.util.UnexpectedValue(this._formatMessage(B,"Values should not be the same."),A);}},areSame:function(B,C,A){if(B!==C){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Values should be the same."),B,C);}},isFalse:function(B,A){if(false!==B){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value should be false."),false,B);}},isTrue:function(B,A){if(true!==B){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value should be true."),true,B);}},isNaN:function(B,A){if(!isNaN(B)){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value should be NaN."),NaN,B);}},isNotNaN:function(B,A){if(isNaN(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Values should not be NaN."),NaN);}},isNotNull:function(B,A){if(YAHOO.lang.isNull(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Values should not be null."),null);}},isNotUndefined:function(B,A){if(YAHOO.lang.isUndefined(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should not be undefined."),undefined);}},isNull:function(B,A){if(!YAHOO.lang.isNull(B)){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value should be null."),null,B);}},isUndefined:function(B,A){if(!YAHOO.lang.isUndefined(B)){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value should be undefined."),undefined,B);}},isArray:function(B,A){if(!YAHOO.lang.isArray(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be an array."),B);}},isBoolean:function(B,A){if(!YAHOO.lang.isBoolean(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be a Boolean."),B);}},isFunction:function(B,A){if(!YAHOO.lang.isFunction(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be a function."),B);}},isInstanceOf:function(B,C,A){if(!(C instanceof B)){throw new YAHOO.util.ComparisonFailure(this._formatMessage(A,"Value isn't an instance of expected type."),B,C);}},isNumber:function(B,A){if(!YAHOO.lang.isNumber(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be a number."),B);}},isObject:function(B,A){if(!YAHOO.lang.isObject(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be an object."),B);}},isString:function(B,A){if(!YAHOO.lang.isString(B)){throw new YAHOO.util.UnexpectedValue(this._formatMessage(A,"Value should be a string."),B);}},isTypeOf:function(A,C,B){if(typeof C!=A){throw new YAHOO.util.ComparisonFailure(this._formatMessage(B,"Value should be of type "+expected+"."),expected,typeof actual);}}};YAHOO.util.AssertionError=function(A){arguments.callee.superclass.constructor.call(this,A);this.message=A;this.name="AssertionError";};YAHOO.lang.extend(YAHOO.util.AssertionError,Error,{getMessage:function(){return this.message;},toString:function(){return this.name+": "+this.getMessage();},valueOf:function(){return this.toString();}});YAHOO.util.ComparisonFailure=function(B,A,C){arguments.callee.superclass.constructor.call(this,B);this.expected=A;this.actual=C;this.name="ComparisonFailure";};YAHOO.lang.extend(YAHOO.util.ComparisonFailure,YAHOO.util.AssertionError,{getMessage:function(){return this.message+"\nExpected: "+this.expected+" ("+(typeof this.expected)+")\nActual:"+this.actual+" ("+(typeof this.actual)+")";}});YAHOO.util.UnexpectedValue=function(B,A){arguments.callee.superclass.constructor.call(this,B);this.unexpected=A;this.name="UnexpectedValue";};YAHOO.lang.extend(YAHOO.util.UnexpectedValue,YAHOO.util.AssertionError,{getMessage:function(){return this.message+"\nUnexpected: "+this.unexpected+" ("+(typeof this.unexpected)+") ";}});YAHOO.util.ShouldFail=function(A){arguments.callee.superclass.constructor.call(this,A||"This test should fail but didn't.");this.name="ShouldFail";};YAHOO.lang.extend(YAHOO.util.ShouldFail,YAHOO.util.AssertionError);YAHOO.util.ShouldError=function(A){arguments.callee.superclass.constructor.call(this,A||"This test should have thrown an error but didn't.");
+this.name="ShouldError";};YAHOO.lang.extend(YAHOO.util.ShouldError,YAHOO.util.AssertionError);YAHOO.util.UnexpectedError=function(A){arguments.callee.superclass.constructor.call(this,"Unexpected error: "+A.message);this.cause=A;this.name="UnexpectedError";this.stack=A.stack;};YAHOO.lang.extend(YAHOO.util.UnexpectedError,YAHOO.util.AssertionError);YAHOO.util.ArrayAssert={contains:function(E,D,B){var C=false;var F=YAHOO.util.Assert;for(var A=0;A<D.length&&!C;A++){if(D[A]===E){C=true;}}if(!C){F.fail(F._formatMessage(B,"Value "+E+" ("+(typeof E)+") not found in array ["+D+"]."));}},containsItems:function(C,D,B){for(var A=0;A<C.length;A++){this.contains(C[A],D,B);}},containsMatch:function(E,D,B){if(typeof E!="function"){throw new TypeError("ArrayAssert.containsMatch(): First argument must be a function.");}var C=false;var F=YAHOO.util.Assert;for(var A=0;A<D.length&&!C;A++){if(E(D[A])){C=true;}}if(!C){F.fail(F._formatMessage(B,"No match found in array ["+D+"]."));}},doesNotContain:function(E,D,B){var C=false;var F=YAHOO.util.Assert;for(var A=0;A<D.length&&!C;A++){if(D[A]===E){C=true;}}if(C){F.fail(F._formatMessage(B,"Value found in array ["+D+"]."));}},doesNotContainItems:function(C,D,B){for(var A=0;A<C.length;A++){this.doesNotContain(C[A],D,B);}},doesNotContainMatch:function(E,D,B){if(typeof E!="function"){throw new TypeError("ArrayAssert.doesNotContainMatch(): First argument must be a function.");}var C=false;var F=YAHOO.util.Assert;for(var A=0;A<D.length&&!C;A++){if(E(D[A])){C=true;}}if(C){F.fail(F._formatMessage(B,"Value found in array ["+D+"]."));}},indexOf:function(E,D,A,C){for(var B=0;B<D.length;B++){if(D[B]===E){YAHOO.util.Assert.areEqual(A,B,C||"Value exists at index "+B+" but should be at index "+A+".");return ;}}var F=YAHOO.util.Assert;F.fail(F._formatMessage(C,"Value doesn't exist in array ["+D+"]."));},itemsAreEqual:function(D,F,C){var A=Math.max(D.length,F.length);var E=YAHOO.util.Assert;for(var B=0;B<A;B++){E.areEqual(D[B],F[B],E._formatMessage(C,"Values in position "+B+" are not equal."));}},itemsAreEquivalent:function(E,F,B,D){if(typeof B!="function"){throw new TypeError("ArrayAssert.itemsAreEquivalent(): Third argument must be a function.");}var A=Math.max(E.length,F.length);for(var C=0;C<A;C++){if(!B(E[C],F[C])){throw new YAHOO.util.ComparisonFailure(YAHOO.util.Assert._formatMessage(D,"Values in position "+C+" are not equivalent."),E[C],F[C]);}}},isEmpty:function(C,A){if(C.length>0){var B=YAHOO.util.Assert;B.fail(B._formatMessage(A,"Array should be empty."));}},isNotEmpty:function(C,A){if(C.length===0){var B=YAHOO.util.Assert;B.fail(B._formatMessage(A,"Array should not be empty."));}},itemsAreSame:function(D,F,C){var A=Math.max(D.length,F.length);var E=YAHOO.util.Assert;for(var B=0;B<A;B++){E.areSame(D[B],F[B],E._formatMessage(C,"Values in position "+B+" are not the same."));}},lastIndexOf:function(E,D,A,C){var F=YAHOO.util.Assert;for(var B=D.length;B>=0;B--){if(D[B]===E){F.areEqual(A,B,F._formatMessage(C,"Value exists at index "+B+" but should be at index "+A+"."));return ;}}F.fail(F._formatMessage(C,"Value doesn't exist in array."));}};YAHOO.namespace("util");YAHOO.util.ObjectAssert={propertiesAreEqual:function(D,G,C){var F=YAHOO.util.Assert;var B=[];for(var E in D){B.push(E);}for(var A=0;A<B.length;A++){F.isNotUndefined(G[B[A]],F._formatMessage(C,"Property '"+B[A]+"' expected."));}},hasProperty:function(A,B,C){if(!(A in B)){var D=YAHOO.util.Assert;D.fail(D._formatMessage(C,"Property '"+A+"' not found on object."));}},hasOwnProperty:function(A,B,C){if(!YAHOO.lang.hasOwnProperty(B,A)){var D=YAHOO.util.Assert;D.fail(D._formatMessage(C,"Property '"+A+"' not found on object instance."));}}};YAHOO.util.DateAssert={datesAreEqual:function(B,D,A){if(B instanceof Date&&D instanceof Date){var C=YAHOO.util.Assert;C.areEqual(B.getFullYear(),D.getFullYear(),C._formatMessage(A,"Years should be equal."));C.areEqual(B.getMonth(),D.getMonth(),C._formatMessage(A,"Months should be equal."));C.areEqual(B.getDate(),D.getDate(),C._formatMessage(A,"Day of month should be equal."));}else{throw new TypeError("DateAssert.datesAreEqual(): Expected and actual values must be Date objects.");}},timesAreEqual:function(B,D,A){if(B instanceof Date&&D instanceof Date){var C=YAHOO.util.Assert;C.areEqual(B.getHours(),D.getHours(),C._formatMessage(A,"Hours should be equal."));C.areEqual(B.getMinutes(),D.getMinutes(),C._formatMessage(A,"Minutes should be equal."));C.areEqual(B.getSeconds(),D.getSeconds(),C._formatMessage(A,"Seconds should be equal."));}else{throw new TypeError("DateAssert.timesAreEqual(): Expected and actual values must be Date objects.");}}};YAHOO.namespace("util");YAHOO.util.UserAction={simulateKeyEvent:function(F,J,E,C,L,B,A,K,H,N,M){F=YAHOO.util.Dom.get(F);if(!F){throw new Error("simulateKeyEvent(): Invalid target.");}if(YAHOO.lang.isString(J)){J=J.toLowerCase();switch(J){case"keyup":case"keydown":case"keypress":break;case"textevent":J="keypress";break;default:throw new Error("simulateKeyEvent(): Event type '"+J+"' not supported.");}}else{throw new Error("simulateKeyEvent(): Event type must be a string.");}if(!YAHOO.lang.isBoolean(E)){E=true;}if(!YAHOO.lang.isBoolean(C)){C=true;}if(!YAHOO.lang.isObject(L)){L=window;}if(!YAHOO.lang.isBoolean(B)){B=false;}if(!YAHOO.lang.isBoolean(A)){A=false;}if(!YAHOO.lang.isBoolean(K)){K=false;}if(!YAHOO.lang.isBoolean(H)){H=false;}if(!YAHOO.lang.isNumber(N)){N=0;}if(!YAHOO.lang.isNumber(M)){M=0;}var I=null;if(YAHOO.lang.isFunction(document.createEvent)){try{I=document.createEvent("KeyEvents");I.initKeyEvent(J,E,C,L,B,A,K,H,N,M);}catch(G){try{I=document.createEvent("Events");}catch(D){I=document.createEvent("UIEvents");}finally{I.initEvent(J,E,C);I.view=L;I.altKey=A;I.ctrlKey=B;I.shiftKey=K;I.metaKey=H;I.keyCode=N;I.charCode=M;}}F.dispatchEvent(I);}else{if(YAHOO.lang.isObject(document.createEventObject)){I=document.createEventObject();I.bubbles=E;I.cancelable=C;I.view=L;I.ctrlKey=B;I.altKey=A;I.shiftKey=K;I.metaKey=H;I.keyCode=(M>0)?M:N;F.fireEvent("on"+J,I);
+}else{throw new Error("simulateKeyEvent(): No event simulation framework present.");}}},simulateMouseEvent:function(K,P,H,E,Q,J,G,F,D,B,C,A,O,M,I,L){K=YAHOO.util.Dom.get(K);if(!K){throw new Error("simulateMouseEvent(): Invalid target.");}if(YAHOO.lang.isString(P)){P=P.toLowerCase();switch(P){case"mouseover":case"mouseout":case"mousedown":case"mouseup":case"click":case"dblclick":case"mousemove":break;default:throw new Error("simulateMouseEvent(): Event type '"+P+"' not supported.");}}else{throw new Error("simulateMouseEvent(): Event type must be a string.");}if(!YAHOO.lang.isBoolean(H)){H=true;}if(!YAHOO.lang.isBoolean(E)){E=(P!="mousemove");}if(!YAHOO.lang.isObject(Q)){Q=window;}if(!YAHOO.lang.isNumber(J)){J=1;}if(!YAHOO.lang.isNumber(G)){G=0;}if(!YAHOO.lang.isNumber(F)){F=0;}if(!YAHOO.lang.isNumber(D)){D=0;}if(!YAHOO.lang.isNumber(B)){B=0;}if(!YAHOO.lang.isBoolean(C)){C=false;}if(!YAHOO.lang.isBoolean(A)){A=false;}if(!YAHOO.lang.isBoolean(O)){O=false;}if(!YAHOO.lang.isBoolean(M)){M=false;}if(!YAHOO.lang.isNumber(I)){I=0;}var N=null;if(YAHOO.lang.isFunction(document.createEvent)){N=document.createEvent("MouseEvents");if(N.initMouseEvent){N.initMouseEvent(P,H,E,Q,J,G,F,D,B,C,A,O,M,I,L);}else{N=document.createEvent("UIEvents");N.initEvent(P,H,E);N.view=Q;N.detail=J;N.screenX=G;N.screenY=F;N.clientX=D;N.clientY=B;N.ctrlKey=C;N.altKey=A;N.metaKey=M;N.shiftKey=O;N.button=I;N.relatedTarget=L;}if(L&&!N.relatedTarget){if(P=="mouseout"){N.toElement=L;}else{if(P=="mouseover"){N.fromElement=L;}}}K.dispatchEvent(N);}else{if(YAHOO.lang.isObject(document.createEventObject)){N=document.createEventObject();N.bubbles=H;N.cancelable=E;N.view=Q;N.detail=J;N.screenX=G;N.screenY=F;N.clientX=D;N.clientY=B;N.ctrlKey=C;N.altKey=A;N.metaKey=M;N.shiftKey=O;switch(I){case 0:N.button=1;break;case 1:N.button=4;break;case 2:break;default:N.button=0;}N.relatedTarget=L;K.fireEvent("on"+P,N);}else{throw new Error("simulateMouseEvent(): No event simulation framework present.");}}},fireMouseEvent:function(C,B,A){A=A||{};this.simulateMouseEvent(C,B,A.bubbles,A.cancelable,A.view,A.detail,A.screenX,A.screenY,A.clientX,A.clientY,A.ctrlKey,A.altKey,A.shiftKey,A.metaKey,A.button,A.relatedTarget);},click:function(B,A){this.fireMouseEvent(B,"click",A);},dblclick:function(B,A){this.fireMouseEvent(B,"dblclick",A);},mousedown:function(B,A){this.fireMouseEvent(B,"mousedown",A);},mousemove:function(B,A){this.fireMouseEvent(B,"mousemove",A);},mouseout:function(B,A){this.fireMouseEvent(B,"mouseout",A);},mouseover:function(B,A){this.fireMouseEvent(B,"mouseover",A);},mouseup:function(B,A){this.fireMouseEvent(B,"mouseup",A);},fireKeyEvent:function(B,C,A){A=A||{};this.simulateKeyEvent(C,B,A.bubbles,A.cancelable,A.view,A.ctrlKey,A.altKey,A.shiftKey,A.metaKey,A.keyCode,A.charCode);},keydown:function(B,A){this.fireKeyEvent("keydown",B,A);},keypress:function(B,A){this.fireKeyEvent("keypress",B,A);},keyup:function(B,A){this.fireKeyEvent("keyup",B,A);}};YAHOO.namespace("tool");YAHOO.tool.TestManager={TEST_PAGE_BEGIN_EVENT:"testpagebegin",TEST_PAGE_COMPLETE_EVENT:"testpagecomplete",TEST_MANAGER_BEGIN_EVENT:"testmanagerbegin",TEST_MANAGER_COMPLETE_EVENT:"testmanagercomplete",_curPage:null,_frame:null,_logger:null,_timeoutId:0,_pages:[],_results:null,_handleTestRunnerComplete:function(A){this.fireEvent(this.TEST_PAGE_COMPLETE_EVENT,{page:this._curPage,results:A.results});this._processResults(this._curPage,A.results);this._logger.clearTestRunner();if(this._pages.length){this._timeoutId=setTimeout(function(){YAHOO.tool.TestManager._run();},1000);}else{this.fireEvent(this.TEST_MANAGER_COMPLETE_EVENT,this._results);}},_processResults:function(C,A){var B=this._results;B.passed+=A.passed;B.failed+=A.failed;B.ignored+=A.ignored;B.total+=A.total;B.duration+=A.duration;if(A.failed){B.failedPages.push(C);}else{B.passedPages.push(C);}A.name=C;A.type="page";B[C]=A;},_run:function(){this._curPage=this._pages.shift();this.fireEvent(this.TEST_PAGE_BEGIN_EVENT,this._curPage);this._frame.location.replace(this._curPage);},load:function(){if(parent.YAHOO.tool.TestManager!==this){parent.YAHOO.tool.TestManager.load();}else{if(this._frame){var A=this._frame.YAHOO.tool.TestRunner;this._logger.setTestRunner(A);A.subscribe(A.COMPLETE_EVENT,this._handleTestRunnerComplete,this,true);A.run();}}},setPages:function(A){this._pages=A;},start:function(){if(!this._initialized){this.createEvent(this.TEST_PAGE_BEGIN_EVENT);this.createEvent(this.TEST_PAGE_COMPLETE_EVENT);this.createEvent(this.TEST_MANAGER_BEGIN_EVENT);this.createEvent(this.TEST_MANAGER_COMPLETE_EVENT);if(!this._frame){var A=document.createElement("iframe");A.style.visibility="hidden";A.style.position="absolute";document.body.appendChild(A);this._frame=A.contentWindow||A.contentDocument.parentWindow;}if(!this._logger){this._logger=new YAHOO.tool.TestLogger();}this._initialized=true;}this._results={passed:0,failed:0,ignored:0,total:0,type:"report",name:"YUI Test Results",duration:0,failedPages:[],passedPages:[]};this.fireEvent(this.TEST_MANAGER_BEGIN_EVENT,null);this._run();},stop:function(){clearTimeout(this._timeoutId);}};YAHOO.lang.augmentObject(YAHOO.tool.TestManager,YAHOO.util.EventProvider.prototype);YAHOO.namespace("tool");YAHOO.tool.TestLogger=function(B,A){YAHOO.tool.TestLogger.superclass.constructor.call(this,B,A);this.init();};YAHOO.lang.extend(YAHOO.tool.TestLogger,YAHOO.widget.LogReader,{footerEnabled:true,newestOnTop:false,formatMsg:function(B){var A=B.category;var C=this.html2Text(B.msg);return"<pre><p><span class=\""+A+"\">"+A.toUpperCase()+"</span> "+C+"</p></pre>";},init:function(){if(YAHOO.tool.TestRunner){this.setTestRunner(YAHOO.tool.TestRunner);}this.hideSource("global");this.hideSource("LogReader");this.hideCategory("warn");this.hideCategory("window");this.hideCategory("time");this.clearConsole();},clearTestRunner:function(){if(this._runner){this._runner.unsubscribeAll();this._runner=null;}},setTestRunner:function(A){if(this._runner){this.clearTestRunner();}this._runner=A;A.subscribe(A.TEST_PASS_EVENT,this._handleTestRunnerEvent,this,true);
+A.subscribe(A.TEST_FAIL_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.TEST_IGNORE_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.BEGIN_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.COMPLETE_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.TEST_SUITE_BEGIN_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.TEST_SUITE_COMPLETE_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.TEST_CASE_BEGIN_EVENT,this._handleTestRunnerEvent,this,true);A.subscribe(A.TEST_CASE_COMPLETE_EVENT,this._handleTestRunnerEvent,this,true);},_handleTestRunnerEvent:function(D){var A=YAHOO.tool.TestRunner;var C="";var B="";switch(D.type){case A.BEGIN_EVENT:C="Testing began at "+(new Date()).toString()+".";B="info";break;case A.COMPLETE_EVENT:C="Testing completed at "+(new Date()).toString()+".\nPassed:"+D.results.passed+" Failed:"+D.results.failed+" Total:"+D.results.total;B="info";break;case A.TEST_FAIL_EVENT:C=D.testName+": "+D.error.getMessage();B="fail";break;case A.TEST_IGNORE_EVENT:C=D.testName+": ignored.";B="ignore";break;case A.TEST_PASS_EVENT:C=D.testName+": passed.";B="pass";break;case A.TEST_SUITE_BEGIN_EVENT:C="Test suite \""+D.testSuite.name+"\" started.";B="info";break;case A.TEST_SUITE_COMPLETE_EVENT:C="Test suite \""+D.testSuite.name+"\" completed.\nPassed:"+D.results.passed+" Failed:"+D.results.failed+" Total:"+D.results.total;B="info";break;case A.TEST_CASE_BEGIN_EVENT:C="Test case \""+D.testCase.name+"\" started.";B="info";break;case A.TEST_CASE_COMPLETE_EVENT:C="Test case \""+D.testCase.name+"\" completed.\nPassed:"+D.results.passed+" Failed:"+D.results.failed+" Total:"+D.results.total;B="info";break;default:C="Unexpected event "+D.type;C="info";}YAHOO.log(C,B,"TestRunner");}});YAHOO.namespace("tool.TestFormat");YAHOO.tool.TestFormat.JSON=function(A){return YAHOO.lang.JSON.stringify(A);};YAHOO.tool.TestFormat.XML=function(C){var A=YAHOO.lang;var B="<"+C.type+" name=\""+C.name.replace(/"/g,"&quot;").replace(/'/g,"&apos;")+"\"";if(A.isNumber(C.duration)){B+=" duration=\""+C.duration+"\"";}if(C.type=="test"){B+=" result=\""+C.result+"\" message=\""+C.message+"\">";}else{B+=" passed=\""+C.passed+"\" failed=\""+C.failed+"\" ignored=\""+C.ignored+"\" total=\""+C.total+"\">";for(var D in C){if(A.hasOwnProperty(C,D)&&A.isObject(C[D])&&!A.isArray(C[D])){B+=arguments.callee(C[D]);}}}B+="</"+C.type+">";return B;};YAHOO.namespace("tool");YAHOO.tool.TestReporter=function(A,B){this.url=A;this.format=B||YAHOO.tool.TestFormat.XML;this._fields=new Object();this._form=null;this._iframe=null;};YAHOO.tool.TestReporter.prototype={constructor:YAHOO.tool.TestReporter,_convertToISOString:function(A){function B(C){return C<10?"0"+C:C;}return A.getUTCFullYear()+"-"+B(A.getUTCMonth()+1)+"-"+B(A.getUTCDate())+"T"+B(A.getUTCHours())+":"+B(A.getUTCMinutes())+":"+B(A.getUTCSeconds())+"Z";},addField:function(A,B){this._fields[A]=B;},clearFields:function(){this._fields=new Object();},destroy:function(){if(this._form){this._form.parentNode.removeChild(this._form);this._form=null;}if(this._iframe){this._iframe.parentNode.removeChild(this._iframe);this._iframe=null;}this._fields=null;},report:function(A){if(!this._form){this._form=document.createElement("form");this._form.method="post";this._form.style.visibility="hidden";this._form.style.position="absolute";this._form.style.top=0;document.body.appendChild(this._form);if(YAHOO.env.ua.ie){this._iframe=document.createElement("<iframe name=\"yuiTestTarget\" />");}else{this._iframe=document.createElement("iframe");this._iframe.name="yuiTestTarget";}this._iframe.src="javascript:false";this._iframe.style.visibility="hidden";this._iframe.style.position="absolute";this._iframe.style.top=0;document.body.appendChild(this._iframe);this._form.target="yuiTestTarget";}this._form.action=this.url;while(this._form.hasChildNodes()){this._form.removeChild(this._form.lastChild);}this._fields.results=this.format(A);this._fields.useragent=navigator.userAgent;this._fields.timestamp=this._convertToISOString(new Date());for(var B in this._fields){if(YAHOO.lang.hasOwnProperty(this._fields,B)&&typeof this._fields[B]!="function"){if(YAHOO.env.ua.ie){input=document.createElement("<input name=\""+B+"\" >");}else{input=document.createElement("input");input.name=B;}input.type="hidden";input.value=this._fields[B];this._form.appendChild(input);}}delete this._fields.results;delete this._fields.useragent;delete this._fields.timestamp;if(arguments[1]!==false){this._form.submit();}}};YAHOO.register("yuitest",YAHOO.tool.TestRunner,{version:"2.6.0",build:"1321"});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yahoo-dom-event/yahoo-dom-event.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yahoo-dom-event/yahoo-dom-event.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/test/yui_2.6.0/yui/build/yahoo-dom-event/yahoo-dom-event.js	(revision 76)
@@ -0,0 +1,18 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+Copyright (c) 2008, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 2.6.0
+*/
+if(typeof YAHOO=="undefined"||!YAHOO){var YAHOO={};}YAHOO.namespace=function(){var A=arguments,E=null,C,B,D;for(C=0;C<A.length;C=C+1){D=A[C].split(".");E=YAHOO;for(B=(D[0]=="YAHOO")?1:0;B<D.length;B=B+1){E[D[B]]=E[D[B]]||{};E=E[D[B]];}}return E;};YAHOO.log=function(D,A,C){var B=YAHOO.widget.Logger;if(B&&B.log){return B.log(D,A,C);}else{return false;}};YAHOO.register=function(A,E,D){var I=YAHOO.env.modules;if(!I[A]){I[A]={versions:[],builds:[]};}var B=I[A],H=D.version,G=D.build,F=YAHOO.env.listeners;B.name=A;B.version=H;B.build=G;B.versions.push(H);B.builds.push(G);B.mainClass=E;for(var C=0;C<F.length;C=C+1){F[C](B);}if(E){E.VERSION=H;E.BUILD=G;}else{YAHOO.log("mainClass is undefined for module "+A,"warn");}};YAHOO.env=YAHOO.env||{modules:[],listeners:[]};YAHOO.env.getVersion=function(A){return YAHOO.env.modules[A]||null;};YAHOO.env.ua=function(){var C={ie:0,opera:0,gecko:0,webkit:0,mobile:null,air:0};var B=navigator.userAgent,A;if((/KHTML/).test(B)){C.webkit=1;}A=B.match(/AppleWebKit\/([^\s]*)/);if(A&&A[1]){C.webkit=parseFloat(A[1]);if(/ Mobile\//.test(B)){C.mobile="Apple";}else{A=B.match(/NokiaN[^\/]*/);if(A){C.mobile=A[0];}}A=B.match(/AdobeAIR\/([^\s]*)/);if(A){C.air=A[0];}}if(!C.webkit){A=B.match(/Opera[\s\/]([^\s]*)/);if(A&&A[1]){C.opera=parseFloat(A[1]);A=B.match(/Opera Mini[^;]*/);if(A){C.mobile=A[0];}}else{A=B.match(/MSIE\s([^;]*)/);if(A&&A[1]){C.ie=parseFloat(A[1]);}else{A=B.match(/Gecko\/([^\s]*)/);if(A){C.gecko=1;A=B.match(/rv:([^\s\)]*)/);if(A&&A[1]){C.gecko=parseFloat(A[1]);}}}}}return C;}();(function(){YAHOO.namespace("util","widget","example");if("undefined"!==typeof YAHOO_config){var B=YAHOO_config.listener,A=YAHOO.env.listeners,D=true,C;if(B){for(C=0;C<A.length;C=C+1){if(A[C]==B){D=false;break;}}if(D){A.push(B);}}}})();YAHOO.lang=YAHOO.lang||{};(function(){var A=YAHOO.lang,C=["toString","valueOf"],B={isArray:function(D){if(D){return A.isNumber(D.length)&&A.isFunction(D.splice);}return false;},isBoolean:function(D){return typeof D==="boolean";},isFunction:function(D){return typeof D==="function";},isNull:function(D){return D===null;},isNumber:function(D){return typeof D==="number"&&isFinite(D);},isObject:function(D){return(D&&(typeof D==="object"||A.isFunction(D)))||false;},isString:function(D){return typeof D==="string";},isUndefined:function(D){return typeof D==="undefined";},_IEEnumFix:(YAHOO.env.ua.ie)?function(F,E){for(var D=0;D<C.length;D=D+1){var H=C[D],G=E[H];if(A.isFunction(G)&&G!=Object.prototype[H]){F[H]=G;}}}:function(){},extend:function(H,I,G){if(!I||!H){throw new Error("extend failed, please check that "+"all dependencies are included.");}var E=function(){};E.prototype=I.prototype;H.prototype=new E();H.prototype.constructor=H;H.superclass=I.prototype;if(I.prototype.constructor==Object.prototype.constructor){I.prototype.constructor=I;}if(G){for(var D in G){if(A.hasOwnProperty(G,D)){H.prototype[D]=G[D];}}A._IEEnumFix(H.prototype,G);}},augmentObject:function(H,G){if(!G||!H){throw new Error("Absorb failed, verify dependencies.");}var D=arguments,F,I,E=D[2];if(E&&E!==true){for(F=2;F<D.length;F=F+1){H[D[F]]=G[D[F]];}}else{for(I in G){if(E||!(I in H)){H[I]=G[I];}}A._IEEnumFix(H,G);}},augmentProto:function(G,F){if(!F||!G){throw new Error("Augment failed, verify dependencies.");}var D=[G.prototype,F.prototype];for(var E=2;E<arguments.length;E=E+1){D.push(arguments[E]);}A.augmentObject.apply(this,D);},dump:function(D,I){var F,H,K=[],L="{...}",E="f(){...}",J=", ",G=" => ";if(!A.isObject(D)){return D+"";}else{if(D instanceof Date||("nodeType" in D&&"tagName" in D)){return D;}else{if(A.isFunction(D)){return E;}}}I=(A.isNumber(I))?I:3;if(A.isArray(D)){K.push("[");for(F=0,H=D.length;F<H;F=F+1){if(A.isObject(D[F])){K.push((I>0)?A.dump(D[F],I-1):L);}else{K.push(D[F]);}K.push(J);}if(K.length>1){K.pop();}K.push("]");}else{K.push("{");for(F in D){if(A.hasOwnProperty(D,F)){K.push(F+G);if(A.isObject(D[F])){K.push((I>0)?A.dump(D[F],I-1):L);}else{K.push(D[F]);}K.push(J);}}if(K.length>1){K.pop();}K.push("}");}return K.join("");},substitute:function(S,E,L){var I,H,G,O,P,R,N=[],F,J="dump",M=" ",D="{",Q="}";for(;;){I=S.lastIndexOf(D);if(I<0){break;}H=S.indexOf(Q,I);if(I+1>=H){break;}F=S.substring(I+1,H);O=F;R=null;G=O.indexOf(M);if(G>-1){R=O.substring(G+1);O=O.substring(0,G);}P=E[O];if(L){P=L(O,P,R);}if(A.isObject(P)){if(A.isArray(P)){P=A.dump(P,parseInt(R,10));}else{R=R||"";var K=R.indexOf(J);if(K>-1){R=R.substring(4);}if(P.toString===Object.prototype.toString||K>-1){P=A.dump(P,parseInt(R,10));}else{P=P.toString();}}}else{if(!A.isString(P)&&!A.isNumber(P)){P="~-"+N.length+"-~";N[N.length]=F;}}S=S.substring(0,I)+P+S.substring(H+1);}for(I=N.length-1;I>=0;I=I-1){S=S.replace(new RegExp("~-"+I+"-~"),"{"+N[I]+"}","g");}return S;},trim:function(D){try{return D.replace(/^\s+|\s+$/g,"");}catch(E){return D;}},merge:function(){var G={},E=arguments;for(var F=0,D=E.length;F<D;F=F+1){A.augmentObject(G,E[F],true);}return G;},later:function(K,E,L,G,H){K=K||0;E=E||{};var F=L,J=G,I,D;if(A.isString(L)){F=E[L];}if(!F){throw new TypeError("method undefined");}if(!A.isArray(J)){J=[G];}I=function(){F.apply(E,J);};D=(H)?setInterval(I,K):setTimeout(I,K);return{interval:H,cancel:function(){if(this.interval){clearInterval(D);}else{clearTimeout(D);}}};},isValue:function(D){return(A.isObject(D)||A.isString(D)||A.isNumber(D)||A.isBoolean(D));}};A.hasOwnProperty=(Object.prototype.hasOwnProperty)?function(D,E){return D&&D.hasOwnProperty(E);}:function(D,E){return !A.isUndefined(D[E])&&D.constructor.prototype[E]!==D[E];};B.augmentObject(A,B,true);YAHOO.util.Lang=A;A.augment=A.augmentProto;YAHOO.augment=A.augmentProto;YAHOO.extend=A.extend;})();YAHOO.register("yahoo",YAHOO,{version:"2.6.0",build:"1321"});(function(){var B=YAHOO.util,F=YAHOO.lang,L,J,K={},G={},N=window.document;YAHOO.env._id_counter=YAHOO.env._id_counter||0;var C=YAHOO.env.ua.opera,M=YAHOO.env.ua.webkit,A=YAHOO.env.ua.gecko,H=YAHOO.env.ua.ie;var E={HYPHEN:/(-[a-z])/i,ROOT_TAG:/^body|html$/i,OP_SCROLL:/^(?:inline|table-row)$/i};var O=function(Q){if(!E.HYPHEN.test(Q)){return Q;}if(K[Q]){return K[Q];}var R=Q;while(E.HYPHEN.exec(R)){R=R.replace(RegExp.$1,RegExp.$1.substr(1).toUpperCase());}K[Q]=R;return R;};var P=function(R){var Q=G[R];if(!Q){Q=new RegExp("(?:^|\\s+)"+R+"(?:\\s+|$)");G[R]=Q;}return Q;};if(N.defaultView&&N.defaultView.getComputedStyle){L=function(Q,T){var S=null;if(T=="float"){T="cssFloat";}var R=Q.ownerDocument.defaultView.getComputedStyle(Q,"");if(R){S=R[O(T)];}return Q.style[T]||S;};}else{if(N.documentElement.currentStyle&&H){L=function(Q,S){switch(O(S)){case"opacity":var U=100;try{U=Q.filters["DXImageTransform.Microsoft.Alpha"].opacity;}catch(T){try{U=Q.filters("alpha").opacity;}catch(T){}}return U/100;case"float":S="styleFloat";default:var R=Q.currentStyle?Q.currentStyle[S]:null;return(Q.style[S]||R);}};}else{L=function(Q,R){return Q.style[R];};}}if(H){J=function(Q,R,S){switch(R){case"opacity":if(F.isString(Q.style.filter)){Q.style.filter="alpha(opacity="+S*100+")";if(!Q.currentStyle||!Q.currentStyle.hasLayout){Q.style.zoom=1;}}break;case"float":R="styleFloat";default:Q.style[R]=S;}};}else{J=function(Q,R,S){if(R=="float"){R="cssFloat";}Q.style[R]=S;};}var D=function(Q,R){return Q&&Q.nodeType==1&&(!R||R(Q));};YAHOO.util.Dom={get:function(S){if(S){if(S.nodeType||S.item){return S;}if(typeof S==="string"){return N.getElementById(S);}if("length" in S){var T=[];for(var R=0,Q=S.length;R<Q;++R){T[T.length]=B.Dom.get(S[R]);}return T;}return S;}return null;},getStyle:function(Q,S){S=O(S);var R=function(T){return L(T,S);};return B.Dom.batch(Q,R,B.Dom,true);},setStyle:function(Q,S,T){S=O(S);var R=function(U){J(U,S,T);};B.Dom.batch(Q,R,B.Dom,true);},getXY:function(Q){var R=function(S){if((S.parentNode===null||S.offsetParent===null||this.getStyle(S,"display")=="none")&&S!=S.ownerDocument.body){return false;}return I(S);};return B.Dom.batch(Q,R,B.Dom,true);},getX:function(Q){var R=function(S){return B.Dom.getXY(S)[0];};return B.Dom.batch(Q,R,B.Dom,true);},getY:function(Q){var R=function(S){return B.Dom.getXY(S)[1];};return B.Dom.batch(Q,R,B.Dom,true);},setXY:function(Q,T,S){var R=function(W){var V=this.getStyle(W,"position");if(V=="static"){this.setStyle(W,"position","relative");V="relative";}var Y=this.getXY(W);if(Y===false){return false;}var X=[parseInt(this.getStyle(W,"left"),10),parseInt(this.getStyle(W,"top"),10)];if(isNaN(X[0])){X[0]=(V=="relative")?0:W.offsetLeft;}if(isNaN(X[1])){X[1]=(V=="relative")?0:W.offsetTop;}if(T[0]!==null){W.style.left=T[0]-Y[0]+X[0]+"px";}if(T[1]!==null){W.style.top=T[1]-Y[1]+X[1]+"px";}if(!S){var U=this.getXY(W);if((T[0]!==null&&U[0]!=T[0])||(T[1]!==null&&U[1]!=T[1])){this.setXY(W,T,true);}}};B.Dom.batch(Q,R,B.Dom,true);},setX:function(R,Q){B.Dom.setXY(R,[Q,null]);},setY:function(Q,R){B.Dom.setXY(Q,[null,R]);},getRegion:function(Q){var R=function(S){if((S.parentNode===null||S.offsetParent===null||this.getStyle(S,"display")=="none")&&S!=S.ownerDocument.body){return false;}var T=B.Region.getRegion(S);return T;};return B.Dom.batch(Q,R,B.Dom,true);},getClientWidth:function(){return B.Dom.getViewportWidth();},getClientHeight:function(){return B.Dom.getViewportHeight();},getElementsByClassName:function(U,Y,V,W){U=F.trim(U);Y=Y||"*";V=(V)?B.Dom.get(V):null||N;if(!V){return[];}var R=[],Q=V.getElementsByTagName(Y),X=P(U);for(var S=0,T=Q.length;S<T;++S){if(X.test(Q[S].className)){R[R.length]=Q[S];if(W){W.call(Q[S],Q[S]);}}}return R;},hasClass:function(S,R){var Q=P(R);var T=function(U){return Q.test(U.className);};return B.Dom.batch(S,T,B.Dom,true);},addClass:function(R,Q){var S=function(T){if(this.hasClass(T,Q)){return false;}T.className=F.trim([T.className,Q].join(" "));return true;};return B.Dom.batch(R,S,B.Dom,true);},removeClass:function(S,R){var Q=P(R);var T=function(W){var V=false,X=W.className;if(R&&X&&this.hasClass(W,R)){W.className=X.replace(Q," ");if(this.hasClass(W,R)){this.removeClass(W,R);}W.className=F.trim(W.className);if(W.className===""){var U=(W.hasAttribute)?"class":"className";W.removeAttribute(U);}V=true;}return V;};return B.Dom.batch(S,T,B.Dom,true);},replaceClass:function(T,R,Q){if(!Q||R===Q){return false;}var S=P(R);var U=function(V){if(!this.hasClass(V,R)){this.addClass(V,Q);return true;}V.className=V.className.replace(S," "+Q+" ");if(this.hasClass(V,R)){this.removeClass(V,R);}V.className=F.trim(V.className);return true;};return B.Dom.batch(T,U,B.Dom,true);},generateId:function(Q,S){S=S||"yui-gen";var R=function(T){if(T&&T.id){return T.id;}var U=S+YAHOO.env._id_counter++;if(T){T.id=U;}return U;};return B.Dom.batch(Q,R,B.Dom,true)||R.apply(B.Dom,arguments);},isAncestor:function(R,S){R=B.Dom.get(R);S=B.Dom.get(S);var Q=false;if((R&&S)&&(R.nodeType&&S.nodeType)){if(R.contains&&R!==S){Q=R.contains(S);}else{if(R.compareDocumentPosition){Q=!!(R.compareDocumentPosition(S)&16);}}}else{}return Q;},inDocument:function(Q){return this.isAncestor(N.documentElement,Q);},getElementsBy:function(X,R,S,U){R=R||"*";S=(S)?B.Dom.get(S):null||N;if(!S){return[];}var T=[],W=S.getElementsByTagName(R);for(var V=0,Q=W.length;V<Q;++V){if(X(W[V])){T[T.length]=W[V];if(U){U(W[V]);}}}return T;},batch:function(U,X,W,S){U=(U&&(U.tagName||U.item))?U:B.Dom.get(U);if(!U||!X){return false;}var T=(S)?W:window;if(U.tagName||U.length===undefined){return X.call(T,U,W);}var V=[];for(var R=0,Q=U.length;R<Q;++R){V[V.length]=X.call(T,U[R],W);}return V;},getDocumentHeight:function(){var R=(N.compatMode!="CSS1Compat")?N.body.scrollHeight:N.documentElement.scrollHeight;var Q=Math.max(R,B.Dom.getViewportHeight());return Q;},getDocumentWidth:function(){var R=(N.compatMode!="CSS1Compat")?N.body.scrollWidth:N.documentElement.scrollWidth;var Q=Math.max(R,B.Dom.getViewportWidth());return Q;},getViewportHeight:function(){var Q=self.innerHeight;
+var R=N.compatMode;if((R||H)&&!C){Q=(R=="CSS1Compat")?N.documentElement.clientHeight:N.body.clientHeight;}return Q;},getViewportWidth:function(){var Q=self.innerWidth;var R=N.compatMode;if(R||H){Q=(R=="CSS1Compat")?N.documentElement.clientWidth:N.body.clientWidth;}return Q;},getAncestorBy:function(Q,R){while((Q=Q.parentNode)){if(D(Q,R)){return Q;}}return null;},getAncestorByClassName:function(R,Q){R=B.Dom.get(R);if(!R){return null;}var S=function(T){return B.Dom.hasClass(T,Q);};return B.Dom.getAncestorBy(R,S);},getAncestorByTagName:function(R,Q){R=B.Dom.get(R);if(!R){return null;}var S=function(T){return T.tagName&&T.tagName.toUpperCase()==Q.toUpperCase();};return B.Dom.getAncestorBy(R,S);},getPreviousSiblingBy:function(Q,R){while(Q){Q=Q.previousSibling;if(D(Q,R)){return Q;}}return null;},getPreviousSibling:function(Q){Q=B.Dom.get(Q);if(!Q){return null;}return B.Dom.getPreviousSiblingBy(Q);},getNextSiblingBy:function(Q,R){while(Q){Q=Q.nextSibling;if(D(Q,R)){return Q;}}return null;},getNextSibling:function(Q){Q=B.Dom.get(Q);if(!Q){return null;}return B.Dom.getNextSiblingBy(Q);},getFirstChildBy:function(Q,S){var R=(D(Q.firstChild,S))?Q.firstChild:null;return R||B.Dom.getNextSiblingBy(Q.firstChild,S);},getFirstChild:function(Q,R){Q=B.Dom.get(Q);if(!Q){return null;}return B.Dom.getFirstChildBy(Q);},getLastChildBy:function(Q,S){if(!Q){return null;}var R=(D(Q.lastChild,S))?Q.lastChild:null;return R||B.Dom.getPreviousSiblingBy(Q.lastChild,S);},getLastChild:function(Q){Q=B.Dom.get(Q);return B.Dom.getLastChildBy(Q);},getChildrenBy:function(R,T){var S=B.Dom.getFirstChildBy(R,T);var Q=S?[S]:[];B.Dom.getNextSiblingBy(S,function(U){if(!T||T(U)){Q[Q.length]=U;}return false;});return Q;},getChildren:function(Q){Q=B.Dom.get(Q);if(!Q){}return B.Dom.getChildrenBy(Q);},getDocumentScrollLeft:function(Q){Q=Q||N;return Math.max(Q.documentElement.scrollLeft,Q.body.scrollLeft);},getDocumentScrollTop:function(Q){Q=Q||N;return Math.max(Q.documentElement.scrollTop,Q.body.scrollTop);},insertBefore:function(R,Q){R=B.Dom.get(R);Q=B.Dom.get(Q);if(!R||!Q||!Q.parentNode){return null;}return Q.parentNode.insertBefore(R,Q);},insertAfter:function(R,Q){R=B.Dom.get(R);Q=B.Dom.get(Q);if(!R||!Q||!Q.parentNode){return null;}if(Q.nextSibling){return Q.parentNode.insertBefore(R,Q.nextSibling);}else{return Q.parentNode.appendChild(R);}},getClientRegion:function(){var S=B.Dom.getDocumentScrollTop(),R=B.Dom.getDocumentScrollLeft(),T=B.Dom.getViewportWidth()+R,Q=B.Dom.getViewportHeight()+S;return new B.Region(S,T,Q,R);}};var I=function(){if(N.documentElement.getBoundingClientRect){return function(S){var T=S.getBoundingClientRect(),R=Math.round;var Q=S.ownerDocument;return[R(T.left+B.Dom.getDocumentScrollLeft(Q)),R(T.top+B.Dom.getDocumentScrollTop(Q))];};}else{return function(S){var T=[S.offsetLeft,S.offsetTop];var R=S.offsetParent;var Q=(M&&B.Dom.getStyle(S,"position")=="absolute"&&S.offsetParent==S.ownerDocument.body);if(R!=S){while(R){T[0]+=R.offsetLeft;T[1]+=R.offsetTop;if(!Q&&M&&B.Dom.getStyle(R,"position")=="absolute"){Q=true;}R=R.offsetParent;}}if(Q){T[0]-=S.ownerDocument.body.offsetLeft;T[1]-=S.ownerDocument.body.offsetTop;}R=S.parentNode;while(R.tagName&&!E.ROOT_TAG.test(R.tagName)){if(R.scrollTop||R.scrollLeft){T[0]-=R.scrollLeft;T[1]-=R.scrollTop;}R=R.parentNode;}return T;};}}();})();YAHOO.util.Region=function(C,D,A,B){this.top=C;this[1]=C;this.right=D;this.bottom=A;this.left=B;this[0]=B;};YAHOO.util.Region.prototype.contains=function(A){return(A.left>=this.left&&A.right<=this.right&&A.top>=this.top&&A.bottom<=this.bottom);};YAHOO.util.Region.prototype.getArea=function(){return((this.bottom-this.top)*(this.right-this.left));};YAHOO.util.Region.prototype.intersect=function(E){var C=Math.max(this.top,E.top);var D=Math.min(this.right,E.right);var A=Math.min(this.bottom,E.bottom);var B=Math.max(this.left,E.left);if(A>=C&&D>=B){return new YAHOO.util.Region(C,D,A,B);}else{return null;}};YAHOO.util.Region.prototype.union=function(E){var C=Math.min(this.top,E.top);var D=Math.max(this.right,E.right);var A=Math.max(this.bottom,E.bottom);var B=Math.min(this.left,E.left);return new YAHOO.util.Region(C,D,A,B);};YAHOO.util.Region.prototype.toString=function(){return("Region {"+"top: "+this.top+", right: "+this.right+", bottom: "+this.bottom+", left: "+this.left+"}");};YAHOO.util.Region.getRegion=function(D){var F=YAHOO.util.Dom.getXY(D);var C=F[1];var E=F[0]+D.offsetWidth;var A=F[1]+D.offsetHeight;var B=F[0];return new YAHOO.util.Region(C,E,A,B);};YAHOO.util.Point=function(A,B){if(YAHOO.lang.isArray(A)){B=A[1];A=A[0];}this.x=this.right=this.left=this[0]=A;this.y=this.top=this.bottom=this[1]=B;};YAHOO.util.Point.prototype=new YAHOO.util.Region();YAHOO.register("dom",YAHOO.util.Dom,{version:"2.6.0",build:"1321"});YAHOO.util.CustomEvent=function(D,B,C,A){this.type=D;this.scope=B||window;this.silent=C;this.signature=A||YAHOO.util.CustomEvent.LIST;this.subscribers=[];if(!this.silent){}var E="_YUICEOnSubscribe";if(D!==E){this.subscribeEvent=new YAHOO.util.CustomEvent(E,this,true);}this.lastError=null;};YAHOO.util.CustomEvent.LIST=0;YAHOO.util.CustomEvent.FLAT=1;YAHOO.util.CustomEvent.prototype={subscribe:function(B,C,A){if(!B){throw new Error("Invalid callback for subscriber to '"+this.type+"'");}if(this.subscribeEvent){this.subscribeEvent.fire(B,C,A);}this.subscribers.push(new YAHOO.util.Subscriber(B,C,A));},unsubscribe:function(D,F){if(!D){return this.unsubscribeAll();}var E=false;for(var B=0,A=this.subscribers.length;B<A;++B){var C=this.subscribers[B];if(C&&C.contains(D,F)){this._delete(B);E=true;}}return E;},fire:function(){this.lastError=null;var K=[],E=this.subscribers.length;if(!E&&this.silent){return true;}var I=[].slice.call(arguments,0),G=true,D,J=false;if(!this.silent){}var C=this.subscribers.slice(),A=YAHOO.util.Event.throwErrors;for(D=0;D<E;++D){var M=C[D];if(!M){J=true;}else{if(!this.silent){}var L=M.getScope(this.scope);if(this.signature==YAHOO.util.CustomEvent.FLAT){var B=null;if(I.length>0){B=I[0];}try{G=M.fn.call(L,B,M.obj);}catch(F){this.lastError=F;if(A){throw F;}}}else{try{G=M.fn.call(L,this.type,I,M.obj);}catch(H){this.lastError=H;if(A){throw H;}}}if(false===G){if(!this.silent){}break;}}}return(G!==false);},unsubscribeAll:function(){for(var A=this.subscribers.length-1;A>-1;A--){this._delete(A);}this.subscribers=[];return A;},_delete:function(A){var B=this.subscribers[A];if(B){delete B.fn;delete B.obj;}this.subscribers.splice(A,1);},toString:function(){return"CustomEvent: "+"'"+this.type+"', "+"scope: "+this.scope;}};YAHOO.util.Subscriber=function(B,C,A){this.fn=B;this.obj=YAHOO.lang.isUndefined(C)?null:C;this.override=A;};YAHOO.util.Subscriber.prototype.getScope=function(A){if(this.override){if(this.override===true){return this.obj;}else{return this.override;}}return A;};YAHOO.util.Subscriber.prototype.contains=function(A,B){if(B){return(this.fn==A&&this.obj==B);}else{return(this.fn==A);}};YAHOO.util.Subscriber.prototype.toString=function(){return"Subscriber { obj: "+this.obj+", override: "+(this.override||"no")+" }";};if(!YAHOO.util.Event){YAHOO.util.Event=function(){var H=false;var I=[];var J=[];var G=[];var E=[];var C=0;var F=[];var B=[];var A=0;var D={63232:38,63233:40,63234:37,63235:39,63276:33,63277:34,25:9};var K=YAHOO.env.ua.ie?"focusin":"focus";var L=YAHOO.env.ua.ie?"focusout":"blur";return{POLL_RETRYS:2000,POLL_INTERVAL:20,EL:0,TYPE:1,FN:2,WFN:3,UNLOAD_OBJ:3,ADJ_SCOPE:4,OBJ:5,OVERRIDE:6,CAPTURE:7,lastError:null,isSafari:YAHOO.env.ua.webkit,webkit:YAHOO.env.ua.webkit,isIE:YAHOO.env.ua.ie,_interval:null,_dri:null,DOMReady:false,throwErrors:false,startInterval:function(){if(!this._interval){var M=this;var N=function(){M._tryPreloadAttach();};this._interval=setInterval(N,this.POLL_INTERVAL);}},onAvailable:function(R,O,S,Q,P){var M=(YAHOO.lang.isString(R))?[R]:R;for(var N=0;N<M.length;N=N+1){F.push({id:M[N],fn:O,obj:S,override:Q,checkReady:P});}C=this.POLL_RETRYS;this.startInterval();},onContentReady:function(O,M,P,N){this.onAvailable(O,M,P,N,true);},onDOMReady:function(M,O,N){if(this.DOMReady){setTimeout(function(){var P=window;if(N){if(N===true){P=O;}else{P=N;}}M.call(P,"DOMReady",[],O);},0);}else{this.DOMReadyEvent.subscribe(M,O,N);}},_addListener:function(O,M,X,S,N,a){if(!X||!X.call){return false;}if(this._isValidCollection(O)){var Y=true;for(var T=0,V=O.length;T<V;++T){Y=this._addListener(O[T],M,X,S,N,a)&&Y;}return Y;}else{if(YAHOO.lang.isString(O)){var R=this.getEl(O);if(R){O=R;}else{this.onAvailable(O,function(){YAHOO.util.Event._addListener(O,M,X,S,N,a);});return true;}}}if(!O){return false;}if("unload"==M&&S!==this){J[J.length]=[O,M,X,S,N,a];return true;}var b=O;if(N){if(N===true){b=S;}else{b=N;}}var P=function(c){return X.call(b,YAHOO.util.Event.getEvent(c,O),S);};var Z=[O,M,X,P,b,S,N,a];var U=I.length;I[U]=Z;if(this.useLegacyEvent(O,M)){var Q=this.getLegacyIndex(O,M);if(Q==-1||O!=G[Q][0]){Q=G.length;B[O.id+M]=Q;G[Q]=[O,M,O["on"+M]];E[Q]=[];O["on"+M]=function(c){YAHOO.util.Event.fireLegacyEvent(YAHOO.util.Event.getEvent(c),Q);};}E[Q].push(Z);}else{try{this._simpleAdd(O,M,P,a);}catch(W){this.lastError=W;this._removeListener(O,M,X,a);return false;}}return true;},addListener:function(O,Q,N,P,M){return this._addListener(O,Q,N,P,M,false);},addFocusListener:function(O,N,P,M){return this._addListener(O,K,N,P,M,true);},removeFocusListener:function(N,M){return this._removeListener(N,K,M,true);},addBlurListener:function(O,N,P,M){return this._addListener(O,L,N,P,M,true);},removeBlurListener:function(N,M){return this._removeListener(N,L,M,true);},fireLegacyEvent:function(Q,O){var S=true,M,U,T,V,R;U=E[O].slice();for(var N=0,P=U.length;N<P;++N){T=U[N];if(T&&T[this.WFN]){V=T[this.ADJ_SCOPE];R=T[this.WFN].call(V,Q);S=(S&&R);}}M=G[O];if(M&&M[2]){M[2](Q);}return S;},getLegacyIndex:function(N,O){var M=this.generateId(N)+O;if(typeof B[M]=="undefined"){return -1;}else{return B[M];}},useLegacyEvent:function(M,N){return(this.webkit&&this.webkit<419&&("click"==N||"dblclick"==N));},_removeListener:function(N,M,V,Y){var Q,T,X;if(typeof N=="string"){N=this.getEl(N);}else{if(this._isValidCollection(N)){var W=true;for(Q=N.length-1;Q>-1;Q--){W=(this._removeListener(N[Q],M,V,Y)&&W);}return W;}}if(!V||!V.call){return this.purgeElement(N,false,M);}if("unload"==M){for(Q=J.length-1;Q>-1;Q--){X=J[Q];if(X&&X[0]==N&&X[1]==M&&X[2]==V){J.splice(Q,1);return true;}}return false;}var R=null;var S=arguments[4];if("undefined"===typeof S){S=this._getCacheIndex(N,M,V);}if(S>=0){R=I[S];}if(!N||!R){return false;}if(this.useLegacyEvent(N,M)){var P=this.getLegacyIndex(N,M);var O=E[P];if(O){for(Q=0,T=O.length;Q<T;++Q){X=O[Q];if(X&&X[this.EL]==N&&X[this.TYPE]==M&&X[this.FN]==V){O.splice(Q,1);break;}}}}else{try{this._simpleRemove(N,M,R[this.WFN],Y);}catch(U){this.lastError=U;return false;}}delete I[S][this.WFN];delete I[S][this.FN];
+I.splice(S,1);return true;},removeListener:function(N,O,M){return this._removeListener(N,O,M,false);},getTarget:function(O,N){var M=O.target||O.srcElement;return this.resolveTextNode(M);},resolveTextNode:function(N){try{if(N&&3==N.nodeType){return N.parentNode;}}catch(M){}return N;},getPageX:function(N){var M=N.pageX;if(!M&&0!==M){M=N.clientX||0;if(this.isIE){M+=this._getScrollLeft();}}return M;},getPageY:function(M){var N=M.pageY;if(!N&&0!==N){N=M.clientY||0;if(this.isIE){N+=this._getScrollTop();}}return N;},getXY:function(M){return[this.getPageX(M),this.getPageY(M)];},getRelatedTarget:function(N){var M=N.relatedTarget;if(!M){if(N.type=="mouseout"){M=N.toElement;}else{if(N.type=="mouseover"){M=N.fromElement;}}}return this.resolveTextNode(M);},getTime:function(O){if(!O.time){var N=new Date().getTime();try{O.time=N;}catch(M){this.lastError=M;return N;}}return O.time;},stopEvent:function(M){this.stopPropagation(M);this.preventDefault(M);},stopPropagation:function(M){if(M.stopPropagation){M.stopPropagation();}else{M.cancelBubble=true;}},preventDefault:function(M){if(M.preventDefault){M.preventDefault();}else{M.returnValue=false;}},getEvent:function(O,M){var N=O||window.event;if(!N){var P=this.getEvent.caller;while(P){N=P.arguments[0];if(N&&Event==N.constructor){break;}P=P.caller;}}return N;},getCharCode:function(N){var M=N.keyCode||N.charCode||0;if(YAHOO.env.ua.webkit&&(M in D)){M=D[M];}return M;},_getCacheIndex:function(Q,R,P){for(var O=0,N=I.length;O<N;O=O+1){var M=I[O];if(M&&M[this.FN]==P&&M[this.EL]==Q&&M[this.TYPE]==R){return O;}}return -1;},generateId:function(M){var N=M.id;if(!N){N="yuievtautoid-"+A;++A;M.id=N;}return N;},_isValidCollection:function(N){try{return(N&&typeof N!=="string"&&N.length&&!N.tagName&&!N.alert&&typeof N[0]!=="undefined");}catch(M){return false;}},elCache:{},getEl:function(M){return(typeof M==="string")?document.getElementById(M):M;},clearCache:function(){},DOMReadyEvent:new YAHOO.util.CustomEvent("DOMReady",this),_load:function(N){if(!H){H=true;var M=YAHOO.util.Event;M._ready();M._tryPreloadAttach();}},_ready:function(N){var M=YAHOO.util.Event;if(!M.DOMReady){M.DOMReady=true;M.DOMReadyEvent.fire();M._simpleRemove(document,"DOMContentLoaded",M._ready);}},_tryPreloadAttach:function(){if(F.length===0){C=0;clearInterval(this._interval);this._interval=null;return ;}if(this.locked){return ;}if(this.isIE){if(!this.DOMReady){this.startInterval();return ;}}this.locked=true;var S=!H;if(!S){S=(C>0&&F.length>0);}var R=[];var T=function(V,W){var U=V;if(W.override){if(W.override===true){U=W.obj;}else{U=W.override;}}W.fn.call(U,W.obj);};var N,M,Q,P,O=[];for(N=0,M=F.length;N<M;N=N+1){Q=F[N];if(Q){P=this.getEl(Q.id);if(P){if(Q.checkReady){if(H||P.nextSibling||!S){O.push(Q);F[N]=null;}}else{T(P,Q);F[N]=null;}}else{R.push(Q);}}}for(N=0,M=O.length;N<M;N=N+1){Q=O[N];T(this.getEl(Q.id),Q);}C--;if(S){for(N=F.length-1;N>-1;N--){Q=F[N];if(!Q||!Q.id){F.splice(N,1);}}this.startInterval();}else{clearInterval(this._interval);this._interval=null;}this.locked=false;},purgeElement:function(Q,R,T){var O=(YAHOO.lang.isString(Q))?this.getEl(Q):Q;var S=this.getListeners(O,T),P,M;if(S){for(P=S.length-1;P>-1;P--){var N=S[P];this._removeListener(O,N.type,N.fn,N.capture);}}if(R&&O&&O.childNodes){for(P=0,M=O.childNodes.length;P<M;++P){this.purgeElement(O.childNodes[P],R,T);}}},getListeners:function(O,M){var R=[],N;if(!M){N=[I,J];}else{if(M==="unload"){N=[J];}else{N=[I];}}var T=(YAHOO.lang.isString(O))?this.getEl(O):O;for(var Q=0;Q<N.length;Q=Q+1){var V=N[Q];if(V){for(var S=0,U=V.length;S<U;++S){var P=V[S];if(P&&P[this.EL]===T&&(!M||M===P[this.TYPE])){R.push({type:P[this.TYPE],fn:P[this.FN],obj:P[this.OBJ],adjust:P[this.OVERRIDE],scope:P[this.ADJ_SCOPE],capture:P[this.CAPTURE],index:S});}}}}return(R.length)?R:null;},_unload:function(S){var M=YAHOO.util.Event,P,O,N,R,Q,T=J.slice();for(P=0,R=J.length;P<R;++P){N=T[P];if(N){var U=window;if(N[M.ADJ_SCOPE]){if(N[M.ADJ_SCOPE]===true){U=N[M.UNLOAD_OBJ];}else{U=N[M.ADJ_SCOPE];}}N[M.FN].call(U,M.getEvent(S,N[M.EL]),N[M.UNLOAD_OBJ]);T[P]=null;N=null;U=null;}}J=null;if(I){for(O=I.length-1;O>-1;O--){N=I[O];if(N){M._removeListener(N[M.EL],N[M.TYPE],N[M.FN],N[M.CAPTURE],O);}}N=null;}G=null;M._simpleRemove(window,"unload",M._unload);},_getScrollLeft:function(){return this._getScroll()[1];},_getScrollTop:function(){return this._getScroll()[0];},_getScroll:function(){var M=document.documentElement,N=document.body;if(M&&(M.scrollTop||M.scrollLeft)){return[M.scrollTop,M.scrollLeft];}else{if(N){return[N.scrollTop,N.scrollLeft];}else{return[0,0];}}},regCE:function(){},_simpleAdd:function(){if(window.addEventListener){return function(O,P,N,M){O.addEventListener(P,N,(M));};}else{if(window.attachEvent){return function(O,P,N,M){O.attachEvent("on"+P,N);};}else{return function(){};}}}(),_simpleRemove:function(){if(window.removeEventListener){return function(O,P,N,M){O.removeEventListener(P,N,(M));};}else{if(window.detachEvent){return function(N,O,M){N.detachEvent("on"+O,M);};}else{return function(){};}}}()};}();(function(){var EU=YAHOO.util.Event;EU.on=EU.addListener;EU.onFocus=EU.addFocusListener;EU.onBlur=EU.addBlurListener;
+/* DOMReady: based on work by: Dean Edwards/John Resig/Matthias Miller */
+if(EU.isIE){YAHOO.util.Event.onDOMReady(YAHOO.util.Event._tryPreloadAttach,YAHOO.util.Event,true);var n=document.createElement("p");EU._dri=setInterval(function(){try{n.doScroll("left");clearInterval(EU._dri);EU._dri=null;EU._ready();n=null;}catch(ex){}},EU.POLL_INTERVAL);}else{if(EU.webkit&&EU.webkit<525){EU._dri=setInterval(function(){var rs=document.readyState;if("loaded"==rs||"complete"==rs){clearInterval(EU._dri);EU._dri=null;EU._ready();}},EU.POLL_INTERVAL);}else{EU._simpleAdd(document,"DOMContentLoaded",EU._ready);}}EU._simpleAdd(window,"load",EU._load);EU._simpleAdd(window,"unload",EU._unload);EU._tryPreloadAttach();})();}YAHOO.util.EventProvider=function(){};YAHOO.util.EventProvider.prototype={__yui_events:null,__yui_subscribers:null,subscribe:function(A,C,F,E){this.__yui_events=this.__yui_events||{};
+var D=this.__yui_events[A];if(D){D.subscribe(C,F,E);}else{this.__yui_subscribers=this.__yui_subscribers||{};var B=this.__yui_subscribers;if(!B[A]){B[A]=[];}B[A].push({fn:C,obj:F,override:E});}},unsubscribe:function(C,E,G){this.__yui_events=this.__yui_events||{};var A=this.__yui_events;if(C){var F=A[C];if(F){return F.unsubscribe(E,G);}}else{var B=true;for(var D in A){if(YAHOO.lang.hasOwnProperty(A,D)){B=B&&A[D].unsubscribe(E,G);}}return B;}return false;},unsubscribeAll:function(A){return this.unsubscribe(A);},createEvent:function(G,D){this.__yui_events=this.__yui_events||{};var A=D||{};var I=this.__yui_events;if(I[G]){}else{var H=A.scope||this;var E=(A.silent);var B=new YAHOO.util.CustomEvent(G,H,E,YAHOO.util.CustomEvent.FLAT);I[G]=B;if(A.onSubscribeCallback){B.subscribeEvent.subscribe(A.onSubscribeCallback);}this.__yui_subscribers=this.__yui_subscribers||{};var F=this.__yui_subscribers[G];if(F){for(var C=0;C<F.length;++C){B.subscribe(F[C].fn,F[C].obj,F[C].override);}}}return I[G];},fireEvent:function(E,D,A,C){this.__yui_events=this.__yui_events||{};var G=this.__yui_events[E];if(!G){return null;}var B=[];for(var F=1;F<arguments.length;++F){B.push(arguments[F]);}return G.fire.apply(G,B);},hasEvent:function(A){if(this.__yui_events){if(this.__yui_events[A]){return true;}}return false;}};YAHOO.util.KeyListener=function(A,F,B,C){if(!A){}else{if(!F){}else{if(!B){}}}if(!C){C=YAHOO.util.KeyListener.KEYDOWN;}var D=new YAHOO.util.CustomEvent("keyPressed");this.enabledEvent=new YAHOO.util.CustomEvent("enabled");this.disabledEvent=new YAHOO.util.CustomEvent("disabled");if(typeof A=="string"){A=document.getElementById(A);}if(typeof B=="function"){D.subscribe(B);}else{D.subscribe(B.fn,B.scope,B.correctScope);}function E(J,I){if(!F.shift){F.shift=false;}if(!F.alt){F.alt=false;}if(!F.ctrl){F.ctrl=false;}if(J.shiftKey==F.shift&&J.altKey==F.alt&&J.ctrlKey==F.ctrl){var G;if(F.keys instanceof Array){for(var H=0;H<F.keys.length;H++){G=F.keys[H];if(G==J.charCode){D.fire(J.charCode,J);break;}else{if(G==J.keyCode){D.fire(J.keyCode,J);break;}}}}else{G=F.keys;if(G==J.charCode){D.fire(J.charCode,J);}else{if(G==J.keyCode){D.fire(J.keyCode,J);}}}}}this.enable=function(){if(!this.enabled){YAHOO.util.Event.addListener(A,C,E);this.enabledEvent.fire(F);}this.enabled=true;};this.disable=function(){if(this.enabled){YAHOO.util.Event.removeListener(A,C,E);this.disabledEvent.fire(F);}this.enabled=false;};this.toString=function(){return"KeyListener ["+F.keys+"] "+A.tagName+(A.id?"["+A.id+"]":"");};};YAHOO.util.KeyListener.KEYDOWN="keydown";YAHOO.util.KeyListener.KEYUP="keyup";YAHOO.util.KeyListener.KEY={ALT:18,BACK_SPACE:8,CAPS_LOCK:20,CONTROL:17,DELETE:46,DOWN:40,END:35,ENTER:13,ESCAPE:27,HOME:36,LEFT:37,META:224,NUM_LOCK:144,PAGE_DOWN:34,PAGE_UP:33,PAUSE:19,PRINTSCREEN:44,RIGHT:39,SCROLL_LOCK:145,SHIFT:16,SPACE:32,TAB:9,UP:38};YAHOO.register("event",YAHOO.util.Event,{version:"2.6.0",build:"1321"});YAHOO.register("yahoo-dom-event", YAHOO, {version: "2.6.0", build: "1321"});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-dom.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-dom.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-dom.js	(revision 76)
@@ -0,0 +1,160 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+	var doc = document,
+		isCSS1 = doc.compatMode == "CSS1Compat",
+		MAX = Math.max,		
+        ROUND = Math.round,
+		PARSEINT = parseInt;
+		
+	Ext.lib.Dom = {
+	    isAncestor : function(p, c) {
+		    var ret = false;
+			
+			p = Ext.getDom(p);
+			c = Ext.getDom(c);
+			if (p && c) {
+				if (p.contains) {
+					return p.contains(c);
+				} else if (p.compareDocumentPosition) {
+					return !!(p.compareDocumentPosition(c) & 16);
+				} else {
+					while (c = c.parentNode) {
+						ret = c == p || ret;	        			
+					}
+				}	            
+			}	
+			return ret;
+		},
+		
+        getViewWidth : function(full) {
+            return full ? this.getDocumentWidth() : this.getViewportWidth();
+        },
+
+        getViewHeight : function(full) {
+            return full ? this.getDocumentHeight() : this.getViewportHeight();
+        },
+
+        getDocumentHeight: function() {            
+            return MAX(!isCSS1 ? doc.body.scrollHeight : doc.documentElement.scrollHeight, this.getViewportHeight());
+        },
+
+        getDocumentWidth: function() {            
+            return MAX(!isCSS1 ? doc.body.scrollWidth : doc.documentElement.scrollWidth, this.getViewportWidth());
+        },
+
+        getViewportHeight: function(){
+	        return Ext.isIE ? 
+	        	   (Ext.isStrict ? doc.documentElement.clientHeight : doc.body.clientHeight) :
+	        	   self.innerHeight;
+        },
+
+        getViewportWidth : function() {
+	        return !Ext.isStrict && !Ext.isOpera ? doc.body.clientWidth :
+	        	   Ext.isIE ? doc.documentElement.clientWidth : self.innerWidth;
+        },
+        
+        getY : function(el) {
+            return this.getXY(el)[1];
+        },
+
+        getX : function(el) {
+            return this.getXY(el)[0];
+        },
+
+        getXY : function(el) {
+            var p, 
+            	pe, 
+            	b,
+            	bt, 
+            	bl,     
+            	dbd,       	
+            	x = 0,
+            	y = 0, 
+            	scroll,
+            	hasAbsolute, 
+            	bd = (doc.body || doc.documentElement),
+            	ret = [0,0];
+            	
+            el = Ext.getDom(el);
+
+            if(el != bd){
+	            if (el.getBoundingClientRect) {
+	                b = el.getBoundingClientRect();
+	                scroll = fly(document).getScroll();
+	                ret = [ROUND(b.left + scroll.left), ROUND(b.top + scroll.top)];
+	            } else {  
+		            p = el;		
+		            hasAbsolute = fly(el).isStyle("position", "absolute");
+		
+		            while (p) {
+			            pe = fly(p);		
+		                x += p.offsetLeft;
+		                y += p.offsetTop;
+		
+		                hasAbsolute = hasAbsolute || pe.isStyle("position", "absolute");
+		                		
+		                if (Ext.isGecko) {		                    
+		                    y += bt = PARSEINT(pe.getStyle("borderTopWidth"), 10) || 0;
+		                    x += bl = PARSEINT(pe.getStyle("borderLeftWidth"), 10) || 0;	
+		
+		                    if (p != el && !pe.isStyle('overflow','visible')) {
+		                        x += bl;
+		                        y += bt;
+		                    }
+		                }
+		                p = p.offsetParent;
+		            }
+		
+		            if (Ext.isSafari && hasAbsolute) {
+		                x -= bd.offsetLeft;
+		                y -= bd.offsetTop;
+		            }
+		
+		            if (Ext.isGecko && !hasAbsolute) {
+		                dbd = fly(bd);
+		                x += PARSEINT(dbd.getStyle("borderLeftWidth"), 10) || 0;
+		                y += PARSEINT(dbd.getStyle("borderTopWidth"), 10) || 0;
+		            }
+		
+		            p = el.parentNode;
+		            while (p && p != bd) {
+		                if (!Ext.isOpera || (p.tagName != 'TR' && !fly(p).isStyle("display", "inline"))) {
+		                    x -= p.scrollLeft;
+		                    y -= p.scrollTop;
+		                }
+		                p = p.parentNode;
+		            }
+		            ret = [x,y];
+	            }
+         	}
+            return ret;
+        },
+
+        setXY : function(el, xy) {
+            (el = Ext.fly(el, '_setXY')).position();
+            
+            var pts = el.translatePoints(xy),
+            	style = el.dom.style,
+            	pos;            	
+            
+            for (pos in pts) {	            
+	            if (!isNaN(pts[pos])) {
+	                style[pos] = pts[pos] + "px";
+                }
+            }
+        },
+
+        setX : function(el, x) {
+            this.setXY(el, [x, false]);
+        },
+
+        setY : function(el, y) {
+            this.setXY(el, [false, y]);
+        }
+    };
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-event.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-event.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-event.js	(revision 76)
@@ -0,0 +1,362 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.lib.Event = function() {
+    var loadComplete = false,
+        unloadListeners = {},
+        retryCount = 0,
+        onAvailStack = [],
+        _interval,
+        locked = false,
+        win = window,
+        doc = document,
+
+        // constants
+        POLL_RETRYS = 200,
+        POLL_INTERVAL = 20,
+        TYPE = 0,
+        FN = 1,
+        OBJ = 2,
+        ADJ_SCOPE = 3,
+        SCROLLLEFT = 'scrollLeft',
+        SCROLLTOP = 'scrollTop',
+        UNLOAD = 'unload',
+        MOUSEOVER = 'mouseover',
+        MOUSEOUT = 'mouseout',
+        // private
+        doAdd = function() {
+            var ret;
+            if (win.addEventListener) {
+                ret = function(el, eventName, fn, capture) {
+                    if (eventName == 'mouseenter') {
+                        fn = fn.createInterceptor(checkRelatedTarget);
+                        el.addEventListener(MOUSEOVER, fn, (capture));
+                    } else if (eventName == 'mouseleave') {
+                        fn = fn.createInterceptor(checkRelatedTarget);
+                        el.addEventListener(MOUSEOUT, fn, (capture));
+                    } else {
+                        el.addEventListener(eventName, fn, (capture));
+                    }
+                    return fn;
+                };
+            } else if (win.attachEvent) {
+                ret = function(el, eventName, fn, capture) {
+                    el.attachEvent("on" + eventName, fn);
+                    return fn;
+                };
+            } else {
+                ret = function(){};
+            }
+            return ret;
+        }(),
+        // private
+        doRemove = function(){
+            var ret;
+            if (win.removeEventListener) {
+                ret = function (el, eventName, fn, capture) {
+                    if (eventName == 'mouseenter') {
+                        eventName = MOUSEOVER;
+                    } else if (eventName == 'mouseleave') {
+                        eventName = MOUSEOUT;
+                    }
+                    el.removeEventListener(eventName, fn, (capture));
+                };
+            } else if (win.detachEvent) {
+                ret = function (el, eventName, fn) {
+                    el.detachEvent("on" + eventName, fn);
+                };
+            } else {
+                ret = function(){};
+            }
+            return ret;
+        }();
+
+    function checkRelatedTarget(e) {
+        return !elContains(e.currentTarget, pub.getRelatedTarget(e));
+    }
+
+    function elContains(parent, child) {
+       if(parent && parent.firstChild){
+         while(child) {
+            if(child === parent) {
+                return true;
+            }
+            child = child.parentNode;
+            if(child && (child.nodeType != 1)) {
+                child = null;
+            }
+          }
+        }
+        return false;
+    }
+
+    // private
+    function _tryPreloadAttach() {
+        var ret = false,
+            notAvail = [],
+            element, i, v, override,
+            tryAgain = !loadComplete || (retryCount > 0);
+
+        if(!locked){
+            locked = true;
+            
+            for(i = 0; i < onAvailStack.length; ++i){
+                v = onAvailStack[i];
+                if(v && (element = doc.getElementById(v.id))){
+                    if(!v.checkReady || loadComplete || element.nextSibling || (doc && doc.body)) {
+                        override = v.override;
+                        element = override ? (override === true ? v.obj : override) : element;
+                        v.fn.call(element, v.obj);
+                        onAvailStack.remove(v);
+                        --i;
+                    }else{
+                        notAvail.push(v);
+                    }
+                }
+            }
+
+            retryCount = (notAvail.length === 0) ? 0 : retryCount - 1;
+
+            if (tryAgain) {
+                startInterval();
+            } else {
+                clearInterval(_interval);
+                _interval = null;
+            }
+            ret = !(locked = false);
+        }
+        return ret;
+    }
+
+    // private
+    function startInterval() {
+        if(!_interval){
+            var callback = function() {
+                _tryPreloadAttach();
+            };
+            _interval = setInterval(callback, POLL_INTERVAL);
+        }
+    }
+
+    // private
+    function getScroll() {
+        var dd = doc.documentElement,
+            db = doc.body;
+        if(dd && (dd[SCROLLTOP] || dd[SCROLLLEFT])){
+            return [dd[SCROLLLEFT], dd[SCROLLTOP]];
+        }else if(db){
+            return [db[SCROLLLEFT], db[SCROLLTOP]];
+        }else{
+            return [0, 0];
+        }
+    }
+
+    // private
+    function getPageCoord (ev, xy) {
+        ev = ev.browserEvent || ev;
+        var coord  = ev['page' + xy];
+        if (!coord && coord !== 0) {
+            coord = ev['client' + xy] || 0;
+
+            if (Ext.isIE) {
+                coord += getScroll()[xy == "X" ? 0 : 1];
+            }
+        }
+
+        return coord;
+    }
+
+    var pub =  {
+        extAdapter: true,
+        onAvailable : function(p_id, p_fn, p_obj, p_override) {
+            onAvailStack.push({
+                id:         p_id,
+                fn:         p_fn,
+                obj:        p_obj,
+                override:   p_override,
+                checkReady: false });
+
+            retryCount = POLL_RETRYS;
+            startInterval();
+        },
+
+        // This function should ALWAYS be called from Ext.EventManager
+        addListener: function(el, eventName, fn) {
+            el = Ext.getDom(el);
+            if (el && fn) {
+                if (eventName == UNLOAD) {
+                    if (unloadListeners[el.id] === undefined) {
+                        unloadListeners[el.id] = [];
+                    }
+                    unloadListeners[el.id].push([eventName, fn]);
+                    return fn;
+                }
+                return doAdd(el, eventName, fn, false);
+            }
+            return false;
+        },
+
+        // This function should ALWAYS be called from Ext.EventManager
+        removeListener: function(el, eventName, fn) {
+            el = Ext.getDom(el);
+            var i, len, li, lis;
+            if (el && fn) {
+                if(eventName == UNLOAD){
+                    if((lis = unloadListeners[el.id]) !== undefined){
+                        for(i = 0, len = lis.length; i < len; i++){
+                            if((li = lis[i]) && li[TYPE] == eventName && li[FN] == fn){
+                                unloadListeners[el.id].splice(i, 1);
+                            }
+                        }
+                    }
+                    return;
+                }
+                doRemove(el, eventName, fn, false);
+            }
+        },
+
+        getTarget : function(ev) {
+            ev = ev.browserEvent || ev;
+            return this.resolveTextNode(ev.target || ev.srcElement);
+        },
+
+        resolveTextNode : Ext.isGecko ? function(node){
+            if(!node){
+                return;
+            }
+            // work around firefox bug, https://bugzilla.mozilla.org/show_bug.cgi?id=101197
+            var s = HTMLElement.prototype.toString.call(node);
+            if(s == '[xpconnect wrapped native prototype]' || s == '[object XULElement]'){
+                return;
+            }
+            return node.nodeType == 3 ? node.parentNode : node;
+        } : function(node){
+            return node && node.nodeType == 3 ? node.parentNode : node;
+        },
+
+        getRelatedTarget : function(ev) {
+            ev = ev.browserEvent || ev;
+            return this.resolveTextNode(ev.relatedTarget ||
+                (/(mouseout|mouseleave)/.test(ev.type) ? ev.toElement :
+                 /(mouseover|mouseenter)/.test(ev.type) ? ev.fromElement : null));
+        },
+
+        getPageX : function(ev) {
+            return getPageCoord(ev, "X");
+        },
+
+        getPageY : function(ev) {
+            return getPageCoord(ev, "Y");
+        },
+
+
+        getXY : function(ev) {
+            return [this.getPageX(ev), this.getPageY(ev)];
+        },
+
+        stopEvent : function(ev) {
+            this.stopPropagation(ev);
+            this.preventDefault(ev);
+        },
+
+        stopPropagation : function(ev) {
+            ev = ev.browserEvent || ev;
+            if (ev.stopPropagation) {
+                ev.stopPropagation();
+            } else {
+                ev.cancelBubble = true;
+            }
+        },
+
+        preventDefault : function(ev) {
+            ev = ev.browserEvent || ev;
+            if (ev.preventDefault) {
+                ev.preventDefault();
+            } else {
+                if (ev.keyCode) {
+                    ev.keyCode = 0;
+                }
+                ev.returnValue = false;
+            }
+        },
+
+        getEvent : function(e) {
+            e = e || win.event;
+            if (!e) {
+                var c = this.getEvent.caller;
+                while (c) {
+                    e = c.arguments[0];
+                    if (e && Event == e.constructor) {
+                        break;
+                    }
+                    c = c.caller;
+                }
+            }
+            return e;
+        },
+
+        getCharCode : function(ev) {
+            ev = ev.browserEvent || ev;
+            return ev.charCode || ev.keyCode || 0;
+        },
+
+        //clearCache: function() {},
+        // deprecated, call from EventManager
+        getListeners : function(el, eventName) {
+            Ext.EventManager.getListeners(el, eventName);
+        },
+
+        // deprecated, call from EventManager
+        purgeElement : function(el, recurse, eventName) {
+            Ext.EventManager.purgeElement(el, recurse, eventName);
+        },
+
+        _load : function(e) {
+            loadComplete = true;
+            
+            if (Ext.isIE && e !== true) {
+                // IE8 complains that _load is null or not an object
+                // so lets remove self via arguments.callee
+                doRemove(win, "load", arguments.callee);
+            }
+        },
+
+        _unload : function(e) {
+             var EU = Ext.lib.Event,
+                i, v, ul, id, len, scope;
+
+            for (id in unloadListeners) {
+                ul = unloadListeners[id];
+                for (i = 0, len = ul.length; i < len; i++) {
+                    v = ul[i];
+                    if (v) {
+                        try{
+                            scope = v[ADJ_SCOPE] ? (v[ADJ_SCOPE] === true ? v[OBJ] : v[ADJ_SCOPE]) :  win;
+                            v[FN].call(scope, EU.getEvent(e), v[OBJ]);
+                        }catch(ex){}
+                    }
+                }
+            };
+
+            Ext.EventManager._unload();
+
+            doRemove(win, UNLOAD, EU._unload);
+        }
+    };
+
+    // Initialize stuff.
+    pub.on = pub.addListener;
+    pub.un = pub.removeListener;
+    if (doc && doc.body) {
+        pub._load(true);
+    } else {
+        doAdd(win, "load", pub._load);
+    }
+    doAdd(win, UNLOAD, pub._unload);
+    _tryPreloadAttach();
+
+    return pub;
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-ajax.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-ajax.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-ajax.js	(revision 76)
@@ -0,0 +1,371 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+* Portions of this file are based on pieces of Yahoo User Interface Library
+* Copyright (c) 2007, Yahoo! Inc. All rights reserved.
+* YUI licensed under the BSD License:
+* http://developer.yahoo.net/yui/license.txt
+*/
+Ext.lib.Ajax = function() {
+    var activeX = ['Msxml2.XMLHTTP.6.0',
+                   'Msxml2.XMLHTTP.3.0',
+                   'Msxml2.XMLHTTP'],
+        CONTENTTYPE = 'Content-Type';
+
+    // private
+    function setHeader(o) {
+        var conn = o.conn,
+            prop,
+            headers = {};
+
+        function setTheHeaders(conn, headers){
+            for (prop in headers) {
+                if (headers.hasOwnProperty(prop)) {
+                    conn.setRequestHeader(prop, headers[prop]);
+                }
+            }
+        }
+
+        Ext.apply(headers, pub.headers, pub.defaultHeaders);
+        setTheHeaders(conn, headers);
+        delete pub.headers;
+    }
+
+    // private
+    function createExceptionObject(tId, callbackArg, isAbort, isTimeout) {
+        return {
+            tId : tId,
+            status : isAbort ? -1 : 0,
+            statusText : isAbort ? 'transaction aborted' : 'communication failure',
+            isAbort: isAbort,
+            isTimeout: isTimeout,
+            argument : callbackArg
+        };
+    }
+
+    // private
+    function initHeader(label, value) {
+        (pub.headers = pub.headers || {})[label] = value;
+    }
+
+    // private
+    function createResponseObject(o, callbackArg) {
+        var headerObj = {},
+            headerStr,
+            conn = o.conn,
+            t,
+            s,
+            // see: https://prototype.lighthouseapp.com/projects/8886/tickets/129-ie-mangles-http-response-status-code-204-to-1223
+            isBrokenStatus = conn.status == 1223;
+
+        try {
+            headerStr = o.conn.getAllResponseHeaders();
+            Ext.each(headerStr.replace(/\r\n/g, '\n').split('\n'), function(v){
+                t = v.indexOf(':');
+                if(t >= 0){
+                    s = v.substr(0, t).toLowerCase();
+                    if(v.charAt(t + 1) == ' '){
+                        ++t;
+                    }
+                    headerObj[s] = v.substr(t + 1);
+                }
+            });
+        } catch(e) {}
+
+        return {
+            tId : o.tId,
+            // Normalize the status and statusText when IE returns 1223, see the above link.
+            status : isBrokenStatus ? 204 : conn.status,
+            statusText : isBrokenStatus ? 'No Content' : conn.statusText,
+            getResponseHeader : function(header){return headerObj[header.toLowerCase()];},
+            getAllResponseHeaders : function(){return headerStr;},
+            responseText : conn.responseText,
+            responseXML : conn.responseXML,
+            argument : callbackArg
+        };
+    }
+
+    // private
+    function releaseObject(o) {
+        if (o.tId) {
+            pub.conn[o.tId] = null;
+        }
+        o.conn = null;
+        o = null;
+    }
+
+    // private
+    function handleTransactionResponse(o, callback, isAbort, isTimeout) {
+        if (!callback) {
+            releaseObject(o);
+            return;
+        }
+
+        var httpStatus, responseObject;
+
+        try {
+            if (o.conn.status !== undefined && o.conn.status != 0) {
+                httpStatus = o.conn.status;
+            }
+            else {
+                httpStatus = 13030;
+            }
+        }
+        catch(e) {
+            httpStatus = 13030;
+        }
+
+        if ((httpStatus >= 200 && httpStatus < 300) || (Ext.isIE && httpStatus == 1223)) {
+            responseObject = createResponseObject(o, callback.argument);
+            if (callback.success) {
+                if (!callback.scope) {
+                    callback.success(responseObject);
+                }
+                else {
+                    callback.success.apply(callback.scope, [responseObject]);
+                }
+            }
+        }
+        else {
+            switch (httpStatus) {
+                case 12002:
+                case 12029:
+                case 12030:
+                case 12031:
+                case 12152:
+                case 13030:
+                    responseObject = createExceptionObject(o.tId, callback.argument, (isAbort ? isAbort : false), isTimeout);
+                    if (callback.failure) {
+                        if (!callback.scope) {
+                            callback.failure(responseObject);
+                        }
+                        else {
+                            callback.failure.apply(callback.scope, [responseObject]);
+                        }
+                    }
+                    break;
+                default:
+                    responseObject = createResponseObject(o, callback.argument);
+                    if (callback.failure) {
+                        if (!callback.scope) {
+                            callback.failure(responseObject);
+                        }
+                        else {
+                            callback.failure.apply(callback.scope, [responseObject]);
+                        }
+                    }
+            }
+        }
+
+        releaseObject(o);
+        responseObject = null;
+    }
+    
+    function checkResponse(o, callback, conn, tId, poll, cbTimeout){
+        if (conn && conn.readyState == 4) {
+            clearInterval(poll[tId]);
+            poll[tId] = null;
+
+            if (cbTimeout) {
+                clearTimeout(pub.timeout[tId]);
+                pub.timeout[tId] = null;
+            }
+            handleTransactionResponse(o, callback);
+        }
+    }
+    
+    function checkTimeout(o, callback){
+        pub.abort(o, callback, true);
+    }
+    
+
+    // private
+    function handleReadyState(o, callback){
+        callback = callback || {};
+        var conn = o.conn,
+            tId = o.tId,
+            poll = pub.poll,
+            cbTimeout = callback.timeout || null;
+
+        if (cbTimeout) {
+            pub.conn[tId] = conn;
+            pub.timeout[tId] = setTimeout(checkTimeout.createCallback(o, callback), cbTimeout);
+        }
+        poll[tId] = setInterval(checkResponse.createCallback(o, callback, conn, tId, poll, cbTimeout), pub.pollInterval);
+    }
+
+    // private
+    function asyncRequest(method, uri, callback, postData) {
+        var o = getConnectionObject() || null;
+
+        if (o) {
+            o.conn.open(method, uri, true);
+
+            if (pub.useDefaultXhrHeader) {
+                initHeader('X-Requested-With', pub.defaultXhrHeader);
+            }
+
+            if(postData && pub.useDefaultHeader && (!pub.headers || !pub.headers[CONTENTTYPE])){
+                initHeader(CONTENTTYPE, pub.defaultPostHeader);
+            }
+
+            if (pub.defaultHeaders || pub.headers) {
+                setHeader(o);
+            }
+
+            handleReadyState(o, callback);
+            o.conn.send(postData || null);
+        }
+        return o;
+    }
+
+    // private
+    function getConnectionObject() {
+        var o;
+
+        try {
+            if (o = createXhrObject(pub.transactionId)) {
+                pub.transactionId++;
+            }
+        } catch(e) {
+        } finally {
+            return o;
+        }
+    }
+
+    // private
+    function createXhrObject(transactionId) {
+        var http;
+
+        try {
+            http = new XMLHttpRequest();
+        } catch(e) {
+            for (var i = Ext.isIE6 ? 1 : 0; i < activeX.length; ++i) {
+                try {
+                    http = new ActiveXObject(activeX[i]);
+                    break;
+                } catch(e) {}
+            }
+        } finally {
+            return {conn : http, tId : transactionId};
+        }
+    }
+
+    var pub = {
+        request : function(method, uri, cb, data, options) {
+            if(options){
+                var me = this,
+                    xmlData = options.xmlData,
+                    jsonData = options.jsonData,
+                    hs;
+
+                Ext.applyIf(me, options);
+
+                if(xmlData || jsonData){
+                    hs = me.headers;
+                    if(!hs || !hs[CONTENTTYPE]){
+                        initHeader(CONTENTTYPE, xmlData ? 'text/xml' : 'application/json');
+                    }
+                    data = xmlData || (!Ext.isPrimitive(jsonData) ? Ext.encode(jsonData) : jsonData);
+                }
+            }
+            return asyncRequest(method || options.method || "POST", uri, cb, data);
+        },
+
+        serializeForm : function(form) {
+            var fElements = form.elements || (document.forms[form] || Ext.getDom(form)).elements, 
+                hasSubmit = false, 
+                encoder = encodeURIComponent, 
+                name, 
+                data = '', 
+                type, 
+                hasValue;
+    
+            Ext.each(fElements, function(element){
+                name = element.name;
+                type = element.type;
+        
+                if (!element.disabled && name) {
+                    if (/select-(one|multiple)/i.test(type)) {
+                        Ext.each(element.options, function(opt){
+                            if (opt.selected) {
+                                hasValue = opt.hasAttribute ? opt.hasAttribute('value') : opt.getAttributeNode('value').specified;
+                                data += String.format("{0}={1}&", encoder(name), encoder(hasValue ? opt.value : opt.text));
+                            }
+                        });
+                    } else if (!(/file|undefined|reset|button/i.test(type))) {
+                        if (!(/radio|checkbox/i.test(type) && !element.checked) && !(type == 'submit' && hasSubmit)) {
+                            data += encoder(name) + '=' + encoder(element.value) + '&';
+                            hasSubmit = /submit/i.test(type);
+                        }
+                    }
+                }
+            });
+            return data.substr(0, data.length - 1);
+        },
+
+        useDefaultHeader : true,
+        defaultPostHeader : 'application/x-www-form-urlencoded; charset=UTF-8',
+        useDefaultXhrHeader : true,
+        defaultXhrHeader : 'XMLHttpRequest',
+        poll : {},
+        timeout : {},
+        conn: {},
+        pollInterval : 50,
+        transactionId : 0,
+
+//  This is never called - Is it worth exposing this?
+//          setProgId : function(id) {
+//              activeX.unshift(id);
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setDefaultPostHeader : function(b) {
+//              this.useDefaultHeader = b;
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setDefaultXhrHeader : function(b) {
+//              this.useDefaultXhrHeader = b;
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          setPollingInterval : function(i) {
+//              if (typeof i == 'number' && isFinite(i)) {
+//                  this.pollInterval = i;
+//              }
+//          },
+
+//  This is never called - Is it worth exposing this?
+//          resetDefaultHeaders : function() {
+//              this.defaultHeaders = null;
+//          },
+
+        abort : function(o, callback, isTimeout) {
+            var me = this,
+                tId = o.tId,
+                isAbort = false;
+
+            if (me.isCallInProgress(o)) {
+                o.conn.abort();
+                clearInterval(me.poll[tId]);
+                me.poll[tId] = null;
+                clearTimeout(pub.timeout[tId]);
+                me.timeout[tId] = null;
+
+                handleTransactionResponse(o, callback, (isAbort = true), isTimeout);
+            }
+            return isAbort;
+        },
+
+        isCallInProgress : function(o) {
+            // if there is a connection and readyState is not 0 or 4
+            return o.conn && !{0:true,4:true}[o.conn.readyState];
+        }
+    };
+    return pub;
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-region.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-region.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-region.js	(revision 76)
@@ -0,0 +1,81 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+	Ext.lib.Region = function(t, r, b, l) {
+		var me = this;
+        me.top = t;
+        me[1] = t;
+        me.right = r;
+        me.bottom = b;
+        me.left = l;
+        me[0] = l;
+    };
+
+    Ext.lib.Region.prototype = {
+        contains : function(region) {
+	        var me = this;
+            return ( region.left >= me.left &&
+                     region.right <= me.right &&
+                     region.top >= me.top &&
+                     region.bottom <= me.bottom );
+
+        },
+
+        getArea : function() {
+	        var me = this;
+            return ( (me.bottom - me.top) * (me.right - me.left) );
+        },
+
+        intersect : function(region) {
+            var me = this,
+            	t = Math.max(me.top, region.top),
+            	r = Math.min(me.right, region.right),
+            	b = Math.min(me.bottom, region.bottom),
+            	l = Math.max(me.left, region.left);
+
+            if (b >= t && r >= l) {
+                return new Ext.lib.Region(t, r, b, l);
+            }
+        },
+        
+        union : function(region) {
+	        var me = this,
+            	t = Math.min(me.top, region.top),
+            	r = Math.max(me.right, region.right),
+            	b = Math.max(me.bottom, region.bottom),
+            	l = Math.min(me.left, region.left);
+
+            return new Ext.lib.Region(t, r, b, l);
+        },
+
+        constrainTo : function(r) {
+	        var me = this;
+            me.top = me.top.constrain(r.top, r.bottom);
+            me.bottom = me.bottom.constrain(r.top, r.bottom);
+            me.left = me.left.constrain(r.left, r.right);
+            me.right = me.right.constrain(r.left, r.right);
+            return me;
+        },
+
+        adjust : function(t, l, b, r) {
+	        var me = this;
+            me.top += t;
+            me.left += l;
+            me.right += r;
+            me.bottom += b;
+            return me;
+        }
+    };
+
+    Ext.lib.Region.getRegion = function(el) {
+        var p = Ext.lib.Dom.getXY(el),
+        	t = p[1],
+        	r = p[0] + el.offsetWidth,
+        	b = p[1] + el.offsetHeight,
+        	l = p[0];
+
+        return new Ext.lib.Region(t, r, b, l);
+    };
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim.js	(revision 76)
@@ -0,0 +1,475 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+    var EXTLIB = Ext.lib,
+        noNegatives = /width|height|opacity|padding/i,
+        offsetAttribute = /^((width|height)|(top|left))$/,
+        defaultUnit = /width|height|top$|bottom$|left$|right$/i,
+        offsetUnit =  /\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i,
+        isset = function(v){
+            return typeof v !== 'undefined';
+        },
+        now = function(){
+            return new Date();
+        };
+
+    EXTLIB.Anim = {
+        motion : function(el, args, duration, easing, cb, scope) {
+            return this.run(el, args, duration, easing, cb, scope, Ext.lib.Motion);
+        },
+
+        run : function(el, args, duration, easing, cb, scope, type) {
+            type = type || Ext.lib.AnimBase;
+            if (typeof easing == "string") {
+                easing = Ext.lib.Easing[easing];
+            }
+            var anim = new type(el, args, duration, easing);
+            anim.animateX(function() {
+                if(Ext.isFunction(cb)){
+                    cb.call(scope);
+                }
+            });
+            return anim;
+        }
+    };
+
+    EXTLIB.AnimBase = function(el, attributes, duration, method) {
+        if (el) {
+            this.init(el, attributes, duration, method);
+        }
+    };
+
+    EXTLIB.AnimBase.prototype = {
+        doMethod: function(attr, start, end) {
+            var me = this;
+            return me.method(me.curFrame, start, end - start, me.totalFrames);
+        },
+
+
+        setAttr: function(attr, val, unit) {
+            if (noNegatives.test(attr) && val < 0) {
+                val = 0;
+            }
+            Ext.fly(this.el, '_anim').setStyle(attr, val + unit);
+        },
+
+
+        getAttr: function(attr) {
+            var el = Ext.fly(this.el),
+                val = el.getStyle(attr),
+                a = offsetAttribute.exec(attr) || [];
+
+            if (val !== 'auto' && !offsetUnit.test(val)) {
+                return parseFloat(val);
+            }
+
+            return (!!(a[2]) || (el.getStyle('position') == 'absolute' && !!(a[3]))) ? el.dom['offset' + a[0].charAt(0).toUpperCase() + a[0].substr(1)] : 0;
+        },
+
+
+        getDefaultUnit: function(attr) {
+            return defaultUnit.test(attr) ? 'px' : '';
+        },
+
+        animateX : function(callback, scope) {
+            var me = this,
+                f = function() {
+                me.onComplete.removeListener(f);
+                if (Ext.isFunction(callback)) {
+                    callback.call(scope || me, me);
+                }
+            };
+            me.onComplete.addListener(f, me);
+            me.animate();
+        },
+
+
+        setRunAttr: function(attr) {
+            var me = this,
+                a = this.attributes[attr],
+                to = a.to,
+                by = a.by,
+                from = a.from,
+                unit = a.unit,
+                ra = (this.runAttrs[attr] = {}),
+                end;
+
+            if (!isset(to) && !isset(by)){
+                return false;
+            }
+
+            var start = isset(from) ? from : me.getAttr(attr);
+            if (isset(to)) {
+                end = to;
+            }else if(isset(by)) {
+                if (Ext.isArray(start)){
+                    end = [];
+                    for(var i=0,len=start.length; i<len; i++) {
+                        end[i] = start[i] + by[i];
+                    }
+                }else{
+                    end = start + by;
+                }
+            }
+
+            Ext.apply(ra, {
+                start: start,
+                end: end,
+                unit: isset(unit) ? unit : me.getDefaultUnit(attr)
+            });
+        },
+
+
+        init: function(el, attributes, duration, method) {
+            var me = this,
+                actualFrames = 0,
+                mgr = EXTLIB.AnimMgr;
+
+            Ext.apply(me, {
+                isAnimated: false,
+                startTime: null,
+                el: Ext.getDom(el),
+                attributes: attributes || {},
+                duration: duration || 1,
+                method: method || EXTLIB.Easing.easeNone,
+                useSec: true,
+                curFrame: 0,
+                totalFrames: mgr.fps,
+                runAttrs: {},
+                animate: function(){
+                    var me = this,
+                        d = me.duration;
+
+                    if(me.isAnimated){
+                        return false;
+                    }
+
+                    me.curFrame = 0;
+                    me.totalFrames = me.useSec ? Math.ceil(mgr.fps * d) : d;
+                    mgr.registerElement(me);
+                },
+
+                stop: function(finish){
+                    var me = this;
+
+                    if(finish){
+                        me.curFrame = me.totalFrames;
+                        me._onTween.fire();
+                    }
+                    mgr.stop(me);
+                }
+            });
+
+            var onStart = function(){
+                var me = this,
+                    attr;
+
+                me.onStart.fire();
+                me.runAttrs = {};
+                for(attr in this.attributes){
+                    this.setRunAttr(attr);
+                }
+
+                me.isAnimated = true;
+                me.startTime = now();
+                actualFrames = 0;
+            };
+
+
+            var onTween = function(){
+                var me = this;
+
+                me.onTween.fire({
+                    duration: now() - me.startTime,
+                    curFrame: me.curFrame
+                });
+
+                var ra = me.runAttrs;
+                for (var attr in ra) {
+                    this.setAttr(attr, me.doMethod(attr, ra[attr].start, ra[attr].end), ra[attr].unit);
+                }
+
+                ++actualFrames;
+            };
+
+            var onComplete = function() {
+                var me = this,
+                    actual = (now() - me.startTime) / 1000,
+                    data = {
+                        duration: actual,
+                        frames: actualFrames,
+                        fps: actualFrames / actual
+                    };
+
+                me.isAnimated = false;
+                actualFrames = 0;
+                me.onComplete.fire(data);
+            };
+
+            me.onStart = new Ext.util.Event(me);
+            me.onTween = new Ext.util.Event(me);
+            me.onComplete = new Ext.util.Event(me);
+            (me._onStart = new Ext.util.Event(me)).addListener(onStart);
+            (me._onTween = new Ext.util.Event(me)).addListener(onTween);
+            (me._onComplete = new Ext.util.Event(me)).addListener(onComplete);
+        }
+    };
+
+
+    Ext.lib.AnimMgr = new function() {
+        var me = this,
+            thread = null,
+            queue = [],
+            tweenCount = 0;
+
+
+        Ext.apply(me, {
+            fps: 1000,
+            delay: 1,
+            registerElement: function(tween){
+                queue.push(tween);
+                ++tweenCount;
+                tween._onStart.fire();
+                me.start();
+            },
+
+            unRegister: function(tween, index){
+                tween._onComplete.fire();
+                index = index || getIndex(tween);
+                if (index != -1) {
+                    queue.splice(index, 1);
+                }
+
+                if (--tweenCount <= 0) {
+                    me.stop();
+                }
+            },
+
+            start: function(){
+                if(thread === null){
+                    thread = setInterval(me.run, me.delay);
+                }
+            },
+
+            stop: function(tween){
+                if(!tween){
+                    clearInterval(thread);
+                    for(var i = 0, len = queue.length; i < len; ++i){
+                        if(queue[0].isAnimated){
+                            me.unRegister(queue[0], 0);
+                        }
+                    }
+
+                    queue = [];
+                    thread = null;
+                    tweenCount = 0;
+                }else{
+                    me.unRegister(tween);
+                }
+            },
+
+            run: function(){
+                var tf, i, len, tween;
+                for(i = 0, len = queue.length; i<len; i++) {
+                    tween = queue[i];
+                    if(tween && tween.isAnimated){
+                        tf = tween.totalFrames;
+                        if(tween.curFrame < tf || tf === null){
+                            ++tween.curFrame;
+                            if(tween.useSec){
+                                correctFrame(tween);
+                            }
+                            tween._onTween.fire();
+                        }else{
+                            me.stop(tween);
+                        }
+                    }
+                }
+            }
+        });
+
+        var getIndex = function(anim) {
+            var i, len;
+            for(i = 0, len = queue.length; i<len; i++) {
+                if(queue[i] === anim) {
+                    return i;
+                }
+            }
+            return -1;
+        };
+
+        var correctFrame = function(tween) {
+            var frames = tween.totalFrames,
+                frame = tween.curFrame,
+                duration = tween.duration,
+                expected = (frame * duration * 1000 / frames),
+                elapsed = (now() - tween.startTime),
+                tweak = 0;
+
+            if(elapsed < duration * 1000){
+                tweak = Math.round((elapsed / expected - 1) * frame);
+            }else{
+                tweak = frames - (frame + 1);
+            }
+            if(tweak > 0 && isFinite(tweak)){
+                if(tween.curFrame + tweak >= frames){
+                    tweak = frames - (frame + 1);
+                }
+                tween.curFrame += tweak;
+            }
+        };
+    };
+
+    EXTLIB.Bezier = new function() {
+
+        this.getPosition = function(points, t) {
+            var n = points.length,
+                tmp = [],
+                c = 1 - t,
+                i,
+                j;
+
+            for (i = 0; i < n; ++i) {
+                tmp[i] = [points[i][0], points[i][1]];
+            }
+
+            for (j = 1; j < n; ++j) {
+                for (i = 0; i < n - j; ++i) {
+                    tmp[i][0] = c * tmp[i][0] + t * tmp[parseInt(i + 1, 10)][0];
+                    tmp[i][1] = c * tmp[i][1] + t * tmp[parseInt(i + 1, 10)][1];
+                }
+            }
+
+            return [ tmp[0][0], tmp[0][1] ];
+
+        };
+    };
+
+
+    EXTLIB.Easing = {
+        easeNone: function (t, b, c, d) {
+            return c * t / d + b;
+        },
+
+
+        easeIn: function (t, b, c, d) {
+            return c * (t /= d) * t + b;
+        },
+
+
+        easeOut: function (t, b, c, d) {
+            return -c * (t /= d) * (t - 2) + b;
+        }
+    };
+
+    (function() {
+        EXTLIB.Motion = function(el, attributes, duration, method) {
+            if (el) {
+                EXTLIB.Motion.superclass.constructor.call(this, el, attributes, duration, method);
+            }
+        };
+
+        Ext.extend(EXTLIB.Motion, Ext.lib.AnimBase);
+
+        var superclass = EXTLIB.Motion.superclass,
+            pointsRe = /^points$/i;
+
+        Ext.apply(EXTLIB.Motion.prototype, {
+            setAttr: function(attr, val, unit){
+                var me = this,
+                    setAttr = superclass.setAttr;
+
+                if (pointsRe.test(attr)) {
+                    unit = unit || 'px';
+                    setAttr.call(me, 'left', val[0], unit);
+                    setAttr.call(me, 'top', val[1], unit);
+                } else {
+                    setAttr.call(me, attr, val, unit);
+                }
+            },
+
+            getAttr: function(attr){
+                var me = this,
+                    getAttr = superclass.getAttr;
+
+                return pointsRe.test(attr) ? [getAttr.call(me, 'left'), getAttr.call(me, 'top')] : getAttr.call(me, attr);
+            },
+
+            doMethod: function(attr, start, end){
+                var me = this;
+
+                return pointsRe.test(attr)
+                        ? EXTLIB.Bezier.getPosition(me.runAttrs[attr], me.method(me.curFrame, 0, 100, me.totalFrames) / 100)
+                        : superclass.doMethod.call(me, attr, start, end);
+            },
+
+            setRunAttr: function(attr){
+                if(pointsRe.test(attr)){
+
+                    var me = this,
+                        el = this.el,
+                        points = this.attributes.points,
+                        control = points.control || [],
+                        from = points.from,
+                        to = points.to,
+                        by = points.by,
+                        DOM = EXTLIB.Dom,
+                        start,
+                        i,
+                        end,
+                        len,
+                        ra;
+
+
+                    if(control.length > 0 && !Ext.isArray(control[0])){
+                        control = [control];
+                    }else{
+                        /*
+                        var tmp = [];
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            tmp[i] = control[i];
+                        }
+                        control = tmp;
+                        */
+                    }
+
+                    Ext.fly(el, '_anim').position();
+                    DOM.setXY(el, isset(from) ? from : DOM.getXY(el));
+                    start = me.getAttr('points');
+
+
+                    if(isset(to)){
+                        end = translateValues.call(me, to, start);
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            control[i] = translateValues.call(me, control[i], start);
+                        }
+                    } else if (isset(by)) {
+                        end = [start[0] + by[0], start[1] + by[1]];
+
+                        for (i = 0,len = control.length; i < len; ++i) {
+                            control[i] = [ start[0] + control[i][0], start[1] + control[i][1] ];
+                        }
+                    }
+
+                    ra = this.runAttrs[attr] = [start];
+                    if (control.length > 0) {
+                        ra = ra.concat(control);
+                    }
+
+                    ra[ra.length] = end;
+                }else{
+                    superclass.setRunAttr.call(this, attr);
+                }
+            }
+        });
+
+        var translateValues = function(val, start) {
+            var pageXY = EXTLIB.Dom.getXY(this.el);
+            return [val[0] - pageXY[0] + start[0], val[1] - pageXY[1] + start[1]];
+        };
+    })();
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-begin.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-begin.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-begin.js	(revision 76)
@@ -0,0 +1,18 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+	var libFlyweight;
+	
+	function fly(el) {
+        if (!libFlyweight) {
+            libFlyweight = new Ext.Element.Flyweight();
+        }
+        libFlyweight.dom = el;
+        return libFlyweight;
+    }
+    
+    
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim-extra.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim-extra.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-anim-extra.js	(revision 76)
@@ -0,0 +1,305 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// Easing functions
+(function(){
+    // shortcuts to aid compression
+    var abs = Math.abs,
+        pi = Math.PI,
+        asin = Math.asin,
+        pow = Math.pow,
+        sin = Math.sin,
+        EXTLIB = Ext.lib;
+
+    Ext.apply(EXTLIB.Easing, {
+
+        easeBoth: function (t, b, c, d) {
+            return ((t /= d / 2) < 1)  ?  c / 2 * t * t + b  :  -c / 2 * ((--t) * (t - 2) - 1) + b;
+        },
+
+        easeInStrong: function (t, b, c, d) {
+            return c * (t /= d) * t * t * t + b;
+        },
+
+        easeOutStrong: function (t, b, c, d) {
+            return -c * ((t = t / d - 1) * t * t * t - 1) + b;
+        },
+
+        easeBothStrong: function (t, b, c, d) {
+            return ((t /= d / 2) < 1)  ?  c / 2 * t * t * t * t + b  :  -c / 2 * ((t -= 2) * t * t * t - 2) + b;
+        },
+
+        elasticIn: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d) == 1) {
+                return t == 0 ? b : b + c;
+            }
+            p = p || (d * .3);
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return -(a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b;
+
+        },
+
+        elasticOut: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d) == 1) {
+                return t == 0 ? b : b + c;
+            }
+            p = p || (d * .3);
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return a * pow(2, -10 * t) * sin((t * d - s) * (2 * pi) / p) + c + b;
+        },
+
+        elasticBoth: function (t, b, c, d, a, p) {
+            if (t == 0 || (t /= d / 2) == 2) {
+                return t == 0 ? b : b + c;
+            }
+
+            p = p || (d * (.3 * 1.5));
+
+            var s;
+            if (a >= abs(c)) {
+                s = p / (2 * pi) * asin(c / a);
+            } else {
+                a = c;
+                s = p / 4;
+            }
+
+            return t < 1 ?
+                    -.5 * (a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b :
+                    a * pow(2, -10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p) * .5 + c + b;
+        },
+
+        backIn: function (t, b, c, d, s) {
+            s = s ||  1.70158;
+            return c * (t /= d) * t * ((s + 1) * t - s) + b;
+        },
+
+
+        backOut: function (t, b, c, d, s) {
+            if (!s) {
+                s = 1.70158;
+            }
+            return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
+        },
+
+
+        backBoth: function (t, b, c, d, s) {
+            s = s || 1.70158;
+
+            return ((t /= d / 2 ) < 1) ?
+                    c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b :
+                    c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b;
+        },
+
+
+        bounceIn: function (t, b, c, d) {
+            return c - EXTLIB.Easing.bounceOut(d - t, 0, c, d) + b;
+        },
+
+
+        bounceOut: function (t, b, c, d) {
+        if ((t /= d) < (1 / 2.75)) {
+                return c * (7.5625 * t * t) + b;
+            } else if (t < (2 / 2.75)) {
+                return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
+            } else if (t < (2.5 / 2.75)) {
+                return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
+            }
+            return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
+        },
+
+
+        bounceBoth: function (t, b, c, d) {
+            return (t < d / 2) ?
+                    EXTLIB.Easing.bounceIn(t * 2, 0, c, d) * .5 + b :
+                    EXTLIB.Easing.bounceOut(t * 2 - d, 0, c, d) * .5 + c * .5 + b;
+        }
+    });
+})();
+
+(function() {
+    var EXTLIB = Ext.lib;
+    // Color Animation
+    EXTLIB.Anim.color = function(el, args, duration, easing, cb, scope) {
+        return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.ColorAnim);
+    };
+
+    EXTLIB.ColorAnim = function(el, attributes, duration, method) {
+        EXTLIB.ColorAnim.superclass.constructor.call(this, el, attributes, duration, method);
+    };
+
+    Ext.extend(EXTLIB.ColorAnim, EXTLIB.AnimBase);
+
+    var superclass = EXTLIB.ColorAnim.superclass,
+        colorRE = /color$/i,
+        transparentRE = /^transparent|rgba\(0, 0, 0, 0\)$/,
+        rgbRE = /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i,
+        hexRE= /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i,
+        hex3RE = /^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i,
+        isset = function(v){
+            return typeof v !== 'undefined';
+        };
+
+    // private
+    function parseColor(s) {
+        var pi = parseInt,
+            base,
+            out = null,
+            c;
+
+        if (s.length == 3) {
+            return s;
+        }
+
+        Ext.each([hexRE, rgbRE, hex3RE], function(re, idx){
+            base = (idx % 2 == 0) ? 16 : 10;
+            c = re.exec(s);
+            if(c && c.length == 4){
+                out = [pi(c[1], base), pi(c[2], base), pi(c[3], base)];
+                return false;
+            }
+        });
+        return out;
+    }
+
+    Ext.apply(EXTLIB.ColorAnim.prototype, {
+        getAttr : function(attr) {
+            var me = this,
+                el = me.el,
+                val;
+            if(colorRE.test(attr)){
+                while(el && transparentRE.test(val = Ext.fly(el).getStyle(attr))){
+                    el = el.parentNode;
+                    val = "fff";
+                }
+            }else{
+                val = superclass.getAttr.call(me, attr);
+            }
+            return val;
+        },
+
+        doMethod : function(attr, start, end) {
+            var me = this,
+                val,
+                floor = Math.floor,
+                i,
+                len,
+                v;
+
+            if(colorRE.test(attr)){
+                val = [];
+                end = end || [];
+
+                for(i = 0, len = start.length; i < len; i++) {
+                    v = start[i];
+                    val[i] = superclass.doMethod.call(me, attr, v, end[i]);
+                }
+                val = 'rgb(' + floor(val[0]) + ',' + floor(val[1]) + ',' + floor(val[2]) + ')';
+            }else{
+                val = superclass.doMethod.call(me, attr, start, end);
+            }
+            return val;
+        },
+
+        setRunAttr : function(attr) {
+            var me = this,
+                a = me.attributes[attr],
+                to = a.to,
+                by = a.by,
+                ra;
+
+            superclass.setRunAttr.call(me, attr);
+            ra = me.runAttrs[attr];
+            if(colorRE.test(attr)){
+                var start = parseColor(ra.start),
+                    end = parseColor(ra.end);
+
+                if(!isset(to) && isset(by)){
+                    end = parseColor(by);
+                    for(var i=0,len=start.length; i<len; i++) {
+                        end[i] = start[i] + end[i];
+                    }
+                }
+                ra.start = start;
+                ra.end = end;
+            }
+        }
+    });
+})();
+
+
+(function() {
+    // Scroll Animation
+    var EXTLIB = Ext.lib;
+    EXTLIB.Anim.scroll = function(el, args, duration, easing, cb, scope) {
+        return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.Scroll);
+    };
+
+    EXTLIB.Scroll = function(el, attributes, duration, method) {
+        if(el){
+            EXTLIB.Scroll.superclass.constructor.call(this, el, attributes, duration, method);
+        }
+    };
+
+    Ext.extend(EXTLIB.Scroll, EXTLIB.ColorAnim);
+
+    var superclass = EXTLIB.Scroll.superclass,
+        SCROLL = 'scroll';
+
+    Ext.apply(EXTLIB.Scroll.prototype, {
+
+        doMethod : function(attr, start, end) {
+            var val,
+                me = this,
+                curFrame = me.curFrame,
+                totalFrames = me.totalFrames;
+
+            if(attr == SCROLL){
+                val = [me.method(curFrame, start[0], end[0] - start[0], totalFrames),
+                       me.method(curFrame, start[1], end[1] - start[1], totalFrames)];
+            }else{
+                val = superclass.doMethod.call(me, attr, start, end);
+            }
+            return val;
+        },
+
+        getAttr : function(attr) {
+            var me = this;
+
+            if (attr == SCROLL) {
+                return [me.el.scrollLeft, me.el.scrollTop];
+            }else{
+                return superclass.getAttr.call(me, attr);
+            }
+        },
+
+        setAttr : function(attr, val, unit) {
+            var me = this;
+
+            if(attr == SCROLL){
+                me.el.scrollLeft = val[0];
+                me.el.scrollTop = val[1];
+            }else{
+                superclass.setAttr.call(me, attr, val, unit);
+            }
+        }
+    });
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-end.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-end.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-end.js	(revision 76)
@@ -0,0 +1,21 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+	
+	if (Ext.isIE) {
+        function fnCleanUp() {
+            var p = Function.prototype;
+            delete p.createSequence;
+            delete p.defer;
+            delete p.createDelegate;
+            delete p.createCallback;
+            delete p.createInterceptor;
+
+            window.detachEvent("onunload", fnCleanUp);
+        }
+        window.attachEvent("onunload", fnCleanUp);
+    }
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-point.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-point.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/adapter/ext-base-point.js	(revision 76)
@@ -0,0 +1,17 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+	Ext.lib.Point = function(x, y) {
+        if (Ext.isArray(x)) {
+            y = x[1];
+            x = x[0];
+        }
+        var me = this;
+        me.x = me.right = me.left = me[0] = x;
+        me.y = me.top = me.bottom = me[1] = y;
+    };
+
+    Ext.lib.Point.prototype = new Ext.lib.Region();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomQuery.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomQuery.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomQuery.js	(revision 76)
@@ -0,0 +1,932 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * This is code is also distributed under MIT license for use
+ * with jQuery and prototype JavaScript libraries.
+ */
+/**
+ * @class Ext.DomQuery
+Provides high performance selector/xpath processing by compiling queries into reusable functions. New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).
+<p>
+DomQuery supports most of the <a href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#selectors">CSS3 selectors spec</a>, along with some custom selectors and basic XPath.</p>
+
+<p>
+All selectors, attribute filters and pseudos below can be combined infinitely in any order. For example "div.foo:nth-child(odd)[@foo=bar].bar:first" would be a perfectly valid selector. Node filters are processed in the order in which they appear, which allows you to optimize your queries for your document structure.
+</p>
+<h4>Element Selectors:</h4>
+<ul class="list">
+    <li> <b>*</b> any element</li>
+    <li> <b>E</b> an element with the tag E</li>
+    <li> <b>E F</b> All descendent elements of E that have the tag F</li>
+    <li> <b>E > F</b> or <b>E/F</b> all direct children elements of E that have the tag F</li>
+    <li> <b>E + F</b> all elements with the tag F that are immediately preceded by an element with the tag E</li>
+    <li> <b>E ~ F</b> all elements with the tag F that are preceded by a sibling element with the tag E</li>
+</ul>
+<h4>Attribute Selectors:</h4>
+<p>The use of &#64; and quotes are optional. For example, div[&#64;foo='bar'] is also a valid attribute selector.</p>
+<ul class="list">
+    <li> <b>E[foo]</b> has an attribute "foo"</li>
+    <li> <b>E[foo=bar]</b> has an attribute "foo" that equals "bar"</li>
+    <li> <b>E[foo^=bar]</b> has an attribute "foo" that starts with "bar"</li>
+    <li> <b>E[foo$=bar]</b> has an attribute "foo" that ends with "bar"</li>
+    <li> <b>E[foo*=bar]</b> has an attribute "foo" that contains the substring "bar"</li>
+    <li> <b>E[foo%=2]</b> has an attribute "foo" that is evenly divisible by 2</li>
+    <li> <b>E[foo!=bar]</b> attribute "foo" does not equal "bar"</li>
+</ul>
+<h4>Pseudo Classes:</h4>
+<ul class="list">
+    <li> <b>E:first-child</b> E is the first child of its parent</li>
+    <li> <b>E:last-child</b> E is the last child of its parent</li>
+    <li> <b>E:nth-child(<i>n</i>)</b> E is the <i>n</i>th child of its parent (1 based as per the spec)</li>
+    <li> <b>E:nth-child(odd)</b> E is an odd child of its parent</li>
+    <li> <b>E:nth-child(even)</b> E is an even child of its parent</li>
+    <li> <b>E:only-child</b> E is the only child of its parent</li>
+    <li> <b>E:checked</b> E is an element that is has a checked attribute that is true (e.g. a radio or checkbox) </li>
+    <li> <b>E:first</b> the first E in the resultset</li>
+    <li> <b>E:last</b> the last E in the resultset</li>
+    <li> <b>E:nth(<i>n</i>)</b> the <i>n</i>th E in the resultset (1 based)</li>
+    <li> <b>E:odd</b> shortcut for :nth-child(odd)</li>
+    <li> <b>E:even</b> shortcut for :nth-child(even)</li>
+    <li> <b>E:contains(foo)</b> E's innerHTML contains the substring "foo"</li>
+    <li> <b>E:nodeValue(foo)</b> E contains a textNode with a nodeValue that equals "foo"</li>
+    <li> <b>E:not(S)</b> an E element that does not match simple selector S</li>
+    <li> <b>E:has(S)</b> an E element that has a descendent that matches simple selector S</li>
+    <li> <b>E:next(S)</b> an E element whose next sibling matches simple selector S</li>
+    <li> <b>E:prev(S)</b> an E element whose previous sibling matches simple selector S</li>
+    <li> <b>E:any(S1|S2|S2)</b> an E element which matches any of the simple selectors S1, S2 or S3//\\</li>
+</ul>
+<h4>CSS Value Selectors:</h4>
+<ul class="list">
+    <li> <b>E{display=none}</b> css value "display" that equals "none"</li>
+    <li> <b>E{display^=none}</b> css value "display" that starts with "none"</li>
+    <li> <b>E{display$=none}</b> css value "display" that ends with "none"</li>
+    <li> <b>E{display*=none}</b> css value "display" that contains the substring "none"</li>
+    <li> <b>E{display%=2}</b> css value "display" that is evenly divisible by 2</li>
+    <li> <b>E{display!=none}</b> css value "display" that does not equal "none"</li>
+</ul>
+ * @singleton
+ */
+Ext.DomQuery = function(){
+    var cache = {}, 
+    	simpleCache = {}, 
+    	valueCache = {},
+    	nonSpace = /\S/,
+    	trimRe = /^\s+|\s+$/g,
+    	tplRe = /\{(\d+)\}/g,
+    	modeRe = /^(\s?[\/>+~]\s?|\s|$)/,
+    	tagTokenRe = /^(#)?([\w\-\*]+)/,
+    	nthRe = /(\d*)n\+?(\d*)/, 
+    	nthRe2 = /\D/,
+    	// This is for IE MSXML which does not support expandos.
+	// IE runs the same speed using setAttribute, however FF slows way down
+	// and Safari completely fails so they need to continue to use expandos.
+	isIE = window.ActiveXObject ? true : false,
+	key = 30803;
+    
+    // this eval is stop the compressor from
+    // renaming the variable to something shorter
+    eval("var batch = 30803;");    	
+
+    // Retrieve the child node from a particular
+    // parent at the specified index.
+    function child(parent, index){
+        var i = 0,
+            n = parent.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               if(++i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    }
+
+    // retrieve the next element node
+    function next(n){	
+        while((n = n.nextSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // retrieve the previous element node 
+    function prev(n){
+        while((n = n.previousSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // Mark each child node with a nodeIndex skipping and
+    // removing empty text nodes.
+    function children(parent){
+        var n = parent.firstChild,
+	    nodeIndex = -1,
+	    nextNode;
+	while(n){
+	    nextNode = n.nextSibling;
+	    // clean worthless empty nodes.
+	    if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+		parent.removeChild(n);
+	    }else{
+		// add an expando nodeIndex
+		n.nodeIndex = ++nodeIndex;
+	    }
+	    n = nextNode;
+	}
+	return this;
+    }
+
+
+    // nodeSet - array of nodes
+    // cls - CSS Class
+    function byClassName(nodeSet, cls){
+        if(!cls){
+            return nodeSet;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = nodeSet[i]; i++){
+            if((' '+ci.className+' ').indexOf(cls) != -1){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    };
+
+    function attrValue(n, attr){
+	// if its an array, use the first node.
+        if(!n.tagName && typeof n.length != "undefined"){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+
+        if(attr == "for"){
+            return n.htmlFor;
+        }
+        if(attr == "class" || attr == "className"){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+
+    };
+
+
+    // ns - nodes
+    // mode - false, /, >, +, ~
+    // tagName - defaults to "*"
+    function getNodes(ns, mode, tagName){
+        var result = [], ri = -1, cs;
+        if(!ns){
+            return result;
+        }
+        tagName = tagName || "*";
+	// convert to array
+        if(typeof ns.getElementsByTagName != "undefined"){
+            ns = [ns];
+        }
+	
+	// no mode specified, grab all elements by tagName
+	// at any depth
+        if(!mode){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                for(var j = 0, ci; ci = cs[j]; j++){
+                    result[++ri] = ci;
+                }
+            }
+	// Direct Child mode (/ or >)
+	// E > F or E/F all direct children elements of E that have the tag 	
+        } else if(mode == "/" || mode == ">"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, ni, cn; ni = ns[i]; i++){
+                cn = ni.childNodes;
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.nodeName == utag || cj.nodeName == tagName  || tagName == '*'){
+                        result[++ri] = cj;
+                    }
+                }
+            }
+	// Immediately Preceding mode (+)
+	// E + F all elements with the tag F that are immediately preceded by an element with the tag E
+        }else if(mode == "+"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling) && n.nodeType != 1);
+                if(n && (n.nodeName == utag || n.nodeName == tagName || tagName == '*')){
+                    result[++ri] = n;
+                }
+            }
+	// Sibling mode (~)
+	// E ~ F all elements with the tag F that are preceded by a sibling element with the tag E
+        }else if(mode == "~"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling)){
+                    if (n.nodeName == utag || n.nodeName == tagName || tagName == '*'){
+                        result[++ri] = n;
+                    }
+                }
+            }
+        }
+        return result;
+    }
+
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var result = [], ri = -1;
+        tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase() == tagName){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byId(cs, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci && ci.id == id){
+                result[++ri] = ci;
+                return result;
+            }
+        }
+        return result;
+    }
+
+    // operators are =, !=, ^=, $=, *=, %=, |= and ~=
+    // custom can be "{"
+    function byAttribute(cs, attr, value, op, custom){
+        var result = [], 
+            ri = -1, 
+            useGetStyle = custom == "{",	    
+            fn = Ext.DomQuery.operators[op],	    
+            a,
+            xml,
+            hasXml;
+            
+        for(var i = 0, ci; ci = cs[i]; i++){
+	    // skip non-element nodes.
+            if(ci.nodeType != 1){
+                continue;
+            }
+            // only need to do this for the first node
+            if(!hasXml){
+                xml = Ext.DomQuery.isXml(ci);
+                hasXml = true;
+            }
+	    
+            // we only need to change the property names if we're dealing with html nodes, not XML
+            if(!xml){
+                if(useGetStyle){
+                    a = Ext.DomQuery.getStyle(ci, attr);
+                } else if (attr == "class" || attr == "className"){
+                    a = ci.className;
+                } else if (attr == "for"){
+                    a = ci.htmlFor;
+                } else if (attr == "href"){
+		    // getAttribute href bug
+		    // http://www.glennjones.net/Post/809/getAttributehrefbug.htm
+                    a = ci.getAttribute("href", 2);
+                } else{
+                    a = ci.getAttribute(attr);
+                }
+            }else{
+                a = ci.getAttribute(attr);
+            }
+            if((fn && fn(a, value)) || (!fn && a)){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    }
+
+    function nodupIEXml(cs){
+        var d = ++key, 
+            r;
+        cs[0].setAttribute("_nodup", d);
+        r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!c.getAttribute("_nodup") != d){
+                c.setAttribute("_nodup", d);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].removeAttribute("_nodup");
+        }
+        return r;
+    }
+
+    function nodup(cs){
+        if(!cs){
+            return [];
+        }
+        var len = cs.length, c, i, r = cs, cj, ri = -1;
+        if(!len || typeof cs.nodeType != "undefined" || len == 1){
+            return cs;
+        }
+        if(isIE && typeof cs[0].selectSingleNode != "undefined"){
+            return nodupIEXml(cs);
+        }
+        var d = ++key;
+        cs[0]._nodup = d;
+        for(i = 1; c = cs[i]; i++){
+            if(c._nodup != d){
+                c._nodup = d;
+            }else{
+                r = [];
+                for(var j = 0; j < i; j++){
+                    r[++ri] = cs[j];
+                }
+                for(j = i+1; cj = cs[j]; j++){
+                    if(cj._nodup != d){
+                        cj._nodup = d;
+                        r[++ri] = cj;
+                    }
+                }
+                return r;
+            }
+        }
+        return r;
+    }
+
+    function quickDiffIEXml(c1, c2){
+        var d = ++key,
+            r = [];
+        for(var i = 0, len = c1.length; i < len; i++){
+            c1[i].setAttribute("_qdiff", d);
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i].getAttribute("_qdiff") != d){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+           c1[i].removeAttribute("_qdiff");
+        }
+        return r;
+    }
+
+    function quickDiff(c1, c2){
+        var len1 = c1.length,
+        	d = ++key,
+        	r = [];
+        if(!len1){
+            return c2;
+        }
+        if(isIE && typeof c1[0].selectSingleNode != "undefined"){
+            return quickDiffIEXml(c1, c2);
+        }        
+        for(var i = 0; i < len1; i++){
+            c1[i]._qdiff = d;
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i]._qdiff != d){
+                r[r.length] = c2[i];
+            }
+        }
+        return r;
+    }
+
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, "*");
+        return byId(ns, id);
+    }
+
+    return {
+        getStyle : function(el, name){
+            return Ext.fly(el).getStyle(name);
+        },
+        /**
+         * Compiles a selector/xpath query into a reusable function. The returned function
+         * takes one parameter "root" (optional), which is the context node from where the query should start.
+         * @param {String} selector The selector/xpath query
+         * @param {String} type (optional) Either "select" (the default) or "simple" for a simple selector match
+         * @return {Function}
+         */
+        compile : function(path, type){
+            type = type || "select";
+
+    	    // setup fn preamble
+            var fn = ["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],
+        		mode,		
+        		lastPath,
+            	matchers = Ext.DomQuery.matchers,
+            	matchersLn = matchers.length,
+            	modeMatch,
+            	// accept leading mode switch
+            	lmode = path.match(modeRe);
+            
+            if(lmode && lmode[1]){
+                fn[fn.length] = 'mode="'+lmode[1].replace(trimRe, "")+'";';
+                path = path.replace(lmode[1], "");
+            }
+	    
+            // strip leading slashes
+            while(path.substr(0, 1)=="/"){
+                path = path.substr(1);
+            }
+
+            while(path && lastPath != path){
+                lastPath = path;
+                var tokenMatch = path.match(tagTokenRe);
+                if(type == "select"){
+                    if(tokenMatch){
+			// ID Selector
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tokenMatch[2]+'");';			
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }else if(path.substr(0, 1) != '@'){
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+		// type of "simple"
+                }else{
+                    if(tokenMatch){
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = byId(n, "'+tokenMatch[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }
+                }
+                while(!(modeMatch = path.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < matchersLn; j++){
+                        var t = matchers[j];
+                        var m = path.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+				return m[i];
+			    });
+                            path = path.replace(m[0], "");
+                            matched = true;
+                            break;
+                        }
+                    }
+                    // prevent infinite loop on bad selector
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + path + '"';
+                    }
+                }
+                if(modeMatch[1]){
+                    fn[fn.length] = 'mode="'+modeMatch[1].replace(trimRe, "")+'";';
+                    path = path.replace(modeMatch[1], "");
+                }
+            }
+	    // close fn out
+            fn[fn.length] = "return nodup(n);\n}";
+	    
+	    // eval fn and return it
+            eval(fn.join(""));
+            return f;
+        },
+
+        /**
+         * Selects a group of elements.
+         * @param {String} selector The selector/xpath query (can be a comma separated list of selectors)
+         * @param {Node/String} root (optional) The start of the query (defaults to document).
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+	jsSelect: function(path, root, type){
+	    // set root to doc if not specified.
+	    root = root || document;
+	    
+            if(typeof root == "string"){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(","),
+            	results = [];
+		
+	    // loop over each selector
+            for(var i = 0, len = paths.length; i < len; i++){		
+                var subPath = paths[i].replace(trimRe, "");
+		// compile and place in cache
+                if(!cache[subPath]){
+                    cache[subPath] = Ext.DomQuery.compile(subPath);
+                    if(!cache[subPath]){
+                        throw subPath + " is not a valid selector";
+                    }
+                }
+                var result = cache[subPath](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+	    
+	    // if there were multiple selectors, make sure dups
+	    // are eliminated
+            if(paths.length > 1){
+                return nodup(results);
+            }
+            return results;
+        },
+	isXml: function(el) {
+	    var docEl = (el ? el.ownerDocument || el : 0).documentElement;
+	    return docEl ? docEl.nodeName !== "HTML" : false;
+	},
+        select : document.querySelectorAll ? function(path, root, type) {
+	    root = root || document;
+	    if (!Ext.DomQuery.isXml(root)) {
+		try {
+		    var cs = root.querySelectorAll(path);
+		    return Ext.toArray(cs);
+		}
+		catch (ex) {}		
+	    }	    
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	} : function(path, root, type) {
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	},
+
+        /**
+         * Selects a single element.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Element} The DOM element which matched the selector.
+         */
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+
+        /**
+         * Selects the value of a node, optionally replacing null with the defaultValue.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {String} defaultValue
+         * @return {String}
+         */
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, "");
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, "select");
+            }
+            var n = valueCache[path](root), v;
+            n = n[0] ? n[0] : n;
+            	    
+	    // overcome a limitation of maximum textnode size
+	    // Rumored to potentially crash IE6 but has not been confirmed.
+	    // http://reference.sitepoint.com/javascript/Node/normalize
+	    // https://developer.mozilla.org/En/DOM/Node.normalize	    
+            if (typeof n.normalize == 'function') n.normalize();
+            
+            v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return ((v === null||v === undefined||v==='') ? defaultValue : v);
+        },
+
+        /**
+         * Selects the value of a node, parsing integers and floats. Returns the defaultValue, or 0 if none is specified.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {Number} defaultValue
+         * @return {Number}
+         */
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+
+        /**
+         * Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)
+         * @param {String/HTMLElement/Array} el An element id, element or array of elements
+         * @param {String} selector The simple selector to test
+         * @return {Boolean}
+         */
+        is : function(el, ss){
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            var isArray = Ext.isArray(el),
+            	result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+
+        /**
+         * Filters an array of elements to only include matches of a simple selector (e.g. div.some-class or span:first-child)
+         * @param {Array} el An array of elements to filter
+         * @param {String} selector The simple selector to test
+         * @param {Boolean} nonMatches If true, it returns the elements that DON'T match
+         * the selector instead of the ones that match
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, "");
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, "simple");
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+
+        /**
+         * Collection of matching regular expressions and code snippets.
+         * Each capture group within () will be replace the {} in the select
+         * statement as specified by their index.
+         */
+        matchers : [{
+                re: /^\.([\w\-]+)/,
+                select: 'n = byClassName(n, " {1} ");'
+            }, {
+                re: /^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w\-]+)/,
+                select: 'n = byId(n, "{1}");'
+            },{
+                re: /^@([\w\-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *=, %=, |= and ~=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c</i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            "=" : function(a, v){
+                return a == v;
+            },
+            "!=" : function(a, v){
+                return a != v;
+            },
+            "^=" : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            "$=" : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            "*=" : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            "%=" : function(a, v){
+                return (a % v) == 0;
+            },
+            "|=" : function(a, v){
+                return a && (a == v || a.substr(0, v.length+1) == v+'-');
+            },
+            "~=" : function(a, v){
+                return a && (' '+a+' ').indexOf(' '+v+' ') != -1;
+            }
+        },
+
+        /**
+         * <p>Object hash of "pseudo class" filter functions which are used when filtering selections. Each function is passed
+         * two parameters:</p><div class="mdetail-params"><ul>
+         * <li><b>c</b> : Array<div class="sub-desc">An Array of DOM elements to filter.</div></li>
+         * <li><b>v</b> : String<div class="sub-desc">The argument (if any) supplied in the selector.</div></li>
+         * </ul></div>
+         * <p>A filter function returns an Array of DOM elements which conform to the pseudo class.</p>
+         * <p>In addition to the provided pseudo classes listed above such as <code>first-child</code> and <code>nth-child</code>,
+         * developers may add additional, custom psuedo class filters to select elements according to application-specific requirements.</p>
+         * <p>For example, to filter <code>&lt;a></code> elements to only return links to <i>external</i> resources:</p>
+         * <code><pre>
+Ext.DomQuery.pseudos.external = function(c, v){
+    var r = [], ri = -1;
+    for(var i = 0, ci; ci = c[i]; i++){
+//      Include in result set only if it's a link to an external resource
+        if(ci.hostname != location.hostname){
+            r[++ri] = ci;
+        }
+    }
+    return r;
+};</pre></code>
+         * Then external links could be gathered with the following statement:<code><pre>
+var externalLinks = Ext.select("a:external");
+</code></pre>
+         */
+        pseudos : {
+            "first-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.previousSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "last-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.nextSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nth-child" : function(c, a) {
+                var r = [], ri = -1,
+                	m = nthRe.exec(a == "even" && "2n" || a == "odd" && "2n+1" || !nthRe2.test(a) && "n+" + a || a),
+                	f = (m[1] || 1) - 0, l = m[2] - 0;
+                for(var i = 0, n; n = c[i]; i++){
+                    var pn = n.parentNode;
+                    if (batch != pn._batch) {
+                        var j = 0;
+                        for(var cn = pn.firstChild; cn; cn = cn.nextSibling){
+                            if(cn.nodeType == 1){
+                               cn.nodeIndex = ++j;
+                            }
+                        }
+                        pn._batch = batch;
+                    }
+                    if (f == 1) {
+                        if (l == 0 || n.nodeIndex == l){
+                            r[++ri] = n;
+                        }
+                    } else if ((n.nodeIndex + l) % f == 0){
+                        r[++ri] = n;
+                    }
+                }
+
+                return r;
+            },
+
+            "only-child" : function(c){
+                var r = [], ri = -1;;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(!prev(ci) && !next(ci)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "empty" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var cns = ci.childNodes, j = 0, cn, empty = true;
+                    while(cn = cns[j]){
+                        ++j;
+                        if(cn.nodeType == 1 || cn.nodeType == 3){
+                            empty = false;
+                            break;
+                        }
+                    }
+                    if(empty){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "contains" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if((ci.textContent||ci.innerText||'').indexOf(v) != -1){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nodeValue" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.firstChild && ci.firstChild.nodeValue == v){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "checked" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.checked == true){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "not" : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+
+            "any" : function(c, selectors){
+                var ss = selectors.split('|'),
+                	r = [], ri = -1, s;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    for(var j = 0; s = ss[j]; j++){
+                        if(Ext.DomQuery.is(ci, s)){
+                            r[++ri] = ci;
+                            break;
+                        }
+                    }
+                }
+                return r;
+            },
+
+            "odd" : function(c){
+                return this["nth-child"](c, "odd");
+            },
+
+            "even" : function(c){
+                return this["nth-child"](c, "even");
+            },
+
+            "nth" : function(c, a){
+                return c[a-1] || [];
+            },
+
+            "first" : function(c){
+                return c[0] || [];
+            },
+
+            "last" : function(c){
+                return c[c.length-1] || [];
+            },
+
+            "has" : function(c, ss){
+                var s = Ext.DomQuery.select,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "next" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "prev" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.fx.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.fx.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.fx.js	(revision 76)
@@ -0,0 +1,421 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use visibility to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.VISIBILITY = 1;
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use display to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.DISPLAY = 2;
+
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use offsets (x and y positioning offscreen)
+ * to hide element.
+ * @static
+ * @type Number
+ */
+Ext.Element.OFFSETS = 3;
+
+
+Ext.Element.ASCLASS = 4;
+
+/**
+ * Defaults to 'x-hide-nosize'
+ * @static
+ * @type String
+ */
+Ext.Element.visibilityCls = 'x-hide-nosize';
+
+Ext.Element.addMethods(function(){
+    var El = Ext.Element,
+        OPACITY = "opacity",
+        VISIBILITY = "visibility",
+        DISPLAY = "display",
+        HIDDEN = "hidden",
+        OFFSETS = "offsets",
+        ASCLASS = "asclass",
+        NONE = "none",
+        NOSIZE = 'nosize',
+        ORIGINALDISPLAY = 'originalDisplay',
+        VISMODE = 'visibilityMode',
+        ISVISIBLE = 'isVisible',
+        data = El.data,
+        getDisplay = function(dom){
+            var d = data(dom, ORIGINALDISPLAY);
+            if(d === undefined){
+                data(dom, ORIGINALDISPLAY, d = '');
+            }
+            return d;
+        },
+        getVisMode = function(dom){
+            var m = data(dom, VISMODE);
+            if(m === undefined){
+                data(dom, VISMODE, m = 1);
+            }
+            return m;
+        };
+
+    return {
+        /**
+         * The element's default display mode  (defaults to "")
+         * @type String
+         */
+        originalDisplay : "",
+        visibilityMode : 1,
+
+        /**
+         * Sets the element's visibility mode. When setVisible() is called it
+         * will use this to determine whether to set the visibility or the display property.
+         * @param {Number} visMode Ext.Element.VISIBILITY or Ext.Element.DISPLAY
+         * @return {Ext.Element} this
+         */
+        setVisibilityMode : function(visMode){
+            data(this.dom, VISMODE, visMode);
+            return this;
+        },
+
+        /**
+         * Perform custom animation on this element.
+         * <div><ul class="mdetail-params">
+         * <li><u>Animation Properties</u></li>
+         *
+         * <p>The Animation Control Object enables gradual transitions for any member of an
+         * element's style object that takes a numeric value including but not limited to
+         * these properties:</p><div><ul class="mdetail-params">
+         * <li><tt>bottom, top, left, right</tt></li>
+         * <li><tt>height, width</tt></li>
+         * <li><tt>margin, padding</tt></li>
+         * <li><tt>borderWidth</tt></li>
+         * <li><tt>opacity</tt></li>
+         * <li><tt>fontSize</tt></li>
+         * <li><tt>lineHeight</tt></li>
+         * </ul></div>
+         *
+         *
+         * <li><u>Animation Property Attributes</u></li>
+         *
+         * <p>Each Animation Property is a config object with optional properties:</p>
+         * <div><ul class="mdetail-params">
+         * <li><tt>by</tt>*  : relative change - start at current value, change by this value</li>
+         * <li><tt>from</tt> : ignore current value, start from this value</li>
+         * <li><tt>to</tt>*  : start at current value, go to this value</li>
+         * <li><tt>unit</tt> : any allowable unit specification</li>
+         * <p>* do not specify both <tt>to</tt> and <tt>by</tt> for an animation property</p>
+         * </ul></div>
+         *
+         * <li><u>Animation Types</u></li>
+         *
+         * <p>The supported animation types:</p><div><ul class="mdetail-params">
+         * <li><tt>'run'</tt> : Default
+         * <pre><code>
+var el = Ext.get('complexEl');
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'run'      // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'color'</tt>
+         * <p>Animates transition of background, text, or border colors.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        color: { to: '#06e' },
+        backgroundColor: { to: '#e06' }
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'color'    // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         *
+         * <li><tt>'motion'</tt>
+         * <p>Animates the motion of an element to/from specific points using optional bezier
+         * way points during transit.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+        points: {
+            to: [50, 100],  // go to this point
+            control: [      // optional bezier way points
+                [ 600, 800],
+                [-100, 200]
+            ]
+        }
+    },
+    3000,      // animation duration (milliseconds!)
+    null,      // callback
+    'easeOut', // easing method
+    'motion'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'scroll'</tt>
+         * <p>Animate horizontal or vertical scrolling of an overflowing page element.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        scroll: {to: [400, 300]}
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'scroll'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * </ul></div>
+         *
+         * </ul></div>
+         *
+         * @param {Object} args The animation control args
+         * @param {Float} duration (optional) How long the animation lasts in seconds (defaults to <tt>.35</tt>)
+         * @param {Function} onComplete (optional) Function to call when animation completes
+         * @param {String} easing (optional) {@link Ext.Fx#easing} method to use (defaults to <tt>'easeOut'</tt>)
+         * @param {String} animType (optional) <tt>'run'</tt> is the default. Can also be <tt>'color'</tt>,
+         * <tt>'motion'</tt>, or <tt>'scroll'</tt>
+         * @return {Ext.Element} this
+         */
+        animate : function(args, duration, onComplete, easing, animType){
+            this.anim(args, {duration: duration, callback: onComplete, easing: easing}, animType);
+            return this;
+        },
+
+        /*
+         * @private Internal animation call
+         */
+        anim : function(args, opt, animType, defaultDur, defaultEase, cb){
+            animType = animType || 'run';
+            opt = opt || {};
+            var me = this,
+                anim = Ext.lib.Anim[animType](
+                    me.dom,
+                    args,
+                    (opt.duration || defaultDur) || .35,
+                    (opt.easing || defaultEase) || 'easeOut',
+                    function(){
+                        if(cb) cb.call(me);
+                        if(opt.callback) opt.callback.call(opt.scope || me, me, opt);
+                    },
+                    me
+                );
+            opt.anim = anim;
+            return anim;
+        },
+
+        // private legacy anim prep
+        preanim : function(a, i){
+            return !a[i] ? false : (typeof a[i] == 'object' ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]});
+        },
+
+        /**
+         * Checks whether the element is currently visible using both visibility and display properties.
+         * @return {Boolean} True if the element is currently visible, else false
+         */
+        isVisible : function() {
+            var me = this,
+                dom = me.dom,
+                visible = data(dom, ISVISIBLE);
+
+            if(typeof visible == 'boolean'){ //return the cached value if registered
+                return visible;
+            }
+            //Determine the current state based on display states
+            visible = !me.isStyle(VISIBILITY, HIDDEN) &&
+                      !me.isStyle(DISPLAY, NONE) &&
+                      !((getVisMode(dom) == El.ASCLASS) && me.hasClass(me.visibilityCls || El.visibilityCls));
+
+            data(dom, ISVISIBLE, visible);
+            return visible;
+        },
+
+        /**
+         * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use
+         * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.
+         * @param {Boolean} visible Whether the element is visible
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setVisible : function(visible, animate){
+            var me = this, isDisplay, isVisibility, isOffsets, isNosize,
+                dom = me.dom,
+                visMode = getVisMode(dom);
+
+
+            // hideMode string override
+            if (typeof animate == 'string'){
+                switch (animate) {
+                    case DISPLAY:
+                        visMode = El.DISPLAY;
+                        break;
+                    case VISIBILITY:
+                        visMode = El.VISIBILITY;
+                        break;
+                    case OFFSETS:
+                        visMode = El.OFFSETS;
+                        break;
+                    case NOSIZE:
+                    case ASCLASS:
+                        visMode = El.ASCLASS;
+                        break;
+                }
+                me.setVisibilityMode(visMode);
+                animate = false;
+            }
+
+            if (!animate || !me.anim) {
+                if(visMode == El.ASCLASS ){
+
+                    me[visible?'removeClass':'addClass'](me.visibilityCls || El.visibilityCls);
+
+                } else if (visMode == El.DISPLAY){
+
+                    return me.setDisplayed(visible);
+
+                } else if (visMode == El.OFFSETS){
+
+                    if (!visible){
+                        me.hideModeStyles = {
+                            position: me.getStyle('position'),
+                            top: me.getStyle('top'),
+                            left: me.getStyle('left')
+                        };
+                        me.applyStyles({position: 'absolute', top: '-10000px', left: '-10000px'});
+                    } else {
+                        me.applyStyles(me.hideModeStyles || {position: '', top: '', left: ''});
+                        delete me.hideModeStyles;
+                    }
+
+                }else{
+                    me.fixDisplay();
+                    dom.style.visibility = visible ? "visible" : HIDDEN;
+                }
+            }else{
+                // closure for composites
+                if(visible){
+                    me.setOpacity(.01);
+                    me.setVisible(true);
+                }
+                me.anim({opacity: { to: (visible?1:0) }},
+                        me.preanim(arguments, 1),
+                        null,
+                        .35,
+                        'easeIn',
+                        function(){
+                            visible || me.setVisible(false).setOpacity(1);
+                        });
+            }
+            data(dom, ISVISIBLE, visible);  //set logical visibility state
+            return me;
+        },
+
+
+        /**
+         * @private
+         * Determine if the Element has a relevant height and width available based
+         * upon current logical visibility state
+         */
+        hasMetrics  : function(){
+            var dom = this.dom;
+            return this.isVisible() || (getVisMode(dom) == El.VISIBILITY);
+        },
+
+        /**
+         * Toggles the element's visibility or display, depending on visibility mode.
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        toggle : function(animate){
+            var me = this;
+            me.setVisible(!me.isVisible(), me.preanim(arguments, 0));
+            return me;
+        },
+
+        /**
+         * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true.
+         * @param {Mixed} value Boolean value to display the element using its default display, or a string to set the display directly.
+         * @return {Ext.Element} this
+         */
+        setDisplayed : function(value) {
+            if(typeof value == "boolean"){
+               value = value ? getDisplay(this.dom) : NONE;
+            }
+            this.setStyle(DISPLAY, value);
+            return this;
+        },
+
+        // private
+        fixDisplay : function(){
+            var me = this;
+            if(me.isStyle(DISPLAY, NONE)){
+                me.setStyle(VISIBILITY, HIDDEN);
+                me.setStyle(DISPLAY, getDisplay(this.dom)); // first try reverting to default
+                if(me.isStyle(DISPLAY, NONE)){ // if that fails, default to block
+                    me.setStyle(DISPLAY, "block");
+                }
+            }
+        },
+
+        /**
+         * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        hide : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(false, animate);
+                return this;
+            }
+            this.setVisible(false, this.preanim(arguments, 0));
+            return this;
+        },
+
+        /**
+        * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+        * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        show : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(true, animate);
+                return this;
+            }
+            this.setVisible(true, this.preanim(arguments, 0));
+            return this;
+        }
+    };
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.scroll.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.scroll.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.scroll.js	(revision 76)
@@ -0,0 +1,58 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Returns true if this element is scrollable.
+     * @return {Boolean}
+     */
+    isScrollable : function(){
+        var dom = this.dom;
+        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
+    },
+
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value.
+     * @return {Element} this
+     */
+    scrollTo : function(side, value){
+        this.dom["scroll" + (/top/i.test(side) ? "Top" : "Left")] = value;
+        return this;
+    },
+
+    /**
+     * Returns the current scroll position of the element.
+     * @return {Object} An object containing the scroll position in the format {left: (scrollLeft), top: (scrollTop)}
+     */
+    getScroll : function(){
+        var d = this.dom, 
+            doc = document,
+            body = doc.body,
+            docElement = doc.documentElement,
+            l,
+            t,
+            ret;
+
+        if(d == doc || d == body){
+            if(Ext.isIE && Ext.isStrict){
+                l = docElement.scrollLeft; 
+                t = docElement.scrollTop;
+            }else{
+                l = window.pageXOffset;
+                t = window.pageYOffset;
+            }
+            ret = {left: l || (body ? body.scrollLeft : 0), top: t || (body ? body.scrollTop : 0)};
+        }else{
+            ret = {left: d.scrollLeft, top: d.scrollTop};
+        }
+        return ret;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Loader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Loader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Loader.js	(revision 76)
@@ -0,0 +1,96 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Loader
+ * @singleton
+ * Simple class to help load JavaScript files on demand
+ */
+Ext.Loader = Ext.apply({}, {
+    /**
+     * Loads a given set of .js files. Calls the callback function when all files have been loaded
+     * Set preserveOrder to true to ensure non-parallel loading of files if load order is important
+     * @param {Array} fileList Array of all files to load
+     * @param {Function} callback Callback to call after all files have been loaded
+     * @param {Object} scope The scope to call the callback in
+     * @param {Boolean} preserveOrder True to make files load in serial, one after the other (defaults to false)
+     */
+    load: function(fileList, callback, scope, preserveOrder) {
+        var scope       = scope || this,
+            head        = document.getElementsByTagName("head")[0],
+            fragment    = document.createDocumentFragment(),
+            numFiles    = fileList.length,
+            loadedFiles = 0,
+            me          = this;
+        
+        /**
+         * Loads a particular file from the fileList by index. This is used when preserving order
+         */
+        var loadFileIndex = function(index) {
+            head.appendChild(
+                me.buildScriptTag(fileList[index], onFileLoaded)
+            );
+        };
+        
+        /**
+         * Callback function which is called after each file has been loaded. This calls the callback
+         * passed to load once the final file in the fileList has been loaded
+         */
+        var onFileLoaded = function() {
+            loadedFiles ++;
+            
+            //if this was the last file, call the callback, otherwise load the next file
+            if (numFiles == loadedFiles && typeof callback == 'function') {
+                callback.call(scope);
+            } else {
+                if (preserveOrder === true) {
+                    loadFileIndex(loadedFiles);
+                }
+            }
+        };
+        
+        if (preserveOrder === true) {
+            loadFileIndex.call(this, 0);
+        } else {
+            //load each file (most browsers will do this in parallel)
+            Ext.each(fileList, function(file, index) {
+                fragment.appendChild(
+                    this.buildScriptTag(file, onFileLoaded)
+                );  
+            }, this);
+            
+            head.appendChild(fragment);
+        }
+    },
+    
+    /**
+     * @private
+     * Creates and returns a script tag, but does not place it into the document. If a callback function
+     * is passed, this is called when the script has been loaded
+     * @param {String} filename The name of the file to create a script tag for
+     * @param {Function} callback Optional callback, which is called when the script has been loaded
+     * @return {Element} The new script ta
+     */
+    buildScriptTag: function(filename, callback) {
+        var script  = document.createElement('script');
+        script.type = "text/javascript";
+        script.src  = filename;
+        
+        //IE has a different way of handling &lt;script&gt; loads, so we need to check for it here
+        if (script.readyState) {
+            script.onreadystatechange = function() {
+                if (script.readyState == "loaded" || script.readyState == "complete") {
+                    script.onreadystatechange = null;
+                    callback();
+                }
+            };
+        } else {
+            script.onload = callback;
+        }    
+        
+        return script;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.style.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.style.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.style.js	(revision 76)
@@ -0,0 +1,503 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+    // local style camelizing for speed
+    var supports = Ext.supports,
+        propCache = {},
+        camelRe = /(-[a-z])/gi,
+        view = document.defaultView,
+        opacityRe = /alpha\(opacity=(.*)\)/i,
+        trimRe = /^\s+|\s+$/g,
+        EL = Ext.Element,
+        spacesRe = /\s+/,
+        wordsRe = /\w/g,
+        PADDING = "padding",
+        MARGIN = "margin",
+        BORDER = "border",
+        LEFT = "-left",
+        RIGHT = "-right",
+        TOP = "-top",
+        BOTTOM = "-bottom",
+        WIDTH = "-width",
+        MATH = Math,
+        HIDDEN = 'hidden',
+        ISCLIPPED = 'isClipped',
+        OVERFLOW = 'overflow',
+        OVERFLOWX = 'overflow-x',
+        OVERFLOWY = 'overflow-y',
+        ORIGINALCLIP = 'originalClip',
+        // special markup used throughout Ext when box wrapping elements
+        borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
+        paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
+        margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
+        data = Ext.Element.data;
+
+
+    // private
+    function camelFn(m, a) {
+        return a.charAt(1).toUpperCase();
+    }
+
+    function chkCache(prop) {
+        return propCache[prop] || (propCache[prop] = prop == 'float' ? (supports.cssFloat ? 'cssFloat' : 'styleFloat') : prop.replace(camelRe, camelFn));
+    }
+
+    return {
+        // private  ==> used by Fx
+        adjustWidth : function(width) {
+            var me = this;
+            var isNum = (typeof width == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+            }
+            return (isNum && width < 0) ? 0 : width;
+        },
+
+        // private   ==> used by Fx
+        adjustHeight : function(height) {
+            var me = this;
+            var isNum = (typeof height == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+            }
+            return (isNum && height < 0) ? 0 : height;
+        },
+
+
+        /**
+         * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        addClass : function(className){
+            var me = this,
+                i,
+                len,
+                v,
+                cls = [];
+            // Separate case is for speed
+            if (!Ext.isArray(className)) {
+                if (typeof className == 'string' && !this.hasClass(className)) {
+                    me.dom.className += " " + className;
+                }
+            }
+            else {
+                for (i = 0, len = className.length; i < len; i++) {
+                    v = className[i];
+                    if (typeof v == 'string' && (' ' + me.dom.className + ' ').indexOf(' ' + v + ' ') == -1) {
+                        cls.push(v);
+                    }
+                }
+                if (cls.length) {
+                    me.dom.className += " " + cls.join(" ");
+                }
+            }
+            return me;
+        },
+
+        /**
+         * Removes one or more CSS classes from the element.
+         * @param {String/Array} className The CSS class to remove, or an array of classes
+         * @return {Ext.Element} this
+         */
+        removeClass : function(className){
+            var me = this,
+                i,
+                idx,
+                len,
+                cls,
+                elClasses;
+            if (!Ext.isArray(className)){
+                className = [className];
+            }
+            if (me.dom && me.dom.className) {
+                elClasses = me.dom.className.replace(trimRe, '').split(spacesRe);
+                for (i = 0, len = className.length; i < len; i++) {
+                    cls = className[i];
+                    if (typeof cls == 'string') {
+                        cls = cls.replace(trimRe, '');
+                        idx = elClasses.indexOf(cls);
+                        if (idx != -1) {
+                            elClasses.splice(idx, 1);
+                        }
+                    }
+                }
+                me.dom.className = elClasses.join(" ");
+            }
+            return me;
+        },
+
+        /**
+         * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        radioClass : function(className){
+            var cn = this.dom.parentNode.childNodes,
+                v,
+                i,
+                len;
+            className = Ext.isArray(className) ? className : [className];
+            for (i = 0, len = cn.length; i < len; i++) {
+                v = cn[i];
+                if (v && v.nodeType == 1) {
+                    Ext.fly(v, '_internal').removeClass(className);
+                }
+            };
+            return this.addClass(className);
+        },
+
+        /**
+         * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).
+         * @param {String} className The CSS class to toggle
+         * @return {Ext.Element} this
+         */
+        toggleClass : function(className){
+            return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);
+        },
+
+        /**
+         * Checks if the specified CSS class exists on this element's DOM node.
+         * @param {String} className The CSS class to check for
+         * @return {Boolean} True if the class exists, else false
+         */
+        hasClass : function(className){
+            return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;
+        },
+
+        /**
+         * Replaces a CSS class on the element with another.  If the old name does not exist, the new name will simply be added.
+         * @param {String} oldClassName The CSS class to replace
+         * @param {String} newClassName The replacement CSS class
+         * @return {Ext.Element} this
+         */
+        replaceClass : function(oldClassName, newClassName){
+            return this.removeClass(oldClassName).addClass(newClassName);
+        },
+
+        isStyle : function(style, val) {
+            return this.getStyle(style) == val;
+        },
+
+        /**
+         * Normalizes currentStyle and computedStyle.
+         * @param {String} property The style property whose value is returned.
+         * @return {String} The current value of the style property for this element.
+         */
+        getStyle : function(){
+            return view && view.getComputedStyle ?
+                function(prop){
+                    var el = this.dom,
+                        v,
+                        cs,
+                        out,
+                        display;
+
+                    if(el == document){
+                        return null;
+                    }
+                    prop = chkCache(prop);
+                    out = (v = el.style[prop]) ? v :
+                           (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;
+                           
+                    // Ignore cases when the margin is correctly reported as 0, the bug only shows
+                    // numbers larger.
+                    if(prop == 'marginRight' && out != '0px' && !supports.correctRightMargin){
+                        display = el.style.display;
+                        el.style.display = 'inline-block';
+                        out = view.getComputedStyle(el, '').marginRight;
+                        el.style.display = display;
+                    }
+                    
+                    if(prop == 'backgroundColor' && out == 'rgba(0, 0, 0, 0)' && !supports.correctTransparentColor){
+                        out = 'transparent';
+                    }
+                    return out;
+                } :
+                function(prop){
+                    var el = this.dom,
+                        m,
+                        cs;
+
+                    if(el == document) return null;
+                    if (prop == 'opacity') {
+                        if (el.style.filter.match) {
+                            if(m = el.style.filter.match(opacityRe)){
+                                var fv = parseFloat(m[1]);
+                                if(!isNaN(fv)){
+                                    return fv ? fv / 100 : 0;
+                                }
+                            }
+                        }
+                        return 1;
+                    }
+                    prop = chkCache(prop);
+                    return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);
+                };
+        }(),
+
+        /**
+         * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
+         * are convert to standard 6 digit hex color.
+         * @param {String} attr The css attribute
+         * @param {String} defaultValue The default value to use when a valid color isn't found
+         * @param {String} prefix (optional) defaults to #. Use an empty string when working with
+         * color anims.
+         */
+        getColor : function(attr, defaultValue, prefix){
+            var v = this.getStyle(attr),
+                color = (typeof prefix != 'undefined') ? prefix : '#',
+                h;
+
+            if(!v || (/transparent|inherit/.test(v))) {
+                return defaultValue;
+            }
+            if(/^r/.test(v)){
+                Ext.each(v.slice(4, v.length -1).split(','), function(s){
+                    h = parseInt(s, 10);
+                    color += (h < 16 ? '0' : '') + h.toString(16);
+                });
+            }else{
+                v = v.replace('#', '');
+                color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;
+            }
+            return(color.length > 5 ? color.toLowerCase() : defaultValue);
+        },
+
+        /**
+         * Wrapper for setting style properties, also takes single object parameter of multiple styles.
+         * @param {String/Object} property The style property to be set, or an object of multiple styles.
+         * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.
+         * @return {Ext.Element} this
+         */
+        setStyle : function(prop, value){
+            var tmp, style;
+            
+            if (typeof prop != 'object') {
+                tmp = {};
+                tmp[prop] = value;
+                prop = tmp;
+            }
+            for (style in prop) {
+                value = prop[style];
+                style == 'opacity' ?
+                    this.setOpacity(value) :
+                    this.dom.style[chkCache(style)] = value;
+            }
+            return this;
+        },
+
+        /**
+         * Set the opacity of the element
+         * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
+         * @param {Boolean/Object} animate (optional) a standard Element animation config object or <tt>true</tt> for
+         * the default animation (<tt>{duration: .35, easing: 'easeIn'}</tt>)
+         * @return {Ext.Element} this
+         */
+         setOpacity : function(opacity, animate){
+            var me = this,
+                s = me.dom.style;
+
+            if(!animate || !me.anim){
+                if(Ext.isIE){
+                    var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '',
+                    val = s.filter.replace(opacityRe, '').replace(trimRe, '');
+
+                    s.zoom = 1;
+                    s.filter = val + (val.length > 0 ? ' ' : '') + opac;
+                }else{
+                    s.opacity = opacity;
+                }
+            }else{
+                me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');
+            }
+            return me;
+        },
+
+        /**
+         * Clears any opacity settings from this element. Required in some cases for IE.
+         * @return {Ext.Element} this
+         */
+        clearOpacity : function(){
+            var style = this.dom.style;
+            if(Ext.isIE){
+                if(!Ext.isEmpty(style.filter)){
+                    style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');
+                }
+            }else{
+                style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';
+            }
+            return this;
+        },
+
+        /**
+         * Returns the offset height of the element
+         * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
+         * @return {Number} The element's height
+         */
+        getHeight : function(contentHeight){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0;
+
+            h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");
+            return h < 0 ? 0 : h;
+        },
+
+        /**
+         * Returns the offset width of the element
+         * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
+         * @return {Number} The element's width
+         */
+        getWidth : function(contentWidth){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                w = MATH.max(dom.offsetWidth, hidden ? 0 : dom.clientWidth) || 0;
+            w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");
+            return w < 0 ? 0 : w;
+        },
+
+        /**
+         * Set the width of this Element.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setWidth : function(width, animate){
+            var me = this;
+            width = me.adjustWidth(width);
+            !animate || !me.anim ?
+                me.dom.style.width = me.addUnits(width) :
+                me.anim({width : {to : width}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Set the height of this Element.
+         * <pre><code>
+// change the height to 200px and animate with default configuration
+Ext.fly('elementId').setHeight(200, true);
+
+// change the height to 150px and animate with a custom configuration
+Ext.fly('elId').setHeight(150, {
+    duration : .5, // animation will have a duration of .5 seconds
+    // will change the content to "finished"
+    callback: function(){ this.{@link #update}("finished"); }
+});
+         * </code></pre>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels.)</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+         setHeight : function(height, animate){
+            var me = this;
+            height = me.adjustHeight(height);
+            !animate || !me.anim ?
+                me.dom.style.height = me.addUnits(height) :
+                me.anim({height : {to : height}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Gets the width of the border(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the border <b><u>l</u></b>eft width + the border <b><u>r</u></b>ight width.
+         * @return {Number} The width of the sides passed added together
+         */
+        getBorderWidth : function(side){
+            return this.addStyles(side, borders);
+        },
+
+        /**
+         * Gets the width of the padding(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the padding <b><u>l</u></b>eft + the padding <b><u>r</u></b>ight.
+         * @return {Number} The padding of the sides passed added together
+         */
+        getPadding : function(side){
+            return this.addStyles(side, paddings);
+        },
+
+        /**
+         *  Store the current overflow setting and clip overflow on the element - use <tt>{@link #unclip}</tt> to remove
+         * @return {Ext.Element} this
+         */
+        clip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(!data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, true);
+                data(dom, ORIGINALCLIP, {
+                    o: me.getStyle(OVERFLOW),
+                    x: me.getStyle(OVERFLOWX),
+                    y: me.getStyle(OVERFLOWY)
+                });
+                me.setStyle(OVERFLOW, HIDDEN);
+                me.setStyle(OVERFLOWX, HIDDEN);
+                me.setStyle(OVERFLOWY, HIDDEN);
+            }
+            return me;
+        },
+
+        /**
+         *  Return clipping (overflow) to original clipping before <tt>{@link #clip}</tt> was called
+         * @return {Ext.Element} this
+         */
+        unclip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, false);
+                var o = data(dom, ORIGINALCLIP);
+                if(o.o){
+                    me.setStyle(OVERFLOW, o.o);
+                }
+                if(o.x){
+                    me.setStyle(OVERFLOWX, o.x);
+                }
+                if(o.y){
+                    me.setStyle(OVERFLOWY, o.y);
+                }
+            }
+            return me;
+        },
+
+        // private
+        addStyles : function(sides, styles){
+            var ttlSize = 0,
+                sidesArr = sides.match(wordsRe),
+                side,
+                size,
+                i,
+                len = sidesArr.length;
+            for (i = 0; i < len; i++) {
+                side = sidesArr[i];
+                size = side && parseInt(this.getStyle(styles[side]), 10);
+                if (size) {
+                    ttlSize += MATH.abs(size);
+                }
+            }
+            return ttlSize;
+        },
+
+        margins : margins
+    };
+}()
+);
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.js	(revision 76)
@@ -0,0 +1,1029 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ * <p>Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.</p>
+ * <p>All instances of this class inherit the methods of {@link Ext.Fx} making visual effects easily available to all DOM elements.</p>
+ * <p>Note that the events documented in this class are not Ext events, they encapsulate browser events. To
+ * access the underlying browser event, see {@link Ext.EventObject#browserEvent}. Some older
+ * browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.</p>
+ * Usage:<br>
+<pre><code>
+// by id
+var el = Ext.get("my-div");
+
+// by DOM element reference
+var el = Ext.get(myDivElement);
+</code></pre>
+ * <b>Animations</b><br />
+ * <p>When an element is manipulated, by default there is no animation.</p>
+ * <pre><code>
+var el = Ext.get("my-div");
+
+// no animation
+el.setWidth(100);
+ * </code></pre>
+ * <p>Many of the functions for manipulating an element have an optional "animate" parameter.  This
+ * parameter can be specified as boolean (<tt>true</tt>) for default animation effects.</p>
+ * <pre><code>
+// default animation
+el.setWidth(100, true);
+ * </code></pre>
+ *
+ * <p>To configure the effects, an object literal with animation options to use as the Element animation
+ * configuration object can also be specified. Note that the supported Element animation configuration
+ * options are a subset of the {@link Ext.Fx} animation options specific to Fx effects.  The supported
+ * Element animation configuration options are:</p>
+<pre>
+Option    Default   Description
+--------- --------  ---------------------------------------------
+{@link Ext.Fx#duration duration}  .35       The duration of the animation in seconds
+{@link Ext.Fx#easing easing}    easeOut   The easing method
+{@link Ext.Fx#callback callback}  none      A function to execute when the anim completes
+{@link Ext.Fx#scope scope}     this      The scope (this) of the callback function
+</pre>
+ *
+ * <pre><code>
+// Element animation options object
+var opt = {
+    {@link Ext.Fx#duration duration}: 1,
+    {@link Ext.Fx#easing easing}: 'elasticIn',
+    {@link Ext.Fx#callback callback}: this.foo,
+    {@link Ext.Fx#scope scope}: this
+};
+// animation with some options set
+el.setWidth(100, opt);
+ * </code></pre>
+ * <p>The Element animation object being used for the animation will be set on the options
+ * object as "anim", which allows you to stop or manipulate the animation. Here is an example:</p>
+ * <pre><code>
+// using the "anim" property to get the Anim object
+if(opt.anim.isAnimated()){
+    opt.anim.stop();
+}
+ * </code></pre>
+ * <p>Also see the <tt>{@link #animate}</tt> method for another animation technique.</p>
+ * <p><b> Composite (Collections of) Elements</b></p>
+ * <p>For working with collections of Elements, see {@link Ext.CompositeElement}</p>
+ * @constructor Create a new Element directly.
+ * @param {String/HTMLElement} element
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
+ */
+(function(){
+var DOC = document;
+
+Ext.Element = function(element, forceNew){
+    var dom = typeof element == "string" ?
+              DOC.getElementById(element) : element,
+        id;
+
+    if(!dom) return null;
+
+    id = dom.id;
+
+    if(!forceNew && id && Ext.elCache[id]){ // element object already exists
+        return Ext.elCache[id].el;
+    }
+
+    /**
+     * The DOM element
+     * @type HTMLElement
+     */
+    this.dom = dom;
+
+    /**
+     * The DOM element ID
+     * @type String
+     */
+    this.id = id || Ext.id(dom);
+};
+
+var DH = Ext.DomHelper,
+    El = Ext.Element,
+    EC = Ext.elCache;
+
+El.prototype = {
+    /**
+     * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
+     * @param {Object} o The object with the attributes
+     * @param {Boolean} useSet (optional) false to override the default setAttribute to use expandos.
+     * @return {Ext.Element} this
+     */
+    set : function(o, useSet){
+        var el = this.dom,
+            attr,
+            val,
+            useSet = (useSet !== false) && !!el.setAttribute;
+
+        for (attr in o) {
+            if (o.hasOwnProperty(attr)) {
+                val = o[attr];
+                if (attr == 'style') {
+                    DH.applyStyles(el, val);
+                } else if (attr == 'cls') {
+                    el.className = val;
+                } else if (useSet) {
+                    el.setAttribute(attr, val);
+                } else {
+                    el[attr] = val;
+                }
+            }
+        }
+        return this;
+    },
+
+//  Mouse events
+    /**
+     * @event click
+     * Fires when a mouse click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event contextmenu
+     * Fires when a right click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event dblclick
+     * Fires when a mouse double click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousedown
+     * Fires when a mousedown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseup
+     * Fires when a mouseup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseover
+     * Fires when a mouseover is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousemove
+     * Fires when a mousemove is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseout
+     * Fires when a mouseout is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseenter
+     * Fires when the mouse enters the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseleave
+     * Fires when the mouse leaves the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Keyboard events
+    /**
+     * @event keypress
+     * Fires when a keypress is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keydown
+     * Fires when a keydown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keyup
+     * Fires when a keyup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+
+//  HTML frame/object events
+    /**
+     * @event load
+     * Fires when the user agent finishes loading all content within the element. Only supported by window, frames, objects and images.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event unload
+     * Fires when the user agent removes all content from a window or frame. For elements, it fires when the target element or any of its content has been removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event abort
+     * Fires when an object/image is stopped from loading before completely loaded.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event error
+     * Fires when an object/image/frame cannot be loaded properly.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event resize
+     * Fires when a document view is resized.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event scroll
+     * Fires when a document view is scrolled.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Form events
+    /**
+     * @event select
+     * Fires when a user selects some text in a text field, including input and textarea.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event change
+     * Fires when a control loses the input focus and its value has been modified since gaining focus.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event submit
+     * Fires when a form is submitted.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event reset
+     * Fires when a form is reset.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event focus
+     * Fires when an element receives focus either via the pointing device or by tab navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event blur
+     * Fires when an element loses focus either via the pointing device or by tabbing navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  User Interface events
+    /**
+     * @event DOMFocusIn
+     * Where supported. Similar to HTML focus event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMFocusOut
+     * Where supported. Similar to HTML blur event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMActivate
+     * Where supported. Fires when an element is activated, for instance, through a mouse click or a keypress.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  DOM Mutation events
+    /**
+     * @event DOMSubtreeModified
+     * Where supported. Fires when the subtree is modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInserted
+     * Where supported. Fires when a node has been added as a child of another node.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemoved
+     * Where supported. Fires when a descendant node of the element is removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemovedFromDocument
+     * Where supported. Fires when a node is being removed from a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInsertedIntoDocument
+     * Where supported. Fires when a node is being inserted into a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMAttrModified
+     * Where supported. Fires when an attribute has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMCharacterDataModified
+     * Where supported. Fires when the character data has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+    /**
+     * The default unit to append to CSS values where a unit isn't provided (defaults to px).
+     * @type String
+     */
+    defaultUnit : "px",
+
+    /**
+     * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)
+     * @param {String} selector The simple selector to test
+     * @return {Boolean} True if this element matches the selector, else false
+     */
+    is : function(simpleSelector){
+        return Ext.DomQuery.is(this.dom, simpleSelector);
+    },
+
+    /**
+     * Tries to focus the element. Any exceptions are caught and ignored.
+     * @param {Number} defer (optional) Milliseconds to defer the focus
+     * @return {Ext.Element} this
+     */
+    focus : function(defer, /* private */ dom) {
+        var me = this,
+            dom = dom || me.dom;
+        try{
+            if(Number(defer)){
+                me.focus.defer(defer, null, [null, dom]);
+            }else{
+                dom.focus();
+            }
+        }catch(e){}
+        return me;
+    },
+
+    /**
+     * Tries to blur the element. Any exceptions are caught and ignored.
+     * @return {Ext.Element} this
+     */
+    blur : function() {
+        try{
+            this.dom.blur();
+        }catch(e){}
+        return this;
+    },
+
+    /**
+     * Returns the value of the "value" attribute
+     * @param {Boolean} asNumber true to parse the value as a number
+     * @return {String/Number}
+     */
+    getValue : function(asNumber){
+        var val = this.dom.value;
+        return asNumber ? parseInt(val, 10) : val;
+    },
+
+    /**
+     * Appends an event handler to this element.  The shorthand version {@link #on} is equivalent.
+     * @param {String} eventName The name of event to handle.
+     * @param {Function} fn The handler function the event invokes. This function is passed
+     * the following parameters:<ul>
+     * <li><b>evt</b> : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+     * <li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.
+     * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+     * <li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b>.
+     * @param {Object} options (optional) An object containing handler configuration properties.
+     * This may contain any of the following properties:<ul>
+     * <li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b></div></li>
+     * <li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>
+     * <li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+     * <li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>
+     * <li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>
+     * <li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+     * <li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+     * <li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * In the following examples, the shorthand form {@link #on} is used rather than the more verbose
+     * addListener.  The two are equivalent.  Using the options argument, it is possible to combine different
+     * types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the
+     * options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">
+     * Code:<pre><code>
+el.on('click', this.onClick, this, {
+    single: true,
+    delay: 100,
+    stopEvent : true,
+    forumId: 4
+});</code></pre></p>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.</p>
+     * <p>
+     * Code:<pre><code>
+el.on({
+    'click' : {
+        fn: this.onClick,
+        scope: this,
+        delay: 100
+    },
+    'mouseover' : {
+        fn: this.onMouseOver,
+        scope: this
+    },
+    'mouseout' : {
+        fn: this.onMouseOut,
+        scope: this
+    }
+});</code></pre>
+     * <p>
+     * Or a shorthand syntax:<br>
+     * Code:<pre><code></p>
+el.on({
+    'click' : this.onClick,
+    'mouseover' : this.onMouseOver,
+    'mouseout' : this.onMouseOut,
+    scope: this
+});
+     * </code></pre></p>
+     * <p><b>delegate</b></p>
+     * <p>This is a configuration option that you can pass along when registering a handler for
+     * an event to assist with event delegation. Event delegation is a technique that is used to
+     * reduce memory consumption and prevent exposure to memory-leaks. By registering an event
+     * for a container element as opposed to each element within a container. By setting this
+     * configuration option to a simple selector, the target element will be filtered to look for
+     * a descendant of the target.
+     * For example:<pre><code>
+// using this markup:
+&lt;div id='elId'>
+    &lt;p id='p1'>paragraph one&lt;/p>
+    &lt;p id='p2' class='clickable'>paragraph two&lt;/p>
+    &lt;p id='p3'>paragraph three&lt;/p>
+&lt;/div>
+// utilize event delegation to registering just one handler on the container element:
+el = Ext.get('elId');
+el.on(
+    'click',
+    function(e,t) {
+        // handle click
+        console.info(t.id); // 'p2'
+    },
+    this,
+    {
+        // filter the target element to be a descendant with the class 'clickable'
+        delegate: '.clickable'
+    }
+);
+     * </code></pre></p>
+     * @return {Ext.Element} this
+     */
+    addListener : function(eventName, fn, scope, options){
+        Ext.EventManager.on(this.dom,  eventName, fn, scope || this, options);
+        return this;
+    },
+
+    /**
+     * Removes an event handler from this element.  The shorthand version {@link #un} is equivalent.
+     * <b>Note</b>: if a <i>scope</i> was explicitly specified when {@link #addListener adding} the
+     * listener, the same scope must be specified here.
+     * Example:
+     * <pre><code>
+el.removeListener('click', this.handlerFn);
+// or
+el.un('click', this.handlerFn);
+</code></pre>
+     * @param {String} eventName The name of the event from which to remove the handler.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @return {Ext.Element} this
+     */
+    removeListener : function(eventName, fn, scope){
+        Ext.EventManager.removeListener(this.dom,  eventName, fn, scope || this);
+        return this;
+    },
+
+    /**
+     * Removes all previous added listeners from this element
+     * @return {Ext.Element} this
+     */
+    removeAllListeners : function(){
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Recursively removes all previous added listeners from this element and its children
+     * @return {Ext.Element} this
+     */
+    purgeAllListeners : function() {
+        Ext.EventManager.purgeElement(this, true);
+        return this;
+    },
+    /**
+     * @private Test if size has a unit, otherwise appends the default
+     */
+    addUnits : function(size){
+        if(size === "" || size == "auto" || size === undefined){
+            size = size || '';
+        } else if(!isNaN(size) || !unitPattern.test(size)){
+            size = size + (this.defaultUnit || 'px');
+        }
+        return size;
+    },
+
+    /**
+     * <p>Updates the <a href="http://developer.mozilla.org/en/DOM/element.innerHTML">innerHTML</a> of this Element
+     * from a specified URL. Note that this is subject to the <a href="http://en.wikipedia.org/wiki/Same_origin_policy">Same Origin Policy</a></p>
+     * <p>Updating innerHTML of an element will <b>not</b> execute embedded <tt>&lt;script></tt> elements. This is a browser restriction.</p>
+     * @param {Mixed} options. Either a sring containing the URL from which to load the HTML, or an {@link Ext.Ajax#request} options object specifying
+     * exactly how to request the HTML.
+     * @return {Ext.Element} this
+     */
+    load : function(url, params, cb){
+        Ext.Ajax.request(Ext.apply({
+            params: params,
+            url: url.url || url,
+            callback: cb,
+            el: this.dom,
+            indicatorText: url.indicatorText || ''
+        }, Ext.isObject(url) ? url : {}));
+        return this;
+    },
+
+    /**
+     * Tests various css rules/browsers to determine if this element uses a border box
+     * @return {Boolean}
+     */
+    isBorderBox : function(){
+        return Ext.isBorderBox || Ext.isForcedBorderBox || noBoxAdjust[(this.dom.tagName || "").toLowerCase()];
+    },
+
+    /**
+     * <p>Removes this element's dom reference.  Note that event and cache removal is handled at {@link Ext#removeNode}</p>
+     */
+    remove : function(){
+        var me = this,
+            dom = me.dom;
+
+        if (dom) {
+            delete me.dom;
+            Ext.removeNode(dom);
+        }
+    },
+
+    /**
+     * Sets up event handlers to call the passed functions when the mouse is moved into and out of the Element.
+     * @param {Function} overFn The function to call when the mouse enters the Element.
+     * @param {Function} outFn The function to call when the mouse leaves the Element.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the functions are executed. Defaults to the Element's DOM element.
+     * @param {Object} options (optional) Options for the listener. See {@link Ext.util.Observable#addListener the <tt>options</tt> parameter}.
+     * @return {Ext.Element} this
+     */
+    hover : function(overFn, outFn, scope, options){
+        var me = this;
+        me.on('mouseenter', overFn, scope || me.dom, options);
+        me.on('mouseleave', outFn, scope || me.dom, options);
+        return me;
+    },
+
+    /**
+     * Returns true if this element is an ancestor of the passed element
+     * @param {HTMLElement/String} el The element to check
+     * @return {Boolean} True if this element is an ancestor of el, else false
+     */
+    contains : function(el){
+        return !el ? false : Ext.lib.Dom.isAncestor(this.dom, el.dom ? el.dom : el);
+    },
+
+    /**
+     * Returns the value of a namespaced attribute from the element's underlying DOM node.
+     * @param {String} namespace The namespace in which to look for the attribute
+     * @param {String} name The attribute name
+     * @return {String} The attribute value
+     * @deprecated
+     */
+    getAttributeNS : function(ns, name){
+        return this.getAttribute(name, ns);
+    },
+
+    /**
+     * Returns the value of an attribute from the element's underlying DOM node.
+     * @param {String} name The attribute name
+     * @param {String} namespace (optional) The namespace in which to look for the attribute
+     * @return {String} The attribute value
+     */
+    getAttribute: (function(){
+        var test = document.createElement('table'),
+            isBrokenOnTable = false,
+            hasGetAttribute = 'getAttribute' in test,
+            unknownRe = /undefined|unknown/;
+            
+        if (hasGetAttribute) {
+            
+            try {
+                test.getAttribute('ext:qtip');
+            } catch (e) {
+                isBrokenOnTable = true;
+            }
+            
+            return function(name, ns) {
+                var el = this.dom,
+                    value;
+                
+                if (el.getAttributeNS) {
+                    value  = el.getAttributeNS(ns, name) || null;
+                }
+            
+                if (value == null) {
+                    if (ns) {
+                        if (isBrokenOnTable && el.tagName.toUpperCase() == 'TABLE') {
+                            try {
+                                value = el.getAttribute(ns + ':' + name);
+                            } catch (e) {
+                                value = '';
+                            }
+                        } else {
+                            value = el.getAttribute(ns + ':' + name);
+                        }
+                    } else {
+                        value = el.getAttribute(name) || el[name];
+                    }
+                }
+                return value || '';
+            };
+        } else {
+            return function(name, ns) {
+                var el = this.om,
+                    value,
+                    attribute;
+                
+                if (ns) {
+                    attribute = el[ns + ':' + name];
+                    value = unknownRe.test(typeof attribute) ? undefined : attribute;
+                } else {
+                    value = el[name];
+                }
+                return value || '';
+            };
+        }
+        test = null;
+    })(),
+        
+    /**
+    * Update the innerHTML of this element
+    * @param {String} html The new HTML
+    * @return {Ext.Element} this
+     */
+    update : function(html) {
+        if (this.dom) {
+            this.dom.innerHTML = html;
+        }
+        return this;
+    }
+};
+
+var ep = El.prototype;
+
+El.addMethods = function(o){
+   Ext.apply(ep, o);
+};
+
+/**
+ * Appends an event handler (shorthand for {@link #addListener}).
+ * @param {String} eventName The name of event to handle.
+ * @param {Function} fn The handler function the event invokes.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+ * @param {Object} options (optional) An object containing standard {@link #addListener} options
+ * @member Ext.Element
+ * @method on
+ */
+ep.on = ep.addListener;
+
+/**
+ * Removes an event handler from this element (see {@link #removeListener} for additional notes).
+ * @param {String} eventName The name of the event from which to remove the handler.
+ * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+ * then this must refer to the same object.
+ * @return {Ext.Element} this
+ * @member Ext.Element
+ * @method un
+ */
+ep.un = ep.removeListener;
+
+/**
+ * true to automatically adjust width and height settings for box-model issues (default to true)
+ */
+ep.autoBoxAdjust = true;
+
+// private
+var unitPattern = /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,
+    docEl;
+
+/**
+ * @private
+ */
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @static
+ * @member Ext.Element
+ * @method get
+ */
+El.get = function(el){
+    var ex,
+        elm,
+        id;
+    if(!el){ return null; }
+    if (typeof el == "string") { // element id
+        if (!(elm = DOC.getElementById(el))) {
+            return null;
+        }
+        if (EC[el] && EC[el].el) {
+            ex = EC[el].el;
+            ex.dom = elm;
+        } else {
+            ex = El.addToCache(new El(elm));
+        }
+        return ex;
+    } else if (el.tagName) { // dom element
+        if(!(id = el.id)){
+            id = Ext.id(el);
+        }
+        if (EC[id] && EC[id].el) {
+            ex = EC[id].el;
+            ex.dom = el;
+        } else {
+            ex = El.addToCache(new El(el));
+        }
+        return ex;
+    } else if (el instanceof El) {
+        if(el != docEl){
+            // refresh dom element in case no longer valid,
+            // catch case where it hasn't been appended
+
+            // If an el instance is passed, don't pass to getElementById without some kind of id
+            if (Ext.isIE && (el.id == undefined || el.id == '')) {
+                el.dom = el.dom;
+            } else {
+                el.dom = DOC.getElementById(el.id) || el.dom;
+            }
+        }
+        return el;
+    } else if(el.isComposite) {
+        return el;
+    } else if(Ext.isArray(el)) {
+        return El.select(el);
+    } else if(el == DOC) {
+        // create a bogus element object representing the document object
+        if(!docEl){
+            var f = function(){};
+            f.prototype = El.prototype;
+            docEl = new f();
+            docEl.dom = DOC;
+        }
+        return docEl;
+    }
+    return null;
+};
+
+El.addToCache = function(el, id){
+    id = id || el.id;
+    EC[id] = {
+        el:  el,
+        data: {},
+        events: {}
+    };
+    return el;
+};
+
+// private method for getting and setting element data
+El.data = function(el, key, value){
+    el = El.get(el);
+    if (!el) {
+        return null;
+    }
+    var c = EC[el.id].data;
+    if(arguments.length == 2){
+        return c[key];
+    }else{
+        return (c[key] = value);
+    }
+};
+
+// private
+// Garbage collection - uncache elements/purge listeners on orphaned elements
+// so we don't hold a reference and cause the browser to retain them
+function garbageCollect(){
+    if(!Ext.enableGarbageCollector){
+        clearInterval(El.collectorThreadId);
+    } else {
+        var eid,
+            el,
+            d,
+            o;
+
+        for(eid in EC){
+            o = EC[eid];
+            if(o.skipGC){
+                continue;
+            }
+            el = o.el;
+            d = el.dom;
+            // -------------------------------------------------------
+            // Determining what is garbage:
+            // -------------------------------------------------------
+            // !d
+            // dom node is null, definitely garbage
+            // -------------------------------------------------------
+            // !d.parentNode
+            // no parentNode == direct orphan, definitely garbage
+            // -------------------------------------------------------
+            // !d.offsetParent && !document.getElementById(eid)
+            // display none elements have no offsetParent so we will
+            // also try to look it up by it's id. However, check
+            // offsetParent first so we don't do unneeded lookups.
+            // This enables collection of elements that are not orphans
+            // directly, but somewhere up the line they have an orphan
+            // parent.
+            // -------------------------------------------------------
+            if(!d || !d.parentNode || (!d.offsetParent && !DOC.getElementById(eid))){
+                if(Ext.enableListenerCollection){
+                    Ext.EventManager.removeAll(d);
+                }
+                delete EC[eid];
+            }
+        }
+        // Cleanup IE Object leaks
+        if (Ext.isIE) {
+            var t = {};
+            for (eid in EC) {
+                t[eid] = EC[eid];
+            }
+            EC = Ext.elCache = t;
+        }
+    }
+}
+El.collectorThreadId = setInterval(garbageCollect, 30000);
+
+var flyFn = function(){};
+flyFn.prototype = El.prototype;
+
+// dom is optional
+El.Flyweight = function(dom){
+    this.dom = dom;
+};
+
+El.Flyweight.prototype = new flyFn();
+El.Flyweight.prototype.isFlyweight = true;
+El._flyweights = {};
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext.Element
+ * @method fly
+ */
+El.fly = function(el, named){
+    var ret = null;
+    named = named || '_global';
+
+    if (el = Ext.getDom(el)) {
+        (El._flyweights[named] = El._flyweights[named] || new El.Flyweight()).dom = el;
+        ret = El._flyweights[named];
+    }
+    return ret;
+};
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * Shorthand of {@link Ext.Element#get}
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @member Ext
+ * @method get
+ */
+Ext.get = El.get;
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext
+ * @method fly
+ */
+Ext.fly = El.fly;
+
+// speedy lookup for elements never to box adjust
+var noBoxAdjust = Ext.isStrict ? {
+    select:1
+} : {
+    input:1, select:1, textarea:1
+};
+if(Ext.isIE || Ext.isGecko){
+    noBoxAdjust['button'] = 1;
+}
+
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/CompositeElementLite.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/CompositeElementLite.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/CompositeElementLite.js	(revision 76)
@@ -0,0 +1,322 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * Example:<pre><code>
+var els = Ext.select("#some-el div.some-class");
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class');
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code>
+ */
+Ext.CompositeElementLite = function(els, root){
+    /**
+     * <p>The Array of DOM elements which this CompositeElement encapsulates. Read-only.</p>
+     * <p>This will not <i>usually</i> be accessed in developers' code, but developers wishing
+     * to augment the capabilities of the CompositeElementLite class may use it when adding
+     * methods to the class.</p>
+     * <p>For example to add the <code>nextAll</code> method to the class to <b>add</b> all
+     * following siblings of selected elements, the code would be</p><code><pre>
+Ext.override(Ext.CompositeElementLite, {
+    nextAll: function() {
+        var els = this.elements, i, l = els.length, n, r = [], ri = -1;
+
+//      Loop through all elements in this Composite, accumulating
+//      an Array of all siblings.
+        for (i = 0; i < l; i++) {
+            for (n = els[i].nextSibling; n; n = n.nextSibling) {
+                r[++ri] = n;
+            }
+        }
+
+//      Add all found siblings to this Composite
+        return this.add(r);
+    }
+});</pre></code>
+     * @type Array
+     * @property elements
+     */
+    this.elements = [];
+    this.add(els, root);
+    this.el = new Ext.Element.Flyweight();
+};
+
+Ext.CompositeElementLite.prototype = {
+    isComposite: true,
+
+    // private
+    getElement : function(el){
+        // Set the shared flyweight dom property to the current element
+        var e = this.el;
+        e.dom = el;
+        e.id = el.id;
+        return e;
+    },
+
+    // private
+    transformElement : function(el){
+        return Ext.getDom(el);
+    },
+
+    /**
+     * Returns the number of elements in this Composite.
+     * @return Number
+     */
+    getCount : function(){
+        return this.elements.length;
+    },
+    /**
+     * Adds elements to this Composite object.
+     * @param {Mixed} els Either an Array of DOM elements to add, or another Composite object who's elements should be added.
+     * @return {CompositeElement} This Composite object.
+     */
+    add : function(els, root){
+        var me = this,
+            elements = me.elements;
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }else if(els.isComposite){
+            els = els.elements;
+        }else if(!Ext.isIterable(els)){
+            els = [els];
+        }
+
+        for(var i = 0, len = els.length; i < len; ++i){
+            elements.push(me.transformElement(els[i]));
+        }
+        return me;
+    },
+
+    invoke : function(fn, args){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            e,
+            i;
+
+        for(i = 0; i < len; i++) {
+            e = els[i];
+            if(e){
+                Ext.Element.prototype[fn].apply(me.getElement(e), args);
+            }
+        }
+        return me;
+    },
+    /**
+     * Returns a flyweight Element of the dom element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+    item : function(index){
+        var me = this,
+            el = me.elements[index],
+            out = null;
+
+        if(el){
+            out = me.getElement(el);
+        }
+        return out;
+    },
+
+    // fixes scope with flyweight
+    addListener : function(eventName, handler, scope, opt){
+        var els = this.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e) {
+                Ext.EventManager.on(e, eventName, handler, scope || e, opt);
+            }
+        }
+        return this;
+    },
+    /**
+     * <p>Calls the passed function for each element in this composite.</p>
+     * @param {Function} fn The function to call. The function is passed the following parameters:<ul>
+     * <li><b>el</b> : Element<div class="sub-desc">The current Element in the iteration.
+     * <b>This is the flyweight (shared) Ext.Element instance, so if you require a
+     * a reference to the dom node, use el.dom.</b></div></li>
+     * <li><b>c</b> : Composite<div class="sub-desc">This Composite object.</div></li>
+     * <li><b>idx</b> : Number<div class="sub-desc">The zero-based index in the iteration.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<i>this</i> reference) in which the function is executed. (defaults to the Element)
+     * @return {CompositeElement} this
+     */
+    each : function(fn, scope){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e){
+                e = this.getElement(e);
+                if(fn.call(scope || e, e, me, i) === false){
+                    break;
+                }
+            }
+        }
+        return me;
+    },
+
+    /**
+    * Clears this Composite and adds the elements passed.
+    * @param {Mixed} els Either an array of DOM elements, or another Composite from which to fill this Composite.
+    * @return {CompositeElement} this
+    */
+    fill : function(els){
+        var me = this;
+        me.elements = [];
+        me.add(els);
+        return me;
+    },
+
+    /**
+     * Filters this composite to only elements that match the passed selector.
+     * @param {String/Function} selector A string CSS selector or a comparison function.
+     * The comparison function will be called with the following arguments:<ul>
+     * <li><code>el</code> : Ext.Element<div class="sub-desc">The current DOM element.</div></li>
+     * <li><code>index</code> : Number<div class="sub-desc">The current index within the collection.</div></li>
+     * </ul>
+     * @return {CompositeElement} this
+     */
+    filter : function(selector){
+        var els = [],
+            me = this,
+            fn = Ext.isFunction(selector) ? selector
+                : function(el){
+                    return el.is(selector);
+                };
+
+        me.each(function(el, self, i) {
+            if (fn(el, i) !== false) {
+                els[els.length] = me.transformElement(el);
+            }
+        });
+        
+        me.elements = els;
+        return me;
+    },
+
+    /**
+     * Find the index of the passed element within the composite collection.
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Number The index of the passed Ext.Element in the composite collection, or -1 if not found.
+     */
+    indexOf : function(el){
+        return this.elements.indexOf(this.transformElement(el));
+    },
+
+    /**
+    * Replaces the specified element with the passed element.
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * to replace.
+    * @param {Mixed} replacement The id of an element or the Element itself.
+    * @param {Boolean} domReplace (Optional) True to remove and replace the element in the document too.
+    * @return {CompositeElement} this
+    */
+    replaceElement : function(el, replacement, domReplace){
+        var index = !isNaN(el) ? el : this.indexOf(el),
+            d;
+        if(index > -1){
+            replacement = Ext.getDom(replacement);
+            if(domReplace){
+                d = this.elements[index];
+                d.parentNode.insertBefore(replacement, d);
+                Ext.removeNode(d);
+            }
+            this.elements.splice(index, 1, replacement);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all elements.
+     */
+    clear : function(){
+        this.elements = [];
+    }
+};
+
+Ext.CompositeElementLite.prototype.on = Ext.CompositeElementLite.prototype.addListener;
+
+/**
+ * @private
+ * Copies all of the functions from Ext.Element's prototype onto CompositeElementLite's prototype.
+ * This is called twice - once immediately below, and once again after additional Ext.Element
+ * are added in Ext JS
+ */
+Ext.CompositeElementLite.importElementMethods = function() {
+    var fnName,
+        ElProto = Ext.Element.prototype,
+        CelProto = Ext.CompositeElementLite.prototype;
+
+    for (fnName in ElProto) {
+        if (typeof ElProto[fnName] == 'function'){
+            (function(fnName) {
+                CelProto[fnName] = CelProto[fnName] || function() {
+                    return this.invoke(fnName, arguments);
+                };
+            }).call(CelProto, fnName);
+
+        }
+    }
+};
+
+Ext.CompositeElementLite.importElementMethods();
+
+if(Ext.DomQuery){
+    Ext.Element.selectorFunction = Ext.DomQuery.select;
+}
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+    return new Ext.CompositeElementLite(els);
+};
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.traversal.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.traversal.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.traversal.js	(revision 76)
@@ -0,0 +1,175 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+	var PARENTNODE = 'parentNode',
+		NEXTSIBLING = 'nextSibling',
+		PREVIOUSSIBLING = 'previousSibling',
+		DQ = Ext.DomQuery,
+		GET = Ext.get;
+	
+	return {
+		/**
+	     * Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to search as a number or element (defaults to 50 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParent : function(simpleSelector, maxDepth, returnEl){
+	        var p = this.dom,
+	        	b = document.body, 
+	        	depth = 0, 	        	
+	        	stopEl;	        
+            if(Ext.isGecko && Object.prototype.toString.call(p) == '[object XULElement]') {
+                return null;
+            }
+	        maxDepth = maxDepth || 50;
+	        if (isNaN(maxDepth)) {
+	            stopEl = Ext.getDom(maxDepth);
+	            maxDepth = Number.MAX_VALUE;
+	        }
+	        while(p && p.nodeType == 1 && depth < maxDepth && p != b && p != stopEl){
+	            if(DQ.is(p, simpleSelector)){
+	                return returnEl ? GET(p) : p;
+	            }
+	            depth++;
+	            p = p.parentNode;
+	        }
+	        return null;
+	    },
+	
+	    /**
+	     * Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParentNode : function(simpleSelector, maxDepth, returnEl){
+	        var p = Ext.fly(this.dom.parentNode, '_internal');
+	        return p ? p.findParent(simpleSelector, maxDepth, returnEl) : null;
+	    },
+	
+	    /**
+	     * Walks up the dom looking for a parent node that matches the passed simple selector (e.g. div.some-class or span:first-child).
+	     * This is a shortcut for findParentNode() that always returns an Ext.Element.
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @return {Ext.Element} The matching DOM node (or null if no match was found)
+	     */
+	    up : function(simpleSelector, maxDepth){
+	        return this.findParentNode(simpleSelector, maxDepth, true);
+	    },
+	
+	    /**
+	     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {CompositeElement/CompositeElementLite} The composite element
+	     */
+	    select : function(selector){
+	        return Ext.Element.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {Array} An array of the matched nodes
+	     */
+	    query : function(selector){
+	        return DQ.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    child : function(selector, returnDom){
+	        var n = DQ.selectNode(selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+	    /**
+	     * Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    down : function(selector, returnDom){
+	        var n = DQ.selectNode(" > " + selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+		 /**
+	     * Gets the parent node for this element, optionally chaining up trying to match a selector
+	     * @param {String} selector (optional) Find a parent node that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The parent node or null
+		 */
+	    parent : function(selector, returnDom){
+	        return this.matchNode(PARENTNODE, PARENTNODE, selector, returnDom);
+	    },
+	
+	     /**
+	     * Gets the next sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The next sibling or null
+		 */
+	    next : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, NEXTSIBLING, selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the previous sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The previous sibling or null
+		 */
+	    prev : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, PREVIOUSSIBLING, selector, returnDom);
+	    },
+	
+	
+	    /**
+	     * Gets the first child, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The first child or null
+		 */
+	    first : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, 'firstChild', selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the last child, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The last child or null
+		 */
+	    last : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, 'lastChild', selector, returnDom);
+	    },
+	    
+	    matchNode : function(dir, start, selector, returnDom){
+	        var n = this.dom[start];
+	        while(n){
+	            if(n.nodeType == 1 && (!selector || DQ.is(n, selector))){
+	                return !returnDom ? GET(n) : n;
+	            }
+	            n = n[dir];
+	        }
+	        return null;
+	    }	
+    };
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Template.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Template.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Template.js	(revision 76)
@@ -0,0 +1,246 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Template
+ * <p>Represents an HTML fragment template. Templates may be {@link #compile precompiled}
+ * for greater performance.</p>
+ * <p>For example usage {@link #Template see the constructor}.</p>
+ *
+ * @constructor
+ * An instance of this class may be created by passing to the constructor either
+ * a single argument, or multiple arguments:
+ * <div class="mdetail-params"><ul>
+ * <li><b>single argument</b> : String/Array
+ * <div class="sub-desc">
+ * The single argument may be either a String or an Array:<ul>
+ * <li><tt>String</tt> : </li><pre><code>
+var t = new Ext.Template("&lt;div>Hello {0}.&lt;/div>");
+t.{@link #append}('some-element', ['foo']);
+ * </code></pre>
+ * <li><tt>Array</tt> : </li>
+ * An Array will be combined with <code>join('')</code>.
+<pre><code>
+var t = new Ext.Template([
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name:trim} {value:ellipsis(10)}&lt;/span&gt;',
+    '&lt;/div&gt;',
+]);
+t.{@link #compile}();
+t.{@link #append}('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
+</code></pre>
+ * </ul></div></li>
+ * <li><b>multiple arguments</b> : String, Object, Array, ...
+ * <div class="sub-desc">
+ * Multiple arguments will be combined with <code>join('')</code>.
+ * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    // a configuration object:
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // See Notes below.
+    }
+);
+ * </code></pre>
+ * <p><b>Notes</b>:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>Formatting and <code>disableFormats</code> are not applicable for Ext Core.</li>
+ * <li>For a list of available format functions, see {@link Ext.util.Format}.</li>
+ * <li><code>disableFormats</code> reduces <code>{@link #apply}</code> time
+ * when no formatting is required.</li>
+ * </ul></div>
+ * </div></li>
+ * </ul></div>
+ * @param {Mixed} config
+ */
+Ext.Template = function(html){
+    var me = this,
+        a = arguments,
+        buf = [],
+        v;
+
+    if (Ext.isArray(html)) {
+        html = html.join("");
+    } else if (a.length > 1) {
+        for(var i = 0, len = a.length; i < len; i++){
+            v = a[i];
+            if(typeof v == 'object'){
+                Ext.apply(me, v);
+            } else {
+                buf.push(v);
+            }
+        };
+        html = buf.join('');
+    }
+
+    /**@private*/
+    me.html = html;
+    /**
+     * @cfg {Boolean} compiled Specify <tt>true</tt> to compile the template
+     * immediately (see <code>{@link #compile}</code>).
+     * Defaults to <tt>false</tt>.
+     */
+    if (me.compiled) {
+        me.compile();
+    }
+};
+Ext.Template.prototype = {
+    /**
+     * @cfg {RegExp} re The regular expression used to match template variables.
+     * Defaults to:<pre><code>
+     * re : /\{([\w\-]+)\}/g                                     // for Ext Core
+     * re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g      // for Ext JS
+     * </code></pre>
+     */
+    re : /\{([\w\-]+)\}/g,
+    /**
+     * See <code>{@link #re}</code>.
+     * @type RegExp
+     * @property re
+     */
+
+    /**
+     * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        var me = this;
+
+        return me.compiled ?
+                me.compiled(values) :
+                me.html.replace(me.re, function(m, name){
+                    return values[name] !== undefined ? values[name] : "";
+                });
+    },
+
+    /**
+     * Sets the HTML used as the template and optionally compiles it.
+     * @param {String} html
+     * @param {Boolean} compile (optional) True to compile the template (defaults to undefined)
+     * @return {Ext.Template} this
+     */
+    set : function(html, compile){
+        var me = this;
+        me.html = html;
+        me.compiled = null;
+        return compile ? me.compile() : me;
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     */
+    compile : function(){
+        var me = this,
+            sep = Ext.isGecko ? "+" : ",";
+
+        function fn(m, name){
+            name = "values['" + name + "']";
+            return "'"+ sep + '(' + name + " == undefined ? '' : " + name + ')' + sep + "'";
+        }
+
+        eval("this.compiled = function(values){ return " + (Ext.isGecko ? "'" : "['") +
+             me.html.replace(/\\/g, '\\\\').replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn) +
+             (Ext.isGecko ?  "';};" : "'].join('');};"));
+        return me;
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) as the first child of el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertFirst: function(el, values, returnElement){
+        return this.doInsert('afterBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) before el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertBefore: function(el, values, returnElement){
+        return this.doInsert('beforeBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) after el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertAfter : function(el, values, returnElement){
+        return this.doInsert('afterEnd', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied <code>values</code> to the template and appends
+     * the new node(s) to the specified <code>el</code>.
+     * <p>For example usage {@link #Template see the constructor}.</p>
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @param {Boolean} returnElement (optional) true to return an Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    append : function(el, values, returnElement){
+        return this.doInsert('beforeEnd', el, values, returnElement);
+    },
+
+    doInsert : function(where, el, values, returnEl){
+        el = Ext.getDom(el);
+        var newNode = Ext.DomHelper.insertHtml(where, el, this.applyTemplate(values));
+        return returnEl ? Ext.get(newNode, true) : newNode;
+    },
+
+    /**
+     * Applies the supplied values to the template and overwrites the content of el with the new node(s).
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    overwrite : function(el, values, returnElement){
+        el = Ext.getDom(el);
+        el.innerHTML = this.applyTemplate(values);
+        return returnElement ? Ext.get(el.firstChild, true) : el.firstChild;
+    }
+};
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+ * @param {Object/Array} values
+ * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+ * or an object (i.e. <code>{foo: 'bar'}</code>).
+ * @return {String} The HTML fragment
+ * @member Ext.Template
+ * @method apply
+ */
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @param {Object} config A configuration object
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.Template.from = function(el, config){
+    el = Ext.getDom(el);
+    return new Ext.Template(el.value || el.innerHTML, config || '');
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.position.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.position.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.position.js	(revision 76)
@@ -0,0 +1,301 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+(function(){
+var D = Ext.lib.Dom,
+        LEFT = "left",
+        RIGHT = "right",
+        TOP = "top",
+        BOTTOM = "bottom",
+        POSITION = "position",
+        STATIC = "static",
+        RELATIVE = "relative",
+        AUTO = "auto",
+        ZINDEX = "z-index";
+
+Ext.Element.addMethods({
+	/**
+      * Gets the current X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The X position of the element
+      */
+    getX : function(){
+        return D.getX(this.dom);
+    },
+
+    /**
+      * Gets the current Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The Y position of the element
+      */
+    getY : function(){
+        return D.getY(this.dom);
+    },
+
+    /**
+      * Gets the current position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Array} The XY position of the element
+      */
+    getXY : function(){
+        return D.getXY(this.dom);
+    },
+
+    /**
+      * Returns the offsets of this element from the passed element. Both element must be part of the DOM tree and not have display:none to have page coordinates.
+      * @param {Mixed} element The element to get the offsets from.
+      * @return {Array} The XY page offsets (e.g. [100, -200])
+      */
+    getOffsetsTo : function(el){
+        var o = this.getXY(),
+        	e = Ext.fly(el, '_internal').getXY();
+        return [o[0]-e[0],o[1]-e[1]];
+    },
+
+    /**
+     * Sets the X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The X position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setX : function(x, animate){	    
+	    return this.setXY([x, this.getY()], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The Y position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setY : function(y, animate){	    
+	    return this.setXY([this.getX(), y], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the element's left position directly using CSS style (instead of {@link #setX}).
+     * @param {String} left The left CSS property value
+     * @return {Ext.Element} this
+     */
+    setLeft : function(left){
+        this.setStyle(LEFT, this.addUnits(left));
+        return this;
+    },
+
+    /**
+     * Sets the element's top position directly using CSS style (instead of {@link #setY}).
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+    setTop : function(top){
+        this.setStyle(TOP, this.addUnits(top));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS right style.
+     * @param {String} right The right CSS property value
+     * @return {Ext.Element} this
+     */
+    setRight : function(right){
+        this.setStyle(RIGHT, this.addUnits(right));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS bottom style.
+     * @param {String} bottom The bottom CSS property value
+     * @return {Ext.Element} this
+     */
+    setBottom : function(bottom){
+        this.setStyle(BOTTOM, this.addUnits(bottom));
+        return this;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Array} pos Contains X & Y [x, y] values for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setXY : function(pos, animate){
+	    var me = this;
+        if(!animate || !me.anim){
+            D.setXY(me.dom, pos);
+        }else{
+            me.anim({points: {to: pos}}, me.preanim(arguments, 1), 'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setLocation : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    moveTo : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));        
+    },    
+    
+    /**
+     * Gets the left X coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getLeft : function(local){
+	    return !local ? this.getX() : parseInt(this.getStyle(LEFT), 10) || 0;
+    },
+
+    /**
+     * Gets the right X coordinate of the element (element X position + element width)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getRight : function(local){
+	    var me = this;
+	    return !local ? me.getX() + me.getWidth() : (me.getLeft(true) + me.getWidth()) || 0;
+    },
+
+    /**
+     * Gets the top Y coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getTop : function(local) {
+	    return !local ? this.getY() : parseInt(this.getStyle(TOP), 10) || 0;
+    },
+
+    /**
+     * Gets the bottom Y coordinate of the element (element Y position + element height)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getBottom : function(local){
+	    var me = this;
+	    return !local ? me.getY() + me.getHeight() : (me.getTop(true) + me.getHeight()) || 0;
+    },
+
+    /**
+    * Initializes positioning on this element. If a desired position is not passed, it will make the
+    * the element positioned relative IF it is not already positioned.
+    * @param {String} pos (optional) Positioning to use "relative", "absolute" or "fixed"
+    * @param {Number} zIndex (optional) The zIndex to apply
+    * @param {Number} x (optional) Set the page X position
+    * @param {Number} y (optional) Set the page Y position
+    */
+    position : function(pos, zIndex, x, y){
+	    var me = this;
+	    
+        if(!pos && me.isStyle(POSITION, STATIC)){           
+            me.setStyle(POSITION, RELATIVE);           
+        } else if(pos) {
+            me.setStyle(POSITION, pos);
+        }
+        if(zIndex){
+            me.setStyle(ZINDEX, zIndex);
+        }
+        if(x || y) me.setXY([x || false, y || false]);
+    },
+
+    /**
+    * Clear positioning back to the default when the document was loaded
+    * @param {String} value (optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.
+    * @return {Ext.Element} this
+     */
+    clearPositioning : function(value){
+        value = value || '';
+        this.setStyle({
+            left : value,
+            right : value,
+            top : value,
+            bottom : value,
+            "z-index" : "",
+            position : STATIC
+        });
+        return this;
+    },
+
+    /**
+    * Gets an object with all CSS positioning properties. Useful along with setPostioning to get
+    * snapshot before performing an update and then restoring the element.
+    * @return {Object}
+    */
+    getPositioning : function(){
+        var l = this.getStyle(LEFT);
+        var t = this.getStyle(TOP);
+        return {
+            "position" : this.getStyle(POSITION),
+            "left" : l,
+            "right" : l ? "" : this.getStyle(RIGHT),
+            "top" : t,
+            "bottom" : t ? "" : this.getStyle(BOTTOM),
+            "z-index" : this.getStyle(ZINDEX)
+        };
+    },
+    
+    /**
+    * Set positioning with an object returned by getPositioning().
+    * @param {Object} posCfg
+    * @return {Ext.Element} this
+     */
+    setPositioning : function(pc){
+	    var me = this,
+	    	style = me.dom.style;
+	    	
+        me.setStyle(pc);
+        
+        if(pc.right == AUTO){
+            style.right = "";
+        }
+        if(pc.bottom == AUTO){
+            style.bottom = "";
+        }
+        
+        return me;
+    },    
+	
+    /**
+     * Translates the passed page coordinates into left/top css values for this element
+     * @param {Number/Array} x The page x or an array containing [x, y]
+     * @param {Number} y (optional) The page y, required if x is not an array
+     * @return {Object} An object with left and top properties. e.g. {left: (value), top: (value)}
+     */
+    translatePoints : function(x, y){        	     
+	    y = isNaN(x[1]) ? y : x[1];
+        x = isNaN(x[0]) ? x : x[0];
+        var me = this,
+        	relative = me.isStyle(POSITION, RELATIVE),
+        	o = me.getXY(),
+        	l = parseInt(me.getStyle(LEFT), 10),
+        	t = parseInt(me.getStyle(TOP), 10);
+        
+        l = !isNaN(l) ? l : (relative ? 0 : me.dom.offsetLeft);
+        t = !isNaN(t) ? t : (relative ? 0 : me.dom.offsetTop);        
+
+        return {left: (x - o[0] + l), top: (y - o[1] + t)}; 
+    },
+    
+    animTest : function(args, animate, i) {
+        return !!animate && this.preanim ? this.preanim(args, i) : false;
+    }
+});
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/EventManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/EventManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/EventManager.js	(revision 76)
@@ -0,0 +1,939 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.EventManager
+ * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides
+ * several useful events directly.
+ * See {@link Ext.EventObject} for more details on normalized event objects.
+ * @singleton
+ */
+Ext.EventManager = function(){
+    var docReadyEvent,
+        docReadyProcId,
+        docReadyState = false,
+        DETECT_NATIVE = Ext.isGecko || Ext.isWebKit || Ext.isSafari,
+        E = Ext.lib.Event,
+        D = Ext.lib.Dom,
+        DOC = document,
+        WINDOW = window,
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        COMPLETE = 'complete',
+        propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+        /*
+         * This cache is used to hold special js objects, the document and window, that don't have an id. We need to keep
+         * a reference to them so we can look them up at a later point.
+         */
+        specialElCache = [];
+
+     function getId(el){
+        var id = false,
+            i = 0,
+            len = specialElCache.length,
+            skip = false,
+            o;
+            
+        if (el) {
+            if (el.getElementById || el.navigator) {
+                // look up the id
+                for(; i < len; ++i){
+                    o = specialElCache[i];
+                    if(o.el === el){
+                        id = o.id;
+                        break;
+                    }
+                }
+                if(!id){
+                    // for browsers that support it, ensure that give the el the same id
+                    id = Ext.id(el);
+                    specialElCache.push({
+                        id: id,
+                        el: el
+                    });
+                    skip = true;
+                }
+            }else{
+                id = Ext.id(el);
+            }
+            if(!Ext.elCache[id]){
+                Ext.Element.addToCache(new Ext.Element(el), id);
+                if(skip){
+                    Ext.elCache[id].skipGC = true;
+                }
+            }
+        }
+        return id;
+     }
+
+    /// There is some jquery work around stuff here that isn't needed in Ext Core.
+    function addListener(el, ename, fn, task, wrap, scope){
+        el = Ext.getDom(el);
+        var id = getId(el),
+            es = Ext.elCache[id].events,
+            wfn;
+
+        wfn = E.on(el, ename, wrap);
+        es[ename] = es[ename] || [];
+
+        /* 0 = Original Function,
+           1 = Event Manager Wrapped Function,
+           2 = Scope,
+           3 = Adapter Wrapped Function,
+           4 = Buffered Task
+        */
+        es[ename].push([fn, wrap, scope, wfn, task]);
+
+        // this is a workaround for jQuery and should somehow be removed from Ext Core in the future
+        // without breaking ExtJS.
+
+        // workaround for jQuery
+        if(el.addEventListener && ename == "mousewheel"){
+            var args = ["DOMMouseScroll", wrap, false];
+            el.addEventListener.apply(el, args);
+            Ext.EventManager.addListener(WINDOW, 'unload', function(){
+                el.removeEventListener.apply(el, args);
+            });
+        }
+
+        // fix stopped mousedowns on the document
+        if(el == DOC && ename == "mousedown"){
+            Ext.EventManager.stoppedMouseDownEvent.addListener(wrap);
+        }
+    }
+
+    function doScrollChk(){
+        /* Notes:
+             'doScroll' will NOT work in a IFRAME/FRAMESET.
+             The method succeeds but, a DOM query done immediately after -- FAILS.
+          */
+        if(window != top){
+            return false;
+        }
+
+        try{
+            DOC.documentElement.doScroll('left');
+        }catch(e){
+             return false;
+        }
+
+        fireDocReady();
+        return true;
+    }
+    /**
+     * @return {Boolean} True if the document is in a 'complete' state (or was determined to
+     * be true by other means). If false, the state is evaluated again until canceled.
+     */
+    function checkReadyState(e){
+
+        if(Ext.isIE && doScrollChk()){
+            return true;
+        }
+        if(DOC.readyState == COMPLETE){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    var styles;
+    function checkStyleSheets(e){
+        styles || (styles = Ext.query('style, link[rel=stylesheet]'));
+        if(styles.length == DOC.styleSheets.length){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    function OperaDOMContentLoaded(e){
+        DOC.removeEventListener(DOMCONTENTLOADED, arguments.callee, false);
+        checkStyleSheets();
+    }
+
+    function fireDocReady(e){
+        if(!docReadyState){
+            docReadyState = true; //only attempt listener removal once
+
+            if(docReadyProcId){
+                clearTimeout(docReadyProcId);
+            }
+            if(DETECT_NATIVE) {
+                DOC.removeEventListener(DOMCONTENTLOADED, fireDocReady, false);
+            }
+            if(Ext.isIE && checkReadyState.bindIE){  //was this was actually set ??
+                DOC.detachEvent('onreadystatechange', checkReadyState);
+            }
+            E.un(WINDOW, "load", arguments.callee);
+        }
+        if(docReadyEvent && !Ext.isReady){
+            Ext.isReady = true;
+            docReadyEvent.fire();
+            docReadyEvent.listeners = [];
+        }
+
+    }
+
+    function initDocReady(){
+        docReadyEvent || (docReadyEvent = new Ext.util.Event());
+        if (DETECT_NATIVE) {
+            DOC.addEventListener(DOMCONTENTLOADED, fireDocReady, false);
+        }
+        /*
+         * Handle additional (exceptional) detection strategies here
+         */
+        if (Ext.isIE){
+            //Use readystatechange as a backup AND primary detection mechanism for a FRAME/IFRAME
+            //See if page is already loaded
+            if(!checkReadyState()){
+                checkReadyState.bindIE = true;
+                DOC.attachEvent('onreadystatechange', checkReadyState);
+            }
+
+        }else if(Ext.isOpera ){
+            /* Notes:
+               Opera needs special treatment needed here because CSS rules are NOT QUITE
+               available after DOMContentLoaded is raised.
+            */
+
+            //See if page is already loaded and all styleSheets are in place
+            (DOC.readyState == COMPLETE && checkStyleSheets()) ||
+                DOC.addEventListener(DOMCONTENTLOADED, OperaDOMContentLoaded, false);
+
+        }else if (Ext.isWebKit){
+            //Fallback for older Webkits without DOMCONTENTLOADED support
+            checkReadyState();
+        }
+        // no matter what, make sure it fires on load
+        E.on(WINDOW, "load", fireDocReady);
+    }
+
+    function createTargeted(h, o){
+        return function(){
+            var args = Ext.toArray(arguments);
+            if(o.target == Ext.EventObject.setEvent(args[0]).target){
+                h.apply(this, args);
+            }
+        };
+    }
+
+    function createBuffered(h, o, task){
+        return function(e){
+            // create new event object impl so new events don't wipe out properties
+            task.delay(o.buffer, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function createSingle(h, el, ename, fn, scope){
+        return function(e){
+            Ext.EventManager.removeListener(el, ename, fn, scope);
+            h(e);
+        };
+    }
+
+    function createDelayed(h, o, fn){
+        return function(e){
+            var task = new Ext.util.DelayedTask(h);
+            if(!fn.tasks) {
+                fn.tasks = [];
+            }
+            fn.tasks.push(task);
+            task.delay(o.delay || 10, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function listen(element, ename, opt, fn, scope){
+        var o = (!opt || typeof opt == "boolean") ? {} : opt,
+            el = Ext.getDom(element), task;
+
+        fn = fn || o.fn;
+        scope = scope || o.scope;
+
+        if(!el){
+            throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.';
+        }
+        function h(e){
+            // prevent errors while unload occurring
+            if(!Ext){// !window[xname]){  ==> can't we do this?
+                return;
+            }
+            e = Ext.EventObject.setEvent(e);
+            var t;
+            if (o.delegate) {
+                if(!(t = e.getTarget(o.delegate, el))){
+                    return;
+                }
+            } else {
+                t = e.target;
+            }
+            if (o.stopEvent) {
+                e.stopEvent();
+            }
+            if (o.preventDefault) {
+               e.preventDefault();
+            }
+            if (o.stopPropagation) {
+                e.stopPropagation();
+            }
+            if (o.normalized === false) {
+                e = e.browserEvent;
+            }
+
+            fn.call(scope || el, e, t, o);
+        }
+        if(o.target){
+            h = createTargeted(h, o);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, fn);
+        }
+        if(o.single){
+            h = createSingle(h, el, ename, fn, scope);
+        }
+        if(o.buffer){
+            task = new Ext.util.DelayedTask(h);
+            h = createBuffered(h, o, task);
+        }
+
+        addListener(el, ename, fn, task, h, scope);
+        return h;
+    }
+
+    var pub = {
+        /**
+         * Appends an event handler to an element.  The shorthand version {@link #on} is equivalent.  Typically you will
+         * use {@link Ext.Element#addListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The html element or id to assign the event handler to.
+         * @param {String} eventName The name of the event to listen for.
+         * @param {Function} handler The handler function the event invokes. This function is passed
+         * the following parameters:<ul>
+         * <li>evt : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+         * <li>t : Element<div class="sub-desc">The {@link Ext.Element Element} which was the target of the event.
+         * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+         * <li>o : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+         * </ul>
+         * @param {Object} scope (optional) The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.
+         * @param {Object} options (optional) An object containing handler configuration properties.
+         * This may contain any of the following properties:<ul>
+         * <li>scope : Object<div class="sub-desc">The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.</div></li>
+         * <li>delegate : String<div class="sub-desc">A simple selector to filter the target or look for a descendant of the target</div></li>
+         * <li>stopEvent : Boolean<div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+         * <li>preventDefault : Boolean<div class="sub-desc">True to prevent the default action</div></li>
+         * <li>stopPropagation : Boolean<div class="sub-desc">True to prevent event propagation</div></li>
+         * <li>normalized : Boolean<div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+         * <li>delay : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after te event fires.</div></li>
+         * <li>single : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+         * <li>buffer : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+         * by the specified number of milliseconds. If the event fires again within that time, the original
+         * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+         * <li>target : Element<div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+         * </ul><br>
+         * <p>See {@link Ext.Element#addListener} for examples of how to use these options.</p>
+         */
+        addListener : function(element, eventName, fn, scope, options){
+            if(typeof eventName == 'object'){
+                var o = eventName, e, val;
+                for(e in o){
+                    val = o[e];
+                    if(!propRe.test(e)){
+                        if(Ext.isFunction(val)){
+                            // shared options
+                            listen(element, e, o, val, o.scope);
+                        }else{
+                            // individual options
+                            listen(element, e, val);
+                        }
+                    }
+                }
+            } else {
+                listen(element, eventName, options, fn, scope);
+            }
+        },
+
+        /**
+         * Removes an event handler from an element.  The shorthand version {@link #un} is equivalent.  Typically
+         * you will use {@link Ext.Element#removeListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+         * @param {String} eventName The name of the event.
+         * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+         * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+         * then this must refer to the same object.
+         */
+        removeListener : function(el, eventName, fn, scope){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                f = el && (Ext.elCache[id].events)[eventName] || [],
+                wrap, i, l, k, len, fnc;
+
+            for (i = 0, len = f.length; i < len; i++) {
+
+                /* 0 = Original Function,
+                   1 = Event Manager Wrapped Function,
+                   2 = Scope,
+                   3 = Adapter Wrapped Function,
+                   4 = Buffered Task
+                */
+                if (Ext.isArray(fnc = f[i]) && fnc[0] == fn && (!scope || fnc[2] == scope)) {
+                    if(fnc[4]) {
+                        fnc[4].cancel();
+                    }
+                    k = fn.tasks && fn.tasks.length;
+                    if(k) {
+                        while(k--) {
+                            fn.tasks[k].cancel();
+                        }
+                        delete fn.tasks;
+                    }
+                    wrap = fnc[1];
+                    E.un(el, eventName, E.extAdapter ? fnc[3] : wrap);
+
+                    // jQuery workaround that should be removed from Ext Core
+                    if(wrap && el.addEventListener && eventName == "mousewheel"){
+                        el.removeEventListener("DOMMouseScroll", wrap, false);
+                    }
+
+                    // fix stopped mousedowns on the document
+                    if(wrap && el == DOC && eventName == "mousedown"){
+                        Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                    }
+
+                    f.splice(i, 1);
+                    if (f.length === 0) {
+                        delete Ext.elCache[id].events[eventName];
+                    }
+                    for (k in Ext.elCache[id].events) {
+                        return false;
+                    }
+                    Ext.elCache[id].events = {};
+                    return false;
+                }
+            }
+        },
+
+        /**
+         * Removes all event handers from an element.  Typically you will use {@link Ext.Element#removeAllListeners}
+         * directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove all event handlers.
+         */
+        removeAll : function(el){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                f, i, len, ename, fn, k, wrap;
+
+            for(ename in es){
+                if(es.hasOwnProperty(ename)){
+                    f = es[ename];
+                    /* 0 = Original Function,
+                       1 = Event Manager Wrapped Function,
+                       2 = Scope,
+                       3 = Adapter Wrapped Function,
+                       4 = Buffered Task
+                    */
+                    for (i = 0, len = f.length; i < len; i++) {
+                        fn = f[i];
+                        if(fn[4]) {
+                            fn[4].cancel();
+                        }
+                        if(fn[0].tasks && (k = fn[0].tasks.length)) {
+                            while(k--) {
+                                fn[0].tasks[k].cancel();
+                            }
+                            delete fn.tasks;
+                        }
+                        wrap =  fn[1];
+                        E.un(el, ename, E.extAdapter ? fn[3] : wrap);
+
+                        // jQuery workaround that should be removed from Ext Core
+                        if(el.addEventListener && wrap && ename == "mousewheel"){
+                            el.removeEventListener("DOMMouseScroll", wrap, false);
+                        }
+
+                        // fix stopped mousedowns on the document
+                        if(wrap && el == DOC &&  ename == "mousedown"){
+                            Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                        }
+                    }
+                }
+            }
+            if (Ext.elCache[id]) {
+                Ext.elCache[id].events = {};
+            }
+        },
+
+        getListeners : function(el, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                results = [];
+            if (es && es[eventName]) {
+                return es[eventName];
+            } else {
+                return null;
+            }
+        },
+
+        purgeElement : function(el, recurse, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                i, f, len;
+            if (eventName) {
+                if (es && es.hasOwnProperty(eventName)) {
+                    f = es[eventName];
+                    for (i = 0, len = f.length; i < len; i++) {
+                        Ext.EventManager.removeListener(el, eventName, f[i][0]);
+                    }
+                }
+            } else {
+                Ext.EventManager.removeAll(el);
+            }
+            if (recurse && el && el.childNodes) {
+                for (i = 0, len = el.childNodes.length; i < len; i++) {
+                    Ext.EventManager.purgeElement(el.childNodes[i], recurse, eventName);
+                }
+            }
+        },
+
+        _unload : function() {
+            var el;
+            for (el in Ext.elCache) {
+                Ext.EventManager.removeAll(el);
+            }
+            delete Ext.elCache;
+            delete Ext.Element._flyweights;
+
+            // Abort any outstanding Ajax requests
+            var c,
+                conn,
+                tid,
+                ajax = Ext.lib.Ajax;
+            (typeof ajax.conn == 'object') ? conn = ajax.conn : conn = {};
+            for (tid in conn) {
+                c = conn[tid];
+                if (c) {
+                    ajax.abort({conn: c, tId: tid});
+                }
+            }
+        },
+        /**
+         * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Can be
+         * accessed shorthanded as Ext.onReady().
+         * @param {Function} fn The method the event invokes.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+         * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+         * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+         */
+        onDocumentReady : function(fn, scope, options){
+            if (Ext.isReady) { // if it already fired or document.body is present
+                docReadyEvent || (docReadyEvent = new Ext.util.Event());
+                docReadyEvent.addListener(fn, scope, options);
+                docReadyEvent.fire();
+                docReadyEvent.listeners = [];
+            } else {
+                if (!docReadyEvent) {
+                    initDocReady();
+                }
+                options = options || {};
+                options.delay = options.delay || 1;
+                docReadyEvent.addListener(fn, scope, options);
+            }
+        },
+
+        /**
+         * Forces a document ready state transition for the framework.  Used when Ext is loaded
+         * into a DOM structure AFTER initial page load (Google API or other dynamic load scenario.
+         * Any pending 'onDocumentReady' handlers will be fired (if not already handled).
+         */
+        fireDocReady  : fireDocReady
+    };
+     /**
+     * Appends an event handler to an element.  Shorthand for {@link #addListener}.
+     * @param {String/HTMLElement} el The html element or id to assign the event handler to
+     * @param {String} eventName The name of the event to listen for.
+     * @param {Function} handler The handler function the event invokes.
+     * @param {Object} scope (optional) (<code>this</code> reference) in which the handler function executes. <b>Defaults to the Element</b>.
+     * @param {Object} options (optional) An object containing standard {@link #addListener} options
+     * @member Ext.EventManager
+     * @method on
+     */
+    pub.on = pub.addListener;
+    /**
+     * Removes an event handler from an element.  Shorthand for {@link #removeListener}.
+     * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+     * @param {String} eventName The name of the event.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #on} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @member Ext.EventManager
+     * @method un
+     */
+    pub.un = pub.removeListener;
+
+    pub.stoppedMouseDownEvent = new Ext.util.Event();
+    return pub;
+}();
+/**
+  * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Shorthand of {@link Ext.EventManager#onDocumentReady}.
+  * @param {Function} fn The method the event invokes.
+  * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+  * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+  * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+  * @member Ext
+  * @method onReady
+ */
+Ext.onReady = Ext.EventManager.onDocumentReady;
+
+
+//Initialize doc classes
+(function(){
+    var initExtCss = function() {
+        // find the body element
+        var bd = document.body || document.getElementsByTagName('body')[0];
+        if (!bd) {
+            return false;
+        }
+
+        var cls = [' ',
+                Ext.isIE ? "ext-ie " + (Ext.isIE6 ? 'ext-ie6' : (Ext.isIE7 ? 'ext-ie7' : (Ext.isIE8 ? 'ext-ie8' : 'ext-ie9')))
+                : Ext.isGecko ? "ext-gecko " + (Ext.isGecko2 ? 'ext-gecko2' : 'ext-gecko3')
+                : Ext.isOpera ? "ext-opera"
+                : Ext.isWebKit ? "ext-webkit" : ""];
+
+        if (Ext.isSafari) {
+            cls.push("ext-safari " + (Ext.isSafari2 ? 'ext-safari2' : (Ext.isSafari3 ? 'ext-safari3' : 'ext-safari4')));
+        } else if(Ext.isChrome) {
+            cls.push("ext-chrome");
+        }
+
+        if (Ext.isMac) {
+            cls.push("ext-mac");
+        }
+        if (Ext.isLinux) {
+            cls.push("ext-linux");
+        }
+
+        // add to the parent to allow for selectors like ".ext-strict .ext-ie"
+        if (Ext.isStrict || Ext.isBorderBox) {
+            var p = bd.parentNode;
+            if (p) {
+                if (!Ext.isStrict) {
+                    Ext.fly(p, '_internal').addClass('x-quirks');
+                    if (Ext.isIE && !Ext.isStrict) {
+                        Ext.isIEQuirks = true;
+                    }
+                }
+                Ext.fly(p, '_internal').addClass(((Ext.isStrict && Ext.isIE ) || (!Ext.enableForcedBoxModel && !Ext.isIE)) ? ' ext-strict' : ' ext-border-box');
+            }
+        }
+        // Forced border box model class applied to all elements. Bypassing javascript based box model adjustments
+        // in favor of css.  This is for non-IE browsers.
+        if (Ext.enableForcedBoxModel && !Ext.isIE) {
+            Ext.isForcedBorderBox = true;
+            cls.push("ext-forced-border-box");
+        }
+        
+        Ext.fly(bd, '_internal').addClass(cls);
+        return true;
+    };
+    
+    if (!initExtCss()) {
+        Ext.onReady(initExtCss);
+    }
+})();
+
+/**
+ * Code used to detect certain browser feature/quirks/bugs at startup.
+ */
+(function(){
+    var supports = Ext.apply(Ext.supports, {
+        /**
+         * In Webkit, there is an issue with getting the margin right property, see
+         * https://bugs.webkit.org/show_bug.cgi?id=13343
+         */
+        correctRightMargin: true,
+        
+        /**
+         * Webkit browsers return rgba(0, 0, 0) when a transparent color is used
+         */
+        correctTransparentColor: true,
+        
+        /**
+         * IE uses styleFloat, not cssFloat for the float property.
+         */
+        cssFloat: true
+    });
+    
+    var supportTests = function(){
+            var div = document.createElement('div'),
+                doc = document,
+                view,
+                last;
+                
+            div.innerHTML = '<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';
+            doc.body.appendChild(div);
+            last = div.lastChild;
+            
+            if((view = doc.defaultView)){
+                if(view.getComputedStyle(div.firstChild.firstChild, null).marginRight != '0px'){
+                    supports.correctRightMargin = false;
+                }
+                if(view.getComputedStyle(last, null).backgroundColor != 'transparent'){
+                    supports.correctTransparentColor = false;
+                }
+            }
+            supports.cssFloat = !!last.style.cssFloat;
+            doc.body.removeChild(div);
+    };
+    
+    if (Ext.isReady) {
+        supportTests();    
+    } else {
+        Ext.onReady(supportTests);
+    }
+})();
+
+
+/**
+ * @class Ext.EventObject
+ * Just as {@link Ext.Element} wraps around a native DOM node, Ext.EventObject
+ * wraps the browser's native event-object normalizing cross-browser differences,
+ * such as which mouse button is clicked, keys pressed, mechanisms to stop
+ * event-propagation along with a method to prevent default actions from taking place.
+ * <p>For example:</p>
+ * <pre><code>
+function handleClick(e, t){ // e is not a standard event object, it is a Ext.EventObject
+    e.preventDefault();
+    var target = e.getTarget(); // same as t (the target HTMLElement)
+    ...
+}
+var myDiv = {@link Ext#get Ext.get}("myDiv");  // get reference to an {@link Ext.Element}
+myDiv.on(         // 'on' is shorthand for addListener
+    "click",      // perform an action on click of myDiv
+    handleClick   // reference to the action handler
+);
+// other methods to do the same:
+Ext.EventManager.on("myDiv", 'click', handleClick);
+Ext.EventManager.addListener("myDiv", 'click', handleClick);
+ </code></pre>
+ * @singleton
+ */
+Ext.EventObject = function(){
+    var E = Ext.lib.Event,
+        clickRe = /(dbl)?click/,
+        // safari keypress events for special keys return bad keycodes
+        safariKeys = {
+            3 : 13, // enter
+            63234 : 37, // left
+            63235 : 39, // right
+            63232 : 38, // up
+            63233 : 40, // down
+            63276 : 33, // page up
+            63277 : 34, // page down
+            63272 : 46, // delete
+            63273 : 36, // home
+            63275 : 35  // end
+        },
+        // normalize button clicks
+        btnMap = Ext.isIE ? {1:0,4:1,2:2} : {0:0,1:1,2:2};
+
+    Ext.EventObjectImpl = function(e){
+        if(e){
+            this.setEvent(e.browserEvent || e);
+        }
+    };
+
+    Ext.EventObjectImpl.prototype = {
+           /** @private */
+        setEvent : function(e){
+            var me = this;
+            if(e == me || (e && e.browserEvent)){ // already wrapped
+                return e;
+            }
+            me.browserEvent = e;
+            if(e){
+                // normalize buttons
+                me.button = e.button ? btnMap[e.button] : (e.which ? e.which - 1 : -1);
+                if(clickRe.test(e.type) && me.button == -1){
+                    me.button = 0;
+                }
+                me.type = e.type;
+                me.shiftKey = e.shiftKey;
+                // mac metaKey behaves like ctrlKey
+                me.ctrlKey = e.ctrlKey || e.metaKey || false;
+                me.altKey = e.altKey;
+                // in getKey these will be normalized for the mac
+                me.keyCode = e.keyCode;
+                me.charCode = e.charCode;
+                // cache the target for the delayed and or buffered events
+                me.target = E.getTarget(e);
+                // same for XY
+                me.xy = E.getXY(e);
+            }else{
+                me.button = -1;
+                me.shiftKey = false;
+                me.ctrlKey = false;
+                me.altKey = false;
+                me.keyCode = 0;
+                me.charCode = 0;
+                me.target = null;
+                me.xy = [0, 0];
+            }
+            return me;
+        },
+
+        /**
+         * Stop the event (preventDefault and stopPropagation)
+         */
+        stopEvent : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopEvent(me.browserEvent);
+            }
+        },
+
+        /**
+         * Prevents the browsers default handling of the event.
+         */
+        preventDefault : function(){
+            if(this.browserEvent){
+                E.preventDefault(this.browserEvent);
+            }
+        },
+
+        /**
+         * Cancels bubbling of the event.
+         */
+        stopPropagation : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopPropagation(me.browserEvent);
+            }
+        },
+
+        /**
+         * Gets the character code for the event.
+         * @return {Number}
+         */
+        getCharCode : function(){
+            return this.charCode || this.keyCode;
+        },
+
+        /**
+         * Returns a normalized keyCode for the event.
+         * @return {Number} The key code
+         */
+        getKey : function(){
+            return this.normalizeKey(this.keyCode || this.charCode);
+        },
+
+        // private
+        normalizeKey: function(k){
+            return Ext.isSafari ? (safariKeys[k] || k) : k;
+        },
+
+        /**
+         * Gets the x coordinate of the event.
+         * @return {Number}
+         */
+        getPageX : function(){
+            return this.xy[0];
+        },
+
+        /**
+         * Gets the y coordinate of the event.
+         * @return {Number}
+         */
+        getPageY : function(){
+            return this.xy[1];
+        },
+
+        /**
+         * Gets the page coordinates of the event.
+         * @return {Array} The xy values like [x, y]
+         */
+        getXY : function(){
+            return this.xy;
+        },
+
+        /**
+         * Gets the target for the event.
+         * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
+         * @param {Number/Mixed} maxDepth (optional) The max depth to
+                search as a number or element (defaults to 10 || document.body)
+         * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+         * @return {HTMLelement}
+         */
+        getTarget : function(selector, maxDepth, returnEl){
+            return selector ? Ext.fly(this.target).findParent(selector, maxDepth, returnEl) : (returnEl ? Ext.get(this.target) : this.target);
+        },
+
+        /**
+         * Gets the related target.
+         * @return {HTMLElement}
+         */
+        getRelatedTarget : function(){
+            return this.browserEvent ? E.getRelatedTarget(this.browserEvent) : null;
+        },
+
+        /**
+         * Normalizes mouse wheel delta across browsers
+         * @return {Number} The delta
+         */
+        getWheelDelta : function(){
+            var e = this.browserEvent;
+            var delta = 0;
+            if(e.wheelDelta){ /* IE/Opera. */
+                delta = e.wheelDelta/120;
+            }else if(e.detail){ /* Mozilla case. */
+                delta = -e.detail/3;
+            }
+            return delta;
+        },
+
+        /**
+        * Returns true if the target of this event is a child of el.  Unless the allowEl parameter is set, it will return false if if the target is el.
+        * Example usage:<pre><code>
+        // Handle click on any child of an element
+        Ext.getBody().on('click', function(e){
+            if(e.within('some-el')){
+                alert('Clicked on a child of some-el!');
+            }
+        });
+
+        // Handle click directly on an element, ignoring clicks on child nodes
+        Ext.getBody().on('click', function(e,t){
+            if((t.id == 'some-el') && !e.within(t, true)){
+                alert('Clicked directly on some-el!');
+            }
+        });
+        </code></pre>
+         * @param {Mixed} el The id, DOM element or Ext.Element to check
+         * @param {Boolean} related (optional) true to test if the related target is within el instead of the target
+         * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target
+         * @return {Boolean}
+         */
+        within : function(el, related, allowEl){
+            if(el){
+                var t = this[related ? "getRelatedTarget" : "getTarget"]();
+                return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t));
+            }
+            return false;
+        }
+     };
+
+    return new Ext.EventObjectImpl();
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Fx.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Fx.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Fx.js	(revision 76)
@@ -0,0 +1,1112 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+    // contants
+    var NULL = null,
+        UNDEFINED = undefined,
+        TRUE = true,
+        FALSE = false,
+        SETX = "setX",
+        SETY = "setY",
+        SETXY = "setXY",
+        LEFT = "left",
+        BOTTOM = "bottom",
+        TOP = "top",
+        RIGHT = "right",
+        HEIGHT = "height",
+        WIDTH = "width",
+        POINTS = "points",
+        HIDDEN = "hidden",
+        ABSOLUTE = "absolute",
+        VISIBLE = "visible",
+        MOTION = "motion",
+        POSITION = "position",
+        EASEOUT = "easeOut",
+        /*
+         * Use a light flyweight here since we are using so many callbacks and are always assured a DOM element
+         */
+        flyEl = new Ext.Element.Flyweight(),
+        queues = {},
+        getObject = function(o){
+            return o || {};
+        },
+        fly = function(dom){
+            flyEl.dom = dom;
+            flyEl.id = Ext.id(dom);
+            return flyEl;
+        },
+        /*
+         * Queueing now stored outside of the element due to closure issues
+         */
+        getQueue = function(id){
+            if(!queues[id]){
+                queues[id] = [];
+            }
+            return queues[id];
+        },
+        setQueue = function(id, value){
+            queues[id] = value;
+        };
+        
+//Notifies Element that fx methods are available
+Ext.enableFx = TRUE;
+
+/**
+ * @class Ext.Fx
+ * <p>A class to provide basic animation and visual effects support.  <b>Note:</b> This class is automatically applied
+ * to the {@link Ext.Element} interface when included, so all effects calls should be performed via {@link Ext.Element}.
+ * Conversely, since the effects are not actually defined in {@link Ext.Element}, Ext.Fx <b>must</b> be
+ * {@link Ext#enableFx included} in order for the Element effects to work.</p><br/>
+ * 
+ * <p><b><u>Method Chaining</u></b></p>
+ * <p>It is important to note that although the Fx methods and many non-Fx Element methods support "method chaining" in that
+ * they return the Element object itself as the method return value, it is not always possible to mix the two in a single
+ * method chain.  The Fx methods use an internal effects queue so that each effect can be properly timed and sequenced.
+ * Non-Fx methods, on the other hand, have no such internal queueing and will always execute immediately.  For this reason,
+ * while it may be possible to mix certain Fx and non-Fx method calls in a single chain, it may not always provide the
+ * expected results and should be done with care.  Also see <tt>{@link #callback}</tt>.</p><br/>
+ *
+ * <p><b><u>Anchor Options for Motion Effects</u></b></p>
+ * <p>Motion effects support 8-way anchoring, meaning that you can choose one of 8 different anchor points on the Element
+ * that will serve as either the start or end point of the animation.  Following are all of the supported anchor positions:</p>
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+ * <b>Note</b>: some Fx methods accept specific custom config parameters.  The options shown in the Config Options
+ * section below are common options that can be passed to any Fx method unless otherwise noted.</b>
+ * 
+ * @cfg {Function} callback A function called when the effect is finished.  Note that effects are queued internally by the
+ * Fx class, so a callback is not required to specify another effect -- effects can simply be chained together
+ * and called in sequence (see note for <b><u>Method Chaining</u></b> above), for example:<pre><code>
+ * el.slideIn().highlight();
+ * </code></pre>
+ * The callback is intended for any additional code that should run once a particular effect has completed. The Element
+ * being operated upon is passed as the first parameter.
+ * 
+ * @cfg {Object} scope The scope (<code>this</code> reference) in which the <tt>{@link #callback}</tt> function is executed. Defaults to the browser window.
+ * 
+ * @cfg {String} easing A valid Ext.lib.Easing value for the effect:</p><div class="mdetail-params"><ul>
+ * <li><b><tt>backBoth</tt></b></li>
+ * <li><b><tt>backIn</tt></b></li>
+ * <li><b><tt>backOut</tt></b></li>
+ * <li><b><tt>bounceBoth</tt></b></li>
+ * <li><b><tt>bounceIn</tt></b></li>
+ * <li><b><tt>bounceOut</tt></b></li>
+ * <li><b><tt>easeBoth</tt></b></li>
+ * <li><b><tt>easeBothStrong</tt></b></li>
+ * <li><b><tt>easeIn</tt></b></li>
+ * <li><b><tt>easeInStrong</tt></b></li>
+ * <li><b><tt>easeNone</tt></b></li>
+ * <li><b><tt>easeOut</tt></b></li>
+ * <li><b><tt>easeOutStrong</tt></b></li>
+ * <li><b><tt>elasticBoth</tt></b></li>
+ * <li><b><tt>elasticIn</tt></b></li>
+ * <li><b><tt>elasticOut</tt></b></li>
+ * </ul></div>
+ *
+ * @cfg {String} afterCls A css class to apply after the effect
+ * @cfg {Number} duration The length of time (in seconds) that the effect should last
+ * 
+ * @cfg {Number} endOpacity Only applicable for {@link #fadeIn} or {@link #fadeOut}, a number between
+ * <tt>0</tt> and <tt>1</tt> inclusive to configure the ending opacity value.
+ *  
+ * @cfg {Boolean} remove Whether the Element should be removed from the DOM and destroyed after the effect finishes
+ * @cfg {Boolean} useDisplay Whether to use the <i>display</i> CSS property instead of <i>visibility</i> when hiding Elements (only applies to 
+ * effects that end with the element being visually hidden, ignored otherwise)
+ * @cfg {String/Object/Function} afterStyle A style specification string, e.g. <tt>"width:100px"</tt>, or an object
+ * in the form <tt>{width:"100px"}</tt>, or a function which returns such a specification that will be applied to the
+ * Element after the effect finishes.
+ * @cfg {Boolean} block Whether the effect should block other effects from queueing while it runs
+ * @cfg {Boolean} concurrent Whether to allow subsequently-queued effects to run at the same time as the current effect, or to ensure that they run in sequence
+ * @cfg {Boolean} stopFx Whether preceding effects should be stopped and removed before running current effect (only applies to non blocking effects)
+ */
+Ext.Fx = {
+    
+    // private - calls the function taking arguments from the argHash based on the key.  Returns the return value of the function.
+    //           this is useful for replacing switch statements (for example).
+    switchStatements : function(key, fn, argHash){
+        return fn.apply(this, argHash[key]);
+    },
+    
+    /**
+     * Slides the element into view.  An anchor point can be optionally passed to set the point of
+     * origin for the slide effect.  This function automatically handles wrapping the element with
+     * a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element in from the top
+el.slideIn();
+
+// custom: slide the element in from the right with a 2-second duration
+el.slideIn('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideIn('t', {
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideIn : function(anchor, o){ 
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy,
+            r,
+            b,              
+            wrap,               
+            after,
+            st,
+            args, 
+            pt,
+            bw,
+            bh;
+            
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){            
+            xy = fly(dom).getXY();
+            // fix display to visibility
+            fly(dom).fixDisplay();            
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore();      
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+            
+            // fixed size for slide
+            fly(dom).setWidth(b.width).setHeight(b.height);            
+            
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, HIDDEN);
+            
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            
+            // clear out temp styles after slide and unwrap
+            function after(){
+                 fly(dom).fxUnwrap(wrap, r.pos, o);
+                 st.width = r.width;
+                 st.height = r.height;
+                 fly(dom).afterFx(o);
+            }
+            
+            // time to calculate the positions        
+            pt = {to: [b.x, b.y]}; 
+            bw = {to: b.width};
+            bh = {to: b.height};
+                
+            function argCalc(wrap, style, ww, wh, sXY, sXYval, s1, s2, w, h, p){                    
+                var ret = {};
+                fly(wrap).setWidth(ww).setHeight(wh);
+                if(fly(wrap)[sXY]){
+                    fly(wrap)[sXY](sXYval);                  
+                }
+                style[s1] = style[s2] = "0";                    
+                if(w){
+                    ret.width = w;
+                }
+                if(h){
+                    ret.height = h;
+                }
+                if(p){
+                    ret.points = p;
+                }
+                return ret;
+            };
+
+            args = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                    t  : [wrap, st, b.width, 0, NULL, NULL, LEFT, BOTTOM, NULL, bh, NULL],
+                    l  : [wrap, st, 0, b.height, NULL, NULL, RIGHT, TOP, bw, NULL, NULL],
+                    r  : [wrap, st, b.width, b.height, SETX, b.right, LEFT, TOP, NULL, NULL, pt],
+                    b  : [wrap, st, b.width, b.height, SETY, b.bottom, LEFT, TOP, NULL, bh, pt],
+                    tl : [wrap, st, 0, 0, NULL, NULL, RIGHT, BOTTOM, bw, bh, pt],
+                    bl : [wrap, st, 0, 0, SETY, b.y + b.height, RIGHT, TOP, bw, bh, pt],
+                    br : [wrap, st, 0, 0, SETXY, [b.right, b.bottom], LEFT, TOP, bw, bh, pt],
+                    tr : [wrap, st, 0, 0, SETX, b.x + b.width, LEFT, BOTTOM, bw, bh, pt]
+                });
+            
+            st.visibility = VISIBLE;
+            fly(wrap).show();
+
+            arguments.callee.anim = fly(wrap).fxanim(args,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+    
+    /**
+     * Slides the element out of view.  An anchor point can be optionally passed to set the end point
+     * for the slide effect.  When the effect is completed, the element will be hidden (visibility = 
+     * 'hidden') but block elements will still take up space in the document.  The element must be removed
+     * from the DOM using the 'remove' config option if desired.  This function automatically handles 
+     * wrapping the element with a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element out to the top
+el.slideOut();
+
+// custom: slide the element out to the right with a 2-second duration
+el.slideOut('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideOut('t', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideOut : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy = me.getXY(),
+            wrap,
+            r,
+            b,
+            a,
+            zero = {to: 0}; 
+                    
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore(); 
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+                
+            // fixed size for slide   
+            fly(dom).setWidth(b.width).setHeight(b.height);
+
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, VISIBLE);
+                
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            fly(wrap).setWidth(b.width).setHeight(b.height);            
+
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                
+                fly(dom).fxUnwrap(wrap, r.pos, o);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }            
+            
+            function argCalc(style, s1, s2, p1, v1, p2, v2, p3, v3){                    
+                var ret = {};
+                
+                style[s1] = style[s2] = "0";
+                ret[p1] = v1;               
+                if(p2){
+                    ret[p2] = v2;               
+                }
+                if(p3){
+                    ret[p3] = v3;
+                }
+                
+                return ret;
+            };
+            
+            a = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                t  : [st, LEFT, BOTTOM, HEIGHT, zero],
+                l  : [st, RIGHT, TOP, WIDTH, zero],
+                r  : [st, LEFT, TOP, WIDTH, zero, POINTS, {to : [b.right, b.y]}],
+                b  : [st, LEFT, TOP, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                tl : [st, RIGHT, BOTTOM, WIDTH, zero, HEIGHT, zero],
+                bl : [st, RIGHT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                br : [st, LEFT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x + b.width, b.bottom]}],
+                tr : [st, LEFT, BOTTOM, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.right, b.y]}]
+            });
+            
+            arguments.callee.anim = fly(wrap).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+
+    /**
+     * Fades the element out while slowly expanding it in all directions.  When the effect is completed, the 
+     * element will be hidden (visibility = 'hidden') but block elements will still take up space in the document. 
+     * The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.puff();
+
+// common config options shown with default values
+el.puff({
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    puff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            width,
+            height,
+            r;
+
+        me.queueFx(o, function(){
+            width = fly(dom).getWidth();
+            height = fly(dom).getHeight();
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();                   
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                  
+                fly(dom).clearOpacity();  
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                st.fontSize = '';
+                fly(dom).afterFx(o);
+            }   
+
+            arguments.callee.anim = fly(dom).fxanim({
+                    width : {to : fly(dom).adjustWidth(width * 2)},
+                    height : {to : fly(dom).adjustHeight(height * 2)},
+                    points : {by : [-width * .5, -height * .5]},
+                    opacity : {to : 0},
+                    fontSize: {to : 200, unit: "%"}
+                },
+                o,
+                MOTION,
+                .5,
+                EASEOUT,
+                 after);
+        });
+        return me;
+    },
+
+    /**
+     * Blinks the element as if it was clicked and then collapses on its center (similar to switching off a television).
+     * When the effect is completed, the element will be hidden (visibility = 'hidden') but block elements will still 
+     * take up space in the document. The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.switchOff();
+
+// all config options shown with default values
+el.switchOff({
+    easing: 'easeIn',
+    duration: .3,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    switchOff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            r;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).clip();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+                
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();  
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;   
+                fly(dom).afterFx(o);
+            };
+
+            fly(dom).fxanim({opacity : {to : 0.3}}, 
+                NULL, 
+                NULL, 
+                .1, 
+                NULL, 
+                function(){                                 
+                    fly(dom).clearOpacity();
+                        (function(){                            
+                            fly(dom).fxanim({
+                                height : {to : 1},
+                                points : {by : [0, fly(dom).getHeight() * .5]}
+                            }, 
+                            o, 
+                            MOTION, 
+                            0.3, 
+                            'easeIn', 
+                            after);
+                        }).defer(100);
+                });
+        });
+        return me;
+    },
+
+    /**
+     * Highlights the Element by setting a color (applies to the background-color by default, but can be
+     * changed using the "attr" config option) and then fading back to the original color. If no original
+     * color is available, you should provide the "endColor" config option which will be cleared after the animation.
+     * Usage:
+<pre><code>
+// default: highlight background to yellow
+el.highlight();
+
+// custom: highlight foreground text to blue for 2 seconds
+el.highlight("0000ff", { attr: 'color', duration: 2 });
+
+// common config options shown with default values
+el.highlight("ffff9c", {
+    attr: "background-color", //can be any valid CSS property (attribute) that supports a color value
+    endColor: (current color) or "ffffff",
+    easing: 'easeIn',
+    duration: 1
+});
+</code></pre>
+     * @param {String} color (optional) The highlight color. Should be a 6 char hex color without the leading # (defaults to yellow: 'ffff9c')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */ 
+    highlight : function(color, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            attr = o.attr || "backgroundColor",
+            a = {},
+            restore;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            function after(){
+                dom.style[attr] = restore;
+                fly(dom).afterFx(o);
+            }            
+            restore = dom.style[attr];
+            a[attr] = {from: color || "ffff9c", to: o.endColor || fly(dom).getColor(attr) || "ffffff"};
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                'color',
+                1,
+                'easeIn', 
+                after);
+        });
+        return me;
+    },
+
+   /**
+    * Shows a ripple of exploding, attenuating borders to draw attention to an Element.
+    * Usage:
+<pre><code>
+// default: a single light blue ripple
+el.frame();
+
+// custom: 3 red ripples lasting 3 seconds total
+el.frame("ff0000", 3, { duration: 3 });
+
+// common config options shown with default values
+el.frame("C3DAF9", 1, {
+    duration: 1 //duration of each individual ripple.
+    // Note: Easing is not configurable and will be ignored if included
+});
+</code></pre>
+    * @param {String} color (optional) The color of the border.  Should be a 6 char hex color without the leading # (defaults to light blue: 'C3DAF9').
+    * @param {Number} count (optional) The number of ripples to display (defaults to 1)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    frame : function(color, count, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            proxy,
+            active;
+
+        me.queueFx(o, function(){
+            color = color || '#C3DAF9';
+            if(color.length == 6){
+                color = '#' + color;
+            }            
+            count = count || 1;
+            fly(dom).show();
+
+            var xy = fly(dom).getXY(),
+                b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight},
+                queue = function(){
+                    proxy = fly(document.body || document.documentElement).createChild({
+                        style:{
+                            position : ABSOLUTE,
+                            'z-index': 35000, // yee haw
+                            border : '0px solid ' + color
+                        }
+                    });
+                    return proxy.queueFx({}, animFn);
+                };
+            
+            
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function() {
+                    count = 0;
+                    proxy.stopFx();
+                }
+            };
+            
+            function animFn(){
+                var scale = Ext.isBorderBox ? 2 : 1;
+                active = proxy.anim({
+                    top : {from : b.y, to : b.y - 20},
+                    left : {from : b.x, to : b.x - 20},
+                    borderWidth : {from : 0, to : 10},
+                    opacity : {from : 1, to : 0},
+                    height : {from : b.height, to : b.height + 20 * scale},
+                    width : {from : b.width, to : b.width + 20 * scale}
+                },{
+                    duration: o.duration || 1,
+                    callback: function() {
+                        proxy.remove();
+                        --count > 0 ? queue() : fly(dom).afterFx(o);
+                    }
+                });
+                arguments.callee.anim = {
+                    isAnimated: true,
+                    stop: function(){
+                        active.stop();
+                    }
+                };
+            };
+            queue();
+        });
+        return me;
+    },
+
+   /**
+    * Creates a pause before any subsequent queued effects begin.  If there are
+    * no effects queued after the pause it will have no effect.
+    * Usage:
+<pre><code>
+el.pause(1);
+</code></pre>
+    * @param {Number} seconds The length of time to pause (in seconds)
+    * @return {Ext.Element} The Element
+    */
+    pause : function(seconds){        
+        var dom = this.dom,
+            t;
+
+        this.queueFx({}, function(){
+            t = setTimeout(function(){
+                fly(dom).afterFx({});
+            }, seconds * 1000);
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function(){
+                    clearTimeout(t);
+                    fly(dom).afterFx({});
+                }
+            };
+        });
+        return this;
+    },
+
+   /**
+    * Fade an element in (from transparent to opaque).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.
+    * Usage:
+<pre><code>
+// default: fade in from opacity 0 to 100%
+el.fadeIn();
+
+// custom: fade in from opacity 0 to 75% over 2 seconds
+el.fadeIn({ endOpacity: .75, duration: 2});
+
+// common config options shown with default values
+el.fadeIn({
+    endOpacity: 1, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeIn : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            to = o.endOpacity || 1;
+        
+        me.queueFx(o, function(){
+            fly(dom).setOpacity(0);
+            fly(dom).fixDisplay();
+            dom.style.visibility = VISIBLE;
+            arguments.callee.anim = fly(dom).fxanim({opacity:{to:to}},
+                o, NULL, .5, EASEOUT, function(){
+                if(to == 1){
+                    fly(dom).clearOpacity();
+                }
+                fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Fade an element out (from opaque to transparent).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.  Note that IE may require
+    * <tt>{@link #useDisplay}:true</tt> in order to redisplay correctly.
+    * Usage:
+<pre><code>
+// default: fade out from the element's current opacity to 0
+el.fadeOut();
+
+// custom: fade out from the element's current opacity to 25% over 2 seconds
+el.fadeOut({ endOpacity: .25, duration: 2});
+
+// common config options shown with default values
+el.fadeOut({
+    endOpacity: 0, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeOut : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            style = dom.style,
+            to = o.endOpacity || 0;         
+        
+        me.queueFx(o, function(){  
+            arguments.callee.anim = fly(dom).fxanim({ 
+                opacity : {to : to}},
+                o, 
+                NULL, 
+                .5, 
+                EASEOUT, 
+                function(){
+                    if(to == 0){
+                        Ext.Element.data(dom, 'visibilityMode') == Ext.Element.DISPLAY || o.useDisplay ? 
+                            style.display = "none" :
+                            style.visibility = HIDDEN;
+                            
+                        fly(dom).clearOpacity();
+                    }
+                    fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Animates the transition of an element's dimensions from a starting height/width
+    * to an ending height/width.  This method is a convenience implementation of {@link shift}.
+    * Usage:
+<pre><code>
+// change height and width to 100x100 pixels
+el.scale(100, 100);
+
+// common config options shown with default values.  The height and width will default to
+// the element&#39;s existing values if passed as null.
+el.scale(
+    [element&#39;s width],
+    [element&#39;s height], {
+        easing: 'easeOut',
+        duration: .35
+    }
+);
+</code></pre>
+    * @param {Number} width  The new width (pass undefined to keep the original width)
+    * @param {Number} height  The new height (pass undefined to keep the original height)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    scale : function(w, h, o){
+        this.shift(Ext.apply({}, o, {
+            width: w,
+            height: h
+        }));
+        return this;
+    },
+
+   /**
+    * Animates the transition of any combination of an element's dimensions, xy position and/or opacity.
+    * Any of these properties not specified in the config object will not be changed.  This effect 
+    * requires that at least one new dimension, position or opacity setting must be passed in on
+    * the config object in order for the function to have any effect.
+    * Usage:
+<pre><code>
+// slide the element horizontally to x position 200 while changing the height and opacity
+el.shift({ x: 200, height: 50, opacity: .8 });
+
+// common config options shown with default values.
+el.shift({
+    width: [element&#39;s width],
+    height: [element&#39;s height],
+    x: [element&#39;s x position],
+    y: [element&#39;s y position],
+    opacity: [element&#39;s opacity],
+    easing: 'easeOut',
+    duration: .35
+});
+</code></pre>
+    * @param {Object} options  Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    shift : function(o){
+        o = getObject(o);
+        var dom = this.dom,
+            a = {};
+                
+        this.queueFx(o, function(){
+            for (var prop in o) {
+                if (o[prop] != UNDEFINED) {                                                 
+                    a[prop] = {to : o[prop]};                   
+                }
+            } 
+            
+            a.width ? a.width.to = fly(dom).adjustWidth(o.width) : a;
+            a.height ? a.height.to = fly(dom).adjustWidth(o.height) : a;   
+            
+            if (a.x || a.y || a.xy) {
+                a.points = a.xy || 
+                           {to : [ a.x ? a.x.to : fly(dom).getX(),
+                                   a.y ? a.y.to : fly(dom).getY()]};                  
+            }
+
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o, 
+                MOTION, 
+                .35, 
+                EASEOUT, 
+                function(){
+                    fly(dom).afterFx(o);
+                });
+        });
+        return this;
+    },
+
+    /**
+     * Slides the element while fading it out of view.  An anchor point can be optionally passed to set the 
+     * ending point of the effect.
+     * Usage:
+     *<pre><code>
+// default: slide the element downward while fading out
+el.ghost();
+
+// custom: slide the element out to the right with a 2-second duration
+el.ghost('r', { duration: 2 });
+
+// common config options shown with default values
+el.ghost('b', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to bottom: 'b')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    ghost : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            a = {opacity: {to: 0}, points: {}},
+            pt = a.points,
+            r,
+            w,
+            h;
+            
+        anchor = anchor || "b";
+
+        me.queueFx(o, function(){
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+            w = fly(dom).getWidth();
+            h = fly(dom).getHeight();
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();   
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }
+                
+            pt.by = fly(dom).switchStatements(anchor.toLowerCase(), function(v1,v2){ return [v1, v2];}, {
+               t  : [0, -h],
+               l  : [-w, 0],
+               r  : [w, 0],
+               b  : [0, h],
+               tl : [-w, -h],
+               bl : [-w, h],
+               br : [w, h],
+               tr : [w, -h] 
+            });
+                
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, after);
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after syncFx is called on the element are
+     * run concurrently.  This is the opposite of {@link #sequenceFx}.
+     * @return {Ext.Element} The Element
+     */
+    syncFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : TRUE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after sequenceFx is called on the element are
+     * run in sequence.  This is the opposite of {@link #syncFx}.
+     * @return {Ext.Element} The Element
+     */
+    sequenceFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : FALSE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /* @private */
+    nextFx : function(){        
+        var ef = getQueue(this.dom.id)[0];
+        if(ef){
+            ef.call(this);
+        }
+    },
+
+    /**
+     * Returns true if the element has any effects actively running or queued, else returns false.
+     * @return {Boolean} True if element has active effects, else false
+     */
+    hasActiveFx : function(){
+        return getQueue(this.dom.id)[0];
+    },
+
+    /**
+     * Stops any running effects and clears the element's internal effects queue if it contains
+     * any additional effects that haven't started yet.
+     * @return {Ext.Element} The Element
+     */
+    stopFx : function(finish){
+        var me = this,
+            id = me.dom.id;
+        if(me.hasActiveFx()){
+            var cur = getQueue(id)[0];
+            if(cur && cur.anim){
+                if(cur.anim.isAnimated){
+                    setQueue(id, [cur]); //clear
+                    cur.anim.stop(finish !== undefined ? finish : TRUE);
+                }else{
+                    setQueue(id, []);
+                }
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    beforeFx : function(o){
+        if(this.hasActiveFx() && !o.concurrent){
+           if(o.stopFx){
+               this.stopFx();
+               return TRUE;
+           }
+           return FALSE;
+        }
+        return TRUE;
+    },
+
+    /**
+     * Returns true if the element is currently blocking so that no other effect can be queued
+     * until this effect is finished, else returns false if blocking is not set.  This is commonly
+     * used to ensure that an effect initiated by a user action runs to completion prior to the
+     * same effect being restarted (e.g., firing only one effect even if the user clicks several times).
+     * @return {Boolean} True if blocking, else false
+     */
+    hasFxBlock : function(){
+        var q = getQueue(this.dom.id);
+        return q && q[0] && q[0].block;
+    },
+
+    /* @private */
+    queueFx : function(o, fn){
+        var me = fly(this.dom);
+        if(!me.hasFxBlock()){
+            Ext.applyIf(o, me.fxDefaults);
+            if(!o.concurrent){
+                var run = me.beforeFx(o);
+                fn.block = o.block;
+                getQueue(me.dom.id).push(fn);
+                if(run){
+                    me.nextFx();
+                }
+            }else{
+                fn.call(me);
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    fxWrap : function(pos, o, vis){ 
+        var dom = this.dom,
+            wrap,
+            wrapXY;
+        if(!o.wrap || !(wrap = Ext.getDom(o.wrap))){            
+            if(o.fixPosition){
+                wrapXY = fly(dom).getXY();
+            }
+            var div = document.createElement("div");
+            div.style.visibility = vis;
+            wrap = dom.parentNode.insertBefore(div, dom);
+            fly(wrap).setPositioning(pos);
+            if(fly(wrap).isStyle(POSITION, "static")){
+                fly(wrap).position("relative");
+            }
+            fly(dom).clearPositioning('auto');
+            fly(wrap).clip();
+            wrap.appendChild(dom);
+            if(wrapXY){
+                fly(wrap).setXY(wrapXY);
+            }
+        }
+        return wrap;
+    },
+
+    /* @private */
+    fxUnwrap : function(wrap, pos, o){      
+        var dom = this.dom;
+        fly(dom).clearPositioning();
+        fly(dom).setPositioning(pos);
+        if(!o.wrap){
+            var pn = fly(wrap).dom.parentNode;
+            pn.insertBefore(dom, wrap); 
+            fly(wrap).remove();
+        }
+    },
+
+    /* @private */
+    getFxRestore : function(){
+        var st = this.dom.style;
+        return {pos: this.getPositioning(), width: st.width, height : st.height};
+    },
+
+    /* @private */
+    afterFx : function(o){
+        var dom = this.dom,
+            id = dom.id;
+        if(o.afterStyle){
+            fly(dom).setStyle(o.afterStyle);            
+        }
+        if(o.afterCls){
+            fly(dom).addClass(o.afterCls);
+        }
+        if(o.remove == TRUE){
+            fly(dom).remove();
+        }
+        if(o.callback){
+            o.callback.call(o.scope, fly(dom));
+        }
+        if(!o.concurrent){
+            getQueue(id).shift();
+            fly(dom).nextFx();
+        }
+    },
+
+    /* @private */
+    fxanim : function(args, opt, animType, defaultDur, defaultEase, cb){
+        animType = animType || 'run';
+        opt = opt || {};
+        var anim = Ext.lib.Anim[animType](
+                this.dom, 
+                args,
+                (opt.duration || defaultDur) || .35,
+                (opt.easing || defaultEase) || EASEOUT,
+                cb,            
+                this
+            );
+        opt.anim = anim;
+        return anim;
+    }
+};
+
+// backwards compat
+Ext.Fx.resize = Ext.Fx.scale;
+
+//When included, Ext.Fx is automatically applied to Element so that all basic
+//effects are available directly via the Element API
+Ext.Element.addMethods(Ext.Fx);
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomHelper.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomHelper.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/DomHelper.js	(revision 76)
@@ -0,0 +1,455 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.DomHelper
+ * <p>The DomHelper class provides a layer of abstraction from DOM and transparently supports creating
+ * elements via DOM or using HTML fragments. It also has the ability to create HTML fragment templates
+ * from your DOM building code.</p>
+ *
+ * <p><b><u>DomHelper element specification object</u></b></p>
+ * <p>A specification object is used when creating elements. Attributes of this object
+ * are assumed to be element attributes, except for 4 special attributes:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>tag</tt></b> : <div class="sub-desc">The tag name of the element</div></li>
+ * <li><b><tt>children</tt></b> : or <tt>cn</tt><div class="sub-desc">An array of the
+ * same kind of element definition objects to be created and appended. These can be nested
+ * as deep as you want.</div></li>
+ * <li><b><tt>cls</tt></b> : <div class="sub-desc">The class attribute of the element.
+ * This will end up being either the "class" attribute on a HTML fragment or className
+ * for a DOM node, depending on whether DomHelper is using fragments or DOM.</div></li>
+ * <li><b><tt>html</tt></b> : <div class="sub-desc">The innerHTML for the element</div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Insertion methods</u></b></p>
+ * <p>Commonly used insertion methods:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #append}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertBefore}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertAfter}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #overwrite}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #createTemplate}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertHtml}</tt></b> : <div class="sub-desc"></div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Example</u></b></p>
+ * <p>This is an example, where an unordered list with 3 children items is appended to an existing
+ * element with id <tt>'my-div'</tt>:<br>
+ <pre><code>
+var dh = Ext.DomHelper; // create shorthand alias
+// specification object
+var spec = {
+    id: 'my-ul',
+    tag: 'ul',
+    cls: 'my-list',
+    // append children after creating
+    children: [     // may also specify 'cn' instead of 'children'
+        {tag: 'li', id: 'item0', html: 'List Item 0'},
+        {tag: 'li', id: 'item1', html: 'List Item 1'},
+        {tag: 'li', id: 'item2', html: 'List Item 2'}
+    ]
+};
+var list = dh.append(
+    'my-div', // the context element 'my-div' can either be the id or the actual node
+    spec      // the specification object
+);
+ </code></pre></p>
+ * <p>Element creation specification parameters in this class may also be passed as an Array of
+ * specification objects. This can be used to insert multiple sibling nodes into an existing
+ * container very efficiently. For example, to add more list items to the example above:<pre><code>
+dh.append('my-ul', [
+    {tag: 'li', id: 'item3', html: 'List Item 3'},
+    {tag: 'li', id: 'item4', html: 'List Item 4'}
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Templating</u></b></p>
+ * <p>The real power is in the built-in templating. Instead of creating or appending any elements,
+ * <tt>{@link #createTemplate}</tt> returns a Template object which can be used over and over to
+ * insert new elements. Revisiting the example above, we could utilize templating this time:
+ * <pre><code>
+// create the node
+var list = dh.append('my-div', {tag: 'ul', cls: 'my-list'});
+// get template
+var tpl = dh.createTemplate({tag: 'li', id: 'item{0}', html: 'List Item {0}'});
+
+for(var i = 0; i < 5, i++){
+    tpl.append(list, [i]); // use template to append to the actual node
+}
+ * </code></pre></p>
+ * <p>An example using a template:<pre><code>
+var html = '<a id="{0}" href="{1}" class="nav">{2}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', ['link1', 'http://www.jackslocum.com/', "Jack&#39;s Site"]);
+tpl.append('blog-roll', ['link2', 'http://www.dustindiaz.com/', "Dustin&#39;s Site"]);
+ * </code></pre></p>
+ *
+ * <p>The same example using named parameters:<pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', {
+    id: 'link1',
+    url: 'http://www.jackslocum.com/',
+    text: "Jack&#39;s Site"
+});
+tpl.append('blog-roll', {
+    id: 'link2',
+    url: 'http://www.dustindiaz.com/',
+    text: "Dustin&#39;s Site"
+});
+ * </code></pre></p>
+ *
+ * <p><b><u>Compiling Templates</u></b></p>
+ * <p>Templates are applied using regular expressions. The performance is great, but if
+ * you are adding a bunch of DOM elements using the same template, you can increase
+ * performance even further by {@link Ext.Template#compile "compiling"} the template.
+ * The way "{@link Ext.Template#compile compile()}" works is the template is parsed and
+ * broken up at the different variable points and a dynamic function is created and eval'ed.
+ * The generated function performs string concatenation of these parts and the passed
+ * variables instead of using regular expressions.
+ * <pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.compile();
+
+//... use template like normal
+ * </code></pre></p>
+ *
+ * <p><b><u>Performance Boost</u></b></p>
+ * <p>DomHelper will transparently create HTML fragments when it can. Using HTML fragments instead
+ * of DOM can significantly boost performance.</p>
+ * <p>Element creation specification parameters may also be strings. If {@link #useDom} is <tt>false</tt>,
+ * then the string is used as innerHTML. If {@link #useDom} is <tt>true</tt>, a string specification
+ * results in the creation of a text node. Usage:</p>
+ * <pre><code>
+Ext.DomHelper.useDom = true; // force it to use DOM; reduces performance
+ * </code></pre>
+ * @singleton
+ */
+Ext.DomHelper = function(){
+    var tempTableEl = null,
+        emptyTags = /^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,
+        tableRe = /^table|tbody|tr|td$/i,
+        confRe = /tag|children|cn|html$/i,
+        tableElRe = /td|tr|tbody/i,
+        cssRe = /([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,
+        endRe = /end/i,
+        pub,
+        // kill repeat to save bytes
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        ts = '<table>',
+        te = '</table>',
+        tbs = ts+'<tbody>',
+        tbe = '</tbody>'+te,
+        trs = tbs + '<tr>',
+        tre = '</tr>'+tbe;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        var newNode = pub.insertHtml(pos, Ext.getDom(el), createHtml(o));
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as innerHTML where available
+    function createHtml(o){
+        var b = '',
+            attr,
+            val,
+            key,
+            cn;
+
+        if(typeof o == "string"){
+            b = o;
+        } else if (Ext.isArray(o)) {
+            for (var i=0; i < o.length; i++) {
+                if(o[i]) {
+                    b += createHtml(o[i]);
+                }
+            };
+        } else {
+            b += '<' + (o.tag = o.tag || 'div');
+            for (attr in o) {
+                val = o[attr];
+                if(!confRe.test(attr)){
+                    if (typeof val == "object") {
+                        b += ' ' + attr + '="';
+                        for (key in val) {
+                            b += key + ':' + val[key] + ';';
+                        };
+                        b += '"';
+                    }else{
+                        b += ' ' + ({cls : 'class', htmlFor : 'for'}[attr] || attr) + '="' + val + '"';
+                    }
+                }
+            };
+            // Now either just close the tag or try to add children and close the tag.
+            if (emptyTags.test(o.tag)) {
+                b += '/>';
+            } else {
+                b += '>';
+                if ((cn = o.children || o.cn)) {
+                    b += createHtml(cn);
+                } else if(o.html){
+                    b += o.html;
+                }
+                b += '</' + o.tag + '>';
+            }
+        }
+        return b;
+    }
+
+    function ieTable(depth, s, h, e){
+        tempTableEl.innerHTML = [s, h, e].join('');
+        var i = -1,
+            el = tempTableEl,
+            ns;
+        while(++i < depth){
+            el = el.firstChild;
+        }
+//      If the result is multiple siblings, then encapsulate them into one fragment.
+        if(ns = el.nextSibling){
+            var df = document.createDocumentFragment();
+            while(el){
+                ns = el.nextSibling;
+                df.appendChild(el);
+                el = ns;
+            }
+            el = df;
+        }
+        return el;
+    }
+
+    /**
+     * @ignore
+     * Nasty code for IE's broken table implementation
+     */
+    function insertIntoTable(tag, where, el, html) {
+        var node,
+            before;
+
+        tempTableEl = tempTableEl || document.createElement('div');
+
+        if(tag == 'td' && (where == afterbegin || where == beforeend) ||
+           !tableElRe.test(tag) && (where == beforebegin || where == afterend)) {
+            return;
+        }
+        before = where == beforebegin ? el :
+                 where == afterend ? el.nextSibling :
+                 where == afterbegin ? el.firstChild : null;
+
+        if (where == beforebegin || where == afterend) {
+            el = el.parentNode;
+        }
+
+        if (tag == 'td' || (tag == 'tr' && (where == beforeend || where == afterbegin))) {
+            node = ieTable(4, trs, html, tre);
+        } else if ((tag == 'tbody' && (where == beforeend || where == afterbegin)) ||
+                   (tag == 'tr' && (where == beforebegin || where == afterend))) {
+            node = ieTable(3, tbs, html, tbe);
+        } else {
+            node = ieTable(2, ts, html, te);
+        }
+        el.insertBefore(node, before);
+        return node;
+    }
+
+    /**
+     * @ignore
+     * Fix for IE9 createContextualFragment missing method
+     */   
+    function createContextualFragment(html){
+        var div = document.createElement("div"),
+            fragment = document.createDocumentFragment(),
+            i = 0,
+            length, childNodes;
+        
+        div.innerHTML = html;
+        childNodes = div.childNodes;
+        length = childNodes.length;
+        
+        for (; i < length; i++) {
+            fragment.appendChild(childNodes[i].cloneNode(true));
+        }
+        
+        return fragment;
+    }
+    
+    pub = {
+        /**
+         * Returns the markup for the passed Element(s) config.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {String}
+         */
+        markup : function(o){
+            return createHtml(o);
+        },
+
+        /**
+         * Applies a style specification to an element.
+         * @param {String/HTMLElement} el The element to apply styles to
+         * @param {String/Object/Function} styles A style specification string e.g. 'width:100px', or object in the form {width:'100px'}, or
+         * a function which returns such a specification.
+         */
+        applyStyles : function(el, styles){
+            if (styles) {
+                var matches;
+
+                el = Ext.fly(el);
+                if (typeof styles == "function") {
+                    styles = styles.call();
+                }
+                if (typeof styles == "string") {
+                    /**
+                     * Since we're using the g flag on the regex, we need to set the lastIndex.
+                     * This automatically happens on some implementations, but not others, see:
+                     * http://stackoverflow.com/questions/2645273/javascript-regular-expression-literal-persists-between-function-calls
+                     * http://blog.stevenlevithan.com/archives/fixing-javascript-regexp
+                     */
+                    cssRe.lastIndex = 0;
+                    while ((matches = cssRe.exec(styles))) {
+                        el.setStyle(matches[1], matches[2]);
+                    }
+                } else if (typeof styles == "object") {
+                    el.setStyle(styles);
+                }
+            }
+        },
+        /**
+         * Inserts an HTML fragment into the DOM.
+         * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+         * @param {HTMLElement} el The context element
+         * @param {String} html The HTML fragment
+         * @return {HTMLElement} The new node
+         */
+        insertHtml : function(where, el, html){
+            var hash = {},
+                hashVal,
+                range,
+                rangeEl,
+                setStart,
+                frag,
+                rs;
+
+            where = where.toLowerCase();
+            // add these here because they are used in both branches of the condition.
+            hash[beforebegin] = ['BeforeBegin', 'previousSibling'];
+            hash[afterend] = ['AfterEnd', 'nextSibling'];
+
+            if (el.insertAdjacentHTML) {
+                if(tableRe.test(el.tagName) && (rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html))){
+                    return rs;
+                }
+                // add these two to the hash.
+                hash[afterbegin] = ['AfterBegin', 'firstChild'];
+                hash[beforeend] = ['BeforeEnd', 'lastChild'];
+                if ((hashVal = hash[where])) {
+                    el.insertAdjacentHTML(hashVal[0], html);
+                    return el[hashVal[1]];
+                }
+            } else {
+                range = el.ownerDocument.createRange();
+                setStart = 'setStart' + (endRe.test(where) ? 'After' : 'Before');
+                if (hash[where]) {
+                    range[setStart](el);
+                    if (!range.createContextualFragment) {
+                        frag = createContextualFragment(html);
+                    }
+                    else {
+                        frag = range.createContextualFragment(html);
+                    }
+                    el.parentNode.insertBefore(frag, where == beforebegin ? el : el.nextSibling);
+                    return el[(where == beforebegin ? 'previous' : 'next') + 'Sibling'];
+                } else {
+                    rangeEl = (where == afterbegin ? 'first' : 'last') + 'Child';
+                    if (el.firstChild) {
+                        range[setStart](el[rangeEl]);
+                        if (!range.createContextualFragment) {
+                            frag = createContextualFragment(html);
+                        }
+                        else {
+                            frag = range.createContextualFragment(html);
+                        }
+                        if(where == afterbegin){
+                            el.insertBefore(frag, el.firstChild);
+                        }else{
+                            el.appendChild(frag);
+                        }
+                    } else {
+                        el.innerHTML = html;
+                    }
+                    return el[rangeEl];
+                }
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        append : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) and overwrites the contents of el with them.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        overwrite : function(el, o, returnElement){
+            el = Ext.getDom(el);
+            el.innerHTML = createHtml(o);
+            return returnElement ? Ext.get(el.firstChild) : el.firstChild;
+        },
+
+        createHtml : createHtml
+    };
+    return pub;
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Ext.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Ext.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Ext.js	(revision 76)
@@ -0,0 +1,1071 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// for old browsers
+window.undefined = window.undefined;
+
+/**
+ * @class Ext
+ * Ext core utilities and functions.
+ * @singleton
+ */
+
+Ext = {
+    /**
+     * The version of the framework
+     * @type String
+     */
+    version : '3.4.0',
+    versionDetail : {
+        major : 3,
+        minor : 4,
+        patch : 0
+    }
+};
+
+/**
+ * Copies all the properties of config to obj.
+ * @param {Object} obj The receiver of the properties
+ * @param {Object} config The source of the properties
+ * @param {Object} defaults A different object that will also be applied for default values
+ * @return {Object} returns obj
+ * @member Ext apply
+ */
+Ext.apply = function(o, c, defaults){
+    // no "this" reference for friendly out of scope calls
+    if(defaults){
+        Ext.apply(o, defaults);
+    }
+    if(o && c && typeof c == 'object'){
+        for(var p in c){
+            o[p] = c[p];
+        }
+    }
+    return o;
+};
+
+(function(){
+    var idSeed = 0,
+        toString = Object.prototype.toString,
+        ua = navigator.userAgent.toLowerCase(),
+        check = function(r){
+            return r.test(ua);
+        },
+        DOC = document,
+        docMode = DOC.documentMode,
+        isStrict = DOC.compatMode == "CSS1Compat",
+        isOpera = check(/opera/),
+        isChrome = check(/\bchrome\b/),
+        isWebKit = check(/webkit/),
+        isSafari = !isChrome && check(/safari/),
+        isSafari2 = isSafari && check(/applewebkit\/4/), // unique to Safari 2
+        isSafari3 = isSafari && check(/version\/3/),
+        isSafari4 = isSafari && check(/version\/4/),
+        isIE = !isOpera && check(/msie/),
+        isIE7 = isIE && (check(/msie 7/) || docMode == 7),
+        isIE8 = isIE && (check(/msie 8/) && docMode != 7),
+        isIE9 = isIE && check(/msie 9/),
+        isIE6 = isIE && !isIE7 && !isIE8 && !isIE9,
+        isGecko = !isWebKit && check(/gecko/),
+        isGecko2 = isGecko && check(/rv:1\.8/),
+        isGecko3 = isGecko && check(/rv:1\.9/),
+        isBorderBox = isIE && !isStrict,
+        isWindows = check(/windows|win32/),
+        isMac = check(/macintosh|mac os x/),
+        isAir = check(/adobeair/),
+        isLinux = check(/linux/),
+        isSecure = /^https/i.test(window.location.protocol);
+
+    // remove css image flicker
+    if(isIE6){
+        try{
+            DOC.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+
+    Ext.apply(Ext, {
+        /**
+         * URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent
+         * the IE insecure content warning (<tt>'about:blank'</tt>, except for IE in secure mode, which is <tt>'javascript:""'</tt>).
+         * @type String
+         */
+        SSL_SECURE_URL : isSecure && isIE ? 'javascript:""' : 'about:blank',
+        /**
+         * True if the browser is in strict (standards-compliant) mode, as opposed to quirks mode
+         * @type Boolean
+         */
+        isStrict : isStrict,
+        /**
+         * True if the page is running over SSL
+         * @type Boolean
+         */
+        isSecure : isSecure,
+        /**
+         * True when the document is fully initialized and ready for action
+         * @type Boolean
+         */
+        isReady : false,
+
+        /**
+         * True if the {@link Ext.Fx} Class is available
+         * @type Boolean
+         * @property enableFx
+         */
+
+        /**
+         * HIGHLY EXPERIMENTAL
+         * True to force css based border-box model override and turning off javascript based adjustments. This is a
+         * runtime configuration and must be set before onReady.
+         * @type Boolean
+         */
+        enableForcedBoxModel : false,
+
+        /**
+         * True to automatically uncache orphaned Ext.Elements periodically (defaults to true)
+         * @type Boolean
+         */
+        enableGarbageCollector : true,
+
+        /**
+         * True to automatically purge event listeners during garbageCollection (defaults to false).
+         * @type Boolean
+         */
+        enableListenerCollection : false,
+
+        /**
+         * EXPERIMENTAL - True to cascade listener removal to child elements when an element is removed.
+         * Currently not optimized for performance.
+         * @type Boolean
+         */
+        enableNestedListenerRemoval : false,
+
+        /**
+         * Indicates whether to use native browser parsing for JSON methods.
+         * This option is ignored if the browser does not support native JSON methods.
+         * <b>Note: Native JSON methods will not work with objects that have functions.
+         * Also, property names must be quoted, otherwise the data will not parse.</b> (Defaults to false)
+         * @type Boolean
+         */
+        USE_NATIVE_JSON : false,
+
+        /**
+         * Copies all the properties of config to obj if they don't already exist.
+         * @param {Object} obj The receiver of the properties
+         * @param {Object} config The source of the properties
+         * @return {Object} returns obj
+         */
+        applyIf : function(o, c){
+            if(o){
+                for(var p in c){
+                    if(!Ext.isDefined(o[p])){
+                        o[p] = c[p];
+                    }
+                }
+            }
+            return o;
+        },
+
+        /**
+         * Generates unique ids. If the element already has an id, it is unchanged
+         * @param {Mixed} el (optional) The element to generate an id for
+         * @param {String} prefix (optional) Id prefix (defaults "ext-gen")
+         * @return {String} The generated Id.
+         */
+        id : function(el, prefix){
+            el = Ext.getDom(el, true) || {};
+            if (!el.id) {
+                el.id = (prefix || "ext-gen") + (++idSeed);
+            }
+            return el.id;
+        },
+
+        /**
+         * <p>Extends one class to create a subclass and optionally overrides members with the passed literal. This method
+         * also adds the function "override()" to the subclass that can be used to override members of the class.</p>
+         * For example, to create a subclass of Ext GridPanel:
+         * <pre><code>
+MyGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    constructor: function(config) {
+
+//      Create configuration for this Grid.
+        var store = new Ext.data.Store({...});
+        var colModel = new Ext.grid.ColumnModel({...});
+
+//      Create a new config object containing our computed properties
+//      *plus* whatever was in the config parameter.
+        config = Ext.apply({
+            store: store,
+            colModel: colModel
+        }, config);
+
+        MyGridPanel.superclass.constructor.call(this, config);
+
+//      Your postprocessing here
+    },
+
+    yourMethod: function() {
+        // etc.
+    }
+});
+</code></pre>
+         *
+         * <p>This function also supports a 3-argument call in which the subclass's constructor is
+         * passed as an argument. In this form, the parameters are as follows:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><code>subclass</code> : Function <div class="sub-desc">The subclass constructor.</div></li>
+         * <li><code>superclass</code> : Function <div class="sub-desc">The constructor of class being extended</div></li>
+         * <li><code>overrides</code> : Object <div class="sub-desc">A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared among all instances of the new class.</div></li>
+         * </ul></div>
+         *
+         * @param {Function} superclass The constructor of class being extended.
+         * @param {Object} overrides <p>A literal with members which are copied into the subclass's
+         * prototype, and are therefore shared between all instances of the new class.</p>
+         * <p>This may contain a special member named <tt><b>constructor</b></tt>. This is used
+         * to define the constructor of the new class, and is returned. If this property is
+         * <i>not</i> specified, a constructor is generated and returned which just calls the
+         * superclass's constructor passing on its parameters.</p>
+         * <p><b>It is essential that you call the superclass constructor in any provided constructor. See example code.</b></p>
+         * @return {Function} The subclass constructor from the <code>overrides</code> parameter, or a generated one if not provided.
+         */
+        extend : function(){
+            // inline overrides
+            var io = function(o){
+                for(var m in o){
+                    this[m] = o[m];
+                }
+            };
+            var oc = Object.prototype.constructor;
+
+            return function(sb, sp, overrides){
+                if(typeof sp == 'object'){
+                    overrides = sp;
+                    sp = sb;
+                    sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
+                }
+                var F = function(){},
+                    sbp,
+                    spp = sp.prototype;
+
+                F.prototype = spp;
+                sbp = sb.prototype = new F();
+                sbp.constructor=sb;
+                sb.superclass=spp;
+                if(spp.constructor == oc){
+                    spp.constructor=sp;
+                }
+                sb.override = function(o){
+                    Ext.override(sb, o);
+                };
+                sbp.superclass = sbp.supr = (function(){
+                    return spp;
+                });
+                sbp.override = io;
+                Ext.override(sb, overrides);
+                sb.extend = function(o){return Ext.extend(sb, o);};
+                return sb;
+            };
+        }(),
+
+        /**
+         * Adds a list of functions to the prototype of an existing class, overwriting any existing methods with the same name.
+         * Usage:<pre><code>
+Ext.override(MyClass, {
+    newMethod1: function(){
+        // etc.
+    },
+    newMethod2: function(foo){
+        // etc.
+    }
+});
+</code></pre>
+         * @param {Object} origclass The class to override
+         * @param {Object} overrides The list of functions to add to origClass.  This should be specified as an object literal
+         * containing one or more methods.
+         * @method override
+         */
+        override : function(origclass, overrides){
+            if(overrides){
+                var p = origclass.prototype;
+                Ext.apply(p, overrides);
+                if(Ext.isIE && overrides.hasOwnProperty('toString')){
+                    p.toString = overrides.toString;
+                }
+            }
+        },
+
+        /**
+         * Creates namespaces to be used for scoping variables and classes so that they are not global.
+         * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+         * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+         * @param {String} namespace1
+         * @param {String} namespace2
+         * @param {String} etc
+         * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+         * @method namespace
+         */
+        namespace : function(){
+            var len1 = arguments.length,
+                i = 0,
+                len2,
+                j,
+                main,
+                ns,
+                sub,
+                current;
+                
+            for(; i < len1; ++i) {
+                main = arguments[i];
+                ns = arguments[i].split('.');
+                current = window[ns[0]];
+                if (current === undefined) {
+                    current = window[ns[0]] = {};
+                }
+                sub = ns.slice(1);
+                len2 = sub.length;
+                for(j = 0; j < len2; ++j) {
+                    current = current[sub[j]] = current[sub[j]] || {};
+                }
+            }
+            return current;
+        },
+
+        /**
+         * Takes an object and converts it to an encoded URL. e.g. Ext.urlEncode({foo: 1, bar: 2}); would return "foo=1&bar=2".  Optionally, property values can be arrays, instead of keys and the resulting string that's returned will contain a name/value pair for each array value.
+         * @param {Object} o
+         * @param {String} pre (optional) A prefix to add to the url encoded string
+         * @return {String}
+         */
+        urlEncode : function(o, pre){
+            var empty,
+                buf = [],
+                e = encodeURIComponent;
+
+            Ext.iterate(o, function(key, item){
+                empty = Ext.isEmpty(item);
+                Ext.each(empty ? key : item, function(val){
+                    buf.push('&', e(key), '=', (!Ext.isEmpty(val) && (val != key || !empty)) ? (Ext.isDate(val) ? Ext.encode(val).replace(/"/g, '') : e(val)) : '');
+                });
+            });
+            if(!pre){
+                buf.shift();
+                pre = '';
+            }
+            return pre + buf.join('');
+        },
+
+        /**
+         * Takes an encoded URL and and converts it to an object. Example: <pre><code>
+Ext.urlDecode("foo=1&bar=2"); // returns {foo: "1", bar: "2"}
+Ext.urlDecode("foo=1&bar=2&bar=3&bar=4", false); // returns {foo: "1", bar: ["2", "3", "4"]}
+</code></pre>
+         * @param {String} string
+         * @param {Boolean} overwrite (optional) Items of the same name will overwrite previous values instead of creating an an array (Defaults to false).
+         * @return {Object} A literal with members
+         */
+        urlDecode : function(string, overwrite){
+            if(Ext.isEmpty(string)){
+                return {};
+            }
+            var obj = {},
+                pairs = string.split('&'),
+                d = decodeURIComponent,
+                name,
+                value;
+            Ext.each(pairs, function(pair) {
+                pair = pair.split('=');
+                name = d(pair[0]);
+                value = d(pair[1]);
+                obj[name] = overwrite || !obj[name] ? value :
+                            [].concat(obj[name]).concat(value);
+            });
+            return obj;
+        },
+
+        /**
+         * Appends content to the query string of a URL, handling logic for whether to place
+         * a question mark or ampersand.
+         * @param {String} url The URL to append to.
+         * @param {String} s The content to append to the URL.
+         * @return (String) The resulting URL
+         */
+        urlAppend : function(url, s){
+            if(!Ext.isEmpty(s)){
+                return url + (url.indexOf('?') === -1 ? '?' : '&') + s;
+            }
+            return url;
+        },
+
+        /**
+         * Converts any iterable (numeric indices and a length property) into a true array
+         * Don't use this on strings. IE doesn't support "abc"[0] which this implementation depends on.
+         * For strings, use this instead: "abc".match(/./g) => [a,b,c];
+         * @param {Iterable} the iterable object to be turned into a true Array.
+         * @return (Array) array
+         */
+         toArray : function(){
+             return isIE ?
+                 function(a, i, j, res){
+                     res = [];
+                     for(var x = 0, len = a.length; x < len; x++) {
+                         res.push(a[x]);
+                     }
+                     return res.slice(i || 0, j || res.length);
+                 } :
+                 function(a, i, j){
+                     return Array.prototype.slice.call(a, i || 0, j || a.length);
+                 };
+         }(),
+
+        isIterable : function(v){
+            //check for array or arguments
+            if(Ext.isArray(v) || v.callee){
+                return true;
+            }
+            //check for node list type
+            if(/NodeList|HTMLCollection/.test(toString.call(v))){
+                return true;
+            }
+            //NodeList has an item and length property
+            //IXMLDOMNodeList has nextNode method, needs to be checked first.
+            return ((typeof v.nextNode != 'undefined' || v.item) && Ext.isNumber(v.length));
+        },
+
+        /**
+         * Iterates an array calling the supplied function.
+         * @param {Array/NodeList/Mixed} array The array to be iterated. If this
+         * argument is not really an array, the supplied function is called once.
+         * @param {Function} fn The function to be called with each item. If the
+         * supplied function returns false, iteration stops and this method returns
+         * the current <code>index</code>. This function is called with
+         * the following arguments:
+         * <div class="mdetail-params"><ul>
+         * <li><code>item</code> : <i>Mixed</i>
+         * <div class="sub-desc">The item at the current <code>index</code>
+         * in the passed <code>array</code></div></li>
+         * <li><code>index</code> : <i>Number</i>
+         * <div class="sub-desc">The current index within the array</div></li>
+         * <li><code>allItems</code> : <i>Array</i>
+         * <div class="sub-desc">The <code>array</code> passed as the first
+         * argument to <code>Ext.each</code>.</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed.
+         * Defaults to the <code>item</code> at the current <code>index</code>
+         * within the passed <code>array</code>.
+         * @return See description for the fn parameter.
+         */
+        each : function(array, fn, scope){
+            if(Ext.isEmpty(array, true)){
+                return;
+            }
+            if(!Ext.isIterable(array) || Ext.isPrimitive(array)){
+                array = [array];
+            }
+            for(var i = 0, len = array.length; i < len; i++){
+                if(fn.call(scope || array[i], array[i], i, array) === false){
+                    return i;
+                };
+            }
+        },
+
+        /**
+         * Iterates either the elements in an array, or each of the properties in an object.
+         * <b>Note</b>: If you are only iterating arrays, it is better to call {@link #each}.
+         * @param {Object/Array} object The object or array to be iterated
+         * @param {Function} fn The function to be called for each iteration.
+         * The iteration will stop if the supplied function returns false, or
+         * all array elements / object properties have been covered. The signature
+         * varies depending on the type of object being interated:
+         * <div class="mdetail-params"><ul>
+         * <li>Arrays : <tt>(Object item, Number index, Array allItems)</tt>
+         * <div class="sub-desc">
+         * When iterating an array, the supplied function is called with each item.</div></li>
+         * <li>Objects : <tt>(String key, Object value, Object)</tt>
+         * <div class="sub-desc">
+         * When iterating an object, the supplied function is called with each key-value pair in
+         * the object, and the iterated object</div></li>
+         * </ul></div>
+         * @param {Object} scope The scope (<code>this</code> reference) in which the specified function is executed. Defaults to
+         * the <code>object</code> being iterated.
+         */
+        iterate : function(obj, fn, scope){
+            if(Ext.isEmpty(obj)){
+                return;
+            }
+            if(Ext.isIterable(obj)){
+                Ext.each(obj, fn, scope);
+                return;
+            }else if(typeof obj == 'object'){
+                for(var prop in obj){
+                    if(obj.hasOwnProperty(prop)){
+                        if(fn.call(scope || obj, prop, obj[prop], obj) === false){
+                            return;
+                        };
+                    }
+                }
+            }
+        },
+
+        /**
+         * Return the dom node for the passed String (id), dom node, or Ext.Element.
+         * Optional 'strict' flag is needed for IE since it can return 'name' and
+         * 'id' elements by using getElementById.
+         * Here are some examples:
+         * <pre><code>
+// gets dom node based on id
+var elDom = Ext.getDom('elId');
+// gets dom node based on the dom node
+var elDom1 = Ext.getDom(elDom);
+
+// If we don&#39;t know if we are working with an
+// Ext.Element or a dom node use Ext.getDom
+function(el){
+    var dom = Ext.getDom(el);
+    // do something with the dom node
+}
+         * </code></pre>
+         * <b>Note</b>: the dom node to be found actually needs to exist (be rendered, etc)
+         * when this method is called to be successful.
+         * @param {Mixed} el
+         * @return HTMLElement
+         */
+        getDom : function(el, strict){
+            if(!el || !DOC){
+                return null;
+            }
+            if (el.dom){
+                return el.dom;
+            } else {
+                if (typeof el == 'string') {
+                    var e = DOC.getElementById(el);
+                    // IE returns elements with the 'name' and 'id' attribute.
+                    // we do a strict check to return the element with only the id attribute
+                    if (e && isIE && strict) {
+                        if (el == e.getAttribute('id')) {
+                            return e;
+                        } else {
+                            return null;
+                        }
+                    }
+                    return e;
+                } else {
+                    return el;
+                }
+            }
+        },
+
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getBody : function(){
+            return Ext.get(DOC.body || DOC.documentElement);
+        },
+        
+        /**
+         * Returns the current document body as an {@link Ext.Element}.
+         * @return Ext.Element The document body
+         */
+        getHead : function() {
+            var head;
+            
+            return function() {
+                if (head == undefined) {
+                    head = Ext.get(DOC.getElementsByTagName("head")[0]);
+                }
+                
+                return head;
+            };
+        }(),
+
+        /**
+         * Removes a DOM node from the document.
+         */
+        /**
+         * <p>Removes this element from the document, removes all DOM event listeners, and deletes the cache reference.
+         * All DOM event listeners are removed from this element. If {@link Ext#enableNestedListenerRemoval} is
+         * <code>true</code>, then DOM event listeners are also removed from all child nodes. The body node
+         * will be ignored if passed in.</p>
+         * @param {HTMLElement} node The node to remove
+         */
+        removeNode : isIE && !isIE8 ? function(){
+            var d;
+            return function(n){
+                if(n && n.tagName != 'BODY'){
+                    (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                    d = d || DOC.createElement('div');
+                    d.appendChild(n);
+                    d.innerHTML = '';
+                    delete Ext.elCache[n.id];
+                }
+            };
+        }() : function(n){
+            if(n && n.parentNode && n.tagName != 'BODY'){
+                (Ext.enableNestedListenerRemoval) ? Ext.EventManager.purgeElement(n, true) : Ext.EventManager.removeAll(n);
+                n.parentNode.removeChild(n);
+                delete Ext.elCache[n.id];
+            }
+        },
+
+        /**
+         * <p>Returns true if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Boolean} allowBlank (optional) true to allow empty strings (defaults to false)
+         * @return {Boolean}
+         */
+        isEmpty : function(v, allowBlank){
+            return v === null || v === undefined || ((Ext.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript array, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isArray : function(v){
+            return toString.apply(v) === '[object Array]';
+        },
+
+        /**
+         * Returns true if the passed object is a JavaScript date object, otherwise false.
+         * @param {Object} object The object to test
+         * @return {Boolean}
+         */
+        isDate : function(v){
+            return toString.apply(v) === '[object Date]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Object, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isObject : function(v){
+            return !!v && Object.prototype.toString.call(v) === '[object Object]';
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isPrimitive : function(v){
+            return Ext.isString(v) || Ext.isNumber(v) || Ext.isBoolean(v);
+        },
+
+        /**
+         * Returns true if the passed value is a JavaScript Function, otherwise false.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isFunction : function(v){
+            return toString.apply(v) === '[object Function]';
+        },
+
+        /**
+         * Returns true if the passed value is a number. Returns false for non-finite numbers.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isNumber : function(v){
+            return typeof v === 'number' && isFinite(v);
+        },
+
+        /**
+         * Returns true if the passed value is a string.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isString : function(v){
+            return typeof v === 'string';
+        },
+
+        /**
+         * Returns true if the passed value is a boolean.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isBoolean : function(v){
+            return typeof v === 'boolean';
+        },
+
+        /**
+         * Returns true if the passed value is an HTMLElement
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isElement : function(v) {
+            return v ? !!v.tagName : false;
+        },
+
+        /**
+         * Returns true if the passed value is not undefined.
+         * @param {Mixed} value The value to test
+         * @return {Boolean}
+         */
+        isDefined : function(v){
+            return typeof v !== 'undefined';
+        },
+
+        /**
+         * True if the detected browser is Opera.
+         * @type Boolean
+         */
+        isOpera : isOpera,
+        /**
+         * True if the detected browser uses WebKit.
+         * @type Boolean
+         */
+        isWebKit : isWebKit,
+        /**
+         * True if the detected browser is Chrome.
+         * @type Boolean
+         */
+        isChrome : isChrome,
+        /**
+         * True if the detected browser is Safari.
+         * @type Boolean
+         */
+        isSafari : isSafari,
+        /**
+         * True if the detected browser is Safari 3.x.
+         * @type Boolean
+         */
+        isSafari3 : isSafari3,
+        /**
+         * True if the detected browser is Safari 4.x.
+         * @type Boolean
+         */
+        isSafari4 : isSafari4,
+        /**
+         * True if the detected browser is Safari 2.x.
+         * @type Boolean
+         */
+        isSafari2 : isSafari2,
+        /**
+         * True if the detected browser is Internet Explorer.
+         * @type Boolean
+         */
+        isIE : isIE,
+        /**
+         * True if the detected browser is Internet Explorer 6.x.
+         * @type Boolean
+         */
+        isIE6 : isIE6,
+        /**
+         * True if the detected browser is Internet Explorer 7.x.
+         * @type Boolean
+         */
+        isIE7 : isIE7,
+        /**
+         * True if the detected browser is Internet Explorer 8.x.
+         * @type Boolean
+         */
+        isIE8 : isIE8,
+        /**
+         * True if the detected browser is Internet Explorer 9.x.
+         * @type Boolean
+         */
+        isIE9 : isIE9,
+        /**
+         * True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).
+         * @type Boolean
+         */
+        isGecko : isGecko,
+        /**
+         * True if the detected browser uses a pre-Gecko 1.9 layout engine (e.g. Firefox 2.x).
+         * @type Boolean
+         */
+        isGecko2 : isGecko2,
+        /**
+         * True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).
+         * @type Boolean
+         */
+        isGecko3 : isGecko3,
+        /**
+         * True if the detected browser is Internet Explorer running in non-strict mode.
+         * @type Boolean
+         */
+        isBorderBox : isBorderBox,
+        /**
+         * True if the detected platform is Linux.
+         * @type Boolean
+         */
+        isLinux : isLinux,
+        /**
+         * True if the detected platform is Windows.
+         * @type Boolean
+         */
+        isWindows : isWindows,
+        /**
+         * True if the detected platform is Mac OS.
+         * @type Boolean
+         */
+        isMac : isMac,
+        /**
+         * True if the detected platform is Adobe Air.
+         * @type Boolean
+         */
+        isAir : isAir
+    });
+
+    /**
+     * Creates namespaces to be used for scoping variables and classes so that they are not global.
+     * Specifying the last node of a namespace implicitly creates all other nodes. Usage:
+     * <pre><code>
+Ext.namespace('Company', 'Company.data');
+Ext.namespace('Company.data'); // equivalent and preferable to above syntax
+Company.Widget = function() { ... }
+Company.data.CustomStore = function(config) { ... }
+</code></pre>
+     * @param {String} namespace1
+     * @param {String} namespace2
+     * @param {String} etc
+     * @return {Object} The namespace object. (If multiple arguments are passed, this will be the last namespace created)
+     * @method ns
+     */
+    Ext.ns = Ext.namespace;
+})();
+
+Ext.ns('Ext.util', 'Ext.lib', 'Ext.data', 'Ext.supports');
+
+Ext.elCache = {};
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+     /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = sayHi.createInterceptor(function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+</code></pre>
+     * @param {Function} fcn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor : function(fcn, scope){
+        var method = this;
+        return !Ext.isFunction(fcn) ?
+                this :
+                function() {
+                    var me = this,
+                        args = arguments;
+                    fcn.target = me;
+                    fcn.method = method;
+                    return (fcn.apply(scope || me || window, args) !== false) ?
+                            method.apply(me || window, args) :
+                            null;
+                };
+    },
+
+     /**
+     * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+     * Call directly on any function. Example: <code>myFunction.createCallback(arg1, arg2)</code>
+     * Will create a function that is bound to those 2 args. <b>If a specific scope is required in the
+     * callback, use {@link #createDelegate} instead.</b> The function returned by createCallback always
+     * executes in the window scope.
+     * <p>This method is required when you want to pass arguments to a callback function.  If no arguments
+     * are needed, you can simply pass a reference to the function as a callback (e.g., callback: myFn).
+     * However, if you tried to pass a function with arguments (e.g., callback: myFn(arg1, arg2)) the function
+     * would simply execute immediately when the code is parsed. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// clicking the button alerts "Hi, Fred"
+new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody(),
+    handler: sayHi.createCallback('Fred')
+});
+</code></pre>
+     * @return {Function} The new function
+    */
+    createCallback : function(/*args...*/){
+        // make args available, in function below
+        var args = arguments,
+            method = this;
+        return function() {
+            return method.apply(window, args);
+        };
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>this.myFunction.createDelegate(this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', sayHi.createDelegate(btn, ['Fred']));
+</code></pre>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate : function(obj, args, appendArgs){
+        var method = this;
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true){
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }else if (Ext.isNumber(appendArgs)){
+                callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args); // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+            }
+            return method.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+sayHi.defer(2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+(function(){
+    alert('Anonymous');
+}).defer(100);
+</code></pre>
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer : function(millis, obj, args, appendArgs){
+        var fn = this.createDelegate(obj, args, appendArgs);
+        if(millis > 0){
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    }
+});
+
+/**
+ * @class String
+ * These functions are available on every String object.
+ */
+Ext.applyIf(String, {
+    /**
+     * Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens.  Each
+     * token must be unique, and must increment in the format {0}, {1}, etc.  Example usage:
+     * <pre><code>
+var cls = 'my-class', text = 'Some text';
+var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);
+// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'
+     * </code></pre>
+     * @param {String} string The tokenized string to be formatted
+     * @param {String} value1 The value to replace token {0}
+     * @param {String} value2 Etc...
+     * @return {String} The formatted string
+     * @static
+     */
+    format : function(format){
+        var args = Ext.toArray(arguments, 1);
+        return format.replace(/\{(\d+)\}/g, function(m, i){
+            return args[i];
+        });
+    }
+});
+
+/**
+ * @class Array
+ */
+Ext.applyIf(Array.prototype, {
+    /**
+     * Checks whether or not the specified object exists in the array.
+     * @param {Object} o The object to check for
+     * @param {Number} from (Optional) The index at which to begin the search
+     * @return {Number} The index of o in the array (or -1 if it is not found)
+     */
+    indexOf : function(o, from){
+        var len = this.length;
+        from = from || 0;
+        from += (from < 0) ? len : 0;
+        for (; from < len; ++from){
+            if(this[from] === o){
+                return from;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Removes the specified object from the array.  If the object is not found nothing happens.
+     * @param {Object} o The object to remove
+     * @return {Array} this array
+     */
+    remove : function(o){
+        var index = this.indexOf(o);
+        if(index != -1){
+            this.splice(index, 1);
+        }
+        return this;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.insertion.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.insertion.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/core/Element.insertion.js	(revision 76)
@@ -0,0 +1,145 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {
+	    /**
+	     * Appends the passed element(s) to this element
+	     * @param {String/HTMLElement/Array/Element/CompositeElement} el
+	     * @return {Ext.Element} this
+	     */
+	    appendChild: function(el){        
+	        return GET(el).appendTo(this);        
+	    },
+	
+	    /**
+	     * Appends this element to the passed element
+	     * @param {Mixed} el The new parent element
+	     * @return {Ext.Element} this
+	     */
+	    appendTo: function(el){        
+	        GETDOM(el).appendChild(this.dom);        
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element before the passed element in the DOM
+	     * @param {Mixed} el The element before which this element will be inserted
+	     * @return {Ext.Element} this
+	     */
+	    insertBefore: function(el){  	          
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element after the passed element in the DOM
+	     * @param {Mixed} el The element to insert after
+	     * @return {Ext.Element} this
+	     */
+	    insertAfter: function(el){
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el.nextSibling);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts (or creates) an element (or DomHelper config) as the first child of this element
+	     * @param {Mixed/Object} el The id or element to insert or a DomHelper config to create and insert
+	     * @return {Ext.Element} The new child
+	     */
+	    insertFirst: function(el, returnDom){
+            el = el || {};
+            if(el.nodeType || el.dom || typeof el == 'string'){ // element
+                el = GETDOM(el);
+                this.dom.insertBefore(el, this.dom.firstChild);
+                return !returnDom ? GET(el) : el;
+            }else{ // dh config
+                return this.createChild(el, this.dom.firstChild, returnDom);
+            }
+        },
+	
+	    /**
+	     * Replaces the passed element with this element
+	     * @param {Mixed} el The element to replace
+	     * @return {Ext.Element} this
+	     */
+	    replace: function(el){
+	        el = GET(el);
+	        this.insertBefore(el);
+	        el.remove();
+	        return this;
+	    },
+	
+	    /**
+	     * Replaces this element with the passed element
+	     * @param {Mixed/Object} el The new element or a DomHelper config of an element to create
+	     * @return {Ext.Element} this
+	     */
+	    replaceWith: function(el){
+		    var me = this;
+                
+            if(el.nodeType || el.dom || typeof el == 'string'){
+                el = GETDOM(el);
+                me.dom.parentNode.insertBefore(el, me.dom);
+            }else{
+                el = DH.insertBefore(me.dom, el);
+            }
+	        
+	        delete Ext.elCache[me.id];
+	        Ext.removeNode(me.dom);      
+	        me.id = Ext.id(me.dom = el);
+	        Ext.Element.addToCache(me.isFlyweight ? new Ext.Element(me.dom) : me);     
+            return me;
+	    },
+	    
+		/**
+		 * Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.
+		 * @param {Object} config DomHelper element config object.  If no tag is specified (e.g., {tag:'input'}) then a div will be
+		 * automatically generated with the specified attributes.
+		 * @param {HTMLElement} insertBefore (optional) a child element of this element
+		 * @param {Boolean} returnDom (optional) true to return the dom node instead of creating an Element
+		 * @return {Ext.Element} The new child element
+		 */
+		createChild: function(config, insertBefore, returnDom){
+		    config = config || {tag:'div'};
+		    return insertBefore ? 
+		    	   DH.insertBefore(insertBefore, config, returnDom !== true) :	
+		    	   DH[!this.dom.firstChild ? 'overwrite' : 'append'](this.dom, config,  returnDom !== true);
+		},
+		
+		/**
+		 * Creates and wraps this element with another element
+		 * @param {Object} config (optional) DomHelper element config object for the wrapper element or null for an empty div
+		 * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+		 * @return {HTMLElement/Element} The newly created wrapper element
+		 */
+		wrap: function(config, returnDom){        
+		    var newEl = DH.insertBefore(this.dom, config || {tag: "div"}, !returnDom);
+		    newEl.dom ? newEl.dom.appendChild(this.dom) : newEl.appendChild(this.dom);
+		    return newEl;
+		},
+		
+		/**
+		 * Inserts an html fragment into this element
+		 * @param {String} where Where to insert the html in relation to this element - beforeBegin, afterBegin, beforeEnd, afterEnd.
+		 * @param {String} html The HTML fragment
+		 * @param {Boolean} returnEl (optional) True to return an Ext.Element (defaults to false)
+		 * @return {HTMLElement/Ext.Element} The inserted node (or nearest related if more than 1 inserted)
+		 */
+		insertHtml : function(where, html, returnEl){
+		    var el = DH.insertHtml(where, this.dom, html);
+		    return returnEl ? Ext.get(el) : el;
+		}
+	};
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/data/Connection.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/data/Connection.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/data/Connection.js	(revision 76)
@@ -0,0 +1,583 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+    var BEFOREREQUEST = "beforerequest",
+        REQUESTCOMPLETE = "requestcomplete",
+        REQUESTEXCEPTION = "requestexception",
+        UNDEFINED = undefined,
+        LOAD = 'load',
+        POST = 'POST',
+        GET = 'GET',
+        WINDOW = window;
+
+    /**
+     * @class Ext.data.Connection
+     * @extends Ext.util.Observable
+     * <p>The class encapsulates a connection to the page's originating domain, allowing requests to be made
+     * either to a configured URL, or to a URL specified at request time.</p>
+     * <p>Requests made by this class are asynchronous, and will return immediately. No data from
+     * the server will be available to the statement immediately following the {@link #request} call.
+     * To process returned data, use a
+     * <a href="#request-option-success" ext:member="request-option-success" ext:cls="Ext.data.Connection">success callback</a>
+     * in the request options object,
+     * or an {@link #requestcomplete event listener}.</p>
+     * <p><h3>File Uploads</h3><a href="#request-option-isUpload" ext:member="request-option-isUpload" ext:cls="Ext.data.Connection">File uploads</a> are not performed using normal "Ajax" techniques, that
+     * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+     * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     * <p>Also note that it's not possible to check the response code of the hidden iframe, so the success handler will ALWAYS fire.</p>
+     * @constructor
+     * @param {Object} config a configuration object.
+     */
+    Ext.data.Connection = function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event beforerequest
+             * Fires before a network request is made to retrieve a data object.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            BEFOREREQUEST,
+            /**
+             * @event requestcomplete
+             * Fires if the request was successfully completed.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTCOMPLETE,
+            /**
+             * @event requestexception
+             * Fires if an error HTTP status was returned from the server.
+             * See <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html">HTTP Status Code Definitions</a>
+             * for details of HTTP status codes.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTEXCEPTION
+        );
+        Ext.data.Connection.superclass.constructor.call(this);
+    };
+
+    Ext.extend(Ext.data.Connection, Ext.util.Observable, {
+        /**
+         * @cfg {String} url (Optional) <p>The default URL to be used for requests to the server. Defaults to undefined.</p>
+         * <p>The <code>url</code> config may be a function which <i>returns</i> the URL to use for the Ajax request. The scope
+         * (<code><b>this</b></code> reference) of the function is the <code>scope</code> option passed to the {@link #request} method.</p>
+         */
+        /**
+         * @cfg {Object} extraParams (Optional) An object containing properties which are used as
+         * extra parameters to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {Object} defaultHeaders (Optional) An object containing request headers which are added
+         *  to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {String} method (Optional) The default HTTP method to be used for requests.
+         * (defaults to undefined; if not set, but {@link #request} params are present, POST will be used;
+         * otherwise, GET will be used.)
+         */
+        /**
+         * @cfg {Number} timeout (Optional) The timeout in milliseconds to be used for requests. (defaults to 30000)
+         */
+        timeout : 30000,
+        /**
+         * @cfg {Boolean} autoAbort (Optional) Whether this request should abort any pending requests. (defaults to false)
+         * @type Boolean
+         */
+        autoAbort:false,
+
+        /**
+         * @cfg {Boolean} disableCaching (Optional) True to add a unique cache-buster param to GET requests. (defaults to true)
+         * @type Boolean
+         */
+        disableCaching: true,
+
+        /**
+         * @cfg {String} disableCachingParam (Optional) Change the parameter which is sent went disabling caching
+         * through a cache buster. Defaults to '_dc'
+         * @type String
+         */
+        disableCachingParam: '_dc',
+
+        /**
+         * <p>Sends an HTTP request to a remote server.</p>
+         * <p><b>Important:</b> Ajax server requests are asynchronous, and this call will
+         * return before the response has been received. Process any returned data
+         * in a callback function.</p>
+         * <pre><code>
+Ext.Ajax.request({
+   url: 'ajax_demo/sample.json',
+   success: function(response, opts) {
+      var obj = Ext.decode(response.responseText);
+      console.dir(obj);
+   },
+   failure: function(response, opts) {
+      console.log('server-side failure with status code ' + response.status);
+   }
+});
+         * </code></pre>
+         * <p>To execute a callback function in the correct scope, use the <tt>scope</tt> option.</p>
+         * @param {Object} options An object which may contain the following properties:<ul>
+         * <li><b>url</b> : String/Function (Optional)<div class="sub-desc">The URL to
+         * which to send the request, or a function to call which returns a URL string. The scope of the
+         * function is specified by the <tt>scope</tt> option. Defaults to the configured
+         * <tt>{@link #url}</tt>.</div></li>
+         * <li><b>params</b> : Object/String/Function (Optional)<div class="sub-desc">
+         * An object containing properties which are used as parameters to the
+         * request, a url encoded string or a function to call to get either. The scope of the function
+         * is specified by the <tt>scope</tt> option.</div></li>
+         * <li><b>method</b> : String (Optional)<div class="sub-desc">The HTTP method to use
+         * for the request. Defaults to the configured method, or if no method was configured,
+         * "GET" if no parameters are being sent, and "POST" if parameters are being sent.  Note that
+         * the method name is case-sensitive and should be all caps.</div></li>
+         * <li><b>callback</b> : Function (Optional)<div class="sub-desc">The
+         * function to be called upon receipt of the HTTP response. The callback is
+         * called regardless of success or failure and is passed the following
+         * parameters:<ul>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * <li><b>success</b> : Boolean<div class="sub-desc">True if the request succeeded.</div></li>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.
+         * See <a href="http://www.w3.org/TR/XMLHttpRequest/">http://www.w3.org/TR/XMLHttpRequest/</a> for details about
+         * accessing elements of the response.</div></li>
+         * </ul></div></li>
+         * <li><a id="request-option-success"></a><b>success</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon success of the request. The callback is passed the following
+         * parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>failure</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon failure of the request. The callback is passed the
+         * following parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>scope</b> : Object (Optional)<div class="sub-desc">The scope in
+         * which to execute the callbacks: The "this" object for the callback function. If the <tt>url</tt>, or <tt>params</tt> options were
+         * specified as functions from which to draw values, then this also serves as the scope for those function calls.
+         * Defaults to the browser window.</div></li>
+         * <li><b>timeout</b> : Number (Optional)<div class="sub-desc">The timeout in milliseconds to be used for this request. Defaults to 30 seconds.</div></li>
+         * <li><b>form</b> : Element/HTMLElement/String (Optional)<div class="sub-desc">The <tt>&lt;form&gt;</tt>
+         * Element or the id of the <tt>&lt;form&gt;</tt> to pull parameters from.</div></li>
+         * <li><a id="request-option-isUpload"></a><b>isUpload</b> : Boolean (Optional)<div class="sub-desc"><b>Only meaningful when used
+         * with the <tt>form</tt> option</b>.
+         * <p>True if the form object is a file upload (will be set automatically if the form was
+         * configured with <b><tt>enctype</tt></b> "multipart/form-data").</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <tt>&lt;form></tt> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+         * server is using JSON to send the return object, then the
+         * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+         * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+         * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+         * is created containing a <tt>responseText</tt> property in order to conform to the
+         * requirements of event handlers and callbacks.</p>
+         * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * </div></li>
+         * <li><b>headers</b> : Object (Optional)<div class="sub-desc">Request
+         * headers to set for the request.</div></li>
+         * <li><b>xmlData</b> : Object (Optional)<div class="sub-desc">XML document
+         * to use for the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>jsonData</b> : Object/String (Optional)<div class="sub-desc">JSON
+         * data to use as the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>disableCaching</b> : Boolean (Optional)<div class="sub-desc">True
+         * to add a unique cache-buster param to GET requests.</div></li>
+         * </ul></p>
+         * <p>The options object may also contain any other property which might be needed to perform
+         * postprocessing in a callback because it is passed to callback functions.</p>
+         * @return {Number} transactionId The id of the server transaction. This may be used
+         * to cancel the request.
+         */
+        request : function(o){
+            var me = this;
+            if(me.fireEvent(BEFOREREQUEST, me, o)){
+                if (o.el) {
+                    if(!Ext.isEmpty(o.indicatorText)){
+                        me.indicatorText = '<div class="loading-indicator">'+o.indicatorText+"</div>";
+                    }
+                    if(me.indicatorText) {
+                        Ext.getDom(o.el).innerHTML = me.indicatorText;
+                    }
+                    o.success = (Ext.isFunction(o.success) ? o.success : function(){}).createInterceptor(function(response) {
+                        Ext.getDom(o.el).innerHTML = response.responseText;
+                    });
+                }
+
+                var p = o.params,
+                    url = o.url || me.url,
+                    method,
+                    cb = {success: me.handleResponse,
+                          failure: me.handleFailure,
+                          scope: me,
+                          argument: {options: o},
+                          timeout : Ext.num(o.timeout, me.timeout)
+                    },
+                    form,
+                    serForm;
+
+
+                if (Ext.isFunction(p)) {
+                    p = p.call(o.scope||WINDOW, o);
+                }
+
+                p = Ext.urlEncode(me.extraParams, Ext.isObject(p) ? Ext.urlEncode(p) : p);
+
+                if (Ext.isFunction(url)) {
+                    url = url.call(o.scope || WINDOW, o);
+                }
+
+                if((form = Ext.getDom(o.form))){
+                    url = url || form.action;
+                     if(o.isUpload || (/multipart\/form-data/i.test(form.getAttribute("enctype")))) {
+                         return me.doFormUpload.call(me, o, p, url);
+                     }
+                    serForm = Ext.lib.Ajax.serializeForm(form);
+                    p = p ? (p + '&' + serForm) : serForm;
+                }
+
+                method = o.method || me.method || ((p || o.xmlData || o.jsonData) ? POST : GET);
+
+                if(method === GET && (me.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
+                    var dcp = o.disableCachingParam || me.disableCachingParam;
+                    url = Ext.urlAppend(url, dcp + '=' + (new Date().getTime()));
+                }
+
+                o.headers = Ext.applyIf(o.headers || {}, me.defaultHeaders || {});
+
+                if(o.autoAbort === true || me.autoAbort) {
+                    me.abort();
+                }
+
+                if((method == GET || o.xmlData || o.jsonData) && p){
+                    url = Ext.urlAppend(url, p);
+                    p = '';
+                }
+                return (me.transId = Ext.lib.Ajax.request(method, url, cb, p, o));
+            }else{
+                return o.callback ? o.callback.apply(o.scope, [o,UNDEFINED,UNDEFINED]) : null;
+            }
+        },
+
+        /**
+         * Determine whether this object has a request outstanding.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         * @return {Boolean} True if there is an outstanding request.
+         */
+        isLoading : function(transId){
+            return transId ? Ext.lib.Ajax.isCallInProgress(transId) : !! this.transId;
+        },
+
+        /**
+         * Aborts any outstanding request.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         */
+        abort : function(transId){
+            if(transId || this.isLoading()){
+                Ext.lib.Ajax.abort(transId || this.transId);
+            }
+        },
+
+        // private
+        handleResponse : function(response){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTCOMPLETE, this, response, options);
+            if(options.success){
+                options.success.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, true, response);
+            }
+        },
+
+        // private
+        handleFailure : function(response, e){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTEXCEPTION, this, response, options, e);
+            if(options.failure){
+                options.failure.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, false, response);
+            }
+        },
+
+        // private
+        doFormUpload : function(o, ps, url){
+            var id = Ext.id(),
+                doc = document,
+                frame = doc.createElement('iframe'),
+                form = Ext.getDom(o.form),
+                hiddens = [],
+                hd,
+                encoding = 'multipart/form-data',
+                buf = {
+                    target: form.target,
+                    method: form.method,
+                    encoding: form.encoding,
+                    enctype: form.enctype,
+                    action: form.action
+                };
+
+            /*
+             * Originally this behaviour was modified for Opera 10 to apply the secure URL after
+             * the frame had been added to the document. It seems this has since been corrected in
+             * Opera so the behaviour has been reverted, the URL will be set before being added.
+             */
+            Ext.fly(frame).set({
+                id: id,
+                name: id,
+                cls: 'x-hidden',
+                src: Ext.SSL_SECURE_URL
+            }); 
+
+            doc.body.appendChild(frame);
+
+            // This is required so that IE doesn't pop the response up in a new window.
+            if(Ext.isIE){
+               document.frames[id].name = id;
+            }
+
+
+            Ext.fly(form).set({
+                target: id,
+                method: POST,
+                enctype: encoding,
+                encoding: encoding,
+                action: url || buf.action
+            });
+
+            // add dynamic params
+            Ext.iterate(Ext.urlDecode(ps, false), function(k, v){
+                hd = doc.createElement('input');
+                Ext.fly(hd).set({
+                    type: 'hidden',
+                    value: v,
+                    name: k
+                });
+                form.appendChild(hd);
+                hiddens.push(hd);
+            });
+
+            function cb(){
+                var me = this,
+                    // bogus response object
+                    r = {responseText : '',
+                         responseXML : null,
+                         argument : o.argument},
+                    doc,
+                    firstChild;
+
+                try{
+                    doc = frame.contentWindow.document || frame.contentDocument || WINDOW.frames[id].document;
+                    if(doc){
+                        if(doc.body){
+                            if(/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)){ // json response wrapped in textarea
+                                r.responseText = firstChild.value;
+                            }else{
+                                r.responseText = doc.body.innerHTML;
+                            }
+                        }
+                        //in IE the document may still have a body even if returns XML.
+                        r.responseXML = doc.XMLDocument || doc;
+                    }
+                }
+                catch(e) {}
+
+                Ext.EventManager.removeListener(frame, LOAD, cb, me);
+
+                me.fireEvent(REQUESTCOMPLETE, me, r, o);
+
+                function runCallback(fn, scope, args){
+                    if(Ext.isFunction(fn)){
+                        fn.apply(scope, args);
+                    }
+                }
+
+                runCallback(o.success, o.scope, [r, o]);
+                runCallback(o.callback, o.scope, [o, true, r]);
+
+                if(!me.debugUploads){
+                    setTimeout(function(){Ext.removeNode(frame);}, 100);
+                }
+            }
+
+            Ext.EventManager.on(frame, LOAD, cb, this);
+            form.submit();
+
+            Ext.fly(form).set(buf);
+            Ext.each(hiddens, function(h) {
+                Ext.removeNode(h);
+            });
+        }
+    });
+})();
+
+/**
+ * @class Ext.Ajax
+ * @extends Ext.data.Connection
+ * <p>The global Ajax request class that provides a simple way to make Ajax requests
+ * with maximum flexibility.</p>
+ * <p>Since Ext.Ajax is a singleton, you can set common properties/events for it once
+ * and override them at the request function level only if necessary.</p>
+ * <p>Common <b>Properties</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #method}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #extraParams}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #url}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Default headers to pass in every request
+Ext.Ajax.defaultHeaders = {
+    'Powered-By': 'Ext'
+};
+ * </code></pre>
+ * </p>
+ * <p>Common <b>Events</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.data.Connection#beforerequest beforerequest}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestcomplete requestcomplete}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestexception requestexception}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Example: show a spinner during all Ajax requests
+Ext.Ajax.on('beforerequest', this.showSpinner, this);
+Ext.Ajax.on('requestcomplete', this.hideSpinner, this);
+Ext.Ajax.on('requestexception', this.hideSpinner, this);
+ * </code></pre>
+ * </p>
+ * <p>An example request:</p>
+ * <pre><code>
+// Basic request
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+   url: 'foo.php',
+   success: someFn,
+   failure: otherFn,
+   headers: {
+       'my-header': 'foo'
+   },
+   params: { foo: 'bar' }
+});
+
+// Simple ajax form submission
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+    form: 'some-form',
+    params: 'foo=bar'
+});
+ * </code></pre>
+ * </p>
+ * @singleton
+ */
+Ext.Ajax = new Ext.data.Connection({
+    /**
+     * @cfg {String} url @hide
+     */
+    /**
+     * @cfg {Object} extraParams @hide
+     */
+    /**
+     * @cfg {Object} defaultHeaders @hide
+     */
+    /**
+     * @cfg {String} method (Optional) @hide
+     */
+    /**
+     * @cfg {Number} timeout (Optional) @hide
+     */
+    /**
+     * @cfg {Boolean} autoAbort (Optional) @hide
+     */
+
+    /**
+     * @cfg {Boolean} disableCaching (Optional) @hide
+     */
+
+    /**
+     * @property  disableCaching
+     * True to add a unique cache-buster param to GET requests. (defaults to true)
+     * @type Boolean
+     */
+    /**
+     * @property  url
+     * The default URL to be used for requests to the server. (defaults to undefined)
+     * If the server receives all requests through one URL, setting this once is easier than
+     * entering it on every request.
+     * @type String
+     */
+    /**
+     * @property  extraParams
+     * An object containing properties which are used as extra parameters to each request made
+     * by this object (defaults to undefined). Session information and other data that you need
+     * to pass with each request are commonly put here.
+     * @type Object
+     */
+    /**
+     * @property  defaultHeaders
+     * An object containing request headers which are added to each request made by this object
+     * (defaults to undefined).
+     * @type Object
+     */
+    /**
+     * @property  method
+     * The default HTTP method to be used for requests. Note that this is case-sensitive and
+     * should be all caps (defaults to undefined; if not set but params are present will use
+     * <tt>"POST"</tt>, otherwise will use <tt>"GET"</tt>.)
+     * @type String
+     */
+    /**
+     * @property  timeout
+     * The timeout in milliseconds to be used for requests. (defaults to 30000)
+     * @type Number
+     */
+
+    /**
+     * @property  autoAbort
+     * Whether a new request should abort any pending requests. (defaults to false)
+     * @type Boolean
+     */
+    autoAbort : false,
+
+    /**
+     * Serialize the passed form into a url encoded string
+     * @param {String/HTMLElement} form
+     * @return {String}
+     */
+    serializeForm : function(form){
+        return Ext.lib.Ajax.serializeForm(form);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/Observable.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/Observable.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/Observable.js	(revision 76)
@@ -0,0 +1,528 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+
+var EXTUTIL = Ext.util,
+    EACH = Ext.each,
+    TRUE = true,
+    FALSE = false;
+/**
+ * @class Ext.util.Observable
+ * Base class that provides a common interface for publishing events. Subclasses are expected to
+ * to have a property "events" with all the events defined, and, optionally, a property "listeners"
+ * with configured listeners defined.<br>
+ * For example:
+ * <pre><code>
+Employee = Ext.extend(Ext.util.Observable, {
+    constructor: function(config){
+        this.name = config.name;
+        this.addEvents({
+            "fired" : true,
+            "quit" : true
+        });
+
+        // Copy configured listeners into *this* object so that the base class&#39;s
+        // constructor will add them.
+        this.listeners = config.listeners;
+
+        // Call our superclass constructor to complete construction process.
+        Employee.superclass.constructor.call(this, config)
+    }
+});
+</code></pre>
+ * This could then be used like this:<pre><code>
+var newEmployee = new Employee({
+    name: employeeName,
+    listeners: {
+        quit: function() {
+            // By default, "this" will be the object that fired the event.
+            alert(this.name + " has quit!");
+        }
+    }
+});
+</code></pre>
+ */
+EXTUTIL.Observable = function(){
+    /**
+     * @cfg {Object} listeners (optional) <p>A config object containing one or more event handlers to be added to this
+     * object during initialization.  This should be a valid listeners config object as specified in the
+     * {@link #addListener} example for attaching multiple handlers at once.</p>
+     * <br><p><b><u>DOM events from ExtJs {@link Ext.Component Components}</u></b></p>
+     * <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
+     * is usually only done when extra value can be added. For example the {@link Ext.DataView DataView}'s
+     * <b><code>{@link Ext.DataView#click click}</code></b> event passing the node clicked on. To access DOM
+     * events directly from a Component's HTMLElement, listeners must be added to the <i>{@link Ext.Component#getEl Element}</i> after the Component
+     * has been rendered. A plugin can simplify this step:<pre><code>
+// Plugin is configured with a listeners config object.
+// The Component is appended to the argument list of all handler functions.
+Ext.DomObserver = Ext.extend(Object, {
+    constructor: function(config) {
+        this.listeners = config.listeners ? config.listeners : config;
+    },
+
+    // Component passes itself into plugin&#39;s init method
+    init: function(c) {
+        var p, l = this.listeners;
+        for (p in l) {
+            if (Ext.isFunction(l[p])) {
+                l[p] = this.createHandler(l[p], c);
+            } else {
+                l[p].fn = this.createHandler(l[p].fn, c);
+            }
+        }
+
+        // Add the listeners to the Element immediately following the render call
+        c.render = c.render.{@link Function#createSequence createSequence}(function() {
+            var e = c.getEl();
+            if (e) {
+                e.on(l);
+            }
+        });
+    },
+
+    createHandler: function(fn, c) {
+        return function(e) {
+            fn.call(this, e, c);
+        };
+    }
+});
+
+var combo = new Ext.form.ComboBox({
+
+    // Collapse combo when its element is clicked on
+    plugins: [ new Ext.DomObserver({
+        click: function(evt, comp) {
+            comp.collapse();
+        }
+    })],
+    store: myStore,
+    typeAhead: true,
+    mode: 'local',
+    triggerAction: 'all'
+});
+     * </code></pre></p>
+     */
+    var me = this, e = me.events;
+    if(me.listeners){
+        me.on(me.listeners);
+        delete me.listeners;
+    }
+    me.events = e || {};
+};
+
+EXTUTIL.Observable.prototype = {
+    // private
+    filterOptRe : /^(?:scope|delay|buffer|single)$/,
+
+    /**
+     * <p>Fires the specified event with the passed parameters (minus the event name).</p>
+     * <p>An event may be set to bubble up an Observable parent hierarchy (See {@link Ext.Component#getBubbleTarget})
+     * by calling {@link #enableBubble}.</p>
+     * @param {String} eventName The name of the event to fire.
+     * @param {Object...} args Variable number of parameters are passed to handlers.
+     * @return {Boolean} returns false if any of the handlers return false otherwise it returns true.
+     */
+    fireEvent : function(){
+        var a = Array.prototype.slice.call(arguments, 0),
+            ename = a[0].toLowerCase(),
+            me = this,
+            ret = TRUE,
+            ce = me.events[ename],
+            cc,
+            q,
+            c;
+        if (me.eventsSuspended === TRUE) {
+            if (q = me.eventQueue) {
+                q.push(a);
+            }
+        }
+        else if(typeof ce == 'object') {
+            if (ce.bubble){
+                if(ce.fire.apply(ce, a.slice(1)) === FALSE) {
+                    return FALSE;
+                }
+                c = me.getBubbleTarget && me.getBubbleTarget();
+                if(c && c.enableBubble) {
+                    cc = c.events[ename];
+                    if(!cc || typeof cc != 'object' || !cc.bubble) {
+                        c.enableBubble(ename);
+                    }
+                    return c.fireEvent.apply(c, a);
+                }
+            }
+            else {
+                a.shift();
+                ret = ce.fire.apply(ce, a);
+            }
+        }
+        return ret;
+    },
+
+    /**
+     * Appends an event handler to this object.
+     * @param {String}   eventName The name of the event to listen for.
+     * @param {Function} handler The method the event invokes.
+     * @param {Object}   scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b>
+     * @param {Object}   options (optional) An object containing handler configuration.
+     * properties. This may contain any of the following properties:<ul>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b></div></li>
+     * <li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * <li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
+     * if the event was bubbled up from a child Observable.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * Using the options argument, it is possible to combine different types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener.
+     * <pre><code>
+myDataView.on('click', this.onClick, this, {
+single: true,
+delay: 100
+});</code></pre>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.
+     * <p>
+     * <pre><code>
+myGridPanel.on({
+'click' : {
+    fn: this.onClick,
+    scope: this,
+    delay: 100
+},
+'mouseover' : {
+    fn: this.onMouseOver,
+    scope: this
+},
+'mouseout' : {
+    fn: this.onMouseOut,
+    scope: this
+}
+});</code></pre>
+ * <p>
+ * Or a shorthand syntax:<br>
+ * <pre><code>
+myGridPanel.on({
+'click' : this.onClick,
+'mouseover' : this.onMouseOver,
+'mouseout' : this.onMouseOut,
+ scope: this
+});</code></pre>
+     */
+    addListener : function(eventName, fn, scope, o){
+        var me = this,
+            e,
+            oe,
+            ce;
+            
+        if (typeof eventName == 'object') {
+            o = eventName;
+            for (e in o) {
+                oe = o[e];
+                if (!me.filterOptRe.test(e)) {
+                    me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o);
+                }
+            }
+        } else {
+            eventName = eventName.toLowerCase();
+            ce = me.events[eventName] || TRUE;
+            if (typeof ce == 'boolean') {
+                me.events[eventName] = ce = new EXTUTIL.Event(me, eventName);
+            }
+            ce.addListener(fn, scope, typeof o == 'object' ? o : {});
+        }
+    },
+
+    /**
+     * Removes an event handler.
+     * @param {String}   eventName The type of event the handler was associated with.
+     * @param {Function} handler   The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object}   scope     (optional) The scope originally specified for the handler.
+     */
+    removeListener : function(eventName, fn, scope){
+        var ce = this.events[eventName.toLowerCase()];
+        if (typeof ce == 'object') {
+            ce.removeListener(fn, scope);
+        }
+    },
+
+    /**
+     * Removes all listeners for this object
+     */
+    purgeListeners : function(){
+        var events = this.events,
+            evt,
+            key;
+        for(key in events){
+            evt = events[key];
+            if(typeof evt == 'object'){
+                evt.clearListeners();
+            }
+        }
+    },
+
+    /**
+     * Adds the specified events to the list of events which this Observable may fire.
+     * @param {Object|String} o Either an object with event names as properties with a value of <code>true</code>
+     * or the first event name string if multiple event names are being passed as separate parameters.
+     * @param {string} Optional. Event name if multiple event names are being passed as separate parameters.
+     * Usage:<pre><code>
+this.addEvents('storeloaded', 'storecleared');
+</code></pre>
+     */
+    addEvents : function(o){
+        var me = this;
+        me.events = me.events || {};
+        if (typeof o == 'string') {
+            var a = arguments,
+                i = a.length;
+            while(i--) {
+                me.events[a[i]] = me.events[a[i]] || TRUE;
+            }
+        } else {
+            Ext.applyIf(me.events, o);
+        }
+    },
+
+    /**
+     * Checks to see if this object has any listeners for a specified event
+     * @param {String} eventName The name of the event to check for
+     * @return {Boolean} True if the event is being listened for, else false
+     */
+    hasListener : function(eventName){
+        var e = this.events[eventName.toLowerCase()];
+        return typeof e == 'object' && e.listeners.length > 0;
+    },
+
+    /**
+     * Suspend the firing of all events. (see {@link #resumeEvents})
+     * @param {Boolean} queueSuspended Pass as true to queue up suspended events to be fired
+     * after the {@link #resumeEvents} call instead of discarding all suspended events;
+     */
+    suspendEvents : function(queueSuspended){
+        this.eventsSuspended = TRUE;
+        if(queueSuspended && !this.eventQueue){
+            this.eventQueue = [];
+        }
+    },
+
+    /**
+     * Resume firing events. (see {@link #suspendEvents})
+     * If events were suspended using the <tt><b>queueSuspended</b></tt> parameter, then all
+     * events fired during event suspension will be sent to any listeners now.
+     */
+    resumeEvents : function(){
+        var me = this,
+            queued = me.eventQueue || [];
+        me.eventsSuspended = FALSE;
+        delete me.eventQueue;
+        EACH(queued, function(e) {
+            me.fireEvent.apply(me, e);
+        });
+    }
+};
+
+var OBSERVABLE = EXTUTIL.Observable.prototype;
+/**
+ * Appends an event handler to this object (shorthand for {@link #addListener}.)
+ * @param {String}   eventName     The type of event to listen for
+ * @param {Function} handler       The method the event invokes
+ * @param {Object}   scope         (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+ * <b>If omitted, defaults to the object which fired the event.</b>
+ * @param {Object}   options       (optional) An object containing handler configuration.
+ * @method
+ */
+OBSERVABLE.on = OBSERVABLE.addListener;
+/**
+ * Removes an event handler (shorthand for {@link #removeListener}.)
+ * @param {String}   eventName     The type of event the handler was associated with.
+ * @param {Function} handler       The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object}   scope         (optional) The scope originally specified for the handler.
+ * @method
+ */
+OBSERVABLE.un = OBSERVABLE.removeListener;
+
+/**
+ * Removes <b>all</b> added captures from the Observable.
+ * @param {Observable} o The Observable to release
+ * @static
+ */
+EXTUTIL.Observable.releaseCapture = function(o){
+    o.fireEvent = OBSERVABLE.fireEvent;
+};
+
+function createTargeted(h, o, scope){
+    return function(){
+        if(o.target == arguments[0]){
+            h.apply(scope, Array.prototype.slice.call(arguments, 0));
+        }
+    };
+};
+
+function createBuffered(h, o, l, scope){
+    l.task = new EXTUTIL.DelayedTask();
+    return function(){
+        l.task.delay(o.buffer, h, scope, Array.prototype.slice.call(arguments, 0));
+    };
+};
+
+function createSingle(h, e, fn, scope){
+    return function(){
+        e.removeListener(fn, scope);
+        return h.apply(scope, arguments);
+    };
+};
+
+function createDelayed(h, o, l, scope){
+    return function(){
+        var task = new EXTUTIL.DelayedTask(),
+            args = Array.prototype.slice.call(arguments, 0);
+        if(!l.tasks) {
+            l.tasks = [];
+        }
+        l.tasks.push(task);
+        task.delay(o.delay || 10, function(){
+            l.tasks.remove(task);
+            h.apply(scope, args);
+        }, scope);
+    };
+};
+
+EXTUTIL.Event = function(obj, name){
+    this.name = name;
+    this.obj = obj;
+    this.listeners = [];
+};
+
+EXTUTIL.Event.prototype = {
+    addListener : function(fn, scope, options){
+        var me = this,
+            l;
+        scope = scope || me.obj;
+        if(!me.isListening(fn, scope)){
+            l = me.createListener(fn, scope, options);
+            if(me.firing){ // if we are currently firing this event, don't disturb the listener loop
+                me.listeners = me.listeners.slice(0);
+            }
+            me.listeners.push(l);
+        }
+    },
+
+    createListener: function(fn, scope, o){
+        o = o || {};
+        scope = scope || this.obj;
+        var l = {
+            fn: fn,
+            scope: scope,
+            options: o
+        }, h = fn;
+        if(o.target){
+            h = createTargeted(h, o, scope);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, l, scope);
+        }
+        if(o.single){
+            h = createSingle(h, this, fn, scope);
+        }
+        if(o.buffer){
+            h = createBuffered(h, o, l, scope);
+        }
+        l.fireFn = h;
+        return l;
+    },
+
+    findListener : function(fn, scope){
+        var list = this.listeners,
+            i = list.length,
+            l;
+
+        scope = scope || this.obj;
+        while(i--){
+            l = list[i];
+            if(l){
+                if(l.fn == fn && l.scope == scope){
+                    return i;
+                }
+            }
+        }
+        return -1;
+    },
+
+    isListening : function(fn, scope){
+        return this.findListener(fn, scope) != -1;
+    },
+
+    removeListener : function(fn, scope){
+        var index,
+            l,
+            k,
+            me = this,
+            ret = FALSE;
+        if((index = me.findListener(fn, scope)) != -1){
+            if (me.firing) {
+                me.listeners = me.listeners.slice(0);
+            }
+            l = me.listeners[index];
+            if(l.task) {
+                l.task.cancel();
+                delete l.task;
+            }
+            k = l.tasks && l.tasks.length;
+            if(k) {
+                while(k--) {
+                    l.tasks[k].cancel();
+                }
+                delete l.tasks;
+            }
+            me.listeners.splice(index, 1);
+            ret = TRUE;
+        }
+        return ret;
+    },
+
+    // Iterate to stop any buffered/delayed events
+    clearListeners : function(){
+        var me = this,
+            l = me.listeners,
+            i = l.length;
+        while(i--) {
+            me.removeListener(l[i].fn, l[i].scope);
+        }
+    },
+
+    fire : function(){
+        var me = this,
+            listeners = me.listeners,
+            len = listeners.length,
+            i = 0,
+            l;
+
+        if(len > 0){
+            me.firing = TRUE;
+            var args = Array.prototype.slice.call(arguments, 0);
+            for (; i < len; i++) {
+                l = listeners[i];
+                if(l && l.fireFn.apply(l.scope || me.obj || window, args) === FALSE) {
+                    return (me.firing = FALSE);
+                }
+            }
+        }
+        me.firing = FALSE;
+        return TRUE;
+    }
+
+};
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/TaskMgr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/TaskMgr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/TaskMgr.js	(revision 76)
@@ -0,0 +1,180 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.TaskRunner
+ * Provides the ability to execute one or more arbitrary tasks in a multithreaded
+ * manner.  Generally, you can use the singleton {@link Ext.TaskMgr} instead, but
+ * if needed, you can create separate instances of TaskRunner.  Any number of
+ * separate tasks can be started at any time and will run independently of each
+ * other. Example usage:
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var updateClock = function(){
+    Ext.fly('clock').update(new Date().format('g:i:s A'));
+} 
+var task = {
+    run: updateClock,
+    interval: 1000 //1 second
+}
+var runner = new Ext.util.TaskRunner();
+runner.start(task);
+
+// equivalent using TaskMgr
+Ext.TaskMgr.start({
+    run: updateClock,
+    interval: 1000
+});
+
+ * </code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * Also see {@link Ext.util.DelayedTask}. 
+ * 
+ * @constructor
+ * @param {Number} interval (optional) The minimum precision in milliseconds supported by this TaskRunner instance
+ * (defaults to 10)
+ */
+Ext.util.TaskRunner = function(interval){
+    interval = interval || 10;
+    var tasks = [], 
+    	removeQueue = [],
+    	id = 0,
+    	running = false,
+
+    	// private
+    	stopThread = function(){
+	        running = false;
+	        clearInterval(id);
+	        id = 0;
+	    },
+
+    	// private
+    	startThread = function(){
+	        if(!running){
+	            running = true;
+	            id = setInterval(runTasks, interval);
+	        }
+	    },
+
+    	// private
+    	removeTask = function(t){
+	        removeQueue.push(t);
+	        if(t.onStop){
+	            t.onStop.apply(t.scope || t);
+	        }
+	    },
+	    
+    	// private
+    	runTasks = function(){
+	    	var rqLen = removeQueue.length,
+	    		now = new Date().getTime();	    			    		
+	    
+	        if(rqLen > 0){
+	            for(var i = 0; i < rqLen; i++){
+	                tasks.remove(removeQueue[i]);
+	            }
+	            removeQueue = [];
+	            if(tasks.length < 1){
+	                stopThread();
+	                return;
+	            }
+	        }	        
+	        for(var i = 0, t, itime, rt, len = tasks.length; i < len; ++i){
+	            t = tasks[i];
+	            itime = now - t.taskRunTime;
+	            if(t.interval <= itime){
+	                rt = t.run.apply(t.scope || t, t.args || [++t.taskRunCount]);
+	                t.taskRunTime = now;
+	                if(rt === false || t.taskRunCount === t.repeat){
+	                    removeTask(t);
+	                    return;
+	                }
+	            }
+	            if(t.duration && t.duration <= (now - t.taskStartTime)){
+	                removeTask(t);
+	            }
+	        }
+	    };
+
+    /**
+     * Starts a new task.
+     * @method start
+     * @param {Object} task <p>A config object that supports the following properties:<ul>
+     * <li><code>run</code> : Function<div class="sub-desc"><p>The function to execute each time the task is invoked. The
+     * function will be called at each interval and passed the <code>args</code> argument if specified, and the
+     * current invocation count if not.</p>
+     * <p>If a particular scope (<code>this</code> reference) is required, be sure to specify it using the <code>scope</code> argument.</p>
+     * <p>Return <code>false</code> from this function to terminate the task.</p></div></li>
+     * <li><code>interval</code> : Number<div class="sub-desc">The frequency in milliseconds with which the task
+     * should be invoked.</div></li>
+     * <li><code>args</code> : Array<div class="sub-desc">(optional) An array of arguments to be passed to the function
+     * specified by <code>run</code>. If not specified, the current invocation count is passed.</div></li>
+     * <li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<tt>this</tt> reference) in which to execute the
+     * <code>run</code> function. Defaults to the task config object.</div></li>
+     * <li><code>duration</code> : Number<div class="sub-desc">(optional) The length of time in milliseconds to invoke
+     * the task before stopping automatically (defaults to indefinite).</div></li>
+     * <li><code>repeat</code> : Number<div class="sub-desc">(optional) The number of times to invoke the task before
+     * stopping automatically (defaults to indefinite).</div></li>
+     * </ul></p>
+     * <p>Before each invocation, Ext injects the property <code>taskRunCount</code> into the task object so
+     * that calculations based on the repeat count can be performed.</p>
+     * @return {Object} The task
+     */
+    this.start = function(task){
+        tasks.push(task);
+        task.taskStartTime = new Date().getTime();
+        task.taskRunTime = 0;
+        task.taskRunCount = 0;
+        startThread();
+        return task;
+    };
+
+    /**
+     * Stops an existing running task.
+     * @method stop
+     * @param {Object} task The task to stop
+     * @return {Object} The task
+     */
+    this.stop = function(task){
+        removeTask(task);
+        return task;
+    };
+
+    /**
+     * Stops all tasks that are currently running.
+     * @method stopAll
+     */
+    this.stopAll = function(){
+        stopThread();
+        for(var i = 0, len = tasks.length; i < len; i++){
+            if(tasks[i].onStop){
+                tasks[i].onStop();
+            }
+        }
+        tasks = [];
+        removeQueue = [];
+    };
+};
+
+/**
+ * @class Ext.TaskMgr
+ * @extends Ext.util.TaskRunner
+ * A static {@link Ext.util.TaskRunner} instance that can be used to start and stop arbitrary tasks.  See
+ * {@link Ext.util.TaskRunner} for supported methods and task config properties.
+ * <pre><code>
+// Start a simple clock task that updates a div once per second
+var task = {
+    run: function(){
+        Ext.fly('clock').update(new Date().format('g:i:s A'));
+    },
+    interval: 1000 //1 second
+}
+Ext.TaskMgr.start(task);
+</code></pre>
+ * <p>See the {@link #start} method for details about how to configure a task object.</p>
+ * @singleton
+ */
+Ext.TaskMgr = new Ext.util.TaskRunner();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/JSON.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/JSON.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/JSON.js	(revision 76)
@@ -0,0 +1,190 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.JSON
+ * Modified version of Douglas Crockford"s json.js that doesn"t
+ * mess with the Object prototype
+ * http://www.json.org/js.html
+ * @singleton
+ */
+Ext.util.JSON = new (function(){
+    var useHasOwn = !!{}.hasOwnProperty,
+        isNative = function() {
+            var useNative = null;
+
+            return function() {
+                if (useNative === null) {
+                    useNative = Ext.USE_NATIVE_JSON && window.JSON && JSON.toString() == '[object JSON]';
+                }
+        
+                return useNative;
+            };
+        }(),
+        pad = function(n) {
+            return n < 10 ? "0" + n : n;
+        },
+        doDecode = function(json){
+            return json ? eval("(" + json + ")") : "";    
+        },
+        doEncode = function(o){
+            if(!Ext.isDefined(o) || o === null){
+                return "null";
+            }else if(Ext.isArray(o)){
+                return encodeArray(o);
+            }else if(Ext.isDate(o)){
+                return Ext.util.JSON.encodeDate(o);
+            }else if(Ext.isString(o)){
+                return encodeString(o);
+            }else if(typeof o == "number"){
+                //don't use isNumber here, since finite checks happen inside isNumber
+                return isFinite(o) ? String(o) : "null";
+            }else if(Ext.isBoolean(o)){
+                return String(o);
+            }else {
+                var a = ["{"], b, i, v;
+                for (i in o) {
+                    // don't encode DOM objects
+                    if(!o.getElementsByTagName){
+                        if(!useHasOwn || o.hasOwnProperty(i)) {
+                            v = o[i];
+                            switch (typeof v) {
+                            case "undefined":
+                            case "function":
+                            case "unknown":
+                                break;
+                            default:
+                                if(b){
+                                    a.push(',');
+                                }
+                                a.push(doEncode(i), ":",
+                                        v === null ? "null" : doEncode(v));
+                                b = true;
+                            }
+                        }
+                    }
+                }
+                a.push("}");
+                return a.join("");
+            }    
+        },
+        m = {
+            "\b": '\\b',
+            "\t": '\\t',
+            "\n": '\\n',
+            "\f": '\\f',
+            "\r": '\\r',
+            '"' : '\\"',
+            "\\": '\\\\'
+        },
+        encodeString = function(s){
+            if (/["\\\x00-\x1f]/.test(s)) {
+                return '"' + s.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                    var c = m[b];
+                    if(c){
+                        return c;
+                    }
+                    c = b.charCodeAt();
+                    return "\\u00" +
+                        Math.floor(c / 16).toString(16) +
+                        (c % 16).toString(16);
+                }) + '"';
+            }
+            return '"' + s + '"';
+        },
+        encodeArray = function(o){
+            var a = ["["], b, i, l = o.length, v;
+                for (i = 0; i < l; i += 1) {
+                    v = o[i];
+                    switch (typeof v) {
+                        case "undefined":
+                        case "function":
+                        case "unknown":
+                            break;
+                        default:
+                            if (b) {
+                                a.push(',');
+                            }
+                            a.push(v === null ? "null" : Ext.util.JSON.encode(v));
+                            b = true;
+                    }
+                }
+                a.push("]");
+                return a.join("");
+        };
+
+    /**
+     * <p>Encodes a Date. This returns the actual string which is inserted into the JSON string as the literal expression.
+     * <b>The returned value includes enclosing double quotation marks.</b></p>
+     * <p>The default return format is "yyyy-mm-ddThh:mm:ss".</p>
+     * <p>To override this:</p><pre><code>
+Ext.util.JSON.encodeDate = function(d) {
+    return d.format('"Y-m-d"');
+};
+</code></pre>
+     * @param {Date} d The Date to encode
+     * @return {String} The string literal to use in a JSON string.
+     */
+    this.encodeDate = function(o){
+        return '"' + o.getFullYear() + "-" +
+                pad(o.getMonth() + 1) + "-" +
+                pad(o.getDate()) + "T" +
+                pad(o.getHours()) + ":" +
+                pad(o.getMinutes()) + ":" +
+                pad(o.getSeconds()) + '"';
+    };
+
+    /**
+     * Encodes an Object, Array or other value
+     * @param {Mixed} o The variable to encode
+     * @return {String} The JSON string
+     */
+    this.encode = function() {
+        var ec;
+        return function(o) {
+            if (!ec) {
+                // setup encoding function on first access
+                ec = isNative() ? JSON.stringify : doEncode;
+            }
+            return ec(o);
+        };
+    }();
+
+
+    /**
+     * Decodes (parses) a JSON string to an object. If the JSON is invalid, this function throws a SyntaxError unless the safe option is set.
+     * @param {String} json The JSON string
+     * @return {Object} The resulting object
+     */
+    this.decode = function() {
+        var dc;
+        return function(json) {
+            if (!dc) {
+                // setup decoding function on first access
+                dc = isNative() ? JSON.parse : doDecode;
+            }
+            return dc(json);
+        };
+    }();
+
+})();
+/**
+ * Shorthand for {@link Ext.util.JSON#encode}
+ * @param {Mixed} o The variable to encode
+ * @return {String} The JSON string
+ * @member Ext
+ * @method encode
+ */
+Ext.encode = Ext.util.JSON.encode;
+/**
+ * Shorthand for {@link Ext.util.JSON#decode}
+ * @param {String} json The JSON string
+ * @param {Boolean} safe (optional) Whether to return null or throw an exception if the JSON is invalid.
+ * @return {Object} The resulting object
+ * @member Ext
+ * @method decode
+ */
+Ext.decode = Ext.util.JSON.decode;
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/DelayedTask.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/DelayedTask.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/src/util/DelayedTask.js	(revision 76)
@@ -0,0 +1,70 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.DelayedTask
+ * <p> The DelayedTask class provides a convenient way to "buffer" the execution of a method,
+ * performing setTimeout where a new timeout cancels the old timeout. When called, the
+ * task will wait the specified time period before executing. If durng that time period,
+ * the task is called again, the original call will be cancelled. This continues so that
+ * the function is only called a single time for each iteration.</p>
+ * <p>This method is especially useful for things like detecting whether a user has finished
+ * typing in a text field. An example would be performing validation on a keypress. You can
+ * use this class to buffer the keypress events for a certain number of milliseconds, and
+ * perform only if they stop for that amount of time.  Usage:</p><pre><code>
+var task = new Ext.util.DelayedTask(function(){
+    alert(Ext.getDom('myInputField').value.length);
+});
+// Wait 500ms before calling our function. If the user presses another key 
+// during that 500ms, it will be cancelled and we'll wait another 500ms.
+Ext.get('myInputField').on('keypress', function(){
+    task.{@link #delay}(500); 
+});
+ * </code></pre> 
+ * <p>Note that we are using a DelayedTask here to illustrate a point. The configuration
+ * option <tt>buffer</tt> for {@link Ext.util.Observable#addListener addListener/on} will
+ * also setup a delayed task for you to buffer events.</p> 
+ * @constructor The parameters to this constructor serve as defaults and are not required.
+ * @param {Function} fn (optional) The default function to call.
+ * @param {Object} scope The default scope (The <code><b>this</b></code> reference) in which the
+ * function is called. If not specified, <code>this</code> will refer to the browser window.
+ * @param {Array} args (optional) The default Array of arguments.
+ */
+Ext.util.DelayedTask = function(fn, scope, args){
+    var me = this,
+    	id,    	
+    	call = function(){
+    		clearInterval(id);
+	        id = null;
+	        fn.apply(scope, args || []);
+	    };
+	    
+    /**
+     * Cancels any pending timeout and queues a new one
+     * @param {Number} delay The milliseconds to delay
+     * @param {Function} newFn (optional) Overrides function passed to constructor
+     * @param {Object} newScope (optional) Overrides scope passed to constructor. Remember that if no scope
+     * is specified, <code>this</code> will refer to the browser window.
+     * @param {Array} newArgs (optional) Overrides args passed to constructor
+     */
+    me.delay = function(delay, newFn, newScope, newArgs){
+        me.cancel();
+        fn = newFn || fn;
+        scope = newScope || scope;
+        args = newArgs || args;
+        id = setInterval(call, delay);
+    };
+
+    /**
+     * Cancel the last queued timeout
+     */
+    me.cancel = function(){
+        if(id){
+            clearInterval(id);
+            id = null;
+        }
+    };
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/lightbox/lightbox.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/lightbox/lightbox.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/lightbox/lightbox.js	(revision 76)
@@ -0,0 +1,366 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.ux');
+
+Ext.ux.Lightbox = (function(){
+    var els = {},
+        images = [],
+        activeImage,
+        initialized = false,
+        selectors = [];
+
+    return {
+        overlayOpacity: 0.85,
+        animate: true,
+        resizeSpeed: 8,
+        borderSize: 10,
+        labelImage: "Image",
+        labelOf: "of",
+
+        init: function() {
+            this.resizeDuration = this.animate ? ((11 - this.resizeSpeed) * 0.15) : 0;
+            this.overlayDuration = this.animate ? 0.2 : 0;
+
+            if(!initialized) {
+                Ext.apply(this, Ext.util.Observable.prototype);
+                Ext.util.Observable.constructor.call(this);
+                this.addEvents('open', 'close');
+                this.initMarkup();
+                this.initEvents();
+                initialized = true;
+            }
+        },
+
+        initMarkup: function() {
+            els.shim = Ext.DomHelper.append(document.body, {
+                tag: 'iframe',
+                id: 'ux-lightbox-shim'
+            }, true);
+            els.overlay = Ext.DomHelper.append(document.body, {
+                id: 'ux-lightbox-overlay'
+            }, true);
+            
+            var lightboxTpl = new Ext.Template(this.getTemplate());
+            els.lightbox = lightboxTpl.append(document.body, {}, true);
+
+            var ids =
+                ['outerImageContainer', 'imageContainer', 'image', 'hoverNav', 'navPrev', 'navNext', 'loading', 'loadingLink',
+                'outerDataContainer', 'dataContainer', 'data', 'details', 'caption', 'imageNumber', 'bottomNav', 'navClose'];
+
+            Ext.each(ids, function(id){
+                els[id] = Ext.get('ux-lightbox-' + id);
+            });
+
+            Ext.each([els.overlay, els.lightbox, els.shim], function(el){
+                el.setVisibilityMode(Ext.Element.DISPLAY)
+                el.hide();
+            });
+
+            var size = (this.animate ? 250 : 1) + 'px';
+            els.outerImageContainer.setStyle({
+                width: size,
+                height: size
+            });
+        },
+
+        getTemplate : function() {
+            return [
+                '<div id="ux-lightbox">',
+                    '<div id="ux-lightbox-outerImageContainer">',
+                        '<div id="ux-lightbox-imageContainer">',
+                            '<img id="ux-lightbox-image">',
+                            '<div id="ux-lightbox-hoverNav">',
+                                '<a href="#" id="ux-lightbox-navPrev"></a>',
+                                '<a href="#" id="ux-lightbox-navNext"></a>',
+                            '</div>',
+                            '<div id="ux-lightbox-loading">',
+                                '<a id="ux-lightbox-loadingLink"></a>',
+                            '</div>',
+                        '</div>',
+                    '</div>',
+                    '<div id="ux-lightbox-outerDataContainer">',
+                        '<div id="ux-lightbox-dataContainer">',
+                            '<div id="ux-lightbox-data">',
+                                '<div id="ux-lightbox-details">',
+                                    '<span id="ux-lightbox-caption"></span>',
+                                    '<span id="ux-lightbox-imageNumber"></span>',
+                                '</div>',
+                                '<div id="ux-lightbox-bottomNav">',
+                                    '<a href="#" id="ux-lightbox-navClose"></a>',
+                                '</div>',
+                            '</div>',
+                        '</div>',
+                    '</div>',
+                '</div>'
+            ];
+        },
+
+        initEvents: function() {
+            var close = function(ev) {
+                ev.preventDefault();
+                this.close();
+            };
+
+            els.overlay.on('click', close, this);
+            els.loadingLink.on('click', close, this);
+            els.navClose.on('click', close, this);
+
+            els.lightbox.on('click', function(ev) {
+                if(ev.getTarget().id == 'ux-lightbox') {
+                    this.close();
+                }
+            }, this);
+
+            els.navPrev.on('click', function(ev) {
+                ev.preventDefault();
+                this.setImage(activeImage - 1);
+            }, this);
+
+            els.navNext.on('click', function(ev) {
+                ev.preventDefault();
+                this.setImage(activeImage + 1);
+            }, this);
+        },
+
+        register: function(sel, group) {
+            if(selectors.indexOf(sel) === -1) {
+                selectors.push(sel);
+
+                Ext.fly(document).on('click', function(ev){
+                    var target = ev.getTarget(sel);
+
+                    if (target) {
+                        ev.preventDefault();
+                        this.open(target, sel, group);
+                    }
+                }, this);
+            }
+        },
+
+        open: function(image, sel, group) {
+            group = group || false;
+            this.setViewSize();
+            els.overlay.fadeIn({
+                duration: this.overlayDuration,
+                endOpacity: this.overlayOpacity,
+                callback: function() {
+                    images = [];
+
+                    var index = 0;
+                    if(!group) {
+                        images.push([image.href, image.title]);
+                    }
+                    else {
+                        var setItems = Ext.query(sel);
+                        Ext.each(setItems, function(item) {
+                            if(item.href) {
+                                images.push([item.href, item.title]);
+                            }
+                        });
+
+                        while (images[index][0] != image.href) {
+                            index++;
+                        }
+                    }
+
+                    // calculate top and left offset for the lightbox
+                    var pageScroll = Ext.fly(document).getScroll();
+
+                    var lightboxTop = pageScroll.top + (Ext.lib.Dom.getViewportHeight() / 10);
+                    var lightboxLeft = pageScroll.left;
+                    els.lightbox.setStyle({
+                        top: lightboxTop + 'px',
+                        left: lightboxLeft + 'px'
+                    }).show();
+
+                    this.setImage(index);
+                    
+                    this.fireEvent('open', images[index]);                                        
+                },
+                scope: this
+            });
+        },
+        
+        setViewSize: function(){
+            var viewSize = this.getViewSize();
+            els.overlay.setStyle({
+                width: viewSize[0] + 'px',
+                height: viewSize[1] + 'px'
+            });
+            els.shim.setStyle({
+                width: viewSize[0] + 'px',
+                height: viewSize[1] + 'px'
+            }).show();
+        },
+
+        setImage: function(index){
+            activeImage = index;
+                      
+            this.disableKeyNav();            
+            if (this.animate) {
+                els.loading.show();
+            }
+
+            els.image.hide();
+            els.hoverNav.hide();
+            els.navPrev.hide();
+            els.navNext.hide();
+            els.dataContainer.setOpacity(0.0001);
+            els.imageNumber.hide();
+
+            var preload = new Image();
+            preload.onload = (function(){
+                els.image.dom.src = images[activeImage][0];
+                this.resizeImage(preload.width, preload.height);
+            }).createDelegate(this);
+            preload.src = images[activeImage][0];
+        },
+
+        resizeImage: function(w, h){
+            var wCur = els.outerImageContainer.getWidth();
+            var hCur = els.outerImageContainer.getHeight();
+
+            var wNew = (w + this.borderSize * 2);
+            var hNew = (h + this.borderSize * 2);
+
+            var wDiff = wCur - wNew;
+            var hDiff = hCur - hNew;
+
+            var afterResize = function(){
+                els.hoverNav.setWidth(els.imageContainer.getWidth() + 'px');
+
+                els.navPrev.setHeight(h + 'px');
+                els.navNext.setHeight(h + 'px');
+
+                els.outerDataContainer.setWidth(wNew + 'px');
+
+                this.showImage();
+            };
+            
+            if (hDiff != 0 || wDiff != 0) {
+                els.outerImageContainer.shift({
+                    height: hNew,
+                    width: wNew,
+                    duration: this.resizeDuration,
+                    scope: this,
+                    callback: afterResize,
+                    delay: 50
+                });
+            }
+            else {
+                afterResize.call(this);
+            }
+        },
+
+        showImage: function(){
+            els.loading.hide();
+            els.image.fadeIn({
+                duration: this.resizeDuration,
+                scope: this,
+                callback: function(){
+                    this.updateDetails();
+                }
+            });
+            this.preloadImages();
+        },
+
+        updateDetails: function(){
+            var detailsWidth = els.data.getWidth(true) - els.navClose.getWidth() - 10;
+            els.details.setWidth((detailsWidth > 0 ? detailsWidth : 0) + 'px');
+            
+            els.caption.update(images[activeImage][1]);
+
+            els.caption.show();
+            if (images.length > 1) {
+                els.imageNumber.update(this.labelImage + ' ' + (activeImage + 1) + ' ' + this.labelOf + '  ' + images.length);
+                els.imageNumber.show();
+            }
+
+            els.dataContainer.fadeIn({
+                duration: this.resizeDuration/2,
+                scope: this,
+                callback: function() {
+                    var viewSize = this.getViewSize();
+                    els.overlay.setHeight(viewSize[1] + 'px');
+                    this.updateNav();
+                }
+            });
+        },
+
+        updateNav: function(){
+            this.enableKeyNav();
+
+            els.hoverNav.show();
+
+            // if not first image in set, display prev image button
+            if (activeImage > 0)
+                els.navPrev.show();
+
+            // if not last image in set, display next image button
+            if (activeImage < (images.length - 1))
+                els.navNext.show();
+        },
+
+        enableKeyNav: function() {
+            Ext.fly(document).on('keydown', this.keyNavAction, this);
+        },
+
+        disableKeyNav: function() {
+            Ext.fly(document).un('keydown', this.keyNavAction, this);
+        },
+
+        keyNavAction: function(ev) {
+            var keyCode = ev.getKey();
+
+            if (
+                keyCode == 88 || // x
+                keyCode == 67 || // c
+                keyCode == 27
+            ) {
+                this.close();
+            }
+            else if (keyCode == 80 || keyCode == 37){ // display previous image
+                if (activeImage != 0){
+                    this.setImage(activeImage - 1);
+                }
+            }
+            else if (keyCode == 78 || keyCode == 39){ // display next image
+                if (activeImage != (images.length - 1)){
+                    this.setImage(activeImage + 1);
+                }
+            }
+        },
+
+        preloadImages: function(){
+            var next, prev;
+            if (images.length > activeImage + 1) {
+                next = new Image();
+                next.src = images[activeImage + 1][0];
+            }
+            if (activeImage > 0) {
+                prev = new Image();
+                prev.src = images[activeImage - 1][0];
+            }
+        },
+
+        close: function(){
+            this.disableKeyNav();
+            els.lightbox.hide();
+            els.overlay.fadeOut({
+                duration: this.overlayDuration
+            });
+            els.shim.hide();
+            this.fireEvent('close', activeImage);
+        },
+
+        getViewSize: function() {
+            return [Ext.lib.Dom.getViewWidth(), Ext.lib.Dom.getViewHeight()];
+        }
+    }
+})();
+
+Ext.onReady(Ext.ux.Lightbox.init, Ext.ux.Lightbox);
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/menu/menu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/menu/menu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/menu/menu.js	(revision 76)
@@ -0,0 +1,258 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * Ext Core Library Examples 3.0 Beta
+ * http://extjs.com/
+ * Copyright(c) 2006-2009, Ext JS, LLC.
+ * 
+ * The MIT License
+ * 
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ * 
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ * 
+ */
+
+Ext.ns('Ext.ux');
+
+Ext.ux.Menu = Ext.extend(Ext.util.Observable, {
+    direction: 'horizontal',
+    delay: 0.2,
+    autoWidth: true,
+    transitionType: 'fade',
+    transitionDuration: 0.3,
+    animate: true,
+    currentClass: 'current',
+
+    constructor: function(elId, config) {
+        config = config || {};
+        Ext.apply(this, config);
+
+        Ext.ux.Menu.superclass.constructor.call(this, config);
+
+        this.addEvents(
+            'show',
+            'hide',
+            'click'
+        );
+
+        this.el = Ext.get(elId);
+
+        this.initMarkup();
+        this.initEvents();
+
+        this.setCurrent();
+    },
+
+    initMarkup: function(){
+        this.container = this.el.wrap({cls: 'ux-menu-container', style: 'z-index: ' + --Ext.ux.Menu.zSeed});
+        this.items = this.el.select('li');
+
+        this.el.addClass('ux-menu ux-menu-' + this.direction);
+        this.el.select('>li').addClass('ux-menu-item-main');
+
+        this.el.select('li:has(>ul)').addClass('ux-menu-item-parent').each(function(item) {
+            item.down('a')
+                .addClass('ux-menu-link-parent')
+                .createChild({tag: 'span', cls: 'ux-menu-arrow'});
+        });
+        
+        this.el.select('li:first-child>a').addClass('ux-menu-link-first');
+        this.el.select('li:last-child>a').addClass('ux-menu-link-last');
+
+        // create clear fixes for the floating stuff
+        this.container.addClass('ux-menu-clearfix');
+
+        // if autoWidth make every submenu as wide as its biggest child;
+        if(this.autoWidth) {
+            this.doAutoWidth();
+        }
+
+        var subs = this.el.select('ul');
+        subs.addClass('ux-menu-sub');
+        
+        //ie6 and ie7/ie8 quirksmode need iframes behind the submenus
+        if(Ext.isBorderBox || Ext.isIE7) {
+            subs.each(function(item) {
+                item.parent().createChild({tag: 'iframe', cls: 'ux-menu-ie-iframe'})
+                    .setWidth(item.getWidth())
+                    .setHeight(item.getHeight());
+            });
+        }
+        
+        subs.addClass('ux-menu-hidden');
+    },
+
+    initEvents: function() {
+        this.showTask = new Ext.util.DelayedTask(this.showMenu, this);
+        this.hideTask = new Ext.util.DelayedTask(function() {
+            this.showTask.cancel();
+            this.hideAll();
+            this.fireEvent('hide');
+        }, this);
+
+        this.el.hover(function() {
+            this.hideTask.cancel();
+        }, function() {
+            this.hideTask.delay(this.delay*1000);
+        }, this);
+
+        // for each item that has a submenu, create a mouseenter function that shows its submenu
+        // delay 5 to make sure enter is fired after mouseover
+        this.el.select('li.ux-menu-item-parent').on('mouseenter', this.onParentEnter, false, {me: this, delay: 5});
+
+        // listen for mouseover events on items to hide other items submenus and remove hovers
+        this.el.on('mouseover', function(ev, t) {
+            this.manageSiblings(t);
+            // if this item does not have a submenu, the showMenu task for a sibling could potentially still be fired, so cancel it
+            if(!Ext.fly(t).hasClass('ux-menu-item-parent')) {
+                this.showTask.cancel();
+            }
+        }, this, {delegate: 'li'});
+
+        this.el.on('click', function(ev, t) {
+            return this.fireEvent('click', ev, t, this);
+        }, this, {delegate: 'a'})
+    },
+
+    onParentEnter: function(ev, link, o) {
+        var item = Ext.get(this),
+            me = o.me;
+
+        // if this item is in a submenu and contains a submenu, check if the submenu is not still animating
+        if(!item.hasClass('ux-menu-item-main') && item.parent('ul').hasActiveFx()) {
+            item.parent('ul').stopFx(true);
+        }
+
+        // if submenu is already shown dont do anything
+        if(!item.child('ul').hasClass('ux-menu-hidden')) {
+            return;
+        }
+        
+        me.showTask.delay(me.delay*1000, false, false, [item]);   
+    },
+
+    showMenu : function(item) {
+        var menu = item.child('ul'),
+            x = y = 0;
+
+        item.select('>a').addClass('ux-menu-link-hover');
+
+        // some different configurations require different positioning
+        if(this.direction == 'horizontal' && item.hasClass('ux-menu-item-main')) {
+            y = item.getHeight()+1;
+        }
+        else {
+            x = item.getWidth()+1;
+        }
+
+        // if its ie, force a repaint of the submenu
+        if(Ext.isIE) {
+            menu.select('ul').addClass('ux-menu-hidden');
+            // ie bugs...
+            if(Ext.isBorderBox || Ext.isIE7) {
+                item.down('iframe').setStyle({left: x + 'px', top: y + 'px', display: 'block'});
+            }
+        }
+
+        menu.setStyle({left: x + 'px', top: y + 'px'}).removeClass('ux-menu-hidden');
+
+        if(this.animate) {
+            switch(this.transitionType) {
+                case 'slide':
+                    if(this.direction == 'horizontal' && item.hasClass('ux-menu-item-main')) {
+                        menu.slideIn('t', {
+                            duration: this.transitionDuration
+                        });
+                    }
+                    else {
+                        menu.slideIn('l', {
+                            duration: this.transitionDuration
+                        });
+                    }
+                break;
+
+                default:
+                    menu.setOpacity(0.001).fadeIn({
+                        duration: this.transitionDuration
+                    });
+                break
+            }
+        }
+        
+        this.fireEvent('show', item, menu, this);
+    },
+
+    manageSiblings: function(item) {
+        var item = Ext.get(item);
+        item.parent().select('li.ux-menu-item-parent').each(function(child) {
+            if(child.dom.id !== item.dom.id) {
+                child.select('>a').removeClass('ux-menu-link-hover');
+                child.select('ul').stopFx(false).addClass('ux-menu-hidden');
+                if (Ext.isBorderBox || Ext.isIE7) {
+                    child.select('iframe').setStyle('display', 'none');
+                }
+            }
+        });
+    },
+
+    hideAll: function() {
+        this.manageSiblings(this.el);
+    },
+    
+    setCurrent: function() {
+        var els = this.el.query('.' + this.currentClass);
+        if(!els.length) {
+            return;
+        }
+        var item = Ext.get(els[els.length-1]).removeClass(this.currentClass).findParent('li', null, true);
+        while(item && item.parent('.ux-menu')) {
+            item.down('a').addClass(this.currentClass);
+            item = item.parent('li');
+        }
+    },
+
+    doAutoWidth: function() {
+        var fixWidth = function(sub) {
+            var widest = 0;
+            var items = sub.select('>li');
+
+            sub.setStyle({width: 3000 + 'px'});
+            items.each(function(item) {
+                widest = Math.max(widest, item.getWidth());
+            });
+
+            widest = Ext.isIE ? widest + 1 : widest;
+            items.setWidth(widest + 'px');
+            sub.setWidth(widest + 'px');
+        }
+
+        if(this.direction == 'vertical') {
+            this.container.select('ul').each(fixWidth);
+        }
+        else {
+            this.el.select('ul').each(fixWidth);
+        }
+        
+    }
+});
+
+Ext.ux.Menu.zSeed = 10000;
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/rating/rating.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/rating/rating.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/rating/rating.js	(revision 76)
@@ -0,0 +1,267 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.ux');
+
+Ext.ux.Rating = Ext.extend(Ext.util.Observable, {
+	// Configuration options
+    starWidth: 16,
+    split: 1,
+    resetValue: '',
+	defaultSelected: -1,	
+    selected: -1,
+    showTitles: true,    
+    
+	// Our class constructor
+    constructor : function(element, config) {
+        Ext.apply(this, config);
+        Ext.ux.Rating.superclass.constructor.call(this);
+        
+        this.addEvents(
+            'change',
+            'reset'
+        );
+        
+        this.el = Ext.get(element);
+        this.init();
+    },
+    
+    init : function() {
+        var me = this;
+        
+		// Some arrays we are going to store data in
+        this.values = [];
+        this.titles = [];
+        this.stars = [];
+		
+		// We create a container to put all our stars into      
+        this.container = this.el.createChild({
+            cls: 'ux-rating-container ux-rating-clearfix'
+        });
+				
+        if(this.canReset) {
+            this.resetEl = this.container.createChild({
+                cls: 'ux-rating-reset',
+                cn: [{
+                    tag: 'a',
+                    title: this.showTitles ? (this.resetTitle || 'Reset your vote') : '',
+                    html: 'Reset'
+                }]
+            });
+            this.resetEl.visibilityMode = Ext.Element.DISPLAY;
+            
+            this.resetEl.hover(function() {
+                Ext.fly(this).addClass('ux-rating-reset-hover');
+            }, function() {
+                Ext.fly(this).removeClass('ux-rating-reset-hover');
+            });
+            
+            this.resetEl.on('click', this.reset, this);
+        }
+
+		// We use DomQuery to select the radio buttons
+		this.radioBoxes = this.el.select('input[type=radio]');
+		// Then we can loop over the CompositeElement using each
+        this.radioBoxes.each(this.initStar, this);
+        
+		// We use DomHelper to create our hidden input
+		this.input = this.container.createChild({
+			tag: 'input',
+			type: 'hidden',
+			name: this.name,
+			value: this.values[this.defaultSelected] || this.resetValue
+		});
+		
+		// Lets remove all the radio buttons from the DOM
+		this.radioBoxes.remove();
+		
+        this.select(this.defaultSelected === undefined ? false : this.defaultSelected)
+
+        if(this.disabled) {
+            this.disable();
+        } else {
+			// Enable will set up our event listeners
+            this.enable();
+        }
+    },
+
+    initStar : function(item, all, i) {
+        var sw = Math.floor(this.starWidth / this.split);
+        
+		// We use the name and disabled attributes of the first radio button 
+		if(i == 0) {
+	        this.name = item.dom.name;
+	        this.disabled = item.dom.disabled;		
+		}
+		
+		// Saving the value and title for this star
+        this.values[i] = item.dom.value;
+        this.titles[i] = item.dom.title;
+
+        if(item.dom.checked) {
+            this.defaultSelected = i;
+        }
+        
+		// Now actually create the star!
+        var star = this.container.createChild({
+            cls: 'ux-rating-star'
+        });
+        
+        var starLink = star.createChild({
+            tag: 'a',
+            html: this.values[i],
+            title: this.showTitles ? this.titles[i] : ''
+        });
+        
+        // Prepare division settings
+        if(this.split) {
+          var odd = (i % this.split);              
+          star.setWidth(sw);
+          starLink.setStyle('margin-left', '-' + (odd * sw) + 'px');
+        }
+
+		// Save the reference to this star so we can easily access it later
+        this.stars.push(star.dom);
+    },
+    
+    onStarClick : function(ev, t) {
+        if(!this.disabled) {
+            this.select(this.stars.indexOf(t));
+        }
+    },
+
+    onStarOver : function(ev, t) {
+        if(!this.disabled) {
+            this.fillTo(this.stars.indexOf(t), true);
+        }        
+    },
+    
+    onStarOut : function(ev, t) {
+        if(!this.disabled) {
+            this.fillTo(this.selected, false);            
+        }
+    },
+    
+    reset : function(ev, t) {
+        this.select(-1);
+    },
+    
+    select : function(index) {
+        if(index === false || index === -1) {
+            // remove current selection in el
+            this.value = this.resetValue;
+            this.title = "";
+			this.input.dom.value = '';    
+            
+            if(this.canReset) {
+                this.resetEl.setOpacity(0.5);
+            }
+            
+            this.fillNone();
+            
+            if(this.selected !== -1) {
+                this.fireEvent('change', this, this.values[index], this.stars[index]);              
+            }
+            this.selected = -1;            
+        }
+        else if(index !== this.selected) {
+			// Update some properties         
+            this.selected = index;
+            this.value = this.values[index];
+            this.title = this.titles[index];
+			
+			// Set the value of our hidden input so the rating can be submitted			
+			this.input.dom.value = this.value;
+			
+            if(this.canReset) {
+                this.resetEl.setOpacity(0.99);
+            }
+            
+			// the fillTo() method will fill the stars up until the selected one        
+            this.fillTo(index, false);
+            
+			// Lets also not forget to fire our custom event!
+            this.fireEvent('change', this, this.values[index], this.stars[index]);            
+        }     
+    },
+    
+    fillTo : function(index, hover) {
+        if (index != -1) {
+            var addClass = hover ? 'ux-rating-star-hover' : 'ux-rating-star-on';
+            var removeClass = hover ? 'ux-rating-star-on' : 'ux-rating-star-hover';
+             
+			// We add a css class to each star up until the selected one   
+            Ext.each(this.stars.slice(0, index+1), function() {
+                Ext.fly(this).removeClass(removeClass).addClass(addClass);
+            });
+
+			// And then remove the same class from all the stars after this one
+            Ext.each(this.stars.slice(index+1), function() {
+                Ext.fly(this).removeClass([removeClass, addClass]);
+            });
+        }
+        else {
+            this.fillNone();
+        }        
+    },
+    
+    fillNone : function() {
+        this.container.select('.ux-rating-star').removeClass(['ux-rating-star-hover', 'ux-rating-star-on']);
+    },
+
+    enable : function() {		
+        if(this.canReset) {
+            this.resetEl.show();
+        }
+        
+        this.input.dom.disabled = null;
+        this.disabled = false;
+        
+        this.container.removeClass('ux-rating-disabled');
+ 
+		// We will be using the technique of event delegation by listening
+    	// for bubbled up events on the container       
+        this.container.on({
+            click: this.onStarClick, 
+            mouseover: this.onStarOver,
+            mouseout: this.onStarOut,
+            scope: this,
+            delegate: 'div.ux-rating-star'
+        });        
+    },
+	    
+    disable : function() {
+        if(this.canReset) {
+            this.resetEl.hide();
+        }
+        
+        this.input.dom.disabled = true;
+        this.disabled = true;
+        
+        this.container.addClass('ux-rating-disabled');
+
+        this.container.un({
+            click: this.onStarClick, 
+            mouseover: this.onStarOver,
+            mouseout: this.onStarOut,
+            scope: this,
+            delegate: 'div.ux-rating-star'
+        });        
+    },
+    
+    getValue : function() {
+        return this.values[this.selected] || this.resetValue;
+    },
+	
+	destroy : function() {
+		this.disable();
+		this.container.remove();
+		this.radioBoxes.appendTo(this.el);
+		if(this.selected !== -1) {
+			this.radioBoxes.elements[this.selected].checked = true;
+		}
+	}
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/jsonp/jsonp.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/jsonp/jsonp.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/jsonp/jsonp.js	(revision 76)
@@ -0,0 +1,78 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.ux');
+
+Ext.ux.JSONP = (function(){
+    var _queue = [],
+        _current = null,
+        _nextRequest = function() {
+            _current = null;
+            if(_queue.length) {
+                _current = _queue.shift();
+    			_current.script.src = _current.url + '?' + _current.params;
+    			document.getElementsByTagName('head')[0].appendChild(_current.script);
+            }
+        };
+
+    return {
+        request: function(url, o) {
+            if(!url) {
+                return;
+            }
+            var me = this;
+
+            o.params = o.params || {};
+            if(o.callbackKey) {
+                o.params[o.callbackKey] = 'Ext.ux.JSONP.callback';
+            }
+            var params = Ext.urlEncode(o.params);
+
+            var script = document.createElement('script');
+			script.type = 'text/javascript';
+
+            if(o.isRawJSON) {
+                if(Ext.isIE) {
+                    Ext.fly(script).on('readystatechange', function() {
+                        if(script.readyState == 'complete') {
+                            var data = script.innerHTML;
+                            if(data.length) {
+                                me.callback(Ext.decode(data));
+                            }
+                        }
+                    });
+                }
+                else {
+                     Ext.fly(script).on('load', function() {
+                        var data = script.innerHTML;
+                        if(data.length) {
+                            me.callback(Ext.decode(data));
+                        }
+                    });
+                }
+            }
+
+            _queue.push({
+                url: url,
+                script: script,
+                callback: o.callback || function(){},
+                scope: o.scope || window,
+                params: params || null
+            });
+
+            if(!_current) {
+                _nextRequest();
+            }
+        },
+
+        callback: function(json) {
+            _current.callback.apply(_current.scope, [json]);
+            Ext.fly(_current.script).removeAllListeners();
+            document.getElementsByTagName('head')[0].removeChild(_current.script);
+            _nextRequest();
+        }
+    }
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/tabs/tabs.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/tabs/tabs.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/tabs/tabs.js	(revision 76)
@@ -0,0 +1,79 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.ux');
+
+Ext.ux.Tabs = Ext.extend(Ext.util.Observable, {
+	// Configuration options
+    activeTab: 0,
+    
+	// Our class constructor
+    constructor : function(element, config) {
+        Ext.apply(this, config);
+        Ext.ux.Tabs.superclass.constructor.call(this);
+        
+        this.addEvents(
+            'beforetabchange',
+            'tabchange'
+        );
+        
+        this.el = Ext.get(element);
+        this.init();
+    },
+    
+    init : function() {
+        var me = this;
+
+		this.el.addClass('ux-tabs-container');
+		
+		this.tabStrip = this.el.child('ul');
+		this.tabStrip.addClass('ux-tabs-strip');
+		
+		this.tabStrip.on('click', this.onStripClick, this, {delegate: 'a'});
+		
+		this.tabs = this.tabStrip.select('> li');
+		this.cards = this.el.select('> div');
+		
+		this.cardsContainer = this.el.createChild({
+			cls: 'ux-tabs-cards'
+		});		
+		this.cardsContainer.setWidth(this.el.getWidth());
+		
+		this.cards.addClass('ux-tabs-card');
+		this.cards.appendTo(this.cardsContainer);
+		
+		this.el.createChild({
+			cls: 'ux-tabs-clearfix'
+		});
+		
+		this.setActiveTab(this.activeTab || 0);
+	},
+	
+	onStripClick : function(ev, t) {
+		if(t && t.href && t.href.indexOf('#')) {
+			ev.preventDefault();			
+			this.setActiveTab(t.href.split('#')[1]);
+		}
+	},
+	
+	setActiveTab : function(tab) {
+		var card;		
+		if(Ext.isString(tab)) {
+			card = Ext.get(tab);
+			tab = this.tabStrip.child('a[href=#' + tab + ']').parent();
+		}
+		else if (Ext.isNumber(tab)) {
+			tab = this.tabs.item(tab);
+			card = Ext.get(tab.first().dom.href.split('#')[1]);
+		}
+		
+		if(tab && card && this.fireEvent('beforetabchange', tab, card) !== false) {
+			card.radioClass('ux-tabs-card-active');
+			tab.radioClass('ux-tabs-tab-active');
+			this.fireEvent('tabchange', tab, card);
+		}
+	}
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/carousel/carousel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/carousel/carousel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/ext-core/examples/carousel/carousel.js	(revision 76)
@@ -0,0 +1,333 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.ux');
+
+Ext.ux.Carousel = Ext.extend(Ext.util.Observable, {
+    interval: 3,
+    transitionDuration: 1,
+    transitionType: 'carousel',
+    transitionEasing: 'easeOut',
+    itemSelector: 'img',
+    activeSlide: 0,
+    autoPlay: false,
+    showPlayButton: false,
+    pauseOnNavigate: false,
+    wrap: false,
+    freezeOnHover: false,
+    navigationOnHover: false,
+    hideNavigation: false,
+    width: null,
+    height: null,
+
+    constructor: function(elId, config) {
+        config = config || {};
+        Ext.apply(this, config);
+
+        Ext.ux.Carousel.superclass.constructor.call(this, config);
+
+        this.addEvents(
+            'beforeprev',
+            'prev',
+            'beforenext',
+            'next',
+            'change',
+            'play',
+            'pause',
+            'freeze',
+            'unfreeze'
+        );
+
+        this.el = Ext.get(elId);
+        this.slides = this.els = [];
+        
+        if(this.autoPlay || this.showPlayButton) {
+            this.wrap = true;
+        };
+
+        if(this.autoPlay && typeof config.showPlayButton === 'undefined') {
+            this.showPlayButton = true;
+        }
+
+        this.initMarkup();
+        this.initEvents();
+
+        if(this.carouselSize > 0) {
+            this.refresh();
+        }
+    },
+
+    initMarkup: function() {
+        var dh = Ext.DomHelper;
+        
+        this.carouselSize = 0;
+        var items = this.el.select(this.itemSelector);
+        this.els.container = dh.append(this.el, {cls: 'ux-carousel-container'}, true);
+        this.els.slidesWrap = dh.append(this.els.container, {cls: 'ux-carousel-slides-wrap'}, true);
+
+        this.els.navigation = dh.append(this.els.container, {cls: 'ux-carousel-nav'}, true).hide();
+        this.els.caption = dh.append(this.els.navigation, {tag: 'h2', cls: 'ux-carousel-caption'}, true);
+        this.els.navNext = dh.append(this.els.navigation, {tag: 'a', href: '#', cls: 'ux-carousel-nav-next'}, true);
+        if(this.showPlayButton) {
+            this.els.navPlay = dh.append(this.els.navigation, {tag: 'a', href: '#', cls: 'ux-carousel-nav-play'}, true)
+        }
+        this.els.navPrev = dh.append(this.els.navigation, {tag: 'a', href: '#', cls: 'ux-carousel-nav-prev'}, true);
+
+        // set the dimensions of the container
+        this.slideWidth = this.width || this.el.getWidth(true);
+        this.slideHeight = this.height || this.el.getHeight(true);
+        this.els.container.setStyle({
+            width: this.slideWidth + 'px',
+            height: this.slideHeight + 'px'
+        });
+
+        this.els.caption.setWidth((this.slideWidth - (this.els.navNext.getWidth()*2) - (this.showPlayButton ? this.els.navPlay.getWidth() : 0) - 20) + 'px')
+        
+        items.appendTo(this.els.slidesWrap).each(function(item) {
+            item = item.wrap({cls: 'ux-carousel-slide'});
+            this.slides.push(item);
+            item.setWidth(this.slideWidth + 'px').setHeight(this.slideHeight + 'px');
+        }, this);
+        this.carouselSize = this.slides.length;
+        if(this.navigationOnHover) {
+            this.els.navigation.setStyle('top', (-1*this.els.navigation.getHeight()) + 'px');
+        }
+        this.el.clip();
+    },
+
+    initEvents: function() {
+        this.els.navPrev.on('click', function(ev) {
+            ev.preventDefault();
+            var target = ev.getTarget();
+            target.blur();            
+            if(Ext.fly(target).hasClass('ux-carousel-nav-disabled')) return;
+            this.prev();
+        }, this);
+
+        this.els.navNext.on('click', function(ev) {
+            ev.preventDefault();
+            var target = ev.getTarget();
+            target.blur();
+            if(Ext.fly(target).hasClass('ux-carousel-nav-disabled')) return;
+            this.next();
+        }, this);
+
+        if(this.showPlayButton) {
+            this.els.navPlay.on('click', function(ev){
+                ev.preventDefault();
+                ev.getTarget().blur();
+                if(this.playing) {
+                    this.pause();
+                }
+                else {
+                    this.play();
+                }
+            }, this);
+        };
+
+        if(this.freezeOnHover) {
+            this.els.container.on('mouseenter', function(){
+                if(this.playing) {
+                    this.fireEvent('freeze', this.slides[this.activeSlide]);
+                    Ext.TaskMgr.stop(this.playTask);
+                }
+            }, this);
+            this.els.container.on('mouseleave', function(){
+                if(this.playing) {
+                    this.fireEvent('unfreeze', this.slides[this.activeSlide]);
+                    Ext.TaskMgr.start(this.playTask);
+                }
+            }, this, {buffer: (this.interval/2)*1000});
+        };
+
+        if(this.navigationOnHover) {
+            this.els.container.on('mouseenter', function(){
+                if(!this.navigationShown) {
+                    this.navigationShown = true;
+                    this.els.navigation.stopFx(false).shift({
+                        y: this.els.container.getY(),
+                        duration: this.transitionDuration
+                    })
+                }
+            }, this);
+
+            this.els.container.on('mouseleave', function(){
+                if(this.navigationShown) {
+                    this.navigationShown = false;
+                    this.els.navigation.stopFx(false).shift({
+                        y: this.els.navigation.getHeight() - this.els.container.getY(),
+                        duration: this.transitionDuration
+                    })
+                }
+            }, this);
+        }
+
+        if(this.interval && this.autoPlay) {
+            this.play();
+        };
+    },
+
+    prev: function() {
+        if (this.fireEvent('beforeprev') === false) {
+            return;
+        }
+        if(this.pauseOnNavigate) {
+            this.pause();
+        }
+        this.setSlide(this.activeSlide - 1);
+
+        this.fireEvent('prev', this.activeSlide);        
+        return this; 
+    },
+    
+    next: function() {
+        if(this.fireEvent('beforenext') === false) {
+            return;
+        }
+        if(this.pauseOnNavigate) {
+            this.pause();
+        }
+        this.setSlide(this.activeSlide + 1);
+
+        this.fireEvent('next', this.activeSlide);        
+        return this;         
+    },
+
+    play: function() {
+        if(!this.playing) {
+            this.playTask = this.playTask || {
+                run: function() {
+                    this.playing = true;
+                    this.setSlide(this.activeSlide+1);
+                },
+                interval: this.interval*1000,
+                scope: this
+            };
+            
+            this.playTaskBuffer = this.playTaskBuffer || new Ext.util.DelayedTask(function() {
+                Ext.TaskMgr.start(this.playTask);
+            }, this);
+
+            this.playTaskBuffer.delay(this.interval*1000);
+            this.playing = true;
+            if(this.showPlayButton) {
+                this.els.navPlay.addClass('ux-carousel-playing');
+            }
+            this.fireEvent('play');
+        }        
+        return this;
+    },
+
+    pause: function() {
+        if(this.playing) {
+            Ext.TaskMgr.stop(this.playTask);
+            this.playTaskBuffer.cancel();
+            this.playing = false;
+            if(this.showPlayButton) {
+                this.els.navPlay.removeClass('ux-carousel-playing');
+            }
+            this.fireEvent('pause');
+        }        
+        return this;
+    },
+        
+    clear: function() {
+        this.els.slidesWrap.update('');
+        this.slides = [];
+        this.carouselSize = 0;
+        this.pause();
+        return this;
+    },
+    
+    add: function(el, refresh) {
+        var item = Ext.fly(el).appendTo(this.els.slidesWrap).wrap({cls: 'ux-carousel-slide'});
+        item.setWidth(this.slideWidth + 'px').setHeight(this.slideHeight + 'px');
+        this.slides.push(item);                        
+        if(refresh) {
+            this.refresh();
+        }        
+        return this;
+    },
+    
+    refresh: function() {
+        this.carouselSize = this.slides.length;
+        this.els.slidesWrap.setWidth((this.slideWidth * this.carouselSize) + 'px');
+        if(this.carouselSize > 0) {
+            if(!this.hideNavigation) this.els.navigation.show();
+            this.activeSlide = 0;
+            this.setSlide(0, true);
+        }                
+        return this;        
+    },
+    
+    setSlide: function(index, initial) {
+        if(!this.wrap && !this.slides[index]) {
+            return;
+        }
+        else if(this.wrap) {
+            if(index < 0) {
+                index = this.carouselSize-1;
+            }
+            else if(index > this.carouselSize-1) {
+                index = 0;
+            }
+        }
+        if(!this.slides[index]) {
+            return;
+        }
+
+        this.els.caption.update(this.slides[index].child(':first-child', true).title || '');
+        var offset = index * this.slideWidth;
+        if (!initial) {
+            switch (this.transitionType) {
+                case 'fade':
+                    this.slides[index].setOpacity(0);
+                    this.slides[this.activeSlide].stopFx(false).fadeOut({
+                        duration: this.transitionDuration / 2,
+                        callback: function(){
+                            this.els.slidesWrap.setStyle('left', (-1 * offset) + 'px');
+                            this.slides[this.activeSlide].setOpacity(1);
+                            this.slides[index].fadeIn({
+                                duration: this.transitionDuration / 2
+                            });
+                        },
+                        scope: this
+                    })
+                    break;
+
+                default:
+                    var xNew = (-1 * offset) + this.els.container.getX();
+                    this.els.slidesWrap.stopFx(false);
+                    this.els.slidesWrap.shift({
+                        duration: this.transitionDuration,
+                        x: xNew,
+                        easing: this.transitionEasing
+                    });
+                    break;
+            }
+        }
+        else {
+            this.els.slidesWrap.setStyle('left', '0');
+        }
+
+        this.activeSlide = index;
+        this.updateNav();
+        this.fireEvent('change', this.slides[index], index);
+    },
+
+    updateNav: function() {
+        this.els.navPrev.removeClass('ux-carousel-nav-disabled');
+        this.els.navNext.removeClass('ux-carousel-nav-disabled');
+        if(!this.wrap) {
+            if(this.activeSlide === 0) {
+                this.els.navPrev.addClass('ux-carousel-nav-disabled');
+            }
+            if(this.activeSlide === this.carouselSize-1) {
+                this.els.navNext.addClass('ux-carousel-nav-disabled');
+            }
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTip.js	(revision 76)
@@ -0,0 +1,221 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.QuickTip
+ * @extends Ext.ToolTip
+ * @xtype quicktip
+ * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
+ * {@link Ext.QuickTips} instance.  See the QuickTips class header for additional usage details and examples.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.QuickTip = Ext.extend(Ext.ToolTip, {
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
+     */
+    /**
+     * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
+     */
+    interceptTitles : false,
+
+    // private
+    tagConfig : {
+        namespace : "ext",
+        attribute : "qtip",
+        width : "qwidth",
+        target : "target",
+        title : "qtitle",
+        hide : "hide",
+        cls : "qclass",
+        align : "qalign",
+        anchor : "anchor"
+    },
+
+    // private
+    initComponent : function(){
+        this.target = this.target || Ext.getDoc();
+        this.targets = this.targets || {};
+        Ext.QuickTip.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Configures a new quick tip instance and assigns it to a target element.  The following config values are
+     * supported (for example usage, see the {@link Ext.QuickTips} class header):
+     * <div class="mdetail-params"><ul>
+     * <li>autoHide</li>
+     * <li>cls</li>
+     * <li>dismissDelay (overrides the singleton value)</li>
+     * <li>target (required)</li>
+     * <li>text (required)</li>
+     * <li>title</li>
+     * <li>width</li></ul></div>
+     * @param {Object} config The config object
+     */
+    register : function(config){
+        var cs = Ext.isArray(config) ? config : arguments;
+        for(var i = 0, len = cs.length; i < len; i++){
+            var c = cs[i];
+            var target = c.target;
+            if(target){
+                if(Ext.isArray(target)){
+                    for(var j = 0, jlen = target.length; j < jlen; j++){
+                        this.targets[Ext.id(target[j])] = c;
+                    }
+                } else{
+                    this.targets[Ext.id(target)] = c;
+                }
+            }
+        }
+    },
+
+    /**
+     * Removes this quick tip from its element and destroys it.
+     * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+     */
+    unregister : function(el){
+        delete this.targets[Ext.id(el)];
+    },
+    
+    /**
+     * Hides a visible tip or cancels an impending show for a particular element.
+     * @param {String/HTMLElement/Element} el The element that is the target of the tip.
+     */
+    cancelShow: function(el){
+        var at = this.activeTarget;
+        el = Ext.get(el).dom;
+        if(this.isVisible()){
+            if(at && at.el == el){
+                this.hide();
+            }
+        }else if(at && at.el == el){
+            this.clearTimer('show');
+        }
+    },
+    
+    getTipCfg: function(e) {
+        var t = e.getTarget(), 
+            ttp, 
+            cfg;
+        if(this.interceptTitles && t.title && Ext.isString(t.title)){
+            ttp = t.title;
+            t.qtip = ttp;
+            t.removeAttribute("title");
+            e.preventDefault();
+        }else{
+            cfg = this.tagConfig;
+            ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
+        }
+        return ttp;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled){
+            return;
+        }
+        this.targetXY = e.getXY();
+        var t = e.getTarget();
+        if(!t || t.nodeType !== 1 || t == document || t == document.body){
+            return;
+        }
+        if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
+            this.clearTimer('hide');
+            this.show();
+            return;
+        }
+        if(t && this.targets[t.id]){
+            this.activeTarget = this.targets[t.id];
+            this.activeTarget.el = t;
+            this.anchor = this.activeTarget.anchor;
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+            return;
+        }
+        var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
+        if(ttp = this.getTipCfg(e)){
+            var autoHide = et.getAttribute(cfg.hide, ns);
+            this.activeTarget = {
+                el: t,
+                text: ttp,
+                width: et.getAttribute(cfg.width, ns),
+                autoHide: autoHide != "user" && autoHide !== 'false',
+                title: et.getAttribute(cfg.title, ns),
+                cls: et.getAttribute(cfg.cls, ns),
+                align: et.getAttribute(cfg.align, ns)
+                
+            };
+            this.anchor = et.getAttribute(cfg.anchor, ns);
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+
+        // If moving within the current target, and it does not have a new tip, ignore the mouseout
+        if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
+            return;
+        }
+
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        var t = this.activeTarget;
+        if(t){
+            if(!this.rendered){
+                this.render(Ext.getBody());
+                this.activeTarget = t;
+            }
+            if(t.width){
+                this.setWidth(t.width);
+                this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
+                this.measureWidth = false;
+            } else{
+                this.measureWidth = true;
+            }
+            this.setTitle(t.title || '');
+            this.body.update(t.text);
+            this.autoHide = t.autoHide;
+            this.dismissDelay = t.dismissDelay || this.dismissDelay;
+            if(this.lastCls){
+                this.el.removeClass(this.lastCls);
+                delete this.lastCls;
+            }
+            if(t.cls){
+                this.el.addClass(t.cls);
+                this.lastCls = t.cls;
+            }
+            if(this.anchor){
+                this.constrainPosition = false;
+            }else if(t.align){ // TODO: this doesn't seem to work consistently
+                xy = this.el.getAlignToXY(t.el, t.align);
+                this.constrainPosition = false;
+            }else{
+                this.constrainPosition = true;
+            }
+        }
+        Ext.QuickTip.superclass.showAt.call(this, xy);
+    },
+
+    // inherit docs
+    hide: function(){
+        delete this.activeTarget;
+        Ext.QuickTip.superclass.hide.call(this);
+    }
+});
+Ext.reg('quicktip', Ext.QuickTip);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/ToolTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/ToolTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/ToolTip.js	(revision 76)
@@ -0,0 +1,539 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ToolTip
+ * @extends Ext.Tip
+ * A standard tooltip implementation for providing additional information when hovering over a target element.
+ * @xtype tooltip
+ * @constructor
+ * Create a new Tooltip
+ * @param {Object} config The configuration options
+ */
+Ext.ToolTip = Ext.extend(Ext.Tip, {
+    /**
+     * When a Tooltip is configured with the <code>{@link #delegate}</code>
+     * option to cause selected child elements of the <code>{@link #target}</code>
+     * Element to each trigger a seperate show event, this property is set to
+     * the DOM element which triggered the show.
+     * @type DOMElement
+     * @property triggerElement
+     */
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to monitor
+     * for mouseover events to trigger showing this ToolTip.
+     */
+    /**
+     * @cfg {Boolean} autoHide True to automatically hide the tooltip after the
+     * mouse exits the target element or after the <code>{@link #dismissDelay}</code>
+     * has expired if set (defaults to true).  If <code>{@link closable} = true</code>
+     * a close tool button will be rendered into the tooltip header.
+     */
+    /**
+     * @cfg {Number} showDelay Delay in milliseconds before the tooltip displays
+     * after the mouse enters the target element (defaults to 500)
+     */
+    showDelay : 500,
+    /**
+     * @cfg {Number} hideDelay Delay in milliseconds after the mouse exits the
+     * target element but before the tooltip actually hides (defaults to 200).
+     * Set to 0 for the tooltip to hide immediately.
+     */
+    hideDelay : 200,
+    /**
+     * @cfg {Number} dismissDelay Delay in milliseconds before the tooltip
+     * automatically hides (defaults to 5000). To disable automatic hiding, set
+     * dismissDelay = 0.
+     */
+    dismissDelay : 5000,
+    /**
+     * @cfg {Array} mouseOffset An XY offset from the mouse position where the
+     * tooltip should be shown (defaults to [15,18]).
+     */
+    /**
+     * @cfg {Boolean} trackMouse True to have the tooltip follow the mouse as it
+     * moves over the target element (defaults to false).
+     */
+    trackMouse : false,
+    /**
+     * @cfg {Boolean} anchorToTarget True to anchor the tooltip to the target
+     * element, false to anchor it relative to the mouse coordinates (defaults
+     * to true).  When <code>anchorToTarget</code> is true, use
+     * <code>{@link #defaultAlign}</code> to control tooltip alignment to the
+     * target element.  When <code>anchorToTarget</code> is false, use
+     * <code>{@link #anchorPosition}</code> instead to control alignment.
+     */
+    anchorToTarget : true,
+    /**
+     * @cfg {Number} anchorOffset A numeric pixel value used to offset the
+     * default position of the anchor arrow (defaults to 0).  When the anchor
+     * position is on the top or bottom of the tooltip, <code>anchorOffset</code>
+     * will be used as a horizontal offset.  Likewise, when the anchor position
+     * is on the left or right side, <code>anchorOffset</code> will be used as
+     * a vertical offset.
+     */
+    anchorOffset : 0,
+    /**
+     * @cfg {String} delegate <p>Optional. A {@link Ext.DomQuery DomQuery}
+     * selector which allows selection of individual elements within the
+     * <code>{@link #target}</code> element to trigger showing and hiding the
+     * ToolTip as the mouse moves within the target.</p>
+     * <p>When specified, the child element of the target which caused a show
+     * event is placed into the <code>{@link #triggerElement}</code> property
+     * before the ToolTip is shown.</p>
+     * <p>This may be useful when a Component has regular, repeating elements
+     * in it, each of which need a Tooltip which contains information specific
+     * to that element. For example:</p><pre><code>
+var myGrid = new Ext.grid.gridPanel(gridConfig);
+myGrid.on('render', function(grid) {
+    var store = grid.getStore();  // Capture the Store.
+    var view = grid.getView();    // Capture the GridView.
+    myGrid.tip = new Ext.ToolTip({
+        target: view.mainBody,    // The overall target element.
+        delegate: '.x-grid3-row', // Each grid row causes its own seperate show and hide.
+        trackMouse: true,         // Moving within the row should not hide the tip.
+        renderTo: document.body,  // Render immediately so that tip.body can be
+                                  //  referenced prior to the first show.
+        listeners: {              // Change content dynamically depending on which element
+                                  //  triggered the show.
+            beforeshow: function updateTipBody(tip) {
+                var rowIndex = view.findRowIndex(tip.triggerElement);
+                tip.body.dom.innerHTML = 'Over Record ID ' + store.getAt(rowIndex).id;
+            }
+        }
+    });
+});
+     *</code></pre>
+     */
+
+    // private
+    targetCounter : 0,
+
+    constrainPosition : false,
+
+    // private
+    initComponent : function(){
+        Ext.ToolTip.superclass.initComponent.call(this);
+        this.lastActive = new Date();
+        this.initTarget(this.target);
+        this.origAnchor = this.anchor;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.ToolTip.superclass.onRender.call(this, ct, position);
+        this.anchorCls = 'x-tip-anchor-' + this.getAnchorPosition();
+        this.anchorEl = this.el.createChild({
+            cls: 'x-tip-anchor ' + this.anchorCls
+        });
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ToolTip.superclass.afterRender.call(this);
+        this.anchorEl.setStyle('z-index', this.el.getZIndex() + 1).setVisibilityMode(Ext.Element.DISPLAY);
+    },
+
+    /**
+     * Binds this ToolTip to the specified element. The tooltip will be displayed when the mouse moves over the element.
+     * @param {Mixed} t The Element, HtmlElement, or ID of an element to bind to
+     */
+    initTarget : function(target){
+        var t;
+        if((t = Ext.get(target))){
+            if(this.target){
+                var tg = Ext.get(this.target);
+                this.mun(tg, 'mouseover', this.onTargetOver, this);
+                this.mun(tg, 'mouseout', this.onTargetOut, this);
+                this.mun(tg, 'mousemove', this.onMouseMove, this);
+            }
+            this.mon(t, {
+                mouseover: this.onTargetOver,
+                mouseout: this.onTargetOut,
+                mousemove: this.onMouseMove,
+                scope: this
+            });
+            this.target = t;
+        }
+        if(this.anchor){
+            this.anchorTarget = this.target;
+        }
+    },
+
+    // private
+    onMouseMove : function(e){
+        var t = this.delegate ? e.getTarget(this.delegate) : this.triggerElement = true;
+        if (t) {
+            this.targetXY = e.getXY();
+            if (t === this.triggerElement) {
+                if(!this.hidden && this.trackMouse){
+                    this.setPagePosition(this.getTargetXY());
+                }
+            } else {
+                this.hide();
+                this.lastActive = new Date(0);
+                this.onTargetOver(e);
+            }
+        } else if (!this.closable && this.isVisible()) {
+            this.hide();
+        }
+    },
+
+    // private
+    getTargetXY : function(){
+        if(this.delegate){
+            this.anchorTarget = this.triggerElement;
+        }
+        if(this.anchor){
+            this.targetCounter++;
+            var offsets = this.getOffsets(),
+                xy = (this.anchorToTarget && !this.trackMouse) ? this.el.getAlignToXY(this.anchorTarget, this.getAnchorAlign()) : this.targetXY,
+                dw = Ext.lib.Dom.getViewWidth() - 5,
+                dh = Ext.lib.Dom.getViewHeight() - 5,
+                de = document.documentElement,
+                bd = document.body,
+                scrollX = (de.scrollLeft || bd.scrollLeft || 0) + 5,
+                scrollY = (de.scrollTop || bd.scrollTop || 0) + 5,
+                axy = [xy[0] + offsets[0], xy[1] + offsets[1]],
+                sz = this.getSize();
+                
+            this.anchorEl.removeClass(this.anchorCls);
+
+            if(this.targetCounter < 2){
+                if(axy[0] < scrollX){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'l-r';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'left';
+                    return this.getTargetXY();
+                }
+                if(axy[0]+sz.width > dw){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'r-l';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'right';
+                    return this.getTargetXY();
+                }
+                if(axy[1] < scrollY){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 't-b';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'top';
+                    return this.getTargetXY();
+                }
+                if(axy[1]+sz.height > dh){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'b-t';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'bottom';
+                    return this.getTargetXY();
+                }
+            }
+
+            this.anchorCls = 'x-tip-anchor-'+this.getAnchorPosition();
+            this.anchorEl.addClass(this.anchorCls);
+            this.targetCounter = 0;
+            return axy;
+        }else{
+            var mouseOffset = this.getMouseOffset();
+            return [this.targetXY[0]+mouseOffset[0], this.targetXY[1]+mouseOffset[1]];
+        }
+    },
+
+    getMouseOffset : function(){
+        var offset = this.anchor ? [0,0] : [15,18];
+        if(this.mouseOffset){
+            offset[0] += this.mouseOffset[0];
+            offset[1] += this.mouseOffset[1];
+        }
+        return offset;
+    },
+
+    // private
+    getAnchorPosition : function(){
+        if(this.anchor){
+            this.tipAnchor = this.anchor.charAt(0);
+        }else{
+            var m = this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+            if(!m){
+               throw 'AnchorTip.defaultAlign is invalid';
+            }
+            this.tipAnchor = m[1].charAt(0);
+        }
+
+        switch(this.tipAnchor){
+            case 't': return 'top';
+            case 'b': return 'bottom';
+            case 'r': return 'right';
+        }
+        return 'left';
+    },
+
+    // private
+    getAnchorAlign : function(){
+        switch(this.anchor){
+            case 'top'  : return 'tl-bl';
+            case 'left' : return 'tl-tr';
+            case 'right': return 'tr-tl';
+            default     : return 'bl-tl';
+        }
+    },
+
+    // private
+    getOffsets : function(){
+        var offsets, 
+            ap = this.getAnchorPosition().charAt(0);
+        if(this.anchorToTarget && !this.trackMouse){
+            switch(ap){
+                case 't':
+                    offsets = [0, 9];
+                    break;
+                case 'b':
+                    offsets = [0, -13];
+                    break;
+                case 'r':
+                    offsets = [-13, 0];
+                    break;
+                default:
+                    offsets = [9, 0];
+                    break;
+            }
+        }else{
+            switch(ap){
+                case 't':
+                    offsets = [-15-this.anchorOffset, 30];
+                    break;
+                case 'b':
+                    offsets = [-19-this.anchorOffset, -13-this.el.dom.offsetHeight];
+                    break;
+                case 'r':
+                    offsets = [-15-this.el.dom.offsetWidth, -13-this.anchorOffset];
+                    break;
+                default:
+                    offsets = [25, -13-this.anchorOffset];
+                    break;
+            }
+        }
+        var mouseOffset = this.getMouseOffset();
+        offsets[0] += mouseOffset[0];
+        offsets[1] += mouseOffset[1];
+
+        return offsets;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        var t = e.getTarget(this.delegate);
+        if (t) {
+            this.triggerElement = t;
+            this.clearTimer('hide');
+            this.targetXY = e.getXY();
+            this.delayShow();
+        }
+    },
+
+    // private
+    delayShow : function(){
+        if(this.hidden && !this.showTimer){
+            if(this.lastActive.getElapsed() < this.quickShowInterval){
+                this.show();
+            }else{
+                this.showTimer = this.show.defer(this.showDelay, this);
+            }
+        }else if(!this.hidden && this.autoHide !== false){
+            this.show();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // private
+    delayHide : function(){
+        if(!this.hidden && !this.hideTimer){
+            this.hideTimer = this.hide.defer(this.hideDelay, this);
+        }
+    },
+
+    /**
+     * Hides this tooltip if visible.
+     */
+    hide: function(){
+        this.clearTimer('dismiss');
+        this.lastActive = new Date();
+        if(this.anchorEl){
+            this.anchorEl.hide();
+        }
+        Ext.ToolTip.superclass.hide.call(this);
+        delete this.triggerElement;
+    },
+
+    /**
+     * Shows this tooltip at the current event target XY position.
+     */
+    show : function(){
+        if(this.anchor){
+            // pre-show it off screen so that the el will have dimensions
+            // for positioning calcs when getting xy next
+            this.showAt([-1000,-1000]);
+            this.origConstrainPosition = this.constrainPosition;
+            this.constrainPosition = false;
+            this.anchor = this.origAnchor;
+        }
+        this.showAt(this.getTargetXY());
+
+        if(this.anchor){
+            this.anchorEl.show();
+            this.syncAnchor();
+            this.constrainPosition = this.origConstrainPosition;
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        this.lastActive = new Date();
+        this.clearTimers();
+        Ext.ToolTip.superclass.showAt.call(this, xy);
+        if(this.dismissDelay && this.autoHide !== false){
+            this.dismissTimer = this.hide.defer(this.dismissDelay, this);
+        }
+        if(this.anchor && !this.anchorEl.isVisible()){
+            this.syncAnchor();
+            this.anchorEl.show();
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // private
+    syncAnchor : function(){
+        var anchorPos, targetPos, offset;
+        switch(this.tipAnchor.charAt(0)){
+            case 't':
+                anchorPos = 'b';
+                targetPos = 'tl';
+                offset = [20+this.anchorOffset, 2];
+                break;
+            case 'r':
+                anchorPos = 'l';
+                targetPos = 'tr';
+                offset = [-2, 11+this.anchorOffset];
+                break;
+            case 'b':
+                anchorPos = 't';
+                targetPos = 'bl';
+                offset = [20+this.anchorOffset, -2];
+                break;
+            default:
+                anchorPos = 'r';
+                targetPos = 'tl';
+                offset = [2, 11+this.anchorOffset];
+                break;
+        }
+        this.anchorEl.alignTo(this.el, anchorPos+'-'+targetPos, offset);
+    },
+
+    // private
+    setPagePosition : function(x, y){
+        Ext.ToolTip.superclass.setPagePosition.call(this, x, y);
+        if(this.anchor){
+            this.syncAnchor();
+        }
+    },
+
+    // private
+    clearTimer : function(name){
+        name = name + 'Timer';
+        clearTimeout(this[name]);
+        delete this[name];
+    },
+
+    // private
+    clearTimers : function(){
+        this.clearTimer('show');
+        this.clearTimer('dismiss');
+        this.clearTimer('hide');
+    },
+
+    // private
+    onShow : function(){
+        Ext.ToolTip.superclass.onShow.call(this);
+        Ext.getDoc().on('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onHide : function(){
+        Ext.ToolTip.superclass.onHide.call(this);
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onDocMouseDown : function(e){
+        if(this.autoHide !== true && !this.closable && !e.within(this.el.dom)){
+            this.disable();
+            this.doEnable.defer(100, this);
+        }
+    },
+    
+    // private
+    doEnable : function(){
+        if(!this.isDestroyed){
+            this.enable();
+        }
+    },
+
+    // private
+    onDisable : function(){
+        this.clearTimers();
+        this.hide();
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        if(this.constrainPosition){
+            var ay = this.targetXY[1], h = this.getSize().height;
+            if(y <= ay && (y+h) >= ay){
+                y = ay-h-5;
+            }
+        }
+        return {x : x, y: y};
+    },
+    
+    beforeDestroy : function(){
+        this.clearTimers();
+        Ext.destroy(this.anchorEl);
+        delete this.anchorEl;
+        delete this.target;
+        delete this.anchorTarget;
+        delete this.triggerElement;
+        Ext.ToolTip.superclass.beforeDestroy.call(this);    
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+        Ext.ToolTip.superclass.onDestroy.call(this);
+    }
+});
+
+Ext.reg('tooltip', Ext.ToolTip);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTips.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTips.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/QuickTips.js	(revision 76)
@@ -0,0 +1,179 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.QuickTips
+ * <p>Provides attractive and customizable tooltips for any element. The QuickTips
+ * singleton is used to configure and manage tooltips globally for multiple elements
+ * in a generic manner.  To create individual tooltips with maximum customizability,
+ * you should consider either {@link Ext.Tip} or {@link Ext.ToolTip}.</p>
+ * <p>Quicktips can be configured via tag attributes directly in markup, or by
+ * registering quick tips programmatically via the {@link #register} method.</p>
+ * <p>The singleton's instance of {@link Ext.QuickTip} is available via
+ * {@link #getQuickTip}, and supports all the methods, and all the all the
+ * configuration properties of Ext.QuickTip. These settings will apply to all
+ * tooltips shown by the singleton.</p>
+ * <p>Below is the summary of the configuration properties which can be used.
+ * For detailed descriptions see the config options for the {@link Ext.QuickTip QuickTip} class</p>
+ * <p><b>QuickTips singleton configs (all are optional)</b></p>
+ * <div class="mdetail-params"><ul><li>dismissDelay</li>
+ * <li>hideDelay</li>
+ * <li>maxWidth</li>
+ * <li>minWidth</li>
+ * <li>showDelay</li>
+ * <li>trackMouse</li></ul></div>
+ * <p><b>Target element configs (optional unless otherwise noted)</b></p>
+ * <div class="mdetail-params"><ul><li>autoHide</li>
+ * <li>cls</li>
+ * <li>dismissDelay (overrides singleton value)</li>
+ * <li>target (required)</li>
+ * <li>text (required)</li>
+ * <li>title</li>
+ * <li>width</li></ul></div>
+ * <p>Here is an example showing how some of these config options could be used:</p>
+ * <pre><code>
+// Init the singleton.  Any tag-based quick tips will start working.
+Ext.QuickTips.init();
+
+// Apply a set of config properties to the singleton
+Ext.apply(Ext.QuickTips.getQuickTip(), {
+    maxWidth: 200,
+    minWidth: 100,
+    showDelay: 50,      // Show 50ms after entering target
+    trackMouse: true
+});
+
+// Manually register a quick tip for a specific element
+Ext.QuickTips.register({
+    target: 'my-div',
+    title: 'My Tooltip',
+    text: 'This tooltip was added in code',
+    width: 100,
+    dismissDelay: 10000 // Hide after 10 seconds hover
+});
+</code></pre>
+ * <p>To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
+ * the <b>ext:</b> namespace.  The HTML element itself is automatically set as the quick tip target. Here is the summary
+ * of supported attributes (optional unless otherwise noted):</p>
+ * <ul><li><b>hide</b>: Specifying "user" is equivalent to setting autoHide = false.  Any other value will be the
+ * same as autoHide = true.</li>
+ * <li><b>qclass</b>: A CSS class to be applied to the quick tip (equivalent to the 'cls' target element config).</li>
+ * <li><b>qtip (required)</b>: The quick tip text (equivalent to the 'text' target element config).</li>
+ * <li><b>qtitle</b>: The quick tip title (equivalent to the 'title' target element config).</li>
+ * <li><b>qwidth</b>: The quick tip width (equivalent to the 'width' target element config).</li></ul>
+ * <p>Here is an example of configuring an HTML element to display a tooltip from markup:</p>
+ * <pre><code>
+// Add a quick tip to an HTML button
+&lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
+     ext:qtip="This is a quick tip from markup!">&lt;/input>
+</code></pre>
+ * @singleton
+ */
+Ext.QuickTips = function(){
+    var tip,
+        disabled = false;
+        
+    return {
+        /**
+         * Initialize the global QuickTips instance and prepare any quick tips.
+         * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true) 
+         */
+        init : function(autoRender){
+            if(!tip){
+                if(!Ext.isReady){
+                    Ext.onReady(function(){
+                        Ext.QuickTips.init(autoRender);
+                    });
+                    return;
+                }
+                tip = new Ext.QuickTip({
+                    elements:'header,body', 
+                    disabled: disabled
+                });
+                if(autoRender !== false){
+                    tip.render(Ext.getBody());
+                }
+            }
+        },
+        
+        // Protected method called by the dd classes
+        ddDisable : function(){
+            // don't disable it if we don't need to
+            if(tip && !disabled){
+                tip.disable();
+            }    
+        },
+        
+        // Protected method called by the dd classes
+        ddEnable : function(){
+            // only enable it if it hasn't been disabled
+            if(tip && !disabled){
+                tip.enable();
+            }
+        },
+
+        /**
+         * Enable quick tips globally.
+         */
+        enable : function(){
+            if(tip){
+                tip.enable();
+            }
+            disabled = false;
+        },
+
+        /**
+         * Disable quick tips globally.
+         */
+        disable : function(){
+            if(tip){
+                tip.disable();
+            }
+            disabled = true;
+        },
+
+        /**
+         * Returns true if quick tips are enabled, else false.
+         * @return {Boolean}
+         */
+        isEnabled : function(){
+            return tip !== undefined && !tip.disabled;
+        },
+
+        /**
+         * Gets the single {@link Ext.QuickTip QuickTip} instance used to show tips from all registered elements.
+         * @return {Ext.QuickTip}
+         */
+        getQuickTip : function(){
+            return tip;
+        },
+
+        /**
+         * Configures a new quick tip instance and assigns it to a target element.  See
+         * {@link Ext.QuickTip#register} for details.
+         * @param {Object} config The config object
+         */
+        register : function(){
+            tip.register.apply(tip, arguments);
+        },
+
+        /**
+         * Removes any registered quick tip from the target element and destroys it.
+         * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+         */
+        unregister : function(){
+            tip.unregister.apply(tip, arguments);
+        },
+
+        /**
+         * Alias of {@link #register}.
+         * @param {Object} config The config object
+         */
+        tips : function(){
+            tip.register.apply(tip, arguments);
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/Tip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/Tip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/Tip.js	(revision 76)
@@ -0,0 +1,161 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Tip
+ * @extends Ext.Panel
+ * @xtype tip
+ * This is the base class for {@link Ext.QuickTip} and {@link Ext.Tooltip} that provides the basic layout and
+ * positioning that all tip-based classes require. This class can be used directly for simple, statically-positioned
+ * tips that are displayed programmatically, or it can be extended to provide custom tip implementations.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.Tip = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Boolean} closable True to render a close tool button into the tooltip header (defaults to false).
+     */
+    /**
+     * @cfg {Number} width
+     * Width in pixels of the tip (defaults to auto).  Width will be ignored if it exceeds the bounds of
+     * {@link #minWidth} or {@link #maxWidth}.  The maximum supported value is 500.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the tip in pixels (defaults to 40).
+     */
+    minWidth : 40,
+    /**
+     * @cfg {Number} maxWidth The maximum width of the tip in pixels (defaults to 300).  The maximum supported value is 500.
+     */
+    maxWidth : 300,
+    /**
+     * @cfg {Boolean/String} shadow True or "sides" for the default effect, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "sides").
+     */
+    shadow : "sides",
+    /**
+     * @cfg {String} defaultAlign <b>Experimental</b>. The default {@link Ext.Element#alignTo} anchor position value
+     * for this tip relative to its element of origin (defaults to "tl-bl?").
+     */
+    defaultAlign : "tl-bl?",
+    autoRender: true,
+    quickShowInterval : 250,
+
+    // private panel overrides
+    frame:true,
+    hidden:true,
+    baseCls: 'x-tip',
+    floating:{shadow:true,shim:true,useDisplay:true,constrain:false},
+    autoHeight:true,
+
+    closeAction: 'hide',
+
+    // private
+    initComponent : function(){
+        Ext.Tip.superclass.initComponent.call(this);
+        if(this.closable && !this.title){
+            this.elements += ',header';
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Tip.superclass.afterRender.call(this);
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction],
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Shows this tip at the specified XY position.  Example usage:
+     * <pre><code>
+// Show the tip at x:50 and y:100
+tip.showAt([50,100]);
+</code></pre>
+     * @param {Array} xy An array containing the x and y coordinates
+     */
+    showAt : function(xy){
+        Ext.Tip.superclass.show.call(this);
+        if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){
+            this.doAutoWidth();
+        }
+        if(this.constrainPosition){
+            xy = this.el.adjustForConstraints(xy);
+        }
+        this.setPagePosition(xy[0], xy[1]);
+    },
+
+    // protected
+    doAutoWidth : function(adjust){
+        adjust = adjust || 0;
+        var bw = this.body.getTextWidth();
+        if(this.title){
+            bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));
+        }
+        bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr") + adjust;
+        this.setWidth(bw.constrain(this.minWidth, this.maxWidth));
+        
+        // IE7 repaint bug on initial show
+        if(Ext.isIE7 && !this.repainted){
+            this.el.repaint();
+            this.repainted = true;
+        }
+    },
+
+    /**
+     * <b>Experimental</b>. Shows this tip at a position relative to another element using a standard {@link Ext.Element#alignTo}
+     * anchor position value.  Example usage:
+     * <pre><code>
+// Show the tip at the default position ('tl-br?')
+tip.showBy('my-el');
+
+// Show the tip's top-left corner anchored to the element's top-right corner
+tip.showBy('my-el', 'tl-tr');
+</code></pre>
+     * @param {Mixed} el An HTMLElement, Ext.Element or string id of the target element to align to
+     * @param {String} position (optional) A valid {@link Ext.Element#alignTo} anchor position (defaults to 'tl-br?' or
+     * {@link #defaultAlign} if specified).
+     */
+    showBy : function(el, pos){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));
+    },
+
+    initDraggable : function(){
+        this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);
+        this.header.addClass('x-tip-draggable');
+    }
+});
+
+Ext.reg('tip', Ext.Tip);
+
+// private - custom Tip DD implementation
+Ext.Tip.DD = function(tip, config){
+    Ext.apply(this, config);
+    this.tip = tip;
+    Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);
+    this.setHandleElId(tip.header.id);
+    this.scroll = false;
+};
+
+Ext.extend(Ext.Tip.DD, Ext.dd.DD, {
+    moveOnly:true,
+    scroll:false,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        this.tip.el.disableShadow();
+    },
+    endDrag : function(e){
+        this.tip.el.enableShadow(true);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/SliderTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/SliderTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tips/SliderTip.js	(revision 76)
@@ -0,0 +1,74 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.slider.Tip
+ * @extends Ext.Tip
+ * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage:
+<pre>
+new Ext.Slider({
+    width: 214,
+    minValue: 0,
+    maxValue: 100,
+    plugins: new Ext.slider.Tip()
+});
+</pre>
+ * Optionally provide your own tip text by overriding getText:
+ <pre>
+ new Ext.Slider({
+     width: 214,
+     minValue: 0,
+     maxValue: 100,
+     plugins: new Ext.slider.Tip({
+         getText: function(thumb){
+             return String.format('<b>{0}% complete</b>', thumb.value);
+         }
+     })
+ });
+ </pre>
+ */
+Ext.slider.Tip = Ext.extend(Ext.Tip, {
+    minWidth: 10,
+    offsets : [0, -10],
+    
+    init: function(slider) {
+        slider.on({
+            scope    : this,
+            dragstart: this.onSlide,
+            drag     : this.onSlide,
+            dragend  : this.hide,
+            destroy  : this.destroy
+        });
+    },
+    
+    /**
+     * @private
+     * Called whenever a dragstart or drag event is received on the associated Thumb. 
+     * Aligns the Tip with the Thumb's new position.
+     * @param {Ext.slider.MultiSlider} slider The slider
+     * @param {Ext.EventObject} e The Event object
+     * @param {Ext.slider.Thumb} thumb The thumb that the Tip is attached to
+     */
+    onSlide : function(slider, e, thumb) {
+        this.show();
+        this.body.update(this.getText(thumb));
+        this.doAutoWidth();
+        this.el.alignTo(thumb.el, 'b-t?', this.offsets);
+    },
+
+    /**
+     * Used to create the text that appears in the Tip's body. By default this just returns
+     * the value of the Slider Thumb that the Tip is attached to. Override to customize.
+     * @param {Ext.slider.Thumb} thumb The Thumb that the Tip is attached to
+     * @return {String} The text to display in the tip
+     */
+    getText : function(thumb) {
+        return String(thumb.value);
+    }
+});
+
+//backwards compatibility - SliderTip used to be a ux before 3.2
+Ext.ux.SliderTip = Ext.slider.Tip;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Window.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Window.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Window.js	(revision 76)
@@ -0,0 +1,1036 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Window
+ * @extends Ext.Panel
+ * <p>A specialized panel intended for use as an application window.  Windows are floated, {@link #resizable}, and
+ * {@link #draggable} by default.  Windows can be {@link #maximizable maximized} to fill the viewport,
+ * restored to their prior size, and can be {@link #minimize}d.</p>
+ * <p>Windows can also be linked to a {@link Ext.WindowGroup} or managed by the {@link Ext.WindowMgr} to provide
+ * grouping, activation, to front, to back and other application-specific behavior.</p>
+ * <p>By default, Windows will be rendered to document.body. To {@link #constrain} a Window to another element
+ * specify {@link Ext.Component#renderTo renderTo}.</p>
+ * <p><b>Note:</b> By default, the <code>{@link #closable close}</code> header tool <i>destroys</i> the Window resulting in
+ * destruction of any child Components. This makes the Window object, and all its descendants <b>unusable</b>. To enable
+ * re-use of a Window, use <b><code>{@link #closeAction closeAction: 'hide'}</code></b>.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype window
+ */
+Ext.Window = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} x
+     * The X position of the left edge of the window on initial showing. Defaults to centering the Window within
+     * the width of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Number} y
+     * The Y position of the top edge of the window on initial showing. Defaults to centering the Window within
+     * the height of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Boolean} modal
+     * True to make the window modal and mask everything behind it when displayed, false to display it without
+     * restricting access to other UI elements (defaults to false).
+     */
+    /**
+     * @cfg {String/Element} animateTarget
+     * Id or element from which the window should animate while opening (defaults to null with no animation).
+     */
+    /**
+     * @cfg {String} resizeHandles
+     * A valid {@link Ext.Resizable} handles config string (defaults to 'all').  Only applies when resizable = true.
+     */
+    /**
+     * @cfg {Ext.WindowGroup} manager
+     * A reference to the WindowGroup that should manage this window (defaults to {@link Ext.WindowMgr}).
+     */
+    /**
+    * @cfg {String/Number/Component} defaultButton
+    * <p>Specifies a Component to receive focus when this Window is focussed.</p>
+    * <p>This may be one of:</p><div class="mdetail-params"><ul>
+    * <li>The index of a footer Button.</li>
+    * <li>The id of a Component.</li>
+    * <li>A Component.</li>
+    * </ul></div>
+    */
+    /**
+    * @cfg {Function} onEsc
+    * Allows override of the built-in processing for the escape key. Default action
+    * is to close the Window (performing whatever action is specified in {@link #closeAction}.
+    * To prevent the Window closing when the escape key is pressed, specify this as
+    * Ext.emptyFn (See {@link Ext#emptyFn}).
+    */
+    /**
+     * @cfg {Boolean} collapsed
+     * True to render the window collapsed, false to render it expanded (defaults to false). Note that if
+     * {@link #expandOnShow} is true (the default) it will override the <tt>collapsed</tt> config and the window
+     * will always be expanded when shown.
+     */
+    /**
+     * @cfg {Boolean} maximized
+     * True to initially display the window in a maximized state. (Defaults to false).
+     */
+
+    /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to this panel's element (defaults to 'x-window').
+    */
+    baseCls : 'x-window',
+    /**
+     * @cfg {Boolean} resizable
+     * True to allow user resizing at each edge and corner of the window, false to disable resizing (defaults to true).
+     */
+    resizable : true,
+    /**
+     * @cfg {Boolean} draggable
+     * True to allow the window to be dragged by the header bar, false to disable dragging (defaults to true).  Note
+     * that by default the window will be centered in the viewport, so if dragging is disabled the window may need
+     * to be positioned programmatically after render (e.g., myWindow.setPosition(100, 100);).
+     */
+    draggable : true,
+    /**
+     * @cfg {Boolean} closable
+     * <p>True to display the 'close' tool button and allow the user to close the window, false to
+     * hide the button and disallow closing the window (defaults to true).</p>
+     * <p>By default, when close is requested by either clicking the close button in the header
+     * or pressing ESC when the Window has focus, the {@link #close} method will be called. This
+     * will <i>{@link Ext.Component#destroy destroy}</i> the Window and its content meaning that
+     * it may not be reused.</p>
+     * <p>To make closing a Window <i>hide</i> the Window so that it may be reused, set
+     * {@link #closeAction} to 'hide'.
+     */
+    closable : true,
+    /**
+     * @cfg {String} closeAction
+     * <p>The action to take when the close header tool is clicked:
+     * <div class="mdetail-params"><ul>
+     * <li><b><code>'{@link #close}'</code></b> : <b>Default</b><div class="sub-desc">
+     * {@link #close remove} the window from the DOM and {@link Ext.Component#destroy destroy}
+     * it and all descendant Components. The window will <b>not</b> be available to be
+     * redisplayed via the {@link #show} method.
+     * </div></li>
+     * <li><b><code>'{@link #hide}'</code></b> : <div class="sub-desc">
+     * {@link #hide} the window by setting visibility to hidden and applying negative offsets.
+     * The window will be available to be redisplayed via the {@link #show} method.
+     * </div></li>
+     * </ul></div>
+     * <p><b>Note:</b> This setting does not affect the {@link #close} method
+     * which will always {@link Ext.Component#destroy destroy} the window. To
+     * programatically <i>hide</i> a window, call {@link #hide}.</p>
+     */
+    closeAction : 'close',
+    /**
+     * @cfg {Boolean} constrain
+     * True to constrain the window within its containing element, false to allow it to fall outside of its
+     * containing element. By default the window will be rendered to document.body.  To render and constrain the
+     * window within another element specify {@link #renderTo}.
+     * (defaults to false).  Optionally the header only can be constrained using {@link #constrainHeader}.
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} constrainHeader
+     * True to constrain the window header within its containing element (allowing the window body to fall outside
+     * of its containing element) or false to allow the header to fall outside its containing element (defaults to
+     * false). Optionally the entire window can be constrained using {@link #constrain}.
+     */
+    constrainHeader : false,
+    /**
+     * @cfg {Boolean} plain
+     * True to render the window body with a transparent background so that it will blend into the framing
+     * elements, false to add a lighter background color to visually highlight the body element and separate it
+     * more distinctly from the surrounding frame (defaults to false).
+     */
+    plain : false,
+    /**
+     * @cfg {Boolean} minimizable
+     * True to display the 'minimize' tool button and allow the user to minimize the window, false to hide the button
+     * and disallow minimizing the window (defaults to false).  Note that this button provides no implementation --
+     * the behavior of minimizing a window is implementation-specific, so the minimize event must be handled and a
+     * custom minimize behavior implemented for this option to be useful.
+     */
+    minimizable : false,
+    /**
+     * @cfg {Boolean} maximizable
+     * True to display the 'maximize' tool button and allow the user to maximize the window, false to hide the button
+     * and disallow maximizing the window (defaults to false).  Note that when a window is maximized, the tool button
+     * will automatically change to a 'restore' button with the appropriate behavior already built-in that will
+     * restore the window to its previous size.
+     */
+    maximizable : false,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum height in pixels allowed for this window (defaults to 100).  Only applies when resizable = true.
+     */
+    minHeight : 100,
+    /**
+     * @cfg {Number} minWidth
+     * The minimum width in pixels allowed for this window (defaults to 200).  Only applies when resizable = true.
+     */
+    minWidth : 200,
+    /**
+     * @cfg {Boolean} expandOnShow
+     * True to always expand the window when it is displayed, false to keep it in its current state (which may be
+     * {@link #collapsed}) when displayed (defaults to true).
+     */
+    expandOnShow : true,
+    
+    /**
+     * @cfg {Number} showAnimDuration The number of seconds that the window show animation takes if enabled.
+     * Defaults to 0.25
+     */
+    showAnimDuration: 0.25,
+    
+    /**
+     * @cfg {Number} hideAnimDuration The number of seconds that the window hide animation takes if enabled.
+     * Defaults to 0.25
+     */
+    hideAnimDuration: 0.25,
+
+    // inherited docs, same default
+    collapsible : false,
+
+    /**
+     * @cfg {Boolean} initHidden
+     * True to hide the window until show() is explicitly called (defaults to true).
+     * @deprecated
+     */
+    initHidden : undefined,
+
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is <tt>true</tt>). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : true,
+
+    // The following configs are set to provide the basic functionality of a window.
+    // Changing them would require additional code to handle correctly and should
+    // usually only be done in subclasses that can provide custom behavior.  Changing them
+    // may have unexpected or undesirable results.
+    /** @cfg {String} elements @hide */
+    elements : 'header,body',
+    /** @cfg {Boolean} frame @hide */
+    frame : true,
+    /** @cfg {Boolean} floating @hide */
+    floating : true,
+
+    // private
+    initComponent : function(){
+        this.initTools();
+        Ext.Window.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event activate
+             * Fires after the window has been visually activated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event deactivate
+             * Fires after the window has been visually deactivated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event resize
+             * Fires after the window has been resized.
+             * @param {Ext.Window} this
+             * @param {Number} width The window's new width
+             * @param {Number} height The window's new height
+             */
+            'resize',
+            /**
+             * @event maximize
+             * Fires after the window has been maximized.
+             * @param {Ext.Window} this
+             */
+            'maximize',
+            /**
+             * @event minimize
+             * Fires after the window has been minimized.
+             * @param {Ext.Window} this
+             */
+            'minimize',
+            /**
+             * @event restore
+             * Fires after the window has been restored to its original size after being maximized.
+             * @param {Ext.Window} this
+             */
+            'restore'
+        );
+        // for backwards compat, this should be removed at some point
+        if(Ext.isDefined(this.initHidden)){
+            this.hidden = this.initHidden;
+        }
+        if(this.hidden === false){
+            this.hidden = true;
+            this.show();
+        }
+    },
+
+    // private
+    getState : function(){
+        return Ext.apply(Ext.Window.superclass.getState.call(this) || {}, this.getBox(true));
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Window.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            this.el.addClass('x-window-plain');
+        }
+
+        // this element allows the Window to be focused for keyboard events
+        this.focusEl = this.el.createChild({
+                    tag: 'a', href:'#', cls:'x-dlg-focus',
+                    tabIndex:'-1', html: '&#160;'});
+        this.focusEl.swallowEvent('click', true);
+
+        this.proxy = this.el.createProxy('x-window-proxy');
+        this.proxy.enableDisplayMode('block');
+
+        if(this.modal){
+            this.mask = this.container.createChild({cls:'ext-el-mask'}, this.el.dom);
+            this.mask.enableDisplayMode('block');
+            this.mask.hide();
+            this.mon(this.mask, 'click', this.focus, this);
+        }
+        if(this.maximizable){
+            this.mon(this.header, 'dblclick', this.toggleMaximize, this);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.Window.superclass.initEvents.call(this);
+        if(this.animateTarget){
+            this.setAnimateTarget(this.animateTarget);
+        }
+
+        if(this.resizable){
+            this.resizer = new Ext.Resizable(this.el, {
+                minWidth: this.minWidth,
+                minHeight:this.minHeight,
+                handles: this.resizeHandles || 'all',
+                pinned: true,
+                resizeElement : this.resizerAction,
+                handleCls: 'x-window-handle'
+            });
+            this.resizer.window = this;
+            this.mon(this.resizer, 'beforeresize', this.beforeResize, this);
+        }
+
+        if(this.draggable){
+            this.header.addClass('x-window-draggable');
+        }
+        this.mon(this.el, 'mousedown', this.toFront, this);
+        this.manager = this.manager || Ext.WindowMgr;
+        this.manager.register(this);
+        if(this.maximized){
+            this.maximized = false;
+            this.maximize();
+        }
+        if(this.closable){
+            var km = this.getKeyMap();
+            km.on(27, this.onEsc, this);
+            km.disable();
+        }
+    },
+
+    initDraggable : function(){
+        /**
+         * <p>If this Window is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DD} which handles dragging the Window's DOM Element.</p>
+         * <p>This has implementations of <code>startDrag</code>, <code>onDrag</code> and <code>endDrag</code>
+         * which perform the dragging action. If extra logic is needed at these points, use
+         * {@link Function#createInterceptor createInterceptor} or {@link Function#createSequence createSequence} to
+         * augment the existing implementations.</p>
+         * @type Ext.dd.DD
+         * @property dd
+         */
+        this.dd = new Ext.Window.DD(this);
+    },
+
+   // private
+    onEsc : function(k, e){
+        if (this.activeGhost) {
+            this.unghost();
+        }
+        e.stopEvent();
+        this[this.closeAction]();
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.hide();
+            this.clearAnchor();
+            Ext.destroy(
+                this.focusEl,
+                this.resizer,
+                this.dd,
+                this.proxy,
+                this.mask
+            );
+        }
+        Ext.Window.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.manager){
+            this.manager.unregister(this);
+        }
+        Ext.Window.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initTools : function(){
+        if(this.minimizable){
+            this.addTool({
+                id: 'minimize',
+                handler: this.minimize.createDelegate(this, [])
+            });
+        }
+        if(this.maximizable){
+            this.addTool({
+                id: 'maximize',
+                handler: this.maximize.createDelegate(this, [])
+            });
+            this.addTool({
+                id: 'restore',
+                handler: this.restore.createDelegate(this, []),
+                hidden:true
+            });
+        }
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction].createDelegate(this, [])
+            });
+        }
+    },
+
+    // private
+    resizerAction : function(){
+        var box = this.proxy.getBox();
+        this.proxy.hide();
+        this.window.handleResize(box);
+        return box;
+    },
+
+    // private
+    beforeResize : function(){
+        this.resizer.minHeight = Math.max(this.minHeight, this.getFrameHeight() + 40); // 40 is a magic minimum content size?
+        this.resizer.minWidth = Math.max(this.minWidth, this.getFrameWidth() + 40);
+        this.resizeBox = this.el.getBox();
+    },
+
+    // private
+    updateHandles : function(){
+        if(Ext.isIE && this.resizer){
+            this.resizer.syncHandleHeight();
+            this.el.repaint();
+        }
+    },
+
+    // private
+    handleResize : function(box){
+        var rz = this.resizeBox;
+        if(rz.x != box.x || rz.y != box.y){
+            this.updateBox(box);
+        }else{
+            this.setSize(box);
+            if (Ext.isIE6 && Ext.isStrict) {
+                this.doLayout();
+            }
+        }
+        this.focus();
+        this.updateHandles();
+        this.saveState();
+    },
+
+    /**
+     * Focuses the window.  If a defaultButton is set, it will receive focus, otherwise the
+     * window itself will receive focus.
+     */
+    focus : function(){
+        var f = this.focusEl,
+            db = this.defaultButton,
+            t = typeof db,
+            el,
+            ct;
+        if(Ext.isDefined(db)){
+            if(Ext.isNumber(db) && this.fbar){
+                f = this.fbar.items.get(db);
+            }else if(Ext.isString(db)){
+                f = Ext.getCmp(db);
+            }else{
+                f = db;
+            }
+            el = f.getEl();
+            ct = Ext.getDom(this.container);
+            if (el && ct) {
+                if (ct != document.body && !Ext.lib.Region.getRegion(ct).contains(Ext.lib.Region.getRegion(el.dom))){
+                    return;
+                }
+            }
+        }
+        f = f || this.focusEl;
+        f.focus.defer(10, f);
+    },
+
+    /**
+     * Sets the target element from which the window should animate while opening.
+     * @param {String/Element} el The target element or id
+     */
+    setAnimateTarget : function(el){
+        el = Ext.get(el);
+        this.animateTarget = el;
+    },
+
+    // private
+    beforeShow : function(){
+        delete this.el.lastXY;
+        delete this.el.lastLT;
+        if(this.x === undefined || this.y === undefined){
+            var xy = this.el.getAlignToXY(this.container, 'c-c');
+            var pos = this.el.translatePoints(xy[0], xy[1]);
+            this.x = this.x === undefined? pos.left : this.x;
+            this.y = this.y === undefined? pos.top : this.y;
+        }
+        this.el.setLeftTop(this.x, this.y);
+
+        if(this.expandOnShow){
+            this.expand(false);
+        }
+
+        if(this.modal){
+            Ext.getBody().addClass('x-body-masked');
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.mask.show();
+        }
+    },
+
+    /**
+     * Shows the window, rendering it first if necessary, or activates it and brings it to front if hidden.
+     * @param {String/Element} animateTarget (optional) The target element or id from which the window should
+     * animate while opening (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is displayed
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    show : function(animateTarget, cb, scope){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        if(this.hidden === false){
+            this.toFront();
+            return this;
+        }
+        if(this.fireEvent('beforeshow', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('show', cb, scope, {single:true});
+        }
+        this.hidden = false;
+        if(Ext.isDefined(animateTarget)){
+            this.setAnimateTarget(animateTarget);
+        }
+        this.beforeShow();
+        if(this.animateTarget){
+            this.animShow();
+        }else{
+            this.afterShow();
+        }
+        return this;
+    },
+
+    // private
+    afterShow : function(isAnim){
+        if (this.isDestroyed){
+            return false;
+        }
+        this.proxy.hide();
+        this.el.setStyle('display', 'block');
+        this.el.show();
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+            this.cascade(this.setAutoScroll);
+        }
+
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.onWindowResize(this.onWindowResize, this);
+        }
+        this.doConstrain();
+        this.doLayout();
+        if(this.keyMap){
+            this.keyMap.enable();
+        }
+        this.toFront();
+        this.updateHandles();
+        if(isAnim && (Ext.isIE || Ext.isWebKit)){
+            var sz = this.getSize();
+            this.onResize(sz.width, sz.height);
+        }
+        this.onShow();
+        this.fireEvent('show', this);
+    },
+
+    // private
+    animShow : function(){
+        this.proxy.show();
+        this.proxy.setBox(this.animateTarget.getBox());
+        this.proxy.setOpacity(0);
+        var b = this.getBox();
+        this.el.setStyle('display', 'none');
+        this.proxy.shift(Ext.apply(b, {
+            callback: this.afterShow.createDelegate(this, [true], false),
+            scope: this,
+            easing: 'easeNone',
+            duration: this.showAnimDuration,
+            opacity: 0.5
+        }));
+    },
+
+    /**
+     * Hides the window, setting it to invisible and applying negative offsets.
+     * @param {String/Element} animateTarget (optional) The target element or id to which the window should
+     * animate while hiding (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is hidden
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    hide : function(animateTarget, cb, scope){
+        if(this.hidden || this.fireEvent('beforehide', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('hide', cb, scope, {single:true});
+        }
+        this.hidden = true;
+        if(animateTarget !== undefined){
+            this.setAnimateTarget(animateTarget);
+        }
+        if(this.modal){
+            this.mask.hide();
+            Ext.getBody().removeClass('x-body-masked');
+        }
+        if(this.animateTarget){
+            this.animHide();
+        }else{
+            this.el.hide();
+            this.afterHide();
+        }
+        return this;
+    },
+
+    // private
+    afterHide : function(){
+        this.proxy.hide();
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.removeResizeListener(this.onWindowResize, this);
+        }
+        if(this.keyMap){
+            this.keyMap.disable();
+        }
+        this.onHide();
+        this.fireEvent('hide', this);
+    },
+
+    // private
+    animHide : function(){
+        this.proxy.setOpacity(0.5);
+        this.proxy.show();
+        var tb = this.getBox(false);
+        this.proxy.setBox(tb);
+        this.el.hide();
+        this.proxy.shift(Ext.apply(this.animateTarget.getBox(), {
+            callback: this.afterHide,
+            scope: this,
+            duration: this.hideAnimDuration,
+            easing: 'easeNone',
+            opacity: 0
+        }));
+    },
+
+    /**
+     * Method that is called immediately before the <code>show</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onShow : Ext.emptyFn,
+
+    /**
+     * Method that is called immediately before the <code>hide</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onHide : Ext.emptyFn,
+
+    // private
+    onWindowResize : function(){
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(this.modal){
+            this.mask.setSize('100%', '100%');
+            var force = this.mask.dom.offsetHeight;
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        }
+        this.doConstrain();
+    },
+
+    // private
+    doConstrain : function(){
+        if(this.constrain || this.constrainHeader){
+            var offsets;
+            if(this.constrain){
+                offsets = {
+                    right:this.el.shadowOffset,
+                    left:this.el.shadowOffset,
+                    bottom:this.el.shadowOffset
+                };
+            }else {
+                var s = this.getSize();
+                offsets = {
+                    right:-(s.width - 100),
+                    bottom:-(s.height - 25 + this.el.getConstrainOffset())
+                };
+            }
+
+            var xy = this.el.getConstrainToXY(this.container, true, offsets);
+            if(xy){
+                this.setPosition(xy[0], xy[1]);
+            }
+        }
+    },
+
+    // private - used for dragging
+    ghost : function(cls){
+        var ghost = this.createGhost(cls);
+        var box = this.getBox(true);
+        ghost.setLeftTop(box.x, box.y);
+        ghost.setWidth(box.width);
+        this.el.hide();
+        this.activeGhost = ghost;
+        return ghost;
+    },
+
+    // private
+    unghost : function(show, matchPosition){
+        if(!this.activeGhost) {
+            return;
+        }
+        if(show !== false){
+            this.el.show();
+            this.focus.defer(10, this);
+            if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                this.cascade(this.setAutoScroll);
+            }
+        }
+        if(matchPosition !== false){
+            this.setPosition(this.activeGhost.getLeft(true), this.activeGhost.getTop(true));
+        }
+        this.activeGhost.hide();
+        this.activeGhost.remove();
+        delete this.activeGhost;
+    },
+
+    /**
+     * Placeholder method for minimizing the window.  By default, this method simply fires the {@link #minimize} event
+     * since the behavior of minimizing a window is application-specific.  To implement custom minimize behavior,
+     * either the minimize event can be handled or this method can be overridden.
+     * @return {Ext.Window} this
+     */
+    minimize : function(){
+        this.fireEvent('minimize', this);
+        return this;
+    },
+
+    /**
+     * <p>Closes the Window, removes it from the DOM, {@link Ext.Component#destroy destroy}s
+     * the Window object and all its descendant Components. The {@link Ext.Panel#beforeclose beforeclose}
+     * event is fired before the close happens and will cancel the close action if it returns false.<p>
+     * <p><b>Note:</b> This method is not affected by the {@link #closeAction} setting which
+     * only affects the action triggered when clicking the {@link #closable 'close' tool in the header}.
+     * To hide the Window without destroying it, call {@link #hide}.</p>
+     */
+    close : function(){
+        if(this.fireEvent('beforeclose', this) !== false){
+            if(this.hidden){
+                this.doClose();
+            }else{
+                this.hide(null, this.doClose, this);
+            }
+        }
+    },
+
+    // private
+    doClose : function(){
+        this.fireEvent('close', this);
+        this.destroy();
+    },
+
+    /**
+     * Fits the window within its current container and automatically replaces
+     * the {@link #maximizable 'maximize' tool button} with the 'restore' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    maximize : function(){
+        if(!this.maximized){
+            this.expand(false);
+            this.restoreSize = this.getSize();
+            this.restorePos = this.getPosition(true);
+            if (this.maximizable){
+                this.tools.maximize.hide();
+                this.tools.restore.show();
+            }
+            this.maximized = true;
+            this.el.disableShadow();
+
+            if(this.dd){
+                this.dd.lock();
+            }
+            if(this.collapsible){
+                this.tools.toggle.hide();
+            }
+            this.el.addClass('x-window-maximized');
+            this.container.addClass('x-window-maximized-ct');
+
+            this.setPosition(0, 0);
+            this.fitContainer();
+            this.fireEvent('maximize', this);
+        }
+        return this;
+    },
+
+    /**
+     * Restores a {@link #maximizable maximized}  window back to its original
+     * size and position prior to being maximized and also replaces
+     * the 'restore' tool button with the 'maximize' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    restore : function(){
+        if(this.maximized){
+            var t = this.tools;
+            this.el.removeClass('x-window-maximized');
+            if(t.restore){
+                t.restore.hide();
+            }
+            if(t.maximize){
+                t.maximize.show();
+            }
+            this.setPosition(this.restorePos[0], this.restorePos[1]);
+            this.setSize(this.restoreSize.width, this.restoreSize.height);
+            delete this.restorePos;
+            delete this.restoreSize;
+            this.maximized = false;
+            this.el.enableShadow(true);
+
+            if(this.dd){
+                this.dd.unlock();
+            }
+            if(this.collapsible && t.toggle){
+                t.toggle.show();
+            }
+            this.container.removeClass('x-window-maximized-ct');
+
+            this.doConstrain();
+            this.fireEvent('restore', this);
+        }
+        return this;
+    },
+
+    /**
+     * A shortcut method for toggling between {@link #maximize} and {@link #restore} based on the current maximized
+     * state of the window.
+     * @return {Ext.Window} this
+     */
+    toggleMaximize : function(){
+        return this[this.maximized ? 'restore' : 'maximize']();
+    },
+
+    // private
+    fitContainer : function(){
+        var vs = this.container.getViewSize(false);
+        this.setSize(vs.width, vs.height);
+    },
+
+    // private
+    // z-index is managed by the WindowManager and may be overwritten at any time
+    setZIndex : function(index){
+        if(this.modal){
+            this.mask.setStyle('z-index', index);
+        }
+        this.el.setZIndex(++index);
+        index += 5;
+
+        if(this.resizer){
+            this.resizer.proxy.setStyle('z-index', ++index);
+        }
+
+        this.lastZIndex = index;
+    },
+
+    /**
+     * Aligns the window to the specified element
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to (see {@link Ext.Element#alignTo} for more details).
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Ext.Window} this
+     */
+    alignTo : function(element, position, offsets){
+        var xy = this.el.getAlignToXY(element, position, offsets);
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    },
+
+    /**
+     * Anchors this window to another element and realigns it when the window is resized or scrolled.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to (see {@link Ext.Element#alignTo} for more details)
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Number} monitorScroll (optional) true to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @return {Ext.Window} this
+     */
+    anchorTo : function(el, alignment, offsets, monitorScroll){
+        this.clearAnchor();
+        this.anchorTarget = {
+            el: el,
+            alignment: alignment,
+            offsets: offsets
+        };
+
+        Ext.EventManager.onWindowResize(this.doAnchor, this);
+        var tm = typeof monitorScroll;
+        if(tm != 'undefined'){
+            Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
+                {buffer: tm == 'number' ? monitorScroll : 50});
+        }
+        return this.doAnchor();
+    },
+
+    /**
+     * Performs the anchor, using the saved anchorTarget property.
+     * @return {Ext.Window} this
+     * @private
+     */
+    doAnchor : function(){
+        var o = this.anchorTarget;
+        this.alignTo(o.el, o.alignment, o.offsets);
+        return this;
+    },
+
+    /**
+     * Removes any existing anchor from this window. See {@link #anchorTo}.
+     * @return {Ext.Window} this
+     */
+    clearAnchor : function(){
+        if(this.anchorTarget){
+            Ext.EventManager.removeResizeListener(this.doAnchor, this);
+            Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
+            delete this.anchorTarget;
+        }
+        return this;
+    },
+
+    /**
+     * Brings this window to the front of any other visible windows
+     * @param {Boolean} e (optional) Specify <tt>false</tt> to prevent the window from being focused.
+     * @return {Ext.Window} this
+     */
+    toFront : function(e){
+        if(this.manager.bringToFront(this)){
+            if(!e || !e.getTarget().focus){
+                this.focus();
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Makes this the active window by showing its shadow, or deactivates it by hiding its shadow.  This method also
+     * fires the {@link #activate} or {@link #deactivate} event depending on which action occurred. This method is
+     * called internally by {@link Ext.WindowMgr}.
+     * @param {Boolean} active True to activate the window, false to deactivate it (defaults to false)
+     */
+    setActive : function(active){
+        if(active){
+            if(!this.maximized){
+                this.el.enableShadow(true);
+            }
+            this.fireEvent('activate', this);
+        }else{
+            this.el.disableShadow();
+            this.fireEvent('deactivate', this);
+        }
+    },
+
+    /**
+     * Sends this window to the back of (lower z-index than) any other visible windows
+     * @return {Ext.Window} this
+     */
+    toBack : function(){
+        this.manager.sendToBack(this);
+        return this;
+    },
+
+    /**
+     * Centers this window in the viewport
+     * @return {Ext.Window} this
+     */
+    center : function(){
+        var xy = this.el.getAlignToXY(this.container, 'c-c');
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     **/
+});
+Ext.reg('window', Ext.Window);
+
+// private - custom Window DD implementation
+Ext.Window.DD = Ext.extend(Ext.dd.DD, {
+    
+    constructor : function(win){
+        this.win = win;
+        Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
+        this.setHandleElId(win.header.id);
+        this.scroll = false;        
+    },
+    
+    moveOnly:true,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        var w = this.win;
+        this.proxy = w.ghost(w.initialConfig.cls);
+        if(w.constrain !== false){
+            var so = w.el.shadowOffset;
+            this.constrainTo(w.container, {right: so, left: so, bottom: so});
+        }else if(w.constrainHeader !== false){
+            var s = this.proxy.getSize();
+            this.constrainTo(w.container, {right: -(s.width-this.headerOffsets[0]), bottom: -(s.height-this.headerOffsets[1])});
+        }
+    },
+    b4Drag : Ext.emptyFn,
+
+    onDrag : function(e){
+        this.alignElWithMouse(this.proxy, e.getPageX(), e.getPageY());
+    },
+
+    endDrag : function(e){
+        this.win.unghost();
+        this.win.saveState();
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/PanelDD.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/PanelDD.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/PanelDD.js	(revision 76)
@@ -0,0 +1,158 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.PanelProxy
+ * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
+ * for the Panel's drag drop implementation, and should never need to be created directly.
+ * @constructor
+ * @param panel The {@link Ext.Panel} to proxy for
+ * @param config Configuration options
+ */
+Ext.dd.PanelProxy  = Ext.extend(Object, {
+    
+    constructor : function(panel, config){
+        this.panel = panel;
+        this.id = this.panel.id +'-ddproxy';
+        Ext.apply(this, config);        
+    },
+    
+    /**
+     * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
+     * false to drag with no proxy (defaults to true).
+     */
+    insertProxy : true,
+
+    // private overrides
+    setStatus : Ext.emptyFn,
+    reset : Ext.emptyFn,
+    update : Ext.emptyFn,
+    stop : Ext.emptyFn,
+    sync: Ext.emptyFn,
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getEl : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's ghost element
+     * @return {Element} The proxy's ghost element
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getProxy : function(){
+        return this.proxy;
+    },
+
+    /**
+     * Hides the proxy
+     */
+    hide : function(){
+        if(this.ghost){
+            if(this.proxy){
+                this.proxy.remove();
+                delete this.proxy;
+            }
+            this.panel.el.dom.style.display = '';
+            this.ghost.remove();
+            delete this.ghost;
+        }
+    },
+
+    /**
+     * Shows the proxy
+     */
+    show : function(){
+        if(!this.ghost){
+            this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
+            this.ghost.setXY(this.panel.el.getXY());
+            if(this.insertProxy){
+                this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
+                this.proxy.setSize(this.panel.getSize());
+            }
+            this.panel.el.dom.style.display = 'none';
+        }
+    },
+
+    // private
+    repair : function(xy, callback, scope){
+        this.hide();
+        if(typeof callback == "function"){
+            callback.call(scope || this);
+        }
+    },
+
+    /**
+     * Moves the proxy to a different position in the DOM.  This is typically called while dragging the Panel
+     * to keep the proxy sync'd to the Panel's location.
+     * @param {HTMLElement} parentNode The proxy's parent DOM node
+     * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
+     * to the parent's last child if not specified)
+     */
+    moveProxy : function(parentNode, before){
+        if(this.proxy){
+            parentNode.insertBefore(this.proxy.dom, before);
+        }
+    }
+});
+
+// private - DD implementation for Panels
+Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(panel, cfg){
+        this.panel = panel;
+        this.dragData = {panel: panel};
+        this.proxy = new Ext.dd.PanelProxy(panel, cfg);
+        Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
+        var h = panel.header,
+            el = panel.body;
+        if(h){
+            this.setHandleElId(h.id);
+            el = panel.header;
+        }
+        el.setStyle('cursor', 'move');
+        this.scroll = false;        
+    },
+    
+    showFrame: Ext.emptyFn,
+    startDrag: Ext.emptyFn,
+    b4StartDrag: function(x, y) {
+        this.proxy.show();
+    },
+    b4MouseDown: function(e) {
+        var x = e.getPageX(),
+            y = e.getPageY();
+        this.autoOffset(x, y);
+    },
+    onInitDrag : function(x, y){
+        this.onStartDrag(x, y);
+        return true;
+    },
+    createFrame : Ext.emptyFn,
+    getDragEl : function(e){
+        return this.proxy.ghost.dom;
+    },
+    endDrag : function(e){
+        this.proxy.hide();
+        this.panel.saveState();
+    },
+
+    autoOffset : function(x, y) {
+        x -= this.startPageX;
+        y -= this.startPageY;
+        this.setDelta(x, y);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/BoxComponent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/BoxComponent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/BoxComponent.js	(revision 76)
@@ -0,0 +1,591 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.BoxComponent
+ * @extends Ext.Component
+ * <p>Base class for any {@link Ext.Component Component} that is to be sized as a box, using width and height.</p>
+ * <p>BoxComponent provides automatic box model adjustments for sizing and positioning and will work correctly
+ * within the Component rendering model.</p>
+ * <p>A BoxComponent may be created as a custom Component which encapsulates any HTML element, either a pre-existing
+ * element, or one that is created to your specifications at render time. Usually, to participate in layouts,
+ * a Component will need to be a <b>Box</b>Component in order to have its width and height managed.</p>
+ * <p>To use a pre-existing element as a BoxComponent, configure it so that you preset the <b>el</b> property to the
+ * element to reference:<pre><code>
+var pageHeader = new Ext.BoxComponent({
+    el: 'my-header-div'
+});</code></pre>
+ * This may then be {@link Ext.Container#add added} to a {@link Ext.Container Container} as a child item.</p>
+ * <p>To create a BoxComponent based around a HTML element to be created at render time, use the
+ * {@link Ext.Component#autoEl autoEl} config option which takes the form of a
+ * {@link Ext.DomHelper DomHelper} specification:<pre><code>
+var myImage = new Ext.BoxComponent({
+    autoEl: {
+        tag: 'img',
+        src: '/images/my-image.jpg'
+    }
+});</code></pre></p>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options.
+ * @xtype box
+ */
+Ext.BoxComponent = Ext.extend(Ext.Component, {
+
+    // Configs below are used for all Components when rendered by BoxLayout.
+    /**
+     * @cfg {Number} flex
+     * <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use a <b>{@link Ext.layout.BoxLayout BoxLayout}.</b>
+     * Each child Component with a <code>flex</code> property will be flexed either vertically (by a VBoxLayout)
+     * or horizontally (by an HBoxLayout) according to the item's <b>relative</b> <code>flex</code> value
+     * compared to the sum of all Components with <code>flex</flex> value specified. Any child items that have
+     * either a <code>flex = 0</code> or <code>flex = undefined</code> will not be 'flexed' (the initial size will not be changed).
+     */
+    // Configs below are used for all Components when rendered by AnchorLayout.
+    /**
+     * @cfg {String} anchor <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use an <b>{@link Ext.layout.AnchorLayout AnchorLayout} (or subclass thereof).</b>
+     * based layout manager, for example:<div class="mdetail-params"><ul>
+     * <li>{@link Ext.form.FormPanel}</li>
+     * <li>specifying <code>layout: 'anchor' // or 'form', or 'absolute'</code></li>
+     * </ul></div></p>
+     * <p>See {@link Ext.layout.AnchorLayout}.{@link Ext.layout.AnchorLayout#anchor anchor} also.</p>
+     */
+    // tabTip config is used when a BoxComponent is a child of a TabPanel
+    /**
+     * @cfg {String} tabTip
+     * <p><b>Note</b>: this config is only used when this BoxComponent is a child item of a TabPanel.</p>
+     * A string to be used as innerHTML (html tags are accepted) to show in a tooltip when mousing over
+     * the associated tab selector element. {@link Ext.QuickTips}.init()
+     * must be called in order for the tips to render.
+     */
+    // Configs below are used for all Components when rendered by BorderLayout.
+    /**
+     * @cfg {String} region <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * layout manager (e.g. specifying <tt>layout:'border'</tt>).</p><br>
+     * <p>See {@link Ext.layout.BorderLayout} also.</p>
+     */
+    // margins config is used when a BoxComponent is rendered by BorderLayout or BoxLayout.
+    /**
+     * @cfg {Object} margins <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * or one of the two <b>{@link Ext.layout.BoxLayout BoxLayout} subclasses.</b></p>
+     * <p>An object containing margins to apply to this BoxComponent in the
+     * format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Number} x
+     * The local x (left) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} y
+     * The local y (top) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageX
+     * The page level x coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageY
+     * The page level y coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} height
+     * The height of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} width
+     * The width of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} boxMinHeight
+     * <p>The minimum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMinWidth
+     * <p>The minimum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxHeight
+     * <p>The maximum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxWidth
+     * <p>The maximum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <p>True to use height:'auto', false to use fixed height (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components inherit this config option, not all will
+     * function as expected with a height of 'auto'. Setting autoHeight:true means that the
+     * browser will manage height based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the height, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the height might
+     * result in elements needing to be synchronized with the new height. Example:</p><pre><code>
+var w = new Ext.Window({
+    title: 'Window',
+    width: 600,
+    autoHeight: true,
+    items: {
+        title: 'Collapse Me',
+        height: 400,
+        collapsible: true,
+        border: false,
+        listeners: {
+            beforecollapse: function() {
+                w.el.shadow.hide();
+            },
+            beforeexpand: function() {
+                w.el.shadow.hide();
+            },
+            collapse: function() {
+                w.syncShadow();
+            },
+            expand: function() {
+                w.syncShadow();
+            }
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * <p>True to use width:'auto', false to use fixed width (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components  inherit this config option, not all will
+     * function as expected with a width of 'auto'. Setting autoWidth:true means that the
+     * browser will manage width based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the width, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the width might
+     * result in elements needing to be synchronized with the new width. For example, where the target element is:</p><pre><code>
+&lt;div id='grid-container' style='margin-left:25%;width:50%'>&lt;/div>
+</code></pre>
+     * A Panel rendered into that target element must listen for browser window resize in order to relay its
+      * child items when the browser changes its width:<pre><code>
+var myPanel = new Ext.Panel({
+    renderTo: 'grid-container',
+    monitorResize: true, // relay on browser resize
+    title: 'Panel',
+    height: 400,
+    autoWidth: true,
+    layout: 'hbox',
+    layoutConfig: {
+        align: 'stretch'
+    },
+    defaults: {
+        flex: 1
+    },
+    items: [{
+        title: 'Box 1',
+    }, {
+        title: 'Box 2'
+    }, {
+        title: 'Box 3'
+    }],
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoScroll
+     * <code>true</code> to use overflow:'auto' on the components layout element and show scroll bars automatically when
+     * necessary, <code>false</code> to clip any overflowing content (defaults to <code>false</code>).
+     */
+
+    /* // private internal config
+     * {Boolean} deferHeight
+     * True to defer height calculations to an external component, false to allow this component to set its own
+     * height (defaults to false).
+     */
+
+    // private
+    initComponent : function(){
+        Ext.BoxComponent.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event resize
+             * Fires after the component is resized.
+             * @param {Ext.Component} this
+             * @param {Number} adjWidth The box-adjusted width that was set
+             * @param {Number} adjHeight The box-adjusted height that was set
+             * @param {Number} rawWidth The width that was originally specified
+             * @param {Number} rawHeight The height that was originally specified
+             */
+            'resize',
+            /**
+             * @event move
+             * Fires after the component is moved.
+             * @param {Ext.Component} this
+             * @param {Number} x The new x position
+             * @param {Number} y The new y position
+             */
+            'move'
+        );
+    },
+
+    // private, set in afterRender to signify that the component has been rendered
+    boxReady : false,
+    // private, used to defer height settings to subclasses
+    deferHeight: false,
+
+    /**
+     * Sets the width and height of this BoxComponent. This method fires the {@link #resize} event. This method can accept
+     * either width and height as separate arguments, or you can pass a size object like <code>{width:10, height:20}</code>.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+     * <li><code>undefined</code> to leave the width unchanged.</li>
+     * </ul></div>
+     * @param {Mixed} height The new height to set (not required if a size object is passed as the first arg).
+     * This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * <li><code>undefined</code> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setSize : function(w, h){
+
+        // support for standard size objects
+        if(typeof w == 'object'){
+            h = w.height;
+            w = w.width;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMinWidth) && (w < this.boxMinWidth)) {
+            w = this.boxMinWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMinHeight) && (h < this.boxMinHeight)) {
+            h = this.boxMinHeight;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMaxWidth) && (w > this.boxMaxWidth)) {
+            w = this.boxMaxWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMaxHeight) && (h > this.boxMaxHeight)) {
+            h = this.boxMaxHeight;
+        }
+        // not rendered
+        if(!this.boxReady){
+            this.width  = w;
+            this.height = h;
+            return this;
+        }
+
+        // prevent recalcs when not needed
+        if(this.cacheSizes !== false && this.lastSize && this.lastSize.width == w && this.lastSize.height == h){
+            return this;
+        }
+        this.lastSize = {width: w, height: h};
+        var adj = this.adjustSize(w, h),
+            aw = adj.width,
+            ah = adj.height,
+            rz;
+        if(aw !== undefined || ah !== undefined){ // this code is nasty but performs better with floaters
+            rz = this.getResizeEl();
+            if(!this.deferHeight && aw !== undefined && ah !== undefined){
+                rz.setSize(aw, ah);
+            }else if(!this.deferHeight && ah !== undefined){
+                rz.setHeight(ah);
+            }else if(aw !== undefined){
+                rz.setWidth(aw);
+            }
+            this.onResize(aw, ah, w, h);
+            this.fireEvent('resize', this, aw, ah, w, h);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the width of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setWidth : function(width){
+        return this.setSize(width);
+    },
+
+    /**
+     * Sets the height of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} height The new height to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style.</li>
+     * <li><i>undefined</i> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setHeight : function(height){
+        return this.setSize(undefined, height);
+    },
+
+    /**
+     * Gets the current size of the component's underlying element.
+     * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+     */
+    getSize : function(){
+        return this.getResizeEl().getSize();
+    },
+
+    /**
+     * Gets the current width of the component's underlying element.
+     * @return {Number}
+     */
+    getWidth : function(){
+        return this.getResizeEl().getWidth();
+    },
+
+    /**
+     * Gets the current height of the component's underlying element.
+     * @return {Number}
+     */
+    getHeight : function(){
+        return this.getResizeEl().getHeight();
+    },
+
+    /**
+     * Gets the current size of the component's underlying element, including space taken by its margins.
+     * @return {Object} An object containing the element's size {width: (element width + left/right margins), height: (element height + top/bottom margins)}
+     */
+    getOuterSize : function(){
+        var el = this.getResizeEl();
+        return {width: el.getWidth() + el.getMargins('lr'),
+                height: el.getHeight() + el.getMargins('tb')};
+    },
+
+    /**
+     * Gets the current XY position of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Array} The XY position of the element (e.g., [100, 200])
+     */
+    getPosition : function(local){
+        var el = this.getPositionEl();
+        if(local === true){
+            return [el.getLeft(true), el.getTop(true)];
+        }
+        return this.xy || el.getXY();
+    },
+
+    /**
+     * Gets the current box measurements of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Object} box An object in the format {x, y, width, height}
+     */
+    getBox : function(local){
+        var pos = this.getPosition(local);
+        var s = this.getSize();
+        s.x = pos[0];
+        s.y = pos[1];
+        return s;
+    },
+
+    /**
+     * Sets the current box measurements of the component's underlying element.
+     * @param {Object} box An object in the format {x, y, width, height}
+     * @return {Ext.BoxComponent} this
+     */
+    updateBox : function(box){
+        this.setSize(box.width, box.height);
+        this.setPagePosition(box.x, box.y);
+        return this;
+    },
+
+    /**
+     * <p>Returns the outermost Element of this Component which defines the Components overall size.</p>
+     * <p><i>Usually</i> this will return the same Element as <code>{@link #getEl}</code>,
+     * but in some cases, a Component may have some more wrapping Elements around its main
+     * active Element.</p>
+     * <p>An example is a ComboBox. It is encased in a <i>wrapping</i> Element which
+     * contains both the <code>&lt;input></code> Element (which is what would be returned
+     * by its <code>{@link #getEl}</code> method, <i>and</i> the trigger button Element.
+     * This Element is returned as the <code>resizeEl</code>.
+     * @return {Ext.Element} The Element which is to be resized by size managing layouts.
+     */
+    getResizeEl : function(){
+        return this.resizeEl || this.el;
+    },
+
+    /**
+     * Sets the overflow on the content element of the component.
+     * @param {Boolean} scroll True to allow the Component to auto scroll.
+     * @return {Ext.BoxComponent} this
+     */
+    setAutoScroll : function(scroll){
+        if(this.rendered){
+            this.getContentTarget().setOverflow(scroll ? 'auto' : '');
+        }
+        this.autoScroll = scroll;
+        return this;
+    },
+
+    /**
+     * Sets the left and top of the component.  To set the page XY position instead, use {@link #setPagePosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} left The new left
+     * @param {Number} top The new top
+     * @return {Ext.BoxComponent} this
+     */
+    setPosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.x = x;
+        this.y = y;
+        if(!this.boxReady){
+            return this;
+        }
+        var adj = this.adjustPosition(x, y);
+        var ax = adj.x, ay = adj.y;
+
+        var el = this.getPositionEl();
+        if(ax !== undefined || ay !== undefined){
+            if(ax !== undefined && ay !== undefined){
+                el.setLeftTop(ax, ay);
+            }else if(ax !== undefined){
+                el.setLeft(ax);
+            }else if(ay !== undefined){
+                el.setTop(ay);
+            }
+            this.onPosition(ax, ay);
+            this.fireEvent('move', this, ax, ay);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the page XY position of the component.  To set the left and top instead, use {@link #setPosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     * @return {Ext.BoxComponent} this
+     */
+    setPagePosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.pageX = x;
+        this.pageY = y;
+        if(!this.boxReady){
+            return;
+        }
+        if(x === undefined || y === undefined){ // cannot translate undefined points
+            return;
+        }
+        var p = this.getPositionEl().translatePoints(x, y);
+        this.setPosition(p.left, p.top);
+        return this;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.BoxComponent.superclass.afterRender.call(this);
+        if(this.resizeEl){
+            this.resizeEl = Ext.get(this.resizeEl);
+        }
+        if(this.positionEl){
+            this.positionEl = Ext.get(this.positionEl);
+        }
+        this.boxReady = true;
+        Ext.isDefined(this.autoScroll) && this.setAutoScroll(this.autoScroll);
+        this.setSize(this.width, this.height);
+        if(this.x || this.y){
+            this.setPosition(this.x, this.y);
+        }else if(this.pageX || this.pageY){
+            this.setPagePosition(this.pageX, this.pageY);
+        }
+    },
+
+    /**
+     * Force the component's size to recalculate based on the underlying element's current height and width.
+     * @return {Ext.BoxComponent} this
+     */
+    syncSize : function(){
+        delete this.lastSize;
+        this.setSize(this.autoWidth ? undefined : this.getResizeEl().getWidth(), this.autoHeight ? undefined : this.getResizeEl().getHeight());
+        return this;
+    },
+
+    /* // protected
+     * Called after the component is resized, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a resize occurs.
+     * @param {Number} adjWidth The box-adjusted width that was set
+     * @param {Number} adjHeight The box-adjusted height that was set
+     * @param {Number} rawWidth The width that was originally specified
+     * @param {Number} rawHeight The height that was originally specified
+     */
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+    },
+
+    /* // protected
+     * Called after the component is moved, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a move occurs.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     */
+    onPosition : function(x, y){
+
+    },
+
+    // private
+    adjustSize : function(w, h){
+        if(this.autoWidth){
+            w = 'auto';
+        }
+        if(this.autoHeight){
+            h = 'auto';
+        }
+        return {width : w, height: h};
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        return {x : x, y: y};
+    }
+});
+Ext.reg('box', Ext.BoxComponent);
+
+
+/**
+ * @class Ext.Spacer
+ * @extends Ext.BoxComponent
+ * <p>Used to provide a sizable space in a layout.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Spacer = Ext.extend(Ext.BoxComponent, {
+    autoEl:'div'
+});
+Ext.reg('spacer', Ext.Spacer);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Viewport.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Viewport.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Viewport.js	(revision 76)
@@ -0,0 +1,125 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Viewport
+ * @extends Ext.Container
+ * <p>A specialized container representing the viewable application area (the browser viewport).</p>
+ * <p>The Viewport renders itself to the document body, and automatically sizes itself to the size of
+ * the browser viewport and manages window resizing. There may only be one Viewport created
+ * in a page. Inner layouts are available by virtue of the fact that all {@link Ext.Panel Panel}s
+ * added to the Viewport, either through its {@link #items}, or through the items, or the {@link #add}
+ * method of any of its child Panels may themselves have a layout.</p>
+ * <p>The Viewport does not provide scrolling, so child Panels within the Viewport should provide
+ * for scrolling if needed using the {@link #autoScroll} config.</p>
+ * <p>An example showing a classic application border layout:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'north',
+        html: '&lt;h1 class="x-panel-header">Page Title&lt;/h1>',
+        autoHeight: true,
+        border: false,
+        margins: '0 0 5 0'
+    }, {
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        width: 200
+        // the west region might typically utilize a {@link Ext.tree.TreePanel TreePanel} or a Panel with {@link Ext.layout.AccordionLayout Accordion layout}
+    }, {
+        region: 'south',
+        title: 'Title for Panel',
+        collapsible: true,
+        html: 'Information goes here',
+        split: true,
+        height: 100,
+        minHeight: 100
+    }, {
+        region: 'east',
+        title: 'Title for the Grid Panel',
+        collapsible: true,
+        split: true,
+        width: 200,
+        xtype: 'grid',
+        // remaining grid configuration not shown ...
+        // notice that the GridPanel is added directly as the region
+        // it is not "overnested" inside another Panel
+    }, {
+        region: 'center',
+        xtype: 'tabpanel', // TabPanel itself has no title
+        items: {
+            title: 'Default Tab',
+            html: 'The first tab\'s content. Others may be added dynamically'
+        }
+    }]
+});
+</code></pre>
+ * @constructor
+ * Create a new Viewport
+ * @param {Object} config The config object
+ * @xtype viewport
+ */
+Ext.Viewport = Ext.extend(Ext.Container, {
+    /*
+     * Privatize config options which, if used, would interfere with the
+     * correct operation of the Viewport as the sole manager of the
+     * layout of the document body.
+     */
+    /**
+     * @cfg {Mixed} applyTo @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Mixed} renderTo @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Number} height @hide
+     */
+    /**
+     * @cfg {Number} width @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} deferHeight @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize @hide
+     */
+
+    initComponent : function() {
+        Ext.Viewport.superclass.initComponent.call(this);
+        document.getElementsByTagName('html')[0].className += ' x-viewport';
+        this.el = Ext.getBody();
+        this.el.setHeight = Ext.emptyFn;
+        this.el.setWidth = Ext.emptyFn;
+        this.el.setSize = Ext.emptyFn;
+        this.el.dom.scroll = 'no';
+        this.allowDomMove = false;
+        this.autoWidth = true;
+        this.autoHeight = true;
+        Ext.EventManager.onWindowResize(this.fireResize, this);
+        this.renderTo = this.el;
+    },
+
+    fireResize : function(w, h){
+        this.fireEvent('resize', this, w, h, w, h);
+    }
+});
+Ext.reg('viewport', Ext.Viewport);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitBar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitBar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitBar.js	(revision 76)
@@ -0,0 +1,436 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.SplitBar
+ * @extends Ext.util.Observable
+ * Creates draggable splitter bar functionality from two elements (element to be dragged and element to be resized).
+ * <br><br>
+ * Usage:
+ * <pre><code>
+var split = new Ext.SplitBar("elementToDrag", "elementToSize",
+                   Ext.SplitBar.HORIZONTAL, Ext.SplitBar.LEFT);
+split.setAdapter(new Ext.SplitBar.AbsoluteLayoutAdapter("container"));
+split.minSize = 100;
+split.maxSize = 600;
+split.animate = true;
+split.on('moved', splitterMoved);
+</code></pre>
+ * @constructor
+ * Create a new SplitBar
+ * @param {Mixed} dragElement The element to be dragged and act as the SplitBar.
+ * @param {Mixed} resizingElement The element to be resized based on where the SplitBar element is dragged
+ * @param {Number} orientation (optional) Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+ * @param {Number} placement (optional) Either Ext.SplitBar.LEFT or Ext.SplitBar.RIGHT for horizontal or
+                        Ext.SplitBar.TOP or Ext.SplitBar.BOTTOM for vertical. (By default, this is determined automatically by the initial
+                        position of the SplitBar).
+ */
+Ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){
+
+    /** @private */
+    this.el = Ext.get(dragElement, true);
+    this.el.dom.unselectable = "on";
+    /** @private */
+    this.resizingEl = Ext.get(resizingElement, true);
+
+    /**
+     * @private
+     * The orientation of the split. Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+     * Note: If this is changed after creating the SplitBar, the placement property must be manually updated
+     * @type Number
+     */
+    this.orientation = orientation || Ext.SplitBar.HORIZONTAL;
+
+    /**
+     * The increment, in pixels by which to move this SplitBar. When <i>undefined</i>, the SplitBar moves smoothly.
+     * @type Number
+     * @property tickSize
+     */
+    /**
+     * The minimum size of the resizing element. (Defaults to 0)
+     * @type Number
+     */
+    this.minSize = 0;
+
+    /**
+     * The maximum size of the resizing element. (Defaults to 2000)
+     * @type Number
+     */
+    this.maxSize = 2000;
+
+    /**
+     * Whether to animate the transition to the new size
+     * @type Boolean
+     */
+    this.animate = false;
+
+    /**
+     * Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.
+     * @type Boolean
+     */
+    this.useShim = false;
+
+    /** @private */
+    this.shim = null;
+
+    if(!existingProxy){
+        /** @private */
+        this.proxy = Ext.SplitBar.createProxy(this.orientation);
+    }else{
+        this.proxy = Ext.get(existingProxy).dom;
+    }
+    /** @private */
+    this.dd = new Ext.dd.DDProxy(this.el.dom.id, "XSplitBars", {dragElId : this.proxy.id});
+
+    /** @private */
+    this.dd.b4StartDrag = this.onStartProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dd.endDrag = this.onEndProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dragSpecs = {};
+
+    /**
+     * @private The adapter to use to positon and resize elements
+     */
+    this.adapter = new Ext.SplitBar.BasicLayoutAdapter();
+    this.adapter.init(this);
+
+    if(this.orientation == Ext.SplitBar.HORIZONTAL){
+        /** @private */
+        this.placement = placement || (this.el.getX() > this.resizingEl.getX() ? Ext.SplitBar.LEFT : Ext.SplitBar.RIGHT);
+        this.el.addClass("x-splitbar-h");
+    }else{
+        /** @private */
+        this.placement = placement || (this.el.getY() > this.resizingEl.getY() ? Ext.SplitBar.TOP : Ext.SplitBar.BOTTOM);
+        this.el.addClass("x-splitbar-v");
+    }
+
+    this.addEvents(
+        /**
+         * @event resize
+         * Fires when the splitter is moved (alias for {@link #moved})
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "resize",
+        /**
+         * @event moved
+         * Fires when the splitter is moved
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "moved",
+        /**
+         * @event beforeresize
+         * Fires before the splitter is dragged
+         * @param {Ext.SplitBar} this
+         */
+        "beforeresize",
+
+        "beforeapply"
+    );
+
+    Ext.SplitBar.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.SplitBar, Ext.util.Observable, {
+    onStartProxyDrag : function(x, y){
+        this.fireEvent("beforeresize", this);
+        this.overlay =  Ext.DomHelper.append(document.body,  {cls: "x-drag-overlay", html: "&#160;"}, true);
+        this.overlay.unselectable();
+        this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        this.overlay.show();
+        Ext.get(this.proxy).setDisplayed("block");
+        var size = this.adapter.getElementSize(this);
+        this.activeMinSize = this.getMinimumSize();
+        this.activeMaxSize = this.getMaximumSize();
+        var c1 = size - this.activeMinSize;
+        var c2 = Math.max(this.activeMaxSize - size, 0);
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(
+                this.placement == Ext.SplitBar.LEFT ? c1 : c2,
+                this.placement == Ext.SplitBar.LEFT ? c2 : c1,
+                this.tickSize
+            );
+            this.dd.setYConstraint(0, 0);
+        }else{
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(0, 0);
+            this.dd.setYConstraint(
+                this.placement == Ext.SplitBar.TOP ? c1 : c2,
+                this.placement == Ext.SplitBar.TOP ? c2 : c1,
+                this.tickSize
+            );
+         }
+        this.dragSpecs.startSize = size;
+        this.dragSpecs.startPoint = [x, y];
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd, x, y);
+    },
+
+    /**
+     * @private Called after the drag operation by the DDProxy
+     */
+    onEndProxyDrag : function(e){
+        Ext.get(this.proxy).setDisplayed(false);
+        var endPoint = Ext.lib.Event.getXY(e);
+        if(this.overlay){
+            Ext.destroy(this.overlay);
+            delete this.overlay;
+        }
+        var newSize;
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.LEFT ?
+                    endPoint[0] - this.dragSpecs.startPoint[0] :
+                    this.dragSpecs.startPoint[0] - endPoint[0]
+                );
+        }else{
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.TOP ?
+                    endPoint[1] - this.dragSpecs.startPoint[1] :
+                    this.dragSpecs.startPoint[1] - endPoint[1]
+                );
+        }
+        newSize = Math.min(Math.max(newSize, this.activeMinSize), this.activeMaxSize);
+        if(newSize != this.dragSpecs.startSize){
+            if(this.fireEvent('beforeapply', this, newSize) !== false){
+                this.adapter.setElementSize(this, newSize);
+                this.fireEvent("moved", this, newSize);
+                this.fireEvent("resize", this, newSize);
+            }
+        }
+    },
+
+    /**
+     * Get the adapter this SplitBar uses
+     * @return The adapter object
+     */
+    getAdapter : function(){
+        return this.adapter;
+    },
+
+    /**
+     * Set the adapter this SplitBar uses
+     * @param {Object} adapter A SplitBar adapter object
+     */
+    setAdapter : function(adapter){
+        this.adapter = adapter;
+        this.adapter.init(this);
+    },
+
+    /**
+     * Gets the minimum size for the resizing element
+     * @return {Number} The minimum size
+     */
+    getMinimumSize : function(){
+        return this.minSize;
+    },
+
+    /**
+     * Sets the minimum size for the resizing element
+     * @param {Number} minSize The minimum size
+     */
+    setMinimumSize : function(minSize){
+        this.minSize = minSize;
+    },
+
+    /**
+     * Gets the maximum size for the resizing element
+     * @return {Number} The maximum size
+     */
+    getMaximumSize : function(){
+        return this.maxSize;
+    },
+
+    /**
+     * Sets the maximum size for the resizing element
+     * @param {Number} maxSize The maximum size
+     */
+    setMaximumSize : function(maxSize){
+        this.maxSize = maxSize;
+    },
+
+    /**
+     * Sets the initialize size for the resizing element
+     * @param {Number} size The initial size
+     */
+    setCurrentSize : function(size){
+        var oldAnimate = this.animate;
+        this.animate = false;
+        this.adapter.setElementSize(this, size);
+        this.animate = oldAnimate;
+    },
+
+    /**
+     * Destroy this splitbar.
+     * @param {Boolean} removeEl True to remove the element
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.shim, Ext.get(this.proxy));
+        this.dd.unreg();
+        if(removeEl){
+            this.el.remove();
+        }
+        this.purgeListeners();
+    }
+});
+
+/**
+ * @private static Create our own proxy element element. So it will be the same same size on all browsers, we won't use borders. Instead we use a background color.
+ */
+Ext.SplitBar.createProxy = function(dir){
+    var proxy = new Ext.Element(document.createElement("div"));
+    document.body.appendChild(proxy.dom);
+    proxy.unselectable();
+    var cls = 'x-splitbar-proxy';
+    proxy.addClass(cls + ' ' + (dir == Ext.SplitBar.HORIZONTAL ? cls +'-h' : cls + '-v'));
+    return proxy.dom;
+};
+
+/**
+ * @class Ext.SplitBar.BasicLayoutAdapter
+ * Default Adapter. It assumes the splitter and resizing element are not positioned
+ * elements and only gets/sets the width of the element. Generally used for table based layouts.
+ */
+Ext.SplitBar.BasicLayoutAdapter = function(){
+};
+
+Ext.SplitBar.BasicLayoutAdapter.prototype = {
+    // do nothing for now
+    init : function(s){
+
+    },
+    /**
+     * Called before drag operations to get the current size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     */
+     getElementSize : function(s){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            return s.resizingEl.getWidth();
+        }else{
+            return s.resizingEl.getHeight();
+        }
+    },
+
+    /**
+     * Called after drag operations to set the size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     * @param {Number} newSize The new size to set
+     * @param {Function} onComplete A function to be invoked when resizing is complete
+     */
+    setElementSize : function(s, newSize, onComplete){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            if(!s.animate){
+                s.resizingEl.setWidth(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setWidth(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }else{
+
+            if(!s.animate){
+                s.resizingEl.setHeight(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setHeight(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }
+    }
+};
+
+/**
+ *@class Ext.SplitBar.AbsoluteLayoutAdapter
+ * @extends Ext.SplitBar.BasicLayoutAdapter
+ * Adapter that  moves the splitter element to align with the resized sizing element.
+ * Used with an absolute positioned SplitBar.
+ * @param {Mixed} container The container that wraps around the absolute positioned content. If it's
+ * document.body, make sure you assign an id to the body element.
+ */
+Ext.SplitBar.AbsoluteLayoutAdapter = function(container){
+    this.basic = new Ext.SplitBar.BasicLayoutAdapter();
+    this.container = Ext.get(container);
+};
+
+Ext.SplitBar.AbsoluteLayoutAdapter.prototype = {
+    init : function(s){
+        this.basic.init(s);
+    },
+
+    getElementSize : function(s){
+        return this.basic.getElementSize(s);
+    },
+
+    setElementSize : function(s, newSize, onComplete){
+        this.basic.setElementSize(s, newSize, this.moveSplitter.createDelegate(this, [s]));
+    },
+
+    moveSplitter : function(s){
+        var yes = Ext.SplitBar;
+        switch(s.placement){
+            case yes.LEFT:
+                s.el.setX(s.resizingEl.getRight());
+                break;
+            case yes.RIGHT:
+                s.el.setStyle("right", (this.container.getWidth() - s.resizingEl.getLeft()) + "px");
+                break;
+            case yes.TOP:
+                s.el.setY(s.resizingEl.getBottom());
+                break;
+            case yes.BOTTOM:
+                s.el.setY(s.resizingEl.getTop() - s.el.getHeight());
+                break;
+        }
+    }
+};
+
+/**
+ * Orientation constant - Create a vertical SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.VERTICAL = 1;
+
+/**
+ * Orientation constant - Create a horizontal SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.HORIZONTAL = 2;
+
+/**
+ * Placement constant - The resizing element is to the left of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.LEFT = 1;
+
+/**
+ * Placement constant - The resizing element is to the right of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.RIGHT = 2;
+
+/**
+ * Placement constant - The resizing element is positioned above the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.TOP = 3;
+
+/**
+ * Placement constant - The resizing element is positioned under splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.BOTTOM = 4;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeFilter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeFilter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeFilter.js	(revision 76)
@@ -0,0 +1,114 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeFilter
+ * Note this class is experimental and doesn't update the indent (lines) or expand collapse icons of the nodes
+ * @param {TreePanel} tree
+ * @param {Object} config (optional)
+ */
+Ext.tree.TreeFilter = function(tree, config){
+    this.tree = tree;
+    this.filtered = {};
+    Ext.apply(this, config);
+};
+
+Ext.tree.TreeFilter.prototype = {
+    clearBlank:false,
+    reverse:false,
+    autoClear:false,
+    remove:false,
+
+     /**
+     * Filter the data by a specific attribute.
+     * @param {String/RegExp} value Either string that the attribute value
+     * should start with or a RegExp to test against the attribute
+     * @param {String} attr (optional) The attribute passed in your node's attributes collection. Defaults to "text".
+     * @param {TreeNode} startNode (optional) The node to start the filter at.
+     */
+    filter : function(value, attr, startNode){
+        attr = attr || "text";
+        var f;
+        if(typeof value == "string"){
+            var vlen = value.length;
+            // auto clear empty filter
+            if(vlen == 0 && this.clearBlank){
+                this.clear();
+                return;
+            }
+            value = value.toLowerCase();
+            f = function(n){
+                return n.attributes[attr].substr(0, vlen).toLowerCase() == value;
+            };
+        }else if(value.exec){ // regex?
+            f = function(n){
+                return value.test(n.attributes[attr]);
+            };
+        }else{
+            throw 'Illegal filter type, must be string or regex';
+        }
+        this.filterBy(f, null, startNode);
+	},
+
+    /**
+     * Filter by a function. The passed function will be called with each
+     * node in the tree (or from the startNode). If the function returns true, the node is kept
+     * otherwise it is filtered. If a node is filtered, its children are also filtered.
+     * @param {Function} fn The filter function
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     */
+    filterBy : function(fn, scope, startNode){
+        startNode = startNode || this.tree.root;
+        if(this.autoClear){
+            this.clear();
+        }
+        var af = this.filtered, rv = this.reverse;
+        var f = function(n){
+            if(n == startNode){
+                return true;
+            }
+            if(af[n.id]){
+                return false;
+            }
+            var m = fn.call(scope || n, n);
+            if(!m || rv){
+                af[n.id] = n;
+                n.ui.hide();
+                return false;
+            }
+            return true;
+        };
+        startNode.cascade(f);
+        if(this.remove){
+           for(var id in af){
+               if(typeof id != "function"){
+                   var n = af[id];
+                   if(n && n.parentNode){
+                       n.parentNode.removeChild(n);
+                   }
+               }
+           }
+        }
+    },
+
+    /**
+     * Clears the current filter. Note: with the "remove" option
+     * set a filter cannot be cleared.
+     */
+    clear : function(){
+        var t = this.tree;
+        var af = this.filtered;
+        for(var id in af){
+            if(typeof id != "function"){
+                var n = af[id];
+                if(n){
+                    n.ui.show();
+                }
+            }
+        }
+        this.filtered = {};
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNode.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNode.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNode.js	(revision 76)
@@ -0,0 +1,627 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeNode
+ * @extends Ext.data.Node
+ * @cfg {String} text The text for this node
+ * @cfg {Boolean} expanded true to start the node expanded
+ * @cfg {Boolean} allowDrag False to make this node undraggable if {@link #draggable} = true (defaults to true)
+ * @cfg {Boolean} allowDrop False if this node cannot have child nodes dropped on it (defaults to true)
+ * @cfg {Boolean} disabled true to start the node disabled
+ * @cfg {String} icon The path to an icon for the node. The preferred way to do this
+ * is to use the cls or iconCls attributes and add the icon via a CSS background image.
+ * @cfg {String} cls A css class to be added to the node
+ * @cfg {String} iconCls A css class to be added to the nodes icon element for applying css background images
+ * @cfg {String} href URL of the link used for the node (defaults to #)
+ * @cfg {String} hrefTarget target frame for the link
+ * @cfg {Boolean} hidden True to render hidden. (Defaults to false).
+ * @cfg {String} qtip An Ext QuickTip for the node
+ * @cfg {Boolean} expandable If set to true, the node will always show a plus/minus icon, even when empty
+ * @cfg {String} qtipCfg An Ext QuickTip config for the node (used instead of qtip)
+ * @cfg {Boolean} singleClickExpand True for single click expand on this node
+ * @cfg {Function} uiProvider A UI <b>class</b> to use for this node (defaults to Ext.tree.TreeNodeUI)
+ * @cfg {Boolean} checked True to render a checked checkbox for this node, false to render an unchecked checkbox
+ * (defaults to undefined with no checkbox rendered)
+ * @cfg {Boolean} draggable True to make this node draggable (defaults to false)
+ * @cfg {Boolean} isTarget False to not allow this node to act as a drop target (defaults to true)
+ * @cfg {Boolean} allowChildren False to not allow this node to have child nodes (defaults to true)
+ * @cfg {Boolean} editable False to not allow this node to be edited by an {@link Ext.tree.TreeEditor} (defaults to true)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node
+ */
+Ext.tree.TreeNode = Ext.extend(Ext.data.Node, {
+    
+    constructor : function(attributes){
+        attributes = attributes || {};
+        if(Ext.isString(attributes)){
+            attributes = {text: attributes};
+        }
+        this.childrenRendered = false;
+        this.rendered = false;
+        Ext.tree.TreeNode.superclass.constructor.call(this, attributes);
+        this.expanded = attributes.expanded === true;
+        this.isTarget = attributes.isTarget !== false;
+        this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;
+        this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;
+
+        /**
+         * Read-only. The text for this node. To change it use <code>{@link #setText}</code>.
+         * @type String
+         */
+        this.text = attributes.text;
+        /**
+         * True if this node is disabled.
+         * @type Boolean
+         */
+        this.disabled = attributes.disabled === true;
+        /**
+         * True if this node is hidden.
+         * @type Boolean
+         */
+        this.hidden = attributes.hidden === true;
+    
+        this.addEvents(
+            /**
+            * @event textchange
+            * Fires when the text for this node is changed
+            * @param {Node} this This node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpand
+            * Fires before this node is expanded, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpand',
+            /**
+            * @event beforecollapse
+            * Fires before this node is collapsed, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapse',
+            /**
+            * @event expand
+            * Fires when this node is expanded
+            * @param {Node} this This node
+            */
+            'expand',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of this node changes
+            * @param {Node} this This node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapse
+            * Fires when this node is collapsed
+            * @param {Node} this This node
+            */
+            'collapse',
+            /**
+            * @event beforeclick
+            * Fires before click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when this node is clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when this node is double clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event contextmenu
+            * Fires when this node is right clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for this node are rendered
+            * @param {Node} this This node
+            */
+            'beforechildrenrendered'
+        );
+    
+        var uiClass = this.attributes.uiProvider || this.defaultUI || Ext.tree.TreeNodeUI;
+    
+        /**
+         * Read-only. The UI for this node
+         * @type TreeNodeUI
+         */
+        this.ui = new uiClass(this);    
+    },
+    
+    preventHScroll : true,
+    /**
+     * Returns true if this node is expanded
+     * @return {Boolean}
+     */
+    isExpanded : function(){
+        return this.expanded;
+    },
+
+/**
+ * Returns the UI object for this node.
+ * @return {TreeNodeUI} The object which is providing the user interface for this tree
+ * node. Unless otherwise specified in the {@link #uiProvider}, this will be an instance
+ * of {@link Ext.tree.TreeNodeUI}
+ */
+    getUI : function(){
+        return this.ui;
+    },
+
+    getLoader : function(){
+        var owner;
+        return this.loader || ((owner = this.getOwnerTree()) && owner.loader ? owner.loader : (this.loader = new Ext.tree.TreeLoader()));
+    },
+
+    // private override
+    setFirstChild : function(node){
+        var of = this.firstChild;
+        Ext.tree.TreeNode.superclass.setFirstChild.call(this, node);
+        if(this.childrenRendered && of && node != of){
+            of.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // private override
+    setLastChild : function(node){
+        var ol = this.lastChild;
+        Ext.tree.TreeNode.superclass.setLastChild.call(this, node);
+        if(this.childrenRendered && ol && node != ol){
+            ol.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // these methods are overridden to provide lazy rendering support
+    // private override
+    appendChild : function(n){
+        if(!n.render && !Ext.isArray(n)){
+            n = this.getLoader().createNode(n);
+        }
+        var node = Ext.tree.TreeNode.superclass.appendChild.call(this, n);
+        if(node && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return node;
+    },
+
+    // private override
+    removeChild : function(node, destroy){
+        this.ownerTree.getSelectionModel().unselect(node);
+        Ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);
+        // only update the ui if we're not destroying
+        if(!destroy){
+            var rendered = node.ui.rendered;
+            // if it's been rendered remove dom node
+            if(rendered){
+                node.ui.remove();
+            }
+            if(rendered && this.childNodes.length < 1){
+                this.collapse(false, false);
+            }else{
+                this.ui.updateExpandIcon();
+            }
+            if(!this.firstChild && !this.isHiddenRoot()){
+                this.childrenRendered = false;
+            }
+        }
+        return node;
+    },
+
+    // private override
+    insertBefore : function(node, refNode){
+        if(!node.render){
+            node = this.getLoader().createNode(node);
+        }
+        var newNode = Ext.tree.TreeNode.superclass.insertBefore.call(this, node, refNode);
+        if(newNode && refNode && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return newNode;
+    },
+
+    /**
+     * Sets the text for this node
+     * @param {String} text
+     */
+    setText : function(text){
+        var oldText = this.text;
+        this.text = this.attributes.text = text;
+        if(this.rendered){ // event without subscribing
+            this.ui.onTextChange(this, text, oldText);
+        }
+        this.fireEvent('textchange', this, text, oldText);
+    },
+    
+    /**
+     * Sets the icon class for this node.
+     * @param {String} cls
+     */
+    setIconCls : function(cls){
+        var old = this.attributes.iconCls;
+        this.attributes.iconCls = cls;
+        if(this.rendered){
+            this.ui.onIconClsChange(this, cls, old);
+        }
+    },
+    
+    /**
+     * Sets the tooltip for this node.
+     * @param {String} tip The text for the tip
+     * @param {String} title (Optional) The title for the tip
+     */
+    setTooltip : function(tip, title){
+        this.attributes.qtip = tip;
+        this.attributes.qtipTitle = title;
+        if(this.rendered){
+            this.ui.onTipChange(this, tip, title);
+        }
+    },
+    
+    /**
+     * Sets the icon for this node.
+     * @param {String} icon
+     */
+    setIcon : function(icon){
+        this.attributes.icon = icon;
+        if(this.rendered){
+            this.ui.onIconChange(this, icon);
+        }
+    },
+    
+    /**
+     * Sets the href for the node.
+     * @param {String} href The href to set
+     * @param {String} (Optional) target The target of the href
+     */
+    setHref : function(href, target){
+        this.attributes.href = href;
+        this.attributes.hrefTarget = target;
+        if(this.rendered){
+            this.ui.onHrefChange(this, href, target);
+        }
+    },
+    
+    /**
+     * Sets the class on this node.
+     * @param {String} cls
+     */
+    setCls : function(cls){
+        var old = this.attributes.cls;
+        this.attributes.cls = cls;
+        if(this.rendered){
+            this.ui.onClsChange(this, cls, old);
+        }
+    },
+
+    /**
+     * Triggers selection of this node
+     */
+    select : function(){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().select(this);
+        }
+    },
+
+    /**
+     * Triggers deselection of this node
+     * @param {Boolean} silent (optional) True to stop selection change events from firing.
+     */
+    unselect : function(silent){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().unselect(this, silent);
+        }
+    },
+
+    /**
+     * Returns true if this node is selected
+     * @return {Boolean}
+     */
+    isSelected : function(){
+        var t = this.getOwnerTree();
+        return t ? t.getSelectionModel().isSelected(this) : false;
+    },
+
+    /**
+     * Expand this node.
+     * @param {Boolean} deep (optional) True to expand all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    expand : function(deep, anim, callback, scope){
+        if(!this.expanded){
+            if(this.fireEvent('beforeexpand', this, deep, anim) === false){
+                return;
+            }
+            if(!this.childrenRendered){
+                this.renderChildren();
+            }
+            this.expanded = true;
+            if(!this.isHiddenRoot() && (this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animExpand(function(){
+                    this.fireEvent('expand', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.expandChildNodes(true, true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.expand();
+                this.fireEvent('expand', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else{
+           this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            this.expandChildNodes(true);
+        }
+    },
+
+    runCallback : function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isHiddenRoot : function(){
+        return this.isRoot && !this.getOwnerTree().rootVisible;
+    },
+
+    /**
+     * Collapse this node.
+     * @param {Boolean} deep (optional) True to collapse all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    collapse : function(deep, anim, callback, scope){
+        if(this.expanded && !this.isHiddenRoot()){
+            if(this.fireEvent('beforecollapse', this, deep, anim) === false){
+                return;
+            }
+            this.expanded = false;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animCollapse(function(){
+                    this.fireEvent('collapse', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.collapseChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.collapse();
+                this.fireEvent('collapse', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else if(!this.expanded){
+            this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].collapse(true, false);
+            }
+        }
+    },
+
+    // private
+    delayedExpand : function(delay){
+        if(!this.expandProcId){
+            this.expandProcId = this.expand.defer(delay, this);
+        }
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+        }
+        this.expandProcId = false;
+    },
+
+    /**
+     * Toggles expanded/collapsed state of the node
+     */
+    toggle : function(){
+        if(this.expanded){
+            this.collapse();
+        }else{
+            this.expand();
+        }
+    },
+
+    /**
+     * Ensures all parent nodes are expanded, and if necessary, scrolls
+     * the node into view.
+     * @param {Function} callback (optional) A function to call when the node has been made visible.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    ensureVisible : function(callback, scope){
+        var tree = this.getOwnerTree();
+        tree.expandPath(this.parentNode ? this.parentNode.getPath() : this.getPath(), false, function(){
+            var node = tree.getNodeById(this.id);  // Somehow if we don't do this, we lose changes that happened to node in the meantime
+            tree.getTreeEl().scrollChildIntoView(node.ui.anchor);
+            this.runCallback(callback, scope || this, [this]);
+        }.createDelegate(this));
+    },
+
+    /**
+     * Expand all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also expand their child nodes
+     */
+    expandChildNodes : function(deep, anim) {
+        var cs = this.childNodes,
+            i,
+            len = cs.length;
+        for (i = 0; i < len; i++) {
+        	cs[i].expand(deep, anim);
+        }
+    },
+
+    /**
+     * Collapse all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also collapse their child nodes
+     */
+    collapseChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].collapse(deep);
+        }
+    },
+
+    /**
+     * Disables this node
+     */
+    disable : function(){
+        this.disabled = true;
+        this.unselect();
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, true);
+        }
+        this.fireEvent('disabledchange', this, true);
+    },
+
+    /**
+     * Enables this node
+     */
+    enable : function(){
+        this.disabled = false;
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, false);
+        }
+        this.fireEvent('disabledchange', this, false);
+    },
+
+    // private
+    renderChildren : function(suppressEvent){
+        if(suppressEvent !== false){
+            this.fireEvent('beforechildrenrendered', this);
+        }
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].render(true);
+        }
+        this.childrenRendered = true;
+    },
+
+    // private
+    sort : function(fn, scope){
+        Ext.tree.TreeNode.superclass.sort.apply(this, arguments);
+        if(this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].render(true);
+            }
+        }
+    },
+
+    // private
+    render : function(bulkRender){
+        this.ui.render(bulkRender);
+        if(!this.rendered){
+            // make sure it is registered
+            this.getOwnerTree().registerNode(this);
+            this.rendered = true;
+            if(this.expanded){
+                this.expanded = false;
+                this.expand(false, false);
+            }
+        }
+    },
+
+    // private
+    renderIndent : function(deep, refresh){
+        if(refresh){
+            this.ui.childIndent = null;
+        }
+        this.ui.renderIndent();
+        if(deep === true && this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].renderIndent(true, refresh);
+            }
+        }
+    },
+
+    beginUpdate : function(){
+        this.childrenRendered = false;
+    },
+
+    endUpdate : function(){
+        if(this.expanded && this.rendered){
+            this.renderChildren();
+        }
+    },
+
+    //inherit docs
+    destroy : function(silent){
+        if(silent === true){
+            this.unselect(true);
+        }
+        Ext.tree.TreeNode.superclass.destroy.call(this, silent);
+        Ext.destroy(this.ui, this.loader);
+        this.ui = this.loader = null;
+    },
+
+    // private
+    onIdChange : function(id){
+        this.ui.onIdChange(id);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.node = Ext.tree.TreeNode;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEditor.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEditor.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEditor.js	(revision 76)
@@ -0,0 +1,177 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeEditor
+ * @extends Ext.Editor
+ * Provides editor functionality for inline tree node editing.  Any valid {@link Ext.form.Field} subclass can be used
+ * as the editor field.
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} fieldConfig (optional) Either a prebuilt {@link Ext.form.Field} instance or a Field config object
+ * that will be applied to the default field instance (defaults to a {@link Ext.form.TextField}).
+ * @param {Object} config (optional) A TreeEditor config object
+ */
+Ext.tree.TreeEditor = function(tree, fc, config){
+    fc = fc || {};
+    var field = fc.events ? fc : new Ext.form.TextField(fc);
+    
+    Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);
+
+    this.tree = tree;
+
+    if(!tree.rendered){
+        tree.on('render', this.initEditor, this);
+    }else{
+        this.initEditor(tree);
+    }
+};
+
+Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "l-l").
+     */
+    alignment: "l-l",
+    // inherit
+    autoSize: false,
+    /**
+     * @cfg {Boolean} hideEl
+     * True to hide the bound element while the editor is displayed (defaults to false)
+     */
+    hideEl : false,
+    /**
+     * @cfg {String} cls
+     * CSS class to apply to the editor (defaults to "x-small-editor x-tree-editor")
+     */
+    cls: "x-small-editor x-tree-editor",
+    /**
+     * @cfg {Boolean} shim
+     * True to shim the editor if selects/iframes could be displayed beneath it (defaults to false)
+     */
+    shim:false,
+    // inherit
+    shadow:"frame",
+    /**
+     * @cfg {Number} maxWidth
+     * The maximum width in pixels of the editor field (defaults to 250).  Note that if the maxWidth would exceed
+     * the containing tree element's size, it will be automatically limited for you to the container width, taking
+     * scroll and client offsets into account prior to each edit.
+     */
+    maxWidth: 250,
+    /**
+     * @cfg {Number} editDelay The number of milliseconds between clicks to register a double-click that will trigger
+     * editing on the current node (defaults to 350).  If two clicks occur on the same node within this time span,
+     * the editor for the node will display, otherwise it will be processed as a regular click.
+     */
+    editDelay : 350,
+
+    initEditor : function(tree){
+        tree.on({
+            scope      : this,
+            beforeclick: this.beforeNodeClick,
+            dblclick   : this.onNodeDblClick
+        });
+        
+        this.on({
+            scope          : this,
+            complete       : this.updateNode,
+            beforestartedit: this.fitToTree,
+            specialkey     : this.onSpecialKey
+        });
+        
+        this.on('startedit', this.bindScroll, this, {delay:10});
+    },
+
+    // private
+    fitToTree : function(ed, el){
+        var td = this.tree.getTreeEl().dom, nd = el.dom;
+        if(td.scrollLeft >  nd.offsetLeft){ // ensure the node left point is visible
+            td.scrollLeft = nd.offsetLeft;
+        }
+        var w = Math.min(
+                this.maxWidth,
+                (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - /*cushion*/5);
+        this.setSize(w, '');
+    },
+
+    /**
+     * Edit the text of the passed {@link Ext.tree.TreeNode TreeNode}.
+     * @param node {Ext.tree.TreeNode} The TreeNode to edit. The TreeNode must be {@link Ext.tree.TreeNode#editable editable}.
+     */
+    triggerEdit : function(node, defer){
+        this.completeEdit();
+		if(node.attributes.editable !== false){
+           /**
+            * The {@link Ext.tree.TreeNode TreeNode} this editor is bound to. Read-only.
+            * @type Ext.tree.TreeNode
+            * @property editNode
+            */
+			this.editNode = node;
+            if(this.tree.autoScroll){
+                Ext.fly(node.ui.getEl()).scrollIntoView(this.tree.body);
+            }
+            var value = node.text || '';
+            if (!Ext.isGecko && Ext.isEmpty(node.text)){
+                node.setText('&#160;');
+            }
+            this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, value]);
+            return false;
+        }
+    },
+
+    // private
+    bindScroll : function(){
+        this.tree.getTreeEl().on('scroll', this.cancelEdit, this);
+    },
+
+    // private
+    beforeNodeClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+        if(this.tree.getSelectionModel().isSelected(node)){
+            e.stopEvent();
+            return this.triggerEdit(node);
+        }
+    },
+
+    onNodeDblClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+    },
+
+    // private
+    updateNode : function(ed, value){
+        this.tree.getTreeEl().un('scroll', this.cancelEdit, this);
+        this.editNode.setText(value);
+    },
+
+    // private
+    onHide : function(){
+        Ext.tree.TreeEditor.superclass.onHide.call(this);
+        if(this.editNode){
+            this.editNode.ui.focus.defer(50, this.editNode.ui);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var k = e.getKey();
+        if(k == e.ESC){
+            e.stopEvent();
+            this.cancelEdit();
+        }else if(k == e.ENTER && !e.hasModifier()){
+            e.stopEvent();
+            this.completeEdit();
+        }
+    },
+    
+    onDestroy : function(){
+        clearTimeout(this.autoEditTimer);
+        Ext.tree.TreeEditor.superclass.onDestroy.call(this);
+        var tree = this.tree;
+        tree.un('beforeclick', this.beforeNodeClick, this);
+        tree.un('dblclick', this.onNodeDblClick, this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeLoader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeLoader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeLoader.js	(revision 76)
@@ -0,0 +1,357 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeLoader
+ * @extends Ext.util.Observable
+ * A TreeLoader provides for lazy loading of an {@link Ext.tree.TreeNode}'s child
+ * nodes from a specified URL. The response must be a JavaScript Array definition
+ * whose elements are node definition objects. e.g.:
+ * <pre><code>
+    [{
+        id: 1,
+        text: 'A leaf Node',
+        leaf: true
+    },{
+        id: 2,
+        text: 'A folder Node',
+        children: [{
+            id: 3,
+            text: 'A child Node',
+            leaf: true
+        }]
+   }]
+</code></pre>
+ * <br><br>
+ * A server request is sent, and child nodes are loaded only when a node is expanded.
+ * The loading node's id is passed to the server under the parameter name "node" to
+ * enable the server to produce the correct child nodes.
+ * <br><br>
+ * To pass extra parameters, an event handler may be attached to the "beforeload"
+ * event, and the parameters specified in the TreeLoader's baseParams property:
+ * <pre><code>
+    myTreeLoader.on("beforeload", function(treeLoader, node) {
+        this.baseParams.category = node.attributes.category;
+    }, this);
+</code></pre>
+ * This would pass an HTTP parameter called "category" to the server containing
+ * the value of the Node's "category" attribute.
+ * @constructor
+ * Creates a new Treeloader.
+ * @param {Object} config A config object containing config properties.
+ */
+Ext.tree.TreeLoader = function(config){
+    this.baseParams = {};
+    Ext.apply(this, config);
+
+    this.addEvents(
+        /**
+         * @event beforeload
+         * Fires before a network request is made to retrieve the Json text which specifies a node's children.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} callback The callback function specified in the {@link #load} call.
+         */
+        "beforeload",
+        /**
+         * @event load
+         * Fires when the node has been successfuly loaded.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "load",
+        /**
+         * @event loadexception
+         * Fires if the network request failed.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "loadexception"
+    );
+    Ext.tree.TreeLoader.superclass.constructor.call(this);
+    if(Ext.isString(this.paramOrder)){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+};
+
+Ext.extend(Ext.tree.TreeLoader, Ext.util.Observable, {
+    /**
+    * @cfg {String} dataUrl The URL from which to request a Json string which
+    * specifies an array of node definition objects representing the child nodes
+    * to be loaded.
+    */
+    /**
+     * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+     */
+    /**
+     * @cfg {String} url Equivalent to {@link #dataUrl}.
+     */
+    /**
+     * @cfg {Boolean} preloadChildren If set to true, the loader recursively loads "children" attributes when doing the first load on nodes.
+     */
+    /**
+    * @cfg {Object} baseParams (optional) An object containing properties which
+    * specify HTTP parameters to be passed to each request for child nodes.
+    */
+    /**
+    * @cfg {Object} baseAttrs (optional) An object containing attributes to be added to all nodes
+    * created by this loader. If the attributes sent by the server have an attribute in this object,
+    * they take priority.
+    */
+    /**
+    * @cfg {Object} uiProviders (optional) An object containing properties which
+    * specify custom {@link Ext.tree.TreeNodeUI} implementations. If the optional
+    * <i>uiProvider</i> attribute of a returned child node is a string rather
+    * than a reference to a TreeNodeUI implementation, then that string value
+    * is used as a property name in the uiProviders object.
+    */
+    uiProviders : {},
+
+    /**
+    * @cfg {Boolean} clearOnLoad (optional) Default to true. Remove previously existing
+    * child nodes before loading.
+    */
+    clearOnLoad : true,
+
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. Only used when using directFn.
+     * Specifies the params in the order in which they must be passed to the server-side Direct method
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+nodeParameter: 'node',
+paramOrder: ['param1','param2','param3']
+paramOrder: 'node param1 param2 param3'
+paramOrder: 'param1,node,param2,param3'
+paramOrder: 'param1|param2|param|node'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used when using directFn.
+     * Send parameters as a collection of named arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} nodeParameter The name of the parameter sent to the server which contains
+     * the identifier of the node. Defaults to <tt>'node'</tt>.
+     */
+    nodeParameter: 'node',
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.
+     */
+    directFn : undefined,
+
+    /**
+     * Load an {@link Ext.tree.TreeNode} from the URL specified in the constructor.
+     * This is called automatically when a node is expanded, but may be used to reload
+     * a node (or append new children if the {@link #clearOnLoad} option is false.)
+     * @param {Ext.tree.TreeNode} node
+     * @param {Function} callback Function to call after the node has been loaded. The
+     * function is passed the TreeNode which was requested to be loaded.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed.
+     * defaults to the loaded TreeNode.
+     */
+    load : function(node, callback, scope){
+        if(this.clearOnLoad){
+            while(node.firstChild){
+                node.removeChild(node.firstChild);
+            }
+        }
+        if(this.doPreload(node)){ // preloaded json children
+            this.runCallback(callback, scope || node, [node]);
+        }else if(this.directFn || this.dataUrl || this.url){
+            this.requestData(node, callback, scope || node);
+        }
+    },
+
+    doPreload : function(node){
+        if(node.attributes.children){
+            if(node.childNodes.length < 1){ // preloaded?
+                var cs = node.attributes.children;
+                node.beginUpdate();
+                for(var i = 0, len = cs.length; i < len; i++){
+                    var cn = node.appendChild(this.createNode(cs[i]));
+                    if(this.preloadChildren){
+                        this.doPreload(cn);
+                    }
+                }
+                node.endUpdate();
+            }
+            return true;
+        }
+        return false;
+    },
+
+    getParams: function(node){
+        var bp = Ext.apply({}, this.baseParams),
+            np = this.nodeParameter,
+            po = this.paramOrder;
+
+        np && (bp[ np ] = node.id);
+
+        if(this.directFn){
+            var buf = [node.id];
+            if(po){
+                // reset 'buf' if the nodeParameter was included in paramOrder
+                if(np && po.indexOf(np) > -1){
+                    buf = [];
+                }
+
+                for(var i = 0, len = po.length; i < len; i++){
+                    buf.push(bp[ po[i] ]);
+                }
+            }else if(this.paramsAsHash){
+                buf = [bp];
+            }
+            return buf;
+        }else{
+            return bp;
+        }
+    },
+
+    requestData : function(node, callback, scope){
+        if(this.fireEvent("beforeload", this, node, callback) !== false){
+            if(this.directFn){
+                var args = this.getParams(node);
+                args.push(this.processDirectResponse.createDelegate(this, [{callback: callback, node: node, scope: scope}], true));
+                this.directFn.apply(window, args);
+            }else{
+                this.transId = Ext.Ajax.request({
+                    method:this.requestMethod,
+                    url: this.dataUrl||this.url,
+                    success: this.handleResponse,
+                    failure: this.handleFailure,
+                    scope: this,
+                    argument: {callback: callback, node: node, scope: scope},
+                    params: this.getParams(node)
+                });
+            }
+        }else{
+            // if the load is cancelled, make sure we notify
+            // the node that we are done
+            this.runCallback(callback, scope || node, []);
+        }
+    },
+
+    processDirectResponse: function(result, response, args){
+        if(response.status){
+            this.handleResponse({
+                responseData: Ext.isArray(result) ? result : null,
+                responseText: result,
+                argument: args
+            });
+        }else{
+            this.handleFailure({
+                argument: args
+            });
+        }
+    },
+
+    // private
+    runCallback: function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isLoading : function(){
+        return !!this.transId;
+    },
+
+    abort : function(){
+        if(this.isLoading()){
+            Ext.Ajax.abort(this.transId);
+        }
+    },
+
+    /**
+    * <p>Override this function for custom TreeNode node implementation, or to
+    * modify the attributes at creation time.</p>
+    * Example:<pre><code>
+new Ext.tree.TreePanel({
+    ...
+    loader: new Ext.tree.TreeLoader({
+        url: 'dataUrl',
+        createNode: function(attr) {
+//          Allow consolidation consignments to have
+//          consignments dropped into them.
+            if (attr.isConsolidation) {
+                attr.iconCls = 'x-consol',
+                attr.allowDrop = true;
+            }
+            return Ext.tree.TreeLoader.prototype.createNode.call(this, attr);
+        }
+    }),
+    ...
+});
+</code></pre>
+    * @param attr {Object} The attributes from which to create the new node.
+    */
+    createNode : function(attr){
+        // apply baseAttrs, nice idea Corey!
+        if(this.baseAttrs){
+            Ext.applyIf(attr, this.baseAttrs);
+        }
+        if(this.applyLoader !== false && !attr.loader){
+            attr.loader = this;
+        }
+        if(Ext.isString(attr.uiProvider)){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        if(attr.nodeType){
+            return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+        }else{
+            return attr.leaf ?
+                        new Ext.tree.TreeNode(attr) :
+                        new Ext.tree.AsyncTreeNode(attr);
+        }
+    },
+
+    processResponse : function(response, node, callback, scope){
+        var json = response.responseText;
+        try {
+            var o = response.responseData || Ext.decode(json);
+            node.beginUpdate();
+            for(var i = 0, len = o.length; i < len; i++){
+                var n = this.createNode(o[i]);
+                if(n){
+                    node.appendChild(n);
+                }
+            }
+            node.endUpdate();
+            this.runCallback(callback, scope || node, [node]);
+        }catch(e){
+            this.handleFailure(response);
+        }
+    },
+
+    handleResponse : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.processResponse(response, a.node, a.callback, a.scope);
+        this.fireEvent("load", this, a.node, response);
+    },
+
+    handleFailure : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.fireEvent("loadexception", this, a.node, response);
+        this.runCallback(a.callback, a.scope || a.node, [a.node]);
+    },
+
+    destroy : function(){
+        this.abort();
+        this.purgeListeners();
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSelectionModel.js	(revision 76)
@@ -0,0 +1,325 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.DefaultSelectionModel
+ * @extends Ext.util.Observable
+ * The default single selection for a TreePanel.
+ */
+Ext.tree.DefaultSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNode = null;
+   
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected node changes
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             */
+            'selectionchange',
+
+            /**
+             * @event beforeselect
+             * Fires before the selected node changes, return false to cancel the change
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             * @param {TreeNode} node the old selection
+             */
+            'beforeselect'
+        );
+
+        Ext.apply(this, config);
+        Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node);
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, /* private*/ selectNextNode){
+        // If node is hidden, select the next node in whatever direction was being moved in.
+        if (!Ext.fly(node.ui.wrap).isVisible() && selectNextNode) {
+            return selectNextNode.call(this, node);
+        }
+        var last = this.selNode;
+        if(node == last){
+            node.ui.onSelectedChange(true);
+        }else if(this.fireEvent('beforeselect', this, node, last) !== false){
+            if(last && last.ui){
+                last.ui.onSelectedChange(false);
+            }
+            this.selNode = node;
+            node.ui.onSelectedChange(true);
+            this.fireEvent('selectionchange', this, node, last);
+        }
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    unselect : function(node, silent){
+        if(this.selNode == node){
+            this.clearSelections(silent);
+        }    
+    },
+    
+    /**
+     * Clear all selections
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    clearSelections : function(silent){
+        var n = this.selNode;
+        if(n){
+            n.ui.onSelectedChange(false);
+            this.selNode = null;
+            if(silent !== true){
+                this.fireEvent('selectionchange', this, null);
+            }
+        }
+        return n;
+    },
+    
+    /**
+     * Get the selected node
+     * @return {TreeNode} The selected node
+     */
+    getSelectedNode : function(){
+        return this.selNode;    
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selNode == node;  
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectPrevious : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        var ps = s.previousSibling;
+        if(ps){
+            if(!ps.isExpanded() || ps.childNodes.length < 1){
+                return this.select(ps, this.selectPrevious);
+            } else{
+                var lc = ps.lastChild;
+                while(lc && lc.isExpanded() && Ext.fly(lc.ui.wrap).isVisible() && lc.childNodes.length > 0){
+                    lc = lc.lastChild;
+                }
+                return this.select(lc, this.selectPrevious);
+            }
+        } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
+            return this.select(s.parentNode, this.selectPrevious);
+        }
+        return null;
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectNext : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        if(s.firstChild && s.isExpanded() && Ext.fly(s.ui.wrap).isVisible()){
+             return this.select(s.firstChild, this.selectNext);
+         }else if(s.nextSibling){
+             return this.select(s.nextSibling, this.selectNext);
+         }else if(s.parentNode){
+            var newS = null;
+            s.parentNode.bubble(function(){
+                if(this.nextSibling){
+                    newS = this.getOwnerTree().selModel.select(this.nextSibling, this.selectNext);
+                    return false;
+                }
+            });
+            return newS;
+         }
+        return null;
+    },
+
+    onKeyDown : function(e){
+        var s = this.selNode || this.lastSelNode;
+        // undesirable, but required
+        var sm = this;
+        if(!s){
+            return;
+        }
+        var k = e.getKey();
+        switch(k){
+             case e.DOWN:
+                 e.stopEvent();
+                 this.selectNext();
+             break;
+             case e.UP:
+                 e.stopEvent();
+                 this.selectPrevious();
+             break;
+             case e.RIGHT:
+                 e.preventDefault();
+                 if(s.hasChildNodes()){
+                     if(!s.isExpanded()){
+                         s.expand();
+                     }else if(s.firstChild){
+                         this.select(s.firstChild, e);
+                     }
+                 }
+             break;
+             case e.LEFT:
+                 e.preventDefault();
+                 if(s.hasChildNodes() && s.isExpanded()){
+                     s.collapse();
+                 }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+        };
+    }
+});
+
+/**
+ * @class Ext.tree.MultiSelectionModel
+ * @extends Ext.util.Observable
+ * Multi selection for a TreePanel.
+ */
+Ext.tree.MultiSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNodes = [];
+        this.selMap = {};
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change
+             * @param {MultiSelectionModel} this
+             * @param {Array} nodes Array of the selected nodes
+             */
+            'selectionchange'
+        );
+        Ext.apply(this, config);
+        Ext.tree.MultiSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        if(e.ctrlKey && this.isSelected(node)){
+            this.unselect(node);
+        }else{
+            this.select(node, e, e.ctrlKey);
+        }
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @param {EventObject} e (optional) An event associated with the selection
+     * @param {Boolean} keepExisting True to retain existing selections
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, e, keepExisting){
+        if(keepExisting !== true){
+            this.clearSelections(true);
+        }
+        if(this.isSelected(node)){
+            this.lastSelNode = node;
+            return node;
+        }
+        this.selNodes.push(node);
+        this.selMap[node.id] = node;
+        this.lastSelNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, this.selNodes);
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     */
+    unselect : function(node){
+        if(this.selMap[node.id]){
+            node.ui.onSelectedChange(false);
+            var sn = this.selNodes;
+            var index = sn.indexOf(node);
+            if(index != -1){
+                this.selNodes.splice(index, 1);
+            }
+            delete this.selMap[node.id];
+            this.fireEvent('selectionchange', this, this.selNodes);
+        }
+    },
+    
+    /**
+     * Clear all selections
+     */
+    clearSelections : function(suppressEvent){
+        var sn = this.selNodes;
+        if(sn.length > 0){
+            for(var i = 0, len = sn.length; i < len; i++){
+                sn[i].ui.onSelectedChange(false);
+            }
+            this.selNodes = [];
+            this.selMap = {};
+            if(suppressEvent !== true){
+                this.fireEvent('selectionchange', this, this.selNodes);
+            }
+        }
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selMap[node.id] ? true : false;  
+    },
+    
+    /**
+     * Returns an array of the selected nodes
+     * @return {Array}
+     */
+    getSelectedNodes : function(){
+        return this.selNodes.concat([]);
+    },
+
+    onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,
+
+    selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,
+
+    selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDragZone.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDragZone.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDragZone.js	(revision 76)
@@ -0,0 +1,82 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeDragZone
+ * @extends Ext.dd.DragZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dragging
+ * @param {Object} config
+ */
+if(Ext.dd.DragZone){
+Ext.tree.TreeDragZone = function(tree, config){
+    Ext.tree.TreeDragZone.superclass.constructor.call(this, tree.innerCt, config);
+    /**
+    * The TreePanel for this drag zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+};
+
+Ext.extend(Ext.tree.TreeDragZone, Ext.dd.DragZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    // private
+    onBeforeDrag : function(data, e){
+        var n = data.node;
+        return n && n.draggable && !n.disabled;
+    },
+
+    // private
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.tree.getSelectionModel().select(data.node);
+        this.tree.eventModel.disable();
+        this.proxy.update("");
+        data.node.ui.appendDDGhost(this.proxy.ghost.dom);
+        this.tree.fireEvent("startdrag", this.tree, data.node, e);
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return data.node.ui.getDDRepairXY();
+    },
+
+    // private
+    onEndDrag : function(data, e){
+        this.tree.eventModel.enable.defer(100, this.tree.eventModel);
+        this.tree.fireEvent("enddrag", this.tree, data.node, e);
+    },
+
+    // private
+    onValidDrop : function(dd, e, id){
+        this.tree.fireEvent("dragdrop", this.tree, this.dragData.node, dd, e);
+        this.hideProxy();
+    },
+
+    // private
+    beforeInvalidDrop : function(e, id){
+        // this scrolls the original position back into view
+        var sm = this.tree.getSelectionModel();
+        sm.clearSelections();
+        sm.select(this.dragData.node);
+    },
+    
+    // private
+    afterRepair : function(){
+        if (Ext.enableFx && this.tree.hlDrop) {
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    }
+});
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSorter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSorter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeSorter.js	(revision 76)
@@ -0,0 +1,114 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeSorter
+ * Provides sorting of nodes in a {@link Ext.tree.TreePanel}.  The TreeSorter automatically monitors events on the
+ * associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
+ * Example usage:<br />
+ * <pre><code>
+new Ext.tree.TreeSorter(myTree, {
+    folderSort: true,
+    dir: "desc",
+    sortType: function(node) {
+        // sort by a custom, typed attribute:
+        return parseInt(node.id, 10);
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} config
+ */
+Ext.tree.TreeSorter = Ext.extend(Object, {
+    
+    constructor: function(tree, config){
+        /**
+     * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
+     */
+    /**
+     * @cfg {String} property The named attribute on the node to sort by (defaults to "text").  Note that this
+     * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
+     */
+    /**
+     * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
+     */
+    /**
+     * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
+     */
+    /**
+     * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
+     */
+    /**
+     * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting.  The function
+     * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
+     * the node's sort value cast to the specific data type required for sorting.  This could be used, for example, when
+     * a node's text (or other attribute) should be sorted as a date or numeric value.  See the class description for
+     * example usage.  Note that if a sortType is specified, any {@link #property} config will be ignored.
+     */
+
+    Ext.apply(this, config);
+    tree.on({
+        scope: this,
+        beforechildrenrendered: this.doSort,
+        append: this.updateSort,
+        insert: this.updateSort,
+        textchange: this.updateSortParent
+    });
+
+    var desc = this.dir && this.dir.toLowerCase() == 'desc',
+        prop = this.property || 'text',
+        sortType = this.sortType,
+        folderSort = this.folderSort,
+        caseSensitive = this.caseSensitive === true,
+        leafAttr = this.leafAttr || 'leaf';
+
+    if(Ext.isString(sortType)){
+        sortType = Ext.data.SortTypes[sortType];
+    }
+    this.sortFn = function(n1, n2){
+        var attr1 = n1.attributes,
+            attr2 = n2.attributes;
+            
+        if(folderSort){
+            if(attr1[leafAttr] && !attr2[leafAttr]){
+                return 1;
+            }
+            if(!attr1[leafAttr] && attr2[leafAttr]){
+                return -1;
+            }
+        }
+        var prop1 = attr1[prop],
+            prop2 = attr2[prop],
+            v1 = sortType ? sortType(prop1) : (caseSensitive ? prop1 : prop1.toUpperCase()),
+            v2 = sortType ? sortType(prop2) : (caseSensitive ? prop2 : prop2.toUpperCase());
+            
+        if(v1 < v2){
+            return desc ? 1 : -1;
+        }else if(v1 > v2){
+            return desc ? -1 : 1;
+        }
+        return 0;
+    };
+    },
+    
+    doSort : function(node){
+        node.sort(this.sortFn);
+    },
+
+    updateSort : function(tree, node){
+        if(node.childrenRendered){
+            this.doSort.defer(1, this, [node]);
+        }
+    },
+
+    updateSortParent : function(node){
+        var p = node.parentNode;
+        if(p && p.childrenRendered){
+            this.doSort.defer(1, this, [p]);
+        }
+    }    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreePanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreePanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreePanel.js	(revision 76)
@@ -0,0 +1,981 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreePanel
+ * @extends Ext.Panel
+ * <p>The TreePanel provides tree-structured UI representation of tree-structured data.</p>
+ * <p>{@link Ext.tree.TreeNode TreeNode}s added to the TreePanel may each contain metadata
+ * used by your application in their {@link Ext.tree.TreeNode#attributes attributes} property.</p>
+ * <p><b>A TreePanel must have a {@link #root} node before it is rendered.</b> This may either be
+ * specified using the {@link #root} config option, or using the {@link #setRootNode} method.
+ * <p>An example of tree rendered to an existing div:</p><pre><code>
+var tree = new Ext.tree.TreePanel({
+    renderTo: 'tree-div',
+    useArrows: true,
+    autoScroll: true,
+    animate: true,
+    enableDD: true,
+    containerScroll: true,
+    border: false,
+    // auto create TreeLoader
+    dataUrl: 'get-nodes.php',
+
+    root: {
+        nodeType: 'async',
+        text: 'Ext JS',
+        draggable: false,
+        id: 'source'
+    }
+});
+
+tree.getRootNode().expand();
+ * </code></pre>
+ * <p>The example above would work with a data packet similar to this:</p><pre><code>
+[{
+    "text": "adapter",
+    "id": "source\/adapter",
+    "cls": "folder"
+}, {
+    "text": "dd",
+    "id": "source\/dd",
+    "cls": "folder"
+}, {
+    "text": "debug.js",
+    "id": "source\/debug.js",
+    "leaf": true,
+    "cls": "file"
+}]
+ * </code></pre>
+ * <p>An example of tree within a Viewport:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        xtype: 'treepanel',
+        width: 200,
+        autoScroll: true,
+        split: true,
+        loader: new Ext.tree.TreeLoader(),
+        root: new Ext.tree.AsyncTreeNode({
+            expanded: true,
+            children: [{
+                text: 'Menu Option 1',
+                leaf: true
+            }, {
+                text: 'Menu Option 2',
+                leaf: true
+            }, {
+                text: 'Menu Option 3',
+                leaf: true
+            }]
+        }),
+        rootVisible: false,
+        listeners: {
+            click: function(n) {
+                Ext.Msg.alert('Navigation Tree Click', 'You clicked: "' + n.attributes.text + '"');
+            }
+        }
+    }, {
+        region: 'center',
+        xtype: 'tabpanel',
+        // remaining code not shown ...
+    }]
+});
+</code></pre>
+ *
+ * @cfg {Ext.tree.TreeNode} root The root node for the tree.
+ * @cfg {Boolean} rootVisible <tt>false</tt> to hide the root node (defaults to <tt>true</tt>)
+ * @cfg {Boolean} lines <tt>false</tt> to disable tree lines (defaults to <tt>true</tt>)
+ * @cfg {Boolean} enableDD <tt>true</tt> to enable drag and drop
+ * @cfg {Boolean} enableDrag <tt>true</tt> to enable just drag
+ * @cfg {Boolean} enableDrop <tt>true</tt> to enable just drop
+ * @cfg {Object} dragConfig Custom config to pass to the {@link Ext.tree.TreeDragZone} instance
+ * @cfg {Object} dropConfig Custom config to pass to the {@link Ext.tree.TreeDropZone} instance
+ * @cfg {String} ddGroup The DD group this TreePanel belongs to
+ * @cfg {Boolean} ddAppendOnly <tt>true</tt> if the tree should only allow append drops (use for trees which are sorted)
+ * @cfg {Boolean} ddScroll <tt>true</tt> to enable body scrolling
+ * @cfg {Boolean} containerScroll <tt>true</tt> to register this container with ScrollManager
+ * @cfg {Boolean} hlDrop <tt>false</tt> to disable node highlight on drop (defaults to the value of {@link Ext#enableFx})
+ * @cfg {String} hlColor The color of the node highlight (defaults to <tt>'C3DAF9'</tt>)
+ * @cfg {Boolean} animate <tt>true</tt> to enable animated expand/collapse (defaults to the value of {@link Ext#enableFx})
+ * @cfg {Boolean} singleExpand <tt>true</tt> if only 1 node per branch may be expanded
+ * @cfg {Object} selModel A tree selection model to use with this TreePanel (defaults to an {@link Ext.tree.DefaultSelectionModel})
+ * @cfg {Boolean} trackMouseOver <tt>false</tt> to disable mouse over highlighting
+ * @cfg {Ext.tree.TreeLoader} loader A {@link Ext.tree.TreeLoader} for use with this TreePanel
+ * @cfg {String} pathSeparator The token used to separate sub-paths in path strings (defaults to <tt>'/'</tt>)
+ * @cfg {Boolean} useArrows <tt>true</tt> to use Vista-style arrows in the tree (defaults to <tt>false</tt>)
+ * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+ *
+ * @constructor
+ * @param {Object} config
+ * @xtype treepanel
+ */
+Ext.tree.TreePanel = Ext.extend(Ext.Panel, {
+    rootVisible : true,
+    animate : Ext.enableFx,
+    lines : true,
+    enableDD : false,
+    hlDrop : Ext.enableFx,
+    pathSeparator : '/',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents : [],
+
+    initComponent : function(){
+        Ext.tree.TreePanel.superclass.initComponent.call(this);
+
+        if(!this.eventModel){
+            this.eventModel = new Ext.tree.TreeEventModel(this);
+        }
+
+        // initialize the loader
+        var l = this.loader;
+        if(!l){
+            l = new Ext.tree.TreeLoader({
+                dataUrl: this.dataUrl,
+                requestMethod: this.requestMethod
+            });
+        }else if(Ext.isObject(l) && !l.load){
+            l = new Ext.tree.TreeLoader(l);
+        }
+        this.loader = l;
+
+        this.nodeHash = {};
+
+        /**
+        * The root node of this tree.
+        * @type Ext.tree.TreeNode
+        * @property root
+        */
+        if(this.root){
+            var r = this.root;
+            delete this.root;
+            this.setRootNode(r);
+        }
+
+
+        this.addEvents(
+
+            /**
+            * @event append
+            * Fires when a new child node is appended to a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The newly appended node
+            * @param {Number} index The index of the newly appended node
+            */
+           'append',
+           /**
+            * @event remove
+            * Fires when a child node is removed from a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node removed
+            */
+           'remove',
+           /**
+            * @event movenode
+            * Fires when a node is moved to a new location in the tree
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node moved
+            * @param {Node} oldParent The old parent of this node
+            * @param {Node} newParent The new parent of this node
+            * @param {Number} index The index it was moved to
+            */
+           'movenode',
+           /**
+            * @event insert
+            * Fires when a new child node is inserted in a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node inserted
+            * @param {Node} refNode The child node the node was inserted before
+            */
+           'insert',
+           /**
+            * @event beforeappend
+            * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be appended
+            */
+           'beforeappend',
+           /**
+            * @event beforeremove
+            * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be removed
+            */
+           'beforeremove',
+           /**
+            * @event beforemovenode
+            * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node being moved
+            * @param {Node} oldParent The parent of the node
+            * @param {Node} newParent The new parent the node is moving to
+            * @param {Number} index The index it is being moved to
+            */
+           'beforemovenode',
+           /**
+            * @event beforeinsert
+            * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be inserted
+            * @param {Node} refNode The child node the node is being inserted before
+            */
+            'beforeinsert',
+
+            /**
+            * @event beforeload
+            * Fires before a node is loaded, return false to cancel
+            * @param {Node} node The node being loaded
+            */
+            'beforeload',
+            /**
+            * @event load
+            * Fires when a node is loaded
+            * @param {Node} node The node that was loaded
+            */
+            'load',
+            /**
+            * @event textchange
+            * Fires when the text for a node is changed
+            * @param {Node} node The node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpandnode
+            * Fires before a node is expanded, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpandnode',
+            /**
+            * @event beforecollapsenode
+            * Fires before a node is collapsed, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapsenode',
+            /**
+            * @event expandnode
+            * Fires when a node is expanded
+            * @param {Node} node The node
+            */
+            'expandnode',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of a node changes
+            * @param {Node} node The node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapsenode
+            * Fires when a node is collapsed
+            * @param {Node} node The node
+            */
+            'collapsenode',
+            /**
+            * @event beforeclick
+            * Fires before click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when a node is clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event containerclick
+            * Fires when the tree container is clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerclick',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when a node is double clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event containerdblclick
+            * Fires when the tree container is double clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerdblclick',
+            /**
+            * @event contextmenu
+            * Fires when a node is right clicked. To display a context menu in response to this
+            * event, first create a Menu object (see {@link Ext.menu.Menu} for details), then add
+            * a handler for this event:<pre><code>
+new Ext.tree.TreePanel({
+    title: 'My TreePanel',
+    root: new Ext.tree.AsyncTreeNode({
+        text: 'The Root',
+        children: [
+            { text: 'Child node 1', leaf: true },
+            { text: 'Child node 2', leaf: true }
+        ]
+    }),
+    contextMenu: new Ext.menu.Menu({
+        items: [{
+            id: 'delete-node',
+            text: 'Delete Node'
+        }],
+        listeners: {
+            itemclick: function(item) {
+                switch (item.id) {
+                    case 'delete-node':
+                        var n = item.parentMenu.contextNode;
+                        if (n.parentNode) {
+                            n.remove();
+                        }
+                        break;
+                }
+            }
+        }
+    }),
+    listeners: {
+        contextmenu: function(node, e) {
+//          Register the context node with the menu so that a Menu Item's handler function can access
+//          it via its {@link Ext.menu.BaseItem#parentMenu parentMenu} property.
+            node.select();
+            var c = node.getOwnerTree().contextMenu;
+            c.contextNode = node;
+            c.showAt(e.getXY());
+        }
+    }
+});
+</code></pre>
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event containercontextmenu
+            * Fires when the tree container is right clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containercontextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for a node are rendered
+            * @param {Node} node The node
+            */
+            'beforechildrenrendered',
+           /**
+             * @event startdrag
+             * Fires when a node starts being dragged
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'startdrag',
+            /**
+             * @event enddrag
+             * Fires when a drag operation is complete
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'enddrag',
+            /**
+             * @event dragdrop
+             * Fires when a dragged node is dropped on a valid DD target
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {DD} dd The dd it was dropped on
+             * @param {event} e The raw browser event
+             */
+            'dragdrop',
+            /**
+             * @event beforenodedrop
+             * Fires when a DD object is dropped on a node in this tree for preprocessing. Return false to cancel the drop. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source <b>OR</b> you can supply node(s)
+             * to be inserted by setting them on this object.</li>
+             * <li>cancel - Set this to true to cancel the drop.</li>
+             * <li>dropStatus - If the default drop action is cancelled but the drop is valid, setting this to true
+             * will prevent the animated 'repair' from appearing.</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'beforenodedrop',
+            /**
+             * @event nodedrop
+             * Fires after a DD object is dropped on a node in this tree. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Dropped node(s).</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'nodedrop',
+             /**
+             * @event nodedragover
+             * Fires when a tree node is being targeted for a drag drop, return false to signal drop not allowed. The dragOverEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source.</li>
+             * <li>cancel - Set this to true to signal drop not allowed.</li>
+             * </ul>
+             * @param {Object} dragOverEvent
+             */
+            'nodedragover'
+        );
+        if(this.singleExpand){
+            this.on('beforeexpandnode', this.restrictExpand, this);
+        }
+    },
+
+    // private
+    proxyNodeEvent : function(ename, a1, a2, a3, a4, a5, a6){
+        if(ename == 'collapse' || ename == 'expand' || ename == 'beforecollapse' || ename == 'beforeexpand' || ename == 'move' || ename == 'beforemove'){
+            ename = ename+'node';
+        }
+        // args inline for performance while bubbling events
+        return this.fireEvent(ename, a1, a2, a3, a4, a5, a6);
+    },
+
+
+    /**
+     * Returns this root node for this tree
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree. If the TreePanel has already rendered a root node, the
+     * previous root node (and all of its descendants) are destroyed before the new root node is rendered.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.destroyRoot();
+        if(!node.render){ // attributes passed
+            node = this.loader.createNode(node);
+        }
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        if(!this.rootVisible){
+            var uiP = node.attributes.uiProvider;
+            node.ui = uiP ? new uiP(node) : new Ext.tree.RootTreeNodeUI(node);
+        }
+        if(this.innerCt){
+            this.clearInnerCt();
+            this.renderRoot();
+        }
+        return node;
+    },
+    
+    clearInnerCt : function(){
+        this.innerCt.update('');    
+    },
+    
+    // private
+    renderRoot : function(){
+        this.root.render();
+        if(!this.rootVisible){
+            this.root.renderChildren();
+        }
+    },
+
+    /**
+     * Gets a node in this tree by its id
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    // private
+    toString : function(){
+        return '[Tree'+(this.id?' '+this.id:'')+']';
+    },
+
+    // private
+    restrictExpand : function(node){
+        var p = node.parentNode;
+        if(p){
+            if(p.expandedChild && p.expandedChild.parentNode == p){
+                p.expandedChild.collapse();
+            }
+            p.expandedChild = node;
+        }
+    },
+
+    /**
+     * Retrieve an array of checked nodes, or an array of a specific attribute of checked nodes (e.g. 'id')
+     * @param {String} attribute (optional) Defaults to null (return the actual nodes)
+     * @param {TreeNode} startNode (optional) The node to start from, defaults to the root
+     * @return {Array}
+     */
+    getChecked : function(a, startNode){
+        startNode = startNode || this.root;
+        var r = [];
+        var f = function(){
+            if(this.attributes.checked){
+                r.push(!a ? this : (a == 'id' ? this.id : this.attributes[a]));
+            }
+        };
+        startNode.cascade(f);
+        return r;
+    },
+
+    /**
+     * Returns the default {@link Ext.tree.TreeLoader} for this TreePanel.
+     * @return {Ext.tree.TreeLoader} The TreeLoader for this TreePanel.
+     */
+    getLoader : function(){
+        return this.loader;
+    },
+
+    /**
+     * Expand all nodes
+     */
+    expandAll : function(){
+        this.root.expand(true);
+    },
+
+    /**
+     * Collapse all nodes
+     */
+    collapseAll : function(){
+        this.root.collapse(true);
+    },
+
+    /**
+     * Returns the selection model used by this TreePanel.
+     * @return {TreeSelectionModel} The selection model used by this TreePanel
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.tree.DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Expands a specified path in this TreePanel. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the expand is complete. The callback will be called with
+     * (bSuccess, oLastNode) where bSuccess is if the expand was successful and oLastNode is the last node that was expanded.
+     */
+    expandPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var curNode = this.root;
+        if(curNode.attributes[attr] != keys[1]){ // invalid root
+            if(callback){
+                callback(false, null);
+            }
+            return;
+        }
+        var index = 1;
+        var f = function(){
+            if(++index == keys.length){
+                if(callback){
+                    callback(true, curNode);
+                }
+                return;
+            }
+            var c = curNode.findChild(attr, keys[index]);
+            if(!c){
+                if(callback){
+                    callback(false, curNode);
+                }
+                return;
+            }
+            curNode = c;
+            c.expand(false, false, f);
+        };
+        curNode.expand(false, false, f);
+    },
+
+    /**
+     * Selects the node in this tree at the specified path. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the selection is complete. The callback will be called with
+     * (bSuccess, oSelNode) where bSuccess is if the selection was successful and oSelNode is the selected node.
+     */
+    selectPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator),
+            v = keys.pop();
+        if(keys.length > 1){
+            var f = function(success, node){
+                if(success && node){
+                    var n = node.findChild(attr, v);
+                    if(n){
+                        n.select();
+                        if(callback){
+                            callback(true, n);
+                        }
+                    }else if(callback){
+                        callback(false, n);
+                    }
+                }else{
+                    if(callback){
+                        callback(false, n);
+                    }
+                }
+            };
+            this.expandPath(keys.join(this.pathSeparator), attr, f);
+        }else{
+            this.root.select();
+            if(callback){
+                callback(true, this.root);
+            }
+        }
+    },
+
+    /**
+     * Returns the underlying Element for this tree
+     * @return {Ext.Element} The Element
+     */
+    getTreeEl : function(){
+        return this.body;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.tree.TreePanel.superclass.onRender.call(this, ct, position);
+        this.el.addClass('x-tree');
+        this.innerCt = this.body.createChild({tag:'ul',
+               cls:'x-tree-root-ct ' +
+               (this.useArrows ? 'x-tree-arrows' : this.lines ? 'x-tree-lines' : 'x-tree-no-lines')});
+    },
+
+    // private
+    initEvents : function(){
+        Ext.tree.TreePanel.superclass.initEvents.call(this);
+
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.body);
+        }
+        if((this.enableDD || this.enableDrop) && !this.dropZone){
+           /**
+            * The dropZone used by this tree if drop is enabled (see {@link #enableDD} or {@link #enableDrop})
+            * @property dropZone
+            * @type Ext.tree.TreeDropZone
+            */
+             this.dropZone = new Ext.tree.TreeDropZone(this, this.dropConfig || {
+               ddGroup: this.ddGroup || 'TreeDD', appendOnly: this.ddAppendOnly === true
+           });
+        }
+        if((this.enableDD || this.enableDrag) && !this.dragZone){
+           /**
+            * The dragZone used by this tree if drag is enabled (see {@link #enableDD} or {@link #enableDrag})
+            * @property dragZone
+            * @type Ext.tree.TreeDragZone
+            */
+            this.dragZone = new Ext.tree.TreeDragZone(this, this.dragConfig || {
+               ddGroup: this.ddGroup || 'TreeDD',
+               scroll: this.ddScroll
+           });
+        }
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.tree.TreePanel.superclass.afterRender.call(this);
+        this.renderRoot();
+    },
+
+    beforeDestroy : function(){
+        if(this.rendered){
+            Ext.dd.ScrollManager.unregister(this.body);
+            Ext.destroy(this.dropZone, this.dragZone);
+        }
+        this.destroyRoot();
+        Ext.destroy(this.loader);
+        this.nodeHash = this.root = this.loader = null;
+        Ext.tree.TreePanel.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * Destroy the root node. Not included by itself because we need to pass the silent parameter.
+     * @private
+     */
+    destroyRoot : function(){
+        if(this.root && this.root.destroy){
+            this.root.destroy(true);
+        }
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @method removeAll
+     * @hide
+     */
+    /**
+     * @event afterLayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+
+Ext.tree.TreePanel.nodeTypes = {};
+
+Ext.reg('treepanel', Ext.tree.TreePanel);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDropZone.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDropZone.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeDropZone.js	(revision 76)
@@ -0,0 +1,321 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeDropZone
+ * @extends Ext.dd.DropZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dropping
+ * @param {Object} config
+ */
+if(Ext.dd.DropZone){
+    
+Ext.tree.TreeDropZone = function(tree, config){
+    /**
+     * @cfg {Boolean} allowParentInsert
+     * Allow inserting a dragged node between an expanded parent node and its first child that will become a
+     * sibling of the parent when dropped (defaults to false)
+     */
+    this.allowParentInsert = config.allowParentInsert || false;
+    /**
+     * @cfg {String} allowContainerDrop
+     * True if drops on the tree container (outside of a specific tree node) are allowed (defaults to false)
+     */
+    this.allowContainerDrop = config.allowContainerDrop || false;
+    /**
+     * @cfg {String} appendOnly
+     * True if the tree should only allow append drops (use for trees which are sorted, defaults to false)
+     */
+    this.appendOnly = config.appendOnly || false;
+
+    Ext.tree.TreeDropZone.superclass.constructor.call(this, tree.getTreeEl(), config);
+    /**
+    * The TreePanel for this drop zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+    /**
+    * Arbitrary data that can be associated with this tree and will be included in the event object that gets
+    * passed to any nodedragover event handler (defaults to {})
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.dragOverData = {};
+    // private
+    this.lastInsertClass = "x-tree-no-status";
+};
+
+Ext.extend(Ext.tree.TreeDropZone, Ext.dd.DropZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    /**
+     * @cfg {String} expandDelay
+     * The delay in milliseconds to wait before expanding a target tree node while dragging a droppable node
+     * over the target (defaults to 1000)
+     */
+    expandDelay : 1000,
+
+    // private
+    expandNode : function(node){
+        if(node.hasChildNodes() && !node.isExpanded()){
+            node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));
+        }
+    },
+
+    // private
+    queueExpand : function(node){
+        this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+            this.expandProcId = false;
+        }
+    },
+
+    // private
+    isValidDropPoint : function(n, pt, dd, e, data){
+        if(!n || !data){ return false; }
+        var targetNode = n.node;
+        var dropNode = data.node;
+        // default drop rules
+        if(!(targetNode && targetNode.isTarget && pt)){
+            return false;
+        }
+        if(pt == "append" && targetNode.allowChildren === false){
+            return false;
+        }
+        if((pt == "above" || pt == "below") && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){
+            return false;
+        }
+        if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){
+            return false;
+        }
+        // reuse the object
+        var overEvent = this.dragOverData;
+        overEvent.tree = this.tree;
+        overEvent.target = targetNode;
+        overEvent.data = data;
+        overEvent.point = pt;
+        overEvent.source = dd;
+        overEvent.rawEvent = e;
+        overEvent.dropNode = dropNode;
+        overEvent.cancel = false;  
+        var result = this.tree.fireEvent("nodedragover", overEvent);
+        return overEvent.cancel === false && result !== false;
+    },
+
+    // private
+    getDropPoint : function(e, n, dd){
+        var tn = n.node;
+        if(tn.isRoot){
+            return tn.allowChildren !== false ? "append" : false; // always append for root
+        }
+        var dragEl = n.ddel;
+        var t = Ext.lib.Dom.getY(dragEl), b = t + dragEl.offsetHeight;
+        var y = Ext.lib.Event.getPageY(e);
+        var noAppend = tn.allowChildren === false || tn.isLeaf();
+        if(this.appendOnly || tn.parentNode.allowChildren === false){
+            return noAppend ? false : "append";
+        }
+        var noBelow = false;
+        if(!this.allowParentInsert){
+            noBelow = tn.hasChildNodes() && tn.isExpanded();
+        }
+        var q = (b - t) / (noAppend ? 2 : 3);
+        if(y >= t && y < (t + q)){
+            return "above";
+        }else if(!noBelow && (noAppend || y >= b-q && y <= b)){
+            return "below";
+        }else{
+            return "append";
+        }
+    },
+
+    // private
+    onNodeEnter : function(n, dd, e, data){
+        this.cancelExpand();
+    },
+    
+    onContainerOver : function(dd, e, data) {
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            return this.dropAllowed;
+        }
+        return this.dropNotAllowed;
+    },
+
+    // private
+    onNodeOver : function(n, dd, e, data){
+        var pt = this.getDropPoint(e, n, dd);
+        var node = n.node;
+        
+        // auto node expand check
+        if(!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()){
+            this.queueExpand(node);
+        }else if(pt != "append"){
+            this.cancelExpand();
+        }
+        
+        // set the insert point style on the target node
+        var returnCls = this.dropNotAllowed;
+        if(this.isValidDropPoint(n, pt, dd, e, data)){
+           if(pt){
+               var el = n.ddel;
+               var cls;
+               if(pt == "above"){
+                   returnCls = n.node.isFirst() ? "x-tree-drop-ok-above" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-above";
+               }else if(pt == "below"){
+                   returnCls = n.node.isLast() ? "x-tree-drop-ok-below" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-below";
+               }else{
+                   returnCls = "x-tree-drop-ok-append";
+                   cls = "x-tree-drag-append";
+               }
+               if(this.lastInsertClass != cls){
+                   Ext.fly(el).replaceClass(this.lastInsertClass, cls);
+                   this.lastInsertClass = cls;
+               }
+           }
+       }
+       return returnCls;
+    },
+
+    // private
+    onNodeOut : function(n, dd, e, data){
+        this.cancelExpand();
+        this.removeDropIndicators(n);
+    },
+
+    // private
+    onNodeDrop : function(n, dd, e, data){
+        var point = this.getDropPoint(e, n, dd);
+        var targetNode = n.node;
+        targetNode.ui.startDrop();
+        if(!this.isValidDropPoint(n, point, dd, e, data)){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        // first try to find the drop node
+        var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);
+        return this.processDrop(targetNode, data, point, dd, e, dropNode);
+    },
+    
+    onContainerDrop : function(dd, e, data){
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            var targetNode = this.tree.getRootNode();       
+            targetNode.ui.startDrop();
+            var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, 'append', e) : null);
+            return this.processDrop(targetNode, data, 'append', dd, e, dropNode);
+        }
+        return false;
+    },
+    
+    // private
+    processDrop: function(target, data, point, dd, e, dropNode){
+        var dropEvent = {
+            tree : this.tree,
+            target: target,
+            data: data,
+            point: point,
+            source: dd,
+            rawEvent: e,
+            dropNode: dropNode,
+            cancel: !dropNode,
+            dropStatus: false
+        };
+        var retval = this.tree.fireEvent("beforenodedrop", dropEvent);
+        if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){
+            target.ui.endDrop();
+            return dropEvent.dropStatus;
+        }
+    
+        target = dropEvent.target;
+        if(point == 'append' && !target.isExpanded()){
+            target.expand(false, null, function(){
+                this.completeDrop(dropEvent);
+            }.createDelegate(this));
+        }else{
+            this.completeDrop(dropEvent);
+        }
+        return true;
+    },
+
+    // private
+    completeDrop : function(de){
+        var ns = de.dropNode, p = de.point, t = de.target;
+        if(!Ext.isArray(ns)){
+            ns = [ns];
+        }
+        var n;
+        for(var i = 0, len = ns.length; i < len; i++){
+            n = ns[i];
+            if(p == "above"){
+                t.parentNode.insertBefore(n, t);
+            }else if(p == "below"){
+                t.parentNode.insertBefore(n, t.nextSibling);
+            }else{
+                t.appendChild(n);
+            }
+        }
+        n.ui.focus();
+        if(Ext.enableFx && this.tree.hlDrop){
+            n.ui.highlight();
+        }
+        t.ui.endDrop();
+        this.tree.fireEvent("nodedrop", de);
+    },
+
+    // private
+    afterNodeMoved : function(dd, data, e, targetNode, dropNode){
+        if(Ext.enableFx && this.tree.hlDrop){
+            dropNode.ui.focus();
+            dropNode.ui.highlight();
+        }
+        this.tree.fireEvent("nodedrop", this.tree, targetNode, data, dd, e);
+    },
+
+    // private
+    getTree : function(){
+        return this.tree;
+    },
+
+    // private
+    removeDropIndicators : function(n){
+        if(n && n.ddel){
+            var el = n.ddel;
+            Ext.fly(el).removeClass([
+                    "x-tree-drag-insert-above",
+                    "x-tree-drag-insert-below",
+                    "x-tree-drag-append"]);
+            this.lastInsertClass = "_noclass";
+        }
+    },
+
+    // private
+    beforeDragDrop : function(target, e, id){
+        this.cancelExpand();
+        return true;
+    },
+
+    // private
+    afterRepair : function(data){
+        if(data && Ext.enableFx){
+            data.node.ui.highlight();
+        }
+        this.hideProxy();
+    }    
+});
+
+}
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEventModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEventModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeEventModel.js	(revision 76)
@@ -0,0 +1,198 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.tree.TreeEventModel = function(tree){
+    this.tree = tree;
+    this.tree.on('render', this.initEvents, this);
+};
+
+Ext.tree.TreeEventModel.prototype = {
+    initEvents : function(){
+        var t = this.tree;
+
+        if(t.trackMouseOver !== false){
+            t.mon(t.innerCt, {
+                scope: this,
+                mouseover: this.delegateOver,
+                mouseout: this.delegateOut
+            });
+        }
+        t.mon(t.getTreeEl(), {
+            scope: this,
+            click: this.delegateClick,
+            dblclick: this.delegateDblClick,
+            contextmenu: this.delegateContextMenu
+        });
+    },
+
+    getNode : function(e){
+        var t;
+        if(t = e.getTarget('.x-tree-node-el', 10)){
+            var id = Ext.fly(t, '_treeEvents').getAttribute('tree-node-id', 'ext');
+            if(id){
+                return this.tree.getNodeById(id);
+            }
+        }
+        return null;
+    },
+
+    getNodeTarget : function(e){
+        var t = e.getTarget('.x-tree-node-icon', 1);
+        if(!t){
+            t = e.getTarget('.x-tree-node-el', 6);
+        }
+        return t;
+    },
+
+    delegateOut : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            var n = this.getNode(e);
+            this.onIconOut(e, n);
+            if(n == this.lastEcOver){
+                delete this.lastEcOver;
+            }
+        }
+        if((t = this.getNodeTarget(e)) && !e.within(t, true)){
+            this.onNodeOut(e, this.getNode(e));
+        }
+    },
+
+    delegateOver : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(Ext.isGecko && !this.trackingDoc){ // prevent hanging in FF
+            Ext.getBody().on('mouseover', this.trackExit, this);
+            this.trackingDoc = true;
+        }
+        if(this.lastEcOver){ // prevent hung highlight
+            this.onIconOut(e, this.lastEcOver);
+            delete this.lastEcOver;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            this.lastEcOver = this.getNode(e);
+            this.onIconOver(e, this.lastEcOver);
+        }
+        if(t = this.getNodeTarget(e)){
+            this.onNodeOver(e, this.getNode(e));
+        }
+    },
+
+    trackExit : function(e){
+        if(this.lastOverNode){
+            if(this.lastOverNode.ui && !e.within(this.lastOverNode.ui.getEl())){
+                this.onNodeOut(e, this.lastOverNode);
+            }
+            delete this.lastOverNode;
+            Ext.getBody().un('mouseover', this.trackExit, this);
+            this.trackingDoc = false;
+        }
+
+    },
+
+    delegateClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(e.getTarget('input[type=checkbox]', 1)){
+                this.onCheckboxClick(e, this.getNode(e));
+            }else if(e.getTarget('.x-tree-ec-icon', 1)){
+                this.onIconClick(e, this.getNode(e));
+            }else if(this.getNodeTarget(e)){
+                this.onNodeClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'click');
+        }
+    },
+
+    delegateDblClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeDblClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'dblclick');
+        }
+    },
+
+    delegateContextMenu : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeContextMenu(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'contextmenu');
+        }
+    },
+    
+    checkContainerEvent: function(e, type){
+        if(this.disabled){
+            e.stopEvent();
+            return false;
+        }
+        this.onContainerEvent(e, type);    
+    },
+
+    onContainerEvent: function(e, type){
+        this.tree.fireEvent('container' + type, this.tree, e);
+    },
+
+    onNodeClick : function(e, node){
+        node.ui.onClick(e);
+    },
+
+    onNodeOver : function(e, node){
+        this.lastOverNode = node;
+        node.ui.onOver(e);
+    },
+
+    onNodeOut : function(e, node){
+        node.ui.onOut(e);
+    },
+
+    onIconOver : function(e, node){
+        node.ui.addClass('x-tree-ec-over');
+    },
+
+    onIconOut : function(e, node){
+        node.ui.removeClass('x-tree-ec-over');
+    },
+
+    onIconClick : function(e, node){
+        node.ui.ecClick(e);
+    },
+
+    onCheckboxClick : function(e, node){
+        node.ui.onCheckChange(e);
+    },
+
+    onNodeDblClick : function(e, node){
+        node.ui.onDblClick(e);
+    },
+
+    onNodeContextMenu : function(e, node){
+        node.ui.onContextMenu(e);
+    },
+
+    beforeEvent : function(e){
+        var node = this.getNode(e);
+        if(this.disabled || !node || !node.ui){
+            e.stopEvent();
+            return false;
+        }
+        return true;
+    },
+
+    disable: function(){
+        this.disabled = true;
+    },
+
+    enable: function(){
+        this.disabled = false;
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/AsyncTreeNode.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/AsyncTreeNode.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/AsyncTreeNode.js	(revision 76)
@@ -0,0 +1,114 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.AsyncTreeNode
+ * @extends Ext.tree.TreeNode
+ * @cfg {TreeLoader} loader A TreeLoader to be used by this node (defaults to the loader defined on the tree)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node 
+ */
+ Ext.tree.AsyncTreeNode = function(config){
+    this.loaded = config && config.loaded === true;
+    this.loading = false;
+    Ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);
+    /**
+    * @event beforeload
+    * Fires before this node is loaded, return false to cancel
+    * @param {Node} this This node
+    */
+    this.addEvents('beforeload', 'load');
+    /**
+    * @event load
+    * Fires when this node is loaded
+    * @param {Node} this This node
+    */
+    /**
+     * The loader used by this node (defaults to using the tree's defined loader)
+     * @type TreeLoader
+     * @property loader
+     */
+};
+Ext.extend(Ext.tree.AsyncTreeNode, Ext.tree.TreeNode, {
+    expand : function(deep, anim, callback, scope){
+        if(this.loading){ // if an async load is already running, waiting til it's done
+            var timer;
+            var f = function(){
+                if(!this.loading){ // done loading
+                    clearInterval(timer);
+                    this.expand(deep, anim, callback, scope);
+                }
+            }.createDelegate(this);
+            timer = setInterval(f, 200);
+            return;
+        }
+        if(!this.loaded){
+            if(this.fireEvent("beforeload", this) === false){
+                return;
+            }
+            this.loading = true;
+            this.ui.beforeLoad(this);
+            var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();
+            if(loader){
+                loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback, scope]), this);
+                return;
+            }
+        }
+        Ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node is currently loading
+     * @return {Boolean}
+     */
+    isLoading : function(){
+        return this.loading;  
+    },
+    
+    loadComplete : function(deep, anim, callback, scope){
+        this.loading = false;
+        this.loaded = true;
+        this.ui.afterLoad(this);
+        this.fireEvent("load", this);
+        this.expand(deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node has been loaded
+     * @return {Boolean}
+     */
+    isLoaded : function(){
+        return this.loaded;
+    },
+    
+    hasChildNodes : function(){
+        if(!this.isLeaf() && !this.loaded){
+            return true;
+        }else{
+            return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);
+        }
+    },
+
+    /**
+     * Trigger a reload for this node
+     * @param {Function} callback
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Node.
+     */
+    reload : function(callback, scope){
+        this.collapse(false, false);
+        while(this.firstChild){
+            this.removeChild(this.firstChild).destroy();
+        }
+        this.childrenRendered = false;
+        this.loaded = false;
+        if(this.isHiddenRoot()){
+            this.expanded = false;
+        }
+        this.expand(false, false, callback, scope);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.async = Ext.tree.AsyncTreeNode;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNodeUI.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNodeUI.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/tree/TreeNodeUI.js	(revision 76)
@@ -0,0 +1,676 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.tree.TreeNodeUI
+ * This class provides the default UI implementation for Ext TreeNodes.
+ * The TreeNode UI implementation is separate from the
+ * tree implementation, and allows customizing of the appearance of
+ * tree nodes.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ * <p>
+ * This class provides access to the user interface components of an Ext TreeNode, through
+ * {@link Ext.tree.TreeNode#getUI}
+ */
+Ext.tree.TreeNodeUI = Ext.extend(Object, {
+    
+    constructor : function(node){
+        Ext.apply(this, {
+            node: node,
+            rendered: false,
+            animating: false,
+            wasLeaf: true,
+            ecc: 'x-tree-ec-icon x-tree-elbow',
+            emptyIcon: Ext.BLANK_IMAGE_URL    
+        });
+    },
+    
+    // private
+    removeChild : function(node){
+        if(this.rendered){
+            this.ctNode.removeChild(node.ui.getEl());
+        }
+    },
+
+    // private
+    beforeLoad : function(){
+         this.addClass("x-tree-node-loading");
+    },
+
+    // private
+    afterLoad : function(){
+         this.removeClass("x-tree-node-loading");
+    },
+
+    // private
+    onTextChange : function(node, text, oldText){
+        if(this.rendered){
+            this.textNode.innerHTML = text;
+        }
+    },
+    
+    // private
+    onIconClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.iconNode).replaceClass(oldCls, cls);
+        }
+    },
+    
+    // private
+    onIconChange : function(node, icon){
+        if(this.rendered){
+            //'<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            var empty = Ext.isEmpty(icon);
+            this.iconNode.src = empty ? this.emptyIcon : icon;
+            Ext.fly(this.iconNode)[empty ? 'removeClass' : 'addClass']('x-tree-node-inline-icon');
+        }
+    },
+    
+    // private
+    onTipChange : function(node, tip, title){
+        if(this.rendered){
+            var hasTitle = Ext.isDefined(title);
+            if(this.textNode.setAttributeNS){
+                this.textNode.setAttributeNS("ext", "qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttributeNS("ext", "qtitle", title);
+                }
+            }else{
+                this.textNode.setAttribute("ext:qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttribute("ext:qtitle", title);
+                }
+            }
+        }
+    },
+    
+    // private
+    onHrefChange : function(node, href, target){
+        if(this.rendered){
+            this.anchor.href = this.getHref(href);
+            if(Ext.isDefined(target)){
+                this.anchor.target = target;
+            }
+        }
+    },
+    
+    // private
+    onClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.elNode).replaceClass(oldCls, cls);
+        }    
+    },
+
+    // private
+    onDisableChange : function(node, state){
+        this.disabled = state;
+        if (this.checkbox) {
+            this.checkbox.disabled = state;
+        }
+        this[state ? 'addClass' : 'removeClass']('x-tree-node-disabled');
+    },
+
+    // private
+    onSelectedChange : function(state){
+        if(state){
+            this.focus();
+            this.addClass("x-tree-selected");
+        }else{
+            //this.blur();
+            this.removeClass("x-tree-selected");
+        }
+    },
+
+    // private
+    onMove : function(tree, node, oldParent, newParent, index, refNode){
+        this.childIndent = null;
+        if(this.rendered){
+            var targetNode = newParent.ui.getContainer();
+            if(!targetNode){//target not rendered
+                this.holder = document.createElement("div");
+                this.holder.appendChild(this.wrap);
+                return;
+            }
+            var insertBefore = refNode ? refNode.ui.getEl() : null;
+            if(insertBefore){
+                targetNode.insertBefore(this.wrap, insertBefore);
+            }else{
+                targetNode.appendChild(this.wrap);
+            }
+            this.node.renderIndent(true, oldParent != newParent);
+        }
+    },
+
+/**
+ * Adds one or more CSS classes to the node's UI element.
+ * Duplicate classes are automatically filtered out.
+ * @param {String/Array} className The CSS class to add, or an array of classes
+ */
+    addClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).addClass(cls);
+        }
+    },
+
+/**
+ * Removes one or more CSS classes from the node's UI element.
+ * @param {String/Array} className The CSS class to remove, or an array of classes
+ */
+    removeClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).removeClass(cls);
+        }
+    },
+
+    // private
+    remove : function(){
+        if(this.rendered){
+            this.holder = document.createElement("div");
+            this.holder.appendChild(this.wrap);
+        }
+    },
+
+    // private
+    fireEvent : function(){
+        return this.node.fireEvent.apply(this.node, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.node.on("move", this.onMove, this);
+
+        if(this.node.disabled){
+            this.onDisableChange(this.node, true);
+        }
+        if(this.node.hidden){
+            this.hide();
+        }
+        var ot = this.node.getOwnerTree();
+        var dd = ot.enableDD || ot.enableDrag || ot.enableDrop;
+        if(dd && (!this.node.isRoot || ot.rootVisible)){
+            Ext.dd.Registry.register(this.elNode, {
+                node: this.node,
+                handles: this.getDDHandles(),
+                isHandle: false
+            });
+        }
+    },
+
+    // private
+    getDDHandles : function(){
+        return [this.iconNode, this.textNode, this.elNode];
+    },
+
+/**
+ * Hides this node.
+ */
+    hide : function(){
+        this.node.hidden = true;
+        if(this.wrap){
+            this.wrap.style.display = "none";
+        }
+    },
+
+/**
+ * Shows this node.
+ */
+    show : function(){
+        this.node.hidden = false;
+        if(this.wrap){
+            this.wrap.style.display = "";
+        }
+    },
+
+    // private
+    onContextMenu : function(e){
+        if (this.node.hasListener("contextmenu") || this.node.getOwnerTree().hasListener("contextmenu")) {
+            e.preventDefault();
+            this.focus();
+            this.fireEvent("contextmenu", this.node, e);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        if(this.dropping){
+            e.stopEvent();
+            return;
+        }
+        if(this.fireEvent("beforeclick", this.node, e) !== false){
+            var a = e.getTarget('a');
+            if(!this.disabled && this.node.attributes.href && a){
+                this.fireEvent("click", this.node, e);
+                return;
+            }else if(a && e.ctrlKey){
+                e.stopEvent();
+            }
+            e.preventDefault();
+            if(this.disabled){
+                return;
+            }
+
+            if(this.node.attributes.singleClickExpand && !this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+
+            this.fireEvent("click", this.node, e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        e.preventDefault();
+        if(this.disabled){
+            return;
+        }
+        if(this.fireEvent("beforedblclick", this.node, e) !== false){
+            if(this.checkbox){
+                this.toggleCheck();
+            }
+            if(!this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+            this.fireEvent("dblclick", this.node, e);
+        }
+    },
+
+    onOver : function(e){
+        this.addClass('x-tree-node-over');
+    },
+
+    onOut : function(e){
+        this.removeClass('x-tree-node-over');
+    },
+
+    // private
+    onCheckChange : function(){
+        var checked = this.checkbox.checked;
+        // fix for IE6
+        this.checkbox.defaultChecked = checked;
+        this.node.attributes.checked = checked;
+        this.fireEvent('checkchange', this.node, checked);
+    },
+
+    // private
+    ecClick : function(e){
+        if(!this.animating && this.node.isExpandable()){
+            this.node.toggle();
+        }
+    },
+
+    // private
+    startDrop : function(){
+        this.dropping = true;
+    },
+
+    // delayed drop so the click event doesn't get fired on a drop
+    endDrop : function(){
+       setTimeout(function(){
+           this.dropping = false;
+       }.createDelegate(this), 50);
+    },
+
+    // private
+    expand : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "";
+    },
+
+    // private
+    focus : function(){
+        if(!this.node.preventHScroll){
+            try{this.anchor.focus();
+            }catch(e){}
+        }else{
+            try{
+                var noscroll = this.node.getOwnerTree().getTreeEl().dom;
+                var l = noscroll.scrollLeft;
+                this.anchor.focus();
+                noscroll.scrollLeft = l;
+            }catch(e){}
+        }
+    },
+
+/**
+ * Sets the checked status of the tree node to the passed value, or, if no value was passed,
+ * toggles the checked status. If the node was rendered with no checkbox, this has no effect.
+ * @param {Boolean} value (optional) The new checked status.
+ */
+    toggleCheck : function(value){
+        var cb = this.checkbox;
+        if(cb){
+            cb.checked = (value === undefined ? !cb.checked : value);
+            this.onCheckChange();
+        }
+    },
+
+    // private
+    blur : function(){
+        try{
+            this.anchor.blur();
+        }catch(e){}
+    },
+
+    // private
+    animExpand : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.stopFx();
+        if(!this.node.isExpandable()){
+            this.updateExpandIcon();
+            this.ctNode.style.display = "";
+            Ext.callback(callback);
+            return;
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideIn('t', {
+           callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    highlight : function(){
+        var tree = this.node.getOwnerTree();
+        Ext.fly(this.wrap).highlight(
+            tree.hlColor || "C3DAF9",
+            {endColor: tree.hlBaseColor}
+        );
+    },
+
+    // private
+    collapse : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "none";
+    },
+
+    // private
+    animCollapse : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.enableDisplayMode('block');
+        ct.stopFx();
+
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideOut('t', {
+            callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    getContainer : function(){
+        return this.ctNode;
+    },
+
+/**
+ * Returns the element which encapsulates this node.
+ * @return {HtmlElement} The DOM element. The default implementation uses a <code>&lt;li></code>.
+ */
+    getEl : function(){
+        return this.wrap;
+    },
+
+    // private
+    appendDDGhost : function(ghostNode){
+        ghostNode.appendChild(this.elNode.cloneNode(true));
+    },
+
+    // private
+    getDDRepairXY : function(){
+        return Ext.lib.Dom.getXY(this.iconNode);
+    },
+
+    // private
+    onRender : function(){
+        this.render();
+    },
+
+    // private
+    render : function(bulkRender){
+        var n = this.node, a = n.attributes;
+        var targetNode = n.parentNode ?
+              n.parentNode.ui.getContainer() : n.ownerTree.innerCt.dom;
+
+        if(!this.rendered){
+            this.rendered = true;
+
+            this.renderElements(n, a, targetNode, bulkRender);
+
+            if(a.qtip){
+                this.onTipChange(n, a.qtip, a.qtipTitle);
+            }else if(a.qtipCfg){
+                a.qtipCfg.target = Ext.id(this.textNode);
+                Ext.QuickTips.register(a.qtipCfg);
+            }
+            this.initEvents();
+            if(!this.node.expanded){
+                this.updateExpandIcon(true);
+            }
+        }else{
+            if(bulkRender === true) {
+                targetNode.appendChild(this.wrap);
+            }
+        }
+    },
+
+    // private
+    renderElements : function(n, a, targetNode, bulkRender){
+        // add some indent caching, this helps performance when rendering a large tree
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var cb = Ext.isBoolean(a.checked),
+            nel,
+            href = this.getHref(a.href),
+            buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',
+            '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+            '<img alt="" src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+            '<img alt="" src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',
+            '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+             a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",
+            '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+            "</li>"].join('');
+
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+        var index = 3;
+        if(cb){
+            this.checkbox = cs[3];
+            // fix for IE6
+            this.checkbox.defaultChecked = this.checkbox.checked;
+            index++;
+        }
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+    
+    /**
+     * @private Gets a normalized href for the node.
+     * @param {String} href
+     */
+    getHref : function(href){
+        return Ext.isEmpty(href) ? (Ext.isGecko ? '' : '#') : href;
+    },
+
+/**
+ * Returns the &lt;a> element that provides focus for the node's UI.
+ * @return {HtmlElement} The DOM anchor element.
+ */
+    getAnchor : function(){
+        return this.anchor;
+    },
+
+/**
+ * Returns the text node.
+ * @return {HtmlNode} The DOM text node.
+ */
+    getTextEl : function(){
+        return this.textNode;
+    },
+
+/**
+ * Returns the icon &lt;img> element.
+ * @return {HtmlElement} The DOM image element.
+ */
+    getIconEl : function(){
+        return this.iconNode;
+    },
+
+/**
+ * Returns the checked status of the node. If the node was rendered with no
+ * checkbox, it returns false.
+ * @return {Boolean} The checked flag.
+ */
+    isChecked : function(){
+        return this.checkbox ? this.checkbox.checked : false;
+    },
+
+    // private
+    updateExpandIcon : function(){
+        if(this.rendered){
+            var n = this.node,
+                c1,
+                c2,
+                cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow",
+                hasChild = n.hasChildNodes();
+            if(hasChild || n.attributes.expandable){
+                if(n.expanded){
+                    cls += "-minus";
+                    c1 = "x-tree-node-collapsed";
+                    c2 = "x-tree-node-expanded";
+                }else{
+                    cls += "-plus";
+                    c1 = "x-tree-node-expanded";
+                    c2 = "x-tree-node-collapsed";
+                }
+                if(this.wasLeaf){
+                    this.removeClass("x-tree-node-leaf");
+                    this.wasLeaf = false;
+                }
+                if(this.c1 != c1 || this.c2 != c2){
+                    Ext.fly(this.elNode).replaceClass(c1, c2);
+                    this.c1 = c1; this.c2 = c2;
+                }
+            }else{
+                if(!this.wasLeaf){
+                    Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-collapsed");
+                    delete this.c1;
+                    delete this.c2;
+                    this.wasLeaf = true;
+                }
+            }
+            var ecc = "x-tree-ec-icon "+cls;
+            if(this.ecc != ecc){
+                this.ecNode.className = ecc;
+                this.ecc = ecc;
+            }
+        }
+    },
+
+    // private
+    onIdChange: function(id){
+        if(this.rendered){
+            this.elNode.setAttribute('ext:tree-node-id', id);
+        }
+    },
+
+    // private
+    getChildIndent : function(){
+        if(!this.childIndent){
+            var buf = [],
+                p = this.node;
+            while(p){
+                if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){
+                    if(!p.isLast()) {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />');
+                    } else {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />');
+                    }
+                }
+                p = p.parentNode;
+            }
+            this.childIndent = buf.join("");
+        }
+        return this.childIndent;
+    },
+
+    // private
+    renderIndent : function(){
+        if(this.rendered){
+            var indent = "",
+                p = this.node.parentNode;
+            if(p){
+                indent = p.ui.getChildIndent();
+            }
+            if(this.indentMarkup != indent){ // don't rerender if not required
+                this.indentNode.innerHTML = indent;
+                this.indentMarkup = indent;
+            }
+            this.updateExpandIcon();
+        }
+    },
+
+    destroy : function(){
+        if(this.elNode){
+            Ext.dd.Registry.unregister(this.elNode.id);
+        }
+
+        Ext.each(['textnode', 'anchor', 'checkbox', 'indentNode', 'ecNode', 'iconNode', 'elNode', 'ctNode', 'wrap', 'holder'], function(el){
+            if(this[el]){
+                Ext.fly(this[el]).remove();
+                delete this[el];
+            }
+        }, this);
+        delete this.node;
+    }
+});
+
+/**
+ * @class Ext.tree.RootTreeNodeUI
+ * This class provides the default UI implementation for <b>root</b> Ext TreeNodes.
+ * The RootTreeNode UI implementation allows customizing the appearance of the root tree node.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ */
+Ext.tree.RootTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    // private
+    render : function(){
+        if(!this.rendered){
+            var targetNode = this.node.ownerTree.innerCt.dom;
+            this.node.expanded = true;
+            targetNode.innerHTML = '<div class="x-tree-root-node"></div>';
+            this.wrap = this.ctNode = targetNode.firstChild;
+        }
+    },
+    collapse : Ext.emptyFn,
+    expand : Ext.emptyFn
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Shadow.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Shadow.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Shadow.js	(revision 76)
@@ -0,0 +1,203 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Shadow
+ * Simple class that can provide a shadow effect for any element.  Note that the element MUST be absolutely positioned,
+ * and the shadow does not provide any shimming.  This should be used only in simple cases -- for more advanced
+ * functionality that can also provide the same shadow effect, see the {@link Ext.Layer} class.
+ * @constructor
+ * Create a new Shadow
+ * @param {Object} config The config object
+ */
+Ext.Shadow = function(config) {
+    Ext.apply(this, config);
+    if (typeof this.mode != "string") {
+        this.mode = this.defaultMode;
+    }
+    var o = this.offset,
+        a = {
+            h: 0
+        },
+        rad = Math.floor(this.offset / 2);
+    switch (this.mode.toLowerCase()) {
+        // all this hideous nonsense calculates the various offsets for shadows
+        case "drop":
+            a.w = 0;
+            a.l = a.t = o;
+            a.t -= 1;
+            if (Ext.isIE) {
+                a.l -= this.offset + rad;
+                a.t -= this.offset + rad;
+                a.w -= rad;
+                a.h -= rad;
+                a.t += 1;
+            }
+        break;
+        case "sides":
+            a.w = (o * 2);
+            a.l = -o;
+            a.t = o - 1;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= this.offset + rad;
+                a.l += 1;
+                a.w -= (this.offset - rad) * 2;
+                a.w -= rad + 1;
+                a.h -= 1;
+            }
+        break;
+        case "frame":
+            a.w = a.h = (o * 2);
+            a.l = a.t = -o;
+            a.t += 1;
+            a.h -= 2;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= (this.offset - rad);
+                a.l += 1;
+                a.w -= (this.offset + rad + 1);
+                a.h -= (this.offset + rad);
+                a.h += 1;
+            }
+        break;
+    };
+
+    this.adjusts = a;
+};
+
+Ext.Shadow.prototype = {
+    /**
+     * @cfg {String} mode
+     * The shadow display mode.  Supports the following options:<div class="mdetail-params"><ul>
+     * <li><b><tt>sides</tt></b> : Shadow displays on both sides and bottom only</li>
+     * <li><b><tt>frame</tt></b> : Shadow displays equally on all four sides</li>
+     * <li><b><tt>drop</tt></b> : Traditional bottom-right drop shadow</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {String} offset
+     * The number of pixels to offset the shadow from the element (defaults to <tt>4</tt>)
+     */
+    offset: 4,
+
+    // private
+    defaultMode: "drop",
+
+    /**
+     * Displays the shadow under the target element
+     * @param {Mixed} targetEl The id or element under which the shadow should display
+     */
+    show: function(target) {
+        target = Ext.get(target);
+        if (!this.el) {
+            this.el = Ext.Shadow.Pool.pull();
+            if (this.el.dom.nextSibling != target.dom) {
+                this.el.insertBefore(target);
+            }
+        }
+        this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10) - 1);
+        if (Ext.isIE) {
+            this.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (this.offset) + ")";
+        }
+        this.realign(
+        target.getLeft(true),
+        target.getTop(true),
+        target.getWidth(),
+        target.getHeight()
+        );
+        this.el.dom.style.display = "block";
+    },
+
+    /**
+     * Returns true if the shadow is visible, else false
+     */
+    isVisible: function() {
+        return this.el ? true: false;
+    },
+
+    /**
+     * Direct alignment when values are already available. Show must be called at least once before
+     * calling this method to ensure it is initialized.
+     * @param {Number} left The target element left position
+     * @param {Number} top The target element top position
+     * @param {Number} width The target element width
+     * @param {Number} height The target element height
+     */
+    realign: function(l, t, w, h) {
+        if (!this.el) {
+            return;
+        }
+        var a = this.adjusts,
+            d = this.el.dom,
+            s = d.style,
+            iea = 0,
+            sw = (w + a.w),
+            sh = (h + a.h),
+            sws = sw + "px",
+            shs = sh + "px",
+            cn,
+            sww;
+        s.left = (l + a.l) + "px";
+        s.top = (t + a.t) + "px";
+        if (s.width != sws || s.height != shs) {
+            s.width = sws;
+            s.height = shs;
+            if (!Ext.isIE) {
+                cn = d.childNodes;
+                sww = Math.max(0, (sw - 12)) + "px";
+                cn[0].childNodes[1].style.width = sww;
+                cn[1].childNodes[1].style.width = sww;
+                cn[2].childNodes[1].style.width = sww;
+                cn[1].style.height = Math.max(0, (sh - 12)) + "px";
+            }
+        }
+    },
+
+    /**
+     * Hides this shadow
+     */
+    hide: function() {
+        if (this.el) {
+            this.el.dom.style.display = "none";
+            Ext.Shadow.Pool.push(this.el);
+            delete this.el;
+        }
+    },
+
+    /**
+     * Adjust the z-index of this shadow
+     * @param {Number} zindex The new z-index
+     */
+    setZIndex: function(z) {
+        this.zIndex = z;
+        if (this.el) {
+            this.el.setStyle("z-index", z);
+        }
+    }
+};
+
+// Private utility class that manages the internal Shadow cache
+Ext.Shadow.Pool = function() {
+    var p = [],
+        markup = Ext.isIE ?
+            '<div class="x-ie-shadow"></div>':
+            '<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';
+    return {
+        pull: function() {
+            var sh = p.shift();
+            if (!sh) {
+                sh = Ext.get(Ext.DomHelper.insertHtml("beforeBegin", document.body.firstChild, markup));
+                sh.autoBoxAdjust = false;
+            }
+            return sh;
+        },
+
+        push: function(sh) {
+            p.push(sh);
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/swfobject.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/swfobject.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/swfobject.js	(revision 76)
@@ -0,0 +1,789 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*! SWFObject v2.2 <http://code.google.com/p/swfobject/> 
+    is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
+*/
+
+var swfobject = function() {
+    
+    var UNDEF = "undefined",
+        OBJECT = "object",
+        SHOCKWAVE_FLASH = "Shockwave Flash",
+        SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash",
+        FLASH_MIME_TYPE = "application/x-shockwave-flash",
+        EXPRESS_INSTALL_ID = "SWFObjectExprInst",
+        ON_READY_STATE_CHANGE = "onreadystatechange",
+        
+        win = window,
+        doc = document,
+        nav = navigator,
+        
+        plugin = false,
+        domLoadFnArr = [main],
+        regObjArr = [],
+        objIdArr = [],
+        listenersArr = [],
+        storedAltContent,
+        storedAltContentId,
+        storedCallbackFn,
+        storedCallbackObj,
+        isDomLoaded = false,
+        isExpressInstallActive = false,
+        dynamicStylesheet,
+        dynamicStylesheetMedia,
+        autoHideShow = true,
+    
+    /* Centralized function for browser feature detection
+        - User agent string detection is only used when no good alternative is possible
+        - Is executed directly for optimal performance
+    */  
+    ua = function() {
+        var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF,
+            u = nav.userAgent.toLowerCase(),
+            p = nav.platform.toLowerCase(),
+            windows = p ? (/win/).test(p) : /win/.test(u),
+            mac = p ? (/mac/).test(p) : /mac/.test(u),
+            webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, // returns either the webkit version or false if not webkit
+            ie = !+"\v1", // feature detection based on Andrea Giammarchi's solution: http://webreflection.blogspot.com/2009/01/32-bytes-to-know-if-your-browser-is-ie.html
+            playerVersion = [0,0,0],
+            d = null;
+        if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) {
+            d = nav.plugins[SHOCKWAVE_FLASH].description;
+            if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { // navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin indicates whether plug-ins are enabled or disabled in Safari 3+
+                plugin = true;
+                ie = false; // cascaded feature detection for Internet Explorer
+                d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
+                playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10);
+                playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10);
+                playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0;
+            }
+        }
+        else if (typeof win.ActiveXObject != UNDEF) {
+            try {
+                var a = new ActiveXObject(SHOCKWAVE_FLASH_AX);
+                if (a) { // a will return null when ActiveX is disabled
+                    d = a.GetVariable("$version");
+                    if (d) {
+                        ie = true; // cascaded feature detection for Internet Explorer
+                        d = d.split(" ")[1].split(",");
+                        playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+            }
+            catch(e) {}
+        }
+        return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac };
+    }(),
+    
+    /* Cross-browser onDomLoad
+        - Will fire an event as soon as the DOM of a web page is loaded
+        - Internet Explorer workaround based on Diego Perini's solution: http://javascript.nwbox.com/IEContentLoaded/
+        - Regular onload serves as fallback
+    */ 
+    onDomLoad = function() {
+        if (!ua.w3) { return; }
+        if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { // function is fired after onload, e.g. when script is inserted dynamically 
+            callDomLoadFunctions();
+        }
+        if (!isDomLoaded) {
+            if (typeof doc.addEventListener != UNDEF) {
+                doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false);
+            }       
+            if (ua.ie && ua.win) {
+                doc.attachEvent(ON_READY_STATE_CHANGE, function() {
+                    if (doc.readyState == "complete") {
+                        doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee);
+                        callDomLoadFunctions();
+                    }
+                });
+                if (win == top) { // if not inside an iframe
+                    (function(){
+                        if (isDomLoaded) { return; }
+                        try {
+                            doc.documentElement.doScroll("left");
+                        }
+                        catch(e) {
+                            setTimeout(arguments.callee, 0);
+                            return;
+                        }
+                        callDomLoadFunctions();
+                    })();
+                }
+            }
+            if (ua.wk) {
+                (function(){
+                    if (isDomLoaded) { return; }
+                    if (!(/loaded|complete/).test(doc.readyState)) {
+                        setTimeout(arguments.callee, 0);
+                        return;
+                    }
+                    callDomLoadFunctions();
+                })();
+            }
+            addLoadEvent(callDomLoadFunctions);
+        }
+    }();
+    
+    function callDomLoadFunctions() {
+        if (isDomLoaded) { return; }
+        try { // test if we can really add/remove elements to/from the DOM; we don't want to fire it too early
+            var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span"));
+            t.parentNode.removeChild(t);
+        }
+        catch (e) { return; }
+        isDomLoaded = true;
+        var dl = domLoadFnArr.length;
+        for (var i = 0; i < dl; i++) {
+            domLoadFnArr[i]();
+        }
+    }
+    
+    function addDomLoadEvent(fn) {
+        if (isDomLoaded) {
+            fn();
+        }
+        else { 
+            domLoadFnArr[domLoadFnArr.length] = fn; // Array.push() is only available in IE5.5+
+        }
+    }
+    
+    /* Cross-browser onload
+        - Based on James Edwards' solution: http://brothercake.com/site/resources/scripts/onload/
+        - Will fire an event as soon as a web page including all of its assets are loaded 
+     */
+    function addLoadEvent(fn) {
+        if (typeof win.addEventListener != UNDEF) {
+            win.addEventListener("load", fn, false);
+        }
+        else if (typeof doc.addEventListener != UNDEF) {
+            doc.addEventListener("load", fn, false);
+        }
+        else if (typeof win.attachEvent != UNDEF) {
+            addListener(win, "onload", fn);
+        }
+        else if (typeof win.onload == "function") {
+            var fnOld = win.onload;
+            win.onload = function() {
+                fnOld();
+                fn();
+            };
+        }
+        else {
+            win.onload = fn;
+        }
+    }
+    
+    /* Main function
+        - Will preferably execute onDomLoad, otherwise onload (as a fallback)
+    */
+    function main() { 
+        if (plugin) {
+            testPlayerVersion();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Detect the Flash Player version for non-Internet Explorer browsers
+        - Detecting the plug-in version via the object element is more precise than using the plugins collection item's description:
+          a. Both release and build numbers can be detected
+          b. Avoid wrong descriptions by corrupt installers provided by Adobe
+          c. Avoid wrong descriptions by multiple Flash Player entries in the plugin Array, caused by incorrect browser imports
+        - Disadvantage of this method is that it depends on the availability of the DOM, while the plugins collection is immediately available
+    */
+    function testPlayerVersion() {
+        var b = doc.getElementsByTagName("body")[0];
+        var o = createElement(OBJECT);
+        o.setAttribute("type", FLASH_MIME_TYPE);
+        var t = b.appendChild(o);
+        if (t) {
+            var counter = 0;
+            (function(){
+                if (typeof t.GetVariable != UNDEF) {
+                    var d = t.GetVariable("$version");
+                    if (d) {
+                        d = d.split(" ")[1].split(",");
+                        ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+                else if (counter < 10) {
+                    counter++;
+                    setTimeout(arguments.callee, 10);
+                    return;
+                }
+                b.removeChild(o);
+                t = null;
+                matchVersions();
+            })();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Perform Flash Player and SWF version matching; static publishing only
+    */
+    function matchVersions() {
+        var rl = regObjArr.length;
+        if (rl > 0) {
+            for (var i = 0; i < rl; i++) { // for each registered object element
+                var id = regObjArr[i].id;
+                var cb = regObjArr[i].callbackFn;
+                var cbObj = {success:false, id:id};
+                if (ua.pv[0] > 0) {
+                    var obj = getElementById(id);
+                    if (obj) {
+                        if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { // Flash Player version >= published SWF version: Houston, we have a match!
+                            setVisibility(id, true);
+                            if (cb) {
+                                cbObj.success = true;
+                                cbObj.ref = getObjectById(id);
+                                cb(cbObj);
+                            }
+                        }
+                        else if (regObjArr[i].expressInstall && canExpressInstall()) { // show the Adobe Express Install dialog if set by the web page author and if supported
+                            var att = {};
+                            att.data = regObjArr[i].expressInstall;
+                            att.width = obj.getAttribute("width") || "0";
+                            att.height = obj.getAttribute("height") || "0";
+                            if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); }
+                            if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); }
+                            // parse HTML object param element's name-value pairs
+                            var par = {};
+                            var p = obj.getElementsByTagName("param");
+                            var pl = p.length;
+                            for (var j = 0; j < pl; j++) {
+                                if (p[j].getAttribute("name").toLowerCase() != "movie") {
+                                    par[p[j].getAttribute("name")] = p[j].getAttribute("value");
+                                }
+                            }
+                            showExpressInstall(att, par, id, cb);
+                        }
+                        else { // Flash Player and SWF version mismatch or an older Webkit engine that ignores the HTML object element's nested param elements: display alternative content instead of SWF
+                            displayAltContent(obj);
+                            if (cb) { cb(cbObj); }
+                        }
+                    }
+                }
+                else {  // if no Flash Player is installed or the fp version cannot be detected we let the HTML object element do its job (either show a SWF or alternative content)
+                    setVisibility(id, true);
+                    if (cb) {
+                        var o = getObjectById(id); // test whether there is an HTML object element or not
+                        if (o && typeof o.SetVariable != UNDEF) { 
+                            cbObj.success = true;
+                            cbObj.ref = o;
+                        }
+                        cb(cbObj);
+                    }
+                }
+            }
+        }
+    }
+    
+    function getObjectById(objectIdStr) {
+        var r = null;
+        var o = getElementById(objectIdStr);
+        if (o && o.nodeName == "OBJECT") {
+            if (typeof o.SetVariable != UNDEF) {
+                r = o;
+            }
+            else {
+                var n = o.getElementsByTagName(OBJECT)[0];
+                if (n) {
+                    r = n;
+                }
+            }
+        }
+        return r;
+    }
+    
+    /* Requirements for Adobe Express Install
+        - only one instance can be active at a time
+        - fp 6.0.65 or higher
+        - Win/Mac OS only
+        - no Webkit engines older than version 312
+    */
+    function canExpressInstall() {
+        return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312);
+    }
+    
+    /* Show the Adobe Express Install dialog
+        - Reference: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75
+    */
+    function showExpressInstall(att, par, replaceElemIdStr, callbackFn) {
+        isExpressInstallActive = true;
+        storedCallbackFn = callbackFn || null;
+        storedCallbackObj = {success:false, id:replaceElemIdStr};
+        var obj = getElementById(replaceElemIdStr);
+        if (obj) {
+            if (obj.nodeName == "OBJECT") { // static publishing
+                storedAltContent = abstractAltContent(obj);
+                storedAltContentId = null;
+            }
+            else { // dynamic publishing
+                storedAltContent = obj;
+                storedAltContentId = replaceElemIdStr;
+            }
+            att.id = EXPRESS_INSTALL_ID;
+            if (typeof att.width == UNDEF || (!(/%$/).test(att.width) && parseInt(att.width, 10) < 310)) {
+                att.width = "310";
+            }
+            
+            if (typeof att.height == UNDEF || (!(/%$/).test(att.height) && parseInt(att.height, 10) < 137)) {
+                att.height = "137";
+            }
+            doc.title = doc.title.slice(0, 47) + " - Flash Player Installation";
+            var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn",
+                fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title;
+            if (typeof par.flashvars != UNDEF) {
+                par.flashvars += "&" + fv;
+            }
+            else {
+                par.flashvars = fv;
+            }
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            if (ua.ie && ua.win && obj.readyState != 4) {
+                var newObj = createElement("div");
+                replaceElemIdStr += "SWFObjectNew";
+                newObj.setAttribute("id", replaceElemIdStr);
+                obj.parentNode.insertBefore(newObj, obj); // insert placeholder div that will be replaced by the object element that loads expressinstall.swf
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        obj.parentNode.removeChild(obj);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            createSWF(att, par, replaceElemIdStr);
+        }
+    }
+    
+    /* Functions to abstract and display alternative content
+    */
+    function displayAltContent(obj) {
+        if (ua.ie && ua.win && obj.readyState != 4) {
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            var el = createElement("div");
+            obj.parentNode.insertBefore(el, obj); // insert placeholder div that will be replaced by the alternative content
+            el.parentNode.replaceChild(abstractAltContent(obj), el);
+            obj.style.display = "none";
+            (function(){
+                if (obj.readyState == 4) {
+                    obj.parentNode.removeChild(obj);
+                }
+                else {
+                    setTimeout(arguments.callee, 10);
+                }
+            })();
+        }
+        else {
+            obj.parentNode.replaceChild(abstractAltContent(obj), obj);
+        }
+    } 
+
+    function abstractAltContent(obj) {
+        var ac = createElement("div");
+        if (ua.win && ua.ie) {
+            ac.innerHTML = obj.innerHTML;
+        }
+        else {
+            var nestedObj = obj.getElementsByTagName(OBJECT)[0];
+            if (nestedObj) {
+                var c = nestedObj.childNodes;
+                if (c) {
+                    var cl = c.length;
+                    for (var i = 0; i < cl; i++) {
+                        if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) {
+                            ac.appendChild(c[i].cloneNode(true));
+                        }
+                    }
+                }
+            }
+        }
+        return ac;
+    }
+    
+    /* Cross-browser dynamic SWF creation
+    */
+    function createSWF(attObj, parObj, id) {
+        var r, el = getElementById(id);
+        if (ua.wk && ua.wk < 312) { return r; }
+        if (el) {
+            if (typeof attObj.id == UNDEF) { // if no 'id' is defined for the object element, it will inherit the 'id' from the alternative content
+                attObj.id = id;
+            }
+            if (ua.ie && ua.win) { // Internet Explorer + the HTML object element + W3C DOM methods do not combine: fall back to outerHTML
+                var att = "";
+                for (var i in attObj) {
+                    if (attObj[i] != Object.prototype[i]) { // filter out prototype additions from other potential libraries
+                        if (i.toLowerCase() == "data") {
+                            parObj.movie = attObj[i];
+                        }
+                        else if (i.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            att += ' class="' + attObj[i] + '"';
+                        }
+                        else if (i.toLowerCase() != "classid") {
+                            att += ' ' + i + '="' + attObj[i] + '"';
+                        }
+                    }
+                }
+                var par = "";
+                for (var j in parObj) {
+                    if (parObj[j] != Object.prototype[j]) { // filter out prototype additions from other potential libraries
+                        par += '<param name="' + j + '" value="' + parObj[j] + '" />';
+                    }
+                }
+                el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';
+                objIdArr[objIdArr.length] = attObj.id; // stored to fix object 'leaks' on unload (dynamic publishing only)
+                r = getElementById(attObj.id);  
+            }
+            else { // well-behaving browsers
+                var o = createElement(OBJECT);
+                o.setAttribute("type", FLASH_MIME_TYPE);
+                for (var m in attObj) {
+                    if (attObj[m] != Object.prototype[m]) { // filter out prototype additions from other potential libraries
+                        if (m.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            o.setAttribute("class", attObj[m]);
+                        }
+                        else if (m.toLowerCase() != "classid") { // filter out IE specific attribute
+                            o.setAttribute(m, attObj[m]);
+                        }
+                    }
+                }
+                for (var n in parObj) {
+                    if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { // filter out prototype additions from other potential libraries and IE specific param element
+                        createObjParam(o, n, parObj[n]);
+                    }
+                }
+                el.parentNode.replaceChild(o, el);
+                r = o;
+            }
+        }
+        return r;
+    }
+    
+    function createObjParam(el, pName, pValue) {
+        var p = createElement("param");
+        p.setAttribute("name", pName);  
+        p.setAttribute("value", pValue);
+        el.appendChild(p);
+    }
+    
+    /* Cross-browser SWF removal
+        - Especially needed to safely and completely remove a SWF in Internet Explorer
+    */
+    function removeSWF(id) {
+        var obj = getElementById(id);
+        if (obj && obj.nodeName == "OBJECT") {
+            if (ua.ie && ua.win) {
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        removeObjectInIE(id);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            else {
+                obj.parentNode.removeChild(obj);
+            }
+        }
+    }
+    
+    function removeObjectInIE(id) {
+        var obj = getElementById(id);
+        if (obj) {
+            for (var i in obj) {
+                if (typeof obj[i] == "function") {
+                    obj[i] = null;
+                }
+            }
+            obj.parentNode.removeChild(obj);
+        }
+    }
+    
+    /* Functions to optimize JavaScript compression
+    */
+    function getElementById(id) {
+        var el = null;
+        try {
+            el = doc.getElementById(id);
+        }
+        catch (e) {}
+        return el;
+    }
+    
+    function createElement(el) {
+        return doc.createElement(el);
+    }
+    
+    /* Updated attachEvent function for Internet Explorer
+        - Stores attachEvent information in an Array, so on unload the detachEvent functions can be called to avoid memory leaks
+    */  
+    function addListener(target, eventType, fn) {
+        target.attachEvent(eventType, fn);
+        listenersArr[listenersArr.length] = [target, eventType, fn];
+    }
+    
+    /* Flash Player and SWF content version matching
+    */
+    function hasPlayerVersion(rv) {
+        var pv = ua.pv, v = rv.split(".");
+        v[0] = parseInt(v[0], 10);
+        v[1] = parseInt(v[1], 10) || 0; // supports short notation, e.g. "9" instead of "9.0.0"
+        v[2] = parseInt(v[2], 10) || 0;
+        return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false;
+    }
+    
+    /* Cross-browser dynamic CSS creation
+        - Based on Bobby van der Sluis' solution: http://www.bobbyvandersluis.com/articles/dynamicCSS.php
+    */  
+    function createCSS(sel, decl, media, newStyle) {
+        if (ua.ie && ua.mac) { return; }
+        var h = doc.getElementsByTagName("head")[0];
+        if (!h) { return; } // to also support badly authored HTML pages that lack a head element
+        var m = (media && typeof media == "string") ? media : "screen";
+        if (newStyle) {
+            dynamicStylesheet = null;
+            dynamicStylesheetMedia = null;
+        }
+        if (!dynamicStylesheet || dynamicStylesheetMedia != m) { 
+            // create dynamic stylesheet + get a global reference to it
+            var s = createElement("style");
+            s.setAttribute("type", "text/css");
+            s.setAttribute("media", m);
+            dynamicStylesheet = h.appendChild(s);
+            if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) {
+                dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1];
+            }
+            dynamicStylesheetMedia = m;
+        }
+        // add style rule
+        if (ua.ie && ua.win) {
+            if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) {
+                dynamicStylesheet.addRule(sel, decl);
+            }
+        }
+        else {
+            if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) {
+                dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}"));
+            }
+        }
+    }
+    
+    function setVisibility(id, isVisible) {
+        if (!autoHideShow) { return; }
+        var v = isVisible ? "visible" : "hidden";
+        if (isDomLoaded && getElementById(id)) {
+            getElementById(id).style.visibility = v;
+        }
+        else {
+            createCSS("#" + id, "visibility:" + v);
+        }
+    }
+
+    /* Filter to avoid XSS attacks
+    */
+    function urlEncodeIfNecessary(s) {
+        var regex = /[\\\"<>\.;]/;
+        var hasBadChars = regex.exec(s) != null;
+        return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s;
+    }
+    
+    /* Release memory to avoid memory leaks caused by closures, fix hanging audio/video threads and force open sockets/NetConnections to disconnect (Internet Explorer only)
+    */
+    var cleanup = function() {
+        if (ua.ie && ua.win) {
+            window.attachEvent("onunload", function() {
+                // remove listeners to avoid memory leaks
+                var ll = listenersArr.length;
+                for (var i = 0; i < ll; i++) {
+                    listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]);
+                }
+                // cleanup dynamically embedded objects to fix audio/video threads and force open sockets and NetConnections to disconnect
+                var il = objIdArr.length;
+                for (var j = 0; j < il; j++) {
+                    removeSWF(objIdArr[j]);
+                }
+                // cleanup library's main closures to avoid memory leaks
+                for (var k in ua) {
+                    ua[k] = null;
+                }
+                ua = null;
+                for (var l in swfobject) {
+                    swfobject[l] = null;
+                }
+                swfobject = null;
+                window.detachEvent('onunload', arguments.callee);
+            });
+        }
+    }();
+    
+    return {
+        /* Public API
+            - Reference: http://code.google.com/p/swfobject/wiki/documentation
+        */ 
+        registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) {
+            if (ua.w3 && objectIdStr && swfVersionStr) {
+                var regObj = {};
+                regObj.id = objectIdStr;
+                regObj.swfVersion = swfVersionStr;
+                regObj.expressInstall = xiSwfUrlStr;
+                regObj.callbackFn = callbackFn;
+                regObjArr[regObjArr.length] = regObj;
+                setVisibility(objectIdStr, false);
+            }
+            else if (callbackFn) {
+                callbackFn({success:false, id:objectIdStr});
+            }
+        },
+        
+        getObjectById: function(objectIdStr) {
+            if (ua.w3) {
+                return getObjectById(objectIdStr);
+            }
+        },
+        
+        embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) {
+            var callbackObj = {success:false, id:replaceElemIdStr};
+            if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) {
+                setVisibility(replaceElemIdStr, false);
+                addDomLoadEvent(function() {
+                    widthStr += ""; // auto-convert to string
+                    heightStr += "";
+                    var att = {};
+                    if (attObj && typeof attObj === OBJECT) {
+                        for (var i in attObj) { // copy object to avoid the use of references, because web authors often reuse attObj for multiple SWFs
+                            att[i] = attObj[i];
+                        }
+                    }
+                    att.data = swfUrlStr;
+                    att.width = widthStr;
+                    att.height = heightStr;
+                    var par = {}; 
+                    if (parObj && typeof parObj === OBJECT) {
+                        for (var j in parObj) { // copy object to avoid the use of references, because web authors often reuse parObj for multiple SWFs
+                            par[j] = parObj[j];
+                        }
+                    }
+                    if (flashvarsObj && typeof flashvarsObj === OBJECT) {
+                        for (var k in flashvarsObj) { // copy object to avoid the use of references, because web authors often reuse flashvarsObj for multiple SWFs
+                            if (typeof par.flashvars != UNDEF) {
+                                par.flashvars += "&" + k + "=" + flashvarsObj[k];
+                            }
+                            else {
+                                par.flashvars = k + "=" + flashvarsObj[k];
+                            }
+                        }
+                    }
+                    if (hasPlayerVersion(swfVersionStr)) { // create SWF
+                        var obj = createSWF(att, par, replaceElemIdStr);
+                        if (att.id == replaceElemIdStr) {
+                            setVisibility(replaceElemIdStr, true);
+                        }
+                        callbackObj.success = true;
+                        callbackObj.ref = obj;
+                    }
+                    else if (xiSwfUrlStr && canExpressInstall()) { // show Adobe Express Install
+                        att.data = xiSwfUrlStr;
+                        showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+                        return;
+                    }
+                    else { // show alternative content
+                        setVisibility(replaceElemIdStr, true);
+                    }
+                    if (callbackFn) { callbackFn(callbackObj); }
+                });
+            }
+            else if (callbackFn) { callbackFn(callbackObj); }
+        },
+        
+        switchOffAutoHideShow: function() {
+            autoHideShow = false;
+        },
+        
+        ua: ua,
+        
+        getFlashPlayerVersion: function() {
+            return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] };
+        },
+        
+        hasFlashPlayerVersion: hasPlayerVersion,
+        
+        createSWF: function(attObj, parObj, replaceElemIdStr) {
+            if (ua.w3) {
+                return createSWF(attObj, parObj, replaceElemIdStr);
+            }
+            else {
+                return undefined;
+            }
+        },
+        
+        showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) {
+            if (ua.w3 && canExpressInstall()) {
+                showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+            }
+        },
+        
+        removeSWF: function(objElemIdStr) {
+            if (ua.w3) {
+                removeSWF(objElemIdStr);
+            }
+        },
+        
+        createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) {
+            if (ua.w3) {
+                createCSS(selStr, declStr, mediaStr, newStyleBoolean);
+            }
+        },
+        
+        addDomLoadEvent: addDomLoadEvent,
+        
+        addLoadEvent: addLoadEvent,
+        
+        getQueryParamValue: function(param) {
+            var q = doc.location.search || doc.location.hash;
+            if (q) {
+                if (/\?/.test(q)) { q = q.split("?")[1]; } // strip question mark
+                if (param == null) {
+                    return urlEncodeIfNecessary(q);
+                }
+                var pairs = q.split("&");
+                for (var i = 0; i < pairs.length; i++) {
+                    if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) {
+                        return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1)));
+                    }
+                }
+            }
+            return "";
+        },
+        
+        // For internal usage only
+        expressInstallCallback: function() {
+            if (isExpressInstallActive) {
+                var obj = getElementById(EXPRESS_INSTALL_ID);
+                if (obj && storedAltContent) {
+                    obj.parentNode.replaceChild(storedAltContent, obj);
+                    if (storedAltContentId) {
+                        setVisibility(storedAltContentId, true);
+                        if (ua.ie && ua.win) { storedAltContent.style.display = "block"; }
+                    }
+                    if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); }
+                }
+                isExpressInstallActive = false;
+            } 
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/FlashComponent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/FlashComponent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/FlashComponent.js	(revision 76)
@@ -0,0 +1,137 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.FlashComponent
+ * @extends Ext.BoxComponent
+ * @constructor
+ * @xtype flash
+ */
+Ext.FlashComponent = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} flashVersion
+     * Indicates the version the flash content was published for. Defaults to <tt>'9.0.115'</tt>.
+     */
+    flashVersion : '9.0.115',
+
+    /**
+     * @cfg {String} backgroundColor
+     * The background color of the chart. Defaults to <tt>'#ffffff'</tt>.
+     */
+    backgroundColor: '#ffffff',
+
+    /**
+     * @cfg {String} wmode
+     * The wmode of the flash object. This can be used to control layering. Defaults to <tt>'opaque'</tt>.
+     */
+    wmode: 'opaque',
+
+    /**
+     * @cfg {Object} flashVars
+     * A set of key value pairs to be passed to the flash object as flash variables. Defaults to <tt>undefined</tt>.
+     */
+    flashVars: undefined,
+
+    /**
+     * @cfg {Object} flashParams
+     * A set of key value pairs to be passed to the flash object as parameters. Possible parameters can be found here:
+     * http://kb2.adobe.com/cps/127/tn_12701.html Defaults to <tt>undefined</tt>.
+     */
+    flashParams: undefined,
+
+    /**
+     * @cfg {String} url
+     * The URL of the chart to include. Defaults to <tt>undefined</tt>.
+     */
+    url: undefined,
+    swfId : undefined,
+    swfWidth: '100%',
+    swfHeight: '100%',
+
+    /**
+     * @cfg {Boolean} expressInstall
+     * True to prompt the user to install flash if not installed. Note that this uses
+     * Ext.FlashComponent.EXPRESS_INSTALL_URL, which should be set to the local resource. Defaults to <tt>false</tt>.
+     */
+    expressInstall: false,
+
+    initComponent : function(){
+        Ext.FlashComponent.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event initialize
+             *
+             * @param {Chart} this
+             */
+            'initialize'
+        );
+    },
+
+    onRender : function(){
+        Ext.FlashComponent.superclass.onRender.apply(this, arguments);
+
+        var params = Ext.apply({
+            allowScriptAccess: 'always',
+            bgcolor: this.backgroundColor,
+            wmode: this.wmode
+        }, this.flashParams), vars = Ext.apply({
+            allowedDomain: document.location.hostname,
+            YUISwfId: this.getId(),
+            YUIBridgeCallback: 'Ext.FlashEventProxy.onEvent'
+        }, this.flashVars);
+
+        new swfobject.embedSWF(this.url, this.id, this.swfWidth, this.swfHeight, this.flashVersion,
+            this.expressInstall ? Ext.FlashComponent.EXPRESS_INSTALL_URL : undefined, vars, params);
+
+        this.swf = Ext.getDom(this.id);
+        this.el = Ext.get(this.swf);
+    },
+
+    getSwfId : function(){
+        return this.swfId || (this.swfId = "extswf" + (++Ext.Component.AUTO_ID));
+    },
+
+    getId : function(){
+        return this.id || (this.id = "extflashcmp" + (++Ext.Component.AUTO_ID));
+    },
+
+    onFlashEvent : function(e){
+        switch(e.type){
+            case "swfReady":
+                this.initSwf();
+                return;
+            case "log":
+                return;
+        }
+        e.component = this;
+        this.fireEvent(e.type.toLowerCase().replace(/event$/, ''), e);
+    },
+
+    initSwf : function(){
+        this.onSwfReady(!!this.isInitialized);
+        this.isInitialized = true;
+        this.fireEvent('initialize', this);
+    },
+
+    beforeDestroy: function(){
+        if(this.rendered){
+            swfobject.removeSWF(this.swf.id);
+        }
+        Ext.FlashComponent.superclass.beforeDestroy.call(this);
+    },
+
+    onSwfReady : Ext.emptyFn
+});
+
+/**
+ * Sets the url for installing flash if it doesn't exist. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.FlashComponent.EXPRESS_INSTALL_URL = 'http:/' + '/swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf';
+
+Ext.reg('flash', Ext.FlashComponent);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/Chart.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/Chart.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/Chart.js	(revision 76)
@@ -0,0 +1,1002 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.chart.Chart
+ * @extends Ext.FlashComponent
+ * The Ext.chart package provides the capability to visualize data with flash based charting.
+ * Each chart binds directly to an Ext.data.Store enabling automatic updates of the chart.
+ * To change the look and feel of a chart, see the {@link #chartStyle} and {@link #extraStyle} config options.
+ * @constructor
+ * @xtype chart
+ */
+
+ Ext.chart.Chart = Ext.extend(Ext.FlashComponent, {
+    refreshBuffer: 100,
+
+    /**
+     * @cfg {String} backgroundColor
+     * @hide
+     */
+
+    /**
+     * @cfg {Object} chartStyle
+     * Sets styles for this chart. This contains default styling, so modifying this property will <b>override</b>
+     * the built in styles of the chart. Use {@link #extraStyle} to add customizations to the default styling.
+     */
+    chartStyle: {
+        padding: 10,
+        animationEnabled: true,
+        font: {
+            name: 'Tahoma',
+            color: 0x444444,
+            size: 11
+        },
+        dataTip: {
+            padding: 5,
+            border: {
+                color: 0x99bbe8,
+                size:1
+            },
+            background: {
+                color: 0xDAE7F6,
+                alpha: .9
+            },
+            font: {
+                name: 'Tahoma',
+                color: 0x15428B,
+                size: 10,
+                bold: true
+            }
+        }
+    },
+
+    /**
+     * @cfg {String} url
+     * The url to load the chart from. This defaults to Ext.chart.Chart.CHART_URL, which should
+     * be modified to point to the local charts resource.
+     */
+
+    /**
+     * @cfg {Object} extraStyle
+     * Contains extra styles that will be added or overwritten to the default chartStyle. Defaults to <tt>null</tt>.
+     * For a detailed list of the options available, visit the YUI Charts site
+     * at <a href="http://developer.yahoo.com/yui/charts/#basicstyles">http://developer.yahoo.com/yui/charts/#basicstyles</a><br/>
+     * Some of the options availabe:<br />
+     * <ul style="padding:5px;padding-left:16px;list-style-type:inherit;">
+     * <li><b>padding</b> - The space around the edge of the chart's contents. Padding does not increase the size of the chart.</li>
+     * <li><b>animationEnabled</b> - A Boolean value that specifies whether marker animations are enabled or not. Enabled by default.</li>
+     * <li><b>font</b> - An Object defining the font style to be used in the chart. Defaults to <tt>{ name: 'Tahoma', color: 0x444444, size: 11 }</tt><br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>name</b> - font name</li>
+     *      <li><b>color</b> - font color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - font size in points (numeric portion only, ie: 11)</li>
+     *      <li><b>bold</b> - boolean</li>
+     *      <li><b>italic</b> - boolean</li>
+     *      <li><b>underline</b> - boolean</li>
+     *  </ul>
+     * </li>
+     * <li><b>border</b> - An object defining the border style around the chart. The chart itself will decrease in dimensions to accomodate the border.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - border size in pixels (numeric portion only, ie: 1)</li>
+     *  </ul>
+     * </li>
+     * <li><b>background</b> - An object defining the background style of the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>image</b> - an image URL. May be relative to the current document or absolute.</li>
+     *  </ul>
+     * </li>
+     * <li><b>legend</b> - An object defining the legend style<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>display</b> - location of the legend. Possible values are "none", "left", "right", "top", and "bottom".</li>
+     *      <li><b>spacing</b> - an image URL. May be relative to the current document or absolute.</li>
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>dataTip</b> - An object defining the style of the data tip (tooltip).<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>xAxis and yAxis</b> - An object defining the style of the style of either axis.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - same option as described above.</li>
+     *      <li><b>size</b> - same option as described above.</li>
+     *      <li><b>showLabels</b> - boolean</li>
+     *      <li><b>labelRotation</b> - a value in degrees from -90 through 90. Default is zero.</li>
+     *  </ul></li>
+     * <li><b>majorGridLines and minorGridLines</b> - An object defining the style of the style of the grid lines.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>zeroGridLine</b> - An object defining the style of the style of the zero grid line.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>majorTicks and minorTicks</b> - An object defining the style of the style of ticks in the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *      <li><b>length</b> - the length of each tick in pixels extending from the axis.</li>
+     *      <li><b>display</b> - how the ticks are drawn. Possible values are "none", "inside", "outside", and "cross".</li>
+     *  </ul></li></li>
+     * </ul>
+     */
+    extraStyle: null,
+
+    /**
+     * @cfg {Object} seriesStyles
+     * Contains styles to apply to the series after a refresh. Defaults to <tt>null</tt>.
+     */
+    seriesStyles: null,
+
+    /**
+     * @cfg {Boolean} disableCaching
+     * True to add a "cache buster" to the end of the chart url. Defaults to true for Opera and IE.
+     */
+    disableCaching: Ext.isIE || Ext.isOpera,
+    disableCacheParam: '_dc',
+
+    initComponent : function(){
+        Ext.chart.Chart.superclass.initComponent.call(this);
+        if(!this.url){
+            this.url = Ext.chart.Chart.CHART_URL;
+        }
+        if(this.disableCaching){
+            this.url = Ext.urlAppend(this.url, String.format('{0}={1}', this.disableCacheParam, new Date().getTime()));
+        }
+        this.addEvents(
+            'itemmouseover',
+            'itemmouseout',
+            'itemclick',
+            'itemdoubleclick',
+            'itemdragstart',
+            'itemdrag',
+            'itemdragend',
+            /**
+             * @event beforerefresh
+             * Fires before a refresh to the chart data is called.  If the beforerefresh handler returns
+             * <tt>false</tt> the {@link #refresh} action will be cancelled.
+             * @param {Chart} this
+             */
+            'beforerefresh',
+            /**
+             * @event refresh
+             * Fires after the chart data has been refreshed.
+             * @param {Chart} this
+             */
+            'refresh'
+        );
+        this.store = Ext.StoreMgr.lookup(this.store);
+    },
+
+    /**
+     * Sets a single style value on the Chart instance.
+     *
+     * @param name {String} Name of the Chart style value to change.
+     * @param value {Object} New value to pass to the Chart style.
+     */
+     setStyle: function(name, value){
+         this.swf.setStyle(name, Ext.encode(value));
+     },
+
+    /**
+     * Resets all styles on the Chart instance.
+     *
+     * @param styles {Object} Initializer for all Chart styles.
+     */
+    setStyles: function(styles){
+        this.swf.setStyles(Ext.encode(styles));
+    },
+
+    /**
+     * Sets the styles on all series in the Chart.
+     *
+     * @param styles {Array} Initializer for all Chart series styles.
+     */
+    setSeriesStyles: function(styles){
+        this.seriesStyles = styles;
+        var s = [];
+        Ext.each(styles, function(style){
+            s.push(Ext.encode(style));
+        });
+        this.swf.setSeriesStyles(s);
+    },
+
+    setCategoryNames : function(names){
+        this.swf.setCategoryNames(names);
+    },
+
+    setLegendRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.legendFnName);
+        chart.legendFnName = chart.createFnProxy(function(name){
+            return fn.call(scope, name);
+        });
+        chart.swf.setLegendLabelFunction(chart.legendFnName);
+    },
+
+    setTipRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.tipFnName);
+        chart.tipFnName = chart.createFnProxy(function(item, index, series){
+            var record = chart.store.getAt(index);
+            return fn.call(scope, chart, record, index, series);
+        });
+        chart.swf.setDataTipFunction(chart.tipFnName);
+    },
+
+    setSeries : function(series){
+        this.series = series;
+        this.refresh();
+    },
+
+    /**
+     * Changes the data store bound to this chart and refreshes it.
+     * @param {Store} store The store to bind to this chart
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("datachanged", this.refresh, this);
+                this.store.un("add", this.delayRefresh, this);
+                this.store.un("remove", this.delayRefresh, this);
+                this.store.un("update", this.delayRefresh, this);
+                this.store.un("clear", this.refresh, this);
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                datachanged: this.refresh,
+                add: this.delayRefresh,
+                remove: this.delayRefresh,
+                update: this.delayRefresh,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store && !initial){
+            this.refresh();
+        }
+    },
+
+    onSwfReady : function(isReset){
+        Ext.chart.Chart.superclass.onSwfReady.call(this, isReset);
+        var ref;
+        this.swf.setType(this.type);
+
+        if(this.chartStyle){
+            this.setStyles(Ext.apply({}, this.extraStyle, this.chartStyle));
+        }
+
+        if(this.categoryNames){
+            this.setCategoryNames(this.categoryNames);
+        }
+
+        if(this.tipRenderer){
+            ref = this.getFunctionRef(this.tipRenderer);
+            this.setTipRenderer(ref.fn, ref.scope);
+        }
+        if(this.legendRenderer){
+            ref = this.getFunctionRef(this.legendRenderer);
+            this.setLegendRenderer(ref.fn, ref.scope);
+        }
+        if(!isReset){
+            this.bindStore(this.store, true);
+        }
+        this.refresh.defer(10, this);
+    },
+
+    delayRefresh : function(){
+        if(!this.refreshTask){
+            this.refreshTask = new Ext.util.DelayedTask(this.refresh, this);
+        }
+        this.refreshTask.delay(this.refreshBuffer);
+    },
+
+    refresh : function(){
+        if(this.fireEvent('beforerefresh', this) !== false){
+            var styleChanged = false;
+            // convert the store data into something YUI charts can understand
+            var data = [], rs = this.store.data.items;
+            for(var j = 0, len = rs.length; j < len; j++){
+                data[j] = rs[j].data;
+            }
+            //make a copy of the series definitions so that we aren't
+            //editing them directly.
+            var dataProvider = [];
+            var seriesCount = 0;
+            var currentSeries = null;
+            var i = 0;
+            if(this.series){
+                seriesCount = this.series.length;
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = this.series[i];
+                    var clonedSeries = {};
+                    for(var prop in currentSeries){
+                        if(prop == "style" && currentSeries.style !== null){
+                            clonedSeries.style = Ext.encode(currentSeries.style);
+                            styleChanged = true;
+                            //we don't want to modify the styles again next time
+                            //so null out the style property.
+                            // this causes issues
+                            // currentSeries.style = null;
+                        } else{
+                            clonedSeries[prop] = currentSeries[prop];
+                        }
+                    }
+                    dataProvider.push(clonedSeries);
+                }
+            }
+
+            if(seriesCount > 0){
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = dataProvider[i];
+                    if(!currentSeries.type){
+                        currentSeries.type = this.type;
+                    }
+                    currentSeries.dataProvider = data;
+                }
+            } else{
+                dataProvider.push({type: this.type, dataProvider: data});
+            }
+            this.swf.setDataProvider(dataProvider);
+            if(this.seriesStyles){
+                this.setSeriesStyles(this.seriesStyles);
+            }
+            this.fireEvent('refresh', this);
+        }
+    },
+
+    // private
+    createFnProxy : function(fn){
+        var fnName = 'extFnProxy' + (++Ext.chart.Chart.PROXY_FN_ID);
+        Ext.chart.Chart.proxyFunction[fnName] = fn;
+        return 'Ext.chart.Chart.proxyFunction.' + fnName;
+    },
+
+    // private
+    removeFnProxy : function(fn){
+        if(!Ext.isEmpty(fn)){
+            fn = fn.replace('Ext.chart.Chart.proxyFunction.', '');
+            delete Ext.chart.Chart.proxyFunction[fn];
+        }
+    },
+
+    // private
+    getFunctionRef : function(val){
+        if(Ext.isFunction(val)){
+            return {
+                fn: val,
+                scope: this
+            };
+        }else{
+            return {
+                fn: val.fn,
+                scope: val.scope || this
+            };
+        }
+    },
+
+    // private
+    onDestroy: function(){
+        if (this.refreshTask && this.refreshTask.cancel){
+            this.refreshTask.cancel();
+        }
+        Ext.chart.Chart.superclass.onDestroy.call(this);
+        this.bindStore(null);
+        this.removeFnProxy(this.tipFnName);
+        this.removeFnProxy(this.legendFnName);
+    }
+});
+Ext.reg('chart', Ext.chart.Chart);
+Ext.chart.Chart.PROXY_FN_ID = 0;
+Ext.chart.Chart.proxyFunction = {};
+
+/**
+ * Sets the url to load the chart from. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf';
+
+/**
+ * @class Ext.chart.PieChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype piechart
+ */
+Ext.chart.PieChart = Ext.extend(Ext.chart.Chart, {
+    type: 'pie',
+
+    onSwfReady : function(isReset){
+        Ext.chart.PieChart.superclass.onSwfReady.call(this, isReset);
+
+        this.setDataField(this.dataField);
+        this.setCategoryField(this.categoryField);
+    },
+
+    setDataField : function(field){
+        this.dataField = field;
+        this.swf.setDataField(field);
+    },
+
+    setCategoryField : function(field){
+        this.categoryField = field;
+        this.swf.setCategoryField(field);
+    }
+});
+Ext.reg('piechart', Ext.chart.PieChart);
+
+/**
+ * @class Ext.chart.CartesianChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype cartesianchart
+ */
+Ext.chart.CartesianChart = Ext.extend(Ext.chart.Chart, {
+    onSwfReady : function(isReset){
+        Ext.chart.CartesianChart.superclass.onSwfReady.call(this, isReset);
+        this.labelFn = [];
+        if(this.xField){
+            this.setXField(this.xField);
+        }
+        if(this.yField){
+            this.setYField(this.yField);
+        }
+        if(this.xAxis){
+            this.setXAxis(this.xAxis);
+        }
+        if(this.xAxes){
+            this.setXAxes(this.xAxes);
+        }
+        if(this.yAxis){
+            this.setYAxis(this.yAxis);
+        }
+        if(this.yAxes){
+            this.setYAxes(this.yAxes);
+        }
+        if(Ext.isDefined(this.constrainViewport)){
+            this.swf.setConstrainViewport(this.constrainViewport);
+        }
+    },
+
+    setXField : function(value){
+        this.xField = value;
+        this.swf.setHorizontalField(value);
+    },
+
+    setYField : function(value){
+        this.yField = value;
+        this.swf.setVerticalField(value);
+    },
+
+    setXAxis : function(value){
+        this.xAxis = this.createAxis('xAxis', value);
+        this.swf.setHorizontalAxis(this.xAxis);
+    },
+
+    setXAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('xAxis' + i, value[i]);
+            this.swf.setHorizontalAxis(axis);
+        }
+    },
+
+    setYAxis : function(value){
+        this.yAxis = this.createAxis('yAxis', value);
+        this.swf.setVerticalAxis(this.yAxis);
+    },
+
+    setYAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('yAxis' + i, value[i]);
+            this.swf.setVerticalAxis(axis);
+        }
+    },
+
+    createAxis : function(axis, value){
+        var o = Ext.apply({}, value),
+            ref,
+            old;
+
+        if(this[axis]){
+            old = this[axis].labelFunction;
+            this.removeFnProxy(old);
+            this.labelFn.remove(old);
+        }
+        if(o.labelRenderer){
+            ref = this.getFunctionRef(o.labelRenderer);
+            o.labelFunction = this.createFnProxy(function(v){
+                return ref.fn.call(ref.scope, v);
+            });
+            delete o.labelRenderer;
+            this.labelFn.push(o.labelFunction);
+        }
+        if(axis.indexOf('xAxis') > -1 && o.position == 'left'){
+            o.position = 'bottom';
+        }
+        return o;
+    },
+
+    onDestroy : function(){
+        Ext.chart.CartesianChart.superclass.onDestroy.call(this);
+        Ext.each(this.labelFn, function(fn){
+            this.removeFnProxy(fn);
+        }, this);
+    }
+});
+Ext.reg('cartesianchart', Ext.chart.CartesianChart);
+
+/**
+ * @class Ext.chart.LineChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype linechart
+ */
+Ext.chart.LineChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'line'
+});
+Ext.reg('linechart', Ext.chart.LineChart);
+
+/**
+ * @class Ext.chart.ColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype columnchart
+ */
+Ext.chart.ColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'column'
+});
+Ext.reg('columnchart', Ext.chart.ColumnChart);
+
+/**
+ * @class Ext.chart.StackedColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedcolumnchart
+ */
+Ext.chart.StackedColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackcolumn'
+});
+Ext.reg('stackedcolumnchart', Ext.chart.StackedColumnChart);
+
+/**
+ * @class Ext.chart.BarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype barchart
+ */
+Ext.chart.BarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'bar'
+});
+Ext.reg('barchart', Ext.chart.BarChart);
+
+/**
+ * @class Ext.chart.StackedBarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedbarchart
+ */
+Ext.chart.StackedBarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackbar'
+});
+Ext.reg('stackedbarchart', Ext.chart.StackedBarChart);
+
+
+
+/**
+ * @class Ext.chart.Axis
+ * Defines a CartesianChart's vertical or horizontal axis.
+ * @constructor
+ */
+Ext.chart.Axis = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.chart.Axis.prototype =
+{
+    /**
+     * The type of axis.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The direction in which the axis is drawn. May be "horizontal" or "vertical".
+     *
+     * @property orientation
+     * @type String
+     */
+    orientation: "horizontal",
+
+    /**
+     * If true, the items on the axis will be drawn in opposite direction.
+     *
+     * @property reverse
+     * @type Boolean
+     */
+    reverse: false,
+
+    /**
+     * A string reference to the globally-accessible function that may be called to
+     * determine each of the label values for this axis.
+     *
+     * @property labelFunction
+     * @type String
+     */
+    labelFunction: null,
+
+    /**
+     * If true, labels that overlap previously drawn labels on the axis will be hidden.
+     *
+     * @property hideOverlappingLabels
+     * @type Boolean
+     */
+    hideOverlappingLabels: true,
+
+    /**
+     * The space, in pixels, between labels on an axis.
+     *
+     * @property labelSpacing
+     * @type Number
+     */
+    labelSpacing: 2
+};
+
+/**
+ * @class Ext.chart.NumericAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in numeric values.
+ * @constructor
+ */
+Ext.chart.NumericAxis = Ext.extend(Ext.chart.Axis, {
+    type: "numeric",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Number
+     */
+    minimum: NaN,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: NaN,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property minorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * If true, and the bounds are calculated automatically, either the minimum
+     * or maximum will be set to zero.
+     *
+     * @property alwaysShowZero
+     * @type Boolean
+     */
+    alwaysShowZero: true,
+
+    /**
+     * The scaling algorithm to use on this axis. May be "linear" or
+     * "logarithmic".
+     *
+     * @property scale
+     * @type String
+     */
+    scale: "linear",
+
+    /**
+     * Indicates whether to round the major unit.
+     *
+     * @property roundMajorUnit
+     * @type Boolean
+     */
+    roundMajorUnit: true,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true,
+
+    /**
+     * Indicates the position of the axis relative to the chart
+     *
+     * @property position
+     * @type String
+     */
+    position: 'left',
+
+    /**
+     * Indicates whether to extend maximum beyond data's maximum to the nearest
+     * majorUnit.
+     *
+     * @property adjustMaximumByMajorUnit
+     * @type Boolean
+     */
+    adjustMaximumByMajorUnit: true,
+
+    /**
+     * Indicates whether to extend the minimum beyond data's minimum to the
+     * nearest majorUnit.
+     *
+     * @property adjustMinimumByMajorUnit
+     * @type Boolean
+     */
+    adjustMinimumByMajorUnit: true
+
+});
+
+/**
+ * @class Ext.chart.TimeAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in time-based values.
+ * @constructor
+ */
+Ext.chart.TimeAxis = Ext.extend(Ext.chart.Axis, {
+    type: "time",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Date
+     */
+    minimum: null,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: null,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The time unit used by the majorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    majorTimeUnit: null,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * The time unit used by the minorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    minorTimeUnit: null,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * Series that are stackable will only stack when this value is set to true.
+     *
+     * @property stackingEnabled
+     * @type Boolean
+     */
+    stackingEnabled: false,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true
+
+});
+
+/**
+ * @class Ext.chart.CategoryAxis
+ * @extends Ext.chart.Axis
+ * A type of axis that displays items in categories.
+ * @constructor
+ */
+Ext.chart.CategoryAxis = Ext.extend(Ext.chart.Axis, {
+    type: "category",
+
+    /**
+     * A list of category names to display along this axis.
+     *
+     * @property categoryNames
+     * @type Array
+     */
+    categoryNames: null,
+
+    /**
+     * Indicates whether or not to calculate the number of categories (ticks and
+     * labels) when there is not enough room to display all labels on the axis.
+     * If set to true, the axis will determine the number of categories to plot.
+     * If not, all categories will be plotted.
+     *
+     * @property calculateCategoryCount
+     * @type Boolean
+     */
+    calculateCategoryCount: false
+
+});
+
+/**
+ * @class Ext.chart.Series
+ * Series class for the charts widget.
+ * @constructor
+ */
+Ext.chart.Series = function(config) { Ext.apply(this, config); };
+
+Ext.chart.Series.prototype =
+{
+    /**
+     * The type of series.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The human-readable name of the series.
+     *
+     * @property displayName
+     * @type String
+     */
+    displayName: null
+};
+
+/**
+ * @class Ext.chart.CartesianSeries
+ * @extends Ext.chart.Series
+ * CartesianSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.CartesianSeries = Ext.extend(Ext.chart.Series, {
+    /**
+     * The field used to access the x-axis value from the items from the data
+     * source.
+     *
+     * @property xField
+     * @type String
+     */
+    xField: null,
+
+    /**
+     * The field used to access the y-axis value from the items from the data
+     * source.
+     *
+     * @property yField
+     * @type String
+     */
+    yField: null,
+
+    /**
+     * False to not show this series in the legend. Defaults to <tt>true</tt>.
+     *
+     * @property showInLegend
+     * @type Boolean
+     */
+    showInLegend: true,
+
+    /**
+     * Indicates which axis the series will bind to
+     *
+     * @property axis
+     * @type String
+     */
+    axis: 'primary'
+});
+
+/**
+ * @class Ext.chart.ColumnSeries
+ * @extends Ext.chart.CartesianSeries
+ * ColumnSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.ColumnSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "column"
+});
+
+/**
+ * @class Ext.chart.LineSeries
+ * @extends Ext.chart.CartesianSeries
+ * LineSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.LineSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "line"
+});
+
+/**
+ * @class Ext.chart.BarSeries
+ * @extends Ext.chart.CartesianSeries
+ * BarSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.BarSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "bar"
+});
+
+
+/**
+ * @class Ext.chart.PieSeries
+ * @extends Ext.chart.Series
+ * PieSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.PieSeries = Ext.extend(Ext.chart.Series, {
+    type: "pie",
+    dataField: null,
+    categoryField: null
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/EventProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/EventProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/chart/EventProxy.js	(revision 76)
@@ -0,0 +1,20 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.FlashProxy
+ * @singleton
+ */
+Ext.FlashEventProxy = {
+    onEvent : function(id, e){
+        var fp = Ext.getCmp(id);
+        if(fp){
+            fp.onFlashEvent(e);
+        }else{
+            arguments.callee.defer(10, this, [id, e]);
+        }
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitButton.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitButton.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/SplitButton.js	(revision 76)
@@ -0,0 +1,126 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.SplitButton
+ * @extends Ext.Button
+ * A split button that provides a built-in dropdown arrow that can fire an event separately from the default
+ * click event of the button.  Typically this would be used to display a dropdown menu that provides additional
+ * options to the primary button action, but any custom handler can provide the arrowclick implementation.  Example usage:
+ * <pre><code>
+// display a dropdown menu:
+new Ext.SplitButton({
+	renderTo: 'button-ct', // the container id
+   	text: 'Options',
+   	handler: optionsHandler, // handle a click on the button itself
+   	menu: new Ext.menu.Menu({
+        items: [
+        	// these items will render as dropdown menu items when the arrow is clicked:
+	        {text: 'Item 1', handler: item1Handler},
+	        {text: 'Item 2', handler: item2Handler}
+        ]
+   	})
+});
+
+// Instead of showing a menu, you provide any type of custom
+// functionality you want when the dropdown arrow is clicked:
+new Ext.SplitButton({
+	renderTo: 'button-ct',
+   	text: 'Options',
+   	handler: optionsHandler,
+   	arrowHandler: myCustomHandler
+});
+</code></pre>
+ * @cfg {Function} arrowHandler A function called when the arrow button is clicked (can be used instead of click event)
+ * @cfg {String} arrowTooltip The title attribute of the arrow
+ * @constructor
+ * Create a new menu button
+ * @param {Object} config The config object
+ * @xtype splitbutton
+ */
+Ext.SplitButton = Ext.extend(Ext.Button, {
+	// private
+    arrowSelector : 'em',
+    split: true,
+
+    // private
+    initComponent : function(){
+        Ext.SplitButton.superclass.initComponent.call(this);
+        /**
+         * @event arrowclick
+         * Fires when this button's arrow is clicked
+         * @param {MenuButton} this
+         * @param {EventObject} e The click event
+         */
+        this.addEvents("arrowclick");
+    },
+
+    // private
+    onRender : function(){
+        Ext.SplitButton.superclass.onRender.apply(this, arguments);
+        if(this.arrowTooltip){
+            this.el.child(this.arrowSelector).dom[this.tooltipType] = this.arrowTooltip;
+        }
+    },
+
+    /**
+     * Sets this button's arrow click handler.
+     * @param {Function} handler The function to call when the arrow is clicked
+     * @param {Object} scope (optional) Scope for the function passed above
+     */
+    setArrowHandler : function(handler, scope){
+        this.arrowHandler = handler;
+        this.scope = scope;
+    },
+
+    getMenuClass : function(){
+        return 'x-btn-split' + (this.arrowAlign == 'bottom' ? '-bottom' : '');
+    },
+
+    isClickOnArrow : function(e){
+	if (this.arrowAlign != 'bottom') {
+	    var visBtn = this.el.child('em.x-btn-split');
+	    var right = visBtn.getRegion().right - visBtn.getPadding('r');
+	    return e.getPageX() > right;
+	} else {
+	    return e.getPageY() > this.btnEl.getRegion().bottom;
+	}
+    },
+
+    // private
+    onClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            if(this.isClickOnArrow(e)){
+                if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){
+                    this.showMenu();
+                }
+                this.fireEvent("arrowclick", this, e);
+                if(this.arrowHandler){
+                    this.arrowHandler.call(this.scope || this, this, e);
+                }
+            }else{
+                this.doToggle();
+                this.fireEvent("click", this, e);
+                if(this.handler){
+                    this.handler.call(this.scope || this, this, e);
+                }
+            }
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e){
+        return this.menu && e.target.tagName == this.arrowSelector;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && e.target.tagName != this.arrowSelector;
+    }
+});
+
+Ext.reg('splitbutton', Ext.SplitButton);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Menu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Menu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Menu.js	(revision 76)
@@ -0,0 +1,720 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.Menu
+ * @extends Ext.Container
+ * <p>A menu object.  This is the container to which you may add menu items.  Menu can also serve as a base class
+ * when you want a specialized menu based off of another component (like {@link Ext.menu.DateMenu} for example).</p>
+ * <p>Menus may contain either {@link Ext.menu.Item menu items}, or general {@link Ext.Component Component}s.</p>
+ * <p>To make a contained general {@link Ext.Component Component} line up with other {@link Ext.menu.Item menu items}
+ * specify <tt>iconCls: 'no-icon'</tt>.  This reserves a space for an icon, and indents the Component in line
+ * with the other menu items.  See {@link Ext.form.ComboBox}.{@link Ext.form.ComboBox#getListParent getListParent}
+ * for an example.</p>
+ * <p>By default, Menus are absolutely positioned, floating Components. By configuring a Menu with
+ * <b><tt>{@link #floating}:false</tt></b>, a Menu may be used as child of a Container.</p>
+ *
+ * @xtype menu
+ */
+Ext.menu.Menu = Ext.extend(Ext.Container, {
+    /**
+     * @cfg {Object} defaults
+     * A config object that will be applied to all items added to this container either via the {@link #items}
+     * config or via the {@link #add} method.  The defaults config can contain any number of
+     * name/value property pairs to be added to each item, and should be valid for the types of items
+     * being added to the menu.
+     */
+    /**
+     * @cfg {Mixed} items
+     * An array of items to be added to this menu. Menus may contain either {@link Ext.menu.Item menu items},
+     * or general {@link Ext.Component Component}s.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the menu in pixels (defaults to 120)
+     */
+    minWidth : 120,
+    /**
+     * @cfg {Boolean/String} shadow True or 'sides' for the default effect, 'frame' for 4-way shadow, and 'drop'
+     * for bottom-right shadow (defaults to 'sides')
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String} subMenuAlign The {@link Ext.Element#alignTo} anchor position value to use for submenus of
+     * this menu (defaults to 'tl-tr?')
+     */
+    subMenuAlign : 'tl-tr?',
+    /**
+     * @cfg {String} defaultAlign The default {@link Ext.Element#alignTo} anchor position value for this menu
+     * relative to its element of origin (defaults to 'tl-bl?')
+     */
+    defaultAlign : 'tl-bl?',
+    /**
+     * @cfg {Boolean} allowOtherMenus True to allow multiple menus to be displayed at the same time (defaults to false)
+     */
+    allowOtherMenus : false,
+    /**
+     * @cfg {Boolean} ignoreParentClicks True to ignore clicks on any item in this menu that is a parent item (displays
+     * a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false).
+     */
+    ignoreParentClicks : false,
+    /**
+     * @cfg {Boolean} enableScrolling True to allow the menu container to have scroller controls if the menu is too long (defaults to true).
+     */
+    enableScrolling : true,
+    /**
+     * @cfg {Number} maxHeight The maximum height of the menu. Only applies when enableScrolling is set to True (defaults to null).
+     */
+    maxHeight : null,
+    /**
+     * @cfg {Number} scrollIncrement The amount to scroll the menu. Only applies when enableScrolling is set to True (defaults to 24).
+     */
+    scrollIncrement : 24,
+    /**
+     * @cfg {Boolean} showSeparator True to show the icon separator. (defaults to true).
+     */
+    showSeparator : true,
+    /**
+     * @cfg {Array} defaultOffsets An array specifying the [x, y] offset in pixels by which to
+     * change the default Menu popup position after aligning according to the {@link #defaultAlign}
+     * configuration. Defaults to <tt>[0, 0]</tt>.
+     */
+    defaultOffsets : [0, 0],
+
+    /**
+     * @cfg {Boolean} plain
+     * True to remove the incised line down the left side of the menu. Defaults to <tt>false</tt>.
+     */
+    plain : false,
+
+    /**
+     * @cfg {Boolean} floating
+     * <p>By default, a Menu configured as <b><code>floating:true</code></b>
+     * will be rendered as an {@link Ext.Layer} (an absolutely positioned,
+     * floating Component with zindex=15000).
+     * If configured as <b><code>floating:false</code></b>, the Menu may be
+     * used as child item of another Container instead of a free-floating
+     * {@link Ext.Layer Layer}.
+     */
+    floating : true,
+
+
+    /**
+     * @cfg {Number} zIndex
+     * zIndex to use when the menu is floating.
+     */
+    zIndex: 15000,
+
+    // private
+    hidden : true,
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>menu</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout is required.
+     * See {@link Ext.Container#layout} for additional information.
+     */
+    layout : 'menu',
+    hideMode : 'offsets',    // Important for laying out Components
+    scrollerHeight : 8,
+    autoLayout : true,       // Provided for backwards compat
+    defaultType : 'menuitem',
+    bufferResize : false,
+
+    initComponent : function(){
+        if(Ext.isArray(this.initialConfig)){
+            Ext.apply(this, {items:this.initialConfig});
+        }
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this menu is clicked (or when the enter key is pressed while it is active)
+             * @param {Ext.menu.Menu} this
+            * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event mouseover
+             * Fires when the mouse is hovering over this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseout',
+            /**
+             * @event itemclick
+             * Fires when a menu item contained in this menu is clicked
+             * @param {Ext.menu.BaseItem} baseItem The BaseItem that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'itemclick'
+        );
+        Ext.menu.MenuMgr.register(this);
+        if(this.floating){
+            Ext.EventManager.onWindowResize(this.hide, this);
+        }else{
+            if(this.initialConfig.hidden !== false){
+                this.hidden = false;
+            }
+            this.internalDefaults = {hideOnClick: false};
+        }
+        Ext.menu.Menu.superclass.initComponent.call(this);
+        if(this.autoLayout){
+            var fn = this.doLayout.createDelegate(this, []);
+            this.on({
+                add: fn,
+                remove: fn
+            });
+        }
+    },
+
+    //private
+    getLayoutTarget : function() {
+        return this.ul;
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!ct){
+            ct = Ext.getBody();
+        }
+
+        var dh = {
+            id: this.getId(),
+            cls: 'x-menu ' + ((this.floating) ? 'x-menu-floating x-layer ' : '') + (this.cls || '') + (this.plain ? ' x-menu-plain' : '') + (this.showSeparator ? '' : ' x-menu-nosep'),
+            style: this.style,
+            cn: [
+                {tag: 'a', cls: 'x-menu-focus', href: '#', onclick: 'return false;', tabIndex: '-1'},
+                {tag: 'ul', cls: 'x-menu-list'}
+            ]
+        };
+        if(this.floating){
+            this.el = new Ext.Layer({
+                shadow: this.shadow,
+                dh: dh,
+                constrain: false,
+                parentEl: ct,
+                zindex: this.zIndex
+            });
+        }else{
+            this.el = ct.createChild(dh);
+        }
+        Ext.menu.Menu.superclass.onRender.call(this, ct, position);
+
+        if(!this.keyNav){
+            this.keyNav = new Ext.menu.MenuNav(this);
+        }
+        // generic focus element
+        this.focusEl = this.el.child('a.x-menu-focus');
+        this.ul = this.el.child('ul.x-menu-list');
+        this.mon(this.ul, {
+            scope: this,
+            click: this.onClick,
+            mouseover: this.onMouseOver,
+            mouseout: this.onMouseOut
+        });
+        if(this.enableScrolling){
+            this.mon(this.el, {
+                scope: this,
+                delegate: '.x-menu-scroller',
+                click: this.onScroll,
+                mouseover: this.deactivateActive
+            });
+        }
+    },
+
+    // private
+    findTargetItem : function(e){
+        var t = e.getTarget('.x-menu-list-item', this.ul, true);
+        if(t && t.menuItemId){
+            return this.items.get(t.menuItemId);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.isFormField){
+                this.setActiveItem(t);
+            }else if(t instanceof Ext.menu.BaseItem){
+                if(t.menu && this.ignoreParentClicks){
+                    t.expandMenu();
+                    e.preventDefault();
+                }else if(t.onClick){
+                    t.onClick(e);
+                    this.fireEvent('click', this, t, e);
+                }
+            }
+        }
+    },
+
+    // private
+    setActiveItem : function(item, autoExpand){
+        if(item != this.activeItem){
+            this.deactivateActive();
+            if((this.activeItem = item).isFormField){
+                item.focus();
+            }else{
+                item.activate(autoExpand);
+            }
+        }else if(autoExpand){
+            item.expandMenu();
+        }
+    },
+
+    deactivateActive : function(){
+        var a = this.activeItem;
+        if(a){
+            if(a.isFormField){
+                //Fields cannot deactivate, but Combos must collapse
+                if(a.collapse){
+                    a.collapse();
+                }
+            }else{
+                a.deactivate();
+            }
+            delete this.activeItem;
+        }
+    },
+
+    // private
+    tryActivate : function(start, step){
+        var items = this.items;
+        for(var i = start, len = items.length; i >= 0 && i < len; i+= step){
+            var item = items.get(i);
+            if(item.isVisible() && !item.disabled && (item.canActivate || item.isFormField)){
+                this.setActiveItem(item, false);
+                return item;
+            }
+        }
+        return false;
+    },
+
+    // private
+    onMouseOver : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.canActivate && !t.disabled){
+                this.setActiveItem(t, true);
+            }
+        }
+        this.over = true;
+        this.fireEvent('mouseover', this, e, t);
+    },
+
+    // private
+    onMouseOut : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t == this.activeItem && t.shouldDeactivate && t.shouldDeactivate(e)){
+                this.activeItem.deactivate();
+                delete this.activeItem;
+            }
+        }
+        this.over = false;
+        this.fireEvent('mouseout', this, e, t);
+    },
+
+    // private
+    onScroll : function(e, t){
+        if(e){
+            e.stopEvent();
+        }
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        ul.scrollTop += this.scrollIncrement * (top ? -1 : 1);
+        if(top ? ul.scrollTop <= 0 : ul.scrollTop + this.activeMax >= ul.scrollHeight){
+           this.onScrollerOut(null, t);
+        }
+    },
+
+    // private
+    onScrollerIn : function(e, t){
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        if(top ? ul.scrollTop > 0 : ul.scrollTop + this.activeMax < ul.scrollHeight){
+            Ext.fly(t).addClass(['x-menu-item-active', 'x-menu-scroller-active']);
+        }
+    },
+
+    // private
+    onScrollerOut : function(e, t){
+        Ext.fly(t).removeClass(['x-menu-item-active', 'x-menu-scroller-active']);
+    },
+
+    /**
+     * If <code>{@link #floating}=true</code>, shows this menu relative to
+     * another element using {@link #showat}, otherwise uses {@link Ext.Component#show}.
+     * @param {Mixed} element The element to align to
+     * @param {String} position (optional) The {@link Ext.Element#alignTo} anchor position to use in aligning to
+     * the element (defaults to this.defaultAlign)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    show : function(el, pos, parentMenu){
+        if(this.floating){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+                this.doLayout(false, true);
+            }
+            this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign, this.defaultOffsets), parentMenu);
+        }else{
+            Ext.menu.Menu.superclass.show.call(this);
+        }
+    },
+
+    /**
+     * Displays this menu at a specific xy position and fires the 'show' event if a
+     * handler for the 'beforeshow' event does not return false cancelling the operation.
+     * @param {Array} xyPosition Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    showAt : function(xy, parentMenu){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+            }
+            if(this.enableScrolling){
+                // set the position so we can figure out the constrain value.
+                this.el.setXY(xy);
+                //constrain the value, keep the y coordinate the same
+                xy[1] = this.constrainScroll(xy[1]);
+                xy = [this.el.adjustForConstraints(xy)[0], xy[1]];
+            }else{
+                //constrain to the viewport.
+                xy = this.el.adjustForConstraints(xy);
+            }
+            this.el.setXY(xy);
+            this.el.show();
+            Ext.menu.Menu.superclass.onShow.call(this);
+            if(Ext.isIE){
+                // internal event, used so we don't couple the layout to the menu
+                this.fireEvent('autosize', this);
+                if(!Ext.isIE8){
+                    this.el.repaint();
+                }
+            }
+            this.hidden = false;
+            this.focus();
+            this.fireEvent('show', this);
+        }
+    },
+
+    constrainScroll : function(y){
+        var max, full = this.ul.setHeight('auto').getHeight(),
+            returnY = y, normalY, parentEl, scrollTop, viewHeight;
+        if(this.floating){
+            parentEl = Ext.fly(this.el.dom.parentNode);
+            scrollTop = parentEl.getScroll().top;
+            viewHeight = parentEl.getViewSize().height;
+            //Normalize y by the scroll position for the parent element.  Need to move it into the coordinate space
+            //of the view.
+            normalY = y - scrollTop;
+            max = this.maxHeight ? this.maxHeight : viewHeight - normalY;
+            if(full > viewHeight) {
+                max = viewHeight;
+                //Set returnY equal to (0,0) in view space by reducing y by the value of normalY
+                returnY = y - normalY;
+            } else if(max < full) {
+                returnY = y - (full - max);
+                max = full;
+            }
+        }else{
+            max = this.getHeight();
+        }
+        // Always respect maxHeight 
+        if (this.maxHeight){
+            max = Math.min(this.maxHeight, max);
+        }
+        if(full > max && max > 0){
+            this.activeMax = max - this.scrollerHeight * 2 - this.el.getFrameWidth('tb') - Ext.num(this.el.shadowOffset, 0);
+            this.ul.setHeight(this.activeMax);
+            this.createScrollers();
+            this.el.select('.x-menu-scroller').setDisplayed('');
+        }else{
+            this.ul.setHeight(full);
+            this.el.select('.x-menu-scroller').setDisplayed('none');
+        }
+        this.ul.dom.scrollTop = 0;
+        return returnY;
+    },
+
+    createScrollers : function(){
+        if(!this.scroller){
+            this.scroller = {
+                pos: 0,
+                top: this.el.insertFirst({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-top',
+                    html: '&#160;'
+                }),
+                bottom: this.el.createChild({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-bottom',
+                    html: '&#160;'
+                })
+            };
+            this.scroller.top.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.topRepeater = new Ext.util.ClickRepeater(this.scroller.top, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.top], false)
+                }
+            });
+            this.scroller.bottom.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.bottomRepeater = new Ext.util.ClickRepeater(this.scroller.bottom, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.bottom], false)
+                }
+            });
+        }
+    },
+
+    onLayout : function(){
+        if(this.isVisible()){
+            if(this.enableScrolling){
+                this.constrainScroll(this.el.getTop());
+            }
+            if(this.floating){
+                this.el.sync();
+            }
+        }
+    },
+
+    focus : function(){
+        if(!this.hidden){
+            this.doFocus.defer(50, this);
+        }
+    },
+
+    doFocus : function(){
+        if(!this.hidden){
+            this.focusEl.focus();
+        }
+    },
+
+    /**
+     * Hides this menu and optionally all parent menus
+     * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
+     */
+    hide : function(deep){
+        if (!this.isDestroyed) {
+            this.deepHide = deep;
+            Ext.menu.Menu.superclass.hide.call(this);
+            delete this.deepHide;
+        }
+    },
+
+    // private
+    onHide : function(){
+        Ext.menu.Menu.superclass.onHide.call(this);
+        this.deactivateActive();
+        if(this.el && this.floating){
+            this.el.hide();
+        }
+        var pm = this.parentMenu;
+        if(this.deepHide === true && pm){
+            if(pm.floating){
+                pm.hide(true);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+
+    // private
+    lookupComponent : function(c){
+         if(Ext.isString(c)){
+            c = (c == 'separator' || c == '-') ? new Ext.menu.Separator() : new Ext.menu.TextItem(c);
+             this.applyDefaults(c);
+         }else{
+            if(Ext.isObject(c)){
+                c = this.getMenuItem(c);
+            }else if(c.tagName || c.el){ // element. Wrap it.
+                c = new Ext.BoxComponent({
+                    el: c
+                });
+            }
+         }
+         return c;
+    },
+
+    applyDefaults : function(c) {
+        if (!Ext.isString(c)) {
+            c = Ext.menu.Menu.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(d){
+                if(c.events){
+                    Ext.applyIf(c.initialConfig, d);
+                    Ext.apply(c, d);
+                }else{
+                    Ext.applyIf(c, d);
+                }
+            }
+        }
+        return c;
+    },
+
+    // private
+    getMenuItem : function(config) {
+        config.ownerCt = this;
+        
+        if (!config.isXType) {
+            if (!config.xtype && Ext.isBoolean(config.checked)) {
+                return new Ext.menu.CheckItem(config);
+            }
+            return Ext.create(config, this.defaultType);
+        }
+        return config;
+    },
+
+    /**
+     * Adds a separator bar to the menu
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addSeparator : function() {
+        return this.add(new Ext.menu.Separator());
+    },
+
+    /**
+     * Adds an {@link Ext.Element} object to the menu
+     * @param {Mixed} el The element or DOM node to add, or its id
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addElement : function(el) {
+        return this.add(new Ext.menu.BaseItem({
+            el: el
+        }));
+    },
+
+    /**
+     * Adds an existing object based on {@link Ext.menu.BaseItem} to the menu
+     * @param {Ext.menu.Item} item The menu item to add
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addItem : function(item) {
+        return this.add(item);
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.Item} based an the supplied config object and adds it to the menu
+     * @param {Object} config A MenuItem config object
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addMenuItem : function(config) {
+        return this.add(this.getMenuItem(config));
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.TextItem} with the supplied text and adds it to the menu
+     * @param {String} text The text to display in the menu item
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addText : function(text){
+        return this.add(new Ext.menu.TextItem(text));
+    },
+
+    //private
+    onDestroy : function(){
+        Ext.EventManager.removeResizeListener(this.hide, this);
+        var pm = this.parentMenu;
+        if(pm && pm.activeChild == this){
+            delete pm.activeChild;
+        }
+        delete this.parentMenu;
+        Ext.menu.Menu.superclass.onDestroy.call(this);
+        Ext.menu.MenuMgr.unregister(this);
+        if(this.keyNav) {
+            this.keyNav.disable();
+        }
+        var s = this.scroller;
+        if(s){
+            Ext.destroy(s.topRepeater, s.bottomRepeater, s.top, s.bottom);
+        }
+        Ext.destroy(
+            this.el,
+            this.focusEl,
+            this.ul
+        );
+    }
+});
+
+Ext.reg('menu', Ext.menu.Menu);
+
+// MenuNav is a private utility class used internally by the Menu
+Ext.menu.MenuNav = Ext.extend(Ext.KeyNav, function(){
+    function up(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){
+            m.tryActivate(m.items.length-1, -1);
+        }
+    }
+    function down(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){
+            m.tryActivate(0, 1);
+        }
+    }
+    return {
+        constructor : function(menu){
+            Ext.menu.MenuNav.superclass.constructor.call(this, menu.el);
+            this.scope = this.menu = menu;
+        },
+
+        doRelay : function(e, h){
+            var k = e.getKey();
+//          Keystrokes within a form Field (e.g.: down in a Combo) do not navigate. Allow only TAB
+            if (this.menu.activeItem && this.menu.activeItem.isFormField && k != e.TAB) {
+                return false;
+            }
+            if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){
+                this.menu.tryActivate(0, 1);
+                return false;
+            }
+            return h.call(this.scope || this, e, this.menu);
+        },
+
+        tab: function(e, m) {
+            e.stopEvent();
+            if (e.shiftKey) {
+                up(e, m);
+            } else {
+                down(e, m);
+            }
+        },
+
+        up : up,
+
+        down : down,
+
+        right : function(e, m){
+            if(m.activeItem){
+                m.activeItem.expandMenu(true);
+            }
+        },
+
+        left : function(e, m){
+            m.hide();
+            if(m.parentMenu && m.parentMenu.activeItem){
+                m.parentMenu.activeItem.activate();
+            }
+        },
+
+        enter : function(e, m){
+            if(m.activeItem){
+                e.stopPropagation();
+                m.activeItem.onClick(e);
+                m.fireEvent('click', this, m.activeItem);
+                return true;
+            }
+        }
+    };
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/BaseItem.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/BaseItem.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/BaseItem.js	(revision 76)
@@ -0,0 +1,171 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.BaseItem
+ * @extends Ext.Component
+ * The base class for all items that render into menus.  BaseItem provides default rendering, activated state
+ * management and base configuration options shared by all menu components.
+ * @constructor
+ * Creates a new BaseItem
+ * @param {Object} config Configuration options
+ * @xtype menubaseitem
+ */
+Ext.menu.BaseItem = Ext.extend(Ext.Component, {
+    /**
+     * @property parentMenu
+     * @type Ext.menu.Menu
+     * The parent Menu of this Item.
+     */
+    /**
+     * @cfg {Function} handler
+     * A function that will handle the click event of this menu item (optional).
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>b</code> : Item<div class="sub-desc">This menu Item.</div></li>
+     * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the handler function will be called.
+     */
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to false)
+     */
+    canActivate : false,
+    /**
+     * @cfg {String} activeClass The CSS class to use when the item becomes activated (defaults to "x-menu-item-active")
+     */
+    activeClass : "x-menu-item-active",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to true)
+     */
+    hideOnClick : true,
+    /**
+     * @cfg {Number} clickHideDelay Length of time in milliseconds to wait before hiding after a click (defaults to 1)
+     */
+    clickHideDelay : 1,
+
+    // private
+    ctype : "Ext.menu.BaseItem",
+
+    // private
+    actionMode : "container",
+
+    initComponent : function(){
+        Ext.menu.BaseItem.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this item is clicked
+             * @param {Ext.menu.BaseItem} this
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event activate
+             * Fires when this item is activated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires when this item is deactivated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'deactivate'
+        );
+        if(this.handler){
+            this.on("click", this.handler, this.scope);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        Ext.menu.BaseItem.superclass.onRender.apply(this, arguments);
+        if(this.ownerCt && this.ownerCt instanceof Ext.menu.Menu){
+            this.parentMenu = this.ownerCt;
+        }else{
+            this.container.addClass('x-menu-list-item');
+            this.mon(this.el, {
+                scope: this,
+                click: this.onClick,
+                mouseenter: this.activate,
+                mouseleave: this.deactivate
+            });
+        }
+    },
+
+    /**
+     * Sets the function that will handle click events for this item (equivalent to passing in the {@link #handler}
+     * config property).  If an existing handler is already registered, it will be unregistered for you.
+     * @param {Function} handler The function that should be called on click
+     * @param {Object} scope The scope (<code>this</code> reference) in which the handler function is executed. Defaults to this menu item.
+     */
+    setHandler : function(handler, scope){
+        if(this.handler){
+            this.un("click", this.handler, this.scope);
+        }
+        this.on("click", this.handler = handler, this.scope = scope);
+    },
+
+    // private
+    onClick : function(e){
+        if(!this.disabled && this.fireEvent("click", this, e) !== false
+                && (this.parentMenu && this.parentMenu.fireEvent("itemclick", this, e) !== false)){
+            this.handleClick(e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    activate : function(){
+        if(this.disabled){
+            return false;
+        }
+        var li = this.container;
+        li.addClass(this.activeClass);
+        this.region = li.getRegion().adjust(2, 2, -2, -2);
+        this.fireEvent("activate", this);
+        return true;
+    },
+
+    // private
+    deactivate : function(){
+        this.container.removeClass(this.activeClass);
+        this.fireEvent("deactivate", this);
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        return !this.region || !this.region.contains(e.getPoint());
+    },
+
+    // private
+    handleClick : function(e){
+        var pm = this.parentMenu;
+        if(this.hideOnClick){
+            if(pm.floating){
+                this.clickHideDelayTimer = pm.hide.defer(this.clickHideDelay, pm, [true]);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+    
+    beforeDestroy: function(){
+        clearTimeout(this.clickHideDelayTimer);
+        Ext.menu.BaseItem.superclass.beforeDestroy.call(this);    
+    },
+
+    // private. Do nothing
+    expandMenu : Ext.emptyFn,
+
+    // private. Do nothing
+    hideMenu : Ext.emptyFn
+});
+Ext.reg('menubaseitem', Ext.menu.BaseItem);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/MenuMgr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/MenuMgr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/MenuMgr.js	(revision 76)
@@ -0,0 +1,211 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.MenuMgr
+ * Provides a common registry of all menu items on a page so that they can be easily accessed by id.
+ * @singleton
+ */
+Ext.menu.MenuMgr = function(){
+   var menus, 
+       active, 
+       map,
+       groups = {}, 
+       attached = false, 
+       lastShow = new Date();
+   
+
+   // private - called when first menu is created
+   function init(){
+       menus = {};
+       active = new Ext.util.MixedCollection();
+       map = Ext.getDoc().addKeyListener(27, hideAll);
+       map.disable();
+   }
+
+   // private
+   function hideAll(){
+       if(active && active.length > 0){
+           var c = active.clone();
+           c.each(function(m){
+               m.hide();
+           });
+           return true;
+       }
+       return false;
+   }
+
+   // private
+   function onHide(m){
+       active.remove(m);
+       if(active.length < 1){
+           map.disable();
+           Ext.getDoc().un("mousedown", onMouseDown);
+           attached = false;
+       }
+   }
+
+   // private
+   function onShow(m){
+       var last = active.last();
+       lastShow = new Date();
+       active.add(m);
+       if(!attached){
+           map.enable();
+           Ext.getDoc().on("mousedown", onMouseDown);
+           attached = true;
+       }
+       if(m.parentMenu){
+          m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3);
+          m.parentMenu.activeChild = m;
+       }else if(last && !last.isDestroyed && last.isVisible()){
+          m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3);
+       }
+   }
+
+   // private
+   function onBeforeHide(m){
+       if(m.activeChild){
+           m.activeChild.hide();
+       }
+       if(m.autoHideTimer){
+           clearTimeout(m.autoHideTimer);
+           delete m.autoHideTimer;
+       }
+   }
+
+   // private
+   function onBeforeShow(m){
+       var pm = m.parentMenu;
+       if(!pm && !m.allowOtherMenus){
+           hideAll();
+       }else if(pm && pm.activeChild){
+           pm.activeChild.hide();
+       }
+   }
+
+   // private
+   function onMouseDown(e){
+       if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){
+           hideAll();
+       }
+   }
+
+   return {
+
+       /**
+        * Hides all menus that are currently visible
+        * @return {Boolean} success True if any active menus were hidden.
+        */
+       hideAll : function(){
+            return hideAll();
+       },
+
+       // private
+       register : function(menu){
+           if(!menus){
+               init();
+           }
+           menus[menu.id] = menu;
+           menu.on({
+               beforehide: onBeforeHide,
+               hide: onHide,
+               beforeshow: onBeforeShow,
+               show: onShow
+           });
+       },
+
+        /**
+         * Returns a {@link Ext.menu.Menu} object
+         * @param {String/Object} menu The string menu id, an existing menu object reference, or a Menu config that will
+         * be used to generate and return a new Menu instance.
+         * @return {Ext.menu.Menu} The specified menu, or null if none are found
+         */
+       get : function(menu){
+           if(typeof menu == "string"){ // menu id
+               if(!menus){  // not initialized, no menus to return
+                   return null;
+               }
+               return menus[menu];
+           }else if(menu.events){  // menu instance
+               return menu;
+           }else if(typeof menu.length == 'number'){ // array of menu items?
+               return new Ext.menu.Menu({items:menu});
+           }else{ // otherwise, must be a config
+               return Ext.create(menu, 'menu');
+           }
+       },
+
+       // private
+       unregister : function(menu){
+           delete menus[menu.id];
+           menu.un("beforehide", onBeforeHide);
+           menu.un("hide", onHide);
+           menu.un("beforeshow", onBeforeShow);
+           menu.un("show", onShow);
+       },
+
+       // private
+       registerCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               if(!groups[g]){
+                   groups[g] = [];
+               }
+               groups[g].push(menuItem);
+           }
+       },
+
+       // private
+       unregisterCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               groups[g].remove(menuItem);
+           }
+       },
+       
+       // private
+       onCheckChange: function(item, state){
+           if(item.group && state){
+               var group = groups[item.group],
+                   i = 0,
+                   len = group.length,
+                   current;
+                   
+               for(; i < len; i++){
+                   current = group[i];
+                   if(current != item){
+                       current.setChecked(false);
+                   }
+               }
+           }
+       },
+
+       getCheckedItem : function(groupId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].checked){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       },
+
+       setCheckedItem : function(groupId, itemId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].id == itemId){
+                       g[i].setChecked(true);
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/CheckItem.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/CheckItem.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/CheckItem.js	(revision 76)
@@ -0,0 +1,117 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.CheckItem
+ * @extends Ext.menu.Item
+ * Adds a menu item that contains a checkbox by default, but can also be part of a radio group.
+ * @constructor
+ * Creates a new CheckItem
+ * @param {Object} config Configuration options
+ * @xtype menucheckitem
+ */
+Ext.menu.CheckItem = Ext.extend(Ext.menu.Item, {
+    /**
+     * @cfg {String} group
+     * All check items with the same group name will automatically be grouped into a single-select
+     * radio button group (defaults to '')
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for check items (defaults to "x-menu-item x-menu-check-item")
+     */
+    itemCls : "x-menu-item x-menu-check-item",
+    /**
+     * @cfg {String} groupClass The default CSS class to use for radio group check items (defaults to "x-menu-group-item")
+     */
+    groupClass : "x-menu-group-item",
+
+    /**
+     * @cfg {Boolean} checked True to initialize this checkbox as checked (defaults to false).  Note that
+     * if this checkbox is part of a radio group (group = true) only the first item in the group that is
+     * initialized with checked = true will be rendered as checked.
+     */
+    checked: false,
+
+    // private
+    ctype: "Ext.menu.CheckItem",
+    
+    initComponent : function(){
+        Ext.menu.CheckItem.superclass.initComponent.call(this);
+	    this.addEvents(
+	        /**
+	         * @event beforecheckchange
+	         * Fires before the checked value is set, providing an opportunity to cancel if needed
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The new checked value that will be set
+	         */
+	        "beforecheckchange" ,
+	        /**
+	         * @event checkchange
+	         * Fires after the checked value has been set
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The checked value that was set
+	         */
+	        "checkchange"
+	    );
+	    /**
+	     * A function that handles the checkchange event.  The function is undefined by default, but if an implementation
+	     * is provided, it will be called automatically when the checkchange event fires.
+	     * @param {Ext.menu.CheckItem} this
+	     * @param {Boolean} checked The checked value that was set
+	     * @method checkHandler
+	     */
+	    if(this.checkHandler){
+	        this.on('checkchange', this.checkHandler, this.scope);
+	    }
+	    Ext.menu.MenuMgr.registerCheckable(this);
+    },
+
+    // private
+    onRender : function(c){
+        Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);
+        if(this.group){
+            this.el.addClass(this.groupClass);
+        }
+        if(this.checked){
+            this.checked = false;
+            this.setChecked(true, true);
+        }
+    },
+
+    // private
+    destroy : function(){
+        Ext.menu.MenuMgr.unregisterCheckable(this);
+        Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Set the checked state of this item
+     * @param {Boolean} checked The new checked value
+     * @param {Boolean} suppressEvent (optional) True to prevent the checkchange event from firing (defaults to false)
+     */
+    setChecked : function(state, suppressEvent){
+        var suppress = suppressEvent === true;
+        if(this.checked != state && (suppress || this.fireEvent("beforecheckchange", this, state) !== false)){
+            Ext.menu.MenuMgr.onCheckChange(this, state);
+            if(this.container){
+                this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");
+            }
+            this.checked = state;
+            if(!suppress){
+                this.fireEvent("checkchange", this, state);
+            }
+        }
+    },
+
+    // private
+    handleClick : function(e){
+       if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item
+           this.setChecked(!this.checked);
+       }
+       Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);
+    }
+});
+Ext.reg('menucheckitem', Ext.menu.CheckItem);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Item.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Item.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Item.js	(revision 76)
@@ -0,0 +1,238 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.Item
+ * @extends Ext.menu.BaseItem
+ * A base class for all menu items that require menu-related functionality (like sub-menus) and are not static
+ * display items.  Item extends the base functionality of {@link Ext.menu.BaseItem} by adding menu-specific
+ * activation and click handling.
+ * @constructor
+ * Creates a new Item
+ * @param {Object} config Configuration options
+ * @xtype menuitem
+ */
+Ext.menu.Item = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @property menu
+     * @type Ext.menu.Menu
+     * The submenu associated with this Item if one was configured.
+     */
+    /**
+     * @cfg {Mixed} menu (optional) Either an instance of {@link Ext.menu.Menu} or the config object for an
+     * {@link Ext.menu.Menu} which acts as the submenu when this item is activated.
+     */
+    /**
+     * @cfg {String} icon The path to an icon to display in this item (defaults to Ext.BLANK_IMAGE_URL).  If
+     * icon is specified {@link #iconCls} should not be.
+     */
+    /**
+     * @cfg {String} iconCls A CSS class that specifies a background image that will be used as the icon for
+     * this item (defaults to '').  If iconCls is specified {@link #icon} should not be.
+     */
+    /**
+     * @cfg {String} text The text to display in this item (defaults to '').
+     */
+    /**
+     * @cfg {String} href The href attribute to use for the underlying anchor link (defaults to '#').
+     */
+    /**
+     * @cfg {String} hrefTarget The target attribute to use for the underlying anchor link (defaults to '').
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for menu items (defaults to 'x-menu-item')
+     */
+    itemCls : 'x-menu-item',
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to true)
+     */
+    canActivate : true,
+    /**
+     * @cfg {Number} showDelay Length of time in milliseconds to wait before showing this item (defaults to 200)
+     */
+    showDelay: 200,
+    
+    /**
+     * @cfg {String} altText The altText to use for the icon, if it exists. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+    
+    // doc'd in BaseItem
+    hideDelay: 200,
+
+    // private
+    ctype: 'Ext.menu.Item',
+
+    initComponent : function(){
+        Ext.menu.Item.superclass.initComponent.call(this);
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.menu.Item.prototype.itemTpl = new Ext.XTemplate(
+                '<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"',
+                    '<tpl if="hrefTarget">',
+                        ' target="{hrefTarget}"',
+                    '</tpl>',
+                 '>',
+                     '<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>',
+                     '<span class="x-menu-item-text">{text}</span>',
+                 '</a>'
+             );
+        }
+        var a = this.getTemplateArgs();
+        this.el = position ? this.itemTpl.insertBefore(position, a, true) : this.itemTpl.append(container, a, true);
+        this.iconEl = this.el.child('img.x-menu-item-icon');
+        this.textEl = this.el.child('.x-menu-item-text');
+        if(!this.href) { // if no link defined, prevent the default anchor event
+            this.mon(this.el, 'click', Ext.emptyFn, null, { preventDefault: true });
+        }
+        Ext.menu.Item.superclass.onRender.call(this, container, position);
+    },
+
+    getTemplateArgs: function() {
+        return {
+            id: this.id,
+            cls: this.itemCls + (this.menu ?  ' x-menu-item-arrow' : '') + (this.cls ?  ' ' + this.cls : ''),
+            href: this.href || '#',
+            hrefTarget: this.hrefTarget,
+            icon: this.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: this.iconCls || '',
+            text: this.itemText||this.text||'&#160;',
+            altText: this.altText || ''
+        };
+    },
+
+    /**
+     * Sets the text to display in this menu item
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.text = text||'&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+            this.parentMenu.layout.doAutoSize();
+        }
+    },
+
+    /**
+     * Sets the CSS class to apply to the item's icon element
+     * @param {String} cls The CSS class to apply
+     */
+    setIconClass : function(cls){
+        var oldCls = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered){
+            this.iconEl.replaceClass(oldCls, this.iconCls);
+        }
+    },
+
+    //private
+    beforeDestroy: function(){
+        clearTimeout(this.showTimer);
+        clearTimeout(this.hideTimer);
+        if (this.menu){
+            delete this.menu.ownerCt;
+            this.menu.destroy();
+        }
+        Ext.menu.Item.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    handleClick : function(e){
+        if(!this.href){ // if no link defined, stop the event automatically
+            e.stopEvent();
+        }
+        Ext.menu.Item.superclass.handleClick.apply(this, arguments);
+    },
+
+    // private
+    activate : function(autoExpand){
+        if(Ext.menu.Item.superclass.activate.apply(this, arguments)){
+            this.focus();
+            if(autoExpand){
+                this.expandMenu();
+            }
+        }
+        return true;
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){
+            if(this.menu && this.menu.isVisible()){
+                return !this.menu.getEl().getRegion().contains(e.getPoint());
+            }
+            return true;
+        }
+        return false;
+    },
+
+    // private
+    deactivate : function(){
+        Ext.menu.Item.superclass.deactivate.apply(this, arguments);
+        this.hideMenu();
+    },
+
+    // private
+    expandMenu : function(autoActivate){
+        if(!this.disabled && this.menu){
+            clearTimeout(this.hideTimer);
+            delete this.hideTimer;
+            if(!this.menu.isVisible() && !this.showTimer){
+                this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]);
+            }else if (this.menu.isVisible() && autoActivate){
+                this.menu.tryActivate(0, 1);
+            }
+        }
+    },
+
+    // private
+    deferExpand : function(autoActivate){
+        delete this.showTimer;
+        this.menu.show(this.container, this.parentMenu.subMenuAlign || 'tl-tr?', this.parentMenu);
+        if(autoActivate){
+            this.menu.tryActivate(0, 1);
+        }
+    },
+
+    // private
+    hideMenu : function(){
+        clearTimeout(this.showTimer);
+        delete this.showTimer;
+        if(!this.hideTimer && this.menu && this.menu.isVisible()){
+            this.hideTimer = this.deferHide.defer(this.hideDelay, this);
+        }
+    },
+
+    // private
+    deferHide : function(){
+        delete this.hideTimer;
+        if(this.menu.over){
+            this.parentMenu.setActiveItem(this, false);
+        }else{
+            this.menu.hide();
+        }
+    }
+});
+Ext.reg('menuitem', Ext.menu.Item);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Separator.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Separator.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/Separator.js	(revision 76)
@@ -0,0 +1,42 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.Separator
+ * @extends Ext.menu.BaseItem
+ * Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will
+ * add one of these by using "-" in you call to add() or in your items config rather than creating one directly.
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype menuseparator
+ */
+Ext.menu.Separator = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} itemCls The default CSS class to use for separators (defaults to "x-menu-sep")
+     */
+    itemCls : "x-menu-sep",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    
+    /** 
+     * @cfg {String} activeClass
+     * @hide 
+     */
+    activeClass: '',
+
+    // private
+    onRender : function(li){
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = "&#160;";
+        this.el = s;
+        li.addClass("x-menu-sep-li");
+        Ext.menu.Separator.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menuseparator', Ext.menu.Separator);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/DateMenu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/DateMenu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/DateMenu.js	(revision 76)
@@ -0,0 +1,125 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.DateMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing an {@link Ext.DatePicker} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.DatePicker}</b>.</li>
+ * <li>If subclassing DateMenu, any configuration options for the DatePicker must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the DateMenu.
+ * Applying {@link Ext.DatePicker DatePicker} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the DatePicker's configuration.</li>
+ * </ul></div>
+ * @xtype datemenu
+ */
+ Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">The Ext.DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DateMenu instance.
+     */    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a date is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    /** 
+     * @cfg {String} pickerId
+     * An id to assign to the underlying date picker. Defaults to <tt>null</tt>.
+     */
+    pickerId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * The {@link Ext.DatePicker} instance for this DateMenu
+     * @property picker
+     * @type DatePicker
+     */
+    cls : 'x-date-menu',
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+
+    initComponent : function(){
+        this.on('beforeshow', this.onBeforeShow, this);
+        if(this.strict = (Ext.isIE7 && Ext.isStrict)){
+            this.on('show', this.onShow, this, {single: true, delay: 20});
+        }
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.picker = new Ext.DatePicker(Ext.applyIf({
+                internalRender: this.strict || !Ext.isIE,
+                ctCls: 'x-menu-date-item',
+                id: this.pickerId
+            }, this.initialConfig))
+        });
+        this.picker.purgeListeners();
+        Ext.menu.DateMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a date is selected from the {@link #picker Ext.DatePicker}
+         * @param {DatePicker} picker The {@link #picker Ext.DatePicker}
+         * @param {Date} date The selected date
+         */
+        this.relayEvents(this.picker, ['select']);
+        this.on('show', this.picker.focus, this.picker);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function() {
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    },
+
+    onBeforeShow : function(){
+        if(this.picker){
+            this.picker.hideMonthPicker(true);
+        }
+    },
+
+    onShow : function(){
+        var el = this.picker.getEl();
+        el.setWidth(el.getWidth()); //nasty hack for IE7 strict mode
+    }
+ });
+ Ext.reg('datemenu', Ext.menu.DateMenu);
+ 
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/ColorMenu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/ColorMenu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/ColorMenu.js	(revision 76)
@@ -0,0 +1,109 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.ColorMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing a {@link Ext.ColorPalette} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.ColorPalette}</b>.</li>
+ * <li>If subclassing ColorMenu, any configuration options for the ColorPalette must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the ColorMenu.
+ * Applying {@link Ext.ColorPalette ColorPalette} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the ColorPalette's configuration.</li>
+ * </ul></div> * 
+ * @xtype colormenu
+ */
+ Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorMenu instance.
+     */    
+    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a color is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    cls : 'x-color-menu',
+    
+    /** 
+     * @cfg {String} paletteId
+     * An id to assign to the underlying color palette. Defaults to <tt>null</tt>.
+     */
+    paletteId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * @property palette
+     * @type ColorPalette
+     * The {@link Ext.ColorPalette} instance for this ColorMenu
+     */
+    
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+    
+    initComponent : function(){
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.palette = new Ext.ColorPalette(Ext.applyIf({
+                id: this.paletteId
+            }, this.initialConfig))
+        });
+        this.palette.purgeListeners();
+        Ext.menu.ColorMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a color is selected from the {@link #palette Ext.ColorPalette}
+         * @param {Ext.ColorPalette} palette The {@link #palette Ext.ColorPalette}
+	     * @param {String} color The 6-digit color hex code (without the # symbol)
+         */
+        this.relayEvents(this.palette, ['select']);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function(){
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    }
+});
+Ext.reg('colormenu', Ext.menu.ColorMenu);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/TextItem.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/TextItem.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/menu/TextItem.js	(revision 76)
@@ -0,0 +1,48 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.menu.TextItem
+ * @extends Ext.menu.BaseItem
+ * Adds a static text string to a menu, usually used as either a heading or group separator.
+ * @constructor
+ * Creates a new TextItem
+ * @param {Object/String} config If config is a string, it is used as the text to display, otherwise it
+ * is applied as a config object (and should contain a <tt>text</tt> property).
+ * @xtype menutextitem
+ */
+Ext.menu.TextItem = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} text The text to display for this item (defaults to '')
+     */
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    /**
+     * @cfg {String} itemCls The default CSS class to use for text items (defaults to "x-menu-text")
+     */
+    itemCls : "x-menu-text",
+    
+    constructor : function(config) {
+        if (typeof config == 'string') {
+            config = {
+                text: config
+            };
+        }
+        Ext.menu.TextItem.superclass.constructor.call(this, config);
+    },
+
+    // private
+    onRender : function() {
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = this.text;
+        this.el = s;
+        Ext.menu.TextItem.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menutextitem', Ext.menu.TextItem);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/MessageBox.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/MessageBox.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/MessageBox.js	(revision 76)
@@ -0,0 +1,644 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.MessageBox
+ * <p>Utility class for generating different styles of message boxes.  The alias Ext.Msg can also be used.<p/>
+ * <p>Note that the MessageBox is asynchronous.  Unlike a regular JavaScript <code>alert</code> (which will halt
+ * browser execution), showing a MessageBox will not cause the code to stop.  For this reason, if you have code
+ * that should only run <em>after</em> some user feedback from the MessageBox, you must use a callback function
+ * (see the <code>function</code> parameter for {@link #show} for more details).</p>
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic alert:
+Ext.Msg.alert('Status', 'Changes saved successfully.');
+
+// Prompt for user data and process the result using a callback:
+Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
+    if (btn == 'ok'){
+        // process text value and close...
+    }
+});
+
+// Show a dialog using config options:
+Ext.Msg.show({
+   title:'Save Changes?',
+   msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
+   buttons: Ext.Msg.YESNOCANCEL,
+   fn: processResult,
+   animEl: 'elId',
+   icon: Ext.MessageBox.QUESTION
+});
+</code></pre>
+ * @singleton
+ */
+Ext.MessageBox = function(){
+    var dlg, opt, mask, waitTimer,
+        bodyEl, msgEl, textboxEl, textareaEl, progressBar, pp, iconEl, spacerEl,
+        buttons, activeTextEl, bwidth, bufferIcon = '', iconCls = '',
+        buttonNames = ['ok', 'yes', 'no', 'cancel'];
+
+    // private
+    var handleButton = function(button){
+        buttons[button].blur();
+        if(dlg.isVisible()){
+            dlg.hide();
+            handleHide();
+            Ext.callback(opt.fn, opt.scope||window, [button, activeTextEl.dom.value, opt], 1);
+        }
+    };
+
+    // private
+    var handleHide = function(){
+        if(opt && opt.cls){
+            dlg.el.removeClass(opt.cls);
+        }
+        progressBar.reset();        
+    };
+
+    // private
+    var handleEsc = function(d, k, e){
+        if(opt && opt.closable !== false){
+            dlg.hide();
+            handleHide();
+        }
+        if(e){
+            e.stopEvent();
+        }
+    };
+
+    // private
+    var updateButtons = function(b){
+        var width = 0,
+            cfg;
+        if(!b){
+            Ext.each(buttonNames, function(name){
+                buttons[name].hide();
+            });
+            return width;
+        }
+        dlg.footer.dom.style.display = '';
+        Ext.iterate(buttons, function(name, btn){
+            cfg = b[name];
+            if(cfg){
+                btn.show();
+                btn.setText(Ext.isString(cfg) ? cfg : Ext.MessageBox.buttonText[name]);
+                width += btn.getEl().getWidth() + 15;
+            }else{
+                btn.hide();
+            }
+        });
+        return width;
+    };
+
+    return {
+        /**
+         * Returns a reference to the underlying {@link Ext.Window} element
+         * @return {Ext.Window} The window
+         */
+        getDialog : function(titleText){
+           if(!dlg){
+                var btns = [];
+                
+                buttons = {};
+                Ext.each(buttonNames, function(name){
+                    btns.push(buttons[name] = new Ext.Button({
+                        text: this.buttonText[name],
+                        handler: handleButton.createCallback(name),
+                        hideMode: 'offsets'
+                    }));
+                }, this);
+                dlg = new Ext.Window({
+                    autoCreate : true,
+                    title:titleText,
+                    resizable:false,
+                    constrain:true,
+                    constrainHeader:true,
+                    minimizable : false,
+                    maximizable : false,
+                    stateful: false,
+                    modal: true,
+                    shim:true,
+                    buttonAlign:"center",
+                    width:400,
+                    height:100,
+                    minHeight: 80,
+                    plain:true,
+                    footer:true,
+                    closable:true,
+                    close : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton("no");
+                        }else{
+                            handleButton("cancel");
+                        }
+                    },
+                    fbar: new Ext.Toolbar({
+                        items: btns,
+                        enableOverflow: false
+                    })
+                });
+                dlg.render(document.body);
+                dlg.getEl().addClass('x-window-dlg');
+                mask = dlg.mask;
+                bodyEl = dlg.body.createChild({
+                    html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'
+                });
+                iconEl = Ext.get(bodyEl.dom.firstChild);
+                var contentEl = bodyEl.dom.childNodes[1];
+                msgEl = Ext.get(contentEl.firstChild);
+                textboxEl = Ext.get(contentEl.childNodes[2].firstChild);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton("ok");
+                        }else if(opt.buttons.yes){
+                            handleButton("yes");
+                        }
+                    }
+                });
+                textareaEl = Ext.get(contentEl.childNodes[2].childNodes[1]);
+                textareaEl.enableDisplayMode();
+                progressBar = new Ext.ProgressBar({
+                    renderTo:bodyEl
+                });
+               bodyEl.createChild({cls:'x-clear'});
+            }
+            return dlg;
+        },
+
+        /**
+         * Updates the message box body text
+         * @param {String} text (optional) Replaces the message box element's innerHTML with the specified string (defaults to
+         * the XHTML-compliant non-breaking space character '&amp;#160;')
+         * @return {Ext.MessageBox} this
+         */
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.setSize(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            // Append a space here for sizing. In IE, for some reason, it wraps text incorrectly without one in some cases
+            msgEl.update(text ? text + ' ' : '&#160;');
+
+            var iw = iconCls != '' ? (iconEl.getWidth() + iconEl.getMargins('lr')) : 0,
+                mw = msgEl.getWidth() + msgEl.getMargins('lr'),
+                fw = dlg.getFrameWidth('lr'),
+                bw = dlg.body.getFrameWidth('lr'),
+                w;
+                
+            w = Math.max(Math.min(opt.width || iw+mw+fw+bw, opt.maxWidth || this.maxWidth),
+                    Math.max(opt.minWidth || this.minWidth, bwidth || 0));
+
+            if(opt.prompt === true){
+                activeTextEl.setWidth(w-iw-fw-bw);
+            }
+            if(opt.progress === true || opt.wait === true){
+                progressBar.setSize(w-iw-fw-bw);
+            }
+            if(Ext.isIE && w == bwidth){
+                w += 4; //Add offset when the content width is smaller than the buttons.    
+            }
+            msgEl.update(text || '&#160;');
+            dlg.setSize(w, 'auto').center();
+            return this;
+        },
+
+        /**
+         * Updates a progress-style message box's text and progress bar. Only relevant on message boxes
+         * initiated via {@link Ext.MessageBox#progress} or {@link Ext.MessageBox#wait},
+         * or by calling {@link Ext.MessageBox#show} with progress: true.
+         * @param {Number} value Any number between 0 and 1 (e.g., .5, defaults to 0)
+         * @param {String} progressText The progress text to display inside the progress bar (defaults to '')
+         * @param {String} msg The message box's body text is replaced with the specified string (defaults to undefined
+         * so that any existing body text will not get overwritten by default unless a new value is passed in)
+         * @return {Ext.MessageBox} this
+         */
+        updateProgress : function(value, progressText, msg){
+            progressBar.updateProgress(value, progressText);
+            if(msg){
+                this.updateText(msg);
+            }
+            return this;
+        },
+
+        /**
+         * Returns true if the message box is currently displayed
+         * @return {Boolean} True if the message box is visible, else false
+         */
+        isVisible : function(){
+            return dlg && dlg.isVisible();
+        },
+
+        /**
+         * Hides the message box if it is displayed
+         * @return {Ext.MessageBox} this
+         */
+        hide : function(){
+            var proxy = dlg ? dlg.activeGhost : null;
+            if(this.isVisible() || proxy){
+                dlg.hide();
+                handleHide();
+                if (proxy){
+                    // unghost is a private function, but i saw no better solution
+                    // to fix the locking problem when dragging while it closes
+                    dlg.unghost(false, false);
+                } 
+            }
+            return this;
+        },
+
+        /**
+         * Displays a new message box, or reinitializes an existing message box, based on the config options
+         * passed in. All display functions (e.g. prompt, alert, etc.) on MessageBox call this function internally,
+         * although those calls are basic shortcuts and do not support all of the config options allowed here.
+         * @param {Object} config The following config options are supported: <ul>
+         * <li><b>animEl</b> : String/Element<div class="sub-desc">An id or Element from which the message box should animate as it
+         * opens and closes (defaults to undefined)</div></li>
+         * <li><b>buttons</b> : Object/Boolean<div class="sub-desc">A button config object (e.g., Ext.MessageBox.OKCANCEL or {ok:'Foo',
+         * cancel:'Bar'}), or false to not show any buttons (defaults to false)</div></li>
+         * <li><b>closable</b> : Boolean<div class="sub-desc">False to hide the top-right close button (defaults to true). Note that
+         * progress and wait dialogs will ignore this property and always hide the close button as they can only
+         * be closed programmatically.</div></li>
+         * <li><b>cls</b> : String<div class="sub-desc">A custom CSS class to apply to the message box's container element</div></li>
+         * <li><b>defaultTextHeight</b> : Number<div class="sub-desc">The default height in pixels of the message box's multiline textarea
+         * if displayed (defaults to 75)</div></li>
+         * <li><b>fn</b> : Function<div class="sub-desc">A callback function which is called when the dialog is dismissed either
+         * by clicking on the configured buttons, or on the dialog close button, or by pressing
+         * the return button to enter input.
+         * <p>Progress and wait dialogs will ignore this option since they do not respond to user
+         * actions and can only be closed programmatically, so any required function should be called
+         * by the same code after it closes the dialog. Parameters passed:<ul>
+         * <li><b>buttonId</b> : String<div class="sub-desc">The ID of the button pressed, one of:<div class="sub-desc"><ul>
+         * <li><tt>ok</tt></li>
+         * <li><tt>yes</tt></li>
+         * <li><tt>no</tt></li>
+         * <li><tt>cancel</tt></li>
+         * </ul></div></div></li>
+         * <li><b>text</b> : String<div class="sub-desc">Value of the input field if either <tt><a href="#show-option-prompt" ext:member="show-option-prompt" ext:cls="Ext.MessageBox">prompt</a></tt>
+         * or <tt><a href="#show-option-multiline" ext:member="show-option-multiline" ext:cls="Ext.MessageBox">multiline</a></tt> is true</div></li>
+         * <li><b>opt</b> : Object<div class="sub-desc">The config object passed to show.</div></li>
+         * </ul></p></div></li>
+         * <li><b>scope</b> : Object<div class="sub-desc">The scope of the callback function</div></li>
+         * <li><b>icon</b> : String<div class="sub-desc">A CSS class that provides a background image to be used as the body icon for the
+         * dialog (e.g. Ext.MessageBox.WARNING or 'custom-class') (defaults to '')</div></li>
+         * <li><b>iconCls</b> : String<div class="sub-desc">The standard {@link Ext.Window#iconCls} to
+         * add an optional header icon (defaults to '')</div></li>
+         * <li><b>maxWidth</b> : Number<div class="sub-desc">The maximum width in pixels of the message box (defaults to 600)</div></li>
+         * <li><b>minWidth</b> : Number<div class="sub-desc">The minimum width in pixels of the message box (defaults to 100)</div></li>
+         * <li><b>modal</b> : Boolean<div class="sub-desc">False to allow user interaction with the page while the message box is
+         * displayed (defaults to true)</div></li>
+         * <li><b>msg</b> : String<div class="sub-desc">A string that will replace the existing message box body text (defaults to the
+         * XHTML-compliant non-breaking space character '&amp;#160;')</div></li>
+         * <li><a id="show-option-multiline"></a><b>multiline</b> : Boolean<div class="sub-desc">
+         * True to prompt the user to enter multi-line text (defaults to false)</div></li>
+         * <li><b>progress</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>progressText</b> : String<div class="sub-desc">The text to display inside the progress bar if progress = true (defaults to '')</div></li>
+         * <li><a id="show-option-prompt"></a><b>prompt</b> : Boolean<div class="sub-desc">True to prompt the user to enter single-line text (defaults to false)</div></li>
+         * <li><b>proxyDrag</b> : Boolean<div class="sub-desc">True to display a lightweight proxy while dragging (defaults to false)</div></li>
+         * <li><b>title</b> : String<div class="sub-desc">The title text</div></li>
+         * <li><b>value</b> : String<div class="sub-desc">The string value to set into the active textbox element if displayed</div></li>
+         * <li><b>wait</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>waitConfig</b> : Object<div class="sub-desc">A {@link Ext.ProgressBar#waitConfig} object (applies only if wait = true)</div></li>
+         * <li><b>width</b> : Number<div class="sub-desc">The width of the dialog in pixels</div></li>
+         * </ul>
+         * Example usage:
+         * <pre><code>
+Ext.Msg.show({
+   title: 'Address',
+   msg: 'Please enter your address:',
+   width: 300,
+   buttons: Ext.MessageBox.OKCANCEL,
+   multiline: true,
+   fn: saveAddress,
+   animEl: 'addAddressBtn',
+   icon: Ext.MessageBox.INFO
+});
+</code></pre>
+         * @return {Ext.MessageBox} this
+         */
+        show : function(options){
+            if(this.isVisible()){
+                this.hide();
+            }
+            opt = options;
+            var d = this.getDialog(opt.title || "&#160;");
+
+            d.setTitle(opt.title || "&#160;");
+            var allowClose = (opt.closable !== false && opt.progress !== true && opt.wait !== true);
+            d.tools.close.setDisplayed(allowClose);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false);
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(Ext.isNumber(opt.multiline) ? opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            activeTextEl.dom.value = opt.value || "";
+            if(opt.prompt){
+                d.focusEl = activeTextEl;
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons["ok"];
+                }else if(bs && bs.yes){
+                    db = buttons["yes"];
+                }
+                if (db){
+                    d.focusEl = db;
+                }
+            }
+            if(Ext.isDefined(opt.iconCls)){
+              d.setIconClass(opt.iconCls);
+            }
+            this.setIcon(Ext.isDefined(opt.icon) ? opt.icon : bufferIcon);
+            bwidth = updateButtons(opt.buttons);
+            progressBar.setVisible(opt.progress === true || opt.wait === true);
+            this.updateProgress(0, opt.progressText);
+            this.updateText(opt.msg);
+            if(opt.cls){
+                d.el.addClass(opt.cls);
+            }
+            d.proxyDrag = opt.proxyDrag === true;
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            if(!d.isVisible()){
+                // force it to the end of the z-index stack so it gets a cursor in FF
+                document.body.appendChild(dlg.el.dom);
+                d.setAnimateTarget(opt.animEl);
+                //workaround for window internally enabling keymap in afterShow
+                d.on('show', function(){
+                    if(allowClose === true){
+                        d.keyMap.enable();
+                    }else{
+                        d.keyMap.disable();
+                    }
+                }, this, {single:true});
+                d.show(opt.animEl);
+            }
+            if(opt.wait === true){
+                progressBar.wait(opt.waitConfig);
+            }
+            return this;
+        },
+
+        /**
+         * Adds the specified icon to the dialog.  By default, the class 'ext-mb-icon' is applied for default
+         * styling, and the class passed in is expected to supply the background image url. Pass in empty string ('')
+         * to clear any existing icon. This method must be called before the MessageBox is shown.
+         * The following built-in icon classes are supported, but you can also pass in a custom class name:
+         * <pre>
+Ext.MessageBox.INFO
+Ext.MessageBox.WARNING
+Ext.MessageBox.QUESTION
+Ext.MessageBox.ERROR
+         *</pre>
+         * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon
+         * @return {Ext.MessageBox} this
+         */
+        setIcon : function(icon){
+            if(!dlg){
+                bufferIcon = icon;
+                return;
+            }
+            bufferIcon = undefined;
+            if(icon && icon != ''){
+                iconEl.removeClass('x-hidden');
+                iconEl.replaceClass(iconCls, icon);
+                bodyEl.addClass('x-dlg-icon');
+                iconCls = icon;
+            }else{
+                iconEl.replaceClass(iconCls, 'x-hidden');
+                bodyEl.removeClass('x-dlg-icon');
+                iconCls = '';
+            }
+            return this;
+        },
+
+        /**
+         * Displays a message box with a progress bar.  This message box has no buttons and is not closeable by
+         * the user.  You are responsible for updating the progress bar as needed via {@link Ext.MessageBox#updateProgress}
+         * and closing the message box when the process is complete.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {String} progressText (optional) The text to display inside the progress bar (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        progress : function(title, msg, progressText){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false,
+                minWidth: this.minProgressWidth,
+                progressText: progressText
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with an infinitely auto-updating progress bar.  This can be used to block user
+         * interaction while waiting for a long-running process to complete that does not have defined intervals.
+         * You are responsible for closing the message box when the process is complete.
+         * @param {String} msg The message box body text
+         * @param {String} title (optional) The title bar text
+         * @param {Object} config (optional) A {@link Ext.ProgressBar#waitConfig} object
+         * @return {Ext.MessageBox} this
+         */
+        wait : function(msg, title, config){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                closable:false,
+                wait:true,
+                modal:true,
+                minWidth: this.minProgressWidth,
+                waitConfig: config
+            });
+            return this;
+        },
+
+        /**
+         * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt).
+         * If a callback function is passed it will be called after the user clicks the button, and the
+         * id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
+         * If a callback function is passed it will be called after the user clicks either button,
+         * and the id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope,
+                icon: this.QUESTION,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
+         * The prompt can be a single-line or multi-line textbox.  If a callback function is passed it will be called after the user
+         * clicks either button, and the id of the button that was clicked (could also be the top-right
+         * close button) and the text that was entered will be passed as the two parameters to the callback.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @param {Boolean/Number} multiline (optional) True to create a multiline textbox using the defaultTextHeight
+         * property, or the height in pixels to create the textbox (defaults to false / single-line)
+         * @param {String} value (optional) Default value of the text input element (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        prompt : function(title, msg, fn, scope, multiline, value){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth: this.minPromptWidth,
+                scope : scope,
+                prompt:true,
+                multiline: multiline,
+                value: value
+            });
+            return this;
+        },
+
+        /**
+         * Button config that displays a single OK button
+         * @type Object
+         */
+        OK : {ok:true},
+        /**
+         * Button config that displays a single Cancel button
+         * @type Object
+         */
+        CANCEL : {cancel:true},
+        /**
+         * Button config that displays OK and Cancel buttons
+         * @type Object
+         */
+        OKCANCEL : {ok:true, cancel:true},
+        /**
+         * Button config that displays Yes and No buttons
+         * @type Object
+         */
+        YESNO : {yes:true, no:true},
+        /**
+         * Button config that displays Yes, No and Cancel buttons
+         * @type Object
+         */
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        /**
+         * The CSS class that provides the INFO icon image
+         * @type String
+         */
+        INFO : 'ext-mb-info',
+        /**
+         * The CSS class that provides the WARNING icon image
+         * @type String
+         */
+        WARNING : 'ext-mb-warning',
+        /**
+         * The CSS class that provides the QUESTION icon image
+         * @type String
+         */
+        QUESTION : 'ext-mb-question',
+        /**
+         * The CSS class that provides the ERROR icon image
+         * @type String
+         */
+        ERROR : 'ext-mb-error',
+
+        /**
+         * The default height in pixels of the message box's multiline textarea if displayed (defaults to 75)
+         * @type Number
+         */
+        defaultTextHeight : 75,
+        /**
+         * The maximum width in pixels of the message box (defaults to 600)
+         * @type Number
+         */
+        maxWidth : 600,
+        /**
+         * The minimum width in pixels of the message box (defaults to 100)
+         * @type Number
+         */
+        minWidth : 100,
+        /**
+         * The minimum width in pixels of the message box if it is a progress-style dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minProgressWidth : 250,
+        /**
+         * The minimum width in pixels of the message box if it is a prompt dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minPromptWidth: 250,
+        /**
+         * An object containing the default button text strings that can be overriden for localized language support.
+         * Supported properties are: ok, cancel, yes and no.  Generally you should include a locale-specific
+         * resource file for handling language support across the framework.
+         * Customize the default text like so: Ext.MessageBox.buttonText.yes = "oui"; //french
+         * @type Object
+         */
+        buttonText : {
+            ok : "OK",
+            cancel : "Cancel",
+            yes : "Yes",
+            no : "No"
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.MessageBox}
+ */
+Ext.Msg = Ext.MessageBox;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ListView.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ListView.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ListView.js	(revision 76)
@@ -0,0 +1,389 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.list.ListView
+ * @extends Ext.DataView
+ * <p>Ext.list.ListView is a fast and light-weight implentation of a
+ * {@link Ext.grid.GridPanel Grid} like view with the following characteristics:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>resizable columns</li>
+ * <li>selectable</li>
+ * <li>column widths are initially proportioned by percentage based on the container
+ * width and number of columns</li>
+ * <li>uses templates to render the data in any required format</li>
+ * <li>no horizontal scrolling</li>
+ * <li>no editing</li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+// consume JSON of this form:
+{
+   "images":[
+      {
+         "name":"dance_fever.jpg",
+         "size":2067,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/dance_fever.jpg"
+      },
+      {
+         "name":"zack_sink.jpg",
+         "size":2303,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/zack_sink.jpg"
+      }
+   ]
+}
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var listView = new Ext.list.ListView({
+    store: store,
+    multiSelect: true,
+    emptyText: 'No images to display',
+    reserveScrollOffset: true,
+    columns: [{
+        header: 'File',
+        width: .5,
+        dataIndex: 'name'
+    },{
+        header: 'Last Modified',
+        width: .35,
+        dataIndex: 'lastmod',
+        tpl: '{lastmod:date("m-d h:i a")}'
+    },{
+        header: 'Size',
+        dataIndex: 'size',
+        tpl: '{size:fileSize}', // format using Ext.util.Format.fileSize()
+        align: 'right'
+    }]
+});
+
+// put it in a Panel so it looks pretty
+var panel = new Ext.Panel({
+    id:'images-view',
+    width:425,
+    height:250,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple ListView <i>(0 items selected)</i>',
+    items: listView
+});
+panel.render(document.body);
+
+// little bit of feedback
+listView.on('selectionchange', function(view, nodes){
+    var l = nodes.length;
+    var s = l != 1 ? 's' : '';
+    panel.setTitle('Simple ListView <i>('+l+' item'+s+' selected)</i>');
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ * @xtype listview
+ */
+Ext.list.ListView = Ext.extend(Ext.DataView, {
+    /**
+     * Set this property to <tt>true</tt> to disable the header click handler disabling sort
+     * (defaults to <tt>false</tt>).
+     * @type Boolean
+     * @property disableHeaders
+     */
+    /**
+     * @cfg {Boolean} hideHeaders
+     * <tt>true</tt> to hide the {@link #internalTpl header row} (defaults to <tt>false</tt> so
+     * the {@link #internalTpl header row} will be shown).
+     */
+    /**
+     * @cfg {String} itemSelector
+     * Defaults to <tt>'dl'</tt> to work with the preconfigured <b><tt>{@link Ext.DataView#tpl tpl}</tt></b>.
+     * This setting specifies the CSS selector (e.g. <tt>div.some-class</tt> or <tt>span:first-child</tt>)
+     * that will be used to determine what nodes the ListView will be working with.
+     */
+    itemSelector: 'dl',
+    /**
+     * @cfg {String} selectedClass The CSS class applied to a selected row (defaults to
+     * <tt>'x-list-selected'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-selected {background-color: yellow;}
+    </code></pre>
+     * @type String
+     */
+    selectedClass:'x-list-selected',
+    /**
+     * @cfg {String} overClass The CSS class applied when over a row (defaults to
+     * <tt>'x-list-over'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-over {background-color: orange;}
+    </code></pre>
+     * @type String
+     */
+    overClass:'x-list-over',
+    /**
+     * @cfg {Boolean} reserveScrollOffset
+     * By default will defer accounting for the configured <b><tt>{@link #scrollOffset}</tt></b>
+     * for 10 milliseconds.  Specify <tt>true</tt> to account for the configured
+     * <b><tt>{@link #scrollOffset}</tt></b> immediately.
+     */
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the scrollbar (defaults to
+     * <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+    /**
+     * @cfg {Boolean/Object} columnResize
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.ColumnResizer}
+     * to enable the columns to be resizable (defaults to <tt>true</tt>).
+     */
+    columnResize: true,
+    /**
+     * @cfg {Array} columns An array of column configuration objects, for example:
+     * <pre><code>
+{
+    align: 'right',
+    dataIndex: 'size',
+    header: 'Size',
+    tpl: '{size:fileSize}',
+    width: .35
+}
+     * </code></pre>
+     * Acceptable properties for each column configuration object are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>align</tt></b> : String<div class="sub-desc">Set the CSS text-align property
+     * of the column. Defaults to <tt>'left'</tt>.</div></li>
+     * <li><b><tt>dataIndex</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#dataIndex dataIndex} for details.</div></li>
+     * <li><b><tt>header</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#header header} for details.</div></li>
+     * <li><b><tt>tpl</tt></b> : String<div class="sub-desc">Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.</div></li>
+     * <li><b><tt>width</tt></b> : Number<div class="sub-desc">Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/Object} columnSort
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.Sorter}
+     * to enable the columns to be sortable (defaults to <tt>true</tt>).
+     */
+    columnSort: true,
+    /**
+     * @cfg {String/Array} internalTpl
+     * The template to be used for the header row.  See {@link #tpl} for more details.
+     */
+
+    /*
+     * IE has issues when setting percentage based widths to 100%. Default to 99.
+     */
+    maxColumnWidth: Ext.isIE ? 99 : 100,
+
+    initComponent : function(){
+        if(this.columnResize){
+            this.colResizer = new Ext.list.ColumnResizer(this.colResizer);
+            this.colResizer.init(this);
+        }
+        if(this.columnSort){
+            this.colSorter = new Ext.list.Sorter(this.columnSort);
+            this.colSorter.init(this);
+        }
+        if(!this.internalTpl){
+            this.internalTpl = new Ext.XTemplate(
+                '<div class="x-list-header"><div class="x-list-header-inner">',
+                    '<tpl for="columns">',
+                    '<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',
+                        '{header}',
+                    '</em></div>',
+                    '</tpl>',
+                    '<div class="x-clear"></div>',
+                '</div></div>',
+                '<div class="x-list-body"><div class="x-list-body-inner">',
+                '</div></div>'
+            );
+        }
+        if(!this.tpl){
+            this.tpl = new Ext.XTemplate(
+                '<tpl for="rows">',
+                    '<dl>',
+                        '<tpl for="parent.columns">',
+                        '<dt style="width:{[values.width*100]}%;text-align:{align};">',
+                        '<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',
+                            '{[values.tpl.apply(parent)]}',
+                        '</em></dt>',
+                        '</tpl>',
+                        '<div class="x-clear"></div>',
+                    '</dl>',
+                '</tpl>'
+            );
+        };
+
+        var cs = this.columns,
+            allocatedWidth = 0,
+            colsWithWidth = 0,
+            len = cs.length,
+            columns = [];
+
+        for(var i = 0; i < len; i++){
+            var c = cs[i];
+            if(!c.isColumn) {
+                c.xtype = c.xtype ? (/^lv/.test(c.xtype) ? c.xtype : 'lv' + c.xtype) : 'lvcolumn';
+                c = Ext.create(c);
+            }
+            if(c.width) {
+                allocatedWidth += c.width*100;
+                if(allocatedWidth > this.maxColumnWidth){
+                    c.width -= (allocatedWidth - this.maxColumnWidth) / 100;
+                }
+                colsWithWidth++;
+            }
+            columns.push(c);
+        }
+
+        cs = this.columns = columns;
+
+        // auto calculate missing column widths
+        if(colsWithWidth < len){
+            var remaining = len - colsWithWidth;
+            if(allocatedWidth < this.maxColumnWidth){
+                var perCol = ((this.maxColumnWidth-allocatedWidth) / remaining)/100;
+                for(var j = 0; j < len; j++){
+                    var c = cs[j];
+                    if(!c.width){
+                        c.width = perCol;
+                    }
+                }
+            }
+        }
+        Ext.list.ListView.superclass.initComponent.call(this);
+    },
+
+    onRender : function(){
+        this.autoEl = {
+            cls: 'x-list-wrap'
+        };
+        Ext.list.ListView.superclass.onRender.apply(this, arguments);
+
+        this.internalTpl.overwrite(this.el, {columns: this.columns});
+
+        this.innerBody = Ext.get(this.el.dom.childNodes[1].firstChild);
+        this.innerHd = Ext.get(this.el.dom.firstChild.firstChild);
+
+        if(this.hideHeaders){
+            this.el.dom.firstChild.style.display = 'none';
+        }
+    },
+
+    getTemplateTarget : function(){
+        return this.innerBody;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * view's {@link #tpl template} to render the whole ListView. The returned object
+     * shall contain the following properties:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><b>columns</b> : String<div class="sub-desc">See <tt>{@link #columns}</tt></div></li>
+     * <li><b>rows</b> : String<div class="sub-desc">See
+     * <tt>{@link Ext.DataView}.{@link Ext.DataView#collectData collectData}</div></li>
+     * </ul></div>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Object} A data object containing properties to be processed by a repeating
+     * XTemplate as described above.
+     */
+    collectData : function(){
+        var rs = Ext.list.ListView.superclass.collectData.apply(this, arguments);
+        return {
+            columns: this.columns,
+            rows: rs
+        };
+    },
+
+    verifyInternalSize : function(){
+        if(this.lastSize){
+            this.onResize(this.lastSize.width, this.lastSize.height);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        var body = this.innerBody.dom,
+            header = this.innerHd.dom,
+            scrollWidth = w - Ext.num(this.scrollOffset, Ext.getScrollBarWidth()) + 'px',
+            parentNode;
+            
+        if(!body){
+            return;
+        }
+        parentNode = body.parentNode;
+        if(Ext.isNumber(w)){
+            if(this.reserveScrollOffset || ((parentNode.offsetWidth - parentNode.clientWidth) > 10)){
+                body.style.width = scrollWidth;
+                header.style.width = scrollWidth;
+            }else{
+                body.style.width = w + 'px';
+                header.style.width = w + 'px';
+                setTimeout(function(){
+                    if((parentNode.offsetWidth - parentNode.clientWidth) > 10){
+                        body.style.width = scrollWidth;
+                        header.style.width = scrollWidth;
+                    }
+                }, 10);
+            }
+        }
+        if(Ext.isNumber(h)){
+            parentNode.style.height = Math.max(0, h - header.parentNode.offsetHeight) + 'px';
+        }
+    },
+
+    updateIndexes : function(){
+        Ext.list.ListView.superclass.updateIndexes.apply(this, arguments);
+        this.verifyInternalSize();
+    },
+
+    findHeaderIndex : function(header){
+        header = header.dom || header;
+        var parentNode = header.parentNode, 
+            children = parentNode.parentNode.childNodes,
+            i = 0,
+            c;
+        for(; c = children[i]; i++){
+            if(c == parentNode){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    setHdWidths : function(){
+        var els = this.innerHd.dom.getElementsByTagName('div'),
+            i = 0,
+            columns = this.columns,
+            len = columns.length;
+            
+        for(; i < len; i++){
+            els[i].style.width = (columns[i].width*100) + '%';
+        }
+    }
+});
+
+Ext.reg('listview', Ext.list.ListView);
+
+// Backwards compatibility alias
+Ext.ListView = Ext.list.ListView;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Column.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Column.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Column.js	(revision 76)
@@ -0,0 +1,158 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.list.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.list.ListView ListView}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.list.Column = Ext.extend(Object, {
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ListView constructor method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ListView will recreate a new Ext.list.Column
+     * Defaults to true.
+     */
+    isColumn: true,
+    
+    /**
+     * @cfg {String} align
+     * Set the CSS text-align property of the column. Defaults to <tt>'left'</tt>.
+     */        
+    align: 'left',
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the ListView.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&#160;'</tt>.
+     */    
+    header: '',
+    
+    /**
+     * @cfg {Number} width Optional. Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.
+     */    
+    width: null,
+
+    /**
+     * @cfg {String} cls Optional. This option can be used to add a CSS class to the cell of each
+     * row for this column.
+     */
+    cls: '',
+    
+    /**
+     * @cfg {String} tpl Optional. Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.
+     */
+
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * ListViews's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    
+    constructor : function(c){
+        if(!c.tpl){
+            c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');
+        }
+        else if(Ext.isString(c.tpl)){
+            c.tpl = new Ext.XTemplate(c.tpl);
+        }
+        
+        Ext.apply(this, c);
+    }
+});
+
+Ext.reg('lvcolumn', Ext.list.Column);
+
+/**
+ * @class Ext.list.NumberColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.NumberColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */    
+    format: '0,000.00',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':number("' + (c.format || this.format) + '")}');       
+        Ext.list.NumberColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvnumbercolumn', Ext.list.NumberColumn);
+
+/**
+ * @class Ext.list.DateColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column}
+ * for more details.</p>
+ */
+Ext.list.DateColumn = Ext.extend(Ext.list.Column, {
+    format: 'm/d/Y',
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':date("' + (c.format || this.format) + '")}');      
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+Ext.reg('lvdatecolumn', Ext.list.DateColumn);
+
+/**
+ * @class Ext.list.BooleanColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.list.Column#xtype xtype}
+ * config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.BooleanColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsey (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}');
+        
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        c.tpl.format = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+        
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvbooleancolumn', Ext.list.BooleanColumn);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Sorter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Sorter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/Sorter.js	(revision 76)
@@ -0,0 +1,73 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.list.Sorter
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.Sorter = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Array} sortClasses
+     * The CSS classes applied to a header when it is sorted. (defaults to <tt>["sort-asc", "sort-desc"]</tt>)
+     */
+    sortClasses : ["sort-asc", "sort-desc"],
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.Sorter.superclass.constructor.call(this);
+    },
+
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'click', this.onHdClick, this);
+        view.innerHd.setStyle('cursor', 'pointer');
+        view.mon(view.store, 'datachanged', this.updateSortState, this);
+        this.updateSortState.defer(10, this, [view.store]);
+    },
+
+    updateSortState : function(store){
+        var state = store.getSortState();
+        if(!state){
+            return;
+        }
+        this.sortState = state;
+        var cs = this.view.columns, sortColumn = -1;
+        for(var i = 0, len = cs.length; i < len; i++){
+            if(cs[i].dataIndex == state.field){
+                sortColumn = i;
+                break;
+            }
+        }
+        if(sortColumn != -1){
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    updateSortIcon : function(col, dir){
+        var sc = this.sortClasses;
+        var hds = this.view.innerHd.select('em').removeClass(sc);
+        hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);
+    },
+
+    onHdClick : function(e){
+        var hd = e.getTarget('em', 3);
+        if(hd && !this.view.disableHeaders){
+            var index = this.view.findHeaderIndex(hd);
+            this.view.store.sort(this.view.columns[index].dataIndex);
+        }
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.Sorter = Ext.list.Sorter;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ColumnResizer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ColumnResizer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/list/ColumnResizer.js	(revision 76)
@@ -0,0 +1,159 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.list.ColumnResizer
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.ColumnResizer = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} minPct The minimum percentage to allot for any column (defaults to <tt>.05</tt>)
+     */
+    minPct: .05,
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.ColumnResizer.superclass.constructor.call(this);
+    },
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeStart.createDelegate(this),
+            onStart: this.onStart.createDelegate(this),
+            onDrag: this.onDrag.createDelegate(this),
+            onEnd: this.onEnd.createDelegate(this),
+            tolerance: 3,
+            autoStart: 300
+        });
+        this.tracker.initEl(view.innerHd);
+        view.on('beforedestroy', this.tracker.destroy, this.tracker);
+    },
+
+    handleHdMove : function(e, t){
+        var handleWidth = 5,
+            x = e.getPageX(),
+            header = e.getTarget('em', 3, true);
+        if(header){
+            var region = header.getRegion(),
+                style = header.dom.style,
+                parentNode = header.dom.parentNode;
+
+            if(x - region.left <= handleWidth && parentNode != parentNode.parentNode.firstChild){
+                this.activeHd = Ext.get(parentNode.previousSibling.firstChild);
+                style.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';
+            } else if(region.right - x <= handleWidth && parentNode != parentNode.parentNode.lastChild.previousSibling){
+                this.activeHd = header;
+                style.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';
+            } else{
+                delete this.activeHd;
+                style.cursor = '';
+            }
+        }
+    },
+
+    onBeforeStart : function(e){
+        this.dragHd = this.activeHd;
+        return !!this.dragHd;
+    },
+
+    onStart: function(e){
+        
+        var me = this,
+            view = me.view,
+            dragHeader = me.dragHd,
+            x = me.tracker.getXY()[0];            
+        
+        me.proxy = view.el.createChild({cls:'x-list-resizer'});
+        me.dragX = dragHeader.getX();
+        me.headerIndex = view.findHeaderIndex(dragHeader);
+        
+        me.headersDisabled = view.disableHeaders;
+        view.disableHeaders = true;
+        
+        me.proxy.setHeight(view.el.getHeight());
+        me.proxy.setX(me.dragX);
+        me.proxy.setWidth(x - me.dragX);
+        
+        this.setBoundaries();
+        
+    },
+    
+    // Sets up the boundaries for the drag/drop operation
+    setBoundaries: function(relativeX){
+        var view = this.view,
+            headerIndex = this.headerIndex,
+            width = view.innerHd.getWidth(),
+            relativeX = view.innerHd.getX(),
+            minWidth = Math.ceil(width * this.minPct),
+            maxWidth = width - minWidth,
+            numColumns = view.columns.length,
+            headers = view.innerHd.select('em', true),
+            minX = minWidth + relativeX,
+            maxX = maxWidth + relativeX,
+            header;
+          
+        if (numColumns == 2) {
+            this.minX = minX;
+            this.maxX = maxX;
+        }else{
+            header = headers.item(headerIndex + 2);
+            this.minX = headers.item(headerIndex).getX() + minWidth;
+            this.maxX = header ? header.getX() - minWidth : maxX;
+            if (headerIndex == 0) {
+                // First
+                this.minX = minX;
+            } else if (headerIndex == numColumns - 2) {
+                // Last
+                this.maxX = maxX;
+            }
+        }
+    },
+
+    onDrag: function(e){
+        var me = this,
+            cursorX = me.tracker.getXY()[0].constrain(me.minX, me.maxX);
+            
+        me.proxy.setWidth(cursorX - this.dragX);
+    },
+
+    onEnd: function(e){
+        /* calculate desired width by measuring proxy and then remove it */
+        var newWidth = this.proxy.getWidth(),
+            index = this.headerIndex,
+            view = this.view,
+            columns = view.columns,
+            width = view.innerHd.getWidth(),
+            newPercent = Math.ceil(newWidth * view.maxColumnWidth / width) / 100,
+            disabled = this.headersDisabled,
+            headerCol = columns[index],
+            otherCol = columns[index + 1],
+            totalPercent = headerCol.width + otherCol.width;
+
+        this.proxy.remove();
+
+        headerCol.width = newPercent;
+        otherCol.width = totalPercent - newPercent;
+      
+        delete this.dragHd;
+        view.setHdWidths();
+        view.refresh();
+        
+        setTimeout(function(){
+            view.disableHeaders = disabled;
+        }, 100);
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.ColumnResizer = Ext.list.ColumnResizer;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AutoLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AutoLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AutoLayout.js	(revision 76)
@@ -0,0 +1,32 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.AutoLayout
+ * <p>The AutoLayout is the default layout manager delegated by {@link Ext.Container} to
+ * render any child Components when no <tt>{@link Ext.Container#layout layout}</tt> is configured into
+ * a {@link Ext.Container Container}.</tt>.  AutoLayout provides only a passthrough of any layout calls
+ * to any child containers.</p>
+ */
+Ext.layout.AutoLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    type: 'auto',
+
+    monitorResize: true,
+
+    onLayout : function(ct, target){
+        Ext.layout.AutoLayout.superclass.onLayout.call(this, ct, target);
+        var cs = this.getRenderedItems(ct), len = cs.length, i, c;
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            if (c.doLayout){
+                // Shallow layout children
+                c.doLayout(true);
+            }
+        }
+    }
+});
+
+Ext.Container.LAYOUTS['auto'] = Ext.layout.AutoLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/CardLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/CardLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/CardLayout.js	(revision 76)
@@ -0,0 +1,147 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.CardLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This layout manages multiple child Components, each fitted to the Container, where only a single child Component can be
+ * visible at any given time.  This layout style is most commonly used for wizards, tab implementations, etc.
+ * This class is intended to be extended or created via the layout:'card' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>The CardLayout's focal method is {@link #setActiveItem}.  Since only one panel is displayed at a time,
+ * the only way to move from one Component to the next is by calling setActiveItem, passing the id or index of
+ * the next panel to display.  The layout itself does not provide a user interface for handling this navigation,
+ * so that functionality must be provided by the developer.</p>
+ * <p>In the following example, a simplistic wizard setup is demonstrated.  A button bar is added
+ * to the footer of the containing panel to provide navigation buttons.  The buttons will be handled by a
+ * common navigation routine -- for this example, the implementation of that routine has been ommitted since
+ * it can be any type of custom logic.  Note that other uses of a CardLayout (like a tab control) would require a
+ * completely different implementation.  For serious implementations, a better approach would be to extend
+ * CardLayout to provide the custom functionality needed.  Example usage:</p>
+ * <pre><code>
+var navHandler = function(direction){
+    // This routine could contain business logic required to manage the navigation steps.
+    // It would call setActiveItem as needed, manage navigation button state, handle any
+    // branching logic that might be required, handle alternate actions like cancellation
+    // or finalization, etc.  A complete wizard implementation could get pretty
+    // sophisticated depending on the complexity required, and should probably be
+    // done as a subclass of CardLayout in a real-world implementation.
+};
+
+var card = new Ext.Panel({
+    title: 'Example Wizard',
+    layout:'card',
+    activeItem: 0, // make sure the active item is set on the container config!
+    bodyStyle: 'padding:15px',
+    defaults: {
+        // applied to each contained panel
+        border:false
+    },
+    // just an example of one possible navigation scheme, using buttons
+    bbar: [
+        {
+            id: 'move-prev',
+            text: 'Back',
+            handler: navHandler.createDelegate(this, [-1]),
+            disabled: true
+        },
+        '->', // greedy spacer so that the buttons are aligned to each side
+        {
+            id: 'move-next',
+            text: 'Next',
+            handler: navHandler.createDelegate(this, [1])
+        }
+    ],
+    // the panels (or "cards") within the layout
+    items: [{
+        id: 'card-0',
+        html: '&lt;h1&gt;Welcome to the Wizard!&lt;/h1&gt;&lt;p&gt;Step 1 of 3&lt;/p&gt;'
+    },{
+        id: 'card-1',
+        html: '&lt;p&gt;Step 2 of 3&lt;/p&gt;'
+    },{
+        id: 'card-2',
+        html: '&lt;h1&gt;Congratulations!&lt;/h1&gt;&lt;p&gt;Step 3 of 3 - Complete&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.CardLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} deferredRender
+     * True to render each contained item at the time it becomes active, false to render all contained items
+     * as soon as the layout is rendered (defaults to false).  If there is a significant amount of content or
+     * a lot of heavy controls being rendered into panels that are not displayed by default, setting this to
+     * true might improve performance.
+     */
+    deferredRender : false,
+
+    /**
+     * @cfg {Boolean} layoutOnCardChange
+     * True to force a layout of the active item when the active card is changed. Defaults to false.
+     */
+    layoutOnCardChange : false,
+
+    /**
+     * @cfg {Boolean} renderHidden @hide
+     */
+    // private
+    renderHidden : true,
+
+    type: 'card',
+
+    /**
+     * Sets the active (visible) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        var ai = this.activeItem,
+            ct = this.container;
+        item = ct.getComponent(item);
+
+        // Is this a valid, different card?
+        if(item && ai != item){
+
+            // Changing cards, hide the current one
+            if(ai){
+                ai.hide();
+                if (ai.hidden !== true) {
+                    return false;
+                }
+                ai.fireEvent('deactivate', ai);
+            }
+
+            var layout = item.doLayout && (this.layoutOnCardChange || !item.rendered);
+
+            // Change activeItem reference
+            this.activeItem = item;
+
+            // The container is about to get a recursive layout, remove any deferLayout reference
+            // because it will trigger a redundant layout.
+            delete item.deferLayout;
+
+            // Show the new component
+            item.show();
+
+            this.layout();
+
+            if(layout){
+                item.doLayout();
+            }
+            item.fireEvent('activate', item);
+        }
+    },
+
+    // private
+    renderAll : function(ct, target){
+        if(this.deferredRender){
+            this.renderItem(this.activeItem, undefined, target);
+        }else{
+            Ext.layout.CardLayout.superclass.renderAll.call(this, ct, target);
+        }
+    }
+});
+Ext.Container.LAYOUTS['card'] = Ext.layout.CardLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AnchorLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AnchorLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AnchorLayout.js	(revision 76)
@@ -0,0 +1,266 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.AnchorLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a layout that enables anchoring of contained elements relative to the container's dimensions.
+ * If the container is resized, all anchored items are automatically rerendered according to their
+ * <b><tt>{@link #anchor}</tt></b> rules.</p>
+ * <p>This class is intended to be extended or created via the layout:'anchor' {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>AnchorLayout does not have any direct config options (other than inherited ones). By default,
+ * AnchorLayout will calculate anchor measurements based on the size of the container itself. However, the
+ * container using the AnchorLayout can supply an anchoring-specific config property of <b>anchorSize</b>.
+ * If anchorSize is specifed, the layout will use it as a virtual container for the purposes of calculating
+ * anchor measurements based on it instead, allowing the container to be sized independently of the anchoring
+ * logic if necessary.  For example:</p>
+ * <pre><code>
+var viewport = new Ext.Viewport({
+    layout:'anchor',
+    anchorSize: {width:800, height:600},
+    items:[{
+        title:'Item 1',
+        html:'Content 1',
+        width:800,
+        anchor:'right 20%'
+    },{
+        title:'Item 2',
+        html:'Content 2',
+        width:300,
+        anchor:'50% 30%'
+    },{
+        title:'Item 3',
+        html:'Content 3',
+        width:600,
+        anchor:'-100 50%'
+    }]
+});
+ * </code></pre>
+ */
+Ext.layout.AnchorLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {String} anchor
+     * <p>This configuation option is to be applied to <b>child <tt>items</tt></b> of a container managed by
+     * this layout (ie. configured with <tt>layout:'anchor'</tt>).</p><br/>
+     *
+     * <p>This value is what tells the layout how an item should be anchored to the container. <tt>items</tt>
+     * added to an AnchorLayout accept an anchoring-specific config property of <b>anchor</b> which is a string
+     * containing two values: the horizontal anchor value and the vertical anchor value (for example, '100% 50%').
+     * The following types of anchor values are supported:<div class="mdetail-params"><ul>
+     *
+     * <li><b>Percentage</b> : Any value between 1 and 100, expressed as a percentage.<div class="sub-desc">
+     * The first anchor is the percentage width that the item should take up within the container, and the
+     * second is the percentage height.  For example:<pre><code>
+// two values specified
+anchor: '100% 50%' // render item complete width of the container and
+                   // 1/2 height of the container
+// one value specified
+anchor: '100%'     // the width value; the height will default to auto
+     * </code></pre></div></li>
+     *
+     * <li><b>Offsets</b> : Any positive or negative integer value.<div class="sub-desc">
+     * This is a raw adjustment where the first anchor is the offset from the right edge of the container,
+     * and the second is the offset from the bottom edge. For example:<pre><code>
+// two values specified
+anchor: '-50 -100' // render item the complete width of the container
+                   // minus 50 pixels and
+                   // the complete height minus 100 pixels.
+// one value specified
+anchor: '-50'      // anchor value is assumed to be the right offset value
+                   // bottom offset will default to 0
+     * </code></pre></div></li>
+     *
+     * <li><b>Sides</b> : Valid values are <tt>'right'</tt> (or <tt>'r'</tt>) and <tt>'bottom'</tt>
+     * (or <tt>'b'</tt>).<div class="sub-desc">
+     * Either the container must have a fixed size or an anchorSize config value defined at render time in
+     * order for these to have any effect.</div></li>
+     *
+     * <li><b>Mixed</b> : <div class="sub-desc">
+     * Anchor values can also be mixed as needed.  For example, to render the width offset from the container
+     * right edge by 50 pixels and 75% of the container's height use:
+     * <pre><code>
+anchor: '-50 75%'
+     * </code></pre></div></li>
+     *
+     *
+     * </ul></div>
+     */
+
+    // private
+    monitorResize : true,
+
+    type : 'anchor',
+
+    /**
+     * @cfg {String} defaultAnchor
+     *
+     * default anchor for all child container items applied if no anchor or specific width is set on the child item.  Defaults to '100%'.
+     *
+     */
+    defaultAnchor : '100%',
+
+    parseAnchorRE : /^(r|right|b|bottom)$/i,
+
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret = {};
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    // private
+    onLayout : function(container, target) {
+        Ext.layout.AnchorLayout.superclass.onLayout.call(this, container, target);
+
+        var size = this.getLayoutTargetSize(),
+            containerWidth = size.width,
+            containerHeight = size.height,
+            overflow = target.getStyle('overflow'),
+            components = this.getRenderedItems(container),
+            len = components.length,
+            boxes = [],
+            box,
+            anchorWidth,
+            anchorHeight,
+            component,
+            anchorSpec,
+            calcWidth,
+            calcHeight,
+            anchorsArray,
+            totalHeight = 0,
+            i,
+            el;
+
+        if(containerWidth < 20 && containerHeight < 20){
+            return;
+        }
+
+        // find the container anchoring size
+        if(container.anchorSize) {
+            if(typeof container.anchorSize == 'number') {
+                anchorWidth = container.anchorSize;
+            } else {
+                anchorWidth = container.anchorSize.width;
+                anchorHeight = container.anchorSize.height;
+            }
+        } else {
+            anchorWidth = container.initialConfig.width;
+            anchorHeight = container.initialConfig.height;
+        }
+
+        for(i = 0; i < len; i++) {
+            component = components[i];
+            el = component.getPositionEl();
+
+            // If a child container item has no anchor and no specific width, set the child to the default anchor size
+            if (!component.anchor && component.items && !Ext.isNumber(component.width) && !(Ext.isIE6 && Ext.isStrict)){
+                component.anchor = this.defaultAnchor;
+            }
+
+            if(component.anchor) {
+                anchorSpec = component.anchorSpec;
+                // cache all anchor values
+                if(!anchorSpec){
+                    anchorsArray = component.anchor.split(' ');
+                    component.anchorSpec = anchorSpec = {
+                        right: this.parseAnchor(anchorsArray[0], component.initialConfig.width, anchorWidth),
+                        bottom: this.parseAnchor(anchorsArray[1], component.initialConfig.height, anchorHeight)
+                    };
+                }
+                calcWidth = anchorSpec.right ? this.adjustWidthAnchor(anchorSpec.right(containerWidth) - el.getMargins('lr'), component) : undefined;
+                calcHeight = anchorSpec.bottom ? this.adjustHeightAnchor(anchorSpec.bottom(containerHeight) - el.getMargins('tb'), component) : undefined;
+
+                if(calcWidth || calcHeight) {
+                    boxes.push({
+                        component: component,
+                        width: calcWidth || undefined,
+                        height: calcHeight || undefined
+                    });
+                }
+            }
+        }
+        for (i = 0, len = boxes.length; i < len; i++) {
+            box = boxes[i];
+            box.component.setSize(box.width, box.height);
+        }
+
+        if (overflow && overflow != 'hidden' && !this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != size.width || newTargetSize.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    parseAnchor : function(a, start, cstart) {
+        if (a && a != 'none') {
+            var last;
+            // standard anchor
+            if (this.parseAnchorRE.test(a)) {
+                var diff = cstart - start;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return v - diff;
+                    }
+                };
+            // percentage
+            } else if(a.indexOf('%') != -1) {
+                var ratio = parseFloat(a.replace('%', ''))*.01;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return Math.floor(v*ratio);
+                    }
+                };
+            // simple offset adjustment
+            } else {
+                a = parseInt(a, 10);
+                if (!isNaN(a)) {
+                    return function(v) {
+                        if (v !== last) {
+                            last = v;
+                            return v + a;
+                        }
+                    };
+                }
+            }
+        }
+        return false;
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return value;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['anchor'] = Ext.layout.AnchorLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BorderLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BorderLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BorderLayout.js	(revision 76)
@@ -0,0 +1,1151 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.BorderLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a multi-pane, application-oriented UI layout style that supports multiple
+ * nested panels, automatic {@link Ext.layout.BorderLayout.Region#split split} bars between
+ * {@link Ext.layout.BorderLayout.Region#BorderLayout.Region regions} and built-in
+ * {@link Ext.layout.BorderLayout.Region#collapsible expanding and collapsing} of regions.</p>
+ * <p>This class is intended to be extended or created via the <tt>layout:'border'</tt>
+ * {@link Ext.Container#layout} config, and should generally not need to be created directly
+ * via the new keyword.</p>
+ * <p>BorderLayout does not have any direct config options (other than inherited ones).
+ * All configuration options available for customizing the BorderLayout are at the
+ * {@link Ext.layout.BorderLayout.Region} and {@link Ext.layout.BorderLayout.SplitRegion}
+ * levels.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var myBorderPanel = new Ext.Panel({
+    {@link Ext.Component#renderTo renderTo}: document.body,
+    {@link Ext.BoxComponent#width width}: 700,
+    {@link Ext.BoxComponent#height height}: 500,
+    {@link Ext.Panel#title title}: 'Border Layout',
+    {@link Ext.Container#layout layout}: 'border',
+    {@link Ext.Container#items items}: [{
+        {@link Ext.Panel#title title}: 'South Region is resizable',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'south',     // position for region
+        {@link Ext.BoxComponent#height height}: 100,
+        {@link Ext.layout.BorderLayout.Region#split split}: true,         // enable resizing
+        {@link Ext.SplitBar#minSize minSize}: 75,         // defaults to {@link Ext.layout.BorderLayout.Region#minHeight 50}
+        {@link Ext.SplitBar#maxSize maxSize}: 150,
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '0 5 5 5'
+    },{
+        // xtype: 'panel' implied by default
+        {@link Ext.Panel#title title}: 'West Region is collapsible',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}:'west',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 0 0 5',
+        {@link Ext.BoxComponent#width width}: 200,
+        {@link Ext.layout.BorderLayout.Region#collapsible collapsible}: true,   // make collapsible
+        {@link Ext.layout.BorderLayout.Region#cmargins cmargins}: '5 5 0 5', // adjust top margin when collapsed
+        {@link Ext.Component#id id}: 'west-region-container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.Panel#unstyled unstyled}: true
+    },{
+        {@link Ext.Panel#title title}: 'Center Region',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'center',     // center region is required, no width/height specified
+        {@link Ext.Component#xtype xtype}: 'container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 5 0 0'
+    }]
+});
+</code></pre>
+ * <p><b><u>Notes</u></b>:</p><div class="mdetail-params"><ul>
+ * <li>Any container using the BorderLayout <b>must</b> have a child item with <tt>region:'center'</tt>.
+ * The child item in the center region will always be resized to fill the remaining space not used by
+ * the other regions in the layout.</li>
+ * <li>Any child items with a region of <tt>west</tt> or <tt>east</tt> must have <tt>width</tt> defined
+ * (an integer representing the number of pixels that the region should take up).</li>
+ * <li>Any child items with a region of <tt>north</tt> or <tt>south</tt> must have <tt>height</tt> defined.</li>
+ * <li>The regions of a BorderLayout are <b>fixed at render time</b> and thereafter, its child Components may not be removed or added</b>.  To add/remove
+ * Components within a BorderLayout, have them wrapped by an additional Container which is directly
+ * managed by the BorderLayout.  If the region is to be collapsible, the Container used directly
+ * by the BorderLayout manager should be a Panel.  In the following example a Container (an Ext.Panel)
+ * is added to the west region:
+ * <div style="margin-left:16px"><pre><code>
+wrc = {@link Ext#getCmp Ext.getCmp}('west-region-container');
+wrc.{@link Ext.Panel#removeAll removeAll}();
+wrc.{@link Ext.Container#add add}({
+    title: 'Added Panel',
+    html: 'Some content'
+});
+wrc.{@link Ext.Container#doLayout doLayout}();
+ * </code></pre></div>
+ * </li>
+ * <li> To reference a {@link Ext.layout.BorderLayout.Region Region}:
+ * <div style="margin-left:16px"><pre><code>
+wr = myBorderPanel.layout.west;
+ * </code></pre></div>
+ * </li>
+ * </ul></div>
+ */
+Ext.layout.BorderLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+    // private
+    rendered : false,
+
+    type: 'border',
+
+    targetCls: 'x-border-layout-ct',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        return target ? target.getViewSize() : {};
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var collapsed, i, c, pos, items = ct.items.items, len = items.length;
+        if(!this.rendered){
+            collapsed = [];
+            for(i = 0; i < len; i++) {
+                c = items[i];
+                pos = c.region;
+                if(c.collapsed){
+                    collapsed.push(c);
+                }
+                c.collapsed = false;
+                if(!c.rendered){
+                    c.render(target, i);
+                    c.getPositionEl().addClass('x-border-panel');
+                }
+                this[pos] = pos != 'center' && c.split ?
+                    new Ext.layout.BorderLayout.SplitRegion(this, c.initialConfig, pos) :
+                    new Ext.layout.BorderLayout.Region(this, c.initialConfig, pos);
+                this[pos].render(target, c);
+            }
+            this.rendered = true;
+        }
+
+        var size = this.getLayoutTargetSize();
+        if(size.width < 20 || size.height < 20){ // display none?
+            if(collapsed){
+                this.restoreCollapsed = collapsed;
+            }
+            return;
+        }else if(this.restoreCollapsed){
+            collapsed = this.restoreCollapsed;
+            delete this.restoreCollapsed;
+        }
+
+        var w = size.width, h = size.height,
+            centerW = w, centerH = h, centerY = 0, centerX = 0,
+            n = this.north, s = this.south, west = this.west, e = this.east, c = this.center,
+            b, m, totalWidth, totalHeight;
+        if(!c && Ext.layout.BorderLayout.WARN !== false){
+            throw 'No center region defined in BorderLayout ' + ct.id;
+        }
+
+        if(n && n.isVisible()){
+            b = n.getSize();
+            m = n.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            b.y = m.top;
+            centerY = b.height + b.y + m.bottom;
+            centerH -= centerY;
+            n.applyLayout(b);
+        }
+        if(s && s.isVisible()){
+            b = s.getSize();
+            m = s.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            totalHeight = (b.height + m.top + m.bottom);
+            b.y = h - totalHeight + m.top;
+            centerH -= totalHeight;
+            s.applyLayout(b);
+        }
+        if(west && west.isVisible()){
+            b = west.getSize();
+            m = west.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            b.x = m.left;
+            b.y = centerY + m.top;
+            totalWidth = (b.width + m.left + m.right);
+            centerX += totalWidth;
+            centerW -= totalWidth;
+            west.applyLayout(b);
+        }
+        if(e && e.isVisible()){
+            b = e.getSize();
+            m = e.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            totalWidth = (b.width + m.left + m.right);
+            b.x = w - totalWidth + m.left;
+            b.y = centerY + m.top;
+            centerW -= totalWidth;
+            e.applyLayout(b);
+        }
+        if(c){
+            m = c.getMargins();
+            var centerBox = {
+                x: centerX + m.left,
+                y: centerY + m.top,
+                width: centerW - (m.left+m.right),
+                height: centerH - (m.top+m.bottom)
+            };
+            c.applyLayout(centerBox);
+        }
+        if(collapsed){
+            for(i = 0, len = collapsed.length; i < len; i++){
+                collapsed[i].collapse(false);
+            }
+        }
+        if(Ext.isIE && Ext.isStrict){ // workaround IE strict repainting issue
+            target.repaint();
+        }
+        // Putting a border layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+            var ts = this.getLayoutTargetSize();
+            if (ts.width != size.width || ts.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(ct, target);
+            }
+        }
+        delete this.adjustmentPass;
+    },
+
+    destroy: function() {
+        var r = ['north', 'south', 'east', 'west'], i, region;
+        for (i = 0; i < r.length; i++) {
+            region = this[r[i]];
+            if(region){
+                if(region.destroy){
+                    region.destroy();
+                }else if (region.split){
+                    region.split.destroy(true);
+                }
+            }
+        }
+        Ext.layout.BorderLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+/**
+ * @class Ext.layout.BorderLayout.Region
+ * <p>This is a region of a {@link Ext.layout.BorderLayout BorderLayout} that acts as a subcontainer
+ * within the layout.  Each region has its own {@link Ext.layout.ContainerLayout layout} that is
+ * independent of other regions and the containing BorderLayout, and can be any of the
+ * {@link Ext.layout.ContainerLayout valid Ext layout types}.</p>
+ * <p>Region size is managed automatically and cannot be changed by the user -- for
+ * {@link #split resizable regions}, see {@link Ext.layout.BorderLayout.SplitRegion}.</p>
+ * @constructor
+ * Create a new Region.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: <tt>north</tt>, <tt>south</tt>,
+ * <tt>east</tt>, <tt>west</tt> and <tt>center</tt>.  Every {@link Ext.layout.BorderLayout BorderLayout}
+ * <b>must have a center region</b> for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.Region = function(layout, config, pos){
+    Ext.apply(this, config);
+    this.layout = layout;
+    this.position = pos;
+    this.state = {};
+    if(typeof this.margins == 'string'){
+        this.margins = this.layout.parseMargins(this.margins);
+    }
+    this.margins = Ext.applyIf(this.margins || {}, this.defaultMargins);
+    if(this.collapsible){
+        if(typeof this.cmargins == 'string'){
+            this.cmargins = this.layout.parseMargins(this.cmargins);
+        }
+        if(this.collapseMode == 'mini' && !this.cmargins){
+            this.cmargins = {left:0,top:0,right:0,bottom:0};
+        }else{
+            this.cmargins = Ext.applyIf(this.cmargins || {},
+                pos == 'north' || pos == 'south' ? this.defaultNSCMargins : this.defaultEWCMargins);
+        }
+    }
+};
+
+Ext.layout.BorderLayout.Region.prototype = {
+    /**
+     * @cfg {Boolean} animFloat
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel that will close again once the user mouses out of that panel (or clicks out if
+     * <tt>{@link #autoHide} = false</tt>).  Setting <tt>{@link #animFloat} = false</tt> will
+     * prevent the open and close of these floated panels from being animated (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {Boolean} autoHide
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel.  If <tt>autoHide = true</tt>, the panel will automatically hide after the user mouses
+     * out of the panel.  If <tt>autoHide = false</tt>, the panel will continue to display until the
+     * user clicks outside of the panel (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {String} collapseMode
+     * <tt>collapseMode</tt> supports two configuration values:<div class="mdetail-params"><ul>
+     * <li><b><tt>undefined</tt></b> (default)<div class="sub-desc">By default, {@link #collapsible}
+     * regions are collapsed by clicking the expand/collapse tool button that renders into the region's
+     * title bar.</div></li>
+     * <li><b><tt>'mini'</tt></b><div class="sub-desc">Optionally, when <tt>collapseMode</tt> is set to
+     * <tt>'mini'</tt> the region's split bar will also display a small collapse button in the center of
+     * the bar. In <tt>'mini'</tt> mode the region will collapse to a thinner bar than in normal mode.
+     * </div></li>
+     * </ul></div></p>
+     * <p><b>Note</b>: if a collapsible region does not have a title bar, then set <tt>collapseMode =
+     * 'mini'</tt> and <tt>{@link #split} = true</tt> in order for the region to be {@link #collapsible}
+     * by the user as the expand/collapse tool button (that would go in the title bar) will not be rendered.</p>
+     * <p>See also <tt>{@link #cmargins}</tt>.</p>
+     */
+    /**
+     * @cfg {Object} margins
+     * An object containing margins to apply to the region when in the expanded state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} cmargins
+     * An object containing margins to apply to the region when in the collapsed state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values.</p>
+     * <p><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></p>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <p><tt>true</tt> to allow the user to collapse this region (defaults to <tt>false</tt>).  If
+     * <tt>true</tt>, an expand/collapse tool button will automatically be rendered into the title
+     * bar of the region, otherwise the button will not be shown.</p>
+     * <p><b>Note</b>: that a title bar is required to display the collapse/expand toggle button -- if
+     * no <tt>title</tt> is specified for the region's panel, the region will only be collapsible if
+     * <tt>{@link #collapseMode} = 'mini'</tt> and <tt>{@link #split} = true</tt>.
+     */
+    collapsible : false,
+    /**
+     * @cfg {Boolean} split
+     * <p><tt>true</tt> to create a {@link Ext.layout.BorderLayout.SplitRegion SplitRegion} and
+     * display a 5px wide {@link Ext.SplitBar} between this region and its neighbor, allowing the user to
+     * resize the regions dynamically.  Defaults to <tt>false</tt> creating a
+     * {@link Ext.layout.BorderLayout.Region Region}.</p><br>
+     * <p><b>Notes</b>:</p><div class="mdetail-params"><ul>
+     * <li>this configuration option is ignored if <tt>region='center'</tt></li>
+     * <li>when <tt>split == true</tt>, it is common to specify a
+     * <tt>{@link Ext.SplitBar#minSize minSize}</tt> and <tt>{@link Ext.SplitBar#maxSize maxSize}</tt>
+     * for the {@link Ext.BoxComponent BoxComponent} representing the region. These are not native
+     * configs of {@link Ext.BoxComponent BoxComponent}, and are used only by this class.</li>
+     * <li>if <tt>{@link #collapseMode} = 'mini'</tt> requires <tt>split = true</tt> to reserve space
+     * for the collapse tool</tt></li>
+     * </ul></div>
+     */
+    split:false,
+    /**
+     * @cfg {Boolean} floatable
+     * <tt>true</tt> to allow clicking a collapsed region's bar to display the region's panel floated
+     * above the layout, <tt>false</tt> to force the user to fully expand a collapsed region by
+     * clicking the expand button to see it again (defaults to <tt>true</tt>).
+     */
+    floatable: true,
+    /**
+     * @cfg {Number} minWidth
+     * <p>The minimum allowable width in pixels for this region (defaults to <tt>50</tt>).
+     * <tt>maxWidth</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minWidth</tt> / <tt>maxWidth</tt>.</p>
+     */
+    minWidth:50,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum allowable height in pixels for this region (defaults to <tt>50</tt>)
+     * <tt>maxHeight</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minHeight</tt> / <tt>maxHeight</tt>.</p>
+     */
+    minHeight:50,
+
+    // private
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    // private
+    defaultNSCMargins : {left:5,top:5,right:5,bottom:5},
+    // private
+    defaultEWCMargins : {left:5,top:0,right:5,bottom:0},
+    floatingZIndex: 100,
+
+    /**
+     * True if this region is collapsed. Read-only.
+     * @type Boolean
+     * @property
+     */
+    isCollapsed : false,
+
+    /**
+     * This region's panel.  Read-only.
+     * @type Ext.Panel
+     * @property panel
+     */
+    /**
+     * This region's layout.  Read-only.
+     * @type Layout
+     * @property layout
+     */
+    /**
+     * This region's layout position (north, south, east, west or center).  Read-only.
+     * @type String
+     * @property position
+     */
+
+    // private
+    render : function(ct, p){
+        this.panel = p;
+        p.el.enableDisplayMode();
+        this.targetEl = ct;
+        this.el = p.el;
+
+        var gs = p.getState, ps = this.position;
+        p.getState = function(){
+            return Ext.apply(gs.call(p) || {}, this.state);
+        }.createDelegate(this);
+
+        if(ps != 'center'){
+            p.allowQueuedExpand = false;
+            p.on({
+                beforecollapse: this.beforeCollapse,
+                collapse: this.onCollapse,
+                beforeexpand: this.beforeExpand,
+                expand: this.onExpand,
+                hide: this.onHide,
+                show: this.onShow,
+                scope: this
+            });
+            if(this.collapsible || this.floatable){
+                p.collapseEl = 'el';
+                p.slideAnchor = this.getSlideAnchor();
+            }
+            if(p.tools && p.tools.toggle){
+                p.tools.toggle.addClass('x-tool-collapse-'+ps);
+                p.tools.toggle.addClassOnOver('x-tool-collapse-'+ps+'-over');
+            }
+        }
+    },
+
+    // private
+    getCollapsedEl : function(){
+        if(!this.collapsedEl){
+            if(!this.toolTemplate){
+                var tt = new Ext.Template(
+                     '<div class="x-tool x-tool-{id}">&#160;</div>'
+                );
+                tt.disableFormats = true;
+                tt.compile();
+                Ext.layout.BorderLayout.Region.prototype.toolTemplate = tt;
+            }
+            this.collapsedEl = this.targetEl.createChild({
+                cls: "x-layout-collapsed x-layout-collapsed-"+this.position,
+                id: this.panel.id + '-xcollapsed'
+            });
+            this.collapsedEl.enableDisplayMode('block');
+
+            if(this.collapseMode == 'mini'){
+                this.collapsedEl.addClass('x-layout-cmini-'+this.position);
+                this.miniCollapsedEl = this.collapsedEl.createChild({
+                    cls: "x-layout-mini x-layout-mini-"+this.position, html: "&#160;"
+                });
+                this.miniCollapsedEl.addClassOnOver('x-layout-mini-over');
+                this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                this.collapsedEl.on('click', this.onExpandClick, this, {stopEvent:true});
+            }else {
+                if(this.collapsible !== false && !this.hideCollapseTool) {
+                    var t = this.expandToolEl = this.toolTemplate.append(
+                            this.collapsedEl.dom,
+                            {id:'expand-'+this.position}, true);
+                    t.addClassOnOver('x-tool-expand-'+this.position+'-over');
+                    t.on('click', this.onExpandClick, this, {stopEvent:true});
+                }
+                if(this.floatable !== false || this.titleCollapse){
+                   this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                   this.collapsedEl.on("click", this[this.floatable ? 'collapseClick' : 'onExpandClick'], this);
+                }
+            }
+        }
+        return this.collapsedEl;
+    },
+
+    // private
+    onExpandClick : function(e){
+        if(this.isSlid){
+            this.panel.expand(false);
+        }else{
+            this.panel.expand();
+        }
+    },
+
+    // private
+    onCollapseClick : function(e){
+        this.panel.collapse();
+    },
+
+    // private
+    beforeCollapse : function(p, animate){
+        this.lastAnim = animate;
+        if(this.splitEl){
+            this.splitEl.hide();
+        }
+        this.getCollapsedEl().show();
+        var el = this.panel.getEl();
+        this.originalZIndex = el.getStyle('z-index');
+        el.setStyle('z-index', 100);
+        this.isCollapsed = true;
+        this.layout.layout();
+    },
+
+    // private
+    onCollapse : function(animate){
+        this.panel.el.setStyle('z-index', 1);
+        if(this.lastAnim === false || this.panel.animCollapse === false){
+            this.getCollapsedEl().dom.style.visibility = 'visible';
+        }else{
+            this.getCollapsedEl().slideIn(this.panel.slideAnchor, {duration:.2});
+        }
+        this.state.collapsed = true;
+        this.panel.saveState();
+    },
+
+    // private
+    beforeExpand : function(animate){
+        if(this.isSlid){
+            this.afterSlideIn();
+        }
+        var c = this.getCollapsedEl();
+        this.el.show();
+        if(this.position == 'east' || this.position == 'west'){
+            this.panel.setSize(undefined, c.getHeight());
+        }else{
+            this.panel.setSize(c.getWidth(), undefined);
+        }
+        c.hide();
+        c.dom.style.visibility = 'hidden';
+        this.panel.el.setStyle('z-index', this.floatingZIndex);
+    },
+
+    // private
+    onExpand : function(){
+        this.isCollapsed = false;
+        if(this.splitEl){
+            this.splitEl.show();
+        }
+        this.layout.layout();
+        this.panel.el.setStyle('z-index', this.originalZIndex);
+        this.state.collapsed = false;
+        this.panel.saveState();
+    },
+
+    // private
+    collapseClick : function(e){
+        if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+        }else{
+           e.stopPropagation();
+           this.slideOut();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().hide();
+        }else if(this.splitEl){
+            this.splitEl.hide();
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().show();
+        }else if(this.splitEl){
+            this.splitEl.show();
+        }
+    },
+
+    /**
+     * True if this region is currently visible, else false.
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return !this.panel.hidden;
+    },
+
+    /**
+     * Returns the current margins for this region.  If the region is collapsed, the
+     * {@link #cmargins} (collapsed margins) value will be returned, otherwise the
+     * {@link #margins} value will be returned.
+     * @return {Object} An object containing the element's margins: <tt>{left: (left
+     * margin), top: (top margin), right: (right margin), bottom: (bottom margin)}</tt>
+     */
+    getMargins : function(){
+        return this.isCollapsed && this.cmargins ? this.cmargins : this.margins;
+    },
+
+    /**
+     * Returns the current size of this region.  If the region is collapsed, the size of the
+     * collapsedEl will be returned, otherwise the size of the region's panel will be returned.
+     * @return {Object} An object containing the element's size: <tt>{width: (element width),
+     * height: (element height)}</tt>
+     */
+    getSize : function(){
+        return this.isCollapsed ? this.getCollapsedEl().getSize() : this.panel.getSize();
+    },
+
+    /**
+     * Sets the specified panel as the container element for this region.
+     * @param {Ext.Panel} panel The new panel
+     */
+    setPanel : function(panel){
+        this.panel = panel;
+    },
+
+    /**
+     * Returns the minimum allowable width for this region.
+     * @return {Number} The minimum width
+     */
+    getMinWidth: function(){
+        return this.minWidth;
+    },
+
+    /**
+     * Returns the minimum allowable height for this region.
+     * @return {Number} The minimum height
+     */
+    getMinHeight: function(){
+        return this.minHeight;
+    },
+
+    // private
+    applyLayoutCollapsed : function(box){
+        var ce = this.getCollapsedEl();
+        ce.setLeftTop(box.x, box.y);
+        ce.setSize(box.width, box.height);
+    },
+
+    // private
+    applyLayout : function(box){
+        if(this.isCollapsed){
+            this.applyLayoutCollapsed(box);
+        }else{
+            this.panel.setPosition(box.x, box.y);
+            this.panel.setSize(box.width, box.height);
+        }
+    },
+
+    // private
+    beforeSlide: function(){
+        this.panel.beforeEffect();
+    },
+
+    // private
+    afterSlide : function(){
+        this.panel.afterEffect();
+    },
+
+    // private
+    initAutoHide : function(){
+        if(this.autoHide !== false){
+            if(!this.autoHideHd){
+                this.autoHideSlideTask = new Ext.util.DelayedTask(this.slideIn, this);
+                this.autoHideHd = {
+                    "mouseout": function(e){
+                        if(!e.within(this.el, true)){
+                            this.autoHideSlideTask.delay(500);
+                        }
+                    },
+                    "mouseover" : function(e){
+                        this.autoHideSlideTask.cancel();
+                    },
+                    scope : this
+                };
+            }
+            this.el.on(this.autoHideHd);
+            this.collapsedEl.on(this.autoHideHd);
+        }
+    },
+
+    // private
+    clearAutoHide : function(){
+        if(this.autoHide !== false){
+            this.el.un("mouseout", this.autoHideHd.mouseout);
+            this.el.un("mouseover", this.autoHideHd.mouseover);
+            this.collapsedEl.un("mouseout", this.autoHideHd.mouseout);
+            this.collapsedEl.un("mouseover", this.autoHideHd.mouseover);
+        }
+    },
+
+    // private
+    clearMonitor : function(){
+        Ext.getDoc().un("click", this.slideInIf, this);
+    },
+
+    /**
+     * If this Region is {@link #floatable}, this method slides this Region into full visibility <i>over the top
+     * of the center Region</i> where it floats until either {@link #slideIn} is called, or other regions of the layout
+     * are clicked, or the mouse exits the Region.
+     */
+    slideOut : function(){
+        if(this.isSlid || this.el.hasActiveFx()){
+            return;
+        }
+        this.isSlid = true;
+        var ts = this.panel.tools, dh, pc;
+        if(ts && ts.toggle){
+            ts.toggle.hide();
+        }
+        this.el.show();
+
+        // Temporarily clear the collapsed flag so we can onResize the panel on the slide
+        pc = this.panel.collapsed;
+        this.panel.collapsed = false;
+
+        if(this.position == 'east' || this.position == 'west'){
+            // Temporarily clear the deferHeight flag so we can size the height on the slide
+            dh = this.panel.deferHeight;
+            this.panel.deferHeight = false;
+
+            this.panel.setSize(undefined, this.collapsedEl.getHeight());
+
+            // Put the deferHeight flag back after setSize
+            this.panel.deferHeight = dh;
+        }else{
+            this.panel.setSize(this.collapsedEl.getWidth(), undefined);
+        }
+
+        // Put the collapsed flag back after onResize
+        this.panel.collapsed = pc;
+
+        this.restoreLT = [this.el.dom.style.left, this.el.dom.style.top];
+        this.el.alignTo(this.collapsedEl, this.getCollapseAnchor());
+        this.el.setStyle("z-index", this.floatingZIndex+2);
+        this.panel.el.replaceClass('x-panel-collapsed', 'x-panel-floating');
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideIn(this.getSlideAnchor(), {
+                callback: function(){
+                    this.afterSlide();
+                    this.initAutoHide();
+                    Ext.getDoc().on("click", this.slideInIf, this);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.initAutoHide();
+             Ext.getDoc().on("click", this.slideInIf, this);
+        }
+    },
+
+    // private
+    afterSlideIn : function(){
+        this.clearAutoHide();
+        this.isSlid = false;
+        this.clearMonitor();
+        this.el.setStyle("z-index", "");
+        this.panel.el.replaceClass('x-panel-floating', 'x-panel-collapsed');
+        this.el.dom.style.left = this.restoreLT[0];
+        this.el.dom.style.top = this.restoreLT[1];
+
+        var ts = this.panel.tools;
+        if(ts && ts.toggle){
+            ts.toggle.show();
+        }
+    },
+
+    /**
+     * If this Region is {@link #floatable}, and this Region has been slid into floating visibility, then this method slides
+     * this region back into its collapsed state.
+     */
+    slideIn : function(cb){
+        if(!this.isSlid || this.el.hasActiveFx()){
+            Ext.callback(cb);
+            return;
+        }
+        this.isSlid = false;
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideOut(this.getSlideAnchor(), {
+                callback: function(){
+                    this.el.hide();
+                    this.afterSlide();
+                    this.afterSlideIn();
+                    Ext.callback(cb);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.el.hide();
+            this.afterSlideIn();
+        }
+    },
+
+    // private
+    slideInIf : function(e){
+        if(!e.within(this.el)){
+            this.slideIn();
+        }
+    },
+
+    // private
+    anchors : {
+        "west" : "left",
+        "east" : "right",
+        "north" : "top",
+        "south" : "bottom"
+    },
+
+    // private
+    sanchors : {
+        "west" : "l",
+        "east" : "r",
+        "north" : "t",
+        "south" : "b"
+    },
+
+    // private
+    canchors : {
+        "west" : "tl-tr",
+        "east" : "tr-tl",
+        "north" : "tl-bl",
+        "south" : "bl-tl"
+    },
+
+    // private
+    getAnchor : function(){
+        return this.anchors[this.position];
+    },
+
+    // private
+    getCollapseAnchor : function(){
+        return this.canchors[this.position];
+    },
+
+    // private
+    getSlideAnchor : function(){
+        return this.sanchors[this.position];
+    },
+
+    // private
+    getAlignAdj : function(){
+        var cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [0, 0];
+            break;
+            case "east":
+                return [0, 0];
+            break;
+            case "north":
+                return [0, 0];
+            break;
+            case "south":
+                return [0, 0];
+            break;
+        }
+    },
+
+    // private
+    getExpandAdj : function(){
+        var c = this.collapsedEl, cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [-(cm.right+c.getWidth()+cm.left), 0];
+            break;
+            case "east":
+                return [cm.right+c.getWidth()+cm.left, 0];
+            break;
+            case "north":
+                return [0, -(cm.top+cm.bottom+c.getHeight())];
+            break;
+            case "south":
+                return [0, cm.top+cm.bottom+c.getHeight()];
+            break;
+        }
+    },
+
+    destroy : function(){
+        if (this.autoHideSlideTask && this.autoHideSlideTask.cancel){
+            this.autoHideSlideTask.cancel();
+        }
+        Ext.destroyMembers(this, 'miniCollapsedEl', 'collapsedEl', 'expandToolEl');
+    }
+};
+
+/**
+ * @class Ext.layout.BorderLayout.SplitRegion
+ * @extends Ext.layout.BorderLayout.Region
+ * <p>This is a specialized type of {@link Ext.layout.BorderLayout.Region BorderLayout region} that
+ * has a built-in {@link Ext.SplitBar} for user resizing of regions.  The movement of the split bar
+ * is configurable to move either {@link #tickSize smooth or incrementally}.</p>
+ * @constructor
+ * Create a new SplitRegion.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: north, south, east, west and center.  Every
+ * BorderLayout must have a center region for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.SplitRegion = function(layout, config, pos){
+    Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this, layout, config, pos);
+    // prevent switch
+    this.applyLayout = this.applyFns[pos];
+};
+
+Ext.extend(Ext.layout.BorderLayout.SplitRegion, Ext.layout.BorderLayout.Region, {
+    /**
+     * @cfg {Number} tickSize
+     * The increment, in pixels by which to move this Region's {@link Ext.SplitBar SplitBar}.
+     * By default, the {@link Ext.SplitBar SplitBar} moves smoothly.
+     */
+    /**
+     * @cfg {String} splitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible non-collapsible} region's split bar
+     * (defaults to <tt>"Drag to resize."</tt>).  Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    splitTip : "Drag to resize.",
+    /**
+     * @cfg {String} collapsibleSplitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible collapsible} region's split bar
+     * (defaults to "Drag to resize. Double click to hide."). Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    collapsibleSplitTip : "Drag to resize. Double click to hide.",
+    /**
+     * @cfg {Boolean} useSplitTips
+     * <tt>true</tt> to display a tooltip when the user hovers over a region's split bar
+     * (defaults to <tt>false</tt>).  The tooltip text will be the value of either
+     * <tt>{@link #splitTip}</tt> or <tt>{@link #collapsibleSplitTip}</tt> as appropriate.
+     */
+    useSplitTips : false,
+
+    // private
+    splitSettings : {
+        north : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.TOP,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        south : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.BOTTOM,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        east : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.RIGHT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        },
+        west : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.LEFT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        }
+    },
+
+    // private
+    applyFns : {
+        west : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            this.panel.setPosition(box.x, box.y);
+            var sw = sd.offsetWidth;
+            s.left = (box.x+box.width-sw)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        east : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sw = sd.offsetWidth;
+            this.panel.setPosition(box.x+sw, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        north : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y+box.height-sh)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        },
+        south : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y+sh);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        }
+    },
+
+    // private
+    render : function(ct, p){
+        Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this, ct, p);
+
+        var ps = this.position;
+
+        this.splitEl = ct.createChild({
+            cls: "x-layout-split x-layout-split-"+ps, html: "&#160;",
+            id: this.panel.id + '-xsplit'
+        });
+
+        if(this.collapseMode == 'mini'){
+            this.miniSplitEl = this.splitEl.createChild({
+                cls: "x-layout-mini x-layout-mini-"+ps, html: "&#160;"
+            });
+            this.miniSplitEl.addClassOnOver('x-layout-mini-over');
+            this.miniSplitEl.on('click', this.onCollapseClick, this, {stopEvent:true});
+        }
+
+        var s = this.splitSettings[ps];
+
+        this.split = new Ext.SplitBar(this.splitEl.dom, p.el, s.orientation);
+        this.split.tickSize = this.tickSize;
+        this.split.placement = s.placement;
+        this.split.getMaximumSize = this[s.maxFn].createDelegate(this);
+        this.split.minSize = this.minSize || this[s.minProp];
+        this.split.on("beforeapply", this.onSplitMove, this);
+        this.split.useShim = this.useShim === true;
+        this.maxSize = this.maxSize || this[s.maxProp];
+
+        if(p.hidden){
+            this.splitEl.hide();
+        }
+
+        if(this.useSplitTips){
+            this.splitEl.dom.title = this.collapsible ? this.collapsibleSplitTip : this.splitTip;
+        }
+        if(this.collapsible){
+            this.splitEl.on("dblclick", this.onCollapseClick,  this);
+        }
+    },
+
+    //docs inherit from superclass
+    getSize : function(){
+        if(this.isCollapsed){
+            return this.collapsedEl.getSize();
+        }
+        var s = this.panel.getSize();
+        if(this.position == 'north' || this.position == 'south'){
+            s.height += this.splitEl.dom.offsetHeight;
+        }else{
+            s.width += this.splitEl.dom.offsetWidth;
+        }
+        return s;
+    },
+
+    // private
+    getHMaxSize : function(){
+         var cmax = this.maxSize || 10000;
+         var center = this.layout.center;
+         return Math.min(cmax, (this.el.getWidth()+center.el.getWidth())-center.getMinWidth());
+    },
+
+    // private
+    getVMaxSize : function(){
+        var cmax = this.maxSize || 10000;
+        var center = this.layout.center;
+        return Math.min(cmax, (this.el.getHeight()+center.el.getHeight())-center.getMinHeight());
+    },
+
+    // private
+    onSplitMove : function(split, newSize){
+        var s = this.panel.getSize();
+        this.lastSplitSize = newSize;
+        if(this.position == 'north' || this.position == 'south'){
+            this.panel.setSize(s.width, newSize);
+            this.state.height = newSize;
+        }else{
+            this.panel.setSize(newSize, s.height);
+            this.state.width = newSize;
+        }
+        this.layout.layout();
+        this.panel.saveState();
+        return false;
+    },
+
+    /**
+     * Returns a reference to the split bar in use by this region.
+     * @return {Ext.SplitBar} The split bar
+     */
+    getSplitBar : function(){
+        return this.split;
+    },
+
+    // inherit docs
+    destroy : function() {
+        Ext.destroy(this.miniSplitEl, this.split, this.splitEl);
+        Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS['border'] = Ext.layout.BorderLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AbsoluteLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AbsoluteLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AbsoluteLayout.js	(revision 76)
@@ -0,0 +1,83 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.AbsoluteLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This is a layout that inherits the anchoring of <b>{@link Ext.layout.AnchorLayout}</b> and adds the
+ * ability for x/y positioning using the standard x and y component config options.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var form = new Ext.form.FormPanel({
+    title: 'Absolute Layout',
+    layout:'absolute',
+    layoutConfig: {
+        // layout-specific configs go here
+        extraCls: 'x-abs-layout-item',
+    },
+    baseCls: 'x-plain',
+    url:'save-form.php',
+    defaultType: 'textfield',
+    items: [{
+        x: 0,
+        y: 5,
+        xtype:'label',
+        text: 'Send To:'
+    },{
+        x: 60,
+        y: 0,
+        name: 'to',
+        anchor:'100%'  // anchor width by percentage
+    },{
+        x: 0,
+        y: 35,
+        xtype:'label',
+        text: 'Subject:'
+    },{
+        x: 60,
+        y: 30,
+        name: 'subject',
+        anchor: '100%'  // anchor width by percentage
+    },{
+        x:0,
+        y: 60,
+        xtype: 'textarea',
+        name: 'msg',
+        anchor: '100% 100%'  // anchor width and height
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    extraCls: 'x-abs-layout-item',
+
+    type: 'absolute',
+
+    onLayout : function(ct, target){
+        target.position();
+        this.paddingLeft = target.getPadding('l');
+        this.paddingTop = target.getPadding('t');
+        Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;
+    }
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/VBoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/VBoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/VBoxLayout.js	(revision 76)
@@ -0,0 +1,293 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.VBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items vertically down a Container. This layout optionally divides available vertical
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the widths of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.VBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>left</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned horizontally
+     * at the <b>left</b> side of the container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are aligned horizontally at the
+     * <b>mid-width</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched horizontally to fill
+     * the width of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched horizontally to
+     * the size of the largest item.</div></li>
+     * </ul></div>
+     */
+    align : 'left', // left, center, stretch, strechmax
+    type: 'vbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>top</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-height</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>bottom</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>vertically</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the VBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availWidth   = Math.max(0, width - paddingHoriz),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexHeight= 0,
+            maxWidth     = 0,
+            totalFlex    = 0,
+            desiredHeight= 0,
+            minimumHeight= 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+            
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedHeight, 
+            horizMargins, vertMargins, stretchWidth, length;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static height (numeric) requires no calcs
+            if (typeof childHeight != 'number') {
+
+                // flex and not 'auto' height
+                if (child.flex && !childHeight) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' height or undefined height
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childHeight && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize = child.getSize();
+                    childWidth = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+            
+            childMargins = child.margins;
+            vertMargins  = childMargins.top + childMargins.bottom;
+
+            nonFlexHeight += vertMargins + (childHeight || 0);
+            desiredHeight += vertMargins + (child.flex ? child.minHeight || 0 : childHeight);
+            minimumHeight += vertMargins + (child.minHeight || childHeight || 0);
+
+            // Max width for align - force layout of non-layed out subcontainers without a numeric width
+            if (typeof childWidth != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childWidth = child.getWidth();
+            }
+
+            maxWidth = Math.max(maxWidth, childWidth + childMargins.left + childMargins.right);
+
+            //cache the size of each child component
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth || undefined
+            });
+        }
+                
+        var shortfall = desiredHeight - height,
+            tooNarrow = minimumHeight > height;
+
+        //the height available to the flexed items
+        var availableHeight = Math.max(0, (height - nonFlexHeight - paddingVert));
+        
+        if (tooNarrow) {
+            for (i = 0, length = visibleCount; i < length; i++) {
+                boxes[i].height = visibleItems[i].minHeight || visibleItems[i].height || boxes[i].height;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minHeights = [];
+
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the height of each non-flexed item.
+                 * Flexed items are immediately reduced to their minHeight and anything already at minHeight is ignored.
+                 * The remaining items are collected into the minHeights array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item      = visibleItems[index],
+                        minHeight = item.minHeight || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minHeight because they're flexible and should be the first to lose height
+                    if (item.flex) {
+                        boxes[index].height = minHeight;
+                    } else {
+                        minHeights.push({
+                            minHeight: minHeight, 
+                            available: boxes[index].height - minHeight,
+                            index    : index
+                        });
+                    }
+                }
+
+                //sort by descending minHeight value
+                minHeights.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual height available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their height and minHeight first, so that if reducing the height by the average
+                 * amount would make that item less than its minHeight, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minHeights.length; i < length; i++) {
+                    var itemIndex = minHeights[i].index;
+
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldHeight  = box.height,
+                        minHeight  = item.minHeight,
+                        newHeight  = Math.max(minHeight, oldHeight - Math.ceil(shortfall / (length - i))),
+                        reduction = oldHeight - newHeight;
+
+                    boxes[itemIndex].height = newHeight;
+                    shortfall -= reduction;
+                }
+            } else {
+                //temporary variables used in the flex height calculations below
+                var remainingHeight = availableHeight,
+                    remainingFlex   = totalFlex;
+                
+                //calculate the height of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    horizMargins = childMargins.left + childMargins.right;
+
+                    if (isStart && child.flex && !child.height) {
+                        flexedHeight     = Math.ceil((child.flex / remainingFlex) * remainingHeight);
+                        remainingHeight -= flexedHeight;
+                        remainingFlex   -= child.flex;
+
+                        calcs.height = flexedHeight;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+
+        if (isCenter) {
+            topOffset += availableHeight / 2;
+        } else if (isEnd) {
+            topOffset += availableHeight;
+        }
+
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+
+            childMargins = child.margins;
+            topOffset   += childMargins.top;
+            horizMargins = childMargins.left + childMargins.right;
+            
+
+            calcs.left = leftOffset + childMargins.left;
+            calcs.top  = topOffset;
+            
+            switch (this.align) {
+                case 'stretch':
+                    stretchWidth = availWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchWidth = maxWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'center':
+                    var diff = availWidth - calcs.width - horizMargins;
+                    if (diff > 0) {
+                        calcs.left = leftOffset + horizMargins + (diff / 2);
+                    }
+            }
+
+            topOffset += calcs.height + childMargins.bottom;
+        }
+        
+        return {
+            boxes: boxes,
+            meta : {
+                maxWidth     : maxWidth,
+                nonFlexHeight: nonFlexHeight,
+                desiredHeight: desiredHeight,
+                minimumHeight: minimumHeight,
+                shortfall    : desiredHeight - height,
+                tooNarrow    : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.vbox = Ext.layout.VBoxLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/MenuOverflow.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/MenuOverflow.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/MenuOverflow.js	(revision 76)
@@ -0,0 +1,351 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.boxOverflow.Menu
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Menu = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+    
+    constructor: function(layout) {
+        Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this, arguments);
+        
+        /**
+         * @property menuItems
+         * @type Array
+         * Array of all items that are currently hidden and should go into the dropdown menu
+         */
+        this.menuItems = [];
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt, innerCt and afterCt elements if they have not already been created
+     * @param {Ext.Container} container The Container attached to this Layout instance
+     * @param {Ext.Element} target The target Element
+     */
+    createInnerElements: function() {
+        if (!this.afterCt) {
+            this.afterCt  = this.layout.innerCt.insertSibling({cls: this.afterCls},  'before');
+        }
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function(calculations, targetSize) {
+        var newWidth = targetSize.width + (this.afterCt ? this.afterCt.getWidth() : 0),
+            items    = this.menuItems;
+        
+        this.hideTrigger();
+        
+        for (var index = 0, length = items.length; index < length; index++) {
+            items.pop().component.show();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            }
+        };
+    },
+    
+    /**
+     * @private
+     */
+    showTrigger: function() {
+        this.createMenu();
+        this.menuTrigger.show();
+    },
+    
+    /**
+     * @private
+     */
+    hideTrigger: function() {
+        if (this.menuTrigger != undefined) {
+            this.menuTrigger.hide();
+        }
+    },
+    
+    /**
+     * @private
+     * Called before the overflow menu is shown. This constructs the menu's items, caching them for as long as it can.
+     */
+    beforeMenuShow: function(menu) {
+        var items = this.menuItems,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+        
+        this.clearMenu();
+        menu.removeAll();
+        
+        for (var i = 0; i < len; i++) {
+            item = items[i].component;
+            
+            if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                menu.add('-');
+            }
+            
+            this.addComponentToMenu(menu, item);
+            prev = item;
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+    
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the overflow trigger and menu used when enableOverflow is set to true and the items
+     * in the layout are too wide to fit in the space available
+     */
+    createMenu: function() {
+        if (!this.menuTrigger) {
+            this.createInnerElements();
+            
+            /**
+             * @private
+             * @property menu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every item that cannot be shown
+             * because the container is currently not large enough.
+             */
+            this.menu = new Ext.menu.Menu({
+                ownerCt : this.layout.container,
+                listeners: {
+                    scope: this,
+                    beforeshow: this.beforeMenuShow
+                }
+            });
+
+            /**
+             * @private
+             * @property menuTrigger
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.menuTrigger = new Ext.Button({
+                iconCls : 'x-toolbar-more-icon',
+                cls     : 'x-toolbar-more',
+                menu    : this.menu,
+                renderTo: this.afterCt
+            });
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.menu, this.menuTrigger);
+    }
+});
+
+Ext.layout.boxOverflow.menu = Ext.layout.boxOverflow.Menu;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalMenu
+ * @extends Ext.layout.boxOverflow.Menu
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalMenu = Ext.extend(Ext.layout.boxOverflow.Menu, {
+    
+    constructor: function() {
+        Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this, arguments);
+        
+        var me = this,
+            layout = me.layout,
+            origFunction = layout.calculateChildBoxes;
+        
+        layout.calculateChildBoxes = function(visibleItems, targetSize) {
+            var calcs = origFunction.apply(layout, arguments),
+                meta  = calcs.meta,
+                items = me.menuItems;
+            
+            //calculate the width of the items currently hidden solely because there is not enough space
+            //to display them
+            var hiddenWidth = 0;
+            for (var index = 0, length = items.length; index < length; index++) {
+                hiddenWidth += items[index].width;
+            }
+            
+            meta.minimumWidth += hiddenWidth;
+            meta.tooNarrow = meta.minimumWidth > targetSize.width;
+            
+            return calcs;
+        };        
+    },
+    
+    handleOverflow: function(calculations, targetSize) {
+        this.showTrigger();
+        
+        var newWidth    = targetSize.width - this.afterCt.getWidth(),
+            boxes       = calculations.boxes,
+            usedWidth   = 0,
+            recalculate = false;
+        
+        //calculate the width of all visible items and any spare width
+        for (var index = 0, length = boxes.length; index < length; index++) {
+            usedWidth += boxes[index].width;
+        }
+        
+        var spareWidth = newWidth - usedWidth,
+            showCount  = 0;
+        
+        //see if we can re-show any of the hidden components
+        for (var index = 0, length = this.menuItems.length; index < length; index++) {
+            var hidden = this.menuItems[index],
+                comp   = hidden.component,
+                width  = hidden.width;
+            
+            if (width < spareWidth) {
+                comp.show();
+                
+                spareWidth -= width;
+                showCount ++;
+                recalculate = true;
+            } else {
+                break;
+            }
+        }
+                
+        if (recalculate) {
+            this.menuItems = this.menuItems.slice(showCount);
+        } else {
+            for (var i = boxes.length - 1; i >= 0; i--) {
+                var item  = boxes[i].component,
+                    right = boxes[i].left + boxes[i].width;
+
+                if (right >= newWidth) {
+                    this.menuItems.unshift({
+                        component: item,
+                        width    : boxes[i].width
+                    });
+
+                    item.hide();
+                } else {
+                    break;
+                }
+            }
+        }
+        
+        if (this.menuItems.length == 0) {
+            this.hideTrigger();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            },
+            recalculate: recalculate
+        };
+    }
+});
+
+Ext.layout.boxOverflow.menu.hbox = Ext.layout.boxOverflow.HorizontalMenu;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/ScrollerOverflow.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/ScrollerOverflow.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/box/ScrollerOverflow.js	(revision 76)
@@ -0,0 +1,507 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.boxOverflow.Scroller
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Scroller = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg animateScroll
+     * @type Boolean
+     * True to animate the scrolling of items within the layout (defaults to true, ignored if enableScroll is false)
+     */
+    animateScroll: true,
+    
+    /**
+     * @cfg scrollIncrement
+     * @type Number
+     * The number of pixels to scroll by on scroller click (defaults to 100)
+     */
+    scrollIncrement: 100,
+    
+    /**
+     * @cfg wheelIncrement
+     * @type Number
+     * The number of pixels to increment on mouse wheel scrolling (defaults to <tt>3</tt>).
+     */
+    wheelIncrement: 3,
+    
+    /**
+     * @cfg scrollRepeatInterval
+     * @type Number
+     * Number of milliseconds between each scroll while a scroller button is held down (defaults to 400)
+     */
+    scrollRepeatInterval: 400,
+    
+    /**
+     * @cfg scrollDuration
+     * @type Number
+     * Number of seconds that each scroll animation lasts (defaults to 0.4)
+     */
+    scrollDuration: 0.4,
+    
+    /**
+     * @cfg beforeCls
+     * @type String
+     * CSS class added to the beforeCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the leftmost edge of the Container
+     */
+    beforeCls: 'x-strip-left',
+    
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @cfg scrollerCls
+     * @type String
+     * CSS class added to both scroller elements if enableScroll is used
+     */
+    scrollerCls: 'x-strip-scroller',
+    
+    /**
+     * @cfg beforeScrollerCls
+     * @type String
+     * CSS class added to the left scroller element if enableScroll is used
+     */
+    beforeScrollerCls: 'x-strip-scroller-left',
+    
+    /**
+     * @cfg afterScrollerCls
+     * @type String
+     * CSS class added to the right scroller element if enableScroll is used
+     */
+    afterScrollerCls: 'x-strip-scroller-right',
+    
+    /**
+     * @private
+     * Sets up an listener to scroll on the layout's innerCt mousewheel event
+     */
+    createWheelListener: function() {
+        this.layout.innerCt.on({
+            scope     : this,
+            mousewheel: function(e) {
+                e.stopEvent();
+
+                this.scrollBy(e.getWheelDelta() * this.wheelIncrement * -1, false);
+            }
+        });
+    },
+    
+    /**
+     * @private
+     * Most of the heavy lifting is done in the subclasses
+     */
+    handleOverflow: function(calculations, targetSize) {
+        this.createInnerElements();
+        this.showScrollers();
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function() {
+        this.hideScrollers();
+    },
+    
+    /**
+     * @private
+     * Shows the scroller elements in the beforeCt and afterCt. Creates the scrollers first if they are not already
+     * present. 
+     */
+    showScrollers: function() {
+        this.createScrollers();
+        
+        this.beforeScroller.show();
+        this.afterScroller.show();
+        
+        this.updateScrollButtons();
+    },
+    
+    /**
+     * @private
+     * Hides the scroller elements in the beforeCt and afterCt
+     */
+    hideScrollers: function() {
+        if (this.beforeScroller != undefined) {
+            this.beforeScroller.hide();
+            this.afterScroller.hide();          
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the clickable scroller elements and places them into the beforeCt and afterCt
+     */
+    createScrollers: function() {
+        if (!this.beforeScroller && !this.afterScroller) {
+            var before = this.beforeCt.createChild({
+                cls: String.format("{0} {1} ", this.scrollerCls, this.beforeScrollerCls)
+            });
+            
+            var after = this.afterCt.createChild({
+                cls: String.format("{0} {1}", this.scrollerCls, this.afterScrollerCls)
+            });
+            
+            before.addClassOnOver(this.beforeScrollerCls + '-hover');
+            after.addClassOnOver(this.afterScrollerCls + '-hover');
+            
+            before.setVisibilityMode(Ext.Element.DISPLAY);
+            after.setVisibilityMode(Ext.Element.DISPLAY);
+            
+            this.beforeRepeater = new Ext.util.ClickRepeater(before, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollLeft,
+                scope   : this
+            });
+            
+            this.afterRepeater = new Ext.util.ClickRepeater(after, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollRight,
+                scope   : this
+            });
+            
+            /**
+             * @property beforeScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.beforeScroller = before;
+            
+            /**
+             * @property afterScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.afterScroller = after;
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.beforeScroller, this.afterScroller, this.beforeRepeater, this.afterRepeater, this.beforeCt, this.afterCt);
+    },
+    
+    /**
+     * @private
+     * Scrolls left or right by the number of pixels specified
+     * @param {Number} delta Number of pixels to scroll to the right by. Use a negative number to scroll left
+     */
+    scrollBy: function(delta, animate) {
+        this.scrollTo(this.getScrollPosition() + delta, animate);
+    },
+    
+    /**
+     * @private
+     * Normalizes an item reference, string id or numerical index into a reference to the item
+     * @param {Ext.Component|String|Number} item The item reference, id or index
+     * @return {Ext.Component} The item
+     */
+    getItem: function(item) {
+        if (Ext.isString(item)) {
+            item = Ext.getCmp(item);
+        } else if (Ext.isNumber(item)) {
+            item = this.items[item];
+        }
+        
+        return item;
+    },
+    
+    /**
+     * @private
+     * @return {Object} Object passed to scrollTo when scrolling
+     */
+    getScrollAnim: function() {
+        return {
+            duration: this.scrollDuration, 
+            callback: this.updateScrollButtons, 
+            scope   : this
+        };
+    },
+    
+    /**
+     * @private
+     * Enables or disables each scroller button based on the current scroll position
+     */
+    updateScrollButtons: function() {
+        if (this.beforeScroller == undefined || this.afterScroller == undefined) {
+            return;
+        }
+        
+        var beforeMeth = this.atExtremeBefore()  ? 'addClass' : 'removeClass',
+            afterMeth  = this.atExtremeAfter() ? 'addClass' : 'removeClass',
+            beforeCls  = this.beforeScrollerCls + '-disabled',
+            afterCls   = this.afterScrollerCls  + '-disabled';
+        
+        this.beforeScroller[beforeMeth](beforeCls);
+        this.afterScroller[afterMeth](afterCls);
+        this.scrolling = false;
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its left-most point
+     * @return {Boolean} True if already at furthest left point
+     */
+    atExtremeBefore: function() {
+        return this.getScrollPosition() === 0;
+    },
+    
+    /**
+     * @private
+     * Scrolls to the left by the configured amount
+     */
+    scrollLeft: function(animate) {
+        this.scrollBy(-this.scrollIncrement, animate);
+    },
+    
+    /**
+     * @private
+     * Scrolls to the right by the configured amount
+     */
+    scrollRight: function(animate) {
+        this.scrollBy(this.scrollIncrement, animate);
+    },
+    
+    /**
+     * Scrolls to the given component.
+     * @param {String|Number|Ext.Component} item The item to scroll to. Can be a numerical index, component id 
+     * or a reference to the component itself.
+     * @param {Boolean} animate True to animate the scrolling
+     */
+    scrollToItem: function(item, animate) {
+        item = this.getItem(item);
+        
+        if (item != undefined) {
+            var visibility = this.getItemVisibility(item);
+            
+            if (!visibility.fullyVisible) {
+                var box  = item.getBox(true, true),
+                    newX = box.x;
+                    
+                if (visibility.hiddenRight) {
+                    newX -= (this.layout.innerCt.getWidth() - box.width);
+                }
+                
+                this.scrollTo(newX, animate);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * For a given item in the container, return an object with information on whether the item is visible
+     * with the current innerCt scroll value.
+     * @param {Ext.Component} item The item
+     * @return {Object} Values for fullyVisible, hiddenLeft and hiddenRight
+     */
+    getItemVisibility: function(item) {
+        var box         = this.getItem(item).getBox(true, true),
+            itemLeft    = box.x,
+            itemRight   = box.x + box.width,
+            scrollLeft  = this.getScrollPosition(),
+            scrollRight = this.layout.innerCt.getWidth() + scrollLeft;
+        
+        return {
+            hiddenLeft  : itemLeft < scrollLeft,
+            hiddenRight : itemRight > scrollRight,
+            fullyVisible: itemLeft > scrollLeft && itemRight < scrollRight
+        };
+    }
+});
+
+Ext.layout.boxOverflow.scroller = Ext.layout.boxOverflow.Scroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.VerticalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.VerticalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    scrollIncrement: 75,
+    wheelIncrement : 2,
+    
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height - (this.beforeCt.getHeight() + this.afterCt.getHeight()),
+                width : targetSize.width
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'after');
+
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollBottom());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('top', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollTop, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollBottom: function() {
+        return this.layout.innerCt.dom.scrollHeight - this.layout.innerCt.getHeight();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollBottom();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.vbox = Ext.layout.boxOverflow.VerticalScroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : targetSize.width - (this.beforeCt.getWidth() + this.afterCt.getWidth())
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'before');
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollRight());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('left', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollLeft, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollRight: function() {
+        return this.layout.innerCt.dom.scrollWidth - this.layout.innerCt.getWidth();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollRight();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.hbox = Ext.layout.boxOverflow.HorizontalScroller;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ContainerLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ContainerLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ContainerLayout.js	(revision 76)
@@ -0,0 +1,309 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.ContainerLayout
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ */
+Ext.layout.ContainerLayout = Ext.extend(Object, {
+    /**
+     * @cfg {String} extraCls
+     * <p>An optional extra CSS class that will be added to the container. This can be useful for adding
+     * customized styles to the container or any of its children using standard CSS rules. See
+     * {@link Ext.Component}.{@link Ext.Component#ctCls ctCls} also.</p>
+     * <p><b>Note</b>: <tt>extraCls</tt> defaults to <tt>''</tt> except for the following classes
+     * which assign a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.AbsoluteLayout Absolute Layout} : <tt>'x-abs-layout-item'</tt></li>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-item'</tt></li>
+     * <li>{@link Ext.layout.ColumnLayout Column Layout} : <tt>'x-column'</tt></li>
+     * </ul></div>
+     * To configure the above Classes with an extra CSS class append to the default.  For example,
+     * for ColumnLayout:<pre><code>
+     * extraCls: 'x-column custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} renderHidden
+     * True to hide each contained item on render (defaults to false).
+     */
+
+    /**
+     * A reference to the {@link Ext.Component} that is active.  For example, <pre><code>
+     * if(myPanel.layout.activeItem.id == 'item-1') { ... }
+     * </code></pre>
+     * <tt>activeItem</tt> only applies to layout styles that can display items one at a time
+     * (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout}
+     * and {@link Ext.layout.FitLayout}).  Read-only.  Related to {@link Ext.Container#activeItem}.
+     * @type {Ext.Component}
+     * @property activeItem
+     */
+
+    // private
+    monitorResize:false,
+    // private
+    activeItem : null,
+
+    constructor : function(config){
+        this.id = Ext.id(null, 'ext-layout-');
+        Ext.apply(this, config);
+    },
+
+    type: 'container',
+
+    /* Workaround for how IE measures autoWidth elements.  It prefers bottom-up measurements
+      whereas other browser prefer top-down.  We will hide all target child elements before we measure and
+      put them back to get an accurate measurement.
+    */
+    IEMeasureHack : function(target, viewFlag) {
+        var tChildren = target.dom.childNodes, tLen = tChildren.length, c, d = [], e, i, ret;
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                d[i] = e.getStyle('display');
+                e.setStyle({display: 'none'});
+            }
+        }
+        ret = target ? target.getViewSize(viewFlag) : {};
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                e.setStyle({display: d[i]});
+            }
+        }
+        return ret;
+    },
+
+    // Placeholder for the derived layouts
+    getLayoutTargetSize : Ext.EmptyFn,
+
+    // private
+    layout : function(){
+        var ct = this.container, target = ct.getLayoutTarget();
+        if(!(this.hasLayout || Ext.isEmpty(this.targetCls))){
+            target.addClass(this.targetCls);
+        }
+        this.onLayout(ct, target);
+        ct.fireEvent('afterlayout', ct, this);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        this.renderAll(ct, target);
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && c.getPositionEl().dom.parentNode == (target.dom || target);
+    },
+
+    // private
+    renderAll : function(ct, target){
+        var items = ct.items.items, i, c, len = items.length;
+        for(i = 0; i < len; i++) {
+            c = items[i];
+            if(c && (!c.rendered || !this.isValidParent(c, target))){
+                this.renderItem(c, i, target);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Renders the given Component into the target Element. If the Component is already rendered,
+     * it is moved to the provided target instead.
+     * @param {Ext.Component} c The Component to render
+     * @param {Number} position The position within the target to render the item to
+     * @param {Ext.Element} target The target Element
+     */
+    renderItem : function(c, position, target){
+        if (c) {
+            if (!c.rendered) {
+                c.render(target, position);
+                this.configureItem(c);
+            } else if (!this.isValidParent(c, target)) {
+                if (Ext.isNumber(position)) {
+                    position = target.dom.childNodes[position];
+                }
+                
+                target.dom.insertBefore(c.getPositionEl().dom, position || null);
+                c.container = target;
+                this.configureItem(c);
+            }
+        }
+    },
+
+    // private.
+    // Get all rendered items to lay out.
+    getRenderedItems: function(ct){
+        var t = ct.getLayoutTarget(), cti = ct.items.items, len = cti.length, i, c, items = [];
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.shouldLayout !== false){
+                items.push(c);
+            }
+        };
+        return items;
+    },
+
+    /**
+     * @private
+     * Applies extraCls and hides the item if renderHidden is true
+     */
+    configureItem: function(c){
+        if (this.extraCls) {
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.addClass(this.extraCls);
+        }
+        
+        // If we are forcing a layout, do so *before* we hide so elements have height/width
+        if (c.doLayout && this.forceLayout) {
+            c.doLayout();
+        }
+        if (this.renderHidden && c != this.activeItem) {
+            c.hide();
+        }
+    },
+
+    onRemove: function(c){
+        if(this.activeItem == c){
+            delete this.activeItem;
+        }
+        if(c.rendered && this.extraCls){
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.removeClass(this.extraCls);
+        }
+    },
+
+    afterRemove: function(c){
+        if(c.removeRestore){
+            c.removeMode = 'container';
+            delete c.removeRestore;
+        }
+    },
+
+    // private
+    onResize: function(){
+        var ct = this.container,
+            b;
+        if(ct.collapsed){
+            return;
+        }
+        if(b = ct.bufferResize && ct.shouldBufferLayout()){
+            if(!this.resizeTask){
+                this.resizeTask = new Ext.util.DelayedTask(this.runLayout, this);
+                this.resizeBuffer = Ext.isNumber(b) ? b : 50;
+            }
+            ct.layoutPending = true;
+            this.resizeTask.delay(this.resizeBuffer);
+        }else{
+            this.runLayout();
+        }
+    },
+
+    runLayout: function(){
+        var ct = this.container;
+        this.layout();
+        ct.onLayout();
+        delete ct.layoutPending;
+    },
+
+    // private
+    setContainer : function(ct){
+        /**
+         * This monitorResize flag will be renamed soon as to avoid confusion
+         * with the Container version which hooks onWindowResize to doLayout
+         *
+         * monitorResize flag in this context attaches the resize event between
+         * a container and it's layout
+         */
+        if(this.monitorResize && ct != this.container){
+            var old = this.container;
+            if(old){
+                old.un(old.resizeEvent, this.onResize, this);
+            }
+            if(ct){
+                ct.on(ct.resizeEvent, this.onResize, this);
+            }
+        }
+        this.container = ct;
+    },
+
+    /**
+     * Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations
+     * (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result)
+     * @param {Number|String} v The encoded margins
+     * @return {Object} An object with margin sizes for top, right, bottom and left
+     */
+    parseMargins : function(v){
+        if (Ext.isNumber(v)) {
+            v = v.toString();
+        }
+        var ms  = v.split(' '),
+            len = ms.length;
+            
+        if (len == 1) {
+            ms[1] = ms[2] = ms[3] = ms[0];
+        } else if(len == 2) {
+            ms[2] = ms[0];
+            ms[3] = ms[1];
+        } else if(len == 3) {
+            ms[3] = ms[1];
+        }
+        
+        return {
+            top   :parseInt(ms[0], 10) || 0,
+            right :parseInt(ms[1], 10) || 0,
+            bottom:parseInt(ms[2], 10) || 0,
+            left  :parseInt(ms[3], 10) || 0
+        };
+    },
+
+    /**
+     * The {@link Ext.Template Ext.Template} used by Field rendering layout classes (such as
+     * {@link Ext.layout.FormLayout}) to create the DOM structure of a fully wrapped,
+     * labeled and styled form Field. A default Template is supplied, but this may be
+     * overriden to create custom field structures. The template processes values returned from
+     * {@link Ext.layout.FormLayout#getTemplateArgs}.
+     * @property fieldTpl
+     * @type Ext.Template
+     */
+    fieldTpl: (function() {
+        var t = new Ext.Template(
+            '<div class="x-form-item {itemCls}" tabIndex="-1">',
+                '<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>',
+                '<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">',
+                '</div><div class="{clearCls}"></div>',
+            '</div>'
+        );
+        t.disableFormats = true;
+        return t.compile();
+    })(),
+
+    /*
+     * Destroys this layout. This is a template method that is empty by default, but should be implemented
+     * by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
+     * @protected
+     */
+    destroy : function(){
+        // Stop any buffered layout tasks
+        if(this.resizeTask && this.resizeTask.cancel){
+            this.resizeTask.cancel();
+        }
+        if(this.container) {
+            this.container.un(this.container.resizeEvent, this.onResize, this);
+        }
+        if(!Ext.isEmpty(this.targetCls)){
+            var target = this.container.getLayoutTarget();
+            if(target){
+                target.removeClass(this.targetCls);
+            }
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FitLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FitLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FitLayout.js	(revision 76)
@@ -0,0 +1,58 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.FitLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a base class for layouts that contain <b>a single item</b> that automatically expands to fill the layout's
+ * container.  This class is intended to be extended or created via the <tt>layout:'fit'</tt> {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>FitLayout does not have any direct config options (other than inherited ones).  To fit a panel to a container
+ * using FitLayout, simply set layout:'fit' on the container and add a single panel to it.  If the container has
+ * multiple panels, only the first one will be displayed.  Example usage:</p>
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Fit Layout',
+    layout:'fit',
+    items: {
+        title: 'Inner Panel',
+        html: '&lt;p&gt;This is the inner panel content&lt;/p&gt;',
+        border: false
+    }
+});
+</code></pre>
+ */
+Ext.layout.FitLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'fit',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        if (!target) {
+            return {};
+        }
+        // Style Sized (scrollbars not included)
+        return target.getStyleSize();
+    },
+
+    // private
+    onLayout : function(ct, target){
+        Ext.layout.FitLayout.superclass.onLayout.call(this, ct, target);
+        if(!ct.collapsed){
+            this.setItemSize(this.activeItem || ct.items.itemAt(0), this.getLayoutTargetSize());
+        }
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(item && size.height > 0){ // display none?
+            item.setSize(size);
+        }
+    }
+});
+Ext.Container.LAYOUTS['fit'] = Ext.layout.FitLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/TableLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/TableLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/TableLayout.js	(revision 76)
@@ -0,0 +1,210 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.TableLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This layout allows you to easily render content into an HTML table.  The total number of columns can be
+ * specified, and rowspan and colspan can be used to create complex layouts within the table.
+ * This class is intended to be extended or created via the layout:'table' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>Note that when creating a layout via config, the layout-specific config properties must be passed in via
+ * the {@link Ext.Container#layoutConfig} object which will then be applied internally to the layout.  In the
+ * case of TableLayout, the only valid layout config property is {@link #columns}.  However, the items added to a
+ * TableLayout can supply the following table-specific config properties:</p>
+ * <ul>
+ * <li><b>rowspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>colspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>cellId</b> An id applied to the table cell containing the item.</li>
+ * <li><b>cellCls</b> A CSS class name added to the table cell containing the item.</li>
+ * </ul>
+ * <p>The basic concept of building up a TableLayout is conceptually very similar to building up a standard
+ * HTML table.  You simply add each panel (or "cell") that you want to include along with any span attributes
+ * specified as the special config properties of rowspan and colspan which work exactly like their HTML counterparts.
+ * Rather than explicitly creating and nesting rows and columns as you would in HTML, you simply specify the
+ * total column count in the layoutConfig and start adding panels in their natural order from left to right,
+ * top to bottom.  The layout will automatically figure out, based on the column count, rowspans and colspans,
+ * how to position each panel within the table.  Just like with HTML tables, your rowspans and colspans must add
+ * up correctly in your overall layout or you'll end up with missing and/or extra cells!  Example usage:</p>
+ * <pre><code>
+// This code will generate a layout table that is 3 columns by 2 rows
+// with some spanning included.  The basic layout will be:
+// +--------+-----------------+
+// |   A    |   B             |
+// |        |--------+--------|
+// |        |   C    |   D    |
+// +--------+--------+--------+
+var table = new Ext.Panel({
+    title: 'Table Layout',
+    layout:'table',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle:'padding:20px'
+    },
+    layoutConfig: {
+        // The total column count must be specified here
+        columns: 3
+    },
+    items: [{
+        html: '&lt;p&gt;Cell A content&lt;/p&gt;',
+        rowspan: 2
+    },{
+        html: '&lt;p&gt;Cell B content&lt;/p&gt;',
+        colspan: 2
+    },{
+        html: '&lt;p&gt;Cell C content&lt;/p&gt;',
+        cellCls: 'highlight'
+    },{
+        html: '&lt;p&gt;Cell D content&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.TableLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Number} columns
+     * The total number of columns to create in the table for this layout.  If not specified, all Components added to
+     * this layout will be rendered into a single row using one column per Component.
+     */
+
+    // private
+    monitorResize:false,
+
+    type: 'table',
+
+    targetCls: 'x-table-layout-ct',
+
+    /**
+     * @cfg {Object} tableAttrs
+     * <p>An object containing properties which are added to the {@link Ext.DomHelper DomHelper} specification
+     * used to create the layout's <tt>&lt;table&gt;</tt> element. Example:</p><pre><code>
+{
+    xtype: 'panel',
+    layout: 'table',
+    layoutConfig: {
+        tableAttrs: {
+            style: {
+                width: '100%'
+            }
+        },
+        columns: 3
+    }
+}</code></pre>
+     */
+    tableAttrs:null,
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.TableLayout.superclass.setContainer.call(this, ct);
+
+        this.currentRow = 0;
+        this.currentColumn = 0;
+        this.cells = [];
+    },
+    
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items, len = cs.length, c, i;
+
+        if(!this.table){
+            target.addClass('x-table-layout-ct');
+
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        this.renderAll(ct, target);
+    },
+
+    // private
+    getRow : function(index){
+        var row = this.table.tBodies[0].childNodes[index];
+        if(!row){
+            row = document.createElement('tr');
+            this.table.tBodies[0].appendChild(row);
+        }
+        return row;
+    },
+
+    // private
+    getNextCell : function(c){
+        var cell = this.getNextNonSpan(this.currentColumn, this.currentRow);
+        var curCol = this.currentColumn = cell[0], curRow = this.currentRow = cell[1];
+        for(var rowIndex = curRow; rowIndex < curRow + (c.rowspan || 1); rowIndex++){
+            if(!this.cells[rowIndex]){
+                this.cells[rowIndex] = [];
+            }
+            for(var colIndex = curCol; colIndex < curCol + (c.colspan || 1); colIndex++){
+                this.cells[rowIndex][colIndex] = true;
+            }
+        }
+        var td = document.createElement('td');
+        if(c.cellId){
+            td.id = c.cellId;
+        }
+        var cls = 'x-table-layout-cell';
+        if(c.cellCls){
+            cls += ' ' + c.cellCls;
+        }
+        td.className = cls;
+        if(c.colspan){
+            td.colSpan = c.colspan;
+        }
+        if(c.rowspan){
+            td.rowSpan = c.rowspan;
+        }
+        this.getRow(curRow).appendChild(td);
+        return td;
+    },
+
+    // private
+    getNextNonSpan: function(colIndex, rowIndex){
+        var cols = this.columns;
+        while((cols && colIndex >= cols) || (this.cells[rowIndex] && this.cells[rowIndex][colIndex])) {
+            if(cols && colIndex >= cols){
+                rowIndex++;
+                colIndex = 0;
+            }else{
+                colIndex++;
+            }
+        }
+        return [colIndex, rowIndex];
+    },
+
+    // private
+    renderItem : function(c, position, target){
+        // Ensure we have our inner table to get cells to render into.
+        if(!this.table){
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        if(c && !c.rendered){
+            c.render(this.getNextCell(c));
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            var container = this.getNextCell(c);
+            container.insertBefore(c.getPositionEl().dom, null);
+            c.container = Ext.get(container);
+            this.configureItem(c);
+        }
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return c.getPositionEl().up('table', 5).dom.parentNode === (target.dom || target);
+    },
+    
+    destroy: function(){
+        delete this.table;
+        Ext.layout.TableLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['table'] = Ext.layout.TableLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/BoxLayout.js	(revision 76)
@@ -0,0 +1,340 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.BoxLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Base Class for HBoxLayout and VBoxLayout Classes. Generally it should not need to be used directly.</p>
+ */
+Ext.layout.BoxLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Object} defaultMargins
+     * <p>If the individual contained items do not have a <tt>margins</tt>
+     * property specified, the default margins from this property will be
+     * applied to each item.</p>
+     * <br><p>This property may be specified as an object containing margins
+     * to apply in the format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>This property may also be specified as a string containing
+     * space-separated, numeric margin values. The order of the sides associated
+     * with each value matches the way CSS processes margin values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    /**
+     * @cfg {String} padding
+     * <p>Sets the padding to be applied to all child items managed by this layout.</p>
+     * <p>This property must be specified as a string containing
+     * space-separated, numeric padding values. The order of the sides associated
+     * with each value matches the way CSS processes padding values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to: <code>"0"</code></p>
+     */
+    padding : '0',
+    // documented in subclasses
+    pack : 'start',
+
+    // private
+    monitorResize : true,
+    type: 'box',
+    scrollOffset : 0,
+    extraCls : 'x-box-item',
+    targetCls : 'x-box-layout-ct',
+    innerCls : 'x-box-inner',
+
+    constructor : function(config){
+        Ext.layout.BoxLayout.superclass.constructor.call(this, config);
+
+        if (Ext.isString(this.defaultMargins)) {
+            this.defaultMargins = this.parseMargins(this.defaultMargins);
+        }
+        
+        var handler = this.overflowHandler;
+        
+        if (typeof handler == 'string') {
+            handler = {
+                type: handler
+            };
+        }
+        
+        var handlerType = 'none';
+        if (handler && handler.type != undefined) {
+            handlerType = handler.type;
+        }
+        
+        var constructor = Ext.layout.boxOverflow[handlerType];
+        if (constructor[this.type]) {
+            constructor = constructor[this.type];
+        }
+        
+        this.overflowHandler = new constructor(this, handler);
+    },
+
+    /**
+     * @private
+     * Runs the child box calculations and caches them in childBoxCache. Subclasses can used these cached values
+     * when laying out
+     */
+    onLayout: function(container, target) {
+        Ext.layout.BoxLayout.superclass.onLayout.call(this, container, target);
+
+        var tSize = this.getLayoutTargetSize(),
+            items = this.getVisibleItems(container),
+            calcs = this.calculateChildBoxes(items, tSize),
+            boxes = calcs.boxes,
+            meta  = calcs.meta;
+        
+        //invoke the overflow handler, if one is configured
+        if (tSize.width > 0) {
+            var handler = this.overflowHandler,
+                method  = meta.tooNarrow ? 'handleOverflow' : 'clearOverflow';
+            
+            var results = handler[method](calcs, tSize);
+            
+            if (results) {
+                if (results.targetSize) {
+                    tSize = results.targetSize;
+                }
+                
+                if (results.recalculate) {
+                    items = this.getVisibleItems(container);
+                    calcs = this.calculateChildBoxes(items, tSize);
+                    boxes = calcs.boxes;
+                }
+            }
+        }
+        
+        /**
+         * @private
+         * @property layoutTargetLastSize
+         * @type Object
+         * Private cache of the last measured size of the layout target. This should never be used except by
+         * BoxLayout subclasses during their onLayout run.
+         */
+        this.layoutTargetLastSize = tSize;
+        
+        /**
+         * @private
+         * @property childBoxCache
+         * @type Array
+         * Array of the last calculated height, width, top and left positions of each visible rendered component
+         * within the Box layout.
+         */
+        this.childBoxCache = calcs;
+        
+        this.updateInnerCtSize(tSize, calcs);
+        this.updateChildBoxes(boxes);
+
+        // Putting a box layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        this.handleTargetOverflow(tSize, container, target);
+    },
+
+    /**
+     * Resizes and repositions each child component
+     * @param {Array} boxes The box measurements
+     */
+    updateChildBoxes: function(boxes) {
+        for (var i = 0, length = boxes.length; i < length; i++) {
+            var box  = boxes[i],
+                comp = box.component;
+            
+            if (box.dirtySize) {
+                comp.setSize(box.width, box.height);
+            }
+            // Don't set positions to NaN
+            if (isNaN(box.left) || isNaN(box.top)) {
+                continue;
+            }
+            
+            comp.setPosition(box.left, box.top);
+        }
+    },
+
+    /**
+     * @private
+     * Called by onRender just before the child components are sized and positioned. This resizes the innerCt
+     * to make sure all child items fit within it. We call this before sizing the children because if our child
+     * items are larger than the previous innerCt size the browser will insert scrollbars and then remove them
+     * again immediately afterwards, giving a performance hit.
+     * Subclasses should provide an implementation.
+     * @param {Object} currentSize The current height and width of the innerCt
+     * @param {Array} calculations The new box calculations of all items to be laid out
+     */
+    updateInnerCtSize: function(tSize, calcs) {
+        var align   = this.align,
+            padding = this.padding,
+            width   = tSize.width,
+            height  = tSize.height;
+        
+        if (this.type == 'hbox') {
+            var innerCtWidth  = width,
+                innerCtHeight = calcs.meta.maxHeight + padding.top + padding.bottom;
+
+            if (align == 'stretch') {
+                innerCtHeight = height;
+            } else if (align == 'middle') {
+                innerCtHeight = Math.max(height, innerCtHeight);
+            }
+        } else {
+            var innerCtHeight = height,
+                innerCtWidth  = calcs.meta.maxWidth + padding.left + padding.right;
+
+            if (align == 'stretch') {
+                innerCtWidth = width;
+            } else if (align == 'center') {
+                innerCtWidth = Math.max(width, innerCtWidth);
+            }
+        }
+
+        this.innerCt.setSize(innerCtWidth || undefined, innerCtHeight || undefined);
+    },
+
+    /**
+     * @private
+     * This should be called after onLayout of any BoxLayout subclass. If the target's overflow is not set to 'hidden',
+     * we need to lay out a second time because the scrollbars may have modified the height and width of the layout
+     * target. Having a Box layout inside such a target is therefore not recommended.
+     * @param {Object} previousTargetSize The size and height of the layout target before we just laid out
+     * @param {Ext.Container} container The container
+     * @param {Ext.Element} target The target element
+     */
+    handleTargetOverflow: function(previousTargetSize, container, target) {
+        var overflow = target.getStyle('overflow');
+
+        if (overflow && overflow != 'hidden' &&!this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != previousTargetSize.width || newTargetSize.height != previousTargetSize.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    isValidParent : function(c, target) {
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    /**
+     * @private
+     * Returns all items that are both rendered and visible
+     * @return {Array} All matching items
+     */
+    getVisibleItems: function(ct) {
+        var ct  = ct || this.container,
+            t   = ct.getLayoutTarget(),
+            cti = ct.items.items,
+            len = cti.length,
+
+            i, c, items = [];
+
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.hidden !== true  && c.collapsed !== true && c.shouldLayout !== false){
+                items.push(c);
+            }
+        }
+
+        return items;
+    },
+
+    // private
+    renderAll : function(ct, target) {
+        if (!this.innerCt) {
+            // the innerCt prevents wrapping and shuffling while the container is resizing
+            this.innerCt = target.createChild({cls:this.innerCls});
+            this.padding = this.parseMargins(this.padding);
+        }
+        Ext.layout.BoxLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width  -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        
+        return ret;
+    },
+
+    // private
+    renderItem : function(c) {
+        if(Ext.isString(c.margins)){
+            c.margins = this.parseMargins(c.margins);
+        }else if(!c.margins){
+            c.margins = this.defaultMargins;
+        }
+        Ext.layout.BoxLayout.superclass.renderItem.apply(this, arguments);
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.overflowHandler);
+        
+        Ext.layout.BoxLayout.superclass.destroy.apply(this, arguments);
+    }
+});
+
+/**
+ * @class Ext.layout.boxOverflow.None
+ * @extends Object
+ * Base class for Box Layout overflow handlers. These specialized classes are invoked when a Box Layout
+ * (either an HBox or a VBox) has child items that are either too wide (for HBox) or too tall (for VBox)
+ * for its container.
+ */
+
+Ext.layout.boxOverflow.None = Ext.extend(Object, {
+    constructor: function(layout, config) {
+        this.layout = layout;
+        
+        Ext.apply(this, config || {});
+    },
+    
+    handleOverflow: Ext.emptyFn,
+    
+    clearOverflow: Ext.emptyFn
+});
+
+
+Ext.layout.boxOverflow.none = Ext.layout.boxOverflow.None;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ColumnLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ColumnLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ColumnLayout.js	(revision 76)
@@ -0,0 +1,176 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.ColumnLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is the layout style of choice for creating structural layouts in a multi-column format where the width of
+ * each column can be specified as a percentage or fixed width, but the height is allowed to vary based on the content.
+ * This class is intended to be extended or created via the layout:'column' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>ColumnLayout does not have any direct config options (other than inherited ones), but it does support a
+ * specific config property of <b><tt>columnWidth</tt></b> that can be included in the config of any panel added to it.  The
+ * layout will use the columnWidth (if present) or width of each panel during layout to determine how to size each panel.
+ * If width or columnWidth is not specified for a given panel, its width will default to the panel's width (or auto).</p>
+ * <p>The width property is always evaluated as pixels, and must be a number greater than or equal to 1.
+ * The columnWidth property is always evaluated as a percentage, and must be a decimal value greater than 0 and
+ * less than 1 (e.g., .25).</p>
+ * <p>The basic rules for specifying column widths are pretty simple.  The logic makes two passes through the
+ * set of contained panels.  During the first layout pass, all panels that either have a fixed width or none
+ * specified (auto) are skipped, but their widths are subtracted from the overall container width.  During the second
+ * pass, all panels with columnWidths are assigned pixel widths in proportion to their percentages based on
+ * the total <b>remaining</b> container width.  In other words, percentage width panels are designed to fill the space
+ * left over by all the fixed-width and/or auto-width panels.  Because of this, while you can specify any number of columns
+ * with different percentages, the columnWidths must always add up to 1 (or 100%) when added together, otherwise your
+ * layout may not render as expected.  Example usage:</p>
+ * <pre><code>
+// All columns are percentages -- they must add up to 1
+var p = new Ext.Panel({
+    title: 'Column Layout - Percentage Only',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        columnWidth: .25
+    },{
+        title: 'Column 2',
+        columnWidth: .6
+    },{
+        title: 'Column 3',
+        columnWidth: .15
+    }]
+});
+
+// Mix of width and columnWidth -- all columnWidth values must add up
+// to 1. The first column will take up exactly 120px, and the last two
+// columns will fill the remaining container width.
+var p = new Ext.Panel({
+    title: 'Column Layout - Mixed',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        width: 120
+    },{
+        title: 'Column 2',
+        columnWidth: .8
+    },{
+        title: 'Column 3',
+        columnWidth: .2
+    }]
+});
+</code></pre>
+ */
+Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'column',
+
+    extraCls: 'x-column',
+
+    scrollOffset : 0,
+
+    // private
+
+    targetCls: 'x-column-layout-ct',
+
+    isValidParent : function(c, target){
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    renderAll : function(ct, target) {
+        if(!this.innerCt){
+            // the innerCt prevents wrapping and shuffling while
+            // the container is resizing
+            this.innerCt = target.createChild({cls:'x-column-inner'});
+            this.innerCt.createChild({cls:'x-clear'});
+        }
+        Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items,
+            len = cs.length,
+            c,
+            i,
+            m,
+            margins = [];
+
+        this.renderAll(ct, target);
+
+        var size = this.getLayoutTargetSize();
+
+        if(size.width < 1 && size.height < 1){ // display none?
+            return;
+        }
+
+        var w = size.width - this.scrollOffset,
+            h = size.height,
+            pw = w;
+
+        this.innerCt.setWidth(w);
+
+        // some columns can be percentages while others are fixed
+        // so we need to make 2 passes
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = c.getPositionEl().getMargins('lr');
+            margins[i] = m;
+            if(!c.columnWidth){
+                pw -= (c.getWidth() + m);
+            }
+        }
+
+        pw = pw < 0 ? 0 : pw;
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = margins[i];
+            if(c.columnWidth){
+                c.setSize(Math.floor(c.columnWidth * pw) - m);
+            }
+        }
+
+        // Browsers differ as to when they account for scrollbars.  We need to re-measure to see if the scrollbar
+        // spaces were accounted for properly.  If not, re-layout.
+        if (Ext.isIE) {
+            if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+                var ts = this.getLayoutTargetSize();
+                if (ts.width != size.width){
+                    this.adjustmentPass = true;
+                    this.onLayout(ct, target);
+                }
+            }
+        }
+        delete this.adjustmentPass;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['column'] = Ext.layout.ColumnLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/HBoxLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/HBoxLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/HBoxLayout.js	(revision 76)
@@ -0,0 +1,291 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.HBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items horizontally across a Container. This layout optionally divides available horizontal
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the heights of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.HBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>top</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned vertically
+     * at the <b>top</b> of the container</div></li>
+     * <li><b><tt>middle</tt></b> : <div class="sub-desc">child items are aligned vertically in the
+     * <b>middle</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched vertically to fill
+     * the height of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched vertically to
+     * the height of the largest item.</div></li>
+     */
+    align: 'top', // top, middle, stretch, strechmax
+
+    type : 'hbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>left</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-width</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>right</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>horizontally</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the HBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availHeight  = Math.max(0, height - paddingVert),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexWidth = 0,
+            maxHeight    = 0,
+            totalFlex    = 0,
+            desiredWidth = 0,
+            minimumWidth = 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedWidth, 
+            horizMargins, vertMargins, stretchHeight;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child       = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static width (numeric) requires no calcs
+            if (typeof childWidth != 'number') {
+
+                // flex and not 'auto' width
+                if (child.flex && !childWidth) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' width or undefined width
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childWidth && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize   = child.getSize();
+                    childWidth  = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+
+            childMargins = child.margins;
+            horizMargins = childMargins.left + childMargins.right;
+
+            nonFlexWidth += horizMargins + (childWidth || 0);
+            desiredWidth += horizMargins + (child.flex ? child.minWidth || 0 : childWidth);
+            minimumWidth += horizMargins + (child.minWidth || childWidth || 0);
+
+            // Max height for align - force layout of non-laid out subcontainers without a numeric height
+            if (typeof childHeight != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childHeight = child.getHeight();
+            }
+
+            maxHeight = Math.max(maxHeight, childHeight + childMargins.top + childMargins.bottom);
+
+            //cache the size of each child component. Don't set height or width to 0, keep undefined instead
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth  || undefined
+            });
+        }
+                
+        var shortfall = desiredWidth - width,
+            tooNarrow = minimumWidth > width;
+            
+        //the width available to the flexed items
+        var availableWidth = Math.max(0, width - nonFlexWidth - paddingHoriz);
+        
+        if (tooNarrow) {
+            for (i = 0; i < visibleCount; i++) {
+                boxes[i].width = visibleItems[i].minWidth || visibleItems[i].width || boxes[i].width;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minWidths = [];
+                
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the width of each non-flexed item.
+                 * Flexed items are immediately reduced to their minWidth and anything already at minWidth is ignored.
+                 * The remaining items are collected into the minWidths array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item     = visibleItems[index],
+                        minWidth = item.minWidth || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minWidth because they're flexible and should be the first to lose width
+                    if (item.flex) {
+                        boxes[index].width = minWidth;
+                    } else {
+                        minWidths.push({
+                            minWidth : minWidth,
+                            available: boxes[index].width - minWidth,
+                            index    : index
+                        });
+                    }
+                }
+                
+                //sort by descending amount of width remaining before minWidth is reached
+                minWidths.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+                
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual width available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their width and minWidth first, so that if reducing the width by the average
+                 * amount would make that item less than its minWidth, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minWidths.length; i < length; i++) {
+                    var itemIndex = minWidths[i].index;
+                    
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+                        
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldWidth  = box.width,
+                        minWidth  = item.minWidth,
+                        newWidth  = Math.max(minWidth, oldWidth - Math.ceil(shortfall / (length - i))),
+                        reduction = oldWidth - newWidth;
+                    
+                    boxes[itemIndex].width = newWidth;
+                    shortfall -= reduction;                    
+                }
+            } else {
+                //temporary variables used in the flex width calculations below
+                var remainingWidth = availableWidth,
+                    remainingFlex  = totalFlex;
+
+                //calculate the widths of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    vertMargins  = childMargins.top + childMargins.bottom;
+
+                    if (isStart && child.flex && !child.width) {
+                        flexedWidth     = Math.ceil((child.flex / remainingFlex) * remainingWidth);
+                        remainingWidth -= flexedWidth;
+                        remainingFlex  -= child.flex;
+
+                        calcs.width = flexedWidth;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+        
+        if (isCenter) {
+            leftOffset += availableWidth / 2;
+        } else if (isEnd) {
+            leftOffset += availableWidth;
+        }
+        
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+            
+            childMargins = child.margins;
+            leftOffset  += childMargins.left;
+            vertMargins  = childMargins.top + childMargins.bottom;
+            
+            calcs.left = leftOffset;
+            calcs.top  = topOffset + childMargins.top;
+
+            switch (this.align) {
+                case 'stretch':
+                    stretchHeight = availHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchHeight = maxHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'middle':
+                    var diff = availHeight - calcs.height - vertMargins;
+                    if (diff > 0) {
+                        calcs.top = topOffset + vertMargins + (diff / 2);
+                    }
+            }
+            
+            leftOffset += calcs.width + childMargins.right;
+        }
+
+        return {
+            boxes: boxes,
+            meta : {
+                maxHeight   : maxHeight,
+                nonFlexWidth: nonFlexWidth,
+                desiredWidth: desiredWidth,
+                minimumWidth: minimumWidth,
+                shortfall   : desiredWidth - width,
+                tooNarrow   : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.hbox = Ext.layout.HBoxLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AccordionLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AccordionLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/AccordionLayout.js	(revision 76)
@@ -0,0 +1,202 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.AccordionLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This is a layout that manages multiple Panels in an expandable accordion style such that only
+ * <b>one Panel can be expanded at any given time</b>. Each Panel has built-in support for expanding and collapsing.</p>
+ * <p>Note: Only Ext.Panels <b>and all subclasses of Ext.Panel</b> may be used in an accordion layout Container.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var accordion = new Ext.Panel({
+    title: 'Accordion Layout',
+    layout:'accordion',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle: 'padding:15px'
+    },
+    layoutConfig: {
+        // layout-specific configs go here
+        titleCollapse: false,
+        animate: true,
+        activeOnTop: true
+    },
+    items: [{
+        title: 'Panel 1',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 2',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 3',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AccordionLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} fill
+     * True to adjust the active item's height to fill the available space in the container, false to use the
+     * item's current height, or auto height if not explicitly set (defaults to true).
+     */
+    fill : true,
+    /**
+     * @cfg {Boolean} autoWidth
+     * True to set each contained item's width to 'auto', false to use the item's current width (defaults to true).
+     * Note that some components, in particular the {@link Ext.grid.GridPanel grid}, will not function properly within
+     * layouts if they have auto width, so in such cases this config should be set to false.
+     */
+    autoWidth : true,
+    /**
+     * @cfg {Boolean} titleCollapse
+     * True to allow expand/collapse of each contained panel by clicking anywhere on the title bar, false to allow
+     * expand/collapse only when the toggle tool button is clicked (defaults to true).  When set to false,
+     * {@link #hideCollapseTool} should be false also.
+     */
+    titleCollapse : true,
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * True to hide the contained panels' collapse/expand toggle buttons, false to display them (defaults to false).
+     * When set to true, {@link #titleCollapse} should be true also.
+     */
+    hideCollapseTool : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * True to make sure the collapse/expand toggle button always renders first (to the left of) any other tools
+     * in the contained panels' title bars, false to render it last (defaults to false).
+     */
+    collapseFirst : false,
+    /**
+     * @cfg {Boolean} animate
+     * True to slide the contained panels open and closed during expand/collapse using animation, false to open and
+     * close directly with no animation (defaults to false).  Note: to defer to the specific config setting of each
+     * contained panel for this property, set this to undefined at the layout level.
+     */
+    animate : false,
+    /**
+     * @cfg {Boolean} sequence
+     * <b>Experimental</b>. If animate is set to true, this will result in each animation running in sequence.
+     */
+    sequence : false,
+    /**
+     * @cfg {Boolean} activeOnTop
+     * True to swap the position of each panel as it is expanded so that it becomes the first item in the container,
+     * false to keep the panels in the rendered order. <b>This is NOT compatible with "animate:true"</b> (defaults to false).
+     */
+    activeOnTop : false,
+
+    type: 'accordion',
+
+    renderItem : function(c){
+        if(this.animate === false){
+            c.animCollapse = false;
+        }
+        c.collapsible = true;
+        if(this.autoWidth){
+            c.autoWidth = true;
+        }
+        if(this.titleCollapse){
+            c.titleCollapse = true;
+        }
+        if(this.hideCollapseTool){
+            c.hideCollapseTool = true;
+        }
+        if(this.collapseFirst !== undefined){
+            c.collapseFirst = this.collapseFirst;
+        }
+        if(!this.activeItem && !c.collapsed){
+            this.setActiveItem(c, true);
+        }else if(this.activeItem && this.activeItem != c){
+            c.collapsed = true;
+        }
+        Ext.layout.AccordionLayout.superclass.renderItem.apply(this, arguments);
+        c.header.addClass('x-accordion-hd');
+        c.on('beforeexpand', this.beforeExpand, this);
+    },
+
+    onRemove: function(c){
+        Ext.layout.AccordionLayout.superclass.onRemove.call(this, c);
+        if(c.rendered){
+            c.header.removeClass('x-accordion-hd');
+        }
+        c.un('beforeexpand', this.beforeExpand, this);
+    },
+
+    // private
+    beforeExpand : function(p, anim){
+        var ai = this.activeItem;
+        if(ai){
+            if(this.sequence){
+                delete this.activeItem;
+                if (!ai.collapsed){
+                    ai.collapse({callback:function(){
+                        p.expand(anim || true);
+                    }, scope: this});
+                    return false;
+                }
+            }else{
+                ai.collapse(this.animate);
+            }
+        }
+        this.setActive(p);
+        if(this.activeOnTop){
+            p.el.dom.parentNode.insertBefore(p.el.dom, p.el.dom.parentNode.firstChild);
+        }
+        // Items have been hidden an possibly rearranged, we need to get the container size again.
+        this.layout();
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(this.fill && item){
+            var hh = 0, i, ct = this.getRenderedItems(this.container), len = ct.length, p;
+            // Add up all the header heights
+            for (i = 0; i < len; i++) {
+                if((p = ct[i]) != item && !p.hidden){
+                    hh += p.header.getHeight();
+                }
+            };
+            // Subtract the header heights from the container size
+            size.height -= hh;
+            // Call setSize on the container to set the correct height.  For Panels, deferedHeight
+            // will simply store this size for when the expansion is done.
+            item.setSize(size);
+        }
+    },
+
+    /**
+     * Sets the active (expanded) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        this.setActive(item, true);
+    },
+
+    // private
+    setActive : function(item, expand){
+        var ai = this.activeItem;
+        item = this.container.getComponent(item);
+        if(ai != item){
+            if(item.rendered && item.collapsed && expand){
+                item.expand();
+            }else{
+                if(ai){
+                   ai.fireEvent('deactivate', ai);
+                }
+                this.activeItem = item;
+                item.fireEvent('activate', item);
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS.accordion = Ext.layout.AccordionLayout;
+
+//backwards compat
+Ext.layout.Accordion = Ext.layout.AccordionLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ToolbarLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ToolbarLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/ToolbarLayout.js	(revision 76)
@@ -0,0 +1,439 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.ToolbarLayout
+ * @extends Ext.layout.ContainerLayout
+ * Layout manager used by Ext.Toolbar. This is highly specialised for use by Toolbars and would not
+ * usually be used by any other class.
+ */
+Ext.layout.ToolbarLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'toolbar',
+
+    /**
+     * @property triggerWidth
+     * @type Number
+     * The width allocated for the menu trigger at the extreme right end of the Toolbar
+     */
+    triggerWidth: 18,
+
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+
+    /**
+     * @private
+     * @property lastOverflow
+     * @type Boolean
+     * Used internally to record whether the last layout caused an overflow or not
+     */
+    lastOverflow: false,
+
+    /**
+     * @private
+     * @property tableHTML
+     * @type String
+     * String used to build the HTML injected to support the Toolbar's layout. The align property is
+     * injected into this string inside the td.x-toolbar-left element during onLayout.
+     */
+    tableHTML: [
+        '<table cellspacing="0" class="x-toolbar-ct">',
+            '<tbody>',
+                '<tr>',
+                    '<td class="x-toolbar-left" align="{0}">',
+                        '<table cellspacing="0">',
+                            '<tbody>',
+                                '<tr class="x-toolbar-left-row"></tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                    '<td class="x-toolbar-right" align="right">',
+                        '<table cellspacing="0" class="x-toolbar-right-ct">',
+                            '<tbody>',
+                                '<tr>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-right-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-extras-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                '</tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                '</tr>',
+            '</tbody>',
+        '</table>'
+    ].join(""),
+
+    /**
+     * @private
+     * Create the wrapping Toolbar HTML and render/move all the items into the correct places
+     */
+    onLayout : function(ct, target) {
+        //render the Toolbar <table> HTML if it's not already present
+        if (!this.leftTr) {
+            var align = ct.buttonAlign == 'center' ? 'center' : 'left';
+
+            target.addClass('x-toolbar-layout-ct');
+            target.insertHtml('beforeEnd', String.format(this.tableHTML, align));
+
+            this.leftTr   = target.child('tr.x-toolbar-left-row', true);
+            this.rightTr  = target.child('tr.x-toolbar-right-row', true);
+            this.extrasTr = target.child('tr.x-toolbar-extras-row', true);
+
+            if (this.hiddenItem == undefined) {
+                /**
+                 * @property hiddenItems
+                 * @type Array
+                 * Holds all items that are currently hidden due to there not being enough space to render them
+                 * These items will appear on the expand menu.
+                 */
+                this.hiddenItems = [];
+            }
+        }
+
+        var side     = ct.buttonAlign == 'right' ? this.rightTr : this.leftTr,
+            items    = ct.items.items,
+            position = 0;
+
+        //render each item if not already rendered, place it into the correct (left or right) target
+        for (var i = 0, len = items.length, c; i < len; i++, position++) {
+            c = items[i];
+
+            if (c.isFill) {
+                side   = this.rightTr;
+                position = -1;
+            } else if (!c.rendered) {
+                c.render(this.insertCell(c, side, position));
+                this.configureItem(c);
+            } else {
+                if (!c.xtbHidden && !this.isValidParent(c, side.childNodes[position])) {
+                    var td = this.insertCell(c, side, position);
+                    td.appendChild(c.getPositionEl().dom);
+                    c.container = Ext.get(td);
+                }
+            }
+        }
+
+        //strip extra empty cells
+        this.cleanup(this.leftTr);
+        this.cleanup(this.rightTr);
+        this.cleanup(this.extrasTr);
+        this.fitToSize(target);
+    },
+
+    /**
+     * @private
+     * Removes any empty nodes from the given element
+     * @param {Ext.Element} el The element to clean up
+     */
+    cleanup : function(el) {
+        var cn = el.childNodes, i, c;
+
+        for (i = cn.length-1; i >= 0 && (c = cn[i]); i--) {
+            if (!c.firstChild) {
+                el.removeChild(c);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Inserts the given Toolbar item into the given element
+     * @param {Ext.Component} c The component to add
+     * @param {Ext.Element} target The target to add the component to
+     * @param {Number} position The position to add the component at
+     */
+    insertCell : function(c, target, position) {
+        var td = document.createElement('td');
+        td.className = 'x-toolbar-cell';
+
+        target.insertBefore(td, target.childNodes[position] || null);
+
+        return td;
+    },
+
+    /**
+     * @private
+     * Hides an item because it will not fit in the available width. The item will be unhidden again
+     * if the Toolbar is resized to be large enough to show it
+     * @param {Ext.Component} item The item to hide
+     */
+    hideItem : function(item) {
+        this.hiddenItems.push(item);
+
+        item.xtbHidden = true;
+        item.xtbWidth = item.getPositionEl().dom.parentNode.offsetWidth;
+        item.hide();
+    },
+
+    /**
+     * @private
+     * Unhides an item that was previously hidden due to there not being enough space left on the Toolbar
+     * @param {Ext.Component} item The item to show
+     */
+    unhideItem : function(item) {
+        item.show();
+        item.xtbHidden = false;
+        this.hiddenItems.remove(item);
+    },
+
+    /**
+     * @private
+     * Returns the width of the given toolbar item. If the item is currently hidden because there
+     * is not enough room to render it, its previous width is returned
+     * @param {Ext.Component} c The component to measure
+     * @return {Number} The width of the item
+     */
+    getItemWidth : function(c) {
+        return c.hidden ? (c.xtbWidth || 0) : c.getPositionEl().dom.parentNode.offsetWidth;
+    },
+
+    /**
+     * @private
+     * Called at the end of onLayout. At this point the Toolbar has already been resized, so we need
+     * to fit the items into the available width. We add up the width required by all of the items in
+     * the toolbar - if we don't have enough space we hide the extra items and render the expand menu
+     * trigger.
+     * @param {Ext.Element} target The Element the Toolbar is currently laid out within
+     */
+    fitToSize : function(target) {
+        if (this.container.enableOverflow === false) {
+            return;
+        }
+
+        var width       = target.dom.clientWidth,
+            tableWidth  = target.dom.firstChild.offsetWidth,
+            clipWidth   = width - this.triggerWidth,
+            lastWidth   = this.lastWidth || 0,
+
+            hiddenItems = this.hiddenItems,
+            hasHiddens  = hiddenItems.length != 0,
+            isLarger    = width >= lastWidth;
+
+        this.lastWidth  = width;
+
+        if (tableWidth > width || (hasHiddens && isLarger)) {
+            var items     = this.container.items.items,
+                len       = items.length,
+                loopWidth = 0,
+                item;
+
+            for (var i = 0; i < len; i++) {
+                item = items[i];
+
+                if (!item.isFill) {
+                    loopWidth += this.getItemWidth(item);
+                    if (loopWidth > clipWidth) {
+                        if (!(item.hidden || item.xtbHidden)) {
+                            this.hideItem(item);
+                        }
+                    } else if (item.xtbHidden) {
+                        this.unhideItem(item);
+                    }
+                }
+            }
+        }
+
+        //test for number of hidden items again here because they may have changed above
+        hasHiddens = hiddenItems.length != 0;
+
+        if (hasHiddens) {
+            this.initMore();
+
+            if (!this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, true);
+                this.lastOverflow = true;
+            }
+        } else if (this.more) {
+            this.clearMenu();
+            this.more.destroy();
+            delete this.more;
+
+            if (this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, false);
+                this.lastOverflow = false;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+
+    /**
+     * @private
+     * Called before the expand menu is shown, this rebuilds the menu since it was last shown because
+     * it is possible that the items hidden due to space limitations on the Toolbar have changed since.
+     * @param {Ext.menu.Menu} m The menu
+     */
+    beforeMoreShow : function(menu) {
+        var items = this.container.items.items,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+
+        this.clearMenu();
+        menu.removeAll();
+        for (var i = 0; i < len; i++) {
+            item = items[i];
+            if (item.xtbHidden) {
+                if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                    menu.add('-');
+                }
+                this.addComponentToMenu(menu, item);
+                prev = item;
+            }
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+
+    /**
+     * @private
+     * Creates the expand trigger and menu, adding them to the <tr> at the extreme right of the
+     * Toolbar table
+     */
+    initMore : function(){
+        if (!this.more) {
+            /**
+             * @private
+             * @property moreMenu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every Toolbar item that cannot be shown
+             * because the Toolbar is currently not wide enough.
+             */
+            this.moreMenu = new Ext.menu.Menu({
+                ownerCt : this.container,
+                listeners: {
+                    beforeshow: this.beforeMoreShow,
+                    scope: this
+                }
+            });
+
+            /**
+             * @private
+             * @property more
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.more = new Ext.Button({
+                iconCls: 'x-toolbar-more-icon',
+                cls    : 'x-toolbar-more',
+                menu   : this.moreMenu,
+                ownerCt: this.container
+            });
+
+            var td = this.insertCell(this.more, this.extrasTr, 100);
+            this.more.render(td);
+        }
+    },
+
+    destroy : function(){
+        Ext.destroy(this.more, this.moreMenu);
+        delete this.leftTr;
+        delete this.rightTr;
+        delete this.extrasTr;
+        Ext.layout.ToolbarLayout.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS.toolbar = Ext.layout.ToolbarLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FormLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FormLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/FormLayout.js	(revision 76)
@@ -0,0 +1,366 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.FormLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This layout manager is specifically designed for rendering and managing child Components of
+ * {@link Ext.form.FormPanel forms}. It is responsible for rendering the labels of
+ * {@link Ext.form.Field Field}s.</p>
+ *
+ * <p>This layout manager is used when a Container is configured with the <tt>layout:'form'</tt>
+ * {@link Ext.Container#layout layout} config option, and should generally not need to be created directly
+ * via the new keyword. See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ *
+ * <p>In an application, it will usually be preferrable to use a {@link Ext.form.FormPanel FormPanel}
+ * (which is configured with FormLayout as its layout class by default) since it also provides built-in
+ * functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form.</p>
+ *
+ * <p>A {@link Ext.Container Container} <i>using</i> the FormLayout layout manager (e.g.
+ * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) can also accept the following
+ * layout-specific config properties:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.form.FormPanel#hideLabels hideLabels}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelAlign labelAlign}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelPad labelPad}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelWidth labelWidth}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component (including Fields) managed by FormLayout accepts the following as a config option:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#anchor anchor}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component managed by FormLayout may be rendered as a form field (with an associated label) by
+ * configuring it with a non-null <b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b>. Components configured
+ * in this way may be configured with the following options which affect the way the FormLayout renders them:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#clearCls clearCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#hideLabel hideLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#itemCls itemCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelStyle labelStyle}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Example usage:</p>
+ * <pre><code>
+// Required if showing validation messages
+Ext.QuickTips.init();
+
+// While you can create a basic Panel with layout:'form', practically
+// you should usually use a FormPanel to also get its form functionality
+// since it already creates a FormLayout internally.
+var form = new Ext.form.FormPanel({
+    title: 'Form Layout',
+    bodyStyle: 'padding:15px',
+    width: 350,
+    defaultType: 'textfield',
+    defaults: {
+        // applied to each contained item
+        width: 230,
+        msgTarget: 'side'
+    },
+    items: [{
+            fieldLabel: 'First Name',
+            name: 'first',
+            allowBlank: false,
+            {@link Ext.Component#labelSeparator labelSeparator}: ':' // override labelSeparator layout config
+        },{
+            fieldLabel: 'Last Name',
+            name: 'last'
+        },{
+            fieldLabel: 'Email',
+            name: 'email',
+            vtype:'email'
+        }, {
+            xtype: 'textarea',
+            hideLabel: true,     // override hideLabels layout config
+            name: 'msg',
+            anchor: '100% -53'
+        }
+    ],
+    buttons: [
+        {text: 'Save'},
+        {text: 'Cancel'}
+    ],
+    layoutConfig: {
+        {@link #labelSeparator}: '~' // superseded by assignment below
+    },
+    // config options applicable to container when layout='form':
+    hideLabels: false,
+    labelAlign: 'left',   // or 'right' or 'top'
+    {@link Ext.form.FormPanel#labelSeparator labelSeparator}: '>>', // takes precedence over layoutConfig value
+    labelWidth: 65,       // defaults to 100
+    labelPad: 8           // defaults to 5, must specify labelWidth to be honored
+});
+</code></pre>
+ */
+Ext.layout.FormLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.form.FormPanel}.{@link Ext.form.FormPanel#labelSeparator labelSeparator}.  Configuration
+     * of this property at the <b>container</b> level takes precedence.
+     */
+    labelSeparator : ':',
+
+    /**
+     * Read only. The CSS style specification string added to field labels in this layout if not
+     * otherwise {@link Ext.Component#labelStyle specified by each contained field}.
+     * @type String
+     * @property labelStyle
+     */
+
+    /**
+     * @cfg {Boolean} trackLabels
+     * True to show/hide the field label when the field is hidden. Defaults to <tt>true</tt>.
+     */
+    trackLabels: true,
+
+    type: 'form',
+
+    onRemove: function(c){
+        Ext.layout.FormLayout.superclass.onRemove.call(this, c);
+        if(this.trackLabels){
+            c.un('show', this.onFieldShow, this);
+            c.un('hide', this.onFieldHide, this);
+        }
+        // check for itemCt, since we may be removing a fieldset or something similar
+        var el = c.getPositionEl(),
+            ct = c.getItemCt && c.getItemCt();
+        if (c.rendered && ct) {
+            if (el && el.dom) {
+                el.insertAfter(ct);
+            }
+            Ext.destroy(ct);
+            Ext.destroyMembers(c, 'label', 'itemCt');
+            if (c.customItemCt) {
+                Ext.destroyMembers(c, 'getItemCt', 'customItemCt');
+            }
+        }
+    },
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.FormLayout.superclass.setContainer.call(this, ct);
+        if(ct.labelAlign){
+            ct.addClass('x-form-label-'+ct.labelAlign);
+        }
+
+        if(ct.hideLabels){
+            Ext.apply(this, {
+                labelStyle: 'display:none',
+                elementStyle: 'padding-left:0;',
+                labelAdjust: 0
+            });
+        }else{
+            this.labelSeparator = Ext.isDefined(ct.labelSeparator) ? ct.labelSeparator : this.labelSeparator;
+            ct.labelWidth = ct.labelWidth || 100;
+            if(Ext.isNumber(ct.labelWidth)){
+                var pad = Ext.isNumber(ct.labelPad) ? ct.labelPad : 5;
+                Ext.apply(this, {
+                    labelAdjust: ct.labelWidth + pad,
+                    labelStyle: 'width:' + ct.labelWidth + 'px;',
+                    elementStyle: 'padding-left:' + (ct.labelWidth + pad) + 'px'
+                });
+            }
+            if(ct.labelAlign == 'top'){
+                Ext.apply(this, {
+                    labelStyle: 'width:auto;',
+                    labelAdjust: 0,
+                    elementStyle: 'padding-left:0;'
+                });
+            }
+        }
+    },
+
+    // private
+    isHide: function(c){
+        return c.hideLabel || this.container.hideLabels;
+    },
+
+    onFieldShow: function(c){
+        c.getItemCt().removeClass('x-hide-' + c.hideMode);
+
+        // Composite fields will need to layout after the container is made visible
+        if (c.isComposite) {
+            c.doLayout();
+        }
+    },
+
+    onFieldHide: function(c){
+        c.getItemCt().addClass('x-hide-' + c.hideMode);
+    },
+
+    //private
+    getLabelStyle: function(s){
+        var ls = '', items = [this.labelStyle, s];
+        for (var i = 0, len = items.length; i < len; ++i){
+            if (items[i]){
+                ls += items[i];
+                if (ls.substr(-1, 1) != ';'){
+                    ls += ';';
+                }
+            }
+        }
+        return ls;
+    },
+
+    /**
+     * @cfg {Ext.Template} fieldTpl
+     * A {@link Ext.Template#compile compile}d {@link Ext.Template} for rendering
+     * the fully wrapped, labeled and styled form Field. Defaults to:</p><pre><code>
+new Ext.Template(
+    &#39;&lt;div class="x-form-item {itemCls}" tabIndex="-1">&#39;,
+        &#39;&lt;&#108;abel for="{id}" style="{labelStyle}" class="x-form-item-&#108;abel">{&#108;abel}{labelSeparator}&lt;/&#108;abel>&#39;,
+        &#39;&lt;div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">&#39;,
+        &#39;&lt;/div>&lt;div class="{clearCls}">&lt;/div>&#39;,
+    '&lt;/div>'
+);
+</code></pre>
+     * <p>This may be specified to produce a different DOM structure when rendering form Fields.</p>
+     * <p>A description of the properties within the template follows:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to <tt>''</tt>)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * <p>Also see <tt>{@link #getTemplateArgs}</tt></p>
+     */
+
+    /**
+     * @private
+     *
+     */
+    renderItem : function(c, position, target){
+        if(c && (c.isFormField || c.fieldLabel) && c.inputType != 'hidden'){
+            var args = this.getTemplateArgs(c);
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position] || null;
+            }
+            if(position){
+                c.itemCt = this.fieldTpl.insertBefore(position, args, true);
+            }else{
+                c.itemCt = this.fieldTpl.append(target, args, true);
+            }
+            if(!c.getItemCt){
+                // Non form fields don't have getItemCt, apply it here
+                // This will get cleaned up in onRemove
+                Ext.apply(c, {
+                    getItemCt: function(){
+                        return c.itemCt;
+                    },
+                    customItemCt: true
+                });
+            }
+            c.label = c.getItemCt().child('label.x-form-item-label');
+            if(!c.rendered){
+                c.render('x-form-el-' + c.id);
+            }else if(!this.isValidParent(c, target)){
+                Ext.fly('x-form-el-' + c.id).appendChild(c.getPositionEl());
+            }
+            if(this.trackLabels){
+                if(c.hidden){
+                    this.onFieldHide(c);
+                }
+                c.on({
+                    scope: this,
+                    show: this.onFieldShow,
+                    hide: this.onFieldHide
+                });
+            }
+            this.configureItem(c);
+        }else {
+            Ext.layout.FormLayout.superclass.renderItem.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Provides template arguments for rendering the fully wrapped, labeled and styled form Field.</p>
+     * <p>This method returns an object hash containing properties used by the layout's {@link #fieldTpl}
+     * to create a correctly wrapped, labeled and styled form Field. This may be overriden to
+     * create custom layouts. The properties which must be returned are:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to the field's configured fieldLabel property)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * @param (Ext.form.Field} field The {@link Ext.form.Field Field} being rendered.
+     * @return {Object} An object hash containing the properties required to render the Field.
+     */
+    getTemplateArgs: function(field) {
+        var noLabelSep = !field.fieldLabel || field.hideLabel,
+            itemCls = (field.itemCls || this.container.itemCls || '') + (field.hideLabel ? ' x-hide-label' : '');
+
+        // IE9 quirks needs an extra, identifying class on wrappers of TextFields
+        if (Ext.isIE9 && Ext.isIEQuirks && field instanceof Ext.form.TextField) {
+            itemCls += ' x-input-wrapper';
+        }
+
+        return {
+            id            : field.id,
+            label         : field.fieldLabel,
+            itemCls       : itemCls,
+            clearCls      : field.clearCls || 'x-form-clear-left',
+            labelStyle    : this.getLabelStyle(field.labelStyle),
+            elementStyle  : this.elementStyle || '',
+            labelSeparator: noLabelSep ? '' : (Ext.isDefined(field.labelSeparator) ? field.labelSeparator : this.labelSeparator)
+        };
+    },
+
+    // private
+    adjustWidthAnchor: function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign != 'top')){
+            var adjust = Ext.isIE6 || (Ext.isIE && !Ext.isStrict);
+            return value - this.labelAdjust + (adjust ? -3 : 0);
+        }
+        return value;
+    },
+
+    adjustHeightAnchor : function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign == 'top')){
+            return value - c.label.getHeight();
+        }
+        return value;
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && this.container.getEl().contains(c.getPositionEl());
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['form'] = Ext.layout.FormLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/MenuLayout.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/MenuLayout.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/layout/MenuLayout.js	(revision 76)
@@ -0,0 +1,102 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.layout.MenuLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Layout manager used by {@link Ext.menu.Menu}. Generally this class should not need to be used directly.</p>
+ */
+ Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'menu',
+
+    setContainer : function(ct){
+        this.monitorResize = !ct.floating;
+        // This event is only fired by the menu in IE, used so we don't couple
+        // the menu with the layout.
+        ct.on('autosize', this.doAutoSize, this);
+        Ext.layout.MenuLayout.superclass.setContainer.call(this, ct);
+    },
+
+    renderItem : function(c, position, target){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
+                '<li id="{itemId}" class="{itemCls}">',
+                    '<tpl if="needsIcon">',
+                        '<img alt="{altText}" src="{icon}" class="{iconCls}"/>',
+                    '</tpl>',
+                '</li>'
+            );
+        }
+
+        if(c && !c.rendered){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            var a = this.getItemArgs(c);
+
+//          The Component's positionEl is the <li> it is rendered into
+            c.render(c.positionEl = position ?
+                this.itemTpl.insertBefore(position, a, true) :
+                this.itemTpl.append(target, a, true));
+
+//          Link the containing <li> to the item.
+            c.positionEl.menuItemId = c.getItemId();
+
+//          If rendering a regular Component, and it needs an icon,
+//          move the Component rightwards.
+            if (!a.isMenuItem && a.needsIcon) {
+                c.positionEl.addClass('x-menu-list-item-indent');
+            }
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            target.dom.insertBefore(c.getActionEl().dom, position || null);
+        }
+    },
+
+    getItemArgs : function(c) {
+        var isMenuItem = c instanceof Ext.menu.Item,
+            canHaveIcon = !(isMenuItem || c instanceof Ext.menu.Separator);
+
+        return {
+            isMenuItem: isMenuItem,
+            needsIcon: canHaveIcon && (c.icon || c.iconCls),
+            icon: c.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: 'x-menu-item-icon ' + (c.iconCls || ''),
+            itemId: 'x-menu-el-' + c.id,
+            itemCls: 'x-menu-list-item ',
+            altText: c.altText || ''
+        };
+    },
+
+    //  Valid if the Component is in a <li> which is part of our target <ul>
+    isValidParent : function(c, target) {
+        return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target);
+    },
+
+    onLayout : function(ct, target){
+        Ext.layout.MenuLayout.superclass.onLayout.call(this, ct, target);
+        this.doAutoSize();
+    },
+
+    doAutoSize : function(){
+        var ct = this.container, w = ct.width;
+        if(ct.floating){
+            if(w){
+                ct.setWidth(w);
+            }else if(Ext.isIE){
+                ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8 || Ext.isIE9) ? 'auto' : ct.minWidth);
+                var el = ct.getEl(), t = el.dom.offsetWidth; // force recalc
+                ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr'));
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/DataView.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/DataView.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/DataView.js	(revision 76)
@@ -0,0 +1,787 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.DataView
+ * @extends Ext.BoxComponent
+ * A mechanism for displaying data using custom layout templates and formatting. DataView uses an {@link Ext.XTemplate}
+ * as its internal templating mechanism, and is bound to an {@link Ext.data.Store}
+ * so that as the data in the store changes the view is automatically updated to reflect the changes.  The view also
+ * provides built-in behavior for many common events that can occur for its contained items including click, doubleclick,
+ * mouseover, mouseout, etc. as well as a built-in selection model. <b>In order to use these features, an {@link #itemSelector}
+ * config must be provided for the DataView to determine what nodes it will be working with.</b>
+ *
+ * <p>The example below binds a DataView to a {@link Ext.data.Store} and renders it into an {@link Ext.Panel}.</p>
+ * <pre><code>
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var tpl = new Ext.XTemplate(
+    '&lt;tpl for="."&gt;',
+        '&lt;div class="thumb-wrap" id="{name}"&gt;',
+        '&lt;div class="thumb"&gt;&lt;img src="{url}" title="{name}"&gt;&lt;/div&gt;',
+        '&lt;span class="x-editable"&gt;{shortName}&lt;/span&gt;&lt;/div&gt;',
+    '&lt;/tpl&gt;',
+    '&lt;div class="x-clear"&gt;&lt;/div&gt;'
+);
+
+var panel = new Ext.Panel({
+    id:'images-view',
+    frame:true,
+    width:535,
+    autoHeight:true,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple DataView',
+
+    items: new Ext.DataView({
+        store: store,
+        tpl: tpl,
+        autoHeight:true,
+        multiSelect: true,
+        overClass:'x-view-over',
+        itemSelector:'div.thumb-wrap',
+        emptyText: 'No images to display'
+    })
+});
+panel.render(document.body);
+</code></pre>
+ * @constructor
+ * Create a new DataView
+ * @param {Object} config The config object
+ * @xtype dataview
+ */
+Ext.DataView = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String/Array} tpl
+     * The HTML fragment or an array of fragments that will make up the template used by this DataView.  This should
+     * be specified in the same format expected by the constructor of {@link Ext.XTemplate}.
+     */
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} to bind this DataView to.
+     */
+    /**
+     * @cfg {String} itemSelector
+     * <b>This is a required setting</b>. A simple CSS selector (e.g. <tt>div.some-class</tt> or 
+     * <tt>span:first-child</tt>) that will be used to determine what nodes this DataView will be
+     * working with.
+     */
+    /**
+     * @cfg {Boolean} multiSelect
+     * True to allow selection of more than one item at a time, false to allow selection of only a single item
+     * at a time or no selection at all, depending on the value of {@link #singleSelect} (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} singleSelect
+     * True to allow selection of exactly one item at a time, false to allow no selection at all (defaults to false).
+     * Note that if {@link #multiSelect} = true, this value will be ignored.
+     */
+    /**
+     * @cfg {Boolean} simpleSelect
+     * True to enable multiselection by clicking on multiple items without requiring the user to hold Shift or Ctrl,
+     * false to force the user to hold Ctrl or Shift to select more than on item (defaults to false).
+     */
+    /**
+     * @cfg {String} overClass
+     * A CSS class to apply to each item in the view on mouseover (defaults to undefined).
+     */
+    /**
+     * @cfg {String} loadingText
+     * A string to display during data load operations (defaults to undefined).  If specified, this text will be
+     * displayed in a loading div and the view's contents will be cleared while loading, otherwise the view's
+     * contents will continue to display normally until the new data is loaded and the contents are replaced.
+     */
+    /**
+     * @cfg {String} selectedClass
+     * A CSS class to apply to each selected item in the view (defaults to 'x-view-selected').
+     */
+    selectedClass : "x-view-selected",
+    /**
+     * @cfg {String} emptyText
+     * The text to display in the view when there is no data to display (defaults to '').
+     */
+    emptyText : "",
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer emptyText being applied until the store's first load
+     */
+    deferEmptyText: true,
+    /**
+     * @cfg {Boolean} trackOver True to enable mouseenter and mouseleave events
+     */
+    trackOver: false,
+    
+    /**
+     * @cfg {Boolean} blockRefresh Set this to true to ignore datachanged events on the bound store. This is useful if
+     * you wish to provide custom transition animations via a plugin (defaults to false)
+     */
+    blockRefresh: false,
+
+    //private
+    last: false,
+
+    // private
+    initComponent : function(){
+        Ext.DataView.superclass.initComponent.call(this);
+        if(Ext.isString(this.tpl) || Ext.isArray(this.tpl)){
+            this.tpl = new Ext.XTemplate(this.tpl);
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeclick
+             * Fires before a click is processed. Returns false to cancel the default action.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "beforeclick",
+            /**
+             * @event click
+             * Fires when a template node is clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "click",
+            /**
+             * @event mouseenter
+             * Fires when the mouse enters a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseenter",
+            /**
+             * @event mouseleave
+             * Fires when the mouse leaves a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseleave",
+            /**
+             * @event containerclick
+             * Fires when a click occurs and it is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containerclick",
+            /**
+             * @event dblclick
+             * Fires when a template node is double clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "dblclick",
+            /**
+             * @event contextmenu
+             * Fires when a template node is right clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "contextmenu",
+            /**
+             * @event containercontextmenu
+             * Fires when a right click occurs that is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containercontextmenu",
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change.
+             * @param {Ext.DataView} this
+             * @param {Array} selections Array of the selected nodes
+             */
+            "selectionchange",
+
+            /**
+             * @event beforeselect
+             * Fires before a selection is made. If any handlers return false, the selection is cancelled.
+             * @param {Ext.DataView} this
+             * @param {HTMLElement} node The node to be selected
+             * @param {Array} selections Array of currently selected nodes
+             */
+            "beforeselect"
+        );
+
+        this.store = Ext.StoreMgr.lookup(this.store);
+        this.all = new Ext.CompositeElementLite();
+        this.selected = new Ext.CompositeElementLite();
+    },
+
+    // private
+    afterRender : function(){
+        Ext.DataView.superclass.afterRender.call(this);
+
+		this.mon(this.getTemplateTarget(), {
+            "click": this.onClick,
+            "dblclick": this.onDblClick,
+            "contextmenu": this.onContextMenu,
+            scope:this
+        });
+
+        if(this.overClass || this.trackOver){
+            this.mon(this.getTemplateTarget(), {
+                "mouseover": this.onMouseOver,
+                "mouseout": this.onMouseOut,
+                scope:this
+            });
+        }
+
+        if(this.store){
+            this.bindStore(this.store, true);
+        }
+    },
+
+    /**
+     * Refreshes the view by reloading the data from the store and re-rendering the template.
+     */
+    refresh : function() {
+        this.clearSelections(false, true);
+        var el = this.getTemplateTarget(),
+            records = this.store.getRange();
+            
+        el.update('');
+        if(records.length < 1){
+            if(!this.deferEmptyText || this.hasSkippedEmptyText){
+                el.update(this.emptyText);
+            }
+            this.all.clear();
+        }else{
+            this.tpl.overwrite(el, this.collectData(records, 0));
+            this.all.fill(Ext.query(this.itemSelector, el.dom));
+            this.updateIndexes(0);
+        }
+        this.hasSkippedEmptyText = true;
+    },
+
+    getTemplateTarget: function(){
+        return this.el;
+    },
+
+    /**
+     * Function which can be overridden to provide custom formatting for each Record that is used by this
+     * DataView's {@link #tpl template} to render each node.
+     * @param {Array/Object} data The raw data object that was used to create the Record.
+     * @param {Number} recordIndex the index number of the Record being prepared for rendering.
+     * @param {Record} record The Record being prepared for rendering.
+     * @return {Array/Object} The formatted data in a format expected by the internal {@link #tpl template}'s overwrite() method.
+     * (either an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}))
+     */
+    prepareData : function(data){
+        return data;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * DataView's {@link #tpl template} to render the whole DataView.</p>
+     * <p>This is usually an Array of data objects, each element of which is processed by an
+     * {@link Ext.XTemplate XTemplate} which uses <tt>'&lt;tpl for="."&gt;'</tt> to iterate over its supplied
+     * data object as an Array. However, <i>named</i> properties may be placed into the data object to
+     * provide non-repeating data such as headings, totals etc.</p>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Array} An Array of data objects to be processed by a repeating XTemplate. May also
+     * contain <i>named</i> properties.
+     */
+    collectData : function(records, startIndex){
+        var r = [],
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            r[r.length] = this.prepareData(records[i].data, startIndex + i, records[i]);
+        }
+        return r;
+    },
+
+    // private
+    bufferRender : function(records, index){
+        var div = document.createElement('div');
+        this.tpl.overwrite(div, this.collectData(records, index));
+        return Ext.query(this.itemSelector, div);
+    },
+
+    // private
+    onUpdate : function(ds, record){
+        var index = this.store.indexOf(record);
+        if(index > -1){
+            var sel = this.isSelected(index),
+                original = this.all.elements[index],
+                node = this.bufferRender([record], index)[0];
+
+            this.all.replaceElement(index, node, true);
+            if(sel){
+                this.selected.replaceElement(original, node);
+                this.all.item(index).addClass(this.selectedClass);
+            }
+            this.updateIndexes(index, index);
+        }
+    },
+
+    // private
+    onAdd : function(ds, records, index){
+        if(this.all.getCount() === 0){
+            this.refresh();
+            return;
+        }
+        var nodes = this.bufferRender(records, index), n, a = this.all.elements;
+        if(index < this.all.getCount()){
+            n = this.all.item(index).insertSibling(nodes, 'before', true);
+            a.splice.apply(a, [index, 0].concat(nodes));
+        }else{
+            n = this.all.last().insertSibling(nodes, 'after', true);
+            a.push.apply(a, nodes);
+        }
+        this.updateIndexes(index);
+    },
+
+    // private
+    onRemove : function(ds, record, index){
+        this.deselect(index);
+        this.all.removeElement(index, true);
+        this.updateIndexes(index);
+        if (this.store.getCount() === 0){
+            this.refresh();
+        }
+    },
+
+    /**
+     * Refreshes an individual node's data from the store.
+     * @param {Number} index The item's data index in the store
+     */
+    refreshNode : function(index){
+        this.onUpdate(this.store, this.store.getAt(index));
+    },
+
+    // private
+    updateIndexes : function(startIndex, endIndex){
+        var ns = this.all.elements;
+        startIndex = startIndex || 0;
+        endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));
+        for(var i = startIndex; i <= endIndex; i++){
+            ns[i].viewIndex = i;
+        }
+    },
+    
+    /**
+     * Returns the store associated with this DataView.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Changes the data store bound to this view and refreshes it.
+     * @param {Store} store The store to bind to this view
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("beforeload", this.onBeforeLoad, this);
+                this.store.un("datachanged", this.onDataChanged, this);
+                this.store.un("add", this.onAdd, this);
+                this.store.un("remove", this.onRemove, this);
+                this.store.un("update", this.onUpdate, this);
+                this.store.un("clear", this.refresh, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                datachanged: this.onDataChanged,
+                add: this.onAdd,
+                remove: this.onRemove,
+                update: this.onUpdate,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store){
+            this.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Calls this.refresh if this.blockRefresh is not true
+     */
+    onDataChanged: function() {
+        if (this.blockRefresh !== true) {
+            this.refresh.apply(this, arguments);
+        }
+    },
+
+    /**
+     * Returns the template node the passed child belongs to, or null if it doesn't belong to one.
+     * @param {HTMLElement} node
+     * @return {HTMLElement} The template node
+     */
+    findItemFromChild : function(node){
+        return Ext.fly(node).findParent(this.itemSelector, this.getTemplateTarget());
+    },
+
+    // private
+    onClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget()),
+            index;
+        if(item){
+            index = this.indexOf(item);
+            if(this.onItemClick(item, index, e) !== false){
+                this.fireEvent("click", this, index, item, e);
+            }
+        }else{
+            if(this.fireEvent("containerclick", this, e) !== false){
+                this.onContainerClick(e);
+            }
+        }
+    },
+
+    onContainerClick : function(e){
+        this.clearSelections();
+    },
+
+    // private
+    onContextMenu : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("contextmenu", this, this.indexOf(item), item, e);
+        }else{
+            this.fireEvent("containercontextmenu", this, e);
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("dblclick", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOver : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item && item !== this.lastItem){
+            this.lastItem = item;
+            Ext.fly(item).addClass(this.overClass);
+            this.fireEvent("mouseenter", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        if(this.lastItem){
+            if(!e.within(this.lastItem, true, true)){
+                Ext.fly(this.lastItem).removeClass(this.overClass);
+                this.fireEvent("mouseleave", this, this.indexOf(this.lastItem), this.lastItem, e);
+                delete this.lastItem;
+            }
+        }
+    },
+
+    // private
+    onItemClick : function(item, index, e){
+        if(this.fireEvent("beforeclick", this, index, item, e) === false){
+            return false;
+        }
+        if(this.multiSelect){
+            this.doMultiSelection(item, index, e);
+            e.preventDefault();
+        }else if(this.singleSelect){
+            this.doSingleSelection(item, index, e);
+            e.preventDefault();
+        }
+        return true;
+    },
+
+    // private
+    doSingleSelection : function(item, index, e){
+        if(e.ctrlKey && this.isSelected(index)){
+            this.deselect(index);
+        }else{
+            this.select(index, false);
+        }
+    },
+
+    // private
+    doMultiSelection : function(item, index, e){
+        if(e.shiftKey && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, index, e.ctrlKey);
+            this.last = last; // reset the last
+        }else{
+            if((e.ctrlKey||this.simpleSelect) && this.isSelected(index)){
+                this.deselect(index);
+            }else{
+                this.select(index, e.ctrlKey || e.shiftKey || this.simpleSelect);
+            }
+        }
+    },
+
+    /**
+     * Gets the number of selected nodes.
+     * @return {Number} The node count
+     */
+    getSelectionCount : function(){
+        return this.selected.getCount();
+    },
+
+    /**
+     * Gets the currently selected nodes.
+     * @return {Array} An array of HTMLElements
+     */
+    getSelectedNodes : function(){
+        return this.selected.elements;
+    },
+
+    /**
+     * Gets the indexes of the selected nodes.
+     * @return {Array} An array of numeric indexes
+     */
+    getSelectedIndexes : function(){
+        var indexes = [], 
+            selected = this.selected.elements,
+            i = 0,
+            len = selected.length;
+            
+        for(; i < len; i++){
+            indexes.push(selected[i].viewIndex);
+        }
+        return indexes;
+    },
+
+    /**
+     * Gets an array of the selected records
+     * @return {Array} An array of {@link Ext.data.Record} objects
+     */
+    getSelectedRecords : function(){
+        return this.getRecords(this.selected.elements);
+    },
+
+    /**
+     * Gets an array of the records from an array of nodes
+     * @param {Array} nodes The nodes to evaluate
+     * @return {Array} records The {@link Ext.data.Record} objects
+     */
+    getRecords : function(nodes){
+        var records = [], 
+            i = 0,
+            len = nodes.length;
+            
+        for(; i < len; i++){
+            records[records.length] = this.store.getAt(nodes[i].viewIndex);
+        }
+        return records;
+    },
+
+    /**
+     * Gets a record from a node
+     * @param {HTMLElement} node The node to evaluate
+     * @return {Record} record The {@link Ext.data.Record} object
+     */
+    getRecord : function(node){
+        return this.store.getAt(node.viewIndex);
+    },
+
+    /**
+     * Clears all selections.
+     * @param {Boolean} suppressEvent (optional) True to skip firing of the selectionchange event
+     */
+    clearSelections : function(suppressEvent, skipUpdate){
+        if((this.multiSelect || this.singleSelect) && this.selected.getCount() > 0){
+            if(!skipUpdate){
+                this.selected.removeClass(this.selectedClass);
+            }
+            this.selected.clear();
+            this.last = false;
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        }
+    },
+
+    /**
+     * Returns true if the passed node is selected, else false.
+     * @param {HTMLElement/Number/Ext.data.Record} node The node, node index or record to check
+     * @return {Boolean} True if selected, else false
+     */
+    isSelected : function(node){
+        return this.selected.contains(this.getNode(node));
+    },
+
+    /**
+     * Deselects a node.
+     * @param {HTMLElement/Number/Record} node The node, node index or record to deselect
+     */
+    deselect : function(node){
+        if(this.isSelected(node)){
+            node = this.getNode(node);
+            this.selected.removeElement(node);
+            if(this.last == node.viewIndex){
+                this.last = false;
+            }
+            Ext.fly(node).removeClass(this.selectedClass);
+            this.fireEvent("selectionchange", this, this.selected.elements);
+        }
+    },
+
+    /**
+     * Selects a set of nodes.
+     * @param {Array/HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node,
+     * id of a template node, record associated with a node or an array of any of those to select
+     * @param {Boolean} keepExisting (optional) true to keep existing selections
+     * @param {Boolean} suppressEvent (optional) true to skip firing of the selectionchange vent
+     */
+    select : function(nodeInfo, keepExisting, suppressEvent){
+        if(Ext.isArray(nodeInfo)){
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            for(var i = 0, len = nodeInfo.length; i < len; i++){
+                this.select(nodeInfo[i], true, true);
+            }
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        } else{
+            var node = this.getNode(nodeInfo);
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            if(node && !this.isSelected(node)){
+                if(this.fireEvent("beforeselect", this, node, this.selected.elements) !== false){
+                    Ext.fly(node).addClass(this.selectedClass);
+                    this.selected.add(node);
+                    this.last = node.viewIndex;
+                    if(!suppressEvent){
+                        this.fireEvent("selectionchange", this, this.selected.elements);
+                    }
+                }
+            }
+        }
+    },
+
+    /**
+     * Selects a range of nodes. All nodes between start and end are selected.
+     * @param {Number} start The index of the first node in the range
+     * @param {Number} end The index of the last node in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(start, end, keepExisting){
+        if(!keepExisting){
+            this.clearSelections(true);
+        }
+        this.select(this.getNodes(start, end), true);
+    },
+
+    /**
+     * Gets a template node.
+     * @param {HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node, 
+     * the id of a template node or the record associated with the node.
+     * @return {HTMLElement} The node or null if it wasn't found
+     */
+    getNode : function(nodeInfo){
+        if(Ext.isString(nodeInfo)){
+            return document.getElementById(nodeInfo);
+        }else if(Ext.isNumber(nodeInfo)){
+            return this.all.elements[nodeInfo];
+        }else if(nodeInfo instanceof Ext.data.Record){
+            var idx = this.store.indexOf(nodeInfo);
+            return this.all.elements[idx];
+        }
+        return nodeInfo;
+    },
+
+    /**
+     * Gets a range nodes.
+     * @param {Number} start (optional) The index of the first node in the range
+     * @param {Number} end (optional) The index of the last node in the range
+     * @return {Array} An array of nodes
+     */
+    getNodes : function(start, end){
+        var ns = this.all.elements,
+            nodes = [],
+            i;
+            
+        start = start || 0;
+        end = !Ext.isDefined(end) ? Math.max(ns.length - 1, 0) : end;
+        if(start <= end){
+            for(i = start; i <= end && ns[i]; i++){
+                nodes.push(ns[i]);
+            }
+        } else{
+            for(i = start; i >= end && ns[i]; i--){
+                nodes.push(ns[i]);
+            }
+        }
+        return nodes;
+    },
+
+    /**
+     * Finds the index of the passed node.
+     * @param {HTMLElement/String/Number/Record} nodeInfo An HTMLElement template node, index of a template node, the id of a template node
+     * or a record associated with a node.
+     * @return {Number} The index of the node or -1
+     */
+    indexOf : function(node){
+        node = this.getNode(node);
+        if(Ext.isNumber(node.viewIndex)){
+            return node.viewIndex;
+        }
+        return this.all.indexOf(node);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(this.loadingText){
+            this.clearSelections(false, true);
+            this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+'</div>');
+            this.all.clear();
+        }
+    },
+
+    onDestroy : function(){
+        this.all.clear();
+        this.selected.clear();
+        Ext.DataView.superclass.onDestroy.call(this);
+        this.bindStore(null);
+    }
+});
+
+/**
+ * Changes the data store bound to this view and refreshes it. (deprecated in favor of bindStore)
+ * @param {Store} store The store to bind to this view
+ */
+Ext.DataView.prototype.setStore = Ext.DataView.prototype.bindStore;
+
+Ext.reg('dataview', Ext.DataView);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/ComponentMgr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/ComponentMgr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/ComponentMgr.js	(revision 76)
@@ -0,0 +1,196 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ComponentMgr
+ * <p>Provides a registry of all Components (instances of {@link Ext.Component} or any subclass
+ * thereof) on a page so that they can be easily accessed by {@link Ext.Component component}
+ * {@link Ext.Component#id id} (see {@link #get}, or the convenience method {@link Ext#getCmp Ext.getCmp}).</p>
+ * <p>This object also provides a registry of available Component <i>classes</i>
+ * indexed by a mnemonic code known as the Component's {@link Ext.Component#xtype xtype}.
+ * The <code>{@link Ext.Component#xtype xtype}</code> provides a way to avoid instantiating child Components
+ * when creating a full, nested config object for a complete Ext page.</p>
+ * <p>A child Component may be specified simply as a <i>config object</i>
+ * as long as the correct <code>{@link Ext.Component#xtype xtype}</code> is specified so that if and when the Component
+ * needs rendering, the correct type can be looked up for lazy instantiation.</p>
+ * <p>For a list of all available <code>{@link Ext.Component#xtype xtypes}</code>, see {@link Ext.Component}.</p>
+ * @singleton
+ */
+Ext.ComponentMgr = function(){
+    var all = new Ext.util.MixedCollection();
+    var types = {};
+    var ptypes = {};
+
+    return {
+        /**
+         * Registers a component.
+         * @param {Ext.Component} c The component
+         */
+        register : function(c){
+            all.add(c);
+        },
+
+        /**
+         * Unregisters a component.
+         * @param {Ext.Component} c The component
+         */
+        unregister : function(c){
+            all.remove(c);
+        },
+
+        /**
+         * Returns a component by {@link Ext.Component#id id}.
+         * For additional details see {@link Ext.util.MixedCollection#get}.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+         * Class was found.
+         */
+        get : function(id){
+            return all.get(id);
+        },
+
+        /**
+         * Registers a function that will be called when a Component with the specified id is added to ComponentMgr. This will happen on instantiation.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @param {Function} fn The callback function
+         * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+         */
+        onAvailable : function(id, fn, scope){
+            all.on("add", function(index, o){
+                if(o.id == id){
+                    fn.call(scope || o, o);
+                    all.un("add", fn, scope);
+                }
+            });
+        },
+
+        /**
+         * The MixedCollection used internally for the component cache. An example usage may be subscribing to
+         * events on the MixedCollection to monitor addition or removal.  Read-only.
+         * @type {MixedCollection}
+         */
+        all : all,
+        
+        /**
+         * The xtypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        types : types,
+        
+        /**
+         * The ptypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        ptypes: ptypes,
+        
+        /**
+         * Checks if a Component type is registered.
+         * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isRegistered : function(xtype){
+            return types[xtype] !== undefined;    
+        },
+        
+        /**
+         * Checks if a Plugin type is registered.
+         * @param {Ext.Component} ptype The mnemonic string by which the Plugin class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isPluginRegistered : function(ptype){
+            return ptypes[ptype] !== undefined;    
+        },        
+
+        /**
+         * <p>Registers a new Component constructor, keyed by a new
+         * {@link Ext.Component#xtype}.</p>
+         * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+         * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+         * child Components.
+         * see {@link Ext.Container#items}</p>
+         * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+         * @param {Constructor} cls The new Component class.
+         */
+        registerType : function(xtype, cls){
+            types[xtype] = cls;
+            cls.xtype = xtype;
+        },
+
+        /**
+         * Creates a new Component from the specified config object using the
+         * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Component you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Component type if
+         * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+         * @return {Ext.Component} The newly instantiated Component.
+         */
+        create : function(config, defaultType){
+            return config.render ? config : new types[config.xtype || defaultType](config);
+        },
+
+        /**
+         * <p>Registers a new Plugin constructor, keyed by a new
+         * {@link Ext.Component#ptype}.</p>
+         * <p>Use this method (or its alias {@link Ext#preg Ext.preg}) to register new
+         * plugins for {@link Ext.Component}s so that lazy instantiation may be used when specifying
+         * Plugins.</p>
+         * @param {String} ptype The mnemonic string by which the Plugin class may be looked up.
+         * @param {Constructor} cls The new Plugin class.
+         */
+        registerPlugin : function(ptype, cls){
+            ptypes[ptype] = cls;
+            cls.ptype = ptype;
+        },
+
+        /**
+         * Creates a new Plugin from the specified config object using the
+         * config object's {@link Ext.component#ptype ptype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Plugin you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Plugin type if
+         * the config object does not contain a <code>ptype</code>. (Optional if the config contains a <code>ptype</code>).
+         * @return {Ext.Component} The newly instantiated Plugin.
+         */
+        createPlugin : function(config, defaultType){
+            var PluginCls = ptypes[config.ptype || defaultType];
+            if (PluginCls.init) {
+                return PluginCls;                
+            } else {
+                return new PluginCls(config);
+            }            
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerType}
+ * @param {String} xtype The {@link Ext.component#xtype mnemonic string} by which the Component class
+ * may be looked up.
+ * @param {Constructor} cls The new Component class.
+ * @member Ext
+ * @method reg
+ */
+Ext.reg = Ext.ComponentMgr.registerType; // this will be called a lot internally, shorthand to keep the bytes down
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerPlugin}
+ * @param {String} ptype The {@link Ext.component#ptype mnemonic string} by which the Plugin class
+ * may be looked up.
+ * @param {Constructor} cls The new Plugin class.
+ * @member Ext
+ * @method preg
+ */
+Ext.preg = Ext.ComponentMgr.registerPlugin;
+/**
+ * Shorthand for {@link Ext.ComponentMgr#create}
+ * Creates a new Component from the specified config object using the
+ * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+ * @param {Object} config A configuration object for the Component you wish to create.
+ * @param {Constructor} defaultType The constructor to provide the default Component type if
+ * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+ * @return {Ext.Component} The newly instantiated Component.
+ * @member Ext
+ * @method create
+ */
+Ext.create = Ext.ComponentMgr.create;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnDD.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnDD.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnDD.js	(revision 76)
@@ -0,0 +1,206 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDragZone = Ext.extend(Ext.dd.DragZone, {
+    maxDragWidth: 120,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
+        if(hd2){
+            this.setHandleElId(Ext.id(hd));
+            this.setOuterHandleElId(Ext.id(hd2));
+        }
+        this.scroll = false;
+    },
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            h = this.view.findHeaderCell(t);
+        if(h){
+            return {ddel: h.firstChild, header:h};
+        }
+        return false;
+    },
+
+    onInitDrag : function(e){
+        // keep the value here so we can restore it;
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var clone = this.dragData.ddel.cloneNode(true);
+        clone.id = Ext.id();
+        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
+        this.proxy.update(clone);
+        return true;
+    },
+
+    afterValidDrop : function(){
+        this.completeDrop();
+    },
+
+    afterInvalidDrop : function(){
+        this.completeDrop();
+    },
+    
+    completeDrop: function(){
+        var v = this.view,
+            disabled = this.dragHeadersDisabled;
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    }
+});
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDropZone = Ext.extend(Ext.dd.DropZone, {
+    proxyOffsets : [-4, -9],
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        // split the proxies so they don't interfere with mouse events
+        this.proxyTop = Ext.DomHelper.append(document.body, {
+            cls:"col-move-top", html:"&#160;"
+        }, true);
+        this.proxyBottom = Ext.DomHelper.append(document.body, {
+            cls:"col-move-bottom", html:"&#160;"
+        }, true);
+        this.proxyTop.hide = this.proxyBottom.hide = function(){
+            this.setLeftTop(-100,-100);
+            this.setStyle("visibility", "hidden");
+        };
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        // temporarily disabled
+        //Ext.dd.ScrollManager.register(this.view.scroller.dom);
+        Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
+    },
+
+    getTargetFromEvent : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            cindex = this.view.findCellIndex(t);
+        if(cindex !== false){
+            return this.view.getHeaderCell(cindex);
+        }
+    },
+
+    nextVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.nextSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.nextSibling;
+        }
+        return null;
+    },
+
+    prevVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.prevSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.prevSibling;
+        }
+        return null;
+    },
+
+    positionIndicator : function(h, n, e){
+        var x = Ext.lib.Event.getPageX(e),
+            r = Ext.lib.Dom.getRegion(n.firstChild),
+            px, 
+            pt, 
+            py = r.top + this.proxyOffsets[1];
+        if((r.right - x) <= (r.right-r.left)/2){
+            px = r.right+this.view.borderWidth;
+            pt = "after";
+        }else{
+            px = r.left;
+            pt = "before";
+        }
+
+        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){
+            return false;
+        }
+
+        px +=  this.proxyOffsets[0];
+        this.proxyTop.setLeftTop(px, py);
+        this.proxyTop.show();
+        if(!this.bottomOffset){
+            this.bottomOffset = this.view.mainHd.getHeight();
+        }
+        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
+        this.proxyBottom.show();
+        return pt;
+    },
+
+    onNodeEnter : function(n, dd, e, data){
+        if(data.header != n){
+            this.positionIndicator(data.header, n, e);
+        }
+    },
+
+    onNodeOver : function(n, dd, e, data){
+        var result = false;
+        if(data.header != n){
+            result = this.positionIndicator(data.header, n, e);
+        }
+        if(!result){
+            this.proxyTop.hide();
+            this.proxyBottom.hide();
+        }
+        return result ? this.dropAllowed : this.dropNotAllowed;
+    },
+
+    onNodeOut : function(n, dd, e, data){
+        this.proxyTop.hide();
+        this.proxyBottom.hide();
+    },
+
+    onNodeDrop : function(n, dd, e, data){
+        var h = data.header;
+        if(h != n){
+            var cm = this.grid.colModel,
+                x = Ext.lib.Event.getPageX(e),
+                r = Ext.lib.Dom.getRegion(n.firstChild),
+                pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before",
+                oldIndex = this.view.getCellIndex(h),
+                newIndex = this.view.getCellIndex(n);
+            if(pt == "after"){
+                newIndex++;
+            }
+            if(oldIndex < newIndex){
+                newIndex--;
+            }
+            cm.moveColumn(oldIndex, newIndex);
+            return true;
+        }
+        return false;
+    }
+});
+
+Ext.grid.GridView.ColumnDragZone = Ext.extend(Ext.grid.HeaderDragZone, {
+    
+    constructor : function(grid, hd){
+        Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
+        this.proxy.el.addClass('x-grid3-col-dd');
+    },
+    
+    handleMouseDown : function(e){
+    },
+
+    callHandleMouseDown : function(e){
+        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridPanel.js	(revision 76)
@@ -0,0 +1,1121 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GridPanel
+ * @extends Ext.Panel
+ * <p>This class represents the primary interface of a component based grid control to represent data
+ * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior
+ * <div class="sub-desc"></div></li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    {@link #store}: new {@link Ext.data.Store}({
+        {@link Ext.data.Store#autoDestroy autoDestroy}: true,
+        {@link Ext.data.Store#reader reader}: reader,
+        {@link Ext.data.Store#data data}: xg.dummyData
+    }),
+    {@link #colModel}: new {@link Ext.grid.ColumnModel}({
+        {@link Ext.grid.ColumnModel#defaults defaults}: {
+            width: 120,
+            sortable: true
+        },
+        {@link Ext.grid.ColumnModel#columns columns}: [
+            {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
+            {header: 'Change', dataIndex: 'change'},
+            {header: '% Change', dataIndex: 'pctChange'},
+            // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype
+            {
+                header: 'Last Updated', width: 135, dataIndex: 'lastChange',
+                xtype: 'datecolumn', format: 'M d, Y'
+            }
+        ]
+    }),
+    {@link #viewConfig}: {
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+
+//      Return CSS class to apply to rows depending upon data values
+        {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {
+            var c = record.{@link Ext.data.Record#get get}('change');
+            if (c < 0) {
+                return 'price-fall';
+            } else if (c > 0) {
+                return 'price-rise';
+            }
+        }
+    },
+    {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),
+    width: 600,
+    height: 300,
+    frame: true,
+    title: 'Framed with Row Selection and Horizontal Scrolling',
+    iconCls: 'icon-grid'
+});
+ * </code></pre>
+ * <p><b><u>Notes:</u></b></p>
+ * <div class="mdetail-params"><ul>
+ * <li>Although this class inherits many configuration options from base classes, some of them
+ * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will
+ * have no effect.</li>
+ * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to
+ * scroll its rows. These dimensions can either be set explicitly through the
+ * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>
+ * configuration options or implicitly set by using the grid as a child item of a
+ * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}
+ * provide the sizing of its child items (for example the Container of the Grid may specify
+ * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>
+ * <li>To access the data in a Grid, it is necessary to use the data model encapsulated
+ * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype grid
+ */
+Ext.grid.GridPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} autoExpandColumn
+     * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in
+     * this grid that should expand to fill unused space. This value specified here can not
+     * be <tt>0</tt>.</p>
+     * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with
+     * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>
+     * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>
+     * for additional details.</p>
+     * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>
+     */
+    autoExpandColumn : false,
+    
+    /**
+     * @cfg {Number} autoExpandMax The maximum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>1000</tt>.
+     */
+    autoExpandMax : 1000,
+    
+    /**
+     * @cfg {Number} autoExpandMin The minimum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>50</tt>.
+     */
+    autoExpandMin : 50,
+    
+    /**
+     * @cfg {Boolean} columnLines <tt>true</tt> to add css for column separation lines.
+     * Default is <tt>false</tt>.
+     */
+    columnLines : false,
+    
+    /**
+     * @cfg {Object} cm Shorthand for <tt>{@link #colModel}</tt>.
+     */
+    /**
+     * @cfg {Object} colModel The {@link Ext.grid.ColumnModel} to use when rendering the grid (required).
+     */
+    /**
+     * @cfg {Array} columns An array of {@link Ext.grid.Column columns} to auto create a
+     * {@link Ext.grid.ColumnModel}.  The ColumnModel may be explicitly created via the
+     * <tt>{@link #colModel}</tt> configuration property.
+     */
+    /**
+     * @cfg {String} ddGroup The DD group this GridPanel belongs to. Defaults to <tt>'GridDD'</tt> if not specified.
+     */
+    /**
+     * @cfg {String} ddText
+     * Configures the text in the drag proxy.  Defaults to:
+     * <pre><code>
+     * ddText : '{0} selected row{1}'
+     * </code></pre>
+     * <tt>{0}</tt> is replaced with the number of selected rows.
+     */
+    ddText : '{0} selected row{1}',
+    
+    /**
+     * @cfg {Boolean} deferRowRender <P>Defaults to <tt>true</tt> to enable deferred row rendering.</p>
+     * <p>This allows the GridPanel to be initially rendered empty, with the expensive update of the row
+     * structure deferred so that layouts with GridPanels appear more quickly.</p>
+     */
+    deferRowRender : true,
+    
+    /**
+     * @cfg {Boolean} disableSelection <p><tt>true</tt> to disable selections in the grid. Defaults to <tt>false</tt>.</p>
+     * <p>Ignored if a {@link #selModel SelectionModel} is specified.</p>
+     */
+    /**
+     * @cfg {Boolean} enableColumnResize <tt>false</tt> to turn off column resizing for the whole grid. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} enableColumnHide
+     * Defaults to <tt>true</tt> to enable {@link Ext.grid.Column#hidden hiding of columns}
+     * with the {@link #enableHdMenu header menu}.
+     */
+    enableColumnHide : true,
+    
+    /**
+     * @cfg {Boolean} enableColumnMove Defaults to <tt>true</tt> to enable drag and drop reorder of columns. <tt>false</tt>
+     * to turn off column reordering via drag drop.
+     */
+    enableColumnMove : true,
+    
+    /**
+     * @cfg {Boolean} enableDragDrop <p>Enables dragging of the selected rows of the GridPanel. Defaults to <tt>false</tt>.</p>
+     * <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's {@link #getView GridView} to
+     * create an instance of {@link Ext.grid.GridDragZone}. <b>Note</b>: this is available only <b>after</b>
+     * the Grid has been rendered as the GridView's <tt>{@link Ext.grid.GridView#dragZone dragZone}</tt>
+     * property.</p>
+     * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's implementations of
+     * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} are able
+     * to process the {@link Ext.grid.GridDragZone#getDragData data} which is provided.</p>
+     */
+    enableDragDrop : false,
+    
+    /**
+     * @cfg {Boolean} enableHdMenu Defaults to <tt>true</tt> to enable the drop down button for menu in the headers.
+     */
+    enableHdMenu : true,
+    
+    /**
+     * @cfg {Boolean} hideHeaders True to hide the grid's header. Defaults to <code>false</code>.
+     */
+    /**
+     * @cfg {Object} loadMask An {@link Ext.LoadMask} config or true to mask the grid while
+     * loading. Defaults to <code>false</code>.
+     */
+    loadMask : false,
+    
+    /**
+     * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if <tt>autoHeight</tt> is not on.
+     */
+    /**
+     * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Defaults to <tt>25</tt>.
+     */
+    minColumnWidth : 25,
+    
+    /**
+     * @cfg {Object} sm Shorthand for <tt>{@link #selModel}</tt>.
+     */
+    /**
+     * @cfg {Object} selModel Any subclass of {@link Ext.grid.AbstractSelectionModel} that will provide
+     * the selection model for the grid (defaults to {@link Ext.grid.RowSelectionModel} if not specified).
+     */
+    /**
+     * @cfg {Ext.data.Store} store The {@link Ext.data.Store} the grid should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.
+     * <p>This causes the CSS class <tt><b>x-grid3-row-alt</b></tt> to be added to alternate rows of
+     * the grid. A default CSS rule is provided which sets a background colour, but you can override this
+     * with a rule which either overrides the <b>background-color</b> style using the '!important'
+     * modifier, or which uses a CSS selector of higher specificity.</p>
+     */
+    stripeRows : false,
+    
+    /**
+     * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is <tt>true</tt>
+     * for GridPanel, but <tt>false</tt> for EditorGridPanel.
+     */
+    trackMouseOver : true,
+    
+    /**
+     * @cfg {Array} stateEvents
+     * An array of events that, when fired, should trigger this component to save its state.
+     * Defaults to:<pre><code>
+     * stateEvents: ['columnmove', 'columnresize', 'sortchange', 'groupchange']
+     * </code></pre>
+     * <p>These can be any types of events supported by this component, including browser or
+     * custom events (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See {@link Ext.Component#stateful} for an explanation of saving and restoring
+     * Component state.</p>
+     */
+    stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],
+    
+    /**
+     * @cfg {Object} view The {@link Ext.grid.GridView} used by the grid. This can be set
+     * before a call to {@link Ext.Component#render render()}.
+     */
+    view : null,
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+    /**
+     * @cfg {Object} viewConfig A config object that will be applied to the grid's UI view.  Any of
+     * the config options available for {@link Ext.grid.GridView} can be specified here. This option
+     * is ignored if <tt>{@link #view}</tt> is specified.
+     */
+
+    // private
+    rendered : false,
+    
+    // private
+    viewReady : false,
+
+    // private
+    initComponent : function() {
+        Ext.grid.GridPanel.superclass.initComponent.call(this);
+
+        if (this.columnLines) {
+            this.cls = (this.cls || '') + ' x-grid-with-col-lines';
+        }
+        // override any provided value since it isn't valid
+        // and is causing too many bug reports ;)
+        this.autoScroll = false;
+        this.autoWidth = false;
+
+        if(Ext.isArray(this.columns)){
+            this.colModel = new Ext.grid.ColumnModel(this.columns);
+            delete this.columns;
+        }
+
+        // check and correct shorthanded configs
+        if(this.ds){
+            this.store = this.ds;
+            delete this.ds;
+        }
+        if(this.cm){
+            this.colModel = this.cm;
+            delete this.cm;
+        }
+        if(this.sm){
+            this.selModel = this.sm;
+            delete this.sm;
+        }
+        this.store = Ext.StoreMgr.lookup(this.store);
+
+        this.addEvents(
+            // raw events
+            /**
+             * @event click
+             * The raw click event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event dblclick
+             * The raw dblclick event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event contextmenu
+             * The raw contextmenu event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event mousedown
+             * The raw mousedown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mousedown',
+            /**
+             * @event mouseup
+             * The raw mouseup event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseup',
+            /**
+             * @event mouseover
+             * The raw mouseover event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * The raw mouseout event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseout',
+            /**
+             * @event keypress
+             * The raw keypress event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keypress',
+            /**
+             * @event keydown
+             * The raw keydown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+
+            // custom events
+            /**
+             * @event cellmousedown
+             * Fires before a cell is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellmousedown',
+            /**
+             * @event rowmousedown
+             * Fires before a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowmousedown',
+            /**
+             * @event headermousedown
+             * Fires before a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headermousedown',
+
+            /**
+             * @event groupmousedown
+             * Fires before a group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupmousedown',
+
+            /**
+             * @event rowbodymousedown
+             * Fires before the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodymousedown',
+
+            /**
+             * @event containermousedown
+             * Fires before the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containermousedown',
+
+            /**
+             * @event cellclick
+             * Fires when a cell is clicked.
+             * The data for the cell is drawn from the {@link Ext.data.Record Record}
+             * for this row. To access the data in the listener function use the
+             * following technique:
+             * <pre><code>
+function(grid, rowIndex, columnIndex, e) {
+    var record = grid.getStore().getAt(rowIndex);  // Get the Record
+    var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name
+    var data = record.get(fieldName);
+}
+</code></pre>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellclick',
+            /**
+             * @event celldblclick
+             * Fires when a cell is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'celldblclick',
+            /**
+             * @event rowclick
+             * Fires when a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowclick',
+            /**
+             * @event rowdblclick
+             * Fires when a row is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowdblclick',
+            /**
+             * @event headerclick
+             * Fires when a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerclick',
+            /**
+             * @event headerdblclick
+             * Fires when a header cell is double clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerdblclick',
+            /**
+             * @event groupclick
+             * Fires when group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupclick',
+            /**
+             * @event groupdblclick
+             * Fires when group header is double clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupdblclick',
+            /**
+             * @event containerclick
+             * Fires when the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerclick',
+            /**
+             * @event containerdblclick
+             * Fires when the container is double clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerdblclick',
+
+            /**
+             * @event rowbodyclick
+             * Fires when the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodyclick',
+            /**
+             * @event rowbodydblclick
+             * Fires when the row body is double clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodydblclick',
+
+            /**
+             * @event rowcontextmenu
+             * Fires when a row is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowcontextmenu',
+            /**
+             * @event cellcontextmenu
+             * Fires when a cell is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} cellIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellcontextmenu',
+            /**
+             * @event headercontextmenu
+             * Fires when a header is right clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headercontextmenu',
+            /**
+             * @event groupcontextmenu
+             * Fires when group header is right clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupcontextmenu',
+            /**
+             * @event containercontextmenu
+             * Fires when the container is right clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containercontextmenu',
+            /**
+             * @event rowbodycontextmenu
+             * Fires when the row body is right clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodycontextmenu',
+            /**
+             * @event bodyscroll
+             * Fires when the body element is scrolled
+             * @param {Number} scrollLeft
+             * @param {Number} scrollTop
+             */
+            'bodyscroll',
+            /**
+             * @event columnresize
+             * Fires when the user resizes a column
+             * @param {Number} columnIndex
+             * @param {Number} newSize
+             */
+            'columnresize',
+            /**
+             * @event columnmove
+             * Fires when the user moves a column
+             * @param {Number} oldIndex
+             * @param {Number} newIndex
+             */
+            'columnmove',
+            /**
+             * @event sortchange
+             * Fires when the grid's store sort changes
+             * @param {Grid} this
+             * @param {Object} sortInfo An object with the keys field and direction
+             */
+            'sortchange',
+            /**
+             * @event groupchange
+             * Fires when the grid's grouping changes (only applies for grids with a {@link Ext.grid.GroupingView GroupingView})
+             * @param {Grid} this
+             * @param {String} groupField A string with the grouping field, null if the store is not grouped.
+             */
+            'groupchange',
+            /**
+             * @event reconfigure
+             * Fires when the grid is reconfigured with a new store and/or column model.
+             * @param {Grid} this
+             * @param {Ext.data.Store} store The new store
+             * @param {Ext.grid.ColumnModel} colModel The new column model
+             */
+            'reconfigure',
+            /**
+             * @event viewready
+             * Fires when the grid view is available (use this for selecting a default row).
+             * @param {Grid} this
+             */
+            'viewready'
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);
+
+        var c = this.getGridEl();
+
+        this.el.addClass('x-grid-panel');
+
+        this.mon(c, {
+            scope: this,
+            mousedown: this.onMouseDown,
+            click: this.onClick,
+            dblclick: this.onDblClick,
+            contextmenu: this.onContextMenu
+        });
+
+        this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);
+
+        var view = this.getView();
+        view.init(this);
+        view.render();
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.GridPanel.superclass.initEvents.call(this);
+
+        if(this.loadMask){
+            this.loadMask = new Ext.LoadMask(this.bwrap,
+                    Ext.apply({store:this.store}, this.loadMask));
+        }
+    },
+
+    initStateEvents : function(){
+        Ext.grid.GridPanel.superclass.initStateEvents.call(this);
+        this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});
+    },
+
+    applyState : function(state){
+        var cm = this.colModel,
+            cs = state.columns,
+            store = this.store,
+            s,
+            c,
+            colIndex;
+
+        if(cs){
+            for(var i = 0, len = cs.length; i < len; i++){
+                s = cs[i];
+                c = cm.getColumnById(s.id);
+                if(c){
+                    colIndex = cm.getIndexById(s.id);
+                    cm.setState(colIndex, {
+                        hidden: s.hidden,
+                        width: s.width,
+                        sortable: s.sortable
+                    });
+                    if(colIndex != i){
+                        cm.moveColumn(colIndex, i);
+                    }
+                }
+            }
+        }
+        if(store){
+            s = state.sort;
+            if(s){
+                store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);
+            }
+            s = state.group;
+            if(store.groupBy){
+                if(s){
+                    store.groupBy(s);
+                }else{
+                    store.clearGrouping();
+                }
+            }
+
+        }
+        var o = Ext.apply({}, state);
+        delete o.columns;
+        delete o.sort;
+        Ext.grid.GridPanel.superclass.applyState.call(this, o);
+    },
+
+    getState : function(){
+        var o = {columns: []},
+            store = this.store,
+            ss,
+            gs;
+
+        for(var i = 0, c; (c = this.colModel.config[i]); i++){
+            o.columns[i] = {
+                id: c.id,
+                width: c.width
+            };
+            if(c.hidden){
+                o.columns[i].hidden = true;
+            }
+            if(c.sortable){
+                o.columns[i].sortable = true;
+            }
+        }
+        if(store){
+            ss = store.getSortState();
+            if(ss){
+                o.sort = ss;
+            }
+            if(store.getGroupState){
+                gs = store.getGroupState();
+                if(gs){
+                    o.group = gs;
+                }
+            }
+        }
+        return o;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.grid.GridPanel.superclass.afterRender.call(this);
+        var v = this.view;
+        this.on('bodyresize', v.layout, v);
+        v.layout(true);
+        if(this.deferRowRender){
+            if (!this.deferRowRenderTask){
+                this.deferRowRenderTask = new Ext.util.DelayedTask(v.afterRender, this.view);
+            }
+            this.deferRowRenderTask.delay(10);
+        }else{
+            v.afterRender();
+        }
+        this.viewReady = true;
+    },
+
+    /**
+     * <p>Reconfigures the grid to use a different Store and Column Model
+     * and fires the 'reconfigure' event. The View will be bound to the new
+     * objects and refreshed.</p>
+     * <p>Be aware that upon reconfiguring a GridPanel, certain existing settings <i>may</i> become
+     * invalidated. For example the configured {@link #autoExpandColumn} may no longer exist in the
+     * new ColumnModel. Also, an existing {@link Ext.PagingToolbar PagingToolbar} will still be bound
+     * to the old Store, and will need rebinding. Any {@link #plugins} might also need reconfiguring
+     * with the new data.</p>
+     * @param {Ext.data.Store} store The new {@link Ext.data.Store} object
+     * @param {Ext.grid.ColumnModel} colModel The new {@link Ext.grid.ColumnModel} object
+     */
+    reconfigure : function(store, colModel){
+        var rendered = this.rendered;
+        if(rendered){
+            if(this.loadMask){
+                this.loadMask.destroy();
+                this.loadMask = new Ext.LoadMask(this.bwrap,
+                        Ext.apply({}, {store:store}, this.initialConfig.loadMask));
+            }
+        }
+        if(this.view){
+            this.view.initData(store, colModel);
+        }
+        this.store = store;
+        this.colModel = colModel;
+        if(rendered){
+            this.view.refresh(true);
+        }
+        this.fireEvent('reconfigure', this, store, colModel);
+    },
+
+    // private
+    onDestroy : function(){
+        if (this.deferRowRenderTask && this.deferRowRenderTask.cancel){
+            this.deferRowRenderTask.cancel();
+        }
+        if(this.rendered){
+            Ext.destroy(this.view, this.loadMask);
+        }else if(this.store && this.store.autoDestroy){
+            this.store.destroy();
+        }
+        Ext.destroy(this.colModel, this.selModel);
+        this.store = this.selModel = this.colModel = this.view = this.loadMask = null;
+        Ext.grid.GridPanel.superclass.onDestroy.call(this);
+    },
+
+    // private
+    processEvent : function(name, e){
+        this.view.processEvent(name, e);
+    },
+
+    // private
+    onClick : function(e){
+        this.processEvent('click', e);
+    },
+
+    // private
+    onMouseDown : function(e){
+        this.processEvent('mousedown', e);
+    },
+
+    // private
+    onContextMenu : function(e, t){
+        this.processEvent('contextmenu', e);
+    },
+
+    // private
+    onDblClick : function(e){
+        this.processEvent('dblclick', e);
+    },
+
+    // private
+    walkCells : function(row, col, step, fn, scope){
+        var cm    = this.colModel,
+            clen  = cm.getColumnCount(),
+            ds    = this.store,
+            rlen  = ds.getCount(),
+            first = true;
+
+        if(step < 0){
+            if(col < 0){
+                row--;
+                first = false;
+            }
+            while(row >= 0){
+                if(!first){
+                    col = clen-1;
+                }
+                first = false;
+                while(col >= 0){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col--;
+                }
+                row--;
+            }
+        } else {
+            if(col >= clen){
+                row++;
+                first = false;
+            }
+            while(row < rlen){
+                if(!first){
+                    col = 0;
+                }
+                first = false;
+                while(col < clen){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col++;
+                }
+                row++;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the grid's underlying element.
+     * @return {Element} The element
+     */
+    getGridEl : function(){
+        return this.body;
+    },
+
+    // private for compatibility, overridden by editor grid
+    stopEditing : Ext.emptyFn,
+
+    /**
+     * Returns the grid's selection model configured by the <code>{@link #selModel}</code>
+     * configuration option. If no selection model was configured, this will create
+     * and return a {@link Ext.grid.RowSelectionModel RowSelectionModel}.
+     * @return {SelectionModel}
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.grid.RowSelectionModel(
+                    this.disableSelection ? {selectRow: Ext.emptyFn} : null);
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Returns the grid's data store.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Returns the grid's ColumnModel.
+     * @return {Ext.grid.ColumnModel} The column model
+     */
+    getColumnModel : function(){
+        return this.colModel;
+    },
+
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.GridView} The grid view
+     */
+    getView : function() {
+        if (!this.view) {
+            this.view = new Ext.grid.GridView(this.viewConfig);
+        }
+        
+        return this.view;
+    },
+    /**
+     * Called to get grid's drag proxy text, by default returns this.ddText.
+     * @return {String} The text
+     */
+    getDragDropText : function(){
+        var count = this.selModel.getCount();
+        return String.format(this.ddText, count, count == 1 ? '' : 's');
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method add
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @event afterlayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} autoScroll  @hide
+     */
+    /**
+     * @cfg {String} bodyBorder  @hide
+     */
+    /**
+     * @cfg {String} bodyStyle  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+Ext.reg('grid', Ext.grid.GridPanel);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CellSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CellSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CellSelectionModel.js	(revision 76)
@@ -0,0 +1,286 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.CellSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * This class provides the basic implementation for <i>single</i> <b>cell</b> selection in a grid.
+ * The object stored as the selection contains the following properties:
+ * <div class="mdetail-params"><ul>
+ * <li><b>cell</b> : see {@link #getSelectedCell} 
+ * <li><b>record</b> : Ext.data.record The {@link Ext.data.Record Record}
+ * which provides the data for the row containing the selection</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The object containing the configuration of this model.
+ */
+Ext.grid.CellSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+
+	    this.selection = null;
+	
+	    this.addEvents(
+	        /**
+	         * @event beforecellselect
+	         * Fires before a cell is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "beforecellselect",
+	        /**
+	         * @event cellselect
+	         * Fires when a cell is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "cellselect",
+	        /**
+	         * @event selectionchange
+	         * Fires when the active selection changes.
+	         * @param {SelectionModel} this
+	         * @param {Object} selection null for no selection or an object with two properties
+	         * <div class="mdetail-params"><ul>
+	         * <li><b>cell</b> : see {@link #getSelectedCell} 
+	         * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record Record}
+	         * which provides the data for the row containing the selection</p></li>
+	         * </ul></div>
+	         */
+	        "selectionchange"
+	    );
+	
+	    Ext.grid.CellSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore */
+    initEvents : function(){
+        this.grid.on('cellmousedown', this.handleMouseDown, this);
+        this.grid.on(Ext.EventManager.getKeyEvent(), this.handleKeyDown, this);
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onViewChange,
+            rowupdated: this.onRowUpdated,
+            beforerowremoved: this.clearSelections,
+            beforerowsinserted: this.clearSelections
+        });
+        if(this.grid.isEditor){
+            this.grid.on('beforeedit', this.beforeEdit,  this);
+        }
+    },
+
+	//private
+    beforeEdit : function(e){
+        this.select(e.row, e.column, false, true, e.record);
+    },
+
+	//private
+    onRowUpdated : function(v, index, r){
+        if(this.selection && this.selection.record == r){
+            v.onCellSelect(index, this.selection.cell[1]);
+        }
+    },
+
+	//private
+    onViewChange : function(){
+        this.clearSelections(true);
+    },
+
+	/**
+     * Returns an array containing the row and column indexes of the currently selected cell
+     * (e.g., [0, 0]), or null if none selected. The array has elements:
+     * <div class="mdetail-params"><ul>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The index of the selected row</p></li>
+     * <li><b>cellIndex</b> : Number<p class="sub-desc">The index of the selected cell. 
+     * Due to possible column reordering, the cellIndex should <b>not</b> be used as an
+     * index into the Record's data. Instead, use the cellIndex to determine the <i>name</i>
+     * of the selected cell and use the field name to retrieve the data value from the record:<pre><code>
+// get name
+var fieldName = grid.getColumnModel().getDataIndex(cellIndex);
+// get data value based on name
+var data = record.get(fieldName);
+     * </code></pre></p></li>
+     * </ul></div>
+     * @return {Array} An array containing the row and column indexes of the selected cell, or null if none selected.
+	 */
+    getSelectedCell : function(){
+        return this.selection ? this.selection.cell : null;
+    },
+
+    /**
+     * If anything is selected, clears all selections and fires the selectionchange event.
+     * @param {Boolean} preventNotify <tt>true</tt> to prevent the gridview from
+     * being notified about the change.
+     */
+    clearSelections : function(preventNotify){
+        var s = this.selection;
+        if(s){
+            if(preventNotify !== true){
+                this.grid.view.onCellDeselect(s.cell[0], s.cell[1]);
+            }
+            this.selection = null;
+            this.fireEvent("selectionchange", this, null);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selection ? true : false;
+    },
+
+    /** @ignore */
+    handleMouseDown : function(g, row, cell, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        this.select(row, cell);
+    },
+
+    /**
+     * Selects a cell.  Before selecting a cell, fires the
+     * {@link #beforecellselect} event.  If this check is satisfied the cell
+     * will be selected and followed up by  firing the {@link #cellselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} rowIndex The index of the row to select
+     * @param {Number} colIndex The index of the column to select
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     * @param {Boolean} preventFocus (optional) Whether to prevent the cell at
+     * the specified rowIndex / colIndex from being focused.
+     * @param {Ext.data.Record} r (optional) The record to select
+     */
+    select : function(rowIndex, colIndex, preventViewNotify, preventFocus, /*internal*/ r){
+        if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){
+            this.clearSelections();
+            r = r || this.grid.store.getAt(rowIndex);
+            this.selection = {
+                record : r,
+                cell : [rowIndex, colIndex]
+            };
+            if(!preventViewNotify){
+                var v = this.grid.getView();
+                v.onCellSelect(rowIndex, colIndex);
+                if(preventFocus !== true){
+                    v.focusCell(rowIndex, colIndex);
+                }
+            }
+            this.fireEvent("cellselect", this, rowIndex, colIndex);
+            this.fireEvent("selectionchange", this, this.selection);
+        }
+    },
+
+	//private
+    isSelectable : function(rowIndex, colIndex, cm){
+        return !cm.isHidden(colIndex);
+    },
+    
+    // private
+    onEditorKey: function(field, e){
+        if(e.getKey() == e.TAB){
+            this.handleKeyDown(e);
+        }
+    },
+
+    /** @ignore */
+    handleKeyDown : function(e){
+        if(!e.isNavKeyPress()){
+            return;
+        }
+        
+        var k = e.getKey(),
+            g = this.grid,
+            s = this.selection,
+            sm = this,
+            walk = function(row, col, step){
+                return g.walkCells(
+                    row,
+                    col,
+                    step,
+                    g.isEditor && g.editing ? sm.acceptsNav : sm.isSelectable, // *** handle tabbing while editorgrid is in edit mode
+                    sm
+                );
+            },
+            cell, newCell, r, c, ae;
+
+        switch(k){
+            case e.ESC:
+            case e.PAGE_UP:
+            case e.PAGE_DOWN:
+                // do nothing
+                break;
+            default:
+                // *** call e.stopEvent() only for non ESC, PAGE UP/DOWN KEYS
+                e.stopEvent();
+                break;
+        }
+
+        if(!s){
+            cell = walk(0, 0, 1); // *** use private walk() function defined above
+            if(cell){
+                this.select(cell[0], cell[1]);
+            }
+            return;
+        }
+
+        cell = s.cell;  // currently selected cell
+        r = cell[0];    // current row
+        c = cell[1];    // current column
+        
+        switch(k){
+            case e.TAB:
+                if(e.shiftKey){
+                    newCell = walk(r, c - 1, -1);
+                }else{
+                    newCell = walk(r, c + 1, 1);
+                }
+                break;
+            case e.DOWN:
+                newCell = walk(r + 1, c, 1);
+                break;
+            case e.UP:
+                newCell = walk(r - 1, c, -1);
+                break;
+            case e.RIGHT:
+                newCell = walk(r, c + 1, 1);
+                break;
+            case e.LEFT:
+                newCell = walk(r, c - 1, -1);
+                break;
+            case e.ENTER:
+                if (g.isEditor && !g.editing) {
+                    g.startEditing(r, c);
+                    return;
+                }
+                break;
+        }
+
+        if(newCell){
+            // *** reassign r & c variables to newly-selected cell's row and column
+            r = newCell[0];
+            c = newCell[1];
+
+            this.select(r, c); // *** highlight newly-selected cell and update selection
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+                g.startEditing(r, c);
+            }
+        }
+    },
+
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowNumberer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowNumberer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowNumberer.js	(revision 76)
@@ -0,0 +1,62 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.RowNumberer
+ * This is a utility class that can be passed into a {@link Ext.grid.ColumnModel} as a column config that provides
+ * an automatic row numbering column.
+ * <br>Usage:<br>
+ <pre><code>
+ // This is a typical column config with the first column providing row numbers
+ var colModel = new Ext.grid.ColumnModel([
+    new Ext.grid.RowNumberer(),
+    {header: "Name", width: 80, sortable: true},
+    {header: "Code", width: 50, sortable: true},
+    {header: "Description", width: 200, sortable: true}
+ ]);
+ </code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.RowNumberer = Ext.extend(Object, {
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the row
+     * number column (defaults to '').
+     */
+    header: "",
+    /**
+     * @cfg {Number} width The default width in pixels of the row number column (defaults to 23).
+     */
+    width: 23,
+    /**
+     * @cfg {Boolean} sortable True if the row number column is sortable (defaults to false).
+     * @hide
+     */
+    sortable: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        if(this.rowspan){
+            this.renderer = this.renderer.createDelegate(this);
+        }
+    },
+
+    // private
+    fixed:true,
+    hideable: false,
+    menuDisabled:true,
+    dataIndex: '',
+    id: 'numberer',
+    rowspan: undefined,
+
+    // private
+    renderer : function(v, p, record, rowIndex){
+        if(this.rowspan){
+            p.cellAttr = 'rowspan="'+this.rowspan+'"';
+        }
+        return rowIndex+1;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGrid.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGrid.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGrid.js	(revision 76)
@@ -0,0 +1,389 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.PivotGrid
+ * @extends Ext.grid.GridPanel
+ * <p>The PivotGrid component enables rapid summarization of large data sets. It provides a way to reduce a large set of
+ * data down into a format where trends and insights become more apparent. A classic example is in sales data; a company
+ * will often have a record of all sales it makes for a given period - this will often encompass thousands of rows of
+ * data. The PivotGrid allows you to see how well each salesperson performed, which cities generate the most revenue, 
+ * how products perform between cities and so on.</p>
+ * <p>A PivotGrid is composed of two axes (left and top), one {@link #measure} and one {@link #aggregator aggregation}
+ * function. Each axis can contain one or more {@link #dimension}, which are ordered into a hierarchy. Dimensions on the 
+ * left axis can also specify a width. Each dimension in each axis can specify its sort ordering, defaulting to "ASC", 
+ * and must specify one of the fields in the {@link Ext.data.Record Record} used by the PivotGrid's 
+ * {@link Ext.data.Store Store}.</p>
+<pre><code>
+// This is the record representing a single sale
+var SaleRecord = Ext.data.Record.create([
+    {name: 'person',   type: 'string'},
+    {name: 'product',  type: 'string'},
+    {name: 'city',     type: 'string'},
+    {name: 'state',    type: 'string'},
+    {name: 'year',     type: 'int'},
+    {name: 'value',    type: 'int'}
+]);
+
+// A simple store that loads SaleRecord data from a url
+var myStore = new Ext.data.Store({
+    url: 'data.json',
+    autoLoad: true,
+    reader: new Ext.data.JsonReader({
+        root: 'rows',
+        idProperty: 'id'
+    }, SaleRecord)
+});
+
+// Create the PivotGrid itself, referencing the store
+var pivot = new Ext.grid.PivotGrid({
+    store     : myStore,
+    aggregator: 'sum',
+    measure   : 'value',
+
+    leftAxis: [
+        {
+            width: 60,
+            dataIndex: 'product'
+        },
+        {
+            width: 120,
+            dataIndex: 'person',
+            direction: 'DESC'
+        }
+    ],
+
+    topAxis: [
+        {
+            dataIndex: 'year'
+        }
+    ]
+});
+</code></pre>
+ * <p>The specified {@link #measure} is the field from SaleRecord that is extracted from each combination
+ * of product and person (on the left axis) and year on the top axis. There may be several SaleRecords in the 
+ * data set that share this combination, so an array of measure fields is produced. This array is then 
+ * aggregated using the {@link #aggregator} function.</p>
+ * <p>The default aggregator function is sum, which simply adds up all of the extracted measure values. Other
+ * built-in aggregator functions are count, avg, min and max. In addition, you can specify your own function.
+ * In this example we show the code used to sum the measures, but you can return any value you like. See
+ * {@link #aggregator} for more details.</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    aggregator: function(records, measure) {
+        var length = records.length,
+            total  = 0,
+            i;
+
+        for (i = 0; i < length; i++) {
+            total += records[i].get(measure);
+        }
+
+        return total;
+    },
+    
+    renderer: function(value) {
+        return Math.round(value);
+    },
+    
+    //your normal config here
+});
+</code></pre>
+ * <p><u>Renderers</u></p>
+ * <p>PivotGrid optionally accepts a {@link #renderer} function which can modify the data in each cell before it
+ * is rendered. The renderer is passed the value that would usually be placed in the cell and is expected to return
+ * the new value. For example let's imagine we had height data expressed as a decimal - here's how we might use a
+ * renderer to display the data in feet and inches notation:</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    //in each case the value is a decimal number of feet
+    renderer  : function(value) {
+        var feet   = Math.floor(value),
+            inches = Math.round((value - feet) * 12);
+
+        return String.format("{0}' {1}\"", feet, inches);
+    },
+    //normal config here
+});
+</code></pre>
+ * <p><u>Reconfiguring</u></p>
+ * <p>All aspects PivotGrid's configuration can be updated at runtime. It is easy to change the {@link #setMeasure measure}, 
+ * {@link #setAggregator aggregation function}, {@link #setLeftAxis left} and {@link #setTopAxis top} axes and refresh the grid.</p>
+ * <p>In this case we reconfigure the PivotGrid to have city and year as the top axis dimensions, rendering the average sale
+ * value into the cells:</p>
+<pre><code>
+//the left axis can also be changed
+pivot.topAxis.setDimensions([
+    {dataIndex: 'city', direction: 'DESC'},
+    {dataIndex: 'year', direction: 'ASC'}
+]);
+
+pivot.setMeasure('value');
+pivot.setAggregator('avg');
+
+pivot.view.refresh(true);
+</code></pre>
+ * <p>See the {@link Ext.grid.PivotAxis PivotAxis} documentation for further detail on reconfiguring axes.</p>
+ */
+Ext.grid.PivotGrid = Ext.extend(Ext.grid.GridPanel, {
+    
+    /**
+     * @cfg {String|Function} aggregator The aggregation function to use to combine the measures extracted
+     * for each dimension combination. Can be any of the built-in aggregators (sum, count, avg, min, max).
+     * Can also be a function which accepts two arguments (an array of Records to aggregate, and the measure 
+     * to aggregate them on) and should return a String.
+     */
+    aggregator: 'sum',
+    
+    /**
+     * @cfg {Function} renderer Optional renderer to pass values through before they are rendered to the dom. This
+     * gives an opportunity to modify cell contents after the value has been computed.
+     */
+    renderer: undefined,
+    
+    /**
+     * @cfg {String} measure The field to extract from each Record when pivoting around the two axes. See the class
+     * introduction docs for usage
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} leftAxis Either and array of {@link #dimension} to use on the left axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} topAxis Either and array of {@link #dimension} to use on the top axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    //inherit docs
+    initComponent: function() {
+        Ext.grid.PivotGrid.superclass.initComponent.apply(this, arguments);
+        
+        this.initAxes();
+        
+        //no resizing of columns is allowed yet in PivotGrid
+        this.enableColumnResize = false;
+        
+        this.viewConfig = Ext.apply(this.viewConfig || {}, {
+            forceFit: true
+        });
+        
+        //TODO: dummy col model that is never used - GridView is too tightly integrated with ColumnModel
+        //in 3.x to remove this altogether.
+        this.colModel = new Ext.grid.ColumnModel({});
+    },
+    
+    /**
+     * Returns the function currently used to aggregate the records in each Pivot cell
+     * @return {Function} The current aggregator function
+     */
+    getAggregator: function() {
+        if (typeof this.aggregator == 'string') {
+            return Ext.grid.PivotAggregatorMgr.types[this.aggregator];
+        } else {
+            return this.aggregator;
+        }
+    },
+    
+    /**
+     * Sets the function to use when aggregating data for each cell.
+     * @param {String|Function} aggregator The new aggregator function or named function string
+     */
+    setAggregator: function(aggregator) {
+        this.aggregator = aggregator;
+    },
+    
+    /**
+     * Sets the field name to use as the Measure in this Pivot Grid
+     * @param {String} measure The field to make the measure
+     */
+    setMeasure: function(measure) {
+        this.measure = measure;
+    },
+    
+    /**
+     * Sets the left axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setLeftAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the left Axis for this Pivot Grid
+         * @property leftAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.leftAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * Sets the top axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setTopAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the top Axis for this Pivot Grid
+         * @property topAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.topAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the top and left axes. Should usually only need to be called once from initComponent
+     */
+    initAxes: function() {
+        var PivotAxis = Ext.grid.PivotAxis;
+        
+        if (!(this.leftAxis instanceof PivotAxis)) {
+            this.setLeftAxis(new PivotAxis({
+                orientation: 'vertical',
+                dimensions : this.leftAxis || [],
+                store      : this.store
+            }));
+        };
+        
+        if (!(this.topAxis instanceof PivotAxis)) {
+            this.setTopAxis(new PivotAxis({
+                orientation: 'horizontal',
+                dimensions : this.topAxis || [],
+                store      : this.store
+            }));
+        };
+    },
+    
+    /**
+     * @private
+     * @return {Array} 2-dimensional array of cell data
+     */
+    extractData: function() {
+        var records  = this.store.data.items,
+            recCount = records.length,
+            cells    = [],
+            record, i, j, k;
+        
+        if (recCount == 0) {
+            return [];
+        }
+        
+        var leftTuples = this.leftAxis.getTuples(),
+            leftCount  = leftTuples.length,
+            topTuples  = this.topAxis.getTuples(),
+            topCount   = topTuples.length,
+            aggregator = this.getAggregator();
+        
+        for (i = 0; i < recCount; i++) {
+            record = records[i];
+            
+            for (j = 0; j < leftCount; j++) {
+                cells[j] = cells[j] || [];
+                
+                if (leftTuples[j].matcher(record) === true) {
+                    for (k = 0; k < topCount; k++) {
+                        cells[j][k] = cells[j][k] || [];
+                        
+                        if (topTuples[k].matcher(record)) {
+                            cells[j][k].push(record);
+                        }
+                    }
+                }
+            }
+        }
+        
+        var rowCount = cells.length,
+            colCount, row;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = cells[i];
+            colCount = row.length;
+            
+            for (j = 0; j < colCount; j++) {
+                cells[i][j] = aggregator(cells[i][j], this.measure);
+            }
+        }
+        
+        return cells;
+    },
+    
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.PivotGridView} The grid view
+     */
+    getView: function() {
+        if (!this.view) {
+            this.view = new Ext.grid.PivotGridView(this.viewConfig);
+        }
+        
+        return this.view;
+    }
+});
+
+Ext.reg('pivotgrid', Ext.grid.PivotGrid);
+
+
+Ext.grid.PivotAggregatorMgr = new Ext.AbstractManager();
+
+Ext.grid.PivotAggregatorMgr.registerType('sum', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return total;
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('avg', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return (total / length) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('min', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.min.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('max', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.max.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('count', function(records, measure) {
+    return records.length;
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CheckboxSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CheckboxSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/CheckboxSelectionModel.js	(revision 76)
@@ -0,0 +1,121 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.CheckboxSelectionModel
+ * @extends Ext.grid.RowSelectionModel
+ * A custom selection model that renders a column of checkboxes that can be toggled to select or deselect rows.
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
+
+    /**
+     * @cfg {Boolean} checkOnly <tt>true</tt> if rows can only be selected by clicking on the
+     * checkbox column (defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the
+     * checkbox column.  Defaults to:<pre><code>
+     * '&lt;div class="x-grid3-hd-checker">&#38;#160;&lt;/div>'</tt>
+     * </code></pre>
+     * The default CSS class of <tt>'x-grid3-hd-checker'</tt> displays a checkbox in the header
+     * and provides support for automatic check all/none behavior on header click. This string
+     * can be replaced by any valid HTML fragment, including a simple text string (e.g.,
+     * <tt>'Select Rows'</tt>), but the automatic check all/none behavior will only work if the
+     * <tt>'x-grid3-hd-checker'</tt> class is supplied.
+     */
+    header : '<div class="x-grid3-hd-checker">&#160;</div>',
+    /**
+     * @cfg {Number} width The default width in pixels of the checkbox column (defaults to <tt>20</tt>).
+     */
+    width : 20,
+    /**
+     * @cfg {Boolean} sortable <tt>true</tt> if the checkbox column is sortable (defaults to
+     * <tt>false</tt>).
+     */
+    sortable : false,
+
+    // private
+    menuDisabled : true,
+    fixed : true,
+    hideable: false,
+    dataIndex : '',
+    id : 'checker',
+    isColumn: true, // So that ColumnModel doesn't feed this through the Column constructor
+
+    constructor : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this, arguments);
+        if(this.checkOnly){
+            this.handleMouseDown = Ext.emptyFn;
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
+        this.grid.on('render', function(){
+            Ext.fly(this.grid.getView().innerHd).on('mousedown', this.onHdMouseDown, this);
+        }, this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        if (name == 'mousedown') {
+            this.onMouseDown(e, e.getTarget());
+            return false;
+        } else {
+            return Ext.grid.Column.prototype.processEvent.apply(this, arguments);
+        }
+    },
+
+    // private
+    onMouseDown : function(e, t){
+        if(e.button === 0 && t.className == 'x-grid3-row-checker'){ // Only fire if left-click
+            e.stopEvent();
+            var row = e.getTarget('.x-grid3-row');
+            if(row){
+                var index = row.rowIndex;
+                if(this.isSelected(index)){
+                    this.deselectRow(index);
+                }else{
+                    this.selectRow(index, true);
+                    this.grid.getView().focusRow(index);
+                }
+            }
+        }
+    },
+
+    // private
+    onHdMouseDown : function(e, t) {
+        if(t.className == 'x-grid3-hd-checker'){
+            e.stopEvent();
+            var hd = Ext.fly(t.parentNode);
+            var isChecked = hd.hasClass('x-grid3-hd-checker-on');
+            if(isChecked){
+                hd.removeClass('x-grid3-hd-checker-on');
+                this.clearSelections();
+            }else{
+                hd.addClass('x-grid3-hd-checker-on');
+                this.selectAll();
+            }
+        }
+    },
+
+    // private
+    renderer : function(v, p, record){
+        return '<div class="x-grid3-row-checker">&#160;</div>';
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row && !this.checkOnly){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnModel.js	(revision 76)
@@ -0,0 +1,655 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.ColumnModel
+ * @extends Ext.util.Observable
+ * <p>After the data has been read into the client side cache (<b>{@link Ext.data.Store Store}</b>),
+ * the ColumnModel is used to configure how and what parts of that data will be displayed in the
+ * vertical slices (columns) of the grid. The Ext.grid.ColumnModel Class is the default implementation
+ * of a ColumnModel used by implentations of {@link Ext.grid.GridPanel GridPanel}.</p>
+ * <p>Data is mapped into the store's records and then indexed into the ColumnModel using the
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt>:</p>
+ * <pre><code>
+{data source} == mapping ==> {data store} == <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> ==> {ColumnModel}
+ * </code></pre>
+ * <p>Each {@link Ext.grid.Column Column} in the grid's ColumnModel is configured with a
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt> to specify how the data within
+ * each record in the store is indexed into the ColumnModel.</p>
+ * <p>There are two ways to initialize the ColumnModel class:</p>
+ * <p><u>Initialization Method 1: an Array</u></p>
+<pre><code>
+ var colModel = new Ext.grid.ColumnModel([
+    { header: "Ticker", width: 60, sortable: true},
+    { header: "Company Name", width: 150, sortable: true, id: 'company'},
+    { header: "Market Cap.", width: 100, sortable: true},
+    { header: "$ Sales", width: 100, sortable: true, renderer: money},
+    { header: "Employees", width: 100, sortable: true, resizable: false}
+ ]);
+ </code></pre>
+ * <p>The ColumnModel may be initialized with an Array of {@link Ext.grid.Column} column configuration
+ * objects to define the initial layout / display of the columns in the Grid. The order of each
+ * {@link Ext.grid.Column} column configuration object within the specified Array defines the initial
+ * order of the column display.  A Column's display may be initially hidden using the
+ * <tt>{@link Ext.grid.Column#hidden hidden}</tt></b> config property (and then shown using the column
+ * header menu).  Fields that are not included in the ColumnModel will not be displayable at all.</p>
+ * <p>How each column in the grid correlates (maps) to the {@link Ext.data.Record} field in the
+ * {@link Ext.data.Store Store} the column draws its data from is configured through the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b>.  If the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> is not explicitly defined (as shown in the
+ * example above) it will use the column configuration's index in the Array as the index.</p>
+ * <p>See <b><tt>{@link Ext.grid.Column}</tt></b> for additional configuration options for each column.</p>
+ * <p><u>Initialization Method 2: an Object</u></p>
+ * <p>In order to use configuration options from <tt>Ext.grid.ColumnModel</tt>, an Object may be used to
+ * initialize the ColumnModel.  The column configuration Array will be specified in the <tt><b>{@link #columns}</b></tt>
+ * config property. The <tt><b>{@link #defaults}</b></tt> config property can be used to apply defaults
+ * for all columns, e.g.:</p><pre><code>
+ var colModel = new Ext.grid.ColumnModel({
+    columns: [
+        { header: "Ticker", width: 60, menuDisabled: false},
+        { header: "Company Name", width: 150, id: 'company'},
+        { header: "Market Cap."},
+        { header: "$ Sales", renderer: money},
+        { header: "Employees", resizable: false}
+    ],
+    defaults: {
+        sortable: true,
+        menuDisabled: true,
+        width: 100
+    },
+    listeners: {
+        {@link #hiddenchange}: function(cm, colIndex, hidden) {
+            saveConfig(colIndex, hidden);
+        }
+    }
+});
+ </code></pre>
+ * <p>In both examples above, the ability to apply a CSS class to all cells in a column (including the
+ * header) is demonstrated through the use of the <b><tt>{@link Ext.grid.Column#id id}</tt></b> config
+ * option. This column could be styled by including the following css:</p><pre><code>
+ //add this css *after* the core css is loaded
+.x-grid3-td-company {
+    color: red; // entire column will have red font
+}
+// modify the header row only, adding an icon to the column header
+.x-grid3-hd-company {
+    background: transparent
+        url(../../resources/images/icons/silk/building.png)
+        no-repeat 3px 3px ! important;
+        padding-left:20px;
+}
+ </code></pre>
+ * Note that the "Company Name" column could be specified as the
+ * <b><tt>{@link Ext.grid.GridPanel}.{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></b>.
+ * @constructor
+ * @param {Mixed} config Specify either an Array of {@link Ext.grid.Column} configuration objects or specify
+ * a configuration Object (see introductory section discussion utilizing Initialization Method 2 above).
+ */
+Ext.grid.ColumnModel = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} defaultWidth (optional) The width of columns which have no <tt>{@link #width}</tt>
+     * specified (defaults to <tt>100</tt>).  This property shall preferably be configured through the
+     * <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultWidth: 100,
+
+    /**
+     * @cfg {Boolean} defaultSortable (optional) Default sortable of columns which have no
+     * sortable specified (defaults to <tt>false</tt>).  This property shall preferably be configured
+     * through the <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultSortable: false,
+
+    /**
+     * @cfg {Array} columns An Array of object literals.  The config options defined by
+     * <b>{@link Ext.grid.Column}</b> are the options which may appear in the object literal for each
+     * individual column definition.
+     */
+
+    /**
+     * @cfg {Object} defaults Object literal which will be used to apply {@link Ext.grid.Column}
+     * configuration options to all <tt><b>{@link #columns}</b></tt>.  Configuration options specified with
+     * individual {@link Ext.grid.Column column} configs will supersede these <tt><b>{@link #defaults}</b></tt>.
+     */
+
+    constructor : function(config) {
+        /**
+	     * An Array of {@link Ext.grid.Column Column definition} objects representing the configuration
+	     * of this ColumnModel.  See {@link Ext.grid.Column} for the configuration properties that may
+	     * be specified.
+	     * @property config
+	     * @type Array
+	     */
+	    if (config.columns) {
+	        Ext.apply(this, config);
+	        this.setConfig(config.columns, true);
+	    } else {
+	        this.setConfig(config, true);
+	    }
+	    
+	    this.addEvents(
+	        /**
+	         * @event widthchange
+	         * Fires when the width of a column is programmaticially changed using
+	         * <code>{@link #setColumnWidth}</code>.
+	         * Note internal resizing suppresses the event from firing. See also
+	         * {@link Ext.grid.GridPanel}.<code>{@link #columnresize}</code>.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Number} newWidth The new width
+	         */
+	        "widthchange",
+	        
+	        /**
+	         * @event headerchange
+	         * Fires when the text of a header changes.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {String} newText The new header text
+	         */
+	        "headerchange",
+	        
+	        /**
+	         * @event hiddenchange
+	         * Fires when a column is hidden or "unhidden".
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Boolean} hidden true if hidden, false otherwise
+	         */
+	        "hiddenchange",
+	        
+	        /**
+	         * @event columnmoved
+	         * Fires when a column is moved.
+	         * @param {ColumnModel} this
+	         * @param {Number} oldIndex
+	         * @param {Number} newIndex
+	         */
+	        "columnmoved",
+	        
+	        /**
+	         * @event configchange
+	         * Fires when the configuration is changed
+	         * @param {ColumnModel} this
+	         */
+	        "configchange"
+	    );
+	    
+	    Ext.grid.ColumnModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * Returns the id of the column at the specified index.
+     * @param {Number} index The column index
+     * @return {String} the id
+     */
+    getColumnId : function(index) {
+        return this.config[index].id;
+    },
+
+    getColumnAt : function(index) {
+        return this.config[index];
+    },
+
+    /**
+     * <p>Reconfigures this column model according to the passed Array of column definition objects.
+     * For a description of the individual properties of a column definition object, see the
+     * <a href="#Ext.grid.ColumnModel-configs">Config Options</a>.</p>
+     * <p>Causes the {@link #configchange} event to be fired. A {@link Ext.grid.GridPanel GridPanel}
+     * using this ColumnModel will listen for this event and refresh its UI automatically.</p>
+     * @param {Array} config Array of Column definition objects.
+     * @param {Boolean} initial Specify <tt>true</tt> to bypass cleanup which deletes the <tt>totalWidth</tt>
+     * and destroys existing editors.
+     */
+    setConfig : function(config, initial) {
+        var i, c, len;
+        
+        if (!initial) { // cleanup
+            delete this.totalWidth;
+            
+            for (i = 0, len = this.config.length; i < len; i++) {
+                c = this.config[i];
+                
+                if (c.setEditor) {
+                    //check here, in case we have a special column like a CheckboxSelectionModel
+                    c.setEditor(null);
+                }
+            }
+        }
+
+        // backward compatibility
+        this.defaults = Ext.apply({
+            width: this.defaultWidth,
+            sortable: this.defaultSortable
+        }, this.defaults);
+
+        this.config = config;
+        this.lookup = {};
+
+        for (i = 0, len = config.length; i < len; i++) {
+            c = Ext.applyIf(config[i], this.defaults);
+            
+            // if no id, create one using column's ordinal position
+            if (Ext.isEmpty(c.id)) {
+                c.id = i;
+            }
+            
+            if (!c.isColumn) {
+                var Cls = Ext.grid.Column.types[c.xtype || 'gridcolumn'];
+                c = new Cls(c);
+                config[i] = c;
+            }
+            
+            this.lookup[c.id] = c;
+        }
+        
+        if (!initial) {
+            this.fireEvent('configchange', this);
+        }
+    },
+
+    /**
+     * Returns the column for a specified id.
+     * @param {String} id The column id
+     * @return {Object} the column
+     */
+    getColumnById : function(id) {
+        return this.lookup[id];
+    },
+
+    /**
+     * Returns the index for a specified column id.
+     * @param {String} id The column id
+     * @return {Number} the index, or -1 if not found
+     */
+    getIndexById : function(id) {
+        for (var i = 0, len = this.config.length; i < len; i++) {
+            if (this.config[i].id == id) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Moves a column from one position to another.
+     * @param {Number} oldIndex The index of the column to move.
+     * @param {Number} newIndex The position at which to reinsert the coolumn.
+     */
+    moveColumn : function(oldIndex, newIndex) {
+        var config = this.config,
+            c      = config[oldIndex];
+            
+        config.splice(oldIndex, 1);
+        config.splice(newIndex, 0, c);
+        this.dataMap = null;
+        this.fireEvent("columnmoved", this, oldIndex, newIndex);
+    },
+
+    /**
+     * Returns the number of columns.
+     * @param {Boolean} visibleOnly Optional. Pass as true to only include visible columns.
+     * @return {Number}
+     */
+    getColumnCount : function(visibleOnly) {
+        var length = this.config.length,
+            c = 0,
+            i;
+        
+        if (visibleOnly === true) {
+            for (i = 0; i < length; i++) {
+                if (!this.isHidden(i)) {
+                    c++;
+                }
+            }
+            
+            return c;
+        }
+        
+        return length;
+    },
+
+    /**
+     * Returns the column configs that return true by the passed function that is called
+     * with (columnConfig, index)
+<pre><code>
+// returns an array of column config objects for all hidden columns
+var columns = grid.getColumnModel().getColumnsBy(function(c){
+  return c.hidden;
+});
+</code></pre>
+     * @param {Function} fn A function which, when passed a {@link Ext.grid.Column Column} object, must
+     * return <code>true</code> if the column is to be included in the returned Array.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function
+     * is executed. Defaults to this ColumnModel.
+     * @return {Array} result
+     */
+    getColumnsBy : function(fn, scope) {
+        var config = this.config,
+            length = config.length,
+            result = [],
+            i, c;
+            
+        for (i = 0; i < length; i++){
+            c = config[i];
+            
+            if (fn.call(scope || this, c, i) === true) {
+                result[result.length] = c;
+            }
+        }
+        
+        return result;
+    },
+
+    /**
+     * Returns true if the specified column is sortable.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isSortable : function(col) {
+        return !!this.config[col].sortable;
+    },
+
+    /**
+     * Returns true if the specified column menu is disabled.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isMenuDisabled : function(col) {
+        return !!this.config[col].menuDisabled;
+    },
+
+    /**
+     * Returns the rendering (formatting) function defined for the column.
+     * @param {Number} col The column index.
+     * @return {Function} The function used to render the cell. See {@link #setRenderer}.
+     */
+    getRenderer : function(col) {
+        return this.config[col].renderer || Ext.grid.ColumnModel.defaultRenderer;
+    },
+
+    getRendererScope : function(col) {
+        return this.config[col].scope;
+    },
+
+    /**
+     * Sets the rendering (formatting) function for a column.  See {@link Ext.util.Format} for some
+     * default formatting functions.
+     * @param {Number} col The column index
+     * @param {Function} fn The function to use to process the cell's raw data
+     * to return HTML markup for the grid view. The render function is called with
+     * the following parameters:<ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     * (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record was extracted.</p></li></ul>
+     */
+    setRenderer : function(col, fn) {
+        this.config[col].renderer = fn;
+    },
+
+    /**
+     * Returns the width for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getColumnWidth : function(col) {
+        var width = this.config[col].width;
+        if(typeof width != 'number'){
+            width = this.defaultWidth;
+        }
+        return width;
+    },
+
+    /**
+     * Sets the width for a column.
+     * @param {Number} col The column index
+     * @param {Number} width The new width
+     * @param {Boolean} suppressEvent True to suppress firing the <code>{@link #widthchange}</code>
+     * event. Defaults to false.
+     */
+    setColumnWidth : function(col, width, suppressEvent) {
+        this.config[col].width = width;
+        this.totalWidth = null;
+        
+        if (!suppressEvent) {
+             this.fireEvent("widthchange", this, col, width);
+        }
+    },
+
+    /**
+     * Returns the total width of all columns.
+     * @param {Boolean} includeHidden True to include hidden column widths
+     * @return {Number}
+     */
+    getTotalWidth : function(includeHidden) {
+        if (!this.totalWidth) {
+            this.totalWidth = 0;
+            for (var i = 0, len = this.config.length; i < len; i++) {
+                if (includeHidden || !this.isHidden(i)) {
+                    this.totalWidth += this.getColumnWidth(i);
+                }
+            }
+        }
+        return this.totalWidth;
+    },
+
+    /**
+     * Returns the header for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnHeader : function(col) {
+        return this.config[col].header;
+    },
+
+    /**
+     * Sets the header for a column.
+     * @param {Number} col The column index
+     * @param {String} header The new header
+     */
+    setColumnHeader : function(col, header) {
+        this.config[col].header = header;
+        this.fireEvent("headerchange", this, col, header);
+    },
+
+    /**
+     * Returns the tooltip for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnTooltip : function(col) {
+            return this.config[col].tooltip;
+    },
+    /**
+     * Sets the tooltip for a column.
+     * @param {Number} col The column index
+     * @param {String} tooltip The new tooltip
+     */
+    setColumnTooltip : function(col, tooltip) {
+            this.config[col].tooltip = tooltip;
+    },
+
+    /**
+     * Returns the dataIndex for the specified column.
+<pre><code>
+// Get field name for the column
+var fieldName = grid.getColumnModel().getDataIndex(columnIndex);
+</code></pre>
+     * @param {Number} col The column index
+     * @return {String} The column's dataIndex
+     */
+    getDataIndex : function(col) {
+        return this.config[col].dataIndex;
+    },
+
+    /**
+     * Sets the dataIndex for a column.
+     * @param {Number} col The column index
+     * @param {String} dataIndex The new dataIndex
+     */
+    setDataIndex : function(col, dataIndex) {
+        this.config[col].dataIndex = dataIndex;
+    },
+
+    /**
+     * Finds the index of the first matching column for the given dataIndex.
+     * @param {String} col The dataIndex to find
+     * @return {Number} The column index, or -1 if no match was found
+     */
+    findColumnIndex : function(dataIndex) {
+        var c = this.config;
+        for(var i = 0, len = c.length; i < len; i++){
+            if(c[i].dataIndex == dataIndex){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns true if the cell is editable.
+<pre><code>
+var store = new Ext.data.Store({...});
+var colModel = new Ext.grid.ColumnModel({
+  columns: [...],
+  isCellEditable: function(col, row) {
+    var record = store.getAt(row);
+    if (record.get('readonly')) { // replace with your condition
+      return false;
+    }
+    return Ext.grid.ColumnModel.prototype.isCellEditable.call(this, col, row);
+  }
+});
+var grid = new Ext.grid.GridPanel({
+  store: store,
+  colModel: colModel,
+  ...
+});
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Boolean}
+     */
+    isCellEditable : function(colIndex, rowIndex) {
+        var c = this.config[colIndex],
+            ed = c.editable;
+
+        //force boolean
+        return !!(ed || (!Ext.isDefined(ed) && c.editor));
+    },
+
+    /**
+     * Returns the editor defined for the cell/column.
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor} The {@link Ext.Editor Editor} that was created to wrap
+     * the {@link Ext.form.Field Field} used to edit the cell.
+     */
+    getCellEditor : function(colIndex, rowIndex) {
+        return this.config[colIndex].getCellEditor(rowIndex);
+    },
+
+    /**
+     * Sets if a column is editable.
+     * @param {Number} col The column index
+     * @param {Boolean} editable True if the column is editable
+     */
+    setEditable : function(col, editable) {
+        this.config[col].editable = editable;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#hidden hidden}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isHidden : function(colIndex) {
+        return !!this.config[colIndex].hidden; // ensure returns boolean
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#fixed fixed}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isFixed : function(colIndex) {
+        return !!this.config[colIndex].fixed;
+    },
+
+    /**
+     * Returns true if the column can be resized
+     * @return {Boolean}
+     */
+    isResizable : function(colIndex) {
+        return colIndex >= 0 && this.config[colIndex].resizable !== false && this.config[colIndex].fixed !== true;
+    },
+    
+    /**
+     * Sets if a column is hidden.
+<pre><code>
+myGrid.getColumnModel().setHidden(0, true); // hide column 0 (0 = the first column).
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Boolean} hidden True if the column is hidden
+     */
+    setHidden : function(colIndex, hidden) {
+        var c = this.config[colIndex];
+        if(c.hidden !== hidden){
+            c.hidden = hidden;
+            this.totalWidth = null;
+            this.fireEvent("hiddenchange", this, colIndex, hidden);
+        }
+    },
+
+    /**
+     * Sets the editor for a column and destroys the prior editor.
+     * @param {Number} col The column index
+     * @param {Object} editor The editor object
+     */
+    setEditor : function(col, editor) {
+        this.config[col].setEditor(editor);
+    },
+
+    /**
+     * Destroys this column model by purging any event listeners. Destroys and dereferences all Columns.
+     */
+    destroy : function() {
+        var length = this.config.length,
+            i = 0;
+
+        for (; i < length; i++){
+            this.config[i].destroy(); // Column's destroy encapsulates all cleanup.
+        }
+        delete this.config;
+        delete this.lookup;
+        this.purgeListeners();
+    },
+
+    /**
+     * @private
+     * Setup any saved state for the column, ensures that defaults are applied.
+     */
+    setState : function(col, state) {
+        state = Ext.applyIf(state, this.defaults);
+        Ext.apply(this.config[col], state);
+    }
+});
+
+// private
+Ext.grid.ColumnModel.defaultRenderer = function(value) {
+    if (typeof value == "string" && value.length < 1) {
+        return "&#160;";
+    }
+    return value;
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridView.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridView.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridView.js	(revision 76)
@@ -0,0 +1,2517 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GridView
+ * @extends Ext.util.Observable
+ * <p>This class encapsulates the user interface of an {@link Ext.grid.GridPanel}.
+ * Methods of this class may be used to access user interface elements to enable
+ * special display effects. Do not change the DOM structure of the user interface.</p>
+ * <p>This class does not provide ways to manipulate the underlying data. The data
+ * model of a Grid is held in an {@link Ext.data.Store}.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GridView = Ext.extend(Ext.util.Observable, {
+    /**
+     * Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
+     * parameters to the row template for the current row to customize how it is rendered using the <b>rowParams</b>
+     * parameter.  This function should return the CSS class name (or empty string '' for none) that will be added
+     * to the row's wrapping div.  To apply multiple class names, simply return them space-delimited within the string
+     * (e.g., 'my-class another-class'). Example usage:
+    <pre><code>
+viewConfig: {
+    forceFit: true,
+    showPreview: true, // custom property
+    enableRowBody: true, // required to create a second, full-width row to show expanded Record data
+    getRowClass: function(record, rowIndex, rp, ds){ // rp = rowParams
+        if(this.showPreview){
+            rp.body = '&lt;p>'+record.data.excerpt+'&lt;/p>';
+            return 'x-grid3-row-expanded';
+        }
+        return 'x-grid3-row-collapsed';
+    }
+},
+    </code></pre>
+     * @param {Record} record The {@link Ext.data.Record} corresponding to the current row.
+     * @param {Number} index The row index.
+     * @param {Object} rowParams A config object that is passed to the row template during rendering that allows
+     * customization of various aspects of a grid row.
+     * <p>If {@link #enableRowBody} is configured <b><tt></tt>true</b>, then the following properties may be set
+     * by this function, and will be used to render a full-width expansion row below each grid row:</p>
+     * <ul>
+     * <li><code>body</code> : String <div class="sub-desc">An HTML fragment to be used as the expansion row's body content (defaults to '').</div></li>
+     * <li><code>bodyStyle</code> : String <div class="sub-desc">A CSS style specification that will be applied to the expansion row's &lt;tr> element. (defaults to '').</div></li>
+     * </ul>
+     * The following property will be passed in, and may be appended to:
+     * <ul>
+     * <li><code>tstyle</code> : String <div class="sub-desc">A CSS style specification that willl be applied to the &lt;table> element which encapsulates
+     * both the standard grid row, and any expansion row.</div></li>
+     * </ul>
+     * @param {Store} store The {@link Ext.data.Store} this grid is bound to
+     * @method getRowClass
+     * @return {String} a CSS class name to add to the row.
+     */
+
+    /**
+     * @cfg {Boolean} enableRowBody True to add a second TR element per row that can be used to provide a row body
+     * that spans beneath the data row.  Use the {@link #getRowClass} method's rowParams config to customize the row body.
+     */
+
+    /**
+     * @cfg {String} emptyText Default text (html tags are accepted) to display in the grid body when no rows
+     * are available (defaults to ''). This value will be used to update the <tt>{@link #mainBody}</tt>:
+    <pre><code>
+    this.mainBody.update('&lt;div class="x-grid-empty">' + this.emptyText + '&lt;/div>');
+    </code></pre>
+     */
+
+    /**
+     * @cfg {Boolean} headersDisabled True to disable the grid column headers (defaults to <tt>false</tt>).
+     * Use the {@link Ext.grid.ColumnModel ColumnModel} <tt>{@link Ext.grid.ColumnModel#menuDisabled menuDisabled}</tt>
+     * config to disable the <i>menu</i> for individual columns.  While this config is true the
+     * following will be disabled:<div class="mdetail-params"><ul>
+     * <li>clicking on header to sort</li>
+     * <li>the trigger to reveal the menu.</li>
+     * </ul></div>
+     */
+
+    /**
+     * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations
+     * of the template methods of DragZone to enable dragging of the selected rows of a GridPanel.
+     * See {@link Ext.grid.GridDragZone} for details.</p>
+     * <p>This will <b>only</b> be present:<div class="mdetail-params"><ul>
+     * <li><i>if</i> the owning GridPanel was configured with {@link Ext.grid.GridPanel#enableDragDrop enableDragDrop}: <tt>true</tt>.</li>
+     * <li><i>after</i> the owning GridPanel has been rendered.</li>
+     * </ul></div>
+     * @property dragZone
+     * @type {Ext.grid.GridDragZone}
+     */
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer <tt>{@link #emptyText}</tt> being applied until the store's
+     * first load (defaults to <tt>true</tt>).
+     */
+    deferEmptyText : true,
+
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the vertical scrollbar
+     * (defaults to <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+
+    /**
+     * @cfg {Boolean} autoFill
+     * Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * when the grid is <b>initially rendered</b>.  The
+     * {@link Ext.grid.Column#width initially configured width}</tt> of each column will be adjusted
+     * to fit the grid width and prevent horizontal scrolling. If columns are later resized (manually
+     * or programmatically), the other columns in the grid will <b>not</b> be resized to fit the grid width.
+     * See <tt>{@link #forceFit}</tt> also.
+     */
+    autoFill : false,
+
+    /**
+     * @cfg {Boolean} forceFit
+     * <p>Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * at <b>all times</b>.</p>
+     * <p>The {@link Ext.grid.Column#width initially configured width}</tt> of each
+     * column will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are
+     * later resized (manually or programmatically), the other columns in the grid <b>will</b> be resized
+     * to fit the grid width.</p>
+     * <p>Columns which are configured with <code>fixed: true</code> are omitted from being resized.</p>
+     * <p>See <tt>{@link #autoFill}</tt>.</p>
+     */
+    forceFit : false,
+
+    /**
+     * @cfg {Array} sortClasses The CSS classes applied to a header when it is sorted. (defaults to <tt>['sort-asc', 'sort-desc']</tt>)
+     */
+    sortClasses : ['sort-asc', 'sort-desc'],
+
+    /**
+     * @cfg {String} sortAscText The text displayed in the 'Sort Ascending' menu item (defaults to <tt>'Sort Ascending'</tt>)
+     */
+    sortAscText : 'Sort Ascending',
+
+    /**
+     * @cfg {String} sortDescText The text displayed in the 'Sort Descending' menu item (defaults to <tt>'Sort Descending'</tt>)
+     */
+    sortDescText : 'Sort Descending',
+
+    /**
+     * @cfg {String} columnsText The text displayed in the 'Columns' menu item (defaults to <tt>'Columns'</tt>)
+     */
+    columnsText : 'Columns',
+
+    /**
+     * @cfg {String} selectedRowClass The CSS class applied to a selected row (defaults to <tt>'x-grid3-row-selected'</tt>). An
+     * example overriding the default styling:
+    <pre><code>
+    .x-grid3-row-selected {background-color: yellow;}
+    </code></pre>
+     * Note that this only controls the row, and will not do anything for the text inside it.  To style inner
+     * facets (like text) use something like:
+    <pre><code>
+    .x-grid3-row-selected .x-grid3-cell-inner {
+        color: #FFCC00;
+    }
+    </code></pre>
+     * @type String
+     */
+    selectedRowClass : 'x-grid3-row-selected',
+
+    // private
+    borderWidth : 2,
+    tdClass : 'x-grid3-cell',
+    hdCls : 'x-grid3-hd',
+    
+    
+    /**
+     * @cfg {Boolean} markDirty True to show the dirty cell indicator when a cell has been modified. Defaults to <tt>true</tt>.
+     */
+    markDirty : true,
+
+    /**
+     * @cfg {Number} cellSelectorDepth The number of levels to search for cells in event delegation (defaults to <tt>4</tt>)
+     */
+    cellSelectorDepth : 4,
+    
+    /**
+     * @cfg {Number} rowSelectorDepth The number of levels to search for rows in event delegation (defaults to <tt>10</tt>)
+     */
+    rowSelectorDepth : 10,
+
+    /**
+     * @cfg {Number} rowBodySelectorDepth The number of levels to search for row bodies in event delegation (defaults to <tt>10</tt>)
+     */
+    rowBodySelectorDepth : 10,
+
+    /**
+     * @cfg {String} cellSelector The selector used to find cells internally (defaults to <tt>'td.x-grid3-cell'</tt>)
+     */
+    cellSelector : 'td.x-grid3-cell',
+    
+    /**
+     * @cfg {String} rowSelector The selector used to find rows internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowSelector : 'div.x-grid3-row',
+
+    /**
+     * @cfg {String} rowBodySelector The selector used to find row bodies internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowBodySelector : 'div.x-grid3-row-body',
+
+    // private
+    firstRowCls: 'x-grid3-row-first',
+    lastRowCls: 'x-grid3-row-last',
+    rowClsRe: /(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,
+    
+    /**
+     * @cfg {String} headerMenuOpenCls The CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open'
+     */
+    headerMenuOpenCls: 'x-grid3-hd-menu-open',
+    
+    /**
+     * @cfg {String} rowOverCls The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over'
+     */
+    rowOverCls: 'x-grid3-row-over',
+
+    constructor : function(config) {
+        Ext.apply(this, config);
+        
+        // These events are only used internally by the grid components
+        this.addEvents(
+            /**
+             * @event beforerowremoved
+             * Internal UI Event. Fired before a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row to be removed.
+             * @param {Ext.data.Record} record The Record to be removed
+             */
+            'beforerowremoved',
+            
+            /**
+             * @event beforerowsinserted
+             * Internal UI Event. Fired before rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first row to be inserted.
+             * @param {Number} lastRow The index of the last row to be inserted.
+             */
+            'beforerowsinserted',
+            
+            /**
+             * @event beforerefresh
+             * Internal UI Event. Fired before the view is refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'beforerefresh',
+            
+            /**
+             * @event rowremoved
+             * Internal UI Event. Fired after a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row that was removed.
+             * @param {Ext.data.Record} record The Record that was removed
+             */
+            'rowremoved',
+            
+            /**
+             * @event rowsinserted
+             * Internal UI Event. Fired after rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first inserted.
+             * @param {Number} lastRow The index of the last row inserted.
+             */
+            'rowsinserted',
+            
+            /**
+             * @event rowupdated
+             * Internal UI Event. Fired after a row has been updated.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the row updated.
+             * @param {Ext.data.record} record The Record backing the row updated.
+             */
+            'rowupdated',
+            
+            /**
+             * @event refresh
+             * Internal UI Event. Fired after the GridView's body has been refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'refresh'
+        );
+        
+        Ext.grid.GridView.superclass.constructor.call(this);
+    },
+
+    /* -------------------------------- UI Specific ----------------------------- */
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * The template to use when rendering headers. Has a default template
+     * @property headerTpl
+     * @type Ext.Template
+     */
+    headerTpl: new Ext.Template(
+        '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+            '<thead>',
+                '<tr class="x-grid3-hd-row">{cells}</tr>',
+            '</thead>',
+        '</table>'
+    ),
+    
+    /**
+     * The template to use when rendering the body. Has a default template
+     * @property bodyTpl
+     * @type Ext.Template
+     */
+    bodyTpl: new Ext.Template('{rows}'),
+    
+    /**
+     * The template to use to render each cell. Has a default template
+     * @property cellTpl
+     * @type Ext.Template
+     */
+    cellTpl: new Ext.Template(
+        '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>',
+            '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',
+        '</td>'
+    ),
+    
+    /**
+     * @private
+     * Provides default templates if they are not given for this particular instance. Most of the templates are defined on
+     * the prototype, the ones defined inside this function are done so because they are based on Grid or GridView configuration
+     */
+    initTemplates : function() {
+        var templates = this.templates || {},
+            template, name,
+            
+            headerCellTpl = new Ext.Template(
+                '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">',
+                    '<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '',
+                        '{value}',
+                        '<img alt="" class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />',
+                    '</div>',
+                '</td>'
+            ),
+        
+            rowBodyText = [
+                '<tr class="x-grid3-row-body-tr" style="{bodyStyle}">',
+                    '<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">',
+                        '<div class="x-grid3-row-body">{body}</div>',
+                    '</td>',
+                '</tr>'
+            ].join(""),
+        
+            innerText = [
+                '<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+                     '<tbody>',
+                        '<tr>{cells}</tr>',
+                        this.enableRowBody ? rowBodyText : '',
+                     '</tbody>',
+                '</table>'
+            ].join("");
+        
+        Ext.applyIf(templates, {
+            hcell   : headerCellTpl,
+            cell    : this.cellTpl,
+            body    : this.bodyTpl,
+            header  : this.headerTpl,
+            master  : this.masterTpl,
+            row     : new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">' + innerText + '</div>'),
+            rowInner: new Ext.Template(innerText)
+        });
+
+        for (name in templates) {
+            template = templates[name];
+            
+            if (template && Ext.isFunction(template.compile) && !template.compiled) {
+                template.disableFormats = true;
+                template.compile();
+            }
+        }
+
+        this.templates = templates;
+        this.colRe = new RegExp('x-grid3-td-([^\\s]+)', '');
+    },
+
+    /**
+     * @private
+     * Each GridView has its own private flyweight, accessed through this method
+     */
+    fly : function(el) {
+        if (!this._flyweight) {
+            this._flyweight = new Ext.Element.Flyweight(document.body);
+        }
+        this._flyweight.dom = el;
+        return this._flyweight;
+    },
+
+    // private
+    getEditorParent : function() {
+        return this.scroller.dom;
+    },
+
+    /**
+     * @private
+     * Finds and stores references to important elements
+     */
+    initElements : function() {
+        var Element  = Ext.Element,
+            el       = Ext.get(this.grid.getGridEl().dom.firstChild),
+            mainWrap = new Element(el.child('div.x-grid3-viewport')),
+            mainHd   = new Element(mainWrap.child('div.x-grid3-header')),
+            scroller = new Element(mainWrap.child('div.x-grid3-scroller'));
+        
+        if (this.grid.hideHeaders) {
+            mainHd.setDisplayed(false);
+        }
+        
+        if (this.forceFit) {
+            scroller.setStyle('overflow-x', 'hidden');
+        }
+        
+        /**
+         * <i>Read-only</i>. The GridView's body Element which encapsulates all rows in the Grid.
+         * This {@link Ext.Element Element} is only available after the GridPanel has been rendered.
+         * @type Ext.Element
+         * @property mainBody
+         */
+        
+        Ext.apply(this, {
+            el      : el,
+            mainWrap: mainWrap,
+            scroller: scroller,
+            mainHd  : mainHd,
+            innerHd : mainHd.child('div.x-grid3-header-inner').dom,
+            mainBody: new Element(Element.fly(scroller).child('div.x-grid3-body')),
+            focusEl : new Element(Element.fly(scroller).child('a')),
+            
+            resizeMarker: new Element(el.child('div.x-grid3-resize-marker')),
+            resizeProxy : new Element(el.child('div.x-grid3-resize-proxy'))
+        });
+        
+        this.focusEl.swallowEvent('click', true);
+    },
+
+    // private
+    getRows : function() {
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // finder methods, used with delegation
+
+    // private
+    findCell : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth);
+    },
+
+    /**
+     * <p>Return the index of the grid column which contains the passed HTMLElement.</p>
+     * See also {@link #findRowIndex}
+     * @param {HTMLElement} el The target element
+     * @return {Number} The column index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findCellIndex : function(el, requiredCls) {
+        var cell = this.findCell(el),
+            hasCls;
+        
+        if (cell) {
+            hasCls = this.fly(cell).hasClass(requiredCls);
+            if (!requiredCls || hasCls) {
+                return this.getCellIndex(cell);
+            }
+        }
+        return false;
+    },
+
+    // private
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe);
+            
+            if (match && match[1]) {
+                return this.cm.getIndexById(match[1]);
+            }
+        }
+        return false;
+    },
+
+    // private
+    findHeaderCell : function(el) {
+        var cell = this.findCell(el);
+        return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null;
+    },
+
+    // private
+    findHeaderIndex : function(el){
+        return this.findCellIndex(el, this.hdCls);
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row element, or null if the target element is not within a row of this GridView.
+     */
+    findRow : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth);
+    },
+
+    /**
+     * Return the index of the grid row which contains the passed HTMLElement.
+     * See also {@link #findCellIndex}
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {Number} The row index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findRowIndex : function(el) {
+        var row = this.findRow(el);
+        return row ? row.rowIndex : false;
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row body which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row body element, or null if the target element is not within a row body of this GridView.
+     */
+    findRowBody : function(el) {
+        if (!el) {
+            return false;
+        }
+        
+        return this.fly(el).findParent(this.rowBodySelector, this.rowBodySelectorDepth);
+    },
+
+    // getter methods for fetching elements dynamically in the grid
+
+    /**
+     * Return the <tt>&lt;div></tt> HtmlElement which represents a Grid row for the specified index.
+     * @param {Number} index The row index
+     * @return {HtmlElement} The div element.
+     */
+    getRow : function(row) {
+        return this.getRows()[row];
+    },
+
+    /**
+     * Returns the grid's <tt>&lt;td></tt> HtmlElement at the specified coordinates.
+     * @param {Number} row The row index in which to find the cell.
+     * @param {Number} col The column index of the cell.
+     * @return {HtmlElement} The td at the specified coordinates.
+     */
+    getCell : function(row, col) {
+        return Ext.fly(this.getRow(row)).query(this.cellSelector)[col]; 
+    },
+
+    /**
+     * Return the <tt>&lt;td></tt> HtmlElement which represents the Grid's header cell for the specified column index.
+     * @param {Number} index The column index
+     * @return {HtmlElement} The td element.
+     */
+    getHeaderCell : function(index) {
+        return this.mainHd.dom.getElementsByTagName('td')[index];
+    },
+
+    // manipulating elements
+
+    // private - use getRowClass to apply custom row classes
+    addRowClass : function(rowId, cls) {
+        var row = this.getRow(rowId);
+        if (row) {
+            this.fly(row).addClass(cls);
+        }
+    },
+
+    // private
+    removeRowClass : function(row, cls) {
+        var r = this.getRow(row);
+        if(r){
+            this.fly(r).removeClass(cls);
+        }
+    },
+
+    // private
+    removeRow : function(row) {
+        Ext.removeNode(this.getRow(row));
+        this.syncFocusEl(row);
+    },
+
+    // private
+    removeRows : function(firstRow, lastRow) {
+        var bd = this.mainBody.dom,
+            rowIndex;
+            
+        for (rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            Ext.removeNode(bd.childNodes[firstRow]);
+        }
+        
+        this.syncFocusEl(firstRow);
+    },
+
+    /* ----------------------------------- Scrolling functions -------------------------------------------*/
+    
+    // private
+    getScrollState : function() {
+        var sb = this.scroller.dom;
+        
+        return {
+            left: sb.scrollLeft, 
+            top : sb.scrollTop
+        };
+    },
+
+    // private
+    restoreScroll : function(state) {
+        var sb = this.scroller.dom;
+        sb.scrollLeft = state.left;
+        sb.scrollTop  = state.top;
+    },
+
+    /**
+     * Scrolls the grid to the top
+     */
+    scrollToTop : function() {
+        var dom = this.scroller.dom;
+        
+        dom.scrollTop  = 0;
+        dom.scrollLeft = 0;
+    },
+
+    // private
+    syncScroll : function() {
+        this.syncHeaderScroll();
+        var mb = this.scroller.dom;
+        this.grid.fireEvent('bodyscroll', mb.scrollLeft, mb.scrollTop);
+    },
+
+    // private
+    syncHeaderScroll : function() {
+        var innerHd    = this.innerHd,
+            scrollLeft = this.scroller.dom.scrollLeft;
+        
+        innerHd.scrollLeft = scrollLeft;
+        innerHd.scrollLeft = scrollLeft; // second time for IE (1/2 time first fails, other browsers ignore)
+    },
+    
+    /**
+     * @private
+     * Ensures the given column has the given icon class
+     */
+    updateSortIcon : function(col, dir) {
+        var sortClasses = this.sortClasses,
+            sortClass   = sortClasses[dir == "DESC" ? 1 : 0],
+            headers     = this.mainHd.select('td').removeClass(sortClasses);
+        
+        headers.item(col).addClass(sortClass);
+    },
+
+    /**
+     * @private
+     * Updates the size of every column and cell in the grid
+     */
+    updateAllColumnWidths : function() {
+        var totalWidth = this.getTotalWidth(),
+            colCount   = this.cm.getColumnCount(),
+            rows       = this.getRows(),
+            rowCount   = rows.length,
+            widths     = [],
+            row, rowFirstChild, trow, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            widths[i] = this.getColumnWidth(i);
+            this.getHeaderCell(i).style.width = widths[i];
+        }
+        
+        this.updateHeaderWidth();
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                trow = rowFirstChild.rows[0];
+                
+                for (j = 0; j < colCount; j++) {
+                    trow.childNodes[j].style.width = widths[j];
+                }
+            }
+        }
+        
+        this.onAllColumnWidthsUpdated(widths, totalWidth);
+    },
+
+    /**
+     * @private
+     * Called after a column's width has been updated, this resizes all of the cells for that column in each row
+     * @param {Number} column The column index
+     */
+    updateColumnWidth : function(column, width) {
+        var columnWidth = this.getColumnWidth(column),
+            totalWidth  = this.getTotalWidth(),
+            headerCell  = this.getHeaderCell(column),
+            nodes       = this.getRows(),
+            nodeCount   = nodes.length,
+            row, i, firstChild;
+        
+        this.updateHeaderWidth();
+        headerCell.style.width = columnWidth;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            firstChild = row.firstChild;
+            
+            row.style.width = totalWidth;
+            if (firstChild) {
+                firstChild.style.width = totalWidth;
+                firstChild.rows[0].childNodes[column].style.width = columnWidth;
+            }
+        }
+        
+        this.onColumnWidthUpdated(column, columnWidth, totalWidth);
+    },
+    
+    /**
+     * @private
+     * Sets the hidden status of a given column.
+     * @param {Number} col The column index
+     * @param {Boolean} hidden True to make the column hidden
+     */
+    updateColumnHidden : function(col, hidden) {
+        var totalWidth = this.getTotalWidth(),
+            display    = hidden ? 'none' : '',
+            headerCell = this.getHeaderCell(col),
+            nodes      = this.getRows(),
+            nodeCount  = nodes.length,
+            row, rowFirstChild, i;
+        
+        this.updateHeaderWidth();
+        headerCell.style.display = display;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                rowFirstChild.rows[0].childNodes[col].style.display = display;
+            }
+        }
+        
+        this.onColumnHiddenUpdated(col, hidden, totalWidth);
+        delete this.lastViewWidth; //recalc
+        this.layout();
+    },
+
+    /**
+     * @private
+     * Renders all of the rows to a string buffer and returns the string. This is called internally
+     * by renderRows and performs the actual string building for the rows - it does not inject HTML into the DOM.
+     * @param {Array} columns The column data acquired from getColumnData.
+     * @param {Array} records The array of records to render
+     * @param {Ext.data.Store} store The store to render the rows from
+     * @param {Number} startRow The index of the first row being rendered. Sometimes we only render a subset of
+     * the rows so this is used to maintain logic for striping etc
+     * @param {Number} colCount The total number of columns in the column model
+     * @param {Boolean} stripe True to stripe the rows
+     * @return {String} A string containing the HTML for the rendered rows
+     */
+    doRender : function(columns, records, store, startRow, colCount, stripe) {
+        var templates = this.templates,
+            cellTemplate = templates.cell,
+            rowTemplate = templates.row,
+            last = colCount - 1,
+            tstyle = 'width:' + this.getTotalWidth() + ';',
+            // buffers
+            rowBuffer = [],
+            colBuffer = [],
+            rowParams = {tstyle: tstyle},
+            meta = {},
+            len  = records.length,
+            alt,
+            column,
+            record, i, j, rowIndex;
+
+        //build up each row's HTML
+        for (j = 0; j < len; j++) {
+            record    = records[j];
+            colBuffer = [];
+
+            rowIndex = j + startRow;
+
+            //build up each column's HTML
+            for (i = 0; i < colCount; i++) {
+                column = columns[i];
+                
+                meta.id    = column.id;
+                meta.css   = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.style = column.style;
+                meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+
+                if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                    meta.css += ' x-grid3-dirty-cell';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+
+            alt = [];
+            //set up row striping and row dirtiness CSS classes
+            if (stripe && ((rowIndex + 1) % 2 === 0)) {
+                alt[0] = 'x-grid3-row-alt';
+            }
+
+            if (record.dirty) {
+                alt[1] = ' x-grid3-dirty-row';
+            }
+
+            rowParams.cols = colCount;
+
+            if (this.getRowClass) {
+                alt[2] = this.getRowClass(record, rowIndex, rowParams, store);
+            }
+
+            rowParams.alt   = alt.join(' ');
+            rowParams.cells = colBuffer.join('');
+
+            rowBuffer[rowBuffer.length] = rowTemplate.apply(rowParams);
+        }
+
+        return rowBuffer.join('');
+    },
+
+    /**
+     * @private
+     * Adds CSS classes and rowIndex to each row
+     * @param {Number} startRow The row to start from (defaults to 0)
+     */
+    processRows : function(startRow, skipStripe) {
+        if (!this.ds || this.ds.getCount() < 1) {
+            return;
+        }
+
+        var rows   = this.getRows(),
+            length = rows.length,
+            row, i;
+
+        skipStripe = skipStripe || !this.grid.stripeRows;
+        startRow   = startRow   || 0;
+
+        for (i = 0; i < length; i++) {
+            row = rows[i];
+            if (row) {
+                row.rowIndex = i;
+                if (!skipStripe) {
+                    row.className = row.className.replace(this.rowClsRe, ' ');
+                    if ((i + 1) % 2 === 0){
+                        row.className += ' x-grid3-row-alt';
+                    }
+                }
+            }
+        }
+
+        // add first/last-row classes
+        if (startRow === 0) {
+            Ext.fly(rows[0]).addClass(this.firstRowCls);
+        }
+
+        Ext.fly(rows[length - 1]).addClass(this.lastRowCls);
+    },
+    
+    /**
+     * @private
+     */
+    afterRender : function() {
+        if (!this.ds || !this.cm) {
+            return;
+        }
+        
+        this.mainBody.dom.innerHTML = this.renderBody() || '&#160;';
+        this.processRows(0, true);
+
+        if (this.deferEmptyText !== true) {
+            this.applyEmptyText();
+        }
+        
+        this.grid.fireEvent('viewready', this.grid);
+    },
+    
+    /**
+     * @private
+     * This is always intended to be called after renderUI. Sets up listeners on the UI elements
+     * and sets up options like column menus, moving and resizing.
+     */
+    afterRenderUI: function() {
+        var grid = this.grid;
+        
+        this.initElements();
+
+        // get mousedowns early
+        Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
+
+        this.mainHd.on({
+            scope    : this,
+            mouseover: this.handleHdOver,
+            mouseout : this.handleHdOut,
+            mousemove: this.handleHdMove
+        });
+
+        this.scroller.on('scroll', this.syncScroll,  this);
+        
+        if (grid.enableColumnResize !== false) {
+            this.splitZone = new Ext.grid.GridView.SplitDragZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableColumnMove) {
+            this.columnDrag = new Ext.grid.GridView.ColumnDragZone(grid, this.innerHd);
+            this.columnDrop = new Ext.grid.HeaderDropZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableHdMenu !== false) {
+            this.hmenu = new Ext.menu.Menu({id: grid.id + '-hctx'});
+            this.hmenu.add(
+                {itemId:'asc',  text: this.sortAscText,  cls: 'xg-hmenu-sort-asc'},
+                {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
+            );
+
+            if (grid.enableColumnHide !== false) {
+                this.colMenu = new Ext.menu.Menu({id:grid.id + '-hcols-menu'});
+                this.colMenu.on({
+                    scope     : this,
+                    beforeshow: this.beforeColMenuShow,
+                    itemclick : this.handleHdMenuClick
+                });
+                this.hmenu.add('-', {
+                    itemId:'columns',
+                    hideOnClick: false,
+                    text: this.columnsText,
+                    menu: this.colMenu,
+                    iconCls: 'x-cols-icon'
+                });
+            }
+
+            this.hmenu.on('itemclick', this.handleHdMenuClick, this);
+        }
+
+        if (grid.trackMouseOver) {
+            this.mainBody.on({
+                scope    : this,
+                mouseover: this.onRowOver,
+                mouseout : this.onRowOut
+            });
+        }
+
+        if (grid.enableDragDrop || grid.enableDrag) {
+            this.dragZone = new Ext.grid.GridDragZone(grid, {
+                ddGroup : grid.ddGroup || 'GridDD'
+            });
+        }
+
+        this.updateHeaderSortState();
+    },
+
+    /**
+     * @private
+     * Renders each of the UI elements in turn. This is called internally, once, by this.render. It does not
+     * render rows from the store, just the surrounding UI elements.
+     */
+    renderUI : function() {
+        var templates = this.templates;
+
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            header: this.renderHeaders(),
+            ostyle: 'width:' + this.getOffsetWidth() + ';',
+            bstyle: 'width:' + this.getTotalWidth()  + ';'
+        });
+    },
+
+    // private
+    processEvent : function(name, e) {
+        var target = e.getTarget(),
+            grid   = this.grid,
+            header = this.findHeaderIndex(target),
+            row, cell, col, body;
+
+        grid.fireEvent(name, e);
+
+        if (header !== false) {
+            grid.fireEvent('header' + name, grid, header, e);
+        } else {
+            row = this.findRowIndex(target);
+
+//          Grid's value-added events must bubble correctly to allow cancelling via returning false: cell->column->row
+//          We must allow a return of false at any of these levels to cancel the event processing.
+//          Particularly allowing rowmousedown to be cancellable by prior handlers which need to prevent selection.
+            if (row !== false) {
+                cell = this.findCellIndex(target);
+                if (cell !== false) {
+                    col = grid.colModel.getColumnAt(cell);
+                    if (grid.fireEvent('cell' + name, grid, row, cell, e) !== false) {
+                        if (!col || (col.processEvent && (col.processEvent(name, e, grid, row, cell) !== false))) {
+                            grid.fireEvent('row' + name, grid, row, e);
+                        }
+                    }
+                } else {
+                    if (grid.fireEvent('row' + name, grid, row, e) !== false) {
+                        (body = this.findRowBody(target)) && grid.fireEvent('rowbody' + name, grid, row, e);
+                    }
+                }
+            } else {
+                grid.fireEvent('container' + name, grid, e);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Sizes the grid's header and body elements
+     */
+    layout : function(initial) {
+        if (!this.mainBody) {
+            return; // not rendered
+        }
+
+        var grid       = this.grid,
+            gridEl     = grid.getGridEl(),
+            gridSize   = gridEl.getSize(true),
+            gridWidth  = gridSize.width,
+            gridHeight = gridSize.height,
+            scroller   = this.scroller,
+            scrollStyle, headerHeight, scrollHeight;
+        
+        if (gridWidth < 20 || gridHeight < 20) {
+            return;
+        }
+        
+        if (grid.autoHeight) {
+            scrollStyle = scroller.dom.style;
+            scrollStyle.overflow = 'visible';
+            
+            if (Ext.isWebKit) {
+                scrollStyle.position = 'static';
+            }
+        } else {
+            this.el.setSize(gridWidth, gridHeight);
+            
+            headerHeight = this.mainHd.getHeight();
+            scrollHeight = gridHeight - headerHeight;
+            
+            scroller.setSize(gridWidth, scrollHeight);
+            
+            if (this.innerHd) {
+                this.innerHd.style.width = (gridWidth) + "px";
+            }
+        }
+        
+        if (this.forceFit || (initial === true && this.autoFill)) {
+            if (this.lastViewWidth != gridWidth) {
+                this.fitColumns(false, false);
+                this.lastViewWidth = gridWidth;
+            }
+        } else {
+            this.autoExpand();
+            this.syncHeaderScroll();
+        }
+        
+        this.onLayout(gridWidth, scrollHeight);
+    },
+
+    // template functions for subclasses and plugins
+    // these functions include precalculated values
+    onLayout : function(vw, vh) {
+        // do nothing
+    },
+
+    onColumnWidthUpdated : function(col, w, tw) {
+        //template method
+    },
+
+    onAllColumnWidthsUpdated : function(ws, tw) {
+        //template method
+    },
+
+    onColumnHiddenUpdated : function(col, hidden, tw) {
+        // template method
+    },
+
+    updateColumnText : function(col, text) {
+        // template method
+    },
+
+    afterMove : function(colIndex) {
+        // template method
+    },
+
+    /* ----------------------------------- Core Specific -------------------------------------------*/
+    // private
+    init : function(grid) {
+        this.grid = grid;
+
+        this.initTemplates();
+        this.initData(grid.store, grid.colModel);
+        this.initUI(grid);
+    },
+
+    // private
+    getColumnId : function(index){
+        return this.cm.getColumnId(index);
+    },
+
+    // private
+    getOffsetWidth : function() {
+        return (this.cm.getTotalWidth() + this.getScrollOffset()) + 'px';
+    },
+
+    // private
+    getScrollOffset: function() {
+        return Ext.num(this.scrollOffset, Ext.getScrollBarWidth());
+    },
+
+    /**
+     * @private
+     * Renders the header row using the 'header' template. Does not inject the HTML into the DOM, just
+     * returns a string.
+     * @return {String} Rendered header row
+     */
+    renderHeaders : function() {
+        var colModel   = this.cm,
+            templates  = this.templates,
+            headerTpl  = templates.hcell,
+            properties = {},
+            colCount   = colModel.getColumnCount(),
+            last       = colCount - 1,
+            cells      = [],
+            i, cssCls;
+        
+        for (i = 0; i < colCount; i++) {
+            if (i == 0) {
+                cssCls = 'x-grid3-cell-first ';
+            } else {
+                cssCls = i == last ? 'x-grid3-cell-last ' : '';
+            }
+            
+            properties = {
+                id     : colModel.getColumnId(i),
+                value  : colModel.getColumnHeader(i) || '',
+                style  : this.getColumnStyle(i, true),
+                css    : cssCls,
+                tooltip: this.getColumnTooltip(i)
+            };
+            
+            if (colModel.config[i].align == 'right') {
+                properties.istyle = 'padding-right: 16px;';
+            } else {
+                delete properties.istyle;
+            }
+            
+            cells[i] = headerTpl.apply(properties);
+        }
+        
+        return templates.header.apply({
+            cells : cells.join(""),
+            tstyle: String.format("width: {0};", this.getTotalWidth())
+        });
+    },
+
+    /**
+     * @private
+     */
+    getColumnTooltip : function(i) {
+        var tooltip = this.cm.getColumnTooltip(i);
+        if (tooltip) {
+            if (Ext.QuickTips.isEnabled()) {
+                return 'ext:qtip="' + tooltip + '"';
+            } else {
+                return 'title="' + tooltip + '"';
+            }
+        }
+        
+        return '';
+    },
+
+    // private
+    beforeUpdate : function() {
+        this.grid.stopEditing(true);
+    },
+
+    /**
+     * @private
+     * Re-renders the headers and ensures they are sized correctly
+     */
+    updateHeaders : function() {
+        this.innerHd.firstChild.innerHTML = this.renderHeaders();
+        
+        this.updateHeaderWidth(false);
+    },
+    
+    /**
+     * @private
+     * Ensures that the header is sized to the total width available to it
+     * @param {Boolean} updateMain True to update the mainBody's width also (defaults to true)
+     */
+    updateHeaderWidth: function(updateMain) {
+        var innerHdChild = this.innerHd.firstChild,
+            totalWidth   = this.getTotalWidth();
+        
+        innerHdChild.style.width = this.getOffsetWidth();
+        innerHdChild.firstChild.style.width = totalWidth;
+        
+        if (updateMain !== false) {
+            this.mainBody.dom.style.width = totalWidth;
+        }
+    },
+
+    /**
+     * Focuses the specified row.
+     * @param {Number} row The row index
+     */
+    focusRow : function(row) {
+        this.focusCell(row, 0, false);
+    },
+
+    /**
+     * Focuses the specified cell.
+     * @param {Number} row The row index
+     * @param {Number} col The column index
+     */
+    focusCell : function(row, col, hscroll) {
+        this.syncFocusEl(this.ensureVisible(row, col, hscroll));
+        
+        var focusEl = this.focusEl;
+        
+        if (Ext.isGecko) {
+            focusEl.focus();
+        } else {
+            focusEl.focus.defer(1, focusEl);
+        }
+    },
+
+    /**
+     * @private
+     * Finds the Elements corresponding to the given row and column indexes
+     */
+    resolveCell : function(row, col, hscroll) {
+        if (!Ext.isNumber(row)) {
+            row = row.rowIndex;
+        }
+        
+        if (!this.ds) {
+            return null;
+        }
+        
+        if (row < 0 || row >= this.ds.getCount()) {
+            return null;
+        }
+        col = (col !== undefined ? col : 0);
+
+        var rowEl    = this.getRow(row),
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            cellEl;
+            
+        if (!(hscroll === false && col === 0)) {
+            while (col < colCount && colModel.isHidden(col)) {
+                col++;
+            }
+            
+            cellEl = this.getCell(row, col);
+        }
+
+        return {row: rowEl, cell: cellEl};
+    },
+
+    /**
+     * @private
+     * Returns the XY co-ordinates of a given row/cell resolution (see {@link #resolveCell})
+     * @return {Array} X and Y coords
+     */
+    getResolvedXY : function(resolved) {
+        if (!resolved) {
+            return null;
+        }
+        
+        var cell = resolved.cell,
+            row  = resolved.row;
+        
+        if (cell) {
+            return Ext.fly(cell).getXY();
+        } else {
+            return [this.el.getX(), Ext.fly(row).getY()];
+        }
+    },
+
+    /**
+     * @private
+     * Moves the focus element to the x and y co-ordinates of the given row and column
+     */
+    syncFocusEl : function(row, col, hscroll) {
+        var xy = row;
+        
+        if (!Ext.isArray(xy)) {
+            row = Math.min(row, Math.max(0, this.getRows().length-1));
+            
+            if (isNaN(row)) {
+                return;
+            }
+            
+            xy = this.getResolvedXY(this.resolveCell(row, col, hscroll));
+        }
+        
+        this.focusEl.setXY(xy || this.scroller.getXY());
+    },
+
+    /**
+     * @private
+     */
+    ensureVisible : function(row, col, hscroll) {
+        var resolved = this.resolveCell(row, col, hscroll);
+        
+        if (!resolved || !resolved.row) {
+            return null;
+        }
+
+        var rowEl  = resolved.row,
+            cellEl = resolved.cell,
+            c = this.scroller.dom,
+            p = rowEl,
+            ctop = 0,
+            stop = this.el.dom;
+
+        while (p && p != stop) {
+            ctop += p.offsetTop;
+            p = p.offsetParent;
+        }
+
+        ctop -= this.mainHd.dom.offsetHeight;
+        stop = parseInt(c.scrollTop, 10);
+
+        var cbot = ctop + rowEl.offsetHeight,
+            ch = c.clientHeight,
+            sbot = stop + ch;
+
+
+        if (ctop < stop) {
+          c.scrollTop = ctop;
+        } else if(cbot > sbot) {
+            c.scrollTop = cbot-ch;
+        }
+
+        if (hscroll !== false) {
+            var cleft  = parseInt(cellEl.offsetLeft, 10),
+                cright = cleft + cellEl.offsetWidth,
+                sleft  = parseInt(c.scrollLeft, 10),
+                sright = sleft + c.clientWidth;
+                
+            if (cleft < sleft) {
+                c.scrollLeft = cleft;
+            } else if(cright > sright) {
+                c.scrollLeft = cright-c.clientWidth;
+            }
+        }
+        
+        return this.getResolvedXY(resolved);
+    },
+
+    // private
+    insertRows : function(dm, firstRow, lastRow, isUpdate) {
+        var last = dm.getCount() - 1;
+        if( !isUpdate && firstRow === 0 && lastRow >= last) {
+            this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+                this.refresh();
+            this.fireEvent('rowsinserted', this, firstRow, lastRow);
+        } else {
+            if (!isUpdate) {
+                this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+            }
+            var html = this.renderRows(firstRow, lastRow),
+                before = this.getRow(firstRow);
+            if (before) {
+                if(firstRow === 0){
+                    Ext.fly(this.getRow(0)).removeClass(this.firstRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeBegin', before, html);
+            } else {
+                var r = this.getRow(last - 1);
+                if(r){
+                    Ext.fly(r).removeClass(this.lastRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html);
+            }
+            if (!isUpdate) {
+                this.processRows(firstRow);
+                this.fireEvent('rowsinserted', this, firstRow, lastRow);
+            } else if (firstRow === 0 || firstRow >= last) {
+                //ensure first/last row is kept after an update.
+                Ext.fly(this.getRow(firstRow)).addClass(firstRow === 0 ? this.firstRowCls : this.lastRowCls);
+            }
+        }
+        this.syncFocusEl(firstRow);
+    },
+
+    /**
+     * @private
+     * DEPRECATED - this doesn't appear to be called anywhere in the library, remove in 4.0. 
+     */
+    deleteRows : function(dm, firstRow, lastRow) {
+        if (dm.getRowCount() < 1) {
+            this.refresh();
+        } else {
+            this.fireEvent('beforerowsdeleted', this, firstRow, lastRow);
+
+            this.removeRows(firstRow, lastRow);
+
+            this.processRows(firstRow);
+            this.fireEvent('rowsdeleted', this, firstRow, lastRow);
+        }
+    },
+
+    /**
+     * @private
+     * Builds a CSS string for the given column index
+     * @param {Number} colIndex The column index
+     * @param {Boolean} isHeader True if getting the style for the column's header
+     * @return {String} The CSS string
+     */
+    getColumnStyle : function(colIndex, isHeader) {
+        var colModel  = this.cm,
+            colConfig = colModel.config,
+            style     = isHeader ? '' : colConfig[colIndex].css || '',
+            align     = colConfig[colIndex].align;
+        
+        style += String.format("width: {0};", this.getColumnWidth(colIndex));
+        
+        if (colModel.isHidden(colIndex)) {
+            style += 'display: none; ';
+        }
+        
+        if (align) {
+            style += String.format("text-align: {0};", align);
+        }
+        
+        return style;
+    },
+
+    /**
+     * @private
+     * Returns the width of a given column minus its border width
+     * @return {Number} The column index
+     * @return {String|Number} The width in pixels
+     */
+    getColumnWidth : function(column) {
+        var columnWidth = this.cm.getColumnWidth(column),
+            borderWidth = this.borderWidth;
+        
+        if (Ext.isNumber(columnWidth)) {
+            if (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2)) {
+                return columnWidth + "px";
+            } else {
+                return Math.max(columnWidth - borderWidth, 0) + "px";
+            }
+        } else {
+            return columnWidth;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the total width of all visible columns
+     * @return {String} 
+     */
+    getTotalWidth : function() {
+        return this.cm.getTotalWidth() + 'px';
+    },
+
+    /**
+     * @private
+     * Resizes each column to fit the available grid width.
+     * TODO: The second argument isn't even used, remove it in 4.0
+     * @param {Boolean} preventRefresh True to prevent resizing of each row to the new column sizes (defaults to false)
+     * @param {null} onlyExpand NOT USED, will be removed in 4.0
+     * @param {Number} omitColumn The index of a column to leave at its current width. Defaults to undefined
+     * @return {Boolean} True if the operation succeeded, false if not or undefined if the grid view is not yet initialized
+     */
+    fitColumns : function(preventRefresh, onlyExpand, omitColumn) {
+        var grid          = this.grid,
+            colModel      = this.cm,
+            totalColWidth = colModel.getTotalWidth(false),
+            gridWidth     = this.getGridInnerWidth(),
+            extraWidth    = gridWidth - totalColWidth,
+            columns       = [],
+            extraCol      = 0,
+            width         = 0,
+            colWidth, fraction, i;
+        
+        // not initialized, so don't screw up the default widths
+        if (gridWidth < 20 || extraWidth === 0) {
+            return false;
+        }
+        
+        var visibleColCount = colModel.getColumnCount(true),
+            totalColCount   = colModel.getColumnCount(false),
+            adjCount        = visibleColCount - (Ext.isNumber(omitColumn) ? 1 : 0);
+        
+        if (adjCount === 0) {
+            adjCount = 1;
+            omitColumn = undefined;
+        }
+        
+        //FIXME: the algorithm used here is odd and potentially confusing. Includes this for loop and the while after it.
+        for (i = 0; i < totalColCount; i++) {
+            if (!colModel.isFixed(i) && i !== omitColumn) {
+                colWidth = colModel.getColumnWidth(i);
+                columns.push(i, colWidth);
+                
+                if (!colModel.isHidden(i)) {
+                    extraCol = i;
+                    width += colWidth;
+                }
+            }
+        }
+        
+        fraction = (gridWidth - colModel.getTotalWidth()) / width;
+        
+        while (columns.length) {
+            colWidth = columns.pop();
+            i        = columns.pop();
+            
+            colModel.setColumnWidth(i, Math.max(grid.minColumnWidth, Math.floor(colWidth + colWidth * fraction)), true);
+        }
+        
+        //this has been changed above so remeasure now
+        totalColWidth = colModel.getTotalWidth(false);
+        
+        if (totalColWidth > gridWidth) {
+            var adjustCol = (adjCount == visibleColCount) ? extraCol : omitColumn,
+                newWidth  = Math.max(1, colModel.getColumnWidth(adjustCol) - (totalColWidth - gridWidth));
+            
+            colModel.setColumnWidth(adjustCol, newWidth, true);
+        }
+        
+        if (preventRefresh !== true) {
+            this.updateAllColumnWidths();
+        }
+        
+        return true;
+    },
+
+    /**
+     * @private
+     * Resizes the configured autoExpandColumn to take the available width after the other columns have 
+     * been accounted for
+     * @param {Boolean} preventUpdate True to prevent the resizing of all rows (defaults to false)
+     */
+    autoExpand : function(preventUpdate) {
+        var grid             = this.grid,
+            colModel         = this.cm,
+            gridWidth        = this.getGridInnerWidth(),
+            totalColumnWidth = colModel.getTotalWidth(false),
+            autoExpandColumn = grid.autoExpandColumn;
+        
+        if (!this.userResized && autoExpandColumn) {
+            if (gridWidth != totalColumnWidth) {
+                //if we are not already using all available width, resize the autoExpandColumn
+                var colIndex     = colModel.getIndexById(autoExpandColumn),
+                    currentWidth = colModel.getColumnWidth(colIndex),
+                    desiredWidth = gridWidth - totalColumnWidth + currentWidth,
+                    newWidth     = Math.min(Math.max(desiredWidth, grid.autoExpandMin), grid.autoExpandMax);
+                
+                if (currentWidth != newWidth) {
+                    colModel.setColumnWidth(colIndex, newWidth, true);
+                    
+                    if (preventUpdate !== true) {
+                        this.updateColumnWidth(colIndex, newWidth);
+                    }
+                }
+            }
+        }
+    },
+    
+    /**
+     * Returns the total internal width available to the grid, taking the scrollbar into account
+     * @return {Number} The total width
+     */
+    getGridInnerWidth: function() {
+        return this.grid.getGridEl().getWidth(true) - this.getScrollOffset();
+    },
+
+    /**
+     * @private
+     * Returns an array of column configurations - one for each column
+     * @return {Array} Array of column config objects. This includes the column name, renderer, id style and renderer
+     */
+    getColumnData : function() {
+        var columns  = [],
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            fields   = this.ds.fields,
+            i, name;
+        
+        for (i = 0; i < colCount; i++) {
+            name = colModel.getDataIndex(i);
+            
+            columns[i] = {
+                name    : Ext.isDefined(name) ? name : (fields.get(i) ? fields.get(i).name : undefined),
+                renderer: colModel.getRenderer(i),
+                scope   : colModel.getRendererScope(i),
+                id      : colModel.getColumnId(i),
+                style   : this.getColumnStyle(i)
+            };
+        }
+        
+        return columns;
+    },
+
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid     = this.grid,
+            store    = grid.store,
+            stripe   = grid.stripeRows,
+            colModel = grid.colModel,
+            colCount = colModel.getColumnCount(),
+            rowCount = store.getCount(),
+            records;
+        
+        if (rowCount < 1) {
+            return '';
+        }
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        records  = store.getRange(startRow, endRow);
+        
+        return this.doRender(this.getColumnData(), records, store, startRow, colCount, stripe);
+    },
+
+    // private
+    renderBody : function(){
+        var markup = this.renderRows() || '&#160;';
+        return this.templates.body.apply({rows: markup});
+    },
+
+    /**
+     * @private
+     * Refreshes a row by re-rendering it. Fires the rowupdated event when done
+     */
+    refreshRow: function(record) {
+        var store     = this.ds,
+            colCount  = this.cm.getColumnCount(),
+            columns   = this.getColumnData(),
+            last      = colCount - 1,
+            cls       = ['x-grid3-row'],
+            rowParams = {
+                tstyle: String.format("width: {0};", this.getTotalWidth())
+            },
+            colBuffer = [],
+            cellTpl   = this.templates.cell,
+            rowIndex, row, column, meta, css, i;
+        
+        if (Ext.isNumber(record)) {
+            rowIndex = record;
+            record   = store.getAt(rowIndex);
+        } else {
+            rowIndex = store.indexOf(record);
+        }
+        
+        //the record could not be found
+        if (!record || rowIndex < 0) {
+            return;
+        }
+        
+        //builds each column in this row
+        for (i = 0; i < colCount; i++) {
+            column = columns[i];
+            
+            if (i == 0) {
+                css = 'x-grid3-cell-first';
+            } else {
+                css = (i == last) ? 'x-grid3-cell-last ' : '';
+            }
+            
+            meta = {
+                id      : column.id,
+                style   : column.style,
+                css     : css,
+                attr    : "",
+                cellAttr: ""
+            };
+            // Need to set this after, because we pass meta to the renderer
+            meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+            
+            if (Ext.isEmpty(meta.value)) {
+                meta.value = '&#160;';
+            }
+            
+            if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                meta.css += ' x-grid3-dirty-cell';
+            }
+            
+            colBuffer[i] = cellTpl.apply(meta);
+        }
+        
+        row = this.getRow(rowIndex);
+        row.className = '';
+        
+        if (this.grid.stripeRows && ((rowIndex + 1) % 2 === 0)) {
+            cls.push('x-grid3-row-alt');
+        }
+        
+        if (this.getRowClass) {
+            rowParams.cols = colCount;
+            cls.push(this.getRowClass(record, rowIndex, rowParams, store));
+        }
+        
+        this.fly(row).addClass(cls).setStyle(rowParams.tstyle);
+        rowParams.cells = colBuffer.join("");
+        row.innerHTML = this.templates.rowInner.apply(rowParams);
+        
+        this.fireEvent('rowupdated', this, rowIndex, record);
+    },
+
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getTotalWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+
+    /**
+     * @private
+     * Displays the configured emptyText if there are currently no rows to display
+     */
+    applyEmptyText : function() {
+        if (this.emptyText && !this.hasRows()) {
+            this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
+        }
+    },
+
+    /**
+     * @private
+     * Adds sorting classes to the column headers based on the bound store's sortInfo. Fires the 'sortchange' event
+     * if the sorting has changed since this function was last run.
+     */
+    updateHeaderSortState : function() {
+        var state = this.ds.getSortState();
+        if (!state) {
+            return;
+        }
+
+        if (!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)) {
+            this.grid.fireEvent('sortchange', this.grid, state);
+        }
+
+        this.sortState = state;
+
+        var sortColumn = this.cm.findColumnIndex(state.field);
+        if (sortColumn != -1) {
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    /**
+     * @private
+     * Removes any sorting indicator classes from the column headers
+     */
+    clearHeaderSortState : function() {
+        if (!this.sortState) {
+            return;
+        }
+        this.grid.fireEvent('sortchange', this.grid, null);
+        this.mainHd.select('td').removeClass(this.sortClasses);
+        delete this.sortState;
+    },
+
+    /**
+     * @private
+     * Destroys all objects associated with the GridView
+     */
+    destroy : function() {
+        var me              = this,
+            grid            = me.grid,
+            gridEl          = grid.getGridEl(),
+            dragZone        = me.dragZone,
+            splitZone       = me.splitZone,
+            columnDrag      = me.columnDrag,
+            columnDrop      = me.columnDrop,
+            scrollToTopTask = me.scrollToTopTask,
+            columnDragData,
+            columnDragProxy;
+        
+        if (scrollToTopTask && scrollToTopTask.cancel) {
+            scrollToTopTask.cancel();
+        }
+        
+        Ext.destroyMembers(me, 'colMenu', 'hmenu');
+
+        me.initData(null, null);
+        me.purgeListeners();
+        
+        Ext.fly(me.innerHd).un("click", me.handleHdDown, me);
+
+        if (grid.enableColumnMove) {
+            columnDragData = columnDrag.dragData;
+            columnDragProxy = columnDrag.proxy;
+            Ext.destroy(
+                columnDrag.el,
+                columnDragProxy.ghost,
+                columnDragProxy.el,
+                columnDrop.el,
+                columnDrop.proxyTop,
+                columnDrop.proxyBottom,
+                columnDragData.ddel,
+                columnDragData.header
+            );
+            
+            if (columnDragProxy.anim) {
+                Ext.destroy(columnDragProxy.anim);
+            }
+            
+            delete columnDragProxy.ghost;
+            delete columnDragData.ddel;
+            delete columnDragData.header;
+            columnDrag.destroy();
+            
+            delete Ext.dd.DDM.locationCache[columnDrag.id];
+            delete columnDrag._domRef;
+
+            delete columnDrop.proxyTop;
+            delete columnDrop.proxyBottom;
+            columnDrop.destroy();
+            delete Ext.dd.DDM.locationCache["gridHeader" + gridEl.id];
+            delete columnDrop._domRef;
+            delete Ext.dd.DDM.ids[columnDrop.ddGroup];
+        }
+
+        if (splitZone) { // enableColumnResize
+            splitZone.destroy();
+            delete splitZone._domRef;
+            delete Ext.dd.DDM.ids["gridSplitters" + gridEl.id];
+        }
+
+        Ext.fly(me.innerHd).removeAllListeners();
+        Ext.removeNode(me.innerHd);
+        delete me.innerHd;
+
+        Ext.destroy(
+            me.el,
+            me.mainWrap,
+            me.mainHd,
+            me.scroller,
+            me.mainBody,
+            me.focusEl,
+            me.resizeMarker,
+            me.resizeProxy,
+            me.activeHdBtn,
+            me._flyweight,
+            dragZone,
+            splitZone
+        );
+
+        delete grid.container;
+
+        if (dragZone) {
+            dragZone.destroy();
+        }
+
+        Ext.dd.DDM.currentTarget = null;
+        delete Ext.dd.DDM.locationCache[gridEl.id];
+
+        Ext.EventManager.removeResizeListener(me.onWindowResize, me);
+    },
+
+    // private
+    onDenyColumnHide : function() {
+
+    },
+
+    // private
+    render : function() {
+        if (this.autoFill) {
+            var ct = this.grid.ownerCt;
+            
+            if (ct && ct.getLayout()) {
+                ct.on('afterlayout', function() {
+                    this.fitColumns(true, true);
+                    this.updateHeaders();
+                    this.updateHeaderSortState();
+                }, this, {single: true});
+            }
+        } else if (this.forceFit) {
+            this.fitColumns(true, false);
+        } else if (this.grid.autoExpandColumn) {
+            this.autoExpand(true);
+        }
+        
+        this.grid.getGridEl().dom.innerHTML = this.renderUI();
+        
+        this.afterRenderUI();
+    },
+
+    /* --------------------------------- Model Events and Handlers --------------------------------*/
+    
+    /**
+     * @private
+     * Binds a new Store and ColumnModel to this GridView. Removes any listeners from the old objects (if present)
+     * and adds listeners to the new ones
+     * @param {Ext.data.Store} newStore The new Store instance
+     * @param {Ext.grid.ColumnModel} newColModel The new ColumnModel instance
+     */
+    initData : function(newStore, newColModel) {
+        var me = this;
+        
+        if (me.ds) {
+            var oldStore = me.ds;
+            
+            oldStore.un('add', me.onAdd, me);
+            oldStore.un('load', me.onLoad, me);
+            oldStore.un('clear', me.onClear, me);
+            oldStore.un('remove', me.onRemove, me);
+            oldStore.un('update', me.onUpdate, me);
+            oldStore.un('datachanged', me.onDataChange, me);
+            
+            if (oldStore !== newStore && oldStore.autoDestroy) {
+                oldStore.destroy();
+            }
+        }
+        
+        if (newStore) {
+            newStore.on({
+                scope      : me,
+                load       : me.onLoad,
+                add        : me.onAdd,
+                remove     : me.onRemove,
+                update     : me.onUpdate,
+                clear      : me.onClear,
+                datachanged: me.onDataChange
+            });
+        }
+        
+        if (me.cm) {
+            var oldColModel = me.cm;
+            
+            oldColModel.un('configchange', me.onColConfigChange, me);
+            oldColModel.un('widthchange',  me.onColWidthChange, me);
+            oldColModel.un('headerchange', me.onHeaderChange, me);
+            oldColModel.un('hiddenchange', me.onHiddenChange, me);
+            oldColModel.un('columnmoved',  me.onColumnMove, me);
+        }
+        
+        if (newColModel) {
+            delete me.lastViewWidth;
+            
+            newColModel.on({
+                scope       : me,
+                configchange: me.onColConfigChange,
+                widthchange : me.onColWidthChange,
+                headerchange: me.onHeaderChange,
+                hiddenchange: me.onHiddenChange,
+                columnmoved : me.onColumnMove
+            });
+        }
+        
+        me.ds = newStore;
+        me.cm = newColModel;
+    },
+
+    // private
+    onDataChange : function(){
+        this.refresh(true);
+        this.updateHeaderSortState();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onClear : function() {
+        this.refresh();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onUpdate : function(store, record) {
+        this.refreshRow(record);
+    },
+
+    // private
+    onAdd : function(store, records, index) {
+        this.insertRows(store, index, index + (records.length-1));
+    },
+
+    // private
+    onRemove : function(store, record, index, isUpdate) {
+        if (isUpdate !== true) {
+            this.fireEvent('beforerowremoved', this, index, record);
+        }
+        
+        this.removeRow(index);
+        
+        if (isUpdate !== true) {
+            this.processRows(index);
+            this.applyEmptyText();
+            this.fireEvent('rowremoved', this, index, record);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a store is loaded, scrolls to the top row
+     */
+    onLoad : function() {
+        if (Ext.isGecko) {
+            if (!this.scrollToTopTask) {
+                this.scrollToTopTask = new Ext.util.DelayedTask(this.scrollToTop, this);
+            }
+            this.scrollToTopTask.delay(1);
+        } else {
+            this.scrollToTop();
+        }
+    },
+
+    // private
+    onColWidthChange : function(cm, col, width) {
+        this.updateColumnWidth(col, width);
+    },
+
+    // private
+    onHeaderChange : function(cm, col, text) {
+        this.updateHeaders();
+    },
+
+    // private
+    onHiddenChange : function(cm, col, hidden) {
+        this.updateColumnHidden(col, hidden);
+    },
+
+    // private
+    onColumnMove : function(cm, oldIndex, newIndex) {
+        this.indexMap = null;
+        this.refresh(true);
+        this.restoreScroll(this.getScrollState());
+        
+        this.afterMove(newIndex);
+        this.grid.fireEvent('columnmove', oldIndex, newIndex);
+    },
+
+    // private
+    onColConfigChange : function() {
+        delete this.lastViewWidth;
+        this.indexMap = null;
+        this.refresh(true);
+    },
+
+    /* -------------------- UI Events and Handlers ------------------------------ */
+    // private
+    initUI : function(grid) {
+        grid.on('headerclick', this.onHeaderClick, this);
+    },
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    // private
+    onHeaderClick : function(g, index) {
+        if (this.headersDisabled || !this.cm.isSortable(index)) {
+            return;
+        }
+        g.stopEditing(true);
+        g.store.sort(this.cm.getDataIndex(index));
+    },
+
+    /**
+     * @private
+     * Adds the hover class to a row when hovered over
+     */
+    onRowOver : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false) {
+            this.addRowClass(row, this.rowOverCls);
+        }
+    },
+
+    /**
+     * @private
+     * Removes the hover class from a row on mouseout
+     */
+    onRowOut : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false && !e.within(this.getRow(row), true)) {
+            this.removeRowClass(row, this.rowOverCls);
+        }
+    },
+
+    // private
+    onRowSelect : function(row) {
+        this.addRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onRowDeselect : function(row) {
+        this.removeRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onCellSelect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).addClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    onCellDeselect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).removeClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    handleWheel : function(e) {
+        e.stopPropagation();
+    },
+
+    /**
+     * @private
+     * Called by the SplitDragZone when a drag has been completed. Resizes the columns
+     */
+    onColumnSplitterMoved : function(cellIndex, width) {
+        this.userResized = true;
+        this.grid.colModel.setColumnWidth(cellIndex, width, true);
+
+        if (this.forceFit) {
+            this.fitColumns(true, false, cellIndex);
+            this.updateAllColumnWidths();
+        } else {
+            this.updateColumnWidth(cellIndex, width);
+            this.syncHeaderScroll();
+        }
+
+        this.grid.fireEvent('columnresize', cellIndex, width);
+    },
+
+    /**
+     * @private
+     * Click handler for the shared column dropdown menu, called on beforeshow. Builds the menu
+     * which displays the list of columns for the user to show or hide.
+     */
+    beforeColMenuShow : function() {
+        var colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            colMenu  = this.colMenu,
+            i;
+
+        colMenu.removeAll();
+
+        for (i = 0; i < colCount; i++) {
+            if (colModel.config[i].hideable !== false) {
+                colMenu.add(new Ext.menu.CheckItem({
+                    text       : colModel.getColumnHeader(i),
+                    itemId     : 'col-' + colModel.getColumnId(i),
+                    checked    : !colModel.isHidden(i),
+                    disabled   : colModel.config[i].hideable === false,
+                    hideOnClick: false
+                }));
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Attached as the 'itemclick' handler to the header menu and the column show/hide submenu (if available).
+     * Performs sorting if the sorter buttons were clicked, otherwise hides/shows the column that was clicked.
+     */
+    handleHdMenuClick : function(item) {
+        var store     = this.ds,
+            dataIndex = this.cm.getDataIndex(this.hdCtxIndex);
+
+        switch (item.getItemId()) {
+            case 'asc':
+                store.sort(dataIndex, 'ASC');
+                break;
+            case 'desc':
+                store.sort(dataIndex, 'DESC');
+                break;
+            default:
+                this.handleHdMenuClickDefault(item);
+        }
+        return true;
+    },
+    
+    /**
+     * Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides
+     * the column hide/show functionality based on the check state of the menu item. A different implementation can be provided
+     * if needed.
+     * @param {Ext.menu.BaseItem} item The menu item that was clicked
+     */
+    handleHdMenuClickDefault: function(item) {
+        var colModel = this.cm,
+            itemId   = item.getItemId(),
+            index    = colModel.getIndexById(itemId.substr(4));
+
+        if (index != -1) {
+            if (item.checked && colModel.getColumnsBy(this.isHideableColumn, this).length <= 1) {
+                this.onDenyColumnHide();
+                return;
+            }
+            colModel.setHidden(index, item.checked);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a header cell is clicked - shows the menu if the click happened over a trigger button
+     */
+    handleHdDown : function(e, target) {
+        if (Ext.fly(target).hasClass('x-grid3-hd-btn')) {
+            e.stopEvent();
+            
+            var colModel  = this.cm,
+                header    = this.findHeaderCell(target),
+                index     = this.getCellIndex(header),
+                sortable  = colModel.isSortable(index),
+                menu      = this.hmenu,
+                menuItems = menu.items,
+                menuCls   = this.headerMenuOpenCls;
+            
+            this.hdCtxIndex = index;
+            
+            Ext.fly(header).addClass(menuCls);
+            menuItems.get('asc').setDisabled(!sortable);
+            menuItems.get('desc').setDisabled(!sortable);
+            
+            menu.on('hide', function() {
+                Ext.fly(header).removeClass(menuCls);
+            }, this, {single:true});
+            
+            menu.show(target, 'tl-bl?');
+        }
+    },
+
+    /**
+     * @private
+     * Attached to the headers' mousemove event. This figures out the CSS cursor to use based on where the mouse is currently
+     * pointed. If the mouse is currently hovered over the extreme left or extreme right of any header cell and the cell next 
+     * to it is resizable it is given the resize cursor, otherwise the cursor is set to an empty string.
+     */
+    handleHdMove : function(e) {
+        var header = this.findHeaderCell(this.activeHdRef);
+        
+        if (header && !this.headersDisabled) {
+            var handleWidth  = this.splitHandleWidth || 5,
+                activeRegion = this.activeHdRegion,
+                headerStyle  = header.style,
+                colModel     = this.cm,
+                cursor       = '',
+                pageX        = e.getPageX();
+                
+            if (this.grid.enableColumnResize !== false) {
+                var activeHeaderIndex = this.activeHdIndex,
+                    previousVisible   = this.getPreviousVisible(activeHeaderIndex),
+                    currentResizable  = colModel.isResizable(activeHeaderIndex),
+                    previousResizable = previousVisible && colModel.isResizable(previousVisible),
+                    inLeftResizer     = pageX - activeRegion.left <= handleWidth,
+                    inRightResizer    = activeRegion.right - pageX <= (!this.activeHdBtn ? handleWidth : 2);
+                
+                if (inLeftResizer && previousResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'e-resize' : 'col-resize'; // col-resize not always supported
+                } else if (inRightResizer && currentResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'w-resize' : 'col-resize';
+                }
+            }
+            
+            headerStyle.cursor = cursor;
+        }
+    },
+    
+    /**
+     * @private
+     * Returns the index of the nearest currently visible header to the left of the given index.
+     * @param {Number} index The header index
+     * @return {Number/undefined} The index of the nearest visible header
+     */
+    getPreviousVisible: function(index) {
+        while (index > 0) {
+            if (!this.cm.isHidden(index - 1)) {
+                return index;
+            }
+            index--;
+        }
+        return undefined;
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseover event - adds the over class to the header cell if the menu is not disabled
+     * for that cell
+     */
+    handleHdOver : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && !this.headersDisabled) {
+            var fly = this.fly(header);
+            
+            this.activeHdRef = target;
+            this.activeHdIndex = this.getCellIndex(header);
+            this.activeHdRegion = fly.getRegion();
+            
+            if (!this.isMenuDisabled(this.activeHdIndex, fly)) {
+                fly.addClass('x-grid3-hd-over');
+                this.activeHdBtn = fly.child('.x-grid3-hd-btn');
+                
+                if (this.activeHdBtn) {
+                    this.activeHdBtn.dom.style.height = (header.firstChild.offsetHeight - 1) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseout event. Removes the hover class from the header cell
+     */
+    handleHdOut : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && (!Ext.isIE || !e.within(header, true))) {
+            this.activeHdRef = null;
+            this.fly(header).removeClass('x-grid3-hd-over');
+            header.style.cursor = '';
+        }
+    },
+    
+    /**
+     * @private
+     * Used by {@link #handleHdOver} to determine whether or not to show the header menu class on cell hover
+     * @param {Number} cellIndex The header cell index
+     * @param {Ext.Element} el The cell element currently being hovered over
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return this.cm.isMenuDisabled(cellIndex);
+    },
+
+    /**
+     * @private
+     * Returns true if there are any rows rendered into the GridView
+     * @return {Boolean} True if any rows have been rendered
+     */
+    hasRows : function() {
+        var fc = this.mainBody.dom.firstChild;
+        return fc && fc.nodeType == 1 && fc.className != 'x-grid-empty';
+    },
+    
+    /**
+     * @private
+     */
+    isHideableColumn : function(c) {
+        return !c.hidden;
+    },
+
+    /**
+     * @private
+     * DEPRECATED - will be removed in Ext JS 5.0
+     */
+    bind : function(d, c) {
+        this.initData(d, c);
+    }
+});
+
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridView.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+
+    constructor: function(grid, hd){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.marker = this.view.resizeMarker;
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,
+            'gridSplitters' + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.scroll = false;
+        this.hw = this.view.splitHandleWidth || 5;
+    },
+
+    b4StartDrag : function(x, y){
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var h = this.view.mainWrap.getHeight();
+        this.marker.setHeight(h);
+        this.marker.show();
+        this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);
+        this.proxy.setHeight(h);
+        var w = this.cm.getColumnWidth(this.cellIndex),
+            minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+    allowHeaderDrag : function(e){
+        return true;
+    },
+
+    handleMouseDown : function(e){
+        var t = this.view.findHeaderCell(e.getTarget());
+        if(t && this.allowHeaderDrag(e)){
+            var xy = this.view.fly(t).getXY(), 
+                x = xy[0],
+                exy = e.getXY(), 
+                ex = exy[0],
+                w = t.offsetWidth, 
+                adjust = false;
+                
+            if((ex - x) <= this.hw){
+                adjust = -1;
+            }else if((x+w) - ex <= this.hw){
+                adjust = 0;
+            }
+            if(adjust !== false){
+                this.cm = this.grid.colModel;
+                var ci = this.view.getCellIndex(t);
+                if(adjust == -1){
+                  if (ci + adjust < 0) {
+                    return;
+                  }
+                    while(this.cm.isHidden(ci+adjust)){
+                        --adjust;
+                        if(ci+adjust < 0){
+                            return;
+                        }
+                    }
+                }
+                this.cellIndex = ci+adjust;
+                this.split = t.dom;
+                if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                    Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+                }
+            }else if(this.view.columnDrag){
+                this.view.columnDrag.callHandleMouseDown(e);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.marker.hide();
+        var v = this.view,
+            endX = Math.max(this.minX, e.getPageX()),
+            diff = endX - this.startPos,
+            disabled = this.dragHeadersDisabled;
+            
+        v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnSplitDD.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnSplitDD.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/ColumnSplitDD.js	(revision 76)
@@ -0,0 +1,63 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.SplitDragZone.superclass.constructor.call(this, hd,
+            "gridSplitters" + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.setHandleElId(Ext.id(hd));
+        this.setOuterHandleElId(Ext.id(hd2));
+        this.scroll = false;
+    },
+
+    b4StartDrag : function(x, y){
+        this.view.headersDisabled = true;
+        this.proxy.setHeight(this.view.mainWrap.getHeight());
+        var w = this.cm.getColumnWidth(this.cellIndex);
+        var minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+
+    handleMouseDown : function(e){
+        var ev = Ext.EventObject.setEvent(e);
+        var t = this.fly(ev.getTarget());
+        if(t.hasClass("x-grid-split")){
+            this.cellIndex = this.view.getCellIndex(t.dom);
+            this.split = t.dom;
+            this.cm = this.grid.colModel;
+            if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.view.headersDisabled = false;
+        var endX = Math.max(this.minX, Ext.lib.Event.getPageX(e));
+        var diff = endX - this.startPos;
+        this.view.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GroupingView.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GroupingView.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GroupingView.js	(revision 76)
@@ -0,0 +1,611 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GroupingView
+ * @extends Ext.grid.GridView
+ * Adds the ability for single level grouping to the grid. A {@link Ext.data.GroupingStore GroupingStore}
+ * must be used to enable grouping.  Some grouping characteristics may also be configured at the
+ * {@link Ext.grid.Column Column level}<div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.grid.Column#emptyGroupText emptyGroupText}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupable groupable}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupName groupName}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupRender groupRender}</code></li>
+ * </ul></div>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    // A groupingStore is required for a GroupingView
+    store: new {@link Ext.data.GroupingStore}({
+        autoDestroy: true,
+        reader: reader,
+        data: xg.dummyData,
+        sortInfo: {field: 'company', direction: 'ASC'},
+        {@link Ext.data.GroupingStore#groupOnSort groupOnSort}: true,
+        {@link Ext.data.GroupingStore#remoteGroup remoteGroup}: true,
+        {@link Ext.data.GroupingStore#groupField groupField}: 'industry'
+    }),
+    colModel: new {@link Ext.grid.ColumnModel}({
+        columns:[
+            {id:'company',header: 'Company', width: 60, dataIndex: 'company'},
+            // {@link Ext.grid.Column#groupable groupable}, {@link Ext.grid.Column#groupName groupName}, {@link Ext.grid.Column#groupRender groupRender} are also configurable at column level
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price', {@link Ext.grid.Column#groupable groupable}: false},
+            {header: 'Change', dataIndex: 'change', renderer: Ext.util.Format.usMoney},
+            {header: 'Industry', dataIndex: 'industry'},
+            {header: 'Last Updated', renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
+        ],
+        defaults: {
+            sortable: true,
+            menuDisabled: false,
+            width: 20
+        }
+    }),
+
+    view: new Ext.grid.GroupingView({
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+        // custom grouping text template to display the number of items per group
+        {@link #groupTextTpl}: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+
+    frame:true,
+    width: 700,
+    height: 450,
+    collapsible: true,
+    animCollapse: false,
+    title: 'Grouping Example',
+    iconCls: 'icon-grid',
+    renderTo: document.body
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {
+
+    /**
+     * @cfg {String} groupByText Text displayed in the grid header menu for grouping by a column
+     * (defaults to 'Group By This Field').
+     */
+    groupByText : 'Group By This Field',
+    /**
+     * @cfg {String} showGroupsText Text displayed in the grid header for enabling/disabling grouping
+     * (defaults to 'Show in Groups').
+     */
+    showGroupsText : 'Show in Groups',
+    /**
+     * @cfg {Boolean} hideGroupedColumn <tt>true</tt> to hide the column that is currently grouped (defaults to <tt>false</tt>)
+     */
+    hideGroupedColumn : false,
+    /**
+     * @cfg {Boolean} showGroupName If <tt>true</tt> will display a prefix plus a ': ' before the group field value
+     * in the group header line.  The prefix will consist of the <tt><b>{@link Ext.grid.Column#groupName groupName}</b></tt>
+     * (or the configured <tt><b>{@link Ext.grid.Column#header header}</b></tt> if not provided) configured in the
+     * {@link Ext.grid.Column} for each set of grouped rows (defaults to <tt>true</tt>).
+     */
+    showGroupName : true,
+    /**
+     * @cfg {Boolean} startCollapsed <tt>true</tt> to start all groups collapsed (defaults to <tt>false</tt>)
+     */
+    startCollapsed : false,
+    /**
+     * @cfg {Boolean} enableGrouping <tt>false</tt> to disable grouping functionality (defaults to <tt>true</tt>)
+     */
+    enableGrouping : true,
+    /**
+     * @cfg {Boolean} enableGroupingMenu <tt>true</tt> to enable the grouping control in the column menu (defaults to <tt>true</tt>)
+     */
+    enableGroupingMenu : true,
+    /**
+     * @cfg {Boolean} enableNoGroups <tt>true</tt> to allow the user to turn off grouping (defaults to <tt>true</tt>)
+     */
+    enableNoGroups : true,
+    /**
+     * @cfg {String} emptyGroupText The text to display when there is an empty group value (defaults to <tt>'(None)'</tt>).
+     * May also be specified per column, see {@link Ext.grid.Column}.{@link Ext.grid.Column#emptyGroupText emptyGroupText}.
+     */
+    emptyGroupText : '(None)',
+    /**
+     * @cfg {Boolean} ignoreAdd <tt>true</tt> to skip refreshing the view when new rows are added (defaults to <tt>false</tt>)
+     */
+    ignoreAdd : false,
+    /**
+     * @cfg {String} groupTextTpl The template used to render the group header (defaults to <tt>'{text}'</tt>).
+     * This is used to format an object which contains the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>group</b> : String<p class="sub-desc">The <i>rendered</i> value of the group field.
+     * By default this is the unchanged value of the group field. If a <tt><b>{@link Ext.grid.Column#groupRenderer groupRenderer}</b></tt>
+     * is specified, it is the result of a call to that function.</p></li>
+     * <li><b>gvalue</b> : Object<p class="sub-desc">The <i>raw</i> value of the group field.</p></li>
+     * <li><b>text</b> : String<p class="sub-desc">The configured header (as described in <tt>{@link #showGroupName})</tt>
+     * if <tt>{@link #showGroupName}</tt> is <tt>true</tt>) plus the <i>rendered</i> group field value.</p></li>
+     * <li><b>groupId</b> : String<p class="sub-desc">A unique, generated ID which is applied to the
+     * View Element which contains the group.</p></li>
+     * <li><b>startRow</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>rs</b> : Array<p class="sub-desc">Contains a single element: The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>cls</b> : String<p class="sub-desc">The generated class name string to apply to the group header Element.</p></li>
+     * <li><b>style</b> : String<p class="sub-desc">The inline style rules to apply to the group header Element.</p></li>
+     * </ul></div></p>
+     * See {@link Ext.XTemplate} for information on how to format data using a template. Possible usage:<pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    view: new Ext.grid.GroupingView({
+        groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+});
+     * </code></pre>
+     */
+    groupTextTpl : '{text}',
+
+    /**
+     * @cfg {String} groupMode Indicates how to construct the group identifier. <tt>'value'</tt> constructs the id using
+     * raw value, <tt>'display'</tt> constructs the id using the rendered value. Defaults to <tt>'value'</tt>.
+     */
+    groupMode: 'value',
+
+    /**
+     * @cfg {Function} groupRenderer This property must be configured in the {@link Ext.grid.Column} for
+     * each column.
+     */
+    
+    /**
+     * @cfg {Boolean} cancelEditOnToggle True to cancel any editing when the group header is toggled. Defaults to <tt>true</tt>.
+     */
+    cancelEditOnToggle: true,
+
+    // private
+    initTemplates : function(){
+        Ext.grid.GroupingView.superclass.initTemplates.call(this);
+        this.state = {};
+
+        var sm = this.grid.getSelectionModel();
+        sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',
+                this.onBeforeRowSelect, this);
+
+        if(!this.startGroup){
+            this.startGroup = new Ext.XTemplate(
+                '<div id="{groupId}" class="x-grid-group {cls}">',
+                    '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">', this.groupTextTpl ,'</div></div>',
+                    '<div id="{groupId}-bd" class="x-grid-group-body">'
+            );
+        }
+        this.startGroup.compile();
+
+        if (!this.endGroup) {
+            this.endGroup = '</div></div>';
+        }
+    },
+
+    // private
+    findGroup : function(el){
+        return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);
+    },
+
+    // private
+    getGroups : function(){
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // private
+    onAdd : function(ds, records, index) {
+        if (this.canGroup() && !this.ignoreAdd) {
+            var ss = this.getScrollState();
+            this.fireEvent('beforerowsinserted', ds, index, index + (records.length-1));
+            this.refresh();
+            this.restoreScroll(ss);
+            this.fireEvent('rowsinserted', ds, index, index + (records.length-1));
+        } else if (!this.canGroup()) {
+            Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);
+        }
+    },
+
+    // private
+    onRemove : function(ds, record, index, isUpdate){
+        Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);
+        var g = document.getElementById(record._groupId);
+        if(g && g.childNodes[1].childNodes.length < 1){
+            Ext.removeNode(g);
+        }
+        this.applyEmptyText();
+    },
+
+    // private
+    refreshRow : function(record){
+        if(this.ds.getCount()==1){
+            this.refresh();
+        }else{
+            this.isUpdating = true;
+            Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);
+            this.isUpdating = false;
+        }
+    },
+
+    // private
+    beforeMenuShow : function(){
+        var item, items = this.hmenu.items, disabled = this.cm.config[this.hdCtxIndex].groupable === false;
+        if((item = items.get('groupBy'))){
+            item.setDisabled(disabled);
+        }
+        if((item = items.get('showGroups'))){
+            item.setDisabled(disabled);
+            item.setChecked(this.canGroup(), true);
+        }
+    },
+
+    // private
+    renderUI : function(){
+        var markup = Ext.grid.GroupingView.superclass.renderUI.call(this);
+
+        if(this.enableGroupingMenu && this.hmenu){
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            if(this.enableNoGroups){
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+        return markup;
+    },
+
+    processEvent: function(name, e){
+        Ext.grid.GroupingView.superclass.processEvent.call(this, name, e);
+        var hd = e.getTarget('.x-grid-group-hd', this.mainBody);
+        if(hd){
+            // group value is at the end of the string
+            var field = this.getGroupField(),
+                prefix = this.getPrefix(field),
+                groupValue = hd.id.substring(prefix.length),
+                emptyRe = new RegExp('gp-' + Ext.escapeRe(field) + '--hd');
+
+            // remove trailing '-hd'
+            groupValue = groupValue.substr(0, groupValue.length - 3);
+            
+            // also need to check for empty groups
+            if(groupValue || emptyRe.test(hd.id)){
+                this.grid.fireEvent('group' + name, this.grid, field, groupValue, e);
+            }
+            if(name == 'mousedown' && e.button == 0){
+                this.toggleGroup(hd.parentNode);
+            }
+        }
+
+    },
+
+    // private
+    onGroupByClick : function(){
+        var grid = this.grid;
+        this.enableGrouping = true;
+        grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));
+        grid.fireEvent('groupchange', grid, grid.store.getGroupState());
+        this.beforeMenuShow(); // Make sure the checkboxes get properly set when changing groups
+        this.refresh();
+    },
+
+    // private
+    onShowGroupsClick : function(mi, checked){
+        this.enableGrouping = checked;
+        if(checked){
+            this.onGroupByClick();
+        }else{
+            this.grid.store.clearGrouping();
+            this.grid.fireEvent('groupchange', this, null);
+        }
+    },
+
+    /**
+     * Toggle the group that contains the specific row.
+     * @param {Number} rowIndex The row inside the group
+     * @param {Boolean} expanded (optional)
+     */
+    toggleRowIndex : function(rowIndex, expanded){
+        if(!this.canGroup()){
+            return;
+        }
+        var row = this.getRow(rowIndex);
+        if(row){
+            this.toggleGroup(this.findGroup(row), expanded);
+        }
+    },
+
+    /**
+     * Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed.
+     * @param {String} groupId The groupId assigned to the group (see getGroupId)
+     * @param {Boolean} expanded (optional)
+     */
+    toggleGroup : function(group, expanded){
+        var gel = Ext.get(group),
+            id = Ext.util.Format.htmlEncode(gel.id);
+ 
+        expanded = Ext.isDefined(expanded) ? expanded : gel.hasClass('x-grid-group-collapsed');
+        if(this.state[id] !== expanded){
+            if (this.cancelEditOnToggle !== false) {
+                this.grid.stopEditing(true);
+            }
+            this.state[id] = expanded;
+            gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');
+        }
+    },
+
+    /**
+     * Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed.
+     * @param {Boolean} expanded (optional)
+     */
+    toggleAllGroups : function(expanded){
+        var groups = this.getGroups();
+        for(var i = 0, len = groups.length; i < len; i++){
+            this.toggleGroup(groups[i], expanded);
+        }
+    },
+
+    /**
+     * Expands all grouped rows.
+     */
+    expandAllGroups : function(){
+        this.toggleAllGroups(true);
+    },
+
+    /**
+     * Collapses all grouped rows.
+     */
+    collapseAllGroups : function(){
+        this.toggleAllGroups(false);
+    },
+
+    // private
+    getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){
+        var column = this.cm.config[colIndex],
+            g = groupRenderer ? groupRenderer.call(column.scope, v, {}, r, rowIndex, colIndex, ds) : String(v);
+        if(g === '' || g === '&#160;'){
+            g = column.emptyGroupText || this.emptyGroupText;
+        }
+        return g;
+    },
+
+    // private
+    getGroupField : function(){
+        return this.grid.store.getGroupState();
+    },
+
+    // private
+    afterRender : function(){
+        if(!this.ds || !this.cm){
+            return;
+        }
+        Ext.grid.GroupingView.superclass.afterRender.call(this);
+        if(this.grid.deferRowRender){
+            this.updateGroupWidths();
+        }
+    },
+    
+    afterRenderUI: function () {
+        Ext.grid.GroupingView.superclass.afterRenderUI.call(this);
+
+        if (this.enableGroupingMenu && this.hmenu) {
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            
+            if (this.enableNoGroups) {
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+    },
+
+    // private
+    renderRows : function(){
+        var groupField = this.getGroupField();
+        var eg = !!groupField;
+        // if they turned off grouping and the last grouped field is hidden
+        if(this.hideGroupedColumn) {
+            var colIndex = this.cm.findColumnIndex(groupField),
+                hasLastGroupField = Ext.isDefined(this.lastGroupField);
+            if(!eg && hasLastGroupField){
+                this.mainBody.update('');
+                this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);
+                delete this.lastGroupField;
+            }else if (eg && !hasLastGroupField){
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }else if (eg && hasLastGroupField && groupField !== this.lastGroupField) {
+                this.mainBody.update('');
+                var oldIndex = this.cm.findColumnIndex(this.lastGroupField);
+                this.cm.setHidden(oldIndex, false);
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }
+        }
+        return Ext.grid.GroupingView.superclass.renderRows.apply(
+                    this, arguments);
+    },
+
+    // private
+    doRender : function(cs, rs, ds, startRow, colCount, stripe){
+        if(rs.length < 1){
+            return '';
+        }
+
+        if(!this.canGroup() || this.isUpdating){
+            return Ext.grid.GroupingView.superclass.doRender.apply(this, arguments);
+        }
+
+        var groupField = this.getGroupField(),
+            colIndex = this.cm.findColumnIndex(groupField),
+            g,
+            gstyle = 'width:' + this.getTotalWidth() + ';',
+            cfg = this.cm.config[colIndex],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            prefix = this.showGroupName ? (cfg.groupName || cfg.header)+': ' : '',
+            groups = [],
+            curGroup, i, len, gid;
+
+        for(i = 0, len = rs.length; i < len; i++){
+            var rowIndex = startRow + i,
+                r = rs[i],
+                gvalue = r.data[groupField];
+
+                g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);
+            if(!curGroup || curGroup.group != g){
+                gid = this.constructId(gvalue, groupField, colIndex);
+                // if state is defined use it, however state is in terms of expanded
+                // so negate it, otherwise use the default.
+                this.state[gid] = !(Ext.isDefined(this.state[gid]) ? !this.state[gid] : this.startCollapsed);
+                curGroup = {
+                    group: g,
+                    gvalue: gvalue,
+                    text: prefix + g,
+                    groupId: gid,
+                    startRow: rowIndex,
+                    rs: [r],
+                    cls: this.state[gid] ? '' : 'x-grid-group-collapsed',
+                    style: gstyle
+                };
+                groups.push(curGroup);
+            }else{
+                curGroup.rs.push(r);
+            }
+            r._groupId = gid;
+        }
+
+        var buf = [];
+        for(i = 0, len = groups.length; i < len; i++){
+            g = groups[i];
+            this.doGroupStart(buf, g, cs, ds, colCount);
+            buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(
+                    this, cs, g.rs, ds, g.startRow, colCount, stripe);
+
+            this.doGroupEnd(buf, g, cs, ds, colCount);
+        }
+        return buf.join('');
+    },
+
+    /**
+     * Dynamically tries to determine the groupId of a specific value
+     * @param {String} value
+     * @return {String} The group id
+     */
+    getGroupId : function(value){
+        var field = this.getGroupField();
+        return this.constructId(value, field, this.cm.findColumnIndex(field));
+    },
+
+    // private
+    constructId : function(value, field, idx){
+        var cfg = this.cm.config[idx],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            val = (this.groupMode == 'value') ? value : this.getGroup(value, {data:{}}, groupRenderer, 0, idx, this.ds);
+
+        return this.getPrefix(field) + Ext.util.Format.htmlEncode(val);
+    },
+
+    // private
+    canGroup  : function(){
+        return this.enableGrouping && !!this.getGroupField();
+    },
+
+    // private
+    getPrefix: function(field){
+        return this.grid.getGridEl().id + '-gp-' + field + '-';
+    },
+
+    // private
+    doGroupStart : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.startGroup.apply(g);
+    },
+
+    // private
+    doGroupEnd : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.endGroup;
+    },
+
+    // private
+    getRows : function(){
+        if(!this.canGroup()){
+            return Ext.grid.GroupingView.superclass.getRows.call(this);
+        }
+        var r = [],
+            gs = this.getGroups(),
+            g,
+            i = 0,
+            len = gs.length,
+            j,
+            jlen;
+        for(; i < len; ++i){
+            g = gs[i].childNodes[1];
+            if(g){
+                g = g.childNodes;
+                for(j = 0, jlen = g.length; j < jlen; ++j){
+                    r[r.length] = g[j];
+                }
+            }
+        }
+        return r;
+    },
+
+    // private
+    updateGroupWidths : function(){
+        if(!this.canGroup() || !this.hasRows()){
+            return;
+        }
+        var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.getScrollOffset()) +'px';
+        var gs = this.getGroups();
+        for(var i = 0, len = gs.length; i < len; i++){
+            gs[i].firstChild.style.width = tw;
+        }
+    },
+
+    // private
+    onColumnWidthUpdated : function(col, w, tw){
+        Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this, col, w, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onAllColumnWidthsUpdated : function(ws, tw){
+        Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this, ws, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onColumnHiddenUpdated : function(col, hidden, tw){
+        Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this, col, hidden, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onLayout : function(){
+        this.updateGroupWidths();
+    },
+
+    // private
+    onBeforeRowSelect : function(sm, rowIndex){
+        this.toggleRowIndex(rowIndex, true);
+    }
+});
+// private
+Ext.grid.GroupingView.GROUP_ID = 1000;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotAxis.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotAxis.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotAxis.js	(revision 76)
@@ -0,0 +1,320 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.PivotAxis
+ * @extends Ext.Component
+ * <p>PivotAxis is a class that supports a {@link Ext.grid.PivotGrid}. Each PivotGrid contains two PivotAxis instances - the left
+ * axis and the top axis. Each PivotAxis defines an ordered set of dimensions, each of which should correspond to a field in a
+ * Store's Record (see {@link Ext.grid.PivotGrid} documentation for further explanation).</p>
+ * <p>Developers should have little interaction with the PivotAxis instances directly as most of their management is performed by
+ * the PivotGrid. An exception is the dynamic reconfiguration of axes at run time - to achieve this we use PivotAxis's 
+ * {@link #setDimensions} function and refresh the grid:</p>
+<pre><code>
+var pivotGrid = new Ext.grid.PivotGrid({
+    //some PivotGrid config here
+});
+
+//change the left axis dimensions
+pivotGrid.leftAxis.setDimensions([
+    {
+        dataIndex: 'person',
+        direction: 'DESC',
+        width    : 100
+    },
+    {
+        dataIndex: 'product',
+        direction: 'ASC',
+        width    : 80
+    }
+]);
+
+pivotGrid.view.refresh(true);
+</code></pre>
+ * This clears the previous dimensions on the axis and redraws the grid with the new dimensions.
+ */
+Ext.grid.PivotAxis = Ext.extend(Ext.Component, {
+    /**
+     * @cfg {String} orientation One of 'vertical' or 'horizontal'. Defaults to horizontal
+     */
+    orientation: 'horizontal',
+    
+    /**
+     * @cfg {Number} defaultHeaderWidth The width to render each row header that does not have a width specified via 
+     {@link #getRowGroupHeaders}. Defaults to 80.
+     */
+    defaultHeaderWidth: 80,
+    
+    /**
+     * @private
+     * @cfg {Number} paddingWidth The amount of padding used by each cell.
+     * TODO: From 4.x onwards this can be removed as it won't be needed. For now it is used to account for the differences between
+     * the content box and border box measurement models
+     */
+    paddingWidth: 7,
+    
+    /**
+     * Updates the dimensions used by this axis
+     * @param {Array} dimensions The new dimensions
+     */
+    setDimensions: function(dimensions) {
+        this.dimensions = dimensions;
+    },
+    
+    /**
+     * @private
+     * Builds the html table that contains the dimensions for this axis. This branches internally between vertical
+     * and horizontal orientations because the table structure is slightly different in each case
+     */
+    onRender: function(ct, position) {
+        var rows = this.orientation == 'horizontal'
+                 ? this.renderHorizontalRows()
+                 : this.renderVerticalRows();
+        
+        this.el = Ext.DomHelper.overwrite(ct.dom, {tag: 'table', cn: rows}, true);
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for horizontal oriented axes
+     * @return {Object} The HTML Domspec for a horizontal oriented axis
+     */
+    renderHorizontalRows: function() {
+        var headers  = this.buildHeaders(),
+            rowCount = headers.length,
+            rows     = [],
+            cells, cols, colCount, i, j;
+        
+        for (i = 0; i < rowCount; i++) {
+            cells = [];
+            cols  = headers[i].items;
+            colCount = cols.length;
+
+            for (j = 0; j < colCount; j++) {
+                cells.push({
+                    tag: 'td',
+                    html: cols[j].header,
+                    colspan: cols[j].span
+                });
+            }
+
+            rows[i] = {
+                tag: 'tr',
+                cn: cells
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for vertical oriented axes
+     * @return {Object} The HTML Domspec for a vertical oriented axis
+     */
+    renderVerticalRows: function() {
+        var headers  = this.buildHeaders(),
+            colCount = headers.length,
+            rowCells = [],
+            rows     = [],
+            rowCount, col, row, colWidth, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            col = headers[i];
+            colWidth = col.width || 80;
+            rowCount = col.items.length;
+            
+            for (j = 0; j < rowCount; j++) {
+                row = col.items[j];
+                
+                rowCells[row.start] = rowCells[row.start] || [];
+                rowCells[row.start].push({
+                    tag    : 'td',
+                    html   : row.header,
+                    rowspan: row.span,
+                    width  : Ext.isBorderBox ? colWidth : colWidth - this.paddingWidth
+                });
+            }
+        }
+        
+        rowCount = rowCells.length;
+        for (i = 0; i < rowCount; i++) {
+            rows[i] = {
+                tag: 'tr',
+                cn : rowCells[i]
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Returns the set of all unique tuples based on the bound store and dimension definitions.
+     * Internally we construct a new, temporary store to make use of the multi-sort capabilities of Store. In
+     * 4.x this functionality should have been moved to MixedCollection so this step should not be needed.
+     * @return {Array} All unique tuples
+     */
+    getTuples: function() {
+        var newStore = new Ext.data.Store({});
+        
+        newStore.data = this.store.data.clone();
+        newStore.fields = this.store.fields;
+        
+        var sorters    = [],
+            dimensions = this.dimensions,
+            length     = dimensions.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            sorters.push({
+                field    : dimensions[i].dataIndex,
+                direction: dimensions[i].direction || 'ASC'
+            });
+        }
+        
+        newStore.sort(sorters);
+        
+        var records = newStore.data.items,
+            hashes  = [],
+            tuples  = [],
+            recData, hash, info, data, key;
+        
+        length = records.length;
+        
+        for (i = 0; i < length; i++) {
+            info = this.getRecordInfo(records[i]);
+            data = info.data;
+            hash = "";
+            
+            for (key in data) {
+                hash += data[key] + '---';
+            }
+            
+            if (hashes.indexOf(hash) == -1) {
+                hashes.push(hash);
+                tuples.push(info);
+            }
+        }
+        
+        newStore.destroy();
+        
+        return tuples;
+    },
+    
+    /**
+     * @private
+     */
+    getRecordInfo: function(record) {
+        var dimensions = this.dimensions,
+            length  = dimensions.length,
+            data    = {},
+            dimension, dataIndex, i;
+        
+        //get an object containing just the data we are interested in based on the configured dimensions
+        for (i = 0; i < length; i++) {
+            dimension = dimensions[i];
+            dataIndex = dimension.dataIndex;
+            
+            data[dataIndex] = record.get(dataIndex);
+        }
+        
+        //creates a specialised matcher function for a given tuple. The returned function will return
+        //true if the record passed to it matches the dataIndex values of each dimension in this axis
+        var createMatcherFunction = function(data) {
+            return function(record) {
+                for (var dataIndex in data) {
+                    if (record.get(dataIndex) != data[dataIndex]) {
+                        return false;
+                    }
+                }
+                
+                return true;
+            };
+        };
+        
+        return {
+            data: data,
+            matcher: createMatcherFunction(data)
+        };
+    },
+    
+    /**
+     * @private
+     * Uses the calculated set of tuples to build an array of headers that can be rendered into a table using rowspan or
+     * colspan. Basically this takes the set of tuples and spans any cells that run into one another, so if we had dimensions
+     * of Person and Product and several tuples containing different Products for the same Person, those Products would be
+     * spanned.
+     * @return {Array} The headers
+     */
+    buildHeaders: function() {
+        var tuples     = this.getTuples(),
+            rowCount   = tuples.length,
+            dimensions = this.dimensions,
+            dimension,
+            colCount   = dimensions.length,
+            headers    = [],
+            tuple, rows, currentHeader, previousHeader, span, start, isLast, changed, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            dimension = dimensions[i];
+            rows  = [];
+            span  = 0;
+            start = 0;
+            
+            for (j = 0; j < rowCount; j++) {
+                tuple  = tuples[j];
+                isLast = j == (rowCount - 1);
+                currentHeader = tuple.data[dimension.dataIndex];
+                
+                /*
+                 * 'changed' indicates that we need to create a new cell. This should be true whenever the cell
+                 * above (previousHeader) is different from this cell, or when the cell on the previous dimension
+                 * changed (e.g. if the current dimension is Product and the previous was Person, we need to start
+                 * a new cell if Product is the same but Person changed, so we check the previous dimension and tuple)
+                 */
+                changed = previousHeader != undefined && previousHeader != currentHeader;
+                if (i > 0 && j > 0) {
+                    changed = changed || tuple.data[dimensions[i-1].dataIndex] != tuples[j-1].data[dimensions[i-1].dataIndex];
+                }
+                
+                if (changed) {                    
+                    rows.push({
+                        header: previousHeader,
+                        span  : span,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                if (isLast) {
+                    rows.push({
+                        header: currentHeader,
+                        span  : span + 1,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                previousHeader = currentHeader;
+                span++;
+            }
+            
+            headers.push({
+                items: rows,
+                width: dimension.width || this.defaultHeaderWidth
+            });
+            
+            previousHeader = undefined;
+        }
+        
+        return headers;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PropertyGrid.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PropertyGrid.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PropertyGrid.js	(revision 76)
@@ -0,0 +1,468 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.PropertyRecord
+ * A specific {@link Ext.data.Record} type that represents a name/value pair and is made to work with the
+ * {@link Ext.grid.PropertyGrid}.  Typically, PropertyRecords do not need to be created directly as they can be
+ * created implicitly by simply using the appropriate data configs either via the {@link Ext.grid.PropertyGrid#source}
+ * config property or by calling {@link Ext.grid.PropertyGrid#setSource}.  However, if the need arises, these records
+ * can also be created explicitly as shwon below.  Example usage:
+ * <pre><code>
+var rec = new Ext.grid.PropertyRecord({
+    name: 'Birthday',
+    value: new Date(Date.parse('05/26/1972'))
+});
+// Add record to an already populated grid
+grid.store.addSorted(rec);
+</code></pre>
+ * @constructor
+ * @param {Object} config A data object in the format: {name: [name], value: [value]}.  The specified value's type
+ * will be read automatically by the grid to determine the type of editor to use when displaying it.
+ */
+Ext.grid.PropertyRecord = Ext.data.Record.create([
+    {name:'name',type:'string'}, 'value'
+]);
+
+/**
+ * @class Ext.grid.PropertyStore
+ * @extends Ext.util.Observable
+ * A custom wrapper for the {@link Ext.grid.PropertyGrid}'s {@link Ext.data.Store}. This class handles the mapping
+ * between the custom data source objects supported by the grid and the {@link Ext.grid.PropertyRecord} format
+ * required for compatibility with the underlying store. Generally this class should not need to be used directly --
+ * the grid's data should be accessed from the underlying store via the {@link #store} property.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyStore = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(grid, source){
+        this.grid = grid;
+        this.store = new Ext.data.Store({
+            recordType : Ext.grid.PropertyRecord
+        });
+        this.store.on('update', this.onUpdate,  this);
+        if(source){
+            this.setSource(source);
+        }
+        Ext.grid.PropertyStore.superclass.constructor.call(this);    
+    },
+    
+    // protected - should only be called by the grid.  Use grid.setSource instead.
+    setSource : function(o){
+        this.source = o;
+        this.store.removeAll();
+        var data = [];
+        for(var k in o){
+            if(this.isEditableValue(o[k])){
+                data.push(new Ext.grid.PropertyRecord({name: k, value: o[k]}, k));
+            }
+        }
+        this.store.loadRecords({records: data}, {}, true);
+    },
+
+    // private
+    onUpdate : function(ds, record, type){
+        if(type == Ext.data.Record.EDIT){
+            var v = record.data.value;
+            var oldValue = record.modified.value;
+            if(this.grid.fireEvent('beforepropertychange', this.source, record.id, v, oldValue) !== false){
+                this.source[record.id] = v;
+                record.commit();
+                this.grid.fireEvent('propertychange', this.source, record.id, v, oldValue);
+            }else{
+                record.reject();
+            }
+        }
+    },
+
+    // private
+    getProperty : function(row){
+       return this.store.getAt(row);
+    },
+
+    // private
+    isEditableValue: function(val){
+        return Ext.isPrimitive(val) || Ext.isDate(val);
+    },
+
+    // private
+    setValue : function(prop, value, create){
+        var r = this.getRec(prop);
+        if(r){
+            r.set('value', value);
+            this.source[prop] = value;
+        }else if(create){
+            // only create if specified.
+            this.source[prop] = value;
+            r = new Ext.grid.PropertyRecord({name: prop, value: value}, prop);
+            this.store.add(r);
+
+        }
+    },
+    
+    // private
+    remove : function(prop){
+        var r = this.getRec(prop);
+        if(r){
+            this.store.remove(r);
+            delete this.source[prop];
+        }
+    },
+    
+    // private
+    getRec : function(prop){
+        return this.store.getById(prop);
+    },
+
+    // protected - should only be called by the grid.  Use grid.getSource instead.
+    getSource : function(){
+        return this.source;
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyColumnModel
+ * @extends Ext.grid.ColumnModel
+ * A custom column model for the {@link Ext.grid.PropertyGrid}.  Generally it should not need to be used directly.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyColumnModel = Ext.extend(Ext.grid.ColumnModel, {
+    // private - strings used for locale support
+    nameText : 'Name',
+    valueText : 'Value',
+    dateFormat : 'm/j/Y',
+    trueText: 'true',
+    falseText: 'false',
+    
+    constructor : function(grid, store){
+        var g = Ext.grid,
+	        f = Ext.form;
+	        
+	    this.grid = grid;
+	    g.PropertyColumnModel.superclass.constructor.call(this, [
+	        {header: this.nameText, width:50, sortable: true, dataIndex:'name', id: 'name', menuDisabled:true},
+	        {header: this.valueText, width:50, resizable:false, dataIndex: 'value', id: 'value', menuDisabled:true}
+	    ]);
+	    this.store = store;
+	
+	    var bfield = new f.Field({
+	        autoCreate: {tag: 'select', children: [
+	            {tag: 'option', value: 'true', html: this.trueText},
+	            {tag: 'option', value: 'false', html: this.falseText}
+	        ]},
+	        getValue : function(){
+	            return this.el.dom.value == 'true';
+	        }
+	    });
+	    this.editors = {
+	        'date' : new g.GridEditor(new f.DateField({selectOnFocus:true})),
+	        'string' : new g.GridEditor(new f.TextField({selectOnFocus:true})),
+	        'number' : new g.GridEditor(new f.NumberField({selectOnFocus:true, style:'text-align:left;'})),
+	        'boolean' : new g.GridEditor(bfield, {
+	            autoSize: 'both'
+	        })
+	    };
+	    this.renderCellDelegate = this.renderCell.createDelegate(this);
+	    this.renderPropDelegate = this.renderProp.createDelegate(this);
+    },
+
+    // private
+    renderDate : function(dateVal){
+        return dateVal.dateFormat(this.dateFormat);
+    },
+
+    // private
+    renderBool : function(bVal){
+        return this[bVal ? 'trueText' : 'falseText'];
+    },
+
+    // private
+    isCellEditable : function(colIndex, rowIndex){
+        return colIndex == 1;
+    },
+
+    // private
+    getRenderer : function(col){
+        return col == 1 ?
+            this.renderCellDelegate : this.renderPropDelegate;
+    },
+
+    // private
+    renderProp : function(v){
+        return this.getPropertyName(v);
+    },
+
+    // private
+    renderCell : function(val, meta, rec){
+        var renderer = this.grid.customRenderers[rec.get('name')];
+        if(renderer){
+            return renderer.apply(this, arguments);
+        }
+        var rv = val;
+        if(Ext.isDate(val)){
+            rv = this.renderDate(val);
+        }else if(typeof val == 'boolean'){
+            rv = this.renderBool(val);
+        }
+        return Ext.util.Format.htmlEncode(rv);
+    },
+
+    // private
+    getPropertyName : function(name){
+        var pn = this.grid.propertyNames;
+        return pn && pn[name] ? pn[name] : name;
+    },
+
+    // private
+    getCellEditor : function(colIndex, rowIndex){
+        var p = this.store.getProperty(rowIndex),
+            n = p.data.name, 
+            val = p.data.value;
+        if(this.grid.customEditors[n]){
+            return this.grid.customEditors[n];
+        }
+        if(Ext.isDate(val)){
+            return this.editors.date;
+        }else if(typeof val == 'number'){
+            return this.editors.number;
+        }else if(typeof val == 'boolean'){
+            return this.editors['boolean'];
+        }else{
+            return this.editors.string;
+        }
+    },
+
+    // inherit docs
+    destroy : function(){
+        Ext.grid.PropertyColumnModel.superclass.destroy.call(this);
+        this.destroyEditors(this.editors);
+        this.destroyEditors(this.grid.customEditors);
+    },
+    
+    destroyEditors: function(editors){
+        for(var ed in editors){
+            Ext.destroy(editors[ed]);
+        }
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyGrid
+ * @extends Ext.grid.EditorGridPanel
+ * A specialized grid implementation intended to mimic the traditional property grid as typically seen in
+ * development IDEs.  Each row in the grid represents a property of some object, and the data is stored
+ * as a set of name/value pairs in {@link Ext.grid.PropertyRecord}s.  Example usage:
+ * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    title: 'Properties Grid',
+    autoHeight: true,
+    width: 300,
+    renderTo: 'grid-ct',
+    source: {
+        "(name)": "My Object",
+        "Created": new Date(Date.parse('10/15/2006')),
+        "Available": false,
+        "Version": .01,
+        "Description": "A test object"
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {Object} config The grid config object
+ */
+Ext.grid.PropertyGrid = Ext.extend(Ext.grid.EditorGridPanel, {
+    /**
+    * @cfg {Object} propertyNames An object containing property name/display name pairs.
+    * If specified, the display name will be shown in the name column instead of the property name.
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customEditors An object containing name/value pairs of custom editor type definitions that allow
+    * the grid to support additional types of editable fields.  By default, the grid supports strongly-typed editing
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with a custom input control by specifying a custom editor.  The name of the editor
+    * type should correspond with the name of the property that will use the editor.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customEditors: {
+        'Start Time': new Ext.grid.GridEditor(new Ext.form.TimeField({selectOnFocus:true}))
+    },
+    source: {
+        'Start Time': '10:00 AM'
+    }
+});
+</code></pre>
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customRenderers An object containing name/value pairs of custom renderer type definitions that allow
+    * the grid to support custom rendering of fields.  By default, the grid supports strongly-typed rendering
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with the type of the value.  The name of the renderer type should correspond with the name of the property
+    * that it will render.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customRenderers: {
+        Available: function(v){
+            if(v){
+                return '<span style="color: green;">Yes</span>';
+            }else{
+                return '<span style="color: red;">No</span>';
+            }
+        }
+    },
+    source: {
+        Available: true
+    }
+});
+</code></pre>
+    */
+
+    // private config overrides
+    enableColumnMove:false,
+    stripeRows:false,
+    trackMouseOver: false,
+    clicksToEdit:1,
+    enableHdMenu : false,
+    viewConfig : {
+        forceFit:true
+    },
+
+    // private
+    initComponent : function(){
+        this.customRenderers = this.customRenderers || {};
+        this.customEditors = this.customEditors || {};
+        this.lastEditRow = null;
+        var store = new Ext.grid.PropertyStore(this);
+        this.propStore = store;
+        var cm = new Ext.grid.PropertyColumnModel(this, store);
+        store.store.sort('name', 'ASC');
+        this.addEvents(
+            /**
+             * @event beforepropertychange
+             * Fires before a property value changes.  Handlers can return false to cancel the property change
+             * (this will internally call {@link Ext.data.Record#reject} on the property's record).
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'beforepropertychange',
+            /**
+             * @event propertychange
+             * Fires after a property value has changed.
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'propertychange'
+        );
+        this.cm = cm;
+        this.ds = store.store;
+        Ext.grid.PropertyGrid.superclass.initComponent.call(this);
+
+		this.mon(this.selModel, 'beforecellselect', function(sm, rowIndex, colIndex){
+            if(colIndex === 0){
+                this.startEditing.defer(200, this, [rowIndex, 1]);
+                return false;
+            }
+        }, this);
+    },
+
+    // private
+    onRender : function(){
+        Ext.grid.PropertyGrid.superclass.onRender.apply(this, arguments);
+
+        this.getGridEl().addClass('x-props-grid');
+    },
+
+    // private
+    afterRender: function(){
+        Ext.grid.PropertyGrid.superclass.afterRender.apply(this, arguments);
+        if(this.source){
+            this.setSource(this.source);
+        }
+    },
+
+    /**
+     * Sets the source data object containing the property data.  The data object can contain one or more name/value
+     * pairs representing all of the properties of an object to display in the grid, and this data will automatically
+     * be loaded into the grid's {@link #store}.  The values should be supplied in the proper data type if needed,
+     * otherwise string type will be assumed.  If the grid already contains data, this method will replace any
+     * existing data.  See also the {@link #source} config value.  Example usage:
+     * <pre><code>
+grid.setSource({
+    "(name)": "My Object",
+    "Created": new Date(Date.parse('10/15/2006')),  // date type
+    "Available": false,  // boolean type
+    "Version": .01,      // decimal type
+    "Description": "A test object"
+});
+</code></pre>
+     * @param {Object} source The data object
+     */
+    setSource : function(source){
+        this.propStore.setSource(source);
+    },
+
+    /**
+     * Gets the source data object containing the property data.  See {@link #setSource} for details regarding the
+     * format of the data object.
+     * @return {Object} The data object
+     */
+    getSource : function(){
+        return this.propStore.getSource();
+    },
+    
+    /**
+     * Sets the value of a property.
+     * @param {String} prop The name of the property to set
+     * @param {Mixed} value The value to test
+     * @param {Boolean} create (Optional) True to create the property if it doesn't already exist. Defaults to <tt>false</tt>.
+     */
+    setProperty : function(prop, value, create){
+        this.propStore.setValue(prop, value, create);    
+    },
+    
+    /**
+     * Removes a property from the grid.
+     * @param {String} prop The name of the property to remove
+     */
+    removeProperty : function(prop){
+        this.propStore.remove(prop);
+    }
+
+    /**
+     * @cfg store
+     * @hide
+     */
+    /**
+     * @cfg colModel
+     * @hide
+     */
+    /**
+     * @cfg cm
+     * @hide
+     */
+    /**
+     * @cfg columns
+     * @hide
+     */
+});
+Ext.reg("propertygrid", Ext.grid.PropertyGrid);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/AbstractSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/AbstractSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/AbstractSelectionModel.js	(revision 76)
@@ -0,0 +1,99 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.AbstractSelectionModel
+ * @extends Ext.util.Observable
+ * Abstract base class for grid SelectionModels.  It provides the interface that should be
+ * implemented by descendant classes.  This class should not be directly instantiated.
+ * @constructor
+ */
+Ext.grid.AbstractSelectionModel = Ext.extend(Ext.util.Observable,  {
+    /**
+     * The GridPanel for which this SelectionModel is handling selection. Read-only.
+     * @type Object
+     * @property grid
+     */
+
+    constructor : function(){
+        this.locked = false;
+        Ext.grid.AbstractSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore Called by the grid automatically. Do not call directly. */
+    init : function(grid){
+        this.grid = grid;
+        if(this.lockOnInit){
+            delete this.lockOnInit;
+            this.locked = false;
+            this.lock();
+        }
+        this.initEvents();
+    },
+
+    /**
+     * Locks the selections.
+     */
+    lock : function(){
+        if(!this.locked){
+            this.locked = true;
+            // If the grid has been set, then the view is already initialized.
+            var g = this.grid;
+            if(g){
+                g.getView().on({
+                    scope: this,
+                    beforerefresh: this.sortUnLock,
+                    refresh: this.sortLock
+                });
+            }else{
+                this.lockOnInit = true;
+            }
+        }
+    },
+
+    // set the lock states before and after a view refresh
+    sortLock : function() {
+        this.locked = true;
+    },
+
+    // set the lock states before and after a view refresh
+    sortUnLock : function() {
+        this.locked = false;
+    },
+
+    /**
+     * Unlocks the selections.
+     */
+    unlock : function(){
+        if(this.locked){
+            this.locked = false;
+            var g = this.grid,
+                gv;
+                
+            // If the grid has been set, then the view is already initialized.
+            if(g){
+                gv = g.getView();
+                gv.un('beforerefresh', this.sortUnLock, this);
+                gv.un('refresh', this.sortLock, this);    
+            }else{
+                delete this.lockOnInit;
+            }
+        }
+    },
+
+    /**
+     * Returns true if the selections are locked.
+     * @return {Boolean}
+     */
+    isLocked : function(){
+        return this.locked;
+    },
+
+    destroy: function(){
+        this.unlock();
+        this.purgeListeners();
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/EditorGrid.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/EditorGrid.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/EditorGrid.js	(revision 76)
@@ -0,0 +1,328 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.EditorGridPanel
+ * @extends Ext.grid.GridPanel
+ * <p>This class extends the {@link Ext.grid.GridPanel GridPanel Class} to provide cell editing
+ * on selected {@link Ext.grid.Column columns}. The editable columns are specified by providing
+ * an {@link Ext.grid.ColumnModel#editor editor} in the {@link Ext.grid.Column column configuration}.</p>
+ * <p>Editability of columns may be controlled programatically by inserting an implementation
+ * of {@link Ext.grid.ColumnModel#isCellEditable isCellEditable} into the
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>Editing is performed on the value of the <i>field</i> specified by the column's
+ * <tt>{@link Ext.grid.ColumnModel#dataIndex dataIndex}</tt> in the backing {@link Ext.data.Store Store}
+ * (so if you are using a {@link Ext.grid.ColumnModel#setRenderer renderer} in order to display
+ * transformed data, this must be accounted for).</p>
+ * <p>If a value-to-description mapping is used to render a column, then a {@link Ext.form.Field#ComboBox ComboBox}
+ * which uses the same {@link Ext.form.Field#valueField value}-to-{@link Ext.form.Field#displayFieldField description}
+ * mapping would be an appropriate editor.</p>
+ * If there is a more complex mismatch between the visible data in the grid, and the editable data in
+ * the {@link Edt.data.Store Store}, then code to transform the data both before and after editing can be
+ * injected using the {@link #beforeedit} and {@link #afteredit} events.
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype editorgrid
+ */
+Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    /**
+     * @cfg {Number} clicksToEdit
+     * <p>The number of clicks on a cell required to display the cell's editor (defaults to 2).</p>
+     * <p>Setting this option to 'auto' means that mousedown <i>on the selected cell</i> starts
+     * editing that cell.</p>
+     */
+    clicksToEdit: 2,
+
+    /**
+    * @cfg {Boolean} forceValidation
+    * True to force validation even if the value is unmodified (defaults to false)
+    */
+    forceValidation: false,
+
+    // private
+    isEditor : true,
+    // private
+    detectEdit: false,
+
+    /**
+     * @cfg {Boolean} autoEncode
+     * True to automatically HTML encode and decode values pre and post edit (defaults to false)
+     */
+    autoEncode : false,
+
+    /**
+     * @cfg {Boolean} trackMouseOver @hide
+     */
+    // private
+    trackMouseOver: false, // causes very odd FF errors
+
+    // private
+    initComponent : function(){
+        Ext.grid.EditorGridPanel.superclass.initComponent.call(this);
+
+        if(!this.selModel){
+            /**
+             * @cfg {Object} selModel Any subclass of AbstractSelectionModel that will provide the selection model for
+             * the grid (defaults to {@link Ext.grid.CellSelectionModel} if not specified).
+             */
+            this.selModel = new Ext.grid.CellSelectionModel();
+        }
+
+        this.activeEditor = null;
+
+        this.addEvents(
+            /**
+             * @event beforeedit
+             * Fires before cell editing is triggered. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value for the field being edited.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "beforeedit",
+            /**
+             * @event afteredit
+             * Fires after a cell is edited. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * </ul>
+             *
+             * <pre><code>
+grid.on('afteredit', afterEdit, this );
+
+function afterEdit(e) {
+    // execute an XHR to send/commit data to the server, in callback do (if successful):
+    e.record.commit();
+};
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "afteredit",
+            /**
+             * @event validateedit
+             * Fires after a cell is edited, but before the value is set in the record. Return false
+             * to cancel the change. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * Usage example showing how to remove the red triangle (dirty record indicator) from some
+             * records (not all).  By observing the grid's validateedit event, it can be cancelled if
+             * the edit occurs on a targeted row (for example) and then setting the field's new value
+             * in the Record directly:
+             * <pre><code>
+grid.on('validateedit', function(e) {
+  var myTargetRow = 6;
+
+  if (e.row == myTargetRow) {
+    e.cancel = true;
+    e.record.data[e.field] = e.value;
+  }
+});
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "validateedit"
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.EditorGridPanel.superclass.initEvents.call(this);
+
+        this.getGridEl().on('mousewheel', this.stopEditing.createDelegate(this, [true]), this);
+        this.on('columnresize', this.stopEditing, this, [true]);
+
+        if(this.clicksToEdit == 1){
+            this.on("cellclick", this.onCellDblClick, this);
+        }else {
+            var view = this.getView();
+            if(this.clicksToEdit == 'auto' && view.mainBody){
+                view.mainBody.on('mousedown', this.onAutoEditClick, this);
+            }
+            this.on('celldblclick', this.onCellDblClick, this);
+        }
+    },
+
+    onResize : function(){
+        Ext.grid.EditorGridPanel.superclass.onResize.apply(this, arguments);
+        var ae = this.activeEditor;
+        if(this.editing && ae){
+            ae.realign(true);
+        }
+    },
+
+    // private
+    onCellDblClick : function(g, row, col){
+        this.startEditing(row, col);
+    },
+
+    // private
+    onAutoEditClick : function(e, t){
+        if(e.button !== 0){
+            return;
+        }
+        var row = this.view.findRowIndex(t),
+            col = this.view.findCellIndex(t);
+        if(row !== false && col !== false){
+            this.stopEditing();
+            if(this.selModel.getSelectedCell){ // cell sm
+                var sc = this.selModel.getSelectedCell();
+                if(sc && sc[0] === row && sc[1] === col){
+                    this.startEditing(row, col);
+                }
+            }else{
+                if(this.selModel.isSelected(row)){
+                    this.startEditing(row, col);
+                }
+            }
+        }
+    },
+
+    // private
+    onEditComplete : function(ed, value, startValue){
+        this.editing = false;
+        this.lastActiveEditor = this.activeEditor;
+        this.activeEditor = null;
+
+        var r = ed.record,
+            field = this.colModel.getDataIndex(ed.col);
+        value = this.postEditValue(value, startValue, r, field);
+        if(this.forceValidation === true || String(value) !== String(startValue)){
+            var e = {
+                grid: this,
+                record: r,
+                field: field,
+                originalValue: startValue,
+                value: value,
+                row: ed.row,
+                column: ed.col,
+                cancel:false
+            };
+            if(this.fireEvent("validateedit", e) !== false && !e.cancel && String(value) !== String(startValue)){
+                r.set(field, e.value);
+                delete e.cancel;
+                this.fireEvent("afteredit", e);
+            }
+        }
+        this.view.focusCell(ed.row, ed.col);
+    },
+
+    /**
+     * Starts editing the specified for the specified row/column
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    startEditing : function(row, col){
+        this.stopEditing();
+        if(this.colModel.isCellEditable(col, row)){
+            this.view.ensureVisible(row, col, true);
+            var r = this.store.getAt(row),
+                field = this.colModel.getDataIndex(col),
+                e = {
+                    grid: this,
+                    record: r,
+                    field: field,
+                    value: r.data[field],
+                    row: row,
+                    column: col,
+                    cancel:false
+                };
+            if(this.fireEvent("beforeedit", e) !== false && !e.cancel){
+                this.editing = true;
+                var ed = this.colModel.getCellEditor(col, row);
+                if(!ed){
+                    return;
+                }
+                if(!ed.rendered){
+                    ed.parentEl = this.view.getEditorParent(ed);
+                    ed.on({
+                        scope: this,
+                        render: {
+                            fn: function(c){
+                                c.field.focus(false, true);
+                            },
+                            single: true,
+                            scope: this
+                        },
+                        specialkey: function(field, e){
+                            this.getSelectionModel().onEditorKey(field, e);
+                        },
+                        complete: this.onEditComplete,
+                        canceledit: this.stopEditing.createDelegate(this, [true])
+                    });
+                }
+                Ext.apply(ed, {
+                    row     : row,
+                    col     : col,
+                    record  : r
+                });
+                this.lastEdit = {
+                    row: row,
+                    col: col
+                };
+                this.activeEditor = ed;
+                // Set the selectSameEditor flag if we are reusing the same editor again and
+                // need to prevent the editor from firing onBlur on itself.
+                ed.selectSameEditor = (this.activeEditor == this.lastActiveEditor);
+                var v = this.preEditValue(r, field);
+                ed.startEdit(this.view.getCell(row, col).firstChild, Ext.isDefined(v) ? v : '');
+
+                // Clear the selectSameEditor flag
+                (function(){
+                    delete ed.selectSameEditor;
+                }).defer(50);
+            }
+        }
+    },
+
+    // private
+    preEditValue : function(r, field){
+        var value = r.data[field];
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlDecode(value) : value;
+    },
+
+    // private
+    postEditValue : function(value, originalValue, r, field){
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
+    },
+
+    /**
+     * Stops any active editing
+     * @param {Boolean} cancel (optional) True to cancel any changes
+     */
+    stopEditing : function(cancel){
+        if(this.editing){
+            // Store the lastActiveEditor to check if it is changing
+            var ae = this.lastActiveEditor = this.activeEditor;
+            if(ae){
+                ae[cancel === true ? 'cancelEdit' : 'completeEdit']();
+                this.view.focusCell(ae.row, ae.col);
+            }
+            this.activeEditor = null;
+        }
+        this.editing = false;
+    }
+});
+Ext.reg('editorgrid', Ext.grid.EditorGridPanel);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridEditor.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridEditor.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridEditor.js	(revision 76)
@@ -0,0 +1,21 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridEditor = function(field, config){
+    Ext.grid.GridEditor.superclass.constructor.call(this, field, config);
+    field.monitorTab = false;
+};
+
+Ext.extend(Ext.grid.GridEditor, Ext.Editor, {
+    alignment: "tl-tl",
+    autoSize: "width",
+    hideEl : false,
+    cls: "x-small-editor x-grid-editor",
+    shim:false,
+    shadow:false
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridDD.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridDD.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/GridDD.js	(revision 76)
@@ -0,0 +1,95 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.GridDragZone
+ * @extends Ext.dd.DragZone
+ * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
+ * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
+ * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
+ * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+ * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
+ * to process the {@link #getDragData data} which is provided.
+ */
+Ext.grid.GridDragZone = function(grid, config){
+    this.view = grid.getView();
+    Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
+    this.scroll = false;
+    this.grid = grid;
+    this.ddel = document.createElement('div');
+    this.ddel.className = 'x-grid-dd-wrap';
+};
+
+Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
+    ddGroup : "GridDD",
+
+    /**
+     * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
+     * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
+     * <p>The data object contains the following properties:<ul>
+     * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
+     * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
+     * <li><b>rowIndex</b> : Number<div class="sub-desc">The index of the row which receieved the mousedown gesture which triggered the drag.</div></li>
+     * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
+     * </ul></p>
+     */
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e);
+        var rowIndex = this.view.findRowIndex(t);
+        if(rowIndex !== false){
+            var sm = this.grid.selModel;
+            if(!sm.isSelected(rowIndex) || e.hasModifier()){
+                sm.handleMouseDown(this.grid, rowIndex, e);
+            }
+            return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
+        }
+        return false;
+    },
+
+    /**
+     * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
+     * of the data being dragged.</p>
+     * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
+     */
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.ddel.innerHTML = this.grid.getDragDropText();
+        this.proxy.update(this.ddel);
+        // fire start drag?
+    },
+
+    /**
+     * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
+     * the selected rows to show that they have not been dragged.
+     */
+    afterRepair : function(){
+        this.dragging = false;
+    },
+
+    /**
+     * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
+     * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e, data){
+        return false;
+    },
+
+    onEndDrag : function(data, e){
+        // fire end drag?
+    },
+
+    onValidDrop : function(dd, e, id){
+        // fire drag drop?
+        this.hideProxy();
+    },
+
+    beforeInvalidDrop : function(e, id){
+
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/Column.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/Column.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/Column.js	(revision 76)
@@ -0,0 +1,674 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.grid.Column = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} editable Optional. Defaults to <tt>true</tt>, enabling the configured
+     * <tt>{@link #editor}</tt>.  Set to <tt>false</tt> to initially disable editing on this column.
+     * The initial configuration may be dynamically altered using
+     * {@link Ext.grid.ColumnModel}.{@link Ext.grid.ColumnModel#setEditable setEditable()}.
+     */
+    /**
+     * @cfg {String} id Optional. A name which identifies this column (defaults to the column's initial
+     * ordinal position.) The <tt>id</tt> is used to create a CSS <b>class</b> name which is applied to all
+     * table cells (including headers) in that column (in this context the <tt>id</tt> does not need to be
+     * unique). The class name takes the form of <pre>x-grid3-td-<b>id</b></pre>
+     * Header cells will also receive this class name, but will also have the class <pre>x-grid3-hd</pre>
+     * So, to target header cells, use CSS selectors such as:<pre>.x-grid3-hd-row .x-grid3-td-<b>id</b></pre>
+     * The {@link Ext.grid.GridPanel#autoExpandColumn} grid config option references the column via this
+     * unique identifier.
+     */
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the Grid view.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&amp;#160;'</tt>.
+     */
+    /**
+     * @cfg {Boolean} groupable Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to disable the header menu item to group by the column selected. Defaults to <tt>true</tt>,
+     * which enables the header menu group option.  Set to <tt>false</tt> to disable (but still show) the
+     * group option in the header menu for the column. See also <code>{@link #groupName}</code>.
+     */
+    /**
+     * @cfg {String} groupName Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text with which to prefix the group field value in the group header line.
+     * See also {@link #groupRenderer} and
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#showGroupName showGroupName}.
+     */
+    /**
+     * @cfg {Function} groupRenderer <p>Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the function used to format the grouping field value for display in the group
+     * {@link #groupName header}.  If a <tt><b>groupRenderer</b></tt> is not specified, the configured
+     * <tt><b>{@link #renderer}</b></tt> will be called; if a <tt><b>{@link #renderer}</b></tt> is also not specified
+     * the new value of the group field will be used.</p>
+     * <p>The called function (either the <tt><b>groupRenderer</b></tt> or <tt><b>{@link #renderer}</b></tt>) will be
+     * passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>v</b> : Object<p class="sub-desc">The new value of the group field.</p></li>
+     * <li><b>unused</b> : undefined<p class="sub-desc">Unused parameter.</p></li>
+     * <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">The column index of the group field.</p></li>
+     * <li><b>ds</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></p>
+     * <p>The function should return a string value.</p>
+     */
+    /**
+     * @cfg {String} emptyGroupText Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text to display when there is an empty group value. Defaults to the
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#emptyGroupText emptyGroupText}.
+     */
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * grid's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    /**
+     * @cfg {Number} width
+     * Optional. The initial width in pixels of the column.
+     * The width of each column can also be affected if any of the following are configured:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#forceFit forceFit}</tt>
+     * <div class="sub-desc">
+     * <p>By specifying <tt>forceFit:true</tt>, {@link #fixed non-fixed width} columns will be
+     * re-proportioned (based on the relative initial widths) to fill the width of the grid so
+     * that no horizontal scrollbar is shown.</p>
+     * </div></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#autoFill autoFill}</tt></li>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#minColumnWidth minColumnWidth}</tt></li>
+     * <br><p><b>Note</b>: when the width of each column is determined, a space on the right side
+     * is reserved for the vertical scrollbar.  The
+     * {@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#scrollOffset scrollOffset}</tt>
+     * can be modified to reduce or eliminate the reserved offset.</p>
+     */
+    /**
+     * @cfg {Boolean} sortable Optional. <tt>true</tt> if sorting is to be allowed on this column.
+     * Defaults to the value of the <code>{@link Ext.grid.ColumnModel#defaultSortable}</code> property.
+     * Whether local/remote sorting is used is specified in <code>{@link Ext.data.Store#remoteSort}</code>.
+     */
+    /**
+     * @cfg {Boolean} fixed Optional. <tt>true</tt> if the column width cannot be changed.  Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} resizable Optional. <tt>false</tt> to disable column resizing. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} menuDisabled Optional. <tt>true</tt> to disable the column menu. Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} hidden
+     * Optional. <tt>true</tt> to initially hide this column. Defaults to <tt>false</tt>.
+     * A hidden column {@link Ext.grid.GridPanel#enableColumnHide may be shown via the header row menu}.
+     * If a column is never to be shown, simply do not include this column in the Column Model at all.
+     */
+    /**
+     * @cfg {String} tooltip Optional. A text string to use as the column header's tooltip.  If Quicktips
+     * are enabled, this value will be used as the text of the quick tip, otherwise it will be set as the
+     * header's HTML title attribute. Defaults to ''.
+     */
+    /**
+     * @cfg {Mixed} renderer
+     * <p>For an alternative to specifying a renderer see <code>{@link #xtype}</code></p>
+     * <p>Optional. A renderer is an 'interceptor' method which can be used transform data (value,
+     * appearance, etc.) before it is rendered). This may be specified in either of three ways:
+     * <div class="mdetail-params"><ul>
+     * <li>A renderer function used to return HTML markup for a cell given the cell's data value.</li>
+     * <li>A string which references a property name of the {@link Ext.util.Format} class which
+     * provides a renderer function.</li>
+     * <li>An object specifying both the renderer function, and its execution scope (<tt><b>this</b></tt>
+     * reference) e.g.:<pre style="margin-left:1.2em"><code>
+{
+    fn: this.gridRenderer,
+    scope: this
+}
+</code></pre></li></ul></div>
+     * If not specified, the default renderer uses the raw data value.</p>
+     * <p>For information about the renderer function (passed parameters, etc.), see
+     * {@link Ext.grid.ColumnModel#setRenderer}. An example of specifying renderer function inline:</p><pre><code>
+var companyColumn = {
+   header: 'Company Name',
+   dataIndex: 'company',
+   renderer: function(value, metaData, record, rowIndex, colIndex, store) {
+      // provide the logic depending on business rules
+      // name of your own choosing to manipulate the cell depending upon
+      // the data in the underlying Record object.
+      if (value == 'whatever') {
+          //metaData.css : String : A CSS class name to add to the TD element of the cell.
+          //metaData.attr : String : An html attribute definition string to apply to
+          //                         the data container element within the table
+          //                         cell (e.g. 'style="color:red;"').
+          metaData.css = 'name-of-css-class-you-will-define';
+      }
+      return value;
+   }
+}
+     * </code></pre>
+     * See also {@link #scope}.
+     */
+    /**
+     * @cfg {String} xtype Optional. A String which references a predefined {@link Ext.grid.Column} subclass
+     * type which is preconfigured with an appropriate <code>{@link #renderer}</code> to be easily
+     * configured into a ColumnModel. The predefined {@link Ext.grid.Column} subclass types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>gridcolumn</tt></b> : {@link Ext.grid.Column} (<b>Default</b>)<p class="sub-desc"></p></li>
+     * <li><b><tt>booleancolumn</tt></b> : {@link Ext.grid.BooleanColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>numbercolumn</tt></b> : {@link Ext.grid.NumberColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>datecolumn</tt></b> : {@link Ext.grid.DateColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>templatecolumn</tt></b> : {@link Ext.grid.TemplateColumn}<p class="sub-desc"></p></li>
+     * </ul></div>
+     * <p>Configuration properties for the specified <code>xtype</code> may be specified with
+     * the Column configuration properties, for example:</p>
+     * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    columns: [{
+        header: 'Last Updated',
+        dataIndex: 'lastChange',
+        width: 85,
+        sortable: true,
+        //renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+        xtype: 'datecolumn', // use xtype instead of renderer
+        format: 'M/d/Y' // configuration property for {@link Ext.grid.DateColumn}
+    }, {
+        ...
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} scope Optional. The scope (<tt><b>this</b></tt> reference) in which to execute the
+     * renderer.  Defaults to the Column configuration object.
+     */
+    /**
+     * @cfg {String} align Optional. Set the CSS text-align property of the column.  Defaults to undefined.
+     */
+    /**
+     * @cfg {String} css Optional. An inline style definition string which is applied to all table cells in the column
+     * (excluding headers). Defaults to undefined.
+     */
+    /**
+     * @cfg {Boolean} hideable Optional. Specify as <tt>false</tt> to prevent the user from hiding this column
+     * (defaults to true).  To disallow column hiding globally for all columns in the grid, use
+     * {@link Ext.grid.GridPanel#enableColumnHide} instead.
+     */
+    /**
+     * @cfg {Ext.form.Field} editor Optional. The {@link Ext.form.Field} to use when editing values in this column
+     * if editing is supported by the grid. See <tt>{@link #editable}</tt> also.
+     */
+
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ColumnModel setConfig method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ColumnModel will recreate a new Ext.grid.Column
+     * Defaults to true.
+     */
+    isColumn : true,
+
+    constructor : function(config){
+        Ext.apply(this, config);
+
+        if(Ext.isString(this.renderer)){
+            this.renderer = Ext.util.Format[this.renderer];
+        }else if(Ext.isObject(this.renderer)){
+            this.scope = this.renderer.scope;
+            this.renderer = this.renderer.fn;
+        }
+        if(!this.scope){
+            this.scope = this;
+        }
+
+        var ed = this.editor;
+        delete this.editor;
+        this.setEditor(ed);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this Column is clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event contextmenu
+             * Fires when this Column is right clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event dblclick
+             * Fires when this Column is double clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event mousedown
+             * Fires when this Column receives a mousedown event.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'mousedown'
+        );
+        Ext.grid.Column.superclass.constructor.call(this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        return this.fireEvent(name, this, grid, rowIndex, e);
+    },
+
+    /**
+     * @private
+     * Clean up. Remove any Editor. Remove any listeners.
+     */
+    destroy: function() {
+        if(this.setEditor){
+            this.setEditor(null);
+        }
+        this.purgeListeners();
+    },
+
+    /**
+     * Optional. A function which returns displayable data when passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container
+     * element <i>within</i> the table cell (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was
+     * extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record
+     * was extracted.</p></li>
+     * </ul></div>
+     * @property renderer
+     * @type Function
+     */
+    renderer : function(value){
+        return value;
+    },
+
+    // private
+    getEditor: function(rowIndex){
+        return this.editable !== false ? this.editor : null;
+    },
+
+    /**
+     * Sets a new editor for this column.
+     * @param {Ext.Editor/Ext.form.Field} editor The editor to set
+     */
+    setEditor : function(editor){
+        var ed = this.editor;
+        if(ed){
+            if(ed.gridEditor){
+                ed.gridEditor.destroy();
+                delete ed.gridEditor;
+            }else{
+                ed.destroy();
+            }
+        }
+        this.editor = null;
+        if(editor){
+            //not an instance, create it
+            if(!editor.isXType){
+                editor = Ext.create(editor, 'textfield');
+            }
+            this.editor = editor;
+        }
+    },
+
+    /**
+     * Returns the {@link Ext.Editor editor} defined for this column that was created to wrap the {@link Ext.form.Field Field}
+     * used to edit the cell.
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor}
+     */
+    getCellEditor: function(rowIndex){
+        var ed = this.getEditor(rowIndex);
+        if(ed){
+            if(!ed.startEdit){
+                if(!ed.gridEditor){
+                    ed.gridEditor = new Ext.grid.GridEditor(ed);
+                }
+                ed = ed.gridEditor;
+            }
+        }
+        return ed;
+    }
+});
+
+/**
+ * @class Ext.grid.BooleanColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.grid.Column#xtype xtype}
+ * config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.BooleanColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsy (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsy (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&amp;#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+
+    constructor: function(cfg){
+        Ext.grid.BooleanColumn.superclass.constructor.call(this, cfg);
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        this.renderer = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+    }
+});
+
+/**
+ * @class Ext.grid.NumberColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.NumberColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */
+    format : '0,000.00',
+    constructor: function(cfg){
+        Ext.grid.NumberColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.numberRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.DateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column}
+ * for more details.</p>
+ */
+Ext.grid.DateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Date#format} to format a Date for this Column
+     * (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : 'm/d/Y',
+    constructor: function(cfg){
+        Ext.grid.DateColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.dateRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.TemplateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a value by processing a {@link Ext.data.Record Record}'s
+ * {@link Ext.data.Record#data data} using a {@link #tpl configured} {@link Ext.XTemplate XTemplate}.
+ * See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more
+ * details.</p>
+ */
+Ext.grid.TemplateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String/XTemplate} tpl
+     * An {@link Ext.XTemplate XTemplate}, or an XTemplate <i>definition string</i> to use to process a
+     * {@link Ext.data.Record Record}'s {@link Ext.data.Record#data data} to produce a column's rendered value.
+     */
+    constructor: function(cfg){
+        Ext.grid.TemplateColumn.superclass.constructor.call(this, cfg);
+        var tpl = (!Ext.isPrimitive(this.tpl) && this.tpl.compile) ? this.tpl : new Ext.XTemplate(this.tpl);
+        this.renderer = function(value, p, r){
+            return tpl.apply(r.data);
+        };
+        this.tpl = tpl;
+    }
+});
+
+/**
+ * @class Ext.grid.ActionColumn
+ * @extends Ext.grid.Column
+ * <p>A Grid column type which renders an icon, or a series of icons in a grid cell, and offers a scoped click
+ * handler for each icon. Example usage:</p>
+<pre><code>
+new Ext.grid.GridPanel({
+    store: myStore,
+    columns: [
+        {
+            xtype: 'actioncolumn',
+            width: 50,
+            items: [
+                {
+                    icon   : 'sell.gif',                // Use a URL in the icon config
+                    tooltip: 'Sell stock',
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Sell " + rec.get('company'));
+                    }
+                },
+                {
+                    getClass: function(v, meta, rec) {  // Or return a class from a function
+                        if (rec.get('change') < 0) {
+                            this.items[1].tooltip = 'Do not buy!';
+                            return 'alert-col';
+                        } else {
+                            this.items[1].tooltip = 'Buy stock';
+                            return 'buy-col';
+                        }
+                    },
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Buy " + rec.get('company'));
+                    }
+                }
+            ]
+        }
+        //any other columns here
+    ]
+});
+</pre></code>
+ * <p>The action column can be at any index in the columns array, and a grid can have any number of
+ * action columns. </p>
+ */
+Ext.grid.ActionColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} icon
+     * The URL of an image to display as the clickable element in the column. 
+     * Optional - defaults to <code>{@link Ext#BLANK_IMAGE_URL Ext.BLANK_IMAGE_URL}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a <code>{@link #getClass}</code> function.
+     */
+    /**
+     * @cfg {Function} handler A function called when the icon is clicked.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>grid</code> : GridPanel<div class="sub-desc">The owning GridPanel.</div></li>
+     * <li><code>rowIndex</code> : Number<div class="sub-desc">The row index clicked on.</div></li>
+     * <li><code>colIndex</code> : Number<div class="sub-desc">The column index clicked on.</div></li>
+     * <li><code>item</code> : Object<div class="sub-desc">The clicked item (or this Column if multiple 
+     * {@link #items} were not configured).</div></li>
+     * <li><code>e</code> : Event<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * and <code>{@link #getClass}</code> fuctions are executed. Defaults to this Column.
+     */
+    /**
+     * @cfg {String} tooltip A tooltip message to be displayed on hover. {@link Ext.QuickTips#init Ext.QuickTips} must have 
+     * been initialized.
+     */
+    /**
+     * @cfg {Boolean} stopSelection Defaults to <code>true</code>. Prevent grid <i>row</i> selection upon mousedown.
+     */
+    /**
+     * @cfg {Function} getClass A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<div class="mdetail-params"><ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Array} items An Array which may contain multiple icon definitions, each element of which may contain:
+     * <div class="mdetail-params"><ul>
+     * <li><code>icon</code> : String<div class="sub-desc">The url of an image to display as the clickable element 
+     * in the column.</div></li>
+     * <li><code>iconCls</code> : String<div class="sub-desc">A CSS class to apply to the icon image.
+     * To determine the class dynamically, configure the item with a <code>getClass</code> function.</div></li>
+     * <li><code>getClass</code> : Function<div class="sub-desc">A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></li>
+     * <li><code>handler</code> : Function<div class="sub-desc">A function called when the icon is clicked.</div></li>
+     * <li><code>scope</code> : Scope<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the 
+     * <code>handler</code> and <code>getClass</code> functions are executed. Fallback defaults are this Column's
+     * configured scope, then this Column.</div></li>
+     * <li><code>tooltip</code> : String<div class="sub-desc">A tooltip message to be displayed on hover. 
+     * {@link Ext.QuickTips#init Ext.QuickTips} must have been initialized.</div></li>
+     * </ul></div>
+     */
+    header: '&#160;',
+
+    actionIdRe: /x-action-col-(\d+)/,
+    
+    /**
+     * @cfg {String} altText The alt text to use for the image element. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+
+    constructor: function(cfg) {
+        var me = this,
+            items = cfg.items || (me.items = [me]),
+            l = items.length,
+            i,
+            item;
+
+        Ext.grid.ActionColumn.superclass.constructor.call(me, cfg);
+
+//      Renderer closure iterates through items creating an <img> element for each and tagging with an identifying 
+//      class name x-action-col-{n}
+        me.renderer = function(v, meta) {
+//          Allow a configured renderer to create initial value (And set the other values in the "metadata" argument!)
+            v = Ext.isFunction(cfg.renderer) ? cfg.renderer.apply(this, arguments)||'' : '';
+
+            meta.css += ' x-action-col-cell';
+            for (i = 0; i < l; i++) {
+                item = items[i];
+                v += '<img alt="' + (item.altText || me.altText) + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
+                    '" class="x-action-col-icon x-action-col-' + String(i) + ' ' + (item.iconCls || '') +
+                    ' ' + (Ext.isFunction(item.getClass) ? item.getClass.apply(item.scope||this.scope||this, arguments) : '') + '"' +
+                    ((item.tooltip) ? ' ext:qtip="' + item.tooltip + '"' : '') + ' />';
+            }
+            return v;
+        };
+    },
+
+    destroy: function() {
+        delete this.items;
+        delete this.renderer;
+        return Ext.grid.ActionColumn.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Also fires any configured click handlers. By default, cancels the mousedown event to prevent selection.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        var m = e.getTarget().className.match(this.actionIdRe),
+            item, fn;
+        if (m && (item = this.items[parseInt(m[1], 10)])) {
+            if (name == 'click') {
+                (fn = item.handler || this.handler) && fn.call(item.scope||this.scope||this, grid, rowIndex, colIndex, item, e);
+            } else if ((name == 'mousedown') && (item.stopSelection !== false)) {
+                return false;
+            }
+        }
+        return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments);
+    }
+});
+
+/*
+ * @property types
+ * @type Object
+ * @member Ext.grid.Column
+ * @static
+ * <p>An object containing predefined Column classes keyed by a mnemonic code which may be referenced
+ * by the {@link Ext.grid.ColumnModel#xtype xtype} config option of ColumnModel.</p>
+ * <p>This contains the following properties</p><div class="mdesc-details"><ul>
+ * <li>gridcolumn : <b>{@link Ext.grid.Column Column constructor}</b></li>
+ * <li>booleancolumn : <b>{@link Ext.grid.BooleanColumn BooleanColumn constructor}</b></li>
+ * <li>numbercolumn : <b>{@link Ext.grid.NumberColumn NumberColumn constructor}</b></li>
+ * <li>datecolumn : <b>{@link Ext.grid.DateColumn DateColumn constructor}</b></li>
+ * <li>templatecolumn : <b>{@link Ext.grid.TemplateColumn TemplateColumn constructor}</b></li>
+ * </ul></div>
+ */
+Ext.grid.Column.types = {
+    gridcolumn : Ext.grid.Column,
+    booleancolumn: Ext.grid.BooleanColumn,
+    numbercolumn: Ext.grid.NumberColumn,
+    datecolumn: Ext.grid.DateColumn,
+    templatecolumn: Ext.grid.TemplateColumn,
+    actioncolumn: Ext.grid.ActionColumn
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/RowSelectionModel.js	(revision 76)
@@ -0,0 +1,541 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.RowSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * The default SelectionModel used by {@link Ext.grid.GridPanel}.
+ * It supports multiple selections and keyboard selection/navigation. The objects stored
+ * as selections and returned by {@link #getSelected}, and {@link #getSelections} are
+ * the {@link Ext.data.Record Record}s which provide the data for the selected rows.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.RowSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    /**
+     * @cfg {Boolean} singleSelect
+     * <tt>true</tt> to allow selection of only one row at a time (defaults to <tt>false</tt>
+     * allowing multiple selections)
+     */
+    singleSelect : false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.selections = new Ext.util.MixedCollection(false, function(o){
+            return o.id;
+        });
+
+        this.last = false;
+        this.lastActive = false;
+
+        this.addEvents(
+	        /**
+	         * @event selectionchange
+	         * Fires when the selection changes
+	         * @param {SelectionModel} this
+	         */
+	        'selectionchange',
+	        /**
+	         * @event beforerowselect
+	         * Fires before a row is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The index to be selected
+	         * @param {Boolean} keepExisting False if other selections will be cleared
+	         * @param {Record} record The record to be selected
+	         */
+	        'beforerowselect',
+	        /**
+	         * @event rowselect
+	         * Fires when a row is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected index
+	         * @param {Ext.data.Record} r The selected record
+	         */
+	        'rowselect',
+	        /**
+	         * @event rowdeselect
+	         * Fires when a row is deselected.  To prevent deselection
+	         * {@link Ext.grid.AbstractSelectionModel#lock lock the selections}. 
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex
+	         * @param {Record} record
+	         */
+	        'rowdeselect'
+        );
+        Ext.grid.RowSelectionModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Boolean} moveEditorOnEnter
+     * <tt>false</tt> to turn off moving the editor to the next row down when the enter key is pressed
+     * or the next row up when shift + enter keys are pressed.
+     */
+    // private
+    initEvents : function(){
+
+        if(!this.grid.enableDragDrop && !this.grid.enableDrag){
+            this.grid.on('rowmousedown', this.handleMouseDown, this);
+        }
+
+        this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
+            up: this.onKeyPress, 
+            down: this.onKeyPress,
+            scope: this
+        });
+
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onRefresh,
+            rowupdated: this.onRowUpdated,
+            rowremoved: this.onRemove
+        });
+    },
+    
+    onKeyPress : function(e, name){
+        var up = name == 'up',
+            method = up ? 'selectPrevious' : 'selectNext',
+            add = up ? -1 : 1,
+            last;
+        if(!e.shiftKey || this.singleSelect){
+            this[method](false);
+        }else if(this.last !== false && this.lastActive !== false){
+            last = this.last;
+            this.selectRange(this.last,  this.lastActive + add);
+            this.grid.getView().focusRow(this.lastActive);
+            if(last !== false){
+                this.last = last;
+            }
+        }else{
+           this.selectFirstRow();
+        }
+    },
+
+    // private
+    onRefresh : function(){
+        var ds = this.grid.store,
+            s = this.getSelections(),
+            i = 0,
+            len = s.length, 
+            index, r;
+            
+        this.silent = true;
+        this.clearSelections(true);
+        for(; i < len; i++){
+            r = s[i];
+            if((index = ds.indexOfId(r.id)) != -1){
+                this.selectRow(index, true);
+            }
+        }
+        if(s.length != this.selections.getCount()){
+            this.fireEvent('selectionchange', this);
+        }
+        this.silent = false;
+    },
+
+    // private
+    onRemove : function(v, index, r){
+        if(this.selections.remove(r) !== false){
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    onRowUpdated : function(v, index, r){
+        if(this.isSelected(r)){
+            v.onRowSelect(index);
+        }
+    },
+
+    /**
+     * Select records.
+     * @param {Array} records The records to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectRecords : function(records, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        var ds = this.grid.store,
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            this.selectRow(ds.indexOf(records[i]), true);
+        }
+    },
+
+    /**
+     * Gets the number of selected rows.
+     * @return {Number}
+     */
+    getCount : function(){
+        return this.selections.length;
+    },
+
+    /**
+     * Selects the first row in the grid.
+     */
+    selectFirstRow : function(){
+        this.selectRow(0);
+    },
+
+    /**
+     * Select the last row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectLastRow : function(keepExisting){
+        this.selectRow(this.grid.store.getCount() - 1, keepExisting);
+    },
+
+    /**
+     * Selects the row immediately following the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a next row, else <tt>false</tt>
+     */
+    selectNext : function(keepExisting){
+        if(this.hasNext()){
+            this.selectRow(this.last+1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Selects the row that precedes the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a previous row, else <tt>false</tt>
+     */
+    selectPrevious : function(keepExisting){
+        if(this.hasPrevious()){
+            this.selectRow(this.last-1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Returns true if there is a next record to select
+     * @return {Boolean}
+     */
+    hasNext : function(){
+        return this.last !== false && (this.last+1) < this.grid.store.getCount();
+    },
+
+    /**
+     * Returns true if there is a previous record to select
+     * @return {Boolean}
+     */
+    hasPrevious : function(){
+        return !!this.last;
+    },
+
+
+    /**
+     * Returns the selected records
+     * @return {Array} Array of selected records
+     */
+    getSelections : function(){
+        return [].concat(this.selections.items);
+    },
+
+    /**
+     * Returns the first selected record.
+     * @return {Record}
+     */
+    getSelected : function(){
+        return this.selections.itemAt(0);
+    },
+
+    /**
+     * Calls the passed function with each selection. If the function returns
+     * <tt>false</tt>, iteration is stopped and this function returns
+     * <tt>false</tt>. Otherwise it returns <tt>true</tt>.
+     * @param {Function} fn The function to call upon each iteration. It is passed the selected {@link Ext.data.Record Record}.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this RowSelectionModel.
+     * @return {Boolean} true if all selections were iterated
+     */
+    each : function(fn, scope){
+        var s = this.getSelections(),
+            i = 0,
+            len = s.length;
+            
+        for(; i < len; i++){
+            if(fn.call(scope || this, s[i], i) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Clears all selections if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * @param {Boolean} fast (optional) <tt>true</tt> to bypass the
+     * conditional checks and events described in {@link #deselectRow}.
+     */
+    clearSelections : function(fast){
+        if(this.isLocked()){
+            return;
+        }
+        if(fast !== true){
+            var ds = this.grid.store,
+                s = this.selections;
+            s.each(function(r){
+                this.deselectRow(ds.indexOfId(r.id));
+            }, this);
+            s.clear();
+        }else{
+            this.selections.clear();
+        }
+        this.last = false;
+    },
+
+
+    /**
+     * Selects all rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}. 
+     */
+    selectAll : function(){
+        if(this.isLocked()){
+            return;
+        }
+        this.selections.clear();
+        for(var i = 0, len = this.grid.store.getCount(); i < len; i++){
+            this.selectRow(i, true);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selections.length > 0;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified row is selected.
+     * @param {Number/Record} index The record or index of the record to check
+     * @return {Boolean}
+     */
+    isSelected : function(index){
+        var r = Ext.isNumber(index) ? this.grid.store.getAt(index) : index;
+        return (r && this.selections.key(r.id) ? true : false);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified record id is selected.
+     * @param {String} id The id of record to check
+     * @return {Boolean}
+     */
+    isIdSelected : function(id){
+        return (this.selections.key(id) ? true : false);
+    },
+
+    // private
+    handleMouseDown : function(g, rowIndex, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        var view = this.grid.getView();
+        if(e.shiftKey && !this.singleSelect && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, rowIndex, e.ctrlKey);
+            this.last = last; // reset the last
+            view.focusRow(rowIndex);
+        }else{
+            var isSelected = this.isSelected(rowIndex);
+            if(e.ctrlKey && isSelected){
+                this.deselectRow(rowIndex);
+            }else if(!isSelected || this.getCount() > 1){
+                this.selectRow(rowIndex, e.ctrlKey || e.shiftKey);
+                view.focusRow(rowIndex);
+            }
+        }
+    },
+
+    /**
+     * Selects multiple rows.
+     * @param {Array} rows Array of the indexes of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep
+     * existing selections (defaults to <tt>false</tt>)
+     */
+    selectRows : function(rows, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        for(var i = 0, len = rows.length; i < len; i++){
+            this.selectRow(rows[i], true);
+        }
+    },
+
+    /**
+     * Selects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * All rows in between startRow and endRow are also selected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(startRow, endRow, keepExisting){
+        var i;
+        if(this.isLocked()){
+            return;
+        }
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        if(startRow <= endRow){
+            for(i = startRow; i <= endRow; i++){
+                this.selectRow(i, true);
+            }
+        }else{
+            for(i = startRow; i >= endRow; i--){
+                this.selectRow(i, true);
+            }
+        }
+    },
+
+    /**
+     * Deselects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.  
+     * All rows in between startRow and endRow are also deselected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     */
+    deselectRange : function(startRow, endRow, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        for(var i = startRow; i <= endRow; i++){
+            this.deselectRow(i, preventViewNotify);
+        }
+    },
+
+    /**
+     * Selects a row.  Before selecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked} and fires the
+     * {@link #beforerowselect} event.  If these checks are satisfied the row
+     * will be selected and followed up by  firing the {@link #rowselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} row The index of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    selectRow : function(index, keepExisting, preventViewNotify){
+        if(this.isLocked() || (index < 0 || index >= this.grid.store.getCount()) || (keepExisting && this.isSelected(index))){
+            return;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r && this.fireEvent('beforerowselect', this, index, keepExisting, r) !== false){
+            if(!keepExisting || this.singleSelect){
+                this.clearSelections();
+            }
+            this.selections.add(r);
+            this.last = this.lastActive = index;
+            if(!preventViewNotify){
+                this.grid.getView().onRowSelect(index);
+            }
+            if(!this.silent){
+                this.fireEvent('rowselect', this, index, r);
+                this.fireEvent('selectionchange', this);
+            }
+        }
+    },
+
+    /**
+     * Deselects a row.  Before deselecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked}.
+     * If this check is satisfied the row will be deselected and followed up by
+     * firing the {@link #rowdeselect} and {@link #selectionchange} events.
+     * @param {Number} row The index of the row to deselect
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    deselectRow : function(index, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        if(this.last == index){
+            this.last = false;
+        }
+        if(this.lastActive == index){
+            this.lastActive = false;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r){
+            this.selections.remove(r);
+            if(!preventViewNotify){
+                this.grid.getView().onRowDeselect(index);
+            }
+            this.fireEvent('rowdeselect', this, index, r);
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    },
+
+    // private
+    onEditorKey : function(field, e){
+        var k = e.getKey(), 
+            newCell, 
+            g = this.grid, 
+            last = g.lastEdit,
+            ed = g.activeEditor,
+            shift = e.shiftKey,
+            ae, last, r, c;
+            
+        if(k == e.TAB){
+            e.stopEvent();
+            ed.completeEdit();
+            if(shift){
+                newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
+            }else{
+                newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
+            }
+        }else if(k == e.ENTER){
+            if(this.moveEditorOnEnter !== false){
+                if(shift){
+                    newCell = g.walkCells(last.row - 1, last.col, -1, this.acceptsNav, this);
+                }else{
+                    newCell = g.walkCells(last.row + 1, last.col, 1, this.acceptsNav, this);
+                }
+            }
+        }
+        if(newCell){
+            r = newCell[0];
+            c = newCell[1];
+
+            this.onEditorSelect(r, last.row);
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+            }
+            g.startEditing(r, c);
+        }
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    },
+    
+    destroy : function(){
+        Ext.destroy(this.rowNav);
+        this.rowNav = null;
+        Ext.grid.RowSelectionModel.superclass.destroy.call(this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGridView.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGridView.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/grid/PivotGridView.js	(revision 76)
@@ -0,0 +1,453 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.grid.PivotGridView
+ * @extends Ext.grid.GridView
+ * Specialised GridView for rendering Pivot Grid components. Config can be passed to the PivotGridView via the PivotGrid constructor's
+ * viewConfig option:
+<pre><code>
+new Ext.grid.PivotGrid({
+    viewConfig: {
+        title: 'My Pivot Grid',
+        getCellCls: function(value) {
+            return value > 10 'red' : 'green';
+        }
+    }
+});
+</code></pre>
+ * <p>Currently {@link #title} and {@link #getCellCls} are the only configuration options accepted by PivotGridView. All other 
+ * interaction is performed via the {@link Ext.grid.PivotGrid PivotGrid} class.</p>
+ */
+Ext.grid.PivotGridView = Ext.extend(Ext.grid.GridView, {
+    
+    /**
+     * The CSS class added to all group header cells. Defaults to 'grid-hd-group-cell'
+     * @property colHeaderCellCls
+     * @type String
+     */
+    colHeaderCellCls: 'grid-hd-group-cell',
+    
+    /**
+     * @cfg {String} title Optional title to be placed in the top left corner of the PivotGrid. Defaults to an empty string.
+     */
+    title: '',
+    
+    /**
+     * @cfg {Function} getCellCls Optional function which should return a CSS class name for each cell value. This is useful when
+     * color coding cells based on their value. Defaults to undefined.
+     */
+    
+    /**
+     * Returns the headers to be rendered at the top of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of columns it groups (column in this case refers to normal grid columns). In the example below we have 5 city groups, which are
+     * each part of a continent supergroup. The colspan for each city group refers to the number of normal grid columns that group spans,
+     * so in this case the grid would be expected to have a total of 12 columns:
+<pre><code>
+[
+    {
+        items: [
+            {header: 'England',   colspan: 5},
+            {header: 'USA',       colspan: 3}
+        ]
+    },
+    {
+        items: [
+            {header: 'London',    colspan: 2},
+            {header: 'Cambridge', colspan: 3},
+            {header: 'Palo Alto', colspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     */
+    getColumnHeaders: function() {
+        return this.grid.topAxis.buildHeaders();;
+    },
+    
+    /**
+     * Returns the headers to be rendered on the left of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of rows it groups. In the example below we have 5 city groups, which are each part of a continent supergroup. The rowspan for each 
+     * city group refers to the number of normal grid columns that group spans, so in this case the grid would be expected to have a 
+     * total of 12 rows:
+<pre><code>
+[
+    {
+        width: 90,
+        items: [
+            {header: 'England',   rowspan: 5},
+            {header: 'USA',       rowspan: 3}
+        ]
+    },
+    {
+        width: 50,
+        items: [
+            {header: 'London',    rowspan: 2},
+            {header: 'Cambridge', rowspan: 3},
+            {header: 'Palo Alto', rowspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     * Each group may specify the width it should be rendered with.
+     * @return {Array} The row groups
+     */
+    getRowHeaders: function() {
+        return this.grid.leftAxis.buildHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid          = this.grid,
+            rows          = grid.extractData(),
+            rowCount      = rows.length,
+            templates     = this.templates,
+            renderer      = grid.renderer,
+            hasRenderer   = typeof renderer == 'function',
+            getCellCls    = this.getCellCls,
+            hasGetCellCls = typeof getCellCls == 'function',
+            cellTemplate  = templates.cell,
+            rowTemplate   = templates.row,
+            rowBuffer     = [],
+            meta          = {},
+            tstyle        = 'width:' + this.getGridInnerWidth() + 'px;',
+            colBuffer, colCount, column, i, row;
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            colCount  = row.length;
+            colBuffer = [];
+            
+            //build up each column's HTML
+            for (var j = 0; j < colCount; j++) {
+                
+                meta.id    = i + '-' + j;
+                meta.css   = j === 0 ? 'x-grid3-cell-first ' : (j == (colCount - 1) ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.value = row[j];
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+                
+                if (hasRenderer) {
+                    meta.value = renderer(meta.value);
+                }
+                
+                if (hasGetCellCls) {
+                    meta.css += getCellCls(meta.value) + ' ';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+            
+            rowBuffer[rowBuffer.length] = rowTemplate.apply({
+                tstyle: tstyle,
+                cols  : colCount,
+                cells : colBuffer.join(""),
+                alt   : ''
+            });
+        }
+        
+        return rowBuffer.join("");
+    },
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3 x-pivotgrid" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-title"><span>{title}</span></div>',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}"></div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-row-headers"></div>',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * @private
+     * Adds a gcell template to the internal templates object. This is used to render the headers in a multi-level column header.
+     */
+    initTemplates: function() {
+        Ext.grid.PivotGridView.superclass.initTemplates.apply(this, arguments);
+        
+        var templates = this.templates || {};
+        if (!templates.gcell) {
+            templates.gcell = new Ext.XTemplate(
+                '<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} ' + this.colHeaderCellCls + '" style="{style}">',
+                    '<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '', '{value}',
+                    '</div>',
+                '</td>'
+            );
+        }
+        
+        this.templates = templates;
+        this.hrowRe = new RegExp("ux-grid-hd-group-row-(\\d+)", "");
+    },
+    
+    /**
+     * @private
+     * Sets up the reference to the row headers element
+     */
+    initElements: function() {
+        Ext.grid.PivotGridView.superclass.initElements.apply(this, arguments);
+        
+        /**
+         * @property rowHeadersEl
+         * @type Ext.Element
+         * The element containing all row headers
+         */
+        this.rowHeadersEl = new Ext.Element(this.scroller.child('div.x-grid3-row-headers'));
+        
+        /**
+         * @property headerTitleEl
+         * @type Ext.Element
+         * The element that contains the optional title (top left section of the pivot grid)
+         */
+        this.headerTitleEl = new Ext.Element(this.mainHd.child('div.x-grid3-header-title'));
+    },
+    
+    /**
+     * @private
+     * Takes row headers into account when calculating total available width
+     */
+    getGridInnerWidth: function() {
+        var previousWidth = Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this, arguments);
+        
+        return previousWidth - this.getTotalRowHeaderWidth();
+    },
+    
+    /**
+     * Returns the total width of all row headers as specified by {@link #getRowHeaders}
+     * @return {Number} The total width
+     */
+    getTotalRowHeaderWidth: function() {
+        var headers = this.getRowHeaders(),
+            length  = headers.length,
+            total   = 0,
+            i;
+        
+        for (i = 0; i< length; i++) {
+            total += headers[i].width;
+        }
+        
+        return total;
+    },
+    
+    /**
+     * @private
+     * Returns the total height of all column headers
+     * @return {Number} The total height
+     */
+    getTotalColumnHeaderHeight: function() {
+        return this.getColumnHeaders().length * 21;
+    },
+    
+    /**
+     * Inherit docs
+     * @private
+     * @param {HTMLElement} el
+     */
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe),
+                data;
+ 
+            if (match && (data = match[1])) {
+                return parseInt(data.split('-')[1], 10);
+            }
+        }
+        return false;
+    },
+    
+    
+    /**
+     * @private
+     * Slight specialisation of the GridView renderUI - just adds the row headers
+     */
+    renderUI : function() {
+        var templates  = this.templates,
+            innerWidth = this.getGridInnerWidth();
+            
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            ostyle: 'width:' + innerWidth + 'px',
+            bstyle: 'width:' + innerWidth + 'px'
+        });
+    },
+    
+    /**
+     * @private
+     * Make sure that the headers and rows are all sized correctly during layout
+     */
+    onLayout: function(width, height) {
+        Ext.grid.PivotGridView.superclass.onLayout.apply(this, arguments);
+        
+        var width = this.getGridInnerWidth();
+        
+        this.resizeColumnHeaders(width);
+        this.resizeAllRows(width);
+    },
+    
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+        
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getGridInnerWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+    
+    /**
+     * @private
+     * Bypasses GridView's renderHeaders as they are taken care of separately by the PivotAxis instances
+     */
+    renderHeaders: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Taken care of by PivotAxis
+     */
+    fitColumns: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Called on layout, ensures that the width of each column header is correct. Omitting this can lead to faulty
+     * layouts when nested in a container.
+     * @param {Number} width The new width
+     */
+    resizeColumnHeaders: function(width) {
+        var topAxis = this.grid.topAxis;
+        
+        if (topAxis.rendered) {
+            topAxis.el.setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Sets the row header div to the correct width. Should be called after rendering and reconfiguration of headers
+     */
+    resizeRowHeaders: function() {
+        var rowHeaderWidth = this.getTotalRowHeaderWidth(),
+            marginStyle    = String.format("margin-left: {0}px;", rowHeaderWidth);
+        
+        this.rowHeadersEl.setWidth(rowHeaderWidth);
+        this.mainBody.applyStyles(marginStyle);
+        Ext.fly(this.innerHd).applyStyles(marginStyle);
+        
+        this.headerTitleEl.setWidth(rowHeaderWidth);
+        this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight());
+    },
+    
+    /**
+     * @private
+     * Resizes all rendered rows to the given width. Usually called by onLayout
+     * @param {Number} width The new width
+     */
+    resizeAllRows: function(width) {
+        var rows   = this.getRows(),
+            length = rows.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            Ext.fly(rows[i]).setWidth(width);
+            Ext.fly(rows[i]).child('table').setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Updates the Row Headers, deferring the updating of Column Headers to GridView
+     */
+    updateHeaders: function() {
+        this.renderGroupRowHeaders();
+        this.renderGroupColumnHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders all row header groups at all levels based on the structure fetched from {@link #getGroupRowHeaders}
+     */
+    renderGroupRowHeaders: function() {
+        var leftAxis = this.grid.leftAxis;
+        
+        this.resizeRowHeaders();
+        leftAxis.rendered = false;
+        leftAxis.render(this.rowHeadersEl);
+        
+        this.setTitle(this.title);
+    },
+    
+    /**
+     * Sets the title text in the top left segment of the PivotGridView
+     * @param {String} title The title
+     */
+    setTitle: function(title) {
+        this.headerTitleEl.child('span').dom.innerHTML = title;
+    },
+    
+    /**
+     * @private
+     * Renders all column header groups at all levels based on the structure fetched from {@link #getColumnHeaders}
+     */
+    renderGroupColumnHeaders: function() {
+        var topAxis = this.grid.topAxis;
+        
+        topAxis.rendered = false;
+        topAxis.render(this.innerHd.firstChild);
+    },
+    
+    /**
+     * @private
+     * Overridden to test whether the user is hovering over a group cell, in which case we don't show the menu
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return true;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/DatePicker.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/DatePicker.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/DatePicker.js	(revision 76)
@@ -0,0 +1,795 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.DatePicker
+ * @extends Ext.Component
+ * <p>A popup date picker. This class is used by the {@link Ext.form.DateField DateField} class
+ * to allow browsing and selection of valid dates.</p>
+ * <p>All the string values documented below may be overridden by including an Ext locale file in
+ * your page.</p>
+ * @constructor
+ * Create a new DatePicker
+ * @param {Object} config The config object
+ * @xtype datepicker
+ */
+Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} todayText
+     * The text to display on the button that selects the current date (defaults to <code>'Today'</code>)
+     */
+    todayText : 'Today',
+    /**
+     * @cfg {String} okText
+     * The text to display on the ok button (defaults to <code>'&#160;OK&#160;'</code> to give the user extra clicking room)
+     */
+    okText : '&#160;OK&#160;',
+    /**
+     * @cfg {String} cancelText
+     * The text to display on the cancel button (defaults to <code>'Cancel'</code>)
+     */
+    cancelText : 'Cancel',
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this picker.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">This DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<code><b>this</b></code> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DatePicker instance.
+     */
+    /**
+     * @cfg {String} todayTip
+     * A string used to format the message for displaying in a tooltip over the button that
+     * selects the current date. Defaults to <code>'{0} (Spacebar)'</code> where
+     * the <code>{0}</code> token is replaced by today's date.
+     */
+    todayTip : '{0} (Spacebar)',
+    /**
+     * @cfg {String} minText
+     * The error text to display if the minDate validation fails (defaults to <code>'This date is before the minimum date'</code>)
+     */
+    minText : 'This date is before the minimum date',
+    /**
+     * @cfg {String} maxText
+     * The error text to display if the maxDate validation fails (defaults to <code>'This date is after the maximum date'</code>)
+     */
+    maxText : 'This date is after the maximum date',
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <code>'m/d/y'</code>).
+     */
+    format : 'm/d/y',
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <code>'Disabled'</code>)
+     */
+    disabledDaysText : 'Disabled',
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <code>'Disabled'</code>)
+     */
+    disabledDatesText : 'Disabled',
+    /**
+     * @cfg {Array} monthNames
+     * An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)
+     */
+    monthNames : Date.monthNames,
+    /**
+     * @cfg {Array} dayNames
+     * An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)
+     */
+    dayNames : Date.dayNames,
+    /**
+     * @cfg {String} nextText
+     * The next month navigation button tooltip (defaults to <code>'Next Month (Control+Right)'</code>)
+     */
+    nextText : 'Next Month (Control+Right)',
+    /**
+     * @cfg {String} prevText
+     * The previous month navigation button tooltip (defaults to <code>'Previous Month (Control+Left)'</code>)
+     */
+    prevText : 'Previous Month (Control+Left)',
+    /**
+     * @cfg {String} monthYearText
+     * The header month selector tooltip (defaults to <code>'Choose a month (Control+Up/Down to move years)'</code>)
+     */
+    monthYearText : 'Choose a month (Control+Up/Down to move years)',
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    /**
+     * @cfg {Boolean} showToday
+     * False to hide the footer area containing the Today button and disable the keyboard handler for spacebar
+     * that selects the current date (defaults to <code>true</code>).
+     */
+    showToday : true,
+    /**
+     * @cfg {Date} minDate
+     * Minimum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Date} maxDate
+     * Maximum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).
+     */
+    /**
+     * @cfg {RegExp} disabledDatesRE
+     * JavaScript regular expression used to disable a pattern of dates (defaults to null).  The {@link #disabledDates}
+     * config will generate this regex internally, but if you specify disabledDatesRE it will take precedence over the
+     * disabledDates value.
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of 'dates' to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:
+     * <ul>
+     * <li>['03/08/2003', '09/16/2003'] would disable those exact dates</li>
+     * <li>['03/08', '09/16'] would disable those days for every year</li>
+     * <li>['^03/08'] would only match the beginning (useful if you are using short years)</li>
+     * <li>['03/../2006'] would disable every day in March 2006</li>
+     * <li>['^03'] would disable every day in every March</li>
+     * </ul>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a date format that has '.' in it, you will have to
+     * escape the dot when restricting dates. For example: ['03\\.08\\.03'].
+     */
+
+    // private
+    // Set by other components to stop the picker focus being updated when the value changes.
+    focusOnSelect: true,
+
+    // default value used to initialise each date in the DatePicker
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initHour: 12, // 24-hour format
+
+    // private
+    initComponent : function(){
+        Ext.DatePicker.superclass.initComponent.call(this);
+
+        this.value = this.value ?
+                 this.value.clearTime(true) : new Date().clearTime();
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected
+             * @param {DatePicker} this DatePicker
+             * @param {Date} date The selected date
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler,  this.scope || this);
+        }
+
+        this.initDisabledDays();
+    },
+
+    // private
+    initDisabledDays : function(){
+        if(!this.disabledDatesRE && this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = '(?:';
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array/RegExp} disabledDates An array of date strings (see the {@link #disabledDates} config
+     * for details on supported values), or a JavaScript regular expression used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        if(Ext.isArray(dd)){
+            this.disabledDates = dd;
+            this.disabledDatesRE = null;
+        }else{
+            this.disabledDatesRE = dd;
+        }
+        this.initDisabledDays();
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the {@link #disabledDays} config
+     * for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #minDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinDate : function(dt){
+        this.minDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #maxDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxDate : function(dt){
+        this.maxDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Sets the value of the date field
+     * @param {Date} value The date to set
+     */
+    setValue : function(value){
+        this.value = value.clearTime(true);
+        this.update(this.value);
+    },
+
+    /**
+     * Gets the current selected value of the date field
+     * @return {Date} The selected date
+     */
+    getValue : function(){
+        return this.value;
+    },
+
+    // private
+    focus : function(){
+        this.update(this.activeDate);
+    },
+
+    // private
+    onEnable: function(initial){
+        Ext.DatePicker.superclass.onEnable.call(this);
+        this.doDisabled(false);
+        this.update(initial ? this.value : this.activeDate);
+        if(Ext.isIE){
+            this.el.repaint();
+        }
+
+    },
+
+    // private
+    onDisable : function(){
+        Ext.DatePicker.superclass.onDisable.call(this);
+        this.doDisabled(true);
+        if(Ext.isIE && !Ext.isIE8){
+            /* Really strange problem in IE6/7, when disabled, have to explicitly
+             * repaint each of the nodes to get them to display correctly, simply
+             * calling repaint on the main element doesn't appear to be enough.
+             */
+             Ext.each([].concat(this.textNodes, this.el.query('th span')), function(el){
+                 Ext.fly(el).repaint();
+             });
+        }
+    },
+
+    // private
+    doDisabled : function(disabled){
+        this.keyNav.setDisabled(disabled);
+        this.prevRepeater.setDisabled(disabled);
+        this.nextRepeater.setDisabled(disabled);
+        if(this.showToday){
+            this.todayKeyListener.setDisabled(disabled);
+            this.todayBtn.setDisabled(disabled);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        var m = [
+             '<table cellspacing="0">',
+                '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr>',
+                '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],
+                dn = this.dayNames,
+                i;
+        for(i = 0; i < 7; i++){
+            var d = this.startDay+i;
+            if(d > 6){
+                d = d-7;
+            }
+            m.push('<th><span>', dn[d].substr(0,1), '</span></th>');
+        }
+        m[m.length] = '</tr></thead><tbody><tr>';
+        for(i = 0; i < 42; i++) {
+            if(i % 7 === 0 && i !== 0){
+                m[m.length] = '</tr><tr>';
+            }
+            m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
+        }
+        m.push('</tr></tbody></table></td></tr>',
+                this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '',
+                '</table><div class="x-date-mp"></div>');
+
+        var el = document.createElement('div');
+        el.className = 'x-date-picker';
+        el.innerHTML = m.join('');
+
+        container.dom.insertBefore(el, position);
+
+        this.el = Ext.get(el);
+        this.eventEl = Ext.get(el.firstChild);
+
+        this.prevRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-left a'), {
+            handler: this.showPrevMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.nextRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-right a'), {
+            handler: this.showNextMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.monthPicker = this.el.down('div.x-date-mp');
+        this.monthPicker.enableDisplayMode('block');
+
+        this.keyNav = new Ext.KeyNav(this.eventEl, {
+            'left' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevMonth();
+                }else{
+                    this.update(this.activeDate.add('d', -1));
+                }
+            },
+
+            'right' : function(e){
+                if(e.ctrlKey){
+                    this.showNextMonth();
+                }else{
+                    this.update(this.activeDate.add('d', 1));
+                }
+            },
+
+            'up' : function(e){
+                if(e.ctrlKey){
+                    this.showNextYear();
+                }else{
+                    this.update(this.activeDate.add('d', -7));
+                }
+            },
+
+            'down' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevYear();
+                }else{
+                    this.update(this.activeDate.add('d', 7));
+                }
+            },
+
+            'pageUp' : function(e){
+                this.showNextMonth();
+            },
+
+            'pageDown' : function(e){
+                this.showPrevMonth();
+            },
+
+            'enter' : function(e){
+                e.stopPropagation();
+                return true;
+            },
+
+            scope : this
+        });
+
+        this.el.unselectable();
+
+        this.cells = this.el.select('table.x-date-inner tbody td');
+        this.textNodes = this.el.query('table.x-date-inner tbody span');
+
+        this.mbtn = new Ext.Button({
+            text: '&#160;',
+            tooltip: this.monthYearText,
+            renderTo: this.el.child('td.x-date-middle', true)
+        });
+        this.mbtn.el.child('em').addClass('x-btn-arrow');
+
+        if(this.showToday){
+            this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,  this);
+            var today = (new Date()).dateFormat(this.format);
+            this.todayBtn = new Ext.Button({
+                renderTo: this.el.child('td.x-date-bottom', true),
+                text: String.format(this.todayText, today),
+                tooltip: String.format(this.todayTip, today),
+                handler: this.selectToday,
+                scope: this
+            });
+        }
+        this.mon(this.eventEl, 'mousewheel', this.handleMouseWheel, this);
+        this.mon(this.eventEl, 'click', this.handleDateClick,  this, {delegate: 'a.x-date-date'});
+        this.mon(this.mbtn, 'click', this.showMonthPicker, this);
+        this.onEnable(true);
+    },
+
+    // private
+    createMonthPicker : function(){
+        if(!this.monthPicker.dom.firstChild){
+            var buf = ['<table border="0" cellspacing="0">'];
+            for(var i = 0; i < 6; i++){
+                buf.push(
+                    '<tr><td class="x-date-mp-month"><a href="#">', Date.getShortMonthName(i), '</a></td>',
+                    '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', Date.getShortMonthName(i + 6), '</a></td>',
+                    i === 0 ?
+                    '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
+                    '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
+                );
+            }
+            buf.push(
+                '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
+                    this.okText,
+                    '</button><button type="button" class="x-date-mp-cancel">',
+                    this.cancelText,
+                    '</button></td></tr>',
+                '</table>'
+            );
+            this.monthPicker.update(buf.join(''));
+
+            this.mon(this.monthPicker, 'click', this.onMonthClick, this);
+            this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
+
+            this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
+            this.mpYears = this.monthPicker.select('td.x-date-mp-year');
+
+            this.mpMonths.each(function(m, a, i){
+                i += 1;
+                if((i%2) === 0){
+                    m.dom.xmonth = 5 + Math.round(i * 0.5);
+                }else{
+                    m.dom.xmonth = Math.round((i-1) * 0.5);
+                }
+            });
+        }
+    },
+
+    // private
+    showMonthPicker : function(){
+        if(!this.disabled){
+            this.createMonthPicker();
+            var size = this.el.getSize();
+            this.monthPicker.setSize(size);
+            this.monthPicker.child('table').setSize(size);
+
+            this.mpSelMonth = (this.activeDate || this.value).getMonth();
+            this.updateMPMonth(this.mpSelMonth);
+            this.mpSelYear = (this.activeDate || this.value).getFullYear();
+            this.updateMPYear(this.mpSelYear);
+
+            this.monthPicker.slideIn('t', {duration:0.2});
+        }
+    },
+
+    // private
+    updateMPYear : function(y){
+        this.mpyear = y;
+        var ys = this.mpYears.elements;
+        for(var i = 1; i <= 10; i++){
+            var td = ys[i-1], y2;
+            if((i%2) === 0){
+                y2 = y + Math.round(i * 0.5);
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }else{
+                y2 = y - (5-Math.round(i * 0.5));
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }
+            this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        }
+    },
+
+    // private
+    updateMPMonth : function(sm){
+        this.mpMonths.each(function(m, a, i){
+            m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        });
+    },
+
+    // private
+    selectMPMonth : function(m){
+
+    },
+
+    // private
+    onMonthClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if(el.is('button.x-date-mp-cancel')){
+            this.hideMonthPicker();
+        }
+        else if(el.is('button.x-date-mp-ok')){
+            var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
+            if(d.getMonth() != this.mpSelMonth){
+                // 'fix' the JS rolling date conversion if needed
+                d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
+            }
+            this.update(d);
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-month', 2))){
+            this.mpMonths.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelMonth = pn.dom.xmonth;
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.mpYears.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelYear = pn.dom.xyear;
+        }
+        else if(el.is('a.x-date-mp-prev')){
+            this.updateMPYear(this.mpyear-10);
+        }
+        else if(el.is('a.x-date-mp-next')){
+            this.updateMPYear(this.mpyear+10);
+        }
+    },
+
+    // private
+    onMonthDblClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if((pn = el.up('td.x-date-mp-month', 2))){
+            this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+    },
+
+    // private
+    hideMonthPicker : function(disableAnim){
+        if(this.monthPicker){
+            if(disableAnim === true){
+                this.monthPicker.hide();
+            }else{
+                this.monthPicker.slideOut('t', {duration:0.2});
+            }
+        }
+    },
+
+    // private
+    showPrevMonth : function(e){
+        this.update(this.activeDate.add('mo', -1));
+    },
+
+    // private
+    showNextMonth : function(e){
+        this.update(this.activeDate.add('mo', 1));
+    },
+
+    // private
+    showPrevYear : function(){
+        this.update(this.activeDate.add('y', -1));
+    },
+
+    // private
+    showNextYear : function(){
+        this.update(this.activeDate.add('y', 1));
+    },
+
+    // private
+    handleMouseWheel : function(e){
+        e.stopEvent();
+        if(!this.disabled){
+            var delta = e.getWheelDelta();
+            if(delta > 0){
+                this.showPrevMonth();
+            } else if(delta < 0){
+                this.showNextMonth();
+            }
+        }
+    },
+
+    // private
+    handleDateClick : function(e, t){
+        e.stopEvent();
+        if(!this.disabled && t.dateValue && !Ext.fly(t.parentNode).hasClass('x-date-disabled')){
+            this.cancelFocus = this.focusOnSelect === false;
+            this.setValue(new Date(t.dateValue));
+            delete this.cancelFocus;
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    selectToday : function(){
+        if(this.todayBtn && !this.todayBtn.disabled){
+            this.setValue(new Date().clearTime());
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    update : function(date, forceRefresh){
+        if(this.rendered){
+            var vd = this.activeDate, vis = this.isVisible();
+            this.activeDate = date;
+            if(!forceRefresh && vd && this.el){
+                var t = date.getTime();
+                if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
+                    this.cells.removeClass('x-date-selected');
+                    this.cells.each(function(c){
+                       if(c.dom.firstChild.dateValue == t){
+                           c.addClass('x-date-selected');
+                           if(vis && !this.cancelFocus){
+                               Ext.fly(c.dom.firstChild).focus(50);
+                           }
+                           return false;
+                       }
+                    }, this);
+                    return;
+                }
+            }
+            var days = date.getDaysInMonth(),
+                firstOfMonth = date.getFirstDateOfMonth(),
+                startingPos = firstOfMonth.getDay()-this.startDay;
+
+            if(startingPos < 0){
+                startingPos += 7;
+            }
+            days += startingPos;
+
+            var pm = date.add('mo', -1),
+                prevStart = pm.getDaysInMonth()-startingPos,
+                cells = this.cells.elements,
+                textEls = this.textNodes,
+                // convert everything to numbers so it's fast
+                d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart, this.initHour)),
+                today = new Date().clearTime().getTime(),
+                sel = date.clearTime(true).getTime(),
+                min = this.minDate ? this.minDate.clearTime(true) : Number.NEGATIVE_INFINITY,
+                max = this.maxDate ? this.maxDate.clearTime(true) : Number.POSITIVE_INFINITY,
+                ddMatch = this.disabledDatesRE,
+                ddText = this.disabledDatesText,
+                ddays = this.disabledDays ? this.disabledDays.join('') : false,
+                ddaysText = this.disabledDaysText,
+                format = this.format;
+
+            if(this.showToday){
+                var td = new Date().clearTime(),
+                    disable = (td < min || td > max ||
+                    (ddMatch && format && ddMatch.test(td.dateFormat(format))) ||
+                    (ddays && ddays.indexOf(td.getDay()) != -1));
+
+                if(!this.disabled){
+                    this.todayBtn.setDisabled(disable);
+                    this.todayKeyListener[disable ? 'disable' : 'enable']();
+                }
+            }
+
+            var setCellClass = function(cal, cell){
+                cell.title = '';
+                var t = d.clearTime(true).getTime();
+                cell.firstChild.dateValue = t;
+                if(t == today){
+                    cell.className += ' x-date-today';
+                    cell.title = cal.todayText;
+                }
+                if(t == sel){
+                    cell.className += ' x-date-selected';
+                    if(vis){
+                        Ext.fly(cell.firstChild).focus(50);
+                    }
+                }
+                // disabling
+                if(t < min) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.minText;
+                    return;
+                }
+                if(t > max) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.maxText;
+                    return;
+                }
+                if(ddays){
+                    if(ddays.indexOf(d.getDay()) != -1){
+                        cell.title = ddaysText;
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+                if(ddMatch && format){
+                    var fvalue = d.dateFormat(format);
+                    if(ddMatch.test(fvalue)){
+                        cell.title = ddText.replace('%0', fvalue);
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+            };
+
+            var i = 0;
+            for(; i < startingPos; i++) {
+                textEls[i].innerHTML = (++prevStart);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-prevday';
+                setCellClass(this, cells[i]);
+            }
+            for(; i < days; i++){
+                var intDay = i - startingPos + 1;
+                textEls[i].innerHTML = (intDay);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-active';
+                setCellClass(this, cells[i]);
+            }
+            var extraDays = 0;
+            for(; i < 42; i++) {
+                 textEls[i].innerHTML = (++extraDays);
+                 d.setDate(d.getDate()+1);
+                 cells[i].className = 'x-date-nextday';
+                 setCellClass(this, cells[i]);
+            }
+
+            this.mbtn.setText(this.monthNames[date.getMonth()] + ' ' + date.getFullYear());
+
+            if(!this.internalRender){
+                var main = this.el.dom.firstChild,
+                    w = main.offsetWidth;
+                this.el.setWidth(w + this.el.getBorderWidth('lr'));
+                Ext.fly(main).setWidth(w);
+                this.internalRender = true;
+                // opera does not respect the auto grow header center column
+                // then, after it gets a width opera refuses to recalculate
+                // without a second pass
+                if(Ext.isOpera && !this.secondPass){
+                    main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + 'px';
+                    this.secondPass = true;
+                    this.update.defer(10, this, [date]);
+                }
+            }
+        }
+    },
+
+    // private
+    beforeDestroy : function() {
+        if(this.rendered){
+            Ext.destroy(
+                this.keyNav,
+                this.monthPicker,
+                this.eventEl,
+                this.mbtn,
+                this.nextRepeater,
+                this.prevRepeater,
+                this.cells.el,
+                this.todayBtn
+            );
+            delete this.textNodes;
+            delete this.cells.elements;
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+Ext.reg('datepicker', Ext.DatePicker);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Button.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Button.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Button.js	(revision 76)
@@ -0,0 +1,849 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Button
+ * @extends Ext.BoxComponent
+ * Simple Button class
+ * @cfg {String} text The button text to be used as innerHTML (html tags are accepted)
+ * @cfg {String} icon The path to an image to display in the button (the image will be set as the background-image
+ * CSS property of the button by default, so if you want a mixed icon/text button, set cls:'x-btn-text-icon')
+ * @cfg {Function} handler A function called when the button is clicked (can be used instead of click event).
+ * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+ * <li><code>b</code> : Button<div class="sub-desc">This Button.</div></li>
+ * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+ * </ul></div>
+ * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width).
+ * See also {@link Ext.Panel}.<tt>{@link Ext.Panel#minButtonWidth minButtonWidth}</tt>.
+ * @cfg {String/Object} tooltip The tooltip for the button - can be a string to be used as innerHTML (html tags are accepted) or QuickTips config object
+ * @cfg {Boolean} hidden True to start hidden (defaults to false)
+ * @cfg {Boolean} disabled True to start disabled (defaults to false)
+ * @cfg {Boolean} pressed True to start pressed (only if enableToggle = true)
+ * @cfg {String} toggleGroup The group this toggle button is a member of (only 1 per group can be pressed)
+ * @cfg {Boolean/Object} repeat True to repeat fire the click event while the mouse is down. This can also be
+ * a {@link Ext.util.ClickRepeater ClickRepeater} config object (defaults to false).
+ * @constructor
+ * Create a new button
+ * @param {Object} config The config object
+ * @xtype button
+ */
+Ext.Button = Ext.extend(Ext.BoxComponent, {
+    /**
+     * Read-only. True if this button is hidden
+     * @type Boolean
+     */
+    hidden : false,
+    /**
+     * Read-only. True if this button is disabled
+     * @type Boolean
+     */
+    disabled : false,
+    /**
+     * Read-only. True if this button is pressed (only if enableToggle = true)
+     * @type Boolean
+     */
+    pressed : false,
+
+    /**
+     * @cfg {Number} tabIndex Set a DOM tabIndex for this button (defaults to undefined)
+     */
+
+    /**
+     * @cfg {Boolean} allowDepress
+     * False to not allow a pressed Button to be depressed (defaults to undefined). Only valid when {@link #enableToggle} is true.
+     */
+
+    /**
+     * @cfg {Boolean} enableToggle
+     * True to enable pressed/not pressed toggling (defaults to false)
+     */
+    enableToggle : false,
+    /**
+     * @cfg {Function} toggleHandler
+     * Function called when a Button with {@link #enableToggle} set to true is clicked. Two arguments are passed:<ul class="mdetail-params">
+     * <li><b>button</b> : Ext.Button<div class="sub-desc">this Button object</div></li>
+     * <li><b>state</b> : Boolean<div class="sub-desc">The next state of the Button, true means pressed.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {Mixed} menu
+     * Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).
+     */
+    /**
+     * @cfg {String} menuAlign
+     * The position to align the menu to (see {@link Ext.Element#alignTo} for more details, defaults to 'tl-bl?').
+     */
+    menuAlign : 'tl-bl?',
+
+    /**
+     * @cfg {String} overflowText If used in a {@link Ext.Toolbar Toolbar}, the
+     * text to be used if this item is shown in the overflow menu. See also
+     * {@link Ext.Toolbar.Item}.<code>{@link Ext.Toolbar.Item#overflowText overflowText}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A css class which sets a background image to be used as the icon for this button
+     */
+    /**
+     * @cfg {String} type
+     * submit, reset or button - defaults to 'button'
+     */
+    type : 'button',
+
+    // private
+    menuClassTarget : 'tr:nth(2)',
+
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will fire the handler of the button. This can be any valid event name (dblclick, contextmenu).
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent : 'click',
+
+    /**
+     * @cfg {Boolean} handleMouseEvents
+     * False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)
+     */
+    handleMouseEvents : true,
+
+    /**
+     * @cfg {String} tooltipType
+     * The type of tooltip to use. Either 'qtip' (default) for QuickTips or 'title' for title attribute.
+     */
+    tooltipType : 'qtip',
+
+    /**
+     * @cfg {String} buttonSelector
+     * <p>(Optional) A {@link Ext.DomQuery DomQuery} selector which is used to extract the active, clickable element from the
+     * DOM structure created.</p>
+     * <p>When a custom {@link #template} is used, you  must ensure that this selector results in the selection of
+     * a focussable element.</p>
+     * <p>Defaults to <b><tt>'button:first-child'</tt></b>.</p>
+     */
+    buttonSelector : 'button:first-child',
+
+    /**
+     * @cfg {String} scale
+     * <p>(Optional) The size of the Button. Three values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'small'<div class="sub-desc">Results in the button element being 16px high.</div></li>
+     * <li>'medium'<div class="sub-desc">Results in the button element being 24px high.</div></li>
+     * <li>'large'<div class="sub-desc">Results in the button element being 32px high.</div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'small'</tt></b>.</p>
+     */
+    scale : 'small',
+
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> and <code>{@link #toggleHandler}</code> is
+     * executed. Defaults to this Button.
+     */
+
+    /**
+     * @cfg {String} iconAlign
+     * <p>(Optional) The side of the Button box to render the icon. Four values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'top'<div class="sub-desc"></div></li>
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * <li>'left'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'left'</tt></b>.</p>
+     */
+    iconAlign : 'left',
+
+    /**
+     * @cfg {String} arrowAlign
+     * <p>(Optional) The side of the Button box to render the arrow if the button has an associated {@link #menu}.
+     * Two values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'right'</tt></b>.</p>
+     */
+    arrowAlign : 'right',
+
+    /**
+     * @cfg {Ext.Template} template (Optional)
+     * <p>A {@link Ext.Template Template} used to create the Button's DOM structure.</p>
+     * Instances, or subclasses which need a different DOM structure may provide a different
+     * template layout in conjunction with an implementation of {@link #getTemplateArgs}.
+     * @type Ext.Template
+     * @property template
+     */
+    /**
+     * @cfg {String} cls
+     * A CSS class string to apply to the button's main element.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object associated with this Button when configured with the {@link #menu} config option.
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * By default, if a width is not specified the button will attempt to stretch horizontally to fit its content.
+     * If the button is being managed by a width sizing layout (hbox, fit, anchor), set this to false to prevent
+     * the button from doing this automatic sizing.
+     * Defaults to <tt>undefined</tt>.
+     */
+
+    initComponent : function(){
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+        
+        Ext.Button.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this button is clicked
+             * @param {Button} this
+             * @param {EventObject} e The click event
+             */
+            'click',
+            /**
+             * @event toggle
+             * Fires when the 'pressed' state of this button changes (only if enableToggle = true)
+             * @param {Button} this
+             * @param {Boolean} pressed
+             */
+            'toggle',
+            /**
+             * @event mouseover
+             * Fires when the mouse hovers over the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseout',
+            /**
+             * @event menushow
+             * If this button has a menu, this event fires when it is shown
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menushow',
+            /**
+             * @event menuhide
+             * If this button has a menu, this event fires when it is hidden
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menuhide',
+            /**
+             * @event menutriggerover
+             * If this button has a menu, this event fires when the mouse enters the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerover',
+            /**
+             * @event menutriggerout
+             * If this button has a menu, this event fires when the mouse leaves the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerout'
+        );
+        
+        if(Ext.isString(this.toggleGroup)){
+            this.enableToggle = true;
+        }
+    },
+
+/**
+  * <p>This method returns an Array which provides substitution parameters for the {@link #template Template} used
+  * to create this Button's DOM structure.</p>
+  * <p>Instances or subclasses which use a different Template to create a different DOM structure may need to provide their
+  * own implementation of this method.</p>
+  * <p>The default implementation which provides data for the default {@link #template} returns an Array containing the
+  * following items:</p><div class="mdetail-params"><ul>
+  * <li>The &lt;button&gt;'s {@link #type}</li>
+  * <li>A CSS class name applied to the Button's main &lt;tbody&gt; element which determines the button's scale and icon alignment.</li>
+  * <li>A CSS class to determine the presence and position of an arrow icon. (<code>'x-btn-arrow'</code> or <code>'x-btn-arrow-bottom'</code> or <code>''</code>)</li>
+  * <li>The {@link #cls} CSS class name applied to the button's wrapping &lt;table&gt; element.</li>
+  * <li>The Component id which is applied to the button's wrapping &lt;table&gt; element.</li>
+  * </ul></div>
+  * @return {Array} Substitution data for a Template.
+ */
+    getTemplateArgs : function(){
+        return [this.type, 'x-btn-' + this.scale + ' x-btn-icon-' + this.scale + '-' + this.iconAlign, this.getMenuClass(), this.cls, this.id];
+    },
+
+    // private
+    setButtonClass : function(){
+        if(this.useSetClass){
+            if(!Ext.isEmpty(this.oldCls)){
+                this.el.removeClass([this.oldCls, 'x-btn-pressed']);
+            }
+            this.oldCls = (this.iconCls || this.icon) ? (this.text ? 'x-btn-text-icon' : 'x-btn-icon') : 'x-btn-noicon';
+            this.el.addClass([this.oldCls, this.pressed ? 'x-btn-pressed' : null]);
+        }
+    },
+
+    // protected
+    getMenuClass : function(){
+        return this.menu ? (this.arrowAlign != 'bottom' ? 'x-btn-arrow' : 'x-btn-arrow-bottom') : '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.template){
+            if(!Ext.Button.buttonTemplate){
+                // hideous table template
+                Ext.Button.buttonTemplate = new Ext.Template(
+                    '<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
+                    '<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',
+                    '</tbody></table>');
+                Ext.Button.buttonTemplate.compile();
+            }
+            this.template = Ext.Button.buttonTemplate;
+        }
+
+        var btn, targs = this.getTemplateArgs();
+
+        if(position){
+            btn = this.template.insertBefore(position, targs, true);
+        }else{
+            btn = this.template.append(ct, targs, true);
+        }
+        /**
+         * An {@link Ext.Element Element} encapsulating the Button's clickable element. By default,
+         * this references a <tt>&lt;button&gt;</tt> element. Read only.
+         * @type Ext.Element
+         * @property btnEl
+         */
+        this.btnEl = btn.child(this.buttonSelector);
+        this.mon(this.btnEl, {
+            scope: this,
+            focus: this.onFocus,
+            blur: this.onBlur
+        });
+
+        this.initButtonEl(btn, this.btnEl);
+
+        Ext.ButtonToggleMgr.register(this);
+    },
+
+    // private
+    initButtonEl : function(btn, btnEl){
+        this.el = btn;
+        this.setIcon(this.icon);
+        this.setText(this.text);
+        this.setIconClass(this.iconCls);
+        if(Ext.isDefined(this.tabIndex)){
+            btnEl.dom.tabIndex = this.tabIndex;
+        }
+        if(this.tooltip){
+            this.setTooltip(this.tooltip, true);
+        }
+
+        if(this.handleMouseEvents){
+            this.mon(btn, {
+                scope: this,
+                mouseover: this.onMouseOver,
+                mousedown: this.onMouseDown
+            });
+
+            // new functionality for monitoring on the document level
+            //this.mon(btn, 'mouseout', this.onMouseOut, this);
+        }
+
+        if(this.menu){
+            this.mon(this.menu, {
+                scope: this,
+                show: this.onMenuShow,
+                hide: this.onMenuHide
+            });
+        }
+
+        if(this.repeat){
+            var repeater = new Ext.util.ClickRepeater(btn, Ext.isObject(this.repeat) ? this.repeat : {});
+            this.mon(repeater, 'click', this.onRepeatClick, this);
+        }else{
+            this.mon(btn, this.clickEvent, this.onClick, this);
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Button.superclass.afterRender.call(this);
+        this.useSetClass = true;
+        this.setButtonClass();
+        this.doc = Ext.getDoc();
+        this.doAutoWidth();
+    },
+
+    /**
+     * Sets the CSS class that provides a background image to use as the button's icon.  This method also changes
+     * the value of the {@link iconCls} config internally.
+     * @param {String} cls The CSS class providing the icon image
+     * @return {Ext.Button} this
+     */
+    setIconClass : function(cls){
+        this.iconCls = cls;
+        if(this.el){
+            this.btnEl.dom.className = '';
+            this.btnEl.addClass(['x-btn-text', cls || '']);
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Sets the tooltip for this Button.
+     * @param {String/Object} tooltip. This may be:<div class="mdesc-details"><ul>
+     * <li><b>String</b> : A string to be used as innerHTML (html tags are accepted) to show in a tooltip</li>
+     * <li><b>Object</b> : A configuration object for {@link Ext.QuickTips#register}.</li>
+     * </ul></div>
+     * @return {Ext.Button} this
+     */
+    setTooltip : function(tooltip, /* private */ initial){
+        if(this.rendered){
+            if(!initial){
+                this.clearTip();
+            }
+            if(Ext.isObject(tooltip)){
+                Ext.QuickTips.register(Ext.apply({
+                      target: this.btnEl.id
+                }, tooltip));
+                this.tooltip = tooltip;
+            }else{
+                this.btnEl.dom[this.tooltipType] = tooltip;
+            }
+        }else{
+            this.tooltip = tooltip;
+        }
+        return this;
+    },
+
+    // private
+    clearTip : function(){
+        if(Ext.isObject(this.tooltip)){
+            Ext.QuickTips.unregister(this.btnEl);
+        }
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.clearTip();
+        }
+        if(this.menu && this.destroyMenu !== false) {
+            Ext.destroy(this.btnEl, this.menu);
+        }
+        Ext.destroy(this.repeater);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.rendered){
+            this.doc.un('mouseover', this.monitorMouseOver, this);
+            this.doc.un('mouseup', this.onMouseUp, this);
+            delete this.doc;
+            delete this.btnEl;
+            Ext.ButtonToggleMgr.unregister(this);
+        }
+        Ext.Button.superclass.onDestroy.call(this);
+    },
+
+    // private
+    doAutoWidth : function(){
+        if(this.autoWidth !== false && this.el && this.text && this.width === undefined){
+            this.el.setWidth('auto');
+            if(Ext.isIE7 && Ext.isStrict){
+                var ib = this.btnEl;
+                if(ib && ib.getWidth() > 20){
+                    ib.clip();
+                    ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));
+                }
+            }
+            if(this.minWidth){
+                if(this.el.getWidth() < this.minWidth){
+                    this.el.setWidth(this.minWidth);
+                }
+            }
+        }
+    },
+
+    /**
+     * Assigns this Button's click handler
+     * @param {Function} handler The function to call when the button is clicked
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+     * Defaults to this Button.
+     * @return {Ext.Button} this
+     */
+    setHandler : function(handler, scope){
+        this.handler = handler;
+        this.scope = scope;
+        return this;
+    },
+
+    /**
+     * Sets this Button's text
+     * @param {String} text The button text
+     * @return {Ext.Button} this
+     */
+    setText : function(text){
+        this.text = text;
+        if(this.el){
+            this.btnEl.update(text || '&#160;');
+            this.setButtonClass();
+        }
+        this.doAutoWidth();
+        return this;
+    },
+
+    /**
+     * Sets the background image (inline style) of the button.  This method also changes
+     * the value of the {@link icon} config internally.
+     * @param {String} icon The path to an image to display in the button
+     * @return {Ext.Button} this
+     */
+    setIcon : function(icon){
+        this.icon = icon;
+        if(this.el){
+            this.btnEl.setStyle('background-image', icon ? 'url(' + icon + ')' : '');
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Gets the text for this Button
+     * @return {String} The button text
+     */
+    getText : function(){
+        return this.text;
+    },
+
+    /**
+     * If a state it passed, it becomes the pressed state otherwise the current state is toggled.
+     * @param {Boolean} state (optional) Force a particular state
+     * @param {Boolean} supressEvent (optional) True to stop events being fired when calling this method.
+     * @return {Ext.Button} this
+     */
+    toggle : function(state, suppressEvent){
+        state = state === undefined ? !this.pressed : !!state;
+        if(state != this.pressed){
+            if(this.rendered){
+                this.el[state ? 'addClass' : 'removeClass']('x-btn-pressed');
+            }
+            this.pressed = state;
+            if(!suppressEvent){
+                this.fireEvent('toggle', this, state);
+                if(this.toggleHandler){
+                    this.toggleHandler.call(this.scope || this, this, state);
+                }
+            }
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.onDisableChange(true);
+    },
+
+    // private
+    onEnable : function(){
+        this.onDisableChange(false);
+    },
+
+    onDisableChange : function(disabled){
+        if(this.el){
+            if(!Ext.isIE6 || !this.text){
+                this.el[disabled ? 'addClass' : 'removeClass'](this.disabledClass);
+            }
+            this.el.dom.disabled = disabled;
+        }
+        this.disabled = disabled;
+    },
+
+    /**
+     * Show this button's menu (if it has one)
+     */
+    showMenu : function(){
+        if(this.rendered && this.menu){
+            if(this.tooltip){
+                Ext.QuickTips.getQuickTip().cancelShow(this.btnEl);
+            }
+            if(this.menu.isVisible()){
+                this.menu.hide();
+            }
+            this.menu.ownerCt = this;
+            this.menu.show(this.el, this.menuAlign);
+        }
+        return this;
+    },
+
+    /**
+     * Hide this button's menu (if it has one)
+     */
+    hideMenu : function(){
+        if(this.hasVisibleMenu()){
+            this.menu.hide();
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the button has a menu and it is visible
+     * @return {Boolean}
+     */
+    hasVisibleMenu : function(){
+        return this.menu && this.menu.ownerCt == this && this.menu.isVisible();
+    },
+    
+    // private
+    onRepeatClick : function(repeat, e){
+        this.onClick(e);
+    },
+
+    // private
+    onClick : function(e){
+        if(e){
+            e.preventDefault();
+        }
+        if(e.button !== 0){
+            return;
+        }
+        if(!this.disabled){
+            this.doToggle();
+            if(this.menu && !this.hasVisibleMenu() && !this.ignoreNextClick){
+                this.showMenu();
+            }
+            this.fireEvent('click', this, e);
+            if(this.handler){
+                //this.el.removeClass('x-btn-over');
+                this.handler.call(this.scope || this, this, e);
+            }
+        }
+    },
+    
+    // private
+    doToggle: function(){
+        if (this.enableToggle && (this.allowDepress !== false || !this.pressed)) {
+            this.toggle();
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    onMouseOver : function(e){
+        if(!this.disabled){
+            var internal = e.within(this.el,  true);
+            if(!internal){
+                this.el.addClass('x-btn-over');
+                if(!this.monitoringMouseOver){
+                    this.doc.on('mouseover', this.monitorMouseOver, this);
+                    this.monitoringMouseOver = true;
+                }
+                this.fireEvent('mouseover', this, e);
+            }
+            if(this.isMenuTriggerOver(e, internal)){
+                this.fireEvent('menutriggerover', this, this.menu, e);
+            }
+        }
+    },
+
+    // private
+    monitorMouseOver : function(e){
+        if(e.target != this.el.dom && !e.within(this.el)){
+            if(this.monitoringMouseOver){
+                this.doc.un('mouseover', this.monitorMouseOver, this);
+                this.monitoringMouseOver = false;
+            }
+            this.onMouseOut(e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        var internal = e.within(this.el) && e.target != this.el.dom;
+        this.el.removeClass('x-btn-over');
+        this.fireEvent('mouseout', this, e);
+        if(this.isMenuTriggerOut(e, internal)){
+            this.fireEvent('menutriggerout', this, this.menu, e);
+        }
+    },
+
+    focus : function() {
+        this.btnEl.focus();
+    },
+
+    blur : function() {
+        this.btnEl.blur();
+    },
+
+    // private
+    onFocus : function(e){
+        if(!this.disabled){
+            this.el.addClass('x-btn-focus');
+        }
+    },
+    // private
+    onBlur : function(e){
+        this.el.removeClass('x-btn-focus');
+    },
+
+    // private
+    getClickEl : function(e, isUp){
+       return this.el;
+    },
+
+    // private
+    onMouseDown : function(e){
+        if(!this.disabled && e.button === 0){
+            this.getClickEl(e).addClass('x-btn-click');
+            this.doc.on('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMouseUp : function(e){
+        if(e.button === 0){
+            this.getClickEl(e, true).removeClass('x-btn-click');
+            this.doc.un('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMenuShow : function(e){
+        if(this.menu.ownerCt == this){
+            this.menu.ownerCt = this;
+            this.ignoreNextClick = 0;
+            this.el.addClass('x-btn-menu-active');
+            this.fireEvent('menushow', this, this.menu);
+        }
+    },
+    // private
+    onMenuHide : function(e){
+        if(this.menu.ownerCt == this){
+            this.el.removeClass('x-btn-menu-active');
+            this.ignoreNextClick = this.restoreClick.defer(250, this);
+            this.fireEvent('menuhide', this, this.menu);
+            delete this.menu.ownerCt;
+        }
+    },
+
+    // private
+    restoreClick : function(){
+        this.ignoreNextClick = 0;
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String/Object} html @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+});
+Ext.reg('button', Ext.Button);
+
+// Private utility class used by Button
+Ext.ButtonToggleMgr = function(){
+   var groups = {};
+
+   function toggleGroup(btn, state){
+       if(state){
+           var g = groups[btn.toggleGroup];
+           for(var i = 0, l = g.length; i < l; i++){
+               if(g[i] != btn){
+                   g[i].toggle(false);
+               }
+           }
+       }
+   }
+
+   return {
+       register : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(!g){
+               g = groups[btn.toggleGroup] = [];
+           }
+           g.push(btn);
+           btn.on('toggle', toggleGroup);
+       },
+
+       unregister : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(g){
+               g.remove(btn);
+               btn.un('toggle', toggleGroup);
+           }
+       },
+
+       /**
+        * Gets the pressed button in the passed group or null
+        * @param {String} group
+        * @return Button
+        */
+       getPressed : function(group){
+           var g = groups[group];
+           if(g){
+               for(var i = 0, len = g.length; i < len; i++){
+                   if(g[i].pressed === true){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Layer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Layer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Layer.js	(revision 76)
@@ -0,0 +1,471 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Layer
+ * @extends Ext.Element
+ * An extended {@link Ext.Element} object that supports a shadow and shim, constrain to viewport and
+ * automatic maintaining of shadow/shim positions.
+ * @cfg {Boolean} shim False to disable the iframe shim in browsers which need one (defaults to true)
+ * @cfg {String/Boolean} shadow True to automatically create an {@link Ext.Shadow}, or a string indicating the
+ * shadow's display {@link Ext.Shadow#mode}. False to disable the shadow. (defaults to false)
+ * @cfg {Object} dh DomHelper object config to create element with (defaults to {tag: 'div', cls: 'x-layer'}).
+ * @cfg {Boolean} constrain False to disable constrain to viewport (defaults to true)
+ * @cfg {String} cls CSS class to add to the element
+ * @cfg {Number} zindex Starting z-index (defaults to 11000)
+ * @cfg {Number} shadowOffset Number of pixels to offset the shadow (defaults to 4)
+ * @cfg {Boolean} useDisplay
+ * Defaults to use css offsets to hide the Layer. Specify <tt>true</tt>
+ * to use css style <tt>'display:none;'</tt> to hide the Layer.
+ * @constructor
+ * @param {Object} config An object with config options.
+ * @param {String/HTMLElement} existingEl (optional) Uses an existing DOM element. If the element is not found it creates it.
+ */
+(function(){
+Ext.Layer = function(config, existingEl){
+    config = config || {};
+    var dh = Ext.DomHelper,
+        cp = config.parentEl, pel = cp ? Ext.getDom(cp) : document.body;
+        
+    if (existingEl) {
+        this.dom = Ext.getDom(existingEl);
+    }
+    if(!this.dom){
+        var o = config.dh || {tag: 'div', cls: 'x-layer'};
+        this.dom = dh.append(pel, o);
+    }
+    if(config.cls){
+        this.addClass(config.cls);
+    }
+    this.constrain = config.constrain !== false;
+    this.setVisibilityMode(Ext.Element.VISIBILITY);
+    if(config.id){
+        this.id = this.dom.id = config.id;
+    }else{
+        this.id = Ext.id(this.dom);
+    }
+    this.zindex = config.zindex || this.getZIndex();
+    this.position('absolute', this.zindex);
+    if(config.shadow){
+        this.shadowOffset = config.shadowOffset || 4;
+        this.shadow = new Ext.Shadow({
+            offset : this.shadowOffset,
+            mode : config.shadow
+        });
+    }else{
+        this.shadowOffset = 0;
+    }
+    this.useShim = config.shim !== false && Ext.useShims;
+    this.useDisplay = config.useDisplay;
+    this.hide();
+};
+
+var supr = Ext.Element.prototype;
+
+// shims are shared among layer to keep from having 100 iframes
+var shims = [];
+
+Ext.extend(Ext.Layer, Ext.Element, {
+
+    getZIndex : function(){
+        return this.zindex || parseInt((this.getShim() || this).getStyle('z-index'), 10) || 11000;
+    },
+
+    getShim : function(){
+        if(!this.useShim){
+            return null;
+        }
+        if(this.shim){
+            return this.shim;
+        }
+        var shim = shims.shift();
+        if(!shim){
+            shim = this.createShim();
+            shim.enableDisplayMode('block');
+            shim.dom.style.display = 'none';
+            shim.dom.style.visibility = 'visible';
+        }
+        var pn = this.dom.parentNode;
+        if(shim.dom.parentNode != pn){
+            pn.insertBefore(shim.dom, this.dom);
+        }
+        shim.setStyle('z-index', this.getZIndex()-2);
+        this.shim = shim;
+        return shim;
+    },
+
+    hideShim : function(){
+        if(this.shim){
+            this.shim.setDisplayed(false);
+            shims.push(this.shim);
+            delete this.shim;
+        }
+    },
+
+    disableShadow : function(){
+        if(this.shadow){
+            this.shadowDisabled = true;
+            this.shadow.hide();
+            this.lastShadowOffset = this.shadowOffset;
+            this.shadowOffset = 0;
+        }
+    },
+
+    enableShadow : function(show){
+        if(this.shadow){
+            this.shadowDisabled = false;
+            if(Ext.isDefined(this.lastShadowOffset)) {
+                this.shadowOffset = this.lastShadowOffset;
+                delete this.lastShadowOffset;
+            }
+            if(show){
+                this.sync(true);
+            }
+        }
+    },
+
+    // private
+    // this code can execute repeatedly in milliseconds (i.e. during a drag) so
+    // code size was sacrificed for effeciency (e.g. no getBox/setBox, no XY calls)
+    sync : function(doShow){
+        var shadow = this.shadow;
+        if(!this.updating && this.isVisible() && (shadow || this.useShim)){
+            var shim = this.getShim(),
+                w = this.getWidth(),
+                h = this.getHeight(),
+                l = this.getLeft(true),
+                t = this.getTop(true);
+
+            if(shadow && !this.shadowDisabled){
+                if(doShow && !shadow.isVisible()){
+                    shadow.show(this);
+                }else{
+                    shadow.realign(l, t, w, h);
+                }
+                if(shim){
+                    if(doShow){
+                       shim.show();
+                    }
+                    // fit the shim behind the shadow, so it is shimmed too
+                    var shadowAdj = shadow.el.getXY(), shimStyle = shim.dom.style,
+                        shadowSize = shadow.el.getSize();
+                    shimStyle.left = (shadowAdj[0])+'px';
+                    shimStyle.top = (shadowAdj[1])+'px';
+                    shimStyle.width = (shadowSize.width)+'px';
+                    shimStyle.height = (shadowSize.height)+'px';
+                }
+            }else if(shim){
+                if(doShow){
+                   shim.show();
+                }
+                shim.setSize(w, h);
+                shim.setLeftTop(l, t);
+            }
+        }
+    },
+
+    // private
+    destroy : function(){
+        this.hideShim();
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.removeAllListeners();
+        Ext.removeNode(this.dom);
+        delete this.dom;
+    },
+
+    remove : function(){
+        this.destroy();
+    },
+
+    // private
+    beginUpdate : function(){
+        this.updating = true;
+    },
+
+    // private
+    endUpdate : function(){
+        this.updating = false;
+        this.sync(true);
+    },
+
+    // private
+    hideUnders : function(negOffset){
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.hideShim();
+    },
+
+    // private
+    constrainXY : function(){
+        if(this.constrain){
+            var vw = Ext.lib.Dom.getViewWidth(),
+                vh = Ext.lib.Dom.getViewHeight();
+            var s = Ext.getDoc().getScroll();
+
+            var xy = this.getXY();
+            var x = xy[0], y = xy[1];
+            var so = this.shadowOffset;
+            var w = this.dom.offsetWidth+so, h = this.dom.offsetHeight+so;
+            // only move it if it needs it
+            var moved = false;
+            // first validate right/bottom
+            if((x + w) > vw+s.left){
+                x = vw - w - so;
+                moved = true;
+            }
+            if((y + h) > vh+s.top){
+                y = vh - h - so;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < s.left){
+                x = s.left;
+                moved = true;
+            }
+            if(y < s.top){
+                y = s.top;
+                moved = true;
+            }
+            if(moved){
+                if(this.avoidY){
+                    var ay = this.avoidY;
+                    if(y <= ay && (y+h) >= ay){
+                        y = ay-h-5;
+                    }
+                }
+                xy = [x, y];
+                this.storeXY(xy);
+                supr.setXY.call(this, xy);
+                this.sync();
+            }
+        }
+        return this;
+    },
+    
+    getConstrainOffset : function(){
+        return this.shadowOffset;    
+    },
+
+    isVisible : function(){
+        return this.visible;
+    },
+
+    // private
+    showAction : function(){
+        this.visible = true; // track visibility to prevent getStyle calls
+        if(this.useDisplay === true){
+            this.setDisplayed('');
+        }else if(this.lastXY){
+            supr.setXY.call(this, this.lastXY);
+        }else if(this.lastLT){
+            supr.setLeftTop.call(this, this.lastLT[0], this.lastLT[1]);
+        }
+    },
+
+    // private
+    hideAction : function(){
+        this.visible = false;
+        if(this.useDisplay === true){
+            this.setDisplayed(false);
+        }else{
+            this.setLeftTop(-10000,-10000);
+        }
+    },
+
+    // overridden Element method
+    setVisible : function(v, a, d, c, e){
+        if(v){
+            this.showAction();
+        }
+        if(a && v){
+            var cb = function(){
+                this.sync(true);
+                if(c){
+                    c();
+                }
+            }.createDelegate(this);
+            supr.setVisible.call(this, true, true, d, cb, e);
+        }else{
+            if(!v){
+                this.hideUnders(true);
+            }
+            var cb = c;
+            if(a){
+                cb = function(){
+                    this.hideAction();
+                    if(c){
+                        c();
+                    }
+                }.createDelegate(this);
+            }
+            supr.setVisible.call(this, v, a, d, cb, e);
+            if(v){
+                this.sync(true);
+            }else if(!a){
+                this.hideAction();
+            }
+        }
+        return this;
+    },
+
+    storeXY : function(xy){
+        delete this.lastLT;
+        this.lastXY = xy;
+    },
+
+    storeLeftTop : function(left, top){
+        delete this.lastXY;
+        this.lastLT = [left, top];
+    },
+
+    // private
+    beforeFx : function(){
+        this.beforeAction();
+        return Ext.Layer.superclass.beforeFx.apply(this, arguments);
+    },
+
+    // private
+    afterFx : function(){
+        Ext.Layer.superclass.afterFx.apply(this, arguments);
+        this.sync(this.isVisible());
+    },
+
+    // private
+    beforeAction : function(){
+        if(!this.updating && this.shadow){
+            this.shadow.hide();
+        }
+    },
+
+    // overridden Element method
+    setLeft : function(left){
+        this.storeLeftTop(left, this.getTop(true));
+        supr.setLeft.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setTop : function(top){
+        this.storeLeftTop(this.getLeft(true), top);
+        supr.setTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setLeftTop : function(left, top){
+        this.storeLeftTop(left, top);
+        supr.setLeftTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setXY : function(xy, a, d, c, e){
+        this.fixDisplay();
+        this.beforeAction();
+        this.storeXY(xy);
+        var cb = this.createCB(c);
+        supr.setXY.call(this, xy, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // private
+    createCB : function(c){
+        var el = this;
+        return function(){
+            el.constrainXY();
+            el.sync(true);
+            if(c){
+                c();
+            }
+        };
+    },
+
+    // overridden Element method
+    setX : function(x, a, d, c, e){
+        this.setXY([x, this.getY()], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setY : function(y, a, d, c, e){
+        this.setXY([this.getX(), y], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setSize : function(w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setSize.call(this, w, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setWidth : function(w, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setWidth.call(this, w, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setHeight : function(h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setHeight.call(this, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setBounds : function(x, y, w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        if(!a){
+            this.storeXY([x, y]);
+            supr.setXY.call(this, [x, y]);
+            supr.setSize.call(this, w, h, a, d, cb, e);
+            cb();
+        }else{
+            supr.setBounds.call(this, x, y, w, h, a, d, cb, e);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the z-index of this layer and adjusts any shadow and shim z-indexes. The layer z-index is automatically
+     * incremented by two more than the value passed in so that it always shows above any shadow or shim (the shadow
+     * element, if any, will be assigned z-index + 1, and the shim element, if any, will be assigned the unmodified z-index).
+     * @param {Number} zindex The new z-index to set
+     * @return {this} The Layer
+     */
+    setZIndex : function(zindex){
+        this.zindex = zindex;
+        this.setStyle('z-index', zindex + 2);
+        if(this.shadow){
+            this.shadow.setZIndex(zindex + 1);
+        }
+        if(this.shim){
+            this.shim.setStyle('z-index', zindex);
+        }
+        return this;
+    }
+});
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Action.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Action.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Action.js	(revision 76)
@@ -0,0 +1,253 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Action
+ * <p>An Action is a piece of reusable functionality that can be abstracted out of any particular component so that it
+ * can be usefully shared among multiple components.  Actions let you share handlers, configuration options and UI
+ * updates across any components that support the Action interface (primarily {@link Ext.Toolbar}, {@link Ext.Button}
+ * and {@link Ext.menu.Menu} components).</p>
+ * <p>Aside from supporting the config object interface, any component that needs to use Actions must also support
+ * the following method list, as these will be called as needed by the Action class: setText(string), setIconCls(string),
+ * setDisabled(boolean), setVisible(boolean) and setHandler(function).</p>
+ * Example usage:<br>
+ * <pre><code>
+// Define the shared action.  Each component below will have the same
+// display text and icon, and will display the same message on click.
+var action = new Ext.Action({
+    {@link #text}: 'Do something',
+    {@link #handler}: function(){
+        Ext.Msg.alert('Click', 'You did something.');
+    },
+    {@link #iconCls}: 'do-something',
+    {@link #itemId}: 'myAction'
+});
+
+var panel = new Ext.Panel({
+    title: 'Actions',
+    width: 500,
+    height: 300,
+    tbar: [
+        // Add the action directly to a toolbar as a menu button
+        action,
+        {
+            text: 'Action Menu',
+            // Add the action to a menu as a text item
+            menu: [action]
+        }
+    ],
+    items: [
+        // Add the action to the panel body as a standard button
+        new Ext.Button(action)
+    ],
+    renderTo: Ext.getBody()
+});
+
+// Change the text for all components using the action
+action.setText('Something else');
+
+// Reference an action through a container using the itemId
+var btn = panel.getComponent('myAction');
+var aRef = btn.baseAction;
+aRef.setText('New text');
+</code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.Action = Ext.extend(Object, {
+    /**
+     * @cfg {String} text The text to set for all components using this action (defaults to '').
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon for
+     * all components using this action (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'do-something'
+
+// css class that specifies background image to be used as the icon image:
+.do-something { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled True to disable all components using this action, false to enable them (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} hidden True to hide all components using this action, false to show them (defaults to false).
+     */
+    /**
+     * @cfg {Function} handler The function that will be invoked by each component tied to this action
+     * when the component's primary event is triggered (defaults to undefined).
+     */
+    /**
+     * @cfg {String} itemId
+     * See {@link Ext.Component}.{@link Ext.Component#itemId itemId}.
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> is executed. Defaults to this Button.
+     */
+
+    constructor : function(config){
+        this.initialConfig = config;
+        this.itemId = config.itemId = (config.itemId || config.id || Ext.id());
+        this.items = [];
+    },
+    
+    // private
+    isAction : true,
+
+    /**
+     * Sets the text to be displayed by all components using this action.
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.initialConfig.text = text;
+        this.callEach('setText', [text]);
+    },
+
+    /**
+     * Gets the text currently displayed by all components using this action.
+     */
+    getText : function(){
+        return this.initialConfig.text;
+    },
+
+    /**
+     * Sets the icon CSS class for all components using this action.  The class should supply
+     * a background image that will be used as the icon image.
+     * @param {String} cls The CSS class supplying the icon image
+     */
+    setIconClass : function(cls){
+        this.initialConfig.iconCls = cls;
+        this.callEach('setIconClass', [cls]);
+    },
+
+    /**
+     * Gets the icon CSS class currently used by all components using this action.
+     */
+    getIconClass : function(){
+        return this.initialConfig.iconCls;
+    },
+
+    /**
+     * Sets the disabled state of all components using this action.  Shortcut method
+     * for {@link #enable} and {@link #disable}.
+     * @param {Boolean} disabled True to disable the component, false to enable it
+     */
+    setDisabled : function(v){
+        this.initialConfig.disabled = v;
+        this.callEach('setDisabled', [v]);
+    },
+
+    /**
+     * Enables all components using this action.
+     */
+    enable : function(){
+        this.setDisabled(false);
+    },
+
+    /**
+     * Disables all components using this action.
+     */
+    disable : function(){
+        this.setDisabled(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently disabled, else returns false.  
+     */
+    isDisabled : function(){
+        return this.initialConfig.disabled;
+    },
+
+    /**
+     * Sets the hidden state of all components using this action.  Shortcut method
+     * for <code>{@link #hide}</code> and <code>{@link #show}</code>.
+     * @param {Boolean} hidden True to hide the component, false to show it
+     */
+    setHidden : function(v){
+        this.initialConfig.hidden = v;
+        this.callEach('setVisible', [!v]);
+    },
+
+    /**
+     * Shows all components using this action.
+     */
+    show : function(){
+        this.setHidden(false);
+    },
+
+    /**
+     * Hides all components using this action.
+     */
+    hide : function(){
+        this.setHidden(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently hidden, else returns false.  
+     */
+    isHidden : function(){
+        return this.initialConfig.hidden;
+    },
+
+    /**
+     * Sets the function that will be called by each Component using this action when its primary event is triggered.
+     * @param {Function} fn The function that will be invoked by the action's components.  The function
+     * will be called with no arguments.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed. Defaults to the Component firing the event.
+     */
+    setHandler : function(fn, scope){
+        this.initialConfig.handler = fn;
+        this.initialConfig.scope = scope;
+        this.callEach('setHandler', [fn, scope]);
+    },
+
+    /**
+     * Executes the specified function once for each Component currently tied to this action.  The function passed
+     * in should accept a single argument that will be an object that supports the basic Action config/method interface.
+     * @param {Function} fn The function to execute for each component
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed.  Defaults to the Component.
+     */
+    each : function(fn, scope){
+        Ext.each(this.items, fn, scope);
+    },
+
+    // private
+    callEach : function(fnName, args){
+        var cs = this.items;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i][fnName].apply(cs[i], args);
+        }
+    },
+
+    // private
+    addComponent : function(comp){
+        this.items.push(comp);
+        comp.on('destroy', this.removeComponent, this);
+    },
+
+    // private
+    removeComponent : function(comp){
+        this.items.remove(comp);
+    },
+
+    /**
+     * Executes this action manually using the handler function specified in the original config object
+     * or the handler function set with <code>{@link #setHandler}</code>.  Any arguments passed to this
+     * function will be passed on to the handler function.
+     * @param {Mixed} arg1 (optional) Variable number of arguments passed to the handler function
+     * @param {Mixed} arg2 (optional)
+     * @param {Mixed} etc... (optional)
+     */
+    execute : function(){
+        this.initialConfig.handler.apply(this.initialConfig.scope || window, arguments);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Resizable.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Resizable.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Resizable.js	(revision 76)
@@ -0,0 +1,770 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Resizable
+ * @extends Ext.util.Observable
+ * <p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element
+ * and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
+ * the textarea in a div and set 'resizeChild' to true (or to the id of the element), <b>or</b> set wrap:true in your config and
+ * the element will be wrapped for you automatically.</p>
+ * <p>Here is the list of valid resize handles:</p>
+ * <pre>
+Value   Description
+------  -------------------
+ 'n'     north
+ 's'     south
+ 'e'     east
+ 'w'     west
+ 'nw'    northwest
+ 'sw'    southwest
+ 'se'    southeast
+ 'ne'    northeast
+ 'all'   all
+</pre>
+ * <p>Here's an example showing the creation of a typical Resizable:</p>
+ * <pre><code>
+var resizer = new Ext.Resizable('element-id', {
+    handles: 'all',
+    minWidth: 200,
+    minHeight: 100,
+    maxWidth: 500,
+    maxHeight: 400,
+    pinned: true
+});
+resizer.on('resize', myHandler);
+</code></pre>
+ * <p>To hide a particular handle, set its display to none in CSS, or through script:<br>
+ * resizer.east.setDisplayed(false);</p>
+ * @constructor
+ * Create a new resizable component
+ * @param {Mixed} el The id or element to resize
+ * @param {Object} config configuration options
+  */
+Ext.Resizable = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        this.el = Ext.get(el);
+        if(config && config.wrap){
+            config.resizeChild = this.el;
+            this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : {cls:'xresizable-wrap'});
+            this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
+            this.el.setStyle('overflow', 'hidden');
+            this.el.setPositioning(config.resizeChild.getPositioning());
+            config.resizeChild.clearPositioning();
+            if(!config.width || !config.height){
+                var csize = config.resizeChild.getSize();
+                this.el.setSize(csize.width, csize.height);
+            }
+            if(config.pinned && !config.adjustments){
+                config.adjustments = 'auto';
+            }
+        }
+
+        /**
+         * The proxy Element that is resized in place of the real Element during the resize operation.
+         * This may be queried using {@link Ext.Element#getBox} to provide the new area to resize to.
+         * Read only.
+         * @type Ext.Element.
+         * @property proxy
+         */
+        this.proxy = this.el.createProxy({tag: 'div', cls: 'x-resizable-proxy', id: this.el.id + '-rzproxy'}, Ext.getBody());
+        this.proxy.unselectable();
+        this.proxy.enableDisplayMode('block');
+
+        Ext.apply(this, config);
+
+        if(this.pinned){
+            this.disableTrackOver = true;
+            this.el.addClass('x-resizable-pinned');
+        }
+        // if the element isn't positioned, make it relative
+        var position = this.el.getStyle('position');
+        if(position != 'absolute' && position != 'fixed'){
+            this.el.setStyle('position', 'relative');
+        }
+        if(!this.handles){ // no handles passed, must be legacy style
+            this.handles = 's,e,se';
+            if(this.multiDirectional){
+                this.handles += ',n,w';
+            }
+        }
+        if(this.handles == 'all'){
+            this.handles = 'n s e w ne nw se sw';
+        }
+        var hs = this.handles.split(/\s*?[,;]\s*?| /);
+        var ps = Ext.Resizable.positions;
+        for(var i = 0, len = hs.length; i < len; i++){
+            if(hs[i] && ps[hs[i]]){
+                var pos = ps[hs[i]];
+                this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent, this.handleCls);
+            }
+        }
+        // legacy
+        this.corner = this.southeast;
+
+        if(this.handles.indexOf('n') != -1 || this.handles.indexOf('w') != -1){
+            this.updateBox = true;
+        }
+
+        this.activeHandle = null;
+
+        if(this.resizeChild){
+            if(typeof this.resizeChild == 'boolean'){
+                this.resizeChild = Ext.get(this.el.dom.firstChild, true);
+            }else{
+                this.resizeChild = Ext.get(this.resizeChild, true);
+            }
+        }
+
+        if(this.adjustments == 'auto'){
+            var rc = this.resizeChild;
+            var hw = this.west, he = this.east, hn = this.north, hs = this.south;
+            if(rc && (hw || hn)){
+                rc.position('relative');
+                rc.setLeft(hw ? hw.el.getWidth() : 0);
+                rc.setTop(hn ? hn.el.getHeight() : 0);
+            }
+            this.adjustments = [
+                (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
+                (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1
+            ];
+        }
+
+        if(this.draggable){
+            this.dd = this.dynamic ?
+                this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
+            this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
+            if(this.constrainTo){
+                this.dd.constrainTo(this.constrainTo);
+            }
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeresize
+             * Fired before resize is allowed. Set {@link #enabled} to false to cancel resize.
+             * @param {Ext.Resizable} this
+             * @param {Ext.EventObject} e The mousedown event
+             */
+            'beforeresize',
+            /**
+             * @event resize
+             * Fired after a resize.
+             * @param {Ext.Resizable} this
+             * @param {Number} width The new width
+             * @param {Number} height The new height
+             * @param {Ext.EventObject} e The mouseup event
+             */
+            'resize'
+        );
+
+        if(this.width !== null && this.height !== null){
+            this.resizeTo(this.width, this.height);
+        }else{
+            this.updateChildSize();
+        }
+        if(Ext.isIE){
+            this.el.dom.style.zoom = 1;
+        }
+        Ext.Resizable.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Array/String} adjustments String 'auto' or an array [width, height] with values to be <b>added</b> to the
+     * resize operation's new size (defaults to <tt>[0, 0]</tt>)
+     */
+    adjustments : [0, 0],
+    /**
+     * @cfg {Boolean} animate True to animate the resize (not compatible with dynamic sizing, defaults to false)
+     */
+    animate : false,
+    /**
+     * @cfg {Mixed} constrainTo Constrain the resize to a particular element
+     */
+    /**
+     * @cfg {Boolean} disableTrackOver True to disable mouse tracking. This is only applied at config time. (defaults to false)
+     */
+    disableTrackOver : false,
+    /**
+     * @cfg {Boolean} draggable Convenience to initialize drag drop (defaults to false)
+     */
+    draggable: false,
+    /**
+     * @cfg {Number} duration Animation duration if animate = true (defaults to 0.35)
+     */
+    duration : 0.35,
+    /**
+     * @cfg {Boolean} dynamic True to resize the element while dragging instead of using a proxy (defaults to false)
+     */
+    dynamic : false,
+    /**
+     * @cfg {String} easing Animation easing if animate = true (defaults to <tt>'easingOutStrong'</tt>)
+     */
+    easing : 'easeOutStrong',
+    /**
+     * @cfg {Boolean} enabled False to disable resizing (defaults to true)
+     */
+    enabled : true,
+    /**
+     * @property enabled Writable. False if resizing is disabled.
+     * @type Boolean
+     */
+    /**
+     * @cfg {String} handles String consisting of the resize handles to display (defaults to undefined).
+     * Specify either <tt>'all'</tt> or any of <tt>'n s e w ne nw se sw'</tt>.
+     */
+    handles : false,
+    /**
+     * @cfg {Boolean} multiDirectional <b>Deprecated</b>.  Deprecated style of adding multi-direction resize handles.
+     */
+    multiDirectional : false,
+    /**
+     * @cfg {Number} height The height of the element in pixels (defaults to null)
+     */
+    height : null,
+    /**
+     * @cfg {Number} width The width of the element in pixels (defaults to null)
+     */
+    width : null,
+    /**
+     * @cfg {Number} heightIncrement The increment to snap the height resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    heightIncrement : 0,
+    /**
+     * @cfg {Number} widthIncrement The increment to snap the width resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    widthIncrement : 0,
+    /**
+     * @cfg {Number} minHeight The minimum height for the element (defaults to 5)
+     */
+    minHeight : 5,
+    /**
+     * @cfg {Number} minWidth The minimum width for the element (defaults to 5)
+     */
+    minWidth : 5,
+    /**
+     * @cfg {Number} maxHeight The maximum height for the element (defaults to 10000)
+     */
+    maxHeight : 10000,
+    /**
+     * @cfg {Number} maxWidth The maximum width for the element (defaults to 10000)
+     */
+    maxWidth : 10000,
+    /**
+     * @cfg {Number} minX The minimum x for the element (defaults to 0)
+     */
+    minX: 0,
+    /**
+     * @cfg {Number} minY The minimum x for the element (defaults to 0)
+     */
+    minY: 0,
+    /**
+     * @cfg {Boolean} pinned True to ensure that the resize handles are always visible, false to display them only when the
+     * user mouses over the resizable borders. This is only applied at config time. (defaults to false)
+     */
+    pinned : false,
+    /**
+     * @cfg {Boolean} preserveRatio True to preserve the original ratio between height
+     * and width during resize (defaults to false)
+     */
+    preserveRatio : false,
+    /**
+     * @cfg {Boolean/String/Element} resizeChild True to resize the first child, or id/element to resize (defaults to false)
+     */
+    resizeChild : false,
+    /**
+     * @cfg {Boolean} transparent True for transparent handles. This is only applied at config time. (defaults to false)
+     */
+    transparent: false,
+    /**
+     * @cfg {Ext.lib.Region} resizeRegion Constrain the resize to a particular region
+     */
+    /**
+     * @cfg {Boolean} wrap True to wrap an element with a div if needed (required for textareas and images, defaults to false)
+     * in favor of the handles config option (defaults to false)
+     */
+    /**
+     * @cfg {String} handleCls A css class to add to each handle. Defaults to <tt>''</tt>.
+     */
+
+
+    /**
+     * Perform a manual resize and fires the 'resize' event.
+     * @param {Number} width
+     * @param {Number} height
+     */
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.updateChildSize();
+        this.fireEvent('resize', this, width, height, null);
+    },
+
+    // private
+    startSizing : function(e, handle){
+        this.fireEvent('beforeresize', this, e);
+        if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler
+
+            if(!this.overlay){
+                this.overlay = this.el.createProxy({tag: 'div', cls: 'x-resizable-overlay', html: '&#160;'}, Ext.getBody());
+                this.overlay.unselectable();
+                this.overlay.enableDisplayMode('block');
+                this.overlay.on({
+                    scope: this,
+                    mousemove: this.onMouseMove,
+                    mouseup: this.onMouseUp
+                });
+            }
+            this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
+
+            this.resizing = true;
+            this.startBox = this.el.getBox();
+            this.startPoint = e.getXY();
+            this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
+                            (this.startBox.y + this.startBox.height) - this.startPoint[1]];
+
+            this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.overlay.show();
+
+            if(this.constrainTo) {
+                var ct = Ext.get(this.constrainTo);
+                this.resizeRegion = ct.getRegion().adjust(
+                    ct.getFrameWidth('t'),
+                    ct.getFrameWidth('l'),
+                    -ct.getFrameWidth('b'),
+                    -ct.getFrameWidth('r')
+                );
+            }
+
+            this.proxy.setStyle('visibility', 'hidden'); // workaround display none
+            this.proxy.show();
+            this.proxy.setBox(this.startBox);
+            if(!this.dynamic){
+                this.proxy.setStyle('visibility', 'visible');
+            }
+        }
+    },
+
+    // private
+    onMouseDown : function(handle, e){
+        if(this.enabled){
+            e.stopEvent();
+            this.activeHandle = handle;
+            this.startSizing(e, handle);
+        }
+    },
+
+    // private
+    onMouseUp : function(e){
+        this.activeHandle = null;
+        var size = this.resizeElement();
+        this.resizing = false;
+        this.handleOut();
+        this.overlay.hide();
+        this.proxy.hide();
+        this.fireEvent('resize', this, size.width, size.height, e);
+    },
+
+    // private
+    updateChildSize : function(){
+        if(this.resizeChild){
+            var el = this.el;
+            var child = this.resizeChild;
+            var adj = this.adjustments;
+            if(el.dom.offsetWidth){
+                var b = el.getSize(true);
+                child.setSize(b.width+adj[0], b.height+adj[1]);
+            }
+            // Second call here for IE
+            // The first call enables instant resizing and
+            // the second call corrects scroll bars if they
+            // exist
+            if(Ext.isIE){
+                setTimeout(function(){
+                    if(el.dom.offsetWidth){
+                        var b = el.getSize(true);
+                        child.setSize(b.width+adj[0], b.height+adj[1]);
+                    }
+                }, 10);
+            }
+        }
+    },
+
+    // private
+    snap : function(value, inc, min){
+        if(!inc || !value){
+            return value;
+        }
+        var newValue = value;
+        var m = value % inc;
+        if(m > 0){
+            if(m > (inc/2)){
+                newValue = value + (inc-m);
+            }else{
+                newValue = value - m;
+            }
+        }
+        return Math.max(min, newValue);
+    },
+
+    /**
+     * <p>Performs resizing of the associated Element. This method is called internally by this
+     * class, and should not be called by user code.</p>
+     * <p>If a Resizable is being used to resize an Element which encapsulates a more complex UI
+     * component such as a Panel, this method may be overridden by specifying an implementation
+     * as a config option to provide appropriate behaviour at the end of the resize operation on
+     * mouseup, for example resizing the Panel, and relaying the Panel's content.</p>
+     * <p>The new area to be resized to is available by examining the state of the {@link #proxy}
+     * Element. Example:
+<pre><code>
+new Ext.Panel({
+    title: 'Resize me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    listeners: {
+        render: function(p) {
+            new Ext.Resizable(p.getEl(), {
+                handles: 'all',
+                pinned: true,
+                transparent: true,
+                resizeElement: function() {
+                    var box = this.proxy.getBox();
+                    p.updateBox(box);
+                    if (p.layout) {
+                        p.doLayout();
+                    }
+                    return box;
+                }
+           });
+       }
+    }
+}).show();
+</code></pre>
+     */
+    resizeElement : function(){
+        var box = this.proxy.getBox();
+        if(this.updateBox){
+            this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
+        }else{
+            this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
+        }
+        this.updateChildSize();
+        if(!this.dynamic){
+            this.proxy.hide();
+        }
+        if(this.draggable && this.constrainTo){
+            this.dd.resetConstraints();
+            this.dd.constrainTo(this.constrainTo);
+        }
+        return box;
+    },
+
+    // private
+    constrain : function(v, diff, m, mx){
+        if(v - diff < m){
+            diff = v - m;
+        }else if(v - diff > mx){
+            diff = v - mx;
+        }
+        return diff;
+    },
+
+    // private
+    onMouseMove : function(e){
+        if(this.enabled && this.activeHandle){
+            try{// try catch so if something goes wrong the user doesn't get hung
+
+            if(this.resizeRegion && !this.resizeRegion.contains(e.getPoint())) {
+                return;
+            }
+
+            //var curXY = this.startPoint;
+            var curSize = this.curSize || this.startBox,
+                x = this.startBox.x, y = this.startBox.y,
+                ox = x,
+                oy = y,
+                w = curSize.width,
+                h = curSize.height,
+                ow = w,
+                oh = h,
+                mw = this.minWidth,
+                mh = this.minHeight,
+                mxw = this.maxWidth,
+                mxh = this.maxHeight,
+                wi = this.widthIncrement,
+                hi = this.heightIncrement,
+                eventXY = e.getXY(),
+                diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0])),
+                diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1])),
+                pos = this.activeHandle.position,
+                tw,
+                th;
+
+            switch(pos){
+                case 'east':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    break;
+                case 'south':
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'southeast':
+                    w += diffX;
+                    h += diffY;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'north':
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'west':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+                case 'northeast':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'northwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    x += diffX;
+                    w -= diffX;
+                    break;
+               case 'southwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+            }
+
+            var sw = this.snap(w, wi, mw);
+            var sh = this.snap(h, hi, mh);
+            if(sw != w || sh != h){
+                switch(pos){
+                    case 'northeast':
+                        y -= sh - h;
+                    break;
+                    case 'north':
+                        y -= sh - h;
+                        break;
+                    case 'southwest':
+                        x -= sw - w;
+                    break;
+                    case 'west':
+                        x -= sw - w;
+                        break;
+                    case 'northwest':
+                        x -= sw - w;
+                        y -= sh - h;
+                    break;
+                }
+                w = sw;
+                h = sh;
+            }
+
+            if(this.preserveRatio){
+                switch(pos){
+                    case 'southeast':
+                    case 'east':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                       break;
+                    case 'south':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        break;
+                    case 'northeast':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                    break;
+                    case 'north':
+                        tw = w;
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        x += (tw - w) / 2;
+                        break;
+                    case 'southwest':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                        break;
+                    case 'west':
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        y += (th - h) / 2;
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                       break;
+                    case 'northwest':
+                        tw = w;
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                        y += th - h;
+                        x += tw - w;
+                        break;
+
+                }
+            }
+            this.proxy.setBounds(x, y, w, h);
+            if(this.dynamic){
+                this.resizeElement();
+            }
+            }catch(ex){}
+        }
+    },
+
+    // private
+    handleOver : function(){
+        if(this.enabled){
+            this.el.addClass('x-resizable-over');
+        }
+    },
+
+    // private
+    handleOut : function(){
+        if(!this.resizing){
+            this.el.removeClass('x-resizable-over');
+        }
+    },
+
+    /**
+     * Returns the element this component is bound to.
+     * @return {Ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the resizeChild element (or null).
+     * @return {Ext.Element}
+     */
+    getResizeChild : function(){
+        return this.resizeChild;
+    },
+
+    /**
+     * Destroys this resizable. If the element was wrapped and
+     * removeEl is not true then the element remains.
+     * @param {Boolean} removeEl (optional) true to remove the element from the DOM
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.dd, this.overlay, this.proxy);
+        this.overlay = null;
+        this.proxy = null;
+
+        var ps = Ext.Resizable.positions;
+        for(var k in ps){
+            if(typeof ps[k] != 'function' && this[ps[k]]){
+                this[ps[k]].destroy();
+            }
+        }
+        if(removeEl){
+            this.el.update('');
+            Ext.destroy(this.el);
+            this.el = null;
+        }
+        this.purgeListeners();
+    },
+
+    syncHandleHeight : function(){
+        var h = this.el.getHeight(true);
+        if(this.west){
+            this.west.el.setHeight(h);
+        }
+        if(this.east){
+            this.east.el.setHeight(h);
+        }
+    }
+});
+
+// private
+// hash to map config positions to true positions
+Ext.Resizable.positions = {
+    n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast'
+};
+
+Ext.Resizable.Handle = Ext.extend(Object, {
+    constructor : function(rz, pos, disableTrackOver, transparent, cls){
+       if(!this.tpl){
+            // only initialize the template if resizable is used
+            var tpl = Ext.DomHelper.createTemplate(
+                {tag: 'div', cls: 'x-resizable-handle x-resizable-handle-{0}'}
+            );
+            tpl.compile();
+            Ext.Resizable.Handle.prototype.tpl = tpl;
+        }
+        this.position = pos;
+        this.rz = rz;
+        this.el = this.tpl.append(rz.el.dom, [this.position], true);
+        this.el.unselectable();
+        if(transparent){
+            this.el.setOpacity(0);
+        }
+        if(!Ext.isEmpty(cls)){
+            this.el.addClass(cls);
+        }
+        this.el.on('mousedown', this.onMouseDown, this);
+        if(!disableTrackOver){
+            this.el.on({
+                scope: this,
+                mouseover: this.onMouseOver,
+                mouseout: this.onMouseOut
+            });
+        }
+    },
+
+    // private
+    afterResize : function(rz){
+        // do nothing
+    },
+    // private
+    onMouseDown : function(e){
+        this.rz.onMouseDown(this, e);
+    },
+    // private
+    onMouseOver : function(e){
+        this.rz.handleOver(this, e);
+    },
+    // private
+    onMouseOut : function(e){
+        this.rz.handleOut(this, e);
+    },
+    // private
+    destroy : function(){
+        Ext.destroy(this.el);
+        this.el = null;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Container.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Container.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Container.js	(revision 76)
@@ -0,0 +1,1000 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Container
+ * @extends Ext.BoxComponent
+ * <p>Base class for any {@link Ext.BoxComponent} that may contain other Components. Containers handle the
+ * basic behavior of containing items, namely adding, inserting and removing items.</p>
+ *
+ * <p>The most commonly used Container classes are {@link Ext.Panel}, {@link Ext.Window} and {@link Ext.TabPanel}.
+ * If you do not need the capabilities offered by the aforementioned classes you can create a lightweight
+ * Container to be encapsulated by an HTML element to your specifications by using the
+ * <code><b>{@link Ext.Component#autoEl autoEl}</b></code> config option. This is a useful technique when creating
+ * embedded {@link Ext.layout.ColumnLayout column} layouts inside {@link Ext.form.FormPanel FormPanels}
+ * for example.</p>
+ *
+ * <p>The code below illustrates both how to explicitly create a Container, and how to implicitly
+ * create one using the <b><code>'container'</code></b> xtype:<pre><code>
+// explicitly create a Container
+var embeddedColumns = new Ext.Container({
+    autoEl: 'div',  // This is the default
+    layout: 'column',
+    defaults: {
+        // implicitly create Container by specifying xtype
+        xtype: 'container',
+        autoEl: 'div', // This is the default.
+        layout: 'form',
+        columnWidth: 0.5,
+        style: {
+            padding: '10px'
+        }
+    },
+//  The two items below will be Ext.Containers, each encapsulated by a &lt;DIV> element.
+    items: [{
+        items: {
+            xtype: 'datefield',
+            name: 'startDate',
+            fieldLabel: 'Start date'
+        }
+    }, {
+        items: {
+            xtype: 'datefield',
+            name: 'endDate',
+            fieldLabel: 'End date'
+        }
+    }]
+});</code></pre></p>
+ *
+ * <p><u><b>Layout</b></u></p>
+ * <p>Container classes delegate the rendering of child Components to a layout
+ * manager class which must be configured into the Container using the
+ * <code><b>{@link #layout}</b></code> configuration property.</p>
+ * <p>When either specifying child <code>{@link #items}</code> of a Container,
+ * or dynamically {@link #add adding} Components to a Container, remember to
+ * consider how you wish the Container to arrange those child elements, and
+ * whether those child elements need to be sized using one of Ext's built-in
+ * <b><code>{@link #layout}</code></b> schemes. By default, Containers use the
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme which only
+ * renders child components, appending them one after the other inside the
+ * Container, and <b>does not apply any sizing</b> at all.</p>
+ * <p>A common mistake is when a developer neglects to specify a
+ * <b><code>{@link #layout}</code></b> (e.g. widgets like GridPanels or
+ * TreePanels are added to Containers for which no <code><b>{@link #layout}</b></code>
+ * has been specified). If a Container is left to use the default
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme, none of its
+ * child components will be resized, or changed in any way when the Container
+ * is resized.</p>
+ * <p>Certain layout managers allow dynamic addition of child components.
+ * Those that do include {@link Ext.layout.CardLayout},
+ * {@link Ext.layout.AnchorLayout}, {@link Ext.layout.FormLayout}, and
+ * {@link Ext.layout.TableLayout}. For example:<pre><code>
+//  Create the GridPanel.
+var myNewGrid = new Ext.grid.GridPanel({
+    store: myStore,
+    columns: myColumnModel,
+    title: 'Results', // the title becomes the title of the tab
+});
+
+myTabPanel.add(myNewGrid); // {@link Ext.TabPanel} implicitly uses {@link Ext.layout.CardLayout CardLayout}
+myTabPanel.{@link Ext.TabPanel#setActiveTab setActiveTab}(myNewGrid);
+ * </code></pre></p>
+ * <p>The example above adds a newly created GridPanel to a TabPanel. Note that
+ * a TabPanel uses {@link Ext.layout.CardLayout} as its layout manager which
+ * means all its child items are sized to {@link Ext.layout.FitLayout fit}
+ * exactly into its client area.
+ * <p><b><u>Overnesting is a common problem</u></b>.
+ * An example of overnesting occurs when a GridPanel is added to a TabPanel
+ * by wrapping the GridPanel <i>inside</i> a wrapping Panel (that has no
+ * <code><b>{@link #layout}</b></code> specified) and then add that wrapping Panel
+ * to the TabPanel. The point to realize is that a GridPanel <b>is</b> a
+ * Component which can be added directly to a Container. If the wrapping Panel
+ * has no <code><b>{@link #layout}</b></code> configuration, then the overnested
+ * GridPanel will not be sized as expected.<p>
+ *
+ * <p><u><b>Adding via remote configuration</b></u></p>
+ *
+ * <p>A server side script can be used to add Components which are generated dynamically on the server.
+ * An example of adding a GridPanel to a TabPanel where the GridPanel is generated by the server
+ * based on certain parameters:
+ * </p><pre><code>
+// execute an Ajax request to invoke server side script:
+Ext.Ajax.request({
+    url: 'gen-invoice-grid.php',
+    // send additional parameters to instruct server script
+    params: {
+        startDate: Ext.getCmp('start-date').getValue(),
+        endDate: Ext.getCmp('end-date').getValue()
+    },
+    // process the response object to add it to the TabPanel:
+    success: function(xhr) {
+        var newComponent = eval(xhr.responseText); // see discussion below
+        myTabPanel.add(newComponent); // add the component to the TabPanel
+        myTabPanel.setActiveTab(newComponent);
+    },
+    failure: function() {
+        Ext.Msg.alert("Grid create failed", "Server communication failure");
+    }
+});
+</code></pre>
+ * <p>The server script needs to return an executable Javascript statement which, when processed
+ * using <code>eval()</code>, will return either a config object with an {@link Ext.Component#xtype xtype},
+ * or an instantiated Component. The server might return this for example:</p><pre><code>
+(function() {
+    function formatDate(value){
+        return value ? value.dateFormat('M d, Y') : '';
+    };
+
+    var store = new Ext.data.Store({
+        url: 'get-invoice-data.php',
+        baseParams: {
+            startDate: '01/01/2008',
+            endDate: '01/31/2008'
+        },
+        reader: new Ext.data.JsonReader({
+            record: 'transaction',
+            idProperty: 'id',
+            totalRecords: 'total'
+        }, [
+           'customer',
+           'invNo',
+           {name: 'date', type: 'date', dateFormat: 'm/d/Y'},
+           {name: 'value', type: 'float'}
+        ])
+    });
+
+    var grid = new Ext.grid.GridPanel({
+        title: 'Invoice Report',
+        bbar: new Ext.PagingToolbar(store),
+        store: store,
+        columns: [
+            {header: "Customer", width: 250, dataIndex: 'customer', sortable: true},
+            {header: "Invoice Number", width: 120, dataIndex: 'invNo', sortable: true},
+            {header: "Invoice Date", width: 100, dataIndex: 'date', renderer: formatDate, sortable: true},
+            {header: "Value", width: 120, dataIndex: 'value', renderer: 'usMoney', sortable: true}
+        ],
+    });
+    store.load();
+    return grid;  // return instantiated component
+})();
+</code></pre>
+ * <p>When the above code fragment is passed through the <code>eval</code> function in the success handler
+ * of the Ajax request, the code is executed by the Javascript processor, and the anonymous function
+ * runs, and returns the instantiated grid component.</p>
+ * <p>Note: since the code above is <i>generated</i> by a server script, the <code>baseParams</code> for
+ * the Store, the metadata to allow generation of the Record layout, and the ColumnModel
+ * can all be generated into the code since these are all known on the server.</p>
+ *
+ * @xtype container
+ */
+Ext.Container = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Boolean} monitorResize
+     * True to automatically monitor window resize events to handle anything that is sensitive to the current size
+     * of the viewport.  This value is typically managed by the chosen <code>{@link #layout}</code> and should not need
+     * to be set manually.
+     */
+    /**
+     * @cfg {String/Object} layout
+     * <p><b>*Important</b>: In order for child items to be correctly sized and
+     * positioned, typically a layout manager <b>must</b> be specified through
+     * the <code>layout</code> configuration option.</p>
+     * <br><p>The sizing and positioning of child {@link items} is the responsibility of
+     * the Container's layout manager which creates and manages the type of layout
+     * you have in mind.  For example:</p><pre><code>
+new Ext.Window({
+    width:300, height: 300,
+    layout: 'fit', // explicitly set layout manager: override the default (layout:'auto')
+    items: [{
+        title: 'Panel inside a Window'
+    }]
+}).show();
+     * </code></pre>
+     * <p>If the {@link #layout} configuration is not explicitly specified for
+     * a general purpose container (e.g. Container or Panel) the
+     * {@link Ext.layout.ContainerLayout default layout manager} will be used
+     * which does nothing but render child components sequentially into the
+     * Container (no sizing or positioning will be performed in this situation).
+     * Some container classes implicitly specify a default layout
+     * (e.g. FormPanel specifies <code>layout:'form'</code>). Other specific
+     * purpose classes internally specify/manage their internal layout (e.g.
+     * GridPanel, TabPanel, TreePanel, Toolbar, Menu, etc.).</p>
+     * <br><p><b><code>layout</code></b> may be specified as either as an Object or
+     * as a String:</p><div><ul class="mdetail-params">
+     *
+     * <li><u>Specify as an Object</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: {
+    type: 'vbox',
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     *
+     * <li><code><b>type</b></code></li>
+     * <br/><p>The layout type to be used for this container.  If not specified,
+     * a default {@link Ext.layout.ContainerLayout} will be created and used.</p>
+     * <br/><p>Valid layout <code>type</code> values are:</p>
+     * <div class="sub-desc"><ul class="mdetail-params">
+     * <li><code><b>{@link Ext.layout.AbsoluteLayout absolute}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AccordionLayout accordion}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AnchorLayout anchor}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ContainerLayout auto}</b></code> &nbsp;&nbsp;&nbsp; <b>Default</b></li>
+     * <li><code><b>{@link Ext.layout.BorderLayout border}</b></code></li>
+     * <li><code><b>{@link Ext.layout.CardLayout card}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ColumnLayout column}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FitLayout fit}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FormLayout form}</b></code></li>
+     * <li><code><b>{@link Ext.layout.HBoxLayout hbox}</b></code></li>
+     * <li><code><b>{@link Ext.layout.MenuLayout menu}</b></code></li>
+     * <li><code><b>{@link Ext.layout.TableLayout table}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ToolbarLayout toolbar}</b></code></li>
+     * <li><code><b>{@link Ext.layout.VBoxLayout vbox}</b></code></li>
+     * </ul></div>
+     *
+     * <li>Layout specific configuration properties</li>
+     * <br/><p>Additional layout specific configuration properties may also be
+     * specified. For complete details regarding the valid config options for
+     * each layout type, see the layout class corresponding to the <code>type</code>
+     * specified.</p>
+     *
+     * </ul></div>
+     *
+     * <li><u>Specify as a String</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: 'vbox',
+layoutConfig: {
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     * <li><code><b>layout</b></code></li>
+     * <br/><p>The layout <code>type</code> to be used for this container (see list
+     * of valid layout type values above).</p><br/>
+     * <li><code><b>{@link #layoutConfig}</b></code></li>
+     * <br/><p>Additional layout specific configuration properties. For complete
+     * details regarding the valid config options for each layout type, see the
+     * layout class corresponding to the <code>layout</code> specified.</p>
+     * </ul></div></ul></div>
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * This is a config object containing properties specific to the chosen
+     * <b><code>{@link #layout}</code></b> if <b><code>{@link #layout}</code></b>
+     * has been specified as a <i>string</i>.</p>
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * When set to true (50 milliseconds) or a number of milliseconds, the layout assigned for this container will buffer
+     * the frequency it calculates and does a re-layout of components. This is useful for heavy containers or containers
+     * with a large quantity of sub-components for which frequent layout calls would be expensive. Defaults to <code>50</code>.
+     */
+    bufferResize: 50,
+
+    /**
+     * @cfg {String/Number} activeItem
+     * A string component id or the numeric index of the component that should be initially activated within the
+     * container's layout on render.  For example, activeItem: 'item-1' or activeItem: 0 (index 0 = the first
+     * item in the container's collection).  activeItem only applies to layout styles that can display
+     * items one at a time (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout} and
+     * {@link Ext.layout.FitLayout}).  Related to {@link Ext.layout.ContainerLayout#activeItem}.
+     */
+    /**
+     * @cfg {Object/Array} items
+     * <pre><b>** IMPORTANT</b>: be sure to <b>{@link #layout specify a <code>layout</code>} if needed ! **</b></pre>
+     * <p>A single item, or an array of child Components to be added to this container,
+     * for example:</p>
+     * <pre><code>
+// specifying a single item
+items: {...},
+layout: 'fit',    // specify a layout!
+
+// specifying multiple items
+items: [{...}, {...}],
+layout: 'anchor', // specify a layout!
+     * </code></pre>
+     * <p>Each item may be:</p>
+     * <div><ul class="mdetail-params">
+     * <li>any type of object based on {@link Ext.Component}</li>
+     * <li>a fully instanciated object or</li>
+     * <li>an object literal that:</li>
+     * <div><ul class="mdetail-params">
+     * <li>has a specified <code>{@link Ext.Component#xtype xtype}</code></li>
+     * <li>the {@link Ext.Component#xtype} specified is associated with the Component
+     * desired and should be chosen from one of the available xtypes as listed
+     * in {@link Ext.Component}.</li>
+     * <li>If an <code>{@link Ext.Component#xtype xtype}</code> is not explicitly
+     * specified, the {@link #defaultType} for that Container is used.</li>
+     * <li>will be "lazily instanciated", avoiding the overhead of constructing a fully
+     * instanciated Component object</li>
+     * </ul></div></ul></div>
+     * <p><b>Notes</b>:</p>
+     * <div><ul class="mdetail-params">
+     * <li>Ext uses lazy rendering. Child Components will only be rendered
+     * should it become necessary. Items are automatically laid out when they are first
+     * shown (no sizing is done while hidden), or in response to a {@link #doLayout} call.</li>
+     * <li>Do not specify <code>{@link Ext.Panel#contentEl contentEl}</code>/
+     * <code>{@link Ext.Panel#html html}</code> with <code>items</code>.</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object|Function} defaults
+     * <p>This option is a means of applying default settings to all added items whether added through the {@link #items}
+     * config or via the {@link #add} or {@link #insert} methods.</p>
+     * <p>If an added item is a config object, and <b>not</b> an instantiated Component, then the default properties are
+     * unconditionally applied. If the added item <b>is</b> an instantiated Component, then the default properties are
+     * applied conditionally so as not to override existing properties in the item.</p>
+     * <p>If the defaults option is specified as a function, then the function will be called using this Container as the
+     * scope (<code>this</code> reference) and passing the added item as the first parameter. Any resulting object
+     * from that call is then applied to the item as default properties.</p>
+     * <p>For example, to automatically apply padding to the body of each of a set of
+     * contained {@link Ext.Panel} items, you could pass: <code>defaults: {bodyStyle:'padding:15px'}</code>.</p>
+     * <p>Usage:</p><pre><code>
+defaults: {               // defaults are applied to items, not the container
+    autoScroll:true
+},
+items: [
+    {
+        xtype: 'panel',   // defaults <b>do not</b> have precedence over
+        id: 'panel1',     // options in config objects, so the defaults
+        autoScroll: false // will not be applied here, panel1 will be autoScroll:false
+    },
+    new Ext.Panel({       // defaults <b>do</b> have precedence over options
+        id: 'panel2',     // options in components, so the defaults
+        autoScroll: false // will be applied here, panel2 will be autoScroll:true.
+    })
+]
+     * </code></pre>
+     */
+
+
+    /** @cfg {Boolean} autoDestroy
+     * If true the container will automatically destroy any contained component that is removed from it, else
+     * destruction must be handled manually (defaults to true).
+     */
+    autoDestroy : true,
+
+    /** @cfg {Boolean} forceLayout
+     * If true the container will force a layout initially even if hidden or collapsed. This option
+     * is useful for forcing forms to render in collapsed or hidden containers. (defaults to false).
+     */
+    forceLayout: false,
+
+    /** @cfg {Boolean} hideBorders
+     * True to hide the borders of each contained component, false to defer to the component's existing
+     * border settings (defaults to false).
+     */
+    /** @cfg {String} defaultType
+     * <p>The default {@link Ext.Component xtype} of child Components to create in this Container when
+     * a child item is specified as a raw configuration object, rather than as an instantiated Component.</p>
+     * <p>Defaults to <code>'panel'</code>, except {@link Ext.menu.Menu} which defaults to <code>'menuitem'</code>,
+     * and {@link Ext.Toolbar} and {@link Ext.ButtonGroup} which default to <code>'button'</code>.</p>
+     */
+    defaultType : 'panel',
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <code>'resize'</code>.
+     */
+    resizeEvent: 'resize',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <code>['add', 'remove']</code>.
+     */
+    bubbleEvents: ['add', 'remove'],
+
+    // private
+    initComponent : function(){
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event afterlayout
+             * Fires when the components in this container are arranged by the associated layout manager.
+             * @param {Ext.Container} this
+             * @param {ContainerLayout} layout The ContainerLayout implementation for this container
+             */
+            'afterlayout',
+            /**
+             * @event beforeadd
+             * Fires before any {@link Ext.Component} is added or inserted into the container.
+             * A handler can return false to cancel the add.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being added
+             * @param {Number} index The index at which the component will be added to the container's items collection
+             */
+            'beforeadd',
+            /**
+             * @event beforeremove
+             * Fires before any {@link Ext.Component} is removed from the container.  A handler can return
+             * false to cancel the remove.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being removed
+             */
+            'beforeremove',
+            /**
+             * @event add
+             * @bubbles
+             * Fires after any {@link Ext.Component} is added or inserted into the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was added
+             * @param {Number} index The index at which the component was added to the container's items collection
+             */
+            'add',
+            /**
+             * @event remove
+             * @bubbles
+             * Fires after any {@link Ext.Component} is removed from the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was removed
+             */
+            'remove'
+        );
+
+        /**
+         * The collection of components in this container as a {@link Ext.util.MixedCollection}
+         * @type MixedCollection
+         * @property items
+         */
+        var items = this.items;
+        if(items){
+            delete this.items;
+            this.add(items);
+        }
+    },
+
+    // private
+    initItems : function(){
+        if(!this.items){
+            this.items = new Ext.util.MixedCollection(false, this.getComponentId);
+            this.getLayout(); // initialize the layout
+        }
+    },
+
+    // private
+    setLayout : function(layout){
+        if(this.layout && this.layout != layout){
+            this.layout.setContainer(null);
+        }
+        this.layout = layout;
+        this.initItems();
+        layout.setContainer(this);
+    },
+
+    afterRender: function(){
+        // Render this Container, this should be done before setLayout is called which
+        // will hook onResize
+        Ext.Container.superclass.afterRender.call(this);
+        if(!this.layout){
+            this.layout = 'auto';
+        }
+        if(Ext.isObject(this.layout) && !this.layout.layout){
+            this.layoutConfig = this.layout;
+            this.layout = this.layoutConfig.type;
+        }
+        if(Ext.isString(this.layout)){
+            this.layout = new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig);
+        }
+        this.setLayout(this.layout);
+
+        // If a CardLayout, the active item set
+        if(this.activeItem !== undefined && this.layout.setActiveItem){
+            var item = this.activeItem;
+            delete this.activeItem;
+            this.layout.setActiveItem(item);
+        }
+
+        // If we have no ownerCt, render and size all children
+        if(!this.ownerCt){
+            this.doLayout(false, true);
+        }
+
+        // This is a manually configured flag set by users in conjunction with renderTo.
+        // Not to be confused with the flag by the same name used in Layouts.
+        if(this.monitorResize === true){
+            Ext.EventManager.onWindowResize(this.doLayout, this, [false]);
+        }
+    },
+
+    /**
+     * <p>Returns the Element to be used to contain the child Components of this Container.</p>
+     * <p>An implementation is provided which returns the Container's {@link #getEl Element}, but
+     * if there is a more complex structure to a Container, this may be overridden to return
+     * the element into which the {@link #layout layout} renders child Components.</p>
+     * @return {Ext.Element} The Element to render child Components into.
+     */
+    getLayoutTarget : function(){
+        return this.el;
+    },
+
+    // private - used as the key lookup function for the items collection
+    getComponentId : function(comp){
+        return comp.getItemId();
+    },
+
+    /**
+     * <p>Adds {@link Ext.Component Component}(s) to this Container.</p>
+     * <br><p><b>Description</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>Fires the {@link #beforeadd} event before adding</li>
+     * <li>The Container's {@link #defaults default config values} will be applied
+     * accordingly (see <code>{@link #defaults}</code> for details).</li>
+     * <li>Fires the {@link #add} event after the component has been added.</li>
+     * </ul></div>
+     * <br><p><b>Notes</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>If the Container is <i>already rendered</i> when <code>add</code>
+     * is called, you may need to call {@link #doLayout} to refresh the view which causes
+     * any unrendered child Components to be rendered. This is required so that you can
+     * <code>add</code> multiple child components if needed while only refreshing the layout
+     * once. For example:<pre><code>
+var tb = new {@link Ext.Toolbar}();
+tb.render(document.body);  // toolbar is rendered
+tb.add({text:'Button 1'}); // add multiple items ({@link #defaultType} for {@link Ext.Toolbar Toolbar} is 'button')
+tb.add({text:'Button 2'});
+tb.{@link #doLayout}();             // refresh the layout
+     * </code></pre></li>
+     * <li><i>Warning:</i> Containers directly managed by the BorderLayout layout manager
+     * may not be removed or added.  See the Notes for {@link Ext.layout.BorderLayout BorderLayout}
+     * for more details.</li>
+     * </ul></div>
+     * @param {...Object/Array} component
+     * <p>Either one or more Components to add or an Array of Components to add.  See
+     * <code>{@link #items}</code> for additional information.</p>
+     * @return {Ext.Component/Array} The Components that were added.
+     */
+    add : function(comp){
+        this.initItems();
+        var args = arguments.length > 1;
+        if(args || Ext.isArray(comp)){
+            var result = [];
+            Ext.each(args ? arguments : comp, function(c){
+                result.push(this.add(c));
+            }, this);
+            return result;
+        }
+        var c = this.lookupComponent(this.applyDefaults(comp));
+        var index = this.items.length;
+        if(this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false){
+            this.items.add(c);
+            // *onAdded
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        return c;
+    },
+
+    onAdd : function(c){
+        // Empty template method
+    },
+
+    // private
+    onAdded : function(container, pos) {
+        //overridden here so we can cascade down, not worth creating a template method.
+        this.ownerCt = container;
+        this.initRef();
+        //initialize references for child items
+        this.cascade(function(c){
+            c.initRef();
+        });
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * Inserts a Component into this Container at a specified index. Fires the
+     * {@link #beforeadd} event before inserting, then fires the {@link #add} event after the
+     * Component has been inserted.
+     * @param {Number} index The index at which the Component will be inserted
+     * into the Container's items collection
+     * @param {Ext.Component} component The child Component to insert.<br><br>
+     * Ext uses lazy rendering, and will only render the inserted Component should
+     * it become necessary.<br><br>
+     * A Component config object may be passed in order to avoid the overhead of
+     * constructing a real Component object if lazy rendering might mean that the
+     * inserted Component will not be rendered immediately. To take advantage of
+     * this 'lazy instantiation', set the {@link Ext.Component#xtype} config
+     * property to the registered type of the Component wanted.<br><br>
+     * For a list of all available xtypes, see {@link Ext.Component}.
+     * @return {Ext.Component} component The Component (or config object) that was
+     * inserted with the Container's default config values applied.
+     */
+    insert : function(index, comp) {
+        var args   = arguments,
+            length = args.length,
+            result = [],
+            i, c;
+        
+        this.initItems();
+        
+        if (length > 2) {
+            for (i = length - 1; i >= 1; --i) {
+                result.push(this.insert(index, args[i]));
+            }
+            return result;
+        }
+        
+        c = this.lookupComponent(this.applyDefaults(comp));
+        index = Math.min(index, this.items.length);
+        
+        if (this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false) {
+            if (c.ownerCt == this) {
+                this.items.remove(c);
+            }
+            this.items.insert(index, c);
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        var d = this.defaults;
+        if(d){
+            if(Ext.isFunction(d)){
+                d = d.call(this, c);
+            }
+            if(Ext.isString(c)){
+                c = Ext.ComponentMgr.get(c);
+                Ext.apply(c, d);
+            }else if(!c.events){
+                Ext.applyIf(c.isAction ? c.initialConfig : c, d);
+            }else{
+                Ext.apply(c, d);
+            }
+        }
+        return c;
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        if(item.ownerCt){
+            item.ownerCt.remove(item, false);
+        }
+        if(this.hideBorders === true){
+            item.border = (item.border === true);
+        }
+    },
+
+    /**
+     * Removes a component from this container.  Fires the {@link #beforeremove} event before removing, then fires
+     * the {@link #remove} event after the component has been removed.
+     * @param {Component/String} component The component reference or id to remove.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Ext.Component} component The Component that was removed.
+     */
+    remove : function(comp, autoDestroy){
+        this.initItems();
+        var c = this.getComponent(comp);
+        if(c && this.fireEvent('beforeremove', this, c) !== false){
+            this.doRemove(c, autoDestroy);
+            this.fireEvent('remove', this, c);
+        }
+        return c;
+    },
+
+    onRemove: function(c){
+        // Empty template method
+    },
+
+    // private
+    doRemove: function(c, autoDestroy){
+        var l = this.layout,
+            hasLayout = l && this.rendered;
+
+        if(hasLayout){
+            l.onRemove(c);
+        }
+        this.items.remove(c);
+        c.onRemoved();
+        this.onRemove(c);
+        if(autoDestroy === true || (autoDestroy !== false && this.autoDestroy)){
+            c.destroy();
+        }
+        if(hasLayout){
+            l.afterRemove(c);
+        }
+    },
+
+    /**
+     * Removes all components from this container.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Array} Array of the destroyed components
+     */
+    removeAll: function(autoDestroy){
+        this.initItems();
+        var item, rem = [], items = [];
+        this.items.each(function(i){
+            rem.push(i);
+        });
+        for (var i = 0, len = rem.length; i < len; ++i){
+            item = rem[i];
+            this.remove(item, autoDestroy);
+            if(item.ownerCt !== this){
+                items.push(item);
+            }
+        }
+        return items;
+    },
+
+    /**
+     * Examines this container's <code>{@link #items}</code> <b>property</b>
+     * and gets a direct child component of this container.
+     * @param {String/Number} comp This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><code>String</code></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><code>Number</code></b> : representing the position of the child component
+     * within the <code>{@link #items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     * @return Ext.Component The component (if found).
+     */
+    getComponent : function(comp){
+        if(Ext.isObject(comp)){
+            comp = comp.getItemId();
+        }
+        return this.items.get(comp);
+    },
+
+    // private
+    lookupComponent : function(comp){
+        if(Ext.isString(comp)){
+            return Ext.ComponentMgr.get(comp);
+        }else if(!comp.events){
+            return this.createComponent(comp);
+        }
+        return comp;
+    },
+
+    // private
+    createComponent : function(config, defaultType){
+        if (config.render) {
+            return config;
+        }
+        // add in ownerCt at creation time but then immediately
+        // remove so that onBeforeAdd can handle it
+        var c = Ext.create(Ext.apply({
+            ownerCt: this
+        }, config), defaultType || this.defaultType);
+        delete c.initialConfig.ownerCt;
+        delete c.ownerCt;
+        return c;
+    },
+
+    /**
+     * @private
+     * We can only lay out if there is a view area in which to layout.
+     * display:none on the layout target, *or any of its parent elements* will mean it has no view area.
+     */
+    canLayout : function() {
+        var el = this.getVisibilityEl();
+        return el && el.dom && !el.isStyle("display", "none");
+    },
+
+    /**
+     * Force this container's layout to be recalculated. A call to this function is required after adding a new component
+     * to an already rendered container, or possibly after changing sizing/position properties of child components.
+     * @param {Boolean} shallow (optional) True to only calc the layout of this component, and let child components auto
+     * calc layouts as required (defaults to false, which calls doLayout recursively for each subcontainer)
+     * @param {Boolean} force (optional) True to force a layout to occur, even if the item is hidden.
+     * @return {Ext.Container} this
+     */
+
+    doLayout : function(shallow, force){
+        var rendered = this.rendered,
+            forceLayout = force || this.forceLayout;
+
+        if(this.collapsed || !this.canLayout()){
+            this.deferLayout = this.deferLayout || !shallow;
+            if(!forceLayout){
+                return;
+            }
+            shallow = shallow && !this.deferLayout;
+        } else {
+            delete this.deferLayout;
+        }
+        if(rendered && this.layout){
+            this.layout.layout();
+        }
+        if(shallow !== true && this.items){
+            var cs = this.items.items;
+            for(var i = 0, len = cs.length; i < len; i++){
+                var c = cs[i];
+                if(c.doLayout){
+                    c.doLayout(false, forceLayout);
+                }
+            }
+        }
+        if(rendered){
+            this.onLayout(shallow, forceLayout);
+        }
+        // Initial layout completed
+        this.hasLayout = true;
+        delete this.forceLayout;
+    },
+
+    onLayout : Ext.emptyFn,
+
+    // private
+    shouldBufferLayout: function(){
+        /*
+         * Returns true if the container should buffer a layout.
+         * This is true only if the container has previously been laid out
+         * and has a parent container that is pending a layout.
+         */
+        var hl = this.hasLayout;
+        if(this.ownerCt){
+            // Only ever buffer if we've laid out the first time and we have one pending.
+            return hl ? !this.hasLayoutPending() : false;
+        }
+        // Never buffer initial layout
+        return hl;
+    },
+
+    // private
+    hasLayoutPending: function(){
+        // Traverse hierarchy to see if any parent container has a pending layout.
+        var pending = false;
+        this.ownerCt.bubble(function(c){
+            if(c.layoutPending){
+                pending = true;
+                return false;
+            }
+        });
+        return pending;
+    },
+
+    onShow : function(){
+        // removes css classes that were added to hide
+        Ext.Container.superclass.onShow.call(this);
+        // If we were sized during the time we were hidden, layout.
+        if(Ext.isDefined(this.deferLayout)){
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+    },
+
+    /**
+     * Returns the layout currently in use by the container.  If the container does not currently have a layout
+     * set, a default {@link Ext.layout.ContainerLayout} will be created and set as the container's layout.
+     * @return {ContainerLayout} layout The container's layout
+     */
+    getLayout : function(){
+        if(!this.layout){
+            var layout = new Ext.layout.AutoLayout(this.layoutConfig);
+            this.setLayout(layout);
+        }
+        return this.layout;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var c;
+        if(this.items){
+            while(c = this.items.first()){
+                this.doRemove(c, true);
+            }
+        }
+        if(this.monitorResize){
+            Ext.EventManager.removeResizeListener(this.doLayout, this);
+        }
+        Ext.destroy(this.layout);
+        Ext.Container.superclass.beforeDestroy.call(this);
+    },
+
+    /**
+     * Cascades down the component/container heirarchy from this component (called first), calling the specified function with
+     * each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current component)
+     * @param {Array} args (optional) The args to call the function with (defaults to passing the current component)
+     * @return {Ext.Container} this
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            if(this.items){
+                var cs = this.items.items;
+                for(var i = 0, len = cs.length; i < len; i++){
+                    if(cs[i].cascade){
+                        cs[i].cascade(fn, scope, args);
+                    }else{
+                        fn.apply(scope || cs[i], args || [cs[i]]);
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Find a component under this container at any level by id
+     * @param {String} id
+     * @deprecated Fairly useless method, since you can just use Ext.getCmp. Should be removed for 4.0
+     * If you need to test if an id belongs to a container, you can use getCmp and findParent*.
+     * @return Ext.Component
+     */
+    findById : function(id){
+        var m = null, 
+            ct = this;
+        this.cascade(function(c){
+            if(ct != c && c.id === id){
+                m = c;
+                return false;
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Find a component under this container at any level by xtype or class
+     * @param {String/Class} xtype The xtype string for a component, or the class of the component directly
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Array} Array of Ext.Components
+     */
+    findByType : function(xtype, shallow){
+        return this.findBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by property
+     * @param {String} prop
+     * @param {String} value
+     * @return {Array} Array of Ext.Components
+     */
+    find : function(prop, value){
+        return this.findBy(function(c){
+            return c[prop] === value;
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by a custom function. If the passed function returns
+     * true, the component will be included in the results. The passed function is called with the arguments (component, this container).
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional)
+     * @return {Array} Array of Ext.Components
+     */
+    findBy : function(fn, scope){
+        var m = [], ct = this;
+        this.cascade(function(c){
+            if(ct != c && fn.call(scope || c, c, ct) === true){
+                m.push(c);
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Get a component contained by this container (alias for items.get(key))
+     * @param {String/Number} key The index or id of the component
+     * @deprecated Should be removed in 4.0, since getComponent does the same thing.
+     * @return {Ext.Component} Ext.Component
+     */
+    get : function(key){
+        return this.getComponent(key);
+    }
+});
+
+Ext.Container.LAYOUTS = {};
+Ext.reg('container', Ext.Container);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Slider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Slider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Slider.js	(revision 76)
@@ -0,0 +1,965 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.slider.Thumb
+ * @extends Object
+ * Represents a single thumb element on a Slider. This would not usually be created manually and would instead
+ * be created internally by an {@link Ext.slider.MultiSlider Ext.Slider}.
+ */
+Ext.slider.Thumb = Ext.extend(Object, {
+    
+    /**
+     * True while the thumb is in a drag operation
+     * @type Boolean
+     */
+    dragging: false,
+
+    /**
+     * @constructor
+     * @cfg {Ext.slider.MultiSlider} slider The Slider to render to (required)
+     */
+    constructor: function(config) {
+        /**
+         * @property slider
+         * @type Ext.slider.MultiSlider
+         * The slider this thumb is contained within
+         */
+        Ext.apply(this, config || {}, {
+            cls: 'x-slider-thumb',
+
+            /**
+             * @cfg {Boolean} constrain True to constrain the thumb so that it cannot overlap its siblings
+             */
+            constrain: false
+        });
+
+        Ext.slider.Thumb.superclass.constructor.call(this, config);
+
+        if (this.slider.vertical) {
+            Ext.apply(this, Ext.slider.Thumb.Vertical);
+        }
+    },
+
+    /**
+     * Renders the thumb into a slider
+     */
+    render: function() {
+        this.el = this.slider.innerEl.insertFirst({cls: this.cls});
+
+        this.initEvents();
+    },
+
+    /**
+     * Enables the thumb if it is currently disabled
+     */
+    enable: function() {
+        this.disabled = false;
+        this.el.removeClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Disables the thumb if it is currently enabled
+     */
+    disable: function() {
+        this.disabled = true;
+        this.el.addClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Sets up an Ext.dd.DragTracker for this thumb
+     */
+    initEvents: function() {
+        var el = this.el;
+
+        el.addClassOnOver('x-slider-thumb-over');
+
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeDragStart.createDelegate(this),
+            onStart      : this.onDragStart.createDelegate(this),
+            onDrag       : this.onDrag.createDelegate(this),
+            onEnd        : this.onDragEnd.createDelegate(this),
+            tolerance    : 3,
+            autoStart    : 300
+        });
+
+        this.tracker.initEl(el);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker. If the slider is currently disabled,
+     * this returns false to disable the DragTracker too.
+     * @return {Boolean} False if the slider is currently disabled
+     */
+    onBeforeDragStart : function(e) {
+        if (this.disabled) {
+            return false;
+        } else {
+            this.slider.promoteThumb(this);
+            return true;
+        }
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onStart template method. Adds the drag CSS class
+     * to the thumb and fires the 'dragstart' event
+     */
+    onDragStart: function(e){
+        this.el.addClass('x-slider-thumb-drag');
+        this.dragging = true;
+        this.dragStartValue = this.value;
+
+        this.slider.fireEvent('dragstart', this.slider, e, this);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onDrag template method. This is called every time
+     * the DragTracker detects a drag movement. It updates the Slider's value using the position of the drag
+     */
+    onDrag: function(e) {
+        var slider   = this.slider,
+            index    = this.index,
+            newValue = this.getNewValue();
+
+        if (this.constrain) {
+            var above = slider.thumbs[index + 1],
+                below = slider.thumbs[index - 1];
+
+            if (below != undefined && newValue <= below.value) newValue = below.value;
+            if (above != undefined && newValue >= above.value) newValue = above.value;
+        }
+
+        slider.setValue(index, newValue, false);
+        slider.fireEvent('drag', slider, e, this);
+    },
+
+    getNewValue: function() {
+        var slider   = this.slider,
+            pos      = slider.innerEl.translatePoints(this.tracker.getXY());
+
+        return Ext.util.Format.round(slider.reverseValue(pos.left), slider.decimalPrecision);
+    },
+
+    /**
+     * @private
+     * This is tied to the internal Ext.dd.DragTracker's onEnd template method. Removes the drag CSS class and
+     * fires the 'changecomplete' event with the new value
+     */
+    onDragEnd: function(e) {
+        var slider = this.slider,
+            value  = this.value;
+
+        this.el.removeClass('x-slider-thumb-drag');
+
+        this.dragging = false;
+        slider.fireEvent('dragend', slider, e);
+
+        if (this.dragStartValue != value) {
+            slider.fireEvent('changecomplete', slider, value, this);
+        }
+    },
+    
+    /**
+     * @private
+     * Destroys the thumb
+     */
+    destroy: function(){
+        Ext.destroyMembers(this, 'tracker', 'el');
+    }
+});
+
+/**
+ * @class Ext.slider.MultiSlider
+ * @extends Ext.BoxComponent
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments, configurable snapping, axis clicking and animation. Can be added as an item to any container. Example usage:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</pre>
+ * Sliders can be created with more than one thumb handle by passing an array of values instead of a single one:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    values: [25, 50, 75],
+    minValue: 0,
+    maxValue: 100,
+
+    //this defaults to true, setting to false allows the thumbs to pass each other
+    {@link #constrainThumbs}: false
+});
+</pre>
+ */
+Ext.slider.MultiSlider = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Number} value The value to initialize the slider with. Defaults to minValue.
+     */
+    /**
+     * @cfg {Boolean} vertical Orient the Slider vertically rather than horizontally, defaults to false.
+     */
+    vertical: false,
+    /**
+     * @cfg {Number} minValue The minimum value for the Slider. Defaults to 0.
+     */
+    minValue: 0,
+    /**
+     * @cfg {Number} maxValue The maximum value for the Slider. Defaults to 100.
+     */
+    maxValue: 100,
+    /**
+     * @cfg {Number/Boolean} decimalPrecision.
+     * <p>The number of decimal places to which to round the Slider's value. Defaults to 0.</p>
+     * <p>To disable rounding, configure as <tt><b>false</b></tt>.</p>
+     */
+    decimalPrecision: 0,
+    /**
+     * @cfg {Number} keyIncrement How many units to change the Slider when adjusting with keyboard navigation. Defaults to 1. If the increment config is larger, it will be used instead.
+     */
+    keyIncrement: 1,
+    /**
+     * @cfg {Number} increment How many units to change the slider when adjusting by drag and drop. Use this option to enable 'snapping'.
+     */
+    increment: 0,
+
+    /**
+     * @private
+     * @property clickRange
+     * @type Array
+     * Determines whether or not a click to the slider component is considered to be a user request to change the value. Specified as an array of [top, bottom],
+     * the click event's 'top' property is compared to these numbers and the click only considered a change request if it falls within them. e.g. if the 'top'
+     * value of the click event is 4 or 16, the click is not considered a change request as it falls outside of the [5, 15] range
+     */
+    clickRange: [5,15],
+
+    /**
+     * @cfg {Boolean} clickToChange Determines whether or not clicking on the Slider axis will change the slider. Defaults to true
+     */
+    clickToChange : true,
+    /**
+     * @cfg {Boolean} animate Turn on or off animation. Defaults to true
+     */
+    animate: true,
+    /**
+     * @cfg {Boolean} constrainThumbs True to disallow thumbs from overlapping one another. Defaults to true
+     */
+    constrainThumbs: true,
+
+    /**
+     * @private
+     * @property topThumbZIndex
+     * @type Number
+     * The number used internally to set the z index of the top thumb (see promoteThumb for details)
+     */
+    topThumbZIndex: 10000,
+
+    // private override
+    initComponent : function(){
+        if(!Ext.isDefined(this.value)){
+            this.value = this.minValue;
+        }
+
+        /**
+         * @property thumbs
+         * @type Array
+         * Array containing references to each thumb
+         */
+        this.thumbs = [];
+
+        Ext.slider.MultiSlider.superclass.initComponent.call(this);
+
+        this.keyIncrement = Math.max(this.increment, this.keyIncrement);
+        this.addEvents(
+            /**
+             * @event beforechange
+             * Fires before the slider value is changed. By returning false from an event handler,
+             * you can cancel the event and prevent the slider from changing.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider is being changed to.
+             * @param {Number} oldValue The old value which the slider was previously.
+             */
+            'beforechange',
+
+            /**
+             * @event change
+             * Fires when the slider value is changed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'change',
+
+            /**
+             * @event changecomplete
+             * Fires when the slider value is changed by the user and any drag operations have completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'changecomplete',
+
+            /**
+             * @event dragstart
+             * Fires after a drag operation has started.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragstart',
+
+            /**
+             * @event drag
+             * Fires continuously during the drag operation while the mouse is moving.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'drag',
+
+            /**
+             * @event dragend
+             * Fires after the drag operation has completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragend'
+        );
+
+        /**
+         * @property values
+         * @type Array
+         * Array of values to initalize the thumbs with
+         */
+        if (this.values == undefined || Ext.isEmpty(this.values)) this.values = [0];
+
+        var values = this.values;
+
+        for (var i=0; i < values.length; i++) {
+            this.addThumb(values[i]);
+        }
+
+        if(this.vertical){
+            Ext.apply(this, Ext.slider.Vertical);
+        }
+    },
+
+    /**
+     * Creates a new thumb and adds it to the slider
+     * @param {Number} value The initial value to set on the thumb. Defaults to 0
+     */
+    addThumb: function(value) {
+        var thumb = new Ext.slider.Thumb({
+            value    : value,
+            slider   : this,
+            index    : this.thumbs.length,
+            constrain: this.constrainThumbs
+        });
+        this.thumbs.push(thumb);
+
+        //render the thumb now if needed
+        if (this.rendered) thumb.render();
+    },
+
+    /**
+     * @private
+     * Moves the given thumb above all other by increasing its z-index. This is called when as drag
+     * any thumb, so that the thumb that was just dragged is always at the highest z-index. This is
+     * required when the thumbs are stacked on top of each other at one of the ends of the slider's
+     * range, which can result in the user not being able to move any of them.
+     * @param {Ext.slider.Thumb} topThumb The thumb to move to the top
+     */
+    promoteThumb: function(topThumb) {
+        var thumbs = this.thumbs,
+            zIndex, thumb;
+
+        for (var i = 0, j = thumbs.length; i < j; i++) {
+            thumb = thumbs[i];
+
+            if (thumb == topThumb) {
+                zIndex = this.topThumbZIndex;
+            } else {
+                zIndex = '';
+            }
+
+            thumb.el.setStyle('zIndex', zIndex);
+        }
+    },
+
+    // private override
+    onRender : function() {
+        this.autoEl = {
+            cls: 'x-slider ' + (this.vertical ? 'x-slider-vert' : 'x-slider-horz'),
+            cn : {
+                cls: 'x-slider-end',
+                cn : {
+                    cls:'x-slider-inner',
+                    cn : [{tag:'a', cls:'x-slider-focus', href:"#", tabIndex: '-1', hidefocus:'on'}]
+                }
+            }
+        };
+
+        Ext.slider.MultiSlider.superclass.onRender.apply(this, arguments);
+
+        this.endEl   = this.el.first();
+        this.innerEl = this.endEl.first();
+        this.focusEl = this.innerEl.child('.x-slider-focus');
+
+        //render each thumb
+        for (var i=0; i < this.thumbs.length; i++) {
+            this.thumbs[i].render();
+        }
+
+        //calculate the size of half a thumb
+        var thumb      = this.innerEl.child('.x-slider-thumb');
+        this.halfThumb = (this.vertical ? thumb.getHeight() : thumb.getWidth()) / 2;
+
+        this.initEvents();
+    },
+
+    /**
+     * @private
+     * Adds keyboard and mouse listeners on this.el. Ignores click events on the internal focus element.
+     * Creates a new DragTracker which is used to control what happens when the user drags the thumb around.
+     */
+    initEvents : function(){
+        this.mon(this.el, {
+            scope    : this,
+            mousedown: this.onMouseDown,
+            keydown  : this.onKeyDown
+        });
+
+        this.focusEl.swallowEvent("click", true);
+    },
+
+    /**
+     * @private
+     * Mousedown handler for the slider. If the clickToChange is enabled and the click was not on the draggable 'thumb',
+     * this calculates the new value of the slider and tells the implementation (Horizontal or Vertical) to move the thumb
+     * @param {Ext.EventObject} e The click event
+     */
+    onMouseDown : function(e){
+        if(this.disabled){
+            return;
+        }
+
+        //see if the click was on any of the thumbs
+        var thumbClicked = false;
+        for (var i=0; i < this.thumbs.length; i++) {
+            thumbClicked = thumbClicked || e.target == this.thumbs[i].el.dom;
+        }
+
+        if (this.clickToChange && !thumbClicked) {
+            var local = this.innerEl.translatePoints(e.getXY());
+            this.onClickChange(local);
+        }
+        this.focus();
+    },
+
+    /**
+     * @private
+     * Moves the thumb to the indicated position. Note that a Vertical implementation is provided in Ext.slider.Vertical.
+     * Only changes the value if the click was within this.clickRange.
+     * @param {Object} local Object containing top and left values for the click event.
+     */
+    onClickChange : function(local) {
+        if (local.top > this.clickRange[0] && local.top < this.clickRange[1]) {
+            //find the nearest thumb to the click event
+            var thumb = this.getNearest(local, 'left'),
+                index = thumb.index;
+
+            this.setValue(index, Ext.util.Format.round(this.reverseValue(local.left), this.decimalPrecision), undefined, true);
+        }
+    },
+
+    /**
+     * @private
+     * Returns the nearest thumb to a click event, along with its distance
+     * @param {Object} local Object containing top and left values from a click event
+     * @param {String} prop The property of local to compare on. Use 'left' for horizontal sliders, 'top' for vertical ones
+     * @return {Object} The closest thumb object and its distance from the click event
+     */
+    getNearest: function(local, prop) {
+        var localValue = prop == 'top' ? this.innerEl.getHeight() - local[prop] : local[prop],
+            clickValue = this.reverseValue(localValue),
+            nearestDistance = (this.maxValue - this.minValue) + 5, //add a small fudge for the end of the slider 
+            index = 0,
+            nearest = null;
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                value = thumb.value,
+                dist  = Math.abs(value - clickValue);
+
+            if (Math.abs(dist <= nearestDistance)) {
+                nearest = thumb;
+                index = i;
+                nearestDistance = dist;
+            }
+        }
+        return nearest;
+    },
+
+    /**
+     * @private
+     * Handler for any keypresses captured by the slider. If the key is UP or RIGHT, the thumb is moved along to the right
+     * by this.keyIncrement. If DOWN or LEFT it is moved left. Pressing CTRL moves the slider to the end in either direction
+     * @param {Ext.EventObject} e The Event object
+     */
+    onKeyDown : function(e){
+        /*
+         * The behaviour for keyboard handling with multiple thumbs is currently undefined.
+         * There's no real sane default for it, so leave it like this until we come up
+         * with a better way of doing it.
+         */
+        if(this.disabled || this.thumbs.length !== 1){
+            e.preventDefault();
+            return;
+        }
+        var k = e.getKey(),
+            val;
+        switch(k){
+            case e.UP:
+            case e.RIGHT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.maxValue : this.getValue(0) + this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            case e.DOWN:
+            case e.LEFT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.minValue : this.getValue(0) - this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            default:
+                e.preventDefault();
+        }
+    },
+
+    /**
+     * @private
+     * If using snapping, this takes a desired new value and returns the closest snapped
+     * value to it
+     * @param {Number} value The unsnapped value
+     * @return {Number} The value of the nearest snap target
+     */
+    doSnap : function(value){
+        if (!(this.increment && value)) {
+            return value;
+        }
+        var newValue = value,
+            inc = this.increment,
+            m = value % inc;
+        if (m != 0) {
+            newValue -= m;
+            if (m * 2 >= inc) {
+                newValue += inc;
+            } else if (m * 2 < -inc) {
+                newValue -= inc;
+            }
+        }
+        return newValue.constrain(this.minValue,  this.maxValue);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.slider.MultiSlider.superclass.afterRender.apply(this, arguments);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i];
+
+            if (thumb.value !== undefined) {
+                var v = this.normalizeValue(thumb.value);
+
+                if (v !== thumb.value) {
+                    // delete this.value;
+                    this.setValue(i, v, false);
+                } else {
+                    this.moveThumb(i, this.translateValue(v), false);
+                }
+            }
+        };
+    },
+
+    /**
+     * @private
+     * Returns the ratio of pixels to mapped values. e.g. if the slider is 200px wide and maxValue - minValue is 100,
+     * the ratio is 2
+     * @return {Number} The ratio of pixels to mapped values
+     */
+    getRatio : function(){
+        var w = this.innerEl.getWidth(),
+            v = this.maxValue - this.minValue;
+        return v == 0 ? w : (w/v);
+    },
+
+    /**
+     * @private
+     * Returns a snapped, constrained value when given a desired value
+     * @param {Number} value Raw number value
+     * @return {Number} The raw value rounded to the correct d.p. and constrained within the set max and min values
+     */
+    normalizeValue : function(v){
+        v = this.doSnap(v);
+        v = Ext.util.Format.round(v, this.decimalPrecision);
+        v = v.constrain(this.minValue, this.maxValue);
+        return v;
+    },
+
+    /**
+     * Sets the minimum value for the slider instance. If the current value is less than the
+     * minimum value, the current value will be changed.
+     * @param {Number} val The new minimum value
+     */
+    setMinValue : function(val){
+        this.minValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value < val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Sets the maximum value for the slider instance. If the current value is more than the
+     * maximum value, the current value will be changed.
+     * @param {Number} val The new maximum value
+     */
+    setMaxValue : function(val){
+        this.maxValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value > val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} index Index of the thumb to move
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue : function(index, v, animate, changeComplete) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        v = this.normalizeValue(v);
+
+        if (v !== thumb.value && this.fireEvent('beforechange', this, v, thumb.value, thumb) !== false) {
+            thumb.value = v;
+            if(this.rendered){
+                this.moveThumb(index, this.translateValue(v), animate !== false);
+                this.fireEvent('change', this, v, thumb);
+                if(changeComplete){
+                    this.fireEvent('changecomplete', this, v, thumb);
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     */
+    translateValue : function(v) {
+        var ratio = this.getRatio();
+        return (v * ratio) - (this.minValue * ratio) - this.halfThumb;
+    },
+
+    /**
+     * @private
+     * Given a pixel location along the slider, returns the mapped slider value for that pixel.
+     * E.g. if we have a slider 200px wide with minValue = 100 and maxValue = 500, reverseValue(50)
+     * returns 200
+     * @param {Number} pos The position along the slider to return a mapped value for
+     * @return {Number} The mapped value for the given position
+     */
+    reverseValue : function(pos){
+        var ratio = this.getRatio();
+        return (pos + (this.minValue * ratio)) / ratio;
+    },
+
+    /**
+     * @private
+     * @param {Number} index Index of the thumb to move
+     */
+    moveThumb: function(index, v, animate){
+        var thumb = this.thumbs[index].el;
+
+        if(!animate || this.animate === false){
+            thumb.setLeft(v);
+        }else{
+            thumb.shift({left: v, stopFx: true, duration:.35});
+        }
+    },
+
+    // private
+    focus : function(){
+        this.focusEl.focus(10);
+    },
+
+    // private
+    onResize : function(w, h){
+        var thumbs = this.thumbs,
+            len = thumbs.length,
+            i = 0;
+            
+        /*
+         * If we happen to be animating during a resize, the position of the thumb will likely be off
+         * when the animation stops. As such, just stop any animations before syncing the thumbs.
+         */
+        for(; i < len; ++i){
+            thumbs[i].el.stopFx();    
+        }
+        // check to see if we're using an auto width
+        if(Ext.isNumber(w)){
+            this.innerEl.setWidth(w - (this.el.getPadding('l') + this.endEl.getPadding('r')));
+        }
+        this.syncThumb();
+        Ext.slider.MultiSlider.superclass.onResize.apply(this, arguments);
+    },
+
+    //private
+    onDisable: function(){
+        Ext.slider.MultiSlider.superclass.onDisable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.disable();
+
+            if(Ext.isIE){
+                //IE breaks when using overflow visible and opacity other than 1.
+                //Create a place holder for the thumb and display it.
+                var xy = el.getXY();
+                el.hide();
+
+                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
+
+                if (!this.thumbHolder) {
+                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
+                }
+
+                this.thumbHolder.show().setXY(xy);
+            }
+        }
+    },
+
+    //private
+    onEnable: function(){
+        Ext.slider.MultiSlider.superclass.onEnable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.enable();
+
+            if (Ext.isIE) {
+                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
+
+                if (this.thumbHolder) this.thumbHolder.hide();
+
+                el.show();
+                this.syncThumb();
+            }
+        }
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        if (this.rendered) {
+            for (var i=0; i < this.thumbs.length; i++) {
+                this.moveThumb(i, this.translateValue(this.thumbs[i].value));
+            }
+        }
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @param {Number} index The index of the thumb to return a value for
+     * @return {Number} The current value of the slider
+     */
+    getValue : function(index) {
+        return this.thumbs[index].value;
+    },
+
+    /**
+     * Returns an array of values - one for the location of each thumb
+     * @return {Array} The set of thumb values
+     */
+    getValues: function() {
+        var values = [];
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            values.push(this.thumbs[i].value);
+        }
+
+        return values;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var thumbs = this.thumbs;
+        for(var i = 0, len = thumbs.length; i < len; ++i){
+            thumbs[i].destroy();
+            thumbs[i] = null;
+        }
+        Ext.destroyMembers(this, 'endEl', 'innerEl', 'focusEl', 'thumbHolder');
+        Ext.slider.MultiSlider.superclass.beforeDestroy.call(this);
+    }
+});
+
+Ext.reg('multislider', Ext.slider.MultiSlider);
+
+/**
+ * @class Ext.slider.SingleSlider
+ * @extends Ext.slider.MultiSlider
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments,
+ * configurable snapping, axis clicking and animation. Can be added as an item to
+ * any container. Example usage:
+<pre><code>
+new Ext.slider.SingleSlider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</code></pre>
+ * The class Ext.slider.SingleSlider is aliased to Ext.Slider for backwards compatibility.
+ */
+Ext.slider.SingleSlider = Ext.extend(Ext.slider.MultiSlider, {
+    constructor: function(config) {
+      config = config || {};
+
+      Ext.applyIf(config, {
+          values: [config.value || 0]
+      });
+
+      Ext.slider.SingleSlider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @return {Number} The current value of the slider
+     */
+    getValue: function() {
+        //just returns the value of the first thumb, which should be the only one in a single slider
+        return Ext.slider.SingleSlider.superclass.getValue.call(this, 0);
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue: function(value, animate) {
+        var args = Ext.toArray(arguments),
+            len  = args.length;
+
+        //this is to maintain backwards compatiblity for sliders with only one thunb. Usually you must pass the thumb
+        //index to setValue, but if we only have one thumb we inject the index here first if given the multi-slider
+        //signature without the required index. The index will always be 0 for a single slider
+        if (len == 1 || (len <= 3 && typeof arguments[1] != 'number')) {
+            args.unshift(0);
+        }
+
+        return Ext.slider.SingleSlider.superclass.setValue.apply(this, args);
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        return Ext.slider.SingleSlider.superclass.syncThumb.apply(this, [0].concat(arguments));
+    },
+    
+    // private
+    getNearest : function(){
+        // Since there's only 1 thumb, it's always the nearest
+        return this.thumbs[0];    
+    }
+});
+
+//backwards compatibility
+Ext.Slider = Ext.slider.SingleSlider;
+
+Ext.reg('slider', Ext.slider.SingleSlider);
+
+// private class to support vertical sliders
+Ext.slider.Vertical = {
+    onResize : function(w, h){
+        this.innerEl.setHeight(h - (this.el.getPadding('t') + this.endEl.getPadding('b')));
+        this.syncThumb();
+    },
+
+    getRatio : function(){
+        var h = this.innerEl.getHeight(),
+            v = this.maxValue - this.minValue;
+        return h/v;
+    },
+
+    moveThumb: function(index, v, animate) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        if (!animate || this.animate === false) {
+            el.setBottom(v);
+        } else {
+            el.shift({bottom: v, stopFx: true, duration:.35});
+        }
+    },
+
+    onClickChange : function(local) {
+        if (local.left > this.clickRange[0] && local.left < this.clickRange[1]) {
+            var thumb = this.getNearest(local, 'top'),
+                index = thumb.index,
+                value = this.minValue + this.reverseValue(this.innerEl.getHeight() - local.top);
+
+            this.setValue(index, Ext.util.Format.round(value, this.decimalPrecision), undefined, true);
+        }
+    }
+};
+
+//private class to support vertical dragging of thumbs within a slider
+Ext.slider.Thumb.Vertical = {
+    getNewValue: function() {
+        var slider   = this.slider,
+            innerEl  = slider.innerEl,
+            pos      = innerEl.translatePoints(this.tracker.getXY()),
+            bottom   = innerEl.getHeight() - pos.top;
+
+        return slider.minValue + Ext.util.Format.round(bottom / slider.getRatio(), slider.decimalPrecision);
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Editor.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Editor.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Editor.js	(revision 76)
@@ -0,0 +1,401 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Editor
+ * @extends Ext.Component
+ * A base editor field that handles displaying/hiding on demand and has some built-in sizing and event handling logic.
+ * @constructor
+ * Create a new Editor
+ * @param {Object} config The config object
+ * @xtype editor
+ */
+Ext.Editor = function(field, config){
+    if(field.field){
+        this.field = Ext.create(field.field, 'textfield');
+        config = Ext.apply({}, field); // copy so we don't disturb original config
+        delete config.field;
+    }else{
+        this.field = field;
+    }
+    Ext.Editor.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.Editor, Ext.Component, {
+    /**
+    * @cfg {Ext.form.Field} field
+    * The Field object (or descendant) or config object for field
+    */
+    /**
+     * @cfg {Boolean} allowBlur
+     * True to {@link #completeEdit complete the editing process} if in edit mode when the
+     * field is blurred. Defaults to <tt>true</tt>.
+     */
+    allowBlur: true,
+    /**
+     * @cfg {Boolean/String} autoSize
+     * True for the editor to automatically adopt the size of the underlying field, "width" to adopt the width only,
+     * or "height" to adopt the height only, "none" to always use the field dimensions. (defaults to false)
+     */
+    /**
+     * @cfg {Boolean} revertInvalid
+     * True to automatically revert the field value and cancel the edit when the user completes an edit and the field
+     * validation fails (defaults to true)
+     */
+    /**
+     * @cfg {Boolean} ignoreNoChange
+     * True to skip the edit completion process (no save, no events fired) if the user completes an edit and
+     * the value has not changed (defaults to false).  Applies only to string values - edits for other data types
+     * will never be ignored.
+     */
+    /**
+     * @cfg {Boolean} hideEl
+     * False to keep the bound element visible while the editor is displayed (defaults to true)
+     */
+    /**
+     * @cfg {Mixed} value
+     * The data value of the underlying field (defaults to "")
+     */
+    value : "",
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "c-c?").
+     */
+    alignment: "c-c?",
+    /**
+     * @cfg {Array} offsets
+     * The offsets to use when aligning (see {@link Ext.Element#alignTo} for more details. Defaults to <tt>[0, 0]</tt>.
+     */
+    offsets: [0, 0],
+    /**
+     * @cfg {Boolean/String} shadow "sides" for sides/bottom only, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "frame")
+     */
+    shadow : "frame",
+    /**
+     * @cfg {Boolean} constrain True to constrain the editor to the viewport
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} swallowKeys Handle the keydown/keypress events so they don't propagate (defaults to true)
+     */
+    swallowKeys : true,
+    /**
+     * @cfg {Boolean} completeOnEnter True to complete the edit when the enter key is pressed. Defaults to <tt>true</tt>.
+     */
+    completeOnEnter : true,
+    /**
+     * @cfg {Boolean} cancelOnEsc True to cancel the edit when the escape key is pressed. Defaults to <tt>true</tt>.
+     */
+    cancelOnEsc : true,
+    /**
+     * @cfg {Boolean} updateEl True to update the innerHTML of the bound element when the update completes (defaults to false)
+     */
+    updateEl : false,
+
+    initComponent : function(){
+        Ext.Editor.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforestartedit
+             * Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning
+             * false from the handler of this event.
+             * @param {Editor} this
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The field value being set
+             */
+            "beforestartedit",
+            /**
+             * @event startedit
+             * Fires when this editor is displayed
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The starting field value
+             */
+            "startedit",
+            /**
+             * @event beforecomplete
+             * Fires after a change has been made to the field, but before the change is reflected in the underlying
+             * field.  Saving the change to the field can be canceled by returning false from the handler of this event.
+             * Note that if the value has not changed and ignoreNoChange = true, the editing will still end but this
+             * event will not fire since no edit actually occurred.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "beforecomplete",
+            /**
+             * @event complete
+             * Fires after editing is complete and any changed value has been written to the underlying field.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "complete",
+            /**
+             * @event canceledit
+             * Fires after editing has been canceled and the editor's value has been reset.
+             * @param {Editor} this
+             * @param {Mixed} value The user-entered field value that was discarded
+             * @param {Mixed} startValue The original field value that was set back into the editor after cancel
+             */
+            "canceledit",
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check
+             * {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            "specialkey"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.el = new Ext.Layer({
+            shadow: this.shadow,
+            cls: "x-editor",
+            parentEl : ct,
+            shim : this.shim,
+            shadowOffset: this.shadowOffset || 4,
+            id: this.id,
+            constrain: this.constrain
+        });
+        if(this.zIndex){
+            this.el.setZIndex(this.zIndex);
+        }
+        this.el.setStyle("overflow", Ext.isGecko ? "auto" : "hidden");
+        if(this.field.msgTarget != 'title'){
+            this.field.msgTarget = 'qtip';
+        }
+        this.field.inEditor = true;
+        this.mon(this.field, {
+            scope: this,
+            blur: this.onBlur,
+            specialkey: this.onSpecialKey
+        });
+        if(this.field.grow){
+            this.mon(this.field, "autosize", this.el.sync,  this.el, {delay:1});
+        }
+        this.field.render(this.el).show();
+        this.field.getEl().dom.name = '';
+        if(this.swallowKeys){
+            this.field.el.swallowEvent([
+                'keypress', // *** Opera
+                'keydown'   // *** all other browsers
+            ]);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var key = e.getKey(),
+            complete = this.completeOnEnter && key == e.ENTER,
+            cancel = this.cancelOnEsc && key == e.ESC;
+        if(complete || cancel){
+            e.stopEvent();
+            if(complete){
+                this.completeEdit();
+            }else{
+                this.cancelEdit();
+            }
+            if(field.triggerBlur){
+                field.triggerBlur();
+            }
+        }
+        this.fireEvent('specialkey', field, e);
+    },
+
+    /**
+     * Starts the editing process and shows the editor.
+     * @param {Mixed} el The element to edit
+     * @param {String} value (optional) A value to initialize the editor with. If a value is not provided, it defaults
+      * to the innerHTML of el.
+     */
+    startEdit : function(el, value){
+        if(this.editing){
+            this.completeEdit();
+        }
+        this.boundEl = Ext.get(el);
+        var v = value !== undefined ? value : this.boundEl.dom.innerHTML;
+        if(!this.rendered){
+            this.render(this.parentEl || document.body);
+        }
+        if(this.fireEvent("beforestartedit", this, this.boundEl, v) !== false){
+            this.startValue = v;
+            this.field.reset();
+            this.field.setValue(v);
+            this.realign(true);
+            this.editing = true;
+            this.show();
+        }
+    },
+
+    // private
+    doAutoSize : function(){
+        if(this.autoSize){
+            var sz = this.boundEl.getSize(),
+                fs = this.field.getSize();
+
+            switch(this.autoSize){
+                case "width":
+                    this.setSize(sz.width, fs.height);
+                    break;
+                case "height":
+                    this.setSize(fs.width, sz.height);
+                    break;
+                case "none":
+                    this.setSize(fs.width, fs.height);
+                    break;
+                default:
+                    this.setSize(sz.width, sz.height);
+            }
+        }
+    },
+
+    /**
+     * Sets the height and width of this editor.
+     * @param {Number} width The new width
+     * @param {Number} height The new height
+     */
+    setSize : function(w, h){
+        delete this.field.lastSize;
+        this.field.setSize(w, h);
+        if(this.el){
+            // IE7 in strict mode doesn't size properly.
+            if(Ext.isGecko2 || Ext.isOpera || (Ext.isIE7 && Ext.isStrict)){
+                // prevent layer scrollbars
+                this.el.setSize(w, h);
+            }
+            this.el.sync();
+        }
+    },
+
+    /**
+     * Realigns the editor to the bound field based on the current alignment config value.
+     * @param {Boolean} autoSize (optional) True to size the field to the dimensions of the bound element.
+     */
+    realign : function(autoSize){
+        if(autoSize === true){
+            this.doAutoSize();
+        }
+        this.el.alignTo(this.boundEl, this.alignment, this.offsets);
+    },
+
+    /**
+     * Ends the editing process, persists the changed value to the underlying field, and hides the editor.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after edit (defaults to false)
+     */
+    completeEdit : function(remainVisible){
+        if(!this.editing){
+            return;
+        }
+        // Assert combo values first
+        if (this.field.assertValue) {
+            this.field.assertValue();
+        }
+        var v = this.getValue();
+        if(!this.field.isValid()){
+            if(this.revertInvalid !== false){
+                this.cancelEdit(remainVisible);
+            }
+            return;
+        }
+        if(String(v) === String(this.startValue) && this.ignoreNoChange){
+            this.hideEdit(remainVisible);
+            return;
+        }
+        if(this.fireEvent("beforecomplete", this, v, this.startValue) !== false){
+            v = this.getValue();
+            if(this.updateEl && this.boundEl){
+                this.boundEl.update(v);
+            }
+            this.hideEdit(remainVisible);
+            this.fireEvent("complete", this, v, this.startValue);
+        }
+    },
+
+    // private
+    onShow : function(){
+        this.el.show();
+        if(this.hideEl !== false){
+            this.boundEl.hide();
+        }
+        this.field.show().focus(false, true);
+        this.fireEvent("startedit", this.boundEl, this.startValue);
+    },
+
+    /**
+     * Cancels the editing process and hides the editor without persisting any changes.  The field value will be
+     * reverted to the original starting value.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after
+     * cancel (defaults to false)
+     */
+    cancelEdit : function(remainVisible){
+        if(this.editing){
+            var v = this.getValue();
+            this.setValue(this.startValue);
+            this.hideEdit(remainVisible);
+            this.fireEvent("canceledit", this, v, this.startValue);
+        }
+    },
+
+    // private
+    hideEdit: function(remainVisible){
+        if(remainVisible !== true){
+            this.editing = false;
+            this.hide();
+        }
+    },
+
+    // private
+    onBlur : function(){
+        // selectSameEditor flag allows the same editor to be started without onBlur firing on itself
+        if(this.allowBlur === true && this.editing && this.selectSameEditor !== true){
+            this.completeEdit();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.editing){
+            this.completeEdit();
+            return;
+        }
+        this.field.blur();
+        if(this.field.collapse){
+            this.field.collapse();
+        }
+        this.el.hide();
+        if(this.hideEl !== false){
+            this.boundEl.show();
+        }
+    },
+
+    /**
+     * Sets the data value of the editor
+     * @param {Mixed} value Any valid value supported by the underlying field
+     */
+    setValue : function(v){
+        this.field.setValue(v);
+    },
+
+    /**
+     * Gets the data value of the editor
+     * @return {Mixed} The data value
+     */
+    getValue : function(){
+        return this.field.getValue();
+    },
+
+    beforeDestroy : function(){
+        Ext.destroyMembers(this, 'field');
+
+        delete this.parentEl;
+        delete this.boundEl;
+    }
+});
+Ext.reg('editor', Ext.Editor);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/TabPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/TabPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/TabPanel.js	(revision 76)
@@ -0,0 +1,1132 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.TabPanel
+ * <p>A basic tab container. TabPanels can be used exactly like a standard {@link Ext.Panel}
+ * for layout purposes, but also have special support for containing child Components
+ * (<tt>{@link Ext.Container#items items}</tt>) that are managed using a
+ * {@link Ext.layout.CardLayout CardLayout layout manager}, and displayed as separate tabs.</p>
+ *
+ * <b>Note:</b> By default, a tab's close tool <i>destroys</i> the child tab Component
+ * and all its descendants. This makes the child tab Component, and all its descendants <b>unusable</b>. To enable
+ * re-use of a tab, configure the TabPanel with <b><code>{@link #autoDestroy autoDestroy: false}</code></b>.
+ *
+ * <p><b><u>TabPanel header/footer elements</u></b></p>
+ * <p>TabPanels use their {@link Ext.Panel#header header} or {@link Ext.Panel#footer footer} element
+ * (depending on the {@link #tabPosition} configuration) to accommodate the tab selector buttons.
+ * This means that a TabPanel will not display any configured title, and will not display any
+ * configured header {@link Ext.Panel#tools tools}.</p>
+ * <p>To display a header, embed the TabPanel in a {@link Ext.Panel Panel} which uses
+ * <b><tt>{@link Ext.Container#layout layout:'fit'}</tt></b>.</p>
+ *
+ * <p><b><u>Tab Events</u></b></p>
+ * <p>There is no actual tab class &mdash; each tab is simply a {@link Ext.BoxComponent Component}
+ * such as a {@link Ext.Panel Panel}. However, when rendered in a TabPanel, each child Component
+ * can fire additional events that only exist for tabs and are not available from other Components.
+ * These events are:</p>
+ * <div><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.Panel#activate activate}</b></tt> : Fires when this Component becomes
+ * the active tab.</li>
+ * <li><tt><b>{@link Ext.Panel#deactivate deactivate}</b></tt> : Fires when the Component that
+ * was the active tab becomes deactivated.</li>
+ * <li><tt><b>{@link Ext.Panel#beforeclose beforeclose}</b></tt> : Fires when the user clicks on the close tool of a closeable tab.
+ * May be vetoed by returning <code>false</code> from a handler.</li>
+ * <li><tt><b>{@link Ext.Panel#close close}</b></tt> : Fires a closeable tab has been closed by the user.</li>
+ * </ul></div>
+ * <p><b><u>Creating TabPanels from Code</u></b></p>
+ * <p>TabPanels can be created and rendered completely in code, as in this example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: Ext.getBody(),
+    activeTab: 0,
+    items: [{
+        title: 'Tab 1',
+        html: 'A simple tab'
+    },{
+        title: 'Tab 2',
+        html: 'Another one'
+    }]
+});
+</code></pre>
+ * <p><b><u>Creating TabPanels from Existing Markup</u></b></p>
+ * <p>TabPanels can also be rendered from pre-existing markup in a couple of ways.</p>
+ * <div><ul class="mdetail-params">
+ *
+ * <li>Pre-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A container div with one or more nested tab divs with class <tt>'x-tab'</tt> can be rendered entirely
+ * from existing markup (See the {@link #autoTabs} example).</p>
+ * </div>
+ *
+ * <li>Un-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A TabPanel can also be rendered from markup that is not strictly structured by simply specifying by id
+ * which elements should be the container and the tabs. Using this method tab content can be pulled from different
+ * elements within the page by id regardless of page structure. For example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: 'my-tabs',
+    activeTab: 0,
+    items:[
+        {contentEl:'tab1', title:'Tab 1'},
+        {contentEl:'tab2', title:'Tab 2'}
+    ]
+});
+
+// Note that the tabs do not have to be nested within the container (although they can be)
+&lt;div id="my-tabs">&lt;/div>
+&lt;div id="tab1" class="x-hide-display">A simple tab&lt;/div>
+&lt;div id="tab2" class="x-hide-display">Another one&lt;/div>
+</code></pre>
+ * Note that the tab divs in this example contain the class <tt>'x-hide-display'</tt> so that they can be rendered
+ * deferred without displaying outside the tabs. You could alternately set <tt>{@link #deferredRender} = false </tt>
+ * to render all content tabs on page load.
+ * </div>
+ *
+ * </ul></div>
+ *
+ * @extends Ext.Panel
+ * @constructor
+ * @param {Object} config The configuration options
+ * @xtype tabpanel
+ */
+Ext.TabPanel = Ext.extend(Ext.Panel,  {
+    /**
+     * @cfg {Boolean} layoutOnTabChange
+     * Set to true to force a layout of the active tab when the tab is changed. Defaults to false.
+     * See {@link Ext.layout.CardLayout}.<code>{@link Ext.layout.CardLayout#layoutOnCardChange layoutOnCardChange}</code>.
+     */
+    /**
+     * @cfg {String} tabCls <b>This config option is used on <u>child Components</u> of ths TabPanel.</b> A CSS
+     * class name applied to the tab strip item representing the child Component, allowing special
+     * styling to be applied.
+     */
+    /**
+     * @cfg {Boolean} deferredRender
+     * <p><tt>true</tt> by default to defer the rendering of child <tt>{@link Ext.Container#items items}</tt>
+     * to the browsers DOM until a tab is activated. <tt>false</tt> will render all contained
+     * <tt>{@link Ext.Container#items items}</tt> as soon as the {@link Ext.layout.CardLayout layout}
+     * is rendered. If there is a significant amount of content or a lot of heavy controls being
+     * rendered into panels that are not displayed by default, setting this to <tt>true</tt> might
+     * improve performance.</p>
+     * <br><p>The <tt>deferredRender</tt> property is internally passed to the layout manager for
+     * TabPanels ({@link Ext.layout.CardLayout}) as its {@link Ext.layout.CardLayout#deferredRender}
+     * configuration value.</p>
+     * <br><p><b>Note</b>: leaving <tt>deferredRender</tt> as <tt>true</tt> means that the content
+     * within an unactivated tab will not be available. For example, this means that if the TabPanel
+     * is within a {@link Ext.form.FormPanel form}, then until a tab is activated, any Fields within
+     * unactivated tabs will not be rendered, and will therefore not be submitted and will not be
+     * available to either {@link Ext.form.BasicForm#getValues getValues} or
+     * {@link Ext.form.BasicForm#setValues setValues}.</p>
+     */
+    deferredRender : true,
+    /**
+     * @cfg {Number} tabWidth The initial width in pixels of each new tab (defaults to 120).
+     */
+    tabWidth : 120,
+    /**
+     * @cfg {Number} minTabWidth The minimum width in pixels for each tab when {@link #resizeTabs} = true (defaults to 30).
+     */
+    minTabWidth : 30,
+    /**
+     * @cfg {Boolean} resizeTabs True to automatically resize each tab so that the tabs will completely fill the
+     * tab strip (defaults to false).  Setting this to true may cause specific widths that might be set per tab to
+     * be overridden in order to fit them all into view (although {@link #minTabWidth} will always be honored).
+     */
+    resizeTabs : false,
+    /**
+     * @cfg {Boolean} enableTabScroll True to enable scrolling to tabs that may be invisible due to overflowing the
+     * overall TabPanel width. Only available with tabPosition:'top' (defaults to false).
+     */
+    enableTabScroll : false,
+    /**
+     * @cfg {Number} scrollIncrement The number of pixels to scroll each time a tab scroll button is pressed
+     * (defaults to <tt>100</tt>, or if <tt>{@link #resizeTabs} = true</tt>, the calculated tab width).  Only
+     * applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    scrollIncrement : 0,
+    /**
+     * @cfg {Number} scrollRepeatInterval Number of milliseconds between each scroll while a tab scroll button is
+     * continuously pressed (defaults to <tt>400</tt>).
+     */
+    scrollRepeatInterval : 400,
+    /**
+     * @cfg {Float} scrollDuration The number of milliseconds that each scroll animation should last (defaults
+     * to <tt>.35</tt>). Only applies when <tt>{@link #animScroll} = true</tt>.
+     */
+    scrollDuration : 0.35,
+    /**
+     * @cfg {Boolean} animScroll True to animate tab scrolling so that hidden tabs slide smoothly into view (defaults
+     * to <tt>true</tt>).  Only applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    animScroll : true,
+    /**
+     * @cfg {String} tabPosition The position where the tab strip should be rendered (defaults to <tt>'top'</tt>).
+     * The only other supported value is <tt>'bottom'</tt>.  <b>Note</b>: tab scrolling is only supported for
+     * <tt>tabPosition: 'top'</tt>.
+     */
+    tabPosition : 'top',
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the panel (defaults to <tt>'x-tab-panel'</tt>).
+     */
+    baseCls : 'x-tab-panel',
+    /**
+     * @cfg {Boolean} autoTabs
+     * <p><tt>true</tt> to query the DOM for any divs with a class of 'x-tab' to be automatically converted
+     * to tabs and added to this panel (defaults to <tt>false</tt>).  Note that the query will be executed within
+     * the scope of the container element only (so that multiple tab panels from markup can be supported via this
+     * method).</p>
+     * <p>This method is only possible when the markup is structured correctly as a container with nested divs
+     * containing the class <tt>'x-tab'</tt>. To create TabPanels without these limitations, or to pull tab content
+     * from other elements on the page, see the example at the top of the class for generating tabs from markup.</p>
+     * <p>There are a couple of things to note when using this method:<ul>
+     * <li>When using the <tt>autoTabs</tt> config (as opposed to passing individual tab configs in the TabPanel's
+     * {@link #items} collection), you must use <tt>{@link #applyTo}</tt> to correctly use the specified <tt>id</tt>
+     * as the tab container. The <tt>autoTabs</tt> method <em>replaces</em> existing content with the TabPanel
+     * components.</li>
+     * <li>Make sure that you set <tt>{@link #deferredRender}: false</tt> so that the content elements for each
+     * tab will be rendered into the TabPanel immediately upon page load, otherwise they will not be transformed
+     * until each tab is activated and will be visible outside the TabPanel.</li>
+     * </ul>Example usage:</p>
+     * <pre><code>
+var tabs = new Ext.TabPanel({
+    applyTo: 'my-tabs',
+    activeTab: 0,
+    deferredRender: false,
+    autoTabs: true
+});
+
+// This markup will be converted to a TabPanel from the code above
+&lt;div id="my-tabs">
+    &lt;div class="x-tab" title="Tab 1">A simple tab&lt;/div>
+    &lt;div class="x-tab" title="Tab 2">Another one&lt;/div>
+&lt;/div>
+</code></pre>
+     */
+    autoTabs : false,
+    /**
+     * @cfg {String} autoTabSelector The CSS selector used to search for tabs in existing markup when
+     * <tt>{@link #autoTabs} = true</tt> (defaults to <tt>'div.x-tab'</tt>).  This can be any valid selector
+     * supported by {@link Ext.DomQuery#select}. Note that the query will be executed within the scope of this
+     * tab panel only (so that multiple tab panels from markup can be supported on a page).
+     */
+    autoTabSelector : 'div.x-tab',
+    /**
+     * @cfg {String/Number} activeTab A string id or the numeric index of the tab that should be initially
+     * activated on render (defaults to undefined).
+     */
+    activeTab : undefined,
+    /**
+     * @cfg {Number} tabMargin The number of pixels of space to calculate into the sizing and scrolling of
+     * tabs. If you change the margin in CSS, you will need to update this value so calculations are correct
+     * with either <tt>{@link #resizeTabs}</tt> or scrolling tabs. (defaults to <tt>2</tt>)
+     */
+    tabMargin : 2,
+    /**
+     * @cfg {Boolean} plain </tt>true</tt> to render the tab strip without a background container image
+     * (defaults to <tt>false</tt>).
+     */
+    plain : false,
+    /**
+     * @cfg {Number} wheelIncrement For scrolling tabs, the number of pixels to increment on mouse wheel
+     * scrolling (defaults to <tt>20</tt>).
+     */
+    wheelIncrement : 20,
+
+    /*
+     * This is a protected property used when concatenating tab ids to the TabPanel id for internal uniqueness.
+     * It does not generally need to be changed, but can be if external code also uses an id scheme that can
+     * potentially clash with this one.
+     */
+    idDelimiter : '__',
+
+    // private
+    itemCls : 'x-tab-item',
+
+    // private config overrides
+    elements : 'body',
+    headerAsText : false,
+    frame : false,
+    hideBorders :true,
+
+    // private
+    initComponent : function(){
+        this.frame = false;
+        Ext.TabPanel.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforetabchange
+             * Fires before the active tab changes. Handlers can <tt>return false</tt> to cancel the tab change.
+             * @param {TabPanel} this
+             * @param {Panel} newTab The tab being activated
+             * @param {Panel} currentTab The current active tab
+             */
+            'beforetabchange',
+            /**
+             * @event tabchange
+             * Fires after the active tab has changed.
+             * @param {TabPanel} this
+             * @param {Panel} tab The new active tab
+             */
+            'tabchange',
+            /**
+             * @event contextmenu
+             * Relays the contextmenu event from a tab selector element in the tab strip.
+             * @param {TabPanel} this
+             * @param {Panel} tab The target tab
+             * @param {EventObject} e
+             */
+            'contextmenu'
+        );
+        /**
+         * @cfg {Object} layoutConfig
+         * TabPanel implicitly uses {@link Ext.layout.CardLayout} as its layout manager.
+         * <code>layoutConfig</code> may be used to configure this layout manager.
+         * <code>{@link #deferredRender}</code> and <code>{@link #layoutOnTabChange}</code>
+         * configured on the TabPanel will be applied as configs to the layout manager.
+         */
+        this.setLayout(new Ext.layout.CardLayout(Ext.apply({
+            layoutOnCardChange: this.layoutOnTabChange,
+            deferredRender: this.deferredRender
+        }, this.layoutConfig)));
+
+        if(this.tabPosition == 'top'){
+            this.elements += ',header';
+            this.stripTarget = 'header';
+        }else {
+            this.elements += ',footer';
+            this.stripTarget = 'footer';
+        }
+        if(!this.stack){
+            this.stack = Ext.TabPanel.AccessStack();
+        }
+        this.initItems();
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.TabPanel.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            var pos = this.tabPosition == 'top' ? 'header' : 'footer';
+            this[pos].addClass('x-tab-panel-'+pos+'-plain');
+        }
+
+        var st = this[this.stripTarget];
+
+        this.stripWrap = st.createChild({cls:'x-tab-strip-wrap', cn:{
+            tag:'ul', cls:'x-tab-strip x-tab-strip-'+this.tabPosition}});
+
+        var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);
+        st.createChild({cls:'x-tab-strip-spacer'}, beforeEl);
+        this.strip = new Ext.Element(this.stripWrap.dom.firstChild);
+
+        // create an empty span with class x-tab-strip-text to force the height of the header element when there's no tabs.
+        this.edge = this.strip.createChild({tag:'li', cls:'x-tab-edge', cn: [{tag: 'span', cls: 'x-tab-strip-text', cn: '&#160;'}]});
+        this.strip.createChild({cls:'x-clear'});
+
+        this.body.addClass('x-tab-panel-body-'+this.tabPosition);
+
+        /**
+         * @cfg {Template/XTemplate} itemTpl <p>(Optional) A {@link Ext.Template Template} or
+         * {@link Ext.XTemplate XTemplate} which may be provided to process the data object returned from
+         * <tt>{@link #getTemplateArgs}</tt> to produce a clickable selector element in the tab strip.</p>
+         * <p>The main element created should be a <tt>&lt;li></tt> element. In order for a click event on
+         * a selector element to be connected to its item, it must take its <i>id</i> from the TabPanel's
+         * native <tt>{@link #getTemplateArgs}</tt>.</p>
+         * <p>The child element which contains the title text must be marked by the CSS class
+         * <tt>x-tab-strip-inner</tt>.</p>
+         * <p>To enable closability, the created element should contain an element marked by the CSS class
+         * <tt>x-tab-strip-close</tt>.</p>
+         * <p>If a custom <tt>itemTpl</tt> is supplied, it is the developer's responsibility to create CSS
+         * style rules to create the desired appearance.</p>
+         * Below is an example of how to create customized tab selector items:<pre><code>
+new Ext.TabPanel({
+    renderTo: document.body,
+    minTabWidth: 115,
+    tabWidth: 135,
+    enableTabScroll: true,
+    width: 600,
+    height: 250,
+    defaults: {autoScroll:true},
+    itemTpl: new Ext.XTemplate(
+    '&lt;li class="{cls}" id="{id}" style="overflow:hidden">',
+         '&lt;tpl if="closable">',
+            '&lt;a class="x-tab-strip-close">&lt;/a>',
+         '&lt;/tpl>',
+         '&lt;a class="x-tab-right" href="#" style="padding-left:6px">',
+            '&lt;em class="x-tab-left">',
+                '&lt;span class="x-tab-strip-inner">',
+                    '&lt;img src="{src}" style="float:left;margin:3px 3px 0 0">',
+                    '&lt;span style="margin-left:20px" class="x-tab-strip-text {iconCls}">{text} {extra}&lt;/span>',
+                '&lt;/span>',
+            '&lt;/em>',
+        '&lt;/a>',
+    '&lt;/li>'
+    ),
+    getTemplateArgs: function(item) {
+//      Call the native method to collect the base data. Like the ID!
+        var result = Ext.TabPanel.prototype.getTemplateArgs.call(this, item);
+
+//      Add stuff used in our template
+        return Ext.apply(result, {
+            closable: item.closable,
+            src: item.iconSrc,
+            extra: item.extraText || ''
+        });
+    },
+    items: [{
+        title: 'New Tab 1',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 1',
+        closable: true
+    }, {
+        title: 'New Tab 2',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 2',
+        extraText: 'Extra stuff in the tab button'
+    }]
+});
+</code></pre>
+         */
+        if(!this.itemTpl){
+            var tt = new Ext.Template(
+                 '<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>',
+                 '<a class="x-tab-right" href="#"><em class="x-tab-left">',
+                 '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',
+                 '</em></a></li>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.TabPanel.prototype.itemTpl = tt;
+        }
+
+        this.items.each(this.initTab, this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.TabPanel.superclass.afterRender.call(this);
+        if(this.autoTabs){
+            this.readTabs(false);
+        }
+        if(this.activeTab !== undefined){
+            var item = Ext.isObject(this.activeTab) ? this.activeTab : this.items.get(this.activeTab);
+            delete this.activeTab;
+            this.setActiveTab(item);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.TabPanel.superclass.initEvents.call(this);
+        this.mon(this.strip, {
+            scope: this,
+            mousedown: this.onStripMouseDown,
+            contextmenu: this.onStripContextMenu
+        });
+        if(this.enableTabScroll){
+            this.mon(this.strip, 'mousewheel', this.onWheel, this);
+        }
+    },
+
+    // private
+    findTargets : function(e){
+        var item = null,
+            itemEl = e.getTarget('li:not(.x-tab-edge)', this.strip);
+
+        if(itemEl){
+            item = this.getComponent(itemEl.id.split(this.idDelimiter)[1]);
+            if(item.disabled){
+                return {
+                    close : null,
+                    item : null,
+                    el : null
+                };
+            }
+        }
+        return {
+            close : e.getTarget('.x-tab-strip-close', this.strip),
+            item : item,
+            el : itemEl
+        };
+    },
+
+    // private
+    onStripMouseDown : function(e){
+        if(e.button !== 0){
+            return;
+        }
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.close){
+            if (t.item.fireEvent('beforeclose', t.item) !== false) {
+                t.item.fireEvent('close', t.item);
+                this.remove(t.item);
+            }
+            return;
+        }
+        if(t.item && t.item != this.activeTab){
+            this.setActiveTab(t.item);
+        }
+    },
+
+    // private
+    onStripContextMenu : function(e){
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.item){
+            this.fireEvent('contextmenu', this, t.item, e);
+        }
+    },
+
+    /**
+     * True to scan the markup in this tab panel for <tt>{@link #autoTabs}</tt> using the
+     * <tt>{@link #autoTabSelector}</tt>
+     * @param {Boolean} removeExisting True to remove existing tabs
+     */
+    readTabs : function(removeExisting){
+        if(removeExisting === true){
+            this.items.each(function(item){
+                this.remove(item);
+            }, this);
+        }
+        var tabs = this.el.query(this.autoTabSelector);
+        for(var i = 0, len = tabs.length; i < len; i++){
+            var tab = tabs[i],
+                title = tab.getAttribute('title');
+            tab.removeAttribute('title');
+            this.add({
+                title: title,
+                contentEl: tab
+            });
+        }
+    },
+
+    // private
+    initTab : function(item, index){
+        var before = this.strip.dom.childNodes[index],
+            p = this.getTemplateArgs(item),
+            el = before ?
+                 this.itemTpl.insertBefore(before, p) :
+                 this.itemTpl.append(this.strip, p),
+            cls = 'x-tab-strip-over',
+            tabEl = Ext.get(el);
+
+        tabEl.hover(function(){
+            if(!item.disabled){
+                tabEl.addClass(cls);
+            }
+        }, function(){
+            tabEl.removeClass(cls);
+        });
+
+        if(item.tabTip){
+            tabEl.child('span.x-tab-strip-text', true).qtip = item.tabTip;
+        }
+        item.tabEl = el;
+
+        // Route *keyboard triggered* click events to the tab strip mouse handler.
+        tabEl.select('a').on('click', function(e){
+            if(!e.getPageX()){
+                this.onStripMouseDown(e);
+            }
+        }, this, {preventDefault: true});
+
+        item.on({
+            scope: this,
+            disable: this.onItemDisabled,
+            enable: this.onItemEnabled,
+            titlechange: this.onItemTitleChanged,
+            iconchange: this.onItemIconChanged,
+            beforeshow: this.onBeforeShowItem
+        });
+    },
+
+
+
+    /**
+     * <p>Provides template arguments for rendering a tab selector item in the tab strip.</p>
+     * <p>This method returns an object hash containing properties used by the TabPanel's <tt>{@link #itemTpl}</tt>
+     * to create a formatted, clickable tab selector element. The properties which must be returned
+     * are:</p><div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc">A unique identifier which links to the item</div></li>
+     * <li><b>text</b> : String<div class="sub-desc">The text to display</div></li>
+     * <li><b>cls</b> : String<div class="sub-desc">The CSS class name</div></li>
+     * <li><b>iconCls</b> : String<div class="sub-desc">A CSS class to provide appearance for an icon.</div></li>
+     * </ul></div>
+     * @param {Ext.BoxComponent} item The {@link Ext.BoxComponent BoxComponent} for which to create a selector element in the tab strip.
+     * @return {Object} An object hash containing the properties required to render the selector element.
+     */
+    getTemplateArgs : function(item) {
+        var cls = item.closable ? 'x-tab-strip-closable' : '';
+        if(item.disabled){
+            cls += ' x-item-disabled';
+        }
+        if(item.iconCls){
+            cls += ' x-tab-with-icon';
+        }
+        if(item.tabCls){
+            cls += ' ' + item.tabCls;
+        }
+
+        return {
+            id: this.id + this.idDelimiter + item.getItemId(),
+            text: item.title,
+            cls: cls,
+            iconCls: item.iconCls || ''
+        };
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.TabPanel.superclass.onAdd.call(this, c);
+        if(this.rendered){
+            var items = this.items;
+            this.initTab(c, items.indexOf(c));
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        var existing = item.events ? (this.items.containsKey(item.getItemId()) ? item : null) : this.items.get(item);
+        if(existing){
+            this.setActiveTab(item);
+            return false;
+        }
+        Ext.TabPanel.superclass.onBeforeAdd.apply(this, arguments);
+        var es = item.elements;
+        item.elements = es ? es.replace(',header', '') : es;
+        item.border = (item.border === true);
+    },
+
+    // private
+    onRemove : function(c){
+        var te = Ext.get(c.tabEl);
+        // check if the tabEl exists, it won't if the tab isn't rendered
+        if(te){
+            te.select('a').removeAllListeners();
+            Ext.destroy(te);
+        }
+        Ext.TabPanel.superclass.onRemove.call(this, c);
+        this.stack.remove(c);
+        delete c.tabEl;
+        c.un('disable', this.onItemDisabled, this);
+        c.un('enable', this.onItemEnabled, this);
+        c.un('titlechange', this.onItemTitleChanged, this);
+        c.un('iconchange', this.onItemIconChanged, this);
+        c.un('beforeshow', this.onBeforeShowItem, this);
+        if(c == this.activeTab){
+            var next = this.stack.next();
+            if(next){
+                this.setActiveTab(next);
+            }else if(this.items.getCount() > 0){
+                this.setActiveTab(0);
+            }else{
+                this.setActiveTab(null);
+            }
+        }
+        if(!this.destroying){
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeShowItem : function(item){
+        if(item != this.activeTab){
+            this.setActiveTab(item);
+            return false;
+        }
+    },
+
+    // private
+    onItemDisabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).addClass('x-item-disabled');
+        }
+        this.stack.remove(item);
+    },
+
+    // private
+    onItemEnabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).removeClass('x-item-disabled');
+        }
+    },
+
+    // private
+    onItemTitleChanged : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).child('span.x-tab-strip-text', true).innerHTML = item.title;
+        }
+    },
+
+    //private
+    onItemIconChanged : function(item, iconCls, oldCls){
+        var el = this.getTabEl(item);
+        if(el){
+            el = Ext.get(el);
+            el.child('span.x-tab-strip-text').replaceClass(oldCls, iconCls);
+            el[Ext.isEmpty(iconCls) ? 'removeClass' : 'addClass']('x-tab-with-icon');
+        }
+    },
+
+    /**
+     * Gets the DOM element for the tab strip item which activates the child panel with the specified
+     * ID. Access this to change the visual treatment of the item, for example by changing the CSS class name.
+     * @param {Panel/Number/String} tab The tab component, or the tab's index, or the tabs id or itemId.
+     * @return {HTMLElement} The DOM node
+     */
+    getTabEl : function(item){
+        var c = this.getComponent(item);
+        return c ? c.tabEl : null;
+    },
+
+    // private
+    onResize : function(){
+        Ext.TabPanel.superclass.onResize.apply(this, arguments);
+        this.delegateUpdates();
+    },
+
+    /**
+     * Suspends any internal calculations or scrolling while doing a bulk operation. See {@link #endUpdate}
+     */
+    beginUpdate : function(){
+        this.suspendUpdates = true;
+    },
+
+    /**
+     * Resumes calculations and scrolling at the end of a bulk operation. See {@link #beginUpdate}
+     */
+    endUpdate : function(){
+        this.suspendUpdates = false;
+        this.delegateUpdates();
+    },
+
+    /**
+     * Hides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    hideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = 'none';
+            this.delegateUpdates();
+        }
+        this.stack.remove(item);
+    },
+
+    /**
+     * Unhides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    unhideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = '';
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    delegateUpdates : function(){
+        var rendered = this.rendered;
+        if(this.suspendUpdates){
+            return;
+        }
+        if(this.resizeTabs && rendered){
+            this.autoSizeTabs();
+        }
+        if(this.enableTabScroll && rendered){
+            this.autoScrollTabs();
+        }
+    },
+
+    // private
+    autoSizeTabs : function(){
+        var count = this.items.length,
+            ce = this.tabPosition != 'bottom' ? 'header' : 'footer',
+            ow = this[ce].dom.offsetWidth,
+            aw = this[ce].dom.clientWidth;
+
+        if(!this.resizeTabs || count < 1 || !aw){ // !aw for display:none
+            return;
+        }
+
+        var each = Math.max(Math.min(Math.floor((aw-4) / count) - this.tabMargin, this.tabWidth), this.minTabWidth); // -4 for float errors in IE
+        this.lastTabWidth = each;
+        var lis = this.strip.query('li:not(.x-tab-edge)');
+        for(var i = 0, len = lis.length; i < len; i++) {
+            var li = lis[i],
+                inner = Ext.fly(li).child('.x-tab-strip-inner', true),
+                tw = li.offsetWidth,
+                iw = inner.offsetWidth;
+            inner.style.width = (each - (tw-iw)) + 'px';
+        }
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        if(this.header){
+            this.header.setWidth(w);
+        }
+        if(this.footer){
+            this.footer.setWidth(w);
+        }
+        return w;
+    },
+
+    /**
+     * Sets the specified tab as the active tab. This method fires the {@link #beforetabchange} event which
+     * can <tt>return false</tt> to cancel the tab change.
+     * @param {String/Number} item
+     * The id or tab Panel to activate. This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><tt>String</tt></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><tt>Number</tt></b> : representing the position of the child component
+     * within the <code>{@link Ext.Container#items items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     */
+    setActiveTab : function(item){
+        item = this.getComponent(item);
+        if(this.fireEvent('beforetabchange', this, item, this.activeTab) === false){
+            return;
+        }
+        if(!this.rendered){
+            this.activeTab = item;
+            return;
+        }
+        if(this.activeTab != item){
+            if(this.activeTab){
+                var oldEl = this.getTabEl(this.activeTab);
+                if(oldEl){
+                    Ext.fly(oldEl).removeClass('x-tab-strip-active');
+                }
+            }
+            this.activeTab = item;
+            if(item){
+                var el = this.getTabEl(item);
+                Ext.fly(el).addClass('x-tab-strip-active');
+                this.stack.add(item);
+
+                this.layout.setActiveItem(item);
+                // Need to do this here, since setting the active tab slightly changes the size
+                this.delegateUpdates();
+                if(this.scrolling){
+                    this.scrollToTab(item, this.animScroll);
+                }
+            }
+            this.fireEvent('tabchange', this, item);
+        }
+    },
+
+    /**
+     * Returns the Component which is the currently active tab. <b>Note that before the TabPanel
+     * first activates a child Component, this method will return whatever was configured in the
+     * {@link #activeTab} config option.</b>
+     * @return {BoxComponent} The currently active child Component if one <i>is</i> active, or the {@link #activeTab} config value.
+     */
+    getActiveTab : function(){
+        return this.activeTab || null;
+    },
+
+    /**
+     * Gets the specified tab by id.
+     * @param {String} id The tab id
+     * @return {Panel} The tab
+     */
+    getItem : function(item){
+        return this.getComponent(item);
+    },
+
+    // private
+    autoScrollTabs : function(){
+        this.pos = this.tabPosition=='bottom' ? this.footer : this.header;
+        var count = this.items.length,
+            ow = this.pos.dom.offsetWidth,
+            tw = this.pos.dom.clientWidth,
+            wrap = this.stripWrap,
+            wd = wrap.dom,
+            cw = wd.offsetWidth,
+            pos = this.getScrollPos(),
+            l = this.edge.getOffsetsTo(this.stripWrap)[0] + pos;
+
+        if(!this.enableTabScroll || cw < 20){ // 20 to prevent display:none issues
+            return;
+        }
+        if(count == 0 || l <= tw){
+            // ensure the width is set if there's no tabs
+            wd.scrollLeft = 0;
+            wrap.setWidth(tw);
+            if(this.scrolling){
+                this.scrolling = false;
+                this.pos.removeClass('x-tab-scrolling');
+                this.scrollLeft.hide();
+                this.scrollRight.hide();
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '';
+                    wd.style.marginRight = '';
+                }
+            }
+        }else{
+            if(!this.scrolling){
+                this.pos.addClass('x-tab-scrolling');
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '18px';
+                    wd.style.marginRight = '18px';
+                }
+            }
+            tw -= wrap.getMargins('lr');
+            wrap.setWidth(tw > 20 ? tw : 20);
+            if(!this.scrolling){
+                if(!this.scrollLeft){
+                    this.createScrollers();
+                }else{
+                    this.scrollLeft.show();
+                    this.scrollRight.show();
+                }
+            }
+            this.scrolling = true;
+            if(pos > (l-tw)){ // ensure it stays within bounds
+                wd.scrollLeft = l-tw;
+            }else{ // otherwise, make sure the active tab is still visible
+                this.scrollToTab(this.activeTab, false);
+            }
+            this.updateScrollButtons();
+        }
+    },
+
+    // private
+    createScrollers : function(){
+        this.pos.addClass('x-tab-scrolling-' + this.tabPosition);
+        var h = this.stripWrap.dom.offsetHeight;
+
+        // left
+        var sl = this.pos.insertFirst({
+            cls:'x-tab-scroller-left'
+        });
+        sl.setHeight(h);
+        sl.addClassOnOver('x-tab-scroller-left-over');
+        this.leftRepeater = new Ext.util.ClickRepeater(sl, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollLeft,
+            scope: this
+        });
+        this.scrollLeft = sl;
+
+        // right
+        var sr = this.pos.insertFirst({
+            cls:'x-tab-scroller-right'
+        });
+        sr.setHeight(h);
+        sr.addClassOnOver('x-tab-scroller-right-over');
+        this.rightRepeater = new Ext.util.ClickRepeater(sr, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollRight,
+            scope: this
+        });
+        this.scrollRight = sr;
+    },
+
+    // private
+    getScrollWidth : function(){
+        return this.edge.getOffsetsTo(this.stripWrap)[0] + this.getScrollPos();
+    },
+
+    // private
+    getScrollPos : function(){
+        return parseInt(this.stripWrap.dom.scrollLeft, 10) || 0;
+    },
+
+    // private
+    getScrollArea : function(){
+        return parseInt(this.stripWrap.dom.clientWidth, 10) || 0;
+    },
+
+    // private
+    getScrollAnim : function(){
+        return {duration:this.scrollDuration, callback: this.updateScrollButtons, scope: this};
+    },
+
+    // private
+    getScrollIncrement : function(){
+        return this.scrollIncrement || (this.resizeTabs ? this.lastTabWidth+2 : 100);
+    },
+
+    /**
+     * Scrolls to a particular tab if tab scrolling is enabled
+     * @param {Panel} item The item to scroll to
+     * @param {Boolean} animate True to enable animations
+     */
+
+    scrollToTab : function(item, animate){
+        if(!item){
+            return;
+        }
+        var el = this.getTabEl(item),
+            pos = this.getScrollPos(),
+            area = this.getScrollArea(),
+            left = Ext.fly(el).getOffsetsTo(this.stripWrap)[0] + pos,
+            right = left + el.offsetWidth;
+        if(left < pos){
+            this.scrollTo(left, animate);
+        }else if(right > (pos + area)){
+            this.scrollTo(right - area, animate);
+        }
+    },
+
+    // private
+    scrollTo : function(pos, animate){
+        this.stripWrap.scrollTo('left', pos, animate ? this.getScrollAnim() : false);
+        if(!animate){
+            this.updateScrollButtons();
+        }
+    },
+
+    onWheel : function(e){
+        var d = e.getWheelDelta()*this.wheelIncrement*-1;
+        e.stopEvent();
+
+        var pos = this.getScrollPos(),
+            newpos = pos + d,
+            sw = this.getScrollWidth()-this.getScrollArea();
+
+        var s = Math.max(0, Math.min(sw, newpos));
+        if(s != pos){
+            this.scrollTo(s, false);
+        }
+    },
+
+    // private
+    onScrollRight : function(){
+        var sw = this.getScrollWidth()-this.getScrollArea(),
+            pos = this.getScrollPos(),
+            s = Math.min(sw, pos + this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    onScrollLeft : function(){
+        var pos = this.getScrollPos(),
+            s = Math.max(0, pos - this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    updateScrollButtons : function(){
+        var pos = this.getScrollPos();
+        this.scrollLeft[pos === 0 ? 'addClass' : 'removeClass']('x-tab-scroller-left-disabled');
+        this.scrollRight[pos >= (this.getScrollWidth()-this.getScrollArea()) ? 'addClass' : 'removeClass']('x-tab-scroller-right-disabled');
+    },
+
+    // private
+    beforeDestroy : function() {
+        Ext.destroy(this.leftRepeater, this.rightRepeater);
+        this.deleteMembers('strip', 'edge', 'scrollLeft', 'scrollRight', 'stripWrap');
+        this.activeTab = null;
+        Ext.TabPanel.superclass.beforeDestroy.apply(this);
+    }
+
+    /**
+     * @cfg {Boolean} collapsible
+     * @hide
+     */
+    /**
+     * @cfg {String} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @cfg title
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Array} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapsed
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+});
+Ext.reg('tabpanel', Ext.TabPanel);
+
+/**
+ * See {@link #setActiveTab}. Sets the specified tab as the active tab. This method fires
+ * the {@link #beforetabchange} event which can <tt>return false</tt> to cancel the tab change.
+ * @param {String/Panel} tab The id or tab Panel to activate
+ * @method activate
+ */
+Ext.TabPanel.prototype.activate = Ext.TabPanel.prototype.setActiveTab;
+
+// private utility class used by TabPanel
+Ext.TabPanel.AccessStack = function(){
+    var items = [];
+    return {
+        add : function(item){
+            items.push(item);
+            if(items.length > 10){
+                items.shift();
+            }
+        },
+
+        remove : function(item){
+            var s = [];
+            for(var i = 0, len = items.length; i < len; i++) {
+                if(items[i] != item){
+                    s.push(items[i]);
+                }
+            }
+            items = s;
+        },
+
+        next : function(){
+            return items.pop();
+        }
+    };
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/PagingToolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/PagingToolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/PagingToolbar.js	(revision 76)
@@ -0,0 +1,537 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.PagingToolbar
+ * @extends Ext.Toolbar
+ * <p>As the amount of records increases, the time required for the browser to render
+ * them increases. Paging is used to reduce the amount of data exchanged with the client.
+ * Note: if there are more records/rows than can be viewed in the available screen area, vertical
+ * scrollbars will be added.</p>
+ * <p>Paging is typically handled on the server side (see exception below). The client sends
+ * parameters to the server side, which the server needs to interpret and then respond with the
+ * approprate data.</p>
+ * <p><b>Ext.PagingToolbar</b> is a specialized toolbar that is bound to a {@link Ext.data.Store}
+ * and provides automatic paging control. This Component {@link Ext.data.Store#load load}s blocks
+ * of data into the <tt>{@link #store}</tt> by passing {@link Ext.data.Store#paramNames paramNames} used for
+ * paging criteria.</p>
+ * <p>PagingToolbar is typically used as one of the Grid's toolbars:</p>
+ * <pre><code>
+Ext.QuickTips.init(); // to display button quicktips
+
+var myStore = new Ext.data.Store({
+    reader: new Ext.data.JsonReader({
+        {@link Ext.data.JsonReader#totalProperty totalProperty}: 'results', 
+        ...
+    }),
+    ...
+});
+
+var myPageSize = 25;  // server script should only send back 25 items at a time
+
+var grid = new Ext.grid.GridPanel({
+    ...
+    store: myStore,
+    bbar: new Ext.PagingToolbar({
+        {@link #store}: myStore,       // grid and PagingToolbar using same store
+        {@link #displayInfo}: true,
+        {@link #pageSize}: myPageSize,
+        {@link #prependButtons}: true,
+        items: [
+            'text 1'
+        ]
+    })
+});
+ * </code></pre>
+ *
+ * <p>To use paging, pass the paging requirements to the server when the store is first loaded.</p>
+ * <pre><code>
+store.load({
+    params: {
+        // specify params for the first page load if using paging
+        start: 0,          
+        limit: myPageSize,
+        // other params
+        foo:   'bar'
+    }
+});
+ * </code></pre>
+ * 
+ * <p>If using {@link Ext.data.Store#autoLoad store's autoLoad} configuration:</p>
+ * <pre><code>
+var myStore = new Ext.data.Store({
+    {@link Ext.data.Store#autoLoad autoLoad}: {params:{start: 0, limit: 25}},
+    ...
+});
+ * </code></pre>
+ * 
+ * <p>The packet sent back from the server would have this form:</p>
+ * <pre><code>
+{
+    "success": true,
+    "results": 2000, 
+    "rows": [ // <b>*Note:</b> this must be an Array 
+        { "id":  1, "name": "Bill", "occupation": "Gardener" },
+        { "id":  2, "name":  "Ben", "occupation": "Horticulturalist" },
+        ...
+        { "id": 25, "name":  "Sue", "occupation": "Botanist" }
+    ]
+}
+ * </code></pre>
+ * <p><u>Paging with Local Data</u></p>
+ * <p>Paging can also be accomplished with local data using extensions:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><a href="http://extjs.com/forum/showthread.php?t=71532">Ext.ux.data.PagingStore</a></li>
+ * <li>Paging Memory Proxy (examples/ux/PagingMemoryProxy.js)</li>
+ * </ul></div>
+ * @constructor Create a new PagingToolbar
+ * @param {Object} config The config object
+ * @xtype paging
+ */
+(function() {
+
+var T = Ext.Toolbar;
+
+Ext.PagingToolbar = Ext.extend(Ext.Toolbar, {
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} the paging toolbar should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} displayInfo
+     * <tt>true</tt> to display the displayMsg (defaults to <tt>false</tt>)
+     */
+    /**
+     * @cfg {Number} pageSize
+     * The number of records to display per page (defaults to <tt>20</tt>)
+     */
+    pageSize : 20,
+    /**
+     * @cfg {Boolean} prependButtons
+     * <tt>true</tt> to insert any configured <tt>items</tt> <i>before</i> the paging buttons.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String} displayMsg
+     * The paging status message to display (defaults to <tt>'Displaying {0} - {1} of {2}'</tt>).
+     * Note that this string is formatted using the braced numbers <tt>{0}-{2}</tt> as tokens
+     * that are replaced by the values for start, end and total respectively. These tokens should
+     * be preserved when overriding this string if showing those values is desired.
+     */
+    displayMsg : 'Displaying {0} - {1} of {2}',
+    /**
+     * @cfg {String} emptyMsg
+     * The message to display when no records are found (defaults to 'No data to display')
+     */
+    emptyMsg : 'No data to display',
+    /**
+     * @cfg {String} beforePageText
+     * The text displayed before the input item (defaults to <tt>'Page'</tt>).
+     */
+    beforePageText : 'Page',
+    /**
+     * @cfg {String} afterPageText
+     * Customizable piece of the default paging text (defaults to <tt>'of {0}'</tt>). Note that
+     * this string is formatted using <tt>{0}</tt> as a token that is replaced by the number of
+     * total pages. This token should be preserved when overriding this string if showing the
+     * total page count is desired.
+     */
+    afterPageText : 'of {0}',
+    /**
+     * @cfg {String} firstText
+     * The quicktip text displayed for the first page button (defaults to <tt>'First Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    firstText : 'First Page',
+    /**
+     * @cfg {String} prevText
+     * The quicktip text displayed for the previous page button (defaults to <tt>'Previous Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    prevText : 'Previous Page',
+    /**
+     * @cfg {String} nextText
+     * The quicktip text displayed for the next page button (defaults to <tt>'Next Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    nextText : 'Next Page',
+    /**
+     * @cfg {String} lastText
+     * The quicktip text displayed for the last page button (defaults to <tt>'Last Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    lastText : 'Last Page',
+    /**
+     * @cfg {String} refreshText
+     * The quicktip text displayed for the Refresh button (defaults to <tt>'Refresh'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    refreshText : 'Refresh',
+
+    /**
+     * <p><b>Deprecated</b>. <code>paramNames</code> should be set in the <b>data store</b>
+     * (see {@link Ext.data.Store#paramNames}).</p>
+     * <br><p>Object mapping of parameter names used for load calls, initially set to:</p>
+     * <pre>{start: 'start', limit: 'limit'}</pre>
+     * @type Object
+     * @property paramNames
+     * @deprecated
+     */
+
+    /**
+     * The number of records to display per page.  See also <tt>{@link #cursor}</tt>.
+     * @type Number
+     * @property pageSize
+     */
+
+    /**
+     * Indicator for the record position.  This property might be used to get the active page
+     * number for example:<pre><code>
+     * // t is reference to the paging toolbar instance
+     * var activePage = Math.ceil((t.cursor + t.pageSize) / t.pageSize);
+     * </code></pre>
+     * @type Number
+     * @property cursor
+     */
+
+    initComponent : function(){
+        var pagingItems = [this.first = new T.Button({
+            tooltip: this.firstText,
+            overflowText: this.firstText,
+            iconCls: 'x-tbar-page-first',
+            disabled: true,
+            handler: this.moveFirst,
+            scope: this
+        }), this.prev = new T.Button({
+            tooltip: this.prevText,
+            overflowText: this.prevText,
+            iconCls: 'x-tbar-page-prev',
+            disabled: true,
+            handler: this.movePrevious,
+            scope: this
+        }), '-', this.beforePageText,
+        this.inputItem = new Ext.form.NumberField({
+            cls: 'x-tbar-page-number',
+            allowDecimals: false,
+            allowNegative: false,
+            enableKeyEvents: true,
+            selectOnFocus: true,
+            submitValue: false,
+            listeners: {
+                scope: this,
+                keydown: this.onPagingKeyDown,
+                blur: this.onPagingBlur
+            }
+        }), this.afterTextItem = new T.TextItem({
+            text: String.format(this.afterPageText, 1)
+        }), '-', this.next = new T.Button({
+            tooltip: this.nextText,
+            overflowText: this.nextText,
+            iconCls: 'x-tbar-page-next',
+            disabled: true,
+            handler: this.moveNext,
+            scope: this
+        }), this.last = new T.Button({
+            tooltip: this.lastText,
+            overflowText: this.lastText,
+            iconCls: 'x-tbar-page-last',
+            disabled: true,
+            handler: this.moveLast,
+            scope: this
+        }), '-', this.refresh = new T.Button({
+            tooltip: this.refreshText,
+            overflowText: this.refreshText,
+            iconCls: 'x-tbar-loading',
+            handler: this.doRefresh,
+            scope: this
+        })];
+
+
+        var userItems = this.items || this.buttons || [];
+        if (this.prependButtons) {
+            this.items = userItems.concat(pagingItems);
+        }else{
+            this.items = pagingItems.concat(userItems);
+        }
+        delete this.buttons;
+        if(this.displayInfo){
+            this.items.push('->');
+            this.items.push(this.displayItem = new T.TextItem({}));
+        }
+        Ext.PagingToolbar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the active page has been changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} pageData An object that has these properties:<ul>
+             * <li><code>total</code> : Number <div class="sub-desc">The total number of records in the dataset as
+             * returned by the server</div></li>
+             * <li><code>activePage</code> : Number <div class="sub-desc">The current page number</div></li>
+             * <li><code>pages</code> : Number <div class="sub-desc">The total number of pages (calculated from
+             * the total number of records in the dataset as returned by the server and the current {@link #pageSize})</div></li>
+             * </ul>
+             */
+            'change',
+            /**
+             * @event beforechange
+             * Fires just before the active page is changed.
+             * Return false to prevent the active page from being changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} params An object hash of the parameters which the PagingToolbar will send when
+             * loading the required page. This will contain:<ul>
+             * <li><code>start</code> : Number <div class="sub-desc">The starting row number for the next page of records to
+             * be retrieved from the server</div></li>
+             * <li><code>limit</code> : Number <div class="sub-desc">The number of records to be retrieved from the server</div></li>
+             * </ul>
+             * <p>(note: the names of the <b>start</b> and <b>limit</b> properties are determined
+             * by the store's {@link Ext.data.Store#paramNames paramNames} property.)</p>
+             * <p>Parameters may be added as required in the event handler.</p>
+             */
+            'beforechange'
+        );
+        this.on('afterlayout', this.onFirstLayout, this, {single: true});
+        this.cursor = 0;
+        this.bindStore(this.store, true);
+    },
+
+    // private
+    onFirstLayout : function(){
+        if(this.dsLoaded){
+            this.onLoad.apply(this, this.dsLoaded);
+        }
+    },
+
+    // private
+    updateInfo : function(){
+        if(this.displayItem){
+            var count = this.store.getCount();
+            var msg = count == 0 ?
+                this.emptyMsg :
+                String.format(
+                    this.displayMsg,
+                    this.cursor+1, this.cursor+count, this.store.getTotalCount()
+                );
+            this.displayItem.setText(msg);
+        }
+    },
+
+    // private
+    onLoad : function(store, r, o){
+        if(!this.rendered){
+            this.dsLoaded = [store, r, o];
+            return;
+        }
+        var p = this.getParams();
+        this.cursor = (o.params && o.params[p.start]) ? o.params[p.start] : 0;
+        var d = this.getPageData(), ap = d.activePage, ps = d.pages;
+
+        this.afterTextItem.setText(String.format(this.afterPageText, d.pages));
+        this.inputItem.setValue(ap);
+        this.first.setDisabled(ap == 1);
+        this.prev.setDisabled(ap == 1);
+        this.next.setDisabled(ap == ps);
+        this.last.setDisabled(ap == ps);
+        this.refresh.enable();
+        this.updateInfo();
+        this.fireEvent('change', this, d);
+    },
+
+    // private
+    getPageData : function(){
+        var total = this.store.getTotalCount();
+        return {
+            total : total,
+            activePage : Math.ceil((this.cursor+this.pageSize)/this.pageSize),
+            pages :  total < this.pageSize ? 1 : Math.ceil(total/this.pageSize)
+        };
+    },
+
+    /**
+     * Change the active page
+     * @param {Integer} page The page to display
+     */
+    changePage : function(page){
+        this.doLoad(((page-1) * this.pageSize).constrain(0, this.store.getTotalCount()));
+    },
+
+    // private
+    onLoadError : function(){
+        if(!this.rendered){
+            return;
+        }
+        this.refresh.enable();
+    },
+
+    // private
+    readPage : function(d){
+        var v = this.inputItem.getValue(), pageNum;
+        if (!v || isNaN(pageNum = parseInt(v, 10))) {
+            this.inputItem.setValue(d.activePage);
+            return false;
+        }
+        return pageNum;
+    },
+
+    onPagingFocus : function(){
+        this.inputItem.select();
+    },
+
+    //private
+    onPagingBlur : function(e){
+        this.inputItem.setValue(this.getPageData().activePage);
+    },
+
+    // private
+    onPagingKeyDown : function(field, e){
+        var k = e.getKey(), d = this.getPageData(), pageNum;
+        if (k == e.RETURN) {
+            e.stopEvent();
+            pageNum = this.readPage(d);
+            if(pageNum !== false){
+                pageNum = Math.min(Math.max(1, pageNum), d.pages) - 1;
+                this.doLoad(pageNum * this.pageSize);
+            }
+        }else if (k == e.HOME || k == e.END){
+            e.stopEvent();
+            pageNum = k == e.HOME ? 1 : d.pages;
+            field.setValue(pageNum);
+        }else if (k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){
+            e.stopEvent();
+            if((pageNum = this.readPage(d))){
+                var increment = e.shiftKey ? 10 : 1;
+                if(k == e.DOWN || k == e.PAGEDOWN){
+                    increment *= -1;
+                }
+                pageNum += increment;
+                if(pageNum >= 1 & pageNum <= d.pages){
+                    field.setValue(pageNum);
+                }
+            }
+        }
+    },
+
+    // private
+    getParams : function(){
+        //retain backwards compat, allow params on the toolbar itself, if they exist.
+        return this.paramNames || this.store.paramNames;
+    },
+
+    // private
+    beforeLoad : function(){
+        if(this.rendered && this.refresh){
+            this.refresh.disable();
+        }
+    },
+
+    // private
+    doLoad : function(start){
+        var o = {}, pn = this.getParams();
+        o[pn.start] = start;
+        o[pn.limit] = this.pageSize;
+        if(this.fireEvent('beforechange', this, o) !== false){
+            this.store.load({params:o});
+        }
+    },
+
+    /**
+     * Move to the first page, has the same effect as clicking the 'first' button.
+     */
+    moveFirst : function(){
+        this.doLoad(0);
+    },
+
+    /**
+     * Move to the previous page, has the same effect as clicking the 'previous' button.
+     */
+    movePrevious : function(){
+        this.doLoad(Math.max(0, this.cursor-this.pageSize));
+    },
+
+    /**
+     * Move to the next page, has the same effect as clicking the 'next' button.
+     */
+    moveNext : function(){
+        this.doLoad(this.cursor+this.pageSize);
+    },
+
+    /**
+     * Move to the last page, has the same effect as clicking the 'last' button.
+     */
+    moveLast : function(){
+        var total = this.store.getTotalCount(),
+            extra = total % this.pageSize;
+
+        this.doLoad(extra ? (total - extra) : total - this.pageSize);
+    },
+
+    /**
+     * Refresh the current page, has the same effect as clicking the 'refresh' button.
+     */
+    doRefresh : function(){
+        this.doLoad(this.cursor);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store}
+     * @param {Store} store The store to bind to this toolbar
+     * @param {Boolean} initial (Optional) true to not remove listeners
+     */
+    bindStore : function(store, initial){
+        var doLoad;
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.beforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.onLoadError, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.beforeLoad,
+                load: this.onLoad,
+                exception: this.onLoadError
+            });
+            doLoad = true;
+        }
+        this.store = store;
+        if(doLoad){
+            this.onLoad(store, null, {});
+        }
+    },
+
+    /**
+     * Unbinds the paging toolbar from the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to unbind
+     */
+    unbind : function(store){
+        this.bindStore(null);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to bind
+     */
+    bind : function(store){
+        this.bindStore(store);
+    },
+
+    // private
+    onDestroy : function(){
+        this.bindStore(null);
+        Ext.PagingToolbar.superclass.onDestroy.call(this);
+    }
+});
+
+})();
+Ext.reg('paging', Ext.PagingToolbar);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/ButtonGroup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/ButtonGroup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/ButtonGroup.js	(revision 76)
@@ -0,0 +1,106 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ButtonGroup
+ * @extends Ext.Panel
+ * Container for a group of buttons. Example usage:
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Panel with Button Group',
+    width: 300,
+    height:200,
+    renderTo: document.body,
+    html: 'whatever',
+    tbar: [{
+        xtype: 'buttongroup',
+        {@link #columns}: 3,
+        title: 'Clipboard',
+        items: [{
+            text: 'Paste',
+            scale: 'large',
+            rowspan: 3, iconCls: 'add',
+            iconAlign: 'top',
+            cls: 'x-btn-as-arrow'
+        },{
+            xtype:'splitbutton',
+            text: 'Menu Button',
+            scale: 'large',
+            rowspan: 3,
+            iconCls: 'add',
+            iconAlign: 'top',
+            arrowAlign:'bottom',
+            menu: [{text: 'Menu Item 1'}]
+        },{
+            xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
+        },{
+            text: 'Copy', iconCls: 'add16'
+        },{
+            text: 'Format', iconCls: 'add16'
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * Create a new ButtonGroup.
+ * @param {Object} config The config object
+ * @xtype buttongroup
+ */
+Ext.ButtonGroup = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} columns The <tt>columns</tt> configuration property passed to the
+     * {@link #layout configured layout manager}. See {@link Ext.layout.TableLayout#columns}.
+     */
+    /**
+     * @cfg {String} baseCls  Defaults to <tt>'x-btn-group'</tt>.  See {@link Ext.Panel#baseCls}.
+     */
+    baseCls: 'x-btn-group',
+    /**
+     * @cfg {String} layout  Defaults to <tt>'table'</tt>.  See {@link Ext.Container#layout}.
+     */
+    layout:'table',
+    defaultType: 'button',
+    /**
+     * @cfg {Boolean} frame  Defaults to <tt>true</tt>.  See {@link Ext.Panel#frame}.
+     */
+    frame: true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+
+    initComponent : function(){
+        this.layoutConfig = this.layoutConfig || {};
+        Ext.applyIf(this.layoutConfig, {
+            columns : this.columns
+        });
+        if(!this.title){
+            this.addClass('x-btn-group-notitle');
+        }
+        this.on('afterlayout', this.onAfterLayout, this);
+        Ext.ButtonGroup.superclass.initComponent.call(this);
+    },
+
+    applyDefaults : function(c){
+        c = Ext.ButtonGroup.superclass.applyDefaults.call(this, c);
+        var d = this.internalDefaults;
+        if(c.events){
+            Ext.applyIf(c.initialConfig, d);
+            Ext.apply(c, d);
+        }else{
+            Ext.applyIf(c, d);
+        }
+        return c;
+    },
+
+    onAfterLayout : function(){
+        var bodyWidth = this.body.getFrameWidth('lr') + this.body.dom.firstChild.offsetWidth;
+        this.body.setWidth(bodyWidth);
+        this.el.setWidth(bodyWidth + this.getFrameWidth());
+    }
+    /**
+     * @cfg {Array} tools  @hide
+     */
+});
+
+Ext.reg('buttongroup', Ext.ButtonGroup);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/BasicForm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/BasicForm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/BasicForm.js	(revision 76)
@@ -0,0 +1,810 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.BasicForm
+ * @extends Ext.util.Observable
+ * <p>Encapsulates the DOM &lt;form> element at the heart of the {@link Ext.form.FormPanel FormPanel} class, and provides
+ * input field management, validation, submission, and form loading services.</p>
+ * <p>By default, Ext Forms are submitted through Ajax, using an instance of {@link Ext.form.Action.Submit}.
+ * To enable normal browser submission of an Ext Form, use the {@link #standardSubmit} config option.</p>
+ * <p><b><u>File Uploads</u></b></p>
+ * <p>{@link #fileUpload File uploads} are not performed using Ajax submission, that
+ * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+ * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+ * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+ * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+ * but removed after the return data has been gathered.</p>
+ * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+ * server is using JSON to send the return object, then the
+ * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+ * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+ * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+ * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+ * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+ * is created containing a <tt>responseText</tt> property in order to conform to the
+ * requirements of event handlers and callbacks.</p>
+ * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+ * and some server technologies (notably JEE) may require some custom processing in order to
+ * retrieve parameter names and parameter values from the packet content.</p>
+ * @constructor
+ * @param {Mixed} el The form element or its id
+ * @param {Object} config Configuration options
+ */
+Ext.form.BasicForm = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        Ext.apply(this, config);
+        if(Ext.isString(this.paramOrder)){
+            this.paramOrder = this.paramOrder.split(/[\s,|]/);
+        }
+        /**
+         * A {@link Ext.util.MixedCollection MixedCollection} containing all the Ext.form.Fields in this form.
+         * @type MixedCollection
+         * @property items
+         */
+        this.items = new Ext.util.MixedCollection(false, function(o){
+            return o.getItemId();
+        });
+        this.addEvents(
+            /**
+             * @event beforeaction
+             * Fires before any action is performed. Return false to cancel the action.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} to be performed
+             */
+            'beforeaction',
+            /**
+             * @event actionfailed
+             * Fires when an action fails.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that failed
+             */
+            'actionfailed',
+            /**
+             * @event actioncomplete
+             * Fires when an action is completed.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that completed
+             */
+            'actioncomplete'
+        );
+
+        if(el){
+            this.initEl(el);
+        }
+        Ext.form.BasicForm.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {String} method
+     * The request method to use (GET or POST) for form actions if one isn't supplied in the action options.
+     */
+    /**
+     * @cfg {DataReader} reader
+     * An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to read
+     * data when executing 'load' actions. This is optional as there is built-in
+     * support for processing JSON.  For additional information on using an XMLReader
+     * see the example provided in examples/form/xml-form.html.
+     */
+    /**
+     * @cfg {DataReader} errorReader
+     * <p>An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to
+     * read field error messages returned from 'submit' actions. This is optional
+     * as there is built-in support for processing JSON.</p>
+     * <p>The Records which provide messages for the invalid Fields must use the
+     * Field name (or id) as the Record ID, and must contain a field called 'msg'
+     * which contains the error message.</p>
+     * <p>The errorReader does not have to be a full-blown implementation of a
+     * DataReader. It simply needs to implement a <tt>read(xhr)</tt> function
+     * which returns an Array of Records in an object with the following
+     * structure:</p><pre><code>
+{
+    records: recordArray
+}
+</code></pre>
+     */
+    /**
+     * @cfg {String} url
+     * The URL to use for form actions if one isn't supplied in the
+     * <code>{@link #doAction doAction} options</code>.
+     */
+    /**
+     * @cfg {Boolean} fileUpload
+     * Set to true if this form is a file upload.
+     * <p>File uploads are not performed using normal 'Ajax' techniques, that is they are <b>not</b>
+     * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+     * DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     */
+    /**
+     * @cfg {Object} baseParams
+     * <p>Parameters to pass with all requests. e.g. baseParams: {id: '123', foo: 'bar'}.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     */
+    /**
+     * @cfg {Number} timeout Timeout for form actions in seconds (default is 30 seconds).
+     */
+    timeout: 30,
+
+    /**
+     * @cfg {Object} api (Optional) If specified load and submit actions will be handled
+     * with {@link Ext.form.Action.DirectLoad} and {@link Ext.form.Action.DirectSubmit}.
+     * Methods which have been imported by Ext.Direct can be specified here to load and submit
+     * forms.
+     * Such as the following:<pre><code>
+api: {
+    load: App.ss.MyProfile.load,
+    submit: App.ss.MyProfile.submit
+}
+</code></pre>
+     * <p>Load actions can use <code>{@link #paramOrder}</code> or <code>{@link #paramsAsHash}</code>
+     * to customize how the load method is invoked.
+     * Submit actions will always use a standard form submit. The formHandler configuration must
+     * be set on the associated server-side method which has been imported by Ext.Direct</p>
+     */
+
+    /**
+     * @cfg {Array/String} paramOrder <p>A list of params to be executed server side.
+     * Defaults to <tt>undefined</tt>. Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration.</p>
+     * <br><p>Specify the params in the order in which they must be executed on the
+     * server-side as either (1) an Array of String values, or (2) a String of params
+     * delimited by either whitespace, comma, or pipe. For example,
+     * any of the following would be acceptable:</p><pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration. Send parameters as a collection of named
+     * arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} waitTitle
+     * The default title to show for the waiting message box (defaults to <tt>'Please Wait...'</tt>)
+     */
+    waitTitle: 'Please Wait...',
+
+    // private
+    activeAction : null,
+
+    /**
+     * @cfg {Boolean} trackResetOnLoad If set to <tt>true</tt>, {@link #reset}() resets to the last loaded
+     * or {@link #setValues}() data instead of when the form was first created.  Defaults to <tt>false</tt>.
+     */
+    trackResetOnLoad : false,
+
+    /**
+     * @cfg {Boolean} standardSubmit
+     * <p>If set to <tt>true</tt>, standard HTML form submits are used instead
+     * of XHR (Ajax) style form submissions. Defaults to <tt>false</tt>.</p>
+     * <br><p><b>Note:</b> When using <code>standardSubmit</code>, the
+     * <code>options</code> to <code>{@link #submit}</code> are ignored because
+     * Ext's Ajax infrastracture is bypassed. To pass extra parameters (e.g.
+     * <code>baseParams</code> and <code>params</code>), utilize hidden fields
+     * to submit extra data, for example:</p>
+     * <pre><code>
+new Ext.FormPanel({
+    standardSubmit: true,
+    baseParams: {
+        foo: 'bar'
+    },
+    {@link url}: 'myProcess.php',
+    items: [{
+        xtype: 'textfield',
+        name: 'userName'
+    }],
+    buttons: [{
+        text: 'Save',
+        handler: function(){
+            var fp = this.ownerCt.ownerCt,
+                form = fp.getForm();
+            if (form.isValid()) {
+                // check if there are baseParams and if
+                // hiddent items have been added already
+                if (fp.baseParams && !fp.paramsAdded) {
+                    // add hidden items for all baseParams
+                    for (i in fp.baseParams) {
+                        fp.add({
+                            xtype: 'hidden',
+                            name: i,
+                            value: fp.baseParams[i]
+                        });
+                    }
+                    fp.doLayout();
+                    // set a custom flag to prevent re-adding
+                    fp.paramsAdded = true;
+                }
+                form.{@link #submit}();
+            }
+        }
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * By default wait messages are displayed with Ext.MessageBox.wait. You can target a specific
+     * element by passing it or its id or mask the form itself by passing in true.
+     * @type Mixed
+     * @property waitMsgTarget
+     */
+
+    // private
+    initEl : function(el){
+        this.el = Ext.get(el);
+        this.id = this.el.id || Ext.id();
+        if(!this.standardSubmit){
+            this.el.on('submit', this.onSubmit, this);
+        }
+        this.el.addClass('x-form');
+    },
+
+    /**
+     * Get the HTML form Element
+     * @return Ext.Element
+     */
+    getEl: function(){
+        return this.el;
+    },
+
+    // private
+    onSubmit : function(e){
+        e.stopEvent();
+    },
+
+    /**
+     * Destroys this object.
+     * @private
+     * @param {Boolean} bound true if the object is bound to a form panel. If this is the case
+     * the FormPanel will take care of destroying certain things, so we're just doubling up.
+     */
+    destroy: function(bound){
+        if(bound !== true){
+            this.items.each(function(f){
+                Ext.destroy(f);
+            });
+            Ext.destroy(this.el);
+        }
+        this.items.clear();
+        this.purgeListeners();
+    },
+
+    /**
+     * Returns true if client-side validation on the form is successful.
+     * @return Boolean
+     */
+    isValid : function(){
+        var valid = true;
+        this.items.each(function(f){
+           if(!f.validate()){
+               valid = false;
+           }
+        });
+        return valid;
+    },
+
+    /**
+     * <p>Returns true if any fields in this form have changed from their original values.</p>
+     * <p>Note that if this BasicForm was configured with {@link #trackResetOnLoad} then the
+     * Fields' <i>original values</i> are updated when the values are loaded by {@link #setValues}
+     * or {@link #loadRecord}.</p>
+     * @return Boolean
+     */
+    isDirty : function(){
+        var dirty = false;
+        this.items.each(function(f){
+           if(f.isDirty()){
+               dirty = true;
+               return false;
+           }
+        });
+        return dirty;
+    },
+
+    /**
+     * Performs a predefined action ({@link Ext.form.Action.Submit} or
+     * {@link Ext.form.Action.Load}) or a custom extension of {@link Ext.form.Action}
+     * to perform application-specific processing.
+     * @param {String/Object} actionName The name of the predefined action type,
+     * or instance of {@link Ext.form.Action} to perform.
+     * @param {Object} options (optional) The options to pass to the {@link Ext.form.Action}.
+     * All of the config options listed below are supported by both the
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * actions unless otherwise noted (custom actions could also accept
+     * other config options):<ul>
+     *
+     * <li><b>url</b> : String<div class="sub-desc">The url for the action (defaults
+     * to the form's {@link #url}.)</div></li>
+     *
+     * <li><b>method</b> : String<div class="sub-desc">The form method to use (defaults
+     * to the form's method, or POST if not defined)</div></li>
+     *
+     * <li><b>params</b> : String/Object<div class="sub-desc"><p>The params to pass
+     * (defaults to the form's baseParams, or none if not defined)</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     *
+     * <li><b>headers</b> : Object<div class="sub-desc">Request headers to set for the action
+     * (defaults to the form's default headers)</div></li>
+     *
+     * <li><b>success</b> : Function<div class="sub-desc">The callback that will
+     * be invoked after a successful response (see top of
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * for a description of what constitutes a successful response).
+     * The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>failure</b> : Function<div class="sub-desc">The callback that will be invoked after a
+     * failed transaction attempt. The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : The {@link Ext.form.BasicForm} that requested the action.</li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#failureType failureType}</tt></li>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the
+     * callback functions (The <tt>this</tt> reference for the callback functions).</div></li>
+     *
+     * <li><b>clientValidation</b> : Boolean<div class="sub-desc">Submit Action only.
+     * Determines whether a Form's fields are validated in a final call to
+     * {@link Ext.form.BasicForm#isValid isValid} prior to submission. Set to <tt>false</tt>
+     * to prevent this. If undefined, pre-submission field validation is performed.</div></li></ul>
+     *
+     * @return {BasicForm} this
+     */
+    doAction : function(action, options){
+        if(Ext.isString(action)){
+            action = new Ext.form.Action.ACTION_TYPES[action](this, options);
+        }
+        if(this.fireEvent('beforeaction', this, action) !== false){
+            this.beforeAction(action);
+            action.run.defer(100, action);
+        }
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Submit submit action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details).<br>
+     * <p><b>Note:</b> this is ignored when using the {@link #standardSubmit} option.</p>
+     * <p>The following code:</p><pre><code>
+myFormPanel.getForm().submit({
+    clientValidation: true,
+    url: 'updateConsignment.php',
+    params: {
+        newStatus: 'delivered'
+    },
+    success: function(form, action) {
+       Ext.Msg.alert('Success', action.result.msg);
+    },
+    failure: function(form, action) {
+        switch (action.failureType) {
+            case Ext.form.Action.CLIENT_INVALID:
+                Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
+                break;
+            case Ext.form.Action.CONNECT_FAILURE:
+                Ext.Msg.alert('Failure', 'Ajax communication failed');
+                break;
+            case Ext.form.Action.SERVER_INVALID:
+               Ext.Msg.alert('Failure', action.result.msg);
+       }
+    }
+});
+</code></pre>
+     * would process the following server response for a successful submission:<pre><code>
+{
+    "success":true, // note this is Boolean, not string
+    "msg":"Consignment updated"
+}
+</code></pre>
+     * and the following server response for a failed submission:<pre><code>
+{
+    "success":false, // note this is Boolean, not string
+    "msg":"You do not have permission to perform this operation"
+}
+</code></pre>
+     * @return {BasicForm} this
+     */
+    submit : function(options){
+        options = options || {};
+        if(this.standardSubmit){
+            var v = options.clientValidation === false || this.isValid();
+            if(v){
+                var el = this.el.dom;
+                if(this.url && Ext.isEmpty(el.action)){
+                    el.action = this.url;
+                }
+                el.submit();
+            }
+            return v;
+        }
+        var submitAction = String.format('{0}submit', this.api ? 'direct' : '');
+        this.doAction(submitAction, options);
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Load load action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details)
+     * @return {BasicForm} this
+     */
+    load : function(options){
+        var loadAction = String.format('{0}load', this.api ? 'direct' : '');
+        this.doAction(loadAction, options);
+        return this;
+    },
+
+    /**
+     * Persists the values in this form into the passed {@link Ext.data.Record} object in a beginEdit/endEdit block.
+     * @param {Record} record The record to edit
+     * @return {BasicForm} this
+     */
+    updateRecord : function(record){
+        record.beginEdit();
+        var fs = record.fields,
+            field,
+            value;
+        fs.each(function(f){
+            field = this.findField(f.name);
+            if(field){
+                value = field.getValue();
+                if (Ext.type(value) !== false && value.getGroupValue) {
+                    value = value.getGroupValue();
+                } else if ( field.eachItem ) {
+                    value = [];
+                    field.eachItem(function(item){
+                        value.push(item.getValue());
+                    });
+                }
+                record.set(f.name, value);
+            }
+        }, this);
+        record.endEdit();
+        return this;
+    },
+
+    /**
+     * Loads an {@link Ext.data.Record} into this form by calling {@link #setValues} with the
+     * {@link Ext.data.Record#data record data}.
+     * See also {@link #trackResetOnLoad}.
+     * @param {Record} record The record to load
+     * @return {BasicForm} this
+     */
+    loadRecord : function(record){
+        this.setValues(record.data);
+        return this;
+    },
+
+    // private
+    beforeAction : function(action){
+        // Call HtmlEditor's syncValue before actions
+        this.items.each(function(f){
+            if(f.isFormField && f.syncValue){
+                f.syncValue();
+            }
+        });
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.mask(o.waitMsg, 'x-mask-loading');
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget = Ext.get(this.waitMsgTarget);
+                this.waitMsgTarget.mask(o.waitMsg, 'x-mask-loading');
+            }else{
+                Ext.MessageBox.wait(o.waitMsg, o.waitTitle || this.waitTitle);
+            }
+        }
+    },
+
+    // private
+    afterAction : function(action, success){
+        this.activeAction = null;
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.unmask();
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget.unmask();
+            }else{
+                Ext.MessageBox.updateProgress(1);
+                Ext.MessageBox.hide();
+            }
+        }
+        if(success){
+            if(o.reset){
+                this.reset();
+            }
+            Ext.callback(o.success, o.scope, [this, action]);
+            this.fireEvent('actioncomplete', this, action);
+        }else{
+            Ext.callback(o.failure, o.scope, [this, action]);
+            this.fireEvent('actionfailed', this, action);
+        }
+    },
+
+    /**
+     * Find a {@link Ext.form.Field} in this form.
+     * @param {String} id The value to search for (specify either a {@link Ext.Component#id id},
+     * {@link Ext.grid.Column#dataIndex dataIndex}, {@link Ext.form.Field#getName name or hiddenName}).
+     * @return Field
+     */
+    findField : function(id) {
+        var field = this.items.get(id);
+
+        if (!Ext.isObject(field)) {
+            //searches for the field corresponding to the given id. Used recursively for composite fields
+            var findMatchingField = function(f) {
+                if (f.isFormField) {
+                    if (f.dataIndex == id || f.id == id || f.getName() == id) {
+                        field = f;
+                        return false;
+                    } else if (f.isComposite) {
+                        return f.items.each(findMatchingField);
+                    } else if (f instanceof Ext.form.CheckboxGroup && f.rendered) {
+                        return f.eachItem(findMatchingField);
+                    }
+                }
+            };
+
+            this.items.each(findMatchingField);
+        }
+        return field || null;
+    },
+
+
+    /**
+     * Mark fields in this form invalid in bulk.
+     * @param {Array/Object} errors Either an array in the form [{id:'fieldId', msg:'The message'},...] or an object hash of {id: msg, id2: msg2}
+     * @return {BasicForm} this
+     */
+    markInvalid : function(errors){
+        if (Ext.isArray(errors)) {
+            for(var i = 0, len = errors.length; i < len; i++){
+                var fieldError = errors[i];
+                var f = this.findField(fieldError.id);
+                if(f){
+                    f.markInvalid(fieldError.msg);
+                }
+            }
+        } else {
+            var field, id;
+            for(id in errors){
+                if(!Ext.isFunction(errors[id]) && (field = this.findField(id))){
+                    field.markInvalid(errors[id]);
+                }
+            }
+        }
+
+        return this;
+    },
+
+    /**
+     * Set values for fields in this form in bulk.
+     * @param {Array/Object} values Either an array in the form:<pre><code>
+[{id:'clientName', value:'Fred. Olsen Lines'},
+ {id:'portOfLoading', value:'FXT'},
+ {id:'portOfDischarge', value:'OSL'} ]</code></pre>
+     * or an object hash of the form:<pre><code>
+{
+    clientName: 'Fred. Olsen Lines',
+    portOfLoading: 'FXT',
+    portOfDischarge: 'OSL'
+}</code></pre>
+     * @return {BasicForm} this
+     */
+    setValues : function(values){
+        if(Ext.isArray(values)){ // array of objects
+            for(var i = 0, len = values.length; i < len; i++){
+                var v = values[i];
+                var f = this.findField(v.id);
+                if(f){
+                    f.setValue(v.value);
+                    if(this.trackResetOnLoad){
+                        f.originalValue = f.getValue();
+                    }
+                }
+            }
+        }else{ // object hash
+            var field, id;
+            for(id in values){
+                if(!Ext.isFunction(values[id]) && (field = this.findField(id))){
+                    field.setValue(values[id]);
+                    if(this.trackResetOnLoad){
+                        field.originalValue = field.getValue();
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * <p>Returns the fields in this form as an object with key/value pairs as they would be submitted using a standard form submit.
+     * If multiple fields exist with the same name they are returned as an array.</p>
+     * <p><b>Note:</b> The values are collected from all enabled HTML input elements within the form, <u>not</u> from
+     * the Ext Field objects. This means that all returned values are Strings (or Arrays of Strings) and that the
+     * value can potentially be the emptyText of a field.</p>
+     * @param {Boolean} asString (optional) Pass true to return the values as a string. (defaults to false, returning an Object)
+     * @return {String/Object}
+     */
+    getValues : function(asString){
+        var fs = Ext.lib.Ajax.serializeForm(this.el.dom);
+        if(asString === true){
+            return fs;
+        }
+        return Ext.urlDecode(fs);
+    },
+
+    /**
+     * Retrieves the fields in the form as a set of key/value pairs, using the {@link Ext.form.Field#getValue getValue()} method.
+     * If multiple fields exist with the same name they are returned as an array.
+     * @param {Boolean} dirtyOnly (optional) True to return only fields that are dirty.
+     * @return {Object} The values in the form
+     */
+    getFieldValues : function(dirtyOnly){
+        var o = {},
+            n,
+            key,
+            val;
+        this.items.each(function(f) {
+            if (!f.disabled && (dirtyOnly !== true || f.isDirty())) {
+                n = f.getName();
+                key = o[n];
+                val = f.getValue();
+
+                if(Ext.isDefined(key)){
+                    if(Ext.isArray(key)){
+                        o[n].push(val);
+                    }else{
+                        o[n] = [key, val];
+                    }
+                }else{
+                    o[n] = val;
+                }
+            }
+        });
+        return o;
+    },
+
+    /**
+     * Clears all invalid messages in this form.
+     * @return {BasicForm} this
+     */
+    clearInvalid : function(){
+        this.items.each(function(f){
+           f.clearInvalid();
+        });
+        return this;
+    },
+
+    /**
+     * Resets this form.
+     * @return {BasicForm} this
+     */
+    reset : function(){
+        this.items.each(function(f){
+            f.reset();
+        });
+        return this;
+    },
+
+    /**
+     * Add Ext.form Components to this form's Collection. This does not result in rendering of
+     * the passed Component, it just enables the form to validate Fields, and distribute values to
+     * Fields.
+     * <p><b>You will not usually call this function. In order to be rendered, a Field must be added
+     * to a {@link Ext.Container Container}, usually an {@link Ext.form.FormPanel FormPanel}.
+     * The FormPanel to which the field is added takes care of adding the Field to the BasicForm's
+     * collection.</b></p>
+     * @param {Field} field1
+     * @param {Field} field2 (optional)
+     * @param {Field} etc (optional)
+     * @return {BasicForm} this
+     */
+    add : function(){
+        this.items.addAll(Array.prototype.slice.call(arguments, 0));
+        return this;
+    },
+
+    /**
+     * Removes a field from the items collection (does NOT remove its markup).
+     * @param {Field} field
+     * @return {BasicForm} this
+     */
+    remove : function(field){
+        this.items.remove(field);
+        return this;
+    },
+
+    /**
+     * Removes all fields from the collection that have been destroyed.
+     */
+    cleanDestroyed : function() {
+        this.items.filterBy(function(o) { return !!o.isDestroyed; }).each(this.remove, this);
+    },
+
+    /**
+     * Iterates through the {@link Ext.form.Field Field}s which have been {@link #add add}ed to this BasicForm,
+     * checks them for an id attribute, and calls {@link Ext.form.Field#applyToMarkup} on the existing dom element with that id.
+     * @return {BasicForm} this
+     */
+    render : function(){
+        this.items.each(function(f){
+            if(f.isFormField && !f.rendered && document.getElementById(f.id)){ // if the element exists
+                f.applyToMarkup(f.id);
+            }
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#apply} for all fields in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyToFields : function(o){
+        this.items.each(function(f){
+           Ext.apply(f, o);
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#applyIf} for all field in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyIfToFields : function(o){
+        this.items.each(function(f){
+           Ext.applyIf(f, o);
+        });
+        return this;
+    },
+
+    callFieldMethod : function(fnName, args){
+        args = args || [];
+        this.items.each(function(f){
+            if(Ext.isFunction(f[fnName])){
+                f[fnName].apply(f, args);
+            }
+        });
+        return this;
+    }
+});
+
+// back compat
+Ext.BasicForm = Ext.form.BasicForm;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CompositeField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CompositeField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CompositeField.js	(revision 76)
@@ -0,0 +1,449 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.CompositeField
+ * @extends Ext.form.Field
+ * Composite field allowing a number of form Fields to be rendered on the same row. The fields are rendered
+ * using an hbox layout internally, so all of the normal HBox layout config items are available. Example usage:
+ * <pre>
+{
+    xtype: 'compositefield',
+    labelWidth: 120
+    items: [
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Title',
+            width     : 20
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'First',
+            flex      : 1
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Last',
+            flex      : 1
+        }
+    ]
+}
+ * </pre>
+ * In the example above the composite's fieldLabel will be set to 'Title, First, Last' as it groups the fieldLabels
+ * of each of its children. This can be overridden by setting a fieldLabel on the compositefield itself:
+ * <pre>
+{
+    xtype: 'compositefield',
+    fieldLabel: 'Custom label',
+    items: [...]
+}
+ * </pre>
+ * Any Ext.form.* component can be placed inside a composite field.
+ */
+Ext.form.CompositeField = Ext.extend(Ext.form.Field, {
+
+    /**
+     * @property defaultMargins
+     * @type String
+     * The margins to apply by default to each field in the composite
+     */
+    defaultMargins: '0 5 0 0',
+
+    /**
+     * @property skipLastItemMargin
+     * @type Boolean
+     * If true, the defaultMargins are not applied to the last item in the composite field set (defaults to true)
+     */
+    skipLastItemMargin: true,
+
+    /**
+     * @property isComposite
+     * @type Boolean
+     * Signifies that this is a Composite field
+     */
+    isComposite: true,
+
+    /**
+     * @property combineErrors
+     * @type Boolean
+     * True to combine errors from the individual fields into a single error message at the CompositeField level (defaults to true)
+     */
+    combineErrors: true,
+    
+    /**
+     * @cfg {String} labelConnector The string to use when joining segments of the built label together (defaults to ', ')
+     */
+    labelConnector: ', ',
+    
+    /**
+     * @cfg {Object} defaults Any default properties to assign to the child fields.
+     */
+
+    //inherit docs
+    //Builds the composite field label
+    initComponent: function() {
+        var labels = [],
+            items  = this.items,
+            item;
+
+        for (var i=0, j = items.length; i < j; i++) {
+            item = items[i];
+            
+            if (!Ext.isEmpty(item.ref)){
+                item.ref = '../' + item.ref;
+            }
+
+            labels.push(item.fieldLabel);
+
+            //apply any defaults
+            Ext.applyIf(item, this.defaults);
+
+            //apply default margins to each item except the last
+            if (!(i == j - 1 && this.skipLastItemMargin)) {
+                Ext.applyIf(item, {margins: this.defaultMargins});
+            }
+        }
+
+        this.fieldLabel = this.fieldLabel || this.buildLabel(labels);
+
+        /**
+         * @property fieldErrors
+         * @type Ext.util.MixedCollection
+         * MixedCollection of current errors on the Composite's subfields. This is used internally to track when
+         * to show and hide error messages at the Composite level. Listeners are attached to the MixedCollection's
+         * add, remove and replace events to update the error icon in the UI as errors are added or removed.
+         */
+        this.fieldErrors = new Ext.util.MixedCollection(true, function(item) {
+            return item.field;
+        });
+
+        this.fieldErrors.on({
+            scope  : this,
+            add    : this.updateInvalidMark,
+            remove : this.updateInvalidMark,
+            replace: this.updateInvalidMark
+        });
+
+        Ext.form.CompositeField.superclass.initComponent.apply(this, arguments);
+        
+        this.innerCt = new Ext.Container({
+            layout  : 'hbox',
+            items   : this.items,
+            cls     : 'x-form-composite',
+            defaultMargins: '0 3 0 0',
+            ownerCt: this
+        });
+        this.innerCt.ownerCt = undefined;
+        
+        var fields = this.innerCt.findBy(function(c) {
+            return c.isFormField;
+        }, this);
+
+        /**
+         * @property items
+         * @type Ext.util.MixedCollection
+         * Internal collection of all of the subfields in this Composite
+         */
+        this.items = new Ext.util.MixedCollection();
+        this.items.addAll(fields);
+        
+    },
+
+    /**
+     * @private
+     * Creates an internal container using hbox and renders the fields to it
+     */
+    onRender: function(ct, position) {
+        if (!this.el) {
+            /**
+             * @property innerCt
+             * @type Ext.Container
+             * A container configured with hbox layout which is responsible for laying out the subfields
+             */
+            var innerCt = this.innerCt;
+            innerCt.render(ct);
+
+            this.el = innerCt.getEl();
+
+            //if we're combining subfield errors into a single message, override the markInvalid and clearInvalid
+            //methods of each subfield and show them at the Composite level instead
+            if (this.combineErrors) {
+                this.eachItem(function(field) {
+                    Ext.apply(field, {
+                        markInvalid : this.onFieldMarkInvalid.createDelegate(this, [field], 0),
+                        clearInvalid: this.onFieldClearInvalid.createDelegate(this, [field], 0)
+                    });
+                });
+            }
+
+            //set the label 'for' to the first item
+            var l = this.el.parent().parent().child('label', true);
+            if (l) {
+                l.setAttribute('for', this.items.items[0].id);
+            }
+        }
+
+        Ext.form.CompositeField.superclass.onRender.apply(this, arguments);
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's markInvalid method is called.
+     * By default this just adds the subfield's error to the internal fieldErrors MixedCollection
+     * @param {Ext.form.Field} field The field that was marked invalid
+     * @param {String} message The error message
+     */
+    onFieldMarkInvalid: function(field, message) {
+        var name  = field.getName(),
+            error = {
+                field: name, 
+                errorName: field.fieldLabel || name,
+                error: message
+            };
+
+        this.fieldErrors.replace(name, error);
+
+        if (!field.preventMark) {
+            field.el.addClass(field.invalidClass);
+        }
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's clearInvalid method is called.
+     * By default this just updates the internal fieldErrors MixedCollection.
+     * @param {Ext.form.Field} field The field that was marked invalid
+     */
+    onFieldClearInvalid: function(field) {
+        this.fieldErrors.removeKey(field.getName());
+
+        field.el.removeClass(field.invalidClass);
+    },
+
+    /**
+     * @private
+     * Called after a subfield is marked valid or invalid, this checks to see if any of the subfields are
+     * currently invalid. If any subfields are invalid it builds a combined error message marks the composite
+     * invalid, otherwise clearInvalid is called
+     */
+    updateInvalidMark: function() {
+        var ieStrict = Ext.isIE6 && Ext.isStrict;
+
+        if (this.fieldErrors.length == 0) {
+            this.clearInvalid();
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.clearInvalid.defer(50, this);
+            }
+        } else {
+            var message = this.buildCombinedErrorMessage(this.fieldErrors.items);
+
+            this.sortErrors();
+            this.markInvalid(message);
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.markInvalid(message);
+            }
+        }
+    },
+
+    /**
+     * Performs validation checks on each subfield and returns false if any of them fail validation.
+     * @return {Boolean} False if any subfield failed validation
+     */
+    validateValue: function(value, preventMark) {
+        var valid = true;
+
+        this.eachItem(function(field) {
+            if (!field.isValid(preventMark)) {
+                valid = false;
+            }
+        });
+
+        return valid;
+    },
+
+    /**
+     * Takes an object containing error messages for contained fields, returning a combined error
+     * string (defaults to just placing each item on a new line). This can be overridden to provide
+     * custom combined error message handling.
+     * @param {Array} errors Array of errors in format: [{field: 'title', error: 'some error'}]
+     * @return {String} The combined error message
+     */
+    buildCombinedErrorMessage: function(errors) {
+        var combined = [],
+            error;
+
+        for (var i = 0, j = errors.length; i < j; i++) {
+            error = errors[i];
+
+            combined.push(String.format("{0}: {1}", error.errorName, error.error));
+        }
+
+        return combined.join("<br />");
+    },
+
+    /**
+     * Sorts the internal fieldErrors MixedCollection by the order in which the fields are defined.
+     * This is called before displaying errors to ensure that the errors are presented in the expected order.
+     * This function can be overridden to provide a custom sorting order if needed.
+     */
+    sortErrors: function() {
+        var fields = this.items;
+
+        this.fieldErrors.sort("ASC", function(a, b) {
+            var findByName = function(key) {
+                return function(field) {
+                    return field.getName() == key;
+                };
+            };
+
+            var aIndex = fields.findIndexBy(findByName(a.field)),
+                bIndex = fields.findIndexBy(findByName(b.field));
+
+            return aIndex < bIndex ? -1 : 1;
+        });
+    },
+
+    /**
+     * Resets each field in the composite to their previous value
+     */
+    reset: function() {
+        this.eachItem(function(item) {
+            item.reset();
+        });
+
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+    
+    /**
+     * Calls clearInvalid on all child fields. This is a convenience function and should not often need to be called
+     * as fields usually take care of clearing themselves
+     */
+    clearInvalidChildren: function() {
+        this.eachItem(function(item) {
+            item.clearInvalid();
+        });
+    },
+
+    /**
+     * Builds a label string from an array of subfield labels.
+     * By default this just joins the labels together with a comma
+     * @param {Array} segments Array of each of the labels in the composite field's subfields
+     * @return {String} The built label
+     */
+    buildLabel: function(segments) {
+        return Ext.clean(segments).join(this.labelConnector);
+    },
+
+    /**
+     * Checks each field in the composite and returns true if any is dirty
+     * @return {Boolean} True if any field is dirty
+     */
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        return dirty;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @private
+     * Passes the resize call through to the inner panel
+     */
+    onResize: function(adjWidth, adjHeight, rawWidth, rawHeight) {
+        var innerCt = this.innerCt;
+
+        if (this.rendered && innerCt.rendered) {
+            innerCt.setSize(adjWidth, adjHeight);
+        }
+
+        Ext.form.CompositeField.superclass.onResize.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Forces the internal container to be laid out again
+     */
+    doLayout: function(shallow, force) {
+        if (this.rendered) {
+            var innerCt = this.innerCt;
+
+            innerCt.forceLayout = this.ownerCt.forceLayout;
+            innerCt.doLayout(shallow, force);
+        }
+    },
+
+    /**
+     * @private
+     */
+    beforeDestroy: function(){
+        Ext.destroy(this.innerCt);
+
+        Ext.form.CompositeField.superclass.beforeDestroy.call(this);
+    },
+
+    //override the behaviour to check sub items.
+    setReadOnly : function(readOnly) {
+        if (readOnly == undefined) {
+            readOnly = true;
+        }
+        readOnly = !!readOnly;
+
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    onShow : function() {
+        Ext.form.CompositeField.superclass.onShow.call(this);
+        this.doLayout();
+    },
+
+    //override the behaviour to check sub items.
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    //override the behaviour to check sub items.
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    }
+});
+
+Ext.reg('compositefield', Ext.form.CompositeField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TriggerField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TriggerField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TriggerField.js	(revision 76)
@@ -0,0 +1,407 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.TriggerField
+ * @extends Ext.form.TextField
+ * Provides a convenient wrapper for TextFields that adds a clickable trigger button (looks like a combobox by default).
+ * The trigger has no default action, so you must assign a function to implement the trigger click handler by
+ * overriding {@link #onTriggerClick}. You can create a TriggerField directly, as it renders exactly like a combobox
+ * for which you can provide a custom implementation.  For example:
+ * <pre><code>
+var trigger = new Ext.form.TriggerField();
+trigger.onTriggerClick = myTriggerFn;
+trigger.applyToMarkup('my-field');
+</code></pre>
+ *
+ * However, in general you will most likely want to use TriggerField as the base class for a reusable component.
+ * {@link Ext.form.DateField} and {@link Ext.form.ComboBox} are perfect examples of this.
+ *
+ * @constructor
+ * Create a new TriggerField.
+ * @param {Object} config Configuration options (valid {@Ext.form.TextField} config options will also be applied
+ * to the base TextField)
+ * @xtype trigger
+ */
+Ext.form.TriggerField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the
+     * trigger element for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to act as the trigger button for a TriggerField.</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing, positioning
+     * and appearance of the trigger.  Defaults to:</p>
+     * <pre><code>{tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.triggerClass}</code></pre>
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "16", autocomplete: "off"}</code></pre>
+     */
+    defaultAutoCreate : {tag: "input", type: "text", size: "16", autocomplete: "off"},
+    /**
+     * @cfg {Boolean} hideTrigger <tt>true</tt> to hide the trigger element and display only the base
+     * text field (defaults to <tt>false</tt>)
+     */
+    hideTrigger:false,
+    /**
+     * @cfg {Boolean} editable <tt>false</tt> to prevent the user from typing text directly into the field,
+     * the field will only respond to a click on the trigger to set the value. (defaults to <tt>true</tt>).
+     */
+    editable: true,
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to prevent the user from changing the field, and
+     * hides the trigger.  Superceeds the editable and hideTrigger options if the value is true.
+     * (defaults to <tt>false</tt>)
+     */
+    readOnly: false,
+    /**
+     * @cfg {String} wrapFocusClass The class added to the to the wrap of the trigger element. Defaults to
+     * <tt>x-trigger-wrap-focus</tt>.
+     */
+    wrapFocusClass: 'x-trigger-wrap-focus',
+    /**
+     * @hide
+     * @method autoSize
+     */
+    autoSize: Ext.emptyFn,
+    // private
+    monitorTab : true,
+    // private
+    deferHeight : true,
+    // private
+    mimicing : false,
+
+    actionMode: 'wrap',
+
+    defaultTriggerWidth: 17,
+
+    // private
+    onResize : function(w, h){
+        Ext.form.TriggerField.superclass.onResize.call(this, w, h);
+        var tw = this.getTriggerWidth();
+        if(Ext.isNumber(w)){
+            this.el.setWidth(w - tw);
+        }
+        this.wrap.setWidth(this.el.getWidth() + tw);
+    },
+
+    getTriggerWidth: function(){
+        var tw = this.trigger.getWidth();
+        if(!this.hideTrigger && !this.readOnly && tw === 0){
+            tw = this.defaultTriggerWidth;
+        }
+        return tw;
+    },
+
+    // private
+    alignErrorIcon : function(){
+        if(this.wrap){
+            this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.doc = Ext.isIE ? Ext.getBody() : Ext.getDoc();
+        Ext.form.TriggerField.superclass.onRender.call(this, ct, position);
+
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap x-form-field-trigger-wrap'});
+        this.trigger = this.wrap.createChild(this.triggerConfig ||
+                {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.triggerClass});
+        this.initTrigger();
+        if(!this.width){
+            this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    getWidth: function() {
+        return(this.el.getWidth() + this.trigger.getWidth());
+    },
+
+    updateEditState: function(){
+        if(this.rendered){
+            if (this.readOnly) {
+                this.el.dom.readOnly = true;
+                this.el.addClass('x-trigger-noedit');
+                this.mun(this.el, 'click', this.onTriggerClick, this);
+                this.trigger.setDisplayed(false);
+            } else {
+                if (!this.editable) {
+                    this.el.dom.readOnly = true;
+                    this.el.addClass('x-trigger-noedit');
+                    this.mon(this.el, 'click', this.onTriggerClick, this);
+                } else {
+                    this.el.dom.readOnly = false;
+                    this.el.removeClass('x-trigger-noedit');
+                    this.mun(this.el, 'click', this.onTriggerClick, this);
+                }
+                this.trigger.setDisplayed(!this.hideTrigger);
+            }
+            this.onResize(this.width || this.wrap.getWidth());
+        }
+    },
+
+    /**
+     * Changes the hidden status of the trigger.
+     * @param {Boolean} hideTrigger True to hide the trigger, false to show it.
+     */
+    setHideTrigger: function(hideTrigger){
+        if(hideTrigger != this.hideTrigger){
+            this.hideTrigger = hideTrigger;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Allow or prevent the user from directly editing the field text.  If false is passed,
+     * the user will only be able to modify the field using the trigger.  Will also add
+     * a click event to the text field which will call the trigger. This method
+     * is the runtime equivalent of setting the {@link #editable} config option at config time.
+     * @param {Boolean} value True to allow the user to directly edit the field text.
+     */
+    setEditable: function(editable){
+        if(editable != this.editable){
+            this.editable = editable;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Setting this to true will supersede settings {@link #editable} and {@link #hideTrigger}.
+     * Setting this to false will defer back to {@link #editable} and {@link #hideTrigger}. This method
+     * is the runtime equivalent of setting the {@link #readOnly} config option at config time.
+     * @param {Boolean} value True to prevent the user changing the field and explicitly
+     * hide the trigger.
+     */
+    setReadOnly: function(readOnly){
+        if(readOnly != this.readOnly){
+            this.readOnly = readOnly;
+            this.updateEditState();
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.TriggerField.superclass.afterRender.call(this);
+        this.updateEditState();
+    },
+
+    // private
+    initTrigger : function(){
+        this.mon(this.trigger, 'click', this.onTriggerClick, this, {preventDefault:true});
+        this.trigger.addClassOnOver('x-form-trigger-over');
+        this.trigger.addClassOnClick('x-form-trigger-click');
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.trigger, this.wrap);
+        if (this.mimicing){
+            this.doc.un('mousedown', this.mimicBlur, this);
+        }
+        delete this.doc;
+        Ext.form.TriggerField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    onFocus : function(){
+        Ext.form.TriggerField.superclass.onFocus.call(this);
+        if(!this.mimicing){
+            this.wrap.addClass(this.wrapFocusClass);
+            this.mimicing = true;
+            this.doc.on('mousedown', this.mimicBlur, this, {delay: 10});
+            if(this.monitorTab){
+                this.on('specialkey', this.checkTab, this);
+            }
+        }
+    },
+
+    // private
+    checkTab : function(me, e){
+        if(e.getKey() == e.TAB){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    onBlur : Ext.emptyFn,
+
+    // private
+    mimicBlur : function(e){
+        if(!this.isDestroyed && !this.wrap.contains(e.target) && this.validateBlur(e)){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    triggerBlur : function(){
+        this.mimicing = false;
+        this.doc.un('mousedown', this.mimicBlur, this);
+        if(this.monitorTab && this.el){
+            this.un('specialkey', this.checkTab, this);
+        }
+        Ext.form.TriggerField.superclass.onBlur.call(this);
+        if(this.wrap){
+            this.wrap.removeClass(this.wrapFocusClass);
+        }
+    },
+
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    // This should be overriden by any subclass that needs to check whether or not the field can be blurred.
+    validateBlur : function(e){
+        return true;
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function.  See Ext.form.ComboBox and Ext.form.DateField for
+     * sample implementations.
+     * @method
+     * @param {EventObject} e
+     */
+    onTriggerClick : Ext.emptyFn
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+});
+
+/**
+ * @class Ext.form.TwinTriggerField
+ * @extends Ext.form.TriggerField
+ * TwinTriggerField is not a public class to be used directly.  It is meant as an abstract base class
+ * to be extended by an implementing class.  For an example of implementing this class, see the custom
+ * SearchField implementation here:
+ * <a href="http://extjs.com/deploy/ext/examples/form/custom.html">http://extjs.com/deploy/ext/examples/form/custom.html</a>
+ */
+Ext.form.TwinTriggerField = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the trigger elements
+     * for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to contain the two trigger elements for this Field.
+     * Each trigger element must be marked by the CSS class <tt>x-form-trigger</tt> (also see
+     * <tt>{@link #trigger1Class}</tt> and <tt>{@link #trigger2Class}</tt>).</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing,
+     * positioning and appearance of the triggers.</p>
+     */
+    /**
+     * @cfg {String} trigger1Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {String} trigger2Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+
+    initComponent : function(){
+        Ext.form.TwinTriggerField.superclass.initComponent.call(this);
+
+        this.triggerConfig = {
+            tag:'span', cls:'x-form-twin-triggers', cn:[
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger1Class},
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger2Class}
+        ]};
+    },
+
+    getTrigger : function(index){
+        return this.triggers[index];
+    },
+    
+    afterRender: function(){
+        Ext.form.TwinTriggerField.superclass.afterRender.call(this);
+        var triggers = this.triggers,
+            i = 0,
+            len = triggers.length;
+            
+        for(; i < len; ++i){
+            if(this['hideTrigger' + (i + 1)]){
+                    triggers[i].hide();
+                }
+
+        }    
+    },
+
+    initTrigger : function(){
+        var ts = this.trigger.select('.x-form-trigger', true),
+            triggerField = this;
+            
+        ts.each(function(t, all, index){
+            var triggerIndex = 'Trigger'+(index+1);
+            t.hide = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = 'none';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = true;
+            };
+            t.show = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = '';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = false;
+            };
+            this.mon(t, 'click', this['on'+triggerIndex+'Click'], this, {preventDefault:true});
+            t.addClassOnOver('x-form-trigger-over');
+            t.addClassOnClick('x-form-trigger-click');
+        }, this);
+        this.triggers = ts.elements;
+    },
+
+    getTriggerWidth: function(){
+        var tw = 0;
+        Ext.each(this.triggers, function(t, index){
+            var triggerIndex = 'Trigger' + (index + 1),
+                w = t.getWidth();
+            if(w === 0 && !this['hidden' + triggerIndex]){
+                tw += this.defaultTriggerWidth;
+            }else{
+                tw += w;
+            }
+        }, this);
+        return tw;
+    },
+
+    // private
+    onDestroy : function() {
+        Ext.destroy(this.triggers);
+        Ext.form.TwinTriggerField.superclass.onDestroy.call(this);
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger1Click : Ext.emptyFn,
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger2Click : Ext.emptyFn
+});
+Ext.reg('trigger', Ext.form.TriggerField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DisplayField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DisplayField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DisplayField.js	(revision 76)
@@ -0,0 +1,98 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.DisplayField
+ * @extends Ext.form.Field
+ * A display-only text field which is not validated and not submitted.
+ * @constructor
+ * Creates a new DisplayField.
+ * @param {Object} config Configuration options
+ * @xtype displayfield
+ */
+Ext.form.DisplayField = Ext.extend(Ext.form.Field,  {
+    validationEvent : false,
+    validateOnBlur : false,
+    defaultAutoCreate : {tag: "div"},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to <tt>"x-form-display-field"</tt>)
+     */
+    fieldClass : "x-form-display-field",
+    /**
+     * @cfg {Boolean} htmlEncode <tt>false</tt> to skip HTML-encoding the text when rendering it (defaults to
+     * <tt>false</tt>). This might be useful if you want to include tags in the field's innerHTML rather than
+     * rendering them as string literals per the default logic.
+     */
+    htmlEncode: false,
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    isValid : function(){
+        return true;
+    },
+
+    validate : function(){
+        return true;
+    },
+
+    getRawValue : function(){
+        var v = this.rendered ? this.el.dom.innerHTML : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlDecode(v);
+        }
+        return v;
+    },
+
+    getValue : function(){
+        return this.getRawValue();
+    },
+    
+    getName: function() {
+        return this.name;
+    },
+
+    setRawValue : function(v){
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlEncode(v);
+        }
+        return this.rendered ? (this.el.dom.innerHTML = (Ext.isEmpty(v) ? '' : v)) : (this.value = v);
+    },
+
+    setValue : function(v){
+        this.setRawValue(v);
+        return this;
+    }
+    /** 
+     * @cfg {String} inputType 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} disabled 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} readOnly 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} validateOnBlur 
+     * @hide
+     */
+    /** 
+     * @cfg {Number} validationDelay 
+     * @hide
+     */
+    /** 
+     * @cfg {String/Boolean} validationEvent 
+     * @hide
+     */
+});
+
+Ext.reg('displayfield', Ext.form.DisplayField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/RadioGroup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/RadioGroup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/RadioGroup.js	(revision 76)
@@ -0,0 +1,122 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.RadioGroup
+ * @extends Ext.form.CheckboxGroup
+ * A grouping container for {@link Ext.form.Radio} controls.
+ * @constructor
+ * Creates a new RadioGroup
+ * @param {Object} config Configuration options
+ * @xtype radiogroup
+ */
+Ext.form.RadioGroup = Ext.extend(Ext.form.CheckboxGroup, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Radio Radio}s or Radio config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {Boolean} allowBlank True to allow every item in the group to be blank (defaults to true).
+     * If allowBlank = false and no items are selected at validation time, {@link @blankText} will
+     * be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails
+     * (defaults to 'You must select one item in this group')
+     */
+    blankText : 'You must select one item in this group',
+    
+    // private
+    defaultType : 'radio',
+    
+    // private
+    groupCls : 'x-form-radio-group',
+    
+    /**
+     * @event change
+     * Fires when the state of a child radio changes.
+     * @param {Ext.form.RadioGroup} this
+     * @param {Ext.form.Radio} checked The checked radio
+     */
+    
+    /**
+     * Gets the selected {@link Ext.form.Radio} in the group, if it exists.
+     * @return {Ext.form.Radio} The selected radio.
+     */
+    getValue : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        return out;
+    },
+    
+    /**
+     * Sets the checked radio in the group.
+     * @param {String/Ext.form.Radio} id The radio to check.
+     * @param {Boolean} value The value to set the radio.
+     * @return {Ext.form.RadioGroup} this
+     */
+    onSetValue : function(id, value){
+        if(arguments.length > 1){
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+                if(f.checked){
+                    this.eachItem(function(item){
+                        if (item !== f){
+                            item.setValue(false);
+                        }
+                    });
+                }
+            }
+        }else{
+            this.setValueForItem(id);
+        }
+    },
+    
+    setValueForItem : function(val){
+        val = String(val).split(',')[0];
+        this.eachItem(function(item){
+            item.setValue(val == item.inputValue);
+        });
+    },
+    
+    // private
+    fireChecked : function(){
+        if(!this.checkTask){
+            this.checkTask = new Ext.util.DelayedTask(this.bufferChecked, this);
+        }
+        this.checkTask.delay(10);
+    },
+    
+    // private
+    bufferChecked : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        this.fireEvent('change', this, out);
+    },
+    
+    onDestroy : function(){
+        if(this.checkTask){
+            this.checkTask.cancel();
+            this.checkTask = null;
+        }
+        Ext.form.RadioGroup.superclass.onDestroy.call(this);
+    }
+
+});
+
+Ext.reg('radiogroup', Ext.form.RadioGroup);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/HtmlEditor.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/HtmlEditor.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/HtmlEditor.js	(revision 76)
@@ -0,0 +1,1263 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.HtmlEditor
+ * @extends Ext.form.Field
+ * Provides a lightweight HTML Editor component. Some toolbar features are not supported by Safari and will be
+ * automatically hidden when needed.  These are noted in the config options where appropriate.
+ * <br><br>The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not
+ * enabled by default unless the global {@link Ext.QuickTips} singleton is {@link Ext.QuickTips#init initialized}.
+ * <br><br><b>Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT
+ * supported by this editor.</b>
+ * <br><br>An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within
+ * any element that has display set to 'none' can cause problems in Safari and Firefox due to their default iframe reloading bugs.
+ * <br><br>Example usage:
+ * <pre><code>
+// Simple example rendered with default options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.form.HtmlEditor({
+    renderTo: Ext.getBody(),
+    width: 800,
+    height: 300
+});
+
+// Passed via xtype into a container and with custom options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.Panel({
+    title: 'HTML Editor',
+    renderTo: Ext.getBody(),
+    width: 600,
+    height: 300,
+    frame: true,
+    layout: 'fit',
+    items: {
+        xtype: 'htmleditor',
+        enableColors: false,
+        enableAlignments: false
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new HtmlEditor
+ * @param {Object} config
+ * @xtype htmleditor
+ */
+
+Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Boolean} enableFormat Enable the bold, italic and underline buttons (defaults to true)
+     */
+    enableFormat : true,
+    /**
+     * @cfg {Boolean} enableFontSize Enable the increase/decrease font size buttons (defaults to true)
+     */
+    enableFontSize : true,
+    /**
+     * @cfg {Boolean} enableColors Enable the fore/highlight color buttons (defaults to true)
+     */
+    enableColors : true,
+    /**
+     * @cfg {Boolean} enableAlignments Enable the left, center, right alignment buttons (defaults to true)
+     */
+    enableAlignments : true,
+    /**
+     * @cfg {Boolean} enableLists Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true)
+     */
+    enableLists : true,
+    /**
+     * @cfg {Boolean} enableSourceEdit Enable the switch to source edit button. Not available in Safari. (defaults to true)
+     */
+    enableSourceEdit : true,
+    /**
+     * @cfg {Boolean} enableLinks Enable the create link button. Not available in Safari. (defaults to true)
+     */
+    enableLinks : true,
+    /**
+     * @cfg {Boolean} enableFont Enable font selection. Not available in Safari. (defaults to true)
+     */
+    enableFont : true,
+    /**
+     * @cfg {String} createLinkText The default text for the create link prompt
+     */
+    createLinkText : 'Please enter the URL for the link:',
+    /**
+     * @cfg {String} defaultLinkValue The default value for the create link prompt (defaults to http:/ /)
+     */
+    defaultLinkValue : 'http:/'+'/',
+    /**
+     * @cfg {Array} fontFamilies An array of available font families
+     */
+    fontFamilies : [
+        'Arial',
+        'Courier New',
+        'Tahoma',
+        'Times New Roman',
+        'Verdana'
+    ],
+    defaultFont: 'tahoma',
+    /**
+     * @cfg {String} defaultValue A default value to be put into the editor to resolve focus issues (defaults to &#160; (Non-breaking space) in Opera and IE6, &#8203; (Zero-width space) in all other browsers).
+     */
+    defaultValue: (Ext.isOpera || Ext.isIE6) ? '&#160;' : '&#8203;',
+
+    // private properties
+    actionMode: 'wrap',
+    validationEvent : false,
+    deferHeight: true,
+    initialized : false,
+    activated : false,
+    sourceEditMode : false,
+    onFocus : Ext.emptyFn,
+    iframePad:3,
+    hideMode:'offsets',
+    defaultAutoCreate : {
+        tag: "textarea",
+        style:"width:500px;height:300px;",
+        autocomplete: "off"
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event initialize
+             * Fires when the editor is fully initialized (including the iframe)
+             * @param {HtmlEditor} this
+             */
+            'initialize',
+            /**
+             * @event activate
+             * Fires when the editor is first receives the focus. Any insertion must wait
+             * until after this event.
+             * @param {HtmlEditor} this
+             */
+            'activate',
+             /**
+             * @event beforesync
+             * Fires before the textarea is updated with content from the editor iframe. Return false
+             * to cancel the sync.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforesync',
+             /**
+             * @event beforepush
+             * Fires before the iframe editor is updated with content from the textarea. Return false
+             * to cancel the push.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforepush',
+             /**
+             * @event sync
+             * Fires when the textarea is updated with content from the editor iframe.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'sync',
+             /**
+             * @event push
+             * Fires when the iframe editor is updated with content from the textarea.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'push',
+             /**
+             * @event editmodechange
+             * Fires when the editor switches edit modes
+             * @param {HtmlEditor} this
+             * @param {Boolean} sourceEdit True if source edit, false if standard editing.
+             */
+            'editmodechange'
+        );
+        Ext.form.HtmlEditor.superclass.initComponent.call(this);
+    },
+
+    // private
+    createFontOptions : function(){
+        var buf = [], fs = this.fontFamilies, ff, lc;
+        for(var i = 0, len = fs.length; i< len; i++){
+            ff = fs[i];
+            lc = ff.toLowerCase();
+            buf.push(
+                '<option value="',lc,'" style="font-family:',ff,';"',
+                    (this.defaultFont == lc ? ' selected="true">' : '>'),
+                    ff,
+                '</option>'
+            );
+        }
+        return buf.join('');
+    },
+
+    /*
+     * Protected method that will not generally be called directly. It
+     * is called when the editor creates its toolbar. Override this method if you need to
+     * add custom toolbar buttons.
+     * @param {HtmlEditor} editor
+     */
+    createToolbar : function(editor){
+        var items = [];
+        var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();
+
+
+        function btn(id, toggle, handler){
+            return {
+                itemId : id,
+                cls : 'x-btn-icon',
+                iconCls: 'x-edit-'+id,
+                enableToggle:toggle !== false,
+                scope: editor,
+                handler:handler||editor.relayBtnCmd,
+                clickEvent:'mousedown',
+                tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined,
+                overflowText: editor.buttonTips[id].title || undefined,
+                tabIndex:-1
+            };
+        }
+
+
+        if(this.enableFont && !Ext.isSafari2){
+            var fontSelectItem = new Ext.Toolbar.Item({
+               autoEl: {
+                    tag:'select',
+                    cls:'x-font-select',
+                    html: this.createFontOptions()
+               }
+            });
+
+            items.push(
+                fontSelectItem,
+                '-'
+            );
+        }
+
+        if(this.enableFormat){
+            items.push(
+                btn('bold'),
+                btn('italic'),
+                btn('underline')
+            );
+        }
+
+        if(this.enableFontSize){
+            items.push(
+                '-',
+                btn('increasefontsize', false, this.adjustFont),
+                btn('decreasefontsize', false, this.adjustFont)
+            );
+        }
+
+        if(this.enableColors){
+            items.push(
+                '-', {
+                    itemId:'forecolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-forecolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.forecolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        allowReselect: true,
+                        focus: Ext.emptyFn,
+                        value:'000000',
+                        plain:true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                this.execCmd('forecolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                this.deferFocus();
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }, {
+                    itemId:'backcolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-backcolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.backcolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        focus: Ext.emptyFn,
+                        value:'FFFFFF',
+                        plain:true,
+                        allowReselect: true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                if(Ext.isGecko){
+                                    this.execCmd('useCSS', false);
+                                    this.execCmd('hilitecolor', color);
+                                    this.execCmd('useCSS', true);
+                                    this.deferFocus();
+                                }else{
+                                    this.execCmd(Ext.isOpera ? 'hilitecolor' : 'backcolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                    this.deferFocus();
+                                }
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }
+            );
+        }
+
+        if(this.enableAlignments){
+            items.push(
+                '-',
+                btn('justifyleft'),
+                btn('justifycenter'),
+                btn('justifyright')
+            );
+        }
+
+        if(!Ext.isSafari2){
+            if(this.enableLinks){
+                items.push(
+                    '-',
+                    btn('createlink', false, this.createLink)
+                );
+            }
+
+            if(this.enableLists){
+                items.push(
+                    '-',
+                    btn('insertorderedlist'),
+                    btn('insertunorderedlist')
+                );
+            }
+            if(this.enableSourceEdit){
+                items.push(
+                    '-',
+                    btn('sourceedit', true, function(btn){
+                        this.toggleSourceEdit(!this.sourceEditMode);
+                    })
+                );
+            }
+        }
+
+        // build the toolbar
+        var tb = new Ext.Toolbar({
+            renderTo: this.wrap.dom.firstChild,
+            items: items
+        });
+
+        if (fontSelectItem) {
+            this.fontSelect = fontSelectItem.el;
+
+            this.mon(this.fontSelect, 'change', function(){
+                var font = this.fontSelect.dom.value;
+                this.relayCmd('fontname', font);
+                this.deferFocus();
+            }, this);
+        }
+
+        // stop form submits
+        this.mon(tb.el, 'click', function(e){
+            e.preventDefault();
+        });
+
+        this.tb = tb;
+        this.tb.doLayout();
+    },
+
+    onDisable: function(){
+        this.wrap.mask();
+        Ext.form.HtmlEditor.superclass.onDisable.call(this);
+    },
+
+    onEnable: function(){
+        this.wrap.unmask();
+        Ext.form.HtmlEditor.superclass.onEnable.call(this);
+    },
+
+    setReadOnly: function(readOnly){
+
+        Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);
+        if(this.initialized){
+            if(Ext.isIE){
+                this.getEditorBody().contentEditable = !readOnly;
+            }else{
+                this.setDesignMode(!readOnly);
+            }
+            var bd = this.getEditorBody();
+            if(bd){
+                bd.style.cursor = this.readOnly ? 'default' : 'text';
+            }
+            this.disableItems(readOnly);
+        }
+    },
+
+    /**
+     * Protected method that will not generally be called directly. It
+     * is called when the editor initializes the iframe with HTML contents. Override this method if you
+     * want to change the initialization markup of the iframe (e.g. to add stylesheets).
+     *
+     * Note: IE8-Standards has unwanted scroller behavior, so the default meta tag forces IE7 compatibility
+     */
+    getDocMarkup : function(){
+        var h = Ext.fly(this.iframe).getHeight() - this.iframePad * 2;
+        return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>', this.iframePad, h);
+    },
+
+    // private
+    getEditorBody : function(){
+        var doc = this.getDoc();
+        return doc.body || doc.documentElement;
+    },
+
+    // private
+    getDoc : function(){
+        return Ext.isIE ? this.getWin().document : (this.iframe.contentDocument || this.getWin().document);
+    },
+
+    // private
+    getWin : function(){
+        return Ext.isIE ? this.iframe.contentWindow : window.frames[this.iframe.name];
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.HtmlEditor.superclass.onRender.call(this, ct, position);
+        this.el.dom.style.border = '0 none';
+        this.el.dom.setAttribute('tabIndex', -1);
+        this.el.addClass('x-hidden');
+        if(Ext.isIE){ // fix IE 1px bogus margin
+            this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;');
+        }
+        this.wrap = this.el.wrap({
+            cls:'x-html-editor-wrap', cn:{cls:'x-html-editor-tb'}
+        });
+
+        this.createToolbar(this);
+
+        this.disableItems(true);
+
+        this.tb.doLayout();
+
+        this.createIFrame();
+
+        if(!this.width){
+            var sz = this.el.getSize();
+            this.setSize(sz.width, this.height || sz.height);
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    createIFrame: function(){
+        var iframe = document.createElement('iframe');
+        iframe.name = Ext.id();
+        iframe.frameBorder = '0';
+        iframe.style.overflow = 'auto';
+        iframe.src = Ext.SSL_SECURE_URL;
+
+        this.wrap.dom.appendChild(iframe);
+        this.iframe = iframe;
+
+        this.monitorTask = Ext.TaskMgr.start({
+            run: this.checkDesignMode,
+            scope: this,
+            interval:100
+        });
+    },
+
+    initFrame : function(){
+        Ext.TaskMgr.stop(this.monitorTask);
+        var doc = this.getDoc();
+        this.win = this.getWin();
+
+        doc.open();
+        doc.write(this.getDocMarkup());
+        doc.close();
+
+        var task = { // must defer to wait for browser to be ready
+            run : function(){
+                var doc = this.getDoc();
+                if(doc.body || doc.readyState == 'complete'){
+                    Ext.TaskMgr.stop(task);
+                    this.setDesignMode(true);
+                    this.initEditor.defer(10, this);
+                }
+            },
+            interval : 10,
+            duration:10000,
+            scope: this
+        };
+        Ext.TaskMgr.start(task);
+    },
+
+
+    checkDesignMode : function(){
+        if(this.wrap && this.wrap.dom.offsetWidth){
+            var doc = this.getDoc();
+            if(!doc){
+                return;
+            }
+            if(!doc.editorInitialized || this.getDesignMode() != 'on'){
+                this.initFrame();
+            }
+        }
+    },
+
+    /* private
+     * set current design mode. To enable, mode can be true or 'on', off otherwise
+     */
+    setDesignMode : function(mode){
+        var doc = this.getDoc();
+        if (doc) {
+            if(this.readOnly){
+                mode = false;
+            }
+            doc.designMode = (/on|true/i).test(String(mode).toLowerCase()) ?'on':'off';
+        }
+
+    },
+
+    // private
+    getDesignMode : function(){
+        var doc = this.getDoc();
+        if(!doc){ return ''; }
+        return String(doc.designMode).toLowerCase();
+
+    },
+
+    disableItems: function(disabled){
+        if(this.fontSelect){
+            this.fontSelect.dom.disabled = disabled;
+        }
+        this.tb.items.each(function(item){
+            if(item.getItemId() != 'sourceedit'){
+                item.setDisabled(disabled);
+            }
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.HtmlEditor.superclass.onResize.apply(this, arguments);
+        if(this.el && this.iframe){
+            if(Ext.isNumber(w)){
+                var aw = w - this.wrap.getFrameWidth('lr');
+                this.el.setWidth(aw);
+                this.tb.setWidth(aw);
+                this.iframe.style.width = Math.max(aw, 0) + 'px';
+            }
+            if(Ext.isNumber(h)){
+                var ah = h - this.wrap.getFrameWidth('tb') - this.tb.el.getHeight();
+                this.el.setHeight(ah);
+                this.iframe.style.height = Math.max(ah, 0) + 'px';
+                var bd = this.getEditorBody();
+                if(bd){
+                    bd.style.height = Math.max((ah - (this.iframePad*2)), 0) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * Toggles the editor between standard and source edit mode.
+     * @param {Boolean} sourceEdit (optional) True for source edit, false for standard
+     */
+    toggleSourceEdit : function(sourceEditMode){
+        var iframeHeight,
+            elHeight;
+
+        if (sourceEditMode === undefined) {
+            sourceEditMode = !this.sourceEditMode;
+        }
+        this.sourceEditMode = sourceEditMode === true;
+        var btn = this.tb.getComponent('sourceedit');
+
+        if (btn.pressed !== this.sourceEditMode) {
+            btn.toggle(this.sourceEditMode);
+            if (!btn.xtbHidden) {
+                return;
+            }
+        }
+        if (this.sourceEditMode) {
+            // grab the height of the containing panel before we hide the iframe
+            this.previousSize = this.getSize();
+
+            iframeHeight = Ext.get(this.iframe).getHeight();
+
+            this.disableItems(true);
+            this.syncValue();
+            this.iframe.className = 'x-hidden';
+            this.el.removeClass('x-hidden');
+            this.el.dom.removeAttribute('tabIndex');
+            this.el.focus();
+            this.el.dom.style.height = iframeHeight + 'px';
+        }
+        else {
+            elHeight = parseInt(this.el.dom.style.height, 10);
+            if (this.initialized) {
+                this.disableItems(this.readOnly);
+            }
+            this.pushValue();
+            this.iframe.className = '';
+            this.el.addClass('x-hidden');
+            this.el.dom.setAttribute('tabIndex', -1);
+            this.deferFocus();
+
+            this.setSize(this.previousSize);
+            delete this.previousSize;
+            this.iframe.style.height = elHeight + 'px';
+        }
+        this.fireEvent('editmodechange', this, this.sourceEditMode);
+    },
+
+    // private used internally
+    createLink : function() {
+        var url = prompt(this.createLinkText, this.defaultLinkValue);
+        if(url && url != 'http:/'+'/'){
+            this.relayCmd('createlink', url);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // docs inherit from Field
+    setValue : function(v){
+        Ext.form.HtmlEditor.superclass.setValue.call(this, v);
+        this.pushValue();
+        return this;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. If you need/want
+     * custom HTML cleanup, this is the method you should override.
+     * @param {String} html The HTML to be cleaned
+     * @return {String} The cleaned HTML
+     */
+    cleanHtml: function(html) {
+        html = String(html);
+        if(Ext.isWebKit){ // strip safari nonsense
+            html = html.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi, '');
+        }
+
+        /*
+         * Neat little hack. Strips out all the non-digit characters from the default
+         * value and compares it to the character code of the first character in the string
+         * because it can cause encoding issues when posted to the server.
+         */
+        if(html.charCodeAt(0) == this.defaultValue.replace(/\D/g, '')){
+            html = html.substring(1);
+        }
+        return html;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Syncs the contents
+     * of the editor iframe with the textarea.
+     */
+    syncValue : function(){
+        if(this.initialized){
+            var bd = this.getEditorBody();
+            var html = bd.innerHTML;
+            if(Ext.isWebKit){
+                var bs = bd.getAttribute('style'); // Safari puts text-align styles on the body element!
+                var m = bs.match(/text-align:(.*?);/i);
+                if(m && m[1]){
+                    html = '<div style="'+m[0]+'">' + html + '</div>';
+                }
+            }
+            html = this.cleanHtml(html);
+            if(this.fireEvent('beforesync', this, html) !== false){
+                this.el.dom.value = html;
+                this.fireEvent('sync', this, html);
+            }
+        }
+    },
+
+    //docs inherit from Field
+    getValue : function() {
+        this[this.sourceEditMode ? 'pushValue' : 'syncValue']();
+        return Ext.form.HtmlEditor.superclass.getValue.call(this);
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Pushes the value of the textarea
+     * into the iframe editor.
+     */
+    pushValue : function(){
+        if(this.initialized){
+            var v = this.el.dom.value;
+            if(!this.activated && v.length < 1){
+                v = this.defaultValue;
+            }
+            if(this.fireEvent('beforepush', this, v) !== false){
+                this.getEditorBody().innerHTML = v;
+                if(Ext.isGecko){
+                    // Gecko hack, see: https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8
+                    this.setDesignMode(false);  //toggle off first
+                    this.setDesignMode(true);
+                }
+                this.fireEvent('push', this, v);
+            }
+
+        }
+    },
+
+    // private
+    deferFocus : function(){
+        this.focus.defer(10, this);
+    },
+
+    // docs inherit from Field
+    focus : function(){
+        if(this.win && !this.sourceEditMode){
+            this.win.focus();
+        }else{
+            this.el.focus();
+        }
+    },
+
+    // private
+    initEditor : function(){
+        //Destroying the component during/before initEditor can cause issues.
+        try{
+            var dbody = this.getEditorBody(),
+                ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat', 'background-color', 'color'),
+                doc,
+                fn;
+
+            ss['background-attachment'] = 'fixed'; // w3c
+            dbody.bgProperties = 'fixed'; // ie
+
+            Ext.DomHelper.applyStyles(dbody, ss);
+
+            doc = this.getDoc();
+
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                }catch(e){}
+            }
+
+            /*
+             * We need to use createDelegate here, because when using buffer, the delayed task is added
+             * as a property to the function. When the listener is removed, the task is deleted from the function.
+             * Since onEditorEvent is shared on the prototype, if we have multiple html editors, the first time one of the editors
+             * is destroyed, it causes the fn to be deleted from the prototype, which causes errors. Essentially, we're just anonymizing the function.
+             */
+            fn = this.onEditorEvent.createDelegate(this);
+            Ext.EventManager.on(doc, {
+                mousedown: fn,
+                dblclick: fn,
+                click: fn,
+                keyup: fn,
+                buffer:100
+            });
+
+            if(Ext.isGecko){
+                Ext.EventManager.on(doc, 'keypress', this.applyCommand, this);
+            }
+            if(Ext.isIE || Ext.isWebKit || Ext.isOpera){
+                Ext.EventManager.on(doc, 'keydown', this.fixKeys, this);
+            }
+            doc.editorInitialized = true;
+            this.initialized = true;
+            this.pushValue();
+            this.setReadOnly(this.readOnly);
+            this.fireEvent('initialize', this);
+        }catch(e){}
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.monitorTask){
+            Ext.TaskMgr.stop(this.monitorTask);
+        }
+        if(this.rendered){
+            Ext.destroy(this.tb);
+            var doc = this.getDoc();
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                    for (var prop in doc){
+                        delete doc[prop];
+                    }
+                }catch(e){}
+            }
+            if(this.wrap){
+                this.wrap.dom.innerHTML = '';
+                this.wrap.remove();
+            }
+        }
+        Ext.form.HtmlEditor.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onFirstFocus : function(){
+        this.activated = true;
+        this.disableItems(this.readOnly);
+        if(Ext.isGecko){ // prevent silly gecko errors
+            this.win.focus();
+            var s = this.win.getSelection();
+            if(!s.focusNode || s.focusNode.nodeType != 3){
+                var r = s.getRangeAt(0);
+                r.selectNodeContents(this.getEditorBody());
+                r.collapse(true);
+                this.deferFocus();
+            }
+            try{
+                this.execCmd('useCSS', true);
+                this.execCmd('styleWithCSS', false);
+            }catch(e){}
+        }
+        this.fireEvent('activate', this);
+    },
+
+    // private
+    adjustFont: function(btn){
+        var adjust = btn.getItemId() == 'increasefontsize' ? 1 : -1,
+            doc = this.getDoc(),
+            v = parseInt(doc.queryCommandValue('FontSize') || 2, 10);
+        if((Ext.isSafari && !Ext.isSafari2) || Ext.isChrome || Ext.isAir){
+            // Safari 3 values
+            // 1 = 10px, 2 = 13px, 3 = 16px, 4 = 18px, 5 = 24px, 6 = 32px
+            if(v <= 10){
+                v = 1 + adjust;
+            }else if(v <= 13){
+                v = 2 + adjust;
+            }else if(v <= 16){
+                v = 3 + adjust;
+            }else if(v <= 18){
+                v = 4 + adjust;
+            }else if(v <= 24){
+                v = 5 + adjust;
+            }else {
+                v = 6 + adjust;
+            }
+            v = v.constrain(1, 6);
+        }else{
+            if(Ext.isSafari){ // safari
+                adjust *= 2;
+            }
+            v = Math.max(1, v+adjust) + (Ext.isSafari ? 'px' : 0);
+        }
+        this.execCmd('FontSize', v);
+    },
+
+    // private
+    onEditorEvent : function(e){
+        this.updateToolbar();
+    },
+
+
+    /**
+     * Protected method that will not generally be called directly. It triggers
+     * a toolbar update by reading the markup state of the current selection in the editor.
+     */
+    updateToolbar: function(){
+
+        if(this.readOnly){
+            return;
+        }
+
+        if(!this.activated){
+            this.onFirstFocus();
+            return;
+        }
+
+        var btns = this.tb.items.map,
+            doc = this.getDoc();
+
+        if(this.enableFont && !Ext.isSafari2){
+            var name = (doc.queryCommandValue('FontName')||this.defaultFont).toLowerCase();
+            if(name != this.fontSelect.dom.value){
+                this.fontSelect.dom.value = name;
+            }
+        }
+        if(this.enableFormat){
+            btns.bold.toggle(doc.queryCommandState('bold'));
+            btns.italic.toggle(doc.queryCommandState('italic'));
+            btns.underline.toggle(doc.queryCommandState('underline'));
+        }
+        if(this.enableAlignments){
+            btns.justifyleft.toggle(doc.queryCommandState('justifyleft'));
+            btns.justifycenter.toggle(doc.queryCommandState('justifycenter'));
+            btns.justifyright.toggle(doc.queryCommandState('justifyright'));
+        }
+        if(!Ext.isSafari2 && this.enableLists){
+            btns.insertorderedlist.toggle(doc.queryCommandState('insertorderedlist'));
+            btns.insertunorderedlist.toggle(doc.queryCommandState('insertunorderedlist'));
+        }
+
+        Ext.menu.MenuMgr.hideAll();
+
+        this.syncValue();
+    },
+
+    // private
+    relayBtnCmd : function(btn){
+        this.relayCmd(btn.getItemId());
+    },
+
+    /**
+     * Executes a Midas editor command on the editor document and performs necessary focus and
+     * toolbar updates. <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    relayCmd : function(cmd, value){
+        (function(){
+            this.focus();
+            this.execCmd(cmd, value);
+            this.updateToolbar();
+        }).defer(10, this);
+    },
+
+    /**
+     * Executes a Midas editor command directly on the editor document.
+     * For visual commands, you should use {@link #relayCmd} instead.
+     * <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    execCmd : function(cmd, value){
+        var doc = this.getDoc();
+        doc.execCommand(cmd, false, value === undefined ? null : value);
+        this.syncValue();
+    },
+
+    // private
+    applyCommand : function(e){
+        if(e.ctrlKey){
+            var c = e.getCharCode(), cmd;
+            if(c > 0){
+                c = String.fromCharCode(c);
+                switch(c){
+                    case 'b':
+                        cmd = 'bold';
+                    break;
+                    case 'i':
+                        cmd = 'italic';
+                    break;
+                    case 'u':
+                        cmd = 'underline';
+                    break;
+                }
+                if(cmd){
+                    this.win.focus();
+                    this.execCmd(cmd);
+                    this.deferFocus();
+                    e.preventDefault();
+                }
+            }
+        }
+    },
+
+    /**
+     * Inserts the passed text at the current cursor position. Note: the editor must be initialized and activated
+     * to insert text.
+     * @param {String} text
+     */
+    insertAtCursor : function(text){
+        if(!this.activated){
+            return;
+        }
+        if(Ext.isIE){
+            this.win.focus();
+            var doc = this.getDoc(),
+                r = doc.selection.createRange();
+            if(r){
+                r.pasteHTML(text);
+                this.syncValue();
+                this.deferFocus();
+            }
+        }else{
+            this.win.focus();
+            this.execCmd('InsertHTML', text);
+            this.deferFocus();
+        }
+    },
+
+    // private
+    fixKeys : function(){ // load time branching for fastest keydown performance
+        if(Ext.isIE){
+            return function(e){
+                var k = e.getKey(),
+                    doc = this.getDoc(),
+                        r;
+                if(k == e.TAB){
+                    e.stopEvent();
+                    r = doc.selection.createRange();
+                    if(r){
+                        r.collapse(true);
+                        r.pasteHTML('&nbsp;&nbsp;&nbsp;&nbsp;');
+                        this.deferFocus();
+                    }
+                }else if(k == e.ENTER){
+                    r = doc.selection.createRange();
+                    if(r){
+                        var target = r.parentElement();
+                        if(!target || target.tagName.toLowerCase() != 'li'){
+                            e.stopEvent();
+                            r.pasteHTML('<br />');
+                            r.collapse(false);
+                            r.select();
+                        }
+                    }
+                }
+            };
+        }else if(Ext.isOpera){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.win.focus();
+                    this.execCmd('InsertHTML','&nbsp;&nbsp;&nbsp;&nbsp;');
+                    this.deferFocus();
+                }
+            };
+        }else if(Ext.isWebKit){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.execCmd('InsertText','\t');
+                    this.deferFocus();
+                }else if(k == e.ENTER){
+                    e.stopEvent();
+                    this.execCmd('InsertHtml','<br /><br />');
+                    this.deferFocus();
+                }
+             };
+        }
+    }(),
+
+    /**
+     * Returns the editor's toolbar. <b>This is only available after the editor has been rendered.</b>
+     * @return {Ext.Toolbar}
+     */
+    getToolbar : function(){
+        return this.tb;
+    },
+
+    /**
+     * Object collection of toolbar tooltips for the buttons in the editor. The key
+     * is the command id associated with that button and the value is a valid QuickTips object.
+     * For example:
+<pre><code>
+{
+    bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+    },
+    italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+    },
+    ...
+</code></pre>
+    * @type Object
+     */
+    buttonTips : {
+        bold : {
+            title: 'Bold (Ctrl+B)',
+            text: 'Make the selected text bold.',
+            cls: 'x-html-editor-tip'
+        },
+        italic : {
+            title: 'Italic (Ctrl+I)',
+            text: 'Make the selected text italic.',
+            cls: 'x-html-editor-tip'
+        },
+        underline : {
+            title: 'Underline (Ctrl+U)',
+            text: 'Underline the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        increasefontsize : {
+            title: 'Grow Text',
+            text: 'Increase the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        decreasefontsize : {
+            title: 'Shrink Text',
+            text: 'Decrease the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        backcolor : {
+            title: 'Text Highlight Color',
+            text: 'Change the background color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        forecolor : {
+            title: 'Font Color',
+            text: 'Change the color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyleft : {
+            title: 'Align Text Left',
+            text: 'Align text to the left.',
+            cls: 'x-html-editor-tip'
+        },
+        justifycenter : {
+            title: 'Center Text',
+            text: 'Center text in the editor.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyright : {
+            title: 'Align Text Right',
+            text: 'Align text to the right.',
+            cls: 'x-html-editor-tip'
+        },
+        insertunorderedlist : {
+            title: 'Bullet List',
+            text: 'Start a bulleted list.',
+            cls: 'x-html-editor-tip'
+        },
+        insertorderedlist : {
+            title: 'Numbered List',
+            text: 'Start a numbered list.',
+            cls: 'x-html-editor-tip'
+        },
+        createlink : {
+            title: 'Hyperlink',
+            text: 'Make the selected text a hyperlink.',
+            cls: 'x-html-editor-tip'
+        },
+        sourceedit : {
+            title: 'Source Edit',
+            text: 'Switch to source editing mode.',
+            cls: 'x-html-editor-tip'
+        }
+    }
+
+    // hide stuff that is not compatible
+    /**
+     * @event blur
+     * @hide
+     */
+    /**
+     * @event change
+     * @hide
+     */
+    /**
+     * @event focus
+     * @hide
+     */
+    /**
+     * @event specialkey
+     * @hide
+     */
+    /**
+     * @cfg {String} fieldClass @hide
+     */
+    /**
+     * @cfg {String} focusClass @hide
+     */
+    /**
+     * @cfg {String} autoCreate @hide
+     */
+    /**
+     * @cfg {String} inputType @hide
+     */
+    /**
+     * @cfg {String} invalidClass @hide
+     */
+    /**
+     * @cfg {String} invalidText @hide
+     */
+    /**
+     * @cfg {String} msgFx @hide
+     */
+    /**
+     * @cfg {String} validateOnBlur @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} applyTo @hide
+     */
+    /**
+     * @cfg {String} autoHeight  @hide
+     */
+    /**
+     * @cfg {String} autoWidth  @hide
+     */
+    /**
+     * @cfg {String} cls  @hide
+     */
+    /**
+     * @cfg {String} disabled  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} msgTarget  @hide
+     */
+    /**
+     * @cfg {String} readOnly  @hide
+     */
+    /**
+     * @cfg {String} style  @hide
+     */
+    /**
+     * @cfg {String} validationDelay  @hide
+     */
+    /**
+     * @cfg {String} validationEvent  @hide
+     */
+    /**
+     * @cfg {String} tabIndex  @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method validate
+     * @hide
+     */
+    /**
+     * @event valid
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+    /**
+     * @cfg keys
+     * @hide
+     */
+});
+Ext.reg('htmleditor', Ext.form.HtmlEditor);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextArea.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextArea.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextArea.js	(revision 76)
@@ -0,0 +1,120 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.TextArea
+ * @extends Ext.form.TextField
+ * Multiline text field.  Can be used as a direct replacement for traditional textarea fields, plus adds
+ * support for auto-sizing.
+ * @constructor
+ * Creates a new TextArea
+ * @param {Object} config Configuration options
+ * @xtype textarea
+ */
+Ext.form.TextArea = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {Number} growMin The minimum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>60</tt>)
+     */
+    growMin : 60,
+    /**
+     * @cfg {Number} growMax The maximum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>1000</tt>)
+     */
+    growMax: 1000,
+    growAppend : '&#160;\n&#160;',
+
+    enterIsSpecial : false,
+
+    /**
+     * @cfg {Boolean} preventScrollbars <tt>true</tt> to prevent scrollbars from appearing regardless of how much text is
+     * in the field. This option is only relevant when {@link #grow} is <tt>true</tt>. Equivalent to setting overflow: hidden, defaults to 
+     * <tt>false</tt>.
+     */
+    preventScrollbars: false,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "textarea", style: "width:100px;height:60px;", autocomplete: "off"}</code></pre>
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.defaultAutoCreate = {
+                tag: "textarea",
+                style:"width:100px;height:60px;",
+                autocomplete: "off"
+            };
+        }
+        Ext.form.TextArea.superclass.onRender.call(this, ct, position);
+        if(this.grow){
+            this.textSizeEl = Ext.DomHelper.append(document.body, {
+                tag: "pre", cls: "x-form-grow-sizer"
+            });
+            if(this.preventScrollbars){
+                this.el.setStyle("overflow", "hidden");
+            }
+            this.el.setHeight(this.growMin);
+        }
+    },
+
+    onDestroy : function(){
+        Ext.removeNode(this.textSizeEl);
+        Ext.form.TextArea.superclass.onDestroy.call(this);
+    },
+
+    fireKey : function(e){
+        if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
+            this.fireEvent("specialkey", this, e);
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress() || e.getKey() == e.ENTER;
+    },
+    
+    // inherit docs
+    filterValidation: function(e) {            
+        if(!e.isNavKeyPress() || (!this.enterIsSpecial && e.keyCode == e.ENTER)){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the height of the text up to the maximum field height allowed.
+     * This only takes effect if grow = true, and fires the {@link #autosize} event if the height changes.
+     */
+    autoSize: function(){
+        if(!this.grow || !this.textSizeEl){
+            return;
+        }
+        var el = this.el,
+            v = Ext.util.Format.htmlEncode(el.dom.value),
+            ts = this.textSizeEl,
+            h;
+            
+        Ext.fly(ts).setWidth(this.el.getWidth());
+        if(v.length < 1){
+            v = "&#160;&#160;";
+        }else{
+            v += this.growAppend;
+            if(Ext.isIE){
+                v = v.replace(/\n/g, '&#160;<br />');
+            }
+        }
+        ts.innerHTML = v;
+        h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin));
+        if(h != this.lastHeight){
+            this.lastHeight = h;
+            this.el.setHeight(h);
+            this.fireEvent("autosize", this, h);
+        }
+    }
+});
+Ext.reg('textarea', Ext.form.TextArea);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Action.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Action.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Action.js	(revision 76)
@@ -0,0 +1,786 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Action
+ * <p>The subclasses of this class provide actions to perform upon {@link Ext.form.BasicForm Form}s.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * the Form needs to perform an action such as submit or load. The Configuration options
+ * listed for this class are set through the Form's action methods: {@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}</p>
+ * <p>The instance of Action which performed the action is passed to the success
+ * and failure callbacks of the Form's action methods ({@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}),
+ * and to the {@link Ext.form.BasicForm#actioncomplete actioncomplete} and
+ * {@link Ext.form.BasicForm#actionfailed actionfailed} event handlers.</p>
+ */
+Ext.form.Action = function(form, options){
+    this.form = form;
+    this.options = options || {};
+};
+
+/**
+ * Failure type returned when client side validation of the Form fails
+ * thus aborting a submit action. Client side validation is performed unless
+ * {@link #clientValidation} is explicitly set to <tt>false</tt>.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CLIENT_INVALID = 'client';
+/**
+ * <p>Failure type returned when server side processing fails and the {@link #result}'s
+ * <tt style="font-weight:bold">success</tt> property is set to <tt>false</tt>.</p>
+ * <p>In the case of a form submission, field-specific error messages may be returned in the
+ * {@link #result}'s <tt style="font-weight:bold">errors</tt> property.</p>
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.SERVER_INVALID = 'server';
+/**
+ * Failure type returned when a communication error happens when attempting
+ * to send a request to the remote server. The {@link #response} may be examined to
+ * provide further information.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CONNECT_FAILURE = 'connect';
+/**
+ * Failure type returned when the response's <tt style="font-weight:bold">success</tt>
+ * property is set to <tt>false</tt>, or no field values are returned in the response's
+ * <tt style="font-weight:bold">data</tt> property.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.LOAD_FAILURE = 'load';
+
+Ext.form.Action.prototype = {
+/**
+ * @cfg {String} url The URL that the Action is to invoke.
+ */
+/**
+ * @cfg {Boolean} reset When set to <tt><b>true</b></tt>, causes the Form to be
+ * {@link Ext.form.BasicForm.reset reset} on Action success. If specified, this happens
+ * <b>before</b> the {@link #success} callback is called and before the Form's
+ * {@link Ext.form.BasicForm.actioncomplete actioncomplete} event fires.
+ */
+/**
+ * @cfg {String} method The HTTP method to use to access the requested URL. Defaults to the
+ * {@link Ext.form.BasicForm}'s method, or if that is not specified, the underlying DOM form's method.
+ */
+/**
+ * @cfg {Mixed} params <p>Extra parameter values to pass. These are added to the Form's
+ * {@link Ext.form.BasicForm#baseParams} and passed to the specified URL along with the Form's
+ * input fields.</p>
+ * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+ */
+/**
+ * @cfg {Number} timeout The number of seconds to wait for a server response before
+ * failing with the {@link #failureType} as {@link #Action.CONNECT_FAILURE}. If not specified,
+ * defaults to the configured <tt>{@link Ext.form.BasicForm#timeout timeout}</tt> of the
+ * {@link Ext.form.BasicForm form}.
+ */
+/**
+ * @cfg {Function} success The function to call when a valid success return packet is recieved.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Function} failure The function to call when a failure packet was recieved, or when an
+ * error ocurred in the Ajax communication.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. If an Ajax
+ * error ocurred, the failure type will be in {@link #failureType}. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Object} scope The scope in which to call the callback functions (The <tt>this</tt> reference
+ * for the callback functions).
+ */
+/**
+ * @cfg {String} waitMsg The message to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+/**
+ * @cfg {String} waitTitle The title to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+
+/**
+ * @cfg {Boolean} submitEmptyText If set to <tt>true</tt>, the emptyText value will be sent with the form
+ * when it is submitted.  Defaults to <tt>true</tt>.
+ */
+
+/**
+ * The type of action this Action instance performs.
+ * Currently only "submit" and "load" are supported.
+ * @type {String}
+ */
+    type : 'default',
+/**
+ * The type of failure detected will be one of these: {@link #CLIENT_INVALID},
+ * {@link #SERVER_INVALID}, {@link #CONNECT_FAILURE}, or {@link #LOAD_FAILURE}.  Usage:
+ * <pre><code>
+var fp = new Ext.form.FormPanel({
+...
+buttons: [{
+    text: 'Save',
+    formBind: true,
+    handler: function(){
+        if(fp.getForm().isValid()){
+            fp.getForm().submit({
+                url: 'form-submit.php',
+                waitMsg: 'Submitting your data...',
+                success: function(form, action){
+                    // server responded with success = true
+                    var result = action.{@link #result};
+                },
+                failure: function(form, action){
+                    if (action.{@link #failureType} === Ext.form.Action.{@link #CONNECT_FAILURE}) {
+                        Ext.Msg.alert('Error',
+                            'Status:'+action.{@link #response}.status+': '+
+                            action.{@link #response}.statusText);
+                    }
+                    if (action.failureType === Ext.form.Action.{@link #SERVER_INVALID}){
+                        // server responded with success = false
+                        Ext.Msg.alert('Invalid', action.{@link #result}.errormsg);
+                    }
+                }
+            });
+        }
+    }
+},{
+    text: 'Reset',
+    handler: function(){
+        fp.getForm().reset();
+    }
+}]
+ * </code></pre>
+ * @property failureType
+ * @type {String}
+ */
+ /**
+ * The XMLHttpRequest object used to perform the action.
+ * @property response
+ * @type {Object}
+ */
+ /**
+ * The decoded response object containing a boolean <tt style="font-weight:bold">success</tt> property and
+ * other, action-specific properties.
+ * @property result
+ * @type {Object}
+ */
+
+    // interface method
+    run : function(options){
+
+    },
+
+    // interface method
+    success : function(response){
+
+    },
+
+    // interface method
+    handleResponse : function(response){
+
+    },
+
+    // default connection failure
+    failure : function(response){
+        this.response = response;
+        this.failureType = Ext.form.Action.CONNECT_FAILURE;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    // shared code among all Actions to validate that there was a response
+    // with either responseText or responseXml
+    processResponse : function(response){
+        this.response = response;
+        if(!response.responseText && !response.responseXML){
+            return true;
+        }
+        this.result = this.handleResponse(response);
+        return this.result;
+    },
+    
+    decodeResponse: function(response) {
+        try {
+            return Ext.decode(response.responseText);
+        } catch(e) {
+            return false;
+        } 
+    },
+
+    // utility functions used internally
+    getUrl : function(appendParams){
+        var url = this.options.url || this.form.url || this.form.el.dom.action;
+        if(appendParams){
+            var p = this.getParams();
+            if(p){
+                url = Ext.urlAppend(url, p);
+            }
+        }
+        return url;
+    },
+
+    // private
+    getMethod : function(){
+        return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();
+    },
+
+    // private
+    getParams : function(){
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        if(p){
+            if(typeof p == "object"){
+                p = Ext.urlEncode(Ext.applyIf(p, bp));
+            }else if(typeof p == 'string' && bp){
+                p += '&' + Ext.urlEncode(bp);
+            }
+        }else if(bp){
+            p = Ext.urlEncode(bp);
+        }
+        return p;
+    },
+
+    // private
+    createCallback : function(opts){
+        var opts = opts || {};
+        return {
+            success: this.success,
+            failure: this.failure,
+            scope: this,
+            timeout: (opts.timeout*1000) || (this.form.timeout*1000),
+            upload: this.form.fileUpload ? this.success : undefined
+        };
+    }
+};
+
+/**
+ * @class Ext.form.Action.Submit
+ * @extends Ext.form.Action
+ * <p>A class which handles submission of data from {@link Ext.form.BasicForm Form}s
+ * and processes the returned response.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#submit submit}ting.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet may contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean
+ * <div class="sub-desc">The <code>success</code> property is required.</div></li>
+ * <li><b><code>errors</code></b> property : Object
+ * <div class="sub-desc"><div class="sub-desc">The <code>errors</code> property,
+ * which is optional, contains error messages for invalid fields.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so a typical response
+ * packet may look like this:</p><pre><code>
+{
+    success: false,
+    errors: {
+        clientCode: "Client not found",
+        portOfLoading: "This field must not be null"
+    }
+}</code></pre>
+ * <p>Other data may be placed into the response for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ * <p>Alternatively, if an {@link #errorReader} is specified as an {@link Ext.data.XmlReader XmlReader}:</p><pre><code>
+    errorReader: new Ext.data.XmlReader({
+            record : 'field',
+            success: '@success'
+        }, [
+            'id', 'msg'
+        ]
+    )
+</code></pre>
+ * <p>then the results may be sent back in XML format:</p><pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;message success="false"&gt;
+&lt;errors&gt;
+    &lt;field&gt;
+        &lt;id&gt;clientCode&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Code not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+    &lt;field&gt;
+        &lt;id&gt;portOfLoading&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Port not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+&lt;/errors&gt;
+&lt;/message&gt;
+</code></pre>
+ * <p>Other elements may be placed into the response XML for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The XML document is available in the {@link #errorReader}'s {@link Ext.data.XmlReader#xmlData xmlData} property.</p>
+ */
+Ext.form.Action.Submit = function(form, options){
+    Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
+};
+
+Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
+    /**
+     * @cfg {Ext.data.DataReader} errorReader <p><b>Optional. JSON is interpreted with
+     * no need for an errorReader.</b></p>
+     * <p>A Reader which reads a single record from the returned data. The DataReader's
+     * <b>success</b> property specifies how submission success is determined. The Record's
+     * data provides the error messages to apply to any invalid form Fields.</p>
+     */
+    /**
+     * @cfg {boolean} clientValidation Determines whether a Form's fields are validated
+     * in a final call to {@link Ext.form.BasicForm#isValid isValid} prior to submission.
+     * Pass <tt>false</tt> in the Form's submit options to prevent this. If not defined, pre-submission field validation
+     * is performed.
+     */
+    type : 'submit',
+
+    // private
+    run : function(){
+        var o = this.options,
+            method = this.getMethod(),
+            isGet = method == 'GET';
+        if(o.clientValidation === false || this.form.isValid()){
+            if (o.submitEmptyText === false) {
+                var fields = this.form.items,
+                    emptyFields = [],
+                    setupEmptyFields = function(f){
+                        if (f.el.getValue() == f.emptyText) {
+                            emptyFields.push(f);
+                            f.el.dom.value = "";
+                        }
+                        if(f.isComposite && f.rendered){
+                            f.items.each(setupEmptyFields);
+                        }
+                    };
+                    
+                fields.each(setupEmptyFields);
+            }
+            Ext.Ajax.request(Ext.apply(this.createCallback(o), {
+                form:this.form.el.dom,
+                url:this.getUrl(isGet),
+                method: method,
+                headers: o.headers,
+                params:!isGet ? this.getParams() : null,
+                isUpload: this.form.fileUpload
+            }));
+            if (o.submitEmptyText === false) {
+                Ext.each(emptyFields, function(f) {
+                    if (f.applyEmptyText) {
+                        f.applyEmptyText();
+                    }
+                });
+            }
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || result.success){
+            this.form.afterAction(this, true);
+            return;
+        }
+        if(result.errors){
+            this.form.markInvalid(result.errors);
+        }
+        this.failureType = Ext.form.Action.SERVER_INVALID;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.errorReader){
+            var rs = this.form.errorReader.read(response);
+            var errors = [];
+            if(rs.records){
+                for(var i = 0, len = rs.records.length; i < len; i++) {
+                    var r = rs.records[i];
+                    errors[i] = r.data;
+                }
+            }
+            if(errors.length < 1){
+                errors = null;
+            }
+            return {
+                success : rs.success,
+                errors : errors
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+/**
+ * @class Ext.form.Action.Load
+ * @extends Ext.form.Action
+ * <p>A class which handles loading of data from a server into the Fields of an {@link Ext.form.BasicForm}.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#load load}ing.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet <b>must</b> contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean</li>
+ * <li><b><code>data</code></b> property : Object</li>
+ * <div class="sub-desc">The <code>data</code> property contains the values of Fields to load.
+ * The individual value object for each Field is passed to the Field's
+ * {@link Ext.form.Field#setValue setValue} method.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so for the following form load call:<pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    title: 'Client and routing info',
+    items: [{
+        fieldLabel: 'Client',
+        name: 'clientName'
+    }, {
+        fieldLabel: 'Port of loading',
+        name: 'portOfLoading'
+    }, {
+        fieldLabel: 'Port of discharge',
+        name: 'portOfDischarge'
+    }]
+});
+myFormPanel.{@link Ext.form.FormPanel#getForm getForm}().{@link Ext.form.BasicForm#load load}({
+    url: '/getRoutingInfo.php',
+    params: {
+        consignmentRef: myConsignmentRef
+    },
+    failure: function(form, action) {
+        Ext.Msg.alert("Load failed", action.result.errorMessage);
+    }
+});
+</code></pre>
+ * a <b>success response</b> packet may look like this:</p><pre><code>
+{
+    success: true,
+    data: {
+        clientName: "Fred. Olsen Lines",
+        portOfLoading: "FXT",
+        portOfDischarge: "OSL"
+    }
+}</code></pre>
+ * while a <b>failure response</b> packet may look like this:</p><pre><code>
+{
+    success: false,
+    errorMessage: "Consignment reference not found"
+}</code></pre>
+ * <p>Other data may be placed into the response for processing the {@link Ext.form.BasicForm Form}'s
+ * callback or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ */
+Ext.form.Action.Load = function(form, options){
+    Ext.form.Action.Load.superclass.constructor.call(this, form, options);
+    this.reader = this.form.reader;
+};
+
+Ext.extend(Ext.form.Action.Load, Ext.form.Action, {
+    // private
+    type : 'load',
+
+    // private
+    run : function(){
+        Ext.Ajax.request(Ext.apply(
+                this.createCallback(this.options), {
+                    method:this.getMethod(),
+                    url:this.getUrl(false),
+                    headers: this.options.headers,
+                    params:this.getParams()
+        }));
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || !result.success || !result.data){
+            this.failureType = Ext.form.Action.LOAD_FAILURE;
+            this.form.afterAction(this, false);
+            return;
+        }
+        this.form.clearInvalid();
+        this.form.setValues(result.data);
+        this.form.afterAction(this, true);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.reader){
+            var rs = this.form.reader.read(response);
+            var data = rs.records && rs.records[0] ? rs.records[0].data : null;
+            return {
+                success : rs.success,
+                data : data
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+
+/**
+ * @class Ext.form.Action.DirectLoad
+ * @extends Ext.form.Action.Load
+ * <p>Provides Ext.direct support for loading form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>load</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+
+// load the form
+myFormPanel.getForm().load({
+    // pass 2 arguments to server side getBasicInfo method (len=2)
+    params: {
+        foo: 'bar',
+        uid: 34
+    }
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "data":[34,"bar"] // note the order of the params
+    }
+]
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following format:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "result":{
+            "success":true,
+            "data":{
+                "name":"Fred Flintstone",
+                "company":"Slate Rock and Gravel",
+                "email":"fred.flintstone@slaterg.com"
+            }
+        }
+    }
+]
+ * </code></pre>
+ */
+Ext.form.Action.DirectLoad = Ext.extend(Ext.form.Action.Load, {
+    constructor: function(form, opts) {
+        Ext.form.Action.DirectLoad.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directload',
+
+    run : function(){
+        var args = this.getParams();
+        args.push(this.success, this);
+        this.form.api.load.apply(window, args);
+    },
+
+    getParams : function() {
+        var buf = [], o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        var paramOrder = this.form.paramOrder;
+        if(paramOrder){
+            for(var i = 0, len = paramOrder.length; i < len; i++){
+                buf.push(o[paramOrder[i]]);
+            }
+        }else if(this.form.paramsAsHash){
+            buf.push(o);
+        }
+        return buf;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectLoad.superclass.success.call(this, response);
+    }
+});
+
+/**
+ * @class Ext.form.Action.DirectSubmit
+ * @extends Ext.form.Action.Submit
+ * <p>Provides Ext.direct support for submitting form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>submit</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+    buttons:[{
+        text: 'Submit',
+        handler: function(){
+            myFormPanel.getForm().submit({
+                params: {
+                    foo: 'bar',
+                    uid: 34
+                }
+            });
+        }
+    }],
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+{
+    "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+    "result":{
+        "success":true,
+        "id":{
+            "extAction":"Profile","extMethod":"updateBasicInfo",
+            "extType":"rpc","extTID":"6","extUpload":"false",
+            "name":"Aaron Conran","email":"aaron@extjs.com","company":"Ext JS, LLC"
+        }
+    }
+}
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following:
+ * <pre><code>
+// sample success packet (batched requests)
+[
+    {
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
+        "result":{
+            "success":true
+        }
+    }
+]
+
+// sample failure packet (one request)
+{
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+        "result":{
+            "errors":{
+                "email":"already taken"
+            },
+            "success":false,
+            "foo":"bar"
+        }
+}
+ * </code></pre>
+ * Also see the discussion in {@link Ext.form.Action.DirectLoad}.
+ */
+Ext.form.Action.DirectSubmit = Ext.extend(Ext.form.Action.Submit, {
+    constructor : function(form, opts) {
+        Ext.form.Action.DirectSubmit.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directsubmit',
+    // override of Submit
+    run : function(){
+        var o = this.options;
+        if(o.clientValidation === false || this.form.isValid()){
+            // tag on any additional params to be posted in the
+            // form scope
+            this.success.params = this.getParams();
+            this.form.api.submit(this.form.el.dom, this.success, this);
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    getParams : function() {
+        var o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        return o;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectSubmit.superclass.success.call(this, response);
+    }
+});
+
+Ext.form.Action.ACTION_TYPES = {
+    'load' : Ext.form.Action.Load,
+    'submit' : Ext.form.Action.Submit,
+    'directload' : Ext.form.Action.DirectLoad,
+    'directsubmit' : Ext.form.Action.DirectSubmit
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Label.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Label.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Label.js	(revision 76)
@@ -0,0 +1,64 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Label
+ * @extends Ext.BoxComponent
+ * Basic Label field.
+ * @constructor
+ * Creates a new Label
+ * @param {Ext.Element/String/Object} config The configuration options.  If an element is passed, it is set as the internal
+ * element and its id used as the component id.  If a string is passed, it is assumed to be the id of an existing element
+ * and is used as the component id.  Otherwise, it is assumed to be a standard config object and is applied to the component.
+ * @xtype label
+ */
+Ext.form.Label = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} text The plain text to display within the label (defaults to ''). If you need to include HTML
+     * tags within the label's innerHTML, use the {@link #html} config instead.
+     */
+    /**
+     * @cfg {String} forId The id of the input element to which this label will be bound via the standard HTML 'for'
+     * attribute. If not specified, the attribute will not be added to the label.
+     */
+    /**
+     * @cfg {String} html An HTML fragment that will be used as the label's innerHTML (defaults to '').
+     * Note that if {@link #text} is specified it will take precedence and this value will be ignored.
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('label');
+            this.el.id = this.getId();
+            this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');
+            if(this.forId){
+                this.el.setAttribute('for', this.forId);
+            }
+        }
+        Ext.form.Label.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates the label's innerHTML with the specified string.
+     * @param {String} text The new label text
+     * @param {Boolean} encode (optional) False to skip HTML-encoding the text when rendering it
+     * to the label (defaults to true which encodes the value). This might be useful if you want to include
+     * tags in the label's innerHTML rather than rendering them as string literals per the default logic.
+     * @return {Label} this
+     */
+    setText : function(t, encode){
+        var e = encode === false;
+        this[!e ? 'text' : 'html'] = t;
+        delete this[e ? 'text' : 'html'];
+        if(this.rendered){
+            this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;
+        }
+        return this;
+    }
+});
+
+Ext.reg('label', Ext.form.Label);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DateField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DateField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/DateField.js	(revision 76)
@@ -0,0 +1,446 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.DateField
+ * @extends Ext.form.TriggerField
+ * Provides a date input field with a {@link Ext.DatePicker} dropdown and automatic date validation.
+ * @constructor
+ * Create a new DateField
+ * @param {Object} config
+ * @xtype datefield
+ */
+Ext.form.DateField = Ext.extend(Ext.form.TriggerField,  {
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : "m/d/Y",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "<tt>|</tt>" to try when parsing a user input value and it
+     * does not match the defined format (defaults to
+     * <tt>'m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j'</tt>).
+     */
+    altFormats : "m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDaysText : "Disabled",
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDatesText : "Disabled",
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before <tt>{@link #minValue}</tt> (defaults to
+     * <tt>'The date in this field must be after {minValue}'</tt>).
+     */
+    minText : "The date in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the date in the cell is after <tt>{@link #maxValue}</tt> (defaults to
+     * <tt>'The date in this field must be before {maxValue}'</tt>).
+     */
+    maxText : "The date in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the date in the field is invalid (defaults to
+     * <tt>'{value} is not a valid date - it must be in the format {format}'</tt>).
+     */
+    invalidText : "{0} is not a valid date - it must be in the format {1}",
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-date-trigger'</tt> which displays a calendar icon).
+     */
+    triggerClass : 'x-form-date-trigger',
+    /**
+     * @cfg {Boolean} showToday
+     * <tt>false</tt> to hide the footer area of the DatePicker containing the Today button and disable
+     * the keyboard handler for spacebar that selects the current date (defaults to <tt>true</tt>).
+     */
+    showToday : true,
+    
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0 based (defaults to null). Some examples:<pre><code>
+// disable Sunday and Saturday:
+disabledDays:  [0, 6]
+// disable weekdays:
+disabledDays: [1,2,3,4,5]
+     * </code></pre>
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of "dates" to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:<pre><code>
+// disable these exact dates:
+disabledDates: ["03/08/2003", "09/16/2003"]
+// disable these days for every year:
+disabledDates: ["03/08", "09/16"]
+// only match the beginning (useful if you are using short years):
+disabledDates: ["^03/08"]
+// disable every day in March 2006:
+disabledDates: ["03/../2006"]
+// disable every day in every March:
+disabledDates: ["^03"]
+     * </code></pre>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a {@link #format date format} that has "." in
+     * it, you will have to escape the dot when restricting dates. For example: <tt>["03\\.08\\.03"]</tt>.
+     */
+    /**
+     * @cfg {String/Object} autoCreate
+     * A {@link Ext.DomHelper DomHelper element specification object}, or <tt>true</tt> for the default element
+     * specification object:<pre><code>
+     * autoCreate: {tag: "input", type: "text", size: "10", autocomplete: "off"}
+     * </code></pre>
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "10", autocomplete: "off"},
+
+    // in the absence of a time value, a default value of 12 noon will be used
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initTime: '12', // 24 hour format
+
+    initTimeFormat: 'H',
+
+    // PUBLIC -- to be documented
+    safeParse : function(value, format) {
+        if (Date.formatContainsHourInfo(format)) {
+            // if parse format contains hour information, no DST adjustment is necessary
+            return Date.parseDate(value, format);
+        } else {
+            // set time to 12 noon, then clear the time
+            var parsedDate = Date.parseDate(value + ' ' + this.initTime, format + ' ' + this.initTimeFormat);
+ 
+            if (parsedDate) {
+                return parsedDate.clearTime();
+            }
+        }
+    },
+
+    initComponent : function(){
+        Ext.form.DateField.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected via the date picker.
+             * @param {Ext.form.DateField} this
+             * @param {Date} date The date that was selected
+             */
+            'select'
+        );
+
+        if(Ext.isString(this.minValue)){
+            this.minValue = this.parseDate(this.minValue);
+        }
+        if(Ext.isString(this.maxValue)){
+            this.maxValue = this.parseDate(this.maxValue);
+        }
+        this.disabledDatesRE = null;
+        this.initDisabledDays();
+    },
+
+    initEvents: function() {
+        Ext.form.DateField.superclass.initEvents.call(this);
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "down": function(e) {
+                this.onTriggerClick();
+            },
+            scope: this,
+            forceKeyDown: true
+        });
+    },
+
+
+    // private
+    initDisabledDays : function(){
+        if(this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = "(?:";
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array} disabledDates An array of date strings (see the <tt>{@link #disabledDates}</tt> config
+     * for details on supported values) used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        this.disabledDates = dd;
+        this.initDisabledDays();
+        if(this.menu){
+            this.menu.picker.setDisabledDates(this.disabledDatesRE);
+        }
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the <tt>{@link #disabledDays}</tt>
+     * config for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        if(this.menu){
+            this.menu.picker.setDisabledDays(dd);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #minValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinValue : function(dt){
+        this.minValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMinDate(this.minValue);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #maxValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxValue : function(dt){
+        this.maxValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMaxDate(this.maxValue);
+        }
+    },
+
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validation checks are testing that the date format is valid, that the chosen
+     * date is within the min and max date constraints set, that the date chosen is not in the disabledDates
+     * regex and that the day chosed is not one of the disabledDays.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.DateField.superclass.getErrors.apply(this, arguments);
+
+        value = this.formatDate(value || this.processValue(this.getRawValue()));
+
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+
+        var svalue = value;
+        value = this.parseDate(value);
+        if (!value) {
+            errors.push(String.format(this.invalidText, svalue, this.format));
+            return errors;
+        }
+
+        var time = value.getTime();
+        if (this.minValue && time < this.minValue.clearTime().getTime()) {
+            errors.push(String.format(this.minText, this.formatDate(this.minValue)));
+        }
+
+        if (this.maxValue && time > this.maxValue.clearTime().getTime()) {
+            errors.push(String.format(this.maxText, this.formatDate(this.maxValue)));
+        }
+
+        if (this.disabledDays) {
+            var day = value.getDay();
+
+            for(var i = 0; i < this.disabledDays.length; i++) {
+                if (day === this.disabledDays[i]) {
+                    errors.push(this.disabledDaysText);
+                    break;
+                }
+            }
+        }
+
+        var fvalue = this.formatDate(value);
+        if (this.disabledDatesRE && this.disabledDatesRE.test(fvalue)) {
+            errors.push(String.format(this.disabledDatesText, fvalue));
+        }
+
+        return errors;
+    },
+
+    // private
+    // Provides logic to override the default TriggerField.validateBlur which just returns true
+    validateBlur : function(){
+        return !this.menu || !this.menu.isVisible();
+    },
+
+    /**
+     * Returns the current date value of the date field.
+     * @return {Date} The date value
+     */
+    getValue : function(){
+        return this.parseDate(Ext.form.DateField.superclass.getValue.call(this)) || "";
+    },
+
+    /**
+     * Sets the value of the date field.  You can pass a date object or any string that can be
+     * parsed into a valid date, using <tt>{@link #format}</tt> as the date format, according
+     * to the same rules as {@link Date#parseDate} (the default format used is <tt>"m/d/Y"</tt>).
+     * <br />Usage:
+     * <pre><code>
+//All of these calls set the same date value (May 4, 2006)
+
+//Pass a date object:
+var dt = new Date('5/4/2006');
+dateField.setValue(dt);
+
+//Pass a date string (default format):
+dateField.setValue('05/04/2006');
+
+//Pass a date string (custom format):
+dateField.format = 'Y-m-d';
+dateField.setValue('2006-05-04');
+</code></pre>
+     * @param {String/Date} date The date or valid date string
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(date){
+        return Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));
+    },
+
+    // private
+    parseDate : function(value) {
+        if(!value || Ext.isDate(value)){
+            return value;
+        }
+
+        var v = this.safeParse(value, this.format),
+            af = this.altFormats,
+            afa = this.altFormatsArray;
+
+        if (!v && af) {
+            afa = afa || af.split("|");
+
+            for (var i = 0, len = afa.length; i < len && !v; i++) {
+                v = this.safeParse(value, afa[i]);
+            }
+        }
+        return v;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.menu, this.keyNav);
+        Ext.form.DateField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    formatDate : function(date){
+        return Ext.isDate(date) ? date.dateFormat(this.format) : date;
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
+    onTriggerClick : function(){
+        if(this.disabled){
+            return;
+        }
+        if(this.menu == null){
+            this.menu = new Ext.menu.DateMenu({
+                hideOnClick: false,
+                focusOnSelect: false
+            });
+        }
+        this.onFocus();
+        Ext.apply(this.menu.picker,  {
+            minDate : this.minValue,
+            maxDate : this.maxValue,
+            disabledDatesRE : this.disabledDatesRE,
+            disabledDatesText : this.disabledDatesText,
+            disabledDays : this.disabledDays,
+            disabledDaysText : this.disabledDaysText,
+            format : this.format,
+            showToday : this.showToday,
+            startDay: this.startDay,
+            minText : String.format(this.minText, this.formatDate(this.minValue)),
+            maxText : String.format(this.maxText, this.formatDate(this.maxValue))
+        });
+        this.menu.picker.setValue(this.getValue() || new Date());
+        this.menu.show(this.el, "tl-bl?");
+        this.menuEvents('on');
+    },
+
+    //private
+    menuEvents: function(method){
+        this.menu[method]('select', this.onSelect, this);
+        this.menu[method]('hide', this.onMenuHide, this);
+        this.menu[method]('show', this.onFocus, this);
+    },
+
+    onSelect: function(m, d){
+        this.setValue(d);
+        this.fireEvent('select', this, d);
+        this.menu.hide();
+    },
+
+    onMenuHide: function(){
+        this.focus(false, 60);
+        this.menuEvents('un');
+    },
+
+    // private
+    beforeBlur : function(){
+        var v = this.parseDate(this.getRawValue());
+        if(v){
+            this.setValue(v);
+        }
+    }
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+    /**
+     * @hide
+     * @method autoSize
+     */
+});
+Ext.reg('datefield', Ext.form.DateField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Field.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Field.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Field.js	(revision 76)
@@ -0,0 +1,750 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Field
+ * @extends Ext.BoxComponent
+ * Base class for form fields that provides default event handling, sizing, value handling and other functionality.
+ * @constructor
+ * Creates a new Field
+ * @param {Object} config Configuration options
+ * @xtype field
+ */
+Ext.form.Field = Ext.extend(Ext.BoxComponent,  {
+    /**
+     * <p>The label Element associated with this Field. <b>Only available after this Field has been rendered by a
+     * {@link form Ext.layout.FormLayout} layout manager.</b></p>
+     * @type Ext.Element
+     * @property label
+     */
+    /**
+     * @cfg {String} inputType The type attribute for input fields -- e.g. radio, text, password, file (defaults
+     * to 'text'). The types 'file' and 'password' must be used to render those field types currently -- there are
+     * no separate Ext components for those. Note that if you use <tt>inputType:'file'</tt>, {@link #emptyText}
+     * is not supported and should be avoided.
+     */
+    /**
+     * @cfg {Number} tabIndex The tabIndex for this field. Note this only applies to fields that are rendered,
+     * not those which are built via applyTo (defaults to undefined).
+     */
+    /**
+     * @cfg {Mixed} value A value to initialize this field with (defaults to undefined).
+     */
+    /**
+     * @cfg {String} name The field's HTML name attribute (defaults to '').
+     * <b>Note</b>: this property must be set if this field is to be automatically included with
+     * {@link Ext.form.BasicForm#submit form submit()}.
+     */
+    /**
+     * @cfg {String} cls A custom CSS class to apply to the field's underlying element (defaults to '').
+     */
+
+    /**
+     * @cfg {String} invalidClass The CSS class to use when marking a field invalid (defaults to 'x-form-invalid')
+     */
+    invalidClass : 'x-form-invalid',
+    /**
+     * @cfg {String} invalidText The error text to use when marking a field invalid and no message is provided
+     * (defaults to 'The value in this field is invalid')
+     */
+    invalidText : 'The value in this field is invalid',
+    /**
+     * @cfg {String} focusClass The CSS class to use when the field receives focus (defaults to 'x-form-focus')
+     */
+    focusClass : 'x-form-focus',
+    /**
+     * @cfg {Boolean} preventMark
+     * <tt>true</tt> to disable {@link #markInvalid marking the field invalid}.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String/Boolean} validationEvent The event that should initiate field validation. Set to false to disable
+      automatic validation (defaults to 'keyup').
+     */
+    validationEvent : 'keyup',
+    /**
+     * @cfg {Boolean} validateOnBlur Whether the field should validate when it loses focus (defaults to true).
+     */
+    validateOnBlur : true,
+    /**
+     * @cfg {Number} validationDelay The length of time in milliseconds after user input begins until validation
+     * is initiated (defaults to 250)
+     */
+    validationDelay : 250,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: 'input', type: 'text', size: '20', autocomplete: 'off'}</code></pre>
+     */
+    defaultAutoCreate : {tag: 'input', type: 'text', size: '20', autocomplete: 'off'},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {String} msgTarget <p>The location where the message text set through {@link #markInvalid} should display.
+     * Must be one of the following values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>qtip</code> Display a quick tip containing the message when the user hovers over the field. This is the default.
+     * <div class="subdesc"><b>{@link Ext.QuickTips#init Ext.QuickTips.init} must have been called for this setting to work.</b></div</li>
+     * <li><code>title</code> Display the message in a default browser title attribute popup.</li>
+     * <li><code>under</code> Add a block div beneath the field containing the error message.</li>
+     * <li><code>side</code> Add an error icon to the right of the field, displaying the message in a popup on hover.</li>
+     * <li><code>[element id]</code> Add the error message directly to the innerHTML of the specified element.</li>
+     * </ul></div>
+     */
+    msgTarget : 'qtip',
+    /**
+     * @cfg {String} msgFx <b>Experimental</b> The effect used when displaying a validation message under the field
+     * (defaults to 'normal').
+     */
+    msgFx : 'normal',
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to mark the field as readOnly in HTML
+     * (defaults to <tt>false</tt>).
+     * <br><p><b>Note</b>: this only sets the element's readOnly DOM attribute.
+     * Setting <code>readOnly=true</code>, for example, will not disable triggering a
+     * ComboBox or DateField; it gives you the option of forcing the user to choose
+     * via the trigger without typing in the text box. To hide the trigger use
+     * <code>{@link Ext.form.TriggerField#hideTrigger hideTrigger}</code>.</p>
+     */
+    readOnly : false,
+    /**
+     * @cfg {Boolean} disabled True to disable the field (defaults to false).
+     * <p>Be aware that conformant with the <a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.12.1">HTML specification</a>,
+     * disabled Fields will not be {@link Ext.form.BasicForm#submit submitted}.</p>
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * Defaults to <tt>true</tt>.
+     */
+    submitValue: true,
+
+    // private
+    isFormField : true,
+
+    // private
+    msgDisplay: '',
+
+    // private
+    hasFocus : false,
+
+    // private
+    initComponent : function(){
+        Ext.form.Field.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event focus
+             * Fires when this field receives input focus.
+             * @param {Ext.form.Field} this
+             */
+            'focus',
+            /**
+             * @event blur
+             * Fires when this field loses input focus.
+             * @param {Ext.form.Field} this
+             */
+            'blur',
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.
+             * To handle other keys see {@link Ext.Panel#keys} or {@link Ext.KeyMap}.
+             * You can check {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * For example: <pre><code>
+var form = new Ext.form.FormPanel({
+    ...
+    items: [{
+            fieldLabel: 'Field 1',
+            name: 'field1',
+            allowBlank: false
+        },{
+            fieldLabel: 'Field 2',
+            name: 'field2',
+            listeners: {
+                specialkey: function(field, e){
+                    // e.HOME, e.END, e.PAGE_UP, e.PAGE_DOWN,
+                    // e.TAB, e.ESC, arrow keys: e.LEFT, e.RIGHT, e.UP, e.DOWN
+                    if (e.{@link Ext.EventObject#getKey getKey()} == e.ENTER) {
+                        var form = field.ownerCt.getForm();
+                        form.submit();
+                    }
+                }
+            }
+        }
+    ],
+    ...
+});
+             * </code></pre>
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            'specialkey',
+            /**
+             * @event change
+             * Fires just before the field blurs if the field value has changed.
+             * @param {Ext.form.Field} this
+             * @param {Mixed} newValue The new value
+             * @param {Mixed} oldValue The original value
+             */
+            'change',
+            /**
+             * @event invalid
+             * Fires after the field has been marked as invalid.
+             * @param {Ext.form.Field} this
+             * @param {String} msg The validation message
+             */
+            'invalid',
+            /**
+             * @event valid
+             * Fires after the field has been validated with no errors.
+             * @param {Ext.form.Field} this
+             */
+            'valid'
+        );
+    },
+
+    /**
+     * Returns the {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     * attribute of the field if available.
+     * @return {String} name The field {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     */
+    getName : function(){
+        return this.rendered && this.el.dom.name ? this.el.dom.name : this.name || this.id || '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var cfg = this.getAutoCreate();
+
+            if(!cfg.name){
+                cfg.name = this.name || this.id;
+            }
+            if(this.inputType){
+                cfg.type = this.inputType;
+            }
+            this.autoEl = cfg;
+        }
+        Ext.form.Field.superclass.onRender.call(this, ct, position);
+        if(this.submitValue === false){
+            this.el.dom.removeAttribute('name');
+        }
+        var type = this.el.dom.type;
+        if(type){
+            if(type == 'password'){
+                type = 'text';
+            }
+            this.el.addClass('x-form-'+type);
+        }
+        if(this.readOnly){
+            this.setReadOnly(true);
+        }
+        if(this.tabIndex !== undefined){
+            this.el.dom.setAttribute('tabIndex', this.tabIndex);
+        }
+
+        this.el.addClass([this.fieldClass, this.cls]);
+    },
+
+    // private
+    getItemCt : function(){
+        return this.itemCt;
+    },
+
+    // private
+    initValue : function(){
+        if(this.value !== undefined){
+            this.setValue(this.value);
+        }else if(!Ext.isEmpty(this.el.dom.value) && this.el.dom.value != this.emptyText){
+            this.setValue(this.el.dom.value);
+        }
+        /**
+         * The original value of the field as configured in the {@link #value} configuration, or
+         * as loaded by the last form load operation if the form's {@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+         * setting is <code>true</code>.
+         * @type mixed
+         * @property originalValue
+         */
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * <p>Returns true if the value of this Field has been changed from its original value.
+     * Will return false if the field is disabled or has not been rendered yet.</p>
+     * <p>Note that if the owning {@link Ext.form.BasicForm form} was configured with
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     * then the <i>original value</i> is updated when the values are loaded by
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#setValues setValues}.</p>
+     * @return {Boolean} True if this field has been changed from its original value (and
+     * is not disabled), false otherwise.
+     */
+    isDirty : function() {
+        if(this.disabled || !this.rendered) {
+            return false;
+        }
+        return String(this.getValue()) !== String(this.originalValue);
+    },
+
+    /**
+     * Sets the read only state of this field.
+     * @param {Boolean} readOnly Whether the field should be read only.
+     */
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.el.dom.readOnly = readOnly;
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.form.Field.superclass.afterRender.call(this);
+        this.initEvents();
+        this.initValue();
+    },
+
+    // private
+    fireKey : function(e){
+        if(e.isSpecialKey()){
+            this.fireEvent('specialkey', this, e);
+        }
+    },
+
+    /**
+     * Resets the current field value to the originally loaded value and clears any validation messages.
+     * See {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     */
+    reset : function(){
+        this.setValue(this.originalValue);
+        this.clearInvalid();
+    },
+
+    // private
+    initEvents : function(){
+        this.mon(this.el, Ext.EventManager.getKeyEvent(), this.fireKey,  this);
+        this.mon(this.el, 'focus', this.onFocus, this);
+
+        // standardise buffer across all browsers + OS-es for consistent event order.
+        // (the 10ms buffer for Editors fixes a weird FF/Win editor issue when changing OS window focus)
+        this.mon(this.el, 'blur', this.onBlur, this, this.inEditor ? {buffer:10} : null);
+    },
+
+    // private
+    preFocus: Ext.emptyFn,
+
+    // private
+    onFocus : function(){
+        this.preFocus();
+        if(this.focusClass){
+            this.el.addClass(this.focusClass);
+        }
+        if(!this.hasFocus){
+            this.hasFocus = true;
+            /**
+             * <p>The value that the Field had at the time it was last focused. This is the value that is passed
+             * to the {@link #change} event which is fired if the value has been changed when the Field is blurred.</p>
+             * <p><b>This will be undefined until the Field has been visited.</b> Compare {@link #originalValue}.</p>
+             * @type mixed
+             * @property startValue
+             */
+            this.startValue = this.getValue();
+            this.fireEvent('focus', this);
+        }
+    },
+
+    // private
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    onBlur : function(){
+        this.beforeBlur();
+        if(this.focusClass){
+            this.el.removeClass(this.focusClass);
+        }
+        this.hasFocus = false;
+        if(this.validationEvent !== false && (this.validateOnBlur || this.validationEvent == 'blur')){
+            this.validate();
+        }
+        var v = this.getValue();
+        if(String(v) !== String(this.startValue)){
+            this.fireEvent('change', this, v, this.startValue);
+        }
+        this.fireEvent('blur', this);
+        this.postBlur();
+    },
+
+    // private
+    postBlur : Ext.emptyFn,
+
+    /**
+     * Returns whether or not the field value is currently valid by
+     * {@link #validateValue validating} the {@link #processValue processed value}
+     * of the field. <b>Note</b>: {@link #disabled} fields are ignored.
+     * @param {Boolean} preventMark True to disable marking the field invalid
+     * @return {Boolean} True if the value is valid, else false
+     */
+    isValid : function(preventMark){
+        if(this.disabled){
+            return true;
+        }
+        var restore = this.preventMark;
+        this.preventMark = preventMark === true;
+        var v = this.validateValue(this.processValue(this.getRawValue()), preventMark);
+        this.preventMark = restore;
+        return v;
+    },
+
+    /**
+     * Validates the field value
+     * @return {Boolean} True if the value is valid, else false
+     */
+    validate : function(){
+        if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){
+            this.clearInvalid();
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * This method should only be overridden if necessary to prepare raw values
+     * for validation (see {@link #validate} and {@link #isValid}).  This method
+     * is expected to return the processed value for the field which will
+     * be used for validation (see validateValue method).
+     * @param {Mixed} value
+     */
+    processValue : function(value){
+        return value;
+    },
+
+    /**
+     * Uses getErrors to build an array of validation errors. If any errors are found, markInvalid is called
+     * with the first and false is returned, otherwise true is returned. Previously, subclasses were invited
+     * to provide an implementation of this to process validations - from 3.2 onwards getErrors should be
+     * overridden instead.
+     * @param {Mixed} The current value of the field
+     * @return {Boolean} True if all validations passed, false if one or more failed
+     */
+     validateValue : function(value) {
+         //currently, we only show 1 error at a time for a field, so just use the first one
+         var error = this.getErrors(value)[0];
+
+         if (error == undefined) {
+             return true;
+         } else {
+             this.markInvalid(error);
+             return false;
+         }
+     },
+    
+    /**
+     * Runs this field's validators and returns an array of error messages for any validation failures.
+     * This is called internally during validation and would not usually need to be used manually.
+     * Each subclass should override or augment the return value to provide their own errors
+     * @return {Array} All error messages for this field
+     */
+    getErrors: function() {
+        return [];
+    },
+
+    /**
+     * Gets the active error message for this field.
+     * @return {String} Returns the active error message on the field, if there is no error, an empty string is returned.
+     */
+    getActiveError : function(){
+        return this.activeError || '';
+    },
+
+    /**
+     * <p>Display an error message associated with this field, using {@link #msgTarget} to determine how to
+     * display the message and applying {@link #invalidClass} to the field's UI element.</p>
+     * <p><b>Note</b>: this method does not cause the Field's {@link #validate} method to return <code>false</code>
+     * if the value does <i>pass</i> validation. So simply marking a Field as invalid will not prevent
+     * submission of forms submitted with the {@link Ext.form.Action.Submit#clientValidation} option set.</p>
+     * {@link #isValid invalid}.
+     * @param {String} msg (optional) The validation message (defaults to {@link #invalidText})
+     */
+    markInvalid : function(msg){
+        //don't set the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            msg = msg || this.invalidText;
+
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.mark(this, msg);
+            }else if(this.msgTarget){
+                this.el.addClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = msg;
+                    t.style.display = this.msgDisplay;
+                }
+            }
+        }
+        
+        this.setActiveError(msg);
+    },
+    
+    /**
+     * Clear any invalid styles/messages for this field
+     */
+    clearInvalid : function(){
+        //don't remove the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            this.el.removeClass(this.invalidClass);
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.clear(this);
+            }else if(this.msgTarget){
+                this.el.removeClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = '';
+                    t.style.display = 'none';
+                }
+            }
+        }
+        
+        this.unsetActiveError();
+    },
+
+    /**
+     * Sets the current activeError to the given string. Fires the 'invalid' event.
+     * This does not set up the error icon, only sets the message and fires the event. To show the error icon,
+     * use markInvalid instead, which calls this method internally
+     * @param {String} msg The error message
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    setActiveError: function(msg, suppressEvent) {
+        this.activeError = msg;
+        if (suppressEvent !== true) this.fireEvent('invalid', this, msg);
+    },
+    
+    /**
+     * Clears the activeError and fires the 'valid' event. This is called internally by clearInvalid and would not
+     * usually need to be called manually
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    unsetActiveError: function(suppressEvent) {
+        delete this.activeError;
+        if (suppressEvent !== true) this.fireEvent('valid', this);
+    },
+
+    // private
+    getMessageHandler : function(){
+        return Ext.form.MessageTargets[this.msgTarget];
+    },
+
+    // private
+    getErrorCt : function(){
+        return this.el.findParent('.x-form-element', 5, true) || // use form element wrap if available
+            this.el.findParent('.x-form-field-wrap', 5, true);   // else direct field wrap
+    },
+
+    // Alignment for 'under' target
+    alignErrorEl : function(){
+        this.errorEl.setWidth(this.getErrorCt().getWidth(true) - 20);
+    },
+
+    // Alignment for 'side' target
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.el, 'tl-tr', [2, 0]);
+    },
+
+    /**
+     * Returns the raw data value which may or may not be a valid, defined value.  To return a normalized value see {@link #getValue}.
+     * @return {Mixed} value The field value
+     */
+    getRawValue : function(){
+        var v = this.rendered ? this.el.getValue() : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
+     * @return {Mixed} value The field value
+     */
+    getValue : function(){
+        if(!this.rendered) {
+            return this.value;
+        }
+        var v = this.el.getValue();
+        if(v === this.emptyText || v === undefined){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Sets the underlying DOM field's value directly, bypassing validation.  To set the value with validation see {@link #setValue}.
+     * @param {Mixed} value The value to set
+     * @return {Mixed} value The field value that is set
+     */
+    setRawValue : function(v){
+        return this.rendered ? (this.el.dom.value = (Ext.isEmpty(v) ? '' : v)) : '';
+    },
+
+    /**
+     * Sets a data value into the field and validates it.  To set the value directly without validation see {@link #setRawValue}.
+     * @param {Mixed} value The value to set
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        this.value = v;
+        if(this.rendered){
+            this.el.dom.value = (Ext.isEmpty(v) ? '' : v);
+            this.validate();
+        }
+        return this;
+    },
+
+    // private, does not work for all fields
+    append : function(v){
+         this.setValue([this.getValue(), v].join(''));
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+
+Ext.form.MessageTargets = {
+    'qtip' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.qtip = msg;
+            field.el.dom.qclass = 'x-form-invalid-tip';
+            if(Ext.QuickTips){ // fix for floating editors interacting with DND
+                Ext.QuickTips.enable();
+            }
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            field.el.dom.qtip = '';
+        }
+    },
+    'title' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.title = msg;
+        },
+        clear: function(field){
+            field.el.dom.title = '';
+        }
+    },
+    'under' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorEl){
+                var elp = field.getErrorCt();
+                if(!elp){ // field has no container el
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorEl = elp.createChild({cls:'x-form-invalid-msg'});
+                field.on('resize', field.alignErrorEl, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorEl);
+                }, field);
+            }
+            field.alignErrorEl();
+            field.errorEl.update(msg);
+            Ext.form.Field.msgFx[field.msgFx].show(field.errorEl, field);
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorEl){
+                Ext.form.Field.msgFx[field.msgFx].hide(field.errorEl, field);
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    },
+    'side' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorIcon){
+                var elp = field.getErrorCt();
+                // field has no container el
+                if(!elp){
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});
+                if (field.ownerCt) {
+                    field.ownerCt.on('afterlayout', field.alignErrorIcon, field);
+                    field.ownerCt.on('expand', field.alignErrorIcon, field);
+                }
+                field.on('resize', field.alignErrorIcon, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorIcon);
+                }, field);
+            }
+            field.alignErrorIcon();
+            field.errorIcon.dom.qtip = msg;
+            field.errorIcon.dom.qclass = 'x-form-invalid-tip';
+            field.errorIcon.show();
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorIcon){
+                field.errorIcon.dom.qtip = '';
+                field.errorIcon.hide();
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    }
+};
+
+// anything other than normal should be considered experimental
+Ext.form.Field.msgFx = {
+    normal : {
+        show: function(msgEl, f){
+            msgEl.setDisplayed('block');
+        },
+
+        hide : function(msgEl, f){
+            msgEl.setDisplayed(false).update('');
+        }
+    },
+
+    slide : {
+        show: function(msgEl, f){
+            msgEl.slideIn('t', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('t', {stopFx:true,useDisplay:true});
+        }
+    },
+
+    slideRight : {
+        show: function(msgEl, f){
+            msgEl.fixDisplay();
+            msgEl.alignTo(f.el, 'tl-tr');
+            msgEl.slideIn('l', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('l', {stopFx:true,useDisplay:true});
+        }
+    }
+};
+Ext.reg('field', Ext.form.Field);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/SliderField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/SliderField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/SliderField.js	(revision 76)
@@ -0,0 +1,183 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.SliderField
+ * @extends Ext.form.Field
+ * Wraps a {@link Ext.slider.MultiSlider Slider} so it can be used as a form field.
+ * @constructor
+ * Creates a new SliderField
+ * @param {Object} config Configuration options. Note that you can pass in any slider configuration options, as well as
+ * as any field configuration options.
+ * @xtype sliderfield
+ */
+Ext.form.SliderField = Ext.extend(Ext.form.Field, {
+    
+    /**
+     * @cfg {Boolean} useTips
+     * True to use an Ext.slider.Tip to display tips for the value. Defaults to <tt>true</tt>.
+     */
+    useTips : true,
+    
+    /**
+     * @cfg {Function} tipText
+     * A function used to display custom text for the slider tip. Defaults to <tt>null</tt>, which will
+     * use the default on the plugin.
+     */
+    tipText : null,
+    
+    // private override
+    actionMode: 'wrap',
+    
+    /**
+     * Initialize the component.
+     * @private
+     */
+    initComponent : function() {
+        var cfg = Ext.copyTo({
+            id: this.id + '-slider'
+        }, this.initialConfig, ['vertical', 'minValue', 'maxValue', 'decimalPrecision', 'keyIncrement', 'increment', 'clickToChange', 'animate']);
+        
+        // only can use it if it exists.
+        if (this.useTips) {
+            var plug = this.tipText ? {getText: this.tipText} : {};
+            cfg.plugins = [new Ext.slider.Tip(plug)];
+        }
+        this.slider = new Ext.Slider(cfg);
+        Ext.form.SliderField.superclass.initComponent.call(this);
+    },    
+    
+    /**
+     * Set up the hidden field
+     * @param {Object} ct The container to render to.
+     * @param {Object} position The position in the container to render to.
+     * @private
+     */
+    onRender : function(ct, position){
+        this.autoCreate = {
+            id: this.id,
+            name: this.name,
+            type: 'hidden',
+            tag: 'input'    
+        };
+        Ext.form.SliderField.superclass.onRender.call(this, ct, position);
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
+        this.resizeEl = this.positionEl = this.wrap;
+        this.slider.render(this.wrap);
+    },
+    
+    /**
+     * Ensure that the slider size is set automatically when the field resizes.
+     * @param {Object} w The width
+     * @param {Object} h The height
+     * @param {Object} aw The adjusted width
+     * @param {Object} ah The adjusted height
+     * @private
+     */
+    onResize : function(w, h, aw, ah){
+        Ext.form.SliderField.superclass.onResize.call(this, w, h, aw, ah);
+        this.slider.setSize(w, h);    
+    },
+    
+    /**
+     * Initialize any events for this class.
+     * @private
+     */
+    initEvents : function(){
+        Ext.form.SliderField.superclass.initEvents.call(this);
+        this.slider.on('change', this.onChange, this);   
+    },
+    
+    /**
+     * Utility method to set the value of the field when the slider changes.
+     * @param {Object} slider The slider object.
+     * @param {Object} v The new value.
+     * @private
+     */
+    onChange : function(slider, v){
+        this.setValue(v, undefined, true);
+    },
+    
+    /**
+     * Enable the slider when the field is enabled.
+     * @private
+     */
+    onEnable : function(){
+        Ext.form.SliderField.superclass.onEnable.call(this);
+        this.slider.enable();
+    },
+    
+    /**
+     * Disable the slider when the field is disabled.
+     * @private
+     */
+    onDisable : function(){
+        Ext.form.SliderField.superclass.onDisable.call(this);
+        this.slider.disable();    
+    },
+    
+    /**
+     * Ensure the slider is destroyed when the field is destroyed.
+     * @private
+     */
+    beforeDestroy : function(){
+        Ext.destroy(this.slider);
+        Ext.form.SliderField.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * If a side icon is shown, do alignment to the slider
+     * @private
+     */
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.slider.el, 'tl-tr', [2, 0]);
+    },
+    
+    /**
+     * Sets the minimum field value.
+     * @param {Number} v The new minimum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMinValue : function(v){
+        this.slider.setMinValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the maximum field value.
+     * @param {Number} v The new maximum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMaxValue : function(v){
+        this.slider.setMaxValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the value for this field.
+     * @param {Number} v The new value.
+     * @param {Boolean} animate (optional) Whether to animate the transition. If not specified, it will default to the animate config.
+     * @return {Ext.form.SliderField} this
+     */
+    setValue : function(v, animate, /* private */ silent){
+        // silent is used if the setValue method is invoked by the slider
+        // which means we don't need to set the value on the slider.
+        if(!silent){
+            this.slider.setValue(v, animate);
+        }
+        return Ext.form.SliderField.superclass.setValue.call(this, this.slider.getValue());
+    },
+    
+    /**
+     * Gets the current value for this field.
+     * @return {Number} The current value.
+     */
+    getValue : function(){
+        return this.slider.getValue();    
+    }
+});
+
+Ext.reg('sliderfield', Ext.form.SliderField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Checkbox.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Checkbox.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Checkbox.js	(revision 76)
@@ -0,0 +1,183 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Checkbox
+ * @extends Ext.form.Field
+ * Single checkbox field.  Can be used as a direct replacement for traditional checkbox fields.
+ * @constructor
+ * Creates a new Checkbox
+ * @param {Object} config Configuration options
+ * @xtype checkbox
+ */
+Ext.form.Checkbox = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
+     */
+    focusClass : undefined,
+    /**
+     * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {Boolean} checked <tt>true</tt> if the checkbox should render initially checked (defaults to <tt>false</tt>)
+     */
+    checked : false,
+    /**
+     * @cfg {String} boxLabel The text that appears beside the checkbox
+     */
+    boxLabel: '&#160;',
+    /**
+     * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
+     * {tag: 'input', type: 'checkbox', autocomplete: 'off'})
+     */
+    defaultAutoCreate : { tag: 'input', type: 'checkbox', autocomplete: 'off'},
+    /**
+     * @cfg {String} inputValue The value that should go into the generated input element's value attribute
+     */
+    /**
+     * @cfg {Function} handler A function called when the {@link #checked} value changes (can be used instead of
+     * handling the check event). The handler is passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>checkbox</b> : Ext.form.Checkbox<div class="sub-desc">The Checkbox being toggled.</div></li>
+     * <li><b>checked</b> : Boolean<div class="sub-desc">The new checked state of the checkbox.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope An object to use as the scope ('this' reference) of the {@link #handler} function
+     * (defaults to this Checkbox).
+     */
+
+    // private
+    actionMode : 'wrap',
+
+	// private
+    initComponent : function(){
+        Ext.form.Checkbox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event check
+             * Fires when the checkbox is checked or unchecked.
+             * @param {Ext.form.Checkbox} this This checkbox
+             * @param {Boolean} checked The new checked value
+             */
+            'check'
+        );
+    },
+
+    // private
+    onResize : function(){
+        Ext.form.Checkbox.superclass.onResize.apply(this, arguments);
+        if(!this.boxLabel && !this.fieldLabel){
+            this.el.alignTo(this.wrap, 'c-c');
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.Checkbox.superclass.initEvents.call(this);
+        this.mon(this.el, {
+            scope: this,
+            click: this.onClick,
+            change: this.onClick
+        });
+    },
+
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.Checkbox.superclass.onRender.call(this, ct, position);
+        if(this.inputValue !== undefined){
+            this.el.dom.value = this.inputValue;
+        }
+        this.wrap = this.el.wrap({cls: 'x-form-check-wrap'});
+        if(this.boxLabel){
+            this.wrap.createChild({tag: 'label', htmlFor: this.el.id, cls: 'x-form-cb-label', html: this.boxLabel});
+        }
+        if(this.checked){
+            this.setValue(true);
+        }else{
+            this.checked = this.el.dom.checked;
+        }
+        // Need to repaint for IE, otherwise positioning is broken
+        if (Ext.isIE && !Ext.isStrict) {
+            this.wrap.repaint();
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.wrap);
+        Ext.form.Checkbox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initValue : function() {
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Returns the checked state of the checkbox.
+     * @return {Boolean} True if checked, else false
+     */
+    getValue : function(){
+        if(this.rendered){
+            return this.el.dom.checked;
+        }
+        return this.checked;
+    },
+
+	// private
+    onClick : function(){
+        if(this.el.dom.checked != this.checked){
+            this.setValue(this.el.dom.checked);
+        }
+    },
+
+    /**
+     * Sets the checked state of the checkbox, fires the 'check' event, and calls a
+     * <code>{@link #handler}</code> (if configured).
+     * @param {Boolean/String} checked The following values will check the checkbox:
+     * <code>true, 'true', '1', or 'on'</code>. Any other value will uncheck the checkbox.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var checked = this.checked,
+            inputVal = this.inputValue;
+            
+        if (v === false) {
+            this.checked = false;
+        } else {
+            this.checked = (v === true || v === 'true' || v == '1' || (inputVal ? v == inputVal : String(v).toLowerCase() == 'on'));
+        }
+        
+        if(this.rendered){
+            this.el.dom.checked = this.checked;
+            this.el.dom.defaultChecked = this.checked;
+        }
+        if(checked != this.checked){
+            this.fireEvent('check', this, this.checked);
+            if(this.handler){
+                this.handler.call(this.scope || this, this, this.checked);
+            }
+        }
+        return this;
+    }
+});
+Ext.reg('checkbox', Ext.form.Checkbox);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TextField.js	(revision 76)
@@ -0,0 +1,548 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.TextField
+ * @extends Ext.form.Field
+ * <p>Basic text field.  Can be used as a direct replacement for traditional text inputs,
+ * or as the base class for more sophisticated input controls (like {@link Ext.form.TextArea}
+ * and {@link Ext.form.ComboBox}).</p>
+ * <p><b><u>Validation</u></b></p>
+ * <p>The validation procedure is described in the documentation for {@link #validateValue}.</p>
+ * <p><b><u>Alter Validation Behavior</u></b></p>
+ * <p>Validation behavior for each field can be configured:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.form.TextField#invalidText invalidText}</code> : the default validation message to
+ * show if any validation step above does not provide a message when invalid</li>
+ * <li><code>{@link Ext.form.TextField#maskRe maskRe}</code> : filter out keystrokes before any validation occurs</li>
+ * <li><code>{@link Ext.form.TextField#stripCharsRe stripCharsRe}</code> : filter characters after being typed in,
+ * but before being validated</li>
+ * <li><code>{@link Ext.form.Field#invalidClass invalidClass}</code> : alternate style when invalid</li>
+ * <li><code>{@link Ext.form.Field#validateOnBlur validateOnBlur}</code>,
+ * <code>{@link Ext.form.Field#validationDelay validationDelay}</code>, and
+ * <code>{@link Ext.form.Field#validationEvent validationEvent}</code> : modify how/when validation is triggered</li>
+ * </ul></div>
+ * 
+ * @constructor Creates a new TextField
+ * @param {Object} config Configuration options
+ * 
+ * @xtype textfield
+ */
+Ext.form.TextField = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} vtypeText A custom error message to display in place of the default message provided
+     * for the <b><code>{@link #vtype}</code></b> currently set for this field (defaults to <tt>''</tt>).  <b>Note</b>:
+     * only applies if <b><code>{@link #vtype}</code></b> is set, else ignored.
+     */
+    /**
+     * @cfg {RegExp} stripCharsRe A JavaScript RegExp object used to strip unwanted content from the value
+     * before validation (defaults to <tt>null</tt>).
+     */
+    /**
+     * @cfg {Boolean} grow <tt>true</tt> if this field should automatically grow and shrink to its content
+     * (defaults to <tt>false</tt>)
+     */
+    grow : false,
+    /**
+     * @cfg {Number} growMin The minimum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>30</tt>)
+     */
+    growMin : 30,
+    /**
+     * @cfg {Number} growMax The maximum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>800</tt>)
+     */
+    growMax : 800,
+    /**
+     * @cfg {String} vtype A validation type name as defined in {@link Ext.form.VTypes} (defaults to <tt>null</tt>)
+     */
+    vtype : null,
+    /**
+     * @cfg {RegExp} maskRe An input mask regular expression that will be used to filter keystrokes that do
+     * not match (defaults to <tt>null</tt>). The maskRe will not operate on any paste events.
+     */
+    maskRe : null,
+    /**
+     * @cfg {Boolean} disableKeyFilter Specify <tt>true</tt> to disable input keystroke filtering (defaults
+     * to <tt>false</tt>)
+     */
+    disableKeyFilter : false,
+    /**
+     * @cfg {Boolean} allowBlank Specify <tt>false</tt> to validate that the value's length is > 0 (defaults to
+     * <tt>true</tt>)
+     */
+    allowBlank : true,
+    /**
+     * @cfg {Number} minLength Minimum input field length required (defaults to <tt>0</tt>)
+     */
+    minLength : 0,
+    /**
+     * @cfg {Number} maxLength Maximum input field length allowed by validation (defaults to Number.MAX_VALUE).
+     * This behavior is intended to provide instant feedback to the user by improving usability to allow pasting
+     * and editing or overtyping and back tracking. To restrict the maximum number of characters that can be
+     * entered into the field use <tt><b>{@link Ext.form.Field#autoCreate autoCreate}</b></tt> to add
+     * any attributes you want to a field, for example:<pre><code>
+var myField = new Ext.form.NumberField({
+    id: 'mobile',
+    anchor:'90%',
+    fieldLabel: 'Mobile',
+    maxLength: 16, // for validation
+    autoCreate: {tag: 'input', type: 'text', size: '20', autocomplete: 'off', maxlength: '10'}
+});
+</code></pre>
+     */
+    maxLength : Number.MAX_VALUE,
+    /**
+     * @cfg {String} minLengthText Error text to display if the <b><tt>{@link #minLength minimum length}</tt></b>
+     * validation fails (defaults to <tt>'The minimum length for this field is {minLength}'</tt>)
+     */
+    minLengthText : 'The minimum length for this field is {0}',
+    /**
+     * @cfg {String} maxLengthText Error text to display if the <b><tt>{@link #maxLength maximum length}</tt></b>
+     * validation fails (defaults to <tt>'The maximum length for this field is {maxLength}'</tt>)
+     */
+    maxLengthText : 'The maximum length for this field is {0}',
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to automatically select any existing field text when the field
+     * receives input focus (defaults to <tt>false</tt>)
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} blankText The error text to display if the <b><tt>{@link #allowBlank}</tt></b> validation
+     * fails (defaults to <tt>'This field is required'</tt>)
+     */
+    blankText : 'This field is required',
+    /**
+     * @cfg {Function} validator
+     * <p>A custom validation function to be called during field validation ({@link #validateValue})
+     * (defaults to <tt>null</tt>). If specified, this function will be called first, allowing the
+     * developer to override the default validation process.</p>
+     * <br><p>This function will be passed the following Parameters:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>value</code>: <i>Mixed</i>
+     * <div class="sub-desc">The current field value</div></li>
+     * </ul></div>
+     * <br><p>This function is to Return:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>true</code>: <i>Boolean</i>
+     * <div class="sub-desc"><code>true</code> if the value is valid</div></li>
+     * <li><code>msg</code>: <i>String</i>
+     * <div class="sub-desc">An error message if the value is invalid</div></li>
+     * </ul></div>
+     */
+    validator : null,
+    /**
+     * @cfg {RegExp} regex A JavaScript RegExp object to be tested against the field value during validation
+     * (defaults to <tt>null</tt>). If the test fails, the field will be marked invalid using
+     * <b><tt>{@link #regexText}</tt></b>.
+     */
+    regex : null,
+    /**
+     * @cfg {String} regexText The error text to display if <b><tt>{@link #regex}</tt></b> is used and the
+     * test fails during validation (defaults to <tt>''</tt>)
+     */
+    regexText : '',
+    /**
+     * @cfg {String} emptyText The default text to place into an empty field (defaults to <tt>null</tt>).
+     * <b>Note</b>: that this value will be submitted to the server if this field is enabled and configured
+     * with a {@link #name}.
+     */
+    emptyText : null,
+    /**
+     * @cfg {String} emptyClass The CSS class to apply to an empty field to style the <b><tt>{@link #emptyText}</tt></b>
+     * (defaults to <tt>'x-form-empty-field'</tt>).  This class is automatically added and removed as needed
+     * depending on the current field value.
+     */
+    emptyClass : 'x-form-empty-field',
+
+    /**
+     * @cfg {Boolean} enableKeyEvents <tt>true</tt> to enable the proxying of key events for the HTML input
+     * field (defaults to <tt>false</tt>)
+     */
+
+    initComponent : function(){
+        Ext.form.TextField.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event autosize
+             * Fires when the <tt><b>{@link #autoSize}</b></tt> function is triggered. The field may or
+             * may not have actually changed size according to the default logic, but this event provides
+             * a hook for the developer to apply additional logic at runtime to resize the field if needed.
+             * @param {Ext.form.Field} this This text field
+             * @param {Number} width The new field width
+             */
+            'autosize',
+
+            /**
+             * @event keydown
+             * Keydown input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+            /**
+             * @event keyup
+             * Keyup input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keyup',
+            /**
+             * @event keypress
+             * Keypress input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keypress'
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.TextField.superclass.initEvents.call(this);
+        if(this.validationEvent == 'keyup'){
+            this.validationTask = new Ext.util.DelayedTask(this.validate, this);
+            this.mon(this.el, 'keyup', this.filterValidation, this);
+        }
+        else if(this.validationEvent !== false && this.validationEvent != 'blur'){
+        	this.mon(this.el, this.validationEvent, this.validate, this, {buffer: this.validationDelay});
+        }
+        if(this.selectOnFocus || this.emptyText){            
+            this.mon(this.el, 'mousedown', this.onMouseDown, this);
+            
+            if(this.emptyText){
+                this.applyEmptyText();
+            }
+        }
+        if(this.maskRe || (this.vtype && this.disableKeyFilter !== true && (this.maskRe = Ext.form.VTypes[this.vtype+'Mask']))){
+        	this.mon(this.el, 'keypress', this.filterKeys, this);
+        }
+        if(this.grow){
+        	this.mon(this.el, 'keyup', this.onKeyUpBuffered, this, {buffer: 50});
+			this.mon(this.el, 'click', this.autoSize, this);
+        }
+        if(this.enableKeyEvents){
+            this.mon(this.el, {
+                scope: this,
+                keyup: this.onKeyUp,
+                keydown: this.onKeyDown,
+                keypress: this.onKeyPress
+            });
+        }
+    },
+    
+    onMouseDown: function(e){
+        if(!this.hasFocus){
+            this.mon(this.el, 'mouseup', Ext.emptyFn, this, { single: true, preventDefault: true });
+        }
+    },
+
+    processValue : function(value){
+        if(this.stripCharsRe){
+            var newValue = value.replace(this.stripCharsRe, '');
+            if(newValue !== value){
+                this.setRawValue(newValue);
+                return newValue;
+            }
+        }
+        return value;
+    },
+
+    filterValidation : function(e){
+        if(!e.isNavKeyPress()){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+    
+    //private
+    onDisable: function(){
+        Ext.form.TextField.superclass.onDisable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = 'on';
+        }
+    },
+    
+    //private
+    onEnable: function(){
+        Ext.form.TextField.superclass.onEnable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = '';
+        }
+    },
+
+    // private
+    onKeyUpBuffered : function(e){
+        if(this.doAutoSize(e)){
+            this.autoSize();
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress();
+    },
+
+    // private
+    onKeyUp : function(e){
+        this.fireEvent('keyup', this, e);
+    },
+
+    // private
+    onKeyDown : function(e){
+        this.fireEvent('keydown', this, e);
+    },
+
+    // private
+    onKeyPress : function(e){
+        this.fireEvent('keypress', this, e);
+    },
+
+    /**
+     * Resets the current field value to the originally-loaded value and clears any validation messages.
+     * Also adds <tt><b>{@link #emptyText}</b></tt> and <tt><b>{@link #emptyClass}</b></tt> if the
+     * original value was blank.
+     */
+    reset : function(){
+        Ext.form.TextField.superclass.reset.call(this);
+        this.applyEmptyText();
+    },
+
+    applyEmptyText : function(){
+        if(this.rendered && this.emptyText && this.getRawValue().length < 1 && !this.hasFocus){
+            this.setRawValue(this.emptyText);
+            this.el.addClass(this.emptyClass);
+        }
+    },
+
+    // private
+    preFocus : function(){
+        var el = this.el,
+            isEmpty;
+        if(this.emptyText){
+            if(el.dom.value == this.emptyText){
+                this.setRawValue('');
+                isEmpty = true;
+            }
+            el.removeClass(this.emptyClass);
+        }
+        if(this.selectOnFocus || isEmpty){
+            el.dom.select();
+        }
+    },
+
+    // private
+    postBlur : function(){
+        this.applyEmptyText();
+    },
+
+    // private
+    filterKeys : function(e){
+        if(e.ctrlKey){
+            return;
+        }
+        var k = e.getKey();
+        if(Ext.isGecko && (e.isNavKeyPress() || k == e.BACKSPACE || (k == e.DELETE && e.button == -1))){
+            return;
+        }
+        var cc = String.fromCharCode(e.getCharCode());
+        if(!Ext.isGecko && e.isSpecialKey() && !cc){
+            return;
+        }
+        if(!this.maskRe.test(cc)){
+            e.stopEvent();
+        }
+    },
+
+    setValue : function(v){
+        if(this.emptyText && this.el && !Ext.isEmpty(v)){
+            this.el.removeClass(this.emptyClass);
+        }
+        Ext.form.TextField.superclass.setValue.apply(this, arguments);
+        this.applyEmptyText();
+        this.autoSize();
+        return this;
+    },
+
+    /**
+     * <p>Validates a value according to the field's validation rules and returns an array of errors
+     * for any failing validations. Validation rules are processed in the following order:</p>
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><b>1. Field specific validator</b>
+     * <div class="sub-desc">
+     * <p>A validator offers a way to customize and reuse a validation specification.
+     * If a field is configured with a <code>{@link #validator}</code>
+     * function, it will be passed the current field value.  The <code>{@link #validator}</code>
+     * function is expected to return either:
+     * <div class="mdetail-params"><ul>
+     * <li>Boolean <tt>true</tt> if the value is valid (validation continues).</li>
+     * <li>a String to represent the invalid message if invalid (validation halts).</li>
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>2. Basic Validation</b>
+     * <div class="sub-desc">
+     * <p>If the <code>{@link #validator}</code> has not halted validation,
+     * basic validation proceeds as follows:</p>
+     * 
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><code>{@link #allowBlank}</code> : (Invalid message =
+     * <code>{@link #emptyText}</code>)<div class="sub-desc">
+     * Depending on the configuration of <code>{@link #allowBlank}</code>, a
+     * blank field will cause validation to halt at this step and return
+     * Boolean true or false accordingly.  
+     * </div></li>
+     * 
+     * <li><code>{@link #minLength}</code> : (Invalid message =
+     * <code>{@link #minLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #minLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * <li><code>{@link #maxLength}</code> : (Invalid message =
+     * <code>{@link #maxLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #maxLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>3. Preconfigured Validation Types (VTypes)</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field
+     * configured with a <code>{@link #vtype}</code> will utilize the
+     * corresponding {@link Ext.form.VTypes VTypes} validation function.
+     * If invalid, either the field's <code>{@link #vtypeText}</code> or
+     * the VTypes vtype Text property will be used for the invalid message.
+     * Keystrokes on the field will be filtered according to the VTypes
+     * vtype Mask property.</p>
+     * </div></li>
+     * 
+     * <li><b>4. Field specific regex test</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field's
+     * configured <code>{@link #regex}</code> test will be processed.
+     * The invalid message for this test is configured with
+     * <code>{@link #regexText}</code>.</p>
+     * </div></li>
+     * 
+     * @param {Mixed} value The value to validate. The processed raw value will be used if nothing is passed
+     * @return {Array} Array of any validation errors
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.TextField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());        
+        
+        if (Ext.isFunction(this.validator)) {
+            var msg = this.validator(value);
+            if (msg !== true) {
+                errors.push(msg);
+            }
+        }
+        
+        if (value.length < 1 || value === this.emptyText) {
+            if (this.allowBlank) {
+                //if value is blank and allowBlank is true, there cannot be any additional errors
+                return errors;
+            } else {
+                errors.push(this.blankText);
+            }
+        }
+        
+        if (!this.allowBlank && (value.length < 1 || value === this.emptyText)) { // if it's blank
+            errors.push(this.blankText);
+        }
+        
+        if (value.length < this.minLength) {
+            errors.push(String.format(this.minLengthText, this.minLength));
+        }
+        
+        if (value.length > this.maxLength) {
+            errors.push(String.format(this.maxLengthText, this.maxLength));
+        }
+        
+        if (this.vtype) {
+            var vt = Ext.form.VTypes;
+            if(!vt[this.vtype](value, this)){
+                errors.push(this.vtypeText || vt[this.vtype +'Text']);
+            }
+        }
+        
+        if (this.regex && !this.regex.test(value)) {
+            errors.push(this.regexText);
+        }
+        
+        return errors;
+    },
+
+    /**
+     * Selects text in this field
+     * @param {Number} start (optional) The index where the selection should start (defaults to 0)
+     * @param {Number} end (optional) The index where the selection should end (defaults to the text length)
+     */
+    selectText : function(start, end){
+        var v = this.getRawValue();
+        var doFocus = false;
+        if(v.length > 0){
+            start = start === undefined ? 0 : start;
+            end = end === undefined ? v.length : end;
+            var d = this.el.dom;
+            if(d.setSelectionRange){
+                d.setSelectionRange(start, end);
+            }else if(d.createTextRange){
+                var range = d.createTextRange();
+                range.moveStart('character', start);
+                range.moveEnd('character', end-v.length);
+                range.select();
+            }
+            doFocus = Ext.isGecko || Ext.isOpera;
+        }else{
+            doFocus = true;
+        }
+        if(doFocus){
+            this.focus();
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
+     * This only takes effect if <tt><b>{@link #grow}</b> = true</tt>, and fires the {@link #autosize} event.
+     */
+    autoSize : function(){
+        if(!this.grow || !this.rendered){
+            return;
+        }
+        if(!this.metrics){
+            this.metrics = Ext.util.TextMetrics.createInstance(this.el);
+        }
+        var el = this.el;
+        var v = el.dom.value;
+        var d = document.createElement('div');
+        d.appendChild(document.createTextNode(v));
+        v = d.innerHTML;
+        Ext.removeNode(d);
+        d = null;
+        v += '&#160;';
+        var w = Math.min(this.growMax, Math.max(this.metrics.getWidth(v) + /* add extra padding */ 10, this.growMin));
+        this.el.setWidth(w);
+        this.fireEvent('autosize', this, w);
+    },
+	
+	onDestroy: function(){
+		if(this.validationTask){
+			this.validationTask.cancel();
+			this.validationTask = null;
+		}
+		Ext.form.TextField.superclass.onDestroy.call(this);
+	}
+});
+Ext.reg('textfield', Ext.form.TextField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/VTypes.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/VTypes.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/VTypes.js	(revision 76)
@@ -0,0 +1,135 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.VTypes
+ * <p>This is a singleton object which contains a set of commonly used field validation functions.
+ * The validations provided are basic and intended to be easily customizable and extended.</p>
+ * <p>To add custom VTypes specify the <code>{@link Ext.form.TextField#vtype vtype}</code> validation
+ * test function, and optionally specify any corresponding error text to display and any keystroke
+ * filtering mask to apply. For example:</p>
+ * <pre><code>
+// custom Vtype for vtype:'time'
+var timeTest = /^([1-9]|1[0-9]):([0-5][0-9])(\s[a|p]m)$/i;
+Ext.apply(Ext.form.VTypes, {
+    //  vtype validation function
+    time: function(val, field) {
+        return timeTest.test(val);
+    },
+    // vtype Text property: The error text to display when the validation function returns false
+    timeText: 'Not a valid time.  Must be in the format "12:34 PM".',
+    // vtype Mask property: The keystroke filter mask
+    timeMask: /[\d\s:amp]/i
+});
+ * </code></pre>
+ * Another example:
+ * <pre><code>
+// custom Vtype for vtype:'IPAddress'
+Ext.apply(Ext.form.VTypes, {
+    IPAddress:  function(v) {
+        return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
+    },
+    IPAddressText: 'Must be a numeric IP address',
+    IPAddressMask: /[\d\.]/i
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.form.VTypes = function(){
+    // closure these in so they are only created once.
+    var alpha = /^[a-zA-Z_]+$/,
+        alphanum = /^[a-zA-Z0-9_]+$/,
+        email = /^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,
+        url = /(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
+
+    // All these messages and functions are configurable
+    return {
+        /**
+         * The function used to validate email addresses.  Note that this is a very basic validation -- complete
+         * validation per the email RFC specifications is very complex and beyond the scope of this class, although
+         * this function can be overridden if a more comprehensive validation scheme is desired.  See the validation
+         * section of the <a href="http://en.wikipedia.org/wiki/E-mail_address">Wikipedia article on email addresses</a>
+         * for additional information.  This implementation is intended to validate the following emails:<tt>
+         * 'barney@example.de', 'barney.rubble@example.com', 'barney-rubble@example.coop', 'barney+rubble@example.com'
+         * </tt>.
+         * @param {String} value The email address
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'email' : function(v){
+            return email.test(v);
+        },
+        /**
+         * The error text to display when the email validation function returns false.  Defaults to:
+         * <tt>'This field should be an e-mail address in the format "user@example.com"'</tt>
+         * @type String
+         */
+        'emailText' : 'This field should be an e-mail address in the format "user@example.com"',
+        /**
+         * The keystroke filter mask to be applied on email input.  See the {@link #email} method for
+         * information about more complex email validation. Defaults to:
+         * <tt>/[a-z0-9_\.\-\+\'@]/i</tt>
+         * @type RegExp
+         */
+        'emailMask' : /[a-z0-9_\.\-\+\'@]/i,
+
+        /**
+         * The function used to validate URLs
+         * @param {String} value The URL
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'url' : function(v){
+            return url.test(v);
+        },
+        /**
+         * The error text to display when the url validation function returns false.  Defaults to:
+         * <tt>'This field should be a URL in the format "http:/'+'/www.example.com"'</tt>
+         * @type String
+         */
+        'urlText' : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+
+        /**
+         * The function used to validate alpha values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alpha' : function(v){
+            return alpha.test(v);
+        },
+        /**
+         * The error text to display when the alpha validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters and _'</tt>
+         * @type String
+         */
+        'alphaText' : 'This field should only contain letters and _',
+        /**
+         * The keystroke filter mask to be applied on alpha input.  Defaults to:
+         * <tt>/[a-z_]/i</tt>
+         * @type RegExp
+         */
+        'alphaMask' : /[a-z_]/i,
+
+        /**
+         * The function used to validate alphanumeric values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alphanum' : function(v){
+            return alphanum.test(v);
+        },
+        /**
+         * The error text to display when the alphanumeric validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters, numbers and _'</tt>
+         * @type String
+         */
+        'alphanumText' : 'This field should only contain letters, numbers and _',
+        /**
+         * The keystroke filter mask to be applied on alphanumeric input.  Defaults to:
+         * <tt>/[a-z0-9_]/i</tt>
+         * @type RegExp
+         */
+        'alphanumMask' : /[a-z0-9_]/i
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Hidden.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Hidden.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Hidden.js	(revision 76)
@@ -0,0 +1,41 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Hidden
+ * @extends Ext.form.Field
+ * A basic hidden field for storing hidden values in forms that need to be passed in the form submit.
+ * @constructor
+ * Create a new Hidden field.
+ * @param {Object} config Configuration options
+ * @xtype hidden
+ */
+Ext.form.Hidden = Ext.extend(Ext.form.Field, {
+    // private
+    inputType : 'hidden',
+    
+    shouldLayout: false,
+
+    // private
+    onRender : function(){
+        Ext.form.Hidden.superclass.onRender.apply(this, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    // These are all private overrides
+    setSize : Ext.emptyFn,
+    setWidth : Ext.emptyFn,
+    setHeight : Ext.emptyFn,
+    setPosition : Ext.emptyFn,
+    setPagePosition : Ext.emptyFn,
+    markInvalid : Ext.emptyFn,
+    clearInvalid : Ext.emptyFn
+});
+Ext.reg('hidden', Ext.form.Hidden);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/NumberField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/NumberField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/NumberField.js	(revision 76)
@@ -0,0 +1,194 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.NumberField
+ * @extends Ext.form.TextField
+ * Numeric text field that provides automatic keystroke filtering and numeric validation.
+ * @constructor
+ * Creates a new NumberField
+ * @param {Object} config Configuration options
+ * @xtype numberfield
+ */
+Ext.form.NumberField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {RegExp} stripCharsRe @hide
+     */
+    /**
+     * @cfg {RegExp} maskRe @hide
+     */
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to "x-form-field x-form-num-field")
+     */
+    fieldClass: "x-form-field x-form-num-field",
+    
+    /**
+     * @cfg {Boolean} allowDecimals False to disallow decimal values (defaults to true)
+     */
+    allowDecimals : true,
+    
+    /**
+     * @cfg {String} decimalSeparator Character(s) to allow as the decimal separator (defaults to '.')
+     */
+    decimalSeparator : ".",
+    
+    /**
+     * @cfg {Number} decimalPrecision The maximum precision to display after the decimal separator (defaults to 2)
+     */
+    decimalPrecision : 2,
+    
+    /**
+     * @cfg {Boolean} allowNegative False to prevent entering a negative sign (defaults to true)
+     */
+    allowNegative : true,
+    
+    /**
+     * @cfg {Number} minValue The minimum allowed value (defaults to Number.NEGATIVE_INFINITY)
+     */
+    minValue : Number.NEGATIVE_INFINITY,
+    
+    /**
+     * @cfg {Number} maxValue The maximum allowed value (defaults to Number.MAX_VALUE)
+     */
+    maxValue : Number.MAX_VALUE,
+    
+    /**
+     * @cfg {String} minText Error text to display if the minimum value validation fails (defaults to "The minimum value for this field is {minValue}")
+     */
+    minText : "The minimum value for this field is {0}",
+    
+    /**
+     * @cfg {String} maxText Error text to display if the maximum value validation fails (defaults to "The maximum value for this field is {maxValue}")
+     */
+    maxText : "The maximum value for this field is {0}",
+    
+    /**
+     * @cfg {String} nanText Error text to display if the value is not a valid number.  For example, this can happen
+     * if a valid character like '.' or '-' is left in the field with no number (defaults to "{value} is not a valid number")
+     */
+    nanText : "{0} is not a valid number",
+    
+    /**
+     * @cfg {String} baseChars The base set of characters to evaluate as valid numbers (defaults to '0123456789').
+     */
+    baseChars : "0123456789",
+    
+    /**
+     * @cfg {Boolean} autoStripChars True to automatically strip not allowed characters from the field. Defaults to <tt>false</tt>
+     */
+    autoStripChars: false,
+
+    // private
+    initEvents : function() {
+        var allowed = this.baseChars + '';
+        if (this.allowDecimals) {
+            allowed += this.decimalSeparator;
+        }
+        if (this.allowNegative) {
+            allowed += '-';
+        }
+        allowed = Ext.escapeRe(allowed);
+        this.maskRe = new RegExp('[' + allowed + ']');
+        if (this.autoStripChars) {
+            this.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
+        }
+        
+        Ext.form.NumberField.superclass.initEvents.call(this);
+    },
+    
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validations run test that the value is a number, and that it is within the
+     * configured min and max values.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.NumberField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());
+        
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+        
+        value = String(value).replace(this.decimalSeparator, ".");
+        
+        if(isNaN(value)){
+            errors.push(String.format(this.nanText, value));
+        }
+        
+        var num = this.parseValue(value);
+        
+        if (num < this.minValue) {
+            errors.push(String.format(this.minText, this.minValue));
+        }
+        
+        if (num > this.maxValue) {
+            errors.push(String.format(this.maxText, this.maxValue));
+        }
+        
+        return errors;
+    },
+
+    getValue : function() {
+        return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));
+    },
+
+    setValue : function(v) {
+    	v = Ext.isNumber(v) ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
+        v = this.fixPrecision(v);
+        v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
+        return Ext.form.NumberField.superclass.setValue.call(this, v);
+    },
+    
+    /**
+     * Replaces any existing {@link #minValue} with the new value.
+     * @param {Number} value The minimum value
+     */
+    setMinValue : function(value) {
+        this.minValue = Ext.num(value, Number.NEGATIVE_INFINITY);
+    },
+    
+    /**
+     * Replaces any existing {@link #maxValue} with the new value.
+     * @param {Number} value The maximum value
+     */
+    setMaxValue : function(value) {
+        this.maxValue = Ext.num(value, Number.MAX_VALUE);    
+    },
+
+    // private
+    parseValue : function(value) {
+        value = parseFloat(String(value).replace(this.decimalSeparator, "."));
+        return isNaN(value) ? '' : value;
+    },
+
+    /**
+     * @private
+     * 
+     */
+    fixPrecision : function(value) {
+        var nan = isNaN(value);
+        
+        if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
+            return nan ? '' : value;
+        }
+        
+        return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
+    },
+
+    beforeBlur : function() {
+        var v = this.parseValue(this.getRawValue());
+        
+        if (!Ext.isEmpty(v)) {
+            this.setValue(v);
+        }
+    }
+});
+
+Ext.reg('numberfield', Ext.form.NumberField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Radio.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Radio.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Radio.js	(revision 76)
@@ -0,0 +1,80 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.Radio
+ * @extends Ext.form.Checkbox
+ * Single radio field.  Same as Checkbox, but provided as a convenience for automatically setting the input type.
+ * Radio grouping is handled automatically by the browser if you give each radio in a group the same name.
+ * @constructor
+ * Creates a new Radio
+ * @param {Object} config Configuration options
+ * @xtype radio
+ */
+Ext.form.Radio = Ext.extend(Ext.form.Checkbox, {
+    inputType: 'radio',
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    /**
+     * If this radio is part of a group, it will return the selected value
+     * @return {String}
+     */
+    getGroupValue : function(){
+    	var p = this.el.up('form') || Ext.getBody();
+        var c = p.child('input[name="'+this.el.dom.name+'"]:checked', true);
+        return c ? c.value : null;
+    },
+
+    /**
+     * Sets either the checked/unchecked status of this Radio, or, if a string value
+     * is passed, checks a sibling Radio of the same name whose value is the value specified.
+     * @param value {String/Boolean} Checked value, or the value of the sibling radio button to check.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+    	var checkEl,
+            els,
+            radio;
+    	if (typeof v == 'boolean') {
+            Ext.form.Radio.superclass.setValue.call(this, v);
+        } else if (this.rendered) {
+            checkEl = this.getCheckEl();
+            radio = checkEl.child('input[name="' + this.el.dom.name + '"][value="' + v + '"]', true);
+            if(radio){
+                Ext.getCmp(radio.id).setValue(true);
+            }
+        }
+        if(this.rendered && this.checked){
+            checkEl = checkEl || this.getCheckEl();
+            els = this.getCheckEl().select('input[name="' + this.el.dom.name + '"]');
+			els.each(function(el){
+				if(el.dom.id != this.id){
+					Ext.getCmp(el.dom.id).setValue(false);
+				}
+			}, this);
+        }
+        return this;
+    },
+
+    // private
+    getCheckEl: function(){
+        if(this.inGroup){
+            return this.el.up('.x-form-radio-group');
+        }
+        return this.el.up('form') || Ext.getBody();
+    }
+});
+Ext.reg('radio', Ext.form.Radio);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/FieldSet.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/FieldSet.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/FieldSet.js	(revision 76)
@@ -0,0 +1,297 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.FieldSet
+ * @extends Ext.Panel
+ * Standard container used for grouping items within a {@link Ext.form.FormPanel form}.
+ * <pre><code>
+var form = new Ext.FormPanel({
+    title: 'Simple Form with FieldSets',
+    labelWidth: 75, // label settings here cascade unless overridden
+    url: 'save-form.php',
+    frame:true,
+    bodyStyle:'padding:5px 5px 0',
+    width: 700,
+    renderTo: document.body,
+    layout:'column', // arrange items in columns
+    defaults: {      // defaults applied to items
+        layout: 'form',
+        border: false,
+        bodyStyle: 'padding:4px'
+    },
+    items: [{
+        // Fieldset in Column 1
+        xtype:'fieldset',
+        columnWidth: 0.5,
+        title: 'Fieldset 1',
+        collapsible: true,
+        autoHeight:true,
+        defaults: {
+            anchor: '-20' // leave room for error icon
+        },
+        defaultType: 'textfield',
+        items :[{
+                fieldLabel: 'Field 1'
+            }, {
+                fieldLabel: 'Field 2'
+            }, {
+                fieldLabel: 'Field 3'
+            }
+        ]
+    },{
+        // Fieldset in Column 2 - Panel inside
+        xtype:'fieldset',
+        title: 'Show Panel', // title, header, or checkboxToggle creates fieldset header
+        autoHeight:true,
+        columnWidth: 0.5,
+        checkboxToggle: true,
+        collapsed: true, // fieldset initially collapsed
+        layout:'anchor',
+        items :[{
+            xtype: 'panel',
+            anchor: '100%',
+            title: 'Panel inside a fieldset',
+            frame: true,
+            height: 100
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype fieldset
+ */
+Ext.form.FieldSet = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Mixed} checkboxToggle <tt>true</tt> to render a checkbox into the fieldset frame just
+     * in front of the legend to expand/collapse the fieldset when the checkbox is toggled. (defaults
+     * to <tt>false</tt>).
+     * <p>A {@link Ext.DomHelper DomHelper} element spec may also be specified to create the checkbox.
+     * If <tt>true</tt> is specified, the default DomHelper config object used to create the element
+     * is:</p><pre><code>
+     * {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'}
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} checkboxName The name to assign to the fieldset's checkbox if <tt>{@link #checkboxToggle} = true</tt>
+     * (defaults to <tt>'[checkbox id]-checkbox'</tt>).
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <tt>true</tt> to make the fieldset collapsible and have the expand/collapse toggle button automatically
+     * rendered into the legend element, <tt>false</tt> to keep the fieldset statically sized with no collapse
+     * button (defaults to <tt>false</tt>). Another option is to configure <tt>{@link #checkboxToggle}</tt>.
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels. This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).
+     * This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).
+     */
+    baseCls : 'x-fieldset',
+    /**
+     * @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).
+     */
+    layout : 'form',
+    /**
+     * @cfg {Boolean} animCollapse
+     * <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the
+     * animation (defaults to <tt>false</tt>).
+     */
+    animCollapse : false,
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('fieldset');
+            this.el.id = this.id;
+            if (this.title || this.header || this.checkboxToggle) {
+                this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';
+            }
+        }
+
+        Ext.form.FieldSet.superclass.onRender.call(this, ct, position);
+
+        if(this.checkboxToggle){
+            var o = typeof this.checkboxToggle == 'object' ?
+                    this.checkboxToggle :
+                    {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
+            this.checkbox = this.header.insertFirst(o);
+            this.checkbox.dom.checked = !this.collapsed;
+            this.mon(this.checkbox, 'click', this.onCheckClick, this);
+        }
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = false;
+        }
+        Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);
+
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = true;
+        }
+        Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
+    },
+
+    /**
+     * This function is called by the fieldset's checkbox when it is toggled (only applies when
+     * checkboxToggle = true).  This method should never be called externally, but can be
+     * overridden to provide custom behavior when the checkbox is toggled if needed.
+     */
+    onCheckClick : function(){
+        this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} border
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapseFirst
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {String} disabledClass
+     * @hide
+     */
+    /**
+     * @cfg {String} elements
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} floating
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} footer
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} frame
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {String} iconCls
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * @hide
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} shim
+     * @hide
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {String} xtype
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @property footer
+     * @hide
+     */
+    /**
+     * @method focus
+     * @hide
+     */
+    /**
+     * @method getBottomToolbar
+     * @hide
+     */
+    /**
+     * @method getTopToolbar
+     * @hide
+     */
+    /**
+     * @method setIconClass
+     * @hide
+     */
+    /**
+     * @event activate
+     * @hide
+     */
+    /**
+     * @event beforeclose
+     * @hide
+     */
+    /**
+     * @event bodyresize
+     * @hide
+     */
+    /**
+     * @event close
+     * @hide
+     */
+    /**
+     * @event deactivate
+     * @hide
+     */
+});
+Ext.reg('fieldset', Ext.form.FieldSet);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Combo.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Combo.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Combo.js	(revision 76)
@@ -0,0 +1,1358 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.ComboBox
+ * @extends Ext.form.TriggerField
+ * <p>A combobox control with support for autocomplete, remote-loading, paging and many other features.</p>
+ * <p>A ComboBox works in a similar manner to a traditional HTML &lt;select> field. The difference is
+ * that to submit the {@link #valueField}, you must specify a {@link #hiddenName} to create a hidden input
+ * field to hold the value of the valueField. The <i>{@link #displayField}</i> is shown in the text field
+ * which is named according to the {@link #name}.</p>
+ * <p><b><u>Events</u></b></p>
+ * <p>To do something when something in ComboBox is selected, configure the select event:<pre><code>
+var cb = new Ext.form.ComboBox({
+    // all of your config options
+    listeners:{
+         scope: yourScope,
+         'select': yourFunction
+    }
+});
+
+// Alternatively, you can assign events after the object is created:
+var cb = new Ext.form.ComboBox(yourOptions);
+cb.on('select', yourFunction, yourScope);
+ * </code></pre></p>
+ *
+ * <p><b><u>ComboBox in Grid</u></b></p>
+ * <p>If using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a {@link Ext.grid.Column#renderer renderer}
+ * will be needed to show the displayField when the editor is not active.  Set up the renderer manually, or implement
+ * a reusable render, for example:<pre><code>
+// create reusable renderer
+Ext.util.Format.comboRenderer = function(combo){
+    return function(value){
+        var record = combo.findRecord(combo.{@link #valueField}, value);
+        return record ? record.get(combo.{@link #displayField}) : combo.{@link #valueNotFoundText};
+    }
+}
+
+// create the combo instance
+var combo = new Ext.form.ComboBox({
+    {@link #typeAhead}: true,
+    {@link #triggerAction}: 'all',
+    {@link #lazyRender}:true,
+    {@link #mode}: 'local',
+    {@link #store}: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]
+    }),
+    {@link #valueField}: 'myId',
+    {@link #displayField}: 'displayText'
+});
+
+// snippet of column model used within grid
+var cm = new Ext.grid.ColumnModel([{
+       ...
+    },{
+       header: "Some Header",
+       dataIndex: 'whatever',
+       width: 130,
+       editor: combo, // specify reference to combo instance
+       renderer: Ext.util.Format.comboRenderer(combo) // pass combo instance to reusable renderer
+    },
+    ...
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Filtering</u></b></p>
+ * <p>A ComboBox {@link #doQuery uses filtering itself}, for information about filtering the ComboBox
+ * store manually see <tt>{@link #lastQuery}</tt>.</p>
+ * @constructor
+ * Create a new ComboBox.
+ * @param {Object} config Configuration options
+ * @xtype combo
+ */
+Ext.form.ComboBox = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} transform The id, DOM node or element of an existing HTML SELECT to convert to a ComboBox.
+     * Note that if you specify this and the combo is going to be in an {@link Ext.form.BasicForm} or
+     * {@link Ext.form.FormPanel}, you must also set <tt>{@link #lazyRender} = true</tt>.
+     */
+    /**
+     * @cfg {Boolean} lazyRender <tt>true</tt> to prevent the ComboBox from rendering until requested
+     * (should always be used when rendering into an {@link Ext.Editor} (e.g. {@link Ext.grid.EditorGridPanel Grids}),
+     * defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or <tt>true</tt> for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "24", autocomplete: "off"}</code></pre>
+     */
+    /**
+     * @cfg {Ext.data.Store/Array} store The data source to which this combo is bound (defaults to <tt>undefined</tt>).
+     * Acceptable values for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b>any {@link Ext.data.Store Store} subclass</b></li>
+     * <li><b>an Array</b> : Arrays will be converted to a {@link Ext.data.ArrayStore} internally,
+     * automatically generating {@link Ext.data.Field#name field names} to work with all data components.
+     * <div class="mdetail-params"><ul>
+     * <li><b>1-dimensional array</b> : (e.g., <tt>['Foo','Bar']</tt>)<div class="sub-desc">
+     * A 1-dimensional array will automatically be expanded (each array item will be used for both the combo
+     * {@link #valueField} and {@link #displayField})</div></li>
+     * <li><b>2-dimensional array</b> : (e.g., <tt>[['f','Foo'],['b','Bar']]</tt>)<div class="sub-desc">
+     * For a multi-dimensional array, the value in index 0 of each item will be assumed to be the combo
+     * {@link #valueField}, while the value at index 1 is assumed to be the combo {@link #displayField}.
+     * </div></li></ul></div></li></ul></div>
+     * <p>See also <tt>{@link #mode}</tt>.</p>
+     */
+    /**
+     * @cfg {String} title If supplied, a header element is created containing this text and added into the top of
+     * the dropdown list (defaults to undefined, with no header element)
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "24", autocomplete: "off"},
+    /**
+     * @cfg {Number} listWidth The width (used as a parameter to {@link Ext.Element#setWidth}) of the dropdown
+     * list (defaults to the width of the ComboBox field).  See also <tt>{@link #minListWidth}
+     */
+    /**
+     * @cfg {String} displayField The underlying {@link Ext.data.Field#name data field name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field1'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p>See also <tt>{@link #valueField}</tt>.</p>
+     * <p><b>Note</b>: if using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a
+     * {@link Ext.grid.Column#renderer renderer} will be needed to show the displayField when the editor is not
+     * active.</p>
+     */
+    /**
+     * @cfg {String} valueField The underlying {@link Ext.data.Field#name data value name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field2'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p><b>Note</b>: use of a <tt>valueField</tt> requires the user to make a selection in order for a value to be
+     * mapped.  See also <tt>{@link #hiddenName}</tt>, <tt>{@link #hiddenValue}</tt>, and <tt>{@link #displayField}</tt>.</p>
+     */
+    /**
+     * @cfg {String} hiddenName If specified, a hidden form field with this name is dynamically generated to store the
+     * field's data value (defaults to the underlying DOM element's name). Required for the combo's value to automatically
+     * post during a form submission.  See also {@link #valueField}.
+     */
+    /**
+     * @cfg {String} hiddenId If <tt>{@link #hiddenName}</tt> is specified, <tt>hiddenId</tt> can also be provided
+     * to give the hidden field a unique id.  The <tt>hiddenId</tt> and combo {@link Ext.Component#id id} should be 
+     * different, since no two DOM nodes should share the same id.
+     */
+    /**
+     * @cfg {String} hiddenValue Sets the initial value of the hidden field if {@link #hiddenName} is
+     * specified to contain the selected {@link #valueField}, from the Store. Defaults to the configured
+     * <tt>{@link Ext.form.Field#value value}</tt>.
+     */
+    /**
+     * @cfg {String} listClass The CSS class to add to the predefined <tt>'x-combo-list'</tt> class
+     * applied the dropdown list element (defaults to '').
+     */
+    listClass : '',
+    /**
+     * @cfg {String} selectedClass CSS class to apply to the selected item in the dropdown list
+     * (defaults to <tt>'x-combo-selected'</tt>)
+     */
+    selectedClass : 'x-combo-selected',
+    /**
+     * @cfg {String} listEmptyText The empty text to display in the data view if no items are found.
+     * (defaults to '')
+     */
+    listEmptyText: '',
+    /**
+     * @cfg {String} triggerClass An additional CSS class used to style the trigger button.  The trigger will always
+     * get the class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-arrow-trigger'</tt> which displays a downward arrow icon).
+     */
+    triggerClass : 'x-form-arrow-trigger',
+    /**
+     * @cfg {Boolean/String} shadow <tt>true</tt> or <tt>"sides"</tt> for the default effect, <tt>"frame"</tt> for
+     * 4-way shadow, and <tt>"drop"</tt> for bottom-right
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String/Array} listAlign A valid anchor position value. See <tt>{@link Ext.Element#alignTo}</tt> for details
+     * on supported anchor positions and offsets. To specify x/y offsets as well, this value
+     * may be specified as an Array of <tt>{@link Ext.Element#alignTo}</tt> method arguments.</p>
+     * <pre><code>[ 'tl-bl?', [6,0] ]</code></pre>(defaults to <tt>'tl-bl?'</tt>)
+     */
+    listAlign : 'tl-bl?',
+    /**
+     * @cfg {Number} maxHeight The maximum height in pixels of the dropdown list before scrollbars are shown
+     * (defaults to <tt>300</tt>)
+     */
+    maxHeight : 300,
+    /**
+     * @cfg {Number} minHeight The minimum height in pixels of the dropdown list when the list is constrained by its
+     * distance to the viewport edges (defaults to <tt>90</tt>)
+     */
+    minHeight : 90,
+    /**
+     * @cfg {String} triggerAction The action to execute when the trigger is clicked.
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'query'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">{@link #doQuery run the query} using the {@link Ext.form.Field#getRawValue raw value}.</p></li>
+     * <li><b><tt>'all'</tt></b> :
+     * <p class="sub-desc">{@link #doQuery run the query} specified by the <tt>{@link #allQuery}</tt> config option</p></li>
+     * </ul></div>
+     * <p>See also <code>{@link #queryParam}</code>.</p>
+     */
+    triggerAction : 'query',
+    /**
+     * @cfg {Number} minChars The minimum number of characters the user must type before autocomplete and
+     * {@link #typeAhead} activate (defaults to <tt>4</tt> if <tt>{@link #mode} = 'remote'</tt> or <tt>0</tt> if
+     * <tt>{@link #mode} = 'local'</tt>, does not apply if
+     * <tt>{@link Ext.form.TriggerField#editable editable} = false</tt>).
+     */
+    minChars : 4,
+    /**
+     * @cfg {Boolean} autoSelect <tt>true</tt> to select the first result gathered by the data store (defaults
+     * to <tt>true</tt>).  A false value would require a manual selection from the dropdown list to set the components value
+     * unless the value of ({@link #typeAheadDelay}) were true.
+     */
+    autoSelect : true,
+    /**
+     * @cfg {Boolean} typeAhead <tt>true</tt> to populate and autoselect the remainder of the text being
+     * typed after a configurable delay ({@link #typeAheadDelay}) if it matches a known value (defaults
+     * to <tt>false</tt>)
+     */
+    typeAhead : false,
+    /**
+     * @cfg {Number} queryDelay The length of time in milliseconds to delay between the start of typing and
+     * sending the query to filter the dropdown list (defaults to <tt>500</tt> if <tt>{@link #mode} = 'remote'</tt>
+     * or <tt>10</tt> if <tt>{@link #mode} = 'local'</tt>)
+     */
+    queryDelay : 500,
+    /**
+     * @cfg {Number} pageSize If greater than <tt>0</tt>, a {@link Ext.PagingToolbar} is displayed in the
+     * footer of the dropdown list and the {@link #doQuery filter queries} will execute with page start and
+     * {@link Ext.PagingToolbar#pageSize limit} parameters. Only applies when <tt>{@link #mode} = 'remote'</tt>
+     * (defaults to <tt>0</tt>).
+     */
+    pageSize : 0,
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to select any existing text in the field immediately on focus.
+     * Only applies when <tt>{@link Ext.form.TriggerField#editable editable} = true</tt> (defaults to
+     * <tt>false</tt>).
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} queryParam Name of the query ({@link Ext.data.Store#baseParam baseParam} name for the store)
+     * as it will be passed on the querystring (defaults to <tt>'query'</tt>)
+     */
+    queryParam : 'query',
+    /**
+     * @cfg {String} loadingText The text to display in the dropdown list while data is loading.  Only applies
+     * when <tt>{@link #mode} = 'remote'</tt> (defaults to <tt>'Loading...'</tt>)
+     */
+    loadingText : 'Loading...',
+    /**
+     * @cfg {Boolean} resizable <tt>true</tt> to add a resize handle to the bottom of the dropdown list
+     * (creates an {@link Ext.Resizable} with 'se' {@link Ext.Resizable#pinned pinned} handles).
+     * Defaults to <tt>false</tt>.
+     */
+    resizable : false,
+    /**
+     * @cfg {Number} handleHeight The height in pixels of the dropdown list resize handle if
+     * <tt>{@link #resizable} = true</tt> (defaults to <tt>8</tt>)
+     */
+    handleHeight : 8,
+    /**
+     * @cfg {String} allQuery The text query to send to the server to return all records for the list
+     * with no filtering (defaults to '')
+     */
+    allQuery: '',
+    /**
+     * @cfg {String} mode Acceptable values are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'remote'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">Automatically loads the <tt>{@link #store}</tt> the <b>first</b> time the trigger
+     * is clicked. If you do not want the store to be automatically loaded the first time the trigger is
+     * clicked, set to <tt>'local'</tt> and manually load the store.  To force a requery of the store
+     * <b>every</b> time the trigger is clicked see <tt>{@link #lastQuery}</tt>.</p></li>
+     * <li><b><tt>'local'</tt></b> :
+     * <p class="sub-desc">ComboBox loads local data</p>
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    renderTo: document.body,
+    mode: 'local',
+    store: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',  // numeric value is the key
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]  // data is local
+    }),
+    valueField: 'myId',
+    displayField: 'displayText',
+    triggerAction: 'all'
+});
+     * </code></pre></li>
+     * </ul></div>
+     */
+    mode: 'remote',
+    /**
+     * @cfg {Number} minListWidth The minimum width of the dropdown list in pixels (defaults to <tt>70</tt>, will
+     * be ignored if <tt>{@link #listWidth}</tt> has a higher value)
+     */
+    minListWidth : 70,
+    /**
+     * @cfg {Boolean} forceSelection <tt>true</tt> to restrict the selected value to one of the values in the list,
+     * <tt>false</tt> to allow the user to set arbitrary text into the field (defaults to <tt>false</tt>)
+     */
+    forceSelection : false,
+    /**
+     * @cfg {Number} typeAheadDelay The length of time in milliseconds to wait until the typeahead text is displayed
+     * if <tt>{@link #typeAhead} = true</tt> (defaults to <tt>250</tt>)
+     */
+    typeAheadDelay : 250,
+    /**
+     * @cfg {String} valueNotFoundText When using a name/value combo, if the value passed to setValue is not found in
+     * the store, valueNotFoundText will be displayed as the field text if defined (defaults to undefined). If this
+     * default text is used, it means there is no value set and no validation will occur on this field.
+     */
+
+    /**
+     * @cfg {Boolean} lazyInit <tt>true</tt> to not initialize the list for this combo until the field is focused
+     * (defaults to <tt>true</tt>)
+     */
+    lazyInit : true,
+
+    /**
+     * @cfg {Boolean} clearFilterOnReset <tt>true</tt> to clear any filters on the store (when in local mode) when reset is called
+     * (defaults to <tt>true</tt>)
+     */
+    clearFilterOnReset : true,
+
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * If a hiddenName is specified, setting this to true will cause both the hidden field and the element to be submitted.
+     * Defaults to <tt>undefined</tt>.
+     */
+    submitValue: undefined,
+
+    /**
+     * The value of the match string used to filter the store. Delete this property to force a requery.
+     * Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'remote',
+    ...
+    listeners: {
+        // delete the previous query in the beforequery event or set
+        // combo.lastQuery = null (this will reload the store the next time it expands)
+        beforequery: function(qe){
+            delete qe.combo.lastQuery;
+        }
+    }
+});
+     * </code></pre>
+     * To make sure the filter in the store is not cleared the first time the ComboBox trigger is used
+     * configure the combo with <tt>lastQuery=''</tt>. Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'local',
+    triggerAction: 'all',
+    lastQuery: ''
+});
+     * </code></pre>
+     * @property lastQuery
+     * @type String
+     */
+
+    // private
+    initComponent : function(){
+        Ext.form.ComboBox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event expand
+             * Fires when the dropdown list is expanded
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'expand',
+            /**
+             * @event collapse
+             * Fires when the dropdown list is collapsed
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'collapse',
+
+            /**
+             * @event beforeselect
+             * Fires before a list item is selected. Return false to cancel the selection.
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'beforeselect',
+            /**
+             * @event select
+             * Fires when a list item is selected
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'select',
+            /**
+             * @event beforequery
+             * Fires before all queries are processed. Return false to cancel the query or set the queryEvent's
+             * cancel property to true.
+             * @param {Object} queryEvent An object that has these properties:<ul>
+             * <li><code>combo</code> : Ext.form.ComboBox <div class="sub-desc">This combo box</div></li>
+             * <li><code>query</code> : String <div class="sub-desc">The query</div></li>
+             * <li><code>forceAll</code> : Boolean <div class="sub-desc">True to force "all" query</div></li>
+             * <li><code>cancel</code> : Boolean <div class="sub-desc">Set to true to cancel the query</div></li>
+             * </ul>
+             */
+            'beforequery'
+        );
+        if(this.transform){
+            var s = Ext.getDom(this.transform);
+            if(!this.hiddenName){
+                this.hiddenName = s.name;
+            }
+            if(!this.store){
+                this.mode = 'local';
+                var d = [], opts = s.options;
+                for(var i = 0, len = opts.length;i < len; i++){
+                    var o = opts[i],
+                        value = (o.hasAttribute ? o.hasAttribute('value') : o.getAttributeNode('value').specified) ? o.value : o.text;
+                    if(o.selected && Ext.isEmpty(this.value, true)) {
+                        this.value = value;
+                    }
+                    d.push([value, o.text]);
+                }
+                this.store = new Ext.data.ArrayStore({
+                    idIndex: 0,
+                    fields: ['value', 'text'],
+                    data : d,
+                    autoDestroy: true
+                });
+                this.valueField = 'value';
+                this.displayField = 'text';
+            }
+            s.name = Ext.id(); // wipe out the name in case somewhere else they have a reference
+            if(!this.lazyRender){
+                this.target = true;
+                this.el = Ext.DomHelper.insertBefore(s, this.autoCreate || this.defaultAutoCreate);
+                this.render(this.el.parentNode, s);
+            }
+            Ext.removeNode(s);
+        }
+        //auto-configure store from local array data
+        else if(this.store){
+            this.store = Ext.StoreMgr.lookup(this.store);
+            if(this.store.autoCreated){
+                this.displayField = this.valueField = 'field1';
+                if(!this.store.expandData){
+                    this.displayField = 'field2';
+                }
+                this.mode = 'local';
+            }
+        }
+
+        this.selectedIndex = -1;
+        if(this.mode == 'local'){
+            if(!Ext.isDefined(this.initialConfig.queryDelay)){
+                this.queryDelay = 10;
+            }
+            if(!Ext.isDefined(this.initialConfig.minChars)){
+                this.minChars = 0;
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(this.hiddenName && !Ext.isDefined(this.submitValue)){
+            this.submitValue = false;
+        }
+        Ext.form.ComboBox.superclass.onRender.call(this, ct, position);
+        if(this.hiddenName){
+            this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName,
+                    id: (this.hiddenId || Ext.id())}, 'before', true);
+
+        }
+        if(Ext.isGecko){
+            this.el.dom.setAttribute('autocomplete', 'off');
+        }
+
+        if(!this.lazyInit){
+            this.initList();
+        }else{
+            this.on('focus', this.initList, this, {single: true});
+        }
+    },
+
+    // private
+    initValue : function(){
+        Ext.form.ComboBox.superclass.initValue.call(this);
+        if(this.hiddenField){
+            this.hiddenField.value =
+                Ext.value(Ext.isDefined(this.hiddenValue) ? this.hiddenValue : this.value, '');
+        }
+    },
+
+    getParentZIndex : function(){
+        var zindex;
+        if (this.ownerCt){
+            this.findParentBy(function(ct){
+                zindex = parseInt(ct.getPositionEl().getStyle('z-index'), 10);
+                return !!zindex;
+            });
+        }
+        return zindex;
+    },
+    
+    getZIndex : function(listParent){
+        listParent = listParent || Ext.getDom(this.getListParent() || Ext.getBody());
+        var zindex = parseInt(Ext.fly(listParent).getStyle('z-index'), 10);
+        if(!zindex){
+            zindex = this.getParentZIndex();
+        }
+        return (zindex || 12000) + 5;
+    },
+
+    // private
+    initList : function(){
+        if(!this.list){
+            var cls = 'x-combo-list',
+                listParent = Ext.getDom(this.getListParent() || Ext.getBody());
+
+            this.list = new Ext.Layer({
+                parentEl: listParent,
+                shadow: this.shadow,
+                cls: [cls, this.listClass].join(' '),
+                constrain:false,
+                zindex: this.getZIndex(listParent)
+            });
+
+            var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
+            this.list.setSize(lw, 0);
+            this.list.swallowEvent('mousewheel');
+            this.assetHeight = 0;
+            if(this.syncFont !== false){
+                this.list.setStyle('font-size', this.el.getStyle('font-size'));
+            }
+            if(this.title){
+                this.header = this.list.createChild({cls:cls+'-hd', html: this.title});
+                this.assetHeight += this.header.getHeight();
+            }
+
+            this.innerList = this.list.createChild({cls:cls+'-inner'});
+            this.mon(this.innerList, 'mouseover', this.onViewOver, this);
+            this.mon(this.innerList, 'mousemove', this.onViewMove, this);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+
+            if(this.pageSize){
+                this.footer = this.list.createChild({cls:cls+'-ft'});
+                this.pageTb = new Ext.PagingToolbar({
+                    store: this.store,
+                    pageSize: this.pageSize,
+                    renderTo:this.footer
+                });
+                this.assetHeight += this.footer.getHeight();
+            }
+
+            if(!this.tpl){
+                /**
+                * @cfg {String/Ext.XTemplate} tpl <p>The template string, or {@link Ext.XTemplate} instance to
+                * use to display each item in the dropdown list. The dropdown list is displayed in a
+                * DataView. See {@link #view}.</p>
+                * <p>The default template string is:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div class="x-combo-list-item">{' + this.displayField + '}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>Override the default value to create custom UI layouts for items in the list.
+                * For example:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div ext:qtip="{state}. {nick}" class="x-combo-list-item">{state}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>The template <b>must</b> contain one or more substitution parameters using field
+                * names from the Combo's</b> {@link #store Store}. In the example above an
+                * <pre>ext:qtip</pre> attribute is added to display other fields from the Store.</p>
+                * <p>To preserve the default visual look of list items, add the CSS class name
+                * <pre>x-combo-list-item</pre> to the template's container element.</p>
+                * <p>Also see {@link #itemSelector} for additional details.</p>
+                */
+                this.tpl = '<tpl for="."><div class="'+cls+'-item">{' + this.displayField + '}</div></tpl>';
+                /**
+                 * @cfg {String} itemSelector
+                 * <p>A simple CSS selector (e.g. div.some-class or span:first-child) that will be
+                 * used to determine what nodes the {@link #view Ext.DataView} which handles the dropdown
+                 * display will be working with.</p>
+                 * <p><b>Note</b>: this setting is <b>required</b> if a custom XTemplate has been
+                 * specified in {@link #tpl} which assigns a class other than <pre>'x-combo-list-item'</pre>
+                 * to dropdown list items</b>
+                 */
+            }
+
+            /**
+            * The {@link Ext.DataView DataView} used to display the ComboBox's options.
+            * @type Ext.DataView
+            */
+            this.view = new Ext.DataView({
+                applyTo: this.innerList,
+                tpl: this.tpl,
+                singleSelect: true,
+                selectedClass: this.selectedClass,
+                itemSelector: this.itemSelector || '.' + cls + '-item',
+                emptyText: this.listEmptyText,
+                deferEmptyText: false
+            });
+
+            this.mon(this.view, {
+                containerclick : this.onViewClick,
+                click : this.onViewClick,
+                scope :this
+            });
+
+            this.bindStore(this.store, true);
+
+            if(this.resizable){
+                this.resizer = new Ext.Resizable(this.list,  {
+                   pinned:true, handles:'se'
+                });
+                this.mon(this.resizer, 'resize', function(r, w, h){
+                    this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;
+                    this.listWidth = w;
+                    this.innerList.setWidth(w - this.list.getFrameWidth('lr'));
+                    this.restrictHeight();
+                }, this);
+
+                this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');
+            }
+        }
+    },
+
+    /**
+     * <p>Returns the element used to house this ComboBox's pop-up list. Defaults to the document body.</p>
+     * A custom implementation may be provided as a configuration option if the floating list needs to be rendered
+     * to a different Element. An example might be rendering the list inside a Menu so that clicking
+     * the list does not hide the Menu:<pre><code>
+var store = new Ext.data.ArrayStore({
+    autoDestroy: true,
+    fields: ['initials', 'fullname'],
+    data : [
+        ['FF', 'Fred Flintstone'],
+        ['BR', 'Barney Rubble']
+    ]
+});
+
+var combo = new Ext.form.ComboBox({
+    store: store,
+    displayField: 'fullname',
+    emptyText: 'Select a name...',
+    forceSelection: true,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon', //use iconCls if placing within menu to shift to right side of menu
+    mode: 'local',
+    selectOnFocus: true,
+    triggerAction: 'all',
+    typeAhead: true,
+    width: 135
+});
+
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+</code></pre>
+     */
+    getListParent : function() {
+        return document.body;
+    },
+
+    /**
+     * Returns the store associated with this combo.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    // private
+    bindStore : function(store, initial){
+        if(this.store && !initial){
+            if(this.store !== store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.onBeforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.collapse, this);
+            }
+            if(!store){
+                this.store = null;
+                if(this.view){
+                    this.view.bindStore(null);
+                }
+                if(this.pageTb){
+                    this.pageTb.bindStore(null);
+                }
+            }
+        }
+        if(store){
+            if(!initial) {
+                this.lastQuery = null;
+                if(this.pageTb) {
+                    this.pageTb.bindStore(store);
+                }
+            }
+
+            this.store = Ext.StoreMgr.lookup(store);
+            this.store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                load: this.onLoad,
+                exception: this.collapse
+            });
+
+            if(this.view){
+                this.view.bindStore(store);
+            }
+        }
+    },
+
+    reset : function(){
+        if(this.clearFilterOnReset && this.mode == 'local'){
+            this.store.clearFilter();
+        }
+        Ext.form.ComboBox.superclass.reset.call(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.ComboBox.superclass.initEvents.call(this);
+
+        /**
+         * @property keyNav
+         * @type Ext.KeyNav
+         * <p>A {@link Ext.KeyNav KeyNav} object which handles navigation keys for this ComboBox. This performs actions
+         * based on keystrokes typed when the input field is focused.</p>
+         * <p><b>After the ComboBox has been rendered</b>, you may override existing navigation key functionality,
+         * or add your own based upon key names as specified in the {@link Ext.KeyNav KeyNav} class.</p>
+         * <p>The function is executed in the scope (<code>this</code> reference of the ComboBox. Example:</p><pre><code>
+myCombo.keyNav.esc = function(e) {  // Override ESC handling function
+    this.collapse();                // Standard behaviour of Ext's ComboBox.
+    this.setValue(this.startValue); // We reset to starting value on ESC
+};
+myCombo.keyNav.tab = function() {   // Override TAB handling function
+    this.onViewClick(false);        // Select the currently highlighted row
+};
+</code></pre>
+         */
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "up" : function(e){
+                this.inKeyMode = true;
+                this.selectPrev();
+            },
+
+            "down" : function(e){
+                if(!this.isExpanded()){
+                    this.onTriggerClick();
+                }else{
+                    this.inKeyMode = true;
+                    this.selectNext();
+                }
+            },
+
+            "enter" : function(e){
+                this.onViewClick();
+            },
+
+            "esc" : function(e){
+                this.collapse();
+            },
+
+            "tab" : function(e){
+                if (this.forceSelection === true) {
+                    this.collapse();
+                } else {
+                    this.onViewClick(false);
+                }
+                return true;
+            },
+
+            scope : this,
+
+            doRelay : function(e, h, hname){
+                if(hname == 'down' || this.scope.isExpanded()){
+                    // this MUST be called before ComboBox#fireKey()
+                    var relay = Ext.KeyNav.prototype.doRelay.apply(this, arguments);
+                    if(!Ext.isIE && Ext.EventManager.useKeydown){
+                        // call Combo#fireKey() for browsers which use keydown event (except IE)
+                        this.scope.fireKey(e);
+                    }
+                    return relay;
+                }
+                return true;
+            },
+
+            forceKeyDown : true,
+            defaultEventAction: 'stopEvent'
+        });
+        this.queryDelay = Math.max(this.queryDelay || 10,
+                this.mode == 'local' ? 10 : 250);
+        this.dqTask = new Ext.util.DelayedTask(this.initQuery, this);
+        if(this.typeAhead){
+            this.taTask = new Ext.util.DelayedTask(this.onTypeAhead, this);
+        }
+        if(!this.enableKeyEvents){
+            this.mon(this.el, 'keyup', this.onKeyUp, this);
+        }
+    },
+
+
+    // private
+    onDestroy : function(){
+        if (this.dqTask){
+            this.dqTask.cancel();
+            this.dqTask = null;
+        }
+        this.bindStore(null);
+        Ext.destroy(
+            this.resizer,
+            this.view,
+            this.pageTb,
+            this.list
+        );
+        Ext.destroyMembers(this, 'hiddenField');
+        Ext.form.ComboBox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    fireKey : function(e){
+        if (!this.isExpanded()) {
+            Ext.form.ComboBox.superclass.fireKey.call(this, e);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.ComboBox.superclass.onResize.apply(this, arguments);
+        if(!isNaN(w) && this.isVisible() && this.list){
+            this.doResize(w);
+        }else{
+            this.bufferSize = w;
+        }
+    },
+
+    doResize: function(w){
+        if(!Ext.isDefined(this.listWidth)){
+            var lw = Math.max(w, this.minListWidth);
+            this.list.setWidth(lw);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.form.ComboBox.superclass.onEnable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = false;
+        }
+    },
+
+    // private
+    onDisable : function(){
+        Ext.form.ComboBox.superclass.onDisable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = true;
+        }
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        this.innerList.update(this.loadingText ?
+               '<div class="loading-indicator">'+this.loadingText+'</div>' : '');
+        this.restrictHeight();
+        this.selectedIndex = -1;
+    },
+
+    // private
+    onLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        if(this.store.getCount() > 0 || this.listEmptyText){
+            this.expand();
+            this.restrictHeight();
+            if(this.lastQuery == this.allQuery){
+                if(this.editable){
+                    this.el.dom.select();
+                }
+
+                if(this.autoSelect !== false && !this.selectByValue(this.value, true)){
+                    this.select(0, true);
+                }
+            }else{
+                if(this.autoSelect !== false){
+                    this.selectNext();
+                }
+                if(this.typeAhead && this.lastKey != Ext.EventObject.BACKSPACE && this.lastKey != Ext.EventObject.DELETE){
+                    this.taTask.delay(this.typeAheadDelay);
+                }
+            }
+        }else{
+            this.collapse();
+        }
+
+    },
+
+    // private
+    onTypeAhead : function(){
+        if(this.store.getCount() > 0){
+            var r = this.store.getAt(0);
+            var newValue = r.data[this.displayField];
+            var len = newValue.length;
+            var selStart = this.getRawValue().length;
+            if(selStart != len){
+                this.setRawValue(newValue);
+                this.selectText(selStart, newValue.length);
+            }
+        }
+    },
+
+    // private
+    assertValue : function(){
+        var val = this.getRawValue(),
+            rec;
+
+        if(this.valueField && Ext.isDefined(this.value)){
+            rec = this.findRecord(this.valueField, this.value);
+        }
+        if(!rec || rec.get(this.displayField) != val){
+            rec = this.findRecord(this.displayField, val);
+        }
+        if(!rec && this.forceSelection){
+            if(val.length > 0 && val != this.emptyText){
+                this.el.dom.value = Ext.value(this.lastSelectionText, '');
+                this.applyEmptyText();
+            }else{
+                this.clearValue();
+            }
+        }else{
+            if(rec && this.valueField){
+                // onSelect may have already set the value and by doing so
+                // set the display field properly.  Let's not wipe out the
+                // valueField here by just sending the displayField.
+                if (this.value == val){
+                    return;
+                }
+                val = rec.get(this.valueField || this.displayField);
+            }
+            this.setValue(val);
+        }
+    },
+
+    // private
+    onSelect : function(record, index){
+        if(this.fireEvent('beforeselect', this, record, index) !== false){
+            this.setValue(record.data[this.valueField || this.displayField]);
+            this.collapse();
+            this.fireEvent('select', this, record, index);
+        }
+    },
+
+    // inherit docs
+    getName: function(){
+        var hf = this.hiddenField;
+        return hf && hf.name ? hf.name : this.hiddenName || Ext.form.ComboBox.superclass.getName.call(this);
+    },
+
+    /**
+     * Returns the currently selected field value or empty string if no value is set.
+     * @return {String} value The selected value
+     */
+    getValue : function(){
+        if(this.valueField){
+            return Ext.isDefined(this.value) ? this.value : '';
+        }else{
+            return Ext.form.ComboBox.superclass.getValue.call(this);
+        }
+    },
+
+    /**
+     * Clears any text/value currently set in the field
+     */
+    clearValue : function(){
+        if(this.hiddenField){
+            this.hiddenField.value = '';
+        }
+        this.setRawValue('');
+        this.lastSelectionText = '';
+        this.applyEmptyText();
+        this.value = '';
+    },
+
+    /**
+     * Sets the specified value into the field.  If the value finds a match, the corresponding record text
+     * will be displayed in the field.  If the value does not match the data value of an existing item,
+     * and the valueNotFoundText config option is defined, it will be displayed as the default field text.
+     * Otherwise the field will be blank (although the value will still be set).
+     * @param {String} value The value to match
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var text = v;
+        if(this.valueField){
+            var r = this.findRecord(this.valueField, v);
+            if(r){
+                text = r.data[this.displayField];
+            }else if(Ext.isDefined(this.valueNotFoundText)){
+                text = this.valueNotFoundText;
+            }
+        }
+        this.lastSelectionText = text;
+        if(this.hiddenField){
+            this.hiddenField.value = Ext.value(v, '');
+        }
+        Ext.form.ComboBox.superclass.setValue.call(this, text);
+        this.value = v;
+        return this;
+    },
+
+    // private
+    findRecord : function(prop, value){
+        var record;
+        if(this.store.getCount() > 0){
+            this.store.each(function(r){
+                if(r.data[prop] == value){
+                    record = r;
+                    return false;
+                }
+            });
+        }
+        return record;
+    },
+
+    // private
+    onViewMove : function(e, t){
+        this.inKeyMode = false;
+    },
+
+    // private
+    onViewOver : function(e, t){
+        if(this.inKeyMode){ // prevent key nav and mouse over conflicts
+            return;
+        }
+        var item = this.view.findItemFromChild(t);
+        if(item){
+            var index = this.view.indexOf(item);
+            this.select(index, false);
+        }
+    },
+
+    // private
+    onViewClick : function(doFocus){
+        var index = this.view.getSelectedIndexes()[0],
+            s = this.store,
+            r = s.getAt(index);
+        if(r){
+            this.onSelect(r, index);
+        }else {
+            this.collapse();
+        }
+        if(doFocus !== false){
+            this.el.focus();
+        }
+    },
+
+
+    // private
+    restrictHeight : function(){
+        this.innerList.dom.style.height = '';
+        var inner = this.innerList.dom,
+            pad = this.list.getFrameWidth('tb') + (this.resizable ? this.handleHeight : 0) + this.assetHeight,
+            h = Math.max(inner.clientHeight, inner.offsetHeight, inner.scrollHeight),
+            ha = this.getPosition()[1]-Ext.getBody().getScroll().top,
+            hb = Ext.lib.Dom.getViewHeight()-ha-this.getSize().height,
+            space = Math.max(ha, hb, this.minHeight || 0)-this.list.shadowOffset-pad-5;
+
+        h = Math.min(h, space, this.maxHeight);
+
+        this.innerList.setHeight(h);
+        this.list.beginUpdate();
+        this.list.setHeight(h+pad);
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+        this.list.endUpdate();
+    },
+
+    /**
+     * Returns true if the dropdown list is expanded, else false.
+     */
+    isExpanded : function(){
+        return this.list && this.list.isVisible();
+    },
+
+    /**
+     * Select an item in the dropdown list by its data value. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {String} value The data value of the item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     * @return {Boolean} True if the value matched an item in the list, else false
+     */
+    selectByValue : function(v, scrollIntoView){
+        if(!Ext.isEmpty(v, true)){
+            var r = this.findRecord(this.valueField || this.displayField, v);
+            if(r){
+                this.select(this.store.indexOf(r), scrollIntoView);
+                return true;
+            }
+        }
+        return false;
+    },
+
+    /**
+     * Select an item in the dropdown list by its numeric index in the list. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {Number} index The zero-based index of the list item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     */
+    select : function(index, scrollIntoView){
+        this.selectedIndex = index;
+        this.view.select(index);
+        if(scrollIntoView !== false){
+            var el = this.view.getNode(index);
+            if(el){
+                this.innerList.scrollChildIntoView(el, false);
+            }
+        }
+
+    },
+
+    // private
+    selectNext : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex < ct-1){
+                this.select(this.selectedIndex+1);
+            }
+        }
+    },
+
+    // private
+    selectPrev : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex !== 0){
+                this.select(this.selectedIndex-1);
+            }
+        }
+    },
+
+    // private
+    onKeyUp : function(e){
+        var k = e.getKey();
+        if(this.editable !== false && this.readOnly !== true && (k == e.BACKSPACE || !e.isSpecialKey())){
+
+            this.lastKey = k;
+            this.dqTask.delay(this.queryDelay);
+        }
+        Ext.form.ComboBox.superclass.onKeyUp.call(this, e);
+    },
+
+    // private
+    validateBlur : function(){
+        return !this.list || !this.list.isVisible();
+    },
+
+    // private
+    initQuery : function(){
+        this.doQuery(this.getRawValue());
+    },
+
+    // private
+    beforeBlur : function(){
+        this.assertValue();
+    },
+
+    // private
+    postBlur  : function(){
+        Ext.form.ComboBox.superclass.postBlur.call(this);
+        this.collapse();
+        this.inKeyMode = false;
+    },
+
+    /**
+     * Execute a query to filter the dropdown list.  Fires the {@link #beforequery} event prior to performing the
+     * query allowing the query action to be canceled if needed.
+     * @param {String} query The SQL query to execute
+     * @param {Boolean} forceAll <tt>true</tt> to force the query to execute even if there are currently fewer
+     * characters in the field than the minimum specified by the <tt>{@link #minChars}</tt> config option.  It
+     * also clears any filter previously saved in the current store (defaults to <tt>false</tt>)
+     */
+    doQuery : function(q, forceAll){
+        q = Ext.isEmpty(q) ? '' : q;
+        var qe = {
+            query: q,
+            forceAll: forceAll,
+            combo: this,
+            cancel:false
+        };
+        if(this.fireEvent('beforequery', qe)===false || qe.cancel){
+            return false;
+        }
+        q = qe.query;
+        forceAll = qe.forceAll;
+        if(forceAll === true || (q.length >= this.minChars)){
+            if(this.lastQuery !== q){
+                this.lastQuery = q;
+                if(this.mode == 'local'){
+                    this.selectedIndex = -1;
+                    if(forceAll){
+                        this.store.clearFilter();
+                    }else{
+                        this.store.filter(this.displayField, q);
+                    }
+                    this.onLoad();
+                }else{
+                    this.store.baseParams[this.queryParam] = q;
+                    this.store.load({
+                        params: this.getParams(q)
+                    });
+                    this.expand();
+                }
+            }else{
+                this.selectedIndex = -1;
+                this.onLoad();
+            }
+        }
+    },
+
+    // private
+    getParams : function(q){
+        var params = {},
+            paramNames = this.store.paramNames;
+        if(this.pageSize){
+            params[paramNames.start] = 0;
+            params[paramNames.limit] = this.pageSize;
+        }
+        return params;
+    },
+
+    /**
+     * Hides the dropdown list if it is currently expanded. Fires the {@link #collapse} event on completion.
+     */
+    collapse : function(){
+        if(!this.isExpanded()){
+            return;
+        }
+        this.list.hide();
+        Ext.getDoc().un('mousewheel', this.collapseIf, this);
+        Ext.getDoc().un('mousedown', this.collapseIf, this);
+        this.fireEvent('collapse', this);
+    },
+
+    // private
+    collapseIf : function(e){
+        if(!this.isDestroyed && !e.within(this.wrap) && !e.within(this.list)){
+            this.collapse();
+        }
+    },
+
+    /**
+     * Expands the dropdown list if it is currently hidden. Fires the {@link #expand} event on completion.
+     */
+    expand : function(){
+        if(this.isExpanded() || !this.hasFocus){
+            return;
+        }
+
+        if(this.title || this.pageSize){
+            this.assetHeight = 0;
+            if(this.title){
+                this.assetHeight += this.header.getHeight();
+            }
+            if(this.pageSize){
+                this.assetHeight += this.footer.getHeight();
+            }
+        }
+
+        if(this.bufferSize){
+            this.doResize(this.bufferSize);
+            delete this.bufferSize;
+        }
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+
+        // zindex can change, re-check it and set it if necessary
+        this.list.setZIndex(this.getZIndex());
+        this.list.show();
+        if(Ext.isGecko2){
+            this.innerList.setOverflow('auto'); // necessary for FF 2.0/Mac
+        }
+        this.mon(Ext.getDoc(), {
+            scope: this,
+            mousewheel: this.collapseIf,
+            mousedown: this.collapseIf
+        });
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function
+    onTriggerClick : function(){
+        if(this.readOnly || this.disabled){
+            return;
+        }
+        if(this.isExpanded()){
+            this.collapse();
+            this.el.focus();
+        }else {
+            this.onFocus({});
+            if(this.triggerAction == 'all') {
+                this.doQuery(this.allQuery, true);
+            } else {
+                this.doQuery(this.getRawValue());
+            }
+            this.el.focus();
+        }
+    }
+
+    /**
+     * @hide
+     * @method autoSize
+     */
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+
+});
+Ext.reg('combo', Ext.form.ComboBox);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TimeField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TimeField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/TimeField.js	(revision 76)
@@ -0,0 +1,188 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.TimeField
+ * @extends Ext.form.ComboBox
+ * Provides a time input field with a time dropdown and automatic time validation.  Example usage:
+ * <pre><code>
+new Ext.form.TimeField({
+    minValue: '9:00 AM',
+    maxValue: '6:00 PM',
+    increment: 30
+});
+</code></pre>
+ * @constructor
+ * Create a new TimeField
+ * @param {Object} config
+ * @xtype timefield
+ */
+Ext.form.TimeField = Ext.extend(Ext.form.ComboBox, {
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    minValue : undefined,
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    maxValue : undefined,
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before minValue (defaults to
+     * 'The time in this field must be equal to or after {0}').
+     */
+    minText : "The time in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the time is after maxValue (defaults to
+     * 'The time in this field must be equal to or before {0}').
+     */
+    maxText : "The time in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the time in the field is invalid (defaults to
+     * '{value} is not a valid time').
+     */
+    invalidText : "{0} is not a valid time",
+    /**
+     * @cfg {String} format
+     * The default time format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to 'g:i A', e.g., '3:15 PM').  For 24-hour time
+     * format try 'H:i' instead.
+     */
+    format : "g:i A",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "|" to try when parsing a user input value and it doesn't match the defined
+     * format (defaults to 'g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A').
+     */
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",
+    /**
+     * @cfg {Number} increment
+     * The number of minutes between each time value in the list (defaults to 15).
+     */
+    increment: 15,
+
+    // private override
+    mode: 'local',
+    // private override
+    triggerAction: 'all',
+    // private override
+    typeAhead: false,
+
+    // private - This is the date to use when generating time values in the absence of either minValue
+    // or maxValue.  Using the current date causes DST issues on DST boundary dates, so this is an
+    // arbitrary "safe" date that can be any date aside from DST boundary dates.
+    initDate: '1/1/2008',
+
+    initDateFormat: 'j/n/Y',
+
+    // private
+    initComponent : function(){
+        if(Ext.isDefined(this.minValue)){
+            this.setMinValue(this.minValue, true);
+        }
+        if(Ext.isDefined(this.maxValue)){
+            this.setMaxValue(this.maxValue, true);
+        }
+        if(!this.store){
+            this.generateStore(true);
+        }
+        Ext.form.TimeField.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Replaces any existing {@link #minValue} with the new time and refreshes the store.
+     * @param {Date/String} value The minimum time that can be selected
+     */
+    setMinValue: function(value, /* private */ initial){
+        this.setLimit(value, true, initial);
+        return this;
+    },
+
+    /**
+     * Replaces any existing {@link #maxValue} with the new time and refreshes the store.
+     * @param {Date/String} value The maximum time that can be selected
+     */
+    setMaxValue: function(value, /* private */ initial){
+        this.setLimit(value, false, initial);
+        return this;
+    },
+
+    // private
+    generateStore: function(initial){
+        var min = this.minValue || new Date(this.initDate).clearTime(),
+            max = this.maxValue || new Date(this.initDate).clearTime().add('mi', (24 * 60) - 1),
+            times = [];
+
+        while(min <= max){
+            times.push(min.dateFormat(this.format));
+            min = min.add('mi', this.increment);
+        }
+        this.bindStore(times, initial);
+    },
+
+    // private
+    setLimit: function(value, isMin, initial){
+        var d;
+        if(Ext.isString(value)){
+            d = this.parseDate(value);
+        }else if(Ext.isDate(value)){
+            d = value;
+        }
+        if(d){
+            var val = new Date(this.initDate).clearTime();
+            val.setHours(d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds());
+            this[isMin ? 'minValue' : 'maxValue'] = val;
+            if(!initial){
+                this.generateStore();
+            }
+        }
+    },
+
+    // inherited docs
+    getValue : function(){
+        var v = Ext.form.TimeField.superclass.getValue.call(this);
+        return this.formatDate(this.parseDate(v)) || '';
+    },
+
+    // inherited docs
+    setValue : function(value){
+        return Ext.form.TimeField.superclass.setValue.call(this, this.formatDate(this.parseDate(value)));
+    },
+
+    // private overrides
+    validateValue : Ext.form.DateField.prototype.validateValue,
+
+    formatDate : Ext.form.DateField.prototype.formatDate,
+
+    parseDate: function(value) {
+        if (!value || Ext.isDate(value)) {
+            return value;
+        }
+
+        var id = this.initDate + ' ',
+            idf = this.initDateFormat + ' ',
+            v = Date.parseDate(id + value, idf + this.format), // *** handle DST. note: this.format is a TIME-only format
+            af = this.altFormats;
+
+        if (!v && af) {
+            if (!this.altFormatsArray) {
+                this.altFormatsArray = af.split("|");
+            }
+            for (var i = 0, afa = this.altFormatsArray, len = afa.length; i < len && !v; i++) {
+                v = Date.parseDate(id + value, idf + afa[i]);
+            }
+        }
+
+        return v;
+    }
+});
+Ext.reg('timefield', Ext.form.TimeField);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Form.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Form.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/Form.js	(revision 76)
@@ -0,0 +1,358 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.FormPanel
+ * @extends Ext.Panel
+ * <p>Standard form container.</p>
+ *
+ * <p><b><u>Layout</u></b></p>
+ * <p>By default, FormPanel is configured with <tt>layout:'form'</tt> to use an {@link Ext.layout.FormLayout}
+ * layout manager, which styles and renders fields and labels correctly. When nesting additional Containers
+ * within a FormPanel, you should ensure that any descendant Containers which host input Fields use the
+ * {@link Ext.layout.FormLayout} layout manager.</p>
+ *
+ * <p><b><u>BasicForm</u></b></p>
+ * <p>Although <b>not listed</b> as configuration options of FormPanel, the FormPanel class accepts all
+ * of the config options required to configure its internal {@link Ext.form.BasicForm} for:
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.BasicForm#fileUpload file uploads}</li>
+ * <li>functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form</li>
+ * </ul></div>
+ *
+ * <p><b>Note</b>: If subclassing FormPanel, any configuration options for the BasicForm must be applied to
+ * the <tt><b>initialConfig</b></tt> property of the FormPanel. Applying {@link Ext.form.BasicForm BasicForm}
+ * configuration settings to <b><tt>this</tt></b> will <b>not</b> affect the BasicForm's configuration.</p>
+ *
+ * <p><b><u>Form Validation</u></b></p>
+ * <p>For information on form validation see the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.TextField}</li>
+ * <li>{@link Ext.form.VTypes}</li>
+ * <li>{@link Ext.form.BasicForm#doAction BasicForm.doAction <b>clientValidation</b> notes}</li>
+ * <li><tt>{@link Ext.form.FormPanel#monitorValid monitorValid}</tt></li>
+ * </ul></div>
+ *
+ * <p><b><u>Form Submission</u></b></p>
+ * <p>By default, Ext Forms are submitted through Ajax, using {@link Ext.form.Action}. To enable normal browser
+ * submission of the {@link Ext.form.BasicForm BasicForm} contained in this FormPanel, see the
+ * <tt><b>{@link Ext.form.BasicForm#standardSubmit standardSubmit}</b></tt> option.</p>
+ *
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype form
+ */
+Ext.FormPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} formId (optional) The id of the FORM tag (defaults to an auto-generated id).
+     */
+    /**
+     * @cfg {Boolean} hideLabels
+     * <p><tt>true</tt> to hide field labels by default (sets <tt>display:none</tt>). Defaults to
+     * <tt>false</tt>.</p>
+     * <p>Also see {@link Ext.Component}.<tt>{@link Ext.Component#hideLabel hideLabel}</tt>.
+     */
+    /**
+     * @cfg {Number} labelPad
+     * The default padding in pixels for field labels (defaults to <tt>5</tt>). <tt>labelPad</tt> only
+     * applies if <tt>{@link #labelWidth}</tt> is also specified, otherwise it will be ignored.
+     */
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.Component}.<tt>{@link Ext.Component#labelSeparator labelSeparator}</tt>
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels in pixels. This property cascades to child containers
+     * and can be overridden on any child container (e.g., a fieldset can specify a different <tt>labelWidth</tt>
+     * for its fields) (defaults to <tt>100</tt>).
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the x-form-item of fields. This property cascades to child containers.
+     */
+    /**
+     * @cfg {Array} buttons
+     * An array of {@link Ext.Button}s or {@link Ext.Button} configs used to add buttons to the footer of this FormPanel.<br>
+     * <p>Buttons in the footer of a FormPanel may be configured with the option <tt>formBind: true</tt>. This causes
+     * the form's {@link #monitorValid valid state monitor task} to enable/disable those Buttons depending on
+     * the form's valid/invalid state.</p>
+     */
+
+
+    /**
+     * @cfg {Number} minButtonWidth Minimum width of all buttons in pixels (defaults to <tt>75</tt>).
+     */
+    minButtonWidth : 75,
+
+    /**
+     * @cfg {String} labelAlign The label alignment value used for the <tt>text-align</tt> specification
+     * for the <b>container</b>. Valid values are <tt>"left</tt>", <tt>"top"</tt> or <tt>"right"</tt>
+     * (defaults to <tt>"left"</tt>). This property cascades to child <b>containers</b> and can be
+     * overridden on any child <b>container</b> (e.g., a fieldset can specify a different <tt>labelAlign</tt>
+     * for its fields).
+     */
+    labelAlign : 'left',
+
+    /**
+     * @cfg {Boolean} monitorValid If <tt>true</tt>, the form monitors its valid state <b>client-side</b> and
+     * regularly fires the {@link #clientvalidation} event passing that state.<br>
+     * <p>When monitoring valid state, the FormPanel enables/disables any of its configured
+     * {@link #buttons} which have been configured with <code>formBind: true</code> depending
+     * on whether the {@link Ext.form.BasicForm#isValid form is valid} or not. Defaults to <tt>false</tt></p>
+     */
+    monitorValid : false,
+
+    /**
+     * @cfg {Number} monitorPoll The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200)
+     */
+    monitorPoll : 200,
+
+    /**
+     * @cfg {String} layout Defaults to <tt>'form'</tt>.  Normally this configuration property should not be altered.
+     * For additional details see {@link Ext.layout.FormLayout} and {@link Ext.Container#layout Ext.Container.layout}.
+     */
+    layout : 'form',
+
+    // private
+    initComponent : function(){
+        this.form = this.createForm();
+        Ext.FormPanel.superclass.initComponent.call(this);
+
+        this.bodyCfg = {
+            tag: 'form',
+            cls: this.baseCls + '-body',
+            method : this.method || 'POST',
+            id : this.formId || Ext.id()
+        };
+        if(this.fileUpload) {
+            this.bodyCfg.enctype = 'multipart/form-data';
+        }
+        this.initItems();
+
+        this.addEvents(
+            /**
+             * @event clientvalidation
+             * If the monitorValid config option is true, this event fires repetitively to notify of valid state
+             * @param {Ext.form.FormPanel} this
+             * @param {Boolean} valid true if the form has passed client-side validation
+             */
+            'clientvalidation'
+        );
+
+        this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);
+    },
+
+    // private
+    createForm : function(){
+        var config = Ext.applyIf({listeners: {}}, this.initialConfig);
+        return new Ext.form.BasicForm(null, config);
+    },
+
+    // private
+    initFields : function(){
+        var f = this.form;
+        var formPanel = this;
+        var fn = function(c){
+            if(formPanel.isField(c)){
+                f.add(c);
+            }else if(c.findBy && c != formPanel){
+                formPanel.applySettings(c);
+                //each check required for check/radio groups.
+                if(c.items && c.items.each){
+                    c.items.each(fn, this);
+                }
+            }
+        };
+        this.items.each(fn, this);
+    },
+
+    // private
+    applySettings: function(c){
+        var ct = c.ownerCt;
+        Ext.applyIf(c, {
+            labelAlign: ct.labelAlign,
+            labelWidth: ct.labelWidth,
+            itemCls: ct.itemCls
+        });
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.form.el;
+    },
+
+    /**
+     * Provides access to the {@link Ext.form.BasicForm Form} which this Panel contains.
+     * @return {Ext.form.BasicForm} The {@link Ext.form.BasicForm Form} which this Panel contains.
+     */
+    getForm : function(){
+        return this.form;
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.initFields();
+        Ext.FormPanel.superclass.onRender.call(this, ct, position);
+        this.form.initEl(this.body);
+    },
+
+    // private
+    beforeDestroy : function(){
+        this.stopMonitoring();
+        this.form.destroy(true);
+        Ext.FormPanel.superclass.beforeDestroy.call(this);
+    },
+
+    // Determine if a Component is usable as a form Field.
+    isField : function(c) {
+        return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid;
+    },
+
+    // private
+    initEvents : function(){
+        Ext.FormPanel.superclass.initEvents.call(this);
+        // Listeners are required here to catch bubbling events from children.
+        this.on({
+            scope: this,
+            add: this.onAddEvent,
+            remove: this.onRemoveEvent
+        });
+        if(this.monitorValid){ // initialize after render
+            this.startMonitoring();
+        }
+    },
+
+    // private
+    onAdd: function(c){
+        Ext.FormPanel.superclass.onAdd.call(this, c);
+        this.processAdd(c);
+    },
+
+    // private
+    onAddEvent: function(ct, c){
+        if(ct !== this){
+            this.processAdd(c);
+        }
+    },
+
+    // private
+    processAdd : function(c){
+        // If a single form Field, add it
+        if(this.isField(c)){
+            this.form.add(c);
+        // If a Container, add any Fields it might contain
+        }else if(c.findBy){
+            this.applySettings(c);
+            this.form.add.apply(this.form, c.findBy(this.isField));
+        }
+    },
+
+    // private
+    onRemove: function(c){
+        Ext.FormPanel.superclass.onRemove.call(this, c);
+        this.processRemove(c);
+    },
+
+    onRemoveEvent: function(ct, c){
+        if(ct !== this){
+            this.processRemove(c);
+        }
+    },
+
+    // private
+    processRemove: function(c){
+        if(!this.destroying){
+            // If a single form Field, remove it
+            if(this.isField(c)){
+                this.form.remove(c);
+            // If a Container, its already destroyed by the time it gets here.  Remove any references to destroyed fields.
+            }else if (c.findBy){
+                Ext.each(c.findBy(this.isField), this.form.remove, this.form);
+                /*
+                 * This isn't the most efficient way of getting rid of the items, however it's the most
+                 * correct, which in this case is most important.
+                 */
+                this.form.cleanDestroyed();
+            }
+        }
+    },
+
+    /**
+     * Starts monitoring of the valid state of this form. Usually this is done by passing the config
+     * option "monitorValid"
+     */
+    startMonitoring : function(){
+        if(!this.validTask){
+            this.validTask = new Ext.util.TaskRunner();
+            this.validTask.start({
+                run : this.bindHandler,
+                interval : this.monitorPoll || 200,
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Stops monitoring of the valid state of this form
+     */
+    stopMonitoring : function(){
+        if(this.validTask){
+            this.validTask.stopAll();
+            this.validTask = null;
+        }
+    },
+
+    /**
+     * This is a proxy for the underlying BasicForm's {@link Ext.form.BasicForm#load} call.
+     * @param {Object} options The options to pass to the action (see {@link Ext.form.BasicForm#doAction} for details)
+     */
+    load : function(){
+        this.form.load.apply(this.form, arguments);
+    },
+
+    // private
+    onDisable : function(){
+        Ext.FormPanel.superclass.onDisable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.disable();
+            });
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.FormPanel.superclass.onEnable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.enable();
+            });
+        }
+    },
+
+    // private
+    bindHandler : function(){
+        var valid = true;
+        this.form.items.each(function(f){
+            if(!f.isValid(true)){
+                valid = false;
+                return false;
+            }
+        });
+        if(this.fbar){
+            var fitems = this.fbar.items.items;
+            for(var i = 0, len = fitems.length; i < len; i++){
+                var btn = fitems[i];
+                if(btn.formBind === true && btn.disabled === valid){
+                    btn.setDisabled(!valid);
+                }
+            }
+        }
+        this.fireEvent('clientvalidation', this, valid);
+    }
+});
+Ext.reg('form', Ext.FormPanel);
+
+Ext.form.FormPanel = Ext.FormPanel;
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CheckboxGroup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CheckboxGroup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/form/CheckboxGroup.js	(revision 76)
@@ -0,0 +1,496 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.form.CheckboxGroup
+ * @extends Ext.form.Field
+ * <p>A grouping container for {@link Ext.form.Checkbox} controls.</p>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var myCheckboxGroup = new Ext.form.CheckboxGroup({
+    id:'myGroup',
+    xtype: 'checkboxgroup',
+    fieldLabel: 'Single Column',
+    itemCls: 'x-check-group-alt',
+    // Put all controls in a single column with width 100%
+    columns: 1,
+    items: [
+        {boxLabel: 'Item 1', name: 'cb-col-1'},
+        {boxLabel: 'Item 2', name: 'cb-col-2', checked: true},
+        {boxLabel: 'Item 3', name: 'cb-col-3'}
+    ]
+});
+ * </code></pre>
+ * @constructor
+ * Creates a new CheckboxGroup
+ * @param {Object} config Configuration options
+ * @xtype checkboxgroup
+ */
+Ext.form.CheckboxGroup = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Checkbox Checkbox}es or Checkbox config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {String/Number/Array} columns Specifies the number of columns to use when displaying grouped
+     * checkbox/radio controls using automatic layout.  This config can take several types of values:
+     * <ul><li><b>'auto'</b> : <p class="sub-desc">The controls will be rendered one per column on one row and the width
+     * of each column will be evenly distributed based on the width of the overall field container. This is the default.</p></li>
+     * <li><b>Number</b> : <p class="sub-desc">If you specific a number (e.g., 3) that number of columns will be
+     * created and the contained controls will be automatically distributed based on the value of {@link #vertical}.</p></li>
+     * <li><b>Array</b> : Object<p class="sub-desc">You can also specify an array of column widths, mixing integer
+     * (fixed width) and float (percentage width) values as needed (e.g., [100, .25, .75]). Any integer values will
+     * be rendered first, then any float values will be calculated as a percentage of the remaining space. Float
+     * values do not have to add up to 1 (100%) although if you want the controls to take up the entire field
+     * container you should do so.</p></li></ul>
+     */
+    columns : 'auto',
+    /**
+     * @cfg {Boolean} vertical True to distribute contained controls across columns, completely filling each column
+     * top to bottom before starting on the next column.  The number of controls in each column will be automatically
+     * calculated to keep columns as even as possible.  The default value is false, so that controls will be added
+     * to columns one at a time, completely filling each row left to right before starting on the next row.
+     */
+    vertical : false,
+    /**
+     * @cfg {Boolean} allowBlank False to validate that at least one item in the group is checked (defaults to true).
+     * If no items are selected at validation time, {@link @blankText} will be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails (defaults to "You must
+     * select at least one item in this group")
+     */
+    blankText : "You must select at least one item in this group",
+
+    // private
+    defaultType : 'checkbox',
+
+    // private
+    groupCls : 'x-form-check-group',
+
+    // private
+    initComponent: function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires when the state of a child checkbox changes.
+             * @param {Ext.form.CheckboxGroup} this
+             * @param {Array} checked An array containing the checked boxes.
+             */
+            'change'
+        );
+        this.on('change', this.validate, this);
+        Ext.form.CheckboxGroup.superclass.initComponent.call(this);
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var panelCfg = {
+                autoEl: {
+                    id: this.id
+                },
+                cls: this.groupCls,
+                layout: 'column',
+                renderTo: ct,
+                bufferResize: false // Default this to false, since it doesn't really have a proper ownerCt.
+            };
+            var colCfg = {
+                xtype: 'container',
+                defaultType: this.defaultType,
+                layout: 'form',
+                defaults: {
+                    hideLabel: true,
+                    anchor: '100%'
+                }
+            };
+
+            if(this.items[0].items){
+
+                // The container has standard ColumnLayout configs, so pass them in directly
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: this.items.length},
+                    defaults: this.defaults,
+                    items: this.items
+                });
+                for(var i=0, len=this.items.length; i<len; i++){
+                    Ext.applyIf(this.items[i], colCfg);
+                }
+
+            }else{
+
+                // The container has field item configs, so we have to generate the column
+                // panels first then move the items into the columns as needed.
+
+                var numCols, cols = [];
+
+                if(typeof this.columns == 'string'){ // 'auto' so create a col per item
+                    this.columns = this.items.length;
+                }
+                if(!Ext.isArray(this.columns)){
+                    var cs = [];
+                    for(var i=0; i<this.columns; i++){
+                        cs.push((100/this.columns)*.01); // distribute by even %
+                    }
+                    this.columns = cs;
+                }
+
+                numCols = this.columns.length;
+
+                // Generate the column configs with the correct width setting
+                for(var i=0; i<numCols; i++){
+                    var cc = Ext.apply({items:[]}, colCfg);
+                    cc[this.columns[i] <= 1 ? 'columnWidth' : 'width'] = this.columns[i];
+                    if(this.defaults){
+                        cc.defaults = Ext.apply(cc.defaults || {}, this.defaults);
+                    }
+                    cols.push(cc);
+                };
+
+                // Distribute the original items into the columns
+                if(this.vertical){
+                    var rows = Math.ceil(this.items.length / numCols), ri = 0;
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        if(i>0 && i%rows==0){
+                            ri++;
+                        }
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ri].items.push(this.items[i]);
+                    };
+                }else{
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        var ci = i % numCols;
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ci].items.push(this.items[i]);
+                    };
+                }
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: numCols},
+                    items: cols
+                });
+            }
+
+            this.panel = new Ext.Container(panelCfg);
+            this.panel.ownerCt = this;
+            this.el = this.panel.getEl();
+
+            if(this.forId && this.itemCls){
+                var l = this.el.up(this.itemCls).child('label', true);
+                if(l){
+                    l.setAttribute('htmlFor', this.forId);
+                }
+            }
+
+            var fields = this.panel.findBy(function(c){
+                return c.isFormField;
+            }, this);
+
+            this.items = new Ext.util.MixedCollection();
+            this.items.addAll(fields);
+        }
+        Ext.form.CheckboxGroup.superclass.onRender.call(this, ct, position);
+    },
+
+    initValue : function(){
+        if(this.value){
+            this.setValue.apply(this, this.buffered ? this.value : [this.value]);
+            delete this.buffered;
+            delete this.value;
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.CheckboxGroup.superclass.afterRender.call(this);
+        this.eachItem(function(item){
+            item.on('check', this.fireChecked, this);
+            item.inGroup = true;
+        });
+    },
+
+    // private
+    doLayout: function(){
+        //ugly method required to layout hidden items
+        if(this.rendered){
+            this.panel.forceLayout = this.ownerCt.forceLayout;
+            this.panel.doLayout();
+        }
+    },
+
+    // private
+    fireChecked: function(){
+        var arr = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                arr.push(item);
+            }
+        });
+        this.fireEvent('change', this, arr);
+    },
+    
+    /**
+     * Runs CheckboxGroup's validations and returns an array of any errors. The only error by default
+     * is if allowBlank is set to true and no items are checked.
+     * @return {Array} Array of all validation errors
+     */
+    getErrors: function() {
+        var errors = Ext.form.CheckboxGroup.superclass.getErrors.apply(this, arguments);
+        
+        if (!this.allowBlank) {
+            var blank = true;
+            
+            this.eachItem(function(f){
+                if (f.checked) {
+                    return (blank = false);
+                }
+            });
+            
+            if (blank) errors.push(this.blankText);
+        }
+        
+        return errors;
+    },
+
+    // private
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        
+        return dirty;
+    },
+
+    // private
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        this.panel.setSize(w, h);
+        this.panel.doLayout();
+    },
+
+    // inherit docs from Field
+    reset : function(){
+        if (this.originalValue) {
+            // Clear all items
+            this.eachItem(function(c){
+                if(c.setValue){
+                    c.setValue(false);
+                    c.originalValue = c.getValue();
+                }
+            });
+            // Set items stored in originalValue, ugly - set a flag to reset the originalValue
+            // during the horrible onSetValue.  This will allow trackResetOnLoad to function.
+            this.resetOriginal = true;
+            this.setValue(this.originalValue);
+            delete this.resetOriginal;
+        } else {
+            this.eachItem(function(c){
+                if(c.reset){
+                    c.reset();
+                }
+            });
+        }
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+
+    /**
+     * {@link Ext.form.Checkbox#setValue Set the value(s)} of an item or items
+     * in the group. Examples illustrating how this method may be called:
+     * <pre><code>
+// call with name and value
+myCheckboxGroup.setValue('cb-col-1', true);
+// call with an array of boolean values
+myCheckboxGroup.setValue([true, false, false]);
+// call with an object literal specifying item:value pairs
+myCheckboxGroup.setValue({
+    'cb-col-2': false,
+    'cb-col-3': true
+});
+// use comma separated string to set items with name to true (checked)
+myCheckboxGroup.setValue('cb-col-1,cb-col-3');
+     * </code></pre>
+     * See {@link Ext.form.Checkbox#setValue} for additional information.
+     * @param {Mixed} id The checkbox to check, or as described by example shown.
+     * @param {Boolean} value (optional) The value to set the item.
+     * @return {Ext.form.CheckboxGroup} this
+     */
+    setValue: function(){
+        if(this.rendered){
+            this.onSetValue.apply(this, arguments);
+        }else{
+            this.buffered = true;
+            this.value = arguments;
+        }
+        return this;
+    },
+
+    /**
+     * @private
+     * Sets the values of one or more of the items within the CheckboxGroup
+     * @param {String|Array|Object} id Can take multiple forms. Can be optionally:
+     * <ul>
+     *   <li>An ID string to be used with a second argument</li>
+     *   <li>An array of the form ['some', 'list', 'of', 'ids', 'to', 'mark', 'checked']</li>
+     *   <li>An array in the form [true, true, false, true, false] etc, where each item relates to the check status of
+     *       the checkbox at the same index</li>
+     *   <li>An object containing ids of the checkboxes as keys and check values as properties</li>
+     * </ul>
+     * @param {String} value The value to set the field to if the first argument was a string
+     */
+    onSetValue: function(id, value){
+        if(arguments.length == 1){
+            if(Ext.isArray(id)){
+                Ext.each(id, function(val, idx){
+                    if (Ext.isObject(val) && val.setValue){ // array of checkbox components to be checked
+                        val.setValue(true);
+                        if (this.resetOriginal === true) {
+                            val.originalValue = val.getValue();
+                        }
+                    } else { // an array of boolean values
+                        var item = this.items.itemAt(idx);
+                        if(item){
+                            item.setValue(val);
+                        }
+                    }
+                }, this);
+            }else if(Ext.isObject(id)){
+                // set of name/value pairs
+                for(var i in id){
+                    var f = this.getBox(i);
+                    if(f){
+                        f.setValue(id[i]);
+                    }
+                }
+            }else{
+                this.setValueForItem(id);
+            }
+        }else{
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+            }
+        }
+    },
+
+    // private
+    beforeDestroy: function(){
+        Ext.destroy(this.panel);
+        if (!this.rendered) {
+            Ext.destroy(this.items);
+        }
+        Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this);
+
+    },
+
+    setValueForItem : function(val){
+        val = String(val).split(',');
+        this.eachItem(function(item){
+            if(val.indexOf(item.inputValue)> -1){
+                item.setValue(true);
+            }
+        });
+    },
+
+    // private
+    getBox : function(id){
+        var box = null;
+        this.eachItem(function(f){
+            if(id == f || f.dataIndex == id || f.id == id || f.getName() == id){
+                box = f;
+                return false;
+            }
+        });
+        return box;
+    },
+
+    /**
+     * Gets an array of the selected {@link Ext.form.Checkbox} in the group.
+     * @return {Array} An array of the selected checkboxes.
+     */
+    getValue : function(){
+        var out = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                out.push(item);
+            }
+        });
+        return out;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @cfg {String} name
+     * @hide
+     */
+
+    /**
+     * @method getRawValue
+     * @hide
+     */
+    getRawValue : Ext.emptyFn,
+
+    /**
+     * @method setRawValue
+     * @hide
+     */
+    setRawValue : Ext.emptyFn
+
+});
+
+Ext.reg('checkboxgroup', Ext.form.CheckboxGroup);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/ProgressBar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/ProgressBar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/ProgressBar.js	(revision 76)
@@ -0,0 +1,306 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ProgressBar
+ * @extends Ext.BoxComponent
+ * <p>An updateable progress bar component.  The progress bar supports two different modes: manual and automatic.</p>
+ * <p>In manual mode, you are responsible for showing, updating (via {@link #updateProgress}) and clearing the
+ * progress bar as needed from your own code.  This method is most appropriate when you want to show progress
+ * throughout an operation that has predictable points of interest at which you can update the control.</p>
+ * <p>In automatic mode, you simply call {@link #wait} and let the progress bar run indefinitely, only clearing it
+ * once the operation is complete.  You can optionally have the progress bar wait for a specific amount of time
+ * and then clear itself.  Automatic mode is most appropriate for timed operations or asynchronous operations in
+ * which you have no need for indicating intermediate progress.</p>
+ * @cfg {Float} value A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+ * @cfg {String} text The progress bar text (defaults to '')
+ * @cfg {Mixed} textEl The element to render the progress text to (defaults to the progress
+ * bar's internal text element)
+ * @cfg {String} id The progress bar element's id (defaults to an auto-generated id)
+ * @xtype progress
+ */
+Ext.ProgressBar = Ext.extend(Ext.BoxComponent, {
+   /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to the progress bar's wrapper element (defaults to 'x-progress')
+    */
+    baseCls : 'x-progress',
+    
+    /**
+    * @cfg {Boolean} animate
+    * True to animate the progress bar during transitions (defaults to false)
+    */
+    animate : false,
+
+    // private
+    waitTimer : null,
+
+    // private
+    initComponent : function(){
+        Ext.ProgressBar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event update
+             * Fires after each update interval
+             * @param {Ext.ProgressBar} this
+             * @param {Number} The current progress value
+             * @param {String} The current progress text
+             */
+            "update"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        var tpl = new Ext.Template(
+            '<div class="{cls}-wrap">',
+                '<div class="{cls}-inner">',
+                    '<div class="{cls}-bar">',
+                        '<div class="{cls}-text">',
+                            '<div>&#160;</div>',
+                        '</div>',
+                    '</div>',
+                    '<div class="{cls}-text {cls}-text-back">',
+                        '<div>&#160;</div>',
+                    '</div>',
+                '</div>',
+            '</div>'
+        );
+
+        this.el = position ? tpl.insertBefore(position, {cls: this.baseCls}, true)
+            : tpl.append(ct, {cls: this.baseCls}, true);
+                
+        if(this.id){
+            this.el.dom.id = this.id;
+        }
+        var inner = this.el.dom.firstChild;
+        this.progressBar = Ext.get(inner.firstChild);
+
+        if(this.textEl){
+            //use an external text el
+            this.textEl = Ext.get(this.textEl);
+            delete this.textTopEl;
+        }else{
+            //setup our internal layered text els
+            this.textTopEl = Ext.get(this.progressBar.dom.firstChild);
+            var textBackEl = Ext.get(inner.childNodes[1]);
+            this.textTopEl.setStyle("z-index", 99).addClass('x-hidden');
+            this.textEl = new Ext.CompositeElement([this.textTopEl.dom.firstChild, textBackEl.dom.firstChild]);
+            this.textEl.setWidth(inner.offsetWidth);
+        }
+        this.progressBar.setHeight(inner.offsetHeight);
+    },
+    
+    // private
+    afterRender : function(){
+        Ext.ProgressBar.superclass.afterRender.call(this);
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }else{
+            this.updateText(this.text);
+        }
+    },
+
+    /**
+     * Updates the progress bar value, and optionally its text.  If the text argument is not specified,
+     * any existing text value will be unchanged.  To blank out existing text, pass ''.  Note that even
+     * if the progress bar value exceeds 1, it will never automatically reset -- you are responsible for
+     * determining when the progress is complete and calling {@link #reset} to clear and/or hide the control.
+     * @param {Float} value (optional) A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @param {Boolean} animate (optional) Whether to animate the transition of the progress bar. If this value is
+     * not specified, the default for the class is used (default to false)
+     * @return {Ext.ProgressBar} this
+     */
+    updateProgress : function(value, text, animate){
+        this.value = value || 0;
+        if(text){
+            this.updateText(text);
+        }
+        if(this.rendered && !this.isDestroyed){
+            var w = Math.floor(value*this.el.dom.firstChild.offsetWidth);
+            this.progressBar.setWidth(w, animate === true || (animate !== false && this.animate));
+            if(this.textTopEl){
+                //textTopEl should be the same width as the bar so overflow will clip as the bar moves
+                this.textTopEl.removeClass('x-hidden').setWidth(w);
+            }
+        }
+        this.fireEvent('update', this, value, text);
+        return this;
+    },
+
+    /**
+     * Initiates an auto-updating progress bar.  A duration can be specified, in which case the progress
+     * bar will automatically reset after a fixed amount of time and optionally call a callback function
+     * if specified.  If no duration is passed in, then the progress bar will run indefinitely and must
+     * be manually cleared by calling {@link #reset}.  The wait method accepts a config object with
+     * the following properties:
+     * <pre>
+Property   Type          Description
+---------- ------------  ----------------------------------------------------------------------
+duration   Number        The length of time in milliseconds that the progress bar should
+                         run before resetting itself (defaults to undefined, in which case it
+                         will run indefinitely until reset is called)
+interval   Number        The length of time in milliseconds between each progress update
+                         (defaults to 1000 ms)
+animate    Boolean       Whether to animate the transition of the progress bar. If this value is
+                         not specified, the default for the class is used.                                                   
+increment  Number        The number of progress update segments to display within the progress
+                         bar (defaults to 10).  If the bar reaches the end and is still
+                         updating, it will automatically wrap back to the beginning.
+text       String        Optional text to display in the progress bar element (defaults to '').
+fn         Function      A callback function to execute after the progress bar finishes auto-
+                         updating.  The function will be called with no arguments.  This function
+                         will be ignored if duration is not specified since in that case the
+                         progress bar can only be stopped programmatically, so any required function
+                         should be called by the same code after it resets the progress bar.
+scope      Object        The scope that is passed to the callback function (only applies when
+                         duration and fn are both passed).
+</pre>
+         *
+         * Example usage:
+         * <pre><code>
+var p = new Ext.ProgressBar({
+   renderTo: 'my-el'
+});
+
+//Wait for 5 seconds, then update the status el (progress bar will auto-reset)
+p.wait({
+   interval: 100, //bar will move fast!
+   duration: 5000,
+   increment: 15,
+   text: 'Updating...',
+   scope: this,
+   fn: function(){
+      Ext.fly('status').update('Done!');
+   }
+});
+
+//Or update indefinitely until some async action completes, then reset manually
+p.wait();
+myAction.on('complete', function(){
+    p.reset();
+    Ext.fly('status').update('Done!');
+});
+</code></pre>
+     * @param {Object} config (optional) Configuration options
+     * @return {Ext.ProgressBar} this
+     */
+    wait : function(o){
+        if(!this.waitTimer){
+            var scope = this;
+            o = o || {};
+            this.updateText(o.text);
+            this.waitTimer = Ext.TaskMgr.start({
+                run: function(i){
+                    var inc = o.increment || 10;
+                    i -= 1;
+                    this.updateProgress(((((i+inc)%inc)+1)*(100/inc))*0.01, null, o.animate);
+                },
+                interval: o.interval || 1000,
+                duration: o.duration,
+                onStop: function(){
+                    if(o.fn){
+                        o.fn.apply(o.scope || this);
+                    }
+                    this.reset();
+                },
+                scope: scope
+            });
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the progress bar is currently in a {@link #wait} operation
+     * @return {Boolean} True if waiting, else false
+     */
+    isWaiting : function(){
+        return this.waitTimer !== null;
+    },
+
+    /**
+     * Updates the progress bar text.  If specified, textEl will be updated, otherwise the progress
+     * bar itself will display the updated text.
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @return {Ext.ProgressBar} this
+     */
+    updateText : function(text){
+        this.text = text || '&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+        }
+        return this;
+    },
+    
+    /**
+     * Synchronizes the inner bar width to the proper proportion of the total componet width based
+     * on the current progress {@link #value}.  This will be called automatically when the ProgressBar
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the ProgressBar if necessary.
+     */
+    syncProgressBar : function(){
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the size of the progress bar.
+     * @param {Number} width The new width in pixels
+     * @param {Number} height The new height in pixels
+     * @return {Ext.ProgressBar} this
+     */
+    setSize : function(w, h){
+        Ext.ProgressBar.superclass.setSize.call(this, w, h);
+        if(this.textTopEl){
+            var inner = this.el.dom.firstChild;
+            this.textEl.setSize(inner.offsetWidth, inner.offsetHeight);
+        }
+        this.syncProgressBar();
+        return this;
+    },
+
+    /**
+     * Resets the progress bar value to 0 and text to empty string.  If hide = true, the progress
+     * bar will also be hidden (using the {@link #hideMode} property internally).
+     * @param {Boolean} hide (optional) True to hide the progress bar (defaults to false)
+     * @return {Ext.ProgressBar} this
+     */
+    reset : function(hide){
+        this.updateProgress(0);
+        if(this.textTopEl){
+            this.textTopEl.addClass('x-hidden');
+        }
+        this.clearTimer();
+        if(hide === true){
+            this.hide();
+        }
+        return this;
+    },
+    
+    // private
+    clearTimer : function(){
+        if(this.waitTimer){
+            this.waitTimer.onStop = null; //prevent recursion
+            Ext.TaskMgr.stop(this.waitTimer);
+            this.waitTimer = null;
+        }
+    },
+    
+    onDestroy: function(){
+        this.clearTimer();
+        if(this.rendered){
+            if(this.textEl.isComposite){
+                this.textEl.clear();
+            }
+            Ext.destroyMembers(this, 'textEl', 'progressBar', 'textTopEl');
+        }
+        Ext.ProgressBar.superclass.onDestroy.call(this);
+    }
+});
+Ext.reg('progress', Ext.ProgressBar);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/LoadMask.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/LoadMask.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/LoadMask.js	(revision 76)
@@ -0,0 +1,129 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.LoadMask
+ * A simple utility class for generically masking elements while loading data.  If the {@link #store}
+ * config option is specified, the masking will be automatically synchronized with the store's loading
+ * process and the mask element will be cached for reuse.  For all other elements, this mask will replace the
+ * element's Updater load indicator and will be destroyed after the initial load.
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic mask:
+var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait..."});
+myMask.show();
+</code></pre>
+ * @constructor
+ * Create a new LoadMask
+ * @param {Mixed} el The element or DOM node, or its id
+ * @param {Object} config The config object
+ */
+Ext.LoadMask = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(this.store){
+        this.store.on({
+            scope: this,
+            beforeload: this.onBeforeLoad,
+            load: this.onLoad,
+            exception: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, false);
+    }else{
+        var um = this.el.getUpdater();
+        um.showLoadIndicator = false; // disable the default indicator
+        um.on({
+            scope: this,
+            beforeupdate: this.onBeforeLoad,
+            update: this.onLoad,
+            failure: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, true);
+    }
+};
+
+Ext.LoadMask.prototype = {
+    /**
+     * @cfg {Ext.data.Store} store
+     * Optional Store to which the mask is bound. The mask is displayed when a load request is issued, and
+     * hidden on either load sucess, or load fail.
+     */
+    /**
+     * @cfg {Boolean} removeMask
+     * True to create a single-use mask that is automatically destroyed after loading (useful for page loads),
+     * False to persist the mask element reference for multiple uses (e.g., for paged data widgets).  Defaults to false.
+     */
+    /**
+     * @cfg {String} msg
+     * The text to display in a centered loading message box (defaults to 'Loading...')
+     */
+    msg : 'Loading...',
+    /**
+     * @cfg {String} msgCls
+     * The CSS class to apply to the loading message element (defaults to "x-mask-loading")
+     */
+    msgCls : 'x-mask-loading',
+
+    /**
+     * Read-only. True if the mask is currently disabled so that it will not be displayed (defaults to false)
+     * @type Boolean
+     */
+    disabled: false,
+
+    /**
+     * Disables the mask to prevent it from being displayed
+     */
+    disable : function(){
+       this.disabled = true;
+    },
+
+    /**
+     * Enables the mask so that it can be displayed
+     */
+    enable : function(){
+        this.disabled = false;
+    },
+
+    // private
+    onLoad : function(){
+        this.el.unmask(this.removeMask);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.disabled){
+            this.el.mask(this.msg, this.msgCls);
+        }
+    },
+
+    /**
+     * Show this LoadMask over the configured Element.
+     */
+    show: function(){
+        this.onBeforeLoad();
+    },
+
+    /**
+     * Hide this LoadMask.
+     */
+    hide: function(){
+        this.onLoad();
+    },
+
+    // private
+    destroy : function(){
+        if(this.store){
+            this.store.un('beforeload', this.onBeforeLoad, this);
+            this.store.un('load', this.onLoad, this);
+            this.store.un('exception', this.onLoad, this);
+        }else{
+            var um = this.el.getUpdater();
+            um.un('beforeupdate', this.onBeforeLoad, this);
+            um.un('update', this.onLoad, this);
+            um.un('failure', this.onLoad, this);
+        }
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/CycleButton.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/CycleButton.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/CycleButton.js	(revision 76)
@@ -0,0 +1,193 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.CycleButton
+ * @extends Ext.SplitButton
+ * A specialized SplitButton that contains a menu of {@link Ext.menu.CheckItem} elements.  The button automatically
+ * cycles through each menu item on click, raising the button's {@link #change} event (or calling the button's
+ * {@link #changeHandler} function, if supplied) for the active menu item. Clicking on the arrow section of the
+ * button displays the dropdown menu just like a normal SplitButton.  Example usage:
+ * <pre><code>
+var btn = new Ext.CycleButton({
+    showText: true,
+    prependText: 'View as ',
+    items: [{
+        text:'text only',
+        iconCls:'view-text',
+        checked:true
+    },{
+        text:'HTML',
+        iconCls:'view-html'
+    }],
+    changeHandler:function(btn, item){
+        Ext.Msg.alert('Change View', item.text);
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new split button
+ * @param {Object} config The config object
+ * @xtype cycle
+ */
+Ext.CycleButton = Ext.extend(Ext.SplitButton, {
+    /**
+     * @cfg {Array} items An array of {@link Ext.menu.CheckItem} <b>config</b> objects to be used when creating the
+     * button's menu items (e.g., {text:'Foo', iconCls:'foo-icon'})
+     */
+    /**
+     * @cfg {Boolean} showText True to display the active item's text as the button text (defaults to false)
+     */
+    /**
+     * @cfg {String} prependText A static string to prepend before the active item's text when displayed as the
+     * button's text (only applies when showText = true, defaults to '')
+     */
+    /**
+     * @cfg {Function} changeHandler A callback function that will be invoked each time the active menu
+     * item in the button's menu has changed.  If this callback is not supplied, the SplitButton will instead
+     * fire the {@link #change} event on active item change.  The changeHandler function will be called with the
+     * following argument list: (SplitButton this, Ext.menu.CheckItem item)
+     */
+    /**
+     * @cfg {String} forceIcon A css class which sets an image to be used as the static icon for this button.  This
+     * icon will always be displayed regardless of which item is selected in the dropdown list.  This overrides the 
+     * default behavior of changing the button's icon to match the selected item's icon on change.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object used to display the {@link Ext.menu.CheckItem CheckItems} representing the available choices.
+     */
+
+    // private
+    getItemText : function(item){
+        if(item && this.showText === true){
+            var text = '';
+            if(this.prependText){
+                text += this.prependText;
+            }
+            text += item.text;
+            return text;
+        }
+        return undefined;
+    },
+
+    /**
+     * Sets the button's active menu item.
+     * @param {Ext.menu.CheckItem} item The item to activate
+     * @param {Boolean} suppressEvent True to prevent the button's change event from firing (defaults to false)
+     */
+    setActiveItem : function(item, suppressEvent){
+        if(!Ext.isObject(item)){
+            item = this.menu.getComponent(item);
+        }
+        if(item){
+            if(!this.rendered){
+                this.text = this.getItemText(item);
+                this.iconCls = item.iconCls;
+            }else{
+                var t = this.getItemText(item);
+                if(t){
+                    this.setText(t);
+                }
+                this.setIconClass(item.iconCls);
+            }
+            this.activeItem = item;
+            if(!item.checked){
+                item.setChecked(true, suppressEvent);
+            }
+            if(this.forceIcon){
+                this.setIconClass(this.forceIcon);
+            }
+            if(!suppressEvent){
+                this.fireEvent('change', this, item);
+            }
+        }
+    },
+
+    /**
+     * Gets the currently active menu item.
+     * @return {Ext.menu.CheckItem} The active item
+     */
+    getActiveItem : function(){
+        return this.activeItem;
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the button's active menu item has changed.  Note that if a {@link #changeHandler} function
+             * is set on this CycleButton, it will be called instead on active item change and this change event will
+             * not be fired.
+             * @param {Ext.CycleButton} this
+             * @param {Ext.menu.CheckItem} item The menu item that was selected
+             */
+            "change"
+        );
+
+        if(this.changeHandler){
+            this.on('change', this.changeHandler, this.scope||this);
+            delete this.changeHandler;
+        }
+
+        this.itemCount = this.items.length;
+
+        this.menu = {cls:'x-cycle-menu', items:[]};
+        var checked = 0;
+        Ext.each(this.items, function(item, i){
+            Ext.apply(item, {
+                group: item.group || this.id,
+                itemIndex: i,
+                checkHandler: this.checkHandler,
+                scope: this,
+                checked: item.checked || false
+            });
+            this.menu.items.push(item);
+            if(item.checked){
+                checked = i;
+            }
+        }, this);
+        Ext.CycleButton.superclass.initComponent.call(this);
+        this.on('click', this.toggleSelected, this);
+        this.setActiveItem(checked, true);
+    },
+
+    // private
+    checkHandler : function(item, pressed){
+        if(pressed){
+            this.setActiveItem(item);
+        }
+    },
+
+    /**
+     * This is normally called internally on button click, but can be called externally to advance the button's
+     * active item programmatically to the next one in the menu.  If the current item is the last one in the menu
+     * the active item will be set to the first item in the menu.
+     */
+    toggleSelected : function(){
+        var m = this.menu;
+        m.render();
+        // layout if we haven't before so the items are active
+        if(!m.hasLayout){
+            m.doLayout();
+        }
+        
+        var nextIdx, checkItem;
+        for (var i = 1; i < this.itemCount; i++) {
+            nextIdx = (this.activeItem.itemIndex + i) % this.itemCount;
+            // check the potential item
+            checkItem = m.items.itemAt(nextIdx);
+            // if its not disabled then check it.
+            if (!checkItem.disabled) {
+                checkItem.setChecked(true);
+                break;
+            }
+        }
+    }
+});
+Ext.reg('cycle', Ext.CycleButton);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/ColorPalette.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/ColorPalette.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/ColorPalette.js	(revision 76)
@@ -0,0 +1,172 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ColorPalette
+ * @extends Ext.Component
+ * Simple color palette class for choosing colors.  The palette can be rendered to any container.<br />
+ * Here's an example of typical usage:
+ * <pre><code>
+var cp = new Ext.ColorPalette({value:'993300'});  // initial selected color
+cp.render('my-div');
+
+cp.on('select', function(palette, selColor){
+    // do something with selColor
+});
+</code></pre>
+ * @constructor
+ * Create a new ColorPalette
+ * @param {Object} config The config object
+ * @xtype colorpalette
+ */
+Ext.ColorPalette = Ext.extend(Ext.Component, {
+	/**
+	 * @cfg {String} tpl An existing XTemplate instance to be used in place of the default template for rendering the component.
+	 */
+    /**
+     * @cfg {String} itemCls
+     * The CSS class to apply to the containing element (defaults to 'x-color-palette')
+     */
+    itemCls : 'x-color-palette',
+    /**
+     * @cfg {String} value
+     * The initial color to highlight (should be a valid 6-digit color hex code without the # symbol).  Note that
+     * the hex codes are case-sensitive.
+     */
+    value : null,
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will cause a color to be selected. This can be any valid event name (dblclick, contextmenu). 
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent :'click',
+    // private
+    ctype : 'Ext.ColorPalette',
+
+    /**
+     * @cfg {Boolean} allowReselect If set to true then reselecting a color that is already selected fires the {@link #select} event
+     */
+    allowReselect : false,
+
+    /**
+     * <p>An array of 6-digit color hex code strings (without the # symbol).  This array can contain any number
+     * of colors, and each hex code should be unique.  The width of the palette is controlled via CSS by adjusting
+     * the width property of the 'x-color-palette' class (or assigning a custom class), so you can balance the number
+     * of colors with the width setting until the box is symmetrical.</p>
+     * <p>You can override individual colors if needed:</p>
+     * <pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors[0] = 'FF0000';  // change the first box to red
+</code></pre>
+
+Or you can provide a custom array of your own for complete control:
+<pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors = ['000000', '993300', '333300'];
+</code></pre>
+     * @type Array
+     */
+    colors : [
+        '000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333',
+        '800000', 'FF6600', '808000', '008000', '008080', '0000FF', '666699', '808080',
+        'FF0000', 'FF9900', '99CC00', '339966', '33CCCC', '3366FF', '800080', '969696',
+        'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0',
+        'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', '99CCFF', 'CC99FF', 'FFFFFF'
+    ],
+
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this palette.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorPalette instance.
+     */
+    
+    // private
+    initComponent : function(){
+        Ext.ColorPalette.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a color is selected
+             * @param {ColorPalette} this
+             * @param {String} color The 6-digit color hex code (without the # symbol)
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler, this.scope, true);
+        }    
+    },
+
+    // private
+    onRender : function(container, position){
+        this.autoEl = {
+            tag: 'div',
+            cls: this.itemCls
+        };
+        Ext.ColorPalette.superclass.onRender.call(this, container, position);
+        var t = this.tpl || new Ext.XTemplate(
+            '<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>'
+        );
+        t.overwrite(this.el, this.colors);
+        this.mon(this.el, this.clickEvent, this.handleClick, this, {delegate: 'a'});
+        if(this.clickEvent != 'click'){
+        	this.mon(this.el, 'click', Ext.emptyFn, this, {delegate: 'a', preventDefault: true});
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ColorPalette.superclass.afterRender.call(this);
+        if(this.value){
+            var s = this.value;
+            this.value = null;
+            this.select(s, true);
+        }
+    },
+
+    // private
+    handleClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            var c = t.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];
+            this.select(c.toUpperCase());
+        }
+    },
+
+    /**
+     * Selects the specified color in the palette (fires the {@link #select} event)
+     * @param {String} color A valid 6-digit color hex code (# will be stripped if included)
+     * @param {Boolean} suppressEvent (optional) True to stop the select event from firing. Defaults to <tt>false</tt>.
+     */
+    select : function(color, suppressEvent){
+        color = color.replace('#', '');
+        if(color != this.value || this.allowReselect){
+            var el = this.el;
+            if(this.value){
+                el.child('a.color-'+this.value).removeClass('x-color-palette-sel');
+            }
+            el.child('a.color-'+color).addClass('x-color-palette-sel');
+            this.value = color;
+            if(suppressEvent !== true){
+                this.fireEvent('select', this, color);
+            }
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+Ext.reg('colorpalette', Ext.ColorPalette);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Panel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Panel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Panel.js	(revision 76)
@@ -0,0 +1,1799 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Panel
+ * @extends Ext.Container
+ * <p>Panel is a container that has specific functionality and structural components that make
+ * it the perfect building block for application-oriented user interfaces.</p>
+ * <p>Panels are, by virtue of their inheritance from {@link Ext.Container}, capable
+ * of being configured with a {@link Ext.Container#layout layout}, and containing child Components.</p>
+ * <p>When either specifying child {@link Ext.Component#items items} of a Panel, or dynamically {@link Ext.Container#add adding} Components
+ * to a Panel, remember to consider how you wish the Panel to arrange those child elements, and whether
+ * those child elements need to be sized using one of Ext's built-in <code><b>{@link Ext.Container#layout layout}</b></code> schemes. By
+ * default, Panels use the {@link Ext.layout.ContainerLayout ContainerLayout} scheme. This simply renders
+ * child components, appending them one after the other inside the Container, and <b>does not apply any sizing</b>
+ * at all.</p>
+ * <p>A Panel may also contain {@link #bbar bottom} and {@link #tbar top} toolbars, along with separate
+ * {@link #header}, {@link #footer} and {@link #body} sections (see {@link #frame} for additional
+ * information).</p>
+ * <p>Panel also provides built-in {@link #collapsible expandable and collapsible behavior}, along with
+ * a variety of {@link #tools prebuilt tool buttons} that can be wired up to provide other customized
+ * behavior.  Panels can be easily dropped into any {@link Ext.Container Container} or layout, and the
+ * layout and rendering pipeline is {@link Ext.Container#add completely managed by the framework}.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype panel
+ */
+Ext.Panel = Ext.extend(Ext.Container, {
+    /**
+     * The Panel's header {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the {@link #title} and {@link #tools}</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property header
+     */
+    /**
+     * The Panel's body {@link Ext.Element Element} which may be used to contain HTML content.
+     * The content may be specified in the {@link #html} config, or it may be loaded using the
+     * {@link autoLoad} config, or through the Panel's {@link #getUpdater Updater}. Read-only.
+     * <p>If this is used to load visible HTML elements in either way, then
+     * the Panel may not be used as a Layout for hosting nested Panels.</p>
+     * <p>If this Panel is intended to be used as the host of a Layout (See {@link #layout}
+     * then the body Element must not be loaded or changed - it is under the control
+     * of the Panel's Layout.
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property body
+     */
+    /**
+     * The Panel's bwrap {@link Ext.Element Element} used to contain other Panel elements
+     * (tbar, body, bbar, footer). See {@link #bodyCfg}. Read-only.
+     * @type Ext.Element
+     * @property bwrap
+     */
+    /**
+     * True if this panel is collapsed. Read-only.
+     * @type Boolean
+     * @property collapsed
+     */
+    /**
+     * @cfg {Object} bodyCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object may be specified for any
+     * Panel Element.</p>
+     * <p>By default, the Default element in the table below will be used for the html markup to
+     * create a child element with the commensurate Default class name (<code>baseCls</code> will be
+     * replaced by <code>{@link #baseCls}</code>):</p>
+     * <pre>
+     * Panel      Default  Default             Custom      Additional       Additional
+     * Element    element  class               element     class            style
+     * ========   ==========================   =========   ==============   ===========
+     * {@link #header}     div      {@link #baseCls}+'-header'   {@link #headerCfg}   headerCssClass   headerStyle
+     * {@link #bwrap}      div      {@link #baseCls}+'-bwrap'     {@link #bwrapCfg}    bwrapCssClass    bwrapStyle
+     * + tbar     div      {@link #baseCls}+'-tbar'       {@link #tbarCfg}     tbarCssClass     tbarStyle
+     * + {@link #body}     div      {@link #baseCls}+'-body'       {@link #bodyCfg}     {@link #bodyCssClass}     {@link #bodyStyle}
+     * + bbar     div      {@link #baseCls}+'-bbar'       {@link #bbarCfg}     bbarCssClass     bbarStyle
+     * + {@link #footer}   div      {@link #baseCls}+'-footer'   {@link #footerCfg}   footerCssClass   footerStyle
+     * </pre>
+     * <p>Configuring a Custom element may be used, for example, to force the {@link #body} Element
+     * to use a different form of markup than is created by default. An example of this might be
+     * to {@link Ext.Element#createChild create a child} Panel containing a custom content, such as
+     * a header, or forcing centering of all Panel content by having the body be a &lt;center&gt;
+     * element:</p>
+     * <pre><code>
+new Ext.Panel({
+    title: 'Message Title',
+    renderTo: Ext.getBody(),
+    width: 200, height: 130,
+    <b>bodyCfg</b>: {
+        tag: 'center',
+        cls: 'x-panel-body',  // Default class not applied if Custom element specified
+        html: 'Message'
+    },
+    footerCfg: {
+        tag: 'h2',
+        cls: 'x-panel-footer',        // same as the Default class
+        html: 'footer html'
+    },
+    footerCssClass: 'custom-footer', // additional css class, see {@link Ext.element#addClass addClass}
+    footerStyle:    'background-color:red' // see {@link #bodyStyle}
+});
+     * </code></pre>
+     * <p>The example above also explicitly creates a <code>{@link #footer}</code> with custom markup and
+     * styling applied.</p>
+     */
+    /**
+     * @cfg {Object} headerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #header} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bwrapCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bwrap} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} tbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #tbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} footerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #footer} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Boolean} closable
+     * Panels themselves do not directly support being closed, but some Panel subclasses do (like
+     * {@link Ext.Window}) or a Panel Class within an {@link Ext.TabPanel}.  Specify <code>true</code>
+     * to enable closing in such situations. Defaults to <code>false</code>.
+     */
+    /**
+     * The Panel's footer {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the Panel's <code>{@link #buttons}</code> or <code>{@link #fbar}</code>.</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property footer
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>The id of the node, a DOM node or an existing Element corresponding to a DIV that is already present in
+     * the document that specifies some panel-specific structural markup.  When <code>applyTo</code> is used,
+     * constituent parts of the panel can be specified by CSS class name within the main element, and the panel
+     * will automatically create those components from that markup. Any required components not specified in the
+     * markup will be autogenerated if necessary.</p>
+     * <p>The following class names are supported (baseCls will be replaced by {@link #baseCls}):</p>
+     * <ul><li>baseCls + '-header'</li>
+     * <li>baseCls + '-header-text'</li>
+     * <li>baseCls + '-bwrap'</li>
+     * <li>baseCls + '-tbar'</li>
+     * <li>baseCls + '-body'</li>
+     * <li>baseCls + '-bbar'</li>
+     * <li>baseCls + '-footer'</li></ul>
+     * <p>Using this config, a call to render() is not required.  If applyTo is specified, any value passed for
+     * {@link #renderTo} will be ignored and the target element's parent node will automatically be used as the
+     * panel's container.</p>
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * <p>The top toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the top toolbar after render, use {@link #getTopToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Object/Array} bbar
+     * <p>The bottom toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the bottom toolbar after render, use {@link #getBottomToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /** @cfg {Object/Array} fbar
+     * <p>A {@link Ext.Toolbar Toolbar} object, a Toolbar config, or an array of
+     * {@link Ext.Button Button}s/{@link Ext.Button Button} configs, describing a {@link Ext.Toolbar Toolbar} to be rendered into this Panel's footer element.</p>
+     * <p>After render, the <code>fbar</code> property will be an {@link Ext.Toolbar Toolbar} instance.</p>
+     * <p>If <code>{@link #buttons}</code> are specified, they will supersede the <code>fbar</code> configuration property.</p>
+     * The Panel's <code>{@link #buttonAlign}</code> configuration affects the layout of these items, for example:
+     * <pre><code>
+var w = new Ext.Window({
+    height: 250,
+    width: 500,
+    bbar: new Ext.Toolbar({
+        items: [{
+            text: 'bbar Left'
+        },'->',{
+            text: 'bbar Right'
+        }]
+    }),
+    {@link #buttonAlign}: 'left', // anything but 'center' or 'right' and you can use '-', and '->'
+                                  // to control the alignment of fbar items
+    fbar: [{
+        text: 'fbar Left'
+    },'->',{
+        text: 'fbar Right'
+    }]
+}).show();
+     * </code></pre>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Boolean} header
+     * <code>true</code> to create the Panel's header element explicitly, <code>false</code> to skip creating
+     * it.  If a <code>{@link #title}</code> is set the header will be created automatically, otherwise it will not.
+     * If a <code>{@link #title}</code> is set but <code>header</code> is explicitly set to <code>false</code>, the header
+     * will not be rendered.
+     */
+    /**
+     * @cfg {Boolean} footer
+     * <code>true</code> to create the footer element explicitly, false to skip creating it. The footer
+     * will be created automatically if <code>{@link #buttons}</code> or a <code>{@link #fbar}</code> have
+     * been configured.  See <code>{@link #bodyCfg}</code> for an example.
+     */
+    /**
+     * @cfg {String} title
+     * The title text to be used as innerHTML (html tags are accepted) to display in the panel
+     * <code>{@link #header}</code> (defaults to ''). When a <code>title</code> is specified the
+     * <code>{@link #header}</code> element will automatically be created and displayed unless
+     * {@link #header} is explicitly set to <code>false</code>.  If you do not want to specify a
+     * <code>title</code> at config time, but you may want one later, you must either specify a non-empty
+     * <code>title</code> (a blank space ' ' will do) or <code>header:true</code> so that the container
+     * element will get created.
+     */
+    /**
+     * @cfg {Array} buttons
+     * <code>buttons</code> will be used as <code>{@link Ext.Container#items items}</code> for the toolbar in
+     * the footer (<code>{@link #fbar}</code>). Typically the value of this configuration property will be
+     * an array of {@link Ext.Button}s or {@link Ext.Button} configuration objects.
+     * If an item is configured with <code>minWidth</code> or the Panel is configured with <code>minButtonWidth</code>,
+     * that width will be applied to the item.
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * A valid url spec according to the Updater {@link Ext.Updater#update} method.
+     * If autoLoad is not null, the panel will attempt to load its contents
+     * immediately upon render.<p>
+     * The URL will become the default URL for this panel's {@link #body} element,
+     * so it may be {@link Ext.Element#refresh refresh}ed at any time.</p>
+     */
+    /**
+     * @cfg {Boolean} frame
+     * <code>false</code> by default to render with plain 1px square borders. <code>true</code> to render with
+     * 9 elements, complete with custom rounded corners (also see {@link Ext.Element#boxWrap}).
+     * <p>The template generated for each condition is depicted below:</p><pre><code>
+     *
+// frame = false
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+
+    &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:false)&lt;/span>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+    &lt;/div>
+&lt;/div>
+
+// frame = true (create 9 elements)
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+    &lt;div class="x-panel-tl">&lt;div class="x-panel-tr">&lt;div class="x-panel-tc">
+        &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:true)&lt;/span>&lt;/div>
+    &lt;/div>&lt;/div>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-ml">&lt;div class="x-panel-mr">&lt;div class="x-panel-mc">
+            &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+        &lt;/div>&lt;/div>&lt;/div>
+
+        &lt;div class="x-panel-bl">&lt;div class="x-panel-br">&lt;div class="x-panel-bc"/>
+        &lt;/div>&lt;/div>&lt;/div>
+&lt;/div>
+     * </code></pre>
+     */
+    /**
+     * @cfg {Boolean} border
+     * True to display the borders of the panel's body element, false to hide them (defaults to true).  By default,
+     * the border is a 2px wide inset border, but this can be further altered by setting {@link #bodyBorder} to false.
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * True to display an interior border on the body element of the panel, false to hide it (defaults to true).
+     * This only applies when {@link #border} == true.  If border == true and bodyBorder == false, the border will display
+     * as a 1px wide inset border, giving the entire body element an inset appearance.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyCssClass
+     * Additional css class selector to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#addClass} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyStyle
+     * Custom CSS styles to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#applyStyles} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'my-icon'
+
+// css class that specifies background image to be used as the icon image:
+.my-icon { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * True to make the panel collapsible and have the expand/collapse toggle button automatically rendered into
+     * the header tool button area, false to keep the panel statically sized with no button (defaults to false).
+     */
+    /**
+     * @cfg {Array} tools
+     * An array of tool button configs to be added to the header tool area. When rendered, each tool is
+     * stored as an {@link Ext.Element Element} referenced by a public property called <code><b></b>tools.<i>&lt;tool-type&gt;</i></code>
+     * <p>Each tool config may contain the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc"><b>Required.</b> The type
+     * of tool to create. By default, this assigns a CSS class of the form <code>x-tool-<i>&lt;tool-type&gt;</i></code> to the
+     * resulting tool Element. Ext provides CSS rules, and an icon sprite containing images for the tool types listed below.
+     * The developer may implement custom tools by supplying alternate CSS rules and background images:
+     * <ul>
+     * <div class="x-tool x-tool-toggle" style="float:left; margin-right:5;"> </div><div><code> toggle</code> (Created by default when {@link #collapsible} is <code>true</code>)</div>
+     * <div class="x-tool x-tool-close" style="float:left; margin-right:5;"> </div><div><code> close</code></div>
+     * <div class="x-tool x-tool-minimize" style="float:left; margin-right:5;"> </div><div><code> minimize</code></div>
+     * <div class="x-tool x-tool-maximize" style="float:left; margin-right:5;"> </div><div><code> maximize</code></div>
+     * <div class="x-tool x-tool-restore" style="float:left; margin-right:5;"> </div><div><code> restore</code></div>
+     * <div class="x-tool x-tool-gear" style="float:left; margin-right:5;"> </div><div><code> gear</code></div>
+     * <div class="x-tool x-tool-pin" style="float:left; margin-right:5;"> </div><div><code> pin</code></div>
+     * <div class="x-tool x-tool-unpin" style="float:left; margin-right:5;"> </div><div><code> unpin</code></div>
+     * <div class="x-tool x-tool-right" style="float:left; margin-right:5;"> </div><div><code> right</code></div>
+     * <div class="x-tool x-tool-left" style="float:left; margin-right:5;"> </div><div><code> left</code></div>
+     * <div class="x-tool x-tool-up" style="float:left; margin-right:5;"> </div><div><code> up</code></div>
+     * <div class="x-tool x-tool-down" style="float:left; margin-right:5;"> </div><div><code> down</code></div>
+     * <div class="x-tool x-tool-refresh" style="float:left; margin-right:5;"> </div><div><code> refresh</code></div>
+     * <div class="x-tool x-tool-minus" style="float:left; margin-right:5;"> </div><div><code> minus</code></div>
+     * <div class="x-tool x-tool-plus" style="float:left; margin-right:5;"> </div><div><code> plus</code></div>
+     * <div class="x-tool x-tool-help" style="float:left; margin-right:5;"> </div><div><code> help</code></div>
+     * <div class="x-tool x-tool-search" style="float:left; margin-right:5;"> </div><div><code> search</code></div>
+     * <div class="x-tool x-tool-save" style="float:left; margin-right:5;"> </div><div><code> save</code></div>
+     * <div class="x-tool x-tool-print" style="float:left; margin-right:5;"> </div><div><code> print</code></div>
+     * </ul></div></li>
+     * <li><b>handler</b> : Function<div class="sub-desc"><b>Required.</b> The function to
+     * call when clicked. Arguments passed are:<ul>
+     * <li><b>event</b> : Ext.EventObject<div class="sub-desc">The click event.</div></li>
+     * <li><b>toolEl</b> : Ext.Element<div class="sub-desc">The tool Element.</div></li>
+     * <li><b>panel</b> : Ext.Panel<div class="sub-desc">The host Panel</div></li>
+     * <li><b>tc</b> : Object<div class="sub-desc">The tool configuration object</div></li>
+     * </ul></div></li>
+     * <li><b>stopEvent</b> : Boolean<div class="sub-desc">Defaults to true. Specify as false to allow click event to propagate.</div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the handler.</div></li>
+     * <li><b>qtip</b> : String/Object<div class="sub-desc">A tip string, or
+     * a config argument to {@link Ext.QuickTip#register}</div></li>
+     * <li><b>hidden</b> : Boolean<div class="sub-desc">True to initially render hidden.</div></li>
+     * <li><b>on</b> : Object<div class="sub-desc">A listener config object specifiying
+     * event listeners in the format of an argument to {@link #addListener}</div></li>
+     * </ul></div>
+     * <p>Note that, apart from the toggle tool which is provided when a panel is collapsible, these
+     * tools only provide the visual button. Any required functionality must be provided by adding
+     * handlers that implement the necessary behavior.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+tools:[{
+    id:'refresh',
+    qtip: 'Refresh form Data',
+    // hidden:true,
+    handler: function(event, toolEl, panel){
+        // refresh logic
+    }
+},
+{
+    id:'help',
+    qtip: 'Get Help',
+    handler: function(event, toolEl, panel){
+        // whatever
+    }
+}]
+</code></pre>
+     * <p>For the custom id of <code>'help'</code> define two relevant css classes with a link to
+     * a 15x15 image:</p>
+     * <pre><code>
+.x-tool-help {background-image: url(images/help.png);}
+.x-tool-help-over {background-image: url(images/help_over.png);}
+// if using an image sprite:
+.x-tool-help {background-image: url(images/help.png) no-repeat 0 0;}
+.x-tool-help-over {background-position:-15px 0;}
+</code></pre>
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * <p>A Template used to create {@link #tools} in the {@link #header} Element. Defaults to:</p><pre><code>
+new Ext.Template('&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>')</code></pre>
+     * <p>This may may be overridden to provide a custom DOM structure for tools based upon a more
+     * complex XTemplate. The template's data is a single tool configuration object (Not the entire Array)
+     * as specified in {@link #tools}.  In the following example an &lt;a> tag is used to provide a
+     * visual indication when hovering over the tool:</p><pre><code>
+var win = new Ext.Window({
+    tools: [{
+        id: 'download',
+        href: '/MyPdfDoc.pdf'
+    }],
+    toolTemplate: new Ext.XTemplate(
+        '&lt;tpl if="id==\'download\'">',
+            '&lt;a class="x-tool x-tool-pdf" href="{href}">&lt;/a>',
+        '&lt;/tpl>',
+        '&lt;tpl if="id!=\'download\'">',
+            '&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>',
+        '&lt;/tpl>'
+    ),
+    width:500,
+    height:300,
+    closeAction:'hide'
+});</code></pre>
+     * <p>Note that the CSS class 'x-tool-pdf' should have an associated style rule which provides an
+     * appropriate background image, something like:</p>
+    <pre><code>
+    a.x-tool-pdf {background-image: url(../shared/extjs/images/pdf.gif)!important;}
+    </code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * <code>true</code> to hide the expand/collapse toggle button when <code>{@link #collapsible} == true</code>,
+     * <code>false</code> to display it (defaults to <code>false</code>).
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * <code>true</code> to allow expanding and collapsing the panel (when <code>{@link #collapsible} = true</code>)
+     * by clicking anywhere in the header bar, <code>false</code>) to allow it only by clicking to tool button
+     * (defaults to <code>false</code>)). If this panel is a child item of a border layout also see the
+     * {@link Ext.layout.BorderLayout.Region BorderLayout.Region}
+     * <code>{@link Ext.layout.BorderLayout.Region#floatable floatable}</code> config option.
+     */
+
+    /**
+     * @cfg {Mixed} floating
+     * <p>This property is used to configure the underlying {@link Ext.Layer}. Acceptable values for this
+     * configuration property are:</p><div class="mdetail-params"><ul>
+     * <li><b><code>false</code></b> : <b>Default.</b><div class="sub-desc">Display the panel inline where it is
+     * rendered.</div></li>
+     * <li><b><code>true</code></b> : <div class="sub-desc">Float the panel (absolute position it with automatic
+     * shimming and shadow).<ul>
+     * <div class="sub-desc">Setting floating to true will create an Ext.Layer for this panel and display the
+     * panel at negative offsets so that it is hidden.</div>
+     * <div class="sub-desc">Since the panel will be absolute positioned, the position must be set explicitly
+     * <i>after</i> render (e.g., <code>myPanel.setPosition(100,100);</code>).</div>
+     * <div class="sub-desc"><b>Note</b>: when floating a panel you should always assign a fixed width,
+     * otherwise it will be auto width and will expand to fill to the right edge of the viewport.</div>
+     * </ul></div></li>
+     * <li><b><code>{@link Ext.Layer object}</code></b> : <div class="sub-desc">The specified object will be used
+     * as the configuration object for the {@link Ext.Layer} that will be created.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * <code>true</code> (or a valid Ext.Shadow {@link Ext.Shadow#mode} value) to display a shadow behind the
+     * panel, <code>false</code> to display no shadow (defaults to <code>'sides'</code>).  Note that this option
+     * only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * The number of pixels to offset the shadow if displayed (defaults to <code>4</code>). Note that this
+     * option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Boolean} shim
+     * <code>false</code> to disable the iframe shim in browsers which need one (defaults to <code>true</code>).
+     * Note that this option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Object/Array} keys
+     * A {@link Ext.KeyMap} config object (in the format expected by {@link Ext.KeyMap#addBinding}
+     * used to assign custom key handling to this panel (defaults to <code>null</code>).
+     */
+    /**
+     * @cfg {Boolean/Object} draggable
+     * <p><code>true</code> to enable dragging of this Panel (defaults to <code>false</code>).</p>
+     * <p>For custom drag/drop implementations, an <b>Ext.Panel.DD</b> config could also be passed
+     * in this config instead of <code>true</code>. Ext.Panel.DD is an internal, undocumented class which
+     * moves a proxy Element around in place of the Panel's element, but provides no other behaviour
+     * during dragging or on drop. It is a subclass of {@link Ext.dd.DragSource}, so behaviour may be
+     * added by implementing the interface methods of {@link Ext.dd.DragDrop} e.g.:
+     * <pre><code>
+new Ext.Panel({
+    title: 'Drag me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    draggable: {
+//      Config option of Ext.Panel.DD class.
+//      It&#39;s a floating Panel, so do not show a placeholder proxy in the original position.
+        insertProxy: false,
+
+//      Called for each mousemove event while dragging the DD object.
+        onDrag : function(e){
+//          Record the x,y position of the drag proxy so that we can
+//          position the Panel at end of drag.
+            var pel = this.proxy.getEl();
+            this.x = pel.getLeft(true);
+            this.y = pel.getTop(true);
+
+//          Keep the Shadow aligned if there is one.
+            var s = this.panel.getEl().shadow;
+            if (s) {
+                s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
+            }
+        },
+
+//      Called on the mouseup event.
+        endDrag : function(e){
+            this.panel.setPosition(this.x, this.y);
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this panel disabled (default is <code>false</code>). An important note when using the disabled
+     * config on panels is that IE will often fail to initialize the disabled mask element correectly if
+     * the panel's layout has not yet completed by the time the Panel is disabled during the render process.
+     * If you experience this issue, you may need to instead use the {@link #afterlayout} event to initialize
+     * the disabled state:
+     * <pre><code>
+new Ext.Panel({
+    ...
+    listeners: {
+        'afterlayout': {
+            fn: function(p){
+                p.disable();
+            },
+            single: true // important, as many layouts can occur
+        }
+    }
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <code>true</code> to use height:'auto', <code>false</code> to use fixed height (defaults to <code>false</code>).
+     * <b>Note</b>: Setting <code>autoHeight: true</code> means that the browser will manage the panel's height
+     * based on its contents, and that Ext will not manage it at all. If the panel is within a layout that
+     * manages dimensions (<code>fit</code>, <code>border</code>, etc.) then setting <code>autoHeight: true</code>
+     * can cause issues with scrolling and will not generally work as expected since the panel will take
+     * on the height of its contents rather than the height required by the Ext layout.
+     */
+
+
+    /**
+     * @cfg {String} baseCls
+     * The base CSS class to apply to this panel's element (defaults to <code>'x-panel'</code>).
+     * <p>Another option available by default is to specify <code>'x-plain'</code> which strips all styling
+     * except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     * See <code>{@link #unstyled}</code> also.</p>
+     */
+    baseCls : 'x-panel',
+    /**
+     * @cfg {String} collapsedCls
+     * A CSS class to add to the panel's element after it has been collapsed (defaults to
+     * <code>'x-panel-collapsed'</code>).
+     */
+    collapsedCls : 'x-panel-collapsed',
+    /**
+     * @cfg {Boolean} maskDisabled
+     * <code>true</code> to mask the panel when it is {@link #disabled}, <code>false</code> to not mask it (defaults
+     * to <code>true</code>).  Either way, the panel will always tell its contained elements to disable themselves
+     * when it is disabled, but masking the panel can provide an additional visual cue that the panel is
+     * disabled.
+     */
+    maskDisabled : true,
+    /**
+     * @cfg {Boolean} animCollapse
+     * <code>true</code> to animate the transition when the panel is collapsed, <code>false</code> to skip the
+     * animation (defaults to <code>true</code> if the {@link Ext.Fx} class is available, otherwise <code>false</code>).
+     */
+    animCollapse : Ext.enableFx,
+    /**
+     * @cfg {Boolean} headerAsText
+     * <code>true</code> to display the panel <code>{@link #title}</code> in the <code>{@link #header}</code>,
+     * <code>false</code> to hide it (defaults to <code>true</code>).
+     */
+    headerAsText : true,
+    /**
+     * @cfg {String} buttonAlign
+     * The alignment of any {@link #buttons} added to this panel.  Valid values are <code>'right'</code>,
+     * <code>'left'</code> and <code>'center'</code> (defaults to <code>'right'</code>).
+     */
+    buttonAlign : 'right',
+    /**
+     * @cfg {Boolean} collapsed
+     * <code>true</code> to render the panel collapsed, <code>false</code> to render it expanded (defaults to
+     * <code>false</code>).
+     */
+    collapsed : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * <code>true</code> to make sure the collapse/expand toggle button always renders first (to the left of)
+     * any other tools in the panel's title bar, <code>false</code> to render it last (defaults to <code>true</code>).
+     */
+    collapseFirst : true,
+    /**
+     * @cfg {Number} minButtonWidth
+     * Minimum width in pixels of all {@link #buttons} in this panel (defaults to <code>75</code>)
+     */
+    minButtonWidth : 75,
+    /**
+     * @cfg {Boolean} unstyled
+     * Overrides the <code>{@link #baseCls}</code> setting to <code>{@link #baseCls} = 'x-plain'</code> which renders
+     * the panel unstyled except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     */
+    /**
+     * @cfg {String} elements
+     * A comma-delimited list of panel elements to initialize when the panel is rendered.  Normally, this list will be
+     * generated automatically based on the items added to the panel at config time, but sometimes it might be useful to
+     * make sure a structural element is rendered even if not specified at config time (for example, you may want
+     * to add a button or toolbar dynamically after the panel has been rendered).  Adding those elements to this
+     * list will allocate the required placeholders in the panel when it is rendered.  Valid values are<div class="mdetail-params"><ul>
+     * <li><code>header</code></li>
+     * <li><code>tbar</code> (top bar)</li>
+     * <li><code>body</code></li>
+     * <li><code>bbar</code> (bottom bar)</li>
+     * <li><code>footer</code></li>
+     * </ul></div>
+     * Defaults to '<code>body</code>'.
+     */
+    elements : 'body',
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * Defaults to <code>false</code>.  When set to <code>true</code>, an extra css class <code>'x-panel-normal'</code>
+     * will be added to the panel's element, effectively applying css styles suggested by the W3C
+     * (see http://www.w3.org/TR/CSS21/sample.html) to the Panel's <b>body</b> element (not the header,
+     * footer, etc.).
+     */
+    preventBodyReset : false,
+
+    /**
+     * @cfg {Number/String} padding
+     * A shortcut for setting a padding style on the body element. The value can either be
+     * a number to be applied to all sides, or a normal css string describing padding.
+     * Defaults to <tt>undefined</tt>.
+     *
+     */
+    padding: undefined,
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <tt>'bodyresize'</tt>.
+     */
+    resizeEvent: 'bodyresize',
+
+    // protected - these could be used to customize the behavior of the window,
+    // but changing them would not be useful without further mofifications and
+    // could lead to unexpected or undesirable results.
+    toolTarget : 'header',
+    collapseEl : 'bwrap',
+    slideAnchor : 't',
+    disabledClass : '',
+
+    // private, notify box this class will handle heights
+    deferHeight : true,
+    // private
+    expandDefaults: {
+        duration : 0.25
+    },
+    // private
+    collapseDefaults : {
+        duration : 0.25
+    },
+
+    // private
+    initComponent : function(){
+        Ext.Panel.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event bodyresize
+             * Fires after the Panel has been resized.
+             * @param {Ext.Panel} p the Panel which has been resized.
+             * @param {Number} width The Panel body's new width.
+             * @param {Number} height The Panel body's new height.
+             */
+            'bodyresize',
+            /**
+             * @event titlechange
+             * Fires after the Panel title has been {@link #title set} or {@link #setTitle changed}.
+             * @param {Ext.Panel} p the Panel which has had its title changed.
+             * @param {String} The new title.
+             */
+            'titlechange',
+            /**
+             * @event iconchange
+             * Fires after the Panel icon class has been {@link #iconCls set} or {@link #setIconClass changed}.
+             * @param {Ext.Panel} p the Panel which has had its {@link #iconCls icon class} changed.
+             * @param {String} The new icon class.
+             * @param {String} The old icon class.
+             */
+            'iconchange',
+            /**
+             * @event collapse
+             * Fires after the Panel has been collapsed.
+             * @param {Ext.Panel} p the Panel that has been collapsed.
+             */
+            'collapse',
+            /**
+             * @event expand
+             * Fires after the Panel has been expanded.
+             * @param {Ext.Panel} p The Panel that has been expanded.
+             */
+            'expand',
+            /**
+             * @event beforecollapse
+             * Fires before the Panel is collapsed.  A handler can return false to cancel the collapse.
+             * @param {Ext.Panel} p the Panel being collapsed.
+             * @param {Boolean} animate True if the collapse is animated, else false.
+             */
+            'beforecollapse',
+            /**
+             * @event beforeexpand
+             * Fires before the Panel is expanded.  A handler can return false to cancel the expand.
+             * @param {Ext.Panel} p The Panel being expanded.
+             * @param {Boolean} animate True if the expand is animated, else false.
+             */
+            'beforeexpand',
+            /**
+             * @event beforeclose
+             * Fires before the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.  This event only
+             * applies to such subclasses.
+             * A handler can return false to cancel the close.
+             * @param {Ext.Panel} p The Panel being closed.
+             */
+            'beforeclose',
+            /**
+             * @event close
+             * Fires after the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.
+             * @param {Ext.Panel} p The Panel that has been closed.
+             */
+            'close',
+            /**
+             * @event activate
+             * Fires after the Panel has been visually activated.
+             * Note that Panels do not directly support being activated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been activated.
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires after the Panel has been visually deactivated.
+             * Note that Panels do not directly support being deactivated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been deactivated.
+             */
+            'deactivate'
+        );
+
+        if(this.unstyled){
+            this.baseCls = 'x-plain';
+        }
+
+
+        this.toolbars = [];
+        // shortcuts
+        if(this.tbar){
+            this.elements += ',tbar';
+            this.topToolbar = this.createToolbar(this.tbar);
+            this.tbar = null;
+
+        }
+        if(this.bbar){
+            this.elements += ',bbar';
+            this.bottomToolbar = this.createToolbar(this.bbar);
+            this.bbar = null;
+        }
+
+        if(this.header === true){
+            this.elements += ',header';
+            this.header = null;
+        }else if(this.headerCfg || (this.title && this.header !== false)){
+            this.elements += ',header';
+        }
+
+        if(this.footerCfg || this.footer === true){
+            this.elements += ',footer';
+            this.footer = null;
+        }
+
+        if(this.buttons){
+            this.fbar = this.buttons;
+            this.buttons = null;
+        }
+        if(this.fbar){
+            this.createFbar(this.fbar);
+        }
+        if(this.autoLoad){
+            this.on('render', this.doAutoLoad, this, {delay:10});
+        }
+    },
+
+    // private
+    createFbar : function(fbar){
+        var min = this.minButtonWidth;
+        this.elements += ',footer';
+        this.fbar = this.createToolbar(fbar, {
+            buttonAlign: this.buttonAlign,
+            toolbarCls: 'x-panel-fbar',
+            enableOverflow: false,
+            defaults: function(c){
+                return {
+                    minWidth: c.minWidth || min
+                };
+            }
+        });
+        // @compat addButton and buttons could possibly be removed
+        // @target 4.0
+        /**
+         * This Panel's Array of buttons as created from the <code>{@link #buttons}</code>
+         * config property. Read only.
+         * @type Array
+         * @property buttons
+         */
+        this.fbar.items.each(function(c){
+            c.minWidth = c.minWidth || this.minButtonWidth;
+        }, this);
+        this.buttons = this.fbar.items.items;
+    },
+
+    // private
+    createToolbar: function(tb, options){
+        var result;
+        // Convert array to proper toolbar config
+        if(Ext.isArray(tb)){
+            tb = {
+                items: tb
+            };
+        }
+        result = tb.events ? Ext.apply(tb, options) : this.createComponent(Ext.apply({}, tb, options), 'toolbar');
+        this.toolbars.push(result);
+        return result;
+    },
+
+    // private
+    createElement : function(name, pnode){
+        if(this[name]){
+            pnode.appendChild(this[name].dom);
+            return;
+        }
+
+        if(name === 'bwrap' || this.elements.indexOf(name) != -1){
+            if(this[name+'Cfg']){
+                this[name] = Ext.fly(pnode).createChild(this[name+'Cfg']);
+            }else{
+                var el = document.createElement('div');
+                el.className = this[name+'Cls'];
+                this[name] = Ext.get(pnode.appendChild(el));
+            }
+            if(this[name+'CssClass']){
+                this[name].addClass(this[name+'CssClass']);
+            }
+            if(this[name+'Style']){
+                this[name].applyStyles(this[name+'Style']);
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Panel.superclass.onRender.call(this, ct, position);
+        this.createClasses();
+
+        var el = this.el,
+            d = el.dom,
+            bw,
+            ts;
+
+
+        if(this.collapsible && !this.hideCollapseTool){
+            this.tools = this.tools ? this.tools.slice(0) : [];
+            this.tools[this.collapseFirst?'unshift':'push']({
+                id: 'toggle',
+                handler : this.toggleCollapse,
+                scope: this
+            });
+        }
+
+        if(this.tools){
+            ts = this.tools;
+            this.elements += (this.header !== false) ? ',header' : '';
+        }
+        this.tools = {};
+
+        el.addClass(this.baseCls);
+        if(d.firstChild){ // existing markup
+            this.header = el.down('.'+this.headerCls);
+            this.bwrap = el.down('.'+this.bwrapCls);
+            var cp = this.bwrap ? this.bwrap : el;
+            this.tbar = cp.down('.'+this.tbarCls);
+            this.body = cp.down('.'+this.bodyCls);
+            this.bbar = cp.down('.'+this.bbarCls);
+            this.footer = cp.down('.'+this.footerCls);
+            this.fromMarkup = true;
+        }
+        if (this.preventBodyReset === true) {
+            el.addClass('x-panel-reset');
+        }
+        if(this.cls){
+            el.addClass(this.cls);
+        }
+
+        if(this.buttons){
+            this.elements += ',footer';
+        }
+
+        // This block allows for maximum flexibility and performance when using existing markup
+
+        // framing requires special markup
+        if(this.frame){
+            el.insertHtml('afterBegin', String.format(Ext.Element.boxMarkup, this.baseCls));
+
+            this.createElement('header', d.firstChild.firstChild.firstChild);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            var ml = d.childNodes[1], bl = d.childNodes[2];
+            bw.appendChild(ml);
+            bw.appendChild(bl);
+
+            var mc = bw.firstChild.firstChild.firstChild;
+            this.createElement('tbar', mc);
+            this.createElement('body', mc);
+            this.createElement('bbar', mc);
+            this.createElement('footer', bw.lastChild.firstChild.firstChild);
+
+            if(!this.footer){
+                this.bwrap.dom.lastChild.className += ' x-panel-nofooter';
+            }
+            /*
+             * Store a reference to this element so:
+             * a) We aren't looking it up all the time
+             * b) The last element is reported incorrectly when using a loadmask
+             */
+            this.ft = Ext.get(this.bwrap.dom.lastChild);
+            this.mc = Ext.get(mc);
+        }else{
+            this.createElement('header', d);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            this.createElement('tbar', bw);
+            this.createElement('body', bw);
+            this.createElement('bbar', bw);
+            this.createElement('footer', bw);
+
+            if(!this.header){
+                this.body.addClass(this.bodyCls + '-noheader');
+                if(this.tbar){
+                    this.tbar.addClass(this.tbarCls + '-noheader');
+                }
+            }
+        }
+
+        if(Ext.isDefined(this.padding)){
+            this.body.setStyle('padding', this.body.addUnits(this.padding));
+        }
+
+        if(this.border === false){
+            this.el.addClass(this.baseCls + '-noborder');
+            this.body.addClass(this.bodyCls + '-noborder');
+            if(this.header){
+                this.header.addClass(this.headerCls + '-noborder');
+            }
+            if(this.footer){
+                this.footer.addClass(this.footerCls + '-noborder');
+            }
+            if(this.tbar){
+                this.tbar.addClass(this.tbarCls + '-noborder');
+            }
+            if(this.bbar){
+                this.bbar.addClass(this.bbarCls + '-noborder');
+            }
+        }
+
+        if(this.bodyBorder === false){
+           this.body.addClass(this.bodyCls + '-noborder');
+        }
+
+        this.bwrap.enableDisplayMode('block');
+
+        if(this.header){
+            this.header.unselectable();
+
+            // for tools, we need to wrap any existing header markup
+            if(this.headerAsText){
+                this.header.dom.innerHTML =
+                    '<span class="' + this.headerTextCls + '">'+this.header.dom.innerHTML+'</span>';
+
+                if(this.iconCls){
+                    this.setIconClass(this.iconCls);
+                }
+            }
+        }
+
+        if(this.floating){
+            this.makeFloating(this.floating);
+        }
+
+        if(this.collapsible && this.titleCollapse && this.header){
+            this.mon(this.header, 'click', this.toggleCollapse, this);
+            this.header.setStyle('cursor', 'pointer');
+        }
+        if(ts){
+            this.addTool.apply(this, ts);
+        }
+
+        // Render Toolbars.
+        if(this.fbar){
+            this.footer.addClass('x-panel-btns');
+            this.fbar.ownerCt = this;
+            this.fbar.render(this.footer);
+            this.footer.createChild({cls:'x-clear'});
+        }
+        if(this.tbar && this.topToolbar){
+            this.topToolbar.ownerCt = this;
+            this.topToolbar.render(this.tbar);
+        }
+        if(this.bbar && this.bottomToolbar){
+            this.bottomToolbar.ownerCt = this;
+            this.bottomToolbar.render(this.bbar);
+        }
+    },
+
+    /**
+     * Sets the CSS class that provides the icon image for this panel.  This method will replace any existing
+     * icon class if one has already been set and fire the {@link #iconchange} event after completion.
+     * @param {String} cls The new CSS class name
+     */
+    setIconClass : function(cls){
+        var old = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered && this.header){
+            if(this.frame){
+                this.header.addClass('x-panel-icon');
+                this.header.replaceClass(old, this.iconCls);
+            }else{
+                var hd = this.header,
+                    img = hd.child('img.x-panel-inline-icon');
+                if(img){
+                    Ext.fly(img).replaceClass(old, this.iconCls);
+                }else{
+                    var hdspan = hd.child('span.' + this.headerTextCls);
+                    if (hdspan) {
+                        Ext.DomHelper.insertBefore(hdspan.dom, {
+                            tag:'img', alt: '', src: Ext.BLANK_IMAGE_URL, cls:'x-panel-inline-icon '+this.iconCls
+                        });
+                    }
+                 }
+            }
+        }
+        this.fireEvent('iconchange', this, cls, old);
+    },
+
+    // private
+    makeFloating : function(cfg){
+        this.floating = true;
+        this.el = new Ext.Layer(Ext.apply({}, cfg, {
+            shadow: Ext.isDefined(this.shadow) ? this.shadow : 'sides',
+            shadowOffset: this.shadowOffset,
+            constrain:false,
+            shim: this.shim === false ? false : undefined
+        }), this.el);
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the top (<code>{@link #tbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getTopToolbar : function(){
+        return this.topToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the bottom (<code>{@link #bbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getBottomToolbar : function(){
+        return this.bottomToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the footer (<code>{@link #fbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getFooterToolbar : function() {
+        return this.fbar;
+    },
+
+    /**
+     * Adds a button to this panel.  Note that this method must be called prior to rendering.  The preferred
+     * approach is to add buttons via the {@link #buttons} config.
+     * @param {String/Object} config A valid {@link Ext.Button} config.  A string will become the text for a default
+     * button config, an object will be treated as a button config object.
+     * @param {Function} handler The function to be called on button {@link Ext.Button#click}
+     * @param {Object} scope The scope (<code>this</code> reference) in which the button handler function is executed. Defaults to the Button.
+     * @return {Ext.Button} The button that was added
+     */
+    addButton : function(config, handler, scope){
+        if(!this.fbar){
+            this.createFbar([]);
+        }
+        if(handler){
+            if(Ext.isString(config)){
+                config = {text: config};
+            }
+            config = Ext.apply({
+                handler: handler,
+                scope: scope
+            }, config);
+        }
+        return this.fbar.add(config);
+    },
+
+    // private
+    addTool : function(){
+        if(!this.rendered){
+            if(!this.tools){
+                this.tools = [];
+            }
+            Ext.each(arguments, function(arg){
+                this.tools.push(arg);
+            }, this);
+            return;
+        }
+         // nowhere to render tools!
+        if(!this[this.toolTarget]){
+            return;
+        }
+        if(!this.toolTemplate){
+            // initialize the global tool template on first use
+            var tt = new Ext.Template(
+                 '<div class="x-tool x-tool-{id}">&#160;</div>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.Panel.prototype.toolTemplate = tt;
+        }
+        for(var i = 0, a = arguments, len = a.length; i < len; i++) {
+            var tc = a[i];
+            if(!this.tools[tc.id]){
+                var overCls = 'x-tool-'+tc.id+'-over';
+                var t = this.toolTemplate.insertFirst(this[this.toolTarget], tc, true);
+                this.tools[tc.id] = t;
+                t.enableDisplayMode('block');
+                this.mon(t, 'click',  this.createToolHandler(t, tc, overCls, this));
+                if(tc.on){
+                    this.mon(t, tc.on);
+                }
+                if(tc.hidden){
+                    t.hide();
+                }
+                if(tc.qtip){
+                    if(Ext.isObject(tc.qtip)){
+                        Ext.QuickTips.register(Ext.apply({
+                              target: t.id
+                        }, tc.qtip));
+                    } else {
+                        t.dom.qtip = tc.qtip;
+                    }
+                }
+                t.addClassOnOver(overCls);
+            }
+        }
+    },
+
+    onLayout : function(shallow, force){
+        Ext.Panel.superclass.onLayout.apply(this, arguments);
+        if(this.hasLayout && this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout(undefined, force);
+            });
+            this.syncHeight();
+        }
+    },
+
+    syncHeight : function(){
+        var h = this.toolbarHeight,
+                bd = this.body,
+                lsh = this.lastSize.height,
+                sz;
+
+        if(this.autoHeight || !Ext.isDefined(lsh) || lsh == 'auto'){
+            return;
+        }
+
+
+        if(h != this.getToolbarHeight()){
+            h = Math.max(0, lsh - this.getFrameHeight());
+            bd.setHeight(h);
+            sz = bd.getSize();
+            this.toolbarHeight = this.getToolbarHeight();
+            this.onBodyResize(sz.width, sz.height);
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.floating){
+            return this.el.show();
+        }
+        Ext.Panel.superclass.onShow.call(this);
+    },
+
+    // private
+    onHide : function(){
+        if(this.floating){
+            return this.el.hide();
+        }
+        Ext.Panel.superclass.onHide.call(this);
+    },
+
+    // private
+    createToolHandler : function(t, tc, overCls, panel){
+        return function(e){
+            t.removeClass(overCls);
+            if(tc.stopEvent !== false){
+                e.stopEvent();
+            }
+            if(tc.handler){
+                tc.handler.call(tc.scope || t, e, t, panel, tc);
+            }
+        };
+    },
+
+    // private
+    afterRender : function(){
+        if(this.floating && !this.hidden){
+            this.el.show();
+        }
+        if(this.title){
+            this.setTitle(this.title);
+        }
+        Ext.Panel.superclass.afterRender.call(this); // do sizing calcs last
+        if (this.collapsed) {
+            this.collapsed = false;
+            this.collapse(false);
+        }
+        this.initEvents();
+    },
+
+    // private
+    getKeyMap : function(){
+        if(!this.keyMap){
+            this.keyMap = new Ext.KeyMap(this.el, this.keys);
+        }
+        return this.keyMap;
+    },
+
+    // private
+    initEvents : function(){
+        if(this.keys){
+            this.getKeyMap();
+        }
+        if(this.draggable){
+            this.initDraggable();
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout();
+                tb.on({
+                    scope: this,
+                    afterlayout: this.syncHeight,
+                    remove: this.syncHeight
+                });
+            }, this);
+            this.syncHeight();
+        }
+
+    },
+
+    // private
+    initDraggable : function(){
+        /**
+         * <p>If this Panel is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DragSource} which handles dragging the Panel.</p>
+         * The developer must provide implementations of the abstract methods of {@link Ext.dd.DragSource}
+         * in order to supply behaviour for each stage of the drag/drop process. See {@link #draggable}.
+         * @type Ext.dd.DragSource.
+         * @property dd
+         */
+        this.dd = new Ext.Panel.DD(this, Ext.isBoolean(this.draggable) ? null : this.draggable);
+    },
+
+    // private
+    beforeEffect : function(anim){
+        if(this.floating){
+            this.el.beforeAction();
+        }
+        if(anim !== false){
+            this.el.addClass('x-panel-animated');
+        }
+    },
+
+    // private
+    afterEffect : function(anim){
+        this.syncShadow();
+        this.el.removeClass('x-panel-animated');
+    },
+
+    // private - wraps up an animation param with internal callbacks
+    createEffect : function(a, cb, scope){
+        var o = {
+            scope:scope,
+            block:true
+        };
+        if(a === true){
+            o.callback = cb;
+            return o;
+        }else if(!a.callback){
+            o.callback = cb;
+        }else { // wrap it up
+            o.callback = function(){
+                cb.call(scope);
+                Ext.callback(a.callback, a.scope);
+            };
+        }
+        return Ext.applyIf(o, a);
+    },
+
+    /**
+     * Collapses the panel body so that it becomes hidden.  Fires the {@link #beforecollapse} event which will
+     * cancel the collapse action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    collapse : function(animate){
+        if(this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforecollapse', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.beforeEffect(doAnim);
+        this.onCollapse(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideOut(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterCollapse, this),
+                        this.collapseDefaults));
+        }else{
+            this[this.collapseEl].hide(this.hideMode);
+            this.afterCollapse(false);
+        }
+    },
+
+    // private
+    afterCollapse : function(anim){
+        this.collapsed = true;
+        this.el.addClass(this.collapsedCls);
+        if(anim !== false){
+            this[this.collapseEl].hide(this.hideMode);
+        }
+        this.afterEffect(anim);
+
+        // Reset lastSize of all sub-components so they KNOW they are in a collapsed container
+        this.cascade(function(c) {
+            if (c.lastSize) {
+                c.lastSize = { width: undefined, height: undefined };
+            }
+        });
+        this.fireEvent('collapse', this);
+    },
+
+    /**
+     * Expands the panel body so that it becomes visible.  Fires the {@link #beforeexpand} event which will
+     * cancel the expand action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    expand : function(animate){
+        if(!this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforeexpand', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.el.removeClass(this.collapsedCls);
+        this.beforeEffect(doAnim);
+        this.onExpand(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideIn(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterExpand, this),
+                        this.expandDefaults));
+        }else{
+            this[this.collapseEl].show(this.hideMode);
+            this.afterExpand(false);
+        }
+    },
+
+    // private
+    afterExpand : function(anim){
+        this.collapsed = false;
+        if(anim !== false){
+            this[this.collapseEl].show(this.hideMode);
+        }
+        this.afterEffect(anim);
+        if (this.deferLayout) {
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * Shortcut for performing an {@link #expand} or {@link #collapse} based on the current state of the panel.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    toggleCollapse : function(animate){
+        this[this.collapsed ? 'expand' : 'collapse'](animate);
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.mask();
+        }
+        Ext.Panel.superclass.onDisable.call(this);
+    },
+
+    // private
+    onEnable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.unmask();
+        }
+        Ext.Panel.superclass.onEnable.call(this);
+    },
+
+    // private
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+        var w = adjWidth,
+            h = adjHeight;
+
+        if(Ext.isDefined(w) || Ext.isDefined(h)){
+            if(!this.collapsed){
+                // First, set the the Panel's body width.
+                // If we have auto-widthed it, get the resulting full offset width so we can size the Toolbars to match
+                // The Toolbars must not buffer this resize operation because we need to know their heights.
+
+                if(Ext.isNumber(w)){
+                    this.body.setWidth(w = this.adjustBodyWidth(w - this.getFrameWidth()));
+                } else if (w == 'auto') {
+                    w = this.body.setWidth('auto').dom.offsetWidth;
+                } else {
+                    w = this.body.dom.offsetWidth;
+                }
+
+                if(this.tbar){
+                    this.tbar.setWidth(w);
+                    if(this.topToolbar){
+                        this.topToolbar.setSize(w);
+                    }
+                }
+                if(this.bbar){
+                    this.bbar.setWidth(w);
+                    if(this.bottomToolbar){
+                        this.bottomToolbar.setSize(w);
+                        // The bbar does not move on resize without this.
+                        if (Ext.isIE) {
+                            this.bbar.setStyle('position', 'static');
+                            this.bbar.setStyle('position', '');
+                        }
+                    }
+                }
+                if(this.footer){
+                    this.footer.setWidth(w);
+                    if(this.fbar){
+                        this.fbar.setSize(Ext.isIE ? (w - this.footer.getFrameWidth('lr')) : 'auto');
+                    }
+                }
+
+                // At this point, the Toolbars must be layed out for getFrameHeight to find a result.
+                if(Ext.isNumber(h)){
+                    h = Math.max(0, h - this.getFrameHeight());
+                    //h = Math.max(0, h - (this.getHeight() - this.body.getHeight()));
+                    this.body.setHeight(h);
+                }else if(h == 'auto'){
+                    this.body.setHeight(h);
+                }
+
+                if(this.disabled && this.el._mask){
+                    this.el._mask.setSize(this.el.dom.clientWidth, this.el.getHeight());
+                }
+            }else{
+                // Adds an event to set the correct height afterExpand.  This accounts for the deferHeight flag in panel
+                this.queuedBodySize = {width: w, height: h};
+                if(!this.queuedExpand && this.allowQueuedExpand !== false){
+                    this.queuedExpand = true;
+                    this.on('expand', function(){
+                        delete this.queuedExpand;
+                        this.onResize(this.queuedBodySize.width, this.queuedBodySize.height);
+                    }, this, {single:true});
+                }
+            }
+            this.onBodyResize(w, h);
+        }
+        this.syncShadow();
+        Ext.Panel.superclass.onResize.call(this, adjWidth, adjHeight, rawWidth, rawHeight);
+
+    },
+
+    // private
+    onBodyResize: function(w, h){
+        this.fireEvent('bodyresize', this, w, h);
+    },
+
+    // private
+    getToolbarHeight: function(){
+        var h = 0;
+        if(this.rendered){
+            Ext.each(this.toolbars, function(tb){
+                h += tb.getHeight();
+            }, this);
+        }
+        return h;
+    },
+
+    // deprecate
+    adjustBodyHeight : function(h){
+        return h;
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        return w;
+    },
+
+    // private
+    onPosition : function(){
+        this.syncShadow();
+    },
+
+    /**
+     * Returns the width in pixels of the framing elements of this panel (not including the body width).  To
+     * retrieve the body width see {@link #getInnerWidth}.
+     * @return {Number} The frame width
+     */
+    getFrameWidth : function(){
+        var w = this.el.getFrameWidth('lr') + this.bwrap.getFrameWidth('lr');
+
+        if(this.frame){
+            var l = this.bwrap.dom.firstChild;
+            w += (Ext.fly(l).getFrameWidth('l') + Ext.fly(l.firstChild).getFrameWidth('r'));
+            w += this.mc.getFrameWidth('lr');
+        }
+        return w;
+    },
+
+    /**
+     * Returns the height in pixels of the framing elements of this panel (including any top and bottom bars and
+     * header and footer elements, but not including the body height).  To retrieve the body height see {@link #getInnerHeight}.
+     * @return {Number} The frame height
+     */
+    getFrameHeight : function() {
+        var h  = this.el.getFrameWidth('tb') + this.bwrap.getFrameWidth('tb');
+        h += (this.tbar ? this.tbar.getHeight() : 0) +
+             (this.bbar ? this.bbar.getHeight() : 0);
+
+        if(this.frame){
+            h += this.el.dom.firstChild.offsetHeight + this.ft.dom.offsetHeight + this.mc.getFrameWidth('tb');
+        }else{
+            h += (this.header ? this.header.getHeight() : 0) +
+                (this.footer ? this.footer.getHeight() : 0);
+        }
+        return h;
+    },
+
+    /**
+     * Returns the width in pixels of the body element (not including the width of any framing elements).
+     * For the frame width see {@link #getFrameWidth}.
+     * @return {Number} The body width
+     */
+    getInnerWidth : function(){
+        return this.getSize().width - this.getFrameWidth();
+    },
+
+    /**
+     * Returns the height in pixels of the body element (not including the height of any framing elements).
+     * For the frame height see {@link #getFrameHeight}.
+     * @return {Number} The body height
+     */
+    getInnerHeight : function(){
+        return this.body.getHeight();
+        /* Deprecate
+            return this.getSize().height - this.getFrameHeight();
+        */
+    },
+
+    // private
+    syncShadow : function(){
+        if(this.floating){
+            this.el.sync(true);
+        }
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.body;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.body;
+    },
+
+    /**
+     * <p>Sets the title text for the panel and optionally the {@link #iconCls icon class}.</p>
+     * <p>In order to be able to set the title, a header element must have been created
+     * for the Panel. This is triggered either by configuring the Panel with a non-blank <code>{@link #title}</code>,
+     * or configuring it with <code><b>{@link #header}: true</b></code>.</p>
+     * @param {String} title The title text to set
+     * @param {String} iconCls (optional) {@link #iconCls iconCls} A user-defined CSS class that provides the icon image for this panel
+     */
+    setTitle : function(title, iconCls){
+        this.title = title;
+        if(this.header && this.headerAsText){
+            this.header.child('span').update(title);
+        }
+        if(iconCls){
+            this.setIconClass(iconCls);
+        }
+        this.fireEvent('titlechange', this, title);
+        return this;
+    },
+
+    /**
+     * Get the {@link Ext.Updater} for this panel. Enables you to perform Ajax updates of this panel's body.
+     * @return {Ext.Updater} The Updater
+     */
+    getUpdater : function(){
+        return this.body.getUpdater();
+    },
+
+     /**
+     * Loads this content panel immediately with content returned from an XHR call.
+     * @param {Object/String/Function} config A config object containing any of the following options:
+<pre><code>
+panel.load({
+    url: 'your-url.php',
+    params: {param1: 'foo', param2: 'bar'}, // or a URL encoded string
+    callback: yourFunction,
+    scope: yourObject, // optional scope for the callback
+    discardUrl: false,
+    nocache: false,
+    text: 'Loading...',
+    timeout: 30,
+    scripts: false
+});
+</code></pre>
+     * The only required property is url. The optional properties nocache, text and scripts
+     * are shorthand for disableCaching, indicatorText and loadScripts and are used to set their
+     * associated property on this panel Updater instance.
+     * @return {Ext.Panel} this
+     */
+    load : function(){
+        var um = this.body.getUpdater();
+        um.update.apply(um, arguments);
+        return this;
+    },
+
+    // private
+    beforeDestroy : function(){
+        Ext.Panel.superclass.beforeDestroy.call(this);
+        if(this.header){
+            this.header.removeAllListeners();
+        }
+        if(this.tools){
+            for(var k in this.tools){
+                Ext.destroy(this.tools[k]);
+            }
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.un('afterlayout', this.syncHeight, this);
+                tb.un('remove', this.syncHeight, this);
+            }, this);
+        }
+        if(Ext.isArray(this.buttons)){
+            while(this.buttons.length) {
+                Ext.destroy(this.buttons[0]);
+            }
+        }
+        if(this.rendered){
+            Ext.destroy(
+                this.ft,
+                this.header,
+                this.footer,
+                this.tbar,
+                this.bbar,
+                this.body,
+                this.mc,
+                this.bwrap,
+                this.dd
+            );
+            if (this.fbar) {
+                Ext.destroy(
+                    this.fbar,
+                    this.fbar.el
+                );
+            }
+        }
+        Ext.destroy(this.toolbars);
+    },
+
+    // private
+    createClasses : function(){
+        this.headerCls = this.baseCls + '-header';
+        this.headerTextCls = this.baseCls + '-header-text';
+        this.bwrapCls = this.baseCls + '-bwrap';
+        this.tbarCls = this.baseCls + '-tbar';
+        this.bodyCls = this.baseCls + '-body';
+        this.bbarCls = this.baseCls + '-bbar';
+        this.footerCls = this.baseCls + '-footer';
+    },
+
+    // private
+    createGhost : function(cls, useShim, appendTo){
+        var el = document.createElement('div');
+        el.className = 'x-panel-ghost ' + (cls ? cls : '');
+        if(this.header){
+            el.appendChild(this.el.dom.firstChild.cloneNode(true));
+        }
+        Ext.fly(el.appendChild(document.createElement('ul'))).setHeight(this.bwrap.getHeight());
+        el.style.width = this.el.dom.offsetWidth + 'px';;
+        if(!appendTo){
+            this.container.dom.appendChild(el);
+        }else{
+            Ext.getDom(appendTo).appendChild(el);
+        }
+        if(useShim !== false && this.el.useShim !== false){
+            var layer = new Ext.Layer({shadow:false, useDisplay:true, constrain:false}, el);
+            layer.show();
+            return layer;
+        }else{
+            return new Ext.Element(el);
+        }
+    },
+
+    // private
+    doAutoLoad : function(){
+        var u = this.body.getUpdater();
+        if(this.renderer){
+            u.setRenderer(this.renderer);
+        }
+        u.update(Ext.isObject(this.autoLoad) ? this.autoLoad : {url: this.autoLoad});
+    },
+
+    /**
+     * Retrieve a tool by id.
+     * @param {String} id
+     * @return {Object} tool
+     */
+    getTool : function(id) {
+        return this.tools[id];
+    }
+
+/**
+ * @cfg {String} autoEl @hide
+ */
+});
+Ext.reg('panel', Ext.Panel);
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/WindowManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/WindowManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/WindowManager.js	(revision 76)
@@ -0,0 +1,209 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.WindowGroup
+ * An object that manages a group of {@link Ext.Window} instances and provides z-order management
+ * and window activation behavior.
+ * @constructor
+ */
+Ext.WindowGroup = function(){
+    var list = {};
+    var accessList = [];
+    var front = null;
+
+    // private
+    var sortWindows = function(d1, d2){
+        return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;
+    };
+
+    // private
+    var orderWindows = function(){
+        var a = accessList, len = a.length;
+        if(len > 0){
+            a.sort(sortWindows);
+            var seed = a[0].manager.zseed;
+            for(var i = 0; i < len; i++){
+                var win = a[i];
+                if(win && !win.hidden){
+                    win.setZIndex(seed + (i*10));
+                }
+            }
+        }
+        activateLast();
+    };
+
+    // private
+    var setActiveWin = function(win){
+        if(win != front){
+            if(front){
+                front.setActive(false);
+            }
+            front = win;
+            if(win){
+                win.setActive(true);
+            }
+        }
+    };
+
+    // private
+    var activateLast = function(){
+        for(var i = accessList.length-1; i >=0; --i) {
+            if(!accessList[i].hidden){
+                setActiveWin(accessList[i]);
+                return;
+            }
+        }
+        // none to activate
+        setActiveWin(null);
+    };
+
+    return {
+        /**
+         * The starting z-index for windows in this WindowGroup (defaults to 9000)
+         * @type Number The z-index value
+         */
+        zseed : 9000,
+
+        /**
+         * <p>Registers a {@link Ext.Window Window} with this WindowManager. This should not
+         * need to be called under normal circumstances. Windows are automatically registered
+         * with a {@link Ext.Window#manager manager} at construction time.</p>
+         * <p>Where this may be useful is moving Windows between two WindowManagers. For example,
+         * to bring the Ext.MessageBox dialog under the same manager as the Desktop's
+         * WindowManager in the desktop sample app:</p><code><pre>
+var msgWin = Ext.MessageBox.getDialog();
+MyDesktop.getDesktop().getManager().register(msgWin);
+</pre></code>
+         * @param {Window} win The Window to register.
+         */
+        register : function(win){
+            if(win.manager){
+                win.manager.unregister(win);
+            }
+            win.manager = this;
+
+            list[win.id] = win;
+            accessList.push(win);
+            win.on('hide', activateLast);
+        },
+
+        /**
+         * <p>Unregisters a {@link Ext.Window Window} from this WindowManager. This should not
+         * need to be called. Windows are automatically unregistered upon destruction.
+         * See {@link #register}.</p>
+         * @param {Window} win The Window to unregister.
+         */
+        unregister : function(win){
+            delete win.manager;
+            delete list[win.id];
+            win.un('hide', activateLast);
+            accessList.remove(win);
+        },
+
+        /**
+         * Gets a registered window by id.
+         * @param {String/Object} id The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window}
+         */
+        get : function(id){
+            return typeof id == "object" ? id : list[id];
+        },
+
+        /**
+         * Brings the specified window to the front of any other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Boolean} True if the dialog was brought to the front, else false
+         * if it was already in front
+         */
+        bringToFront : function(win){
+            win = this.get(win);
+            if(win != front){
+                win._lastAccess = new Date().getTime();
+                orderWindows();
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Sends the specified window to the back of other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window} The window
+         */
+        sendToBack : function(win){
+            win = this.get(win);
+            win._lastAccess = -(new Date().getTime());
+            orderWindows();
+            return win;
+        },
+
+        /**
+         * Hides all windows in this WindowGroup.
+         */
+        hideAll : function(){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function" && list[id].isVisible()){
+                    list[id].hide();
+                }
+            }
+        },
+
+        /**
+         * Gets the currently-active window in this WindowGroup.
+         * @return {Ext.Window} The active window
+         */
+        getActive : function(){
+            return front;
+        },
+
+        /**
+         * Returns zero or more windows in this WindowGroup using the custom search function passed to this method.
+         * The function should accept a single {@link Ext.Window} reference as its only argument and should
+         * return true if the window matches the search criteria, otherwise it should return false.
+         * @param {Function} fn The search function
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Window being tested.
+         * that gets passed to the function if not specified)
+         * @return {Array} An array of zero or more matching windows
+         */
+        getBy : function(fn, scope){
+            var r = [];
+            for(var i = accessList.length-1; i >=0; --i) {
+                var win = accessList[i];
+                if(fn.call(scope||win, win) !== false){
+                    r.push(win);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Executes the specified function once for every window in this WindowGroup, passing each
+         * window as the only parameter. Returning false from the function will stop the iteration.
+         * @param {Function} fn The function to execute for each item
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Window in the iteration.
+         */
+        each : function(fn, scope){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function"){
+                    if(fn.call(scope || list[id], list[id]) === false){
+                        return;
+                    }
+                }
+            }
+        }
+    };
+};
+
+
+/**
+ * @class Ext.WindowMgr
+ * @extends Ext.WindowGroup
+ * The default global window group that is available automatically.  To have more than one group of windows
+ * with separate z-order stacks, create additional instances of {@link Ext.WindowGroup} as needed.
+ * @singleton
+ */
+Ext.WindowMgr = new Ext.WindowGroup();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Toolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Toolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Toolbar.js	(revision 76)
@@ -0,0 +1,585 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Toolbar
+ * @extends Ext.Container
+ * <p>Basic Toolbar class. Although the <tt>{@link Ext.Container#defaultType defaultType}</tt> for Toolbar
+ * is <tt>{@link Ext.Button button}</tt>, Toolbar elements (child items for the Toolbar container) may
+ * be virtually any type of Component. Toolbar elements can be created explicitly via their constructors,
+ * or implicitly via their xtypes, and can be <tt>{@link #add}</tt>ed dynamically.</p>
+ * <p>Some items have shortcut strings for creation:</p>
+ * <pre>
+<u>Shortcut</u>  <u>xtype</u>          <u>Class</u>                  <u>Description</u>
+'->'      'tbfill'       {@link Ext.Toolbar.Fill}       begin using the right-justified button container
+'-'       'tbseparator'  {@link Ext.Toolbar.Separator}  add a vertical separator bar between toolbar items
+' '       'tbspacer'     {@link Ext.Toolbar.Spacer}     add horiztonal space between elements
+ * </pre>
+ *
+ * Example usage of various elements:
+ * <pre><code>
+var tb = new Ext.Toolbar({
+    renderTo: document.body,
+    width: 600,
+    height: 100,
+    items: [
+        {
+            // xtype: 'button', // default for Toolbars, same as 'tbbutton'
+            text: 'Button'
+        },
+        {
+            xtype: 'splitbutton', // same as 'tbsplitbutton'
+            text: 'Split Button'
+        },
+        // begin using the right-justified button container
+        '->', // same as {xtype: 'tbfill'}, // Ext.Toolbar.Fill
+        {
+            xtype: 'textfield',
+            name: 'field1',
+            emptyText: 'enter search term'
+        },
+        // add a vertical separator bar between toolbar items
+        '-', // same as {xtype: 'tbseparator'} to create Ext.Toolbar.Separator
+        'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.Toolbar.TextItem
+        {xtype: 'tbspacer'},// same as ' ' to create Ext.Toolbar.Spacer
+        'text 2',
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'text 3'
+    ]
+});
+ * </code></pre>
+ * Example adding a ComboBox within a menu of a button:
+ * <pre><code>
+// ComboBox creation
+var combo = new Ext.form.ComboBox({
+    store: new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: ['initials', 'fullname'],
+        data : [
+            ['FF', 'Fred Flintstone'],
+            ['BR', 'Barney Rubble']
+        ]
+    }),
+    displayField: 'fullname',
+    typeAhead: true,
+    mode: 'local',
+    forceSelection: true,
+    triggerAction: 'all',
+    emptyText: 'Select a name...',
+    selectOnFocus: true,
+    width: 135,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon' //use iconCls if placing within menu to shift to right side of menu
+});
+
+// put ComboBox in a Menu
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+
+// add a Button with the menu
+tb.add({
+        text:'Button w/ Menu',
+        menu: menu  // assign menu by instance
+    });
+tb.doLayout();
+ * </code></pre>
+ * @constructor
+ * Creates a new Toolbar
+ * @param {Object/Array} config A config object or an array of buttons to <tt>{@link #add}</tt>
+ * @xtype toolbar
+ */
+Ext.Toolbar = function(config){
+    if(Ext.isArray(config)){
+        config = {items: config, layout: 'toolbar'};
+    } else {
+        config = Ext.apply({
+            layout: 'toolbar'
+        }, config);
+        if(config.buttons) {
+            config.items = config.buttons;
+        }
+    }
+    Ext.Toolbar.superclass.constructor.call(this, config);
+};
+
+(function(){
+
+var T = Ext.Toolbar;
+
+Ext.extend(T, Ext.Container, {
+
+    defaultType: 'button',
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>toolbar</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout
+     * is required (the constructor must be passed a configuration object in this
+     * case instead of an array).
+     * See {@link Ext.Container#layout} for additional information.
+     */
+
+    enableOverflow : false,
+
+    /**
+     * @cfg {Boolean} enableOverflow
+     * Defaults to false. Configure <tt>true</tt> to make the toolbar provide a button
+     * which activates a dropdown Menu to show items which overflow the Toolbar's width.
+     */
+    /**
+     * @cfg {String} buttonAlign
+     * <p>The default position at which to align child items. Defaults to <code>"left"</code></p>
+     * <p>May be specified as <code>"center"</code> to cause items added before a Fill (A <code>"->"</code>) item
+     * to be centered in the Toolbar. Items added after a Fill are still right-aligned.</p>
+     * <p>Specify as <code>"right"</code> to right align all child items.</p>
+     */
+
+    trackMenus : true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+    toolbarCls: 'x-toolbar',
+
+    initComponent : function(){
+        T.superclass.initComponent.call(this);
+
+        /**
+         * @event overflowchange
+         * Fires after the overflow state has changed.
+         * @param {Object} c The Container
+         * @param {Boolean} lastOverflow overflow state
+         */
+        this.addEvents('overflowchange');
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            if(!this.autoCreate){
+                this.autoCreate = {
+                    cls: this.toolbarCls + ' x-small-editor'
+                };
+            }
+            this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);
+            Ext.Toolbar.superclass.onRender.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Adds element(s) to the toolbar -- this function takes a variable number of
+     * arguments of mixed type and adds them to the toolbar.</p>
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} arg1 The following types of arguments are all valid:<br />
+     * <ul>
+     * <li>{@link Ext.Button} config: A valid button config object (equivalent to {@link #addButton})</li>
+     * <li>HtmlElement: Any standard HTML element (equivalent to {@link #addElement})</li>
+     * <li>Field: Any form field (equivalent to {@link #addField})</li>
+     * <li>Item: Any subclass of {@link Ext.Toolbar.Item} (equivalent to {@link #addItem})</li>
+     * <li>String: Any generic string (gets wrapped in a {@link Ext.Toolbar.TextItem}, equivalent to {@link #addText}).
+     * Note that there are a few special strings that are treated differently as explained next.</li>
+     * <li>'-': Creates a separator element (equivalent to {@link #addSeparator})</li>
+     * <li>' ': Creates a spacer element (equivalent to {@link #addSpacer})</li>
+     * <li>'->': Creates a fill element (equivalent to {@link #addFill})</li>
+     * </ul>
+     * @param {Mixed} arg2
+     * @param {Mixed} etc.
+     * @method add
+     */
+
+    // private
+    lookupComponent : function(c){
+        if(Ext.isString(c)){
+            if(c == '-'){
+                c = new T.Separator();
+            }else if(c == ' '){
+                c = new T.Spacer();
+            }else if(c == '->'){
+                c = new T.Fill();
+            }else{
+                c = new T.TextItem(c);
+            }
+            this.applyDefaults(c);
+        }else{
+            if(c.isFormField || c.render){ // some kind of form field, some kind of Toolbar.Item
+                c = this.createComponent(c);
+            }else if(c.tag){ // DomHelper spec
+                c = new T.Item({autoEl: c});
+            }else if(c.tagName){ // element
+                c = new T.Item({el:c});
+            }else if(Ext.isObject(c)){ // must be button config?
+                c = c.xtype ? this.createComponent(c) : this.constructButton(c);
+            }
+        }
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        if(!Ext.isString(c)){
+            c = Ext.Toolbar.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(c.events){
+                Ext.applyIf(c.initialConfig, d);
+                Ext.apply(c, d);
+            }else{
+                Ext.applyIf(c, d);
+            }
+        }
+        return c;
+    },
+
+    /**
+     * Adds a separator
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Item} The separator {@link Ext.Toolbar.Item item}
+     */
+    addSeparator : function(){
+        return this.add(new T.Separator());
+    },
+
+    /**
+     * Adds a spacer element
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Spacer} The spacer item
+     */
+    addSpacer : function(){
+        return this.add(new T.Spacer());
+    },
+
+    /**
+     * Forces subsequent additions into the float:right toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     */
+    addFill : function(){
+        this.add(new T.Fill());
+    },
+
+    /**
+     * Adds any standard HTML element to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} el The element or id of the element to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addElement : function(el){
+        return this.addItem(new T.Item({el:el}));
+    },
+
+    /**
+     * Adds any Toolbar.Item or subclass
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.Toolbar.Item} item
+     * @return {Ext.Toolbar.Item} The item
+     */
+    addItem : function(item){
+        return this.add.apply(this, arguments);
+    },
+
+    /**
+     * Adds a button (or buttons). See {@link Ext.Button} for more info on the config.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object/Array} config A button config or array of configs
+     * @return {Ext.Button/Array}
+     */
+    addButton : function(config){
+        if(Ext.isArray(config)){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+                buttons.push(this.addButton(config[i]));
+            }
+            return buttons;
+        }
+        return this.add(this.constructButton(config));
+    },
+
+    /**
+     * Adds text to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {String} text The text to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addText : function(text){
+        return this.addItem(new T.TextItem(text));
+    },
+
+    /**
+     * Adds a new element to the toolbar from the passed {@link Ext.DomHelper} config
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object} config
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addDom : function(config){
+        return this.add(new T.Item({autoEl: config}));
+    },
+
+    /**
+     * Adds a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have
+     * been rendered yet. For a field that has already been rendered, use {@link #addElement}.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.form.Field} field
+     * @return {Ext.Toolbar.Item}
+     */
+    addField : function(field){
+        return this.add(field);
+    },
+
+    /**
+     * Inserts any {@link Ext.Toolbar.Item}/{@link Ext.Button} at the specified index.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Number} index The index where the item is to be inserted
+     * @param {Object/Ext.Toolbar.Item/Ext.Button/Array} item The button, or button config object to be
+     * inserted, or an array of buttons/configs.
+     * @return {Ext.Button/Item}
+     */
+    insertButton : function(index, item){
+        if(Ext.isArray(item)){
+            var buttons = [];
+            for(var i = 0, len = item.length; i < len; i++) {
+               buttons.push(this.insertButton(index + i, item[i]));
+            }
+            return buttons;
+        }
+        return Ext.Toolbar.superclass.insert.call(this, index, item);
+    },
+
+    // private
+    trackMenu : function(item, remove){
+        if(this.trackMenus && item.menu){
+            var method = remove ? 'mun' : 'mon';
+            this[method](item, 'menutriggerover', this.onButtonTriggerOver, this);
+            this[method](item, 'menushow', this.onButtonMenuShow, this);
+            this[method](item, 'menuhide', this.onButtonMenuHide, this);
+        }
+    },
+
+    // private
+    constructButton : function(item){
+        var b = item.events ? item : this.createComponent(item, item.split ? 'splitbutton' : this.defaultType);
+        return b;
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.Toolbar.superclass.onAdd.call(this);
+        this.trackMenu(c);
+        if(this.disabled){
+            c.disable();
+        }
+    },
+
+    // private
+    onRemove : function(c){
+        Ext.Toolbar.superclass.onRemove.call(this);
+        if (c == this.activeMenuBtn) {
+            delete this.activeMenuBtn;
+        }
+        this.trackMenu(c, true);
+    },
+
+    // private
+    onDisable : function(){
+        this.items.each(function(item){
+             if(item.disable){
+                 item.disable();
+             }
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.items.each(function(item){
+             if(item.enable){
+                 item.enable();
+             }
+        });
+    },
+
+    // private
+    onButtonTriggerOver : function(btn){
+        if(this.activeMenuBtn && this.activeMenuBtn != btn){
+            this.activeMenuBtn.hideMenu();
+            btn.showMenu();
+            this.activeMenuBtn = btn;
+        }
+    },
+
+    // private
+    onButtonMenuShow : function(btn){
+        this.activeMenuBtn = btn;
+    },
+
+    // private
+    onButtonMenuHide : function(btn){
+        delete this.activeMenuBtn;
+    }
+});
+Ext.reg('toolbar', Ext.Toolbar);
+
+/**
+ * @class Ext.Toolbar.Item
+ * @extends Ext.BoxComponent
+ * The base class that other non-interacting Toolbar Item classes should extend in order to
+ * get some basic common toolbar item functionality.
+ * @constructor
+ * Creates a new Item
+ * @param {HTMLElement} el
+ * @xtype tbitem
+ */
+T.Item = Ext.extend(Ext.BoxComponent, {
+    hideParent: true, //  Hiding a Toolbar.Item hides its containing TD
+    enable:Ext.emptyFn,
+    disable:Ext.emptyFn,
+    focus:Ext.emptyFn
+    /**
+     * @cfg {String} overflowText Text to be used for the menu if the item is overflowed.
+     */
+});
+Ext.reg('tbitem', T.Item);
+
+/**
+ * @class Ext.Toolbar.Separator
+ * @extends Ext.Toolbar.Item
+ * A simple class that adds a vertical separator bar between toolbar items
+ * (css class:<tt>'xtb-sep'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbseparator'}, // or '-'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Separator
+ * @xtype tbseparator
+ */
+T.Separator = Ext.extend(T.Item, {
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'span', cls:'xtb-sep'}, position);
+    }
+});
+Ext.reg('tbseparator', T.Separator);
+
+/**
+ * @class Ext.Toolbar.Spacer
+ * @extends Ext.Toolbar.Item
+ * A simple element that adds extra horizontal space between items in a toolbar.
+ * By default a 2px wide space is added via css specification:<pre><code>
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+ * </code></pre>
+ * <p>Example usage:</p>
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbspacer'}, // or ' '
+        'Item 2',
+        // space width is also configurable via javascript
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'Item 3'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Spacer
+ * @xtype tbspacer
+ */
+T.Spacer = Ext.extend(T.Item, {
+    /**
+     * @cfg {Number} width
+     * The width of the spacer in pixels (defaults to 2px via css style <tt>.x-toolbar .xtb-spacer</tt>).
+     */
+
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'div', cls:'xtb-spacer', style: this.width?'width:'+this.width+'px':''}, position);
+    }
+});
+Ext.reg('tbspacer', T.Spacer);
+
+/**
+ * @class Ext.Toolbar.Fill
+ * @extends Ext.Toolbar.Spacer
+ * A non-rendering placeholder item which instructs the Toolbar's Layout to begin using
+ * the right-justified button container.
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbfill'}, // or '->'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Fill
+ * @xtype tbfill
+ */
+T.Fill = Ext.extend(T.Item, {
+    // private
+    render : Ext.emptyFn,
+    isFill : true
+});
+Ext.reg('tbfill', T.Fill);
+
+/**
+ * @class Ext.Toolbar.TextItem
+ * @extends Ext.Toolbar.Item
+ * A simple class that renders text directly into a toolbar
+ * (with css class:<tt>'xtb-text'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        {xtype: 'tbtext', text: 'Item 1'} // or simply 'Item 1'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new TextItem
+ * @param {String/Object} text A text string, or a config object containing a <tt>text</tt> property
+ * @xtype tbtext
+ */
+T.TextItem = Ext.extend(T.Item, {
+    /**
+     * @cfg {String} text The text to be used as innerHTML (html tags are accepted)
+     */
+
+    constructor: function(config){
+        T.TextItem.superclass.constructor.call(this, Ext.isString(config) ? {text: config} : config);
+    },
+
+    // private
+    onRender : function(ct, position) {
+        this.autoEl = {cls: 'xtb-text', html: this.text || ''};
+        T.TextItem.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates this item's text, setting the text to be used as innerHTML.
+     * @param {String} t The text to display (html accepted).
+     */
+    setText : function(t) {
+        if(this.rendered){
+            this.el.update(t);
+        }else{
+            this.text = t;
+        }
+    }
+});
+Ext.reg('tbtext', T.TextItem);
+
+// backwards compat
+T.Button = Ext.extend(Ext.Button, {});
+T.SplitButton = Ext.extend(Ext.SplitButton, {});
+Ext.reg('tbbutton', T.Button);
+Ext.reg('tbsplit', T.SplitButton);
+
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/widgets/Component.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/widgets/Component.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/widgets/Component.js	(revision 76)
@@ -0,0 +1,1801 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Component
+ * @extends Ext.util.Observable
+ * <p>Base class for all Ext components.  All subclasses of Component may participate in the automated
+ * Ext component lifecycle of creation, rendering and destruction which is provided by the {@link Ext.Container Container} class.
+ * Components may be added to a Container through the {@link Ext.Container#items items} config option at the time the Container is created,
+ * or they may be added dynamically via the {@link Ext.Container#add add} method.</p>
+ * <p>The Component base class has built-in support for basic hide/show and enable/disable behavior.</p>
+ * <p>All Components are registered with the {@link Ext.ComponentMgr} on construction so that they can be referenced at any time via
+ * {@link Ext#getCmp}, passing the {@link #id}.</p>
+ * <p>All user-developed visual widgets that are required to participate in automated lifecycle and size management should subclass Component (or
+ * {@link Ext.BoxComponent} if managed box model handling is required, ie height and width management).</p>
+ * <p>See the <a href="http://extjs.com/learn/Tutorial:Creating_new_UI_controls">Creating new UI controls</a> tutorial for details on how
+ * and to either extend or augment ExtJs base classes to create custom Components.</p>
+ * <p>Every component has a specific xtype, which is its Ext-specific type name, along with methods for checking the
+ * xtype like {@link #getXType} and {@link #isXType}. This is the list of all valid xtypes:</p>
+ * <pre>
+xtype            Class
+-------------    ------------------
+box              {@link Ext.BoxComponent}
+button           {@link Ext.Button}
+buttongroup      {@link Ext.ButtonGroup}
+colorpalette     {@link Ext.ColorPalette}
+component        {@link Ext.Component}
+container        {@link Ext.Container}
+cycle            {@link Ext.CycleButton}
+dataview         {@link Ext.DataView}
+datepicker       {@link Ext.DatePicker}
+editor           {@link Ext.Editor}
+editorgrid       {@link Ext.grid.EditorGridPanel}
+flash            {@link Ext.FlashComponent}
+grid             {@link Ext.grid.GridPanel}
+listview         {@link Ext.ListView}
+multislider      {@link Ext.slider.MultiSlider}
+panel            {@link Ext.Panel}
+progress         {@link Ext.ProgressBar}
+propertygrid     {@link Ext.grid.PropertyGrid}
+slider           {@link Ext.slider.SingleSlider}
+spacer           {@link Ext.Spacer}
+splitbutton      {@link Ext.SplitButton}
+tabpanel         {@link Ext.TabPanel}
+treepanel        {@link Ext.tree.TreePanel}
+viewport         {@link Ext.ViewPort}
+window           {@link Ext.Window}
+
+Toolbar components
+---------------------------------------
+paging           {@link Ext.PagingToolbar}
+toolbar          {@link Ext.Toolbar}
+tbbutton         {@link Ext.Toolbar.Button}        (deprecated; use button)
+tbfill           {@link Ext.Toolbar.Fill}
+tbitem           {@link Ext.Toolbar.Item}
+tbseparator      {@link Ext.Toolbar.Separator}
+tbspacer         {@link Ext.Toolbar.Spacer}
+tbsplit          {@link Ext.Toolbar.SplitButton}   (deprecated; use splitbutton)
+tbtext           {@link Ext.Toolbar.TextItem}
+
+Menu components
+---------------------------------------
+menu             {@link Ext.menu.Menu}
+colormenu        {@link Ext.menu.ColorMenu}
+datemenu         {@link Ext.menu.DateMenu}
+menubaseitem     {@link Ext.menu.BaseItem}
+menucheckitem    {@link Ext.menu.CheckItem}
+menuitem         {@link Ext.menu.Item}
+menuseparator    {@link Ext.menu.Separator}
+menutextitem     {@link Ext.menu.TextItem}
+
+Form components
+---------------------------------------
+form             {@link Ext.form.FormPanel}
+checkbox         {@link Ext.form.Checkbox}
+checkboxgroup    {@link Ext.form.CheckboxGroup}
+combo            {@link Ext.form.ComboBox}
+compositefield   {@link Ext.form.CompositeField}
+datefield        {@link Ext.form.DateField}
+displayfield     {@link Ext.form.DisplayField}
+field            {@link Ext.form.Field}
+fieldset         {@link Ext.form.FieldSet}
+hidden           {@link Ext.form.Hidden}
+htmleditor       {@link Ext.form.HtmlEditor}
+label            {@link Ext.form.Label}
+numberfield      {@link Ext.form.NumberField}
+radio            {@link Ext.form.Radio}
+radiogroup       {@link Ext.form.RadioGroup}
+textarea         {@link Ext.form.TextArea}
+textfield        {@link Ext.form.TextField}
+timefield        {@link Ext.form.TimeField}
+trigger          {@link Ext.form.TriggerField}
+
+Chart components
+---------------------------------------
+chart            {@link Ext.chart.Chart}
+barchart         {@link Ext.chart.BarChart}
+cartesianchart   {@link Ext.chart.CartesianChart}
+columnchart      {@link Ext.chart.ColumnChart}
+linechart        {@link Ext.chart.LineChart}
+piechart         {@link Ext.chart.PieChart}
+
+Store xtypes
+---------------------------------------
+arraystore       {@link Ext.data.ArrayStore}
+directstore      {@link Ext.data.DirectStore}
+groupingstore    {@link Ext.data.GroupingStore}
+jsonstore        {@link Ext.data.JsonStore}
+simplestore      {@link Ext.data.SimpleStore}      (deprecated; use arraystore)
+store            {@link Ext.data.Store}
+xmlstore         {@link Ext.data.XmlStore}
+</pre>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options may be specified as either:
+ * <div class="mdetail-params"><ul>
+ * <li><b>an element</b> :
+ * <p class="sub-desc">it is set as the internal element and its id used as the component id</p></li>
+ * <li><b>a string</b> :
+ * <p class="sub-desc">it is assumed to be the id of an existing element and is used as the component id</p></li>
+ * <li><b>anything else</b> :
+ * <p class="sub-desc">it is assumed to be a standard config object and is applied to the component</p></li>
+ * </ul></div>
+ */
+Ext.Component = function(config){
+    config = config || {};
+    if(config.initialConfig){
+        if(config.isAction){           // actions
+            this.baseAction = config;
+        }
+        config = config.initialConfig; // component cloning / action set up
+    }else if(config.tagName || config.dom || Ext.isString(config)){ // element object
+        config = {applyTo: config, id: config.id || config};
+    }
+
+    /**
+     * This Component's initial configuration specification. Read-only.
+     * @type Object
+     * @property initialConfig
+     */
+    this.initialConfig = config;
+
+    Ext.apply(this, config);
+    this.addEvents(
+        /**
+         * @event added
+         * Fires when a component is added to an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         * @param {number} index Position at which the component was added
+         */
+        'added',
+        /**
+         * @event disable
+         * Fires after the component is disabled.
+         * @param {Ext.Component} this
+         */
+        'disable',
+        /**
+         * @event enable
+         * Fires after the component is enabled.
+         * @param {Ext.Component} this
+         */
+        'enable',
+        /**
+         * @event beforeshow
+         * Fires before the component is shown by calling the {@link #show} method.
+         * Return false from an event handler to stop the show.
+         * @param {Ext.Component} this
+         */
+        'beforeshow',
+        /**
+         * @event show
+         * Fires after the component is shown when calling the {@link #show} method.
+         * @param {Ext.Component} this
+         */
+        'show',
+        /**
+         * @event beforehide
+         * Fires before the component is hidden by calling the {@link #hide} method.
+         * Return false from an event handler to stop the hide.
+         * @param {Ext.Component} this
+         */
+        'beforehide',
+        /**
+         * @event hide
+         * Fires after the component is hidden.
+         * Fires after the component is hidden when calling the {@link #hide} method.
+         * @param {Ext.Component} this
+         */
+        'hide',
+        /**
+         * @event removed
+         * Fires when a component is removed from an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         */
+        'removed',
+        /**
+         * @event beforerender
+         * Fires before the component is {@link #rendered}. Return false from an
+         * event handler to stop the {@link #render}.
+         * @param {Ext.Component} this
+         */
+        'beforerender',
+        /**
+         * @event render
+         * Fires after the component markup is {@link #rendered}.
+         * @param {Ext.Component} this
+         */
+        'render',
+        /**
+         * @event afterrender
+         * <p>Fires after the component rendering is finished.</p>
+         * <p>The afterrender event is fired after this Component has been {@link #rendered}, been postprocesed
+         * by any afterRender method defined for the Component, and, if {@link #stateful}, after state
+         * has been restored.</p>
+         * @param {Ext.Component} this
+         */
+        'afterrender',
+        /**
+         * @event beforedestroy
+         * Fires before the component is {@link #destroy}ed. Return false from an event handler to stop the {@link #destroy}.
+         * @param {Ext.Component} this
+         */
+        'beforedestroy',
+        /**
+         * @event destroy
+         * Fires after the component is {@link #destroy}ed.
+         * @param {Ext.Component} this
+         */
+        'destroy',
+        /**
+         * @event beforestaterestore
+         * Fires before the state of the component is restored. Return false from an event handler to stop the restore.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. If this
+         * event is not vetoed, then the state object is passed to <b><tt>applyState</tt></b>. By default,
+         * that simply copies property values into this Component. The method maybe overriden to
+         * provide custom state restoration.
+         */
+        'beforestaterestore',
+        /**
+         * @event staterestore
+         * Fires after the state of the component is restored.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. This is passed
+         * to <b><tt>applyState</tt></b>. By default, that simply copies property values into this
+         * Component. The method maybe overriden to provide custom state restoration.
+         */
+        'staterestore',
+        /**
+         * @event beforestatesave
+         * Fires before the state of the component is saved to the configured state provider. Return false to stop the save.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'beforestatesave',
+        /**
+         * @event statesave
+         * Fires after the state of the component is saved to the configured state provider.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'statesave'
+    );
+    this.getId();
+    Ext.ComponentMgr.register(this);
+    Ext.Component.superclass.constructor.call(this);
+
+    if(this.baseAction){
+        this.baseAction.addComponent(this);
+    }
+
+    this.initComponent();
+
+    if(this.plugins){
+        if(Ext.isArray(this.plugins)){
+            for(var i = 0, len = this.plugins.length; i < len; i++){
+                this.plugins[i] = this.initPlugin(this.plugins[i]);
+            }
+        }else{
+            this.plugins = this.initPlugin(this.plugins);
+        }
+    }
+
+    if(this.stateful !== false){
+        this.initState();
+    }
+
+    if(this.applyTo){
+        this.applyToMarkup(this.applyTo);
+        delete this.applyTo;
+    }else if(this.renderTo){
+        this.render(this.renderTo);
+        delete this.renderTo;
+    }
+};
+
+// private
+Ext.Component.AUTO_ID = 1000;
+
+Ext.extend(Ext.Component, Ext.util.Observable, {
+    // Configs below are used for all Components when rendered by FormLayout.
+    /**
+     * @cfg {String} fieldLabel <p>The label text to display next to this Component (defaults to '').</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelStyle <p>A CSS style specification string to apply directly to this field's
+     * label.  Defaults to the container's labelStyle value if set (e.g.,
+     * <tt>{@link Ext.layout.FormLayout#labelStyle}</tt> , or '').</p>
+     * <br><p><b>Note</b>: see the note for <code>{@link #clearCls}</code>.</p><br>
+     * <p>Also see <code>{@link #hideLabel}</code> and
+     * <code>{@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</code></p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        labelStyle: 'font-weight:bold;'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelSeparator <p>The separator to display after the text of each
+     * <tt>{@link #fieldLabel}</tt>.  This property may be configured at various levels.
+     * The order of precedence is:
+     * <div class="mdetail-params"><ul>
+     * <li>field / component level</li>
+     * <li>container level</li>
+     * <li>{@link Ext.layout.FormLayout#labelSeparator layout level} (defaults to colon <tt>':'</tt>)</li>
+     * </ul></div>
+     * To display no separator for this field's label specify empty string ''.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    layoutConfig: {
+        labelSeparator: '~'   // layout config has lowest priority (defaults to ':')
+    },
+    {@link Ext.layout.FormLayout#labelSeparator labelSeparator}: '>>',     // config at container level
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Field 1',
+        labelSeparator: '...' // field/component level config supersedes others
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Field 2' // labelSeparator will be '='
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideLabel <p><tt>true</tt> to completely hide the label element
+     * ({@link #fieldLabel label} and {@link #labelSeparator separator}). Defaults to <tt>false</tt>.
+     * By default, even if you do not specify a <tt>{@link #fieldLabel}</tt> the space will still be
+     * reserved so that the field will line up with other fields that do have labels.
+     * Setting this to <tt>true</tt> will cause the field to not reserve that space.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield'
+        hideLabel: true
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} clearCls <p>The CSS class used to to apply to the special clearing div rendered
+     * directly after each form field wrapper to provide field clearing (defaults to
+     * <tt>'x-form-clear-left'</tt>).</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container
+     * which has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout
+     * manager (e.g. {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) and either a
+     * <tt>{@link #fieldLabel}</tt> is specified or <tt>isFormField=true</tt> is specified.</p><br>
+     * <p>See {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} also.</p>
+     */
+    /**
+     * @cfg {String} itemCls
+     * <p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>An additional CSS class to apply to the div wrapping the form item
+     * element of this field.  If supplied, <tt>itemCls</tt> at the <b>field</b> level will override
+     * the default <tt>itemCls</tt> supplied at the <b>container</b> level. The value specified for
+     * <tt>itemCls</tt> will be added to the default class (<tt>'x-form-item'</tt>).</p>
+     * <p>Since it is applied to the item wrapper (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}), it allows
+     * you to write standard CSS rules that can apply to the field, the label (if specified), or
+     * any other element within the markup for the field.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #fieldLabel}</tt>.</p><br>
+     * Example use:<pre><code>
+// Apply a style to the field&#39;s label:
+&lt;style>
+    .required .x-form-item-label {font-weight:bold;color:red;}
+&lt;/style>
+
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        itemCls: 'required' //this label will be styled
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Favorite Color'
+    }]
+});
+</code></pre>
+     */
+
+    /**
+     * @cfg {String} id
+     * <p>The <b>unique</b> id of this component (defaults to an {@link #getId auto-assigned id}).
+     * You should assign an id if you need to be able to access the component later and you do
+     * not have an object reference available (e.g., using {@link Ext}.{@link Ext#getCmp getCmp}).</p>
+     * <p>Note that this id will also be used as the element id for the containing HTML element
+     * that is rendered to the page for this component. This allows you to write id-based CSS
+     * rules to style the specific instance of this component uniquely, and also to select
+     * sub-elements using this component's id as the parent.</p>
+     * <p><b>Note</b>: to avoid complications imposed by a unique <tt>id</tt> also see
+     * <code>{@link #itemId}</code> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <code>{@link #ownerCt}</code>.</p>
+     */
+    /**
+     * @cfg {String} itemId
+     * <p>An <tt>itemId</tt> can be used as an alternative way to get a reference to a component
+     * when no object reference is available.  Instead of using an <code>{@link #id}</code> with
+     * {@link Ext}.{@link Ext#getCmp getCmp}, use <code>itemId</code> with
+     * {@link Ext.Container}.{@link Ext.Container#getComponent getComponent} which will retrieve
+     * <code>itemId</code>'s or <tt>{@link #id}</tt>'s. Since <code>itemId</code>'s are an index to the
+     * container's internal MixedCollection, the <code>itemId</code> is scoped locally to the container --
+     * avoiding potential conflicts with {@link Ext.ComponentMgr} which requires a <b>unique</b>
+     * <code>{@link #id}</code>.</p>
+     * <pre><code>
+var c = new Ext.Panel({ //
+    {@link Ext.BoxComponent#height height}: 300,
+    {@link #renderTo}: document.body,
+    {@link Ext.Container#layout layout}: 'auto',
+    {@link Ext.Container#items items}: [
+        {
+            itemId: 'p1',
+            {@link Ext.Panel#title title}: 'Panel 1',
+            {@link Ext.BoxComponent#height height}: 150
+        },
+        {
+            itemId: 'p2',
+            {@link Ext.Panel#title title}: 'Panel 2',
+            {@link Ext.BoxComponent#height height}: 150
+        }
+    ]
+})
+p1 = c.{@link Ext.Container#getComponent getComponent}('p1'); // not the same as {@link Ext#getCmp Ext.getCmp()}
+p2 = p1.{@link #ownerCt}.{@link Ext.Container#getComponent getComponent}('p2'); // reference via a sibling
+     * </code></pre>
+     * <p>Also see <tt>{@link #id}</tt> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <tt>{@link #ownerCt}</tt>.</p>
+     */
+    /**
+     * @cfg {String} xtype
+     * The registered <tt>xtype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a child item of a Container is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>xtype</tt> will be looked up at render time up to determine what
+     * type of child Component to create.<br><br>
+     * The predefined xtypes are listed {@link Ext.Component here}.
+     * <br><br>
+     * If you subclass Components to create your own Components, you may register
+     * them using {@link Ext.ComponentMgr#registerType} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} ptype
+     * The registered <tt>ptype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a Plugin is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>ptype</tt> will be looked up at render time up to determine what
+     * type of Plugin to create.<br><br>
+     * If you create your own Plugins, you may register them using
+     * {@link Ext.ComponentMgr#registerPlugin} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} cls
+     * An optional extra CSS class that will be added to this component's Element (defaults to '').  This can be
+     * useful for adding customized styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} overCls
+     * An optional extra CSS class that will be added to this component's Element when the mouse moves
+     * over the Element, and removed when the mouse moves out. (defaults to '').  This can be
+     * useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} style
+     * A custom style specification to be applied to this component's Element.  Should be a valid argument to
+     * {@link Ext.Element#applyStyles}.
+     * <pre><code>
+new Ext.Panel({
+    title: 'Some Title',
+    renderTo: Ext.getBody(),
+    width: 400, height: 300,
+    layout: 'form',
+    items: [{
+        xtype: 'textarea',
+        style: {
+            width: '95%',
+            marginBottom: '10px'
+        }
+    },
+        new Ext.Button({
+            text: 'Send',
+            minWidth: '100',
+            style: {
+                marginBottom: '10px'
+            }
+        })
+    ]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} ctCls
+     * <p>An optional extra CSS class that will be added to this component's container. This can be useful for
+     * adding customized styles to the container or any of its children using standard CSS rules.  See
+     * {@link Ext.layout.ContainerLayout}.{@link Ext.layout.ContainerLayout#extraCls extraCls} also.</p>
+     * <p><b>Note</b>: <tt>ctCls</tt> defaults to <tt>''</tt> except for the following class
+     * which assigns a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-layout-ct'</tt></li>
+     * </ul></div>
+     * To configure the above Class with an extra CSS class append to the default.  For example,
+     * for BoxLayout (Hbox and Vbox):<pre><code>
+     * ctCls: 'x-box-layout-ct custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this component disabled (default is false).
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is false). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : false,
+    /**
+     * @cfg {Object/Array} plugins
+     * An object or array of objects that will provide custom functionality for this component.  The only
+     * requirement for a valid plugin is that it contain an init method that accepts a reference of type Ext.Component.
+     * When a component is created, if any plugins are available, the component will call the init method on each
+     * plugin, passing a reference to itself.  Each plugin can then call methods or respond to events on the
+     * component as needed to provide its functionality.
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>Specify the id of the element, a DOM element or an existing Element corresponding to a DIV
+     * that is already present in the document that specifies some structural markup for this
+     * component.</p><div><ul>
+     * <li><b>Description</b> : <ul>
+     * <div class="sub-desc">When <tt>applyTo</tt> is used, constituent parts of the component can also be specified
+     * by id or CSS class name within the main element, and the component being created may attempt
+     * to create its subcomponents from that markup if applicable.</div>
+     * </ul></li>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * <div class="sub-desc">If applyTo is specified, any value passed for {@link #renderTo} will be ignored and the target
+     * element's parent node will automatically be used as the component's container.</div>
+     * </ul></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Mixed} renderTo
+     * <p>Specify the id of the element, a DOM element or an existing Element that this component
+     * will be rendered into.</p><div><ul>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">Do <u>not</u> use this option if the Component is to be a child item of
+     * a {@link Ext.Container Container}. It is the responsibility of the
+     * {@link Ext.Container Container}'s {@link Ext.Container#layout layout manager}
+     * to render and manage its child items.</div>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * </ul></li>
+     * </ul></div>
+     * <p>See <tt>{@link #render}</tt> also.</p>
+     */
+    /**
+     * @cfg {Boolean} stateful
+     * <p>A flag which causes the Component to attempt to restore the state of
+     * internal properties from a saved state on startup. The component must have
+     * either a <code>{@link #stateId}</code> or <code>{@link #id}</code> assigned
+     * for state to be managed. Auto-generated ids are not guaranteed to be stable
+     * across page loads and cannot be relied upon to save and restore the same
+     * state for a component.<p>
+     * <p>For state saving to work, the state manager's provider must have been
+     * set to an implementation of {@link Ext.state.Provider} which overrides the
+     * {@link Ext.state.Provider#set set} and {@link Ext.state.Provider#get get}
+     * methods to save and recall name/value pairs. A built-in implementation,
+     * {@link Ext.state.CookieProvider} is available.</p>
+     * <p>To set the state provider for the current page:</p>
+     * <pre><code>
+Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
+    expires: new Date(new Date().getTime()+(1000*60*60*24*7)), //7 days from now
+}));
+     * </code></pre>
+     * <p>A stateful Component attempts to save state when one of the events
+     * listed in the <code>{@link #stateEvents}</code> configuration fires.</p>
+     * <p>To save state, a stateful Component first serializes its state by
+     * calling <b><code>getState</code></b>. By default, this function does
+     * nothing. The developer must provide an implementation which returns an
+     * object hash which represents the Component's restorable state.</p>
+     * <p>The value yielded by getState is passed to {@link Ext.state.Manager#set}
+     * which uses the configured {@link Ext.state.Provider} to save the object
+     * keyed by the Component's <code>{@link stateId}</code>, or, if that is not
+     * specified, its <code>{@link #id}</code>.</p>
+     * <p>During construction, a stateful Component attempts to <i>restore</i>
+     * its state by calling {@link Ext.state.Manager#get} passing the
+     * <code>{@link #stateId}</code>, or, if that is not specified, the
+     * <code>{@link #id}</code>.</p>
+     * <p>The resulting object is passed to <b><code>applyState</code></b>.
+     * The default implementation of <code>applyState</code> simply copies
+     * properties into the object, but a developer may override this to support
+     * more behaviour.</p>
+     * <p>You can perform extra processing on state save and restore by attaching
+     * handlers to the {@link #beforestaterestore}, {@link #staterestore},
+     * {@link #beforestatesave} and {@link #statesave} events.</p>
+     */
+    /**
+     * @cfg {String} stateId
+     * The unique id for this component to use for state management purposes
+     * (defaults to the component id if one was set, otherwise null if the
+     * component is using a generated id).
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Array} stateEvents
+     * <p>An array of events that, when fired, should trigger this component to
+     * save its state (defaults to none). <code>stateEvents</code> may be any type
+     * of event supported by this component, including browser or custom events
+     * (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Mixed} autoEl
+     * <p>A tag name or {@link Ext.DomHelper DomHelper} spec used to create the {@link #getEl Element} which will
+     * encapsulate this Component.</p>
+     * <p>You do not normally need to specify this. For the base classes {@link Ext.Component}, {@link Ext.BoxComponent},
+     * and {@link Ext.Container}, this defaults to <b><tt>'div'</tt></b>. The more complex Ext classes use a more complex
+     * DOM structure created by their own onRender methods.</p>
+     * <p>This is intended to allow the developer to create application-specific utility Components encapsulated by
+     * different DOM elements. Example usage:</p><pre><code>
+{
+    xtype: 'box',
+    autoEl: {
+        tag: 'img',
+        src: 'http://www.example.com/example.jpg'
+    }
+}, {
+    xtype: 'box',
+    autoEl: {
+        tag: 'blockquote',
+        html: 'autoEl is cool!'
+    }
+}, {
+    xtype: 'container',
+    autoEl: 'ul',
+    cls: 'ux-unordered-list',
+    items: {
+        xtype: 'box',
+        autoEl: 'li',
+        html: 'First list item'
+    }
+}
+</code></pre>
+     */
+    autoEl : 'div',
+
+    /**
+     * @cfg {String} disabledClass
+     * CSS class added to the component when it is disabled (defaults to 'x-item-disabled').
+     */
+    disabledClass : 'x-item-disabled',
+    /**
+     * @cfg {Boolean} allowDomMove
+     * Whether the component can move the Dom node when rendering (defaults to true).
+     */
+    allowDomMove : true,
+    /**
+     * @cfg {Boolean} autoShow
+     * True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove
+     * them on render (defaults to false).
+     */
+    autoShow : false,
+    /**
+     * @cfg {String} hideMode
+     * <p>How this component should be hidden. Supported values are <tt>'visibility'</tt>
+     * (css visibility), <tt>'offsets'</tt> (negative offset position) and <tt>'display'</tt>
+     * (css display).</p>
+     * <br><p><b>Note</b>: the default of <tt>'display'</tt> is generally preferred
+     * since items are automatically laid out when they are first shown (no sizing
+     * is done while hidden).</p>
+     */
+    hideMode : 'display',
+    /**
+     * @cfg {Boolean} hideParent
+     * True to hide and show the component's container when hide/show is called on the component, false to hide
+     * and show the component itself (defaults to false).  For example, this can be used as a shortcut for a hide
+     * button on a window by setting hide:true on the button when adding it to its parent container.
+     */
+    hideParent : false,
+    /**
+     * <p>The {@link Ext.Element} which encapsulates this Component. Read-only.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the <code>{@link #autoEl}</code> config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link Ext.util.Observable#listeners listeners}
+     * config for a suggestion, or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * <p>See also <tt>{@link #getEl getEl}</p>
+     * @type Ext.Element
+     * @property el
+     */
+    /**
+     * This Component's owner {@link Ext.Container Container} (defaults to undefined, and is set automatically when
+     * this Component is added to a Container).  Read-only.
+     * <p><b>Note</b>: to access items within the Container see <tt>{@link #itemId}</tt>.</p>
+     * @type Ext.Container
+     * @property ownerCt
+     */
+    /**
+     * True if this component is hidden. Read-only.
+     * @type Boolean
+     * @property hidden
+     */
+    /**
+     * True if this component is disabled. Read-only.
+     * @type Boolean
+     * @property disabled
+     */
+    /**
+     * True if this component has been rendered. Read-only.
+     * @type Boolean
+     * @property rendered
+     */
+    rendered : false,
+
+    /**
+     * @cfg {String} contentEl
+     * <p>Optional. Specify an existing HTML element, or the <code>id</code> of an existing HTML element to use as the content
+     * for this component.</p>
+     * <ul>
+     * <li><b>Description</b> :
+     * <div class="sub-desc">This config option is used to take an existing HTML element and place it in the layout element
+     * of a new component (it simply moves the specified DOM element <i>after the Component is rendered</i> to use as the content.</div></li>
+     * <li><b>Notes</b> :
+     * <div class="sub-desc">The specified HTML element is appended to the layout element of the component <i>after any configured
+     * {@link #html HTML} has been inserted</i>, and so the document will not contain this element at the time the {@link #render} event is fired.</div>
+     * <div class="sub-desc">The specified HTML element used will not participate in any <code><b>{@link Ext.Container#layout layout}</b></code>
+     * scheme that the Component may use. It is just HTML. Layouts operate on child <code><b>{@link Ext.Container#items items}</b></code>.</div>
+     * <div class="sub-desc">Add either the <code>x-hidden</code> or the <code>x-hide-display</code> CSS class to
+     * prevent a brief flicker of the content before it is rendered to the panel.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {String/Object} html
+     * An HTML fragment, or a {@link Ext.DomHelper DomHelper} specification to use as the layout element
+     * content (defaults to ''). The HTML content is added after the component is rendered,
+     * so the document will not contain this HTML at the time the {@link #render} event is fired.
+     * This content is inserted into the body <i>before</i> any configured {@link #contentEl} is appended.
+     */
+
+    /**
+     * @cfg {Mixed} tpl
+     * An <bold>{@link Ext.Template}</bold>, <bold>{@link Ext.XTemplate}</bold>
+     * or an array of strings to form an Ext.XTemplate.
+     * Used in conjunction with the <code>{@link #data}</code> and
+     * <code>{@link #tplWriteMode}</code> configurations.
+     */
+
+    /**
+     * @cfg {String} tplWriteMode The Ext.(X)Template method to use when
+     * updating the content area of the Component. Defaults to <tt>'overwrite'</tt>
+     * (see <code>{@link Ext.XTemplate#overwrite}</code>).
+     */
+    tplWriteMode : 'overwrite',
+
+    /**
+     * @cfg {Mixed} data
+     * The initial set of data to apply to the <code>{@link #tpl}</code> to
+     * update the content area of the Component.
+     */
+    
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+
+    // private
+    ctype : 'Ext.Component',
+
+    // private
+    actionMode : 'el',
+
+    // private
+    getActionEl : function(){
+        return this[this.actionMode];
+    },
+
+    initPlugin : function(p){
+        if(p.ptype && !Ext.isFunction(p.init)){
+            p = Ext.ComponentMgr.createPlugin(p);
+        }else if(Ext.isString(p)){
+            p = Ext.ComponentMgr.createPlugin({
+                ptype: p
+            });
+        }
+        p.init(this);
+        return p;
+    },
+
+    /* // protected
+     * Function to be implemented by Component subclasses to be part of standard component initialization flow (it is empty by default).
+     * <pre><code>
+// Traditional constructor:
+Ext.Foo = function(config){
+    // call superclass constructor:
+    Ext.Foo.superclass.constructor.call(this, config);
+
+    this.addEvents({
+        // add events
+    });
+};
+Ext.extend(Ext.Foo, Ext.Bar, {
+   // class body
+}
+
+// initComponent replaces the constructor:
+Ext.Foo = Ext.extend(Ext.Bar, {
+    initComponent : function(){
+        // call superclass initComponent
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents({
+            // add events
+        });
+    }
+}
+</code></pre>
+     */
+    initComponent : function(){
+        /*
+         * this is double processing, however it allows people to be able to do
+         * Ext.apply(this, {
+         *     listeners: {
+         *         //here
+         *     }
+         * });
+         * MyClass.superclass.initComponent.call(this);
+         */
+        if(this.listeners){
+            this.on(this.listeners);
+            delete this.listeners;
+        }
+        this.enableBubble(this.bubbleEvents);
+    },
+
+    /**
+     * <p>Render this Component into the passed HTML element.</p>
+     * <p><b>If you are using a {@link Ext.Container Container} object to house this Component, then
+     * do not use the render method.</b></p>
+     * <p>A Container's child Components are rendered by that Container's
+     * {@link Ext.Container#layout layout} manager when the Container is first rendered.</p>
+     * <p>Certain layout managers allow dynamic addition of child components. Those that do
+     * include {@link Ext.layout.CardLayout}, {@link Ext.layout.AnchorLayout},
+     * {@link Ext.layout.FormLayout}, {@link Ext.layout.TableLayout}.</p>
+     * <p>If the Container is already rendered when a new child Component is added, you may need to call
+     * the Container's {@link Ext.Container#doLayout doLayout} to refresh the view which causes any
+     * unrendered child Components to be rendered. This is required so that you can add multiple
+     * child components if needed while only refreshing the layout once.</p>
+     * <p>When creating complex UIs, it is important to remember that sizing and positioning
+     * of child items is the responsibility of the Container's {@link Ext.Container#layout layout} manager.
+     * If you expect child items to be sized in response to user interactions, you must
+     * configure the Container with a layout manager which creates and manages the type of layout you
+     * have in mind.</p>
+     * <p><b>Omitting the Container's {@link Ext.Container#layout layout} config means that a basic
+     * layout manager is used which does nothing but render child components sequentially into the
+     * Container. No sizing or positioning will be performed in this situation.</b></p>
+     * @param {Element/HTMLElement/String} container (optional) The element this Component should be
+     * rendered into. If it is being created from existing markup, this should be omitted.
+     * @param {String/Number} position (optional) The element ID or DOM node index within the container <b>before</b>
+     * which this component will be inserted (defaults to appending to the end of the container)
+     */
+    render : function(container, position){
+        if(!this.rendered && this.fireEvent('beforerender', this) !== false){
+            if(!container && this.el){
+                this.el = Ext.get(this.el);
+                container = this.el.dom.parentNode;
+                this.allowDomMove = false;
+            }
+            this.container = Ext.get(container);
+            if(this.ctCls){
+                this.container.addClass(this.ctCls);
+            }
+            this.rendered = true;
+            if(position !== undefined){
+                if(Ext.isNumber(position)){
+                    position = this.container.dom.childNodes[position];
+                }else{
+                    position = Ext.getDom(position);
+                }
+            }
+            this.onRender(this.container, position || null);
+            if(this.autoShow){
+                this.el.removeClass(['x-hidden','x-hide-' + this.hideMode]);
+            }
+            if(this.cls){
+                this.el.addClass(this.cls);
+                delete this.cls;
+            }
+            if(this.style){
+                this.el.applyStyles(this.style);
+                delete this.style;
+            }
+            if(this.overCls){
+                this.el.addClassOnOver(this.overCls);
+            }
+            this.fireEvent('render', this);
+
+
+            // Populate content of the component with html, contentEl or
+            // a tpl.
+            var contentTarget = this.getContentTarget();
+            if (this.html){
+                contentTarget.update(Ext.DomHelper.markup(this.html));
+                delete this.html;
+            }
+            if (this.contentEl){
+                var ce = Ext.getDom(this.contentEl);
+                Ext.fly(ce).removeClass(['x-hidden', 'x-hide-display']);
+                contentTarget.appendChild(ce);
+            }
+            if (this.tpl) {
+                if (!this.tpl.compile) {
+                    this.tpl = new Ext.XTemplate(this.tpl);
+                }
+                if (this.data) {
+                    this.tpl[this.tplWriteMode](contentTarget, this.data);
+                    delete this.data;
+                }
+            }
+            this.afterRender(this.container);
+
+
+            if(this.hidden){
+                // call this so we don't fire initial hide events.
+                this.doHide();
+            }
+            if(this.disabled){
+                // pass silent so the event doesn't fire the first time.
+                this.disable(true);
+            }
+
+            if(this.stateful !== false){
+                this.initStateEvents();
+            }
+            this.fireEvent('afterrender', this);
+        }
+        return this;
+    },
+
+
+    /**
+     * Update the content area of a component.
+     * @param {Mixed} htmlOrData
+     * If this component has been configured with a template via the tpl config
+     * then it will use this argument as data to populate the template.
+     * If this component was not configured with a template, the components
+     * content area will be updated via Ext.Element update
+     * @param {Boolean} loadScripts
+     * (optional) Only legitimate when using the html configuration. Defaults to false
+     * @param {Function} callback
+     * (optional) Only legitimate when using the html configuration. Callback to execute when scripts have finished loading
+     */
+    update: function(htmlOrData, loadScripts, cb) {
+        var contentTarget = this.getContentTarget();
+        if (this.tpl && typeof htmlOrData !== "string") {
+            this.tpl[this.tplWriteMode](contentTarget, htmlOrData || {});
+        } else {
+            var html = Ext.isObject(htmlOrData) ? Ext.DomHelper.markup(htmlOrData) : htmlOrData;
+            contentTarget.update(html, loadScripts, cb);
+        }
+    },
+
+
+    /**
+     * @private
+     * Method to manage awareness of when components are added to their
+     * respective Container, firing an added event.
+     * References are established at add time rather than at render time.
+     * @param {Ext.Container} container Container which holds the component
+     * @param {number} pos Position at which the component was added
+     */
+    onAdded : function(container, pos) {
+        this.ownerCt = container;
+        this.initRef();
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * @private
+     * Method to manage awareness of when components are removed from their
+     * respective Container, firing an removed event. References are properly
+     * cleaned up after removing a component from its owning container.
+     */
+    onRemoved : function() {
+        this.removeRef();
+        this.fireEvent('removed', this, this.ownerCt);
+        delete this.ownerCt;
+    },
+
+    /**
+     * @private
+     * Method to establish a reference to a component.
+     */
+    initRef : function() {
+        /**
+         * @cfg {String} ref
+         * <p>A path specification, relative to the Component's <code>{@link #ownerCt}</code>
+         * specifying into which ancestor Container to place a named reference to this Component.</p>
+         * <p>The ancestor axis can be traversed by using '/' characters in the path.
+         * For example, to put a reference to a Toolbar Button into <i>the Panel which owns the Toolbar</i>:</p><pre><code>
+var myGrid = new Ext.grid.EditorGridPanel({
+    title: 'My EditorGridPanel',
+    store: myStore,
+    colModel: myColModel,
+    tbar: [{
+        text: 'Save',
+        handler: saveChanges,
+        disabled: true,
+        ref: '../saveButton'
+    }],
+    listeners: {
+        afteredit: function() {
+//          The button reference is in the GridPanel
+            myGrid.saveButton.enable();
+        }
+    }
+});
+</code></pre>
+         * <p>In the code above, if the <code>ref</code> had been <code>'saveButton'</code>
+         * the reference would have been placed into the Toolbar. Each '/' in the <code>ref</code>
+         * moves up one level from the Component's <code>{@link #ownerCt}</code>.</p>
+         * <p>Also see the <code>{@link #added}</code> and <code>{@link #removed}</code> events.</p>
+         */
+        if(this.ref && !this.refOwner){
+            var levels = this.ref.split('/'),
+                last = levels.length,
+                i = 0,
+                t = this;
+
+            while(t && i < last){
+                t = t.ownerCt;
+                ++i;
+            }
+            if(t){
+                t[this.refName = levels[--i]] = this;
+                /**
+                 * @type Ext.Container
+                 * @property refOwner
+                 * The ancestor Container into which the {@link #ref} reference was inserted if this Component
+                 * is a child of a Container, and has been configured with a <code>ref</code>.
+                 */
+                this.refOwner = t;
+            }
+        }
+    },
+
+    removeRef : function() {
+        if (this.refOwner && this.refName) {
+            delete this.refOwner[this.refName];
+            delete this.refOwner;
+        }
+    },
+
+    // private
+    initState : function(){
+        if(Ext.state.Manager){
+            var id = this.getStateId();
+            if(id){
+                var state = Ext.state.Manager.get(id);
+                if(state){
+                    if(this.fireEvent('beforestaterestore', this, state) !== false){
+                        this.applyState(Ext.apply({}, state));
+                        this.fireEvent('staterestore', this, state);
+                    }
+                }
+            }
+        }
+    },
+
+    // private
+    getStateId : function(){
+        return this.stateId || ((/^(ext-comp-|ext-gen)/).test(String(this.id)) ? null : this.id);
+    },
+
+    // private
+    initStateEvents : function(){
+        if(this.stateEvents){
+            for(var i = 0, e; e = this.stateEvents[i]; i++){
+                this.on(e, this.saveState, this, {delay:100});
+            }
+        }
+    },
+
+    // private
+    applyState : function(state){
+        if(state){
+            Ext.apply(this, state);
+        }
+    },
+
+    // private
+    getState : function(){
+        return null;
+    },
+
+    // private
+    saveState : function(){
+        if(Ext.state.Manager && this.stateful !== false){
+            var id = this.getStateId();
+            if(id){
+                var state = this.getState();
+                if(this.fireEvent('beforestatesave', this, state) !== false){
+                    Ext.state.Manager.set(id, state);
+                    this.fireEvent('statesave', this, state);
+                }
+            }
+        }
+    },
+
+    /**
+     * Apply this component to existing markup that is valid. With this function, no call to render() is required.
+     * @param {String/HTMLElement} el
+     */
+    applyToMarkup : function(el){
+        this.allowDomMove = false;
+        this.el = Ext.get(el);
+        this.render(this.el.dom.parentNode);
+    },
+
+    /**
+     * Adds a CSS class to the component's underlying element.
+     * @param {string} cls The CSS class name to add
+     * @return {Ext.Component} this
+     */
+    addClass : function(cls){
+        if(this.el){
+            this.el.addClass(cls);
+        }else{
+            this.cls = this.cls ? this.cls + ' ' + cls : cls;
+        }
+        return this;
+    },
+
+    /**
+     * Removes a CSS class from the component's underlying element.
+     * @param {string} cls The CSS class name to remove
+     * @return {Ext.Component} this
+     */
+    removeClass : function(cls){
+        if(this.el){
+            this.el.removeClass(cls);
+        }else if(this.cls){
+            this.cls = this.cls.split(' ').remove(cls).join(' ');
+        }
+        return this;
+    },
+
+    // private
+    // default function is not really useful
+    onRender : function(ct, position){
+        if(!this.el && this.autoEl){
+            if(Ext.isString(this.autoEl)){
+                this.el = document.createElement(this.autoEl);
+            }else{
+                var div = document.createElement('div');
+                Ext.DomHelper.overwrite(div, this.autoEl);
+                this.el = div.firstChild;
+            }
+            if (!this.el.id) {
+                this.el.id = this.getId();
+            }
+        }
+        if(this.el){
+            this.el = Ext.get(this.el);
+            if(this.allowDomMove !== false){
+                ct.dom.insertBefore(this.el.dom, position);
+                if (div) {
+                    Ext.removeNode(div);
+                    div = null;
+                }
+            }
+        }
+    },
+
+    // private
+    getAutoCreate : function(){
+        var cfg = Ext.isObject(this.autoCreate) ?
+                      this.autoCreate : Ext.apply({}, this.defaultAutoCreate);
+        if(this.id && !cfg.id){
+            cfg.id = this.id;
+        }
+        return cfg;
+    },
+
+    // private
+    afterRender : Ext.emptyFn,
+
+    /**
+     * Destroys this component by purging any event listeners, removing the component's element from the DOM,
+     * removing the component from its {@link Ext.Container} (if applicable) and unregistering it from
+     * {@link Ext.ComponentMgr}.  Destruction is generally handled automatically by the framework and this method
+     * should usually not need to be called directly.
+     *
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.fireEvent('beforedestroy', this) !== false){
+                this.destroying = true;
+                this.beforeDestroy();
+                if(this.ownerCt && this.ownerCt.remove){
+                    this.ownerCt.remove(this, false);
+                }
+                if(this.rendered){
+                    this.el.remove();
+                    if(this.actionMode == 'container' || this.removeMode == 'container'){
+                        this.container.remove();
+                    }
+                }
+                // Stop any buffered tasks
+                if(this.focusTask && this.focusTask.cancel){
+                    this.focusTask.cancel();
+                }
+                this.onDestroy();
+                Ext.ComponentMgr.unregister(this);
+                this.fireEvent('destroy', this);
+                this.purgeListeners();
+                this.destroying = false;
+                this.isDestroyed = true;
+            }
+        }
+    },
+
+    deleteMembers : function(){
+        var args = arguments;
+        for(var i = 0, len = args.length; i < len; ++i){
+            delete this[args[i]];
+        }
+    },
+
+    // private
+    beforeDestroy : Ext.emptyFn,
+
+    // private
+    onDestroy  : Ext.emptyFn,
+
+    /**
+     * <p>Returns the {@link Ext.Element} which encapsulates this Component.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the {@link #autoEl} config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link #listeners} config for a suggestion,
+     * or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * @return {Ext.Element} The Element which encapsulates this Component.
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the <code>id</code> of this component or automatically generates and
+     * returns an <code>id</code> if an <code>id</code> is not defined yet:<pre><code>
+     * 'ext-comp-' + (++Ext.Component.AUTO_ID)
+     * </code></pre>
+     * @return {String} id
+     */
+    getId : function(){
+        return this.id || (this.id = 'ext-comp-' + (++Ext.Component.AUTO_ID));
+    },
+
+    /**
+     * Returns the <code>{@link #itemId}</code> of this component.  If an
+     * <code>{@link #itemId}</code> was not assigned through configuration the
+     * <code>id</code> is returned using <code>{@link #getId}</code>.
+     * @return {String}
+     */
+    getItemId : function(){
+        return this.itemId || this.getId();
+    },
+
+    /**
+     * Try to focus this component.
+     * @param {Boolean} selectText (optional) If applicable, true to also select the text in this component
+     * @param {Boolean/Number} delay (optional) Delay the focus this number of milliseconds (true for 10 milliseconds)
+     * @return {Ext.Component} this
+     */
+    focus : function(selectText, delay){
+        if(delay){
+            this.focusTask = new Ext.util.DelayedTask(this.focus, this, [selectText, false]);
+            this.focusTask.delay(Ext.isNumber(delay) ? delay : 10);
+            return this;
+        }
+        if(this.rendered && !this.isDestroyed){
+            this.el.focus();
+            if(selectText === true){
+                this.el.dom.select();
+            }
+        }
+        return this;
+    },
+
+    // private
+    blur : function(){
+        if(this.rendered){
+            this.el.blur();
+        }
+        return this;
+    },
+
+    /**
+     * Disable this component and fire the 'disable' event.
+     * @return {Ext.Component} this
+     */
+    disable : function(/* private */ silent){
+        if(this.rendered){
+            this.onDisable();
+        }
+        this.disabled = true;
+        if(silent !== true){
+            this.fireEvent('disable', this);
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.getActionEl().addClass(this.disabledClass);
+        this.el.dom.disabled = true;
+    },
+
+    /**
+     * Enable this component and fire the 'enable' event.
+     * @return {Ext.Component} this
+     */
+    enable : function(){
+        if(this.rendered){
+            this.onEnable();
+        }
+        this.disabled = false;
+        this.fireEvent('enable', this);
+        return this;
+    },
+
+    // private
+    onEnable : function(){
+        this.getActionEl().removeClass(this.disabledClass);
+        this.el.dom.disabled = false;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     * @return {Ext.Component} this
+     */
+    setDisabled : function(disabled){
+        return this[disabled ? 'disable' : 'enable']();
+    },
+
+    /**
+     * Show this component.  Listen to the '{@link #beforeshow}' event and return
+     * <tt>false</tt> to cancel showing the component.  Fires the '{@link #show}'
+     * event after showing the component.
+     * @return {Ext.Component} this
+     */
+    show : function(){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.hidden = false;
+            if(this.autoRender){
+                this.render(Ext.isBoolean(this.autoRender) ? Ext.getBody() : this.autoRender);
+            }
+            if(this.rendered){
+                this.onShow();
+            }
+            this.fireEvent('show', this);
+        }
+        return this;
+    },
+
+    // private
+    onShow : function(){
+        this.getVisibilityEl().removeClass('x-hide-' + this.hideMode);
+    },
+
+    /**
+     * Hide this component.  Listen to the '{@link #beforehide}' event and return
+     * <tt>false</tt> to cancel hiding the component.  Fires the '{@link #hide}'
+     * event after hiding the component. Note this method is called internally if
+     * the component is configured to be <code>{@link #hidden}</code>.
+     * @return {Ext.Component} this
+     */
+    hide : function(){
+        if(this.fireEvent('beforehide', this) !== false){
+            this.doHide();
+            this.fireEvent('hide', this);
+        }
+        return this;
+    },
+
+    // private
+    doHide: function(){
+        this.hidden = true;
+        if(this.rendered){
+            this.onHide();
+        }
+    },
+
+    // private
+    onHide : function(){
+        this.getVisibilityEl().addClass('x-hide-' + this.hideMode);
+    },
+
+    // private
+    getVisibilityEl : function(){
+        return this.hideParent ? this.container : this.getActionEl();
+    },
+
+    /**
+     * Convenience function to hide or show this component by boolean.
+     * @param {Boolean} visible True to show, false to hide
+     * @return {Ext.Component} this
+     */
+    setVisible : function(visible){
+        return this[visible ? 'show' : 'hide']();
+    },
+
+    /**
+     * Returns true if this component is visible.
+     * @return {Boolean} True if this component is visible, false otherwise.
+     */
+    isVisible : function(){
+        return this.rendered && this.getVisibilityEl().isVisible();
+    },
+
+    /**
+     * Clone the current component using the original config values passed into this instance by default.
+     * @param {Object} overrides A new config containing any properties to override in the cloned version.
+     * An id property can be passed on this object, otherwise one will be generated to avoid duplicates.
+     * @return {Ext.Component} clone The cloned copy of this component
+     */
+    cloneConfig : function(overrides){
+        overrides = overrides || {};
+        var id = overrides.id || Ext.id();
+        var cfg = Ext.applyIf(overrides, this.initialConfig);
+        cfg.id = id; // prevent dup id
+        return new this.constructor(cfg);
+    },
+
+    /**
+     * Gets the xtype for this component as registered with {@link Ext.ComponentMgr}. For a list of all
+     * available xtypes, see the {@link Ext.Component} header. Example usage:
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXType());  // alerts 'textfield'
+</code></pre>
+     * @return {String} The xtype
+     */
+    getXType : function(){
+        return this.constructor.xtype;
+    },
+
+    /**
+     * <p>Tests whether or not this Component is of a specific xtype. This can test whether this Component is descended
+     * from the xtype (default) or whether it is directly of the xtype specified (shallow = true).</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>For a list of all available xtypes, see the {@link Ext.Component} header.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+var isText = t.isXType('textfield');        // true
+var isBoxSubclass = t.isXType('box');       // true, descended from BoxComponent
+var isBoxInstance = t.isXType('box', true); // false, not a direct BoxComponent instance
+</code></pre>
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * <pre><code>
+var c = new Ext.Component();
+console.log(c.isXType(c));
+console.log(c.isXType(Ext.Component)); 
+</code></pre>
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Boolean} True if this component descends from the specified xtype, false otherwise.
+     */
+    isXType : function(xtype, shallow){
+        //assume a string by default
+        if (Ext.isFunction(xtype)){
+            xtype = xtype.xtype; //handle being passed the class, e.g. Ext.Component
+        }else if (Ext.isObject(xtype)){
+            xtype = xtype.constructor.xtype; //handle being passed an instance
+        }
+
+        return !shallow ? ('/' + this.getXTypes() + '/').indexOf('/' + xtype + '/') != -1 : this.constructor.xtype == xtype;
+    },
+
+    /**
+     * <p>Returns this Component's xtype hierarchy as a slash-delimited string. For a list of all
+     * available xtypes, see the {@link Ext.Component} header.</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXTypes());  // alerts 'component/box/field/textfield'
+</code></pre>
+     * @return {String} The xtype hierarchy string
+     */
+    getXTypes : function(){
+        var tc = this.constructor;
+        if(!tc.xtypes){
+            var c = [], sc = this;
+            while(sc && sc.constructor.xtype){
+                c.unshift(sc.constructor.xtype);
+                sc = sc.constructor.superclass;
+            }
+            tc.xtypeChain = c;
+            tc.xtypes = c.join('/');
+        }
+        return tc.xtypes;
+    },
+
+    /**
+     * Find a container above this component at any level by a custom function. If the passed function returns
+     * true, the container will be returned.
+     * @param {Function} fn The custom function to call with the arguments (container, this component).
+     * @return {Ext.Container} The first Container for which the custom function returns true
+     */
+    findParentBy : function(fn) {
+        for (var p = this.ownerCt; (p != null) && !fn(p, this); p = p.ownerCt);
+        return p || null;
+    },
+
+    /**
+     * Find a container above this component at any level by xtype or class
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Ext.Container} The first Container which matches the given xtype or class
+     */
+    findParentByType : function(xtype, shallow){
+        return this.findParentBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+    
+    /**
+     * Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current node)
+     * @param {Array} args (optional) The args to call the function with (default to passing the current component)
+     * @return {Ext.Component} this
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.ownerCt;
+        }
+        return this;
+    },
+
+    // protected
+    getPositionEl : function(){
+        return this.positionEl || this.el;
+    },
+
+    // private
+    purgeListeners : function(){
+        Ext.Component.superclass.purgeListeners.call(this);
+        if(this.mons){
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    // private
+    clearMons : function(){
+        Ext.each(this.mons, function(m){
+            m.item.un(m.ename, m.fn, m.scope);
+        }, this);
+        this.mons = [];
+    },
+
+    // private
+    createMons: function(){
+        if(!this.mons){
+            this.mons = [];
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    /**
+     * <p>Adds listeners to any Observable object (or Elements) which are automatically removed when this Component
+     * is destroyed. Usage:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), 'selectionchange', handleSelectionChange, null, {buffer: 50});
+</pre></code>
+     * <p>or:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), {
+    selectionchange: handleSelectionChange,
+    buffer: 50
+});
+</pre></code>
+     * @param {Observable|Element} item The item to which to add a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     * @param {Object} opt Optional. If the <code>ename</code> parameter was an event name, this
+     * is the {@link Ext.util.Observable#addListener addListener} options.
+     */
+    mon : function(item, ename, fn, scope, opt){
+        this.createMons();
+        if(Ext.isObject(ename)){
+            var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
+
+            var o = ename;
+            for(var e in o){
+                if(propRe.test(e)){
+                    continue;
+                }
+                if(Ext.isFunction(o[e])){
+                    // shared options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e], o.scope, o);
+                }else{
+                    // individual options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e]);
+                }
+            }
+            return;
+        }
+
+        this.mons.push({
+            item: item, ename: ename, fn: fn, scope: scope
+        });
+        item.on(ename, fn, scope, opt);
+    },
+
+    /**
+     * Removes listeners that were added by the {@link #mon} method.
+     * @param {Observable|Element} item The item from which to remove a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     */
+    mun : function(item, ename, fn, scope){
+        var found, mon;
+        this.createMons();
+        for(var i = 0, len = this.mons.length; i < len; ++i){
+            mon = this.mons[i];
+            if(item === mon.item && ename == mon.ename && fn === mon.fn && scope === mon.scope){
+                this.mons.splice(i, 1);
+                item.un(ename, fn, scope);
+                found = true;
+                break;
+            }
+        }
+        return found;
+    },
+
+    /**
+     * Returns the next component in the owning container
+     * @return Ext.Component
+     */
+    nextSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index != -1 && index+1 < this.ownerCt.items.getCount()){
+                return this.ownerCt.items.itemAt(index+1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the previous component in the owning container
+     * @return Ext.Component
+     */
+    previousSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index > 0){
+                return this.ownerCt.items.itemAt(index-1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Provides the link for Observable's fireEvent method to bubble up the ownership hierarchy.
+     * @return {Ext.Container} the Container which owns this Component.
+     */
+    getBubbleTarget : function(){
+        return this.ownerCt;
+    }
+});
+
+Ext.reg('component', Ext.Component);
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/StatusProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/StatusProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/StatusProxy.js	(revision 76)
@@ -0,0 +1,175 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.StatusProxy
+ * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
+ * default drag proxy used by all Ext.dd components.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.dd.StatusProxy = function(config){
+    Ext.apply(this, config);
+    this.id = this.id || Ext.id();
+    this.el = new Ext.Layer({
+        dh: {
+            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
+                {tag: "div", cls: "x-dd-drop-icon"},
+                {tag: "div", cls: "x-dd-drag-ghost"}
+            ]
+        }, 
+        shadow: !config || config.shadow !== false
+    });
+    this.ghost = Ext.get(this.el.dom.childNodes[1]);
+    this.dropStatus = this.dropNotAllowed;
+};
+
+Ext.dd.StatusProxy.prototype = {
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class to apply to the status element when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class to apply to the status element when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
+     * over the current target element.
+     * @param {String} cssClass The css class for the new drop status indicator image
+     */
+    setStatus : function(cssClass){
+        cssClass = cssClass || this.dropNotAllowed;
+        if(this.dropStatus != cssClass){
+            this.el.replaceClass(this.dropStatus, cssClass);
+            this.dropStatus = cssClass;
+        }
+    },
+
+    /**
+     * Resets the status indicator to the default dropNotAllowed value
+     * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
+     */
+    reset : function(clearGhost){
+        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
+        this.dropStatus = this.dropNotAllowed;
+        if(clearGhost){
+            this.ghost.update("");
+        }
+    },
+
+    /**
+     * Updates the contents of the ghost element
+     * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
+     * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
+     */
+    update : function(html){
+        if(typeof html == "string"){
+            this.ghost.update(html);
+        }else{
+            this.ghost.update("");
+            html.style.margin = "0";
+            this.ghost.dom.appendChild(html);
+        }
+        var el = this.ghost.dom.firstChild; 
+        if(el){
+            Ext.fly(el).setStyle('float', 'none');
+        }
+    },
+
+    /**
+     * Returns the underlying proxy {@link Ext.Layer}
+     * @return {Ext.Layer} el
+    */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the ghost element
+     * @return {Ext.Element} el
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Hides the proxy
+     * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
+     */
+    hide : function(clear){
+        this.el.hide();
+        if(clear){
+            this.reset(true);
+        }
+    },
+
+    /**
+     * Stops the repair animation if it's currently running
+     */
+    stop : function(){
+        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
+            this.anim.stop();
+        }
+    },
+
+    /**
+     * Displays this proxy
+     */
+    show : function(){
+        this.el.show();
+    },
+
+    /**
+     * Force the Layer to sync its shadow and shim positions to the element
+     */
+    sync : function(){
+        this.el.sync();
+    },
+
+    /**
+     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
+     * invalid drop operation by the item being dragged.
+     * @param {Array} xy The XY position of the element ([x, y])
+     * @param {Function} callback The function to call after the repair is complete.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     */
+    repair : function(xy, callback, scope){
+        this.callback = callback;
+        this.scope = scope;
+        if(xy && this.animRepair !== false){
+            this.el.addClass("x-dd-drag-repair");
+            this.el.hideUnders(true);
+            this.anim = this.el.shift({
+                duration: this.repairDuration || .5,
+                easing: 'easeOut',
+                xy: xy,
+                stopFx: true,
+                callback: this.afterRepair,
+                scope: this
+            });
+        }else{
+            this.afterRepair();
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        this.hide(true);
+        if(typeof this.callback == "function"){
+            this.callback.call(this.scope || this);
+        }
+        this.callback = null;
+        this.scope = null;
+    },
+    
+    destroy: function(){
+        Ext.destroy(this.ghost, this.el);    
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/Registry.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/Registry.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/Registry.js	(revision 76)
@@ -0,0 +1,127 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.Registry
+ * Provides easy access to all drag drop components that are registered on a page.  Items can be retrieved either
+ * directly by DOM node id, or by passing in the drag drop event that occurred and looking up the event target.
+ * @singleton
+ */
+Ext.dd.Registry = function(){
+    var elements = {}; 
+    var handles = {}; 
+    var autoIdSeed = 0;
+
+    var getId = function(el, autogen){
+        if(typeof el == "string"){
+            return el;
+        }
+        var id = el.id;
+        if(!id && autogen !== false){
+            id = "extdd-" + (++autoIdSeed);
+            el.id = id;
+        }
+        return id;
+    };
+    
+    return {
+    /**
+     * Resgister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to register
+     * @param {Object} data (optional) An custom data object that will be passed between the elements that are involved
+     * in drag drop operations.  You can populate this object with any arbitrary properties that your own code
+     * knows how to interpret, plus there are some specific properties known to the Registry that should be
+     * populated in the data object (if applicable):
+     * <pre>
+Value      Description<br />
+---------  ------------------------------------------<br />
+handles    Array of DOM nodes that trigger dragging<br />
+           for the element being registered<br />
+isHandle   True if the element passed in triggers<br />
+           dragging itself, else false
+</pre>
+     */
+        register : function(el, data){
+            data = data || {};
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            data.ddel = el;
+            elements[getId(el)] = data;
+            if(data.isHandle !== false){
+                handles[data.ddel.id] = data;
+            }
+            if(data.handles){
+                var hs = data.handles;
+                for(var i = 0, len = hs.length; i < len; i++){
+                	handles[getId(hs[i])] = data;
+                }
+            }
+        },
+
+    /**
+     * Unregister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to unregister
+     */
+        unregister : function(el){
+            var id = getId(el, false);
+            var data = elements[id];
+            if(data){
+                delete elements[id];
+                if(data.handles){
+                    var hs = data.handles;
+                    for(var i = 0, len = hs.length; i < len; i++){
+                    	delete handles[getId(hs[i], false)];
+                    }
+                }
+            }
+        },
+
+    /**
+     * Returns the handle registered for a DOM Node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} handle The custom handle data
+     */
+        getHandle : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return handles[id];
+        },
+
+    /**
+     * Returns the handle that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} handle The custom handle data
+     */
+        getHandleFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? handles[t.id] : null;
+        },
+
+    /**
+     * Returns a custom data object that is registered for a DOM node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} data The custom data
+     */
+        getTarget : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return elements[id];
+        },
+
+    /**
+     * Returns a custom data object that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+        getTargetFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? elements[t.id] || handles[t.id] : null;
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DragTracker.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DragTracker.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DragTracker.js	(revision 76)
@@ -0,0 +1,251 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.DragTracker
+ * @extends Ext.util.Observable
+ * A DragTracker listens for drag events on an Element and fires events at the start and end of the drag,
+ * as well as during the drag. This is useful for components such as {@link Ext.slider.MultiSlider}, where there is
+ * an element that can be dragged around to change the Slider's value.
+ * DragTracker provides a series of template methods that should be overridden to provide functionality
+ * in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd.
+ * See {@link Ext.slider.MultiSlider}'s initEvents function for an example implementation.
+ */
+Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
+    /**
+     * @cfg {Boolean} active
+	 * Defaults to <tt>false</tt>.
+	 */	
+    active: false,
+    /**
+     * @cfg {Number} tolerance
+	 * Number of pixels the drag target must be moved before dragging is considered to have started. Defaults to <tt>5</tt>.
+	 */	
+    tolerance: 5,
+    /**
+     * @cfg {Boolean/Number} autoStart
+	 * Defaults to <tt>false</tt>. Specify <tt>true</tt> to defer trigger start by 1000 ms.
+	 * Specify a Number for the number of milliseconds to defer trigger start.
+	 */	
+    autoStart: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+	    this.addEvents(
+	        /**
+	         * @event mousedown
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousedown',
+	        /**
+	         * @event mouseup
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mouseup',
+	        /**
+	         * @event mousemove
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousemove',
+	        /**
+	         * @event dragstart
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragstart',
+	        /**
+	         * @event dragend
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragend',
+	        /**
+	         * @event drag
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'drag'
+	    );
+	
+	    this.dragRegion = new Ext.lib.Region(0,0,0,0);
+	
+	    if(this.el){
+	        this.initEl(this.el);
+	    }
+        Ext.dd.DragTracker.superclass.constructor.call(this, config);
+    },
+
+    initEl: function(el){
+        this.el = Ext.get(el);
+        el.on('mousedown', this.onMouseDown, this,
+                this.delegate ? {delegate: this.delegate} : undefined);
+    },
+
+    destroy : function(){
+        this.el.un('mousedown', this.onMouseDown, this);
+        delete this.el;
+    },
+
+    onMouseDown: function(e, target){
+        if(this.fireEvent('mousedown', this, e) !== false && this.onBeforeStart(e) !== false){
+            this.startXY = this.lastXY = e.getXY();
+            this.dragTarget = this.delegate ? target : this.el.dom;
+            if(this.preventDefault !== false){
+                e.preventDefault();
+            }
+            Ext.getDoc().on({
+                scope: this,
+                mouseup: this.onMouseUp,
+                mousemove: this.onMouseMove,
+                selectstart: this.stopSelect
+            });
+            if(this.autoStart){
+                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this, [e]);
+            }
+        }
+    },
+
+    onMouseMove: function(e, target){
+        // HACK: IE hack to see if button was released outside of window. */
+        if(this.active && Ext.isIE && !e.browserEvent.button){
+            e.preventDefault();
+            this.onMouseUp(e);
+            return;
+        }
+
+        e.preventDefault();
+        var xy = e.getXY(), s = this.startXY;
+        this.lastXY = xy;
+        if(!this.active){
+            if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
+                this.triggerStart(e);
+            }else{
+                return;
+            }
+        }
+        this.fireEvent('mousemove', this, e);
+        this.onDrag(e);
+        this.fireEvent('drag', this, e);
+    },
+
+    onMouseUp: function(e) {
+        var doc = Ext.getDoc(),
+            wasActive = this.active;
+            
+        doc.un('mousemove', this.onMouseMove, this);
+        doc.un('mouseup', this.onMouseUp, this);
+        doc.un('selectstart', this.stopSelect, this);
+        e.preventDefault();
+        this.clearStart();
+        this.active = false;
+        delete this.elRegion;
+        this.fireEvent('mouseup', this, e);
+        if(wasActive){
+            this.onEnd(e);
+            this.fireEvent('dragend', this, e);
+        }
+    },
+
+    triggerStart: function(e) {
+        this.clearStart();
+        this.active = true;
+        this.onStart(e);
+        this.fireEvent('dragstart', this, e);
+    },
+
+    clearStart : function() {
+        if(this.timer){
+            clearTimeout(this.timer);
+            delete this.timer;
+        }
+    },
+
+    stopSelect : function(e) {
+        e.stopEvent();
+        return false;
+    },
+    
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when the user first clicks and
+     * holds the mouse button down. Return false to disallow the drag
+     * @param {Ext.EventObject} e The event object
+     */
+    onBeforeStart : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation starts
+     * (e.g. the user has moved the tracked element beyond the specified tolerance)
+     * @param {Ext.EventObject} e The event object
+     */
+    onStart : function(xy) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called whenever a drag has been detected.
+     * @param {Ext.EventObject} e The event object
+     */
+    onDrag : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation has been completed
+     * (e.g. the user clicked and held the mouse down, dragged the element and then released the mouse button)
+     * @param {Ext.EventObject} e The event object
+     */
+    onEnd : function(e) {
+
+    },
+
+    /**
+     * Returns the drag target
+     * @return {Ext.Element} The element currently being tracked
+     */
+    getDragTarget : function(){
+        return this.dragTarget;
+    },
+
+    getDragCt : function(){
+        return this.el;
+    },
+
+    getXY : function(constrain){
+        return constrain ?
+               this.constrainModes[constrain].call(this, this.lastXY) : this.lastXY;
+    },
+
+    getOffset : function(constrain){
+        var xy = this.getXY(constrain),
+            s = this.startXY;
+        return [s[0]-xy[0], s[1]-xy[1]];
+    },
+
+    constrainModes: {
+        'point' : function(xy){
+
+            if(!this.elRegion){
+                this.elRegion = this.getDragCt().getRegion();
+            }
+
+            var dr = this.dragRegion;
+
+            dr.left = xy[0];
+            dr.top = xy[1];
+            dr.right = xy[0];
+            dr.bottom = xy[1];
+
+            dr.constrainTo(this.elRegion);
+
+            return [dr.left, dr.top];
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DragZone.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DragZone.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DragZone.js	(revision 76)
@@ -0,0 +1,141 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.DragZone
+ * @extends Ext.dd.DragSource
+ * <p>This class provides a container DD instance that allows dragging of multiple child source nodes.</p>
+ * <p>This class does not move the drag target nodes, but a proxy element which may contain
+ * any DOM structure you wish. The DOM element to show in the proxy is provided by either a
+ * provided implementation of {@link #getDragData}, or by registered draggables registered with {@link Ext.dd.Registry}</p>
+ * <p>If you wish to provide draggability for an arbitrary number of DOM nodes, each of which represent some
+ * application object (For example nodes in a {@link Ext.DataView DataView}) then use of this class
+ * is the most efficient way to "activate" those nodes.</p>
+ * <p>By default, this class requires that draggable child nodes are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DragZone to manage any number of draggable elements is to configure
+ * the DragZone with  an implementation of the {@link #getDragData} method which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector. For example, to make the nodes of a DataView draggable, use the following
+ * technique. Knowledge of the use of the DataView is required:</p><pre><code>
+myDataView.on('render', function(v) {
+    myDataView.dragZone = new Ext.dd.DragZone(v.getEl(), {
+
+//      On receipt of a mousedown event, see if it is within a DataView node.
+//      Return a drag data object if so.
+        getDragData: function(e) {
+
+//          Use the DataView's own itemSelector (a mandatory property) to
+//          test if the mousedown is within one of the DataView's nodes.
+            var sourceEl = e.getTarget(v.itemSelector, 10);
+
+//          If the mousedown is within a DataView node, clone the node to produce
+//          a ddel element for use by the drag proxy. Also add application data
+//          to the returned data object.
+            if (sourceEl) {
+                d = sourceEl.cloneNode(true);
+                d.id = Ext.id();
+                return {
+                    ddel: d,
+                    sourceEl: sourceEl,
+                    repairXY: Ext.fly(sourceEl).getXY(),
+                    sourceStore: v.store,
+                    draggedRecord: v.{@link Ext.DataView#getRecord getRecord}(sourceEl)
+                }
+            }
+        },
+
+//      Provide coordinates for the proxy to slide back to on failed drag.
+//      This is the original XY coordinates of the draggable element captured
+//      in the getDragData method.
+        getRepairXY: function() {
+            return this.dragData.repairXY;
+        }
+    });
+});</code></pre>
+ * See the {@link Ext.dd.DropZone DropZone} documentation for details about building a DropZone which
+ * cooperates with this DragZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragZone = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(el, config){
+        Ext.dd.DragZone.superclass.constructor.call(this, el, config);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    },
+    
+    /**
+     * This property contains the data representing the dragged object. This data is set up by the implementation
+     * of the {@link #getDragData} method. It must contain a <tt>ddel</tt> property, but can contain
+     * any other data according to the application's needs.
+     * @type Object
+     * @property dragData
+     */
+    /**
+     * @cfg {Boolean} containerScroll True to register this container with the Scrollmanager
+     * for auto scrolling during drag operations.
+     */
+    /**
+     * @cfg {String} hlColor The color to use when visually highlighting the drag source in the afterRepair
+     * method after a failed drop (defaults to "c3daf9" - light blue)
+     */
+
+    /**
+     * Called when a mousedown occurs in this container. Looks in {@link Ext.dd.Registry}
+     * for a valid target to drag based on the mouse down. Override this method
+     * to provide your own lookup logic (e.g. finding a child by class name). Make sure your returned
+     * object has a "ddel" attribute (with an HTML Element) for other functions to work.
+     * @param {EventObject} e The mouse down event
+     * @return {Object} The dragData
+     */
+    getDragData : function(e){
+        return Ext.dd.Registry.getHandleFromEvent(e);
+    },
+    
+    /**
+     * Called once drag threshold has been reached to initialize the proxy element. By default, it clones the
+     * this.dragData.ddel
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     * @return {Boolean} true to continue the drag, false to cancel
+     */
+    onInitDrag : function(x, y){
+        this.proxy.update(this.dragData.ddel.cloneNode(true));
+        this.onStartDrag(x, y);
+        return true;
+    },
+    
+    /**
+     * Called after a repair of an invalid drop. By default, highlights this.dragData.ddel 
+     */
+    afterRepair : function(){
+        if(Ext.enableFx){
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * Called before a repair of an invalid drop to get the XY to animate to. By default returns
+     * the XY of this.dragData.ddel
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e){
+        return Ext.Element.fly(this.dragData.ddel).getXY();  
+    },
+    
+    destroy : function(){
+        Ext.dd.DragZone.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/ScrollManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/ScrollManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/ScrollManager.js	(revision 76)
@@ -0,0 +1,213 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.ScrollManager
+ * <p>Provides automatic scrolling of overflow regions in the page during drag operations.</p>
+ * <p>The ScrollManager configs will be used as the defaults for any scroll container registered with it,
+ * but you can also override most of the configs per scroll container by adding a 
+ * <tt>ddScrollConfig</tt> object to the target element that contains these properties: {@link #hthresh},
+ * {@link #vthresh}, {@link #increment} and {@link #frequency}.  Example usage:
+ * <pre><code>
+var el = Ext.get('scroll-ct');
+el.ddScrollConfig = {
+    vthresh: 50,
+    hthresh: -1,
+    frequency: 100,
+    increment: 200
+};
+Ext.dd.ScrollManager.register(el);
+</code></pre>
+ * <b>Note: This class uses "Point Mode" and is untested in "Intersect Mode".</b>
+ * @singleton
+ */
+Ext.dd.ScrollManager = function(){
+    var ddm = Ext.dd.DragDropMgr;
+    var els = {};
+    var dragEl = null;
+    var proc = {};
+    
+    var onStop = function(e){
+        dragEl = null;
+        clearProc();
+    };
+    
+    var triggerRefresh = function(){
+        if(ddm.dragCurrent){
+             ddm.refreshCache(ddm.dragCurrent.groups);
+        }
+    };
+    
+    var doScroll = function(){
+        if(ddm.dragCurrent){
+            var dds = Ext.dd.ScrollManager;
+            var inc = proc.el.ddScrollConfig ?
+                      proc.el.ddScrollConfig.increment : dds.increment;
+            if(!dds.animate){
+                if(proc.el.scroll(proc.dir, inc)){
+                    triggerRefresh();
+                }
+            }else{
+                proc.el.scroll(proc.dir, inc, true, dds.animDuration, triggerRefresh);
+            }
+        }
+    };
+    
+    var clearProc = function(){
+        if(proc.id){
+            clearInterval(proc.id);
+        }
+        proc.id = 0;
+        proc.el = null;
+        proc.dir = "";
+    };
+
+    var startProc = function(el, dir){
+        clearProc();
+        proc.el = el;
+        proc.dir = dir;
+        var group = el.ddScrollConfig ? el.ddScrollConfig.ddGroup : undefined,
+            freq  = (el.ddScrollConfig && el.ddScrollConfig.frequency)
+                  ? el.ddScrollConfig.frequency
+                  : Ext.dd.ScrollManager.frequency;
+
+        if (group === undefined || ddm.dragCurrent.ddGroup == group) {
+            proc.id = setInterval(doScroll, freq);
+        }
+    };
+    
+    var onFire = function(e, isDrop){
+        if(isDrop || !ddm.dragCurrent){ return; }
+        var dds = Ext.dd.ScrollManager;
+        if(!dragEl || dragEl != ddm.dragCurrent){
+            dragEl = ddm.dragCurrent;
+            // refresh regions on drag start
+            dds.refreshCache();
+        }
+        
+        var xy = Ext.lib.Event.getXY(e);
+        var pt = new Ext.lib.Point(xy[0], xy[1]);
+        for(var id in els){
+            var el = els[id], r = el._region;
+            var c = el.ddScrollConfig ? el.ddScrollConfig : dds;
+            if(r && r.contains(pt) && el.isScrollable()){
+                if(r.bottom - pt.y <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "down");
+                    }
+                    return;
+                }else if(r.right - pt.x <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "left");
+                    }
+                    return;
+                }else if(pt.y - r.top <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "up");
+                    }
+                    return;
+                }else if(pt.x - r.left <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "right");
+                    }
+                    return;
+                }
+            }
+        }
+        clearProc();
+    };
+    
+    ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);
+    ddm.stopDrag = ddm.stopDrag.createSequence(onStop, ddm);
+    
+    return {
+        /**
+         * Registers new overflow element(s) to auto scroll
+         * @param {Mixed/Array} el The id of or the element to be scrolled or an array of either
+         */
+        register : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.register(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                els[el.id] = el;
+            }
+        },
+        
+        /**
+         * Unregisters overflow element(s) so they are no longer scrolled
+         * @param {Mixed/Array} el The id of or the element to be removed or an array of either
+         */
+        unregister : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.unregister(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                delete els[el.id];
+            }
+        },
+        
+        /**
+         * The number of pixels from the top or bottom edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        vthresh : 25,
+        /**
+         * The number of pixels from the right or left edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        hthresh : 25,
+
+        /**
+         * The number of pixels to scroll in each scroll increment (defaults to 100)
+         * @type Number
+         */
+        increment : 100,
+        
+        /**
+         * The frequency of scrolls in milliseconds (defaults to 500)
+         * @type Number
+         */
+        frequency : 500,
+        
+        /**
+         * True to animate the scroll (defaults to true)
+         * @type Boolean
+         */
+        animate: true,
+        
+        /**
+         * The animation duration in seconds - 
+         * MUST BE less than Ext.dd.ScrollManager.frequency! (defaults to .4)
+         * @type Number
+         */
+        animDuration: .4,
+        
+        /**
+         * The named drag drop {@link Ext.dd.DragSource#ddGroup group} to which this container belongs (defaults to undefined). 
+         * If a ddGroup is specified, then container scrolling will only occur when a dragged object is in the same ddGroup.
+         * @type String
+         */
+        ddGroup: undefined,
+        
+        /**
+         * Manually trigger a cache refresh.
+         */
+        refreshCache : function(){
+            for(var id in els){
+                if(typeof els[id] == 'object'){ // for people extending the object prototype
+                    els[id]._region = els[id].getRegion();
+                }
+            }
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DropTarget.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DropTarget.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DropTarget.js	(revision 76)
@@ -0,0 +1,122 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.DropTarget
+ * @extends Ext.dd.DDTarget
+ * A simple class that provides the basic implementation needed to make any element a drop target that can have
+ * draggable items dropped onto it.  The drop has no effect until an implementation of notifyDrop is provided.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropTarget = Ext.extend(Ext.dd.DDTarget, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+    
+        Ext.apply(this, config);
+    
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    
+        Ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+              {isTarget: true});        
+    },
+    
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} overClass
+     * The CSS class applied to the drop target element while the drag source is over it (defaults to "").
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    // private
+    isTarget : true,
+
+    // private
+    isNotifyTarget : true,
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source is now over the
+     * target.  This default implementation adds the CSS class specified by overClass (if any) to the drop element
+     * and returns the dropAllowed config value.  This method should be overridden if drop validation is required.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        if(this.overClass){
+            this.el.addClass(this.overClass);
+        }
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the target.
+     * This method will be called on every mouse movement while the drag source is over the drop target.
+     * This default implementation simply returns the dropAllowed config value.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source has been dragged
+     * out of the target without dropping.  This default implementation simply removes the CSS class specified by
+     * overClass (if any) from the drop element.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    notifyOut : function(dd, e, data){
+        if(this.overClass){
+            this.el.removeClass(this.overClass);
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the dragged item has
+     * been dropped on it.  This method has no default implementation and returns false, so you must provide an
+     * implementation that does something to process the drop event and returns true so that the drag source's
+     * repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        return false;
+    },
+    
+    destroy : function(){
+        Ext.dd.DropTarget.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DragSource.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DragSource.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DragSource.js	(revision 76)
@@ -0,0 +1,370 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.DragSource
+ * @extends Ext.dd.DDProxy
+ * A simple class that provides the basic implementation needed to make any element draggable.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragSource = function(el, config){
+    this.el = Ext.get(el);
+    if(!this.dragData){
+        this.dragData = {};
+    }
+    
+    Ext.apply(this, config);
+    
+    if(!this.proxy){
+        this.proxy = new Ext.dd.StatusProxy();
+    }
+    Ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
+    
+    this.dragging = false;
+};
+
+Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Returns the data object associated with this drag source
+     * @return {Object} data An object containing arbitrary data
+     */
+    getDragData : function(e){
+        return this.dragData;
+    },
+
+    // private
+    onDragEnter : function(e, id){
+        var target = Ext.dd.DragDropMgr.getDDById(id);
+        this.cachedTarget = target;
+        if(this.beforeDragEnter(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyEnter(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }else{
+                this.proxy.setStatus(this.dropAllowed);
+            }
+            
+            if(this.afterDragEnter){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * when the dragged item enters the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragEnter
+                 */
+                this.afterDragEnter(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * before the dragged item enters the drop target and optionally cancel the onDragEnter.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragEnter : function(target, e, id){
+        return true;
+    },
+
+    // private
+    alignElWithMouse: function() {
+        Ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.proxy.sync();
+    },
+
+    // private
+    onDragOver : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOver(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyOver(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }
+
+            if(this.afterDragOver){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * while the dragged item is over the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOver
+                 */
+                this.afterDragOver(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * while the dragged item is over the drop target and optionally cancel the onDragOver.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOver : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onDragOut : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOut(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                target.notifyOut(this, e, this.dragData);
+            }
+            this.proxy.reset();
+            if(this.afterDragOut){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after the dragged item is dragged out of the target without dropping.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOut
+                 */
+                this.afterDragOut(target, e, id);
+            }
+        }
+        this.cachedTarget = null;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dragged out of the target without dropping, and optionally cancel the onDragOut.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOut : function(target, e, id){
+        return true;
+    },
+    
+    // private
+    onDragDrop : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragDrop(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                if(target.notifyDrop(this, e, this.dragData)){ // valid drop?
+                    this.onValidDrop(target, e, id);
+                }else{
+                    this.onInvalidDrop(target, e, id);
+                }
+            }else{
+                this.onValidDrop(target, e, id);
+            }
+            
+            if(this.afterDragDrop){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after a valid drag drop has occurred by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dropped element
+                 * @method afterDragDrop
+                 */
+                this.afterDragDrop(target, e, id);
+            }
+        }
+        delete this.cachedTarget;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dropped onto the target and optionally cancel the onDragDrop.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag drop event is valid, else false to cancel
+     */
+    beforeDragDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onValidDrop : function(target, e, id){
+        this.hideProxy();
+        if(this.afterValidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after a valid drop has occurred by providing an implementation.
+             * @param {Object} target The target DD 
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterValidDrop(target, e, id);
+        }
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return this.el.getXY();  
+    },
+
+    // private
+    onInvalidDrop : function(target, e, id){
+        this.beforeInvalidDrop(target, e, id);
+        if(this.cachedTarget){
+            if(this.cachedTarget.isNotifyTarget){
+                this.cachedTarget.notifyOut(this, e, this.dragData);
+            }
+            this.cacheTarget = null;
+        }
+        this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
+
+        if(this.afterInvalidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after an invalid drop has occurred by providing an implementation.
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterInvalidDrop(e, id);
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        if(Ext.enableFx){
+            this.el.highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action after an invalid
+     * drop has occurred.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the invalid drop should proceed, else false to cancel
+     */
+    beforeInvalidDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    handleMouseDown : function(e){
+        if(this.dragging) {
+            return;
+        }
+        var data = this.getDragData(e);
+        if(data && this.onBeforeDrag(data, e) !== false){
+            this.dragData = data;
+            this.proxy.stop();
+            Ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
+        } 
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the initial
+     * drag event begins and optionally cancel it.
+     * @param {Object} data An object containing arbitrary data to be shared with drop targets
+     * @param {Event} e The event object
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    onBeforeDrag : function(data, e){
+        return true;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action once the initial
+     * drag event has begun.  The drag cannot be canceled from this function.
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     */
+    onStartDrag : Ext.emptyFn,
+
+    // private override
+    startDrag : function(x, y){
+        this.proxy.reset();
+        this.dragging = true;
+        this.proxy.update("");
+        this.onInitDrag(x, y);
+        this.proxy.show();
+    },
+
+    // private
+    onInitDrag : function(x, y){
+        var clone = this.el.dom.cloneNode(true);
+        clone.id = Ext.id(); // prevent duplicate ids
+        this.proxy.update(clone);
+        this.onStartDrag(x, y);
+        return true;
+    },
+
+    /**
+     * Returns the drag source's underlying {@link Ext.dd.StatusProxy}
+     * @return {Ext.dd.StatusProxy} proxy The StatusProxy
+     */
+    getProxy : function(){
+        return this.proxy;  
+    },
+
+    /**
+     * Hides the drag source's {@link Ext.dd.StatusProxy}
+     */
+    hideProxy : function(){
+        this.proxy.hide();  
+        this.proxy.reset(true);
+        this.dragging = false;
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    },
+
+    // private - override to prevent hiding
+    b4EndDrag: function(e) {
+    },
+
+    // private - override to prevent moving
+    endDrag : function(e){
+        this.onEndDrag(this.dragData, e);
+    },
+
+    // private
+    onEndDrag : function(data, e){
+    },
+    
+    // private - pin to cursor
+    autoOffset : function(x, y) {
+        this.setDelta(-12, -20);
+    },
+    
+    destroy: function(){
+        Ext.dd.DragSource.superclass.destroy.call(this);
+        Ext.destroy(this.proxy);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DDCore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DDCore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DDCore.js	(revision 76)
@@ -0,0 +1,3176 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ * These classes are derivatives of the similarly named classes in the YUI Library.
+ * The original license:
+ * Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+ * Code licensed under the BSD License:
+ * http://developer.yahoo.net/yui/license.txt
+ */
+
+(function() {
+
+var Event=Ext.EventManager;
+var Dom=Ext.lib.Dom;
+
+/**
+ * @class Ext.dd.DragDrop
+ * Defines the interface and base operation of items that that can be
+ * dragged or can be drop targets.  It was designed to be extended, overriding
+ * the event handlers for startDrag, onDrag, onDragOver and onDragOut.
+ * Up to three html elements can be associated with a DragDrop instance:
+ * <ul>
+ * <li>linked element: the element that is passed into the constructor.
+ * This is the element which defines the boundaries for interaction with
+ * other DragDrop objects.</li>
+ * <li>handle element(s): The drag operation only occurs if the element that
+ * was clicked matches a handle element.  By default this is the linked
+ * element, but there are times that you will want only a portion of the
+ * linked element to initiate the drag operation, and the setHandleElId()
+ * method provides a way to define this.</li>
+ * <li>drag element: this represents the element that would be moved along
+ * with the cursor during a drag operation.  By default, this is the linked
+ * element itself as in {@link Ext.dd.DD}.  setDragElId() lets you define
+ * a separate element that would be moved, as in {@link Ext.dd.DDProxy}.
+ * </li>
+ * </ul>
+ * This class should not be instantiated until the onload event to ensure that
+ * the associated elements are available.
+ * The following would define a DragDrop obj that would interact with any
+ * other DragDrop obj in the "group1" group:
+ * <pre>
+ *  dd = new Ext.dd.DragDrop("div1", "group1");
+ * </pre>
+ * Since none of the event handlers have been implemented, nothing would
+ * actually happen if you were to run the code above.  Normally you would
+ * override this class or one of the default implementations, but you can
+ * also override the methods you want on an instance of the class...
+ * <pre>
+ *  dd.onDragDrop = function(e, id) {
+ *  &nbsp;&nbsp;alert("dd was dropped on " + id);
+ *  }
+ * </pre>
+ * @constructor
+ * @param {String} id of the element that is linked to this instance
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DragDrop:
+ *                    padding, isTarget, maintainOffset, primaryButtonOnly
+ */
+Ext.dd.DragDrop = function(id, sGroup, config) {
+    if(id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.dd.DragDrop.prototype = {
+
+    /**
+     * Set to false to enable a DragDrop object to fire drag events while dragging
+     * over its own Element. Defaults to true - DragDrop objects do not by default
+     * fire drag events to themselves.
+     * @property ignoreSelf
+     * @type Boolean
+     */
+
+    /**
+     * The id of the element associated with this object.  This is what we
+     * refer to as the "linked element" because the size and position of
+     * this element is used to determine when the drag and drop objects have
+     * interacted.
+     * @property id
+     * @type String
+     */
+    id: null,
+
+    /**
+     * Configuration attributes passed into the constructor
+     * @property config
+     * @type object
+     */
+    config: null,
+
+    /**
+     * The id of the element that will be dragged.  By default this is same
+     * as the linked element, but could be changed to another element. Ex:
+     * Ext.dd.DDProxy
+     * @property dragElId
+     * @type String
+     * @private
+     */
+    dragElId: null,
+
+    /**
+     * The ID of the element that initiates the drag operation.  By default
+     * this is the linked element, but could be changed to be a child of this
+     * element.  This lets us do things like only starting the drag when the
+     * header element within the linked html element is clicked.
+     * @property handleElId
+     * @type String
+     * @private
+     */
+    handleElId: null,
+
+    /**
+     * An object who's property names identify HTML tags to be considered invalid as drag handles.
+     * A non-null property value identifies the tag as invalid. Defaults to the 
+     * following value which prevents drag operations from being initiated by &lt;a> elements:<pre><code>
+{
+    A: "A"
+}</code></pre>
+     * @property invalidHandleTypes
+     * @type Object
+     */
+    invalidHandleTypes: null,
+
+    /**
+     * An object who's property names identify the IDs of elements to be considered invalid as drag handles.
+     * A non-null property value identifies the ID as invalid. For example, to prevent
+     * dragging from being initiated on element ID "foo", use:<pre><code>
+{
+    foo: true
+}</code></pre>
+     * @property invalidHandleIds
+     * @type Object
+     */
+    invalidHandleIds: null,
+
+    /**
+     * An Array of CSS class names for elements to be considered in valid as drag handles.
+     * @property invalidHandleClasses
+     * @type Array
+     */
+    invalidHandleClasses: null,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageX
+     * @type int
+     * @private
+     */
+    startPageX: 0,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageY
+     * @type int
+     * @private
+     */
+    startPageY: 0,
+
+    /**
+     * The group defines a logical collection of DragDrop objects that are
+     * related.  Instances only get events when interacting with other
+     * DragDrop object in the same group.  This lets us define multiple
+     * groups using a single DragDrop subclass if we want.
+     * @property groups
+     * @type object An object in the format {'group1':true, 'group2':true}
+     */
+    groups: null,
+
+    /**
+     * Individual drag/drop instances can be locked.  This will prevent
+     * onmousedown start drag.
+     * @property locked
+     * @type boolean
+     * @private
+     */
+    locked: false,
+
+    /**
+     * Lock this instance
+     * @method lock
+     */
+    lock: function() {
+        this.locked = true;
+    },
+
+    /**
+     * When set to true, other DD objects in cooperating DDGroups do not receive
+     * notification events when this DD object is dragged over them. Defaults to false.
+     * @property moveOnly
+     * @type boolean
+     */
+    moveOnly: false,
+
+    /**
+     * Unlock this instace
+     * @method unlock
+     */
+    unlock: function() {
+        this.locked = false;
+    },
+
+    /**
+     * By default, all instances can be a drop target.  This can be disabled by
+     * setting isTarget to false.
+     * @property isTarget
+     * @type boolean
+     */
+    isTarget: true,
+
+    /**
+     * The padding configured for this drag and drop object for calculating
+     * the drop zone intersection with this object.
+     * @property padding
+     * @type int[] An array containing the 4 padding values: [top, right, bottom, left]
+     */
+    padding: null,
+
+    /**
+     * Cached reference to the linked element
+     * @property _domRef
+     * @private
+     */
+    _domRef: null,
+
+    /**
+     * Internal typeof flag
+     * @property __ygDragDrop
+     * @private
+     */
+    __ygDragDrop: true,
+
+    /**
+     * Set to true when horizontal contraints are applied
+     * @property constrainX
+     * @type boolean
+     * @private
+     */
+    constrainX: false,
+
+    /**
+     * Set to true when vertical contraints are applied
+     * @property constrainY
+     * @type boolean
+     * @private
+     */
+    constrainY: false,
+
+    /**
+     * The left constraint
+     * @property minX
+     * @type int
+     * @private
+     */
+    minX: 0,
+
+    /**
+     * The right constraint
+     * @property maxX
+     * @type int
+     * @private
+     */
+    maxX: 0,
+
+    /**
+     * The up constraint
+     * @property minY
+     * @type int
+     * @private
+     */
+    minY: 0,
+
+    /**
+     * The down constraint
+     * @property maxY
+     * @type int
+     * @private
+     */
+    maxY: 0,
+
+    /**
+     * Maintain offsets when we resetconstraints.  Set to true when you want
+     * the position of the element relative to its parent to stay the same
+     * when the page changes
+     *
+     * @property maintainOffset
+     * @type boolean
+     */
+    maintainOffset: false,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * horizontal graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property xTicks
+     * @type int[]
+     */
+    xTicks: null,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * vertical graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property yTicks
+     * @type int[]
+     */
+    yTicks: null,
+
+    /**
+     * By default the drag and drop instance will only respond to the primary
+     * button click (left button for a right-handed mouse).  Set to true to
+     * allow drag and drop to start with any mouse click that is propogated
+     * by the browser
+     * @property primaryButtonOnly
+     * @type boolean
+     */
+    primaryButtonOnly: true,
+
+    /**
+     * The available property is false until the linked dom element is accessible.
+     * @property available
+     * @type boolean
+     */
+    available: false,
+
+    /**
+     * By default, drags can only be initiated if the mousedown occurs in the
+     * region the linked element is.  This is done in part to work around a
+     * bug in some browsers that mis-report the mousedown if the previous
+     * mouseup happened outside of the window.  This property is set to true
+     * if outer handles are defined.
+     *
+     * @property hasOuterHandles
+     * @type boolean
+     * @default false
+     */
+    hasOuterHandles: false,
+
+    /**
+     * Code that executes immediately before the startDrag event
+     * @method b4StartDrag
+     * @private
+     */
+    b4StartDrag: function(x, y) { },
+
+    /**
+     * Abstract method called after a drag/drop object is clicked
+     * and the drag or mousedown time thresholds have beeen met.
+     * @method startDrag
+     * @param {int} X click location
+     * @param {int} Y click location
+     */
+    startDrag: function(x, y) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDrag event
+     * @method b4Drag
+     * @private
+     */
+    b4Drag: function(e) { },
+
+    /**
+     * Abstract method called during the onMouseMove event while dragging an
+     * object.
+     * @method onDrag
+     * @param {Event} e the mousemove event
+     */
+    onDrag: function(e) { /* override this */ },
+
+    /**
+     * Abstract method called when this element fist begins hovering over
+     * another DragDrop obj
+     * @method onDragEnter
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of one or more
+     * dragdrop items being hovered over.
+     */
+    onDragEnter: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOver event
+     * @method b4DragOver
+     * @private
+     */
+    b4DragOver: function(e) { },
+
+    /**
+     * Abstract method called when this element is hovering over another
+     * DragDrop obj
+     * @method onDragOver
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of dd items
+     * being hovered over.
+     */
+    onDragOver: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOut event
+     * @method b4DragOut
+     * @private
+     */
+    b4DragOut: function(e) { },
+
+    /**
+     * Abstract method called when we are no longer hovering over an element
+     * @method onDragOut
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was hovering over.  In INTERSECT mode, an array of dd items
+     * that the mouse is no longer over.
+     */
+    onDragOut: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragDrop event
+     * @method b4DragDrop
+     * @private
+     */
+    b4DragDrop: function(e) { },
+
+    /**
+     * Abstract method called when this item is dropped on another DragDrop
+     * obj
+     * @method onDragDrop
+     * @param {Event} e the mouseup event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was dropped on.  In INTERSECT mode, an array of dd items this
+     * was dropped on.
+     */
+    onDragDrop: function(e, id) { /* override this */ },
+
+    /**
+     * Abstract method called when this item is dropped on an area with no
+     * drop target
+     * @method onInvalidDrop
+     * @param {Event} e the mouseup event
+     */
+    onInvalidDrop: function(e) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the endDrag event
+     * @method b4EndDrag
+     * @private
+     */
+    b4EndDrag: function(e) { },
+
+    /**
+     * Fired when we are done dragging the object
+     * @method endDrag
+     * @param {Event} e the mouseup event
+     */
+    endDrag: function(e) { /* override this */ },
+
+    /**
+     * Code executed immediately before the onMouseDown event
+     * @method b4MouseDown
+     * @param {Event} e the mousedown event
+     * @private
+     */
+    b4MouseDown: function(e) {  },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mousedown
+     * @method onMouseDown
+     * @param {Event} e the mousedown event
+     */
+    onMouseDown: function(e) { /* override this */ },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mouseup
+     * @method onMouseUp
+     * @param {Event} e the mouseup event
+     */
+    onMouseUp: function(e) { /* override this */ },
+
+    /**
+     * Override the onAvailable method to do what is needed after the initial
+     * position was determined.
+     * @method onAvailable
+     */
+    onAvailable: function () {
+    },
+
+    /**
+     * Provides default constraint padding to "constrainTo" elements (defaults to {left: 0, right:0, top:0, bottom:0}).
+     * @type Object
+     */
+    defaultPadding : {left:0, right:0, top:0, bottom:0},
+
+    /**
+     * Initializes the drag drop object's constraints to restrict movement to a certain element.
+ *
+ * Usage:
+ <pre><code>
+ var dd = new Ext.dd.DDProxy("dragDiv1", "proxytest",
+                { dragElId: "existingProxyDiv" });
+ dd.startDrag = function(){
+     this.constrainTo("parent-id");
+ };
+ </code></pre>
+ * Or you can initalize it using the {@link Ext.Element} object:
+ <pre><code>
+ Ext.get("dragDiv1").initDDProxy("proxytest", {dragElId: "existingProxyDiv"}, {
+     startDrag : function(){
+         this.constrainTo("parent-id");
+     }
+ });
+ </code></pre>
+     * @param {Mixed} constrainTo The element to constrain to.
+     * @param {Object/Number} pad (optional) Pad provides a way to specify "padding" of the constraints,
+     * and can be either a number for symmetrical padding (4 would be equal to {left:4, right:4, top:4, bottom:4}) or
+     * an object containing the sides to pad. For example: {right:10, bottom:10}
+     * @param {Boolean} inContent (optional) Constrain the draggable in the content box of the element (inside padding and borders)
+     */
+    constrainTo : function(constrainTo, pad, inContent){
+        if(Ext.isNumber(pad)){
+            pad = {left: pad, right:pad, top:pad, bottom:pad};
+        }
+        pad = pad || this.defaultPadding;
+        var b = Ext.get(this.getEl()).getBox(),
+            ce = Ext.get(constrainTo),
+            s = ce.getScroll(),
+            c, 
+            cd = ce.dom;
+        if(cd == document.body){
+            c = { x: s.left, y: s.top, width: Ext.lib.Dom.getViewWidth(), height: Ext.lib.Dom.getViewHeight()};
+        }else{
+            var xy = ce.getXY();
+            c = {x : xy[0], y: xy[1], width: cd.clientWidth, height: cd.clientHeight};
+        }
+
+
+        var topSpace = b.y - c.y,
+            leftSpace = b.x - c.x;
+
+        this.resetConstraints();
+        this.setXConstraint(leftSpace - (pad.left||0), // left
+                c.width - leftSpace - b.width - (pad.right||0), //right
+				this.xTickSize
+        );
+        this.setYConstraint(topSpace - (pad.top||0), //top
+                c.height - topSpace - b.height - (pad.bottom||0), //bottom
+				this.yTickSize
+        );
+    },
+
+    /**
+     * Returns a reference to the linked element
+     * @method getEl
+     * @return {HTMLElement} the html element
+     */
+    getEl: function() {
+        if (!this._domRef) {
+            this._domRef = Ext.getDom(this.id);
+        }
+
+        return this._domRef;
+    },
+
+    /**
+     * Returns a reference to the actual element to drag.  By default this is
+     * the same as the html element, but it can be assigned to another
+     * element. An example of this can be found in Ext.dd.DDProxy
+     * @method getDragEl
+     * @return {HTMLElement} the html element
+     */
+    getDragEl: function() {
+        return Ext.getDom(this.dragElId);
+    },
+
+    /**
+     * Sets up the DragDrop object.  Must be called in the constructor of any
+     * Ext.dd.DragDrop subclass
+     * @method init
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    init: function(id, sGroup, config) {
+        this.initTarget(id, sGroup, config);
+        Event.on(this.id, "mousedown", this.handleMouseDown, this);
+        // Event.on(this.id, "selectstart", Event.preventDefault);
+    },
+
+    /**
+     * Initializes Targeting functionality only... the object does not
+     * get a mousedown handler.
+     * @method initTarget
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    initTarget: function(id, sGroup, config) {
+
+        // configuration attributes
+        this.config = config || {};
+
+        // create a local reference to the drag and drop manager
+        this.DDM = Ext.dd.DDM;
+        // initialize the groups array
+        this.groups = {};
+
+        // assume that we have an element reference instead of an id if the
+        // parameter is not a string
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+
+        // set the id
+        this.id = id;
+
+        // add to an interaction group
+        this.addToGroup((sGroup) ? sGroup : "default");
+
+        // We don't want to register this as the handle with the manager
+        // so we just set the id rather than calling the setter.
+        this.handleElId = id;
+
+        // the linked element is the element that gets dragged by default
+        this.setDragElId(id);
+
+        // by default, clicked anchors will not start drag operations.
+        this.invalidHandleTypes = { A: "A" };
+        this.invalidHandleIds = {};
+        this.invalidHandleClasses = [];
+
+        this.applyConfig();
+
+        this.handleOnAvailable();
+    },
+
+    /**
+     * Applies the configuration parameters that were passed into the constructor.
+     * This is supposed to happen at each level through the inheritance chain.  So
+     * a DDProxy implentation will execute apply config on DDProxy, DD, and
+     * DragDrop in order to get all of the parameters that are available in
+     * each object.
+     * @method applyConfig
+     */
+    applyConfig: function() {
+
+        // configurable properties:
+        //    padding, isTarget, maintainOffset, primaryButtonOnly
+        this.padding           = this.config.padding || [0, 0, 0, 0];
+        this.isTarget          = (this.config.isTarget !== false);
+        this.maintainOffset    = (this.config.maintainOffset);
+        this.primaryButtonOnly = (this.config.primaryButtonOnly !== false);
+
+    },
+
+    /**
+     * Executed when the linked element is available
+     * @method handleOnAvailable
+     * @private
+     */
+    handleOnAvailable: function() {
+        this.available = true;
+        this.resetConstraints();
+        this.onAvailable();
+    },
+
+     /**
+     * Configures the padding for the target zone in px.  Effectively expands
+     * (or reduces) the virtual object size for targeting calculations.
+     * Supports css-style shorthand; if only one parameter is passed, all sides
+     * will have that padding, and if only two are passed, the top and bottom
+     * will have the first param, the left and right the second.
+     * @method setPadding
+     * @param {int} iTop    Top pad
+     * @param {int} iRight  Right pad
+     * @param {int} iBot    Bot pad
+     * @param {int} iLeft   Left pad
+     */
+    setPadding: function(iTop, iRight, iBot, iLeft) {
+        // this.padding = [iLeft, iRight, iTop, iBot];
+        if (!iRight && 0 !== iRight) {
+            this.padding = [iTop, iTop, iTop, iTop];
+        } else if (!iBot && 0 !== iBot) {
+            this.padding = [iTop, iRight, iTop, iRight];
+        } else {
+            this.padding = [iTop, iRight, iBot, iLeft];
+        }
+    },
+
+    /**
+     * Stores the initial placement of the linked element.
+     * @method setInitPosition
+     * @param {int} diffX   the X offset, default 0
+     * @param {int} diffY   the Y offset, default 0
+     */
+    setInitPosition: function(diffX, diffY) {
+        var el = this.getEl();
+
+        if (!this.DDM.verifyEl(el)) {
+            return;
+        }
+
+        var dx = diffX || 0;
+        var dy = diffY || 0;
+
+        var p = Dom.getXY( el );
+
+        this.initPageX = p[0] - dx;
+        this.initPageY = p[1] - dy;
+
+        this.lastPageX = p[0];
+        this.lastPageY = p[1];
+
+        this.setStartPosition(p);
+    },
+
+    /**
+     * Sets the start position of the element.  This is set when the obj
+     * is initialized, the reset when a drag is started.
+     * @method setStartPosition
+     * @param pos current position (from previous lookup)
+     * @private
+     */
+    setStartPosition: function(pos) {
+        var p = pos || Dom.getXY( this.getEl() );
+        this.deltaSetXY = null;
+
+        this.startPageX = p[0];
+        this.startPageY = p[1];
+    },
+
+    /**
+     * Add this instance to a group of related drag/drop objects.  All
+     * instances belong to at least one group, and can belong to as many
+     * groups as needed.
+     * @method addToGroup
+     * @param sGroup {string} the name of the group
+     */
+    addToGroup: function(sGroup) {
+        this.groups[sGroup] = true;
+        this.DDM.regDragDrop(this, sGroup);
+    },
+
+    /**
+     * Remove's this instance from the supplied interaction group
+     * @method removeFromGroup
+     * @param {string}  sGroup  The group to drop
+     */
+    removeFromGroup: function(sGroup) {
+        if (this.groups[sGroup]) {
+            delete this.groups[sGroup];
+        }
+
+        this.DDM.removeDDFromGroup(this, sGroup);
+    },
+
+    /**
+     * Allows you to specify that an element other than the linked element
+     * will be moved with the cursor during a drag
+     * @method setDragElId
+     * @param id {string} the id of the element that will be used to initiate the drag
+     */
+    setDragElId: function(id) {
+        this.dragElId = id;
+    },
+
+    /**
+     * Allows you to specify a child of the linked element that should be
+     * used to initiate the drag operation.  An example of this would be if
+     * you have a content div with text and links.  Clicking anywhere in the
+     * content area would normally start the drag operation.  Use this method
+     * to specify that an element inside of the content div is the element
+     * that starts the drag operation.
+     * @method setHandleElId
+     * @param id {string} the id of the element that will be used to
+     * initiate the drag.
+     */
+    setHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.handleElId = id;
+        this.DDM.regHandle(this.id, id);
+    },
+
+    /**
+     * Allows you to set an element outside of the linked element as a drag
+     * handle
+     * @method setOuterHandleElId
+     * @param id the id of the element that will be used to initiate the drag
+     */
+    setOuterHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        Event.on(id, "mousedown",
+                this.handleMouseDown, this);
+        this.setHandleElId(id);
+
+        this.hasOuterHandles = true;
+    },
+
+    /**
+     * Remove all drag and drop hooks for this element
+     * @method unreg
+     */
+    unreg: function() {
+        Event.un(this.id, "mousedown",
+                this.handleMouseDown);
+        this._domRef = null;
+        this.DDM._remove(this);
+    },
+
+    destroy : function(){
+        this.unreg();
+    },
+
+    /**
+     * Returns true if this instance is locked, or the drag drop mgr is locked
+     * (meaning that all drag/drop is disabled on the page.)
+     * @method isLocked
+     * @return {boolean} true if this obj or all drag/drop is locked, else
+     * false
+     */
+    isLocked: function() {
+        return (this.DDM.isLocked() || this.locked);
+    },
+
+    /**
+     * Fired when this object is clicked
+     * @method handleMouseDown
+     * @param {Event} e
+     * @param {Ext.dd.DragDrop} oDD the clicked dd object (this dd obj)
+     * @private
+     */
+    handleMouseDown: function(e, oDD){
+        if (this.primaryButtonOnly && e.button != 0) {
+            return;
+        }
+
+        if (this.isLocked()) {
+            return;
+        }
+
+        this.DDM.refreshCache(this.groups);
+
+        var pt = new Ext.lib.Point(Ext.lib.Event.getPageX(e), Ext.lib.Event.getPageY(e));
+        if (!this.hasOuterHandles && !this.DDM.isOverTarget(pt, this) )  {
+        } else {
+            if (this.clickValidator(e)) {
+
+                // set the initial element position
+                this.setStartPosition();
+
+                this.b4MouseDown(e);
+                this.onMouseDown(e);
+
+                this.DDM.handleMouseDown(e, this);
+
+                this.DDM.stopEvent(e);
+            } else {
+
+
+            }
+        }
+    },
+
+    clickValidator: function(e) {
+        var target = e.getTarget();
+        return ( this.isValidHandleChild(target) &&
+                    (this.id == this.handleElId ||
+                        this.DDM.handleWasClicked(target, this.id)) );
+    },
+
+    /**
+     * Allows you to specify a tag name that should not start a drag operation
+     * when clicked.  This is designed to facilitate embedding links within a
+     * drag handle that do something other than start the drag.
+     * @method addInvalidHandleType
+     * @param {string} tagName the type of element to exclude
+     */
+    addInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        this.invalidHandleTypes[type] = type;
+    },
+
+    /**
+     * Lets you to specify an element id for a child of a drag handle
+     * that should not initiate a drag
+     * @method addInvalidHandleId
+     * @param {string} id the element id of the element you wish to ignore
+     */
+    addInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.invalidHandleIds[id] = id;
+    },
+
+    /**
+     * Lets you specify a css class of elements that will not initiate a drag
+     * @method addInvalidHandleClass
+     * @param {string} cssClass the class of the elements you wish to ignore
+     */
+    addInvalidHandleClass: function(cssClass) {
+        this.invalidHandleClasses.push(cssClass);
+    },
+
+    /**
+     * Unsets an excluded tag name set by addInvalidHandleType
+     * @method removeInvalidHandleType
+     * @param {string} tagName the type of element to unexclude
+     */
+    removeInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        // this.invalidHandleTypes[type] = null;
+        delete this.invalidHandleTypes[type];
+    },
+
+    /**
+     * Unsets an invalid handle id
+     * @method removeInvalidHandleId
+     * @param {string} id the id of the element to re-enable
+     */
+    removeInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        delete this.invalidHandleIds[id];
+    },
+
+    /**
+     * Unsets an invalid css class
+     * @method removeInvalidHandleClass
+     * @param {string} cssClass the class of the element(s) you wish to
+     * re-enable
+     */
+    removeInvalidHandleClass: function(cssClass) {
+        for (var i=0, len=this.invalidHandleClasses.length; i<len; ++i) {
+            if (this.invalidHandleClasses[i] == cssClass) {
+                delete this.invalidHandleClasses[i];
+            }
+        }
+    },
+
+    /**
+     * Checks the tag exclusion list to see if this click should be ignored
+     * @method isValidHandleChild
+     * @param {HTMLElement} node the HTMLElement to evaluate
+     * @return {boolean} true if this is a valid tag type, false if not
+     */
+    isValidHandleChild: function(node) {
+
+        var valid = true;
+        // var n = (node.nodeName == "#text") ? node.parentNode : node;
+        var nodeName;
+        try {
+            nodeName = node.nodeName.toUpperCase();
+        } catch(e) {
+            nodeName = node.nodeName;
+        }
+        valid = valid && !this.invalidHandleTypes[nodeName];
+        valid = valid && !this.invalidHandleIds[node.id];
+
+        for (var i=0, len=this.invalidHandleClasses.length; valid && i<len; ++i) {
+            valid = !Ext.fly(node).hasClass(this.invalidHandleClasses[i]);
+        }
+
+
+        return valid;
+
+    },
+
+    /**
+     * Create the array of horizontal tick marks if an interval was specified
+     * in setXConstraint().
+     * @method setXTicks
+     * @private
+     */
+    setXTicks: function(iStartX, iTickSize) {
+        this.xTicks = [];
+        this.xTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.xTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * Create the array of vertical tick marks if an interval was specified in
+     * setYConstraint().
+     * @method setYTicks
+     * @private
+     */
+    setYTicks: function(iStartY, iTickSize) {
+        this.yTicks = [];
+        this.yTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.yTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Use
+     * this method to limit the horizontal travel of the element.  Pass in
+     * 0,0 for the parameters if you want to lock the drag to the y axis.
+     * @method setXConstraint
+     * @param {int} iLeft the number of pixels the element can move to the left
+     * @param {int} iRight the number of pixels the element can move to the
+     * right
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element
+     * should move iTickSize pixels at a time.
+     */
+    setXConstraint: function(iLeft, iRight, iTickSize) {
+        this.leftConstraint = iLeft;
+        this.rightConstraint = iRight;
+
+        this.minX = this.initPageX - iLeft;
+        this.maxX = this.initPageX + iRight;
+        if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); }
+
+        this.constrainX = true;
+    },
+
+    /**
+     * Clears any constraints applied to this instance.  Also clears ticks
+     * since they can't exist independent of a constraint at this time.
+     * @method clearConstraints
+     */
+    clearConstraints: function() {
+        this.constrainX = false;
+        this.constrainY = false;
+        this.clearTicks();
+    },
+
+    /**
+     * Clears any tick interval defined for this instance
+     * @method clearTicks
+     */
+    clearTicks: function() {
+        this.xTicks = null;
+        this.yTicks = null;
+        this.xTickSize = 0;
+        this.yTickSize = 0;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Set
+     * this to limit the vertical travel of the element.  Pass in 0,0 for the
+     * parameters if you want to lock the drag to the x axis.
+     * @method setYConstraint
+     * @param {int} iUp the number of pixels the element can move up
+     * @param {int} iDown the number of pixels the element can move down
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element should move iTickSize pixels at a time.
+     */
+    setYConstraint: function(iUp, iDown, iTickSize) {
+        this.topConstraint = iUp;
+        this.bottomConstraint = iDown;
+
+        this.minY = this.initPageY - iUp;
+        this.maxY = this.initPageY + iDown;
+        if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); }
+
+        this.constrainY = true;
+
+    },
+
+    /**
+     * resetConstraints must be called if you manually reposition a dd element.
+     * @method resetConstraints
+     * @param {boolean} maintainOffset
+     */
+    resetConstraints: function() {
+        // Maintain offsets if necessary
+        if (this.initPageX || this.initPageX === 0) {
+            // figure out how much this thing has moved
+            var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0;
+            var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0;
+
+            this.setInitPosition(dx, dy);
+
+        // This is the first time we have detected the element's position
+        } else {
+            this.setInitPosition();
+        }
+
+        if (this.constrainX) {
+            this.setXConstraint( this.leftConstraint,
+                                 this.rightConstraint,
+                                 this.xTickSize        );
+        }
+
+        if (this.constrainY) {
+            this.setYConstraint( this.topConstraint,
+                                 this.bottomConstraint,
+                                 this.yTickSize         );
+        }
+    },
+
+    /**
+     * Normally the drag element is moved pixel by pixel, but we can specify
+     * that it move a number of pixels at a time.  This method resolves the
+     * location when we have it set up like this.
+     * @method getTick
+     * @param {int} val where we want to place the object
+     * @param {int[]} tickArray sorted array of valid points
+     * @return {int} the closest tick
+     * @private
+     */
+    getTick: function(val, tickArray) {
+        if (!tickArray) {
+            // If tick interval is not defined, it is effectively 1 pixel,
+            // so we return the value passed to us.
+            return val;
+        } else if (tickArray[0] >= val) {
+            // The value is lower than the first tick, so we return the first
+            // tick.
+            return tickArray[0];
+        } else {
+            for (var i=0, len=tickArray.length; i<len; ++i) {
+                var next = i + 1;
+                if (tickArray[next] && tickArray[next] >= val) {
+                    var diff1 = val - tickArray[i];
+                    var diff2 = tickArray[next] - val;
+                    return (diff2 > diff1) ? tickArray[i] : tickArray[next];
+                }
+            }
+
+            // The value is larger than the last tick, so we return the last
+            // tick.
+            return tickArray[tickArray.length - 1];
+        }
+    },
+
+    /**
+     * toString method
+     * @method toString
+     * @return {string} string representation of the dd obj
+     */
+    toString: function() {
+        return ("DragDrop " + this.id);
+    }
+
+};
+
+})();
+/*
+ * The drag and drop utility provides a framework for building drag and drop
+ * applications.  In addition to enabling drag and drop for specific elements,
+ * the drag and drop elements are tracked by the manager class, and the
+ * interactions between the various elements are tracked during the drag and
+ * the implementing code is notified about these important moments.
+ */
+
+// Only load the library once.  Rewriting the manager class would orphan
+// existing drag and drop instances.
+if (!Ext.dd.DragDropMgr) {
+
+/**
+ * @class Ext.dd.DragDropMgr
+ * DragDropMgr is a singleton that tracks the element interaction for
+ * all DragDrop items in the window.  Generally, you will not call
+ * this class directly, but it does have helper methods that could
+ * be useful in your DragDrop implementations.
+ * @singleton
+ */
+Ext.dd.DragDropMgr = function() {
+
+    var Event = Ext.EventManager;
+
+    return {
+
+        /**
+         * Two dimensional Array of registered DragDrop objects.  The first
+         * dimension is the DragDrop item group, the second the DragDrop
+         * object.
+         * @property ids
+         * @type String[]
+         * @private
+         * @static
+         */
+        ids: {},
+
+        /**
+         * Array of element ids defined as drag handles.  Used to determine
+         * if the element that generated the mousedown event is actually the
+         * handle and not the html element itself.
+         * @property handleIds
+         * @type String[]
+         * @private
+         * @static
+         */
+        handleIds: {},
+
+        /**
+         * the DragDrop object that is currently being dragged
+         * @property dragCurrent
+         * @type DragDrop
+         * @private
+         * @static
+         **/
+        dragCurrent: null,
+
+        /**
+         * the DragDrop object(s) that are being hovered over
+         * @property dragOvers
+         * @type Array
+         * @private
+         * @static
+         */
+        dragOvers: {},
+
+        /**
+         * the X distance between the cursor and the object being dragged
+         * @property deltaX
+         * @type int
+         * @private
+         * @static
+         */
+        deltaX: 0,
+
+        /**
+         * the Y distance between the cursor and the object being dragged
+         * @property deltaY
+         * @type int
+         * @private
+         * @static
+         */
+        deltaY: 0,
+
+        /**
+         * Flag to determine if we should prevent the default behavior of the
+         * events we define. By default this is true, but this can be set to
+         * false if you need the default behavior (not recommended)
+         * @property preventDefault
+         * @type boolean
+         * @static
+         */
+        preventDefault: true,
+
+        /**
+         * Flag to determine if we should stop the propagation of the events
+         * we generate. This is true by default but you may want to set it to
+         * false if the html element contains other features that require the
+         * mouse click.
+         * @property stopPropagation
+         * @type boolean
+         * @static
+         */
+        stopPropagation: true,
+
+        /**
+         * Internal flag that is set to true when drag and drop has been
+         * intialized
+         * @property initialized
+         * @private
+         * @static
+         */
+        initialized: false,
+
+        /**
+         * All drag and drop can be disabled.
+         * @property locked
+         * @private
+         * @static
+         */
+        locked: false,
+
+        /**
+         * Called the first time an element is registered.
+         * @method init
+         * @private
+         * @static
+         */
+        init: function() {
+            this.initialized = true;
+        },
+
+        /**
+         * In point mode, drag and drop interaction is defined by the
+         * location of the cursor during the drag/drop
+         * @property POINT
+         * @type int
+         * @static
+         */
+        POINT: 0,
+
+        /**
+         * In intersect mode, drag and drop interaction is defined by the
+         * overlap of two or more drag and drop objects.
+         * @property INTERSECT
+         * @type int
+         * @static
+         */
+        INTERSECT: 1,
+
+        /**
+         * The current drag and drop mode.  Default: POINT
+         * @property mode
+         * @type int
+         * @static
+         */
+        mode: 0,
+
+        /**
+         * Runs method on all drag and drop objects
+         * @method _execOnAll
+         * @private
+         * @static
+         */
+        _execOnAll: function(sMethod, args) {
+            for (var i in this.ids) {
+                for (var j in this.ids[i]) {
+                    var oDD = this.ids[i][j];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+                    oDD[sMethod].apply(oDD, args);
+                }
+            }
+        },
+
+        /**
+         * Drag and drop initialization.  Sets up the global event handlers
+         * @method _onLoad
+         * @private
+         * @static
+         */
+        _onLoad: function() {
+
+            this.init();
+
+
+            Event.on(document, "mouseup",   this.handleMouseUp, this, true);
+            Event.on(document, "mousemove", this.handleMouseMove, this, true);
+            Event.on(window,   "unload",    this._onUnload, this, true);
+            Event.on(window,   "resize",    this._onResize, this, true);
+            // Event.on(window,   "mouseout",    this._test);
+
+        },
+
+        /**
+         * Reset constraints on all drag and drop objs
+         * @method _onResize
+         * @private
+         * @static
+         */
+        _onResize: function(e) {
+            this._execOnAll("resetConstraints", []);
+        },
+
+        /**
+         * Lock all drag and drop functionality
+         * @method lock
+         * @static
+         */
+        lock: function() { this.locked = true; },
+
+        /**
+         * Unlock all drag and drop functionality
+         * @method unlock
+         * @static
+         */
+        unlock: function() { this.locked = false; },
+
+        /**
+         * Is drag and drop locked?
+         * @method isLocked
+         * @return {boolean} True if drag and drop is locked, false otherwise.
+         * @static
+         */
+        isLocked: function() { return this.locked; },
+
+        /**
+         * Location cache that is set for all drag drop objects when a drag is
+         * initiated, cleared when the drag is finished.
+         * @property locationCache
+         * @private
+         * @static
+         */
+        locationCache: {},
+
+        /**
+         * Set useCache to false if you want to force object the lookup of each
+         * drag and drop linked element constantly during a drag.
+         * @property useCache
+         * @type boolean
+         * @static
+         */
+        useCache: true,
+
+        /**
+         * The number of pixels that the mouse needs to move after the
+         * mousedown before the drag is initiated.  Default=3;
+         * @property clickPixelThresh
+         * @type int
+         * @static
+         */
+        clickPixelThresh: 3,
+
+        /**
+         * The number of milliseconds after the mousedown event to initiate the
+         * drag if we don't get a mouseup event. Default=350
+         * @property clickTimeThresh
+         * @type int
+         * @static
+         */
+        clickTimeThresh: 350,
+
+        /**
+         * Flag that indicates that either the drag pixel threshold or the
+         * mousdown time threshold has been met
+         * @property dragThreshMet
+         * @type boolean
+         * @private
+         * @static
+         */
+        dragThreshMet: false,
+
+        /**
+         * Timeout used for the click time threshold
+         * @property clickTimeout
+         * @type Object
+         * @private
+         * @static
+         */
+        clickTimeout: null,
+
+        /**
+         * The X position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startX
+         * @type int
+         * @private
+         * @static
+         */
+        startX: 0,
+
+        /**
+         * The Y position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startY
+         * @type int
+         * @private
+         * @static
+         */
+        startY: 0,
+
+        /**
+         * Each DragDrop instance must be registered with the DragDropMgr.
+         * This is executed in DragDrop.init()
+         * @method regDragDrop
+         * @param {DragDrop} oDD the DragDrop object to register
+         * @param {String} sGroup the name of the group this element belongs to
+         * @static
+         */
+        regDragDrop: function(oDD, sGroup) {
+            if (!this.initialized) { this.init(); }
+
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+            this.ids[sGroup][oDD.id] = oDD;
+        },
+
+        /**
+         * Removes the supplied dd instance from the supplied group. Executed
+         * by DragDrop.removeFromGroup, so don't call this function directly.
+         * @method removeDDFromGroup
+         * @private
+         * @static
+         */
+        removeDDFromGroup: function(oDD, sGroup) {
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+
+            var obj = this.ids[sGroup];
+            if (obj && obj[oDD.id]) {
+                delete obj[oDD.id];
+            }
+        },
+
+        /**
+         * Unregisters a drag and drop item.  This is executed in
+         * DragDrop.unreg, use that method instead of calling this directly.
+         * @method _remove
+         * @private
+         * @static
+         */
+        _remove: function(oDD) {
+            for (var g in oDD.groups) {
+                if (g && this.ids[g] && this.ids[g][oDD.id]) {
+                    delete this.ids[g][oDD.id];
+                }
+            }
+            delete this.handleIds[oDD.id];
+        },
+
+        /**
+         * Each DragDrop handle element must be registered.  This is done
+         * automatically when executing DragDrop.setHandleElId()
+         * @method regHandle
+         * @param {String} sDDId the DragDrop id this element is a handle for
+         * @param {String} sHandleId the id of the element that is the drag
+         * handle
+         * @static
+         */
+        regHandle: function(sDDId, sHandleId) {
+            if (!this.handleIds[sDDId]) {
+                this.handleIds[sDDId] = {};
+            }
+            this.handleIds[sDDId][sHandleId] = sHandleId;
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop item.
+         * @method isDragDrop
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop item,
+         * false otherwise
+         * @static
+         */
+        isDragDrop: function(id) {
+            return ( this.getDDById(id) ) ? true : false;
+        },
+
+        /**
+         * Returns the drag and drop instances that are in all groups the
+         * passed in instance belongs to.
+         * @method getRelated
+         * @param {DragDrop} p_oDD the obj to get related data for
+         * @param {boolean} bTargetsOnly if true, only return targetable objs
+         * @return {DragDrop[]} the related instances
+         * @static
+         */
+        getRelated: function(p_oDD, bTargetsOnly) {
+            var oDDs = [];
+            for (var i in p_oDD.groups) {
+                for (var j in this.ids[i]) {
+                    var dd = this.ids[i][j];
+                    if (! this.isTypeOfDD(dd)) {
+                        continue;
+                    }
+                    if (!bTargetsOnly || dd.isTarget) {
+                        oDDs[oDDs.length] = dd;
+                    }
+                }
+            }
+
+            return oDDs;
+        },
+
+        /**
+         * Returns true if the specified dd target is a legal target for
+         * the specifice drag obj
+         * @method isLegalTarget
+         * @param {DragDrop} oDD the drag obj
+         * @param {DragDrop} oTargetDD the target
+         * @return {boolean} true if the target is a legal target for the
+         * dd obj
+         * @static
+         */
+        isLegalTarget: function (oDD, oTargetDD) {
+            var targets = this.getRelated(oDD, true);
+            for (var i=0, len=targets.length;i<len;++i) {
+                if (targets[i].id == oTargetDD.id) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * My goal is to be able to transparently determine if an object is
+         * typeof DragDrop, and the exact subclass of DragDrop.  typeof
+         * returns "object", oDD.constructor.toString() always returns
+         * "DragDrop" and not the name of the subclass.  So for now it just
+         * evaluates a well-known variable in DragDrop.
+         * @method isTypeOfDD
+         * @param {Object} the object to evaluate
+         * @return {boolean} true if typeof oDD = DragDrop
+         * @static
+         */
+        isTypeOfDD: function (oDD) {
+            return (oDD && oDD.__ygDragDrop);
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop handle for the given Drag Drop object.
+         * @method isHandle
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop handle, false
+         * otherwise
+         * @static
+         */
+        isHandle: function(sDDId, sHandleId) {
+            return ( this.handleIds[sDDId] &&
+                            this.handleIds[sDDId][sHandleId] );
+        },
+
+        /**
+         * Returns the DragDrop instance for a given id
+         * @method getDDById
+         * @param {String} id the id of the DragDrop object
+         * @return {DragDrop} the drag drop object, null if it is not found
+         * @static
+         */
+        getDDById: function(id) {
+            for (var i in this.ids) {
+                if (this.ids[i][id]) {
+                    return this.ids[i][id];
+                }
+            }
+            return null;
+        },
+
+        /**
+         * Fired after a registered DragDrop object gets the mousedown event.
+         * Sets up the events required to track the object being dragged
+         * @method handleMouseDown
+         * @param {Event} e the event
+         * @param oDD the DragDrop object being dragged
+         * @private
+         * @static
+         */
+        handleMouseDown: function(e, oDD) {
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddDisable();
+            }
+            if(this.dragCurrent){
+                // the original browser mouseup wasn't handled (e.g. outside FF browser window)
+                // so clean up first to avoid breaking the next drag
+                this.handleMouseUp(e);
+            }
+            
+            this.currentTarget = e.getTarget();
+            this.dragCurrent = oDD;
+
+            var el = oDD.getEl();
+
+            // track start position
+            this.startX = e.getPageX();
+            this.startY = e.getPageY();
+
+            this.deltaX = this.startX - el.offsetLeft;
+            this.deltaY = this.startY - el.offsetTop;
+
+            this.dragThreshMet = false;
+
+            this.clickTimeout = setTimeout(
+                    function() {
+                        var DDM = Ext.dd.DDM;
+                        DDM.startDrag(DDM.startX, DDM.startY);
+                    },
+                    this.clickTimeThresh );
+        },
+
+        /**
+         * Fired when either the drag pixel threshol or the mousedown hold
+         * time threshold has been met.
+         * @method startDrag
+         * @param x {int} the X position of the original mousedown
+         * @param y {int} the Y position of the original mousedown
+         * @static
+         */
+        startDrag: function(x, y) {
+            clearTimeout(this.clickTimeout);
+            if (this.dragCurrent) {
+                this.dragCurrent.b4StartDrag(x, y);
+                this.dragCurrent.startDrag(x, y);
+            }
+            this.dragThreshMet = true;
+        },
+
+        /**
+         * Internal function to handle the mouseup event.  Will be invoked
+         * from the context of the document.
+         * @method handleMouseUp
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseUp: function(e) {
+
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddEnable();
+            }
+            if (! this.dragCurrent) {
+                return;
+            }
+
+            clearTimeout(this.clickTimeout);
+
+            if (this.dragThreshMet) {
+                this.fireEvents(e, true);
+            } else {
+            }
+
+            this.stopDrag(e);
+
+            this.stopEvent(e);
+        },
+
+        /**
+         * Utility to stop event propagation and event default, if these
+         * features are turned on.
+         * @method stopEvent
+         * @param {Event} e the event as returned by this.getEvent()
+         * @static
+         */
+        stopEvent: function(e){
+            if(this.stopPropagation) {
+                e.stopPropagation();
+            }
+
+            if (this.preventDefault) {
+                e.preventDefault();
+            }
+        },
+
+        /**
+         * Internal function to clean up event handlers after the drag
+         * operation is complete
+         * @method stopDrag
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        stopDrag: function(e) {
+            // Fire the drag end event for the item that was dragged
+            if (this.dragCurrent) {
+                if (this.dragThreshMet) {
+                    this.dragCurrent.b4EndDrag(e);
+                    this.dragCurrent.endDrag(e);
+                }
+
+                this.dragCurrent.onMouseUp(e);
+            }
+
+            this.dragCurrent = null;
+            this.dragOvers = {};
+        },
+
+        /**
+         * Internal function to handle the mousemove event.  Will be invoked
+         * from the context of the html element.
+         *
+         * @TODO figure out what we can do about mouse events lost when the
+         * user drags objects beyond the window boundary.  Currently we can
+         * detect this in internet explorer by verifying that the mouse is
+         * down during the mousemove event.  Firefox doesn't give us the
+         * button state on the mousemove event.
+         * @method handleMouseMove
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseMove: function(e) {
+            if (! this.dragCurrent) {
+                return true;
+            }
+            // var button = e.which || e.button;
+
+            // check for IE mouseup outside of page boundary
+            if (Ext.isIE && (e.button !== 0 && e.button !== 1 && e.button !== 2)) {
+                this.stopEvent(e);
+                return this.handleMouseUp(e);
+            }
+
+            if (!this.dragThreshMet) {
+                var diffX = Math.abs(this.startX - e.getPageX());
+                var diffY = Math.abs(this.startY - e.getPageY());
+                if (diffX > this.clickPixelThresh ||
+                            diffY > this.clickPixelThresh) {
+                    this.startDrag(this.startX, this.startY);
+                }
+            }
+
+            if (this.dragThreshMet) {
+                this.dragCurrent.b4Drag(e);
+                this.dragCurrent.onDrag(e);
+                if(!this.dragCurrent.moveOnly){
+                    this.fireEvents(e, false);
+                }
+            }
+
+            this.stopEvent(e);
+
+            return true;
+        },
+
+        /**
+         * Iterates over all of the DragDrop elements to find ones we are
+         * hovering over or dropping on
+         * @method fireEvents
+         * @param {Event} e the event
+         * @param {boolean} isDrop is this a drop op or a mouseover op?
+         * @private
+         * @static
+         */
+        fireEvents: function(e, isDrop) {
+            var dc = this.dragCurrent;
+
+            // If the user did the mouse up outside of the window, we could
+            // get here even though we have ended the drag.
+            if (!dc || dc.isLocked()) {
+                return;
+            }
+
+            var pt = e.getPoint();
+
+            // cache the previous dragOver array
+            var oldOvers = [];
+
+            var outEvts   = [];
+            var overEvts  = [];
+            var dropEvts  = [];
+            var enterEvts = [];
+
+            // Check to see if the object(s) we were hovering over is no longer
+            // being hovered over so we can fire the onDragOut event
+            for (var i in this.dragOvers) {
+
+                var ddo = this.dragOvers[i];
+
+                if (! this.isTypeOfDD(ddo)) {
+                    continue;
+                }
+
+                if (! this.isOverTarget(pt, ddo, this.mode)) {
+                    outEvts.push( ddo );
+                }
+
+                oldOvers[i] = true;
+                delete this.dragOvers[i];
+            }
+
+            for (var sGroup in dc.groups) {
+
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+
+                for (i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+
+                    if (oDD.isTarget && !oDD.isLocked() && ((oDD != dc) || (dc.ignoreSelf === false))) {
+                        if (this.isOverTarget(pt, oDD, this.mode)) {
+                            // look for drop interactions
+                            if (isDrop) {
+                                dropEvts.push( oDD );
+                            // look for drag enter and drag over interactions
+                            } else {
+
+                                // initial drag over: dragEnter fires
+                                if (!oldOvers[oDD.id]) {
+                                    enterEvts.push( oDD );
+                                // subsequent drag overs: dragOver fires
+                                } else {
+                                    overEvts.push( oDD );
+                                }
+
+                                this.dragOvers[oDD.id] = oDD;
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (this.mode) {
+                if (outEvts.length) {
+                    dc.b4DragOut(e, outEvts);
+                    dc.onDragOut(e, outEvts);
+                }
+
+                if (enterEvts.length) {
+                    dc.onDragEnter(e, enterEvts);
+                }
+
+                if (overEvts.length) {
+                    dc.b4DragOver(e, overEvts);
+                    dc.onDragOver(e, overEvts);
+                }
+
+                if (dropEvts.length) {
+                    dc.b4DragDrop(e, dropEvts);
+                    dc.onDragDrop(e, dropEvts);
+                }
+
+            } else {
+                // fire dragout events
+                var len = 0;
+                for (i=0, len=outEvts.length; i<len; ++i) {
+                    dc.b4DragOut(e, outEvts[i].id);
+                    dc.onDragOut(e, outEvts[i].id);
+                }
+
+                // fire enter events
+                for (i=0,len=enterEvts.length; i<len; ++i) {
+                    // dc.b4DragEnter(e, oDD.id);
+                    dc.onDragEnter(e, enterEvts[i].id);
+                }
+
+                // fire over events
+                for (i=0,len=overEvts.length; i<len; ++i) {
+                    dc.b4DragOver(e, overEvts[i].id);
+                    dc.onDragOver(e, overEvts[i].id);
+                }
+
+                // fire drop events
+                for (i=0, len=dropEvts.length; i<len; ++i) {
+                    dc.b4DragDrop(e, dropEvts[i].id);
+                    dc.onDragDrop(e, dropEvts[i].id);
+                }
+
+            }
+
+            // notify about a drop that did not find a target
+            if (isDrop && !dropEvts.length) {
+                dc.onInvalidDrop(e);
+            }
+
+        },
+
+        /**
+         * Helper function for getting the best match from the list of drag
+         * and drop objects returned by the drag and drop events when we are
+         * in INTERSECT mode.  It returns either the first object that the
+         * cursor is over, or the object that has the greatest overlap with
+         * the dragged element.
+         * @method getBestMatch
+         * @param  {DragDrop[]} dds The array of drag and drop objects
+         * targeted
+         * @return {DragDrop}       The best single match
+         * @static
+         */
+        getBestMatch: function(dds) {
+            var winner = null;
+            // Return null if the input is not what we expect
+            //if (!dds || !dds.length || dds.length == 0) {
+               // winner = null;
+            // If there is only one item, it wins
+            //} else if (dds.length == 1) {
+
+            var len = dds.length;
+
+            if (len == 1) {
+                winner = dds[0];
+            } else {
+                // Loop through the targeted items
+                for (var i=0; i<len; ++i) {
+                    var dd = dds[i];
+                    // If the cursor is over the object, it wins.  If the
+                    // cursor is over multiple matches, the first one we come
+                    // to wins.
+                    if (dd.cursorIsOver) {
+                        winner = dd;
+                        break;
+                    // Otherwise the object with the most overlap wins
+                    } else {
+                        if (!winner ||
+                            winner.overlap.getArea() < dd.overlap.getArea()) {
+                            winner = dd;
+                        }
+                    }
+                }
+            }
+
+            return winner;
+        },
+
+        /**
+         * Refreshes the cache of the top-left and bottom-right points of the
+         * drag and drop objects in the specified group(s).  This is in the
+         * format that is stored in the drag and drop instance, so typical
+         * usage is:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache(ddinstance.groups);
+         * </code>
+         * Alternatively:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache({group1:true, group2:true});
+         * </code>
+         * @TODO this really should be an indexed array.  Alternatively this
+         * method could accept both.
+         * @method refreshCache
+         * @param {Object} groups an associative array of groups to refresh
+         * @static
+         */
+        refreshCache: function(groups) {
+            for (var sGroup in groups) {
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+                for (var i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+
+                    if (this.isTypeOfDD(oDD)) {
+                    // if (this.isTypeOfDD(oDD) && oDD.isTarget) {
+                        var loc = this.getLocation(oDD);
+                        if (loc) {
+                            this.locationCache[oDD.id] = loc;
+                        } else {
+                            delete this.locationCache[oDD.id];
+                            // this will unregister the drag and drop object if
+                            // the element is not in a usable state
+                            // oDD.unreg();
+                        }
+                    }
+                }
+            }
+        },
+
+        /**
+         * This checks to make sure an element exists and is in the DOM.  The
+         * main purpose is to handle cases where innerHTML is used to remove
+         * drag and drop objects from the DOM.  IE provides an 'unspecified
+         * error' when trying to access the offsetParent of such an element
+         * @method verifyEl
+         * @param {HTMLElement} el the element to check
+         * @return {boolean} true if the element looks usable
+         * @static
+         */
+        verifyEl: function(el) {
+            if (el) {
+                var parent;
+                if(Ext.isIE){
+                    try{
+                        parent = el.offsetParent;
+                    }catch(e){}
+                }else{
+                    parent = el.offsetParent;
+                }
+                if (parent) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * Returns a Region object containing the drag and drop element's position
+         * and size, including the padding configured for it
+         * @method getLocation
+         * @param {DragDrop} oDD the drag and drop object to get the
+         *                       location for
+         * @return {Ext.lib.Region} a Region object representing the total area
+         *                             the element occupies, including any padding
+         *                             the instance is configured for.
+         * @static
+         */
+        getLocation: function(oDD) {
+            if (! this.isTypeOfDD(oDD)) {
+                return null;
+            }
+
+            var el = oDD.getEl(), pos, x1, x2, y1, y2, t, r, b, l, region;
+
+            try {
+                pos= Ext.lib.Dom.getXY(el);
+            } catch (e) { }
+
+            if (!pos) {
+                return null;
+            }
+
+            x1 = pos[0];
+            x2 = x1 + el.offsetWidth;
+            y1 = pos[1];
+            y2 = y1 + el.offsetHeight;
+
+            t = y1 - oDD.padding[0];
+            r = x2 + oDD.padding[1];
+            b = y2 + oDD.padding[2];
+            l = x1 - oDD.padding[3];
+
+            region = new Ext.lib.Region( t, r, b, l );
+            /*
+             * The code below is to ensure that large scrolling elements will
+             * only have their visible area recognized as a drop target, otherwise it 
+             * can potentially erronously register as a target when the element scrolls
+             * over the top of something below it.
+             */
+            el = Ext.get(el.parentNode);
+            while (el && region) {
+	            if (el.isScrollable()) {
+	                // check whether our element is visible in the view port:
+	                region = region.intersect(el.getRegion());
+	            }
+	            el = el.parent();
+            }
+            return region;
+        },
+
+        /**
+         * Checks the cursor location to see if it over the target
+         * @method isOverTarget
+         * @param {Ext.lib.Point} pt The point to evaluate
+         * @param {DragDrop} oTarget the DragDrop object we are inspecting
+         * @return {boolean} true if the mouse is over the target
+         * @private
+         * @static
+         */
+        isOverTarget: function(pt, oTarget, intersect) {
+            // use cache if available
+            var loc = this.locationCache[oTarget.id];
+            if (!loc || !this.useCache) {
+                loc = this.getLocation(oTarget);
+                this.locationCache[oTarget.id] = loc;
+
+            }
+
+            if (!loc) {
+                return false;
+            }
+
+            oTarget.cursorIsOver = loc.contains( pt );
+
+            // DragDrop is using this as a sanity check for the initial mousedown
+            // in this case we are done.  In POINT mode, if the drag obj has no
+            // contraints, we are also done. Otherwise we need to evaluate the
+            // location of the target as related to the actual location of the
+            // dragged element.
+            var dc = this.dragCurrent;
+            if (!dc || !dc.getTargetCoord ||
+                    (!intersect && !dc.constrainX && !dc.constrainY)) {
+                return oTarget.cursorIsOver;
+            }
+
+            oTarget.overlap = null;
+
+            // Get the current location of the drag element, this is the
+            // location of the mouse event less the delta that represents
+            // where the original mousedown happened on the element.  We
+            // need to consider constraints and ticks as well.
+            var pos = dc.getTargetCoord(pt.x, pt.y);
+
+            var el = dc.getDragEl();
+            var curRegion = new Ext.lib.Region( pos.y,
+                                                   pos.x + el.offsetWidth,
+                                                   pos.y + el.offsetHeight,
+                                                   pos.x );
+
+            var overlap = curRegion.intersect(loc);
+
+            if (overlap) {
+                oTarget.overlap = overlap;
+                return (intersect) ? true : oTarget.cursorIsOver;
+            } else {
+                return false;
+            }
+        },
+
+        /**
+         * unload event handler
+         * @method _onUnload
+         * @private
+         * @static
+         */
+        _onUnload: function(e, me) {
+            Event.removeListener(document, "mouseup",   this.handleMouseUp, this);
+            Event.removeListener(document, "mousemove", this.handleMouseMove, this);
+            Event.removeListener(window,   "resize",    this._onResize, this);
+            Ext.dd.DragDropMgr.unregAll();
+        },
+
+        /**
+         * Cleans up the drag and drop events and objects.
+         * @method unregAll
+         * @private
+         * @static
+         */
+        unregAll: function() {
+
+            if (this.dragCurrent) {
+                this.stopDrag();
+                this.dragCurrent = null;
+            }
+
+            this._execOnAll("unreg", []);
+
+            for (var i in this.elementCache) {
+                delete this.elementCache[i];
+            }
+
+            this.elementCache = {};
+            this.ids = {};
+        },
+
+        /**
+         * A cache of DOM elements
+         * @property elementCache
+         * @private
+         * @static
+         */
+        elementCache: {},
+
+        /**
+         * Get the wrapper for the DOM element specified
+         * @method getElWrapper
+         * @param {String} id the id of the element to get
+         * @return {Ext.dd.DDM.ElementWrapper} the wrapped element
+         * @private
+         * @deprecated This wrapper isn't that useful
+         * @static
+         */
+        getElWrapper: function(id) {
+            var oWrapper = this.elementCache[id];
+            if (!oWrapper || !oWrapper.el) {
+                oWrapper = this.elementCache[id] =
+                    new this.ElementWrapper(Ext.getDom(id));
+            }
+            return oWrapper;
+        },
+
+        /**
+         * Returns the actual DOM element
+         * @method getElement
+         * @param {String} id the id of the elment to get
+         * @return {Object} The element
+         * @deprecated use Ext.lib.Ext.getDom instead
+         * @static
+         */
+        getElement: function(id) {
+            return Ext.getDom(id);
+        },
+
+        /**
+         * Returns the style property for the DOM element (i.e.,
+         * document.getElById(id).style)
+         * @method getCss
+         * @param {String} id the id of the elment to get
+         * @return {Object} The style property of the element
+         * @deprecated use Ext.lib.Dom instead
+         * @static
+         */
+        getCss: function(id) {
+            var el = Ext.getDom(id);
+            return (el) ? el.style : null;
+        },
+
+        /**
+         * Inner class for cached elements
+         * @class Ext.dd.DragDropMgr.ElementWrapper
+         * @for DragDropMgr
+         * @private
+         * @deprecated
+         */
+        ElementWrapper: function(el) {
+                /**
+                 * The element
+                 * @property el
+                 */
+                this.el = el || null;
+                /**
+                 * The element id
+                 * @property id
+                 */
+                this.id = this.el && el.id;
+                /**
+                 * A reference to the style property
+                 * @property css
+                 */
+                this.css = this.el && el.style;
+            },
+
+        /**
+         * Returns the X position of an html element
+         * @method getPosX
+         * @param el the element for which to get the position
+         * @return {int} the X coordinate
+         * @for DragDropMgr
+         * @deprecated use Ext.lib.Dom.getX instead
+         * @static
+         */
+        getPosX: function(el) {
+            return Ext.lib.Dom.getX(el);
+        },
+
+        /**
+         * Returns the Y position of an html element
+         * @method getPosY
+         * @param el the element for which to get the position
+         * @return {int} the Y coordinate
+         * @deprecated use Ext.lib.Dom.getY instead
+         * @static
+         */
+        getPosY: function(el) {
+            return Ext.lib.Dom.getY(el);
+        },
+
+        /**
+         * Swap two nodes.  In IE, we use the native method, for others we
+         * emulate the IE behavior
+         * @method swapNode
+         * @param n1 the first node to swap
+         * @param n2 the other node to swap
+         * @static
+         */
+        swapNode: function(n1, n2) {
+            if (n1.swapNode) {
+                n1.swapNode(n2);
+            } else {
+                var p = n2.parentNode;
+                var s = n2.nextSibling;
+
+                if (s == n1) {
+                    p.insertBefore(n1, n2);
+                } else if (n2 == n1.nextSibling) {
+                    p.insertBefore(n2, n1);
+                } else {
+                    n1.parentNode.replaceChild(n2, n1);
+                    p.insertBefore(n1, s);
+                }
+            }
+        },
+
+        /**
+         * Returns the current scroll position
+         * @method getScroll
+         * @private
+         * @static
+         */
+        getScroll: function () {
+            var t, l, dde=document.documentElement, db=document.body;
+            if (dde && (dde.scrollTop || dde.scrollLeft)) {
+                t = dde.scrollTop;
+                l = dde.scrollLeft;
+            } else if (db) {
+                t = db.scrollTop;
+                l = db.scrollLeft;
+            } else {
+
+            }
+            return { top: t, left: l };
+        },
+
+        /**
+         * Returns the specified element style property
+         * @method getStyle
+         * @param {HTMLElement} el          the element
+         * @param {string}      styleProp   the style property
+         * @return {string} The value of the style property
+         * @deprecated use Ext.lib.Dom.getStyle
+         * @static
+         */
+        getStyle: function(el, styleProp) {
+            return Ext.fly(el).getStyle(styleProp);
+        },
+
+        /**
+         * Gets the scrollTop
+         * @method getScrollTop
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollTop: function () {
+            return this.getScroll().top;
+        },
+
+        /**
+         * Gets the scrollLeft
+         * @method getScrollLeft
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollLeft: function () {
+            return this.getScroll().left;
+        },
+
+        /**
+         * Sets the x/y position of an element to the location of the
+         * target element.
+         * @method moveToEl
+         * @param {HTMLElement} moveEl      The element to move
+         * @param {HTMLElement} targetEl    The position reference element
+         * @static
+         */
+        moveToEl: function (moveEl, targetEl) {
+            var aCoord = Ext.lib.Dom.getXY(targetEl);
+            Ext.lib.Dom.setXY(moveEl, aCoord);
+        },
+
+        /**
+         * Numeric array sort function
+         * @method numericSort
+         * @static
+         */
+        numericSort: function(a, b) {
+            return (a - b);
+        },
+
+        /**
+         * Internal counter
+         * @property _timeoutCount
+         * @private
+         * @static
+         */
+        _timeoutCount: 0,
+
+        /**
+         * Trying to make the load order less important.  Without this we get
+         * an error if this file is loaded before the Event Utility.
+         * @method _addListeners
+         * @private
+         * @static
+         */
+        _addListeners: function() {
+            var DDM = Ext.dd.DDM;
+            if ( Ext.lib.Event && document ) {
+                DDM._onLoad();
+            } else {
+                if (DDM._timeoutCount > 2000) {
+                } else {
+                    setTimeout(DDM._addListeners, 10);
+                    if (document && document.body) {
+                        DDM._timeoutCount += 1;
+                    }
+                }
+            }
+        },
+
+        /**
+         * Recursively searches the immediate parent and all child nodes for
+         * the handle element in order to determine wheter or not it was
+         * clicked.
+         * @method handleWasClicked
+         * @param node the html element to inspect
+         * @static
+         */
+        handleWasClicked: function(node, id) {
+            if (this.isHandle(id, node.id)) {
+                return true;
+            } else {
+                // check to see if this is a text node child of the one we want
+                var p = node.parentNode;
+
+                while (p) {
+                    if (this.isHandle(id, p.id)) {
+                        return true;
+                    } else {
+                        p = p.parentNode;
+                    }
+                }
+            }
+
+            return false;
+        }
+
+    };
+
+}();
+
+// shorter alias, save a few bytes
+Ext.dd.DDM = Ext.dd.DragDropMgr;
+Ext.dd.DDM._addListeners();
+
+}
+
+/**
+ * @class Ext.dd.DD
+ * A DragDrop implementation where the linked element follows the
+ * mouse cursor during a drag.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DD:
+ *                    scroll
+ */
+Ext.dd.DD = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.extend(Ext.dd.DD, Ext.dd.DragDrop, {
+
+    /**
+     * When set to true, the utility automatically tries to scroll the browser
+     * window when a drag and drop element is dragged near the viewport boundary.
+     * Defaults to true.
+     * @property scroll
+     * @type boolean
+     */
+    scroll: true,
+
+    /**
+     * Sets the pointer offset to the distance between the linked element's top
+     * left corner and the location the element was clicked
+     * @method autoOffset
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     */
+    autoOffset: function(iPageX, iPageY) {
+        var x = iPageX - this.startPageX;
+        var y = iPageY - this.startPageY;
+        this.setDelta(x, y);
+    },
+
+    /**
+     * Sets the pointer offset.  You can call this directly to force the
+     * offset to be in a particular location (e.g., pass in 0,0 to set it
+     * to the center of the object)
+     * @method setDelta
+     * @param {int} iDeltaX the distance from the left
+     * @param {int} iDeltaY the distance from the top
+     */
+    setDelta: function(iDeltaX, iDeltaY) {
+        this.deltaX = iDeltaX;
+        this.deltaY = iDeltaY;
+    },
+
+    /**
+     * Sets the drag element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method setDragElPos
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    setDragElPos: function(iPageX, iPageY) {
+        // the first time we do this, we are going to check to make sure
+        // the element has css positioning
+
+        var el = this.getDragEl();
+        this.alignElWithMouse(el, iPageX, iPageY);
+    },
+
+    /**
+     * Sets the element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method alignElWithMouse
+     * @param {HTMLElement} el the element to move
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    alignElWithMouse: function(el, iPageX, iPageY) {
+        var oCoord = this.getTargetCoord(iPageX, iPageY);
+        var fly = el.dom ? el : Ext.fly(el, '_dd');
+        if (!this.deltaSetXY) {
+            var aCoord = [oCoord.x, oCoord.y];
+            fly.setXY(aCoord);
+            var newLeft = fly.getLeft(true);
+            var newTop  = fly.getTop(true);
+            this.deltaSetXY = [ newLeft - oCoord.x, newTop - oCoord.y ];
+        } else {
+            fly.setLeftTop(oCoord.x + this.deltaSetXY[0], oCoord.y + this.deltaSetXY[1]);
+        }
+
+        this.cachePosition(oCoord.x, oCoord.y);
+        this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth);
+        return oCoord;
+    },
+
+    /**
+     * Saves the most recent position so that we can reset the constraints and
+     * tick marks on-demand.  We need to know this so that we can calculate the
+     * number of pixels the element is offset from its original position.
+     * @method cachePosition
+     * @param iPageX the current x position (optional, this just makes it so we
+     * don't have to look it up again)
+     * @param iPageY the current y position (optional, this just makes it so we
+     * don't have to look it up again)
+     */
+    cachePosition: function(iPageX, iPageY) {
+        if (iPageX) {
+            this.lastPageX = iPageX;
+            this.lastPageY = iPageY;
+        } else {
+            var aCoord = Ext.lib.Dom.getXY(this.getEl());
+            this.lastPageX = aCoord[0];
+            this.lastPageY = aCoord[1];
+        }
+    },
+
+    /**
+     * Auto-scroll the window if the dragged object has been moved beyond the
+     * visible window boundary.
+     * @method autoScroll
+     * @param {int} x the drag element's x position
+     * @param {int} y the drag element's y position
+     * @param {int} h the height of the drag element
+     * @param {int} w the width of the drag element
+     * @private
+     */
+    autoScroll: function(x, y, h, w) {
+
+        if (this.scroll) {
+            // The client height
+            var clientH = Ext.lib.Dom.getViewHeight();
+
+            // The client width
+            var clientW = Ext.lib.Dom.getViewWidth();
+
+            // The amt scrolled down
+            var st = this.DDM.getScrollTop();
+
+            // The amt scrolled right
+            var sl = this.DDM.getScrollLeft();
+
+            // Location of the bottom of the element
+            var bot = h + y;
+
+            // Location of the right of the element
+            var right = w + x;
+
+            // The distance from the cursor to the bottom of the visible area,
+            // adjusted so that we don't scroll if the cursor is beyond the
+            // element drag constraints
+            var toBot = (clientH + st - y - this.deltaY);
+
+            // The distance from the cursor to the right of the visible area
+            var toRight = (clientW + sl - x - this.deltaX);
+
+
+            // How close to the edge the cursor must be before we scroll
+            // var thresh = (document.all) ? 100 : 40;
+            var thresh = 40;
+
+            // How many pixels to scroll per autoscroll op.  This helps to reduce
+            // clunky scrolling. IE is more sensitive about this ... it needs this
+            // value to be higher.
+            var scrAmt = (document.all) ? 80 : 30;
+
+            // Scroll down if we are near the bottom of the visible page and the
+            // obj extends below the crease
+            if ( bot > clientH && toBot < thresh ) {
+                window.scrollTo(sl, st + scrAmt);
+            }
+
+            // Scroll up if the window is scrolled down and the top of the object
+            // goes above the top border
+            if ( y < st && st > 0 && y - st < thresh ) {
+                window.scrollTo(sl, st - scrAmt);
+            }
+
+            // Scroll right if the obj is beyond the right border and the cursor is
+            // near the border.
+            if ( right > clientW && toRight < thresh ) {
+                window.scrollTo(sl + scrAmt, st);
+            }
+
+            // Scroll left if the window has been scrolled to the right and the obj
+            // extends past the left border
+            if ( x < sl && sl > 0 && x - sl < thresh ) {
+                window.scrollTo(sl - scrAmt, st);
+            }
+        }
+    },
+
+    /**
+     * Finds the location the element should be placed if we want to move
+     * it to where the mouse location less the click offset would place us.
+     * @method getTargetCoord
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     * @return an object that contains the coordinates (Object.x and Object.y)
+     * @private
+     */
+    getTargetCoord: function(iPageX, iPageY) {
+        var x = iPageX - this.deltaX;
+        var y = iPageY - this.deltaY;
+
+        if (this.constrainX) {
+            if (x < this.minX) { x = this.minX; }
+            if (x > this.maxX) { x = this.maxX; }
+        }
+
+        if (this.constrainY) {
+            if (y < this.minY) { y = this.minY; }
+            if (y > this.maxY) { y = this.maxY; }
+        }
+
+        x = this.getTick(x, this.xTicks);
+        y = this.getTick(y, this.yTicks);
+
+
+        return {x:x, y:y};
+    },
+
+    /**
+     * Sets up config options specific to this class. Overrides
+     * Ext.dd.DragDrop, but all versions of this method through the
+     * inheritance chain are called
+     */
+    applyConfig: function() {
+        Ext.dd.DD.superclass.applyConfig.call(this);
+        this.scroll = (this.config.scroll !== false);
+    },
+
+    /**
+     * Event that fires prior to the onMouseDown event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4MouseDown: function(e) {
+        // this.resetConstraints();
+        this.autoOffset(e.getPageX(),
+                            e.getPageY());
+    },
+
+    /**
+     * Event that fires prior to the onDrag event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4Drag: function(e) {
+        this.setDragElPos(e.getPageX(),
+                            e.getPageY());
+    },
+
+    toString: function() {
+        return ("DD " + this.id);
+    }
+
+    //////////////////////////////////////////////////////////////////////////
+    // Debugging ygDragDrop events that can be overridden
+    //////////////////////////////////////////////////////////////////////////
+    /*
+    startDrag: function(x, y) {
+    },
+
+    onDrag: function(e) {
+    },
+
+    onDragEnter: function(e, id) {
+    },
+
+    onDragOver: function(e, id) {
+    },
+
+    onDragOut: function(e, id) {
+    },
+
+    onDragDrop: function(e, id) {
+    },
+
+    endDrag: function(e) {
+    }
+
+    */
+
+});
+/**
+ * @class Ext.dd.DDProxy
+ * A DragDrop implementation that inserts an empty, bordered div into
+ * the document that follows the cursor during drag operations.  At the time of
+ * the click, the frame div is resized to the dimensions of the linked html
+ * element, and moved to the exact location of the linked element.
+ *
+ * References to the "frame" element refer to the single proxy element that
+ * was created to be dragged in place of all DDProxy elements on the
+ * page.
+ *
+ * @extends Ext.dd.DD
+ * @constructor
+ * @param {String} id the id of the linked html element
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DDProxy in addition to those in DragDrop:
+ *                   resizeFrame, centerFrame, dragElId
+ */
+Ext.dd.DDProxy = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+    }
+};
+
+/**
+ * The default drag frame div id
+ * @property Ext.dd.DDProxy.dragElId
+ * @type String
+ * @static
+ */
+Ext.dd.DDProxy.dragElId = "ygddfdiv";
+
+Ext.extend(Ext.dd.DDProxy, Ext.dd.DD, {
+
+    /**
+     * By default we resize the drag frame to be the same size as the element
+     * we want to drag (this is to get the frame effect).  We can turn it off
+     * if we want a different behavior.
+     * @property resizeFrame
+     * @type boolean
+     */
+    resizeFrame: true,
+
+    /**
+     * By default the frame is positioned exactly where the drag element is, so
+     * we use the cursor offset provided by Ext.dd.DD.  Another option that works only if
+     * you do not have constraints on the obj is to have the drag frame centered
+     * around the cursor.  Set centerFrame to true for this effect.
+     * @property centerFrame
+     * @type boolean
+     */
+    centerFrame: false,
+
+    /**
+     * Creates the proxy element if it does not yet exist
+     * @method createFrame
+     */
+    createFrame: function() {
+        var self = this;
+        var body = document.body;
+
+        if (!body || !body.firstChild) {
+            setTimeout( function() { self.createFrame(); }, 50 );
+            return;
+        }
+
+        var div = this.getDragEl();
+
+        if (!div) {
+            div    = document.createElement("div");
+            div.id = this.dragElId;
+            var s  = div.style;
+
+            s.position   = "absolute";
+            s.visibility = "hidden";
+            s.cursor     = "move";
+            s.border     = "2px solid #aaa";
+            s.zIndex     = 999;
+
+            // appendChild can blow up IE if invoked prior to the window load event
+            // while rendering a table.  It is possible there are other scenarios
+            // that would cause this to happen as well.
+            body.insertBefore(div, body.firstChild);
+        }
+    },
+
+    /**
+     * Initialization for the drag frame element.  Must be called in the
+     * constructor of all subclasses
+     * @method initFrame
+     */
+    initFrame: function() {
+        this.createFrame();
+    },
+
+    applyConfig: function() {
+        Ext.dd.DDProxy.superclass.applyConfig.call(this);
+
+        this.resizeFrame = (this.config.resizeFrame !== false);
+        this.centerFrame = (this.config.centerFrame);
+        this.setDragElId(this.config.dragElId || Ext.dd.DDProxy.dragElId);
+    },
+
+    /**
+     * Resizes the drag frame to the dimensions of the clicked object, positions
+     * it over the object, and finally displays it
+     * @method showFrame
+     * @param {int} iPageX X click position
+     * @param {int} iPageY Y click position
+     * @private
+     */
+    showFrame: function(iPageX, iPageY) {
+        var el = this.getEl();
+        var dragEl = this.getDragEl();
+        var s = dragEl.style;
+
+        this._resizeProxy();
+
+        if (this.centerFrame) {
+            this.setDelta( Math.round(parseInt(s.width,  10)/2),
+                           Math.round(parseInt(s.height, 10)/2) );
+        }
+
+        this.setDragElPos(iPageX, iPageY);
+
+        Ext.fly(dragEl).show();
+    },
+
+    /**
+     * The proxy is automatically resized to the dimensions of the linked
+     * element when a drag is initiated, unless resizeFrame is set to false
+     * @method _resizeProxy
+     * @private
+     */
+    _resizeProxy: function() {
+        if (this.resizeFrame) {
+            var el = this.getEl();
+            Ext.fly(this.getDragEl()).setSize(el.offsetWidth, el.offsetHeight);
+        }
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4MouseDown: function(e) {
+        var x = e.getPageX();
+        var y = e.getPageY();
+        this.autoOffset(x, y);
+        this.setDragElPos(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4StartDrag: function(x, y) {
+        // show the drag frame
+        this.showFrame(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4EndDrag: function(e) {
+        Ext.fly(this.getDragEl()).hide();
+    },
+
+    // overrides Ext.dd.DragDrop
+    // By default we try to move the element to the last location of the frame.
+    // This is so that the default behavior mirrors that of Ext.dd.DD.
+    endDrag: function(e) {
+
+        var lel = this.getEl();
+        var del = this.getDragEl();
+
+        // Show the drag frame briefly so we can get its position
+        del.style.visibility = "";
+
+        this.beforeMove();
+        // Hide the linked element before the move to get around a Safari
+        // rendering bug.
+        lel.style.visibility = "hidden";
+        Ext.dd.DDM.moveToEl(lel, del);
+        del.style.visibility = "hidden";
+        lel.style.visibility = "";
+
+        this.afterDrag();
+    },
+
+    beforeMove : function(){
+
+    },
+
+    afterDrag : function(){
+
+    },
+
+    toString: function() {
+        return ("DDProxy " + this.id);
+    }
+
+});
+/**
+ * @class Ext.dd.DDTarget
+ * A DragDrop implementation that does not move, but can be a drop
+ * target.  You would get the same result by simply omitting implementation
+ * for the event callbacks, but this way we reduce the processing cost of the
+ * event listener and the callbacks.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the element that is a drop target
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                 Valid properties for DDTarget in addition to those in
+ *                 DragDrop:
+ *                    none
+ */
+Ext.dd.DDTarget = function(id, sGroup, config) {
+    if (id) {
+        this.initTarget(id, sGroup, config);
+    }
+};
+
+// Ext.dd.DDTarget.prototype = new Ext.dd.DragDrop();
+Ext.extend(Ext.dd.DDTarget, Ext.dd.DragDrop, {
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    getDragEl: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    isValidHandleChild: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    startDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    endDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragEnter: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOut: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOver: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onInvalidDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseDown: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseUp: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setXConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setYConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    resetConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearTicks: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setInitPosition: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setDragElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setOuterHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleType: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleType: Ext.emptyFn,
+
+    toString: function() {
+        return ("DDTarget " + this.id);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/dd/DropZone.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/dd/DropZone.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/dd/DropZone.js	(revision 76)
@@ -0,0 +1,262 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.dd.DropZone
+ * @extends Ext.dd.DropTarget
+ * <p>This class provides a container DD instance that allows dropping on multiple child target nodes.</p>
+ * <p>By default, this class requires that child nodes accepting drop are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DropZone to manage any number of target elements is to configure the
+ * DropZone with an implementation of {@link #getTargetFromEvent} which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector.</p>
+ * <p>Once the DropZone has detected through calling getTargetFromEvent, that the mouse is over
+ * a drop target, that target is passed as the first parameter to {@link #onNodeEnter}, {@link #onNodeOver},
+ * {@link #onNodeOut}, {@link #onNodeDrop}. You may configure the instance of DropZone with implementations
+ * of these methods to provide application-specific behaviour for these events to update both
+ * application state, and UI state.</p>
+ * <p>For example to make a GridPanel a cooperating target with the example illustrated in
+ * {@link Ext.dd.DragZone DragZone}, the following technique might be used:</p><pre><code>
+myGridPanel.on('render', function() {
+    myGridPanel.dropZone = new Ext.dd.DropZone(myGridPanel.getView().scroller, {
+
+//      If the mouse is over a grid row, return that node. This is
+//      provided as the "target" parameter in all "onNodeXXXX" node event handling functions
+        getTargetFromEvent: function(e) {
+            return e.getTarget(myGridPanel.getView().rowSelector);
+        },
+
+//      On entry into a target node, highlight that node.
+        onNodeEnter : function(target, dd, e, data){ 
+            Ext.fly(target).addClass('my-row-highlight-class');
+        },
+
+//      On exit from a target node, unhighlight that node.
+        onNodeOut : function(target, dd, e, data){ 
+            Ext.fly(target).removeClass('my-row-highlight-class');
+        },
+
+//      While over a target node, return the default drop allowed class which
+//      places a "tick" icon into the drag proxy.
+        onNodeOver : function(target, dd, e, data){ 
+            return Ext.dd.DropZone.prototype.dropAllowed;
+        },
+
+//      On node drop we can interrogate the target to find the underlying
+//      application object that is the real target of the dragged data.
+//      In this case, it is a Record in the GridPanel's Store.
+//      We can use the data set up by the DragZone's getDragData method to read
+//      any data we decided to attach in the DragZone's getDragData method.
+        onNodeDrop : function(target, dd, e, data){
+            var rowIndex = myGridPanel.getView().findRowIndex(target);
+            var r = myGridPanel.getStore().getAt(rowIndex);
+            Ext.Msg.alert('Drop gesture', 'Dropped Record id ' + data.draggedRecord.id +
+                ' on Record id ' + r.id);
+            return true;
+        }
+    });
+}
+</code></pre>
+ * See the {@link Ext.dd.DragZone DragZone} documentation for details about building a DragZone which
+ * cooperates with this DropZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropZone = function(el, config){
+    Ext.dd.DropZone.superclass.constructor.call(this, el, config);
+};
+
+Ext.extend(Ext.dd.DropZone, Ext.dd.DropTarget, {
+    /**
+     * Returns a custom data object associated with the DOM node that is the target of the event.  By default
+     * this looks up the event target in the {@link Ext.dd.Registry}, although you can override this method to
+     * provide your own custom lookup.
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+    getTargetFromEvent : function(e){
+        return Ext.dd.Registry.getTargetFromEvent(e);
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has entered a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from 
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeEnter : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is over a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * The default implementation returns this.dropNotAllowed, so it should be
+     * overridden to provide the proper feedback.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onNodeOver : function(n, dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dragged out of
+     * the drop node without dropping.  This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeOut : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped onto
+     * the drop node.  The default implementation returns false, so it should be overridden to provide the
+     * appropriate processing of the drop event and return true so that the drag source's repair action does not run.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onNodeDrop : function(n, dd, e, data){
+        return false;
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is being dragged over it,
+     * but not over any of its registered drop nodes.  The default implementation returns this.dropNotAllowed, so
+     * it should be overridden to provide the proper feedback if necessary.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onContainerOver : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped on it,
+     * but not on any of its registered drop nodes.  The default implementation returns false, so it should be
+     * overridden to provide the appropriate processing of the drop event if you need the drop zone itself to
+     * be able to accept drops.  It should return true when valid so that the drag source's repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onContainerDrop : function(dd, e, data){
+        return false;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source is now over
+     * the zone.  The default implementation returns this.dropNotAllowed and expects that only registered drop
+     * nodes can process drag drop operations, so if you need the drop zone itself to be able to process drops
+     * you should override this method and provide a custom implementation.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the drop zone.
+     * This method will be called on every mouse movement while the drag source is over the drop zone.
+     * It will call {@link #onNodeOver} while the drag source is over a registered node, and will also automatically
+     * delegate to the appropriate node-specific methods as necessary when the drag source enters and exits
+     * registered nodes ({@link #onNodeEnter}, {@link #onNodeOut}). If the drag source is not currently over a
+     * registered node, it will call {@link #onContainerOver}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        var n = this.getTargetFromEvent(e);
+        if(!n){ // not over valid drop target
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+                this.lastOverNode = null;
+            }
+            return this.onContainerOver(dd, e, data);
+        }
+        if(this.lastOverNode != n){
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+            }
+            this.onNodeEnter(n, dd, e, data);
+            this.lastOverNode = n;
+        }
+        return this.onNodeOver(n, dd, e, data);
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source has been dragged
+     * out of the zone without dropping.  If the drag source is currently over a registered node, the notification
+     * will be delegated to {@link #onNodeOut} for node-specific handling, otherwise it will be ignored.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag zone
+     */
+    notifyOut : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the dragged item has
+     * been dropped on it.  The drag zone will look up the target node based on the event passed in, and if there
+     * is a node registered for that event, it will delegate to {@link #onNodeDrop} for node-specific handling,
+     * otherwise it will call {@link #onContainerDrop}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+        var n = this.getTargetFromEvent(e);
+        return n ?
+            this.onNodeDrop(n, dd, e, data) :
+            this.onContainerDrop(dd, e, data);
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    }  
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.fx-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.fx-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.fx-more.js	(revision 76)
@@ -0,0 +1,162 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+    function() {
+        var VISIBILITY      = "visibility",
+            DISPLAY         = "display",
+            HIDDEN          = "hidden",
+            NONE            = "none",
+            XMASKED         = "x-masked",
+            XMASKEDRELATIVE = "x-masked-relative",
+            data            = Ext.Element.data;
+
+        return {
+            /**
+             * Checks whether the element is currently visible using both visibility and display properties.
+             * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)
+             * @return {Boolean} True if the element is currently visible, else false
+             */
+            isVisible : function(deep) {
+                var vis = !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE),
+                    p   = this.dom.parentNode;
+                
+                if (deep !== true || !vis) {
+                    return vis;
+                }
+                
+                while (p && !(/^body/i.test(p.tagName))) {
+                    if (!Ext.fly(p, '_isVisible').isVisible()) {
+                        return false;
+                    }
+                    p = p.parentNode;
+                }
+                return true;
+            },
+
+            /**
+             * Returns true if display is not "none"
+             * @return {Boolean}
+             */
+            isDisplayed : function() {
+                return !this.isStyle(DISPLAY, NONE);
+            },
+
+            /**
+             * Convenience method for setVisibilityMode(Element.DISPLAY)
+             * @param {String} display (optional) What to set display to when visible
+             * @return {Ext.Element} this
+             */
+            enableDisplayMode : function(display) {
+                this.setVisibilityMode(Ext.Element.DISPLAY);
+                
+                if (!Ext.isEmpty(display)) {
+                    data(this.dom, 'originalDisplay', display);
+                }
+                
+                return this;
+            },
+
+            /**
+             * Puts a mask over this element to disable user interaction. Requires core.css.
+             * This method can only be applied to elements which accept child nodes.
+             * @param {String} msg (optional) A message to display in the mask
+             * @param {String} msgCls (optional) A css class to apply to the msg element
+             * @return {Element} The mask element
+             */
+            mask : function(msg, msgCls) {
+                var me  = this,
+                    dom = me.dom,
+                    dh  = Ext.DomHelper,
+                    EXTELMASKMSG = "ext-el-mask-msg",
+                    el,
+                    mask;
+
+                if (!/^body/i.test(dom.tagName) && me.getStyle('position') == 'static') {
+                    me.addClass(XMASKEDRELATIVE);
+                }
+                if (el = data(dom, 'maskMsg')) {
+                    el.remove();
+                }
+                if (el = data(dom, 'mask')) {
+                    el.remove();
+                }
+
+                mask = dh.append(dom, {cls : "ext-el-mask"}, true);
+                data(dom, 'mask', mask);
+
+                me.addClass(XMASKED);
+                mask.setDisplayed(true);
+                
+                if (typeof msg == 'string') {
+                    var mm = dh.append(dom, {cls : EXTELMASKMSG, cn:{tag:'div'}}, true);
+                    data(dom, 'maskMsg', mm);
+                    mm.dom.className = msgCls ? EXTELMASKMSG + " " + msgCls : EXTELMASKMSG;
+                    mm.dom.firstChild.innerHTML = msg;
+                    mm.setDisplayed(true);
+                    mm.center(me);
+                }
+                
+                // ie will not expand full height automatically
+                if (Ext.isIE && !(Ext.isIE7 && Ext.isStrict) && me.getStyle('height') == 'auto') {
+                    mask.setSize(undefined, me.getHeight());
+                }
+                
+                return mask;
+            },
+
+            /**
+             * Removes a previously applied mask.
+             */
+            unmask : function() {
+                var me      = this,
+                    dom     = me.dom,
+                    mask    = data(dom, 'mask'),
+                    maskMsg = data(dom, 'maskMsg');
+
+                if (mask) {
+                    if (maskMsg) {
+                        maskMsg.remove();
+                        data(dom, 'maskMsg', undefined);
+                    }
+                    
+                    mask.remove();
+                    data(dom, 'mask', undefined);
+                    me.removeClass([XMASKED, XMASKEDRELATIVE]);
+                }
+            },
+
+            /**
+             * Returns true if this element is masked
+             * @return {Boolean}
+             */
+            isMasked : function() {
+                var m = data(this.dom, 'mask');
+                return m && m.isVisible();
+            },
+
+            /**
+             * Creates an iframe shim for this element to keep selects and other windowed objects from
+             * showing through.
+             * @return {Ext.Element} The new shim element
+             */
+            createShim : function() {
+                var el = document.createElement('iframe'),
+                    shim;
+                
+                el.frameBorder = '0';
+                el.className = 'ext-shim';
+                el.src = Ext.SSL_SECURE_URL;
+                shim = Ext.get(this.dom.parentNode.insertBefore(el, this.dom));
+                shim.autoBoxAdjust = false;
+                return shim;
+            }
+        };
+    }()
+);
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.alignment.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.alignment.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.alignment.js	(revision 76)
@@ -0,0 +1,417 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Gets the x,y coordinates specified by the anchor position on the element.
+     * @param {String} anchor (optional) The specified anchor position (defaults to "c").  See {@link #alignTo}
+     * for details on supported anchor positions.
+     * @param {Boolean} local (optional) True to get the local (element top/left-relative) anchor position instead
+     * of page coordinates
+     * @param {Object} size (optional) An object containing the size to use for calculating anchor position
+     * {width: (target width), height: (target height)} (defaults to the element's current size)
+     * @return {Array} [x, y] An array containing the element's x and y coordinates
+     */
+    getAnchorXY : function(anchor, local, s){
+        //Passing a different size is useful for pre-calculating anchors,
+        //especially for anchored animations that change the el size.
+		anchor = (anchor || "tl").toLowerCase();
+        s = s || {};
+        
+        var me = this,        
+        	vp = me.dom == document.body || me.dom == document,
+        	w = s.width || vp ? Ext.lib.Dom.getViewWidth() : me.getWidth(),
+        	h = s.height || vp ? Ext.lib.Dom.getViewHeight() : me.getHeight(),         	        	
+        	xy,       	
+        	r = Math.round,
+        	o = me.getXY(),
+        	scroll = me.getScroll(),
+        	extraX = vp ? scroll.left : !local ? o[0] : 0,
+        	extraY = vp ? scroll.top : !local ? o[1] : 0,
+        	hash = {
+	        	c  : [r(w * 0.5), r(h * 0.5)],
+	        	t  : [r(w * 0.5), 0],
+	        	l  : [0, r(h * 0.5)],
+	        	r  : [w, r(h * 0.5)],
+	        	b  : [r(w * 0.5), h],
+	        	tl : [0, 0],	
+	        	bl : [0, h],
+	        	br : [w, h],
+	        	tr : [w, 0]
+        	};
+        
+        xy = hash[anchor];	
+        return [xy[0] + extraX, xy[1] + extraY]; 
+    },
+
+    /**
+     * Anchors an element to another element and realigns it when the window is resized.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) True for the default animation or a standard Element animation config object
+     * @param {Boolean/Number} monitorScroll (optional) True to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @param {Function} callback The function to call after the animation finishes
+     * @return {Ext.Element} this
+     */
+    anchorTo : function(el, alignment, offsets, animate, monitorScroll, callback){        
+	    var me = this,
+            dom = me.dom,
+            scroll = !Ext.isEmpty(monitorScroll),
+            action = function(){
+                Ext.fly(dom).alignTo(el, alignment, offsets, animate);
+                Ext.callback(callback, Ext.fly(dom));
+            },
+            anchor = this.getAnchor();
+            
+        // previous listener anchor, remove it
+        this.removeAnchor();
+        Ext.apply(anchor, {
+            fn: action,
+            scroll: scroll
+        });
+
+        Ext.EventManager.onWindowResize(action, null);
+        
+        if(scroll){
+            Ext.EventManager.on(window, 'scroll', action, null,
+                {buffer: !isNaN(monitorScroll) ? monitorScroll : 50});
+        }
+        action.call(me); // align immediately
+        return me;
+    },
+    
+    /**
+     * Remove any anchor to this element. See {@link #anchorTo}.
+     * @return {Ext.Element} this
+     */
+    removeAnchor : function(){
+        var me = this,
+            anchor = this.getAnchor();
+            
+        if(anchor && anchor.fn){
+            Ext.EventManager.removeResizeListener(anchor.fn);
+            if(anchor.scroll){
+                Ext.EventManager.un(window, 'scroll', anchor.fn);
+            }
+            delete anchor.fn;
+        }
+        return me;
+    },
+    
+    // private
+    getAnchor : function(){
+        var data = Ext.Element.data,
+            dom = this.dom;
+            if (!dom) {
+                return;
+            }
+            var anchor = data(dom, '_anchor');
+            
+        if(!anchor){
+            anchor = data(dom, '_anchor', {});
+        }
+        return anchor;
+    },
+
+    /**
+     * Gets the x,y coordinates to align this element with another element. See {@link #alignTo} for more info on the
+     * supported position values.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Array} [x, y]
+     */
+    getAlignToXY : function(el, p, o){	    
+        el = Ext.get(el);
+        
+        if(!el || !el.dom){
+            throw "Element.alignToXY with an element that doesn't exist";
+        }
+        
+        o = o || [0,0];
+        p = (!p || p == "?" ? "tl-bl?" : (!(/-/).test(p) && p !== "" ? "tl-" + p : p || "tl-bl")).toLowerCase();       
+                
+        var me = this,
+        	d = me.dom,
+        	a1,
+        	a2,
+        	x,
+        	y,
+        	//constrain the aligned el to viewport if necessary
+        	w,
+        	h,
+        	r,
+        	dw = Ext.lib.Dom.getViewWidth() -10, // 10px of margin for ie
+        	dh = Ext.lib.Dom.getViewHeight()-10, // 10px of margin for ie
+        	p1y,
+        	p1x,        	
+        	p2y,
+        	p2x,
+        	swapY,
+        	swapX,
+        	doc = document,
+        	docElement = doc.documentElement,
+        	docBody = doc.body,
+        	scrollX = (docElement.scrollLeft || docBody.scrollLeft || 0)+5,
+        	scrollY = (docElement.scrollTop || docBody.scrollTop || 0)+5,
+        	c = false, //constrain to viewport
+        	p1 = "", 
+        	p2 = "",
+        	m = p.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+        
+        if(!m){
+           throw "Element.alignTo with an invalid alignment " + p;
+        }
+        
+        p1 = m[1]; 
+        p2 = m[2]; 
+        c = !!m[3];
+
+        //Subtract the aligned el's internal xy from the target's offset xy
+        //plus custom offset to get the aligned el's new offset xy
+        a1 = me.getAnchorXY(p1, true);
+        a2 = el.getAnchorXY(p2, false);
+
+        x = a2[0] - a1[0] + o[0];
+        y = a2[1] - a1[1] + o[1];
+
+        if(c){    
+	       w = me.getWidth();
+           h = me.getHeight();
+           r = el.getRegion();       
+           //If we are at a viewport boundary and the aligned el is anchored on a target border that is
+           //perpendicular to the vp border, allow the aligned el to slide on that border,
+           //otherwise swap the aligned el to the opposite border of the target.
+           p1y = p1.charAt(0);
+           p1x = p1.charAt(p1.length-1);
+           p2y = p2.charAt(0);
+           p2x = p2.charAt(p2.length-1);
+           swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t"));
+           swapX = ((p1x=="r" && p2x=="l") || (p1x=="l" && p2x=="r"));          
+           
+
+           if (x + w > dw + scrollX) {
+                x = swapX ? r.left-w : dw+scrollX-w;
+           }
+           if (x < scrollX) {
+               x = swapX ? r.right : scrollX;
+           }
+           if (y + h > dh + scrollY) {
+                y = swapY ? r.top-h : dh+scrollY-h;
+            }
+           if (y < scrollY){
+               y = swapY ? r.bottom : scrollY;
+           }
+        }
+        return [x,y];
+    },
+
+    /**
+     * Aligns this element with another element relative to the specified anchor points. If the other element is the
+     * document it aligns it to the viewport.
+     * The position parameter is optional, and can be specified in any one of the following formats:
+     * <ul>
+     *   <li><b>Blank</b>: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").</li>
+     *   <li><b>One anchor (deprecated)</b>: The passed anchor position is used as the target element's anchor point.
+     *       The element being aligned will position its top-left corner (tl) to that point.  <i>This method has been
+     *       deprecated in favor of the newer two anchor syntax below</i>.</li>
+     *   <li><b>Two anchors</b>: If two values from the table below are passed separated by a dash, the first value is used as the
+     *       element's anchor point, and the second value is used as the target's anchor point.</li>
+     * </ul>
+     * In addition to the anchor points, the position parameter also supports the "?" character.  If "?" is passed at the end of
+     * the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to
+     * the viewport if necessary.  Note that the element being aligned might be swapped to align to a different position than
+     * that specified in order to enforce the viewport constraints.
+     * Following are all of the supported anchor positions:
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner (default)
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+c      In the center of the element
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+Example Usage:
+<pre><code>
+// align el to other-el using the default positioning ("tl-bl", non-constrained)
+el.alignTo("other-el");
+
+// align the top left corner of el with the top right corner of other-el (constrained to viewport)
+el.alignTo("other-el", "tr?");
+
+// align the bottom right corner of el with the center left edge of other-el
+el.alignTo("other-el", "br-l?");
+
+// align the center of el with the bottom left corner of other-el and
+// adjust the x position by -6 pixels (and the y position by 0)
+el.alignTo("other-el", "c-bl", [-6, 0]);
+</code></pre>
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    alignTo : function(element, position, offsets, animate){
+	    var me = this;
+        return me.setXY(me.getAlignToXY(element, position, offsets),
+          		        me.preanim && !!animate ? me.preanim(arguments, 3) : false);
+    },
+    
+    // private ==>  used outside of core
+    adjustForConstraints : function(xy, parent, offsets){
+        return this.getConstrainToXY(parent || document, false, offsets, xy) ||  xy;
+    },
+
+    // private ==>  used outside of core
+    getConstrainToXY : function(el, local, offsets, proposedXY){   
+	    var os = {top:0, left:0, bottom:0, right: 0};
+
+        return function(el, local, offsets, proposedXY){
+            el = Ext.get(el);
+            offsets = offsets ? Ext.applyIf(offsets, os) : os;
+
+            var vw, vh, vx = 0, vy = 0;
+            if(el.dom == document.body || el.dom == document){
+                vw =Ext.lib.Dom.getViewWidth();
+                vh = Ext.lib.Dom.getViewHeight();
+            }else{
+                vw = el.dom.clientWidth;
+                vh = el.dom.clientHeight;
+                if(!local){
+                    var vxy = el.getXY();
+                    vx = vxy[0];
+                    vy = vxy[1];
+                }
+            }
+
+            var s = el.getScroll();
+
+            vx += offsets.left + s.left;
+            vy += offsets.top + s.top;
+
+            vw -= offsets.right;
+            vh -= offsets.bottom;
+
+            var vr = vx + vw,
+                vb = vy + vh,
+                xy = proposedXY || (!local ? this.getXY() : [this.getLeft(true), this.getTop(true)]),
+                x = xy[0], y = xy[1],
+                offset = this.getConstrainOffset(),
+                w = this.dom.offsetWidth + offset, 
+                h = this.dom.offsetHeight + offset;
+
+            // only move it if it needs it
+            var moved = false;
+
+            // first validate right/bottom
+            if((x + w) > vr){
+                x = vr - w;
+                moved = true;
+            }
+            if((y + h) > vb){
+                y = vb - h;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < vx){
+                x = vx;
+                moved = true;
+            }
+            if(y < vy){
+                y = vy;
+                moved = true;
+            }
+            return moved ? [x, y] : false;
+        };
+    }(),
+	    
+	    
+	        
+//         el = Ext.get(el);
+//         offsets = Ext.applyIf(offsets || {}, {top : 0, left : 0, bottom : 0, right : 0});
+
+//         var	me = this,
+//         	doc = document,
+//         	s = el.getScroll(),
+//         	vxy = el.getXY(),
+//         	vx = offsets.left + s.left, 
+//         	vy = offsets.top + s.top,            	
+//         	vw = -offsets.right, 
+//         	vh = -offsets.bottom, 
+//         	vr,
+//         	vb,
+//         	xy = proposedXY || (!local ? me.getXY() : [me.getLeft(true), me.getTop(true)]),
+//         	x = xy[0],
+//         	y = xy[1],
+//         	w = me.dom.offsetWidth, h = me.dom.offsetHeight,
+//         	moved = false; // only move it if it needs it
+//       
+//         	
+//         if(el.dom == doc.body || el.dom == doc){
+//             vw += Ext.lib.Dom.getViewWidth();
+//             vh += Ext.lib.Dom.getViewHeight();
+//         }else{
+//             vw += el.dom.clientWidth;
+//             vh += el.dom.clientHeight;
+//             if(!local){                    
+//                 vx += vxy[0];
+//                 vy += vxy[1];
+//             }
+//         }
+
+//         // first validate right/bottom
+//         if(x + w > vx + vw){
+//             x = vx + vw - w;
+//             moved = true;
+//         }
+//         if(y + h > vy + vh){
+//             y = vy + vh - h;
+//             moved = true;
+//         }
+//         // then make sure top/left isn't negative
+//         if(x < vx){
+//             x = vx;
+//             moved = true;
+//         }
+//         if(y < vy){
+//             y = vy;
+//             moved = true;
+//         }
+//         return moved ? [x, y] : false;
+//    },
+
+    // private, used internally
+    getConstrainOffset : function(){
+        return 0;
+    },
+    
+    /**
+    * Calculates the x, y to center this element on the screen
+    * @return {Array} The x, y values [x, y]
+    */
+    getCenterXY : function(){
+        return this.getAlignToXY(document, 'c-c');
+    },
+
+    /**
+    * Centers the Element in either the viewport, or another Element.
+    * @param {Mixed} centerIn (optional) The element in which to center the element.
+    */
+    center : function(centerIn){
+        return this.alignTo(centerIn || document, 'c-c');        
+    }    
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Template-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Template-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Template-more.js	(revision 76)
@@ -0,0 +1,137 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Template
+ */
+Ext.apply(Ext.Template.prototype, {
+    /**
+     * @cfg {Boolean} disableFormats Specify <tt>true</tt> to disable format
+     * functions in the template. If the template does not contain
+     * {@link Ext.util.Format format functions}, setting <code>disableFormats</code>
+     * to true will reduce <code>{@link #apply}</code> time. Defaults to <tt>false</tt>.
+     * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // reduce <code>{@link #apply}</code> time since no formatting
+    }
+);
+     * </code></pre>
+     * For a list of available format functions, see {@link Ext.util.Format}.
+     */
+    disableFormats : false,
+    /**
+     * See <code>{@link #disableFormats}</code>.
+     * @type Boolean
+     * @property disableFormats
+     */
+
+    /**
+     * The regular expression used to match template variables
+     * @type RegExp
+     * @property
+     * @hide repeat doc
+     */
+    re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
+    argsRe : /^\s*['"](.*)["']\s*$/,
+    compileARe : /\\/g,
+    compileBRe : /(\r\n|\n)/g,
+    compileCRe : /'/g,
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     * @hide repeat doc
+     */
+    applyTemplate : function(values){
+        var me = this,
+            useF = me.disableFormats !== true,
+            fm = Ext.util.Format,
+            tpl = me;
+
+        if(me.compiled){
+            return me.compiled(values);
+        }
+        function fn(m, name, format, args){
+            if (format && useF) {
+                if (format.substr(0, 5) == "this.") {
+                    return tpl.call(format.substr(5), values[name], values);
+                } else {
+                    if (args) {
+                        // quoted values are required for strings in compiled templates,
+                        // but for non compiled we need to strip them
+                        // quoted reversed for jsmin
+                        var re = me.argsRe;
+                        args = args.split(',');
+                        for(var i = 0, len = args.length; i < len; i++){
+                            args[i] = args[i].replace(re, "$1");
+                        }
+                        args = [values[name]].concat(args);
+                    } else {
+                        args = [values[name]];
+                    }
+                    return fm[format].apply(fm, args);
+                }
+            } else {
+                return values[name] !== undefined ? values[name] : "";
+            }
+        }
+        return me.html.replace(me.re, fn);
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     * @hide repeat doc
+     */
+    compile : function(){
+        var me = this,
+            fm = Ext.util.Format,
+            useF = me.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args){
+            if(format && useF){
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            }else{
+                args= ''; format = "(values['" + name + "'] == undefined ? '' : ";
+            }
+            return "'"+ sep + format + "values['" + name + "']" + args + ")"+sep+"'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "this.compiled = function(values){ return '" +
+                   me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn) +
+                    "';};";
+        }else{
+            body = ["this.compiled = function(values){ return ['"];
+            body.push(me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return me;
+    },
+
+    // private function used to call members
+    call : function(fnName, value, allValues){
+        return this[fnName](value, allValues);
+    }
+});
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElement.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElement.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElement.js	(revision 76)
@@ -0,0 +1,112 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.CompositeElement
+ * @extends Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * <p>All methods return <i>this</i> and can be chained.</p>
+ * Usage:
+<pre><code>
+var els = Ext.select("#some-el div.some-class", true);
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class', true);
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code></pre>
+ */
+Ext.CompositeElement = Ext.extend(Ext.CompositeElementLite, {
+    
+    constructor : function(els, root){
+        this.elements = [];
+        this.add(els, root);
+    },
+    
+    // private
+    getElement : function(el){
+        // In this case just return it, since we already have a reference to it
+        return el;
+    },
+    
+    // private
+    transformElement : function(el){
+        return Ext.get(el);
+    }
+
+    /**
+    * Adds elements to this composite.
+    * @param {String/Array} els A string CSS selector, an array of elements or an element
+    * @return {CompositeElement} this
+    */
+
+    /**
+     * Returns the Element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+
+    /**
+     * Iterates each <code>element</code> in this <code>composite</code>
+     * calling the supplied function using {@link Ext#each}.
+     * @param {Function} fn The function to be called with each
+     * <code>element</code>. If the supplied function returns <tt>false</tt>,
+     * iteration stops. This function is called with the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><code>element</code> : <i>Ext.Element</i><div class="sub-desc">The element at the current <code>index</code>
+     * in the <code>composite</code></div></li>
+     * <li><code>composite</code> : <i>Object</i> <div class="sub-desc">This composite.</div></li>
+     * <li><code>index</code> : <i>Number</i> <div class="sub-desc">The current index within the <code>composite</code> </div></li>
+     * </ul></div>
+     * @param {Object} scope (optional) The scope (<code><this</code> reference) in which the specified function is executed.
+     * Defaults to the <code>element</code> at the current <code>index</code>
+     * within the composite.
+     * @return {CompositeElement} this
+     */
+});
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, unique, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+
+    return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);
+};
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/EventManager-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/EventManager-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/EventManager-more.js	(revision 76)
@@ -0,0 +1,341 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+* @class Ext.EventManager
+*/
+Ext.apply(Ext.EventManager, function(){
+   var resizeEvent,
+       resizeTask,
+       textEvent,
+       textSize,
+       D = Ext.lib.Dom,
+       propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+       unload = Ext.EventManager._unload,
+       curWidth = 0,
+       curHeight = 0,
+       // note 1: IE fires ONLY the keydown event on specialkey autorepeat
+       // note 2: Safari < 3.1, Gecko (Mac/Linux) & Opera fire only the keypress event on specialkey autorepeat
+       // (research done by @Jan Wolter at http://unixpapa.com/js/key.html)
+       useKeydown = Ext.isWebKit ?
+                   Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1]) >= 525 :
+                   !((Ext.isGecko && !Ext.isWindows) || Ext.isOpera);
+
+   return {
+       _unload: function(){
+           Ext.EventManager.un(window, "resize", this.fireWindowResize, this);
+           unload.call(Ext.EventManager);    
+       },
+       
+       // private
+       doResizeEvent: function(){
+           var h = D.getViewHeight(),
+               w = D.getViewWidth();
+
+            //whacky problem in IE where the resize event will fire even though the w/h are the same.
+            if(curHeight != h || curWidth != w){
+               resizeEvent.fire(curWidth = w, curHeight = h);
+            }
+       },
+
+       /**
+        * Adds a listener to be notified when the browser window is resized and provides resize event buffering (100 milliseconds),
+        * passes new viewport width and height to handlers.
+        * @param {Function} fn      The handler function the window resize event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onWindowResize : function(fn, scope, options){
+           if(!resizeEvent){
+               resizeEvent = new Ext.util.Event();
+               resizeTask = new Ext.util.DelayedTask(this.doResizeEvent);
+               Ext.EventManager.on(window, "resize", this.fireWindowResize, this);
+           }
+           resizeEvent.addListener(fn, scope, options);
+       },
+
+       // exposed only to allow manual firing
+       fireWindowResize : function(){
+           if(resizeEvent){
+               resizeTask.delay(100);
+           }
+       },
+
+       /**
+        * Adds a listener to be notified when the user changes the active text size. Handler gets called with 2 params, the old size and the new size.
+        * @param {Function} fn      The function the event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onTextResize : function(fn, scope, options){
+           if(!textEvent){
+               textEvent = new Ext.util.Event();
+               var textEl = new Ext.Element(document.createElement('div'));
+               textEl.dom.className = 'x-text-resize';
+               textEl.dom.innerHTML = 'X';
+               textEl.appendTo(document.body);
+               textSize = textEl.dom.offsetHeight;
+               setInterval(function(){
+                   if(textEl.dom.offsetHeight != textSize){
+                       textEvent.fire(textSize, textSize = textEl.dom.offsetHeight);
+                   }
+               }, this.textResizeInterval);
+           }
+           textEvent.addListener(fn, scope, options);
+       },
+
+       /**
+        * Removes the passed window resize listener.
+        * @param {Function} fn        The method the event invokes
+        * @param {Object}   scope    The scope of handler
+        */
+       removeResizeListener : function(fn, scope){
+           if(resizeEvent){
+               resizeEvent.removeListener(fn, scope);
+           }
+       },
+
+       // private
+       fireResize : function(){
+           if(resizeEvent){
+               resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
+           }
+       },
+
+        /**
+        * The frequency, in milliseconds, to check for text resize events (defaults to 50)
+        */
+       textResizeInterval : 50,
+
+       /**
+        * Url used for onDocumentReady with using SSL (defaults to Ext.SSL_SECURE_URL)
+        */
+       ieDeferSrc : false,
+       
+       // protected, short accessor for useKeydown
+       getKeyEvent : function(){
+           return useKeydown ? 'keydown' : 'keypress';
+       },
+
+       // protected for use inside the framework
+       // detects whether we should use keydown or keypress based on the browser.
+       useKeydown: useKeydown
+   };
+}());
+
+Ext.EventManager.on = Ext.EventManager.addListener;
+
+
+Ext.apply(Ext.EventObjectImpl.prototype, {
+   /** Key constant @type Number */
+   BACKSPACE: 8,
+   /** Key constant @type Number */
+   TAB: 9,
+   /** Key constant @type Number */
+   NUM_CENTER: 12,
+   /** Key constant @type Number */
+   ENTER: 13,
+   /** Key constant @type Number */
+   RETURN: 13,
+   /** Key constant @type Number */
+   SHIFT: 16,
+   /** Key constant @type Number */
+   CTRL: 17,
+   CONTROL : 17, // legacy
+   /** Key constant @type Number */
+   ALT: 18,
+   /** Key constant @type Number */
+   PAUSE: 19,
+   /** Key constant @type Number */
+   CAPS_LOCK: 20,
+   /** Key constant @type Number */
+   ESC: 27,
+   /** Key constant @type Number */
+   SPACE: 32,
+   /** Key constant @type Number */
+   PAGE_UP: 33,
+   PAGEUP : 33, // legacy
+   /** Key constant @type Number */
+   PAGE_DOWN: 34,
+   PAGEDOWN : 34, // legacy
+   /** Key constant @type Number */
+   END: 35,
+   /** Key constant @type Number */
+   HOME: 36,
+   /** Key constant @type Number */
+   LEFT: 37,
+   /** Key constant @type Number */
+   UP: 38,
+   /** Key constant @type Number */
+   RIGHT: 39,
+   /** Key constant @type Number */
+   DOWN: 40,
+   /** Key constant @type Number */
+   PRINT_SCREEN: 44,
+   /** Key constant @type Number */
+   INSERT: 45,
+   /** Key constant @type Number */
+   DELETE: 46,
+   /** Key constant @type Number */
+   ZERO: 48,
+   /** Key constant @type Number */
+   ONE: 49,
+   /** Key constant @type Number */
+   TWO: 50,
+   /** Key constant @type Number */
+   THREE: 51,
+   /** Key constant @type Number */
+   FOUR: 52,
+   /** Key constant @type Number */
+   FIVE: 53,
+   /** Key constant @type Number */
+   SIX: 54,
+   /** Key constant @type Number */
+   SEVEN: 55,
+   /** Key constant @type Number */
+   EIGHT: 56,
+   /** Key constant @type Number */
+   NINE: 57,
+   /** Key constant @type Number */
+   A: 65,
+   /** Key constant @type Number */
+   B: 66,
+   /** Key constant @type Number */
+   C: 67,
+   /** Key constant @type Number */
+   D: 68,
+   /** Key constant @type Number */
+   E: 69,
+   /** Key constant @type Number */
+   F: 70,
+   /** Key constant @type Number */
+   G: 71,
+   /** Key constant @type Number */
+   H: 72,
+   /** Key constant @type Number */
+   I: 73,
+   /** Key constant @type Number */
+   J: 74,
+   /** Key constant @type Number */
+   K: 75,
+   /** Key constant @type Number */
+   L: 76,
+   /** Key constant @type Number */
+   M: 77,
+   /** Key constant @type Number */
+   N: 78,
+   /** Key constant @type Number */
+   O: 79,
+   /** Key constant @type Number */
+   P: 80,
+   /** Key constant @type Number */
+   Q: 81,
+   /** Key constant @type Number */
+   R: 82,
+   /** Key constant @type Number */
+   S: 83,
+   /** Key constant @type Number */
+   T: 84,
+   /** Key constant @type Number */
+   U: 85,
+   /** Key constant @type Number */
+   V: 86,
+   /** Key constant @type Number */
+   W: 87,
+   /** Key constant @type Number */
+   X: 88,
+   /** Key constant @type Number */
+   Y: 89,
+   /** Key constant @type Number */
+   Z: 90,
+   /** Key constant @type Number */
+   CONTEXT_MENU: 93,
+   /** Key constant @type Number */
+   NUM_ZERO: 96,
+   /** Key constant @type Number */
+   NUM_ONE: 97,
+   /** Key constant @type Number */
+   NUM_TWO: 98,
+   /** Key constant @type Number */
+   NUM_THREE: 99,
+   /** Key constant @type Number */
+   NUM_FOUR: 100,
+   /** Key constant @type Number */
+   NUM_FIVE: 101,
+   /** Key constant @type Number */
+   NUM_SIX: 102,
+   /** Key constant @type Number */
+   NUM_SEVEN: 103,
+   /** Key constant @type Number */
+   NUM_EIGHT: 104,
+   /** Key constant @type Number */
+   NUM_NINE: 105,
+   /** Key constant @type Number */
+   NUM_MULTIPLY: 106,
+   /** Key constant @type Number */
+   NUM_PLUS: 107,
+   /** Key constant @type Number */
+   NUM_MINUS: 109,
+   /** Key constant @type Number */
+   NUM_PERIOD: 110,
+   /** Key constant @type Number */
+   NUM_DIVISION: 111,
+   /** Key constant @type Number */
+   F1: 112,
+   /** Key constant @type Number */
+   F2: 113,
+   /** Key constant @type Number */
+   F3: 114,
+   /** Key constant @type Number */
+   F4: 115,
+   /** Key constant @type Number */
+   F5: 116,
+   /** Key constant @type Number */
+   F6: 117,
+   /** Key constant @type Number */
+   F7: 118,
+   /** Key constant @type Number */
+   F8: 119,
+   /** Key constant @type Number */
+   F9: 120,
+   /** Key constant @type Number */
+   F10: 121,
+   /** Key constant @type Number */
+   F11: 122,
+   /** Key constant @type Number */
+   F12: 123,
+
+   /** @private */
+   isNavKeyPress : function(){
+       var me = this,
+           k = this.normalizeKey(me.keyCode);
+       return (k >= 33 && k <= 40) ||  // Page Up/Down, End, Home, Left, Up, Right, Down
+       k == me.RETURN ||
+       k == me.TAB ||
+       k == me.ESC;
+   },
+
+   isSpecialKey : function(){
+       var k = this.normalizeKey(this.keyCode);
+       return (this.type == 'keypress' && this.ctrlKey) ||
+       this.isNavKeyPress() ||
+       (k == this.BACKSPACE) || // Backspace
+       (k >= 16 && k <= 20) || // Shift, Ctrl, Alt, Pause, Caps Lock
+       (k >= 44 && k <= 46);   // Print Screen, Insert, Delete
+   },
+
+   getPoint : function(){
+       return new Ext.lib.Point(this.xy[0], this.xy[1]);
+   },
+
+   /**
+    * Returns true if the control, meta, shift or alt key was pressed during this event.
+    * @return {Boolean}
+    */
+   hasModifier : function(){
+       return ((this.ctrlKey || this.altKey) || this.shiftKey);
+   }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/DomHelper-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/DomHelper-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/DomHelper-more.js	(revision 76)
@@ -0,0 +1,154 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.DomHelper
+ */
+Ext.apply(Ext.DomHelper,
+function(){
+    var pub,
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        confRe = /tag|children|cn|html$/i;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        el = Ext.getDom(el);
+        var newNode;
+        if (pub.useDom) {
+            newNode = createDom(o, null);
+            if (append) {
+                el.appendChild(newNode);
+            } else {
+                (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
+            }
+        } else {
+            newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
+        }
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as dom
+    /** @ignore */
+    function createDom(o, parentNode){
+        var el,
+            doc = document,
+            useSet,
+            attr,
+            val,
+            cn;
+
+        if (Ext.isArray(o)) {                       // Allow Arrays of siblings to be inserted
+            el = doc.createDocumentFragment(); // in one shot using a DocumentFragment
+            for (var i = 0, l = o.length; i < l; i++) {
+                createDom(o[i], el);
+            }
+        } else if (typeof o == 'string') {         // Allow a string as a child spec.
+            el = doc.createTextNode(o);
+        } else {
+            el = doc.createElement( o.tag || 'div' );
+            useSet = !!el.setAttribute; // In IE some elements don't have setAttribute
+            for (var attr in o) {
+                if(!confRe.test(attr)){
+                    val = o[attr];
+                    if(attr == 'cls'){
+                        el.className = val;
+                    }else{
+                        if(useSet){
+                            el.setAttribute(attr, val);
+                        }else{
+                            el[attr] = val;
+                        }
+                    }
+                }
+            }
+            Ext.DomHelper.applyStyles(el, o.style);
+
+            if ((cn = o.children || o.cn)) {
+                createDom(cn, el);
+            } else if (o.html) {
+                el.innerHTML = o.html;
+            }
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    }
+
+    pub = {
+        /**
+         * Creates a new Ext.Template from the DOM object spec.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {Ext.Template} The new template
+         */
+        createTemplate : function(o){
+            var html = Ext.DomHelper.createHtml(o);
+            return new Ext.Template(html);
+        },
+
+        /** True to force the use of DOM instead of html fragments @type Boolean */
+        useDom : false,
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        append: function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) without inserting them to the document.
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @return {HTMLElement} The new uninserted node
+         */
+        createDom: createDom
+    };
+    return pub;
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.dd.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.dd.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.dd.js	(revision 76)
@@ -0,0 +1,46 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Initializes a {@link Ext.dd.DD} drag drop object for this element.
+     * @param {String} group The group the DD object is member of
+     * @param {Object} config The DD config object
+     * @param {Object} overrides An object containing methods to override/implement on the DD object
+     * @return {Ext.dd.DD} The DD object
+     */
+    initDD : function(group, config, overrides){
+        var dd = new Ext.dd.DD(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDProxy} object for this element.
+     * @param {String} group The group the DDProxy object is member of
+     * @param {Object} config The DDProxy config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDProxy object
+     * @return {Ext.dd.DDProxy} The DDProxy object
+     */
+    initDDProxy : function(group, config, overrides){
+        var dd = new Ext.dd.DDProxy(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDTarget} object for this element.
+     * @param {String} group The group the DDTarget object is member of
+     * @param {Object} config The DDTarget config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDTarget object
+     * @return {Ext.dd.DDTarget} The DDTarget object
+     */
+    initDDTarget : function(group, config, overrides){
+        var dd = new Ext.dd.DDTarget(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.scroll-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.scroll-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.scroll-more.js	(revision 76)
@@ -0,0 +1,118 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Element} this
+     */
+    scrollTo : function(side, value, animate) {
+        //check if we're scrolling top or left
+        var top = /top/i.test(side),
+            me = this,
+            dom = me.dom,
+            prop;
+        if (!animate || !me.anim) {
+            // just setting the value, so grab the direction
+            prop = 'scroll' + (top ? 'Top' : 'Left');
+            dom[prop] = value;
+        }
+        else {
+            // if scrolling top, we need to grab scrollLeft, if left, scrollTop
+            prop = 'scroll' + (top ? 'Left' : 'Top');
+            me.anim({scroll: {to: top ? [dom[prop], value] : [value, dom[prop]]}}, me.preanim(arguments, 2), 'scroll');
+        }
+        return me;
+    },
+    
+    /**
+     * Scrolls this element into view within the passed container.
+     * @param {Mixed} container (optional) The container element to scroll (defaults to document.body).  Should be a
+     * string (id), dom node, or Ext.Element.
+     * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)
+     * @return {Ext.Element} this
+     */
+    scrollIntoView : function(container, hscroll) {
+        var c = Ext.getDom(container) || Ext.getBody().dom,
+            el = this.dom,
+            o = this.getOffsetsTo(c),
+            l = o[0] + c.scrollLeft,
+            t = o[1] + c.scrollTop,
+            b = t + el.offsetHeight,
+            r = l + el.offsetWidth,
+            ch = c.clientHeight,
+            ct = parseInt(c.scrollTop, 10),
+            cl = parseInt(c.scrollLeft, 10),
+            cb = ct + ch,
+            cr = cl + c.clientWidth;
+
+        if (el.offsetHeight > ch || t < ct) {
+            c.scrollTop = t;
+        }
+        else if (b > cb) {
+            c.scrollTop = b-ch;
+        }
+        // corrects IE, other browsers will ignore
+        c.scrollTop = c.scrollTop;
+
+        if (hscroll !== false) {
+            if (el.offsetWidth > c.clientWidth || l < cl) {
+                c.scrollLeft = l;
+            }
+            else if (r > cr) {
+                c.scrollLeft = r - c.clientWidth;
+            }
+            c.scrollLeft = c.scrollLeft;
+        }
+        return this;
+    },
+
+    // private
+    scrollChildIntoView : function(child, hscroll) {
+        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
+    },
+    
+    /**
+     * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is
+     * within this element's scrollable range.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to scroll the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Boolean} Returns true if a scroll was triggered or false if the element
+     * was scrolled as far as it could go.
+     */
+     scroll : function(direction, distance, animate) {
+        if (!this.isScrollable()) {
+            return false;
+        }
+        var el = this.dom,
+            l = el.scrollLeft, t = el.scrollTop,
+            w = el.scrollWidth, h = el.scrollHeight,
+            cw = el.clientWidth, ch = el.clientHeight,
+            scrolled = false, v,
+            hash = {
+                l: Math.min(l + distance, w-cw),
+                r: v = Math.max(l - distance, 0),
+                t: Math.max(t - distance, 0),
+                b: Math.min(t + distance, h-ch)
+            };
+            hash.d = hash.b;
+            hash.u = hash.t;
+        
+        direction = direction.substr(0, 1);
+        if ((v = hash[direction]) > -1) {
+            scrolled = true;
+            this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.preanim(arguments, 2));
+        }
+        return scrolled;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.style-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.style-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.style-more.js	(revision 76)
@@ -0,0 +1,360 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+
+// special markup used throughout Ext when box wrapping elements
+Ext.Element.boxMarkup = '<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';
+
+Ext.Element.addMethods(function(){
+    var INTERNAL = "_internal",
+        pxMatch = /(\d+\.?\d+)px/;
+    return {
+        /**
+         * More flexible version of {@link #setStyle} for setting style properties.
+         * @param {String/Object/Function} styles A style specification string, e.g. "width:100px", or object in the form {width:"100px"}, or
+         * a function which returns such a specification.
+         * @return {Ext.Element} this
+         */
+        applyStyles : function(style){
+            Ext.DomHelper.applyStyles(this.dom, style);
+            return this;
+        },
+
+        /**
+         * Returns an object with properties matching the styles requested.
+         * For example, el.getStyles('color', 'font-size', 'width') might return
+         * {'color': '#FFFFFF', 'font-size': '13px', 'width': '100px'}.
+         * @param {String} style1 A style name
+         * @param {String} style2 A style name
+         * @param {String} etc.
+         * @return {Object} The style object
+         */
+        getStyles : function(){
+            var ret = {};
+            Ext.each(arguments, function(v) {
+               ret[v] = this.getStyle(v);
+            },
+            this);
+            return ret;
+        },
+
+        // private  ==> used by ext full
+        setOverflow : function(v){
+            var dom = this.dom;
+            if(v=='auto' && Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                dom.style.overflow = 'hidden';
+                (function(){dom.style.overflow = 'auto';}).defer(1);
+            }else{
+                dom.style.overflow = v;
+            }
+        },
+
+       /**
+        * <p>Wraps the specified element with a special 9 element markup/CSS block that renders by default as
+        * a gray container with a gradient background, rounded corners and a 4-way shadow.</p>
+        * <p>This special markup is used throughout Ext when box wrapping elements ({@link Ext.Button},
+        * {@link Ext.Panel} when <tt>{@link Ext.Panel#frame frame=true}</tt>, {@link Ext.Window}).  The markup
+        * is of this form:</p>
+        * <pre><code>
+    Ext.Element.boxMarkup =
+    &#39;&lt;div class="{0}-tl">&lt;div class="{0}-tr">&lt;div class="{0}-tc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-ml">&lt;div class="{0}-mr">&lt;div class="{0}-mc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-bl">&lt;div class="{0}-br">&lt;div class="{0}-bc">&lt;/div>&lt;/div>&lt;/div>&#39;;
+        * </code></pre>
+        * <p>Example usage:</p>
+        * <pre><code>
+    // Basic box wrap
+    Ext.get("foo").boxWrap();
+
+    // You can also add a custom class and use CSS inheritance rules to customize the box look.
+    // 'x-box-blue' is a built-in alternative -- look at the related CSS definitions as an example
+    // for how to create a custom box wrap style.
+    Ext.get("foo").boxWrap().addClass("x-box-blue");
+        * </code></pre>
+        * @param {String} class (optional) A base CSS class to apply to the containing wrapper element
+        * (defaults to <tt>'x-box'</tt>). Note that there are a number of CSS rules that are dependent on
+        * this name to make the overall effect work, so if you supply an alternate base class, make sure you
+        * also supply all of the necessary rules.
+        * @return {Ext.Element} The outermost wrapping element of the created box structure.
+        */
+        boxWrap : function(cls){
+            cls = cls || 'x-box';
+            var el = Ext.get(this.insertHtml("beforeBegin", "<div class='" + cls + "'>" + String.format(Ext.Element.boxMarkup, cls) + "</div>"));        //String.format('<div class="{0}">'+Ext.Element.boxMarkup+'</div>', cls)));
+            Ext.DomQuery.selectNode('.' + cls + '-mc', el.dom).appendChild(this.dom);
+            return el;
+        },
+
+        /**
+         * Set the size of this Element. If animation is true, both width and height will be animated concurrently.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+         * </ul></div>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setSize : function(width, height, animate){
+            var me = this;
+            if(typeof width == 'object'){ // in case of object from getSize()
+                height = width.height;
+                width = width.width;
+            }
+            width = me.adjustWidth(width);
+            height = me.adjustHeight(height);
+            if(!animate || !me.anim){
+                me.dom.style.width = me.addUnits(width);
+                me.dom.style.height = me.addUnits(height);
+            }else{
+                me.anim({width: {to: width}, height: {to: height}}, me.preanim(arguments, 2));
+            }
+            return me;
+        },
+
+        /**
+         * Returns either the offsetHeight or the height of this element based on CSS height adjusted by padding or borders
+         * when needed to simulate offsetHeight when offsets aren't available. This may not work on display:none elements
+         * if a height has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedHeight : function(){
+            var me = this,
+                h = Math.max(me.dom.offsetHeight, me.dom.clientHeight);
+            if(!h){
+                h = parseFloat(me.getStyle('height')) || 0;
+                if(!me.isBorderBox()){
+                    h += me.getFrameWidth('tb');
+                }
+            }
+            return h;
+        },
+
+        /**
+         * Returns either the offsetWidth or the width of this element based on CSS width adjusted by padding or borders
+         * when needed to simulate offsetWidth when offsets aren't available. This may not work on display:none elements
+         * if a width has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedWidth : function(){
+            var w = Math.max(this.dom.offsetWidth, this.dom.clientWidth);
+            if(!w){
+                w = parseFloat(this.getStyle('width')) || 0;
+                if(!this.isBorderBox()){
+                    w += this.getFrameWidth('lr');
+                }
+            }
+            return w;
+        },
+
+        /**
+         * Returns the sum width of the padding and borders for the passed "sides". See getBorderWidth()
+         for more information about the sides.
+         * @param {String} sides
+         * @return {Number}
+         */
+        getFrameWidth : function(sides, onlyContentBox){
+            return onlyContentBox && this.isBorderBox() ? 0 : (this.getPadding(sides) + this.getBorderWidth(sides));
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is over this element
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnOver : function(className){
+            this.hover(
+                function(){
+                    Ext.fly(this, INTERNAL).addClass(className);
+                },
+                function(){
+                    Ext.fly(this, INTERNAL).removeClass(className);
+                }
+            );
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when this element has the focus
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnFocus : function(className){
+            this.on("focus", function(){
+                Ext.fly(this, INTERNAL).addClass(className);
+            }, this.dom);
+            this.on("blur", function(){
+                Ext.fly(this, INTERNAL).removeClass(className);
+            }, this.dom);
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnClick : function(className){
+            var dom = this.dom;
+            this.on("mousedown", function(){
+                Ext.fly(dom, INTERNAL).addClass(className);
+                var d = Ext.getDoc(),
+                    fn = function(){
+                        Ext.fly(dom, INTERNAL).removeClass(className);
+                        d.removeListener("mouseup", fn);
+                    };
+                d.on("mouseup", fn);
+            });
+            return this;
+        },
+
+        /**
+         * <p>Returns the dimensions of the element available to lay content out in.<p>
+         * <p>If the element (or any ancestor element) has CSS style <code>display : none</code>, the dimensions will be zero.</p>
+         * example:<pre><code>
+        var vpSize = Ext.getBody().getViewSize();
+
+        // all Windows created afterwards will have a default value of 90% height and 95% width
+        Ext.Window.override({
+            width: vpSize.width * 0.9,
+            height: vpSize.height * 0.95
+        });
+        // To handle window resizing you would have to hook onto onWindowResize.
+        * </code></pre>
+        *
+        * getViewSize utilizes clientHeight/clientWidth which excludes sizing of scrollbars.
+        * To obtain the size including scrollbars, use getStyleSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getViewSize : function(){
+            var doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body);
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+
+            // Else use clientHeight/clientWidth
+            } else {
+                return {
+                    width : d.clientWidth,
+                    height : d.clientHeight
+                };
+            }
+        },
+
+        /**
+        * <p>Returns the dimensions of the element available to lay content out in.<p>
+        *
+        * getStyleSize utilizes prefers style sizing if present, otherwise it chooses the larger of offsetHeight/clientHeight and offsetWidth/clientWidth.
+        * To obtain the size excluding scrollbars, use getViewSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getStyleSize : function(){
+            var me = this,
+                w, h,
+                doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body),
+                s = d.style;
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+            }
+            // Use Styles if they are set
+            if(s.width && s.width != 'auto'){
+                w = parseFloat(s.width);
+                if(me.isBorderBox()){
+                   w -= me.getFrameWidth('lr');
+                }
+            }
+            // Use Styles if they are set
+            if(s.height && s.height != 'auto'){
+                h = parseFloat(s.height);
+                if(me.isBorderBox()){
+                   h -= me.getFrameWidth('tb');
+                }
+            }
+            // Use getWidth/getHeight if style not set.
+            return {width: w || me.getWidth(true), height: h || me.getHeight(true)};
+        },
+
+        /**
+         * Returns the size of the element.
+         * @param {Boolean} contentSize (optional) true to get the width/size minus borders and padding
+         * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+         */
+        getSize : function(contentSize){
+            return {width: this.getWidth(contentSize), height: this.getHeight(contentSize)};
+        },
+
+        /**
+         * Forces the browser to repaint this element
+         * @return {Ext.Element} this
+         */
+        repaint : function(){
+            var dom = this.dom;
+            this.addClass("x-repaint");
+            setTimeout(function(){
+                Ext.fly(dom).removeClass("x-repaint");
+            }, 1);
+            return this;
+        },
+
+        /**
+         * Disables text selection for this element (normalized across browsers)
+         * @return {Ext.Element} this
+         */
+        unselectable : function(){
+            this.dom.unselectable = "on";
+            return this.swallowEvent("selectstart", true).
+                        applyStyles("-moz-user-select:none;-khtml-user-select:none;").
+                        addClass("x-unselectable");
+        },
+
+        /**
+         * Returns an object with properties top, left, right and bottom representing the margins of this element unless sides is passed,
+         * then it returns the calculated width of the sides (see getPadding)
+         * @param {String} sides (optional) Any combination of l, r, t, b to get the sum of those sides
+         * @return {Object/Number}
+         */
+        getMargins : function(side){
+            var me = this,
+                key,
+                hash = {t:"top", l:"left", r:"right", b: "bottom"},
+                o = {};
+
+            if (!side) {
+                for (key in me.margins){
+                    o[hash[key]] = parseFloat(me.getStyle(me.margins[key])) || 0;
+                }
+                return o;
+            } else {
+                return me.addStyles.call(me, side, me.margins);
+            }
+        }
+    };
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element-more.js	(revision 76)
@@ -0,0 +1,200 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Stops the specified event(s) from bubbling and optionally prevents the default action
+     * @param {String/Array} eventName an event / array of events to stop from bubbling
+     * @param {Boolean} preventDefault (optional) true to prevent the default action too
+     * @return {Ext.Element} this
+     */
+    swallowEvent : function(eventName, preventDefault) {
+        var me = this;
+        function fn(e) {
+            e.stopPropagation();
+            if (preventDefault) {
+                e.preventDefault();
+            }
+        }
+        
+        if (Ext.isArray(eventName)) {
+            Ext.each(eventName, function(e) {
+                 me.on(e, fn);
+            });
+            return me;
+        }
+        me.on(eventName, fn);
+        return me;
+    },
+
+    /**
+     * Create an event handler on this element such that when the event fires and is handled by this element,
+     * it will be relayed to another object (i.e., fired again as if it originated from that object instead).
+     * @param {String} eventName The type of event to relay
+     * @param {Object} object Any object that extends {@link Ext.util.Observable} that will provide the context
+     * for firing the relayed event
+     */
+    relayEvent : function(eventName, observable) {
+        this.on(eventName, function(e) {
+            observable.fireEvent(eventName, e);
+        });
+    },
+
+    /**
+     * Removes worthless text nodes
+     * @param {Boolean} forceReclean (optional) By default the element
+     * keeps track if it has been cleaned already so
+     * you can call this over and over. However, if you update the element and
+     * need to force a reclean, you can pass true.
+     */
+    clean : function(forceReclean) {
+        var me  = this,
+            dom = me.dom,
+            n   = dom.firstChild,
+            ni  = -1;
+
+        if (Ext.Element.data(dom, 'isCleaned') && forceReclean !== true) {
+            return me;
+        }
+
+        while (n) {
+            var nx = n.nextSibling;
+            if (n.nodeType == 3 && !(/\S/.test(n.nodeValue))) {
+                dom.removeChild(n);
+            } else {
+                n.nodeIndex = ++ni;
+            }
+            n = nx;
+        }
+        
+        Ext.Element.data(dom, 'isCleaned', true);
+        return me;
+    },
+
+    /**
+     * Direct access to the Updater {@link Ext.Updater#update} method. The method takes the same object
+     * parameter as {@link Ext.Updater#update}
+     * @return {Ext.Element} this
+     */
+    load : function() {
+        var updateManager = this.getUpdater();
+        updateManager.update.apply(updateManager, arguments);
+        
+        return this;
+    },
+
+    /**
+    * Gets this element's {@link Ext.Updater Updater}
+    * @return {Ext.Updater} The Updater
+    */
+    getUpdater : function() {
+        return this.updateManager || (this.updateManager = new Ext.Updater(this));
+    },
+
+    /**
+    * Update the innerHTML of this element, optionally searching for and processing scripts
+    * @param {String} html The new HTML
+    * @param {Boolean} loadScripts (optional) True to look for and process scripts (defaults to false)
+    * @param {Function} callback (optional) For async script loading you can be notified when the update completes
+    * @return {Ext.Element} this
+     */
+    update : function(html, loadScripts, callback) {
+        if (!this.dom) {
+            return this;
+        }
+        html = html || "";
+
+        if (loadScripts !== true) {
+            this.dom.innerHTML = html;
+            if (typeof callback == 'function') {
+                callback();
+            }
+            return this;
+        }
+
+        var id  = Ext.id(),
+            dom = this.dom;
+
+        html += '<span id="' + id + '"></span>';
+
+        Ext.lib.Event.onAvailable(id, function() {
+            var DOC    = document,
+                hd     = DOC.getElementsByTagName("head")[0],
+                re     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+                srcRe  = /\ssrc=([\'\"])(.*?)\1/i,
+                typeRe = /\stype=([\'\"])(.*?)\1/i,
+                match,
+                attrs,
+                srcMatch,
+                typeMatch,
+                el,
+                s;
+
+            while ((match = re.exec(html))) {
+                attrs = match[1];
+                srcMatch = attrs ? attrs.match(srcRe) : false;
+                if (srcMatch && srcMatch[2]) {
+                   s = DOC.createElement("script");
+                   s.src = srcMatch[2];
+                   typeMatch = attrs.match(typeRe);
+                   if (typeMatch && typeMatch[2]) {
+                       s.type = typeMatch[2];
+                   }
+                   hd.appendChild(s);
+                } else if (match[2] && match[2].length > 0) {
+                    if (window.execScript) {
+                       window.execScript(match[2]);
+                    } else {
+                       window.eval(match[2]);
+                    }
+                }
+            }
+            
+            el = DOC.getElementById(id);
+            if (el) {
+                Ext.removeNode(el);
+            }
+            
+            if (typeof callback == 'function') {
+                callback();
+            }
+        });
+        dom.innerHTML = html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig, "");
+        return this;
+    },
+
+    // inherit docs, overridden so we can add removeAnchor
+    removeAllListeners : function() {
+        this.removeAnchor();
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Creates a proxy element of this element
+     * @param {String/Object} config The class name of the proxy element or a DomHelper config object
+     * @param {String/HTMLElement} renderTo (optional) The element or element id to render the proxy to (defaults to document.body)
+     * @param {Boolean} matchBox (optional) True to align and size the proxy to this element now (defaults to false)
+     * @return {Ext.Element} The new proxy element
+     */
+    createProxy : function(config, renderTo, matchBox) {
+        config = (typeof config == 'object') ? config : {tag : "div", cls: config};
+
+        var me = this,
+            proxy = renderTo ? Ext.DomHelper.append(renderTo, config, true) :
+                               Ext.DomHelper.insertBefore(me.dom, config, true);
+
+        if (matchBox && me.setBox && me.getBox) { // check to make sure Element.position.js is loaded
+           proxy.setBox(me.getBox());
+        }
+        return proxy;
+    }
+});
+
+Ext.Element.prototype.getUpdateManager = Ext.Element.prototype.getUpdater;
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Error.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Error.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Error.js	(revision 76)
@@ -0,0 +1,81 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * Framework-wide error-handler.  Developers can override this method to provide
+ * custom exception-handling.  Framework errors will often extend from the base
+ * Ext.Error class.
+ * @param {Object/Error} e The thrown exception object.
+ */
+Ext.handleError = function(e) {
+    throw e;
+};
+
+/**
+ * @class Ext.Error
+ * @extends Error
+ * <p>A base error class. Future implementations are intended to provide more
+ * robust error handling throughout the framework (<b>in the debug build only</b>)
+ * to check for common errors and problems. The messages issued by this class
+ * will aid error checking. Error checks will be automatically removed in the
+ * production build so that performance is not negatively impacted.</p>
+ * <p>Some sample messages currently implemented:</p><pre>
+"DataProxy attempted to execute an API-action but found an undefined
+url / function. Please review your Proxy url/api-configuration."
+ * </pre><pre>
+"Could not locate your "root" property in your server response.
+Please review your JsonReader config to ensure the config-property
+"root" matches the property your server-response.  See the JsonReader
+docs for additional assistance."
+ * </pre>
+ * <p>An example of the code used for generating error messages:</p><pre><code>
+try {
+    generateError({
+        foo: 'bar'
+    });
+}
+catch (e) {
+    console.error(e);
+}
+function generateError(data) {
+    throw new Ext.Error('foo-error', data);
+}
+ * </code></pre>
+ * @param {String} message
+ */
+Ext.Error = function(message) {
+    // Try to read the message from Ext.Error.lang
+    this.message = (this.lang[message]) ? this.lang[message] : message;
+};
+
+Ext.Error.prototype = new Error();
+Ext.apply(Ext.Error.prototype, {
+    // protected.  Extensions place their error-strings here.
+    lang: {},
+
+    name: 'Ext.Error',
+    /**
+     * getName
+     * @return {String}
+     */
+    getName : function() {
+        return this.name;
+    },
+    /**
+     * getMessage
+     * @return {String}
+     */
+    getMessage : function() {
+        return this.message;
+    },
+    /**
+     * toJson
+     * @return {String}
+     */
+    toJson : function() {
+        return Ext.encode(this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElementLite-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElementLite-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/CompositeElementLite-more.js	(revision 76)
@@ -0,0 +1,75 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.CompositeElementLite
+ */
+Ext.apply(Ext.CompositeElementLite.prototype, {
+    addElements : function(els, root){
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }
+        var yels = this.elements;
+        Ext.each(els, function(e) {
+            yels.push(Ext.get(e));
+        });
+        return this;
+    },
+
+    /**
+     * Returns the first Element
+     * @return {Ext.Element}
+     */
+    first : function(){
+        return this.item(0);
+    },
+
+    /**
+     * Returns the last Element
+     * @return {Ext.Element}
+     */
+    last : function(){
+        return this.item(this.getCount()-1);
+    },
+
+    /**
+     * Returns true if this composite contains the passed element
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Boolean
+     */
+    contains : function(el){
+        return this.indexOf(el) != -1;
+    },
+
+    /**
+    * Removes the specified element(s).
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * or an array of any of those.
+    * @param {Boolean} removeDom (optional) True to also remove the element from the document
+    * @return {CompositeElement} this
+    */
+    removeElement : function(keys, removeDom){
+        var me = this,
+            els = this.elements,
+            el;
+        Ext.each(keys, function(val){
+            if ((el = (els[val] || els[val = me.indexOf(val)]))) {
+                if(removeDom){
+                    if(el.dom){
+                        el.remove();
+                    }else{
+                        Ext.removeNode(el);
+                    }
+                }
+                els.splice(val, 1);
+            }
+        });
+        return this;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.traversal-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.traversal-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.traversal-more.js	(revision 76)
@@ -0,0 +1,20 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+     * @param {String} selector The CSS selector
+     * @param {Boolean} unique (optional) True to create a unique Ext.Element for each child (defaults to false, which creates a single shared flyweight object)
+     * @return {CompositeElement/CompositeElementLite} The composite element
+     */
+    select : function(selector, unique){
+        return Ext.Element.select(selector, unique, this.dom);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.position-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.position-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.position-more.js	(revision 76)
@@ -0,0 +1,176 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Sets the element's box. Use getBox() on another element to get a box obj. If animate is true then width, height, x and y will be animated concurrently.
+     * @param {Object} box The box to fill {x, y, width, height}
+     * @param {Boolean} adjust (optional) Whether to adjust for box-model issues automatically
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBox : function(box, adjust, animate){
+        var me = this,
+        	w = box.width, 
+        	h = box.height;
+        if((adjust && !me.autoBoxAdjust) && !me.isBorderBox()){
+           w -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+           h -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+        }
+        me.setBounds(box.x, box.y, w, h, me.animTest.call(me, arguments, animate, 2));
+        return me;
+    },
+
+    /**
+     * Return an object defining the area of this Element which can be passed to {@link #setBox} to
+     * set another Element's size/location to match this element.
+     * @param {Boolean} contentBox (optional) If true a box for the content of the element is returned.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page x/y.
+     * @return {Object} box An object in the format<pre><code>
+{
+    x: &lt;Element's X position>,
+    y: &lt;Element's Y position>,
+    width: &lt;Element's width>,
+    height: &lt;Element's height>,
+    bottom: &lt;Element's lower bound>,
+    right: &lt;Element's rightmost bound>
+}
+</code></pre>
+     * The returned object may also be addressed as an Array where index 0 contains the X position
+     * and index 1 contains the Y position. So the result may also be used for {@link #setXY}
+     */
+	getBox : function(contentBox, local) {	    
+	    var me = this,
+        	xy,
+        	left,
+        	top,
+        	getBorderWidth = me.getBorderWidth,
+        	getPadding = me.getPadding, 
+        	l,
+        	r,
+        	t,
+        	b;
+        if(!local){
+            xy = me.getXY();
+        }else{
+            left = parseInt(me.getStyle("left"), 10) || 0;
+            top = parseInt(me.getStyle("top"), 10) || 0;
+            xy = [left, top];
+        }
+        var el = me.dom, w = el.offsetWidth, h = el.offsetHeight, bx;
+        if(!contentBox){
+            bx = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: w, height: h};
+        }else{
+            l = getBorderWidth.call(me, "l") + getPadding.call(me, "l");
+            r = getBorderWidth.call(me, "r") + getPadding.call(me, "r");
+            t = getBorderWidth.call(me, "t") + getPadding.call(me, "t");
+            b = getBorderWidth.call(me, "b") + getPadding.call(me, "b");
+            bx = {x: xy[0]+l, y: xy[1]+t, 0: xy[0]+l, 1: xy[1]+t, width: w-(l+r), height: h-(t+b)};
+        }
+        bx.right = bx.x + bx.width;
+        bx.bottom = bx.y + bx.height;
+        return bx;
+	},
+	
+    /**
+     * Move this element relative to its current position.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to move the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+     move : function(direction, distance, animate){
+        var me = this,        	
+        	xy = me.getXY(),
+        	x = xy[0],
+        	y = xy[1],        	
+        	left = [x - distance, y],
+        	right = [x + distance, y],
+        	top = [x, y - distance],
+        	bottom = [x, y + distance],
+	       	hash = {
+	        	l :	left,
+	        	left : left,
+	        	r : right,
+	        	right : right,
+	        	t : top,
+	        	top : top,
+	        	up : top,
+	        	b : bottom, 
+	        	bottom : bottom,
+	        	down : bottom	        		
+	        };
+        
+ 	    direction = direction.toLowerCase();    
+ 	    me.moveTo(hash[direction][0], hash[direction][1], me.animTest.call(me, arguments, animate, 2));
+    },
+    
+    /**
+     * Quick set left and top adding default units
+     * @param {String} left The left CSS property value
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+     setLeftTop : function(left, top){
+	    var me = this,
+	    	style = me.dom.style;
+        style.left = me.addUnits(left);
+        style.top = me.addUnits(top);
+        return me;
+    },
+    
+    /**
+     * Returns the region of the given element.
+     * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
+     * @return {Region} A Ext.lib.Region containing "top, left, bottom, right" member data.
+     */
+    getRegion : function(){
+        return Ext.lib.Dom.getRegion(this.dom);
+    },
+    
+    /**
+     * Sets the element's position and size in one shot. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+     * </ul></div>
+     * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * </ul></div>
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBounds : function(x, y, width, height, animate){
+	    var me = this;
+        if (!animate || !me.anim) {
+            me.setSize(width, height);
+            me.setLocation(x, y);
+        } else {
+            me.anim({points: {to: [x, y]}, 
+            		 width: {to: me.adjustWidth(width)}, 
+            		 height: {to: me.adjustHeight(height)}},
+                     me.preanim(arguments, 4), 
+                     'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the element's position and size the specified region. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Ext.lib.Region} region The region to fill
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setRegion : function(region, animate) {
+        return this.setBounds(region.left, region.top, region.right-region.left, region.bottom-region.top, this.animTest.call(this, arguments, animate, 1));
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Ext-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Ext-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Ext-more.js	(revision 76)
@@ -0,0 +1,688 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext
+ */
+
+Ext.ns("Ext.grid", "Ext.list", "Ext.dd", "Ext.tree", "Ext.form", "Ext.menu",
+       "Ext.state", "Ext.layout.boxOverflow", "Ext.app", "Ext.ux", "Ext.chart", "Ext.direct", "Ext.slider");
+    /**
+     * Namespace alloted for extensions to the framework.
+     * @property ux
+     * @type Object
+     */
+
+Ext.apply(Ext, function(){
+    var E = Ext,
+        idSeed = 0,
+        scrollWidth = null;
+
+    return {
+        /**
+        * A reusable empty function
+        * @property
+        * @type Function
+        */
+        emptyFn : function(){},
+
+        /**
+         * URL to a 1x1 transparent gif image used by Ext to create inline icons with CSS background images.
+         * In older versions of IE, this defaults to "http://extjs.com/s.gif" and you should change this to a URL on your server.
+         * For other browsers it uses an inline data URL.
+         * @type String
+         */
+        BLANK_IMAGE_URL : Ext.isIE6 || Ext.isIE7 || Ext.isAir ?
+                            'http:/' + '/www.extjs.com/s.gif' :
+                            'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
+
+        extendX : function(supr, fn){
+            return Ext.extend(supr, fn(supr.prototype));
+        },
+
+        /**
+         * Returns the current HTML document object as an {@link Ext.Element}.
+         * @return Ext.Element The document
+         */
+        getDoc : function(){
+            return Ext.get(document);
+        },
+
+        /**
+         * Utility method for validating that a value is numeric, returning the specified default value if it is not.
+         * @param {Mixed} value Should be a number, but any type will be handled appropriately
+         * @param {Number} defaultValue The value to return if the original value is non-numeric
+         * @return {Number} Value, if numeric, else defaultValue
+         */
+        num : function(v, defaultValue){
+            v = Number(Ext.isEmpty(v) || Ext.isArray(v) || typeof v == 'boolean' || (typeof v == 'string' && v.trim().length == 0) ? NaN : v);
+            return isNaN(v) ? defaultValue : v;
+        },
+
+        /**
+         * <p>Utility method for returning a default value if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Mixed} defaultValue The value to return if the original value is empty
+         * @param {Boolean} allowBlank (optional) true to allow zero length strings to qualify as non-empty (defaults to false)
+         * @return {Mixed} value, if non-empty, else defaultValue
+         */
+        value : function(v, defaultValue, allowBlank){
+            return Ext.isEmpty(v, allowBlank) ? defaultValue : v;
+        },
+
+        /**
+         * Escapes the passed string for use in a regular expression
+         * @param {String} str
+         * @return {String}
+         */
+        escapeRe : function(s) {
+            return s.replace(/([-.*+?^${}()|[\]\/\\])/g, "\\$1");
+        },
+
+        sequence : function(o, name, fn, scope){
+            o[name] = o[name].createSequence(fn, scope);
+        },
+
+        /**
+         * Applies event listeners to elements by selectors when the document is ready.
+         * The event name is specified with an <tt>&#64;</tt> suffix.
+         * <pre><code>
+Ext.addBehaviors({
+    // add a listener for click on all anchors in element with id foo
+    '#foo a&#64;click' : function(e, t){
+        // do something
+    },
+
+    // add the same listener to multiple selectors (separated by comma BEFORE the &#64;)
+    '#foo a, #bar span.some-class&#64;mouseover' : function(){
+        // do something
+    }
+});
+         * </code></pre>
+         * @param {Object} obj The list of behaviors to apply
+         */
+        addBehaviors : function(o){
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.addBehaviors(o);
+                });
+            } else {
+                var cache = {}, // simple cache for applying multiple behaviors to same selector does query multiple times
+                    parts,
+                    b,
+                    s;
+                for (b in o) {
+                    if ((parts = b.split('@'))[1]) { // for Object prototype breakers
+                        s = parts[0];
+                        if(!cache[s]){
+                            cache[s] = Ext.select(s);
+                        }
+                        cache[s].on(parts[1], o[b]);
+                    }
+                }
+                cache = null;
+            }
+        },
+
+        /**
+         * Utility method for getting the width of the browser scrollbar. This can differ depending on
+         * operating system settings, such as the theme or font size.
+         * @param {Boolean} force (optional) true to force a recalculation of the value.
+         * @return {Number} The width of the scrollbar.
+         */
+        getScrollBarWidth: function(force){
+            if(!Ext.isReady){
+                return 0;
+            }
+
+            if(force === true || scrollWidth === null){
+                    // Append our div, do our calculation and then remove it
+                var div = Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),
+                    child = div.child('div', true);
+                var w1 = child.offsetWidth;
+                div.setStyle('overflow', (Ext.isWebKit || Ext.isGecko) ? 'auto' : 'scroll');
+                var w2 = child.offsetWidth;
+                div.remove();
+                // Need to add 2 to ensure we leave enough space
+                scrollWidth = w1 - w2 + 2;
+            }
+            return scrollWidth;
+        },
+
+
+        // deprecated
+        combine : function(){
+            var as = arguments, l = as.length, r = [];
+            for(var i = 0; i < l; i++){
+                var a = as[i];
+                if(Ext.isArray(a)){
+                    r = r.concat(a);
+                }else if(a.length !== undefined && !a.substr){
+                    r = r.concat(Array.prototype.slice.call(a, 0));
+                }else{
+                    r.push(a);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Copies a set of named properties fom the source object to the destination object.
+         * <p>example:<pre><code>
+ImageComponent = Ext.extend(Ext.BoxComponent, {
+    initComponent: function() {
+        this.autoEl = { tag: 'img' };
+        MyComponent.superclass.initComponent.apply(this, arguments);
+        this.initialBox = Ext.copyTo({}, this.initialConfig, 'x,y,width,height');
+    }
+});
+         * </code></pre>
+         * @param {Object} dest The destination object.
+         * @param {Object} source The source object.
+         * @param {Array/String} names Either an Array of property names, or a comma-delimited list
+         * of property names to copy.
+         * @return {Object} The modified object.
+        */
+        copyTo : function(dest, source, names){
+            if(typeof names == 'string'){
+                names = names.split(/[,;\s]/);
+            }
+            Ext.each(names, function(name){
+                if(source.hasOwnProperty(name)){
+                    dest[name] = source[name];
+                }
+            }, this);
+            return dest;
+        },
+
+        /**
+         * Attempts to destroy any objects passed to it by removing all event listeners, removing them from the
+         * DOM (if applicable) and calling their destroy functions (if available).  This method is primarily
+         * intended for arguments of type {@link Ext.Element} and {@link Ext.Component}, but any subclass of
+         * {@link Ext.util.Observable} can be passed in.  Any number of elements and/or components can be
+         * passed into this function in a single call as separate arguments.
+         * @param {Mixed} arg1 An {@link Ext.Element}, {@link Ext.Component}, or an Array of either of these to destroy
+         * @param {Mixed} arg2 (optional)
+         * @param {Mixed} etc... (optional)
+         */
+        destroy : function(){
+            Ext.each(arguments, function(arg){
+                if(arg){
+                    if(Ext.isArray(arg)){
+                        this.destroy.apply(this, arg);
+                    }else if(typeof arg.destroy == 'function'){
+                        arg.destroy();
+                    }else if(arg.dom){
+                        arg.remove();
+                    }
+                }
+            }, this);
+        },
+
+        /**
+         * Attempts to destroy and then remove a set of named properties of the passed object.
+         * @param {Object} o The object (most likely a Component) who's properties you wish to destroy.
+         * @param {Mixed} arg1 The name of the property to destroy and remove from the object.
+         * @param {Mixed} etc... More property names to destroy and remove.
+         */
+        destroyMembers : function(o, arg1, arg2, etc){
+            for(var i = 1, a = arguments, len = a.length; i < len; i++) {
+                Ext.destroy(o[a[i]]);
+                delete o[a[i]];
+            }
+        },
+
+        /**
+         * Creates a copy of the passed Array with falsy values removed.
+         * @param {Array/NodeList} arr The Array from which to remove falsy values.
+         * @return {Array} The new, compressed Array.
+         */
+        clean : function(arr){
+            var ret = [];
+            Ext.each(arr, function(v){
+                if(!!v){
+                    ret.push(v);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Creates a copy of the passed Array, filtered to contain only unique values.
+         * @param {Array} arr The Array to filter
+         * @return {Array} The new Array containing unique values.
+         */
+        unique : function(arr){
+            var ret = [],
+                collect = {};
+
+            Ext.each(arr, function(v) {
+                if(!collect[v]){
+                    ret.push(v);
+                }
+                collect[v] = true;
+            });
+            return ret;
+        },
+
+        /**
+         * Recursively flattens into 1-d Array. Injects Arrays inline.
+         * @param {Array} arr The array to flatten
+         * @return {Array} The new, flattened array.
+         */
+        flatten : function(arr){
+            var worker = [];
+            function rFlatten(a) {
+                Ext.each(a, function(v) {
+                    if(Ext.isArray(v)){
+                        rFlatten(v);
+                    }else{
+                        worker.push(v);
+                    }
+                });
+                return worker;
+            }
+            return rFlatten(arr);
+        },
+
+        /**
+         * Returns the minimum value in the Array.
+         * @param {Array|NodeList} arr The Array from which to select the minimum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines minimization.
+         *                   If omitted the "<" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The minimum value in the Array.
+         */
+        min : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a < b ? -1 : 1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == -1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Returns the maximum value in the Array
+         * @param {Array|NodeList} arr The Array from which to select the maximum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines maximization.
+         *                   If omitted the ">" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The maximum value in the Array.
+         */
+        max : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a > b ? 1 : -1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == 1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Calculates the mean of the Array
+         * @param {Array} arr The Array to calculate the mean value of.
+         * @return {Number} The mean.
+         */
+        mean : function(arr){
+           return arr.length > 0 ? Ext.sum(arr) / arr.length : undefined;
+        },
+
+        /**
+         * Calculates the sum of the Array
+         * @param {Array} arr The Array to calculate the sum value of.
+         * @return {Number} The sum.
+         */
+        sum : function(arr){
+           var ret = 0;
+           Ext.each(arr, function(v) {
+               ret += v;
+           });
+           return ret;
+        },
+
+        /**
+         * Partitions the set into two sets: a true set and a false set.
+         * Example:
+         * Example2:
+         * <pre><code>
+// Example 1:
+Ext.partition([true, false, true, true, false]); // [[true, true, true], [false, false]]
+
+// Example 2:
+Ext.partition(
+    Ext.query("p"),
+    function(val){
+        return val.className == "class1"
+    }
+);
+// true are those paragraph elements with a className of "class1",
+// false set are those that do not have that className.
+         * </code></pre>
+         * @param {Array|NodeList} arr The array to partition
+         * @param {Function} truth (optional) a function to determine truth.  If this is omitted the element
+         *                   itself must be able to be evaluated for its truthfulness.
+         * @return {Array} [true<Array>,false<Array>]
+         */
+        partition : function(arr, truth){
+            var ret = [[],[]];
+            Ext.each(arr, function(v, i, a) {
+                ret[ (truth && truth(v, i, a)) || (!truth && v) ? 0 : 1].push(v);
+            });
+            return ret;
+        },
+
+        /**
+         * Invokes a method on each item in an Array.
+         * <pre><code>
+// Example:
+Ext.invoke(Ext.query("p"), "getAttribute", "id");
+// [el1.getAttribute("id"), el2.getAttribute("id"), ..., elN.getAttribute("id")]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to invoke the method on.
+         * @param {String} methodName The method name to invoke.
+         * @param {...*} args Arguments to send into the method invocation.
+         * @return {Array} The results of invoking the method on each item in the array.
+         */
+        invoke : function(arr, methodName){
+            var ret = [],
+                args = Array.prototype.slice.call(arguments, 2);
+            Ext.each(arr, function(v,i) {
+                if (v && typeof v[methodName] == 'function') {
+                    ret.push(v[methodName].apply(v, args));
+                } else {
+                    ret.push(undefined);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Plucks the value of a property from each item in the Array
+         * <pre><code>
+// Example:
+Ext.pluck(Ext.query("p"), "className"); // [el1.className, el2.className, ..., elN.className]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to pluck the value from.
+         * @param {String} prop The property name to pluck from each element.
+         * @return {Array} The value from each item in the Array.
+         */
+        pluck : function(arr, prop){
+            var ret = [];
+            Ext.each(arr, function(v) {
+                ret.push( v[prop] );
+            });
+            return ret;
+        },
+
+        /**
+         * <p>Zips N sets together.</p>
+         * <pre><code>
+// Example 1:
+Ext.zip([1,2,3],[4,5,6]); // [[1,4],[2,5],[3,6]]
+// Example 2:
+Ext.zip(
+    [ "+", "-", "+"],
+    [  12,  10,  22],
+    [  43,  15,  96],
+    function(a, b, c){
+        return "$" + a + "" + b + "." + c
+    }
+); // ["$+12.43", "$-10.15", "$+22.96"]
+         * </code></pre>
+         * @param {Arrays|NodeLists} arr This argument may be repeated. Array(s) to contribute values.
+         * @param {Function} zipper (optional) The last item in the argument list. This will drive how the items are zipped together.
+         * @return {Array} The zipped set.
+         */
+        zip : function(){
+            var parts = Ext.partition(arguments, function( val ){ return typeof val != 'function'; }),
+                arrs = parts[0],
+                fn = parts[1][0],
+                len = Ext.max(Ext.pluck(arrs, "length")),
+                ret = [];
+
+            for (var i = 0; i < len; i++) {
+                ret[i] = [];
+                if(fn){
+                    ret[i] = fn.apply(fn, Ext.pluck(arrs, i));
+                }else{
+                    for (var j = 0, aLen = arrs.length; j < aLen; j++){
+                        ret[i].push( arrs[j][i] );
+                    }
+                }
+            }
+            return ret;
+        },
+
+        /**
+         * This is shorthand reference to {@link Ext.ComponentMgr#get}.
+         * Looks up an existing {@link Ext.Component Component} by {@link Ext.Component#id id}
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <tt>undefined</tt> if not found, or <tt>null</tt> if a
+         * Class was found.
+        */
+        getCmp : function(id){
+            return Ext.ComponentMgr.get(id);
+        },
+
+        /**
+         * By default, Ext intelligently decides whether floating elements should be shimmed. If you are using flash,
+         * you may want to set this to true.
+         * @type Boolean
+         */
+        useShims: E.isIE6 || (E.isMac && E.isGecko2),
+
+        // inpired by a similar function in mootools library
+        /**
+         * Returns the type of object that is passed in. If the object passed in is null or undefined it
+         * return false otherwise it returns one of the following values:<div class="mdetail-params"><ul>
+         * <li><b>string</b>: If the object passed is a string</li>
+         * <li><b>number</b>: If the object passed is a number</li>
+         * <li><b>boolean</b>: If the object passed is a boolean value</li>
+         * <li><b>date</b>: If the object passed is a Date object</li>
+         * <li><b>function</b>: If the object passed is a function reference</li>
+         * <li><b>object</b>: If the object passed is an object</li>
+         * <li><b>array</b>: If the object passed is an array</li>
+         * <li><b>regexp</b>: If the object passed is a regular expression</li>
+         * <li><b>element</b>: If the object passed is a DOM Element</li>
+         * <li><b>nodelist</b>: If the object passed is a DOM NodeList</li>
+         * <li><b>textnode</b>: If the object passed is a DOM text node and contains something other than whitespace</li>
+         * <li><b>whitespace</b>: If the object passed is a DOM text node and contains only whitespace</li>
+         * </ul></div>
+         * @param {Mixed} object
+         * @return {String}
+         */
+        type : function(o){
+            if(o === undefined || o === null){
+                return false;
+            }
+            if(o.htmlElement){
+                return 'element';
+            }
+            var t = typeof o;
+            if(t == 'object' && o.nodeName) {
+                switch(o.nodeType) {
+                    case 1: return 'element';
+                    case 3: return (/\S/).test(o.nodeValue) ? 'textnode' : 'whitespace';
+                }
+            }
+            if(t == 'object' || t == 'function') {
+                switch(o.constructor) {
+                    case Array: return 'array';
+                    case RegExp: return 'regexp';
+                    case Date: return 'date';
+                }
+                if(typeof o.length == 'number' && typeof o.item == 'function') {
+                    return 'nodelist';
+                }
+            }
+            return t;
+        },
+
+        intercept : function(o, name, fn, scope){
+            o[name] = o[name].createInterceptor(fn, scope);
+        },
+
+        // internal
+        callback : function(cb, scope, args, delay){
+            if(typeof cb == 'function'){
+                if(delay){
+                    cb.defer(delay, scope, args || []);
+                }else{
+                    cb.apply(scope, args || []);
+                }
+            }
+        }
+    };
+}());
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = sayHi.createSequence(function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+</code></pre>
+     * @param {Function} fcn The function to sequence
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createSequence : function(fcn, scope){
+        var method = this;
+        return (typeof fcn != 'function') ?
+                this :
+                function(){
+                    var retval = method.apply(this || window, arguments);
+                    fcn.apply(scope || this || window, arguments);
+                    return retval;
+                };
+    }
+});
+
+
+/**
+ * @class String
+ * These functions are available as static methods on the JavaScript String object.
+ */
+Ext.applyIf(String, {
+
+    /**
+     * Escapes the passed string for ' and \
+     * @param {String} string The string to escape
+     * @return {String} The escaped string
+     * @static
+     */
+    escape : function(string) {
+        return string.replace(/('|\\)/g, "\\$1");
+    },
+
+    /**
+     * Pads the left side of a string with a specified character.  This is especially useful
+     * for normalizing number and date strings.  Example usage:
+     * <pre><code>
+var s = String.leftPad('123', 5, '0');
+// s now contains the string: '00123'
+     * </code></pre>
+     * @param {String} string The original string
+     * @param {Number} size The total length of the output string
+     * @param {String} char (optional) The character with which to pad the original string (defaults to empty string " ")
+     * @return {String} The padded string
+     * @static
+     */
+    leftPad : function (val, size, ch) {
+        var result = String(val);
+        if(!ch) {
+            ch = " ";
+        }
+        while (result.length < size) {
+            result = ch + result;
+        }
+        return result;
+    }
+});
+
+/**
+ * Utility function that allows you to easily switch a string between two alternating values.  The passed value
+ * is compared to the current string, and if they are equal, the other value that was passed in is returned.  If
+ * they are already different, the first value passed in is returned.  Note that this method returns the new value
+ * but does not change the current string.
+ * <pre><code>
+// alternate sort directions
+sort = sort.toggle('ASC', 'DESC');
+
+// instead of conditional logic:
+sort = (sort == 'ASC' ? 'DESC' : 'ASC');
+</code></pre>
+ * @param {String} value The value to compare to the current string
+ * @param {String} other The new value to use if the string already equals the first value passed in
+ * @return {String} The new value
+ */
+String.prototype.toggle = function(value, other){
+    return this == value ? other : value;
+};
+
+/**
+ * Trims whitespace from either end of a string, leaving spaces within the string intact.  Example:
+ * <pre><code>
+var s = '  foo bar  ';
+alert('-' + s + '-');         //alerts "- foo bar -"
+alert('-' + s.trim() + '-');  //alerts "-foo bar-"
+</code></pre>
+ * @return {String} The trimmed string
+ */
+String.prototype.trim = function(){
+    var re = /^\s+|\s+$/g;
+    return function(){ return this.replace(re, ""); };
+}();
+
+// here to prevent dependency on Date.js
+/**
+ Returns the number of milliseconds between this date and date
+ @param {Date} date (optional) Defaults to now
+ @return {Number} The diff in milliseconds
+ @member Date getElapsed
+ */
+Date.prototype.getElapsed = function(date) {
+    return Math.abs((date || new Date()).getTime()-this.getTime());
+};
+
+
+/**
+ * @class Number
+ */
+Ext.applyIf(Number.prototype, {
+    /**
+     * Checks whether or not the current number is within a desired range.  If the number is already within the
+     * range it is returned, otherwise the min or max value is returned depending on which side of the range is
+     * exceeded.  Note that this method returns the constrained value but does not change the current number.
+     * @param {Number} min The minimum number in the range
+     * @param {Number} max The maximum number in the range
+     * @return {Number} The constrained value if outside the range, otherwise the current value
+     */
+    constrain : function(min, max){
+        return Math.min(Math.max(this, min), max);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.insertion-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.insertion-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.insertion-more.js	(revision 76)
@@ -0,0 +1,57 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.apply(Ext.Element.prototype, function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {	
+		/**
+	     * Inserts (or creates) the passed element (or DomHelper config) as a sibling of this element
+	     * @param {Mixed/Object/Array} el The id, element to insert or a DomHelper config to create and insert *or* an array of any of those.
+	     * @param {String} where (optional) 'before' or 'after' defaults to before
+	     * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+	     * @return {Ext.Element} The inserted Element. If an array is passed, the last inserted element is returned.
+	     */
+	    insertSibling: function(el, where, returnDom){
+	        var me = this,
+	        	rt,
+                isAfter = (where || 'before').toLowerCase() == 'after',
+                insertEl;
+	        	
+	        if(Ext.isArray(el)){
+                insertEl = me;
+	            Ext.each(el, function(e) {
+		            rt = Ext.fly(insertEl, '_internal').insertSibling(e, where, returnDom);
+                    if(isAfter){
+                        insertEl = rt;
+                    }
+	            });
+	            return rt;
+	        }
+	                
+	        el = el || {};
+	       	
+            if(el.nodeType || el.dom){
+                rt = me.dom.parentNode.insertBefore(GETDOM(el), isAfter ? me.dom.nextSibling : me.dom);
+                if (!returnDom) {
+                    rt = GET(rt);
+                }
+            }else{
+                if (isAfter && !me.dom.nextSibling) {
+                    rt = DH.append(me.dom.parentNode, el, !returnDom);
+                } else {                    
+                    rt = DH[isAfter ? 'insertAfter' : 'insertBefore'](me.dom, el, !returnDom);
+                }
+            }
+	        return rt;
+	    }
+    };
+}());
Index: /trunk/workshop-routing-foss4g/web/ext/src/core/Element.keys.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/core/Element.keys.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/core/Element.keys.js	(revision 76)
@@ -0,0 +1,52 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Convenience method for constructing a KeyMap
+     * @param {Number/Array/Object/String} key Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:
+     * <code>{key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}</code>
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the specified function is executed. Defaults to this Element.
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyListener : function(key, fn, scope){
+        var config;
+        if(typeof key != 'object' || Ext.isArray(key)){
+            config = {
+                key: key,
+                fn: fn,
+                scope: scope
+            };
+        }else{
+            config = {
+                key : key.key,
+                shift : key.shift,
+                ctrl : key.ctrl,
+                alt : key.alt,
+                fn: fn,
+                scope: scope
+            };
+        }
+        return new Ext.KeyMap(this, config);
+    },
+
+    /**
+     * Creates a KeyMap for this element
+     * @param {Object} config The KeyMap config. See {@link Ext.KeyMap} for more details
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyMap : function(config){
+        return new Ext.KeyMap(this, config);
+    }
+});
+
+//Import the newly-added Ext.Element functions into CompositeElementLite. We call this here because
+//Element.keys.js is the last extra Ext.Element include in the ext-all.js build
+Ext.CompositeElementLite.importElementMethods();
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Types.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Types.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Types.js	(revision 76)
@@ -0,0 +1,187 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Types
+ * <p>This is s static class containing the system-supplied data types which may be given to a {@link Ext.data.Field Field}.<p/>
+ * <p>The properties in this class are used as type indicators in the {@link Ext.data.Field Field} class, so to
+ * test whether a Field is of a certain type, compare the {@link Ext.data.Field#type type} property against properties
+ * of this class.</p>
+ * <p>Developers may add their own application-specific data types to this class. Definition names must be UPPERCASE.
+ * each type definition must contain three properties:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>convert</code> : <i>Function</i><div class="sub-desc">A function to convert raw data values from a data block into the data
+ * to be stored in the Field. The function is passed the collowing parameters:
+ * <div class="mdetail-params"><ul>
+ * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+ * the configured <tt>{@link Ext.data.Field#defaultValue defaultValue}</tt>.</div></li>
+ * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+ * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+ * ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+ * </ul></div></div></li>
+ * <li><code>sortType</code> : <i>Function</i> <div class="sub-desc">A function to convert the stored data into comparable form, as defined by {@link Ext.data.SortTypes}.</div></li>
+ * <li><code>type</code> : <i>String</i> <div class="sub-desc">A textual data type name.</div></li>
+ * </ul></div>
+ * <p>For example, to create a VELatLong field (See the Microsoft Bing Mapping API) containing the latitude/longitude value of a datapoint on a map from a JsonReader data block
+ * which contained the properties <code>lat</code> and <code>long</code>, you would define a new data type like this:</p>
+ *<pre><code>
+// Add a new Field data type which stores a VELatLong object in the Record.
+Ext.data.Types.VELATLONG = {
+    convert: function(v, data) {
+        return new VELatLong(data.lat, data.long);
+    },
+    sortType: function(v) {
+        return v.Latitude;  // When sorting, order by latitude
+    },
+    type: 'VELatLong'
+};
+</code></pre>
+ * <p>Then, when declaring a Record, use <pre><code>
+var types = Ext.data.Types; // allow shorthand type access
+UnitRecord = Ext.data.Record.create([
+    { name: 'unitName', mapping: 'UnitName' },
+    { name: 'curSpeed', mapping: 'CurSpeed', type: types.INT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'position', type: types.VELATLONG }
+]);
+</code></pre>
+ * @singleton
+ */
+Ext.data.Types = new function(){
+    var st = Ext.data.SortTypes;
+    Ext.apply(this, {
+        /**
+         * @type Regexp
+         * @property stripRe
+         * A regular expression for stripping non-numeric characters from a numeric value. Defaults to <tt>/[\$,%]/g</tt>.
+         * This should be overridden for localization.
+         */
+        stripRe: /[\$,%]/g,
+        
+        /**
+         * @type Object.
+         * @property AUTO
+         * This data type means that no conversion is applied to the raw data before it is placed into a Record.
+         */
+        AUTO: {
+            convert: function(v){ return v; },
+            sortType: st.none,
+            type: 'auto'
+        },
+
+        /**
+         * @type Object.
+         * @property STRING
+         * This data type means that the raw data is converted into a String before it is placed into a Record.
+         */
+        STRING: {
+            convert: function(v){ return (v === undefined || v === null) ? '' : String(v); },
+            sortType: st.asUCString,
+            type: 'string'
+        },
+
+        /**
+         * @type Object.
+         * @property INT
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INTEGER</code> is equivalent.</p>
+         */
+        INT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseInt(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'int'
+        },
+        
+        /**
+         * @type Object.
+         * @property FLOAT
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>NUMBER</code> is equivalent.</p>
+         */
+        FLOAT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseFloat(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'float'
+        },
+        
+        /**
+         * @type Object.
+         * @property BOOL
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOLEAN</code> is equivalent.</p>
+         */
+        BOOL: {
+            convert: function(v){ return v === true || v === 'true' || v == 1; },
+            sortType: st.none,
+            type: 'bool'
+        },
+        
+        /**
+         * @type Object.
+         * @property DATE
+         * This data type means that the raw data is converted into a Date before it is placed into a Record.
+         * The date format is specified in the constructor of the {@link Ext.data.Field} to which this type is
+         * being applied.
+         */
+        DATE: {
+            convert: function(v){
+                var df = this.dateFormat;
+                if(!v){
+                    return null;
+                }
+                if(Ext.isDate(v)){
+                    return v;
+                }
+                if(df){
+                    if(df == 'timestamp'){
+                        return new Date(v*1000);
+                    }
+                    if(df == 'time'){
+                        return new Date(parseInt(v, 10));
+                    }
+                    return Date.parseDate(v, df);
+                }
+                var parsed = Date.parse(v);
+                return parsed ? new Date(parsed) : null;
+            },
+            sortType: st.asDate,
+            type: 'date'
+        }
+    });
+    
+    Ext.apply(this, {
+        /**
+         * @type Object.
+         * @property BOOLEAN
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOL</code> is equivalent.</p>
+         */
+        BOOLEAN: this.BOOL,
+        /**
+         * @type Object.
+         * @property INTEGER
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INT</code> is equivalent.</p>
+         */
+        INTEGER: this.INT,
+        /**
+         * @type Object.
+         * @property NUMBER
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>FLOAT</code> is equivalent.</p>
+         */
+        NUMBER: this.FLOAT    
+    });
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DataWriter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DataWriter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DataWriter.js	(revision 76)
@@ -0,0 +1,210 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DataWriter
+ * <p>Ext.data.DataWriter facilitates create, update, and destroy actions between
+ * an Ext.data.Store and a server-side framework. A Writer enabled Store will
+ * automatically manage the Ajax requests to perform CRUD actions on a Store.</p>
+ * <p>Ext.data.DataWriter is an abstract base class which is intended to be extended
+ * and should not be created directly. For existing implementations, see
+ * {@link Ext.data.JsonWriter}.</p>
+ * <p>Creating a writer is simple:</p>
+ * <pre><code>
+var writer = new Ext.data.JsonWriter({
+    encode: false   // &lt;--- false causes data to be printed to jsonData config-property of Ext.Ajax#reqeust
+});
+ * </code></pre>
+ * * <p>Same old JsonReader as Ext-2.x:</p>
+ * <pre><code>
+var reader = new Ext.data.JsonReader({idProperty: 'id'}, [{name: 'first'}, {name: 'last'}, {name: 'email'}]);
+ * </code></pre>
+ *
+ * <p>The proxy for a writer enabled store can be configured with a simple <code>url</code>:</p>
+ * <pre><code>
+// Create a standard HttpProxy instance.
+var proxy = new Ext.data.HttpProxy({
+    url: 'app.php/users'    // &lt;--- Supports "provides"-type urls, such as '/users.json', '/products.xml' (Hello Rails/Merb)
+});
+ * </code></pre>
+ * <p>For finer grained control, the proxy may also be configured with an <code>API</code>:</p>
+ * <pre><code>
+// Maximum flexibility with the API-configuration
+var proxy = new Ext.data.HttpProxy({
+    api: {
+        read    : 'app.php/users/read',
+        create  : 'app.php/users/create',
+        update  : 'app.php/users/update',
+        destroy : {  // &lt;--- Supports object-syntax as well
+            url: 'app.php/users/destroy',
+            method: "DELETE"
+        }
+    }
+});
+ * </code></pre>
+ * <p>Pulling it all together into a Writer-enabled Store:</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: true  // -- Cell-level updates.
+});
+ * </code></pre>
+ * <p>Initiating write-actions <b>automatically</b>, using the existing Ext2.0 Store/Record API:</p>
+ * <pre><code>
+var rec = store.getAt(0);
+rec.set('email', 'foo@bar.com');  // &lt;--- Immediately initiates an UPDATE action through configured proxy.
+
+store.remove(rec);  // &lt;---- Immediately initiates a DESTROY action through configured proxy.
+ * </code></pre>
+ * <p>For <b>record/batch</b> updates, use the Store-configuration {@link Ext.data.Store#autoSave autoSave:false}</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: false  // -- disable cell-updates
+});
+
+var urec = store.getAt(0);
+urec.set('email', 'foo@bar.com');
+
+var drec = store.getAt(1);
+store.remove(drec);
+
+// Push the button!
+store.save();
+ * </code></pre>
+ * @constructor Create a new DataWriter
+ * @param {Object} meta Metadata configuration options (implementation-specific)
+ * @param {Object} recordType Either an Array of field definition objects as specified
+ * in {@link Ext.data.Record#create}, or an {@link Ext.data.Record} object created
+ * using {@link Ext.data.Record#create}.
+ */
+Ext.data.DataWriter = function(config){
+    Ext.apply(this, config);
+};
+Ext.data.DataWriter.prototype = {
+
+    /**
+     * @cfg {Boolean} writeAllFields
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have DataWriter return ALL fields of a modified
+     * record -- not just those that changed.
+     * <tt>false</tt> to have DataWriter only request modified fields from a record.
+     */
+    writeAllFields : false,
+    /**
+     * @cfg {Boolean} listful
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have the DataWriter <b>always</b> write HTTP params as a list,
+     * even when acting upon a single record.
+     */
+    listful : false,    // <-- listful is actually not used internally here in DataWriter.  @see Ext.data.Store#execute.
+
+    /**
+     * Compiles a Store recordset into a data-format defined by an extension such as {@link Ext.data.JsonWriter} or {@link Ext.data.XmlWriter} in preparation for a {@link Ext.data.Api#actions server-write action}.  The first two params are similar similar in nature to {@link Ext#apply},
+     * Where the first parameter is the <i>receiver</i> of paramaters and the second, baseParams, <i>the source</i>.
+     * @param {Object} params The request-params receiver.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {String} action [{@link Ext.data.Api#actions create|update|destroy}]
+     * @param {Record/Record[]} rs The recordset to write, the subject(s) of the write action.
+     */
+    apply : function(params, baseParams, action, rs) {
+        var data    = [],
+        renderer    = action + 'Record';
+        // TODO implement @cfg listful here
+        if (Ext.isArray(rs)) {
+            Ext.each(rs, function(rec){
+                data.push(this[renderer](rec));
+            }, this);
+        }
+        else if (rs instanceof Ext.data.Record) {
+            data = this[renderer](rs);
+        }
+        this.render(params, baseParams, data);
+    },
+
+    /**
+     * abstract method meant to be overridden by all DataWriter extensions.  It's the extension's job to apply the "data" to the "params".
+     * The data-object provided to render is populated with data according to the meta-info defined in the user's DataReader config,
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Record[]} rs Store recordset
+     * @param {Object} params Http params to be sent to server.
+     * @param {Object} data object populated according to DataReader meta-data.
+     */
+    render : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} updateRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#updateRecord JsonWriter.updateRecord}
+     */
+    updateRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} createRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#createRecord JsonWriter.createRecord})
+     */
+    createRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} destroyRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#destroyRecord JsonWriter.destroyRecord})
+     */
+    destroyRecord : Ext.emptyFn,
+
+    /**
+     * Converts a Record to a hash, taking into account the state of the Ext.data.Record along with configuration properties
+     * related to its rendering, such as {@link #writeAllFields}, {@link Ext.data.Record#phantom phantom}, {@link Ext.data.Record#getChanges getChanges} and
+     * {@link Ext.data.DataReader#idProperty idProperty}
+     * @param {Ext.data.Record} rec The Record from which to create a hash.
+     * @param {Object} config <b>NOT YET IMPLEMENTED</b>.  Will implement an exlude/only configuration for fine-control over which fields do/don't get rendered.
+     * @return {Object}
+     * @protected
+     * TODO Implement excludes/only configuration with 2nd param?
+     */
+    toHash : function(rec, config) {
+        var map = rec.fields.map,
+            data = {},
+            raw = (this.writeAllFields === false && rec.phantom === false) ? rec.getChanges() : rec.data,
+            m;
+        Ext.iterate(raw, function(prop, value){
+            if((m = map[prop])){
+                data[m.mapping ? m.mapping : m.name] = value;
+            }
+        });
+        // we don't want to write Ext auto-generated id to hash.  Careful not to remove it on Models not having auto-increment pk though.
+        // We can tell its not auto-increment if the user defined a DataReader field for it *and* that field's value is non-empty.
+        // we could also do a RegExp here for the Ext.data.Record AUTO_ID prefix.
+        if (rec.phantom) {
+            if (rec.fields.containsKey(this.meta.idProperty) && Ext.isEmpty(rec.data[this.meta.idProperty])) {
+                delete data[this.meta.idProperty];
+            }
+        } else {
+            data[this.meta.idProperty] = rec.id;
+        }
+        return data;
+    },
+
+    /**
+     * Converts a {@link Ext.data.DataWriter#toHash Hashed} {@link Ext.data.Record} to fields-array array suitable
+     * for encoding to xml via XTemplate, eg:
+<code><pre>&lt;tpl for=".">&lt;{name}>{value}&lt;/{name}&lt;/tpl></pre></code>
+     * eg, <b>non-phantom</b>:
+<code><pre>{id: 1, first: 'foo', last: 'bar'} --> [{name: 'id', value: 1}, {name: 'first', value: 'foo'}, {name: 'last', value: 'bar'}]</pre></code>
+     * {@link Ext.data.Record#phantom Phantom} records will have had their idProperty omitted in {@link #toHash} if determined to be auto-generated.
+     * Non AUTOINCREMENT pks should have been protected.
+     * @param {Hash} data Hashed by Ext.data.DataWriter#toHash
+     * @return {[Object]} Array of attribute-objects.
+     * @protected
+     */
+    toArray : function(data) {
+        var fields = [];
+        Ext.iterate(data, function(k, v) {fields.push({name: k, value: v});},this);
+        return fields;
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/JsonWriter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/JsonWriter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/JsonWriter.js	(revision 76)
@@ -0,0 +1,96 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.JsonWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action.
+ */
+Ext.data.JsonWriter = Ext.extend(Ext.data.DataWriter, {
+    /**
+     * @cfg {Boolean} encode <p><tt>true</tt> to {@link Ext.util.JSON#encode JSON encode} the
+     * {@link Ext.data.DataWriter#toHash hashed data} into a standard HTTP parameter named after this
+     * Reader's <code>meta.root</code> property which, by default is imported from the associated Reader. Defaults to <tt>true</tt>.</p>
+     * <p>If set to <code>false</code>, the hashed data is {@link Ext.util.JSON#encode JSON encoded}, along with
+     * the associated {@link Ext.data.Store}'s {@link Ext.data.Store#baseParams baseParams}, into the POST body.</p>
+     * <p>When using {@link Ext.data.DirectProxy}, set this to <tt>false</tt> since Ext.Direct.JsonProvider will perform
+     * its own json-encoding.  In addition, if you're using {@link Ext.data.HttpProxy}, setting to <tt>false</tt>
+     * will cause HttpProxy to transmit data using the <b>jsonData</b> configuration-params of {@link Ext.Ajax#request}
+     * instead of <b>params</b>.</p>
+     * <p>When using a {@link Ext.data.Store#restful} Store, some serverside frameworks are
+     * tuned to expect data through the jsonData mechanism.  In those cases, one will want to set <b>encode: <tt>false</tt></b>, as in
+     * let the lower-level connection object (eg: Ext.Ajax) do the encoding.</p>
+     */
+    encode : true,
+    /**
+     * @cfg {Boolean} encodeDelete False to send only the id to the server on delete, true to encode it in an object
+     * literal, eg: <pre><code>
+{id: 1}
+ * </code></pre> Defaults to <tt>false</tt>
+     */
+    encodeDelete: false,
+    
+    constructor : function(config){
+        Ext.data.JsonWriter.superclass.constructor.call(this, config);    
+    },
+
+    /**
+     * <p>This method should not need to be called by application code, however it may be useful on occasion to
+     * override it, or augment it with an {@link Function#createInterceptor interceptor} or {@link Function#createSequence sequence}.</p>
+     * <p>The provided implementation encodes the serialized data representing the Store's modified Records into the Ajax request's
+     * <code>params</code> according to the <code>{@link #encode}</code> setting.</p>
+     * @param {Object} Ajax request params object to write into.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data object representing the serialized modified records from the Store. May be either a single object,
+     * or an Array of objects - user implementations must handle both cases.
+     */
+    render : function(params, baseParams, data) {
+        if (this.encode === true) {
+            // Encode here now.
+            Ext.apply(params, baseParams);
+            params[this.meta.root] = Ext.encode(data);
+        } else {
+            // defer encoding for some other layer, probably in {@link Ext.Ajax#request}.  Place everything into "jsonData" key.
+            var jdata = Ext.apply({}, baseParams);
+            jdata[this.meta.root] = data;
+            params.jsonData = jdata;
+        }
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    createRecord : function(rec) {
+       return this.toHash(rec);
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    updateRecord : function(rec) {
+        return this.toHash(rec);
+
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    destroyRecord : function(rec){
+        if(this.encodeDelete){
+            var data = {};
+            data[this.meta.idProperty] = rec.id;
+            return data;
+        }else{
+            return rec.id;
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/GroupingStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/GroupingStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/GroupingStore.js	(revision 76)
@@ -0,0 +1,263 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.GroupingStore
+ * @extends Ext.data.Store
+ * A specialized store implementation that provides for grouping records by one of the available fields. This
+ * is usually used in conjunction with an {@link Ext.grid.GroupingView} to provide the data model for
+ * a grouped GridPanel.
+ *
+ * Internally, GroupingStore is simply a normal Store with multi sorting enabled from the start. The grouping field
+ * and direction are always injected as the first sorter pair. GroupingView picks up on the configured groupField and
+ * builds grid rows appropriately.
+ *
+ * @constructor
+ * Creates a new GroupingStore.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype groupingstore
+ */
+Ext.data.GroupingStore = Ext.extend(Ext.data.Store, {
+
+    //inherit docs
+    constructor: function(config) {
+        config = config || {};
+
+        //We do some preprocessing here to massage the grouping + sorting options into a single
+        //multi sort array. If grouping and sorting options are both presented to the constructor,
+        //the sorters array consists of the grouping sorter object followed by the sorting sorter object
+        //see Ext.data.Store's sorting functions for details about how multi sorting works
+        this.hasMultiSort  = true;
+        this.multiSortInfo = this.multiSortInfo || {sorters: []};
+
+        var sorters    = this.multiSortInfo.sorters,
+            groupField = config.groupField || this.groupField,
+            sortInfo   = config.sortInfo || this.sortInfo,
+            groupDir   = config.groupDir || this.groupDir;
+
+        //add the grouping sorter object first
+        if(groupField){
+            sorters.push({
+                field    : groupField,
+                direction: groupDir
+            });
+        }
+
+        //add the sorting sorter object if it is present
+        if (sortInfo) {
+            sorters.push(sortInfo);
+        }
+
+        Ext.data.GroupingStore.superclass.constructor.call(this, config);
+
+        this.addEvents(
+          /**
+           * @event groupchange
+           * Fired whenever a call to store.groupBy successfully changes the grouping on the store
+           * @param {Ext.data.GroupingStore} store The grouping store
+           * @param {String} groupField The field that the store is now grouped by
+           */
+          'groupchange'
+        );
+
+        this.applyGroupField();
+    },
+
+    /**
+     * @cfg {String} groupField
+     * The field name by which to sort the store's data (defaults to '').
+     */
+    /**
+     * @cfg {Boolean} remoteGroup
+     * True if the grouping should apply on the server side, false if it is local only (defaults to false).  If the
+     * grouping is local, it can be applied immediately to the data.  If it is remote, then it will simply act as a
+     * helper, automatically sending the grouping field name as the 'groupBy' param with each XHR call.
+     */
+    remoteGroup : false,
+    /**
+     * @cfg {Boolean} groupOnSort
+     * True to sort the data on the grouping field when a grouping operation occurs, false to sort based on the
+     * existing sort info (defaults to false).
+     */
+    groupOnSort:false,
+
+    /**
+     * @cfg {String} groupDir
+     * The direction to sort the groups. Defaults to <tt>'ASC'</tt>.
+     */
+    groupDir : 'ASC',
+
+    /**
+     * Clears any existing grouping and refreshes the data using the default sort.
+     */
+    clearGrouping : function(){
+        this.groupField = false;
+
+        if(this.remoteGroup){
+            if(this.baseParams){
+                delete this.baseParams.groupBy;
+                delete this.baseParams.groupDir;
+            }
+            var lo = this.lastOptions;
+            if(lo && lo.params){
+                delete lo.params.groupBy;
+                delete lo.params.groupDir;
+            }
+
+            this.reload();
+        }else{
+            this.sort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Groups the data by the specified field.
+     * @param {String} field The field name by which to sort the store's data
+     * @param {Boolean} forceRegroup (optional) True to force the group to be refreshed even if the field passed
+     * in is the same as the current grouping field, false to skip grouping on the same field (defaults to false)
+     */
+    groupBy : function(field, forceRegroup, direction) {
+        direction = direction ? (String(direction).toUpperCase() == 'DESC' ? 'DESC' : 'ASC') : this.groupDir;
+
+        if (this.groupField == field && this.groupDir == direction && !forceRegroup) {
+            return; // already grouped by this field
+        }
+
+        //check the contents of the first sorter. If the field matches the CURRENT groupField (before it is set to the new one),
+        //remove the sorter as it is actually the grouper. The new grouper is added back in by this.sort
+        var sorters = this.multiSortInfo.sorters;
+        if (sorters.length > 0 && sorters[0].field == this.groupField) {
+            sorters.shift();
+        }
+
+        this.groupField = field;
+        this.groupDir = direction;
+        this.applyGroupField();
+
+        var fireGroupEvent = function() {
+            this.fireEvent('groupchange', this, this.getGroupState());
+        };
+
+        if (this.groupOnSort) {
+            this.sort(field, direction);
+            fireGroupEvent.call(this);
+            return;
+        }
+
+        if (this.remoteGroup) {
+            this.on('load', fireGroupEvent, this, {single: true});
+            this.reload();
+        } else {
+            this.sort(sorters);
+            fireGroupEvent.call(this);
+        }
+    },
+
+    //GroupingStore always uses multisorting so we intercept calls to sort here to make sure that our grouping sorter object
+    //is always injected first.
+    sort : function(fieldName, dir) {
+        if (this.remoteSort) {
+            return Ext.data.GroupingStore.superclass.sort.call(this, fieldName, dir);
+        }
+
+        var sorters = [];
+
+        //cater for any existing valid arguments to this.sort, massage them into an array of sorter objects
+        if (Ext.isArray(arguments[0])) {
+            sorters = arguments[0];
+        } else if (fieldName == undefined) {
+            //we preserve the existing sortInfo here because this.sort is called after
+            //clearGrouping and there may be existing sorting
+            sorters = this.sortInfo ? [this.sortInfo] : [];
+        } else {
+            //TODO: this is lifted straight from Ext.data.Store's singleSort function. It should instead be
+            //refactored into a common method if possible
+            var field = this.fields.get(fieldName);
+            if (!field) return false;
+
+            var name       = field.name,
+                sortInfo   = this.sortInfo || null,
+                sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+            if (!dir) {
+                if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                    dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+                } else {
+                    dir = field.sortDir;
+                }
+            }
+
+            this.sortToggle[name] = dir;
+            this.sortInfo = {field: name, direction: dir};
+
+            sorters = [this.sortInfo];
+        }
+
+        //add the grouping sorter object as the first multisort sorter
+        if (this.groupField) {
+            sorters.unshift({direction: this.groupDir, field: this.groupField});
+        }
+
+        return this.multiSort.call(this, sorters, dir);
+    },
+
+    /**
+     * @private
+     * Saves the current grouping field and direction to this.baseParams and this.lastOptions.params
+     * if we're using remote grouping. Does not actually perform any grouping - just stores values
+     */
+    applyGroupField: function(){
+        if (this.remoteGroup) {
+            if(!this.baseParams){
+                this.baseParams = {};
+            }
+
+            Ext.apply(this.baseParams, {
+                groupBy : this.groupField,
+                groupDir: this.groupDir
+            });
+
+            var lo = this.lastOptions;
+            if (lo && lo.params) {
+                lo.params.groupDir = this.groupDir;
+
+                //this is deleted because of a bug reported at http://www.extjs.com/forum/showthread.php?t=82907
+                delete lo.params.groupBy;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * TODO: This function is apparently never invoked anywhere in the framework. It has no documentation
+     * and should be considered for deletion
+     */
+    applyGrouping : function(alwaysFireChange){
+        if(this.groupField !== false){
+            this.groupBy(this.groupField, true, this.groupDir);
+            return true;
+        }else{
+            if(alwaysFireChange === true){
+                this.fireEvent('datachanged', this);
+            }
+            return false;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the grouping field that should be used. If groupOnSort is used this will be sortInfo's field,
+     * otherwise it will be this.groupField
+     * @return {String} The group field
+     */
+    getGroupState : function(){
+        return this.groupOnSort && this.groupField !== false ?
+               (this.sortInfo ? this.sortInfo.field : undefined) : this.groupField;
+    }
+});
+Ext.reg('groupingstore', Ext.data.GroupingStore);
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Api.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Api.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Api.js	(revision 76)
@@ -0,0 +1,285 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+
+/**
+ * @class Ext.data.Api
+ * @extends Object
+ * Ext.data.Api is a singleton designed to manage the data API including methods
+ * for validating a developer's DataProxy API.  Defines variables for CRUD actions
+ * create, read, update and destroy in addition to a mapping of RESTful HTTP methods
+ * GET, POST, PUT and DELETE to CRUD actions.
+ * @singleton
+ */
+Ext.data.Api = (function() {
+
+    // private validActions.  validActions is essentially an inverted hash of Ext.data.Api.actions, where value becomes the key.
+    // Some methods in this singleton (e.g.: getActions, getVerb) will loop through actions with the code <code>for (var verb in this.actions)</code>
+    // For efficiency, some methods will first check this hash for a match.  Those methods which do acces validActions will cache their result here.
+    // We cannot pre-define this hash since the developer may over-ride the actions at runtime.
+    var validActions = {};
+
+    return {
+        /**
+         * Defined actions corresponding to remote actions:
+         * <pre><code>
+actions: {
+    create  : 'create',  // Text representing the remote-action to create records on server.
+    read    : 'read',    // Text representing the remote-action to read/load data from server.
+    update  : 'update',  // Text representing the remote-action to update records on server.
+    destroy : 'destroy'  // Text representing the remote-action to destroy records on server.
+}
+         * </code></pre>
+         * @property actions
+         * @type Object
+         */
+        actions : {
+            create  : 'create',
+            read    : 'read',
+            update  : 'update',
+            destroy : 'destroy'
+        },
+
+        /**
+         * Defined {CRUD action}:{HTTP method} pairs to associate HTTP methods with the
+         * corresponding actions for {@link Ext.data.DataProxy#restful RESTful proxies}.
+         * Defaults to:
+         * <pre><code>
+restActions : {
+    create  : 'POST',
+    read    : 'GET',
+    update  : 'PUT',
+    destroy : 'DELETE'
+},
+         * </code></pre>
+         */
+        restActions : {
+            create  : 'POST',
+            read    : 'GET',
+            update  : 'PUT',
+            destroy : 'DELETE'
+        },
+
+        /**
+         * Returns true if supplied action-name is a valid API action defined in <code>{@link #actions}</code> constants
+         * @param {String} action Action to test for availability.
+         * @return {Boolean}
+         */
+        isAction : function(action) {
+            return (Ext.data.Api.actions[action]) ? true : false;
+        },
+
+        /**
+         * Returns the actual CRUD action KEY "create", "read", "update" or "destroy" from the supplied action-name.  This method is used internally and shouldn't generally
+         * need to be used directly.  The key/value pair of Ext.data.Api.actions will often be identical but this is not necessarily true.  A developer can override this naming
+         * convention if desired.  However, the framework internally calls methods based upon the KEY so a way of retreiving the the words "create", "read", "update" and "destroy" is
+         * required.  This method will cache discovered KEYS into the private validActions hash.
+         * @param {String} name The runtime name of the action.
+         * @return {String||null} returns the action-key, or verb of the user-action or null if invalid.
+         * @nodoc
+         */
+        getVerb : function(name) {
+            if (validActions[name]) {
+                return validActions[name];  // <-- found in cache.  return immediately.
+            }
+            for (var verb in this.actions) {
+                if (this.actions[verb] === name) {
+                    validActions[name] = verb;
+                    break;
+                }
+            }
+            return (validActions[name] !== undefined) ? validActions[name] : null;
+        },
+
+        /**
+         * Returns true if the supplied API is valid; that is, check that all keys match defined actions
+         * otherwise returns an array of mistakes.
+         * @return {String[]|true}
+         */
+        isValid : function(api){
+            var invalid = [];
+            var crud = this.actions; // <-- cache a copy of the actions.
+            for (var action in api) {
+                if (!(action in crud)) {
+                    invalid.push(action);
+                }
+            }
+            return (!invalid.length) ? true : invalid;
+        },
+
+        /**
+         * Returns true if the supplied verb upon the supplied proxy points to a unique url in that none of the other api-actions
+         * point to the same url.  The question is important for deciding whether to insert the "xaction" HTTP parameter within an
+         * Ajax request.  This method is used internally and shouldn't generally need to be called directly.
+         * @param {Ext.data.DataProxy} proxy
+         * @param {String} verb
+         * @return {Boolean}
+         */
+        hasUniqueUrl : function(proxy, verb) {
+            var url = (proxy.api[verb]) ? proxy.api[verb].url : null;
+            var unique = true;
+            for (var action in proxy.api) {
+                if ((unique = (action === verb) ? true : (proxy.api[action].url != url) ? true : false) === false) {
+                    break;
+                }
+            }
+            return unique;
+        },
+
+        /**
+         * This method is used internally by <tt>{@link Ext.data.DataProxy DataProxy}</tt> and should not generally need to be used directly.
+         * Each action of a DataProxy api can be initially defined as either a String or an Object.  When specified as an object,
+         * one can explicitly define the HTTP method (GET|POST) to use for each CRUD action.  This method will prepare the supplied API, setting
+         * each action to the Object form.  If your API-actions do not explicitly define the HTTP method, the "method" configuration-parameter will
+         * be used.  If the method configuration parameter is not specified, POST will be used.
+         <pre><code>
+new Ext.data.HttpProxy({
+    method: "POST",     // <-- default HTTP method when not specified.
+    api: {
+        create: 'create.php',
+        load: 'read.php',
+        save: 'save.php',
+        destroy: 'destroy.php'
+    }
+});
+
+// Alternatively, one can use the object-form to specify the API
+new Ext.data.HttpProxy({
+    api: {
+        load: {url: 'read.php', method: 'GET'},
+        create: 'create.php',
+        destroy: 'destroy.php',
+        save: 'update.php'
+    }
+});
+        </code></pre>
+         *
+         * @param {Ext.data.DataProxy} proxy
+         */
+        prepare : function(proxy) {
+            if (!proxy.api) {
+                proxy.api = {}; // <-- No api?  create a blank one.
+            }
+            for (var verb in this.actions) {
+                var action = this.actions[verb];
+                proxy.api[action] = proxy.api[action] || proxy.url || proxy.directFn;
+                if (typeof(proxy.api[action]) == 'string') {
+                    proxy.api[action] = {
+                        url: proxy.api[action],
+                        method: (proxy.restful === true) ? Ext.data.Api.restActions[action] : undefined
+                    };
+                }
+            }
+        },
+
+        /**
+         * Prepares a supplied Proxy to be RESTful.  Sets the HTTP method for each api-action to be one of
+         * GET, POST, PUT, DELETE according to the defined {@link #restActions}.
+         * @param {Ext.data.DataProxy} proxy
+         */
+        restify : function(proxy) {
+            proxy.restful = true;
+            for (var verb in this.restActions) {
+                proxy.api[this.actions[verb]].method ||
+                    (proxy.api[this.actions[verb]].method = this.restActions[verb]);
+            }
+            // TODO: perhaps move this interceptor elsewhere?  like into DataProxy, perhaps?  Placed here
+            // to satisfy initial 3.0 final release of REST features.
+            proxy.onWrite = proxy.onWrite.createInterceptor(function(action, o, response, rs) {
+                var reader = o.reader;
+                var res = new Ext.data.Response({
+                    action: action,
+                    raw: response
+                });
+
+                switch (response.status) {
+                    case 200:   // standard 200 response, send control back to HttpProxy#onWrite by returning true from this intercepted #onWrite
+                        return true;
+                        break;
+                    case 201:   // entity created but no response returned
+                        if (Ext.isEmpty(res.raw.responseText)) {
+                          res.success = true;
+                        } else {
+                          //if the response contains data, treat it like a 200
+                          return true;
+                        }
+                        break;
+                    case 204:  // no-content.  Create a fake response.
+                        res.success = true;
+                        res.data = null;
+                        break;
+                    default:
+                        return true;
+                        break;
+                }
+                if (res.success === true) {
+                    this.fireEvent("write", this, action, res.data, res, rs, o.request.arg);
+                } else {
+                    this.fireEvent('exception', this, 'remote', action, o, res, rs);
+                }
+                o.request.callback.call(o.request.scope, res.data, res, res.success);
+
+                return false;   // <-- false to prevent intercepted function from running.
+            }, proxy);
+        }
+    };
+})();
+
+/**
+ * Ext.data.Response
+ * Experimental.  Do not use directly.
+ */
+Ext.data.Response = function(params, response) {
+    Ext.apply(this, params, {
+        raw: response
+    });
+};
+Ext.data.Response.prototype = {
+    message : null,
+    success : false,
+    status : null,
+    root : null,
+    raw : null,
+
+    getMessage : function() {
+        return this.message;
+    },
+    getSuccess : function() {
+        return this.success;
+    },
+    getStatus : function() {
+        return this.status;
+    },
+    getRoot : function() {
+        return this.root;
+    },
+    getRawResponse : function() {
+        return this.raw;
+    }
+};
+
+/**
+ * @class Ext.data.Api.Error
+ * @extends Ext.Error
+ * Error class for Ext.data.Api errors
+ */
+Ext.data.Api.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.Api'
+});
+Ext.apply(Ext.data.Api.Error.prototype, {
+    lang: {
+        'action-url-undefined': 'No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.',
+        'invalid': 'received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions',
+        'invalid-url': 'Invalid url.  Please review your proxy configuration.',
+        'execute': 'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'
+    }
+});
+
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/MemoryProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/MemoryProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/MemoryProxy.js	(revision 76)
@@ -0,0 +1,69 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.MemoryProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that simply passes the data specified in its constructor
+ * to the Reader when its load method is called.
+ * @constructor
+ * @param {Object} data The data object which the Reader uses to construct a block of Ext.data.Records.
+ */
+Ext.data.MemoryProxy = function(data){
+    // Must define a dummy api with "read" action to satisfy DataProxy#doRequest and Ext.data.Api#prepare *before* calling super
+    var api = {};
+    api[Ext.data.Api.actions.read] = true;
+    Ext.data.MemoryProxy.superclass.constructor.call(this, {
+        api: api
+    });
+    this.data = data;
+};
+
+Ext.extend(Ext.data.MemoryProxy, Ext.data.DataProxy, {
+    /**
+     * @event loadexception
+     * Fires if an exception occurs in the Proxy during data loading. Note that this event is also relayed
+     * through {@link Ext.data.Store}, so you can listen for it directly on any Store instance.
+     * @param {Object} this
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Object} null This parameter does not apply and will always be null for MemoryProxy
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data
+     */
+
+       /**
+     * MemoryProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        // No implementation for CRUD in MemoryProxy.  Assumes all actions are 'load'
+        params = params || {};
+        var result;
+        try {
+            result = reader.readRecords(this.data);
+        }catch(e){
+            // @deprecated loadexception
+            this.fireEvent("loadexception", this, null, arg, e);
+
+            this.fireEvent('exception', this, 'response', action, arg, null, e);
+            callback.call(scope, null, arg, false);
+            return;
+        }
+        callback.call(scope, result, arg, true);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DataProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DataProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DataProxy.js	(revision 76)
@@ -0,0 +1,511 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DataProxy
+ * @extends Ext.util.Observable
+ * <p>Abstract base class for implementations which provide retrieval of unformatted data objects.
+ * This class is intended to be extended and should not be created directly. For existing implementations,
+ * see {@link Ext.data.DirectProxy}, {@link Ext.data.HttpProxy}, {@link Ext.data.ScriptTagProxy} and
+ * {@link Ext.data.MemoryProxy}.</p>
+ * <p>DataProxy implementations are usually used in conjunction with an implementation of {@link Ext.data.DataReader}
+ * (of the appropriate type which knows how to parse the data object) to provide a block of
+ * {@link Ext.data.Records} to an {@link Ext.data.Store}.</p>
+ * <p>The parameter to a DataProxy constructor may be an {@link Ext.data.Connection} or can also be the
+ * config object to an {@link Ext.data.Connection}.</p>
+ * <p>Custom implementations must implement either the <code><b>doRequest</b></code> method (preferred) or the
+ * <code>load</code> method (deprecated). See
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#doRequest doRequest} or
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#load load} for additional details.</p>
+ * <p><b><u>Example 1</u></b></p>
+ * <pre><code>
+proxy: new Ext.data.ScriptTagProxy({
+    {@link Ext.data.Connection#url url}: 'http://extjs.com/forum/topics-remote.php'
+}),
+ * </code></pre>
+ * <p><b><u>Example 2</u></b></p>
+ * <pre><code>
+proxy : new Ext.data.HttpProxy({
+    {@link Ext.data.Connection#method method}: 'GET',
+    {@link Ext.data.HttpProxy#prettyUrls prettyUrls}: false,
+    {@link Ext.data.Connection#url url}: 'local/default.php', // see options parameter for {@link Ext.Ajax#request}
+    {@link #api}: {
+        // all actions except the following will use above url
+        create  : 'local/new.php',
+        update  : 'local/update.php'
+    }
+}),
+ * </code></pre>
+ * <p>And <b>new in Ext version 3</b>, attach centralized event-listeners upon the DataProxy class itself!  This is a great place
+ * to implement a <i>messaging system</i> to centralize your application's user-feedback and error-handling.</p>
+ * <pre><code>
+// Listen to all "beforewrite" event fired by all proxies.
+Ext.data.DataProxy.on('beforewrite', function(proxy, action) {
+    console.log('beforewrite: ', action);
+});
+
+// Listen to "write" event fired by all proxies
+Ext.data.DataProxy.on('write', function(proxy, action, data, res, rs) {
+    console.info('write: ', action);
+});
+
+// Listen to "exception" event fired by all proxies
+Ext.data.DataProxy.on('exception', function(proxy, type, action, exception) {
+    console.error(type + action + ' exception);
+});
+ * </code></pre>
+ * <b>Note:</b> These three events are all fired with the signature of the corresponding <i>DataProxy instance</i> event {@link #beforewrite beforewrite}, {@link #write write} and {@link #exception exception}.
+ */
+Ext.data.DataProxy = function(conn){
+    // make sure we have a config object here to support ux proxies.
+    // All proxies should now send config into superclass constructor.
+    conn = conn || {};
+
+    // This line caused a bug when people use custom Connection object having its own request method.
+    // http://extjs.com/forum/showthread.php?t=67194.  Have to set DataProxy config
+    //Ext.applyIf(this, conn);
+
+    this.api     = conn.api;
+    this.url     = conn.url;
+    this.restful = conn.restful;
+    this.listeners = conn.listeners;
+
+    // deprecated
+    this.prettyUrls = conn.prettyUrls;
+
+    /**
+     * @cfg {Object} api
+     * Specific urls to call on CRUD action methods "read", "create", "update" and "destroy".
+     * Defaults to:<pre><code>
+api: {
+    read    : undefined,
+    create  : undefined,
+    update  : undefined,
+    destroy : undefined
+}
+     * </code></pre>
+     * <p>The url is built based upon the action being executed <tt>[load|create|save|destroy]</tt>
+     * using the commensurate <tt>{@link #api}</tt> property, or if undefined default to the
+     * configured {@link Ext.data.Store}.{@link Ext.data.Store#url url}.</p><br>
+     * <p>For example:</p>
+     * <pre><code>
+api: {
+    load :    '/controller/load',
+    create :  '/controller/new',  // Server MUST return idProperty of new record
+    save :    '/controller/update',
+    destroy : '/controller/destroy_action'
+}
+
+// Alternatively, one can use the object-form to specify each API-action
+api: {
+    load: {url: 'read.php', method: 'GET'},
+    create: 'create.php',
+    destroy: 'destroy.php',
+    save: 'update.php'
+}
+     * </code></pre>
+     * <p>If the specific URL for a given CRUD action is undefined, the CRUD action request
+     * will be directed to the configured <tt>{@link Ext.data.Connection#url url}</tt>.</p>
+     * <br><p><b>Note</b>: To modify the URL for an action dynamically the appropriate API
+     * property should be modified before the action is requested using the corresponding before
+     * action event.  For example to modify the URL associated with the load action:
+     * <pre><code>
+// modify the url for the action
+myStore.on({
+    beforeload: {
+        fn: function (store, options) {
+            // use <tt>{@link Ext.data.HttpProxy#setUrl setUrl}</tt> to change the URL for *just* this request.
+            store.proxy.setUrl('changed1.php');
+
+            // set optional second parameter to true to make this URL change
+            // permanent, applying this URL for all subsequent requests.
+            store.proxy.setUrl('changed1.php', true);
+
+            // Altering the proxy API should be done using the public
+            // method <tt>{@link Ext.data.DataProxy#setApi setApi}</tt>.
+            store.proxy.setApi('read', 'changed2.php');
+
+            // Or set the entire API with a config-object.
+            // When using the config-object option, you must redefine the <b>entire</b>
+            // API -- not just a specific action of it.
+            store.proxy.setApi({
+                read    : 'changed_read.php',
+                create  : 'changed_create.php',
+                update  : 'changed_update.php',
+                destroy : 'changed_destroy.php'
+            });
+        }
+    }
+});
+     * </code></pre>
+     * </p>
+     */
+
+    this.addEvents(
+        /**
+         * @event exception
+         * <p>Fires if an exception occurs in the Proxy during a remote request. This event is relayed
+         * through a corresponding {@link Ext.data.Store}.{@link Ext.data.Store#exception exception},
+         * so any Store instance may observe this event.</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of exception events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * <p>This event can be fired for one of two reasons:</p>
+         * <div class="mdetail-params"><ul>
+         * <li>remote-request <b>failed</b> : <div class="sub-desc">
+         * The server did not return status === 200.
+         * </div></li>
+         * <li>remote-request <b>succeeded</b> : <div class="sub-desc">
+         * The remote-request succeeded but the reader could not read the response.
+         * This means the server returned data, but the configured Reader threw an
+         * error while reading the response.  In this case, this event will be
+         * raised and the caught error will be passed along into this event.
+         * </div></li>
+         * </ul></div>
+         * <br><p>This event fires with two different contexts based upon the 2nd
+         * parameter <tt>type [remote|response]</tt>.  The first four parameters
+         * are identical between the two contexts -- only the final two parameters
+         * differ.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} type
+         * <p>The value of this parameter will be either <tt>'response'</tt> or <tt>'remote'</tt>.</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>An <b>invalid</b> response from the server was returned: either 404,
+         * 500 or the response meta-data does not match that defined in the DataReader
+         * (e.g.: root, idProperty, successProperty).</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>A <b>valid</b> response was returned from the server having
+         * successProperty === false.  This response might contain an error-message
+         * sent from the server.  For example, the user may have failed
+         * authentication/authorization or a database validation error occurred.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {String} action Name of the action (see {@link Ext.data.Api#actions}.
+         * @param {Object} options The options for the action that were specified in the {@link #request}.
+         * @param {Object} response
+         * <p>The value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>The raw browser response object (e.g.: XMLHttpRequest)</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>The decoded response object sent from the server.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {Mixed} arg
+         * <p>The type and value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : Error<div class="sub-desc">
+         * <p>The JavaScript Error object caught if the configured Reader could not read the data.
+         * If the remote request returns success===false, this parameter will be null.</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : Record/Record[]<div class="sub-desc">
+         * <p>This parameter will only exist if the <tt>action</tt> was a <b>write</b> action
+         * (Ext.data.Api.actions.create|update|destroy).</p>
+         * </div></li>
+         * </ul></div>
+         */
+        'exception',
+        /**
+         * @event beforeload
+         * Fires before a request to retrieve a data object.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} params The params object passed to the {@link #request} function
+         */
+        'beforeload',
+        /**
+         * @event load
+         * Fires before the load method's callback is called.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} o The request transaction object
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'load',
+        /**
+         * @event loadexception
+         * <p>This event is <b>deprecated</b>.  The signature of the loadexception event
+         * varies depending on the proxy, use the catch-all {@link #exception} event instead.
+         * This event will fire in addition to the {@link #exception} event.</p>
+         * @param {misc} misc See {@link #exception}.
+         * @deprecated
+         */
+        'loadexception',
+        /**
+         * @event beforewrite
+         * <p>Fires before a request is generated for one of the actions Ext.data.Api.actions.create|update|destroy</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of beforewrite events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy for the request
+         * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+         * @param {Record/Record[]} rs The Record(s) to create|update|destroy.
+         * @param {Object} params The request <code>params</code> object.  Edit <code>params</code> to add parameters to the request.
+         */
+        'beforewrite',
+        /**
+         * @event write
+         * <p>Fires before the request-callback is called</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of write events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} action [Ext.data.Api.actions.create|upate|destroy]
+         * @param {Object} data The data object extracted from the server-response
+         * @param {Object} response The decoded response from server
+         * @param {Record/Record[]} rs The Record(s) from Store
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'write'
+    );
+    Ext.data.DataProxy.superclass.constructor.call(this);
+
+    // Prepare the proxy api.  Ensures all API-actions are defined with the Object-form.
+    try {
+        Ext.data.Api.prepare(this);
+    } catch (e) {
+        if (e instanceof Ext.data.Api.Error) {
+            e.toConsole();
+        }
+    }
+    // relay each proxy's events onto Ext.data.DataProxy class for centralized Proxy-listening
+    Ext.data.DataProxy.relayEvents(this, ['beforewrite', 'write', 'exception']);
+};
+
+Ext.extend(Ext.data.DataProxy, Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} restful
+     * <p>Defaults to <tt>false</tt>.  Set to <tt>true</tt> to operate in a RESTful manner.</p>
+     * <br><p> Note: this parameter will automatically be set to <tt>true</tt> if the
+     * {@link Ext.data.Store} it is plugged into is set to <code>restful: true</code>. If the
+     * Store is RESTful, there is no need to set this option on the proxy.</p>
+     * <br><p>RESTful implementations enable the serverside framework to automatically route
+     * actions sent to one url based upon the HTTP method, for example:
+     * <pre><code>
+store: new Ext.data.Store({
+    restful: true,
+    proxy: new Ext.data.HttpProxy({url:'/users'}); // all requests sent to /users
+    ...
+)}
+     * </code></pre>
+     * If there is no <code>{@link #api}</code> specified in the configuration of the proxy,
+     * all requests will be marshalled to a single RESTful url (/users) so the serverside
+     * framework can inspect the HTTP Method and act accordingly:
+     * <pre>
+<u>Method</u>   <u>url</u>        <u>action</u>
+POST     /users     create
+GET      /users     read
+PUT      /users/23  update
+DESTROY  /users/23  delete
+     * </pre></p>
+     * <p>If set to <tt>true</tt>, a {@link Ext.data.Record#phantom non-phantom} record's
+     * {@link Ext.data.Record#id id} will be appended to the url. Some MVC (e.g., Ruby on Rails,
+     * Merb and Django) support segment based urls where the segments in the URL follow the
+     * Model-View-Controller approach:<pre><code>
+     * someSite.com/controller/action/id
+     * </code></pre>
+     * Where the segments in the url are typically:<div class="mdetail-params"><ul>
+     * <li>The first segment : represents the controller class that should be invoked.</li>
+     * <li>The second segment : represents the class function, or method, that should be called.</li>
+     * <li>The third segment : represents the ID (a variable typically passed to the method).</li>
+     * </ul></div></p>
+     * <br><p>Refer to <code>{@link Ext.data.DataProxy#api}</code> for additional information.</p>
+     */
+    restful: false,
+
+    /**
+     * <p>Redefines the Proxy's API or a single action of an API. Can be called with two method signatures.</p>
+     * <p>If called with an object as the only parameter, the object should redefine the <b>entire</b> API, e.g.:</p><pre><code>
+proxy.setApi({
+    read    : '/users/read',
+    create  : '/users/create',
+    update  : '/users/update',
+    destroy : '/users/destroy'
+});
+</code></pre>
+     * <p>If called with two parameters, the first parameter should be a string specifying the API action to
+     * redefine and the second parameter should be the URL (or function if using DirectProxy) to call for that action, e.g.:</p><pre><code>
+proxy.setApi(Ext.data.Api.actions.read, '/users/new_load_url');
+</code></pre>
+     * @param {String/Object} api An API specification object, or the name of an action.
+     * @param {String/Function} url The URL (or function if using DirectProxy) to call for the action.
+     */
+    setApi : function() {
+        if (arguments.length == 1) {
+            var valid = Ext.data.Api.isValid(arguments[0]);
+            if (valid === true) {
+                this.api = arguments[0];
+            }
+            else {
+                throw new Ext.data.Api.Error('invalid', valid);
+            }
+        }
+        else if (arguments.length == 2) {
+            if (!Ext.data.Api.isAction(arguments[0])) {
+                throw new Ext.data.Api.Error('invalid', arguments[0]);
+            }
+            this.api[arguments[0]] = arguments[1];
+        }
+        Ext.data.Api.prepare(this);
+    },
+
+    /**
+     * Returns true if the specified action is defined as a unique action in the api-config.
+     * request.  If all API-actions are routed to unique urls, the xaction parameter is unecessary.  However, if no api is defined
+     * and all Proxy actions are routed to DataProxy#url, the server-side will require the xaction parameter to perform a switch to
+     * the corresponding code for CRUD action.
+     * @param {String [Ext.data.Api.CREATE|READ|UPDATE|DESTROY]} action
+     * @return {Boolean}
+     */
+    isApiAction : function(action) {
+        return (this.api[action]) ? true : false;
+    },
+
+    /**
+     * All proxy actions are executed through this method.  Automatically fires the "before" + action event
+     * @param {String} action Name of the action
+     * @param {Ext.data.Record/Ext.data.Record[]/null} rs Will be null when action is 'load'
+     * @param {Object} params
+     * @param {Ext.data.DataReader} reader
+     * @param {Function} callback
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the Proxy object.
+     * @param {Object} options Any options specified for the action (e.g. see {@link Ext.data.Store#load}.
+     */
+    request : function(action, rs, params, reader, callback, scope, options) {
+        if (!this.api[action] && !this.load) {
+            throw new Ext.data.DataProxy.Error('action-undefined', action);
+        }
+        params = params || {};
+        if ((action === Ext.data.Api.actions.read) ? this.fireEvent("beforeload", this, params) : this.fireEvent("beforewrite", this, action, rs, params) !== false) {
+            this.doRequest.apply(this, arguments);
+        }
+        else {
+            callback.call(scope || this, null, options, false);
+        }
+    },
+
+
+    /**
+     * <b>Deprecated</b> load method using old method signature. See {@doRequest} for preferred method.
+     * @deprecated
+     * @param {Object} params
+     * @param {Object} reader
+     * @param {Object} callback
+     * @param {Object} scope
+     * @param {Object} arg
+     */
+    load : null,
+
+    /**
+     * @cfg {Function} doRequest Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.
+     * (e.g.: {@link Ext.data.HttpProxy#doRequest HttpProxy.doRequest},
+     * {@link Ext.data.DirectProxy#doRequest DirectProxy.doRequest}).
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        // default implementation of doRequest for backwards compatibility with 2.0 proxies.
+        // If we're executing here, the action is probably "load".
+        // Call with the pre-3.0 method signature.
+        this.load(params, reader, callback, scope, options);
+    },
+
+    /**
+     * @cfg {Function} onRead Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for read {@link Ext.data.Api#actions action}.
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : Ext.emptyFn,
+    /**
+     * @cfg {Function} onWrite Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for <i>create, update and destroy</i> {@link Ext.data.Api#actions actions}.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : Ext.emptyFn,
+    /**
+     * buildUrl
+     * Sets the appropriate url based upon the action being executed.  If restful is true, and only a single record is being acted upon,
+     * url will be built Rails-style, as in "/controller/action/32".  restful will aply iff the supplied record is an
+     * instance of Ext.data.Record rather than an Array of them.
+     * @param {String} action The api action being executed [read|create|update|destroy]
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record or Array of Records being acted upon.
+     * @return {String} url
+     * @private
+     */
+    buildUrl : function(action, record) {
+        record = record || null;
+
+        // conn.url gets nullified after each request.  If it's NOT null here, that means the user must have intervened with a call
+        // to DataProxy#setUrl or DataProxy#setApi and changed it before the request was executed.  If that's the case, use conn.url,
+        // otherwise, build the url from the api or this.url.
+        var url = (this.conn && this.conn.url) ? this.conn.url : (this.api[action]) ? this.api[action].url : this.url;
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', action);
+        }
+
+        // look for urls having "provides" suffix used in some MVC frameworks like Rails/Merb and others.  The provides suffice informs
+        // the server what data-format the client is dealing with and returns data in the same format (eg: application/json, application/xml, etc)
+        // e.g.: /users.json, /users.xml, etc.
+        // with restful routes, we need urls like:
+        // PUT /users/1.json
+        // DELETE /users/1.json
+        var provides = null;
+        var m = url.match(/(.*)(\.json|\.xml|\.html)$/);
+        if (m) {
+            provides = m[2];    // eg ".json"
+            url      = m[1];    // eg: "/users"
+        }
+        // prettyUrls is deprectated in favor of restful-config
+        if ((this.restful === true || this.prettyUrls === true) && record instanceof Ext.data.Record && !record.phantom) {
+            url += '/' + record.id;
+        }
+        return (provides === null) ? url : url + provides;
+    },
+
+    /**
+     * Destroys the proxy by purging any event listeners and cancelling any active requests.
+     */
+    destroy: function(){
+        this.purgeListeners();
+    }
+});
+
+// Apply the Observable prototype to the DataProxy class so that proxy instances can relay their
+// events to the class.  Allows for centralized listening of all proxy instances upon the DataProxy class.
+Ext.apply(Ext.data.DataProxy, Ext.util.Observable.prototype);
+Ext.util.Observable.call(Ext.data.DataProxy);
+
+/**
+ * @class Ext.data.DataProxy.Error
+ * @extends Ext.Error
+ * DataProxy Error extension.
+ * constructor
+ * @param {String} message Message describing the error.
+ * @param {Record/Record[]} arg
+ */
+Ext.data.DataProxy.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataProxy'
+});
+Ext.apply(Ext.data.DataProxy.Error.prototype, {
+    lang: {
+        'action-undefined': "DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.",
+        'api-invalid': 'Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions.'
+    }
+});
+
+
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/SortTypes.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/SortTypes.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/SortTypes.js	(revision 76)
@@ -0,0 +1,91 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+
+/**
+ * @class Ext.data.SortTypes
+ * @singleton
+ * Defines the default sorting (casting?) comparison functions used when sorting data.
+ */
+Ext.data.SortTypes = {
+    /**
+     * Default sort that does nothing
+     * @param {Mixed} s The value being converted
+     * @return {Mixed} The comparison value
+     */
+    none : function(s){
+        return s;
+    },
+    
+    /**
+     * The regular expression used to strip tags
+     * @type {RegExp}
+     * @property
+     */
+    stripTagsRE : /<\/?[^>]+>/gi,
+    
+    /**
+     * Strips all HTML tags to sort on text only
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asText : function(s){
+        return String(s).replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Strips all HTML tags to sort on text only - Case insensitive
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCText : function(s){
+        return String(s).toUpperCase().replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Case insensitive string
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCString : function(s) {
+    	return String(s).toUpperCase();
+    },
+    
+    /**
+     * Date sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asDate : function(s) {
+        if(!s){
+            return 0;
+        }
+        if(Ext.isDate(s)){
+            return s.getTime();
+        }
+    	return Date.parse(String(s));
+    },
+    
+    /**
+     * Float sorting
+     * @param {Mixed} s The value being converted
+     * @return {Float} The comparison value
+     */
+    asFloat : function(s) {
+    	var val = parseFloat(String(s).replace(/,/g, ""));
+    	return isNaN(val) ? 0 : val;
+    },
+    
+    /**
+     * Integer sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asInt : function(s) {
+        var val = parseInt(String(s).replace(/,/g, ""), 10);
+        return isNaN(val) ? 0 : val;
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DirectProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DirectProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DirectProxy.js	(revision 76)
@@ -0,0 +1,173 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DirectProxy
+ * @extends Ext.data.DataProxy
+ */
+Ext.data.DirectProxy = function(config){
+    Ext.apply(this, config);
+    if(typeof this.paramOrder == 'string'){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+    Ext.data.DirectProxy.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.data.DirectProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. A list of params to be executed
+     * server side.  Specify the params in the order in which they must be executed on the server-side
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash
+     * Send parameters as a collection of named arguments (defaults to <tt>true</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: true,
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.  directFn is a simple alternative to defining the api configuration-parameter
+     * for Store's which will not implement a full CRUD api.
+     */
+    directFn : undefined,
+
+    /**
+     * DirectProxy implementation of {@link Ext.data.DataProxy#doRequest}
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        var args = [],
+            directFn = this.api[action] || this.directFn;
+
+        switch (action) {
+            case Ext.data.Api.actions.create:
+                args.push(params.jsonData);		// <-- create(Hash)
+                break;
+            case Ext.data.Api.actions.read:
+                // If the method has no parameters, ignore the paramOrder/paramsAsHash.
+                if(directFn.directCfg.method.len > 0){
+                    if(this.paramOrder){
+                        for(var i = 0, len = this.paramOrder.length; i < len; i++){
+                            args.push(params[this.paramOrder[i]]);
+                        }
+                    }else if(this.paramsAsHash){
+                        args.push(params);
+                    }
+                }
+                break;
+            case Ext.data.Api.actions.update:
+                args.push(params.jsonData);        // <-- update(Hash/Hash[])
+                break;
+            case Ext.data.Api.actions.destroy:
+                args.push(params.jsonData);        // <-- destroy(Int/Int[])
+                break;
+        }
+
+        var trans = {
+            params : params || {},
+            request: {
+                callback : callback,
+                scope : scope,
+                arg : options
+            },
+            reader: reader
+        };
+
+        args.push(this.createCallback(action, rs, trans), this);
+        directFn.apply(window, args);
+    },
+
+    // private
+    createCallback : function(action, rs, trans) {
+        var me = this;
+        return function(result, res) {
+            if (!res.status) {
+                // @deprecated fire loadexception
+                if (action === Ext.data.Api.actions.read) {
+                    me.fireEvent("loadexception", me, trans, res, null);
+                }
+                me.fireEvent('exception', me, 'remote', action, trans, res, null);
+                trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                me.onRead(action, trans, result, res);
+            } else {
+                me.onWrite(action, trans, result, res, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, result, res) {
+        var records;
+        try {
+            records = trans.reader.readRecords(result);
+        }
+        catch (ex) {
+            // @deprecated: Fire old loadexception for backwards-compat.
+            this.fireEvent("loadexception", this, trans, res, ex);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, ex);
+            trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+            return;
+        }
+        this.fireEvent("load", this, res, trans.request.arg);
+        trans.request.callback.call(trans.request.scope, records, trans.request.arg, true);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [{@link Ext.data.Api#actions create|read|update|destroy}]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @param {Ext.data.Record/[Ext.data.Record]} rs The Store resultset associated with the action.
+     * @protected
+     */
+    onWrite : function(action, trans, result, res, rs) {
+        var data = trans.reader.extractData(trans.reader.getRoot(result), false);
+        var success = trans.reader.getSuccess(result);
+        success = (success !== false);
+        if (success){
+            this.fireEvent("write", this, action, data, res, rs, trans.request.arg);
+        }else{
+            this.fireEvent('exception', this, 'remote', action, trans, result, rs);
+        }
+        trans.request.callback.call(trans.request.scope, data, res, success);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/XmlStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/XmlStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/XmlStore.js	(revision 76)
@@ -0,0 +1,75 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.XmlStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from XML data easier.
+ * A XmlStore will be automatically configured with a {@link Ext.data.XmlReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.XmlStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    url: 'sheldon.xml', // automatically configures a HttpProxy
+    // reader configs
+    record: 'Item', // records will have an "Item" tag
+    idPath: 'ASIN',
+    totalRecords: '@TotalResults'
+    fields: [
+        // set up the fields mapping into the xml doc
+        // The first needs mapping, the others are very basic
+        {name: 'Author', mapping: 'ItemAttributes > Author'},
+        'Title', 'Manufacturer', 'ProductGroup'
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+&#60?xml version="1.0" encoding="UTF-8"?>
+&#60ItemSearchResponse xmlns="http://webservices.amazon.com/AWSECommerceService/2009-05-15">
+    &#60Items>
+        &#60Request>
+            &#60IsValid>True&#60/IsValid>
+            &#60ItemSearchRequest>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60SearchIndex>Books&#60/SearchIndex>
+            &#60/ItemSearchRequest>
+        &#60/Request>
+        &#60TotalResults>203&#60/TotalResults>
+        &#60TotalPages>21&#60/TotalPages>
+        &#60Item>
+            &#60ASIN>0446355453&#60/ASIN>
+            &#60DetailPageURL>
+                http://www.amazon.com/
+            &#60/DetailPageURL>
+            &#60ItemAttributes>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60Manufacturer>Warner Books&#60/Manufacturer>
+                &#60ProductGroup>Book&#60/ProductGroup>
+                &#60Title>Master of the Game&#60/Title>
+            &#60/ItemAttributes>
+        &#60/Item>
+    &#60/Items>
+&#60/ItemSearchResponse>
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.XmlReader XmlReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype xmlstore
+ */
+Ext.data.XmlStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.XmlStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.XmlReader(config)
+        }));
+    }
+});
+Ext.reg('xmlstore', Ext.data.XmlStore);
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DataField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DataField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DataField.js	(revision 76)
@@ -0,0 +1,203 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Field
+ * <p>This class encapsulates the field definition information specified in the field definition objects
+ * passed to {@link Ext.data.Record#create}.</p>
+ * <p>Developers do not need to instantiate this class. Instances are created by {@link Ext.data.Record.create}
+ * and cached in the {@link Ext.data.Record#fields fields} property of the created Record constructor's <b>prototype.</b></p>
+ */
+Ext.data.Field = Ext.extend(Object, {
+    
+    constructor : function(config){
+        if(Ext.isString(config)){
+            config = {name: config};
+        }
+        Ext.apply(this, config);
+        
+        var types = Ext.data.Types,
+            st = this.sortType,
+            t;
+
+        if(this.type){
+            if(Ext.isString(this.type)){
+                this.type = Ext.data.Types[this.type.toUpperCase()] || types.AUTO;
+            }
+        }else{
+            this.type = types.AUTO;
+        }
+
+        // named sortTypes are supported, here we look them up
+        if(Ext.isString(st)){
+            this.sortType = Ext.data.SortTypes[st];
+        }else if(Ext.isEmpty(st)){
+            this.sortType = this.type.sortType;
+        }
+
+        if(!this.convert){
+            this.convert = this.type.convert;
+        }
+    },
+    
+    /**
+     * @cfg {String} name
+     * The name by which the field is referenced within the Record. This is referenced by, for example,
+     * the <code>dataIndex</code> property in column definition objects passed to {@link Ext.grid.ColumnModel}.
+     * <p>Note: In the simplest case, if no properties other than <code>name</code> are required, a field
+     * definition may consist of just a String for the field name.</p>
+     */
+    /**
+     * @cfg {Mixed} type
+     * (Optional) The data type for automatic conversion from received data to the <i>stored</i> value if <code>{@link Ext.data.Field#convert convert}</code>
+     * has not been specified. This may be specified as a string value. Possible values are
+     * <div class="mdetail-params"><ul>
+     * <li>auto (Default, implies no conversion)</li>
+     * <li>string</li>
+     * <li>int</li>
+     * <li>float</li>
+     * <li>boolean</li>
+     * <li>date</li></ul></div>
+     * <p>This may also be specified by referencing a member of the {@link Ext.data.Types} class.</p>
+     * <p>Developers may create their own application-specific data types by defining new members of the
+     * {@link Ext.data.Types} class.</p>
+     */
+    /**
+     * @cfg {Function} convert
+     * (Optional) A function which converts the value provided by the Reader into an object that will be stored
+     * in the Record. It is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+     * the configured <code>{@link Ext.data.Field#defaultValue defaultValue}</code>.</div></li>
+     * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+     * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+     *  ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+     * </ul></div>
+     * <pre><code>
+// example of convert function
+function fullName(v, record){
+    return record.name.last + ', ' + record.name.first;
+}
+
+function location(v, record){
+    return !record.city ? '' : (record.city + ', ' + record.state);
+}
+
+var Dude = Ext.data.Record.create([
+    {name: 'fullname',  convert: fullName},
+    {name: 'firstname', mapping: 'name.first'},
+    {name: 'lastname',  mapping: 'name.last'},
+    {name: 'city', defaultValue: 'homeless'},
+    'state',
+    {name: 'location',  convert: location}
+]);
+
+// create the data store
+var store = new Ext.data.Store({
+    reader: new Ext.data.JsonReader(
+        {
+            idProperty: 'key',
+            root: 'daRoot',
+            totalProperty: 'total'
+        },
+        Dude  // recordType
+    )
+});
+
+var myData = [
+    { key: 1,
+      name: { first: 'Fat',    last:  'Albert' }
+      // notice no city, state provided in data object
+    },
+    { key: 2,
+      name: { first: 'Barney', last:  'Rubble' },
+      city: 'Bedrock', state: 'Stoneridge'
+    },
+    { key: 3,
+      name: { first: 'Cliff',  last:  'Claven' },
+      city: 'Boston',  state: 'MA'
+    }
+];
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} dateFormat
+     * <p>(Optional) Used when converting received data into a Date when the {@link #type} is specified as <code>"date"</code>.</p>
+     * <p>A format string for the {@link Date#parseDate Date.parseDate} function, or "timestamp" if the
+     * value provided by the Reader is a UNIX timestamp, or "time" if the value provided by the Reader is a
+     * javascript millisecond timestamp. See {@link Date}</p>
+     */
+    dateFormat: null,
+    
+    /**
+     * @cfg {Boolean} useNull
+     * <p>(Optional) Use when converting received data into a Number type (either int or float). If the value cannot be parsed,
+     * null will be used if useNull is true, otherwise the value will be 0. Defaults to <tt>false</tt>
+     */
+    useNull: false,
+    
+    /**
+     * @cfg {Mixed} defaultValue
+     * (Optional) The default value used <b>when a Record is being created by a {@link Ext.data.Reader Reader}</b>
+     * when the item referenced by the <code>{@link Ext.data.Field#mapping mapping}</code> does not exist in the data
+     * object (i.e. undefined). (defaults to "")
+     */
+    defaultValue: "",
+    /**
+     * @cfg {String/Number} mapping
+     * <p>(Optional) A path expression for use by the {@link Ext.data.DataReader} implementation
+     * that is creating the {@link Ext.data.Record Record} to extract the Field value from the data object.
+     * If the path expression is the same as the field name, the mapping may be omitted.</p>
+     * <p>The form of the mapping expression depends on the Reader being used.</p>
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.data.JsonReader}<div class="sub-desc">The mapping is a string containing the javascript
+     * expression to reference the data from an element of the data item's {@link Ext.data.JsonReader#root root} Array. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.XmlReader}<div class="sub-desc">The mapping is an {@link Ext.DomQuery} path to the data
+     * item relative to the DOM element that represents the {@link Ext.data.XmlReader#record record}. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.ArrayReader}<div class="sub-desc">The mapping is a number indicating the Array index
+     * of the field's value. Defaults to the field specification's Array position.</div></li>
+     * </ul></div>
+     * <p>If a more complex value extraction strategy is required, then configure the Field with a {@link #convert}
+     * function. This is passed the whole row object, and may interrogate it in whatever way is necessary in order to
+     * return the desired data.</p>
+     */
+    mapping: null,
+    /**
+     * @cfg {Function} sortType
+     * (Optional) A function which converts a Field's value to a comparable value in order to ensure
+     * correct sort ordering. Predefined functions are provided in {@link Ext.data.SortTypes}. A custom
+     * sort example:<pre><code>
+// current sort     after sort we want
+// +-+------+          +-+------+
+// |1|First |          |1|First |
+// |2|Last  |          |3|Second|
+// |3|Second|          |2|Last  |
+// +-+------+          +-+------+
+
+sortType: function(value) {
+   switch (value.toLowerCase()) // native toLowerCase():
+   {
+      case 'first': return 1;
+      case 'second': return 2;
+      default: return 3;
+   }
+}
+     * </code></pre>
+     */
+    sortType : null,
+    /**
+     * @cfg {String} sortDir
+     * (Optional) Initial direction to sort (<code>"ASC"</code> or  <code>"DESC"</code>).  Defaults to
+     * <code>"ASC"</code>.
+     */
+    sortDir : "ASC",
+    /**
+     * @cfg {Boolean} allowBlank
+     * (Optional) Used for validating a {@link Ext.data.Record record}, defaults to <code>true</code>.
+     * An empty value here will cause {@link Ext.data.Record}.{@link Ext.data.Record#isValid isValid}
+     * to evaluate to <code>false</code>.
+     */
+    allowBlank : true
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Record.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Record.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Record.js	(revision 76)
@@ -0,0 +1,415 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Record
+ * <p>Instances of this class encapsulate both Record <em>definition</em> information, and Record
+ * <em>value</em> information for use in {@link Ext.data.Store} objects, or any code which needs
+ * to access Records cached in an {@link Ext.data.Store} object.</p>
+ * <p>Constructors for this class are generated by passing an Array of field definition objects to {@link #create}.
+ * Instances are usually only created by {@link Ext.data.Reader} implementations when processing unformatted data
+ * objects.</p>
+ * <p>Note that an instance of a Record class may only belong to one {@link Ext.data.Store Store} at a time.
+ * In order to copy data from one Store to another, use the {@link #copy} method to create an exact
+ * copy of the Record, and insert the new instance into the other Store.</p>
+ * <p>When serializing a Record for submission to the server, be aware that it contains many private
+ * properties, and also a reference to its owning Store which in turn holds references to its Records.
+ * This means that a whole Record may not be encoded using {@link Ext.util.JSON.encode}. Instead, use the
+ * <code>{@link #data}</code> and <code>{@link #id}</code> properties.</p>
+ * <p>Record objects generated by this constructor inherit all the methods of Ext.data.Record listed below.</p>
+ * @constructor
+ * <p>This constructor should not be used to create Record objects. Instead, use {@link #create} to
+ * generate a subclass of Ext.data.Record configured with information about its constituent fields.<p>
+ * <p><b>The generated constructor has the same signature as this constructor.</b></p>
+ * @param {Object} data (Optional) An object, the properties of which provide values for the new Record's
+ * fields. If not specified the <code>{@link Ext.data.Field#defaultValue defaultValue}</code>
+ * for each field will be assigned.
+ * @param {Object} id (Optional) The id of the Record. The id is used by the
+ * {@link Ext.data.Store} object which owns the Record to index its collection
+ * of Records (therefore this id should be unique within each store). If an
+ * <code>id</code> is not specified a <b><code>{@link #phantom}</code></b>
+ * Record will be created with an {@link #Record.id automatically generated id}.
+ */
+Ext.data.Record = function(data, id){
+    // if no id, call the auto id method
+    this.id = (id || id === 0) ? id : Ext.data.Record.id(this);
+    this.data = data || {};
+};
+
+/**
+ * Generate a constructor for a specific Record layout.
+ * @param {Array} o An Array of <b>{@link Ext.data.Field Field}</b> definition objects.
+ * The constructor generated by this method may be used to create new Record instances. The data
+ * object must contain properties named after the {@link Ext.data.Field field}
+ * <b><tt>{@link Ext.data.Field#name}s</tt></b>.  Example usage:<pre><code>
+// create a Record constructor from a description of the fields
+var TopicRecord = Ext.data.Record.create([ // creates a subclass of Ext.data.Record
+    {{@link Ext.data.Field#name name}: 'title', {@link Ext.data.Field#mapping mapping}: 'topic_title'},
+    {name: 'author', mapping: 'username', allowBlank: false},
+    {name: 'totalPosts', mapping: 'topic_replies', type: 'int'},
+    {name: 'lastPost', mapping: 'post_time', type: 'date'},
+    {name: 'lastPoster', mapping: 'user2'},
+    {name: 'excerpt', mapping: 'post_text', allowBlank: false},
+    // In the simplest case, if no properties other than <tt>name</tt> are required,
+    // a field definition may consist of just a String for the field name.
+    'signature'
+]);
+
+// create Record instance
+var myNewRecord = new TopicRecord(
+    {
+        title: 'Do my job please',
+        author: 'noobie',
+        totalPosts: 1,
+        lastPost: new Date(),
+        lastPoster: 'Animal',
+        excerpt: 'No way dude!',
+        signature: ''
+    },
+    id // optionally specify the id of the record otherwise {@link #Record.id one is auto-assigned}
+);
+myStore.{@link Ext.data.Store#add add}(myNewRecord);
+</code></pre>
+ * @method create
+ * @return {Function} A constructor which is used to create new Records according
+ * to the definition. The constructor has the same signature as {@link #Record}.
+ * @static
+ */
+Ext.data.Record.create = function(o){
+    var f = Ext.extend(Ext.data.Record, {});
+    var p = f.prototype;
+    p.fields = new Ext.util.MixedCollection(false, function(field){
+        return field.name;
+    });
+    for(var i = 0, len = o.length; i < len; i++){
+        p.fields.add(new Ext.data.Field(o[i]));
+    }
+    f.getField = function(name){
+        return p.fields.get(name);
+    };
+    return f;
+};
+
+Ext.data.Record.PREFIX = 'ext-record';
+Ext.data.Record.AUTO_ID = 1;
+Ext.data.Record.EDIT = 'edit';
+Ext.data.Record.REJECT = 'reject';
+Ext.data.Record.COMMIT = 'commit';
+
+
+/**
+ * Generates a sequential id. This method is typically called when a record is {@link #create}d
+ * and {@link #Record no id has been specified}. The returned id takes the form:
+ * <tt>&#123;PREFIX}-&#123;AUTO_ID}</tt>.<div class="mdetail-params"><ul>
+ * <li><b><tt>PREFIX</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.PREFIX</tt>
+ * (defaults to <tt>'ext-record'</tt>)</p></li>
+ * <li><b><tt>AUTO_ID</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.AUTO_ID</tt>
+ * (defaults to <tt>1</tt> initially)</p></li>
+ * </ul></div>
+ * @param {Record} rec The record being created.  The record does not exist, it's a {@link #phantom}.
+ * @return {String} auto-generated string id, <tt>"ext-record-i++'</tt>;
+ */
+Ext.data.Record.id = function(rec) {
+    rec.phantom = true;
+    return [Ext.data.Record.PREFIX, '-', Ext.data.Record.AUTO_ID++].join('');
+};
+
+Ext.data.Record.prototype = {
+    /**
+     * <p><b>This property is stored in the Record definition's <u>prototype</u></b></p>
+     * A MixedCollection containing the defined {@link Ext.data.Field Field}s for this Record.  Read-only.
+     * @property fields
+     * @type Ext.util.MixedCollection
+     */
+    /**
+     * An object hash representing the data for this Record. Every field name in the Record definition
+     * is represented by a property of that name in this object. Note that unless you specified a field
+     * with {@link Ext.data.Field#name name} "id" in the Record definition, this will <b>not</b> contain
+     * an <tt>id</tt> property.
+     * @property data
+     * @type {Object}
+     */
+    /**
+     * The unique ID of the Record {@link #Record as specified at construction time}.
+     * @property id
+     * @type {Object}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.XmlReader XmlReader}</b>.</p>
+     * <p>The XML element which was the source of the data for this Record.</p>
+     * @property node
+     * @type {XMLElement}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.ArrayReader ArrayReader} or a {@link Ext.data.JsonReader JsonReader}</b>.</p>
+     * <p>The Array or object which was the source of the data for this Record.</p>
+     * @property json
+     * @type {Array|Object}
+     */
+    /**
+     * Readonly flag - true if this Record has been modified.
+     * @type Boolean
+     */
+    dirty : false,
+    editing : false,
+    error : null,
+    /**
+     * This object contains a key and value storing the original values of all modified
+     * fields or is null if no fields have been modified.
+     * @property modified
+     * @type {Object}
+     */
+    modified : null,
+    /**
+     * <tt>true</tt> when the record does not yet exist in a server-side database (see
+     * {@link #markDirty}).  Any record which has a real database pk set as its id property
+     * is NOT a phantom -- it's real.
+     * @property phantom
+     * @type {Boolean}
+     */
+    phantom : false,
+
+    // private
+    join : function(store){
+        /**
+         * The {@link Ext.data.Store} to which this Record belongs.
+         * @property store
+         * @type {Ext.data.Store}
+         */
+        this.store = store;
+    },
+
+    /**
+     * Set the {@link Ext.data.Field#name named field} to the specified value.  For example:
+     * <pre><code>
+// record has a field named 'firstname'
+var Employee = Ext.data.Record.{@link #create}([
+    {name: 'firstname'},
+    ...
+]);
+
+// update the 2nd record in the store:
+var rec = myStore.{@link Ext.data.Store#getAt getAt}(1);
+
+// set the value (shows dirty flag):
+rec.set('firstname', 'Betty');
+
+// commit the change (removes dirty flag):
+rec.{@link #commit}();
+
+// update the record in the store, bypass setting dirty flag,
+// and do not store the change in the {@link Ext.data.Store#getModifiedRecords modified records}
+rec.{@link #data}['firstname'] = 'Wilma'; // updates record, but not the view
+rec.{@link #commit}(); // updates the view
+     * </code></pre>
+     * <b>Notes</b>:<div class="mdetail-params"><ul>
+     * <li>If the store has a writer and <code>autoSave=true</code>, each set()
+     * will execute an XHR to the server.</li>
+     * <li>Use <code>{@link #beginEdit}</code> to prevent the store's <code>update</code>
+     * event firing while using set().</li>
+     * <li>Use <code>{@link #endEdit}</code> to have the store's <code>update</code>
+     * event fire.</li>
+     * </ul></div>
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to set.
+     * @param {String/Object/Array} value The value to set the field to.
+     */
+    set : function(name, value){
+        var encode = Ext.isPrimitive(value) ? String : Ext.encode;
+        if(encode(this.data[name]) == encode(value)) {
+            return;
+        }        
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        if(this.modified[name] === undefined){
+            this.modified[name] = this.data[name];
+        }
+        this.data[name] = value;
+        if(!this.editing){
+            this.afterEdit();
+        }
+    },
+
+    // private
+    afterEdit : function(){
+        if (this.store != undefined && typeof this.store.afterEdit == "function") {
+            this.store.afterEdit(this);
+        }
+    },
+
+    // private
+    afterReject : function(){
+        if(this.store){
+            this.store.afterReject(this);
+        }
+    },
+
+    // private
+    afterCommit : function(){
+        if(this.store){
+            this.store.afterCommit(this);
+        }
+    },
+
+    /**
+     * Get the value of the {@link Ext.data.Field#name named field}.
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to get the value of.
+     * @return {Object} The value of the field.
+     */
+    get : function(name){
+        return this.data[name];
+    },
+
+    /**
+     * Begin an edit. While in edit mode, no events (e.g.. the <code>update</code> event)
+     * are relayed to the containing store.
+     * See also: <code>{@link #endEdit}</code> and <code>{@link #cancelEdit}</code>.
+     */
+    beginEdit : function(){
+        this.editing = true;
+        this.modified = this.modified || {};
+    },
+
+    /**
+     * Cancels all changes made in the current edit operation.
+     */
+    cancelEdit : function(){
+        this.editing = false;
+        delete this.modified;
+    },
+
+    /**
+     * End an edit. If any data was modified, the containing store is notified
+     * (ie, the store's <code>update</code> event will fire).
+     */
+    endEdit : function(){
+        this.editing = false;
+        if(this.dirty){
+            this.afterEdit();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Rejects all changes made to the Record since either creation, or the last commit operation.
+     * Modified fields are reverted to their original values.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of reject operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    reject : function(silent){
+        var m = this.modified;
+        for(var n in m){
+            if(typeof m[n] != "function"){
+                this.data[n] = m[n];
+            }
+        }
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterReject();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Commits all changes made to the Record since either creation, or the last commit operation.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of commit operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    commit : function(silent){
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterCommit();
+        }
+    },
+
+    /**
+     * Gets a hash of only the fields that have been modified since this Record was created or commited.
+     * @return Object
+     */
+    getChanges : function(){
+        var m = this.modified, cs = {};
+        for(var n in m){
+            if(m.hasOwnProperty(n)){
+                cs[n] = this.data[n];
+            }
+        }
+        return cs;
+    },
+
+    // private
+    hasError : function(){
+        return this.error !== null;
+    },
+
+    // private
+    clearError : function(){
+        this.error = null;
+    },
+
+    /**
+     * Creates a copy (clone) of this Record.
+     * @param {String} id (optional) A new Record id, defaults to the id
+     * of the record being copied. See <code>{@link #id}</code>. 
+     * To generate a phantom record with a new id use:<pre><code>
+var rec = record.copy(); // clone the record
+Ext.data.Record.id(rec); // automatically generate a unique sequential id
+     * </code></pre>
+     * @return {Record}
+     */
+    copy : function(newId) {
+        return new this.constructor(Ext.apply({}, this.data), newId || this.id);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the passed field name has been <code>{@link #modified}</code>
+     * since the load or last commit.
+     * @param {String} fieldName {@link Ext.data.Field.{@link Ext.data.Field#name}
+     * @return {Boolean}
+     */
+    isModified : function(fieldName){
+        return !!(this.modified && this.modified.hasOwnProperty(fieldName));
+    },
+
+    /**
+     * By default returns <tt>false</tt> if any {@link Ext.data.Field field} within the
+     * record configured with <tt>{@link Ext.data.Field#allowBlank} = false</tt> returns
+     * <tt>true</tt> from an {@link Ext}.{@link Ext#isEmpty isempty} test.
+     * @return {Boolean}
+     */
+    isValid : function() {
+        return this.fields.find(function(f) {
+            return (f.allowBlank === false && Ext.isEmpty(this.data[f.name])) ? true : false;
+        },this) ? false : true;
+    },
+
+    /**
+     * <p>Marks this <b>Record</b> as <code>{@link #dirty}</code>.  This method
+     * is used interally when adding <code>{@link #phantom}</code> records to a
+     * {@link Ext.data.Store#writer writer enabled store}.</p>
+     * <br><p>Marking a record <code>{@link #dirty}</code> causes the phantom to
+     * be returned by {@link Ext.data.Store#getModifiedRecords} where it will
+     * have a create action composed for it during {@link Ext.data.Store#save store save}
+     * operations.</p>
+     */
+    markDirty : function(){
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        this.fields.each(function(f) {
+            this.modified[f.name] = this.data[f.name];
+        },this);
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/HttpProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/HttpProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/HttpProxy.js	(revision 76)
@@ -0,0 +1,261 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.HttpProxy
+ * @extends Ext.data.DataProxy
+ * <p>An implementation of {@link Ext.data.DataProxy} that processes data requests within the same
+ * domain of the originating page.</p>
+ * <p><b>Note</b>: this class cannot be used to retrieve data from a domain other
+ * than the domain from which the running page was served. For cross-domain requests, use a
+ * {@link Ext.data.ScriptTagProxy ScriptTagProxy}.</p>
+ * <p>Be aware that to enable the browser to parse an XML document, the server must set
+ * the Content-Type header in the HTTP response to "<tt>text/xml</tt>".</p>
+ * @constructor
+ * @param {Object} conn
+ * An {@link Ext.data.Connection} object, or options parameter to {@link Ext.Ajax#request}.
+ * <p>Note that if this HttpProxy is being used by a {@link Ext.data.Store Store}, then the
+ * Store's call to {@link #load} will override any specified <tt>callback</tt> and <tt>params</tt>
+ * options. In this case, use the Store's {@link Ext.data.Store#events events} to modify parameters,
+ * or react to loading events. The Store's {@link Ext.data.Store#baseParams baseParams} may also be
+ * used to pass parameters known at instantiation time.</p>
+ * <p>If an options parameter is passed, the singleton {@link Ext.Ajax} object will be used to make
+ * the request.</p>
+ */
+Ext.data.HttpProxy = function(conn){
+    Ext.data.HttpProxy.superclass.constructor.call(this, conn);
+
+    /**
+     * The Connection object (Or options parameter to {@link Ext.Ajax#request}) which this HttpProxy
+     * uses to make requests to the server. Properties of this object may be changed dynamically to
+     * change the way data is requested.
+     * @property
+     */
+    this.conn = conn;
+
+    // nullify the connection url.  The url param has been copied to 'this' above.  The connection
+    // url will be set during each execution of doRequest when buildUrl is called.  This makes it easier for users to override the
+    // connection url during beforeaction events (ie: beforeload, beforewrite, etc).
+    // Url is always re-defined during doRequest.
+    this.conn.url = null;
+
+    this.useAjax = !conn || !conn.events;
+
+    // A hash containing active requests, keyed on action [Ext.data.Api.actions.create|read|update|destroy]
+    var actions = Ext.data.Api.actions;
+    this.activeRequest = {};
+    for (var verb in actions) {
+        this.activeRequest[actions[verb]] = undefined;
+    }
+};
+
+Ext.extend(Ext.data.HttpProxy, Ext.data.DataProxy, {
+    /**
+     * Return the {@link Ext.data.Connection} object being used by this Proxy.
+     * @return {Connection} The Connection object. This object may be used to subscribe to events on
+     * a finer-grained basis than the DataProxy events.
+     */
+    getConnection : function() {
+        return this.useAjax ? Ext.Ajax : this.conn;
+    },
+
+    /**
+     * Used for overriding the url used for a single request.  Designed to be called during a beforeaction event.  Calling setUrl
+     * will override any urls set via the api configuration parameter.  Set the optional parameter makePermanent to set the url for
+     * all subsequent requests.  If not set to makePermanent, the next request will use the same url or api configuration defined
+     * in the initial proxy configuration.
+     * @param {String} url
+     * @param {Boolean} makePermanent (Optional) [false]
+     *
+     * (e.g.: beforeload, beforesave, etc).
+     */
+    setUrl : function(url, makePermanent) {
+        this.conn.url = url;
+        if (makePermanent === true) {
+            this.url = url;
+            this.api = null;
+            Ext.data.Api.prepare(this);
+        }
+    },
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, cb, scope, arg) {
+        var  o = {
+            method: (this.api[action]) ? this.api[action]['method'] : undefined,
+            request: {
+                callback : cb,
+                scope : scope,
+                arg : arg
+            },
+            reader: reader,
+            callback : this.createCallback(action, rs),
+            scope: this
+        };
+
+        // If possible, transmit data using jsonData || xmlData on Ext.Ajax.request (An installed DataWriter would have written it there.).
+        // Use std HTTP params otherwise.
+        if (params.jsonData) {
+            o.jsonData = params.jsonData;
+        } else if (params.xmlData) {
+            o.xmlData = params.xmlData;
+        } else {
+            o.params = params || {};
+        }
+        // Set the connection url.  If this.conn.url is not null here,
+        // the user must have overridden the url during a beforewrite/beforeload event-handler.
+        // this.conn.url is nullified after each request.
+        this.conn.url = this.buildUrl(action, rs);
+
+        if(this.useAjax){
+
+            Ext.applyIf(o, this.conn);
+
+            // If a currently running request is found for this action, abort it.
+            if (this.activeRequest[action]) {
+                ////
+                // Disabled aborting activeRequest while implementing REST.  activeRequest[action] will have to become an array
+                // TODO ideas anyone?
+                //
+                //Ext.Ajax.abort(this.activeRequest[action]);
+            }
+            this.activeRequest[action] = Ext.Ajax.request(o);
+        }else{
+            this.conn.request(o);
+        }
+        // request is sent, nullify the connection url in preparation for the next request
+        this.conn.url = null;
+    },
+
+    /**
+     * Returns a callback function for a request.  Note a special case is made for the
+     * read action vs all the others.
+     * @param {String} action [create|update|delete|load]
+     * @param {Ext.data.Record[]} rs The Store-recordset being acted upon
+     * @private
+     */
+    createCallback : function(action, rs) {
+        return function(o, success, response) {
+            this.activeRequest[action] = undefined;
+            if (!success) {
+                if (action === Ext.data.Api.actions.read) {
+                    // @deprecated: fire loadexception for backwards compat.
+                    // TODO remove
+                    this.fireEvent('loadexception', this, o, response);
+                }
+                this.fireEvent('exception', this, 'response', action, o, response);
+                o.request.callback.call(o.request.scope, null, o.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                this.onRead(action, o, response);
+            } else {
+                this.onWrite(action, o, response, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read action
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : function(action, o, response) {
+        var result;
+        try {
+            result = o.reader.read(response);
+        }catch(e){
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response, e);
+
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response);
+
+            // Get DataReader read-back a response-object to pass along to exception event
+            var res = o.reader.readResponse(action, response);
+            this.fireEvent('exception', this, 'remote', action, o, res, null);
+        }
+        else {
+            this.fireEvent('load', this, o, o.request.arg);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made identical.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, result, o.request.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : function(action, o, response, rs) {
+        var reader = o.reader;
+        var res;
+        try {
+            res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (res.success === true) {
+            this.fireEvent('write', this, action, res.data, res, rs, o.request.arg);
+        } else {
+            this.fireEvent('exception', this, 'remote', action, o, res, rs);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made similar.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, res.data, res, res.success);
+    },
+
+    // inherit docs
+    destroy: function(){
+        if(!this.useAjax){
+            this.conn.abort();
+        }else if(this.activeRequest){
+            var actions = Ext.data.Api.actions;
+            for (var verb in actions) {
+                if(this.activeRequest[actions[verb]]){
+                    Ext.Ajax.abort(this.activeRequest[actions[verb]]);
+                }
+            }
+        }
+        Ext.data.HttpProxy.superclass.destroy.call(this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/XmlReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/XmlReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/XmlReader.js	(revision 76)
@@ -0,0 +1,259 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.XmlReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an XML document
+ * based on mappings in a provided {@link Ext.data.Record} constructor.</p>
+ * <p><b>Note</b>: that in order for the browser to parse a returned XML document, the Content-Type
+ * header in the HTTP response must be set to "text/xml" or "application/xml".</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+   {name: 'name', mapping: 'name'},     // "mapping" property not needed if it is the same as "name"
+   {name: 'occupation'}                 // This field will use "occupation" as the mapping.
+]);
+var myReader = new Ext.data.XmlReader({
+   totalProperty: "results", // The element which contains the total dataset size (optional)
+   record: "row",           // The repeated element which contains row information
+   idProperty: "id"         // The element within the row that provides an ID for the record (optional)
+   messageProperty: "msg"   // The element within the response that provides a user-feedback message (optional)
+}, Employee);
+</code></pre>
+ * <p>
+ * This would consume an XML file like this:
+ * <pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;dataset>
+ &lt;results>2&lt;/results>
+ &lt;row>
+   &lt;id>1&lt;/id>
+   &lt;name>Bill&lt;/name>
+   &lt;occupation>Gardener&lt;/occupation>
+ &lt;/row>
+ &lt;row>
+   &lt;id>2&lt;/id>
+   &lt;name>Ben&lt;/name>
+   &lt;occupation>Horticulturalist&lt;/occupation>
+ &lt;/row>
+&lt;/dataset>
+</code></pre>
+ * @cfg {String} totalProperty The DomQuery path from which to retrieve the total number of records
+ * in the dataset. This is only needed if the whole dataset is not passed in one go, but is being
+ * paged from the remote server.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} successProperty The DomQuery path to the success attribute used by forms.
+ * @cfg {String} idPath The DomQuery path relative from the record element to the element that contains
+ * a record identifier value.
+ * @constructor
+ * Create a new XmlReader.
+ * @param {Object} meta Metadata configuration options
+ * @param {Object} recordType Either an Array of field definition objects as passed to
+ * {@link Ext.data.Record#create}, or a Record constructor object created using {@link Ext.data.Record#create}.
+ */
+Ext.data.XmlReader = function(meta, recordType){
+    meta = meta || {};
+
+    // backwards compat, convert idPath or id / success
+    Ext.applyIf(meta, {
+        idProperty: meta.idProperty || meta.idPath || meta.id,
+        successProperty: meta.successProperty || meta.success
+    });
+
+    Ext.data.XmlReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.XmlReader, Ext.data.DataReader, {
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the parsed XML document.  The response is expected
+     * to contain a property called <tt>responseXML</tt> which refers to an XML document object.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var doc = response.responseXML;
+        if(!doc) {
+            throw {message: "XmlReader.read: XML Document not available"};
+        }
+        return this.readRecords(doc);
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from an XML document.
+     * @param {Object} doc A parsed XML document.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(doc){
+        /**
+         * After any data loads/reads, the raw XML Document is available for further custom processing.
+         * @type XMLDocument
+         */
+        this.xmlData = doc;
+
+        var root    = doc.documentElement || doc,
+            q       = Ext.DomQuery,
+            totalRecords = 0,
+            success = true;
+
+        if(this.meta.totalProperty){
+            totalRecords = this.getTotal(root, 0);
+        }
+        if(this.meta.successProperty){
+            success = this.getSuccess(root);
+        }
+
+        var records = this.extractData(q.select(this.meta.record, root), true); // <-- true to return Ext.data.Record[]
+
+        // TODO return Ext.data.Response instance.  @see #readResponse
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords || records.length
+        };
+    },
+
+    /**
+     * Decode an XML response from server.
+     * @param {String} action [{@link Ext.data.Api#actions} create|read|update|destroy]
+     * @param {Object} response HTTP Response object from browser.
+     * @return {Ext.data.Response} An instance of {@link Ext.data.Response}
+     */
+    readResponse : function(action, response) {
+        var q = Ext.DomQuery,
+            doc = response.responseXML,
+            root = doc.documentElement || doc;
+
+        // create general Response instance.
+        var res = new Ext.data.Response({
+            action: action,
+            success : this.getSuccess(root),
+            message: this.getMessage(root),
+            data: this.extractData(q.select(this.meta.record, root) || q.select(this.meta.root, root), false),
+            raw: doc
+        });
+
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.DataReader.Error('successProperty-response', this.meta.successProperty);
+        }
+
+        // Create actions from a response having status 200 must return pk
+        if (action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(res.data);
+            if (def && Ext.isEmpty(res.data)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+        return res;
+    },
+
+    getSuccess : function() {
+        return true;
+    },
+
+    /**
+     * build response-data extractor functions.
+     * @private
+     * @ignore
+     */
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s       = this.meta,
+            Record  = this.recordType,
+            f       = Record.prototype.fields,
+            fi      = f.items,
+            fl      = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = function(res) {
+            return (!Ext.isEmpty(res[this.meta.record])) ? res[this.meta.record] : res[this.meta.root];
+        };
+        if (s.idPath || s.idProperty) {
+            var g = this.createAccessor(s.idPath || s.idProperty);
+            this.getId = function(rec) {
+                var id = g(rec) || rec.id;
+                return (id === undefined || id === '') ? null : id;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * Creates a function to return some particular key of data from a response.
+     * @param {String} key
+     * @return {Function}
+     * @private
+     * @ignore
+     */
+    createAccessor : function(){
+        var q = Ext.DomQuery;
+        return function(key) {
+            if (Ext.isFunction(key)) {
+                return key;
+            }
+            switch(key) {
+                case this.meta.totalProperty:
+                    return function(root, def){
+                        return q.selectNumber(key, root, def);
+                    };
+                    break;
+                case this.meta.successProperty:
+                    return function(root, def) {
+                        var sv = q.selectValue(key, root, true);
+                        var success = sv !== false && sv !== 'false';
+                        return success;
+                    };
+                    break;
+                default:
+                    return function(root, def) {
+                        return q.selectValue(key, root, def);
+                    };
+                    break;
+            }
+        };
+    }(),
+
+    /**
+     * extracts values and type-casts a row of data from server, extracted by #extractData
+     * @param {Hash} data
+     * @param {Ext.data.Field[]} items
+     * @param {Number} len
+     * @private
+     * @ignore
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/JsonStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/JsonStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/JsonStore.js	(revision 76)
@@ -0,0 +1,49 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.JsonStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from JSON data easier.
+ * A JsonStore will be automatically configured with a {@link Ext.data.JsonReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.JsonStore({
+    // store configs
+    autoDestroy: true,
+    url: 'get-images.php',
+    storeId: 'myStore',
+    // reader configs
+    root: 'images',
+    idProperty: 'name',
+    fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date'}]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+{
+    images: [
+        {name: 'Image one', url:'/GetImage.php?id=1', size:46.5, lastmod: new Date(2007, 10, 29)},
+        {name: 'Image Two', url:'/GetImage.php?id=2', size:43.2, lastmod: new Date(2007, 10, 30)}
+    ]
+}
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of
+ * <b>{@link Ext.data.JsonReader JsonReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype jsonstore
+ */
+Ext.data.JsonStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.JsonStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.JsonReader(config)
+        }));
+    }
+});
+Ext.reg('jsonstore', Ext.data.JsonStore);
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DirectStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DirectStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DirectStore.js	(revision 76)
@@ -0,0 +1,54 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DirectStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to create an {@link Ext.data.Store} configured with an
+ * {@link Ext.data.DirectProxy} and {@link Ext.data.JsonReader} to make interacting
+ * with an {@link Ext.Direct} Server-side {@link Ext.direct.Provider Provider} easier.
+ * To create a different proxy/reader combination create a basic {@link Ext.data.Store}
+ * configured as needed.</p>
+ *
+ * <p><b>*Note:</b> Although they are not listed, this class inherits all of the config options of:</p>
+ * <div><ul class="mdetail-params">
+ * <li><b>{@link Ext.data.Store Store}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ *
+ * </ul></div>
+ * <li><b>{@link Ext.data.JsonReader JsonReader}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.JsonReader#root root}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#idProperty idProperty}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#totalProperty totalProperty}</b></tt></li>
+ * </ul></div>
+ *
+ * <li><b>{@link Ext.data.DirectProxy DirectProxy}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.DirectProxy#directFn directFn}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramOrder paramOrder}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramsAsHash paramsAsHash}</b></tt></li>
+ * </ul></div>
+ * </ul></div>
+ *
+ * @xtype directstore
+ *
+ * @constructor
+ * @param {Object} config
+ */
+Ext.data.DirectStore = Ext.extend(Ext.data.Store, {
+    constructor : function(config){
+        // each transaction upon a singe record will generate a distinct Direct transaction since Direct queues them into one Ajax request.
+        var c = Ext.apply({}, {
+            batchTransactions: false
+        }, config);
+        Ext.data.DirectStore.superclass.constructor.call(this, Ext.apply(c, {
+            proxy: Ext.isDefined(c.proxy) ? c.proxy : new Ext.data.DirectProxy(Ext.copyTo({}, c, 'paramOrder,paramsAsHash,directFn,api')),
+            reader: (!Ext.isDefined(c.reader) && c.fields) ? new Ext.data.JsonReader(Ext.copyTo({}, c, 'totalProperty,root,idProperty'), c.fields) : c.reader
+        }));
+    }
+});
+Ext.reg('directstore', Ext.data.DirectStore);
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Request.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Request.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Request.js	(revision 76)
@@ -0,0 +1,41 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Request
+ * A simple Request class used internally to the data package to provide more generalized remote-requests
+ * to a DataProxy.
+ * TODO Not yet implemented.  Implement in Ext.data.Store#execute
+ */
+Ext.data.Request = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Request.prototype = {
+    /**
+     * @cfg {String} action
+     */
+    action : undefined,
+    /**
+     * @cfg {Ext.data.Record[]/Ext.data.Record} rs The Store recordset associated with the request.
+     */
+    rs : undefined,
+    /**
+     * @cfg {Object} params HTTP request params
+     */
+    params: undefined,
+    /**
+     * @cfg {Function} callback The function to call when request is complete
+     */
+    callback : Ext.emptyFn,
+    /**
+     * @cfg {Object} scope The scope of the callback funtion
+     */
+    scope : undefined,
+    /**
+     * @cfg {Ext.data.DataReader} reader The DataReader instance which will parse the received response
+     */
+    reader : undefined
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayStore.js	(revision 76)
@@ -0,0 +1,70 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.ArrayStore
+ * @extends Ext.data.Store
+ * <p>Formerly known as "SimpleStore".</p>
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from Array data easier.
+ * An ArrayStore will be automatically configured with a {@link Ext.data.ArrayReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.ArrayStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    // reader configs
+    idIndex: 0,  
+    fields: [
+       'company',
+       {name: 'price', type: 'float'},
+       {name: 'change', type: 'float'},
+       {name: 'pctChange', type: 'float'},
+       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+var myData = [
+    ['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
+    ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
+    ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
+    ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
+    ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
+];
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.ArrayReader ArrayReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype arraystore
+ */
+Ext.data.ArrayStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.ArrayStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.ArrayReader(config)
+        }));
+    },
+
+    loadData : function(data, append){
+        if(this.expandData === true){
+            var r = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                r[r.length] = [data[i]];
+            }
+            data = r;
+        }
+        Ext.data.ArrayStore.superclass.loadData.call(this, data, append);
+    }
+});
+Ext.reg('arraystore', Ext.data.ArrayStore);
+
+// backwards compat
+Ext.data.SimpleStore = Ext.data.ArrayStore;
+Ext.reg('simplestore', Ext.data.SimpleStore);
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/JsonReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/JsonReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/JsonReader.js	(revision 76)
@@ -0,0 +1,359 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.JsonReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects
+ * from a JSON packet based on mappings in a provided {@link Ext.data.Record}
+ * constructor.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var myReader = new Ext.data.JsonReader({
+    // metadata configuration options:
+    {@link #idProperty}: 'id'
+    {@link #root}: 'rows',
+    {@link #totalProperty}: 'results',
+    {@link Ext.data.DataReader#messageProperty}: "msg"  // The element within the response that provides a user-feedback message (optional)
+
+    // the fields config option will internally create an {@link Ext.data.Record}
+    // constructor that provides mapping for reading the record data objects
+    {@link Ext.data.DataReader#fields fields}: [
+        // map Record&#39;s 'firstname' field to data object&#39;s key of same name
+        {name: 'name', mapping: 'firstname'},
+        // map Record&#39;s 'job' field to data object&#39;s 'occupation' key
+        {name: 'job', mapping: 'occupation'}
+    ]
+});
+</code></pre>
+ * <p>This would consume a JSON data object of the form:</p><pre><code>
+{
+    results: 2000, // Reader&#39;s configured {@link #totalProperty}
+    rows: [        // Reader&#39;s configured {@link #root}
+        // record data objects:
+        { {@link #idProperty id}: 1, firstname: 'Bill', occupation: 'Gardener' },
+        { {@link #idProperty id}: 2, firstname: 'Ben' , occupation: 'Horticulturalist' },
+        ...
+    ]
+}
+</code></pre>
+ * <p><b><u>Automatic configuration using metaData</u></b></p>
+ * <p>It is possible to change a JsonReader's metadata at any time by including
+ * a <b><tt>metaData</tt></b> property in the JSON data object. If the JSON data
+ * object has a <b><tt>metaData</tt></b> property, a {@link Ext.data.Store Store}
+ * object using this Reader will reconfigure itself to use the newly provided
+ * field definition and fire its {@link Ext.data.Store#metachange metachange}
+ * event. The metachange event handler may interrogate the <b><tt>metaData</tt></b>
+ * property to perform any configuration required.</p>
+ * <p>Note that reconfiguring a Store potentially invalidates objects which may
+ * refer to Fields or Records which no longer exist.</p>
+ * <p>To use this facility you would create the JsonReader like this:</p><pre><code>
+var myReader = new Ext.data.JsonReader();
+</code></pre>
+ * <p>The first data packet from the server would configure the reader by
+ * containing a <b><tt>metaData</tt></b> property <b>and</b> the data. For
+ * example, the JSON data object might take the form:</p><pre><code>
+{
+    metaData: {
+        "{@link #idProperty}": "id",
+        "{@link #root}": "rows",
+        "{@link #totalProperty}": "results"
+        "{@link #successProperty}": "success",
+        "{@link Ext.data.DataReader#fields fields}": [
+            {"name": "name"},
+            {"name": "job", "mapping": "occupation"}
+        ],
+        // used by store to set its sortInfo
+        "sortInfo":{
+           "field": "name",
+           "direction": "ASC"
+        },
+        // {@link Ext.PagingToolbar paging data} (if applicable)
+        "start": 0,
+        "limit": 2,
+        // custom property
+        "foo": "bar"
+    },
+    // Reader&#39;s configured {@link #successProperty}
+    "success": true,
+    // Reader&#39;s configured {@link #totalProperty}
+    "results": 2000,
+    // Reader&#39;s configured {@link #root}
+    // (this data simulates 2 results {@link Ext.PagingToolbar per page})
+    "rows": [ // <b>*Note:</b> this must be an Array
+        { "id": 1, "name": "Bill", "occupation": "Gardener" },
+        { "id": 2, "name":  "Ben", "occupation": "Horticulturalist" }
+    ]
+}
+ * </code></pre>
+ * <p>The <b><tt>metaData</tt></b> property in the JSON data object should contain:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>any of the configuration options for this class</li>
+ * <li>a <b><tt>{@link Ext.data.Record#fields fields}</tt></b> property which
+ * the JsonReader will use as an argument to the
+ * {@link Ext.data.Record#create data Record create method} in order to
+ * configure the layout of the Records it will produce.</li>
+ * <li>a <b><tt>{@link Ext.data.Store#sortInfo sortInfo}</tt></b> property
+ * which the JsonReader will use to set the {@link Ext.data.Store}'s
+ * {@link Ext.data.Store#sortInfo sortInfo} property</li>
+ * <li>any custom properties needed</li>
+ * </ul></div>
+ *
+ * @constructor
+ * Create a new JsonReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.JsonReader = function(meta, recordType){
+    meta = meta || {};
+    /**
+     * @cfg {String} idProperty [id] Name of the property within a row object
+     * that contains a record identifier value.  Defaults to <tt>id</tt>
+     */
+    /**
+     * @cfg {String} successProperty [success] Name of the property from which to
+     * retrieve the success attribute. Defaults to <tt>success</tt>.  See
+     * {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+     * for additional information.
+     */
+    /**
+     * @cfg {String} totalProperty [total] Name of the property from which to
+     * retrieve the total number of records in the dataset. This is only needed
+     * if the whole dataset is not passed in one go, but is being paged from
+     * the remote server.  Defaults to <tt>total</tt>.
+     */
+    /**
+     * @cfg {String} root [undefined] <b>Required</b>.  The name of the property
+     * which contains the Array of row objects.  Defaults to <tt>undefined</tt>.
+     * An exception will be thrown if the root property is undefined. The data
+     * packet value for this property should be an empty array to clear the data
+     * or show no data.
+     */
+    Ext.applyIf(meta, {
+        idProperty: 'id',
+        successProperty: 'success',
+        totalProperty: 'total'
+    });
+
+    Ext.data.JsonReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.JsonReader, Ext.data.DataReader, {
+    /**
+     * This JsonReader's metadata as passed to the constructor, or as passed in
+     * the last data packet's <b><tt>metaData</tt></b> property.
+     * @type Mixed
+     * @property meta
+     */
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the JSON data in its responseText.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var json = response.responseText;
+        var o = Ext.decode(json);
+        if(!o) {
+            throw {message: 'JsonReader.read: Json object not found'};
+        }
+        return this.readRecords(o);
+    },
+
+    /*
+     * TODO: refactor code between JsonReader#readRecords, #readResponse into 1 method.
+     * there's ugly duplication going on due to maintaining backwards compat. with 2.0.  It's time to do this.
+     */
+    /**
+     * Decode a JSON response from server.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} response The XHR object returned through an Ajax server request.
+     * @return {Response} A {@link Ext.data.Response Response} object containing the data response, and also status information.
+     */
+    readResponse : function(action, response) {
+        var o = (response.responseText !== undefined) ? Ext.decode(response.responseText) : response;
+        if(!o) {
+            throw new Ext.data.JsonReader.Error('response');
+        }
+
+        var root = this.getRoot(o),
+            success = this.getSuccess(o);
+        if (success && action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(root);
+            if (def && Ext.isEmpty(root)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+
+        // instantiate response object
+        var res = new Ext.data.Response({
+            action: action,
+            success: success,
+            data: (root) ? this.extractData(root, false) : [],
+            message: this.getMessage(o),
+            raw: o
+        });
+
+        // blow up if no successProperty
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.JsonReader.Error('successProperty-response', this.meta.successProperty);
+        }
+        return res;
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from a JSON object.
+     * @param {Object} o An object which contains an Array of row objects in the property specified
+     * in the config as 'root, and optionally a property, specified in the config as 'totalProperty'
+     * which contains the total size of the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        /**
+         * After any data loads, the raw JSON data is available for further custom processing.  If no data is
+         * loaded or there is a load exception this property will be undefined.
+         * @type Object
+         */
+        this.jsonData = o;
+        if(o.metaData){
+            this.onMetaChange(o.metaData);
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length, v;
+
+        var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
+        if(s.totalProperty){
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)){
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        // TODO return Ext.data.Response instance instead.  @see #readResponse
+        return {
+            success : success,
+            records : this.extractData(root, true), // <-- true to return [Ext.data.Record]
+            totalRecords : totalRecords
+        };
+    },
+
+    // private
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = s.root ? this.createAccessor(s.root) : function(p){return p;};
+        if (s.id || s.idProperty) {
+            var g = this.createAccessor(s.id || s.idProperty);
+            this.getId = function(rec) {
+                var r = g(rec);
+                return (r === undefined || r === '') ? null : r;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * @ignore
+     * TODO This isn't used anywhere??  Don't we want to use this where possible instead of complex #createAccessor?
+     */
+    simpleAccess : function(obj, subsc) {
+        return obj[subsc];
+    },
+
+    /**
+     * @ignore
+     */
+    createAccessor : function(){
+        var re = /[\[\.]/;
+        return function(expr) {
+            if(Ext.isEmpty(expr)){
+                return Ext.emptyFn;
+            }
+            if(Ext.isFunction(expr)){
+                return expr;
+            }
+            var i = String(expr).search(re);
+            if(i >= 0){
+                return new Function('obj', 'return obj' + (i > 0 ? '.' : '') + expr);
+            }
+            return function(obj){
+                return obj[expr];
+            };
+
+        };
+    }(),
+
+    /**
+     * type-casts a single row of raw-data from server
+     * @param {Object} data
+     * @param {Array} items
+     * @param {Integer} len
+     * @private
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
+
+/**
+ * @class Ext.data.JsonReader.Error
+ * Error class for JsonReader
+ */
+Ext.data.JsonReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name : 'Ext.data.JsonReader'
+});
+Ext.apply(Ext.data.JsonReader.Error.prototype, {
+    lang: {
+        'response': 'An error occurred while json-decoding your server response',
+        'successProperty-response': 'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',
+        'root-undefined-config': 'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',
+        'idProperty-undefined' : 'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',
+        'root-empty': 'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/DataReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/DataReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/DataReader.js	(revision 76)
@@ -0,0 +1,229 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.DataReader
+ * Abstract base class for reading structured data from a data source and converting
+ * it into an object containing {@link Ext.data.Record} objects and metadata for use
+ * by an {@link Ext.data.Store}.  This class is intended to be extended and should not
+ * be created directly. For existing implementations, see {@link Ext.data.ArrayReader},
+ * {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}.
+ * @constructor Create a new DataReader
+ * @param {Object} meta Metadata configuration options (implementation-specific).
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created using {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.DataReader = function(meta, recordType){
+    /**
+     * This DataReader's configured metadata as passed to the constructor.
+     * @type Mixed
+     * @property meta
+     */
+    this.meta = meta;
+    /**
+     * @cfg {Array/Object} fields
+     * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+     * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+     * constructor created from {@link Ext.data.Record#create}.</p>
+     */
+    this.recordType = Ext.isArray(recordType) ?
+        Ext.data.Record.create(recordType) : recordType;
+
+    // if recordType defined make sure extraction functions are defined
+    if (this.recordType){
+        this.buildExtractors();
+    }
+};
+
+Ext.data.DataReader.prototype = {
+    /**
+     * @cfg {String} messageProperty [undefined] Optional name of a property within a server-response that represents a user-feedback message.
+     */
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getTotal: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getRoot: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getMessage: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getSuccess: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getId: Ext.emptyFn,
+    /**
+     * Abstract method, overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    buildExtractors : Ext.emptyFn,
+    /**
+     * Abstract method overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    extractValues : Ext.emptyFn,
+
+    /**
+     * Used for un-phantoming a record after a successful database insert.  Sets the records pk along with new data from server.
+     * You <b>must</b> return at least the database pk using the idProperty defined in your DataReader configuration.  The incoming
+     * data from server will be merged with the data in the local record.
+     * In addition, you <b>must</b> return record-data from the server in the same order received.
+     * Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be suppressed.
+     * @param {Record/Record[]} record The phantom record to be realized.
+     * @param {Object/Object[]} data The new record data to apply.  Must include the primary-key from database defined in idProperty field.
+     */
+    realize: function(rs, data){
+        if (Ext.isArray(rs)) {
+            for (var i = rs.length - 1; i >= 0; i--) {
+                // recurse
+                if (Ext.isArray(data)) {
+                    this.realize(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole invalid data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.realize(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (!this.isData(data)) {
+                // TODO: Let exception-handler choose to commit or not rather than blindly rs.commit() here.
+                //rs.commit();
+                throw new Ext.data.DataReader.Error('realize', rs);
+            }
+            rs.phantom = false; // <-- That's what it's all about
+            rs._phid = rs.id;  // <-- copy phantom-id -> _phid, so we can remap in Store#onCreateRecords
+            rs.id = this.getId(data);
+            rs.data = data;
+
+            rs.commit();
+            rs.store.reMap(rs);
+        }
+    },
+
+    /**
+     * Used for updating a non-phantom or "real" record's data with fresh data from server after remote-save.
+     * If returning data from multiple-records after a batch-update, you <b>must</b> return record-data from the server in
+     * the same order received.  Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be
+     * suppressed as the record receives fresh new data-hash
+     * @param {Record/Record[]} rs
+     * @param {Object/Object[]} data
+     */
+    update : function(rs, data) {
+        if (Ext.isArray(rs)) {
+            for (var i=rs.length-1; i >= 0; i--) {
+                if (Ext.isArray(data)) {
+                    this.update(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.update(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (this.isData(data)) {
+                rs.data = Ext.apply(rs.data, data);
+            }
+            rs.commit();
+        }
+    },
+
+    /**
+     * returns extracted, type-cast rows of data.  Iterates to call #extractValues for each row
+     * @param {Object[]/Object} data-root from server response
+     * @param {Boolean} returnRecords [false] Set true to return instances of Ext.data.Record
+     * @private
+     */
+    extractData : function(root, returnRecords) {
+        // A bit ugly this, too bad the Record's raw data couldn't be saved in a common property named "raw" or something.
+        var rawName = (this instanceof Ext.data.JsonReader) ? 'json' : 'node';
+
+        var rs = [];
+
+        // Had to add Check for XmlReader, #isData returns true if root is an Xml-object.  Want to check in order to re-factor
+        // #extractData into DataReader base, since the implementations are almost identical for JsonReader, XmlReader
+        if (this.isData(root) && !(this instanceof Ext.data.XmlReader)) {
+            root = [root];
+        }
+        var f       = this.recordType.prototype.fields,
+            fi      = f.items,
+            fl      = f.length,
+            rs      = [];
+        if (returnRecords === true) {
+            var Record = this.recordType;
+            for (var i = 0; i < root.length; i++) {
+                var n = root[i];
+                var record = new Record(this.extractValues(n, fi, fl), this.getId(n));
+                record[rawName] = n;    // <-- There's implementation of ugly bit, setting the raw record-data.
+                rs.push(record);
+            }
+        }
+        else {
+            for (var i = 0; i < root.length; i++) {
+                var data = this.extractValues(root[i], fi, fl);
+                data[this.meta.idProperty] = this.getId(root[i]);
+                rs.push(data);
+            }
+        }
+        return rs;
+    },
+
+    /**
+     * Returns true if the supplied data-hash <b>looks</b> and quacks like data.  Checks to see if it has a key
+     * corresponding to idProperty defined in your DataReader config containing non-empty pk.
+     * @param {Object} data
+     * @return {Boolean}
+     */
+    isData : function(data) {
+        return (data && Ext.isObject(data) && !Ext.isEmpty(this.getId(data))) ? true : false;
+    },
+
+    // private function a store will createSequence upon
+    onMetaChange : function(meta){
+        delete this.ef;
+        this.meta = meta;
+        this.recordType = Ext.data.Record.create(meta.fields);
+        this.buildExtractors();
+    }
+};
+
+/**
+ * @class Ext.data.DataReader.Error
+ * @extends Ext.Error
+ * General error class for Ext.data.DataReader
+ */
+Ext.data.DataReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataReader'
+});
+Ext.apply(Ext.data.DataReader.Error.prototype, {
+    lang : {
+        'update': "#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",
+        'realize': "#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.",
+        'invalid-response': "#readResponse received an invalid response from the server."
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Store.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Store.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Store.js	(revision 76)
@@ -0,0 +1,1981 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Store
+ * @extends Ext.util.Observable
+ * <p>The Store class encapsulates a client side cache of {@link Ext.data.Record Record}
+ * objects which provide input data for Components such as the {@link Ext.grid.GridPanel GridPanel},
+ * the {@link Ext.form.ComboBox ComboBox}, or the {@link Ext.DataView DataView}.</p>
+ * <p><u>Retrieving Data</u></p>
+ * <p>A Store object may access a data object using:<div class="mdetail-params"><ul>
+ * <li>{@link #proxy configured implementation} of {@link Ext.data.DataProxy DataProxy}</li>
+ * <li>{@link #data} to automatically pass in data</li>
+ * <li>{@link #loadData} to manually pass in data</li>
+ * </ul></div></p>
+ * <p><u>Reading Data</u></p>
+ * <p>A Store object has no inherent knowledge of the format of the data object (it could be
+ * an Array, XML, or JSON). A Store object uses an appropriate {@link #reader configured implementation}
+ * of a {@link Ext.data.DataReader DataReader} to create {@link Ext.data.Record Record} instances from the data
+ * object.</p>
+ * <p><u>Store Types</u></p>
+ * <p>There are several implementations of Store available which are customized for use with
+ * a specific DataReader implementation.  Here is an example using an ArrayStore which implicitly
+ * creates a reader commensurate to an Array data object.</p>
+ * <pre><code>
+var myStore = new Ext.data.ArrayStore({
+    fields: ['fullname', 'first'],
+    idIndex: 0 // id for each record will be the first element
+});
+ * </code></pre>
+ * <p>For custom implementations create a basic {@link Ext.data.Store} configured as needed:</p>
+ * <pre><code>
+// create a {@link Ext.data.Record Record} constructor:
+var rt = Ext.data.Record.create([
+    {name: 'fullname'},
+    {name: 'first'}
+]);
+var myStore = new Ext.data.Store({
+    // explicitly create reader
+    reader: new Ext.data.ArrayReader(
+        {
+            idIndex: 0  // id for each record will be the first element
+        },
+        rt // recordType
+    )
+});
+ * </code></pre>
+ * <p>Load some data into store (note the data object is an array which corresponds to the reader):</p>
+ * <pre><code>
+var myData = [
+    [1, 'Fred Flintstone', 'Fred'],  // note that id for the record is the first element
+    [2, 'Barney Rubble', 'Barney']
+];
+myStore.loadData(myData);
+ * </code></pre>
+ * <p>Records are cached and made available through accessor functions.  An example of adding
+ * a record to the store:</p>
+ * <pre><code>
+var defaultData = {
+    fullname: 'Full Name',
+    first: 'First Name'
+};
+var recId = 100; // provide unique id for the record
+var r = new myStore.recordType(defaultData, ++recId); // create new record
+myStore.{@link #insert}(0, r); // insert a new record into the store (also see {@link #add})
+ * </code></pre>
+ * <p><u>Writing Data</u></p>
+ * <p>And <b>new in Ext version 3</b>, use the new {@link Ext.data.DataWriter DataWriter} to create an automated, <a href="http://extjs.com/deploy/dev/examples/writer/writer.html">Writable Store</a>
+ * along with <a href="http://extjs.com/deploy/dev/examples/restful/restful.html">RESTful features.</a>
+ * @constructor
+ * Creates a new Store.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype store
+ */
+Ext.data.Store = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {String} storeId If passed, the id to use to register with the <b>{@link Ext.StoreMgr StoreMgr}</b>.
+     * <p><b>Note</b>: if a (deprecated) <tt>{@link #id}</tt> is specified it will supersede the <tt>storeId</tt>
+     * assignment.</p>
+     */
+    /**
+     * @cfg {String} url If a <tt>{@link #proxy}</tt> is not specified the <tt>url</tt> will be used to
+     * implicitly configure a {@link Ext.data.HttpProxy HttpProxy} if an <tt>url</tt> is specified.
+     * Typically this option, or the <code>{@link #data}</code> option will be specified.
+     */
+    /**
+     * @cfg {Boolean/Object} autoLoad If <tt>{@link #data}</tt> is not specified, and if <tt>autoLoad</tt>
+     * is <tt>true</tt> or an <tt>Object</tt>, this store's {@link #load} method is automatically called
+     * after creation. If the value of <tt>autoLoad</tt> is an <tt>Object</tt>, this <tt>Object</tt> will
+     * be passed to the store's {@link #load} method.
+     */
+    /**
+     * @cfg {Ext.data.DataProxy} proxy The {@link Ext.data.DataProxy DataProxy} object which provides
+     * access to a data object.  See <code>{@link #url}</code>.
+     */
+    /**
+     * @cfg {Array} data An inline data object readable by the <code>{@link #reader}</code>.
+     * Typically this option, or the <code>{@link #url}</code> option will be specified.
+     */
+    /**
+     * @cfg {Ext.data.DataReader} reader The {@link Ext.data.DataReader Reader} object which processes the
+     * data object and returns an Array of {@link Ext.data.Record} objects which are cached keyed by their
+     * <b><tt>{@link Ext.data.Record#id id}</tt></b> property.
+     */
+    /**
+     * @cfg {Ext.data.DataWriter} writer
+     * <p>The {@link Ext.data.DataWriter Writer} object which processes a record object for being written
+     * to the server-side database.</p>
+     * <br><p>When a writer is installed into a Store the {@link #add}, {@link #remove}, and {@link #update}
+     * events on the store are monitored in order to remotely {@link #createRecords create records},
+     * {@link #destroyRecord destroy records}, or {@link #updateRecord update records}.</p>
+     * <br><p>The proxy for this store will relay any {@link #writexception} events to this store.</p>
+     * <br><p>Sample implementation:
+     * <pre><code>
+var writer = new {@link Ext.data.JsonWriter}({
+    encode: true,
+    writeAllFields: true // write all fields, not just those that changed
+});
+
+// Typical Store collecting the Proxy, Reader and Writer together.
+var store = new Ext.data.Store({
+    storeId: 'user',
+    root: 'records',
+    proxy: proxy,
+    reader: reader,
+    writer: writer,     // <-- plug a DataWriter into the store just as you would a Reader
+    paramsAsHash: true,
+    autoSave: false    // <-- false to delay executing create, update, destroy requests
+                        //     until specifically told to do so.
+});
+     * </code></pre></p>
+     */
+    writer : undefined,
+    /**
+     * @cfg {Object} baseParams
+     * <p>An object containing properties which are to be sent as parameters
+     * for <i>every</i> HTTP request.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     * <p><b>Note</b>: <code>baseParams</code> may be superseded by any <code>params</code>
+     * specified in a <code>{@link #load}</code> request, see <code>{@link #load}</code>
+     * for more details.</p>
+     * This property may be modified after creation using the <code>{@link #setBaseParam}</code>
+     * method.
+     * @property
+     */
+    /**
+     * @cfg {Object} sortInfo A config object to specify the sort order in the request of a Store's
+     * {@link #load} operation.  Note that for local sorting, the <tt>direction</tt> property is
+     * case-sensitive. See also {@link #remoteSort} and {@link #paramNames}.
+     * For example:<pre><code>
+sortInfo: {
+    field: 'fieldName',
+    direction: 'ASC' // or 'DESC' (case sensitive for local sorting)
+}
+</code></pre>
+     */
+    /**
+     * @cfg {boolean} remoteSort <tt>true</tt> if sorting is to be handled by requesting the <tt>{@link #proxy Proxy}</tt>
+     * to provide a refreshed version of the data object in sorted order, as opposed to sorting the Record cache
+     * in place (defaults to <tt>false</tt>).
+     * <p>If <tt>remoteSort</tt> is <tt>true</tt>, then clicking on a {@link Ext.grid.Column Grid Column}'s
+     * {@link Ext.grid.Column#header header} causes the current page to be requested from the server appending
+     * the following two parameters to the <b><tt>{@link #load params}</tt></b>:<div class="mdetail-params"><ul>
+     * <li><b><tt>sort</tt></b> : String<p class="sub-desc">The <tt>name</tt> (as specified in the Record's
+     * {@link Ext.data.Field Field definition}) of the field to sort on.</p></li>
+     * <li><b><tt>dir</tt></b> : String<p class="sub-desc">The direction of the sort, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul></div></p>
+     */
+    remoteSort : false,
+
+    /**
+     * @cfg {Boolean} autoDestroy <tt>true</tt> to destroy the store when the component the store is bound
+     * to is destroyed (defaults to <tt>false</tt>).
+     * <p><b>Note</b>: this should be set to true when using stores that are bound to only 1 component.</p>
+     */
+    autoDestroy : false,
+
+    /**
+     * @cfg {Boolean} pruneModifiedRecords <tt>true</tt> to clear all modified record information each time
+     * the store is loaded or when a record is removed (defaults to <tt>false</tt>). See {@link #getModifiedRecords}
+     * for the accessor method to retrieve the modified records.
+     */
+    pruneModifiedRecords : false,
+
+    /**
+     * Contains the last options object used as the parameter to the {@link #load} method. See {@link #load}
+     * for the details of what this may contain. This may be useful for accessing any params which were used
+     * to load the current Record cache.
+     * @property
+     */
+    lastOptions : null,
+
+    /**
+     * @cfg {Boolean} autoSave
+     * <p>Defaults to <tt>true</tt> causing the store to automatically {@link #save} records to
+     * the server when a record is modified (ie: becomes 'dirty'). Specify <tt>false</tt> to manually call {@link #save}
+     * to send all modifiedRecords to the server.</p>
+     * <br><p><b>Note</b>: each CRUD action will be sent as a separate request.</p>
+     */
+    autoSave : true,
+
+    /**
+     * @cfg {Boolean} batch
+     * <p>Defaults to <tt>true</tt> (unless <code>{@link #restful}:true</code>). Multiple
+     * requests for each CRUD action (CREATE, READ, UPDATE and DESTROY) will be combined
+     * and sent as one transaction. Only applies when <code>{@link #autoSave}</code> is set
+     * to <tt>false</tt>.</p>
+     * <br><p>If Store is RESTful, the DataProxy is also RESTful, and a unique transaction is
+     * generated for each record.</p>
+     */
+    batch : true,
+
+    /**
+     * @cfg {Boolean} restful
+     * Defaults to <tt>false</tt>.  Set to <tt>true</tt> to have the Store and the set
+     * Proxy operate in a RESTful manner. The store will automatically generate GET, POST,
+     * PUT and DELETE requests to the server. The HTTP method used for any given CRUD
+     * action is described in {@link Ext.data.Api#restActions}.  For additional information
+     * see {@link Ext.data.DataProxy#restful}.
+     * <p><b>Note</b>: if <code>{@link #restful}:true</code> <code>batch</code> will
+     * internally be set to <tt>false</tt>.</p>
+     */
+    restful: false,
+
+    /**
+     * @cfg {Object} paramNames
+     * <p>An object containing properties which specify the names of the paging and
+     * sorting parameters passed to remote servers when loading blocks of data. By default, this
+     * object takes the following form:</p><pre><code>
+{
+    start : 'start',  // The parameter name which specifies the start row
+    limit : 'limit',  // The parameter name which specifies number of rows to return
+    sort : 'sort',    // The parameter name which specifies the column to sort on
+    dir : 'dir'       // The parameter name which specifies the sort direction
+}
+</code></pre>
+     * <p>The server must produce the requested data block upon receipt of these parameter names.
+     * If different parameter names are required, this property can be overriden using a configuration
+     * property.</p>
+     * <p>A {@link Ext.PagingToolbar PagingToolbar} bound to this Store uses this property to determine
+     * the parameter names to use in its {@link #load requests}.
+     */
+    paramNames : undefined,
+
+    /**
+     * @cfg {Object} defaultParamNames
+     * Provides the default values for the {@link #paramNames} property. To globally modify the parameters
+     * for all stores, this object should be changed on the store prototype.
+     */
+    defaultParamNames : {
+        start : 'start',
+        limit : 'limit',
+        sort : 'sort',
+        dir : 'dir'
+    },
+
+    isDestroyed: false,    
+    hasMultiSort: false,
+
+    // private
+    batchKey : '_ext_batch_',
+
+    constructor : function(config){
+        /**
+         * @property multiSort
+         * @type Boolean
+         * True if this store is currently sorted by more than one field/direction combination.
+         */
+        
+        /**
+         * @property isDestroyed
+         * @type Boolean
+         * True if the store has been destroyed already. Read only
+         */
+        
+        this.data = new Ext.util.MixedCollection(false);
+        this.data.getKey = function(o){
+            return o.id;
+        };
+        
+
+        // temporary removed-records cache
+        this.removed = [];
+
+        if(config && config.data){
+            this.inlineData = config.data;
+            delete config.data;
+        }
+
+        Ext.apply(this, config);
+
+        /**
+         * See the <code>{@link #baseParams corresponding configuration option}</code>
+         * for a description of this property.
+         * To modify this property see <code>{@link #setBaseParam}</code>.
+         * @property
+         */
+        this.baseParams = Ext.isObject(this.baseParams) ? this.baseParams : {};
+
+        this.paramNames = Ext.applyIf(this.paramNames || {}, this.defaultParamNames);
+
+        if((this.url || this.api) && !this.proxy){
+            this.proxy = new Ext.data.HttpProxy({url: this.url, api: this.api});
+        }
+        // If Store is RESTful, so too is the DataProxy
+        if (this.restful === true && this.proxy) {
+            // When operating RESTfully, a unique transaction is generated for each record.
+            // TODO might want to allow implemention of faux REST where batch is possible using RESTful routes only.
+            this.batch = false;
+            Ext.data.Api.restify(this.proxy);
+        }
+
+        if(this.reader){ // reader passed
+            if(!this.recordType){
+                this.recordType = this.reader.recordType;
+            }
+            if(this.reader.onMetaChange){
+                this.reader.onMetaChange = this.reader.onMetaChange.createSequence(this.onMetaChange, this);
+            }
+            if (this.writer) { // writer passed
+                if (this.writer instanceof(Ext.data.DataWriter) === false) {    // <-- config-object instead of instance.
+                    this.writer = this.buildWriter(this.writer);
+                }
+                this.writer.meta = this.reader.meta;
+                this.pruneModifiedRecords = true;
+            }
+        }
+
+        /**
+         * The {@link Ext.data.Record Record} constructor as supplied to (or created by) the
+         * {@link Ext.data.DataReader Reader}. Read-only.
+         * <p>If the Reader was constructed by passing in an Array of {@link Ext.data.Field} definition objects,
+         * instead of a Record constructor, it will implicitly create a Record constructor from that Array (see
+         * {@link Ext.data.Record}.{@link Ext.data.Record#create create} for additional details).</p>
+         * <p>This property may be used to create new Records of the type held in this Store, for example:</p><pre><code>
+    // create the data store
+    var store = new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: [
+           {name: 'company'},
+           {name: 'price', type: 'float'},
+           {name: 'change', type: 'float'},
+           {name: 'pctChange', type: 'float'},
+           {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+        ]
+    });
+    store.loadData(myData);
+
+    // create the Grid
+    var grid = new Ext.grid.EditorGridPanel({
+        store: store,
+        colModel: new Ext.grid.ColumnModel({
+            columns: [
+                {id:'company', header: 'Company', width: 160, dataIndex: 'company'},
+                {header: 'Price', renderer: 'usMoney', dataIndex: 'price'},
+                {header: 'Change', renderer: change, dataIndex: 'change'},
+                {header: '% Change', renderer: pctChange, dataIndex: 'pctChange'},
+                {header: 'Last Updated', width: 85,
+                    renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+                    dataIndex: 'lastChange'}
+            ],
+            defaults: {
+                sortable: true,
+                width: 75
+            }
+        }),
+        autoExpandColumn: 'company', // match the id specified in the column model
+        height:350,
+        width:600,
+        title:'Array Grid',
+        tbar: [{
+            text: 'Add Record',
+            handler : function(){
+                var defaultData = {
+                    change: 0,
+                    company: 'New Company',
+                    lastChange: (new Date()).clearTime(),
+                    pctChange: 0,
+                    price: 10
+                };
+                var recId = 3; // provide unique id
+                var p = new store.recordType(defaultData, recId); // create new record
+                grid.stopEditing();
+                store.{@link #insert}(0, p); // insert a new record into the store (also see {@link #add})
+                grid.startEditing(0, 0);
+            }
+        }]
+    });
+         * </code></pre>
+         * @property recordType
+         * @type Function
+         */
+
+        if(this.recordType){
+            /**
+             * A {@link Ext.util.MixedCollection MixedCollection} containing the defined {@link Ext.data.Field Field}s
+             * for the {@link Ext.data.Record Records} stored in this Store. Read-only.
+             * @property fields
+             * @type Ext.util.MixedCollection
+             */
+            this.fields = this.recordType.prototype.fields;
+        }
+        this.modified = [];
+
+        this.addEvents(
+            /**
+             * @event datachanged
+             * Fires when the data cache has changed in a bulk manner (e.g., it has been sorted, filtered, etc.) and a
+             * widget that is using this Store as a Record cache should refresh its view.
+             * @param {Store} this
+             */
+            'datachanged',
+            /**
+             * @event metachange
+             * Fires when this store's reader provides new metadata (fields). This is currently only supported for JsonReaders.
+             * @param {Store} this
+             * @param {Object} meta The JSON metadata
+             */
+            'metachange',
+            /**
+             * @event add
+             * Fires when Records have been {@link #add}ed to the Store
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The array of Records added
+             * @param {Number} index The index at which the record(s) were added
+             */
+            'add',
+            /**
+             * @event remove
+             * Fires when a Record has been {@link #remove}d from the Store
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was removed
+             * @param {Number} index The index at which the record was removed
+             */
+            'remove',
+            /**
+             * @event update
+             * Fires when a Record has been updated
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was updated
+             * @param {String} operation The update operation being performed.  Value may be one of:
+             * <pre><code>
+     Ext.data.Record.EDIT
+     Ext.data.Record.REJECT
+     Ext.data.Record.COMMIT
+             * </code></pre>
+             */
+            'update',
+            /**
+             * @event clear
+             * Fires when the data cache has been cleared.
+             * @param {Store} this
+             * @param {Record[]} records The records that were cleared.
+             */
+            'clear',
+            /**
+             * @event exception
+             * <p>Fires if an exception occurs in the Proxy during a remote request.
+             * This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for description.
+             */
+            'exception',
+            /**
+             * @event beforeload
+             * Fires before a request is made for a new data object.  If the beforeload handler returns
+             * <tt>false</tt> the {@link #load} action will be canceled.
+             * @param {Store} this
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'beforeload',
+            /**
+             * @event load
+             * Fires after a new set of Records has been loaded.
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The Records that were loaded
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'load',
+            /**
+             * @event loadexception
+             * <p>This event is <b>deprecated</b> in favor of the catch-all <b><code>{@link #exception}</code></b>
+             * event instead.</p>
+             * <p>This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for description.
+             */
+            'loadexception',
+            /**
+             * @event beforewrite
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Record/Record[]} rs The Record(s) being written.
+             * @param {Object} options The loading options that were specified. Edit <code>options.params</code> to add Http parameters to the request.  (see {@link #save} for details)
+             * @param {Object} arg The callback's arg object passed to the {@link #request} function
+             */
+            'beforewrite',
+            /**
+             * @event write
+             * Fires if the server returns 200 after an Ext.data.Api.actions CRUD action.
+             * Success of the action is determined in the <code>result['successProperty']</code>property (<b>NOTE</b> for RESTful stores,
+             * a simple 20x response is sufficient for the actions "destroy" and "update".  The "create" action should should return 200 along with a database pk).
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Object} result The 'data' picked-out out of the response for convenience.
+             * @param {Ext.Direct.Transaction} res
+             * @param {Record/Record[]} rs Store's records, the subject(s) of the write-action
+             */
+            'write',
+            /**
+             * @event beforesave
+             * Fires before a save action is called. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'beforesave',
+            /**
+             * @event save
+             * Fires after a save is completed. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Number} batch The identifier for the batch that was saved.
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'save'
+
+        );
+
+        if(this.proxy){
+            // TODO remove deprecated loadexception with ext-3.0.1
+            this.relayEvents(this.proxy,  ['loadexception', 'exception']);
+        }
+        // With a writer set for the Store, we want to listen to add/remove events to remotely create/destroy records.
+        if (this.writer) {
+            this.on({
+                scope: this,
+                add: this.createRecords,
+                remove: this.destroyRecord,
+                update: this.updateRecord,
+                clear: this.onClear
+            });
+        }
+
+        this.sortToggle = {};
+        if(this.sortField){
+            this.setDefaultSort(this.sortField, this.sortDir);
+        }else if(this.sortInfo){
+            this.setDefaultSort(this.sortInfo.field, this.sortInfo.direction);
+        }
+
+        Ext.data.Store.superclass.constructor.call(this);
+
+        if(this.id){
+            this.storeId = this.id;
+            delete this.id;
+        }
+        if(this.storeId){
+            Ext.StoreMgr.register(this);
+        }
+        if(this.inlineData){
+            this.loadData(this.inlineData);
+            delete this.inlineData;
+        }else if(this.autoLoad){
+            this.load.defer(10, this, [
+                typeof this.autoLoad == 'object' ?
+                    this.autoLoad : undefined]);
+        }
+        // used internally to uniquely identify a batch
+        this.batchCounter = 0;
+        this.batches = {};
+    },
+
+    /**
+     * builds a DataWriter instance when Store constructor is provided with a writer config-object instead of an instace.
+     * @param {Object} config Writer configuration
+     * @return {Ext.data.DataWriter}
+     * @private
+     */
+    buildWriter : function(config) {
+        var klass = undefined,
+            type = (config.format || 'json').toLowerCase();
+        switch (type) {
+            case 'json':
+                klass = Ext.data.JsonWriter;
+                break;
+            case 'xml':
+                klass = Ext.data.XmlWriter;
+                break;
+            default:
+                klass = Ext.data.JsonWriter;
+        }
+        return new klass(config);
+    },
+
+    /**
+     * Destroys the store.
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.storeId){
+                Ext.StoreMgr.unregister(this);
+            }
+            this.clearData();
+            this.data = null;
+            Ext.destroy(this.proxy);
+            this.reader = this.writer = null;
+            this.purgeListeners();
+            this.isDestroyed = true;
+        }
+    },
+
+    /**
+     * Add Records to the Store and fires the {@link #add} event.  To add Records
+     * to the store from a remote source use <code>{@link #load}({add:true})</code>.
+     * See also <code>{@link #recordType}</code> and <code>{@link #insert}</code>.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects
+     * to add to the cache. See {@link #recordType}.
+     */
+    add : function(records) {
+        var i, len, record, index;
+        
+        records = [].concat(records);
+        if (records.length < 1) {
+            return;
+        }
+        
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        index = this.data.length;
+        this.data.addAll(records);
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * (Local sort only) Inserts the passed Record into the Store at the index where it
+     * should go based on the current sort information.
+     * @param {Ext.data.Record} record
+     */
+    addSorted : function(record){
+        var index = this.findInsertIndex(record);
+        this.insert(index, record);
+    },
+    
+    /**
+     * @private
+     * Update a record within the store with a new reference
+     */
+    doUpdate: function(rec){
+        var id = rec.id;
+        // unjoin the old record
+        this.getById(id).join(null);
+        
+        this.data.replace(id, rec);
+        if (this.snapshot) {
+            this.snapshot.replace(id, rec);
+        }
+        rec.join(this);
+        this.fireEvent('update', this, rec, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Remove Records from the Store and fires the {@link #remove} event.
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record object or array of records to remove from the cache.
+     */
+    remove : function(record){
+        if(Ext.isArray(record)){
+            Ext.each(record, function(r){
+                this.remove(r);
+            }, this);
+            return;
+        }
+        var index = this.data.indexOf(record);
+        if(index > -1){
+            record.join(null);
+            this.data.removeAt(index);
+        }
+        if(this.pruneModifiedRecords){
+            this.modified.remove(record);
+        }
+        if(this.snapshot){
+            this.snapshot.remove(record);
+        }
+        if(index > -1){
+            this.fireEvent('remove', this, record, index);
+        }
+    },
+
+    /**
+     * Remove a Record from the Store at the specified index. Fires the {@link #remove} event.
+     * @param {Number} index The index of the record to remove.
+     */
+    removeAt : function(index){
+        this.remove(this.getAt(index));
+    },
+
+    /**
+     * Remove all Records from the Store and fires the {@link #clear} event.
+     * @param {Boolean} silent [false] Defaults to <tt>false</tt>.  Set <tt>true</tt> to not fire clear event.
+     */
+    removeAll : function(silent){
+        var items = [];
+        this.each(function(rec){
+            items.push(rec);
+        });
+        this.clearData();
+        if(this.snapshot){
+            this.snapshot.clear();
+        }
+        if(this.pruneModifiedRecords){
+            this.modified = [];
+        }
+        if (silent !== true) {  // <-- prevents write-actions when we just want to clear a store.
+            this.fireEvent('clear', this, items);
+        }
+    },
+
+    // private
+    onClear: function(store, records){
+        Ext.each(records, function(rec, index){
+            this.destroyRecord(this, rec, index);
+        }, this);
+    },
+
+    /**
+     * Inserts Records into the Store at the given index and fires the {@link #add} event.
+     * See also <code>{@link #add}</code> and <code>{@link #addSorted}</code>.
+     * @param {Number} index The start index at which to insert the passed Records.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects to add to the cache.
+     */
+    insert : function(index, records) {
+        var i, len, record;
+        
+        records = [].concat(records);
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            this.data.insert(index + i, record);
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * Get the index within the cache of the passed Record.
+     * @param {Ext.data.Record} record The Ext.data.Record object to find.
+     * @return {Number} The index of the passed Record. Returns -1 if not found.
+     */
+    indexOf : function(record){
+        return this.data.indexOf(record);
+    },
+
+    /**
+     * Get the index within the cache of the Record with the passed id.
+     * @param {String} id The id of the Record to find.
+     * @return {Number} The index of the Record. Returns -1 if not found.
+     */
+    indexOfId : function(id){
+        return this.data.indexOfKey(id);
+    },
+
+    /**
+     * Get the Record with the specified id.
+     * @param {String} id The id of the Record to find.
+     * @return {Ext.data.Record} The Record with the passed id. Returns undefined if not found.
+     */
+    getById : function(id){
+        return (this.snapshot || this.data).key(id);
+    },
+
+    /**
+     * Get the Record at the specified index.
+     * @param {Number} index The index of the Record to find.
+     * @return {Ext.data.Record} The Record at the passed index. Returns undefined if not found.
+     */
+    getAt : function(index){
+        return this.data.itemAt(index);
+    },
+
+    /**
+     * Returns a range of Records between specified indices.
+     * @param {Number} startIndex (optional) The starting index (defaults to 0)
+     * @param {Number} endIndex (optional) The ending index (defaults to the last Record in the Store)
+     * @return {Ext.data.Record[]} An array of Records
+     */
+    getRange : function(start, end){
+        return this.data.getRange(start, end);
+    },
+
+    // private
+    storeOptions : function(o){
+        o = Ext.apply({}, o);
+        delete o.callback;
+        delete o.scope;
+        this.lastOptions = o;
+    },
+
+    // private
+    clearData: function(){
+        this.data.each(function(rec) {
+            rec.join(null);
+        });
+        this.data.clear();
+    },
+
+    /**
+     * <p>Loads the Record cache from the configured <tt>{@link #proxy}</tt> using the configured <tt>{@link #reader}</tt>.</p>
+     * <br><p>Notes:</p><div class="mdetail-params"><ul>
+     * <li><b><u>Important</u></b>: loading is asynchronous! This call will return before the new data has been
+     * loaded. To perform any post-processing where information from the load call is required, specify
+     * the <tt>callback</tt> function to be called, or use a {@link Ext.util.Observable#listeners a 'load' event handler}.</li>
+     * <li>If using {@link Ext.PagingToolbar remote paging}, the first load call must specify the <tt>start</tt> and <tt>limit</tt>
+     * properties in the <code>options.params</code> property to establish the initial position within the
+     * dataset, and the number of Records to cache on each read from the Proxy.</li>
+     * <li>If using {@link #remoteSort remote sorting}, the configured <code>{@link #sortInfo}</code>
+     * will be automatically included with the posted parameters according to the specified
+     * <code>{@link #paramNames}</code>.</li>
+     * </ul></div>
+     * @param {Object} options An object containing properties which control loading options:<ul>
+     * <li><b><tt>params</tt></b> :Object<div class="sub-desc"><p>An object containing properties to pass as HTTP
+     * parameters to a remote data source. <b>Note</b>: <code>params</code> will override any
+     * <code>{@link #baseParams}</code> of the same name.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     * <li><b>callback</b> : Function<div class="sub-desc"><p>A function to be called after the Records
+     * have been loaded. The callback is called after the load event is fired, and is passed the following arguments:<ul>
+     * <li>r : Ext.data.Record[] An Array of Records loaded.</li>
+     * <li>options : Options object from the load call.</li>
+     * <li>success : Boolean success indicator.</li></ul></p></div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc"><p>Scope with which to call the callback (defaults
+     * to the Store object)</p></div></li>
+     * <li><b>add</b> : Boolean<div class="sub-desc"><p>Indicator to append loaded records rather than
+     * replace the current cache.  <b>Note</b>: see note for <tt>{@link #loadData}</tt></p></div></li>
+     * </ul>
+     * @return {Boolean} If the <i>developer</i> provided <tt>{@link #beforeload}</tt> event handler returns
+     * <tt>false</tt>, the load call will abort and will return <tt>false</tt>; otherwise will return <tt>true</tt>.
+     */
+    load : function(options) {
+        options = Ext.apply({}, options);
+        this.storeOptions(options);
+        if(this.sortInfo && this.remoteSort){
+            var pn = this.paramNames;
+            options.params = Ext.apply({}, options.params);
+            options.params[pn.sort] = this.sortInfo.field;
+            options.params[pn.dir] = this.sortInfo.direction;
+        }
+        try {
+            return this.execute('read', null, options); // <-- null represents rs.  No rs for load actions.
+        } catch(e) {
+            this.handleException(e);
+            return false;
+        }
+    },
+
+    /**
+     * updateRecord  Should not be used directly.  This method will be called automatically if a Writer is set.
+     * Listens to 'update' event.
+     * @param {Object} store
+     * @param {Object} record
+     * @param {Object} action
+     * @private
+     */
+    updateRecord : function(store, record, action) {
+        if (action == Ext.data.Record.EDIT && this.autoSave === true && (!record.phantom || (record.phantom && record.isValid()))) {
+            this.save();
+        }
+    },
+
+    /**
+     * @private
+     * Should not be used directly.  Store#add will call this automatically if a Writer is set
+     * @param {Object} store
+     * @param {Object} records
+     * @param {Object} index
+     */
+    createRecords : function(store, records, index) {
+        var modified = this.modified,
+            length   = records.length,
+            record, i;
+        
+        for (i = 0; i < length; i++) {
+            record = records[i];
+            
+            if (record.phantom && record.isValid()) {
+                record.markDirty();  // <-- Mark new records dirty (Ed: why?)
+                
+                if (modified.indexOf(record) == -1) {
+                    modified.push(record);
+                }
+            }
+        }
+        if (this.autoSave === true) {
+            this.save();
+        }
+    },
+
+    /**
+     * Destroys a Record.  Should not be used directly.  It's called by Store#remove if a Writer is set.
+     * @param {Store} store this
+     * @param {Ext.data.Record} record
+     * @param {Number} index
+     * @private
+     */
+    destroyRecord : function(store, record, index) {
+        if (this.modified.indexOf(record) != -1) {  // <-- handled already if @cfg pruneModifiedRecords == true
+            this.modified.remove(record);
+        }
+        if (!record.phantom) {
+            this.removed.push(record);
+
+            // since the record has already been removed from the store but the server request has not yet been executed,
+            // must keep track of the last known index this record existed.  If a server error occurs, the record can be
+            // put back into the store.  @see Store#createCallback where the record is returned when response status === false
+            record.lastIndex = index;
+
+            if (this.autoSave === true) {
+                this.save();
+            }
+        }
+    },
+
+    /**
+     * This method should generally not be used directly.  This method is called internally
+     * by {@link #load}, or if a Writer is set will be called automatically when {@link #add},
+     * {@link #remove}, or {@link #update} events fire.
+     * @param {String} action Action name ('read', 'create', 'update', or 'destroy')
+     * @param {Record/Record[]} rs
+     * @param {Object} options
+     * @throws Error
+     * @private
+     */
+    execute : function(action, rs, options, /* private */ batch) {
+        // blow up if action not Ext.data.CREATE, READ, UPDATE, DESTROY
+        if (!Ext.data.Api.isAction(action)) {
+            throw new Ext.data.Api.Error('execute', action);
+        }
+        // make sure options has a fresh, new params hash
+        options = Ext.applyIf(options||{}, {
+            params: {}
+        });
+        if(batch !== undefined){
+            this.addToBatch(batch);
+        }
+        // have to separate before-events since load has a different signature than create,destroy and save events since load does not
+        // include the rs (record resultset) parameter.  Capture return values from the beforeaction into doRequest flag.
+        var doRequest = true;
+
+        if (action === 'read') {
+            doRequest = this.fireEvent('beforeload', this, options);
+            Ext.applyIf(options.params, this.baseParams);
+        }
+        else {
+            // if Writer is configured as listful, force single-record rs to be [{}] instead of {}
+            // TODO Move listful rendering into DataWriter where the @cfg is defined.  Should be easy now.
+            if (this.writer.listful === true && this.restful !== true) {
+                rs = (Ext.isArray(rs)) ? rs : [rs];
+            }
+            // if rs has just a single record, shift it off so that Writer writes data as '{}' rather than '[{}]'
+            else if (Ext.isArray(rs) && rs.length == 1) {
+                rs = rs.shift();
+            }
+            // Write the action to options.params
+            if ((doRequest = this.fireEvent('beforewrite', this, action, rs, options)) !== false) {
+                this.writer.apply(options.params, this.baseParams, action, rs);
+            }
+        }
+        if (doRequest !== false) {
+            // Send request to proxy.
+            if (this.writer && this.proxy.url && !this.proxy.restful && !Ext.data.Api.hasUniqueUrl(this.proxy, action)) {
+                options.params.xaction = action;    // <-- really old, probaby unecessary.
+            }
+            // Note:  Up until this point we've been dealing with 'action' as a key from Ext.data.Api.actions.
+            // We'll flip it now and send the value into DataProxy#request, since it's the value which maps to
+            // the user's configured DataProxy#api
+            // TODO Refactor all Proxies to accept an instance of Ext.data.Request (not yet defined) instead of this looooooong list
+            // of params.  This method is an artifact from Ext2.
+            this.proxy.request(Ext.data.Api.actions[action], rs, options.params, this.reader, this.createCallback(action, rs, batch), this, options);
+        }
+        return doRequest;
+    },
+
+    /**
+     * Saves all pending changes to the store.  If the commensurate Ext.data.Api.actions action is not configured, then
+     * the configured <code>{@link #url}</code> will be used.
+     * <pre>
+     * change            url
+     * ---------------   --------------------
+     * removed records   Ext.data.Api.actions.destroy
+     * phantom records   Ext.data.Api.actions.create
+     * {@link #getModifiedRecords modified records}  Ext.data.Api.actions.update
+     * </pre>
+     * @TODO:  Create extensions of Error class and send associated Record with thrown exceptions.
+     * e.g.:  Ext.data.DataReader.Error or Ext.data.Error or Ext.data.DataProxy.Error, etc.
+     * @return {Number} batch Returns a number to uniquely identify the "batch" of saves occurring. -1 will be returned
+     * if there are no items to save or the save was cancelled.
+     */
+    save : function() {
+        if (!this.writer) {
+            throw new Ext.data.Store.Error('writer-undefined');
+        }
+
+        var queue = [],
+            len,
+            trans,
+            batch,
+            data = {},
+            i;
+        // DESTROY:  First check for removed records.  Records in this.removed are guaranteed non-phantoms.  @see Store#remove
+        if(this.removed.length){
+            queue.push(['destroy', this.removed]);
+        }
+
+        // Check for modified records. Use a copy so Store#rejectChanges will work if server returns error.
+        var rs = [].concat(this.getModifiedRecords());
+        if(rs.length){
+            // CREATE:  Next check for phantoms within rs.  splice-off and execute create.
+            var phantoms = [];
+            for(i = rs.length-1; i >= 0; i--){
+                if(rs[i].phantom === true){
+                    var rec = rs.splice(i, 1).shift();
+                    if(rec.isValid()){
+                        phantoms.push(rec);
+                    }
+                }else if(!rs[i].isValid()){ // <-- while we're here, splice-off any !isValid real records
+                    rs.splice(i,1);
+                }
+            }
+            // If we have valid phantoms, create them...
+            if(phantoms.length){
+                queue.push(['create', phantoms]);
+            }
+
+            // UPDATE:  And finally, if we're still here after splicing-off phantoms and !isValid real records, update the rest...
+            if(rs.length){
+                queue.push(['update', rs]);
+            }
+        }
+        len = queue.length;
+        if(len){
+            batch = ++this.batchCounter;
+            for(i = 0; i < len; ++i){
+                trans = queue[i];
+                data[trans[0]] = trans[1];
+            }
+            if(this.fireEvent('beforesave', this, data) !== false){
+                for(i = 0; i < len; ++i){
+                    trans = queue[i];
+                    this.doTransaction(trans[0], trans[1], batch);
+                }
+                return batch;
+            }
+        }
+        return -1;
+    },
+
+    // private.  Simply wraps call to Store#execute in try/catch.  Defers to Store#handleException on error.  Loops if batch: false
+    doTransaction : function(action, rs, batch) {
+        function transaction(records) {
+            try{
+                this.execute(action, records, undefined, batch);
+            }catch (e){
+                this.handleException(e);
+            }
+        }
+        if(this.batch === false){
+            for(var i = 0, len = rs.length; i < len; i++){
+                transaction.call(this, rs[i]);
+            }
+        }else{
+            transaction.call(this, rs);
+        }
+    },
+
+    // private
+    addToBatch : function(batch){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key];
+
+        if(!o){
+            b[key] = o = {
+                id: batch,
+                count: 0,
+                data: {}
+            };
+        }
+        ++o.count;
+    },
+
+    removeFromBatch : function(batch, action, data){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key],
+            arr;
+
+
+        if(o){
+            arr = o.data[action] || [];
+            o.data[action] = arr.concat(data);
+            if(o.count === 1){
+                data = o.data;
+                delete b[key];
+                this.fireEvent('save', this, batch, data);
+            }else{
+                --o.count;
+            }
+        }
+    },
+
+    // @private callback-handler for remote CRUD actions
+    // Do not override -- override loadRecords, onCreateRecords, onDestroyRecords and onUpdateRecords instead.
+    createCallback : function(action, rs, batch) {
+        var actions = Ext.data.Api.actions;
+        return (action == 'read') ? this.loadRecords : function(data, response, success) {
+            // calls: onCreateRecords | onUpdateRecords | onDestroyRecords
+            this['on' + Ext.util.Format.capitalize(action) + 'Records'](success, rs, [].concat(data));
+            // If success === false here, exception will have been called in DataProxy
+            if (success === true) {
+                this.fireEvent('write', this, action, data, response, rs);
+            }
+            this.removeFromBatch(batch, action, data);
+        };
+    },
+
+    // Clears records from modified array after an exception event.
+    // NOTE:  records are left marked dirty.  Do we want to commit them even though they were not updated/realized?
+    // TODO remove this method?
+    clearModified : function(rs) {
+        if (Ext.isArray(rs)) {
+            for (var n=rs.length-1;n>=0;n--) {
+                this.modified.splice(this.modified.indexOf(rs[n]), 1);
+            }
+        } else {
+            this.modified.splice(this.modified.indexOf(rs), 1);
+        }
+    },
+
+    // remap record ids in MixedCollection after records have been realized.  @see Store#onCreateRecords, @see DataReader#realize
+    reMap : function(record) {
+        if (Ext.isArray(record)) {
+            for (var i = 0, len = record.length; i < len; i++) {
+                this.reMap(record[i]);
+            }
+        } else {
+            delete this.data.map[record._phid];
+            this.data.map[record.id] = record;
+            var index = this.data.keys.indexOf(record._phid);
+            this.data.keys.splice(index, 1, record.id);
+            delete record._phid;
+        }
+    },
+
+    // @protected onCreateRecord proxy callback for create action
+    onCreateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.realize(rs, data);
+            }
+            catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#realize splices-off the rs until empty.
+                    this.onCreateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected, onUpdateRecords proxy callback for update action
+    onUpdateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.update(rs, data);
+            } catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#update splices-off the rs until empty.
+                    this.onUpdateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected onDestroyRecords proxy callback for destroy action
+    onDestroyRecords : function(success, rs, data) {
+        // splice each rec out of this.removed
+        rs = (rs instanceof Ext.data.Record) ? [rs] : [].concat(rs);
+        for (var i=0,len=rs.length;i<len;i++) {
+            this.removed.splice(this.removed.indexOf(rs[i]), 1);
+        }
+        if (success === false) {
+            // put records back into store if remote destroy fails.
+            // @TODO: Might want to let developer decide.
+            for (i=rs.length-1;i>=0;i--) {
+                this.insert(rs[i].lastIndex, rs[i]);    // <-- lastIndex set in Store#destroyRecord
+            }
+        }
+    },
+
+    // protected handleException.  Possibly temporary until Ext framework has an exception-handler.
+    handleException : function(e) {
+        // @see core/Error.js
+        Ext.handleError(e);
+    },
+
+    /**
+     * <p>Reloads the Record cache from the configured Proxy using the configured
+     * {@link Ext.data.Reader Reader} and the options from the last load operation
+     * performed.</p>
+     * <p><b>Note</b>: see the Important note in {@link #load}.</p>
+     * @param {Object} options <p>(optional) An <tt>Object</tt> containing
+     * {@link #load loading options} which may override the {@link #lastOptions options}
+     * used in the last {@link #load} operation. See {@link #load} for details
+     * (defaults to <tt>null</tt>, in which case the {@link #lastOptions} are
+     * used).</p>
+     * <br><p>To add new params to the existing params:</p><pre><code>
+lastOptions = myStore.lastOptions;
+Ext.apply(lastOptions.params, {
+    myNewParam: true
+});
+myStore.reload(lastOptions);
+     * </code></pre>
+     */
+    reload : function(options){
+        this.load(Ext.applyIf(options||{}, this.lastOptions));
+    },
+
+    // private
+    // Called as a callback by the Reader during a load operation.
+    loadRecords : function(o, options, success){
+        var i, len;
+        
+        if (this.isDestroyed === true) {
+            return;
+        }
+        if(!o || success === false){
+            if(success !== false){
+                this.fireEvent('load', this, [], options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope || this, [], options, false, o);
+            }
+            return;
+        }
+        var r = o.records, t = o.totalRecords || r.length;
+        if(!options || options.add !== true){
+            if(this.pruneModifiedRecords){
+                this.modified = [];
+            }
+            for(i = 0, len = r.length; i < len; i++){
+                r[i].join(this);
+            }
+            if(this.snapshot){
+                this.data = this.snapshot;
+                delete this.snapshot;
+            }
+            this.clearData();
+            this.data.addAll(r);
+            this.totalLength = t;
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }else{
+            var toAdd = [],
+                rec,
+                cnt = 0;
+            for(i = 0, len = r.length; i < len; ++i){
+                rec = r[i];
+                if(this.indexOfId(rec.id) > -1){
+                    this.doUpdate(rec);
+                }else{
+                    toAdd.push(rec);
+                    ++cnt;
+                }
+            }
+            this.totalLength = Math.max(t, this.data.length + cnt);
+            this.add(toAdd);
+        }
+        this.fireEvent('load', this, r, options);
+        if(options.callback){
+            options.callback.call(options.scope || this, r, options, true);
+        }
+    },
+
+    /**
+     * Loads data from a passed data block and fires the {@link #load} event. A {@link Ext.data.Reader Reader}
+     * which understands the format of the data must have been configured in the constructor.
+     * @param {Object} data The data block from which to read the Records.  The format of the data expected
+     * is dependent on the type of {@link Ext.data.Reader Reader} that is configured and should correspond to
+     * that {@link Ext.data.Reader Reader}'s <tt>{@link Ext.data.Reader#readRecords}</tt> parameter.
+     * @param {Boolean} append (Optional) <tt>true</tt> to append the new Records rather the default to replace
+     * the existing cache.
+     * <b>Note</b>: that Records in a Store are keyed by their {@link Ext.data.Record#id id}, so added Records
+     * with ids which are already present in the Store will <i>replace</i> existing Records. Only Records with
+     * new, unique ids will be added.
+     */
+    loadData : function(o, append){
+        var r = this.reader.readRecords(o);
+        this.loadRecords(r, {add: append}, true);
+    },
+
+    /**
+     * Gets the number of cached records.
+     * <p>If using paging, this may not be the total size of the dataset. If the data object
+     * used by the Reader contains the dataset size, then the {@link #getTotalCount} function returns
+     * the dataset size.  <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records in the Store's cache.
+     */
+    getCount : function(){
+        return this.data.length || 0;
+    },
+
+    /**
+     * Gets the total number of records in the dataset as returned by the server.
+     * <p>If using paging, for this to be accurate, the data object used by the {@link #reader Reader}
+     * must contain the dataset size. For remote data sources, the value for this property
+     * (<tt>totalProperty</tt> for {@link Ext.data.JsonReader JsonReader},
+     * <tt>totalRecords</tt> for {@link Ext.data.XmlReader XmlReader}) shall be returned by a query on the server.
+     * <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records as specified in the data object passed to the Reader
+     * by the Proxy.
+     * <p><b>Note</b>: this value is not updated when changing the contents of the Store locally.</p>
+     */
+    getTotalCount : function(){
+        return this.totalLength || 0;
+    },
+
+    /**
+     * Returns an object describing the current sort state of this Store.
+     * @return {Object} The sort state of the Store. An object with two properties:<ul>
+     * <li><b>field : String<p class="sub-desc">The name of the field by which the Records are sorted.</p></li>
+     * <li><b>direction : String<p class="sub-desc">The sort order, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul>
+     * See <tt>{@link #sortInfo}</tt> for additional details.
+     */
+    getSortState : function(){
+        return this.sortInfo;
+    },
+
+    /**
+     * @private
+     * Invokes sortData if we have sortInfo to sort on and are not sorting remotely
+     */
+    applySort : function(){
+        if ((this.sortInfo || this.multiSortInfo) && !this.remoteSort) {
+            this.sortData();
+        }
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting of data. This checks to see if we currently have a multi sort or not. It applies
+     * each sorter field/direction pair in turn by building an OR'ed master sorting function and running it against
+     * the full dataset
+     */
+    sortData : function() {
+        var sortInfo  = this.hasMultiSort ? this.multiSortInfo : this.sortInfo,
+            direction = sortInfo.direction || "ASC",
+            sorters   = sortInfo.sorters,
+            sortFns   = [];
+
+        //if we just have a single sorter, pretend it's the first in an array
+        if (!this.hasMultiSort) {
+            sorters = [{direction: direction, field: sortInfo.field}];
+        }
+
+        //create a sorter function for each sorter field/direction combo
+        for (var i=0, j = sorters.length; i < j; i++) {
+            sortFns.push(this.createSortFunction(sorters[i].field, sorters[i].direction));
+        }
+        
+        if (sortFns.length == 0) {
+            return;
+        }
+
+        //the direction modifier is multiplied with the result of the sorting functions to provide overall sort direction
+        //(as opposed to direction per field)
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        //create a function which ORs each sorter together to enable multi-sort
+        var fn = function(r1, r2) {
+          var result = sortFns[0].call(this, r1, r2);
+
+          //if we have more than one sorter, OR any additional sorter functions together
+          if (sortFns.length > 1) {
+              for (var i=1, j = sortFns.length; i < j; i++) {
+                  result = result || sortFns[i].call(this, r1, r2);
+              }
+          }
+
+          return directionModifier * result;
+        };
+
+        //sort the data
+        this.data.sort(direction, fn);
+        if (this.snapshot && this.snapshot != this.data) {
+            this.snapshot.sort(direction, fn);
+        }
+    },
+
+    /**
+     * @private
+     * Creates and returns a function which sorts an array by the given field and direction
+     * @param {String} field The field to create the sorter for
+     * @param {String} direction The direction to sort by (defaults to "ASC")
+     * @return {Function} A function which sorts by the field/direction combination provided
+     */
+    createSortFunction: function(field, direction) {
+        direction = direction || "ASC";
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        var sortType = this.fields.get(field).sortType;
+
+        //create a comparison function. Takes 2 records, returns 1 if record 1 is greater,
+        //-1 if record 2 is greater or 0 if they are equal
+        return function(r1, r2) {
+            var v1 = sortType(r1.data[field]),
+                v2 = sortType(r2.data[field]);
+
+            return directionModifier * (v1 > v2 ? 1 : (v1 < v2 ? -1 : 0));
+        };
+    },
+
+    /**
+     * Sets the default sort column and order to be used by the next {@link #load} operation.
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    setDefaultSort : function(field, dir) {
+        dir = dir ? dir.toUpperCase() : 'ASC';
+        this.sortInfo = {field: field, direction: dir};
+        this.sortToggle[field] = dir;
+    },
+
+    /**
+     * Sort the Records.
+     * If remote sorting is used, the sort is performed on the server, and the cache is reloaded. If local
+     * sorting is used, the cache is sorted internally. See also {@link #remoteSort} and {@link #paramNames}.
+     * This function accepts two call signatures - pass in a field name as the first argument to sort on a single
+     * field, or pass in an array of sort configuration objects to sort by multiple fields.
+     * Single sort example:
+     * store.sort('name', 'ASC');
+     * Multi sort example:
+     * store.sort([
+     *   {
+     *     field    : 'name',
+     *     direction: 'ASC'
+     *   },
+     *   {
+     *     field    : 'salary',
+     *     direction: 'DESC'
+     *   }
+     * ], 'ASC');
+     * In this second form, the sort configs are applied in order, with later sorters sorting within earlier sorters' results.
+     * For example, if two records with the same name are present they will also be sorted by salary if given the sort configs
+     * above. Any number of sort configs can be added.
+     * @param {String/Array} fieldName The name of the field to sort by, or an array of ordered sort configs
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    sort : function(fieldName, dir) {
+        if (Ext.isArray(arguments[0])) {
+            return this.multiSort.call(this, fieldName, dir);
+        } else {
+            return this.singleSort(fieldName, dir);
+        }
+    },
+
+    /**
+     * Sorts the store contents by a single field and direction. This is called internally by {@link sort} and would
+     * not usually be called manually
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    singleSort: function(fieldName, dir) {
+        var field = this.fields.get(fieldName);
+        if (!field) {
+            return false;
+        }
+
+        var name       = field.name,
+            sortInfo   = this.sortInfo || null,
+            sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+        if (!dir) {
+            if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+            } else {
+                dir = field.sortDir;
+            }
+        }
+
+        this.sortToggle[name] = dir;
+        this.sortInfo = {field: name, direction: dir};
+        this.hasMultiSort = false;
+
+        if (this.remoteSort) {
+            if (!this.load(this.lastOptions)) {
+                if (sortToggle) {
+                    this.sortToggle[name] = sortToggle;
+                }
+                if (sortInfo) {
+                    this.sortInfo = sortInfo;
+                }
+            }
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+        return true;
+    },
+
+    /**
+     * Sorts the contents of this store by multiple field/direction sorters. This is called internally by {@link sort}
+     * and would not usually be called manually.
+     * Multi sorting only currently applies to local datasets - multiple sort data is not currently sent to a proxy
+     * if remoteSort is used.
+     * @param {Array} sorters Array of sorter objects (field and direction)
+     * @param {String} direction Overall direction to sort the ordered results by (defaults to "ASC")
+     */
+    multiSort: function(sorters, direction) {
+        this.hasMultiSort = true;
+        direction = direction || "ASC";
+
+        //toggle sort direction
+        if (this.multiSortInfo && direction == this.multiSortInfo.direction) {
+            direction = direction.toggle("ASC", "DESC");
+        }
+
+        /**
+         * Object containing overall sort direction and an ordered array of sorter configs used when sorting on multiple fields
+         * @property multiSortInfo
+         * @type Object
+         */
+        this.multiSortInfo = {
+            sorters  : sorters,
+            direction: direction
+        };
+        
+        if (this.remoteSort) {
+            this.singleSort(sorters[0].field, sorters[0].direction);
+
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Calls the specified function for each of the {@link Ext.data.Record Records} in the cache.
+     * @param {Function} fn The function to call. The {@link Ext.data.Record Record} is passed as the first parameter.
+     * Returning <tt>false</tt> aborts and exits the iteration.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed.
+     * Defaults to the current {@link Ext.data.Record Record} in the iteration.
+     */
+    each : function(fn, scope){
+        this.data.each(fn, scope);
+    },
+
+    /**
+     * Gets all {@link Ext.data.Record records} modified since the last commit.  Modified records are
+     * persisted across load operations (e.g., during paging). <b>Note</b>: deleted records are not
+     * included.  See also <tt>{@link #pruneModifiedRecords}</tt> and
+     * {@link Ext.data.Record}<tt>{@link Ext.data.Record#markDirty markDirty}.</tt>.
+     * @return {Ext.data.Record[]} An array of {@link Ext.data.Record Records} containing outstanding
+     * modifications.  To obtain modified fields within a modified record see
+     *{@link Ext.data.Record}<tt>{@link Ext.data.Record#modified modified}.</tt>.
+     */
+    getModifiedRecords : function(){
+        return this.modified;
+    },
+
+    /**
+     * Sums the value of <tt>property</tt> for each {@link Ext.data.Record record} between <tt>start</tt>
+     * and <tt>end</tt> and returns the result.
+     * @param {String} property A field in each record
+     * @param {Number} start (optional) The record index to start at (defaults to <tt>0</tt>)
+     * @param {Number} end (optional) The last record index to include (defaults to length - 1)
+     * @return {Number} The sum
+     */
+    sum : function(property, start, end){
+        var rs = this.data.items, v = 0;
+        start = start || 0;
+        end = (end || end === 0) ? end : rs.length-1;
+
+        for(var i = start; i <= end; i++){
+            v += (rs[i].data[property] || 0);
+        }
+        return v;
+    },
+
+    /**
+     * @private
+     * Returns a filter function used to test a the given property's value. Defers most of the work to
+     * Ext.util.MixedCollection's createValueMatcher function
+     * @param {String} property The property to create the filter function for
+     * @param {String/RegExp} value The string/regex to compare the property value to
+     * @param {Boolean} anyMatch True if we don't care if the filter value is not the full value (defaults to false)
+     * @param {Boolean} caseSensitive True to create a case-sensitive regex (defaults to false)
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createFilterFn : function(property, value, anyMatch, caseSensitive, exactMatch){
+        if(Ext.isEmpty(value, false)){
+            return false;
+        }
+        value = this.data.createValueMatcher(value, anyMatch, caseSensitive, exactMatch);
+        return function(r) {
+            return value.test(r.data[property]);
+        };
+    },
+
+    /**
+     * @private
+     * Given an array of filter functions (each with optional scope), constructs and returns a single function that returns
+     * the result of all of the filters ANDed together
+     * @param {Array} filters The array of filter objects (each object should contain an 'fn' and optional scope)
+     * @return {Function} The multiple filter function
+     */
+    createMultipleFilterFn: function(filters) {
+        return function(record) {
+            var isMatch = true;
+
+            for (var i=0, j = filters.length; i < j; i++) {
+                var filter = filters[i],
+                    fn     = filter.fn,
+                    scope  = filter.scope;
+
+                isMatch = isMatch && fn.call(scope, record);
+            }
+
+            return isMatch;
+        };
+    },
+
+    /**
+     * Filter the {@link Ext.data.Record records} by a specified property. Alternatively, pass an array of filter
+     * options to filter by more than one property.
+     * Single filter example:
+     * store.filter('name', 'Ed', true, true); //finds all records containing the substring 'Ed'
+     * Multiple filter example:
+     * <pre><code>
+     * store.filter([
+     *   {
+     *     property     : 'name',
+     *     value        : 'Ed',
+     *     anyMatch     : true, //optional, defaults to true
+     *     caseSensitive: true  //optional, defaults to true
+     *   },
+     *
+     *   //filter functions can also be passed
+     *   {
+     *     fn   : function(record) {
+     *       return record.get('age') == 24
+     *     },
+     *     scope: this
+     *   }
+     * ]);
+     * </code></pre>
+     * @param {String|Array} field A field on your records, or an array containing multiple filter options
+     * @param {String/RegExp} value Either a string that the field should begin with, or a RegExp to test
+     * against the field.
+     * @param {Boolean} anyMatch (optional) <tt>true</tt> to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) <tt>true</tt> for case sensitive comparison
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    filter : function(property, value, anyMatch, caseSensitive, exactMatch){
+        var fn;
+        //we can accept an array of filter objects, or a single filter object - normalize them here
+        if (Ext.isObject(property)) {
+            property = [property];
+        }
+
+        if (Ext.isArray(property)) {
+            var filters = [];
+
+            //normalize the filters passed into an array of filter functions
+            for (var i=0, j = property.length; i < j; i++) {
+                var filter = property[i],
+                    func   = filter.fn,
+                    scope  = filter.scope || this;
+
+                //if we weren't given a filter function, construct one now
+                if (!Ext.isFunction(func)) {
+                    func = this.createFilterFn(filter.property, filter.value, filter.anyMatch, filter.caseSensitive, filter.exactMatch);
+                }
+
+                filters.push({fn: func, scope: scope});
+            }
+
+            fn = this.createMultipleFilterFn(filters);
+        } else {
+            //classic single property filter
+            fn = this.createFilterFn(property, value, anyMatch, caseSensitive, exactMatch);
+        }
+
+        return fn ? this.filterBy(fn) : this.clearFilter();
+    },
+
+    /**
+     * Filter by a function. The specified function will be called for each
+     * Record in this Store. If the function returns <tt>true</tt> the Record is included,
+     * otherwise it is filtered out.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     */
+    filterBy : function(fn, scope){
+        this.snapshot = this.snapshot || this.data;
+        this.data = this.queryBy(fn, scope || this);
+        this.fireEvent('datachanged', this);
+    },
+
+    /**
+     * Revert to a view of the Record cache with no filtering applied.
+     * @param {Boolean} suppressEvent If <tt>true</tt> the filter is cleared silently without firing the
+     * {@link #datachanged} event.
+     */
+    clearFilter : function(suppressEvent){
+        if(this.isFiltered()){
+            this.data = this.snapshot;
+            delete this.snapshot;
+            if(suppressEvent !== true){
+                this.fireEvent('datachanged', this);
+            }
+        }
+    },
+
+    /**
+     * Returns true if this store is currently filtered
+     * @return {Boolean}
+     */
+    isFiltered : function(){
+        return !!this.snapshot && this.snapshot != this.data;
+    },
+
+    /**
+     * Query the records by a specified property.
+     * @param {String} field A field on your records
+     * @param {String/RegExp} value Either a string that the field
+     * should begin with, or a RegExp to test against the field.
+     * @param {Boolean} anyMatch (optional) True to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     */
+    query : function(property, value, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.queryBy(fn) : this.data.clone();
+    },
+
+    /**
+     * Query the cached records in this Store using a filtering function. The specified function
+     * will be called with each record in this Store. If the function returns <tt>true</tt> the record is
+     * included in the results.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     **/
+    queryBy : function(fn, scope){
+        var data = this.snapshot || this.data;
+        return data.filterBy(fn, scope||this);
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {String/RegExp} value Either a string that the field value
+     * should begin with, or a RegExp to test against the field.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {Number} The matched index or -1
+     */
+    find : function(property, value, start, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.data.findIndexBy(fn, null, start) : -1;
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {Mixed} value The value to match the field against.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findExact: function(property, value, start){
+        return this.data.findIndexBy(function(rec){
+            return rec.get(property) === value;
+        }, this, start);
+    },
+
+    /**
+     * Find the index of the first matching Record in this Store by a function.
+     * If the function returns <tt>true</tt> it is considered a match.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findBy : function(fn, scope, start){
+        return this.data.findIndexBy(fn, scope, start);
+    },
+
+    /**
+     * Collects unique values for a particular dataIndex from this store.
+     * @param {String} dataIndex The property to collect
+     * @param {Boolean} allowNull (optional) Pass true to allow null, undefined or empty string values
+     * @param {Boolean} bypassFilter (optional) Pass true to collect from all records, even ones which are filtered
+     * @return {Array} An array of the unique values
+     **/
+    collect : function(dataIndex, allowNull, bypassFilter){
+        var d = (bypassFilter === true && this.snapshot) ?
+                this.snapshot.items : this.data.items;
+        var v, sv, r = [], l = {};
+        for(var i = 0, len = d.length; i < len; i++){
+            v = d[i].data[dataIndex];
+            sv = String(v);
+            if((allowNull || !Ext.isEmpty(v)) && !l[sv]){
+                l[sv] = true;
+                r[r.length] = v;
+            }
+        }
+        return r;
+    },
+
+    // private
+    afterEdit : function(record){
+        if(this.modified.indexOf(record) == -1){
+            this.modified.push(record);
+        }
+        this.fireEvent('update', this, record, Ext.data.Record.EDIT);
+    },
+
+    // private
+    afterReject : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.REJECT);
+    },
+
+    // private
+    afterCommit : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Commit all Records with {@link #getModifiedRecords outstanding changes}. To handle updates for changes,
+     * subscribe to the Store's {@link #update update event}, and perform updating when the third parameter is
+     * Ext.data.Record.COMMIT.
+     */
+    commitChanges : function(){
+        var modified = this.modified.slice(0),
+            length   = modified.length,
+            i;
+            
+        for (i = 0; i < length; i++){
+            modified[i].commit();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    /**
+     * {@link Ext.data.Record#reject Reject} outstanding changes on all {@link #getModifiedRecords modified records}.
+     */
+    rejectChanges : function() {
+        var modified = this.modified.slice(0),
+            removed  = this.removed.slice(0).reverse(),
+            mLength  = modified.length,
+            rLength  = removed.length,
+            i;
+        
+        for (i = 0; i < mLength; i++) {
+            modified[i].reject();
+        }
+        
+        for (i = 0; i < rLength; i++) {
+            this.insert(removed[i].lastIndex || 0, removed[i]);
+            removed[i].reject();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    // private
+    onMetaChange : function(meta){
+        this.recordType = this.reader.recordType;
+        this.fields = this.recordType.prototype.fields;
+        delete this.snapshot;
+        if(this.reader.meta.sortInfo){
+            this.sortInfo = this.reader.meta.sortInfo;
+        }else if(this.sortInfo  && !this.fields.get(this.sortInfo.field)){
+            delete this.sortInfo;
+        }
+        if(this.writer){
+            this.writer.meta = this.reader.meta;
+        }
+        this.modified = [];
+        this.fireEvent('metachange', this, this.reader.meta);
+    },
+
+    // private
+    findInsertIndex : function(record){
+        this.suspendEvents();
+        var data = this.data.clone();
+        this.data.add(record);
+        this.applySort();
+        var index = this.data.indexOf(record);
+        this.data = data;
+        this.resumeEvents();
+        return index;
+    },
+
+    /**
+     * Set the value for a property name in this store's {@link #baseParams}.  Usage:</p><pre><code>
+myStore.setBaseParam('foo', {bar:3});
+</code></pre>
+     * @param {String} name Name of the property to assign
+     * @param {Mixed} value Value to assign the <tt>name</tt>d property
+     **/
+    setBaseParam : function (name, value){
+        this.baseParams = this.baseParams || {};
+        this.baseParams[name] = value;
+    }
+});
+
+Ext.reg('store', Ext.data.Store);
+
+/**
+ * @class Ext.data.Store.Error
+ * @extends Ext.Error
+ * Store Error extension.
+ * @param {String} name
+ */
+Ext.data.Store.Error = Ext.extend(Ext.Error, {
+    name: 'Ext.data.Store'
+});
+Ext.apply(Ext.data.Store.Error.prototype, {
+    lang: {
+        'writer-undefined' : 'Attempted to execute a write-action without a DataWriter installed.'
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/XmlWriter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/XmlWriter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/XmlWriter.js	(revision 76)
@@ -0,0 +1,158 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.XmlWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action via XML.
+ * XmlWriter uses an instance of {@link Ext.XTemplate} for maximum flexibility in defining your own custom XML schema if the default schema is not appropriate for your needs.
+ * See the {@link #tpl} configuration-property.
+ */
+Ext.data.XmlWriter = function(params) {
+    Ext.data.XmlWriter.superclass.constructor.apply(this, arguments);
+    // compile the XTemplate for rendering XML documents.
+    this.tpl = (typeof(this.tpl) === 'string') ? new Ext.XTemplate(this.tpl).compile() : this.tpl.compile();
+};
+Ext.extend(Ext.data.XmlWriter, Ext.data.DataWriter, {
+    /**
+     * @cfg {String} documentRoot [xrequest] (Optional) The name of the XML document root-node.  <b>Note:</b>
+     * this parameter is required </b>only when</b> sending extra {@link Ext.data.Store#baseParams baseParams} to the server
+     * during a write-request -- if no baseParams are set, the {@link Ext.data.XmlReader#record} meta-property can
+     * suffice as the XML document root-node for write-actions involving just a <b>single record</b>.  For requests
+     * involving <b>multiple</b> records and <b>NO</b> baseParams, the {@link Ext.data.XmlWriter#root} property can
+     * act as the XML document root.
+     */
+    documentRoot: 'xrequest',
+    /**
+     * @cfg {Boolean} forceDocumentRoot [false] Set to <tt>true</tt> to force XML documents having a root-node as defined
+     * by {@link #documentRoot}, even with no baseParams defined.
+     */
+    forceDocumentRoot: false,
+    /**
+     * @cfg {String} root [records] The name of the containing element which will contain the nodes of an write-action involving <b>multiple</b> records.  Each
+     * xml-record written to the server will be wrapped in an element named after {@link Ext.data.XmlReader#record} property.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;user>&lt;first>Barney&lt;/first>&lt;/user>
+</code></pre>
+     * However, when <b>multiple</b> records are written in a batch-operation, these records must be wrapped in a containing
+     * Element.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+    &lt;records>
+        &lt;first>Barney&lt;/first>&lt;/user>
+        &lt;records>&lt;first>Barney&lt;/first>&lt;/user>
+    &lt;/records>
+</code></pre>
+     * Defaults to <tt>records</tt>.  Do not confuse the nature of this property with that of {@link #documentRoot}
+     */
+    root: 'records',
+    /**
+     * @cfg {String} xmlVersion [1.0] The <tt>version</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlVersion : '1.0',
+    /**
+     * @cfg {String} xmlEncoding [ISO-8859-15] The <tt>encoding</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlEncoding: 'ISO-8859-15',
+    /**
+     * @cfg {String/Ext.XTemplate} tpl The XML template used to render {@link Ext.data.Api#actions write-actions} to your server.
+     * <p>One can easily provide his/her own custom {@link Ext.XTemplate#constructor template-definition} if the default does not suffice.</p>
+     * <p>Defaults to:</p>
+<code><pre>
+&lt;?xml version="{version}" encoding="{encoding}"?>
+    &lt;tpl if="documentRoot">&lt;{documentRoot}>
+    &lt;tpl for="baseParams">
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;{root}>',
+    &lt;tpl for="records">
+        &lt;{parent.record}>
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+        &lt;/{parent.record}>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;/{root}>&lt;/tpl>
+    &lt;tpl if="documentRoot">&lt;/{documentRoot}>&lt;/tpl>
+</pre></code>
+     * <p>Templates will be called with the following API</p>
+     * <ul>
+     * <li>{String} version [1.0] The xml version.</li>
+     * <li>{String} encoding [ISO-8859-15] The xml encoding.</li>
+     * <li>{String/false} documentRoot The XML document root-node name or <tt>false</tt> if not required.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * <li>{String} record The meta-data parameter defined on your {@link Ext.data.XmlReader#record} configuration represents the name of the xml-tag containing each record.</li>
+     * <li>{String} root The meta-data parameter defined by {@link Ext.data.XmlWriter#root} configuration-parameter.  Represents the name of the xml root-tag when sending <b>multiple</b> records to the server.</li>
+     * <li>{Array} records The records being sent to the server, ie: the subject of the write-action being performed.  The records parameter will be always be an array, even when only a single record is being acted upon.
+     *     Each item within the records array will contain an array of field objects having the following properties:
+     *     <ul>
+     *         <li>{String} name The field-name of the record as defined by your {@link Ext.data.Record#create Ext.data.Record definition}.  The "mapping" property will be used, otherwise it will match the "name" property.  Use this parameter to define the XML tag-name of the property.</li>
+     *         <li>{Mixed} value The record value of the field enclosed within XML tags specified by name property above.</li>
+     *     </ul></li>
+     * <li>{Array} baseParams.  The baseParams as defined upon {@link Ext.data.Store#baseParams}.  Note that the baseParams have been converted into an array of [{name : "foo", value: "bar"}, ...] pairs in the same manner as the <b>records</b> parameter above.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * </ul>
+     */
+    // Encoding the ? here in case it's being included by some kind of page that will parse it (eg. PHP)
+    tpl: '<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',
+
+
+    /**
+     * XmlWriter implementation of the final stage of a write action.
+     * @param {Object} params Transport-proxy's (eg: {@link Ext.Ajax#request}) params-object to write-to.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data-object representing the compiled Store-recordset.
+     */
+    render : function(params, baseParams, data) {
+        baseParams = this.toArray(baseParams);
+        params.xmlData = this.tpl.applyTemplate({
+            version: this.xmlVersion,
+            encoding: this.xmlEncoding,
+            documentRoot: (baseParams.length > 0 || this.forceDocumentRoot === true) ? this.documentRoot : false,
+            record: this.meta.record,
+            root: this.root,
+            baseParams: baseParams,
+            records: (Ext.isArray(data[0])) ? data : [data]
+        });
+    },
+
+    /**
+     * createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of <tt>name:value</tt> pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    createRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+    },
+
+    /**
+     * updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of {name:value} pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    updateRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+
+    },
+    /**
+     * destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array containing a attribute-object (name/value pair) representing the {@link Ext.data.DataReader#idProperty idProperty}.
+     */
+    destroyRecord : function(rec) {
+        var data = {};
+        data[this.meta.idProperty] = rec.id;
+        return this.toArray(data);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Response.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Response.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Response.js	(revision 76)
@@ -0,0 +1,39 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Response
+ * A generic response class to normalize response-handling internally to the framework.
+ */
+Ext.data.Response = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Response.prototype = {
+    /**
+     * @cfg {String} action {@link Ext.data.Api#actions}
+     */
+    action: undefined,
+    /**
+     * @cfg {Boolean} success
+     */
+    success : undefined,
+    /**
+     * @cfg {String} message
+     */
+    message : undefined,
+    /**
+     * @cfg {Array/Object} data
+     */
+    data: undefined,
+    /**
+     * @cfg {Object} raw The raw response returned from server-code
+     */
+    raw: undefined,
+    /**
+     * @cfg {Ext.data.Record/Ext.data.Record[]} records related to the Request action
+     */
+    records: undefined
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/Tree.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/Tree.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/Tree.js	(revision 76)
@@ -0,0 +1,833 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.Tree
+ * @extends Ext.util.Observable
+ * Represents a tree data structure and bubbles all the events for its nodes. The nodes
+ * in the tree have most standard DOM functionality.
+ * @constructor
+ * @param {Node} root (optional) The root node
+ */
+Ext.data.Tree = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(root){
+        this.nodeHash = {};
+        /**
+         * The root node for this tree
+         * @type Node
+         */
+        this.root = null;
+        if(root){
+            this.setRootNode(root);
+        }
+        this.addEvents(
+            /**
+             * @event append
+             * Fires when a new child node is appended to a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append",
+            /**
+             * @event remove
+             * Fires when a child node is removed from a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node removed
+             */
+            "remove",
+            /**
+             * @event move
+             * Fires when a node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node moved
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move",
+            /**
+             * @event insert
+             * Fires when a new child node is inserted in a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert",
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend",
+            /**
+             * @event beforeremove
+             * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove",
+            /**
+             * @event beforemove
+             * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node being moved
+             * @param {Node} oldParent The parent of the node
+             * @param {Node} newParent The new parent the node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove",
+            /**
+             * @event beforeinsert
+             * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be inserted
+             * @param {Node} refNode The child node the node is being inserted before
+             */
+            "beforeinsert"
+        );
+        Ext.data.Tree.superclass.constructor.call(this);        
+    },
+    
+    /**
+     * @cfg {String} pathSeparator
+     * The token used to separate paths in node ids (defaults to '/').
+     */
+    pathSeparator: "/",
+
+    // private
+    proxyNodeEvent : function(){
+        return this.fireEvent.apply(this, arguments);
+    },
+
+    /**
+     * Returns the root node for this tree.
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        return node;
+    },
+
+    /**
+     * Gets a node in this tree by its id.
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    toString : function(){
+        return "[Tree"+(this.id?" "+this.id:"")+"]";
+    }
+});
+
+/**
+ * @class Ext.data.Node
+ * @extends Ext.util.Observable
+ * @cfg {Boolean} leaf true if this node is a leaf and does not have children
+ * @cfg {String} id The id for this node. If one is not specified, one is generated.
+ * @constructor
+ * @param {Object} attributes The attributes/config for the node
+ */
+Ext.data.Node = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(attributes){
+        /**
+         * The attributes supplied for the node. You can use this property to access any custom attributes you supplied.
+         * @type {Object}
+         */
+        this.attributes = attributes || {};
+        this.leaf = this.attributes.leaf;
+        /**
+         * The node id. @type String
+         */
+        this.id = this.attributes.id;
+        if(!this.id){
+            this.id = Ext.id(null, "xnode-");
+            this.attributes.id = this.id;
+        }
+        /**
+         * All child nodes of this node. @type Array
+         */
+        this.childNodes = [];
+        /**
+         * The parent node for this node. @type Node
+         */
+        this.parentNode = null;
+        /**
+         * The first direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.firstChild = null;
+        /**
+         * The last direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.lastChild = null;
+        /**
+         * The node immediately preceding this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.previousSibling = null;
+        /**
+         * The node immediately following this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.nextSibling = null;
+
+        this.addEvents({
+            /**
+             * @event append
+             * Fires when a new child node is appended
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append" : true,
+            /**
+             * @event remove
+             * Fires when a child node is removed
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The removed node
+             */
+            "remove" : true,
+            /**
+             * @event move
+             * Fires when this node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move" : true,
+            /**
+             * @event insert
+             * Fires when a new child node is inserted.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert" : true,
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend" : true,
+            /**
+             * @event beforeremove
+             * Fires before a child is removed, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove" : true,
+            /**
+             * @event beforemove
+             * Fires before this node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The parent of this node
+             * @param {Node} newParent The new parent this node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove" : true,
+             /**
+              * @event beforeinsert
+              * Fires before a new child is inserted, return false to cancel the insert.
+              * @param {Tree} tree The owner tree
+              * @param {Node} this This node
+              * @param {Node} node The child node to be inserted
+              * @param {Node} refNode The child node the node is being inserted before
+              */
+            "beforeinsert" : true
+        });
+        this.listeners = this.attributes.listeners;
+        Ext.data.Node.superclass.constructor.call(this);    
+    },
+    
+    // private
+    fireEvent : function(evtName){
+        // first do standard event for this node
+        if(Ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
+            return false;
+        }
+        // then bubble it up to the tree if the event wasn't cancelled
+        var ot = this.getOwnerTree();
+        if(ot){
+            if(ot.proxyNodeEvent.apply(ot, arguments) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Returns true if this node is a leaf
+     * @return {Boolean}
+     */
+    isLeaf : function(){
+        return this.leaf === true;
+    },
+
+    // private
+    setFirstChild : function(node){
+        this.firstChild = node;
+    },
+
+    //private
+    setLastChild : function(node){
+        this.lastChild = node;
+    },
+
+
+    /**
+     * Returns true if this node is the last child of its parent
+     * @return {Boolean}
+     */
+    isLast : function(){
+       return (!this.parentNode ? true : this.parentNode.lastChild == this);
+    },
+
+    /**
+     * Returns true if this node is the first child of its parent
+     * @return {Boolean}
+     */
+    isFirst : function(){
+       return (!this.parentNode ? true : this.parentNode.firstChild == this);
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, else false.
+     * @return {Boolean}
+     */
+    hasChildNodes : function(){
+        return !this.isLeaf() && this.childNodes.length > 0;
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, or if the <tt>expandable</tt>
+     * node attribute is explicitly specified as true (see {@link #attributes}), otherwise returns false.
+     * @return {Boolean}
+     */
+    isExpandable : function(){
+        return this.attributes.expandable || this.hasChildNodes();
+    },
+
+    /**
+     * Insert node(s) as the last child node of this node.
+     * @param {Node/Array} node The node or Array of nodes to append
+     * @return {Node} The appended node if single append, or null if an array was passed
+     */
+    appendChild : function(node){
+        var multi = false;
+        if(Ext.isArray(node)){
+            multi = node;
+        }else if(arguments.length > 1){
+            multi = arguments;
+        }
+        // if passed an array or multiple args do them one by one
+        if(multi){
+            for(var i = 0, len = multi.length; i < len; i++) {
+                this.appendChild(multi[i]);
+            }
+        }else{
+            if(this.fireEvent("beforeappend", this.ownerTree, this, node) === false){
+                return false;
+            }
+            var index = this.childNodes.length;
+            var oldParent = node.parentNode;
+            // it's a move, make sure we move it cleanly
+            if(oldParent){
+                if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index) === false){
+                    return false;
+                }
+                oldParent.removeChild(node);
+            }
+            index = this.childNodes.length;
+            if(index === 0){
+                this.setFirstChild(node);
+            }
+            this.childNodes.push(node);
+            node.parentNode = this;
+            var ps = this.childNodes[index-1];
+            if(ps){
+                node.previousSibling = ps;
+                ps.nextSibling = node;
+            }else{
+                node.previousSibling = null;
+            }
+            node.nextSibling = null;
+            this.setLastChild(node);
+            node.setOwnerTree(this.getOwnerTree());
+            this.fireEvent("append", this.ownerTree, this, node, index);
+            if(oldParent){
+                node.fireEvent("move", this.ownerTree, node, oldParent, this, index);
+            }
+            return node;
+        }
+    },
+
+    /**
+     * Removes a child node from this node.
+     * @param {Node} node The node to remove
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} The removed node
+     */
+    removeChild : function(node, destroy){
+        var index = this.childNodes.indexOf(node);
+        if(index == -1){
+            return false;
+        }
+        if(this.fireEvent("beforeremove", this.ownerTree, this, node) === false){
+            return false;
+        }
+
+        // remove it from childNodes collection
+        this.childNodes.splice(index, 1);
+
+        // update siblings
+        if(node.previousSibling){
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+        if(node.nextSibling){
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+
+        // update child refs
+        if(this.firstChild == node){
+            this.setFirstChild(node.nextSibling);
+        }
+        if(this.lastChild == node){
+            this.setLastChild(node.previousSibling);
+        }
+
+        this.fireEvent("remove", this.ownerTree, this, node);
+        if(destroy){
+            node.destroy(true);
+        }else{
+            node.clear();
+        }
+        return node;
+    },
+
+    // private
+    clear : function(destroy){
+        // clear any references from the node
+        this.setOwnerTree(null, destroy);
+        this.parentNode = this.previousSibling = this.nextSibling = null;
+        if(destroy){
+            this.firstChild = this.lastChild = null;
+        }
+    },
+
+    /**
+     * Destroys the node.
+     */
+    destroy : function(/* private */ silent){
+        /*
+         * Silent is to be used in a number of cases
+         * 1) When setRootNode is called.
+         * 2) When destroy on the tree is called
+         * 3) For destroying child nodes on a node
+         */
+        if(silent === true){
+            this.purgeListeners();
+            this.clear(true);
+            Ext.each(this.childNodes, function(n){
+                n.destroy(true);
+            });
+            this.childNodes = null;
+        }else{
+            this.remove(true);
+        }
+    },
+
+    /**
+     * Inserts the first node before the second node in this nodes childNodes collection.
+     * @param {Node} node The node to insert
+     * @param {Node} refNode The node to insert before (if null the node is appended)
+     * @return {Node} The inserted node
+     */
+    insertBefore : function(node, refNode){
+        if(!refNode){ // like standard Dom, refNode can be null for append
+            return this.appendChild(node);
+        }
+        // nothing to do
+        if(node == refNode){
+            return false;
+        }
+
+        if(this.fireEvent("beforeinsert", this.ownerTree, this, node, refNode) === false){
+            return false;
+        }
+        var index = this.childNodes.indexOf(refNode);
+        var oldParent = node.parentNode;
+        var refIndex = index;
+
+        // when moving internally, indexes will change after remove
+        if(oldParent == this && this.childNodes.indexOf(node) < index){
+            refIndex--;
+        }
+
+        // it's a move, make sure we move it cleanly
+        if(oldParent){
+            if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index, refNode) === false){
+                return false;
+            }
+            oldParent.removeChild(node);
+        }
+        if(refIndex === 0){
+            this.setFirstChild(node);
+        }
+        this.childNodes.splice(refIndex, 0, node);
+        node.parentNode = this;
+        var ps = this.childNodes[refIndex-1];
+        if(ps){
+            node.previousSibling = ps;
+            ps.nextSibling = node;
+        }else{
+            node.previousSibling = null;
+        }
+        node.nextSibling = refNode;
+        refNode.previousSibling = node;
+        node.setOwnerTree(this.getOwnerTree());
+        this.fireEvent("insert", this.ownerTree, this, node, refNode);
+        if(oldParent){
+            node.fireEvent("move", this.ownerTree, node, oldParent, this, refIndex, refNode);
+        }
+        return node;
+    },
+
+    /**
+     * Removes this node from its parent
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    remove : function(destroy){
+        if (this.parentNode) {
+            this.parentNode.removeChild(this, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all child nodes from this node.
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    removeAll : function(destroy){
+        var cn = this.childNodes,
+            n;
+        while((n = cn[0])){
+            this.removeChild(n, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Returns the child node at the specified index.
+     * @param {Number} index
+     * @return {Node}
+     */
+    item : function(index){
+        return this.childNodes[index];
+    },
+
+    /**
+     * Replaces one child node in this node with another.
+     * @param {Node} newChild The replacement node
+     * @param {Node} oldChild The node to replace
+     * @return {Node} The replaced node
+     */
+    replaceChild : function(newChild, oldChild){
+        var s = oldChild ? oldChild.nextSibling : null;
+        this.removeChild(oldChild);
+        this.insertBefore(newChild, s);
+        return oldChild;
+    },
+
+    /**
+     * Returns the index of a child node
+     * @param {Node} node
+     * @return {Number} The index of the node or -1 if it was not found
+     */
+    indexOf : function(child){
+        return this.childNodes.indexOf(child);
+    },
+
+    /**
+     * Returns the tree this node is in.
+     * @return {Tree}
+     */
+    getOwnerTree : function(){
+        // if it doesn't have one, look for one
+        if(!this.ownerTree){
+            var p = this;
+            while(p){
+                if(p.ownerTree){
+                    this.ownerTree = p.ownerTree;
+                    break;
+                }
+                p = p.parentNode;
+            }
+        }
+        return this.ownerTree;
+    },
+
+    /**
+     * Returns depth of this node (the root node has a depth of 0)
+     * @return {Number}
+     */
+    getDepth : function(){
+        var depth = 0;
+        var p = this;
+        while(p.parentNode){
+            ++depth;
+            p = p.parentNode;
+        }
+        return depth;
+    },
+
+    // private
+    setOwnerTree : function(tree, destroy){
+        // if it is a move, we need to update everyone
+        if(tree != this.ownerTree){
+            if(this.ownerTree){
+                this.ownerTree.unregisterNode(this);
+            }
+            this.ownerTree = tree;
+            // If we're destroying, we don't need to recurse since it will be called on each child node
+            if(destroy !== true){
+                Ext.each(this.childNodes, function(n){
+                    n.setOwnerTree(tree);
+                });
+            }
+            if(tree){
+                tree.registerNode(this);
+            }
+        }
+    },
+
+    /**
+     * Changes the id of this node.
+     * @param {String} id The new id for the node.
+     */
+    setId: function(id){
+        if(id !== this.id){
+            var t = this.ownerTree;
+            if(t){
+                t.unregisterNode(this);
+            }
+            this.id = this.attributes.id = id;
+            if(t){
+                t.registerNode(this);
+            }
+            this.onIdChange(id);
+        }
+    },
+
+    // private
+    onIdChange: Ext.emptyFn,
+
+    /**
+     * Returns the path for this node. The path can be used to expand or select this node programmatically.
+     * @param {String} attr (optional) The attr to use for the path (defaults to the node's id)
+     * @return {String} The path
+     */
+    getPath : function(attr){
+        attr = attr || "id";
+        var p = this.parentNode;
+        var b = [this.attributes[attr]];
+        while(p){
+            b.unshift(p.attributes[attr]);
+            p = p.parentNode;
+        }
+        var sep = this.getOwnerTree().pathSeparator;
+        return sep + b.join(sep);
+    },
+
+    /**
+     * Bubbles up the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.parentNode;
+        }
+    },
+
+    /**
+     * Cascades down the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+                cs[i].cascade(fn, scope, args);
+            }
+        }
+    },
+
+    /**
+     * Interates the child nodes of this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the iteration stops.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node in the iteration.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    eachChild : function(fn, scope, args){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+            if(fn.apply(scope || cs[i], args || [cs[i]]) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Finds the first child that has the attribute with the specified value.
+     * @param {String} attribute The attribute name
+     * @param {Mixed} value The value to search for
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChild : function(attribute, value, deep){
+        return this.findChildBy(function(){
+            return this.attributes[attribute] == value;
+        }, null, deep);
+    },
+
+    /**
+     * Finds the first child by a custom function. The child matches if the function passed returns <code>true</code>.
+     * @param {Function} fn A function which must return <code>true</code> if the passed Node is the required Node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Node being tested.
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChildBy : function(fn, scope, deep){
+        var cs = this.childNodes,
+            len = cs.length,
+            i = 0,
+            n,
+            res;
+        for(; i < len; i++){
+            n = cs[i];
+            if(fn.call(scope || n, n) === true){
+                return n;
+            }else if (deep){
+                res = n.findChildBy(fn, scope, deep);
+                if(res != null){
+                    return res;
+                }
+            }
+            
+        }
+        return null;
+    },
+
+    /**
+     * Sorts this nodes children using the supplied sort function.
+     * @param {Function} fn A function which, when passed two Nodes, returns -1, 0 or 1 depending upon required sort order.
+     * @param {Object} scope (optional)The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    sort : function(fn, scope){
+        var cs = this.childNodes;
+        var len = cs.length;
+        if(len > 0){
+            var sortFn = scope ? function(){fn.apply(scope, arguments);} : fn;
+            cs.sort(sortFn);
+            for(var i = 0; i < len; i++){
+                var n = cs[i];
+                n.previousSibling = cs[i-1];
+                n.nextSibling = cs[i+1];
+                if(i === 0){
+                    this.setFirstChild(n);
+                }
+                if(i == len-1){
+                    this.setLastChild(n);
+                }
+            }
+        }
+    },
+
+    /**
+     * Returns true if this node is an ancestor (at any point) of the passed node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    contains : function(node){
+        return node.isAncestor(this);
+    },
+
+    /**
+     * Returns true if the passed node is an ancestor (at any point) of this node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    isAncestor : function(node){
+        var p = this.parentNode;
+        while(p){
+            if(p == node){
+                return true;
+            }
+            p = p.parentNode;
+        }
+        return false;
+    },
+
+    toString : function(){
+        return "[Node"+(this.id?" "+this.id:"")+"]";
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/ArrayReader.js	(revision 76)
@@ -0,0 +1,103 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.ArrayReader
+ * @extends Ext.data.JsonReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an Array.
+ * Each element of that Array represents a row of data fields. The
+ * fields are pulled into a Record object using as a subscript, the <code>mapping</code> property
+ * of the field definition if it exists, or the field's ordinal position in the definition.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+    {name: 'name', mapping: 1},         // "mapping" only needed if an "id" field is present which
+    {name: 'occupation', mapping: 2}    // precludes using the ordinal position as the index.
+]);
+var myReader = new Ext.data.ArrayReader({
+    {@link #idIndex}: 0
+}, Employee);
+</code></pre>
+ * <p>This would consume an Array like this:</p>
+ * <pre><code>
+[ [1, 'Bill', 'Gardener'], [2, 'Ben', 'Horticulturalist'] ]
+ * </code></pre>
+ * @constructor
+ * Create a new ArrayReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.ArrayReader = Ext.extend(Ext.data.JsonReader, {
+    /**
+     * @cfg {String} successProperty
+     * @hide
+     */
+    /**
+     * @cfg {Number} id (optional) The subscript within row Array that provides an ID for the Record.
+     * Deprecated. Use {@link #idIndex} instead.
+     */
+    /**
+     * @cfg {Number} idIndex (optional) The subscript within row Array that provides an ID for the Record.
+     */
+    /**
+     * Create a data block containing Ext.data.Records from an Array.
+     * @param {Object} o An Array of row objects which represents the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        this.arrayData = o;
+        var s = this.meta,
+            sid = s ? Ext.num(s.idIndex, s.id) : null,
+            recordType = this.recordType,
+            fields = recordType.prototype.fields,
+            records = [],
+            success = true,
+            v;
+
+        var root = this.getRoot(o);
+
+        for(var i = 0, len = root.length; i < len; i++) {
+            var n = root[i],
+                values = {},
+                id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null);
+            for(var j = 0, jlen = fields.length; j < jlen; j++) {
+                var f = fields.items[j],
+                    k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j;
+                v = n[k] !== undefined ? n[k] : f.defaultValue;
+                v = f.convert(v, n);
+                values[f.name] = v;
+            }
+            var record = new recordType(values, id);
+            record.json = n;
+            records[records.length] = record;
+        }
+
+        var totalRecords = records.length;
+
+        if(s.totalProperty) {
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)) {
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords
+        };
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/ScriptTagProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/ScriptTagProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/ScriptTagProxy.js	(revision 76)
@@ -0,0 +1,305 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.data.ScriptTagProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that reads a data object from a URL which may be in a domain
+ * other than the originating domain of the running page.<br>
+ * <p>
+ * <b>Note that if you are retrieving data from a page that is in a domain that is NOT the same as the originating domain
+ * of the running page, you must use this class, rather than HttpProxy.</b><br>
+ * <p>
+ * The content passed back from a server resource requested by a ScriptTagProxy <b>must</b> be executable JavaScript
+ * source code because it is used as the source inside a &lt;script> tag.<br>
+ * <p>
+ * In order for the browser to process the returned data, the server must wrap the data object
+ * with a call to a callback function, the name of which is passed as a parameter by the ScriptTagProxy.
+ * Below is a Java example for a servlet which returns data for either a ScriptTagProxy, or an HttpProxy
+ * depending on whether the callback name was passed:
+ * <p>
+ * <pre><code>
+boolean scriptTag = false;
+String cb = request.getParameter("callback");
+if (cb != null) {
+    scriptTag = true;
+    response.setContentType("text/javascript");
+} else {
+    response.setContentType("application/x-json");
+}
+Writer out = response.getWriter();
+if (scriptTag) {
+    out.write(cb + "(");
+}
+out.print(dataBlock.toJsonString());
+if (scriptTag) {
+    out.write(");");
+}
+</code></pre>
+ * <p>Below is a PHP example to do the same thing:</p><pre><code>
+$callback = $_REQUEST['callback'];
+
+// Create the output object.
+$output = array('a' => 'Apple', 'b' => 'Banana');
+
+//start output
+if ($callback) {
+    header('Content-Type: text/javascript');
+    echo $callback . '(' . json_encode($output) . ');';
+} else {
+    header('Content-Type: application/x-json');
+    echo json_encode($output);
+}
+</code></pre>
+ * <p>Below is the ASP.Net code to do the same thing:</p><pre><code>
+String jsonString = "{success: true}";
+String cb = Request.Params.Get("callback");
+String responseString = "";
+if (!String.IsNullOrEmpty(cb)) {
+    responseString = cb + "(" + jsonString + ")";
+} else {
+    responseString = jsonString;
+}
+Response.Write(responseString);
+</code></pre>
+ *
+ * @constructor
+ * @param {Object} config A configuration object.
+ */
+Ext.data.ScriptTagProxy = function(config){
+    Ext.apply(this, config);
+
+    Ext.data.ScriptTagProxy.superclass.constructor.call(this, config);
+
+    this.head = document.getElementsByTagName("head")[0];
+
+    /**
+     * @event loadexception
+     * <b>Deprecated</b> in favor of 'exception' event.
+     * Fires if an exception occurs in the Proxy during data loading.  This event can be fired for one of two reasons:
+     * <ul><li><b>The load call timed out.</b>  This means the load callback did not execute within the time limit
+     * specified by {@link #timeout}.  In this case, this event will be raised and the
+     * fourth parameter (read error) will be null.</li>
+     * <li><b>The load succeeded but the reader could not read the response.</b>  This means the server returned
+     * data, but the configured Reader threw an error while reading the data.  In this case, this event will be
+     * raised and the caught error will be passed along as the fourth parameter of this event.</li></ul>
+     * Note that this event is also relayed through {@link Ext.data.Store}, so you can listen for it directly
+     * on any Store instance.
+     * @param {Object} this
+     * @param {Object} options The loading options that were specified (see {@link #load} for details).  If the load
+     * call timed out, this parameter will be null.
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data.
+     * If the remote request returns success: false, this parameter will be null.
+     */
+};
+
+Ext.data.ScriptTagProxy.TRANS_ID = 1000;
+
+Ext.extend(Ext.data.ScriptTagProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {String} url The URL from which to request the data object.
+     */
+    /**
+     * @cfg {Number} timeout (optional) The number of milliseconds to wait for a response. Defaults to 30 seconds.
+     */
+    timeout : 30000,
+    /**
+     * @cfg {String} callbackParam (Optional) The name of the parameter to pass to the server which tells
+     * the server the name of the callback function set up by the load call to process the returned data object.
+     * Defaults to "callback".<p>The server-side processing must read this parameter value, and generate
+     * javascript output which calls this named function passing the data object as its only parameter.
+     */
+    callbackParam : "callback",
+    /**
+     *  @cfg {Boolean} nocache (optional) Defaults to true. Disable caching by adding a unique parameter
+     * name to the request.
+     */
+    nocache : true,
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is <tt>read</tt>, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        var p = Ext.urlEncode(Ext.apply(params, this.extraParams));
+
+        var url = this.buildUrl(action, rs);
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', url);
+        }
+        url = Ext.urlAppend(url, p);
+
+        if(this.nocache){
+            url = Ext.urlAppend(url, '_dc=' + (new Date().getTime()));
+        }
+        var transId = ++Ext.data.ScriptTagProxy.TRANS_ID;
+        var trans = {
+            id : transId,
+            action: action,
+            cb : "stcCallback"+transId,
+            scriptId : "stcScript"+transId,
+            params : params,
+            arg : arg,
+            url : url,
+            callback : callback,
+            scope : scope,
+            reader : reader
+        };
+        window[trans.cb] = this.createCallback(action, rs, trans);
+        url += String.format("&{0}={1}", this.callbackParam, trans.cb);
+        if(this.autoAbort !== false){
+            this.abort();
+        }
+
+        trans.timeoutId = this.handleFailure.defer(this.timeout, this, [trans]);
+
+        var script = document.createElement("script");
+        script.setAttribute("src", url);
+        script.setAttribute("type", "text/javascript");
+        script.setAttribute("id", trans.scriptId);
+        this.head.appendChild(script);
+
+        this.trans = trans;
+    },
+
+    // @private createCallback
+    createCallback : function(action, rs, trans) {
+        var self = this;
+        return function(res) {
+            self.trans = false;
+            self.destroyTrans(trans, true);
+            if (action === Ext.data.Api.actions.read) {
+                self.onRead.call(self, action, trans, res);
+            } else {
+                self.onWrite.call(self, action, trans, res, rs);
+            }
+        };
+    },
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, res) {
+        var result;
+        try {
+            result = trans.reader.readRecords(res);
+        }catch(e){
+            // @deprecated: fire loadexception
+            this.fireEvent("loadexception", this, trans, res, e);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, trans.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            this.fireEvent('loadexception', this, trans, res);
+
+            this.fireEvent('exception', this, 'remote', action, trans, res, null);
+        } else {
+            this.fireEvent("load", this, res, trans.arg);
+        }
+        trans.callback.call(trans.scope||window, result, trans.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onWrite : function(action, trans, response, rs) {
+        var reader = trans.reader;
+        try {
+            // though we already have a response object here in STP, run through readResponse to catch any meta-data exceptions.
+            var res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        if(!res.success === true){
+            this.fireEvent('exception', this, 'remote', action, trans, res, rs);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        this.fireEvent("write", this, action, res.data, res, rs, trans.arg );
+        trans.callback.call(trans.scope||window, res.data, res, true);
+    },
+
+    // private
+    isLoading : function(){
+        return this.trans ? true : false;
+    },
+
+    /**
+     * Abort the current server request.
+     */
+    abort : function(){
+        if(this.isLoading()){
+            this.destroyTrans(this.trans);
+        }
+    },
+
+    // private
+    destroyTrans : function(trans, isLoaded){
+        this.head.removeChild(document.getElementById(trans.scriptId));
+        clearTimeout(trans.timeoutId);
+        if(isLoaded){
+            window[trans.cb] = undefined;
+            try{
+                delete window[trans.cb];
+            }catch(e){}
+        }else{
+            // if hasn't been loaded, wait for load to remove it to prevent script error
+            window[trans.cb] = function(){
+                window[trans.cb] = undefined;
+                try{
+                    delete window[trans.cb];
+                }catch(e){}
+            };
+        }
+    },
+
+    // private
+    handleFailure : function(trans){
+        this.trans = false;
+        this.destroyTrans(trans, false);
+        if (trans.action === Ext.data.Api.actions.read) {
+            // @deprecated firing loadexception
+            this.fireEvent("loadexception", this, null, trans.arg);
+        }
+
+        this.fireEvent('exception', this, 'response', trans.action, {
+            response: null,
+            options: trans.arg
+        });
+        trans.callback.call(trans.scope||window, null, trans.arg, false);
+    },
+
+    // inherit docs
+    destroy: function(){
+        this.abort();
+        Ext.data.ScriptTagProxy.superclass.destroy.call(this);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/data/StoreMgr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/data/StoreMgr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/data/StoreMgr.js	(revision 76)
@@ -0,0 +1,72 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.StoreMgr
+ * @extends Ext.util.MixedCollection
+ * The default global group of stores.
+ * @singleton
+ */
+Ext.StoreMgr = Ext.apply(new Ext.util.MixedCollection(), {
+    /**
+     * @cfg {Object} listeners @hide
+     */
+
+    /**
+     * Registers one or more Stores with the StoreMgr. You do not normally need to register stores
+     * manually.  Any store initialized with a {@link Ext.data.Store#storeId} will be auto-registered. 
+     * @param {Ext.data.Store} store1 A Store instance
+     * @param {Ext.data.Store} store2 (optional)
+     * @param {Ext.data.Store} etc... (optional)
+     */
+    register : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.add(s);
+        }
+    },
+
+    /**
+     * Unregisters one or more Stores with the StoreMgr
+     * @param {String/Object} id1 The id of the Store, or a Store instance
+     * @param {String/Object} id2 (optional)
+     * @param {String/Object} etc... (optional)
+     */
+    unregister : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.remove(this.lookup(s));
+        }
+    },
+
+    /**
+     * Gets a registered Store by id
+     * @param {String/Object} id The id of the Store, or a Store instance
+     * @return {Ext.data.Store}
+     */
+    lookup : function(id){
+        if(Ext.isArray(id)){
+            var fields = ['field1'], expand = !Ext.isArray(id[0]);
+            if(!expand){
+                for(var i = 2, len = id[0].length; i <= len; ++i){
+                    fields.push('field' + i);
+                }
+            }
+            return new Ext.data.ArrayStore({
+                fields: fields,
+                data: id,
+                expandData: expand,
+                autoDestroy: true,
+                autoCreated: true
+
+            });
+        }
+        return Ext.isObject(id) ? (id.events ? id : Ext.create(id, 'store')) : this.get(id);
+    },
+
+    // getKey implementation for MixedCollection
+    getKey : function(o){
+         return o.storeId;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/JsonProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/JsonProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/JsonProvider.js	(revision 76)
@@ -0,0 +1,45 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.direct.JsonProvider
+ * @extends Ext.direct.Provider
+ */
+Ext.direct.JsonProvider = Ext.extend(Ext.direct.Provider, {
+    parseResponse: function(xhr){
+        if(!Ext.isEmpty(xhr.responseText)){
+            if(typeof xhr.responseText == 'object'){
+                return xhr.responseText;
+            }
+            return Ext.decode(xhr.responseText);
+        }
+        return null;
+    },
+
+    getEvents: function(xhr){
+        var data = null;
+        try{
+            data = this.parseResponse(xhr);
+        }catch(e){
+            var event = new Ext.Direct.ExceptionEvent({
+                data: e,
+                xhr: xhr,
+                code: Ext.Direct.exceptions.PARSE,
+                message: 'Error parsing json response: \n\n ' + data
+            });
+            return [event];
+        }
+        var events = [];
+        if(Ext.isArray(data)){
+            for(var i = 0, len = data.length; i < len; i++){
+                events.push(Ext.Direct.createEvent(data[i]));
+            }
+        }else{
+            events.push(Ext.Direct.createEvent(data));
+        }
+        return events;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/Transaction.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/Transaction.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/Transaction.js	(revision 76)
@@ -0,0 +1,32 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Direct.Transaction
+ * @extends Object
+ * <p>Supporting Class for Ext.Direct (not intended to be used directly).</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Direct.Transaction = function(config){
+    Ext.apply(this, config);
+    this.tid = ++Ext.Direct.TID;
+    this.retryCount = 0;
+};
+Ext.Direct.Transaction.prototype = {
+    send: function(){
+        this.provider.queueTransaction(this);
+    },
+
+    retry: function(){
+        this.retryCount++;
+        this.send();
+    },
+
+    getProvider: function(){
+        return this.provider;
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/Direct.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/Direct.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/Direct.js	(revision 76)
@@ -0,0 +1,235 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Direct
+ * @extends Ext.util.Observable
+ * <p><b><u>Overview</u></b></p>
+ *
+ * <p>Ext.Direct aims to streamline communication between the client and server
+ * by providing a single interface that reduces the amount of common code
+ * typically required to validate data and handle returned data packets
+ * (reading data, error conditions, etc).</p>
+ *
+ * <p>The Ext.direct namespace includes several classes for a closer integration
+ * with the server-side. The Ext.data namespace also includes classes for working
+ * with Ext.data.Stores which are backed by data from an Ext.Direct method.</p>
+ *
+ * <p><b><u>Specification</u></b></p>
+ *
+ * <p>For additional information consult the
+ * <a href="http://extjs.com/products/extjs/direct.php">Ext.Direct Specification</a>.</p>
+ *
+ * <p><b><u>Providers</u></b></p>
+ *
+ * <p>Ext.Direct uses a provider architecture, where one or more providers are
+ * used to transport data to and from the server. There are several providers
+ * that exist in the core at the moment:</p><div class="mdetail-params"><ul>
+ *
+ * <li>{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations</li>
+ * <li>{@link Ext.direct.PollingProvider PollingProvider} for repeated requests</li>
+ * <li>{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side
+ * on the client.</li>
+ * </ul></div>
+ *
+ * <p>A provider does not need to be invoked directly, providers are added via
+ * {@link Ext.Direct}.{@link Ext.Direct#add add}.</p>
+ *
+ * <p><b><u>Router</u></b></p>
+ *
+ * <p>Ext.Direct utilizes a "router" on the server to direct requests from the client
+ * to the appropriate server-side method. Because the Ext.Direct API is completely
+ * platform-agnostic, you could completely swap out a Java based server solution
+ * and replace it with one that uses C# without changing the client side JavaScript
+ * at all.</p>
+ *
+ * <p><b><u>Server side events</u></b></p>
+ *
+ * <p>Custom events from the server may be handled by the client by adding
+ * listeners, for example:</p>
+ * <pre><code>
+{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}
+
+// add a handler for a 'message' event sent by the server
+Ext.Direct.on('message', function(e){
+    out.append(String.format('&lt;p>&lt;i>{0}&lt;/i>&lt;/p>', e.data));
+            out.el.scrollTo('t', 100000, true);
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.Direct = Ext.extend(Ext.util.Observable, {
+    /**
+     * Each event type implements a getData() method. The default event types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>event</tt></b> : Ext.Direct.Event</li>
+     * <li><b><tt>exception</tt></b> : Ext.Direct.ExceptionEvent</li>
+     * <li><b><tt>rpc</tt></b> : Ext.Direct.RemotingEvent</li>
+     * </ul></div>
+     * @property eventTypes
+     * @type Object
+     */
+
+    /**
+     * Four types of possible exceptions which can occur:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>Ext.Direct.exceptions.TRANSPORT</tt></b> : 'xhr'</li>
+     * <li><b><tt>Ext.Direct.exceptions.PARSE</tt></b> : 'parse'</li>
+     * <li><b><tt>Ext.Direct.exceptions.LOGIN</tt></b> : 'login'</li>
+     * <li><b><tt>Ext.Direct.exceptions.SERVER</tt></b> : 'exception'</li>
+     * </ul></div>
+     * @property exceptions
+     * @type Object
+     */
+    exceptions: {
+        TRANSPORT: 'xhr',
+        PARSE: 'parse',
+        LOGIN: 'login',
+        SERVER: 'exception'
+    },
+
+    // private
+    constructor: function(){
+        this.addEvents(
+            /**
+             * @event event
+             * Fires after an event.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */
+            'event',
+            /**
+             * @event exception
+             * Fires after an event exception.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */
+            'exception'
+        );
+        this.transactions = {};
+        this.providers = {};
+    },
+
+    /**
+     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.
+     * If the provider is not already connected, it will auto-connect.
+     * <pre><code>
+var pollProv = new Ext.direct.PollingProvider({
+    url: 'php/poll2.php'
+});
+
+Ext.Direct.addProvider(
+    {
+        "type":"remoting",       // create a {@link Ext.direct.RemotingProvider}
+        "url":"php\/router.php", // url to connect to the Ext.Direct server-side router.
+        "actions":{              // each property within the actions object represents a Class
+            "TestAction":[       // array of methods within each server side Class
+            {
+                "name":"doEcho", // name of method
+                "len":1
+            },{
+                "name":"multiply",
+                "len":1
+            },{
+                "name":"doForm",
+                "formHandler":true, // handle form on server with Ext.Direct.Transaction
+                "len":1
+            }]
+        },
+        "namespace":"myApplication",// namespace to create the Remoting Provider in
+    },{
+        type: 'polling', // create a {@link Ext.direct.PollingProvider}
+        url:  'php/poll.php'
+    },
+    pollProv // reference to previously created instance
+);
+     * </code></pre>
+     * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance
+     * or config object for a Provider) or any number of Provider descriptions as arguments.  Each
+     * Provider description instructs Ext.Direct how to create client-side stub methods.
+     */
+    addProvider : function(provider){
+        var a = arguments;
+        if(a.length > 1){
+            for(var i = 0, len = a.length; i < len; i++){
+                this.addProvider(a[i]);
+            }
+            return;
+        }
+
+        // if provider has not already been instantiated
+        if(!provider.events){
+            provider = new Ext.Direct.PROVIDERS[provider.type](provider);
+        }
+        provider.id = provider.id || Ext.id();
+        this.providers[provider.id] = provider;
+
+        provider.on('data', this.onProviderData, this);
+        provider.on('exception', this.onProviderException, this);
+
+
+        if(!provider.isConnected()){
+            provider.connect();
+        }
+
+        return provider;
+    },
+
+    /**
+     * Retrieve a {@link Ext.direct.Provider provider} by the
+     * <b><tt>{@link Ext.direct.Provider#id id}</tt></b> specified when the provider is
+     * {@link #addProvider added}.
+     * @param {String} id Unique identifier assigned to the provider when calling {@link #addProvider}
+     */
+    getProvider : function(id){
+        return this.providers[id];
+    },
+
+    removeProvider : function(id){
+        var provider = id.id ? id : this.providers[id];
+        provider.un('data', this.onProviderData, this);
+        provider.un('exception', this.onProviderException, this);
+        delete this.providers[provider.id];
+        return provider;
+    },
+
+    addTransaction: function(t){
+        this.transactions[t.tid] = t;
+        return t;
+    },
+
+    removeTransaction: function(t){
+        delete this.transactions[t.tid || t];
+        return t;
+    },
+
+    getTransaction: function(tid){
+        return this.transactions[tid.tid || tid];
+    },
+
+    onProviderData : function(provider, e){
+        if(Ext.isArray(e)){
+            for(var i = 0, len = e.length; i < len; i++){
+                this.onProviderData(provider, e[i]);
+            }
+            return;
+        }
+        if(e.name && e.name != 'event' && e.name != 'exception'){
+            this.fireEvent(e.name, e);
+        }else if(e.type == 'exception'){
+            this.fireEvent('exception', e);
+        }
+        this.fireEvent('event', e, provider);
+    },
+
+    createEvent : function(response, extraProps){
+        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));
+    }
+});
+// overwrite impl. with static instance
+Ext.Direct = new Ext.Direct();
+
+Ext.Direct.TID = 1;
+Ext.Direct.PROVIDERS = {};
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/Provider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/Provider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/Provider.js	(revision 76)
@@ -0,0 +1,110 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.direct.Provider
+ * @extends Ext.util.Observable
+ * <p>Ext.direct.Provider is an abstract class meant to be extended.</p>
+ * 
+ * <p>For example ExtJs implements the following subclasses:</p>
+ * <pre><code>
+Provider
+|
++---{@link Ext.direct.JsonProvider JsonProvider} 
+    |
+    +---{@link Ext.direct.PollingProvider PollingProvider}   
+    |
+    +---{@link Ext.direct.RemotingProvider RemotingProvider}   
+ * </code></pre>
+ * @abstract
+ */
+Ext.direct.Provider = Ext.extend(Ext.util.Observable, {    
+    /**
+     * @cfg {String} id
+     * The unique id of the provider (defaults to an {@link Ext#id auto-assigned id}).
+     * You should assign an id if you need to be able to access the provider later and you do
+     * not have an object reference available, for example:
+     * <pre><code>
+Ext.Direct.addProvider(
+    {
+        type: 'polling',
+        url:  'php/poll.php',
+        id:   'poll-provider'
+    }
+);
+     
+var p = {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#getProvider getProvider}('poll-provider');
+p.disconnect();
+     * </code></pre>
+     */
+        
+    /**
+     * @cfg {Number} priority
+     * Priority of the request. Lower is higher priority, <tt>0</tt> means "duplex" (always on).
+     * All Providers default to <tt>1</tt> except for PollingProvider which defaults to <tt>3</tt>.
+     */    
+    priority: 1,
+
+    /**
+     * @cfg {String} type
+     * <b>Required</b>, <tt>undefined</tt> by default.  The <tt>type</tt> of provider specified
+     * to {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#addProvider addProvider} to create a
+     * new Provider. Acceptable values by default are:<div class="mdetail-params"><ul>
+     * <li><b><tt>polling</tt></b> : {@link Ext.direct.PollingProvider PollingProvider}</li>
+     * <li><b><tt>remoting</tt></b> : {@link Ext.direct.RemotingProvider RemotingProvider}</li>
+     * </ul></div>
+     */    
+ 
+    // private
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event connect
+             * Fires when the Provider connects to the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'connect',
+            /**
+             * @event disconnect
+             * Fires when the Provider disconnects from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'disconnect',
+            /**
+             * @event data
+             * Fires when the Provider receives data from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */            
+            'data',
+            /**
+             * @event exception
+             * Fires when the Provider receives an exception from the server-side
+             */                        
+            'exception'
+        );
+        Ext.direct.Provider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns whether or not the server-side is currently connected.
+     * Abstract method for subclasses to implement.
+     */
+    isConnected: function(){
+        return false;
+    },
+
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    connect: Ext.emptyFn,
+    
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    disconnect: Ext.emptyFn
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/PollingProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/PollingProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/PollingProvider.js	(revision 76)
@@ -0,0 +1,151 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.direct.PollingProvider
+ * @extends Ext.direct.JsonProvider
+ *
+ * <p>Provides for repetitive polling of the server at distinct {@link #interval intervals}.
+ * The initial request for data originates from the client, and then is responded to by the
+ * server.</p>
+ * 
+ * <p>All configurations for the PollingProvider should be generated by the server-side
+ * API portion of the Ext.Direct stack.</p>
+ *
+ * <p>An instance of PollingProvider may be created directly via the new keyword or by simply
+ * specifying <tt>type = 'polling'</tt>.  For example:</p>
+ * <pre><code>
+var pollA = new Ext.direct.PollingProvider({
+    type:'polling',
+    url: 'php/pollA.php',
+});
+Ext.Direct.addProvider(pollA);
+pollA.disconnect();
+
+Ext.Direct.addProvider(
+    {
+        type:'polling',
+        url: 'php/pollB.php',
+        id: 'pollB-provider'
+    }
+);
+var pollB = Ext.Direct.getProvider('pollB-provider');
+ * </code></pre>
+ */
+Ext.direct.PollingProvider = Ext.extend(Ext.direct.JsonProvider, {
+    /**
+     * @cfg {Number} priority
+     * Priority of the request (defaults to <tt>3</tt>). See {@link Ext.direct.Provider#priority}.
+     */
+    // override default priority
+    priority: 3,
+    
+    /**
+     * @cfg {Number} interval
+     * How often to poll the server-side in milliseconds (defaults to <tt>3000</tt> - every
+     * 3 seconds).
+     */
+    interval: 3000,
+
+    /**
+     * @cfg {Object} baseParams An object containing properties which are to be sent as parameters
+     * on every polling request
+     */
+    
+    /**
+     * @cfg {String/Function} url
+     * The url which the PollingProvider should contact with each request. This can also be
+     * an imported Ext.Direct method which will accept the baseParams as its only argument.
+     */
+
+    // private
+    constructor : function(config){
+        Ext.direct.PollingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforepoll
+             * Fired immediately before a poll takes place, an event handler can return false
+             * in order to cancel the poll.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'beforepoll',            
+            /**
+             * @event poll
+             * This event has not yet been implemented.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'poll'
+        );
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.pollTask;
+    },
+
+    /**
+     * Connect to the server-side and begin the polling process. To handle each
+     * response subscribe to the data event.
+     */
+    connect: function(){
+        if(this.url && !this.pollTask){
+            this.pollTask = Ext.TaskMgr.start({
+                run: function(){
+                    if(this.fireEvent('beforepoll', this) !== false){
+                        if(typeof this.url == 'function'){
+                            this.url(this.baseParams);
+                        }else{
+                            Ext.Ajax.request({
+                                url: this.url,
+                                callback: this.onData,
+                                scope: this,
+                                params: this.baseParams
+                            });
+                        }
+                    }
+                },
+                interval: this.interval,
+                scope: this
+            });
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing PollingProvider, no url configured.';
+        }
+    },
+
+    /**
+     * Disconnect from the server-side and stop the polling process. The disconnect
+     * event will be fired on a successful disconnect.
+     */
+    disconnect: function(){
+        if(this.pollTask){
+            Ext.TaskMgr.stop(this.pollTask);
+            delete this.pollTask;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    // private
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i];
+                this.fireEvent('data', this, e);
+            }
+        }else{
+            var e = new Ext.Direct.ExceptionEvent({
+                data: e,
+                code: Ext.Direct.exceptions.TRANSPORT,
+                message: 'Unable to connect to the server.',
+                xhr: xhr
+            });
+            this.fireEvent('data', this, e);
+        }
+    }
+});
+
+Ext.Direct.PROVIDERS['polling'] = Ext.direct.PollingProvider;
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/RemotingProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/RemotingProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/RemotingProvider.js	(revision 76)
@@ -0,0 +1,380 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.direct.RemotingProvider
+ * @extends Ext.direct.JsonProvider
+ * 
+ * <p>The {@link Ext.direct.RemotingProvider RemotingProvider} exposes access to
+ * server side methods on the client (a remote procedure call (RPC) type of
+ * connection where the client can initiate a procedure on the server).</p>
+ * 
+ * <p>This allows for code to be organized in a fashion that is maintainable,
+ * while providing a clear path between client and server, something that is
+ * not always apparent when using URLs.</p>
+ * 
+ * <p>To accomplish this the server-side needs to describe what classes and methods
+ * are available on the client-side. This configuration will typically be
+ * outputted by the server-side Ext.Direct stack when the API description is built.</p>
+ */
+Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, {       
+    /**
+     * @cfg {Object} actions
+     * Object literal defining the server side actions and methods. For example, if
+     * the Provider is configured with:
+     * <pre><code>
+"actions":{ // each property within the 'actions' object represents a server side Class 
+    "TestAction":[ // array of methods within each server side Class to be   
+    {              // stubbed out on client
+        "name":"doEcho", 
+        "len":1            
+    },{
+        "name":"multiply",// name of method
+        "len":2           // The number of parameters that will be used to create an
+                          // array of data to send to the server side function.
+                          // Ensure the server sends back a Number, not a String. 
+    },{
+        "name":"doForm",
+        "formHandler":true, // direct the client to use specialized form handling method 
+        "len":1
+    }]
+}
+     * </code></pre>
+     * <p>Note that a Store is not required, a server method can be called at any time.
+     * In the following example a <b>client side</b> handler is used to call the
+     * server side method "multiply" in the server-side "TestAction" Class:</p>
+     * <pre><code>
+TestAction.multiply(
+    2, 4, // pass two arguments to server, so specify len=2
+    // callback function after the server is called
+    // result: the result returned by the server
+    //      e: Ext.Direct.RemotingEvent object
+    function(result, e){
+        var t = e.getTransaction();
+        var action = t.action; // server side Class called
+        var method = t.method; // server side method called
+        if(e.status){
+            var answer = Ext.encode(result); // 8
+    
+        }else{
+            var msg = e.message; // failure message
+        }
+    }
+);
+     * </code></pre>
+     * In the example above, the server side "multiply" function will be passed two
+     * arguments (2 and 4).  The "multiply" method should return the value 8 which will be
+     * available as the <tt>result</tt> in the example above. 
+     */
+    
+    /**
+     * @cfg {String/Object} namespace
+     * Namespace for the Remoting Provider (defaults to the browser global scope of <i>window</i>).
+     * Explicitly specify the namespace Object, or specify a String to have a
+     * {@link Ext#namespace namespace created} implicitly.
+     */
+    
+    /**
+     * @cfg {String} url
+     * <b>Required<b>. The url to connect to the {@link Ext.Direct} server-side router. 
+     */
+    
+    /**
+     * @cfg {String} enableUrlEncode
+     * Specify which param will hold the arguments for the method.
+     * Defaults to <tt>'data'</tt>.
+     */
+    
+    /**
+     * @cfg {Number/Boolean} enableBuffer
+     * <p><tt>true</tt> or <tt>false</tt> to enable or disable combining of method
+     * calls. If a number is specified this is the amount of time in milliseconds
+     * to wait before sending a batched request (defaults to <tt>10</tt>).</p>
+     * <br><p>Calls which are received within the specified timeframe will be
+     * concatenated together and sent in a single request, optimizing the
+     * application by reducing the amount of round trips that have to be made
+     * to the server.</p>
+     */
+    enableBuffer: 10,
+    
+    /**
+     * @cfg {Number} maxRetries
+     * Number of times to re-attempt delivery on failure of a call. Defaults to <tt>1</tt>.
+     */
+    maxRetries: 1,
+    
+    /**
+     * @cfg {Number} timeout
+     * The timeout to use for each request. Defaults to <tt>undefined</tt>.
+     */
+    timeout: undefined,
+
+    constructor : function(config){
+        Ext.direct.RemotingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforecall
+             * Fires immediately before the client-side sends off the RPC call.
+             * By returning false from an event handler you can prevent the call from
+             * executing.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'beforecall',            
+            /**
+             * @event call
+             * Fires immediately after the request to the server-side is sent. This does
+             * NOT fire after the response has come back from the call.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'call'
+        );
+        this.namespace = (Ext.isString(this.namespace)) ? Ext.ns(this.namespace) : this.namespace || window;
+        this.transactions = {};
+        this.callBuffer = [];
+    },
+
+    // private
+    initAPI : function(){
+        var o = this.actions;
+        for(var c in o){
+            var cls = this.namespace[c] || (this.namespace[c] = {}),
+                ms = o[c];
+            for(var i = 0, len = ms.length; i < len; i++){
+                var m = ms[i];
+                cls[m.name] = this.createMethod(c, m);
+            }
+        }
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.connected;
+    },
+
+    connect: function(){
+        if(this.url){
+            this.initAPI();
+            this.connected = true;
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing RemotingProvider, no url configured.';
+        }
+    },
+
+    disconnect: function(){
+        if(this.connected){
+            this.connected = false;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i],
+                    t = this.getTransaction(e);
+                this.fireEvent('data', this, e);
+                if(t){
+                    this.doCallback(t, e, true);
+                    Ext.Direct.removeTransaction(t);
+                }
+            }
+        }else{
+            var ts = [].concat(opt.ts);
+            for(var i = 0, len = ts.length; i < len; i++){
+                var t = this.getTransaction(ts[i]);
+                if(t && t.retryCount < this.maxRetries){
+                    t.retry();
+                }else{
+                    var e = new Ext.Direct.ExceptionEvent({
+                        data: e,
+                        transaction: t,
+                        code: Ext.Direct.exceptions.TRANSPORT,
+                        message: 'Unable to connect to the server.',
+                        xhr: xhr
+                    });
+                    this.fireEvent('data', this, e);
+                    if(t){
+                        this.doCallback(t, e, false);
+                        Ext.Direct.removeTransaction(t);
+                    }
+                }
+            }
+        }
+    },
+
+    getCallData: function(t){
+        return {
+            action: t.action,
+            method: t.method,
+            data: t.data,
+            type: 'rpc',
+            tid: t.tid
+        };
+    },
+
+    doSend : function(data){
+        var o = {
+            url: this.url,
+            callback: this.onData,
+            scope: this,
+            ts: data,
+            timeout: this.timeout
+        }, callData;
+
+        if(Ext.isArray(data)){
+            callData = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                callData.push(this.getCallData(data[i]));
+            }
+        }else{
+            callData = this.getCallData(data);
+        }
+
+        if(this.enableUrlEncode){
+            var params = {};
+            params[Ext.isString(this.enableUrlEncode) ? this.enableUrlEncode : 'data'] = Ext.encode(callData);
+            o.params = params;
+        }else{
+            o.jsonData = callData;
+        }
+        Ext.Ajax.request(o);
+    },
+
+    combineAndSend : function(){
+        var len = this.callBuffer.length;
+        if(len > 0){
+            this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer);
+            this.callBuffer = [];
+        }
+    },
+
+    queueTransaction: function(t){
+        if(t.form){
+            this.processForm(t);
+            return;
+        }
+        this.callBuffer.push(t);
+        if(this.enableBuffer){
+            if(!this.callTask){
+                this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this);
+            }
+            this.callTask.delay(Ext.isNumber(this.enableBuffer) ? this.enableBuffer : 10);
+        }else{
+            this.combineAndSend();
+        }
+    },
+
+    doCall : function(c, m, args){
+        var data = null, hs = args[m.len], scope = args[m.len+1];
+
+        if(m.len !== 0){
+            data = args.slice(0, m.len);
+        }
+
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            args: args,
+            action: c,
+            method: m.name,
+            data: data,
+            cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            this.queueTransaction(t);
+            this.fireEvent('call', this, t, m);
+        }
+    },
+
+    doForm : function(c, m, form, callback, scope){
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            action: c,
+            method: m.name,
+            args:[form, callback, scope],
+            cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback,
+            isForm: true
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data',
+                params = {
+                    extTID: t.tid,
+                    extAction: c,
+                    extMethod: m.name,
+                    extType: 'rpc',
+                    extUpload: String(isUpload)
+                };
+            
+            // change made from typeof callback check to callback.params
+            // to support addl param passing in DirectSubmit EAC 6/2
+            Ext.apply(t, {
+                form: Ext.getDom(form),
+                isUpload: isUpload,
+                params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params
+            });
+            this.fireEvent('call', this, t, m);
+            this.processForm(t);
+        }
+    },
+    
+    processForm: function(t){
+        Ext.Ajax.request({
+            url: this.url,
+            params: t.params,
+            callback: this.onData,
+            scope: this,
+            form: t.form,
+            isUpload: t.isUpload,
+            ts: t
+        });
+    },
+
+    createMethod : function(c, m){
+        var f;
+        if(!m.formHandler){
+            f = function(){
+                this.doCall(c, m, Array.prototype.slice.call(arguments, 0));
+            }.createDelegate(this);
+        }else{
+            f = function(form, callback, scope){
+                this.doForm(c, m, form, callback, scope);
+            }.createDelegate(this);
+        }
+        f.directCfg = {
+            action: c,
+            method: m
+        };
+        return f;
+    },
+
+    getTransaction: function(opt){
+        return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null;
+    },
+
+    doCallback: function(t, e){
+        var fn = e.status ? 'success' : 'failure';
+        if(t && t.cb){
+            var hs = t.cb,
+                result = Ext.isDefined(e.result) ? e.result : e.data;
+            if(Ext.isFunction(hs)){
+                hs(result, e);
+            } else{
+                Ext.callback(hs[fn], hs.scope, [result, e]);
+                Ext.callback(hs.callback, hs.scope, [result, e]);
+            }
+        }
+    }
+});
+Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;
Index: /trunk/workshop-routing-foss4g/web/ext/src/direct/Event.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/direct/Event.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/direct/Event.js	(revision 76)
@@ -0,0 +1,34 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.Direct.Event = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.Direct.Event.prototype = {
+    status: true,
+    getData: function(){
+        return this.data;
+    }
+};
+
+Ext.Direct.RemotingEvent = Ext.extend(Ext.Direct.Event, {
+    type: 'rpc',
+    getTransaction: function(){
+        return this.transaction || Ext.Direct.getTransaction(this.tid);
+    }
+});
+
+Ext.Direct.ExceptionEvent = Ext.extend(Ext.Direct.RemotingEvent, {
+    status: false,
+    type: 'exception'
+});
+
+Ext.Direct.eventTypes = {
+    'rpc':  Ext.Direct.RemotingEvent,
+    'event':  Ext.Direct.Event,
+    'exception':  Ext.Direct.ExceptionEvent
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/error-checking.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/error-checking.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/error-checking.js	(revision 76)
@@ -0,0 +1,364 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+Ext.ns('Ext.debug');
+Ext.debug.Assistant = function(){
+    var enabled = true;
+        
+    return {
+        enable: function(){
+            enabled = true;
+        },
+        
+        disable: function(){
+            enabled = false;
+        },
+        
+        init : function(classes){
+            var klass,
+                intercept = false,
+                fn,
+                method;
+            Ext.each(classes, function(cls){
+                if(this.namespaceExists(cls.name)){
+                    klass = this.getClass(cls.name);
+                    method = cls.instance ? this.addInstanceCheck : this.addPrototypeCheck;
+                    Ext.each(cls.checks, function(check){
+                        intercept = check.intercept == true;
+                        fn = method.call(this, klass, check.name, check.fn, check.intercept == true);
+                        if(check.after){
+                            check.after(fn);
+                        }
+                    }, this);
+                }
+            }, this);  
+        },
+        
+        namespaceExists: function(name){
+            var parent = window,
+                exists = true;
+                
+            Ext.each(name.split('.'), function(n){
+                if(!Ext.isDefined(parent[n])){
+                    exists = false;
+                    return false;
+                }
+                parent = parent[n];
+            });
+            return exists;
+        },
+        
+        getClass : function(name){
+            var parent = window;
+            Ext.each(name.split('.'), function(n){
+                parent = parent[n];
+            });  
+            return parent;
+        },
+        
+        warn: function(){
+            if(enabled && window.console){
+                console.warn.apply(console, arguments);
+            }
+        },
+        
+        error: function(){
+            if(enabled && window.console){
+                console.error.apply(console, arguments);
+            }
+        },
+        
+        addPrototypeCheck : function(cls, method, fn, intercept){
+            return (cls.prototype[method] = cls.prototype[method][intercept ? 'createInterceptor' : 'createSequence'](fn));
+        },
+        
+        addInstanceCheck : function(cls, method, fn, intercept){
+            return (cls[method] = cls[method][intercept ? 'createInterceptor' : 'createSequence'](fn));
+        }
+    };
+}();
+
+(function(){
+    var A = Ext.debug.Assistant,
+        cls = [];
+        
+    cls.push({
+        name: 'Ext.util.Observable',
+        checks: [{
+            name: 'addListener',
+            intercept: true,
+            fn: function(eventName, fn){
+                if(typeof eventName == 'object'){
+                    var ev, o;
+                    for(ev in eventName){
+                        if(!this.filterOptRe.test(ev)){
+                            o = eventName[ev];
+                            o = o && o.fn ? o.fn : o;
+                            if(!Ext.isFunction(o)){
+                                A.error('Non function passed to event listener', this, ev);
+                                return false;
+                            }
+                        }
+                    }
+                }else{
+                    if(!Ext.isFunction(fn)){
+                        A.error('Non function passed to event listener', this, eventName);
+                    }
+                }
+            },
+            after: function(method){
+                Ext.util.Observable.prototype.on = method;
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.Component',
+        checks: [{
+            name: 'render',
+            intercept: true,
+            fn: function(container, position){
+                if(!container && !this.el){
+                    A.error('Unable to render to container', this, container);
+                }
+            
+                if(this.contentEl){
+                    var el = Ext.getDom(this.contentEl);
+                    if(!el){
+                        A.error('Specified contentEl does not exist', this, this.contentEl);
+                        return false;
+                    }
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.Container',
+        checks: [{
+            name: 'onBeforeAdd',
+            intercept: true,
+            fn: function(c){
+                if(c.isDestroyed){
+                    A.warn('Adding destroyed component to container', c, this);
+                }
+                if(c.renderTo){
+                    A.warn('Using renderTo while adding an item to a Container. You should use the add() method or put the item in the items configuration', c, this);
+                }
+                if(c.applyTo){
+                    A.warn('Using applyTo while adding an item to a Container. You should use the add() method or put the item in the items configuration', c, this);
+                }
+                
+                var type = this.layout.type;
+                if(type == 'container' || type == 'auto'){
+                    A.warn('A non sizing layout is being used in a container that has child components. This means the child components will not be sized.', this);
+                }
+            }
+        },{
+            name: 'lookupComponent',
+            intercept: true,
+            fn: function(c){
+                var valid = true;
+                if(Ext.isEmpty(c)){
+                    valid = false;
+                }
+                if(Ext.isString(c)){
+                    c = Ext.ComponentMgr.get(comp);
+                    valid = !Ext.isEmpty(c);
+                }
+                if(!valid){
+                    A.error('Adding invalid component to container', this, c);
+                    return false;
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.DataView',
+        checks: [{
+            name: 'initComponent',
+            fn: function(){
+                if(!this.itemSelector){
+                    A.error('No itemSelector specified', this);
+                }
+            }
+        },{
+            name: 'afterRender',
+            fn: function(){
+                if(!this.store){
+                    A.error('No store attached to DataView', this);
+                } 
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.Window',
+        checks: [{
+            name: 'show',
+            intercept: true,
+            fn: function(){
+                if(this.isDestroyed){
+                    A.error('Trying to show a destroyed window. If you want to reuse the window, look at the closeAction configuration.', this);
+                    return false;
+                } 
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.grid.GridPanel',
+        checks: [{
+            name: 'initComponent',
+            fn: function(){
+                if(!this.colModel){
+                    A.error('No column model specified for grid', this);
+                }
+                if(!this.store){
+                    A.error('No store specified for grid', this);
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.grid.GridView',
+        checks: [{
+            name: 'autoExpand',
+            intercept: true,
+            fn: function(){
+                var g = this.grid, 
+                cm = this.cm;
+                if(!this.userResized && g.autoExpandColumn){
+                    var tw = cm.getTotalWidth(false), 
+                        aw = this.grid.getGridEl().getWidth(true) - this.getScrollOffset();
+                    if(tw != aw){
+                        var ci = cm.getIndexById(g.autoExpandColumn);
+                        if(ci == -1){
+                            A.error('The autoExpandColumn does not exist in the column model', g, g.autoExpandColumn);
+                            return false;
+                        }
+                    }
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.chart.Chart',
+        checks: [{
+            name: 'initComponent',
+            fn: function(){
+                if(!this.store){
+                    A.error('No store specified for chart', this);
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.tree.TreePanel',
+        checks: [{
+            name: 'afterRender',
+            intercept: true,
+            fn: function(){
+                if(!this.root){
+                    A.error('No root node specified for tree', this);
+                    return false;
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext',
+        instance: true,
+        checks: [{
+            name: 'extend',
+            intercept: true,
+            fn: function(){
+                if(arguments.length == 2 && !arguments[0]){
+                    A.error('Invalid base class passed to extend', arguments[0]);
+                    return false;
+                }    
+                if(arguments.length == 3){
+                    if(!arguments[0]){
+                        A.error('Invalid class to extend', arguments[0]);
+                        return false;    
+                    }else if(!arguments[1]){
+                        A.error('Invalid base class passed to extend', arguments[1]);
+                        return false;
+                    }
+                }
+            }
+        },{
+            name: 'override',
+            intercept: true,
+            fn: function(c){
+                if(!c){
+                    A.error('Invalid class passed to override', c);
+                    return false;
+                }
+            }
+        }]    
+    });
+    
+    cls.push({
+        name: 'Ext.ComponentMgr',
+        instance: true,
+        checks: [{
+            name: 'register',
+            intercept: true,
+            fn: function(c){
+                if(this.all.indexOfKey(c.id) > -1){
+                    A.warn('A component with this id already exists', c, c.id);
+                }
+            }
+        },{
+            name: 'create',
+            intercept: true,
+            fn: function(config, defaultType){
+                var types = Ext.ComponentMgr.types;
+                if(!config.render){
+                    if(config.xtype){
+                        if(!types[config.xtype]){
+                            A.error('Unknown xtype specified', config, config.xtype);
+                            return false;
+                        }
+                    }else{
+                        if(!types[defaultType]){
+                            A.error('Unknown defaultType specified', config, defaultType);
+                            return false;
+                        }
+                    }
+                }
+            }
+        }]
+    });
+    
+    cls.push({
+        name: 'Ext.layout.FitLayout',
+        checks: [{
+            name: 'onLayout',
+            intercept: true,
+            fn: function(){
+                var ct = this.container;
+                if(ct.items.getCount() > 1){
+                    A.warn('More than 1 item in the container. A fit layout will only display a single item.', ct);
+                }
+            }
+        }]
+    });
+    
+    if(Ext.BLANK_IMAGE_URL == 'http:/' + '/www.extjs.com/s.gif'){
+        A.warn('You should set the Ext.BLANK_IMAGE_URL to reference a local copy.');
+    }
+    
+    A.init(cls);
+    
+        
+})();
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/Observable-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/Observable-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/Observable-more.js	(revision 76)
@@ -0,0 +1,226 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.Observable
+ */
+Ext.apply(Ext.util.Observable.prototype, function(){
+    // this is considered experimental (along with beforeMethod, afterMethod, removeMethodListener?)
+    // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+    // private
+    function getMethodEvent(method){
+        var e = (this.methodEvents = this.methodEvents ||
+        {})[method], returnValue, v, cancel, obj = this;
+
+        if (!e) {
+            this.methodEvents[method] = e = {};
+            e.originalFn = this[method];
+            e.methodName = method;
+            e.before = [];
+            e.after = [];
+
+            var makeCall = function(fn, scope, args){
+                if((v = fn.apply(scope || obj, args)) !== undefined){
+                    if (typeof v == 'object') {
+                        if(v.returnValue !== undefined){
+                            returnValue = v.returnValue;
+                        }else{
+                            returnValue = v;
+                        }
+                        cancel = !!v.cancel;
+                    }
+                    else
+                        if (v === false) {
+                            cancel = true;
+                        }
+                        else {
+                            returnValue = v;
+                        }
+                }
+            };
+
+            this[method] = function(){
+                var args = Array.prototype.slice.call(arguments, 0),
+                    b;
+                returnValue = v = undefined;
+                cancel = false;
+
+                for(var i = 0, len = e.before.length; i < len; i++){
+                    b = e.before[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+
+                if((v = e.originalFn.apply(obj, args)) !== undefined){
+                    returnValue = v;
+                }
+
+                for(var i = 0, len = e.after.length; i < len; i++){
+                    b = e.after[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+                return returnValue;
+            };
+        }
+        return e;
+    }
+
+    return {
+        // these are considered experimental
+        // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+        // adds an 'interceptor' called before the original method
+        beforeMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).before.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        // adds a 'sequence' called after the original method
+        afterMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).after.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        removeMethodListener: function(method, fn, scope){
+            var e = this.getMethodEvent(method);
+            for(var i = 0, len = e.before.length; i < len; i++){
+                if(e.before[i].fn == fn && e.before[i].scope == scope){
+                    e.before.splice(i, 1);
+                    return;
+                }
+            }
+            for(var i = 0, len = e.after.length; i < len; i++){
+                if(e.after[i].fn == fn && e.after[i].scope == scope){
+                    e.after.splice(i, 1);
+                    return;
+                }
+            }
+        },
+
+        /**
+         * Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.
+         * @param {Object} o The Observable whose events this object is to relay.
+         * @param {Array} events Array of event names to relay.
+         */
+        relayEvents : function(o, events){
+            var me = this;
+            function createHandler(ename){
+                return function(){
+                    return me.fireEvent.apply(me, [ename].concat(Array.prototype.slice.call(arguments, 0)));
+                };
+            }
+            for(var i = 0, len = events.length; i < len; i++){
+                var ename = events[i];
+                me.events[ename] = me.events[ename] || true;
+                o.on(ename, createHandler(ename), me);
+            }
+        },
+
+        /**
+         * <p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
+         * <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
+         * <p>This is commonly used by Ext.Components to bubble events to owner Containers. See {@link Ext.Component.getBubbleTarget}. The default
+         * implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+         * access the required target more quickly.</p>
+         * <p>Example:</p><pre><code>
+Ext.override(Ext.form.Field, {
+    //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
+    initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
+        this.enableBubble('change');
+    }),
+
+    //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
+    getBubbleTarget : function() {
+        if (!this.formPanel) {
+            this.formPanel = this.findParentByType('form');
+        }
+        return this.formPanel;
+    }
+});
+
+var myForm = new Ext.formPanel({
+    title: 'User Details',
+    items: [{
+        ...
+    }],
+    listeners: {
+        change: function() {
+            // Title goes red if form has been modified.
+            myForm.header.setStyle('color', 'red');
+        }
+    }
+});
+</code></pre>
+         * @param {String/Array} events The event name to bubble, or an Array of event names.
+         */
+        enableBubble : function(events){
+            var me = this;
+            if(!Ext.isEmpty(events)){
+                events = Ext.isArray(events) ? events : Array.prototype.slice.call(arguments, 0);
+                for(var i = 0, len = events.length; i < len; i++){
+                    var ename = events[i];
+                    ename = ename.toLowerCase();
+                    var ce = me.events[ename] || true;
+                    if (typeof ce == 'boolean') {
+                        ce = new Ext.util.Event(me, ename);
+                        me.events[ename] = ce;
+                    }
+                    ce.bubble = true;
+                }
+            }
+        }
+    };
+}());
+
+
+/**
+ * Starts capture on the specified Observable. All events will be passed
+ * to the supplied function with the event name + standard signature of the event
+ * <b>before</b> the event is fired. If the supplied function returns false,
+ * the event will not fire.
+ * @param {Observable} o The Observable to capture events from.
+ * @param {Function} fn The function to call when an event is fired.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Observable firing the event.
+ * @static
+ */
+Ext.util.Observable.capture = function(o, fn, scope){
+    o.fireEvent = o.fireEvent.createInterceptor(fn, scope);
+};
+
+
+/**
+ * Sets observability on the passed class constructor.<p>
+ * <p>This makes any event fired on any instance of the passed class also fire a single event through
+ * the <i>class</i> allowing for central handling of events on many instances at once.</p>
+ * <p>Usage:</p><pre><code>
+Ext.util.Observable.observeClass(Ext.data.Connection);
+Ext.data.Connection.on('beforerequest', function(con, options) {
+    console.log('Ajax request made to ' + options.url);
+});</code></pre>
+ * @param {Function} c The class constructor to make observable.
+ * @param {Object} listeners An object containing a series of listeners to add. See {@link #addListener}.
+ * @static
+ */
+Ext.util.Observable.observeClass = function(c, listeners){
+    if(c){
+      if(!c.fireEvent){
+          Ext.apply(c, new Ext.util.Observable());
+          Ext.util.Observable.capture(c.prototype, c.fireEvent, c);
+      }
+      if(typeof listeners == 'object'){
+          c.on(listeners);
+      }
+      return c;
+   }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/Function.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/Function.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/Function.js	(revision 76)
@@ -0,0 +1,240 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.Functions
+ * @singleton
+ */
+Ext.util.Functions = {
+    /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = Ext.createInterceptor(sayHi, function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+       </code></pre>
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor: function(origFn, newFn, scope) { 
+        var method = origFn;
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var me = this,
+                    args = arguments;
+                newFn.target = me;
+                newFn.method = origFn;
+                return (newFn.apply(scope || me || window, args) !== false) ?
+                        origFn.apply(me || window, args) :
+                        null;
+            };
+        }
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>Ext.createDelegate(this.myFunction, this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', Ext.createDelegate(sayHi, btn, ['Fred']));
+       </code></pre>
+     * @param {Function} fn The function to delegate.
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate: function(fn, obj, args, appendArgs) {
+        if (!Ext.isFunction(fn)) {
+            return fn;
+        }
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }
+            else if (Ext.isNumber(appendArgs)) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args);
+                // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs);
+                // splice them in
+            }
+            return fn.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+Ext.defer(sayHi, 2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+Ext.defer(function(){
+    alert('Anonymous');
+}, 100);
+       </code></pre>
+     * @param {Function} fn The function to defer.
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer: function(fn, millis, obj, args, appendArgs) {
+        fn = Ext.util.Functions.createDelegate(fn, obj, args, appendArgs);
+        if (millis > 0) {
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    },
+
+
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * 
+
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = Ext.createSequence(sayHi, function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to sequence
+     * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+     * If omitted, defaults to the scope in which the original function is called or the browser window.
+     * @return {Function} The new function
+     */
+    createSequence: function(origFn, newFn, scope) {
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var retval = origFn.apply(this || window, arguments);
+                newFn.apply(scope || this || window, arguments);
+                return retval;
+            };
+        }
+    }
+};
+
+/**
+ * Shorthand for {@link Ext.util.Functions#defer}   
+ * @param {Function} fn The function to defer.
+ * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Number} The timeout id that can be used with clearTimeout
+ * @member Ext
+ * @method defer
+ */
+
+Ext.defer = Ext.util.Functions.defer;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createInterceptor}   
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to call before the original
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+ * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createInterceptor = Ext.util.Functions.createInterceptor;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createSequence}
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to sequence
+ * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+ * If omitted, defaults to the scope in which the original function is called or the browser window.
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createSequence = Ext.util.Functions.createSequence;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createDelegate}
+ * @param {Function} fn The function to delegate.
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+Ext.createDelegate = Ext.util.Functions.createDelegate;
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/KeyMap.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/KeyMap.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/KeyMap.js	(revision 76)
@@ -0,0 +1,242 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.KeyMap
+ * Handles mapping keys to actions for an element. One key map can be used for multiple actions.
+ * The constructor accepts the same config object as defined by {@link #addBinding}.
+ * If you bind a callback function to a KeyMap, anytime the KeyMap handles an expected key
+ * combination it will call the function with this signature (if the match is a multi-key
+ * combination the callback will still be called only once): (String key, Ext.EventObject e)
+ * A KeyMap can also handle a string representation of keys.<br />
+ * Usage:
+ <pre><code>
+// map one key by key code
+var map = new Ext.KeyMap("my-element", {
+    key: 13, // or Ext.EventObject.ENTER
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to one action by string
+var map = new Ext.KeyMap("my-element", {
+    key: "a\r\n\t",
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to multiple actions by strings and array of codes
+var map = new Ext.KeyMap("my-element", [
+    {
+        key: [10,13],
+        fn: function(){ alert("Return was pressed"); }
+    }, {
+        key: "abc",
+        fn: function(){ alert('a, b or c was pressed'); }
+    }, {
+        key: "\t",
+        ctrl:true,
+        shift:true,
+        fn: function(){ alert('Control + shift + tab was pressed.'); }
+    }
+]);
+</code></pre>
+ * <b>Note: A KeyMap starts enabled</b>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config (see {@link #addBinding})
+ * @param {String} eventName (optional) The event to bind to (defaults to "keydown")
+ */
+Ext.KeyMap = function(el, config, eventName){
+    this.el  = Ext.get(el);
+    this.eventName = eventName || "keydown";
+    this.bindings = [];
+    if(config){
+        this.addBinding(config);
+    }
+    this.enable();
+};
+
+Ext.KeyMap.prototype = {
+    /**
+     * True to stop the event from bubbling and prevent the default browser action if the
+     * key was handled by the KeyMap (defaults to false)
+     * @type Boolean
+     */
+    stopEvent : false,
+
+    /**
+     * Add a new binding to this KeyMap. The following config object properties are supported:
+     * <pre>
+Property    Type             Description
+----------  ---------------  ----------------------------------------------------------------------
+key         String/Array     A single keycode or an array of keycodes to handle
+shift       Boolean          True to handle key only when shift is pressed, False to handle the key only when shift is not pressed (defaults to undefined)
+ctrl        Boolean          True to handle key only when ctrl is pressed, False to handle the key only when ctrl is not pressed (defaults to undefined)
+alt         Boolean          True to handle key only when alt is pressed, False to handle the key only when alt is not pressed (defaults to undefined)
+handler     Function         The function to call when KeyMap finds the expected key combination
+fn          Function         Alias of handler (for backwards-compatibility)
+scope       Object           The scope of the callback function
+stopEvent   Boolean          True to stop the event from bubbling and prevent the default browser action if the key was handled by the KeyMap (defaults to false)
+</pre>
+     *
+     * Usage:
+     * <pre><code>
+// Create a KeyMap
+var map = new Ext.KeyMap(document, {
+    key: Ext.EventObject.ENTER,
+    fn: handleKey,
+    scope: this
+});
+
+//Add a new binding to the existing KeyMap later
+map.addBinding({
+    key: 'abc',
+    shift: true,
+    fn: handleKey,
+    scope: this
+});
+</code></pre>
+     * @param {Object/Array} config A single KeyMap config or an array of configs
+     */
+	addBinding : function(config){
+        if(Ext.isArray(config)){
+            Ext.each(config, function(c){
+                this.addBinding(c);
+            }, this);
+            return;
+        }
+        var keyCode = config.key,
+            fn = config.fn || config.handler,
+            scope = config.scope;
+
+	if (config.stopEvent) {
+	    this.stopEvent = config.stopEvent;    
+	}	
+
+        if(typeof keyCode == "string"){
+            var ks = [];
+            var keyString = keyCode.toUpperCase();
+            for(var j = 0, len = keyString.length; j < len; j++){
+                ks.push(keyString.charCodeAt(j));
+            }
+            keyCode = ks;
+        }
+        var keyArray = Ext.isArray(keyCode);
+        
+        var handler = function(e){
+            if(this.checkModifiers(config, e)){
+                var k = e.getKey();
+                if(keyArray){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          if(this.stopEvent){
+                              e.stopEvent();
+                          }
+                          fn.call(scope || window, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        if(this.stopEvent){
+                           e.stopEvent();
+                        }
+                        fn.call(scope || window, k, e);
+                    }
+                }
+            }
+        };
+        this.bindings.push(handler);
+	},
+    
+    // private
+    checkModifiers: function(config, e){
+        var val, key, keys = ['shift', 'ctrl', 'alt'];
+        for (var i = 0, len = keys.length; i < len; ++i){
+            key = keys[i];
+            val = config[key];
+            if(!(val === undefined || (val === e[key + 'Key']))){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Shorthand for adding a single key listener
+     * @param {Number/Array/Object} key Either the numeric key code, array of key codes or an object with the
+     * following options:
+     * {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    on : function(key, fn, scope){
+        var keyCode, shift, ctrl, alt;
+        if(typeof key == "object" && !Ext.isArray(key)){
+            keyCode = key.key;
+            shift = key.shift;
+            ctrl = key.ctrl;
+            alt = key.alt;
+        }else{
+            keyCode = key;
+        }
+        this.addBinding({
+            key: keyCode,
+            shift: shift,
+            ctrl: ctrl,
+            alt: alt,
+            fn: fn,
+            scope: scope
+        });
+    },
+
+    // private
+    handleKeyDown : function(e){
+	    if(this.enabled){ //just in case
+    	    var b = this.bindings;
+    	    for(var i = 0, len = b.length; i < len; i++){
+    	        b[i].call(this, e);
+    	    }
+	    }
+	},
+
+	/**
+	 * Returns true if this KeyMap is enabled
+	 * @return {Boolean}
+	 */
+	isEnabled : function(){
+	    return this.enabled;
+	},
+
+	/**
+	 * Enables this KeyMap
+	 */
+	enable: function(){
+		if(!this.enabled){
+		    this.el.on(this.eventName, this.handleKeyDown, this);
+		    this.enabled = true;
+		}
+	},
+
+	/**
+	 * Disable this KeyMap
+	 */
+	disable: function(){
+		if(this.enabled){
+		    this.el.removeListener(this.eventName, this.handleKeyDown, this);
+		    this.enabled = false;
+		}
+	},
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/CSS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/CSS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/CSS.js	(revision 76)
@@ -0,0 +1,161 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.CSS
+ * Utility class for manipulating CSS rules
+ * @singleton
+ */
+Ext.util.CSS = function(){
+	var rules = null;
+   	var doc = document;
+
+    var camelRe = /(-[a-z])/gi;
+    var camelFn = function(m, a){ return a.charAt(1).toUpperCase(); };
+
+   return {
+   /**
+    * Creates a stylesheet from a text blob of rules.
+    * These rules will be wrapped in a STYLE tag and appended to the HEAD of the document.
+    * @param {String} cssText The text containing the css rules
+    * @param {String} id An id to add to the stylesheet for later removal
+    * @return {StyleSheet}
+    */
+   createStyleSheet : function(cssText, id){
+       var ss;
+       var head = doc.getElementsByTagName("head")[0];
+       var rules = doc.createElement("style");
+       rules.setAttribute("type", "text/css");
+       if(id){
+           rules.setAttribute("id", id);
+       }
+       if(Ext.isIE){
+           head.appendChild(rules);
+           ss = rules.styleSheet;
+           ss.cssText = cssText;
+       }else{
+           try{
+                rules.appendChild(doc.createTextNode(cssText));
+           }catch(e){
+               rules.cssText = cssText;
+           }
+           head.appendChild(rules);
+           ss = rules.styleSheet ? rules.styleSheet : (rules.sheet || doc.styleSheets[doc.styleSheets.length-1]);
+       }
+       this.cacheStyleSheet(ss);
+       return ss;
+   },
+
+   /**
+    * Removes a style or link tag by id
+    * @param {String} id The id of the tag
+    */
+   removeStyleSheet : function(id){
+       var existing = doc.getElementById(id);
+       if(existing){
+           existing.parentNode.removeChild(existing);
+       }
+   },
+
+   /**
+    * Dynamically swaps an existing stylesheet reference for a new one
+    * @param {String} id The id of an existing link tag to remove
+    * @param {String} url The href of the new stylesheet to include
+    */
+   swapStyleSheet : function(id, url){
+       this.removeStyleSheet(id);
+       var ss = doc.createElement("link");
+       ss.setAttribute("rel", "stylesheet");
+       ss.setAttribute("type", "text/css");
+       ss.setAttribute("id", id);
+       ss.setAttribute("href", url);
+       doc.getElementsByTagName("head")[0].appendChild(ss);
+   },
+   
+   /**
+    * Refresh the rule cache if you have dynamically added stylesheets
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   refreshCache : function(){
+       return this.getRules(true);
+   },
+
+   // private
+   cacheStyleSheet : function(ss){
+       if(!rules){
+           rules = {};
+       }
+       try{// try catch for cross domain access issue
+           var ssRules = ss.cssRules || ss.rules;
+           for(var j = ssRules.length-1; j >= 0; --j){
+               rules[ssRules[j].selectorText.toLowerCase()] = ssRules[j];
+           }
+       }catch(e){}
+   },
+   
+   /**
+    * Gets all css rules for the document
+    * @param {Boolean} refreshCache true to refresh the internal cache
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   getRules : function(refreshCache){
+   		if(rules === null || refreshCache){
+   			rules = {};
+   			var ds = doc.styleSheets;
+   			for(var i =0, len = ds.length; i < len; i++){
+   			    try{
+    		        this.cacheStyleSheet(ds[i]);
+    		    }catch(e){} 
+	        }
+   		}
+   		return rules;
+   	},
+   	
+   	/**
+    * Gets an an individual CSS rule by selector(s)
+    * @param {String/Array} selector The CSS selector or an array of selectors to try. The first selector that is found is returned.
+    * @param {Boolean} refreshCache true to refresh the internal cache if you have recently updated any rules or added styles dynamically
+    * @return {CSSRule} The CSS rule or null if one is not found
+    */
+   getRule : function(selector, refreshCache){
+   		var rs = this.getRules(refreshCache);
+   		if(!Ext.isArray(selector)){
+   		    return rs[selector.toLowerCase()];
+   		}
+   		for(var i = 0; i < selector.length; i++){
+			if(rs[selector[i]]){
+				return rs[selector[i].toLowerCase()];
+			}
+		}
+		return null;
+   	},
+   	
+   	
+   	/**
+    * Updates a rule property
+    * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found.
+    * @param {String} property The css property
+    * @param {String} value The new value for the property
+    * @return {Boolean} true If a rule was found and updated
+    */
+   updateRule : function(selector, property, value){
+   		if(!Ext.isArray(selector)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				rule.style[property.replace(camelRe, camelFn)] = value;
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.updateRule(selector[i], property, value)){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	}
+   };	
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/Format.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/Format.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/Format.js	(revision 76)
@@ -0,0 +1,367 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.Format
+ * Reusable data formatting functions
+ * @singleton
+ */
+Ext.util.Format = function() {
+    var trimRe         = /^\s+|\s+$/g,
+        stripTagsRE    = /<\/?[^>]+>/gi,
+        stripScriptsRe = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+        nl2brRe        = /\r?\n/g;
+
+    return {
+        /**
+         * Truncate a string and add an ellipsis ('...') to the end if it exceeds the specified length
+         * @param {String} value The string to truncate
+         * @param {Number} length The maximum length to allow before truncating
+         * @param {Boolean} word True to try to find a common work break
+         * @return {String} The converted text
+         */
+        ellipsis : function(value, len, word) {
+            if (value && value.length > len) {
+                if (word) {
+                    var vs    = value.substr(0, len - 2),
+                        index = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'));
+                    if (index == -1 || index < (len - 15)) {
+                        return value.substr(0, len - 3) + "...";
+                    } else {
+                        return vs.substr(0, index) + "...";
+                    }
+                } else {
+                    return value.substr(0, len - 3) + "...";
+                }
+            }
+            return value;
+        },
+
+        /**
+         * Checks a reference and converts it to empty string if it is undefined
+         * @param {Mixed} value Reference to check
+         * @return {Mixed} Empty string if converted, otherwise the original value
+         */
+        undef : function(value) {
+            return value !== undefined ? value : "";
+        },
+
+        /**
+         * Checks a reference and converts it to the default value if it's empty
+         * @param {Mixed} value Reference to check
+         * @param {String} defaultValue The value to insert of it's undefined (defaults to "")
+         * @return {String}
+         */
+        defaultValue : function(value, defaultValue) {
+            return value !== undefined && value !== '' ? value : defaultValue;
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') to their HTML character equivalents for literal display in web pages.
+         * @param {String} value The string to encode
+         * @return {String} The encoded text
+         */
+        htmlEncode : function(value) {
+            return !value ? value : String(value).replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') from their HTML character equivalents.
+         * @param {String} value The string to decode
+         * @return {String} The decoded text
+         */
+        htmlDecode : function(value) {
+            return !value ? value : String(value).replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, '"').replace(/&amp;/g, "&");
+        },
+
+        /**
+         * Trims any whitespace from either side of a string
+         * @param {String} value The text to trim
+         * @return {String} The trimmed text
+         */
+        trim : function(value) {
+            return String(value).replace(trimRe, "");
+        },
+
+        /**
+         * Returns a substring from within an original string
+         * @param {String} value The original text
+         * @param {Number} start The start index of the substring
+         * @param {Number} length The length of the substring
+         * @return {String} The substring
+         */
+        substr : function(value, start, length) {
+            return String(value).substr(start, length);
+        },
+
+        /**
+         * Converts a string to all lower case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        lowercase : function(value) {
+            return String(value).toLowerCase();
+        },
+
+        /**
+         * Converts a string to all upper case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        uppercase : function(value) {
+            return String(value).toUpperCase();
+        },
+
+        /**
+         * Converts the first character only of a string to upper case
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        capitalize : function(value) {
+            return !value ? value : value.charAt(0).toUpperCase() + value.substr(1).toLowerCase();
+        },
+
+        // private
+        call : function(value, fn) {
+            if (arguments.length > 2) {
+                var args = Array.prototype.slice.call(arguments, 2);
+                args.unshift(value);
+                return eval(fn).apply(window, args);
+            } else {
+                return eval(fn).call(window, value);
+            }
+        },
+
+        /**
+         * Format a number as US currency
+         * @param {Number/String} value The numeric value to format
+         * @return {String} The formatted currency string
+         */
+        usMoney : function(v) {
+            v = (Math.round((v-0)*100))/100;
+            v = (v == Math.floor(v)) ? v + ".00" : ((v*10 == Math.floor(v*10)) ? v + "0" : v);
+            v = String(v);
+            var ps = v.split('.'),
+                whole = ps[0],
+                sub = ps[1] ? '.'+ ps[1] : '.00',
+                r = /(\d+)(\d{3})/;
+            while (r.test(whole)) {
+                whole = whole.replace(r, '$1' + ',' + '$2');
+            }
+            v = whole + sub;
+            if (v.charAt(0) == '-') {
+                return '-$' + v.substr(1);
+            }
+            return "$" +  v;
+        },
+
+        /**
+         * Parse a value into a formatted date using the specified format pattern.
+         * @param {String/Date} value The value to format (Strings must conform to the format expected by the javascript Date object's <a href="http://www.w3schools.com/jsref/jsref_parse.asp">parse()</a> method)
+         * @param {String} format (optional) Any valid date format string (defaults to 'm/d/Y')
+         * @return {String} The formatted date string
+         */
+        date : function(v, format) {
+            if (!v) {
+                return "";
+            }
+            if (!Ext.isDate(v)) {
+                v = new Date(Date.parse(v));
+            }
+            return v.dateFormat(format || "m/d/Y");
+        },
+
+        /**
+         * Returns a date rendering function that can be reused to apply a date format multiple times efficiently
+         * @param {String} format Any valid date format string
+         * @return {Function} The date formatting function
+         */
+        dateRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.date(v, format);
+            };
+        },
+
+        /**
+         * Strips all HTML tags
+         * @param {Mixed} value The text from which to strip tags
+         * @return {String} The stripped text
+         */
+        stripTags : function(v) {
+            return !v ? v : String(v).replace(stripTagsRE, "");
+        },
+
+        /**
+         * Strips all script tags
+         * @param {Mixed} value The text from which to strip script tags
+         * @return {String} The stripped text
+         */
+        stripScripts : function(v) {
+            return !v ? v : String(v).replace(stripScriptsRe, "");
+        },
+
+        /**
+         * Simple format for a file size (xxx bytes, xxx KB, xxx MB)
+         * @param {Number/String} size The numeric value to format
+         * @return {String} The formatted file size
+         */
+        fileSize : function(size) {
+            if (size < 1024) {
+                return size + " bytes";
+            } else if (size < 1048576) {
+                return (Math.round(((size*10) / 1024))/10) + " KB";
+            } else {
+                return (Math.round(((size*10) / 1048576))/10) + " MB";
+            }
+        },
+
+        /**
+         * It does simple math for use in a template, for example:<pre><code>
+         * var tpl = new Ext.Template('{value} * 10 = {value:math("* 10")}');
+         * </code></pre>
+         * @return {Function} A function that operates on the passed value.
+         */
+        math : function(){
+            var fns = {};
+            
+            return function(v, a){
+                if (!fns[a]) {
+                    fns[a] = new Function('v', 'return v ' + a + ';');
+                }
+                return fns[a](v);
+            };
+        }(),
+
+        /**
+         * Rounds the passed number to the required decimal precision.
+         * @param {Number/String} value The numeric value to round.
+         * @param {Number} precision The number of decimal places to which to round the first parameter's value.
+         * @return {Number} The rounded value.
+         */
+        round : function(value, precision) {
+            var result = Number(value);
+            if (typeof precision == 'number') {
+                precision = Math.pow(10, precision);
+                result = Math.round(value * precision) / precision;
+            }
+            return result;
+        },
+
+        /**
+         * Formats the number according to the format string.
+         * <div style="margin-left:40px">examples (123456.789):
+         * <div style="margin-left:10px">
+         * 0 - (123456) show only digits, no precision<br>
+         * 0.00 - (123456.78) show only digits, 2 precision<br>
+         * 0.0000 - (123456.7890) show only digits, 4 precision<br>
+         * 0,000 - (123,456) show comma and digits, no precision<br>
+         * 0,000.00 - (123,456.78) show comma and digits, 2 precision<br>
+         * 0,0.00 - (123,456.78) shortcut method, show comma and digits, 2 precision<br>
+         * To reverse the grouping (,) and decimal (.) for international numbers, add /i to the end.
+         * For example: 0.000,00/i
+         * </div></div>
+         * @param {Number} v The number to format.
+         * @param {String} format The way you would like to format this text.
+         * @return {String} The formatted number.
+         */
+        number: function(v, format) {
+            if (!format) {
+                return v;
+            }
+            v = Ext.num(v, NaN);
+            if (isNaN(v)) {
+                return '';
+            }
+            var comma = ',',
+                dec   = '.',
+                i18n  = false,
+                neg   = v < 0;
+
+            v = Math.abs(v);
+            if (format.substr(format.length - 2) == '/i') {
+                format = format.substr(0, format.length - 2);
+                i18n   = true;
+                comma  = '.';
+                dec    = ',';
+            }
+
+            var hasComma = format.indexOf(comma) != -1,
+                psplit   = (i18n ? format.replace(/[^\d\,]/g, '') : format.replace(/[^\d\.]/g, '')).split(dec);
+
+            if (1 < psplit.length) {
+                v = v.toFixed(psplit[1].length);
+            } else if(2 < psplit.length) {
+                throw ('NumberFormatException: invalid format, formats should have no more than 1 period: ' + format);
+            } else {
+                v = v.toFixed(0);
+            }
+
+            var fnum = v.toString();
+
+            psplit = fnum.split('.');
+
+            if (hasComma) {
+                var cnum = psplit[0], 
+                    parr = [], 
+                    j    = cnum.length, 
+                    m    = Math.floor(j / 3),
+                    n    = cnum.length % 3 || 3,
+                    i;
+
+                for (i = 0; i < j; i += n) {
+                    if (i != 0) {
+                        n = 3;
+                    }
+                    
+                    parr[parr.length] = cnum.substr(i, n);
+                    m -= 1;
+                }
+                fnum = parr.join(comma);
+                if (psplit[1]) {
+                    fnum += dec + psplit[1];
+                }
+            } else {
+                if (psplit[1]) {
+                    fnum = psplit[0] + dec + psplit[1];
+                }
+            }
+
+            return (neg ? '-' : '') + format.replace(/[\d,?\.?]+/, fnum);
+        },
+
+        /**
+         * Returns a number rendering function that can be reused to apply a number format multiple times efficiently
+         * @param {String} format Any valid number format string for {@link #number}
+         * @return {Function} The number formatting function
+         */
+        numberRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.number(v, format);
+            };
+        },
+
+        /**
+         * Selectively do a plural form of a word based on a numeric value. For example, in a template,
+         * {commentCount:plural("Comment")}  would result in "1 Comment" if commentCount was 1 or would be "x Comments"
+         * if the value is 0 or greater than 1.
+         * @param {Number} value The value to compare against
+         * @param {String} singular The singular form of the word
+         * @param {String} plural (optional) The plural form of the word (defaults to the singular with an "s")
+         */
+        plural : function(v, s, p) {
+            return v +' ' + (v == 1 ? s : (p ? p : s+'s'));
+        },
+
+        /**
+         * Converts newline characters to the HTML tag &lt;br/>
+         * @param {String} The string value to format.
+         * @return {String} The string with embedded &lt;br/> tags in place of newlines.
+         */
+        nl2br : function(v) {
+            return Ext.isEmpty(v) ? '' : v.replace(nl2brRe, '<br/>');
+        }
+    };
+}();
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/TextMetrics.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/TextMetrics.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/TextMetrics.js	(revision 76)
@@ -0,0 +1,136 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.TextMetrics
+ * Provides precise pixel measurements for blocks of text so that you can determine exactly how high and
+ * wide, in pixels, a given block of text will be. Note that when measuring text, it should be plain text and
+ * should not contain any HTML, otherwise it may not be measured correctly.
+ * @singleton
+ */
+Ext.util.TextMetrics = function(){
+    var shared;
+    return {
+        /**
+         * Measures the size of the specified text
+         * @param {String/HTMLElement} el The element, dom node or id from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String} text The text to measure
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        measure : function(el, text, fixedWidth){
+            if(!shared){
+                shared = Ext.util.TextMetrics.Instance(el, fixedWidth);
+            }
+            shared.bind(el);
+            shared.setFixedWidth(fixedWidth || 'auto');
+            return shared.getSize(text);
+        },
+
+        /**
+         * Return a unique TextMetrics instance that can be bound directly to an element and reused.  This reduces
+         * the overhead of multiple calls to initialize the style properties on each measurement.
+         * @param {String/HTMLElement} el The element, dom node or id that the instance will be bound to
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Ext.util.TextMetrics.Instance} instance The new instance
+         */
+        createInstance : function(el, fixedWidth){
+            return Ext.util.TextMetrics.Instance(el, fixedWidth);
+        }
+    };
+}();
+
+Ext.util.TextMetrics.Instance = function(bindTo, fixedWidth){
+    var ml = new Ext.Element(document.createElement('div'));
+    document.body.appendChild(ml.dom);
+    ml.position('absolute');
+    ml.setLeftTop(-1000, -1000);
+    ml.hide();
+
+    if(fixedWidth){
+        ml.setWidth(fixedWidth);
+    }
+
+    var instance = {
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the size of the specified text based on the internal element's style and width properties
+         * @param {String} text The text to measure
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        getSize : function(text){
+            ml.update(text);
+            var s = ml.getSize();
+            ml.update('');
+            return s;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Binds this TextMetrics instance to an element from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String/HTMLElement} el The element, dom node or id
+         */
+        bind : function(el){
+            ml.setStyle(
+                Ext.fly(el).getStyles('font-size','font-style', 'font-weight', 'font-family','line-height', 'text-transform', 'letter-spacing')
+            );
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Sets a fixed width on the internal measurement element.  If the text will be multiline, you have
+         * to set a fixed width in order to accurately measure the text height.
+         * @param {Number} width The width to set on the element
+         */
+        setFixedWidth : function(width){
+            ml.setWidth(width);
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured width of the specified text
+         * @param {String} text The text to measure
+         * @return {Number} width The width in pixels
+         */
+        getWidth : function(text){
+            ml.dom.style.width = 'auto';
+            return this.getSize(text).width;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured height of the specified text.  For multiline text, be sure to call
+         * {@link #setFixedWidth} if necessary.
+         * @param {String} text The text to measure
+         * @return {Number} height The height in pixels
+         */
+        getHeight : function(text){
+            return this.getSize(text).height;
+        }
+    };
+
+    instance.bind(bindTo);
+
+    return instance;
+};
+
+Ext.Element.addMethods({
+    /**
+     * Returns the width in pixels of the passed text, or the width of the text in this Element.
+     * @param {String} text The text to measure. Defaults to the innerHTML of the element.
+     * @param {Number} min (Optional) The minumum value to return.
+     * @param {Number} max (Optional) The maximum value to return.
+     * @return {Number} The text width in pixels.
+     * @member Ext.Element getTextWidth
+     */
+    getTextWidth : function(text, min, max){
+        return (Ext.util.TextMetrics.measure(this.dom, Ext.value(text, this.dom.innerHTML, true)).width).constrain(min || 0, max || 1000000);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/Cookies.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/Cookies.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/Cookies.js	(revision 76)
@@ -0,0 +1,96 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.Cookies
+ * Utility class for managing and interacting with cookies.
+ * @singleton
+ */
+Ext.util.Cookies = {
+    /**
+     * Create a cookie with the specified name and value. Additional settings
+     * for the cookie may be optionally specified (for example: expiration,
+     * access restriction, SSL).
+     * @param {String} name The name of the cookie to set. 
+     * @param {Mixed} value The value to set for the cookie.
+     * @param {Object} expires (Optional) Specify an expiration date the
+     * cookie is to persist until.  Note that the specified Date object will
+     * be converted to Greenwich Mean Time (GMT). 
+     * @param {String} path (Optional) Setting a path on the cookie restricts
+     * access to pages that match that path. Defaults to all pages (<tt>'/'</tt>). 
+     * @param {String} domain (Optional) Setting a domain restricts access to
+     * pages on a given domain (typically used to allow cookie access across
+     * subdomains). For example, "extjs.com" will create a cookie that can be
+     * accessed from any subdomain of extjs.com, including www.extjs.com,
+     * support.extjs.com, etc.
+     * @param {Boolean} secure (Optional) Specify true to indicate that the cookie
+     * should only be accessible via SSL on a page using the HTTPS protocol.
+     * Defaults to <tt>false</tt>. Note that this will only work if the page
+     * calling this code uses the HTTPS protocol, otherwise the cookie will be
+     * created with default options.
+     */
+    set : function(name, value){
+        var argv = arguments;
+        var argc = arguments.length;
+        var expires = (argc > 2) ? argv[2] : null;
+        var path = (argc > 3) ? argv[3] : '/';
+        var domain = (argc > 4) ? argv[4] : null;
+        var secure = (argc > 5) ? argv[5] : false;
+        document.cookie = name + "=" + escape(value) + ((expires === null) ? "" : ("; expires=" + expires.toGMTString())) + ((path === null) ? "" : ("; path=" + path)) + ((domain === null) ? "" : ("; domain=" + domain)) + ((secure === true) ? "; secure" : "");
+    },
+
+    /**
+     * Retrieves cookies that are accessible by the current page. If a cookie
+     * does not exist, <code>get()</code> returns <tt>null</tt>.  The following
+     * example retrieves the cookie called "valid" and stores the String value
+     * in the variable <tt>validStatus</tt>.
+     * <pre><code>
+     * var validStatus = Ext.util.Cookies.get("valid");
+     * </code></pre>
+     * @param {String} name The name of the cookie to get
+     * @return {Mixed} Returns the cookie value for the specified name;
+     * null if the cookie name does not exist.
+     */
+    get : function(name){
+        var arg = name + "=";
+        var alen = arg.length;
+        var clen = document.cookie.length;
+        var i = 0;
+        var j = 0;
+        while(i < clen){
+            j = i + alen;
+            if(document.cookie.substring(i, j) == arg){
+                return Ext.util.Cookies.getCookieVal(j);
+            }
+            i = document.cookie.indexOf(" ", i) + 1;
+            if(i === 0){
+                break;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Removes a cookie with the provided name from the browser
+     * if found by setting its expiration date to sometime in the past. 
+     * @param {String} name The name of the cookie to remove
+     */
+    clear : function(name){
+        if(Ext.util.Cookies.get(name)){
+            document.cookie = name + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
+        }
+    },
+    /**
+     * @private
+     */
+    getCookieVal : function(offset){
+        var endstr = document.cookie.indexOf(";", offset);
+        if(endstr == -1){
+            endstr = document.cookie.length;
+        }
+        return unescape(document.cookie.substring(offset, endstr));
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/ClickRepeater.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/ClickRepeater.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/ClickRepeater.js	(revision 76)
@@ -0,0 +1,214 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ @class Ext.util.ClickRepeater
+ @extends Ext.util.Observable
+
+ A wrapper class which can be applied to any element. Fires a "click" event while the
+ mouse is pressed. The interval between firings may be specified in the config but
+ defaults to 20 milliseconds.
+
+ Optionally, a CSS class may be applied to the element during the time it is pressed.
+
+ @cfg {Mixed} el The element to act as a button.
+ @cfg {Number} delay The initial delay before the repeating event begins firing.
+ Similar to an autorepeat key delay.
+ @cfg {Number} interval The interval between firings of the "click" event. Default 20 ms.
+ @cfg {String} pressClass A CSS class name to be applied to the element while pressed.
+ @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
+           "interval" and "delay" are ignored.
+ @cfg {Boolean} preventDefault True to prevent the default click event
+ @cfg {Boolean} stopDefault True to stop the default click event
+
+ @history
+    2007-02-02 jvs Original code contributed by Nige "Animal" White
+    2007-02-02 jvs Renamed to ClickRepeater
+    2007-02-03 jvs Modifications for FF Mac and Safari
+
+ @constructor
+ @param {Mixed} el The element to listen on
+ @param {Object} config
+ */
+Ext.util.ClickRepeater = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+        this.el.unselectable();
+
+        Ext.apply(this, config);
+
+        this.addEvents(
+        /**
+         * @event mousedown
+         * Fires when the mouse button is depressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mousedown",
+        /**
+         * @event click
+         * Fires on a specified interval during the time the element is pressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "click",
+        /**
+         * @event mouseup
+         * Fires when the mouse key is released.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mouseup"
+        );
+
+        if(!this.disabled){
+            this.disabled = true;
+            this.enable();
+        }
+
+        // allow inline handler
+        if(this.handler){
+            this.on("click", this.handler,  this.scope || this);
+        }
+
+        Ext.util.ClickRepeater.superclass.constructor.call(this);        
+    },
+    
+    interval : 20,
+    delay: 250,
+    preventDefault : true,
+    stopDefault : false,
+    timer : 0,
+
+    /**
+     * Enables the repeater and allows events to fire.
+     */
+    enable: function(){
+        if(this.disabled){
+            this.el.on('mousedown', this.handleMouseDown, this);
+            if (Ext.isIE){
+                this.el.on('dblclick', this.handleDblClick, this);
+            }
+            if(this.preventDefault || this.stopDefault){
+                this.el.on('click', this.eventOptions, this);
+            }
+        }
+        this.disabled = false;
+    },
+
+    /**
+     * Disables the repeater and stops events from firing.
+     */
+    disable: function(/* private */ force){
+        if(force || !this.disabled){
+            clearTimeout(this.timer);
+            if(this.pressClass){
+                this.el.removeClass(this.pressClass);
+            }
+            Ext.getDoc().un('mouseup', this.handleMouseUp, this);
+            this.el.removeAllListeners();
+        }
+        this.disabled = true;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled: function(disabled){
+        this[disabled ? 'disable' : 'enable']();
+    },
+
+    eventOptions: function(e){
+        if(this.preventDefault){
+            e.preventDefault();
+        }
+        if(this.stopDefault){
+            e.stopEvent();
+        }
+    },
+
+    // private
+    destroy : function() {
+        this.disable(true);
+        Ext.destroy(this.el);
+        this.purgeListeners();
+    },
+
+    handleDblClick : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+    },
+
+    // private
+    handleMouseDown : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.mousedownTime = new Date();
+
+        Ext.getDoc().on("mouseup", this.handleMouseUp, this);
+        this.el.on("mouseout", this.handleMouseOut, this);
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+
+        // Do not honor delay or interval if acceleration wanted.
+        if (this.accelerate) {
+            this.delay = 400;
+        }
+        this.timer = this.click.defer(this.delay || this.interval, this, [e]);
+    },
+
+    // private
+    click : function(e){
+        this.fireEvent("click", this, e);
+        this.timer = this.click.defer(this.accelerate ?
+            this.easeOutExpo(this.mousedownTime.getElapsed(),
+                400,
+                -390,
+                12000) :
+            this.interval, this, [e]);
+    },
+
+    easeOutExpo : function (t, b, c, d) {
+        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+    },
+
+    // private
+    handleMouseOut : function(){
+        clearTimeout(this.timer);
+        if(this.pressClass){
+            this.el.removeClass(this.pressClass);
+        }
+        this.el.on("mouseover", this.handleMouseReturn, this);
+    },
+
+    // private
+    handleMouseReturn : function(){
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.click();
+    },
+
+    // private
+    handleMouseUp : function(e){
+        clearTimeout(this.timer);
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        this.el.un("mouseout", this.handleMouseOut, this);
+        Ext.getDoc().un("mouseup", this.handleMouseUp, this);
+        this.el.removeClass(this.pressClass);
+        this.fireEvent("mouseup", this, e);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/Date.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/Date.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/Date.js	(revision 76)
@@ -0,0 +1,1348 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Date
+ *
+ * The date parsing and formatting syntax contains a subset of
+ * <a href="http://www.php.net/date">PHP's date() function</a>, and the formats that are
+ * supported will provide results equivalent to their PHP versions.
+ *
+ * The following is a list of all currently supported formats:
+ * <pre>
+Format  Description                                                               Example returned values
+------  -----------------------------------------------------------------------   -----------------------
+  d     Day of the month, 2 digits with leading zeros                             01 to 31
+  D     A short textual representation of the day of the week                     Mon to Sun
+  j     Day of the month without leading zeros                                    1 to 31
+  l     A full textual representation of the day of the week                      Sunday to Saturday
+  N     ISO-8601 numeric representation of the day of the week                    1 (for Monday) through 7 (for Sunday)
+  S     English ordinal suffix for the day of the month, 2 characters             st, nd, rd or th. Works well with j
+  w     Numeric representation of the day of the week                             0 (for Sunday) to 6 (for Saturday)
+  z     The day of the year (starting from 0)                                     0 to 364 (365 in leap years)
+  W     ISO-8601 week number of year, weeks starting on Monday                    01 to 53
+  F     A full textual representation of a month, such as January or March        January to December
+  m     Numeric representation of a month, with leading zeros                     01 to 12
+  M     A short textual representation of a month                                 Jan to Dec
+  n     Numeric representation of a month, without leading zeros                  1 to 12
+  t     Number of days in the given month                                         28 to 31
+  L     Whether it's a leap year                                                  1 if it is a leap year, 0 otherwise.
+  o     ISO-8601 year number (identical to (Y), but if the ISO week number (W)    Examples: 1998 or 2004
+        belongs to the previous or next year, that year is used instead)
+  Y     A full numeric representation of a year, 4 digits                         Examples: 1999 or 2003
+  y     A two digit representation of a year                                      Examples: 99 or 03
+  a     Lowercase Ante meridiem and Post meridiem                                 am or pm
+  A     Uppercase Ante meridiem and Post meridiem                                 AM or PM
+  g     12-hour format of an hour without leading zeros                           1 to 12
+  G     24-hour format of an hour without leading zeros                           0 to 23
+  h     12-hour format of an hour with leading zeros                              01 to 12
+  H     24-hour format of an hour with leading zeros                              00 to 23
+  i     Minutes, with leading zeros                                               00 to 59
+  s     Seconds, with leading zeros                                               00 to 59
+  u     Decimal fraction of a second                                              Examples:
+        (minimum 1 digit, arbitrary number of digits allowed)                     001 (i.e. 0.001s) or
+                                                                                  100 (i.e. 0.100s) or
+                                                                                  999 (i.e. 0.999s) or
+                                                                                  999876543210 (i.e. 0.999876543210s)
+  O     Difference to Greenwich time (GMT) in hours and minutes                   Example: +1030
+  P     Difference to Greenwich time (GMT) with colon between hours and minutes   Example: -08:00
+  T     Timezone abbreviation of the machine running the code                     Examples: EST, MDT, PDT ...
+  Z     Timezone offset in seconds (negative if west of UTC, positive if east)    -43200 to 50400
+  c     ISO 8601 date
+        Notes:                                                                    Examples:
+        1) If unspecified, the month / day defaults to the current month / day,   1991 or
+           the time defaults to midnight, while the timezone defaults to the      1992-10 or
+           browser's timezone. If a time is specified, it must include both hours 1993-09-20 or
+           and minutes. The "T" delimiter, seconds, milliseconds and timezone     1994-08-19T16:20+01:00 or
+           are optional.                                                          1995-07-18T17:21:28-02:00 or
+        2) The decimal fraction of a second, if specified, must contain at        1996-06-17T18:22:29.98765+03:00 or
+           least 1 digit (there is no limit to the maximum number                 1997-05-16T19:23:30,12345-0400 or
+           of digits allowed), and may be delimited by either a '.' or a ','      1998-04-15T20:24:31.2468Z or
+        Refer to the examples on the right for the various levels of              1999-03-14T20:24:32Z or
+        date-time granularity which are supported, or see                         2000-02-13T21:25:33
+        http://www.w3.org/TR/NOTE-datetime for more info.                         2001-01-12 22:26:34
+  U     Seconds since the Unix Epoch (January 1 1970 00:00:00 GMT)                1193432466 or -2138434463
+  M$    Microsoft AJAX serialized dates                                           \/Date(1238606590509)\/ (i.e. UTC milliseconds since epoch) or
+                                                                                  \/Date(1238606590509+0800)\/
+</pre>
+ *
+ * Example usage (note that you must escape format specifiers with '\\' to render them as character literals):
+ * <pre><code>
+// Sample date:
+// 'Wed Jan 10 2007 15:05:01 GMT-0600 (Central Standard Time)'
+
+var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
+document.write(dt.format('Y-m-d'));                           // 2007-01-10
+document.write(dt.format('F j, Y, g:i a'));                   // January 10, 2007, 3:05 pm
+document.write(dt.format('l, \\t\\he jS \\of F Y h:i:s A'));  // Wednesday, the 10th of January 2007 03:05:01 PM
+</code></pre>
+ *
+ * Here are some standard date/time patterns that you might find helpful.  They
+ * are not part of the source of Date.js, but to use them you can simply copy this
+ * block of code into any script that is included after Date.js and they will also become
+ * globally available on the Date object.  Feel free to add or remove patterns as needed in your code.
+ * <pre><code>
+Date.patterns = {
+    ISO8601Long:"Y-m-d H:i:s",
+    ISO8601Short:"Y-m-d",
+    ShortDate: "n/j/Y",
+    LongDate: "l, F d, Y",
+    FullDateTime: "l, F d, Y g:i:s A",
+    MonthDay: "F d",
+    ShortTime: "g:i A",
+    LongTime: "g:i:s A",
+    SortableDateTime: "Y-m-d\\TH:i:s",
+    UniversalSortableDateTime: "Y-m-d H:i:sO",
+    YearMonth: "F, Y"
+};
+</code></pre>
+ *
+ * Example usage:
+ * <pre><code>
+var dt = new Date();
+document.write(dt.format(Date.patterns.ShortDate));
+</code></pre>
+ * <p>Developer-written, custom formats may be used by supplying both a formatting and a parsing function
+ * which perform to specialized requirements. The functions are stored in {@link #parseFunctions} and {@link #formatFunctions}.</p>
+ */
+
+/*
+ * Most of the date-formatting functions below are the excellent work of Baron Schwartz.
+ * (see http://www.xaprb.com/blog/2005/12/12/javascript-closures-for-runtime-efficiency/)
+ * They generate precompiled functions from format patterns instead of parsing and
+ * processing each pattern every time a date is formatted. These functions are available
+ * on every Date object.
+ */
+
+(function() {
+
+/**
+ * Global flag which determines if strict date parsing should be used.
+ * Strict date parsing will not roll-over invalid dates, which is the
+ * default behaviour of javascript Date objects.
+ * (see {@link #parseDate} for more information)
+ * Defaults to <tt>false</tt>.
+ * @static
+ * @type Boolean
+*/
+Date.useStrict = false;
+
+
+// create private copy of Ext's String.format() method
+// - to remove unnecessary dependency
+// - to resolve namespace conflict with M$-Ajax's implementation
+function xf(format) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return format.replace(/\{(\d+)\}/g, function(m, i) {
+        return args[i];
+    });
+}
+
+
+// private
+Date.formatCodeToRegex = function(character, currentGroup) {
+    // Note: currentGroup - position in regex result array (see notes for Date.parseCodes below)
+    var p = Date.parseCodes[character];
+
+    if (p) {
+      p = typeof p == 'function'? p() : p;
+      Date.parseCodes[character] = p; // reassign function result to prevent repeated execution
+    }
+
+    return p ? Ext.applyIf({
+      c: p.c ? xf(p.c, currentGroup || "{0}") : p.c
+    }, p) : {
+        g:0,
+        c:null,
+        s:Ext.escapeRe(character) // treat unrecognised characters as literals
+    };
+};
+
+// private shorthand for Date.formatCodeToRegex since we'll be using it fairly often
+var $f = Date.formatCodeToRegex;
+
+Ext.apply(Date, {
+    /**
+     * <p>An object hash in which each property is a date parsing function. The property name is the
+     * format string which that function parses.</p>
+     * <p>This object is automatically populated with date parsing functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom parsing functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #parseDate}.<p>
+     * <p>Example:</p><pre><code>
+Date.parseFunctions['x-date-format'] = myDateParser;
+</code></pre>
+     * <p>A parsing function should return a Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : String<div class="sub-desc">The date string to parse.</div></li>
+     * <li><code>strict</code> : Boolean<div class="sub-desc">True to validate date strings while parsing
+     * (i.e. prevent javascript Date "rollover") (The default must be false).
+     * Invalid date strings should return null when parsed.</div></li>
+     * </ul></div></p>
+     * <p>To enable Dates to also be <i>formatted</i> according to that format, a corresponding
+     * formatting function must be placed into the {@link #formatFunctions} property.
+     * @property parseFunctions
+     * @static
+     * @type Object
+     */
+    parseFunctions: {
+        "M$": function(input, strict) {
+            // note: the timezone offset is ignored since the M$ Ajax server sends
+            // a UTC milliseconds-since-Unix-epoch value (negative values are allowed)
+            var re = new RegExp('\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/');
+            var r = (input || '').match(re);
+            return r? new Date(((r[1] || '') + r[2]) * 1) : null;
+        }
+    },
+    parseRegexes: [],
+
+    /**
+     * <p>An object hash in which each property is a date formatting function. The property name is the
+     * format string which corresponds to the produced formatted date string.</p>
+     * <p>This object is automatically populated with date formatting functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom formatting functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #format}. Example:</p><pre><code>
+Date.formatFunctions['x-date-format'] = myDateFormatter;
+</code></pre>
+     * <p>A formatting function should return a string representation of the passed Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : Date<div class="sub-desc">The Date to format.</div></li>
+     * </ul></div></p>
+     * <p>To enable date strings to also be <i>parsed</i> according to that format, a corresponding
+     * parsing function must be placed into the {@link #parseFunctions} property.
+     * @property formatFunctions
+     * @static
+     * @type Object
+     */
+    formatFunctions: {
+        "M$": function() {
+            // UTC milliseconds since Unix epoch (M$-AJAX serialized date format (MRSF))
+            return '\\/Date(' + this.getTime() + ')\\/';
+        }
+    },
+
+    y2kYear : 50,
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MILLI : "ms",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    SECOND : "s",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MINUTE : "mi",
+
+    /** Date interval constant
+     * @static
+     * @type String
+     */
+    HOUR : "h",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    DAY : "d",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MONTH : "mo",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    YEAR : "y",
+
+    /**
+     * <p>An object hash containing default date values used during date parsing.</p>
+     * <p>The following properties are available:<div class="mdetail-params"><ul>
+     * <li><code>y</code> : Number<div class="sub-desc">The default year value. (defaults to undefined)</div></li>
+     * <li><code>m</code> : Number<div class="sub-desc">The default 1-based month value. (defaults to undefined)</div></li>
+     * <li><code>d</code> : Number<div class="sub-desc">The default day value. (defaults to undefined)</div></li>
+     * <li><code>h</code> : Number<div class="sub-desc">The default hour value. (defaults to undefined)</div></li>
+     * <li><code>i</code> : Number<div class="sub-desc">The default minute value. (defaults to undefined)</div></li>
+     * <li><code>s</code> : Number<div class="sub-desc">The default second value. (defaults to undefined)</div></li>
+     * <li><code>ms</code> : Number<div class="sub-desc">The default millisecond value. (defaults to undefined)</div></li>
+     * </ul></div></p>
+     * <p>Override these properties to customize the default date values used by the {@link #parseDate} method.</p>
+     * <p><b>Note: In countries which experience Daylight Saving Time (i.e. DST), the <tt>h</tt>, <tt>i</tt>, <tt>s</tt>
+     * and <tt>ms</tt> properties may coincide with the exact time in which DST takes effect.
+     * It is the responsiblity of the developer to account for this.</b></p>
+     * Example Usage:
+     * <pre><code>
+// set default day value to the first day of the month
+Date.defaults.d = 1;
+
+// parse a February date string containing only year and month values.
+// setting the default day value to 1 prevents weird date rollover issues
+// when attempting to parse the following date string on, for example, March 31st 2009.
+Date.parseDate('2009-02', 'Y-m'); // returns a Date object representing February 1st 2009
+</code></pre>
+     * @property defaults
+     * @static
+     * @type Object
+     */
+    defaults: {},
+
+    /**
+     * An array of textual day names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.dayNames = [
+    'SundayInYourLang',
+    'MondayInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    dayNames : [
+        "Sunday",
+        "Monday",
+        "Tuesday",
+        "Wednesday",
+        "Thursday",
+        "Friday",
+        "Saturday"
+    ],
+
+    /**
+     * An array of textual month names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNames = [
+    'JanInYourLang',
+    'FebInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    monthNames : [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July",
+        "August",
+        "September",
+        "October",
+        "November",
+        "December"
+    ],
+
+    /**
+     * An object hash of zero-based javascript month numbers (with short month names as keys. note: keys are case-sensitive).
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNumbers = {
+    'ShortJanNameInYourLang':0,
+    'ShortFebNameInYourLang':1,
+    ...
+};
+</code></pre>
+     * @type Object
+     * @static
+     */
+    monthNumbers : {
+        Jan:0,
+        Feb:1,
+        Mar:2,
+        Apr:3,
+        May:4,
+        Jun:5,
+        Jul:6,
+        Aug:7,
+        Sep:8,
+        Oct:9,
+        Nov:10,
+        Dec:11
+    },
+
+    /**
+     * Get the short month name for the given month number.
+     * Override this function for international dates.
+     * @param {Number} month A zero-based javascript month number.
+     * @return {String} The short month name.
+     * @static
+     */
+    getShortMonthName : function(month) {
+        return Date.monthNames[month].substring(0, 3);
+    },
+
+    /**
+     * Get the short day name for the given day number.
+     * Override this function for international dates.
+     * @param {Number} day A zero-based javascript day number.
+     * @return {String} The short day name.
+     * @static
+     */
+    getShortDayName : function(day) {
+        return Date.dayNames[day].substring(0, 3);
+    },
+
+    /**
+     * Get the zero-based javascript month number for the given short/full month name.
+     * Override this function for international dates.
+     * @param {String} name The short/full month name.
+     * @return {Number} The zero-based javascript month number.
+     * @static
+     */
+    getMonthNumber : function(name) {
+        // handle camel casing for english month names (since the keys for the Date.monthNumbers hash are case sensitive)
+        return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+    },
+    
+    /**
+     * Checks if the specified format contains hour information
+     * @param {Object} format The format to check
+     * @return {Boolean} True if the format contains hour information
+     * @static
+     */
+    formatContainsHourInfo : (function(){
+        var stripEscapeRe = /(\\.)/g,
+            hourInfoRe = /([gGhHisucUOPZ]|M\$)/;
+        return function(format){
+            return hourInfoRe.test(format.replace(stripEscapeRe, ''));
+        };
+    })(),
+
+    /**
+     * The base format-code to formatting-function hashmap used by the {@link #format} method.
+     * Formatting functions are strings (or functions which return strings) which
+     * will return the appropriate value when evaluated in the context of the Date object
+     * from which the {@link #format} method is called.
+     * Add to / override these mappings for custom date formatting.
+     * Note: Date.format() treats characters as literals if an appropriate mapping cannot be found.
+     * Example:
+     * <pre><code>
+Date.formatCodes.x = "String.leftPad(this.getDate(), 2, '0')";
+(new Date()).format("X"); // returns the current day of the month
+</code></pre>
+     * @type Object
+     * @static
+     */
+    formatCodes : {
+        d: "String.leftPad(this.getDate(), 2, '0')",
+        D: "Date.getShortDayName(this.getDay())", // get localised short day name
+        j: "this.getDate()",
+        l: "Date.dayNames[this.getDay()]",
+        N: "(this.getDay() ? this.getDay() : 7)",
+        S: "this.getSuffix()",
+        w: "this.getDay()",
+        z: "this.getDayOfYear()",
+        W: "String.leftPad(this.getWeekOfYear(), 2, '0')",
+        F: "Date.monthNames[this.getMonth()]",
+        m: "String.leftPad(this.getMonth() + 1, 2, '0')",
+        M: "Date.getShortMonthName(this.getMonth())", // get localised short month name
+        n: "(this.getMonth() + 1)",
+        t: "this.getDaysInMonth()",
+        L: "(this.isLeapYear() ? 1 : 0)",
+        o: "(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",
+        Y: "String.leftPad(this.getFullYear(), 4, '0')",
+        y: "('' + this.getFullYear()).substring(2, 4)",
+        a: "(this.getHours() < 12 ? 'am' : 'pm')",
+        A: "(this.getHours() < 12 ? 'AM' : 'PM')",
+        g: "((this.getHours() % 12) ? this.getHours() % 12 : 12)",
+        G: "this.getHours()",
+        h: "String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",
+        H: "String.leftPad(this.getHours(), 2, '0')",
+        i: "String.leftPad(this.getMinutes(), 2, '0')",
+        s: "String.leftPad(this.getSeconds(), 2, '0')",
+        u: "String.leftPad(this.getMilliseconds(), 3, '0')",
+        O: "this.getGMTOffset()",
+        P: "this.getGMTOffset(true)",
+        T: "this.getTimezone()",
+        Z: "(this.getTimezoneOffset() * -60)",
+
+        c: function() { // ISO-8601 -- GMT format
+            for (var c = "Y-m-dTH:i:sP", code = [], i = 0, l = c.length; i < l; ++i) {
+                var e = c.charAt(i);
+                code.push(e == "T" ? "'T'" : Date.getFormatCode(e)); // treat T as a character literal
+            }
+            return code.join(" + ");
+        },
+        /*
+        c: function() { // ISO-8601 -- UTC format
+            return [
+              "this.getUTCFullYear()", "'-'",
+              "String.leftPad(this.getUTCMonth() + 1, 2, '0')", "'-'",
+              "String.leftPad(this.getUTCDate(), 2, '0')",
+              "'T'",
+              "String.leftPad(this.getUTCHours(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCMinutes(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCSeconds(), 2, '0')",
+              "'Z'"
+            ].join(" + ");
+        },
+        */
+
+        U: "Math.round(this.getTime() / 1000)"
+    },
+
+    /**
+     * Checks if the passed Date parameters will cause a javascript Date "rollover".
+     * @param {Number} year 4-digit year
+     * @param {Number} month 1-based month-of-year
+     * @param {Number} day Day of month
+     * @param {Number} hour (optional) Hour
+     * @param {Number} minute (optional) Minute
+     * @param {Number} second (optional) Second
+     * @param {Number} millisecond (optional) Millisecond
+     * @return {Boolean} true if the passed parameters do not cause a Date "rollover", false otherwise.
+     * @static
+     */
+    isValid : function(y, m, d, h, i, s, ms) {
+        // setup defaults
+        h = h || 0;
+        i = i || 0;
+        s = s || 0;
+        ms = ms || 0;
+
+        // Special handling for year < 100
+        var dt = new Date(y < 100 ? 100 : y, m - 1, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);
+
+        return y == dt.getFullYear() &&
+            m == dt.getMonth() + 1 &&
+            d == dt.getDate() &&
+            h == dt.getHours() &&
+            i == dt.getMinutes() &&
+            s == dt.getSeconds() &&
+            ms == dt.getMilliseconds();
+    },
+
+    /**
+     * Parses the passed string using the specified date format.
+     * Note that this function expects normal calendar dates, meaning that months are 1-based (i.e. 1 = January).
+     * The {@link #defaults} hash will be used for any date value (i.e. year, month, day, hour, minute, second or millisecond)
+     * which cannot be found in the passed string. If a corresponding default date value has not been specified in the {@link #defaults} hash,
+     * the current date's year, month, day or DST-adjusted zero-hour time value will be used instead.
+     * Keep in mind that the input date string must precisely match the specified format string
+     * in order for the parse operation to be successful (failed parse operations return a null value).
+     * <p>Example:</p><pre><code>
+//dt = Fri May 25 2007 (current date)
+var dt = new Date();
+
+//dt = Thu May 25 2006 (today&#39;s month/day in 2006)
+dt = Date.parseDate("2006", "Y");
+
+//dt = Sun Jan 15 2006 (all date parts specified)
+dt = Date.parseDate("2006-01-15", "Y-m-d");
+
+//dt = Sun Jan 15 2006 15:20:01
+dt = Date.parseDate("2006-01-15 3:20:01 PM", "Y-m-d g:i:s A");
+
+// attempt to parse Sun Feb 29 2006 03:20:01 in strict mode
+dt = Date.parseDate("2006-02-29 03:20:01", "Y-m-d H:i:s", true); // returns null
+</code></pre>
+     * @param {String} input The raw date string.
+     * @param {String} format The expected date string format.
+     * @param {Boolean} strict (optional) True to validate date strings while parsing (i.e. prevents javascript Date "rollover")
+                        (defaults to false). Invalid date strings will return null when parsed.
+     * @return {Date} The parsed Date.
+     * @static
+     */
+    parseDate : function(input, format, strict) {
+        var p = Date.parseFunctions;
+        if (p[format] == null) {
+            Date.createParser(format);
+        }
+        return p[format](input, Ext.isDefined(strict) ? strict : Date.useStrict);
+    },
+
+    // private
+    getFormatCode : function(character) {
+        var f = Date.formatCodes[character];
+
+        if (f) {
+          f = typeof f == 'function'? f() : f;
+          Date.formatCodes[character] = f; // reassign function result to prevent repeated execution
+        }
+
+        // note: unknown characters are treated as literals
+        return f || ("'" + String.escape(character) + "'");
+    },
+
+    // private
+    createFormat : function(format) {
+        var code = [],
+            special = false,
+            ch = '';
+
+        for (var i = 0; i < format.length; ++i) {
+            ch = format.charAt(i);
+            if (!special && ch == "\\") {
+                special = true;
+            } else if (special) {
+                special = false;
+                code.push("'" + String.escape(ch) + "'");
+            } else {
+                code.push(Date.getFormatCode(ch));
+            }
+        }
+        Date.formatFunctions[format] = new Function("return " + code.join('+'));
+    },
+
+    // private
+    createParser : function() {
+        var code = [
+            "var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,",
+                "def = Date.defaults,",
+                "results = String(input).match(Date.parseRegexes[{0}]);", // either null, or an array of matched strings
+
+            "if(results){",
+                "{1}",
+
+                "if(u != null){", // i.e. unix time is defined
+                    "v = new Date(u * 1000);", // give top priority to UNIX time
+                "}else{",
+                    // create Date object representing midnight of the current day;
+                    // this will provide us with our date defaults
+                    // (note: clearTime() handles Daylight Saving Time automatically)
+                    "dt = (new Date()).clearTime();",
+
+                    // date calculations (note: these calculations create a dependency on Ext.num())
+                    "y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));",
+                    "m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));",
+                    "d = Ext.num(d, Ext.num(def.d, dt.getDate()));",
+
+                    // time calculations (note: these calculations create a dependency on Ext.num())
+                    "h  = Ext.num(h, Ext.num(def.h, dt.getHours()));",
+                    "i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));",
+                    "s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));",
+                    "ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));",
+
+                    "if(z >= 0 && y >= 0){",
+                        // both the year and zero-based day of year are defined and >= 0.
+                        // these 2 values alone provide sufficient info to create a full date object
+
+                        // create Date object representing January 1st for the given year
+                        // handle years < 100 appropriately
+                        "v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+
+                        // then add day of year, checking for Date "rollover" if necessary
+                        "v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);",
+                    "}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){", // check for Date "rollover"
+                        "v = null;", // invalid date, so return null
+                    "}else{",
+                        // plain old Date object
+                        // handle years < 100 properly
+                        "v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+                    "}",
+                "}",
+            "}",
+
+            "if(v){",
+                // favour UTC offset over GMT offset
+                "if(zz != null){",
+                    // reset to UTC, then add offset
+                    "v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);",
+                "}else if(o){",
+                    // reset to GMT, then add offset
+                    "v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));",
+                "}",
+            "}",
+
+            "return v;"
+        ].join('\n');
+
+        return function(format) {
+            var regexNum = Date.parseRegexes.length,
+                currentGroup = 1,
+                calc = [],
+                regex = [],
+                special = false,
+                ch = "",
+                i = 0,
+                obj,
+                last;
+
+            for (; i < format.length; ++i) {
+                ch = format.charAt(i);
+                if (!special && ch == "\\") {
+                    special = true;
+                } else if (special) {
+                    special = false;
+                    regex.push(String.escape(ch));
+                } else {
+                    obj = $f(ch, currentGroup);
+                    currentGroup += obj.g;
+                    regex.push(obj.s);
+                    if (obj.g && obj.c) {
+                        if (obj.calcLast) {
+                            last = obj.c;
+                        } else {
+                            calc.push(obj.c);
+                        }
+                    }
+                }
+            }
+            
+            if (last) {
+                calc.push(last);
+            }
+
+            Date.parseRegexes[regexNum] = new RegExp("^" + regex.join('') + "$", 'i');
+            Date.parseFunctions[format] = new Function("input", "strict", xf(code, regexNum, calc.join('')));
+        };
+    }(),
+
+    // private
+    parseCodes : {
+        /*
+         * Notes:
+         * g = {Number} calculation group (0 or 1. only group 1 contributes to date calculations.)
+         * c = {String} calculation method (required for group 1. null for group 0. {0} = currentGroup - position in regex result array)
+         * s = {String} regex pattern. all matches are stored in results[], and are accessible by the calculation mapped to 'c'
+         */
+        d: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // day of month with leading zeroes (01 - 31)
+        },
+        j: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // day of month without leading zeroes (1 - 31)
+        },
+        D: function() {
+            for (var a = [], i = 0; i < 7; a.push(Date.getShortDayName(i)), ++i); // get localised short day names
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + a.join("|") +")"
+            };
+        },
+        l: function() {
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + Date.dayNames.join("|") + ")"
+            };
+        },
+        N: {
+            g:0,
+            c:null,
+            s:"[1-7]" // ISO-8601 day number (1 (monday) - 7 (sunday))
+        },
+        S: {
+            g:0,
+            c:null,
+            s:"(?:st|nd|rd|th)"
+        },
+        w: {
+            g:0,
+            c:null,
+            s:"[0-6]" // javascript day number (0 (sunday) - 6 (saturday))
+        },
+        z: {
+            g:1,
+            c:"z = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,3})" // day of the year (0 - 364 (365 in leap years))
+        },
+        W: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // ISO-8601 week number (with leading zero)
+        },
+        F: function() {
+            return {
+                g:1,
+                c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n", // get localised month number
+                s:"(" + Date.monthNames.join("|") + ")"
+            };
+        },
+        M: function() {
+            for (var a = [], i = 0; i < 12; a.push(Date.getShortMonthName(i)), ++i); // get localised short month names
+            return Ext.applyIf({
+                s:"(" + a.join("|") + ")"
+            }, $f("F"));
+        },
+        m: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{2})" // month number with leading zeros (01 - 12)
+        },
+        n: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{1,2})" // month number without leading zeros (1 - 12)
+        },
+        t: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // no. of days in the month (28 - 31)
+        },
+        L: {
+            g:0,
+            c:null,
+            s:"(?:1|0)"
+        },
+        o: function() {
+            return $f("Y");
+        },
+        Y: {
+            g:1,
+            c:"y = parseInt(results[{0}], 10);\n",
+            s:"(\\d{4})" // 4-digit year
+        },
+        y: {
+            g:1,
+            c:"var ty = parseInt(results[{0}], 10);\n"
+                + "y = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n", // 2-digit year
+            s:"(\\d{1,2})"
+        },
+        /**
+         * In the am/pm parsing routines, we allow both upper and lower case 
+         * even though it doesn't exactly match the spec. It gives much more flexibility
+         * in being able to specify case insensitive regexes.
+         */
+        a: function(){
+            return $f("A");
+        },
+        A: {
+            // We need to calculate the hour before we apply AM/PM when parsing
+            calcLast: true,
+            g:1,
+            c:"if (/(am)/i.test(results[{0}])) {\n"
+                + "if (!h || h == 12) { h = 0; }\n"
+                + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
+            s:"(AM|PM|am|pm)"
+        },
+        g: function() {
+            return $f("G");
+        },
+        G: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // 24-hr format of an hour without leading zeroes (0 - 23)
+        },
+        h: function() {
+            return $f("H");
+        },
+        H: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" //  24-hr format of an hour with leading zeroes (00 - 23)
+        },
+        i: {
+            g:1,
+            c:"i = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // minutes with leading zeros (00 - 59)
+        },
+        s: {
+            g:1,
+            c:"s = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // seconds with leading zeros (00 - 59)
+        },
+        u: {
+            g:1,
+            c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",
+            s:"(\\d+)" // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+        },
+        O: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(3,5) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{4})" // GMT offset in hrs and mins
+        },
+        P: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(4,6) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{2}:\\d{2})" // GMT offset in hrs and mins (with colon separator)
+        },
+        T: {
+            g:0,
+            c:null,
+            s:"[A-Z]{1,4}" // timezone abbrev. may be between 1 - 4 chars
+        },
+        Z: {
+            g:1,
+            c:"zz = results[{0}] * 1;\n" // -43200 <= UTC offset <= 50400
+                  + "zz = (-43200 <= zz && zz <= 50400)? zz : null;\n",
+            s:"([+\-]?\\d{1,5})" // leading '+' sign is optional for UTC offset
+        },
+        c: function() {
+            var calc = [],
+                arr = [
+                    $f("Y", 1), // year
+                    $f("m", 2), // month
+                    $f("d", 3), // day
+                    $f("h", 4), // hour
+                    $f("i", 5), // minute
+                    $f("s", 6), // second
+                    {c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"}, // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+                    {c:[ // allow either "Z" (i.e. UTC) or "-0530" or "+08:00" (i.e. UTC offset) timezone delimiters. assumes local timezone if no timezone is specified
+                        "if(results[8]) {", // timezone specified
+                            "if(results[8] == 'Z'){",
+                                "zz = 0;", // UTC
+                            "}else if (results[8].indexOf(':') > -1){",
+                                $f("P", 8).c, // timezone offset with colon separator
+                            "}else{",
+                                $f("O", 8).c, // timezone offset without colon separator
+                            "}",
+                        "}"
+                    ].join('\n')}
+                ];
+
+            for (var i = 0, l = arr.length; i < l; ++i) {
+                calc.push(arr[i].c);
+            }
+
+            return {
+                g:1,
+                c:calc.join(""),
+                s:[
+                    arr[0].s, // year (required)
+                    "(?:", "-", arr[1].s, // month (optional)
+                        "(?:", "-", arr[2].s, // day (optional)
+                            "(?:",
+                                "(?:T| )?", // time delimiter -- either a "T" or a single blank space
+                                arr[3].s, ":", arr[4].s,  // hour AND minute, delimited by a single colon (optional). MUST be preceded by either a "T" or a single blank space
+                                "(?::", arr[5].s, ")?", // seconds (optional)
+                                "(?:(?:\\.|,)(\\d+))?", // decimal fraction of a second (e.g. ",12345" or ".98765") (optional)
+                                "(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?", // "Z" (UTC) or "-0530" (UTC offset without colon delimiter) or "+08:00" (UTC offset with colon delimiter) (optional)
+                            ")?",
+                        ")?",
+                    ")?"
+                ].join("")
+            };
+        },
+        U: {
+            g:1,
+            c:"u = parseInt(results[{0}], 10);\n",
+            s:"(-?\\d+)" // leading minus sign indicates seconds before UNIX epoch
+        }
+    }
+});
+
+}());
+
+Ext.apply(Date.prototype, {
+    // private
+    dateFormat : function(format) {
+        if (Date.formatFunctions[format] == null) {
+            Date.createFormat(format);
+        }
+        return Date.formatFunctions[format].call(this);
+    },
+
+    /**
+     * Get the timezone abbreviation of the current date (equivalent to the format specifier 'T').
+     *
+     * Note: The date string returned by the javascript Date object's toString() method varies
+     * between browsers (e.g. FF vs IE) and system region settings (e.g. IE in Asia vs IE in America).
+     * For a given date string e.g. "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)",
+     * getTimezone() first tries to get the timezone abbreviation from between a pair of parentheses
+     * (which may or may not be present), failing which it proceeds to get the timezone abbreviation
+     * from the GMT offset portion of the date string.
+     * @return {String} The abbreviated timezone name (e.g. 'CST', 'PDT', 'EDT', 'MPST' ...).
+     */
+    getTimezone : function() {
+        // the following list shows the differences between date strings from different browsers on a WinXP SP2 machine from an Asian locale:
+        //
+        // Opera  : "Thu, 25 Oct 2007 22:53:45 GMT+0800" -- shortest (weirdest) date string of the lot
+        // Safari : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone (same as FF)
+        // FF     : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone
+        // IE     : "Thu Oct 25 22:54:35 UTC+0800 2007" -- (Asian system setting) look for 3-4 letter timezone abbrev
+        // IE     : "Thu Oct 25 17:06:37 PDT 2007" -- (American system setting) look for 3-4 letter timezone abbrev
+        //
+        // this crazy regex attempts to guess the correct timezone abbreviation despite these differences.
+        // step 1: (?:\((.*)\) -- find timezone in parentheses
+        // step 2: ([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?) -- if nothing was found in step 1, find timezone from timezone offset portion of date string
+        // step 3: remove all non uppercase characters found in step 1 and 2
+        return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/, "$1$2").replace(/[^A-Z]/g, "");
+    },
+
+    /**
+     * Get the offset from GMT of the current date (equivalent to the format specifier 'O').
+     * @param {Boolean} colon (optional) true to separate the hours and minutes with a colon (defaults to false).
+     * @return {String} The 4-character offset string prefixed with + or - (e.g. '-0600').
+     */
+    getGMTOffset : function(colon) {
+        return (this.getTimezoneOffset() > 0 ? "-" : "+")
+            + String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset()) / 60), 2, "0")
+            + (colon ? ":" : "")
+            + String.leftPad(Math.abs(this.getTimezoneOffset() % 60), 2, "0");
+    },
+
+    /**
+     * Get the numeric day number of the year, adjusted for leap year.
+     * @return {Number} 0 to 364 (365 in leap years).
+     */
+    getDayOfYear: function() {
+        var num = 0,
+            d = this.clone(),
+            m = this.getMonth(),
+            i;
+
+        for (i = 0, d.setDate(1), d.setMonth(0); i < m; d.setMonth(++i)) {
+            num += d.getDaysInMonth();
+        }
+        return num + this.getDate() - 1;
+    },
+
+    /**
+     * Get the numeric ISO-8601 week number of the year.
+     * (equivalent to the format specifier 'W', but without a leading zero).
+     * @return {Number} 1 to 53
+     */
+    getWeekOfYear : function() {
+        // adapted from http://www.merlyn.demon.co.uk/weekcalc.htm
+        var ms1d = 864e5, // milliseconds in a day
+            ms7d = 7 * ms1d; // milliseconds in a week
+
+        return function() { // return a closure so constants get calculated only once
+            var DC3 = Date.UTC(this.getFullYear(), this.getMonth(), this.getDate() + 3) / ms1d, // an Absolute Day Number
+                AWN = Math.floor(DC3 / 7), // an Absolute Week Number
+                Wyr = new Date(AWN * ms7d).getUTCFullYear();
+
+            return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1;
+        };
+    }(),
+
+    /**
+     * Checks if the current date falls within a leap year.
+     * @return {Boolean} True if the current date falls within a leap year, false otherwise.
+     */
+    isLeapYear : function() {
+        var year = this.getFullYear();
+        return !!((year & 3) == 0 && (year % 100 || (year % 400 == 0 && year)));
+    },
+
+    /**
+     * Get the first day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getFirstDayOfMonth()]); //output: 'Monday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getFirstDayOfMonth : function() {
+        var day = (this.getDay() - (this.getDate() - 1)) % 7;
+        return (day < 0) ? (day + 7) : day;
+    },
+
+    /**
+     * Get the last day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getLastDayOfMonth()]); //output: 'Wednesday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getLastDayOfMonth : function() {
+        return this.getLastDateOfMonth().getDay();
+    },
+
+
+    /**
+     * Get the date of the first day of the month in which this date resides.
+     * @return {Date}
+     */
+    getFirstDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), 1);
+    },
+
+    /**
+     * Get the date of the last day of the month in which this date resides.
+     * @return {Date}
+     */
+    getLastDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), this.getDaysInMonth());
+    },
+
+    /**
+     * Get the number of days in the current month, adjusted for leap year.
+     * @return {Number} The number of days in the month.
+     */
+    getDaysInMonth: function() {
+        var daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+
+        return function() { // return a closure for efficiency
+            var m = this.getMonth();
+
+            return m == 1 && this.isLeapYear() ? 29 : daysInMonth[m];
+        };
+    }(),
+
+    /**
+     * Get the English ordinal suffix of the current day (equivalent to the format specifier 'S').
+     * @return {String} 'st, 'nd', 'rd' or 'th'.
+     */
+    getSuffix : function() {
+        switch (this.getDate()) {
+            case 1:
+            case 21:
+            case 31:
+                return "st";
+            case 2:
+            case 22:
+                return "nd";
+            case 3:
+            case 23:
+                return "rd";
+            default:
+                return "th";
+        }
+    },
+
+    /**
+     * Creates and returns a new Date instance with the exact same date value as the called instance.
+     * Dates are copied and passed by reference, so if a copied date variable is modified later, the original
+     * variable will also be changed.  When the intention is to create a new variable that will not
+     * modify the original instance, you should create a clone.
+     *
+     * Example of correctly cloning a date:
+     * <pre><code>
+//wrong way:
+var orig = new Date('10/1/2006');
+var copy = orig;
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 05 2006'!
+
+//correct way:
+var orig = new Date('10/1/2006');
+var copy = orig.clone();
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 01 2006'
+</code></pre>
+     * @return {Date} The new Date instance.
+     */
+    clone : function() {
+        return new Date(this.getTime());
+    },
+
+    /**
+     * Checks if the current date is affected by Daylight Saving Time (DST).
+     * @return {Boolean} True if the current date is affected by DST.
+     */
+    isDST : function() {
+        // adapted from http://extjs.com/forum/showthread.php?p=247172#post247172
+        // courtesy of @geoffrey.mcgill
+        return new Date(this.getFullYear(), 0, 1).getTimezoneOffset() != this.getTimezoneOffset();
+    },
+
+    /**
+     * Attempts to clear all time information from this Date by setting the time to midnight of the same day,
+     * automatically adjusting for Daylight Saving Time (DST) where applicable.
+     * (note: DST timezone information for the browser's host operating system is assumed to be up-to-date)
+     * @param {Boolean} clone true to create a clone of this date, clear the time and return it (defaults to false).
+     * @return {Date} this or the clone.
+     */
+    clearTime : function(clone) {
+        if (clone) {
+            return this.clone().clearTime();
+        }
+
+        // get current date before clearing time
+        var d = this.getDate();
+
+        // clear time
+        this.setHours(0);
+        this.setMinutes(0);
+        this.setSeconds(0);
+        this.setMilliseconds(0);
+
+        if (this.getDate() != d) { // account for DST (i.e. day of month changed when setting hour = 0)
+            // note: DST adjustments are assumed to occur in multiples of 1 hour (this is almost always the case)
+            // refer to http://www.timeanddate.com/time/aboutdst.html for the (rare) exceptions to this rule
+
+            // increment hour until cloned date == current date
+            for (var hr = 1, c = this.add(Date.HOUR, hr); c.getDate() != d; hr++, c = this.add(Date.HOUR, hr));
+
+            this.setDate(d);
+            this.setHours(c.getHours());
+        }
+
+        return this;
+    },
+
+    /**
+     * Provides a convenient method for performing basic date arithmetic. This method
+     * does not modify the Date instance being called - it creates and returns
+     * a new Date instance containing the resulting date value.
+     *
+     * Examples:
+     * <pre><code>
+// Basic usage:
+var dt = new Date('10/29/2006').add(Date.DAY, 5);
+document.write(dt); //returns 'Fri Nov 03 2006 00:00:00'
+
+// Negative values will be subtracted:
+var dt2 = new Date('10/1/2006').add(Date.DAY, -5);
+document.write(dt2); //returns 'Tue Sep 26 2006 00:00:00'
+
+// You can even chain several calls together in one line:
+var dt3 = new Date('10/1/2006').add(Date.DAY, 5).add(Date.HOUR, 8).add(Date.MINUTE, -30);
+document.write(dt3); //returns 'Fri Oct 06 2006 07:30:00'
+</code></pre>
+     *
+     * @param {String} interval A valid date interval enum value.
+     * @param {Number} value The amount to add to the current date.
+     * @return {Date} The new Date instance.
+     */
+    add : function(interval, value) {
+        var d = this.clone();
+        if (!interval || value === 0) return d;
+
+        switch(interval.toLowerCase()) {
+            case Date.MILLI:
+                d.setMilliseconds(this.getMilliseconds() + value);
+                break;
+            case Date.SECOND:
+                d.setSeconds(this.getSeconds() + value);
+                break;
+            case Date.MINUTE:
+                d.setMinutes(this.getMinutes() + value);
+                break;
+            case Date.HOUR:
+                d.setHours(this.getHours() + value);
+                break;
+            case Date.DAY:
+                d.setDate(this.getDate() + value);
+                break;
+            case Date.MONTH:
+                var day = this.getDate();
+                if (day > 28) {
+                    day = Math.min(day, this.getFirstDateOfMonth().add('mo', value).getLastDateOfMonth().getDate());
+                }
+                d.setDate(day);
+                d.setMonth(this.getMonth() + value);
+                break;
+            case Date.YEAR:
+                d.setFullYear(this.getFullYear() + value);
+                break;
+        }
+        return d;
+    },
+
+    /**
+     * Checks if this date falls on or between the given start and end dates.
+     * @param {Date} start Start date
+     * @param {Date} end End date
+     * @return {Boolean} true if this date falls on or between the given start and end dates.
+     */
+    between : function(start, end) {
+        var t = this.getTime();
+        return start.getTime() <= t && t <= end.getTime();
+    }
+});
+
+
+/**
+ * Formats a date given the supplied format string.
+ * @param {String} format The format string.
+ * @return {String} The formatted date.
+ * @method format
+ */
+Date.prototype.format = Date.prototype.dateFormat;
+
+
+// private
+if (Ext.isSafari && (navigator.userAgent.match(/WebKit\/(\d+)/)[1] || NaN) < 420) {
+    Ext.apply(Date.prototype, {
+        _xMonth : Date.prototype.setMonth,
+        _xDate  : Date.prototype.setDate,
+
+        // Bug in Safari 1.3, 2.0 (WebKit build < 420)
+        // Date.setMonth does not work consistently if iMonth is not 0-11
+        setMonth : function(num) {
+            if (num <= -1) {
+                var n = Math.ceil(-num),
+                    back_year = Math.ceil(n / 12),
+                    month = (n % 12) ? 12 - n % 12 : 0;
+
+                this.setFullYear(this.getFullYear() - back_year);
+
+                return this._xMonth(month);
+            } else {
+                return this._xMonth(num);
+            }
+        },
+
+        // Bug in setDate() method (resolved in WebKit build 419.3, so to be safe we target Webkit builds < 420)
+        // The parameter for Date.setDate() is converted to a signed byte integer in Safari
+        // http://brianary.blogspot.com/2006/03/safari-date-bug.html
+        setDate : function(d) {
+            // use setTime() to workaround setDate() bug
+            // subtract current day of month in milliseconds, then add desired day of month in milliseconds
+            return this.setTime(this.getTime() - (this.getDate() - d) * 864e5);
+        }
+    });
+}
+
+
+
+/* Some basic Date tests... (requires Firebug)
+
+Date.parseDate('', 'c'); // call Date.parseDate() once to force computation of regex string so we can console.log() it
+console.log('Insane Regex for "c" format: %o', Date.parseCodes.c.s); // view the insane regex for the "c" format specifier
+
+// standard tests
+console.group('Standard Date.parseDate() Tests');
+    console.log('Date.parseDate("2009-01-05T11:38:56", "c")               = %o', Date.parseDate("2009-01-05T11:38:56", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-02-04T12:37:55.001000", "c")        = %o', Date.parseDate("2009-02-04T12:37:55.001000", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-03-03T13:36:54,101000Z", "c")       = %o', Date.parseDate("2009-03-03T13:36:54,101000Z", "c")); // UTC
+    console.log('Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")   = %o', Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")); // GMT-0530
+    console.log('Date.parseDate("2009-05-01T15:34:52,9876000+08:00", "c") = %o', Date.parseDate("2009-05-01T15:34:52,987600+08:00", "c")); // GMT+08:00
+console.groupEnd();
+
+// ISO-8601 format as specified in http://www.w3.org/TR/NOTE-datetime
+// -- accepts ALL 6 levels of date-time granularity
+console.group('ISO-8601 Granularity Test (see http://www.w3.org/TR/NOTE-datetime)');
+    console.log('Date.parseDate("1997", "c")                              = %o', Date.parseDate("1997", "c")); // YYYY (e.g. 1997)
+    console.log('Date.parseDate("1997-07", "c")                           = %o', Date.parseDate("1997-07", "c")); // YYYY-MM (e.g. 1997-07)
+    console.log('Date.parseDate("1997-07-16", "c")                        = %o', Date.parseDate("1997-07-16", "c")); // YYYY-MM-DD (e.g. 1997-07-16)
+    console.log('Date.parseDate("1997-07-16T19:20+01:00", "c")            = %o', Date.parseDate("1997-07-16T19:20+01:00", "c")); // YYYY-MM-DDThh:mmTZD (e.g. 1997-07-16T19:20+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30+01:00", "c")         = %o', Date.parseDate("1997-07-16T19:20:30+01:00", "c")); // YYYY-MM-DDThh:mm:ssTZD (e.g. 1997-07-16T19:20:30+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")); // YYYY-MM-DDThh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")); // YYYY-MM-DD hh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)= %o', Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)); // strict date parsing with invalid month value
+console.groupEnd();
+
+*/
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/KeyNav.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/KeyNav.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/KeyNav.js	(revision 76)
@@ -0,0 +1,169 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.KeyNav
+ * <p>Provides a convenient wrapper for normalized keyboard navigation.  KeyNav allows you to bind
+ * navigation keys to function calls that will get called when the keys are pressed, providing an easy
+ * way to implement custom navigation schemes for any UI component.</p>
+ * <p>The following are all of the possible keys that can be implemented: enter, left, right, up, down, tab, esc,
+ * pageUp, pageDown, del, home, end.  Usage:</p>
+ <pre><code>
+var nav = new Ext.KeyNav("my-element", {
+    "left" : function(e){
+        this.moveLeft(e.ctrlKey);
+    },
+    "right" : function(e){
+        this.moveRight(e.ctrlKey);
+    },
+    "enter" : function(e){
+        this.save();
+    },
+    scope : this
+});
+</code></pre>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config
+ */
+Ext.KeyNav = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(!this.disabled){
+        this.disabled = true;
+        this.enable();
+    }
+};
+
+Ext.KeyNav.prototype = {
+    /**
+     * @cfg {Boolean} disabled
+     * True to disable this KeyNav instance (defaults to false)
+     */
+    disabled : false,
+    /**
+     * @cfg {String} defaultEventAction
+     * The method to call on the {@link Ext.EventObject} after this KeyNav intercepts a key.  Valid values are
+     * {@link Ext.EventObject#stopEvent}, {@link Ext.EventObject#preventDefault} and
+     * {@link Ext.EventObject#stopPropagation} (defaults to 'stopEvent')
+     */
+    defaultEventAction: "stopEvent",
+    /**
+     * @cfg {Boolean} forceKeyDown
+     * Handle the keydown event instead of keypress (defaults to false).  KeyNav automatically does this for IE since
+     * IE does not propagate special keys on keypress, but setting this to true will force other browsers to also
+     * handle keydown instead of keypress.
+     */
+    forceKeyDown : false,
+
+    // private
+    relay : function(e){
+        var k = e.getKey(),
+            h = this.keyToHandler[k];
+        if(h && this[h]){
+            if(this.doRelay(e, this[h], h) !== true){
+                e[this.defaultEventAction]();
+            }
+        }
+    },
+
+    // private
+    doRelay : function(e, h, hname){
+        return h.call(this.scope || this, e, hname);
+    },
+
+    // possible handlers
+    enter : false,
+    left : false,
+    right : false,
+    up : false,
+    down : false,
+    tab : false,
+    esc : false,
+    pageUp : false,
+    pageDown : false,
+    del : false,
+    home : false,
+    end : false,
+    space : false,
+
+    // quick lookup hash
+    keyToHandler : {
+        37 : "left",
+        39 : "right",
+        38 : "up",
+        40 : "down",
+        33 : "pageUp",
+        34 : "pageDown",
+        46 : "del",
+        36 : "home",
+        35 : "end",
+        13 : "enter",
+        27 : "esc",
+        9  : "tab",
+        32 : "space"
+    },
+    
+    stopKeyUp: function(e) {
+        var k = e.getKey();
+
+        if (k >= 37 && k <= 40) {
+            // *** bugfix - safari 2.x fires 2 keyup events on cursor keys
+            // *** (note: this bugfix sacrifices the "keyup" event originating from keyNav elements in Safari 2)
+            e.stopEvent();
+        }
+    },
+    
+    /**
+     * Destroy this KeyNav (this is the same as calling disable).
+     */
+    destroy: function(){
+        this.disable();    
+    },
+
+	/**
+	 * Enable this KeyNav
+	 */
+	enable: function() {
+        if (this.disabled) {
+            if (Ext.isSafari2) {
+                // call stopKeyUp() on "keyup" event
+                this.el.on('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.on(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = false;
+        }
+    },
+
+	/**
+	 * Disable this KeyNav
+	 */
+	disable: function() {
+        if (!this.disabled) {
+            if (Ext.isSafari2) {
+                // remove "keyup" event handler
+                this.el.un('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.un(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = true;
+        }
+    },
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    },
+    
+    // private
+    isKeydown: function(){
+        return this.forceKeyDown || Ext.EventManager.useKeydown;
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/UpdateManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/UpdateManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/UpdateManager.js	(revision 76)
@@ -0,0 +1,536 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.Updater
+ * @extends Ext.util.Observable
+ * Provides AJAX-style update capabilities for Element objects.  Updater can be used to {@link #update}
+ * an {@link Ext.Element} once, or you can use {@link #startAutoRefresh} to set up an auto-updating
+ * {@link Ext.Element Element} on a specific interval.<br><br>
+ * Usage:<br>
+ * <pre><code>
+ * var el = Ext.get("foo"); // Get Ext.Element object
+ * var mgr = el.getUpdater();
+ * mgr.update({
+        url: "http://myserver.com/index.php",
+        params: {
+            param1: "foo",
+            param2: "bar"
+        }
+ * });
+ * ...
+ * mgr.formUpdate("myFormId", "http://myserver.com/index.php");
+ * <br>
+ * // or directly (returns the same Updater instance)
+ * var mgr = new Ext.Updater("myElementId");
+ * mgr.startAutoRefresh(60, "http://myserver.com/index.php");
+ * mgr.on("update", myFcnNeedsToKnow);
+ * <br>
+ * // short handed call directly from the element object
+ * Ext.get("foo").load({
+        url: "bar.php",
+        scripts: true,
+        params: "param1=foo&amp;param2=bar",
+        text: "Loading Foo..."
+ * });
+ * </code></pre>
+ * @constructor
+ * Create new Updater directly.
+ * @param {Mixed} el The element to update
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if the passed element already
+ * has an Updater and if it does it returns the same instance. This will skip that check (useful for extending this class).
+ */
+Ext.UpdateManager = Ext.Updater = Ext.extend(Ext.util.Observable,
+function() {
+    var BEFOREUPDATE = "beforeupdate",
+        UPDATE = "update",
+        FAILURE = "failure";
+
+    // private
+    function processSuccess(response){
+        var me = this;
+        me.transaction = null;
+        if (response.argument.form && response.argument.reset) {
+            try { // put in try/catch since some older FF releases had problems with this
+                response.argument.form.reset();
+            } catch(e){}
+        }
+        if (me.loadScripts) {
+            me.renderer.render(me.el, response, me,
+               updateComplete.createDelegate(me, [response]));
+        } else {
+            me.renderer.render(me.el, response, me);
+            updateComplete.call(me, response);
+        }
+    }
+
+    // private
+    function updateComplete(response, type, success){
+        this.fireEvent(type || UPDATE, this.el, response);
+        if(Ext.isFunction(response.argument.callback)){
+            response.argument.callback.call(response.argument.scope, this.el, Ext.isEmpty(success) ? true : false, response, response.argument.options);
+        }
+    }
+
+    // private
+    function processFailure(response){
+        updateComplete.call(this, response, FAILURE, !!(this.transaction = null));
+    }
+
+    return {
+        constructor: function(el, forceNew){
+            var me = this;
+            el = Ext.get(el);
+            if(!forceNew && el.updateManager){
+                return el.updateManager;
+            }
+            /**
+             * The Element object
+             * @type Ext.Element
+             */
+            me.el = el;
+            /**
+             * Cached url to use for refreshes. Overwritten every time update() is called unless "discardUrl" param is set to true.
+             * @type String
+             */
+            me.defaultUrl = null;
+
+            me.addEvents(
+                /**
+                 * @event beforeupdate
+                 * Fired before an update is made, return false from your handler and the update is cancelled.
+                 * @param {Ext.Element} el
+                 * @param {String/Object/Function} url
+                 * @param {String/Object} params
+                 */
+                BEFOREUPDATE,
+                /**
+                 * @event update
+                 * Fired after successful update is made.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                UPDATE,
+                /**
+                 * @event failure
+                 * Fired on update failure.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                FAILURE
+            );
+
+            Ext.apply(me, Ext.Updater.defaults);
+            /**
+             * Blank page URL to use with SSL file uploads (defaults to {@link Ext.Updater.defaults#sslBlankUrl}).
+             * @property sslBlankUrl
+             * @type String
+             */
+            /**
+             * Whether to append unique parameter on get request to disable caching (defaults to {@link Ext.Updater.defaults#disableCaching}).
+             * @property disableCaching
+             * @type Boolean
+             */
+            /**
+             * Text for loading indicator (defaults to {@link Ext.Updater.defaults#indicatorText}).
+             * @property indicatorText
+             * @type String
+             */
+            /**
+             * Whether to show indicatorText when loading (defaults to {@link Ext.Updater.defaults#showLoadIndicator}).
+             * @property showLoadIndicator
+             * @type String
+             */
+            /**
+             * Timeout for requests or form posts in seconds (defaults to {@link Ext.Updater.defaults#timeout}).
+             * @property timeout
+             * @type Number
+             */
+            /**
+             * True to process scripts in the output (defaults to {@link Ext.Updater.defaults#loadScripts}).
+             * @property loadScripts
+             * @type Boolean
+             */
+
+            /**
+             * Transaction object of the current executing transaction, or null if there is no active transaction.
+             */
+            me.transaction = null;
+            /**
+             * Delegate for refresh() prebound to "this", use myUpdater.refreshDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.refreshDelegate = me.refresh.createDelegate(me);
+            /**
+             * Delegate for update() prebound to "this", use myUpdater.updateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.updateDelegate = me.update.createDelegate(me);
+            /**
+             * Delegate for formUpdate() prebound to "this", use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.formUpdateDelegate = (me.formUpdate || function(){}).createDelegate(me);
+
+            /**
+             * The renderer for this Updater (defaults to {@link Ext.Updater.BasicRenderer}).
+             */
+            me.renderer = me.renderer || me.getDefaultRenderer();
+
+            Ext.Updater.superclass.constructor.call(me);
+        },
+
+        /**
+         * Sets the content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @param {Object} renderer The object implementing the render() method
+         */
+        setRenderer : function(renderer){
+            this.renderer = renderer;
+        },
+
+        /**
+         * Returns the current content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @return {Object}
+         */
+        getRenderer : function(){
+           return this.renderer;
+        },
+
+        /**
+         * This is an overrideable method which returns a reference to a default
+         * renderer class if none is specified when creating the Ext.Updater.
+         * Defaults to {@link Ext.Updater.BasicRenderer}
+         */
+        getDefaultRenderer: function() {
+            return new Ext.Updater.BasicRenderer();
+        },
+
+        /**
+         * Sets the default URL used for updates.
+         * @param {String/Function} defaultUrl The url or a function to call to get the url
+         */
+        setDefaultUrl : function(defaultUrl){
+            this.defaultUrl = defaultUrl;
+        },
+
+        /**
+         * Get the Element this Updater is bound to
+         * @return {Ext.Element} The element
+         */
+        getEl : function(){
+            return this.el;
+        },
+
+        /**
+         * Performs an <b>asynchronous</b> request, updating this element with the response.
+         * If params are specified it uses POST, otherwise it uses GET.<br><br>
+         * <b>Note:</b> Due to the asynchronous nature of remote server requests, the Element
+         * will not have been fully updated when the function returns. To post-process the returned
+         * data, use the callback option, or an <b><code>update</code></b> event handler.
+         * @param {Object} options A config object containing any of the following options:<ul>
+         * <li>url : <b>String/Function</b><p class="sub-desc">The URL to request or a function which
+         * <i>returns</i> the URL (defaults to the value of {@link Ext.Ajax#url} if not specified).</p></li>
+         * <li>method : <b>String</b><p class="sub-desc">The HTTP method to
+         * use. Defaults to POST if the <code>params</code> argument is present, otherwise GET.</p></li>
+         * <li>params : <b>String/Object/Function</b><p class="sub-desc">The
+         * parameters to pass to the server (defaults to none). These may be specified as a url-encoded
+         * string, or as an object containing properties which represent parameters,
+         * or as a function, which returns such an object.</p></li>
+         * <li>scripts : <b>Boolean</b><p class="sub-desc">If <code>true</code>
+         * any &lt;script&gt; tags embedded in the response text will be extracted
+         * and executed (defaults to {@link Ext.Updater.defaults#loadScripts}). If this option is specified,
+         * the callback will be called <i>after</i> the execution of the scripts.</p></li>
+         * <li>callback : <b>Function</b><p class="sub-desc">A function to
+         * be called when the response from the server arrives. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li>
+         * <li><b>options</b> : Object<p class="sub-desc">The config object passed to the update call.</p></li></ul>
+         * </p></li>
+         * <li>scope : <b>Object</b><p class="sub-desc">The scope in which
+         * to execute the callback (The callback's <code>this</code> reference.) If the
+         * <code>params</code> argument is a function, this scope is used for that function also.</p></li>
+         * <li>discardUrl : <b>Boolean</b><p class="sub-desc">By default, the URL of this request becomes
+         * the default URL for this Updater object, and will be subsequently used in {@link #refresh}
+         * calls.  To bypass this behavior, pass <code>discardUrl:true</code> (defaults to false).</p></li>
+         * <li>timeout : <b>Number</b><p class="sub-desc">The number of seconds to wait for a response before
+         * timing out (defaults to {@link Ext.Updater.defaults#timeout}).</p></li>
+         * <li>text : <b>String</b><p class="sub-desc">The text to use as the innerHTML of the
+         * {@link Ext.Updater.defaults#indicatorText} div (defaults to 'Loading...').  To replace the entire div, not
+         * just the text, override {@link Ext.Updater.defaults#indicatorText} directly.</p></li>
+         * <li>nocache : <b>Boolean</b><p class="sub-desc">Only needed for GET
+         * requests, this option causes an extra, auto-generated parameter to be appended to the request
+         * to defeat caching (defaults to {@link Ext.Updater.defaults#disableCaching}).</p></li></ul>
+         * <p>
+         * For example:
+    <pre><code>
+    um.update({
+        url: "your-url.php",
+        params: {param1: "foo", param2: "bar"}, // or a URL encoded string
+        callback: yourFunction,
+        scope: yourObject, //(optional scope)
+        discardUrl: true,
+        nocache: true,
+        text: "Loading...",
+        timeout: 60,
+        scripts: false // Save time by avoiding RegExp execution.
+    });
+    </code></pre>
+         */
+        update : function(url, params, callback, discardUrl){
+            var me = this,
+                cfg,
+                callerScope;
+
+            if(me.fireEvent(BEFOREUPDATE, me.el, url, params) !== false){
+                if(Ext.isObject(url)){ // must be config object
+                    cfg = url;
+                    url = cfg.url;
+                    params = params || cfg.params;
+                    callback = callback || cfg.callback;
+                    discardUrl = discardUrl || cfg.discardUrl;
+                    callerScope = cfg.scope;
+                    if(!Ext.isEmpty(cfg.nocache)){me.disableCaching = cfg.nocache;};
+                    if(!Ext.isEmpty(cfg.text)){me.indicatorText = '<div class="loading-indicator">'+cfg.text+"</div>";};
+                    if(!Ext.isEmpty(cfg.scripts)){me.loadScripts = cfg.scripts;};
+                    if(!Ext.isEmpty(cfg.timeout)){me.timeout = cfg.timeout;};
+                }
+                me.showLoading();
+
+                if(!discardUrl){
+                    me.defaultUrl = url;
+                }
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+
+                var o = Ext.apply({}, {
+                    url : url,
+                    params: (Ext.isFunction(params) && callerScope) ? params.createDelegate(callerScope) : params,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    callback: undefined,
+                    timeout: (me.timeout*1000),
+                    disableCaching: me.disableCaching,
+                    argument: {
+                        "options": cfg,
+                        "url": url,
+                        "form": null,
+                        "callback": callback,
+                        "scope": callerScope || window,
+                        "params": params
+                    }
+                }, cfg);
+
+                me.transaction = Ext.Ajax.request(o);
+            }
+        },
+
+        /**
+         * <p>Performs an asynchronous form post, updating this element with the response. If the form has the attribute
+         * enctype="<a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>", it assumes it's a file upload.
+         * Uses this.sslBlankUrl for SSL file uploads to prevent IE security warning.</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <code>&lt;form></code> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <code>&lt;iframe></code> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>Be aware that file upload packets, sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * @param {String/HTMLElement} form The form Id or form element
+         * @param {String} url (optional) The url to pass the form to. If omitted the action attribute on the form will be used.
+         * @param {Boolean} reset (optional) Whether to try to reset the form after the update
+         * @param {Function} callback (optional) Callback when transaction is complete. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li></ul>
+         */
+        formUpdate : function(form, url, reset, callback){
+            var me = this;
+            if(me.fireEvent(BEFOREUPDATE, me.el, form, url) !== false){
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+                form = Ext.getDom(form);
+                me.transaction = Ext.Ajax.request({
+                    form: form,
+                    url:url,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    timeout: (me.timeout*1000),
+                    argument: {
+                        "url": url,
+                        "form": form,
+                        "callback": callback,
+                        "reset": reset
+                    }
+                });
+                me.showLoading.defer(1, me);
+            }
+        },
+
+        /**
+         * Set this element to auto refresh.  Can be canceled by calling {@link #stopAutoRefresh}.
+         * @param {Number} interval How often to update (in seconds).
+         * @param {String/Object/Function} url (optional) The url for this request, a config object in the same format
+         * supported by {@link #load}, or a function to call to get the url (defaults to the last used url).  Note that while
+         * the url used in a load call can be reused by this method, other load config options will not be reused and must be
+         * sepcified as part of a config object passed as this paramter if needed.
+         * @param {String/Object} params (optional) The parameters to pass as either a url encoded string
+         * "&param1=1&param2=2" or as an object {param1: 1, param2: 2}
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         * @param {Boolean} refreshNow (optional) Whether to execute the refresh now, or wait the interval
+         */
+        startAutoRefresh : function(interval, url, params, callback, refreshNow){
+            var me = this;
+            if(refreshNow){
+                me.update(url || me.defaultUrl, params, callback, true);
+            }
+            if(me.autoRefreshProcId){
+                clearInterval(me.autoRefreshProcId);
+            }
+            me.autoRefreshProcId = setInterval(me.update.createDelegate(me, [url || me.defaultUrl, params, callback, true]), interval * 1000);
+        },
+
+        /**
+         * Stop auto refresh on this element.
+         */
+        stopAutoRefresh : function(){
+            if(this.autoRefreshProcId){
+                clearInterval(this.autoRefreshProcId);
+                delete this.autoRefreshProcId;
+            }
+        },
+
+        /**
+         * Returns true if the Updater is currently set to auto refresh its content (see {@link #startAutoRefresh}), otherwise false.
+         */
+        isAutoRefreshing : function(){
+           return !!this.autoRefreshProcId;
+        },
+
+        /**
+         * Display the element's "loading" state. By default, the element is updated with {@link #indicatorText}. This
+         * method may be overridden to perform a custom action while this Updater is actively updating its contents.
+         */
+        showLoading : function(){
+            if(this.showLoadIndicator){
+                this.el.dom.innerHTML = this.indicatorText;
+            }
+        },
+
+        /**
+         * Aborts the currently executing transaction, if any.
+         */
+        abort : function(){
+            if(this.transaction){
+                Ext.Ajax.abort(this.transaction);
+            }
+        },
+
+        /**
+         * Returns true if an update is in progress, otherwise false.
+         * @return {Boolean}
+         */
+        isUpdating : function(){
+            return this.transaction ? Ext.Ajax.isLoading(this.transaction) : false;
+        },
+
+        /**
+         * Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         */
+        refresh : function(callback){
+            if(this.defaultUrl){
+                this.update(this.defaultUrl, null, callback, true);
+            }
+        }
+    };
+}());
+
+/**
+ * @class Ext.Updater.defaults
+ * The defaults collection enables customizing the default properties of Updater
+ */
+Ext.Updater.defaults = {
+   /**
+     * Timeout for requests or form posts in seconds (defaults to 30 seconds).
+     * @type Number
+     */
+    timeout : 30,
+    /**
+     * True to append a unique parameter to GET requests to disable caching (defaults to false).
+     * @type Boolean
+     */
+    disableCaching : false,
+    /**
+     * Whether or not to show {@link #indicatorText} during loading (defaults to true).
+     * @type Boolean
+     */
+    showLoadIndicator : true,
+    /**
+     * Text for loading indicator (defaults to '&lt;div class="loading-indicator"&gt;Loading...&lt;/div&gt;').
+     * @type String
+     */
+    indicatorText : '<div class="loading-indicator">Loading...</div>',
+     /**
+     * True to process scripts by default (defaults to false).
+     * @type Boolean
+     */
+    loadScripts : false,
+    /**
+    * Blank page URL to use with SSL file uploads (defaults to {@link Ext#SSL_SECURE_URL} if set, or "javascript:false").
+    * @type String
+    */
+    sslBlankUrl : Ext.SSL_SECURE_URL
+};
+
+
+/**
+ * Static convenience method. <b>This method is deprecated in favor of el.load({url:'foo.php', ...})</b>.
+ * Usage:
+ * <pre><code>Ext.Updater.updateElement("my-div", "stuff.php");</code></pre>
+ * @param {Mixed} el The element to update
+ * @param {String} url The url
+ * @param {String/Object} params (optional) Url encoded param string or an object of name/value pairs
+ * @param {Object} options (optional) A config object with any of the Updater properties you want to set - for
+ * example: {disableCaching:true, indicatorText: "Loading data..."}
+ * @static
+ * @deprecated
+ * @member Ext.Updater
+ */
+Ext.Updater.updateElement = function(el, url, params, options){
+    var um = Ext.get(el).getUpdater();
+    Ext.apply(um, options);
+    um.update(url, params, options ? options.callback : null);
+};
+
+/**
+ * @class Ext.Updater.BasicRenderer
+ * <p>This class is a base class implementing a simple render method which updates an element using results from an Ajax request.</p>
+ * <p>The BasicRenderer updates the element's innerHTML with the responseText. To perform a custom render (i.e. XML or JSON processing),
+ * create an object with a conforming {@link #render} method and pass it to setRenderer on the Updater.</p>
+ */
+Ext.Updater.BasicRenderer = function(){};
+
+Ext.Updater.BasicRenderer.prototype = {
+    /**
+     * This method is called when an Ajax response is received, and an Element needs updating.
+     * @param {Ext.Element} el The element being rendered
+     * @param {Object} xhr The XMLHttpRequest object
+     * @param {Updater} updateManager The calling update manager
+     * @param {Function} callback A callback that will need to be called if loadScripts is true on the Updater
+     */
+     render : function(el, response, updateManager, callback){
+        el.update(response.responseText, updateManager.loadScripts, callback);
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/AbstractManager.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/AbstractManager.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/AbstractManager.js	(revision 76)
@@ -0,0 +1,112 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.AbstractManager
+ * @extends Object
+ * Base Manager class - extended by ComponentMgr and PluginMgr
+ */
+Ext.AbstractManager = Ext.extend(Object, {
+    typeName: 'type',
+    
+    constructor: function(config) {
+        Ext.apply(this, config || {});
+        
+        /**
+         * Contains all of the items currently managed
+         * @property all
+         * @type Ext.util.MixedCollection
+         */
+        this.all = new Ext.util.MixedCollection();
+        
+        this.types = {};
+    },
+    
+    /**
+     * Returns a component by {@link Ext.Component#id id}.
+     * For additional details see {@link Ext.util.MixedCollection#get}.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+     * Class was found.
+     */
+    get : function(id){
+        return this.all.get(id);
+    },
+    
+    /**
+     * Registers an item to be managed
+     * @param {Mixed} item The item to register
+     */
+    register: function(item) {
+        this.all.add(item);
+    },
+    
+    /**
+     * Unregisters a component by removing it from this manager
+     * @param {Mixed} item The item to unregister
+     */
+    unregister: function(item) {
+        this.all.remove(item);        
+    },
+    
+    /**
+     * <p>Registers a new Component constructor, keyed by a new
+     * {@link Ext.Component#xtype}.</p>
+     * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+     * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+     * child Components.
+     * see {@link Ext.Container#items}</p>
+     * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+     * @param {Constructor} cls The new Component class.
+     */
+    registerType : function(type, cls){
+        this.types[type] = cls;
+        cls[this.typeName] = type;
+    },
+    
+    /**
+     * Checks if a Component type is registered.
+     * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+     * @return {Boolean} Whether the type is registered.
+     */
+    isRegistered : function(type){
+        return this.types[type] !== undefined;    
+    },
+    
+    /**
+     * Creates and returns an instance of whatever this manager manages, based on the supplied type and config object
+     * @param {Object} config The config object
+     * @param {String} defaultType If no type is discovered in the config object, we fall back to this type
+     * @return {Mixed} The instance of whatever this manager is managing
+     */
+    create: function(config, defaultType) {
+        var type        = config[this.typeName] || config.type || defaultType,
+            Constructor = this.types[type];
+        
+        if (Constructor == undefined) {
+            throw new Error(String.format("The '{0}' type has not been registered with this manager", type));
+        }
+        
+        return new Constructor(config);
+    },
+    
+    /**
+     * Registers a function that will be called when a Component with the specified id is added to the manager. This will happen on instantiation.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @param {Function} fn The callback function
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+     */
+    onAvailable : function(id, fn, scope){
+        var all = this.all;
+        
+        all.on("add", function(index, o){
+            if (o.id == id) {
+                fn.call(scope || o, o);
+                all.un("add", fn, scope);
+            }
+        });
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/History.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/History.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/History.js	(revision 76)
@@ -0,0 +1,221 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.History
+ * @extends Ext.util.Observable
+ * History management component that allows you to register arbitrary tokens that signify application
+ * history state on navigation actions.  You can then handle the history {@link #change} event in order
+ * to reset your application UI to the appropriate state when the user navigates forward or backward through
+ * the browser history stack.
+ * @singleton
+ */
+Ext.History = (function () {
+    var iframe, hiddenField;
+    var ready = false;
+    var currentToken;
+
+    function getHash() {
+        var href = location.href, i = href.indexOf("#"),
+            hash = i >= 0 ? href.substr(i + 1) : null;
+             
+        if (Ext.isGecko) {
+            hash = decodeURIComponent(hash);
+        }
+        return hash;
+    }
+
+    function doSave() {
+        hiddenField.value = currentToken;
+    }
+
+    function handleStateChange(token) {
+        currentToken = token;
+        Ext.History.fireEvent('change', token);
+    }
+
+    function updateIFrame (token) {
+        var html = ['<html><body><div id="state">',Ext.util.Format.htmlEncode(token),'</div></body></html>'].join('');
+        try {
+            var doc = iframe.contentWindow.document;
+            doc.open();
+            doc.write(html);
+            doc.close();
+            return true;
+        } catch (e) {
+            return false;
+        }
+    }
+
+    function checkIFrame() {
+        if (!iframe.contentWindow || !iframe.contentWindow.document) {
+            setTimeout(checkIFrame, 10);
+            return;
+        }
+
+        var doc = iframe.contentWindow.document;
+        var elem = doc.getElementById("state");
+        var token = elem ? elem.innerText : null;
+
+        var hash = getHash();
+
+        setInterval(function () {
+
+            doc = iframe.contentWindow.document;
+            elem = doc.getElementById("state");
+
+            var newtoken = elem ? elem.innerText : null;
+
+            var newHash = getHash();
+
+            if (newtoken !== token) {
+                token = newtoken;
+                handleStateChange(token);
+                location.hash = token;
+                hash = token;
+                doSave();
+            } else if (newHash !== hash) {
+                hash = newHash;
+                updateIFrame(newHash);
+            }
+
+        }, 50);
+
+        ready = true;
+
+        Ext.History.fireEvent('ready', Ext.History);
+    }
+
+    function startUp() {
+        currentToken = hiddenField.value ? hiddenField.value : getHash();
+
+        if (Ext.isIE) {
+            checkIFrame();
+        } else {
+            var hash = getHash();
+            setInterval(function () {
+                var newHash = getHash();
+                if (newHash !== hash) {
+                    hash = newHash;
+                    handleStateChange(hash);
+                    doSave();
+                }
+            }, 50);
+            ready = true;
+            Ext.History.fireEvent('ready', Ext.History);
+        }
+    }
+
+    return {
+        /**
+         * The id of the hidden field required for storing the current history token.
+         * @type String
+         * @property
+         */
+        fieldId: 'x-history-field',
+        /**
+         * The id of the iframe required by IE to manage the history stack.
+         * @type String
+         * @property
+         */
+        iframeId: 'x-history-frame',
+
+        events:{},
+
+        /**
+         * Initialize the global History instance.
+         * @param {Boolean} onReady (optional) A callback function that will be called once the history
+         * component is fully initialized.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser window.
+         */
+        init: function (onReady, scope) {
+            if(ready) {
+                Ext.callback(onReady, scope, [this]);
+                return;
+            }
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.History.init(onReady, scope);
+                });
+                return;
+            }
+            hiddenField = Ext.getDom(Ext.History.fieldId);
+            if (Ext.isIE) {
+                iframe = Ext.getDom(Ext.History.iframeId);
+            }
+            this.addEvents(
+                /**
+                 * @event ready
+                 * Fires when the Ext.History singleton has been initialized and is ready for use.
+                 * @param {Ext.History} The Ext.History singleton.
+                 */
+                'ready',
+                /**
+                 * @event change
+                 * Fires when navigation back or forwards within the local page's history occurs.
+                 * @param {String} token An identifier associated with the page state at that point in its history.
+                 */
+                'change'
+            );
+            if(onReady){
+                this.on('ready', onReady, scope, {single:true});
+            }
+            startUp();
+        },
+
+        /**
+         * Add a new token to the history stack. This can be any arbitrary value, although it would
+         * commonly be the concatenation of a component id and another id marking the specifc history
+         * state of that component.  Example usage:
+         * <pre><code>
+// Handle tab changes on a TabPanel
+tabPanel.on('tabchange', function(tabPanel, tab){
+    Ext.History.add(tabPanel.id + ':' + tab.id);
+});
+</code></pre>
+         * @param {String} token The value that defines a particular application-specific history state
+         * @param {Boolean} preventDuplicates When true, if the passed token matches the current token
+         * it will not save a new history step. Set to false if the same state can be saved more than once
+         * at the same history stack location (defaults to true).
+         */
+        add: function (token, preventDup) {
+            if(preventDup !== false){
+                if(this.getToken() == token){
+                    return true;
+                }
+            }
+            if (Ext.isIE) {
+                return updateIFrame(token);
+            } else {
+                location.hash = token;
+                return true;
+            }
+        },
+
+        /**
+         * Programmatically steps back one step in browser history (equivalent to the user pressing the Back button).
+         */
+        back: function(){
+            history.go(-1);
+        },
+
+        /**
+         * Programmatically steps forward one step in browser history (equivalent to the user pressing the Forward button).
+         */
+        forward: function(){
+            history.go(1);
+        },
+
+        /**
+         * Retrieves the currently-active history token.
+         * @return {String} The token
+         */
+        getToken: function() {
+            return ready ? currentToken : getHash();
+        }
+    };
+})();
+Ext.apply(Ext.History, new Ext.util.Observable());
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/MixedCollection.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/MixedCollection.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/MixedCollection.js	(revision 76)
@@ -0,0 +1,670 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.util.MixedCollection
+ * @extends Ext.util.Observable
+ * A Collection class that maintains both numeric indexes and keys and exposes events.
+ * @constructor
+ * @param {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+ * function should add function references to the collection. Defaults to
+ * <tt>false</tt>.
+ * @param {Function} keyFn A function that can accept an item of the type(s) stored in this MixedCollection
+ * and return the key value for that item.  This is used when available to look up the key on items that
+ * were passed without an explicit key parameter to a MixedCollection method.  Passing this parameter is
+ * equivalent to providing an implementation for the {@link #getKey} method.
+ */
+Ext.util.MixedCollection = function(allowFunctions, keyFn){
+    this.items = [];
+    this.map = {};
+    this.keys = [];
+    this.length = 0;
+    this.addEvents(
+        /**
+         * @event clear
+         * Fires when the collection is cleared.
+         */
+        'clear',
+        /**
+         * @event add
+         * Fires when an item is added to the collection.
+         * @param {Number} index The index at which the item was added.
+         * @param {Object} o The item added.
+         * @param {String} key The key associated with the added item.
+         */
+        'add',
+        /**
+         * @event replace
+         * Fires when an item is replaced in the collection.
+         * @param {String} key he key associated with the new added.
+         * @param {Object} old The item being replaced.
+         * @param {Object} new The new item.
+         */
+        'replace',
+        /**
+         * @event remove
+         * Fires when an item is removed from the collection.
+         * @param {Object} o The item being removed.
+         * @param {String} key (optional) The key associated with the removed item.
+         */
+        'remove',
+        'sort'
+    );
+    this.allowFunctions = allowFunctions === true;
+    if(keyFn){
+        this.getKey = keyFn;
+    }
+    Ext.util.MixedCollection.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
+
+    /**
+     * @cfg {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+     * function should add function references to the collection. Defaults to
+     * <tt>false</tt>.
+     */
+    allowFunctions : false,
+
+    /**
+     * Adds an item to the collection. Fires the {@link #add} event when complete.
+     * @param {String} key <p>The key to associate with the item, or the new item.</p>
+     * <p>If a {@link #getKey} implementation was specified for this MixedCollection,
+     * or if the key of the stored items is in a property called <tt><b>id</b></tt>,
+     * the MixedCollection will be able to <i>derive</i> the key for the new item.
+     * In this case just pass the new item in this parameter.</p>
+     * @param {Object} o The item to add.
+     * @return {Object} The item added.
+     */
+    add : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        if(typeof key != 'undefined' && key !== null){
+            var old = this.map[key];
+            if(typeof old != 'undefined'){
+                return this.replace(key, o);
+            }
+            this.map[key] = o;
+        }
+        this.length++;
+        this.items.push(o);
+        this.keys.push(key);
+        this.fireEvent('add', this.length-1, o, key);
+        return o;
+    },
+
+    /**
+      * MixedCollection has a generic way to fetch keys if you implement getKey.  The default implementation
+      * simply returns <b><code>item.id</code></b> but you can provide your own implementation
+      * to return a different value as in the following examples:<pre><code>
+// normal way
+var mc = new Ext.util.MixedCollection();
+mc.add(someEl.dom.id, someEl);
+mc.add(otherEl.dom.id, otherEl);
+//and so on
+
+// using getKey
+var mc = new Ext.util.MixedCollection();
+mc.getKey = function(el){
+   return el.dom.id;
+};
+mc.add(someEl);
+mc.add(otherEl);
+
+// or via the constructor
+var mc = new Ext.util.MixedCollection(false, function(el){
+   return el.dom.id;
+});
+mc.add(someEl);
+mc.add(otherEl);
+     * </code></pre>
+     * @param {Object} item The item for which to find the key.
+     * @return {Object} The key for the passed item.
+     */
+    getKey : function(o){
+         return o.id;
+    },
+
+    /**
+     * Replaces an item in the collection. Fires the {@link #replace} event when complete.
+     * @param {String} key <p>The key associated with the item to replace, or the replacement item.</p>
+     * <p>If you supplied a {@link #getKey} implementation for this MixedCollection, or if the key
+     * of your stored items is in a property called <tt><b>id</b></tt>, then the MixedCollection
+     * will be able to <i>derive</i> the key of the replacement item. If you want to replace an item
+     * with one having the same key value, then just pass the replacement item in this parameter.</p>
+     * @param o {Object} o (optional) If the first parameter passed was a key, the item to associate
+     * with that key.
+     * @return {Object}  The new item.
+     */
+    replace : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        var old = this.map[key];
+        if(typeof key == 'undefined' || key === null || typeof old == 'undefined'){
+             return this.add(key, o);
+        }
+        var index = this.indexOfKey(key);
+        this.items[index] = o;
+        this.map[key] = o;
+        this.fireEvent('replace', key, old, o);
+        return o;
+    },
+
+    /**
+     * Adds all elements of an Array or an Object to the collection.
+     * @param {Object/Array} objs An Object containing properties which will be added
+     * to the collection, or an Array of values, each of which are added to the collection.
+     * Functions references will be added to the collection if <code>{@link #allowFunctions}</code>
+     * has been set to <tt>true</tt>.
+     */
+    addAll : function(objs){
+        if(arguments.length > 1 || Ext.isArray(objs)){
+            var args = arguments.length > 1 ? arguments : objs;
+            for(var i = 0, len = args.length; i < len; i++){
+                this.add(args[i]);
+            }
+        }else{
+            for(var key in objs){
+                if(this.allowFunctions || typeof objs[key] != 'function'){
+                    this.add(key, objs[key]);
+                }
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every item in the collection, passing the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><b>item</b> : Mixed<p class="sub-desc">The collection item</p></li>
+     * <li><b>index</b> : Number<p class="sub-desc">The item's index</p></li>
+     * <li><b>length</b> : Number<p class="sub-desc">The total number of items in the collection</p></li>
+     * </ul></div>
+     * The function should return a boolean value. Returning false from the function will stop the iteration.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current item in the iteration.
+     */
+    each : function(fn, scope){
+        var items = [].concat(this.items); // each safe for removal
+        for(var i = 0, len = items.length; i < len; i++){
+            if(fn.call(scope || items[i], items[i], i, len) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every key in the collection, passing each
+     * key, and its associated item as the first two parameters.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    eachKey : function(fn, scope){
+        for(var i = 0, len = this.keys.length; i < len; i++){
+            fn.call(scope || window, this.keys[i], this.items[i], i, len);
+        }
+    },
+
+    /**
+     * Returns the first item in the collection which elicits a true return value from the
+     * passed selection function.
+     * @param {Function} fn The selection function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     * @return {Object} The first item in the collection which returned true from the selection function.
+     */
+    find : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            if(fn.call(scope || window, this.items[i], this.keys[i])){
+                return this.items[i];
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Inserts an item at the specified index in the collection. Fires the {@link #add} event when complete.
+     * @param {Number} index The index to insert the item at.
+     * @param {String} key The key to associate with the new item, or the item itself.
+     * @param {Object} o (optional) If the second parameter was a key, the new item.
+     * @return {Object} The item inserted.
+     */
+    insert : function(index, key, o){
+        if(arguments.length == 2){
+            o = arguments[1];
+            key = this.getKey(o);
+        }
+        if(this.containsKey(key)){
+            this.suspendEvents();
+            this.removeKey(key);
+            this.resumeEvents();
+        }
+        if(index >= this.length){
+            return this.add(key, o);
+        }
+        this.length++;
+        this.items.splice(index, 0, o);
+        if(typeof key != 'undefined' && key !== null){
+            this.map[key] = o;
+        }
+        this.keys.splice(index, 0, key);
+        this.fireEvent('add', index, o, key);
+        return o;
+    },
+
+    /**
+     * Remove an item from the collection.
+     * @param {Object} o The item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    remove : function(o){
+        return this.removeAt(this.indexOf(o));
+    },
+
+    /**
+     * Remove an item from a specified index in the collection. Fires the {@link #remove} event when complete.
+     * @param {Number} index The index within the collection of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeAt : function(index){
+        if(index < this.length && index >= 0){
+            this.length--;
+            var o = this.items[index];
+            this.items.splice(index, 1);
+            var key = this.keys[index];
+            if(typeof key != 'undefined'){
+                delete this.map[key];
+            }
+            this.keys.splice(index, 1);
+            this.fireEvent('remove', o, key);
+            return o;
+        }
+        return false;
+    },
+
+    /**
+     * Removed an item associated with the passed key fom the collection.
+     * @param {String} key The key of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeKey : function(key){
+        return this.removeAt(this.indexOfKey(key));
+    },
+
+    /**
+     * Returns the number of items in the collection.
+     * @return {Number} the number of items in the collection.
+     */
+    getCount : function(){
+        return this.length;
+    },
+
+    /**
+     * Returns index within the collection of the passed Object.
+     * @param {Object} o The item to find the index of.
+     * @return {Number} index of the item. Returns -1 if not found.
+     */
+    indexOf : function(o){
+        return this.items.indexOf(o);
+    },
+
+    /**
+     * Returns index within the collection of the passed key.
+     * @param {String} key The key to find the index of.
+     * @return {Number} index of the key.
+     */
+    indexOfKey : function(key){
+        return this.keys.indexOf(key);
+    },
+
+    /**
+     * Returns the item associated with the passed key OR index.
+     * Key has priority over index.  This is the equivalent
+     * of calling {@link #key} first, then if nothing matched calling {@link #itemAt}.
+     * @param {String/Number} key The key or index of the item.
+     * @return {Object} If the item is found, returns the item.  If the item was not found, returns <tt>undefined</tt>.
+     * If an item was found, but is a Class, returns <tt>null</tt>.
+     */
+    item : function(key){
+        var mk = this.map[key],
+            item = mk !== undefined ? mk : (typeof key == 'number') ? this.items[key] : undefined;
+        return typeof item != 'function' || this.allowFunctions ? item : null; // for prototype!
+    },
+
+    /**
+     * Returns the item at the specified index.
+     * @param {Number} index The index of the item.
+     * @return {Object} The item at the specified index.
+     */
+    itemAt : function(index){
+        return this.items[index];
+    },
+
+    /**
+     * Returns the item associated with the passed key.
+     * @param {String/Number} key The key of the item.
+     * @return {Object} The item associated with the passed key.
+     */
+    key : function(key){
+        return this.map[key];
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as an item.
+     * @param {Object} o  The Object to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as an item.
+     */
+    contains : function(o){
+        return this.indexOf(o) != -1;
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as a key.
+     * @param {String} key The key to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as a key.
+     */
+    containsKey : function(key){
+        return typeof this.map[key] != 'undefined';
+    },
+
+    /**
+     * Removes all items from the collection.  Fires the {@link #clear} event when complete.
+     */
+    clear : function(){
+        this.length = 0;
+        this.items = [];
+        this.keys = [];
+        this.map = {};
+        this.fireEvent('clear');
+    },
+
+    /**
+     * Returns the first item in the collection.
+     * @return {Object} the first item in the collection..
+     */
+    first : function(){
+        return this.items[0];
+    },
+
+    /**
+     * Returns the last item in the collection.
+     * @return {Object} the last item in the collection..
+     */
+    last : function(){
+        return this.items[this.length-1];
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting based on a direction and a sorting function. Internally,
+     * this creates a temporary array of all items in the MixedCollection, sorts it and then writes
+     * the sorted array data back into this.items and this.keys
+     * @param {String} property Property to sort by ('key', 'value', or 'index')
+     * @param {String} dir (optional) Direction to sort 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    _sort : function(property, dir, fn){
+        var i, len,
+            dsc   = String(dir).toUpperCase() == 'DESC' ? -1 : 1,
+
+            //this is a temporary array used to apply the sorting function
+            c     = [],
+            keys  = this.keys,
+            items = this.items;
+
+        //default to a simple sorter function if one is not provided
+        fn = fn || function(a, b) {
+            return a - b;
+        };
+
+        //copy all the items into a temporary array, which we will sort
+        for(i = 0, len = items.length; i < len; i++){
+            c[c.length] = {
+                key  : keys[i],
+                value: items[i],
+                index: i
+            };
+        }
+
+        //sort the temporary array
+        c.sort(function(a, b){
+            var v = fn(a[property], b[property]) * dsc;
+            if(v === 0){
+                v = (a.index < b.index ? -1 : 1);
+            }
+            return v;
+        });
+
+        //copy the temporary array back into the main this.items and this.keys objects
+        for(i = 0, len = c.length; i < len; i++){
+            items[i] = c[i].value;
+            keys[i]  = c[i].key;
+        }
+
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>item</b> value with the passed comparison function.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    sort : function(dir, fn){
+        this._sort('value', dir, fn);
+    },
+
+    /**
+     * Reorders each of the items based on a mapping from old index to new index. Internally this
+     * just translates into a sort. The 'sort' event is fired whenever reordering has occured.
+     * @param {Object} mapping Mapping from old item index to new item index
+     */
+    reorder: function(mapping) {
+        this.suspendEvents();
+
+        var items = this.items,
+            index = 0,
+            length = items.length,
+            order = [],
+            remaining = [],
+            oldIndex;
+
+        //object of {oldPosition: newPosition} reversed to {newPosition: oldPosition}
+        for (oldIndex in mapping) {
+            order[mapping[oldIndex]] = items[oldIndex];
+        }
+
+        for (index = 0; index < length; index++) {
+            if (mapping[index] == undefined) {
+                remaining.push(items[index]);
+            }
+        }
+
+        for (index = 0; index < length; index++) {
+            if (order[index] == undefined) {
+                order[index] = remaining.shift();
+            }
+        }
+
+        this.clear();
+        this.addAll(order);
+
+        this.resumeEvents();
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>key</b>s.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by case insensitive string.
+     */
+    keySort : function(dir, fn){
+        this._sort('key', dir, fn || function(a, b){
+            var v1 = String(a).toUpperCase(), v2 = String(b).toUpperCase();
+            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
+        });
+    },
+
+    /**
+     * Returns a range of items in this collection
+     * @param {Number} startIndex (optional) The starting index. Defaults to 0.
+     * @param {Number} endIndex (optional) The ending index. Defaults to the last item.
+     * @return {Array} An array of items
+     */
+    getRange : function(start, end){
+        var items = this.items;
+        if(items.length < 1){
+            return [];
+        }
+        start = start || 0;
+        end = Math.min(typeof end == 'undefined' ? this.length-1 : end, this.length-1);
+        var i, r = [];
+        if(start <= end){
+            for(i = start; i <= end; i++) {
+                r[r.length] = items[i];
+            }
+        }else{
+            for(i = start; i >= end; i--) {
+                r[r.length] = items[i];
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Filter the <i>objects</i> in this collection by a specific property.
+     * Returns a new collection that has been filtered.
+     * @param {String} property A property on your objects
+     * @param {String/RegExp} value Either string that the property values
+     * should start with or a RegExp to test against the property
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison (defaults to False).
+     * @return {MixedCollection} The new filtered collection
+     */
+    filter : function(property, value, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return this.clone();
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.filterBy(function(o){
+            return o && value.test(o[property]);
+        });
+    },
+
+    /**
+     * Filter by a function. Returns a <i>new</i> collection that has been filtered.
+     * The passed function will be called with each object in the collection.
+     * If the function returns true, the value is included otherwise it is filtered.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key)
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @return {MixedCollection} The new filtered collection
+     */
+    filterBy : function(fn, scope){
+        var r = new Ext.util.MixedCollection();
+        r.getKey = this.getKey;
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                r.add(k[i], it[i]);
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Finds the index of the first matching object in this collection by a specific property/value.
+     * @param {String} property The name of a property on your objects.
+     * @param {String/RegExp} value A string that the property values
+     * should start with or a RegExp to test against the property.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning.
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison.
+     * @return {Number} The matched index or -1
+     */
+    findIndex : function(property, value, start, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return -1;
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.findIndexBy(function(o){
+            return o && value.test(o[property]);
+        }, null, start);
+    },
+
+    /**
+     * Find the index of the first matching object in this collection by a function.
+     * If the function returns <i>true</i> it is considered a match.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key).
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @return {Number} The matched index or -1
+     */
+    findIndexBy : function(fn, scope, start){
+        var k = this.keys, it = this.items;
+        for(var i = (start||0), len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns a regular expression based on the given value and matching options. This is used internally for finding and filtering,
+     * and by Ext.data.Store#filter
+     * @private
+     * @param {String} value The value to create the regex for. This is escaped using Ext.escapeRe
+     * @param {Boolean} anyMatch True to allow any match - no regex start/end line anchors will be added. Defaults to false
+     * @param {Boolean} caseSensitive True to make the regex case sensitive (adds 'i' switch to regex). Defaults to false.
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createValueMatcher : function(value, anyMatch, caseSensitive, exactMatch) {
+        if (!value.exec) { // not a regex
+            var er = Ext.escapeRe;
+            value = String(value);
+
+            if (anyMatch === true) {
+                value = er(value);
+            } else {
+                value = '^' + er(value);
+                if (exactMatch === true) {
+                    value += '$';
+                }
+            }
+            value = new RegExp(value, caseSensitive ? '' : 'i');
+         }
+         return value;
+    },
+
+    /**
+     * Creates a shallow copy of this collection
+     * @return {MixedCollection}
+     */
+    clone : function(){
+        var r = new Ext.util.MixedCollection();
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            r.add(k[i], it[i]);
+        }
+        r.getKey = this.getKey;
+        return r;
+    }
+});
+/**
+ * This method calls {@link #item item()}.
+ * Returns the item associated with the passed key OR index. Key has priority
+ * over index.  This is the equivalent of calling {@link #key} first, then if
+ * nothing matched calling {@link #itemAt}.
+ * @param {String/Number} key The key or index of the item.
+ * @return {Object} If the item is found, returns the item.  If the item was
+ * not found, returns <tt>undefined</tt>. If an item was found, but is a Class,
+ * returns <tt>null</tt>.
+ */
+Ext.util.MixedCollection.prototype.get = Ext.util.MixedCollection.prototype.item;
Index: /trunk/workshop-routing-foss4g/web/ext/src/util/XTemplate.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/src/util/XTemplate.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/src/util/XTemplate.js	(revision 76)
@@ -0,0 +1,478 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.XTemplate
+ * @extends Ext.Template
+ * <p>A template class that supports advanced functionality like:<div class="mdetail-params"><ul>
+ * <li>Autofilling arrays using templates and sub-templates</li>
+ * <li>Conditional processing with basic comparison operators</li>
+ * <li>Basic math function support</li>
+ * <li>Execute arbitrary inline code with special built-in template variables</li>
+ * <li>Custom member functions</li>
+ * <li>Many special tags and built-in operators that aren't defined as part of
+ * the API, but are supported in the templates that can be created</li>
+ * </ul></div></p>
+ * <p>XTemplate provides the templating mechanism built into:<div class="mdetail-params"><ul>
+ * <li>{@link Ext.DataView}</li>
+ * <li>{@link Ext.ListView}</li>
+ * <li>{@link Ext.form.ComboBox}</li>
+ * <li>{@link Ext.grid.TemplateColumn}</li>
+ * <li>{@link Ext.grid.GroupingView}</li>
+ * <li>{@link Ext.menu.Item}</li>
+ * <li>{@link Ext.layout.MenuLayout}</li>
+ * <li>{@link Ext.ColorPalette}</li>
+ * </ul></div></p>
+ *
+ * <p>For example usage {@link #XTemplate see the constructor}.</p>
+ *
+ * @constructor
+ * The {@link Ext.Template#Template Ext.Template constructor} describes
+ * the acceptable parameters to pass to the constructor. The following
+ * examples demonstrate all of the supported features.</p>
+ *
+ * <div class="mdetail-params"><ul>
+ *
+ * <li><b><u>Sample Data</u></b>
+ * <div class="sub-desc">
+ * <p>This is the data object used for reference in each code example:</p>
+ * <pre><code>
+var data = {
+    name: 'Jack Slocum',
+    title: 'Lead Developer',
+    company: 'Ext JS, LLC',
+    email: 'jack@extjs.com',
+    address: '4 Red Bulls Drive',
+    city: 'Cleveland',
+    state: 'Ohio',
+    zip: '44102',
+    drinks: ['Red Bull', 'Coffee', 'Water'],
+    kids: [{
+        name: 'Sara Grace',
+        age:3
+    },{
+        name: 'Zachary',
+        age:2
+    },{
+        name: 'John James',
+        age:0
+    }]
+};
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Auto filling of arrays</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>for</tt></b> operator are used
+ * to process the provided data object:
+ * <ul>
+ * <li>If the value specified in <tt>for</tt> is an array, it will auto-fill,
+ * repeating the template block inside the <tt>tpl</tt> tag for each item in the
+ * array.</li>
+ * <li>If <tt>for="."</tt> is specified, the data object provided is examined.</li>
+ * <li>While processing an array, the special variable <tt>{#}</tt>
+ * will provide the current array index + 1 (starts at 1, not 0).</li>
+ * </ul>
+ * </p>
+ * <pre><code>
+&lt;tpl <b>for</b>=".">...&lt;/tpl>       // loop through array at root node
+&lt;tpl <b>for</b>="foo">...&lt;/tpl>     // loop through array at foo node
+&lt;tpl <b>for</b>="foo.bar">...&lt;/tpl> // loop through array at foo.bar node
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for</b>=".">',       // process the data.kids node
+        '&lt;p>{#}. {name}&lt;/p>',  // use current array index to autonumber
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data.kids); // pass the kids property of the data object
+ * </code></pre>
+ * <p>An example illustrating how the <b><tt>for</tt></b> property can be leveraged
+ * to access specified members of the provided data object to populate the template:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Title: {title}&lt;/p>',
+    '&lt;p>Company: {company}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for="kids"</b>>',     // interrogate the kids property within the data
+        '&lt;p>{name}&lt;/p>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);  // pass the root node of the data object
+ * </code></pre>
+ * <p>Flat arrays that contain values (and not objects) can be auto-rendered
+ * using the special <b><tt>{.}</tt></b> variable inside a loop.  This variable
+ * will represent the value of the array at the current index:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>{name}\&#39;s favorite beverages:&lt;/p>',
+    '&lt;tpl for="drinks">',
+       '&lt;div> - {.}&lt;/div>',
+    '&lt;/tpl>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * <p>When processing a sub-template, for example while looping through a child array,
+ * you can access the parent object's members via the <b><tt>parent</tt></b> object:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+            '&lt;p>Dad: {<b>parent</b>.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Conditional processing with basic comparison operators</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>if</tt></b> operator are used
+ * to provide conditional checks for deciding whether or not to render specific
+ * parts of the template. Notes:<div class="sub-desc"><ul>
+ * <li>Double quotes must be encoded if used within the conditional</li>
+ * <li>There is no <tt>else</tt> operator &mdash; if needed, two opposite
+ * <tt>if</tt> statements should be used.</li>
+ * </ul></div>
+ * <pre><code>
+&lt;tpl if="age &gt; 1 &amp;&amp; age &lt; 10">Child&lt;/tpl>
+&lt;tpl if="age >= 10 && age < 18">Teenager&lt;/tpl>
+&lt;tpl <b>if</b>="this.isGirl(name)">...&lt;/tpl>
+&lt;tpl <b>if</b>="id==\'download\'">...&lt;/tpl>
+&lt;tpl <b>if</b>="needsIcon">&lt;img src="{icon}" class="{iconCls}"/>&lt;/tpl>
+// no good:
+&lt;tpl if="name == "Jack"">Hello&lt;/tpl>
+// encode &#34; if it is part of the condition, e.g.
+&lt;tpl if="name == &#38;quot;Jack&#38;quot;">Hello&lt;/tpl>
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Basic math support</u></b>
+ * <div class="sub-desc">
+ * <p>The following basic math operators may be applied directly on numeric
+ * data values:</p><pre>
+ * + - * /
+ * </pre>
+ * For example:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age &amp;gt; 1">',  // <-- Note that the &gt; is encoded
+            '&lt;p>{#}: {name}&lt;/p>',  // <-- Auto-number each item
+            '&lt;p>In 5 Years: {age+5}&lt;/p>',  // <-- Basic math
+            '&lt;p>Dad: {parent.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+</code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Execute arbitrary inline code with special built-in template variables</u></b>
+ * <div class="sub-desc">
+ * <p>Anything between <code>{[ ... ]}</code> is considered code to be executed
+ * in the scope of the template. There are some special variables available in that code:
+ * <ul>
+ * <li><b><tt>values</tt></b>: The values in the current scope. If you are using
+ * scope changing sub-templates, you can change what <tt>values</tt> is.</li>
+ * <li><b><tt>parent</tt></b>: The scope (values) of the ancestor template.</li>
+ * <li><b><tt>xindex</tt></b>: If you are in a looping template, the index of the
+ * loop you are in (1-based).</li>
+ * <li><b><tt>xcount</tt></b>: If you are in a looping template, the total length
+ * of the array you are looping.</li>
+ * <li><b><tt>fm</tt></b>: An alias for <tt>Ext.util.Format</tt>.</li>
+ * </ul>
+ * This example demonstrates basic row striping using an inline code block and the
+ * <tt>xindex</tt> variable:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Company: {[values.company.toUpperCase() + ", " + values.title]}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+       '&lt;div class="{[xindex % 2 === 0 ? "even" : "odd"]}">',
+        '{name}',
+        '&lt;/div>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * <li><b><u>Template member functions</u></b>
+ * <div class="sub-desc">
+ * <p>One or more member functions can be specified in a configuration
+ * object passed into the XTemplate constructor for more complex processing:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="this.isGirl(name)">',
+            '&lt;p>Girl: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        // use opposite if statement to simulate 'else' processing:
+        '&lt;tpl if="this.isGirl(name) == false">',
+            '&lt;p>Boy: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        '&lt;tpl if="this.isBaby(age)">',
+            '&lt;p>{name} is a baby!&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>',
+    {
+        // XTemplate configuration:
+        compiled: true,
+        disableFormats: true,
+        // member functions:
+        isGirl: function(name){
+            return name == 'Sara Grace';
+        },
+        isBaby: function(age){
+            return age < 1;
+        }
+    }
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * </ul></div>
+ *
+ * @param {Mixed} config
+ */
+Ext.XTemplate = function(){
+    Ext.XTemplate.superclass.constructor.apply(this, arguments);
+
+    var me = this,
+        s = me.html,
+        re = /<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,
+        nameRe = /^<tpl\b[^>]*?for="(.*?)"/,
+        ifRe = /^<tpl\b[^>]*?if="(.*?)"/,
+        execRe = /^<tpl\b[^>]*?exec="(.*?)"/,
+        m,
+        id = 0,
+        tpls = [],
+        VALUES = 'values',
+        PARENT = 'parent',
+        XINDEX = 'xindex',
+        XCOUNT = 'xcount',
+        RETURN = 'return ',
+        WITHVALUES = 'with(values){ ';
+
+    s = ['<tpl>', s, '</tpl>'].join('');
+
+    while((m = s.match(re))){
+        var m2 = m[0].match(nameRe),
+            m3 = m[0].match(ifRe),
+            m4 = m[0].match(execRe),
+            exp = null,
+            fn = null,
+            exec = null,
+            name = m2 && m2[1] ? m2[1] : '';
+
+       if (m3) {
+           exp = m3 && m3[1] ? m3[1] : null;
+           if(exp){
+               fn = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES + RETURN +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if (m4) {
+           exp = m4 && m4[1] ? m4[1] : null;
+           if(exp){
+               exec = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if(name){
+           switch(name){
+               case '.': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + VALUES + '; }'); break;
+               case '..': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + PARENT + '; }'); break;
+               default: name = new Function(VALUES, PARENT, WITHVALUES + RETURN + name + '; }');
+           }
+       }
+       tpls.push({
+            id: id,
+            target: name,
+            exec: exec,
+            test: fn,
+            body: m[1]||''
+        });
+       s = s.replace(m[0], '{xtpl'+ id + '}');
+       ++id;
+    }
+    for(var i = tpls.length-1; i >= 0; --i){
+        me.compileTpl(tpls[i]);
+    }
+    me.master = tpls[tpls.length-1];
+    me.tpls = tpls;
+};
+Ext.extend(Ext.XTemplate, Ext.Template, {
+    // private
+    re : /\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,
+    // private
+    codeRe : /\{\[((?:\\\]|.|\n)*?)\]\}/g,
+
+    // private
+    applySubTemplate : function(id, values, parent, xindex, xcount){
+        var me = this,
+            len,
+            t = me.tpls[id],
+            vs,
+            buf = [];
+        if ((t.test && !t.test.call(me, values, parent, xindex, xcount)) ||
+            (t.exec && t.exec.call(me, values, parent, xindex, xcount))) {
+            return '';
+        }
+        vs = t.target ? t.target.call(me, values, parent) : values;
+        len = vs.length;
+        parent = t.target ? values : parent;
+        if(t.target && Ext.isArray(vs)){
+            for(var i = 0, len = vs.length; i < len; i++){
+                buf[buf.length] = t.compiled.call(me, vs[i], parent, i+1, len);
+            }
+            return buf.join('');
+        }
+        return t.compiled.call(me, vs, parent, xindex, xcount);
+    },
+
+    // private
+    compileTpl : function(tpl){
+        var fm = Ext.util.Format,
+            useF = this.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args, math){
+            if(name.substr(0, 4) == 'xtpl'){
+                return "'"+ sep +'this.applySubTemplate('+name.substr(4)+', values, parent, xindex, xcount)'+sep+"'";
+            }
+            var v;
+            if(name === '.'){
+                v = 'values';
+            }else if(name === '#'){
+                v = 'xindex';
+            }else if(name.indexOf('.') != -1){
+                v = name;
+            }else{
+                v = "values['" + name + "']";
+            }
+            if(math){
+                v = '(' + v + math + ')';
+            }
+            if (format && useF) {
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            } else {
+                args= ''; format = "("+v+" === undefined ? '' : ";
+            }
+            return "'"+ sep + format + v + args + ")"+sep+"'";
+        }
+
+        function codeFn(m, code){
+            // Single quotes get escaped when the template is compiled, however we want to undo this when running code.
+            return "'" + sep + '(' + code.replace(/\\'/g, "'") + ')' + sep + "'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "tpl.compiled = function(values, parent, xindex, xcount){ return '" +
+                   tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn) +
+                    "';};";
+        }else{
+            body = ["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];
+            body.push(tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return this;
+    },
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        return this.master.compiled.call(this, values, {}, 1, 1);
+    },
+
+    /**
+     * Compile the template to a function for optimized performance.  Recommended if the template will be used frequently.
+     * @return {Function} The compiled function
+     */
+    compile : function(){return this;}
+
+    /**
+     * @property re
+     * @hide
+     */
+    /**
+     * @property disableFormats
+     * @hide
+     */
+    /**
+     * @method set
+     * @hide
+     */
+
+});
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified values applied.
+ * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+ * @return {String} The HTML fragment
+ * @member Ext.XTemplate
+ * @method apply
+ */
+Ext.XTemplate.prototype.apply = Ext.XTemplate.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.XTemplate.from = function(el){
+    el = Ext.getDom(el);
+    return new Ext.XTemplate(el.value || el.innerHTML);
+};
Index: /trunk/workshop-routing-foss4g/web/ext/release-notes.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/release-notes.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/release-notes.html	(revision 76)
@@ -0,0 +1,91 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>
+            Release Notes for Ext JS 3.4.0
+        </title>
+        <style type="text/css">
+
+        * { margin: 0; padding: 0; }
+        body { 
+        color: #333; 
+        font-family: Helvetica, Arial, sans-serif; 
+        font-size: 12px;
+        padding: 0 40px 40px; 
+        width: 800px;
+        margin: 0 auto;
+        }
+        h1, h2, h3 { 
+        font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
+        font-weight: 600; 
+        margin: 1em 0;
+        }
+        h1 { font-size: 23px; }
+        h2 { font-size: 16px; margin-top: 1em; }
+        h3 { font-size: 14px; }
+        ul li { padding: 2px 0; font-size: 13px; }
+        ul ul li { font-size: 12px; font-weight: normal; }
+        .doc { color: blue; }
+        .change { color: #196cb4; }
+        .new { color: #6e7a32; }
+        ul { padding: .1em 1.5em; }
+        .notes { color: #777; }
+        a { color: rgb(4, 100, 187); }
+        a:hover { color: rgb(28, 65, 124); }
+        </style>
+    </head>
+    <body>
+        <p>
+            <a href="http://www.sencha.com/" id="logo" name="logo"><img src="http://www.sencha.com/assets/images/logo-sencha-sm.png" alt=""></a>
+        </p>
+        <h1>
+            Release Notes for <a href="http://www.sencha.com/products/js/">Ext JS</a> 3.4.0
+        </h1>
+        <p class="notes">
+            Release Date: June 9, 2011<br>
+            Current Version: 3.4.0 (rev 7395/288)<br>
+            Previous Version: 3.3.3 (rev 7389/286)
+        </p>
+        <h2 class="new">
+            Changes
+        </h2>
+        <h3>
+            Menu
+        </h3>
+        <ul>
+            <li>Incorrect menu width on IE9
+            </li>
+            <li>Fix Reorderable example
+            </li>
+        </ul>
+        <h3>
+            Form/Field
+        </h3>
+        <ul>
+            <li>Fix an issue with composite fields being marked incorrectly
+            </li>
+            <li>Trigger fields are now flushed with fields on IE9
+            </li>
+            <li>Fix field width in IE9
+            </li>
+            <li>Fix fieldset header checkboxes in IE9 quirks
+            </li>
+        </ul>
+        <h3>
+            Misc
+        </h3>
+        <ul>
+            <li>Allow altText to be specified on a per item basis for grid columns
+            </li>
+            <li>Ensure there's no bottom margin on the multi-select
+            </li>
+            <li>Apply additional css classes for IE9 (ext-ie9 and x-quirks)
+            </li>
+            <li>Apply additional boolean flags for IE9 (Ext.isIE9 and Ext.isIEQuirks)
+            </li>
+            <li>Add support to insertHTML method to prevent createContextualFragment errors with IE9
+            </li>
+        </ul>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/ext/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/index.html	(revision 76)
@@ -0,0 +1,344 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<meta charset="UTF-8" />
+<title>Welcome to Ext JS</title>
+<link rel="shortcut icon" href="http://www.sencha.com/favicon.ico" />
+<style type="text/css">
+
+* {
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    background: #fff;
+    color: #333;
+    font: normal 12px/1.3 Helvetica, sans-serif;
+    margin: 0 auto 0;
+    padding: 0;
+    width: 800px;
+    
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizelegibility;
+}
+
+p {
+    margin: 0 0 1em;
+}
+
+a:link,
+a:visited {
+    color: #0464BB;
+    text-decoration: none;
+}
+
+a:hover,
+a:focus,
+a:active {
+    color: #0464BB;
+    text-decoration: underline;
+}
+
+h1,h2,h3,h4,h5,h6 {
+    color: #222;
+    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    line-height: 1.1;    
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+
+a#logo {
+    background: url(welcome/images/logo-sencha-sm.png) no-repeat 0 100%;
+    display: block;
+    height: 58px;
+    margin: 0 0 24px;
+    overflow: hidden;
+    padding: 0px;
+    text-indent: 150%;
+    white-space: nowrap;
+    width: 134px;
+}
+
+#header {
+    background: url(welcome/images/ext-comp.png) no-repeat 100% 48px;
+    height: 320px;
+}
+
+#header h1 {
+    font-size: 32px;
+    margin: 45px 0 12px;
+    width: 350px;
+}
+
+#header p {
+    color: #555;
+    font-size: 16px;
+    line-height: 1.5;
+    width: 360px;
+}
+
+div.button-wrap {
+    padding: 0 0 1em;
+}
+
+.button:link,
+.button:visited {
+    background: #2a64a6;
+    border: 1px solid;
+    border-color: transparent transparent rgba(0,0,0,0.4) transparent;
+    -webkit-border-radius: 13px;
+    -moz-border-radius:    13px;
+    border-radius:         13px;
+    color: #fff;
+    display: table-cell;
+    font-size: 13px;
+    font-weight: bold;
+    height: 13px;
+    padding: 2px 12px;
+    text-align: center;
+    text-decoration: none;
+    text-shadow: 0 1px 0 rgba(0,0,0,0.4);
+    width: 114px;
+}
+
+.button:hover,
+.button:focus {
+    background: #265B98;
+}
+
+.button:active {
+    background: #1F4C7E;
+    border-color: rgba(0,0,0,0.4) transparent transparent transparent;
+    text-decoration: none;
+    text-shadow: 0 -1px 0 rgba(0,0,0,0.4);
+}
+
+h2 {
+    font-size: 18px;
+}
+
+#header {
+    display: block;
+    margin: 0 0 24px;
+    padding: 0;
+}
+
+div#container {
+    margin: 0 auto;
+    overflow: hidden;
+    width: 800px;
+}
+
+.section {
+    float: left;
+    margin-right: 50px;
+    width: 233px;
+}
+
+.section h2 {
+    line-height: 30px;
+    margin: 0;
+    padding: 0;
+}
+
+#engage ul li {
+    height: 16px;
+    line-height: 16px;
+}
+
+#engage ul#social li a {
+    color: #777;
+    display: block;
+    height: 16px;
+    line-height: 16px;
+    margin: 6px 0 0;
+    padding-left: 22px;
+    text-decoration: none;
+}
+
+#engage ul#social li a span {
+    color: #0464BB;
+    font-weight: bold;
+    text-decoration: none;
+}
+
+#engage ul#social li a:hover {
+    color: #777;
+    text-decoration: none;
+}
+
+#engage ul#social li a:hover span {
+    color: #0464BB;
+    text-decoration: underline;
+}
+
+#engage a#join_us.button {
+    width: 148px;
+}
+
+#engage a#twitter {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 0;
+}
+
+#engage a#twitter:hover {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -16px;
+}
+
+#engage a#tumblr {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -32px;
+}
+
+#engage a#tumblr:hover {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -48px;
+}
+
+#engage a#facebook {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -64px;
+}
+
+#engage a#facebook:hover {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -80px;
+}
+
+#engage a#linkedin {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -128px;
+}
+
+#engage a#linkedin:hover {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -144px;
+}
+
+#engage a#blog {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -96px;
+}
+
+#engage a#blog:hover {
+    background: url(welcome/images/social_sprite.gif) no-repeat 0 -112px;
+}
+
+#license {
+    margin-right: 0;
+}
+
+ul,
+ul li {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+#learn ul li,
+#license ul li {
+    background: url(welcome/images/li.png) no-repeat 1px 2px;
+    padding: 0 0 0.5em 10px;
+    margin-left: 0px;
+}
+
+div#communication {
+    border-top: 1px solid #dfdfdf;
+    font-size: 13px;
+    height: 16px;
+    line-height: 16px;
+    margin: 24px 0;
+    overflow: hidden;
+    overflow: visible;
+    padding: 24px 0 0;
+}
+
+div#communication form {
+    float: left;
+    width: 550px;
+}
+
+div#communication p {
+    color: #222;
+    margin: 0;
+}
+
+div#communication p strong {
+    color: #555;
+}
+
+div#communication input#MERGE0 {
+    padding: 2px;
+}
+
+div#communication p#jobs {
+    float: right;
+    text-align: right;
+    width: 220px;
+}
+
+</style>
+</head>
+<body>
+<div id="page">
+<div id="header">
+<a href="http://www.sencha.com/" id="logo">Sencha - Ext JS - Amazing Web Apps Built on Web Standards</a>
+<h1>Welcome to Ext JS</h1>
+<p>Thank you for downloading Ext JS. With a community of over one million developers and our robust family of Sencha products, Ext JS is the leader in Javascript application development.</p>
+<div class="button-wrap">
+    <a href="examples/" id="examples" class="button"><span>View Examples</span></a>
+</div>
+</div>
+<div id="container">
+<div id="learn" class="section">
+<h2>Learn</h2>
+<p>Use the included files to <a href="examples/index.html">view samples</a> and our <a href="docs/">API documentation</a>.</p>
+<p>For advanced, hands-on support, please see our premium <a href="http://www.sencha.com/store">support subscriptions</a>. Larger organizations can use <a href="http://www.sencha.com/support/">our enterprise training and services</a>.</p>
+<ul>
+<li><a href="http://www.sencha.com/learn/Tutorial:Ext_StartUp_Guide">Getting Started Guide</a></li>
+<li><a href="examples/">Examples</a></li>
+<li><a href="release-notes.html">Release Notes</a></li>
+</ul>
+</div>
+
+<div id="engage" class="section">
+<h2>Engage</h2>
+<p>Our <a href="http://www.sencha.com/forum/">community forums</a> have over 100,000 registered users and are a great place to ask questions and interact with other Ext JS developers.</p>
+
+<div class="button-wrap">
+    <a href="http://www.sencha.com/forum/register.php" id="join_us" class="button"><span>Join Sencha Forum</span></a>
+</div>
+
+<ul id="social">
+<li><a href="http://twitter.com/senchainc" id="twitter"><span>Follow @SenchaInc</span> on Twitter</a></li>
+<li><a href="http://senchainc.tumblr.com/" id="tumblr"><span>Check out</span> our new Tumblelog</a></li>
+<li><a href="http://www.facebook.com/senchainc" id="facebook"><span>Become a fan</span> on Facebook</a></li>
+<li><a href="http://j.mp/sencha-in" id="linkedin"><span>Network with us</span> on LinkedIn</a></li>
+<li><a href="http://www.sencha.com/blog/" id="blog"><span>Subscribe</span> to the official blog</a></li>
+</ul>
+</div>
+
+<div id="license" class="section">
+<h2>License</h2>
+<p>Ext JS is <a href="http://www.sencha.com/company/dual.php">dual licensed</a>. This means:</p>
+<ul>
+<li>Free to use and test in your local development environment.</li>
+<li>Free to use in your open source projects.</li>
+<li>Purchase a developer license if you don&rsquo;t plan on releasing your website or application&rsquo;s code as open source.</li>
+</ul>
+<p>To purchase a commercial license, please see our <a href="http://www.sencha.com/store/extjs/">pricing page</a>.</p>
+</div>
+</div>
+
+<div id="communication">
+<form action="http://extjs.us1.list-manage.com/subscribe/post" method="post">
+<p>
+<label for="MERGE0"><strong>Sign up to stay in the loop:</strong></label>
+<input name="u" type="hidden" value="fb30e9d0e8ab5e66a19398a14" />
+<input name="id" type="hidden" value="879d2e6c9b" />
+<input name="refurl" type="hidden" value="/extjs" />
+<input name="interests" type="hidden" value="Company News, Ext JS" />
+<input name="orig-lang" type="hidden" value="1" />
+<input id="MERGE0" name="MERGE0" type="email" autofocus="true" placeholder="johndoe@example.com" size="25" />
+<input id="submit" name="submit" type="submit" value="Subscribe" />
+</p>
+</form>
+<p id="jobs">Check out our <a href="http://jobs.extjs.com/">Job Board &raquo;</a></p>
+</div>
+
+</div>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/ext/resources/images/yourtheme/README.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/images/yourtheme/README.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/images/yourtheme/README.txt	(revision 76)
@@ -0,0 +1,2 @@
+2010-03-16 jwr:
+The image directory, "yourtheme", is an exact copy of the "default" image directory. Remember to update your file paths in "css/yourtheme.css" if you make changes or add your own custom images for your custom theme.
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/box.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/box.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/box.css	(revision 76)
@@ -0,0 +1,80 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/*
+ Creates rounded, raised boxes like on the Ext website - the markup isn't pretty:
+  <div class="x-box-blue">
+        <div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
+        <div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
+            <h3>YOUR TITLE HERE (optional)</h3>
+            <div>YOUR CONTENT HERE</div>
+        </div></div></div>
+        <div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
+    </div>
+ */
+
+.x-box-tl {
+	background: transparent no-repeat 0 0;
+    zoom:1;
+}
+
+.x-box-tc {
+	height: 8px;
+	background: transparent repeat-x 0 0;
+	overflow: hidden;
+}
+
+.x-box-tr {
+	background: transparent no-repeat right -8px;
+}
+
+.x-box-ml {
+	background: transparent repeat-y 0;
+	padding-left: 4px;
+	overflow: hidden;
+    zoom:1;
+}
+
+.x-box-mc {
+	background: repeat-x 0 -16px;
+	padding: 4px 10px;
+}
+
+.x-box-mc h3 {
+	margin: 0 0 4px 0;
+    zoom:1;
+}
+
+.x-box-mr {
+	background: transparent repeat-y right;
+	padding-right: 4px;
+	overflow: hidden;
+}
+
+.x-box-bl {
+	background: transparent no-repeat 0 -16px;
+    zoom:1;
+}
+
+.x-box-bc {
+	background: transparent repeat-x 0 -8px;
+	height: 8px;
+	overflow: hidden;
+}
+
+.x-box-br {
+	background: transparent no-repeat right -24px;
+}
+
+.x-box-tl, .x-box-bl {
+	padding-left: 8px;
+	overflow: hidden;
+}
+
+.x-box-tr, .x-box-br {
+	padding-right: 8px;
+	overflow: hidden;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/core.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/core.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/core.css	(revision 76)
@@ -0,0 +1,341 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    z-index: 100;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width: 100%;
+    height: 100%;
+    zoom: 1;
+}
+
+.ext-el-mask-msg {
+    z-index: 20001;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border:1px solid;
+    background:repeat-x 0 -16px;
+    padding:2px;
+}
+
+.ext-el-mask-msg div {
+    padding:5px 10px 5px 10px;
+    border:1px solid;
+    cursor:wait;
+}
+
+.ext-shim {
+    position:absolute;
+    visibility:hidden;
+    left:0;
+    top:0;
+    overflow:hidden;
+}
+
+.ext-ie .ext-shim {
+    filter: alpha(opacity=0);
+}
+
+.ext-ie6 .ext-shim {
+    margin-left: 5px;
+    margin-top: 3px;
+}
+
+.x-mask-loading div {
+    padding:5px 10px 5px 25px;
+    background:no-repeat 5px 5px;
+    line-height:16px;
+}
+
+/* class for hiding elements without using display:none */
+.x-hidden, .x-hide-offsets {
+    position:absolute !important;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+}
+
+.x-hide-display {
+    display:none !important;
+}
+
+.x-hide-nosize,
+.x-hide-nosize *    /* Emulate display:none for children */
+ {
+   height:0px!important;
+   width:0px!important;
+   visibility:hidden!important;
+   border:none!important;
+   zoom:1;
+}
+
+.x-hide-visibility {
+    visibility:hidden !important;
+}
+
+.x-masked {
+    overflow: hidden !important;
+}
+.x-masked-relative {
+    position: relative !important;
+}
+
+.x-masked select, .x-masked object, .x-masked embed {
+    visibility: hidden;
+}
+
+.x-layer {
+    visibility: hidden;
+}
+
+.x-unselectable, .x-unselectable * {
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-repaint {
+    zoom: 1;
+    background-color: transparent;
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-item-disabled {
+    cursor: default;
+    opacity: .6;
+    -moz-opacity: .6;
+    filter: alpha(opacity=60);
+}
+
+.x-item-disabled * {
+    cursor: default !important;
+}
+
+.x-form-radio-group .x-item-disabled {
+    filter: none;
+}
+
+.x-splitbar-proxy {
+    position: absolute;
+    visibility: hidden;
+    z-index: 20001;
+    zoom: 1;
+    line-height: 1px;
+    font-size: 1px;
+    overflow: hidden;
+}
+
+.x-splitbar-h, .x-splitbar-proxy-h {
+    cursor: e-resize;
+    cursor: col-resize;
+}
+
+.x-splitbar-v, .x-splitbar-proxy-v {
+    cursor: s-resize;
+    cursor: row-resize;
+}
+
+.x-color-palette {
+    width: 150px;
+    height: 92px;
+    cursor: pointer;
+}
+
+.x-color-palette a {
+    border: 1px solid;
+    float: left;
+    padding: 2px;
+    text-decoration: none;
+    -moz-outline: 0 none;
+    outline: 0 none;
+    cursor: pointer;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border: 1px solid;
+}
+
+.x-color-palette em {
+    display: block;
+    border: 1px solid;
+}
+
+.x-color-palette em span {
+    cursor: pointer;
+    display: block;
+    height: 10px;
+    line-height: 10px;
+    width: 10px;
+}
+
+.x-ie-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+    zoom:1;
+}
+
+.x-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+}
+
+.x-shadow * {
+    overflow: hidden;
+}
+
+.x-shadow * {
+    padding: 0;
+    border: 0;
+    margin: 0;
+    clear: none;
+    zoom: 1;
+}
+
+/* top  bottom */
+.x-shadow .xstc, .x-shadow .xsbc {
+    height: 6px;
+    float: left;
+}
+
+/* corners */
+.x-shadow .xstl, .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbr {
+    width: 6px;
+    height: 6px;
+    float: left;
+}
+
+/* sides */
+.x-shadow .xsc {
+    width: 100%;
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    width: 6px;
+    float: left;
+    height: 100%;
+}
+
+.x-shadow .xsmc {
+    float: left;
+    height: 100%;
+    background-color: transparent;
+}
+
+.x-shadow .xst, .x-shadow .xsb {
+    height: 6px;
+    overflow: hidden;
+    width: 100%;
+}
+
+.x-shadow .xsml {
+    background: transparent repeat-y 0 0;
+}
+
+.x-shadow .xsmr {
+    background: transparent repeat-y -6px 0;
+}
+
+.x-shadow .xstl {
+    background: transparent no-repeat 0 0;
+}
+
+.x-shadow .xstc {
+    background: transparent repeat-x 0 -30px;
+}
+
+.x-shadow .xstr {
+    background: transparent repeat-x 0 -18px;
+}
+
+.x-shadow .xsbl {
+    background: transparent no-repeat 0 -12px;
+}
+
+.x-shadow .xsbc {
+    background: transparent repeat-x 0 -36px;
+}
+
+.x-shadow .xsbr {
+    background: transparent repeat-x 0 -6px;
+}
+
+.loading-indicator {
+    background: no-repeat left;
+    padding-left: 20px;
+    line-height: 16px;
+    margin: 3px;
+}
+
+.x-text-resize {
+    position: absolute;
+    left: -1000px;
+    top: -1000px;
+    visibility: hidden;
+    zoom: 1;
+}
+
+.x-drag-overlay {
+    width: 100%;
+    height: 100%;
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 0;
+    background-image:url(../images/default/s.gif);
+    z-index: 20000;
+}
+
+.x-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.x-spotlight {
+    z-index: 8999;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width:0;
+    height:0;
+    zoom: 1;
+}
+
+#x-history-frame {
+    position:absolute;
+    top:-1px;
+    left:0;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
+
+#x-history-field {
+    position:absolute;
+    top:0;
+    left:-1px;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/date-picker.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/date-picker.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/date-picker.css	(revision 76)
@@ -0,0 +1,271 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-date-picker {
+    border: 1px solid;
+    border-top:0 none;
+	position:relative;
+}
+
+.x-date-picker a {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+.x-date-inner, .x-date-inner td, .x-date-inner th{
+    border-collapse:separate;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background: repeat-x 0 -83px;
+	overflow:hidden;
+}
+
+.x-date-middle .x-btn-tc,.x-date-middle .x-btn-tl,.x-date-middle .x-btn-tr,
+.x-date-middle .x-btn-mc,.x-date-middle .x-btn-ml,.x-date-middle .x-btn-mr,
+.x-date-middle .x-btn-bc,.x-date-middle .x-btn-bl,.x-date-middle .x-btn-br{
+	background:transparent !important;
+    vertical-align:middle;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background:transparent no-repeat right 0;
+}
+
+.x-date-right, .x-date-left {
+    width:18px;
+}
+
+.x-date-right{
+    text-align:right;
+}
+
+.x-date-middle {
+    padding-top:2px;
+    padding-bottom:2px;
+    width:130px; /* FF3 */
+}
+
+.x-date-right a, .x-date-left a{
+    display:block;
+    width:16px;
+	height:16px;
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor:pointer;
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a:hover, .x-date-left a:hover{
+    -moz-opacity: 1;
+    opacity:1;
+    filter: alpha(opacity=100);
+}
+
+.x-item-disabled .x-date-right a:hover, .x-item-disabled .x-date-left a:hover{
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a {
+    margin-right:2px;
+    text-decoration:none !important;
+}
+
+.x-date-left a{
+    margin-left:2px;
+    text-decoration:none !important;
+}
+
+table.x-date-inner {
+    width: 100%;
+    table-layout:fixed;
+}
+
+.ext-webkit table.x-date-inner{
+    /* Fix for webkit browsers */
+    width: 175px;
+}
+
+
+.x-date-inner th {
+    width:25px;
+}
+
+.x-date-inner th {
+    background: repeat-x left top;
+    text-align:right !important;
+	border-bottom: 1px solid;
+	cursor:default;
+    padding:0;
+    border-collapse:separate;
+}
+
+.x-date-inner th span {
+    display:block;
+    padding:2px;
+    padding-right:7px;
+}
+
+.x-date-inner td {
+    border: 1px solid;
+	text-align:right;
+    padding:0;
+}
+
+.x-date-inner a {
+    padding:2px 5px;
+    display:block;
+	text-decoration:none;
+    text-align:right;
+    zoom:1;
+}
+
+.x-date-inner .x-date-active{
+	cursor:pointer;
+	color:black;
+}
+
+.x-date-inner .x-date-selected a{
+	background: repeat-x left top;
+	border:1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-today a{
+	border: 1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+    text-decoration:none !important;
+}
+
+.x-date-bottom {
+    padding:4px;
+    border-top: 1px solid;
+    background: repeat-x left top;
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    text-decoration:none !important;
+}
+
+.x-item-disabled .x-date-inner a:hover{
+    background: none;
+}
+
+.x-date-inner .x-date-disabled a {
+	cursor:default;
+}
+
+.x-date-menu .x-menu-item {
+	padding:1px 24px 1px 4px;
+	white-space: nowrap;
+}
+
+.x-date-menu .x-menu-item .x-menu-item-icon {
+    width:10px;
+    height:10px;
+    margin-right:5px;
+    background-position:center -4px !important;
+}
+
+.x-date-mp {
+	position:absolute;
+	left:0;
+	top:0;
+	display:none;
+}
+
+.x-date-mp td {
+    padding:2px;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+td.x-date-mp-month,td.x-date-mp-year,td.x-date-mp-ybtn {
+    border: 0 none;
+	text-align:center;
+	vertical-align: middle;
+	width:25%;
+}
+
+.x-date-mp-ok {
+	margin-right:3px;
+}
+
+.x-date-mp-btns button {
+	text-decoration:none;
+	text-align:center;
+	text-decoration:none !important;
+	border:1px solid;
+	padding:1px 3px 1px;
+	cursor:pointer;
+}
+
+.x-date-mp-btns {
+	background: repeat-x left top;
+}
+
+.x-date-mp-btns td {
+	border-top: 1px solid;
+    text-align:center;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	display:block;
+	padding:2px 4px;
+	text-decoration:none;
+	text-align:center;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	text-decoration:none;
+	cursor:pointer;
+}
+
+td.x-date-mp-sel a {
+	padding:1px 3px;
+	background: repeat-x left top;
+	border:1px solid;
+}
+
+.x-date-mp-ybtn a {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    cursor:pointer;
+    background:transparent no-repeat;
+    display:block;
+    margin:0 auto;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next {
+    background-position:0 -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next:hover {
+    background-position:-15px -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev {
+    background-position:0 -105px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev:hover {
+    background-position:-15px -105px;
+}
+
+.x-date-mp-ybtn {
+   text-align:center;
+}
+
+td.x-date-mp-sep {
+   border-right:1px solid;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tabs.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tabs.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tabs.css	(revision 76)
@@ -0,0 +1,392 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tab-panel {
+    overflow:hidden;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border: 1px solid;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header {
+	border: 1px solid;
+	padding-bottom: 2px;
+}
+
+.x-tab-panel-footer {
+	border: 1px solid;
+	padding-top: 2px;
+}
+
+.x-tab-strip-wrap {
+	width:100%;
+    overflow:hidden;
+    position:relative;
+    zoom:1;
+}
+
+ul.x-tab-strip {
+	display:block;
+    width:5000px;
+    zoom:1;
+}
+
+ul.x-tab-strip-top{
+	padding-top: 1px;
+	background: repeat-x bottom;
+	border-bottom: 1px solid;
+}
+
+ul.x-tab-strip-bottom{
+	padding-bottom: 1px;
+	background: repeat-x top;
+	border-top: 1px solid;
+	border-bottom: 0 none;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-top {
+    background:transparent !important;
+    padding-top:0 !important;
+}
+
+.x-tab-panel-header-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border:1px solid;
+    height:2px;
+    font-size:1px;
+    line-height:1px;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer {
+    border-top: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-bottom: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-bottom {
+    background:transparent !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-footer-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-top:0 !important;
+}
+
+.ext-border-box .x-tab-panel-header-plain .x-tab-strip-spacer,
+.ext-border-box .x-tab-panel-footer-plain .x-tab-strip-spacer {
+    height:3px;
+}
+
+ul.x-tab-strip li {
+    float:left;
+    margin-left:2px;
+}
+
+ul.x-tab-strip li.x-tab-edge {
+    float:left;
+    margin:0 !important;
+    padding:0 !important;
+    border:0 none !important;
+    font-size:1px !important;
+    line-height:1px !important;
+    overflow:hidden;
+    zoom:1;
+    background:transparent !important;
+    width:1px;
+}
+
+.x-tab-strip a, .x-tab-strip span, .x-tab-strip em {
+	display:block;
+}
+
+.x-tab-strip a {
+	text-decoration:none !important;
+	-moz-outline: none;
+	outline: none;
+	cursor:pointer;
+}
+
+.x-tab-strip-inner {
+    overflow:hidden;
+	text-overflow: ellipsis;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	white-space: nowrap;
+	cursor:pointer;
+    padding:4px 0;
+}
+
+.x-tab-strip-top .x-tab-with-icon .x-tab-right {
+    padding-left:6px;
+}
+
+.x-tab-strip .x-tab-with-icon span.x-tab-strip-text {
+	padding-left:20px;
+    background-position: 0 3px;
+    background-repeat: no-repeat;
+}
+
+.x-tab-strip-active, .x-tab-strip-active a.x-tab-right {
+    cursor:default;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	cursor:default;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	cursor:default;
+}
+
+.x-tab-panel-body {
+    overflow:hidden;
+}
+
+.x-tab-panel-bwrap {
+    overflow:hidden;
+}
+
+.ext-ie .x-tab-strip .x-tab-right {
+    position:relative;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+    margin-bottom:-1px;
+}
+
+/*
+ * Horrible hack for IE8 in quirks mode
+ */
+.ext-ie8 .x-tab-strip li {
+    position: relative;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top .x-tab-right {
+    top: 1px;
+}
+.ext-ie8 .x-tab-strip-top {
+    padding-top: 1;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top {
+    padding-top: 0;
+}
+.ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:3px;
+}
+.ext-border-box .ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:4px;
+}
+.ext-ie8 .x-tab-strip-bottom .x-tab-right{
+    top:0;
+}
+
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-bottom:5px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+    margin-top:-1px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-top:5px;
+}
+
+.x-tab-strip-top .x-tab-right {
+	background: transparent no-repeat 0 -51px;
+    padding-left:10px;
+}
+
+.x-tab-strip-top .x-tab-left {
+	background: transparent no-repeat right -351px;
+    padding-right:10px;
+}
+
+.x-tab-strip-top .x-tab-strip-inner {
+	background: transparent repeat-x 0 -201px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-right {
+	 background-position:0 -101px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-left {
+	 background-position:right -401px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-strip-inner {
+	 background-position:0 -251px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+	background-position: 0 0;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-left {
+	background-position: right -301px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-strip-inner {
+	background-position: 0 -151px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+    margin-right: 3px;
+    padding:0 10px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+    padding:0;
+}
+
+.x-tab-strip .x-tab-strip-close {
+    display:none;
+}
+
+.x-tab-strip-closable {
+    position:relative;
+}
+
+.x-tab-strip-closable .x-tab-left {
+    padding-right:19px;
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    opacity:.6;
+    -moz-opacity:.6;
+    background-repeat:no-repeat;
+    display:block;
+	width:11px;
+    height:11px;
+    position:absolute;
+    top:3px;
+    right:3px;
+    cursor:pointer;
+    z-index:2;
+}
+
+.x-tab-strip .x-tab-strip-active a.x-tab-strip-close {
+    opacity:.8;
+    -moz-opacity:.8;
+}
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+    opacity:1;
+    -moz-opacity:1;
+}
+
+.x-tab-panel-body {
+    border: 1px solid;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background: transparent no-repeat -18px 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    left:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background: transparent no-repeat 0 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    right:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+
+.x-tab-scroller-right-over {
+    background-position: -18px 0;
+}
+
+.x-tab-scroller-right-disabled {
+    background-position: 0 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scrolling-bottom .x-tab-scroller-left, .x-tab-scrolling-bottom .x-tab-scroller-right{
+    margin-top: 1px;
+}
+
+.x-tab-scrolling .x-tab-strip-wrap {
+    margin-left:18px;
+    margin-right:18px;
+}
+
+.x-tab-scrolling {
+    position:relative;    
+}
+
+.x-tab-panel-bbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-tab-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tree.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tree.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/tree.css	(revision 76)
@@ -0,0 +1,218 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-strict .ext-ie .x-tree .x-panel-bwrap{
+    position:relative;
+    overflow:hidden;
+}
+
+.x-tree-icon, .x-tree-ec-icon, .x-tree-elbow-line, .x-tree-elbow, .x-tree-elbow-end, .x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+    background-repeat: no-repeat;
+}
+
+.x-tree-node-collapsed .x-tree-node-icon, .x-tree-node-expanded .x-tree-node-icon, .x-tree-node-leaf .x-tree-node-icon{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	background-position:center;
+    background-repeat: no-repeat;
+}
+
+.ext-ie .x-tree-node-indent img, .ext-ie .x-tree-node-icon, .ext-ie .x-tree-ec-icon {
+    vertical-align: middle !important;
+}
+
+.ext-strict .ext-ie8 .x-tree-node-indent img, .ext-strict .ext-ie8 .x-tree-node-icon, .ext-strict .ext-ie8 .x-tree-ec-icon {
+    vertical-align: top !important;
+}
+
+/* checkboxes */
+
+input.x-tree-node-cb {
+    margin-left:1px;
+    height: 19px;
+	vertical-align: bottom;
+}
+
+.ext-ie input.x-tree-node-cb {
+    margin-left:0;
+    margin-top: 1px;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb{
+    margin: 1px 1px;
+    height: 14px;
+    vertical-align: bottom;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb + a{
+    vertical-align: bottom;
+}
+
+.ext-opera input.x-tree-node-cb {
+    height: 14px;
+    vertical-align: middle;
+}
+
+.x-tree-noicon .x-tree-node-icon{
+	width:0; height:0;
+}
+
+/* No line styles */
+.x-tree-no-lines .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+/* Arrows */
+.x-tree-arrows .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	cursor:pointer;
+}
+
+.ext-ie ul.x-tree-node-ct{
+    font-size:0;
+    line-height:0;
+    zoom:1;
+}
+
+.x-tree-node{
+	white-space: nowrap;
+}
+
+.x-tree-node-el {
+    line-height:18px;
+    cursor:pointer;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	text-decoration:none;
+	-khtml-user-select:none;
+	-moz-user-select:none;
+    -webkit-user-select:ignore;
+    -kthml-user-focus:normal;
+    -moz-user-focus:normal;
+    -moz-outline: 0 none;
+    outline:0 none;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	text-decoration:none;
+	padding:1px 3px 1px 2px;
+}
+
+.x-tree-node .x-tree-node-disabled .x-tree-node-icon{
+	-moz-opacity: 0.5;
+   opacity:.5;
+   filter: alpha(opacity=50);
+}
+
+.x-tree-node .x-tree-node-inline-icon{
+	background-color:transparent;
+}
+
+.x-tree-node a:hover, .x-dd-drag-ghost a:hover{
+	text-decoration:none;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:1px dotted;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top:1px dotted;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above{
+	 border-top:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom:2px solid;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top:2px solid;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 border:1px dotted;
+}
+
+.x-dd-drag-ghost .x-tree-node-indent, .x-dd-drag-ghost .x-tree-ec-icon{
+	display:none !important;
+}
+
+/* Fix for ie rootVisible:false issue */
+.x-tree-root-ct {
+    zoom:1;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel.css	(revision 76)
@@ -0,0 +1,493 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel {
+    border-style: solid;
+    border-width:0;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+    padding:5px 3px 4px 5px;
+    border:1px solid;
+    line-height: 15px;
+    background: transparent repeat-x 0 -1px;
+}
+
+.x-panel-body {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    position: relative; /* added for item scroll positioning */
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom: 0 none;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top:1px solid;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-tl .x-panel-header {
+    padding:5px 0 4px 0;
+    border:0 none;
+    background:transparent no-repeat;
+}
+
+.x-panel-tl .x-panel-icon, .x-window-tl .x-panel-icon {
+    padding-left:20px !important;
+    background-repeat:no-repeat;
+    background-position:0 4px;
+    zoom:1;
+}
+
+.x-panel-inline-icon {
+    width:16px;
+	height:16px;
+    background-repeat:no-repeat;
+    background-position:0 0;
+	vertical-align:middle;
+	margin-right:4px;
+	margin-top:-1px;
+	margin-bottom:-1px;
+}
+
+.x-panel-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+/* fix ie7 strict mode bug */
+.ext-strict .ext-ie7 .x-panel-tc {
+    overflow: visible;
+}
+
+.x-panel-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    border-bottom:1px solid;
+}
+
+.x-panel-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:6px;
+}
+
+.x-panel-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-panel-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-mc {
+    border:0 none;
+    padding:0;
+    margin:0;
+    padding-top:6px;
+}
+
+.x-panel-mc .x-panel-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-panel-ml {
+	background: repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-panel-bc, .x-panel-nofooter .x-window-bc {
+	height:6px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-panel-bwrap {
+    overflow:hidden;
+    zoom:1;
+    left:0;
+    top:0;
+}
+.x-panel-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-collapsed .x-resizable-handle{
+    display:none;
+}
+
+.ext-gecko .x-panel-animated div {
+    overflow:hidden !important;
+}
+
+/* Plain */
+.x-plain-body {
+    overflow:hidden;
+}
+
+.x-plain-bbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-tbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-plain {
+    overflow:hidden;
+}
+
+/* Tools */
+.x-tool {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    float:right;
+    cursor:pointer;
+    background:transparent no-repeat;
+    margin-left:2px;
+}
+
+/* expand / collapse tools */
+.x-tool-toggle {
+    background-position:0 -60px;
+}
+
+.x-tool-toggle-over {
+    background-position:-15px -60px;
+}
+
+.x-panel-collapsed .x-tool-toggle {
+    background-position:0 -75px;
+}
+
+.x-panel-collapsed .x-tool-toggle-over {
+    background-position:-15px -75px;
+}
+
+
+.x-tool-close {
+    background-position:0 -0;
+}
+
+.x-tool-close-over {
+    background-position:-15px 0;
+}
+
+.x-tool-minimize {
+    background-position:0 -15px;
+}
+
+.x-tool-minimize-over {
+    background-position:-15px -15px;
+}
+
+.x-tool-maximize {
+    background-position:0 -30px;
+}
+
+.x-tool-maximize-over {
+    background-position:-15px -30px;
+}
+
+.x-tool-restore {
+    background-position:0 -45px;
+}
+
+.x-tool-restore-over {
+    background-position:-15px -45px;
+}
+
+.x-tool-gear {
+    background-position:0 -90px;
+}
+
+.x-tool-gear-over {
+    background-position:-15px -90px;
+}
+
+.x-tool-prev {
+    background-position:0 -105px;
+}
+
+.x-tool-prev-over {
+    background-position:-15px -105px;
+}
+
+.x-tool-next {
+    background-position:0 -120px;
+}
+
+.x-tool-next-over {
+    background-position:-15px -120px;
+}
+
+.x-tool-pin {
+    background-position:0 -135px;
+}
+
+.x-tool-pin-over {
+    background-position:-15px -135px;
+}
+
+.x-tool-unpin {
+    background-position:0 -150px;
+}
+
+.x-tool-unpin-over {
+    background-position:-15px -150px;
+}
+
+.x-tool-right {
+    background-position:0 -165px;
+}
+
+.x-tool-right-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-left {
+    background-position:0 -180px;
+}
+
+.x-tool-left-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-down {
+    background-position:0 -195px;
+}
+
+.x-tool-down-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-up {
+    background-position:0 -210px;
+}
+
+.x-tool-up-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-refresh {
+    background-position:0 -225px;
+}
+
+.x-tool-refresh-over {
+    background-position:-15px -225px;
+}
+
+.x-tool-plus {
+    background-position:0 -240px;
+}
+
+.x-tool-plus-over {
+    background-position:-15px -240px;
+}
+
+.x-tool-minus {
+    background-position:0 -255px;
+}
+
+.x-tool-minus-over {
+    background-position:-15px -255px;
+}
+
+.x-tool-search {
+    background-position:0 -270px;
+}
+
+.x-tool-search-over {
+    background-position:-15px -270px;
+}
+
+.x-tool-save {
+    background-position:0 -285px;
+}
+
+.x-tool-save-over {
+    background-position:-15px -285px;
+}
+
+.x-tool-help {
+    background-position:0 -300px;
+}
+
+.x-tool-help-over {
+    background-position:-15px -300px;
+}
+
+.x-tool-print {
+    background-position:0 -315px;
+}
+
+.x-tool-print-over {
+    background-position:-15px -315px;
+}
+
+.x-tool-expand {
+    background-position:0 -330px;
+}
+
+.x-tool-expand-over {
+    background-position:-15px -330px;
+}
+
+.x-tool-collapse {
+    background-position:0 -345px;
+}
+
+.x-tool-collapse-over {
+    background-position:-15px -345px;
+}
+
+.x-tool-resize {
+    background-position:0 -360px;
+}
+
+.x-tool-resize-over {
+    background-position:-15px -360px;
+}
+
+.x-tool-move {
+    background-position:0 -375px;
+}
+
+.x-tool-move-over {
+    background-position:-15px -375px;
+}
+
+/* Ghosting */
+.x-panel-ghost {
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    opacity:.65;
+    -moz-opacity:.65;
+    filter:alpha(opacity=65);
+}
+
+.x-panel-ghost ul {
+    margin:0;
+    padding:0;
+    overflow:hidden;
+    font-size:0;
+    line-height:0;
+    border:1px solid;
+    border-top:0 none;
+    display:block;
+}
+
+.x-panel-ghost * {
+    cursor:move !important;
+}
+
+.x-panel-dd-spacer {
+    border:2px dashed;
+}
+
+/* Buttons */
+.x-panel-btns {
+    padding:5px;
+    overflow:hidden;
+}
+
+.x-panel-btns td.x-toolbar-cell{
+	padding:3px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-left{
+	background-position:0 -147px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-right{
+	background-position:0 -168px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-center{
+	background-position:0 -189px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-center{
+	background-position:0 -105px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-center{
+	background-position:0 -126px;
+}
+
+.x-panel-btns .x-btn-click  .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+	white-space: nowrap;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/combo.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/combo.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/combo.css	(revision 76)
@@ -0,0 +1,45 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-combo-list {
+    border:1px solid;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-combo-list-inner {
+    overflow:auto;
+    position:relative; /* for calculating scroll offsets */
+    zoom:1;
+    overflow-x:hidden;
+}
+
+.x-combo-list-hd {
+    border-bottom:1px solid;
+    padding:3px;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom:1px solid;
+}
+
+.x-combo-list-item {
+    padding:2px;
+    border:1px solid;
+    white-space: nowrap;
+    overflow:hidden;
+    text-overflow: ellipsis;
+}
+
+.x-combo-list .x-combo-selected{
+	border:1px dotted !important;
+    cursor:pointer;
+}
+
+.x-combo-list .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dialog.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dialog.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dialog.css	(revision 76)
@@ -0,0 +1,59 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-dlg .x-window-body {
+    border:0 none !important;
+    padding:5px 10px;
+    overflow:hidden !important;
+}
+
+.x-window-dlg .x-window-mc {
+    border:0 none !important;
+}
+
+.x-window-dlg .ext-mb-input {
+    margin-top:4px;
+    width:95%;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    margin-top:4px;
+}
+
+.x-window-dlg .x-progress-wrap {
+    margin-top:4px;
+}
+
+.ext-ie .x-window-dlg .x-progress-wrap {
+    margin-top:6px;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background:transparent no-repeat left;
+    display:block;
+    width:300px;
+    padding-left:18px;
+    line-height:18px;
+}
+
+.x-window-dlg .ext-mb-icon {
+    float:left;
+    width:47px;
+    height:32px;
+}
+
+.x-window-dlg .x-dlg-icon .ext-mb-content{
+    zoom: 1; 
+    margin-left: 47px;
+}
+
+.x-window-dlg .ext-mb-info, .x-window-dlg .ext-mb-warning, .x-window-dlg .ext-mb-question, .x-window-dlg .ext-mb-error {
+    background:transparent no-repeat top left;
+}
+
+.ext-gecko2 .ext-mb-fix-cursor {
+    overflow:auto;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/qtips.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/qtips.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/qtips.css	(revision 76)
@@ -0,0 +1,153 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tip{
+	position: absolute;
+	top: 0;
+    left:0;
+    visibility: hidden;
+	z-index: 20002;
+    border:0 none;
+}
+
+.x-tip .x-tip-close{
+	height: 15px;
+	float:right;
+	width: 15px;
+    margin:0 0 2px 2px;
+    cursor:pointer;
+    display:none;
+}
+
+.x-tip .x-tip-tc {
+	background: transparent no-repeat 0 -62px;
+	padding-top:3px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-bc {
+	background: transparent no-repeat 0 -121px;
+	height:3px;
+    overflow:hidden;
+}
+
+.x-tip .x-tip-bl {
+	background: transparent no-repeat 0 -59px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-br {
+	background: transparent no-repeat right -59px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mc {
+    border:0 none;
+}
+
+.x-tip .x-tip-ml {
+	background: no-repeat 0 -124px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mr {
+	background: transparent no-repeat right -124px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.ext-ie .x-tip .x-tip-header,.ext-ie .x-tip .x-tip-tc {
+    font-size:0;
+    line-height:0;
+}
+
+.ext-border-box .x-tip .x-tip-header, .ext-border-box .x-tip .x-tip-tc{
+    line-height: 1px;
+}
+
+.x-tip .x-tip-header-text {
+    padding:0;
+    margin:0 0 2px 0;
+}
+
+.x-tip .x-tip-body {
+    margin:0 !important;
+    line-height:14px;
+    padding:0;
+}
+
+.x-tip .x-tip-body .loading-indicator {
+    margin:0;
+}
+
+.x-tip-draggable .x-tip-header,.x-tip-draggable .x-tip-header-text {
+    cursor:move;
+}
+
+.x-form-invalid-tip .x-tip-tc {
+	background: repeat-x 0 -12px;
+    padding-top:6px;
+}
+
+.x-form-invalid-tip .x-tip-bc {
+	background: repeat-x 0 -18px;
+    height:6px;
+}
+
+.x-form-invalid-tip .x-tip-bl {
+	background: no-repeat 0 -6px;
+}
+
+.x-form-invalid-tip .x-tip-br {
+	background: no-repeat right -6px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding:2px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding-left:24px;
+    background:transparent no-repeat 2px 2px;
+}
+
+.x-tip-anchor {
+    position: absolute;
+    width: 9px;
+    height: 10px;
+    overflow:hidden;
+    background: transparent no-repeat 0 0;
+    zoom:1;
+}
+.x-tip-anchor-bottom {
+    background-position: -9px 0;
+}
+.x-tip-anchor-right {
+    background-position: -18px 0;
+    width: 10px;
+}
+.x-tip-anchor-left {
+    background-position: -28px 0;
+    width: 10px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/borders.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/borders.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/borders.css	(revision 76)
@@ -0,0 +1,54 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel-noborder .x-panel-body-noborder {
+    border-width:0;
+}
+
+.x-panel-noborder .x-panel-header-noborder {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-width:1px 0 0 0;
+    border-style:solid;
+}
+
+.x-window-noborder .x-window-mc {
+    border-width:0;
+}
+
+.x-window-plain .x-window-body-noborder {
+    border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-body-noborder {
+	border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-header-noborder {
+    border-width: 0 0 1px 0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-footer-noborder {
+    border-width: 1px 0 0 0;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-width: 1px 0 0 0;
+    border-style:solid;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/toolbar.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/toolbar.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/toolbar.css	(revision 76)
@@ -0,0 +1,246 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-toolbar{
+    border-style:solid;
+    border-width:0 0 1px 0;
+    display: block;
+	padding:2px;
+    background:repeat-x top left;
+    position:relative;
+    left:0;
+    top:0;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-toolbar-left {
+    width: 100%;
+}
+
+.x-toolbar .x-item-disabled .x-btn-icon {
+    opacity: .35;
+    -moz-opacity: .35;
+    filter: alpha(opacity=35);
+}
+
+.x-toolbar td {
+	vertical-align:middle;
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+	white-space: nowrap;
+}
+
+.x-toolbar .x-item-disabled {
+	cursor:default;
+	opacity:.6;
+	-moz-opacity:.6;
+	filter:alpha(opacity=60);
+}
+
+.x-toolbar .x-item-disabled * {
+	cursor:default;
+}
+
+.x-toolbar .x-toolbar-cell {
+    vertical-align:middle;
+}
+
+.x-toolbar .x-btn-tl, .x-toolbar .x-btn-tr, .x-toolbar .x-btn-tc, .x-toolbar .x-btn-ml, .x-toolbar .x-btn-mr,
+.x-toolbar .x-btn-mc, .x-toolbar .x-btn-bl, .x-toolbar .x-btn-br, .x-toolbar .x-btn-bc
+{
+	background-position: 500px 500px;
+}
+
+/* These rules are duplicated from button.css to give priority of x-toolbar rules above */
+.x-toolbar .x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-toolbar .x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-toolbar .x-btn-click .x-btn-tl, .x-toolbar .x-btn-menu-active .x-btn-tl, .x-toolbar .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tr, .x-toolbar .x-btn-menu-active .x-btn-tr, .x-toolbar .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tc, .x-toolbar .x-btn-menu-active .x-btn-tc, .x-toolbar .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-toolbar .x-btn-click .x-btn-ml, .x-toolbar .x-btn-menu-active .x-btn-ml, .x-toolbar .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mr, .x-toolbar .x-btn-menu-active .x-btn-mr, .x-toolbar .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mc, .x-toolbar .x-btn-menu-active .x-btn-mc, .x-toolbar .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bl, .x-toolbar .x-btn-menu-active .x-btn-bl, .x-toolbar .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-br, .x-toolbar .x-btn-menu-active .x-btn-br, .x-toolbar .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bc, .x-toolbar .x-btn-menu-active .x-btn-bc, .x-toolbar .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-toolbar div.xtb-text{
+    padding:2px 2px 0;
+    line-height:16px;
+    display:block;
+}
+
+.x-toolbar .xtb-sep {
+	background-position: center;
+	background-repeat: no-repeat;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	width:4px;
+	overflow: hidden;
+	cursor:default;
+	margin: 0 2px 0;
+	border:0;
+}
+
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+
+/* Paging Toolbar */
+.x-tbar-page-number{
+	width:30px;
+	height:14px;
+}
+
+.ext-ie .x-tbar-page-number{
+    margin-top: 2px;
+}
+
+.x-paging-info {
+    position:absolute;
+    top:5px;
+    right: 8px;
+}
+
+/* floating */
+.x-toolbar-ct {
+    width:100%;
+}
+
+.x-toolbar-right td {
+    text-align: center;
+}
+
+.x-panel-tbar, .x-panel-bbar, .x-window-tbar, .x-window-bbar, .x-tab-panel-tbar, .x-tab-panel-bbar, .x-plain-tbar, .x-plain-bbar {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-toolbar-more .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 12px;
+}
+
+.x-toolbar-more em.x-btn-arrow {
+    display:inline;
+    background-color:transparent;
+	padding-right:0;
+}
+
+.x-toolbar-more .x-btn-mc em.x-btn-arrow {
+    background-image: none;
+}
+
+div.x-toolbar-no-items {
+    color:gray !important;
+    padding:5px 10px !important;
+}
+
+/* fix ie toolbar form items */
+.ext-border-box .x-toolbar-cell .x-form-text {
+    margin-bottom:-1px !important;
+}
+
+.ext-border-box .x-toolbar-cell .x-form-field-wrap .x-form-text {
+    margin:0 !important;
+}
+
+.ext-ie .x-toolbar-cell .x-form-field-wrap {
+    height:21px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-text, .ext-strict .ext-ie .x-toolbar-cell .x-form-text {
+    top: 0px;
+}
+
+.x-toolbar-right td .x-form-field-trigger-wrap{
+    text-align: left;
+}
+
+.x-toolbar-cell .x-form-checkbox, .x-toolbar-cell .x-form-radio{
+    margin-top: 5px;
+}
+
+.x-toolbar-cell .x-form-cb-label{
+    vertical-align: bottom;
+    top: 1px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-checkbox, .ext-ie .x-toolbar-cell .x-form-radio{
+    margin-top: 4px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-cb-label{
+    top: 0;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/form.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/form.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/form.css	(revision 76)
@@ -0,0 +1,597 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/* all fields */
+.x-form-field{
+    margin: 0 0 0 0;
+}
+
+.ext-webkit *:focus{
+    outline: none !important;
+}
+
+/* ---- text fields ---- */
+.x-form-text, textarea.x-form-field{
+    padding:1px 3px;
+    background:repeat-x 0 0;
+    border:1px solid;
+}
+
+textarea.x-form-field {
+    padding:2px 3px;
+}
+
+.x-form-text, .ext-ie .x-form-file {
+    height:22px;
+    line-height:18px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-form-text, .ext-ie7 .x-form-text {
+    margin:-1px 0; /* ie bogus margin bug */
+    height:22px; /* ie quirks */
+    line-height:18px;
+}
+
+.x-quirks .ext-ie9 .x-form-text {
+    height: 22px;
+    padding-top: 3px;
+    padding-bottom: 0px;
+}
+
+/* Ugly hacks for the bogus 1px margin bug in IE9 quirks */
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-text,
+.x-quirks .ext-ie9 .x-form-field-trigger-wrap .x-form-text {
+    margin-top: -1px;
+    margin-bottom: -1px;
+}
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-element {
+    margin-bottom: -1px;
+}
+
+.ext-ie6 .x-form-field-wrap .x-form-file-btn, .ext-ie7 .x-form-field-wrap .x-form-file-btn {
+    top: -1px; /* because of all these margin hacks, these buttons are off by one pixel in IE6,7 */
+}
+
+.ext-ie6 textarea.x-form-field, .ext-ie7 textarea.x-form-field {
+    margin:-1px 0; /* ie bogus margin bug */
+}
+
+.ext-strict .x-form-text {
+    height:18px;
+}
+
+.ext-safari.ext-mac textarea.x-form-field {
+    margin-bottom:-2px; /* another bogus margin bug, safari/mac only */
+}
+
+/*
+.ext-strict .ext-ie8 .x-form-text, .ext-strict .ext-ie8 textarea.x-form-field {
+    margin-bottom: 1px;
+}
+*/
+
+.ext-gecko .x-form-text , .ext-ie8 .x-form-text {
+    padding-top:2px; /* FF won't center the text vertically */
+    padding-bottom:0;
+}
+
+.ext-ie6 .x-form-composite .x-form-text.x-box-item, .ext-ie7 .x-form-composite .x-form-text.x-box-item {
+    margin: 0 !important; /* clear ie bogus margin bug fix */
+}
+
+textarea {
+    resize: none;  /* Disable browser resizable textarea */
+}
+
+/* select boxes */
+.x-form-select-one {
+    height:20px;
+    line-height:18px;
+    vertical-align:middle;
+    border: 1px solid;
+}
+
+/* multi select boxes */
+
+/* --- TODO --- */
+
+/* 2.0.2 style */
+.x-form-check-wrap {
+    line-height:18px;
+    height: auto;
+}
+
+.ext-ie .x-form-check-wrap input {
+    width:15px;
+    height:15px;
+}
+
+.x-form-check-wrap input{
+    vertical-align: bottom;
+}
+
+.x-editor .x-form-check-wrap {
+    padding:3px;
+}
+
+.x-editor .x-form-checkbox {
+    height:13px;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid;
+    margin-bottom: 5px;
+    padding-left: 3px !important;
+    float: none !important;
+}
+
+/* wrapped fields and triggers */
+.x-form-field-wrap .x-form-trigger{
+    width:17px;
+    height:21px;
+    border:0;
+    background:transparent no-repeat 0 0;
+    cursor:pointer;
+    border-bottom: 1px solid;
+    position:absolute;
+    top:0;
+}
+
+.x-form-field-wrap .x-form-date-trigger, .x-form-field-wrap .x-form-clear-trigger, .x-form-field-wrap .x-form-search-trigger{
+    cursor:pointer;
+}
+
+.x-form-field-wrap .x-form-twin-triggers .x-form-trigger{
+    position:static;
+    top:auto;
+    vertical-align:top;
+}
+
+.x-form-field-wrap {
+    position:relative;
+    left:0;top:0;
+    text-align: left;
+    zoom:1;
+    white-space: nowrap;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-trigger {
+    right: 0; /* IE8 Strict mode trigger bug */
+}
+
+.x-form-field-wrap .x-form-trigger-over{
+    background-position:-17px 0;
+}
+
+.x-form-field-wrap .x-form-trigger-click{
+    background-position:-34px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    background-position:-51px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-over{
+    background-position:-68px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-click{
+    background-position:-85px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-trigger-noedit{
+    cursor:pointer;
+}
+
+/* field focus style */
+.x-form-focus, textarea.x-form-focus{
+    border: 1px solid;
+}
+
+/* invalid fields */
+.x-form-invalid, textarea.x-form-invalid{
+    background:repeat-x bottom;
+    border: 1px solid;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background:repeat-x bottom;
+}
+
+/* editors */
+.x-editor {
+    visibility:hidden;
+    padding:0;
+    margin:0;
+}
+
+.x-form-grow-sizer {
+    left: -10000px;
+    padding: 8px 3px;
+    position: absolute;
+    visibility:hidden;
+    top: -10000px;
+    white-space: pre-wrap;
+    white-space: -moz-pre-wrap;
+    white-space: -pre-wrap;
+    white-space: -o-pre-wrap;
+    word-wrap: break-word;
+    zoom:1;
+}
+
+.x-form-grow-sizer p {
+    margin:0 !important;
+    border:0 none !important;
+    padding:0 !important;
+}
+
+/* Form Items CSS */
+
+.x-form-item {
+    display:block;
+    margin-bottom:4px;
+    zoom:1;
+}
+
+.x-form-item label.x-form-item-label {
+    display:block;
+    float:left;
+    width:100px;
+    padding:3px;
+    padding-left:0;
+    clear:left;
+    z-index:2;
+    position:relative;
+}
+
+.x-form-element {
+    padding-left:105px;
+    position:relative;
+}
+
+.x-form-invalid-msg {
+    padding:2px;
+    padding-left:18px;
+    background: transparent no-repeat 0 2px;
+    line-height:16px;
+    width:200px;
+}
+
+.x-form-label-left label.x-form-item-label {
+   text-align:left;
+}
+
+.x-form-label-right label.x-form-item-label {
+   text-align:right;
+}
+
+.x-form-label-top .x-form-item label.x-form-item-label {
+    width:auto;
+    float:none;
+    clear:none;
+    display:inline;
+    margin-bottom:4px;
+    position:static;
+}
+
+.x-form-label-top .x-form-element {
+    padding-left:0;
+    padding-top:4px;
+}
+
+.x-form-label-top .x-form-item {
+    padding-bottom:4px;
+}
+
+/* Editor small font for grid, toolbar and tree */
+.x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    margin-top:-1px !important; /* ie bogus margin bug */
+    margin-bottom:-1px !important;
+    height:20px !important; /* ie quirks */
+    line-height:16px !important;
+}
+
+.ext-strict .x-small-editor .x-form-text {
+    height:16px !important;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+}
+
+.ext-border-box .x-small-editor .x-form-text {
+    height:20px;
+}
+
+.x-small-editor .x-form-select-one {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.x-small-editor .x-form-num-field {
+    text-align:right;
+}
+
+.x-small-editor .x-form-field-wrap .x-form-trigger{
+    height:19px;
+}
+
+.ext-webkit .x-small-editor .x-form-text{padding-top:3px;font-size:100%;}
+
+.ext-strict .ext-webkit .x-small-editor .x-form-text{
+    height:14px !important;
+}
+
+.x-form-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+.x-form-clear-left {
+    clear:left;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.ext-ie6 .x-form-check-wrap input, .ext-border-box .x-form-check-wrap input{
+   margin-top: 3px;
+}
+
+.x-form-cb-label {
+    position: relative;
+    margin-left:4px;
+    top: 2px;
+}
+
+.ext-ie .x-form-cb-label{
+    top: 1px;
+}
+
+.ext-ie6 .x-form-cb-label, .ext-border-box .x-form-cb-label{
+    top: 3px;
+}
+
+.x-form-display-field{
+    padding-top: 2px;
+}
+
+.ext-gecko .x-form-display-field, .ext-strict .ext-ie7 .x-form-display-field{
+    padding-top: 1px;
+}
+
+.ext-ie .x-form-display-field{
+    padding-top: 3px;
+}
+
+.ext-strict .ext-ie8 .x-form-display-field{
+    padding-top: 0;
+}
+
+.x-form-column {
+    float:left;
+    padding:0;
+    margin:0;
+    width:48%;
+    overflow:hidden;
+    zoom:1;
+}
+
+/* buttons */
+.x-form .x-form-btns-ct .x-btn{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns td {
+    border:0;
+    padding:0;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-right table{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-left table{
+    float:left;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center{
+    text-align:center; /*ie*/
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center table{
+    margin:0 auto; /*everyone else*/
+}
+
+.x-form .x-form-btns-ct table td.x-form-btn-td{
+    padding:3px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-left{
+    background-position:0 -147px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-right{
+    background-position:0 -168px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-center{
+    background-position:0 -189px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-center{
+    background-position:0 -126px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click  .x-btn-right{
+    background-position:0 -84px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-left{
+    background-position:0 -63px;
+}
+
+.x-form-invalid-icon {
+    width:16px;
+    height:18px;
+    visibility:hidden;
+    position:absolute;
+    left:0;
+    top:0;
+    display:block;
+    background:transparent no-repeat 0 2px;
+}
+
+/* fieldsets */
+.x-fieldset {
+    border:1px solid;
+    padding:10px;
+    margin-bottom:10px;
+    display:block; /* preserve margins in IE */
+}
+
+/* make top of checkbox/tools visible in webkit */
+.ext-webkit .x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset legend {
+    margin-bottom:10px;
+}
+
+.ext-strict .ext-ie9 .x-fieldset legend.x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset {
+    padding-top: 0;
+    padding-bottom:10px;
+}
+
+.x-fieldset legend .x-tool-toggle {
+    margin-right:3px;
+    margin-left:0;
+    float:left !important;
+}
+
+.x-fieldset legend input {
+    margin-right:3px;
+    float:left !important;
+    height:13px;
+    width:13px;
+}
+
+fieldset.x-panel-collapsed {
+    padding-bottom:0 !important;
+    border-width: 1px 1px 0 1px !important;
+    border-left-color: transparent;
+    border-right-color: transparent;
+}
+
+.ext-ie6 fieldset.x-panel-collapsed{
+    padding-bottom:0 !important;
+    border-width: 1px 0 0 0 !important;
+    margin-left: 1px;
+    margin-right: 1px;
+}
+
+fieldset.x-panel-collapsed .x-fieldset-bwrap {
+    visibility:hidden;
+    position:absolute;
+    left:-1000px;
+    top:-1000px;
+}
+
+.ext-ie .x-fieldset-bwrap {
+    zoom:1;
+}
+
+.x-fieldset-noborder {
+    border:0px none transparent;
+}
+
+.x-fieldset-noborder legend {
+    margin-left:-3px;
+}
+
+/* IE legend positioning bug */
+.ext-ie .x-fieldset-noborder legend {
+    position: relative;
+    margin-bottom:23px;
+}
+.ext-ie .x-fieldset-noborder legend span {
+    position: absolute;
+    left:16px;
+}
+
+.ext-gecko .x-window-body .x-form-item {
+    -moz-outline: none;
+    outline: none;
+    overflow: auto;
+}
+
+.ext-mac.ext-gecko .x-window-body .x-form-item {
+    overflow:hidden;
+}
+
+.ext-gecko .x-form-item {
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-hide-label label.x-form-item-label {
+     display:none;
+}
+
+.x-hide-label .x-form-element {
+     padding-left: 0 !important;
+}
+
+.x-form-label-top .x-hide-label label.x-form-item-label{
+    display: none;
+}
+
+.x-fieldset {
+    overflow:hidden;
+}
+
+.x-fieldset-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-fieldset-body {
+    overflow:hidden;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/progress.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/progress.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/progress.css	(revision 76)
@@ -0,0 +1,46 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-progress-wrap {
+    border:1px solid;
+    overflow:hidden;
+}
+
+.x-progress-inner {
+    height:18px;
+    background:repeat-x;
+    position:relative;
+}
+
+.x-progress-bar {
+    height:18px;
+    float:left;
+    width:0;
+    background: repeat-x left center;
+    border-top:1px solid;
+    border-bottom:1px solid;
+    border-right:1px solid;
+}
+
+.x-progress-text {
+    padding:1px 5px;
+    overflow:hidden;
+    position:absolute;
+    left:0;
+    text-align:center;
+}
+
+.x-progress-text-back {
+    line-height:16px;
+}
+
+.ext-ie .x-progress-text-back {
+    line-height:15px;
+}
+
+.ext-strict .ext-ie7 .x-progress-text-back{
+    width: 100%;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/menu.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/menu.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/menu.css	(revision 76)
@@ -0,0 +1,245 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-menu {
+	z-index: 15000;
+	zoom: 1;
+	background: repeat-y;
+}
+
+.x-menu-floating{
+    border: 1px solid;
+}
+
+.x-menu a {
+    text-decoration: none !important;
+}
+
+.ext-ie .x-menu {
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-menu-list{
+    padding: 2px;
+	background-color:transparent;
+	border:0 none;
+    overflow:hidden;
+    overflow-y: hidden;
+}
+
+.ext-strict .ext-ie .x-menu-list{
+    position: relative;
+}
+
+.x-menu li{
+	line-height:100%;
+}
+
+.x-menu li.x-menu-sep-li{
+	font-size:1px;
+	line-height:1px;
+}
+
+.x-menu-list-item{
+    white-space: nowrap;
+	display:block;
+	padding:1px;
+}
+
+.x-menu-item{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-menu-item-arrow{
+	background:transparent no-repeat right;
+}
+
+.x-menu-sep {
+	display:block;
+	font-size:1px;
+	line-height:1px;
+	margin: 2px 3px;
+	border-bottom:1px solid;
+    overflow:hidden;
+}
+
+.x-menu-focus {
+	position:absolute;
+	left:-1px;
+	top:-1px;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+    overflow:hidden;
+    display:block;
+}
+
+a.x-menu-item {
+    cursor: pointer;
+    display: block;
+    line-height: 16px;
+    outline-color: -moz-use-text-color;
+    outline-style: none;
+    outline-width: 0;
+    padding: 3px 21px 3px 27px;
+    position: relative;
+    text-decoration: none;
+    white-space: nowrap;
+}
+
+.x-menu-item-active {
+    background-repeat: repeat-x;
+    background-position: left bottom;
+    border-style:solid;
+    border-width: 1px 0;
+    margin:0 1px;
+	padding: 0;
+}
+
+.x-menu-item-active a.x-menu-item {
+    border-style:solid;
+    border-width:0 1px;
+    margin:0 -1px;
+}
+
+.x-menu-item-icon {
+	border: 0 none;
+	height: 16px;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	position: absolute;
+    left: 3px;
+    top: 3px;
+    margin: 0;
+    background-position:center;
+}
+
+.ext-ie .x-menu-item-icon {
+    left: -24px;
+}
+.ext-strict .x-menu-item-icon {
+    left: 3px;
+}
+
+.ext-ie6 .x-menu-item-icon {
+    left: -24px;
+}
+
+.ext-ie .x-menu-item-icon {
+    vertical-align: middle;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background: transparent no-repeat center;
+}
+
+.x-menu-group-item .x-menu-item-icon{
+	background-color: transparent;
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background: transparent no-repeat center;
+}
+
+.x-date-menu .x-menu-list{
+    padding: 0;
+}
+
+.x-menu-date-item{
+	padding:0;
+}
+
+.x-menu .x-color-palette, .x-menu .x-date-picker{
+    margin-left: 26px;
+	margin-right:4px;
+}
+
+.x-menu .x-date-picker{
+    border:1px solid;
+    margin-top:2px;
+    margin-bottom:2px;
+}
+
+.x-menu-plain .x-color-palette, .x-menu-plain .x-date-picker{
+	 margin: 0;
+	 border: 0 none;
+}
+
+.x-date-menu {
+   padding:0 !important;
+}
+
+/*
+ * fixes separator visibility problem in IE 6
+ */
+.ext-strict .ext-ie6 .x-menu-sep-li {
+    padding: 3px 4px;
+}
+.ext-strict .ext-ie6 .x-menu-sep {
+    margin: 0;
+    height: 1px;
+}
+
+/*
+ * Fixes an issue with "fat" separators in webkit
+ */
+.ext-webkit .x-menu-sep{
+    height: 1px;
+}
+
+/*
+ * Ugly mess to remove the white border under the picker
+ */
+.ext-ie .x-date-menu{
+    height: 199px;
+}
+
+.ext-strict .ext-ie .x-date-menu, .ext-border-box .ext-ie8 .x-date-menu{
+    height: 197px;
+}
+
+.ext-strict .ext-ie7 .x-date-menu{
+    height: 195px;
+}
+
+.ext-strict .ext-ie8 .x-date-menu{
+    height: auto;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border:1px dotted !important;
+	padding:0;
+}
+
+.x-menu .x-menu-scroller {
+    width: 100%;
+	background-repeat:no-repeat;
+	background-position:center;
+	height:8px;
+    line-height: 8px;
+	cursor:pointer;
+    margin: 0;
+    padding: 0;
+}
+
+.x-menu .x-menu-scroller-active{
+    height: 6px;
+    line-height: 6px;
+}
+
+.x-menu-list-item-indent{
+    padding-left: 27px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/window.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/window.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/window.css	(revision 76)
@@ -0,0 +1,222 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window {
+    zoom:1;
+}
+
+.x-window .x-window-handle {
+    opacity:0;
+    -moz-opacity:0;
+    filter:alpha(opacity=0);
+}
+
+.x-window-proxy {
+    border:1px solid;
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    display:none;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-window-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-window-bwrap {
+    z-index:1;
+    position:relative;
+    zoom:1;
+    left:0;top:0;
+}
+
+.x-window-tl .x-window-header {
+    padding:5px 0 4px 0;
+}
+
+.x-window-header-text {
+    cursor:pointer;
+}
+
+.x-window-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    zoom:1;
+}
+
+.x-window-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    z-index:1;
+    position:relative;
+}
+
+.x-window-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+}
+
+.x-window-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-window-bc .x-window-footer {
+    padding-bottom:6px;
+    zoom:1;
+    font-size:0;
+    line-height:0;
+}
+
+.x-window-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-mc {
+    border:1px solid;
+    padding:0;
+    margin:0;
+}
+
+.x-window-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-body {
+    overflow:hidden;
+}
+
+.x-window-bwrap {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-bl, .x-window-maximized .x-window-br,
+    .x-window-maximized .x-window-ml, .x-window-maximized .x-window-mr,
+    .x-window-maximized .x-window-tl, .x-window-maximized .x-window-tr {
+    padding:0;
+}
+
+.x-window-maximized .x-window-footer {
+    padding-bottom:0;
+}
+
+.x-window-maximized .x-window-tc {
+    padding-left:3px;
+    padding-right:3px;
+}
+
+.x-window-maximized .x-window-mc {
+    border-left:0 none;
+    border-right:0 none;
+}
+
+.x-window-tbar .x-toolbar, .x-window-bbar .x-toolbar {
+    border-left:0 none;
+    border-right: 0 none;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}
+
+.x-window-draggable, .x-window-draggable .x-window-header-text {
+    cursor:move;
+}
+
+.x-window-maximized .x-window-draggable, .x-window-maximized .x-window-draggable .x-window-header-text {
+    cursor:default;
+}
+
+.x-window-body {
+    background-color:transparent;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-window-maximized-ct {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-handle {
+    display:none;
+}
+
+.x-window-sizing-ghost ul {
+    border:0 none !important;
+}
+
+.x-dlg-focus{
+	-moz-outline:0 none;
+	outline:0 none;
+	width:0;
+	height:0;
+	overflow:hidden;
+	position:absolute;
+	top:0;
+	left:0;
+}
+
+.ext-webkit .x-dlg-focus{
+    width: 1px;
+    height: 1px;
+}
+
+.x-dlg-mask{
+    z-index:10000;
+    display:none;
+    position:absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity:.50;
+    filter: alpha(opacity=50);
+}
+
+body.ext-ie6.x-body-masked select {
+	visibility:hidden;
+}
+
+body.ext-ie6.x-body-masked .x-window select {
+	visibility:visible;
+}
+
+.x-window-plain .x-window-mc {
+    border: 1px solid;
+}
+
+.x-window-plain .x-window-body {
+    border: 1px solid;
+    background:transparent !important;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/pivotgrid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/pivotgrid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/pivotgrid.css	(revision 76)
@@ -0,0 +1,65 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-pivotgrid .x-grid3-header-offset table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-header-offset table td {
+    padding: 4px 3px 4px 5px;
+    text-align: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    line-height: 13px;
+    font-family: tahoma;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    display: block;
+    float: left;
+}
+
+.x-pivotgrid .x-grid3-row-headers table {
+    height: 100%;
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    height: 18px;
+    padding: 2px 7px 0 0;
+    text-align: right;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    font-family: tahoma;
+}
+
+.ext-gecko .x-pivotgrid .x-grid3-row-headers table td {
+    height: 21px;
+}
+
+.x-grid3-header-title {
+    top: 0%;
+    left: 0%;
+    position: absolute;
+    text-align: center;
+    vertical-align: middle;
+    font-family: tahoma;
+    font-size: 11px;
+    padding: auto 1px;
+    display: table-cell;
+}
+
+.x-grid3-header-title span {
+    position: absolute;
+    top: 50%;
+    left: 0%;
+    width: 100%;
+    margin-top: -6px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/button.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/button.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/button.css	(revision 76)
@@ -0,0 +1,445 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-btn{
+	cursor:pointer;
+	white-space: nowrap;
+}
+
+.x-btn button{
+    border:0 none;
+    background-color:transparent;
+    padding-left:3px;
+    padding-right:3px;
+    cursor:pointer;
+    margin:0;
+    overflow:visible;
+    width:auto;
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+* html .ext-ie .x-btn button {
+    width:1px;
+}
+
+.ext-gecko .x-btn button, .ext-webkit .x-btn button {
+    padding-left:0;
+    padding-right:0;
+}
+
+.ext-gecko .x-btn button::-moz-focus-inner {
+    padding:0;
+}
+
+.ext-ie .x-btn button {
+    padding-top:2px;
+}
+
+.x-btn td {
+    padding:0 !important;
+}
+
+.x-btn-text {
+    cursor:pointer;
+	white-space: nowrap;
+    padding:0;
+}
+
+/* icon placement and sizing styles */
+
+/* Only text */
+.x-btn-noicon .x-btn-small .x-btn-text{
+	height: 16px;
+}
+
+.x-btn-noicon .x-btn-medium .x-btn-text{
+    height: 24px;
+}
+
+.x-btn-noicon .x-btn-large .x-btn-text{
+    height: 32px;
+}
+
+/* Only icons */
+.x-btn-icon .x-btn-text{
+    background-position: center;
+	background-repeat: no-repeat;
+}
+
+.x-btn-icon .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 16px;
+}
+
+.x-btn-icon .x-btn-medium .x-btn-text{
+    height: 24px;
+	width: 24px;
+}
+
+.x-btn-icon .x-btn-large .x-btn-text{
+    height: 32px;
+	width: 32px;
+}
+
+/* Icons and text */
+/* left */
+.x-btn-text-icon .x-btn-icon-small-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:34px;
+    height:32px;
+}
+
+/* top */
+.x-btn-text-icon .x-btn-icon-small-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:34px;
+}
+
+/* right */
+.x-btn-text-icon .x-btn-icon-small-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:34px;
+    height:32px;
+}
+
+/* bottom */
+.x-btn-text-icon .x-btn-icon-small-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:34px;
+}
+
+/* background positioning */
+.x-btn-tr i, .x-btn-tl i, .x-btn-mr i, .x-btn-ml i, .x-btn-br i, .x-btn-bl i{
+	font-size:1px;
+    line-height:1px;
+    width:3px;
+    display:block;
+    overflow:hidden;
+}
+
+.x-btn-tr i, .x-btn-tl i, .x-btn-br i, .x-btn-bl i{
+	height:3px;
+}
+
+.x-btn-tl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 0;
+}
+.x-btn-tr{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px 0;
+}
+.x-btn-tc{
+	height:3px;
+	background:repeat-x 0 -6px;
+}
+
+.x-btn-ml{
+	width:3px;
+	background:no-repeat 0 -24px;
+}
+.x-btn-mr{
+	width:3px;
+	background:no-repeat -3px -24px;
+}
+
+.x-btn-mc{
+	background:repeat-x 0 -1096px;
+    vertical-align: middle;
+	text-align:center;
+	padding:0 5px;
+	cursor:pointer;
+	white-space:nowrap;
+}
+
+/* Fixes an issue with the button height */
+.ext-strict .ext-ie6 .x-btn-mc, .ext-strict .ext-ie7 .x-btn-mc {
+    height: 100%;
+}
+
+.x-btn-bl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 -3px;
+}
+
+.x-btn-br{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px -3px;
+}
+
+.x-btn-bc{
+	height:3px;
+	background:repeat-x 0 -15px;
+}
+
+.x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-btn-click .x-btn-tl, .x-btn-menu-active .x-btn-tl, .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-btn-click .x-btn-tr, .x-btn-menu-active .x-btn-tr, .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-btn-click .x-btn-tc, .x-btn-menu-active .x-btn-tc, .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-btn-click .x-btn-ml, .x-btn-menu-active .x-btn-ml, .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-btn-click .x-btn-mr, .x-btn-menu-active .x-btn-mr, .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-btn-click .x-btn-mc, .x-btn-menu-active .x-btn-mc, .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-btn-click .x-btn-bl, .x-btn-menu-active .x-btn-bl, .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-btn-click .x-btn-br, .x-btn-menu-active .x-btn-br, .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-btn-click .x-btn-bc, .x-btn-menu-active .x-btn-bc, .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-btn-disabled *{
+	cursor:default !important;
+}
+
+
+/* With a menu arrow */
+/* right */
+.x-btn-mc em.x-btn-arrow {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:10px;
+}
+
+.x-btn-mc em.x-btn-split {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:14px;
+}
+
+/* bottom */
+.x-btn-mc em.x-btn-arrow-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+/* height adjustment class */
+.x-btn-as-arrow .x-btn-mc em {
+    display:block;
+    background-color:transparent;
+	padding-bottom:14px;
+}
+
+/* groups */
+.x-btn-group {
+    padding:1px;
+}
+
+.x-btn-group-header {
+    padding:2px;
+    text-align:center;
+}
+
+.x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+.x-btn-group-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:3px;
+}
+
+.x-btn-group-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-btn-group-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-br {
+	background: transparent no-repeat right bottom;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-mc {
+    border:0 none;
+    padding:1px 0 0 0;
+    margin:0;
+}
+
+.x-btn-group-mc .x-btn-group-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-btn-group-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-mr {
+	background: transparent repeat-y right 0;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-btn-group-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-btn-group-bc {
+	height:3px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-btn-group-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    height:2px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/layout.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/layout.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/layout.css	(revision 76)
@@ -0,0 +1,296 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-border-layout-ct {
+    position: relative;
+}
+
+.x-border-panel {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-tool-collapse-south {
+    background-position:0 -195px;
+}
+
+.x-tool-collapse-south-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-collapse-north {
+    background-position:0 -210px;
+}
+
+.x-tool-collapse-north-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-collapse-west {
+    background-position:0 -180px;
+}
+
+.x-tool-collapse-west-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-collapse-east {
+    background-position:0 -165px;
+}
+
+.x-tool-collapse-east-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-south {
+    background-position:0 -210px;
+}
+
+.x-tool-expand-south-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-expand-north {
+    background-position:0 -195px;
+}
+.x-tool-expand-north-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-expand-west {
+    background-position:0 -165px;
+}
+
+.x-tool-expand-west-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-east {
+    background-position:0 -180px;
+}
+
+.x-tool-expand-east-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-expand-north, .x-tool-expand-south {
+    float:right;
+    margin:3px;
+}
+
+.x-tool-expand-east, .x-tool-expand-west {
+    float:none;
+    margin:3px 2px;
+}
+
+.x-accordion-hd .x-tool-toggle {
+    background-position:0 -255px;
+}
+
+.x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -255px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle {
+    background-position:0 -240px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -240px;
+}
+
+.x-accordion-hd {
+	padding-top:4px;
+	padding-bottom:3px;
+	border-top:0 none;
+    background: transparent repeat-x 0 -9px;
+}
+
+.x-layout-collapsed{
+    position:absolute;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+    width:20px;
+    height:20px;
+    overflow:hidden;
+	border:1px solid;
+	z-index:20;
+}
+
+.ext-border-box .x-layout-collapsed{
+    width:22px;
+    height:22px;
+}
+
+.x-layout-collapsed-over{
+    cursor:pointer;
+}
+
+.x-layout-collapsed-west .x-layout-collapsed-tools, .x-layout-collapsed-east .x-layout-collapsed-tools{
+	position:absolute;
+    top:0;
+    left:0;
+    width:20px;
+    height:20px;
+}
+
+
+.x-layout-split{
+    position:absolute;
+    height:5px;
+    width:5px;
+    line-height:1px;
+    font-size:1px;
+    z-index:3;
+    background-color:transparent;
+}
+
+/* IE6 strict won't drag w/out a color */
+.ext-strict .ext-ie6 .x-layout-split{
+    background-color: #fff !important;
+    filter: alpha(opacity=1);
+}
+
+.x-layout-split-h{
+    background-image:url(../images/default/s.gif);
+    background-position: left;
+}
+
+.x-layout-split-v{
+    background-image:url(../images/default/s.gif);
+    background-position: top;
+}
+
+.x-column-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column {
+    float:left;
+    padding:0;
+    margin:0;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column-inner {
+    overflow:hidden;
+    zoom:1;
+}
+
+/* mini mode */
+.x-layout-mini {
+    position:absolute;
+    top:0;
+    left:0;
+    display:block;
+    width:5px;
+    height:35px;
+    cursor:pointer;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-layout-mini-over, .x-layout-collapsed-over .x-layout-mini{
+    opacity:1;
+    -moz-opacity:1;
+    filter:none;
+}
+
+.x-layout-split-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-split-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west, .x-layout-cmini-east {
+    border:0 none;
+    width:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-layout-cmini-north, .x-layout-cmini-south {
+    border:0 none;
+    height:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-viewport, .x-viewport body {
+    margin: 0;
+    padding: 0;
+    border: 0 none;
+    overflow: hidden;
+    height: 100%;
+}
+
+.x-abs-layout-item {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.ext-ie input.x-abs-layout-item, .ext-ie textarea.x-abs-layout-item {
+    margin:0;
+}
+
+.x-box-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-box-inner {
+    overflow:hidden;
+    zoom:1;
+    position:relative;
+    left:0;
+    top:0;
+}
+
+.x-box-item {
+    position:absolute;
+    left:0;
+    top:0;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel-reset.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel-reset.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/panel-reset.css	(revision 76)
@@ -0,0 +1,130 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * W3C Suggested Default style sheet for HTML 4
+ * http://www.w3.org/TR/CSS21/sample.html
+ *
+ * Resets for Ext.Panel @cfg normal: true
+ */
+.x-panel-reset .x-panel-body html,
+.x-panel-reset .x-panel-body address,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body body,
+.x-panel-reset .x-panel-body dd,
+.x-panel-reset .x-panel-body div,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dt,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body frame, frameset,
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body noframes,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body center,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body hr,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body pre 			  { display: block }
+.x-panel-reset .x-panel-body li              { display: list-item }
+.x-panel-reset .x-panel-body head            { display: none }
+.x-panel-reset .x-panel-body table           { display: table }
+.x-panel-reset .x-panel-body tr              { display: table-row }
+.x-panel-reset .x-panel-body thead           { display: table-header-group }
+.x-panel-reset .x-panel-body tbody           { display: table-row-group }
+.x-panel-reset .x-panel-body tfoot           { display: table-footer-group }
+.x-panel-reset .x-panel-body col             { display: table-column }
+.x-panel-reset .x-panel-body colgroup        { display: table-column-group }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th 	          { display: table-cell }
+.x-panel-reset .x-panel-body caption         { display: table-caption }
+.x-panel-reset .x-panel-body th              { font-weight: bolder; text-align: center }
+.x-panel-reset .x-panel-body caption         { text-align: center }
+.x-panel-reset .x-panel-body body            { margin: 8px }
+.x-panel-reset .x-panel-body h1              { font-size: 2em; margin: .67em 0 }
+.x-panel-reset .x-panel-body h2              { font-size: 1.5em; margin: .75em 0 }
+.x-panel-reset .x-panel-body h3              { font-size: 1.17em; margin: .83em 0 }
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu            { margin: 1.12em 0 }
+.x-panel-reset .x-panel-body h5              { font-size: .83em; margin: 1.5em 0 }
+.x-panel-reset .x-panel-body h6              { font-size: .75em; margin: 1.67em 0 }
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body b,
+.x-panel-reset .x-panel-body strong          { font-weight: bolder }
+.x-panel-reset .x-panel-body blockquote      { margin-left: 40px; margin-right: 40px }
+.x-panel-reset .x-panel-body i,
+.x-panel-reset .x-panel-body cite,
+.x-panel-reset .x-panel-body em,
+.x-panel-reset .x-panel-body var,
+.x-panel-reset .x-panel-body address    	  { font-style: italic }
+.x-panel-reset .x-panel-body pre,
+.x-panel-reset .x-panel-body tt,
+.x-panel-reset .x-panel-body code,
+.x-panel-reset .x-panel-body kbd,
+.x-panel-reset .x-panel-body samp       	  { font-family: monospace }
+.x-panel-reset .x-panel-body pre             { white-space: pre }
+.x-panel-reset .x-panel-body button,
+.x-panel-reset .x-panel-body textarea,
+.x-panel-reset .x-panel-body input,
+.x-panel-reset .x-panel-body select   		  { display: inline-block }
+.x-panel-reset .x-panel-body big             { font-size: 1.17em }
+.x-panel-reset .x-panel-body small,
+.x-panel-reset .x-panel-body sub,
+.x-panel-reset .x-panel-body sup 			  { font-size: .83em }
+.x-panel-reset .x-panel-body sub             { vertical-align: sub }
+.x-panel-reset .x-panel-body sup             { vertical-align: super }
+.x-panel-reset .x-panel-body table           { border-spacing: 2px; }
+.x-panel-reset .x-panel-body thead,
+.x-panel-reset .x-panel-body tbody,
+.x-panel-reset .x-panel-body tfoot           { vertical-align: middle }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th          	  { vertical-align: inherit }
+.x-panel-reset .x-panel-body s,
+.x-panel-reset .x-panel-body strike,
+.x-panel-reset .x-panel-body del  			  { text-decoration: line-through }
+.x-panel-reset .x-panel-body hr              { border: 1px inset }
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body dd        	  { margin-left: 40px }
+.x-panel-reset .x-panel-body ul, .x-panel-reset .x-panel-body menu, .x-panel-reset .x-panel-body dir { list-style-type: disc;}
+.x-panel-reset .x-panel-body ol              { list-style-type: decimal }
+.x-panel-reset .x-panel-body ol ul,
+.x-panel-reset .x-panel-body ul ol,
+.x-panel-reset .x-panel-body ul ul,
+.x-panel-reset .x-panel-body ol ol    		  { margin-top: 0; margin-bottom: 0 }
+.x-panel-reset .x-panel-body u,
+.x-panel-reset .x-panel-body ins          	  { text-decoration: underline }
+.x-panel-reset .x-panel-body br:before       { content: "\A" }
+.x-panel-reset .x-panel-body :before, .x-panel-reset .x-panel-body :after { white-space: pre-line }
+.x-panel-reset .x-panel-body center          { text-align: center }
+.x-panel-reset .x-panel-body :link, .x-panel-reset .x-panel-body :visited { text-decoration: underline }
+.x-panel-reset .x-panel-body :focus          { outline: invert dotted thin }
+
+/* Begin bidirectionality settings (do not change) */
+.x-panel-reset .x-panel-body BDO[DIR="ltr"]  { direction: ltr; unicode-bidi: bidi-override }
+.x-panel-reset .x-panel-body BDO[DIR="rtl"]  { direction: rtl; unicode-bidi: bidi-override }
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/resizable.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/resizable.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/resizable.css	(revision 76)
@@ -0,0 +1,149 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-resizable-handle {
+    position:absolute;
+    z-index:100;
+    /* ie needs these */
+    font-size:1px;
+    line-height:6px;
+    overflow:hidden;
+	filter:alpha(opacity=0);
+	opacity:0;
+	zoom:1;
+}
+
+.x-resizable-handle-east{
+    width:6px;
+    cursor:e-resize;
+    right:0;
+    top:0;
+    height:100%;
+}
+
+.ext-ie .x-resizable-handle-east {
+    margin-right:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-south{
+    width:100%;
+    cursor:s-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+}
+
+.ext-ie .x-resizable-handle-south {
+    margin-bottom:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-west{
+    width:6px;
+    cursor:w-resize;
+    left:0;
+    top:0;
+    height:100%;
+}
+
+.x-resizable-handle-north{
+    width:100%;
+    cursor:n-resize;
+    left:0;
+    top:0;
+    height:6px;
+}
+
+.x-resizable-handle-southeast{
+    width:6px;
+    cursor:se-resize;
+    right:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northwest{
+    width:6px;
+    cursor:nw-resize;
+    left:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northeast{
+    width:6px;
+    cursor:ne-resize;
+    right:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-southwest{
+    width:6px;
+    cursor:sw-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-over .x-resizable-handle, .x-resizable-pinned .x-resizable-handle{
+    filter:alpha(opacity=100);
+	opacity:1;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+	background-position: left;
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-position: top;
+}
+
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-position: top left;
+}
+
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-position:bottom right;
+}
+
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-position: bottom left;
+}
+
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-position: top right;
+}
+
+.x-resizable-proxy{
+    border: 1px dashed;
+    position:absolute;
+    overflow:hidden;
+    display:none;
+	left:0;
+    top:0;
+    z-index:50000;
+}
+
+.x-resizable-overlay{
+    width:100%;
+	height:100%;
+	display:none;
+	position:absolute;
+	left:0;
+	top:0;
+	z-index:200000;
+	-moz-opacity: 0;
+    opacity:0;
+    filter: alpha(opacity=0);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/reset.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/reset.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/reset.css	(revision 76)
@@ -0,0 +1,13 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
+
+.ext-forced-border-box, .ext-forced-border-box * {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/slider.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/slider.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/slider.css	(revision 76)
@@ -0,0 +1,103 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/* Shared styles */
+.x-slider {
+    zoom:1;
+}
+
+.x-slider-inner {
+    position:relative;
+    left:0;
+    top:0;
+    overflow:visible;
+    zoom:1;
+}
+
+.x-slider-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+	display:block;
+	overflow:hidden;  
+}
+
+/* Horizontal styles */
+.x-slider-horz {
+    padding-left:7px;
+    background:transparent no-repeat 0 -22px;
+}
+
+.x-slider-horz .x-slider-end {
+    padding-right:7px;
+    zoom:1;
+    background:transparent no-repeat right -44px;
+}
+
+.x-slider-horz .x-slider-inner {
+    background:transparent repeat-x 0 0;
+    height:22px;
+}
+
+.x-slider-horz .x-slider-thumb {
+    width:14px;
+    height:15px;
+    position:absolute;
+    left:0;
+    top:3px;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-horz .x-slider-thumb-over {
+    background-position: -14px -15px;
+}
+
+.x-slider-horz .x-slider-thumb-drag {
+    background-position: -28px -30px;
+}
+
+/* Vertical styles */
+.x-slider-vert {
+    padding-top:7px;
+    background:transparent no-repeat -44px 0;
+    width:22px;
+}
+
+.x-slider-vert .x-slider-end {
+    padding-bottom:7px;
+    zoom:1;
+    background:transparent no-repeat -22px bottom;
+}
+
+.x-slider-vert .x-slider-inner {
+    background:transparent repeat-y 0 0;
+}
+
+.x-slider-vert .x-slider-thumb {
+    width:15px;
+    height:14px;
+    position:absolute;
+    left:3px;
+    bottom:0;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-vert .x-slider-thumb-over {
+    background-position: -15px -14px;
+}
+
+.x-slider-vert .x-slider-thumb-drag {
+    background-position: -30px -28px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/list-view.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/list-view.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/list-view.css	(revision 76)
@@ -0,0 +1,86 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-list-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    height:22px;
+}
+
+.x-list-header-inner div {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.x-list-header-inner div em {
+    display:block;
+    border-left:1px solid;
+    padding:4px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    line-height:14px;
+}
+
+.x-list-body {
+    overflow:auto;
+    overflow-x:hidden;
+    overflow-y:auto;
+    zoom:1;
+    float: left;
+    width: 100%;
+}
+
+.x-list-body dl {
+    zoom:1;
+}
+
+.x-list-body dt {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+    cursor:pointer;
+    zoom:1;
+}
+
+.x-list-body dt em {
+    display:block;
+    padding:3px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+}
+
+.x-list-resizer {
+    border-left:1px solid;
+    border-right:1px solid;
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-list-header-inner em.sort-asc {
+    background: transparent no-repeat center 0;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
+.x-list-header-inner em.sort-desc {
+    background: transparent no-repeat center -23px;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/grid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/grid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/grid.css	(revision 76)
@@ -0,0 +1,588 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/* Grid3 styles */
+.x-grid3 {
+	position:relative;
+	overflow:hidden;
+}
+
+.x-grid-panel .x-panel-body {
+    overflow:hidden !important;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border:1px solid;
+}
+
+.x-grid3 table {
+    table-layout:fixed;
+}
+
+.x-grid3-viewport{
+	overflow:hidden;
+}
+
+.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
+    -moz-outline: none;
+    outline: none;
+	-moz-user-focus: normal;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td {
+    line-height:13px;
+    vertical-align: top;
+	padding-left:1px;
+    padding-right:1px;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-cell{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-row td {
+    line-height:15px;
+    vertical-align:middle;
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+.x-grid3-hd-row .x-grid3-marker-hd {
+    padding:3px;
+}
+
+.x-grid3-row .x-grid3-marker {
+    padding:3px;
+}
+
+.x-grid3-cell-inner, .x-grid3-hd-inner{
+	overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    padding:3px 3px 3px 5px;
+    white-space: nowrap;
+}
+
+/* ActionColumn, reduce padding to accommodate 16x16 icons in normal row height */
+.x-action-col-cell .x-grid3-cell-inner {
+    padding-top: 1px;
+    padding-bottom: 1px;
+}
+
+.x-action-col-icon {
+    cursor: pointer;
+}
+
+.x-grid3-hd-inner {
+    position:relative;
+	cursor:inherit;
+	padding:4px 3px 4px 5px;
+}
+
+.x-grid3-row-body {
+    white-space:normal;
+}
+
+.x-grid3-body-cell {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+/* IE Quirks to clip */
+.ext-ie .x-grid3-cell-inner, .ext-ie .x-grid3-hd-inner{
+	width:100%;
+}
+
+/* reverse above in strict mode */
+.ext-strict .x-grid3-cell-inner, .ext-strict .x-grid3-hd-inner{
+	width:auto;
+}
+
+.x-grid-row-loading {
+    background: no-repeat center center;
+}
+
+.x-grid-page {
+    overflow:hidden;
+}
+
+.x-grid3-row {
+	cursor: default;
+    border: 1px solid;
+    width:100%;
+}
+
+.x-grid3-row-over {
+	border:1px solid;
+    background: repeat-x left top;
+}
+
+.x-grid3-resize-proxy {
+	width:1px;
+    left:0;
+	cursor: e-resize;
+	cursor: col-resize;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-resize-marker {
+	width:1px;
+	left:0;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: text;
+    -khtml-user-select: text;
+    -webkit-user-select:ignore;
+}
+
+/* header styles */
+.x-grid3-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    padding:1px 0 0 0;
+}
+
+.x-grid3-header-pop {
+    border-left:1px solid;
+    float:right;
+    clear:none;
+}
+
+.x-grid3-header-pop-inner {
+    border-left:1px solid;
+    width:14px;
+    height:19px;
+    background: transparent no-repeat center center;
+}
+
+.ext-ie .x-grid3-header-pop-inner {
+    width:15px;
+}
+
+.ext-strict .x-grid3-header-pop-inner {
+    width:14px; 
+}
+
+.x-grid3-header-inner {
+    overflow:hidden;
+    zoom:1;
+    float:left;
+}
+
+.x-grid3-header-offset {
+    padding-left:1px;
+    text-align: left;
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background: repeat-x left bottom;
+
+}
+
+.x-grid3-sort-icon{
+	background-repeat: no-repeat;
+	display: none;
+	height: 4px;
+	width: 13px;
+	margin-left:3px;
+	vertical-align: middle;
+}
+
+.sort-asc .x-grid3-sort-icon, .sort-desc .x-grid3-sort-icon {
+	display: inline;
+}
+
+/* Header position fixes for IE strict mode */
+.ext-strict .ext-ie .x-grid3-header-inner, .ext-strict .ext-ie6 .x-grid3-hd {
+    position:relative;
+}
+
+.ext-strict .ext-ie6 .x-grid3-hd-inner{
+    position:static;
+}
+
+/* Body Styles */
+.x-grid3-body {
+	zoom:1;
+}
+
+.x-grid3-scroller {
+	overflow:auto;
+    zoom:1;
+    position:relative;
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	display: block;
+	padding: 3px 5px 3px 5px;
+	-moz-user-select: none;
+	-khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-split {
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor: e-resize;
+	cursor: col-resize;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	overflow: hidden;
+	position: absolute;
+	top: 2px;
+	width: 6px;
+	z-index: 3;
+}
+
+/* Column Reorder DD */
+.x-dd-drag-proxy .x-grid3-hd-inner{
+	background: repeat-x left bottom;
+	width:120px;
+	padding:3px;
+	border:1px solid;
+	overflow:hidden;
+}
+
+.col-move-top, .col-move-bottom{
+	width:9px;
+	height:9px;
+	position:absolute;
+	top:0;
+	line-height:1px;
+	font-size:1px;
+	overflow:hidden;
+	visibility:hidden;
+	z-index:20000;
+    background:transparent no-repeat left top;
+}
+
+/* Selection Styles */
+.x-grid3-row-selected {
+	border:1px dotted;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background: repeat-x 0 bottom !important;
+    vertical-align:middle !important;
+    padding:0;
+    border-top:1px solid;
+    border-bottom:none !important;
+    border-right:1px solid !important;
+    text-align:center;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    padding:0 4px;
+    text-align:center;
+}
+
+/* dirty cells */
+.x-grid3-dirty-cell {
+    background: transparent no-repeat 0 0;
+}
+
+/* Grid Toolbars */
+.x-grid3-topbar, .x-grid3-bottombar{
+    overflow:hidden;
+	display:none;
+	zoom:1;
+    position:relative;
+}
+
+.x-grid3-topbar .x-toolbar{
+	border-right:0 none;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-right:0 none;
+	border-bottom:0 none;
+	border-top:1px solid;
+}
+
+/* Props Grid Styles */
+.x-props-grid .x-grid3-cell{
+	padding:1px;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background:transparent repeat-y -16px !important;
+    padding-left:12px;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    padding:1px;
+    padding-right:0;
+    border:0 none;
+    border-right:1px solid;
+}
+
+/* dd */
+.x-grid3-col-dd {
+    border:0 none;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-dd-drag-ghost .x-grid3-dd-wrap {
+    padding:1px 3px 3px 1px;
+}
+
+.x-grid3-hd {
+    -moz-user-select:none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-btn {
+    display:none;
+    position:absolute;
+    width:14px;
+    background:no-repeat left center;
+    right:0;
+    top:0;
+    z-index:2;
+	cursor:pointer;
+}
+
+.x-grid3-hd-over .x-grid3-hd-btn, .x-grid3-hd-menu-open .x-grid3-hd-btn {
+    display:block;
+}
+
+a.x-grid3-hd-btn:hover {
+    background-position:-14px center;
+}
+
+/* Expanders */
+.x-grid3-body .x-grid3-td-expander {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-expander .x-grid3-cell-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-expander {
+    width:100%;
+    height:18px;
+    background-position:4px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-expander {
+    background-position:4px 2px;
+}
+
+.x-grid3-row-expanded .x-grid3-row-expander {
+    background-position:-21px 2px;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-body {
+    display:none !important;
+}
+
+.x-grid3-row-expanded .x-grid3-row-body {
+    display:block !important;
+}
+
+/* Checkers */
+.x-grid3-body .x-grid3-td-checker {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-checker .x-grid3-cell-inner, .x-grid3-header .x-grid3-td-checker .x-grid3-hd-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    width:100%;
+    height:18px;
+    background-position:2px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row .x-grid3-row-checker {
+    background-position:2px 2px;
+}
+
+.x-grid3-row-selected .x-grid3-row-checker, .x-grid3-hd-checker-on .x-grid3-hd-checker,.x-grid3-row-checked .x-grid3-row-checker {
+    background-position:-23px 2px;
+}
+
+.x-grid3-hd-checker {
+    background-position:2px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker {
+    background-position:2px 3px;
+}
+
+.x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 3px;
+}
+
+/* Numberer */
+.x-grid3-body .x-grid3-td-numberer {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+    padding:3px 5px 0 0 !important;
+    text-align:right;
+}
+
+/* Row Icon */
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background:transparent repeat-y right;
+    vertical-align:top;
+    text-align:center;
+}
+
+.x-grid3-body .x-grid3-td-row-icon .x-grid3-cell-inner {
+    padding:0 !important;
+    background-position:center center;
+    background-repeat:no-repeat;
+    width:16px;
+    height:16px;
+    margin-left:2px;
+    margin-top:3px;
+}
+
+/* All specials */
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-check-col-td .x-grid3-cell-inner {
+    padding: 1px 0 0 0 !important;
+}
+
+.x-grid3-check-col {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-check-col-on {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+/* Grouping classes */
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom: 2px solid;
+    cursor:pointer;
+    padding-top:6px;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background:transparent no-repeat 3px 3px;
+    padding:4px 4px 4px 17px;
+}
+
+.x-grid-group-collapsed .x-grid-group-body {
+    display:none;
+}
+
+.ext-ie6 .x-grid3 .x-editor .x-form-text, .ext-ie7 .x-grid3 .x-editor .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-ie .x-props-grid .x-editor .x-form-text {
+    position:static;
+    top:0;
+}
+
+.x-grid-empty {
+    padding:10px;
+}
+
+/* fix floating toolbar issue */
+.ext-ie7 .x-grid-panel .x-panel-bbar {
+    position:relative;
+}
+
+
+/* Reset position to static when Grid Panel has been framed */
+/* to resolve 'snapping' from top to bottom behavior. */
+/* @forumThread 86656 */
+.ext-ie7 .x-grid-panel .x-panel-mc .x-panel-bbar {
+    position: static;
+}
+
+.ext-ie6 .x-grid3-header {
+    position: relative;
+}
+
+/* Fix WebKit bug in Grids */
+.ext-webkit .x-grid-panel .x-panel-bwrap{
+    -webkit-user-select:none;
+}
+.ext-webkit .x-tbar-page-number{
+    -webkit-user-select:ignore;
+}
+/* end*/
+
+/* column lines */
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    padding-right:0;
+    border-right:1px solid;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/editor.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/editor.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/editor.css	(revision 76)
@@ -0,0 +1,92 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-html-editor-wrap {
+    border:1px solid;
+}
+
+.x-html-editor-tb .x-btn-text {
+    background:transparent no-repeat;
+}
+
+.x-html-editor-tb .x-edit-bold, .x-menu-item img.x-edit-bold {
+    background-position:0 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);    
+}
+
+.x-html-editor-tb .x-edit-italic, .x-menu-item img.x-edit-italic {
+    background-position:-16px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-underline, .x-menu-item img.x-edit-underline {
+    background-position:-32px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-forecolor, .x-menu-item img.x-edit-forecolor {
+    background-position:-160px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-backcolor, .x-menu-item img.x-edit-backcolor {
+    background-position:-176px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyleft, .x-menu-item img.x-edit-justifyleft {
+    background-position:-112px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifycenter, .x-menu-item img.x-edit-justifycenter {
+    background-position:-128px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyright, .x-menu-item img.x-edit-justifyright {
+    background-position:-144px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertorderedlist, .x-menu-item img.x-edit-insertorderedlist {
+    background-position:-80px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertunorderedlist, .x-menu-item img.x-edit-insertunorderedlist {
+    background-position:-96px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-increasefontsize, .x-menu-item img.x-edit-increasefontsize {
+    background-position:-48px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-decreasefontsize, .x-menu-item img.x-edit-decreasefontsize {
+    background-position:-64px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-sourceedit, .x-menu-item img.x-edit-sourceedit {
+    background-position:-192px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-createlink, .x-menu-item img.x-edit-createlink {
+    background-position:-208px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tip .x-tip-bd .x-tip-bd-inner {
+    padding:5px;
+    padding-bottom:1px;
+}
+
+.x-html-editor-tb .x-toolbar {
+    position:static !important;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/debug.css	(revision 76)
@@ -0,0 +1,26 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+#x-debug-browser .x-tree .x-tree-node a span {
+    padding-top:2px;
+    line-height:18px;
+}
+
+#x-debug-browser  .x-tool-toggle {
+    background-position:0 -75px;
+}
+
+#x-debug-browser  .x-tool-toggle-over {
+    background-position:-15px -75px;
+}
+
+#x-debug-browser.x-panel-collapsed .x-tool-toggle {
+    background-position:0 -60px;
+}
+
+#x-debug-browser.x-panel-collapsed .x-tool-toggle-over {
+    background-position:-15px -60px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dd.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dd.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/structure/dd.css	(revision 76)
@@ -0,0 +1,61 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-dd-drag-proxy{
+	position:absolute;
+	left:0;
+    top:0;
+	visibility:hidden;
+	z-index:15000;
+}
+
+.x-dd-drag-ghost{
+	-moz-opacity: 0.85;
+    opacity:.85;
+    filter: alpha(opacity=85);
+    border: 1px solid;
+	padding:3px;
+	padding-left:20px;
+	white-space:nowrap;
+}
+
+.x-dd-drag-repair .x-dd-drag-ghost{
+	-moz-opacity: 0.4;
+    opacity:.4;
+    filter: alpha(opacity=40);
+	border:0 none;
+	padding:0;
+	background-color:transparent;
+}
+
+.x-dd-drag-repair .x-dd-drop-icon{
+	visibility:hidden;
+}
+
+.x-dd-drop-icon{
+    position:absolute;
+	top:3px;
+	left:3px;
+	display:block;
+	width:16px;
+	height:16px;
+	background-color:transparent;
+	background-position: center;
+	background-repeat: no-repeat;
+	z-index:1;
+}
+
+.x-view-selector {
+    position:absolute;
+    left:0;
+    top:0;
+    width:0;
+    border:1px dotted;
+	opacity: .5;
+    -moz-opacity: .5;
+    filter:alpha(opacity=50);
+    zoom:1;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-access.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-access.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-access.css	(revision 76)
@@ -0,0 +1,1820 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+body {
+	background-color:#16181a;
+	color:#fcfcfc;
+}
+
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#223;
+    background-color:#3f4757;
+    background-image:url(../images/access/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #232d38;
+    border-color:#556;
+    color:#fff;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#232d38;
+    background-image:url(../images/access/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: #ddd;
+}
+
+.x-item-disabled * {
+    color: #ddd !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 14px;
+    background-image: url(../images/access/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}.x-tab-panel-header, .x-tab-panel-footer {
+	background-color:#e18325;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#222;
+}
+
+ul.x-tab-strip-top{
+    background-color:#343843;
+	background-image: url(../images/access/tabs/tab-strip-bg.gif);
+	border-bottom-color:#343d4e;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#343843;
+	background-image: url(../images/access/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#343843;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#222;
+    background-color:#e18325;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 14px tahoma,arial,helvetica;
+	color:#fff;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#fff;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#fff;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/access/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/access/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/access/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/access/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/access/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/access/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/access/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#18181a;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/access/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/access/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
+.x-form-field {
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field{
+    color: #ffffff;
+    background-color:#33373d;
+    background-image:url(../images/access/form/text-bg.gif);
+    border-color:#737b8c;
+    border-width:2px;
+}
+
+.ext-webkit .x-form-text, .ext-webkit textarea.x-form-field{
+    border-width:2px;
+}
+
+.x-form-text, .ext-ie .x-form-file {
+    height:26px;
+}
+
+.ext-strict .x-form-text {
+    height:20px;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #fff;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger{
+    background-image:url(../images/access/form/trigger.gif);
+    border-bottom-color:#737b8c;
+    border-bottom-width:2px;
+    height:24px;
+    width:20px;
+}
+
+.x-form-field-wrap .x-form-trigger.x-form-trigger-over{
+    border-bottom-color:#d97e27;
+}
+
+.x-form-field-wrap .x-form-trigger.x-form-trigger-click{
+    border-bottom-color:#c86e19;
+}
+
+.x-small-editor .x-form-field-wrap .x-form-trigger {
+    height:24px;
+}
+
+.x-form-field-wrap .x-form-trigger-over {
+    background-position:-20px 0;
+}
+
+.x-form-field-wrap .x-form-trigger-click {
+    background-position:-40px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    background-position:-60px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-over {
+    background-position:-80px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-click {
+    background-position:-100px 0;
+}
+
+.x-form-field-wrap .x-form-date-trigger{
+    background-image: url(../images/access/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger{
+    background-image: url(../images/access/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger{
+    background-image: url(../images/access/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom-color:#737b8c;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus{
+	border-color:#ff9c33;
+}
+
+.x-form-invalid, textarea.x-form-invalid,
+.ext-webkit .x-form-invalid, .ext-webkit textarea.x-form-invalid{
+    background-color:#15171a;
+	background-image:url(../images/access/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+/*
+.ext-safari .x-form-invalid{
+	background-color:#fee;
+	border-color:#ff7870;
+}
+*/
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background-color:#fff;
+	background-image:url(../images/access/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:#dadadd;
+}
+
+.x-small-editor .x-form-text {
+    height: 26px;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-safari .x-small-editor .x-form-field {
+    font:normal 15px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/access/form/exclamation.gif);
+    height:25px;
+    width:19px;
+    background-position:center right;
+}
+
+.x-fieldset {
+    border-color:#737B8C;
+}
+
+.x-fieldset legend {
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+    color:#fff;
+}
+.x-btn {
+	font:normal 14px tahoma, verdana, helvetica;
+}
+
+.x-btn button {
+    font:normal 14px arial,tahoma,verdana,helvetica;
+    color:#fffffa;
+    padding-left:6px !important;
+    padding-right:6px !important;
+}
+
+.x-btn-over .x-btn button{
+    color:#fff;
+}
+
+.x-btn-noicon .x-btn-small .x-btn-text, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text,
+.x-btn-icon .x-btn-small .x-btn-text, .x-btn-text-icon .x-btn-icon-small-right .x-btn-text {
+    height:18px;
+}
+
+.x-btn-icon .x-btn-small .x-btn-text {
+    width:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-small-left .x-btn-text {
+    padding-left:21px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-small-right .x-btn-text {
+    padding-right:21px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-left .x-btn-text {
+    padding-left:29px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-right .x-btn-text {
+    padding-right:29px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-large-left .x-btn-text {
+    padding-left:37px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-large-right .x-btn-text {
+    padding-right:37px !important;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/access/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#fff;
+}
+
+.x-btn-disabled *{
+	color:#eee !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/access/button/arrow.gif);
+    padding-right:13px;
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow.gif);
+    padding-right:20px;
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/access/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #d2d2d2;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/access/button/group-lr.gif);
+}
+
+.x-btn-group-mr {
+	background-image: url(../images/access/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
+.x-toolbar{
+	border-color:#18181a;
+    background-color:#393d4e;
+    background-image:url(../images/access/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 14px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split 
+{
+    background-image:url(../images/access/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom 
+{
+    background-image:url(../images/access/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/access/grid/grid-blue-split.gif);
+}
+
+.x-toolbar .x-btn {
+    padding-left:3px;
+    padding-right:3px;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-arrow {
+    padding-right:10px;
+}
+
+.x-toolbar .x-btn-text-icon .x-btn-icon-small-left .x-btn-text {
+    padding-left:18px !important;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    padding-right:14px;
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/access/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/access/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/access/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/access/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/access/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/access/grid/loading.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/access/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/access/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/access/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/access/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/access/toolbar/more.gif) !important;
+}
+
+.x-statusbar .x-status-busy {
+    background-image: url(../images/access/grid/loading.gif);
+}
+
+.x-statusbar .x-status-text-panel {
+    border-color: #99bbe8 #fff #fff #99bbe8;
+}
+.x-resizable-handle {
+	background-color:#fff;
+	color: #000;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/access/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/access/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/access/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/access/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/access/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/access/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/access/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
+.x-grid3 {
+    background-color:#1f2933;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#223;
+}
+
+.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    border-left-color:#556;
+    border-right-color:#223;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border:0 none;
+    border-bottom:1px solid #111;
+    border-right:1px solid #1a1a1c;
+}
+
+.x-grid3-row-alt{
+	background-color:#1b232b;
+}
+
+.x-grid3-row-over {
+    background-color:#7e5530;
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#3b3f50;
+	background-image:url(../images/access/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#889;
+    border-right-color:#445;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#4e628a;
+    background-image:url(../images/access/grid/grid3-hrow-over.gif);
+}
+
+.x-grid3-cell-inner, .x-grid3-hd-inner {
+    color:#fff;
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/access/grid/sort_asc.gif);
+	width:15px;
+	height:9px;
+	margin-left:5px;
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/access/grid/sort_desc.gif);
+	width:15px;
+	height:9px;
+	margin-left:5px;
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#fff;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#fff;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/access/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+.x-grid3-row-selected {
+	background-color: #e5872c !important;
+	background-image: none;
+	border-style: solid;
+}
+
+.x-grid3-row-selected .x-grid3-cell {
+    color: #fff;
+}
+
+.x-grid3-cell-selected {
+	background-color: #ffa340 !important;
+	color:#fff;
+}
+
+.x-grid3-cell-selected span{
+	color:#fff !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#fff;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#fff;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#fff !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/access/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/access/grid/grid3-special-col-bg.gif) !important;
+    color:#fff !important;
+}
+.x-props-grid .x-grid3-td-value {
+    color:#fff !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#263240 !important;
+    border-right-color:#223;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c2c9d0;
+    background-image:url(../images/access/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/access/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#fff;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/access/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#4e628a;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/access/grid/group-collapse.gif);
+    background-position:3px 6px;
+    color:#ffd;
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/access/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row{
+    border-top-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 14px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}
+.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/access/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/access/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.ext-ie .x-tree-node-el input {
+    width:14px;
+    height:14px;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/access/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/access/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/access/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/access/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/access/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/access/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/access/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/access/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/access/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/access/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/access/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#fff;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-selected a, .x-dd-drag-ghost a{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-selected a span, .x-dd-drag-ghost a span{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #7e5530;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #e5872c;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}
+.x-date-picker {
+    border-color: #737b8c;
+    background-color:#21252e;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/access/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 14px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/access/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/access/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/access/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#363d4a;
+    background-image:url(../images/access/toolbar/bg.gif);
+	border-bottom-color:#535b5c;
+    font:normal 13px arial, helvetica,tahoma,sans-serif;
+	color:#fff;
+}
+
+.x-date-inner td {
+    border-color:#112;
+}
+
+.x-date-inner a {
+    font:normal 14px arial, helvetica,tahoma,sans-serif;
+    color:#fff;
+    padding:2px 7px 1px 3px; /* Structure to account for larger, bolder fonts in Access theme. */
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#e5872c;
+	background-image:none;
+	border-color:#864900;
+    padding:1px 6px 1px 2px; /* Structure to account for larger, bolder fonts in Access theme. */
+}
+
+.x-date-inner .x-date-today a{
+	border-color:#99a;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#737b8c;
+    background-color:#464d5a;
+    background-image:url(../images/access/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#fff;
+    background-color:#7e5530;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:13px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#21252e;
+}
+
+.x-date-mp td {
+	font:normal 14px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 14px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/access/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#fff;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#fff;
+	background-color: #7e5530;
+}
+
+td.x-date-mp-sel a {
+    background-color: #e5872c;
+	background-image: none;
+	border-color:#864900;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/access/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}
+.x-tip .x-tip-close{
+	background-image: url(../images/access/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/access/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 14px tahoma,arial,helvetica,sans-serif;
+    color:#ffd;
+}
+
+.x-tip .x-tip-body {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    color:#000;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/access/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/access/qtip/tip-anchor-sprite.gif);
+}
+.x-menu {
+	border-color:#222;
+    background-color:#414551;
+	background-image:url(../images/access/menu/menu.gif);
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 14px tahoma,arial, sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/access/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#223;
+	border-bottom-color:#666;
+}
+
+a.x-menu-item {
+	color:#fffff6;
+}
+
+.x-menu-item-active {
+	background-color: #f09134;
+	background-image: none;
+    border-color:#b36427;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#b36427;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/access/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 15px;
+}
+
+.x-box-mc h3 {
+	font-size: 18px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}
+.x-combo-list {
+    border:2px solid #232732;
+    background-color:#555566;
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#414551;
+}
+
+.x-combo-list-hd {
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+    color:#fff;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#556;
+}
+
+.x-combo-list .x-combo-selected {
+	border-color:#e5872c !important;
+    background-color:#e5872c;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
+.x-panel {
+    border-color: #18181a;
+    font-size: 14px;
+}
+
+.x-panel-header {
+    color:#fff;
+    font-weight:bold; 
+    font-size: 14px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#18181a;
+    background-image: url(../images/access/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    color: #fffff6;
+    border-color:#18181a;
+    background-color:#232d38;
+}
+
+.x-tab-panel .x-panel-body {
+    color: #fffff6;
+    border-color:#18181a;
+    background-color:#1f2730;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#223;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#223;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#223;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#fff;
+    font:bold 14px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+    background-image: url(../images/access/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+    background-image: url(../images/access/panel/corners-sprite.gif);
+    border-bottom-color:#222224;
+}
+
+.x-panel-bc {
+	background-image: url(../images/access/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    background-color:#3f4757;
+}
+
+.x-panel-ml {
+    background-image:url(../images/access/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/access/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/access/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#3f4757;
+}
+
+.x-panel-ghost ul {
+    border-color:#18181a;
+}
+
+.x-panel-dd-spacer {
+    border-color:#18181a;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 14px arial,tahoma, helvetica, sans-serif;
+}
+.x-window-proxy {
+    background-color:#1f2833;
+    border-color:#18181a;
+}
+
+.x-window-tl .x-window-header {
+    color:#fff;
+	font:bold 14px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/access/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/access/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/access/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/access/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/access/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/access/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#18181a;
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    background-color:#1f2833;
+}
+
+.x-window-ml {
+	background-image: url(../images/access/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/access/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#323945;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#323945;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#323945;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #464f61;
+    border-color: #636778;
+}
+
+.x-window-plain .x-window-body {
+    color: #fffff6;
+    border-color: #464F61;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #464f61;
+}
+.x-html-editor-wrap {
+    border-color:#737B8C;
+    background-color:#fff;
+}
+.x-html-editor-wrap iframe {
+    background-color: #fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/access/editor/tb-sprite.gif);
+}.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#343d4e;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#343d4e;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#343d4e;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#343d4e;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#343d4e;
+}
+.x-border-layout-ct {
+    background-color:#3f4757;
+}
+
+.x-accordion-hd {
+	color:#fff;
+    font-weight:normal;
+    background-image: url(../images/access/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#323845;
+	border-color:#1a1a1c;
+}
+
+.x-layout-collapsed-over{
+    background-color:#2d3440;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-progress-wrap {
+    border-color:#18181a;
+}
+
+.x-progress-inner {
+    background-color:#232d38;
+    background-image:none;
+}
+
+.x-progress-bar {
+    background-color:#f39a00;
+    background-image:url(../images/access/progress/progress-bg.gif);
+    border-top-color:#a66900;
+    border-bottom-color:#a66900;
+    border-right-color:#ffb941;
+    height: 20px !important; /* structural override for Accessibility Theme */
+}
+
+.x-progress-text {
+    font-size:14px;
+    font-weight:bold;
+    color:#fff;
+    padding: 0 5px !important; /* structural override for Accessibility Theme */
+}
+
+.x-progress-text-back {
+    color:#aaa;
+    line-height: 19px;
+}
+.x-list-header{
+    background-color:#393d4e;
+	background-image:url(../images/access/toolbar/bg.gif);
+	background-position:0 top;
+}
+
+.x-list-header-inner div em {
+    border-left-color:#667;
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+    line-height: 14px;
+}
+
+.x-list-body-inner {
+    background-color:#1B232B;
+}
+
+.x-list-body dt em {
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#7E5530;
+}
+
+.x-list-selected {
+    background-color:#E5872C;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/access/grid/sort-hd.gif);
+    border-color: #3e4e6c;
+}
+.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/access/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/access/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/access/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/access/slider/slider-v-thumb.png);
+}
+.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:15px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 15px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/access/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/access/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/access/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/access/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/access/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/box.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/box.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/box.css	(revision 76)
@@ -0,0 +1,74 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 15px;
+}
+
+.x-box-mc h3 {
+	font-size: 18px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/core.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/core.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/core.css	(revision 76)
@@ -0,0 +1,81 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+body {
+	background-color:#16181a;
+	color:#fcfcfc;
+}
+
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#223;
+    background-color:#3f4757;
+    background-image:url(../images/access/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #232d38;
+    border-color:#556;
+    color:#fff;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#232d38;
+    background-image:url(../images/access/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: #ddd;
+}
+
+.x-item-disabled * {
+    color: #ddd !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 14px;
+    background-image: url(../images/access/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/date-picker.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/date-picker.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/date-picker.css	(revision 76)
@@ -0,0 +1,145 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-date-picker {
+    border-color: #737b8c;
+    background-color:#21252e;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/access/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 14px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/access/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/access/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/access/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#363d4a;
+    background-image:url(../images/access/toolbar/bg.gif);
+	border-bottom-color:#535b5c;
+    font:normal 13px arial, helvetica,tahoma,sans-serif;
+	color:#fff;
+}
+
+.x-date-inner td {
+    border-color:#112;
+}
+
+.x-date-inner a {
+    font:normal 14px arial, helvetica,tahoma,sans-serif;
+    color:#fff;
+    padding:2px 7px 1px 3px; /* Structure to account for larger, bolder fonts in Access theme. */
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#e5872c;
+	background-image:none;
+	border-color:#864900;
+    padding:1px 6px 1px 2px; /* Structure to account for larger, bolder fonts in Access theme. */
+}
+
+.x-date-inner .x-date-today a{
+	border-color:#99a;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#737b8c;
+    background-color:#464d5a;
+    background-image:url(../images/access/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#fff;
+    background-color:#7e5530;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:13px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#21252e;
+}
+
+.x-date-mp td {
+	font:normal 14px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 14px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/access/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#fff;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#fff;
+	background-color: #7e5530;
+}
+
+td.x-date-mp-sel a {
+    background-color: #e5872c;
+	background-image: none;
+	border-color:#864900;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/access/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tabs.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tabs.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tabs.css	(revision 76)
@@ -0,0 +1,119 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color:#e18325;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#222;
+}
+
+ul.x-tab-strip-top{
+    background-color:#343843;
+	background-image: url(../images/access/tabs/tab-strip-bg.gif);
+	border-bottom-color:#343d4e;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#343843;
+	background-image: url(../images/access/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#343843;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#222;
+    background-color:#e18325;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 14px tahoma,arial,helvetica;
+	color:#fff;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#fff;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#fff;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/access/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/access/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/access/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/access/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/access/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/access/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/access/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#18181a;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/access/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/access/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tree.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tree.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/tree.css	(revision 76)
@@ -0,0 +1,165 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/access/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/access/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.ext-ie .x-tree-node-el input {
+    width:14px;
+    height:14px;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/access/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/access/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/access/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/access/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/access/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/access/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/access/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/access/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/access/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/access/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/access/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/access/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#fff;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-selected a, .x-dd-drag-ghost a{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-selected a span, .x-dd-drag-ghost a span{
+	color:#fff;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #7e5530;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #e5872c;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/combo.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/combo.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/combo.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-combo-list {
+    border:2px solid #232732;
+    background-color:#555566;
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#414551;
+}
+
+.x-combo-list-hd {
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+    color:#fff;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#556;
+}
+
+.x-combo-list .x-combo-selected {
+	border-color:#e5872c !important;
+    background-color:#e5872c;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dialog.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dialog.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dialog.css	(revision 76)
@@ -0,0 +1,34 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:15px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 15px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/access/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/access/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/access/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/access/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/access/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/panel.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/panel.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/panel.css	(revision 76)
@@ -0,0 +1,94 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel {
+    border-color: #18181a;
+    font-size: 14px;
+}
+
+.x-panel-header {
+    color:#fff;
+    font-weight:bold; 
+    font-size: 14px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#18181a;
+    background-image: url(../images/access/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    color: #fffff6;
+    border-color:#18181a;
+    background-color:#232d38;
+}
+
+.x-tab-panel .x-panel-body {
+    color: #fffff6;
+    border-color:#18181a;
+    background-color:#1f2730;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#223;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#223;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#223;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#fff;
+    font:bold 14px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+    background-image: url(../images/access/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+    background-image: url(../images/access/panel/corners-sprite.gif);
+    border-bottom-color:#222224;
+}
+
+.x-panel-bc {
+	background-image: url(../images/access/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    background-color:#3f4757;
+}
+
+.x-panel-ml {
+    background-image:url(../images/access/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/access/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/access/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#3f4757;
+}
+
+.x-panel-ghost ul {
+    border-color:#18181a;
+}
+
+.x-panel-dd-spacer {
+    border-color:#18181a;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 14px arial,tahoma, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/qtips.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/qtips.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/qtips.css	(revision 76)
@@ -0,0 +1,44 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tip .x-tip-close{
+	background-image: url(../images/access/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/access/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 14px tahoma,arial,helvetica,sans-serif;
+    color:#ffd;
+}
+
+.x-tip .x-tip-body {
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    color:#000;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/access/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/access/qtip/tip-anchor-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/borders.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/borders.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/borders.css	(revision 76)
@@ -0,0 +1,25 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#343d4e;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#343d4e;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#343d4e;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#343d4e;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#343d4e;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/toolbar.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/toolbar.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/toolbar.css	(revision 76)
@@ -0,0 +1,120 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-toolbar{
+	border-color:#18181a;
+    background-color:#393d4e;
+    background-image:url(../images/access/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 14px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split 
+{
+    background-image:url(../images/access/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom 
+{
+    background-image:url(../images/access/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/access/grid/grid-blue-split.gif);
+}
+
+.x-toolbar .x-btn {
+    padding-left:3px;
+    padding-right:3px;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-arrow {
+    padding-right:10px;
+}
+
+.x-toolbar .x-btn-text-icon .x-btn-icon-small-left .x-btn-text {
+    padding-left:18px !important;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    padding-right:14px;
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/access/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/access/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/access/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/access/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/access/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/access/grid/loading.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/access/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/access/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/access/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/access/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/access/toolbar/more.gif) !important;
+}
+
+.x-statusbar .x-status-busy {
+    background-image: url(../images/access/grid/loading.gif);
+}
+
+.x-statusbar .x-status-text-panel {
+    border-color: #99bbe8 #fff #fff #99bbe8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/form.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/form.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/form.css	(revision 76)
@@ -0,0 +1,176 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-form-field {
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field{
+    color: #ffffff;
+    background-color:#33373d;
+    background-image:url(../images/access/form/text-bg.gif);
+    border-color:#737b8c;
+    border-width:2px;
+}
+
+.ext-webkit .x-form-text, .ext-webkit textarea.x-form-field{
+    border-width:2px;
+}
+
+.x-form-text, .ext-ie .x-form-file {
+    height:26px;
+}
+
+.ext-strict .x-form-text {
+    height:20px;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #fff;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger{
+    background-image:url(../images/access/form/trigger.gif);
+    border-bottom-color:#737b8c;
+    border-bottom-width:2px;
+    height:24px;
+    width:20px;
+}
+
+.x-form-field-wrap .x-form-trigger.x-form-trigger-over{
+    border-bottom-color:#d97e27;
+}
+
+.x-form-field-wrap .x-form-trigger.x-form-trigger-click{
+    border-bottom-color:#c86e19;
+}
+
+.x-small-editor .x-form-field-wrap .x-form-trigger {
+    height:24px;
+}
+
+.x-form-field-wrap .x-form-trigger-over {
+    background-position:-20px 0;
+}
+
+.x-form-field-wrap .x-form-trigger-click {
+    background-position:-40px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    background-position:-60px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-over {
+    background-position:-80px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-click {
+    background-position:-100px 0;
+}
+
+.x-form-field-wrap .x-form-date-trigger{
+    background-image: url(../images/access/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger{
+    background-image: url(../images/access/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger{
+    background-image: url(../images/access/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom-color:#737b8c;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus{
+	border-color:#ff9c33;
+}
+
+.x-form-invalid, textarea.x-form-invalid,
+.ext-webkit .x-form-invalid, .ext-webkit textarea.x-form-invalid{
+    background-color:#15171a;
+	background-image:url(../images/access/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+/*
+.ext-safari .x-form-invalid{
+	background-color:#fee;
+	border-color:#ff7870;
+}
+*/
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background-color:#fff;
+	background-image:url(../images/access/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 15px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:#dadadd;
+}
+
+.x-small-editor .x-form-text {
+    height: 26px;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-safari .x-small-editor .x-form-field {
+    font:normal 15px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/access/form/exclamation.gif);
+    height:25px;
+    width:19px;
+    background-position:center right;
+}
+
+.x-fieldset {
+    border-color:#737B8C;
+}
+
+.x-fieldset legend {
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+    color:#fff;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/progress.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/progress.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/progress.css	(revision 76)
@@ -0,0 +1,35 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-progress-wrap {
+    border-color:#18181a;
+}
+
+.x-progress-inner {
+    background-color:#232d38;
+    background-image:none;
+}
+
+.x-progress-bar {
+    background-color:#f39a00;
+    background-image:url(../images/access/progress/progress-bg.gif);
+    border-top-color:#a66900;
+    border-bottom-color:#a66900;
+    border-right-color:#ffb941;
+    height: 20px !important; /* structural override for Accessibility Theme */
+}
+
+.x-progress-text {
+    font-size:14px;
+    font-weight:bold;
+    color:#fff;
+    padding: 0 5px !important; /* structural override for Accessibility Theme */
+}
+
+.x-progress-text-back {
+    color:#aaa;
+    line-height: 19px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/menu.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/menu.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/menu.css	(revision 76)
@@ -0,0 +1,79 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-menu {
+	border-color:#222;
+    background-color:#414551;
+	background-image:url(../images/access/menu/menu.gif);
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 14px tahoma,arial, sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/access/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#223;
+	border-bottom-color:#666;
+}
+
+a.x-menu-item {
+	color:#fffff6;
+}
+
+.x-menu-item-active {
+	background-color: #f09134;
+	background-image: none;
+    border-color:#b36427;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#b36427;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/access/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/window.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/window.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/window.css	(revision 76)
@@ -0,0 +1,87 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-proxy {
+    background-color:#1f2833;
+    border-color:#18181a;
+}
+
+.x-window-tl .x-window-header {
+    color:#fff;
+	font:bold 14px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/access/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/access/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/access/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/access/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/access/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/access/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#18181a;
+    font: normal 14px tahoma,arial,helvetica,sans-serif;
+    background-color:#1f2833;
+}
+
+.x-window-ml {
+	background-image: url(../images/access/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/access/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#323945;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#323945;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#323945;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #464f61;
+    border-color: #636778;
+}
+
+.x-window-plain .x-window-body {
+    color: #fffff6;
+    border-color: #464F61;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #464f61;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/button.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/button.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/button.css	(revision 76)
@@ -0,0 +1,136 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-btn {
+	font:normal 14px tahoma, verdana, helvetica;
+}
+
+.x-btn button {
+    font:normal 14px arial,tahoma,verdana,helvetica;
+    color:#fffffa;
+    padding-left:6px !important;
+    padding-right:6px !important;
+}
+
+.x-btn-over .x-btn button{
+    color:#fff;
+}
+
+.x-btn-noicon .x-btn-small .x-btn-text, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text,
+.x-btn-icon .x-btn-small .x-btn-text, .x-btn-text-icon .x-btn-icon-small-right .x-btn-text {
+    height:18px;
+}
+
+.x-btn-icon .x-btn-small .x-btn-text {
+    width:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-small-left .x-btn-text {
+    padding-left:21px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-small-right .x-btn-text {
+    padding-right:21px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-left .x-btn-text {
+    padding-left:29px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-right .x-btn-text {
+    padding-right:29px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-large-left .x-btn-text {
+    padding-left:37px !important;
+}
+
+.x-btn-text-icon .x-btn-icon-large-right .x-btn-text {
+    padding-right:37px !important;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/access/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#fff;
+}
+
+.x-btn-disabled *{
+	color:#eee !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/access/button/arrow.gif);
+    padding-right:13px;
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow.gif);
+    padding-right:20px;
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/access/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/access/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/access/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #d2d2d2;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/access/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/access/button/group-lr.gif);
+}
+
+.x-btn-group-mr {
+	background-image: url(../images/access/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/access/button/group-tb.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/layout.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/layout.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/layout.css	(revision 76)
@@ -0,0 +1,56 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-border-layout-ct {
+    background-color:#3f4757;
+}
+
+.x-accordion-hd {
+	color:#fff;
+    font-weight:normal;
+    background-image: url(../images/access/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#323845;
+	border-color:#1a1a1c;
+}
+
+.x-layout-collapsed-over{
+    background-color:#2d3440;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/resizable.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/resizable.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/resizable.css	(revision 76)
@@ -0,0 +1,44 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-resizable-handle {
+	background-color:#fff;
+	color: #000;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/access/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/access/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/access/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/access/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/access/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/access/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/access/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/slider.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/slider.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/slider.css	(revision 76)
@@ -0,0 +1,21 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/access/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/access/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/access/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/access/slider/slider-v-thumb.png);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/list-view.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/list-view.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/list-view.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-list-header{
+    background-color:#393d4e;
+	background-image:url(../images/access/toolbar/bg.gif);
+	background-position:0 top;
+}
+
+.x-list-header-inner div em {
+    border-left-color:#667;
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+    line-height: 14px;
+}
+
+.x-list-body-inner {
+    background-color:#1B232B;
+}
+
+.x-list-body dt em {
+    font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#7E5530;
+}
+
+.x-list-selected {
+    background-color:#E5872C;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/access/grid/sort-hd.gif);
+    border-color: #3e4e6c;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/grid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/grid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/grid.css	(revision 76)
@@ -0,0 +1,288 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-grid3 {
+    background-color:#1f2933;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#223;
+}
+
+.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    border-left-color:#556;
+    border-right-color:#223;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border:0 none;
+    border-bottom:1px solid #111;
+    border-right:1px solid #1a1a1c;
+}
+
+.x-grid3-row-alt{
+	background-color:#1b232b;
+}
+
+.x-grid3-row-over {
+    background-color:#7e5530;
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#3b3f50;
+	background-image:url(../images/access/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#889;
+    border-right-color:#445;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#4e628a;
+    background-image:url(../images/access/grid/grid3-hrow-over.gif);
+}
+
+.x-grid3-cell-inner, .x-grid3-hd-inner {
+    color:#fff;
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/access/grid/sort_asc.gif);
+	width:15px;
+	height:9px;
+	margin-left:5px;
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/access/grid/sort_desc.gif);
+	width:15px;
+	height:9px;
+	margin-left:5px;
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#fff;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#fff;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/access/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+.x-grid3-row-selected {
+	background-color: #e5872c !important;
+	background-image: none;
+	border-style: solid;
+}
+
+.x-grid3-row-selected .x-grid3-cell {
+    color: #fff;
+}
+
+.x-grid3-cell-selected {
+	background-color: #ffa340 !important;
+	color:#fff;
+}
+
+.x-grid3-cell-selected span{
+	color:#fff !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#fff;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#fff;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#fff !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/access/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 14px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/access/grid/grid3-special-col-bg.gif) !important;
+    color:#fff !important;
+}
+.x-props-grid .x-grid3-td-value {
+    color:#fff !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#263240 !important;
+    border-right-color:#223;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/access/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c2c9d0;
+    background-image:url(../images/access/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/access/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#fff;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/access/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/access/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#4e628a;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/access/grid/group-collapse.gif);
+    background-position:3px 6px;
+    color:#ffd;
+    font:bold 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/access/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 14px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row{
+    border-top-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/editor.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/editor.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/editor.css	(revision 76)
@@ -0,0 +1,16 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-html-editor-wrap {
+    border-color:#737B8C;
+    background-color:#fff;
+}
+.x-html-editor-wrap iframe {
+    background-color: #fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/access/editor/tb-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/debug.css	(revision 76)
@@ -0,0 +1,24 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+#x-debug-browser .x-tree .x-tree-node a span {
+    color:#222297;
+    font-size:14px;
+    font-family:"monotype","courier new",sans-serif;
+}
+
+#x-debug-browser .x-tree a i {
+    color:#ff4545;
+    font-style:normal;
+}
+
+#x-debug-browser .x-tree a em {
+    color:#999;
+}
+
+#x-debug-browser .x-tree .x-tree-node .x-tree-selected a span{
+    background-color:#c3daf9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dd.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dd.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-access/dd.css	(revision 76)
@@ -0,0 +1,29 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 14px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-gray.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-gray.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-gray.css	(revision 76)
@@ -0,0 +1,1682 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#999;
+    background-color:#ddd;
+    background-image:url(../images/gray/panel/white-top-bottom.gif);
+    background-position: 0 -1px;
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#d0d0d0;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#CFCFCF;
+    background-color: #eaeaea;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #eaeaea;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #eaeaea;
+	border-color:#d0d0d0;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#d0d0d0;
+}
+
+ul.x-tab-strip-top{
+    background-color:#dbdbdb;
+	background-image: url(../images/gray/tabs/tab-strip-bg.gif);
+	border-bottom-color:#d0d0d0;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#dbdbdb;
+	background-image: url(../images/gray/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#d0d0d0;
+    background-color: #eaeaea;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#333;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#111;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#333;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/gray/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/gray/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/gray/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#d0d0d0;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/gray/tabs/scroll-left.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/gray/tabs/scroll-right.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#d0d0d0;
+}
+.x-form-field{
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field{
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#C1C1C1;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#C1C1C1;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #d0d0d0;
+    color: #333;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger{
+    background-image:url(../images/gray/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger{
+    background-image: url(../images/gray/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger{
+    background-image: url(../images/gray/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger{
+    background-image: url(../images/gray/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom-color: #777777;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus{
+	border-color:#777777;
+}
+
+.x-form-invalid, textarea.x-form-invalid{
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.ext-webkit .x-form-invalid{
+	background-color:#fee;
+	border-color:#ff7870;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 12px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#CCCCCC;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#777777;
+}.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/gray/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/gray/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/gray/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #666;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/gray/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/gray/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
+.x-toolbar{
+	border-color:#d0d0d0;
+    background-color:#f0f0f0;
+    background-image:url(../images/gray/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split 
+{
+    background-image:url(../images/gray/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom 
+{
+    background-image:url(../images/gray/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/gray/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/gray/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/gray/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/gray/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/gray/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/loading.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/gray/toolbar/more.gif) !important;
+}
+.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/gray/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/gray/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/gray/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/gray/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/gray/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/gray/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/gray/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#565656;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#d0d0d0;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+    font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow2.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#ACACAC;
+    border-right-color:#ACACAC;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#f9f9f9;
+    background-image:url(../images/gray/grid/grid3-hrow-over2.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/gray/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/gray/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#333;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow-over2.gif);
+	border-color:#ACACAC;
+}
+
+.col-move-top{
+	background-image:url(../images/gray/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/gray/grid/col-move-bottom.gif);
+}
+
+.x-grid3-row-selected {
+	background-color:#CCCCCC !important;
+	background-image: none;
+	border-color:#ACACAC;
+}
+
+.x-grid3-cell-selected{
+	background-color: #CBCBCB !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#333 !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#f9f9f9;
+    background-image:url(../images/gray/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/gray/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/gray/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/gray/grid/group-collapse.gif);
+    color:#5F5F5F;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/gray/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row{
+    border-top-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#B9B9B9;
+}
+.x-pivotgrid .x-grid3-header-offset table td {
+    background: url(../images/gray/grid/grid3-hrow2.gif) repeat-x 50% 100%;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #D0D0D0;
+    border-right-color: #D0D0D0;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    background-color: #f9f9f9;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+    border-bottom: 1px solid;
+    border-bottom-color: #D0D0D0;
+    height: 18px;
+}
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#D6D6D6;
+    border-color:#888888;
+}.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.ext-ie .x-tree-node-el input {
+    width:15px;
+    height:15px;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/gray/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/gray/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/gray/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/gray/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #ddd;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}
+.x-date-picker {
+    border-color:#585858;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/gray/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/gray/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/gray/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/gray/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#D8D8D8;
+    background-image: url(../images/gray/panel/white-top-bottom.gif);
+	border-bottom-color:#AFAFAF;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#595959;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-image: none;
+    background-color:#D8D8D8;
+	border-color:#DCDCDC;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#AFAFAF;
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#D8D8D8;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#4E565F;
+	color:#fff;
+	border-color:#C0C0C0 #434343 #434343 #C0C0C0;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+}
+
+.x-date-mp-btns td {
+	border-top-color:#AFAFAF;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color: #333;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#333;
+	background-color:#FDFDFD;
+}
+
+td.x-date-mp-sel a {
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+	border-color:#DCDCDC;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/gray/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#D7D7D7;
+}.x-tip .x-tip-close{
+	background-image: url(../images/gray/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/gray/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/gray/qtip/tip-anchor-sprite.gif);
+}.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#7D7D7D;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/gray/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/gray/menu/item-over.gif);
+	background-color: #f1f1f1;
+    border-color:#ACACAC;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#ACACAC;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/gray/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#AFAFAF;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#B9B9B9 !important;
+    background-color:#F1F1F1;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}
+.x-combo-list {
+    border-color:#ccc;
+    background-color:#ddd;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#333;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#BCBCBC;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#BEBEBE;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#777 !important;
+    background-color:#f0f0f0;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#BCBCBC;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}.x-panel {
+    border-color: #d0d0d0;
+}
+
+.x-panel-header {
+    color:#333;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#d0d0d0;
+    background-image: url(../images/gray/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#d0d0d0;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#d0d0d0;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#333;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/gray/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/gray/panel/corners-sprite.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-bc {
+	background-image: url(../images/gray/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#f1f1f1;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/gray/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/gray/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/gray/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#f2f2f2;
+}
+
+.x-panel-ghost ul {
+    border-color:#d0d0d0;
+}
+
+.x-panel-dd-spacer {
+    border-color:#d0d0d0;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+.x-window-proxy {
+    background-color:#fcfcfc;
+    border-color:#d0d0d0;
+}
+
+.x-window-tl .x-window-header {
+    color:#555;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/gray/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/gray/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/gray/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/gray/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/gray/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/gray/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#d0d0d0;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#e8e8e8;
+}
+
+.x-window-ml {
+	background-image: url(../images/gray/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/gray/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #E8E8E8;
+    border-color: #D0D0D0 #EEEEEE #EEEEEE #D0D0D0;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #EEEEEE #D0D0D0 #D0D0D0 #EEEEEE;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #E4E4E4;
+}
+.x-html-editor-wrap {
+    border-color:#BCBCBC;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-border-layout-ct {
+    background-color:#f0f0f0;
+}
+.x-border-layout-ct {
+    background-color:#f0f0f0;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/gray/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#dfdfdf;
+	border-color:#d0d0d0;
+}
+
+.x-layout-collapsed-over{
+    background-color:#e7e7e7;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-progress-wrap {
+    border-color:#8E8E8E;
+}
+
+.x-progress-inner {
+    background-color:#E7E7E7;
+    background-image:url(../images/gray/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#BCBCBC;
+    background-image:url(../images/gray/progress/progress-bg.gif);
+    border-top-color:#E2E2E2;
+    border-bottom-color:#A4A4A4;
+    border-right-color:#A4A4A4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#5F5F5F;
+}
+.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow2.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#f0f0f0;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/gray/grid/sort-hd.gif);
+    border-color: #d0d0d0;
+}
+.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/gray/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/gray/slider/slider-v-thumb.png);
+}
+.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/gray/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/gray/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/gray/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/gray/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/box.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/box.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/box.css	(revision 76)
@@ -0,0 +1,74 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/core.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/core.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/core.css	(revision 76)
@@ -0,0 +1,83 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#999;
+    background-color:#ddd;
+    background-image:url(../images/gray/panel/white-top-bottom.gif);
+    background-position: 0 -1px;
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#d0d0d0;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#CFCFCF;
+    background-color: #eaeaea;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #eaeaea;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/date-picker.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/date-picker.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/date-picker.css	(revision 76)
@@ -0,0 +1,143 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-date-picker {
+    border-color:#585858;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/gray/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/gray/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/gray/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/gray/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#D8D8D8;
+    background-image: url(../images/gray/panel/white-top-bottom.gif);
+	border-bottom-color:#AFAFAF;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#595959;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-image: none;
+    background-color:#D8D8D8;
+	border-color:#DCDCDC;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#AFAFAF;
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#D8D8D8;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#4E565F;
+	color:#fff;
+	border-color:#C0C0C0 #434343 #434343 #C0C0C0;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+}
+
+.x-date-mp-btns td {
+	border-top-color:#AFAFAF;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color: #333;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#333;
+	background-color:#FDFDFD;
+}
+
+td.x-date-mp-sel a {
+    background-color:#D8D8D8;
+    background:#D8D8D8 url(../images/gray/panel/white-top-bottom.gif) 0 -2px;
+	border-color:#DCDCDC;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/gray/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#D7D7D7;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tabs.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tabs.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tabs.css	(revision 76)
@@ -0,0 +1,127 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #eaeaea;
+	border-color:#d0d0d0;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#d0d0d0;
+}
+
+ul.x-tab-strip-top{
+    background-color:#dbdbdb;
+	background-image: url(../images/gray/tabs/tab-strip-bg.gif);
+	border-bottom-color:#d0d0d0;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#dbdbdb;
+	background-image: url(../images/gray/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#d0d0d0;
+    background-color: #eaeaea;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#333;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#111;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#333;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/gray/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/gray/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/gray/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/gray/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/gray/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#d0d0d0;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/gray/tabs/scroll-left.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/gray/tabs/scroll-right.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#d0d0d0;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tree.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tree.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/tree.css	(revision 76)
@@ -0,0 +1,157 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.ext-ie .x-tree-node-el input {
+    width:15px;
+    height:15px;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/gray/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/gray/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/gray/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/gray/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/gray/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #ddd;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/combo.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/combo.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/combo.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-combo-list {
+    border-color:#ccc;
+    background-color:#ddd;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#333;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#BCBCBC;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#BEBEBE;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#777 !important;
+    background-color:#f0f0f0;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#BCBCBC;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dialog.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dialog.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dialog.css	(revision 76)
@@ -0,0 +1,34 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/gray/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/gray/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/gray/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/gray/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/panel.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/panel.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/panel.css	(revision 76)
@@ -0,0 +1,87 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel {
+    border-color: #d0d0d0;
+}
+
+.x-panel-header {
+    color:#333;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#d0d0d0;
+    background-image: url(../images/gray/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#d0d0d0;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#d0d0d0;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#333;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/gray/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/gray/panel/corners-sprite.gif);
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-bc {
+	background-image: url(../images/gray/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#f1f1f1;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/gray/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/gray/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/gray/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#f2f2f2;
+}
+
+.x-panel-ghost ul {
+    border-color:#d0d0d0;
+}
+
+.x-panel-dd-spacer {
+    border-color:#d0d0d0;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/qtips.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/qtips.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/qtips.css	(revision 76)
@@ -0,0 +1,44 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tip .x-tip-close{
+	background-image: url(../images/gray/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/gray/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/gray/qtip/tip-anchor-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/borders.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/borders.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/borders.css	(revision 76)
@@ -0,0 +1,29 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-border-layout-ct {
+    background-color:#f0f0f0;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/toolbar.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/toolbar.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/toolbar.css	(revision 76)
@@ -0,0 +1,95 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-toolbar{
+	border-color:#d0d0d0;
+    background-color:#f0f0f0;
+    background-image:url(../images/gray/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split 
+{
+    background-image:url(../images/gray/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom, 
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom 
+{
+    background-image:url(../images/gray/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/gray/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/gray/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/gray/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/gray/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/gray/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/loading.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/gray/toolbar/more.gif) !important;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/form.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/form.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/form.css	(revision 76)
@@ -0,0 +1,117 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-form-field{
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field{
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#C1C1C1;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#C1C1C1;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #d0d0d0;
+    color: #333;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger{
+    background-image:url(../images/gray/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger{
+    background-image: url(../images/gray/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger{
+    background-image: url(../images/gray/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger{
+    background-image: url(../images/gray/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom-color: #777777;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus{
+	border-color:#777777;
+}
+
+.x-form-invalid, textarea.x-form-invalid{
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.ext-webkit .x-form-invalid{
+	background-color:#fee;
+	border-color:#ff7870;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 12px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#CCCCCC;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#777777;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/progress.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/progress.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/progress.css	(revision 76)
@@ -0,0 +1,32 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-progress-wrap {
+    border-color:#8E8E8E;
+}
+
+.x-progress-inner {
+    background-color:#E7E7E7;
+    background-image:url(../images/gray/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#BCBCBC;
+    background-image:url(../images/gray/progress/progress-bg.gif);
+    border-top-color:#E2E2E2;
+    border-bottom-color:#A4A4A4;
+    border-right-color:#A4A4A4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#5F5F5F;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/menu.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/menu.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/menu.css	(revision 76)
@@ -0,0 +1,82 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#7D7D7D;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/gray/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/gray/menu/item-over.gif);
+	background-color: #f1f1f1;
+    border-color:#ACACAC;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#ACACAC;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/gray/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#AFAFAF;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#B9B9B9 !important;
+    background-color:#F1F1F1;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/window.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/window.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/window.css	(revision 76)
@@ -0,0 +1,86 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-proxy {
+    background-color:#fcfcfc;
+    border-color:#d0d0d0;
+}
+
+.x-window-tl .x-window-header {
+    color:#555;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/gray/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/gray/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/gray/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/gray/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/gray/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/gray/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#d0d0d0;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#e8e8e8;
+}
+
+.x-window-ml {
+	background-image: url(../images/gray/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/gray/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#d0d0d0;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #E8E8E8;
+    border-color: #D0D0D0 #EEEEEE #EEEEEE #D0D0D0;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #EEEEEE #D0D0D0 #D0D0D0 #EEEEEE;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #E4E4E4;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/pivotgrid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/pivotgrid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/pivotgrid.css	(revision 76)
@@ -0,0 +1,28 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-pivotgrid .x-grid3-header-offset table td {
+    background: url(../images/gray/grid/grid3-hrow2.gif) repeat-x 50% 100%;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #D0D0D0;
+    border-right-color: #D0D0D0;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    background-color: #f9f9f9;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+    border-bottom: 1px solid;
+    border-bottom-color: #D0D0D0;
+    height: 18px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/button.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/button.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/button.css	(revision 76)
@@ -0,0 +1,94 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/gray/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/gray/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/gray/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #666;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/gray/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/gray/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/gray/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/gray/button/group-tb.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/layout.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/layout.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/layout.css	(revision 76)
@@ -0,0 +1,53 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-border-layout-ct {
+    background-color:#f0f0f0;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/gray/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#dfdfdf;
+	border-color:#d0d0d0;
+}
+
+.x-layout-collapsed-over{
+    background-color:#e7e7e7;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/resizable.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/resizable.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/resizable.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/gray/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/gray/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/gray/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/gray/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/gray/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/gray/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/gray/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#565656;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/slider.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/slider.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/slider.css	(revision 76)
@@ -0,0 +1,21 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/gray/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/gray/slider/slider-v-thumb.png);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/list-view.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/list-view.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/list-view.css	(revision 76)
@@ -0,0 +1,37 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow2.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#f0f0f0;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/gray/grid/sort-hd.gif);
+    border-color: #d0d0d0;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/grid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/grid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/grid.css	(revision 76)
@@ -0,0 +1,276 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#d0d0d0;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+    font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow2.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#ACACAC;
+    border-right-color:#ACACAC;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#f9f9f9;
+    background-image:url(../images/gray/grid/grid3-hrow-over2.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/gray/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/gray/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#333;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#f9f9f9;
+	background-image:url(../images/gray/grid/grid3-hrow-over2.gif);
+	border-color:#ACACAC;
+}
+
+.col-move-top{
+	background-image:url(../images/gray/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/gray/grid/col-move-bottom.gif);
+}
+
+.x-grid3-row-selected {
+	background-color:#CCCCCC !important;
+	background-image: none;
+	border-color:#ACACAC;
+}
+
+.x-grid3-cell-selected{
+	background-color: #CBCBCB !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#333 !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#f9f9f9;
+    background-image:url(../images/gray/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/gray/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/gray/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#d0d0d0;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/gray/grid/group-collapse.gif);
+    color:#5F5F5F;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/gray/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row{
+    border-top-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#B9B9B9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/editor.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/editor.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/editor.css	(revision 76)
@@ -0,0 +1,13 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-html-editor-wrap {
+    border-color:#BCBCBC;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/debug.css	(revision 76)
@@ -0,0 +1,24 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+#x-debug-browser .x-tree .x-tree-node a span {
+    color:#222297;
+    font-size:11px;
+    font-family:"monotype","courier new",sans-serif;
+}
+
+#x-debug-browser .x-tree a i {
+    color:#ff4545;
+    font-style:normal;
+}
+
+#x-debug-browser .x-tree a em {
+    color:#999;
+}
+
+#x-debug-browser .x-tree .x-tree-node .x-tree-selected a span{
+    background-color:#D5D5D5;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dd.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dd.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/theme-gray/dd.css	(revision 76)
@@ -0,0 +1,29 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#D6D6D6;
+    border-color:#888888;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/box.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/box.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/box.css	(revision 76)
@@ -0,0 +1,74 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/core.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/core.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/core.css	(revision 76)
@@ -0,0 +1,82 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#6593cf;
+    background-color:#c3daf9;
+    background-image:url(../images/default/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#a3bad9;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #deecfd;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/date-picker.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/date-picker.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/date-picker.css	(revision 76)
@@ -0,0 +1,143 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-date-picker {
+    border-color: #1b376c;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/default/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/default/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/default/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+	border-bottom-color:#a3bad9;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#233d6d;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#dfecfb;
+	background-image:url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#a3bad9;
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#ddecfe;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#15428b;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#15428b;
+	background-color: #ddecfe;
+}
+
+td.x-date-mp-sel a {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tabs.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tabs.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tabs.css	(revision 76)
@@ -0,0 +1,127 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #deecfd;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#8db2e3;
+}
+
+ul.x-tab-strip-top{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-bg.gif);
+	border-bottom-color:#8db2e3;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#8db2e3;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#8db2e3;
+    background-color: #deecfd;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#416aa3;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#15428b;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#15428b;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/default/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#8db2e3;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/default/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/default/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tree.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tree.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/tree.css	(revision 76)
@@ -0,0 +1,152 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #d9e8fb;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/combo.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/combo.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/combo.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-combo-list {
+    border-color:#98c0f4;
+    background-color:#ddecfe;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#a3bae9 !important;
+    background-color:#dfe8f6;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dialog.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dialog.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dialog.css	(revision 76)
@@ -0,0 +1,34 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/default/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/default/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/default/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/default/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/panel.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/panel.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/panel.css	(revision 76)
@@ -0,0 +1,87 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel {
+    border-color: #99bbe8;
+}
+
+.x-panel-header {
+    color:#15428b;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#99bbe8;
+    background-image: url(../images/default/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#99bbe8;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/default/panel/corners-sprite.gif);
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-bc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/default/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/default/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#cbddf3;
+}
+
+.x-panel-ghost ul {
+    border-color:#99bbe8;
+}
+
+.x-panel-dd-spacer {
+    border-color:#99bbe8;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/qtips.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/qtips.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/qtips.css	(revision 76)
@@ -0,0 +1,44 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-tip .x-tip-close{
+	background-image: url(../images/default/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/default/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/default/qtip/tip-anchor-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/borders.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/borders.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/borders.css	(revision 76)
@@ -0,0 +1,25 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/toolbar.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/toolbar.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/toolbar.css	(revision 76)
@@ -0,0 +1,95 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-toolbar{
+	border-color:#a9bfd3;
+    background-color:#d0def0;
+    background-image:url(../images/default/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split
+{
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom
+{
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-blue-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/default/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/refresh-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/default/toolbar/more.gif) !important;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/form.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/form.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/form.css	(revision 76)
@@ -0,0 +1,123 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-form-field {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field {
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#b5b8c8;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #15428b;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger {
+    background-image:url(../images/default/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger {
+    background-image: url(../images/default/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger {
+    background-image: url(../images/default/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger {
+    background-image: url(../images/default/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    border-bottom-color:#7eadd9;
+}
+
+.x-item-disabled .x-form-trigger-over {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus {
+	border-color:#7eadd9;
+}
+
+.x-form-invalid, textarea.x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-invalid.x-form-composite {
+    border: none;
+    background-image: none;
+}
+
+.x-form-invalid.x-form-composite .x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#b5b8c8;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/progress.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/progress.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/progress.css	(revision 76)
@@ -0,0 +1,32 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-progress-wrap {
+    border-color:#6593cf;
+}
+
+.x-progress-inner {
+    background-color:#e0e8f3;
+    background-image:url(../images/default/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#9cbfee;
+    background-image:url(../images/default/progress/progress-bg.gif);
+    border-top-color:#d1e4fd;
+    border-bottom-color:#7fa9e4;
+    border-right-color:#7fa9e4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#396095;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/menu.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/menu.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/menu.css	(revision 76)
@@ -0,0 +1,87 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#718bb7;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/default/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/default/menu/item-over.gif);
+	background-color: #dbecf4;
+    border-color:#aaccf6;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#aaccf6;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/default/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#f0f0f0 !important;
+    background-image: none;
+}
+
+.x-date-menu, .x-color-menu{
+    background-color: #fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/window.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/window.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/window.css	(revision 76)
@@ -0,0 +1,86 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-window-proxy {
+    background-color:#c7dffc;
+    border-color:#99bbe8;
+}
+
+.x-window-tl .x-window-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#99bbe8;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-window-ml {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#84a0c4;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+    border-color: #a3bae9 #dfe8f6 #dfe8f6 #a3bae9;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #dfe8f6 #a3bae9 #a3bae9 #dfe8f6;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/pivotgrid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/pivotgrid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/pivotgrid.css	(revision 76)
@@ -0,0 +1,28 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-pivotgrid .x-grid3-header-offset table td {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x 50% 100%;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    background-color: #f9f9f9;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+    border-bottom: 1px solid;
+    border-bottom-color: #D0D0D0;
+    height: 18px;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/button.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/button.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/button.css	(revision 76)
@@ -0,0 +1,94 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/default/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #3e6aaa;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/layout.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/layout.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/layout.css	(revision 76)
@@ -0,0 +1,53 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-border-layout-ct {
+    background-color:#dfe8f6;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/default/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#d2e0f2;
+	border-color:#98c0f4;
+}
+
+.x-layout-collapsed-over{
+    background-color:#d9e8fb;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/resizable.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/resizable.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/resizable.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/default/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/default/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/default/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/default/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/default/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/slider.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/slider.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/slider.css	(revision 76)
@@ -0,0 +1,21 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-v-thumb.png);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/list-view.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/list-view.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/list-view.css	(revision 76)
@@ -0,0 +1,37 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#dfe8f6;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/default/grid/sort-hd.gif);
+    border-color: #99bbe8;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/grid.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/grid.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/grid.css	(revision 76)
@@ -0,0 +1,277 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#99bbe8;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+	font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#aaccf6;
+    border-right-color:#aaccf6;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#ebf3fd;
+    background-image:url(../images/default/grid/grid3-hrow-over.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#15428b;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/default/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+td.grid-hd-group-cell {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x bottom;
+}
+
+.x-grid3-row-selected {
+	background-color: #dfe8f6 !important;
+	background-image: none;
+	border-color:#a3bae9;
+}
+
+.x-grid3-cell-selected{
+	background-color: #b8cfee !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#15428b !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c3daf9;
+    background-image:url(../images/default/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/default/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/default/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#99bbe8;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-collapse.gif);
+    color:#3764a0;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/editor.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/editor.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/editor.css	(revision 76)
@@ -0,0 +1,13 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-html-editor-wrap {
+    border-color:#a9bfd3;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/debug.css	(revision 76)
@@ -0,0 +1,24 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+#x-debug-browser .x-tree .x-tree-node a span {
+    color:#222297;
+    font-size:11px;
+    font-family:"monotype","courier new",sans-serif;
+}
+
+#x-debug-browser .x-tree a i {
+    color:#ff4545;
+    font-style:normal;
+}
+
+#x-debug-browser .x-tree a em {
+    color:#999;
+}
+
+#x-debug-browser .x-tree .x-tree-node .x-tree-selected a span{
+    background-color:#c3daf9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dd.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dd.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/visual/dd.css	(revision 76)
@@ -0,0 +1,29 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-blue.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-blue.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/xtheme-blue.css	(revision 76)
@@ -0,0 +1,1674 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#6593cf;
+    background-color:#c3daf9;
+    background-image:url(../images/default/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#a3bad9;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #deecfd;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #deecfd;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#8db2e3;
+}
+
+ul.x-tab-strip-top{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-bg.gif);
+	border-bottom-color:#8db2e3;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#8db2e3;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#8db2e3;
+    background-color: #deecfd;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#416aa3;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#15428b;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#15428b;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/default/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#8db2e3;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/default/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/default/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}.x-form-field {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field {
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#b5b8c8;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #15428b;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger {
+    background-image:url(../images/default/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger {
+    background-image: url(../images/default/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger {
+    background-image: url(../images/default/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger {
+    background-image: url(../images/default/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    border-bottom-color:#7eadd9;
+}
+
+.x-item-disabled .x-form-trigger-over {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus {
+	border-color:#7eadd9;
+}
+
+.x-form-invalid, textarea.x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-invalid.x-form-composite {
+    border: none;
+    background-image: none;
+}
+
+.x-form-invalid.x-form-composite .x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#b5b8c8;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+}
+.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/default/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #3e6aaa;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}.x-toolbar{
+	border-color:#a9bfd3;
+    background-color:#d0def0;
+    background-image:url(../images/default/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split
+{
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom
+{
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-blue-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/default/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/refresh-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/default/toolbar/more.gif) !important;
+}.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/default/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/default/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/default/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/default/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/default/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#99bbe8;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+	font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#aaccf6;
+    border-right-color:#aaccf6;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#ebf3fd;
+    background-image:url(../images/default/grid/grid3-hrow-over.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#15428b;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/default/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+td.grid-hd-group-cell {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x bottom;
+}
+
+.x-grid3-row-selected {
+	background-color: #dfe8f6 !important;
+	background-image: none;
+	border-color:#a3bae9;
+}
+
+.x-grid3-cell-selected{
+	background-color: #b8cfee !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#15428b !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c3daf9;
+    background-image:url(../images/default/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/default/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/default/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#99bbe8;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-collapse.gif);
+    color:#3764a0;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}.x-pivotgrid .x-grid3-header-offset table td {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x 50% 100%;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    background-color: #f9f9f9;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+    border-bottom: 1px solid;
+    border-bottom-color: #D0D0D0;
+    height: 18px;
+}
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #d9e8fb;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}.x-date-picker {
+    border-color: #1b376c;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/default/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/default/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/default/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+	border-bottom-color:#a3bad9;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#233d6d;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#dfecfb;
+	background-image:url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#a3bad9;
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#ddecfe;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#15428b;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#15428b;
+	background-color: #ddecfe;
+}
+
+td.x-date-mp-sel a {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}.x-tip .x-tip-close{
+	background-image: url(../images/default/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/default/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/default/qtip/tip-anchor-sprite.gif);
+}.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#718bb7;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/default/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/default/menu/item-over.gif);
+	background-color: #dbecf4;
+    border-color:#aaccf6;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#aaccf6;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/default/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#f0f0f0 !important;
+    background-image: none;
+}
+
+.x-date-menu, .x-color-menu{
+    background-color: #fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}.x-combo-list {
+    border-color:#98c0f4;
+    background-color:#ddecfe;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#a3bae9 !important;
+    background-color:#dfe8f6;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}.x-panel {
+    border-color: #99bbe8;
+}
+
+.x-panel-header {
+    color:#15428b;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#99bbe8;
+    background-image: url(../images/default/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#99bbe8;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/default/panel/corners-sprite.gif);
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-bc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/default/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/default/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#cbddf3;
+}
+
+.x-panel-ghost ul {
+    border-color:#99bbe8;
+}
+
+.x-panel-dd-spacer {
+    border-color:#99bbe8;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+.x-window-proxy {
+    background-color:#c7dffc;
+    border-color:#99bbe8;
+}
+
+.x-window-tl .x-window-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#99bbe8;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-window-ml {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#84a0c4;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+    border-color: #a3bae9 #dfe8f6 #dfe8f6 #a3bae9;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #dfe8f6 #a3bae9 #a3bae9 #dfe8f6;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+}.x-html-editor-wrap {
+    border-color:#a9bfd3;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}.x-border-layout-ct {
+    background-color:#dfe8f6;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/default/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#d2e0f2;
+	border-color:#98c0f4;
+}
+
+.x-layout-collapsed-over{
+    background-color:#d9e8fb;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}.x-progress-wrap {
+    border-color:#6593cf;
+}
+
+.x-progress-inner {
+    background-color:#e0e8f3;
+    background-image:url(../images/default/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#9cbfee;
+    background-image:url(../images/default/progress/progress-bg.gif);
+    border-top-color:#d1e4fd;
+    border-bottom-color:#7fa9e4;
+    border-right-color:#7fa9e4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#396095;
+}.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#dfe8f6;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/default/grid/sort-hd.gif);
+    border-color: #99bbe8;
+}.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-v-thumb.png);
+}.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/default/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/default/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/default/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/default/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/yourtheme.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/yourtheme.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/yourtheme.css	(revision 76)
@@ -0,0 +1,1652 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#6593cf;
+    background-color:#c3daf9;
+    background-image:url(../images/default/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#a3bad9;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #deecfd;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #deecfd;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#8db2e3;
+}
+
+ul.x-tab-strip-top{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-bg.gif);
+	border-bottom-color:#8db2e3;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#8db2e3;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#8db2e3;
+    background-color: #deecfd;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#416aa3;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#15428b;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#15428b;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/default/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#8db2e3;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/default/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/default/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}.x-form-field {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field {
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#b5b8c8;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #15428b;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger {
+    background-image:url(../images/default/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger {
+    background-image: url(../images/default/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger {
+    background-image: url(../images/default/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger {
+    background-image: url(../images/default/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    border-bottom-color:#7eadd9;
+}
+
+.x-item-disabled .x-form-trigger-over {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus {
+	border-color:#7eadd9;
+}
+
+.x-form-invalid, textarea.x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-invalid.x-form-composite {
+    border: none;
+    background-image: none;
+}
+
+.x-form-invalid.x-form-composite .x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#b5b8c8;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+}
+.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/default/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #3e6aaa;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}.x-toolbar{
+	border-color:#a9bfd3;
+    background-color:#d0def0;
+    background-image:url(../images/default/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split
+{
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom
+{
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-blue-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/default/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/refresh-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/default/toolbar/more.gif) !important;
+}.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/default/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/default/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/default/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/default/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/default/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#99bbe8;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+	font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#aaccf6;
+    border-right-color:#aaccf6;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#ebf3fd;
+    background-image:url(../images/default/grid/grid3-hrow-over.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#15428b;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/default/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+td.grid-hd-group-cell {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x bottom;
+}
+
+.x-grid3-row-selected {
+	background-color: #dfe8f6 !important;
+	background-image: none;
+	border-color:#a3bae9;
+}
+
+.x-grid3-cell-selected{
+	background-color: #b8cfee !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#15428b !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c3daf9;
+    background-image:url(../images/default/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/default/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/default/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#99bbe8;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-collapse.gif);
+    color:#3764a0;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #d9e8fb;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}.x-date-picker {
+    border-color: #1b376c;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/default/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/default/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/default/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+	border-bottom-color:#a3bad9;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#233d6d;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#dfecfb;
+	background-image:url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#a3bad9;
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#ddecfe;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#15428b;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#15428b;
+	background-color: #ddecfe;
+}
+
+td.x-date-mp-sel a {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}.x-tip .x-tip-close{
+	background-image: url(../images/default/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/default/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/default/qtip/tip-anchor-sprite.gif);
+}.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#718bb7;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/default/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/default/menu/item-over.gif);
+	background-color: #dbecf4;
+    border-color:#aaccf6;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#aaccf6;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/default/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#f0f0f0 !important;
+    background-image: none;
+}
+
+.x-date-menu, .x-color-menu{
+    background-color: #fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}.x-combo-list {
+    border-color:#98c0f4;
+    background-color:#ddecfe;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#a3bae9 !important;
+    background-color:#dfe8f6;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}.x-panel {
+    border-color: #99bbe8;
+}
+
+.x-panel-header {
+    color:#15428b;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#99bbe8;
+    background-image: url(../images/default/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#99bbe8;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/default/panel/corners-sprite.gif);
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-bc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/default/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/default/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#cbddf3;
+}
+
+.x-panel-ghost ul {
+    border-color:#99bbe8;
+}
+
+.x-panel-dd-spacer {
+    border-color:#99bbe8;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+.x-window-proxy {
+    background-color:#c7dffc;
+    border-color:#99bbe8;
+}
+
+.x-window-tl .x-window-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#99bbe8;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-window-ml {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#84a0c4;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+    border-color: #a3bae9 #dfe8f6 #dfe8f6 #a3bae9;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #dfe8f6 #a3bae9 #a3bae9 #dfe8f6;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+}.x-html-editor-wrap {
+    border-color:#a9bfd3;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}.x-border-layout-ct {
+    background-color:#dfe8f6;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/default/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#d2e0f2;
+	border-color:#98c0f4;
+}
+
+.x-layout-collapsed-over{
+    background-color:#d9e8fb;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}.x-progress-wrap {
+    border-color:#6593cf;
+}
+
+.x-progress-inner {
+    background-color:#e0e8f3;
+    background-image:url(../images/default/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#9cbfee;
+    background-image:url(../images/default/progress/progress-bg.gif);
+    border-top-color:#d1e4fd;
+    border-bottom-color:#7fa9e4;
+    border-right-color:#7fa9e4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#396095;
+}.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#dfe8f6;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/default/grid/sort-hd.gif);
+    border-color: #99bbe8;
+}.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-v-thumb.png);
+}.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/default/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/default/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/default/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/default/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all-notheme.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all-notheme.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all-notheme.css	(revision 76)
@@ -0,0 +1,5326 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
+
+.ext-forced-border-box, .ext-forced-border-box * {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+.ext-el-mask {
+    z-index: 100;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width: 100%;
+    height: 100%;
+    zoom: 1;
+}
+
+.ext-el-mask-msg {
+    z-index: 20001;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border:1px solid;
+    background:repeat-x 0 -16px;
+    padding:2px;
+}
+
+.ext-el-mask-msg div {
+    padding:5px 10px 5px 10px;
+    border:1px solid;
+    cursor:wait;
+}
+
+.ext-shim {
+    position:absolute;
+    visibility:hidden;
+    left:0;
+    top:0;
+    overflow:hidden;
+}
+
+.ext-ie .ext-shim {
+    filter: alpha(opacity=0);
+}
+
+.ext-ie6 .ext-shim {
+    margin-left: 5px;
+    margin-top: 3px;
+}
+
+.x-mask-loading div {
+    padding:5px 10px 5px 25px;
+    background:no-repeat 5px 5px;
+    line-height:16px;
+}
+
+/* class for hiding elements without using display:none */
+.x-hidden, .x-hide-offsets {
+    position:absolute !important;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+}
+
+.x-hide-display {
+    display:none !important;
+}
+
+.x-hide-nosize,
+.x-hide-nosize *    /* Emulate display:none for children */
+ {
+   height:0px!important;
+   width:0px!important;
+   visibility:hidden!important;
+   border:none!important;
+   zoom:1;
+}
+
+.x-hide-visibility {
+    visibility:hidden !important;
+}
+
+.x-masked {
+    overflow: hidden !important;
+}
+.x-masked-relative {
+    position: relative !important;
+}
+
+.x-masked select, .x-masked object, .x-masked embed {
+    visibility: hidden;
+}
+
+.x-layer {
+    visibility: hidden;
+}
+
+.x-unselectable, .x-unselectable * {
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-repaint {
+    zoom: 1;
+    background-color: transparent;
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-item-disabled {
+    cursor: default;
+    opacity: .6;
+    -moz-opacity: .6;
+    filter: alpha(opacity=60);
+}
+
+.x-item-disabled * {
+    cursor: default !important;
+}
+
+.x-form-radio-group .x-item-disabled {
+    filter: none;
+}
+
+.x-splitbar-proxy {
+    position: absolute;
+    visibility: hidden;
+    z-index: 20001;
+    zoom: 1;
+    line-height: 1px;
+    font-size: 1px;
+    overflow: hidden;
+}
+
+.x-splitbar-h, .x-splitbar-proxy-h {
+    cursor: e-resize;
+    cursor: col-resize;
+}
+
+.x-splitbar-v, .x-splitbar-proxy-v {
+    cursor: s-resize;
+    cursor: row-resize;
+}
+
+.x-color-palette {
+    width: 150px;
+    height: 92px;
+    cursor: pointer;
+}
+
+.x-color-palette a {
+    border: 1px solid;
+    float: left;
+    padding: 2px;
+    text-decoration: none;
+    -moz-outline: 0 none;
+    outline: 0 none;
+    cursor: pointer;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border: 1px solid;
+}
+
+.x-color-palette em {
+    display: block;
+    border: 1px solid;
+}
+
+.x-color-palette em span {
+    cursor: pointer;
+    display: block;
+    height: 10px;
+    line-height: 10px;
+    width: 10px;
+}
+
+.x-ie-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+    zoom:1;
+}
+
+.x-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+}
+
+.x-shadow * {
+    overflow: hidden;
+}
+
+.x-shadow * {
+    padding: 0;
+    border: 0;
+    margin: 0;
+    clear: none;
+    zoom: 1;
+}
+
+/* top  bottom */
+.x-shadow .xstc, .x-shadow .xsbc {
+    height: 6px;
+    float: left;
+}
+
+/* corners */
+.x-shadow .xstl, .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbr {
+    width: 6px;
+    height: 6px;
+    float: left;
+}
+
+/* sides */
+.x-shadow .xsc {
+    width: 100%;
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    width: 6px;
+    float: left;
+    height: 100%;
+}
+
+.x-shadow .xsmc {
+    float: left;
+    height: 100%;
+    background-color: transparent;
+}
+
+.x-shadow .xst, .x-shadow .xsb {
+    height: 6px;
+    overflow: hidden;
+    width: 100%;
+}
+
+.x-shadow .xsml {
+    background: transparent repeat-y 0 0;
+}
+
+.x-shadow .xsmr {
+    background: transparent repeat-y -6px 0;
+}
+
+.x-shadow .xstl {
+    background: transparent no-repeat 0 0;
+}
+
+.x-shadow .xstc {
+    background: transparent repeat-x 0 -30px;
+}
+
+.x-shadow .xstr {
+    background: transparent repeat-x 0 -18px;
+}
+
+.x-shadow .xsbl {
+    background: transparent no-repeat 0 -12px;
+}
+
+.x-shadow .xsbc {
+    background: transparent repeat-x 0 -36px;
+}
+
+.x-shadow .xsbr {
+    background: transparent repeat-x 0 -6px;
+}
+
+.loading-indicator {
+    background: no-repeat left;
+    padding-left: 20px;
+    line-height: 16px;
+    margin: 3px;
+}
+
+.x-text-resize {
+    position: absolute;
+    left: -1000px;
+    top: -1000px;
+    visibility: hidden;
+    zoom: 1;
+}
+
+.x-drag-overlay {
+    width: 100%;
+    height: 100%;
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 0;
+    background-image:url(../images/default/s.gif);
+    z-index: 20000;
+}
+
+.x-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.x-spotlight {
+    z-index: 8999;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width:0;
+    height:0;
+    zoom: 1;
+}
+
+#x-history-frame {
+    position:absolute;
+    top:-1px;
+    left:0;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
+
+#x-history-field {
+    position:absolute;
+    top:0;
+    left:-1px;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
+.x-resizable-handle {
+    position:absolute;
+    z-index:100;
+    /* ie needs these */
+    font-size:1px;
+    line-height:6px;
+    overflow:hidden;
+	filter:alpha(opacity=0);
+	opacity:0;
+	zoom:1;
+}
+
+.x-resizable-handle-east{
+    width:6px;
+    cursor:e-resize;
+    right:0;
+    top:0;
+    height:100%;
+}
+
+.ext-ie .x-resizable-handle-east {
+    margin-right:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-south{
+    width:100%;
+    cursor:s-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+}
+
+.ext-ie .x-resizable-handle-south {
+    margin-bottom:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-west{
+    width:6px;
+    cursor:w-resize;
+    left:0;
+    top:0;
+    height:100%;
+}
+
+.x-resizable-handle-north{
+    width:100%;
+    cursor:n-resize;
+    left:0;
+    top:0;
+    height:6px;
+}
+
+.x-resizable-handle-southeast{
+    width:6px;
+    cursor:se-resize;
+    right:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northwest{
+    width:6px;
+    cursor:nw-resize;
+    left:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northeast{
+    width:6px;
+    cursor:ne-resize;
+    right:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-southwest{
+    width:6px;
+    cursor:sw-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-over .x-resizable-handle, .x-resizable-pinned .x-resizable-handle{
+    filter:alpha(opacity=100);
+	opacity:1;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+	background-position: left;
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-position: top;
+}
+
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-position: top left;
+}
+
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-position:bottom right;
+}
+
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-position: bottom left;
+}
+
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-position: top right;
+}
+
+.x-resizable-proxy{
+    border: 1px dashed;
+    position:absolute;
+    overflow:hidden;
+    display:none;
+	left:0;
+    top:0;
+    z-index:50000;
+}
+
+.x-resizable-overlay{
+    width:100%;
+	height:100%;
+	display:none;
+	position:absolute;
+	left:0;
+	top:0;
+	z-index:200000;
+	-moz-opacity: 0;
+    opacity:0;
+    filter: alpha(opacity=0);
+}
+.x-tab-panel {
+    overflow:hidden;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border: 1px solid;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header {
+	border: 1px solid;
+	padding-bottom: 2px;
+}
+
+.x-tab-panel-footer {
+	border: 1px solid;
+	padding-top: 2px;
+}
+
+.x-tab-strip-wrap {
+	width:100%;
+    overflow:hidden;
+    position:relative;
+    zoom:1;
+}
+
+ul.x-tab-strip {
+	display:block;
+    width:5000px;
+    zoom:1;
+}
+
+ul.x-tab-strip-top{
+	padding-top: 1px;
+	background: repeat-x bottom;
+	border-bottom: 1px solid;
+}
+
+ul.x-tab-strip-bottom{
+	padding-bottom: 1px;
+	background: repeat-x top;
+	border-top: 1px solid;
+	border-bottom: 0 none;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-top {
+    background:transparent !important;
+    padding-top:0 !important;
+}
+
+.x-tab-panel-header-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border:1px solid;
+    height:2px;
+    font-size:1px;
+    line-height:1px;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer {
+    border-top: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-bottom: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-bottom {
+    background:transparent !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-footer-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-top:0 !important;
+}
+
+.ext-border-box .x-tab-panel-header-plain .x-tab-strip-spacer,
+.ext-border-box .x-tab-panel-footer-plain .x-tab-strip-spacer {
+    height:3px;
+}
+
+ul.x-tab-strip li {
+    float:left;
+    margin-left:2px;
+}
+
+ul.x-tab-strip li.x-tab-edge {
+    float:left;
+    margin:0 !important;
+    padding:0 !important;
+    border:0 none !important;
+    font-size:1px !important;
+    line-height:1px !important;
+    overflow:hidden;
+    zoom:1;
+    background:transparent !important;
+    width:1px;
+}
+
+.x-tab-strip a, .x-tab-strip span, .x-tab-strip em {
+	display:block;
+}
+
+.x-tab-strip a {
+	text-decoration:none !important;
+	-moz-outline: none;
+	outline: none;
+	cursor:pointer;
+}
+
+.x-tab-strip-inner {
+    overflow:hidden;
+	text-overflow: ellipsis;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	white-space: nowrap;
+	cursor:pointer;
+    padding:4px 0;
+}
+
+.x-tab-strip-top .x-tab-with-icon .x-tab-right {
+    padding-left:6px;
+}
+
+.x-tab-strip .x-tab-with-icon span.x-tab-strip-text {
+	padding-left:20px;
+    background-position: 0 3px;
+    background-repeat: no-repeat;
+}
+
+.x-tab-strip-active, .x-tab-strip-active a.x-tab-right {
+    cursor:default;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	cursor:default;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	cursor:default;
+}
+
+.x-tab-panel-body {
+    overflow:hidden;
+}
+
+.x-tab-panel-bwrap {
+    overflow:hidden;
+}
+
+.ext-ie .x-tab-strip .x-tab-right {
+    position:relative;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+    margin-bottom:-1px;
+}
+
+/*
+ * Horrible hack for IE8 in quirks mode
+ */
+.ext-ie8 .x-tab-strip li {
+    position: relative;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top .x-tab-right {
+    top: 1px;
+}
+.ext-ie8 .x-tab-strip-top {
+    padding-top: 1;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top {
+    padding-top: 0;
+}
+.ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:3px;
+}
+.ext-border-box .ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:4px;
+}
+.ext-ie8 .x-tab-strip-bottom .x-tab-right{
+    top:0;
+}
+
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-bottom:5px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+    margin-top:-1px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-top:5px;
+}
+
+.x-tab-strip-top .x-tab-right {
+	background: transparent no-repeat 0 -51px;
+    padding-left:10px;
+}
+
+.x-tab-strip-top .x-tab-left {
+	background: transparent no-repeat right -351px;
+    padding-right:10px;
+}
+
+.x-tab-strip-top .x-tab-strip-inner {
+	background: transparent repeat-x 0 -201px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-right {
+	 background-position:0 -101px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-left {
+	 background-position:right -401px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-strip-inner {
+	 background-position:0 -251px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+	background-position: 0 0;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-left {
+	background-position: right -301px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-strip-inner {
+	background-position: 0 -151px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+    margin-right: 3px;
+    padding:0 10px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+    padding:0;
+}
+
+.x-tab-strip .x-tab-strip-close {
+    display:none;
+}
+
+.x-tab-strip-closable {
+    position:relative;
+}
+
+.x-tab-strip-closable .x-tab-left {
+    padding-right:19px;
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    opacity:.6;
+    -moz-opacity:.6;
+    background-repeat:no-repeat;
+    display:block;
+	width:11px;
+    height:11px;
+    position:absolute;
+    top:3px;
+    right:3px;
+    cursor:pointer;
+    z-index:2;
+}
+
+.x-tab-strip .x-tab-strip-active a.x-tab-strip-close {
+    opacity:.8;
+    -moz-opacity:.8;
+}
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+    opacity:1;
+    -moz-opacity:1;
+}
+
+.x-tab-panel-body {
+    border: 1px solid;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background: transparent no-repeat -18px 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    left:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background: transparent no-repeat 0 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    right:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+
+.x-tab-scroller-right-over {
+    background-position: -18px 0;
+}
+
+.x-tab-scroller-right-disabled {
+    background-position: 0 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scrolling-bottom .x-tab-scroller-left, .x-tab-scrolling-bottom .x-tab-scroller-right{
+    margin-top: 1px;
+}
+
+.x-tab-scrolling .x-tab-strip-wrap {
+    margin-left:18px;
+    margin-right:18px;
+}
+
+.x-tab-scrolling {
+    position:relative;    
+}
+
+.x-tab-panel-bbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-tab-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}/* all fields */
+.x-form-field{
+    margin: 0 0 0 0;
+}
+
+.ext-webkit *:focus{
+    outline: none !important;
+}
+
+/* ---- text fields ---- */
+.x-form-text, textarea.x-form-field{
+    padding:1px 3px;
+    background:repeat-x 0 0;
+    border:1px solid;
+}
+
+textarea.x-form-field {
+    padding:2px 3px;
+}
+
+.x-form-text, .ext-ie .x-form-file {
+    height:22px;
+    line-height:18px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-form-text, .ext-ie7 .x-form-text {
+    margin:-1px 0; /* ie bogus margin bug */
+    height:22px; /* ie quirks */
+    line-height:18px;
+}
+
+.x-quirks .ext-ie9 .x-form-text {
+    height: 22px;
+    padding-top: 3px;
+    padding-bottom: 0px;
+}
+
+/* Ugly hacks for the bogus 1px margin bug in IE9 quirks */
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-text,
+.x-quirks .ext-ie9 .x-form-field-trigger-wrap .x-form-text {
+    margin-top: -1px;
+    margin-bottom: -1px;
+}
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-element {
+    margin-bottom: -1px;
+}
+
+.ext-ie6 .x-form-field-wrap .x-form-file-btn, .ext-ie7 .x-form-field-wrap .x-form-file-btn {
+    top: -1px; /* because of all these margin hacks, these buttons are off by one pixel in IE6,7 */
+}
+
+.ext-ie6 textarea.x-form-field, .ext-ie7 textarea.x-form-field {
+    margin:-1px 0; /* ie bogus margin bug */
+}
+
+.ext-strict .x-form-text {
+    height:18px;
+}
+
+.ext-safari.ext-mac textarea.x-form-field {
+    margin-bottom:-2px; /* another bogus margin bug, safari/mac only */
+}
+
+/*
+.ext-strict .ext-ie8 .x-form-text, .ext-strict .ext-ie8 textarea.x-form-field {
+    margin-bottom: 1px;
+}
+*/
+
+.ext-gecko .x-form-text , .ext-ie8 .x-form-text {
+    padding-top:2px; /* FF won't center the text vertically */
+    padding-bottom:0;
+}
+
+.ext-ie6 .x-form-composite .x-form-text.x-box-item, .ext-ie7 .x-form-composite .x-form-text.x-box-item {
+    margin: 0 !important; /* clear ie bogus margin bug fix */
+}
+
+textarea {
+    resize: none;  /* Disable browser resizable textarea */
+}
+
+/* select boxes */
+.x-form-select-one {
+    height:20px;
+    line-height:18px;
+    vertical-align:middle;
+    border: 1px solid;
+}
+
+/* multi select boxes */
+
+/* --- TODO --- */
+
+/* 2.0.2 style */
+.x-form-check-wrap {
+    line-height:18px;
+    height: auto;
+}
+
+.ext-ie .x-form-check-wrap input {
+    width:15px;
+    height:15px;
+}
+
+.x-form-check-wrap input{
+    vertical-align: bottom;
+}
+
+.x-editor .x-form-check-wrap {
+    padding:3px;
+}
+
+.x-editor .x-form-checkbox {
+    height:13px;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid;
+    margin-bottom: 5px;
+    padding-left: 3px !important;
+    float: none !important;
+}
+
+/* wrapped fields and triggers */
+.x-form-field-wrap .x-form-trigger{
+    width:17px;
+    height:21px;
+    border:0;
+    background:transparent no-repeat 0 0;
+    cursor:pointer;
+    border-bottom: 1px solid;
+    position:absolute;
+    top:0;
+}
+
+.x-form-field-wrap .x-form-date-trigger, .x-form-field-wrap .x-form-clear-trigger, .x-form-field-wrap .x-form-search-trigger{
+    cursor:pointer;
+}
+
+.x-form-field-wrap .x-form-twin-triggers .x-form-trigger{
+    position:static;
+    top:auto;
+    vertical-align:top;
+}
+
+.x-form-field-wrap {
+    position:relative;
+    left:0;top:0;
+    text-align: left;
+    zoom:1;
+    white-space: nowrap;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-trigger {
+    right: 0; /* IE8 Strict mode trigger bug */
+}
+
+.x-form-field-wrap .x-form-trigger-over{
+    background-position:-17px 0;
+}
+
+.x-form-field-wrap .x-form-trigger-click{
+    background-position:-34px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    background-position:-51px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-over{
+    background-position:-68px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-click{
+    background-position:-85px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-trigger-noedit{
+    cursor:pointer;
+}
+
+/* field focus style */
+.x-form-focus, textarea.x-form-focus{
+    border: 1px solid;
+}
+
+/* invalid fields */
+.x-form-invalid, textarea.x-form-invalid{
+    background:repeat-x bottom;
+    border: 1px solid;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background:repeat-x bottom;
+}
+
+/* editors */
+.x-editor {
+    visibility:hidden;
+    padding:0;
+    margin:0;
+}
+
+.x-form-grow-sizer {
+    left: -10000px;
+    padding: 8px 3px;
+    position: absolute;
+    visibility:hidden;
+    top: -10000px;
+    white-space: pre-wrap;
+    white-space: -moz-pre-wrap;
+    white-space: -pre-wrap;
+    white-space: -o-pre-wrap;
+    word-wrap: break-word;
+    zoom:1;
+}
+
+.x-form-grow-sizer p {
+    margin:0 !important;
+    border:0 none !important;
+    padding:0 !important;
+}
+
+/* Form Items CSS */
+
+.x-form-item {
+    display:block;
+    margin-bottom:4px;
+    zoom:1;
+}
+
+.x-form-item label.x-form-item-label {
+    display:block;
+    float:left;
+    width:100px;
+    padding:3px;
+    padding-left:0;
+    clear:left;
+    z-index:2;
+    position:relative;
+}
+
+.x-form-element {
+    padding-left:105px;
+    position:relative;
+}
+
+.x-form-invalid-msg {
+    padding:2px;
+    padding-left:18px;
+    background: transparent no-repeat 0 2px;
+    line-height:16px;
+    width:200px;
+}
+
+.x-form-label-left label.x-form-item-label {
+   text-align:left;
+}
+
+.x-form-label-right label.x-form-item-label {
+   text-align:right;
+}
+
+.x-form-label-top .x-form-item label.x-form-item-label {
+    width:auto;
+    float:none;
+    clear:none;
+    display:inline;
+    margin-bottom:4px;
+    position:static;
+}
+
+.x-form-label-top .x-form-element {
+    padding-left:0;
+    padding-top:4px;
+}
+
+.x-form-label-top .x-form-item {
+    padding-bottom:4px;
+}
+
+/* Editor small font for grid, toolbar and tree */
+.x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    margin-top:-1px !important; /* ie bogus margin bug */
+    margin-bottom:-1px !important;
+    height:20px !important; /* ie quirks */
+    line-height:16px !important;
+}
+
+.ext-strict .x-small-editor .x-form-text {
+    height:16px !important;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+}
+
+.ext-border-box .x-small-editor .x-form-text {
+    height:20px;
+}
+
+.x-small-editor .x-form-select-one {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.x-small-editor .x-form-num-field {
+    text-align:right;
+}
+
+.x-small-editor .x-form-field-wrap .x-form-trigger{
+    height:19px;
+}
+
+.ext-webkit .x-small-editor .x-form-text{padding-top:3px;font-size:100%;}
+
+.ext-strict .ext-webkit .x-small-editor .x-form-text{
+    height:14px !important;
+}
+
+.x-form-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+.x-form-clear-left {
+    clear:left;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.ext-ie6 .x-form-check-wrap input, .ext-border-box .x-form-check-wrap input{
+   margin-top: 3px;
+}
+
+.x-form-cb-label {
+    position: relative;
+    margin-left:4px;
+    top: 2px;
+}
+
+.ext-ie .x-form-cb-label{
+    top: 1px;
+}
+
+.ext-ie6 .x-form-cb-label, .ext-border-box .x-form-cb-label{
+    top: 3px;
+}
+
+.x-form-display-field{
+    padding-top: 2px;
+}
+
+.ext-gecko .x-form-display-field, .ext-strict .ext-ie7 .x-form-display-field{
+    padding-top: 1px;
+}
+
+.ext-ie .x-form-display-field{
+    padding-top: 3px;
+}
+
+.ext-strict .ext-ie8 .x-form-display-field{
+    padding-top: 0;
+}
+
+.x-form-column {
+    float:left;
+    padding:0;
+    margin:0;
+    width:48%;
+    overflow:hidden;
+    zoom:1;
+}
+
+/* buttons */
+.x-form .x-form-btns-ct .x-btn{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns td {
+    border:0;
+    padding:0;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-right table{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-left table{
+    float:left;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center{
+    text-align:center; /*ie*/
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center table{
+    margin:0 auto; /*everyone else*/
+}
+
+.x-form .x-form-btns-ct table td.x-form-btn-td{
+    padding:3px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-left{
+    background-position:0 -147px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-right{
+    background-position:0 -168px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-center{
+    background-position:0 -189px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-center{
+    background-position:0 -126px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click  .x-btn-right{
+    background-position:0 -84px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-left{
+    background-position:0 -63px;
+}
+
+.x-form-invalid-icon {
+    width:16px;
+    height:18px;
+    visibility:hidden;
+    position:absolute;
+    left:0;
+    top:0;
+    display:block;
+    background:transparent no-repeat 0 2px;
+}
+
+/* fieldsets */
+.x-fieldset {
+    border:1px solid;
+    padding:10px;
+    margin-bottom:10px;
+    display:block; /* preserve margins in IE */
+}
+
+/* make top of checkbox/tools visible in webkit */
+.ext-webkit .x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset legend {
+    margin-bottom:10px;
+}
+
+.ext-strict .ext-ie9 .x-fieldset legend.x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset {
+    padding-top: 0;
+    padding-bottom:10px;
+}
+
+.x-fieldset legend .x-tool-toggle {
+    margin-right:3px;
+    margin-left:0;
+    float:left !important;
+}
+
+.x-fieldset legend input {
+    margin-right:3px;
+    float:left !important;
+    height:13px;
+    width:13px;
+}
+
+fieldset.x-panel-collapsed {
+    padding-bottom:0 !important;
+    border-width: 1px 1px 0 1px !important;
+    border-left-color: transparent;
+    border-right-color: transparent;
+}
+
+.ext-ie6 fieldset.x-panel-collapsed{
+    padding-bottom:0 !important;
+    border-width: 1px 0 0 0 !important;
+    margin-left: 1px;
+    margin-right: 1px;
+}
+
+fieldset.x-panel-collapsed .x-fieldset-bwrap {
+    visibility:hidden;
+    position:absolute;
+    left:-1000px;
+    top:-1000px;
+}
+
+.ext-ie .x-fieldset-bwrap {
+    zoom:1;
+}
+
+.x-fieldset-noborder {
+    border:0px none transparent;
+}
+
+.x-fieldset-noborder legend {
+    margin-left:-3px;
+}
+
+/* IE legend positioning bug */
+.ext-ie .x-fieldset-noborder legend {
+    position: relative;
+    margin-bottom:23px;
+}
+.ext-ie .x-fieldset-noborder legend span {
+    position: absolute;
+    left:16px;
+}
+
+.ext-gecko .x-window-body .x-form-item {
+    -moz-outline: none;
+    outline: none;
+    overflow: auto;
+}
+
+.ext-mac.ext-gecko .x-window-body .x-form-item {
+    overflow:hidden;
+}
+
+.ext-gecko .x-form-item {
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-hide-label label.x-form-item-label {
+     display:none;
+}
+
+.x-hide-label .x-form-element {
+     padding-left: 0 !important;
+}
+
+.x-form-label-top .x-hide-label label.x-form-item-label{
+    display: none;
+}
+
+.x-fieldset {
+    overflow:hidden;
+}
+
+.x-fieldset-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-fieldset-body {
+    overflow:hidden;
+}
+.x-btn{
+	cursor:pointer;
+	white-space: nowrap;
+}
+
+.x-btn button{
+    border:0 none;
+    background-color:transparent;
+    padding-left:3px;
+    padding-right:3px;
+    cursor:pointer;
+    margin:0;
+    overflow:visible;
+    width:auto;
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+* html .ext-ie .x-btn button {
+    width:1px;
+}
+
+.ext-gecko .x-btn button, .ext-webkit .x-btn button {
+    padding-left:0;
+    padding-right:0;
+}
+
+.ext-gecko .x-btn button::-moz-focus-inner {
+    padding:0;
+}
+
+.ext-ie .x-btn button {
+    padding-top:2px;
+}
+
+.x-btn td {
+    padding:0 !important;
+}
+
+.x-btn-text {
+    cursor:pointer;
+	white-space: nowrap;
+    padding:0;
+}
+
+/* icon placement and sizing styles */
+
+/* Only text */
+.x-btn-noicon .x-btn-small .x-btn-text{
+	height: 16px;
+}
+
+.x-btn-noicon .x-btn-medium .x-btn-text{
+    height: 24px;
+}
+
+.x-btn-noicon .x-btn-large .x-btn-text{
+    height: 32px;
+}
+
+/* Only icons */
+.x-btn-icon .x-btn-text{
+    background-position: center;
+	background-repeat: no-repeat;
+}
+
+.x-btn-icon .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 16px;
+}
+
+.x-btn-icon .x-btn-medium .x-btn-text{
+    height: 24px;
+	width: 24px;
+}
+
+.x-btn-icon .x-btn-large .x-btn-text{
+    height: 32px;
+	width: 32px;
+}
+
+/* Icons and text */
+/* left */
+.x-btn-text-icon .x-btn-icon-small-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:34px;
+    height:32px;
+}
+
+/* top */
+.x-btn-text-icon .x-btn-icon-small-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:34px;
+}
+
+/* right */
+.x-btn-text-icon .x-btn-icon-small-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:34px;
+    height:32px;
+}
+
+/* bottom */
+.x-btn-text-icon .x-btn-icon-small-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:34px;
+}
+
+/* background positioning */
+.x-btn-tr i, .x-btn-tl i, .x-btn-mr i, .x-btn-ml i, .x-btn-br i, .x-btn-bl i{
+	font-size:1px;
+    line-height:1px;
+    width:3px;
+    display:block;
+    overflow:hidden;
+}
+
+.x-btn-tr i, .x-btn-tl i, .x-btn-br i, .x-btn-bl i{
+	height:3px;
+}
+
+.x-btn-tl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 0;
+}
+.x-btn-tr{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px 0;
+}
+.x-btn-tc{
+	height:3px;
+	background:repeat-x 0 -6px;
+}
+
+.x-btn-ml{
+	width:3px;
+	background:no-repeat 0 -24px;
+}
+.x-btn-mr{
+	width:3px;
+	background:no-repeat -3px -24px;
+}
+
+.x-btn-mc{
+	background:repeat-x 0 -1096px;
+    vertical-align: middle;
+	text-align:center;
+	padding:0 5px;
+	cursor:pointer;
+	white-space:nowrap;
+}
+
+/* Fixes an issue with the button height */
+.ext-strict .ext-ie6 .x-btn-mc, .ext-strict .ext-ie7 .x-btn-mc {
+    height: 100%;
+}
+
+.x-btn-bl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 -3px;
+}
+
+.x-btn-br{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px -3px;
+}
+
+.x-btn-bc{
+	height:3px;
+	background:repeat-x 0 -15px;
+}
+
+.x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-btn-click .x-btn-tl, .x-btn-menu-active .x-btn-tl, .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-btn-click .x-btn-tr, .x-btn-menu-active .x-btn-tr, .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-btn-click .x-btn-tc, .x-btn-menu-active .x-btn-tc, .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-btn-click .x-btn-ml, .x-btn-menu-active .x-btn-ml, .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-btn-click .x-btn-mr, .x-btn-menu-active .x-btn-mr, .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-btn-click .x-btn-mc, .x-btn-menu-active .x-btn-mc, .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-btn-click .x-btn-bl, .x-btn-menu-active .x-btn-bl, .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-btn-click .x-btn-br, .x-btn-menu-active .x-btn-br, .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-btn-click .x-btn-bc, .x-btn-menu-active .x-btn-bc, .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-btn-disabled *{
+	cursor:default !important;
+}
+
+
+/* With a menu arrow */
+/* right */
+.x-btn-mc em.x-btn-arrow {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:10px;
+}
+
+.x-btn-mc em.x-btn-split {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:14px;
+}
+
+/* bottom */
+.x-btn-mc em.x-btn-arrow-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+/* height adjustment class */
+.x-btn-as-arrow .x-btn-mc em {
+    display:block;
+    background-color:transparent;
+	padding-bottom:14px;
+}
+
+/* groups */
+.x-btn-group {
+    padding:1px;
+}
+
+.x-btn-group-header {
+    padding:2px;
+    text-align:center;
+}
+
+.x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+.x-btn-group-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:3px;
+}
+
+.x-btn-group-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-btn-group-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-br {
+	background: transparent no-repeat right bottom;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-mc {
+    border:0 none;
+    padding:1px 0 0 0;
+    margin:0;
+}
+
+.x-btn-group-mc .x-btn-group-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-btn-group-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-mr {
+	background: transparent repeat-y right 0;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-btn-group-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-btn-group-bc {
+	height:3px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-btn-group-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    height:2px;
+}.x-toolbar{
+    border-style:solid;
+    border-width:0 0 1px 0;
+    display: block;
+	padding:2px;
+    background:repeat-x top left;
+    position:relative;
+    left:0;
+    top:0;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-toolbar-left {
+    width: 100%;
+}
+
+.x-toolbar .x-item-disabled .x-btn-icon {
+    opacity: .35;
+    -moz-opacity: .35;
+    filter: alpha(opacity=35);
+}
+
+.x-toolbar td {
+	vertical-align:middle;
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+	white-space: nowrap;
+}
+
+.x-toolbar .x-item-disabled {
+	cursor:default;
+	opacity:.6;
+	-moz-opacity:.6;
+	filter:alpha(opacity=60);
+}
+
+.x-toolbar .x-item-disabled * {
+	cursor:default;
+}
+
+.x-toolbar .x-toolbar-cell {
+    vertical-align:middle;
+}
+
+.x-toolbar .x-btn-tl, .x-toolbar .x-btn-tr, .x-toolbar .x-btn-tc, .x-toolbar .x-btn-ml, .x-toolbar .x-btn-mr,
+.x-toolbar .x-btn-mc, .x-toolbar .x-btn-bl, .x-toolbar .x-btn-br, .x-toolbar .x-btn-bc
+{
+	background-position: 500px 500px;
+}
+
+/* These rules are duplicated from button.css to give priority of x-toolbar rules above */
+.x-toolbar .x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-toolbar .x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-toolbar .x-btn-click .x-btn-tl, .x-toolbar .x-btn-menu-active .x-btn-tl, .x-toolbar .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tr, .x-toolbar .x-btn-menu-active .x-btn-tr, .x-toolbar .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tc, .x-toolbar .x-btn-menu-active .x-btn-tc, .x-toolbar .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-toolbar .x-btn-click .x-btn-ml, .x-toolbar .x-btn-menu-active .x-btn-ml, .x-toolbar .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mr, .x-toolbar .x-btn-menu-active .x-btn-mr, .x-toolbar .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mc, .x-toolbar .x-btn-menu-active .x-btn-mc, .x-toolbar .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bl, .x-toolbar .x-btn-menu-active .x-btn-bl, .x-toolbar .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-br, .x-toolbar .x-btn-menu-active .x-btn-br, .x-toolbar .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bc, .x-toolbar .x-btn-menu-active .x-btn-bc, .x-toolbar .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-toolbar div.xtb-text{
+    padding:2px 2px 0;
+    line-height:16px;
+    display:block;
+}
+
+.x-toolbar .xtb-sep {
+	background-position: center;
+	background-repeat: no-repeat;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	width:4px;
+	overflow: hidden;
+	cursor:default;
+	margin: 0 2px 0;
+	border:0;
+}
+
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+
+/* Paging Toolbar */
+.x-tbar-page-number{
+	width:30px;
+	height:14px;
+}
+
+.ext-ie .x-tbar-page-number{
+    margin-top: 2px;
+}
+
+.x-paging-info {
+    position:absolute;
+    top:5px;
+    right: 8px;
+}
+
+/* floating */
+.x-toolbar-ct {
+    width:100%;
+}
+
+.x-toolbar-right td {
+    text-align: center;
+}
+
+.x-panel-tbar, .x-panel-bbar, .x-window-tbar, .x-window-bbar, .x-tab-panel-tbar, .x-tab-panel-bbar, .x-plain-tbar, .x-plain-bbar {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-toolbar-more .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 12px;
+}
+
+.x-toolbar-more em.x-btn-arrow {
+    display:inline;
+    background-color:transparent;
+	padding-right:0;
+}
+
+.x-toolbar-more .x-btn-mc em.x-btn-arrow {
+    background-image: none;
+}
+
+div.x-toolbar-no-items {
+    color:gray !important;
+    padding:5px 10px !important;
+}
+
+/* fix ie toolbar form items */
+.ext-border-box .x-toolbar-cell .x-form-text {
+    margin-bottom:-1px !important;
+}
+
+.ext-border-box .x-toolbar-cell .x-form-field-wrap .x-form-text {
+    margin:0 !important;
+}
+
+.ext-ie .x-toolbar-cell .x-form-field-wrap {
+    height:21px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-text, .ext-strict .ext-ie .x-toolbar-cell .x-form-text {
+    top: 0px;
+}
+
+.x-toolbar-right td .x-form-field-trigger-wrap{
+    text-align: left;
+}
+
+.x-toolbar-cell .x-form-checkbox, .x-toolbar-cell .x-form-radio{
+    margin-top: 5px;
+}
+
+.x-toolbar-cell .x-form-cb-label{
+    vertical-align: bottom;
+    top: 1px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-checkbox, .ext-ie .x-toolbar-cell .x-form-radio{
+    margin-top: 4px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-cb-label{
+    top: 0;
+}
+/* Grid3 styles */
+.x-grid3 {
+	position:relative;
+	overflow:hidden;
+}
+
+.x-grid-panel .x-panel-body {
+    overflow:hidden !important;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border:1px solid;
+}
+
+.x-grid3 table {
+    table-layout:fixed;
+}
+
+.x-grid3-viewport{
+	overflow:hidden;
+}
+
+.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
+    -moz-outline: none;
+    outline: none;
+	-moz-user-focus: normal;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td {
+    line-height:13px;
+    vertical-align: top;
+	padding-left:1px;
+    padding-right:1px;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-cell{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-row td {
+    line-height:15px;
+    vertical-align:middle;
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+.x-grid3-hd-row .x-grid3-marker-hd {
+    padding:3px;
+}
+
+.x-grid3-row .x-grid3-marker {
+    padding:3px;
+}
+
+.x-grid3-cell-inner, .x-grid3-hd-inner{
+	overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    padding:3px 3px 3px 5px;
+    white-space: nowrap;
+}
+
+/* ActionColumn, reduce padding to accommodate 16x16 icons in normal row height */
+.x-action-col-cell .x-grid3-cell-inner {
+    padding-top: 1px;
+    padding-bottom: 1px;
+}
+
+.x-action-col-icon {
+    cursor: pointer;
+}
+
+.x-grid3-hd-inner {
+    position:relative;
+	cursor:inherit;
+	padding:4px 3px 4px 5px;
+}
+
+.x-grid3-row-body {
+    white-space:normal;
+}
+
+.x-grid3-body-cell {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+/* IE Quirks to clip */
+.ext-ie .x-grid3-cell-inner, .ext-ie .x-grid3-hd-inner{
+	width:100%;
+}
+
+/* reverse above in strict mode */
+.ext-strict .x-grid3-cell-inner, .ext-strict .x-grid3-hd-inner{
+	width:auto;
+}
+
+.x-grid-row-loading {
+    background: no-repeat center center;
+}
+
+.x-grid-page {
+    overflow:hidden;
+}
+
+.x-grid3-row {
+	cursor: default;
+    border: 1px solid;
+    width:100%;
+}
+
+.x-grid3-row-over {
+	border:1px solid;
+    background: repeat-x left top;
+}
+
+.x-grid3-resize-proxy {
+	width:1px;
+    left:0;
+	cursor: e-resize;
+	cursor: col-resize;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-resize-marker {
+	width:1px;
+	left:0;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: text;
+    -khtml-user-select: text;
+    -webkit-user-select:ignore;
+}
+
+/* header styles */
+.x-grid3-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    padding:1px 0 0 0;
+}
+
+.x-grid3-header-pop {
+    border-left:1px solid;
+    float:right;
+    clear:none;
+}
+
+.x-grid3-header-pop-inner {
+    border-left:1px solid;
+    width:14px;
+    height:19px;
+    background: transparent no-repeat center center;
+}
+
+.ext-ie .x-grid3-header-pop-inner {
+    width:15px;
+}
+
+.ext-strict .x-grid3-header-pop-inner {
+    width:14px; 
+}
+
+.x-grid3-header-inner {
+    overflow:hidden;
+    zoom:1;
+    float:left;
+}
+
+.x-grid3-header-offset {
+    padding-left:1px;
+    text-align: left;
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background: repeat-x left bottom;
+
+}
+
+.x-grid3-sort-icon{
+	background-repeat: no-repeat;
+	display: none;
+	height: 4px;
+	width: 13px;
+	margin-left:3px;
+	vertical-align: middle;
+}
+
+.sort-asc .x-grid3-sort-icon, .sort-desc .x-grid3-sort-icon {
+	display: inline;
+}
+
+/* Header position fixes for IE strict mode */
+.ext-strict .ext-ie .x-grid3-header-inner, .ext-strict .ext-ie6 .x-grid3-hd {
+    position:relative;
+}
+
+.ext-strict .ext-ie6 .x-grid3-hd-inner{
+    position:static;
+}
+
+/* Body Styles */
+.x-grid3-body {
+	zoom:1;
+}
+
+.x-grid3-scroller {
+	overflow:auto;
+    zoom:1;
+    position:relative;
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	display: block;
+	padding: 3px 5px 3px 5px;
+	-moz-user-select: none;
+	-khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-split {
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor: e-resize;
+	cursor: col-resize;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	overflow: hidden;
+	position: absolute;
+	top: 2px;
+	width: 6px;
+	z-index: 3;
+}
+
+/* Column Reorder DD */
+.x-dd-drag-proxy .x-grid3-hd-inner{
+	background: repeat-x left bottom;
+	width:120px;
+	padding:3px;
+	border:1px solid;
+	overflow:hidden;
+}
+
+.col-move-top, .col-move-bottom{
+	width:9px;
+	height:9px;
+	position:absolute;
+	top:0;
+	line-height:1px;
+	font-size:1px;
+	overflow:hidden;
+	visibility:hidden;
+	z-index:20000;
+    background:transparent no-repeat left top;
+}
+
+/* Selection Styles */
+.x-grid3-row-selected {
+	border:1px dotted;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background: repeat-x 0 bottom !important;
+    vertical-align:middle !important;
+    padding:0;
+    border-top:1px solid;
+    border-bottom:none !important;
+    border-right:1px solid !important;
+    text-align:center;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    padding:0 4px;
+    text-align:center;
+}
+
+/* dirty cells */
+.x-grid3-dirty-cell {
+    background: transparent no-repeat 0 0;
+}
+
+/* Grid Toolbars */
+.x-grid3-topbar, .x-grid3-bottombar{
+    overflow:hidden;
+	display:none;
+	zoom:1;
+    position:relative;
+}
+
+.x-grid3-topbar .x-toolbar{
+	border-right:0 none;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-right:0 none;
+	border-bottom:0 none;
+	border-top:1px solid;
+}
+
+/* Props Grid Styles */
+.x-props-grid .x-grid3-cell{
+	padding:1px;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background:transparent repeat-y -16px !important;
+    padding-left:12px;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    padding:1px;
+    padding-right:0;
+    border:0 none;
+    border-right:1px solid;
+}
+
+/* dd */
+.x-grid3-col-dd {
+    border:0 none;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-dd-drag-ghost .x-grid3-dd-wrap {
+    padding:1px 3px 3px 1px;
+}
+
+.x-grid3-hd {
+    -moz-user-select:none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-btn {
+    display:none;
+    position:absolute;
+    width:14px;
+    background:no-repeat left center;
+    right:0;
+    top:0;
+    z-index:2;
+	cursor:pointer;
+}
+
+.x-grid3-hd-over .x-grid3-hd-btn, .x-grid3-hd-menu-open .x-grid3-hd-btn {
+    display:block;
+}
+
+a.x-grid3-hd-btn:hover {
+    background-position:-14px center;
+}
+
+/* Expanders */
+.x-grid3-body .x-grid3-td-expander {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-expander .x-grid3-cell-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-expander {
+    width:100%;
+    height:18px;
+    background-position:4px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-expander {
+    background-position:4px 2px;
+}
+
+.x-grid3-row-expanded .x-grid3-row-expander {
+    background-position:-21px 2px;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-body {
+    display:none !important;
+}
+
+.x-grid3-row-expanded .x-grid3-row-body {
+    display:block !important;
+}
+
+/* Checkers */
+.x-grid3-body .x-grid3-td-checker {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-checker .x-grid3-cell-inner, .x-grid3-header .x-grid3-td-checker .x-grid3-hd-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    width:100%;
+    height:18px;
+    background-position:2px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row .x-grid3-row-checker {
+    background-position:2px 2px;
+}
+
+.x-grid3-row-selected .x-grid3-row-checker, .x-grid3-hd-checker-on .x-grid3-hd-checker,.x-grid3-row-checked .x-grid3-row-checker {
+    background-position:-23px 2px;
+}
+
+.x-grid3-hd-checker {
+    background-position:2px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker {
+    background-position:2px 3px;
+}
+
+.x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 3px;
+}
+
+/* Numberer */
+.x-grid3-body .x-grid3-td-numberer {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+    padding:3px 5px 0 0 !important;
+    text-align:right;
+}
+
+/* Row Icon */
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background:transparent repeat-y right;
+    vertical-align:top;
+    text-align:center;
+}
+
+.x-grid3-body .x-grid3-td-row-icon .x-grid3-cell-inner {
+    padding:0 !important;
+    background-position:center center;
+    background-repeat:no-repeat;
+    width:16px;
+    height:16px;
+    margin-left:2px;
+    margin-top:3px;
+}
+
+/* All specials */
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-check-col-td .x-grid3-cell-inner {
+    padding: 1px 0 0 0 !important;
+}
+
+.x-grid3-check-col {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-check-col-on {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+/* Grouping classes */
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom: 2px solid;
+    cursor:pointer;
+    padding-top:6px;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background:transparent no-repeat 3px 3px;
+    padding:4px 4px 4px 17px;
+}
+
+.x-grid-group-collapsed .x-grid-group-body {
+    display:none;
+}
+
+.ext-ie6 .x-grid3 .x-editor .x-form-text, .ext-ie7 .x-grid3 .x-editor .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-ie .x-props-grid .x-editor .x-form-text {
+    position:static;
+    top:0;
+}
+
+.x-grid-empty {
+    padding:10px;
+}
+
+/* fix floating toolbar issue */
+.ext-ie7 .x-grid-panel .x-panel-bbar {
+    position:relative;
+}
+
+
+/* Reset position to static when Grid Panel has been framed */
+/* to resolve 'snapping' from top to bottom behavior. */
+/* @forumThread 86656 */
+.ext-ie7 .x-grid-panel .x-panel-mc .x-panel-bbar {
+    position: static;
+}
+
+.ext-ie6 .x-grid3-header {
+    position: relative;
+}
+
+/* Fix WebKit bug in Grids */
+.ext-webkit .x-grid-panel .x-panel-bwrap{
+    -webkit-user-select:none;
+}
+.ext-webkit .x-tbar-page-number{
+    -webkit-user-select:ignore;
+}
+/* end*/
+
+/* column lines */
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    padding-right:0;
+    border-right:1px solid;
+}
+.x-pivotgrid .x-grid3-header-offset table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-header-offset table td {
+    padding: 4px 3px 4px 5px;
+    text-align: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    line-height: 13px;
+    font-family: tahoma;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    display: block;
+    float: left;
+}
+
+.x-pivotgrid .x-grid3-row-headers table {
+    height: 100%;
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    height: 18px;
+    padding: 2px 7px 0 0;
+    text-align: right;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    font-family: tahoma;
+}
+
+.ext-gecko .x-pivotgrid .x-grid3-row-headers table td {
+    height: 21px;
+}
+
+.x-grid3-header-title {
+    top: 0%;
+    left: 0%;
+    position: absolute;
+    text-align: center;
+    vertical-align: middle;
+    font-family: tahoma;
+    font-size: 11px;
+    padding: auto 1px;
+    display: table-cell;
+}
+
+.x-grid3-header-title span {
+    position: absolute;
+    top: 50%;
+    left: 0%;
+    width: 100%;
+    margin-top: -6px;
+}.x-dd-drag-proxy{
+	position:absolute;
+	left:0;
+    top:0;
+	visibility:hidden;
+	z-index:15000;
+}
+
+.x-dd-drag-ghost{
+	-moz-opacity: 0.85;
+    opacity:.85;
+    filter: alpha(opacity=85);
+    border: 1px solid;
+	padding:3px;
+	padding-left:20px;
+	white-space:nowrap;
+}
+
+.x-dd-drag-repair .x-dd-drag-ghost{
+	-moz-opacity: 0.4;
+    opacity:.4;
+    filter: alpha(opacity=40);
+	border:0 none;
+	padding:0;
+	background-color:transparent;
+}
+
+.x-dd-drag-repair .x-dd-drop-icon{
+	visibility:hidden;
+}
+
+.x-dd-drop-icon{
+    position:absolute;
+	top:3px;
+	left:3px;
+	display:block;
+	width:16px;
+	height:16px;
+	background-color:transparent;
+	background-position: center;
+	background-repeat: no-repeat;
+	z-index:1;
+}
+
+.x-view-selector {
+    position:absolute;
+    left:0;
+    top:0;
+    width:0;
+    border:1px dotted;
+	opacity: .5;
+    -moz-opacity: .5;
+    filter:alpha(opacity=50);
+    zoom:1;
+}.ext-strict .ext-ie .x-tree .x-panel-bwrap{
+    position:relative;
+    overflow:hidden;
+}
+
+.x-tree-icon, .x-tree-ec-icon, .x-tree-elbow-line, .x-tree-elbow, .x-tree-elbow-end, .x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+    background-repeat: no-repeat;
+}
+
+.x-tree-node-collapsed .x-tree-node-icon, .x-tree-node-expanded .x-tree-node-icon, .x-tree-node-leaf .x-tree-node-icon{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	background-position:center;
+    background-repeat: no-repeat;
+}
+
+.ext-ie .x-tree-node-indent img, .ext-ie .x-tree-node-icon, .ext-ie .x-tree-ec-icon {
+    vertical-align: middle !important;
+}
+
+.ext-strict .ext-ie8 .x-tree-node-indent img, .ext-strict .ext-ie8 .x-tree-node-icon, .ext-strict .ext-ie8 .x-tree-ec-icon {
+    vertical-align: top !important;
+}
+
+/* checkboxes */
+
+input.x-tree-node-cb {
+    margin-left:1px;
+    height: 19px;
+	vertical-align: bottom;
+}
+
+.ext-ie input.x-tree-node-cb {
+    margin-left:0;
+    margin-top: 1px;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb{
+    margin: 1px 1px;
+    height: 14px;
+    vertical-align: bottom;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb + a{
+    vertical-align: bottom;
+}
+
+.ext-opera input.x-tree-node-cb {
+    height: 14px;
+    vertical-align: middle;
+}
+
+.x-tree-noicon .x-tree-node-icon{
+	width:0; height:0;
+}
+
+/* No line styles */
+.x-tree-no-lines .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+/* Arrows */
+.x-tree-arrows .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	cursor:pointer;
+}
+
+.ext-ie ul.x-tree-node-ct{
+    font-size:0;
+    line-height:0;
+    zoom:1;
+}
+
+.x-tree-node{
+	white-space: nowrap;
+}
+
+.x-tree-node-el {
+    line-height:18px;
+    cursor:pointer;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	text-decoration:none;
+	-khtml-user-select:none;
+	-moz-user-select:none;
+    -webkit-user-select:ignore;
+    -kthml-user-focus:normal;
+    -moz-user-focus:normal;
+    -moz-outline: 0 none;
+    outline:0 none;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	text-decoration:none;
+	padding:1px 3px 1px 2px;
+}
+
+.x-tree-node .x-tree-node-disabled .x-tree-node-icon{
+	-moz-opacity: 0.5;
+   opacity:.5;
+   filter: alpha(opacity=50);
+}
+
+.x-tree-node .x-tree-node-inline-icon{
+	background-color:transparent;
+}
+
+.x-tree-node a:hover, .x-dd-drag-ghost a:hover{
+	text-decoration:none;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:1px dotted;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top:1px dotted;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above{
+	 border-top:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom:2px solid;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top:2px solid;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 border:1px dotted;
+}
+
+.x-dd-drag-ghost .x-tree-node-indent, .x-dd-drag-ghost .x-tree-ec-icon{
+	display:none !important;
+}
+
+/* Fix for ie rootVisible:false issue */
+.x-tree-root-ct {
+    zoom:1;
+}
+.x-date-picker {
+    border: 1px solid;
+    border-top:0 none;
+	position:relative;
+}
+
+.x-date-picker a {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+.x-date-inner, .x-date-inner td, .x-date-inner th{
+    border-collapse:separate;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background: repeat-x 0 -83px;
+	overflow:hidden;
+}
+
+.x-date-middle .x-btn-tc,.x-date-middle .x-btn-tl,.x-date-middle .x-btn-tr,
+.x-date-middle .x-btn-mc,.x-date-middle .x-btn-ml,.x-date-middle .x-btn-mr,
+.x-date-middle .x-btn-bc,.x-date-middle .x-btn-bl,.x-date-middle .x-btn-br{
+	background:transparent !important;
+    vertical-align:middle;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background:transparent no-repeat right 0;
+}
+
+.x-date-right, .x-date-left {
+    width:18px;
+}
+
+.x-date-right{
+    text-align:right;
+}
+
+.x-date-middle {
+    padding-top:2px;
+    padding-bottom:2px;
+    width:130px; /* FF3 */
+}
+
+.x-date-right a, .x-date-left a{
+    display:block;
+    width:16px;
+	height:16px;
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor:pointer;
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a:hover, .x-date-left a:hover{
+    -moz-opacity: 1;
+    opacity:1;
+    filter: alpha(opacity=100);
+}
+
+.x-item-disabled .x-date-right a:hover, .x-item-disabled .x-date-left a:hover{
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a {
+    margin-right:2px;
+    text-decoration:none !important;
+}
+
+.x-date-left a{
+    margin-left:2px;
+    text-decoration:none !important;
+}
+
+table.x-date-inner {
+    width: 100%;
+    table-layout:fixed;
+}
+
+.ext-webkit table.x-date-inner{
+    /* Fix for webkit browsers */
+    width: 175px;
+}
+
+
+.x-date-inner th {
+    width:25px;
+}
+
+.x-date-inner th {
+    background: repeat-x left top;
+    text-align:right !important;
+	border-bottom: 1px solid;
+	cursor:default;
+    padding:0;
+    border-collapse:separate;
+}
+
+.x-date-inner th span {
+    display:block;
+    padding:2px;
+    padding-right:7px;
+}
+
+.x-date-inner td {
+    border: 1px solid;
+	text-align:right;
+    padding:0;
+}
+
+.x-date-inner a {
+    padding:2px 5px;
+    display:block;
+	text-decoration:none;
+    text-align:right;
+    zoom:1;
+}
+
+.x-date-inner .x-date-active{
+	cursor:pointer;
+	color:black;
+}
+
+.x-date-inner .x-date-selected a{
+	background: repeat-x left top;
+	border:1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-today a{
+	border: 1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+    text-decoration:none !important;
+}
+
+.x-date-bottom {
+    padding:4px;
+    border-top: 1px solid;
+    background: repeat-x left top;
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    text-decoration:none !important;
+}
+
+.x-item-disabled .x-date-inner a:hover{
+    background: none;
+}
+
+.x-date-inner .x-date-disabled a {
+	cursor:default;
+}
+
+.x-date-menu .x-menu-item {
+	padding:1px 24px 1px 4px;
+	white-space: nowrap;
+}
+
+.x-date-menu .x-menu-item .x-menu-item-icon {
+    width:10px;
+    height:10px;
+    margin-right:5px;
+    background-position:center -4px !important;
+}
+
+.x-date-mp {
+	position:absolute;
+	left:0;
+	top:0;
+	display:none;
+}
+
+.x-date-mp td {
+    padding:2px;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+td.x-date-mp-month,td.x-date-mp-year,td.x-date-mp-ybtn {
+    border: 0 none;
+	text-align:center;
+	vertical-align: middle;
+	width:25%;
+}
+
+.x-date-mp-ok {
+	margin-right:3px;
+}
+
+.x-date-mp-btns button {
+	text-decoration:none;
+	text-align:center;
+	text-decoration:none !important;
+	border:1px solid;
+	padding:1px 3px 1px;
+	cursor:pointer;
+}
+
+.x-date-mp-btns {
+	background: repeat-x left top;
+}
+
+.x-date-mp-btns td {
+	border-top: 1px solid;
+    text-align:center;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	display:block;
+	padding:2px 4px;
+	text-decoration:none;
+	text-align:center;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	text-decoration:none;
+	cursor:pointer;
+}
+
+td.x-date-mp-sel a {
+	padding:1px 3px;
+	background: repeat-x left top;
+	border:1px solid;
+}
+
+.x-date-mp-ybtn a {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    cursor:pointer;
+    background:transparent no-repeat;
+    display:block;
+    margin:0 auto;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next {
+    background-position:0 -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next:hover {
+    background-position:-15px -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev {
+    background-position:0 -105px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev:hover {
+    background-position:-15px -105px;
+}
+
+.x-date-mp-ybtn {
+   text-align:center;
+}
+
+td.x-date-mp-sep {
+   border-right:1px solid;
+}.x-tip{
+	position: absolute;
+	top: 0;
+    left:0;
+    visibility: hidden;
+	z-index: 20002;
+    border:0 none;
+}
+
+.x-tip .x-tip-close{
+	height: 15px;
+	float:right;
+	width: 15px;
+    margin:0 0 2px 2px;
+    cursor:pointer;
+    display:none;
+}
+
+.x-tip .x-tip-tc {
+	background: transparent no-repeat 0 -62px;
+	padding-top:3px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-bc {
+	background: transparent no-repeat 0 -121px;
+	height:3px;
+    overflow:hidden;
+}
+
+.x-tip .x-tip-bl {
+	background: transparent no-repeat 0 -59px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-br {
+	background: transparent no-repeat right -59px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mc {
+    border:0 none;
+}
+
+.x-tip .x-tip-ml {
+	background: no-repeat 0 -124px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mr {
+	background: transparent no-repeat right -124px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.ext-ie .x-tip .x-tip-header,.ext-ie .x-tip .x-tip-tc {
+    font-size:0;
+    line-height:0;
+}
+
+.ext-border-box .x-tip .x-tip-header, .ext-border-box .x-tip .x-tip-tc{
+    line-height: 1px;
+}
+
+.x-tip .x-tip-header-text {
+    padding:0;
+    margin:0 0 2px 0;
+}
+
+.x-tip .x-tip-body {
+    margin:0 !important;
+    line-height:14px;
+    padding:0;
+}
+
+.x-tip .x-tip-body .loading-indicator {
+    margin:0;
+}
+
+.x-tip-draggable .x-tip-header,.x-tip-draggable .x-tip-header-text {
+    cursor:move;
+}
+
+.x-form-invalid-tip .x-tip-tc {
+	background: repeat-x 0 -12px;
+    padding-top:6px;
+}
+
+.x-form-invalid-tip .x-tip-bc {
+	background: repeat-x 0 -18px;
+    height:6px;
+}
+
+.x-form-invalid-tip .x-tip-bl {
+	background: no-repeat 0 -6px;
+}
+
+.x-form-invalid-tip .x-tip-br {
+	background: no-repeat right -6px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding:2px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding-left:24px;
+    background:transparent no-repeat 2px 2px;
+}
+
+.x-tip-anchor {
+    position: absolute;
+    width: 9px;
+    height: 10px;
+    overflow:hidden;
+    background: transparent no-repeat 0 0;
+    zoom:1;
+}
+.x-tip-anchor-bottom {
+    background-position: -9px 0;
+}
+.x-tip-anchor-right {
+    background-position: -18px 0;
+    width: 10px;
+}
+.x-tip-anchor-left {
+    background-position: -28px 0;
+    width: 10px;
+}.x-menu {
+	z-index: 15000;
+	zoom: 1;
+	background: repeat-y;
+}
+
+.x-menu-floating{
+    border: 1px solid;
+}
+
+.x-menu a {
+    text-decoration: none !important;
+}
+
+.ext-ie .x-menu {
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-menu-list{
+    padding: 2px;
+	background-color:transparent;
+	border:0 none;
+    overflow:hidden;
+    overflow-y: hidden;
+}
+
+.ext-strict .ext-ie .x-menu-list{
+    position: relative;
+}
+
+.x-menu li{
+	line-height:100%;
+}
+
+.x-menu li.x-menu-sep-li{
+	font-size:1px;
+	line-height:1px;
+}
+
+.x-menu-list-item{
+    white-space: nowrap;
+	display:block;
+	padding:1px;
+}
+
+.x-menu-item{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-menu-item-arrow{
+	background:transparent no-repeat right;
+}
+
+.x-menu-sep {
+	display:block;
+	font-size:1px;
+	line-height:1px;
+	margin: 2px 3px;
+	border-bottom:1px solid;
+    overflow:hidden;
+}
+
+.x-menu-focus {
+	position:absolute;
+	left:-1px;
+	top:-1px;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+    overflow:hidden;
+    display:block;
+}
+
+a.x-menu-item {
+    cursor: pointer;
+    display: block;
+    line-height: 16px;
+    outline-color: -moz-use-text-color;
+    outline-style: none;
+    outline-width: 0;
+    padding: 3px 21px 3px 27px;
+    position: relative;
+    text-decoration: none;
+    white-space: nowrap;
+}
+
+.x-menu-item-active {
+    background-repeat: repeat-x;
+    background-position: left bottom;
+    border-style:solid;
+    border-width: 1px 0;
+    margin:0 1px;
+	padding: 0;
+}
+
+.x-menu-item-active a.x-menu-item {
+    border-style:solid;
+    border-width:0 1px;
+    margin:0 -1px;
+}
+
+.x-menu-item-icon {
+	border: 0 none;
+	height: 16px;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	position: absolute;
+    left: 3px;
+    top: 3px;
+    margin: 0;
+    background-position:center;
+}
+
+.ext-ie .x-menu-item-icon {
+    left: -24px;
+}
+.ext-strict .x-menu-item-icon {
+    left: 3px;
+}
+
+.ext-ie6 .x-menu-item-icon {
+    left: -24px;
+}
+
+.ext-ie .x-menu-item-icon {
+    vertical-align: middle;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background: transparent no-repeat center;
+}
+
+.x-menu-group-item .x-menu-item-icon{
+	background-color: transparent;
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background: transparent no-repeat center;
+}
+
+.x-date-menu .x-menu-list{
+    padding: 0;
+}
+
+.x-menu-date-item{
+	padding:0;
+}
+
+.x-menu .x-color-palette, .x-menu .x-date-picker{
+    margin-left: 26px;
+	margin-right:4px;
+}
+
+.x-menu .x-date-picker{
+    border:1px solid;
+    margin-top:2px;
+    margin-bottom:2px;
+}
+
+.x-menu-plain .x-color-palette, .x-menu-plain .x-date-picker{
+	 margin: 0;
+	 border: 0 none;
+}
+
+.x-date-menu {
+   padding:0 !important;
+}
+
+/*
+ * fixes separator visibility problem in IE 6
+ */
+.ext-strict .ext-ie6 .x-menu-sep-li {
+    padding: 3px 4px;
+}
+.ext-strict .ext-ie6 .x-menu-sep {
+    margin: 0;
+    height: 1px;
+}
+
+/*
+ * Fixes an issue with "fat" separators in webkit
+ */
+.ext-webkit .x-menu-sep{
+    height: 1px;
+}
+
+/*
+ * Ugly mess to remove the white border under the picker
+ */
+.ext-ie .x-date-menu{
+    height: 199px;
+}
+
+.ext-strict .ext-ie .x-date-menu, .ext-border-box .ext-ie8 .x-date-menu{
+    height: 197px;
+}
+
+.ext-strict .ext-ie7 .x-date-menu{
+    height: 195px;
+}
+
+.ext-strict .ext-ie8 .x-date-menu{
+    height: auto;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border:1px dotted !important;
+	padding:0;
+}
+
+.x-menu .x-menu-scroller {
+    width: 100%;
+	background-repeat:no-repeat;
+	background-position:center;
+	height:8px;
+    line-height: 8px;
+	cursor:pointer;
+    margin: 0;
+    padding: 0;
+}
+
+.x-menu .x-menu-scroller-active{
+    height: 6px;
+    line-height: 6px;
+}
+
+.x-menu-list-item-indent{
+    padding-left: 27px;
+}/*
+ Creates rounded, raised boxes like on the Ext website - the markup isn't pretty:
+  <div class="x-box-blue">
+        <div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
+        <div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
+            <h3>YOUR TITLE HERE (optional)</h3>
+            <div>YOUR CONTENT HERE</div>
+        </div></div></div>
+        <div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
+    </div>
+ */
+
+.x-box-tl {
+	background: transparent no-repeat 0 0;
+    zoom:1;
+}
+
+.x-box-tc {
+	height: 8px;
+	background: transparent repeat-x 0 0;
+	overflow: hidden;
+}
+
+.x-box-tr {
+	background: transparent no-repeat right -8px;
+}
+
+.x-box-ml {
+	background: transparent repeat-y 0;
+	padding-left: 4px;
+	overflow: hidden;
+    zoom:1;
+}
+
+.x-box-mc {
+	background: repeat-x 0 -16px;
+	padding: 4px 10px;
+}
+
+.x-box-mc h3 {
+	margin: 0 0 4px 0;
+    zoom:1;
+}
+
+.x-box-mr {
+	background: transparent repeat-y right;
+	padding-right: 4px;
+	overflow: hidden;
+}
+
+.x-box-bl {
+	background: transparent no-repeat 0 -16px;
+    zoom:1;
+}
+
+.x-box-bc {
+	background: transparent repeat-x 0 -8px;
+	height: 8px;
+	overflow: hidden;
+}
+
+.x-box-br {
+	background: transparent no-repeat right -24px;
+}
+
+.x-box-tl, .x-box-bl {
+	padding-left: 8px;
+	overflow: hidden;
+}
+
+.x-box-tr, .x-box-br {
+	padding-right: 8px;
+	overflow: hidden;
+}.x-combo-list {
+    border:1px solid;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-combo-list-inner {
+    overflow:auto;
+    position:relative; /* for calculating scroll offsets */
+    zoom:1;
+    overflow-x:hidden;
+}
+
+.x-combo-list-hd {
+    border-bottom:1px solid;
+    padding:3px;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom:1px solid;
+}
+
+.x-combo-list-item {
+    padding:2px;
+    border:1px solid;
+    white-space: nowrap;
+    overflow:hidden;
+    text-overflow: ellipsis;
+}
+
+.x-combo-list .x-combo-selected{
+	border:1px dotted !important;
+    cursor:pointer;
+}
+
+.x-combo-list .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}.x-panel {
+    border-style: solid;
+    border-width:0;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+    padding:5px 3px 4px 5px;
+    border:1px solid;
+    line-height: 15px;
+    background: transparent repeat-x 0 -1px;
+}
+
+.x-panel-body {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    position: relative; /* added for item scroll positioning */
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom: 0 none;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top:1px solid;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-tl .x-panel-header {
+    padding:5px 0 4px 0;
+    border:0 none;
+    background:transparent no-repeat;
+}
+
+.x-panel-tl .x-panel-icon, .x-window-tl .x-panel-icon {
+    padding-left:20px !important;
+    background-repeat:no-repeat;
+    background-position:0 4px;
+    zoom:1;
+}
+
+.x-panel-inline-icon {
+    width:16px;
+	height:16px;
+    background-repeat:no-repeat;
+    background-position:0 0;
+	vertical-align:middle;
+	margin-right:4px;
+	margin-top:-1px;
+	margin-bottom:-1px;
+}
+
+.x-panel-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+/* fix ie7 strict mode bug */
+.ext-strict .ext-ie7 .x-panel-tc {
+    overflow: visible;
+}
+
+.x-panel-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    border-bottom:1px solid;
+}
+
+.x-panel-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:6px;
+}
+
+.x-panel-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-panel-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-mc {
+    border:0 none;
+    padding:0;
+    margin:0;
+    padding-top:6px;
+}
+
+.x-panel-mc .x-panel-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-panel-ml {
+	background: repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-panel-bc, .x-panel-nofooter .x-window-bc {
+	height:6px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-panel-bwrap {
+    overflow:hidden;
+    zoom:1;
+    left:0;
+    top:0;
+}
+.x-panel-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-collapsed .x-resizable-handle{
+    display:none;
+}
+
+.ext-gecko .x-panel-animated div {
+    overflow:hidden !important;
+}
+
+/* Plain */
+.x-plain-body {
+    overflow:hidden;
+}
+
+.x-plain-bbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-tbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-plain {
+    overflow:hidden;
+}
+
+/* Tools */
+.x-tool {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    float:right;
+    cursor:pointer;
+    background:transparent no-repeat;
+    margin-left:2px;
+}
+
+/* expand / collapse tools */
+.x-tool-toggle {
+    background-position:0 -60px;
+}
+
+.x-tool-toggle-over {
+    background-position:-15px -60px;
+}
+
+.x-panel-collapsed .x-tool-toggle {
+    background-position:0 -75px;
+}
+
+.x-panel-collapsed .x-tool-toggle-over {
+    background-position:-15px -75px;
+}
+
+
+.x-tool-close {
+    background-position:0 -0;
+}
+
+.x-tool-close-over {
+    background-position:-15px 0;
+}
+
+.x-tool-minimize {
+    background-position:0 -15px;
+}
+
+.x-tool-minimize-over {
+    background-position:-15px -15px;
+}
+
+.x-tool-maximize {
+    background-position:0 -30px;
+}
+
+.x-tool-maximize-over {
+    background-position:-15px -30px;
+}
+
+.x-tool-restore {
+    background-position:0 -45px;
+}
+
+.x-tool-restore-over {
+    background-position:-15px -45px;
+}
+
+.x-tool-gear {
+    background-position:0 -90px;
+}
+
+.x-tool-gear-over {
+    background-position:-15px -90px;
+}
+
+.x-tool-prev {
+    background-position:0 -105px;
+}
+
+.x-tool-prev-over {
+    background-position:-15px -105px;
+}
+
+.x-tool-next {
+    background-position:0 -120px;
+}
+
+.x-tool-next-over {
+    background-position:-15px -120px;
+}
+
+.x-tool-pin {
+    background-position:0 -135px;
+}
+
+.x-tool-pin-over {
+    background-position:-15px -135px;
+}
+
+.x-tool-unpin {
+    background-position:0 -150px;
+}
+
+.x-tool-unpin-over {
+    background-position:-15px -150px;
+}
+
+.x-tool-right {
+    background-position:0 -165px;
+}
+
+.x-tool-right-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-left {
+    background-position:0 -180px;
+}
+
+.x-tool-left-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-down {
+    background-position:0 -195px;
+}
+
+.x-tool-down-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-up {
+    background-position:0 -210px;
+}
+
+.x-tool-up-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-refresh {
+    background-position:0 -225px;
+}
+
+.x-tool-refresh-over {
+    background-position:-15px -225px;
+}
+
+.x-tool-plus {
+    background-position:0 -240px;
+}
+
+.x-tool-plus-over {
+    background-position:-15px -240px;
+}
+
+.x-tool-minus {
+    background-position:0 -255px;
+}
+
+.x-tool-minus-over {
+    background-position:-15px -255px;
+}
+
+.x-tool-search {
+    background-position:0 -270px;
+}
+
+.x-tool-search-over {
+    background-position:-15px -270px;
+}
+
+.x-tool-save {
+    background-position:0 -285px;
+}
+
+.x-tool-save-over {
+    background-position:-15px -285px;
+}
+
+.x-tool-help {
+    background-position:0 -300px;
+}
+
+.x-tool-help-over {
+    background-position:-15px -300px;
+}
+
+.x-tool-print {
+    background-position:0 -315px;
+}
+
+.x-tool-print-over {
+    background-position:-15px -315px;
+}
+
+.x-tool-expand {
+    background-position:0 -330px;
+}
+
+.x-tool-expand-over {
+    background-position:-15px -330px;
+}
+
+.x-tool-collapse {
+    background-position:0 -345px;
+}
+
+.x-tool-collapse-over {
+    background-position:-15px -345px;
+}
+
+.x-tool-resize {
+    background-position:0 -360px;
+}
+
+.x-tool-resize-over {
+    background-position:-15px -360px;
+}
+
+.x-tool-move {
+    background-position:0 -375px;
+}
+
+.x-tool-move-over {
+    background-position:-15px -375px;
+}
+
+/* Ghosting */
+.x-panel-ghost {
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    opacity:.65;
+    -moz-opacity:.65;
+    filter:alpha(opacity=65);
+}
+
+.x-panel-ghost ul {
+    margin:0;
+    padding:0;
+    overflow:hidden;
+    font-size:0;
+    line-height:0;
+    border:1px solid;
+    border-top:0 none;
+    display:block;
+}
+
+.x-panel-ghost * {
+    cursor:move !important;
+}
+
+.x-panel-dd-spacer {
+    border:2px dashed;
+}
+
+/* Buttons */
+.x-panel-btns {
+    padding:5px;
+    overflow:hidden;
+}
+
+.x-panel-btns td.x-toolbar-cell{
+	padding:3px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-left{
+	background-position:0 -147px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-right{
+	background-position:0 -168px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-center{
+	background-position:0 -189px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-center{
+	background-position:0 -105px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-center{
+	background-position:0 -126px;
+}
+
+.x-panel-btns .x-btn-click  .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+	white-space: nowrap;
+}
+/**
+ * W3C Suggested Default style sheet for HTML 4
+ * http://www.w3.org/TR/CSS21/sample.html
+ *
+ * Resets for Ext.Panel @cfg normal: true
+ */
+.x-panel-reset .x-panel-body html,
+.x-panel-reset .x-panel-body address,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body body,
+.x-panel-reset .x-panel-body dd,
+.x-panel-reset .x-panel-body div,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dt,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body frame, frameset,
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body noframes,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body center,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body hr,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body pre 			  { display: block }
+.x-panel-reset .x-panel-body li              { display: list-item }
+.x-panel-reset .x-panel-body head            { display: none }
+.x-panel-reset .x-panel-body table           { display: table }
+.x-panel-reset .x-panel-body tr              { display: table-row }
+.x-panel-reset .x-panel-body thead           { display: table-header-group }
+.x-panel-reset .x-panel-body tbody           { display: table-row-group }
+.x-panel-reset .x-panel-body tfoot           { display: table-footer-group }
+.x-panel-reset .x-panel-body col             { display: table-column }
+.x-panel-reset .x-panel-body colgroup        { display: table-column-group }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th 	          { display: table-cell }
+.x-panel-reset .x-panel-body caption         { display: table-caption }
+.x-panel-reset .x-panel-body th              { font-weight: bolder; text-align: center }
+.x-panel-reset .x-panel-body caption         { text-align: center }
+.x-panel-reset .x-panel-body body            { margin: 8px }
+.x-panel-reset .x-panel-body h1              { font-size: 2em; margin: .67em 0 }
+.x-panel-reset .x-panel-body h2              { font-size: 1.5em; margin: .75em 0 }
+.x-panel-reset .x-panel-body h3              { font-size: 1.17em; margin: .83em 0 }
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu            { margin: 1.12em 0 }
+.x-panel-reset .x-panel-body h5              { font-size: .83em; margin: 1.5em 0 }
+.x-panel-reset .x-panel-body h6              { font-size: .75em; margin: 1.67em 0 }
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body b,
+.x-panel-reset .x-panel-body strong          { font-weight: bolder }
+.x-panel-reset .x-panel-body blockquote      { margin-left: 40px; margin-right: 40px }
+.x-panel-reset .x-panel-body i,
+.x-panel-reset .x-panel-body cite,
+.x-panel-reset .x-panel-body em,
+.x-panel-reset .x-panel-body var,
+.x-panel-reset .x-panel-body address    	  { font-style: italic }
+.x-panel-reset .x-panel-body pre,
+.x-panel-reset .x-panel-body tt,
+.x-panel-reset .x-panel-body code,
+.x-panel-reset .x-panel-body kbd,
+.x-panel-reset .x-panel-body samp       	  { font-family: monospace }
+.x-panel-reset .x-panel-body pre             { white-space: pre }
+.x-panel-reset .x-panel-body button,
+.x-panel-reset .x-panel-body textarea,
+.x-panel-reset .x-panel-body input,
+.x-panel-reset .x-panel-body select   		  { display: inline-block }
+.x-panel-reset .x-panel-body big             { font-size: 1.17em }
+.x-panel-reset .x-panel-body small,
+.x-panel-reset .x-panel-body sub,
+.x-panel-reset .x-panel-body sup 			  { font-size: .83em }
+.x-panel-reset .x-panel-body sub             { vertical-align: sub }
+.x-panel-reset .x-panel-body sup             { vertical-align: super }
+.x-panel-reset .x-panel-body table           { border-spacing: 2px; }
+.x-panel-reset .x-panel-body thead,
+.x-panel-reset .x-panel-body tbody,
+.x-panel-reset .x-panel-body tfoot           { vertical-align: middle }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th          	  { vertical-align: inherit }
+.x-panel-reset .x-panel-body s,
+.x-panel-reset .x-panel-body strike,
+.x-panel-reset .x-panel-body del  			  { text-decoration: line-through }
+.x-panel-reset .x-panel-body hr              { border: 1px inset }
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body dd        	  { margin-left: 40px }
+.x-panel-reset .x-panel-body ul, .x-panel-reset .x-panel-body menu, .x-panel-reset .x-panel-body dir { list-style-type: disc;}
+.x-panel-reset .x-panel-body ol              { list-style-type: decimal }
+.x-panel-reset .x-panel-body ol ul,
+.x-panel-reset .x-panel-body ul ol,
+.x-panel-reset .x-panel-body ul ul,
+.x-panel-reset .x-panel-body ol ol    		  { margin-top: 0; margin-bottom: 0 }
+.x-panel-reset .x-panel-body u,
+.x-panel-reset .x-panel-body ins          	  { text-decoration: underline }
+.x-panel-reset .x-panel-body br:before       { content: "\A" }
+.x-panel-reset .x-panel-body :before, .x-panel-reset .x-panel-body :after { white-space: pre-line }
+.x-panel-reset .x-panel-body center          { text-align: center }
+.x-panel-reset .x-panel-body :link, .x-panel-reset .x-panel-body :visited { text-decoration: underline }
+.x-panel-reset .x-panel-body :focus          { outline: invert dotted thin }
+
+/* Begin bidirectionality settings (do not change) */
+.x-panel-reset .x-panel-body BDO[DIR="ltr"]  { direction: ltr; unicode-bidi: bidi-override }
+.x-panel-reset .x-panel-body BDO[DIR="rtl"]  { direction: rtl; unicode-bidi: bidi-override }
+.x-window {
+    zoom:1;
+}
+
+.x-window .x-window-handle {
+    opacity:0;
+    -moz-opacity:0;
+    filter:alpha(opacity=0);
+}
+
+.x-window-proxy {
+    border:1px solid;
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    display:none;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-window-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-window-bwrap {
+    z-index:1;
+    position:relative;
+    zoom:1;
+    left:0;top:0;
+}
+
+.x-window-tl .x-window-header {
+    padding:5px 0 4px 0;
+}
+
+.x-window-header-text {
+    cursor:pointer;
+}
+
+.x-window-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    zoom:1;
+}
+
+.x-window-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    z-index:1;
+    position:relative;
+}
+
+.x-window-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+}
+
+.x-window-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-window-bc .x-window-footer {
+    padding-bottom:6px;
+    zoom:1;
+    font-size:0;
+    line-height:0;
+}
+
+.x-window-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-mc {
+    border:1px solid;
+    padding:0;
+    margin:0;
+}
+
+.x-window-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-body {
+    overflow:hidden;
+}
+
+.x-window-bwrap {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-bl, .x-window-maximized .x-window-br,
+    .x-window-maximized .x-window-ml, .x-window-maximized .x-window-mr,
+    .x-window-maximized .x-window-tl, .x-window-maximized .x-window-tr {
+    padding:0;
+}
+
+.x-window-maximized .x-window-footer {
+    padding-bottom:0;
+}
+
+.x-window-maximized .x-window-tc {
+    padding-left:3px;
+    padding-right:3px;
+}
+
+.x-window-maximized .x-window-mc {
+    border-left:0 none;
+    border-right:0 none;
+}
+
+.x-window-tbar .x-toolbar, .x-window-bbar .x-toolbar {
+    border-left:0 none;
+    border-right: 0 none;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}
+
+.x-window-draggable, .x-window-draggable .x-window-header-text {
+    cursor:move;
+}
+
+.x-window-maximized .x-window-draggable, .x-window-maximized .x-window-draggable .x-window-header-text {
+    cursor:default;
+}
+
+.x-window-body {
+    background-color:transparent;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-window-maximized-ct {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-handle {
+    display:none;
+}
+
+.x-window-sizing-ghost ul {
+    border:0 none !important;
+}
+
+.x-dlg-focus{
+	-moz-outline:0 none;
+	outline:0 none;
+	width:0;
+	height:0;
+	overflow:hidden;
+	position:absolute;
+	top:0;
+	left:0;
+}
+
+.ext-webkit .x-dlg-focus{
+    width: 1px;
+    height: 1px;
+}
+
+.x-dlg-mask{
+    z-index:10000;
+    display:none;
+    position:absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity:.50;
+    filter: alpha(opacity=50);
+}
+
+body.ext-ie6.x-body-masked select {
+	visibility:hidden;
+}
+
+body.ext-ie6.x-body-masked .x-window select {
+	visibility:visible;
+}
+
+.x-window-plain .x-window-mc {
+    border: 1px solid;
+}
+
+.x-window-plain .x-window-body {
+    border: 1px solid;
+    background:transparent !important;
+}.x-html-editor-wrap {
+    border:1px solid;
+}
+
+.x-html-editor-tb .x-btn-text {
+    background:transparent no-repeat;
+}
+
+.x-html-editor-tb .x-edit-bold, .x-menu-item img.x-edit-bold {
+    background-position:0 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);    
+}
+
+.x-html-editor-tb .x-edit-italic, .x-menu-item img.x-edit-italic {
+    background-position:-16px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-underline, .x-menu-item img.x-edit-underline {
+    background-position:-32px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-forecolor, .x-menu-item img.x-edit-forecolor {
+    background-position:-160px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-backcolor, .x-menu-item img.x-edit-backcolor {
+    background-position:-176px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyleft, .x-menu-item img.x-edit-justifyleft {
+    background-position:-112px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifycenter, .x-menu-item img.x-edit-justifycenter {
+    background-position:-128px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyright, .x-menu-item img.x-edit-justifyright {
+    background-position:-144px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertorderedlist, .x-menu-item img.x-edit-insertorderedlist {
+    background-position:-80px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertunorderedlist, .x-menu-item img.x-edit-insertunorderedlist {
+    background-position:-96px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-increasefontsize, .x-menu-item img.x-edit-increasefontsize {
+    background-position:-48px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-decreasefontsize, .x-menu-item img.x-edit-decreasefontsize {
+    background-position:-64px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-sourceedit, .x-menu-item img.x-edit-sourceedit {
+    background-position:-192px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-createlink, .x-menu-item img.x-edit-createlink {
+    background-position:-208px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tip .x-tip-bd .x-tip-bd-inner {
+    padding:5px;
+    padding-bottom:1px;
+}
+
+.x-html-editor-tb .x-toolbar {
+    position:static !important;
+}.x-panel-noborder .x-panel-body-noborder {
+    border-width:0;
+}
+
+.x-panel-noborder .x-panel-header-noborder {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-width:1px 0 0 0;
+    border-style:solid;
+}
+
+.x-window-noborder .x-window-mc {
+    border-width:0;
+}
+
+.x-window-plain .x-window-body-noborder {
+    border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-body-noborder {
+	border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-header-noborder {
+    border-width: 0 0 1px 0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-footer-noborder {
+    border-width: 1px 0 0 0;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-width: 1px 0 0 0;
+    border-style:solid;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}.x-border-layout-ct {
+    position: relative;
+}
+
+.x-border-panel {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-tool-collapse-south {
+    background-position:0 -195px;
+}
+
+.x-tool-collapse-south-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-collapse-north {
+    background-position:0 -210px;
+}
+
+.x-tool-collapse-north-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-collapse-west {
+    background-position:0 -180px;
+}
+
+.x-tool-collapse-west-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-collapse-east {
+    background-position:0 -165px;
+}
+
+.x-tool-collapse-east-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-south {
+    background-position:0 -210px;
+}
+
+.x-tool-expand-south-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-expand-north {
+    background-position:0 -195px;
+}
+.x-tool-expand-north-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-expand-west {
+    background-position:0 -165px;
+}
+
+.x-tool-expand-west-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-east {
+    background-position:0 -180px;
+}
+
+.x-tool-expand-east-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-expand-north, .x-tool-expand-south {
+    float:right;
+    margin:3px;
+}
+
+.x-tool-expand-east, .x-tool-expand-west {
+    float:none;
+    margin:3px 2px;
+}
+
+.x-accordion-hd .x-tool-toggle {
+    background-position:0 -255px;
+}
+
+.x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -255px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle {
+    background-position:0 -240px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -240px;
+}
+
+.x-accordion-hd {
+	padding-top:4px;
+	padding-bottom:3px;
+	border-top:0 none;
+    background: transparent repeat-x 0 -9px;
+}
+
+.x-layout-collapsed{
+    position:absolute;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+    width:20px;
+    height:20px;
+    overflow:hidden;
+	border:1px solid;
+	z-index:20;
+}
+
+.ext-border-box .x-layout-collapsed{
+    width:22px;
+    height:22px;
+}
+
+.x-layout-collapsed-over{
+    cursor:pointer;
+}
+
+.x-layout-collapsed-west .x-layout-collapsed-tools, .x-layout-collapsed-east .x-layout-collapsed-tools{
+	position:absolute;
+    top:0;
+    left:0;
+    width:20px;
+    height:20px;
+}
+
+
+.x-layout-split{
+    position:absolute;
+    height:5px;
+    width:5px;
+    line-height:1px;
+    font-size:1px;
+    z-index:3;
+    background-color:transparent;
+}
+
+/* IE6 strict won't drag w/out a color */
+.ext-strict .ext-ie6 .x-layout-split{
+    background-color: #fff !important;
+    filter: alpha(opacity=1);
+}
+
+.x-layout-split-h{
+    background-image:url(../images/default/s.gif);
+    background-position: left;
+}
+
+.x-layout-split-v{
+    background-image:url(../images/default/s.gif);
+    background-position: top;
+}
+
+.x-column-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column {
+    float:left;
+    padding:0;
+    margin:0;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column-inner {
+    overflow:hidden;
+    zoom:1;
+}
+
+/* mini mode */
+.x-layout-mini {
+    position:absolute;
+    top:0;
+    left:0;
+    display:block;
+    width:5px;
+    height:35px;
+    cursor:pointer;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-layout-mini-over, .x-layout-collapsed-over .x-layout-mini{
+    opacity:1;
+    -moz-opacity:1;
+    filter:none;
+}
+
+.x-layout-split-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-split-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west, .x-layout-cmini-east {
+    border:0 none;
+    width:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-layout-cmini-north, .x-layout-cmini-south {
+    border:0 none;
+    height:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-viewport, .x-viewport body {
+    margin: 0;
+    padding: 0;
+    border: 0 none;
+    overflow: hidden;
+    height: 100%;
+}
+
+.x-abs-layout-item {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.ext-ie input.x-abs-layout-item, .ext-ie textarea.x-abs-layout-item {
+    margin:0;
+}
+
+.x-box-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-box-inner {
+    overflow:hidden;
+    zoom:1;
+    position:relative;
+    left:0;
+    top:0;
+}
+
+.x-box-item {
+    position:absolute;
+    left:0;
+    top:0;
+}.x-progress-wrap {
+    border:1px solid;
+    overflow:hidden;
+}
+
+.x-progress-inner {
+    height:18px;
+    background:repeat-x;
+    position:relative;
+}
+
+.x-progress-bar {
+    height:18px;
+    float:left;
+    width:0;
+    background: repeat-x left center;
+    border-top:1px solid;
+    border-bottom:1px solid;
+    border-right:1px solid;
+}
+
+.x-progress-text {
+    padding:1px 5px;
+    overflow:hidden;
+    position:absolute;
+    left:0;
+    text-align:center;
+}
+
+.x-progress-text-back {
+    line-height:16px;
+}
+
+.ext-ie .x-progress-text-back {
+    line-height:15px;
+}
+
+.ext-strict .ext-ie7 .x-progress-text-back{
+    width: 100%;
+}
+.x-list-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    height:22px;
+}
+
+.x-list-header-inner div {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.x-list-header-inner div em {
+    display:block;
+    border-left:1px solid;
+    padding:4px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    line-height:14px;
+}
+
+.x-list-body {
+    overflow:auto;
+    overflow-x:hidden;
+    overflow-y:auto;
+    zoom:1;
+    float: left;
+    width: 100%;
+}
+
+.x-list-body dl {
+    zoom:1;
+}
+
+.x-list-body dt {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+    cursor:pointer;
+    zoom:1;
+}
+
+.x-list-body dt em {
+    display:block;
+    padding:3px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+}
+
+.x-list-resizer {
+    border-left:1px solid;
+    border-right:1px solid;
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-list-header-inner em.sort-asc {
+    background: transparent no-repeat center 0;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
+.x-list-header-inner em.sort-desc {
+    background: transparent no-repeat center -23px;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
+/* Shared styles */
+.x-slider {
+    zoom:1;
+}
+
+.x-slider-inner {
+    position:relative;
+    left:0;
+    top:0;
+    overflow:visible;
+    zoom:1;
+}
+
+.x-slider-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+	display:block;
+	overflow:hidden;  
+}
+
+/* Horizontal styles */
+.x-slider-horz {
+    padding-left:7px;
+    background:transparent no-repeat 0 -22px;
+}
+
+.x-slider-horz .x-slider-end {
+    padding-right:7px;
+    zoom:1;
+    background:transparent no-repeat right -44px;
+}
+
+.x-slider-horz .x-slider-inner {
+    background:transparent repeat-x 0 0;
+    height:22px;
+}
+
+.x-slider-horz .x-slider-thumb {
+    width:14px;
+    height:15px;
+    position:absolute;
+    left:0;
+    top:3px;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-horz .x-slider-thumb-over {
+    background-position: -14px -15px;
+}
+
+.x-slider-horz .x-slider-thumb-drag {
+    background-position: -28px -30px;
+}
+
+/* Vertical styles */
+.x-slider-vert {
+    padding-top:7px;
+    background:transparent no-repeat -44px 0;
+    width:22px;
+}
+
+.x-slider-vert .x-slider-end {
+    padding-bottom:7px;
+    zoom:1;
+    background:transparent no-repeat -22px bottom;
+}
+
+.x-slider-vert .x-slider-inner {
+    background:transparent repeat-y 0 0;
+}
+
+.x-slider-vert .x-slider-thumb {
+    width:15px;
+    height:14px;
+    position:absolute;
+    left:3px;
+    bottom:0;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-vert .x-slider-thumb-over {
+    background-position: -15px -14px;
+}
+
+.x-slider-vert .x-slider-thumb-drag {
+    background-position: -30px -28px;
+}.x-window-dlg .x-window-body {
+    border:0 none !important;
+    padding:5px 10px;
+    overflow:hidden !important;
+}
+
+.x-window-dlg .x-window-mc {
+    border:0 none !important;
+}
+
+.x-window-dlg .ext-mb-input {
+    margin-top:4px;
+    width:95%;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    margin-top:4px;
+}
+
+.x-window-dlg .x-progress-wrap {
+    margin-top:4px;
+}
+
+.ext-ie .x-window-dlg .x-progress-wrap {
+    margin-top:6px;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background:transparent no-repeat left;
+    display:block;
+    width:300px;
+    padding-left:18px;
+    line-height:18px;
+}
+
+.x-window-dlg .ext-mb-icon {
+    float:left;
+    width:47px;
+    height:32px;
+}
+
+.x-window-dlg .x-dlg-icon .ext-mb-content{
+    zoom: 1; 
+    margin-left: 47px;
+}
+
+.x-window-dlg .ext-mb-info, .x-window-dlg .ext-mb-warning, .x-window-dlg .ext-mb-question, .x-window-dlg .ext-mb-error {
+    background:transparent no-repeat top left;
+}
+
+.ext-gecko2 .ext-mb-fix-cursor {
+    overflow:auto;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/reset-min.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/reset-min.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/reset-min.css	(revision 76)
@@ -0,0 +1,7 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/README.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/README.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/README.txt	(revision 76)
@@ -0,0 +1,6 @@
+2010-03-16 jwr:
+The CSS file, yourtheme.css, is an exact copy of xtheme-blue.css. Feel free to edit the images inside the yourtheme image directory to build your custom theme--just remember to update your background-image file paths in yourtheme.css.
+
+2006-11-21 jvs:
+ext-all.css contains all of the other css files combined and stripped of comments (except themes).
+
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/debug.css	(revision 76)
@@ -0,0 +1,43 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+#x-debug-browser .x-tree .x-tree-node a span {
+    padding-top:2px;
+    line-height:18px;
+}
+
+#x-debug-browser  .x-tool-toggle {
+    background-position:0 -75px;
+}
+
+#x-debug-browser  .x-tool-toggle-over {
+    background-position:-15px -75px;
+}
+
+#x-debug-browser.x-panel-collapsed .x-tool-toggle {
+    background-position:0 -60px;
+}
+
+#x-debug-browser.x-panel-collapsed .x-tool-toggle-over {
+    background-position:-15px -60px;
+}#x-debug-browser .x-tree .x-tree-node a span {
+    color:#222297;
+    font-size:11px;
+    font-family:"monotype","courier new",sans-serif;
+}
+
+#x-debug-browser .x-tree a i {
+    color:#ff4545;
+    font-style:normal;
+}
+
+#x-debug-browser .x-tree a em {
+    color:#999;
+}
+
+#x-debug-browser .x-tree .x-tree-node .x-tree-selected a span{
+    background-color:#c3daf9;
+}
Index: /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/resources/css/ext-all.css	(revision 76)
@@ -0,0 +1,6993 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
+
+.ext-forced-border-box, .ext-forced-border-box * {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+}
+.ext-el-mask {
+    z-index: 100;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width: 100%;
+    height: 100%;
+    zoom: 1;
+}
+
+.ext-el-mask-msg {
+    z-index: 20001;
+    position: absolute;
+    top: 0;
+    left: 0;
+    border:1px solid;
+    background:repeat-x 0 -16px;
+    padding:2px;
+}
+
+.ext-el-mask-msg div {
+    padding:5px 10px 5px 10px;
+    border:1px solid;
+    cursor:wait;
+}
+
+.ext-shim {
+    position:absolute;
+    visibility:hidden;
+    left:0;
+    top:0;
+    overflow:hidden;
+}
+
+.ext-ie .ext-shim {
+    filter: alpha(opacity=0);
+}
+
+.ext-ie6 .ext-shim {
+    margin-left: 5px;
+    margin-top: 3px;
+}
+
+.x-mask-loading div {
+    padding:5px 10px 5px 25px;
+    background:no-repeat 5px 5px;
+    line-height:16px;
+}
+
+/* class for hiding elements without using display:none */
+.x-hidden, .x-hide-offsets {
+    position:absolute !important;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+}
+
+.x-hide-display {
+    display:none !important;
+}
+
+.x-hide-nosize,
+.x-hide-nosize *    /* Emulate display:none for children */
+ {
+   height:0px!important;
+   width:0px!important;
+   visibility:hidden!important;
+   border:none!important;
+   zoom:1;
+}
+
+.x-hide-visibility {
+    visibility:hidden !important;
+}
+
+.x-masked {
+    overflow: hidden !important;
+}
+.x-masked-relative {
+    position: relative !important;
+}
+
+.x-masked select, .x-masked object, .x-masked embed {
+    visibility: hidden;
+}
+
+.x-layer {
+    visibility: hidden;
+}
+
+.x-unselectable, .x-unselectable * {
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-repaint {
+    zoom: 1;
+    background-color: transparent;
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-item-disabled {
+    cursor: default;
+    opacity: .6;
+    -moz-opacity: .6;
+    filter: alpha(opacity=60);
+}
+
+.x-item-disabled * {
+    cursor: default !important;
+}
+
+.x-form-radio-group .x-item-disabled {
+    filter: none;
+}
+
+.x-splitbar-proxy {
+    position: absolute;
+    visibility: hidden;
+    z-index: 20001;
+    zoom: 1;
+    line-height: 1px;
+    font-size: 1px;
+    overflow: hidden;
+}
+
+.x-splitbar-h, .x-splitbar-proxy-h {
+    cursor: e-resize;
+    cursor: col-resize;
+}
+
+.x-splitbar-v, .x-splitbar-proxy-v {
+    cursor: s-resize;
+    cursor: row-resize;
+}
+
+.x-color-palette {
+    width: 150px;
+    height: 92px;
+    cursor: pointer;
+}
+
+.x-color-palette a {
+    border: 1px solid;
+    float: left;
+    padding: 2px;
+    text-decoration: none;
+    -moz-outline: 0 none;
+    outline: 0 none;
+    cursor: pointer;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border: 1px solid;
+}
+
+.x-color-palette em {
+    display: block;
+    border: 1px solid;
+}
+
+.x-color-palette em span {
+    cursor: pointer;
+    display: block;
+    height: 10px;
+    line-height: 10px;
+    width: 10px;
+}
+
+.x-ie-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+    zoom:1;
+}
+
+.x-shadow {
+    display: none;
+    position: absolute;
+    overflow: hidden;
+    left:0;
+    top:0;
+}
+
+.x-shadow * {
+    overflow: hidden;
+}
+
+.x-shadow * {
+    padding: 0;
+    border: 0;
+    margin: 0;
+    clear: none;
+    zoom: 1;
+}
+
+/* top  bottom */
+.x-shadow .xstc, .x-shadow .xsbc {
+    height: 6px;
+    float: left;
+}
+
+/* corners */
+.x-shadow .xstl, .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbr {
+    width: 6px;
+    height: 6px;
+    float: left;
+}
+
+/* sides */
+.x-shadow .xsc {
+    width: 100%;
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    width: 6px;
+    float: left;
+    height: 100%;
+}
+
+.x-shadow .xsmc {
+    float: left;
+    height: 100%;
+    background-color: transparent;
+}
+
+.x-shadow .xst, .x-shadow .xsb {
+    height: 6px;
+    overflow: hidden;
+    width: 100%;
+}
+
+.x-shadow .xsml {
+    background: transparent repeat-y 0 0;
+}
+
+.x-shadow .xsmr {
+    background: transparent repeat-y -6px 0;
+}
+
+.x-shadow .xstl {
+    background: transparent no-repeat 0 0;
+}
+
+.x-shadow .xstc {
+    background: transparent repeat-x 0 -30px;
+}
+
+.x-shadow .xstr {
+    background: transparent repeat-x 0 -18px;
+}
+
+.x-shadow .xsbl {
+    background: transparent no-repeat 0 -12px;
+}
+
+.x-shadow .xsbc {
+    background: transparent repeat-x 0 -36px;
+}
+
+.x-shadow .xsbr {
+    background: transparent repeat-x 0 -6px;
+}
+
+.loading-indicator {
+    background: no-repeat left;
+    padding-left: 20px;
+    line-height: 16px;
+    margin: 3px;
+}
+
+.x-text-resize {
+    position: absolute;
+    left: -1000px;
+    top: -1000px;
+    visibility: hidden;
+    zoom: 1;
+}
+
+.x-drag-overlay {
+    width: 100%;
+    height: 100%;
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 0;
+    background-image:url(../images/default/s.gif);
+    z-index: 20000;
+}
+
+.x-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.x-spotlight {
+    z-index: 8999;
+    position: absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity: .50;
+    filter: alpha(opacity=50);
+    width:0;
+    height:0;
+    zoom: 1;
+}
+
+#x-history-frame {
+    position:absolute;
+    top:-1px;
+    left:0;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
+
+#x-history-field {
+    position:absolute;
+    top:0;
+    left:-1px;
+	width:1px;
+    height:1px;
+    visibility:hidden;
+}
+.x-resizable-handle {
+    position:absolute;
+    z-index:100;
+    /* ie needs these */
+    font-size:1px;
+    line-height:6px;
+    overflow:hidden;
+	filter:alpha(opacity=0);
+	opacity:0;
+	zoom:1;
+}
+
+.x-resizable-handle-east{
+    width:6px;
+    cursor:e-resize;
+    right:0;
+    top:0;
+    height:100%;
+}
+
+.ext-ie .x-resizable-handle-east {
+    margin-right:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-south{
+    width:100%;
+    cursor:s-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+}
+
+.ext-ie .x-resizable-handle-south {
+    margin-bottom:-1px; /*IE rounding error*/
+}
+
+.x-resizable-handle-west{
+    width:6px;
+    cursor:w-resize;
+    left:0;
+    top:0;
+    height:100%;
+}
+
+.x-resizable-handle-north{
+    width:100%;
+    cursor:n-resize;
+    left:0;
+    top:0;
+    height:6px;
+}
+
+.x-resizable-handle-southeast{
+    width:6px;
+    cursor:se-resize;
+    right:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northwest{
+    width:6px;
+    cursor:nw-resize;
+    left:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-northeast{
+    width:6px;
+    cursor:ne-resize;
+    right:0;
+    top:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-handle-southwest{
+    width:6px;
+    cursor:sw-resize;
+    left:0;
+    bottom:0;
+    height:6px;
+    z-index:101;
+}
+
+.x-resizable-over .x-resizable-handle, .x-resizable-pinned .x-resizable-handle{
+    filter:alpha(opacity=100);
+	opacity:1;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+	background-position: left;
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-position: top;
+}
+
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-position: top left;
+}
+
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-position:bottom right;
+}
+
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-position: bottom left;
+}
+
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-position: top right;
+}
+
+.x-resizable-proxy{
+    border: 1px dashed;
+    position:absolute;
+    overflow:hidden;
+    display:none;
+	left:0;
+    top:0;
+    z-index:50000;
+}
+
+.x-resizable-overlay{
+    width:100%;
+	height:100%;
+	display:none;
+	position:absolute;
+	left:0;
+	top:0;
+	z-index:200000;
+	-moz-opacity: 0;
+    opacity:0;
+    filter: alpha(opacity=0);
+}
+.x-tab-panel {
+    overflow:hidden;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border: 1px solid;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header {
+	border: 1px solid;
+	padding-bottom: 2px;
+}
+
+.x-tab-panel-footer {
+	border: 1px solid;
+	padding-top: 2px;
+}
+
+.x-tab-strip-wrap {
+	width:100%;
+    overflow:hidden;
+    position:relative;
+    zoom:1;
+}
+
+ul.x-tab-strip {
+	display:block;
+    width:5000px;
+    zoom:1;
+}
+
+ul.x-tab-strip-top{
+	padding-top: 1px;
+	background: repeat-x bottom;
+	border-bottom: 1px solid;
+}
+
+ul.x-tab-strip-bottom{
+	padding-bottom: 1px;
+	background: repeat-x top;
+	border-top: 1px solid;
+	border-bottom: 0 none;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-top {
+    background:transparent !important;
+    padding-top:0 !important;
+}
+
+.x-tab-panel-header-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border:1px solid;
+    height:2px;
+    font-size:1px;
+    line-height:1px;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer {
+    border-top: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-bottom: 0 none;
+}
+
+.x-tab-panel-footer-plain .x-tab-strip-bottom {
+    background:transparent !important;
+    padding-bottom:0 !important;
+}
+
+.x-tab-panel-footer-plain {
+    background:transparent !important;
+    border-width:0 !important;
+    padding-top:0 !important;
+}
+
+.ext-border-box .x-tab-panel-header-plain .x-tab-strip-spacer,
+.ext-border-box .x-tab-panel-footer-plain .x-tab-strip-spacer {
+    height:3px;
+}
+
+ul.x-tab-strip li {
+    float:left;
+    margin-left:2px;
+}
+
+ul.x-tab-strip li.x-tab-edge {
+    float:left;
+    margin:0 !important;
+    padding:0 !important;
+    border:0 none !important;
+    font-size:1px !important;
+    line-height:1px !important;
+    overflow:hidden;
+    zoom:1;
+    background:transparent !important;
+    width:1px;
+}
+
+.x-tab-strip a, .x-tab-strip span, .x-tab-strip em {
+	display:block;
+}
+
+.x-tab-strip a {
+	text-decoration:none !important;
+	-moz-outline: none;
+	outline: none;
+	cursor:pointer;
+}
+
+.x-tab-strip-inner {
+    overflow:hidden;
+	text-overflow: ellipsis;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	white-space: nowrap;
+	cursor:pointer;
+    padding:4px 0;
+}
+
+.x-tab-strip-top .x-tab-with-icon .x-tab-right {
+    padding-left:6px;
+}
+
+.x-tab-strip .x-tab-with-icon span.x-tab-strip-text {
+	padding-left:20px;
+    background-position: 0 3px;
+    background-repeat: no-repeat;
+}
+
+.x-tab-strip-active, .x-tab-strip-active a.x-tab-right {
+    cursor:default;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	cursor:default;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	cursor:default;
+}
+
+.x-tab-panel-body {
+    overflow:hidden;
+}
+
+.x-tab-panel-bwrap {
+    overflow:hidden;
+}
+
+.ext-ie .x-tab-strip .x-tab-right {
+    position:relative;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+    margin-bottom:-1px;
+}
+
+/*
+ * Horrible hack for IE8 in quirks mode
+ */
+.ext-ie8 .x-tab-strip li {
+    position: relative;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top .x-tab-right {
+    top: 1px;
+}
+.ext-ie8 .x-tab-strip-top {
+    padding-top: 1;
+}
+.ext-border-box .ext-ie8 .x-tab-strip-top {
+    padding-top: 0;
+}
+.ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:3px;
+}
+.ext-border-box .ext-ie8 .x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    top:4px;
+}
+.ext-ie8 .x-tab-strip-bottom .x-tab-right{
+    top:0;
+}
+
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-bottom:5px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+    margin-top:-1px;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
+    padding-top:5px;
+}
+
+.x-tab-strip-top .x-tab-right {
+	background: transparent no-repeat 0 -51px;
+    padding-left:10px;
+}
+
+.x-tab-strip-top .x-tab-left {
+	background: transparent no-repeat right -351px;
+    padding-right:10px;
+}
+
+.x-tab-strip-top .x-tab-strip-inner {
+	background: transparent repeat-x 0 -201px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-right {
+	 background-position:0 -101px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-left {
+	 background-position:right -401px;
+}
+
+.x-tab-strip-top .x-tab-strip-over .x-tab-strip-inner {
+	 background-position:0 -251px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-right {
+	background-position: 0 0;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-left {
+	background-position: right -301px;
+}
+
+.x-tab-strip-top .x-tab-strip-active .x-tab-strip-inner {
+	background-position: 0 -151px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background: no-repeat bottom right;
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background: no-repeat bottom left;
+}
+
+.x-tab-strip-bottom .x-tab-left {
+    margin-right: 3px;
+    padding:0 10px;
+}
+
+.x-tab-strip-bottom .x-tab-right {
+    padding:0;
+}
+
+.x-tab-strip .x-tab-strip-close {
+    display:none;
+}
+
+.x-tab-strip-closable {
+    position:relative;
+}
+
+.x-tab-strip-closable .x-tab-left {
+    padding-right:19px;
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+    opacity:.6;
+    -moz-opacity:.6;
+    background-repeat:no-repeat;
+    display:block;
+	width:11px;
+    height:11px;
+    position:absolute;
+    top:3px;
+    right:3px;
+    cursor:pointer;
+    z-index:2;
+}
+
+.x-tab-strip .x-tab-strip-active a.x-tab-strip-close {
+    opacity:.8;
+    -moz-opacity:.8;
+}
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+    opacity:1;
+    -moz-opacity:1;
+}
+
+.x-tab-panel-body {
+    border: 1px solid;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background: transparent no-repeat -18px 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    left:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background: transparent no-repeat 0 0;
+    border-bottom: 1px solid;
+    width:18px;
+    position:absolute;
+    right:0;
+    top:0;
+    z-index:10;
+    cursor:pointer;
+}
+
+.x-tab-scroller-right-over {
+    background-position: -18px 0;
+}
+
+.x-tab-scroller-right-disabled {
+    background-position: 0 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scrolling-bottom .x-tab-scroller-left, .x-tab-scrolling-bottom .x-tab-scroller-right{
+    margin-top: 1px;
+}
+
+.x-tab-scrolling .x-tab-strip-wrap {
+    margin-left:18px;
+    margin-right:18px;
+}
+
+.x-tab-scrolling {
+    position:relative;    
+}
+
+.x-tab-panel-bbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-tab-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}/* all fields */
+.x-form-field{
+    margin: 0 0 0 0;
+}
+
+.ext-webkit *:focus{
+    outline: none !important;
+}
+
+/* ---- text fields ---- */
+.x-form-text, textarea.x-form-field{
+    padding:1px 3px;
+    background:repeat-x 0 0;
+    border:1px solid;
+}
+
+textarea.x-form-field {
+    padding:2px 3px;
+}
+
+.x-form-text, .ext-ie .x-form-file {
+    height:22px;
+    line-height:18px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-form-text, .ext-ie7 .x-form-text {
+    margin:-1px 0; /* ie bogus margin bug */
+    height:22px; /* ie quirks */
+    line-height:18px;
+}
+
+.x-quirks .ext-ie9 .x-form-text {
+    height: 22px;
+    padding-top: 3px;
+    padding-bottom: 0px;
+}
+
+/* Ugly hacks for the bogus 1px margin bug in IE9 quirks */
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-text,
+.x-quirks .ext-ie9 .x-form-field-trigger-wrap .x-form-text {
+    margin-top: -1px;
+    margin-bottom: -1px;
+}
+.x-quirks .ext-ie9 .x-input-wrapper .x-form-element {
+    margin-bottom: -1px;
+}
+
+.ext-ie6 .x-form-field-wrap .x-form-file-btn, .ext-ie7 .x-form-field-wrap .x-form-file-btn {
+    top: -1px; /* because of all these margin hacks, these buttons are off by one pixel in IE6,7 */
+}
+
+.ext-ie6 textarea.x-form-field, .ext-ie7 textarea.x-form-field {
+    margin:-1px 0; /* ie bogus margin bug */
+}
+
+.ext-strict .x-form-text {
+    height:18px;
+}
+
+.ext-safari.ext-mac textarea.x-form-field {
+    margin-bottom:-2px; /* another bogus margin bug, safari/mac only */
+}
+
+/*
+.ext-strict .ext-ie8 .x-form-text, .ext-strict .ext-ie8 textarea.x-form-field {
+    margin-bottom: 1px;
+}
+*/
+
+.ext-gecko .x-form-text , .ext-ie8 .x-form-text {
+    padding-top:2px; /* FF won't center the text vertically */
+    padding-bottom:0;
+}
+
+.ext-ie6 .x-form-composite .x-form-text.x-box-item, .ext-ie7 .x-form-composite .x-form-text.x-box-item {
+    margin: 0 !important; /* clear ie bogus margin bug fix */
+}
+
+textarea {
+    resize: none;  /* Disable browser resizable textarea */
+}
+
+/* select boxes */
+.x-form-select-one {
+    height:20px;
+    line-height:18px;
+    vertical-align:middle;
+    border: 1px solid;
+}
+
+/* multi select boxes */
+
+/* --- TODO --- */
+
+/* 2.0.2 style */
+.x-form-check-wrap {
+    line-height:18px;
+    height: auto;
+}
+
+.ext-ie .x-form-check-wrap input {
+    width:15px;
+    height:15px;
+}
+
+.x-form-check-wrap input{
+    vertical-align: bottom;
+}
+
+.x-editor .x-form-check-wrap {
+    padding:3px;
+}
+
+.x-editor .x-form-checkbox {
+    height:13px;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid;
+    margin-bottom: 5px;
+    padding-left: 3px !important;
+    float: none !important;
+}
+
+/* wrapped fields and triggers */
+.x-form-field-wrap .x-form-trigger{
+    width:17px;
+    height:21px;
+    border:0;
+    background:transparent no-repeat 0 0;
+    cursor:pointer;
+    border-bottom: 1px solid;
+    position:absolute;
+    top:0;
+}
+
+.x-form-field-wrap .x-form-date-trigger, .x-form-field-wrap .x-form-clear-trigger, .x-form-field-wrap .x-form-search-trigger{
+    cursor:pointer;
+}
+
+.x-form-field-wrap .x-form-twin-triggers .x-form-trigger{
+    position:static;
+    top:auto;
+    vertical-align:top;
+}
+
+.x-form-field-wrap {
+    position:relative;
+    left:0;top:0;
+    text-align: left;
+    zoom:1;
+    white-space: nowrap;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-trigger {
+    right: 0; /* IE8 Strict mode trigger bug */
+}
+
+.x-form-field-wrap .x-form-trigger-over{
+    background-position:-17px 0;
+}
+
+.x-form-field-wrap .x-form-trigger-click{
+    background-position:-34px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    background-position:-51px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-over{
+    background-position:-68px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger-click{
+    background-position:-85px 0;
+}
+
+.x-trigger-wrap-focus .x-form-trigger{
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-over{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-item-disabled .x-form-trigger-click{
+    background-position:0 0 !important;
+    border-bottom: 1px solid;
+}
+
+.x-trigger-noedit{
+    cursor:pointer;
+}
+
+/* field focus style */
+.x-form-focus, textarea.x-form-focus{
+    border: 1px solid;
+}
+
+/* invalid fields */
+.x-form-invalid, textarea.x-form-invalid{
+    background:repeat-x bottom;
+    border: 1px solid;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid{
+    background:repeat-x bottom;
+}
+
+/* editors */
+.x-editor {
+    visibility:hidden;
+    padding:0;
+    margin:0;
+}
+
+.x-form-grow-sizer {
+    left: -10000px;
+    padding: 8px 3px;
+    position: absolute;
+    visibility:hidden;
+    top: -10000px;
+    white-space: pre-wrap;
+    white-space: -moz-pre-wrap;
+    white-space: -pre-wrap;
+    white-space: -o-pre-wrap;
+    word-wrap: break-word;
+    zoom:1;
+}
+
+.x-form-grow-sizer p {
+    margin:0 !important;
+    border:0 none !important;
+    padding:0 !important;
+}
+
+/* Form Items CSS */
+
+.x-form-item {
+    display:block;
+    margin-bottom:4px;
+    zoom:1;
+}
+
+.x-form-item label.x-form-item-label {
+    display:block;
+    float:left;
+    width:100px;
+    padding:3px;
+    padding-left:0;
+    clear:left;
+    z-index:2;
+    position:relative;
+}
+
+.x-form-element {
+    padding-left:105px;
+    position:relative;
+}
+
+.x-form-invalid-msg {
+    padding:2px;
+    padding-left:18px;
+    background: transparent no-repeat 0 2px;
+    line-height:16px;
+    width:200px;
+}
+
+.x-form-label-left label.x-form-item-label {
+   text-align:left;
+}
+
+.x-form-label-right label.x-form-item-label {
+   text-align:right;
+}
+
+.x-form-label-top .x-form-item label.x-form-item-label {
+    width:auto;
+    float:none;
+    clear:none;
+    display:inline;
+    margin-bottom:4px;
+    position:static;
+}
+
+.x-form-label-top .x-form-element {
+    padding-left:0;
+    padding-top:4px;
+}
+
+.x-form-label-top .x-form-item {
+    padding-bottom:4px;
+}
+
+/* Editor small font for grid, toolbar and tree */
+.x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    margin-top:-1px !important; /* ie bogus margin bug */
+    margin-bottom:-1px !important;
+    height:20px !important; /* ie quirks */
+    line-height:16px !important;
+}
+
+.ext-strict .x-small-editor .x-form-text {
+    height:16px !important;
+}
+
+.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
+    height:20px;
+    line-height:16px;
+}
+
+.ext-border-box .x-small-editor .x-form-text {
+    height:20px;
+}
+
+.x-small-editor .x-form-select-one {
+    height:20px;
+    line-height:16px;
+    vertical-align:middle;
+}
+
+.x-small-editor .x-form-num-field {
+    text-align:right;
+}
+
+.x-small-editor .x-form-field-wrap .x-form-trigger{
+    height:19px;
+}
+
+.ext-webkit .x-small-editor .x-form-text{padding-top:3px;font-size:100%;}
+
+.ext-strict .ext-webkit .x-small-editor .x-form-text{
+    height:14px !important;
+}
+
+.x-form-clear {
+    clear:both;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+.x-form-clear-left {
+    clear:left;
+    height:0;
+    overflow:hidden;
+    line-height:0;
+    font-size:0;
+}
+
+.ext-ie6 .x-form-check-wrap input, .ext-border-box .x-form-check-wrap input{
+   margin-top: 3px;
+}
+
+.x-form-cb-label {
+    position: relative;
+    margin-left:4px;
+    top: 2px;
+}
+
+.ext-ie .x-form-cb-label{
+    top: 1px;
+}
+
+.ext-ie6 .x-form-cb-label, .ext-border-box .x-form-cb-label{
+    top: 3px;
+}
+
+.x-form-display-field{
+    padding-top: 2px;
+}
+
+.ext-gecko .x-form-display-field, .ext-strict .ext-ie7 .x-form-display-field{
+    padding-top: 1px;
+}
+
+.ext-ie .x-form-display-field{
+    padding-top: 3px;
+}
+
+.ext-strict .ext-ie8 .x-form-display-field{
+    padding-top: 0;
+}
+
+.x-form-column {
+    float:left;
+    padding:0;
+    margin:0;
+    width:48%;
+    overflow:hidden;
+    zoom:1;
+}
+
+/* buttons */
+.x-form .x-form-btns-ct .x-btn{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns td {
+    border:0;
+    padding:0;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-right table{
+    float:right;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-left table{
+    float:left;
+    clear:none;
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center{
+    text-align:center; /*ie*/
+}
+
+.x-form .x-form-btns-ct .x-form-btns-center table{
+    margin:0 auto; /*everyone else*/
+}
+
+.x-form .x-form-btns-ct table td.x-form-btn-td{
+    padding:3px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-left{
+    background-position:0 -147px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-right{
+    background-position:0 -168px;
+}
+
+.x-form .x-form-btns-ct .x-btn-focus .x-btn-center{
+    background-position:0 -189px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-center{
+    background-position:0 -126px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click  .x-btn-right{
+    background-position:0 -84px;
+}
+
+.x-form .x-form-btns-ct .x-btn-click .x-btn-left{
+    background-position:0 -63px;
+}
+
+.x-form-invalid-icon {
+    width:16px;
+    height:18px;
+    visibility:hidden;
+    position:absolute;
+    left:0;
+    top:0;
+    display:block;
+    background:transparent no-repeat 0 2px;
+}
+
+/* fieldsets */
+.x-fieldset {
+    border:1px solid;
+    padding:10px;
+    margin-bottom:10px;
+    display:block; /* preserve margins in IE */
+}
+
+/* make top of checkbox/tools visible in webkit */
+.ext-webkit .x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset legend {
+    margin-bottom:10px;
+}
+
+.ext-strict .ext-ie9 .x-fieldset legend.x-fieldset-header {
+    padding-top: 1px;
+}
+
+.ext-ie .x-fieldset {
+    padding-top: 0;
+    padding-bottom:10px;
+}
+
+.x-fieldset legend .x-tool-toggle {
+    margin-right:3px;
+    margin-left:0;
+    float:left !important;
+}
+
+.x-fieldset legend input {
+    margin-right:3px;
+    float:left !important;
+    height:13px;
+    width:13px;
+}
+
+fieldset.x-panel-collapsed {
+    padding-bottom:0 !important;
+    border-width: 1px 1px 0 1px !important;
+    border-left-color: transparent;
+    border-right-color: transparent;
+}
+
+.ext-ie6 fieldset.x-panel-collapsed{
+    padding-bottom:0 !important;
+    border-width: 1px 0 0 0 !important;
+    margin-left: 1px;
+    margin-right: 1px;
+}
+
+fieldset.x-panel-collapsed .x-fieldset-bwrap {
+    visibility:hidden;
+    position:absolute;
+    left:-1000px;
+    top:-1000px;
+}
+
+.ext-ie .x-fieldset-bwrap {
+    zoom:1;
+}
+
+.x-fieldset-noborder {
+    border:0px none transparent;
+}
+
+.x-fieldset-noborder legend {
+    margin-left:-3px;
+}
+
+/* IE legend positioning bug */
+.ext-ie .x-fieldset-noborder legend {
+    position: relative;
+    margin-bottom:23px;
+}
+.ext-ie .x-fieldset-noborder legend span {
+    position: absolute;
+    left:16px;
+}
+
+.ext-gecko .x-window-body .x-form-item {
+    -moz-outline: none;
+    outline: none;
+    overflow: auto;
+}
+
+.ext-mac.ext-gecko .x-window-body .x-form-item {
+    overflow:hidden;
+}
+
+.ext-gecko .x-form-item {
+    -moz-outline: none;
+    outline: none;
+}
+
+.x-hide-label label.x-form-item-label {
+     display:none;
+}
+
+.x-hide-label .x-form-element {
+     padding-left: 0 !important;
+}
+
+.x-form-label-top .x-hide-label label.x-form-item-label{
+    display: none;
+}
+
+.x-fieldset {
+    overflow:hidden;
+}
+
+.x-fieldset-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-fieldset-body {
+    overflow:hidden;
+}
+.x-btn{
+	cursor:pointer;
+	white-space: nowrap;
+}
+
+.x-btn button{
+    border:0 none;
+    background-color:transparent;
+    padding-left:3px;
+    padding-right:3px;
+    cursor:pointer;
+    margin:0;
+    overflow:visible;
+    width:auto;
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+* html .ext-ie .x-btn button {
+    width:1px;
+}
+
+.ext-gecko .x-btn button, .ext-webkit .x-btn button {
+    padding-left:0;
+    padding-right:0;
+}
+
+.ext-gecko .x-btn button::-moz-focus-inner {
+    padding:0;
+}
+
+.ext-ie .x-btn button {
+    padding-top:2px;
+}
+
+.x-btn td {
+    padding:0 !important;
+}
+
+.x-btn-text {
+    cursor:pointer;
+	white-space: nowrap;
+    padding:0;
+}
+
+/* icon placement and sizing styles */
+
+/* Only text */
+.x-btn-noicon .x-btn-small .x-btn-text{
+	height: 16px;
+}
+
+.x-btn-noicon .x-btn-medium .x-btn-text{
+    height: 24px;
+}
+
+.x-btn-noicon .x-btn-large .x-btn-text{
+    height: 32px;
+}
+
+/* Only icons */
+.x-btn-icon .x-btn-text{
+    background-position: center;
+	background-repeat: no-repeat;
+}
+
+.x-btn-icon .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 16px;
+}
+
+.x-btn-icon .x-btn-medium .x-btn-text{
+    height: 24px;
+	width: 24px;
+}
+
+.x-btn-icon .x-btn-large .x-btn-text{
+    height: 32px;
+	width: 32px;
+}
+
+/* Icons and text */
+/* left */
+.x-btn-text-icon .x-btn-icon-small-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-left .x-btn-text{
+    background-position: 0 center;
+	background-repeat: no-repeat;
+    padding-left:34px;
+    height:32px;
+}
+
+/* top */
+.x-btn-text-icon .x-btn-icon-small-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-top .x-btn-text{
+    background-position: center 0;
+	background-repeat: no-repeat;
+    padding-top:34px;
+}
+
+/* right */
+.x-btn-text-icon .x-btn-icon-small-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:18px;
+    height:16px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:26px;
+    height:24px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-right .x-btn-text{
+    background-position: right center;
+	background-repeat: no-repeat;
+    padding-right:34px;
+    height:32px;
+}
+
+/* bottom */
+.x-btn-text-icon .x-btn-icon-small-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:18px;
+}
+
+.x-btn-text-icon .x-btn-icon-medium-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:26px;
+}
+
+.x-btn-text-icon .x-btn-icon-large-bottom .x-btn-text{
+    background-position: center bottom;
+	background-repeat: no-repeat;
+    padding-bottom:34px;
+}
+
+/* background positioning */
+.x-btn-tr i, .x-btn-tl i, .x-btn-mr i, .x-btn-ml i, .x-btn-br i, .x-btn-bl i{
+	font-size:1px;
+    line-height:1px;
+    width:3px;
+    display:block;
+    overflow:hidden;
+}
+
+.x-btn-tr i, .x-btn-tl i, .x-btn-br i, .x-btn-bl i{
+	height:3px;
+}
+
+.x-btn-tl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 0;
+}
+.x-btn-tr{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px 0;
+}
+.x-btn-tc{
+	height:3px;
+	background:repeat-x 0 -6px;
+}
+
+.x-btn-ml{
+	width:3px;
+	background:no-repeat 0 -24px;
+}
+.x-btn-mr{
+	width:3px;
+	background:no-repeat -3px -24px;
+}
+
+.x-btn-mc{
+	background:repeat-x 0 -1096px;
+    vertical-align: middle;
+	text-align:center;
+	padding:0 5px;
+	cursor:pointer;
+	white-space:nowrap;
+}
+
+/* Fixes an issue with the button height */
+.ext-strict .ext-ie6 .x-btn-mc, .ext-strict .ext-ie7 .x-btn-mc {
+    height: 100%;
+}
+
+.x-btn-bl{
+	width:3px;
+	height:3px;
+	background:no-repeat 0 -3px;
+}
+
+.x-btn-br{
+	width:3px;
+	height:3px;
+	background:no-repeat -3px -3px;
+}
+
+.x-btn-bc{
+	height:3px;
+	background:repeat-x 0 -15px;
+}
+
+.x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-btn-click .x-btn-tl, .x-btn-menu-active .x-btn-tl, .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-btn-click .x-btn-tr, .x-btn-menu-active .x-btn-tr, .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-btn-click .x-btn-tc, .x-btn-menu-active .x-btn-tc, .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-btn-click .x-btn-ml, .x-btn-menu-active .x-btn-ml, .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-btn-click .x-btn-mr, .x-btn-menu-active .x-btn-mr, .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-btn-click .x-btn-mc, .x-btn-menu-active .x-btn-mc, .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-btn-click .x-btn-bl, .x-btn-menu-active .x-btn-bl, .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-btn-click .x-btn-br, .x-btn-menu-active .x-btn-br, .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-btn-click .x-btn-bc, .x-btn-menu-active .x-btn-bc, .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-btn-disabled *{
+	cursor:default !important;
+}
+
+
+/* With a menu arrow */
+/* right */
+.x-btn-mc em.x-btn-arrow {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:10px;
+}
+
+.x-btn-mc em.x-btn-split {
+    display:block;
+    background:transparent no-repeat right center;
+	padding-right:14px;
+}
+
+/* bottom */
+.x-btn-mc em.x-btn-arrow-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    display:block;
+    background:transparent no-repeat center bottom;
+	padding-bottom:14px;
+}
+
+/* height adjustment class */
+.x-btn-as-arrow .x-btn-mc em {
+    display:block;
+    background-color:transparent;
+	padding-bottom:14px;
+}
+
+/* groups */
+.x-btn-group {
+    padding:1px;
+}
+
+.x-btn-group-header {
+    padding:2px;
+    text-align:center;
+}
+
+.x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+.x-btn-group-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:3px;
+}
+
+.x-btn-group-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-btn-group-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-br {
+	background: transparent no-repeat right bottom;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-mc {
+    border:0 none;
+    padding:1px 0 0 0;
+    margin:0;
+}
+
+.x-btn-group-mc .x-btn-group-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-btn-group-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:3px;
+    zoom:1;
+}
+
+.x-btn-group-mr {
+	background: transparent repeat-y right 0;
+	padding-right:3px;
+    zoom:1;
+}
+
+.x-btn-group-bc .x-btn-group-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-btn-group-bc {
+	height:3px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-btn-group-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    height:2px;
+}.x-toolbar{
+    border-style:solid;
+    border-width:0 0 1px 0;
+    display: block;
+	padding:2px;
+    background:repeat-x top left;
+    position:relative;
+    left:0;
+    top:0;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-toolbar-left {
+    width: 100%;
+}
+
+.x-toolbar .x-item-disabled .x-btn-icon {
+    opacity: .35;
+    -moz-opacity: .35;
+    filter: alpha(opacity=35);
+}
+
+.x-toolbar td {
+	vertical-align:middle;
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+	white-space: nowrap;
+}
+
+.x-toolbar .x-item-disabled {
+	cursor:default;
+	opacity:.6;
+	-moz-opacity:.6;
+	filter:alpha(opacity=60);
+}
+
+.x-toolbar .x-item-disabled * {
+	cursor:default;
+}
+
+.x-toolbar .x-toolbar-cell {
+    vertical-align:middle;
+}
+
+.x-toolbar .x-btn-tl, .x-toolbar .x-btn-tr, .x-toolbar .x-btn-tc, .x-toolbar .x-btn-ml, .x-toolbar .x-btn-mr,
+.x-toolbar .x-btn-mc, .x-toolbar .x-btn-bl, .x-toolbar .x-btn-br, .x-toolbar .x-btn-bc
+{
+	background-position: 500px 500px;
+}
+
+/* These rules are duplicated from button.css to give priority of x-toolbar rules above */
+.x-toolbar .x-btn-over .x-btn-tl{
+	background-position: -6px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tr{
+	background-position: -9px 0;
+}
+
+.x-toolbar .x-btn-over .x-btn-tc{
+	background-position: 0 -9px;
+}
+
+.x-toolbar .x-btn-over .x-btn-ml{
+	background-position: -6px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mr{
+	background-position: -9px -24px;
+}
+
+.x-toolbar .x-btn-over .x-btn-mc{
+	background-position: 0 -2168px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bl{
+	background-position: -6px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-br{
+	background-position: -9px -3px;
+}
+
+.x-toolbar .x-btn-over .x-btn-bc{
+	background-position: 0 -18px;
+}
+
+.x-toolbar .x-btn-click .x-btn-tl, .x-toolbar .x-btn-menu-active .x-btn-tl, .x-toolbar .x-btn-pressed .x-btn-tl{
+	background-position: -12px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tr, .x-toolbar .x-btn-menu-active .x-btn-tr, .x-toolbar .x-btn-pressed .x-btn-tr{
+	background-position: -15px 0;
+}
+
+.x-toolbar .x-btn-click .x-btn-tc, .x-toolbar .x-btn-menu-active .x-btn-tc, .x-toolbar .x-btn-pressed .x-btn-tc{
+	background-position: 0 -12px;
+}
+
+.x-toolbar .x-btn-click .x-btn-ml, .x-toolbar .x-btn-menu-active .x-btn-ml, .x-toolbar .x-btn-pressed .x-btn-ml{
+	background-position: -12px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mr, .x-toolbar .x-btn-menu-active .x-btn-mr, .x-toolbar .x-btn-pressed .x-btn-mr{
+	background-position: -15px -24px;
+}
+
+.x-toolbar .x-btn-click .x-btn-mc, .x-toolbar .x-btn-menu-active .x-btn-mc, .x-toolbar .x-btn-pressed .x-btn-mc{
+	background-position: 0 -3240px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bl, .x-toolbar .x-btn-menu-active .x-btn-bl, .x-toolbar .x-btn-pressed .x-btn-bl{
+	background-position: -12px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-br, .x-toolbar .x-btn-menu-active .x-btn-br, .x-toolbar .x-btn-pressed .x-btn-br{
+	background-position: -15px -3px;
+}
+
+.x-toolbar .x-btn-click .x-btn-bc, .x-toolbar .x-btn-menu-active .x-btn-bc, .x-toolbar .x-btn-pressed .x-btn-bc{
+	background-position: 0 -21px;
+}
+
+.x-toolbar div.xtb-text{
+    padding:2px 2px 0;
+    line-height:16px;
+    display:block;
+}
+
+.x-toolbar .xtb-sep {
+	background-position: center;
+	background-repeat: no-repeat;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	width:4px;
+	overflow: hidden;
+	cursor:default;
+	margin: 0 2px 0;
+	border:0;
+}
+
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+
+/* Paging Toolbar */
+.x-tbar-page-number{
+	width:30px;
+	height:14px;
+}
+
+.ext-ie .x-tbar-page-number{
+    margin-top: 2px;
+}
+
+.x-paging-info {
+    position:absolute;
+    top:5px;
+    right: 8px;
+}
+
+/* floating */
+.x-toolbar-ct {
+    width:100%;
+}
+
+.x-toolbar-right td {
+    text-align: center;
+}
+
+.x-panel-tbar, .x-panel-bbar, .x-window-tbar, .x-window-bbar, .x-tab-panel-tbar, .x-tab-panel-bbar, .x-plain-tbar, .x-plain-bbar {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-toolbar-more .x-btn-small .x-btn-text{
+	height: 16px;
+	width: 12px;
+}
+
+.x-toolbar-more em.x-btn-arrow {
+    display:inline;
+    background-color:transparent;
+	padding-right:0;
+}
+
+.x-toolbar-more .x-btn-mc em.x-btn-arrow {
+    background-image: none;
+}
+
+div.x-toolbar-no-items {
+    color:gray !important;
+    padding:5px 10px !important;
+}
+
+/* fix ie toolbar form items */
+.ext-border-box .x-toolbar-cell .x-form-text {
+    margin-bottom:-1px !important;
+}
+
+.ext-border-box .x-toolbar-cell .x-form-field-wrap .x-form-text {
+    margin:0 !important;
+}
+
+.ext-ie .x-toolbar-cell .x-form-field-wrap {
+    height:21px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-text, .ext-strict .ext-ie .x-toolbar-cell .x-form-text {
+    top: 0px;
+}
+
+.x-toolbar-right td .x-form-field-trigger-wrap{
+    text-align: left;
+}
+
+.x-toolbar-cell .x-form-checkbox, .x-toolbar-cell .x-form-radio{
+    margin-top: 5px;
+}
+
+.x-toolbar-cell .x-form-cb-label{
+    vertical-align: bottom;
+    top: 1px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-checkbox, .ext-ie .x-toolbar-cell .x-form-radio{
+    margin-top: 4px;
+}
+
+.ext-ie .x-toolbar-cell .x-form-cb-label{
+    top: 0;
+}
+/* Grid3 styles */
+.x-grid3 {
+	position:relative;
+	overflow:hidden;
+}
+
+.x-grid-panel .x-panel-body {
+    overflow:hidden !important;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border:1px solid;
+}
+
+.x-grid3 table {
+    table-layout:fixed;
+}
+
+.x-grid3-viewport{
+	overflow:hidden;
+}
+
+.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
+    -moz-outline: none;
+    outline: none;
+	-moz-user-focus: normal;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td {
+    line-height:13px;
+    vertical-align: top;
+	padding-left:1px;
+    padding-right:1px;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-cell{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-row td {
+    line-height:15px;
+    vertical-align:middle;
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+.x-grid3-hd-row .x-grid3-marker-hd {
+    padding:3px;
+}
+
+.x-grid3-row .x-grid3-marker {
+    padding:3px;
+}
+
+.x-grid3-cell-inner, .x-grid3-hd-inner{
+	overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    padding:3px 3px 3px 5px;
+    white-space: nowrap;
+}
+
+/* ActionColumn, reduce padding to accommodate 16x16 icons in normal row height */
+.x-action-col-cell .x-grid3-cell-inner {
+    padding-top: 1px;
+    padding-bottom: 1px;
+}
+
+.x-action-col-icon {
+    cursor: pointer;
+}
+
+.x-grid3-hd-inner {
+    position:relative;
+	cursor:inherit;
+	padding:4px 3px 4px 5px;
+}
+
+.x-grid3-row-body {
+    white-space:normal;
+}
+
+.x-grid3-body-cell {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+/* IE Quirks to clip */
+.ext-ie .x-grid3-cell-inner, .ext-ie .x-grid3-hd-inner{
+	width:100%;
+}
+
+/* reverse above in strict mode */
+.ext-strict .x-grid3-cell-inner, .ext-strict .x-grid3-hd-inner{
+	width:auto;
+}
+
+.x-grid-row-loading {
+    background: no-repeat center center;
+}
+
+.x-grid-page {
+    overflow:hidden;
+}
+
+.x-grid3-row {
+	cursor: default;
+    border: 1px solid;
+    width:100%;
+}
+
+.x-grid3-row-over {
+	border:1px solid;
+    background: repeat-x left top;
+}
+
+.x-grid3-resize-proxy {
+	width:1px;
+    left:0;
+	cursor: e-resize;
+	cursor: col-resize;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-resize-marker {
+	width:1px;
+	left:0;
+	position:absolute;
+	top:0;
+	height:100px;
+	overflow:hidden;
+	visibility:hidden;
+	border:0 none;
+	z-index:7;
+}
+
+.x-grid3-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: text;
+    -khtml-user-select: text;
+    -webkit-user-select:ignore;
+}
+
+/* header styles */
+.x-grid3-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    padding:1px 0 0 0;
+}
+
+.x-grid3-header-pop {
+    border-left:1px solid;
+    float:right;
+    clear:none;
+}
+
+.x-grid3-header-pop-inner {
+    border-left:1px solid;
+    width:14px;
+    height:19px;
+    background: transparent no-repeat center center;
+}
+
+.ext-ie .x-grid3-header-pop-inner {
+    width:15px;
+}
+
+.ext-strict .x-grid3-header-pop-inner {
+    width:14px; 
+}
+
+.x-grid3-header-inner {
+    overflow:hidden;
+    zoom:1;
+    float:left;
+}
+
+.x-grid3-header-offset {
+    padding-left:1px;
+    text-align: left;
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left:1px solid;
+    border-right:1px solid;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background: repeat-x left bottom;
+
+}
+
+.x-grid3-sort-icon{
+	background-repeat: no-repeat;
+	display: none;
+	height: 4px;
+	width: 13px;
+	margin-left:3px;
+	vertical-align: middle;
+}
+
+.sort-asc .x-grid3-sort-icon, .sort-desc .x-grid3-sort-icon {
+	display: inline;
+}
+
+/* Header position fixes for IE strict mode */
+.ext-strict .ext-ie .x-grid3-header-inner, .ext-strict .ext-ie6 .x-grid3-hd {
+    position:relative;
+}
+
+.ext-strict .ext-ie6 .x-grid3-hd-inner{
+    position:static;
+}
+
+/* Body Styles */
+.x-grid3-body {
+	zoom:1;
+}
+
+.x-grid3-scroller {
+	overflow:auto;
+    zoom:1;
+    position:relative;
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	display: block;
+	padding: 3px 5px 3px 5px;
+	-moz-user-select: none;
+	-khtml-user-select: none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-split {
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor: e-resize;
+	cursor: col-resize;
+	display: block;
+	font-size: 1px;
+	height: 16px;
+	overflow: hidden;
+	position: absolute;
+	top: 2px;
+	width: 6px;
+	z-index: 3;
+}
+
+/* Column Reorder DD */
+.x-dd-drag-proxy .x-grid3-hd-inner{
+	background: repeat-x left bottom;
+	width:120px;
+	padding:3px;
+	border:1px solid;
+	overflow:hidden;
+}
+
+.col-move-top, .col-move-bottom{
+	width:9px;
+	height:9px;
+	position:absolute;
+	top:0;
+	line-height:1px;
+	font-size:1px;
+	overflow:hidden;
+	visibility:hidden;
+	z-index:20000;
+    background:transparent no-repeat left top;
+}
+
+/* Selection Styles */
+.x-grid3-row-selected {
+	border:1px dotted;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background: repeat-x 0 bottom !important;
+    vertical-align:middle !important;
+    padding:0;
+    border-top:1px solid;
+    border-bottom:none !important;
+    border-right:1px solid !important;
+    text-align:center;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    padding:0 4px;
+    text-align:center;
+}
+
+/* dirty cells */
+.x-grid3-dirty-cell {
+    background: transparent no-repeat 0 0;
+}
+
+/* Grid Toolbars */
+.x-grid3-topbar, .x-grid3-bottombar{
+    overflow:hidden;
+	display:none;
+	zoom:1;
+    position:relative;
+}
+
+.x-grid3-topbar .x-toolbar{
+	border-right:0 none;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-right:0 none;
+	border-bottom:0 none;
+	border-top:1px solid;
+}
+
+/* Props Grid Styles */
+.x-props-grid .x-grid3-cell{
+	padding:1px;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background:transparent repeat-y -16px !important;
+    padding-left:12px;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    padding:1px;
+    padding-right:0;
+    border:0 none;
+    border-right:1px solid;
+}
+
+/* dd */
+.x-grid3-col-dd {
+    border:0 none;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-dd-drag-ghost .x-grid3-dd-wrap {
+    padding:1px 3px 3px 1px;
+}
+
+.x-grid3-hd {
+    -moz-user-select:none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-grid3-hd-btn {
+    display:none;
+    position:absolute;
+    width:14px;
+    background:no-repeat left center;
+    right:0;
+    top:0;
+    z-index:2;
+	cursor:pointer;
+}
+
+.x-grid3-hd-over .x-grid3-hd-btn, .x-grid3-hd-menu-open .x-grid3-hd-btn {
+    display:block;
+}
+
+a.x-grid3-hd-btn:hover {
+    background-position:-14px center;
+}
+
+/* Expanders */
+.x-grid3-body .x-grid3-td-expander {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-expander .x-grid3-cell-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-expander {
+    width:100%;
+    height:18px;
+    background-position:4px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-expander {
+    background-position:4px 2px;
+}
+
+.x-grid3-row-expanded .x-grid3-row-expander {
+    background-position:-21px 2px;
+}
+
+.x-grid3-row-collapsed .x-grid3-row-body {
+    display:none !important;
+}
+
+.x-grid3-row-expanded .x-grid3-row-body {
+    display:block !important;
+}
+
+/* Checkers */
+.x-grid3-body .x-grid3-td-checker {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-checker .x-grid3-cell-inner, .x-grid3-header .x-grid3-td-checker .x-grid3-hd-inner {
+    padding:0 !important;
+    height:100%;
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    width:100%;
+    height:18px;
+    background-position:2px 2px;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-row .x-grid3-row-checker {
+    background-position:2px 2px;
+}
+
+.x-grid3-row-selected .x-grid3-row-checker, .x-grid3-hd-checker-on .x-grid3-hd-checker,.x-grid3-row-checked .x-grid3-row-checker {
+    background-position:-23px 2px;
+}
+
+.x-grid3-hd-checker {
+    background-position:2px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker {
+    background-position:2px 3px;
+}
+
+.x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 1px;
+}
+
+.ext-border-box .x-grid3-hd-checker-on .x-grid3-hd-checker {
+    background-position:-23px 3px;
+}
+
+/* Numberer */
+.x-grid3-body .x-grid3-td-numberer {
+    background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+    padding:3px 5px 0 0 !important;
+    text-align:right;
+}
+
+/* Row Icon */
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background:transparent repeat-y right;
+    vertical-align:top;
+    text-align:center;
+}
+
+.x-grid3-body .x-grid3-td-row-icon .x-grid3-cell-inner {
+    padding:0 !important;
+    background-position:center center;
+    background-repeat:no-repeat;
+    width:16px;
+    height:16px;
+    margin-left:2px;
+    margin-top:3px;
+}
+
+/* All specials */
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background:transparent repeat-y right;
+}
+
+.x-grid3-body .x-grid3-check-col-td .x-grid3-cell-inner {
+    padding: 1px 0 0 0 !important;
+}
+
+.x-grid3-check-col {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+.x-grid3-check-col-on {
+    width:100%;
+    height:16px;
+    background-position:center center;
+    background-repeat:no-repeat;
+    background-color:transparent;
+}
+
+/* Grouping classes */
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom: 2px solid;
+    cursor:pointer;
+    padding-top:6px;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background:transparent no-repeat 3px 3px;
+    padding:4px 4px 4px 17px;
+}
+
+.x-grid-group-collapsed .x-grid-group-body {
+    display:none;
+}
+
+.ext-ie6 .x-grid3 .x-editor .x-form-text, .ext-ie7 .x-grid3 .x-editor .x-form-text {
+    position:relative;
+    top:-1px;
+}
+
+.ext-ie .x-props-grid .x-editor .x-form-text {
+    position:static;
+    top:0;
+}
+
+.x-grid-empty {
+    padding:10px;
+}
+
+/* fix floating toolbar issue */
+.ext-ie7 .x-grid-panel .x-panel-bbar {
+    position:relative;
+}
+
+
+/* Reset position to static when Grid Panel has been framed */
+/* to resolve 'snapping' from top to bottom behavior. */
+/* @forumThread 86656 */
+.ext-ie7 .x-grid-panel .x-panel-mc .x-panel-bbar {
+    position: static;
+}
+
+.ext-ie6 .x-grid3-header {
+    position: relative;
+}
+
+/* Fix WebKit bug in Grids */
+.ext-webkit .x-grid-panel .x-panel-bwrap{
+    -webkit-user-select:none;
+}
+.ext-webkit .x-tbar-page-number{
+    -webkit-user-select:ignore;
+}
+/* end*/
+
+/* column lines */
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    padding-right:0;
+    border-right:1px solid;
+}
+.x-pivotgrid .x-grid3-header-offset table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-header-offset table td {
+    padding: 4px 3px 4px 5px;
+    text-align: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    line-height: 13px;
+    font-family: tahoma;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    display: block;
+    float: left;
+}
+
+.x-pivotgrid .x-grid3-row-headers table {
+    height: 100%;
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    height: 18px;
+    padding: 2px 7px 0 0;
+    text-align: right;
+    text-overflow: ellipsis;
+    font-size: 11px;
+    font-family: tahoma;
+}
+
+.ext-gecko .x-pivotgrid .x-grid3-row-headers table td {
+    height: 21px;
+}
+
+.x-grid3-header-title {
+    top: 0%;
+    left: 0%;
+    position: absolute;
+    text-align: center;
+    vertical-align: middle;
+    font-family: tahoma;
+    font-size: 11px;
+    padding: auto 1px;
+    display: table-cell;
+}
+
+.x-grid3-header-title span {
+    position: absolute;
+    top: 50%;
+    left: 0%;
+    width: 100%;
+    margin-top: -6px;
+}.x-dd-drag-proxy{
+	position:absolute;
+	left:0;
+    top:0;
+	visibility:hidden;
+	z-index:15000;
+}
+
+.x-dd-drag-ghost{
+	-moz-opacity: 0.85;
+    opacity:.85;
+    filter: alpha(opacity=85);
+    border: 1px solid;
+	padding:3px;
+	padding-left:20px;
+	white-space:nowrap;
+}
+
+.x-dd-drag-repair .x-dd-drag-ghost{
+	-moz-opacity: 0.4;
+    opacity:.4;
+    filter: alpha(opacity=40);
+	border:0 none;
+	padding:0;
+	background-color:transparent;
+}
+
+.x-dd-drag-repair .x-dd-drop-icon{
+	visibility:hidden;
+}
+
+.x-dd-drop-icon{
+    position:absolute;
+	top:3px;
+	left:3px;
+	display:block;
+	width:16px;
+	height:16px;
+	background-color:transparent;
+	background-position: center;
+	background-repeat: no-repeat;
+	z-index:1;
+}
+
+.x-view-selector {
+    position:absolute;
+    left:0;
+    top:0;
+    width:0;
+    border:1px dotted;
+	opacity: .5;
+    -moz-opacity: .5;
+    filter:alpha(opacity=50);
+    zoom:1;
+}.ext-strict .ext-ie .x-tree .x-panel-bwrap{
+    position:relative;
+    overflow:hidden;
+}
+
+.x-tree-icon, .x-tree-ec-icon, .x-tree-elbow-line, .x-tree-elbow, .x-tree-elbow-end, .x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+    background-repeat: no-repeat;
+}
+
+.x-tree-node-collapsed .x-tree-node-icon, .x-tree-node-expanded .x-tree-node-icon, .x-tree-node-leaf .x-tree-node-icon{
+	border: 0 none;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	background-position:center;
+    background-repeat: no-repeat;
+}
+
+.ext-ie .x-tree-node-indent img, .ext-ie .x-tree-node-icon, .ext-ie .x-tree-ec-icon {
+    vertical-align: middle !important;
+}
+
+.ext-strict .ext-ie8 .x-tree-node-indent img, .ext-strict .ext-ie8 .x-tree-node-icon, .ext-strict .ext-ie8 .x-tree-ec-icon {
+    vertical-align: top !important;
+}
+
+/* checkboxes */
+
+input.x-tree-node-cb {
+    margin-left:1px;
+    height: 19px;
+	vertical-align: bottom;
+}
+
+.ext-ie input.x-tree-node-cb {
+    margin-left:0;
+    margin-top: 1px;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb{
+    margin: 1px 1px;
+    height: 14px;
+    vertical-align: bottom;
+}
+
+.ext-strict .ext-ie8 input.x-tree-node-cb + a{
+    vertical-align: bottom;
+}
+
+.ext-opera input.x-tree-node-cb {
+    height: 14px;
+    vertical-align: middle;
+}
+
+.x-tree-noicon .x-tree-node-icon{
+	width:0; height:0;
+}
+
+/* No line styles */
+.x-tree-no-lines .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-no-lines .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+/* Arrows */
+.x-tree-arrows .x-tree-elbow{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background:transparent no-repeat 0 0;
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background:transparent no-repeat -16px 0;
+}
+
+.x-tree-arrows .x-tree-elbow-line{
+	background-color:transparent;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-plus{
+    background-position:-32px 0;
+}
+
+.x-tree-arrows .x-tree-ec-over .x-tree-elbow-end-minus{
+    background-position:-48px 0;
+}
+
+.x-tree-elbow-plus, .x-tree-elbow-minus, .x-tree-elbow-end-plus, .x-tree-elbow-end-minus{
+	cursor:pointer;
+}
+
+.ext-ie ul.x-tree-node-ct{
+    font-size:0;
+    line-height:0;
+    zoom:1;
+}
+
+.x-tree-node{
+	white-space: nowrap;
+}
+
+.x-tree-node-el {
+    line-height:18px;
+    cursor:pointer;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	text-decoration:none;
+	-khtml-user-select:none;
+	-moz-user-select:none;
+    -webkit-user-select:ignore;
+    -kthml-user-focus:normal;
+    -moz-user-focus:normal;
+    -moz-outline: 0 none;
+    outline:0 none;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	text-decoration:none;
+	padding:1px 3px 1px 2px;
+}
+
+.x-tree-node .x-tree-node-disabled .x-tree-node-icon{
+	-moz-opacity: 0.5;
+   opacity:.5;
+   filter: alpha(opacity=50);
+}
+
+.x-tree-node .x-tree-node-inline-icon{
+	background-color:transparent;
+}
+
+.x-tree-node a:hover, .x-dd-drag-ghost a:hover{
+	text-decoration:none;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:1px dotted;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top:1px dotted;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above{
+	 border-top:0 none;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom:2px solid;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top:2px solid;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 border:1px dotted;
+}
+
+.x-dd-drag-ghost .x-tree-node-indent, .x-dd-drag-ghost .x-tree-ec-icon{
+	display:none !important;
+}
+
+/* Fix for ie rootVisible:false issue */
+.x-tree-root-ct {
+    zoom:1;
+}
+.x-date-picker {
+    border: 1px solid;
+    border-top:0 none;
+	position:relative;
+}
+
+.x-date-picker a {
+    -moz-outline:0 none;
+    outline:0 none;
+}
+
+.x-date-inner, .x-date-inner td, .x-date-inner th{
+    border-collapse:separate;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background: repeat-x 0 -83px;
+	overflow:hidden;
+}
+
+.x-date-middle .x-btn-tc,.x-date-middle .x-btn-tl,.x-date-middle .x-btn-tr,
+.x-date-middle .x-btn-mc,.x-date-middle .x-btn-ml,.x-date-middle .x-btn-mr,
+.x-date-middle .x-btn-bc,.x-date-middle .x-btn-bl,.x-date-middle .x-btn-br{
+	background:transparent !important;
+    vertical-align:middle;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background:transparent no-repeat right 0;
+}
+
+.x-date-right, .x-date-left {
+    width:18px;
+}
+
+.x-date-right{
+    text-align:right;
+}
+
+.x-date-middle {
+    padding-top:2px;
+    padding-bottom:2px;
+    width:130px; /* FF3 */
+}
+
+.x-date-right a, .x-date-left a{
+    display:block;
+    width:16px;
+	height:16px;
+	background-position: center;
+	background-repeat: no-repeat;
+	cursor:pointer;
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a:hover, .x-date-left a:hover{
+    -moz-opacity: 1;
+    opacity:1;
+    filter: alpha(opacity=100);
+}
+
+.x-item-disabled .x-date-right a:hover, .x-item-disabled .x-date-left a:hover{
+    -moz-opacity: 0.6;
+    opacity:.6;
+    filter: alpha(opacity=60);
+}
+
+.x-date-right a {
+    margin-right:2px;
+    text-decoration:none !important;
+}
+
+.x-date-left a{
+    margin-left:2px;
+    text-decoration:none !important;
+}
+
+table.x-date-inner {
+    width: 100%;
+    table-layout:fixed;
+}
+
+.ext-webkit table.x-date-inner{
+    /* Fix for webkit browsers */
+    width: 175px;
+}
+
+
+.x-date-inner th {
+    width:25px;
+}
+
+.x-date-inner th {
+    background: repeat-x left top;
+    text-align:right !important;
+	border-bottom: 1px solid;
+	cursor:default;
+    padding:0;
+    border-collapse:separate;
+}
+
+.x-date-inner th span {
+    display:block;
+    padding:2px;
+    padding-right:7px;
+}
+
+.x-date-inner td {
+    border: 1px solid;
+	text-align:right;
+    padding:0;
+}
+
+.x-date-inner a {
+    padding:2px 5px;
+    display:block;
+	text-decoration:none;
+    text-align:right;
+    zoom:1;
+}
+
+.x-date-inner .x-date-active{
+	cursor:pointer;
+	color:black;
+}
+
+.x-date-inner .x-date-selected a{
+	background: repeat-x left top;
+	border:1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-today a{
+	border: 1px solid;
+    padding:1px 4px;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+    text-decoration:none !important;
+}
+
+.x-date-bottom {
+    padding:4px;
+    border-top: 1px solid;
+    background: repeat-x left top;
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    text-decoration:none !important;
+}
+
+.x-item-disabled .x-date-inner a:hover{
+    background: none;
+}
+
+.x-date-inner .x-date-disabled a {
+	cursor:default;
+}
+
+.x-date-menu .x-menu-item {
+	padding:1px 24px 1px 4px;
+	white-space: nowrap;
+}
+
+.x-date-menu .x-menu-item .x-menu-item-icon {
+    width:10px;
+    height:10px;
+    margin-right:5px;
+    background-position:center -4px !important;
+}
+
+.x-date-mp {
+	position:absolute;
+	left:0;
+	top:0;
+	display:none;
+}
+
+.x-date-mp td {
+    padding:2px;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+td.x-date-mp-month,td.x-date-mp-year,td.x-date-mp-ybtn {
+    border: 0 none;
+	text-align:center;
+	vertical-align: middle;
+	width:25%;
+}
+
+.x-date-mp-ok {
+	margin-right:3px;
+}
+
+.x-date-mp-btns button {
+	text-decoration:none;
+	text-align:center;
+	text-decoration:none !important;
+	border:1px solid;
+	padding:1px 3px 1px;
+	cursor:pointer;
+}
+
+.x-date-mp-btns {
+	background: repeat-x left top;
+}
+
+.x-date-mp-btns td {
+	border-top: 1px solid;
+    text-align:center;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	display:block;
+	padding:2px 4px;
+	text-decoration:none;
+	text-align:center;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	text-decoration:none;
+	cursor:pointer;
+}
+
+td.x-date-mp-sel a {
+	padding:1px 3px;
+	background: repeat-x left top;
+	border:1px solid;
+}
+
+.x-date-mp-ybtn a {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    cursor:pointer;
+    background:transparent no-repeat;
+    display:block;
+    margin:0 auto;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next {
+    background-position:0 -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-next:hover {
+    background-position:-15px -120px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev {
+    background-position:0 -105px;
+}
+
+.x-date-mp-ybtn a.x-date-mp-prev:hover {
+    background-position:-15px -105px;
+}
+
+.x-date-mp-ybtn {
+   text-align:center;
+}
+
+td.x-date-mp-sep {
+   border-right:1px solid;
+}.x-tip{
+	position: absolute;
+	top: 0;
+    left:0;
+    visibility: hidden;
+	z-index: 20002;
+    border:0 none;
+}
+
+.x-tip .x-tip-close{
+	height: 15px;
+	float:right;
+	width: 15px;
+    margin:0 0 2px 2px;
+    cursor:pointer;
+    display:none;
+}
+
+.x-tip .x-tip-tc {
+	background: transparent no-repeat 0 -62px;
+	padding-top:3px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tip .x-tip-bc {
+	background: transparent no-repeat 0 -121px;
+	height:3px;
+    overflow:hidden;
+}
+
+.x-tip .x-tip-bl {
+	background: transparent no-repeat 0 -59px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-br {
+	background: transparent no-repeat right -59px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mc {
+    border:0 none;
+}
+
+.x-tip .x-tip-ml {
+	background: no-repeat 0 -124px;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-tip .x-tip-mr {
+	background: transparent no-repeat right -124px;
+	padding-right:6px;
+    zoom:1;
+}
+
+.ext-ie .x-tip .x-tip-header,.ext-ie .x-tip .x-tip-tc {
+    font-size:0;
+    line-height:0;
+}
+
+.ext-border-box .x-tip .x-tip-header, .ext-border-box .x-tip .x-tip-tc{
+    line-height: 1px;
+}
+
+.x-tip .x-tip-header-text {
+    padding:0;
+    margin:0 0 2px 0;
+}
+
+.x-tip .x-tip-body {
+    margin:0 !important;
+    line-height:14px;
+    padding:0;
+}
+
+.x-tip .x-tip-body .loading-indicator {
+    margin:0;
+}
+
+.x-tip-draggable .x-tip-header,.x-tip-draggable .x-tip-header-text {
+    cursor:move;
+}
+
+.x-form-invalid-tip .x-tip-tc {
+	background: repeat-x 0 -12px;
+    padding-top:6px;
+}
+
+.x-form-invalid-tip .x-tip-bc {
+	background: repeat-x 0 -18px;
+    height:6px;
+}
+
+.x-form-invalid-tip .x-tip-bl {
+	background: no-repeat 0 -6px;
+}
+
+.x-form-invalid-tip .x-tip-br {
+	background: no-repeat right -6px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding:2px;
+}
+
+.x-form-invalid-tip .x-tip-body {
+    padding-left:24px;
+    background:transparent no-repeat 2px 2px;
+}
+
+.x-tip-anchor {
+    position: absolute;
+    width: 9px;
+    height: 10px;
+    overflow:hidden;
+    background: transparent no-repeat 0 0;
+    zoom:1;
+}
+.x-tip-anchor-bottom {
+    background-position: -9px 0;
+}
+.x-tip-anchor-right {
+    background-position: -18px 0;
+    width: 10px;
+}
+.x-tip-anchor-left {
+    background-position: -28px 0;
+    width: 10px;
+}.x-menu {
+	z-index: 15000;
+	zoom: 1;
+	background: repeat-y;
+}
+
+.x-menu-floating{
+    border: 1px solid;
+}
+
+.x-menu a {
+    text-decoration: none !important;
+}
+
+.ext-ie .x-menu {
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-menu-list{
+    padding: 2px;
+	background-color:transparent;
+	border:0 none;
+    overflow:hidden;
+    overflow-y: hidden;
+}
+
+.ext-strict .ext-ie .x-menu-list{
+    position: relative;
+}
+
+.x-menu li{
+	line-height:100%;
+}
+
+.x-menu li.x-menu-sep-li{
+	font-size:1px;
+	line-height:1px;
+}
+
+.x-menu-list-item{
+    white-space: nowrap;
+	display:block;
+	padding:1px;
+}
+
+.x-menu-item{
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+}
+
+.x-menu-item-arrow{
+	background:transparent no-repeat right;
+}
+
+.x-menu-sep {
+	display:block;
+	font-size:1px;
+	line-height:1px;
+	margin: 2px 3px;
+	border-bottom:1px solid;
+    overflow:hidden;
+}
+
+.x-menu-focus {
+	position:absolute;
+	left:-1px;
+	top:-1px;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+    overflow:hidden;
+    display:block;
+}
+
+a.x-menu-item {
+    cursor: pointer;
+    display: block;
+    line-height: 16px;
+    outline-color: -moz-use-text-color;
+    outline-style: none;
+    outline-width: 0;
+    padding: 3px 21px 3px 27px;
+    position: relative;
+    text-decoration: none;
+    white-space: nowrap;
+}
+
+.x-menu-item-active {
+    background-repeat: repeat-x;
+    background-position: left bottom;
+    border-style:solid;
+    border-width: 1px 0;
+    margin:0 1px;
+	padding: 0;
+}
+
+.x-menu-item-active a.x-menu-item {
+    border-style:solid;
+    border-width:0 1px;
+    margin:0 -1px;
+}
+
+.x-menu-item-icon {
+	border: 0 none;
+	height: 16px;
+	padding: 0;
+	vertical-align: top;
+	width: 16px;
+	position: absolute;
+    left: 3px;
+    top: 3px;
+    margin: 0;
+    background-position:center;
+}
+
+.ext-ie .x-menu-item-icon {
+    left: -24px;
+}
+.ext-strict .x-menu-item-icon {
+    left: 3px;
+}
+
+.ext-ie6 .x-menu-item-icon {
+    left: -24px;
+}
+
+.ext-ie .x-menu-item-icon {
+    vertical-align: middle;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background: transparent no-repeat center;
+}
+
+.x-menu-group-item .x-menu-item-icon{
+	background-color: transparent;
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background: transparent no-repeat center;
+}
+
+.x-date-menu .x-menu-list{
+    padding: 0;
+}
+
+.x-menu-date-item{
+	padding:0;
+}
+
+.x-menu .x-color-palette, .x-menu .x-date-picker{
+    margin-left: 26px;
+	margin-right:4px;
+}
+
+.x-menu .x-date-picker{
+    border:1px solid;
+    margin-top:2px;
+    margin-bottom:2px;
+}
+
+.x-menu-plain .x-color-palette, .x-menu-plain .x-date-picker{
+	 margin: 0;
+	 border: 0 none;
+}
+
+.x-date-menu {
+   padding:0 !important;
+}
+
+/*
+ * fixes separator visibility problem in IE 6
+ */
+.ext-strict .ext-ie6 .x-menu-sep-li {
+    padding: 3px 4px;
+}
+.ext-strict .ext-ie6 .x-menu-sep {
+    margin: 0;
+    height: 1px;
+}
+
+/*
+ * Fixes an issue with "fat" separators in webkit
+ */
+.ext-webkit .x-menu-sep{
+    height: 1px;
+}
+
+/*
+ * Ugly mess to remove the white border under the picker
+ */
+.ext-ie .x-date-menu{
+    height: 199px;
+}
+
+.ext-strict .ext-ie .x-date-menu, .ext-border-box .ext-ie8 .x-date-menu{
+    height: 197px;
+}
+
+.ext-strict .ext-ie7 .x-date-menu{
+    height: 195px;
+}
+
+.ext-strict .ext-ie8 .x-date-menu{
+    height: auto;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border:1px dotted !important;
+	padding:0;
+}
+
+.x-menu .x-menu-scroller {
+    width: 100%;
+	background-repeat:no-repeat;
+	background-position:center;
+	height:8px;
+    line-height: 8px;
+	cursor:pointer;
+    margin: 0;
+    padding: 0;
+}
+
+.x-menu .x-menu-scroller-active{
+    height: 6px;
+    line-height: 6px;
+}
+
+.x-menu-list-item-indent{
+    padding-left: 27px;
+}/*
+ Creates rounded, raised boxes like on the Ext website - the markup isn't pretty:
+  <div class="x-box-blue">
+        <div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
+        <div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
+            <h3>YOUR TITLE HERE (optional)</h3>
+            <div>YOUR CONTENT HERE</div>
+        </div></div></div>
+        <div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
+    </div>
+ */
+
+.x-box-tl {
+	background: transparent no-repeat 0 0;
+    zoom:1;
+}
+
+.x-box-tc {
+	height: 8px;
+	background: transparent repeat-x 0 0;
+	overflow: hidden;
+}
+
+.x-box-tr {
+	background: transparent no-repeat right -8px;
+}
+
+.x-box-ml {
+	background: transparent repeat-y 0;
+	padding-left: 4px;
+	overflow: hidden;
+    zoom:1;
+}
+
+.x-box-mc {
+	background: repeat-x 0 -16px;
+	padding: 4px 10px;
+}
+
+.x-box-mc h3 {
+	margin: 0 0 4px 0;
+    zoom:1;
+}
+
+.x-box-mr {
+	background: transparent repeat-y right;
+	padding-right: 4px;
+	overflow: hidden;
+}
+
+.x-box-bl {
+	background: transparent no-repeat 0 -16px;
+    zoom:1;
+}
+
+.x-box-bc {
+	background: transparent repeat-x 0 -8px;
+	height: 8px;
+	overflow: hidden;
+}
+
+.x-box-br {
+	background: transparent no-repeat right -24px;
+}
+
+.x-box-tl, .x-box-bl {
+	padding-left: 8px;
+	overflow: hidden;
+}
+
+.x-box-tr, .x-box-br {
+	padding-right: 8px;
+	overflow: hidden;
+}.x-combo-list {
+    border:1px solid;
+    zoom:1;
+    overflow:hidden;
+}
+
+.x-combo-list-inner {
+    overflow:auto;
+    position:relative; /* for calculating scroll offsets */
+    zoom:1;
+    overflow-x:hidden;
+}
+
+.x-combo-list-hd {
+    border-bottom:1px solid;
+    padding:3px;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom:1px solid;
+}
+
+.x-combo-list-item {
+    padding:2px;
+    border:1px solid;
+    white-space: nowrap;
+    overflow:hidden;
+    text-overflow: ellipsis;
+}
+
+.x-combo-list .x-combo-selected{
+	border:1px dotted !important;
+    cursor:pointer;
+}
+
+.x-combo-list .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}.x-panel {
+    border-style: solid;
+    border-width:0;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+    padding:5px 3px 4px 5px;
+    border:1px solid;
+    line-height: 15px;
+    background: transparent repeat-x 0 -1px;
+}
+
+.x-panel-body {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    position: relative; /* added for item scroll positioning */
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border:1px solid;
+    border-top:0 none;
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom: 0 none;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top:1px solid;
+}
+
+.x-panel-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-tl .x-panel-header {
+    padding:5px 0 4px 0;
+    border:0 none;
+    background:transparent no-repeat;
+}
+
+.x-panel-tl .x-panel-icon, .x-window-tl .x-panel-icon {
+    padding-left:20px !important;
+    background-repeat:no-repeat;
+    background-position:0 4px;
+    zoom:1;
+}
+
+.x-panel-inline-icon {
+    width:16px;
+	height:16px;
+    background-repeat:no-repeat;
+    background-position:0 0;
+	vertical-align:middle;
+	margin-right:4px;
+	margin-top:-1px;
+	margin-bottom:-1px;
+}
+
+.x-panel-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+}
+
+/* fix ie7 strict mode bug */
+.ext-strict .ext-ie7 .x-panel-tc {
+    overflow: visible;
+}
+
+.x-panel-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    border-bottom:1px solid;
+}
+
+.x-panel-tr {
+	background: transparent no-repeat right 0;
+	zoom:1;
+    padding-right:6px;
+}
+
+.x-panel-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    zoom:1;
+}
+
+.x-panel-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-mc {
+    border:0 none;
+    padding:0;
+    margin:0;
+    padding-top:6px;
+}
+
+.x-panel-mc .x-panel-body {
+    background-color:transparent;
+    border: 0 none;
+}
+
+.x-panel-ml {
+	background: repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-panel-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-panel-bc .x-panel-footer {
+    padding-bottom:6px;
+}
+
+.x-panel-nofooter .x-panel-bc, .x-panel-nofooter .x-window-bc {
+	height:6px;
+    font-size:0;
+    line-height:0;
+}
+
+.x-panel-bwrap {
+    overflow:hidden;
+    zoom:1;
+    left:0;
+    top:0;
+}
+.x-panel-body {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-panel-collapsed .x-resizable-handle{
+    display:none;
+}
+
+.ext-gecko .x-panel-animated div {
+    overflow:hidden !important;
+}
+
+/* Plain */
+.x-plain-body {
+    overflow:hidden;
+}
+
+.x-plain-bbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-tbar .x-toolbar {
+    overflow:hidden;
+    padding:2px;
+}
+
+.x-plain-bwrap {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-plain {
+    overflow:hidden;
+}
+
+/* Tools */
+.x-tool {
+    overflow:hidden;
+    width:15px;
+    height:15px;
+    float:right;
+    cursor:pointer;
+    background:transparent no-repeat;
+    margin-left:2px;
+}
+
+/* expand / collapse tools */
+.x-tool-toggle {
+    background-position:0 -60px;
+}
+
+.x-tool-toggle-over {
+    background-position:-15px -60px;
+}
+
+.x-panel-collapsed .x-tool-toggle {
+    background-position:0 -75px;
+}
+
+.x-panel-collapsed .x-tool-toggle-over {
+    background-position:-15px -75px;
+}
+
+
+.x-tool-close {
+    background-position:0 -0;
+}
+
+.x-tool-close-over {
+    background-position:-15px 0;
+}
+
+.x-tool-minimize {
+    background-position:0 -15px;
+}
+
+.x-tool-minimize-over {
+    background-position:-15px -15px;
+}
+
+.x-tool-maximize {
+    background-position:0 -30px;
+}
+
+.x-tool-maximize-over {
+    background-position:-15px -30px;
+}
+
+.x-tool-restore {
+    background-position:0 -45px;
+}
+
+.x-tool-restore-over {
+    background-position:-15px -45px;
+}
+
+.x-tool-gear {
+    background-position:0 -90px;
+}
+
+.x-tool-gear-over {
+    background-position:-15px -90px;
+}
+
+.x-tool-prev {
+    background-position:0 -105px;
+}
+
+.x-tool-prev-over {
+    background-position:-15px -105px;
+}
+
+.x-tool-next {
+    background-position:0 -120px;
+}
+
+.x-tool-next-over {
+    background-position:-15px -120px;
+}
+
+.x-tool-pin {
+    background-position:0 -135px;
+}
+
+.x-tool-pin-over {
+    background-position:-15px -135px;
+}
+
+.x-tool-unpin {
+    background-position:0 -150px;
+}
+
+.x-tool-unpin-over {
+    background-position:-15px -150px;
+}
+
+.x-tool-right {
+    background-position:0 -165px;
+}
+
+.x-tool-right-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-left {
+    background-position:0 -180px;
+}
+
+.x-tool-left-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-down {
+    background-position:0 -195px;
+}
+
+.x-tool-down-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-up {
+    background-position:0 -210px;
+}
+
+.x-tool-up-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-refresh {
+    background-position:0 -225px;
+}
+
+.x-tool-refresh-over {
+    background-position:-15px -225px;
+}
+
+.x-tool-plus {
+    background-position:0 -240px;
+}
+
+.x-tool-plus-over {
+    background-position:-15px -240px;
+}
+
+.x-tool-minus {
+    background-position:0 -255px;
+}
+
+.x-tool-minus-over {
+    background-position:-15px -255px;
+}
+
+.x-tool-search {
+    background-position:0 -270px;
+}
+
+.x-tool-search-over {
+    background-position:-15px -270px;
+}
+
+.x-tool-save {
+    background-position:0 -285px;
+}
+
+.x-tool-save-over {
+    background-position:-15px -285px;
+}
+
+.x-tool-help {
+    background-position:0 -300px;
+}
+
+.x-tool-help-over {
+    background-position:-15px -300px;
+}
+
+.x-tool-print {
+    background-position:0 -315px;
+}
+
+.x-tool-print-over {
+    background-position:-15px -315px;
+}
+
+.x-tool-expand {
+    background-position:0 -330px;
+}
+
+.x-tool-expand-over {
+    background-position:-15px -330px;
+}
+
+.x-tool-collapse {
+    background-position:0 -345px;
+}
+
+.x-tool-collapse-over {
+    background-position:-15px -345px;
+}
+
+.x-tool-resize {
+    background-position:0 -360px;
+}
+
+.x-tool-resize-over {
+    background-position:-15px -360px;
+}
+
+.x-tool-move {
+    background-position:0 -375px;
+}
+
+.x-tool-move-over {
+    background-position:-15px -375px;
+}
+
+/* Ghosting */
+.x-panel-ghost {
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    opacity:.65;
+    -moz-opacity:.65;
+    filter:alpha(opacity=65);
+}
+
+.x-panel-ghost ul {
+    margin:0;
+    padding:0;
+    overflow:hidden;
+    font-size:0;
+    line-height:0;
+    border:1px solid;
+    border-top:0 none;
+    display:block;
+}
+
+.x-panel-ghost * {
+    cursor:move !important;
+}
+
+.x-panel-dd-spacer {
+    border:2px dashed;
+}
+
+/* Buttons */
+.x-panel-btns {
+    padding:5px;
+    overflow:hidden;
+}
+
+.x-panel-btns td.x-toolbar-cell{
+	padding:3px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-left{
+	background-position:0 -147px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-right{
+	background-position:0 -168px;
+}
+
+.x-panel-btns .x-btn-focus .x-btn-center{
+	background-position:0 -189px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-over .x-btn-center{
+	background-position:0 -105px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-center{
+	background-position:0 -126px;
+}
+
+.x-panel-btns .x-btn-click  .x-btn-right{
+	background-position:0 -84px;
+}
+
+.x-panel-btns .x-btn-click .x-btn-left{
+	background-position:0 -63px;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+	white-space: nowrap;
+}
+/**
+ * W3C Suggested Default style sheet for HTML 4
+ * http://www.w3.org/TR/CSS21/sample.html
+ *
+ * Resets for Ext.Panel @cfg normal: true
+ */
+.x-panel-reset .x-panel-body html,
+.x-panel-reset .x-panel-body address,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body body,
+.x-panel-reset .x-panel-body dd,
+.x-panel-reset .x-panel-body div,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dt,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body frame, frameset,
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body noframes,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body center,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body hr,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body pre 			  { display: block }
+.x-panel-reset .x-panel-body li              { display: list-item }
+.x-panel-reset .x-panel-body head            { display: none }
+.x-panel-reset .x-panel-body table           { display: table }
+.x-panel-reset .x-panel-body tr              { display: table-row }
+.x-panel-reset .x-panel-body thead           { display: table-header-group }
+.x-panel-reset .x-panel-body tbody           { display: table-row-group }
+.x-panel-reset .x-panel-body tfoot           { display: table-footer-group }
+.x-panel-reset .x-panel-body col             { display: table-column }
+.x-panel-reset .x-panel-body colgroup        { display: table-column-group }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th 	          { display: table-cell }
+.x-panel-reset .x-panel-body caption         { display: table-caption }
+.x-panel-reset .x-panel-body th              { font-weight: bolder; text-align: center }
+.x-panel-reset .x-panel-body caption         { text-align: center }
+.x-panel-reset .x-panel-body body            { margin: 8px }
+.x-panel-reset .x-panel-body h1              { font-size: 2em; margin: .67em 0 }
+.x-panel-reset .x-panel-body h2              { font-size: 1.5em; margin: .75em 0 }
+.x-panel-reset .x-panel-body h3              { font-size: 1.17em; margin: .83em 0 }
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body p,
+.x-panel-reset .x-panel-body blockquote,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body fieldset,
+.x-panel-reset .x-panel-body form,
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body dl,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu            { margin: 1.12em 0 }
+.x-panel-reset .x-panel-body h5              { font-size: .83em; margin: 1.5em 0 }
+.x-panel-reset .x-panel-body h6              { font-size: .75em; margin: 1.67em 0 }
+.x-panel-reset .x-panel-body h1,
+.x-panel-reset .x-panel-body h2,
+.x-panel-reset .x-panel-body h3,
+.x-panel-reset .x-panel-body h4,
+.x-panel-reset .x-panel-body h5,
+.x-panel-reset .x-panel-body h6,
+.x-panel-reset .x-panel-body b,
+.x-panel-reset .x-panel-body strong          { font-weight: bolder }
+.x-panel-reset .x-panel-body blockquote      { margin-left: 40px; margin-right: 40px }
+.x-panel-reset .x-panel-body i,
+.x-panel-reset .x-panel-body cite,
+.x-panel-reset .x-panel-body em,
+.x-panel-reset .x-panel-body var,
+.x-panel-reset .x-panel-body address    	  { font-style: italic }
+.x-panel-reset .x-panel-body pre,
+.x-panel-reset .x-panel-body tt,
+.x-panel-reset .x-panel-body code,
+.x-panel-reset .x-panel-body kbd,
+.x-panel-reset .x-panel-body samp       	  { font-family: monospace }
+.x-panel-reset .x-panel-body pre             { white-space: pre }
+.x-panel-reset .x-panel-body button,
+.x-panel-reset .x-panel-body textarea,
+.x-panel-reset .x-panel-body input,
+.x-panel-reset .x-panel-body select   		  { display: inline-block }
+.x-panel-reset .x-panel-body big             { font-size: 1.17em }
+.x-panel-reset .x-panel-body small,
+.x-panel-reset .x-panel-body sub,
+.x-panel-reset .x-panel-body sup 			  { font-size: .83em }
+.x-panel-reset .x-panel-body sub             { vertical-align: sub }
+.x-panel-reset .x-panel-body sup             { vertical-align: super }
+.x-panel-reset .x-panel-body table           { border-spacing: 2px; }
+.x-panel-reset .x-panel-body thead,
+.x-panel-reset .x-panel-body tbody,
+.x-panel-reset .x-panel-body tfoot           { vertical-align: middle }
+.x-panel-reset .x-panel-body td,
+.x-panel-reset .x-panel-body th          	  { vertical-align: inherit }
+.x-panel-reset .x-panel-body s,
+.x-panel-reset .x-panel-body strike,
+.x-panel-reset .x-panel-body del  			  { text-decoration: line-through }
+.x-panel-reset .x-panel-body hr              { border: 1px inset }
+.x-panel-reset .x-panel-body ol,
+.x-panel-reset .x-panel-body ul,
+.x-panel-reset .x-panel-body dir,
+.x-panel-reset .x-panel-body menu,
+.x-panel-reset .x-panel-body dd        	  { margin-left: 40px }
+.x-panel-reset .x-panel-body ul, .x-panel-reset .x-panel-body menu, .x-panel-reset .x-panel-body dir { list-style-type: disc;}
+.x-panel-reset .x-panel-body ol              { list-style-type: decimal }
+.x-panel-reset .x-panel-body ol ul,
+.x-panel-reset .x-panel-body ul ol,
+.x-panel-reset .x-panel-body ul ul,
+.x-panel-reset .x-panel-body ol ol    		  { margin-top: 0; margin-bottom: 0 }
+.x-panel-reset .x-panel-body u,
+.x-panel-reset .x-panel-body ins          	  { text-decoration: underline }
+.x-panel-reset .x-panel-body br:before       { content: "\A" }
+.x-panel-reset .x-panel-body :before, .x-panel-reset .x-panel-body :after { white-space: pre-line }
+.x-panel-reset .x-panel-body center          { text-align: center }
+.x-panel-reset .x-panel-body :link, .x-panel-reset .x-panel-body :visited { text-decoration: underline }
+.x-panel-reset .x-panel-body :focus          { outline: invert dotted thin }
+
+/* Begin bidirectionality settings (do not change) */
+.x-panel-reset .x-panel-body BDO[DIR="ltr"]  { direction: ltr; unicode-bidi: bidi-override }
+.x-panel-reset .x-panel-body BDO[DIR="rtl"]  { direction: rtl; unicode-bidi: bidi-override }
+.x-window {
+    zoom:1;
+}
+
+.x-window .x-window-handle {
+    opacity:0;
+    -moz-opacity:0;
+    filter:alpha(opacity=0);
+}
+
+.x-window-proxy {
+    border:1px solid;
+    z-index:12000;
+    overflow:hidden;
+    position:absolute;
+    left:0;top:0;
+    display:none;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-window-header {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-window-bwrap {
+    z-index:1;
+    position:relative;
+    zoom:1;
+    left:0;top:0;
+}
+
+.x-window-tl .x-window-header {
+    padding:5px 0 4px 0;
+}
+
+.x-window-header-text {
+    cursor:pointer;
+}
+
+.x-window-tc {
+	background: transparent repeat-x 0 0;
+	overflow:hidden;
+    zoom:1;
+}
+
+.x-window-tl {
+	background: transparent no-repeat 0 0;
+	padding-left:6px;
+    zoom:1;
+    z-index:1;
+    position:relative;
+}
+
+.x-window-tr {
+	background: transparent no-repeat right 0;
+	padding-right:6px;
+}
+
+.x-window-bc {
+	background: transparent repeat-x 0 bottom;
+    zoom:1;
+}
+
+.x-window-bc .x-window-footer {
+    padding-bottom:6px;
+    zoom:1;
+    font-size:0;
+    line-height:0;
+}
+
+.x-window-bl {
+	background: transparent no-repeat 0 bottom;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-br {
+	background: transparent no-repeat right bottom;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-mc {
+    border:1px solid;
+    padding:0;
+    margin:0;
+}
+
+.x-window-ml {
+	background: transparent repeat-y 0 0;
+	padding-left:6px;
+    zoom:1;
+}
+
+.x-window-mr {
+	background: transparent repeat-y right 0;
+	padding-right:6px;
+    zoom:1;
+}
+
+.x-window-body {
+    overflow:hidden;
+}
+
+.x-window-bwrap {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-bl, .x-window-maximized .x-window-br,
+    .x-window-maximized .x-window-ml, .x-window-maximized .x-window-mr,
+    .x-window-maximized .x-window-tl, .x-window-maximized .x-window-tr {
+    padding:0;
+}
+
+.x-window-maximized .x-window-footer {
+    padding-bottom:0;
+}
+
+.x-window-maximized .x-window-tc {
+    padding-left:3px;
+    padding-right:3px;
+}
+
+.x-window-maximized .x-window-mc {
+    border-left:0 none;
+    border-right:0 none;
+}
+
+.x-window-tbar .x-toolbar, .x-window-bbar .x-toolbar {
+    border-left:0 none;
+    border-right: 0 none;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top:1px solid;
+    border-bottom:0 none;
+}
+
+.x-window-draggable, .x-window-draggable .x-window-header-text {
+    cursor:move;
+}
+
+.x-window-maximized .x-window-draggable, .x-window-maximized .x-window-draggable .x-window-header-text {
+    cursor:default;
+}
+
+.x-window-body {
+    background-color:transparent;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom:1px solid;
+}
+
+.x-window-maximized-ct {
+    overflow:hidden;
+}
+
+.x-window-maximized .x-window-handle {
+    display:none;
+}
+
+.x-window-sizing-ghost ul {
+    border:0 none !important;
+}
+
+.x-dlg-focus{
+	-moz-outline:0 none;
+	outline:0 none;
+	width:0;
+	height:0;
+	overflow:hidden;
+	position:absolute;
+	top:0;
+	left:0;
+}
+
+.ext-webkit .x-dlg-focus{
+    width: 1px;
+    height: 1px;
+}
+
+.x-dlg-mask{
+    z-index:10000;
+    display:none;
+    position:absolute;
+    top:0;
+    left:0;
+    -moz-opacity: 0.5;
+    opacity:.50;
+    filter: alpha(opacity=50);
+}
+
+body.ext-ie6.x-body-masked select {
+	visibility:hidden;
+}
+
+body.ext-ie6.x-body-masked .x-window select {
+	visibility:visible;
+}
+
+.x-window-plain .x-window-mc {
+    border: 1px solid;
+}
+
+.x-window-plain .x-window-body {
+    border: 1px solid;
+    background:transparent !important;
+}.x-html-editor-wrap {
+    border:1px solid;
+}
+
+.x-html-editor-tb .x-btn-text {
+    background:transparent no-repeat;
+}
+
+.x-html-editor-tb .x-edit-bold, .x-menu-item img.x-edit-bold {
+    background-position:0 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);    
+}
+
+.x-html-editor-tb .x-edit-italic, .x-menu-item img.x-edit-italic {
+    background-position:-16px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-underline, .x-menu-item img.x-edit-underline {
+    background-position:-32px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-forecolor, .x-menu-item img.x-edit-forecolor {
+    background-position:-160px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-backcolor, .x-menu-item img.x-edit-backcolor {
+    background-position:-176px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyleft, .x-menu-item img.x-edit-justifyleft {
+    background-position:-112px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifycenter, .x-menu-item img.x-edit-justifycenter {
+    background-position:-128px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-justifyright, .x-menu-item img.x-edit-justifyright {
+    background-position:-144px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertorderedlist, .x-menu-item img.x-edit-insertorderedlist {
+    background-position:-80px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-insertunorderedlist, .x-menu-item img.x-edit-insertunorderedlist {
+    background-position:-96px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-increasefontsize, .x-menu-item img.x-edit-increasefontsize {
+    background-position:-48px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-decreasefontsize, .x-menu-item img.x-edit-decreasefontsize {
+    background-position:-64px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-sourceedit, .x-menu-item img.x-edit-sourceedit {
+    background-position:-192px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tb .x-edit-createlink, .x-menu-item img.x-edit-createlink {
+    background-position:-208px 0;
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}
+
+.x-html-editor-tip .x-tip-bd .x-tip-bd-inner {
+    padding:5px;
+    padding-bottom:1px;
+}
+
+.x-html-editor-tb .x-toolbar {
+    position:static !important;
+}.x-panel-noborder .x-panel-body-noborder {
+    border-width:0;
+}
+
+.x-panel-noborder .x-panel-header-noborder {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-width:1px 0 0 0;
+    border-style:solid;
+}
+
+.x-window-noborder .x-window-mc {
+    border-width:0;
+}
+
+.x-window-plain .x-window-body-noborder {
+    border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-body-noborder {
+	border-width:0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-header-noborder {
+    border-width: 0 0 1px 0;
+}
+
+.x-tab-panel-noborder .x-tab-panel-footer-noborder {
+    border-width: 1px 0 0 0;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-width: 1px 0 0 0;
+    border-style:solid;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-width:0 0 1px;
+    border-style:solid;
+}.x-border-layout-ct {
+    position: relative;
+}
+
+.x-border-panel {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-tool-collapse-south {
+    background-position:0 -195px;
+}
+
+.x-tool-collapse-south-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-collapse-north {
+    background-position:0 -210px;
+}
+
+.x-tool-collapse-north-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-collapse-west {
+    background-position:0 -180px;
+}
+
+.x-tool-collapse-west-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-collapse-east {
+    background-position:0 -165px;
+}
+
+.x-tool-collapse-east-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-south {
+    background-position:0 -210px;
+}
+
+.x-tool-expand-south-over {
+    background-position:-15px -210px;
+}
+
+.x-tool-expand-north {
+    background-position:0 -195px;
+}
+.x-tool-expand-north-over {
+    background-position:-15px -195px;
+}
+
+.x-tool-expand-west {
+    background-position:0 -165px;
+}
+
+.x-tool-expand-west-over {
+    background-position:-15px -165px;
+}
+
+.x-tool-expand-east {
+    background-position:0 -180px;
+}
+
+.x-tool-expand-east-over {
+    background-position:-15px -180px;
+}
+
+.x-tool-expand-north, .x-tool-expand-south {
+    float:right;
+    margin:3px;
+}
+
+.x-tool-expand-east, .x-tool-expand-west {
+    float:none;
+    margin:3px 2px;
+}
+
+.x-accordion-hd .x-tool-toggle {
+    background-position:0 -255px;
+}
+
+.x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -255px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle {
+    background-position:0 -240px;
+}
+
+.x-panel-collapsed .x-accordion-hd .x-tool-toggle-over {
+    background-position:-15px -240px;
+}
+
+.x-accordion-hd {
+	padding-top:4px;
+	padding-bottom:3px;
+	border-top:0 none;
+    background: transparent repeat-x 0 -9px;
+}
+
+.x-layout-collapsed{
+    position:absolute;
+    left:-10000px;
+    top:-10000px;
+    visibility:hidden;
+    width:20px;
+    height:20px;
+    overflow:hidden;
+	border:1px solid;
+	z-index:20;
+}
+
+.ext-border-box .x-layout-collapsed{
+    width:22px;
+    height:22px;
+}
+
+.x-layout-collapsed-over{
+    cursor:pointer;
+}
+
+.x-layout-collapsed-west .x-layout-collapsed-tools, .x-layout-collapsed-east .x-layout-collapsed-tools{
+	position:absolute;
+    top:0;
+    left:0;
+    width:20px;
+    height:20px;
+}
+
+
+.x-layout-split{
+    position:absolute;
+    height:5px;
+    width:5px;
+    line-height:1px;
+    font-size:1px;
+    z-index:3;
+    background-color:transparent;
+}
+
+/* IE6 strict won't drag w/out a color */
+.ext-strict .ext-ie6 .x-layout-split{
+    background-color: #fff !important;
+    filter: alpha(opacity=1);
+}
+
+.x-layout-split-h{
+    background-image:url(../images/default/s.gif);
+    background-position: left;
+}
+
+.x-layout-split-v{
+    background-image:url(../images/default/s.gif);
+    background-position: top;
+}
+
+.x-column-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column {
+    float:left;
+    padding:0;
+    margin:0;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-column-inner {
+    overflow:hidden;
+    zoom:1;
+}
+
+/* mini mode */
+.x-layout-mini {
+    position:absolute;
+    top:0;
+    left:0;
+    display:block;
+    width:5px;
+    height:35px;
+    cursor:pointer;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+}
+
+.x-layout-mini-over, .x-layout-collapsed-over .x-layout-mini{
+    opacity:1;
+    -moz-opacity:1;
+    filter:none;
+}
+
+.x-layout-split-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-split-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-split-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    top:48%;
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    left:48%;
+    height:5px;
+    width:35px;
+}
+
+.x-layout-cmini-west, .x-layout-cmini-east {
+    border:0 none;
+    width:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-layout-cmini-north, .x-layout-cmini-south {
+    border:0 none;
+    height:5px !important;
+    padding:0;
+    background-color:transparent;
+}
+
+.x-viewport, .x-viewport body {
+    margin: 0;
+    padding: 0;
+    border: 0 none;
+    overflow: hidden;
+    height: 100%;
+}
+
+.x-abs-layout-item {
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.ext-ie input.x-abs-layout-item, .ext-ie textarea.x-abs-layout-item {
+    margin:0;
+}
+
+.x-box-layout-ct {
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-box-inner {
+    overflow:hidden;
+    zoom:1;
+    position:relative;
+    left:0;
+    top:0;
+}
+
+.x-box-item {
+    position:absolute;
+    left:0;
+    top:0;
+}.x-progress-wrap {
+    border:1px solid;
+    overflow:hidden;
+}
+
+.x-progress-inner {
+    height:18px;
+    background:repeat-x;
+    position:relative;
+}
+
+.x-progress-bar {
+    height:18px;
+    float:left;
+    width:0;
+    background: repeat-x left center;
+    border-top:1px solid;
+    border-bottom:1px solid;
+    border-right:1px solid;
+}
+
+.x-progress-text {
+    padding:1px 5px;
+    overflow:hidden;
+    position:absolute;
+    left:0;
+    text-align:center;
+}
+
+.x-progress-text-back {
+    line-height:16px;
+}
+
+.ext-ie .x-progress-text-back {
+    line-height:15px;
+}
+
+.ext-strict .ext-ie7 .x-progress-text-back{
+    width: 100%;
+}
+.x-list-header{
+	background: repeat-x 0 bottom;
+	cursor:default;
+    zoom:1;
+    height:22px;
+}
+
+.x-list-header-inner div {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.x-list-header-inner div em {
+    display:block;
+    border-left:1px solid;
+    padding:4px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    line-height:14px;
+}
+
+.x-list-body {
+    overflow:auto;
+    overflow-x:hidden;
+    overflow-y:auto;
+    zoom:1;
+    float: left;
+    width: 100%;
+}
+
+.x-list-body dl {
+    zoom:1;
+}
+
+.x-list-body dt {
+    display:block;
+    float:left;
+    overflow:hidden;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+    white-space: nowrap;
+    cursor:pointer;
+    zoom:1;
+}
+
+.x-list-body dt em {
+    display:block;
+    padding:3px 4px;
+    overflow:hidden;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+}
+
+.x-list-resizer {
+    border-left:1px solid;
+    border-right:1px solid;
+    position:absolute;
+    left:0;
+    top:0;
+}
+
+.x-list-header-inner em.sort-asc {
+    background: transparent no-repeat center 0;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
+.x-list-header-inner em.sort-desc {
+    background: transparent no-repeat center -23px;
+    border-style:solid;
+    border-width: 0 1px 1px;
+    padding-bottom:3px;
+}
+
+/* Shared styles */
+.x-slider {
+    zoom:1;
+}
+
+.x-slider-inner {
+    position:relative;
+    left:0;
+    top:0;
+    overflow:visible;
+    zoom:1;
+}
+
+.x-slider-focus {
+	position:absolute;
+	left:0;
+	top:0;
+	width:1px;
+	height:1px;
+    line-height:1px;
+    font-size:1px;
+    -moz-outline:0 none;
+    outline:0 none;
+    -moz-user-select: none;
+    -khtml-user-select:none;
+    -webkit-user-select:ignore;
+	display:block;
+	overflow:hidden;  
+}
+
+/* Horizontal styles */
+.x-slider-horz {
+    padding-left:7px;
+    background:transparent no-repeat 0 -22px;
+}
+
+.x-slider-horz .x-slider-end {
+    padding-right:7px;
+    zoom:1;
+    background:transparent no-repeat right -44px;
+}
+
+.x-slider-horz .x-slider-inner {
+    background:transparent repeat-x 0 0;
+    height:22px;
+}
+
+.x-slider-horz .x-slider-thumb {
+    width:14px;
+    height:15px;
+    position:absolute;
+    left:0;
+    top:3px;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-horz .x-slider-thumb-over {
+    background-position: -14px -15px;
+}
+
+.x-slider-horz .x-slider-thumb-drag {
+    background-position: -28px -30px;
+}
+
+/* Vertical styles */
+.x-slider-vert {
+    padding-top:7px;
+    background:transparent no-repeat -44px 0;
+    width:22px;
+}
+
+.x-slider-vert .x-slider-end {
+    padding-bottom:7px;
+    zoom:1;
+    background:transparent no-repeat -22px bottom;
+}
+
+.x-slider-vert .x-slider-inner {
+    background:transparent repeat-y 0 0;
+}
+
+.x-slider-vert .x-slider-thumb {
+    width:15px;
+    height:14px;
+    position:absolute;
+    left:3px;
+    bottom:0;
+    background:transparent no-repeat 0 0;
+}
+
+.x-slider-vert .x-slider-thumb-over {
+    background-position: -15px -14px;
+}
+
+.x-slider-vert .x-slider-thumb-drag {
+    background-position: -30px -28px;
+}.x-window-dlg .x-window-body {
+    border:0 none !important;
+    padding:5px 10px;
+    overflow:hidden !important;
+}
+
+.x-window-dlg .x-window-mc {
+    border:0 none !important;
+}
+
+.x-window-dlg .ext-mb-input {
+    margin-top:4px;
+    width:95%;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    margin-top:4px;
+}
+
+.x-window-dlg .x-progress-wrap {
+    margin-top:4px;
+}
+
+.ext-ie .x-window-dlg .x-progress-wrap {
+    margin-top:6px;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background:transparent no-repeat left;
+    display:block;
+    width:300px;
+    padding-left:18px;
+    line-height:18px;
+}
+
+.x-window-dlg .ext-mb-icon {
+    float:left;
+    width:47px;
+    height:32px;
+}
+
+.x-window-dlg .x-dlg-icon .ext-mb-content{
+    zoom: 1; 
+    margin-left: 47px;
+}
+
+.x-window-dlg .ext-mb-info, .x-window-dlg .ext-mb-warning, .x-window-dlg .ext-mb-question, .x-window-dlg .ext-mb-error {
+    background:transparent no-repeat top left;
+}
+
+.ext-gecko2 .ext-mb-fix-cursor {
+    overflow:auto;
+}.ext-el-mask {
+    background-color: #ccc;
+}
+
+.ext-el-mask-msg {
+    border-color:#6593cf;
+    background-color:#c3daf9;
+    background-image:url(../images/default/box/tb-blue.gif);
+}
+.ext-el-mask-msg div {
+    background-color: #eee;
+    border-color:#a3bad9;
+    color:#222;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-mask-loading div {
+    background-color:#fbfbfb;
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-item-disabled {
+    color: gray;
+}
+
+.x-item-disabled * {
+    color: gray !important;
+}
+
+.x-splitbar-proxy {
+    background-color: #aaa;
+}
+
+.x-color-palette a {
+    border-color:#fff;
+}
+
+.x-color-palette a:hover, .x-color-palette a.x-color-palette-sel {
+    border-color:#8bb8f3;
+    background-color: #deecfd;
+}
+
+/*
+.x-color-palette em:hover, .x-color-palette span:hover{   
+    background-color: #deecfd;
+}
+*/
+
+.x-color-palette em {
+    border-color:#aca899;
+}
+
+.x-ie-shadow {
+    background-color:#777;
+}
+
+.x-shadow .xsmc {
+    background-image: url(../images/default/shadow-c.png);
+}
+
+.x-shadow .xsml, .x-shadow .xsmr {
+    background-image: url(../images/default/shadow-lr.png);
+}
+
+.x-shadow .xstl, .x-shadow .xstc,  .x-shadow .xstr, .x-shadow .xsbl, .x-shadow .xsbc, .x-shadow .xsbr{
+    background-image: url(../images/default/shadow.png);
+}
+
+.loading-indicator {
+    font-size: 11px;
+    background-image: url(../images/default/grid/loading.gif);
+}
+
+.x-spotlight {
+    background-color: #ccc;
+}
+.x-tab-panel-header, .x-tab-panel-footer {
+	background-color: #deecfd;
+	border-color:#8db2e3;
+    overflow:hidden;
+    zoom:1;
+}
+
+.x-tab-panel-header, .x-tab-panel-footer {
+	border-color:#8db2e3;
+}
+
+ul.x-tab-strip-top{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-bg.gif);
+	border-bottom-color:#8db2e3;
+}
+
+ul.x-tab-strip-bottom{
+    background-color:#cedff5;
+	background-image: url(../images/default/tabs/tab-strip-btm-bg.gif);
+	border-top-color:#8db2e3;
+}
+
+.x-tab-panel-header-plain .x-tab-strip-spacer,
+.x-tab-panel-footer-plain .x-tab-strip-spacer {
+    border-color:#8db2e3;
+    background-color: #deecfd;
+}
+
+.x-tab-strip span.x-tab-strip-text {
+	font:normal 11px tahoma,arial,helvetica;
+	color:#416aa3;
+}
+
+.x-tab-strip-over span.x-tab-strip-text {
+	color:#15428b;
+}
+
+.x-tab-strip-active span.x-tab-strip-text {
+	color:#15428b;
+    font-weight:bold;
+}
+
+.x-tab-strip-disabled .x-tabs-text {
+	color:#aaaaaa;
+}
+
+.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left, .x-tab-strip-top .x-tab-strip-inner{
+	background-image: url(../images/default/tabs/tabs-sprite.gif);
+}
+
+.x-tab-strip-bottom .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-inactive-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-inactive-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-over-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-over .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-over-left-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-right {
+	background-image: url(../images/default/tabs/tab-btm-right-bg.gif);
+}
+
+.x-tab-strip-bottom .x-tab-strip-active .x-tab-left {
+	background-image: url(../images/default/tabs/tab-btm-left-bg.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close {
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-strip .x-tab-strip-closable a.x-tab-strip-close:hover{
+	background-image:url(../images/default/tabs/tab-close.gif);
+}
+
+.x-tab-panel-body {
+    border-color:#8db2e3;
+    background-color:#fff;
+}
+
+.x-tab-panel-body-top {
+    border-top: 0 none;
+}
+
+.x-tab-panel-body-bottom {
+    border-bottom: 0 none;
+}
+
+.x-tab-scroller-left {
+    background-image:url(../images/default/tabs/scroll-left.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-scroller-left-over {
+    background-position: 0 0;
+}
+
+.x-tab-scroller-left-disabled {
+    background-position: -18px 0;
+    opacity:.5;
+    -moz-opacity:.5;
+    filter:alpha(opacity=50);
+    cursor:default;
+}
+
+.x-tab-scroller-right {
+    background-image:url(../images/default/tabs/scroll-right.gif);
+    border-bottom-color:#8db2e3;
+}
+
+.x-tab-panel-bbar .x-toolbar, .x-tab-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}.x-form-field {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-text, textarea.x-form-field {
+    background-color:#fff;
+    background-image:url(../images/default/form/text-bg.gif);
+    border-color:#b5b8c8;
+}
+
+.x-form-select-one {
+    background-color:#fff;
+    border-color:#b5b8c8;
+}
+
+.x-form-check-group-label {
+    border-bottom: 1px solid #99bbe8;
+    color: #15428b;
+}
+
+.x-editor .x-form-check-wrap {
+    background-color:#fff;
+}
+
+.x-form-field-wrap .x-form-trigger {
+    background-image:url(../images/default/form/trigger.gif);
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-field-wrap .x-form-date-trigger {
+    background-image: url(../images/default/form/date-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-clear-trigger {
+    background-image: url(../images/default/form/clear-trigger.gif);
+}
+
+.x-form-field-wrap .x-form-search-trigger {
+    background-image: url(../images/default/form/search-trigger.gif);
+}
+
+.x-trigger-wrap-focus .x-form-trigger {
+    border-bottom-color:#7eadd9;
+}
+
+.x-item-disabled .x-form-trigger-over {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-item-disabled .x-form-trigger-click {
+    border-bottom-color:#b5b8c8;
+}
+
+.x-form-focus, textarea.x-form-focus {
+	border-color:#7eadd9;
+}
+
+.x-form-invalid, textarea.x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-invalid.x-form-composite {
+    border: none;
+    background-image: none;
+}
+
+.x-form-invalid.x-form-composite .x-form-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+	border-color:#c30;
+}
+
+.x-form-inner-invalid, textarea.x-form-inner-invalid {
+    background-color:#fff;
+	background-image:url(../images/default/grid/invalid_line.gif);
+}
+
+.x-form-grow-sizer {
+	font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-item {
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-form-invalid-msg {
+    color:#c0272b;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+    background-image:url(../images/default/shared/warning.gif);
+}
+
+.x-form-empty-field {
+    color:gray;
+}
+
+.x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.ext-webkit .x-small-editor .x-form-field {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-form-invalid-icon {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-fieldset {
+    border-color:#b5b8c8;
+}
+
+.x-fieldset legend {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+}
+.x-btn{
+	font:normal 11px tahoma, verdana, helvetica;
+}
+
+.x-btn button{
+    font:normal 11px arial,tahoma,verdana,helvetica;
+    color:#333;
+}
+
+.x-btn em {
+    font-style:normal;
+    font-weight:normal;
+}
+
+.x-btn-tl, .x-btn-tr, .x-btn-tc, .x-btn-ml, .x-btn-mr, .x-btn-mc, .x-btn-bl, .x-btn-br, .x-btn-bc{
+	background-image:url(../images/default/button/btn.gif);
+}
+
+.x-btn-click .x-btn-text, .x-btn-menu-active .x-btn-text, .x-btn-pressed .x-btn-text{
+    color:#000;
+}
+
+.x-btn-disabled *{
+	color:gray !important;
+}
+
+.x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/button/arrow.gif);
+}
+
+.x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split, .x-btn-click .x-btn-mc em.x-btn-split, .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-btn-pressed .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-btn-mc em.x-btn-arrow-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b.gif);
+}
+
+.x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-btn-click .x-btn-mc em.x-btn-split-bottom, .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-btn-pressed .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-btn-group-header {
+    color: #3e6aaa;
+}
+
+.x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-tl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-tr {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-bc {
+	background-image: url(../images/default/button/group-tb.gif);
+}
+
+.x-btn-group-bl {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-br {
+	background-image: url(../images/default/button/group-cs.gif);
+}
+
+.x-btn-group-ml {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+.x-btn-group-mr {
+	background-image: url(../images/default/button/group-lr.gif);
+}
+
+.x-btn-group-notitle .x-btn-group-tc {
+	background-image: url(../images/default/button/group-tb.gif);
+}.x-toolbar{
+	border-color:#a9bfd3;
+    background-color:#d0def0;
+    background-image:url(../images/default/toolbar/bg.gif);
+}
+
+.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+
+.x-toolbar .x-item-disabled {
+	color:gray;
+}
+
+.x-toolbar .x-item-disabled * {
+	color:gray;
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split {
+    background-image:url(../images/default/button/s-arrow-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split
+{
+    background-image:url(../images/default/button/s-arrow-o.gif);
+}
+
+.x-toolbar .x-btn-mc em.x-btn-split-bottom {
+    background-image:url(../images/default/button/s-arrow-b-noline.gif);
+}
+
+.x-toolbar .x-btn-over .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-click .x-btn-mc em.x-btn-split-bottom,
+.x-toolbar .x-btn-menu-active .x-btn-mc em.x-btn-split-bottom, .x-toolbar .x-btn-pressed .x-btn-mc em.x-btn-split-bottom
+{
+    background-image:url(../images/default/button/s-arrow-bo.gif);
+}
+
+.x-toolbar .xtb-sep {
+	background-image: url(../images/default/grid/grid-blue-split.gif);
+}
+
+.x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first.gif) !important;
+}
+
+.x-tbar-loading{
+	background-image: url(../images/default/grid/refresh.gif) !important;
+}
+
+.x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last.gif) !important;
+}
+
+.x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next.gif) !important;
+}
+
+.x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev.gif) !important;
+}
+
+.x-item-disabled .x-tbar-loading{
+	background-image: url(../images/default/grid/refresh-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-first{
+	background-image: url(../images/default/grid/page-first-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-last{
+	background-image: url(../images/default/grid/page-last-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-next{
+	background-image: url(../images/default/grid/page-next-disabled.gif) !important;
+}
+
+.x-item-disabled .x-tbar-page-prev{
+	background-image: url(../images/default/grid/page-prev-disabled.gif) !important;
+}
+
+.x-paging-info {
+    color:#444;
+}
+
+.x-toolbar-more-icon {
+    background-image: url(../images/default/toolbar/more.gif) !important;
+}.x-resizable-handle {
+	background-color:#fff;
+}
+
+.x-resizable-over .x-resizable-handle-east, .x-resizable-pinned .x-resizable-handle-east,
+.x-resizable-over .x-resizable-handle-west, .x-resizable-pinned .x-resizable-handle-west
+{
+    background-image:url(../images/default/sizer/e-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-south, .x-resizable-pinned .x-resizable-handle-south,
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north
+{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+
+.x-resizable-over .x-resizable-handle-north, .x-resizable-pinned .x-resizable-handle-north{
+    background-image:url(../images/default/sizer/s-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southeast, .x-resizable-pinned .x-resizable-handle-southeast{
+    background-image:url(../images/default/sizer/se-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northwest, .x-resizable-pinned .x-resizable-handle-northwest{
+    background-image:url(../images/default/sizer/nw-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-northeast, .x-resizable-pinned .x-resizable-handle-northeast{
+    background-image:url(../images/default/sizer/ne-handle.gif);
+}
+.x-resizable-over .x-resizable-handle-southwest, .x-resizable-pinned .x-resizable-handle-southwest{
+    background-image:url(../images/default/sizer/sw-handle.gif);
+}
+.x-resizable-proxy{
+    border-color:#3b5a82;
+}
+.x-resizable-overlay{
+    background-color:#fff;
+}
+.x-grid3 {
+    background-color:#fff;
+}
+
+.x-grid-panel .x-panel-mc .x-panel-body {
+    border-color:#99bbe8;
+}
+
+.x-grid3-row td, .x-grid3-summary-row td{
+	font:normal 11px/13px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-hd-row td {
+	font:normal 11px/15px arial, tahoma, helvetica, sans-serif;
+}
+
+
+.x-grid3-hd-row td {
+    border-left-color:#eee;
+    border-right-color:#d0d0d0;
+}
+
+.x-grid-row-loading {
+    background-color: #fff;
+    background-image:url(../images/default/shared/loading-balls.gif);
+}
+
+.x-grid3-row {
+    border-color:#ededed;
+    border-top-color:#fff;
+}
+
+.x-grid3-row-alt{
+	background-color:#fafafa;
+}
+
+.x-grid3-row-over {
+	border-color:#ddd;
+    background-color:#efefef;
+    background-image:url(../images/default/grid/row-over.gif);
+}
+
+.x-grid3-resize-proxy {
+    background-color:#777;
+}
+
+.x-grid3-resize-marker {
+    background-color:#777;
+}
+
+.x-grid3-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-grid3-header-pop {
+    border-left-color:#d0d0d0;
+}
+
+.x-grid3-header-pop-inner {
+    border-left-color:#eee;
+    background-image:url(../images/default/grid/hd-pop.gif);
+}
+
+td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
+    border-left-color:#aaccf6;
+    border-right-color:#aaccf6;
+}
+
+td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
+    background-color:#ebf3fd;
+    background-image:url(../images/default/grid/grid3-hrow-over.gif);
+
+}
+
+.sort-asc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_asc.gif);
+}
+
+.sort-desc .x-grid3-sort-icon {
+	background-image: url(../images/default/grid/sort_desc.gif);
+}
+
+.x-grid3-cell-text, .x-grid3-hd-text {
+	color:#000;
+}
+
+.x-grid3-split {
+	background-image: url(../images/default/grid/grid-split.gif);
+}
+
+.x-grid3-hd-text {
+	color:#15428b;
+}
+
+.x-dd-drag-proxy .x-grid3-hd-inner{
+    background-color:#ebf3fd;
+	background-image:url(../images/default/grid/grid3-hrow-over.gif);
+	border-color:#aaccf6;
+}
+
+.col-move-top{
+	background-image:url(../images/default/grid/col-move-top.gif);
+}
+
+.col-move-bottom{
+	background-image:url(../images/default/grid/col-move-bottom.gif);
+}
+
+td.grid-hd-group-cell {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x bottom;
+}
+
+.x-grid3-row-selected {
+	background-color: #dfe8f6 !important;
+	background-image: none;
+	border-color:#a3bae9;
+}
+
+.x-grid3-cell-selected{
+	background-color: #b8cfee !important;
+	color:#000;
+}
+
+.x-grid3-cell-selected span{
+	color:#000 !important;
+}
+
+.x-grid3-cell-selected .x-grid3-cell-text{
+	color:#000;
+}
+
+.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
+    background-color:#ebeadb !important;
+    background-image:url(../images/default/grid/grid-hrow.gif) !important;
+    color:#000;
+    border-top-color:#fff;
+    border-right-color:#6fa0df !important;
+}
+
+.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
+    color:#15428b !important;
+}
+
+.x-grid3-dirty-cell {
+    background-image:url(../images/default/grid/dirty.gif);
+}
+
+.x-grid3-topbar, .x-grid3-bottombar{
+	font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-grid3-bottombar .x-toolbar{
+	border-top-color:#a9bfd3;
+}
+
+.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
+	background-image:url(../images/default/grid/grid3-special-col-bg.gif) !important;
+    color:#000 !important;
+}
+
+.x-props-grid .x-grid3-body .x-grid3-td-name{
+    background-color:#fff !important;
+    border-right-color:#eee;
+}
+
+.xg-hmenu-sort-asc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-asc.gif);
+}
+
+.xg-hmenu-sort-desc .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-desc.gif);
+}
+
+.xg-hmenu-lock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-lock.gif);
+}
+
+.xg-hmenu-unlock .x-menu-item-icon{
+	background-image: url(../images/default/grid/hmenu-unlock.gif);
+}
+
+.x-grid3-hd-btn {
+    background-color:#c3daf9;
+    background-image:url(../images/default/grid/grid3-hd-btn.gif);
+}
+
+.x-grid3-body .x-grid3-td-expander {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-expander {
+    background-image:url(../images/default/grid/row-expand-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-checker {
+    background-image: url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-row-checker, .x-grid3-hd-checker {
+    background-image:url(../images/default/grid/row-check-sprite.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
+	color:#444;
+}
+
+.x-grid3-body .x-grid3-td-row-icon {
+    background-image:url(../images/default/grid/grid3-special-col-bg.gif);
+}
+
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
+.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
+	background-image:url(../images/default/grid/grid3-special-col-sel-bg.gif);
+}
+
+.x-grid3-check-col {
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-grid3-check-col-on {
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
+    zoom:1;
+}
+
+.x-grid-group-hd {
+    border-bottom-color:#99bbe8;
+}
+
+.x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-collapse.gif);
+    color:#3764a0;
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-group-collapsed .x-grid-group-hd div.x-grid-group-title {
+    background-image:url(../images/default/grid/group-expand.gif);
+}
+
+.x-group-by-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-cols-icon {
+    background-image:url(../images/default/grid/columns.gif);
+}
+
+.x-show-groups-icon {
+    background-image:url(../images/default/grid/group-by.gif);
+}
+
+.x-grid-empty {
+    color:gray;
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
+    border-right-color:#ededed;
+}
+
+.x-grid-with-col-lines .x-grid3-row-selected {
+	border-top-color:#a3bae9;
+}.x-pivotgrid .x-grid3-header-offset table td {
+    background: url(../images/default/grid/grid3-hrow.gif) repeat-x 50% 100%;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+}
+
+.x-pivotgrid .x-grid3-row-headers {
+    background-color: #f9f9f9;
+}
+
+.x-pivotgrid .x-grid3-row-headers table td {
+    background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+    border-left: 1px solid;
+    border-right: 1px solid;
+    border-left-color: #EEE;
+    border-right-color: #D0D0D0;
+    border-bottom: 1px solid;
+    border-bottom-color: #D0D0D0;
+    height: 18px;
+}
+.x-dd-drag-ghost{
+	color:#000;
+	font: normal 11px arial, helvetica, sans-serif;
+    border-color: #ddd #bbb #bbb #ddd;
+	background-color:#fff;
+}
+
+.x-dd-drop-nodrop .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-no.gif);
+}
+
+.x-dd-drop-ok .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-yes.gif);
+}
+
+.x-dd-drop-ok-add .x-dd-drop-icon{
+  background-image: url(../images/default/dd/drop-add.gif);
+}
+
+.x-view-selector {
+    background-color:#c3daf9;
+    border-color:#3399bb;
+}.x-tree-node-expanded .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder-open.gif);
+}
+
+.x-tree-node-leaf .x-tree-node-icon{
+	background-image:url(../images/default/tree/leaf.gif);
+}
+
+.x-tree-node-collapsed .x-tree-node-icon{
+	background-image:url(../images/default/tree/folder.gif);
+}
+
+.x-tree-node-loading .x-tree-node-icon{
+	background-image:url(../images/default/tree/loading.gif) !important;
+}
+
+.x-tree-node .x-tree-node-inline-icon {
+    background-image: none;
+}
+
+.x-tree-node-loading a span{
+	 font-style: italic;
+	 color:#444444;
+}
+
+.x-tree-lines .x-tree-elbow{
+	background-image:url(../images/default/tree/elbow.gif);
+}
+
+.x-tree-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end{
+	background-image:url(../images/default/tree/elbow-end.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus.gif);
+}
+
+.x-tree-lines .x-tree-elbow-line{
+	background-image:url(../images/default/tree/elbow-line.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-plus{
+	background-image:url(../images/default/tree/elbow-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-minus{
+	background-image:url(../images/default/tree/elbow-minus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-plus{
+	background-image:url(../images/default/tree/elbow-end-plus-nl.gif);
+}
+
+.x-tree-no-lines .x-tree-elbow-end-minus{
+	background-image:url(../images/default/tree/elbow-end-minus-nl.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-plus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-arrows .x-tree-elbow-end-minus{
+    background-image:url(../images/default/tree/arrows.gif);
+}
+
+.x-tree-node{
+	color:#000;
+	font: normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-tree-node a, .x-dd-drag-ghost a{
+	color:#000;
+}
+
+.x-tree-node a span, .x-dd-drag-ghost a span{
+	color:#000;
+}
+
+.x-tree-node .x-tree-node-disabled a span{
+	color:gray !important;
+}
+
+.x-tree-node div.x-tree-drag-insert-below{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-node div.x-tree-drag-insert-above{
+	 border-top-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-below a{
+ 	 border-bottom-color:#36c;
+}
+
+.x-tree-dd-underline .x-tree-node div.x-tree-drag-insert-above a{
+	 border-top-color:#36c;
+}
+
+.x-tree-node .x-tree-drag-append a span{
+	 background-color:#ddd;
+	 border-color:gray;
+}
+
+.x-tree-node .x-tree-node-over {
+	background-color: #eee;
+}
+
+.x-tree-node .x-tree-selected {
+	background-color: #d9e8fb;
+}
+
+.x-tree-drop-ok-append .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-add.gif);
+}
+
+.x-tree-drop-ok-above .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-over.gif);
+}
+
+.x-tree-drop-ok-below .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-under.gif);
+}
+
+.x-tree-drop-ok-between .x-dd-drop-icon{
+  background-image: url(../images/default/tree/drop-between.gif);
+}.x-date-picker {
+    border-color: #1b376c;
+    background-color:#fff;
+}
+
+.x-date-middle,.x-date-left,.x-date-right {
+	background-image: url(../images/default/shared/hd-sprite.gif);
+	color:#fff;
+	font:bold 11px "sans serif", tahoma, verdana, helvetica;
+}
+
+.x-date-middle .x-btn .x-btn-text {
+    color:#fff;
+}
+
+.x-date-middle .x-btn-mc em.x-btn-arrow {
+    background-image:url(../images/default/toolbar/btn-arrow-light.gif);
+}
+
+.x-date-right a {
+    background-image: url(../images/default/shared/right-btn.gif);
+}
+
+.x-date-left a{
+	background-image: url(../images/default/shared/left-btn.gif);
+}
+
+.x-date-inner th {
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+	border-bottom-color:#a3bad9;
+    font:normal 10px arial, helvetica,tahoma,sans-serif;
+	color:#233d6d;
+}
+
+.x-date-inner td {
+    border-color:#fff;
+}
+
+.x-date-inner a {
+    font:normal 11px arial, helvetica,tahoma,sans-serif;
+    color:#000;
+}
+
+.x-date-inner .x-date-active{
+	color:#000;
+}
+
+.x-date-inner .x-date-selected a{
+    background-color:#dfecfb;
+	background-image:url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-inner .x-date-today a{
+	border-color:darkred;
+}
+
+.x-date-inner .x-date-selected span{
+    font-weight:bold;
+}
+
+.x-date-inner .x-date-prevday a,.x-date-inner .x-date-nextday a {
+	color:#aaa;
+}
+
+.x-date-bottom {
+    border-top-color:#a3bad9;
+    background-color:#dfecfb;
+    background-image:url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover{
+    color:#000;
+    background-color:#ddecfe;
+}
+
+.x-date-inner .x-date-disabled a {
+	background-color:#eee;
+	color:#bbb;
+}
+
+.x-date-mmenu{
+    background-color:#eee !important;
+}
+
+.x-date-mmenu .x-menu-item {
+	font-size:10px;
+	color:#000;
+}
+
+.x-date-mp {
+	background-color:#fff;
+}
+
+.x-date-mp td {
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns button {
+	background-color:#083772;
+	color:#fff;
+	border-color: #3366cc #000055 #000055 #3366cc;
+	font:normal 11px arial, helvetica,tahoma,sans-serif;
+}
+
+.x-date-mp-btns {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+}
+
+.x-date-mp-btns td {
+	border-top-color: #c5d2df;
+}
+
+td.x-date-mp-month a,td.x-date-mp-year a {
+	color:#15428b;
+}
+
+td.x-date-mp-month a:hover,td.x-date-mp-year a:hover {
+	color:#15428b;
+	background-color: #ddecfe;
+}
+
+td.x-date-mp-sel a {
+    background-color: #dfecfb;
+	background-image: url(../images/default/shared/glass-bg.gif);
+	border-color:#8db2e3;
+}
+
+.x-date-mp-ybtn a {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+td.x-date-mp-sep {
+   border-right-color:#c5d2df;
+}.x-tip .x-tip-close{
+	background-image: url(../images/default/qtip/close.gif);
+}
+
+.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
+	background-image: url(../images/default/qtip/tip-sprite.gif);
+}
+
+.x-tip .x-tip-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+}
+.x-tip .x-tip-ml {
+	background-color: #fff;
+}
+
+.x-tip .x-tip-header-text {
+    font: bold 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-tip .x-tip-body {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    color:#444;
+}
+
+.x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
+.x-form-invalid-tip .x-tip-bl, .x-form-invalid-tip .x-tip-br, .x-form-invalid-tip .x-tip-ml, .x-form-invalid-tip .x-tip-mr
+{
+	background-image: url(../images/default/form/error-tip-corners.gif);
+}
+
+.x-form-invalid-tip .x-tip-body {
+    background-image:url(../images/default/form/exclamation.gif);
+}
+
+.x-tip-anchor {
+    background-image:url(../images/default/qtip/tip-anchor-sprite.gif);
+}.x-menu {
+    background-color:#f0f0f0;
+	background-image:url(../images/default/menu/menu.gif);
+}
+
+.x-menu-floating{
+    border-color:#718bb7;
+}
+
+.x-menu-nosep {
+	background-image:none;
+}
+
+.x-menu-list-item{
+	font:normal 11px arial,tahoma,sans-serif;
+}
+
+.x-menu-item-arrow{
+	background-image:url(../images/default/menu/menu-parent.gif);
+}
+
+.x-menu-sep {
+    background-color:#e0e0e0;
+	border-bottom-color:#fff;
+}
+
+a.x-menu-item {
+	color:#222;
+}
+
+.x-menu-item-active {
+    background-image: url(../images/default/menu/item-over.gif);
+	background-color: #dbecf4;
+    border-color:#aaccf6;
+}
+
+.x-menu-item-active a.x-menu-item {
+	border-color:#aaccf6;
+}
+
+.x-menu-check-item .x-menu-item-icon{
+	background-image:url(../images/default/menu/unchecked.gif);
+}
+
+.x-menu-item-checked .x-menu-item-icon{
+	background-image:url(../images/default/menu/checked.gif);
+}
+
+.x-menu-item-checked .x-menu-group-item .x-menu-item-icon{
+    background-image:url(../images/default/menu/group-checked.gif);
+}
+
+.x-menu-group-item .x-menu-item-icon{
+    background-image:none;
+}
+
+.x-menu-plain {
+	background-color:#f0f0f0 !important;
+    background-image: none;
+}
+
+.x-date-menu, .x-color-menu{
+    background-color: #fff !important;
+}
+
+.x-menu .x-date-picker{
+    border-color:#a3bad9;
+}
+
+.x-cycle-menu .x-menu-item-checked {
+    border-color:#a3bae9 !important;
+    background-color:#def8f6;
+}
+
+.x-menu-scroller-top {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+
+.x-menu-scroller-bottom {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+.x-box-tl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-tc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-tr {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-ml {
+	background-image: url(../images/default/box/l.gif);
+}
+
+.x-box-mc {
+	background-color: #eee;
+    background-image: url(../images/default/box/tb.gif);
+	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
+	color: #393939;
+	font-size: 12px;
+}
+
+.x-box-mc h3 {
+	font-size: 14px;
+	font-weight: bold;
+}
+
+.x-box-mr {
+	background-image: url(../images/default/box/r.gif);
+}
+
+.x-box-bl {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-bc {
+	background-image: url(../images/default/box/tb.gif);
+}
+
+.x-box-br {
+	background-image: url(../images/default/box/corners.gif);
+}
+
+.x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
+	background-image: url(../images/default/box/corners-blue.gif);
+}
+
+.x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
+	background-image: url(../images/default/box/tb-blue.gif);
+}
+
+.x-box-blue .x-box-mc {
+	background-color: #c3daf9;
+}
+
+.x-box-blue .x-box-mc h3 {
+	color: #17385b;
+}
+
+.x-box-blue .x-box-ml {
+	background-image: url(../images/default/box/l-blue.gif);
+}
+
+.x-box-blue .x-box-mr {
+	background-image: url(../images/default/box/r-blue.gif);
+}.x-combo-list {
+    border-color:#98c0f4;
+    background-color:#ddecfe;
+    font:normal 12px tahoma, arial, helvetica, sans-serif;
+}
+
+.x-combo-list-inner {
+    background-color:#fff;
+}
+
+.x-combo-list-hd {
+    font:bold 11px tahoma, arial, helvetica, sans-serif;
+    color:#15428b;
+    background-image: url(../images/default/layout/panel-title-light-bg.gif);
+    border-bottom-color:#98c0f4;
+}
+
+.x-resizable-pinned .x-combo-list-inner {
+    border-bottom-color:#98c0f4;
+}
+
+.x-combo-list-item {
+    border-color:#fff;
+}
+
+.x-combo-list .x-combo-selected{
+	border-color:#a3bae9 !important;
+    background-color:#dfe8f6;
+}
+
+.x-combo-list .x-toolbar {
+    border-top-color:#98c0f4;
+}
+
+.x-combo-list-small {
+    font:normal 11px tahoma, arial, helvetica, sans-serif;
+}.x-panel {
+    border-color: #99bbe8;
+}
+
+.x-panel-header {
+    color:#15428b;
+	font-weight:bold; 
+    font-size: 11px;
+    font-family: tahoma,arial,verdana,sans-serif;
+    border-color:#99bbe8;
+    background-image: url(../images/default/panel/white-top-bottom.gif);
+}
+
+.x-panel-body {
+    border-color:#99bbe8;
+    background-color:#fff;
+}
+
+.x-panel-bbar .x-toolbar, .x-panel-tbar .x-toolbar {
+    border-color:#99bbe8;
+}
+
+.x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-body-noheader, .x-panel-mc .x-panel-body {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-tl .x-panel-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-panel-tc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-tl, .x-panel-tr, .x-panel-bl,  .x-panel-br{
+	background-image: url(../images/default/panel/corners-sprite.gif);
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-bc {
+	background-image: url(../images/default/panel/top-bottom.gif);
+}
+
+.x-panel-mc {
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-panel-ml {
+	background-color: #fff;
+    background-image:url(../images/default/panel/left-right.gif);
+}
+
+.x-panel-mr {
+	background-image: url(../images/default/panel/left-right.gif);
+}
+
+.x-tool {
+    background-image:url(../images/default/panel/tool-sprites.gif);
+}
+
+.x-panel-ghost {
+    background-color:#cbddf3;
+}
+
+.x-panel-ghost ul {
+    border-color:#99bbe8;
+}
+
+.x-panel-dd-spacer {
+    border-color:#99bbe8;
+}
+
+.x-panel-fbar td,.x-panel-fbar span,.x-panel-fbar input,.x-panel-fbar div,.x-panel-fbar select,.x-panel-fbar label{
+    font:normal 11px arial,tahoma, helvetica, sans-serif;
+}
+.x-window-proxy {
+    background-color:#c7dffc;
+    border-color:#99bbe8;
+}
+
+.x-window-tl .x-window-header {
+    color:#15428b;
+	font:bold 11px tahoma,arial,verdana,sans-serif;
+}
+
+.x-window-tc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-tl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-tr {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-bc {
+	background-image: url(../images/default/window/top-bottom.png);
+}
+
+.x-window-bl {
+	background-image: url(../images/default/window/left-corners.png);
+}
+
+.x-window-br {
+	background-image: url(../images/default/window/right-corners.png);
+}
+
+.x-window-mc {
+    border-color:#99bbe8;
+    font: normal 11px tahoma,arial,helvetica,sans-serif;
+    background-color:#dfe8f6;
+}
+
+.x-window-ml {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-mr {
+	background-image: url(../images/default/window/left-right.png);
+}
+
+.x-window-maximized .x-window-tc {
+    background-color:#fff;
+}
+
+.x-window-bbar .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-panel-ghost .x-window-tl {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-collapsed .x-window-tl {
+    border-bottom-color:#84a0c4;
+}
+
+.x-dlg-mask{
+   background-color:#ccc;
+}
+
+.x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+    border-color: #a3bae9 #dfe8f6 #dfe8f6 #a3bae9;
+}
+
+.x-window-plain .x-window-body {
+    border-color: #dfe8f6 #a3bae9 #a3bae9 #dfe8f6;
+}
+
+body.x-body-masked .x-window-plain .x-window-mc {
+    background-color: #ccd9e8;
+}.x-html-editor-wrap {
+    border-color:#a9bfd3;
+    background-color:#fff;
+}
+.x-html-editor-tb .x-btn-text {
+    background-image:url(../images/default/editor/tb-sprite.gif);
+}.x-panel-noborder .x-panel-header-noborder {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}
+
+.x-panel-noborder .x-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-bbar-noborder .x-toolbar {
+    border-top-color:#99bbe8;
+}
+
+.x-tab-panel-tbar-noborder .x-toolbar {
+    border-bottom-color:#99bbe8;
+}.x-border-layout-ct {
+    background-color:#dfe8f6;
+}
+
+.x-accordion-hd {
+	color:#222;
+    font-weight:normal;
+    background-image: url(../images/default/panel/light-hd.gif);
+}
+
+.x-layout-collapsed{
+    background-color:#d2e0f2;
+	border-color:#98c0f4;
+}
+
+.x-layout-collapsed-over{
+    background-color:#d9e8fb;
+}
+
+.x-layout-split-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+.x-layout-split-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+.x-layout-split-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}
+.x-layout-split-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-west .x-layout-mini {
+    background-image:url(../images/default/layout/mini-right.gif);
+}
+
+.x-layout-cmini-east .x-layout-mini {
+    background-image:url(../images/default/layout/mini-left.gif);
+}
+
+.x-layout-cmini-north .x-layout-mini {
+    background-image:url(../images/default/layout/mini-bottom.gif);
+}
+
+.x-layout-cmini-south .x-layout-mini {
+    background-image:url(../images/default/layout/mini-top.gif);
+}.x-progress-wrap {
+    border-color:#6593cf;
+}
+
+.x-progress-inner {
+    background-color:#e0e8f3;
+    background-image:url(../images/default/qtip/bg.gif);
+}
+
+.x-progress-bar {
+    background-color:#9cbfee;
+    background-image:url(../images/default/progress/progress-bg.gif);
+    border-top-color:#d1e4fd;
+    border-bottom-color:#7fa9e4;
+    border-right-color:#7fa9e4;
+}
+
+.x-progress-text {
+    font-size:11px;
+    font-weight:bold;
+    color:#fff;
+}
+
+.x-progress-text-back {
+    color:#396095;
+}.x-list-header{
+    background-color:#f9f9f9;
+	background-image:url(../images/default/grid/grid3-hrow.gif);
+}
+
+.x-list-header-inner div em {
+    border-left-color:#ddd;
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-body dt em {
+    font:normal 11px arial, tahoma, helvetica, sans-serif;
+}
+
+.x-list-over {
+    background-color:#eee;
+}
+
+.x-list-selected {
+    background-color:#dfe8f6;
+}
+
+.x-list-resizer {
+    border-left-color:#555;
+    border-right-color:#555;
+}
+
+.x-list-header-inner em.sort-asc, .x-list-header-inner em.sort-desc {
+    background-image:url(../images/default/grid/sort-hd.gif);
+    border-color: #99bbe8;
+}.x-slider-horz, .x-slider-horz .x-slider-end, .x-slider-horz .x-slider-inner {
+    background-image:url(../images/default/slider/slider-bg.png);
+}
+
+.x-slider-horz .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-thumb.png);
+}
+
+.x-slider-vert, .x-slider-vert .x-slider-end, .x-slider-vert .x-slider-inner {
+    background-image:url(../images/default/slider/slider-v-bg.png);
+}
+
+.x-slider-vert .x-slider-thumb {
+    background-image:url(../images/default/slider/slider-v-thumb.png);
+}.x-window-dlg .ext-mb-text,
+.x-window-dlg .x-window-header-text {
+    font-size:12px;
+}
+
+.x-window-dlg .ext-mb-textarea {
+    font:normal 12px tahoma,arial,helvetica,sans-serif;
+}
+
+.x-window-dlg .x-msg-box-wait {
+    background-image:url(../images/default/grid/loading.gif);
+}
+
+.x-window-dlg .ext-mb-info {
+    background-image:url(../images/default/window/icon-info.gif);
+}
+
+.x-window-dlg .ext-mb-warning {
+    background-image:url(../images/default/window/icon-warning.gif);
+}
+
+.x-window-dlg .ext-mb-question {
+    background-image:url(../images/default/window/icon-question.gif);
+}
+
+.x-window-dlg .ext-mb-error {
+    background-image:url(../images/default/window/icon-error.gif);
+}
Index: /trunk/workshop-routing-foss4g/web/ext/INCLUDE_ORDER.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/INCLUDE_ORDER.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/INCLUDE_ORDER.txt	(revision 76)
@@ -0,0 +1,35 @@
+All adapter related files below are located in 
+/adapters/<lib name>/ of this zip file.
+
+Your include order should be:
+
+Ext Stand-alone
+-------------------------------------------------------------------
+ext-base.js
+ext-all.js (or your choice of files)
+
+
+Yahoo! UI (.12+)
+-------------------------------------------------------------------
+yui-utilities.js
+ext-yui-adapter.js
+ext-all.js (or your choice of files)
+
+
+jQuery (1.1+)
+-------------------------------------------------------------------
+jquery.js
+ext-jquery-adapter.js
+ext-all.js (or your choice of files)
+
+
+Prototype (1.5+) / Scriptaculous (1.7+)
+-------------------------------------------------------------------
+prototype.js
+scriptaculous.js?load=effects  (or whatever you want to load)
+ext-prototype-adapter.js
+ext-all.js (or your choice of files)
+
+
+
+See the examples folders for more examples.
Index: /trunk/workshop-routing-foss4g/web/ext/ext-all-debug-w-comments.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/ext-all-debug-w-comments.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/ext-all-debug-w-comments.js	(revision 76)
@@ -0,0 +1,78980 @@
+/*!
+ * Ext JS Library 3.4.0
+ * Copyright(c) 2006-2011 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+(function(){
+
+var EXTUTIL = Ext.util,
+    EACH = Ext.each,
+    TRUE = true,
+    FALSE = false;
+/**
+ * @class Ext.util.Observable
+ * Base class that provides a common interface for publishing events. Subclasses are expected to
+ * to have a property "events" with all the events defined, and, optionally, a property "listeners"
+ * with configured listeners defined.<br>
+ * For example:
+ * <pre><code>
+Employee = Ext.extend(Ext.util.Observable, {
+    constructor: function(config){
+        this.name = config.name;
+        this.addEvents({
+            "fired" : true,
+            "quit" : true
+        });
+
+        // Copy configured listeners into *this* object so that the base class&#39;s
+        // constructor will add them.
+        this.listeners = config.listeners;
+
+        // Call our superclass constructor to complete construction process.
+        Employee.superclass.constructor.call(this, config)
+    }
+});
+</code></pre>
+ * This could then be used like this:<pre><code>
+var newEmployee = new Employee({
+    name: employeeName,
+    listeners: {
+        quit: function() {
+            // By default, "this" will be the object that fired the event.
+            alert(this.name + " has quit!");
+        }
+    }
+});
+</code></pre>
+ */
+EXTUTIL.Observable = function(){
+    /**
+     * @cfg {Object} listeners (optional) <p>A config object containing one or more event handlers to be added to this
+     * object during initialization.  This should be a valid listeners config object as specified in the
+     * {@link #addListener} example for attaching multiple handlers at once.</p>
+     * <br><p><b><u>DOM events from ExtJs {@link Ext.Component Components}</u></b></p>
+     * <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
+     * is usually only done when extra value can be added. For example the {@link Ext.DataView DataView}'s
+     * <b><code>{@link Ext.DataView#click click}</code></b> event passing the node clicked on. To access DOM
+     * events directly from a Component's HTMLElement, listeners must be added to the <i>{@link Ext.Component#getEl Element}</i> after the Component
+     * has been rendered. A plugin can simplify this step:<pre><code>
+// Plugin is configured with a listeners config object.
+// The Component is appended to the argument list of all handler functions.
+Ext.DomObserver = Ext.extend(Object, {
+    constructor: function(config) {
+        this.listeners = config.listeners ? config.listeners : config;
+    },
+
+    // Component passes itself into plugin&#39;s init method
+    init: function(c) {
+        var p, l = this.listeners;
+        for (p in l) {
+            if (Ext.isFunction(l[p])) {
+                l[p] = this.createHandler(l[p], c);
+            } else {
+                l[p].fn = this.createHandler(l[p].fn, c);
+            }
+        }
+
+        // Add the listeners to the Element immediately following the render call
+        c.render = c.render.{@link Function#createSequence createSequence}(function() {
+            var e = c.getEl();
+            if (e) {
+                e.on(l);
+            }
+        });
+    },
+
+    createHandler: function(fn, c) {
+        return function(e) {
+            fn.call(this, e, c);
+        };
+    }
+});
+
+var combo = new Ext.form.ComboBox({
+
+    // Collapse combo when its element is clicked on
+    plugins: [ new Ext.DomObserver({
+        click: function(evt, comp) {
+            comp.collapse();
+        }
+    })],
+    store: myStore,
+    typeAhead: true,
+    mode: 'local',
+    triggerAction: 'all'
+});
+     * </code></pre></p>
+     */
+    var me = this, e = me.events;
+    if(me.listeners){
+        me.on(me.listeners);
+        delete me.listeners;
+    }
+    me.events = e || {};
+};
+
+EXTUTIL.Observable.prototype = {
+    // private
+    filterOptRe : /^(?:scope|delay|buffer|single)$/,
+
+    /**
+     * <p>Fires the specified event with the passed parameters (minus the event name).</p>
+     * <p>An event may be set to bubble up an Observable parent hierarchy (See {@link Ext.Component#getBubbleTarget})
+     * by calling {@link #enableBubble}.</p>
+     * @param {String} eventName The name of the event to fire.
+     * @param {Object...} args Variable number of parameters are passed to handlers.
+     * @return {Boolean} returns false if any of the handlers return false otherwise it returns true.
+     */
+    fireEvent : function(){
+        var a = Array.prototype.slice.call(arguments, 0),
+            ename = a[0].toLowerCase(),
+            me = this,
+            ret = TRUE,
+            ce = me.events[ename],
+            cc,
+            q,
+            c;
+        if (me.eventsSuspended === TRUE) {
+            if (q = me.eventQueue) {
+                q.push(a);
+            }
+        }
+        else if(typeof ce == 'object') {
+            if (ce.bubble){
+                if(ce.fire.apply(ce, a.slice(1)) === FALSE) {
+                    return FALSE;
+                }
+                c = me.getBubbleTarget && me.getBubbleTarget();
+                if(c && c.enableBubble) {
+                    cc = c.events[ename];
+                    if(!cc || typeof cc != 'object' || !cc.bubble) {
+                        c.enableBubble(ename);
+                    }
+                    return c.fireEvent.apply(c, a);
+                }
+            }
+            else {
+                a.shift();
+                ret = ce.fire.apply(ce, a);
+            }
+        }
+        return ret;
+    },
+
+    /**
+     * Appends an event handler to this object.
+     * @param {String}   eventName The name of the event to listen for.
+     * @param {Function} handler The method the event invokes.
+     * @param {Object}   scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b>
+     * @param {Object}   options (optional) An object containing handler configuration.
+     * properties. This may contain any of the following properties:<ul>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to the object which fired the event.</b></div></li>
+     * <li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * <li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
+     * if the event was bubbled up from a child Observable.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * Using the options argument, it is possible to combine different types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener.
+     * <pre><code>
+myDataView.on('click', this.onClick, this, {
+single: true,
+delay: 100
+});</code></pre>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.
+     * <p>
+     * <pre><code>
+myGridPanel.on({
+'click' : {
+    fn: this.onClick,
+    scope: this,
+    delay: 100
+},
+'mouseover' : {
+    fn: this.onMouseOver,
+    scope: this
+},
+'mouseout' : {
+    fn: this.onMouseOut,
+    scope: this
+}
+});</code></pre>
+ * <p>
+ * Or a shorthand syntax:<br>
+ * <pre><code>
+myGridPanel.on({
+'click' : this.onClick,
+'mouseover' : this.onMouseOver,
+'mouseout' : this.onMouseOut,
+ scope: this
+});</code></pre>
+     */
+    addListener : function(eventName, fn, scope, o){
+        var me = this,
+            e,
+            oe,
+            ce;
+            
+        if (typeof eventName == 'object') {
+            o = eventName;
+            for (e in o) {
+                oe = o[e];
+                if (!me.filterOptRe.test(e)) {
+                    me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o);
+                }
+            }
+        } else {
+            eventName = eventName.toLowerCase();
+            ce = me.events[eventName] || TRUE;
+            if (typeof ce == 'boolean') {
+                me.events[eventName] = ce = new EXTUTIL.Event(me, eventName);
+            }
+            ce.addListener(fn, scope, typeof o == 'object' ? o : {});
+        }
+    },
+
+    /**
+     * Removes an event handler.
+     * @param {String}   eventName The type of event the handler was associated with.
+     * @param {Function} handler   The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object}   scope     (optional) The scope originally specified for the handler.
+     */
+    removeListener : function(eventName, fn, scope){
+        var ce = this.events[eventName.toLowerCase()];
+        if (typeof ce == 'object') {
+            ce.removeListener(fn, scope);
+        }
+    },
+
+    /**
+     * Removes all listeners for this object
+     */
+    purgeListeners : function(){
+        var events = this.events,
+            evt,
+            key;
+        for(key in events){
+            evt = events[key];
+            if(typeof evt == 'object'){
+                evt.clearListeners();
+            }
+        }
+    },
+
+    /**
+     * Adds the specified events to the list of events which this Observable may fire.
+     * @param {Object|String} o Either an object with event names as properties with a value of <code>true</code>
+     * or the first event name string if multiple event names are being passed as separate parameters.
+     * @param {string} Optional. Event name if multiple event names are being passed as separate parameters.
+     * Usage:<pre><code>
+this.addEvents('storeloaded', 'storecleared');
+</code></pre>
+     */
+    addEvents : function(o){
+        var me = this;
+        me.events = me.events || {};
+        if (typeof o == 'string') {
+            var a = arguments,
+                i = a.length;
+            while(i--) {
+                me.events[a[i]] = me.events[a[i]] || TRUE;
+            }
+        } else {
+            Ext.applyIf(me.events, o);
+        }
+    },
+
+    /**
+     * Checks to see if this object has any listeners for a specified event
+     * @param {String} eventName The name of the event to check for
+     * @return {Boolean} True if the event is being listened for, else false
+     */
+    hasListener : function(eventName){
+        var e = this.events[eventName.toLowerCase()];
+        return typeof e == 'object' && e.listeners.length > 0;
+    },
+
+    /**
+     * Suspend the firing of all events. (see {@link #resumeEvents})
+     * @param {Boolean} queueSuspended Pass as true to queue up suspended events to be fired
+     * after the {@link #resumeEvents} call instead of discarding all suspended events;
+     */
+    suspendEvents : function(queueSuspended){
+        this.eventsSuspended = TRUE;
+        if(queueSuspended && !this.eventQueue){
+            this.eventQueue = [];
+        }
+    },
+
+    /**
+     * Resume firing events. (see {@link #suspendEvents})
+     * If events were suspended using the <tt><b>queueSuspended</b></tt> parameter, then all
+     * events fired during event suspension will be sent to any listeners now.
+     */
+    resumeEvents : function(){
+        var me = this,
+            queued = me.eventQueue || [];
+        me.eventsSuspended = FALSE;
+        delete me.eventQueue;
+        EACH(queued, function(e) {
+            me.fireEvent.apply(me, e);
+        });
+    }
+};
+
+var OBSERVABLE = EXTUTIL.Observable.prototype;
+/**
+ * Appends an event handler to this object (shorthand for {@link #addListener}.)
+ * @param {String}   eventName     The type of event to listen for
+ * @param {Function} handler       The method the event invokes
+ * @param {Object}   scope         (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+ * <b>If omitted, defaults to the object which fired the event.</b>
+ * @param {Object}   options       (optional) An object containing handler configuration.
+ * @method
+ */
+OBSERVABLE.on = OBSERVABLE.addListener;
+/**
+ * Removes an event handler (shorthand for {@link #removeListener}.)
+ * @param {String}   eventName     The type of event the handler was associated with.
+ * @param {Function} handler       The handler to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object}   scope         (optional) The scope originally specified for the handler.
+ * @method
+ */
+OBSERVABLE.un = OBSERVABLE.removeListener;
+
+/**
+ * Removes <b>all</b> added captures from the Observable.
+ * @param {Observable} o The Observable to release
+ * @static
+ */
+EXTUTIL.Observable.releaseCapture = function(o){
+    o.fireEvent = OBSERVABLE.fireEvent;
+};
+
+function createTargeted(h, o, scope){
+    return function(){
+        if(o.target == arguments[0]){
+            h.apply(scope, Array.prototype.slice.call(arguments, 0));
+        }
+    };
+};
+
+function createBuffered(h, o, l, scope){
+    l.task = new EXTUTIL.DelayedTask();
+    return function(){
+        l.task.delay(o.buffer, h, scope, Array.prototype.slice.call(arguments, 0));
+    };
+};
+
+function createSingle(h, e, fn, scope){
+    return function(){
+        e.removeListener(fn, scope);
+        return h.apply(scope, arguments);
+    };
+};
+
+function createDelayed(h, o, l, scope){
+    return function(){
+        var task = new EXTUTIL.DelayedTask(),
+            args = Array.prototype.slice.call(arguments, 0);
+        if(!l.tasks) {
+            l.tasks = [];
+        }
+        l.tasks.push(task);
+        task.delay(o.delay || 10, function(){
+            l.tasks.remove(task);
+            h.apply(scope, args);
+        }, scope);
+    };
+};
+
+EXTUTIL.Event = function(obj, name){
+    this.name = name;
+    this.obj = obj;
+    this.listeners = [];
+};
+
+EXTUTIL.Event.prototype = {
+    addListener : function(fn, scope, options){
+        var me = this,
+            l;
+        scope = scope || me.obj;
+        if(!me.isListening(fn, scope)){
+            l = me.createListener(fn, scope, options);
+            if(me.firing){ // if we are currently firing this event, don't disturb the listener loop
+                me.listeners = me.listeners.slice(0);
+            }
+            me.listeners.push(l);
+        }
+    },
+
+    createListener: function(fn, scope, o){
+        o = o || {};
+        scope = scope || this.obj;
+        var l = {
+            fn: fn,
+            scope: scope,
+            options: o
+        }, h = fn;
+        if(o.target){
+            h = createTargeted(h, o, scope);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, l, scope);
+        }
+        if(o.single){
+            h = createSingle(h, this, fn, scope);
+        }
+        if(o.buffer){
+            h = createBuffered(h, o, l, scope);
+        }
+        l.fireFn = h;
+        return l;
+    },
+
+    findListener : function(fn, scope){
+        var list = this.listeners,
+            i = list.length,
+            l;
+
+        scope = scope || this.obj;
+        while(i--){
+            l = list[i];
+            if(l){
+                if(l.fn == fn && l.scope == scope){
+                    return i;
+                }
+            }
+        }
+        return -1;
+    },
+
+    isListening : function(fn, scope){
+        return this.findListener(fn, scope) != -1;
+    },
+
+    removeListener : function(fn, scope){
+        var index,
+            l,
+            k,
+            me = this,
+            ret = FALSE;
+        if((index = me.findListener(fn, scope)) != -1){
+            if (me.firing) {
+                me.listeners = me.listeners.slice(0);
+            }
+            l = me.listeners[index];
+            if(l.task) {
+                l.task.cancel();
+                delete l.task;
+            }
+            k = l.tasks && l.tasks.length;
+            if(k) {
+                while(k--) {
+                    l.tasks[k].cancel();
+                }
+                delete l.tasks;
+            }
+            me.listeners.splice(index, 1);
+            ret = TRUE;
+        }
+        return ret;
+    },
+
+    // Iterate to stop any buffered/delayed events
+    clearListeners : function(){
+        var me = this,
+            l = me.listeners,
+            i = l.length;
+        while(i--) {
+            me.removeListener(l[i].fn, l[i].scope);
+        }
+    },
+
+    fire : function(){
+        var me = this,
+            listeners = me.listeners,
+            len = listeners.length,
+            i = 0,
+            l;
+
+        if(len > 0){
+            me.firing = TRUE;
+            var args = Array.prototype.slice.call(arguments, 0);
+            for (; i < len; i++) {
+                l = listeners[i];
+                if(l && l.fireFn.apply(l.scope || me.obj || window, args) === FALSE) {
+                    return (me.firing = FALSE);
+                }
+            }
+        }
+        me.firing = FALSE;
+        return TRUE;
+    }
+
+};
+})();
+/**
+ * @class Ext.DomHelper
+ * <p>The DomHelper class provides a layer of abstraction from DOM and transparently supports creating
+ * elements via DOM or using HTML fragments. It also has the ability to create HTML fragment templates
+ * from your DOM building code.</p>
+ *
+ * <p><b><u>DomHelper element specification object</u></b></p>
+ * <p>A specification object is used when creating elements. Attributes of this object
+ * are assumed to be element attributes, except for 4 special attributes:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>tag</tt></b> : <div class="sub-desc">The tag name of the element</div></li>
+ * <li><b><tt>children</tt></b> : or <tt>cn</tt><div class="sub-desc">An array of the
+ * same kind of element definition objects to be created and appended. These can be nested
+ * as deep as you want.</div></li>
+ * <li><b><tt>cls</tt></b> : <div class="sub-desc">The class attribute of the element.
+ * This will end up being either the "class" attribute on a HTML fragment or className
+ * for a DOM node, depending on whether DomHelper is using fragments or DOM.</div></li>
+ * <li><b><tt>html</tt></b> : <div class="sub-desc">The innerHTML for the element</div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Insertion methods</u></b></p>
+ * <p>Commonly used insertion methods:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #append}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertBefore}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertAfter}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #overwrite}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #createTemplate}</tt></b> : <div class="sub-desc"></div></li>
+ * <li><b><tt>{@link #insertHtml}</tt></b> : <div class="sub-desc"></div></li>
+ * </ul></div></p>
+ *
+ * <p><b><u>Example</u></b></p>
+ * <p>This is an example, where an unordered list with 3 children items is appended to an existing
+ * element with id <tt>'my-div'</tt>:<br>
+ <pre><code>
+var dh = Ext.DomHelper; // create shorthand alias
+// specification object
+var spec = {
+    id: 'my-ul',
+    tag: 'ul',
+    cls: 'my-list',
+    // append children after creating
+    children: [     // may also specify 'cn' instead of 'children'
+        {tag: 'li', id: 'item0', html: 'List Item 0'},
+        {tag: 'li', id: 'item1', html: 'List Item 1'},
+        {tag: 'li', id: 'item2', html: 'List Item 2'}
+    ]
+};
+var list = dh.append(
+    'my-div', // the context element 'my-div' can either be the id or the actual node
+    spec      // the specification object
+);
+ </code></pre></p>
+ * <p>Element creation specification parameters in this class may also be passed as an Array of
+ * specification objects. This can be used to insert multiple sibling nodes into an existing
+ * container very efficiently. For example, to add more list items to the example above:<pre><code>
+dh.append('my-ul', [
+    {tag: 'li', id: 'item3', html: 'List Item 3'},
+    {tag: 'li', id: 'item4', html: 'List Item 4'}
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Templating</u></b></p>
+ * <p>The real power is in the built-in templating. Instead of creating or appending any elements,
+ * <tt>{@link #createTemplate}</tt> returns a Template object which can be used over and over to
+ * insert new elements. Revisiting the example above, we could utilize templating this time:
+ * <pre><code>
+// create the node
+var list = dh.append('my-div', {tag: 'ul', cls: 'my-list'});
+// get template
+var tpl = dh.createTemplate({tag: 'li', id: 'item{0}', html: 'List Item {0}'});
+
+for(var i = 0; i < 5, i++){
+    tpl.append(list, [i]); // use template to append to the actual node
+}
+ * </code></pre></p>
+ * <p>An example using a template:<pre><code>
+var html = '<a id="{0}" href="{1}" class="nav">{2}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', ['link1', 'http://www.jackslocum.com/', "Jack&#39;s Site"]);
+tpl.append('blog-roll', ['link2', 'http://www.dustindiaz.com/', "Dustin&#39;s Site"]);
+ * </code></pre></p>
+ *
+ * <p>The same example using named parameters:<pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.append('blog-roll', {
+    id: 'link1',
+    url: 'http://www.jackslocum.com/',
+    text: "Jack&#39;s Site"
+});
+tpl.append('blog-roll', {
+    id: 'link2',
+    url: 'http://www.dustindiaz.com/',
+    text: "Dustin&#39;s Site"
+});
+ * </code></pre></p>
+ *
+ * <p><b><u>Compiling Templates</u></b></p>
+ * <p>Templates are applied using regular expressions. The performance is great, but if
+ * you are adding a bunch of DOM elements using the same template, you can increase
+ * performance even further by {@link Ext.Template#compile "compiling"} the template.
+ * The way "{@link Ext.Template#compile compile()}" works is the template is parsed and
+ * broken up at the different variable points and a dynamic function is created and eval'ed.
+ * The generated function performs string concatenation of these parts and the passed
+ * variables instead of using regular expressions.
+ * <pre><code>
+var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
+
+var tpl = new Ext.DomHelper.createTemplate(html);
+tpl.compile();
+
+//... use template like normal
+ * </code></pre></p>
+ *
+ * <p><b><u>Performance Boost</u></b></p>
+ * <p>DomHelper will transparently create HTML fragments when it can. Using HTML fragments instead
+ * of DOM can significantly boost performance.</p>
+ * <p>Element creation specification parameters may also be strings. If {@link #useDom} is <tt>false</tt>,
+ * then the string is used as innerHTML. If {@link #useDom} is <tt>true</tt>, a string specification
+ * results in the creation of a text node. Usage:</p>
+ * <pre><code>
+Ext.DomHelper.useDom = true; // force it to use DOM; reduces performance
+ * </code></pre>
+ * @singleton
+ */
+Ext.DomHelper = function(){
+    var tempTableEl = null,
+        emptyTags = /^(?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)$/i,
+        tableRe = /^table|tbody|tr|td$/i,
+        confRe = /tag|children|cn|html$/i,
+        tableElRe = /td|tr|tbody/i,
+        cssRe = /([a-z0-9-]+)\s*:\s*([^;\s]+(?:\s*[^;\s]+)*);?/gi,
+        endRe = /end/i,
+        pub,
+        // kill repeat to save bytes
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        ts = '<table>',
+        te = '</table>',
+        tbs = ts+'<tbody>',
+        tbe = '</tbody>'+te,
+        trs = tbs + '<tr>',
+        tre = '</tr>'+tbe;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        var newNode = pub.insertHtml(pos, Ext.getDom(el), createHtml(o));
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as innerHTML where available
+    function createHtml(o){
+        var b = '',
+            attr,
+            val,
+            key,
+            cn;
+
+        if(typeof o == "string"){
+            b = o;
+        } else if (Ext.isArray(o)) {
+            for (var i=0; i < o.length; i++) {
+                if(o[i]) {
+                    b += createHtml(o[i]);
+                }
+            };
+        } else {
+            b += '<' + (o.tag = o.tag || 'div');
+            for (attr in o) {
+                val = o[attr];
+                if(!confRe.test(attr)){
+                    if (typeof val == "object") {
+                        b += ' ' + attr + '="';
+                        for (key in val) {
+                            b += key + ':' + val[key] + ';';
+                        };
+                        b += '"';
+                    }else{
+                        b += ' ' + ({cls : 'class', htmlFor : 'for'}[attr] || attr) + '="' + val + '"';
+                    }
+                }
+            };
+            // Now either just close the tag or try to add children and close the tag.
+            if (emptyTags.test(o.tag)) {
+                b += '/>';
+            } else {
+                b += '>';
+                if ((cn = o.children || o.cn)) {
+                    b += createHtml(cn);
+                } else if(o.html){
+                    b += o.html;
+                }
+                b += '</' + o.tag + '>';
+            }
+        }
+        return b;
+    }
+
+    function ieTable(depth, s, h, e){
+        tempTableEl.innerHTML = [s, h, e].join('');
+        var i = -1,
+            el = tempTableEl,
+            ns;
+        while(++i < depth){
+            el = el.firstChild;
+        }
+//      If the result is multiple siblings, then encapsulate them into one fragment.
+        if(ns = el.nextSibling){
+            var df = document.createDocumentFragment();
+            while(el){
+                ns = el.nextSibling;
+                df.appendChild(el);
+                el = ns;
+            }
+            el = df;
+        }
+        return el;
+    }
+
+    /**
+     * @ignore
+     * Nasty code for IE's broken table implementation
+     */
+    function insertIntoTable(tag, where, el, html) {
+        var node,
+            before;
+
+        tempTableEl = tempTableEl || document.createElement('div');
+
+        if(tag == 'td' && (where == afterbegin || where == beforeend) ||
+           !tableElRe.test(tag) && (where == beforebegin || where == afterend)) {
+            return;
+        }
+        before = where == beforebegin ? el :
+                 where == afterend ? el.nextSibling :
+                 where == afterbegin ? el.firstChild : null;
+
+        if (where == beforebegin || where == afterend) {
+            el = el.parentNode;
+        }
+
+        if (tag == 'td' || (tag == 'tr' && (where == beforeend || where == afterbegin))) {
+            node = ieTable(4, trs, html, tre);
+        } else if ((tag == 'tbody' && (where == beforeend || where == afterbegin)) ||
+                   (tag == 'tr' && (where == beforebegin || where == afterend))) {
+            node = ieTable(3, tbs, html, tbe);
+        } else {
+            node = ieTable(2, ts, html, te);
+        }
+        el.insertBefore(node, before);
+        return node;
+    }
+
+    /**
+     * @ignore
+     * Fix for IE9 createContextualFragment missing method
+     */   
+    function createContextualFragment(html){
+        var div = document.createElement("div"),
+            fragment = document.createDocumentFragment(),
+            i = 0,
+            length, childNodes;
+        
+        div.innerHTML = html;
+        childNodes = div.childNodes;
+        length = childNodes.length;
+        
+        for (; i < length; i++) {
+            fragment.appendChild(childNodes[i].cloneNode(true));
+        }
+        
+        return fragment;
+    }
+    
+    pub = {
+        /**
+         * Returns the markup for the passed Element(s) config.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {String}
+         */
+        markup : function(o){
+            return createHtml(o);
+        },
+
+        /**
+         * Applies a style specification to an element.
+         * @param {String/HTMLElement} el The element to apply styles to
+         * @param {String/Object/Function} styles A style specification string e.g. 'width:100px', or object in the form {width:'100px'}, or
+         * a function which returns such a specification.
+         */
+        applyStyles : function(el, styles){
+            if (styles) {
+                var matches;
+
+                el = Ext.fly(el);
+                if (typeof styles == "function") {
+                    styles = styles.call();
+                }
+                if (typeof styles == "string") {
+                    /**
+                     * Since we're using the g flag on the regex, we need to set the lastIndex.
+                     * This automatically happens on some implementations, but not others, see:
+                     * http://stackoverflow.com/questions/2645273/javascript-regular-expression-literal-persists-between-function-calls
+                     * http://blog.stevenlevithan.com/archives/fixing-javascript-regexp
+                     */
+                    cssRe.lastIndex = 0;
+                    while ((matches = cssRe.exec(styles))) {
+                        el.setStyle(matches[1], matches[2]);
+                    }
+                } else if (typeof styles == "object") {
+                    el.setStyle(styles);
+                }
+            }
+        },
+        /**
+         * Inserts an HTML fragment into the DOM.
+         * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+         * @param {HTMLElement} el The context element
+         * @param {String} html The HTML fragment
+         * @return {HTMLElement} The new node
+         */
+        insertHtml : function(where, el, html){
+            var hash = {},
+                hashVal,
+                range,
+                rangeEl,
+                setStart,
+                frag,
+                rs;
+
+            where = where.toLowerCase();
+            // add these here because they are used in both branches of the condition.
+            hash[beforebegin] = ['BeforeBegin', 'previousSibling'];
+            hash[afterend] = ['AfterEnd', 'nextSibling'];
+
+            if (el.insertAdjacentHTML) {
+                if(tableRe.test(el.tagName) && (rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html))){
+                    return rs;
+                }
+                // add these two to the hash.
+                hash[afterbegin] = ['AfterBegin', 'firstChild'];
+                hash[beforeend] = ['BeforeEnd', 'lastChild'];
+                if ((hashVal = hash[where])) {
+                    el.insertAdjacentHTML(hashVal[0], html);
+                    return el[hashVal[1]];
+                }
+            } else {
+                range = el.ownerDocument.createRange();
+                setStart = 'setStart' + (endRe.test(where) ? 'After' : 'Before');
+                if (hash[where]) {
+                    range[setStart](el);
+                    if (!range.createContextualFragment) {
+                        frag = createContextualFragment(html);
+                    }
+                    else {
+                        frag = range.createContextualFragment(html);
+                    }
+                    el.parentNode.insertBefore(frag, where == beforebegin ? el : el.nextSibling);
+                    return el[(where == beforebegin ? 'previous' : 'next') + 'Sibling'];
+                } else {
+                    rangeEl = (where == afterbegin ? 'first' : 'last') + 'Child';
+                    if (el.firstChild) {
+                        range[setStart](el[rangeEl]);
+                        if (!range.createContextualFragment) {
+                            frag = createContextualFragment(html);
+                        }
+                        else {
+                            frag = range.createContextualFragment(html);
+                        }
+                        if(where == afterbegin){
+                            el.insertBefore(frag, el.firstChild);
+                        }else{
+                            el.appendChild(frag);
+                        }
+                    } else {
+                        el.innerHTML = html;
+                    }
+                    return el[rangeEl];
+                }
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        append : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) and overwrites the contents of el with them.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         */
+        overwrite : function(el, o, returnElement){
+            el = Ext.getDom(el);
+            el.innerHTML = createHtml(o);
+            return returnElement ? Ext.get(el.firstChild) : el.firstChild;
+        },
+
+        createHtml : createHtml
+    };
+    return pub;
+}();
+/**
+ * @class Ext.Template
+ * <p>Represents an HTML fragment template. Templates may be {@link #compile precompiled}
+ * for greater performance.</p>
+ * <p>For example usage {@link #Template see the constructor}.</p>
+ *
+ * @constructor
+ * An instance of this class may be created by passing to the constructor either
+ * a single argument, or multiple arguments:
+ * <div class="mdetail-params"><ul>
+ * <li><b>single argument</b> : String/Array
+ * <div class="sub-desc">
+ * The single argument may be either a String or an Array:<ul>
+ * <li><tt>String</tt> : </li><pre><code>
+var t = new Ext.Template("&lt;div>Hello {0}.&lt;/div>");
+t.{@link #append}('some-element', ['foo']);
+ * </code></pre>
+ * <li><tt>Array</tt> : </li>
+ * An Array will be combined with <code>join('')</code>.
+<pre><code>
+var t = new Ext.Template([
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name:trim} {value:ellipsis(10)}&lt;/span&gt;',
+    '&lt;/div&gt;',
+]);
+t.{@link #compile}();
+t.{@link #append}('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
+</code></pre>
+ * </ul></div></li>
+ * <li><b>multiple arguments</b> : String, Object, Array, ...
+ * <div class="sub-desc">
+ * Multiple arguments will be combined with <code>join('')</code>.
+ * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    // a configuration object:
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // See Notes below.
+    }
+);
+ * </code></pre>
+ * <p><b>Notes</b>:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>Formatting and <code>disableFormats</code> are not applicable for Ext Core.</li>
+ * <li>For a list of available format functions, see {@link Ext.util.Format}.</li>
+ * <li><code>disableFormats</code> reduces <code>{@link #apply}</code> time
+ * when no formatting is required.</li>
+ * </ul></div>
+ * </div></li>
+ * </ul></div>
+ * @param {Mixed} config
+ */
+Ext.Template = function(html){
+    var me = this,
+        a = arguments,
+        buf = [],
+        v;
+
+    if (Ext.isArray(html)) {
+        html = html.join("");
+    } else if (a.length > 1) {
+        for(var i = 0, len = a.length; i < len; i++){
+            v = a[i];
+            if(typeof v == 'object'){
+                Ext.apply(me, v);
+            } else {
+                buf.push(v);
+            }
+        };
+        html = buf.join('');
+    }
+
+    /**@private*/
+    me.html = html;
+    /**
+     * @cfg {Boolean} compiled Specify <tt>true</tt> to compile the template
+     * immediately (see <code>{@link #compile}</code>).
+     * Defaults to <tt>false</tt>.
+     */
+    if (me.compiled) {
+        me.compile();
+    }
+};
+Ext.Template.prototype = {
+    /**
+     * @cfg {RegExp} re The regular expression used to match template variables.
+     * Defaults to:<pre><code>
+     * re : /\{([\w\-]+)\}/g                                     // for Ext Core
+     * re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g      // for Ext JS
+     * </code></pre>
+     */
+    re : /\{([\w\-]+)\}/g,
+    /**
+     * See <code>{@link #re}</code>.
+     * @type RegExp
+     * @property re
+     */
+
+    /**
+     * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        var me = this;
+
+        return me.compiled ?
+                me.compiled(values) :
+                me.html.replace(me.re, function(m, name){
+                    return values[name] !== undefined ? values[name] : "";
+                });
+    },
+
+    /**
+     * Sets the HTML used as the template and optionally compiles it.
+     * @param {String} html
+     * @param {Boolean} compile (optional) True to compile the template (defaults to undefined)
+     * @return {Ext.Template} this
+     */
+    set : function(html, compile){
+        var me = this;
+        me.html = html;
+        me.compiled = null;
+        return compile ? me.compile() : me;
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     */
+    compile : function(){
+        var me = this,
+            sep = Ext.isGecko ? "+" : ",";
+
+        function fn(m, name){
+            name = "values['" + name + "']";
+            return "'"+ sep + '(' + name + " == undefined ? '' : " + name + ')' + sep + "'";
+        }
+
+        eval("this.compiled = function(values){ return " + (Ext.isGecko ? "'" : "['") +
+             me.html.replace(/\\/g, '\\\\').replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn) +
+             (Ext.isGecko ?  "';};" : "'].join('');};"));
+        return me;
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) as the first child of el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertFirst: function(el, values, returnElement){
+        return this.doInsert('afterBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) before el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertBefore: function(el, values, returnElement){
+        return this.doInsert('beforeBegin', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) after el.
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    insertAfter : function(el, values, returnElement){
+        return this.doInsert('afterEnd', el, values, returnElement);
+    },
+
+    /**
+     * Applies the supplied <code>values</code> to the template and appends
+     * the new node(s) to the specified <code>el</code>.
+     * <p>For example usage {@link #Template see the constructor}.</p>
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values
+     * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+     * or an object (i.e. <code>{foo: 'bar'}</code>).
+     * @param {Boolean} returnElement (optional) true to return an Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    append : function(el, values, returnElement){
+        return this.doInsert('beforeEnd', el, values, returnElement);
+    },
+
+    doInsert : function(where, el, values, returnEl){
+        el = Ext.getDom(el);
+        var newNode = Ext.DomHelper.insertHtml(where, el, this.applyTemplate(values));
+        return returnEl ? Ext.get(newNode, true) : newNode;
+    },
+
+    /**
+     * Applies the supplied values to the template and overwrites the content of el with the new node(s).
+     * @param {Mixed} el The context element
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {Boolean} returnElement (optional) true to return a Ext.Element (defaults to undefined)
+     * @return {HTMLElement/Ext.Element} The new node or Element
+     */
+    overwrite : function(el, values, returnElement){
+        el = Ext.getDom(el);
+        el.innerHTML = this.applyTemplate(values);
+        return returnElement ? Ext.get(el.firstChild, true) : el.firstChild;
+    }
+};
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified <code>values</code> applied.
+ * @param {Object/Array} values
+ * The template values. Can be an array if the params are numeric (i.e. <code>{0}</code>)
+ * or an object (i.e. <code>{foo: 'bar'}</code>).
+ * @return {String} The HTML fragment
+ * @member Ext.Template
+ * @method apply
+ */
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @param {Object} config A configuration object
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.Template.from = function(el, config){
+    el = Ext.getDom(el);
+    return new Ext.Template(el.value || el.innerHTML, config || '');
+};
+/*
+ * This is code is also distributed under MIT license for use
+ * with jQuery and prototype JavaScript libraries.
+ */
+/**
+ * @class Ext.DomQuery
+Provides high performance selector/xpath processing by compiling queries into reusable functions. New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).
+<p>
+DomQuery supports most of the <a href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#selectors">CSS3 selectors spec</a>, along with some custom selectors and basic XPath.</p>
+
+<p>
+All selectors, attribute filters and pseudos below can be combined infinitely in any order. For example "div.foo:nth-child(odd)[@foo=bar].bar:first" would be a perfectly valid selector. Node filters are processed in the order in which they appear, which allows you to optimize your queries for your document structure.
+</p>
+<h4>Element Selectors:</h4>
+<ul class="list">
+    <li> <b>*</b> any element</li>
+    <li> <b>E</b> an element with the tag E</li>
+    <li> <b>E F</b> All descendent elements of E that have the tag F</li>
+    <li> <b>E > F</b> or <b>E/F</b> all direct children elements of E that have the tag F</li>
+    <li> <b>E + F</b> all elements with the tag F that are immediately preceded by an element with the tag E</li>
+    <li> <b>E ~ F</b> all elements with the tag F that are preceded by a sibling element with the tag E</li>
+</ul>
+<h4>Attribute Selectors:</h4>
+<p>The use of &#64; and quotes are optional. For example, div[&#64;foo='bar'] is also a valid attribute selector.</p>
+<ul class="list">
+    <li> <b>E[foo]</b> has an attribute "foo"</li>
+    <li> <b>E[foo=bar]</b> has an attribute "foo" that equals "bar"</li>
+    <li> <b>E[foo^=bar]</b> has an attribute "foo" that starts with "bar"</li>
+    <li> <b>E[foo$=bar]</b> has an attribute "foo" that ends with "bar"</li>
+    <li> <b>E[foo*=bar]</b> has an attribute "foo" that contains the substring "bar"</li>
+    <li> <b>E[foo%=2]</b> has an attribute "foo" that is evenly divisible by 2</li>
+    <li> <b>E[foo!=bar]</b> attribute "foo" does not equal "bar"</li>
+</ul>
+<h4>Pseudo Classes:</h4>
+<ul class="list">
+    <li> <b>E:first-child</b> E is the first child of its parent</li>
+    <li> <b>E:last-child</b> E is the last child of its parent</li>
+    <li> <b>E:nth-child(<i>n</i>)</b> E is the <i>n</i>th child of its parent (1 based as per the spec)</li>
+    <li> <b>E:nth-child(odd)</b> E is an odd child of its parent</li>
+    <li> <b>E:nth-child(even)</b> E is an even child of its parent</li>
+    <li> <b>E:only-child</b> E is the only child of its parent</li>
+    <li> <b>E:checked</b> E is an element that is has a checked attribute that is true (e.g. a radio or checkbox) </li>
+    <li> <b>E:first</b> the first E in the resultset</li>
+    <li> <b>E:last</b> the last E in the resultset</li>
+    <li> <b>E:nth(<i>n</i>)</b> the <i>n</i>th E in the resultset (1 based)</li>
+    <li> <b>E:odd</b> shortcut for :nth-child(odd)</li>
+    <li> <b>E:even</b> shortcut for :nth-child(even)</li>
+    <li> <b>E:contains(foo)</b> E's innerHTML contains the substring "foo"</li>
+    <li> <b>E:nodeValue(foo)</b> E contains a textNode with a nodeValue that equals "foo"</li>
+    <li> <b>E:not(S)</b> an E element that does not match simple selector S</li>
+    <li> <b>E:has(S)</b> an E element that has a descendent that matches simple selector S</li>
+    <li> <b>E:next(S)</b> an E element whose next sibling matches simple selector S</li>
+    <li> <b>E:prev(S)</b> an E element whose previous sibling matches simple selector S</li>
+    <li> <b>E:any(S1|S2|S2)</b> an E element which matches any of the simple selectors S1, S2 or S3//\\</li>
+</ul>
+<h4>CSS Value Selectors:</h4>
+<ul class="list">
+    <li> <b>E{display=none}</b> css value "display" that equals "none"</li>
+    <li> <b>E{display^=none}</b> css value "display" that starts with "none"</li>
+    <li> <b>E{display$=none}</b> css value "display" that ends with "none"</li>
+    <li> <b>E{display*=none}</b> css value "display" that contains the substring "none"</li>
+    <li> <b>E{display%=2}</b> css value "display" that is evenly divisible by 2</li>
+    <li> <b>E{display!=none}</b> css value "display" that does not equal "none"</li>
+</ul>
+ * @singleton
+ */
+Ext.DomQuery = function(){
+    var cache = {}, 
+    	simpleCache = {}, 
+    	valueCache = {},
+    	nonSpace = /\S/,
+    	trimRe = /^\s+|\s+$/g,
+    	tplRe = /\{(\d+)\}/g,
+    	modeRe = /^(\s?[\/>+~]\s?|\s|$)/,
+    	tagTokenRe = /^(#)?([\w\-\*]+)/,
+    	nthRe = /(\d*)n\+?(\d*)/, 
+    	nthRe2 = /\D/,
+    	// This is for IE MSXML which does not support expandos.
+	// IE runs the same speed using setAttribute, however FF slows way down
+	// and Safari completely fails so they need to continue to use expandos.
+	isIE = window.ActiveXObject ? true : false,
+	key = 30803;
+    
+    // this eval is stop the compressor from
+    // renaming the variable to something shorter
+    eval("var batch = 30803;");    	
+
+    // Retrieve the child node from a particular
+    // parent at the specified index.
+    function child(parent, index){
+        var i = 0,
+            n = parent.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               if(++i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    }
+
+    // retrieve the next element node
+    function next(n){	
+        while((n = n.nextSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // retrieve the previous element node 
+    function prev(n){
+        while((n = n.previousSibling) && n.nodeType != 1);
+        return n;
+    }
+
+    // Mark each child node with a nodeIndex skipping and
+    // removing empty text nodes.
+    function children(parent){
+        var n = parent.firstChild,
+	    nodeIndex = -1,
+	    nextNode;
+	while(n){
+	    nextNode = n.nextSibling;
+	    // clean worthless empty nodes.
+	    if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+		parent.removeChild(n);
+	    }else{
+		// add an expando nodeIndex
+		n.nodeIndex = ++nodeIndex;
+	    }
+	    n = nextNode;
+	}
+	return this;
+    }
+
+
+    // nodeSet - array of nodes
+    // cls - CSS Class
+    function byClassName(nodeSet, cls){
+        if(!cls){
+            return nodeSet;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = nodeSet[i]; i++){
+            if((' '+ci.className+' ').indexOf(cls) != -1){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    };
+
+    function attrValue(n, attr){
+	// if its an array, use the first node.
+        if(!n.tagName && typeof n.length != "undefined"){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+
+        if(attr == "for"){
+            return n.htmlFor;
+        }
+        if(attr == "class" || attr == "className"){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+
+    };
+
+
+    // ns - nodes
+    // mode - false, /, >, +, ~
+    // tagName - defaults to "*"
+    function getNodes(ns, mode, tagName){
+        var result = [], ri = -1, cs;
+        if(!ns){
+            return result;
+        }
+        tagName = tagName || "*";
+	// convert to array
+        if(typeof ns.getElementsByTagName != "undefined"){
+            ns = [ns];
+        }
+	
+	// no mode specified, grab all elements by tagName
+	// at any depth
+        if(!mode){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                for(var j = 0, ci; ci = cs[j]; j++){
+                    result[++ri] = ci;
+                }
+            }
+	// Direct Child mode (/ or >)
+	// E > F or E/F all direct children elements of E that have the tag 	
+        } else if(mode == "/" || mode == ">"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, ni, cn; ni = ns[i]; i++){
+                cn = ni.childNodes;
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.nodeName == utag || cj.nodeName == tagName  || tagName == '*'){
+                        result[++ri] = cj;
+                    }
+                }
+            }
+	// Immediately Preceding mode (+)
+	// E + F all elements with the tag F that are immediately preceded by an element with the tag E
+        }else if(mode == "+"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling) && n.nodeType != 1);
+                if(n && (n.nodeName == utag || n.nodeName == tagName || tagName == '*')){
+                    result[++ri] = n;
+                }
+            }
+	// Sibling mode (~)
+	// E ~ F all elements with the tag F that are preceded by a sibling element with the tag E
+        }else if(mode == "~"){
+            var utag = tagName.toUpperCase();
+            for(var i = 0, n; n = ns[i]; i++){
+                while((n = n.nextSibling)){
+                    if (n.nodeName == utag || n.nodeName == tagName || tagName == '*'){
+                        result[++ri] = n;
+                    }
+                }
+            }
+        }
+        return result;
+    }
+
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var result = [], ri = -1;
+        tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase() == tagName){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byId(cs, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var result = [], ri = -1;
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci && ci.id == id){
+                result[++ri] = ci;
+                return result;
+            }
+        }
+        return result;
+    }
+
+    // operators are =, !=, ^=, $=, *=, %=, |= and ~=
+    // custom can be "{"
+    function byAttribute(cs, attr, value, op, custom){
+        var result = [], 
+            ri = -1, 
+            useGetStyle = custom == "{",	    
+            fn = Ext.DomQuery.operators[op],	    
+            a,
+            xml,
+            hasXml;
+            
+        for(var i = 0, ci; ci = cs[i]; i++){
+	    // skip non-element nodes.
+            if(ci.nodeType != 1){
+                continue;
+            }
+            // only need to do this for the first node
+            if(!hasXml){
+                xml = Ext.DomQuery.isXml(ci);
+                hasXml = true;
+            }
+	    
+            // we only need to change the property names if we're dealing with html nodes, not XML
+            if(!xml){
+                if(useGetStyle){
+                    a = Ext.DomQuery.getStyle(ci, attr);
+                } else if (attr == "class" || attr == "className"){
+                    a = ci.className;
+                } else if (attr == "for"){
+                    a = ci.htmlFor;
+                } else if (attr == "href"){
+		    // getAttribute href bug
+		    // http://www.glennjones.net/Post/809/getAttributehrefbug.htm
+                    a = ci.getAttribute("href", 2);
+                } else{
+                    a = ci.getAttribute(attr);
+                }
+            }else{
+                a = ci.getAttribute(attr);
+            }
+            if((fn && fn(a, value)) || (!fn && a)){
+                result[++ri] = ci;
+            }
+        }
+        return result;
+    }
+
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    }
+
+    function nodupIEXml(cs){
+        var d = ++key, 
+            r;
+        cs[0].setAttribute("_nodup", d);
+        r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!c.getAttribute("_nodup") != d){
+                c.setAttribute("_nodup", d);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].removeAttribute("_nodup");
+        }
+        return r;
+    }
+
+    function nodup(cs){
+        if(!cs){
+            return [];
+        }
+        var len = cs.length, c, i, r = cs, cj, ri = -1;
+        if(!len || typeof cs.nodeType != "undefined" || len == 1){
+            return cs;
+        }
+        if(isIE && typeof cs[0].selectSingleNode != "undefined"){
+            return nodupIEXml(cs);
+        }
+        var d = ++key;
+        cs[0]._nodup = d;
+        for(i = 1; c = cs[i]; i++){
+            if(c._nodup != d){
+                c._nodup = d;
+            }else{
+                r = [];
+                for(var j = 0; j < i; j++){
+                    r[++ri] = cs[j];
+                }
+                for(j = i+1; cj = cs[j]; j++){
+                    if(cj._nodup != d){
+                        cj._nodup = d;
+                        r[++ri] = cj;
+                    }
+                }
+                return r;
+            }
+        }
+        return r;
+    }
+
+    function quickDiffIEXml(c1, c2){
+        var d = ++key,
+            r = [];
+        for(var i = 0, len = c1.length; i < len; i++){
+            c1[i].setAttribute("_qdiff", d);
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i].getAttribute("_qdiff") != d){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+           c1[i].removeAttribute("_qdiff");
+        }
+        return r;
+    }
+
+    function quickDiff(c1, c2){
+        var len1 = c1.length,
+        	d = ++key,
+        	r = [];
+        if(!len1){
+            return c2;
+        }
+        if(isIE && typeof c1[0].selectSingleNode != "undefined"){
+            return quickDiffIEXml(c1, c2);
+        }        
+        for(var i = 0; i < len1; i++){
+            c1[i]._qdiff = d;
+        }        
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(c2[i]._qdiff != d){
+                r[r.length] = c2[i];
+            }
+        }
+        return r;
+    }
+
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, "*");
+        return byId(ns, id);
+    }
+
+    return {
+        getStyle : function(el, name){
+            return Ext.fly(el).getStyle(name);
+        },
+        /**
+         * Compiles a selector/xpath query into a reusable function. The returned function
+         * takes one parameter "root" (optional), which is the context node from where the query should start.
+         * @param {String} selector The selector/xpath query
+         * @param {String} type (optional) Either "select" (the default) or "simple" for a simple selector match
+         * @return {Function}
+         */
+        compile : function(path, type){
+            type = type || "select";
+
+    	    // setup fn preamble
+            var fn = ["var f = function(root){\n var mode; ++batch; var n = root || document;\n"],
+        		mode,		
+        		lastPath,
+            	matchers = Ext.DomQuery.matchers,
+            	matchersLn = matchers.length,
+            	modeMatch,
+            	// accept leading mode switch
+            	lmode = path.match(modeRe);
+            
+            if(lmode && lmode[1]){
+                fn[fn.length] = 'mode="'+lmode[1].replace(trimRe, "")+'";';
+                path = path.replace(lmode[1], "");
+            }
+	    
+            // strip leading slashes
+            while(path.substr(0, 1)=="/"){
+                path = path.substr(1);
+            }
+
+            while(path && lastPath != path){
+                lastPath = path;
+                var tokenMatch = path.match(tagTokenRe);
+                if(type == "select"){
+                    if(tokenMatch){
+			// ID Selector
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tokenMatch[2]+'");';			
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }else if(path.substr(0, 1) != '@'){
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+		// type of "simple"
+                }else{
+                    if(tokenMatch){
+                        if(tokenMatch[1] == "#"){
+                            fn[fn.length] = 'n = byId(n, "'+tokenMatch[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tokenMatch[2]+'");';
+                        }
+                        path = path.replace(tokenMatch[0], "");
+                    }
+                }
+                while(!(modeMatch = path.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < matchersLn; j++){
+                        var t = matchers[j];
+                        var m = path.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+				return m[i];
+			    });
+                            path = path.replace(m[0], "");
+                            matched = true;
+                            break;
+                        }
+                    }
+                    // prevent infinite loop on bad selector
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + path + '"';
+                    }
+                }
+                if(modeMatch[1]){
+                    fn[fn.length] = 'mode="'+modeMatch[1].replace(trimRe, "")+'";';
+                    path = path.replace(modeMatch[1], "");
+                }
+            }
+	    // close fn out
+            fn[fn.length] = "return nodup(n);\n}";
+	    
+	    // eval fn and return it
+            eval(fn.join(""));
+            return f;
+        },
+
+        /**
+         * Selects a group of elements.
+         * @param {String} selector The selector/xpath query (can be a comma separated list of selectors)
+         * @param {Node/String} root (optional) The start of the query (defaults to document).
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+	jsSelect: function(path, root, type){
+	    // set root to doc if not specified.
+	    root = root || document;
+	    
+            if(typeof root == "string"){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(","),
+            	results = [];
+		
+	    // loop over each selector
+            for(var i = 0, len = paths.length; i < len; i++){		
+                var subPath = paths[i].replace(trimRe, "");
+		// compile and place in cache
+                if(!cache[subPath]){
+                    cache[subPath] = Ext.DomQuery.compile(subPath);
+                    if(!cache[subPath]){
+                        throw subPath + " is not a valid selector";
+                    }
+                }
+                var result = cache[subPath](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+	    
+	    // if there were multiple selectors, make sure dups
+	    // are eliminated
+            if(paths.length > 1){
+                return nodup(results);
+            }
+            return results;
+        },
+	isXml: function(el) {
+	    var docEl = (el ? el.ownerDocument || el : 0).documentElement;
+	    return docEl ? docEl.nodeName !== "HTML" : false;
+	},
+        select : document.querySelectorAll ? function(path, root, type) {
+	    root = root || document;
+	    if (!Ext.DomQuery.isXml(root)) {
+		try {
+		    var cs = root.querySelectorAll(path);
+		    return Ext.toArray(cs);
+		}
+		catch (ex) {}		
+	    }	    
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	} : function(path, root, type) {
+	    return Ext.DomQuery.jsSelect.call(this, path, root, type);
+	},
+
+        /**
+         * Selects a single element.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Element} The DOM element which matched the selector.
+         */
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+
+        /**
+         * Selects the value of a node, optionally replacing null with the defaultValue.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {String} defaultValue
+         * @return {String}
+         */
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, "");
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, "select");
+            }
+            var n = valueCache[path](root), v;
+            n = n[0] ? n[0] : n;
+            	    
+	    // overcome a limitation of maximum textnode size
+	    // Rumored to potentially crash IE6 but has not been confirmed.
+	    // http://reference.sitepoint.com/javascript/Node/normalize
+	    // https://developer.mozilla.org/En/DOM/Node.normalize	    
+            if (typeof n.normalize == 'function') n.normalize();
+            
+            v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return ((v === null||v === undefined||v==='') ? defaultValue : v);
+        },
+
+        /**
+         * Selects the value of a node, parsing integers and floats. Returns the defaultValue, or 0 if none is specified.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {Number} defaultValue
+         * @return {Number}
+         */
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+
+        /**
+         * Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)
+         * @param {String/HTMLElement/Array} el An element id, element or array of elements
+         * @param {String} selector The simple selector to test
+         * @return {Boolean}
+         */
+        is : function(el, ss){
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            var isArray = Ext.isArray(el),
+            	result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+
+        /**
+         * Filters an array of elements to only include matches of a simple selector (e.g. div.some-class or span:first-child)
+         * @param {Array} el An array of elements to filter
+         * @param {String} selector The simple selector to test
+         * @param {Boolean} nonMatches If true, it returns the elements that DON'T match
+         * the selector instead of the ones that match
+         * @return {Array} An Array of DOM elements which match the selector. If there are
+         * no matches, and empty Array is returned.
+         */
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, "");
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, "simple");
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+
+        /**
+         * Collection of matching regular expressions and code snippets.
+         * Each capture group within () will be replace the {} in the select
+         * statement as specified by their index.
+         */
+        matchers : [{
+                re: /^\.([\w\-]+)/,
+                select: 'n = byClassName(n, " {1} ");'
+            }, {
+                re: /^\:([\w\-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w\-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w\-]+)/,
+                select: 'n = byId(n, "{1}");'
+            },{
+                re: /^@([\w\-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *=, %=, |= and ~=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c</i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            "=" : function(a, v){
+                return a == v;
+            },
+            "!=" : function(a, v){
+                return a != v;
+            },
+            "^=" : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            "$=" : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            "*=" : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            "%=" : function(a, v){
+                return (a % v) == 0;
+            },
+            "|=" : function(a, v){
+                return a && (a == v || a.substr(0, v.length+1) == v+'-');
+            },
+            "~=" : function(a, v){
+                return a && (' '+a+' ').indexOf(' '+v+' ') != -1;
+            }
+        },
+
+        /**
+         * <p>Object hash of "pseudo class" filter functions which are used when filtering selections. Each function is passed
+         * two parameters:</p><div class="mdetail-params"><ul>
+         * <li><b>c</b> : Array<div class="sub-desc">An Array of DOM elements to filter.</div></li>
+         * <li><b>v</b> : String<div class="sub-desc">The argument (if any) supplied in the selector.</div></li>
+         * </ul></div>
+         * <p>A filter function returns an Array of DOM elements which conform to the pseudo class.</p>
+         * <p>In addition to the provided pseudo classes listed above such as <code>first-child</code> and <code>nth-child</code>,
+         * developers may add additional, custom psuedo class filters to select elements according to application-specific requirements.</p>
+         * <p>For example, to filter <code>&lt;a></code> elements to only return links to <i>external</i> resources:</p>
+         * <code><pre>
+Ext.DomQuery.pseudos.external = function(c, v){
+    var r = [], ri = -1;
+    for(var i = 0, ci; ci = c[i]; i++){
+//      Include in result set only if it's a link to an external resource
+        if(ci.hostname != location.hostname){
+            r[++ri] = ci;
+        }
+    }
+    return r;
+};</pre></code>
+         * Then external links could be gathered with the following statement:<code><pre>
+var externalLinks = Ext.select("a:external");
+</code></pre>
+         */
+        pseudos : {
+            "first-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.previousSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "last-child" : function(c){
+                var r = [], ri = -1, n;
+                for(var i = 0, ci; ci = n = c[i]; i++){
+                    while((n = n.nextSibling) && n.nodeType != 1);
+                    if(!n){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nth-child" : function(c, a) {
+                var r = [], ri = -1,
+                	m = nthRe.exec(a == "even" && "2n" || a == "odd" && "2n+1" || !nthRe2.test(a) && "n+" + a || a),
+                	f = (m[1] || 1) - 0, l = m[2] - 0;
+                for(var i = 0, n; n = c[i]; i++){
+                    var pn = n.parentNode;
+                    if (batch != pn._batch) {
+                        var j = 0;
+                        for(var cn = pn.firstChild; cn; cn = cn.nextSibling){
+                            if(cn.nodeType == 1){
+                               cn.nodeIndex = ++j;
+                            }
+                        }
+                        pn._batch = batch;
+                    }
+                    if (f == 1) {
+                        if (l == 0 || n.nodeIndex == l){
+                            r[++ri] = n;
+                        }
+                    } else if ((n.nodeIndex + l) % f == 0){
+                        r[++ri] = n;
+                    }
+                }
+
+                return r;
+            },
+
+            "only-child" : function(c){
+                var r = [], ri = -1;;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(!prev(ci) && !next(ci)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "empty" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var cns = ci.childNodes, j = 0, cn, empty = true;
+                    while(cn = cns[j]){
+                        ++j;
+                        if(cn.nodeType == 1 || cn.nodeType == 3){
+                            empty = false;
+                            break;
+                        }
+                    }
+                    if(empty){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "contains" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if((ci.textContent||ci.innerText||'').indexOf(v) != -1){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "nodeValue" : function(c, v){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.firstChild && ci.firstChild.nodeValue == v){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "checked" : function(c){
+                var r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(ci.checked == true){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "not" : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+
+            "any" : function(c, selectors){
+                var ss = selectors.split('|'),
+                	r = [], ri = -1, s;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    for(var j = 0; s = ss[j]; j++){
+                        if(Ext.DomQuery.is(ci, s)){
+                            r[++ri] = ci;
+                            break;
+                        }
+                    }
+                }
+                return r;
+            },
+
+            "odd" : function(c){
+                return this["nth-child"](c, "odd");
+            },
+
+            "even" : function(c){
+                return this["nth-child"](c, "even");
+            },
+
+            "nth" : function(c, a){
+                return c[a-1] || [];
+            },
+
+            "first" : function(c){
+                return c[0] || [];
+            },
+
+            "last" : function(c){
+                return c[c.length-1] || [];
+            },
+
+            "has" : function(c, ss){
+                var s = Ext.DomQuery.select,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "next" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            },
+
+            "prev" : function(c, ss){
+                var is = Ext.DomQuery.is,
+                	r = [], ri = -1;
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[++ri] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
+/**
+ * @class Ext.util.DelayedTask
+ * <p> The DelayedTask class provides a convenient way to "buffer" the execution of a method,
+ * performing setTimeout where a new timeout cancels the old timeout. When called, the
+ * task will wait the specified time period before executing. If durng that time period,
+ * the task is called again, the original call will be cancelled. This continues so that
+ * the function is only called a single time for each iteration.</p>
+ * <p>This method is especially useful for things like detecting whether a user has finished
+ * typing in a text field. An example would be performing validation on a keypress. You can
+ * use this class to buffer the keypress events for a certain number of milliseconds, and
+ * perform only if they stop for that amount of time.  Usage:</p><pre><code>
+var task = new Ext.util.DelayedTask(function(){
+    alert(Ext.getDom('myInputField').value.length);
+});
+// Wait 500ms before calling our function. If the user presses another key 
+// during that 500ms, it will be cancelled and we'll wait another 500ms.
+Ext.get('myInputField').on('keypress', function(){
+    task.{@link #delay}(500); 
+});
+ * </code></pre> 
+ * <p>Note that we are using a DelayedTask here to illustrate a point. The configuration
+ * option <tt>buffer</tt> for {@link Ext.util.Observable#addListener addListener/on} will
+ * also setup a delayed task for you to buffer events.</p> 
+ * @constructor The parameters to this constructor serve as defaults and are not required.
+ * @param {Function} fn (optional) The default function to call.
+ * @param {Object} scope The default scope (The <code><b>this</b></code> reference) in which the
+ * function is called. If not specified, <code>this</code> will refer to the browser window.
+ * @param {Array} args (optional) The default Array of arguments.
+ */
+Ext.util.DelayedTask = function(fn, scope, args){
+    var me = this,
+    	id,    	
+    	call = function(){
+    		clearInterval(id);
+	        id = null;
+	        fn.apply(scope, args || []);
+	    };
+	    
+    /**
+     * Cancels any pending timeout and queues a new one
+     * @param {Number} delay The milliseconds to delay
+     * @param {Function} newFn (optional) Overrides function passed to constructor
+     * @param {Object} newScope (optional) Overrides scope passed to constructor. Remember that if no scope
+     * is specified, <code>this</code> will refer to the browser window.
+     * @param {Array} newArgs (optional) Overrides args passed to constructor
+     */
+    me.delay = function(delay, newFn, newScope, newArgs){
+        me.cancel();
+        fn = newFn || fn;
+        scope = newScope || scope;
+        args = newArgs || args;
+        id = setInterval(call, delay);
+    };
+
+    /**
+     * Cancel the last queued timeout
+     */
+    me.cancel = function(){
+        if(id){
+            clearInterval(id);
+            id = null;
+        }
+    };
+};/**
+ * @class Ext.Element
+ * <p>Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.</p>
+ * <p>All instances of this class inherit the methods of {@link Ext.Fx} making visual effects easily available to all DOM elements.</p>
+ * <p>Note that the events documented in this class are not Ext events, they encapsulate browser events. To
+ * access the underlying browser event, see {@link Ext.EventObject#browserEvent}. Some older
+ * browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.</p>
+ * Usage:<br>
+<pre><code>
+// by id
+var el = Ext.get("my-div");
+
+// by DOM element reference
+var el = Ext.get(myDivElement);
+</code></pre>
+ * <b>Animations</b><br />
+ * <p>When an element is manipulated, by default there is no animation.</p>
+ * <pre><code>
+var el = Ext.get("my-div");
+
+// no animation
+el.setWidth(100);
+ * </code></pre>
+ * <p>Many of the functions for manipulating an element have an optional "animate" parameter.  This
+ * parameter can be specified as boolean (<tt>true</tt>) for default animation effects.</p>
+ * <pre><code>
+// default animation
+el.setWidth(100, true);
+ * </code></pre>
+ *
+ * <p>To configure the effects, an object literal with animation options to use as the Element animation
+ * configuration object can also be specified. Note that the supported Element animation configuration
+ * options are a subset of the {@link Ext.Fx} animation options specific to Fx effects.  The supported
+ * Element animation configuration options are:</p>
+<pre>
+Option    Default   Description
+--------- --------  ---------------------------------------------
+{@link Ext.Fx#duration duration}  .35       The duration of the animation in seconds
+{@link Ext.Fx#easing easing}    easeOut   The easing method
+{@link Ext.Fx#callback callback}  none      A function to execute when the anim completes
+{@link Ext.Fx#scope scope}     this      The scope (this) of the callback function
+</pre>
+ *
+ * <pre><code>
+// Element animation options object
+var opt = {
+    {@link Ext.Fx#duration duration}: 1,
+    {@link Ext.Fx#easing easing}: 'elasticIn',
+    {@link Ext.Fx#callback callback}: this.foo,
+    {@link Ext.Fx#scope scope}: this
+};
+// animation with some options set
+el.setWidth(100, opt);
+ * </code></pre>
+ * <p>The Element animation object being used for the animation will be set on the options
+ * object as "anim", which allows you to stop or manipulate the animation. Here is an example:</p>
+ * <pre><code>
+// using the "anim" property to get the Anim object
+if(opt.anim.isAnimated()){
+    opt.anim.stop();
+}
+ * </code></pre>
+ * <p>Also see the <tt>{@link #animate}</tt> method for another animation technique.</p>
+ * <p><b> Composite (Collections of) Elements</b></p>
+ * <p>For working with collections of Elements, see {@link Ext.CompositeElement}</p>
+ * @constructor Create a new Element directly.
+ * @param {String/HTMLElement} element
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
+ */
+(function(){
+var DOC = document;
+
+Ext.Element = function(element, forceNew){
+    var dom = typeof element == "string" ?
+              DOC.getElementById(element) : element,
+        id;
+
+    if(!dom) return null;
+
+    id = dom.id;
+
+    if(!forceNew && id && Ext.elCache[id]){ // element object already exists
+        return Ext.elCache[id].el;
+    }
+
+    /**
+     * The DOM element
+     * @type HTMLElement
+     */
+    this.dom = dom;
+
+    /**
+     * The DOM element ID
+     * @type String
+     */
+    this.id = id || Ext.id(dom);
+};
+
+var DH = Ext.DomHelper,
+    El = Ext.Element,
+    EC = Ext.elCache;
+
+El.prototype = {
+    /**
+     * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
+     * @param {Object} o The object with the attributes
+     * @param {Boolean} useSet (optional) false to override the default setAttribute to use expandos.
+     * @return {Ext.Element} this
+     */
+    set : function(o, useSet){
+        var el = this.dom,
+            attr,
+            val,
+            useSet = (useSet !== false) && !!el.setAttribute;
+
+        for (attr in o) {
+            if (o.hasOwnProperty(attr)) {
+                val = o[attr];
+                if (attr == 'style') {
+                    DH.applyStyles(el, val);
+                } else if (attr == 'cls') {
+                    el.className = val;
+                } else if (useSet) {
+                    el.setAttribute(attr, val);
+                } else {
+                    el[attr] = val;
+                }
+            }
+        }
+        return this;
+    },
+
+//  Mouse events
+    /**
+     * @event click
+     * Fires when a mouse click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event contextmenu
+     * Fires when a right click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event dblclick
+     * Fires when a mouse double click is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousedown
+     * Fires when a mousedown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseup
+     * Fires when a mouseup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseover
+     * Fires when a mouseover is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mousemove
+     * Fires when a mousemove is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseout
+     * Fires when a mouseout is detected with the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseenter
+     * Fires when the mouse enters the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event mouseleave
+     * Fires when the mouse leaves the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Keyboard events
+    /**
+     * @event keypress
+     * Fires when a keypress is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keydown
+     * Fires when a keydown is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event keyup
+     * Fires when a keyup is detected within the element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+
+//  HTML frame/object events
+    /**
+     * @event load
+     * Fires when the user agent finishes loading all content within the element. Only supported by window, frames, objects and images.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event unload
+     * Fires when the user agent removes all content from a window or frame. For elements, it fires when the target element or any of its content has been removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event abort
+     * Fires when an object/image is stopped from loading before completely loaded.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event error
+     * Fires when an object/image/frame cannot be loaded properly.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event resize
+     * Fires when a document view is resized.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event scroll
+     * Fires when a document view is scrolled.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  Form events
+    /**
+     * @event select
+     * Fires when a user selects some text in a text field, including input and textarea.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event change
+     * Fires when a control loses the input focus and its value has been modified since gaining focus.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event submit
+     * Fires when a form is submitted.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event reset
+     * Fires when a form is reset.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event focus
+     * Fires when an element receives focus either via the pointing device or by tab navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event blur
+     * Fires when an element loses focus either via the pointing device or by tabbing navigation.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  User Interface events
+    /**
+     * @event DOMFocusIn
+     * Where supported. Similar to HTML focus event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMFocusOut
+     * Where supported. Similar to HTML blur event, but can be applied to any focusable element.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMActivate
+     * Where supported. Fires when an element is activated, for instance, through a mouse click or a keypress.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+//  DOM Mutation events
+    /**
+     * @event DOMSubtreeModified
+     * Where supported. Fires when the subtree is modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInserted
+     * Where supported. Fires when a node has been added as a child of another node.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemoved
+     * Where supported. Fires when a descendant node of the element is removed.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeRemovedFromDocument
+     * Where supported. Fires when a node is being removed from a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMNodeInsertedIntoDocument
+     * Where supported. Fires when a node is being inserted into a document.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMAttrModified
+     * Where supported. Fires when an attribute has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+    /**
+     * @event DOMCharacterDataModified
+     * Where supported. Fires when the character data has been modified.
+     * @param {Ext.EventObject} e The {@link Ext.EventObject} encapsulating the DOM event.
+     * @param {HtmlElement} t The target of the event.
+     * @param {Object} o The options configuration passed to the {@link #addListener} call.
+     */
+
+    /**
+     * The default unit to append to CSS values where a unit isn't provided (defaults to px).
+     * @type String
+     */
+    defaultUnit : "px",
+
+    /**
+     * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)
+     * @param {String} selector The simple selector to test
+     * @return {Boolean} True if this element matches the selector, else false
+     */
+    is : function(simpleSelector){
+        return Ext.DomQuery.is(this.dom, simpleSelector);
+    },
+
+    /**
+     * Tries to focus the element. Any exceptions are caught and ignored.
+     * @param {Number} defer (optional) Milliseconds to defer the focus
+     * @return {Ext.Element} this
+     */
+    focus : function(defer, /* private */ dom) {
+        var me = this,
+            dom = dom || me.dom;
+        try{
+            if(Number(defer)){
+                me.focus.defer(defer, null, [null, dom]);
+            }else{
+                dom.focus();
+            }
+        }catch(e){}
+        return me;
+    },
+
+    /**
+     * Tries to blur the element. Any exceptions are caught and ignored.
+     * @return {Ext.Element} this
+     */
+    blur : function() {
+        try{
+            this.dom.blur();
+        }catch(e){}
+        return this;
+    },
+
+    /**
+     * Returns the value of the "value" attribute
+     * @param {Boolean} asNumber true to parse the value as a number
+     * @return {String/Number}
+     */
+    getValue : function(asNumber){
+        var val = this.dom.value;
+        return asNumber ? parseInt(val, 10) : val;
+    },
+
+    /**
+     * Appends an event handler to this element.  The shorthand version {@link #on} is equivalent.
+     * @param {String} eventName The name of event to handle.
+     * @param {Function} fn The handler function the event invokes. This function is passed
+     * the following parameters:<ul>
+     * <li><b>evt</b> : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+     * <li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.
+     * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+     * <li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b>.
+     * @param {Object} options (optional) An object containing handler configuration properties.
+     * This may contain any of the following properties:<ul>
+     * <li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+     * <b>If omitted, defaults to this Element.</b></div></li>
+     * <li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>
+     * <li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+     * <li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>
+     * <li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>
+     * <li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+     * <li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+     * <li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+     * <li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+     * <li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+     * by the specified number of milliseconds. If the event fires again within that time, the original
+     * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+     * </ul><br>
+     * <p>
+     * <b>Combining Options</b><br>
+     * In the following examples, the shorthand form {@link #on} is used rather than the more verbose
+     * addListener.  The two are equivalent.  Using the options argument, it is possible to combine different
+     * types of listeners:<br>
+     * <br>
+     * A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the
+     * options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">
+     * Code:<pre><code>
+el.on('click', this.onClick, this, {
+    single: true,
+    delay: 100,
+    stopEvent : true,
+    forumId: 4
+});</code></pre></p>
+     * <p>
+     * <b>Attaching multiple handlers in 1 call</b><br>
+     * The method also allows for a single argument to be passed which is a config object containing properties
+     * which specify multiple handlers.</p>
+     * <p>
+     * Code:<pre><code>
+el.on({
+    'click' : {
+        fn: this.onClick,
+        scope: this,
+        delay: 100
+    },
+    'mouseover' : {
+        fn: this.onMouseOver,
+        scope: this
+    },
+    'mouseout' : {
+        fn: this.onMouseOut,
+        scope: this
+    }
+});</code></pre>
+     * <p>
+     * Or a shorthand syntax:<br>
+     * Code:<pre><code></p>
+el.on({
+    'click' : this.onClick,
+    'mouseover' : this.onMouseOver,
+    'mouseout' : this.onMouseOut,
+    scope: this
+});
+     * </code></pre></p>
+     * <p><b>delegate</b></p>
+     * <p>This is a configuration option that you can pass along when registering a handler for
+     * an event to assist with event delegation. Event delegation is a technique that is used to
+     * reduce memory consumption and prevent exposure to memory-leaks. By registering an event
+     * for a container element as opposed to each element within a container. By setting this
+     * configuration option to a simple selector, the target element will be filtered to look for
+     * a descendant of the target.
+     * For example:<pre><code>
+// using this markup:
+&lt;div id='elId'>
+    &lt;p id='p1'>paragraph one&lt;/p>
+    &lt;p id='p2' class='clickable'>paragraph two&lt;/p>
+    &lt;p id='p3'>paragraph three&lt;/p>
+&lt;/div>
+// utilize event delegation to registering just one handler on the container element:
+el = Ext.get('elId');
+el.on(
+    'click',
+    function(e,t) {
+        // handle click
+        console.info(t.id); // 'p2'
+    },
+    this,
+    {
+        // filter the target element to be a descendant with the class 'clickable'
+        delegate: '.clickable'
+    }
+);
+     * </code></pre></p>
+     * @return {Ext.Element} this
+     */
+    addListener : function(eventName, fn, scope, options){
+        Ext.EventManager.on(this.dom,  eventName, fn, scope || this, options);
+        return this;
+    },
+
+    /**
+     * Removes an event handler from this element.  The shorthand version {@link #un} is equivalent.
+     * <b>Note</b>: if a <i>scope</i> was explicitly specified when {@link #addListener adding} the
+     * listener, the same scope must be specified here.
+     * Example:
+     * <pre><code>
+el.removeListener('click', this.handlerFn);
+// or
+el.un('click', this.handlerFn);
+</code></pre>
+     * @param {String} eventName The name of the event from which to remove the handler.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @return {Ext.Element} this
+     */
+    removeListener : function(eventName, fn, scope){
+        Ext.EventManager.removeListener(this.dom,  eventName, fn, scope || this);
+        return this;
+    },
+
+    /**
+     * Removes all previous added listeners from this element
+     * @return {Ext.Element} this
+     */
+    removeAllListeners : function(){
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Recursively removes all previous added listeners from this element and its children
+     * @return {Ext.Element} this
+     */
+    purgeAllListeners : function() {
+        Ext.EventManager.purgeElement(this, true);
+        return this;
+    },
+    /**
+     * @private Test if size has a unit, otherwise appends the default
+     */
+    addUnits : function(size){
+        if(size === "" || size == "auto" || size === undefined){
+            size = size || '';
+        } else if(!isNaN(size) || !unitPattern.test(size)){
+            size = size + (this.defaultUnit || 'px');
+        }
+        return size;
+    },
+
+    /**
+     * <p>Updates the <a href="http://developer.mozilla.org/en/DOM/element.innerHTML">innerHTML</a> of this Element
+     * from a specified URL. Note that this is subject to the <a href="http://en.wikipedia.org/wiki/Same_origin_policy">Same Origin Policy</a></p>
+     * <p>Updating innerHTML of an element will <b>not</b> execute embedded <tt>&lt;script></tt> elements. This is a browser restriction.</p>
+     * @param {Mixed} options. Either a sring containing the URL from which to load the HTML, or an {@link Ext.Ajax#request} options object specifying
+     * exactly how to request the HTML.
+     * @return {Ext.Element} this
+     */
+    load : function(url, params, cb){
+        Ext.Ajax.request(Ext.apply({
+            params: params,
+            url: url.url || url,
+            callback: cb,
+            el: this.dom,
+            indicatorText: url.indicatorText || ''
+        }, Ext.isObject(url) ? url : {}));
+        return this;
+    },
+
+    /**
+     * Tests various css rules/browsers to determine if this element uses a border box
+     * @return {Boolean}
+     */
+    isBorderBox : function(){
+        return Ext.isBorderBox || Ext.isForcedBorderBox || noBoxAdjust[(this.dom.tagName || "").toLowerCase()];
+    },
+
+    /**
+     * <p>Removes this element's dom reference.  Note that event and cache removal is handled at {@link Ext#removeNode}</p>
+     */
+    remove : function(){
+        var me = this,
+            dom = me.dom;
+
+        if (dom) {
+            delete me.dom;
+            Ext.removeNode(dom);
+        }
+    },
+
+    /**
+     * Sets up event handlers to call the passed functions when the mouse is moved into and out of the Element.
+     * @param {Function} overFn The function to call when the mouse enters the Element.
+     * @param {Function} outFn The function to call when the mouse leaves the Element.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the functions are executed. Defaults to the Element's DOM element.
+     * @param {Object} options (optional) Options for the listener. See {@link Ext.util.Observable#addListener the <tt>options</tt> parameter}.
+     * @return {Ext.Element} this
+     */
+    hover : function(overFn, outFn, scope, options){
+        var me = this;
+        me.on('mouseenter', overFn, scope || me.dom, options);
+        me.on('mouseleave', outFn, scope || me.dom, options);
+        return me;
+    },
+
+    /**
+     * Returns true if this element is an ancestor of the passed element
+     * @param {HTMLElement/String} el The element to check
+     * @return {Boolean} True if this element is an ancestor of el, else false
+     */
+    contains : function(el){
+        return !el ? false : Ext.lib.Dom.isAncestor(this.dom, el.dom ? el.dom : el);
+    },
+
+    /**
+     * Returns the value of a namespaced attribute from the element's underlying DOM node.
+     * @param {String} namespace The namespace in which to look for the attribute
+     * @param {String} name The attribute name
+     * @return {String} The attribute value
+     * @deprecated
+     */
+    getAttributeNS : function(ns, name){
+        return this.getAttribute(name, ns);
+    },
+
+    /**
+     * Returns the value of an attribute from the element's underlying DOM node.
+     * @param {String} name The attribute name
+     * @param {String} namespace (optional) The namespace in which to look for the attribute
+     * @return {String} The attribute value
+     */
+    getAttribute: (function(){
+        var test = document.createElement('table'),
+            isBrokenOnTable = false,
+            hasGetAttribute = 'getAttribute' in test,
+            unknownRe = /undefined|unknown/;
+            
+        if (hasGetAttribute) {
+            
+            try {
+                test.getAttribute('ext:qtip');
+            } catch (e) {
+                isBrokenOnTable = true;
+            }
+            
+            return function(name, ns) {
+                var el = this.dom,
+                    value;
+                
+                if (el.getAttributeNS) {
+                    value  = el.getAttributeNS(ns, name) || null;
+                }
+            
+                if (value == null) {
+                    if (ns) {
+                        if (isBrokenOnTable && el.tagName.toUpperCase() == 'TABLE') {
+                            try {
+                                value = el.getAttribute(ns + ':' + name);
+                            } catch (e) {
+                                value = '';
+                            }
+                        } else {
+                            value = el.getAttribute(ns + ':' + name);
+                        }
+                    } else {
+                        value = el.getAttribute(name) || el[name];
+                    }
+                }
+                return value || '';
+            };
+        } else {
+            return function(name, ns) {
+                var el = this.om,
+                    value,
+                    attribute;
+                
+                if (ns) {
+                    attribute = el[ns + ':' + name];
+                    value = unknownRe.test(typeof attribute) ? undefined : attribute;
+                } else {
+                    value = el[name];
+                }
+                return value || '';
+            };
+        }
+        test = null;
+    })(),
+        
+    /**
+    * Update the innerHTML of this element
+    * @param {String} html The new HTML
+    * @return {Ext.Element} this
+     */
+    update : function(html) {
+        if (this.dom) {
+            this.dom.innerHTML = html;
+        }
+        return this;
+    }
+};
+
+var ep = El.prototype;
+
+El.addMethods = function(o){
+   Ext.apply(ep, o);
+};
+
+/**
+ * Appends an event handler (shorthand for {@link #addListener}).
+ * @param {String} eventName The name of event to handle.
+ * @param {Function} fn The handler function the event invokes.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+ * @param {Object} options (optional) An object containing standard {@link #addListener} options
+ * @member Ext.Element
+ * @method on
+ */
+ep.on = ep.addListener;
+
+/**
+ * Removes an event handler from this element (see {@link #removeListener} for additional notes).
+ * @param {String} eventName The name of the event from which to remove the handler.
+ * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+ * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+ * then this must refer to the same object.
+ * @return {Ext.Element} this
+ * @member Ext.Element
+ * @method un
+ */
+ep.un = ep.removeListener;
+
+/**
+ * true to automatically adjust width and height settings for box-model issues (default to true)
+ */
+ep.autoBoxAdjust = true;
+
+// private
+var unitPattern = /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i,
+    docEl;
+
+/**
+ * @private
+ */
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @static
+ * @member Ext.Element
+ * @method get
+ */
+El.get = function(el){
+    var ex,
+        elm,
+        id;
+    if(!el){ return null; }
+    if (typeof el == "string") { // element id
+        if (!(elm = DOC.getElementById(el))) {
+            return null;
+        }
+        if (EC[el] && EC[el].el) {
+            ex = EC[el].el;
+            ex.dom = elm;
+        } else {
+            ex = El.addToCache(new El(elm));
+        }
+        return ex;
+    } else if (el.tagName) { // dom element
+        if(!(id = el.id)){
+            id = Ext.id(el);
+        }
+        if (EC[id] && EC[id].el) {
+            ex = EC[id].el;
+            ex.dom = el;
+        } else {
+            ex = El.addToCache(new El(el));
+        }
+        return ex;
+    } else if (el instanceof El) {
+        if(el != docEl){
+            // refresh dom element in case no longer valid,
+            // catch case where it hasn't been appended
+
+            // If an el instance is passed, don't pass to getElementById without some kind of id
+            if (Ext.isIE && (el.id == undefined || el.id == '')) {
+                el.dom = el.dom;
+            } else {
+                el.dom = DOC.getElementById(el.id) || el.dom;
+            }
+        }
+        return el;
+    } else if(el.isComposite) {
+        return el;
+    } else if(Ext.isArray(el)) {
+        return El.select(el);
+    } else if(el == DOC) {
+        // create a bogus element object representing the document object
+        if(!docEl){
+            var f = function(){};
+            f.prototype = El.prototype;
+            docEl = new f();
+            docEl.dom = DOC;
+        }
+        return docEl;
+    }
+    return null;
+};
+
+El.addToCache = function(el, id){
+    id = id || el.id;
+    EC[id] = {
+        el:  el,
+        data: {},
+        events: {}
+    };
+    return el;
+};
+
+// private method for getting and setting element data
+El.data = function(el, key, value){
+    el = El.get(el);
+    if (!el) {
+        return null;
+    }
+    var c = EC[el.id].data;
+    if(arguments.length == 2){
+        return c[key];
+    }else{
+        return (c[key] = value);
+    }
+};
+
+// private
+// Garbage collection - uncache elements/purge listeners on orphaned elements
+// so we don't hold a reference and cause the browser to retain them
+function garbageCollect(){
+    if(!Ext.enableGarbageCollector){
+        clearInterval(El.collectorThreadId);
+    } else {
+        var eid,
+            el,
+            d,
+            o;
+
+        for(eid in EC){
+            o = EC[eid];
+            if(o.skipGC){
+                continue;
+            }
+            el = o.el;
+            d = el.dom;
+            // -------------------------------------------------------
+            // Determining what is garbage:
+            // -------------------------------------------------------
+            // !d
+            // dom node is null, definitely garbage
+            // -------------------------------------------------------
+            // !d.parentNode
+            // no parentNode == direct orphan, definitely garbage
+            // -------------------------------------------------------
+            // !d.offsetParent && !document.getElementById(eid)
+            // display none elements have no offsetParent so we will
+            // also try to look it up by it's id. However, check
+            // offsetParent first so we don't do unneeded lookups.
+            // This enables collection of elements that are not orphans
+            // directly, but somewhere up the line they have an orphan
+            // parent.
+            // -------------------------------------------------------
+            if(!d || !d.parentNode || (!d.offsetParent && !DOC.getElementById(eid))){
+                if(Ext.enableListenerCollection){
+                    Ext.EventManager.removeAll(d);
+                }
+                delete EC[eid];
+            }
+        }
+        // Cleanup IE Object leaks
+        if (Ext.isIE) {
+            var t = {};
+            for (eid in EC) {
+                t[eid] = EC[eid];
+            }
+            EC = Ext.elCache = t;
+        }
+    }
+}
+El.collectorThreadId = setInterval(garbageCollect, 30000);
+
+var flyFn = function(){};
+flyFn.prototype = El.prototype;
+
+// dom is optional
+El.Flyweight = function(dom){
+    this.dom = dom;
+};
+
+El.Flyweight.prototype = new flyFn();
+El.Flyweight.prototype.isFlyweight = true;
+El._flyweights = {};
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext.Element
+ * @method fly
+ */
+El.fly = function(el, named){
+    var ret = null;
+    named = named || '_global';
+
+    if (el = Ext.getDom(el)) {
+        (El._flyweights[named] = El._flyweights[named] || new El.Flyweight()).dom = el;
+        ret = El._flyweights[named];
+    }
+    return ret;
+};
+
+/**
+ * Retrieves Ext.Element objects.
+ * <p><b>This method does not retrieve {@link Ext.Component Component}s.</b> This method
+ * retrieves Ext.Element objects which encapsulate DOM elements. To retrieve a Component by
+ * its ID, use {@link Ext.ComponentMgr#get}.</p>
+ * <p>Uses simple caching to consistently return the same object. Automatically fixes if an
+ * object was recreated with the same id via AJAX or DOM.</p>
+ * Shorthand of {@link Ext.Element#get}
+ * @param {Mixed} el The id of the node, a DOM Node or an existing Element.
+ * @return {Element} The Element object (or null if no matching element was found)
+ * @member Ext
+ * @method get
+ */
+Ext.get = El.get;
+
+/**
+ * <p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+ * the dom node can be overwritten by other code. Shorthand of {@link Ext.Element#fly}</p>
+ * <p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+ * application code, or by Ext's classes. If accessing an element which will be processed regularly, then {@link Ext#get}
+ * will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p>
+ * @param {String/HTMLElement} el The dom node or id
+ * @param {String} named (optional) Allows for creation of named reusable flyweights to prevent conflicts
+ * (e.g. internally Ext uses "_global")
+ * @return {Element} The shared Element object (or null if no matching element was found)
+ * @member Ext
+ * @method fly
+ */
+Ext.fly = El.fly;
+
+// speedy lookup for elements never to box adjust
+var noBoxAdjust = Ext.isStrict ? {
+    select:1
+} : {
+    input:1, select:1, textarea:1
+};
+if(Ext.isIE || Ext.isGecko){
+    noBoxAdjust['button'] = 1;
+}
+
+})();
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+	var PARENTNODE = 'parentNode',
+		NEXTSIBLING = 'nextSibling',
+		PREVIOUSSIBLING = 'previousSibling',
+		DQ = Ext.DomQuery,
+		GET = Ext.get;
+	
+	return {
+		/**
+	     * Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to search as a number or element (defaults to 50 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParent : function(simpleSelector, maxDepth, returnEl){
+	        var p = this.dom,
+	        	b = document.body, 
+	        	depth = 0, 	        	
+	        	stopEl;	        
+            if(Ext.isGecko && Object.prototype.toString.call(p) == '[object XULElement]') {
+                return null;
+            }
+	        maxDepth = maxDepth || 50;
+	        if (isNaN(maxDepth)) {
+	            stopEl = Ext.getDom(maxDepth);
+	            maxDepth = Number.MAX_VALUE;
+	        }
+	        while(p && p.nodeType == 1 && depth < maxDepth && p != b && p != stopEl){
+	            if(DQ.is(p, simpleSelector)){
+	                return returnEl ? GET(p) : p;
+	            }
+	            depth++;
+	            p = p.parentNode;
+	        }
+	        return null;
+	    },
+	
+	    /**
+	     * Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+	     * @return {HTMLElement} The matching DOM node (or null if no match was found)
+	     */
+	    findParentNode : function(simpleSelector, maxDepth, returnEl){
+	        var p = Ext.fly(this.dom.parentNode, '_internal');
+	        return p ? p.findParent(simpleSelector, maxDepth, returnEl) : null;
+	    },
+	
+	    /**
+	     * Walks up the dom looking for a parent node that matches the passed simple selector (e.g. div.some-class or span:first-child).
+	     * This is a shortcut for findParentNode() that always returns an Ext.Element.
+	     * @param {String} selector The simple selector to test
+	     * @param {Number/Mixed} maxDepth (optional) The max depth to
+	            search as a number or element (defaults to 10 || document.body)
+	     * @return {Ext.Element} The matching DOM node (or null if no match was found)
+	     */
+	    up : function(simpleSelector, maxDepth){
+	        return this.findParentNode(simpleSelector, maxDepth, true);
+	    },
+	
+	    /**
+	     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {CompositeElement/CompositeElementLite} The composite element
+	     */
+	    select : function(selector){
+	        return Ext.Element.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects child nodes based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @return {Array} An array of the matched nodes
+	     */
+	    query : function(selector){
+	        return DQ.select(selector, this.dom);
+	    },
+	
+	    /**
+	     * Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    child : function(selector, returnDom){
+	        var n = DQ.selectNode(selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+	    /**
+	     * Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).
+	     * @param {String} selector The CSS selector
+	     * @param {Boolean} returnDom (optional) True to return the DOM node instead of Ext.Element (defaults to false)
+	     * @return {HTMLElement/Ext.Element} The child Ext.Element (or DOM node if returnDom = true)
+	     */
+	    down : function(selector, returnDom){
+	        var n = DQ.selectNode(" > " + selector, this.dom);
+	        return returnDom ? n : GET(n);
+	    },
+	
+		 /**
+	     * Gets the parent node for this element, optionally chaining up trying to match a selector
+	     * @param {String} selector (optional) Find a parent node that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The parent node or null
+		 */
+	    parent : function(selector, returnDom){
+	        return this.matchNode(PARENTNODE, PARENTNODE, selector, returnDom);
+	    },
+	
+	     /**
+	     * Gets the next sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The next sibling or null
+		 */
+	    next : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, NEXTSIBLING, selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the previous sibling, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The previous sibling or null
+		 */
+	    prev : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, PREVIOUSSIBLING, selector, returnDom);
+	    },
+	
+	
+	    /**
+	     * Gets the first child, skipping text nodes
+	     * @param {String} selector (optional) Find the next sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The first child or null
+		 */
+	    first : function(selector, returnDom){
+	        return this.matchNode(NEXTSIBLING, 'firstChild', selector, returnDom);
+	    },
+	
+	    /**
+	     * Gets the last child, skipping text nodes
+	     * @param {String} selector (optional) Find the previous sibling that matches the passed simple selector
+	     * @param {Boolean} returnDom (optional) True to return a raw dom node instead of an Ext.Element
+	     * @return {Ext.Element/HTMLElement} The last child or null
+		 */
+	    last : function(selector, returnDom){
+	        return this.matchNode(PREVIOUSSIBLING, 'lastChild', selector, returnDom);
+	    },
+	    
+	    matchNode : function(dir, start, selector, returnDom){
+	        var n = this.dom[start];
+	        while(n){
+	            if(n.nodeType == 1 && (!selector || DQ.is(n, selector))){
+	                return !returnDom ? GET(n) : n;
+	            }
+	            n = n[dir];
+	        }
+	        return null;
+	    }	
+    };
+}());/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {
+	    /**
+	     * Appends the passed element(s) to this element
+	     * @param {String/HTMLElement/Array/Element/CompositeElement} el
+	     * @return {Ext.Element} this
+	     */
+	    appendChild: function(el){        
+	        return GET(el).appendTo(this);        
+	    },
+	
+	    /**
+	     * Appends this element to the passed element
+	     * @param {Mixed} el The new parent element
+	     * @return {Ext.Element} this
+	     */
+	    appendTo: function(el){        
+	        GETDOM(el).appendChild(this.dom);        
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element before the passed element in the DOM
+	     * @param {Mixed} el The element before which this element will be inserted
+	     * @return {Ext.Element} this
+	     */
+	    insertBefore: function(el){  	          
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts this element after the passed element in the DOM
+	     * @param {Mixed} el The element to insert after
+	     * @return {Ext.Element} this
+	     */
+	    insertAfter: function(el){
+	        (el = GETDOM(el)).parentNode.insertBefore(this.dom, el.nextSibling);
+	        return this;
+	    },
+	
+	    /**
+	     * Inserts (or creates) an element (or DomHelper config) as the first child of this element
+	     * @param {Mixed/Object} el The id or element to insert or a DomHelper config to create and insert
+	     * @return {Ext.Element} The new child
+	     */
+	    insertFirst: function(el, returnDom){
+            el = el || {};
+            if(el.nodeType || el.dom || typeof el == 'string'){ // element
+                el = GETDOM(el);
+                this.dom.insertBefore(el, this.dom.firstChild);
+                return !returnDom ? GET(el) : el;
+            }else{ // dh config
+                return this.createChild(el, this.dom.firstChild, returnDom);
+            }
+        },
+	
+	    /**
+	     * Replaces the passed element with this element
+	     * @param {Mixed} el The element to replace
+	     * @return {Ext.Element} this
+	     */
+	    replace: function(el){
+	        el = GET(el);
+	        this.insertBefore(el);
+	        el.remove();
+	        return this;
+	    },
+	
+	    /**
+	     * Replaces this element with the passed element
+	     * @param {Mixed/Object} el The new element or a DomHelper config of an element to create
+	     * @return {Ext.Element} this
+	     */
+	    replaceWith: function(el){
+		    var me = this;
+                
+            if(el.nodeType || el.dom || typeof el == 'string'){
+                el = GETDOM(el);
+                me.dom.parentNode.insertBefore(el, me.dom);
+            }else{
+                el = DH.insertBefore(me.dom, el);
+            }
+	        
+	        delete Ext.elCache[me.id];
+	        Ext.removeNode(me.dom);      
+	        me.id = Ext.id(me.dom = el);
+	        Ext.Element.addToCache(me.isFlyweight ? new Ext.Element(me.dom) : me);     
+            return me;
+	    },
+	    
+		/**
+		 * Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.
+		 * @param {Object} config DomHelper element config object.  If no tag is specified (e.g., {tag:'input'}) then a div will be
+		 * automatically generated with the specified attributes.
+		 * @param {HTMLElement} insertBefore (optional) a child element of this element
+		 * @param {Boolean} returnDom (optional) true to return the dom node instead of creating an Element
+		 * @return {Ext.Element} The new child element
+		 */
+		createChild: function(config, insertBefore, returnDom){
+		    config = config || {tag:'div'};
+		    return insertBefore ? 
+		    	   DH.insertBefore(insertBefore, config, returnDom !== true) :	
+		    	   DH[!this.dom.firstChild ? 'overwrite' : 'append'](this.dom, config,  returnDom !== true);
+		},
+		
+		/**
+		 * Creates and wraps this element with another element
+		 * @param {Object} config (optional) DomHelper element config object for the wrapper element or null for an empty div
+		 * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+		 * @return {HTMLElement/Element} The newly created wrapper element
+		 */
+		wrap: function(config, returnDom){        
+		    var newEl = DH.insertBefore(this.dom, config || {tag: "div"}, !returnDom);
+		    newEl.dom ? newEl.dom.appendChild(this.dom) : newEl.appendChild(this.dom);
+		    return newEl;
+		},
+		
+		/**
+		 * Inserts an html fragment into this element
+		 * @param {String} where Where to insert the html in relation to this element - beforeBegin, afterBegin, beforeEnd, afterEnd.
+		 * @param {String} html The HTML fragment
+		 * @param {Boolean} returnEl (optional) True to return an Ext.Element (defaults to false)
+		 * @return {HTMLElement/Ext.Element} The inserted node (or nearest related if more than 1 inserted)
+		 */
+		insertHtml : function(where, html, returnEl){
+		    var el = DH.insertHtml(where, this.dom, html);
+		    return returnEl ? Ext.get(el) : el;
+		}
+	};
+}());/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(function(){
+    // local style camelizing for speed
+    var supports = Ext.supports,
+        propCache = {},
+        camelRe = /(-[a-z])/gi,
+        view = document.defaultView,
+        opacityRe = /alpha\(opacity=(.*)\)/i,
+        trimRe = /^\s+|\s+$/g,
+        EL = Ext.Element,
+        spacesRe = /\s+/,
+        wordsRe = /\w/g,
+        PADDING = "padding",
+        MARGIN = "margin",
+        BORDER = "border",
+        LEFT = "-left",
+        RIGHT = "-right",
+        TOP = "-top",
+        BOTTOM = "-bottom",
+        WIDTH = "-width",
+        MATH = Math,
+        HIDDEN = 'hidden',
+        ISCLIPPED = 'isClipped',
+        OVERFLOW = 'overflow',
+        OVERFLOWX = 'overflow-x',
+        OVERFLOWY = 'overflow-y',
+        ORIGINALCLIP = 'originalClip',
+        // special markup used throughout Ext when box wrapping elements
+        borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
+        paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
+        margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
+        data = Ext.Element.data;
+
+
+    // private
+    function camelFn(m, a) {
+        return a.charAt(1).toUpperCase();
+    }
+
+    function chkCache(prop) {
+        return propCache[prop] || (propCache[prop] = prop == 'float' ? (supports.cssFloat ? 'cssFloat' : 'styleFloat') : prop.replace(camelRe, camelFn));
+    }
+
+    return {
+        // private  ==> used by Fx
+        adjustWidth : function(width) {
+            var me = this;
+            var isNum = (typeof width == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+            }
+            return (isNum && width < 0) ? 0 : width;
+        },
+
+        // private   ==> used by Fx
+        adjustHeight : function(height) {
+            var me = this;
+            var isNum = (typeof height == "number");
+            if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
+               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+            }
+            return (isNum && height < 0) ? 0 : height;
+        },
+
+
+        /**
+         * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        addClass : function(className){
+            var me = this,
+                i,
+                len,
+                v,
+                cls = [];
+            // Separate case is for speed
+            if (!Ext.isArray(className)) {
+                if (typeof className == 'string' && !this.hasClass(className)) {
+                    me.dom.className += " " + className;
+                }
+            }
+            else {
+                for (i = 0, len = className.length; i < len; i++) {
+                    v = className[i];
+                    if (typeof v == 'string' && (' ' + me.dom.className + ' ').indexOf(' ' + v + ' ') == -1) {
+                        cls.push(v);
+                    }
+                }
+                if (cls.length) {
+                    me.dom.className += " " + cls.join(" ");
+                }
+            }
+            return me;
+        },
+
+        /**
+         * Removes one or more CSS classes from the element.
+         * @param {String/Array} className The CSS class to remove, or an array of classes
+         * @return {Ext.Element} this
+         */
+        removeClass : function(className){
+            var me = this,
+                i,
+                idx,
+                len,
+                cls,
+                elClasses;
+            if (!Ext.isArray(className)){
+                className = [className];
+            }
+            if (me.dom && me.dom.className) {
+                elClasses = me.dom.className.replace(trimRe, '').split(spacesRe);
+                for (i = 0, len = className.length; i < len; i++) {
+                    cls = className[i];
+                    if (typeof cls == 'string') {
+                        cls = cls.replace(trimRe, '');
+                        idx = elClasses.indexOf(cls);
+                        if (idx != -1) {
+                            elClasses.splice(idx, 1);
+                        }
+                    }
+                }
+                me.dom.className = elClasses.join(" ");
+            }
+            return me;
+        },
+
+        /**
+         * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.
+         * @param {String/Array} className The CSS class to add, or an array of classes
+         * @return {Ext.Element} this
+         */
+        radioClass : function(className){
+            var cn = this.dom.parentNode.childNodes,
+                v,
+                i,
+                len;
+            className = Ext.isArray(className) ? className : [className];
+            for (i = 0, len = cn.length; i < len; i++) {
+                v = cn[i];
+                if (v && v.nodeType == 1) {
+                    Ext.fly(v, '_internal').removeClass(className);
+                }
+            };
+            return this.addClass(className);
+        },
+
+        /**
+         * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).
+         * @param {String} className The CSS class to toggle
+         * @return {Ext.Element} this
+         */
+        toggleClass : function(className){
+            return this.hasClass(className) ? this.removeClass(className) : this.addClass(className);
+        },
+
+        /**
+         * Checks if the specified CSS class exists on this element's DOM node.
+         * @param {String} className The CSS class to check for
+         * @return {Boolean} True if the class exists, else false
+         */
+        hasClass : function(className){
+            return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1;
+        },
+
+        /**
+         * Replaces a CSS class on the element with another.  If the old name does not exist, the new name will simply be added.
+         * @param {String} oldClassName The CSS class to replace
+         * @param {String} newClassName The replacement CSS class
+         * @return {Ext.Element} this
+         */
+        replaceClass : function(oldClassName, newClassName){
+            return this.removeClass(oldClassName).addClass(newClassName);
+        },
+
+        isStyle : function(style, val) {
+            return this.getStyle(style) == val;
+        },
+
+        /**
+         * Normalizes currentStyle and computedStyle.
+         * @param {String} property The style property whose value is returned.
+         * @return {String} The current value of the style property for this element.
+         */
+        getStyle : function(){
+            return view && view.getComputedStyle ?
+                function(prop){
+                    var el = this.dom,
+                        v,
+                        cs,
+                        out,
+                        display;
+
+                    if(el == document){
+                        return null;
+                    }
+                    prop = chkCache(prop);
+                    out = (v = el.style[prop]) ? v :
+                           (cs = view.getComputedStyle(el, "")) ? cs[prop] : null;
+                           
+                    // Ignore cases when the margin is correctly reported as 0, the bug only shows
+                    // numbers larger.
+                    if(prop == 'marginRight' && out != '0px' && !supports.correctRightMargin){
+                        display = el.style.display;
+                        el.style.display = 'inline-block';
+                        out = view.getComputedStyle(el, '').marginRight;
+                        el.style.display = display;
+                    }
+                    
+                    if(prop == 'backgroundColor' && out == 'rgba(0, 0, 0, 0)' && !supports.correctTransparentColor){
+                        out = 'transparent';
+                    }
+                    return out;
+                } :
+                function(prop){
+                    var el = this.dom,
+                        m,
+                        cs;
+
+                    if(el == document) return null;
+                    if (prop == 'opacity') {
+                        if (el.style.filter.match) {
+                            if(m = el.style.filter.match(opacityRe)){
+                                var fv = parseFloat(m[1]);
+                                if(!isNaN(fv)){
+                                    return fv ? fv / 100 : 0;
+                                }
+                            }
+                        }
+                        return 1;
+                    }
+                    prop = chkCache(prop);
+                    return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null);
+                };
+        }(),
+
+        /**
+         * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
+         * are convert to standard 6 digit hex color.
+         * @param {String} attr The css attribute
+         * @param {String} defaultValue The default value to use when a valid color isn't found
+         * @param {String} prefix (optional) defaults to #. Use an empty string when working with
+         * color anims.
+         */
+        getColor : function(attr, defaultValue, prefix){
+            var v = this.getStyle(attr),
+                color = (typeof prefix != 'undefined') ? prefix : '#',
+                h;
+
+            if(!v || (/transparent|inherit/.test(v))) {
+                return defaultValue;
+            }
+            if(/^r/.test(v)){
+                Ext.each(v.slice(4, v.length -1).split(','), function(s){
+                    h = parseInt(s, 10);
+                    color += (h < 16 ? '0' : '') + h.toString(16);
+                });
+            }else{
+                v = v.replace('#', '');
+                color += v.length == 3 ? v.replace(/^(\w)(\w)(\w)$/, '$1$1$2$2$3$3') : v;
+            }
+            return(color.length > 5 ? color.toLowerCase() : defaultValue);
+        },
+
+        /**
+         * Wrapper for setting style properties, also takes single object parameter of multiple styles.
+         * @param {String/Object} property The style property to be set, or an object of multiple styles.
+         * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.
+         * @return {Ext.Element} this
+         */
+        setStyle : function(prop, value){
+            var tmp, style;
+            
+            if (typeof prop != 'object') {
+                tmp = {};
+                tmp[prop] = value;
+                prop = tmp;
+            }
+            for (style in prop) {
+                value = prop[style];
+                style == 'opacity' ?
+                    this.setOpacity(value) :
+                    this.dom.style[chkCache(style)] = value;
+            }
+            return this;
+        },
+
+        /**
+         * Set the opacity of the element
+         * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
+         * @param {Boolean/Object} animate (optional) a standard Element animation config object or <tt>true</tt> for
+         * the default animation (<tt>{duration: .35, easing: 'easeIn'}</tt>)
+         * @return {Ext.Element} this
+         */
+         setOpacity : function(opacity, animate){
+            var me = this,
+                s = me.dom.style;
+
+            if(!animate || !me.anim){
+                if(Ext.isIE){
+                    var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '',
+                    val = s.filter.replace(opacityRe, '').replace(trimRe, '');
+
+                    s.zoom = 1;
+                    s.filter = val + (val.length > 0 ? ' ' : '') + opac;
+                }else{
+                    s.opacity = opacity;
+                }
+            }else{
+                me.anim({opacity: {to: opacity}}, me.preanim(arguments, 1), null, .35, 'easeIn');
+            }
+            return me;
+        },
+
+        /**
+         * Clears any opacity settings from this element. Required in some cases for IE.
+         * @return {Ext.Element} this
+         */
+        clearOpacity : function(){
+            var style = this.dom.style;
+            if(Ext.isIE){
+                if(!Ext.isEmpty(style.filter)){
+                    style.filter = style.filter.replace(opacityRe, '').replace(trimRe, '');
+                }
+            }else{
+                style.opacity = style['-moz-opacity'] = style['-khtml-opacity'] = '';
+            }
+            return this;
+        },
+
+        /**
+         * Returns the offset height of the element
+         * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
+         * @return {Number} The element's height
+         */
+        getHeight : function(contentHeight){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0;
+
+            h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb");
+            return h < 0 ? 0 : h;
+        },
+
+        /**
+         * Returns the offset width of the element
+         * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
+         * @return {Number} The element's width
+         */
+        getWidth : function(contentWidth){
+            var me = this,
+                dom = me.dom,
+                hidden = Ext.isIE && me.isStyle('display', 'none'),
+                w = MATH.max(dom.offsetWidth, hidden ? 0 : dom.clientWidth) || 0;
+            w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr");
+            return w < 0 ? 0 : w;
+        },
+
+        /**
+         * Set the width of this Element.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setWidth : function(width, animate){
+            var me = this;
+            width = me.adjustWidth(width);
+            !animate || !me.anim ?
+                me.dom.style.width = me.addUnits(width) :
+                me.anim({width : {to : width}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Set the height of this Element.
+         * <pre><code>
+// change the height to 200px and animate with default configuration
+Ext.fly('elementId').setHeight(200, true);
+
+// change the height to 150px and animate with a custom configuration
+Ext.fly('elId').setHeight(150, {
+    duration : .5, // animation will have a duration of .5 seconds
+    // will change the content to "finished"
+    callback: function(){ this.{@link #update}("finished"); }
+});
+         * </code></pre>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels.)</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+         setHeight : function(height, animate){
+            var me = this;
+            height = me.adjustHeight(height);
+            !animate || !me.anim ?
+                me.dom.style.height = me.addUnits(height) :
+                me.anim({height : {to : height}}, me.preanim(arguments, 1));
+            return me;
+        },
+
+        /**
+         * Gets the width of the border(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the border <b><u>l</u></b>eft width + the border <b><u>r</u></b>ight width.
+         * @return {Number} The width of the sides passed added together
+         */
+        getBorderWidth : function(side){
+            return this.addStyles(side, borders);
+        },
+
+        /**
+         * Gets the width of the padding(s) for the specified side(s)
+         * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
+         * passing <tt>'lr'</tt> would get the padding <b><u>l</u></b>eft + the padding <b><u>r</u></b>ight.
+         * @return {Number} The padding of the sides passed added together
+         */
+        getPadding : function(side){
+            return this.addStyles(side, paddings);
+        },
+
+        /**
+         *  Store the current overflow setting and clip overflow on the element - use <tt>{@link #unclip}</tt> to remove
+         * @return {Ext.Element} this
+         */
+        clip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(!data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, true);
+                data(dom, ORIGINALCLIP, {
+                    o: me.getStyle(OVERFLOW),
+                    x: me.getStyle(OVERFLOWX),
+                    y: me.getStyle(OVERFLOWY)
+                });
+                me.setStyle(OVERFLOW, HIDDEN);
+                me.setStyle(OVERFLOWX, HIDDEN);
+                me.setStyle(OVERFLOWY, HIDDEN);
+            }
+            return me;
+        },
+
+        /**
+         *  Return clipping (overflow) to original clipping before <tt>{@link #clip}</tt> was called
+         * @return {Ext.Element} this
+         */
+        unclip : function(){
+            var me = this,
+                dom = me.dom;
+
+            if(data(dom, ISCLIPPED)){
+                data(dom, ISCLIPPED, false);
+                var o = data(dom, ORIGINALCLIP);
+                if(o.o){
+                    me.setStyle(OVERFLOW, o.o);
+                }
+                if(o.x){
+                    me.setStyle(OVERFLOWX, o.x);
+                }
+                if(o.y){
+                    me.setStyle(OVERFLOWY, o.y);
+                }
+            }
+            return me;
+        },
+
+        // private
+        addStyles : function(sides, styles){
+            var ttlSize = 0,
+                sidesArr = sides.match(wordsRe),
+                side,
+                size,
+                i,
+                len = sidesArr.length;
+            for (i = 0; i < len; i++) {
+                side = sidesArr[i];
+                size = side && parseInt(this.getStyle(styles[side]), 10);
+                if (size) {
+                    ttlSize += MATH.abs(size);
+                }
+            }
+            return ttlSize;
+        },
+
+        margins : margins
+    };
+}()
+);
+/**
+ * @class Ext.Element
+ */
+(function(){
+var D = Ext.lib.Dom,
+        LEFT = "left",
+        RIGHT = "right",
+        TOP = "top",
+        BOTTOM = "bottom",
+        POSITION = "position",
+        STATIC = "static",
+        RELATIVE = "relative",
+        AUTO = "auto",
+        ZINDEX = "z-index";
+
+Ext.Element.addMethods({
+	/**
+      * Gets the current X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The X position of the element
+      */
+    getX : function(){
+        return D.getX(this.dom);
+    },
+
+    /**
+      * Gets the current Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Number} The Y position of the element
+      */
+    getY : function(){
+        return D.getY(this.dom);
+    },
+
+    /**
+      * Gets the current position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+      * @return {Array} The XY position of the element
+      */
+    getXY : function(){
+        return D.getXY(this.dom);
+    },
+
+    /**
+      * Returns the offsets of this element from the passed element. Both element must be part of the DOM tree and not have display:none to have page coordinates.
+      * @param {Mixed} element The element to get the offsets from.
+      * @return {Array} The XY page offsets (e.g. [100, -200])
+      */
+    getOffsetsTo : function(el){
+        var o = this.getXY(),
+        	e = Ext.fly(el, '_internal').getXY();
+        return [o[0]-e[0],o[1]-e[1]];
+    },
+
+    /**
+     * Sets the X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The X position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setX : function(x, animate){	    
+	    return this.setXY([x, this.getY()], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} The Y position of the element
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setY : function(y, animate){	    
+	    return this.setXY([this.getX(), y], this.animTest(arguments, animate, 1));
+    },
+
+    /**
+     * Sets the element's left position directly using CSS style (instead of {@link #setX}).
+     * @param {String} left The left CSS property value
+     * @return {Ext.Element} this
+     */
+    setLeft : function(left){
+        this.setStyle(LEFT, this.addUnits(left));
+        return this;
+    },
+
+    /**
+     * Sets the element's top position directly using CSS style (instead of {@link #setY}).
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+    setTop : function(top){
+        this.setStyle(TOP, this.addUnits(top));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS right style.
+     * @param {String} right The right CSS property value
+     * @return {Ext.Element} this
+     */
+    setRight : function(right){
+        this.setStyle(RIGHT, this.addUnits(right));
+        return this;
+    },
+
+    /**
+     * Sets the element's CSS bottom style.
+     * @param {String} bottom The bottom CSS property value
+     * @return {Ext.Element} this
+     */
+    setBottom : function(bottom){
+        this.setStyle(BOTTOM, this.addUnits(bottom));
+        return this;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Array} pos Contains X & Y [x, y] values for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setXY : function(pos, animate){
+	    var me = this;
+        if(!animate || !me.anim){
+            D.setXY(me.dom, pos);
+        }else{
+            me.anim({points: {to: pos}}, me.preanim(arguments, 1), 'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setLocation : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));
+    },
+
+    /**
+     * Sets the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    moveTo : function(x, y, animate){
+        return this.setXY([x, y], this.animTest(arguments, animate, 2));        
+    },    
+    
+    /**
+     * Gets the left X coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getLeft : function(local){
+	    return !local ? this.getX() : parseInt(this.getStyle(LEFT), 10) || 0;
+    },
+
+    /**
+     * Gets the right X coordinate of the element (element X position + element width)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getRight : function(local){
+	    var me = this;
+	    return !local ? me.getX() + me.getWidth() : (me.getLeft(true) + me.getWidth()) || 0;
+    },
+
+    /**
+     * Gets the top Y coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getTop : function(local) {
+	    return !local ? this.getY() : parseInt(this.getStyle(TOP), 10) || 0;
+    },
+
+    /**
+     * Gets the bottom Y coordinate of the element (element Y position + element height)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getBottom : function(local){
+	    var me = this;
+	    return !local ? me.getY() + me.getHeight() : (me.getTop(true) + me.getHeight()) || 0;
+    },
+
+    /**
+    * Initializes positioning on this element. If a desired position is not passed, it will make the
+    * the element positioned relative IF it is not already positioned.
+    * @param {String} pos (optional) Positioning to use "relative", "absolute" or "fixed"
+    * @param {Number} zIndex (optional) The zIndex to apply
+    * @param {Number} x (optional) Set the page X position
+    * @param {Number} y (optional) Set the page Y position
+    */
+    position : function(pos, zIndex, x, y){
+	    var me = this;
+	    
+        if(!pos && me.isStyle(POSITION, STATIC)){           
+            me.setStyle(POSITION, RELATIVE);           
+        } else if(pos) {
+            me.setStyle(POSITION, pos);
+        }
+        if(zIndex){
+            me.setStyle(ZINDEX, zIndex);
+        }
+        if(x || y) me.setXY([x || false, y || false]);
+    },
+
+    /**
+    * Clear positioning back to the default when the document was loaded
+    * @param {String} value (optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.
+    * @return {Ext.Element} this
+     */
+    clearPositioning : function(value){
+        value = value || '';
+        this.setStyle({
+            left : value,
+            right : value,
+            top : value,
+            bottom : value,
+            "z-index" : "",
+            position : STATIC
+        });
+        return this;
+    },
+
+    /**
+    * Gets an object with all CSS positioning properties. Useful along with setPostioning to get
+    * snapshot before performing an update and then restoring the element.
+    * @return {Object}
+    */
+    getPositioning : function(){
+        var l = this.getStyle(LEFT);
+        var t = this.getStyle(TOP);
+        return {
+            "position" : this.getStyle(POSITION),
+            "left" : l,
+            "right" : l ? "" : this.getStyle(RIGHT),
+            "top" : t,
+            "bottom" : t ? "" : this.getStyle(BOTTOM),
+            "z-index" : this.getStyle(ZINDEX)
+        };
+    },
+    
+    /**
+    * Set positioning with an object returned by getPositioning().
+    * @param {Object} posCfg
+    * @return {Ext.Element} this
+     */
+    setPositioning : function(pc){
+	    var me = this,
+	    	style = me.dom.style;
+	    	
+        me.setStyle(pc);
+        
+        if(pc.right == AUTO){
+            style.right = "";
+        }
+        if(pc.bottom == AUTO){
+            style.bottom = "";
+        }
+        
+        return me;
+    },    
+	
+    /**
+     * Translates the passed page coordinates into left/top css values for this element
+     * @param {Number/Array} x The page x or an array containing [x, y]
+     * @param {Number} y (optional) The page y, required if x is not an array
+     * @return {Object} An object with left and top properties. e.g. {left: (value), top: (value)}
+     */
+    translatePoints : function(x, y){        	     
+	    y = isNaN(x[1]) ? y : x[1];
+        x = isNaN(x[0]) ? x : x[0];
+        var me = this,
+        	relative = me.isStyle(POSITION, RELATIVE),
+        	o = me.getXY(),
+        	l = parseInt(me.getStyle(LEFT), 10),
+        	t = parseInt(me.getStyle(TOP), 10);
+        
+        l = !isNaN(l) ? l : (relative ? 0 : me.dom.offsetLeft);
+        t = !isNaN(t) ? t : (relative ? 0 : me.dom.offsetTop);        
+
+        return {left: (x - o[0] + l), top: (y - o[1] + t)}; 
+    },
+    
+    animTest : function(args, animate, i) {
+        return !!animate && this.preanim ? this.preanim(args, i) : false;
+    }
+});
+})();/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Returns true if this element is scrollable.
+     * @return {Boolean}
+     */
+    isScrollable : function(){
+        var dom = this.dom;
+        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
+    },
+
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value.
+     * @return {Element} this
+     */
+    scrollTo : function(side, value){
+        this.dom["scroll" + (/top/i.test(side) ? "Top" : "Left")] = value;
+        return this;
+    },
+
+    /**
+     * Returns the current scroll position of the element.
+     * @return {Object} An object containing the scroll position in the format {left: (scrollLeft), top: (scrollTop)}
+     */
+    getScroll : function(){
+        var d = this.dom, 
+            doc = document,
+            body = doc.body,
+            docElement = doc.documentElement,
+            l,
+            t,
+            ret;
+
+        if(d == doc || d == body){
+            if(Ext.isIE && Ext.isStrict){
+                l = docElement.scrollLeft; 
+                t = docElement.scrollTop;
+            }else{
+                l = window.pageXOffset;
+                t = window.pageYOffset;
+            }
+            ret = {left: l || (body ? body.scrollLeft : 0), top: t || (body ? body.scrollTop : 0)};
+        }else{
+            ret = {left: d.scrollLeft, top: d.scrollTop};
+        }
+        return ret;
+    }
+});/**
+ * @class Ext.Element
+ */
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use visibility to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.VISIBILITY = 1;
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use display to hide element
+ * @static
+ * @type Number
+ */
+Ext.Element.DISPLAY = 2;
+
+/**
+ * Visibility mode constant for use with {@link #setVisibilityMode}. Use offsets (x and y positioning offscreen)
+ * to hide element.
+ * @static
+ * @type Number
+ */
+Ext.Element.OFFSETS = 3;
+
+
+Ext.Element.ASCLASS = 4;
+
+/**
+ * Defaults to 'x-hide-nosize'
+ * @static
+ * @type String
+ */
+Ext.Element.visibilityCls = 'x-hide-nosize';
+
+Ext.Element.addMethods(function(){
+    var El = Ext.Element,
+        OPACITY = "opacity",
+        VISIBILITY = "visibility",
+        DISPLAY = "display",
+        HIDDEN = "hidden",
+        OFFSETS = "offsets",
+        ASCLASS = "asclass",
+        NONE = "none",
+        NOSIZE = 'nosize',
+        ORIGINALDISPLAY = 'originalDisplay',
+        VISMODE = 'visibilityMode',
+        ISVISIBLE = 'isVisible',
+        data = El.data,
+        getDisplay = function(dom){
+            var d = data(dom, ORIGINALDISPLAY);
+            if(d === undefined){
+                data(dom, ORIGINALDISPLAY, d = '');
+            }
+            return d;
+        },
+        getVisMode = function(dom){
+            var m = data(dom, VISMODE);
+            if(m === undefined){
+                data(dom, VISMODE, m = 1);
+            }
+            return m;
+        };
+
+    return {
+        /**
+         * The element's default display mode  (defaults to "")
+         * @type String
+         */
+        originalDisplay : "",
+        visibilityMode : 1,
+
+        /**
+         * Sets the element's visibility mode. When setVisible() is called it
+         * will use this to determine whether to set the visibility or the display property.
+         * @param {Number} visMode Ext.Element.VISIBILITY or Ext.Element.DISPLAY
+         * @return {Ext.Element} this
+         */
+        setVisibilityMode : function(visMode){
+            data(this.dom, VISMODE, visMode);
+            return this;
+        },
+
+        /**
+         * Perform custom animation on this element.
+         * <div><ul class="mdetail-params">
+         * <li><u>Animation Properties</u></li>
+         *
+         * <p>The Animation Control Object enables gradual transitions for any member of an
+         * element's style object that takes a numeric value including but not limited to
+         * these properties:</p><div><ul class="mdetail-params">
+         * <li><tt>bottom, top, left, right</tt></li>
+         * <li><tt>height, width</tt></li>
+         * <li><tt>margin, padding</tt></li>
+         * <li><tt>borderWidth</tt></li>
+         * <li><tt>opacity</tt></li>
+         * <li><tt>fontSize</tt></li>
+         * <li><tt>lineHeight</tt></li>
+         * </ul></div>
+         *
+         *
+         * <li><u>Animation Property Attributes</u></li>
+         *
+         * <p>Each Animation Property is a config object with optional properties:</p>
+         * <div><ul class="mdetail-params">
+         * <li><tt>by</tt>*  : relative change - start at current value, change by this value</li>
+         * <li><tt>from</tt> : ignore current value, start from this value</li>
+         * <li><tt>to</tt>*  : start at current value, go to this value</li>
+         * <li><tt>unit</tt> : any allowable unit specification</li>
+         * <p>* do not specify both <tt>to</tt> and <tt>by</tt> for an animation property</p>
+         * </ul></div>
+         *
+         * <li><u>Animation Types</u></li>
+         *
+         * <p>The supported animation types:</p><div><ul class="mdetail-params">
+         * <li><tt>'run'</tt> : Default
+         * <pre><code>
+var el = Ext.get('complexEl');
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'run'      // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'color'</tt>
+         * <p>Animates transition of background, text, or border colors.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        color: { to: '#06e' },
+        backgroundColor: { to: '#e06' }
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'color'    // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         *
+         * <li><tt>'motion'</tt>
+         * <p>Animates the motion of an element to/from specific points using optional bezier
+         * way points during transit.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        borderWidth: {to: 3, from: 0},
+        opacity: {to: .3, from: 1},
+        height: {to: 50, from: el.getHeight()},
+        width: {to: 300, from: el.getWidth()},
+        top  : {by: - 100, unit: 'px'},
+        points: {
+            to: [50, 100],  // go to this point
+            control: [      // optional bezier way points
+                [ 600, 800],
+                [-100, 200]
+            ]
+        }
+    },
+    3000,      // animation duration (milliseconds!)
+    null,      // callback
+    'easeOut', // easing method
+    'motion'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * <li><tt>'scroll'</tt>
+         * <p>Animate horizontal or vertical scrolling of an overflowing page element.</p>
+         * <pre><code>
+el.animate(
+    // animation control object
+    {
+        scroll: {to: [400, 300]}
+    },
+    0.35,      // animation duration
+    null,      // callback
+    'easeOut', // easing method
+    'scroll'   // animation type ('run','color','motion','scroll')
+);
+         * </code></pre>
+         * </li>
+         * </ul></div>
+         *
+         * </ul></div>
+         *
+         * @param {Object} args The animation control args
+         * @param {Float} duration (optional) How long the animation lasts in seconds (defaults to <tt>.35</tt>)
+         * @param {Function} onComplete (optional) Function to call when animation completes
+         * @param {String} easing (optional) {@link Ext.Fx#easing} method to use (defaults to <tt>'easeOut'</tt>)
+         * @param {String} animType (optional) <tt>'run'</tt> is the default. Can also be <tt>'color'</tt>,
+         * <tt>'motion'</tt>, or <tt>'scroll'</tt>
+         * @return {Ext.Element} this
+         */
+        animate : function(args, duration, onComplete, easing, animType){
+            this.anim(args, {duration: duration, callback: onComplete, easing: easing}, animType);
+            return this;
+        },
+
+        /*
+         * @private Internal animation call
+         */
+        anim : function(args, opt, animType, defaultDur, defaultEase, cb){
+            animType = animType || 'run';
+            opt = opt || {};
+            var me = this,
+                anim = Ext.lib.Anim[animType](
+                    me.dom,
+                    args,
+                    (opt.duration || defaultDur) || .35,
+                    (opt.easing || defaultEase) || 'easeOut',
+                    function(){
+                        if(cb) cb.call(me);
+                        if(opt.callback) opt.callback.call(opt.scope || me, me, opt);
+                    },
+                    me
+                );
+            opt.anim = anim;
+            return anim;
+        },
+
+        // private legacy anim prep
+        preanim : function(a, i){
+            return !a[i] ? false : (typeof a[i] == 'object' ? a[i]: {duration: a[i+1], callback: a[i+2], easing: a[i+3]});
+        },
+
+        /**
+         * Checks whether the element is currently visible using both visibility and display properties.
+         * @return {Boolean} True if the element is currently visible, else false
+         */
+        isVisible : function() {
+            var me = this,
+                dom = me.dom,
+                visible = data(dom, ISVISIBLE);
+
+            if(typeof visible == 'boolean'){ //return the cached value if registered
+                return visible;
+            }
+            //Determine the current state based on display states
+            visible = !me.isStyle(VISIBILITY, HIDDEN) &&
+                      !me.isStyle(DISPLAY, NONE) &&
+                      !((getVisMode(dom) == El.ASCLASS) && me.hasClass(me.visibilityCls || El.visibilityCls));
+
+            data(dom, ISVISIBLE, visible);
+            return visible;
+        },
+
+        /**
+         * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use
+         * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.
+         * @param {Boolean} visible Whether the element is visible
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setVisible : function(visible, animate){
+            var me = this, isDisplay, isVisibility, isOffsets, isNosize,
+                dom = me.dom,
+                visMode = getVisMode(dom);
+
+
+            // hideMode string override
+            if (typeof animate == 'string'){
+                switch (animate) {
+                    case DISPLAY:
+                        visMode = El.DISPLAY;
+                        break;
+                    case VISIBILITY:
+                        visMode = El.VISIBILITY;
+                        break;
+                    case OFFSETS:
+                        visMode = El.OFFSETS;
+                        break;
+                    case NOSIZE:
+                    case ASCLASS:
+                        visMode = El.ASCLASS;
+                        break;
+                }
+                me.setVisibilityMode(visMode);
+                animate = false;
+            }
+
+            if (!animate || !me.anim) {
+                if(visMode == El.ASCLASS ){
+
+                    me[visible?'removeClass':'addClass'](me.visibilityCls || El.visibilityCls);
+
+                } else if (visMode == El.DISPLAY){
+
+                    return me.setDisplayed(visible);
+
+                } else if (visMode == El.OFFSETS){
+
+                    if (!visible){
+                        me.hideModeStyles = {
+                            position: me.getStyle('position'),
+                            top: me.getStyle('top'),
+                            left: me.getStyle('left')
+                        };
+                        me.applyStyles({position: 'absolute', top: '-10000px', left: '-10000px'});
+                    } else {
+                        me.applyStyles(me.hideModeStyles || {position: '', top: '', left: ''});
+                        delete me.hideModeStyles;
+                    }
+
+                }else{
+                    me.fixDisplay();
+                    dom.style.visibility = visible ? "visible" : HIDDEN;
+                }
+            }else{
+                // closure for composites
+                if(visible){
+                    me.setOpacity(.01);
+                    me.setVisible(true);
+                }
+                me.anim({opacity: { to: (visible?1:0) }},
+                        me.preanim(arguments, 1),
+                        null,
+                        .35,
+                        'easeIn',
+                        function(){
+                            visible || me.setVisible(false).setOpacity(1);
+                        });
+            }
+            data(dom, ISVISIBLE, visible);  //set logical visibility state
+            return me;
+        },
+
+
+        /**
+         * @private
+         * Determine if the Element has a relevant height and width available based
+         * upon current logical visibility state
+         */
+        hasMetrics  : function(){
+            var dom = this.dom;
+            return this.isVisible() || (getVisMode(dom) == El.VISIBILITY);
+        },
+
+        /**
+         * Toggles the element's visibility or display, depending on visibility mode.
+         * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        toggle : function(animate){
+            var me = this;
+            me.setVisible(!me.isVisible(), me.preanim(arguments, 0));
+            return me;
+        },
+
+        /**
+         * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true.
+         * @param {Mixed} value Boolean value to display the element using its default display, or a string to set the display directly.
+         * @return {Ext.Element} this
+         */
+        setDisplayed : function(value) {
+            if(typeof value == "boolean"){
+               value = value ? getDisplay(this.dom) : NONE;
+            }
+            this.setStyle(DISPLAY, value);
+            return this;
+        },
+
+        // private
+        fixDisplay : function(){
+            var me = this;
+            if(me.isStyle(DISPLAY, NONE)){
+                me.setStyle(VISIBILITY, HIDDEN);
+                me.setStyle(DISPLAY, getDisplay(this.dom)); // first try reverting to default
+                if(me.isStyle(DISPLAY, NONE)){ // if that fails, default to block
+                    me.setStyle(DISPLAY, "block");
+                }
+            }
+        },
+
+        /**
+         * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        hide : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(false, animate);
+                return this;
+            }
+            this.setVisible(false, this.preanim(arguments, 0));
+            return this;
+        },
+
+        /**
+        * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+        * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        show : function(animate){
+            // hideMode override
+            if (typeof animate == 'string'){
+                this.setVisible(true, animate);
+                return this;
+            }
+            this.setVisible(true, this.preanim(arguments, 0));
+            return this;
+        }
+    };
+}());(function(){
+    // contants
+    var NULL = null,
+        UNDEFINED = undefined,
+        TRUE = true,
+        FALSE = false,
+        SETX = "setX",
+        SETY = "setY",
+        SETXY = "setXY",
+        LEFT = "left",
+        BOTTOM = "bottom",
+        TOP = "top",
+        RIGHT = "right",
+        HEIGHT = "height",
+        WIDTH = "width",
+        POINTS = "points",
+        HIDDEN = "hidden",
+        ABSOLUTE = "absolute",
+        VISIBLE = "visible",
+        MOTION = "motion",
+        POSITION = "position",
+        EASEOUT = "easeOut",
+        /*
+         * Use a light flyweight here since we are using so many callbacks and are always assured a DOM element
+         */
+        flyEl = new Ext.Element.Flyweight(),
+        queues = {},
+        getObject = function(o){
+            return o || {};
+        },
+        fly = function(dom){
+            flyEl.dom = dom;
+            flyEl.id = Ext.id(dom);
+            return flyEl;
+        },
+        /*
+         * Queueing now stored outside of the element due to closure issues
+         */
+        getQueue = function(id){
+            if(!queues[id]){
+                queues[id] = [];
+            }
+            return queues[id];
+        },
+        setQueue = function(id, value){
+            queues[id] = value;
+        };
+        
+//Notifies Element that fx methods are available
+Ext.enableFx = TRUE;
+
+/**
+ * @class Ext.Fx
+ * <p>A class to provide basic animation and visual effects support.  <b>Note:</b> This class is automatically applied
+ * to the {@link Ext.Element} interface when included, so all effects calls should be performed via {@link Ext.Element}.
+ * Conversely, since the effects are not actually defined in {@link Ext.Element}, Ext.Fx <b>must</b> be
+ * {@link Ext#enableFx included} in order for the Element effects to work.</p><br/>
+ * 
+ * <p><b><u>Method Chaining</u></b></p>
+ * <p>It is important to note that although the Fx methods and many non-Fx Element methods support "method chaining" in that
+ * they return the Element object itself as the method return value, it is not always possible to mix the two in a single
+ * method chain.  The Fx methods use an internal effects queue so that each effect can be properly timed and sequenced.
+ * Non-Fx methods, on the other hand, have no such internal queueing and will always execute immediately.  For this reason,
+ * while it may be possible to mix certain Fx and non-Fx method calls in a single chain, it may not always provide the
+ * expected results and should be done with care.  Also see <tt>{@link #callback}</tt>.</p><br/>
+ *
+ * <p><b><u>Anchor Options for Motion Effects</u></b></p>
+ * <p>Motion effects support 8-way anchoring, meaning that you can choose one of 8 different anchor points on the Element
+ * that will serve as either the start or end point of the animation.  Following are all of the supported anchor positions:</p>
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+ * <b>Note</b>: some Fx methods accept specific custom config parameters.  The options shown in the Config Options
+ * section below are common options that can be passed to any Fx method unless otherwise noted.</b>
+ * 
+ * @cfg {Function} callback A function called when the effect is finished.  Note that effects are queued internally by the
+ * Fx class, so a callback is not required to specify another effect -- effects can simply be chained together
+ * and called in sequence (see note for <b><u>Method Chaining</u></b> above), for example:<pre><code>
+ * el.slideIn().highlight();
+ * </code></pre>
+ * The callback is intended for any additional code that should run once a particular effect has completed. The Element
+ * being operated upon is passed as the first parameter.
+ * 
+ * @cfg {Object} scope The scope (<code>this</code> reference) in which the <tt>{@link #callback}</tt> function is executed. Defaults to the browser window.
+ * 
+ * @cfg {String} easing A valid Ext.lib.Easing value for the effect:</p><div class="mdetail-params"><ul>
+ * <li><b><tt>backBoth</tt></b></li>
+ * <li><b><tt>backIn</tt></b></li>
+ * <li><b><tt>backOut</tt></b></li>
+ * <li><b><tt>bounceBoth</tt></b></li>
+ * <li><b><tt>bounceIn</tt></b></li>
+ * <li><b><tt>bounceOut</tt></b></li>
+ * <li><b><tt>easeBoth</tt></b></li>
+ * <li><b><tt>easeBothStrong</tt></b></li>
+ * <li><b><tt>easeIn</tt></b></li>
+ * <li><b><tt>easeInStrong</tt></b></li>
+ * <li><b><tt>easeNone</tt></b></li>
+ * <li><b><tt>easeOut</tt></b></li>
+ * <li><b><tt>easeOutStrong</tt></b></li>
+ * <li><b><tt>elasticBoth</tt></b></li>
+ * <li><b><tt>elasticIn</tt></b></li>
+ * <li><b><tt>elasticOut</tt></b></li>
+ * </ul></div>
+ *
+ * @cfg {String} afterCls A css class to apply after the effect
+ * @cfg {Number} duration The length of time (in seconds) that the effect should last
+ * 
+ * @cfg {Number} endOpacity Only applicable for {@link #fadeIn} or {@link #fadeOut}, a number between
+ * <tt>0</tt> and <tt>1</tt> inclusive to configure the ending opacity value.
+ *  
+ * @cfg {Boolean} remove Whether the Element should be removed from the DOM and destroyed after the effect finishes
+ * @cfg {Boolean} useDisplay Whether to use the <i>display</i> CSS property instead of <i>visibility</i> when hiding Elements (only applies to 
+ * effects that end with the element being visually hidden, ignored otherwise)
+ * @cfg {String/Object/Function} afterStyle A style specification string, e.g. <tt>"width:100px"</tt>, or an object
+ * in the form <tt>{width:"100px"}</tt>, or a function which returns such a specification that will be applied to the
+ * Element after the effect finishes.
+ * @cfg {Boolean} block Whether the effect should block other effects from queueing while it runs
+ * @cfg {Boolean} concurrent Whether to allow subsequently-queued effects to run at the same time as the current effect, or to ensure that they run in sequence
+ * @cfg {Boolean} stopFx Whether preceding effects should be stopped and removed before running current effect (only applies to non blocking effects)
+ */
+Ext.Fx = {
+    
+    // private - calls the function taking arguments from the argHash based on the key.  Returns the return value of the function.
+    //           this is useful for replacing switch statements (for example).
+    switchStatements : function(key, fn, argHash){
+        return fn.apply(this, argHash[key]);
+    },
+    
+    /**
+     * Slides the element into view.  An anchor point can be optionally passed to set the point of
+     * origin for the slide effect.  This function automatically handles wrapping the element with
+     * a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element in from the top
+el.slideIn();
+
+// custom: slide the element in from the right with a 2-second duration
+el.slideIn('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideIn('t', {
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideIn : function(anchor, o){ 
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy,
+            r,
+            b,              
+            wrap,               
+            after,
+            st,
+            args, 
+            pt,
+            bw,
+            bh;
+            
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){            
+            xy = fly(dom).getXY();
+            // fix display to visibility
+            fly(dom).fixDisplay();            
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore();      
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+            
+            // fixed size for slide
+            fly(dom).setWidth(b.width).setHeight(b.height);            
+            
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, HIDDEN);
+            
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            
+            // clear out temp styles after slide and unwrap
+            function after(){
+                 fly(dom).fxUnwrap(wrap, r.pos, o);
+                 st.width = r.width;
+                 st.height = r.height;
+                 fly(dom).afterFx(o);
+            }
+            
+            // time to calculate the positions        
+            pt = {to: [b.x, b.y]}; 
+            bw = {to: b.width};
+            bh = {to: b.height};
+                
+            function argCalc(wrap, style, ww, wh, sXY, sXYval, s1, s2, w, h, p){                    
+                var ret = {};
+                fly(wrap).setWidth(ww).setHeight(wh);
+                if(fly(wrap)[sXY]){
+                    fly(wrap)[sXY](sXYval);                  
+                }
+                style[s1] = style[s2] = "0";                    
+                if(w){
+                    ret.width = w;
+                }
+                if(h){
+                    ret.height = h;
+                }
+                if(p){
+                    ret.points = p;
+                }
+                return ret;
+            };
+
+            args = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                    t  : [wrap, st, b.width, 0, NULL, NULL, LEFT, BOTTOM, NULL, bh, NULL],
+                    l  : [wrap, st, 0, b.height, NULL, NULL, RIGHT, TOP, bw, NULL, NULL],
+                    r  : [wrap, st, b.width, b.height, SETX, b.right, LEFT, TOP, NULL, NULL, pt],
+                    b  : [wrap, st, b.width, b.height, SETY, b.bottom, LEFT, TOP, NULL, bh, pt],
+                    tl : [wrap, st, 0, 0, NULL, NULL, RIGHT, BOTTOM, bw, bh, pt],
+                    bl : [wrap, st, 0, 0, SETY, b.y + b.height, RIGHT, TOP, bw, bh, pt],
+                    br : [wrap, st, 0, 0, SETXY, [b.right, b.bottom], LEFT, TOP, bw, bh, pt],
+                    tr : [wrap, st, 0, 0, SETX, b.x + b.width, LEFT, BOTTOM, bw, bh, pt]
+                });
+            
+            st.visibility = VISIBLE;
+            fly(wrap).show();
+
+            arguments.callee.anim = fly(wrap).fxanim(args,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+    
+    /**
+     * Slides the element out of view.  An anchor point can be optionally passed to set the end point
+     * for the slide effect.  When the effect is completed, the element will be hidden (visibility = 
+     * 'hidden') but block elements will still take up space in the document.  The element must be removed
+     * from the DOM using the 'remove' config option if desired.  This function automatically handles 
+     * wrapping the element with a fixed-size container if needed.  See the Fx class overview for valid anchor point options.
+     * Usage:
+     *<pre><code>
+// default: slide the element out to the top
+el.slideOut();
+
+// custom: slide the element out to the right with a 2-second duration
+el.slideOut('r', { duration: 2 });
+
+// common config options shown with default values
+el.slideOut('t', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to top: 't')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    slideOut : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            xy = me.getXY(),
+            wrap,
+            r,
+            b,
+            a,
+            zero = {to: 0}; 
+                    
+        anchor = anchor || "t";
+
+        me.queueFx(o, function(){
+            
+            // restore values after effect
+            r = fly(dom).getFxRestore(); 
+            b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight};
+            b.right = b.x + b.width;
+            b.bottom = b.y + b.height;
+                
+            // fixed size for slide   
+            fly(dom).setWidth(b.width).setHeight(b.height);
+
+            // wrap if needed
+            wrap = fly(dom).fxWrap(r.pos, o, VISIBLE);
+                
+            st.visibility = VISIBLE;
+            st.position = ABSOLUTE;
+            fly(wrap).setWidth(b.width).setHeight(b.height);            
+
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                
+                fly(dom).fxUnwrap(wrap, r.pos, o);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }            
+            
+            function argCalc(style, s1, s2, p1, v1, p2, v2, p3, v3){                    
+                var ret = {};
+                
+                style[s1] = style[s2] = "0";
+                ret[p1] = v1;               
+                if(p2){
+                    ret[p2] = v2;               
+                }
+                if(p3){
+                    ret[p3] = v3;
+                }
+                
+                return ret;
+            };
+            
+            a = fly(dom).switchStatements(anchor.toLowerCase(), argCalc, {
+                t  : [st, LEFT, BOTTOM, HEIGHT, zero],
+                l  : [st, RIGHT, TOP, WIDTH, zero],
+                r  : [st, LEFT, TOP, WIDTH, zero, POINTS, {to : [b.right, b.y]}],
+                b  : [st, LEFT, TOP, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                tl : [st, RIGHT, BOTTOM, WIDTH, zero, HEIGHT, zero],
+                bl : [st, RIGHT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x, b.bottom]}],
+                br : [st, LEFT, TOP, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.x + b.width, b.bottom]}],
+                tr : [st, LEFT, BOTTOM, WIDTH, zero, HEIGHT, zero, POINTS, {to : [b.right, b.y]}]
+            });
+            
+            arguments.callee.anim = fly(wrap).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, 
+                after);
+        });
+        return me;
+    },
+
+    /**
+     * Fades the element out while slowly expanding it in all directions.  When the effect is completed, the 
+     * element will be hidden (visibility = 'hidden') but block elements will still take up space in the document. 
+     * The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.puff();
+
+// common config options shown with default values
+el.puff({
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    puff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            width,
+            height,
+            r;
+
+        me.queueFx(o, function(){
+            width = fly(dom).getWidth();
+            height = fly(dom).getHeight();
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();                   
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();                  
+                fly(dom).clearOpacity();  
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                st.fontSize = '';
+                fly(dom).afterFx(o);
+            }   
+
+            arguments.callee.anim = fly(dom).fxanim({
+                    width : {to : fly(dom).adjustWidth(width * 2)},
+                    height : {to : fly(dom).adjustHeight(height * 2)},
+                    points : {by : [-width * .5, -height * .5]},
+                    opacity : {to : 0},
+                    fontSize: {to : 200, unit: "%"}
+                },
+                o,
+                MOTION,
+                .5,
+                EASEOUT,
+                 after);
+        });
+        return me;
+    },
+
+    /**
+     * Blinks the element as if it was clicked and then collapses on its center (similar to switching off a television).
+     * When the effect is completed, the element will be hidden (visibility = 'hidden') but block elements will still 
+     * take up space in the document. The element must be removed from the DOM using the 'remove' config option if desired.
+     * Usage:
+     *<pre><code>
+// default
+el.switchOff();
+
+// all config options shown with default values
+el.switchOff({
+    easing: 'easeIn',
+    duration: .3,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    switchOff : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            r;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).clip();
+
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+                
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();  
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;   
+                fly(dom).afterFx(o);
+            };
+
+            fly(dom).fxanim({opacity : {to : 0.3}}, 
+                NULL, 
+                NULL, 
+                .1, 
+                NULL, 
+                function(){                                 
+                    fly(dom).clearOpacity();
+                        (function(){                            
+                            fly(dom).fxanim({
+                                height : {to : 1},
+                                points : {by : [0, fly(dom).getHeight() * .5]}
+                            }, 
+                            o, 
+                            MOTION, 
+                            0.3, 
+                            'easeIn', 
+                            after);
+                        }).defer(100);
+                });
+        });
+        return me;
+    },
+
+    /**
+     * Highlights the Element by setting a color (applies to the background-color by default, but can be
+     * changed using the "attr" config option) and then fading back to the original color. If no original
+     * color is available, you should provide the "endColor" config option which will be cleared after the animation.
+     * Usage:
+<pre><code>
+// default: highlight background to yellow
+el.highlight();
+
+// custom: highlight foreground text to blue for 2 seconds
+el.highlight("0000ff", { attr: 'color', duration: 2 });
+
+// common config options shown with default values
+el.highlight("ffff9c", {
+    attr: "background-color", //can be any valid CSS property (attribute) that supports a color value
+    endColor: (current color) or "ffffff",
+    easing: 'easeIn',
+    duration: 1
+});
+</code></pre>
+     * @param {String} color (optional) The highlight color. Should be a 6 char hex color without the leading # (defaults to yellow: 'ffff9c')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */ 
+    highlight : function(color, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            attr = o.attr || "backgroundColor",
+            a = {},
+            restore;
+
+        me.queueFx(o, function(){
+            fly(dom).clearOpacity();
+            fly(dom).show();
+
+            function after(){
+                dom.style[attr] = restore;
+                fly(dom).afterFx(o);
+            }            
+            restore = dom.style[attr];
+            a[attr] = {from: color || "ffff9c", to: o.endColor || fly(dom).getColor(attr) || "ffffff"};
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                'color',
+                1,
+                'easeIn', 
+                after);
+        });
+        return me;
+    },
+
+   /**
+    * Shows a ripple of exploding, attenuating borders to draw attention to an Element.
+    * Usage:
+<pre><code>
+// default: a single light blue ripple
+el.frame();
+
+// custom: 3 red ripples lasting 3 seconds total
+el.frame("ff0000", 3, { duration: 3 });
+
+// common config options shown with default values
+el.frame("C3DAF9", 1, {
+    duration: 1 //duration of each individual ripple.
+    // Note: Easing is not configurable and will be ignored if included
+});
+</code></pre>
+    * @param {String} color (optional) The color of the border.  Should be a 6 char hex color without the leading # (defaults to light blue: 'C3DAF9').
+    * @param {Number} count (optional) The number of ripples to display (defaults to 1)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    frame : function(color, count, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            proxy,
+            active;
+
+        me.queueFx(o, function(){
+            color = color || '#C3DAF9';
+            if(color.length == 6){
+                color = '#' + color;
+            }            
+            count = count || 1;
+            fly(dom).show();
+
+            var xy = fly(dom).getXY(),
+                b = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: dom.offsetWidth, height: dom.offsetHeight},
+                queue = function(){
+                    proxy = fly(document.body || document.documentElement).createChild({
+                        style:{
+                            position : ABSOLUTE,
+                            'z-index': 35000, // yee haw
+                            border : '0px solid ' + color
+                        }
+                    });
+                    return proxy.queueFx({}, animFn);
+                };
+            
+            
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function() {
+                    count = 0;
+                    proxy.stopFx();
+                }
+            };
+            
+            function animFn(){
+                var scale = Ext.isBorderBox ? 2 : 1;
+                active = proxy.anim({
+                    top : {from : b.y, to : b.y - 20},
+                    left : {from : b.x, to : b.x - 20},
+                    borderWidth : {from : 0, to : 10},
+                    opacity : {from : 1, to : 0},
+                    height : {from : b.height, to : b.height + 20 * scale},
+                    width : {from : b.width, to : b.width + 20 * scale}
+                },{
+                    duration: o.duration || 1,
+                    callback: function() {
+                        proxy.remove();
+                        --count > 0 ? queue() : fly(dom).afterFx(o);
+                    }
+                });
+                arguments.callee.anim = {
+                    isAnimated: true,
+                    stop: function(){
+                        active.stop();
+                    }
+                };
+            };
+            queue();
+        });
+        return me;
+    },
+
+   /**
+    * Creates a pause before any subsequent queued effects begin.  If there are
+    * no effects queued after the pause it will have no effect.
+    * Usage:
+<pre><code>
+el.pause(1);
+</code></pre>
+    * @param {Number} seconds The length of time to pause (in seconds)
+    * @return {Ext.Element} The Element
+    */
+    pause : function(seconds){        
+        var dom = this.dom,
+            t;
+
+        this.queueFx({}, function(){
+            t = setTimeout(function(){
+                fly(dom).afterFx({});
+            }, seconds * 1000);
+            arguments.callee.anim = {
+                isAnimated: true,
+                stop: function(){
+                    clearTimeout(t);
+                    fly(dom).afterFx({});
+                }
+            };
+        });
+        return this;
+    },
+
+   /**
+    * Fade an element in (from transparent to opaque).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.
+    * Usage:
+<pre><code>
+// default: fade in from opacity 0 to 100%
+el.fadeIn();
+
+// custom: fade in from opacity 0 to 75% over 2 seconds
+el.fadeIn({ endOpacity: .75, duration: 2});
+
+// common config options shown with default values
+el.fadeIn({
+    endOpacity: 1, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeIn : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            to = o.endOpacity || 1;
+        
+        me.queueFx(o, function(){
+            fly(dom).setOpacity(0);
+            fly(dom).fixDisplay();
+            dom.style.visibility = VISIBLE;
+            arguments.callee.anim = fly(dom).fxanim({opacity:{to:to}},
+                o, NULL, .5, EASEOUT, function(){
+                if(to == 1){
+                    fly(dom).clearOpacity();
+                }
+                fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Fade an element out (from opaque to transparent).  The ending opacity can be specified
+    * using the <tt>{@link #endOpacity}</tt> config option.  Note that IE may require
+    * <tt>{@link #useDisplay}:true</tt> in order to redisplay correctly.
+    * Usage:
+<pre><code>
+// default: fade out from the element's current opacity to 0
+el.fadeOut();
+
+// custom: fade out from the element's current opacity to 25% over 2 seconds
+el.fadeOut({ endOpacity: .25, duration: 2});
+
+// common config options shown with default values
+el.fadeOut({
+    endOpacity: 0, //can be any value between 0 and 1 (e.g. .5)
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    fadeOut : function(o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            style = dom.style,
+            to = o.endOpacity || 0;         
+        
+        me.queueFx(o, function(){  
+            arguments.callee.anim = fly(dom).fxanim({ 
+                opacity : {to : to}},
+                o, 
+                NULL, 
+                .5, 
+                EASEOUT, 
+                function(){
+                    if(to == 0){
+                        Ext.Element.data(dom, 'visibilityMode') == Ext.Element.DISPLAY || o.useDisplay ? 
+                            style.display = "none" :
+                            style.visibility = HIDDEN;
+                            
+                        fly(dom).clearOpacity();
+                    }
+                    fly(dom).afterFx(o);
+            });
+        });
+        return me;
+    },
+
+   /**
+    * Animates the transition of an element's dimensions from a starting height/width
+    * to an ending height/width.  This method is a convenience implementation of {@link shift}.
+    * Usage:
+<pre><code>
+// change height and width to 100x100 pixels
+el.scale(100, 100);
+
+// common config options shown with default values.  The height and width will default to
+// the element&#39;s existing values if passed as null.
+el.scale(
+    [element&#39;s width],
+    [element&#39;s height], {
+        easing: 'easeOut',
+        duration: .35
+    }
+);
+</code></pre>
+    * @param {Number} width  The new width (pass undefined to keep the original width)
+    * @param {Number} height  The new height (pass undefined to keep the original height)
+    * @param {Object} options (optional) Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    scale : function(w, h, o){
+        this.shift(Ext.apply({}, o, {
+            width: w,
+            height: h
+        }));
+        return this;
+    },
+
+   /**
+    * Animates the transition of any combination of an element's dimensions, xy position and/or opacity.
+    * Any of these properties not specified in the config object will not be changed.  This effect 
+    * requires that at least one new dimension, position or opacity setting must be passed in on
+    * the config object in order for the function to have any effect.
+    * Usage:
+<pre><code>
+// slide the element horizontally to x position 200 while changing the height and opacity
+el.shift({ x: 200, height: 50, opacity: .8 });
+
+// common config options shown with default values.
+el.shift({
+    width: [element&#39;s width],
+    height: [element&#39;s height],
+    x: [element&#39;s x position],
+    y: [element&#39;s y position],
+    opacity: [element&#39;s opacity],
+    easing: 'easeOut',
+    duration: .35
+});
+</code></pre>
+    * @param {Object} options  Object literal with any of the Fx config options
+    * @return {Ext.Element} The Element
+    */
+    shift : function(o){
+        o = getObject(o);
+        var dom = this.dom,
+            a = {};
+                
+        this.queueFx(o, function(){
+            for (var prop in o) {
+                if (o[prop] != UNDEFINED) {                                                 
+                    a[prop] = {to : o[prop]};                   
+                }
+            } 
+            
+            a.width ? a.width.to = fly(dom).adjustWidth(o.width) : a;
+            a.height ? a.height.to = fly(dom).adjustWidth(o.height) : a;   
+            
+            if (a.x || a.y || a.xy) {
+                a.points = a.xy || 
+                           {to : [ a.x ? a.x.to : fly(dom).getX(),
+                                   a.y ? a.y.to : fly(dom).getY()]};                  
+            }
+
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o, 
+                MOTION, 
+                .35, 
+                EASEOUT, 
+                function(){
+                    fly(dom).afterFx(o);
+                });
+        });
+        return this;
+    },
+
+    /**
+     * Slides the element while fading it out of view.  An anchor point can be optionally passed to set the 
+     * ending point of the effect.
+     * Usage:
+     *<pre><code>
+// default: slide the element downward while fading out
+el.ghost();
+
+// custom: slide the element out to the right with a 2-second duration
+el.ghost('r', { duration: 2 });
+
+// common config options shown with default values
+el.ghost('b', {
+    easing: 'easeOut',
+    duration: .5,
+    remove: false,
+    useDisplay: false
+});
+</code></pre>
+     * @param {String} anchor (optional) One of the valid Fx anchor positions (defaults to bottom: 'b')
+     * @param {Object} options (optional) Object literal with any of the Fx config options
+     * @return {Ext.Element} The Element
+     */
+    ghost : function(anchor, o){
+        o = getObject(o);
+        var me = this,
+            dom = me.dom,
+            st = dom.style,
+            a = {opacity: {to: 0}, points: {}},
+            pt = a.points,
+            r,
+            w,
+            h;
+            
+        anchor = anchor || "b";
+
+        me.queueFx(o, function(){
+            // restore values after effect
+            r = fly(dom).getFxRestore();
+            w = fly(dom).getWidth();
+            h = fly(dom).getHeight();
+            
+            function after(){
+                o.useDisplay ? fly(dom).setDisplayed(FALSE) : fly(dom).hide();   
+                fly(dom).clearOpacity();
+                fly(dom).setPositioning(r.pos);
+                st.width = r.width;
+                st.height = r.height;
+                fly(dom).afterFx(o);
+            }
+                
+            pt.by = fly(dom).switchStatements(anchor.toLowerCase(), function(v1,v2){ return [v1, v2];}, {
+               t  : [0, -h],
+               l  : [-w, 0],
+               r  : [w, 0],
+               b  : [0, h],
+               tl : [-w, -h],
+               bl : [-w, h],
+               br : [w, h],
+               tr : [w, -h] 
+            });
+                
+            arguments.callee.anim = fly(dom).fxanim(a,
+                o,
+                MOTION,
+                .5,
+                EASEOUT, after);
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after syncFx is called on the element are
+     * run concurrently.  This is the opposite of {@link #sequenceFx}.
+     * @return {Ext.Element} The Element
+     */
+    syncFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : TRUE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /**
+     * Ensures that all effects queued after sequenceFx is called on the element are
+     * run in sequence.  This is the opposite of {@link #syncFx}.
+     * @return {Ext.Element} The Element
+     */
+    sequenceFx : function(){
+        var me = this;
+        me.fxDefaults = Ext.apply(me.fxDefaults || {}, {
+            block : FALSE,
+            concurrent : FALSE,
+            stopFx : FALSE
+        });
+        return me;
+    },
+
+    /* @private */
+    nextFx : function(){        
+        var ef = getQueue(this.dom.id)[0];
+        if(ef){
+            ef.call(this);
+        }
+    },
+
+    /**
+     * Returns true if the element has any effects actively running or queued, else returns false.
+     * @return {Boolean} True if element has active effects, else false
+     */
+    hasActiveFx : function(){
+        return getQueue(this.dom.id)[0];
+    },
+
+    /**
+     * Stops any running effects and clears the element's internal effects queue if it contains
+     * any additional effects that haven't started yet.
+     * @return {Ext.Element} The Element
+     */
+    stopFx : function(finish){
+        var me = this,
+            id = me.dom.id;
+        if(me.hasActiveFx()){
+            var cur = getQueue(id)[0];
+            if(cur && cur.anim){
+                if(cur.anim.isAnimated){
+                    setQueue(id, [cur]); //clear
+                    cur.anim.stop(finish !== undefined ? finish : TRUE);
+                }else{
+                    setQueue(id, []);
+                }
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    beforeFx : function(o){
+        if(this.hasActiveFx() && !o.concurrent){
+           if(o.stopFx){
+               this.stopFx();
+               return TRUE;
+           }
+           return FALSE;
+        }
+        return TRUE;
+    },
+
+    /**
+     * Returns true if the element is currently blocking so that no other effect can be queued
+     * until this effect is finished, else returns false if blocking is not set.  This is commonly
+     * used to ensure that an effect initiated by a user action runs to completion prior to the
+     * same effect being restarted (e.g., firing only one effect even if the user clicks several times).
+     * @return {Boolean} True if blocking, else false
+     */
+    hasFxBlock : function(){
+        var q = getQueue(this.dom.id);
+        return q && q[0] && q[0].block;
+    },
+
+    /* @private */
+    queueFx : function(o, fn){
+        var me = fly(this.dom);
+        if(!me.hasFxBlock()){
+            Ext.applyIf(o, me.fxDefaults);
+            if(!o.concurrent){
+                var run = me.beforeFx(o);
+                fn.block = o.block;
+                getQueue(me.dom.id).push(fn);
+                if(run){
+                    me.nextFx();
+                }
+            }else{
+                fn.call(me);
+            }
+        }
+        return me;
+    },
+
+    /* @private */
+    fxWrap : function(pos, o, vis){ 
+        var dom = this.dom,
+            wrap,
+            wrapXY;
+        if(!o.wrap || !(wrap = Ext.getDom(o.wrap))){            
+            if(o.fixPosition){
+                wrapXY = fly(dom).getXY();
+            }
+            var div = document.createElement("div");
+            div.style.visibility = vis;
+            wrap = dom.parentNode.insertBefore(div, dom);
+            fly(wrap).setPositioning(pos);
+            if(fly(wrap).isStyle(POSITION, "static")){
+                fly(wrap).position("relative");
+            }
+            fly(dom).clearPositioning('auto');
+            fly(wrap).clip();
+            wrap.appendChild(dom);
+            if(wrapXY){
+                fly(wrap).setXY(wrapXY);
+            }
+        }
+        return wrap;
+    },
+
+    /* @private */
+    fxUnwrap : function(wrap, pos, o){      
+        var dom = this.dom;
+        fly(dom).clearPositioning();
+        fly(dom).setPositioning(pos);
+        if(!o.wrap){
+            var pn = fly(wrap).dom.parentNode;
+            pn.insertBefore(dom, wrap); 
+            fly(wrap).remove();
+        }
+    },
+
+    /* @private */
+    getFxRestore : function(){
+        var st = this.dom.style;
+        return {pos: this.getPositioning(), width: st.width, height : st.height};
+    },
+
+    /* @private */
+    afterFx : function(o){
+        var dom = this.dom,
+            id = dom.id;
+        if(o.afterStyle){
+            fly(dom).setStyle(o.afterStyle);            
+        }
+        if(o.afterCls){
+            fly(dom).addClass(o.afterCls);
+        }
+        if(o.remove == TRUE){
+            fly(dom).remove();
+        }
+        if(o.callback){
+            o.callback.call(o.scope, fly(dom));
+        }
+        if(!o.concurrent){
+            getQueue(id).shift();
+            fly(dom).nextFx();
+        }
+    },
+
+    /* @private */
+    fxanim : function(args, opt, animType, defaultDur, defaultEase, cb){
+        animType = animType || 'run';
+        opt = opt || {};
+        var anim = Ext.lib.Anim[animType](
+                this.dom, 
+                args,
+                (opt.duration || defaultDur) || .35,
+                (opt.easing || defaultEase) || EASEOUT,
+                cb,            
+                this
+            );
+        opt.anim = anim;
+        return anim;
+    }
+};
+
+// backwards compat
+Ext.Fx.resize = Ext.Fx.scale;
+
+//When included, Ext.Fx is automatically applied to Element so that all basic
+//effects are available directly via the Element API
+Ext.Element.addMethods(Ext.Fx);
+})();
+/**
+ * @class Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * Example:<pre><code>
+var els = Ext.select("#some-el div.some-class");
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class');
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code>
+ */
+Ext.CompositeElementLite = function(els, root){
+    /**
+     * <p>The Array of DOM elements which this CompositeElement encapsulates. Read-only.</p>
+     * <p>This will not <i>usually</i> be accessed in developers' code, but developers wishing
+     * to augment the capabilities of the CompositeElementLite class may use it when adding
+     * methods to the class.</p>
+     * <p>For example to add the <code>nextAll</code> method to the class to <b>add</b> all
+     * following siblings of selected elements, the code would be</p><code><pre>
+Ext.override(Ext.CompositeElementLite, {
+    nextAll: function() {
+        var els = this.elements, i, l = els.length, n, r = [], ri = -1;
+
+//      Loop through all elements in this Composite, accumulating
+//      an Array of all siblings.
+        for (i = 0; i < l; i++) {
+            for (n = els[i].nextSibling; n; n = n.nextSibling) {
+                r[++ri] = n;
+            }
+        }
+
+//      Add all found siblings to this Composite
+        return this.add(r);
+    }
+});</pre></code>
+     * @type Array
+     * @property elements
+     */
+    this.elements = [];
+    this.add(els, root);
+    this.el = new Ext.Element.Flyweight();
+};
+
+Ext.CompositeElementLite.prototype = {
+    isComposite: true,
+
+    // private
+    getElement : function(el){
+        // Set the shared flyweight dom property to the current element
+        var e = this.el;
+        e.dom = el;
+        e.id = el.id;
+        return e;
+    },
+
+    // private
+    transformElement : function(el){
+        return Ext.getDom(el);
+    },
+
+    /**
+     * Returns the number of elements in this Composite.
+     * @return Number
+     */
+    getCount : function(){
+        return this.elements.length;
+    },
+    /**
+     * Adds elements to this Composite object.
+     * @param {Mixed} els Either an Array of DOM elements to add, or another Composite object who's elements should be added.
+     * @return {CompositeElement} This Composite object.
+     */
+    add : function(els, root){
+        var me = this,
+            elements = me.elements;
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }else if(els.isComposite){
+            els = els.elements;
+        }else if(!Ext.isIterable(els)){
+            els = [els];
+        }
+
+        for(var i = 0, len = els.length; i < len; ++i){
+            elements.push(me.transformElement(els[i]));
+        }
+        return me;
+    },
+
+    invoke : function(fn, args){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            e,
+            i;
+
+        for(i = 0; i < len; i++) {
+            e = els[i];
+            if(e){
+                Ext.Element.prototype[fn].apply(me.getElement(e), args);
+            }
+        }
+        return me;
+    },
+    /**
+     * Returns a flyweight Element of the dom element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+    item : function(index){
+        var me = this,
+            el = me.elements[index],
+            out = null;
+
+        if(el){
+            out = me.getElement(el);
+        }
+        return out;
+    },
+
+    // fixes scope with flyweight
+    addListener : function(eventName, handler, scope, opt){
+        var els = this.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e) {
+                Ext.EventManager.on(e, eventName, handler, scope || e, opt);
+            }
+        }
+        return this;
+    },
+    /**
+     * <p>Calls the passed function for each element in this composite.</p>
+     * @param {Function} fn The function to call. The function is passed the following parameters:<ul>
+     * <li><b>el</b> : Element<div class="sub-desc">The current Element in the iteration.
+     * <b>This is the flyweight (shared) Ext.Element instance, so if you require a
+     * a reference to the dom node, use el.dom.</b></div></li>
+     * <li><b>c</b> : Composite<div class="sub-desc">This Composite object.</div></li>
+     * <li><b>idx</b> : Number<div class="sub-desc">The zero-based index in the iteration.</div></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<i>this</i> reference) in which the function is executed. (defaults to the Element)
+     * @return {CompositeElement} this
+     */
+    each : function(fn, scope){
+        var me = this,
+            els = me.elements,
+            len = els.length,
+            i, e;
+
+        for(i = 0; i<len; i++) {
+            e = els[i];
+            if(e){
+                e = this.getElement(e);
+                if(fn.call(scope || e, e, me, i) === false){
+                    break;
+                }
+            }
+        }
+        return me;
+    },
+
+    /**
+    * Clears this Composite and adds the elements passed.
+    * @param {Mixed} els Either an array of DOM elements, or another Composite from which to fill this Composite.
+    * @return {CompositeElement} this
+    */
+    fill : function(els){
+        var me = this;
+        me.elements = [];
+        me.add(els);
+        return me;
+    },
+
+    /**
+     * Filters this composite to only elements that match the passed selector.
+     * @param {String/Function} selector A string CSS selector or a comparison function.
+     * The comparison function will be called with the following arguments:<ul>
+     * <li><code>el</code> : Ext.Element<div class="sub-desc">The current DOM element.</div></li>
+     * <li><code>index</code> : Number<div class="sub-desc">The current index within the collection.</div></li>
+     * </ul>
+     * @return {CompositeElement} this
+     */
+    filter : function(selector){
+        var els = [],
+            me = this,
+            fn = Ext.isFunction(selector) ? selector
+                : function(el){
+                    return el.is(selector);
+                };
+
+        me.each(function(el, self, i) {
+            if (fn(el, i) !== false) {
+                els[els.length] = me.transformElement(el);
+            }
+        });
+        
+        me.elements = els;
+        return me;
+    },
+
+    /**
+     * Find the index of the passed element within the composite collection.
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Number The index of the passed Ext.Element in the composite collection, or -1 if not found.
+     */
+    indexOf : function(el){
+        return this.elements.indexOf(this.transformElement(el));
+    },
+
+    /**
+    * Replaces the specified element with the passed element.
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * to replace.
+    * @param {Mixed} replacement The id of an element or the Element itself.
+    * @param {Boolean} domReplace (Optional) True to remove and replace the element in the document too.
+    * @return {CompositeElement} this
+    */
+    replaceElement : function(el, replacement, domReplace){
+        var index = !isNaN(el) ? el : this.indexOf(el),
+            d;
+        if(index > -1){
+            replacement = Ext.getDom(replacement);
+            if(domReplace){
+                d = this.elements[index];
+                d.parentNode.insertBefore(replacement, d);
+                Ext.removeNode(d);
+            }
+            this.elements.splice(index, 1, replacement);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all elements.
+     */
+    clear : function(){
+        this.elements = [];
+    }
+};
+
+Ext.CompositeElementLite.prototype.on = Ext.CompositeElementLite.prototype.addListener;
+
+/**
+ * @private
+ * Copies all of the functions from Ext.Element's prototype onto CompositeElementLite's prototype.
+ * This is called twice - once immediately below, and once again after additional Ext.Element
+ * are added in Ext JS
+ */
+Ext.CompositeElementLite.importElementMethods = function() {
+    var fnName,
+        ElProto = Ext.Element.prototype,
+        CelProto = Ext.CompositeElementLite.prototype;
+
+    for (fnName in ElProto) {
+        if (typeof ElProto[fnName] == 'function'){
+            (function(fnName) {
+                CelProto[fnName] = CelProto[fnName] || function() {
+                    return this.invoke(fnName, arguments);
+                };
+            }).call(CelProto, fnName);
+
+        }
+    }
+};
+
+Ext.CompositeElementLite.importElementMethods();
+
+if(Ext.DomQuery){
+    Ext.Element.selectorFunction = Ext.DomQuery.select;
+}
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+    return new Ext.CompositeElementLite(els);
+};
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;
+(function(){
+    var BEFOREREQUEST = "beforerequest",
+        REQUESTCOMPLETE = "requestcomplete",
+        REQUESTEXCEPTION = "requestexception",
+        UNDEFINED = undefined,
+        LOAD = 'load',
+        POST = 'POST',
+        GET = 'GET',
+        WINDOW = window;
+
+    /**
+     * @class Ext.data.Connection
+     * @extends Ext.util.Observable
+     * <p>The class encapsulates a connection to the page's originating domain, allowing requests to be made
+     * either to a configured URL, or to a URL specified at request time.</p>
+     * <p>Requests made by this class are asynchronous, and will return immediately. No data from
+     * the server will be available to the statement immediately following the {@link #request} call.
+     * To process returned data, use a
+     * <a href="#request-option-success" ext:member="request-option-success" ext:cls="Ext.data.Connection">success callback</a>
+     * in the request options object,
+     * or an {@link #requestcomplete event listener}.</p>
+     * <p><h3>File Uploads</h3><a href="#request-option-isUpload" ext:member="request-option-isUpload" ext:cls="Ext.data.Connection">File uploads</a> are not performed using normal "Ajax" techniques, that
+     * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+     * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     * <p>Also note that it's not possible to check the response code of the hidden iframe, so the success handler will ALWAYS fire.</p>
+     * @constructor
+     * @param {Object} config a configuration object.
+     */
+    Ext.data.Connection = function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event beforerequest
+             * Fires before a network request is made to retrieve a data object.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            BEFOREREQUEST,
+            /**
+             * @event requestcomplete
+             * Fires if the request was successfully completed.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTCOMPLETE,
+            /**
+             * @event requestexception
+             * Fires if an error HTTP status was returned from the server.
+             * See <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html">HTTP Status Code Definitions</a>
+             * for details of HTTP status codes.
+             * @param {Connection} conn This Connection object.
+             * @param {Object} response The XHR object containing the response data.
+             * See <a href="http://www.w3.org/TR/XMLHttpRequest/">The XMLHttpRequest Object</a>
+             * for details.
+             * @param {Object} options The options config object passed to the {@link #request} method.
+             */
+            REQUESTEXCEPTION
+        );
+        Ext.data.Connection.superclass.constructor.call(this);
+    };
+
+    Ext.extend(Ext.data.Connection, Ext.util.Observable, {
+        /**
+         * @cfg {String} url (Optional) <p>The default URL to be used for requests to the server. Defaults to undefined.</p>
+         * <p>The <code>url</code> config may be a function which <i>returns</i> the URL to use for the Ajax request. The scope
+         * (<code><b>this</b></code> reference) of the function is the <code>scope</code> option passed to the {@link #request} method.</p>
+         */
+        /**
+         * @cfg {Object} extraParams (Optional) An object containing properties which are used as
+         * extra parameters to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {Object} defaultHeaders (Optional) An object containing request headers which are added
+         *  to each request made by this object. (defaults to undefined)
+         */
+        /**
+         * @cfg {String} method (Optional) The default HTTP method to be used for requests.
+         * (defaults to undefined; if not set, but {@link #request} params are present, POST will be used;
+         * otherwise, GET will be used.)
+         */
+        /**
+         * @cfg {Number} timeout (Optional) The timeout in milliseconds to be used for requests. (defaults to 30000)
+         */
+        timeout : 30000,
+        /**
+         * @cfg {Boolean} autoAbort (Optional) Whether this request should abort any pending requests. (defaults to false)
+         * @type Boolean
+         */
+        autoAbort:false,
+
+        /**
+         * @cfg {Boolean} disableCaching (Optional) True to add a unique cache-buster param to GET requests. (defaults to true)
+         * @type Boolean
+         */
+        disableCaching: true,
+
+        /**
+         * @cfg {String} disableCachingParam (Optional) Change the parameter which is sent went disabling caching
+         * through a cache buster. Defaults to '_dc'
+         * @type String
+         */
+        disableCachingParam: '_dc',
+
+        /**
+         * <p>Sends an HTTP request to a remote server.</p>
+         * <p><b>Important:</b> Ajax server requests are asynchronous, and this call will
+         * return before the response has been received. Process any returned data
+         * in a callback function.</p>
+         * <pre><code>
+Ext.Ajax.request({
+   url: 'ajax_demo/sample.json',
+   success: function(response, opts) {
+      var obj = Ext.decode(response.responseText);
+      console.dir(obj);
+   },
+   failure: function(response, opts) {
+      console.log('server-side failure with status code ' + response.status);
+   }
+});
+         * </code></pre>
+         * <p>To execute a callback function in the correct scope, use the <tt>scope</tt> option.</p>
+         * @param {Object} options An object which may contain the following properties:<ul>
+         * <li><b>url</b> : String/Function (Optional)<div class="sub-desc">The URL to
+         * which to send the request, or a function to call which returns a URL string. The scope of the
+         * function is specified by the <tt>scope</tt> option. Defaults to the configured
+         * <tt>{@link #url}</tt>.</div></li>
+         * <li><b>params</b> : Object/String/Function (Optional)<div class="sub-desc">
+         * An object containing properties which are used as parameters to the
+         * request, a url encoded string or a function to call to get either. The scope of the function
+         * is specified by the <tt>scope</tt> option.</div></li>
+         * <li><b>method</b> : String (Optional)<div class="sub-desc">The HTTP method to use
+         * for the request. Defaults to the configured method, or if no method was configured,
+         * "GET" if no parameters are being sent, and "POST" if parameters are being sent.  Note that
+         * the method name is case-sensitive and should be all caps.</div></li>
+         * <li><b>callback</b> : Function (Optional)<div class="sub-desc">The
+         * function to be called upon receipt of the HTTP response. The callback is
+         * called regardless of success or failure and is passed the following
+         * parameters:<ul>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * <li><b>success</b> : Boolean<div class="sub-desc">True if the request succeeded.</div></li>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.
+         * See <a href="http://www.w3.org/TR/XMLHttpRequest/">http://www.w3.org/TR/XMLHttpRequest/</a> for details about
+         * accessing elements of the response.</div></li>
+         * </ul></div></li>
+         * <li><a id="request-option-success"></a><b>success</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon success of the request. The callback is passed the following
+         * parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>failure</b> : Function (Optional)<div class="sub-desc">The function
+         * to be called upon failure of the request. The callback is passed the
+         * following parameters:<ul>
+         * <li><b>response</b> : Object<div class="sub-desc">The XMLHttpRequest object containing the response data.</div></li>
+         * <li><b>options</b> : Object<div class="sub-desc">The parameter to the request call.</div></li>
+         * </ul></div></li>
+         * <li><b>scope</b> : Object (Optional)<div class="sub-desc">The scope in
+         * which to execute the callbacks: The "this" object for the callback function. If the <tt>url</tt>, or <tt>params</tt> options were
+         * specified as functions from which to draw values, then this also serves as the scope for those function calls.
+         * Defaults to the browser window.</div></li>
+         * <li><b>timeout</b> : Number (Optional)<div class="sub-desc">The timeout in milliseconds to be used for this request. Defaults to 30 seconds.</div></li>
+         * <li><b>form</b> : Element/HTMLElement/String (Optional)<div class="sub-desc">The <tt>&lt;form&gt;</tt>
+         * Element or the id of the <tt>&lt;form&gt;</tt> to pull parameters from.</div></li>
+         * <li><a id="request-option-isUpload"></a><b>isUpload</b> : Boolean (Optional)<div class="sub-desc"><b>Only meaningful when used
+         * with the <tt>form</tt> option</b>.
+         * <p>True if the form object is a file upload (will be set automatically if the form was
+         * configured with <b><tt>enctype</tt></b> "multipart/form-data").</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <tt>&lt;form></tt> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+         * server is using JSON to send the return object, then the
+         * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+         * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+         * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+         * is created containing a <tt>responseText</tt> property in order to conform to the
+         * requirements of event handlers and callbacks.</p>
+         * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * </div></li>
+         * <li><b>headers</b> : Object (Optional)<div class="sub-desc">Request
+         * headers to set for the request.</div></li>
+         * <li><b>xmlData</b> : Object (Optional)<div class="sub-desc">XML document
+         * to use for the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>jsonData</b> : Object/String (Optional)<div class="sub-desc">JSON
+         * data to use as the post. Note: This will be used instead of params for the post
+         * data. Any params will be appended to the URL.</div></li>
+         * <li><b>disableCaching</b> : Boolean (Optional)<div class="sub-desc">True
+         * to add a unique cache-buster param to GET requests.</div></li>
+         * </ul></p>
+         * <p>The options object may also contain any other property which might be needed to perform
+         * postprocessing in a callback because it is passed to callback functions.</p>
+         * @return {Number} transactionId The id of the server transaction. This may be used
+         * to cancel the request.
+         */
+        request : function(o){
+            var me = this;
+            if(me.fireEvent(BEFOREREQUEST, me, o)){
+                if (o.el) {
+                    if(!Ext.isEmpty(o.indicatorText)){
+                        me.indicatorText = '<div class="loading-indicator">'+o.indicatorText+"</div>";
+                    }
+                    if(me.indicatorText) {
+                        Ext.getDom(o.el).innerHTML = me.indicatorText;
+                    }
+                    o.success = (Ext.isFunction(o.success) ? o.success : function(){}).createInterceptor(function(response) {
+                        Ext.getDom(o.el).innerHTML = response.responseText;
+                    });
+                }
+
+                var p = o.params,
+                    url = o.url || me.url,
+                    method,
+                    cb = {success: me.handleResponse,
+                          failure: me.handleFailure,
+                          scope: me,
+                          argument: {options: o},
+                          timeout : Ext.num(o.timeout, me.timeout)
+                    },
+                    form,
+                    serForm;
+
+
+                if (Ext.isFunction(p)) {
+                    p = p.call(o.scope||WINDOW, o);
+                }
+
+                p = Ext.urlEncode(me.extraParams, Ext.isObject(p) ? Ext.urlEncode(p) : p);
+
+                if (Ext.isFunction(url)) {
+                    url = url.call(o.scope || WINDOW, o);
+                }
+
+                if((form = Ext.getDom(o.form))){
+                    url = url || form.action;
+                     if(o.isUpload || (/multipart\/form-data/i.test(form.getAttribute("enctype")))) {
+                         return me.doFormUpload.call(me, o, p, url);
+                     }
+                    serForm = Ext.lib.Ajax.serializeForm(form);
+                    p = p ? (p + '&' + serForm) : serForm;
+                }
+
+                method = o.method || me.method || ((p || o.xmlData || o.jsonData) ? POST : GET);
+
+                if(method === GET && (me.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
+                    var dcp = o.disableCachingParam || me.disableCachingParam;
+                    url = Ext.urlAppend(url, dcp + '=' + (new Date().getTime()));
+                }
+
+                o.headers = Ext.applyIf(o.headers || {}, me.defaultHeaders || {});
+
+                if(o.autoAbort === true || me.autoAbort) {
+                    me.abort();
+                }
+
+                if((method == GET || o.xmlData || o.jsonData) && p){
+                    url = Ext.urlAppend(url, p);
+                    p = '';
+                }
+                return (me.transId = Ext.lib.Ajax.request(method, url, cb, p, o));
+            }else{
+                return o.callback ? o.callback.apply(o.scope, [o,UNDEFINED,UNDEFINED]) : null;
+            }
+        },
+
+        /**
+         * Determine whether this object has a request outstanding.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         * @return {Boolean} True if there is an outstanding request.
+         */
+        isLoading : function(transId){
+            return transId ? Ext.lib.Ajax.isCallInProgress(transId) : !! this.transId;
+        },
+
+        /**
+         * Aborts any outstanding request.
+         * @param {Number} transactionId (Optional) defaults to the last transaction
+         */
+        abort : function(transId){
+            if(transId || this.isLoading()){
+                Ext.lib.Ajax.abort(transId || this.transId);
+            }
+        },
+
+        // private
+        handleResponse : function(response){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTCOMPLETE, this, response, options);
+            if(options.success){
+                options.success.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, true, response);
+            }
+        },
+
+        // private
+        handleFailure : function(response, e){
+            this.transId = false;
+            var options = response.argument.options;
+            response.argument = options ? options.argument : null;
+            this.fireEvent(REQUESTEXCEPTION, this, response, options, e);
+            if(options.failure){
+                options.failure.call(options.scope, response, options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope, options, false, response);
+            }
+        },
+
+        // private
+        doFormUpload : function(o, ps, url){
+            var id = Ext.id(),
+                doc = document,
+                frame = doc.createElement('iframe'),
+                form = Ext.getDom(o.form),
+                hiddens = [],
+                hd,
+                encoding = 'multipart/form-data',
+                buf = {
+                    target: form.target,
+                    method: form.method,
+                    encoding: form.encoding,
+                    enctype: form.enctype,
+                    action: form.action
+                };
+
+            /*
+             * Originally this behaviour was modified for Opera 10 to apply the secure URL after
+             * the frame had been added to the document. It seems this has since been corrected in
+             * Opera so the behaviour has been reverted, the URL will be set before being added.
+             */
+            Ext.fly(frame).set({
+                id: id,
+                name: id,
+                cls: 'x-hidden',
+                src: Ext.SSL_SECURE_URL
+            }); 
+
+            doc.body.appendChild(frame);
+
+            // This is required so that IE doesn't pop the response up in a new window.
+            if(Ext.isIE){
+               document.frames[id].name = id;
+            }
+
+
+            Ext.fly(form).set({
+                target: id,
+                method: POST,
+                enctype: encoding,
+                encoding: encoding,
+                action: url || buf.action
+            });
+
+            // add dynamic params
+            Ext.iterate(Ext.urlDecode(ps, false), function(k, v){
+                hd = doc.createElement('input');
+                Ext.fly(hd).set({
+                    type: 'hidden',
+                    value: v,
+                    name: k
+                });
+                form.appendChild(hd);
+                hiddens.push(hd);
+            });
+
+            function cb(){
+                var me = this,
+                    // bogus response object
+                    r = {responseText : '',
+                         responseXML : null,
+                         argument : o.argument},
+                    doc,
+                    firstChild;
+
+                try{
+                    doc = frame.contentWindow.document || frame.contentDocument || WINDOW.frames[id].document;
+                    if(doc){
+                        if(doc.body){
+                            if(/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)){ // json response wrapped in textarea
+                                r.responseText = firstChild.value;
+                            }else{
+                                r.responseText = doc.body.innerHTML;
+                            }
+                        }
+                        //in IE the document may still have a body even if returns XML.
+                        r.responseXML = doc.XMLDocument || doc;
+                    }
+                }
+                catch(e) {}
+
+                Ext.EventManager.removeListener(frame, LOAD, cb, me);
+
+                me.fireEvent(REQUESTCOMPLETE, me, r, o);
+
+                function runCallback(fn, scope, args){
+                    if(Ext.isFunction(fn)){
+                        fn.apply(scope, args);
+                    }
+                }
+
+                runCallback(o.success, o.scope, [r, o]);
+                runCallback(o.callback, o.scope, [o, true, r]);
+
+                if(!me.debugUploads){
+                    setTimeout(function(){Ext.removeNode(frame);}, 100);
+                }
+            }
+
+            Ext.EventManager.on(frame, LOAD, cb, this);
+            form.submit();
+
+            Ext.fly(form).set(buf);
+            Ext.each(hiddens, function(h) {
+                Ext.removeNode(h);
+            });
+        }
+    });
+})();
+
+/**
+ * @class Ext.Ajax
+ * @extends Ext.data.Connection
+ * <p>The global Ajax request class that provides a simple way to make Ajax requests
+ * with maximum flexibility.</p>
+ * <p>Since Ext.Ajax is a singleton, you can set common properties/events for it once
+ * and override them at the request function level only if necessary.</p>
+ * <p>Common <b>Properties</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link #method}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #extraParams}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link #url}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Default headers to pass in every request
+Ext.Ajax.defaultHeaders = {
+    'Powered-By': 'Ext'
+};
+ * </code></pre>
+ * </p>
+ * <p>Common <b>Events</b> you may want to set are:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.data.Connection#beforerequest beforerequest}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestcomplete requestcomplete}</tt></b><p class="sub-desc"></p></li>
+ * <li><b><tt>{@link Ext.data.Connection#requestexception requestexception}</tt></b><p class="sub-desc"></p></li>
+ * </ul></div>
+ * <pre><code>
+// Example: show a spinner during all Ajax requests
+Ext.Ajax.on('beforerequest', this.showSpinner, this);
+Ext.Ajax.on('requestcomplete', this.hideSpinner, this);
+Ext.Ajax.on('requestexception', this.hideSpinner, this);
+ * </code></pre>
+ * </p>
+ * <p>An example request:</p>
+ * <pre><code>
+// Basic request
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+   url: 'foo.php',
+   success: someFn,
+   failure: otherFn,
+   headers: {
+       'my-header': 'foo'
+   },
+   params: { foo: 'bar' }
+});
+
+// Simple ajax form submission
+Ext.Ajax.{@link Ext.data.Connection#request request}({
+    form: 'some-form',
+    params: 'foo=bar'
+});
+ * </code></pre>
+ * </p>
+ * @singleton
+ */
+Ext.Ajax = new Ext.data.Connection({
+    /**
+     * @cfg {String} url @hide
+     */
+    /**
+     * @cfg {Object} extraParams @hide
+     */
+    /**
+     * @cfg {Object} defaultHeaders @hide
+     */
+    /**
+     * @cfg {String} method (Optional) @hide
+     */
+    /**
+     * @cfg {Number} timeout (Optional) @hide
+     */
+    /**
+     * @cfg {Boolean} autoAbort (Optional) @hide
+     */
+
+    /**
+     * @cfg {Boolean} disableCaching (Optional) @hide
+     */
+
+    /**
+     * @property  disableCaching
+     * True to add a unique cache-buster param to GET requests. (defaults to true)
+     * @type Boolean
+     */
+    /**
+     * @property  url
+     * The default URL to be used for requests to the server. (defaults to undefined)
+     * If the server receives all requests through one URL, setting this once is easier than
+     * entering it on every request.
+     * @type String
+     */
+    /**
+     * @property  extraParams
+     * An object containing properties which are used as extra parameters to each request made
+     * by this object (defaults to undefined). Session information and other data that you need
+     * to pass with each request are commonly put here.
+     * @type Object
+     */
+    /**
+     * @property  defaultHeaders
+     * An object containing request headers which are added to each request made by this object
+     * (defaults to undefined).
+     * @type Object
+     */
+    /**
+     * @property  method
+     * The default HTTP method to be used for requests. Note that this is case-sensitive and
+     * should be all caps (defaults to undefined; if not set but params are present will use
+     * <tt>"POST"</tt>, otherwise will use <tt>"GET"</tt>.)
+     * @type String
+     */
+    /**
+     * @property  timeout
+     * The timeout in milliseconds to be used for requests. (defaults to 30000)
+     * @type Number
+     */
+
+    /**
+     * @property  autoAbort
+     * Whether a new request should abort any pending requests. (defaults to false)
+     * @type Boolean
+     */
+    autoAbort : false,
+
+    /**
+     * Serialize the passed form into a url encoded string
+     * @param {String/HTMLElement} form
+     * @return {String}
+     */
+    serializeForm : function(form){
+        return Ext.lib.Ajax.serializeForm(form);
+    }
+});
+/**
+ * @class Ext.util.JSON
+ * Modified version of Douglas Crockford"s json.js that doesn"t
+ * mess with the Object prototype
+ * http://www.json.org/js.html
+ * @singleton
+ */
+Ext.util.JSON = new (function(){
+    var useHasOwn = !!{}.hasOwnProperty,
+        isNative = function() {
+            var useNative = null;
+
+            return function() {
+                if (useNative === null) {
+                    useNative = Ext.USE_NATIVE_JSON && window.JSON && JSON.toString() == '[object JSON]';
+                }
+        
+                return useNative;
+            };
+        }(),
+        pad = function(n) {
+            return n < 10 ? "0" + n : n;
+        },
+        doDecode = function(json){
+            return json ? eval("(" + json + ")") : "";    
+        },
+        doEncode = function(o){
+            if(!Ext.isDefined(o) || o === null){
+                return "null";
+            }else if(Ext.isArray(o)){
+                return encodeArray(o);
+            }else if(Ext.isDate(o)){
+                return Ext.util.JSON.encodeDate(o);
+            }else if(Ext.isString(o)){
+                return encodeString(o);
+            }else if(typeof o == "number"){
+                //don't use isNumber here, since finite checks happen inside isNumber
+                return isFinite(o) ? String(o) : "null";
+            }else if(Ext.isBoolean(o)){
+                return String(o);
+            }else {
+                var a = ["{"], b, i, v;
+                for (i in o) {
+                    // don't encode DOM objects
+                    if(!o.getElementsByTagName){
+                        if(!useHasOwn || o.hasOwnProperty(i)) {
+                            v = o[i];
+                            switch (typeof v) {
+                            case "undefined":
+                            case "function":
+                            case "unknown":
+                                break;
+                            default:
+                                if(b){
+                                    a.push(',');
+                                }
+                                a.push(doEncode(i), ":",
+                                        v === null ? "null" : doEncode(v));
+                                b = true;
+                            }
+                        }
+                    }
+                }
+                a.push("}");
+                return a.join("");
+            }    
+        },
+        m = {
+            "\b": '\\b',
+            "\t": '\\t',
+            "\n": '\\n',
+            "\f": '\\f',
+            "\r": '\\r',
+            '"' : '\\"',
+            "\\": '\\\\'
+        },
+        encodeString = function(s){
+            if (/["\\\x00-\x1f]/.test(s)) {
+                return '"' + s.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                    var c = m[b];
+                    if(c){
+                        return c;
+                    }
+                    c = b.charCodeAt();
+                    return "\\u00" +
+                        Math.floor(c / 16).toString(16) +
+                        (c % 16).toString(16);
+                }) + '"';
+            }
+            return '"' + s + '"';
+        },
+        encodeArray = function(o){
+            var a = ["["], b, i, l = o.length, v;
+                for (i = 0; i < l; i += 1) {
+                    v = o[i];
+                    switch (typeof v) {
+                        case "undefined":
+                        case "function":
+                        case "unknown":
+                            break;
+                        default:
+                            if (b) {
+                                a.push(',');
+                            }
+                            a.push(v === null ? "null" : Ext.util.JSON.encode(v));
+                            b = true;
+                    }
+                }
+                a.push("]");
+                return a.join("");
+        };
+
+    /**
+     * <p>Encodes a Date. This returns the actual string which is inserted into the JSON string as the literal expression.
+     * <b>The returned value includes enclosing double quotation marks.</b></p>
+     * <p>The default return format is "yyyy-mm-ddThh:mm:ss".</p>
+     * <p>To override this:</p><pre><code>
+Ext.util.JSON.encodeDate = function(d) {
+    return d.format('"Y-m-d"');
+};
+</code></pre>
+     * @param {Date} d The Date to encode
+     * @return {String} The string literal to use in a JSON string.
+     */
+    this.encodeDate = function(o){
+        return '"' + o.getFullYear() + "-" +
+                pad(o.getMonth() + 1) + "-" +
+                pad(o.getDate()) + "T" +
+                pad(o.getHours()) + ":" +
+                pad(o.getMinutes()) + ":" +
+                pad(o.getSeconds()) + '"';
+    };
+
+    /**
+     * Encodes an Object, Array or other value
+     * @param {Mixed} o The variable to encode
+     * @return {String} The JSON string
+     */
+    this.encode = function() {
+        var ec;
+        return function(o) {
+            if (!ec) {
+                // setup encoding function on first access
+                ec = isNative() ? JSON.stringify : doEncode;
+            }
+            return ec(o);
+        };
+    }();
+
+
+    /**
+     * Decodes (parses) a JSON string to an object. If the JSON is invalid, this function throws a SyntaxError unless the safe option is set.
+     * @param {String} json The JSON string
+     * @return {Object} The resulting object
+     */
+    this.decode = function() {
+        var dc;
+        return function(json) {
+            if (!dc) {
+                // setup decoding function on first access
+                dc = isNative() ? JSON.parse : doDecode;
+            }
+            return dc(json);
+        };
+    }();
+
+})();
+/**
+ * Shorthand for {@link Ext.util.JSON#encode}
+ * @param {Mixed} o The variable to encode
+ * @return {String} The JSON string
+ * @member Ext
+ * @method encode
+ */
+Ext.encode = Ext.util.JSON.encode;
+/**
+ * Shorthand for {@link Ext.util.JSON#decode}
+ * @param {String} json The JSON string
+ * @param {Boolean} safe (optional) Whether to return null or throw an exception if the JSON is invalid.
+ * @return {Object} The resulting object
+ * @member Ext
+ * @method decode
+ */
+Ext.decode = Ext.util.JSON.decode;
+/**
+ * @class Ext.EventManager
+ * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides
+ * several useful events directly.
+ * See {@link Ext.EventObject} for more details on normalized event objects.
+ * @singleton
+ */
+Ext.EventManager = function(){
+    var docReadyEvent,
+        docReadyProcId,
+        docReadyState = false,
+        DETECT_NATIVE = Ext.isGecko || Ext.isWebKit || Ext.isSafari,
+        E = Ext.lib.Event,
+        D = Ext.lib.Dom,
+        DOC = document,
+        WINDOW = window,
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        COMPLETE = 'complete',
+        propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+        /*
+         * This cache is used to hold special js objects, the document and window, that don't have an id. We need to keep
+         * a reference to them so we can look them up at a later point.
+         */
+        specialElCache = [];
+
+     function getId(el){
+        var id = false,
+            i = 0,
+            len = specialElCache.length,
+            skip = false,
+            o;
+            
+        if (el) {
+            if (el.getElementById || el.navigator) {
+                // look up the id
+                for(; i < len; ++i){
+                    o = specialElCache[i];
+                    if(o.el === el){
+                        id = o.id;
+                        break;
+                    }
+                }
+                if(!id){
+                    // for browsers that support it, ensure that give the el the same id
+                    id = Ext.id(el);
+                    specialElCache.push({
+                        id: id,
+                        el: el
+                    });
+                    skip = true;
+                }
+            }else{
+                id = Ext.id(el);
+            }
+            if(!Ext.elCache[id]){
+                Ext.Element.addToCache(new Ext.Element(el), id);
+                if(skip){
+                    Ext.elCache[id].skipGC = true;
+                }
+            }
+        }
+        return id;
+     }
+
+    /// There is some jquery work around stuff here that isn't needed in Ext Core.
+    function addListener(el, ename, fn, task, wrap, scope){
+        el = Ext.getDom(el);
+        var id = getId(el),
+            es = Ext.elCache[id].events,
+            wfn;
+
+        wfn = E.on(el, ename, wrap);
+        es[ename] = es[ename] || [];
+
+        /* 0 = Original Function,
+           1 = Event Manager Wrapped Function,
+           2 = Scope,
+           3 = Adapter Wrapped Function,
+           4 = Buffered Task
+        */
+        es[ename].push([fn, wrap, scope, wfn, task]);
+
+        // this is a workaround for jQuery and should somehow be removed from Ext Core in the future
+        // without breaking ExtJS.
+
+        // workaround for jQuery
+        if(el.addEventListener && ename == "mousewheel"){
+            var args = ["DOMMouseScroll", wrap, false];
+            el.addEventListener.apply(el, args);
+            Ext.EventManager.addListener(WINDOW, 'unload', function(){
+                el.removeEventListener.apply(el, args);
+            });
+        }
+
+        // fix stopped mousedowns on the document
+        if(el == DOC && ename == "mousedown"){
+            Ext.EventManager.stoppedMouseDownEvent.addListener(wrap);
+        }
+    }
+
+    function doScrollChk(){
+        /* Notes:
+             'doScroll' will NOT work in a IFRAME/FRAMESET.
+             The method succeeds but, a DOM query done immediately after -- FAILS.
+          */
+        if(window != top){
+            return false;
+        }
+
+        try{
+            DOC.documentElement.doScroll('left');
+        }catch(e){
+             return false;
+        }
+
+        fireDocReady();
+        return true;
+    }
+    /**
+     * @return {Boolean} True if the document is in a 'complete' state (or was determined to
+     * be true by other means). If false, the state is evaluated again until canceled.
+     */
+    function checkReadyState(e){
+
+        if(Ext.isIE && doScrollChk()){
+            return true;
+        }
+        if(DOC.readyState == COMPLETE){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    var styles;
+    function checkStyleSheets(e){
+        styles || (styles = Ext.query('style, link[rel=stylesheet]'));
+        if(styles.length == DOC.styleSheets.length){
+            fireDocReady();
+            return true;
+        }
+        docReadyState || (docReadyProcId = setTimeout(arguments.callee, 2));
+        return false;
+    }
+
+    function OperaDOMContentLoaded(e){
+        DOC.removeEventListener(DOMCONTENTLOADED, arguments.callee, false);
+        checkStyleSheets();
+    }
+
+    function fireDocReady(e){
+        if(!docReadyState){
+            docReadyState = true; //only attempt listener removal once
+
+            if(docReadyProcId){
+                clearTimeout(docReadyProcId);
+            }
+            if(DETECT_NATIVE) {
+                DOC.removeEventListener(DOMCONTENTLOADED, fireDocReady, false);
+            }
+            if(Ext.isIE && checkReadyState.bindIE){  //was this was actually set ??
+                DOC.detachEvent('onreadystatechange', checkReadyState);
+            }
+            E.un(WINDOW, "load", arguments.callee);
+        }
+        if(docReadyEvent && !Ext.isReady){
+            Ext.isReady = true;
+            docReadyEvent.fire();
+            docReadyEvent.listeners = [];
+        }
+
+    }
+
+    function initDocReady(){
+        docReadyEvent || (docReadyEvent = new Ext.util.Event());
+        if (DETECT_NATIVE) {
+            DOC.addEventListener(DOMCONTENTLOADED, fireDocReady, false);
+        }
+        /*
+         * Handle additional (exceptional) detection strategies here
+         */
+        if (Ext.isIE){
+            //Use readystatechange as a backup AND primary detection mechanism for a FRAME/IFRAME
+            //See if page is already loaded
+            if(!checkReadyState()){
+                checkReadyState.bindIE = true;
+                DOC.attachEvent('onreadystatechange', checkReadyState);
+            }
+
+        }else if(Ext.isOpera ){
+            /* Notes:
+               Opera needs special treatment needed here because CSS rules are NOT QUITE
+               available after DOMContentLoaded is raised.
+            */
+
+            //See if page is already loaded and all styleSheets are in place
+            (DOC.readyState == COMPLETE && checkStyleSheets()) ||
+                DOC.addEventListener(DOMCONTENTLOADED, OperaDOMContentLoaded, false);
+
+        }else if (Ext.isWebKit){
+            //Fallback for older Webkits without DOMCONTENTLOADED support
+            checkReadyState();
+        }
+        // no matter what, make sure it fires on load
+        E.on(WINDOW, "load", fireDocReady);
+    }
+
+    function createTargeted(h, o){
+        return function(){
+            var args = Ext.toArray(arguments);
+            if(o.target == Ext.EventObject.setEvent(args[0]).target){
+                h.apply(this, args);
+            }
+        };
+    }
+
+    function createBuffered(h, o, task){
+        return function(e){
+            // create new event object impl so new events don't wipe out properties
+            task.delay(o.buffer, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function createSingle(h, el, ename, fn, scope){
+        return function(e){
+            Ext.EventManager.removeListener(el, ename, fn, scope);
+            h(e);
+        };
+    }
+
+    function createDelayed(h, o, fn){
+        return function(e){
+            var task = new Ext.util.DelayedTask(h);
+            if(!fn.tasks) {
+                fn.tasks = [];
+            }
+            fn.tasks.push(task);
+            task.delay(o.delay || 10, h, null, [new Ext.EventObjectImpl(e)]);
+        };
+    }
+
+    function listen(element, ename, opt, fn, scope){
+        var o = (!opt || typeof opt == "boolean") ? {} : opt,
+            el = Ext.getDom(element), task;
+
+        fn = fn || o.fn;
+        scope = scope || o.scope;
+
+        if(!el){
+            throw "Error listening for \"" + ename + '\". Element "' + element + '" doesn\'t exist.';
+        }
+        function h(e){
+            // prevent errors while unload occurring
+            if(!Ext){// !window[xname]){  ==> can't we do this?
+                return;
+            }
+            e = Ext.EventObject.setEvent(e);
+            var t;
+            if (o.delegate) {
+                if(!(t = e.getTarget(o.delegate, el))){
+                    return;
+                }
+            } else {
+                t = e.target;
+            }
+            if (o.stopEvent) {
+                e.stopEvent();
+            }
+            if (o.preventDefault) {
+               e.preventDefault();
+            }
+            if (o.stopPropagation) {
+                e.stopPropagation();
+            }
+            if (o.normalized === false) {
+                e = e.browserEvent;
+            }
+
+            fn.call(scope || el, e, t, o);
+        }
+        if(o.target){
+            h = createTargeted(h, o);
+        }
+        if(o.delay){
+            h = createDelayed(h, o, fn);
+        }
+        if(o.single){
+            h = createSingle(h, el, ename, fn, scope);
+        }
+        if(o.buffer){
+            task = new Ext.util.DelayedTask(h);
+            h = createBuffered(h, o, task);
+        }
+
+        addListener(el, ename, fn, task, h, scope);
+        return h;
+    }
+
+    var pub = {
+        /**
+         * Appends an event handler to an element.  The shorthand version {@link #on} is equivalent.  Typically you will
+         * use {@link Ext.Element#addListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The html element or id to assign the event handler to.
+         * @param {String} eventName The name of the event to listen for.
+         * @param {Function} handler The handler function the event invokes. This function is passed
+         * the following parameters:<ul>
+         * <li>evt : EventObject<div class="sub-desc">The {@link Ext.EventObject EventObject} describing the event.</div></li>
+         * <li>t : Element<div class="sub-desc">The {@link Ext.Element Element} which was the target of the event.
+         * Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+         * <li>o : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+         * </ul>
+         * @param {Object} scope (optional) The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.
+         * @param {Object} options (optional) An object containing handler configuration properties.
+         * This may contain any of the following properties:<ul>
+         * <li>scope : Object<div class="sub-desc">The scope (<b><code>this</code></b> reference) in which the handler function is executed. <b>Defaults to the Element</b>.</div></li>
+         * <li>delegate : String<div class="sub-desc">A simple selector to filter the target or look for a descendant of the target</div></li>
+         * <li>stopEvent : Boolean<div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+         * <li>preventDefault : Boolean<div class="sub-desc">True to prevent the default action</div></li>
+         * <li>stopPropagation : Boolean<div class="sub-desc">True to prevent event propagation</div></li>
+         * <li>normalized : Boolean<div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+         * <li>delay : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after te event fires.</div></li>
+         * <li>single : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+         * <li>buffer : Number<div class="sub-desc">Causes the handler to be scheduled to run in an {@link Ext.util.DelayedTask} delayed
+         * by the specified number of milliseconds. If the event fires again within that time, the original
+         * handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+         * <li>target : Element<div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+         * </ul><br>
+         * <p>See {@link Ext.Element#addListener} for examples of how to use these options.</p>
+         */
+        addListener : function(element, eventName, fn, scope, options){
+            if(typeof eventName == 'object'){
+                var o = eventName, e, val;
+                for(e in o){
+                    val = o[e];
+                    if(!propRe.test(e)){
+                        if(Ext.isFunction(val)){
+                            // shared options
+                            listen(element, e, o, val, o.scope);
+                        }else{
+                            // individual options
+                            listen(element, e, val);
+                        }
+                    }
+                }
+            } else {
+                listen(element, eventName, options, fn, scope);
+            }
+        },
+
+        /**
+         * Removes an event handler from an element.  The shorthand version {@link #un} is equivalent.  Typically
+         * you will use {@link Ext.Element#removeListener} directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+         * @param {String} eventName The name of the event.
+         * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #addListener} call.</b>
+         * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+         * then this must refer to the same object.
+         */
+        removeListener : function(el, eventName, fn, scope){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                f = el && (Ext.elCache[id].events)[eventName] || [],
+                wrap, i, l, k, len, fnc;
+
+            for (i = 0, len = f.length; i < len; i++) {
+
+                /* 0 = Original Function,
+                   1 = Event Manager Wrapped Function,
+                   2 = Scope,
+                   3 = Adapter Wrapped Function,
+                   4 = Buffered Task
+                */
+                if (Ext.isArray(fnc = f[i]) && fnc[0] == fn && (!scope || fnc[2] == scope)) {
+                    if(fnc[4]) {
+                        fnc[4].cancel();
+                    }
+                    k = fn.tasks && fn.tasks.length;
+                    if(k) {
+                        while(k--) {
+                            fn.tasks[k].cancel();
+                        }
+                        delete fn.tasks;
+                    }
+                    wrap = fnc[1];
+                    E.un(el, eventName, E.extAdapter ? fnc[3] : wrap);
+
+                    // jQuery workaround that should be removed from Ext Core
+                    if(wrap && el.addEventListener && eventName == "mousewheel"){
+                        el.removeEventListener("DOMMouseScroll", wrap, false);
+                    }
+
+                    // fix stopped mousedowns on the document
+                    if(wrap && el == DOC && eventName == "mousedown"){
+                        Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                    }
+
+                    f.splice(i, 1);
+                    if (f.length === 0) {
+                        delete Ext.elCache[id].events[eventName];
+                    }
+                    for (k in Ext.elCache[id].events) {
+                        return false;
+                    }
+                    Ext.elCache[id].events = {};
+                    return false;
+                }
+            }
+        },
+
+        /**
+         * Removes all event handers from an element.  Typically you will use {@link Ext.Element#removeAllListeners}
+         * directly on an Element in favor of calling this version.
+         * @param {String/HTMLElement} el The id or html element from which to remove all event handlers.
+         */
+        removeAll : function(el){
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                f, i, len, ename, fn, k, wrap;
+
+            for(ename in es){
+                if(es.hasOwnProperty(ename)){
+                    f = es[ename];
+                    /* 0 = Original Function,
+                       1 = Event Manager Wrapped Function,
+                       2 = Scope,
+                       3 = Adapter Wrapped Function,
+                       4 = Buffered Task
+                    */
+                    for (i = 0, len = f.length; i < len; i++) {
+                        fn = f[i];
+                        if(fn[4]) {
+                            fn[4].cancel();
+                        }
+                        if(fn[0].tasks && (k = fn[0].tasks.length)) {
+                            while(k--) {
+                                fn[0].tasks[k].cancel();
+                            }
+                            delete fn.tasks;
+                        }
+                        wrap =  fn[1];
+                        E.un(el, ename, E.extAdapter ? fn[3] : wrap);
+
+                        // jQuery workaround that should be removed from Ext Core
+                        if(el.addEventListener && wrap && ename == "mousewheel"){
+                            el.removeEventListener("DOMMouseScroll", wrap, false);
+                        }
+
+                        // fix stopped mousedowns on the document
+                        if(wrap && el == DOC &&  ename == "mousedown"){
+                            Ext.EventManager.stoppedMouseDownEvent.removeListener(wrap);
+                        }
+                    }
+                }
+            }
+            if (Ext.elCache[id]) {
+                Ext.elCache[id].events = {};
+            }
+        },
+
+        getListeners : function(el, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                results = [];
+            if (es && es[eventName]) {
+                return es[eventName];
+            } else {
+                return null;
+            }
+        },
+
+        purgeElement : function(el, recurse, eventName) {
+            el = Ext.getDom(el);
+            var id = getId(el),
+                ec = Ext.elCache[id] || {},
+                es = ec.events || {},
+                i, f, len;
+            if (eventName) {
+                if (es && es.hasOwnProperty(eventName)) {
+                    f = es[eventName];
+                    for (i = 0, len = f.length; i < len; i++) {
+                        Ext.EventManager.removeListener(el, eventName, f[i][0]);
+                    }
+                }
+            } else {
+                Ext.EventManager.removeAll(el);
+            }
+            if (recurse && el && el.childNodes) {
+                for (i = 0, len = el.childNodes.length; i < len; i++) {
+                    Ext.EventManager.purgeElement(el.childNodes[i], recurse, eventName);
+                }
+            }
+        },
+
+        _unload : function() {
+            var el;
+            for (el in Ext.elCache) {
+                Ext.EventManager.removeAll(el);
+            }
+            delete Ext.elCache;
+            delete Ext.Element._flyweights;
+
+            // Abort any outstanding Ajax requests
+            var c,
+                conn,
+                tid,
+                ajax = Ext.lib.Ajax;
+            (typeof ajax.conn == 'object') ? conn = ajax.conn : conn = {};
+            for (tid in conn) {
+                c = conn[tid];
+                if (c) {
+                    ajax.abort({conn: c, tId: tid});
+                }
+            }
+        },
+        /**
+         * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Can be
+         * accessed shorthanded as Ext.onReady().
+         * @param {Function} fn The method the event invokes.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+         * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+         * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+         */
+        onDocumentReady : function(fn, scope, options){
+            if (Ext.isReady) { // if it already fired or document.body is present
+                docReadyEvent || (docReadyEvent = new Ext.util.Event());
+                docReadyEvent.addListener(fn, scope, options);
+                docReadyEvent.fire();
+                docReadyEvent.listeners = [];
+            } else {
+                if (!docReadyEvent) {
+                    initDocReady();
+                }
+                options = options || {};
+                options.delay = options.delay || 1;
+                docReadyEvent.addListener(fn, scope, options);
+            }
+        },
+
+        /**
+         * Forces a document ready state transition for the framework.  Used when Ext is loaded
+         * into a DOM structure AFTER initial page load (Google API or other dynamic load scenario.
+         * Any pending 'onDocumentReady' handlers will be fired (if not already handled).
+         */
+        fireDocReady  : fireDocReady
+    };
+     /**
+     * Appends an event handler to an element.  Shorthand for {@link #addListener}.
+     * @param {String/HTMLElement} el The html element or id to assign the event handler to
+     * @param {String} eventName The name of the event to listen for.
+     * @param {Function} handler The handler function the event invokes.
+     * @param {Object} scope (optional) (<code>this</code> reference) in which the handler function executes. <b>Defaults to the Element</b>.
+     * @param {Object} options (optional) An object containing standard {@link #addListener} options
+     * @member Ext.EventManager
+     * @method on
+     */
+    pub.on = pub.addListener;
+    /**
+     * Removes an event handler from an element.  Shorthand for {@link #removeListener}.
+     * @param {String/HTMLElement} el The id or html element from which to remove the listener.
+     * @param {String} eventName The name of the event.
+     * @param {Function} fn The handler function to remove. <b>This must be a reference to the function passed into the {@link #on} call.</b>
+     * @param {Object} scope If a scope (<b><code>this</code></b> reference) was specified when the listener was added,
+     * then this must refer to the same object.
+     * @member Ext.EventManager
+     * @method un
+     */
+    pub.un = pub.removeListener;
+
+    pub.stoppedMouseDownEvent = new Ext.util.Event();
+    return pub;
+}();
+/**
+  * Adds a listener to be notified when the document is ready (before onload and before images are loaded). Shorthand of {@link Ext.EventManager#onDocumentReady}.
+  * @param {Function} fn The method the event invokes.
+  * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+  * @param {boolean} options (optional) Options object as passed to {@link Ext.Element#addListener}. It is recommended that the options
+  * <code>{single: true}</code> be used so that the handler is removed on first invocation.
+  * @member Ext
+  * @method onReady
+ */
+Ext.onReady = Ext.EventManager.onDocumentReady;
+
+
+//Initialize doc classes
+(function(){
+    var initExtCss = function() {
+        // find the body element
+        var bd = document.body || document.getElementsByTagName('body')[0];
+        if (!bd) {
+            return false;
+        }
+
+        var cls = [' ',
+                Ext.isIE ? "ext-ie " + (Ext.isIE6 ? 'ext-ie6' : (Ext.isIE7 ? 'ext-ie7' : (Ext.isIE8 ? 'ext-ie8' : 'ext-ie9')))
+                : Ext.isGecko ? "ext-gecko " + (Ext.isGecko2 ? 'ext-gecko2' : 'ext-gecko3')
+                : Ext.isOpera ? "ext-opera"
+                : Ext.isWebKit ? "ext-webkit" : ""];
+
+        if (Ext.isSafari) {
+            cls.push("ext-safari " + (Ext.isSafari2 ? 'ext-safari2' : (Ext.isSafari3 ? 'ext-safari3' : 'ext-safari4')));
+        } else if(Ext.isChrome) {
+            cls.push("ext-chrome");
+        }
+
+        if (Ext.isMac) {
+            cls.push("ext-mac");
+        }
+        if (Ext.isLinux) {
+            cls.push("ext-linux");
+        }
+
+        // add to the parent to allow for selectors like ".ext-strict .ext-ie"
+        if (Ext.isStrict || Ext.isBorderBox) {
+            var p = bd.parentNode;
+            if (p) {
+                if (!Ext.isStrict) {
+                    Ext.fly(p, '_internal').addClass('x-quirks');
+                    if (Ext.isIE && !Ext.isStrict) {
+                        Ext.isIEQuirks = true;
+                    }
+                }
+                Ext.fly(p, '_internal').addClass(((Ext.isStrict && Ext.isIE ) || (!Ext.enableForcedBoxModel && !Ext.isIE)) ? ' ext-strict' : ' ext-border-box');
+            }
+        }
+        // Forced border box model class applied to all elements. Bypassing javascript based box model adjustments
+        // in favor of css.  This is for non-IE browsers.
+        if (Ext.enableForcedBoxModel && !Ext.isIE) {
+            Ext.isForcedBorderBox = true;
+            cls.push("ext-forced-border-box");
+        }
+        
+        Ext.fly(bd, '_internal').addClass(cls);
+        return true;
+    };
+    
+    if (!initExtCss()) {
+        Ext.onReady(initExtCss);
+    }
+})();
+
+/**
+ * Code used to detect certain browser feature/quirks/bugs at startup.
+ */
+(function(){
+    var supports = Ext.apply(Ext.supports, {
+        /**
+         * In Webkit, there is an issue with getting the margin right property, see
+         * https://bugs.webkit.org/show_bug.cgi?id=13343
+         */
+        correctRightMargin: true,
+        
+        /**
+         * Webkit browsers return rgba(0, 0, 0) when a transparent color is used
+         */
+        correctTransparentColor: true,
+        
+        /**
+         * IE uses styleFloat, not cssFloat for the float property.
+         */
+        cssFloat: true
+    });
+    
+    var supportTests = function(){
+            var div = document.createElement('div'),
+                doc = document,
+                view,
+                last;
+                
+            div.innerHTML = '<div style="height:30px;width:50px;"><div style="height:20px;width:20px;"></div></div><div style="float:left;background-color:transparent;">';
+            doc.body.appendChild(div);
+            last = div.lastChild;
+            
+            if((view = doc.defaultView)){
+                if(view.getComputedStyle(div.firstChild.firstChild, null).marginRight != '0px'){
+                    supports.correctRightMargin = false;
+                }
+                if(view.getComputedStyle(last, null).backgroundColor != 'transparent'){
+                    supports.correctTransparentColor = false;
+                }
+            }
+            supports.cssFloat = !!last.style.cssFloat;
+            doc.body.removeChild(div);
+    };
+    
+    if (Ext.isReady) {
+        supportTests();    
+    } else {
+        Ext.onReady(supportTests);
+    }
+})();
+
+
+/**
+ * @class Ext.EventObject
+ * Just as {@link Ext.Element} wraps around a native DOM node, Ext.EventObject
+ * wraps the browser's native event-object normalizing cross-browser differences,
+ * such as which mouse button is clicked, keys pressed, mechanisms to stop
+ * event-propagation along with a method to prevent default actions from taking place.
+ * <p>For example:</p>
+ * <pre><code>
+function handleClick(e, t){ // e is not a standard event object, it is a Ext.EventObject
+    e.preventDefault();
+    var target = e.getTarget(); // same as t (the target HTMLElement)
+    ...
+}
+var myDiv = {@link Ext#get Ext.get}("myDiv");  // get reference to an {@link Ext.Element}
+myDiv.on(         // 'on' is shorthand for addListener
+    "click",      // perform an action on click of myDiv
+    handleClick   // reference to the action handler
+);
+// other methods to do the same:
+Ext.EventManager.on("myDiv", 'click', handleClick);
+Ext.EventManager.addListener("myDiv", 'click', handleClick);
+ </code></pre>
+ * @singleton
+ */
+Ext.EventObject = function(){
+    var E = Ext.lib.Event,
+        clickRe = /(dbl)?click/,
+        // safari keypress events for special keys return bad keycodes
+        safariKeys = {
+            3 : 13, // enter
+            63234 : 37, // left
+            63235 : 39, // right
+            63232 : 38, // up
+            63233 : 40, // down
+            63276 : 33, // page up
+            63277 : 34, // page down
+            63272 : 46, // delete
+            63273 : 36, // home
+            63275 : 35  // end
+        },
+        // normalize button clicks
+        btnMap = Ext.isIE ? {1:0,4:1,2:2} : {0:0,1:1,2:2};
+
+    Ext.EventObjectImpl = function(e){
+        if(e){
+            this.setEvent(e.browserEvent || e);
+        }
+    };
+
+    Ext.EventObjectImpl.prototype = {
+           /** @private */
+        setEvent : function(e){
+            var me = this;
+            if(e == me || (e && e.browserEvent)){ // already wrapped
+                return e;
+            }
+            me.browserEvent = e;
+            if(e){
+                // normalize buttons
+                me.button = e.button ? btnMap[e.button] : (e.which ? e.which - 1 : -1);
+                if(clickRe.test(e.type) && me.button == -1){
+                    me.button = 0;
+                }
+                me.type = e.type;
+                me.shiftKey = e.shiftKey;
+                // mac metaKey behaves like ctrlKey
+                me.ctrlKey = e.ctrlKey || e.metaKey || false;
+                me.altKey = e.altKey;
+                // in getKey these will be normalized for the mac
+                me.keyCode = e.keyCode;
+                me.charCode = e.charCode;
+                // cache the target for the delayed and or buffered events
+                me.target = E.getTarget(e);
+                // same for XY
+                me.xy = E.getXY(e);
+            }else{
+                me.button = -1;
+                me.shiftKey = false;
+                me.ctrlKey = false;
+                me.altKey = false;
+                me.keyCode = 0;
+                me.charCode = 0;
+                me.target = null;
+                me.xy = [0, 0];
+            }
+            return me;
+        },
+
+        /**
+         * Stop the event (preventDefault and stopPropagation)
+         */
+        stopEvent : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopEvent(me.browserEvent);
+            }
+        },
+
+        /**
+         * Prevents the browsers default handling of the event.
+         */
+        preventDefault : function(){
+            if(this.browserEvent){
+                E.preventDefault(this.browserEvent);
+            }
+        },
+
+        /**
+         * Cancels bubbling of the event.
+         */
+        stopPropagation : function(){
+            var me = this;
+            if(me.browserEvent){
+                if(me.browserEvent.type == 'mousedown'){
+                    Ext.EventManager.stoppedMouseDownEvent.fire(me);
+                }
+                E.stopPropagation(me.browserEvent);
+            }
+        },
+
+        /**
+         * Gets the character code for the event.
+         * @return {Number}
+         */
+        getCharCode : function(){
+            return this.charCode || this.keyCode;
+        },
+
+        /**
+         * Returns a normalized keyCode for the event.
+         * @return {Number} The key code
+         */
+        getKey : function(){
+            return this.normalizeKey(this.keyCode || this.charCode);
+        },
+
+        // private
+        normalizeKey: function(k){
+            return Ext.isSafari ? (safariKeys[k] || k) : k;
+        },
+
+        /**
+         * Gets the x coordinate of the event.
+         * @return {Number}
+         */
+        getPageX : function(){
+            return this.xy[0];
+        },
+
+        /**
+         * Gets the y coordinate of the event.
+         * @return {Number}
+         */
+        getPageY : function(){
+            return this.xy[1];
+        },
+
+        /**
+         * Gets the page coordinates of the event.
+         * @return {Array} The xy values like [x, y]
+         */
+        getXY : function(){
+            return this.xy;
+        },
+
+        /**
+         * Gets the target for the event.
+         * @param {String} selector (optional) A simple selector to filter the target or look for an ancestor of the target
+         * @param {Number/Mixed} maxDepth (optional) The max depth to
+                search as a number or element (defaults to 10 || document.body)
+         * @param {Boolean} returnEl (optional) True to return a Ext.Element object instead of DOM node
+         * @return {HTMLelement}
+         */
+        getTarget : function(selector, maxDepth, returnEl){
+            return selector ? Ext.fly(this.target).findParent(selector, maxDepth, returnEl) : (returnEl ? Ext.get(this.target) : this.target);
+        },
+
+        /**
+         * Gets the related target.
+         * @return {HTMLElement}
+         */
+        getRelatedTarget : function(){
+            return this.browserEvent ? E.getRelatedTarget(this.browserEvent) : null;
+        },
+
+        /**
+         * Normalizes mouse wheel delta across browsers
+         * @return {Number} The delta
+         */
+        getWheelDelta : function(){
+            var e = this.browserEvent;
+            var delta = 0;
+            if(e.wheelDelta){ /* IE/Opera. */
+                delta = e.wheelDelta/120;
+            }else if(e.detail){ /* Mozilla case. */
+                delta = -e.detail/3;
+            }
+            return delta;
+        },
+
+        /**
+        * Returns true if the target of this event is a child of el.  Unless the allowEl parameter is set, it will return false if if the target is el.
+        * Example usage:<pre><code>
+        // Handle click on any child of an element
+        Ext.getBody().on('click', function(e){
+            if(e.within('some-el')){
+                alert('Clicked on a child of some-el!');
+            }
+        });
+
+        // Handle click directly on an element, ignoring clicks on child nodes
+        Ext.getBody().on('click', function(e,t){
+            if((t.id == 'some-el') && !e.within(t, true)){
+                alert('Clicked directly on some-el!');
+            }
+        });
+        </code></pre>
+         * @param {Mixed} el The id, DOM element or Ext.Element to check
+         * @param {Boolean} related (optional) true to test if the related target is within el instead of the target
+         * @param {Boolean} allowEl {optional} true to also check if the passed element is the target or related target
+         * @return {Boolean}
+         */
+        within : function(el, related, allowEl){
+            if(el){
+                var t = this[related ? "getRelatedTarget" : "getTarget"]();
+                return t && ((allowEl ? (t == Ext.getDom(el)) : false) || Ext.fly(el).contains(t));
+            }
+            return false;
+        }
+     };
+
+    return new Ext.EventObjectImpl();
+}();/**
+ * @class Ext.Loader
+ * @singleton
+ * Simple class to help load JavaScript files on demand
+ */
+Ext.Loader = Ext.apply({}, {
+    /**
+     * Loads a given set of .js files. Calls the callback function when all files have been loaded
+     * Set preserveOrder to true to ensure non-parallel loading of files if load order is important
+     * @param {Array} fileList Array of all files to load
+     * @param {Function} callback Callback to call after all files have been loaded
+     * @param {Object} scope The scope to call the callback in
+     * @param {Boolean} preserveOrder True to make files load in serial, one after the other (defaults to false)
+     */
+    load: function(fileList, callback, scope, preserveOrder) {
+        var scope       = scope || this,
+            head        = document.getElementsByTagName("head")[0],
+            fragment    = document.createDocumentFragment(),
+            numFiles    = fileList.length,
+            loadedFiles = 0,
+            me          = this;
+        
+        /**
+         * Loads a particular file from the fileList by index. This is used when preserving order
+         */
+        var loadFileIndex = function(index) {
+            head.appendChild(
+                me.buildScriptTag(fileList[index], onFileLoaded)
+            );
+        };
+        
+        /**
+         * Callback function which is called after each file has been loaded. This calls the callback
+         * passed to load once the final file in the fileList has been loaded
+         */
+        var onFileLoaded = function() {
+            loadedFiles ++;
+            
+            //if this was the last file, call the callback, otherwise load the next file
+            if (numFiles == loadedFiles && typeof callback == 'function') {
+                callback.call(scope);
+            } else {
+                if (preserveOrder === true) {
+                    loadFileIndex(loadedFiles);
+                }
+            }
+        };
+        
+        if (preserveOrder === true) {
+            loadFileIndex.call(this, 0);
+        } else {
+            //load each file (most browsers will do this in parallel)
+            Ext.each(fileList, function(file, index) {
+                fragment.appendChild(
+                    this.buildScriptTag(file, onFileLoaded)
+                );  
+            }, this);
+            
+            head.appendChild(fragment);
+        }
+    },
+    
+    /**
+     * @private
+     * Creates and returns a script tag, but does not place it into the document. If a callback function
+     * is passed, this is called when the script has been loaded
+     * @param {String} filename The name of the file to create a script tag for
+     * @param {Function} callback Optional callback, which is called when the script has been loaded
+     * @return {Element} The new script ta
+     */
+    buildScriptTag: function(filename, callback) {
+        var script  = document.createElement('script');
+        script.type = "text/javascript";
+        script.src  = filename;
+        
+        //IE has a different way of handling &lt;script&gt; loads, so we need to check for it here
+        if (script.readyState) {
+            script.onreadystatechange = function() {
+                if (script.readyState == "loaded" || script.readyState == "complete") {
+                    script.onreadystatechange = null;
+                    callback();
+                }
+            };
+        } else {
+            script.onload = callback;
+        }    
+        
+        return script;
+    }
+});
+/**
+ * @class Ext
+ */
+
+Ext.ns("Ext.grid", "Ext.list", "Ext.dd", "Ext.tree", "Ext.form", "Ext.menu",
+       "Ext.state", "Ext.layout.boxOverflow", "Ext.app", "Ext.ux", "Ext.chart", "Ext.direct", "Ext.slider");
+    /**
+     * Namespace alloted for extensions to the framework.
+     * @property ux
+     * @type Object
+     */
+
+Ext.apply(Ext, function(){
+    var E = Ext,
+        idSeed = 0,
+        scrollWidth = null;
+
+    return {
+        /**
+        * A reusable empty function
+        * @property
+        * @type Function
+        */
+        emptyFn : function(){},
+
+        /**
+         * URL to a 1x1 transparent gif image used by Ext to create inline icons with CSS background images.
+         * In older versions of IE, this defaults to "http://extjs.com/s.gif" and you should change this to a URL on your server.
+         * For other browsers it uses an inline data URL.
+         * @type String
+         */
+        BLANK_IMAGE_URL : Ext.isIE6 || Ext.isIE7 || Ext.isAir ?
+                            'http:/' + '/www.extjs.com/s.gif' :
+                            'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==',
+
+        extendX : function(supr, fn){
+            return Ext.extend(supr, fn(supr.prototype));
+        },
+
+        /**
+         * Returns the current HTML document object as an {@link Ext.Element}.
+         * @return Ext.Element The document
+         */
+        getDoc : function(){
+            return Ext.get(document);
+        },
+
+        /**
+         * Utility method for validating that a value is numeric, returning the specified default value if it is not.
+         * @param {Mixed} value Should be a number, but any type will be handled appropriately
+         * @param {Number} defaultValue The value to return if the original value is non-numeric
+         * @return {Number} Value, if numeric, else defaultValue
+         */
+        num : function(v, defaultValue){
+            v = Number(Ext.isEmpty(v) || Ext.isArray(v) || typeof v == 'boolean' || (typeof v == 'string' && v.trim().length == 0) ? NaN : v);
+            return isNaN(v) ? defaultValue : v;
+        },
+
+        /**
+         * <p>Utility method for returning a default value if the passed value is empty.</p>
+         * <p>The value is deemed to be empty if it is<div class="mdetail-params"><ul>
+         * <li>null</li>
+         * <li>undefined</li>
+         * <li>an empty array</li>
+         * <li>a zero length string (Unless the <tt>allowBlank</tt> parameter is <tt>true</tt>)</li>
+         * </ul></div>
+         * @param {Mixed} value The value to test
+         * @param {Mixed} defaultValue The value to return if the original value is empty
+         * @param {Boolean} allowBlank (optional) true to allow zero length strings to qualify as non-empty (defaults to false)
+         * @return {Mixed} value, if non-empty, else defaultValue
+         */
+        value : function(v, defaultValue, allowBlank){
+            return Ext.isEmpty(v, allowBlank) ? defaultValue : v;
+        },
+
+        /**
+         * Escapes the passed string for use in a regular expression
+         * @param {String} str
+         * @return {String}
+         */
+        escapeRe : function(s) {
+            return s.replace(/([-.*+?^${}()|[\]\/\\])/g, "\\$1");
+        },
+
+        sequence : function(o, name, fn, scope){
+            o[name] = o[name].createSequence(fn, scope);
+        },
+
+        /**
+         * Applies event listeners to elements by selectors when the document is ready.
+         * The event name is specified with an <tt>&#64;</tt> suffix.
+         * <pre><code>
+Ext.addBehaviors({
+    // add a listener for click on all anchors in element with id foo
+    '#foo a&#64;click' : function(e, t){
+        // do something
+    },
+
+    // add the same listener to multiple selectors (separated by comma BEFORE the &#64;)
+    '#foo a, #bar span.some-class&#64;mouseover' : function(){
+        // do something
+    }
+});
+         * </code></pre>
+         * @param {Object} obj The list of behaviors to apply
+         */
+        addBehaviors : function(o){
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.addBehaviors(o);
+                });
+            } else {
+                var cache = {}, // simple cache for applying multiple behaviors to same selector does query multiple times
+                    parts,
+                    b,
+                    s;
+                for (b in o) {
+                    if ((parts = b.split('@'))[1]) { // for Object prototype breakers
+                        s = parts[0];
+                        if(!cache[s]){
+                            cache[s] = Ext.select(s);
+                        }
+                        cache[s].on(parts[1], o[b]);
+                    }
+                }
+                cache = null;
+            }
+        },
+
+        /**
+         * Utility method for getting the width of the browser scrollbar. This can differ depending on
+         * operating system settings, such as the theme or font size.
+         * @param {Boolean} force (optional) true to force a recalculation of the value.
+         * @return {Number} The width of the scrollbar.
+         */
+        getScrollBarWidth: function(force){
+            if(!Ext.isReady){
+                return 0;
+            }
+
+            if(force === true || scrollWidth === null){
+                    // Append our div, do our calculation and then remove it
+                var div = Ext.getBody().createChild('<div class="x-hide-offsets" style="width:100px;height:50px;overflow:hidden;"><div style="height:200px;"></div></div>'),
+                    child = div.child('div', true);
+                var w1 = child.offsetWidth;
+                div.setStyle('overflow', (Ext.isWebKit || Ext.isGecko) ? 'auto' : 'scroll');
+                var w2 = child.offsetWidth;
+                div.remove();
+                // Need to add 2 to ensure we leave enough space
+                scrollWidth = w1 - w2 + 2;
+            }
+            return scrollWidth;
+        },
+
+
+        // deprecated
+        combine : function(){
+            var as = arguments, l = as.length, r = [];
+            for(var i = 0; i < l; i++){
+                var a = as[i];
+                if(Ext.isArray(a)){
+                    r = r.concat(a);
+                }else if(a.length !== undefined && !a.substr){
+                    r = r.concat(Array.prototype.slice.call(a, 0));
+                }else{
+                    r.push(a);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Copies a set of named properties fom the source object to the destination object.
+         * <p>example:<pre><code>
+ImageComponent = Ext.extend(Ext.BoxComponent, {
+    initComponent: function() {
+        this.autoEl = { tag: 'img' };
+        MyComponent.superclass.initComponent.apply(this, arguments);
+        this.initialBox = Ext.copyTo({}, this.initialConfig, 'x,y,width,height');
+    }
+});
+         * </code></pre>
+         * @param {Object} dest The destination object.
+         * @param {Object} source The source object.
+         * @param {Array/String} names Either an Array of property names, or a comma-delimited list
+         * of property names to copy.
+         * @return {Object} The modified object.
+        */
+        copyTo : function(dest, source, names){
+            if(typeof names == 'string'){
+                names = names.split(/[,;\s]/);
+            }
+            Ext.each(names, function(name){
+                if(source.hasOwnProperty(name)){
+                    dest[name] = source[name];
+                }
+            }, this);
+            return dest;
+        },
+
+        /**
+         * Attempts to destroy any objects passed to it by removing all event listeners, removing them from the
+         * DOM (if applicable) and calling their destroy functions (if available).  This method is primarily
+         * intended for arguments of type {@link Ext.Element} and {@link Ext.Component}, but any subclass of
+         * {@link Ext.util.Observable} can be passed in.  Any number of elements and/or components can be
+         * passed into this function in a single call as separate arguments.
+         * @param {Mixed} arg1 An {@link Ext.Element}, {@link Ext.Component}, or an Array of either of these to destroy
+         * @param {Mixed} arg2 (optional)
+         * @param {Mixed} etc... (optional)
+         */
+        destroy : function(){
+            Ext.each(arguments, function(arg){
+                if(arg){
+                    if(Ext.isArray(arg)){
+                        this.destroy.apply(this, arg);
+                    }else if(typeof arg.destroy == 'function'){
+                        arg.destroy();
+                    }else if(arg.dom){
+                        arg.remove();
+                    }
+                }
+            }, this);
+        },
+
+        /**
+         * Attempts to destroy and then remove a set of named properties of the passed object.
+         * @param {Object} o The object (most likely a Component) who's properties you wish to destroy.
+         * @param {Mixed} arg1 The name of the property to destroy and remove from the object.
+         * @param {Mixed} etc... More property names to destroy and remove.
+         */
+        destroyMembers : function(o, arg1, arg2, etc){
+            for(var i = 1, a = arguments, len = a.length; i < len; i++) {
+                Ext.destroy(o[a[i]]);
+                delete o[a[i]];
+            }
+        },
+
+        /**
+         * Creates a copy of the passed Array with falsy values removed.
+         * @param {Array/NodeList} arr The Array from which to remove falsy values.
+         * @return {Array} The new, compressed Array.
+         */
+        clean : function(arr){
+            var ret = [];
+            Ext.each(arr, function(v){
+                if(!!v){
+                    ret.push(v);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Creates a copy of the passed Array, filtered to contain only unique values.
+         * @param {Array} arr The Array to filter
+         * @return {Array} The new Array containing unique values.
+         */
+        unique : function(arr){
+            var ret = [],
+                collect = {};
+
+            Ext.each(arr, function(v) {
+                if(!collect[v]){
+                    ret.push(v);
+                }
+                collect[v] = true;
+            });
+            return ret;
+        },
+
+        /**
+         * Recursively flattens into 1-d Array. Injects Arrays inline.
+         * @param {Array} arr The array to flatten
+         * @return {Array} The new, flattened array.
+         */
+        flatten : function(arr){
+            var worker = [];
+            function rFlatten(a) {
+                Ext.each(a, function(v) {
+                    if(Ext.isArray(v)){
+                        rFlatten(v);
+                    }else{
+                        worker.push(v);
+                    }
+                });
+                return worker;
+            }
+            return rFlatten(arr);
+        },
+
+        /**
+         * Returns the minimum value in the Array.
+         * @param {Array|NodeList} arr The Array from which to select the minimum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines minimization.
+         *                   If omitted the "<" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The minimum value in the Array.
+         */
+        min : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a < b ? -1 : 1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == -1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Returns the maximum value in the Array
+         * @param {Array|NodeList} arr The Array from which to select the maximum value.
+         * @param {Function} comp (optional) a function to perform the comparision which determines maximization.
+         *                   If omitted the ">" operator will be used. Note: gt = 1; eq = 0; lt = -1
+         * @return {Object} The maximum value in the Array.
+         */
+        max : function(arr, comp){
+            var ret = arr[0];
+            comp = comp || function(a,b){ return a > b ? 1 : -1; };
+            Ext.each(arr, function(v) {
+                ret = comp(ret, v) == 1 ? ret : v;
+            });
+            return ret;
+        },
+
+        /**
+         * Calculates the mean of the Array
+         * @param {Array} arr The Array to calculate the mean value of.
+         * @return {Number} The mean.
+         */
+        mean : function(arr){
+           return arr.length > 0 ? Ext.sum(arr) / arr.length : undefined;
+        },
+
+        /**
+         * Calculates the sum of the Array
+         * @param {Array} arr The Array to calculate the sum value of.
+         * @return {Number} The sum.
+         */
+        sum : function(arr){
+           var ret = 0;
+           Ext.each(arr, function(v) {
+               ret += v;
+           });
+           return ret;
+        },
+
+        /**
+         * Partitions the set into two sets: a true set and a false set.
+         * Example:
+         * Example2:
+         * <pre><code>
+// Example 1:
+Ext.partition([true, false, true, true, false]); // [[true, true, true], [false, false]]
+
+// Example 2:
+Ext.partition(
+    Ext.query("p"),
+    function(val){
+        return val.className == "class1"
+    }
+);
+// true are those paragraph elements with a className of "class1",
+// false set are those that do not have that className.
+         * </code></pre>
+         * @param {Array|NodeList} arr The array to partition
+         * @param {Function} truth (optional) a function to determine truth.  If this is omitted the element
+         *                   itself must be able to be evaluated for its truthfulness.
+         * @return {Array} [true<Array>,false<Array>]
+         */
+        partition : function(arr, truth){
+            var ret = [[],[]];
+            Ext.each(arr, function(v, i, a) {
+                ret[ (truth && truth(v, i, a)) || (!truth && v) ? 0 : 1].push(v);
+            });
+            return ret;
+        },
+
+        /**
+         * Invokes a method on each item in an Array.
+         * <pre><code>
+// Example:
+Ext.invoke(Ext.query("p"), "getAttribute", "id");
+// [el1.getAttribute("id"), el2.getAttribute("id"), ..., elN.getAttribute("id")]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to invoke the method on.
+         * @param {String} methodName The method name to invoke.
+         * @param {...*} args Arguments to send into the method invocation.
+         * @return {Array} The results of invoking the method on each item in the array.
+         */
+        invoke : function(arr, methodName){
+            var ret = [],
+                args = Array.prototype.slice.call(arguments, 2);
+            Ext.each(arr, function(v,i) {
+                if (v && typeof v[methodName] == 'function') {
+                    ret.push(v[methodName].apply(v, args));
+                } else {
+                    ret.push(undefined);
+                }
+            });
+            return ret;
+        },
+
+        /**
+         * Plucks the value of a property from each item in the Array
+         * <pre><code>
+// Example:
+Ext.pluck(Ext.query("p"), "className"); // [el1.className, el2.className, ..., elN.className]
+         * </code></pre>
+         * @param {Array|NodeList} arr The Array of items to pluck the value from.
+         * @param {String} prop The property name to pluck from each element.
+         * @return {Array} The value from each item in the Array.
+         */
+        pluck : function(arr, prop){
+            var ret = [];
+            Ext.each(arr, function(v) {
+                ret.push( v[prop] );
+            });
+            return ret;
+        },
+
+        /**
+         * <p>Zips N sets together.</p>
+         * <pre><code>
+// Example 1:
+Ext.zip([1,2,3],[4,5,6]); // [[1,4],[2,5],[3,6]]
+// Example 2:
+Ext.zip(
+    [ "+", "-", "+"],
+    [  12,  10,  22],
+    [  43,  15,  96],
+    function(a, b, c){
+        return "$" + a + "" + b + "." + c
+    }
+); // ["$+12.43", "$-10.15", "$+22.96"]
+         * </code></pre>
+         * @param {Arrays|NodeLists} arr This argument may be repeated. Array(s) to contribute values.
+         * @param {Function} zipper (optional) The last item in the argument list. This will drive how the items are zipped together.
+         * @return {Array} The zipped set.
+         */
+        zip : function(){
+            var parts = Ext.partition(arguments, function( val ){ return typeof val != 'function'; }),
+                arrs = parts[0],
+                fn = parts[1][0],
+                len = Ext.max(Ext.pluck(arrs, "length")),
+                ret = [];
+
+            for (var i = 0; i < len; i++) {
+                ret[i] = [];
+                if(fn){
+                    ret[i] = fn.apply(fn, Ext.pluck(arrs, i));
+                }else{
+                    for (var j = 0, aLen = arrs.length; j < aLen; j++){
+                        ret[i].push( arrs[j][i] );
+                    }
+                }
+            }
+            return ret;
+        },
+
+        /**
+         * This is shorthand reference to {@link Ext.ComponentMgr#get}.
+         * Looks up an existing {@link Ext.Component Component} by {@link Ext.Component#id id}
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <tt>undefined</tt> if not found, or <tt>null</tt> if a
+         * Class was found.
+        */
+        getCmp : function(id){
+            return Ext.ComponentMgr.get(id);
+        },
+
+        /**
+         * By default, Ext intelligently decides whether floating elements should be shimmed. If you are using flash,
+         * you may want to set this to true.
+         * @type Boolean
+         */
+        useShims: E.isIE6 || (E.isMac && E.isGecko2),
+
+        // inpired by a similar function in mootools library
+        /**
+         * Returns the type of object that is passed in. If the object passed in is null or undefined it
+         * return false otherwise it returns one of the following values:<div class="mdetail-params"><ul>
+         * <li><b>string</b>: If the object passed is a string</li>
+         * <li><b>number</b>: If the object passed is a number</li>
+         * <li><b>boolean</b>: If the object passed is a boolean value</li>
+         * <li><b>date</b>: If the object passed is a Date object</li>
+         * <li><b>function</b>: If the object passed is a function reference</li>
+         * <li><b>object</b>: If the object passed is an object</li>
+         * <li><b>array</b>: If the object passed is an array</li>
+         * <li><b>regexp</b>: If the object passed is a regular expression</li>
+         * <li><b>element</b>: If the object passed is a DOM Element</li>
+         * <li><b>nodelist</b>: If the object passed is a DOM NodeList</li>
+         * <li><b>textnode</b>: If the object passed is a DOM text node and contains something other than whitespace</li>
+         * <li><b>whitespace</b>: If the object passed is a DOM text node and contains only whitespace</li>
+         * </ul></div>
+         * @param {Mixed} object
+         * @return {String}
+         */
+        type : function(o){
+            if(o === undefined || o === null){
+                return false;
+            }
+            if(o.htmlElement){
+                return 'element';
+            }
+            var t = typeof o;
+            if(t == 'object' && o.nodeName) {
+                switch(o.nodeType) {
+                    case 1: return 'element';
+                    case 3: return (/\S/).test(o.nodeValue) ? 'textnode' : 'whitespace';
+                }
+            }
+            if(t == 'object' || t == 'function') {
+                switch(o.constructor) {
+                    case Array: return 'array';
+                    case RegExp: return 'regexp';
+                    case Date: return 'date';
+                }
+                if(typeof o.length == 'number' && typeof o.item == 'function') {
+                    return 'nodelist';
+                }
+            }
+            return t;
+        },
+
+        intercept : function(o, name, fn, scope){
+            o[name] = o[name].createInterceptor(fn, scope);
+        },
+
+        // internal
+        callback : function(cb, scope, args, delay){
+            if(typeof cb == 'function'){
+                if(delay){
+                    cb.defer(delay, scope, args || []);
+                }else{
+                    cb.apply(scope, args || []);
+                }
+            }
+        }
+    };
+}());
+
+/**
+ * @class Function
+ * These functions are available on every Function object (any JavaScript function).
+ */
+Ext.apply(Function.prototype, {
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = sayHi.createSequence(function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+</code></pre>
+     * @param {Function} fcn The function to sequence
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createSequence : function(fcn, scope){
+        var method = this;
+        return (typeof fcn != 'function') ?
+                this :
+                function(){
+                    var retval = method.apply(this || window, arguments);
+                    fcn.apply(scope || this || window, arguments);
+                    return retval;
+                };
+    }
+});
+
+
+/**
+ * @class String
+ * These functions are available as static methods on the JavaScript String object.
+ */
+Ext.applyIf(String, {
+
+    /**
+     * Escapes the passed string for ' and \
+     * @param {String} string The string to escape
+     * @return {String} The escaped string
+     * @static
+     */
+    escape : function(string) {
+        return string.replace(/('|\\)/g, "\\$1");
+    },
+
+    /**
+     * Pads the left side of a string with a specified character.  This is especially useful
+     * for normalizing number and date strings.  Example usage:
+     * <pre><code>
+var s = String.leftPad('123', 5, '0');
+// s now contains the string: '00123'
+     * </code></pre>
+     * @param {String} string The original string
+     * @param {Number} size The total length of the output string
+     * @param {String} char (optional) The character with which to pad the original string (defaults to empty string " ")
+     * @return {String} The padded string
+     * @static
+     */
+    leftPad : function (val, size, ch) {
+        var result = String(val);
+        if(!ch) {
+            ch = " ";
+        }
+        while (result.length < size) {
+            result = ch + result;
+        }
+        return result;
+    }
+});
+
+/**
+ * Utility function that allows you to easily switch a string between two alternating values.  The passed value
+ * is compared to the current string, and if they are equal, the other value that was passed in is returned.  If
+ * they are already different, the first value passed in is returned.  Note that this method returns the new value
+ * but does not change the current string.
+ * <pre><code>
+// alternate sort directions
+sort = sort.toggle('ASC', 'DESC');
+
+// instead of conditional logic:
+sort = (sort == 'ASC' ? 'DESC' : 'ASC');
+</code></pre>
+ * @param {String} value The value to compare to the current string
+ * @param {String} other The new value to use if the string already equals the first value passed in
+ * @return {String} The new value
+ */
+String.prototype.toggle = function(value, other){
+    return this == value ? other : value;
+};
+
+/**
+ * Trims whitespace from either end of a string, leaving spaces within the string intact.  Example:
+ * <pre><code>
+var s = '  foo bar  ';
+alert('-' + s + '-');         //alerts "- foo bar -"
+alert('-' + s.trim() + '-');  //alerts "-foo bar-"
+</code></pre>
+ * @return {String} The trimmed string
+ */
+String.prototype.trim = function(){
+    var re = /^\s+|\s+$/g;
+    return function(){ return this.replace(re, ""); };
+}();
+
+// here to prevent dependency on Date.js
+/**
+ Returns the number of milliseconds between this date and date
+ @param {Date} date (optional) Defaults to now
+ @return {Number} The diff in milliseconds
+ @member Date getElapsed
+ */
+Date.prototype.getElapsed = function(date) {
+    return Math.abs((date || new Date()).getTime()-this.getTime());
+};
+
+
+/**
+ * @class Number
+ */
+Ext.applyIf(Number.prototype, {
+    /**
+     * Checks whether or not the current number is within a desired range.  If the number is already within the
+     * range it is returned, otherwise the min or max value is returned depending on which side of the range is
+     * exceeded.  Note that this method returns the constrained value but does not change the current number.
+     * @param {Number} min The minimum number in the range
+     * @param {Number} max The maximum number in the range
+     * @return {Number} The constrained value if outside the range, otherwise the current value
+     */
+    constrain : function(min, max){
+        return Math.min(Math.max(this, min), max);
+    }
+});
+Ext.lib.Dom.getRegion = function(el) {
+    return Ext.lib.Region.getRegion(el);
+};	Ext.lib.Region = function(t, r, b, l) {
+		var me = this;
+        me.top = t;
+        me[1] = t;
+        me.right = r;
+        me.bottom = b;
+        me.left = l;
+        me[0] = l;
+    };
+
+    Ext.lib.Region.prototype = {
+        contains : function(region) {
+	        var me = this;
+            return ( region.left >= me.left &&
+                     region.right <= me.right &&
+                     region.top >= me.top &&
+                     region.bottom <= me.bottom );
+
+        },
+
+        getArea : function() {
+	        var me = this;
+            return ( (me.bottom - me.top) * (me.right - me.left) );
+        },
+
+        intersect : function(region) {
+            var me = this,
+            	t = Math.max(me.top, region.top),
+            	r = Math.min(me.right, region.right),
+            	b = Math.min(me.bottom, region.bottom),
+            	l = Math.max(me.left, region.left);
+
+            if (b >= t && r >= l) {
+                return new Ext.lib.Region(t, r, b, l);
+            }
+        },
+        
+        union : function(region) {
+	        var me = this,
+            	t = Math.min(me.top, region.top),
+            	r = Math.max(me.right, region.right),
+            	b = Math.max(me.bottom, region.bottom),
+            	l = Math.min(me.left, region.left);
+
+            return new Ext.lib.Region(t, r, b, l);
+        },
+
+        constrainTo : function(r) {
+	        var me = this;
+            me.top = me.top.constrain(r.top, r.bottom);
+            me.bottom = me.bottom.constrain(r.top, r.bottom);
+            me.left = me.left.constrain(r.left, r.right);
+            me.right = me.right.constrain(r.left, r.right);
+            return me;
+        },
+
+        adjust : function(t, l, b, r) {
+	        var me = this;
+            me.top += t;
+            me.left += l;
+            me.right += r;
+            me.bottom += b;
+            return me;
+        }
+    };
+
+    Ext.lib.Region.getRegion = function(el) {
+        var p = Ext.lib.Dom.getXY(el),
+        	t = p[1],
+        	r = p[0] + el.offsetWidth,
+        	b = p[1] + el.offsetHeight,
+        	l = p[0];
+
+        return new Ext.lib.Region(t, r, b, l);
+    };	Ext.lib.Point = function(x, y) {
+        if (Ext.isArray(x)) {
+            y = x[1];
+            x = x[0];
+        }
+        var me = this;
+        me.x = me.right = me.left = me[0] = x;
+        me.y = me.top = me.bottom = me[1] = y;
+    };
+
+    Ext.lib.Point.prototype = new Ext.lib.Region();
+/**
+ * @class Ext.DomHelper
+ */
+Ext.apply(Ext.DomHelper,
+function(){
+    var pub,
+        afterbegin = 'afterbegin',
+        afterend = 'afterend',
+        beforebegin = 'beforebegin',
+        beforeend = 'beforeend',
+        confRe = /tag|children|cn|html$/i;
+
+    // private
+    function doInsert(el, o, returnElement, pos, sibling, append){
+        el = Ext.getDom(el);
+        var newNode;
+        if (pub.useDom) {
+            newNode = createDom(o, null);
+            if (append) {
+                el.appendChild(newNode);
+            } else {
+                (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
+            }
+        } else {
+            newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
+        }
+        return returnElement ? Ext.get(newNode, true) : newNode;
+    }
+
+    // build as dom
+    /** @ignore */
+    function createDom(o, parentNode){
+        var el,
+            doc = document,
+            useSet,
+            attr,
+            val,
+            cn;
+
+        if (Ext.isArray(o)) {                       // Allow Arrays of siblings to be inserted
+            el = doc.createDocumentFragment(); // in one shot using a DocumentFragment
+            for (var i = 0, l = o.length; i < l; i++) {
+                createDom(o[i], el);
+            }
+        } else if (typeof o == 'string') {         // Allow a string as a child spec.
+            el = doc.createTextNode(o);
+        } else {
+            el = doc.createElement( o.tag || 'div' );
+            useSet = !!el.setAttribute; // In IE some elements don't have setAttribute
+            for (var attr in o) {
+                if(!confRe.test(attr)){
+                    val = o[attr];
+                    if(attr == 'cls'){
+                        el.className = val;
+                    }else{
+                        if(useSet){
+                            el.setAttribute(attr, val);
+                        }else{
+                            el[attr] = val;
+                        }
+                    }
+                }
+            }
+            Ext.DomHelper.applyStyles(el, o.style);
+
+            if ((cn = o.children || o.cn)) {
+                createDom(cn, el);
+            } else if (o.html) {
+                el.innerHTML = o.html;
+            }
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    }
+
+    pub = {
+        /**
+         * Creates a new Ext.Template from the DOM object spec.
+         * @param {Object} o The DOM object spec (and children)
+         * @return {Ext.Template} The new template
+         */
+        createTemplate : function(o){
+            var html = Ext.DomHelper.createHtml(o);
+            return new Ext.Template(html);
+        },
+
+        /** True to force the use of DOM instead of html fragments @type Boolean */
+        useDom : false,
+
+        /**
+         * Creates new DOM element(s) and inserts them before el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertBefore : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforebegin);
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them after el.
+         * @param {Mixed} el The context element
+         * @param {Object} o The DOM object spec (and children)
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertAfter : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterend, 'nextSibling');
+        },
+
+        /**
+         * Creates new DOM element(s) and inserts them as the first child of el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        insertFirst : function(el, o, returnElement){
+            return doInsert(el, o, returnElement, afterbegin, 'firstChild');
+        },
+
+        /**
+         * Creates new DOM element(s) and appends them to el.
+         * @param {Mixed} el The context element
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @param {Boolean} returnElement (optional) true to return a Ext.Element
+         * @return {HTMLElement/Ext.Element} The new node
+         * @hide (repeat)
+         */
+        append: function(el, o, returnElement){
+            return doInsert(el, o, returnElement, beforeend, '', true);
+        },
+
+        /**
+         * Creates new DOM element(s) without inserting them to the document.
+         * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
+         * @return {HTMLElement} The new uninserted node
+         */
+        createDom: createDom
+    };
+    return pub;
+}());
+/**
+ * @class Ext.Template
+ */
+Ext.apply(Ext.Template.prototype, {
+    /**
+     * @cfg {Boolean} disableFormats Specify <tt>true</tt> to disable format
+     * functions in the template. If the template does not contain
+     * {@link Ext.util.Format format functions}, setting <code>disableFormats</code>
+     * to true will reduce <code>{@link #apply}</code> time. Defaults to <tt>false</tt>.
+     * <pre><code>
+var t = new Ext.Template(
+    '&lt;div name="{id}"&gt;',
+        '&lt;span class="{cls}"&gt;{name} {value}&lt;/span&gt;',
+    '&lt;/div&gt;',
+    {
+        compiled: true,      // {@link #compile} immediately
+        disableFormats: true // reduce <code>{@link #apply}</code> time since no formatting
+    }
+);
+     * </code></pre>
+     * For a list of available format functions, see {@link Ext.util.Format}.
+     */
+    disableFormats : false,
+    /**
+     * See <code>{@link #disableFormats}</code>.
+     * @type Boolean
+     * @property disableFormats
+     */
+
+    /**
+     * The regular expression used to match template variables
+     * @type RegExp
+     * @property
+     * @hide repeat doc
+     */
+    re : /\{([\w\-]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
+    argsRe : /^\s*['"](.*)["']\s*$/,
+    compileARe : /\\/g,
+    compileBRe : /(\r\n|\n)/g,
+    compileCRe : /'/g,
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     * @hide repeat doc
+     */
+    applyTemplate : function(values){
+        var me = this,
+            useF = me.disableFormats !== true,
+            fm = Ext.util.Format,
+            tpl = me;
+
+        if(me.compiled){
+            return me.compiled(values);
+        }
+        function fn(m, name, format, args){
+            if (format && useF) {
+                if (format.substr(0, 5) == "this.") {
+                    return tpl.call(format.substr(5), values[name], values);
+                } else {
+                    if (args) {
+                        // quoted values are required for strings in compiled templates,
+                        // but for non compiled we need to strip them
+                        // quoted reversed for jsmin
+                        var re = me.argsRe;
+                        args = args.split(',');
+                        for(var i = 0, len = args.length; i < len; i++){
+                            args[i] = args[i].replace(re, "$1");
+                        }
+                        args = [values[name]].concat(args);
+                    } else {
+                        args = [values[name]];
+                    }
+                    return fm[format].apply(fm, args);
+                }
+            } else {
+                return values[name] !== undefined ? values[name] : "";
+            }
+        }
+        return me.html.replace(me.re, fn);
+    },
+
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead.
+     * @return {Ext.Template} this
+     * @hide repeat doc
+     */
+    compile : function(){
+        var me = this,
+            fm = Ext.util.Format,
+            useF = me.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args){
+            if(format && useF){
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            }else{
+                args= ''; format = "(values['" + name + "'] == undefined ? '' : ";
+            }
+            return "'"+ sep + format + "values['" + name + "']" + args + ")"+sep+"'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "this.compiled = function(values){ return '" +
+                   me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn) +
+                    "';};";
+        }else{
+            body = ["this.compiled = function(values){ return ['"];
+            body.push(me.html.replace(me.compileARe, '\\\\').replace(me.compileBRe, '\\n').replace(me.compileCRe, "\\'").replace(me.re, fn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return me;
+    },
+
+    // private function used to call members
+    call : function(fnName, value, allValues){
+        return this[fnName](value, allValues);
+    }
+});
+Ext.Template.prototype.apply = Ext.Template.prototype.applyTemplate;
+/**
+ * @class Ext.util.Functions
+ * @singleton
+ */
+Ext.util.Functions = {
+    /**
+     * Creates an interceptor function. The passed function is called before the original one. If it returns false,
+     * the original one is not called. The resulting function returns the results of the original function.
+     * The passed function is called with the parameters of the original function. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+// create a new function that validates input without
+// directly modifying the original function:
+var sayHiToFriend = Ext.createInterceptor(sayHi, function(name){
+    return name == 'Brian';
+});
+
+sayHiToFriend('Fred');  // no alert
+sayHiToFriend('Brian'); // alerts "Hi, Brian"
+       </code></pre>
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to call before the original
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+     * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+     * @return {Function} The new function
+     */
+    createInterceptor: function(origFn, newFn, scope) { 
+        var method = origFn;
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var me = this,
+                    args = arguments;
+                newFn.target = me;
+                newFn.method = origFn;
+                return (newFn.apply(scope || me || window, args) !== false) ?
+                        origFn.apply(me || window, args) :
+                        null;
+            };
+        }
+    },
+
+    /**
+     * Creates a delegate (callback) that sets the scope to obj.
+     * Call directly on any function. Example: <code>Ext.createDelegate(this.myFunction, this, [arg1, arg2])</code>
+     * Will create a function that is automatically scoped to obj so that the <tt>this</tt> variable inside the
+     * callback points to obj. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    // Note this use of "this.text" here.  This function expects to
+    // execute within a scope that contains a text property.  In this
+    // example, the "this" variable is pointing to the btn object that
+    // was passed in createDelegate below.
+    alert('Hi, ' + name + '. You clicked the "' + this.text + '" button.');
+}
+
+var btn = new Ext.Button({
+    text: 'Say Hi',
+    renderTo: Ext.getBody()
+});
+
+// This callback will execute in the scope of the
+// button instance. Clicking the button alerts
+// "Hi, Fred. You clicked the "Say Hi" button."
+btn.on('click', Ext.createDelegate(sayHi, btn, ['Fred']));
+       </code></pre>
+     * @param {Function} fn The function to delegate.
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Function} The new function
+     */
+    createDelegate: function(fn, obj, args, appendArgs) {
+        if (!Ext.isFunction(fn)) {
+            return fn;
+        }
+        return function() {
+            var callArgs = args || arguments;
+            if (appendArgs === true) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                callArgs = callArgs.concat(args);
+            }
+            else if (Ext.isNumber(appendArgs)) {
+                callArgs = Array.prototype.slice.call(arguments, 0);
+                // copy arguments first
+                var applyArgs = [appendArgs, 0].concat(args);
+                // create method call params
+                Array.prototype.splice.apply(callArgs, applyArgs);
+                // splice them in
+            }
+            return fn.apply(obj || window, callArgs);
+        };
+    },
+
+    /**
+     * Calls this function after the number of millseconds specified, optionally in a specific scope. Example usage:
+     * <pre><code>
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+// executes immediately:
+sayHi('Fred');
+
+// executes after 2 seconds:
+Ext.defer(sayHi, 2000, this, ['Fred']);
+
+// this syntax is sometimes useful for deferring
+// execution of an anonymous function:
+Ext.defer(function(){
+    alert('Anonymous');
+}, 100);
+       </code></pre>
+     * @param {Function} fn The function to defer.
+     * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+     * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+     * <b>If omitted, defaults to the browser window.</b>
+     * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+     * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+     * if a number the args are inserted at the specified position
+     * @return {Number} The timeout id that can be used with clearTimeout
+     */
+    defer: function(fn, millis, obj, args, appendArgs) {
+        fn = Ext.util.Functions.createDelegate(fn, obj, args, appendArgs);
+        if (millis > 0) {
+            return setTimeout(fn, millis);
+        }
+        fn();
+        return 0;
+    },
+
+
+    /**
+     * Create a combined function call sequence of the original function + the passed function.
+     * The resulting function returns the results of the original function.
+     * The passed fcn is called with the parameters of the original function. Example usage:
+     * 
+
+var sayHi = function(name){
+    alert('Hi, ' + name);
+}
+
+sayHi('Fred'); // alerts "Hi, Fred"
+
+var sayGoodbye = Ext.createSequence(sayHi, function(name){
+    alert('Bye, ' + name);
+});
+
+sayGoodbye('Fred'); // both alerts show
+
+     * @param {Function} origFn The original function.
+     * @param {Function} newFn The function to sequence
+     * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+     * If omitted, defaults to the scope in which the original function is called or the browser window.
+     * @return {Function} The new function
+     */
+    createSequence: function(origFn, newFn, scope) {
+        if (!Ext.isFunction(newFn)) {
+            return origFn;
+        }
+        else {
+            return function() {
+                var retval = origFn.apply(this || window, arguments);
+                newFn.apply(scope || this || window, arguments);
+                return retval;
+            };
+        }
+    }
+};
+
+/**
+ * Shorthand for {@link Ext.util.Functions#defer}   
+ * @param {Function} fn The function to defer.
+ * @param {Number} millis The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is executed immediately)
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Number} The timeout id that can be used with clearTimeout
+ * @member Ext
+ * @method defer
+ */
+
+Ext.defer = Ext.util.Functions.defer;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createInterceptor}   
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to call before the original
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the passed function is executed.
+ * <b>If omitted, defaults to the scope in which the original function is called or the browser window.</b>
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createInterceptor = Ext.util.Functions.createInterceptor;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createSequence}
+ * @param {Function} origFn The original function.
+ * @param {Function} newFn The function to sequence
+ * @param {Object} scope (optional) The scope (this reference) in which the passed function is executed.
+ * If omitted, defaults to the scope in which the original function is called or the browser window.
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+
+Ext.createSequence = Ext.util.Functions.createSequence;
+
+/**
+ * Shorthand for {@link Ext.util.Functions#createDelegate}
+ * @param {Function} fn The function to delegate.
+ * @param {Object} scope (optional) The scope (<code><b>this</b></code> reference) in which the function is executed.
+ * <b>If omitted, defaults to the browser window.</b>
+ * @param {Array} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {Boolean/Number} appendArgs (optional) if True args are appended to call args instead of overriding,
+ * if a number the args are inserted at the specified position
+ * @return {Function} The new function
+ * @member Ext
+ * @method defer
+ */
+Ext.createDelegate = Ext.util.Functions.createDelegate;
+/**
+ * @class Ext.util.Observable
+ */
+Ext.apply(Ext.util.Observable.prototype, function(){
+    // this is considered experimental (along with beforeMethod, afterMethod, removeMethodListener?)
+    // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+    // private
+    function getMethodEvent(method){
+        var e = (this.methodEvents = this.methodEvents ||
+        {})[method], returnValue, v, cancel, obj = this;
+
+        if (!e) {
+            this.methodEvents[method] = e = {};
+            e.originalFn = this[method];
+            e.methodName = method;
+            e.before = [];
+            e.after = [];
+
+            var makeCall = function(fn, scope, args){
+                if((v = fn.apply(scope || obj, args)) !== undefined){
+                    if (typeof v == 'object') {
+                        if(v.returnValue !== undefined){
+                            returnValue = v.returnValue;
+                        }else{
+                            returnValue = v;
+                        }
+                        cancel = !!v.cancel;
+                    }
+                    else
+                        if (v === false) {
+                            cancel = true;
+                        }
+                        else {
+                            returnValue = v;
+                        }
+                }
+            };
+
+            this[method] = function(){
+                var args = Array.prototype.slice.call(arguments, 0),
+                    b;
+                returnValue = v = undefined;
+                cancel = false;
+
+                for(var i = 0, len = e.before.length; i < len; i++){
+                    b = e.before[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+
+                if((v = e.originalFn.apply(obj, args)) !== undefined){
+                    returnValue = v;
+                }
+
+                for(var i = 0, len = e.after.length; i < len; i++){
+                    b = e.after[i];
+                    makeCall(b.fn, b.scope, args);
+                    if (cancel) {
+                        return returnValue;
+                    }
+                }
+                return returnValue;
+            };
+        }
+        return e;
+    }
+
+    return {
+        // these are considered experimental
+        // allows for easier interceptor and sequences, including cancelling and overwriting the return value of the call
+        // adds an 'interceptor' called before the original method
+        beforeMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).before.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        // adds a 'sequence' called after the original method
+        afterMethod : function(method, fn, scope){
+            getMethodEvent.call(this, method).after.push({
+                fn: fn,
+                scope: scope
+            });
+        },
+
+        removeMethodListener: function(method, fn, scope){
+            var e = this.getMethodEvent(method);
+            for(var i = 0, len = e.before.length; i < len; i++){
+                if(e.before[i].fn == fn && e.before[i].scope == scope){
+                    e.before.splice(i, 1);
+                    return;
+                }
+            }
+            for(var i = 0, len = e.after.length; i < len; i++){
+                if(e.after[i].fn == fn && e.after[i].scope == scope){
+                    e.after.splice(i, 1);
+                    return;
+                }
+            }
+        },
+
+        /**
+         * Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.
+         * @param {Object} o The Observable whose events this object is to relay.
+         * @param {Array} events Array of event names to relay.
+         */
+        relayEvents : function(o, events){
+            var me = this;
+            function createHandler(ename){
+                return function(){
+                    return me.fireEvent.apply(me, [ename].concat(Array.prototype.slice.call(arguments, 0)));
+                };
+            }
+            for(var i = 0, len = events.length; i < len; i++){
+                var ename = events[i];
+                me.events[ename] = me.events[ename] || true;
+                o.on(ename, createHandler(ename), me);
+            }
+        },
+
+        /**
+         * <p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
+         * <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
+         * <p>This is commonly used by Ext.Components to bubble events to owner Containers. See {@link Ext.Component.getBubbleTarget}. The default
+         * implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+         * access the required target more quickly.</p>
+         * <p>Example:</p><pre><code>
+Ext.override(Ext.form.Field, {
+    //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
+    initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
+        this.enableBubble('change');
+    }),
+
+    //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
+    getBubbleTarget : function() {
+        if (!this.formPanel) {
+            this.formPanel = this.findParentByType('form');
+        }
+        return this.formPanel;
+    }
+});
+
+var myForm = new Ext.formPanel({
+    title: 'User Details',
+    items: [{
+        ...
+    }],
+    listeners: {
+        change: function() {
+            // Title goes red if form has been modified.
+            myForm.header.setStyle('color', 'red');
+        }
+    }
+});
+</code></pre>
+         * @param {String/Array} events The event name to bubble, or an Array of event names.
+         */
+        enableBubble : function(events){
+            var me = this;
+            if(!Ext.isEmpty(events)){
+                events = Ext.isArray(events) ? events : Array.prototype.slice.call(arguments, 0);
+                for(var i = 0, len = events.length; i < len; i++){
+                    var ename = events[i];
+                    ename = ename.toLowerCase();
+                    var ce = me.events[ename] || true;
+                    if (typeof ce == 'boolean') {
+                        ce = new Ext.util.Event(me, ename);
+                        me.events[ename] = ce;
+                    }
+                    ce.bubble = true;
+                }
+            }
+        }
+    };
+}());
+
+
+/**
+ * Starts capture on the specified Observable. All events will be passed
+ * to the supplied function with the event name + standard signature of the event
+ * <b>before</b> the event is fired. If the supplied function returns false,
+ * the event will not fire.
+ * @param {Observable} o The Observable to capture events from.
+ * @param {Function} fn The function to call when an event is fired.
+ * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Observable firing the event.
+ * @static
+ */
+Ext.util.Observable.capture = function(o, fn, scope){
+    o.fireEvent = o.fireEvent.createInterceptor(fn, scope);
+};
+
+
+/**
+ * Sets observability on the passed class constructor.<p>
+ * <p>This makes any event fired on any instance of the passed class also fire a single event through
+ * the <i>class</i> allowing for central handling of events on many instances at once.</p>
+ * <p>Usage:</p><pre><code>
+Ext.util.Observable.observeClass(Ext.data.Connection);
+Ext.data.Connection.on('beforerequest', function(con, options) {
+    console.log('Ajax request made to ' + options.url);
+});</code></pre>
+ * @param {Function} c The class constructor to make observable.
+ * @param {Object} listeners An object containing a series of listeners to add. See {@link #addListener}.
+ * @static
+ */
+Ext.util.Observable.observeClass = function(c, listeners){
+    if(c){
+      if(!c.fireEvent){
+          Ext.apply(c, new Ext.util.Observable());
+          Ext.util.Observable.capture(c.prototype, c.fireEvent, c);
+      }
+      if(typeof listeners == 'object'){
+          c.on(listeners);
+      }
+      return c;
+   }
+};
+/**
+* @class Ext.EventManager
+*/
+Ext.apply(Ext.EventManager, function(){
+   var resizeEvent,
+       resizeTask,
+       textEvent,
+       textSize,
+       D = Ext.lib.Dom,
+       propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/,
+       unload = Ext.EventManager._unload,
+       curWidth = 0,
+       curHeight = 0,
+       // note 1: IE fires ONLY the keydown event on specialkey autorepeat
+       // note 2: Safari < 3.1, Gecko (Mac/Linux) & Opera fire only the keypress event on specialkey autorepeat
+       // (research done by @Jan Wolter at http://unixpapa.com/js/key.html)
+       useKeydown = Ext.isWebKit ?
+                   Ext.num(navigator.userAgent.match(/AppleWebKit\/(\d+)/)[1]) >= 525 :
+                   !((Ext.isGecko && !Ext.isWindows) || Ext.isOpera);
+
+   return {
+       _unload: function(){
+           Ext.EventManager.un(window, "resize", this.fireWindowResize, this);
+           unload.call(Ext.EventManager);    
+       },
+       
+       // private
+       doResizeEvent: function(){
+           var h = D.getViewHeight(),
+               w = D.getViewWidth();
+
+            //whacky problem in IE where the resize event will fire even though the w/h are the same.
+            if(curHeight != h || curWidth != w){
+               resizeEvent.fire(curWidth = w, curHeight = h);
+            }
+       },
+
+       /**
+        * Adds a listener to be notified when the browser window is resized and provides resize event buffering (100 milliseconds),
+        * passes new viewport width and height to handlers.
+        * @param {Function} fn      The handler function the window resize event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onWindowResize : function(fn, scope, options){
+           if(!resizeEvent){
+               resizeEvent = new Ext.util.Event();
+               resizeTask = new Ext.util.DelayedTask(this.doResizeEvent);
+               Ext.EventManager.on(window, "resize", this.fireWindowResize, this);
+           }
+           resizeEvent.addListener(fn, scope, options);
+       },
+
+       // exposed only to allow manual firing
+       fireWindowResize : function(){
+           if(resizeEvent){
+               resizeTask.delay(100);
+           }
+       },
+
+       /**
+        * Adds a listener to be notified when the user changes the active text size. Handler gets called with 2 params, the old size and the new size.
+        * @param {Function} fn      The function the event invokes.
+        * @param {Object}   scope   The scope (<code>this</code> reference) in which the handler function executes. Defaults to the browser window.
+        * @param {boolean}  options Options object as passed to {@link Ext.Element#addListener}
+        */
+       onTextResize : function(fn, scope, options){
+           if(!textEvent){
+               textEvent = new Ext.util.Event();
+               var textEl = new Ext.Element(document.createElement('div'));
+               textEl.dom.className = 'x-text-resize';
+               textEl.dom.innerHTML = 'X';
+               textEl.appendTo(document.body);
+               textSize = textEl.dom.offsetHeight;
+               setInterval(function(){
+                   if(textEl.dom.offsetHeight != textSize){
+                       textEvent.fire(textSize, textSize = textEl.dom.offsetHeight);
+                   }
+               }, this.textResizeInterval);
+           }
+           textEvent.addListener(fn, scope, options);
+       },
+
+       /**
+        * Removes the passed window resize listener.
+        * @param {Function} fn        The method the event invokes
+        * @param {Object}   scope    The scope of handler
+        */
+       removeResizeListener : function(fn, scope){
+           if(resizeEvent){
+               resizeEvent.removeListener(fn, scope);
+           }
+       },
+
+       // private
+       fireResize : function(){
+           if(resizeEvent){
+               resizeEvent.fire(D.getViewWidth(), D.getViewHeight());
+           }
+       },
+
+        /**
+        * The frequency, in milliseconds, to check for text resize events (defaults to 50)
+        */
+       textResizeInterval : 50,
+
+       /**
+        * Url used for onDocumentReady with using SSL (defaults to Ext.SSL_SECURE_URL)
+        */
+       ieDeferSrc : false,
+       
+       // protected, short accessor for useKeydown
+       getKeyEvent : function(){
+           return useKeydown ? 'keydown' : 'keypress';
+       },
+
+       // protected for use inside the framework
+       // detects whether we should use keydown or keypress based on the browser.
+       useKeydown: useKeydown
+   };
+}());
+
+Ext.EventManager.on = Ext.EventManager.addListener;
+
+
+Ext.apply(Ext.EventObjectImpl.prototype, {
+   /** Key constant @type Number */
+   BACKSPACE: 8,
+   /** Key constant @type Number */
+   TAB: 9,
+   /** Key constant @type Number */
+   NUM_CENTER: 12,
+   /** Key constant @type Number */
+   ENTER: 13,
+   /** Key constant @type Number */
+   RETURN: 13,
+   /** Key constant @type Number */
+   SHIFT: 16,
+   /** Key constant @type Number */
+   CTRL: 17,
+   CONTROL : 17, // legacy
+   /** Key constant @type Number */
+   ALT: 18,
+   /** Key constant @type Number */
+   PAUSE: 19,
+   /** Key constant @type Number */
+   CAPS_LOCK: 20,
+   /** Key constant @type Number */
+   ESC: 27,
+   /** Key constant @type Number */
+   SPACE: 32,
+   /** Key constant @type Number */
+   PAGE_UP: 33,
+   PAGEUP : 33, // legacy
+   /** Key constant @type Number */
+   PAGE_DOWN: 34,
+   PAGEDOWN : 34, // legacy
+   /** Key constant @type Number */
+   END: 35,
+   /** Key constant @type Number */
+   HOME: 36,
+   /** Key constant @type Number */
+   LEFT: 37,
+   /** Key constant @type Number */
+   UP: 38,
+   /** Key constant @type Number */
+   RIGHT: 39,
+   /** Key constant @type Number */
+   DOWN: 40,
+   /** Key constant @type Number */
+   PRINT_SCREEN: 44,
+   /** Key constant @type Number */
+   INSERT: 45,
+   /** Key constant @type Number */
+   DELETE: 46,
+   /** Key constant @type Number */
+   ZERO: 48,
+   /** Key constant @type Number */
+   ONE: 49,
+   /** Key constant @type Number */
+   TWO: 50,
+   /** Key constant @type Number */
+   THREE: 51,
+   /** Key constant @type Number */
+   FOUR: 52,
+   /** Key constant @type Number */
+   FIVE: 53,
+   /** Key constant @type Number */
+   SIX: 54,
+   /** Key constant @type Number */
+   SEVEN: 55,
+   /** Key constant @type Number */
+   EIGHT: 56,
+   /** Key constant @type Number */
+   NINE: 57,
+   /** Key constant @type Number */
+   A: 65,
+   /** Key constant @type Number */
+   B: 66,
+   /** Key constant @type Number */
+   C: 67,
+   /** Key constant @type Number */
+   D: 68,
+   /** Key constant @type Number */
+   E: 69,
+   /** Key constant @type Number */
+   F: 70,
+   /** Key constant @type Number */
+   G: 71,
+   /** Key constant @type Number */
+   H: 72,
+   /** Key constant @type Number */
+   I: 73,
+   /** Key constant @type Number */
+   J: 74,
+   /** Key constant @type Number */
+   K: 75,
+   /** Key constant @type Number */
+   L: 76,
+   /** Key constant @type Number */
+   M: 77,
+   /** Key constant @type Number */
+   N: 78,
+   /** Key constant @type Number */
+   O: 79,
+   /** Key constant @type Number */
+   P: 80,
+   /** Key constant @type Number */
+   Q: 81,
+   /** Key constant @type Number */
+   R: 82,
+   /** Key constant @type Number */
+   S: 83,
+   /** Key constant @type Number */
+   T: 84,
+   /** Key constant @type Number */
+   U: 85,
+   /** Key constant @type Number */
+   V: 86,
+   /** Key constant @type Number */
+   W: 87,
+   /** Key constant @type Number */
+   X: 88,
+   /** Key constant @type Number */
+   Y: 89,
+   /** Key constant @type Number */
+   Z: 90,
+   /** Key constant @type Number */
+   CONTEXT_MENU: 93,
+   /** Key constant @type Number */
+   NUM_ZERO: 96,
+   /** Key constant @type Number */
+   NUM_ONE: 97,
+   /** Key constant @type Number */
+   NUM_TWO: 98,
+   /** Key constant @type Number */
+   NUM_THREE: 99,
+   /** Key constant @type Number */
+   NUM_FOUR: 100,
+   /** Key constant @type Number */
+   NUM_FIVE: 101,
+   /** Key constant @type Number */
+   NUM_SIX: 102,
+   /** Key constant @type Number */
+   NUM_SEVEN: 103,
+   /** Key constant @type Number */
+   NUM_EIGHT: 104,
+   /** Key constant @type Number */
+   NUM_NINE: 105,
+   /** Key constant @type Number */
+   NUM_MULTIPLY: 106,
+   /** Key constant @type Number */
+   NUM_PLUS: 107,
+   /** Key constant @type Number */
+   NUM_MINUS: 109,
+   /** Key constant @type Number */
+   NUM_PERIOD: 110,
+   /** Key constant @type Number */
+   NUM_DIVISION: 111,
+   /** Key constant @type Number */
+   F1: 112,
+   /** Key constant @type Number */
+   F2: 113,
+   /** Key constant @type Number */
+   F3: 114,
+   /** Key constant @type Number */
+   F4: 115,
+   /** Key constant @type Number */
+   F5: 116,
+   /** Key constant @type Number */
+   F6: 117,
+   /** Key constant @type Number */
+   F7: 118,
+   /** Key constant @type Number */
+   F8: 119,
+   /** Key constant @type Number */
+   F9: 120,
+   /** Key constant @type Number */
+   F10: 121,
+   /** Key constant @type Number */
+   F11: 122,
+   /** Key constant @type Number */
+   F12: 123,
+
+   /** @private */
+   isNavKeyPress : function(){
+       var me = this,
+           k = this.normalizeKey(me.keyCode);
+       return (k >= 33 && k <= 40) ||  // Page Up/Down, End, Home, Left, Up, Right, Down
+       k == me.RETURN ||
+       k == me.TAB ||
+       k == me.ESC;
+   },
+
+   isSpecialKey : function(){
+       var k = this.normalizeKey(this.keyCode);
+       return (this.type == 'keypress' && this.ctrlKey) ||
+       this.isNavKeyPress() ||
+       (k == this.BACKSPACE) || // Backspace
+       (k >= 16 && k <= 20) || // Shift, Ctrl, Alt, Pause, Caps Lock
+       (k >= 44 && k <= 46);   // Print Screen, Insert, Delete
+   },
+
+   getPoint : function(){
+       return new Ext.lib.Point(this.xy[0], this.xy[1]);
+   },
+
+   /**
+    * Returns true if the control, meta, shift or alt key was pressed during this event.
+    * @return {Boolean}
+    */
+   hasModifier : function(){
+       return ((this.ctrlKey || this.altKey) || this.shiftKey);
+   }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Stops the specified event(s) from bubbling and optionally prevents the default action
+     * @param {String/Array} eventName an event / array of events to stop from bubbling
+     * @param {Boolean} preventDefault (optional) true to prevent the default action too
+     * @return {Ext.Element} this
+     */
+    swallowEvent : function(eventName, preventDefault) {
+        var me = this;
+        function fn(e) {
+            e.stopPropagation();
+            if (preventDefault) {
+                e.preventDefault();
+            }
+        }
+        
+        if (Ext.isArray(eventName)) {
+            Ext.each(eventName, function(e) {
+                 me.on(e, fn);
+            });
+            return me;
+        }
+        me.on(eventName, fn);
+        return me;
+    },
+
+    /**
+     * Create an event handler on this element such that when the event fires and is handled by this element,
+     * it will be relayed to another object (i.e., fired again as if it originated from that object instead).
+     * @param {String} eventName The type of event to relay
+     * @param {Object} object Any object that extends {@link Ext.util.Observable} that will provide the context
+     * for firing the relayed event
+     */
+    relayEvent : function(eventName, observable) {
+        this.on(eventName, function(e) {
+            observable.fireEvent(eventName, e);
+        });
+    },
+
+    /**
+     * Removes worthless text nodes
+     * @param {Boolean} forceReclean (optional) By default the element
+     * keeps track if it has been cleaned already so
+     * you can call this over and over. However, if you update the element and
+     * need to force a reclean, you can pass true.
+     */
+    clean : function(forceReclean) {
+        var me  = this,
+            dom = me.dom,
+            n   = dom.firstChild,
+            ni  = -1;
+
+        if (Ext.Element.data(dom, 'isCleaned') && forceReclean !== true) {
+            return me;
+        }
+
+        while (n) {
+            var nx = n.nextSibling;
+            if (n.nodeType == 3 && !(/\S/.test(n.nodeValue))) {
+                dom.removeChild(n);
+            } else {
+                n.nodeIndex = ++ni;
+            }
+            n = nx;
+        }
+        
+        Ext.Element.data(dom, 'isCleaned', true);
+        return me;
+    },
+
+    /**
+     * Direct access to the Updater {@link Ext.Updater#update} method. The method takes the same object
+     * parameter as {@link Ext.Updater#update}
+     * @return {Ext.Element} this
+     */
+    load : function() {
+        var updateManager = this.getUpdater();
+        updateManager.update.apply(updateManager, arguments);
+        
+        return this;
+    },
+
+    /**
+    * Gets this element's {@link Ext.Updater Updater}
+    * @return {Ext.Updater} The Updater
+    */
+    getUpdater : function() {
+        return this.updateManager || (this.updateManager = new Ext.Updater(this));
+    },
+
+    /**
+    * Update the innerHTML of this element, optionally searching for and processing scripts
+    * @param {String} html The new HTML
+    * @param {Boolean} loadScripts (optional) True to look for and process scripts (defaults to false)
+    * @param {Function} callback (optional) For async script loading you can be notified when the update completes
+    * @return {Ext.Element} this
+     */
+    update : function(html, loadScripts, callback) {
+        if (!this.dom) {
+            return this;
+        }
+        html = html || "";
+
+        if (loadScripts !== true) {
+            this.dom.innerHTML = html;
+            if (typeof callback == 'function') {
+                callback();
+            }
+            return this;
+        }
+
+        var id  = Ext.id(),
+            dom = this.dom;
+
+        html += '<span id="' + id + '"></span>';
+
+        Ext.lib.Event.onAvailable(id, function() {
+            var DOC    = document,
+                hd     = DOC.getElementsByTagName("head")[0],
+                re     = /(?:<script([^>]*)?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+                srcRe  = /\ssrc=([\'\"])(.*?)\1/i,
+                typeRe = /\stype=([\'\"])(.*?)\1/i,
+                match,
+                attrs,
+                srcMatch,
+                typeMatch,
+                el,
+                s;
+
+            while ((match = re.exec(html))) {
+                attrs = match[1];
+                srcMatch = attrs ? attrs.match(srcRe) : false;
+                if (srcMatch && srcMatch[2]) {
+                   s = DOC.createElement("script");
+                   s.src = srcMatch[2];
+                   typeMatch = attrs.match(typeRe);
+                   if (typeMatch && typeMatch[2]) {
+                       s.type = typeMatch[2];
+                   }
+                   hd.appendChild(s);
+                } else if (match[2] && match[2].length > 0) {
+                    if (window.execScript) {
+                       window.execScript(match[2]);
+                    } else {
+                       window.eval(match[2]);
+                    }
+                }
+            }
+            
+            el = DOC.getElementById(id);
+            if (el) {
+                Ext.removeNode(el);
+            }
+            
+            if (typeof callback == 'function') {
+                callback();
+            }
+        });
+        dom.innerHTML = html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig, "");
+        return this;
+    },
+
+    // inherit docs, overridden so we can add removeAnchor
+    removeAllListeners : function() {
+        this.removeAnchor();
+        Ext.EventManager.removeAll(this.dom);
+        return this;
+    },
+
+    /**
+     * Creates a proxy element of this element
+     * @param {String/Object} config The class name of the proxy element or a DomHelper config object
+     * @param {String/HTMLElement} renderTo (optional) The element or element id to render the proxy to (defaults to document.body)
+     * @param {Boolean} matchBox (optional) True to align and size the proxy to this element now (defaults to false)
+     * @return {Ext.Element} The new proxy element
+     */
+    createProxy : function(config, renderTo, matchBox) {
+        config = (typeof config == 'object') ? config : {tag : "div", cls: config};
+
+        var me = this,
+            proxy = renderTo ? Ext.DomHelper.append(renderTo, config, true) :
+                               Ext.DomHelper.insertBefore(me.dom, config, true);
+
+        if (matchBox && me.setBox && me.getBox) { // check to make sure Element.position.js is loaded
+           proxy.setBox(me.getBox());
+        }
+        return proxy;
+    }
+});
+
+Ext.Element.prototype.getUpdateManager = Ext.Element.prototype.getUpdater;
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Gets the x,y coordinates specified by the anchor position on the element.
+     * @param {String} anchor (optional) The specified anchor position (defaults to "c").  See {@link #alignTo}
+     * for details on supported anchor positions.
+     * @param {Boolean} local (optional) True to get the local (element top/left-relative) anchor position instead
+     * of page coordinates
+     * @param {Object} size (optional) An object containing the size to use for calculating anchor position
+     * {width: (target width), height: (target height)} (defaults to the element's current size)
+     * @return {Array} [x, y] An array containing the element's x and y coordinates
+     */
+    getAnchorXY : function(anchor, local, s){
+        //Passing a different size is useful for pre-calculating anchors,
+        //especially for anchored animations that change the el size.
+		anchor = (anchor || "tl").toLowerCase();
+        s = s || {};
+        
+        var me = this,        
+        	vp = me.dom == document.body || me.dom == document,
+        	w = s.width || vp ? Ext.lib.Dom.getViewWidth() : me.getWidth(),
+        	h = s.height || vp ? Ext.lib.Dom.getViewHeight() : me.getHeight(),         	        	
+        	xy,       	
+        	r = Math.round,
+        	o = me.getXY(),
+        	scroll = me.getScroll(),
+        	extraX = vp ? scroll.left : !local ? o[0] : 0,
+        	extraY = vp ? scroll.top : !local ? o[1] : 0,
+        	hash = {
+	        	c  : [r(w * 0.5), r(h * 0.5)],
+	        	t  : [r(w * 0.5), 0],
+	        	l  : [0, r(h * 0.5)],
+	        	r  : [w, r(h * 0.5)],
+	        	b  : [r(w * 0.5), h],
+	        	tl : [0, 0],	
+	        	bl : [0, h],
+	        	br : [w, h],
+	        	tr : [w, 0]
+        	};
+        
+        xy = hash[anchor];	
+        return [xy[0] + extraX, xy[1] + extraY]; 
+    },
+
+    /**
+     * Anchors an element to another element and realigns it when the window is resized.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) True for the default animation or a standard Element animation config object
+     * @param {Boolean/Number} monitorScroll (optional) True to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @param {Function} callback The function to call after the animation finishes
+     * @return {Ext.Element} this
+     */
+    anchorTo : function(el, alignment, offsets, animate, monitorScroll, callback){        
+	    var me = this,
+            dom = me.dom,
+            scroll = !Ext.isEmpty(monitorScroll),
+            action = function(){
+                Ext.fly(dom).alignTo(el, alignment, offsets, animate);
+                Ext.callback(callback, Ext.fly(dom));
+            },
+            anchor = this.getAnchor();
+            
+        // previous listener anchor, remove it
+        this.removeAnchor();
+        Ext.apply(anchor, {
+            fn: action,
+            scroll: scroll
+        });
+
+        Ext.EventManager.onWindowResize(action, null);
+        
+        if(scroll){
+            Ext.EventManager.on(window, 'scroll', action, null,
+                {buffer: !isNaN(monitorScroll) ? monitorScroll : 50});
+        }
+        action.call(me); // align immediately
+        return me;
+    },
+    
+    /**
+     * Remove any anchor to this element. See {@link #anchorTo}.
+     * @return {Ext.Element} this
+     */
+    removeAnchor : function(){
+        var me = this,
+            anchor = this.getAnchor();
+            
+        if(anchor && anchor.fn){
+            Ext.EventManager.removeResizeListener(anchor.fn);
+            if(anchor.scroll){
+                Ext.EventManager.un(window, 'scroll', anchor.fn);
+            }
+            delete anchor.fn;
+        }
+        return me;
+    },
+    
+    // private
+    getAnchor : function(){
+        var data = Ext.Element.data,
+            dom = this.dom;
+            if (!dom) {
+                return;
+            }
+            var anchor = data(dom, '_anchor');
+            
+        if(!anchor){
+            anchor = data(dom, '_anchor', {});
+        }
+        return anchor;
+    },
+
+    /**
+     * Gets the x,y coordinates to align this element with another element. See {@link #alignTo} for more info on the
+     * supported position values.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Array} [x, y]
+     */
+    getAlignToXY : function(el, p, o){	    
+        el = Ext.get(el);
+        
+        if(!el || !el.dom){
+            throw "Element.alignToXY with an element that doesn't exist";
+        }
+        
+        o = o || [0,0];
+        p = (!p || p == "?" ? "tl-bl?" : (!(/-/).test(p) && p !== "" ? "tl-" + p : p || "tl-bl")).toLowerCase();       
+                
+        var me = this,
+        	d = me.dom,
+        	a1,
+        	a2,
+        	x,
+        	y,
+        	//constrain the aligned el to viewport if necessary
+        	w,
+        	h,
+        	r,
+        	dw = Ext.lib.Dom.getViewWidth() -10, // 10px of margin for ie
+        	dh = Ext.lib.Dom.getViewHeight()-10, // 10px of margin for ie
+        	p1y,
+        	p1x,        	
+        	p2y,
+        	p2x,
+        	swapY,
+        	swapX,
+        	doc = document,
+        	docElement = doc.documentElement,
+        	docBody = doc.body,
+        	scrollX = (docElement.scrollLeft || docBody.scrollLeft || 0)+5,
+        	scrollY = (docElement.scrollTop || docBody.scrollTop || 0)+5,
+        	c = false, //constrain to viewport
+        	p1 = "", 
+        	p2 = "",
+        	m = p.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+        
+        if(!m){
+           throw "Element.alignTo with an invalid alignment " + p;
+        }
+        
+        p1 = m[1]; 
+        p2 = m[2]; 
+        c = !!m[3];
+
+        //Subtract the aligned el's internal xy from the target's offset xy
+        //plus custom offset to get the aligned el's new offset xy
+        a1 = me.getAnchorXY(p1, true);
+        a2 = el.getAnchorXY(p2, false);
+
+        x = a2[0] - a1[0] + o[0];
+        y = a2[1] - a1[1] + o[1];
+
+        if(c){    
+	       w = me.getWidth();
+           h = me.getHeight();
+           r = el.getRegion();       
+           //If we are at a viewport boundary and the aligned el is anchored on a target border that is
+           //perpendicular to the vp border, allow the aligned el to slide on that border,
+           //otherwise swap the aligned el to the opposite border of the target.
+           p1y = p1.charAt(0);
+           p1x = p1.charAt(p1.length-1);
+           p2y = p2.charAt(0);
+           p2x = p2.charAt(p2.length-1);
+           swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t"));
+           swapX = ((p1x=="r" && p2x=="l") || (p1x=="l" && p2x=="r"));          
+           
+
+           if (x + w > dw + scrollX) {
+                x = swapX ? r.left-w : dw+scrollX-w;
+           }
+           if (x < scrollX) {
+               x = swapX ? r.right : scrollX;
+           }
+           if (y + h > dh + scrollY) {
+                y = swapY ? r.top-h : dh+scrollY-h;
+            }
+           if (y < scrollY){
+               y = swapY ? r.bottom : scrollY;
+           }
+        }
+        return [x,y];
+    },
+
+    /**
+     * Aligns this element with another element relative to the specified anchor points. If the other element is the
+     * document it aligns it to the viewport.
+     * The position parameter is optional, and can be specified in any one of the following formats:
+     * <ul>
+     *   <li><b>Blank</b>: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").</li>
+     *   <li><b>One anchor (deprecated)</b>: The passed anchor position is used as the target element's anchor point.
+     *       The element being aligned will position its top-left corner (tl) to that point.  <i>This method has been
+     *       deprecated in favor of the newer two anchor syntax below</i>.</li>
+     *   <li><b>Two anchors</b>: If two values from the table below are passed separated by a dash, the first value is used as the
+     *       element's anchor point, and the second value is used as the target's anchor point.</li>
+     * </ul>
+     * In addition to the anchor points, the position parameter also supports the "?" character.  If "?" is passed at the end of
+     * the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to
+     * the viewport if necessary.  Note that the element being aligned might be swapped to align to a different position than
+     * that specified in order to enforce the viewport constraints.
+     * Following are all of the supported anchor positions:
+<pre>
+Value  Description
+-----  -----------------------------
+tl     The top left corner (default)
+t      The center of the top edge
+tr     The top right corner
+l      The center of the left edge
+c      In the center of the element
+r      The center of the right edge
+bl     The bottom left corner
+b      The center of the bottom edge
+br     The bottom right corner
+</pre>
+Example Usage:
+<pre><code>
+// align el to other-el using the default positioning ("tl-bl", non-constrained)
+el.alignTo("other-el");
+
+// align the top left corner of el with the top right corner of other-el (constrained to viewport)
+el.alignTo("other-el", "tr?");
+
+// align the bottom right corner of el with the center left edge of other-el
+el.alignTo("other-el", "br-l?");
+
+// align the center of el with the bottom left corner of other-el and
+// adjust the x position by -6 pixels (and the y position by 0)
+el.alignTo("other-el", "c-bl", [-6, 0]);
+</code></pre>
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to.
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    alignTo : function(element, position, offsets, animate){
+	    var me = this;
+        return me.setXY(me.getAlignToXY(element, position, offsets),
+          		        me.preanim && !!animate ? me.preanim(arguments, 3) : false);
+    },
+    
+    // private ==>  used outside of core
+    adjustForConstraints : function(xy, parent, offsets){
+        return this.getConstrainToXY(parent || document, false, offsets, xy) ||  xy;
+    },
+
+    // private ==>  used outside of core
+    getConstrainToXY : function(el, local, offsets, proposedXY){   
+	    var os = {top:0, left:0, bottom:0, right: 0};
+
+        return function(el, local, offsets, proposedXY){
+            el = Ext.get(el);
+            offsets = offsets ? Ext.applyIf(offsets, os) : os;
+
+            var vw, vh, vx = 0, vy = 0;
+            if(el.dom == document.body || el.dom == document){
+                vw =Ext.lib.Dom.getViewWidth();
+                vh = Ext.lib.Dom.getViewHeight();
+            }else{
+                vw = el.dom.clientWidth;
+                vh = el.dom.clientHeight;
+                if(!local){
+                    var vxy = el.getXY();
+                    vx = vxy[0];
+                    vy = vxy[1];
+                }
+            }
+
+            var s = el.getScroll();
+
+            vx += offsets.left + s.left;
+            vy += offsets.top + s.top;
+
+            vw -= offsets.right;
+            vh -= offsets.bottom;
+
+            var vr = vx + vw,
+                vb = vy + vh,
+                xy = proposedXY || (!local ? this.getXY() : [this.getLeft(true), this.getTop(true)]),
+                x = xy[0], y = xy[1],
+                offset = this.getConstrainOffset(),
+                w = this.dom.offsetWidth + offset, 
+                h = this.dom.offsetHeight + offset;
+
+            // only move it if it needs it
+            var moved = false;
+
+            // first validate right/bottom
+            if((x + w) > vr){
+                x = vr - w;
+                moved = true;
+            }
+            if((y + h) > vb){
+                y = vb - h;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < vx){
+                x = vx;
+                moved = true;
+            }
+            if(y < vy){
+                y = vy;
+                moved = true;
+            }
+            return moved ? [x, y] : false;
+        };
+    }(),
+	    
+	    
+	        
+//         el = Ext.get(el);
+//         offsets = Ext.applyIf(offsets || {}, {top : 0, left : 0, bottom : 0, right : 0});
+
+//         var	me = this,
+//         	doc = document,
+//         	s = el.getScroll(),
+//         	vxy = el.getXY(),
+//         	vx = offsets.left + s.left, 
+//         	vy = offsets.top + s.top,            	
+//         	vw = -offsets.right, 
+//         	vh = -offsets.bottom, 
+//         	vr,
+//         	vb,
+//         	xy = proposedXY || (!local ? me.getXY() : [me.getLeft(true), me.getTop(true)]),
+//         	x = xy[0],
+//         	y = xy[1],
+//         	w = me.dom.offsetWidth, h = me.dom.offsetHeight,
+//         	moved = false; // only move it if it needs it
+//       
+//         	
+//         if(el.dom == doc.body || el.dom == doc){
+//             vw += Ext.lib.Dom.getViewWidth();
+//             vh += Ext.lib.Dom.getViewHeight();
+//         }else{
+//             vw += el.dom.clientWidth;
+//             vh += el.dom.clientHeight;
+//             if(!local){                    
+//                 vx += vxy[0];
+//                 vy += vxy[1];
+//             }
+//         }
+
+//         // first validate right/bottom
+//         if(x + w > vx + vw){
+//             x = vx + vw - w;
+//             moved = true;
+//         }
+//         if(y + h > vy + vh){
+//             y = vy + vh - h;
+//             moved = true;
+//         }
+//         // then make sure top/left isn't negative
+//         if(x < vx){
+//             x = vx;
+//             moved = true;
+//         }
+//         if(y < vy){
+//             y = vy;
+//             moved = true;
+//         }
+//         return moved ? [x, y] : false;
+//    },
+
+    // private, used internally
+    getConstrainOffset : function(){
+        return 0;
+    },
+    
+    /**
+    * Calculates the x, y to center this element on the screen
+    * @return {Array} The x, y values [x, y]
+    */
+    getCenterXY : function(){
+        return this.getAlignToXY(document, 'c-c');
+    },
+
+    /**
+    * Centers the Element in either the viewport, or another Element.
+    * @param {Mixed} centerIn (optional) The element in which to center the element.
+    */
+    center : function(centerIn){
+        return this.alignTo(centerIn || document, 'c-c');        
+    }    
+});
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Creates a {@link Ext.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
+     * @param {String} selector The CSS selector
+     * @param {Boolean} unique (optional) True to create a unique Ext.Element for each child (defaults to false, which creates a single shared flyweight object)
+     * @return {CompositeElement/CompositeElementLite} The composite element
+     */
+    select : function(selector, unique){
+        return Ext.Element.select(selector, unique, this.dom);
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.apply(Ext.Element.prototype, function() {
+	var GETDOM = Ext.getDom,
+		GET = Ext.get,
+		DH = Ext.DomHelper;
+	
+	return {	
+		/**
+	     * Inserts (or creates) the passed element (or DomHelper config) as a sibling of this element
+	     * @param {Mixed/Object/Array} el The id, element to insert or a DomHelper config to create and insert *or* an array of any of those.
+	     * @param {String} where (optional) 'before' or 'after' defaults to before
+	     * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Ext.Element
+	     * @return {Ext.Element} The inserted Element. If an array is passed, the last inserted element is returned.
+	     */
+	    insertSibling: function(el, where, returnDom){
+	        var me = this,
+	        	rt,
+                isAfter = (where || 'before').toLowerCase() == 'after',
+                insertEl;
+	        	
+	        if(Ext.isArray(el)){
+                insertEl = me;
+	            Ext.each(el, function(e) {
+		            rt = Ext.fly(insertEl, '_internal').insertSibling(e, where, returnDom);
+                    if(isAfter){
+                        insertEl = rt;
+                    }
+	            });
+	            return rt;
+	        }
+	                
+	        el = el || {};
+	       	
+            if(el.nodeType || el.dom){
+                rt = me.dom.parentNode.insertBefore(GETDOM(el), isAfter ? me.dom.nextSibling : me.dom);
+                if (!returnDom) {
+                    rt = GET(rt);
+                }
+            }else{
+                if (isAfter && !me.dom.nextSibling) {
+                    rt = DH.append(me.dom.parentNode, el, !returnDom);
+                } else {                    
+                    rt = DH[isAfter ? 'insertAfter' : 'insertBefore'](me.dom, el, !returnDom);
+                }
+            }
+	        return rt;
+	    }
+    };
+}());/**
+ * @class Ext.Element
+ */
+
+// special markup used throughout Ext when box wrapping elements
+Ext.Element.boxMarkup = '<div class="{0}-tl"><div class="{0}-tr"><div class="{0}-tc"></div></div></div><div class="{0}-ml"><div class="{0}-mr"><div class="{0}-mc"></div></div></div><div class="{0}-bl"><div class="{0}-br"><div class="{0}-bc"></div></div></div>';
+
+Ext.Element.addMethods(function(){
+    var INTERNAL = "_internal",
+        pxMatch = /(\d+\.?\d+)px/;
+    return {
+        /**
+         * More flexible version of {@link #setStyle} for setting style properties.
+         * @param {String/Object/Function} styles A style specification string, e.g. "width:100px", or object in the form {width:"100px"}, or
+         * a function which returns such a specification.
+         * @return {Ext.Element} this
+         */
+        applyStyles : function(style){
+            Ext.DomHelper.applyStyles(this.dom, style);
+            return this;
+        },
+
+        /**
+         * Returns an object with properties matching the styles requested.
+         * For example, el.getStyles('color', 'font-size', 'width') might return
+         * {'color': '#FFFFFF', 'font-size': '13px', 'width': '100px'}.
+         * @param {String} style1 A style name
+         * @param {String} style2 A style name
+         * @param {String} etc.
+         * @return {Object} The style object
+         */
+        getStyles : function(){
+            var ret = {};
+            Ext.each(arguments, function(v) {
+               ret[v] = this.getStyle(v);
+            },
+            this);
+            return ret;
+        },
+
+        // private  ==> used by ext full
+        setOverflow : function(v){
+            var dom = this.dom;
+            if(v=='auto' && Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                dom.style.overflow = 'hidden';
+                (function(){dom.style.overflow = 'auto';}).defer(1);
+            }else{
+                dom.style.overflow = v;
+            }
+        },
+
+       /**
+        * <p>Wraps the specified element with a special 9 element markup/CSS block that renders by default as
+        * a gray container with a gradient background, rounded corners and a 4-way shadow.</p>
+        * <p>This special markup is used throughout Ext when box wrapping elements ({@link Ext.Button},
+        * {@link Ext.Panel} when <tt>{@link Ext.Panel#frame frame=true}</tt>, {@link Ext.Window}).  The markup
+        * is of this form:</p>
+        * <pre><code>
+    Ext.Element.boxMarkup =
+    &#39;&lt;div class="{0}-tl">&lt;div class="{0}-tr">&lt;div class="{0}-tc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-ml">&lt;div class="{0}-mr">&lt;div class="{0}-mc">&lt;/div>&lt;/div>&lt;/div>
+     &lt;div class="{0}-bl">&lt;div class="{0}-br">&lt;div class="{0}-bc">&lt;/div>&lt;/div>&lt;/div>&#39;;
+        * </code></pre>
+        * <p>Example usage:</p>
+        * <pre><code>
+    // Basic box wrap
+    Ext.get("foo").boxWrap();
+
+    // You can also add a custom class and use CSS inheritance rules to customize the box look.
+    // 'x-box-blue' is a built-in alternative -- look at the related CSS definitions as an example
+    // for how to create a custom box wrap style.
+    Ext.get("foo").boxWrap().addClass("x-box-blue");
+        * </code></pre>
+        * @param {String} class (optional) A base CSS class to apply to the containing wrapper element
+        * (defaults to <tt>'x-box'</tt>). Note that there are a number of CSS rules that are dependent on
+        * this name to make the overall effect work, so if you supply an alternate base class, make sure you
+        * also supply all of the necessary rules.
+        * @return {Ext.Element} The outermost wrapping element of the created box structure.
+        */
+        boxWrap : function(cls){
+            cls = cls || 'x-box';
+            var el = Ext.get(this.insertHtml("beforeBegin", "<div class='" + cls + "'>" + String.format(Ext.Element.boxMarkup, cls) + "</div>"));        //String.format('<div class="{0}">'+Ext.Element.boxMarkup+'</div>', cls)));
+            Ext.DomQuery.selectNode('.' + cls + '-mc', el.dom).appendChild(this.dom);
+            return el;
+        },
+
+        /**
+         * Set the size of this Element. If animation is true, both width and height will be animated concurrently.
+         * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+         * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+         * </ul></div>
+         * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+         * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels).</li>
+         * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+         * </ul></div>
+         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+         * @return {Ext.Element} this
+         */
+        setSize : function(width, height, animate){
+            var me = this;
+            if(typeof width == 'object'){ // in case of object from getSize()
+                height = width.height;
+                width = width.width;
+            }
+            width = me.adjustWidth(width);
+            height = me.adjustHeight(height);
+            if(!animate || !me.anim){
+                me.dom.style.width = me.addUnits(width);
+                me.dom.style.height = me.addUnits(height);
+            }else{
+                me.anim({width: {to: width}, height: {to: height}}, me.preanim(arguments, 2));
+            }
+            return me;
+        },
+
+        /**
+         * Returns either the offsetHeight or the height of this element based on CSS height adjusted by padding or borders
+         * when needed to simulate offsetHeight when offsets aren't available. This may not work on display:none elements
+         * if a height has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedHeight : function(){
+            var me = this,
+                h = Math.max(me.dom.offsetHeight, me.dom.clientHeight);
+            if(!h){
+                h = parseFloat(me.getStyle('height')) || 0;
+                if(!me.isBorderBox()){
+                    h += me.getFrameWidth('tb');
+                }
+            }
+            return h;
+        },
+
+        /**
+         * Returns either the offsetWidth or the width of this element based on CSS width adjusted by padding or borders
+         * when needed to simulate offsetWidth when offsets aren't available. This may not work on display:none elements
+         * if a width has not been set using CSS.
+         * @return {Number}
+         */
+        getComputedWidth : function(){
+            var w = Math.max(this.dom.offsetWidth, this.dom.clientWidth);
+            if(!w){
+                w = parseFloat(this.getStyle('width')) || 0;
+                if(!this.isBorderBox()){
+                    w += this.getFrameWidth('lr');
+                }
+            }
+            return w;
+        },
+
+        /**
+         * Returns the sum width of the padding and borders for the passed "sides". See getBorderWidth()
+         for more information about the sides.
+         * @param {String} sides
+         * @return {Number}
+         */
+        getFrameWidth : function(sides, onlyContentBox){
+            return onlyContentBox && this.isBorderBox() ? 0 : (this.getPadding(sides) + this.getBorderWidth(sides));
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is over this element
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnOver : function(className){
+            this.hover(
+                function(){
+                    Ext.fly(this, INTERNAL).addClass(className);
+                },
+                function(){
+                    Ext.fly(this, INTERNAL).removeClass(className);
+                }
+            );
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when this element has the focus
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnFocus : function(className){
+            this.on("focus", function(){
+                Ext.fly(this, INTERNAL).addClass(className);
+            }, this.dom);
+            this.on("blur", function(){
+                Ext.fly(this, INTERNAL).removeClass(className);
+            }, this.dom);
+            return this;
+        },
+
+        /**
+         * Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)
+         * @param {String} className
+         * @return {Ext.Element} this
+         */
+        addClassOnClick : function(className){
+            var dom = this.dom;
+            this.on("mousedown", function(){
+                Ext.fly(dom, INTERNAL).addClass(className);
+                var d = Ext.getDoc(),
+                    fn = function(){
+                        Ext.fly(dom, INTERNAL).removeClass(className);
+                        d.removeListener("mouseup", fn);
+                    };
+                d.on("mouseup", fn);
+            });
+            return this;
+        },
+
+        /**
+         * <p>Returns the dimensions of the element available to lay content out in.<p>
+         * <p>If the element (or any ancestor element) has CSS style <code>display : none</code>, the dimensions will be zero.</p>
+         * example:<pre><code>
+        var vpSize = Ext.getBody().getViewSize();
+
+        // all Windows created afterwards will have a default value of 90% height and 95% width
+        Ext.Window.override({
+            width: vpSize.width * 0.9,
+            height: vpSize.height * 0.95
+        });
+        // To handle window resizing you would have to hook onto onWindowResize.
+        * </code></pre>
+        *
+        * getViewSize utilizes clientHeight/clientWidth which excludes sizing of scrollbars.
+        * To obtain the size including scrollbars, use getStyleSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getViewSize : function(){
+            var doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body);
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+
+            // Else use clientHeight/clientWidth
+            } else {
+                return {
+                    width : d.clientWidth,
+                    height : d.clientHeight
+                };
+            }
+        },
+
+        /**
+        * <p>Returns the dimensions of the element available to lay content out in.<p>
+        *
+        * getStyleSize utilizes prefers style sizing if present, otherwise it chooses the larger of offsetHeight/clientHeight and offsetWidth/clientWidth.
+        * To obtain the size excluding scrollbars, use getViewSize
+        *
+        * Sizing of the document body is handled at the adapter level which handles special cases for IE and strict modes, etc.
+        */
+
+        getStyleSize : function(){
+            var me = this,
+                w, h,
+                doc = document,
+                d = this.dom,
+                isDoc = (d == doc || d == doc.body),
+                s = d.style;
+
+            // If the body, use Ext.lib.Dom
+            if (isDoc) {
+                var extdom = Ext.lib.Dom;
+                return {
+                    width : extdom.getViewWidth(),
+                    height : extdom.getViewHeight()
+                };
+            }
+            // Use Styles if they are set
+            if(s.width && s.width != 'auto'){
+                w = parseFloat(s.width);
+                if(me.isBorderBox()){
+                   w -= me.getFrameWidth('lr');
+                }
+            }
+            // Use Styles if they are set
+            if(s.height && s.height != 'auto'){
+                h = parseFloat(s.height);
+                if(me.isBorderBox()){
+                   h -= me.getFrameWidth('tb');
+                }
+            }
+            // Use getWidth/getHeight if style not set.
+            return {width: w || me.getWidth(true), height: h || me.getHeight(true)};
+        },
+
+        /**
+         * Returns the size of the element.
+         * @param {Boolean} contentSize (optional) true to get the width/size minus borders and padding
+         * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+         */
+        getSize : function(contentSize){
+            return {width: this.getWidth(contentSize), height: this.getHeight(contentSize)};
+        },
+
+        /**
+         * Forces the browser to repaint this element
+         * @return {Ext.Element} this
+         */
+        repaint : function(){
+            var dom = this.dom;
+            this.addClass("x-repaint");
+            setTimeout(function(){
+                Ext.fly(dom).removeClass("x-repaint");
+            }, 1);
+            return this;
+        },
+
+        /**
+         * Disables text selection for this element (normalized across browsers)
+         * @return {Ext.Element} this
+         */
+        unselectable : function(){
+            this.dom.unselectable = "on";
+            return this.swallowEvent("selectstart", true).
+                        applyStyles("-moz-user-select:none;-khtml-user-select:none;").
+                        addClass("x-unselectable");
+        },
+
+        /**
+         * Returns an object with properties top, left, right and bottom representing the margins of this element unless sides is passed,
+         * then it returns the calculated width of the sides (see getPadding)
+         * @param {String} sides (optional) Any combination of l, r, t, b to get the sum of those sides
+         * @return {Object/Number}
+         */
+        getMargins : function(side){
+            var me = this,
+                key,
+                hash = {t:"top", l:"left", r:"right", b: "bottom"},
+                o = {};
+
+            if (!side) {
+                for (key in me.margins){
+                    o[hash[key]] = parseFloat(me.getStyle(me.margins[key])) || 0;
+                }
+                return o;
+            } else {
+                return me.addStyles.call(me, side, me.margins);
+            }
+        }
+    };
+}());
+/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Sets the element's box. Use getBox() on another element to get a box obj. If animate is true then width, height, x and y will be animated concurrently.
+     * @param {Object} box The box to fill {x, y, width, height}
+     * @param {Boolean} adjust (optional) Whether to adjust for box-model issues automatically
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBox : function(box, adjust, animate){
+        var me = this,
+        	w = box.width, 
+        	h = box.height;
+        if((adjust && !me.autoBoxAdjust) && !me.isBorderBox()){
+           w -= (me.getBorderWidth("lr") + me.getPadding("lr"));
+           h -= (me.getBorderWidth("tb") + me.getPadding("tb"));
+        }
+        me.setBounds(box.x, box.y, w, h, me.animTest.call(me, arguments, animate, 2));
+        return me;
+    },
+
+    /**
+     * Return an object defining the area of this Element which can be passed to {@link #setBox} to
+     * set another Element's size/location to match this element.
+     * @param {Boolean} contentBox (optional) If true a box for the content of the element is returned.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page x/y.
+     * @return {Object} box An object in the format<pre><code>
+{
+    x: &lt;Element's X position>,
+    y: &lt;Element's Y position>,
+    width: &lt;Element's width>,
+    height: &lt;Element's height>,
+    bottom: &lt;Element's lower bound>,
+    right: &lt;Element's rightmost bound>
+}
+</code></pre>
+     * The returned object may also be addressed as an Array where index 0 contains the X position
+     * and index 1 contains the Y position. So the result may also be used for {@link #setXY}
+     */
+	getBox : function(contentBox, local) {	    
+	    var me = this,
+        	xy,
+        	left,
+        	top,
+        	getBorderWidth = me.getBorderWidth,
+        	getPadding = me.getPadding, 
+        	l,
+        	r,
+        	t,
+        	b;
+        if(!local){
+            xy = me.getXY();
+        }else{
+            left = parseInt(me.getStyle("left"), 10) || 0;
+            top = parseInt(me.getStyle("top"), 10) || 0;
+            xy = [left, top];
+        }
+        var el = me.dom, w = el.offsetWidth, h = el.offsetHeight, bx;
+        if(!contentBox){
+            bx = {x: xy[0], y: xy[1], 0: xy[0], 1: xy[1], width: w, height: h};
+        }else{
+            l = getBorderWidth.call(me, "l") + getPadding.call(me, "l");
+            r = getBorderWidth.call(me, "r") + getPadding.call(me, "r");
+            t = getBorderWidth.call(me, "t") + getPadding.call(me, "t");
+            b = getBorderWidth.call(me, "b") + getPadding.call(me, "b");
+            bx = {x: xy[0]+l, y: xy[1]+t, 0: xy[0]+l, 1: xy[1]+t, width: w-(l+r), height: h-(t+b)};
+        }
+        bx.right = bx.x + bx.width;
+        bx.bottom = bx.y + bx.height;
+        return bx;
+	},
+	
+    /**
+     * Move this element relative to its current position.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to move the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+     move : function(direction, distance, animate){
+        var me = this,        	
+        	xy = me.getXY(),
+        	x = xy[0],
+        	y = xy[1],        	
+        	left = [x - distance, y],
+        	right = [x + distance, y],
+        	top = [x, y - distance],
+        	bottom = [x, y + distance],
+	       	hash = {
+	        	l :	left,
+	        	left : left,
+	        	r : right,
+	        	right : right,
+	        	t : top,
+	        	top : top,
+	        	up : top,
+	        	b : bottom, 
+	        	bottom : bottom,
+	        	down : bottom	        		
+	        };
+        
+ 	    direction = direction.toLowerCase();    
+ 	    me.moveTo(hash[direction][0], hash[direction][1], me.animTest.call(me, arguments, animate, 2));
+    },
+    
+    /**
+     * Quick set left and top adding default units
+     * @param {String} left The left CSS property value
+     * @param {String} top The top CSS property value
+     * @return {Ext.Element} this
+     */
+     setLeftTop : function(left, top){
+	    var me = this,
+	    	style = me.dom.style;
+        style.left = me.addUnits(left);
+        style.top = me.addUnits(top);
+        return me;
+    },
+    
+    /**
+     * Returns the region of the given element.
+     * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
+     * @return {Region} A Ext.lib.Region containing "top, left, bottom, right" member data.
+     */
+    getRegion : function(){
+        return Ext.lib.Dom.getRegion(this.dom);
+    },
+    
+    /**
+     * Sets the element's position and size in one shot. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Mixed} width The new width. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS width style. Animation may <b>not</b> be used.
+     * </ul></div>
+     * @param {Mixed} height The new height. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in this Element's {@link #defaultUnit}s (by default, pixels)</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * </ul></div>
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setBounds : function(x, y, width, height, animate){
+	    var me = this;
+        if (!animate || !me.anim) {
+            me.setSize(width, height);
+            me.setLocation(x, y);
+        } else {
+            me.anim({points: {to: [x, y]}, 
+            		 width: {to: me.adjustWidth(width)}, 
+            		 height: {to: me.adjustHeight(height)}},
+                     me.preanim(arguments, 4), 
+                     'motion');
+        }
+        return me;
+    },
+
+    /**
+     * Sets the element's position and size the specified region. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Ext.lib.Region} region The region to fill
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Ext.Element} this
+     */
+    setRegion : function(region, animate) {
+        return this.setBounds(region.left, region.top, region.right-region.left, region.bottom-region.top, this.animTest.call(this, arguments, animate, 1));
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
+     * @param {Number} value The new scroll value
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Element} this
+     */
+    scrollTo : function(side, value, animate) {
+        //check if we're scrolling top or left
+        var top = /top/i.test(side),
+            me = this,
+            dom = me.dom,
+            prop;
+        if (!animate || !me.anim) {
+            // just setting the value, so grab the direction
+            prop = 'scroll' + (top ? 'Top' : 'Left');
+            dom[prop] = value;
+        }
+        else {
+            // if scrolling top, we need to grab scrollLeft, if left, scrollTop
+            prop = 'scroll' + (top ? 'Left' : 'Top');
+            me.anim({scroll: {to: top ? [dom[prop], value] : [value, dom[prop]]}}, me.preanim(arguments, 2), 'scroll');
+        }
+        return me;
+    },
+    
+    /**
+     * Scrolls this element into view within the passed container.
+     * @param {Mixed} container (optional) The container element to scroll (defaults to document.body).  Should be a
+     * string (id), dom node, or Ext.Element.
+     * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)
+     * @return {Ext.Element} this
+     */
+    scrollIntoView : function(container, hscroll) {
+        var c = Ext.getDom(container) || Ext.getBody().dom,
+            el = this.dom,
+            o = this.getOffsetsTo(c),
+            l = o[0] + c.scrollLeft,
+            t = o[1] + c.scrollTop,
+            b = t + el.offsetHeight,
+            r = l + el.offsetWidth,
+            ch = c.clientHeight,
+            ct = parseInt(c.scrollTop, 10),
+            cl = parseInt(c.scrollLeft, 10),
+            cb = ct + ch,
+            cr = cl + c.clientWidth;
+
+        if (el.offsetHeight > ch || t < ct) {
+            c.scrollTop = t;
+        }
+        else if (b > cb) {
+            c.scrollTop = b-ch;
+        }
+        // corrects IE, other browsers will ignore
+        c.scrollTop = c.scrollTop;
+
+        if (hscroll !== false) {
+            if (el.offsetWidth > c.clientWidth || l < cl) {
+                c.scrollLeft = l;
+            }
+            else if (r > cr) {
+                c.scrollLeft = r - c.clientWidth;
+            }
+            c.scrollLeft = c.scrollLeft;
+        }
+        return this;
+    },
+
+    // private
+    scrollChildIntoView : function(child, hscroll) {
+        Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
+    },
+    
+    /**
+     * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is
+     * within this element's scrollable range.
+     * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
+     * @param {Number} distance How far to scroll the element in pixels
+     * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
+     * @return {Boolean} Returns true if a scroll was triggered or false if the element
+     * was scrolled as far as it could go.
+     */
+     scroll : function(direction, distance, animate) {
+        if (!this.isScrollable()) {
+            return false;
+        }
+        var el = this.dom,
+            l = el.scrollLeft, t = el.scrollTop,
+            w = el.scrollWidth, h = el.scrollHeight,
+            cw = el.clientWidth, ch = el.clientHeight,
+            scrolled = false, v,
+            hash = {
+                l: Math.min(l + distance, w-cw),
+                r: v = Math.max(l - distance, 0),
+                t: Math.max(t - distance, 0),
+                b: Math.min(t + distance, h-ch)
+            };
+            hash.d = hash.b;
+            hash.u = hash.t;
+        
+        direction = direction.substr(0, 1);
+        if ((v = hash[direction]) > -1) {
+            scrolled = true;
+            this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.preanim(arguments, 2));
+        }
+        return scrolled;
+    }
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods(
+    function() {
+        var VISIBILITY      = "visibility",
+            DISPLAY         = "display",
+            HIDDEN          = "hidden",
+            NONE            = "none",
+            XMASKED         = "x-masked",
+            XMASKEDRELATIVE = "x-masked-relative",
+            data            = Ext.Element.data;
+
+        return {
+            /**
+             * Checks whether the element is currently visible using both visibility and display properties.
+             * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)
+             * @return {Boolean} True if the element is currently visible, else false
+             */
+            isVisible : function(deep) {
+                var vis = !this.isStyle(VISIBILITY, HIDDEN) && !this.isStyle(DISPLAY, NONE),
+                    p   = this.dom.parentNode;
+                
+                if (deep !== true || !vis) {
+                    return vis;
+                }
+                
+                while (p && !(/^body/i.test(p.tagName))) {
+                    if (!Ext.fly(p, '_isVisible').isVisible()) {
+                        return false;
+                    }
+                    p = p.parentNode;
+                }
+                return true;
+            },
+
+            /**
+             * Returns true if display is not "none"
+             * @return {Boolean}
+             */
+            isDisplayed : function() {
+                return !this.isStyle(DISPLAY, NONE);
+            },
+
+            /**
+             * Convenience method for setVisibilityMode(Element.DISPLAY)
+             * @param {String} display (optional) What to set display to when visible
+             * @return {Ext.Element} this
+             */
+            enableDisplayMode : function(display) {
+                this.setVisibilityMode(Ext.Element.DISPLAY);
+                
+                if (!Ext.isEmpty(display)) {
+                    data(this.dom, 'originalDisplay', display);
+                }
+                
+                return this;
+            },
+
+            /**
+             * Puts a mask over this element to disable user interaction. Requires core.css.
+             * This method can only be applied to elements which accept child nodes.
+             * @param {String} msg (optional) A message to display in the mask
+             * @param {String} msgCls (optional) A css class to apply to the msg element
+             * @return {Element} The mask element
+             */
+            mask : function(msg, msgCls) {
+                var me  = this,
+                    dom = me.dom,
+                    dh  = Ext.DomHelper,
+                    EXTELMASKMSG = "ext-el-mask-msg",
+                    el,
+                    mask;
+
+                if (!/^body/i.test(dom.tagName) && me.getStyle('position') == 'static') {
+                    me.addClass(XMASKEDRELATIVE);
+                }
+                if (el = data(dom, 'maskMsg')) {
+                    el.remove();
+                }
+                if (el = data(dom, 'mask')) {
+                    el.remove();
+                }
+
+                mask = dh.append(dom, {cls : "ext-el-mask"}, true);
+                data(dom, 'mask', mask);
+
+                me.addClass(XMASKED);
+                mask.setDisplayed(true);
+                
+                if (typeof msg == 'string') {
+                    var mm = dh.append(dom, {cls : EXTELMASKMSG, cn:{tag:'div'}}, true);
+                    data(dom, 'maskMsg', mm);
+                    mm.dom.className = msgCls ? EXTELMASKMSG + " " + msgCls : EXTELMASKMSG;
+                    mm.dom.firstChild.innerHTML = msg;
+                    mm.setDisplayed(true);
+                    mm.center(me);
+                }
+                
+                // ie will not expand full height automatically
+                if (Ext.isIE && !(Ext.isIE7 && Ext.isStrict) && me.getStyle('height') == 'auto') {
+                    mask.setSize(undefined, me.getHeight());
+                }
+                
+                return mask;
+            },
+
+            /**
+             * Removes a previously applied mask.
+             */
+            unmask : function() {
+                var me      = this,
+                    dom     = me.dom,
+                    mask    = data(dom, 'mask'),
+                    maskMsg = data(dom, 'maskMsg');
+
+                if (mask) {
+                    if (maskMsg) {
+                        maskMsg.remove();
+                        data(dom, 'maskMsg', undefined);
+                    }
+                    
+                    mask.remove();
+                    data(dom, 'mask', undefined);
+                    me.removeClass([XMASKED, XMASKEDRELATIVE]);
+                }
+            },
+
+            /**
+             * Returns true if this element is masked
+             * @return {Boolean}
+             */
+            isMasked : function() {
+                var m = data(this.dom, 'mask');
+                return m && m.isVisible();
+            },
+
+            /**
+             * Creates an iframe shim for this element to keep selects and other windowed objects from
+             * showing through.
+             * @return {Ext.Element} The new shim element
+             */
+            createShim : function() {
+                var el = document.createElement('iframe'),
+                    shim;
+                
+                el.frameBorder = '0';
+                el.className = 'ext-shim';
+                el.src = Ext.SSL_SECURE_URL;
+                shim = Ext.get(this.dom.parentNode.insertBefore(el, this.dom));
+                shim.autoBoxAdjust = false;
+                return shim;
+            }
+        };
+    }()
+);/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Convenience method for constructing a KeyMap
+     * @param {Number/Array/Object/String} key Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:
+     * <code>{key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}</code>
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the specified function is executed. Defaults to this Element.
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyListener : function(key, fn, scope){
+        var config;
+        if(typeof key != 'object' || Ext.isArray(key)){
+            config = {
+                key: key,
+                fn: fn,
+                scope: scope
+            };
+        }else{
+            config = {
+                key : key.key,
+                shift : key.shift,
+                ctrl : key.ctrl,
+                alt : key.alt,
+                fn: fn,
+                scope: scope
+            };
+        }
+        return new Ext.KeyMap(this, config);
+    },
+
+    /**
+     * Creates a KeyMap for this element
+     * @param {Object} config The KeyMap config. See {@link Ext.KeyMap} for more details
+     * @return {Ext.KeyMap} The KeyMap created
+     */
+    addKeyMap : function(config){
+        return new Ext.KeyMap(this, config);
+    }
+});
+
+//Import the newly-added Ext.Element functions into CompositeElementLite. We call this here because
+//Element.keys.js is the last extra Ext.Element include in the ext-all.js build
+Ext.CompositeElementLite.importElementMethods();/**
+ * @class Ext.CompositeElementLite
+ */
+Ext.apply(Ext.CompositeElementLite.prototype, {
+    addElements : function(els, root){
+        if(!els){
+            return this;
+        }
+        if(typeof els == "string"){
+            els = Ext.Element.selectorFunction(els, root);
+        }
+        var yels = this.elements;
+        Ext.each(els, function(e) {
+            yels.push(Ext.get(e));
+        });
+        return this;
+    },
+
+    /**
+     * Returns the first Element
+     * @return {Ext.Element}
+     */
+    first : function(){
+        return this.item(0);
+    },
+
+    /**
+     * Returns the last Element
+     * @return {Ext.Element}
+     */
+    last : function(){
+        return this.item(this.getCount()-1);
+    },
+
+    /**
+     * Returns true if this composite contains the passed element
+     * @param el {Mixed} The id of an element, or an Ext.Element, or an HtmlElement to find within the composite collection.
+     * @return Boolean
+     */
+    contains : function(el){
+        return this.indexOf(el) != -1;
+    },
+
+    /**
+    * Removes the specified element(s).
+    * @param {Mixed} el The id of an element, the Element itself, the index of the element in this composite
+    * or an array of any of those.
+    * @param {Boolean} removeDom (optional) True to also remove the element from the document
+    * @return {CompositeElement} this
+    */
+    removeElement : function(keys, removeDom){
+        var me = this,
+            els = this.elements,
+            el;
+        Ext.each(keys, function(val){
+            if ((el = (els[val] || els[val = me.indexOf(val)]))) {
+                if(removeDom){
+                    if(el.dom){
+                        el.remove();
+                    }else{
+                        Ext.removeNode(el);
+                    }
+                }
+                els.splice(val, 1);
+            }
+        });
+        return this;
+    }
+});
+/**
+ * @class Ext.CompositeElement
+ * @extends Ext.CompositeElementLite
+ * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
+ * members, or to perform collective actions upon the whole set.</p>
+ * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
+ * {@link Ext.Fx}. The methods from these classes will be performed on all the elements in this collection.</p>
+ * <p>All methods return <i>this</i> and can be chained.</p>
+ * Usage:
+<pre><code>
+var els = Ext.select("#some-el div.some-class", true);
+// or select directly from an existing element
+var el = Ext.get('some-el');
+el.select('div.some-class', true);
+
+els.setWidth(100); // all elements become 100 width
+els.hide(true); // all elements fade out and hide
+// or
+els.setWidth(100).hide(true);
+</code></pre>
+ */
+Ext.CompositeElement = Ext.extend(Ext.CompositeElementLite, {
+    
+    constructor : function(els, root){
+        this.elements = [];
+        this.add(els, root);
+    },
+    
+    // private
+    getElement : function(el){
+        // In this case just return it, since we already have a reference to it
+        return el;
+    },
+    
+    // private
+    transformElement : function(el){
+        return Ext.get(el);
+    }
+
+    /**
+    * Adds elements to this composite.
+    * @param {String/Array} els A string CSS selector, an array of elements or an element
+    * @return {CompositeElement} this
+    */
+
+    /**
+     * Returns the Element object at the specified index
+     * @param {Number} index
+     * @return {Ext.Element}
+     */
+
+    /**
+     * Iterates each <code>element</code> in this <code>composite</code>
+     * calling the supplied function using {@link Ext#each}.
+     * @param {Function} fn The function to be called with each
+     * <code>element</code>. If the supplied function returns <tt>false</tt>,
+     * iteration stops. This function is called with the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><code>element</code> : <i>Ext.Element</i><div class="sub-desc">The element at the current <code>index</code>
+     * in the <code>composite</code></div></li>
+     * <li><code>composite</code> : <i>Object</i> <div class="sub-desc">This composite.</div></li>
+     * <li><code>index</code> : <i>Number</i> <div class="sub-desc">The current index within the <code>composite</code> </div></li>
+     * </ul></div>
+     * @param {Object} scope (optional) The scope (<code><this</code> reference) in which the specified function is executed.
+     * Defaults to the <code>element</code> at the current <code>index</code>
+     * within the composite.
+     * @return {CompositeElement} this
+     */
+});
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext.Element
+ * @method select
+ */
+Ext.Element.select = function(selector, unique, root){
+    var els;
+    if(typeof selector == "string"){
+        els = Ext.Element.selectorFunction(selector, root);
+    }else if(selector.length !== undefined){
+        els = selector;
+    }else{
+        throw "Invalid selector";
+    }
+
+    return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);
+};
+
+/**
+ * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
+ * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
+ * {@link Ext.CompositeElementLite CompositeElementLite} object.
+ * @param {String/Array} selector The CSS selector or an array of elements
+ * @param {Boolean} unique (optional) true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
+ * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
+ * @return {CompositeElementLite/CompositeElement}
+ * @member Ext
+ * @method select
+ */
+Ext.select = Ext.Element.select;/**
+ * @class Ext.Updater
+ * @extends Ext.util.Observable
+ * Provides AJAX-style update capabilities for Element objects.  Updater can be used to {@link #update}
+ * an {@link Ext.Element} once, or you can use {@link #startAutoRefresh} to set up an auto-updating
+ * {@link Ext.Element Element} on a specific interval.<br><br>
+ * Usage:<br>
+ * <pre><code>
+ * var el = Ext.get("foo"); // Get Ext.Element object
+ * var mgr = el.getUpdater();
+ * mgr.update({
+        url: "http://myserver.com/index.php",
+        params: {
+            param1: "foo",
+            param2: "bar"
+        }
+ * });
+ * ...
+ * mgr.formUpdate("myFormId", "http://myserver.com/index.php");
+ * <br>
+ * // or directly (returns the same Updater instance)
+ * var mgr = new Ext.Updater("myElementId");
+ * mgr.startAutoRefresh(60, "http://myserver.com/index.php");
+ * mgr.on("update", myFcnNeedsToKnow);
+ * <br>
+ * // short handed call directly from the element object
+ * Ext.get("foo").load({
+        url: "bar.php",
+        scripts: true,
+        params: "param1=foo&amp;param2=bar",
+        text: "Loading Foo..."
+ * });
+ * </code></pre>
+ * @constructor
+ * Create new Updater directly.
+ * @param {Mixed} el The element to update
+ * @param {Boolean} forceNew (optional) By default the constructor checks to see if the passed element already
+ * has an Updater and if it does it returns the same instance. This will skip that check (useful for extending this class).
+ */
+Ext.UpdateManager = Ext.Updater = Ext.extend(Ext.util.Observable,
+function() {
+    var BEFOREUPDATE = "beforeupdate",
+        UPDATE = "update",
+        FAILURE = "failure";
+
+    // private
+    function processSuccess(response){
+        var me = this;
+        me.transaction = null;
+        if (response.argument.form && response.argument.reset) {
+            try { // put in try/catch since some older FF releases had problems with this
+                response.argument.form.reset();
+            } catch(e){}
+        }
+        if (me.loadScripts) {
+            me.renderer.render(me.el, response, me,
+               updateComplete.createDelegate(me, [response]));
+        } else {
+            me.renderer.render(me.el, response, me);
+            updateComplete.call(me, response);
+        }
+    }
+
+    // private
+    function updateComplete(response, type, success){
+        this.fireEvent(type || UPDATE, this.el, response);
+        if(Ext.isFunction(response.argument.callback)){
+            response.argument.callback.call(response.argument.scope, this.el, Ext.isEmpty(success) ? true : false, response, response.argument.options);
+        }
+    }
+
+    // private
+    function processFailure(response){
+        updateComplete.call(this, response, FAILURE, !!(this.transaction = null));
+    }
+
+    return {
+        constructor: function(el, forceNew){
+            var me = this;
+            el = Ext.get(el);
+            if(!forceNew && el.updateManager){
+                return el.updateManager;
+            }
+            /**
+             * The Element object
+             * @type Ext.Element
+             */
+            me.el = el;
+            /**
+             * Cached url to use for refreshes. Overwritten every time update() is called unless "discardUrl" param is set to true.
+             * @type String
+             */
+            me.defaultUrl = null;
+
+            me.addEvents(
+                /**
+                 * @event beforeupdate
+                 * Fired before an update is made, return false from your handler and the update is cancelled.
+                 * @param {Ext.Element} el
+                 * @param {String/Object/Function} url
+                 * @param {String/Object} params
+                 */
+                BEFOREUPDATE,
+                /**
+                 * @event update
+                 * Fired after successful update is made.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                UPDATE,
+                /**
+                 * @event failure
+                 * Fired on update failure.
+                 * @param {Ext.Element} el
+                 * @param {Object} oResponseObject The response Object
+                 */
+                FAILURE
+            );
+
+            Ext.apply(me, Ext.Updater.defaults);
+            /**
+             * Blank page URL to use with SSL file uploads (defaults to {@link Ext.Updater.defaults#sslBlankUrl}).
+             * @property sslBlankUrl
+             * @type String
+             */
+            /**
+             * Whether to append unique parameter on get request to disable caching (defaults to {@link Ext.Updater.defaults#disableCaching}).
+             * @property disableCaching
+             * @type Boolean
+             */
+            /**
+             * Text for loading indicator (defaults to {@link Ext.Updater.defaults#indicatorText}).
+             * @property indicatorText
+             * @type String
+             */
+            /**
+             * Whether to show indicatorText when loading (defaults to {@link Ext.Updater.defaults#showLoadIndicator}).
+             * @property showLoadIndicator
+             * @type String
+             */
+            /**
+             * Timeout for requests or form posts in seconds (defaults to {@link Ext.Updater.defaults#timeout}).
+             * @property timeout
+             * @type Number
+             */
+            /**
+             * True to process scripts in the output (defaults to {@link Ext.Updater.defaults#loadScripts}).
+             * @property loadScripts
+             * @type Boolean
+             */
+
+            /**
+             * Transaction object of the current executing transaction, or null if there is no active transaction.
+             */
+            me.transaction = null;
+            /**
+             * Delegate for refresh() prebound to "this", use myUpdater.refreshDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.refreshDelegate = me.refresh.createDelegate(me);
+            /**
+             * Delegate for update() prebound to "this", use myUpdater.updateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.updateDelegate = me.update.createDelegate(me);
+            /**
+             * Delegate for formUpdate() prebound to "this", use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arguments
+             * @type Function
+             */
+            me.formUpdateDelegate = (me.formUpdate || function(){}).createDelegate(me);
+
+            /**
+             * The renderer for this Updater (defaults to {@link Ext.Updater.BasicRenderer}).
+             */
+            me.renderer = me.renderer || me.getDefaultRenderer();
+
+            Ext.Updater.superclass.constructor.call(me);
+        },
+
+        /**
+         * Sets the content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @param {Object} renderer The object implementing the render() method
+         */
+        setRenderer : function(renderer){
+            this.renderer = renderer;
+        },
+
+        /**
+         * Returns the current content renderer for this Updater. See {@link Ext.Updater.BasicRenderer#render} for more details.
+         * @return {Object}
+         */
+        getRenderer : function(){
+           return this.renderer;
+        },
+
+        /**
+         * This is an overrideable method which returns a reference to a default
+         * renderer class if none is specified when creating the Ext.Updater.
+         * Defaults to {@link Ext.Updater.BasicRenderer}
+         */
+        getDefaultRenderer: function() {
+            return new Ext.Updater.BasicRenderer();
+        },
+
+        /**
+         * Sets the default URL used for updates.
+         * @param {String/Function} defaultUrl The url or a function to call to get the url
+         */
+        setDefaultUrl : function(defaultUrl){
+            this.defaultUrl = defaultUrl;
+        },
+
+        /**
+         * Get the Element this Updater is bound to
+         * @return {Ext.Element} The element
+         */
+        getEl : function(){
+            return this.el;
+        },
+
+        /**
+         * Performs an <b>asynchronous</b> request, updating this element with the response.
+         * If params are specified it uses POST, otherwise it uses GET.<br><br>
+         * <b>Note:</b> Due to the asynchronous nature of remote server requests, the Element
+         * will not have been fully updated when the function returns. To post-process the returned
+         * data, use the callback option, or an <b><code>update</code></b> event handler.
+         * @param {Object} options A config object containing any of the following options:<ul>
+         * <li>url : <b>String/Function</b><p class="sub-desc">The URL to request or a function which
+         * <i>returns</i> the URL (defaults to the value of {@link Ext.Ajax#url} if not specified).</p></li>
+         * <li>method : <b>String</b><p class="sub-desc">The HTTP method to
+         * use. Defaults to POST if the <code>params</code> argument is present, otherwise GET.</p></li>
+         * <li>params : <b>String/Object/Function</b><p class="sub-desc">The
+         * parameters to pass to the server (defaults to none). These may be specified as a url-encoded
+         * string, or as an object containing properties which represent parameters,
+         * or as a function, which returns such an object.</p></li>
+         * <li>scripts : <b>Boolean</b><p class="sub-desc">If <code>true</code>
+         * any &lt;script&gt; tags embedded in the response text will be extracted
+         * and executed (defaults to {@link Ext.Updater.defaults#loadScripts}). If this option is specified,
+         * the callback will be called <i>after</i> the execution of the scripts.</p></li>
+         * <li>callback : <b>Function</b><p class="sub-desc">A function to
+         * be called when the response from the server arrives. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li>
+         * <li><b>options</b> : Object<p class="sub-desc">The config object passed to the update call.</p></li></ul>
+         * </p></li>
+         * <li>scope : <b>Object</b><p class="sub-desc">The scope in which
+         * to execute the callback (The callback's <code>this</code> reference.) If the
+         * <code>params</code> argument is a function, this scope is used for that function also.</p></li>
+         * <li>discardUrl : <b>Boolean</b><p class="sub-desc">By default, the URL of this request becomes
+         * the default URL for this Updater object, and will be subsequently used in {@link #refresh}
+         * calls.  To bypass this behavior, pass <code>discardUrl:true</code> (defaults to false).</p></li>
+         * <li>timeout : <b>Number</b><p class="sub-desc">The number of seconds to wait for a response before
+         * timing out (defaults to {@link Ext.Updater.defaults#timeout}).</p></li>
+         * <li>text : <b>String</b><p class="sub-desc">The text to use as the innerHTML of the
+         * {@link Ext.Updater.defaults#indicatorText} div (defaults to 'Loading...').  To replace the entire div, not
+         * just the text, override {@link Ext.Updater.defaults#indicatorText} directly.</p></li>
+         * <li>nocache : <b>Boolean</b><p class="sub-desc">Only needed for GET
+         * requests, this option causes an extra, auto-generated parameter to be appended to the request
+         * to defeat caching (defaults to {@link Ext.Updater.defaults#disableCaching}).</p></li></ul>
+         * <p>
+         * For example:
+    <pre><code>
+    um.update({
+        url: "your-url.php",
+        params: {param1: "foo", param2: "bar"}, // or a URL encoded string
+        callback: yourFunction,
+        scope: yourObject, //(optional scope)
+        discardUrl: true,
+        nocache: true,
+        text: "Loading...",
+        timeout: 60,
+        scripts: false // Save time by avoiding RegExp execution.
+    });
+    </code></pre>
+         */
+        update : function(url, params, callback, discardUrl){
+            var me = this,
+                cfg,
+                callerScope;
+
+            if(me.fireEvent(BEFOREUPDATE, me.el, url, params) !== false){
+                if(Ext.isObject(url)){ // must be config object
+                    cfg = url;
+                    url = cfg.url;
+                    params = params || cfg.params;
+                    callback = callback || cfg.callback;
+                    discardUrl = discardUrl || cfg.discardUrl;
+                    callerScope = cfg.scope;
+                    if(!Ext.isEmpty(cfg.nocache)){me.disableCaching = cfg.nocache;};
+                    if(!Ext.isEmpty(cfg.text)){me.indicatorText = '<div class="loading-indicator">'+cfg.text+"</div>";};
+                    if(!Ext.isEmpty(cfg.scripts)){me.loadScripts = cfg.scripts;};
+                    if(!Ext.isEmpty(cfg.timeout)){me.timeout = cfg.timeout;};
+                }
+                me.showLoading();
+
+                if(!discardUrl){
+                    me.defaultUrl = url;
+                }
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+
+                var o = Ext.apply({}, {
+                    url : url,
+                    params: (Ext.isFunction(params) && callerScope) ? params.createDelegate(callerScope) : params,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    callback: undefined,
+                    timeout: (me.timeout*1000),
+                    disableCaching: me.disableCaching,
+                    argument: {
+                        "options": cfg,
+                        "url": url,
+                        "form": null,
+                        "callback": callback,
+                        "scope": callerScope || window,
+                        "params": params
+                    }
+                }, cfg);
+
+                me.transaction = Ext.Ajax.request(o);
+            }
+        },
+
+        /**
+         * <p>Performs an asynchronous form post, updating this element with the response. If the form has the attribute
+         * enctype="<a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>", it assumes it's a file upload.
+         * Uses this.sslBlankUrl for SSL file uploads to prevent IE security warning.</p>
+         * <p>File uploads are not performed using normal "Ajax" techniques, that is they are <b>not</b>
+         * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+         * DOM <code>&lt;form></code> element temporarily modified to have its
+         * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+         * to a dynamically generated, hidden <code>&lt;iframe></code> which is inserted into the document
+         * but removed after the return data has been gathered.</p>
+         * <p>Be aware that file upload packets, sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form-data</a>
+         * and some server technologies (notably JEE) may require some custom processing in order to
+         * retrieve parameter names and parameter values from the packet content.</p>
+         * @param {String/HTMLElement} form The form Id or form element
+         * @param {String} url (optional) The url to pass the form to. If omitted the action attribute on the form will be used.
+         * @param {Boolean} reset (optional) Whether to try to reset the form after the update
+         * @param {Function} callback (optional) Callback when transaction is complete. The following
+         * parameters are passed:<ul>
+         * <li><b>el</b> : Ext.Element<p class="sub-desc">The Element being updated.</p></li>
+         * <li><b>success</b> : Boolean<p class="sub-desc">True for success, false for failure.</p></li>
+         * <li><b>response</b> : XMLHttpRequest<p class="sub-desc">The XMLHttpRequest which processed the update.</p></li></ul>
+         */
+        formUpdate : function(form, url, reset, callback){
+            var me = this;
+            if(me.fireEvent(BEFOREUPDATE, me.el, form, url) !== false){
+                if(Ext.isFunction(url)){
+                    url = url.call(me);
+                }
+                form = Ext.getDom(form);
+                me.transaction = Ext.Ajax.request({
+                    form: form,
+                    url:url,
+                    success: processSuccess,
+                    failure: processFailure,
+                    scope: me,
+                    timeout: (me.timeout*1000),
+                    argument: {
+                        "url": url,
+                        "form": form,
+                        "callback": callback,
+                        "reset": reset
+                    }
+                });
+                me.showLoading.defer(1, me);
+            }
+        },
+
+        /**
+         * Set this element to auto refresh.  Can be canceled by calling {@link #stopAutoRefresh}.
+         * @param {Number} interval How often to update (in seconds).
+         * @param {String/Object/Function} url (optional) The url for this request, a config object in the same format
+         * supported by {@link #load}, or a function to call to get the url (defaults to the last used url).  Note that while
+         * the url used in a load call can be reused by this method, other load config options will not be reused and must be
+         * sepcified as part of a config object passed as this paramter if needed.
+         * @param {String/Object} params (optional) The parameters to pass as either a url encoded string
+         * "&param1=1&param2=2" or as an object {param1: 1, param2: 2}
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         * @param {Boolean} refreshNow (optional) Whether to execute the refresh now, or wait the interval
+         */
+        startAutoRefresh : function(interval, url, params, callback, refreshNow){
+            var me = this;
+            if(refreshNow){
+                me.update(url || me.defaultUrl, params, callback, true);
+            }
+            if(me.autoRefreshProcId){
+                clearInterval(me.autoRefreshProcId);
+            }
+            me.autoRefreshProcId = setInterval(me.update.createDelegate(me, [url || me.defaultUrl, params, callback, true]), interval * 1000);
+        },
+
+        /**
+         * Stop auto refresh on this element.
+         */
+        stopAutoRefresh : function(){
+            if(this.autoRefreshProcId){
+                clearInterval(this.autoRefreshProcId);
+                delete this.autoRefreshProcId;
+            }
+        },
+
+        /**
+         * Returns true if the Updater is currently set to auto refresh its content (see {@link #startAutoRefresh}), otherwise false.
+         */
+        isAutoRefreshing : function(){
+           return !!this.autoRefreshProcId;
+        },
+
+        /**
+         * Display the element's "loading" state. By default, the element is updated with {@link #indicatorText}. This
+         * method may be overridden to perform a custom action while this Updater is actively updating its contents.
+         */
+        showLoading : function(){
+            if(this.showLoadIndicator){
+                this.el.dom.innerHTML = this.indicatorText;
+            }
+        },
+
+        /**
+         * Aborts the currently executing transaction, if any.
+         */
+        abort : function(){
+            if(this.transaction){
+                Ext.Ajax.abort(this.transaction);
+            }
+        },
+
+        /**
+         * Returns true if an update is in progress, otherwise false.
+         * @return {Boolean}
+         */
+        isUpdating : function(){
+            return this.transaction ? Ext.Ajax.isLoading(this.transaction) : false;
+        },
+
+        /**
+         * Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately
+         * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+         */
+        refresh : function(callback){
+            if(this.defaultUrl){
+                this.update(this.defaultUrl, null, callback, true);
+            }
+        }
+    };
+}());
+
+/**
+ * @class Ext.Updater.defaults
+ * The defaults collection enables customizing the default properties of Updater
+ */
+Ext.Updater.defaults = {
+   /**
+     * Timeout for requests or form posts in seconds (defaults to 30 seconds).
+     * @type Number
+     */
+    timeout : 30,
+    /**
+     * True to append a unique parameter to GET requests to disable caching (defaults to false).
+     * @type Boolean
+     */
+    disableCaching : false,
+    /**
+     * Whether or not to show {@link #indicatorText} during loading (defaults to true).
+     * @type Boolean
+     */
+    showLoadIndicator : true,
+    /**
+     * Text for loading indicator (defaults to '&lt;div class="loading-indicator"&gt;Loading...&lt;/div&gt;').
+     * @type String
+     */
+    indicatorText : '<div class="loading-indicator">Loading...</div>',
+     /**
+     * True to process scripts by default (defaults to false).
+     * @type Boolean
+     */
+    loadScripts : false,
+    /**
+    * Blank page URL to use with SSL file uploads (defaults to {@link Ext#SSL_SECURE_URL} if set, or "javascript:false").
+    * @type String
+    */
+    sslBlankUrl : Ext.SSL_SECURE_URL
+};
+
+
+/**
+ * Static convenience method. <b>This method is deprecated in favor of el.load({url:'foo.php', ...})</b>.
+ * Usage:
+ * <pre><code>Ext.Updater.updateElement("my-div", "stuff.php");</code></pre>
+ * @param {Mixed} el The element to update
+ * @param {String} url The url
+ * @param {String/Object} params (optional) Url encoded param string or an object of name/value pairs
+ * @param {Object} options (optional) A config object with any of the Updater properties you want to set - for
+ * example: {disableCaching:true, indicatorText: "Loading data..."}
+ * @static
+ * @deprecated
+ * @member Ext.Updater
+ */
+Ext.Updater.updateElement = function(el, url, params, options){
+    var um = Ext.get(el).getUpdater();
+    Ext.apply(um, options);
+    um.update(url, params, options ? options.callback : null);
+};
+
+/**
+ * @class Ext.Updater.BasicRenderer
+ * <p>This class is a base class implementing a simple render method which updates an element using results from an Ajax request.</p>
+ * <p>The BasicRenderer updates the element's innerHTML with the responseText. To perform a custom render (i.e. XML or JSON processing),
+ * create an object with a conforming {@link #render} method and pass it to setRenderer on the Updater.</p>
+ */
+Ext.Updater.BasicRenderer = function(){};
+
+Ext.Updater.BasicRenderer.prototype = {
+    /**
+     * This method is called when an Ajax response is received, and an Element needs updating.
+     * @param {Ext.Element} el The element being rendered
+     * @param {Object} xhr The XMLHttpRequest object
+     * @param {Updater} updateManager The calling update manager
+     * @param {Function} callback A callback that will need to be called if loadScripts is true on the Updater
+     */
+     render : function(el, response, updateManager, callback){
+        el.update(response.responseText, updateManager.loadScripts, callback);
+    }
+};/**
+ * @class Date
+ *
+ * The date parsing and formatting syntax contains a subset of
+ * <a href="http://www.php.net/date">PHP's date() function</a>, and the formats that are
+ * supported will provide results equivalent to their PHP versions.
+ *
+ * The following is a list of all currently supported formats:
+ * <pre>
+Format  Description                                                               Example returned values
+------  -----------------------------------------------------------------------   -----------------------
+  d     Day of the month, 2 digits with leading zeros                             01 to 31
+  D     A short textual representation of the day of the week                     Mon to Sun
+  j     Day of the month without leading zeros                                    1 to 31
+  l     A full textual representation of the day of the week                      Sunday to Saturday
+  N     ISO-8601 numeric representation of the day of the week                    1 (for Monday) through 7 (for Sunday)
+  S     English ordinal suffix for the day of the month, 2 characters             st, nd, rd or th. Works well with j
+  w     Numeric representation of the day of the week                             0 (for Sunday) to 6 (for Saturday)
+  z     The day of the year (starting from 0)                                     0 to 364 (365 in leap years)
+  W     ISO-8601 week number of year, weeks starting on Monday                    01 to 53
+  F     A full textual representation of a month, such as January or March        January to December
+  m     Numeric representation of a month, with leading zeros                     01 to 12
+  M     A short textual representation of a month                                 Jan to Dec
+  n     Numeric representation of a month, without leading zeros                  1 to 12
+  t     Number of days in the given month                                         28 to 31
+  L     Whether it's a leap year                                                  1 if it is a leap year, 0 otherwise.
+  o     ISO-8601 year number (identical to (Y), but if the ISO week number (W)    Examples: 1998 or 2004
+        belongs to the previous or next year, that year is used instead)
+  Y     A full numeric representation of a year, 4 digits                         Examples: 1999 or 2003
+  y     A two digit representation of a year                                      Examples: 99 or 03
+  a     Lowercase Ante meridiem and Post meridiem                                 am or pm
+  A     Uppercase Ante meridiem and Post meridiem                                 AM or PM
+  g     12-hour format of an hour without leading zeros                           1 to 12
+  G     24-hour format of an hour without leading zeros                           0 to 23
+  h     12-hour format of an hour with leading zeros                              01 to 12
+  H     24-hour format of an hour with leading zeros                              00 to 23
+  i     Minutes, with leading zeros                                               00 to 59
+  s     Seconds, with leading zeros                                               00 to 59
+  u     Decimal fraction of a second                                              Examples:
+        (minimum 1 digit, arbitrary number of digits allowed)                     001 (i.e. 0.001s) or
+                                                                                  100 (i.e. 0.100s) or
+                                                                                  999 (i.e. 0.999s) or
+                                                                                  999876543210 (i.e. 0.999876543210s)
+  O     Difference to Greenwich time (GMT) in hours and minutes                   Example: +1030
+  P     Difference to Greenwich time (GMT) with colon between hours and minutes   Example: -08:00
+  T     Timezone abbreviation of the machine running the code                     Examples: EST, MDT, PDT ...
+  Z     Timezone offset in seconds (negative if west of UTC, positive if east)    -43200 to 50400
+  c     ISO 8601 date
+        Notes:                                                                    Examples:
+        1) If unspecified, the month / day defaults to the current month / day,   1991 or
+           the time defaults to midnight, while the timezone defaults to the      1992-10 or
+           browser's timezone. If a time is specified, it must include both hours 1993-09-20 or
+           and minutes. The "T" delimiter, seconds, milliseconds and timezone     1994-08-19T16:20+01:00 or
+           are optional.                                                          1995-07-18T17:21:28-02:00 or
+        2) The decimal fraction of a second, if specified, must contain at        1996-06-17T18:22:29.98765+03:00 or
+           least 1 digit (there is no limit to the maximum number                 1997-05-16T19:23:30,12345-0400 or
+           of digits allowed), and may be delimited by either a '.' or a ','      1998-04-15T20:24:31.2468Z or
+        Refer to the examples on the right for the various levels of              1999-03-14T20:24:32Z or
+        date-time granularity which are supported, or see                         2000-02-13T21:25:33
+        http://www.w3.org/TR/NOTE-datetime for more info.                         2001-01-12 22:26:34
+  U     Seconds since the Unix Epoch (January 1 1970 00:00:00 GMT)                1193432466 or -2138434463
+  M$    Microsoft AJAX serialized dates                                           \/Date(1238606590509)\/ (i.e. UTC milliseconds since epoch) or
+                                                                                  \/Date(1238606590509+0800)\/
+</pre>
+ *
+ * Example usage (note that you must escape format specifiers with '\\' to render them as character literals):
+ * <pre><code>
+// Sample date:
+// 'Wed Jan 10 2007 15:05:01 GMT-0600 (Central Standard Time)'
+
+var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
+document.write(dt.format('Y-m-d'));                           // 2007-01-10
+document.write(dt.format('F j, Y, g:i a'));                   // January 10, 2007, 3:05 pm
+document.write(dt.format('l, \\t\\he jS \\of F Y h:i:s A'));  // Wednesday, the 10th of January 2007 03:05:01 PM
+</code></pre>
+ *
+ * Here are some standard date/time patterns that you might find helpful.  They
+ * are not part of the source of Date.js, but to use them you can simply copy this
+ * block of code into any script that is included after Date.js and they will also become
+ * globally available on the Date object.  Feel free to add or remove patterns as needed in your code.
+ * <pre><code>
+Date.patterns = {
+    ISO8601Long:"Y-m-d H:i:s",
+    ISO8601Short:"Y-m-d",
+    ShortDate: "n/j/Y",
+    LongDate: "l, F d, Y",
+    FullDateTime: "l, F d, Y g:i:s A",
+    MonthDay: "F d",
+    ShortTime: "g:i A",
+    LongTime: "g:i:s A",
+    SortableDateTime: "Y-m-d\\TH:i:s",
+    UniversalSortableDateTime: "Y-m-d H:i:sO",
+    YearMonth: "F, Y"
+};
+</code></pre>
+ *
+ * Example usage:
+ * <pre><code>
+var dt = new Date();
+document.write(dt.format(Date.patterns.ShortDate));
+</code></pre>
+ * <p>Developer-written, custom formats may be used by supplying both a formatting and a parsing function
+ * which perform to specialized requirements. The functions are stored in {@link #parseFunctions} and {@link #formatFunctions}.</p>
+ */
+
+/*
+ * Most of the date-formatting functions below are the excellent work of Baron Schwartz.
+ * (see http://www.xaprb.com/blog/2005/12/12/javascript-closures-for-runtime-efficiency/)
+ * They generate precompiled functions from format patterns instead of parsing and
+ * processing each pattern every time a date is formatted. These functions are available
+ * on every Date object.
+ */
+
+(function() {
+
+/**
+ * Global flag which determines if strict date parsing should be used.
+ * Strict date parsing will not roll-over invalid dates, which is the
+ * default behaviour of javascript Date objects.
+ * (see {@link #parseDate} for more information)
+ * Defaults to <tt>false</tt>.
+ * @static
+ * @type Boolean
+*/
+Date.useStrict = false;
+
+
+// create private copy of Ext's String.format() method
+// - to remove unnecessary dependency
+// - to resolve namespace conflict with M$-Ajax's implementation
+function xf(format) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return format.replace(/\{(\d+)\}/g, function(m, i) {
+        return args[i];
+    });
+}
+
+
+// private
+Date.formatCodeToRegex = function(character, currentGroup) {
+    // Note: currentGroup - position in regex result array (see notes for Date.parseCodes below)
+    var p = Date.parseCodes[character];
+
+    if (p) {
+      p = typeof p == 'function'? p() : p;
+      Date.parseCodes[character] = p; // reassign function result to prevent repeated execution
+    }
+
+    return p ? Ext.applyIf({
+      c: p.c ? xf(p.c, currentGroup || "{0}") : p.c
+    }, p) : {
+        g:0,
+        c:null,
+        s:Ext.escapeRe(character) // treat unrecognised characters as literals
+    };
+};
+
+// private shorthand for Date.formatCodeToRegex since we'll be using it fairly often
+var $f = Date.formatCodeToRegex;
+
+Ext.apply(Date, {
+    /**
+     * <p>An object hash in which each property is a date parsing function. The property name is the
+     * format string which that function parses.</p>
+     * <p>This object is automatically populated with date parsing functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom parsing functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #parseDate}.<p>
+     * <p>Example:</p><pre><code>
+Date.parseFunctions['x-date-format'] = myDateParser;
+</code></pre>
+     * <p>A parsing function should return a Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : String<div class="sub-desc">The date string to parse.</div></li>
+     * <li><code>strict</code> : Boolean<div class="sub-desc">True to validate date strings while parsing
+     * (i.e. prevent javascript Date "rollover") (The default must be false).
+     * Invalid date strings should return null when parsed.</div></li>
+     * </ul></div></p>
+     * <p>To enable Dates to also be <i>formatted</i> according to that format, a corresponding
+     * formatting function must be placed into the {@link #formatFunctions} property.
+     * @property parseFunctions
+     * @static
+     * @type Object
+     */
+    parseFunctions: {
+        "M$": function(input, strict) {
+            // note: the timezone offset is ignored since the M$ Ajax server sends
+            // a UTC milliseconds-since-Unix-epoch value (negative values are allowed)
+            var re = new RegExp('\\/Date\\(([-+])?(\\d+)(?:[+-]\\d{4})?\\)\\/');
+            var r = (input || '').match(re);
+            return r? new Date(((r[1] || '') + r[2]) * 1) : null;
+        }
+    },
+    parseRegexes: [],
+
+    /**
+     * <p>An object hash in which each property is a date formatting function. The property name is the
+     * format string which corresponds to the produced formatted date string.</p>
+     * <p>This object is automatically populated with date formatting functions as
+     * date formats are requested for Ext standard formatting strings.</p>
+     * <p>Custom formatting functions may be inserted into this object, keyed by a name which from then on
+     * may be used as a format string to {@link #format}. Example:</p><pre><code>
+Date.formatFunctions['x-date-format'] = myDateFormatter;
+</code></pre>
+     * <p>A formatting function should return a string representation of the passed Date object, and is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>date</code> : Date<div class="sub-desc">The Date to format.</div></li>
+     * </ul></div></p>
+     * <p>To enable date strings to also be <i>parsed</i> according to that format, a corresponding
+     * parsing function must be placed into the {@link #parseFunctions} property.
+     * @property formatFunctions
+     * @static
+     * @type Object
+     */
+    formatFunctions: {
+        "M$": function() {
+            // UTC milliseconds since Unix epoch (M$-AJAX serialized date format (MRSF))
+            return '\\/Date(' + this.getTime() + ')\\/';
+        }
+    },
+
+    y2kYear : 50,
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MILLI : "ms",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    SECOND : "s",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MINUTE : "mi",
+
+    /** Date interval constant
+     * @static
+     * @type String
+     */
+    HOUR : "h",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    DAY : "d",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    MONTH : "mo",
+
+    /**
+     * Date interval constant
+     * @static
+     * @type String
+     */
+    YEAR : "y",
+
+    /**
+     * <p>An object hash containing default date values used during date parsing.</p>
+     * <p>The following properties are available:<div class="mdetail-params"><ul>
+     * <li><code>y</code> : Number<div class="sub-desc">The default year value. (defaults to undefined)</div></li>
+     * <li><code>m</code> : Number<div class="sub-desc">The default 1-based month value. (defaults to undefined)</div></li>
+     * <li><code>d</code> : Number<div class="sub-desc">The default day value. (defaults to undefined)</div></li>
+     * <li><code>h</code> : Number<div class="sub-desc">The default hour value. (defaults to undefined)</div></li>
+     * <li><code>i</code> : Number<div class="sub-desc">The default minute value. (defaults to undefined)</div></li>
+     * <li><code>s</code> : Number<div class="sub-desc">The default second value. (defaults to undefined)</div></li>
+     * <li><code>ms</code> : Number<div class="sub-desc">The default millisecond value. (defaults to undefined)</div></li>
+     * </ul></div></p>
+     * <p>Override these properties to customize the default date values used by the {@link #parseDate} method.</p>
+     * <p><b>Note: In countries which experience Daylight Saving Time (i.e. DST), the <tt>h</tt>, <tt>i</tt>, <tt>s</tt>
+     * and <tt>ms</tt> properties may coincide with the exact time in which DST takes effect.
+     * It is the responsiblity of the developer to account for this.</b></p>
+     * Example Usage:
+     * <pre><code>
+// set default day value to the first day of the month
+Date.defaults.d = 1;
+
+// parse a February date string containing only year and month values.
+// setting the default day value to 1 prevents weird date rollover issues
+// when attempting to parse the following date string on, for example, March 31st 2009.
+Date.parseDate('2009-02', 'Y-m'); // returns a Date object representing February 1st 2009
+</code></pre>
+     * @property defaults
+     * @static
+     * @type Object
+     */
+    defaults: {},
+
+    /**
+     * An array of textual day names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.dayNames = [
+    'SundayInYourLang',
+    'MondayInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    dayNames : [
+        "Sunday",
+        "Monday",
+        "Tuesday",
+        "Wednesday",
+        "Thursday",
+        "Friday",
+        "Saturday"
+    ],
+
+    /**
+     * An array of textual month names.
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNames = [
+    'JanInYourLang',
+    'FebInYourLang',
+    ...
+];
+</code></pre>
+     * @type Array
+     * @static
+     */
+    monthNames : [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July",
+        "August",
+        "September",
+        "October",
+        "November",
+        "December"
+    ],
+
+    /**
+     * An object hash of zero-based javascript month numbers (with short month names as keys. note: keys are case-sensitive).
+     * Override these values for international dates.
+     * Example:
+     * <pre><code>
+Date.monthNumbers = {
+    'ShortJanNameInYourLang':0,
+    'ShortFebNameInYourLang':1,
+    ...
+};
+</code></pre>
+     * @type Object
+     * @static
+     */
+    monthNumbers : {
+        Jan:0,
+        Feb:1,
+        Mar:2,
+        Apr:3,
+        May:4,
+        Jun:5,
+        Jul:6,
+        Aug:7,
+        Sep:8,
+        Oct:9,
+        Nov:10,
+        Dec:11
+    },
+
+    /**
+     * Get the short month name for the given month number.
+     * Override this function for international dates.
+     * @param {Number} month A zero-based javascript month number.
+     * @return {String} The short month name.
+     * @static
+     */
+    getShortMonthName : function(month) {
+        return Date.monthNames[month].substring(0, 3);
+    },
+
+    /**
+     * Get the short day name for the given day number.
+     * Override this function for international dates.
+     * @param {Number} day A zero-based javascript day number.
+     * @return {String} The short day name.
+     * @static
+     */
+    getShortDayName : function(day) {
+        return Date.dayNames[day].substring(0, 3);
+    },
+
+    /**
+     * Get the zero-based javascript month number for the given short/full month name.
+     * Override this function for international dates.
+     * @param {String} name The short/full month name.
+     * @return {Number} The zero-based javascript month number.
+     * @static
+     */
+    getMonthNumber : function(name) {
+        // handle camel casing for english month names (since the keys for the Date.monthNumbers hash are case sensitive)
+        return Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
+    },
+    
+    /**
+     * Checks if the specified format contains hour information
+     * @param {Object} format The format to check
+     * @return {Boolean} True if the format contains hour information
+     * @static
+     */
+    formatContainsHourInfo : (function(){
+        var stripEscapeRe = /(\\.)/g,
+            hourInfoRe = /([gGhHisucUOPZ]|M\$)/;
+        return function(format){
+            return hourInfoRe.test(format.replace(stripEscapeRe, ''));
+        };
+    })(),
+
+    /**
+     * The base format-code to formatting-function hashmap used by the {@link #format} method.
+     * Formatting functions are strings (or functions which return strings) which
+     * will return the appropriate value when evaluated in the context of the Date object
+     * from which the {@link #format} method is called.
+     * Add to / override these mappings for custom date formatting.
+     * Note: Date.format() treats characters as literals if an appropriate mapping cannot be found.
+     * Example:
+     * <pre><code>
+Date.formatCodes.x = "String.leftPad(this.getDate(), 2, '0')";
+(new Date()).format("X"); // returns the current day of the month
+</code></pre>
+     * @type Object
+     * @static
+     */
+    formatCodes : {
+        d: "String.leftPad(this.getDate(), 2, '0')",
+        D: "Date.getShortDayName(this.getDay())", // get localised short day name
+        j: "this.getDate()",
+        l: "Date.dayNames[this.getDay()]",
+        N: "(this.getDay() ? this.getDay() : 7)",
+        S: "this.getSuffix()",
+        w: "this.getDay()",
+        z: "this.getDayOfYear()",
+        W: "String.leftPad(this.getWeekOfYear(), 2, '0')",
+        F: "Date.monthNames[this.getMonth()]",
+        m: "String.leftPad(this.getMonth() + 1, 2, '0')",
+        M: "Date.getShortMonthName(this.getMonth())", // get localised short month name
+        n: "(this.getMonth() + 1)",
+        t: "this.getDaysInMonth()",
+        L: "(this.isLeapYear() ? 1 : 0)",
+        o: "(this.getFullYear() + (this.getWeekOfYear() == 1 && this.getMonth() > 0 ? +1 : (this.getWeekOfYear() >= 52 && this.getMonth() < 11 ? -1 : 0)))",
+        Y: "String.leftPad(this.getFullYear(), 4, '0')",
+        y: "('' + this.getFullYear()).substring(2, 4)",
+        a: "(this.getHours() < 12 ? 'am' : 'pm')",
+        A: "(this.getHours() < 12 ? 'AM' : 'PM')",
+        g: "((this.getHours() % 12) ? this.getHours() % 12 : 12)",
+        G: "this.getHours()",
+        h: "String.leftPad((this.getHours() % 12) ? this.getHours() % 12 : 12, 2, '0')",
+        H: "String.leftPad(this.getHours(), 2, '0')",
+        i: "String.leftPad(this.getMinutes(), 2, '0')",
+        s: "String.leftPad(this.getSeconds(), 2, '0')",
+        u: "String.leftPad(this.getMilliseconds(), 3, '0')",
+        O: "this.getGMTOffset()",
+        P: "this.getGMTOffset(true)",
+        T: "this.getTimezone()",
+        Z: "(this.getTimezoneOffset() * -60)",
+
+        c: function() { // ISO-8601 -- GMT format
+            for (var c = "Y-m-dTH:i:sP", code = [], i = 0, l = c.length; i < l; ++i) {
+                var e = c.charAt(i);
+                code.push(e == "T" ? "'T'" : Date.getFormatCode(e)); // treat T as a character literal
+            }
+            return code.join(" + ");
+        },
+        /*
+        c: function() { // ISO-8601 -- UTC format
+            return [
+              "this.getUTCFullYear()", "'-'",
+              "String.leftPad(this.getUTCMonth() + 1, 2, '0')", "'-'",
+              "String.leftPad(this.getUTCDate(), 2, '0')",
+              "'T'",
+              "String.leftPad(this.getUTCHours(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCMinutes(), 2, '0')", "':'",
+              "String.leftPad(this.getUTCSeconds(), 2, '0')",
+              "'Z'"
+            ].join(" + ");
+        },
+        */
+
+        U: "Math.round(this.getTime() / 1000)"
+    },
+
+    /**
+     * Checks if the passed Date parameters will cause a javascript Date "rollover".
+     * @param {Number} year 4-digit year
+     * @param {Number} month 1-based month-of-year
+     * @param {Number} day Day of month
+     * @param {Number} hour (optional) Hour
+     * @param {Number} minute (optional) Minute
+     * @param {Number} second (optional) Second
+     * @param {Number} millisecond (optional) Millisecond
+     * @return {Boolean} true if the passed parameters do not cause a Date "rollover", false otherwise.
+     * @static
+     */
+    isValid : function(y, m, d, h, i, s, ms) {
+        // setup defaults
+        h = h || 0;
+        i = i || 0;
+        s = s || 0;
+        ms = ms || 0;
+
+        // Special handling for year < 100
+        var dt = new Date(y < 100 ? 100 : y, m - 1, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);
+
+        return y == dt.getFullYear() &&
+            m == dt.getMonth() + 1 &&
+            d == dt.getDate() &&
+            h == dt.getHours() &&
+            i == dt.getMinutes() &&
+            s == dt.getSeconds() &&
+            ms == dt.getMilliseconds();
+    },
+
+    /**
+     * Parses the passed string using the specified date format.
+     * Note that this function expects normal calendar dates, meaning that months are 1-based (i.e. 1 = January).
+     * The {@link #defaults} hash will be used for any date value (i.e. year, month, day, hour, minute, second or millisecond)
+     * which cannot be found in the passed string. If a corresponding default date value has not been specified in the {@link #defaults} hash,
+     * the current date's year, month, day or DST-adjusted zero-hour time value will be used instead.
+     * Keep in mind that the input date string must precisely match the specified format string
+     * in order for the parse operation to be successful (failed parse operations return a null value).
+     * <p>Example:</p><pre><code>
+//dt = Fri May 25 2007 (current date)
+var dt = new Date();
+
+//dt = Thu May 25 2006 (today&#39;s month/day in 2006)
+dt = Date.parseDate("2006", "Y");
+
+//dt = Sun Jan 15 2006 (all date parts specified)
+dt = Date.parseDate("2006-01-15", "Y-m-d");
+
+//dt = Sun Jan 15 2006 15:20:01
+dt = Date.parseDate("2006-01-15 3:20:01 PM", "Y-m-d g:i:s A");
+
+// attempt to parse Sun Feb 29 2006 03:20:01 in strict mode
+dt = Date.parseDate("2006-02-29 03:20:01", "Y-m-d H:i:s", true); // returns null
+</code></pre>
+     * @param {String} input The raw date string.
+     * @param {String} format The expected date string format.
+     * @param {Boolean} strict (optional) True to validate date strings while parsing (i.e. prevents javascript Date "rollover")
+                        (defaults to false). Invalid date strings will return null when parsed.
+     * @return {Date} The parsed Date.
+     * @static
+     */
+    parseDate : function(input, format, strict) {
+        var p = Date.parseFunctions;
+        if (p[format] == null) {
+            Date.createParser(format);
+        }
+        return p[format](input, Ext.isDefined(strict) ? strict : Date.useStrict);
+    },
+
+    // private
+    getFormatCode : function(character) {
+        var f = Date.formatCodes[character];
+
+        if (f) {
+          f = typeof f == 'function'? f() : f;
+          Date.formatCodes[character] = f; // reassign function result to prevent repeated execution
+        }
+
+        // note: unknown characters are treated as literals
+        return f || ("'" + String.escape(character) + "'");
+    },
+
+    // private
+    createFormat : function(format) {
+        var code = [],
+            special = false,
+            ch = '';
+
+        for (var i = 0; i < format.length; ++i) {
+            ch = format.charAt(i);
+            if (!special && ch == "\\") {
+                special = true;
+            } else if (special) {
+                special = false;
+                code.push("'" + String.escape(ch) + "'");
+            } else {
+                code.push(Date.getFormatCode(ch));
+            }
+        }
+        Date.formatFunctions[format] = new Function("return " + code.join('+'));
+    },
+
+    // private
+    createParser : function() {
+        var code = [
+            "var dt, y, m, d, h, i, s, ms, o, z, zz, u, v,",
+                "def = Date.defaults,",
+                "results = String(input).match(Date.parseRegexes[{0}]);", // either null, or an array of matched strings
+
+            "if(results){",
+                "{1}",
+
+                "if(u != null){", // i.e. unix time is defined
+                    "v = new Date(u * 1000);", // give top priority to UNIX time
+                "}else{",
+                    // create Date object representing midnight of the current day;
+                    // this will provide us with our date defaults
+                    // (note: clearTime() handles Daylight Saving Time automatically)
+                    "dt = (new Date()).clearTime();",
+
+                    // date calculations (note: these calculations create a dependency on Ext.num())
+                    "y = Ext.num(y, Ext.num(def.y, dt.getFullYear()));",
+                    "m = Ext.num(m, Ext.num(def.m - 1, dt.getMonth()));",
+                    "d = Ext.num(d, Ext.num(def.d, dt.getDate()));",
+
+                    // time calculations (note: these calculations create a dependency on Ext.num())
+                    "h  = Ext.num(h, Ext.num(def.h, dt.getHours()));",
+                    "i  = Ext.num(i, Ext.num(def.i, dt.getMinutes()));",
+                    "s  = Ext.num(s, Ext.num(def.s, dt.getSeconds()));",
+                    "ms = Ext.num(ms, Ext.num(def.ms, dt.getMilliseconds()));",
+
+                    "if(z >= 0 && y >= 0){",
+                        // both the year and zero-based day of year are defined and >= 0.
+                        // these 2 values alone provide sufficient info to create a full date object
+
+                        // create Date object representing January 1st for the given year
+                        // handle years < 100 appropriately
+                        "v = new Date(y < 100 ? 100 : y, 0, 1, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+
+                        // then add day of year, checking for Date "rollover" if necessary
+                        "v = !strict? v : (strict === true && (z <= 364 || (v.isLeapYear() && z <= 365))? v.add(Date.DAY, z) : null);",
+                    "}else if(strict === true && !Date.isValid(y, m + 1, d, h, i, s, ms)){", // check for Date "rollover"
+                        "v = null;", // invalid date, so return null
+                    "}else{",
+                        // plain old Date object
+                        // handle years < 100 properly
+                        "v = new Date(y < 100 ? 100 : y, m, d, h, i, s, ms).add(Date.YEAR, y < 100 ? y - 100 : 0);",
+                    "}",
+                "}",
+            "}",
+
+            "if(v){",
+                // favour UTC offset over GMT offset
+                "if(zz != null){",
+                    // reset to UTC, then add offset
+                    "v = v.add(Date.SECOND, -v.getTimezoneOffset() * 60 - zz);",
+                "}else if(o){",
+                    // reset to GMT, then add offset
+                    "v = v.add(Date.MINUTE, -v.getTimezoneOffset() + (sn == '+'? -1 : 1) * (hr * 60 + mn));",
+                "}",
+            "}",
+
+            "return v;"
+        ].join('\n');
+
+        return function(format) {
+            var regexNum = Date.parseRegexes.length,
+                currentGroup = 1,
+                calc = [],
+                regex = [],
+                special = false,
+                ch = "",
+                i = 0,
+                obj,
+                last;
+
+            for (; i < format.length; ++i) {
+                ch = format.charAt(i);
+                if (!special && ch == "\\") {
+                    special = true;
+                } else if (special) {
+                    special = false;
+                    regex.push(String.escape(ch));
+                } else {
+                    obj = $f(ch, currentGroup);
+                    currentGroup += obj.g;
+                    regex.push(obj.s);
+                    if (obj.g && obj.c) {
+                        if (obj.calcLast) {
+                            last = obj.c;
+                        } else {
+                            calc.push(obj.c);
+                        }
+                    }
+                }
+            }
+            
+            if (last) {
+                calc.push(last);
+            }
+
+            Date.parseRegexes[regexNum] = new RegExp("^" + regex.join('') + "$", 'i');
+            Date.parseFunctions[format] = new Function("input", "strict", xf(code, regexNum, calc.join('')));
+        };
+    }(),
+
+    // private
+    parseCodes : {
+        /*
+         * Notes:
+         * g = {Number} calculation group (0 or 1. only group 1 contributes to date calculations.)
+         * c = {String} calculation method (required for group 1. null for group 0. {0} = currentGroup - position in regex result array)
+         * s = {String} regex pattern. all matches are stored in results[], and are accessible by the calculation mapped to 'c'
+         */
+        d: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // day of month with leading zeroes (01 - 31)
+        },
+        j: {
+            g:1,
+            c:"d = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // day of month without leading zeroes (1 - 31)
+        },
+        D: function() {
+            for (var a = [], i = 0; i < 7; a.push(Date.getShortDayName(i)), ++i); // get localised short day names
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + a.join("|") +")"
+            };
+        },
+        l: function() {
+            return {
+                g:0,
+                c:null,
+                s:"(?:" + Date.dayNames.join("|") + ")"
+            };
+        },
+        N: {
+            g:0,
+            c:null,
+            s:"[1-7]" // ISO-8601 day number (1 (monday) - 7 (sunday))
+        },
+        S: {
+            g:0,
+            c:null,
+            s:"(?:st|nd|rd|th)"
+        },
+        w: {
+            g:0,
+            c:null,
+            s:"[0-6]" // javascript day number (0 (sunday) - 6 (saturday))
+        },
+        z: {
+            g:1,
+            c:"z = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,3})" // day of the year (0 - 364 (365 in leap years))
+        },
+        W: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // ISO-8601 week number (with leading zero)
+        },
+        F: function() {
+            return {
+                g:1,
+                c:"m = parseInt(Date.getMonthNumber(results[{0}]), 10);\n", // get localised month number
+                s:"(" + Date.monthNames.join("|") + ")"
+            };
+        },
+        M: function() {
+            for (var a = [], i = 0; i < 12; a.push(Date.getShortMonthName(i)), ++i); // get localised short month names
+            return Ext.applyIf({
+                s:"(" + a.join("|") + ")"
+            }, $f("F"));
+        },
+        m: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{2})" // month number with leading zeros (01 - 12)
+        },
+        n: {
+            g:1,
+            c:"m = parseInt(results[{0}], 10) - 1;\n",
+            s:"(\\d{1,2})" // month number without leading zeros (1 - 12)
+        },
+        t: {
+            g:0,
+            c:null,
+            s:"(?:\\d{2})" // no. of days in the month (28 - 31)
+        },
+        L: {
+            g:0,
+            c:null,
+            s:"(?:1|0)"
+        },
+        o: function() {
+            return $f("Y");
+        },
+        Y: {
+            g:1,
+            c:"y = parseInt(results[{0}], 10);\n",
+            s:"(\\d{4})" // 4-digit year
+        },
+        y: {
+            g:1,
+            c:"var ty = parseInt(results[{0}], 10);\n"
+                + "y = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n", // 2-digit year
+            s:"(\\d{1,2})"
+        },
+        /**
+         * In the am/pm parsing routines, we allow both upper and lower case 
+         * even though it doesn't exactly match the spec. It gives much more flexibility
+         * in being able to specify case insensitive regexes.
+         */
+        a: function(){
+            return $f("A");
+        },
+        A: {
+            // We need to calculate the hour before we apply AM/PM when parsing
+            calcLast: true,
+            g:1,
+            c:"if (/(am)/i.test(results[{0}])) {\n"
+                + "if (!h || h == 12) { h = 0; }\n"
+                + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
+            s:"(AM|PM|am|pm)"
+        },
+        g: function() {
+            return $f("G");
+        },
+        G: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{1,2})" // 24-hr format of an hour without leading zeroes (0 - 23)
+        },
+        h: function() {
+            return $f("H");
+        },
+        H: {
+            g:1,
+            c:"h = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" //  24-hr format of an hour with leading zeroes (00 - 23)
+        },
+        i: {
+            g:1,
+            c:"i = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // minutes with leading zeros (00 - 59)
+        },
+        s: {
+            g:1,
+            c:"s = parseInt(results[{0}], 10);\n",
+            s:"(\\d{2})" // seconds with leading zeros (00 - 59)
+        },
+        u: {
+            g:1,
+            c:"ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",
+            s:"(\\d+)" // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+        },
+        O: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(3,5) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{4})" // GMT offset in hrs and mins
+        },
+        P: {
+            g:1,
+            c:[
+                "o = results[{0}];",
+                "var sn = o.substring(0,1),", // get + / - sign
+                    "hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),", // get hours (performs minutes-to-hour conversion also, just in case)
+                    "mn = o.substring(4,6) % 60;", // get minutes
+                "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + String.leftPad(hr, 2, '0') + String.leftPad(mn, 2, '0')) : null;\n" // -12hrs <= GMT offset <= 14hrs
+            ].join("\n"),
+            s: "([+\-]\\d{2}:\\d{2})" // GMT offset in hrs and mins (with colon separator)
+        },
+        T: {
+            g:0,
+            c:null,
+            s:"[A-Z]{1,4}" // timezone abbrev. may be between 1 - 4 chars
+        },
+        Z: {
+            g:1,
+            c:"zz = results[{0}] * 1;\n" // -43200 <= UTC offset <= 50400
+                  + "zz = (-43200 <= zz && zz <= 50400)? zz : null;\n",
+            s:"([+\-]?\\d{1,5})" // leading '+' sign is optional for UTC offset
+        },
+        c: function() {
+            var calc = [],
+                arr = [
+                    $f("Y", 1), // year
+                    $f("m", 2), // month
+                    $f("d", 3), // day
+                    $f("h", 4), // hour
+                    $f("i", 5), // minute
+                    $f("s", 6), // second
+                    {c:"ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"}, // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
+                    {c:[ // allow either "Z" (i.e. UTC) or "-0530" or "+08:00" (i.e. UTC offset) timezone delimiters. assumes local timezone if no timezone is specified
+                        "if(results[8]) {", // timezone specified
+                            "if(results[8] == 'Z'){",
+                                "zz = 0;", // UTC
+                            "}else if (results[8].indexOf(':') > -1){",
+                                $f("P", 8).c, // timezone offset with colon separator
+                            "}else{",
+                                $f("O", 8).c, // timezone offset without colon separator
+                            "}",
+                        "}"
+                    ].join('\n')}
+                ];
+
+            for (var i = 0, l = arr.length; i < l; ++i) {
+                calc.push(arr[i].c);
+            }
+
+            return {
+                g:1,
+                c:calc.join(""),
+                s:[
+                    arr[0].s, // year (required)
+                    "(?:", "-", arr[1].s, // month (optional)
+                        "(?:", "-", arr[2].s, // day (optional)
+                            "(?:",
+                                "(?:T| )?", // time delimiter -- either a "T" or a single blank space
+                                arr[3].s, ":", arr[4].s,  // hour AND minute, delimited by a single colon (optional). MUST be preceded by either a "T" or a single blank space
+                                "(?::", arr[5].s, ")?", // seconds (optional)
+                                "(?:(?:\\.|,)(\\d+))?", // decimal fraction of a second (e.g. ",12345" or ".98765") (optional)
+                                "(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?", // "Z" (UTC) or "-0530" (UTC offset without colon delimiter) or "+08:00" (UTC offset with colon delimiter) (optional)
+                            ")?",
+                        ")?",
+                    ")?"
+                ].join("")
+            };
+        },
+        U: {
+            g:1,
+            c:"u = parseInt(results[{0}], 10);\n",
+            s:"(-?\\d+)" // leading minus sign indicates seconds before UNIX epoch
+        }
+    }
+});
+
+}());
+
+Ext.apply(Date.prototype, {
+    // private
+    dateFormat : function(format) {
+        if (Date.formatFunctions[format] == null) {
+            Date.createFormat(format);
+        }
+        return Date.formatFunctions[format].call(this);
+    },
+
+    /**
+     * Get the timezone abbreviation of the current date (equivalent to the format specifier 'T').
+     *
+     * Note: The date string returned by the javascript Date object's toString() method varies
+     * between browsers (e.g. FF vs IE) and system region settings (e.g. IE in Asia vs IE in America).
+     * For a given date string e.g. "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)",
+     * getTimezone() first tries to get the timezone abbreviation from between a pair of parentheses
+     * (which may or may not be present), failing which it proceeds to get the timezone abbreviation
+     * from the GMT offset portion of the date string.
+     * @return {String} The abbreviated timezone name (e.g. 'CST', 'PDT', 'EDT', 'MPST' ...).
+     */
+    getTimezone : function() {
+        // the following list shows the differences between date strings from different browsers on a WinXP SP2 machine from an Asian locale:
+        //
+        // Opera  : "Thu, 25 Oct 2007 22:53:45 GMT+0800" -- shortest (weirdest) date string of the lot
+        // Safari : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone (same as FF)
+        // FF     : "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)" -- value in parentheses always gives the correct timezone
+        // IE     : "Thu Oct 25 22:54:35 UTC+0800 2007" -- (Asian system setting) look for 3-4 letter timezone abbrev
+        // IE     : "Thu Oct 25 17:06:37 PDT 2007" -- (American system setting) look for 3-4 letter timezone abbrev
+        //
+        // this crazy regex attempts to guess the correct timezone abbreviation despite these differences.
+        // step 1: (?:\((.*)\) -- find timezone in parentheses
+        // step 2: ([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?) -- if nothing was found in step 1, find timezone from timezone offset portion of date string
+        // step 3: remove all non uppercase characters found in step 1 and 2
+        return this.toString().replace(/^.* (?:\((.*)\)|([A-Z]{1,4})(?:[\-+][0-9]{4})?(?: -?\d+)?)$/, "$1$2").replace(/[^A-Z]/g, "");
+    },
+
+    /**
+     * Get the offset from GMT of the current date (equivalent to the format specifier 'O').
+     * @param {Boolean} colon (optional) true to separate the hours and minutes with a colon (defaults to false).
+     * @return {String} The 4-character offset string prefixed with + or - (e.g. '-0600').
+     */
+    getGMTOffset : function(colon) {
+        return (this.getTimezoneOffset() > 0 ? "-" : "+")
+            + String.leftPad(Math.floor(Math.abs(this.getTimezoneOffset()) / 60), 2, "0")
+            + (colon ? ":" : "")
+            + String.leftPad(Math.abs(this.getTimezoneOffset() % 60), 2, "0");
+    },
+
+    /**
+     * Get the numeric day number of the year, adjusted for leap year.
+     * @return {Number} 0 to 364 (365 in leap years).
+     */
+    getDayOfYear: function() {
+        var num = 0,
+            d = this.clone(),
+            m = this.getMonth(),
+            i;
+
+        for (i = 0, d.setDate(1), d.setMonth(0); i < m; d.setMonth(++i)) {
+            num += d.getDaysInMonth();
+        }
+        return num + this.getDate() - 1;
+    },
+
+    /**
+     * Get the numeric ISO-8601 week number of the year.
+     * (equivalent to the format specifier 'W', but without a leading zero).
+     * @return {Number} 1 to 53
+     */
+    getWeekOfYear : function() {
+        // adapted from http://www.merlyn.demon.co.uk/weekcalc.htm
+        var ms1d = 864e5, // milliseconds in a day
+            ms7d = 7 * ms1d; // milliseconds in a week
+
+        return function() { // return a closure so constants get calculated only once
+            var DC3 = Date.UTC(this.getFullYear(), this.getMonth(), this.getDate() + 3) / ms1d, // an Absolute Day Number
+                AWN = Math.floor(DC3 / 7), // an Absolute Week Number
+                Wyr = new Date(AWN * ms7d).getUTCFullYear();
+
+            return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1;
+        };
+    }(),
+
+    /**
+     * Checks if the current date falls within a leap year.
+     * @return {Boolean} True if the current date falls within a leap year, false otherwise.
+     */
+    isLeapYear : function() {
+        var year = this.getFullYear();
+        return !!((year & 3) == 0 && (year % 100 || (year % 400 == 0 && year)));
+    },
+
+    /**
+     * Get the first day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getFirstDayOfMonth()]); //output: 'Monday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getFirstDayOfMonth : function() {
+        var day = (this.getDay() - (this.getDate() - 1)) % 7;
+        return (day < 0) ? (day + 7) : day;
+    },
+
+    /**
+     * Get the last day of the current month, adjusted for leap year.  The returned value
+     * is the numeric day index within the week (0-6) which can be used in conjunction with
+     * the {@link #monthNames} array to retrieve the textual day name.
+     * Example:
+     * <pre><code>
+var dt = new Date('1/10/2007');
+document.write(Date.dayNames[dt.getLastDayOfMonth()]); //output: 'Wednesday'
+</code></pre>
+     * @return {Number} The day number (0-6).
+     */
+    getLastDayOfMonth : function() {
+        return this.getLastDateOfMonth().getDay();
+    },
+
+
+    /**
+     * Get the date of the first day of the month in which this date resides.
+     * @return {Date}
+     */
+    getFirstDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), 1);
+    },
+
+    /**
+     * Get the date of the last day of the month in which this date resides.
+     * @return {Date}
+     */
+    getLastDateOfMonth : function() {
+        return new Date(this.getFullYear(), this.getMonth(), this.getDaysInMonth());
+    },
+
+    /**
+     * Get the number of days in the current month, adjusted for leap year.
+     * @return {Number} The number of days in the month.
+     */
+    getDaysInMonth: function() {
+        var daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+
+        return function() { // return a closure for efficiency
+            var m = this.getMonth();
+
+            return m == 1 && this.isLeapYear() ? 29 : daysInMonth[m];
+        };
+    }(),
+
+    /**
+     * Get the English ordinal suffix of the current day (equivalent to the format specifier 'S').
+     * @return {String} 'st, 'nd', 'rd' or 'th'.
+     */
+    getSuffix : function() {
+        switch (this.getDate()) {
+            case 1:
+            case 21:
+            case 31:
+                return "st";
+            case 2:
+            case 22:
+                return "nd";
+            case 3:
+            case 23:
+                return "rd";
+            default:
+                return "th";
+        }
+    },
+
+    /**
+     * Creates and returns a new Date instance with the exact same date value as the called instance.
+     * Dates are copied and passed by reference, so if a copied date variable is modified later, the original
+     * variable will also be changed.  When the intention is to create a new variable that will not
+     * modify the original instance, you should create a clone.
+     *
+     * Example of correctly cloning a date:
+     * <pre><code>
+//wrong way:
+var orig = new Date('10/1/2006');
+var copy = orig;
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 05 2006'!
+
+//correct way:
+var orig = new Date('10/1/2006');
+var copy = orig.clone();
+copy.setDate(5);
+document.write(orig);  //returns 'Thu Oct 01 2006'
+</code></pre>
+     * @return {Date} The new Date instance.
+     */
+    clone : function() {
+        return new Date(this.getTime());
+    },
+
+    /**
+     * Checks if the current date is affected by Daylight Saving Time (DST).
+     * @return {Boolean} True if the current date is affected by DST.
+     */
+    isDST : function() {
+        // adapted from http://extjs.com/forum/showthread.php?p=247172#post247172
+        // courtesy of @geoffrey.mcgill
+        return new Date(this.getFullYear(), 0, 1).getTimezoneOffset() != this.getTimezoneOffset();
+    },
+
+    /**
+     * Attempts to clear all time information from this Date by setting the time to midnight of the same day,
+     * automatically adjusting for Daylight Saving Time (DST) where applicable.
+     * (note: DST timezone information for the browser's host operating system is assumed to be up-to-date)
+     * @param {Boolean} clone true to create a clone of this date, clear the time and return it (defaults to false).
+     * @return {Date} this or the clone.
+     */
+    clearTime : function(clone) {
+        if (clone) {
+            return this.clone().clearTime();
+        }
+
+        // get current date before clearing time
+        var d = this.getDate();
+
+        // clear time
+        this.setHours(0);
+        this.setMinutes(0);
+        this.setSeconds(0);
+        this.setMilliseconds(0);
+
+        if (this.getDate() != d) { // account for DST (i.e. day of month changed when setting hour = 0)
+            // note: DST adjustments are assumed to occur in multiples of 1 hour (this is almost always the case)
+            // refer to http://www.timeanddate.com/time/aboutdst.html for the (rare) exceptions to this rule
+
+            // increment hour until cloned date == current date
+            for (var hr = 1, c = this.add(Date.HOUR, hr); c.getDate() != d; hr++, c = this.add(Date.HOUR, hr));
+
+            this.setDate(d);
+            this.setHours(c.getHours());
+        }
+
+        return this;
+    },
+
+    /**
+     * Provides a convenient method for performing basic date arithmetic. This method
+     * does not modify the Date instance being called - it creates and returns
+     * a new Date instance containing the resulting date value.
+     *
+     * Examples:
+     * <pre><code>
+// Basic usage:
+var dt = new Date('10/29/2006').add(Date.DAY, 5);
+document.write(dt); //returns 'Fri Nov 03 2006 00:00:00'
+
+// Negative values will be subtracted:
+var dt2 = new Date('10/1/2006').add(Date.DAY, -5);
+document.write(dt2); //returns 'Tue Sep 26 2006 00:00:00'
+
+// You can even chain several calls together in one line:
+var dt3 = new Date('10/1/2006').add(Date.DAY, 5).add(Date.HOUR, 8).add(Date.MINUTE, -30);
+document.write(dt3); //returns 'Fri Oct 06 2006 07:30:00'
+</code></pre>
+     *
+     * @param {String} interval A valid date interval enum value.
+     * @param {Number} value The amount to add to the current date.
+     * @return {Date} The new Date instance.
+     */
+    add : function(interval, value) {
+        var d = this.clone();
+        if (!interval || value === 0) return d;
+
+        switch(interval.toLowerCase()) {
+            case Date.MILLI:
+                d.setMilliseconds(this.getMilliseconds() + value);
+                break;
+            case Date.SECOND:
+                d.setSeconds(this.getSeconds() + value);
+                break;
+            case Date.MINUTE:
+                d.setMinutes(this.getMinutes() + value);
+                break;
+            case Date.HOUR:
+                d.setHours(this.getHours() + value);
+                break;
+            case Date.DAY:
+                d.setDate(this.getDate() + value);
+                break;
+            case Date.MONTH:
+                var day = this.getDate();
+                if (day > 28) {
+                    day = Math.min(day, this.getFirstDateOfMonth().add('mo', value).getLastDateOfMonth().getDate());
+                }
+                d.setDate(day);
+                d.setMonth(this.getMonth() + value);
+                break;
+            case Date.YEAR:
+                d.setFullYear(this.getFullYear() + value);
+                break;
+        }
+        return d;
+    },
+
+    /**
+     * Checks if this date falls on or between the given start and end dates.
+     * @param {Date} start Start date
+     * @param {Date} end End date
+     * @return {Boolean} true if this date falls on or between the given start and end dates.
+     */
+    between : function(start, end) {
+        var t = this.getTime();
+        return start.getTime() <= t && t <= end.getTime();
+    }
+});
+
+
+/**
+ * Formats a date given the supplied format string.
+ * @param {String} format The format string.
+ * @return {String} The formatted date.
+ * @method format
+ */
+Date.prototype.format = Date.prototype.dateFormat;
+
+
+// private
+if (Ext.isSafari && (navigator.userAgent.match(/WebKit\/(\d+)/)[1] || NaN) < 420) {
+    Ext.apply(Date.prototype, {
+        _xMonth : Date.prototype.setMonth,
+        _xDate  : Date.prototype.setDate,
+
+        // Bug in Safari 1.3, 2.0 (WebKit build < 420)
+        // Date.setMonth does not work consistently if iMonth is not 0-11
+        setMonth : function(num) {
+            if (num <= -1) {
+                var n = Math.ceil(-num),
+                    back_year = Math.ceil(n / 12),
+                    month = (n % 12) ? 12 - n % 12 : 0;
+
+                this.setFullYear(this.getFullYear() - back_year);
+
+                return this._xMonth(month);
+            } else {
+                return this._xMonth(num);
+            }
+        },
+
+        // Bug in setDate() method (resolved in WebKit build 419.3, so to be safe we target Webkit builds < 420)
+        // The parameter for Date.setDate() is converted to a signed byte integer in Safari
+        // http://brianary.blogspot.com/2006/03/safari-date-bug.html
+        setDate : function(d) {
+            // use setTime() to workaround setDate() bug
+            // subtract current day of month in milliseconds, then add desired day of month in milliseconds
+            return this.setTime(this.getTime() - (this.getDate() - d) * 864e5);
+        }
+    });
+}
+
+
+
+/* Some basic Date tests... (requires Firebug)
+
+Date.parseDate('', 'c'); // call Date.parseDate() once to force computation of regex string so we can console.log() it
+console.log('Insane Regex for "c" format: %o', Date.parseCodes.c.s); // view the insane regex for the "c" format specifier
+
+// standard tests
+console.group('Standard Date.parseDate() Tests');
+    console.log('Date.parseDate("2009-01-05T11:38:56", "c")               = %o', Date.parseDate("2009-01-05T11:38:56", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-02-04T12:37:55.001000", "c")        = %o', Date.parseDate("2009-02-04T12:37:55.001000", "c")); // assumes browser's timezone setting
+    console.log('Date.parseDate("2009-03-03T13:36:54,101000Z", "c")       = %o', Date.parseDate("2009-03-03T13:36:54,101000Z", "c")); // UTC
+    console.log('Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")   = %o', Date.parseDate("2009-04-02T14:35:53.901000-0530", "c")); // GMT-0530
+    console.log('Date.parseDate("2009-05-01T15:34:52,9876000+08:00", "c") = %o', Date.parseDate("2009-05-01T15:34:52,987600+08:00", "c")); // GMT+08:00
+console.groupEnd();
+
+// ISO-8601 format as specified in http://www.w3.org/TR/NOTE-datetime
+// -- accepts ALL 6 levels of date-time granularity
+console.group('ISO-8601 Granularity Test (see http://www.w3.org/TR/NOTE-datetime)');
+    console.log('Date.parseDate("1997", "c")                              = %o', Date.parseDate("1997", "c")); // YYYY (e.g. 1997)
+    console.log('Date.parseDate("1997-07", "c")                           = %o', Date.parseDate("1997-07", "c")); // YYYY-MM (e.g. 1997-07)
+    console.log('Date.parseDate("1997-07-16", "c")                        = %o', Date.parseDate("1997-07-16", "c")); // YYYY-MM-DD (e.g. 1997-07-16)
+    console.log('Date.parseDate("1997-07-16T19:20+01:00", "c")            = %o', Date.parseDate("1997-07-16T19:20+01:00", "c")); // YYYY-MM-DDThh:mmTZD (e.g. 1997-07-16T19:20+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30+01:00", "c")         = %o', Date.parseDate("1997-07-16T19:20:30+01:00", "c")); // YYYY-MM-DDThh:mm:ssTZD (e.g. 1997-07-16T19:20:30+01:00)
+    console.log('Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16T19:20:30.45+01:00", "c")); // YYYY-MM-DDThh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")      = %o', Date.parseDate("1997-07-16 19:20:30.45+01:00", "c")); // YYYY-MM-DD hh:mm:ss.sTZD (e.g. 1997-07-16T19:20:30.45+01:00)
+    console.log('Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)= %o', Date.parseDate("1997-13-16T19:20:30.45+01:00", "c", true)); // strict date parsing with invalid month value
+console.groupEnd();
+
+*/
+/**
+ * @class Ext.util.MixedCollection
+ * @extends Ext.util.Observable
+ * A Collection class that maintains both numeric indexes and keys and exposes events.
+ * @constructor
+ * @param {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+ * function should add function references to the collection. Defaults to
+ * <tt>false</tt>.
+ * @param {Function} keyFn A function that can accept an item of the type(s) stored in this MixedCollection
+ * and return the key value for that item.  This is used when available to look up the key on items that
+ * were passed without an explicit key parameter to a MixedCollection method.  Passing this parameter is
+ * equivalent to providing an implementation for the {@link #getKey} method.
+ */
+Ext.util.MixedCollection = function(allowFunctions, keyFn){
+    this.items = [];
+    this.map = {};
+    this.keys = [];
+    this.length = 0;
+    this.addEvents(
+        /**
+         * @event clear
+         * Fires when the collection is cleared.
+         */
+        'clear',
+        /**
+         * @event add
+         * Fires when an item is added to the collection.
+         * @param {Number} index The index at which the item was added.
+         * @param {Object} o The item added.
+         * @param {String} key The key associated with the added item.
+         */
+        'add',
+        /**
+         * @event replace
+         * Fires when an item is replaced in the collection.
+         * @param {String} key he key associated with the new added.
+         * @param {Object} old The item being replaced.
+         * @param {Object} new The new item.
+         */
+        'replace',
+        /**
+         * @event remove
+         * Fires when an item is removed from the collection.
+         * @param {Object} o The item being removed.
+         * @param {String} key (optional) The key associated with the removed item.
+         */
+        'remove',
+        'sort'
+    );
+    this.allowFunctions = allowFunctions === true;
+    if(keyFn){
+        this.getKey = keyFn;
+    }
+    Ext.util.MixedCollection.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
+
+    /**
+     * @cfg {Boolean} allowFunctions Specify <tt>true</tt> if the {@link #addAll}
+     * function should add function references to the collection. Defaults to
+     * <tt>false</tt>.
+     */
+    allowFunctions : false,
+
+    /**
+     * Adds an item to the collection. Fires the {@link #add} event when complete.
+     * @param {String} key <p>The key to associate with the item, or the new item.</p>
+     * <p>If a {@link #getKey} implementation was specified for this MixedCollection,
+     * or if the key of the stored items is in a property called <tt><b>id</b></tt>,
+     * the MixedCollection will be able to <i>derive</i> the key for the new item.
+     * In this case just pass the new item in this parameter.</p>
+     * @param {Object} o The item to add.
+     * @return {Object} The item added.
+     */
+    add : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        if(typeof key != 'undefined' && key !== null){
+            var old = this.map[key];
+            if(typeof old != 'undefined'){
+                return this.replace(key, o);
+            }
+            this.map[key] = o;
+        }
+        this.length++;
+        this.items.push(o);
+        this.keys.push(key);
+        this.fireEvent('add', this.length-1, o, key);
+        return o;
+    },
+
+    /**
+      * MixedCollection has a generic way to fetch keys if you implement getKey.  The default implementation
+      * simply returns <b><code>item.id</code></b> but you can provide your own implementation
+      * to return a different value as in the following examples:<pre><code>
+// normal way
+var mc = new Ext.util.MixedCollection();
+mc.add(someEl.dom.id, someEl);
+mc.add(otherEl.dom.id, otherEl);
+//and so on
+
+// using getKey
+var mc = new Ext.util.MixedCollection();
+mc.getKey = function(el){
+   return el.dom.id;
+};
+mc.add(someEl);
+mc.add(otherEl);
+
+// or via the constructor
+var mc = new Ext.util.MixedCollection(false, function(el){
+   return el.dom.id;
+});
+mc.add(someEl);
+mc.add(otherEl);
+     * </code></pre>
+     * @param {Object} item The item for which to find the key.
+     * @return {Object} The key for the passed item.
+     */
+    getKey : function(o){
+         return o.id;
+    },
+
+    /**
+     * Replaces an item in the collection. Fires the {@link #replace} event when complete.
+     * @param {String} key <p>The key associated with the item to replace, or the replacement item.</p>
+     * <p>If you supplied a {@link #getKey} implementation for this MixedCollection, or if the key
+     * of your stored items is in a property called <tt><b>id</b></tt>, then the MixedCollection
+     * will be able to <i>derive</i> the key of the replacement item. If you want to replace an item
+     * with one having the same key value, then just pass the replacement item in this parameter.</p>
+     * @param o {Object} o (optional) If the first parameter passed was a key, the item to associate
+     * with that key.
+     * @return {Object}  The new item.
+     */
+    replace : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        var old = this.map[key];
+        if(typeof key == 'undefined' || key === null || typeof old == 'undefined'){
+             return this.add(key, o);
+        }
+        var index = this.indexOfKey(key);
+        this.items[index] = o;
+        this.map[key] = o;
+        this.fireEvent('replace', key, old, o);
+        return o;
+    },
+
+    /**
+     * Adds all elements of an Array or an Object to the collection.
+     * @param {Object/Array} objs An Object containing properties which will be added
+     * to the collection, or an Array of values, each of which are added to the collection.
+     * Functions references will be added to the collection if <code>{@link #allowFunctions}</code>
+     * has been set to <tt>true</tt>.
+     */
+    addAll : function(objs){
+        if(arguments.length > 1 || Ext.isArray(objs)){
+            var args = arguments.length > 1 ? arguments : objs;
+            for(var i = 0, len = args.length; i < len; i++){
+                this.add(args[i]);
+            }
+        }else{
+            for(var key in objs){
+                if(this.allowFunctions || typeof objs[key] != 'function'){
+                    this.add(key, objs[key]);
+                }
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every item in the collection, passing the following arguments:
+     * <div class="mdetail-params"><ul>
+     * <li><b>item</b> : Mixed<p class="sub-desc">The collection item</p></li>
+     * <li><b>index</b> : Number<p class="sub-desc">The item's index</p></li>
+     * <li><b>length</b> : Number<p class="sub-desc">The total number of items in the collection</p></li>
+     * </ul></div>
+     * The function should return a boolean value. Returning false from the function will stop the iteration.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current item in the iteration.
+     */
+    each : function(fn, scope){
+        var items = [].concat(this.items); // each safe for removal
+        for(var i = 0, len = items.length; i < len; i++){
+            if(fn.call(scope || items[i], items[i], i, len) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Executes the specified function once for every key in the collection, passing each
+     * key, and its associated item as the first two parameters.
+     * @param {Function} fn The function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    eachKey : function(fn, scope){
+        for(var i = 0, len = this.keys.length; i < len; i++){
+            fn.call(scope || window, this.keys[i], this.items[i], i, len);
+        }
+    },
+
+    /**
+     * Returns the first item in the collection which elicits a true return value from the
+     * passed selection function.
+     * @param {Function} fn The selection function to execute for each item.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     * @return {Object} The first item in the collection which returned true from the selection function.
+     */
+    find : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            if(fn.call(scope || window, this.items[i], this.keys[i])){
+                return this.items[i];
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Inserts an item at the specified index in the collection. Fires the {@link #add} event when complete.
+     * @param {Number} index The index to insert the item at.
+     * @param {String} key The key to associate with the new item, or the item itself.
+     * @param {Object} o (optional) If the second parameter was a key, the new item.
+     * @return {Object} The item inserted.
+     */
+    insert : function(index, key, o){
+        if(arguments.length == 2){
+            o = arguments[1];
+            key = this.getKey(o);
+        }
+        if(this.containsKey(key)){
+            this.suspendEvents();
+            this.removeKey(key);
+            this.resumeEvents();
+        }
+        if(index >= this.length){
+            return this.add(key, o);
+        }
+        this.length++;
+        this.items.splice(index, 0, o);
+        if(typeof key != 'undefined' && key !== null){
+            this.map[key] = o;
+        }
+        this.keys.splice(index, 0, key);
+        this.fireEvent('add', index, o, key);
+        return o;
+    },
+
+    /**
+     * Remove an item from the collection.
+     * @param {Object} o The item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    remove : function(o){
+        return this.removeAt(this.indexOf(o));
+    },
+
+    /**
+     * Remove an item from a specified index in the collection. Fires the {@link #remove} event when complete.
+     * @param {Number} index The index within the collection of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeAt : function(index){
+        if(index < this.length && index >= 0){
+            this.length--;
+            var o = this.items[index];
+            this.items.splice(index, 1);
+            var key = this.keys[index];
+            if(typeof key != 'undefined'){
+                delete this.map[key];
+            }
+            this.keys.splice(index, 1);
+            this.fireEvent('remove', o, key);
+            return o;
+        }
+        return false;
+    },
+
+    /**
+     * Removed an item associated with the passed key fom the collection.
+     * @param {String} key The key of the item to remove.
+     * @return {Object} The item removed or false if no item was removed.
+     */
+    removeKey : function(key){
+        return this.removeAt(this.indexOfKey(key));
+    },
+
+    /**
+     * Returns the number of items in the collection.
+     * @return {Number} the number of items in the collection.
+     */
+    getCount : function(){
+        return this.length;
+    },
+
+    /**
+     * Returns index within the collection of the passed Object.
+     * @param {Object} o The item to find the index of.
+     * @return {Number} index of the item. Returns -1 if not found.
+     */
+    indexOf : function(o){
+        return this.items.indexOf(o);
+    },
+
+    /**
+     * Returns index within the collection of the passed key.
+     * @param {String} key The key to find the index of.
+     * @return {Number} index of the key.
+     */
+    indexOfKey : function(key){
+        return this.keys.indexOf(key);
+    },
+
+    /**
+     * Returns the item associated with the passed key OR index.
+     * Key has priority over index.  This is the equivalent
+     * of calling {@link #key} first, then if nothing matched calling {@link #itemAt}.
+     * @param {String/Number} key The key or index of the item.
+     * @return {Object} If the item is found, returns the item.  If the item was not found, returns <tt>undefined</tt>.
+     * If an item was found, but is a Class, returns <tt>null</tt>.
+     */
+    item : function(key){
+        var mk = this.map[key],
+            item = mk !== undefined ? mk : (typeof key == 'number') ? this.items[key] : undefined;
+        return typeof item != 'function' || this.allowFunctions ? item : null; // for prototype!
+    },
+
+    /**
+     * Returns the item at the specified index.
+     * @param {Number} index The index of the item.
+     * @return {Object} The item at the specified index.
+     */
+    itemAt : function(index){
+        return this.items[index];
+    },
+
+    /**
+     * Returns the item associated with the passed key.
+     * @param {String/Number} key The key of the item.
+     * @return {Object} The item associated with the passed key.
+     */
+    key : function(key){
+        return this.map[key];
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as an item.
+     * @param {Object} o  The Object to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as an item.
+     */
+    contains : function(o){
+        return this.indexOf(o) != -1;
+    },
+
+    /**
+     * Returns true if the collection contains the passed Object as a key.
+     * @param {String} key The key to look for in the collection.
+     * @return {Boolean} True if the collection contains the Object as a key.
+     */
+    containsKey : function(key){
+        return typeof this.map[key] != 'undefined';
+    },
+
+    /**
+     * Removes all items from the collection.  Fires the {@link #clear} event when complete.
+     */
+    clear : function(){
+        this.length = 0;
+        this.items = [];
+        this.keys = [];
+        this.map = {};
+        this.fireEvent('clear');
+    },
+
+    /**
+     * Returns the first item in the collection.
+     * @return {Object} the first item in the collection..
+     */
+    first : function(){
+        return this.items[0];
+    },
+
+    /**
+     * Returns the last item in the collection.
+     * @return {Object} the last item in the collection..
+     */
+    last : function(){
+        return this.items[this.length-1];
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting based on a direction and a sorting function. Internally,
+     * this creates a temporary array of all items in the MixedCollection, sorts it and then writes
+     * the sorted array data back into this.items and this.keys
+     * @param {String} property Property to sort by ('key', 'value', or 'index')
+     * @param {String} dir (optional) Direction to sort 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    _sort : function(property, dir, fn){
+        var i, len,
+            dsc   = String(dir).toUpperCase() == 'DESC' ? -1 : 1,
+
+            //this is a temporary array used to apply the sorting function
+            c     = [],
+            keys  = this.keys,
+            items = this.items;
+
+        //default to a simple sorter function if one is not provided
+        fn = fn || function(a, b) {
+            return a - b;
+        };
+
+        //copy all the items into a temporary array, which we will sort
+        for(i = 0, len = items.length; i < len; i++){
+            c[c.length] = {
+                key  : keys[i],
+                value: items[i],
+                index: i
+            };
+        }
+
+        //sort the temporary array
+        c.sort(function(a, b){
+            var v = fn(a[property], b[property]) * dsc;
+            if(v === 0){
+                v = (a.index < b.index ? -1 : 1);
+            }
+            return v;
+        });
+
+        //copy the temporary array back into the main this.items and this.keys objects
+        for(i = 0, len = c.length; i < len; i++){
+            items[i] = c[i].value;
+            keys[i]  = c[i].key;
+        }
+
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>item</b> value with the passed comparison function.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by numeric value.
+     */
+    sort : function(dir, fn){
+        this._sort('value', dir, fn);
+    },
+
+    /**
+     * Reorders each of the items based on a mapping from old index to new index. Internally this
+     * just translates into a sort. The 'sort' event is fired whenever reordering has occured.
+     * @param {Object} mapping Mapping from old item index to new item index
+     */
+    reorder: function(mapping) {
+        this.suspendEvents();
+
+        var items = this.items,
+            index = 0,
+            length = items.length,
+            order = [],
+            remaining = [],
+            oldIndex;
+
+        //object of {oldPosition: newPosition} reversed to {newPosition: oldPosition}
+        for (oldIndex in mapping) {
+            order[mapping[oldIndex]] = items[oldIndex];
+        }
+
+        for (index = 0; index < length; index++) {
+            if (mapping[index] == undefined) {
+                remaining.push(items[index]);
+            }
+        }
+
+        for (index = 0; index < length; index++) {
+            if (order[index] == undefined) {
+                order[index] = remaining.shift();
+            }
+        }
+
+        this.clear();
+        this.addAll(order);
+
+        this.resumeEvents();
+        this.fireEvent('sort', this);
+    },
+
+    /**
+     * Sorts this collection by <b>key</b>s.
+     * @param {String} direction (optional) 'ASC' or 'DESC'. Defaults to 'ASC'.
+     * @param {Function} fn (optional) Comparison function that defines the sort order.
+     * Defaults to sorting by case insensitive string.
+     */
+    keySort : function(dir, fn){
+        this._sort('key', dir, fn || function(a, b){
+            var v1 = String(a).toUpperCase(), v2 = String(b).toUpperCase();
+            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
+        });
+    },
+
+    /**
+     * Returns a range of items in this collection
+     * @param {Number} startIndex (optional) The starting index. Defaults to 0.
+     * @param {Number} endIndex (optional) The ending index. Defaults to the last item.
+     * @return {Array} An array of items
+     */
+    getRange : function(start, end){
+        var items = this.items;
+        if(items.length < 1){
+            return [];
+        }
+        start = start || 0;
+        end = Math.min(typeof end == 'undefined' ? this.length-1 : end, this.length-1);
+        var i, r = [];
+        if(start <= end){
+            for(i = start; i <= end; i++) {
+                r[r.length] = items[i];
+            }
+        }else{
+            for(i = start; i >= end; i--) {
+                r[r.length] = items[i];
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Filter the <i>objects</i> in this collection by a specific property.
+     * Returns a new collection that has been filtered.
+     * @param {String} property A property on your objects
+     * @param {String/RegExp} value Either string that the property values
+     * should start with or a RegExp to test against the property
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison (defaults to False).
+     * @return {MixedCollection} The new filtered collection
+     */
+    filter : function(property, value, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return this.clone();
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.filterBy(function(o){
+            return o && value.test(o[property]);
+        });
+    },
+
+    /**
+     * Filter by a function. Returns a <i>new</i> collection that has been filtered.
+     * The passed function will be called with each object in the collection.
+     * If the function returns true, the value is included otherwise it is filtered.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key)
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @return {MixedCollection} The new filtered collection
+     */
+    filterBy : function(fn, scope){
+        var r = new Ext.util.MixedCollection();
+        r.getKey = this.getKey;
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                r.add(k[i], it[i]);
+            }
+        }
+        return r;
+    },
+
+    /**
+     * Finds the index of the first matching object in this collection by a specific property/value.
+     * @param {String} property The name of a property on your objects.
+     * @param {String/RegExp} value A string that the property values
+     * should start with or a RegExp to test against the property.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning.
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison.
+     * @return {Number} The matched index or -1
+     */
+    findIndex : function(property, value, start, anyMatch, caseSensitive){
+        if(Ext.isEmpty(value, false)){
+            return -1;
+        }
+        value = this.createValueMatcher(value, anyMatch, caseSensitive);
+        return this.findIndexBy(function(o){
+            return o && value.test(o[property]);
+        }, null, start);
+    },
+
+    /**
+     * Find the index of the first matching object in this collection by a function.
+     * If the function returns <i>true</i> it is considered a match.
+     * @param {Function} fn The function to be called, it will receive the args o (the object), k (the key).
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this MixedCollection.
+     * @param {Number} start (optional) The index to start searching at (defaults to 0).
+     * @return {Number} The matched index or -1
+     */
+    findIndexBy : function(fn, scope, start){
+        var k = this.keys, it = this.items;
+        for(var i = (start||0), len = it.length; i < len; i++){
+            if(fn.call(scope||this, it[i], k[i])){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns a regular expression based on the given value and matching options. This is used internally for finding and filtering,
+     * and by Ext.data.Store#filter
+     * @private
+     * @param {String} value The value to create the regex for. This is escaped using Ext.escapeRe
+     * @param {Boolean} anyMatch True to allow any match - no regex start/end line anchors will be added. Defaults to false
+     * @param {Boolean} caseSensitive True to make the regex case sensitive (adds 'i' switch to regex). Defaults to false.
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createValueMatcher : function(value, anyMatch, caseSensitive, exactMatch) {
+        if (!value.exec) { // not a regex
+            var er = Ext.escapeRe;
+            value = String(value);
+
+            if (anyMatch === true) {
+                value = er(value);
+            } else {
+                value = '^' + er(value);
+                if (exactMatch === true) {
+                    value += '$';
+                }
+            }
+            value = new RegExp(value, caseSensitive ? '' : 'i');
+         }
+         return value;
+    },
+
+    /**
+     * Creates a shallow copy of this collection
+     * @return {MixedCollection}
+     */
+    clone : function(){
+        var r = new Ext.util.MixedCollection();
+        var k = this.keys, it = this.items;
+        for(var i = 0, len = it.length; i < len; i++){
+            r.add(k[i], it[i]);
+        }
+        r.getKey = this.getKey;
+        return r;
+    }
+});
+/**
+ * This method calls {@link #item item()}.
+ * Returns the item associated with the passed key OR index. Key has priority
+ * over index.  This is the equivalent of calling {@link #key} first, then if
+ * nothing matched calling {@link #itemAt}.
+ * @param {String/Number} key The key or index of the item.
+ * @return {Object} If the item is found, returns the item.  If the item was
+ * not found, returns <tt>undefined</tt>. If an item was found, but is a Class,
+ * returns <tt>null</tt>.
+ */
+Ext.util.MixedCollection.prototype.get = Ext.util.MixedCollection.prototype.item;
+/**
+ * @class Ext.AbstractManager
+ * @extends Object
+ * Base Manager class - extended by ComponentMgr and PluginMgr
+ */
+Ext.AbstractManager = Ext.extend(Object, {
+    typeName: 'type',
+    
+    constructor: function(config) {
+        Ext.apply(this, config || {});
+        
+        /**
+         * Contains all of the items currently managed
+         * @property all
+         * @type Ext.util.MixedCollection
+         */
+        this.all = new Ext.util.MixedCollection();
+        
+        this.types = {};
+    },
+    
+    /**
+     * Returns a component by {@link Ext.Component#id id}.
+     * For additional details see {@link Ext.util.MixedCollection#get}.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+     * Class was found.
+     */
+    get : function(id){
+        return this.all.get(id);
+    },
+    
+    /**
+     * Registers an item to be managed
+     * @param {Mixed} item The item to register
+     */
+    register: function(item) {
+        this.all.add(item);
+    },
+    
+    /**
+     * Unregisters a component by removing it from this manager
+     * @param {Mixed} item The item to unregister
+     */
+    unregister: function(item) {
+        this.all.remove(item);        
+    },
+    
+    /**
+     * <p>Registers a new Component constructor, keyed by a new
+     * {@link Ext.Component#xtype}.</p>
+     * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+     * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+     * child Components.
+     * see {@link Ext.Container#items}</p>
+     * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+     * @param {Constructor} cls The new Component class.
+     */
+    registerType : function(type, cls){
+        this.types[type] = cls;
+        cls[this.typeName] = type;
+    },
+    
+    /**
+     * Checks if a Component type is registered.
+     * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+     * @return {Boolean} Whether the type is registered.
+     */
+    isRegistered : function(type){
+        return this.types[type] !== undefined;    
+    },
+    
+    /**
+     * Creates and returns an instance of whatever this manager manages, based on the supplied type and config object
+     * @param {Object} config The config object
+     * @param {String} defaultType If no type is discovered in the config object, we fall back to this type
+     * @return {Mixed} The instance of whatever this manager is managing
+     */
+    create: function(config, defaultType) {
+        var type        = config[this.typeName] || config.type || defaultType,
+            Constructor = this.types[type];
+        
+        if (Constructor == undefined) {
+            throw new Error(String.format("The '{0}' type has not been registered with this manager", type));
+        }
+        
+        return new Constructor(config);
+    },
+    
+    /**
+     * Registers a function that will be called when a Component with the specified id is added to the manager. This will happen on instantiation.
+     * @param {String} id The component {@link Ext.Component#id id}
+     * @param {Function} fn The callback function
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+     */
+    onAvailable : function(id, fn, scope){
+        var all = this.all;
+        
+        all.on("add", function(index, o){
+            if (o.id == id) {
+                fn.call(scope || o, o);
+                all.un("add", fn, scope);
+            }
+        });
+    }
+});/**
+ * @class Ext.util.Format
+ * Reusable data formatting functions
+ * @singleton
+ */
+Ext.util.Format = function() {
+    var trimRe         = /^\s+|\s+$/g,
+        stripTagsRE    = /<\/?[^>]+>/gi,
+        stripScriptsRe = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/ig,
+        nl2brRe        = /\r?\n/g;
+
+    return {
+        /**
+         * Truncate a string and add an ellipsis ('...') to the end if it exceeds the specified length
+         * @param {String} value The string to truncate
+         * @param {Number} length The maximum length to allow before truncating
+         * @param {Boolean} word True to try to find a common work break
+         * @return {String} The converted text
+         */
+        ellipsis : function(value, len, word) {
+            if (value && value.length > len) {
+                if (word) {
+                    var vs    = value.substr(0, len - 2),
+                        index = Math.max(vs.lastIndexOf(' '), vs.lastIndexOf('.'), vs.lastIndexOf('!'), vs.lastIndexOf('?'));
+                    if (index == -1 || index < (len - 15)) {
+                        return value.substr(0, len - 3) + "...";
+                    } else {
+                        return vs.substr(0, index) + "...";
+                    }
+                } else {
+                    return value.substr(0, len - 3) + "...";
+                }
+            }
+            return value;
+        },
+
+        /**
+         * Checks a reference and converts it to empty string if it is undefined
+         * @param {Mixed} value Reference to check
+         * @return {Mixed} Empty string if converted, otherwise the original value
+         */
+        undef : function(value) {
+            return value !== undefined ? value : "";
+        },
+
+        /**
+         * Checks a reference and converts it to the default value if it's empty
+         * @param {Mixed} value Reference to check
+         * @param {String} defaultValue The value to insert of it's undefined (defaults to "")
+         * @return {String}
+         */
+        defaultValue : function(value, defaultValue) {
+            return value !== undefined && value !== '' ? value : defaultValue;
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') to their HTML character equivalents for literal display in web pages.
+         * @param {String} value The string to encode
+         * @return {String} The encoded text
+         */
+        htmlEncode : function(value) {
+            return !value ? value : String(value).replace(/&/g, "&amp;").replace(/>/g, "&gt;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
+        },
+
+        /**
+         * Convert certain characters (&, <, >, and ') from their HTML character equivalents.
+         * @param {String} value The string to decode
+         * @return {String} The decoded text
+         */
+        htmlDecode : function(value) {
+            return !value ? value : String(value).replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, '"').replace(/&amp;/g, "&");
+        },
+
+        /**
+         * Trims any whitespace from either side of a string
+         * @param {String} value The text to trim
+         * @return {String} The trimmed text
+         */
+        trim : function(value) {
+            return String(value).replace(trimRe, "");
+        },
+
+        /**
+         * Returns a substring from within an original string
+         * @param {String} value The original text
+         * @param {Number} start The start index of the substring
+         * @param {Number} length The length of the substring
+         * @return {String} The substring
+         */
+        substr : function(value, start, length) {
+            return String(value).substr(start, length);
+        },
+
+        /**
+         * Converts a string to all lower case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        lowercase : function(value) {
+            return String(value).toLowerCase();
+        },
+
+        /**
+         * Converts a string to all upper case letters
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        uppercase : function(value) {
+            return String(value).toUpperCase();
+        },
+
+        /**
+         * Converts the first character only of a string to upper case
+         * @param {String} value The text to convert
+         * @return {String} The converted text
+         */
+        capitalize : function(value) {
+            return !value ? value : value.charAt(0).toUpperCase() + value.substr(1).toLowerCase();
+        },
+
+        // private
+        call : function(value, fn) {
+            if (arguments.length > 2) {
+                var args = Array.prototype.slice.call(arguments, 2);
+                args.unshift(value);
+                return eval(fn).apply(window, args);
+            } else {
+                return eval(fn).call(window, value);
+            }
+        },
+
+        /**
+         * Format a number as US currency
+         * @param {Number/String} value The numeric value to format
+         * @return {String} The formatted currency string
+         */
+        usMoney : function(v) {
+            v = (Math.round((v-0)*100))/100;
+            v = (v == Math.floor(v)) ? v + ".00" : ((v*10 == Math.floor(v*10)) ? v + "0" : v);
+            v = String(v);
+            var ps = v.split('.'),
+                whole = ps[0],
+                sub = ps[1] ? '.'+ ps[1] : '.00',
+                r = /(\d+)(\d{3})/;
+            while (r.test(whole)) {
+                whole = whole.replace(r, '$1' + ',' + '$2');
+            }
+            v = whole + sub;
+            if (v.charAt(0) == '-') {
+                return '-$' + v.substr(1);
+            }
+            return "$" +  v;
+        },
+
+        /**
+         * Parse a value into a formatted date using the specified format pattern.
+         * @param {String/Date} value The value to format (Strings must conform to the format expected by the javascript Date object's <a href="http://www.w3schools.com/jsref/jsref_parse.asp">parse()</a> method)
+         * @param {String} format (optional) Any valid date format string (defaults to 'm/d/Y')
+         * @return {String} The formatted date string
+         */
+        date : function(v, format) {
+            if (!v) {
+                return "";
+            }
+            if (!Ext.isDate(v)) {
+                v = new Date(Date.parse(v));
+            }
+            return v.dateFormat(format || "m/d/Y");
+        },
+
+        /**
+         * Returns a date rendering function that can be reused to apply a date format multiple times efficiently
+         * @param {String} format Any valid date format string
+         * @return {Function} The date formatting function
+         */
+        dateRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.date(v, format);
+            };
+        },
+
+        /**
+         * Strips all HTML tags
+         * @param {Mixed} value The text from which to strip tags
+         * @return {String} The stripped text
+         */
+        stripTags : function(v) {
+            return !v ? v : String(v).replace(stripTagsRE, "");
+        },
+
+        /**
+         * Strips all script tags
+         * @param {Mixed} value The text from which to strip script tags
+         * @return {String} The stripped text
+         */
+        stripScripts : function(v) {
+            return !v ? v : String(v).replace(stripScriptsRe, "");
+        },
+
+        /**
+         * Simple format for a file size (xxx bytes, xxx KB, xxx MB)
+         * @param {Number/String} size The numeric value to format
+         * @return {String} The formatted file size
+         */
+        fileSize : function(size) {
+            if (size < 1024) {
+                return size + " bytes";
+            } else if (size < 1048576) {
+                return (Math.round(((size*10) / 1024))/10) + " KB";
+            } else {
+                return (Math.round(((size*10) / 1048576))/10) + " MB";
+            }
+        },
+
+        /**
+         * It does simple math for use in a template, for example:<pre><code>
+         * var tpl = new Ext.Template('{value} * 10 = {value:math("* 10")}');
+         * </code></pre>
+         * @return {Function} A function that operates on the passed value.
+         */
+        math : function(){
+            var fns = {};
+            
+            return function(v, a){
+                if (!fns[a]) {
+                    fns[a] = new Function('v', 'return v ' + a + ';');
+                }
+                return fns[a](v);
+            };
+        }(),
+
+        /**
+         * Rounds the passed number to the required decimal precision.
+         * @param {Number/String} value The numeric value to round.
+         * @param {Number} precision The number of decimal places to which to round the first parameter's value.
+         * @return {Number} The rounded value.
+         */
+        round : function(value, precision) {
+            var result = Number(value);
+            if (typeof precision == 'number') {
+                precision = Math.pow(10, precision);
+                result = Math.round(value * precision) / precision;
+            }
+            return result;
+        },
+
+        /**
+         * Formats the number according to the format string.
+         * <div style="margin-left:40px">examples (123456.789):
+         * <div style="margin-left:10px">
+         * 0 - (123456) show only digits, no precision<br>
+         * 0.00 - (123456.78) show only digits, 2 precision<br>
+         * 0.0000 - (123456.7890) show only digits, 4 precision<br>
+         * 0,000 - (123,456) show comma and digits, no precision<br>
+         * 0,000.00 - (123,456.78) show comma and digits, 2 precision<br>
+         * 0,0.00 - (123,456.78) shortcut method, show comma and digits, 2 precision<br>
+         * To reverse the grouping (,) and decimal (.) for international numbers, add /i to the end.
+         * For example: 0.000,00/i
+         * </div></div>
+         * @param {Number} v The number to format.
+         * @param {String} format The way you would like to format this text.
+         * @return {String} The formatted number.
+         */
+        number: function(v, format) {
+            if (!format) {
+                return v;
+            }
+            v = Ext.num(v, NaN);
+            if (isNaN(v)) {
+                return '';
+            }
+            var comma = ',',
+                dec   = '.',
+                i18n  = false,
+                neg   = v < 0;
+
+            v = Math.abs(v);
+            if (format.substr(format.length - 2) == '/i') {
+                format = format.substr(0, format.length - 2);
+                i18n   = true;
+                comma  = '.';
+                dec    = ',';
+            }
+
+            var hasComma = format.indexOf(comma) != -1,
+                psplit   = (i18n ? format.replace(/[^\d\,]/g, '') : format.replace(/[^\d\.]/g, '')).split(dec);
+
+            if (1 < psplit.length) {
+                v = v.toFixed(psplit[1].length);
+            } else if(2 < psplit.length) {
+                throw ('NumberFormatException: invalid format, formats should have no more than 1 period: ' + format);
+            } else {
+                v = v.toFixed(0);
+            }
+
+            var fnum = v.toString();
+
+            psplit = fnum.split('.');
+
+            if (hasComma) {
+                var cnum = psplit[0], 
+                    parr = [], 
+                    j    = cnum.length, 
+                    m    = Math.floor(j / 3),
+                    n    = cnum.length % 3 || 3,
+                    i;
+
+                for (i = 0; i < j; i += n) {
+                    if (i != 0) {
+                        n = 3;
+                    }
+                    
+                    parr[parr.length] = cnum.substr(i, n);
+                    m -= 1;
+                }
+                fnum = parr.join(comma);
+                if (psplit[1]) {
+                    fnum += dec + psplit[1];
+                }
+            } else {
+                if (psplit[1]) {
+                    fnum = psplit[0] + dec + psplit[1];
+                }
+            }
+
+            return (neg ? '-' : '') + format.replace(/[\d,?\.?]+/, fnum);
+        },
+
+        /**
+         * Returns a number rendering function that can be reused to apply a number format multiple times efficiently
+         * @param {String} format Any valid number format string for {@link #number}
+         * @return {Function} The number formatting function
+         */
+        numberRenderer : function(format) {
+            return function(v) {
+                return Ext.util.Format.number(v, format);
+            };
+        },
+
+        /**
+         * Selectively do a plural form of a word based on a numeric value. For example, in a template,
+         * {commentCount:plural("Comment")}  would result in "1 Comment" if commentCount was 1 or would be "x Comments"
+         * if the value is 0 or greater than 1.
+         * @param {Number} value The value to compare against
+         * @param {String} singular The singular form of the word
+         * @param {String} plural (optional) The plural form of the word (defaults to the singular with an "s")
+         */
+        plural : function(v, s, p) {
+            return v +' ' + (v == 1 ? s : (p ? p : s+'s'));
+        },
+
+        /**
+         * Converts newline characters to the HTML tag &lt;br/>
+         * @param {String} The string value to format.
+         * @return {String} The string with embedded &lt;br/> tags in place of newlines.
+         */
+        nl2br : function(v) {
+            return Ext.isEmpty(v) ? '' : v.replace(nl2brRe, '<br/>');
+        }
+    };
+}();
+/**
+ * @class Ext.XTemplate
+ * @extends Ext.Template
+ * <p>A template class that supports advanced functionality like:<div class="mdetail-params"><ul>
+ * <li>Autofilling arrays using templates and sub-templates</li>
+ * <li>Conditional processing with basic comparison operators</li>
+ * <li>Basic math function support</li>
+ * <li>Execute arbitrary inline code with special built-in template variables</li>
+ * <li>Custom member functions</li>
+ * <li>Many special tags and built-in operators that aren't defined as part of
+ * the API, but are supported in the templates that can be created</li>
+ * </ul></div></p>
+ * <p>XTemplate provides the templating mechanism built into:<div class="mdetail-params"><ul>
+ * <li>{@link Ext.DataView}</li>
+ * <li>{@link Ext.ListView}</li>
+ * <li>{@link Ext.form.ComboBox}</li>
+ * <li>{@link Ext.grid.TemplateColumn}</li>
+ * <li>{@link Ext.grid.GroupingView}</li>
+ * <li>{@link Ext.menu.Item}</li>
+ * <li>{@link Ext.layout.MenuLayout}</li>
+ * <li>{@link Ext.ColorPalette}</li>
+ * </ul></div></p>
+ *
+ * <p>For example usage {@link #XTemplate see the constructor}.</p>
+ *
+ * @constructor
+ * The {@link Ext.Template#Template Ext.Template constructor} describes
+ * the acceptable parameters to pass to the constructor. The following
+ * examples demonstrate all of the supported features.</p>
+ *
+ * <div class="mdetail-params"><ul>
+ *
+ * <li><b><u>Sample Data</u></b>
+ * <div class="sub-desc">
+ * <p>This is the data object used for reference in each code example:</p>
+ * <pre><code>
+var data = {
+    name: 'Jack Slocum',
+    title: 'Lead Developer',
+    company: 'Ext JS, LLC',
+    email: 'jack@extjs.com',
+    address: '4 Red Bulls Drive',
+    city: 'Cleveland',
+    state: 'Ohio',
+    zip: '44102',
+    drinks: ['Red Bull', 'Coffee', 'Water'],
+    kids: [{
+        name: 'Sara Grace',
+        age:3
+    },{
+        name: 'Zachary',
+        age:2
+    },{
+        name: 'John James',
+        age:0
+    }]
+};
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Auto filling of arrays</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>for</tt></b> operator are used
+ * to process the provided data object:
+ * <ul>
+ * <li>If the value specified in <tt>for</tt> is an array, it will auto-fill,
+ * repeating the template block inside the <tt>tpl</tt> tag for each item in the
+ * array.</li>
+ * <li>If <tt>for="."</tt> is specified, the data object provided is examined.</li>
+ * <li>While processing an array, the special variable <tt>{#}</tt>
+ * will provide the current array index + 1 (starts at 1, not 0).</li>
+ * </ul>
+ * </p>
+ * <pre><code>
+&lt;tpl <b>for</b>=".">...&lt;/tpl>       // loop through array at root node
+&lt;tpl <b>for</b>="foo">...&lt;/tpl>     // loop through array at foo node
+&lt;tpl <b>for</b>="foo.bar">...&lt;/tpl> // loop through array at foo.bar node
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for</b>=".">',       // process the data.kids node
+        '&lt;p>{#}. {name}&lt;/p>',  // use current array index to autonumber
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data.kids); // pass the kids property of the data object
+ * </code></pre>
+ * <p>An example illustrating how the <b><tt>for</tt></b> property can be leveraged
+ * to access specified members of the provided data object to populate the template:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Title: {title}&lt;/p>',
+    '&lt;p>Company: {company}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl <b>for="kids"</b>>',     // interrogate the kids property within the data
+        '&lt;p>{name}&lt;/p>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);  // pass the root node of the data object
+ * </code></pre>
+ * <p>Flat arrays that contain values (and not objects) can be auto-rendered
+ * using the special <b><tt>{.}</tt></b> variable inside a loop.  This variable
+ * will represent the value of the array at the current index:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>{name}\&#39;s favorite beverages:&lt;/p>',
+    '&lt;tpl for="drinks">',
+       '&lt;div> - {.}&lt;/div>',
+    '&lt;/tpl>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * <p>When processing a sub-template, for example while looping through a child array,
+ * you can access the parent object's members via the <b><tt>parent</tt></b> object:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+            '&lt;p>Dad: {<b>parent</b>.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Conditional processing with basic comparison operators</u></b>
+ * <div class="sub-desc">
+ * <p>The <b><tt>tpl</tt></b> tag and the <b><tt>if</tt></b> operator are used
+ * to provide conditional checks for deciding whether or not to render specific
+ * parts of the template. Notes:<div class="sub-desc"><ul>
+ * <li>Double quotes must be encoded if used within the conditional</li>
+ * <li>There is no <tt>else</tt> operator &mdash; if needed, two opposite
+ * <tt>if</tt> statements should be used.</li>
+ * </ul></div>
+ * <pre><code>
+&lt;tpl if="age &gt; 1 &amp;&amp; age &lt; 10">Child&lt;/tpl>
+&lt;tpl if="age >= 10 && age < 18">Teenager&lt;/tpl>
+&lt;tpl <b>if</b>="this.isGirl(name)">...&lt;/tpl>
+&lt;tpl <b>if</b>="id==\'download\'">...&lt;/tpl>
+&lt;tpl <b>if</b>="needsIcon">&lt;img src="{icon}" class="{iconCls}"/>&lt;/tpl>
+// no good:
+&lt;tpl if="name == "Jack"">Hello&lt;/tpl>
+// encode &#34; if it is part of the condition, e.g.
+&lt;tpl if="name == &#38;quot;Jack&#38;quot;">Hello&lt;/tpl>
+ * </code></pre>
+ * Using the sample data above:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age > 1">',
+            '&lt;p>{name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Basic math support</u></b>
+ * <div class="sub-desc">
+ * <p>The following basic math operators may be applied directly on numeric
+ * data values:</p><pre>
+ * + - * /
+ * </pre>
+ * For example:
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="age &amp;gt; 1">',  // <-- Note that the &gt; is encoded
+            '&lt;p>{#}: {name}&lt;/p>',  // <-- Auto-number each item
+            '&lt;p>In 5 Years: {age+5}&lt;/p>',  // <-- Basic math
+            '&lt;p>Dad: {parent.name}&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+</code></pre>
+ * </div>
+ * </li>
+ *
+ *
+ * <li><b><u>Execute arbitrary inline code with special built-in template variables</u></b>
+ * <div class="sub-desc">
+ * <p>Anything between <code>{[ ... ]}</code> is considered code to be executed
+ * in the scope of the template. There are some special variables available in that code:
+ * <ul>
+ * <li><b><tt>values</tt></b>: The values in the current scope. If you are using
+ * scope changing sub-templates, you can change what <tt>values</tt> is.</li>
+ * <li><b><tt>parent</tt></b>: The scope (values) of the ancestor template.</li>
+ * <li><b><tt>xindex</tt></b>: If you are in a looping template, the index of the
+ * loop you are in (1-based).</li>
+ * <li><b><tt>xcount</tt></b>: If you are in a looping template, the total length
+ * of the array you are looping.</li>
+ * <li><b><tt>fm</tt></b>: An alias for <tt>Ext.util.Format</tt>.</li>
+ * </ul>
+ * This example demonstrates basic row striping using an inline code block and the
+ * <tt>xindex</tt> variable:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Company: {[values.company.toUpperCase() + ", " + values.title]}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+       '&lt;div class="{[xindex % 2 === 0 ? "even" : "odd"]}">',
+        '{name}',
+        '&lt;/div>',
+    '&lt;/tpl>&lt;/p>'
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * <li><b><u>Template member functions</u></b>
+ * <div class="sub-desc">
+ * <p>One or more member functions can be specified in a configuration
+ * object passed into the XTemplate constructor for more complex processing:</p>
+ * <pre><code>
+var tpl = new Ext.XTemplate(
+    '&lt;p>Name: {name}&lt;/p>',
+    '&lt;p>Kids: ',
+    '&lt;tpl for="kids">',
+        '&lt;tpl if="this.isGirl(name)">',
+            '&lt;p>Girl: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        // use opposite if statement to simulate 'else' processing:
+        '&lt;tpl if="this.isGirl(name) == false">',
+            '&lt;p>Boy: {name} - {age}&lt;/p>',
+        '&lt;/tpl>',
+        '&lt;tpl if="this.isBaby(age)">',
+            '&lt;p>{name} is a baby!&lt;/p>',
+        '&lt;/tpl>',
+    '&lt;/tpl>&lt;/p>',
+    {
+        // XTemplate configuration:
+        compiled: true,
+        disableFormats: true,
+        // member functions:
+        isGirl: function(name){
+            return name == 'Sara Grace';
+        },
+        isBaby: function(age){
+            return age < 1;
+        }
+    }
+);
+tpl.overwrite(panel.body, data);
+ * </code></pre>
+ * </div>
+ * </li>
+ *
+ * </ul></div>
+ *
+ * @param {Mixed} config
+ */
+Ext.XTemplate = function(){
+    Ext.XTemplate.superclass.constructor.apply(this, arguments);
+
+    var me = this,
+        s = me.html,
+        re = /<tpl\b[^>]*>((?:(?=([^<]+))\2|<(?!tpl\b[^>]*>))*?)<\/tpl>/,
+        nameRe = /^<tpl\b[^>]*?for="(.*?)"/,
+        ifRe = /^<tpl\b[^>]*?if="(.*?)"/,
+        execRe = /^<tpl\b[^>]*?exec="(.*?)"/,
+        m,
+        id = 0,
+        tpls = [],
+        VALUES = 'values',
+        PARENT = 'parent',
+        XINDEX = 'xindex',
+        XCOUNT = 'xcount',
+        RETURN = 'return ',
+        WITHVALUES = 'with(values){ ';
+
+    s = ['<tpl>', s, '</tpl>'].join('');
+
+    while((m = s.match(re))){
+        var m2 = m[0].match(nameRe),
+            m3 = m[0].match(ifRe),
+            m4 = m[0].match(execRe),
+            exp = null,
+            fn = null,
+            exec = null,
+            name = m2 && m2[1] ? m2[1] : '';
+
+       if (m3) {
+           exp = m3 && m3[1] ? m3[1] : null;
+           if(exp){
+               fn = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES + RETURN +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if (m4) {
+           exp = m4 && m4[1] ? m4[1] : null;
+           if(exp){
+               exec = new Function(VALUES, PARENT, XINDEX, XCOUNT, WITHVALUES +(Ext.util.Format.htmlDecode(exp))+'; }');
+           }
+       }
+       if(name){
+           switch(name){
+               case '.': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + VALUES + '; }'); break;
+               case '..': name = new Function(VALUES, PARENT, WITHVALUES + RETURN + PARENT + '; }'); break;
+               default: name = new Function(VALUES, PARENT, WITHVALUES + RETURN + name + '; }');
+           }
+       }
+       tpls.push({
+            id: id,
+            target: name,
+            exec: exec,
+            test: fn,
+            body: m[1]||''
+        });
+       s = s.replace(m[0], '{xtpl'+ id + '}');
+       ++id;
+    }
+    for(var i = tpls.length-1; i >= 0; --i){
+        me.compileTpl(tpls[i]);
+    }
+    me.master = tpls[tpls.length-1];
+    me.tpls = tpls;
+};
+Ext.extend(Ext.XTemplate, Ext.Template, {
+    // private
+    re : /\{([\w\-\.\#]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\\]\s?[\d\.\+\-\*\\\(\)]+)?\}/g,
+    // private
+    codeRe : /\{\[((?:\\\]|.|\n)*?)\]\}/g,
+
+    // private
+    applySubTemplate : function(id, values, parent, xindex, xcount){
+        var me = this,
+            len,
+            t = me.tpls[id],
+            vs,
+            buf = [];
+        if ((t.test && !t.test.call(me, values, parent, xindex, xcount)) ||
+            (t.exec && t.exec.call(me, values, parent, xindex, xcount))) {
+            return '';
+        }
+        vs = t.target ? t.target.call(me, values, parent) : values;
+        len = vs.length;
+        parent = t.target ? values : parent;
+        if(t.target && Ext.isArray(vs)){
+            for(var i = 0, len = vs.length; i < len; i++){
+                buf[buf.length] = t.compiled.call(me, vs[i], parent, i+1, len);
+            }
+            return buf.join('');
+        }
+        return t.compiled.call(me, vs, parent, xindex, xcount);
+    },
+
+    // private
+    compileTpl : function(tpl){
+        var fm = Ext.util.Format,
+            useF = this.disableFormats !== true,
+            sep = Ext.isGecko ? "+" : ",",
+            body;
+
+        function fn(m, name, format, args, math){
+            if(name.substr(0, 4) == 'xtpl'){
+                return "'"+ sep +'this.applySubTemplate('+name.substr(4)+', values, parent, xindex, xcount)'+sep+"'";
+            }
+            var v;
+            if(name === '.'){
+                v = 'values';
+            }else if(name === '#'){
+                v = 'xindex';
+            }else if(name.indexOf('.') != -1){
+                v = name;
+            }else{
+                v = "values['" + name + "']";
+            }
+            if(math){
+                v = '(' + v + math + ')';
+            }
+            if (format && useF) {
+                args = args ? ',' + args : "";
+                if(format.substr(0, 5) != "this."){
+                    format = "fm." + format + '(';
+                }else{
+                    format = 'this.call("'+ format.substr(5) + '", ';
+                    args = ", values";
+                }
+            } else {
+                args= ''; format = "("+v+" === undefined ? '' : ";
+            }
+            return "'"+ sep + format + v + args + ")"+sep+"'";
+        }
+
+        function codeFn(m, code){
+            // Single quotes get escaped when the template is compiled, however we want to undo this when running code.
+            return "'" + sep + '(' + code.replace(/\\'/g, "'") + ')' + sep + "'";
+        }
+
+        // branched to use + in gecko and [].join() in others
+        if(Ext.isGecko){
+            body = "tpl.compiled = function(values, parent, xindex, xcount){ return '" +
+                   tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn) +
+                    "';};";
+        }else{
+            body = ["tpl.compiled = function(values, parent, xindex, xcount){ return ['"];
+            body.push(tpl.body.replace(/(\r\n|\n)/g, '\\n').replace(/'/g, "\\'").replace(this.re, fn).replace(this.codeRe, codeFn));
+            body.push("'].join('');};");
+            body = body.join('');
+        }
+        eval(body);
+        return this;
+    },
+
+    /**
+     * Returns an HTML fragment of this template with the specified values applied.
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String} The HTML fragment
+     */
+    applyTemplate : function(values){
+        return this.master.compiled.call(this, values, {}, 1, 1);
+    },
+
+    /**
+     * Compile the template to a function for optimized performance.  Recommended if the template will be used frequently.
+     * @return {Function} The compiled function
+     */
+    compile : function(){return this;}
+
+    /**
+     * @property re
+     * @hide
+     */
+    /**
+     * @property disableFormats
+     * @hide
+     */
+    /**
+     * @method set
+     * @hide
+     */
+
+});
+/**
+ * Alias for {@link #applyTemplate}
+ * Returns an HTML fragment of this template with the specified values applied.
+ * @param {Object/Array} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+ * @return {String} The HTML fragment
+ * @member Ext.XTemplate
+ * @method apply
+ */
+Ext.XTemplate.prototype.apply = Ext.XTemplate.prototype.applyTemplate;
+
+/**
+ * Creates a template from the passed element's value (<i>display:none</i> textarea, preferred) or innerHTML.
+ * @param {String/HTMLElement} el A DOM element or its id
+ * @return {Ext.Template} The created template
+ * @static
+ */
+Ext.XTemplate.from = function(el){
+    el = Ext.getDom(el);
+    return new Ext.XTemplate(el.value || el.innerHTML);
+};
+/**
+ * @class Ext.util.CSS
+ * Utility class for manipulating CSS rules
+ * @singleton
+ */
+Ext.util.CSS = function(){
+	var rules = null;
+   	var doc = document;
+
+    var camelRe = /(-[a-z])/gi;
+    var camelFn = function(m, a){ return a.charAt(1).toUpperCase(); };
+
+   return {
+   /**
+    * Creates a stylesheet from a text blob of rules.
+    * These rules will be wrapped in a STYLE tag and appended to the HEAD of the document.
+    * @param {String} cssText The text containing the css rules
+    * @param {String} id An id to add to the stylesheet for later removal
+    * @return {StyleSheet}
+    */
+   createStyleSheet : function(cssText, id){
+       var ss;
+       var head = doc.getElementsByTagName("head")[0];
+       var rules = doc.createElement("style");
+       rules.setAttribute("type", "text/css");
+       if(id){
+           rules.setAttribute("id", id);
+       }
+       if(Ext.isIE){
+           head.appendChild(rules);
+           ss = rules.styleSheet;
+           ss.cssText = cssText;
+       }else{
+           try{
+                rules.appendChild(doc.createTextNode(cssText));
+           }catch(e){
+               rules.cssText = cssText;
+           }
+           head.appendChild(rules);
+           ss = rules.styleSheet ? rules.styleSheet : (rules.sheet || doc.styleSheets[doc.styleSheets.length-1]);
+       }
+       this.cacheStyleSheet(ss);
+       return ss;
+   },
+
+   /**
+    * Removes a style or link tag by id
+    * @param {String} id The id of the tag
+    */
+   removeStyleSheet : function(id){
+       var existing = doc.getElementById(id);
+       if(existing){
+           existing.parentNode.removeChild(existing);
+       }
+   },
+
+   /**
+    * Dynamically swaps an existing stylesheet reference for a new one
+    * @param {String} id The id of an existing link tag to remove
+    * @param {String} url The href of the new stylesheet to include
+    */
+   swapStyleSheet : function(id, url){
+       this.removeStyleSheet(id);
+       var ss = doc.createElement("link");
+       ss.setAttribute("rel", "stylesheet");
+       ss.setAttribute("type", "text/css");
+       ss.setAttribute("id", id);
+       ss.setAttribute("href", url);
+       doc.getElementsByTagName("head")[0].appendChild(ss);
+   },
+   
+   /**
+    * Refresh the rule cache if you have dynamically added stylesheets
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   refreshCache : function(){
+       return this.getRules(true);
+   },
+
+   // private
+   cacheStyleSheet : function(ss){
+       if(!rules){
+           rules = {};
+       }
+       try{// try catch for cross domain access issue
+           var ssRules = ss.cssRules || ss.rules;
+           for(var j = ssRules.length-1; j >= 0; --j){
+               rules[ssRules[j].selectorText.toLowerCase()] = ssRules[j];
+           }
+       }catch(e){}
+   },
+   
+   /**
+    * Gets all css rules for the document
+    * @param {Boolean} refreshCache true to refresh the internal cache
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   getRules : function(refreshCache){
+   		if(rules === null || refreshCache){
+   			rules = {};
+   			var ds = doc.styleSheets;
+   			for(var i =0, len = ds.length; i < len; i++){
+   			    try{
+    		        this.cacheStyleSheet(ds[i]);
+    		    }catch(e){} 
+	        }
+   		}
+   		return rules;
+   	},
+   	
+   	/**
+    * Gets an an individual CSS rule by selector(s)
+    * @param {String/Array} selector The CSS selector or an array of selectors to try. The first selector that is found is returned.
+    * @param {Boolean} refreshCache true to refresh the internal cache if you have recently updated any rules or added styles dynamically
+    * @return {CSSRule} The CSS rule or null if one is not found
+    */
+   getRule : function(selector, refreshCache){
+   		var rs = this.getRules(refreshCache);
+   		if(!Ext.isArray(selector)){
+   		    return rs[selector.toLowerCase()];
+   		}
+   		for(var i = 0; i < selector.length; i++){
+			if(rs[selector[i]]){
+				return rs[selector[i].toLowerCase()];
+			}
+		}
+		return null;
+   	},
+   	
+   	
+   	/**
+    * Updates a rule property
+    * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found.
+    * @param {String} property The css property
+    * @param {String} value The new value for the property
+    * @return {Boolean} true If a rule was found and updated
+    */
+   updateRule : function(selector, property, value){
+   		if(!Ext.isArray(selector)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				rule.style[property.replace(camelRe, camelFn)] = value;
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.updateRule(selector[i], property, value)){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	}
+   };	
+}();/**
+ @class Ext.util.ClickRepeater
+ @extends Ext.util.Observable
+
+ A wrapper class which can be applied to any element. Fires a "click" event while the
+ mouse is pressed. The interval between firings may be specified in the config but
+ defaults to 20 milliseconds.
+
+ Optionally, a CSS class may be applied to the element during the time it is pressed.
+
+ @cfg {Mixed} el The element to act as a button.
+ @cfg {Number} delay The initial delay before the repeating event begins firing.
+ Similar to an autorepeat key delay.
+ @cfg {Number} interval The interval between firings of the "click" event. Default 20 ms.
+ @cfg {String} pressClass A CSS class name to be applied to the element while pressed.
+ @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
+           "interval" and "delay" are ignored.
+ @cfg {Boolean} preventDefault True to prevent the default click event
+ @cfg {Boolean} stopDefault True to stop the default click event
+
+ @history
+    2007-02-02 jvs Original code contributed by Nige "Animal" White
+    2007-02-02 jvs Renamed to ClickRepeater
+    2007-02-03 jvs Modifications for FF Mac and Safari
+
+ @constructor
+ @param {Mixed} el The element to listen on
+ @param {Object} config
+ */
+Ext.util.ClickRepeater = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+        this.el.unselectable();
+
+        Ext.apply(this, config);
+
+        this.addEvents(
+        /**
+         * @event mousedown
+         * Fires when the mouse button is depressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mousedown",
+        /**
+         * @event click
+         * Fires on a specified interval during the time the element is pressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "click",
+        /**
+         * @event mouseup
+         * Fires when the mouse key is released.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        "mouseup"
+        );
+
+        if(!this.disabled){
+            this.disabled = true;
+            this.enable();
+        }
+
+        // allow inline handler
+        if(this.handler){
+            this.on("click", this.handler,  this.scope || this);
+        }
+
+        Ext.util.ClickRepeater.superclass.constructor.call(this);        
+    },
+    
+    interval : 20,
+    delay: 250,
+    preventDefault : true,
+    stopDefault : false,
+    timer : 0,
+
+    /**
+     * Enables the repeater and allows events to fire.
+     */
+    enable: function(){
+        if(this.disabled){
+            this.el.on('mousedown', this.handleMouseDown, this);
+            if (Ext.isIE){
+                this.el.on('dblclick', this.handleDblClick, this);
+            }
+            if(this.preventDefault || this.stopDefault){
+                this.el.on('click', this.eventOptions, this);
+            }
+        }
+        this.disabled = false;
+    },
+
+    /**
+     * Disables the repeater and stops events from firing.
+     */
+    disable: function(/* private */ force){
+        if(force || !this.disabled){
+            clearTimeout(this.timer);
+            if(this.pressClass){
+                this.el.removeClass(this.pressClass);
+            }
+            Ext.getDoc().un('mouseup', this.handleMouseUp, this);
+            this.el.removeAllListeners();
+        }
+        this.disabled = true;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled: function(disabled){
+        this[disabled ? 'disable' : 'enable']();
+    },
+
+    eventOptions: function(e){
+        if(this.preventDefault){
+            e.preventDefault();
+        }
+        if(this.stopDefault){
+            e.stopEvent();
+        }
+    },
+
+    // private
+    destroy : function() {
+        this.disable(true);
+        Ext.destroy(this.el);
+        this.purgeListeners();
+    },
+
+    handleDblClick : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+    },
+
+    // private
+    handleMouseDown : function(e){
+        clearTimeout(this.timer);
+        this.el.blur();
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.mousedownTime = new Date();
+
+        Ext.getDoc().on("mouseup", this.handleMouseUp, this);
+        this.el.on("mouseout", this.handleMouseOut, this);
+
+        this.fireEvent("mousedown", this, e);
+        this.fireEvent("click", this, e);
+
+        // Do not honor delay or interval if acceleration wanted.
+        if (this.accelerate) {
+            this.delay = 400;
+        }
+        this.timer = this.click.defer(this.delay || this.interval, this, [e]);
+    },
+
+    // private
+    click : function(e){
+        this.fireEvent("click", this, e);
+        this.timer = this.click.defer(this.accelerate ?
+            this.easeOutExpo(this.mousedownTime.getElapsed(),
+                400,
+                -390,
+                12000) :
+            this.interval, this, [e]);
+    },
+
+    easeOutExpo : function (t, b, c, d) {
+        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+    },
+
+    // private
+    handleMouseOut : function(){
+        clearTimeout(this.timer);
+        if(this.pressClass){
+            this.el.removeClass(this.pressClass);
+        }
+        this.el.on("mouseover", this.handleMouseReturn, this);
+    },
+
+    // private
+    handleMouseReturn : function(){
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        if(this.pressClass){
+            this.el.addClass(this.pressClass);
+        }
+        this.click();
+    },
+
+    // private
+    handleMouseUp : function(e){
+        clearTimeout(this.timer);
+        this.el.un("mouseover", this.handleMouseReturn, this);
+        this.el.un("mouseout", this.handleMouseOut, this);
+        Ext.getDoc().un("mouseup", this.handleMouseUp, this);
+        this.el.removeClass(this.pressClass);
+        this.fireEvent("mouseup", this, e);
+    }
+});/**
+ * @class Ext.KeyNav
+ * <p>Provides a convenient wrapper for normalized keyboard navigation.  KeyNav allows you to bind
+ * navigation keys to function calls that will get called when the keys are pressed, providing an easy
+ * way to implement custom navigation schemes for any UI component.</p>
+ * <p>The following are all of the possible keys that can be implemented: enter, left, right, up, down, tab, esc,
+ * pageUp, pageDown, del, home, end.  Usage:</p>
+ <pre><code>
+var nav = new Ext.KeyNav("my-element", {
+    "left" : function(e){
+        this.moveLeft(e.ctrlKey);
+    },
+    "right" : function(e){
+        this.moveRight(e.ctrlKey);
+    },
+    "enter" : function(e){
+        this.save();
+    },
+    scope : this
+});
+</code></pre>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config
+ */
+Ext.KeyNav = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(!this.disabled){
+        this.disabled = true;
+        this.enable();
+    }
+};
+
+Ext.KeyNav.prototype = {
+    /**
+     * @cfg {Boolean} disabled
+     * True to disable this KeyNav instance (defaults to false)
+     */
+    disabled : false,
+    /**
+     * @cfg {String} defaultEventAction
+     * The method to call on the {@link Ext.EventObject} after this KeyNav intercepts a key.  Valid values are
+     * {@link Ext.EventObject#stopEvent}, {@link Ext.EventObject#preventDefault} and
+     * {@link Ext.EventObject#stopPropagation} (defaults to 'stopEvent')
+     */
+    defaultEventAction: "stopEvent",
+    /**
+     * @cfg {Boolean} forceKeyDown
+     * Handle the keydown event instead of keypress (defaults to false).  KeyNav automatically does this for IE since
+     * IE does not propagate special keys on keypress, but setting this to true will force other browsers to also
+     * handle keydown instead of keypress.
+     */
+    forceKeyDown : false,
+
+    // private
+    relay : function(e){
+        var k = e.getKey(),
+            h = this.keyToHandler[k];
+        if(h && this[h]){
+            if(this.doRelay(e, this[h], h) !== true){
+                e[this.defaultEventAction]();
+            }
+        }
+    },
+
+    // private
+    doRelay : function(e, h, hname){
+        return h.call(this.scope || this, e, hname);
+    },
+
+    // possible handlers
+    enter : false,
+    left : false,
+    right : false,
+    up : false,
+    down : false,
+    tab : false,
+    esc : false,
+    pageUp : false,
+    pageDown : false,
+    del : false,
+    home : false,
+    end : false,
+    space : false,
+
+    // quick lookup hash
+    keyToHandler : {
+        37 : "left",
+        39 : "right",
+        38 : "up",
+        40 : "down",
+        33 : "pageUp",
+        34 : "pageDown",
+        46 : "del",
+        36 : "home",
+        35 : "end",
+        13 : "enter",
+        27 : "esc",
+        9  : "tab",
+        32 : "space"
+    },
+    
+    stopKeyUp: function(e) {
+        var k = e.getKey();
+
+        if (k >= 37 && k <= 40) {
+            // *** bugfix - safari 2.x fires 2 keyup events on cursor keys
+            // *** (note: this bugfix sacrifices the "keyup" event originating from keyNav elements in Safari 2)
+            e.stopEvent();
+        }
+    },
+    
+    /**
+     * Destroy this KeyNav (this is the same as calling disable).
+     */
+    destroy: function(){
+        this.disable();    
+    },
+
+	/**
+	 * Enable this KeyNav
+	 */
+	enable: function() {
+        if (this.disabled) {
+            if (Ext.isSafari2) {
+                // call stopKeyUp() on "keyup" event
+                this.el.on('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.on(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = false;
+        }
+    },
+
+	/**
+	 * Disable this KeyNav
+	 */
+	disable: function() {
+        if (!this.disabled) {
+            if (Ext.isSafari2) {
+                // remove "keyup" event handler
+                this.el.un('keyup', this.stopKeyUp, this);
+            }
+
+            this.el.un(this.isKeydown()? 'keydown' : 'keypress', this.relay, this);
+            this.disabled = true;
+        }
+    },
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    },
+    
+    // private
+    isKeydown: function(){
+        return this.forceKeyDown || Ext.EventManager.useKeydown;
+    }
+};
+/**
+ * @class Ext.KeyMap
+ * Handles mapping keys to actions for an element. One key map can be used for multiple actions.
+ * The constructor accepts the same config object as defined by {@link #addBinding}.
+ * If you bind a callback function to a KeyMap, anytime the KeyMap handles an expected key
+ * combination it will call the function with this signature (if the match is a multi-key
+ * combination the callback will still be called only once): (String key, Ext.EventObject e)
+ * A KeyMap can also handle a string representation of keys.<br />
+ * Usage:
+ <pre><code>
+// map one key by key code
+var map = new Ext.KeyMap("my-element", {
+    key: 13, // or Ext.EventObject.ENTER
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to one action by string
+var map = new Ext.KeyMap("my-element", {
+    key: "a\r\n\t",
+    fn: myHandler,
+    scope: myObject
+});
+
+// map multiple keys to multiple actions by strings and array of codes
+var map = new Ext.KeyMap("my-element", [
+    {
+        key: [10,13],
+        fn: function(){ alert("Return was pressed"); }
+    }, {
+        key: "abc",
+        fn: function(){ alert('a, b or c was pressed'); }
+    }, {
+        key: "\t",
+        ctrl:true,
+        shift:true,
+        fn: function(){ alert('Control + shift + tab was pressed.'); }
+    }
+]);
+</code></pre>
+ * <b>Note: A KeyMap starts enabled</b>
+ * @constructor
+ * @param {Mixed} el The element to bind to
+ * @param {Object} config The config (see {@link #addBinding})
+ * @param {String} eventName (optional) The event to bind to (defaults to "keydown")
+ */
+Ext.KeyMap = function(el, config, eventName){
+    this.el  = Ext.get(el);
+    this.eventName = eventName || "keydown";
+    this.bindings = [];
+    if(config){
+        this.addBinding(config);
+    }
+    this.enable();
+};
+
+Ext.KeyMap.prototype = {
+    /**
+     * True to stop the event from bubbling and prevent the default browser action if the
+     * key was handled by the KeyMap (defaults to false)
+     * @type Boolean
+     */
+    stopEvent : false,
+
+    /**
+     * Add a new binding to this KeyMap. The following config object properties are supported:
+     * <pre>
+Property    Type             Description
+----------  ---------------  ----------------------------------------------------------------------
+key         String/Array     A single keycode or an array of keycodes to handle
+shift       Boolean          True to handle key only when shift is pressed, False to handle the key only when shift is not pressed (defaults to undefined)
+ctrl        Boolean          True to handle key only when ctrl is pressed, False to handle the key only when ctrl is not pressed (defaults to undefined)
+alt         Boolean          True to handle key only when alt is pressed, False to handle the key only when alt is not pressed (defaults to undefined)
+handler     Function         The function to call when KeyMap finds the expected key combination
+fn          Function         Alias of handler (for backwards-compatibility)
+scope       Object           The scope of the callback function
+stopEvent   Boolean          True to stop the event from bubbling and prevent the default browser action if the key was handled by the KeyMap (defaults to false)
+</pre>
+     *
+     * Usage:
+     * <pre><code>
+// Create a KeyMap
+var map = new Ext.KeyMap(document, {
+    key: Ext.EventObject.ENTER,
+    fn: handleKey,
+    scope: this
+});
+
+//Add a new binding to the existing KeyMap later
+map.addBinding({
+    key: 'abc',
+    shift: true,
+    fn: handleKey,
+    scope: this
+});
+</code></pre>
+     * @param {Object/Array} config A single KeyMap config or an array of configs
+     */
+	addBinding : function(config){
+        if(Ext.isArray(config)){
+            Ext.each(config, function(c){
+                this.addBinding(c);
+            }, this);
+            return;
+        }
+        var keyCode = config.key,
+            fn = config.fn || config.handler,
+            scope = config.scope;
+
+	if (config.stopEvent) {
+	    this.stopEvent = config.stopEvent;    
+	}	
+
+        if(typeof keyCode == "string"){
+            var ks = [];
+            var keyString = keyCode.toUpperCase();
+            for(var j = 0, len = keyString.length; j < len; j++){
+                ks.push(keyString.charCodeAt(j));
+            }
+            keyCode = ks;
+        }
+        var keyArray = Ext.isArray(keyCode);
+        
+        var handler = function(e){
+            if(this.checkModifiers(config, e)){
+                var k = e.getKey();
+                if(keyArray){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          if(this.stopEvent){
+                              e.stopEvent();
+                          }
+                          fn.call(scope || window, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        if(this.stopEvent){
+                           e.stopEvent();
+                        }
+                        fn.call(scope || window, k, e);
+                    }
+                }
+            }
+        };
+        this.bindings.push(handler);
+	},
+    
+    // private
+    checkModifiers: function(config, e){
+        var val, key, keys = ['shift', 'ctrl', 'alt'];
+        for (var i = 0, len = keys.length; i < len; ++i){
+            key = keys[i];
+            val = config[key];
+            if(!(val === undefined || (val === e[key + 'Key']))){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Shorthand for adding a single key listener
+     * @param {Number/Array/Object} key Either the numeric key code, array of key codes or an object with the
+     * following options:
+     * {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    on : function(key, fn, scope){
+        var keyCode, shift, ctrl, alt;
+        if(typeof key == "object" && !Ext.isArray(key)){
+            keyCode = key.key;
+            shift = key.shift;
+            ctrl = key.ctrl;
+            alt = key.alt;
+        }else{
+            keyCode = key;
+        }
+        this.addBinding({
+            key: keyCode,
+            shift: shift,
+            ctrl: ctrl,
+            alt: alt,
+            fn: fn,
+            scope: scope
+        });
+    },
+
+    // private
+    handleKeyDown : function(e){
+	    if(this.enabled){ //just in case
+    	    var b = this.bindings;
+    	    for(var i = 0, len = b.length; i < len; i++){
+    	        b[i].call(this, e);
+    	    }
+	    }
+	},
+
+	/**
+	 * Returns true if this KeyMap is enabled
+	 * @return {Boolean}
+	 */
+	isEnabled : function(){
+	    return this.enabled;
+	},
+
+	/**
+	 * Enables this KeyMap
+	 */
+	enable: function(){
+		if(!this.enabled){
+		    this.el.on(this.eventName, this.handleKeyDown, this);
+		    this.enabled = true;
+		}
+	},
+
+	/**
+	 * Disable this KeyMap
+	 */
+	disable: function(){
+		if(this.enabled){
+		    this.el.removeListener(this.eventName, this.handleKeyDown, this);
+		    this.enabled = false;
+		}
+	},
+    
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     */
+    setDisabled : function(disabled){
+        this[disabled ? "disable" : "enable"]();
+    }
+};/**
+ * @class Ext.util.TextMetrics
+ * Provides precise pixel measurements for blocks of text so that you can determine exactly how high and
+ * wide, in pixels, a given block of text will be. Note that when measuring text, it should be plain text and
+ * should not contain any HTML, otherwise it may not be measured correctly.
+ * @singleton
+ */
+Ext.util.TextMetrics = function(){
+    var shared;
+    return {
+        /**
+         * Measures the size of the specified text
+         * @param {String/HTMLElement} el The element, dom node or id from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String} text The text to measure
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        measure : function(el, text, fixedWidth){
+            if(!shared){
+                shared = Ext.util.TextMetrics.Instance(el, fixedWidth);
+            }
+            shared.bind(el);
+            shared.setFixedWidth(fixedWidth || 'auto');
+            return shared.getSize(text);
+        },
+
+        /**
+         * Return a unique TextMetrics instance that can be bound directly to an element and reused.  This reduces
+         * the overhead of multiple calls to initialize the style properties on each measurement.
+         * @param {String/HTMLElement} el The element, dom node or id that the instance will be bound to
+         * @param {Number} fixedWidth (optional) If the text will be multiline, you have to set a fixed width
+         * in order to accurately measure the text height
+         * @return {Ext.util.TextMetrics.Instance} instance The new instance
+         */
+        createInstance : function(el, fixedWidth){
+            return Ext.util.TextMetrics.Instance(el, fixedWidth);
+        }
+    };
+}();
+
+Ext.util.TextMetrics.Instance = function(bindTo, fixedWidth){
+    var ml = new Ext.Element(document.createElement('div'));
+    document.body.appendChild(ml.dom);
+    ml.position('absolute');
+    ml.setLeftTop(-1000, -1000);
+    ml.hide();
+
+    if(fixedWidth){
+        ml.setWidth(fixedWidth);
+    }
+
+    var instance = {
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the size of the specified text based on the internal element's style and width properties
+         * @param {String} text The text to measure
+         * @return {Object} An object containing the text's size {width: (width), height: (height)}
+         */
+        getSize : function(text){
+            ml.update(text);
+            var s = ml.getSize();
+            ml.update('');
+            return s;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Binds this TextMetrics instance to an element from which to copy existing CSS styles
+         * that can affect the size of the rendered text
+         * @param {String/HTMLElement} el The element, dom node or id
+         */
+        bind : function(el){
+            ml.setStyle(
+                Ext.fly(el).getStyles('font-size','font-style', 'font-weight', 'font-family','line-height', 'text-transform', 'letter-spacing')
+            );
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Sets a fixed width on the internal measurement element.  If the text will be multiline, you have
+         * to set a fixed width in order to accurately measure the text height.
+         * @param {Number} width The width to set on the element
+         */
+        setFixedWidth : function(width){
+            ml.setWidth(width);
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured width of the specified text
+         * @param {String} text The text to measure
+         * @return {Number} width The width in pixels
+         */
+        getWidth : function(text){
+            ml.dom.style.width = 'auto';
+            return this.getSize(text).width;
+        },
+
+        /**
+         * <p><b>Only available on the instance returned from {@link #createInstance}, <u>not</u> on the singleton.</b></p>
+         * Returns the measured height of the specified text.  For multiline text, be sure to call
+         * {@link #setFixedWidth} if necessary.
+         * @param {String} text The text to measure
+         * @return {Number} height The height in pixels
+         */
+        getHeight : function(text){
+            return this.getSize(text).height;
+        }
+    };
+
+    instance.bind(bindTo);
+
+    return instance;
+};
+
+Ext.Element.addMethods({
+    /**
+     * Returns the width in pixels of the passed text, or the width of the text in this Element.
+     * @param {String} text The text to measure. Defaults to the innerHTML of the element.
+     * @param {Number} min (Optional) The minumum value to return.
+     * @param {Number} max (Optional) The maximum value to return.
+     * @return {Number} The text width in pixels.
+     * @member Ext.Element getTextWidth
+     */
+    getTextWidth : function(text, min, max){
+        return (Ext.util.TextMetrics.measure(this.dom, Ext.value(text, this.dom.innerHTML, true)).width).constrain(min || 0, max || 1000000);
+    }
+});
+/**
+ * @class Ext.util.Cookies
+ * Utility class for managing and interacting with cookies.
+ * @singleton
+ */
+Ext.util.Cookies = {
+    /**
+     * Create a cookie with the specified name and value. Additional settings
+     * for the cookie may be optionally specified (for example: expiration,
+     * access restriction, SSL).
+     * @param {String} name The name of the cookie to set. 
+     * @param {Mixed} value The value to set for the cookie.
+     * @param {Object} expires (Optional) Specify an expiration date the
+     * cookie is to persist until.  Note that the specified Date object will
+     * be converted to Greenwich Mean Time (GMT). 
+     * @param {String} path (Optional) Setting a path on the cookie restricts
+     * access to pages that match that path. Defaults to all pages (<tt>'/'</tt>). 
+     * @param {String} domain (Optional) Setting a domain restricts access to
+     * pages on a given domain (typically used to allow cookie access across
+     * subdomains). For example, "extjs.com" will create a cookie that can be
+     * accessed from any subdomain of extjs.com, including www.extjs.com,
+     * support.extjs.com, etc.
+     * @param {Boolean} secure (Optional) Specify true to indicate that the cookie
+     * should only be accessible via SSL on a page using the HTTPS protocol.
+     * Defaults to <tt>false</tt>. Note that this will only work if the page
+     * calling this code uses the HTTPS protocol, otherwise the cookie will be
+     * created with default options.
+     */
+    set : function(name, value){
+        var argv = arguments;
+        var argc = arguments.length;
+        var expires = (argc > 2) ? argv[2] : null;
+        var path = (argc > 3) ? argv[3] : '/';
+        var domain = (argc > 4) ? argv[4] : null;
+        var secure = (argc > 5) ? argv[5] : false;
+        document.cookie = name + "=" + escape(value) + ((expires === null) ? "" : ("; expires=" + expires.toGMTString())) + ((path === null) ? "" : ("; path=" + path)) + ((domain === null) ? "" : ("; domain=" + domain)) + ((secure === true) ? "; secure" : "");
+    },
+
+    /**
+     * Retrieves cookies that are accessible by the current page. If a cookie
+     * does not exist, <code>get()</code> returns <tt>null</tt>.  The following
+     * example retrieves the cookie called "valid" and stores the String value
+     * in the variable <tt>validStatus</tt>.
+     * <pre><code>
+     * var validStatus = Ext.util.Cookies.get("valid");
+     * </code></pre>
+     * @param {String} name The name of the cookie to get
+     * @return {Mixed} Returns the cookie value for the specified name;
+     * null if the cookie name does not exist.
+     */
+    get : function(name){
+        var arg = name + "=";
+        var alen = arg.length;
+        var clen = document.cookie.length;
+        var i = 0;
+        var j = 0;
+        while(i < clen){
+            j = i + alen;
+            if(document.cookie.substring(i, j) == arg){
+                return Ext.util.Cookies.getCookieVal(j);
+            }
+            i = document.cookie.indexOf(" ", i) + 1;
+            if(i === 0){
+                break;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Removes a cookie with the provided name from the browser
+     * if found by setting its expiration date to sometime in the past. 
+     * @param {String} name The name of the cookie to remove
+     */
+    clear : function(name){
+        if(Ext.util.Cookies.get(name)){
+            document.cookie = name + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
+        }
+    },
+    /**
+     * @private
+     */
+    getCookieVal : function(offset){
+        var endstr = document.cookie.indexOf(";", offset);
+        if(endstr == -1){
+            endstr = document.cookie.length;
+        }
+        return unescape(document.cookie.substring(offset, endstr));
+    }
+};/**
+ * Framework-wide error-handler.  Developers can override this method to provide
+ * custom exception-handling.  Framework errors will often extend from the base
+ * Ext.Error class.
+ * @param {Object/Error} e The thrown exception object.
+ */
+Ext.handleError = function(e) {
+    throw e;
+};
+
+/**
+ * @class Ext.Error
+ * @extends Error
+ * <p>A base error class. Future implementations are intended to provide more
+ * robust error handling throughout the framework (<b>in the debug build only</b>)
+ * to check for common errors and problems. The messages issued by this class
+ * will aid error checking. Error checks will be automatically removed in the
+ * production build so that performance is not negatively impacted.</p>
+ * <p>Some sample messages currently implemented:</p><pre>
+"DataProxy attempted to execute an API-action but found an undefined
+url / function. Please review your Proxy url/api-configuration."
+ * </pre><pre>
+"Could not locate your "root" property in your server response.
+Please review your JsonReader config to ensure the config-property
+"root" matches the property your server-response.  See the JsonReader
+docs for additional assistance."
+ * </pre>
+ * <p>An example of the code used for generating error messages:</p><pre><code>
+try {
+    generateError({
+        foo: 'bar'
+    });
+}
+catch (e) {
+    console.error(e);
+}
+function generateError(data) {
+    throw new Ext.Error('foo-error', data);
+}
+ * </code></pre>
+ * @param {String} message
+ */
+Ext.Error = function(message) {
+    // Try to read the message from Ext.Error.lang
+    this.message = (this.lang[message]) ? this.lang[message] : message;
+};
+
+Ext.Error.prototype = new Error();
+Ext.apply(Ext.Error.prototype, {
+    // protected.  Extensions place their error-strings here.
+    lang: {},
+
+    name: 'Ext.Error',
+    /**
+     * getName
+     * @return {String}
+     */
+    getName : function() {
+        return this.name;
+    },
+    /**
+     * getMessage
+     * @return {String}
+     */
+    getMessage : function() {
+        return this.message;
+    },
+    /**
+     * toJson
+     * @return {String}
+     */
+    toJson : function() {
+        return Ext.encode(this);
+    }
+});
+/**
+ * @class Ext.ComponentMgr
+ * <p>Provides a registry of all Components (instances of {@link Ext.Component} or any subclass
+ * thereof) on a page so that they can be easily accessed by {@link Ext.Component component}
+ * {@link Ext.Component#id id} (see {@link #get}, or the convenience method {@link Ext#getCmp Ext.getCmp}).</p>
+ * <p>This object also provides a registry of available Component <i>classes</i>
+ * indexed by a mnemonic code known as the Component's {@link Ext.Component#xtype xtype}.
+ * The <code>{@link Ext.Component#xtype xtype}</code> provides a way to avoid instantiating child Components
+ * when creating a full, nested config object for a complete Ext page.</p>
+ * <p>A child Component may be specified simply as a <i>config object</i>
+ * as long as the correct <code>{@link Ext.Component#xtype xtype}</code> is specified so that if and when the Component
+ * needs rendering, the correct type can be looked up for lazy instantiation.</p>
+ * <p>For a list of all available <code>{@link Ext.Component#xtype xtypes}</code>, see {@link Ext.Component}.</p>
+ * @singleton
+ */
+Ext.ComponentMgr = function(){
+    var all = new Ext.util.MixedCollection();
+    var types = {};
+    var ptypes = {};
+
+    return {
+        /**
+         * Registers a component.
+         * @param {Ext.Component} c The component
+         */
+        register : function(c){
+            all.add(c);
+        },
+
+        /**
+         * Unregisters a component.
+         * @param {Ext.Component} c The component
+         */
+        unregister : function(c){
+            all.remove(c);
+        },
+
+        /**
+         * Returns a component by {@link Ext.Component#id id}.
+         * For additional details see {@link Ext.util.MixedCollection#get}.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @return Ext.Component The Component, <code>undefined</code> if not found, or <code>null</code> if a
+         * Class was found.
+         */
+        get : function(id){
+            return all.get(id);
+        },
+
+        /**
+         * Registers a function that will be called when a Component with the specified id is added to ComponentMgr. This will happen on instantiation.
+         * @param {String} id The component {@link Ext.Component#id id}
+         * @param {Function} fn The callback function
+         * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed. Defaults to the Component.
+         */
+        onAvailable : function(id, fn, scope){
+            all.on("add", function(index, o){
+                if(o.id == id){
+                    fn.call(scope || o, o);
+                    all.un("add", fn, scope);
+                }
+            });
+        },
+
+        /**
+         * The MixedCollection used internally for the component cache. An example usage may be subscribing to
+         * events on the MixedCollection to monitor addition or removal.  Read-only.
+         * @type {MixedCollection}
+         */
+        all : all,
+        
+        /**
+         * The xtypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        types : types,
+        
+        /**
+         * The ptypes that have been registered with the component manager.
+         * @type {Object}
+         */
+        ptypes: ptypes,
+        
+        /**
+         * Checks if a Component type is registered.
+         * @param {Ext.Component} xtype The mnemonic string by which the Component class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isRegistered : function(xtype){
+            return types[xtype] !== undefined;    
+        },
+        
+        /**
+         * Checks if a Plugin type is registered.
+         * @param {Ext.Component} ptype The mnemonic string by which the Plugin class may be looked up
+         * @return {Boolean} Whether the type is registered.
+         */
+        isPluginRegistered : function(ptype){
+            return ptypes[ptype] !== undefined;    
+        },        
+
+        /**
+         * <p>Registers a new Component constructor, keyed by a new
+         * {@link Ext.Component#xtype}.</p>
+         * <p>Use this method (or its alias {@link Ext#reg Ext.reg}) to register new
+         * subclasses of {@link Ext.Component} so that lazy instantiation may be used when specifying
+         * child Components.
+         * see {@link Ext.Container#items}</p>
+         * @param {String} xtype The mnemonic string by which the Component class may be looked up.
+         * @param {Constructor} cls The new Component class.
+         */
+        registerType : function(xtype, cls){
+            types[xtype] = cls;
+            cls.xtype = xtype;
+        },
+
+        /**
+         * Creates a new Component from the specified config object using the
+         * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Component you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Component type if
+         * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+         * @return {Ext.Component} The newly instantiated Component.
+         */
+        create : function(config, defaultType){
+            return config.render ? config : new types[config.xtype || defaultType](config);
+        },
+
+        /**
+         * <p>Registers a new Plugin constructor, keyed by a new
+         * {@link Ext.Component#ptype}.</p>
+         * <p>Use this method (or its alias {@link Ext#preg Ext.preg}) to register new
+         * plugins for {@link Ext.Component}s so that lazy instantiation may be used when specifying
+         * Plugins.</p>
+         * @param {String} ptype The mnemonic string by which the Plugin class may be looked up.
+         * @param {Constructor} cls The new Plugin class.
+         */
+        registerPlugin : function(ptype, cls){
+            ptypes[ptype] = cls;
+            cls.ptype = ptype;
+        },
+
+        /**
+         * Creates a new Plugin from the specified config object using the
+         * config object's {@link Ext.component#ptype ptype} to determine the class to instantiate.
+         * @param {Object} config A configuration object for the Plugin you wish to create.
+         * @param {Constructor} defaultType The constructor to provide the default Plugin type if
+         * the config object does not contain a <code>ptype</code>. (Optional if the config contains a <code>ptype</code>).
+         * @return {Ext.Component} The newly instantiated Plugin.
+         */
+        createPlugin : function(config, defaultType){
+            var PluginCls = ptypes[config.ptype || defaultType];
+            if (PluginCls.init) {
+                return PluginCls;                
+            } else {
+                return new PluginCls(config);
+            }            
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerType}
+ * @param {String} xtype The {@link Ext.component#xtype mnemonic string} by which the Component class
+ * may be looked up.
+ * @param {Constructor} cls The new Component class.
+ * @member Ext
+ * @method reg
+ */
+Ext.reg = Ext.ComponentMgr.registerType; // this will be called a lot internally, shorthand to keep the bytes down
+/**
+ * Shorthand for {@link Ext.ComponentMgr#registerPlugin}
+ * @param {String} ptype The {@link Ext.component#ptype mnemonic string} by which the Plugin class
+ * may be looked up.
+ * @param {Constructor} cls The new Plugin class.
+ * @member Ext
+ * @method preg
+ */
+Ext.preg = Ext.ComponentMgr.registerPlugin;
+/**
+ * Shorthand for {@link Ext.ComponentMgr#create}
+ * Creates a new Component from the specified config object using the
+ * config object's {@link Ext.component#xtype xtype} to determine the class to instantiate.
+ * @param {Object} config A configuration object for the Component you wish to create.
+ * @param {Constructor} defaultType The constructor to provide the default Component type if
+ * the config object does not contain a <code>xtype</code>. (Optional if the config contains a <code>xtype</code>).
+ * @return {Ext.Component} The newly instantiated Component.
+ * @member Ext
+ * @method create
+ */
+Ext.create = Ext.ComponentMgr.create;/**
+ * @class Ext.Component
+ * @extends Ext.util.Observable
+ * <p>Base class for all Ext components.  All subclasses of Component may participate in the automated
+ * Ext component lifecycle of creation, rendering and destruction which is provided by the {@link Ext.Container Container} class.
+ * Components may be added to a Container through the {@link Ext.Container#items items} config option at the time the Container is created,
+ * or they may be added dynamically via the {@link Ext.Container#add add} method.</p>
+ * <p>The Component base class has built-in support for basic hide/show and enable/disable behavior.</p>
+ * <p>All Components are registered with the {@link Ext.ComponentMgr} on construction so that they can be referenced at any time via
+ * {@link Ext#getCmp}, passing the {@link #id}.</p>
+ * <p>All user-developed visual widgets that are required to participate in automated lifecycle and size management should subclass Component (or
+ * {@link Ext.BoxComponent} if managed box model handling is required, ie height and width management).</p>
+ * <p>See the <a href="http://extjs.com/learn/Tutorial:Creating_new_UI_controls">Creating new UI controls</a> tutorial for details on how
+ * and to either extend or augment ExtJs base classes to create custom Components.</p>
+ * <p>Every component has a specific xtype, which is its Ext-specific type name, along with methods for checking the
+ * xtype like {@link #getXType} and {@link #isXType}. This is the list of all valid xtypes:</p>
+ * <pre>
+xtype            Class
+-------------    ------------------
+box              {@link Ext.BoxComponent}
+button           {@link Ext.Button}
+buttongroup      {@link Ext.ButtonGroup}
+colorpalette     {@link Ext.ColorPalette}
+component        {@link Ext.Component}
+container        {@link Ext.Container}
+cycle            {@link Ext.CycleButton}
+dataview         {@link Ext.DataView}
+datepicker       {@link Ext.DatePicker}
+editor           {@link Ext.Editor}
+editorgrid       {@link Ext.grid.EditorGridPanel}
+flash            {@link Ext.FlashComponent}
+grid             {@link Ext.grid.GridPanel}
+listview         {@link Ext.ListView}
+multislider      {@link Ext.slider.MultiSlider}
+panel            {@link Ext.Panel}
+progress         {@link Ext.ProgressBar}
+propertygrid     {@link Ext.grid.PropertyGrid}
+slider           {@link Ext.slider.SingleSlider}
+spacer           {@link Ext.Spacer}
+splitbutton      {@link Ext.SplitButton}
+tabpanel         {@link Ext.TabPanel}
+treepanel        {@link Ext.tree.TreePanel}
+viewport         {@link Ext.ViewPort}
+window           {@link Ext.Window}
+
+Toolbar components
+---------------------------------------
+paging           {@link Ext.PagingToolbar}
+toolbar          {@link Ext.Toolbar}
+tbbutton         {@link Ext.Toolbar.Button}        (deprecated; use button)
+tbfill           {@link Ext.Toolbar.Fill}
+tbitem           {@link Ext.Toolbar.Item}
+tbseparator      {@link Ext.Toolbar.Separator}
+tbspacer         {@link Ext.Toolbar.Spacer}
+tbsplit          {@link Ext.Toolbar.SplitButton}   (deprecated; use splitbutton)
+tbtext           {@link Ext.Toolbar.TextItem}
+
+Menu components
+---------------------------------------
+menu             {@link Ext.menu.Menu}
+colormenu        {@link Ext.menu.ColorMenu}
+datemenu         {@link Ext.menu.DateMenu}
+menubaseitem     {@link Ext.menu.BaseItem}
+menucheckitem    {@link Ext.menu.CheckItem}
+menuitem         {@link Ext.menu.Item}
+menuseparator    {@link Ext.menu.Separator}
+menutextitem     {@link Ext.menu.TextItem}
+
+Form components
+---------------------------------------
+form             {@link Ext.form.FormPanel}
+checkbox         {@link Ext.form.Checkbox}
+checkboxgroup    {@link Ext.form.CheckboxGroup}
+combo            {@link Ext.form.ComboBox}
+compositefield   {@link Ext.form.CompositeField}
+datefield        {@link Ext.form.DateField}
+displayfield     {@link Ext.form.DisplayField}
+field            {@link Ext.form.Field}
+fieldset         {@link Ext.form.FieldSet}
+hidden           {@link Ext.form.Hidden}
+htmleditor       {@link Ext.form.HtmlEditor}
+label            {@link Ext.form.Label}
+numberfield      {@link Ext.form.NumberField}
+radio            {@link Ext.form.Radio}
+radiogroup       {@link Ext.form.RadioGroup}
+textarea         {@link Ext.form.TextArea}
+textfield        {@link Ext.form.TextField}
+timefield        {@link Ext.form.TimeField}
+trigger          {@link Ext.form.TriggerField}
+
+Chart components
+---------------------------------------
+chart            {@link Ext.chart.Chart}
+barchart         {@link Ext.chart.BarChart}
+cartesianchart   {@link Ext.chart.CartesianChart}
+columnchart      {@link Ext.chart.ColumnChart}
+linechart        {@link Ext.chart.LineChart}
+piechart         {@link Ext.chart.PieChart}
+
+Store xtypes
+---------------------------------------
+arraystore       {@link Ext.data.ArrayStore}
+directstore      {@link Ext.data.DirectStore}
+groupingstore    {@link Ext.data.GroupingStore}
+jsonstore        {@link Ext.data.JsonStore}
+simplestore      {@link Ext.data.SimpleStore}      (deprecated; use arraystore)
+store            {@link Ext.data.Store}
+xmlstore         {@link Ext.data.XmlStore}
+</pre>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options may be specified as either:
+ * <div class="mdetail-params"><ul>
+ * <li><b>an element</b> :
+ * <p class="sub-desc">it is set as the internal element and its id used as the component id</p></li>
+ * <li><b>a string</b> :
+ * <p class="sub-desc">it is assumed to be the id of an existing element and is used as the component id</p></li>
+ * <li><b>anything else</b> :
+ * <p class="sub-desc">it is assumed to be a standard config object and is applied to the component</p></li>
+ * </ul></div>
+ */
+Ext.Component = function(config){
+    config = config || {};
+    if(config.initialConfig){
+        if(config.isAction){           // actions
+            this.baseAction = config;
+        }
+        config = config.initialConfig; // component cloning / action set up
+    }else if(config.tagName || config.dom || Ext.isString(config)){ // element object
+        config = {applyTo: config, id: config.id || config};
+    }
+
+    /**
+     * This Component's initial configuration specification. Read-only.
+     * @type Object
+     * @property initialConfig
+     */
+    this.initialConfig = config;
+
+    Ext.apply(this, config);
+    this.addEvents(
+        /**
+         * @event added
+         * Fires when a component is added to an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         * @param {number} index Position at which the component was added
+         */
+        'added',
+        /**
+         * @event disable
+         * Fires after the component is disabled.
+         * @param {Ext.Component} this
+         */
+        'disable',
+        /**
+         * @event enable
+         * Fires after the component is enabled.
+         * @param {Ext.Component} this
+         */
+        'enable',
+        /**
+         * @event beforeshow
+         * Fires before the component is shown by calling the {@link #show} method.
+         * Return false from an event handler to stop the show.
+         * @param {Ext.Component} this
+         */
+        'beforeshow',
+        /**
+         * @event show
+         * Fires after the component is shown when calling the {@link #show} method.
+         * @param {Ext.Component} this
+         */
+        'show',
+        /**
+         * @event beforehide
+         * Fires before the component is hidden by calling the {@link #hide} method.
+         * Return false from an event handler to stop the hide.
+         * @param {Ext.Component} this
+         */
+        'beforehide',
+        /**
+         * @event hide
+         * Fires after the component is hidden.
+         * Fires after the component is hidden when calling the {@link #hide} method.
+         * @param {Ext.Component} this
+         */
+        'hide',
+        /**
+         * @event removed
+         * Fires when a component is removed from an Ext.Container
+         * @param {Ext.Component} this
+         * @param {Ext.Container} ownerCt Container which holds the component
+         */
+        'removed',
+        /**
+         * @event beforerender
+         * Fires before the component is {@link #rendered}. Return false from an
+         * event handler to stop the {@link #render}.
+         * @param {Ext.Component} this
+         */
+        'beforerender',
+        /**
+         * @event render
+         * Fires after the component markup is {@link #rendered}.
+         * @param {Ext.Component} this
+         */
+        'render',
+        /**
+         * @event afterrender
+         * <p>Fires after the component rendering is finished.</p>
+         * <p>The afterrender event is fired after this Component has been {@link #rendered}, been postprocesed
+         * by any afterRender method defined for the Component, and, if {@link #stateful}, after state
+         * has been restored.</p>
+         * @param {Ext.Component} this
+         */
+        'afterrender',
+        /**
+         * @event beforedestroy
+         * Fires before the component is {@link #destroy}ed. Return false from an event handler to stop the {@link #destroy}.
+         * @param {Ext.Component} this
+         */
+        'beforedestroy',
+        /**
+         * @event destroy
+         * Fires after the component is {@link #destroy}ed.
+         * @param {Ext.Component} this
+         */
+        'destroy',
+        /**
+         * @event beforestaterestore
+         * Fires before the state of the component is restored. Return false from an event handler to stop the restore.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. If this
+         * event is not vetoed, then the state object is passed to <b><tt>applyState</tt></b>. By default,
+         * that simply copies property values into this Component. The method maybe overriden to
+         * provide custom state restoration.
+         */
+        'beforestaterestore',
+        /**
+         * @event staterestore
+         * Fires after the state of the component is restored.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values returned from the StateProvider. This is passed
+         * to <b><tt>applyState</tt></b>. By default, that simply copies property values into this
+         * Component. The method maybe overriden to provide custom state restoration.
+         */
+        'staterestore',
+        /**
+         * @event beforestatesave
+         * Fires before the state of the component is saved to the configured state provider. Return false to stop the save.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'beforestatesave',
+        /**
+         * @event statesave
+         * Fires after the state of the component is saved to the configured state provider.
+         * @param {Ext.Component} this
+         * @param {Object} state The hash of state values. This is determined by calling
+         * <b><tt>getState()</tt></b> on the Component. This method must be provided by the
+         * developer to return whetever representation of state is required, by default, Ext.Component
+         * has a null implementation.
+         */
+        'statesave'
+    );
+    this.getId();
+    Ext.ComponentMgr.register(this);
+    Ext.Component.superclass.constructor.call(this);
+
+    if(this.baseAction){
+        this.baseAction.addComponent(this);
+    }
+
+    this.initComponent();
+
+    if(this.plugins){
+        if(Ext.isArray(this.plugins)){
+            for(var i = 0, len = this.plugins.length; i < len; i++){
+                this.plugins[i] = this.initPlugin(this.plugins[i]);
+            }
+        }else{
+            this.plugins = this.initPlugin(this.plugins);
+        }
+    }
+
+    if(this.stateful !== false){
+        this.initState();
+    }
+
+    if(this.applyTo){
+        this.applyToMarkup(this.applyTo);
+        delete this.applyTo;
+    }else if(this.renderTo){
+        this.render(this.renderTo);
+        delete this.renderTo;
+    }
+};
+
+// private
+Ext.Component.AUTO_ID = 1000;
+
+Ext.extend(Ext.Component, Ext.util.Observable, {
+    // Configs below are used for all Components when rendered by FormLayout.
+    /**
+     * @cfg {String} fieldLabel <p>The label text to display next to this Component (defaults to '').</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelStyle <p>A CSS style specification string to apply directly to this field's
+     * label.  Defaults to the container's labelStyle value if set (e.g.,
+     * <tt>{@link Ext.layout.FormLayout#labelStyle}</tt> , or '').</p>
+     * <br><p><b>Note</b>: see the note for <code>{@link #clearCls}</code>.</p><br>
+     * <p>Also see <code>{@link #hideLabel}</code> and
+     * <code>{@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</code></p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        labelStyle: 'font-weight:bold;'
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} labelSeparator <p>The separator to display after the text of each
+     * <tt>{@link #fieldLabel}</tt>.  This property may be configured at various levels.
+     * The order of precedence is:
+     * <div class="mdetail-params"><ul>
+     * <li>field / component level</li>
+     * <li>container level</li>
+     * <li>{@link Ext.layout.FormLayout#labelSeparator layout level} (defaults to colon <tt>':'</tt>)</li>
+     * </ul></div>
+     * To display no separator for this field's label specify empty string ''.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * <p>Also see <tt>{@link #hideLabel}</tt> and
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}.</p>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    layoutConfig: {
+        labelSeparator: '~'   // layout config has lowest priority (defaults to ':')
+    },
+    {@link Ext.layout.FormLayout#labelSeparator labelSeparator}: '>>',     // config at container level
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Field 1',
+        labelSeparator: '...' // field/component level config supersedes others
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Field 2' // labelSeparator will be '='
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideLabel <p><tt>true</tt> to completely hide the label element
+     * ({@link #fieldLabel label} and {@link #labelSeparator separator}). Defaults to <tt>false</tt>.
+     * By default, even if you do not specify a <tt>{@link #fieldLabel}</tt> the space will still be
+     * reserved so that the field will line up with other fields that do have labels.
+     * Setting this to <tt>true</tt> will cause the field to not reserve that space.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #clearCls}</tt>.</p><br>
+     * Example use:<pre><code>
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield'
+        hideLabel: true
+    }]
+});
+</code></pre>
+     */
+    /**
+     * @cfg {String} clearCls <p>The CSS class used to to apply to the special clearing div rendered
+     * directly after each form field wrapper to provide field clearing (defaults to
+     * <tt>'x-form-clear-left'</tt>).</p>
+     * <br><p><b>Note</b>: this config is only used when this Component is rendered by a Container
+     * which has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout
+     * manager (e.g. {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) and either a
+     * <tt>{@link #fieldLabel}</tt> is specified or <tt>isFormField=true</tt> is specified.</p><br>
+     * <p>See {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} also.</p>
+     */
+    /**
+     * @cfg {String} itemCls
+     * <p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+     * has been configured to use the <b>{@link Ext.layout.FormLayout FormLayout}</b> layout manager (e.g.
+     * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>).</p><br>
+     * <p>An additional CSS class to apply to the div wrapping the form item
+     * element of this field.  If supplied, <tt>itemCls</tt> at the <b>field</b> level will override
+     * the default <tt>itemCls</tt> supplied at the <b>container</b> level. The value specified for
+     * <tt>itemCls</tt> will be added to the default class (<tt>'x-form-item'</tt>).</p>
+     * <p>Since it is applied to the item wrapper (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl}), it allows
+     * you to write standard CSS rules that can apply to the field, the label (if specified), or
+     * any other element within the markup for the field.</p>
+     * <br><p><b>Note</b>: see the note for <tt>{@link #fieldLabel}</tt>.</p><br>
+     * Example use:<pre><code>
+// Apply a style to the field&#39;s label:
+&lt;style>
+    .required .x-form-item-label {font-weight:bold;color:red;}
+&lt;/style>
+
+new Ext.FormPanel({
+    height: 100,
+    renderTo: Ext.getBody(),
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: 'Name',
+        itemCls: 'required' //this label will be styled
+    },{
+        xtype: 'textfield',
+        fieldLabel: 'Favorite Color'
+    }]
+});
+</code></pre>
+     */
+
+    /**
+     * @cfg {String} id
+     * <p>The <b>unique</b> id of this component (defaults to an {@link #getId auto-assigned id}).
+     * You should assign an id if you need to be able to access the component later and you do
+     * not have an object reference available (e.g., using {@link Ext}.{@link Ext#getCmp getCmp}).</p>
+     * <p>Note that this id will also be used as the element id for the containing HTML element
+     * that is rendered to the page for this component. This allows you to write id-based CSS
+     * rules to style the specific instance of this component uniquely, and also to select
+     * sub-elements using this component's id as the parent.</p>
+     * <p><b>Note</b>: to avoid complications imposed by a unique <tt>id</tt> also see
+     * <code>{@link #itemId}</code> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <code>{@link #ownerCt}</code>.</p>
+     */
+    /**
+     * @cfg {String} itemId
+     * <p>An <tt>itemId</tt> can be used as an alternative way to get a reference to a component
+     * when no object reference is available.  Instead of using an <code>{@link #id}</code> with
+     * {@link Ext}.{@link Ext#getCmp getCmp}, use <code>itemId</code> with
+     * {@link Ext.Container}.{@link Ext.Container#getComponent getComponent} which will retrieve
+     * <code>itemId</code>'s or <tt>{@link #id}</tt>'s. Since <code>itemId</code>'s are an index to the
+     * container's internal MixedCollection, the <code>itemId</code> is scoped locally to the container --
+     * avoiding potential conflicts with {@link Ext.ComponentMgr} which requires a <b>unique</b>
+     * <code>{@link #id}</code>.</p>
+     * <pre><code>
+var c = new Ext.Panel({ //
+    {@link Ext.BoxComponent#height height}: 300,
+    {@link #renderTo}: document.body,
+    {@link Ext.Container#layout layout}: 'auto',
+    {@link Ext.Container#items items}: [
+        {
+            itemId: 'p1',
+            {@link Ext.Panel#title title}: 'Panel 1',
+            {@link Ext.BoxComponent#height height}: 150
+        },
+        {
+            itemId: 'p2',
+            {@link Ext.Panel#title title}: 'Panel 2',
+            {@link Ext.BoxComponent#height height}: 150
+        }
+    ]
+})
+p1 = c.{@link Ext.Container#getComponent getComponent}('p1'); // not the same as {@link Ext#getCmp Ext.getCmp()}
+p2 = p1.{@link #ownerCt}.{@link Ext.Container#getComponent getComponent}('p2'); // reference via a sibling
+     * </code></pre>
+     * <p>Also see <tt>{@link #id}</tt> and <code>{@link #ref}</code>.</p>
+     * <p><b>Note</b>: to access the container of an item see <tt>{@link #ownerCt}</tt>.</p>
+     */
+    /**
+     * @cfg {String} xtype
+     * The registered <tt>xtype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a child item of a Container is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>xtype</tt> will be looked up at render time up to determine what
+     * type of child Component to create.<br><br>
+     * The predefined xtypes are listed {@link Ext.Component here}.
+     * <br><br>
+     * If you subclass Components to create your own Components, you may register
+     * them using {@link Ext.ComponentMgr#registerType} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} ptype
+     * The registered <tt>ptype</tt> to create. This config option is not used when passing
+     * a config object into a constructor. This config option is used only when
+     * lazy instantiation is being used, and a Plugin is being
+     * specified not as a fully instantiated Component, but as a <i>Component config
+     * object</i>. The <tt>ptype</tt> will be looked up at render time up to determine what
+     * type of Plugin to create.<br><br>
+     * If you create your own Plugins, you may register them using
+     * {@link Ext.ComponentMgr#registerPlugin} in order to be able to
+     * take advantage of lazy instantiation and rendering.
+     */
+    /**
+     * @cfg {String} cls
+     * An optional extra CSS class that will be added to this component's Element (defaults to '').  This can be
+     * useful for adding customized styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} overCls
+     * An optional extra CSS class that will be added to this component's Element when the mouse moves
+     * over the Element, and removed when the mouse moves out. (defaults to '').  This can be
+     * useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.
+     */
+    /**
+     * @cfg {String} style
+     * A custom style specification to be applied to this component's Element.  Should be a valid argument to
+     * {@link Ext.Element#applyStyles}.
+     * <pre><code>
+new Ext.Panel({
+    title: 'Some Title',
+    renderTo: Ext.getBody(),
+    width: 400, height: 300,
+    layout: 'form',
+    items: [{
+        xtype: 'textarea',
+        style: {
+            width: '95%',
+            marginBottom: '10px'
+        }
+    },
+        new Ext.Button({
+            text: 'Send',
+            minWidth: '100',
+            style: {
+                marginBottom: '10px'
+            }
+        })
+    ]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} ctCls
+     * <p>An optional extra CSS class that will be added to this component's container. This can be useful for
+     * adding customized styles to the container or any of its children using standard CSS rules.  See
+     * {@link Ext.layout.ContainerLayout}.{@link Ext.layout.ContainerLayout#extraCls extraCls} also.</p>
+     * <p><b>Note</b>: <tt>ctCls</tt> defaults to <tt>''</tt> except for the following class
+     * which assigns a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-layout-ct'</tt></li>
+     * </ul></div>
+     * To configure the above Class with an extra CSS class append to the default.  For example,
+     * for BoxLayout (Hbox and Vbox):<pre><code>
+     * ctCls: 'x-box-layout-ct custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this component disabled (default is false).
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is false). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : false,
+    /**
+     * @cfg {Object/Array} plugins
+     * An object or array of objects that will provide custom functionality for this component.  The only
+     * requirement for a valid plugin is that it contain an init method that accepts a reference of type Ext.Component.
+     * When a component is created, if any plugins are available, the component will call the init method on each
+     * plugin, passing a reference to itself.  Each plugin can then call methods or respond to events on the
+     * component as needed to provide its functionality.
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>Specify the id of the element, a DOM element or an existing Element corresponding to a DIV
+     * that is already present in the document that specifies some structural markup for this
+     * component.</p><div><ul>
+     * <li><b>Description</b> : <ul>
+     * <div class="sub-desc">When <tt>applyTo</tt> is used, constituent parts of the component can also be specified
+     * by id or CSS class name within the main element, and the component being created may attempt
+     * to create its subcomponents from that markup if applicable.</div>
+     * </ul></li>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * <div class="sub-desc">If applyTo is specified, any value passed for {@link #renderTo} will be ignored and the target
+     * element's parent node will automatically be used as the component's container.</div>
+     * </ul></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Mixed} renderTo
+     * <p>Specify the id of the element, a DOM element or an existing Element that this component
+     * will be rendered into.</p><div><ul>
+     * <li><b>Notes</b> : <ul>
+     * <div class="sub-desc">Do <u>not</u> use this option if the Component is to be a child item of
+     * a {@link Ext.Container Container}. It is the responsibility of the
+     * {@link Ext.Container Container}'s {@link Ext.Container#layout layout manager}
+     * to render and manage its child items.</div>
+     * <div class="sub-desc">When using this config, a call to render() is not required.</div>
+     * </ul></li>
+     * </ul></div>
+     * <p>See <tt>{@link #render}</tt> also.</p>
+     */
+    /**
+     * @cfg {Boolean} stateful
+     * <p>A flag which causes the Component to attempt to restore the state of
+     * internal properties from a saved state on startup. The component must have
+     * either a <code>{@link #stateId}</code> or <code>{@link #id}</code> assigned
+     * for state to be managed. Auto-generated ids are not guaranteed to be stable
+     * across page loads and cannot be relied upon to save and restore the same
+     * state for a component.<p>
+     * <p>For state saving to work, the state manager's provider must have been
+     * set to an implementation of {@link Ext.state.Provider} which overrides the
+     * {@link Ext.state.Provider#set set} and {@link Ext.state.Provider#get get}
+     * methods to save and recall name/value pairs. A built-in implementation,
+     * {@link Ext.state.CookieProvider} is available.</p>
+     * <p>To set the state provider for the current page:</p>
+     * <pre><code>
+Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
+    expires: new Date(new Date().getTime()+(1000*60*60*24*7)), //7 days from now
+}));
+     * </code></pre>
+     * <p>A stateful Component attempts to save state when one of the events
+     * listed in the <code>{@link #stateEvents}</code> configuration fires.</p>
+     * <p>To save state, a stateful Component first serializes its state by
+     * calling <b><code>getState</code></b>. By default, this function does
+     * nothing. The developer must provide an implementation which returns an
+     * object hash which represents the Component's restorable state.</p>
+     * <p>The value yielded by getState is passed to {@link Ext.state.Manager#set}
+     * which uses the configured {@link Ext.state.Provider} to save the object
+     * keyed by the Component's <code>{@link stateId}</code>, or, if that is not
+     * specified, its <code>{@link #id}</code>.</p>
+     * <p>During construction, a stateful Component attempts to <i>restore</i>
+     * its state by calling {@link Ext.state.Manager#get} passing the
+     * <code>{@link #stateId}</code>, or, if that is not specified, the
+     * <code>{@link #id}</code>.</p>
+     * <p>The resulting object is passed to <b><code>applyState</code></b>.
+     * The default implementation of <code>applyState</code> simply copies
+     * properties into the object, but a developer may override this to support
+     * more behaviour.</p>
+     * <p>You can perform extra processing on state save and restore by attaching
+     * handlers to the {@link #beforestaterestore}, {@link #staterestore},
+     * {@link #beforestatesave} and {@link #statesave} events.</p>
+     */
+    /**
+     * @cfg {String} stateId
+     * The unique id for this component to use for state management purposes
+     * (defaults to the component id if one was set, otherwise null if the
+     * component is using a generated id).
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Array} stateEvents
+     * <p>An array of events that, when fired, should trigger this component to
+     * save its state (defaults to none). <code>stateEvents</code> may be any type
+     * of event supported by this component, including browser or custom events
+     * (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See <code>{@link #stateful}</code> for an explanation of saving and
+     * restoring Component state.</p>
+     */
+    /**
+     * @cfg {Mixed} autoEl
+     * <p>A tag name or {@link Ext.DomHelper DomHelper} spec used to create the {@link #getEl Element} which will
+     * encapsulate this Component.</p>
+     * <p>You do not normally need to specify this. For the base classes {@link Ext.Component}, {@link Ext.BoxComponent},
+     * and {@link Ext.Container}, this defaults to <b><tt>'div'</tt></b>. The more complex Ext classes use a more complex
+     * DOM structure created by their own onRender methods.</p>
+     * <p>This is intended to allow the developer to create application-specific utility Components encapsulated by
+     * different DOM elements. Example usage:</p><pre><code>
+{
+    xtype: 'box',
+    autoEl: {
+        tag: 'img',
+        src: 'http://www.example.com/example.jpg'
+    }
+}, {
+    xtype: 'box',
+    autoEl: {
+        tag: 'blockquote',
+        html: 'autoEl is cool!'
+    }
+}, {
+    xtype: 'container',
+    autoEl: 'ul',
+    cls: 'ux-unordered-list',
+    items: {
+        xtype: 'box',
+        autoEl: 'li',
+        html: 'First list item'
+    }
+}
+</code></pre>
+     */
+    autoEl : 'div',
+
+    /**
+     * @cfg {String} disabledClass
+     * CSS class added to the component when it is disabled (defaults to 'x-item-disabled').
+     */
+    disabledClass : 'x-item-disabled',
+    /**
+     * @cfg {Boolean} allowDomMove
+     * Whether the component can move the Dom node when rendering (defaults to true).
+     */
+    allowDomMove : true,
+    /**
+     * @cfg {Boolean} autoShow
+     * True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove
+     * them on render (defaults to false).
+     */
+    autoShow : false,
+    /**
+     * @cfg {String} hideMode
+     * <p>How this component should be hidden. Supported values are <tt>'visibility'</tt>
+     * (css visibility), <tt>'offsets'</tt> (negative offset position) and <tt>'display'</tt>
+     * (css display).</p>
+     * <br><p><b>Note</b>: the default of <tt>'display'</tt> is generally preferred
+     * since items are automatically laid out when they are first shown (no sizing
+     * is done while hidden).</p>
+     */
+    hideMode : 'display',
+    /**
+     * @cfg {Boolean} hideParent
+     * True to hide and show the component's container when hide/show is called on the component, false to hide
+     * and show the component itself (defaults to false).  For example, this can be used as a shortcut for a hide
+     * button on a window by setting hide:true on the button when adding it to its parent container.
+     */
+    hideParent : false,
+    /**
+     * <p>The {@link Ext.Element} which encapsulates this Component. Read-only.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the <code>{@link #autoEl}</code> config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link Ext.util.Observable#listeners listeners}
+     * config for a suggestion, or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * <p>See also <tt>{@link #getEl getEl}</p>
+     * @type Ext.Element
+     * @property el
+     */
+    /**
+     * This Component's owner {@link Ext.Container Container} (defaults to undefined, and is set automatically when
+     * this Component is added to a Container).  Read-only.
+     * <p><b>Note</b>: to access items within the Container see <tt>{@link #itemId}</tt>.</p>
+     * @type Ext.Container
+     * @property ownerCt
+     */
+    /**
+     * True if this component is hidden. Read-only.
+     * @type Boolean
+     * @property hidden
+     */
+    /**
+     * True if this component is disabled. Read-only.
+     * @type Boolean
+     * @property disabled
+     */
+    /**
+     * True if this component has been rendered. Read-only.
+     * @type Boolean
+     * @property rendered
+     */
+    rendered : false,
+
+    /**
+     * @cfg {String} contentEl
+     * <p>Optional. Specify an existing HTML element, or the <code>id</code> of an existing HTML element to use as the content
+     * for this component.</p>
+     * <ul>
+     * <li><b>Description</b> :
+     * <div class="sub-desc">This config option is used to take an existing HTML element and place it in the layout element
+     * of a new component (it simply moves the specified DOM element <i>after the Component is rendered</i> to use as the content.</div></li>
+     * <li><b>Notes</b> :
+     * <div class="sub-desc">The specified HTML element is appended to the layout element of the component <i>after any configured
+     * {@link #html HTML} has been inserted</i>, and so the document will not contain this element at the time the {@link #render} event is fired.</div>
+     * <div class="sub-desc">The specified HTML element used will not participate in any <code><b>{@link Ext.Container#layout layout}</b></code>
+     * scheme that the Component may use. It is just HTML. Layouts operate on child <code><b>{@link Ext.Container#items items}</b></code>.</div>
+     * <div class="sub-desc">Add either the <code>x-hidden</code> or the <code>x-hide-display</code> CSS class to
+     * prevent a brief flicker of the content before it is rendered to the panel.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {String/Object} html
+     * An HTML fragment, or a {@link Ext.DomHelper DomHelper} specification to use as the layout element
+     * content (defaults to ''). The HTML content is added after the component is rendered,
+     * so the document will not contain this HTML at the time the {@link #render} event is fired.
+     * This content is inserted into the body <i>before</i> any configured {@link #contentEl} is appended.
+     */
+
+    /**
+     * @cfg {Mixed} tpl
+     * An <bold>{@link Ext.Template}</bold>, <bold>{@link Ext.XTemplate}</bold>
+     * or an array of strings to form an Ext.XTemplate.
+     * Used in conjunction with the <code>{@link #data}</code> and
+     * <code>{@link #tplWriteMode}</code> configurations.
+     */
+
+    /**
+     * @cfg {String} tplWriteMode The Ext.(X)Template method to use when
+     * updating the content area of the Component. Defaults to <tt>'overwrite'</tt>
+     * (see <code>{@link Ext.XTemplate#overwrite}</code>).
+     */
+    tplWriteMode : 'overwrite',
+
+    /**
+     * @cfg {Mixed} data
+     * The initial set of data to apply to the <code>{@link #tpl}</code> to
+     * update the content area of the Component.
+     */
+    
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+
+    // private
+    ctype : 'Ext.Component',
+
+    // private
+    actionMode : 'el',
+
+    // private
+    getActionEl : function(){
+        return this[this.actionMode];
+    },
+
+    initPlugin : function(p){
+        if(p.ptype && !Ext.isFunction(p.init)){
+            p = Ext.ComponentMgr.createPlugin(p);
+        }else if(Ext.isString(p)){
+            p = Ext.ComponentMgr.createPlugin({
+                ptype: p
+            });
+        }
+        p.init(this);
+        return p;
+    },
+
+    /* // protected
+     * Function to be implemented by Component subclasses to be part of standard component initialization flow (it is empty by default).
+     * <pre><code>
+// Traditional constructor:
+Ext.Foo = function(config){
+    // call superclass constructor:
+    Ext.Foo.superclass.constructor.call(this, config);
+
+    this.addEvents({
+        // add events
+    });
+};
+Ext.extend(Ext.Foo, Ext.Bar, {
+   // class body
+}
+
+// initComponent replaces the constructor:
+Ext.Foo = Ext.extend(Ext.Bar, {
+    initComponent : function(){
+        // call superclass initComponent
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents({
+            // add events
+        });
+    }
+}
+</code></pre>
+     */
+    initComponent : function(){
+        /*
+         * this is double processing, however it allows people to be able to do
+         * Ext.apply(this, {
+         *     listeners: {
+         *         //here
+         *     }
+         * });
+         * MyClass.superclass.initComponent.call(this);
+         */
+        if(this.listeners){
+            this.on(this.listeners);
+            delete this.listeners;
+        }
+        this.enableBubble(this.bubbleEvents);
+    },
+
+    /**
+     * <p>Render this Component into the passed HTML element.</p>
+     * <p><b>If you are using a {@link Ext.Container Container} object to house this Component, then
+     * do not use the render method.</b></p>
+     * <p>A Container's child Components are rendered by that Container's
+     * {@link Ext.Container#layout layout} manager when the Container is first rendered.</p>
+     * <p>Certain layout managers allow dynamic addition of child components. Those that do
+     * include {@link Ext.layout.CardLayout}, {@link Ext.layout.AnchorLayout},
+     * {@link Ext.layout.FormLayout}, {@link Ext.layout.TableLayout}.</p>
+     * <p>If the Container is already rendered when a new child Component is added, you may need to call
+     * the Container's {@link Ext.Container#doLayout doLayout} to refresh the view which causes any
+     * unrendered child Components to be rendered. This is required so that you can add multiple
+     * child components if needed while only refreshing the layout once.</p>
+     * <p>When creating complex UIs, it is important to remember that sizing and positioning
+     * of child items is the responsibility of the Container's {@link Ext.Container#layout layout} manager.
+     * If you expect child items to be sized in response to user interactions, you must
+     * configure the Container with a layout manager which creates and manages the type of layout you
+     * have in mind.</p>
+     * <p><b>Omitting the Container's {@link Ext.Container#layout layout} config means that a basic
+     * layout manager is used which does nothing but render child components sequentially into the
+     * Container. No sizing or positioning will be performed in this situation.</b></p>
+     * @param {Element/HTMLElement/String} container (optional) The element this Component should be
+     * rendered into. If it is being created from existing markup, this should be omitted.
+     * @param {String/Number} position (optional) The element ID or DOM node index within the container <b>before</b>
+     * which this component will be inserted (defaults to appending to the end of the container)
+     */
+    render : function(container, position){
+        if(!this.rendered && this.fireEvent('beforerender', this) !== false){
+            if(!container && this.el){
+                this.el = Ext.get(this.el);
+                container = this.el.dom.parentNode;
+                this.allowDomMove = false;
+            }
+            this.container = Ext.get(container);
+            if(this.ctCls){
+                this.container.addClass(this.ctCls);
+            }
+            this.rendered = true;
+            if(position !== undefined){
+                if(Ext.isNumber(position)){
+                    position = this.container.dom.childNodes[position];
+                }else{
+                    position = Ext.getDom(position);
+                }
+            }
+            this.onRender(this.container, position || null);
+            if(this.autoShow){
+                this.el.removeClass(['x-hidden','x-hide-' + this.hideMode]);
+            }
+            if(this.cls){
+                this.el.addClass(this.cls);
+                delete this.cls;
+            }
+            if(this.style){
+                this.el.applyStyles(this.style);
+                delete this.style;
+            }
+            if(this.overCls){
+                this.el.addClassOnOver(this.overCls);
+            }
+            this.fireEvent('render', this);
+
+
+            // Populate content of the component with html, contentEl or
+            // a tpl.
+            var contentTarget = this.getContentTarget();
+            if (this.html){
+                contentTarget.update(Ext.DomHelper.markup(this.html));
+                delete this.html;
+            }
+            if (this.contentEl){
+                var ce = Ext.getDom(this.contentEl);
+                Ext.fly(ce).removeClass(['x-hidden', 'x-hide-display']);
+                contentTarget.appendChild(ce);
+            }
+            if (this.tpl) {
+                if (!this.tpl.compile) {
+                    this.tpl = new Ext.XTemplate(this.tpl);
+                }
+                if (this.data) {
+                    this.tpl[this.tplWriteMode](contentTarget, this.data);
+                    delete this.data;
+                }
+            }
+            this.afterRender(this.container);
+
+
+            if(this.hidden){
+                // call this so we don't fire initial hide events.
+                this.doHide();
+            }
+            if(this.disabled){
+                // pass silent so the event doesn't fire the first time.
+                this.disable(true);
+            }
+
+            if(this.stateful !== false){
+                this.initStateEvents();
+            }
+            this.fireEvent('afterrender', this);
+        }
+        return this;
+    },
+
+
+    /**
+     * Update the content area of a component.
+     * @param {Mixed} htmlOrData
+     * If this component has been configured with a template via the tpl config
+     * then it will use this argument as data to populate the template.
+     * If this component was not configured with a template, the components
+     * content area will be updated via Ext.Element update
+     * @param {Boolean} loadScripts
+     * (optional) Only legitimate when using the html configuration. Defaults to false
+     * @param {Function} callback
+     * (optional) Only legitimate when using the html configuration. Callback to execute when scripts have finished loading
+     */
+    update: function(htmlOrData, loadScripts, cb) {
+        var contentTarget = this.getContentTarget();
+        if (this.tpl && typeof htmlOrData !== "string") {
+            this.tpl[this.tplWriteMode](contentTarget, htmlOrData || {});
+        } else {
+            var html = Ext.isObject(htmlOrData) ? Ext.DomHelper.markup(htmlOrData) : htmlOrData;
+            contentTarget.update(html, loadScripts, cb);
+        }
+    },
+
+
+    /**
+     * @private
+     * Method to manage awareness of when components are added to their
+     * respective Container, firing an added event.
+     * References are established at add time rather than at render time.
+     * @param {Ext.Container} container Container which holds the component
+     * @param {number} pos Position at which the component was added
+     */
+    onAdded : function(container, pos) {
+        this.ownerCt = container;
+        this.initRef();
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * @private
+     * Method to manage awareness of when components are removed from their
+     * respective Container, firing an removed event. References are properly
+     * cleaned up after removing a component from its owning container.
+     */
+    onRemoved : function() {
+        this.removeRef();
+        this.fireEvent('removed', this, this.ownerCt);
+        delete this.ownerCt;
+    },
+
+    /**
+     * @private
+     * Method to establish a reference to a component.
+     */
+    initRef : function() {
+        /**
+         * @cfg {String} ref
+         * <p>A path specification, relative to the Component's <code>{@link #ownerCt}</code>
+         * specifying into which ancestor Container to place a named reference to this Component.</p>
+         * <p>The ancestor axis can be traversed by using '/' characters in the path.
+         * For example, to put a reference to a Toolbar Button into <i>the Panel which owns the Toolbar</i>:</p><pre><code>
+var myGrid = new Ext.grid.EditorGridPanel({
+    title: 'My EditorGridPanel',
+    store: myStore,
+    colModel: myColModel,
+    tbar: [{
+        text: 'Save',
+        handler: saveChanges,
+        disabled: true,
+        ref: '../saveButton'
+    }],
+    listeners: {
+        afteredit: function() {
+//          The button reference is in the GridPanel
+            myGrid.saveButton.enable();
+        }
+    }
+});
+</code></pre>
+         * <p>In the code above, if the <code>ref</code> had been <code>'saveButton'</code>
+         * the reference would have been placed into the Toolbar. Each '/' in the <code>ref</code>
+         * moves up one level from the Component's <code>{@link #ownerCt}</code>.</p>
+         * <p>Also see the <code>{@link #added}</code> and <code>{@link #removed}</code> events.</p>
+         */
+        if(this.ref && !this.refOwner){
+            var levels = this.ref.split('/'),
+                last = levels.length,
+                i = 0,
+                t = this;
+
+            while(t && i < last){
+                t = t.ownerCt;
+                ++i;
+            }
+            if(t){
+                t[this.refName = levels[--i]] = this;
+                /**
+                 * @type Ext.Container
+                 * @property refOwner
+                 * The ancestor Container into which the {@link #ref} reference was inserted if this Component
+                 * is a child of a Container, and has been configured with a <code>ref</code>.
+                 */
+                this.refOwner = t;
+            }
+        }
+    },
+
+    removeRef : function() {
+        if (this.refOwner && this.refName) {
+            delete this.refOwner[this.refName];
+            delete this.refOwner;
+        }
+    },
+
+    // private
+    initState : function(){
+        if(Ext.state.Manager){
+            var id = this.getStateId();
+            if(id){
+                var state = Ext.state.Manager.get(id);
+                if(state){
+                    if(this.fireEvent('beforestaterestore', this, state) !== false){
+                        this.applyState(Ext.apply({}, state));
+                        this.fireEvent('staterestore', this, state);
+                    }
+                }
+            }
+        }
+    },
+
+    // private
+    getStateId : function(){
+        return this.stateId || ((/^(ext-comp-|ext-gen)/).test(String(this.id)) ? null : this.id);
+    },
+
+    // private
+    initStateEvents : function(){
+        if(this.stateEvents){
+            for(var i = 0, e; e = this.stateEvents[i]; i++){
+                this.on(e, this.saveState, this, {delay:100});
+            }
+        }
+    },
+
+    // private
+    applyState : function(state){
+        if(state){
+            Ext.apply(this, state);
+        }
+    },
+
+    // private
+    getState : function(){
+        return null;
+    },
+
+    // private
+    saveState : function(){
+        if(Ext.state.Manager && this.stateful !== false){
+            var id = this.getStateId();
+            if(id){
+                var state = this.getState();
+                if(this.fireEvent('beforestatesave', this, state) !== false){
+                    Ext.state.Manager.set(id, state);
+                    this.fireEvent('statesave', this, state);
+                }
+            }
+        }
+    },
+
+    /**
+     * Apply this component to existing markup that is valid. With this function, no call to render() is required.
+     * @param {String/HTMLElement} el
+     */
+    applyToMarkup : function(el){
+        this.allowDomMove = false;
+        this.el = Ext.get(el);
+        this.render(this.el.dom.parentNode);
+    },
+
+    /**
+     * Adds a CSS class to the component's underlying element.
+     * @param {string} cls The CSS class name to add
+     * @return {Ext.Component} this
+     */
+    addClass : function(cls){
+        if(this.el){
+            this.el.addClass(cls);
+        }else{
+            this.cls = this.cls ? this.cls + ' ' + cls : cls;
+        }
+        return this;
+    },
+
+    /**
+     * Removes a CSS class from the component's underlying element.
+     * @param {string} cls The CSS class name to remove
+     * @return {Ext.Component} this
+     */
+    removeClass : function(cls){
+        if(this.el){
+            this.el.removeClass(cls);
+        }else if(this.cls){
+            this.cls = this.cls.split(' ').remove(cls).join(' ');
+        }
+        return this;
+    },
+
+    // private
+    // default function is not really useful
+    onRender : function(ct, position){
+        if(!this.el && this.autoEl){
+            if(Ext.isString(this.autoEl)){
+                this.el = document.createElement(this.autoEl);
+            }else{
+                var div = document.createElement('div');
+                Ext.DomHelper.overwrite(div, this.autoEl);
+                this.el = div.firstChild;
+            }
+            if (!this.el.id) {
+                this.el.id = this.getId();
+            }
+        }
+        if(this.el){
+            this.el = Ext.get(this.el);
+            if(this.allowDomMove !== false){
+                ct.dom.insertBefore(this.el.dom, position);
+                if (div) {
+                    Ext.removeNode(div);
+                    div = null;
+                }
+            }
+        }
+    },
+
+    // private
+    getAutoCreate : function(){
+        var cfg = Ext.isObject(this.autoCreate) ?
+                      this.autoCreate : Ext.apply({}, this.defaultAutoCreate);
+        if(this.id && !cfg.id){
+            cfg.id = this.id;
+        }
+        return cfg;
+    },
+
+    // private
+    afterRender : Ext.emptyFn,
+
+    /**
+     * Destroys this component by purging any event listeners, removing the component's element from the DOM,
+     * removing the component from its {@link Ext.Container} (if applicable) and unregistering it from
+     * {@link Ext.ComponentMgr}.  Destruction is generally handled automatically by the framework and this method
+     * should usually not need to be called directly.
+     *
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.fireEvent('beforedestroy', this) !== false){
+                this.destroying = true;
+                this.beforeDestroy();
+                if(this.ownerCt && this.ownerCt.remove){
+                    this.ownerCt.remove(this, false);
+                }
+                if(this.rendered){
+                    this.el.remove();
+                    if(this.actionMode == 'container' || this.removeMode == 'container'){
+                        this.container.remove();
+                    }
+                }
+                // Stop any buffered tasks
+                if(this.focusTask && this.focusTask.cancel){
+                    this.focusTask.cancel();
+                }
+                this.onDestroy();
+                Ext.ComponentMgr.unregister(this);
+                this.fireEvent('destroy', this);
+                this.purgeListeners();
+                this.destroying = false;
+                this.isDestroyed = true;
+            }
+        }
+    },
+
+    deleteMembers : function(){
+        var args = arguments;
+        for(var i = 0, len = args.length; i < len; ++i){
+            delete this[args[i]];
+        }
+    },
+
+    // private
+    beforeDestroy : Ext.emptyFn,
+
+    // private
+    onDestroy  : Ext.emptyFn,
+
+    /**
+     * <p>Returns the {@link Ext.Element} which encapsulates this Component.</p>
+     * <p>This will <i>usually</i> be a &lt;DIV> element created by the class's onRender method, but
+     * that may be overridden using the {@link #autoEl} config.</p>
+     * <br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+     * <p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+     * for this Component's own Observable events), see the {@link #listeners} config for a suggestion,
+     * or use a render listener directly:</p><pre><code>
+new Ext.Panel({
+    title: 'The Clickable Panel',
+    listeners: {
+        render: function(p) {
+            // Append the Panel to the click handler&#39;s argument list.
+            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
+        },
+        single: true  // Remove the listener after first invocation
+    }
+});
+</code></pre>
+     * @return {Ext.Element} The Element which encapsulates this Component.
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the <code>id</code> of this component or automatically generates and
+     * returns an <code>id</code> if an <code>id</code> is not defined yet:<pre><code>
+     * 'ext-comp-' + (++Ext.Component.AUTO_ID)
+     * </code></pre>
+     * @return {String} id
+     */
+    getId : function(){
+        return this.id || (this.id = 'ext-comp-' + (++Ext.Component.AUTO_ID));
+    },
+
+    /**
+     * Returns the <code>{@link #itemId}</code> of this component.  If an
+     * <code>{@link #itemId}</code> was not assigned through configuration the
+     * <code>id</code> is returned using <code>{@link #getId}</code>.
+     * @return {String}
+     */
+    getItemId : function(){
+        return this.itemId || this.getId();
+    },
+
+    /**
+     * Try to focus this component.
+     * @param {Boolean} selectText (optional) If applicable, true to also select the text in this component
+     * @param {Boolean/Number} delay (optional) Delay the focus this number of milliseconds (true for 10 milliseconds)
+     * @return {Ext.Component} this
+     */
+    focus : function(selectText, delay){
+        if(delay){
+            this.focusTask = new Ext.util.DelayedTask(this.focus, this, [selectText, false]);
+            this.focusTask.delay(Ext.isNumber(delay) ? delay : 10);
+            return this;
+        }
+        if(this.rendered && !this.isDestroyed){
+            this.el.focus();
+            if(selectText === true){
+                this.el.dom.select();
+            }
+        }
+        return this;
+    },
+
+    // private
+    blur : function(){
+        if(this.rendered){
+            this.el.blur();
+        }
+        return this;
+    },
+
+    /**
+     * Disable this component and fire the 'disable' event.
+     * @return {Ext.Component} this
+     */
+    disable : function(/* private */ silent){
+        if(this.rendered){
+            this.onDisable();
+        }
+        this.disabled = true;
+        if(silent !== true){
+            this.fireEvent('disable', this);
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.getActionEl().addClass(this.disabledClass);
+        this.el.dom.disabled = true;
+    },
+
+    /**
+     * Enable this component and fire the 'enable' event.
+     * @return {Ext.Component} this
+     */
+    enable : function(){
+        if(this.rendered){
+            this.onEnable();
+        }
+        this.disabled = false;
+        this.fireEvent('enable', this);
+        return this;
+    },
+
+    // private
+    onEnable : function(){
+        this.getActionEl().removeClass(this.disabledClass);
+        this.el.dom.disabled = false;
+    },
+
+    /**
+     * Convenience function for setting disabled/enabled by boolean.
+     * @param {Boolean} disabled
+     * @return {Ext.Component} this
+     */
+    setDisabled : function(disabled){
+        return this[disabled ? 'disable' : 'enable']();
+    },
+
+    /**
+     * Show this component.  Listen to the '{@link #beforeshow}' event and return
+     * <tt>false</tt> to cancel showing the component.  Fires the '{@link #show}'
+     * event after showing the component.
+     * @return {Ext.Component} this
+     */
+    show : function(){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.hidden = false;
+            if(this.autoRender){
+                this.render(Ext.isBoolean(this.autoRender) ? Ext.getBody() : this.autoRender);
+            }
+            if(this.rendered){
+                this.onShow();
+            }
+            this.fireEvent('show', this);
+        }
+        return this;
+    },
+
+    // private
+    onShow : function(){
+        this.getVisibilityEl().removeClass('x-hide-' + this.hideMode);
+    },
+
+    /**
+     * Hide this component.  Listen to the '{@link #beforehide}' event and return
+     * <tt>false</tt> to cancel hiding the component.  Fires the '{@link #hide}'
+     * event after hiding the component. Note this method is called internally if
+     * the component is configured to be <code>{@link #hidden}</code>.
+     * @return {Ext.Component} this
+     */
+    hide : function(){
+        if(this.fireEvent('beforehide', this) !== false){
+            this.doHide();
+            this.fireEvent('hide', this);
+        }
+        return this;
+    },
+
+    // private
+    doHide: function(){
+        this.hidden = true;
+        if(this.rendered){
+            this.onHide();
+        }
+    },
+
+    // private
+    onHide : function(){
+        this.getVisibilityEl().addClass('x-hide-' + this.hideMode);
+    },
+
+    // private
+    getVisibilityEl : function(){
+        return this.hideParent ? this.container : this.getActionEl();
+    },
+
+    /**
+     * Convenience function to hide or show this component by boolean.
+     * @param {Boolean} visible True to show, false to hide
+     * @return {Ext.Component} this
+     */
+    setVisible : function(visible){
+        return this[visible ? 'show' : 'hide']();
+    },
+
+    /**
+     * Returns true if this component is visible.
+     * @return {Boolean} True if this component is visible, false otherwise.
+     */
+    isVisible : function(){
+        return this.rendered && this.getVisibilityEl().isVisible();
+    },
+
+    /**
+     * Clone the current component using the original config values passed into this instance by default.
+     * @param {Object} overrides A new config containing any properties to override in the cloned version.
+     * An id property can be passed on this object, otherwise one will be generated to avoid duplicates.
+     * @return {Ext.Component} clone The cloned copy of this component
+     */
+    cloneConfig : function(overrides){
+        overrides = overrides || {};
+        var id = overrides.id || Ext.id();
+        var cfg = Ext.applyIf(overrides, this.initialConfig);
+        cfg.id = id; // prevent dup id
+        return new this.constructor(cfg);
+    },
+
+    /**
+     * Gets the xtype for this component as registered with {@link Ext.ComponentMgr}. For a list of all
+     * available xtypes, see the {@link Ext.Component} header. Example usage:
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXType());  // alerts 'textfield'
+</code></pre>
+     * @return {String} The xtype
+     */
+    getXType : function(){
+        return this.constructor.xtype;
+    },
+
+    /**
+     * <p>Tests whether or not this Component is of a specific xtype. This can test whether this Component is descended
+     * from the xtype (default) or whether it is directly of the xtype specified (shallow = true).</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>For a list of all available xtypes, see the {@link Ext.Component} header.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+var isText = t.isXType('textfield');        // true
+var isBoxSubclass = t.isXType('box');       // true, descended from BoxComponent
+var isBoxInstance = t.isXType('box', true); // false, not a direct BoxComponent instance
+</code></pre>
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * <pre><code>
+var c = new Ext.Component();
+console.log(c.isXType(c));
+console.log(c.isXType(Ext.Component)); 
+</code></pre>
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Boolean} True if this component descends from the specified xtype, false otherwise.
+     */
+    isXType : function(xtype, shallow){
+        //assume a string by default
+        if (Ext.isFunction(xtype)){
+            xtype = xtype.xtype; //handle being passed the class, e.g. Ext.Component
+        }else if (Ext.isObject(xtype)){
+            xtype = xtype.constructor.xtype; //handle being passed an instance
+        }
+
+        return !shallow ? ('/' + this.getXTypes() + '/').indexOf('/' + xtype + '/') != -1 : this.constructor.xtype == xtype;
+    },
+
+    /**
+     * <p>Returns this Component's xtype hierarchy as a slash-delimited string. For a list of all
+     * available xtypes, see the {@link Ext.Component} header.</p>
+     * <p><b>If using your own subclasses, be aware that a Component must register its own xtype
+     * to participate in determination of inherited xtypes.</b></p>
+     * <p>Example usage:</p>
+     * <pre><code>
+var t = new Ext.form.TextField();
+alert(t.getXTypes());  // alerts 'component/box/field/textfield'
+</code></pre>
+     * @return {String} The xtype hierarchy string
+     */
+    getXTypes : function(){
+        var tc = this.constructor;
+        if(!tc.xtypes){
+            var c = [], sc = this;
+            while(sc && sc.constructor.xtype){
+                c.unshift(sc.constructor.xtype);
+                sc = sc.constructor.superclass;
+            }
+            tc.xtypeChain = c;
+            tc.xtypes = c.join('/');
+        }
+        return tc.xtypes;
+    },
+
+    /**
+     * Find a container above this component at any level by a custom function. If the passed function returns
+     * true, the container will be returned.
+     * @param {Function} fn The custom function to call with the arguments (container, this component).
+     * @return {Ext.Container} The first Container for which the custom function returns true
+     */
+    findParentBy : function(fn) {
+        for (var p = this.ownerCt; (p != null) && !fn(p, this); p = p.ownerCt);
+        return p || null;
+    },
+
+    /**
+     * Find a container above this component at any level by xtype or class
+     * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+     * or a component class:
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Ext.Container} The first Container which matches the given xtype or class
+     */
+    findParentByType : function(xtype, shallow){
+        return this.findParentBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+    
+    /**
+     * Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current node)
+     * @param {Array} args (optional) The args to call the function with (default to passing the current component)
+     * @return {Ext.Component} this
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.ownerCt;
+        }
+        return this;
+    },
+
+    // protected
+    getPositionEl : function(){
+        return this.positionEl || this.el;
+    },
+
+    // private
+    purgeListeners : function(){
+        Ext.Component.superclass.purgeListeners.call(this);
+        if(this.mons){
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    // private
+    clearMons : function(){
+        Ext.each(this.mons, function(m){
+            m.item.un(m.ename, m.fn, m.scope);
+        }, this);
+        this.mons = [];
+    },
+
+    // private
+    createMons: function(){
+        if(!this.mons){
+            this.mons = [];
+            this.on('beforedestroy', this.clearMons, this, {single: true});
+        }
+    },
+
+    /**
+     * <p>Adds listeners to any Observable object (or Elements) which are automatically removed when this Component
+     * is destroyed. Usage:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), 'selectionchange', handleSelectionChange, null, {buffer: 50});
+</pre></code>
+     * <p>or:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), {
+    selectionchange: handleSelectionChange,
+    buffer: 50
+});
+</pre></code>
+     * @param {Observable|Element} item The item to which to add a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     * @param {Object} opt Optional. If the <code>ename</code> parameter was an event name, this
+     * is the {@link Ext.util.Observable#addListener addListener} options.
+     */
+    mon : function(item, ename, fn, scope, opt){
+        this.createMons();
+        if(Ext.isObject(ename)){
+            var propRe = /^(?:scope|delay|buffer|single|stopEvent|preventDefault|stopPropagation|normalized|args|delegate)$/;
+
+            var o = ename;
+            for(var e in o){
+                if(propRe.test(e)){
+                    continue;
+                }
+                if(Ext.isFunction(o[e])){
+                    // shared options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e], o.scope, o);
+                }else{
+                    // individual options
+                    this.mons.push({
+                        item: item, ename: e, fn: o[e], scope: o.scope
+                    });
+                    item.on(e, o[e]);
+                }
+            }
+            return;
+        }
+
+        this.mons.push({
+            item: item, ename: ename, fn: fn, scope: scope
+        });
+        item.on(ename, fn, scope, opt);
+    },
+
+    /**
+     * Removes listeners that were added by the {@link #mon} method.
+     * @param {Observable|Element} item The item from which to remove a listener/listeners.
+     * @param {Object|String} ename The event name, or an object containing event name properties.
+     * @param {Function} fn Optional. If the <code>ename</code> parameter was an event name, this
+     * is the handler function.
+     * @param {Object} scope Optional. If the <code>ename</code> parameter was an event name, this
+     * is the scope (<code>this</code> reference) in which the handler function is executed.
+     */
+    mun : function(item, ename, fn, scope){
+        var found, mon;
+        this.createMons();
+        for(var i = 0, len = this.mons.length; i < len; ++i){
+            mon = this.mons[i];
+            if(item === mon.item && ename == mon.ename && fn === mon.fn && scope === mon.scope){
+                this.mons.splice(i, 1);
+                item.un(ename, fn, scope);
+                found = true;
+                break;
+            }
+        }
+        return found;
+    },
+
+    /**
+     * Returns the next component in the owning container
+     * @return Ext.Component
+     */
+    nextSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index != -1 && index+1 < this.ownerCt.items.getCount()){
+                return this.ownerCt.items.itemAt(index+1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the previous component in the owning container
+     * @return Ext.Component
+     */
+    previousSibling : function(){
+        if(this.ownerCt){
+            var index = this.ownerCt.items.indexOf(this);
+            if(index > 0){
+                return this.ownerCt.items.itemAt(index-1);
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Provides the link for Observable's fireEvent method to bubble up the ownership hierarchy.
+     * @return {Ext.Container} the Container which owns this Component.
+     */
+    getBubbleTarget : function(){
+        return this.ownerCt;
+    }
+});
+
+Ext.reg('component', Ext.Component);
+/**
+ * @class Ext.Action
+ * <p>An Action is a piece of reusable functionality that can be abstracted out of any particular component so that it
+ * can be usefully shared among multiple components.  Actions let you share handlers, configuration options and UI
+ * updates across any components that support the Action interface (primarily {@link Ext.Toolbar}, {@link Ext.Button}
+ * and {@link Ext.menu.Menu} components).</p>
+ * <p>Aside from supporting the config object interface, any component that needs to use Actions must also support
+ * the following method list, as these will be called as needed by the Action class: setText(string), setIconCls(string),
+ * setDisabled(boolean), setVisible(boolean) and setHandler(function).</p>
+ * Example usage:<br>
+ * <pre><code>
+// Define the shared action.  Each component below will have the same
+// display text and icon, and will display the same message on click.
+var action = new Ext.Action({
+    {@link #text}: 'Do something',
+    {@link #handler}: function(){
+        Ext.Msg.alert('Click', 'You did something.');
+    },
+    {@link #iconCls}: 'do-something',
+    {@link #itemId}: 'myAction'
+});
+
+var panel = new Ext.Panel({
+    title: 'Actions',
+    width: 500,
+    height: 300,
+    tbar: [
+        // Add the action directly to a toolbar as a menu button
+        action,
+        {
+            text: 'Action Menu',
+            // Add the action to a menu as a text item
+            menu: [action]
+        }
+    ],
+    items: [
+        // Add the action to the panel body as a standard button
+        new Ext.Button(action)
+    ],
+    renderTo: Ext.getBody()
+});
+
+// Change the text for all components using the action
+action.setText('Something else');
+
+// Reference an action through a container using the itemId
+var btn = panel.getComponent('myAction');
+var aRef = btn.baseAction;
+aRef.setText('New text');
+</code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.Action = Ext.extend(Object, {
+    /**
+     * @cfg {String} text The text to set for all components using this action (defaults to '').
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon for
+     * all components using this action (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'do-something'
+
+// css class that specifies background image to be used as the icon image:
+.do-something { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled True to disable all components using this action, false to enable them (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} hidden True to hide all components using this action, false to show them (defaults to false).
+     */
+    /**
+     * @cfg {Function} handler The function that will be invoked by each component tied to this action
+     * when the component's primary event is triggered (defaults to undefined).
+     */
+    /**
+     * @cfg {String} itemId
+     * See {@link Ext.Component}.{@link Ext.Component#itemId itemId}.
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> is executed. Defaults to this Button.
+     */
+
+    constructor : function(config){
+        this.initialConfig = config;
+        this.itemId = config.itemId = (config.itemId || config.id || Ext.id());
+        this.items = [];
+    },
+    
+    // private
+    isAction : true,
+
+    /**
+     * Sets the text to be displayed by all components using this action.
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.initialConfig.text = text;
+        this.callEach('setText', [text]);
+    },
+
+    /**
+     * Gets the text currently displayed by all components using this action.
+     */
+    getText : function(){
+        return this.initialConfig.text;
+    },
+
+    /**
+     * Sets the icon CSS class for all components using this action.  The class should supply
+     * a background image that will be used as the icon image.
+     * @param {String} cls The CSS class supplying the icon image
+     */
+    setIconClass : function(cls){
+        this.initialConfig.iconCls = cls;
+        this.callEach('setIconClass', [cls]);
+    },
+
+    /**
+     * Gets the icon CSS class currently used by all components using this action.
+     */
+    getIconClass : function(){
+        return this.initialConfig.iconCls;
+    },
+
+    /**
+     * Sets the disabled state of all components using this action.  Shortcut method
+     * for {@link #enable} and {@link #disable}.
+     * @param {Boolean} disabled True to disable the component, false to enable it
+     */
+    setDisabled : function(v){
+        this.initialConfig.disabled = v;
+        this.callEach('setDisabled', [v]);
+    },
+
+    /**
+     * Enables all components using this action.
+     */
+    enable : function(){
+        this.setDisabled(false);
+    },
+
+    /**
+     * Disables all components using this action.
+     */
+    disable : function(){
+        this.setDisabled(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently disabled, else returns false.  
+     */
+    isDisabled : function(){
+        return this.initialConfig.disabled;
+    },
+
+    /**
+     * Sets the hidden state of all components using this action.  Shortcut method
+     * for <code>{@link #hide}</code> and <code>{@link #show}</code>.
+     * @param {Boolean} hidden True to hide the component, false to show it
+     */
+    setHidden : function(v){
+        this.initialConfig.hidden = v;
+        this.callEach('setVisible', [!v]);
+    },
+
+    /**
+     * Shows all components using this action.
+     */
+    show : function(){
+        this.setHidden(false);
+    },
+
+    /**
+     * Hides all components using this action.
+     */
+    hide : function(){
+        this.setHidden(true);
+    },
+
+    /**
+     * Returns true if the components using this action are currently hidden, else returns false.  
+     */
+    isHidden : function(){
+        return this.initialConfig.hidden;
+    },
+
+    /**
+     * Sets the function that will be called by each Component using this action when its primary event is triggered.
+     * @param {Function} fn The function that will be invoked by the action's components.  The function
+     * will be called with no arguments.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed. Defaults to the Component firing the event.
+     */
+    setHandler : function(fn, scope){
+        this.initialConfig.handler = fn;
+        this.initialConfig.scope = scope;
+        this.callEach('setHandler', [fn, scope]);
+    },
+
+    /**
+     * Executes the specified function once for each Component currently tied to this action.  The function passed
+     * in should accept a single argument that will be an object that supports the basic Action config/method interface.
+     * @param {Function} fn The function to execute for each component
+     * @param {Object} scope The scope (<code>this</code> reference) in which the function is executed.  Defaults to the Component.
+     */
+    each : function(fn, scope){
+        Ext.each(this.items, fn, scope);
+    },
+
+    // private
+    callEach : function(fnName, args){
+        var cs = this.items;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i][fnName].apply(cs[i], args);
+        }
+    },
+
+    // private
+    addComponent : function(comp){
+        this.items.push(comp);
+        comp.on('destroy', this.removeComponent, this);
+    },
+
+    // private
+    removeComponent : function(comp){
+        this.items.remove(comp);
+    },
+
+    /**
+     * Executes this action manually using the handler function specified in the original config object
+     * or the handler function set with <code>{@link #setHandler}</code>.  Any arguments passed to this
+     * function will be passed on to the handler function.
+     * @param {Mixed} arg1 (optional) Variable number of arguments passed to the handler function
+     * @param {Mixed} arg2 (optional)
+     * @param {Mixed} etc... (optional)
+     */
+    execute : function(){
+        this.initialConfig.handler.apply(this.initialConfig.scope || window, arguments);
+    }
+});
+/**
+ * @class Ext.Layer
+ * @extends Ext.Element
+ * An extended {@link Ext.Element} object that supports a shadow and shim, constrain to viewport and
+ * automatic maintaining of shadow/shim positions.
+ * @cfg {Boolean} shim False to disable the iframe shim in browsers which need one (defaults to true)
+ * @cfg {String/Boolean} shadow True to automatically create an {@link Ext.Shadow}, or a string indicating the
+ * shadow's display {@link Ext.Shadow#mode}. False to disable the shadow. (defaults to false)
+ * @cfg {Object} dh DomHelper object config to create element with (defaults to {tag: 'div', cls: 'x-layer'}).
+ * @cfg {Boolean} constrain False to disable constrain to viewport (defaults to true)
+ * @cfg {String} cls CSS class to add to the element
+ * @cfg {Number} zindex Starting z-index (defaults to 11000)
+ * @cfg {Number} shadowOffset Number of pixels to offset the shadow (defaults to 4)
+ * @cfg {Boolean} useDisplay
+ * Defaults to use css offsets to hide the Layer. Specify <tt>true</tt>
+ * to use css style <tt>'display:none;'</tt> to hide the Layer.
+ * @constructor
+ * @param {Object} config An object with config options.
+ * @param {String/HTMLElement} existingEl (optional) Uses an existing DOM element. If the element is not found it creates it.
+ */
+(function(){
+Ext.Layer = function(config, existingEl){
+    config = config || {};
+    var dh = Ext.DomHelper,
+        cp = config.parentEl, pel = cp ? Ext.getDom(cp) : document.body;
+        
+    if (existingEl) {
+        this.dom = Ext.getDom(existingEl);
+    }
+    if(!this.dom){
+        var o = config.dh || {tag: 'div', cls: 'x-layer'};
+        this.dom = dh.append(pel, o);
+    }
+    if(config.cls){
+        this.addClass(config.cls);
+    }
+    this.constrain = config.constrain !== false;
+    this.setVisibilityMode(Ext.Element.VISIBILITY);
+    if(config.id){
+        this.id = this.dom.id = config.id;
+    }else{
+        this.id = Ext.id(this.dom);
+    }
+    this.zindex = config.zindex || this.getZIndex();
+    this.position('absolute', this.zindex);
+    if(config.shadow){
+        this.shadowOffset = config.shadowOffset || 4;
+        this.shadow = new Ext.Shadow({
+            offset : this.shadowOffset,
+            mode : config.shadow
+        });
+    }else{
+        this.shadowOffset = 0;
+    }
+    this.useShim = config.shim !== false && Ext.useShims;
+    this.useDisplay = config.useDisplay;
+    this.hide();
+};
+
+var supr = Ext.Element.prototype;
+
+// shims are shared among layer to keep from having 100 iframes
+var shims = [];
+
+Ext.extend(Ext.Layer, Ext.Element, {
+
+    getZIndex : function(){
+        return this.zindex || parseInt((this.getShim() || this).getStyle('z-index'), 10) || 11000;
+    },
+
+    getShim : function(){
+        if(!this.useShim){
+            return null;
+        }
+        if(this.shim){
+            return this.shim;
+        }
+        var shim = shims.shift();
+        if(!shim){
+            shim = this.createShim();
+            shim.enableDisplayMode('block');
+            shim.dom.style.display = 'none';
+            shim.dom.style.visibility = 'visible';
+        }
+        var pn = this.dom.parentNode;
+        if(shim.dom.parentNode != pn){
+            pn.insertBefore(shim.dom, this.dom);
+        }
+        shim.setStyle('z-index', this.getZIndex()-2);
+        this.shim = shim;
+        return shim;
+    },
+
+    hideShim : function(){
+        if(this.shim){
+            this.shim.setDisplayed(false);
+            shims.push(this.shim);
+            delete this.shim;
+        }
+    },
+
+    disableShadow : function(){
+        if(this.shadow){
+            this.shadowDisabled = true;
+            this.shadow.hide();
+            this.lastShadowOffset = this.shadowOffset;
+            this.shadowOffset = 0;
+        }
+    },
+
+    enableShadow : function(show){
+        if(this.shadow){
+            this.shadowDisabled = false;
+            if(Ext.isDefined(this.lastShadowOffset)) {
+                this.shadowOffset = this.lastShadowOffset;
+                delete this.lastShadowOffset;
+            }
+            if(show){
+                this.sync(true);
+            }
+        }
+    },
+
+    // private
+    // this code can execute repeatedly in milliseconds (i.e. during a drag) so
+    // code size was sacrificed for effeciency (e.g. no getBox/setBox, no XY calls)
+    sync : function(doShow){
+        var shadow = this.shadow;
+        if(!this.updating && this.isVisible() && (shadow || this.useShim)){
+            var shim = this.getShim(),
+                w = this.getWidth(),
+                h = this.getHeight(),
+                l = this.getLeft(true),
+                t = this.getTop(true);
+
+            if(shadow && !this.shadowDisabled){
+                if(doShow && !shadow.isVisible()){
+                    shadow.show(this);
+                }else{
+                    shadow.realign(l, t, w, h);
+                }
+                if(shim){
+                    if(doShow){
+                       shim.show();
+                    }
+                    // fit the shim behind the shadow, so it is shimmed too
+                    var shadowAdj = shadow.el.getXY(), shimStyle = shim.dom.style,
+                        shadowSize = shadow.el.getSize();
+                    shimStyle.left = (shadowAdj[0])+'px';
+                    shimStyle.top = (shadowAdj[1])+'px';
+                    shimStyle.width = (shadowSize.width)+'px';
+                    shimStyle.height = (shadowSize.height)+'px';
+                }
+            }else if(shim){
+                if(doShow){
+                   shim.show();
+                }
+                shim.setSize(w, h);
+                shim.setLeftTop(l, t);
+            }
+        }
+    },
+
+    // private
+    destroy : function(){
+        this.hideShim();
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.removeAllListeners();
+        Ext.removeNode(this.dom);
+        delete this.dom;
+    },
+
+    remove : function(){
+        this.destroy();
+    },
+
+    // private
+    beginUpdate : function(){
+        this.updating = true;
+    },
+
+    // private
+    endUpdate : function(){
+        this.updating = false;
+        this.sync(true);
+    },
+
+    // private
+    hideUnders : function(negOffset){
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        this.hideShim();
+    },
+
+    // private
+    constrainXY : function(){
+        if(this.constrain){
+            var vw = Ext.lib.Dom.getViewWidth(),
+                vh = Ext.lib.Dom.getViewHeight();
+            var s = Ext.getDoc().getScroll();
+
+            var xy = this.getXY();
+            var x = xy[0], y = xy[1];
+            var so = this.shadowOffset;
+            var w = this.dom.offsetWidth+so, h = this.dom.offsetHeight+so;
+            // only move it if it needs it
+            var moved = false;
+            // first validate right/bottom
+            if((x + w) > vw+s.left){
+                x = vw - w - so;
+                moved = true;
+            }
+            if((y + h) > vh+s.top){
+                y = vh - h - so;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < s.left){
+                x = s.left;
+                moved = true;
+            }
+            if(y < s.top){
+                y = s.top;
+                moved = true;
+            }
+            if(moved){
+                if(this.avoidY){
+                    var ay = this.avoidY;
+                    if(y <= ay && (y+h) >= ay){
+                        y = ay-h-5;
+                    }
+                }
+                xy = [x, y];
+                this.storeXY(xy);
+                supr.setXY.call(this, xy);
+                this.sync();
+            }
+        }
+        return this;
+    },
+    
+    getConstrainOffset : function(){
+        return this.shadowOffset;    
+    },
+
+    isVisible : function(){
+        return this.visible;
+    },
+
+    // private
+    showAction : function(){
+        this.visible = true; // track visibility to prevent getStyle calls
+        if(this.useDisplay === true){
+            this.setDisplayed('');
+        }else if(this.lastXY){
+            supr.setXY.call(this, this.lastXY);
+        }else if(this.lastLT){
+            supr.setLeftTop.call(this, this.lastLT[0], this.lastLT[1]);
+        }
+    },
+
+    // private
+    hideAction : function(){
+        this.visible = false;
+        if(this.useDisplay === true){
+            this.setDisplayed(false);
+        }else{
+            this.setLeftTop(-10000,-10000);
+        }
+    },
+
+    // overridden Element method
+    setVisible : function(v, a, d, c, e){
+        if(v){
+            this.showAction();
+        }
+        if(a && v){
+            var cb = function(){
+                this.sync(true);
+                if(c){
+                    c();
+                }
+            }.createDelegate(this);
+            supr.setVisible.call(this, true, true, d, cb, e);
+        }else{
+            if(!v){
+                this.hideUnders(true);
+            }
+            var cb = c;
+            if(a){
+                cb = function(){
+                    this.hideAction();
+                    if(c){
+                        c();
+                    }
+                }.createDelegate(this);
+            }
+            supr.setVisible.call(this, v, a, d, cb, e);
+            if(v){
+                this.sync(true);
+            }else if(!a){
+                this.hideAction();
+            }
+        }
+        return this;
+    },
+
+    storeXY : function(xy){
+        delete this.lastLT;
+        this.lastXY = xy;
+    },
+
+    storeLeftTop : function(left, top){
+        delete this.lastXY;
+        this.lastLT = [left, top];
+    },
+
+    // private
+    beforeFx : function(){
+        this.beforeAction();
+        return Ext.Layer.superclass.beforeFx.apply(this, arguments);
+    },
+
+    // private
+    afterFx : function(){
+        Ext.Layer.superclass.afterFx.apply(this, arguments);
+        this.sync(this.isVisible());
+    },
+
+    // private
+    beforeAction : function(){
+        if(!this.updating && this.shadow){
+            this.shadow.hide();
+        }
+    },
+
+    // overridden Element method
+    setLeft : function(left){
+        this.storeLeftTop(left, this.getTop(true));
+        supr.setLeft.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setTop : function(top){
+        this.storeLeftTop(this.getLeft(true), top);
+        supr.setTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setLeftTop : function(left, top){
+        this.storeLeftTop(left, top);
+        supr.setLeftTop.apply(this, arguments);
+        this.sync();
+        return this;
+    },
+
+    setXY : function(xy, a, d, c, e){
+        this.fixDisplay();
+        this.beforeAction();
+        this.storeXY(xy);
+        var cb = this.createCB(c);
+        supr.setXY.call(this, xy, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // private
+    createCB : function(c){
+        var el = this;
+        return function(){
+            el.constrainXY();
+            el.sync(true);
+            if(c){
+                c();
+            }
+        };
+    },
+
+    // overridden Element method
+    setX : function(x, a, d, c, e){
+        this.setXY([x, this.getY()], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setY : function(y, a, d, c, e){
+        this.setXY([this.getX(), y], a, d, c, e);
+        return this;
+    },
+
+    // overridden Element method
+    setSize : function(w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setSize.call(this, w, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setWidth : function(w, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setWidth.call(this, w, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setHeight : function(h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        supr.setHeight.call(this, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+        return this;
+    },
+
+    // overridden Element method
+    setBounds : function(x, y, w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        if(!a){
+            this.storeXY([x, y]);
+            supr.setXY.call(this, [x, y]);
+            supr.setSize.call(this, w, h, a, d, cb, e);
+            cb();
+        }else{
+            supr.setBounds.call(this, x, y, w, h, a, d, cb, e);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the z-index of this layer and adjusts any shadow and shim z-indexes. The layer z-index is automatically
+     * incremented by two more than the value passed in so that it always shows above any shadow or shim (the shadow
+     * element, if any, will be assigned z-index + 1, and the shim element, if any, will be assigned the unmodified z-index).
+     * @param {Number} zindex The new z-index to set
+     * @return {this} The Layer
+     */
+    setZIndex : function(zindex){
+        this.zindex = zindex;
+        this.setStyle('z-index', zindex + 2);
+        if(this.shadow){
+            this.shadow.setZIndex(zindex + 1);
+        }
+        if(this.shim){
+            this.shim.setStyle('z-index', zindex);
+        }
+        return this;
+    }
+});
+})();
+/**
+ * @class Ext.Shadow
+ * Simple class that can provide a shadow effect for any element.  Note that the element MUST be absolutely positioned,
+ * and the shadow does not provide any shimming.  This should be used only in simple cases -- for more advanced
+ * functionality that can also provide the same shadow effect, see the {@link Ext.Layer} class.
+ * @constructor
+ * Create a new Shadow
+ * @param {Object} config The config object
+ */
+Ext.Shadow = function(config) {
+    Ext.apply(this, config);
+    if (typeof this.mode != "string") {
+        this.mode = this.defaultMode;
+    }
+    var o = this.offset,
+        a = {
+            h: 0
+        },
+        rad = Math.floor(this.offset / 2);
+    switch (this.mode.toLowerCase()) {
+        // all this hideous nonsense calculates the various offsets for shadows
+        case "drop":
+            a.w = 0;
+            a.l = a.t = o;
+            a.t -= 1;
+            if (Ext.isIE) {
+                a.l -= this.offset + rad;
+                a.t -= this.offset + rad;
+                a.w -= rad;
+                a.h -= rad;
+                a.t += 1;
+            }
+        break;
+        case "sides":
+            a.w = (o * 2);
+            a.l = -o;
+            a.t = o - 1;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= this.offset + rad;
+                a.l += 1;
+                a.w -= (this.offset - rad) * 2;
+                a.w -= rad + 1;
+                a.h -= 1;
+            }
+        break;
+        case "frame":
+            a.w = a.h = (o * 2);
+            a.l = a.t = -o;
+            a.t += 1;
+            a.h -= 2;
+            if (Ext.isIE) {
+                a.l -= (this.offset - rad);
+                a.t -= (this.offset - rad);
+                a.l += 1;
+                a.w -= (this.offset + rad + 1);
+                a.h -= (this.offset + rad);
+                a.h += 1;
+            }
+        break;
+    };
+
+    this.adjusts = a;
+};
+
+Ext.Shadow.prototype = {
+    /**
+     * @cfg {String} mode
+     * The shadow display mode.  Supports the following options:<div class="mdetail-params"><ul>
+     * <li><b><tt>sides</tt></b> : Shadow displays on both sides and bottom only</li>
+     * <li><b><tt>frame</tt></b> : Shadow displays equally on all four sides</li>
+     * <li><b><tt>drop</tt></b> : Traditional bottom-right drop shadow</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {String} offset
+     * The number of pixels to offset the shadow from the element (defaults to <tt>4</tt>)
+     */
+    offset: 4,
+
+    // private
+    defaultMode: "drop",
+
+    /**
+     * Displays the shadow under the target element
+     * @param {Mixed} targetEl The id or element under which the shadow should display
+     */
+    show: function(target) {
+        target = Ext.get(target);
+        if (!this.el) {
+            this.el = Ext.Shadow.Pool.pull();
+            if (this.el.dom.nextSibling != target.dom) {
+                this.el.insertBefore(target);
+            }
+        }
+        this.el.setStyle("z-index", this.zIndex || parseInt(target.getStyle("z-index"), 10) - 1);
+        if (Ext.isIE) {
+            this.el.dom.style.filter = "progid:DXImageTransform.Microsoft.alpha(opacity=50) progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (this.offset) + ")";
+        }
+        this.realign(
+        target.getLeft(true),
+        target.getTop(true),
+        target.getWidth(),
+        target.getHeight()
+        );
+        this.el.dom.style.display = "block";
+    },
+
+    /**
+     * Returns true if the shadow is visible, else false
+     */
+    isVisible: function() {
+        return this.el ? true: false;
+    },
+
+    /**
+     * Direct alignment when values are already available. Show must be called at least once before
+     * calling this method to ensure it is initialized.
+     * @param {Number} left The target element left position
+     * @param {Number} top The target element top position
+     * @param {Number} width The target element width
+     * @param {Number} height The target element height
+     */
+    realign: function(l, t, w, h) {
+        if (!this.el) {
+            return;
+        }
+        var a = this.adjusts,
+            d = this.el.dom,
+            s = d.style,
+            iea = 0,
+            sw = (w + a.w),
+            sh = (h + a.h),
+            sws = sw + "px",
+            shs = sh + "px",
+            cn,
+            sww;
+        s.left = (l + a.l) + "px";
+        s.top = (t + a.t) + "px";
+        if (s.width != sws || s.height != shs) {
+            s.width = sws;
+            s.height = shs;
+            if (!Ext.isIE) {
+                cn = d.childNodes;
+                sww = Math.max(0, (sw - 12)) + "px";
+                cn[0].childNodes[1].style.width = sww;
+                cn[1].childNodes[1].style.width = sww;
+                cn[2].childNodes[1].style.width = sww;
+                cn[1].style.height = Math.max(0, (sh - 12)) + "px";
+            }
+        }
+    },
+
+    /**
+     * Hides this shadow
+     */
+    hide: function() {
+        if (this.el) {
+            this.el.dom.style.display = "none";
+            Ext.Shadow.Pool.push(this.el);
+            delete this.el;
+        }
+    },
+
+    /**
+     * Adjust the z-index of this shadow
+     * @param {Number} zindex The new z-index
+     */
+    setZIndex: function(z) {
+        this.zIndex = z;
+        if (this.el) {
+            this.el.setStyle("z-index", z);
+        }
+    }
+};
+
+// Private utility class that manages the internal Shadow cache
+Ext.Shadow.Pool = function() {
+    var p = [],
+        markup = Ext.isIE ?
+            '<div class="x-ie-shadow"></div>':
+            '<div class="x-shadow"><div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div></div>';
+    return {
+        pull: function() {
+            var sh = p.shift();
+            if (!sh) {
+                sh = Ext.get(Ext.DomHelper.insertHtml("beforeBegin", document.body.firstChild, markup));
+                sh.autoBoxAdjust = false;
+            }
+            return sh;
+        },
+
+        push: function(sh) {
+            p.push(sh);
+        }
+    };
+}();/**
+ * @class Ext.BoxComponent
+ * @extends Ext.Component
+ * <p>Base class for any {@link Ext.Component Component} that is to be sized as a box, using width and height.</p>
+ * <p>BoxComponent provides automatic box model adjustments for sizing and positioning and will work correctly
+ * within the Component rendering model.</p>
+ * <p>A BoxComponent may be created as a custom Component which encapsulates any HTML element, either a pre-existing
+ * element, or one that is created to your specifications at render time. Usually, to participate in layouts,
+ * a Component will need to be a <b>Box</b>Component in order to have its width and height managed.</p>
+ * <p>To use a pre-existing element as a BoxComponent, configure it so that you preset the <b>el</b> property to the
+ * element to reference:<pre><code>
+var pageHeader = new Ext.BoxComponent({
+    el: 'my-header-div'
+});</code></pre>
+ * This may then be {@link Ext.Container#add added} to a {@link Ext.Container Container} as a child item.</p>
+ * <p>To create a BoxComponent based around a HTML element to be created at render time, use the
+ * {@link Ext.Component#autoEl autoEl} config option which takes the form of a
+ * {@link Ext.DomHelper DomHelper} specification:<pre><code>
+var myImage = new Ext.BoxComponent({
+    autoEl: {
+        tag: 'img',
+        src: '/images/my-image.jpg'
+    }
+});</code></pre></p>
+ * @constructor
+ * @param {Ext.Element/String/Object} config The configuration options.
+ * @xtype box
+ */
+Ext.BoxComponent = Ext.extend(Ext.Component, {
+
+    // Configs below are used for all Components when rendered by BoxLayout.
+    /**
+     * @cfg {Number} flex
+     * <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use a <b>{@link Ext.layout.BoxLayout BoxLayout}.</b>
+     * Each child Component with a <code>flex</code> property will be flexed either vertically (by a VBoxLayout)
+     * or horizontally (by an HBoxLayout) according to the item's <b>relative</b> <code>flex</code> value
+     * compared to the sum of all Components with <code>flex</flex> value specified. Any child items that have
+     * either a <code>flex = 0</code> or <code>flex = undefined</code> will not be 'flexed' (the initial size will not be changed).
+     */
+    // Configs below are used for all Components when rendered by AnchorLayout.
+    /**
+     * @cfg {String} anchor <p><b>Note</b>: this config is only used when this Component is rendered
+     * by a Container which has been configured to use an <b>{@link Ext.layout.AnchorLayout AnchorLayout} (or subclass thereof).</b>
+     * based layout manager, for example:<div class="mdetail-params"><ul>
+     * <li>{@link Ext.form.FormPanel}</li>
+     * <li>specifying <code>layout: 'anchor' // or 'form', or 'absolute'</code></li>
+     * </ul></div></p>
+     * <p>See {@link Ext.layout.AnchorLayout}.{@link Ext.layout.AnchorLayout#anchor anchor} also.</p>
+     */
+    // tabTip config is used when a BoxComponent is a child of a TabPanel
+    /**
+     * @cfg {String} tabTip
+     * <p><b>Note</b>: this config is only used when this BoxComponent is a child item of a TabPanel.</p>
+     * A string to be used as innerHTML (html tags are accepted) to show in a tooltip when mousing over
+     * the associated tab selector element. {@link Ext.QuickTips}.init()
+     * must be called in order for the tips to render.
+     */
+    // Configs below are used for all Components when rendered by BorderLayout.
+    /**
+     * @cfg {String} region <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * layout manager (e.g. specifying <tt>layout:'border'</tt>).</p><br>
+     * <p>See {@link Ext.layout.BorderLayout} also.</p>
+     */
+    // margins config is used when a BoxComponent is rendered by BorderLayout or BoxLayout.
+    /**
+     * @cfg {Object} margins <p><b>Note</b>: this config is only used when this BoxComponent is rendered
+     * by a Container which has been configured to use the <b>{@link Ext.layout.BorderLayout BorderLayout}</b>
+     * or one of the two <b>{@link Ext.layout.BoxLayout BoxLayout} subclasses.</b></p>
+     * <p>An object containing margins to apply to this BoxComponent in the
+     * format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Number} x
+     * The local x (left) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} y
+     * The local y (top) coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageX
+     * The page level x coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} pageY
+     * The page level y coordinate for this component if contained within a positioning container.
+     */
+    /**
+     * @cfg {Number} height
+     * The height of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} width
+     * The width of this component in pixels (defaults to auto).
+     * <b>Note</b> to express this dimension as a percentage or offset see {@link Ext.Component#anchor}.
+     */
+    /**
+     * @cfg {Number} boxMinHeight
+     * <p>The minimum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMinWidth
+     * <p>The minimum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxHeight
+     * <p>The maximum value in pixels which this BoxComponent will set its height to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Number} boxMaxWidth
+     * <p>The maximum value in pixels which this BoxComponent will set its width to.</p>
+     * <p><b>Warning:</b> This will override any size management applied by layout managers.</p>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <p>True to use height:'auto', false to use fixed height (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components inherit this config option, not all will
+     * function as expected with a height of 'auto'. Setting autoHeight:true means that the
+     * browser will manage height based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the height, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the height might
+     * result in elements needing to be synchronized with the new height. Example:</p><pre><code>
+var w = new Ext.Window({
+    title: 'Window',
+    width: 600,
+    autoHeight: true,
+    items: {
+        title: 'Collapse Me',
+        height: 400,
+        collapsible: true,
+        border: false,
+        listeners: {
+            beforecollapse: function() {
+                w.el.shadow.hide();
+            },
+            beforeexpand: function() {
+                w.el.shadow.hide();
+            },
+            collapse: function() {
+                w.syncShadow();
+            },
+            expand: function() {
+                w.syncShadow();
+            }
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * <p>True to use width:'auto', false to use fixed width (or allow it to be managed by its parent
+     * Container's {@link Ext.Container#layout layout manager}. Defaults to false.</p>
+     * <p><b>Note</b>: Although many components  inherit this config option, not all will
+     * function as expected with a width of 'auto'. Setting autoWidth:true means that the
+     * browser will manage width based on the element's contents, and that Ext will not manage it at all.</p>
+     * <p>If the <i>browser</i> is managing the width, be aware that resizes performed by the browser in response
+     * to changes within the structure of the Component cannot be detected. Therefore changes to the width might
+     * result in elements needing to be synchronized with the new width. For example, where the target element is:</p><pre><code>
+&lt;div id='grid-container' style='margin-left:25%;width:50%'>&lt;/div>
+</code></pre>
+     * A Panel rendered into that target element must listen for browser window resize in order to relay its
+      * child items when the browser changes its width:<pre><code>
+var myPanel = new Ext.Panel({
+    renderTo: 'grid-container',
+    monitorResize: true, // relay on browser resize
+    title: 'Panel',
+    height: 400,
+    autoWidth: true,
+    layout: 'hbox',
+    layoutConfig: {
+        align: 'stretch'
+    },
+    defaults: {
+        flex: 1
+    },
+    items: [{
+        title: 'Box 1',
+    }, {
+        title: 'Box 2'
+    }, {
+        title: 'Box 3'
+    }],
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoScroll
+     * <code>true</code> to use overflow:'auto' on the components layout element and show scroll bars automatically when
+     * necessary, <code>false</code> to clip any overflowing content (defaults to <code>false</code>).
+     */
+
+    /* // private internal config
+     * {Boolean} deferHeight
+     * True to defer height calculations to an external component, false to allow this component to set its own
+     * height (defaults to false).
+     */
+
+    // private
+    initComponent : function(){
+        Ext.BoxComponent.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event resize
+             * Fires after the component is resized.
+             * @param {Ext.Component} this
+             * @param {Number} adjWidth The box-adjusted width that was set
+             * @param {Number} adjHeight The box-adjusted height that was set
+             * @param {Number} rawWidth The width that was originally specified
+             * @param {Number} rawHeight The height that was originally specified
+             */
+            'resize',
+            /**
+             * @event move
+             * Fires after the component is moved.
+             * @param {Ext.Component} this
+             * @param {Number} x The new x position
+             * @param {Number} y The new y position
+             */
+            'move'
+        );
+    },
+
+    // private, set in afterRender to signify that the component has been rendered
+    boxReady : false,
+    // private, used to defer height settings to subclasses
+    deferHeight: false,
+
+    /**
+     * Sets the width and height of this BoxComponent. This method fires the {@link #resize} event. This method can accept
+     * either width and height as separate arguments, or you can pass a size object like <code>{width:10, height:20}</code>.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * <li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+     * <li><code>undefined</code> to leave the width unchanged.</li>
+     * </ul></div>
+     * @param {Mixed} height The new height to set (not required if a size object is passed as the first arg).
+     * This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+     * <li><code>undefined</code> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setSize : function(w, h){
+
+        // support for standard size objects
+        if(typeof w == 'object'){
+            h = w.height;
+            w = w.width;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMinWidth) && (w < this.boxMinWidth)) {
+            w = this.boxMinWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMinHeight) && (h < this.boxMinHeight)) {
+            h = this.boxMinHeight;
+        }
+        if (Ext.isDefined(w) && Ext.isDefined(this.boxMaxWidth) && (w > this.boxMaxWidth)) {
+            w = this.boxMaxWidth;
+        }
+        if (Ext.isDefined(h) && Ext.isDefined(this.boxMaxHeight) && (h > this.boxMaxHeight)) {
+            h = this.boxMaxHeight;
+        }
+        // not rendered
+        if(!this.boxReady){
+            this.width  = w;
+            this.height = h;
+            return this;
+        }
+
+        // prevent recalcs when not needed
+        if(this.cacheSizes !== false && this.lastSize && this.lastSize.width == w && this.lastSize.height == h){
+            return this;
+        }
+        this.lastSize = {width: w, height: h};
+        var adj = this.adjustSize(w, h),
+            aw = adj.width,
+            ah = adj.height,
+            rz;
+        if(aw !== undefined || ah !== undefined){ // this code is nasty but performs better with floaters
+            rz = this.getResizeEl();
+            if(!this.deferHeight && aw !== undefined && ah !== undefined){
+                rz.setSize(aw, ah);
+            }else if(!this.deferHeight && ah !== undefined){
+                rz.setHeight(ah);
+            }else if(aw !== undefined){
+                rz.setWidth(aw);
+            }
+            this.onResize(aw, ah, w, h);
+            this.fireEvent('resize', this, aw, ah, w, h);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the width of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} width The new width to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new width in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS width style.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setWidth : function(width){
+        return this.setSize(width);
+    },
+
+    /**
+     * Sets the height of the component.  This method fires the {@link #resize} event.
+     * @param {Mixed} height The new height to set. This may be one of:<div class="mdetail-params"><ul>
+     * <li>A Number specifying the new height in the {@link #getEl Element}'s {@link Ext.Element#defaultUnit defaultUnit}s (by default, pixels).</li>
+     * <li>A String used to set the CSS height style.</li>
+     * <li><i>undefined</i> to leave the height unchanged.</li>
+     * </ul></div>
+     * @return {Ext.BoxComponent} this
+     */
+    setHeight : function(height){
+        return this.setSize(undefined, height);
+    },
+
+    /**
+     * Gets the current size of the component's underlying element.
+     * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+     */
+    getSize : function(){
+        return this.getResizeEl().getSize();
+    },
+
+    /**
+     * Gets the current width of the component's underlying element.
+     * @return {Number}
+     */
+    getWidth : function(){
+        return this.getResizeEl().getWidth();
+    },
+
+    /**
+     * Gets the current height of the component's underlying element.
+     * @return {Number}
+     */
+    getHeight : function(){
+        return this.getResizeEl().getHeight();
+    },
+
+    /**
+     * Gets the current size of the component's underlying element, including space taken by its margins.
+     * @return {Object} An object containing the element's size {width: (element width + left/right margins), height: (element height + top/bottom margins)}
+     */
+    getOuterSize : function(){
+        var el = this.getResizeEl();
+        return {width: el.getWidth() + el.getMargins('lr'),
+                height: el.getHeight() + el.getMargins('tb')};
+    },
+
+    /**
+     * Gets the current XY position of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Array} The XY position of the element (e.g., [100, 200])
+     */
+    getPosition : function(local){
+        var el = this.getPositionEl();
+        if(local === true){
+            return [el.getLeft(true), el.getTop(true)];
+        }
+        return this.xy || el.getXY();
+    },
+
+    /**
+     * Gets the current box measurements of the component's underlying element.
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
+     * @return {Object} box An object in the format {x, y, width, height}
+     */
+    getBox : function(local){
+        var pos = this.getPosition(local);
+        var s = this.getSize();
+        s.x = pos[0];
+        s.y = pos[1];
+        return s;
+    },
+
+    /**
+     * Sets the current box measurements of the component's underlying element.
+     * @param {Object} box An object in the format {x, y, width, height}
+     * @return {Ext.BoxComponent} this
+     */
+    updateBox : function(box){
+        this.setSize(box.width, box.height);
+        this.setPagePosition(box.x, box.y);
+        return this;
+    },
+
+    /**
+     * <p>Returns the outermost Element of this Component which defines the Components overall size.</p>
+     * <p><i>Usually</i> this will return the same Element as <code>{@link #getEl}</code>,
+     * but in some cases, a Component may have some more wrapping Elements around its main
+     * active Element.</p>
+     * <p>An example is a ComboBox. It is encased in a <i>wrapping</i> Element which
+     * contains both the <code>&lt;input></code> Element (which is what would be returned
+     * by its <code>{@link #getEl}</code> method, <i>and</i> the trigger button Element.
+     * This Element is returned as the <code>resizeEl</code>.
+     * @return {Ext.Element} The Element which is to be resized by size managing layouts.
+     */
+    getResizeEl : function(){
+        return this.resizeEl || this.el;
+    },
+
+    /**
+     * Sets the overflow on the content element of the component.
+     * @param {Boolean} scroll True to allow the Component to auto scroll.
+     * @return {Ext.BoxComponent} this
+     */
+    setAutoScroll : function(scroll){
+        if(this.rendered){
+            this.getContentTarget().setOverflow(scroll ? 'auto' : '');
+        }
+        this.autoScroll = scroll;
+        return this;
+    },
+
+    /**
+     * Sets the left and top of the component.  To set the page XY position instead, use {@link #setPagePosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} left The new left
+     * @param {Number} top The new top
+     * @return {Ext.BoxComponent} this
+     */
+    setPosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.x = x;
+        this.y = y;
+        if(!this.boxReady){
+            return this;
+        }
+        var adj = this.adjustPosition(x, y);
+        var ax = adj.x, ay = adj.y;
+
+        var el = this.getPositionEl();
+        if(ax !== undefined || ay !== undefined){
+            if(ax !== undefined && ay !== undefined){
+                el.setLeftTop(ax, ay);
+            }else if(ax !== undefined){
+                el.setLeft(ax);
+            }else if(ay !== undefined){
+                el.setTop(ay);
+            }
+            this.onPosition(ax, ay);
+            this.fireEvent('move', this, ax, ay);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the page XY position of the component.  To set the left and top instead, use {@link #setPosition}.
+     * This method fires the {@link #move} event.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     * @return {Ext.BoxComponent} this
+     */
+    setPagePosition : function(x, y){
+        if(x && typeof x[1] == 'number'){
+            y = x[1];
+            x = x[0];
+        }
+        this.pageX = x;
+        this.pageY = y;
+        if(!this.boxReady){
+            return;
+        }
+        if(x === undefined || y === undefined){ // cannot translate undefined points
+            return;
+        }
+        var p = this.getPositionEl().translatePoints(x, y);
+        this.setPosition(p.left, p.top);
+        return this;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.BoxComponent.superclass.afterRender.call(this);
+        if(this.resizeEl){
+            this.resizeEl = Ext.get(this.resizeEl);
+        }
+        if(this.positionEl){
+            this.positionEl = Ext.get(this.positionEl);
+        }
+        this.boxReady = true;
+        Ext.isDefined(this.autoScroll) && this.setAutoScroll(this.autoScroll);
+        this.setSize(this.width, this.height);
+        if(this.x || this.y){
+            this.setPosition(this.x, this.y);
+        }else if(this.pageX || this.pageY){
+            this.setPagePosition(this.pageX, this.pageY);
+        }
+    },
+
+    /**
+     * Force the component's size to recalculate based on the underlying element's current height and width.
+     * @return {Ext.BoxComponent} this
+     */
+    syncSize : function(){
+        delete this.lastSize;
+        this.setSize(this.autoWidth ? undefined : this.getResizeEl().getWidth(), this.autoHeight ? undefined : this.getResizeEl().getHeight());
+        return this;
+    },
+
+    /* // protected
+     * Called after the component is resized, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a resize occurs.
+     * @param {Number} adjWidth The box-adjusted width that was set
+     * @param {Number} adjHeight The box-adjusted height that was set
+     * @param {Number} rawWidth The width that was originally specified
+     * @param {Number} rawHeight The height that was originally specified
+     */
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+    },
+
+    /* // protected
+     * Called after the component is moved, this method is empty by default but can be implemented by any
+     * subclass that needs to perform custom logic after a move occurs.
+     * @param {Number} x The new x position
+     * @param {Number} y The new y position
+     */
+    onPosition : function(x, y){
+
+    },
+
+    // private
+    adjustSize : function(w, h){
+        if(this.autoWidth){
+            w = 'auto';
+        }
+        if(this.autoHeight){
+            h = 'auto';
+        }
+        return {width : w, height: h};
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        return {x : x, y: y};
+    }
+});
+Ext.reg('box', Ext.BoxComponent);
+
+
+/**
+ * @class Ext.Spacer
+ * @extends Ext.BoxComponent
+ * <p>Used to provide a sizable space in a layout.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Spacer = Ext.extend(Ext.BoxComponent, {
+    autoEl:'div'
+});
+Ext.reg('spacer', Ext.Spacer);/**
+ * @class Ext.SplitBar
+ * @extends Ext.util.Observable
+ * Creates draggable splitter bar functionality from two elements (element to be dragged and element to be resized).
+ * <br><br>
+ * Usage:
+ * <pre><code>
+var split = new Ext.SplitBar("elementToDrag", "elementToSize",
+                   Ext.SplitBar.HORIZONTAL, Ext.SplitBar.LEFT);
+split.setAdapter(new Ext.SplitBar.AbsoluteLayoutAdapter("container"));
+split.minSize = 100;
+split.maxSize = 600;
+split.animate = true;
+split.on('moved', splitterMoved);
+</code></pre>
+ * @constructor
+ * Create a new SplitBar
+ * @param {Mixed} dragElement The element to be dragged and act as the SplitBar.
+ * @param {Mixed} resizingElement The element to be resized based on where the SplitBar element is dragged
+ * @param {Number} orientation (optional) Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+ * @param {Number} placement (optional) Either Ext.SplitBar.LEFT or Ext.SplitBar.RIGHT for horizontal or
+                        Ext.SplitBar.TOP or Ext.SplitBar.BOTTOM for vertical. (By default, this is determined automatically by the initial
+                        position of the SplitBar).
+ */
+Ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){
+
+    /** @private */
+    this.el = Ext.get(dragElement, true);
+    this.el.dom.unselectable = "on";
+    /** @private */
+    this.resizingEl = Ext.get(resizingElement, true);
+
+    /**
+     * @private
+     * The orientation of the split. Either Ext.SplitBar.HORIZONTAL or Ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+     * Note: If this is changed after creating the SplitBar, the placement property must be manually updated
+     * @type Number
+     */
+    this.orientation = orientation || Ext.SplitBar.HORIZONTAL;
+
+    /**
+     * The increment, in pixels by which to move this SplitBar. When <i>undefined</i>, the SplitBar moves smoothly.
+     * @type Number
+     * @property tickSize
+     */
+    /**
+     * The minimum size of the resizing element. (Defaults to 0)
+     * @type Number
+     */
+    this.minSize = 0;
+
+    /**
+     * The maximum size of the resizing element. (Defaults to 2000)
+     * @type Number
+     */
+    this.maxSize = 2000;
+
+    /**
+     * Whether to animate the transition to the new size
+     * @type Boolean
+     */
+    this.animate = false;
+
+    /**
+     * Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.
+     * @type Boolean
+     */
+    this.useShim = false;
+
+    /** @private */
+    this.shim = null;
+
+    if(!existingProxy){
+        /** @private */
+        this.proxy = Ext.SplitBar.createProxy(this.orientation);
+    }else{
+        this.proxy = Ext.get(existingProxy).dom;
+    }
+    /** @private */
+    this.dd = new Ext.dd.DDProxy(this.el.dom.id, "XSplitBars", {dragElId : this.proxy.id});
+
+    /** @private */
+    this.dd.b4StartDrag = this.onStartProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dd.endDrag = this.onEndProxyDrag.createDelegate(this);
+
+    /** @private */
+    this.dragSpecs = {};
+
+    /**
+     * @private The adapter to use to positon and resize elements
+     */
+    this.adapter = new Ext.SplitBar.BasicLayoutAdapter();
+    this.adapter.init(this);
+
+    if(this.orientation == Ext.SplitBar.HORIZONTAL){
+        /** @private */
+        this.placement = placement || (this.el.getX() > this.resizingEl.getX() ? Ext.SplitBar.LEFT : Ext.SplitBar.RIGHT);
+        this.el.addClass("x-splitbar-h");
+    }else{
+        /** @private */
+        this.placement = placement || (this.el.getY() > this.resizingEl.getY() ? Ext.SplitBar.TOP : Ext.SplitBar.BOTTOM);
+        this.el.addClass("x-splitbar-v");
+    }
+
+    this.addEvents(
+        /**
+         * @event resize
+         * Fires when the splitter is moved (alias for {@link #moved})
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "resize",
+        /**
+         * @event moved
+         * Fires when the splitter is moved
+         * @param {Ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        "moved",
+        /**
+         * @event beforeresize
+         * Fires before the splitter is dragged
+         * @param {Ext.SplitBar} this
+         */
+        "beforeresize",
+
+        "beforeapply"
+    );
+
+    Ext.SplitBar.superclass.constructor.call(this);
+};
+
+Ext.extend(Ext.SplitBar, Ext.util.Observable, {
+    onStartProxyDrag : function(x, y){
+        this.fireEvent("beforeresize", this);
+        this.overlay =  Ext.DomHelper.append(document.body,  {cls: "x-drag-overlay", html: "&#160;"}, true);
+        this.overlay.unselectable();
+        this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        this.overlay.show();
+        Ext.get(this.proxy).setDisplayed("block");
+        var size = this.adapter.getElementSize(this);
+        this.activeMinSize = this.getMinimumSize();
+        this.activeMaxSize = this.getMaximumSize();
+        var c1 = size - this.activeMinSize;
+        var c2 = Math.max(this.activeMaxSize - size, 0);
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(
+                this.placement == Ext.SplitBar.LEFT ? c1 : c2,
+                this.placement == Ext.SplitBar.LEFT ? c2 : c1,
+                this.tickSize
+            );
+            this.dd.setYConstraint(0, 0);
+        }else{
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(0, 0);
+            this.dd.setYConstraint(
+                this.placement == Ext.SplitBar.TOP ? c1 : c2,
+                this.placement == Ext.SplitBar.TOP ? c2 : c1,
+                this.tickSize
+            );
+         }
+        this.dragSpecs.startSize = size;
+        this.dragSpecs.startPoint = [x, y];
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this.dd, x, y);
+    },
+
+    /**
+     * @private Called after the drag operation by the DDProxy
+     */
+    onEndProxyDrag : function(e){
+        Ext.get(this.proxy).setDisplayed(false);
+        var endPoint = Ext.lib.Event.getXY(e);
+        if(this.overlay){
+            Ext.destroy(this.overlay);
+            delete this.overlay;
+        }
+        var newSize;
+        if(this.orientation == Ext.SplitBar.HORIZONTAL){
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.LEFT ?
+                    endPoint[0] - this.dragSpecs.startPoint[0] :
+                    this.dragSpecs.startPoint[0] - endPoint[0]
+                );
+        }else{
+            newSize = this.dragSpecs.startSize +
+                (this.placement == Ext.SplitBar.TOP ?
+                    endPoint[1] - this.dragSpecs.startPoint[1] :
+                    this.dragSpecs.startPoint[1] - endPoint[1]
+                );
+        }
+        newSize = Math.min(Math.max(newSize, this.activeMinSize), this.activeMaxSize);
+        if(newSize != this.dragSpecs.startSize){
+            if(this.fireEvent('beforeapply', this, newSize) !== false){
+                this.adapter.setElementSize(this, newSize);
+                this.fireEvent("moved", this, newSize);
+                this.fireEvent("resize", this, newSize);
+            }
+        }
+    },
+
+    /**
+     * Get the adapter this SplitBar uses
+     * @return The adapter object
+     */
+    getAdapter : function(){
+        return this.adapter;
+    },
+
+    /**
+     * Set the adapter this SplitBar uses
+     * @param {Object} adapter A SplitBar adapter object
+     */
+    setAdapter : function(adapter){
+        this.adapter = adapter;
+        this.adapter.init(this);
+    },
+
+    /**
+     * Gets the minimum size for the resizing element
+     * @return {Number} The minimum size
+     */
+    getMinimumSize : function(){
+        return this.minSize;
+    },
+
+    /**
+     * Sets the minimum size for the resizing element
+     * @param {Number} minSize The minimum size
+     */
+    setMinimumSize : function(minSize){
+        this.minSize = minSize;
+    },
+
+    /**
+     * Gets the maximum size for the resizing element
+     * @return {Number} The maximum size
+     */
+    getMaximumSize : function(){
+        return this.maxSize;
+    },
+
+    /**
+     * Sets the maximum size for the resizing element
+     * @param {Number} maxSize The maximum size
+     */
+    setMaximumSize : function(maxSize){
+        this.maxSize = maxSize;
+    },
+
+    /**
+     * Sets the initialize size for the resizing element
+     * @param {Number} size The initial size
+     */
+    setCurrentSize : function(size){
+        var oldAnimate = this.animate;
+        this.animate = false;
+        this.adapter.setElementSize(this, size);
+        this.animate = oldAnimate;
+    },
+
+    /**
+     * Destroy this splitbar.
+     * @param {Boolean} removeEl True to remove the element
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.shim, Ext.get(this.proxy));
+        this.dd.unreg();
+        if(removeEl){
+            this.el.remove();
+        }
+        this.purgeListeners();
+    }
+});
+
+/**
+ * @private static Create our own proxy element element. So it will be the same same size on all browsers, we won't use borders. Instead we use a background color.
+ */
+Ext.SplitBar.createProxy = function(dir){
+    var proxy = new Ext.Element(document.createElement("div"));
+    document.body.appendChild(proxy.dom);
+    proxy.unselectable();
+    var cls = 'x-splitbar-proxy';
+    proxy.addClass(cls + ' ' + (dir == Ext.SplitBar.HORIZONTAL ? cls +'-h' : cls + '-v'));
+    return proxy.dom;
+};
+
+/**
+ * @class Ext.SplitBar.BasicLayoutAdapter
+ * Default Adapter. It assumes the splitter and resizing element are not positioned
+ * elements and only gets/sets the width of the element. Generally used for table based layouts.
+ */
+Ext.SplitBar.BasicLayoutAdapter = function(){
+};
+
+Ext.SplitBar.BasicLayoutAdapter.prototype = {
+    // do nothing for now
+    init : function(s){
+
+    },
+    /**
+     * Called before drag operations to get the current size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     */
+     getElementSize : function(s){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            return s.resizingEl.getWidth();
+        }else{
+            return s.resizingEl.getHeight();
+        }
+    },
+
+    /**
+     * Called after drag operations to set the size of the resizing element.
+     * @param {Ext.SplitBar} s The SplitBar using this adapter
+     * @param {Number} newSize The new size to set
+     * @param {Function} onComplete A function to be invoked when resizing is complete
+     */
+    setElementSize : function(s, newSize, onComplete){
+        if(s.orientation == Ext.SplitBar.HORIZONTAL){
+            if(!s.animate){
+                s.resizingEl.setWidth(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setWidth(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }else{
+
+            if(!s.animate){
+                s.resizingEl.setHeight(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setHeight(newSize, true, .1, onComplete, 'easeOut');
+            }
+        }
+    }
+};
+
+/**
+ *@class Ext.SplitBar.AbsoluteLayoutAdapter
+ * @extends Ext.SplitBar.BasicLayoutAdapter
+ * Adapter that  moves the splitter element to align with the resized sizing element.
+ * Used with an absolute positioned SplitBar.
+ * @param {Mixed} container The container that wraps around the absolute positioned content. If it's
+ * document.body, make sure you assign an id to the body element.
+ */
+Ext.SplitBar.AbsoluteLayoutAdapter = function(container){
+    this.basic = new Ext.SplitBar.BasicLayoutAdapter();
+    this.container = Ext.get(container);
+};
+
+Ext.SplitBar.AbsoluteLayoutAdapter.prototype = {
+    init : function(s){
+        this.basic.init(s);
+    },
+
+    getElementSize : function(s){
+        return this.basic.getElementSize(s);
+    },
+
+    setElementSize : function(s, newSize, onComplete){
+        this.basic.setElementSize(s, newSize, this.moveSplitter.createDelegate(this, [s]));
+    },
+
+    moveSplitter : function(s){
+        var yes = Ext.SplitBar;
+        switch(s.placement){
+            case yes.LEFT:
+                s.el.setX(s.resizingEl.getRight());
+                break;
+            case yes.RIGHT:
+                s.el.setStyle("right", (this.container.getWidth() - s.resizingEl.getLeft()) + "px");
+                break;
+            case yes.TOP:
+                s.el.setY(s.resizingEl.getBottom());
+                break;
+            case yes.BOTTOM:
+                s.el.setY(s.resizingEl.getTop() - s.el.getHeight());
+                break;
+        }
+    }
+};
+
+/**
+ * Orientation constant - Create a vertical SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.VERTICAL = 1;
+
+/**
+ * Orientation constant - Create a horizontal SplitBar
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.HORIZONTAL = 2;
+
+/**
+ * Placement constant - The resizing element is to the left of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.LEFT = 1;
+
+/**
+ * Placement constant - The resizing element is to the right of the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.RIGHT = 2;
+
+/**
+ * Placement constant - The resizing element is positioned above the splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.TOP = 3;
+
+/**
+ * Placement constant - The resizing element is positioned under splitter element
+ * @static
+ * @type Number
+ */
+Ext.SplitBar.BOTTOM = 4;
+/**
+ * @class Ext.Container
+ * @extends Ext.BoxComponent
+ * <p>Base class for any {@link Ext.BoxComponent} that may contain other Components. Containers handle the
+ * basic behavior of containing items, namely adding, inserting and removing items.</p>
+ *
+ * <p>The most commonly used Container classes are {@link Ext.Panel}, {@link Ext.Window} and {@link Ext.TabPanel}.
+ * If you do not need the capabilities offered by the aforementioned classes you can create a lightweight
+ * Container to be encapsulated by an HTML element to your specifications by using the
+ * <code><b>{@link Ext.Component#autoEl autoEl}</b></code> config option. This is a useful technique when creating
+ * embedded {@link Ext.layout.ColumnLayout column} layouts inside {@link Ext.form.FormPanel FormPanels}
+ * for example.</p>
+ *
+ * <p>The code below illustrates both how to explicitly create a Container, and how to implicitly
+ * create one using the <b><code>'container'</code></b> xtype:<pre><code>
+// explicitly create a Container
+var embeddedColumns = new Ext.Container({
+    autoEl: 'div',  // This is the default
+    layout: 'column',
+    defaults: {
+        // implicitly create Container by specifying xtype
+        xtype: 'container',
+        autoEl: 'div', // This is the default.
+        layout: 'form',
+        columnWidth: 0.5,
+        style: {
+            padding: '10px'
+        }
+    },
+//  The two items below will be Ext.Containers, each encapsulated by a &lt;DIV> element.
+    items: [{
+        items: {
+            xtype: 'datefield',
+            name: 'startDate',
+            fieldLabel: 'Start date'
+        }
+    }, {
+        items: {
+            xtype: 'datefield',
+            name: 'endDate',
+            fieldLabel: 'End date'
+        }
+    }]
+});</code></pre></p>
+ *
+ * <p><u><b>Layout</b></u></p>
+ * <p>Container classes delegate the rendering of child Components to a layout
+ * manager class which must be configured into the Container using the
+ * <code><b>{@link #layout}</b></code> configuration property.</p>
+ * <p>When either specifying child <code>{@link #items}</code> of a Container,
+ * or dynamically {@link #add adding} Components to a Container, remember to
+ * consider how you wish the Container to arrange those child elements, and
+ * whether those child elements need to be sized using one of Ext's built-in
+ * <b><code>{@link #layout}</code></b> schemes. By default, Containers use the
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme which only
+ * renders child components, appending them one after the other inside the
+ * Container, and <b>does not apply any sizing</b> at all.</p>
+ * <p>A common mistake is when a developer neglects to specify a
+ * <b><code>{@link #layout}</code></b> (e.g. widgets like GridPanels or
+ * TreePanels are added to Containers for which no <code><b>{@link #layout}</b></code>
+ * has been specified). If a Container is left to use the default
+ * {@link Ext.layout.ContainerLayout ContainerLayout} scheme, none of its
+ * child components will be resized, or changed in any way when the Container
+ * is resized.</p>
+ * <p>Certain layout managers allow dynamic addition of child components.
+ * Those that do include {@link Ext.layout.CardLayout},
+ * {@link Ext.layout.AnchorLayout}, {@link Ext.layout.FormLayout}, and
+ * {@link Ext.layout.TableLayout}. For example:<pre><code>
+//  Create the GridPanel.
+var myNewGrid = new Ext.grid.GridPanel({
+    store: myStore,
+    columns: myColumnModel,
+    title: 'Results', // the title becomes the title of the tab
+});
+
+myTabPanel.add(myNewGrid); // {@link Ext.TabPanel} implicitly uses {@link Ext.layout.CardLayout CardLayout}
+myTabPanel.{@link Ext.TabPanel#setActiveTab setActiveTab}(myNewGrid);
+ * </code></pre></p>
+ * <p>The example above adds a newly created GridPanel to a TabPanel. Note that
+ * a TabPanel uses {@link Ext.layout.CardLayout} as its layout manager which
+ * means all its child items are sized to {@link Ext.layout.FitLayout fit}
+ * exactly into its client area.
+ * <p><b><u>Overnesting is a common problem</u></b>.
+ * An example of overnesting occurs when a GridPanel is added to a TabPanel
+ * by wrapping the GridPanel <i>inside</i> a wrapping Panel (that has no
+ * <code><b>{@link #layout}</b></code> specified) and then add that wrapping Panel
+ * to the TabPanel. The point to realize is that a GridPanel <b>is</b> a
+ * Component which can be added directly to a Container. If the wrapping Panel
+ * has no <code><b>{@link #layout}</b></code> configuration, then the overnested
+ * GridPanel will not be sized as expected.<p>
+ *
+ * <p><u><b>Adding via remote configuration</b></u></p>
+ *
+ * <p>A server side script can be used to add Components which are generated dynamically on the server.
+ * An example of adding a GridPanel to a TabPanel where the GridPanel is generated by the server
+ * based on certain parameters:
+ * </p><pre><code>
+// execute an Ajax request to invoke server side script:
+Ext.Ajax.request({
+    url: 'gen-invoice-grid.php',
+    // send additional parameters to instruct server script
+    params: {
+        startDate: Ext.getCmp('start-date').getValue(),
+        endDate: Ext.getCmp('end-date').getValue()
+    },
+    // process the response object to add it to the TabPanel:
+    success: function(xhr) {
+        var newComponent = eval(xhr.responseText); // see discussion below
+        myTabPanel.add(newComponent); // add the component to the TabPanel
+        myTabPanel.setActiveTab(newComponent);
+    },
+    failure: function() {
+        Ext.Msg.alert("Grid create failed", "Server communication failure");
+    }
+});
+</code></pre>
+ * <p>The server script needs to return an executable Javascript statement which, when processed
+ * using <code>eval()</code>, will return either a config object with an {@link Ext.Component#xtype xtype},
+ * or an instantiated Component. The server might return this for example:</p><pre><code>
+(function() {
+    function formatDate(value){
+        return value ? value.dateFormat('M d, Y') : '';
+    };
+
+    var store = new Ext.data.Store({
+        url: 'get-invoice-data.php',
+        baseParams: {
+            startDate: '01/01/2008',
+            endDate: '01/31/2008'
+        },
+        reader: new Ext.data.JsonReader({
+            record: 'transaction',
+            idProperty: 'id',
+            totalRecords: 'total'
+        }, [
+           'customer',
+           'invNo',
+           {name: 'date', type: 'date', dateFormat: 'm/d/Y'},
+           {name: 'value', type: 'float'}
+        ])
+    });
+
+    var grid = new Ext.grid.GridPanel({
+        title: 'Invoice Report',
+        bbar: new Ext.PagingToolbar(store),
+        store: store,
+        columns: [
+            {header: "Customer", width: 250, dataIndex: 'customer', sortable: true},
+            {header: "Invoice Number", width: 120, dataIndex: 'invNo', sortable: true},
+            {header: "Invoice Date", width: 100, dataIndex: 'date', renderer: formatDate, sortable: true},
+            {header: "Value", width: 120, dataIndex: 'value', renderer: 'usMoney', sortable: true}
+        ],
+    });
+    store.load();
+    return grid;  // return instantiated component
+})();
+</code></pre>
+ * <p>When the above code fragment is passed through the <code>eval</code> function in the success handler
+ * of the Ajax request, the code is executed by the Javascript processor, and the anonymous function
+ * runs, and returns the instantiated grid component.</p>
+ * <p>Note: since the code above is <i>generated</i> by a server script, the <code>baseParams</code> for
+ * the Store, the metadata to allow generation of the Record layout, and the ColumnModel
+ * can all be generated into the code since these are all known on the server.</p>
+ *
+ * @xtype container
+ */
+Ext.Container = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Boolean} monitorResize
+     * True to automatically monitor window resize events to handle anything that is sensitive to the current size
+     * of the viewport.  This value is typically managed by the chosen <code>{@link #layout}</code> and should not need
+     * to be set manually.
+     */
+    /**
+     * @cfg {String/Object} layout
+     * <p><b>*Important</b>: In order for child items to be correctly sized and
+     * positioned, typically a layout manager <b>must</b> be specified through
+     * the <code>layout</code> configuration option.</p>
+     * <br><p>The sizing and positioning of child {@link items} is the responsibility of
+     * the Container's layout manager which creates and manages the type of layout
+     * you have in mind.  For example:</p><pre><code>
+new Ext.Window({
+    width:300, height: 300,
+    layout: 'fit', // explicitly set layout manager: override the default (layout:'auto')
+    items: [{
+        title: 'Panel inside a Window'
+    }]
+}).show();
+     * </code></pre>
+     * <p>If the {@link #layout} configuration is not explicitly specified for
+     * a general purpose container (e.g. Container or Panel) the
+     * {@link Ext.layout.ContainerLayout default layout manager} will be used
+     * which does nothing but render child components sequentially into the
+     * Container (no sizing or positioning will be performed in this situation).
+     * Some container classes implicitly specify a default layout
+     * (e.g. FormPanel specifies <code>layout:'form'</code>). Other specific
+     * purpose classes internally specify/manage their internal layout (e.g.
+     * GridPanel, TabPanel, TreePanel, Toolbar, Menu, etc.).</p>
+     * <br><p><b><code>layout</code></b> may be specified as either as an Object or
+     * as a String:</p><div><ul class="mdetail-params">
+     *
+     * <li><u>Specify as an Object</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: {
+    type: 'vbox',
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     *
+     * <li><code><b>type</b></code></li>
+     * <br/><p>The layout type to be used for this container.  If not specified,
+     * a default {@link Ext.layout.ContainerLayout} will be created and used.</p>
+     * <br/><p>Valid layout <code>type</code> values are:</p>
+     * <div class="sub-desc"><ul class="mdetail-params">
+     * <li><code><b>{@link Ext.layout.AbsoluteLayout absolute}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AccordionLayout accordion}</b></code></li>
+     * <li><code><b>{@link Ext.layout.AnchorLayout anchor}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ContainerLayout auto}</b></code> &nbsp;&nbsp;&nbsp; <b>Default</b></li>
+     * <li><code><b>{@link Ext.layout.BorderLayout border}</b></code></li>
+     * <li><code><b>{@link Ext.layout.CardLayout card}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ColumnLayout column}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FitLayout fit}</b></code></li>
+     * <li><code><b>{@link Ext.layout.FormLayout form}</b></code></li>
+     * <li><code><b>{@link Ext.layout.HBoxLayout hbox}</b></code></li>
+     * <li><code><b>{@link Ext.layout.MenuLayout menu}</b></code></li>
+     * <li><code><b>{@link Ext.layout.TableLayout table}</b></code></li>
+     * <li><code><b>{@link Ext.layout.ToolbarLayout toolbar}</b></code></li>
+     * <li><code><b>{@link Ext.layout.VBoxLayout vbox}</b></code></li>
+     * </ul></div>
+     *
+     * <li>Layout specific configuration properties</li>
+     * <br/><p>Additional layout specific configuration properties may also be
+     * specified. For complete details regarding the valid config options for
+     * each layout type, see the layout class corresponding to the <code>type</code>
+     * specified.</p>
+     *
+     * </ul></div>
+     *
+     * <li><u>Specify as a String</u></li>
+     * <div><ul class="mdetail-params">
+     * <li>Example usage:</li>
+<pre><code>
+layout: 'vbox',
+layoutConfig: {
+    padding: '5',
+    align: 'left'
+}
+</code></pre>
+     * <li><code><b>layout</b></code></li>
+     * <br/><p>The layout <code>type</code> to be used for this container (see list
+     * of valid layout type values above).</p><br/>
+     * <li><code><b>{@link #layoutConfig}</b></code></li>
+     * <br/><p>Additional layout specific configuration properties. For complete
+     * details regarding the valid config options for each layout type, see the
+     * layout class corresponding to the <code>layout</code> specified.</p>
+     * </ul></div></ul></div>
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * This is a config object containing properties specific to the chosen
+     * <b><code>{@link #layout}</code></b> if <b><code>{@link #layout}</code></b>
+     * has been specified as a <i>string</i>.</p>
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * When set to true (50 milliseconds) or a number of milliseconds, the layout assigned for this container will buffer
+     * the frequency it calculates and does a re-layout of components. This is useful for heavy containers or containers
+     * with a large quantity of sub-components for which frequent layout calls would be expensive. Defaults to <code>50</code>.
+     */
+    bufferResize: 50,
+
+    /**
+     * @cfg {String/Number} activeItem
+     * A string component id or the numeric index of the component that should be initially activated within the
+     * container's layout on render.  For example, activeItem: 'item-1' or activeItem: 0 (index 0 = the first
+     * item in the container's collection).  activeItem only applies to layout styles that can display
+     * items one at a time (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout} and
+     * {@link Ext.layout.FitLayout}).  Related to {@link Ext.layout.ContainerLayout#activeItem}.
+     */
+    /**
+     * @cfg {Object/Array} items
+     * <pre><b>** IMPORTANT</b>: be sure to <b>{@link #layout specify a <code>layout</code>} if needed ! **</b></pre>
+     * <p>A single item, or an array of child Components to be added to this container,
+     * for example:</p>
+     * <pre><code>
+// specifying a single item
+items: {...},
+layout: 'fit',    // specify a layout!
+
+// specifying multiple items
+items: [{...}, {...}],
+layout: 'anchor', // specify a layout!
+     * </code></pre>
+     * <p>Each item may be:</p>
+     * <div><ul class="mdetail-params">
+     * <li>any type of object based on {@link Ext.Component}</li>
+     * <li>a fully instanciated object or</li>
+     * <li>an object literal that:</li>
+     * <div><ul class="mdetail-params">
+     * <li>has a specified <code>{@link Ext.Component#xtype xtype}</code></li>
+     * <li>the {@link Ext.Component#xtype} specified is associated with the Component
+     * desired and should be chosen from one of the available xtypes as listed
+     * in {@link Ext.Component}.</li>
+     * <li>If an <code>{@link Ext.Component#xtype xtype}</code> is not explicitly
+     * specified, the {@link #defaultType} for that Container is used.</li>
+     * <li>will be "lazily instanciated", avoiding the overhead of constructing a fully
+     * instanciated Component object</li>
+     * </ul></div></ul></div>
+     * <p><b>Notes</b>:</p>
+     * <div><ul class="mdetail-params">
+     * <li>Ext uses lazy rendering. Child Components will only be rendered
+     * should it become necessary. Items are automatically laid out when they are first
+     * shown (no sizing is done while hidden), or in response to a {@link #doLayout} call.</li>
+     * <li>Do not specify <code>{@link Ext.Panel#contentEl contentEl}</code>/
+     * <code>{@link Ext.Panel#html html}</code> with <code>items</code>.</li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object|Function} defaults
+     * <p>This option is a means of applying default settings to all added items whether added through the {@link #items}
+     * config or via the {@link #add} or {@link #insert} methods.</p>
+     * <p>If an added item is a config object, and <b>not</b> an instantiated Component, then the default properties are
+     * unconditionally applied. If the added item <b>is</b> an instantiated Component, then the default properties are
+     * applied conditionally so as not to override existing properties in the item.</p>
+     * <p>If the defaults option is specified as a function, then the function will be called using this Container as the
+     * scope (<code>this</code> reference) and passing the added item as the first parameter. Any resulting object
+     * from that call is then applied to the item as default properties.</p>
+     * <p>For example, to automatically apply padding to the body of each of a set of
+     * contained {@link Ext.Panel} items, you could pass: <code>defaults: {bodyStyle:'padding:15px'}</code>.</p>
+     * <p>Usage:</p><pre><code>
+defaults: {               // defaults are applied to items, not the container
+    autoScroll:true
+},
+items: [
+    {
+        xtype: 'panel',   // defaults <b>do not</b> have precedence over
+        id: 'panel1',     // options in config objects, so the defaults
+        autoScroll: false // will not be applied here, panel1 will be autoScroll:false
+    },
+    new Ext.Panel({       // defaults <b>do</b> have precedence over options
+        id: 'panel2',     // options in components, so the defaults
+        autoScroll: false // will be applied here, panel2 will be autoScroll:true.
+    })
+]
+     * </code></pre>
+     */
+
+
+    /** @cfg {Boolean} autoDestroy
+     * If true the container will automatically destroy any contained component that is removed from it, else
+     * destruction must be handled manually (defaults to true).
+     */
+    autoDestroy : true,
+
+    /** @cfg {Boolean} forceLayout
+     * If true the container will force a layout initially even if hidden or collapsed. This option
+     * is useful for forcing forms to render in collapsed or hidden containers. (defaults to false).
+     */
+    forceLayout: false,
+
+    /** @cfg {Boolean} hideBorders
+     * True to hide the borders of each contained component, false to defer to the component's existing
+     * border settings (defaults to false).
+     */
+    /** @cfg {String} defaultType
+     * <p>The default {@link Ext.Component xtype} of child Components to create in this Container when
+     * a child item is specified as a raw configuration object, rather than as an instantiated Component.</p>
+     * <p>Defaults to <code>'panel'</code>, except {@link Ext.menu.Menu} which defaults to <code>'menuitem'</code>,
+     * and {@link Ext.Toolbar} and {@link Ext.ButtonGroup} which default to <code>'button'</code>.</p>
+     */
+    defaultType : 'panel',
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <code>'resize'</code>.
+     */
+    resizeEvent: 'resize',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <code>['add', 'remove']</code>.
+     */
+    bubbleEvents: ['add', 'remove'],
+
+    // private
+    initComponent : function(){
+        Ext.Container.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event afterlayout
+             * Fires when the components in this container are arranged by the associated layout manager.
+             * @param {Ext.Container} this
+             * @param {ContainerLayout} layout The ContainerLayout implementation for this container
+             */
+            'afterlayout',
+            /**
+             * @event beforeadd
+             * Fires before any {@link Ext.Component} is added or inserted into the container.
+             * A handler can return false to cancel the add.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being added
+             * @param {Number} index The index at which the component will be added to the container's items collection
+             */
+            'beforeadd',
+            /**
+             * @event beforeremove
+             * Fires before any {@link Ext.Component} is removed from the container.  A handler can return
+             * false to cancel the remove.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component being removed
+             */
+            'beforeremove',
+            /**
+             * @event add
+             * @bubbles
+             * Fires after any {@link Ext.Component} is added or inserted into the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was added
+             * @param {Number} index The index at which the component was added to the container's items collection
+             */
+            'add',
+            /**
+             * @event remove
+             * @bubbles
+             * Fires after any {@link Ext.Component} is removed from the container.
+             * @param {Ext.Container} this
+             * @param {Ext.Component} component The component that was removed
+             */
+            'remove'
+        );
+
+        /**
+         * The collection of components in this container as a {@link Ext.util.MixedCollection}
+         * @type MixedCollection
+         * @property items
+         */
+        var items = this.items;
+        if(items){
+            delete this.items;
+            this.add(items);
+        }
+    },
+
+    // private
+    initItems : function(){
+        if(!this.items){
+            this.items = new Ext.util.MixedCollection(false, this.getComponentId);
+            this.getLayout(); // initialize the layout
+        }
+    },
+
+    // private
+    setLayout : function(layout){
+        if(this.layout && this.layout != layout){
+            this.layout.setContainer(null);
+        }
+        this.layout = layout;
+        this.initItems();
+        layout.setContainer(this);
+    },
+
+    afterRender: function(){
+        // Render this Container, this should be done before setLayout is called which
+        // will hook onResize
+        Ext.Container.superclass.afterRender.call(this);
+        if(!this.layout){
+            this.layout = 'auto';
+        }
+        if(Ext.isObject(this.layout) && !this.layout.layout){
+            this.layoutConfig = this.layout;
+            this.layout = this.layoutConfig.type;
+        }
+        if(Ext.isString(this.layout)){
+            this.layout = new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig);
+        }
+        this.setLayout(this.layout);
+
+        // If a CardLayout, the active item set
+        if(this.activeItem !== undefined && this.layout.setActiveItem){
+            var item = this.activeItem;
+            delete this.activeItem;
+            this.layout.setActiveItem(item);
+        }
+
+        // If we have no ownerCt, render and size all children
+        if(!this.ownerCt){
+            this.doLayout(false, true);
+        }
+
+        // This is a manually configured flag set by users in conjunction with renderTo.
+        // Not to be confused with the flag by the same name used in Layouts.
+        if(this.monitorResize === true){
+            Ext.EventManager.onWindowResize(this.doLayout, this, [false]);
+        }
+    },
+
+    /**
+     * <p>Returns the Element to be used to contain the child Components of this Container.</p>
+     * <p>An implementation is provided which returns the Container's {@link #getEl Element}, but
+     * if there is a more complex structure to a Container, this may be overridden to return
+     * the element into which the {@link #layout layout} renders child Components.</p>
+     * @return {Ext.Element} The Element to render child Components into.
+     */
+    getLayoutTarget : function(){
+        return this.el;
+    },
+
+    // private - used as the key lookup function for the items collection
+    getComponentId : function(comp){
+        return comp.getItemId();
+    },
+
+    /**
+     * <p>Adds {@link Ext.Component Component}(s) to this Container.</p>
+     * <br><p><b>Description</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>Fires the {@link #beforeadd} event before adding</li>
+     * <li>The Container's {@link #defaults default config values} will be applied
+     * accordingly (see <code>{@link #defaults}</code> for details).</li>
+     * <li>Fires the {@link #add} event after the component has been added.</li>
+     * </ul></div>
+     * <br><p><b>Notes</b></u> :
+     * <div><ul class="mdetail-params">
+     * <li>If the Container is <i>already rendered</i> when <code>add</code>
+     * is called, you may need to call {@link #doLayout} to refresh the view which causes
+     * any unrendered child Components to be rendered. This is required so that you can
+     * <code>add</code> multiple child components if needed while only refreshing the layout
+     * once. For example:<pre><code>
+var tb = new {@link Ext.Toolbar}();
+tb.render(document.body);  // toolbar is rendered
+tb.add({text:'Button 1'}); // add multiple items ({@link #defaultType} for {@link Ext.Toolbar Toolbar} is 'button')
+tb.add({text:'Button 2'});
+tb.{@link #doLayout}();             // refresh the layout
+     * </code></pre></li>
+     * <li><i>Warning:</i> Containers directly managed by the BorderLayout layout manager
+     * may not be removed or added.  See the Notes for {@link Ext.layout.BorderLayout BorderLayout}
+     * for more details.</li>
+     * </ul></div>
+     * @param {...Object/Array} component
+     * <p>Either one or more Components to add or an Array of Components to add.  See
+     * <code>{@link #items}</code> for additional information.</p>
+     * @return {Ext.Component/Array} The Components that were added.
+     */
+    add : function(comp){
+        this.initItems();
+        var args = arguments.length > 1;
+        if(args || Ext.isArray(comp)){
+            var result = [];
+            Ext.each(args ? arguments : comp, function(c){
+                result.push(this.add(c));
+            }, this);
+            return result;
+        }
+        var c = this.lookupComponent(this.applyDefaults(comp));
+        var index = this.items.length;
+        if(this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false){
+            this.items.add(c);
+            // *onAdded
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        return c;
+    },
+
+    onAdd : function(c){
+        // Empty template method
+    },
+
+    // private
+    onAdded : function(container, pos) {
+        //overridden here so we can cascade down, not worth creating a template method.
+        this.ownerCt = container;
+        this.initRef();
+        //initialize references for child items
+        this.cascade(function(c){
+            c.initRef();
+        });
+        this.fireEvent('added', this, container, pos);
+    },
+
+    /**
+     * Inserts a Component into this Container at a specified index. Fires the
+     * {@link #beforeadd} event before inserting, then fires the {@link #add} event after the
+     * Component has been inserted.
+     * @param {Number} index The index at which the Component will be inserted
+     * into the Container's items collection
+     * @param {Ext.Component} component The child Component to insert.<br><br>
+     * Ext uses lazy rendering, and will only render the inserted Component should
+     * it become necessary.<br><br>
+     * A Component config object may be passed in order to avoid the overhead of
+     * constructing a real Component object if lazy rendering might mean that the
+     * inserted Component will not be rendered immediately. To take advantage of
+     * this 'lazy instantiation', set the {@link Ext.Component#xtype} config
+     * property to the registered type of the Component wanted.<br><br>
+     * For a list of all available xtypes, see {@link Ext.Component}.
+     * @return {Ext.Component} component The Component (or config object) that was
+     * inserted with the Container's default config values applied.
+     */
+    insert : function(index, comp) {
+        var args   = arguments,
+            length = args.length,
+            result = [],
+            i, c;
+        
+        this.initItems();
+        
+        if (length > 2) {
+            for (i = length - 1; i >= 1; --i) {
+                result.push(this.insert(index, args[i]));
+            }
+            return result;
+        }
+        
+        c = this.lookupComponent(this.applyDefaults(comp));
+        index = Math.min(index, this.items.length);
+        
+        if (this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false) {
+            if (c.ownerCt == this) {
+                this.items.remove(c);
+            }
+            this.items.insert(index, c);
+            c.onAdded(this, index);
+            this.onAdd(c);
+            this.fireEvent('add', this, c, index);
+        }
+        
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        var d = this.defaults;
+        if(d){
+            if(Ext.isFunction(d)){
+                d = d.call(this, c);
+            }
+            if(Ext.isString(c)){
+                c = Ext.ComponentMgr.get(c);
+                Ext.apply(c, d);
+            }else if(!c.events){
+                Ext.applyIf(c.isAction ? c.initialConfig : c, d);
+            }else{
+                Ext.apply(c, d);
+            }
+        }
+        return c;
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        if(item.ownerCt){
+            item.ownerCt.remove(item, false);
+        }
+        if(this.hideBorders === true){
+            item.border = (item.border === true);
+        }
+    },
+
+    /**
+     * Removes a component from this container.  Fires the {@link #beforeremove} event before removing, then fires
+     * the {@link #remove} event after the component has been removed.
+     * @param {Component/String} component The component reference or id to remove.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Ext.Component} component The Component that was removed.
+     */
+    remove : function(comp, autoDestroy){
+        this.initItems();
+        var c = this.getComponent(comp);
+        if(c && this.fireEvent('beforeremove', this, c) !== false){
+            this.doRemove(c, autoDestroy);
+            this.fireEvent('remove', this, c);
+        }
+        return c;
+    },
+
+    onRemove: function(c){
+        // Empty template method
+    },
+
+    // private
+    doRemove: function(c, autoDestroy){
+        var l = this.layout,
+            hasLayout = l && this.rendered;
+
+        if(hasLayout){
+            l.onRemove(c);
+        }
+        this.items.remove(c);
+        c.onRemoved();
+        this.onRemove(c);
+        if(autoDestroy === true || (autoDestroy !== false && this.autoDestroy)){
+            c.destroy();
+        }
+        if(hasLayout){
+            l.afterRemove(c);
+        }
+    },
+
+    /**
+     * Removes all components from this container.
+     * @param {Boolean} autoDestroy (optional) True to automatically invoke the removed Component's {@link Ext.Component#destroy} function.
+     * Defaults to the value of this Container's {@link #autoDestroy} config.
+     * @return {Array} Array of the destroyed components
+     */
+    removeAll: function(autoDestroy){
+        this.initItems();
+        var item, rem = [], items = [];
+        this.items.each(function(i){
+            rem.push(i);
+        });
+        for (var i = 0, len = rem.length; i < len; ++i){
+            item = rem[i];
+            this.remove(item, autoDestroy);
+            if(item.ownerCt !== this){
+                items.push(item);
+            }
+        }
+        return items;
+    },
+
+    /**
+     * Examines this container's <code>{@link #items}</code> <b>property</b>
+     * and gets a direct child component of this container.
+     * @param {String/Number} comp This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><code>String</code></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><code>Number</code></b> : representing the position of the child component
+     * within the <code>{@link #items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     * @return Ext.Component The component (if found).
+     */
+    getComponent : function(comp){
+        if(Ext.isObject(comp)){
+            comp = comp.getItemId();
+        }
+        return this.items.get(comp);
+    },
+
+    // private
+    lookupComponent : function(comp){
+        if(Ext.isString(comp)){
+            return Ext.ComponentMgr.get(comp);
+        }else if(!comp.events){
+            return this.createComponent(comp);
+        }
+        return comp;
+    },
+
+    // private
+    createComponent : function(config, defaultType){
+        if (config.render) {
+            return config;
+        }
+        // add in ownerCt at creation time but then immediately
+        // remove so that onBeforeAdd can handle it
+        var c = Ext.create(Ext.apply({
+            ownerCt: this
+        }, config), defaultType || this.defaultType);
+        delete c.initialConfig.ownerCt;
+        delete c.ownerCt;
+        return c;
+    },
+
+    /**
+     * @private
+     * We can only lay out if there is a view area in which to layout.
+     * display:none on the layout target, *or any of its parent elements* will mean it has no view area.
+     */
+    canLayout : function() {
+        var el = this.getVisibilityEl();
+        return el && el.dom && !el.isStyle("display", "none");
+    },
+
+    /**
+     * Force this container's layout to be recalculated. A call to this function is required after adding a new component
+     * to an already rendered container, or possibly after changing sizing/position properties of child components.
+     * @param {Boolean} shallow (optional) True to only calc the layout of this component, and let child components auto
+     * calc layouts as required (defaults to false, which calls doLayout recursively for each subcontainer)
+     * @param {Boolean} force (optional) True to force a layout to occur, even if the item is hidden.
+     * @return {Ext.Container} this
+     */
+
+    doLayout : function(shallow, force){
+        var rendered = this.rendered,
+            forceLayout = force || this.forceLayout;
+
+        if(this.collapsed || !this.canLayout()){
+            this.deferLayout = this.deferLayout || !shallow;
+            if(!forceLayout){
+                return;
+            }
+            shallow = shallow && !this.deferLayout;
+        } else {
+            delete this.deferLayout;
+        }
+        if(rendered && this.layout){
+            this.layout.layout();
+        }
+        if(shallow !== true && this.items){
+            var cs = this.items.items;
+            for(var i = 0, len = cs.length; i < len; i++){
+                var c = cs[i];
+                if(c.doLayout){
+                    c.doLayout(false, forceLayout);
+                }
+            }
+        }
+        if(rendered){
+            this.onLayout(shallow, forceLayout);
+        }
+        // Initial layout completed
+        this.hasLayout = true;
+        delete this.forceLayout;
+    },
+
+    onLayout : Ext.emptyFn,
+
+    // private
+    shouldBufferLayout: function(){
+        /*
+         * Returns true if the container should buffer a layout.
+         * This is true only if the container has previously been laid out
+         * and has a parent container that is pending a layout.
+         */
+        var hl = this.hasLayout;
+        if(this.ownerCt){
+            // Only ever buffer if we've laid out the first time and we have one pending.
+            return hl ? !this.hasLayoutPending() : false;
+        }
+        // Never buffer initial layout
+        return hl;
+    },
+
+    // private
+    hasLayoutPending: function(){
+        // Traverse hierarchy to see if any parent container has a pending layout.
+        var pending = false;
+        this.ownerCt.bubble(function(c){
+            if(c.layoutPending){
+                pending = true;
+                return false;
+            }
+        });
+        return pending;
+    },
+
+    onShow : function(){
+        // removes css classes that were added to hide
+        Ext.Container.superclass.onShow.call(this);
+        // If we were sized during the time we were hidden, layout.
+        if(Ext.isDefined(this.deferLayout)){
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+    },
+
+    /**
+     * Returns the layout currently in use by the container.  If the container does not currently have a layout
+     * set, a default {@link Ext.layout.ContainerLayout} will be created and set as the container's layout.
+     * @return {ContainerLayout} layout The container's layout
+     */
+    getLayout : function(){
+        if(!this.layout){
+            var layout = new Ext.layout.AutoLayout(this.layoutConfig);
+            this.setLayout(layout);
+        }
+        return this.layout;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var c;
+        if(this.items){
+            while(c = this.items.first()){
+                this.doRemove(c, true);
+            }
+        }
+        if(this.monitorResize){
+            Ext.EventManager.removeResizeListener(this.doLayout, this);
+        }
+        Ext.destroy(this.layout);
+        Ext.Container.superclass.beforeDestroy.call(this);
+    },
+
+    /**
+     * Cascades down the component/container heirarchy from this component (called first), calling the specified function with
+     * each component. The scope (<i>this</i>) of
+     * function call will be the scope provided or the current component. The arguments to the function
+     * will be the args provided or the current component. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function (defaults to current component)
+     * @param {Array} args (optional) The args to call the function with (defaults to passing the current component)
+     * @return {Ext.Container} this
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            if(this.items){
+                var cs = this.items.items;
+                for(var i = 0, len = cs.length; i < len; i++){
+                    if(cs[i].cascade){
+                        cs[i].cascade(fn, scope, args);
+                    }else{
+                        fn.apply(scope || cs[i], args || [cs[i]]);
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Find a component under this container at any level by id
+     * @param {String} id
+     * @deprecated Fairly useless method, since you can just use Ext.getCmp. Should be removed for 4.0
+     * If you need to test if an id belongs to a container, you can use getCmp and findParent*.
+     * @return Ext.Component
+     */
+    findById : function(id){
+        var m = null, 
+            ct = this;
+        this.cascade(function(c){
+            if(ct != c && c.id === id){
+                m = c;
+                return false;
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Find a component under this container at any level by xtype or class
+     * @param {String/Class} xtype The xtype string for a component, or the class of the component directly
+     * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+     * the default), or true to check whether this Component is directly of the specified xtype.
+     * @return {Array} Array of Ext.Components
+     */
+    findByType : function(xtype, shallow){
+        return this.findBy(function(c){
+            return c.isXType(xtype, shallow);
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by property
+     * @param {String} prop
+     * @param {String} value
+     * @return {Array} Array of Ext.Components
+     */
+    find : function(prop, value){
+        return this.findBy(function(c){
+            return c[prop] === value;
+        });
+    },
+
+    /**
+     * Find a component under this container at any level by a custom function. If the passed function returns
+     * true, the component will be included in the results. The passed function is called with the arguments (component, this container).
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional)
+     * @return {Array} Array of Ext.Components
+     */
+    findBy : function(fn, scope){
+        var m = [], ct = this;
+        this.cascade(function(c){
+            if(ct != c && fn.call(scope || c, c, ct) === true){
+                m.push(c);
+            }
+        });
+        return m;
+    },
+
+    /**
+     * Get a component contained by this container (alias for items.get(key))
+     * @param {String/Number} key The index or id of the component
+     * @deprecated Should be removed in 4.0, since getComponent does the same thing.
+     * @return {Ext.Component} Ext.Component
+     */
+    get : function(key){
+        return this.getComponent(key);
+    }
+});
+
+Ext.Container.LAYOUTS = {};
+Ext.reg('container', Ext.Container);
+/**
+ * @class Ext.layout.ContainerLayout
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ */
+Ext.layout.ContainerLayout = Ext.extend(Object, {
+    /**
+     * @cfg {String} extraCls
+     * <p>An optional extra CSS class that will be added to the container. This can be useful for adding
+     * customized styles to the container or any of its children using standard CSS rules. See
+     * {@link Ext.Component}.{@link Ext.Component#ctCls ctCls} also.</p>
+     * <p><b>Note</b>: <tt>extraCls</tt> defaults to <tt>''</tt> except for the following classes
+     * which assign a value by default:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.layout.AbsoluteLayout Absolute Layout} : <tt>'x-abs-layout-item'</tt></li>
+     * <li>{@link Ext.layout.Box Box Layout} : <tt>'x-box-item'</tt></li>
+     * <li>{@link Ext.layout.ColumnLayout Column Layout} : <tt>'x-column'</tt></li>
+     * </ul></div>
+     * To configure the above Classes with an extra CSS class append to the default.  For example,
+     * for ColumnLayout:<pre><code>
+     * extraCls: 'x-column custom-class'
+     * </code></pre>
+     * </p>
+     */
+    /**
+     * @cfg {Boolean} renderHidden
+     * True to hide each contained item on render (defaults to false).
+     */
+
+    /**
+     * A reference to the {@link Ext.Component} that is active.  For example, <pre><code>
+     * if(myPanel.layout.activeItem.id == 'item-1') { ... }
+     * </code></pre>
+     * <tt>activeItem</tt> only applies to layout styles that can display items one at a time
+     * (like {@link Ext.layout.AccordionLayout}, {@link Ext.layout.CardLayout}
+     * and {@link Ext.layout.FitLayout}).  Read-only.  Related to {@link Ext.Container#activeItem}.
+     * @type {Ext.Component}
+     * @property activeItem
+     */
+
+    // private
+    monitorResize:false,
+    // private
+    activeItem : null,
+
+    constructor : function(config){
+        this.id = Ext.id(null, 'ext-layout-');
+        Ext.apply(this, config);
+    },
+
+    type: 'container',
+
+    /* Workaround for how IE measures autoWidth elements.  It prefers bottom-up measurements
+      whereas other browser prefer top-down.  We will hide all target child elements before we measure and
+      put them back to get an accurate measurement.
+    */
+    IEMeasureHack : function(target, viewFlag) {
+        var tChildren = target.dom.childNodes, tLen = tChildren.length, c, d = [], e, i, ret;
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                d[i] = e.getStyle('display');
+                e.setStyle({display: 'none'});
+            }
+        }
+        ret = target ? target.getViewSize(viewFlag) : {};
+        for (i = 0 ; i < tLen ; i++) {
+            c = tChildren[i];
+            e = Ext.get(c);
+            if (e) {
+                e.setStyle({display: d[i]});
+            }
+        }
+        return ret;
+    },
+
+    // Placeholder for the derived layouts
+    getLayoutTargetSize : Ext.EmptyFn,
+
+    // private
+    layout : function(){
+        var ct = this.container, target = ct.getLayoutTarget();
+        if(!(this.hasLayout || Ext.isEmpty(this.targetCls))){
+            target.addClass(this.targetCls);
+        }
+        this.onLayout(ct, target);
+        ct.fireEvent('afterlayout', ct, this);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        this.renderAll(ct, target);
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && c.getPositionEl().dom.parentNode == (target.dom || target);
+    },
+
+    // private
+    renderAll : function(ct, target){
+        var items = ct.items.items, i, c, len = items.length;
+        for(i = 0; i < len; i++) {
+            c = items[i];
+            if(c && (!c.rendered || !this.isValidParent(c, target))){
+                this.renderItem(c, i, target);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Renders the given Component into the target Element. If the Component is already rendered,
+     * it is moved to the provided target instead.
+     * @param {Ext.Component} c The Component to render
+     * @param {Number} position The position within the target to render the item to
+     * @param {Ext.Element} target The target Element
+     */
+    renderItem : function(c, position, target){
+        if (c) {
+            if (!c.rendered) {
+                c.render(target, position);
+                this.configureItem(c);
+            } else if (!this.isValidParent(c, target)) {
+                if (Ext.isNumber(position)) {
+                    position = target.dom.childNodes[position];
+                }
+                
+                target.dom.insertBefore(c.getPositionEl().dom, position || null);
+                c.container = target;
+                this.configureItem(c);
+            }
+        }
+    },
+
+    // private.
+    // Get all rendered items to lay out.
+    getRenderedItems: function(ct){
+        var t = ct.getLayoutTarget(), cti = ct.items.items, len = cti.length, i, c, items = [];
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.shouldLayout !== false){
+                items.push(c);
+            }
+        };
+        return items;
+    },
+
+    /**
+     * @private
+     * Applies extraCls and hides the item if renderHidden is true
+     */
+    configureItem: function(c){
+        if (this.extraCls) {
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.addClass(this.extraCls);
+        }
+        
+        // If we are forcing a layout, do so *before* we hide so elements have height/width
+        if (c.doLayout && this.forceLayout) {
+            c.doLayout();
+        }
+        if (this.renderHidden && c != this.activeItem) {
+            c.hide();
+        }
+    },
+
+    onRemove: function(c){
+        if(this.activeItem == c){
+            delete this.activeItem;
+        }
+        if(c.rendered && this.extraCls){
+            var t = c.getPositionEl ? c.getPositionEl() : c;
+            t.removeClass(this.extraCls);
+        }
+    },
+
+    afterRemove: function(c){
+        if(c.removeRestore){
+            c.removeMode = 'container';
+            delete c.removeRestore;
+        }
+    },
+
+    // private
+    onResize: function(){
+        var ct = this.container,
+            b;
+        if(ct.collapsed){
+            return;
+        }
+        if(b = ct.bufferResize && ct.shouldBufferLayout()){
+            if(!this.resizeTask){
+                this.resizeTask = new Ext.util.DelayedTask(this.runLayout, this);
+                this.resizeBuffer = Ext.isNumber(b) ? b : 50;
+            }
+            ct.layoutPending = true;
+            this.resizeTask.delay(this.resizeBuffer);
+        }else{
+            this.runLayout();
+        }
+    },
+
+    runLayout: function(){
+        var ct = this.container;
+        this.layout();
+        ct.onLayout();
+        delete ct.layoutPending;
+    },
+
+    // private
+    setContainer : function(ct){
+        /**
+         * This monitorResize flag will be renamed soon as to avoid confusion
+         * with the Container version which hooks onWindowResize to doLayout
+         *
+         * monitorResize flag in this context attaches the resize event between
+         * a container and it's layout
+         */
+        if(this.monitorResize && ct != this.container){
+            var old = this.container;
+            if(old){
+                old.un(old.resizeEvent, this.onResize, this);
+            }
+            if(ct){
+                ct.on(ct.resizeEvent, this.onResize, this);
+            }
+        }
+        this.container = ct;
+    },
+
+    /**
+     * Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations
+     * (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result)
+     * @param {Number|String} v The encoded margins
+     * @return {Object} An object with margin sizes for top, right, bottom and left
+     */
+    parseMargins : function(v){
+        if (Ext.isNumber(v)) {
+            v = v.toString();
+        }
+        var ms  = v.split(' '),
+            len = ms.length;
+            
+        if (len == 1) {
+            ms[1] = ms[2] = ms[3] = ms[0];
+        } else if(len == 2) {
+            ms[2] = ms[0];
+            ms[3] = ms[1];
+        } else if(len == 3) {
+            ms[3] = ms[1];
+        }
+        
+        return {
+            top   :parseInt(ms[0], 10) || 0,
+            right :parseInt(ms[1], 10) || 0,
+            bottom:parseInt(ms[2], 10) || 0,
+            left  :parseInt(ms[3], 10) || 0
+        };
+    },
+
+    /**
+     * The {@link Ext.Template Ext.Template} used by Field rendering layout classes (such as
+     * {@link Ext.layout.FormLayout}) to create the DOM structure of a fully wrapped,
+     * labeled and styled form Field. A default Template is supplied, but this may be
+     * overriden to create custom field structures. The template processes values returned from
+     * {@link Ext.layout.FormLayout#getTemplateArgs}.
+     * @property fieldTpl
+     * @type Ext.Template
+     */
+    fieldTpl: (function() {
+        var t = new Ext.Template(
+            '<div class="x-form-item {itemCls}" tabIndex="-1">',
+                '<label for="{id}" style="{labelStyle}" class="x-form-item-label">{label}{labelSeparator}</label>',
+                '<div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">',
+                '</div><div class="{clearCls}"></div>',
+            '</div>'
+        );
+        t.disableFormats = true;
+        return t.compile();
+    })(),
+
+    /*
+     * Destroys this layout. This is a template method that is empty by default, but should be implemented
+     * by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
+     * @protected
+     */
+    destroy : function(){
+        // Stop any buffered layout tasks
+        if(this.resizeTask && this.resizeTask.cancel){
+            this.resizeTask.cancel();
+        }
+        if(this.container) {
+            this.container.un(this.container.resizeEvent, this.onResize, this);
+        }
+        if(!Ext.isEmpty(this.targetCls)){
+            var target = this.container.getLayoutTarget();
+            if(target){
+                target.removeClass(this.targetCls);
+            }
+        }
+    }
+});/**
+ * @class Ext.layout.AutoLayout
+ * <p>The AutoLayout is the default layout manager delegated by {@link Ext.Container} to
+ * render any child Components when no <tt>{@link Ext.Container#layout layout}</tt> is configured into
+ * a {@link Ext.Container Container}.</tt>.  AutoLayout provides only a passthrough of any layout calls
+ * to any child containers.</p>
+ */
+Ext.layout.AutoLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    type: 'auto',
+
+    monitorResize: true,
+
+    onLayout : function(ct, target){
+        Ext.layout.AutoLayout.superclass.onLayout.call(this, ct, target);
+        var cs = this.getRenderedItems(ct), len = cs.length, i, c;
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            if (c.doLayout){
+                // Shallow layout children
+                c.doLayout(true);
+            }
+        }
+    }
+});
+
+Ext.Container.LAYOUTS['auto'] = Ext.layout.AutoLayout;
+/**
+ * @class Ext.layout.FitLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a base class for layouts that contain <b>a single item</b> that automatically expands to fill the layout's
+ * container.  This class is intended to be extended or created via the <tt>layout:'fit'</tt> {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>FitLayout does not have any direct config options (other than inherited ones).  To fit a panel to a container
+ * using FitLayout, simply set layout:'fit' on the container and add a single panel to it.  If the container has
+ * multiple panels, only the first one will be displayed.  Example usage:</p>
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Fit Layout',
+    layout:'fit',
+    items: {
+        title: 'Inner Panel',
+        html: '&lt;p&gt;This is the inner panel content&lt;/p&gt;',
+        border: false
+    }
+});
+</code></pre>
+ */
+Ext.layout.FitLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'fit',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        if (!target) {
+            return {};
+        }
+        // Style Sized (scrollbars not included)
+        return target.getStyleSize();
+    },
+
+    // private
+    onLayout : function(ct, target){
+        Ext.layout.FitLayout.superclass.onLayout.call(this, ct, target);
+        if(!ct.collapsed){
+            this.setItemSize(this.activeItem || ct.items.itemAt(0), this.getLayoutTargetSize());
+        }
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(item && size.height > 0){ // display none?
+            item.setSize(size);
+        }
+    }
+});
+Ext.Container.LAYOUTS['fit'] = Ext.layout.FitLayout;/**
+ * @class Ext.layout.CardLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This layout manages multiple child Components, each fitted to the Container, where only a single child Component can be
+ * visible at any given time.  This layout style is most commonly used for wizards, tab implementations, etc.
+ * This class is intended to be extended or created via the layout:'card' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>The CardLayout's focal method is {@link #setActiveItem}.  Since only one panel is displayed at a time,
+ * the only way to move from one Component to the next is by calling setActiveItem, passing the id or index of
+ * the next panel to display.  The layout itself does not provide a user interface for handling this navigation,
+ * so that functionality must be provided by the developer.</p>
+ * <p>In the following example, a simplistic wizard setup is demonstrated.  A button bar is added
+ * to the footer of the containing panel to provide navigation buttons.  The buttons will be handled by a
+ * common navigation routine -- for this example, the implementation of that routine has been ommitted since
+ * it can be any type of custom logic.  Note that other uses of a CardLayout (like a tab control) would require a
+ * completely different implementation.  For serious implementations, a better approach would be to extend
+ * CardLayout to provide the custom functionality needed.  Example usage:</p>
+ * <pre><code>
+var navHandler = function(direction){
+    // This routine could contain business logic required to manage the navigation steps.
+    // It would call setActiveItem as needed, manage navigation button state, handle any
+    // branching logic that might be required, handle alternate actions like cancellation
+    // or finalization, etc.  A complete wizard implementation could get pretty
+    // sophisticated depending on the complexity required, and should probably be
+    // done as a subclass of CardLayout in a real-world implementation.
+};
+
+var card = new Ext.Panel({
+    title: 'Example Wizard',
+    layout:'card',
+    activeItem: 0, // make sure the active item is set on the container config!
+    bodyStyle: 'padding:15px',
+    defaults: {
+        // applied to each contained panel
+        border:false
+    },
+    // just an example of one possible navigation scheme, using buttons
+    bbar: [
+        {
+            id: 'move-prev',
+            text: 'Back',
+            handler: navHandler.createDelegate(this, [-1]),
+            disabled: true
+        },
+        '->', // greedy spacer so that the buttons are aligned to each side
+        {
+            id: 'move-next',
+            text: 'Next',
+            handler: navHandler.createDelegate(this, [1])
+        }
+    ],
+    // the panels (or "cards") within the layout
+    items: [{
+        id: 'card-0',
+        html: '&lt;h1&gt;Welcome to the Wizard!&lt;/h1&gt;&lt;p&gt;Step 1 of 3&lt;/p&gt;'
+    },{
+        id: 'card-1',
+        html: '&lt;p&gt;Step 2 of 3&lt;/p&gt;'
+    },{
+        id: 'card-2',
+        html: '&lt;h1&gt;Congratulations!&lt;/h1&gt;&lt;p&gt;Step 3 of 3 - Complete&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.CardLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} deferredRender
+     * True to render each contained item at the time it becomes active, false to render all contained items
+     * as soon as the layout is rendered (defaults to false).  If there is a significant amount of content or
+     * a lot of heavy controls being rendered into panels that are not displayed by default, setting this to
+     * true might improve performance.
+     */
+    deferredRender : false,
+
+    /**
+     * @cfg {Boolean} layoutOnCardChange
+     * True to force a layout of the active item when the active card is changed. Defaults to false.
+     */
+    layoutOnCardChange : false,
+
+    /**
+     * @cfg {Boolean} renderHidden @hide
+     */
+    // private
+    renderHidden : true,
+
+    type: 'card',
+
+    /**
+     * Sets the active (visible) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        var ai = this.activeItem,
+            ct = this.container;
+        item = ct.getComponent(item);
+
+        // Is this a valid, different card?
+        if(item && ai != item){
+
+            // Changing cards, hide the current one
+            if(ai){
+                ai.hide();
+                if (ai.hidden !== true) {
+                    return false;
+                }
+                ai.fireEvent('deactivate', ai);
+            }
+
+            var layout = item.doLayout && (this.layoutOnCardChange || !item.rendered);
+
+            // Change activeItem reference
+            this.activeItem = item;
+
+            // The container is about to get a recursive layout, remove any deferLayout reference
+            // because it will trigger a redundant layout.
+            delete item.deferLayout;
+
+            // Show the new component
+            item.show();
+
+            this.layout();
+
+            if(layout){
+                item.doLayout();
+            }
+            item.fireEvent('activate', item);
+        }
+    },
+
+    // private
+    renderAll : function(ct, target){
+        if(this.deferredRender){
+            this.renderItem(this.activeItem, undefined, target);
+        }else{
+            Ext.layout.CardLayout.superclass.renderAll.call(this, ct, target);
+        }
+    }
+});
+Ext.Container.LAYOUTS['card'] = Ext.layout.CardLayout;
+/**
+ * @class Ext.layout.AnchorLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a layout that enables anchoring of contained elements relative to the container's dimensions.
+ * If the container is resized, all anchored items are automatically rerendered according to their
+ * <b><tt>{@link #anchor}</tt></b> rules.</p>
+ * <p>This class is intended to be extended or created via the layout:'anchor' {@link Ext.Container#layout}
+ * config, and should generally not need to be created directly via the new keyword.</p>
+ * <p>AnchorLayout does not have any direct config options (other than inherited ones). By default,
+ * AnchorLayout will calculate anchor measurements based on the size of the container itself. However, the
+ * container using the AnchorLayout can supply an anchoring-specific config property of <b>anchorSize</b>.
+ * If anchorSize is specifed, the layout will use it as a virtual container for the purposes of calculating
+ * anchor measurements based on it instead, allowing the container to be sized independently of the anchoring
+ * logic if necessary.  For example:</p>
+ * <pre><code>
+var viewport = new Ext.Viewport({
+    layout:'anchor',
+    anchorSize: {width:800, height:600},
+    items:[{
+        title:'Item 1',
+        html:'Content 1',
+        width:800,
+        anchor:'right 20%'
+    },{
+        title:'Item 2',
+        html:'Content 2',
+        width:300,
+        anchor:'50% 30%'
+    },{
+        title:'Item 3',
+        html:'Content 3',
+        width:600,
+        anchor:'-100 50%'
+    }]
+});
+ * </code></pre>
+ */
+Ext.layout.AnchorLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {String} anchor
+     * <p>This configuation option is to be applied to <b>child <tt>items</tt></b> of a container managed by
+     * this layout (ie. configured with <tt>layout:'anchor'</tt>).</p><br/>
+     *
+     * <p>This value is what tells the layout how an item should be anchored to the container. <tt>items</tt>
+     * added to an AnchorLayout accept an anchoring-specific config property of <b>anchor</b> which is a string
+     * containing two values: the horizontal anchor value and the vertical anchor value (for example, '100% 50%').
+     * The following types of anchor values are supported:<div class="mdetail-params"><ul>
+     *
+     * <li><b>Percentage</b> : Any value between 1 and 100, expressed as a percentage.<div class="sub-desc">
+     * The first anchor is the percentage width that the item should take up within the container, and the
+     * second is the percentage height.  For example:<pre><code>
+// two values specified
+anchor: '100% 50%' // render item complete width of the container and
+                   // 1/2 height of the container
+// one value specified
+anchor: '100%'     // the width value; the height will default to auto
+     * </code></pre></div></li>
+     *
+     * <li><b>Offsets</b> : Any positive or negative integer value.<div class="sub-desc">
+     * This is a raw adjustment where the first anchor is the offset from the right edge of the container,
+     * and the second is the offset from the bottom edge. For example:<pre><code>
+// two values specified
+anchor: '-50 -100' // render item the complete width of the container
+                   // minus 50 pixels and
+                   // the complete height minus 100 pixels.
+// one value specified
+anchor: '-50'      // anchor value is assumed to be the right offset value
+                   // bottom offset will default to 0
+     * </code></pre></div></li>
+     *
+     * <li><b>Sides</b> : Valid values are <tt>'right'</tt> (or <tt>'r'</tt>) and <tt>'bottom'</tt>
+     * (or <tt>'b'</tt>).<div class="sub-desc">
+     * Either the container must have a fixed size or an anchorSize config value defined at render time in
+     * order for these to have any effect.</div></li>
+     *
+     * <li><b>Mixed</b> : <div class="sub-desc">
+     * Anchor values can also be mixed as needed.  For example, to render the width offset from the container
+     * right edge by 50 pixels and 75% of the container's height use:
+     * <pre><code>
+anchor: '-50 75%'
+     * </code></pre></div></li>
+     *
+     *
+     * </ul></div>
+     */
+
+    // private
+    monitorResize : true,
+
+    type : 'anchor',
+
+    /**
+     * @cfg {String} defaultAnchor
+     *
+     * default anchor for all child container items applied if no anchor or specific width is set on the child item.  Defaults to '100%'.
+     *
+     */
+    defaultAnchor : '100%',
+
+    parseAnchorRE : /^(r|right|b|bottom)$/i,
+
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret = {};
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    // private
+    onLayout : function(container, target) {
+        Ext.layout.AnchorLayout.superclass.onLayout.call(this, container, target);
+
+        var size = this.getLayoutTargetSize(),
+            containerWidth = size.width,
+            containerHeight = size.height,
+            overflow = target.getStyle('overflow'),
+            components = this.getRenderedItems(container),
+            len = components.length,
+            boxes = [],
+            box,
+            anchorWidth,
+            anchorHeight,
+            component,
+            anchorSpec,
+            calcWidth,
+            calcHeight,
+            anchorsArray,
+            totalHeight = 0,
+            i,
+            el;
+
+        if(containerWidth < 20 && containerHeight < 20){
+            return;
+        }
+
+        // find the container anchoring size
+        if(container.anchorSize) {
+            if(typeof container.anchorSize == 'number') {
+                anchorWidth = container.anchorSize;
+            } else {
+                anchorWidth = container.anchorSize.width;
+                anchorHeight = container.anchorSize.height;
+            }
+        } else {
+            anchorWidth = container.initialConfig.width;
+            anchorHeight = container.initialConfig.height;
+        }
+
+        for(i = 0; i < len; i++) {
+            component = components[i];
+            el = component.getPositionEl();
+
+            // If a child container item has no anchor and no specific width, set the child to the default anchor size
+            if (!component.anchor && component.items && !Ext.isNumber(component.width) && !(Ext.isIE6 && Ext.isStrict)){
+                component.anchor = this.defaultAnchor;
+            }
+
+            if(component.anchor) {
+                anchorSpec = component.anchorSpec;
+                // cache all anchor values
+                if(!anchorSpec){
+                    anchorsArray = component.anchor.split(' ');
+                    component.anchorSpec = anchorSpec = {
+                        right: this.parseAnchor(anchorsArray[0], component.initialConfig.width, anchorWidth),
+                        bottom: this.parseAnchor(anchorsArray[1], component.initialConfig.height, anchorHeight)
+                    };
+                }
+                calcWidth = anchorSpec.right ? this.adjustWidthAnchor(anchorSpec.right(containerWidth) - el.getMargins('lr'), component) : undefined;
+                calcHeight = anchorSpec.bottom ? this.adjustHeightAnchor(anchorSpec.bottom(containerHeight) - el.getMargins('tb'), component) : undefined;
+
+                if(calcWidth || calcHeight) {
+                    boxes.push({
+                        component: component,
+                        width: calcWidth || undefined,
+                        height: calcHeight || undefined
+                    });
+                }
+            }
+        }
+        for (i = 0, len = boxes.length; i < len; i++) {
+            box = boxes[i];
+            box.component.setSize(box.width, box.height);
+        }
+
+        if (overflow && overflow != 'hidden' && !this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != size.width || newTargetSize.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    parseAnchor : function(a, start, cstart) {
+        if (a && a != 'none') {
+            var last;
+            // standard anchor
+            if (this.parseAnchorRE.test(a)) {
+                var diff = cstart - start;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return v - diff;
+                    }
+                };
+            // percentage
+            } else if(a.indexOf('%') != -1) {
+                var ratio = parseFloat(a.replace('%', ''))*.01;
+                return function(v){
+                    if(v !== last){
+                        last = v;
+                        return Math.floor(v*ratio);
+                    }
+                };
+            // simple offset adjustment
+            } else {
+                a = parseInt(a, 10);
+                if (!isNaN(a)) {
+                    return function(v) {
+                        if (v !== last) {
+                            last = v;
+                            return v + a;
+                        }
+                    };
+                }
+            }
+        }
+        return false;
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return value;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['anchor'] = Ext.layout.AnchorLayout;
+/**
+ * @class Ext.layout.ColumnLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is the layout style of choice for creating structural layouts in a multi-column format where the width of
+ * each column can be specified as a percentage or fixed width, but the height is allowed to vary based on the content.
+ * This class is intended to be extended or created via the layout:'column' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>ColumnLayout does not have any direct config options (other than inherited ones), but it does support a
+ * specific config property of <b><tt>columnWidth</tt></b> that can be included in the config of any panel added to it.  The
+ * layout will use the columnWidth (if present) or width of each panel during layout to determine how to size each panel.
+ * If width or columnWidth is not specified for a given panel, its width will default to the panel's width (or auto).</p>
+ * <p>The width property is always evaluated as pixels, and must be a number greater than or equal to 1.
+ * The columnWidth property is always evaluated as a percentage, and must be a decimal value greater than 0 and
+ * less than 1 (e.g., .25).</p>
+ * <p>The basic rules for specifying column widths are pretty simple.  The logic makes two passes through the
+ * set of contained panels.  During the first layout pass, all panels that either have a fixed width or none
+ * specified (auto) are skipped, but their widths are subtracted from the overall container width.  During the second
+ * pass, all panels with columnWidths are assigned pixel widths in proportion to their percentages based on
+ * the total <b>remaining</b> container width.  In other words, percentage width panels are designed to fill the space
+ * left over by all the fixed-width and/or auto-width panels.  Because of this, while you can specify any number of columns
+ * with different percentages, the columnWidths must always add up to 1 (or 100%) when added together, otherwise your
+ * layout may not render as expected.  Example usage:</p>
+ * <pre><code>
+// All columns are percentages -- they must add up to 1
+var p = new Ext.Panel({
+    title: 'Column Layout - Percentage Only',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        columnWidth: .25
+    },{
+        title: 'Column 2',
+        columnWidth: .6
+    },{
+        title: 'Column 3',
+        columnWidth: .15
+    }]
+});
+
+// Mix of width and columnWidth -- all columnWidth values must add up
+// to 1. The first column will take up exactly 120px, and the last two
+// columns will fill the remaining container width.
+var p = new Ext.Panel({
+    title: 'Column Layout - Mixed',
+    layout:'column',
+    items: [{
+        title: 'Column 1',
+        width: 120
+    },{
+        title: 'Column 2',
+        columnWidth: .8
+    },{
+        title: 'Column 3',
+        columnWidth: .2
+    }]
+});
+</code></pre>
+ */
+Ext.layout.ColumnLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+
+    type: 'column',
+
+    extraCls: 'x-column',
+
+    scrollOffset : 0,
+
+    // private
+
+    targetCls: 'x-column-layout-ct',
+
+    isValidParent : function(c, target){
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    renderAll : function(ct, target) {
+        if(!this.innerCt){
+            // the innerCt prevents wrapping and shuffling while
+            // the container is resizing
+            this.innerCt = target.createChild({cls:'x-column-inner'});
+            this.innerCt.createChild({cls:'x-clear'});
+        }
+        Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items,
+            len = cs.length,
+            c,
+            i,
+            m,
+            margins = [];
+
+        this.renderAll(ct, target);
+
+        var size = this.getLayoutTargetSize();
+
+        if(size.width < 1 && size.height < 1){ // display none?
+            return;
+        }
+
+        var w = size.width - this.scrollOffset,
+            h = size.height,
+            pw = w;
+
+        this.innerCt.setWidth(w);
+
+        // some columns can be percentages while others are fixed
+        // so we need to make 2 passes
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = c.getPositionEl().getMargins('lr');
+            margins[i] = m;
+            if(!c.columnWidth){
+                pw -= (c.getWidth() + m);
+            }
+        }
+
+        pw = pw < 0 ? 0 : pw;
+
+        for(i = 0; i < len; i++){
+            c = cs[i];
+            m = margins[i];
+            if(c.columnWidth){
+                c.setSize(Math.floor(c.columnWidth * pw) - m);
+            }
+        }
+
+        // Browsers differ as to when they account for scrollbars.  We need to re-measure to see if the scrollbar
+        // spaces were accounted for properly.  If not, re-layout.
+        if (Ext.isIE) {
+            if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+                var ts = this.getLayoutTargetSize();
+                if (ts.width != size.width){
+                    this.adjustmentPass = true;
+                    this.onLayout(ct, target);
+                }
+            }
+        }
+        delete this.adjustmentPass;
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['column'] = Ext.layout.ColumnLayout;
+/**
+ * @class Ext.layout.BorderLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This is a multi-pane, application-oriented UI layout style that supports multiple
+ * nested panels, automatic {@link Ext.layout.BorderLayout.Region#split split} bars between
+ * {@link Ext.layout.BorderLayout.Region#BorderLayout.Region regions} and built-in
+ * {@link Ext.layout.BorderLayout.Region#collapsible expanding and collapsing} of regions.</p>
+ * <p>This class is intended to be extended or created via the <tt>layout:'border'</tt>
+ * {@link Ext.Container#layout} config, and should generally not need to be created directly
+ * via the new keyword.</p>
+ * <p>BorderLayout does not have any direct config options (other than inherited ones).
+ * All configuration options available for customizing the BorderLayout are at the
+ * {@link Ext.layout.BorderLayout.Region} and {@link Ext.layout.BorderLayout.SplitRegion}
+ * levels.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var myBorderPanel = new Ext.Panel({
+    {@link Ext.Component#renderTo renderTo}: document.body,
+    {@link Ext.BoxComponent#width width}: 700,
+    {@link Ext.BoxComponent#height height}: 500,
+    {@link Ext.Panel#title title}: 'Border Layout',
+    {@link Ext.Container#layout layout}: 'border',
+    {@link Ext.Container#items items}: [{
+        {@link Ext.Panel#title title}: 'South Region is resizable',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'south',     // position for region
+        {@link Ext.BoxComponent#height height}: 100,
+        {@link Ext.layout.BorderLayout.Region#split split}: true,         // enable resizing
+        {@link Ext.SplitBar#minSize minSize}: 75,         // defaults to {@link Ext.layout.BorderLayout.Region#minHeight 50}
+        {@link Ext.SplitBar#maxSize maxSize}: 150,
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '0 5 5 5'
+    },{
+        // xtype: 'panel' implied by default
+        {@link Ext.Panel#title title}: 'West Region is collapsible',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}:'west',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 0 0 5',
+        {@link Ext.BoxComponent#width width}: 200,
+        {@link Ext.layout.BorderLayout.Region#collapsible collapsible}: true,   // make collapsible
+        {@link Ext.layout.BorderLayout.Region#cmargins cmargins}: '5 5 0 5', // adjust top margin when collapsed
+        {@link Ext.Component#id id}: 'west-region-container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.Panel#unstyled unstyled}: true
+    },{
+        {@link Ext.Panel#title title}: 'Center Region',
+        {@link Ext.layout.BorderLayout.Region#BorderLayout.Region region}: 'center',     // center region is required, no width/height specified
+        {@link Ext.Component#xtype xtype}: 'container',
+        {@link Ext.Container#layout layout}: 'fit',
+        {@link Ext.layout.BorderLayout.Region#margins margins}: '5 5 0 0'
+    }]
+});
+</code></pre>
+ * <p><b><u>Notes</u></b>:</p><div class="mdetail-params"><ul>
+ * <li>Any container using the BorderLayout <b>must</b> have a child item with <tt>region:'center'</tt>.
+ * The child item in the center region will always be resized to fill the remaining space not used by
+ * the other regions in the layout.</li>
+ * <li>Any child items with a region of <tt>west</tt> or <tt>east</tt> must have <tt>width</tt> defined
+ * (an integer representing the number of pixels that the region should take up).</li>
+ * <li>Any child items with a region of <tt>north</tt> or <tt>south</tt> must have <tt>height</tt> defined.</li>
+ * <li>The regions of a BorderLayout are <b>fixed at render time</b> and thereafter, its child Components may not be removed or added</b>.  To add/remove
+ * Components within a BorderLayout, have them wrapped by an additional Container which is directly
+ * managed by the BorderLayout.  If the region is to be collapsible, the Container used directly
+ * by the BorderLayout manager should be a Panel.  In the following example a Container (an Ext.Panel)
+ * is added to the west region:
+ * <div style="margin-left:16px"><pre><code>
+wrc = {@link Ext#getCmp Ext.getCmp}('west-region-container');
+wrc.{@link Ext.Panel#removeAll removeAll}();
+wrc.{@link Ext.Container#add add}({
+    title: 'Added Panel',
+    html: 'Some content'
+});
+wrc.{@link Ext.Container#doLayout doLayout}();
+ * </code></pre></div>
+ * </li>
+ * <li> To reference a {@link Ext.layout.BorderLayout.Region Region}:
+ * <div style="margin-left:16px"><pre><code>
+wr = myBorderPanel.layout.west;
+ * </code></pre></div>
+ * </li>
+ * </ul></div>
+ */
+Ext.layout.BorderLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    // private
+    monitorResize:true,
+    // private
+    rendered : false,
+
+    type: 'border',
+
+    targetCls: 'x-border-layout-ct',
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget();
+        return target ? target.getViewSize() : {};
+    },
+
+    // private
+    onLayout : function(ct, target){
+        var collapsed, i, c, pos, items = ct.items.items, len = items.length;
+        if(!this.rendered){
+            collapsed = [];
+            for(i = 0; i < len; i++) {
+                c = items[i];
+                pos = c.region;
+                if(c.collapsed){
+                    collapsed.push(c);
+                }
+                c.collapsed = false;
+                if(!c.rendered){
+                    c.render(target, i);
+                    c.getPositionEl().addClass('x-border-panel');
+                }
+                this[pos] = pos != 'center' && c.split ?
+                    new Ext.layout.BorderLayout.SplitRegion(this, c.initialConfig, pos) :
+                    new Ext.layout.BorderLayout.Region(this, c.initialConfig, pos);
+                this[pos].render(target, c);
+            }
+            this.rendered = true;
+        }
+
+        var size = this.getLayoutTargetSize();
+        if(size.width < 20 || size.height < 20){ // display none?
+            if(collapsed){
+                this.restoreCollapsed = collapsed;
+            }
+            return;
+        }else if(this.restoreCollapsed){
+            collapsed = this.restoreCollapsed;
+            delete this.restoreCollapsed;
+        }
+
+        var w = size.width, h = size.height,
+            centerW = w, centerH = h, centerY = 0, centerX = 0,
+            n = this.north, s = this.south, west = this.west, e = this.east, c = this.center,
+            b, m, totalWidth, totalHeight;
+        if(!c && Ext.layout.BorderLayout.WARN !== false){
+            throw 'No center region defined in BorderLayout ' + ct.id;
+        }
+
+        if(n && n.isVisible()){
+            b = n.getSize();
+            m = n.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            b.y = m.top;
+            centerY = b.height + b.y + m.bottom;
+            centerH -= centerY;
+            n.applyLayout(b);
+        }
+        if(s && s.isVisible()){
+            b = s.getSize();
+            m = s.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            totalHeight = (b.height + m.top + m.bottom);
+            b.y = h - totalHeight + m.top;
+            centerH -= totalHeight;
+            s.applyLayout(b);
+        }
+        if(west && west.isVisible()){
+            b = west.getSize();
+            m = west.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            b.x = m.left;
+            b.y = centerY + m.top;
+            totalWidth = (b.width + m.left + m.right);
+            centerX += totalWidth;
+            centerW -= totalWidth;
+            west.applyLayout(b);
+        }
+        if(e && e.isVisible()){
+            b = e.getSize();
+            m = e.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            totalWidth = (b.width + m.left + m.right);
+            b.x = w - totalWidth + m.left;
+            b.y = centerY + m.top;
+            centerW -= totalWidth;
+            e.applyLayout(b);
+        }
+        if(c){
+            m = c.getMargins();
+            var centerBox = {
+                x: centerX + m.left,
+                y: centerY + m.top,
+                width: centerW - (m.left+m.right),
+                height: centerH - (m.top+m.bottom)
+            };
+            c.applyLayout(centerBox);
+        }
+        if(collapsed){
+            for(i = 0, len = collapsed.length; i < len; i++){
+                collapsed[i].collapse(false);
+            }
+        }
+        if(Ext.isIE && Ext.isStrict){ // workaround IE strict repainting issue
+            target.repaint();
+        }
+        // Putting a border layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+            var ts = this.getLayoutTargetSize();
+            if (ts.width != size.width || ts.height != size.height){
+                this.adjustmentPass = true;
+                this.onLayout(ct, target);
+            }
+        }
+        delete this.adjustmentPass;
+    },
+
+    destroy: function() {
+        var r = ['north', 'south', 'east', 'west'], i, region;
+        for (i = 0; i < r.length; i++) {
+            region = this[r[i]];
+            if(region){
+                if(region.destroy){
+                    region.destroy();
+                }else if (region.split){
+                    region.split.destroy(true);
+                }
+            }
+        }
+        Ext.layout.BorderLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+/**
+ * @class Ext.layout.BorderLayout.Region
+ * <p>This is a region of a {@link Ext.layout.BorderLayout BorderLayout} that acts as a subcontainer
+ * within the layout.  Each region has its own {@link Ext.layout.ContainerLayout layout} that is
+ * independent of other regions and the containing BorderLayout, and can be any of the
+ * {@link Ext.layout.ContainerLayout valid Ext layout types}.</p>
+ * <p>Region size is managed automatically and cannot be changed by the user -- for
+ * {@link #split resizable regions}, see {@link Ext.layout.BorderLayout.SplitRegion}.</p>
+ * @constructor
+ * Create a new Region.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: <tt>north</tt>, <tt>south</tt>,
+ * <tt>east</tt>, <tt>west</tt> and <tt>center</tt>.  Every {@link Ext.layout.BorderLayout BorderLayout}
+ * <b>must have a center region</b> for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.Region = function(layout, config, pos){
+    Ext.apply(this, config);
+    this.layout = layout;
+    this.position = pos;
+    this.state = {};
+    if(typeof this.margins == 'string'){
+        this.margins = this.layout.parseMargins(this.margins);
+    }
+    this.margins = Ext.applyIf(this.margins || {}, this.defaultMargins);
+    if(this.collapsible){
+        if(typeof this.cmargins == 'string'){
+            this.cmargins = this.layout.parseMargins(this.cmargins);
+        }
+        if(this.collapseMode == 'mini' && !this.cmargins){
+            this.cmargins = {left:0,top:0,right:0,bottom:0};
+        }else{
+            this.cmargins = Ext.applyIf(this.cmargins || {},
+                pos == 'north' || pos == 'south' ? this.defaultNSCMargins : this.defaultEWCMargins);
+        }
+    }
+};
+
+Ext.layout.BorderLayout.Region.prototype = {
+    /**
+     * @cfg {Boolean} animFloat
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel that will close again once the user mouses out of that panel (or clicks out if
+     * <tt>{@link #autoHide} = false</tt>).  Setting <tt>{@link #animFloat} = false</tt> will
+     * prevent the open and close of these floated panels from being animated (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {Boolean} autoHide
+     * When a collapsed region's bar is clicked, the region's panel will be displayed as a floated
+     * panel.  If <tt>autoHide = true</tt>, the panel will automatically hide after the user mouses
+     * out of the panel.  If <tt>autoHide = false</tt>, the panel will continue to display until the
+     * user clicks outside of the panel (defaults to <tt>true</tt>).
+     */
+    /**
+     * @cfg {String} collapseMode
+     * <tt>collapseMode</tt> supports two configuration values:<div class="mdetail-params"><ul>
+     * <li><b><tt>undefined</tt></b> (default)<div class="sub-desc">By default, {@link #collapsible}
+     * regions are collapsed by clicking the expand/collapse tool button that renders into the region's
+     * title bar.</div></li>
+     * <li><b><tt>'mini'</tt></b><div class="sub-desc">Optionally, when <tt>collapseMode</tt> is set to
+     * <tt>'mini'</tt> the region's split bar will also display a small collapse button in the center of
+     * the bar. In <tt>'mini'</tt> mode the region will collapse to a thinner bar than in normal mode.
+     * </div></li>
+     * </ul></div></p>
+     * <p><b>Note</b>: if a collapsible region does not have a title bar, then set <tt>collapseMode =
+     * 'mini'</tt> and <tt>{@link #split} = true</tt> in order for the region to be {@link #collapsible}
+     * by the user as the expand/collapse tool button (that would go in the title bar) will not be rendered.</p>
+     * <p>See also <tt>{@link #cmargins}</tt>.</p>
+     */
+    /**
+     * @cfg {Object} margins
+     * An object containing margins to apply to the region when in the expanded state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values:</p>
+     * <p><div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></div></p>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} cmargins
+     * An object containing margins to apply to the region when in the collapsed state in the
+     * format:<pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>May also be a string containing space-separated, numeric margin values. The order of the
+     * sides associated with each value matches the way CSS processes margin values.</p>
+     * <p><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the first value and the
+     * right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left and right are set
+     * to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+     * </ul></p>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <p><tt>true</tt> to allow the user to collapse this region (defaults to <tt>false</tt>).  If
+     * <tt>true</tt>, an expand/collapse tool button will automatically be rendered into the title
+     * bar of the region, otherwise the button will not be shown.</p>
+     * <p><b>Note</b>: that a title bar is required to display the collapse/expand toggle button -- if
+     * no <tt>title</tt> is specified for the region's panel, the region will only be collapsible if
+     * <tt>{@link #collapseMode} = 'mini'</tt> and <tt>{@link #split} = true</tt>.
+     */
+    collapsible : false,
+    /**
+     * @cfg {Boolean} split
+     * <p><tt>true</tt> to create a {@link Ext.layout.BorderLayout.SplitRegion SplitRegion} and
+     * display a 5px wide {@link Ext.SplitBar} between this region and its neighbor, allowing the user to
+     * resize the regions dynamically.  Defaults to <tt>false</tt> creating a
+     * {@link Ext.layout.BorderLayout.Region Region}.</p><br>
+     * <p><b>Notes</b>:</p><div class="mdetail-params"><ul>
+     * <li>this configuration option is ignored if <tt>region='center'</tt></li>
+     * <li>when <tt>split == true</tt>, it is common to specify a
+     * <tt>{@link Ext.SplitBar#minSize minSize}</tt> and <tt>{@link Ext.SplitBar#maxSize maxSize}</tt>
+     * for the {@link Ext.BoxComponent BoxComponent} representing the region. These are not native
+     * configs of {@link Ext.BoxComponent BoxComponent}, and are used only by this class.</li>
+     * <li>if <tt>{@link #collapseMode} = 'mini'</tt> requires <tt>split = true</tt> to reserve space
+     * for the collapse tool</tt></li>
+     * </ul></div>
+     */
+    split:false,
+    /**
+     * @cfg {Boolean} floatable
+     * <tt>true</tt> to allow clicking a collapsed region's bar to display the region's panel floated
+     * above the layout, <tt>false</tt> to force the user to fully expand a collapsed region by
+     * clicking the expand button to see it again (defaults to <tt>true</tt>).
+     */
+    floatable: true,
+    /**
+     * @cfg {Number} minWidth
+     * <p>The minimum allowable width in pixels for this region (defaults to <tt>50</tt>).
+     * <tt>maxWidth</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minWidth</tt> / <tt>maxWidth</tt>.</p>
+     */
+    minWidth:50,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum allowable height in pixels for this region (defaults to <tt>50</tt>)
+     * <tt>maxHeight</tt> may also be specified.</p><br>
+     * <p><b>Note</b>: setting the <tt>{@link Ext.SplitBar#minSize minSize}</tt> /
+     * <tt>{@link Ext.SplitBar#maxSize maxSize}</tt> supersedes any specified
+     * <tt>minHeight</tt> / <tt>maxHeight</tt>.</p>
+     */
+    minHeight:50,
+
+    // private
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    // private
+    defaultNSCMargins : {left:5,top:5,right:5,bottom:5},
+    // private
+    defaultEWCMargins : {left:5,top:0,right:5,bottom:0},
+    floatingZIndex: 100,
+
+    /**
+     * True if this region is collapsed. Read-only.
+     * @type Boolean
+     * @property
+     */
+    isCollapsed : false,
+
+    /**
+     * This region's panel.  Read-only.
+     * @type Ext.Panel
+     * @property panel
+     */
+    /**
+     * This region's layout.  Read-only.
+     * @type Layout
+     * @property layout
+     */
+    /**
+     * This region's layout position (north, south, east, west or center).  Read-only.
+     * @type String
+     * @property position
+     */
+
+    // private
+    render : function(ct, p){
+        this.panel = p;
+        p.el.enableDisplayMode();
+        this.targetEl = ct;
+        this.el = p.el;
+
+        var gs = p.getState, ps = this.position;
+        p.getState = function(){
+            return Ext.apply(gs.call(p) || {}, this.state);
+        }.createDelegate(this);
+
+        if(ps != 'center'){
+            p.allowQueuedExpand = false;
+            p.on({
+                beforecollapse: this.beforeCollapse,
+                collapse: this.onCollapse,
+                beforeexpand: this.beforeExpand,
+                expand: this.onExpand,
+                hide: this.onHide,
+                show: this.onShow,
+                scope: this
+            });
+            if(this.collapsible || this.floatable){
+                p.collapseEl = 'el';
+                p.slideAnchor = this.getSlideAnchor();
+            }
+            if(p.tools && p.tools.toggle){
+                p.tools.toggle.addClass('x-tool-collapse-'+ps);
+                p.tools.toggle.addClassOnOver('x-tool-collapse-'+ps+'-over');
+            }
+        }
+    },
+
+    // private
+    getCollapsedEl : function(){
+        if(!this.collapsedEl){
+            if(!this.toolTemplate){
+                var tt = new Ext.Template(
+                     '<div class="x-tool x-tool-{id}">&#160;</div>'
+                );
+                tt.disableFormats = true;
+                tt.compile();
+                Ext.layout.BorderLayout.Region.prototype.toolTemplate = tt;
+            }
+            this.collapsedEl = this.targetEl.createChild({
+                cls: "x-layout-collapsed x-layout-collapsed-"+this.position,
+                id: this.panel.id + '-xcollapsed'
+            });
+            this.collapsedEl.enableDisplayMode('block');
+
+            if(this.collapseMode == 'mini'){
+                this.collapsedEl.addClass('x-layout-cmini-'+this.position);
+                this.miniCollapsedEl = this.collapsedEl.createChild({
+                    cls: "x-layout-mini x-layout-mini-"+this.position, html: "&#160;"
+                });
+                this.miniCollapsedEl.addClassOnOver('x-layout-mini-over');
+                this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                this.collapsedEl.on('click', this.onExpandClick, this, {stopEvent:true});
+            }else {
+                if(this.collapsible !== false && !this.hideCollapseTool) {
+                    var t = this.expandToolEl = this.toolTemplate.append(
+                            this.collapsedEl.dom,
+                            {id:'expand-'+this.position}, true);
+                    t.addClassOnOver('x-tool-expand-'+this.position+'-over');
+                    t.on('click', this.onExpandClick, this, {stopEvent:true});
+                }
+                if(this.floatable !== false || this.titleCollapse){
+                   this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
+                   this.collapsedEl.on("click", this[this.floatable ? 'collapseClick' : 'onExpandClick'], this);
+                }
+            }
+        }
+        return this.collapsedEl;
+    },
+
+    // private
+    onExpandClick : function(e){
+        if(this.isSlid){
+            this.panel.expand(false);
+        }else{
+            this.panel.expand();
+        }
+    },
+
+    // private
+    onCollapseClick : function(e){
+        this.panel.collapse();
+    },
+
+    // private
+    beforeCollapse : function(p, animate){
+        this.lastAnim = animate;
+        if(this.splitEl){
+            this.splitEl.hide();
+        }
+        this.getCollapsedEl().show();
+        var el = this.panel.getEl();
+        this.originalZIndex = el.getStyle('z-index');
+        el.setStyle('z-index', 100);
+        this.isCollapsed = true;
+        this.layout.layout();
+    },
+
+    // private
+    onCollapse : function(animate){
+        this.panel.el.setStyle('z-index', 1);
+        if(this.lastAnim === false || this.panel.animCollapse === false){
+            this.getCollapsedEl().dom.style.visibility = 'visible';
+        }else{
+            this.getCollapsedEl().slideIn(this.panel.slideAnchor, {duration:.2});
+        }
+        this.state.collapsed = true;
+        this.panel.saveState();
+    },
+
+    // private
+    beforeExpand : function(animate){
+        if(this.isSlid){
+            this.afterSlideIn();
+        }
+        var c = this.getCollapsedEl();
+        this.el.show();
+        if(this.position == 'east' || this.position == 'west'){
+            this.panel.setSize(undefined, c.getHeight());
+        }else{
+            this.panel.setSize(c.getWidth(), undefined);
+        }
+        c.hide();
+        c.dom.style.visibility = 'hidden';
+        this.panel.el.setStyle('z-index', this.floatingZIndex);
+    },
+
+    // private
+    onExpand : function(){
+        this.isCollapsed = false;
+        if(this.splitEl){
+            this.splitEl.show();
+        }
+        this.layout.layout();
+        this.panel.el.setStyle('z-index', this.originalZIndex);
+        this.state.collapsed = false;
+        this.panel.saveState();
+    },
+
+    // private
+    collapseClick : function(e){
+        if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+        }else{
+           e.stopPropagation();
+           this.slideOut();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().hide();
+        }else if(this.splitEl){
+            this.splitEl.hide();
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.isCollapsed){
+            this.getCollapsedEl().show();
+        }else if(this.splitEl){
+            this.splitEl.show();
+        }
+    },
+
+    /**
+     * True if this region is currently visible, else false.
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return !this.panel.hidden;
+    },
+
+    /**
+     * Returns the current margins for this region.  If the region is collapsed, the
+     * {@link #cmargins} (collapsed margins) value will be returned, otherwise the
+     * {@link #margins} value will be returned.
+     * @return {Object} An object containing the element's margins: <tt>{left: (left
+     * margin), top: (top margin), right: (right margin), bottom: (bottom margin)}</tt>
+     */
+    getMargins : function(){
+        return this.isCollapsed && this.cmargins ? this.cmargins : this.margins;
+    },
+
+    /**
+     * Returns the current size of this region.  If the region is collapsed, the size of the
+     * collapsedEl will be returned, otherwise the size of the region's panel will be returned.
+     * @return {Object} An object containing the element's size: <tt>{width: (element width),
+     * height: (element height)}</tt>
+     */
+    getSize : function(){
+        return this.isCollapsed ? this.getCollapsedEl().getSize() : this.panel.getSize();
+    },
+
+    /**
+     * Sets the specified panel as the container element for this region.
+     * @param {Ext.Panel} panel The new panel
+     */
+    setPanel : function(panel){
+        this.panel = panel;
+    },
+
+    /**
+     * Returns the minimum allowable width for this region.
+     * @return {Number} The minimum width
+     */
+    getMinWidth: function(){
+        return this.minWidth;
+    },
+
+    /**
+     * Returns the minimum allowable height for this region.
+     * @return {Number} The minimum height
+     */
+    getMinHeight: function(){
+        return this.minHeight;
+    },
+
+    // private
+    applyLayoutCollapsed : function(box){
+        var ce = this.getCollapsedEl();
+        ce.setLeftTop(box.x, box.y);
+        ce.setSize(box.width, box.height);
+    },
+
+    // private
+    applyLayout : function(box){
+        if(this.isCollapsed){
+            this.applyLayoutCollapsed(box);
+        }else{
+            this.panel.setPosition(box.x, box.y);
+            this.panel.setSize(box.width, box.height);
+        }
+    },
+
+    // private
+    beforeSlide: function(){
+        this.panel.beforeEffect();
+    },
+
+    // private
+    afterSlide : function(){
+        this.panel.afterEffect();
+    },
+
+    // private
+    initAutoHide : function(){
+        if(this.autoHide !== false){
+            if(!this.autoHideHd){
+                this.autoHideSlideTask = new Ext.util.DelayedTask(this.slideIn, this);
+                this.autoHideHd = {
+                    "mouseout": function(e){
+                        if(!e.within(this.el, true)){
+                            this.autoHideSlideTask.delay(500);
+                        }
+                    },
+                    "mouseover" : function(e){
+                        this.autoHideSlideTask.cancel();
+                    },
+                    scope : this
+                };
+            }
+            this.el.on(this.autoHideHd);
+            this.collapsedEl.on(this.autoHideHd);
+        }
+    },
+
+    // private
+    clearAutoHide : function(){
+        if(this.autoHide !== false){
+            this.el.un("mouseout", this.autoHideHd.mouseout);
+            this.el.un("mouseover", this.autoHideHd.mouseover);
+            this.collapsedEl.un("mouseout", this.autoHideHd.mouseout);
+            this.collapsedEl.un("mouseover", this.autoHideHd.mouseover);
+        }
+    },
+
+    // private
+    clearMonitor : function(){
+        Ext.getDoc().un("click", this.slideInIf, this);
+    },
+
+    /**
+     * If this Region is {@link #floatable}, this method slides this Region into full visibility <i>over the top
+     * of the center Region</i> where it floats until either {@link #slideIn} is called, or other regions of the layout
+     * are clicked, or the mouse exits the Region.
+     */
+    slideOut : function(){
+        if(this.isSlid || this.el.hasActiveFx()){
+            return;
+        }
+        this.isSlid = true;
+        var ts = this.panel.tools, dh, pc;
+        if(ts && ts.toggle){
+            ts.toggle.hide();
+        }
+        this.el.show();
+
+        // Temporarily clear the collapsed flag so we can onResize the panel on the slide
+        pc = this.panel.collapsed;
+        this.panel.collapsed = false;
+
+        if(this.position == 'east' || this.position == 'west'){
+            // Temporarily clear the deferHeight flag so we can size the height on the slide
+            dh = this.panel.deferHeight;
+            this.panel.deferHeight = false;
+
+            this.panel.setSize(undefined, this.collapsedEl.getHeight());
+
+            // Put the deferHeight flag back after setSize
+            this.panel.deferHeight = dh;
+        }else{
+            this.panel.setSize(this.collapsedEl.getWidth(), undefined);
+        }
+
+        // Put the collapsed flag back after onResize
+        this.panel.collapsed = pc;
+
+        this.restoreLT = [this.el.dom.style.left, this.el.dom.style.top];
+        this.el.alignTo(this.collapsedEl, this.getCollapseAnchor());
+        this.el.setStyle("z-index", this.floatingZIndex+2);
+        this.panel.el.replaceClass('x-panel-collapsed', 'x-panel-floating');
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideIn(this.getSlideAnchor(), {
+                callback: function(){
+                    this.afterSlide();
+                    this.initAutoHide();
+                    Ext.getDoc().on("click", this.slideInIf, this);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.initAutoHide();
+             Ext.getDoc().on("click", this.slideInIf, this);
+        }
+    },
+
+    // private
+    afterSlideIn : function(){
+        this.clearAutoHide();
+        this.isSlid = false;
+        this.clearMonitor();
+        this.el.setStyle("z-index", "");
+        this.panel.el.replaceClass('x-panel-floating', 'x-panel-collapsed');
+        this.el.dom.style.left = this.restoreLT[0];
+        this.el.dom.style.top = this.restoreLT[1];
+
+        var ts = this.panel.tools;
+        if(ts && ts.toggle){
+            ts.toggle.show();
+        }
+    },
+
+    /**
+     * If this Region is {@link #floatable}, and this Region has been slid into floating visibility, then this method slides
+     * this region back into its collapsed state.
+     */
+    slideIn : function(cb){
+        if(!this.isSlid || this.el.hasActiveFx()){
+            Ext.callback(cb);
+            return;
+        }
+        this.isSlid = false;
+        if(this.animFloat !== false){
+            this.beforeSlide();
+            this.el.slideOut(this.getSlideAnchor(), {
+                callback: function(){
+                    this.el.hide();
+                    this.afterSlide();
+                    this.afterSlideIn();
+                    Ext.callback(cb);
+                },
+                scope: this,
+                block: true
+            });
+        }else{
+            this.el.hide();
+            this.afterSlideIn();
+        }
+    },
+
+    // private
+    slideInIf : function(e){
+        if(!e.within(this.el)){
+            this.slideIn();
+        }
+    },
+
+    // private
+    anchors : {
+        "west" : "left",
+        "east" : "right",
+        "north" : "top",
+        "south" : "bottom"
+    },
+
+    // private
+    sanchors : {
+        "west" : "l",
+        "east" : "r",
+        "north" : "t",
+        "south" : "b"
+    },
+
+    // private
+    canchors : {
+        "west" : "tl-tr",
+        "east" : "tr-tl",
+        "north" : "tl-bl",
+        "south" : "bl-tl"
+    },
+
+    // private
+    getAnchor : function(){
+        return this.anchors[this.position];
+    },
+
+    // private
+    getCollapseAnchor : function(){
+        return this.canchors[this.position];
+    },
+
+    // private
+    getSlideAnchor : function(){
+        return this.sanchors[this.position];
+    },
+
+    // private
+    getAlignAdj : function(){
+        var cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [0, 0];
+            break;
+            case "east":
+                return [0, 0];
+            break;
+            case "north":
+                return [0, 0];
+            break;
+            case "south":
+                return [0, 0];
+            break;
+        }
+    },
+
+    // private
+    getExpandAdj : function(){
+        var c = this.collapsedEl, cm = this.cmargins;
+        switch(this.position){
+            case "west":
+                return [-(cm.right+c.getWidth()+cm.left), 0];
+            break;
+            case "east":
+                return [cm.right+c.getWidth()+cm.left, 0];
+            break;
+            case "north":
+                return [0, -(cm.top+cm.bottom+c.getHeight())];
+            break;
+            case "south":
+                return [0, cm.top+cm.bottom+c.getHeight()];
+            break;
+        }
+    },
+
+    destroy : function(){
+        if (this.autoHideSlideTask && this.autoHideSlideTask.cancel){
+            this.autoHideSlideTask.cancel();
+        }
+        Ext.destroyMembers(this, 'miniCollapsedEl', 'collapsedEl', 'expandToolEl');
+    }
+};
+
+/**
+ * @class Ext.layout.BorderLayout.SplitRegion
+ * @extends Ext.layout.BorderLayout.Region
+ * <p>This is a specialized type of {@link Ext.layout.BorderLayout.Region BorderLayout region} that
+ * has a built-in {@link Ext.SplitBar} for user resizing of regions.  The movement of the split bar
+ * is configurable to move either {@link #tickSize smooth or incrementally}.</p>
+ * @constructor
+ * Create a new SplitRegion.
+ * @param {Layout} layout The {@link Ext.layout.BorderLayout BorderLayout} instance that is managing this Region.
+ * @param {Object} config The configuration options
+ * @param {String} position The region position.  Valid values are: north, south, east, west and center.  Every
+ * BorderLayout must have a center region for the primary content -- all other regions are optional.
+ */
+Ext.layout.BorderLayout.SplitRegion = function(layout, config, pos){
+    Ext.layout.BorderLayout.SplitRegion.superclass.constructor.call(this, layout, config, pos);
+    // prevent switch
+    this.applyLayout = this.applyFns[pos];
+};
+
+Ext.extend(Ext.layout.BorderLayout.SplitRegion, Ext.layout.BorderLayout.Region, {
+    /**
+     * @cfg {Number} tickSize
+     * The increment, in pixels by which to move this Region's {@link Ext.SplitBar SplitBar}.
+     * By default, the {@link Ext.SplitBar SplitBar} moves smoothly.
+     */
+    /**
+     * @cfg {String} splitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible non-collapsible} region's split bar
+     * (defaults to <tt>"Drag to resize."</tt>).  Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    splitTip : "Drag to resize.",
+    /**
+     * @cfg {String} collapsibleSplitTip
+     * The tooltip to display when the user hovers over a
+     * {@link Ext.layout.BorderLayout.Region#collapsible collapsible} region's split bar
+     * (defaults to "Drag to resize. Double click to hide."). Only applies if
+     * <tt>{@link #useSplitTips} = true</tt>.
+     */
+    collapsibleSplitTip : "Drag to resize. Double click to hide.",
+    /**
+     * @cfg {Boolean} useSplitTips
+     * <tt>true</tt> to display a tooltip when the user hovers over a region's split bar
+     * (defaults to <tt>false</tt>).  The tooltip text will be the value of either
+     * <tt>{@link #splitTip}</tt> or <tt>{@link #collapsibleSplitTip}</tt> as appropriate.
+     */
+    useSplitTips : false,
+
+    // private
+    splitSettings : {
+        north : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.TOP,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        south : {
+            orientation: Ext.SplitBar.VERTICAL,
+            placement: Ext.SplitBar.BOTTOM,
+            maxFn : 'getVMaxSize',
+            minProp: 'minHeight',
+            maxProp: 'maxHeight'
+        },
+        east : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.RIGHT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        },
+        west : {
+            orientation: Ext.SplitBar.HORIZONTAL,
+            placement: Ext.SplitBar.LEFT,
+            maxFn : 'getHMaxSize',
+            minProp: 'minWidth',
+            maxProp: 'maxWidth'
+        }
+    },
+
+    // private
+    applyFns : {
+        west : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            this.panel.setPosition(box.x, box.y);
+            var sw = sd.offsetWidth;
+            s.left = (box.x+box.width-sw)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        east : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sw = sd.offsetWidth;
+            this.panel.setPosition(box.x+sw, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.height = Math.max(0, box.height)+'px';
+            this.panel.setSize(box.width-sw, box.height);
+        },
+        north : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y);
+            s.left = (box.x)+'px';
+            s.top = (box.y+box.height-sh)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        },
+        south : function(box){
+            if(this.isCollapsed){
+                return this.applyLayoutCollapsed(box);
+            }
+            var sd = this.splitEl.dom, s = sd.style;
+            var sh = sd.offsetHeight;
+            this.panel.setPosition(box.x, box.y+sh);
+            s.left = (box.x)+'px';
+            s.top = (box.y)+'px';
+            s.width = Math.max(0, box.width)+'px';
+            this.panel.setSize(box.width, box.height-sh);
+        }
+    },
+
+    // private
+    render : function(ct, p){
+        Ext.layout.BorderLayout.SplitRegion.superclass.render.call(this, ct, p);
+
+        var ps = this.position;
+
+        this.splitEl = ct.createChild({
+            cls: "x-layout-split x-layout-split-"+ps, html: "&#160;",
+            id: this.panel.id + '-xsplit'
+        });
+
+        if(this.collapseMode == 'mini'){
+            this.miniSplitEl = this.splitEl.createChild({
+                cls: "x-layout-mini x-layout-mini-"+ps, html: "&#160;"
+            });
+            this.miniSplitEl.addClassOnOver('x-layout-mini-over');
+            this.miniSplitEl.on('click', this.onCollapseClick, this, {stopEvent:true});
+        }
+
+        var s = this.splitSettings[ps];
+
+        this.split = new Ext.SplitBar(this.splitEl.dom, p.el, s.orientation);
+        this.split.tickSize = this.tickSize;
+        this.split.placement = s.placement;
+        this.split.getMaximumSize = this[s.maxFn].createDelegate(this);
+        this.split.minSize = this.minSize || this[s.minProp];
+        this.split.on("beforeapply", this.onSplitMove, this);
+        this.split.useShim = this.useShim === true;
+        this.maxSize = this.maxSize || this[s.maxProp];
+
+        if(p.hidden){
+            this.splitEl.hide();
+        }
+
+        if(this.useSplitTips){
+            this.splitEl.dom.title = this.collapsible ? this.collapsibleSplitTip : this.splitTip;
+        }
+        if(this.collapsible){
+            this.splitEl.on("dblclick", this.onCollapseClick,  this);
+        }
+    },
+
+    //docs inherit from superclass
+    getSize : function(){
+        if(this.isCollapsed){
+            return this.collapsedEl.getSize();
+        }
+        var s = this.panel.getSize();
+        if(this.position == 'north' || this.position == 'south'){
+            s.height += this.splitEl.dom.offsetHeight;
+        }else{
+            s.width += this.splitEl.dom.offsetWidth;
+        }
+        return s;
+    },
+
+    // private
+    getHMaxSize : function(){
+         var cmax = this.maxSize || 10000;
+         var center = this.layout.center;
+         return Math.min(cmax, (this.el.getWidth()+center.el.getWidth())-center.getMinWidth());
+    },
+
+    // private
+    getVMaxSize : function(){
+        var cmax = this.maxSize || 10000;
+        var center = this.layout.center;
+        return Math.min(cmax, (this.el.getHeight()+center.el.getHeight())-center.getMinHeight());
+    },
+
+    // private
+    onSplitMove : function(split, newSize){
+        var s = this.panel.getSize();
+        this.lastSplitSize = newSize;
+        if(this.position == 'north' || this.position == 'south'){
+            this.panel.setSize(s.width, newSize);
+            this.state.height = newSize;
+        }else{
+            this.panel.setSize(newSize, s.height);
+            this.state.width = newSize;
+        }
+        this.layout.layout();
+        this.panel.saveState();
+        return false;
+    },
+
+    /**
+     * Returns a reference to the split bar in use by this region.
+     * @return {Ext.SplitBar} The split bar
+     */
+    getSplitBar : function(){
+        return this.split;
+    },
+
+    // inherit docs
+    destroy : function() {
+        Ext.destroy(this.miniSplitEl, this.split, this.splitEl);
+        Ext.layout.BorderLayout.SplitRegion.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS['border'] = Ext.layout.BorderLayout;
+/**
+ * @class Ext.layout.FormLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This layout manager is specifically designed for rendering and managing child Components of
+ * {@link Ext.form.FormPanel forms}. It is responsible for rendering the labels of
+ * {@link Ext.form.Field Field}s.</p>
+ *
+ * <p>This layout manager is used when a Container is configured with the <tt>layout:'form'</tt>
+ * {@link Ext.Container#layout layout} config option, and should generally not need to be created directly
+ * via the new keyword. See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ *
+ * <p>In an application, it will usually be preferrable to use a {@link Ext.form.FormPanel FormPanel}
+ * (which is configured with FormLayout as its layout class by default) since it also provides built-in
+ * functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form.</p>
+ *
+ * <p>A {@link Ext.Container Container} <i>using</i> the FormLayout layout manager (e.g.
+ * {@link Ext.form.FormPanel} or specifying <tt>layout:'form'</tt>) can also accept the following
+ * layout-specific config properties:<div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.form.FormPanel#hideLabels hideLabels}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelAlign labelAlign}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelPad labelPad}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.form.FormPanel#labelWidth labelWidth}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component (including Fields) managed by FormLayout accepts the following as a config option:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#anchor anchor}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Any Component managed by FormLayout may be rendered as a form field (with an associated label) by
+ * configuring it with a non-null <b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b>. Components configured
+ * in this way may be configured with the following options which affect the way the FormLayout renders them:
+ * <div class="mdetail-params"><ul>
+ * <li><b><tt>{@link Ext.Component#clearCls clearCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#fieldLabel fieldLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#hideLabel hideLabel}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#itemCls itemCls}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelSeparator labelSeparator}</tt></b></li>
+ * <li><b><tt>{@link Ext.Component#labelStyle labelStyle}</tt></b></li>
+ * </ul></div></p>
+ *
+ * <p>Example usage:</p>
+ * <pre><code>
+// Required if showing validation messages
+Ext.QuickTips.init();
+
+// While you can create a basic Panel with layout:'form', practically
+// you should usually use a FormPanel to also get its form functionality
+// since it already creates a FormLayout internally.
+var form = new Ext.form.FormPanel({
+    title: 'Form Layout',
+    bodyStyle: 'padding:15px',
+    width: 350,
+    defaultType: 'textfield',
+    defaults: {
+        // applied to each contained item
+        width: 230,
+        msgTarget: 'side'
+    },
+    items: [{
+            fieldLabel: 'First Name',
+            name: 'first',
+            allowBlank: false,
+            {@link Ext.Component#labelSeparator labelSeparator}: ':' // override labelSeparator layout config
+        },{
+            fieldLabel: 'Last Name',
+            name: 'last'
+        },{
+            fieldLabel: 'Email',
+            name: 'email',
+            vtype:'email'
+        }, {
+            xtype: 'textarea',
+            hideLabel: true,     // override hideLabels layout config
+            name: 'msg',
+            anchor: '100% -53'
+        }
+    ],
+    buttons: [
+        {text: 'Save'},
+        {text: 'Cancel'}
+    ],
+    layoutConfig: {
+        {@link #labelSeparator}: '~' // superseded by assignment below
+    },
+    // config options applicable to container when layout='form':
+    hideLabels: false,
+    labelAlign: 'left',   // or 'right' or 'top'
+    {@link Ext.form.FormPanel#labelSeparator labelSeparator}: '>>', // takes precedence over layoutConfig value
+    labelWidth: 65,       // defaults to 100
+    labelPad: 8           // defaults to 5, must specify labelWidth to be honored
+});
+</code></pre>
+ */
+Ext.layout.FormLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.form.FormPanel}.{@link Ext.form.FormPanel#labelSeparator labelSeparator}.  Configuration
+     * of this property at the <b>container</b> level takes precedence.
+     */
+    labelSeparator : ':',
+
+    /**
+     * Read only. The CSS style specification string added to field labels in this layout if not
+     * otherwise {@link Ext.Component#labelStyle specified by each contained field}.
+     * @type String
+     * @property labelStyle
+     */
+
+    /**
+     * @cfg {Boolean} trackLabels
+     * True to show/hide the field label when the field is hidden. Defaults to <tt>true</tt>.
+     */
+    trackLabels: true,
+
+    type: 'form',
+
+    onRemove: function(c){
+        Ext.layout.FormLayout.superclass.onRemove.call(this, c);
+        if(this.trackLabels){
+            c.un('show', this.onFieldShow, this);
+            c.un('hide', this.onFieldHide, this);
+        }
+        // check for itemCt, since we may be removing a fieldset or something similar
+        var el = c.getPositionEl(),
+            ct = c.getItemCt && c.getItemCt();
+        if (c.rendered && ct) {
+            if (el && el.dom) {
+                el.insertAfter(ct);
+            }
+            Ext.destroy(ct);
+            Ext.destroyMembers(c, 'label', 'itemCt');
+            if (c.customItemCt) {
+                Ext.destroyMembers(c, 'getItemCt', 'customItemCt');
+            }
+        }
+    },
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.FormLayout.superclass.setContainer.call(this, ct);
+        if(ct.labelAlign){
+            ct.addClass('x-form-label-'+ct.labelAlign);
+        }
+
+        if(ct.hideLabels){
+            Ext.apply(this, {
+                labelStyle: 'display:none',
+                elementStyle: 'padding-left:0;',
+                labelAdjust: 0
+            });
+        }else{
+            this.labelSeparator = Ext.isDefined(ct.labelSeparator) ? ct.labelSeparator : this.labelSeparator;
+            ct.labelWidth = ct.labelWidth || 100;
+            if(Ext.isNumber(ct.labelWidth)){
+                var pad = Ext.isNumber(ct.labelPad) ? ct.labelPad : 5;
+                Ext.apply(this, {
+                    labelAdjust: ct.labelWidth + pad,
+                    labelStyle: 'width:' + ct.labelWidth + 'px;',
+                    elementStyle: 'padding-left:' + (ct.labelWidth + pad) + 'px'
+                });
+            }
+            if(ct.labelAlign == 'top'){
+                Ext.apply(this, {
+                    labelStyle: 'width:auto;',
+                    labelAdjust: 0,
+                    elementStyle: 'padding-left:0;'
+                });
+            }
+        }
+    },
+
+    // private
+    isHide: function(c){
+        return c.hideLabel || this.container.hideLabels;
+    },
+
+    onFieldShow: function(c){
+        c.getItemCt().removeClass('x-hide-' + c.hideMode);
+
+        // Composite fields will need to layout after the container is made visible
+        if (c.isComposite) {
+            c.doLayout();
+        }
+    },
+
+    onFieldHide: function(c){
+        c.getItemCt().addClass('x-hide-' + c.hideMode);
+    },
+
+    //private
+    getLabelStyle: function(s){
+        var ls = '', items = [this.labelStyle, s];
+        for (var i = 0, len = items.length; i < len; ++i){
+            if (items[i]){
+                ls += items[i];
+                if (ls.substr(-1, 1) != ';'){
+                    ls += ';';
+                }
+            }
+        }
+        return ls;
+    },
+
+    /**
+     * @cfg {Ext.Template} fieldTpl
+     * A {@link Ext.Template#compile compile}d {@link Ext.Template} for rendering
+     * the fully wrapped, labeled and styled form Field. Defaults to:</p><pre><code>
+new Ext.Template(
+    &#39;&lt;div class="x-form-item {itemCls}" tabIndex="-1">&#39;,
+        &#39;&lt;&#108;abel for="{id}" style="{labelStyle}" class="x-form-item-&#108;abel">{&#108;abel}{labelSeparator}&lt;/&#108;abel>&#39;,
+        &#39;&lt;div class="x-form-element" id="x-form-el-{id}" style="{elementStyle}">&#39;,
+        &#39;&lt;/div>&lt;div class="{clearCls}">&lt;/div>&#39;,
+    '&lt;/div>'
+);
+</code></pre>
+     * <p>This may be specified to produce a different DOM structure when rendering form Fields.</p>
+     * <p>A description of the properties within the template follows:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to <tt>''</tt>)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * <p>Also see <tt>{@link #getTemplateArgs}</tt></p>
+     */
+
+    /**
+     * @private
+     *
+     */
+    renderItem : function(c, position, target){
+        if(c && (c.isFormField || c.fieldLabel) && c.inputType != 'hidden'){
+            var args = this.getTemplateArgs(c);
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position] || null;
+            }
+            if(position){
+                c.itemCt = this.fieldTpl.insertBefore(position, args, true);
+            }else{
+                c.itemCt = this.fieldTpl.append(target, args, true);
+            }
+            if(!c.getItemCt){
+                // Non form fields don't have getItemCt, apply it here
+                // This will get cleaned up in onRemove
+                Ext.apply(c, {
+                    getItemCt: function(){
+                        return c.itemCt;
+                    },
+                    customItemCt: true
+                });
+            }
+            c.label = c.getItemCt().child('label.x-form-item-label');
+            if(!c.rendered){
+                c.render('x-form-el-' + c.id);
+            }else if(!this.isValidParent(c, target)){
+                Ext.fly('x-form-el-' + c.id).appendChild(c.getPositionEl());
+            }
+            if(this.trackLabels){
+                if(c.hidden){
+                    this.onFieldHide(c);
+                }
+                c.on({
+                    scope: this,
+                    show: this.onFieldShow,
+                    hide: this.onFieldHide
+                });
+            }
+            this.configureItem(c);
+        }else {
+            Ext.layout.FormLayout.superclass.renderItem.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Provides template arguments for rendering the fully wrapped, labeled and styled form Field.</p>
+     * <p>This method returns an object hash containing properties used by the layout's {@link #fieldTpl}
+     * to create a correctly wrapped, labeled and styled form Field. This may be overriden to
+     * create custom layouts. The properties which must be returned are:</p><div class="mdetail-params"><ul>
+     * <li><b><tt>itemCls</tt></b> : String<div class="sub-desc">The CSS class applied to the outermost div wrapper
+     * that contains this field label and field element (the default class is <tt>'x-form-item'</tt> and <tt>itemCls</tt>
+     * will be added to that). If supplied, <tt>itemCls</tt> at the field level will override the default <tt>itemCls</tt>
+     * supplied at the container level.</div></li>
+     * <li><b><tt>id</tt></b> : String<div class="sub-desc">The id of the Field</div></li>
+     * <li><b><tt>{@link #labelStyle}</tt></b> : String<div class="sub-desc">
+     * A CSS style specification string to add to the field label for this field (defaults to <tt>''</tt> or the
+     * {@link #labelStyle layout's value for <tt>labelStyle</tt>}).</div></li>
+     * <li><b><tt>label</tt></b> : String<div class="sub-desc">The text to display as the label for this
+     * field (defaults to the field's configured fieldLabel property)</div></li>
+     * <li><b><tt>{@link #labelSeparator}</tt></b> : String<div class="sub-desc">The separator to display after
+     * the text of the label for this field (defaults to a colon <tt>':'</tt> or the
+     * {@link #labelSeparator layout's value for labelSeparator}). To hide the separator use empty string ''.</div></li>
+     * <li><b><tt>elementStyle</tt></b> : String<div class="sub-desc">The styles text for the input element's wrapper.</div></li>
+     * <li><b><tt>clearCls</tt></b> : String<div class="sub-desc">The CSS class to apply to the special clearing div
+     * rendered directly after each form field wrapper (defaults to <tt>'x-form-clear-left'</tt>)</div></li>
+     * </ul></div>
+     * @param (Ext.form.Field} field The {@link Ext.form.Field Field} being rendered.
+     * @return {Object} An object hash containing the properties required to render the Field.
+     */
+    getTemplateArgs: function(field) {
+        var noLabelSep = !field.fieldLabel || field.hideLabel,
+            itemCls = (field.itemCls || this.container.itemCls || '') + (field.hideLabel ? ' x-hide-label' : '');
+
+        // IE9 quirks needs an extra, identifying class on wrappers of TextFields
+        if (Ext.isIE9 && Ext.isIEQuirks && field instanceof Ext.form.TextField) {
+            itemCls += ' x-input-wrapper';
+        }
+
+        return {
+            id            : field.id,
+            label         : field.fieldLabel,
+            itemCls       : itemCls,
+            clearCls      : field.clearCls || 'x-form-clear-left',
+            labelStyle    : this.getLabelStyle(field.labelStyle),
+            elementStyle  : this.elementStyle || '',
+            labelSeparator: noLabelSep ? '' : (Ext.isDefined(field.labelSeparator) ? field.labelSeparator : this.labelSeparator)
+        };
+    },
+
+    // private
+    adjustWidthAnchor: function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign != 'top')){
+            var adjust = Ext.isIE6 || (Ext.isIE && !Ext.isStrict);
+            return value - this.labelAdjust + (adjust ? -3 : 0);
+        }
+        return value;
+    },
+
+    adjustHeightAnchor : function(value, c){
+        if(c.label && !this.isHide(c) && (this.container.labelAlign == 'top')){
+            return value - c.label.getHeight();
+        }
+        return value;
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return target && this.container.getEl().contains(c.getPositionEl());
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['form'] = Ext.layout.FormLayout;
+/**
+ * @class Ext.layout.AccordionLayout
+ * @extends Ext.layout.FitLayout
+ * <p>This is a layout that manages multiple Panels in an expandable accordion style such that only
+ * <b>one Panel can be expanded at any given time</b>. Each Panel has built-in support for expanding and collapsing.</p>
+ * <p>Note: Only Ext.Panels <b>and all subclasses of Ext.Panel</b> may be used in an accordion layout Container.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var accordion = new Ext.Panel({
+    title: 'Accordion Layout',
+    layout:'accordion',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle: 'padding:15px'
+    },
+    layoutConfig: {
+        // layout-specific configs go here
+        titleCollapse: false,
+        animate: true,
+        activeOnTop: true
+    },
+    items: [{
+        title: 'Panel 1',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 2',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    },{
+        title: 'Panel 3',
+        html: '&lt;p&gt;Panel content!&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AccordionLayout = Ext.extend(Ext.layout.FitLayout, {
+    /**
+     * @cfg {Boolean} fill
+     * True to adjust the active item's height to fill the available space in the container, false to use the
+     * item's current height, or auto height if not explicitly set (defaults to true).
+     */
+    fill : true,
+    /**
+     * @cfg {Boolean} autoWidth
+     * True to set each contained item's width to 'auto', false to use the item's current width (defaults to true).
+     * Note that some components, in particular the {@link Ext.grid.GridPanel grid}, will not function properly within
+     * layouts if they have auto width, so in such cases this config should be set to false.
+     */
+    autoWidth : true,
+    /**
+     * @cfg {Boolean} titleCollapse
+     * True to allow expand/collapse of each contained panel by clicking anywhere on the title bar, false to allow
+     * expand/collapse only when the toggle tool button is clicked (defaults to true).  When set to false,
+     * {@link #hideCollapseTool} should be false also.
+     */
+    titleCollapse : true,
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * True to hide the contained panels' collapse/expand toggle buttons, false to display them (defaults to false).
+     * When set to true, {@link #titleCollapse} should be true also.
+     */
+    hideCollapseTool : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * True to make sure the collapse/expand toggle button always renders first (to the left of) any other tools
+     * in the contained panels' title bars, false to render it last (defaults to false).
+     */
+    collapseFirst : false,
+    /**
+     * @cfg {Boolean} animate
+     * True to slide the contained panels open and closed during expand/collapse using animation, false to open and
+     * close directly with no animation (defaults to false).  Note: to defer to the specific config setting of each
+     * contained panel for this property, set this to undefined at the layout level.
+     */
+    animate : false,
+    /**
+     * @cfg {Boolean} sequence
+     * <b>Experimental</b>. If animate is set to true, this will result in each animation running in sequence.
+     */
+    sequence : false,
+    /**
+     * @cfg {Boolean} activeOnTop
+     * True to swap the position of each panel as it is expanded so that it becomes the first item in the container,
+     * false to keep the panels in the rendered order. <b>This is NOT compatible with "animate:true"</b> (defaults to false).
+     */
+    activeOnTop : false,
+
+    type: 'accordion',
+
+    renderItem : function(c){
+        if(this.animate === false){
+            c.animCollapse = false;
+        }
+        c.collapsible = true;
+        if(this.autoWidth){
+            c.autoWidth = true;
+        }
+        if(this.titleCollapse){
+            c.titleCollapse = true;
+        }
+        if(this.hideCollapseTool){
+            c.hideCollapseTool = true;
+        }
+        if(this.collapseFirst !== undefined){
+            c.collapseFirst = this.collapseFirst;
+        }
+        if(!this.activeItem && !c.collapsed){
+            this.setActiveItem(c, true);
+        }else if(this.activeItem && this.activeItem != c){
+            c.collapsed = true;
+        }
+        Ext.layout.AccordionLayout.superclass.renderItem.apply(this, arguments);
+        c.header.addClass('x-accordion-hd');
+        c.on('beforeexpand', this.beforeExpand, this);
+    },
+
+    onRemove: function(c){
+        Ext.layout.AccordionLayout.superclass.onRemove.call(this, c);
+        if(c.rendered){
+            c.header.removeClass('x-accordion-hd');
+        }
+        c.un('beforeexpand', this.beforeExpand, this);
+    },
+
+    // private
+    beforeExpand : function(p, anim){
+        var ai = this.activeItem;
+        if(ai){
+            if(this.sequence){
+                delete this.activeItem;
+                if (!ai.collapsed){
+                    ai.collapse({callback:function(){
+                        p.expand(anim || true);
+                    }, scope: this});
+                    return false;
+                }
+            }else{
+                ai.collapse(this.animate);
+            }
+        }
+        this.setActive(p);
+        if(this.activeOnTop){
+            p.el.dom.parentNode.insertBefore(p.el.dom, p.el.dom.parentNode.firstChild);
+        }
+        // Items have been hidden an possibly rearranged, we need to get the container size again.
+        this.layout();
+    },
+
+    // private
+    setItemSize : function(item, size){
+        if(this.fill && item){
+            var hh = 0, i, ct = this.getRenderedItems(this.container), len = ct.length, p;
+            // Add up all the header heights
+            for (i = 0; i < len; i++) {
+                if((p = ct[i]) != item && !p.hidden){
+                    hh += p.header.getHeight();
+                }
+            };
+            // Subtract the header heights from the container size
+            size.height -= hh;
+            // Call setSize on the container to set the correct height.  For Panels, deferedHeight
+            // will simply store this size for when the expansion is done.
+            item.setSize(size);
+        }
+    },
+
+    /**
+     * Sets the active (expanded) item in the layout.
+     * @param {String/Number} item The string component id or numeric index of the item to activate
+     */
+    setActiveItem : function(item){
+        this.setActive(item, true);
+    },
+
+    // private
+    setActive : function(item, expand){
+        var ai = this.activeItem;
+        item = this.container.getComponent(item);
+        if(ai != item){
+            if(item.rendered && item.collapsed && expand){
+                item.expand();
+            }else{
+                if(ai){
+                   ai.fireEvent('deactivate', ai);
+                }
+                this.activeItem = item;
+                item.fireEvent('activate', item);
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS.accordion = Ext.layout.AccordionLayout;
+
+//backwards compat
+Ext.layout.Accordion = Ext.layout.AccordionLayout;/**
+ * @class Ext.layout.TableLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>This layout allows you to easily render content into an HTML table.  The total number of columns can be
+ * specified, and rowspan and colspan can be used to create complex layouts within the table.
+ * This class is intended to be extended or created via the layout:'table' {@link Ext.Container#layout} config,
+ * and should generally not need to be created directly via the new keyword.</p>
+ * <p>Note that when creating a layout via config, the layout-specific config properties must be passed in via
+ * the {@link Ext.Container#layoutConfig} object which will then be applied internally to the layout.  In the
+ * case of TableLayout, the only valid layout config property is {@link #columns}.  However, the items added to a
+ * TableLayout can supply the following table-specific config properties:</p>
+ * <ul>
+ * <li><b>rowspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>colspan</b> Applied to the table cell containing the item.</li>
+ * <li><b>cellId</b> An id applied to the table cell containing the item.</li>
+ * <li><b>cellCls</b> A CSS class name added to the table cell containing the item.</li>
+ * </ul>
+ * <p>The basic concept of building up a TableLayout is conceptually very similar to building up a standard
+ * HTML table.  You simply add each panel (or "cell") that you want to include along with any span attributes
+ * specified as the special config properties of rowspan and colspan which work exactly like their HTML counterparts.
+ * Rather than explicitly creating and nesting rows and columns as you would in HTML, you simply specify the
+ * total column count in the layoutConfig and start adding panels in their natural order from left to right,
+ * top to bottom.  The layout will automatically figure out, based on the column count, rowspans and colspans,
+ * how to position each panel within the table.  Just like with HTML tables, your rowspans and colspans must add
+ * up correctly in your overall layout or you'll end up with missing and/or extra cells!  Example usage:</p>
+ * <pre><code>
+// This code will generate a layout table that is 3 columns by 2 rows
+// with some spanning included.  The basic layout will be:
+// +--------+-----------------+
+// |   A    |   B             |
+// |        |--------+--------|
+// |        |   C    |   D    |
+// +--------+--------+--------+
+var table = new Ext.Panel({
+    title: 'Table Layout',
+    layout:'table',
+    defaults: {
+        // applied to each contained panel
+        bodyStyle:'padding:20px'
+    },
+    layoutConfig: {
+        // The total column count must be specified here
+        columns: 3
+    },
+    items: [{
+        html: '&lt;p&gt;Cell A content&lt;/p&gt;',
+        rowspan: 2
+    },{
+        html: '&lt;p&gt;Cell B content&lt;/p&gt;',
+        colspan: 2
+    },{
+        html: '&lt;p&gt;Cell C content&lt;/p&gt;',
+        cellCls: 'highlight'
+    },{
+        html: '&lt;p&gt;Cell D content&lt;/p&gt;'
+    }]
+});
+</code></pre>
+ */
+Ext.layout.TableLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Number} columns
+     * The total number of columns to create in the table for this layout.  If not specified, all Components added to
+     * this layout will be rendered into a single row using one column per Component.
+     */
+
+    // private
+    monitorResize:false,
+
+    type: 'table',
+
+    targetCls: 'x-table-layout-ct',
+
+    /**
+     * @cfg {Object} tableAttrs
+     * <p>An object containing properties which are added to the {@link Ext.DomHelper DomHelper} specification
+     * used to create the layout's <tt>&lt;table&gt;</tt> element. Example:</p><pre><code>
+{
+    xtype: 'panel',
+    layout: 'table',
+    layoutConfig: {
+        tableAttrs: {
+            style: {
+                width: '100%'
+            }
+        },
+        columns: 3
+    }
+}</code></pre>
+     */
+    tableAttrs:null,
+
+    // private
+    setContainer : function(ct){
+        Ext.layout.TableLayout.superclass.setContainer.call(this, ct);
+
+        this.currentRow = 0;
+        this.currentColumn = 0;
+        this.cells = [];
+    },
+    
+    // private
+    onLayout : function(ct, target){
+        var cs = ct.items.items, len = cs.length, c, i;
+
+        if(!this.table){
+            target.addClass('x-table-layout-ct');
+
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        this.renderAll(ct, target);
+    },
+
+    // private
+    getRow : function(index){
+        var row = this.table.tBodies[0].childNodes[index];
+        if(!row){
+            row = document.createElement('tr');
+            this.table.tBodies[0].appendChild(row);
+        }
+        return row;
+    },
+
+    // private
+    getNextCell : function(c){
+        var cell = this.getNextNonSpan(this.currentColumn, this.currentRow);
+        var curCol = this.currentColumn = cell[0], curRow = this.currentRow = cell[1];
+        for(var rowIndex = curRow; rowIndex < curRow + (c.rowspan || 1); rowIndex++){
+            if(!this.cells[rowIndex]){
+                this.cells[rowIndex] = [];
+            }
+            for(var colIndex = curCol; colIndex < curCol + (c.colspan || 1); colIndex++){
+                this.cells[rowIndex][colIndex] = true;
+            }
+        }
+        var td = document.createElement('td');
+        if(c.cellId){
+            td.id = c.cellId;
+        }
+        var cls = 'x-table-layout-cell';
+        if(c.cellCls){
+            cls += ' ' + c.cellCls;
+        }
+        td.className = cls;
+        if(c.colspan){
+            td.colSpan = c.colspan;
+        }
+        if(c.rowspan){
+            td.rowSpan = c.rowspan;
+        }
+        this.getRow(curRow).appendChild(td);
+        return td;
+    },
+
+    // private
+    getNextNonSpan: function(colIndex, rowIndex){
+        var cols = this.columns;
+        while((cols && colIndex >= cols) || (this.cells[rowIndex] && this.cells[rowIndex][colIndex])) {
+            if(cols && colIndex >= cols){
+                rowIndex++;
+                colIndex = 0;
+            }else{
+                colIndex++;
+            }
+        }
+        return [colIndex, rowIndex];
+    },
+
+    // private
+    renderItem : function(c, position, target){
+        // Ensure we have our inner table to get cells to render into.
+        if(!this.table){
+            this.table = target.createChild(
+                Ext.apply({tag:'table', cls:'x-table-layout', cellspacing: 0, cn: {tag: 'tbody'}}, this.tableAttrs), null, true);
+        }
+        if(c && !c.rendered){
+            c.render(this.getNextCell(c));
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            var container = this.getNextCell(c);
+            container.insertBefore(c.getPositionEl().dom, null);
+            c.container = Ext.get(container);
+            this.configureItem(c);
+        }
+    },
+
+    // private
+    isValidParent : function(c, target){
+        return c.getPositionEl().up('table', 5).dom.parentNode === (target.dom || target);
+    },
+    
+    destroy: function(){
+        delete this.table;
+        Ext.layout.TableLayout.superclass.destroy.call(this);
+    }
+
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+
+Ext.Container.LAYOUTS['table'] = Ext.layout.TableLayout;/**
+ * @class Ext.layout.AbsoluteLayout
+ * @extends Ext.layout.AnchorLayout
+ * <p>This is a layout that inherits the anchoring of <b>{@link Ext.layout.AnchorLayout}</b> and adds the
+ * ability for x/y positioning using the standard x and y component config options.</p>
+ * <p>This class is intended to be extended or created via the <tt><b>{@link Ext.Container#layout layout}</b></tt>
+ * configuration property.  See <tt><b>{@link Ext.Container#layout}</b></tt> for additional details.</p>
+ * <p>Example usage:</p>
+ * <pre><code>
+var form = new Ext.form.FormPanel({
+    title: 'Absolute Layout',
+    layout:'absolute',
+    layoutConfig: {
+        // layout-specific configs go here
+        extraCls: 'x-abs-layout-item',
+    },
+    baseCls: 'x-plain',
+    url:'save-form.php',
+    defaultType: 'textfield',
+    items: [{
+        x: 0,
+        y: 5,
+        xtype:'label',
+        text: 'Send To:'
+    },{
+        x: 60,
+        y: 0,
+        name: 'to',
+        anchor:'100%'  // anchor width by percentage
+    },{
+        x: 0,
+        y: 35,
+        xtype:'label',
+        text: 'Subject:'
+    },{
+        x: 60,
+        y: 30,
+        name: 'subject',
+        anchor: '100%'  // anchor width by percentage
+    },{
+        x:0,
+        y: 60,
+        xtype: 'textarea',
+        name: 'msg',
+        anchor: '100% 100%'  // anchor width and height
+    }]
+});
+</code></pre>
+ */
+Ext.layout.AbsoluteLayout = Ext.extend(Ext.layout.AnchorLayout, {
+
+    extraCls: 'x-abs-layout-item',
+
+    type: 'absolute',
+
+    onLayout : function(ct, target){
+        target.position();
+        this.paddingLeft = target.getPadding('l');
+        this.paddingTop = target.getPadding('t');
+        Ext.layout.AbsoluteLayout.superclass.onLayout.call(this, ct, target);
+    },
+
+    // private
+    adjustWidthAnchor : function(value, comp){
+        return value ? value - comp.getPosition(true)[0] + this.paddingLeft : value;
+    },
+
+    // private
+    adjustHeightAnchor : function(value, comp){
+        return  value ? value - comp.getPosition(true)[1] + this.paddingTop : value;
+    }
+    /**
+     * @property activeItem
+     * @hide
+     */
+});
+Ext.Container.LAYOUTS['absolute'] = Ext.layout.AbsoluteLayout;
+/**
+ * @class Ext.layout.BoxLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Base Class for HBoxLayout and VBoxLayout Classes. Generally it should not need to be used directly.</p>
+ */
+Ext.layout.BoxLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    /**
+     * @cfg {Object} defaultMargins
+     * <p>If the individual contained items do not have a <tt>margins</tt>
+     * property specified, the default margins from this property will be
+     * applied to each item.</p>
+     * <br><p>This property may be specified as an object containing margins
+     * to apply in the format:</p><pre><code>
+{
+    top: (top margin),
+    right: (right margin),
+    bottom: (bottom margin),
+    left: (left margin)
+}</code></pre>
+     * <p>This property may also be specified as a string containing
+     * space-separated, numeric margin values. The order of the sides associated
+     * with each value matches the way CSS processes margin values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to:</p><pre><code>
+     * {top:0, right:0, bottom:0, left:0}
+     * </code></pre>
+     */
+    defaultMargins : {left:0,top:0,right:0,bottom:0},
+    /**
+     * @cfg {String} padding
+     * <p>Sets the padding to be applied to all child items managed by this layout.</p>
+     * <p>This property must be specified as a string containing
+     * space-separated, numeric padding values. The order of the sides associated
+     * with each value matches the way CSS processes padding values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li>If there is only one value, it applies to all sides.</li>
+     * <li>If there are two values, the top and bottom borders are set to the
+     * first value and the right and left are set to the second.</li>
+     * <li>If there are three values, the top is set to the first value, the left
+     * and right are set to the second, and the bottom is set to the third.</li>
+     * <li>If there are four values, they apply to the top, right, bottom, and
+     * left, respectively.</li>
+     * </ul></div>
+     * <p>Defaults to: <code>"0"</code></p>
+     */
+    padding : '0',
+    // documented in subclasses
+    pack : 'start',
+
+    // private
+    monitorResize : true,
+    type: 'box',
+    scrollOffset : 0,
+    extraCls : 'x-box-item',
+    targetCls : 'x-box-layout-ct',
+    innerCls : 'x-box-inner',
+
+    constructor : function(config){
+        Ext.layout.BoxLayout.superclass.constructor.call(this, config);
+
+        if (Ext.isString(this.defaultMargins)) {
+            this.defaultMargins = this.parseMargins(this.defaultMargins);
+        }
+        
+        var handler = this.overflowHandler;
+        
+        if (typeof handler == 'string') {
+            handler = {
+                type: handler
+            };
+        }
+        
+        var handlerType = 'none';
+        if (handler && handler.type != undefined) {
+            handlerType = handler.type;
+        }
+        
+        var constructor = Ext.layout.boxOverflow[handlerType];
+        if (constructor[this.type]) {
+            constructor = constructor[this.type];
+        }
+        
+        this.overflowHandler = new constructor(this, handler);
+    },
+
+    /**
+     * @private
+     * Runs the child box calculations and caches them in childBoxCache. Subclasses can used these cached values
+     * when laying out
+     */
+    onLayout: function(container, target) {
+        Ext.layout.BoxLayout.superclass.onLayout.call(this, container, target);
+
+        var tSize = this.getLayoutTargetSize(),
+            items = this.getVisibleItems(container),
+            calcs = this.calculateChildBoxes(items, tSize),
+            boxes = calcs.boxes,
+            meta  = calcs.meta;
+        
+        //invoke the overflow handler, if one is configured
+        if (tSize.width > 0) {
+            var handler = this.overflowHandler,
+                method  = meta.tooNarrow ? 'handleOverflow' : 'clearOverflow';
+            
+            var results = handler[method](calcs, tSize);
+            
+            if (results) {
+                if (results.targetSize) {
+                    tSize = results.targetSize;
+                }
+                
+                if (results.recalculate) {
+                    items = this.getVisibleItems(container);
+                    calcs = this.calculateChildBoxes(items, tSize);
+                    boxes = calcs.boxes;
+                }
+            }
+        }
+        
+        /**
+         * @private
+         * @property layoutTargetLastSize
+         * @type Object
+         * Private cache of the last measured size of the layout target. This should never be used except by
+         * BoxLayout subclasses during their onLayout run.
+         */
+        this.layoutTargetLastSize = tSize;
+        
+        /**
+         * @private
+         * @property childBoxCache
+         * @type Array
+         * Array of the last calculated height, width, top and left positions of each visible rendered component
+         * within the Box layout.
+         */
+        this.childBoxCache = calcs;
+        
+        this.updateInnerCtSize(tSize, calcs);
+        this.updateChildBoxes(boxes);
+
+        // Putting a box layout into an overflowed container is NOT correct and will make a second layout pass necessary.
+        this.handleTargetOverflow(tSize, container, target);
+    },
+
+    /**
+     * Resizes and repositions each child component
+     * @param {Array} boxes The box measurements
+     */
+    updateChildBoxes: function(boxes) {
+        for (var i = 0, length = boxes.length; i < length; i++) {
+            var box  = boxes[i],
+                comp = box.component;
+            
+            if (box.dirtySize) {
+                comp.setSize(box.width, box.height);
+            }
+            // Don't set positions to NaN
+            if (isNaN(box.left) || isNaN(box.top)) {
+                continue;
+            }
+            
+            comp.setPosition(box.left, box.top);
+        }
+    },
+
+    /**
+     * @private
+     * Called by onRender just before the child components are sized and positioned. This resizes the innerCt
+     * to make sure all child items fit within it. We call this before sizing the children because if our child
+     * items are larger than the previous innerCt size the browser will insert scrollbars and then remove them
+     * again immediately afterwards, giving a performance hit.
+     * Subclasses should provide an implementation.
+     * @param {Object} currentSize The current height and width of the innerCt
+     * @param {Array} calculations The new box calculations of all items to be laid out
+     */
+    updateInnerCtSize: function(tSize, calcs) {
+        var align   = this.align,
+            padding = this.padding,
+            width   = tSize.width,
+            height  = tSize.height;
+        
+        if (this.type == 'hbox') {
+            var innerCtWidth  = width,
+                innerCtHeight = calcs.meta.maxHeight + padding.top + padding.bottom;
+
+            if (align == 'stretch') {
+                innerCtHeight = height;
+            } else if (align == 'middle') {
+                innerCtHeight = Math.max(height, innerCtHeight);
+            }
+        } else {
+            var innerCtHeight = height,
+                innerCtWidth  = calcs.meta.maxWidth + padding.left + padding.right;
+
+            if (align == 'stretch') {
+                innerCtWidth = width;
+            } else if (align == 'center') {
+                innerCtWidth = Math.max(width, innerCtWidth);
+            }
+        }
+
+        this.innerCt.setSize(innerCtWidth || undefined, innerCtHeight || undefined);
+    },
+
+    /**
+     * @private
+     * This should be called after onLayout of any BoxLayout subclass. If the target's overflow is not set to 'hidden',
+     * we need to lay out a second time because the scrollbars may have modified the height and width of the layout
+     * target. Having a Box layout inside such a target is therefore not recommended.
+     * @param {Object} previousTargetSize The size and height of the layout target before we just laid out
+     * @param {Ext.Container} container The container
+     * @param {Ext.Element} target The target element
+     */
+    handleTargetOverflow: function(previousTargetSize, container, target) {
+        var overflow = target.getStyle('overflow');
+
+        if (overflow && overflow != 'hidden' &&!this.adjustmentPass) {
+            var newTargetSize = this.getLayoutTargetSize();
+            if (newTargetSize.width != previousTargetSize.width || newTargetSize.height != previousTargetSize.height){
+                this.adjustmentPass = true;
+                this.onLayout(container, target);
+            }
+        }
+
+        delete this.adjustmentPass;
+    },
+
+    // private
+    isValidParent : function(c, target) {
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    /**
+     * @private
+     * Returns all items that are both rendered and visible
+     * @return {Array} All matching items
+     */
+    getVisibleItems: function(ct) {
+        var ct  = ct || this.container,
+            t   = ct.getLayoutTarget(),
+            cti = ct.items.items,
+            len = cti.length,
+
+            i, c, items = [];
+
+        for (i = 0; i < len; i++) {
+            if((c = cti[i]).rendered && this.isValidParent(c, t) && c.hidden !== true  && c.collapsed !== true && c.shouldLayout !== false){
+                items.push(c);
+            }
+        }
+
+        return items;
+    },
+
+    // private
+    renderAll : function(ct, target) {
+        if (!this.innerCt) {
+            // the innerCt prevents wrapping and shuffling while the container is resizing
+            this.innerCt = target.createChild({cls:this.innerCls});
+            this.padding = this.parseMargins(this.padding);
+        }
+        Ext.layout.BoxLayout.superclass.renderAll.call(this, ct, this.innerCt);
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        
+        if (target) {
+            ret = target.getViewSize();
+
+            // IE in strict mode will return a width of 0 on the 1st pass of getViewSize.
+            // Use getStyleSize to verify the 0 width, the adjustment pass will then work properly
+            // with getViewSize
+            if (Ext.isIE && Ext.isStrict && ret.width == 0){
+                ret =  target.getStyleSize();
+            }
+
+            ret.width  -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        
+        return ret;
+    },
+
+    // private
+    renderItem : function(c) {
+        if(Ext.isString(c.margins)){
+            c.margins = this.parseMargins(c.margins);
+        }else if(!c.margins){
+            c.margins = this.defaultMargins;
+        }
+        Ext.layout.BoxLayout.superclass.renderItem.apply(this, arguments);
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.overflowHandler);
+        
+        Ext.layout.BoxLayout.superclass.destroy.apply(this, arguments);
+    }
+});
+
+/**
+ * @class Ext.layout.boxOverflow.None
+ * @extends Object
+ * Base class for Box Layout overflow handlers. These specialized classes are invoked when a Box Layout
+ * (either an HBox or a VBox) has child items that are either too wide (for HBox) or too tall (for VBox)
+ * for its container.
+ */
+
+Ext.layout.boxOverflow.None = Ext.extend(Object, {
+    constructor: function(layout, config) {
+        this.layout = layout;
+        
+        Ext.apply(this, config || {});
+    },
+    
+    handleOverflow: Ext.emptyFn,
+    
+    clearOverflow: Ext.emptyFn
+});
+
+
+Ext.layout.boxOverflow.none = Ext.layout.boxOverflow.None;
+/**
+ * @class Ext.layout.boxOverflow.Menu
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Menu = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+    
+    constructor: function(layout) {
+        Ext.layout.boxOverflow.Menu.superclass.constructor.apply(this, arguments);
+        
+        /**
+         * @property menuItems
+         * @type Array
+         * Array of all items that are currently hidden and should go into the dropdown menu
+         */
+        this.menuItems = [];
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt, innerCt and afterCt elements if they have not already been created
+     * @param {Ext.Container} container The Container attached to this Layout instance
+     * @param {Ext.Element} target The target Element
+     */
+    createInnerElements: function() {
+        if (!this.afterCt) {
+            this.afterCt  = this.layout.innerCt.insertSibling({cls: this.afterCls},  'before');
+        }
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function(calculations, targetSize) {
+        var newWidth = targetSize.width + (this.afterCt ? this.afterCt.getWidth() : 0),
+            items    = this.menuItems;
+        
+        this.hideTrigger();
+        
+        for (var index = 0, length = items.length; index < length; index++) {
+            items.pop().component.show();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            }
+        };
+    },
+    
+    /**
+     * @private
+     */
+    showTrigger: function() {
+        this.createMenu();
+        this.menuTrigger.show();
+    },
+    
+    /**
+     * @private
+     */
+    hideTrigger: function() {
+        if (this.menuTrigger != undefined) {
+            this.menuTrigger.hide();
+        }
+    },
+    
+    /**
+     * @private
+     * Called before the overflow menu is shown. This constructs the menu's items, caching them for as long as it can.
+     */
+    beforeMenuShow: function(menu) {
+        var items = this.menuItems,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+        
+        this.clearMenu();
+        menu.removeAll();
+        
+        for (var i = 0; i < len; i++) {
+            item = items[i].component;
+            
+            if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                menu.add('-');
+            }
+            
+            this.addComponentToMenu(menu, item);
+            prev = item;
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+    
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the overflow trigger and menu used when enableOverflow is set to true and the items
+     * in the layout are too wide to fit in the space available
+     */
+    createMenu: function() {
+        if (!this.menuTrigger) {
+            this.createInnerElements();
+            
+            /**
+             * @private
+             * @property menu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every item that cannot be shown
+             * because the container is currently not large enough.
+             */
+            this.menu = new Ext.menu.Menu({
+                ownerCt : this.layout.container,
+                listeners: {
+                    scope: this,
+                    beforeshow: this.beforeMenuShow
+                }
+            });
+
+            /**
+             * @private
+             * @property menuTrigger
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.menuTrigger = new Ext.Button({
+                iconCls : 'x-toolbar-more-icon',
+                cls     : 'x-toolbar-more',
+                menu    : this.menu,
+                renderTo: this.afterCt
+            });
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.menu, this.menuTrigger);
+    }
+});
+
+Ext.layout.boxOverflow.menu = Ext.layout.boxOverflow.Menu;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalMenu
+ * @extends Ext.layout.boxOverflow.Menu
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalMenu = Ext.extend(Ext.layout.boxOverflow.Menu, {
+    
+    constructor: function() {
+        Ext.layout.boxOverflow.HorizontalMenu.superclass.constructor.apply(this, arguments);
+        
+        var me = this,
+            layout = me.layout,
+            origFunction = layout.calculateChildBoxes;
+        
+        layout.calculateChildBoxes = function(visibleItems, targetSize) {
+            var calcs = origFunction.apply(layout, arguments),
+                meta  = calcs.meta,
+                items = me.menuItems;
+            
+            //calculate the width of the items currently hidden solely because there is not enough space
+            //to display them
+            var hiddenWidth = 0;
+            for (var index = 0, length = items.length; index < length; index++) {
+                hiddenWidth += items[index].width;
+            }
+            
+            meta.minimumWidth += hiddenWidth;
+            meta.tooNarrow = meta.minimumWidth > targetSize.width;
+            
+            return calcs;
+        };        
+    },
+    
+    handleOverflow: function(calculations, targetSize) {
+        this.showTrigger();
+        
+        var newWidth    = targetSize.width - this.afterCt.getWidth(),
+            boxes       = calculations.boxes,
+            usedWidth   = 0,
+            recalculate = false;
+        
+        //calculate the width of all visible items and any spare width
+        for (var index = 0, length = boxes.length; index < length; index++) {
+            usedWidth += boxes[index].width;
+        }
+        
+        var spareWidth = newWidth - usedWidth,
+            showCount  = 0;
+        
+        //see if we can re-show any of the hidden components
+        for (var index = 0, length = this.menuItems.length; index < length; index++) {
+            var hidden = this.menuItems[index],
+                comp   = hidden.component,
+                width  = hidden.width;
+            
+            if (width < spareWidth) {
+                comp.show();
+                
+                spareWidth -= width;
+                showCount ++;
+                recalculate = true;
+            } else {
+                break;
+            }
+        }
+                
+        if (recalculate) {
+            this.menuItems = this.menuItems.slice(showCount);
+        } else {
+            for (var i = boxes.length - 1; i >= 0; i--) {
+                var item  = boxes[i].component,
+                    right = boxes[i].left + boxes[i].width;
+
+                if (right >= newWidth) {
+                    this.menuItems.unshift({
+                        component: item,
+                        width    : boxes[i].width
+                    });
+
+                    item.hide();
+                } else {
+                    break;
+                }
+            }
+        }
+        
+        if (this.menuItems.length == 0) {
+            this.hideTrigger();
+        }
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : newWidth
+            },
+            recalculate: recalculate
+        };
+    }
+});
+
+Ext.layout.boxOverflow.menu.hbox = Ext.layout.boxOverflow.HorizontalMenu;/**
+ * @class Ext.layout.boxOverflow.Scroller
+ * @extends Ext.layout.boxOverflow.None
+ * Description
+ */
+Ext.layout.boxOverflow.Scroller = Ext.extend(Ext.layout.boxOverflow.None, {
+    /**
+     * @cfg animateScroll
+     * @type Boolean
+     * True to animate the scrolling of items within the layout (defaults to true, ignored if enableScroll is false)
+     */
+    animateScroll: true,
+    
+    /**
+     * @cfg scrollIncrement
+     * @type Number
+     * The number of pixels to scroll by on scroller click (defaults to 100)
+     */
+    scrollIncrement: 100,
+    
+    /**
+     * @cfg wheelIncrement
+     * @type Number
+     * The number of pixels to increment on mouse wheel scrolling (defaults to <tt>3</tt>).
+     */
+    wheelIncrement: 3,
+    
+    /**
+     * @cfg scrollRepeatInterval
+     * @type Number
+     * Number of milliseconds between each scroll while a scroller button is held down (defaults to 400)
+     */
+    scrollRepeatInterval: 400,
+    
+    /**
+     * @cfg scrollDuration
+     * @type Number
+     * Number of seconds that each scroll animation lasts (defaults to 0.4)
+     */
+    scrollDuration: 0.4,
+    
+    /**
+     * @cfg beforeCls
+     * @type String
+     * CSS class added to the beforeCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the leftmost edge of the Container
+     */
+    beforeCls: 'x-strip-left',
+    
+    /**
+     * @cfg afterCls
+     * @type String
+     * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers,
+     * which must always be present at the rightmost edge of the Container
+     */
+    afterCls: 'x-strip-right',
+    
+    /**
+     * @cfg scrollerCls
+     * @type String
+     * CSS class added to both scroller elements if enableScroll is used
+     */
+    scrollerCls: 'x-strip-scroller',
+    
+    /**
+     * @cfg beforeScrollerCls
+     * @type String
+     * CSS class added to the left scroller element if enableScroll is used
+     */
+    beforeScrollerCls: 'x-strip-scroller-left',
+    
+    /**
+     * @cfg afterScrollerCls
+     * @type String
+     * CSS class added to the right scroller element if enableScroll is used
+     */
+    afterScrollerCls: 'x-strip-scroller-right',
+    
+    /**
+     * @private
+     * Sets up an listener to scroll on the layout's innerCt mousewheel event
+     */
+    createWheelListener: function() {
+        this.layout.innerCt.on({
+            scope     : this,
+            mousewheel: function(e) {
+                e.stopEvent();
+
+                this.scrollBy(e.getWheelDelta() * this.wheelIncrement * -1, false);
+            }
+        });
+    },
+    
+    /**
+     * @private
+     * Most of the heavy lifting is done in the subclasses
+     */
+    handleOverflow: function(calculations, targetSize) {
+        this.createInnerElements();
+        this.showScrollers();
+    },
+    
+    /**
+     * @private
+     */
+    clearOverflow: function() {
+        this.hideScrollers();
+    },
+    
+    /**
+     * @private
+     * Shows the scroller elements in the beforeCt and afterCt. Creates the scrollers first if they are not already
+     * present. 
+     */
+    showScrollers: function() {
+        this.createScrollers();
+        
+        this.beforeScroller.show();
+        this.afterScroller.show();
+        
+        this.updateScrollButtons();
+    },
+    
+    /**
+     * @private
+     * Hides the scroller elements in the beforeCt and afterCt
+     */
+    hideScrollers: function() {
+        if (this.beforeScroller != undefined) {
+            this.beforeScroller.hide();
+            this.afterScroller.hide();          
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the clickable scroller elements and places them into the beforeCt and afterCt
+     */
+    createScrollers: function() {
+        if (!this.beforeScroller && !this.afterScroller) {
+            var before = this.beforeCt.createChild({
+                cls: String.format("{0} {1} ", this.scrollerCls, this.beforeScrollerCls)
+            });
+            
+            var after = this.afterCt.createChild({
+                cls: String.format("{0} {1}", this.scrollerCls, this.afterScrollerCls)
+            });
+            
+            before.addClassOnOver(this.beforeScrollerCls + '-hover');
+            after.addClassOnOver(this.afterScrollerCls + '-hover');
+            
+            before.setVisibilityMode(Ext.Element.DISPLAY);
+            after.setVisibilityMode(Ext.Element.DISPLAY);
+            
+            this.beforeRepeater = new Ext.util.ClickRepeater(before, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollLeft,
+                scope   : this
+            });
+            
+            this.afterRepeater = new Ext.util.ClickRepeater(after, {
+                interval: this.scrollRepeatInterval,
+                handler : this.scrollRight,
+                scope   : this
+            });
+            
+            /**
+             * @property beforeScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.beforeScroller = before;
+            
+            /**
+             * @property afterScroller
+             * @type Ext.Element
+             * The left scroller element. Only created when needed.
+             */
+            this.afterScroller = after;
+        }
+    },
+    
+    /**
+     * @private
+     */
+    destroy: function() {
+        Ext.destroy(this.beforeScroller, this.afterScroller, this.beforeRepeater, this.afterRepeater, this.beforeCt, this.afterCt);
+    },
+    
+    /**
+     * @private
+     * Scrolls left or right by the number of pixels specified
+     * @param {Number} delta Number of pixels to scroll to the right by. Use a negative number to scroll left
+     */
+    scrollBy: function(delta, animate) {
+        this.scrollTo(this.getScrollPosition() + delta, animate);
+    },
+    
+    /**
+     * @private
+     * Normalizes an item reference, string id or numerical index into a reference to the item
+     * @param {Ext.Component|String|Number} item The item reference, id or index
+     * @return {Ext.Component} The item
+     */
+    getItem: function(item) {
+        if (Ext.isString(item)) {
+            item = Ext.getCmp(item);
+        } else if (Ext.isNumber(item)) {
+            item = this.items[item];
+        }
+        
+        return item;
+    },
+    
+    /**
+     * @private
+     * @return {Object} Object passed to scrollTo when scrolling
+     */
+    getScrollAnim: function() {
+        return {
+            duration: this.scrollDuration, 
+            callback: this.updateScrollButtons, 
+            scope   : this
+        };
+    },
+    
+    /**
+     * @private
+     * Enables or disables each scroller button based on the current scroll position
+     */
+    updateScrollButtons: function() {
+        if (this.beforeScroller == undefined || this.afterScroller == undefined) {
+            return;
+        }
+        
+        var beforeMeth = this.atExtremeBefore()  ? 'addClass' : 'removeClass',
+            afterMeth  = this.atExtremeAfter() ? 'addClass' : 'removeClass',
+            beforeCls  = this.beforeScrollerCls + '-disabled',
+            afterCls   = this.afterScrollerCls  + '-disabled';
+        
+        this.beforeScroller[beforeMeth](beforeCls);
+        this.afterScroller[afterMeth](afterCls);
+        this.scrolling = false;
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its left-most point
+     * @return {Boolean} True if already at furthest left point
+     */
+    atExtremeBefore: function() {
+        return this.getScrollPosition() === 0;
+    },
+    
+    /**
+     * @private
+     * Scrolls to the left by the configured amount
+     */
+    scrollLeft: function(animate) {
+        this.scrollBy(-this.scrollIncrement, animate);
+    },
+    
+    /**
+     * @private
+     * Scrolls to the right by the configured amount
+     */
+    scrollRight: function(animate) {
+        this.scrollBy(this.scrollIncrement, animate);
+    },
+    
+    /**
+     * Scrolls to the given component.
+     * @param {String|Number|Ext.Component} item The item to scroll to. Can be a numerical index, component id 
+     * or a reference to the component itself.
+     * @param {Boolean} animate True to animate the scrolling
+     */
+    scrollToItem: function(item, animate) {
+        item = this.getItem(item);
+        
+        if (item != undefined) {
+            var visibility = this.getItemVisibility(item);
+            
+            if (!visibility.fullyVisible) {
+                var box  = item.getBox(true, true),
+                    newX = box.x;
+                    
+                if (visibility.hiddenRight) {
+                    newX -= (this.layout.innerCt.getWidth() - box.width);
+                }
+                
+                this.scrollTo(newX, animate);
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * For a given item in the container, return an object with information on whether the item is visible
+     * with the current innerCt scroll value.
+     * @param {Ext.Component} item The item
+     * @return {Object} Values for fullyVisible, hiddenLeft and hiddenRight
+     */
+    getItemVisibility: function(item) {
+        var box         = this.getItem(item).getBox(true, true),
+            itemLeft    = box.x,
+            itemRight   = box.x + box.width,
+            scrollLeft  = this.getScrollPosition(),
+            scrollRight = this.layout.innerCt.getWidth() + scrollLeft;
+        
+        return {
+            hiddenLeft  : itemLeft < scrollLeft,
+            hiddenRight : itemRight > scrollRight,
+            fullyVisible: itemLeft > scrollLeft && itemRight < scrollRight
+        };
+    }
+});
+
+Ext.layout.boxOverflow.scroller = Ext.layout.boxOverflow.Scroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.VerticalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.VerticalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    scrollIncrement: 75,
+    wheelIncrement : 2,
+    
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height - (this.beforeCt.getHeight() + this.afterCt.getHeight()),
+                width : targetSize.width
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'after');
+
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollBottom());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('top', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollTop, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollBottom: function() {
+        return this.layout.innerCt.dom.scrollHeight - this.layout.innerCt.getHeight();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollBottom();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.vbox = Ext.layout.boxOverflow.VerticalScroller;
+
+
+/**
+ * @class Ext.layout.boxOverflow.HorizontalScroller
+ * @extends Ext.layout.boxOverflow.Scroller
+ * Description
+ */
+Ext.layout.boxOverflow.HorizontalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, {
+    handleOverflow: function(calculations, targetSize) {
+        Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this, arguments);
+        
+        return {
+            targetSize: {
+                height: targetSize.height,
+                width : targetSize.width - (this.beforeCt.getWidth() + this.afterCt.getWidth())
+            }
+        };
+    },
+    
+    /**
+     * @private
+     * Creates the beforeCt and afterCt elements if they have not already been created
+     */
+    createInnerElements: function() {
+        var target = this.layout.innerCt;
+        
+        //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of
+        //special items such as scrollers or dropdown menu triggers
+        if (!this.beforeCt) {
+            this.afterCt  = target.insertSibling({cls: this.afterCls},  'before');
+            this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before');
+            
+            this.createWheelListener();
+        }
+    },
+    
+    /**
+     * @private
+     * Scrolls to the given position. Performs bounds checking.
+     * @param {Number} position The position to scroll to. This is constrained.
+     * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll
+     */
+    scrollTo: function(position, animate) {
+        var oldPosition = this.getScrollPosition(),
+            newPosition = position.constrain(0, this.getMaxScrollRight());
+        
+        if (newPosition != oldPosition && !this.scrolling) {
+            if (animate == undefined) {
+                animate = this.animateScroll;
+            }
+            
+            this.layout.innerCt.scrollTo('left', newPosition, animate ? this.getScrollAnim() : false);
+            
+            if (animate) {
+                this.scrolling = true;
+            } else {
+                this.scrolling = false;
+                this.updateScrollButtons();
+            }
+        }
+    },
+    
+    /**
+     * Returns the current scroll position of the innerCt element
+     * @return {Number} The current scroll position
+     */
+    getScrollPosition: function(){
+        return parseInt(this.layout.innerCt.dom.scrollLeft, 10) || 0;
+    },
+    
+    /**
+     * @private
+     * Returns the maximum value we can scrollTo
+     * @return {Number} The max scroll value
+     */
+    getMaxScrollRight: function() {
+        return this.layout.innerCt.dom.scrollWidth - this.layout.innerCt.getWidth();
+    },
+    
+    /**
+     * @private
+     * Returns true if the innerCt scroll is already at its right-most point
+     * @return {Boolean} True if already at furthest right point
+     */
+    atExtremeAfter: function() {
+        return this.getScrollPosition() >= this.getMaxScrollRight();
+    }
+});
+
+Ext.layout.boxOverflow.scroller.hbox = Ext.layout.boxOverflow.HorizontalScroller;/**
+ * @class Ext.layout.HBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items horizontally across a Container. This layout optionally divides available horizontal
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the heights of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.HBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>top</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned vertically
+     * at the <b>top</b> of the container</div></li>
+     * <li><b><tt>middle</tt></b> : <div class="sub-desc">child items are aligned vertically in the
+     * <b>middle</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched vertically to fill
+     * the height of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched vertically to
+     * the height of the largest item.</div></li>
+     */
+    align: 'top', // top, middle, stretch, strechmax
+
+    type : 'hbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>left</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-width</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>right</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>horizontally</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the HBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availHeight  = Math.max(0, height - paddingVert),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexWidth = 0,
+            maxHeight    = 0,
+            totalFlex    = 0,
+            desiredWidth = 0,
+            minimumWidth = 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedWidth, 
+            horizMargins, vertMargins, stretchHeight;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child       = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static width (numeric) requires no calcs
+            if (typeof childWidth != 'number') {
+
+                // flex and not 'auto' width
+                if (child.flex && !childWidth) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' width or undefined width
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childWidth && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize   = child.getSize();
+                    childWidth  = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+
+            childMargins = child.margins;
+            horizMargins = childMargins.left + childMargins.right;
+
+            nonFlexWidth += horizMargins + (childWidth || 0);
+            desiredWidth += horizMargins + (child.flex ? child.minWidth || 0 : childWidth);
+            minimumWidth += horizMargins + (child.minWidth || childWidth || 0);
+
+            // Max height for align - force layout of non-laid out subcontainers without a numeric height
+            if (typeof childHeight != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childHeight = child.getHeight();
+            }
+
+            maxHeight = Math.max(maxHeight, childHeight + childMargins.top + childMargins.bottom);
+
+            //cache the size of each child component. Don't set height or width to 0, keep undefined instead
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth  || undefined
+            });
+        }
+                
+        var shortfall = desiredWidth - width,
+            tooNarrow = minimumWidth > width;
+            
+        //the width available to the flexed items
+        var availableWidth = Math.max(0, width - nonFlexWidth - paddingHoriz);
+        
+        if (tooNarrow) {
+            for (i = 0; i < visibleCount; i++) {
+                boxes[i].width = visibleItems[i].minWidth || visibleItems[i].width || boxes[i].width;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minWidths = [];
+                
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the width of each non-flexed item.
+                 * Flexed items are immediately reduced to their minWidth and anything already at minWidth is ignored.
+                 * The remaining items are collected into the minWidths array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item     = visibleItems[index],
+                        minWidth = item.minWidth || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minWidth because they're flexible and should be the first to lose width
+                    if (item.flex) {
+                        boxes[index].width = minWidth;
+                    } else {
+                        minWidths.push({
+                            minWidth : minWidth,
+                            available: boxes[index].width - minWidth,
+                            index    : index
+                        });
+                    }
+                }
+                
+                //sort by descending amount of width remaining before minWidth is reached
+                minWidths.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+                
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual width available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their width and minWidth first, so that if reducing the width by the average
+                 * amount would make that item less than its minWidth, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minWidths.length; i < length; i++) {
+                    var itemIndex = minWidths[i].index;
+                    
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+                        
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldWidth  = box.width,
+                        minWidth  = item.minWidth,
+                        newWidth  = Math.max(minWidth, oldWidth - Math.ceil(shortfall / (length - i))),
+                        reduction = oldWidth - newWidth;
+                    
+                    boxes[itemIndex].width = newWidth;
+                    shortfall -= reduction;                    
+                }
+            } else {
+                //temporary variables used in the flex width calculations below
+                var remainingWidth = availableWidth,
+                    remainingFlex  = totalFlex;
+
+                //calculate the widths of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    vertMargins  = childMargins.top + childMargins.bottom;
+
+                    if (isStart && child.flex && !child.width) {
+                        flexedWidth     = Math.ceil((child.flex / remainingFlex) * remainingWidth);
+                        remainingWidth -= flexedWidth;
+                        remainingFlex  -= child.flex;
+
+                        calcs.width = flexedWidth;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+        
+        if (isCenter) {
+            leftOffset += availableWidth / 2;
+        } else if (isEnd) {
+            leftOffset += availableWidth;
+        }
+        
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+            
+            childMargins = child.margins;
+            leftOffset  += childMargins.left;
+            vertMargins  = childMargins.top + childMargins.bottom;
+            
+            calcs.left = leftOffset;
+            calcs.top  = topOffset + childMargins.top;
+
+            switch (this.align) {
+                case 'stretch':
+                    stretchHeight = availHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchHeight = maxHeight - vertMargins;
+                    calcs.height  = stretchHeight.constrain(child.minHeight || 0, child.maxHeight || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'middle':
+                    var diff = availHeight - calcs.height - vertMargins;
+                    if (diff > 0) {
+                        calcs.top = topOffset + vertMargins + (diff / 2);
+                    }
+            }
+            
+            leftOffset += calcs.width + childMargins.right;
+        }
+
+        return {
+            boxes: boxes,
+            meta : {
+                maxHeight   : maxHeight,
+                nonFlexWidth: nonFlexWidth,
+                desiredWidth: desiredWidth,
+                minimumWidth: minimumWidth,
+                shortfall   : desiredWidth - width,
+                tooNarrow   : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.hbox = Ext.layout.HBoxLayout;/**
+ * @class Ext.layout.VBoxLayout
+ * @extends Ext.layout.BoxLayout
+ * <p>A layout that arranges items vertically down a Container. This layout optionally divides available vertical
+ * space between child items containing a numeric <code>flex</code> configuration.</p>
+ * This layout may also be used to set the widths of child items by configuring it with the {@link #align} option.
+ */
+Ext.layout.VBoxLayout = Ext.extend(Ext.layout.BoxLayout, {
+    /**
+     * @cfg {String} align
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this
+     * property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>left</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned horizontally
+     * at the <b>left</b> side of the container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are aligned horizontally at the
+     * <b>mid-width</b> of the container</div></li>
+     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched horizontally to fill
+     * the width of the container</div></li>
+     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched horizontally to
+     * the size of the largest item.</div></li>
+     * </ul></div>
+     */
+    align : 'left', // left, center, stretch, strechmax
+    type: 'vbox',
+
+    /**
+     * @cfg {String} pack
+     * Controls how the child items of the container are packed together. Acceptable configuration values
+     * for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>start</tt></b> : <b>Default</b><div class="sub-desc">child items are packed together at
+     * <b>top</b> side of container</div></li>
+     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are packed together at
+     * <b>mid-height</b> of container</div></li>
+     * <li><b><tt>end</tt></b> : <div class="sub-desc">child items are packed together at <b>bottom</b>
+     * side of container</div></li>
+     * </ul></div>
+     */
+
+    /**
+     * @cfg {Number} flex
+     * This configuation option is to be applied to <b>child <tt>items</tt></b> of the container managed
+     * by this layout. Each child item with a <tt>flex</tt> property will be flexed <b>vertically</b>
+     * according to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with
+     * a <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or
+     * <tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).
+     */
+
+    /**
+     * @private
+     * Calculates the size and positioning of each item in the VBox. This iterates over all of the rendered,
+     * visible items and returns a height, width, top and left for each, as well as a reference to each. Also
+     * returns meta data such as maxHeight which are useful when resizing layout wrappers such as this.innerCt.
+     * @param {Array} visibleItems The array of all rendered, visible items to be calculated for
+     * @param {Object} targetSize Object containing target size and height
+     * @return {Object} Object containing box measurements for each child, plus meta data
+     */
+    calculateChildBoxes: function(visibleItems, targetSize) {
+        var visibleCount = visibleItems.length,
+
+            padding      = this.padding,
+            topOffset    = padding.top,
+            leftOffset   = padding.left,
+            paddingVert  = topOffset  + padding.bottom,
+            paddingHoriz = leftOffset + padding.right,
+
+            width        = targetSize.width - this.scrollOffset,
+            height       = targetSize.height,
+            availWidth   = Math.max(0, width - paddingHoriz),
+
+            isStart      = this.pack == 'start',
+            isCenter     = this.pack == 'center',
+            isEnd        = this.pack == 'end',
+
+            nonFlexHeight= 0,
+            maxWidth     = 0,
+            totalFlex    = 0,
+            desiredHeight= 0,
+            minimumHeight= 0,
+
+            //used to cache the calculated size and position values for each child item
+            boxes        = [],
+            
+            //used in the for loops below, just declared here for brevity
+            child, childWidth, childHeight, childSize, childMargins, canLayout, i, calcs, flexedHeight, 
+            horizMargins, vertMargins, stretchWidth, length;
+
+        //gather the total flex of all flexed items and the width taken up by fixed width items
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            childHeight = child.height;
+            childWidth  = child.width;
+            canLayout   = !child.hasLayout && typeof child.doLayout == 'function';
+
+            // Static height (numeric) requires no calcs
+            if (typeof childHeight != 'number') {
+
+                // flex and not 'auto' height
+                if (child.flex && !childHeight) {
+                    totalFlex += child.flex;
+
+                // Not flexed or 'auto' height or undefined height
+                } else {
+                    //Render and layout sub-containers without a flex or width defined, as otherwise we
+                    //don't know how wide the sub-container should be and cannot calculate flexed widths
+                    if (!childHeight && canLayout) {
+                        child.doLayout();
+                    }
+
+                    childSize = child.getSize();
+                    childWidth = childSize.width;
+                    childHeight = childSize.height;
+                }
+            }
+            
+            childMargins = child.margins;
+            vertMargins  = childMargins.top + childMargins.bottom;
+
+            nonFlexHeight += vertMargins + (childHeight || 0);
+            desiredHeight += vertMargins + (child.flex ? child.minHeight || 0 : childHeight);
+            minimumHeight += vertMargins + (child.minHeight || childHeight || 0);
+
+            // Max width for align - force layout of non-layed out subcontainers without a numeric width
+            if (typeof childWidth != 'number') {
+                if (canLayout) {
+                    child.doLayout();
+                }
+                childWidth = child.getWidth();
+            }
+
+            maxWidth = Math.max(maxWidth, childWidth + childMargins.left + childMargins.right);
+
+            //cache the size of each child component
+            boxes.push({
+                component: child,
+                height   : childHeight || undefined,
+                width    : childWidth || undefined
+            });
+        }
+                
+        var shortfall = desiredHeight - height,
+            tooNarrow = minimumHeight > height;
+
+        //the height available to the flexed items
+        var availableHeight = Math.max(0, (height - nonFlexHeight - paddingVert));
+        
+        if (tooNarrow) {
+            for (i = 0, length = visibleCount; i < length; i++) {
+                boxes[i].height = visibleItems[i].minHeight || visibleItems[i].height || boxes[i].height;
+            }
+        } else {
+            //all flexed items should be sized to their minimum width, other items should be shrunk down until
+            //the shortfall has been accounted for
+            if (shortfall > 0) {
+                var minHeights = [];
+
+                /**
+                 * When we have a shortfall but are not tooNarrow, we need to shrink the height of each non-flexed item.
+                 * Flexed items are immediately reduced to their minHeight and anything already at minHeight is ignored.
+                 * The remaining items are collected into the minHeights array, which is later used to distribute the shortfall.
+                 */
+                for (var index = 0, length = visibleCount; index < length; index++) {
+                    var item      = visibleItems[index],
+                        minHeight = item.minHeight || 0;
+
+                    //shrink each non-flex tab by an equal amount to make them all fit. Flexed items are all
+                    //shrunk to their minHeight because they're flexible and should be the first to lose height
+                    if (item.flex) {
+                        boxes[index].height = minHeight;
+                    } else {
+                        minHeights.push({
+                            minHeight: minHeight, 
+                            available: boxes[index].height - minHeight,
+                            index    : index
+                        });
+                    }
+                }
+
+                //sort by descending minHeight value
+                minHeights.sort(function(a, b) {
+                    return a.available > b.available ? 1 : -1;
+                });
+
+                /*
+                 * Distribute the shortfall (difference between total desired with of all items and actual height available)
+                 * between the non-flexed items. We try to distribute the shortfall evenly, but apply it to items with the
+                 * smallest difference between their height and minHeight first, so that if reducing the height by the average
+                 * amount would make that item less than its minHeight, we carry the remainder over to the next item.
+                 */
+                for (var i = 0, length = minHeights.length; i < length; i++) {
+                    var itemIndex = minHeights[i].index;
+
+                    if (itemIndex == undefined) {
+                        continue;
+                    }
+
+                    var item      = visibleItems[itemIndex],
+                        box       = boxes[itemIndex],
+                        oldHeight  = box.height,
+                        minHeight  = item.minHeight,
+                        newHeight  = Math.max(minHeight, oldHeight - Math.ceil(shortfall / (length - i))),
+                        reduction = oldHeight - newHeight;
+
+                    boxes[itemIndex].height = newHeight;
+                    shortfall -= reduction;
+                }
+            } else {
+                //temporary variables used in the flex height calculations below
+                var remainingHeight = availableHeight,
+                    remainingFlex   = totalFlex;
+                
+                //calculate the height of each flexed item
+                for (i = 0; i < visibleCount; i++) {
+                    child = visibleItems[i];
+                    calcs = boxes[i];
+
+                    childMargins = child.margins;
+                    horizMargins = childMargins.left + childMargins.right;
+
+                    if (isStart && child.flex && !child.height) {
+                        flexedHeight     = Math.ceil((child.flex / remainingFlex) * remainingHeight);
+                        remainingHeight -= flexedHeight;
+                        remainingFlex   -= child.flex;
+
+                        calcs.height = flexedHeight;
+                        calcs.dirtySize = true;
+                    }
+                }
+            }
+        }
+
+        if (isCenter) {
+            topOffset += availableHeight / 2;
+        } else if (isEnd) {
+            topOffset += availableHeight;
+        }
+
+        //finally, calculate the left and top position of each item
+        for (i = 0; i < visibleCount; i++) {
+            child = visibleItems[i];
+            calcs = boxes[i];
+
+            childMargins = child.margins;
+            topOffset   += childMargins.top;
+            horizMargins = childMargins.left + childMargins.right;
+            
+
+            calcs.left = leftOffset + childMargins.left;
+            calcs.top  = topOffset;
+            
+            switch (this.align) {
+                case 'stretch':
+                    stretchWidth = availWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'stretchmax':
+                    stretchWidth = maxWidth - horizMargins;
+                    calcs.width  = stretchWidth.constrain(child.minWidth || 0, child.maxWidth || 1000000);
+                    calcs.dirtySize = true;
+                    break;
+                case 'center':
+                    var diff = availWidth - calcs.width - horizMargins;
+                    if (diff > 0) {
+                        calcs.left = leftOffset + horizMargins + (diff / 2);
+                    }
+            }
+
+            topOffset += calcs.height + childMargins.bottom;
+        }
+        
+        return {
+            boxes: boxes,
+            meta : {
+                maxWidth     : maxWidth,
+                nonFlexHeight: nonFlexHeight,
+                desiredHeight: desiredHeight,
+                minimumHeight: minimumHeight,
+                shortfall    : desiredHeight - height,
+                tooNarrow    : tooNarrow
+            }
+        };
+    }
+});
+
+Ext.Container.LAYOUTS.vbox = Ext.layout.VBoxLayout;
+/**
+ * @class Ext.layout.ToolbarLayout
+ * @extends Ext.layout.ContainerLayout
+ * Layout manager used by Ext.Toolbar. This is highly specialised for use by Toolbars and would not
+ * usually be used by any other class.
+ */
+Ext.layout.ToolbarLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'toolbar',
+
+    /**
+     * @property triggerWidth
+     * @type Number
+     * The width allocated for the menu trigger at the extreme right end of the Toolbar
+     */
+    triggerWidth: 18,
+
+    /**
+     * @property noItemsMenuText
+     * @type String
+     * HTML fragment to render into the toolbar overflow menu if there are no items to display
+     */
+    noItemsMenuText : '<div class="x-toolbar-no-items">(None)</div>',
+
+    /**
+     * @private
+     * @property lastOverflow
+     * @type Boolean
+     * Used internally to record whether the last layout caused an overflow or not
+     */
+    lastOverflow: false,
+
+    /**
+     * @private
+     * @property tableHTML
+     * @type String
+     * String used to build the HTML injected to support the Toolbar's layout. The align property is
+     * injected into this string inside the td.x-toolbar-left element during onLayout.
+     */
+    tableHTML: [
+        '<table cellspacing="0" class="x-toolbar-ct">',
+            '<tbody>',
+                '<tr>',
+                    '<td class="x-toolbar-left" align="{0}">',
+                        '<table cellspacing="0">',
+                            '<tbody>',
+                                '<tr class="x-toolbar-left-row"></tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                    '<td class="x-toolbar-right" align="right">',
+                        '<table cellspacing="0" class="x-toolbar-right-ct">',
+                            '<tbody>',
+                                '<tr>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-right-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                    '<td>',
+                                        '<table cellspacing="0">',
+                                            '<tbody>',
+                                                '<tr class="x-toolbar-extras-row"></tr>',
+                                            '</tbody>',
+                                        '</table>',
+                                    '</td>',
+                                '</tr>',
+                            '</tbody>',
+                        '</table>',
+                    '</td>',
+                '</tr>',
+            '</tbody>',
+        '</table>'
+    ].join(""),
+
+    /**
+     * @private
+     * Create the wrapping Toolbar HTML and render/move all the items into the correct places
+     */
+    onLayout : function(ct, target) {
+        //render the Toolbar <table> HTML if it's not already present
+        if (!this.leftTr) {
+            var align = ct.buttonAlign == 'center' ? 'center' : 'left';
+
+            target.addClass('x-toolbar-layout-ct');
+            target.insertHtml('beforeEnd', String.format(this.tableHTML, align));
+
+            this.leftTr   = target.child('tr.x-toolbar-left-row', true);
+            this.rightTr  = target.child('tr.x-toolbar-right-row', true);
+            this.extrasTr = target.child('tr.x-toolbar-extras-row', true);
+
+            if (this.hiddenItem == undefined) {
+                /**
+                 * @property hiddenItems
+                 * @type Array
+                 * Holds all items that are currently hidden due to there not being enough space to render them
+                 * These items will appear on the expand menu.
+                 */
+                this.hiddenItems = [];
+            }
+        }
+
+        var side     = ct.buttonAlign == 'right' ? this.rightTr : this.leftTr,
+            items    = ct.items.items,
+            position = 0;
+
+        //render each item if not already rendered, place it into the correct (left or right) target
+        for (var i = 0, len = items.length, c; i < len; i++, position++) {
+            c = items[i];
+
+            if (c.isFill) {
+                side   = this.rightTr;
+                position = -1;
+            } else if (!c.rendered) {
+                c.render(this.insertCell(c, side, position));
+                this.configureItem(c);
+            } else {
+                if (!c.xtbHidden && !this.isValidParent(c, side.childNodes[position])) {
+                    var td = this.insertCell(c, side, position);
+                    td.appendChild(c.getPositionEl().dom);
+                    c.container = Ext.get(td);
+                }
+            }
+        }
+
+        //strip extra empty cells
+        this.cleanup(this.leftTr);
+        this.cleanup(this.rightTr);
+        this.cleanup(this.extrasTr);
+        this.fitToSize(target);
+    },
+
+    /**
+     * @private
+     * Removes any empty nodes from the given element
+     * @param {Ext.Element} el The element to clean up
+     */
+    cleanup : function(el) {
+        var cn = el.childNodes, i, c;
+
+        for (i = cn.length-1; i >= 0 && (c = cn[i]); i--) {
+            if (!c.firstChild) {
+                el.removeChild(c);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Inserts the given Toolbar item into the given element
+     * @param {Ext.Component} c The component to add
+     * @param {Ext.Element} target The target to add the component to
+     * @param {Number} position The position to add the component at
+     */
+    insertCell : function(c, target, position) {
+        var td = document.createElement('td');
+        td.className = 'x-toolbar-cell';
+
+        target.insertBefore(td, target.childNodes[position] || null);
+
+        return td;
+    },
+
+    /**
+     * @private
+     * Hides an item because it will not fit in the available width. The item will be unhidden again
+     * if the Toolbar is resized to be large enough to show it
+     * @param {Ext.Component} item The item to hide
+     */
+    hideItem : function(item) {
+        this.hiddenItems.push(item);
+
+        item.xtbHidden = true;
+        item.xtbWidth = item.getPositionEl().dom.parentNode.offsetWidth;
+        item.hide();
+    },
+
+    /**
+     * @private
+     * Unhides an item that was previously hidden due to there not being enough space left on the Toolbar
+     * @param {Ext.Component} item The item to show
+     */
+    unhideItem : function(item) {
+        item.show();
+        item.xtbHidden = false;
+        this.hiddenItems.remove(item);
+    },
+
+    /**
+     * @private
+     * Returns the width of the given toolbar item. If the item is currently hidden because there
+     * is not enough room to render it, its previous width is returned
+     * @param {Ext.Component} c The component to measure
+     * @return {Number} The width of the item
+     */
+    getItemWidth : function(c) {
+        return c.hidden ? (c.xtbWidth || 0) : c.getPositionEl().dom.parentNode.offsetWidth;
+    },
+
+    /**
+     * @private
+     * Called at the end of onLayout. At this point the Toolbar has already been resized, so we need
+     * to fit the items into the available width. We add up the width required by all of the items in
+     * the toolbar - if we don't have enough space we hide the extra items and render the expand menu
+     * trigger.
+     * @param {Ext.Element} target The Element the Toolbar is currently laid out within
+     */
+    fitToSize : function(target) {
+        if (this.container.enableOverflow === false) {
+            return;
+        }
+
+        var width       = target.dom.clientWidth,
+            tableWidth  = target.dom.firstChild.offsetWidth,
+            clipWidth   = width - this.triggerWidth,
+            lastWidth   = this.lastWidth || 0,
+
+            hiddenItems = this.hiddenItems,
+            hasHiddens  = hiddenItems.length != 0,
+            isLarger    = width >= lastWidth;
+
+        this.lastWidth  = width;
+
+        if (tableWidth > width || (hasHiddens && isLarger)) {
+            var items     = this.container.items.items,
+                len       = items.length,
+                loopWidth = 0,
+                item;
+
+            for (var i = 0; i < len; i++) {
+                item = items[i];
+
+                if (!item.isFill) {
+                    loopWidth += this.getItemWidth(item);
+                    if (loopWidth > clipWidth) {
+                        if (!(item.hidden || item.xtbHidden)) {
+                            this.hideItem(item);
+                        }
+                    } else if (item.xtbHidden) {
+                        this.unhideItem(item);
+                    }
+                }
+            }
+        }
+
+        //test for number of hidden items again here because they may have changed above
+        hasHiddens = hiddenItems.length != 0;
+
+        if (hasHiddens) {
+            this.initMore();
+
+            if (!this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, true);
+                this.lastOverflow = true;
+            }
+        } else if (this.more) {
+            this.clearMenu();
+            this.more.destroy();
+            delete this.more;
+
+            if (this.lastOverflow) {
+                this.container.fireEvent('overflowchange', this.container, false);
+                this.lastOverflow = false;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Returns a menu config for a given component. This config is used to create a menu item
+     * to be added to the expander menu
+     * @param {Ext.Component} component The component to create the config for
+     * @param {Boolean} hideOnClick Passed through to the menu item
+     */
+    createMenuConfig : function(component, hideOnClick){
+        var config = Ext.apply({}, component.initialConfig),
+            group  = component.toggleGroup;
+
+        Ext.copyTo(config, component, [
+            'iconCls', 'icon', 'itemId', 'disabled', 'handler', 'scope', 'menu'
+        ]);
+
+        Ext.apply(config, {
+            text       : component.overflowText || component.text,
+            hideOnClick: hideOnClick
+        });
+
+        if (group || component.enableToggle) {
+            Ext.apply(config, {
+                group  : group,
+                checked: component.pressed,
+                listeners: {
+                    checkchange: function(item, checked){
+                        component.toggle(checked);
+                    }
+                }
+            });
+        }
+
+        delete config.ownerCt;
+        delete config.xtype;
+        delete config.id;
+
+        return config;
+    },
+
+    /**
+     * @private
+     * Adds the given Toolbar item to the given menu. Buttons inside a buttongroup are added individually.
+     * @param {Ext.menu.Menu} menu The menu to add to
+     * @param {Ext.Component} component The component to add
+     */
+    addComponentToMenu : function(menu, component) {
+        if (component instanceof Ext.Toolbar.Separator) {
+            menu.add('-');
+
+        } else if (Ext.isFunction(component.isXType)) {
+            if (component.isXType('splitbutton')) {
+                menu.add(this.createMenuConfig(component, true));
+
+            } else if (component.isXType('button')) {
+                menu.add(this.createMenuConfig(component, !component.menu));
+
+            } else if (component.isXType('buttongroup')) {
+                component.items.each(function(item){
+                     this.addComponentToMenu(menu, item);
+                }, this);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Deletes the sub-menu of each item in the expander menu. Submenus are created for items such as
+     * splitbuttons and buttongroups, where the Toolbar item cannot be represented by a single menu item
+     */
+    clearMenu : function(){
+        var menu = this.moreMenu;
+        if (menu && menu.items) {
+            menu.items.each(function(item){
+                delete item.menu;
+            });
+        }
+    },
+
+    /**
+     * @private
+     * Called before the expand menu is shown, this rebuilds the menu since it was last shown because
+     * it is possible that the items hidden due to space limitations on the Toolbar have changed since.
+     * @param {Ext.menu.Menu} m The menu
+     */
+    beforeMoreShow : function(menu) {
+        var items = this.container.items.items,
+            len   = items.length,
+            item,
+            prev;
+
+        var needsSep = function(group, item){
+            return group.isXType('buttongroup') && !(item instanceof Ext.Toolbar.Separator);
+        };
+
+        this.clearMenu();
+        menu.removeAll();
+        for (var i = 0; i < len; i++) {
+            item = items[i];
+            if (item.xtbHidden) {
+                if (prev && (needsSep(item, prev) || needsSep(prev, item))) {
+                    menu.add('-');
+                }
+                this.addComponentToMenu(menu, item);
+                prev = item;
+            }
+        }
+
+        // put something so the menu isn't empty if no compatible items found
+        if (menu.items.length < 1) {
+            menu.add(this.noItemsMenuText);
+        }
+    },
+
+    /**
+     * @private
+     * Creates the expand trigger and menu, adding them to the <tr> at the extreme right of the
+     * Toolbar table
+     */
+    initMore : function(){
+        if (!this.more) {
+            /**
+             * @private
+             * @property moreMenu
+             * @type Ext.menu.Menu
+             * The expand menu - holds items for every Toolbar item that cannot be shown
+             * because the Toolbar is currently not wide enough.
+             */
+            this.moreMenu = new Ext.menu.Menu({
+                ownerCt : this.container,
+                listeners: {
+                    beforeshow: this.beforeMoreShow,
+                    scope: this
+                }
+            });
+
+            /**
+             * @private
+             * @property more
+             * @type Ext.Button
+             * The expand button which triggers the overflow menu to be shown
+             */
+            this.more = new Ext.Button({
+                iconCls: 'x-toolbar-more-icon',
+                cls    : 'x-toolbar-more',
+                menu   : this.moreMenu,
+                ownerCt: this.container
+            });
+
+            var td = this.insertCell(this.more, this.extrasTr, 100);
+            this.more.render(td);
+        }
+    },
+
+    destroy : function(){
+        Ext.destroy(this.more, this.moreMenu);
+        delete this.leftTr;
+        delete this.rightTr;
+        delete this.extrasTr;
+        Ext.layout.ToolbarLayout.superclass.destroy.call(this);
+    }
+});
+
+Ext.Container.LAYOUTS.toolbar = Ext.layout.ToolbarLayout;
+/**
+ * @class Ext.layout.MenuLayout
+ * @extends Ext.layout.ContainerLayout
+ * <p>Layout manager used by {@link Ext.menu.Menu}. Generally this class should not need to be used directly.</p>
+ */
+ Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, {
+    monitorResize : true,
+
+    type: 'menu',
+
+    setContainer : function(ct){
+        this.monitorResize = !ct.floating;
+        // This event is only fired by the menu in IE, used so we don't couple
+        // the menu with the layout.
+        ct.on('autosize', this.doAutoSize, this);
+        Ext.layout.MenuLayout.superclass.setContainer.call(this, ct);
+    },
+
+    renderItem : function(c, position, target){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
+                '<li id="{itemId}" class="{itemCls}">',
+                    '<tpl if="needsIcon">',
+                        '<img alt="{altText}" src="{icon}" class="{iconCls}"/>',
+                    '</tpl>',
+                '</li>'
+            );
+        }
+
+        if(c && !c.rendered){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            var a = this.getItemArgs(c);
+
+//          The Component's positionEl is the <li> it is rendered into
+            c.render(c.positionEl = position ?
+                this.itemTpl.insertBefore(position, a, true) :
+                this.itemTpl.append(target, a, true));
+
+//          Link the containing <li> to the item.
+            c.positionEl.menuItemId = c.getItemId();
+
+//          If rendering a regular Component, and it needs an icon,
+//          move the Component rightwards.
+            if (!a.isMenuItem && a.needsIcon) {
+                c.positionEl.addClass('x-menu-list-item-indent');
+            }
+            this.configureItem(c);
+        }else if(c && !this.isValidParent(c, target)){
+            if(Ext.isNumber(position)){
+                position = target.dom.childNodes[position];
+            }
+            target.dom.insertBefore(c.getActionEl().dom, position || null);
+        }
+    },
+
+    getItemArgs : function(c) {
+        var isMenuItem = c instanceof Ext.menu.Item,
+            canHaveIcon = !(isMenuItem || c instanceof Ext.menu.Separator);
+
+        return {
+            isMenuItem: isMenuItem,
+            needsIcon: canHaveIcon && (c.icon || c.iconCls),
+            icon: c.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: 'x-menu-item-icon ' + (c.iconCls || ''),
+            itemId: 'x-menu-el-' + c.id,
+            itemCls: 'x-menu-list-item ',
+            altText: c.altText || ''
+        };
+    },
+
+    //  Valid if the Component is in a <li> which is part of our target <ul>
+    isValidParent : function(c, target) {
+        return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target);
+    },
+
+    onLayout : function(ct, target){
+        Ext.layout.MenuLayout.superclass.onLayout.call(this, ct, target);
+        this.doAutoSize();
+    },
+
+    doAutoSize : function(){
+        var ct = this.container, w = ct.width;
+        if(ct.floating){
+            if(w){
+                ct.setWidth(w);
+            }else if(Ext.isIE){
+                ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8 || Ext.isIE9) ? 'auto' : ct.minWidth);
+                var el = ct.getEl(), t = el.dom.offsetWidth; // force recalc
+                ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr'));
+            }
+        }
+    }
+});
+Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout;
+/**
+ * @class Ext.Viewport
+ * @extends Ext.Container
+ * <p>A specialized container representing the viewable application area (the browser viewport).</p>
+ * <p>The Viewport renders itself to the document body, and automatically sizes itself to the size of
+ * the browser viewport and manages window resizing. There may only be one Viewport created
+ * in a page. Inner layouts are available by virtue of the fact that all {@link Ext.Panel Panel}s
+ * added to the Viewport, either through its {@link #items}, or through the items, or the {@link #add}
+ * method of any of its child Panels may themselves have a layout.</p>
+ * <p>The Viewport does not provide scrolling, so child Panels within the Viewport should provide
+ * for scrolling if needed using the {@link #autoScroll} config.</p>
+ * <p>An example showing a classic application border layout:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'north',
+        html: '&lt;h1 class="x-panel-header">Page Title&lt;/h1>',
+        autoHeight: true,
+        border: false,
+        margins: '0 0 5 0'
+    }, {
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        width: 200
+        // the west region might typically utilize a {@link Ext.tree.TreePanel TreePanel} or a Panel with {@link Ext.layout.AccordionLayout Accordion layout}
+    }, {
+        region: 'south',
+        title: 'Title for Panel',
+        collapsible: true,
+        html: 'Information goes here',
+        split: true,
+        height: 100,
+        minHeight: 100
+    }, {
+        region: 'east',
+        title: 'Title for the Grid Panel',
+        collapsible: true,
+        split: true,
+        width: 200,
+        xtype: 'grid',
+        // remaining grid configuration not shown ...
+        // notice that the GridPanel is added directly as the region
+        // it is not "overnested" inside another Panel
+    }, {
+        region: 'center',
+        xtype: 'tabpanel', // TabPanel itself has no title
+        items: {
+            title: 'Default Tab',
+            html: 'The first tab\'s content. Others may be added dynamically'
+        }
+    }]
+});
+</code></pre>
+ * @constructor
+ * Create a new Viewport
+ * @param {Object} config The config object
+ * @xtype viewport
+ */
+Ext.Viewport = Ext.extend(Ext.Container, {
+    /*
+     * Privatize config options which, if used, would interfere with the
+     * correct operation of the Viewport as the sole manager of the
+     * layout of the document body.
+     */
+    /**
+     * @cfg {Mixed} applyTo @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Mixed} renderTo @hide
+     */
+    /**
+     * @cfg {Boolean} hideParent @hide
+     */
+    /**
+     * @cfg {Number} height @hide
+     */
+    /**
+     * @cfg {Number} width @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} deferHeight @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize @hide
+     */
+
+    initComponent : function() {
+        Ext.Viewport.superclass.initComponent.call(this);
+        document.getElementsByTagName('html')[0].className += ' x-viewport';
+        this.el = Ext.getBody();
+        this.el.setHeight = Ext.emptyFn;
+        this.el.setWidth = Ext.emptyFn;
+        this.el.setSize = Ext.emptyFn;
+        this.el.dom.scroll = 'no';
+        this.allowDomMove = false;
+        this.autoWidth = true;
+        this.autoHeight = true;
+        Ext.EventManager.onWindowResize(this.fireResize, this);
+        this.renderTo = this.el;
+    },
+
+    fireResize : function(w, h){
+        this.fireEvent('resize', this, w, h, w, h);
+    }
+});
+Ext.reg('viewport', Ext.Viewport);
+/**
+ * @class Ext.Panel
+ * @extends Ext.Container
+ * <p>Panel is a container that has specific functionality and structural components that make
+ * it the perfect building block for application-oriented user interfaces.</p>
+ * <p>Panels are, by virtue of their inheritance from {@link Ext.Container}, capable
+ * of being configured with a {@link Ext.Container#layout layout}, and containing child Components.</p>
+ * <p>When either specifying child {@link Ext.Component#items items} of a Panel, or dynamically {@link Ext.Container#add adding} Components
+ * to a Panel, remember to consider how you wish the Panel to arrange those child elements, and whether
+ * those child elements need to be sized using one of Ext's built-in <code><b>{@link Ext.Container#layout layout}</b></code> schemes. By
+ * default, Panels use the {@link Ext.layout.ContainerLayout ContainerLayout} scheme. This simply renders
+ * child components, appending them one after the other inside the Container, and <b>does not apply any sizing</b>
+ * at all.</p>
+ * <p>A Panel may also contain {@link #bbar bottom} and {@link #tbar top} toolbars, along with separate
+ * {@link #header}, {@link #footer} and {@link #body} sections (see {@link #frame} for additional
+ * information).</p>
+ * <p>Panel also provides built-in {@link #collapsible expandable and collapsible behavior}, along with
+ * a variety of {@link #tools prebuilt tool buttons} that can be wired up to provide other customized
+ * behavior.  Panels can be easily dropped into any {@link Ext.Container Container} or layout, and the
+ * layout and rendering pipeline is {@link Ext.Container#add completely managed by the framework}.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype panel
+ */
+Ext.Panel = Ext.extend(Ext.Container, {
+    /**
+     * The Panel's header {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the {@link #title} and {@link #tools}</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property header
+     */
+    /**
+     * The Panel's body {@link Ext.Element Element} which may be used to contain HTML content.
+     * The content may be specified in the {@link #html} config, or it may be loaded using the
+     * {@link autoLoad} config, or through the Panel's {@link #getUpdater Updater}. Read-only.
+     * <p>If this is used to load visible HTML elements in either way, then
+     * the Panel may not be used as a Layout for hosting nested Panels.</p>
+     * <p>If this Panel is intended to be used as the host of a Layout (See {@link #layout}
+     * then the body Element must not be loaded or changed - it is under the control
+     * of the Panel's Layout.
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property body
+     */
+    /**
+     * The Panel's bwrap {@link Ext.Element Element} used to contain other Panel elements
+     * (tbar, body, bbar, footer). See {@link #bodyCfg}. Read-only.
+     * @type Ext.Element
+     * @property bwrap
+     */
+    /**
+     * True if this panel is collapsed. Read-only.
+     * @type Boolean
+     * @property collapsed
+     */
+    /**
+     * @cfg {Object} bodyCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object may be specified for any
+     * Panel Element.</p>
+     * <p>By default, the Default element in the table below will be used for the html markup to
+     * create a child element with the commensurate Default class name (<code>baseCls</code> will be
+     * replaced by <code>{@link #baseCls}</code>):</p>
+     * <pre>
+     * Panel      Default  Default             Custom      Additional       Additional
+     * Element    element  class               element     class            style
+     * ========   ==========================   =========   ==============   ===========
+     * {@link #header}     div      {@link #baseCls}+'-header'   {@link #headerCfg}   headerCssClass   headerStyle
+     * {@link #bwrap}      div      {@link #baseCls}+'-bwrap'     {@link #bwrapCfg}    bwrapCssClass    bwrapStyle
+     * + tbar     div      {@link #baseCls}+'-tbar'       {@link #tbarCfg}     tbarCssClass     tbarStyle
+     * + {@link #body}     div      {@link #baseCls}+'-body'       {@link #bodyCfg}     {@link #bodyCssClass}     {@link #bodyStyle}
+     * + bbar     div      {@link #baseCls}+'-bbar'       {@link #bbarCfg}     bbarCssClass     bbarStyle
+     * + {@link #footer}   div      {@link #baseCls}+'-footer'   {@link #footerCfg}   footerCssClass   footerStyle
+     * </pre>
+     * <p>Configuring a Custom element may be used, for example, to force the {@link #body} Element
+     * to use a different form of markup than is created by default. An example of this might be
+     * to {@link Ext.Element#createChild create a child} Panel containing a custom content, such as
+     * a header, or forcing centering of all Panel content by having the body be a &lt;center&gt;
+     * element:</p>
+     * <pre><code>
+new Ext.Panel({
+    title: 'Message Title',
+    renderTo: Ext.getBody(),
+    width: 200, height: 130,
+    <b>bodyCfg</b>: {
+        tag: 'center',
+        cls: 'x-panel-body',  // Default class not applied if Custom element specified
+        html: 'Message'
+    },
+    footerCfg: {
+        tag: 'h2',
+        cls: 'x-panel-footer',        // same as the Default class
+        html: 'footer html'
+    },
+    footerCssClass: 'custom-footer', // additional css class, see {@link Ext.element#addClass addClass}
+    footerStyle:    'background-color:red' // see {@link #bodyStyle}
+});
+     * </code></pre>
+     * <p>The example above also explicitly creates a <code>{@link #footer}</code> with custom markup and
+     * styling applied.</p>
+     */
+    /**
+     * @cfg {Object} headerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #header} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bwrapCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bwrap} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} tbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #tbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} bbarCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #bbar} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Object} footerCfg
+     * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
+     * of this Panel's {@link #footer} Element.  See <code>{@link #bodyCfg}</code> also.</p>
+     */
+    /**
+     * @cfg {Boolean} closable
+     * Panels themselves do not directly support being closed, but some Panel subclasses do (like
+     * {@link Ext.Window}) or a Panel Class within an {@link Ext.TabPanel}.  Specify <code>true</code>
+     * to enable closing in such situations. Defaults to <code>false</code>.
+     */
+    /**
+     * The Panel's footer {@link Ext.Element Element}. Read-only.
+     * <p>This Element is used to house the Panel's <code>{@link #buttons}</code> or <code>{@link #fbar}</code>.</p>
+     * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
+     * @type Ext.Element
+     * @property footer
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * <p>The id of the node, a DOM node or an existing Element corresponding to a DIV that is already present in
+     * the document that specifies some panel-specific structural markup.  When <code>applyTo</code> is used,
+     * constituent parts of the panel can be specified by CSS class name within the main element, and the panel
+     * will automatically create those components from that markup. Any required components not specified in the
+     * markup will be autogenerated if necessary.</p>
+     * <p>The following class names are supported (baseCls will be replaced by {@link #baseCls}):</p>
+     * <ul><li>baseCls + '-header'</li>
+     * <li>baseCls + '-header-text'</li>
+     * <li>baseCls + '-bwrap'</li>
+     * <li>baseCls + '-tbar'</li>
+     * <li>baseCls + '-body'</li>
+     * <li>baseCls + '-bbar'</li>
+     * <li>baseCls + '-footer'</li></ul>
+     * <p>Using this config, a call to render() is not required.  If applyTo is specified, any value passed for
+     * {@link #renderTo} will be ignored and the target element's parent node will automatically be used as the
+     * panel's container.</p>
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * <p>The top toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the top toolbar after render, use {@link #getTopToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Object/Array} bbar
+     * <p>The bottom toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
+     * buttons/button configs to be added to the toolbar.  Note that this is not available as a property after render.
+     * To access the bottom toolbar after render, use {@link #getBottomToolbar}.</p>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /** @cfg {Object/Array} fbar
+     * <p>A {@link Ext.Toolbar Toolbar} object, a Toolbar config, or an array of
+     * {@link Ext.Button Button}s/{@link Ext.Button Button} configs, describing a {@link Ext.Toolbar Toolbar} to be rendered into this Panel's footer element.</p>
+     * <p>After render, the <code>fbar</code> property will be an {@link Ext.Toolbar Toolbar} instance.</p>
+     * <p>If <code>{@link #buttons}</code> are specified, they will supersede the <code>fbar</code> configuration property.</p>
+     * The Panel's <code>{@link #buttonAlign}</code> configuration affects the layout of these items, for example:
+     * <pre><code>
+var w = new Ext.Window({
+    height: 250,
+    width: 500,
+    bbar: new Ext.Toolbar({
+        items: [{
+            text: 'bbar Left'
+        },'->',{
+            text: 'bbar Right'
+        }]
+    }),
+    {@link #buttonAlign}: 'left', // anything but 'center' or 'right' and you can use '-', and '->'
+                                  // to control the alignment of fbar items
+    fbar: [{
+        text: 'fbar Left'
+    },'->',{
+        text: 'fbar Right'
+    }]
+}).show();
+     * </code></pre>
+     * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
+     * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
+     * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
+     * submission parameters are collected from the DOM tree.</p>
+     */
+    /**
+     * @cfg {Boolean} header
+     * <code>true</code> to create the Panel's header element explicitly, <code>false</code> to skip creating
+     * it.  If a <code>{@link #title}</code> is set the header will be created automatically, otherwise it will not.
+     * If a <code>{@link #title}</code> is set but <code>header</code> is explicitly set to <code>false</code>, the header
+     * will not be rendered.
+     */
+    /**
+     * @cfg {Boolean} footer
+     * <code>true</code> to create the footer element explicitly, false to skip creating it. The footer
+     * will be created automatically if <code>{@link #buttons}</code> or a <code>{@link #fbar}</code> have
+     * been configured.  See <code>{@link #bodyCfg}</code> for an example.
+     */
+    /**
+     * @cfg {String} title
+     * The title text to be used as innerHTML (html tags are accepted) to display in the panel
+     * <code>{@link #header}</code> (defaults to ''). When a <code>title</code> is specified the
+     * <code>{@link #header}</code> element will automatically be created and displayed unless
+     * {@link #header} is explicitly set to <code>false</code>.  If you do not want to specify a
+     * <code>title</code> at config time, but you may want one later, you must either specify a non-empty
+     * <code>title</code> (a blank space ' ' will do) or <code>header:true</code> so that the container
+     * element will get created.
+     */
+    /**
+     * @cfg {Array} buttons
+     * <code>buttons</code> will be used as <code>{@link Ext.Container#items items}</code> for the toolbar in
+     * the footer (<code>{@link #fbar}</code>). Typically the value of this configuration property will be
+     * an array of {@link Ext.Button}s or {@link Ext.Button} configuration objects.
+     * If an item is configured with <code>minWidth</code> or the Panel is configured with <code>minButtonWidth</code>,
+     * that width will be applied to the item.
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * A valid url spec according to the Updater {@link Ext.Updater#update} method.
+     * If autoLoad is not null, the panel will attempt to load its contents
+     * immediately upon render.<p>
+     * The URL will become the default URL for this panel's {@link #body} element,
+     * so it may be {@link Ext.Element#refresh refresh}ed at any time.</p>
+     */
+    /**
+     * @cfg {Boolean} frame
+     * <code>false</code> by default to render with plain 1px square borders. <code>true</code> to render with
+     * 9 elements, complete with custom rounded corners (also see {@link Ext.Element#boxWrap}).
+     * <p>The template generated for each condition is depicted below:</p><pre><code>
+     *
+// frame = false
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+
+    &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:false)&lt;/span>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+    &lt;/div>
+&lt;/div>
+
+// frame = true (create 9 elements)
+&lt;div id="developer-specified-id-goes-here" class="x-panel">
+    &lt;div class="x-panel-tl">&lt;div class="x-panel-tr">&lt;div class="x-panel-tc">
+        &lt;div class="x-panel-header">&lt;span class="x-panel-header-text">Title: (frame:true)&lt;/span>&lt;/div>
+    &lt;/div>&lt;/div>&lt;/div>
+
+    &lt;div class="x-panel-bwrap">
+        &lt;div class="x-panel-ml">&lt;div class="x-panel-mr">&lt;div class="x-panel-mc">
+            &lt;div class="x-panel-body">&lt;p>html value goes here&lt;/p>&lt;/div>
+        &lt;/div>&lt;/div>&lt;/div>
+
+        &lt;div class="x-panel-bl">&lt;div class="x-panel-br">&lt;div class="x-panel-bc"/>
+        &lt;/div>&lt;/div>&lt;/div>
+&lt;/div>
+     * </code></pre>
+     */
+    /**
+     * @cfg {Boolean} border
+     * True to display the borders of the panel's body element, false to hide them (defaults to true).  By default,
+     * the border is a 2px wide inset border, but this can be further altered by setting {@link #bodyBorder} to false.
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * True to display an interior border on the body element of the panel, false to hide it (defaults to true).
+     * This only applies when {@link #border} == true.  If border == true and bodyBorder == false, the border will display
+     * as a 1px wide inset border, giving the entire body element an inset appearance.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyCssClass
+     * Additional css class selector to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#addClass} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String/Object/Function} bodyStyle
+     * Custom CSS styles to be applied to the {@link #body} element in the format expected by
+     * {@link Ext.Element#applyStyles} (defaults to null). See {@link #bodyCfg}.
+     */
+    /**
+     * @cfg {String} iconCls
+     * The CSS class selector that specifies a background image to be used as the header icon (defaults to '').
+     * <p>An example of specifying a custom icon class would be something like:
+     * </p><pre><code>
+// specify the property in the config for the class:
+     ...
+     iconCls: 'my-icon'
+
+// css class that specifies background image to be used as the icon image:
+.my-icon { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important; }
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * True to make the panel collapsible and have the expand/collapse toggle button automatically rendered into
+     * the header tool button area, false to keep the panel statically sized with no button (defaults to false).
+     */
+    /**
+     * @cfg {Array} tools
+     * An array of tool button configs to be added to the header tool area. When rendered, each tool is
+     * stored as an {@link Ext.Element Element} referenced by a public property called <code><b></b>tools.<i>&lt;tool-type&gt;</i></code>
+     * <p>Each tool config may contain the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc"><b>Required.</b> The type
+     * of tool to create. By default, this assigns a CSS class of the form <code>x-tool-<i>&lt;tool-type&gt;</i></code> to the
+     * resulting tool Element. Ext provides CSS rules, and an icon sprite containing images for the tool types listed below.
+     * The developer may implement custom tools by supplying alternate CSS rules and background images:
+     * <ul>
+     * <div class="x-tool x-tool-toggle" style="float:left; margin-right:5;"> </div><div><code> toggle</code> (Created by default when {@link #collapsible} is <code>true</code>)</div>
+     * <div class="x-tool x-tool-close" style="float:left; margin-right:5;"> </div><div><code> close</code></div>
+     * <div class="x-tool x-tool-minimize" style="float:left; margin-right:5;"> </div><div><code> minimize</code></div>
+     * <div class="x-tool x-tool-maximize" style="float:left; margin-right:5;"> </div><div><code> maximize</code></div>
+     * <div class="x-tool x-tool-restore" style="float:left; margin-right:5;"> </div><div><code> restore</code></div>
+     * <div class="x-tool x-tool-gear" style="float:left; margin-right:5;"> </div><div><code> gear</code></div>
+     * <div class="x-tool x-tool-pin" style="float:left; margin-right:5;"> </div><div><code> pin</code></div>
+     * <div class="x-tool x-tool-unpin" style="float:left; margin-right:5;"> </div><div><code> unpin</code></div>
+     * <div class="x-tool x-tool-right" style="float:left; margin-right:5;"> </div><div><code> right</code></div>
+     * <div class="x-tool x-tool-left" style="float:left; margin-right:5;"> </div><div><code> left</code></div>
+     * <div class="x-tool x-tool-up" style="float:left; margin-right:5;"> </div><div><code> up</code></div>
+     * <div class="x-tool x-tool-down" style="float:left; margin-right:5;"> </div><div><code> down</code></div>
+     * <div class="x-tool x-tool-refresh" style="float:left; margin-right:5;"> </div><div><code> refresh</code></div>
+     * <div class="x-tool x-tool-minus" style="float:left; margin-right:5;"> </div><div><code> minus</code></div>
+     * <div class="x-tool x-tool-plus" style="float:left; margin-right:5;"> </div><div><code> plus</code></div>
+     * <div class="x-tool x-tool-help" style="float:left; margin-right:5;"> </div><div><code> help</code></div>
+     * <div class="x-tool x-tool-search" style="float:left; margin-right:5;"> </div><div><code> search</code></div>
+     * <div class="x-tool x-tool-save" style="float:left; margin-right:5;"> </div><div><code> save</code></div>
+     * <div class="x-tool x-tool-print" style="float:left; margin-right:5;"> </div><div><code> print</code></div>
+     * </ul></div></li>
+     * <li><b>handler</b> : Function<div class="sub-desc"><b>Required.</b> The function to
+     * call when clicked. Arguments passed are:<ul>
+     * <li><b>event</b> : Ext.EventObject<div class="sub-desc">The click event.</div></li>
+     * <li><b>toolEl</b> : Ext.Element<div class="sub-desc">The tool Element.</div></li>
+     * <li><b>panel</b> : Ext.Panel<div class="sub-desc">The host Panel</div></li>
+     * <li><b>tc</b> : Object<div class="sub-desc">The tool configuration object</div></li>
+     * </ul></div></li>
+     * <li><b>stopEvent</b> : Boolean<div class="sub-desc">Defaults to true. Specify as false to allow click event to propagate.</div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the handler.</div></li>
+     * <li><b>qtip</b> : String/Object<div class="sub-desc">A tip string, or
+     * a config argument to {@link Ext.QuickTip#register}</div></li>
+     * <li><b>hidden</b> : Boolean<div class="sub-desc">True to initially render hidden.</div></li>
+     * <li><b>on</b> : Object<div class="sub-desc">A listener config object specifiying
+     * event listeners in the format of an argument to {@link #addListener}</div></li>
+     * </ul></div>
+     * <p>Note that, apart from the toggle tool which is provided when a panel is collapsible, these
+     * tools only provide the visual button. Any required functionality must be provided by adding
+     * handlers that implement the necessary behavior.</p>
+     * <p>Example usage:</p>
+     * <pre><code>
+tools:[{
+    id:'refresh',
+    qtip: 'Refresh form Data',
+    // hidden:true,
+    handler: function(event, toolEl, panel){
+        // refresh logic
+    }
+},
+{
+    id:'help',
+    qtip: 'Get Help',
+    handler: function(event, toolEl, panel){
+        // whatever
+    }
+}]
+</code></pre>
+     * <p>For the custom id of <code>'help'</code> define two relevant css classes with a link to
+     * a 15x15 image:</p>
+     * <pre><code>
+.x-tool-help {background-image: url(images/help.png);}
+.x-tool-help-over {background-image: url(images/help_over.png);}
+// if using an image sprite:
+.x-tool-help {background-image: url(images/help.png) no-repeat 0 0;}
+.x-tool-help-over {background-position:-15px 0;}
+</code></pre>
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * <p>A Template used to create {@link #tools} in the {@link #header} Element. Defaults to:</p><pre><code>
+new Ext.Template('&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>')</code></pre>
+     * <p>This may may be overridden to provide a custom DOM structure for tools based upon a more
+     * complex XTemplate. The template's data is a single tool configuration object (Not the entire Array)
+     * as specified in {@link #tools}.  In the following example an &lt;a> tag is used to provide a
+     * visual indication when hovering over the tool:</p><pre><code>
+var win = new Ext.Window({
+    tools: [{
+        id: 'download',
+        href: '/MyPdfDoc.pdf'
+    }],
+    toolTemplate: new Ext.XTemplate(
+        '&lt;tpl if="id==\'download\'">',
+            '&lt;a class="x-tool x-tool-pdf" href="{href}">&lt;/a>',
+        '&lt;/tpl>',
+        '&lt;tpl if="id!=\'download\'">',
+            '&lt;div class="x-tool x-tool-{id}">&amp;#160;&lt;/div>',
+        '&lt;/tpl>'
+    ),
+    width:500,
+    height:300,
+    closeAction:'hide'
+});</code></pre>
+     * <p>Note that the CSS class 'x-tool-pdf' should have an associated style rule which provides an
+     * appropriate background image, something like:</p>
+    <pre><code>
+    a.x-tool-pdf {background-image: url(../shared/extjs/images/pdf.gif)!important;}
+    </code></pre>
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * <code>true</code> to hide the expand/collapse toggle button when <code>{@link #collapsible} == true</code>,
+     * <code>false</code> to display it (defaults to <code>false</code>).
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * <code>true</code> to allow expanding and collapsing the panel (when <code>{@link #collapsible} = true</code>)
+     * by clicking anywhere in the header bar, <code>false</code>) to allow it only by clicking to tool button
+     * (defaults to <code>false</code>)). If this panel is a child item of a border layout also see the
+     * {@link Ext.layout.BorderLayout.Region BorderLayout.Region}
+     * <code>{@link Ext.layout.BorderLayout.Region#floatable floatable}</code> config option.
+     */
+
+    /**
+     * @cfg {Mixed} floating
+     * <p>This property is used to configure the underlying {@link Ext.Layer}. Acceptable values for this
+     * configuration property are:</p><div class="mdetail-params"><ul>
+     * <li><b><code>false</code></b> : <b>Default.</b><div class="sub-desc">Display the panel inline where it is
+     * rendered.</div></li>
+     * <li><b><code>true</code></b> : <div class="sub-desc">Float the panel (absolute position it with automatic
+     * shimming and shadow).<ul>
+     * <div class="sub-desc">Setting floating to true will create an Ext.Layer for this panel and display the
+     * panel at negative offsets so that it is hidden.</div>
+     * <div class="sub-desc">Since the panel will be absolute positioned, the position must be set explicitly
+     * <i>after</i> render (e.g., <code>myPanel.setPosition(100,100);</code>).</div>
+     * <div class="sub-desc"><b>Note</b>: when floating a panel you should always assign a fixed width,
+     * otherwise it will be auto width and will expand to fill to the right edge of the viewport.</div>
+     * </ul></div></li>
+     * <li><b><code>{@link Ext.Layer object}</code></b> : <div class="sub-desc">The specified object will be used
+     * as the configuration object for the {@link Ext.Layer} that will be created.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * <code>true</code> (or a valid Ext.Shadow {@link Ext.Shadow#mode} value) to display a shadow behind the
+     * panel, <code>false</code> to display no shadow (defaults to <code>'sides'</code>).  Note that this option
+     * only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * The number of pixels to offset the shadow if displayed (defaults to <code>4</code>). Note that this
+     * option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Boolean} shim
+     * <code>false</code> to disable the iframe shim in browsers which need one (defaults to <code>true</code>).
+     * Note that this option only applies when <code>{@link #floating} = true</code>.
+     */
+    /**
+     * @cfg {Object/Array} keys
+     * A {@link Ext.KeyMap} config object (in the format expected by {@link Ext.KeyMap#addBinding}
+     * used to assign custom key handling to this panel (defaults to <code>null</code>).
+     */
+    /**
+     * @cfg {Boolean/Object} draggable
+     * <p><code>true</code> to enable dragging of this Panel (defaults to <code>false</code>).</p>
+     * <p>For custom drag/drop implementations, an <b>Ext.Panel.DD</b> config could also be passed
+     * in this config instead of <code>true</code>. Ext.Panel.DD is an internal, undocumented class which
+     * moves a proxy Element around in place of the Panel's element, but provides no other behaviour
+     * during dragging or on drop. It is a subclass of {@link Ext.dd.DragSource}, so behaviour may be
+     * added by implementing the interface methods of {@link Ext.dd.DragDrop} e.g.:
+     * <pre><code>
+new Ext.Panel({
+    title: 'Drag me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    draggable: {
+//      Config option of Ext.Panel.DD class.
+//      It&#39;s a floating Panel, so do not show a placeholder proxy in the original position.
+        insertProxy: false,
+
+//      Called for each mousemove event while dragging the DD object.
+        onDrag : function(e){
+//          Record the x,y position of the drag proxy so that we can
+//          position the Panel at end of drag.
+            var pel = this.proxy.getEl();
+            this.x = pel.getLeft(true);
+            this.y = pel.getTop(true);
+
+//          Keep the Shadow aligned if there is one.
+            var s = this.panel.getEl().shadow;
+            if (s) {
+                s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
+            }
+        },
+
+//      Called on the mouseup event.
+        endDrag : function(e){
+            this.panel.setPosition(this.x, this.y);
+        }
+    }
+}).show();
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} disabled
+     * Render this panel disabled (default is <code>false</code>). An important note when using the disabled
+     * config on panels is that IE will often fail to initialize the disabled mask element correectly if
+     * the panel's layout has not yet completed by the time the Panel is disabled during the render process.
+     * If you experience this issue, you may need to instead use the {@link #afterlayout} event to initialize
+     * the disabled state:
+     * <pre><code>
+new Ext.Panel({
+    ...
+    listeners: {
+        'afterlayout': {
+            fn: function(p){
+                p.disable();
+            },
+            single: true // important, as many layouts can occur
+        }
+    }
+});
+</code></pre>
+     */
+    /**
+     * @cfg {Boolean} autoHeight
+     * <code>true</code> to use height:'auto', <code>false</code> to use fixed height (defaults to <code>false</code>).
+     * <b>Note</b>: Setting <code>autoHeight: true</code> means that the browser will manage the panel's height
+     * based on its contents, and that Ext will not manage it at all. If the panel is within a layout that
+     * manages dimensions (<code>fit</code>, <code>border</code>, etc.) then setting <code>autoHeight: true</code>
+     * can cause issues with scrolling and will not generally work as expected since the panel will take
+     * on the height of its contents rather than the height required by the Ext layout.
+     */
+
+
+    /**
+     * @cfg {String} baseCls
+     * The base CSS class to apply to this panel's element (defaults to <code>'x-panel'</code>).
+     * <p>Another option available by default is to specify <code>'x-plain'</code> which strips all styling
+     * except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     * See <code>{@link #unstyled}</code> also.</p>
+     */
+    baseCls : 'x-panel',
+    /**
+     * @cfg {String} collapsedCls
+     * A CSS class to add to the panel's element after it has been collapsed (defaults to
+     * <code>'x-panel-collapsed'</code>).
+     */
+    collapsedCls : 'x-panel-collapsed',
+    /**
+     * @cfg {Boolean} maskDisabled
+     * <code>true</code> to mask the panel when it is {@link #disabled}, <code>false</code> to not mask it (defaults
+     * to <code>true</code>).  Either way, the panel will always tell its contained elements to disable themselves
+     * when it is disabled, but masking the panel can provide an additional visual cue that the panel is
+     * disabled.
+     */
+    maskDisabled : true,
+    /**
+     * @cfg {Boolean} animCollapse
+     * <code>true</code> to animate the transition when the panel is collapsed, <code>false</code> to skip the
+     * animation (defaults to <code>true</code> if the {@link Ext.Fx} class is available, otherwise <code>false</code>).
+     */
+    animCollapse : Ext.enableFx,
+    /**
+     * @cfg {Boolean} headerAsText
+     * <code>true</code> to display the panel <code>{@link #title}</code> in the <code>{@link #header}</code>,
+     * <code>false</code> to hide it (defaults to <code>true</code>).
+     */
+    headerAsText : true,
+    /**
+     * @cfg {String} buttonAlign
+     * The alignment of any {@link #buttons} added to this panel.  Valid values are <code>'right'</code>,
+     * <code>'left'</code> and <code>'center'</code> (defaults to <code>'right'</code>).
+     */
+    buttonAlign : 'right',
+    /**
+     * @cfg {Boolean} collapsed
+     * <code>true</code> to render the panel collapsed, <code>false</code> to render it expanded (defaults to
+     * <code>false</code>).
+     */
+    collapsed : false,
+    /**
+     * @cfg {Boolean} collapseFirst
+     * <code>true</code> to make sure the collapse/expand toggle button always renders first (to the left of)
+     * any other tools in the panel's title bar, <code>false</code> to render it last (defaults to <code>true</code>).
+     */
+    collapseFirst : true,
+    /**
+     * @cfg {Number} minButtonWidth
+     * Minimum width in pixels of all {@link #buttons} in this panel (defaults to <code>75</code>)
+     */
+    minButtonWidth : 75,
+    /**
+     * @cfg {Boolean} unstyled
+     * Overrides the <code>{@link #baseCls}</code> setting to <code>{@link #baseCls} = 'x-plain'</code> which renders
+     * the panel unstyled except for required attributes for Ext layouts to function (e.g. overflow:hidden).
+     */
+    /**
+     * @cfg {String} elements
+     * A comma-delimited list of panel elements to initialize when the panel is rendered.  Normally, this list will be
+     * generated automatically based on the items added to the panel at config time, but sometimes it might be useful to
+     * make sure a structural element is rendered even if not specified at config time (for example, you may want
+     * to add a button or toolbar dynamically after the panel has been rendered).  Adding those elements to this
+     * list will allocate the required placeholders in the panel when it is rendered.  Valid values are<div class="mdetail-params"><ul>
+     * <li><code>header</code></li>
+     * <li><code>tbar</code> (top bar)</li>
+     * <li><code>body</code></li>
+     * <li><code>bbar</code> (bottom bar)</li>
+     * <li><code>footer</code></li>
+     * </ul></div>
+     * Defaults to '<code>body</code>'.
+     */
+    elements : 'body',
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * Defaults to <code>false</code>.  When set to <code>true</code>, an extra css class <code>'x-panel-normal'</code>
+     * will be added to the panel's element, effectively applying css styles suggested by the W3C
+     * (see http://www.w3.org/TR/CSS21/sample.html) to the Panel's <b>body</b> element (not the header,
+     * footer, etc.).
+     */
+    preventBodyReset : false,
+
+    /**
+     * @cfg {Number/String} padding
+     * A shortcut for setting a padding style on the body element. The value can either be
+     * a number to be applied to all sides, or a normal css string describing padding.
+     * Defaults to <tt>undefined</tt>.
+     *
+     */
+    padding: undefined,
+
+    /** @cfg {String} resizeEvent
+     * The event to listen to for resizing in layouts. Defaults to <tt>'bodyresize'</tt>.
+     */
+    resizeEvent: 'bodyresize',
+
+    // protected - these could be used to customize the behavior of the window,
+    // but changing them would not be useful without further mofifications and
+    // could lead to unexpected or undesirable results.
+    toolTarget : 'header',
+    collapseEl : 'bwrap',
+    slideAnchor : 't',
+    disabledClass : '',
+
+    // private, notify box this class will handle heights
+    deferHeight : true,
+    // private
+    expandDefaults: {
+        duration : 0.25
+    },
+    // private
+    collapseDefaults : {
+        duration : 0.25
+    },
+
+    // private
+    initComponent : function(){
+        Ext.Panel.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event bodyresize
+             * Fires after the Panel has been resized.
+             * @param {Ext.Panel} p the Panel which has been resized.
+             * @param {Number} width The Panel body's new width.
+             * @param {Number} height The Panel body's new height.
+             */
+            'bodyresize',
+            /**
+             * @event titlechange
+             * Fires after the Panel title has been {@link #title set} or {@link #setTitle changed}.
+             * @param {Ext.Panel} p the Panel which has had its title changed.
+             * @param {String} The new title.
+             */
+            'titlechange',
+            /**
+             * @event iconchange
+             * Fires after the Panel icon class has been {@link #iconCls set} or {@link #setIconClass changed}.
+             * @param {Ext.Panel} p the Panel which has had its {@link #iconCls icon class} changed.
+             * @param {String} The new icon class.
+             * @param {String} The old icon class.
+             */
+            'iconchange',
+            /**
+             * @event collapse
+             * Fires after the Panel has been collapsed.
+             * @param {Ext.Panel} p the Panel that has been collapsed.
+             */
+            'collapse',
+            /**
+             * @event expand
+             * Fires after the Panel has been expanded.
+             * @param {Ext.Panel} p The Panel that has been expanded.
+             */
+            'expand',
+            /**
+             * @event beforecollapse
+             * Fires before the Panel is collapsed.  A handler can return false to cancel the collapse.
+             * @param {Ext.Panel} p the Panel being collapsed.
+             * @param {Boolean} animate True if the collapse is animated, else false.
+             */
+            'beforecollapse',
+            /**
+             * @event beforeexpand
+             * Fires before the Panel is expanded.  A handler can return false to cancel the expand.
+             * @param {Ext.Panel} p The Panel being expanded.
+             * @param {Boolean} animate True if the expand is animated, else false.
+             */
+            'beforeexpand',
+            /**
+             * @event beforeclose
+             * Fires before the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.  This event only
+             * applies to such subclasses.
+             * A handler can return false to cancel the close.
+             * @param {Ext.Panel} p The Panel being closed.
+             */
+            'beforeclose',
+            /**
+             * @event close
+             * Fires after the Panel is closed.  Note that Panels do not directly support being closed, but some
+             * Panel subclasses do (like {@link Ext.Window}) or a Panel within a Ext.TabPanel.
+             * @param {Ext.Panel} p The Panel that has been closed.
+             */
+            'close',
+            /**
+             * @event activate
+             * Fires after the Panel has been visually activated.
+             * Note that Panels do not directly support being activated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been activated.
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires after the Panel has been visually deactivated.
+             * Note that Panels do not directly support being deactivated, but some Panel subclasses
+             * do (like {@link Ext.Window}). Panels which are child Components of a TabPanel fire the
+             * activate and deactivate events under the control of the TabPanel.
+             * @param {Ext.Panel} p The Panel that has been deactivated.
+             */
+            'deactivate'
+        );
+
+        if(this.unstyled){
+            this.baseCls = 'x-plain';
+        }
+
+
+        this.toolbars = [];
+        // shortcuts
+        if(this.tbar){
+            this.elements += ',tbar';
+            this.topToolbar = this.createToolbar(this.tbar);
+            this.tbar = null;
+
+        }
+        if(this.bbar){
+            this.elements += ',bbar';
+            this.bottomToolbar = this.createToolbar(this.bbar);
+            this.bbar = null;
+        }
+
+        if(this.header === true){
+            this.elements += ',header';
+            this.header = null;
+        }else if(this.headerCfg || (this.title && this.header !== false)){
+            this.elements += ',header';
+        }
+
+        if(this.footerCfg || this.footer === true){
+            this.elements += ',footer';
+            this.footer = null;
+        }
+
+        if(this.buttons){
+            this.fbar = this.buttons;
+            this.buttons = null;
+        }
+        if(this.fbar){
+            this.createFbar(this.fbar);
+        }
+        if(this.autoLoad){
+            this.on('render', this.doAutoLoad, this, {delay:10});
+        }
+    },
+
+    // private
+    createFbar : function(fbar){
+        var min = this.minButtonWidth;
+        this.elements += ',footer';
+        this.fbar = this.createToolbar(fbar, {
+            buttonAlign: this.buttonAlign,
+            toolbarCls: 'x-panel-fbar',
+            enableOverflow: false,
+            defaults: function(c){
+                return {
+                    minWidth: c.minWidth || min
+                };
+            }
+        });
+        // @compat addButton and buttons could possibly be removed
+        // @target 4.0
+        /**
+         * This Panel's Array of buttons as created from the <code>{@link #buttons}</code>
+         * config property. Read only.
+         * @type Array
+         * @property buttons
+         */
+        this.fbar.items.each(function(c){
+            c.minWidth = c.minWidth || this.minButtonWidth;
+        }, this);
+        this.buttons = this.fbar.items.items;
+    },
+
+    // private
+    createToolbar: function(tb, options){
+        var result;
+        // Convert array to proper toolbar config
+        if(Ext.isArray(tb)){
+            tb = {
+                items: tb
+            };
+        }
+        result = tb.events ? Ext.apply(tb, options) : this.createComponent(Ext.apply({}, tb, options), 'toolbar');
+        this.toolbars.push(result);
+        return result;
+    },
+
+    // private
+    createElement : function(name, pnode){
+        if(this[name]){
+            pnode.appendChild(this[name].dom);
+            return;
+        }
+
+        if(name === 'bwrap' || this.elements.indexOf(name) != -1){
+            if(this[name+'Cfg']){
+                this[name] = Ext.fly(pnode).createChild(this[name+'Cfg']);
+            }else{
+                var el = document.createElement('div');
+                el.className = this[name+'Cls'];
+                this[name] = Ext.get(pnode.appendChild(el));
+            }
+            if(this[name+'CssClass']){
+                this[name].addClass(this[name+'CssClass']);
+            }
+            if(this[name+'Style']){
+                this[name].applyStyles(this[name+'Style']);
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Panel.superclass.onRender.call(this, ct, position);
+        this.createClasses();
+
+        var el = this.el,
+            d = el.dom,
+            bw,
+            ts;
+
+
+        if(this.collapsible && !this.hideCollapseTool){
+            this.tools = this.tools ? this.tools.slice(0) : [];
+            this.tools[this.collapseFirst?'unshift':'push']({
+                id: 'toggle',
+                handler : this.toggleCollapse,
+                scope: this
+            });
+        }
+
+        if(this.tools){
+            ts = this.tools;
+            this.elements += (this.header !== false) ? ',header' : '';
+        }
+        this.tools = {};
+
+        el.addClass(this.baseCls);
+        if(d.firstChild){ // existing markup
+            this.header = el.down('.'+this.headerCls);
+            this.bwrap = el.down('.'+this.bwrapCls);
+            var cp = this.bwrap ? this.bwrap : el;
+            this.tbar = cp.down('.'+this.tbarCls);
+            this.body = cp.down('.'+this.bodyCls);
+            this.bbar = cp.down('.'+this.bbarCls);
+            this.footer = cp.down('.'+this.footerCls);
+            this.fromMarkup = true;
+        }
+        if (this.preventBodyReset === true) {
+            el.addClass('x-panel-reset');
+        }
+        if(this.cls){
+            el.addClass(this.cls);
+        }
+
+        if(this.buttons){
+            this.elements += ',footer';
+        }
+
+        // This block allows for maximum flexibility and performance when using existing markup
+
+        // framing requires special markup
+        if(this.frame){
+            el.insertHtml('afterBegin', String.format(Ext.Element.boxMarkup, this.baseCls));
+
+            this.createElement('header', d.firstChild.firstChild.firstChild);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            var ml = d.childNodes[1], bl = d.childNodes[2];
+            bw.appendChild(ml);
+            bw.appendChild(bl);
+
+            var mc = bw.firstChild.firstChild.firstChild;
+            this.createElement('tbar', mc);
+            this.createElement('body', mc);
+            this.createElement('bbar', mc);
+            this.createElement('footer', bw.lastChild.firstChild.firstChild);
+
+            if(!this.footer){
+                this.bwrap.dom.lastChild.className += ' x-panel-nofooter';
+            }
+            /*
+             * Store a reference to this element so:
+             * a) We aren't looking it up all the time
+             * b) The last element is reported incorrectly when using a loadmask
+             */
+            this.ft = Ext.get(this.bwrap.dom.lastChild);
+            this.mc = Ext.get(mc);
+        }else{
+            this.createElement('header', d);
+            this.createElement('bwrap', d);
+
+            // append the mid and bottom frame to the bwrap
+            bw = this.bwrap.dom;
+            this.createElement('tbar', bw);
+            this.createElement('body', bw);
+            this.createElement('bbar', bw);
+            this.createElement('footer', bw);
+
+            if(!this.header){
+                this.body.addClass(this.bodyCls + '-noheader');
+                if(this.tbar){
+                    this.tbar.addClass(this.tbarCls + '-noheader');
+                }
+            }
+        }
+
+        if(Ext.isDefined(this.padding)){
+            this.body.setStyle('padding', this.body.addUnits(this.padding));
+        }
+
+        if(this.border === false){
+            this.el.addClass(this.baseCls + '-noborder');
+            this.body.addClass(this.bodyCls + '-noborder');
+            if(this.header){
+                this.header.addClass(this.headerCls + '-noborder');
+            }
+            if(this.footer){
+                this.footer.addClass(this.footerCls + '-noborder');
+            }
+            if(this.tbar){
+                this.tbar.addClass(this.tbarCls + '-noborder');
+            }
+            if(this.bbar){
+                this.bbar.addClass(this.bbarCls + '-noborder');
+            }
+        }
+
+        if(this.bodyBorder === false){
+           this.body.addClass(this.bodyCls + '-noborder');
+        }
+
+        this.bwrap.enableDisplayMode('block');
+
+        if(this.header){
+            this.header.unselectable();
+
+            // for tools, we need to wrap any existing header markup
+            if(this.headerAsText){
+                this.header.dom.innerHTML =
+                    '<span class="' + this.headerTextCls + '">'+this.header.dom.innerHTML+'</span>';
+
+                if(this.iconCls){
+                    this.setIconClass(this.iconCls);
+                }
+            }
+        }
+
+        if(this.floating){
+            this.makeFloating(this.floating);
+        }
+
+        if(this.collapsible && this.titleCollapse && this.header){
+            this.mon(this.header, 'click', this.toggleCollapse, this);
+            this.header.setStyle('cursor', 'pointer');
+        }
+        if(ts){
+            this.addTool.apply(this, ts);
+        }
+
+        // Render Toolbars.
+        if(this.fbar){
+            this.footer.addClass('x-panel-btns');
+            this.fbar.ownerCt = this;
+            this.fbar.render(this.footer);
+            this.footer.createChild({cls:'x-clear'});
+        }
+        if(this.tbar && this.topToolbar){
+            this.topToolbar.ownerCt = this;
+            this.topToolbar.render(this.tbar);
+        }
+        if(this.bbar && this.bottomToolbar){
+            this.bottomToolbar.ownerCt = this;
+            this.bottomToolbar.render(this.bbar);
+        }
+    },
+
+    /**
+     * Sets the CSS class that provides the icon image for this panel.  This method will replace any existing
+     * icon class if one has already been set and fire the {@link #iconchange} event after completion.
+     * @param {String} cls The new CSS class name
+     */
+    setIconClass : function(cls){
+        var old = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered && this.header){
+            if(this.frame){
+                this.header.addClass('x-panel-icon');
+                this.header.replaceClass(old, this.iconCls);
+            }else{
+                var hd = this.header,
+                    img = hd.child('img.x-panel-inline-icon');
+                if(img){
+                    Ext.fly(img).replaceClass(old, this.iconCls);
+                }else{
+                    var hdspan = hd.child('span.' + this.headerTextCls);
+                    if (hdspan) {
+                        Ext.DomHelper.insertBefore(hdspan.dom, {
+                            tag:'img', alt: '', src: Ext.BLANK_IMAGE_URL, cls:'x-panel-inline-icon '+this.iconCls
+                        });
+                    }
+                 }
+            }
+        }
+        this.fireEvent('iconchange', this, cls, old);
+    },
+
+    // private
+    makeFloating : function(cfg){
+        this.floating = true;
+        this.el = new Ext.Layer(Ext.apply({}, cfg, {
+            shadow: Ext.isDefined(this.shadow) ? this.shadow : 'sides',
+            shadowOffset: this.shadowOffset,
+            constrain:false,
+            shim: this.shim === false ? false : undefined
+        }), this.el);
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the top (<code>{@link #tbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getTopToolbar : function(){
+        return this.topToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the bottom (<code>{@link #bbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getBottomToolbar : function(){
+        return this.bottomToolbar;
+    },
+
+    /**
+     * Returns the {@link Ext.Toolbar toolbar} from the footer (<code>{@link #fbar}</code>) section of the panel.
+     * @return {Ext.Toolbar} The toolbar
+     */
+    getFooterToolbar : function() {
+        return this.fbar;
+    },
+
+    /**
+     * Adds a button to this panel.  Note that this method must be called prior to rendering.  The preferred
+     * approach is to add buttons via the {@link #buttons} config.
+     * @param {String/Object} config A valid {@link Ext.Button} config.  A string will become the text for a default
+     * button config, an object will be treated as a button config object.
+     * @param {Function} handler The function to be called on button {@link Ext.Button#click}
+     * @param {Object} scope The scope (<code>this</code> reference) in which the button handler function is executed. Defaults to the Button.
+     * @return {Ext.Button} The button that was added
+     */
+    addButton : function(config, handler, scope){
+        if(!this.fbar){
+            this.createFbar([]);
+        }
+        if(handler){
+            if(Ext.isString(config)){
+                config = {text: config};
+            }
+            config = Ext.apply({
+                handler: handler,
+                scope: scope
+            }, config);
+        }
+        return this.fbar.add(config);
+    },
+
+    // private
+    addTool : function(){
+        if(!this.rendered){
+            if(!this.tools){
+                this.tools = [];
+            }
+            Ext.each(arguments, function(arg){
+                this.tools.push(arg);
+            }, this);
+            return;
+        }
+         // nowhere to render tools!
+        if(!this[this.toolTarget]){
+            return;
+        }
+        if(!this.toolTemplate){
+            // initialize the global tool template on first use
+            var tt = new Ext.Template(
+                 '<div class="x-tool x-tool-{id}">&#160;</div>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.Panel.prototype.toolTemplate = tt;
+        }
+        for(var i = 0, a = arguments, len = a.length; i < len; i++) {
+            var tc = a[i];
+            if(!this.tools[tc.id]){
+                var overCls = 'x-tool-'+tc.id+'-over';
+                var t = this.toolTemplate.insertFirst(this[this.toolTarget], tc, true);
+                this.tools[tc.id] = t;
+                t.enableDisplayMode('block');
+                this.mon(t, 'click',  this.createToolHandler(t, tc, overCls, this));
+                if(tc.on){
+                    this.mon(t, tc.on);
+                }
+                if(tc.hidden){
+                    t.hide();
+                }
+                if(tc.qtip){
+                    if(Ext.isObject(tc.qtip)){
+                        Ext.QuickTips.register(Ext.apply({
+                              target: t.id
+                        }, tc.qtip));
+                    } else {
+                        t.dom.qtip = tc.qtip;
+                    }
+                }
+                t.addClassOnOver(overCls);
+            }
+        }
+    },
+
+    onLayout : function(shallow, force){
+        Ext.Panel.superclass.onLayout.apply(this, arguments);
+        if(this.hasLayout && this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout(undefined, force);
+            });
+            this.syncHeight();
+        }
+    },
+
+    syncHeight : function(){
+        var h = this.toolbarHeight,
+                bd = this.body,
+                lsh = this.lastSize.height,
+                sz;
+
+        if(this.autoHeight || !Ext.isDefined(lsh) || lsh == 'auto'){
+            return;
+        }
+
+
+        if(h != this.getToolbarHeight()){
+            h = Math.max(0, lsh - this.getFrameHeight());
+            bd.setHeight(h);
+            sz = bd.getSize();
+            this.toolbarHeight = this.getToolbarHeight();
+            this.onBodyResize(sz.width, sz.height);
+        }
+    },
+
+    // private
+    onShow : function(){
+        if(this.floating){
+            return this.el.show();
+        }
+        Ext.Panel.superclass.onShow.call(this);
+    },
+
+    // private
+    onHide : function(){
+        if(this.floating){
+            return this.el.hide();
+        }
+        Ext.Panel.superclass.onHide.call(this);
+    },
+
+    // private
+    createToolHandler : function(t, tc, overCls, panel){
+        return function(e){
+            t.removeClass(overCls);
+            if(tc.stopEvent !== false){
+                e.stopEvent();
+            }
+            if(tc.handler){
+                tc.handler.call(tc.scope || t, e, t, panel, tc);
+            }
+        };
+    },
+
+    // private
+    afterRender : function(){
+        if(this.floating && !this.hidden){
+            this.el.show();
+        }
+        if(this.title){
+            this.setTitle(this.title);
+        }
+        Ext.Panel.superclass.afterRender.call(this); // do sizing calcs last
+        if (this.collapsed) {
+            this.collapsed = false;
+            this.collapse(false);
+        }
+        this.initEvents();
+    },
+
+    // private
+    getKeyMap : function(){
+        if(!this.keyMap){
+            this.keyMap = new Ext.KeyMap(this.el, this.keys);
+        }
+        return this.keyMap;
+    },
+
+    // private
+    initEvents : function(){
+        if(this.keys){
+            this.getKeyMap();
+        }
+        if(this.draggable){
+            this.initDraggable();
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.doLayout();
+                tb.on({
+                    scope: this,
+                    afterlayout: this.syncHeight,
+                    remove: this.syncHeight
+                });
+            }, this);
+            this.syncHeight();
+        }
+
+    },
+
+    // private
+    initDraggable : function(){
+        /**
+         * <p>If this Panel is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DragSource} which handles dragging the Panel.</p>
+         * The developer must provide implementations of the abstract methods of {@link Ext.dd.DragSource}
+         * in order to supply behaviour for each stage of the drag/drop process. See {@link #draggable}.
+         * @type Ext.dd.DragSource.
+         * @property dd
+         */
+        this.dd = new Ext.Panel.DD(this, Ext.isBoolean(this.draggable) ? null : this.draggable);
+    },
+
+    // private
+    beforeEffect : function(anim){
+        if(this.floating){
+            this.el.beforeAction();
+        }
+        if(anim !== false){
+            this.el.addClass('x-panel-animated');
+        }
+    },
+
+    // private
+    afterEffect : function(anim){
+        this.syncShadow();
+        this.el.removeClass('x-panel-animated');
+    },
+
+    // private - wraps up an animation param with internal callbacks
+    createEffect : function(a, cb, scope){
+        var o = {
+            scope:scope,
+            block:true
+        };
+        if(a === true){
+            o.callback = cb;
+            return o;
+        }else if(!a.callback){
+            o.callback = cb;
+        }else { // wrap it up
+            o.callback = function(){
+                cb.call(scope);
+                Ext.callback(a.callback, a.scope);
+            };
+        }
+        return Ext.applyIf(o, a);
+    },
+
+    /**
+     * Collapses the panel body so that it becomes hidden.  Fires the {@link #beforecollapse} event which will
+     * cancel the collapse action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    collapse : function(animate){
+        if(this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforecollapse', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.beforeEffect(doAnim);
+        this.onCollapse(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideOut(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterCollapse, this),
+                        this.collapseDefaults));
+        }else{
+            this[this.collapseEl].hide(this.hideMode);
+            this.afterCollapse(false);
+        }
+    },
+
+    // private
+    afterCollapse : function(anim){
+        this.collapsed = true;
+        this.el.addClass(this.collapsedCls);
+        if(anim !== false){
+            this[this.collapseEl].hide(this.hideMode);
+        }
+        this.afterEffect(anim);
+
+        // Reset lastSize of all sub-components so they KNOW they are in a collapsed container
+        this.cascade(function(c) {
+            if (c.lastSize) {
+                c.lastSize = { width: undefined, height: undefined };
+            }
+        });
+        this.fireEvent('collapse', this);
+    },
+
+    /**
+     * Expands the panel body so that it becomes visible.  Fires the {@link #beforeexpand} event which will
+     * cancel the expand action if it returns false.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    expand : function(animate){
+        if(!this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforeexpand', this, animate) === false){
+            return;
+        }
+        var doAnim = animate === true || (animate !== false && this.animCollapse);
+        this.el.removeClass(this.collapsedCls);
+        this.beforeEffect(doAnim);
+        this.onExpand(doAnim, animate);
+        return this;
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(doAnim){
+            this[this.collapseEl].slideIn(this.slideAnchor,
+                    Ext.apply(this.createEffect(animArg||true, this.afterExpand, this),
+                        this.expandDefaults));
+        }else{
+            this[this.collapseEl].show(this.hideMode);
+            this.afterExpand(false);
+        }
+    },
+
+    // private
+    afterExpand : function(anim){
+        this.collapsed = false;
+        if(anim !== false){
+            this[this.collapseEl].show(this.hideMode);
+        }
+        this.afterEffect(anim);
+        if (this.deferLayout) {
+            delete this.deferLayout;
+            this.doLayout(true);
+        }
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * Shortcut for performing an {@link #expand} or {@link #collapse} based on the current state of the panel.
+     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
+     * {@link #animCollapse} panel config)
+     * @return {Ext.Panel} this
+     */
+    toggleCollapse : function(animate){
+        this[this.collapsed ? 'expand' : 'collapse'](animate);
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.mask();
+        }
+        Ext.Panel.superclass.onDisable.call(this);
+    },
+
+    // private
+    onEnable : function(){
+        if(this.rendered && this.maskDisabled){
+            this.el.unmask();
+        }
+        Ext.Panel.superclass.onEnable.call(this);
+    },
+
+    // private
+    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
+        var w = adjWidth,
+            h = adjHeight;
+
+        if(Ext.isDefined(w) || Ext.isDefined(h)){
+            if(!this.collapsed){
+                // First, set the the Panel's body width.
+                // If we have auto-widthed it, get the resulting full offset width so we can size the Toolbars to match
+                // The Toolbars must not buffer this resize operation because we need to know their heights.
+
+                if(Ext.isNumber(w)){
+                    this.body.setWidth(w = this.adjustBodyWidth(w - this.getFrameWidth()));
+                } else if (w == 'auto') {
+                    w = this.body.setWidth('auto').dom.offsetWidth;
+                } else {
+                    w = this.body.dom.offsetWidth;
+                }
+
+                if(this.tbar){
+                    this.tbar.setWidth(w);
+                    if(this.topToolbar){
+                        this.topToolbar.setSize(w);
+                    }
+                }
+                if(this.bbar){
+                    this.bbar.setWidth(w);
+                    if(this.bottomToolbar){
+                        this.bottomToolbar.setSize(w);
+                        // The bbar does not move on resize without this.
+                        if (Ext.isIE) {
+                            this.bbar.setStyle('position', 'static');
+                            this.bbar.setStyle('position', '');
+                        }
+                    }
+                }
+                if(this.footer){
+                    this.footer.setWidth(w);
+                    if(this.fbar){
+                        this.fbar.setSize(Ext.isIE ? (w - this.footer.getFrameWidth('lr')) : 'auto');
+                    }
+                }
+
+                // At this point, the Toolbars must be layed out for getFrameHeight to find a result.
+                if(Ext.isNumber(h)){
+                    h = Math.max(0, h - this.getFrameHeight());
+                    //h = Math.max(0, h - (this.getHeight() - this.body.getHeight()));
+                    this.body.setHeight(h);
+                }else if(h == 'auto'){
+                    this.body.setHeight(h);
+                }
+
+                if(this.disabled && this.el._mask){
+                    this.el._mask.setSize(this.el.dom.clientWidth, this.el.getHeight());
+                }
+            }else{
+                // Adds an event to set the correct height afterExpand.  This accounts for the deferHeight flag in panel
+                this.queuedBodySize = {width: w, height: h};
+                if(!this.queuedExpand && this.allowQueuedExpand !== false){
+                    this.queuedExpand = true;
+                    this.on('expand', function(){
+                        delete this.queuedExpand;
+                        this.onResize(this.queuedBodySize.width, this.queuedBodySize.height);
+                    }, this, {single:true});
+                }
+            }
+            this.onBodyResize(w, h);
+        }
+        this.syncShadow();
+        Ext.Panel.superclass.onResize.call(this, adjWidth, adjHeight, rawWidth, rawHeight);
+
+    },
+
+    // private
+    onBodyResize: function(w, h){
+        this.fireEvent('bodyresize', this, w, h);
+    },
+
+    // private
+    getToolbarHeight: function(){
+        var h = 0;
+        if(this.rendered){
+            Ext.each(this.toolbars, function(tb){
+                h += tb.getHeight();
+            }, this);
+        }
+        return h;
+    },
+
+    // deprecate
+    adjustBodyHeight : function(h){
+        return h;
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        return w;
+    },
+
+    // private
+    onPosition : function(){
+        this.syncShadow();
+    },
+
+    /**
+     * Returns the width in pixels of the framing elements of this panel (not including the body width).  To
+     * retrieve the body width see {@link #getInnerWidth}.
+     * @return {Number} The frame width
+     */
+    getFrameWidth : function(){
+        var w = this.el.getFrameWidth('lr') + this.bwrap.getFrameWidth('lr');
+
+        if(this.frame){
+            var l = this.bwrap.dom.firstChild;
+            w += (Ext.fly(l).getFrameWidth('l') + Ext.fly(l.firstChild).getFrameWidth('r'));
+            w += this.mc.getFrameWidth('lr');
+        }
+        return w;
+    },
+
+    /**
+     * Returns the height in pixels of the framing elements of this panel (including any top and bottom bars and
+     * header and footer elements, but not including the body height).  To retrieve the body height see {@link #getInnerHeight}.
+     * @return {Number} The frame height
+     */
+    getFrameHeight : function() {
+        var h  = this.el.getFrameWidth('tb') + this.bwrap.getFrameWidth('tb');
+        h += (this.tbar ? this.tbar.getHeight() : 0) +
+             (this.bbar ? this.bbar.getHeight() : 0);
+
+        if(this.frame){
+            h += this.el.dom.firstChild.offsetHeight + this.ft.dom.offsetHeight + this.mc.getFrameWidth('tb');
+        }else{
+            h += (this.header ? this.header.getHeight() : 0) +
+                (this.footer ? this.footer.getHeight() : 0);
+        }
+        return h;
+    },
+
+    /**
+     * Returns the width in pixels of the body element (not including the width of any framing elements).
+     * For the frame width see {@link #getFrameWidth}.
+     * @return {Number} The body width
+     */
+    getInnerWidth : function(){
+        return this.getSize().width - this.getFrameWidth();
+    },
+
+    /**
+     * Returns the height in pixels of the body element (not including the height of any framing elements).
+     * For the frame height see {@link #getFrameHeight}.
+     * @return {Number} The body height
+     */
+    getInnerHeight : function(){
+        return this.body.getHeight();
+        /* Deprecate
+            return this.getSize().height - this.getFrameHeight();
+        */
+    },
+
+    // private
+    syncShadow : function(){
+        if(this.floating){
+            this.el.sync(true);
+        }
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.body;
+    },
+
+    // private
+    getContentTarget : function(){
+        return this.body;
+    },
+
+    /**
+     * <p>Sets the title text for the panel and optionally the {@link #iconCls icon class}.</p>
+     * <p>In order to be able to set the title, a header element must have been created
+     * for the Panel. This is triggered either by configuring the Panel with a non-blank <code>{@link #title}</code>,
+     * or configuring it with <code><b>{@link #header}: true</b></code>.</p>
+     * @param {String} title The title text to set
+     * @param {String} iconCls (optional) {@link #iconCls iconCls} A user-defined CSS class that provides the icon image for this panel
+     */
+    setTitle : function(title, iconCls){
+        this.title = title;
+        if(this.header && this.headerAsText){
+            this.header.child('span').update(title);
+        }
+        if(iconCls){
+            this.setIconClass(iconCls);
+        }
+        this.fireEvent('titlechange', this, title);
+        return this;
+    },
+
+    /**
+     * Get the {@link Ext.Updater} for this panel. Enables you to perform Ajax updates of this panel's body.
+     * @return {Ext.Updater} The Updater
+     */
+    getUpdater : function(){
+        return this.body.getUpdater();
+    },
+
+     /**
+     * Loads this content panel immediately with content returned from an XHR call.
+     * @param {Object/String/Function} config A config object containing any of the following options:
+<pre><code>
+panel.load({
+    url: 'your-url.php',
+    params: {param1: 'foo', param2: 'bar'}, // or a URL encoded string
+    callback: yourFunction,
+    scope: yourObject, // optional scope for the callback
+    discardUrl: false,
+    nocache: false,
+    text: 'Loading...',
+    timeout: 30,
+    scripts: false
+});
+</code></pre>
+     * The only required property is url. The optional properties nocache, text and scripts
+     * are shorthand for disableCaching, indicatorText and loadScripts and are used to set their
+     * associated property on this panel Updater instance.
+     * @return {Ext.Panel} this
+     */
+    load : function(){
+        var um = this.body.getUpdater();
+        um.update.apply(um, arguments);
+        return this;
+    },
+
+    // private
+    beforeDestroy : function(){
+        Ext.Panel.superclass.beforeDestroy.call(this);
+        if(this.header){
+            this.header.removeAllListeners();
+        }
+        if(this.tools){
+            for(var k in this.tools){
+                Ext.destroy(this.tools[k]);
+            }
+        }
+        if(this.toolbars.length > 0){
+            Ext.each(this.toolbars, function(tb){
+                tb.un('afterlayout', this.syncHeight, this);
+                tb.un('remove', this.syncHeight, this);
+            }, this);
+        }
+        if(Ext.isArray(this.buttons)){
+            while(this.buttons.length) {
+                Ext.destroy(this.buttons[0]);
+            }
+        }
+        if(this.rendered){
+            Ext.destroy(
+                this.ft,
+                this.header,
+                this.footer,
+                this.tbar,
+                this.bbar,
+                this.body,
+                this.mc,
+                this.bwrap,
+                this.dd
+            );
+            if (this.fbar) {
+                Ext.destroy(
+                    this.fbar,
+                    this.fbar.el
+                );
+            }
+        }
+        Ext.destroy(this.toolbars);
+    },
+
+    // private
+    createClasses : function(){
+        this.headerCls = this.baseCls + '-header';
+        this.headerTextCls = this.baseCls + '-header-text';
+        this.bwrapCls = this.baseCls + '-bwrap';
+        this.tbarCls = this.baseCls + '-tbar';
+        this.bodyCls = this.baseCls + '-body';
+        this.bbarCls = this.baseCls + '-bbar';
+        this.footerCls = this.baseCls + '-footer';
+    },
+
+    // private
+    createGhost : function(cls, useShim, appendTo){
+        var el = document.createElement('div');
+        el.className = 'x-panel-ghost ' + (cls ? cls : '');
+        if(this.header){
+            el.appendChild(this.el.dom.firstChild.cloneNode(true));
+        }
+        Ext.fly(el.appendChild(document.createElement('ul'))).setHeight(this.bwrap.getHeight());
+        el.style.width = this.el.dom.offsetWidth + 'px';;
+        if(!appendTo){
+            this.container.dom.appendChild(el);
+        }else{
+            Ext.getDom(appendTo).appendChild(el);
+        }
+        if(useShim !== false && this.el.useShim !== false){
+            var layer = new Ext.Layer({shadow:false, useDisplay:true, constrain:false}, el);
+            layer.show();
+            return layer;
+        }else{
+            return new Ext.Element(el);
+        }
+    },
+
+    // private
+    doAutoLoad : function(){
+        var u = this.body.getUpdater();
+        if(this.renderer){
+            u.setRenderer(this.renderer);
+        }
+        u.update(Ext.isObject(this.autoLoad) ? this.autoLoad : {url: this.autoLoad});
+    },
+
+    /**
+     * Retrieve a tool by id.
+     * @param {String} id
+     * @return {Object} tool
+     */
+    getTool : function(id) {
+        return this.tools[id];
+    }
+
+/**
+ * @cfg {String} autoEl @hide
+ */
+});
+Ext.reg('panel', Ext.Panel);
+/**
+ * @class Ext.Editor
+ * @extends Ext.Component
+ * A base editor field that handles displaying/hiding on demand and has some built-in sizing and event handling logic.
+ * @constructor
+ * Create a new Editor
+ * @param {Object} config The config object
+ * @xtype editor
+ */
+Ext.Editor = function(field, config){
+    if(field.field){
+        this.field = Ext.create(field.field, 'textfield');
+        config = Ext.apply({}, field); // copy so we don't disturb original config
+        delete config.field;
+    }else{
+        this.field = field;
+    }
+    Ext.Editor.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.Editor, Ext.Component, {
+    /**
+    * @cfg {Ext.form.Field} field
+    * The Field object (or descendant) or config object for field
+    */
+    /**
+     * @cfg {Boolean} allowBlur
+     * True to {@link #completeEdit complete the editing process} if in edit mode when the
+     * field is blurred. Defaults to <tt>true</tt>.
+     */
+    allowBlur: true,
+    /**
+     * @cfg {Boolean/String} autoSize
+     * True for the editor to automatically adopt the size of the underlying field, "width" to adopt the width only,
+     * or "height" to adopt the height only, "none" to always use the field dimensions. (defaults to false)
+     */
+    /**
+     * @cfg {Boolean} revertInvalid
+     * True to automatically revert the field value and cancel the edit when the user completes an edit and the field
+     * validation fails (defaults to true)
+     */
+    /**
+     * @cfg {Boolean} ignoreNoChange
+     * True to skip the edit completion process (no save, no events fired) if the user completes an edit and
+     * the value has not changed (defaults to false).  Applies only to string values - edits for other data types
+     * will never be ignored.
+     */
+    /**
+     * @cfg {Boolean} hideEl
+     * False to keep the bound element visible while the editor is displayed (defaults to true)
+     */
+    /**
+     * @cfg {Mixed} value
+     * The data value of the underlying field (defaults to "")
+     */
+    value : "",
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "c-c?").
+     */
+    alignment: "c-c?",
+    /**
+     * @cfg {Array} offsets
+     * The offsets to use when aligning (see {@link Ext.Element#alignTo} for more details. Defaults to <tt>[0, 0]</tt>.
+     */
+    offsets: [0, 0],
+    /**
+     * @cfg {Boolean/String} shadow "sides" for sides/bottom only, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "frame")
+     */
+    shadow : "frame",
+    /**
+     * @cfg {Boolean} constrain True to constrain the editor to the viewport
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} swallowKeys Handle the keydown/keypress events so they don't propagate (defaults to true)
+     */
+    swallowKeys : true,
+    /**
+     * @cfg {Boolean} completeOnEnter True to complete the edit when the enter key is pressed. Defaults to <tt>true</tt>.
+     */
+    completeOnEnter : true,
+    /**
+     * @cfg {Boolean} cancelOnEsc True to cancel the edit when the escape key is pressed. Defaults to <tt>true</tt>.
+     */
+    cancelOnEsc : true,
+    /**
+     * @cfg {Boolean} updateEl True to update the innerHTML of the bound element when the update completes (defaults to false)
+     */
+    updateEl : false,
+
+    initComponent : function(){
+        Ext.Editor.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforestartedit
+             * Fires when editing is initiated, but before the value changes.  Editing can be canceled by returning
+             * false from the handler of this event.
+             * @param {Editor} this
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The field value being set
+             */
+            "beforestartedit",
+            /**
+             * @event startedit
+             * Fires when this editor is displayed
+             * @param {Ext.Element} boundEl The underlying element bound to this editor
+             * @param {Mixed} value The starting field value
+             */
+            "startedit",
+            /**
+             * @event beforecomplete
+             * Fires after a change has been made to the field, but before the change is reflected in the underlying
+             * field.  Saving the change to the field can be canceled by returning false from the handler of this event.
+             * Note that if the value has not changed and ignoreNoChange = true, the editing will still end but this
+             * event will not fire since no edit actually occurred.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "beforecomplete",
+            /**
+             * @event complete
+             * Fires after editing is complete and any changed value has been written to the underlying field.
+             * @param {Editor} this
+             * @param {Mixed} value The current field value
+             * @param {Mixed} startValue The original field value
+             */
+            "complete",
+            /**
+             * @event canceledit
+             * Fires after editing has been canceled and the editor's value has been reset.
+             * @param {Editor} this
+             * @param {Mixed} value The user-entered field value that was discarded
+             * @param {Mixed} startValue The original field value that was set back into the editor after cancel
+             */
+            "canceledit",
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check
+             * {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            "specialkey"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.el = new Ext.Layer({
+            shadow: this.shadow,
+            cls: "x-editor",
+            parentEl : ct,
+            shim : this.shim,
+            shadowOffset: this.shadowOffset || 4,
+            id: this.id,
+            constrain: this.constrain
+        });
+        if(this.zIndex){
+            this.el.setZIndex(this.zIndex);
+        }
+        this.el.setStyle("overflow", Ext.isGecko ? "auto" : "hidden");
+        if(this.field.msgTarget != 'title'){
+            this.field.msgTarget = 'qtip';
+        }
+        this.field.inEditor = true;
+        this.mon(this.field, {
+            scope: this,
+            blur: this.onBlur,
+            specialkey: this.onSpecialKey
+        });
+        if(this.field.grow){
+            this.mon(this.field, "autosize", this.el.sync,  this.el, {delay:1});
+        }
+        this.field.render(this.el).show();
+        this.field.getEl().dom.name = '';
+        if(this.swallowKeys){
+            this.field.el.swallowEvent([
+                'keypress', // *** Opera
+                'keydown'   // *** all other browsers
+            ]);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var key = e.getKey(),
+            complete = this.completeOnEnter && key == e.ENTER,
+            cancel = this.cancelOnEsc && key == e.ESC;
+        if(complete || cancel){
+            e.stopEvent();
+            if(complete){
+                this.completeEdit();
+            }else{
+                this.cancelEdit();
+            }
+            if(field.triggerBlur){
+                field.triggerBlur();
+            }
+        }
+        this.fireEvent('specialkey', field, e);
+    },
+
+    /**
+     * Starts the editing process and shows the editor.
+     * @param {Mixed} el The element to edit
+     * @param {String} value (optional) A value to initialize the editor with. If a value is not provided, it defaults
+      * to the innerHTML of el.
+     */
+    startEdit : function(el, value){
+        if(this.editing){
+            this.completeEdit();
+        }
+        this.boundEl = Ext.get(el);
+        var v = value !== undefined ? value : this.boundEl.dom.innerHTML;
+        if(!this.rendered){
+            this.render(this.parentEl || document.body);
+        }
+        if(this.fireEvent("beforestartedit", this, this.boundEl, v) !== false){
+            this.startValue = v;
+            this.field.reset();
+            this.field.setValue(v);
+            this.realign(true);
+            this.editing = true;
+            this.show();
+        }
+    },
+
+    // private
+    doAutoSize : function(){
+        if(this.autoSize){
+            var sz = this.boundEl.getSize(),
+                fs = this.field.getSize();
+
+            switch(this.autoSize){
+                case "width":
+                    this.setSize(sz.width, fs.height);
+                    break;
+                case "height":
+                    this.setSize(fs.width, sz.height);
+                    break;
+                case "none":
+                    this.setSize(fs.width, fs.height);
+                    break;
+                default:
+                    this.setSize(sz.width, sz.height);
+            }
+        }
+    },
+
+    /**
+     * Sets the height and width of this editor.
+     * @param {Number} width The new width
+     * @param {Number} height The new height
+     */
+    setSize : function(w, h){
+        delete this.field.lastSize;
+        this.field.setSize(w, h);
+        if(this.el){
+            // IE7 in strict mode doesn't size properly.
+            if(Ext.isGecko2 || Ext.isOpera || (Ext.isIE7 && Ext.isStrict)){
+                // prevent layer scrollbars
+                this.el.setSize(w, h);
+            }
+            this.el.sync();
+        }
+    },
+
+    /**
+     * Realigns the editor to the bound field based on the current alignment config value.
+     * @param {Boolean} autoSize (optional) True to size the field to the dimensions of the bound element.
+     */
+    realign : function(autoSize){
+        if(autoSize === true){
+            this.doAutoSize();
+        }
+        this.el.alignTo(this.boundEl, this.alignment, this.offsets);
+    },
+
+    /**
+     * Ends the editing process, persists the changed value to the underlying field, and hides the editor.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after edit (defaults to false)
+     */
+    completeEdit : function(remainVisible){
+        if(!this.editing){
+            return;
+        }
+        // Assert combo values first
+        if (this.field.assertValue) {
+            this.field.assertValue();
+        }
+        var v = this.getValue();
+        if(!this.field.isValid()){
+            if(this.revertInvalid !== false){
+                this.cancelEdit(remainVisible);
+            }
+            return;
+        }
+        if(String(v) === String(this.startValue) && this.ignoreNoChange){
+            this.hideEdit(remainVisible);
+            return;
+        }
+        if(this.fireEvent("beforecomplete", this, v, this.startValue) !== false){
+            v = this.getValue();
+            if(this.updateEl && this.boundEl){
+                this.boundEl.update(v);
+            }
+            this.hideEdit(remainVisible);
+            this.fireEvent("complete", this, v, this.startValue);
+        }
+    },
+
+    // private
+    onShow : function(){
+        this.el.show();
+        if(this.hideEl !== false){
+            this.boundEl.hide();
+        }
+        this.field.show().focus(false, true);
+        this.fireEvent("startedit", this.boundEl, this.startValue);
+    },
+
+    /**
+     * Cancels the editing process and hides the editor without persisting any changes.  The field value will be
+     * reverted to the original starting value.
+     * @param {Boolean} remainVisible Override the default behavior and keep the editor visible after
+     * cancel (defaults to false)
+     */
+    cancelEdit : function(remainVisible){
+        if(this.editing){
+            var v = this.getValue();
+            this.setValue(this.startValue);
+            this.hideEdit(remainVisible);
+            this.fireEvent("canceledit", this, v, this.startValue);
+        }
+    },
+
+    // private
+    hideEdit: function(remainVisible){
+        if(remainVisible !== true){
+            this.editing = false;
+            this.hide();
+        }
+    },
+
+    // private
+    onBlur : function(){
+        // selectSameEditor flag allows the same editor to be started without onBlur firing on itself
+        if(this.allowBlur === true && this.editing && this.selectSameEditor !== true){
+            this.completeEdit();
+        }
+    },
+
+    // private
+    onHide : function(){
+        if(this.editing){
+            this.completeEdit();
+            return;
+        }
+        this.field.blur();
+        if(this.field.collapse){
+            this.field.collapse();
+        }
+        this.el.hide();
+        if(this.hideEl !== false){
+            this.boundEl.show();
+        }
+    },
+
+    /**
+     * Sets the data value of the editor
+     * @param {Mixed} value Any valid value supported by the underlying field
+     */
+    setValue : function(v){
+        this.field.setValue(v);
+    },
+
+    /**
+     * Gets the data value of the editor
+     * @return {Mixed} The data value
+     */
+    getValue : function(){
+        return this.field.getValue();
+    },
+
+    beforeDestroy : function(){
+        Ext.destroyMembers(this, 'field');
+
+        delete this.parentEl;
+        delete this.boundEl;
+    }
+});
+Ext.reg('editor', Ext.Editor);
+/**
+ * @class Ext.ColorPalette
+ * @extends Ext.Component
+ * Simple color palette class for choosing colors.  The palette can be rendered to any container.<br />
+ * Here's an example of typical usage:
+ * <pre><code>
+var cp = new Ext.ColorPalette({value:'993300'});  // initial selected color
+cp.render('my-div');
+
+cp.on('select', function(palette, selColor){
+    // do something with selColor
+});
+</code></pre>
+ * @constructor
+ * Create a new ColorPalette
+ * @param {Object} config The config object
+ * @xtype colorpalette
+ */
+Ext.ColorPalette = Ext.extend(Ext.Component, {
+	/**
+	 * @cfg {String} tpl An existing XTemplate instance to be used in place of the default template for rendering the component.
+	 */
+    /**
+     * @cfg {String} itemCls
+     * The CSS class to apply to the containing element (defaults to 'x-color-palette')
+     */
+    itemCls : 'x-color-palette',
+    /**
+     * @cfg {String} value
+     * The initial color to highlight (should be a valid 6-digit color hex code without the # symbol).  Note that
+     * the hex codes are case-sensitive.
+     */
+    value : null,
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will cause a color to be selected. This can be any valid event name (dblclick, contextmenu). 
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent :'click',
+    // private
+    ctype : 'Ext.ColorPalette',
+
+    /**
+     * @cfg {Boolean} allowReselect If set to true then reselecting a color that is already selected fires the {@link #select} event
+     */
+    allowReselect : false,
+
+    /**
+     * <p>An array of 6-digit color hex code strings (without the # symbol).  This array can contain any number
+     * of colors, and each hex code should be unique.  The width of the palette is controlled via CSS by adjusting
+     * the width property of the 'x-color-palette' class (or assigning a custom class), so you can balance the number
+     * of colors with the width setting until the box is symmetrical.</p>
+     * <p>You can override individual colors if needed:</p>
+     * <pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors[0] = 'FF0000';  // change the first box to red
+</code></pre>
+
+Or you can provide a custom array of your own for complete control:
+<pre><code>
+var cp = new Ext.ColorPalette();
+cp.colors = ['000000', '993300', '333300'];
+</code></pre>
+     * @type Array
+     */
+    colors : [
+        '000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333',
+        '800000', 'FF6600', '808000', '008000', '008080', '0000FF', '666699', '808080',
+        'FF0000', 'FF9900', '99CC00', '339966', '33CCCC', '3366FF', '800080', '969696',
+        'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0',
+        'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', '99CCFF', 'CC99FF', 'FFFFFF'
+    ],
+
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this palette.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorPalette instance.
+     */
+    
+    // private
+    initComponent : function(){
+        Ext.ColorPalette.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a color is selected
+             * @param {ColorPalette} this
+             * @param {String} color The 6-digit color hex code (without the # symbol)
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler, this.scope, true);
+        }    
+    },
+
+    // private
+    onRender : function(container, position){
+        this.autoEl = {
+            tag: 'div',
+            cls: this.itemCls
+        };
+        Ext.ColorPalette.superclass.onRender.call(this, container, position);
+        var t = this.tpl || new Ext.XTemplate(
+            '<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on">&#160;</span></em></a></tpl>'
+        );
+        t.overwrite(this.el, this.colors);
+        this.mon(this.el, this.clickEvent, this.handleClick, this, {delegate: 'a'});
+        if(this.clickEvent != 'click'){
+        	this.mon(this.el, 'click', Ext.emptyFn, this, {delegate: 'a', preventDefault: true});
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ColorPalette.superclass.afterRender.call(this);
+        if(this.value){
+            var s = this.value;
+            this.value = null;
+            this.select(s, true);
+        }
+    },
+
+    // private
+    handleClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            var c = t.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];
+            this.select(c.toUpperCase());
+        }
+    },
+
+    /**
+     * Selects the specified color in the palette (fires the {@link #select} event)
+     * @param {String} color A valid 6-digit color hex code (# will be stripped if included)
+     * @param {Boolean} suppressEvent (optional) True to stop the select event from firing. Defaults to <tt>false</tt>.
+     */
+    select : function(color, suppressEvent){
+        color = color.replace('#', '');
+        if(color != this.value || this.allowReselect){
+            var el = this.el;
+            if(this.value){
+                el.child('a.color-'+this.value).removeClass('x-color-palette-sel');
+            }
+            el.child('a.color-'+color).addClass('x-color-palette-sel');
+            this.value = color;
+            if(suppressEvent !== true){
+                this.fireEvent('select', this, color);
+            }
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+Ext.reg('colorpalette', Ext.ColorPalette);/**
+ * @class Ext.DatePicker
+ * @extends Ext.Component
+ * <p>A popup date picker. This class is used by the {@link Ext.form.DateField DateField} class
+ * to allow browsing and selection of valid dates.</p>
+ * <p>All the string values documented below may be overridden by including an Ext locale file in
+ * your page.</p>
+ * @constructor
+ * Create a new DatePicker
+ * @param {Object} config The config object
+ * @xtype datepicker
+ */
+Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} todayText
+     * The text to display on the button that selects the current date (defaults to <code>'Today'</code>)
+     */
+    todayText : 'Today',
+    /**
+     * @cfg {String} okText
+     * The text to display on the ok button (defaults to <code>'&#160;OK&#160;'</code> to give the user extra clicking room)
+     */
+    okText : '&#160;OK&#160;',
+    /**
+     * @cfg {String} cancelText
+     * The text to display on the cancel button (defaults to <code>'Cancel'</code>)
+     */
+    cancelText : 'Cancel',
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this picker.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">This DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<code><b>this</b></code> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DatePicker instance.
+     */
+    /**
+     * @cfg {String} todayTip
+     * A string used to format the message for displaying in a tooltip over the button that
+     * selects the current date. Defaults to <code>'{0} (Spacebar)'</code> where
+     * the <code>{0}</code> token is replaced by today's date.
+     */
+    todayTip : '{0} (Spacebar)',
+    /**
+     * @cfg {String} minText
+     * The error text to display if the minDate validation fails (defaults to <code>'This date is before the minimum date'</code>)
+     */
+    minText : 'This date is before the minimum date',
+    /**
+     * @cfg {String} maxText
+     * The error text to display if the maxDate validation fails (defaults to <code>'This date is after the maximum date'</code>)
+     */
+    maxText : 'This date is after the maximum date',
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <code>'m/d/y'</code>).
+     */
+    format : 'm/d/y',
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <code>'Disabled'</code>)
+     */
+    disabledDaysText : 'Disabled',
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <code>'Disabled'</code>)
+     */
+    disabledDatesText : 'Disabled',
+    /**
+     * @cfg {Array} monthNames
+     * An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)
+     */
+    monthNames : Date.monthNames,
+    /**
+     * @cfg {Array} dayNames
+     * An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)
+     */
+    dayNames : Date.dayNames,
+    /**
+     * @cfg {String} nextText
+     * The next month navigation button tooltip (defaults to <code>'Next Month (Control+Right)'</code>)
+     */
+    nextText : 'Next Month (Control+Right)',
+    /**
+     * @cfg {String} prevText
+     * The previous month navigation button tooltip (defaults to <code>'Previous Month (Control+Left)'</code>)
+     */
+    prevText : 'Previous Month (Control+Left)',
+    /**
+     * @cfg {String} monthYearText
+     * The header month selector tooltip (defaults to <code>'Choose a month (Control+Up/Down to move years)'</code>)
+     */
+    monthYearText : 'Choose a month (Control+Up/Down to move years)',
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    /**
+     * @cfg {Boolean} showToday
+     * False to hide the footer area containing the Today button and disable the keyboard handler for spacebar
+     * that selects the current date (defaults to <code>true</code>).
+     */
+    showToday : true,
+    /**
+     * @cfg {Date} minDate
+     * Minimum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Date} maxDate
+     * Maximum allowable date (JavaScript date object, defaults to null)
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).
+     */
+    /**
+     * @cfg {RegExp} disabledDatesRE
+     * JavaScript regular expression used to disable a pattern of dates (defaults to null).  The {@link #disabledDates}
+     * config will generate this regex internally, but if you specify disabledDatesRE it will take precedence over the
+     * disabledDates value.
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of 'dates' to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:
+     * <ul>
+     * <li>['03/08/2003', '09/16/2003'] would disable those exact dates</li>
+     * <li>['03/08', '09/16'] would disable those days for every year</li>
+     * <li>['^03/08'] would only match the beginning (useful if you are using short years)</li>
+     * <li>['03/../2006'] would disable every day in March 2006</li>
+     * <li>['^03'] would disable every day in every March</li>
+     * </ul>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a date format that has '.' in it, you will have to
+     * escape the dot when restricting dates. For example: ['03\\.08\\.03'].
+     */
+
+    // private
+    // Set by other components to stop the picker focus being updated when the value changes.
+    focusOnSelect: true,
+
+    // default value used to initialise each date in the DatePicker
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initHour: 12, // 24-hour format
+
+    // private
+    initComponent : function(){
+        Ext.DatePicker.superclass.initComponent.call(this);
+
+        this.value = this.value ?
+                 this.value.clearTime(true) : new Date().clearTime();
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected
+             * @param {DatePicker} this DatePicker
+             * @param {Date} date The selected date
+             */
+            'select'
+        );
+
+        if(this.handler){
+            this.on('select', this.handler,  this.scope || this);
+        }
+
+        this.initDisabledDays();
+    },
+
+    // private
+    initDisabledDays : function(){
+        if(!this.disabledDatesRE && this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = '(?:';
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array/RegExp} disabledDates An array of date strings (see the {@link #disabledDates} config
+     * for details on supported values), or a JavaScript regular expression used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        if(Ext.isArray(dd)){
+            this.disabledDates = dd;
+            this.disabledDatesRE = null;
+        }else{
+            this.disabledDatesRE = dd;
+        }
+        this.initDisabledDays();
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the {@link #disabledDays} config
+     * for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #minDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinDate : function(dt){
+        this.minDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Replaces any existing {@link #maxDate} with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxDate : function(dt){
+        this.maxDate = dt;
+        this.update(this.value, true);
+    },
+
+    /**
+     * Sets the value of the date field
+     * @param {Date} value The date to set
+     */
+    setValue : function(value){
+        this.value = value.clearTime(true);
+        this.update(this.value);
+    },
+
+    /**
+     * Gets the current selected value of the date field
+     * @return {Date} The selected date
+     */
+    getValue : function(){
+        return this.value;
+    },
+
+    // private
+    focus : function(){
+        this.update(this.activeDate);
+    },
+
+    // private
+    onEnable: function(initial){
+        Ext.DatePicker.superclass.onEnable.call(this);
+        this.doDisabled(false);
+        this.update(initial ? this.value : this.activeDate);
+        if(Ext.isIE){
+            this.el.repaint();
+        }
+
+    },
+
+    // private
+    onDisable : function(){
+        Ext.DatePicker.superclass.onDisable.call(this);
+        this.doDisabled(true);
+        if(Ext.isIE && !Ext.isIE8){
+            /* Really strange problem in IE6/7, when disabled, have to explicitly
+             * repaint each of the nodes to get them to display correctly, simply
+             * calling repaint on the main element doesn't appear to be enough.
+             */
+             Ext.each([].concat(this.textNodes, this.el.query('th span')), function(el){
+                 Ext.fly(el).repaint();
+             });
+        }
+    },
+
+    // private
+    doDisabled : function(disabled){
+        this.keyNav.setDisabled(disabled);
+        this.prevRepeater.setDisabled(disabled);
+        this.nextRepeater.setDisabled(disabled);
+        if(this.showToday){
+            this.todayKeyListener.setDisabled(disabled);
+            this.todayBtn.setDisabled(disabled);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        var m = [
+             '<table cellspacing="0">',
+                '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr>',
+                '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],
+                dn = this.dayNames,
+                i;
+        for(i = 0; i < 7; i++){
+            var d = this.startDay+i;
+            if(d > 6){
+                d = d-7;
+            }
+            m.push('<th><span>', dn[d].substr(0,1), '</span></th>');
+        }
+        m[m.length] = '</tr></thead><tbody><tr>';
+        for(i = 0; i < 42; i++) {
+            if(i % 7 === 0 && i !== 0){
+                m[m.length] = '</tr><tr>';
+            }
+            m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
+        }
+        m.push('</tr></tbody></table></td></tr>',
+                this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '',
+                '</table><div class="x-date-mp"></div>');
+
+        var el = document.createElement('div');
+        el.className = 'x-date-picker';
+        el.innerHTML = m.join('');
+
+        container.dom.insertBefore(el, position);
+
+        this.el = Ext.get(el);
+        this.eventEl = Ext.get(el.firstChild);
+
+        this.prevRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-left a'), {
+            handler: this.showPrevMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.nextRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-right a'), {
+            handler: this.showNextMonth,
+            scope: this,
+            preventDefault:true,
+            stopDefault:true
+        });
+
+        this.monthPicker = this.el.down('div.x-date-mp');
+        this.monthPicker.enableDisplayMode('block');
+
+        this.keyNav = new Ext.KeyNav(this.eventEl, {
+            'left' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevMonth();
+                }else{
+                    this.update(this.activeDate.add('d', -1));
+                }
+            },
+
+            'right' : function(e){
+                if(e.ctrlKey){
+                    this.showNextMonth();
+                }else{
+                    this.update(this.activeDate.add('d', 1));
+                }
+            },
+
+            'up' : function(e){
+                if(e.ctrlKey){
+                    this.showNextYear();
+                }else{
+                    this.update(this.activeDate.add('d', -7));
+                }
+            },
+
+            'down' : function(e){
+                if(e.ctrlKey){
+                    this.showPrevYear();
+                }else{
+                    this.update(this.activeDate.add('d', 7));
+                }
+            },
+
+            'pageUp' : function(e){
+                this.showNextMonth();
+            },
+
+            'pageDown' : function(e){
+                this.showPrevMonth();
+            },
+
+            'enter' : function(e){
+                e.stopPropagation();
+                return true;
+            },
+
+            scope : this
+        });
+
+        this.el.unselectable();
+
+        this.cells = this.el.select('table.x-date-inner tbody td');
+        this.textNodes = this.el.query('table.x-date-inner tbody span');
+
+        this.mbtn = new Ext.Button({
+            text: '&#160;',
+            tooltip: this.monthYearText,
+            renderTo: this.el.child('td.x-date-middle', true)
+        });
+        this.mbtn.el.child('em').addClass('x-btn-arrow');
+
+        if(this.showToday){
+            this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,  this);
+            var today = (new Date()).dateFormat(this.format);
+            this.todayBtn = new Ext.Button({
+                renderTo: this.el.child('td.x-date-bottom', true),
+                text: String.format(this.todayText, today),
+                tooltip: String.format(this.todayTip, today),
+                handler: this.selectToday,
+                scope: this
+            });
+        }
+        this.mon(this.eventEl, 'mousewheel', this.handleMouseWheel, this);
+        this.mon(this.eventEl, 'click', this.handleDateClick,  this, {delegate: 'a.x-date-date'});
+        this.mon(this.mbtn, 'click', this.showMonthPicker, this);
+        this.onEnable(true);
+    },
+
+    // private
+    createMonthPicker : function(){
+        if(!this.monthPicker.dom.firstChild){
+            var buf = ['<table border="0" cellspacing="0">'];
+            for(var i = 0; i < 6; i++){
+                buf.push(
+                    '<tr><td class="x-date-mp-month"><a href="#">', Date.getShortMonthName(i), '</a></td>',
+                    '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', Date.getShortMonthName(i + 6), '</a></td>',
+                    i === 0 ?
+                    '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
+                    '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
+                );
+            }
+            buf.push(
+                '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
+                    this.okText,
+                    '</button><button type="button" class="x-date-mp-cancel">',
+                    this.cancelText,
+                    '</button></td></tr>',
+                '</table>'
+            );
+            this.monthPicker.update(buf.join(''));
+
+            this.mon(this.monthPicker, 'click', this.onMonthClick, this);
+            this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
+
+            this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
+            this.mpYears = this.monthPicker.select('td.x-date-mp-year');
+
+            this.mpMonths.each(function(m, a, i){
+                i += 1;
+                if((i%2) === 0){
+                    m.dom.xmonth = 5 + Math.round(i * 0.5);
+                }else{
+                    m.dom.xmonth = Math.round((i-1) * 0.5);
+                }
+            });
+        }
+    },
+
+    // private
+    showMonthPicker : function(){
+        if(!this.disabled){
+            this.createMonthPicker();
+            var size = this.el.getSize();
+            this.monthPicker.setSize(size);
+            this.monthPicker.child('table').setSize(size);
+
+            this.mpSelMonth = (this.activeDate || this.value).getMonth();
+            this.updateMPMonth(this.mpSelMonth);
+            this.mpSelYear = (this.activeDate || this.value).getFullYear();
+            this.updateMPYear(this.mpSelYear);
+
+            this.monthPicker.slideIn('t', {duration:0.2});
+        }
+    },
+
+    // private
+    updateMPYear : function(y){
+        this.mpyear = y;
+        var ys = this.mpYears.elements;
+        for(var i = 1; i <= 10; i++){
+            var td = ys[i-1], y2;
+            if((i%2) === 0){
+                y2 = y + Math.round(i * 0.5);
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }else{
+                y2 = y - (5-Math.round(i * 0.5));
+                td.firstChild.innerHTML = y2;
+                td.xyear = y2;
+            }
+            this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        }
+    },
+
+    // private
+    updateMPMonth : function(sm){
+        this.mpMonths.each(function(m, a, i){
+            m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
+        });
+    },
+
+    // private
+    selectMPMonth : function(m){
+
+    },
+
+    // private
+    onMonthClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if(el.is('button.x-date-mp-cancel')){
+            this.hideMonthPicker();
+        }
+        else if(el.is('button.x-date-mp-ok')){
+            var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
+            if(d.getMonth() != this.mpSelMonth){
+                // 'fix' the JS rolling date conversion if needed
+                d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
+            }
+            this.update(d);
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-month', 2))){
+            this.mpMonths.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelMonth = pn.dom.xmonth;
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.mpYears.removeClass('x-date-mp-sel');
+            pn.addClass('x-date-mp-sel');
+            this.mpSelYear = pn.dom.xyear;
+        }
+        else if(el.is('a.x-date-mp-prev')){
+            this.updateMPYear(this.mpyear-10);
+        }
+        else if(el.is('a.x-date-mp-next')){
+            this.updateMPYear(this.mpyear+10);
+        }
+    },
+
+    // private
+    onMonthDblClick : function(e, t){
+        e.stopEvent();
+        var el = new Ext.Element(t), pn;
+        if((pn = el.up('td.x-date-mp-month', 2))){
+            this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+        else if((pn = el.up('td.x-date-mp-year', 2))){
+            this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
+            this.hideMonthPicker();
+        }
+    },
+
+    // private
+    hideMonthPicker : function(disableAnim){
+        if(this.monthPicker){
+            if(disableAnim === true){
+                this.monthPicker.hide();
+            }else{
+                this.monthPicker.slideOut('t', {duration:0.2});
+            }
+        }
+    },
+
+    // private
+    showPrevMonth : function(e){
+        this.update(this.activeDate.add('mo', -1));
+    },
+
+    // private
+    showNextMonth : function(e){
+        this.update(this.activeDate.add('mo', 1));
+    },
+
+    // private
+    showPrevYear : function(){
+        this.update(this.activeDate.add('y', -1));
+    },
+
+    // private
+    showNextYear : function(){
+        this.update(this.activeDate.add('y', 1));
+    },
+
+    // private
+    handleMouseWheel : function(e){
+        e.stopEvent();
+        if(!this.disabled){
+            var delta = e.getWheelDelta();
+            if(delta > 0){
+                this.showPrevMonth();
+            } else if(delta < 0){
+                this.showNextMonth();
+            }
+        }
+    },
+
+    // private
+    handleDateClick : function(e, t){
+        e.stopEvent();
+        if(!this.disabled && t.dateValue && !Ext.fly(t.parentNode).hasClass('x-date-disabled')){
+            this.cancelFocus = this.focusOnSelect === false;
+            this.setValue(new Date(t.dateValue));
+            delete this.cancelFocus;
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    selectToday : function(){
+        if(this.todayBtn && !this.todayBtn.disabled){
+            this.setValue(new Date().clearTime());
+            this.fireEvent('select', this, this.value);
+        }
+    },
+
+    // private
+    update : function(date, forceRefresh){
+        if(this.rendered){
+            var vd = this.activeDate, vis = this.isVisible();
+            this.activeDate = date;
+            if(!forceRefresh && vd && this.el){
+                var t = date.getTime();
+                if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
+                    this.cells.removeClass('x-date-selected');
+                    this.cells.each(function(c){
+                       if(c.dom.firstChild.dateValue == t){
+                           c.addClass('x-date-selected');
+                           if(vis && !this.cancelFocus){
+                               Ext.fly(c.dom.firstChild).focus(50);
+                           }
+                           return false;
+                       }
+                    }, this);
+                    return;
+                }
+            }
+            var days = date.getDaysInMonth(),
+                firstOfMonth = date.getFirstDateOfMonth(),
+                startingPos = firstOfMonth.getDay()-this.startDay;
+
+            if(startingPos < 0){
+                startingPos += 7;
+            }
+            days += startingPos;
+
+            var pm = date.add('mo', -1),
+                prevStart = pm.getDaysInMonth()-startingPos,
+                cells = this.cells.elements,
+                textEls = this.textNodes,
+                // convert everything to numbers so it's fast
+                d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart, this.initHour)),
+                today = new Date().clearTime().getTime(),
+                sel = date.clearTime(true).getTime(),
+                min = this.minDate ? this.minDate.clearTime(true) : Number.NEGATIVE_INFINITY,
+                max = this.maxDate ? this.maxDate.clearTime(true) : Number.POSITIVE_INFINITY,
+                ddMatch = this.disabledDatesRE,
+                ddText = this.disabledDatesText,
+                ddays = this.disabledDays ? this.disabledDays.join('') : false,
+                ddaysText = this.disabledDaysText,
+                format = this.format;
+
+            if(this.showToday){
+                var td = new Date().clearTime(),
+                    disable = (td < min || td > max ||
+                    (ddMatch && format && ddMatch.test(td.dateFormat(format))) ||
+                    (ddays && ddays.indexOf(td.getDay()) != -1));
+
+                if(!this.disabled){
+                    this.todayBtn.setDisabled(disable);
+                    this.todayKeyListener[disable ? 'disable' : 'enable']();
+                }
+            }
+
+            var setCellClass = function(cal, cell){
+                cell.title = '';
+                var t = d.clearTime(true).getTime();
+                cell.firstChild.dateValue = t;
+                if(t == today){
+                    cell.className += ' x-date-today';
+                    cell.title = cal.todayText;
+                }
+                if(t == sel){
+                    cell.className += ' x-date-selected';
+                    if(vis){
+                        Ext.fly(cell.firstChild).focus(50);
+                    }
+                }
+                // disabling
+                if(t < min) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.minText;
+                    return;
+                }
+                if(t > max) {
+                    cell.className = ' x-date-disabled';
+                    cell.title = cal.maxText;
+                    return;
+                }
+                if(ddays){
+                    if(ddays.indexOf(d.getDay()) != -1){
+                        cell.title = ddaysText;
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+                if(ddMatch && format){
+                    var fvalue = d.dateFormat(format);
+                    if(ddMatch.test(fvalue)){
+                        cell.title = ddText.replace('%0', fvalue);
+                        cell.className = ' x-date-disabled';
+                    }
+                }
+            };
+
+            var i = 0;
+            for(; i < startingPos; i++) {
+                textEls[i].innerHTML = (++prevStart);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-prevday';
+                setCellClass(this, cells[i]);
+            }
+            for(; i < days; i++){
+                var intDay = i - startingPos + 1;
+                textEls[i].innerHTML = (intDay);
+                d.setDate(d.getDate()+1);
+                cells[i].className = 'x-date-active';
+                setCellClass(this, cells[i]);
+            }
+            var extraDays = 0;
+            for(; i < 42; i++) {
+                 textEls[i].innerHTML = (++extraDays);
+                 d.setDate(d.getDate()+1);
+                 cells[i].className = 'x-date-nextday';
+                 setCellClass(this, cells[i]);
+            }
+
+            this.mbtn.setText(this.monthNames[date.getMonth()] + ' ' + date.getFullYear());
+
+            if(!this.internalRender){
+                var main = this.el.dom.firstChild,
+                    w = main.offsetWidth;
+                this.el.setWidth(w + this.el.getBorderWidth('lr'));
+                Ext.fly(main).setWidth(w);
+                this.internalRender = true;
+                // opera does not respect the auto grow header center column
+                // then, after it gets a width opera refuses to recalculate
+                // without a second pass
+                if(Ext.isOpera && !this.secondPass){
+                    main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + 'px';
+                    this.secondPass = true;
+                    this.update.defer(10, this, [date]);
+                }
+            }
+        }
+    },
+
+    // private
+    beforeDestroy : function() {
+        if(this.rendered){
+            Ext.destroy(
+                this.keyNav,
+                this.monthPicker,
+                this.eventEl,
+                this.mbtn,
+                this.nextRepeater,
+                this.prevRepeater,
+                this.cells.el,
+                this.todayBtn
+            );
+            delete this.textNodes;
+            delete this.cells.elements;
+        }
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+Ext.reg('datepicker', Ext.DatePicker);
+/**
+ * @class Ext.LoadMask
+ * A simple utility class for generically masking elements while loading data.  If the {@link #store}
+ * config option is specified, the masking will be automatically synchronized with the store's loading
+ * process and the mask element will be cached for reuse.  For all other elements, this mask will replace the
+ * element's Updater load indicator and will be destroyed after the initial load.
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic mask:
+var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait..."});
+myMask.show();
+</code></pre>
+ * @constructor
+ * Create a new LoadMask
+ * @param {Mixed} el The element or DOM node, or its id
+ * @param {Object} config The config object
+ */
+Ext.LoadMask = function(el, config){
+    this.el = Ext.get(el);
+    Ext.apply(this, config);
+    if(this.store){
+        this.store.on({
+            scope: this,
+            beforeload: this.onBeforeLoad,
+            load: this.onLoad,
+            exception: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, false);
+    }else{
+        var um = this.el.getUpdater();
+        um.showLoadIndicator = false; // disable the default indicator
+        um.on({
+            scope: this,
+            beforeupdate: this.onBeforeLoad,
+            update: this.onLoad,
+            failure: this.onLoad
+        });
+        this.removeMask = Ext.value(this.removeMask, true);
+    }
+};
+
+Ext.LoadMask.prototype = {
+    /**
+     * @cfg {Ext.data.Store} store
+     * Optional Store to which the mask is bound. The mask is displayed when a load request is issued, and
+     * hidden on either load sucess, or load fail.
+     */
+    /**
+     * @cfg {Boolean} removeMask
+     * True to create a single-use mask that is automatically destroyed after loading (useful for page loads),
+     * False to persist the mask element reference for multiple uses (e.g., for paged data widgets).  Defaults to false.
+     */
+    /**
+     * @cfg {String} msg
+     * The text to display in a centered loading message box (defaults to 'Loading...')
+     */
+    msg : 'Loading...',
+    /**
+     * @cfg {String} msgCls
+     * The CSS class to apply to the loading message element (defaults to "x-mask-loading")
+     */
+    msgCls : 'x-mask-loading',
+
+    /**
+     * Read-only. True if the mask is currently disabled so that it will not be displayed (defaults to false)
+     * @type Boolean
+     */
+    disabled: false,
+
+    /**
+     * Disables the mask to prevent it from being displayed
+     */
+    disable : function(){
+       this.disabled = true;
+    },
+
+    /**
+     * Enables the mask so that it can be displayed
+     */
+    enable : function(){
+        this.disabled = false;
+    },
+
+    // private
+    onLoad : function(){
+        this.el.unmask(this.removeMask);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.disabled){
+            this.el.mask(this.msg, this.msgCls);
+        }
+    },
+
+    /**
+     * Show this LoadMask over the configured Element.
+     */
+    show: function(){
+        this.onBeforeLoad();
+    },
+
+    /**
+     * Hide this LoadMask.
+     */
+    hide: function(){
+        this.onLoad();
+    },
+
+    // private
+    destroy : function(){
+        if(this.store){
+            this.store.un('beforeload', this.onBeforeLoad, this);
+            this.store.un('load', this.onLoad, this);
+            this.store.un('exception', this.onLoad, this);
+        }else{
+            var um = this.el.getUpdater();
+            um.un('beforeupdate', this.onBeforeLoad, this);
+            um.un('update', this.onLoad, this);
+            um.un('failure', this.onLoad, this);
+        }
+    }
+};/**
+ * @class Ext.slider.Thumb
+ * @extends Object
+ * Represents a single thumb element on a Slider. This would not usually be created manually and would instead
+ * be created internally by an {@link Ext.slider.MultiSlider Ext.Slider}.
+ */
+Ext.slider.Thumb = Ext.extend(Object, {
+    
+    /**
+     * True while the thumb is in a drag operation
+     * @type Boolean
+     */
+    dragging: false,
+
+    /**
+     * @constructor
+     * @cfg {Ext.slider.MultiSlider} slider The Slider to render to (required)
+     */
+    constructor: function(config) {
+        /**
+         * @property slider
+         * @type Ext.slider.MultiSlider
+         * The slider this thumb is contained within
+         */
+        Ext.apply(this, config || {}, {
+            cls: 'x-slider-thumb',
+
+            /**
+             * @cfg {Boolean} constrain True to constrain the thumb so that it cannot overlap its siblings
+             */
+            constrain: false
+        });
+
+        Ext.slider.Thumb.superclass.constructor.call(this, config);
+
+        if (this.slider.vertical) {
+            Ext.apply(this, Ext.slider.Thumb.Vertical);
+        }
+    },
+
+    /**
+     * Renders the thumb into a slider
+     */
+    render: function() {
+        this.el = this.slider.innerEl.insertFirst({cls: this.cls});
+
+        this.initEvents();
+    },
+
+    /**
+     * Enables the thumb if it is currently disabled
+     */
+    enable: function() {
+        this.disabled = false;
+        this.el.removeClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Disables the thumb if it is currently enabled
+     */
+    disable: function() {
+        this.disabled = true;
+        this.el.addClass(this.slider.disabledClass);
+    },
+
+    /**
+     * Sets up an Ext.dd.DragTracker for this thumb
+     */
+    initEvents: function() {
+        var el = this.el;
+
+        el.addClassOnOver('x-slider-thumb-over');
+
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeDragStart.createDelegate(this),
+            onStart      : this.onDragStart.createDelegate(this),
+            onDrag       : this.onDrag.createDelegate(this),
+            onEnd        : this.onDragEnd.createDelegate(this),
+            tolerance    : 3,
+            autoStart    : 300
+        });
+
+        this.tracker.initEl(el);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker. If the slider is currently disabled,
+     * this returns false to disable the DragTracker too.
+     * @return {Boolean} False if the slider is currently disabled
+     */
+    onBeforeDragStart : function(e) {
+        if (this.disabled) {
+            return false;
+        } else {
+            this.slider.promoteThumb(this);
+            return true;
+        }
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onStart template method. Adds the drag CSS class
+     * to the thumb and fires the 'dragstart' event
+     */
+    onDragStart: function(e){
+        this.el.addClass('x-slider-thumb-drag');
+        this.dragging = true;
+        this.dragStartValue = this.value;
+
+        this.slider.fireEvent('dragstart', this.slider, e, this);
+    },
+
+    /**
+     * @private
+     * This is tied into the internal Ext.dd.DragTracker's onDrag template method. This is called every time
+     * the DragTracker detects a drag movement. It updates the Slider's value using the position of the drag
+     */
+    onDrag: function(e) {
+        var slider   = this.slider,
+            index    = this.index,
+            newValue = this.getNewValue();
+
+        if (this.constrain) {
+            var above = slider.thumbs[index + 1],
+                below = slider.thumbs[index - 1];
+
+            if (below != undefined && newValue <= below.value) newValue = below.value;
+            if (above != undefined && newValue >= above.value) newValue = above.value;
+        }
+
+        slider.setValue(index, newValue, false);
+        slider.fireEvent('drag', slider, e, this);
+    },
+
+    getNewValue: function() {
+        var slider   = this.slider,
+            pos      = slider.innerEl.translatePoints(this.tracker.getXY());
+
+        return Ext.util.Format.round(slider.reverseValue(pos.left), slider.decimalPrecision);
+    },
+
+    /**
+     * @private
+     * This is tied to the internal Ext.dd.DragTracker's onEnd template method. Removes the drag CSS class and
+     * fires the 'changecomplete' event with the new value
+     */
+    onDragEnd: function(e) {
+        var slider = this.slider,
+            value  = this.value;
+
+        this.el.removeClass('x-slider-thumb-drag');
+
+        this.dragging = false;
+        slider.fireEvent('dragend', slider, e);
+
+        if (this.dragStartValue != value) {
+            slider.fireEvent('changecomplete', slider, value, this);
+        }
+    },
+    
+    /**
+     * @private
+     * Destroys the thumb
+     */
+    destroy: function(){
+        Ext.destroyMembers(this, 'tracker', 'el');
+    }
+});
+
+/**
+ * @class Ext.slider.MultiSlider
+ * @extends Ext.BoxComponent
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments, configurable snapping, axis clicking and animation. Can be added as an item to any container. Example usage:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</pre>
+ * Sliders can be created with more than one thumb handle by passing an array of values instead of a single one:
+<pre>
+new Ext.Slider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    values: [25, 50, 75],
+    minValue: 0,
+    maxValue: 100,
+
+    //this defaults to true, setting to false allows the thumbs to pass each other
+    {@link #constrainThumbs}: false
+});
+</pre>
+ */
+Ext.slider.MultiSlider = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {Number} value The value to initialize the slider with. Defaults to minValue.
+     */
+    /**
+     * @cfg {Boolean} vertical Orient the Slider vertically rather than horizontally, defaults to false.
+     */
+    vertical: false,
+    /**
+     * @cfg {Number} minValue The minimum value for the Slider. Defaults to 0.
+     */
+    minValue: 0,
+    /**
+     * @cfg {Number} maxValue The maximum value for the Slider. Defaults to 100.
+     */
+    maxValue: 100,
+    /**
+     * @cfg {Number/Boolean} decimalPrecision.
+     * <p>The number of decimal places to which to round the Slider's value. Defaults to 0.</p>
+     * <p>To disable rounding, configure as <tt><b>false</b></tt>.</p>
+     */
+    decimalPrecision: 0,
+    /**
+     * @cfg {Number} keyIncrement How many units to change the Slider when adjusting with keyboard navigation. Defaults to 1. If the increment config is larger, it will be used instead.
+     */
+    keyIncrement: 1,
+    /**
+     * @cfg {Number} increment How many units to change the slider when adjusting by drag and drop. Use this option to enable 'snapping'.
+     */
+    increment: 0,
+
+    /**
+     * @private
+     * @property clickRange
+     * @type Array
+     * Determines whether or not a click to the slider component is considered to be a user request to change the value. Specified as an array of [top, bottom],
+     * the click event's 'top' property is compared to these numbers and the click only considered a change request if it falls within them. e.g. if the 'top'
+     * value of the click event is 4 or 16, the click is not considered a change request as it falls outside of the [5, 15] range
+     */
+    clickRange: [5,15],
+
+    /**
+     * @cfg {Boolean} clickToChange Determines whether or not clicking on the Slider axis will change the slider. Defaults to true
+     */
+    clickToChange : true,
+    /**
+     * @cfg {Boolean} animate Turn on or off animation. Defaults to true
+     */
+    animate: true,
+    /**
+     * @cfg {Boolean} constrainThumbs True to disallow thumbs from overlapping one another. Defaults to true
+     */
+    constrainThumbs: true,
+
+    /**
+     * @private
+     * @property topThumbZIndex
+     * @type Number
+     * The number used internally to set the z index of the top thumb (see promoteThumb for details)
+     */
+    topThumbZIndex: 10000,
+
+    // private override
+    initComponent : function(){
+        if(!Ext.isDefined(this.value)){
+            this.value = this.minValue;
+        }
+
+        /**
+         * @property thumbs
+         * @type Array
+         * Array containing references to each thumb
+         */
+        this.thumbs = [];
+
+        Ext.slider.MultiSlider.superclass.initComponent.call(this);
+
+        this.keyIncrement = Math.max(this.increment, this.keyIncrement);
+        this.addEvents(
+            /**
+             * @event beforechange
+             * Fires before the slider value is changed. By returning false from an event handler,
+             * you can cancel the event and prevent the slider from changing.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider is being changed to.
+             * @param {Number} oldValue The old value which the slider was previously.
+             */
+            'beforechange',
+
+            /**
+             * @event change
+             * Fires when the slider value is changed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'change',
+
+            /**
+             * @event changecomplete
+             * Fires when the slider value is changed by the user and any drag operations have completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Number} newValue The new value which the slider has been changed to.
+             * @param {Ext.slider.Thumb} thumb The thumb that was changed
+             */
+            'changecomplete',
+
+            /**
+             * @event dragstart
+             * Fires after a drag operation has started.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragstart',
+
+            /**
+             * @event drag
+             * Fires continuously during the drag operation while the mouse is moving.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'drag',
+
+            /**
+             * @event dragend
+             * Fires after the drag operation has completed.
+             * @param {Ext.slider.MultiSlider} slider The slider
+             * @param {Ext.EventObject} e The event fired from Ext.dd.DragTracker
+             */
+            'dragend'
+        );
+
+        /**
+         * @property values
+         * @type Array
+         * Array of values to initalize the thumbs with
+         */
+        if (this.values == undefined || Ext.isEmpty(this.values)) this.values = [0];
+
+        var values = this.values;
+
+        for (var i=0; i < values.length; i++) {
+            this.addThumb(values[i]);
+        }
+
+        if(this.vertical){
+            Ext.apply(this, Ext.slider.Vertical);
+        }
+    },
+
+    /**
+     * Creates a new thumb and adds it to the slider
+     * @param {Number} value The initial value to set on the thumb. Defaults to 0
+     */
+    addThumb: function(value) {
+        var thumb = new Ext.slider.Thumb({
+            value    : value,
+            slider   : this,
+            index    : this.thumbs.length,
+            constrain: this.constrainThumbs
+        });
+        this.thumbs.push(thumb);
+
+        //render the thumb now if needed
+        if (this.rendered) thumb.render();
+    },
+
+    /**
+     * @private
+     * Moves the given thumb above all other by increasing its z-index. This is called when as drag
+     * any thumb, so that the thumb that was just dragged is always at the highest z-index. This is
+     * required when the thumbs are stacked on top of each other at one of the ends of the slider's
+     * range, which can result in the user not being able to move any of them.
+     * @param {Ext.slider.Thumb} topThumb The thumb to move to the top
+     */
+    promoteThumb: function(topThumb) {
+        var thumbs = this.thumbs,
+            zIndex, thumb;
+
+        for (var i = 0, j = thumbs.length; i < j; i++) {
+            thumb = thumbs[i];
+
+            if (thumb == topThumb) {
+                zIndex = this.topThumbZIndex;
+            } else {
+                zIndex = '';
+            }
+
+            thumb.el.setStyle('zIndex', zIndex);
+        }
+    },
+
+    // private override
+    onRender : function() {
+        this.autoEl = {
+            cls: 'x-slider ' + (this.vertical ? 'x-slider-vert' : 'x-slider-horz'),
+            cn : {
+                cls: 'x-slider-end',
+                cn : {
+                    cls:'x-slider-inner',
+                    cn : [{tag:'a', cls:'x-slider-focus', href:"#", tabIndex: '-1', hidefocus:'on'}]
+                }
+            }
+        };
+
+        Ext.slider.MultiSlider.superclass.onRender.apply(this, arguments);
+
+        this.endEl   = this.el.first();
+        this.innerEl = this.endEl.first();
+        this.focusEl = this.innerEl.child('.x-slider-focus');
+
+        //render each thumb
+        for (var i=0; i < this.thumbs.length; i++) {
+            this.thumbs[i].render();
+        }
+
+        //calculate the size of half a thumb
+        var thumb      = this.innerEl.child('.x-slider-thumb');
+        this.halfThumb = (this.vertical ? thumb.getHeight() : thumb.getWidth()) / 2;
+
+        this.initEvents();
+    },
+
+    /**
+     * @private
+     * Adds keyboard and mouse listeners on this.el. Ignores click events on the internal focus element.
+     * Creates a new DragTracker which is used to control what happens when the user drags the thumb around.
+     */
+    initEvents : function(){
+        this.mon(this.el, {
+            scope    : this,
+            mousedown: this.onMouseDown,
+            keydown  : this.onKeyDown
+        });
+
+        this.focusEl.swallowEvent("click", true);
+    },
+
+    /**
+     * @private
+     * Mousedown handler for the slider. If the clickToChange is enabled and the click was not on the draggable 'thumb',
+     * this calculates the new value of the slider and tells the implementation (Horizontal or Vertical) to move the thumb
+     * @param {Ext.EventObject} e The click event
+     */
+    onMouseDown : function(e){
+        if(this.disabled){
+            return;
+        }
+
+        //see if the click was on any of the thumbs
+        var thumbClicked = false;
+        for (var i=0; i < this.thumbs.length; i++) {
+            thumbClicked = thumbClicked || e.target == this.thumbs[i].el.dom;
+        }
+
+        if (this.clickToChange && !thumbClicked) {
+            var local = this.innerEl.translatePoints(e.getXY());
+            this.onClickChange(local);
+        }
+        this.focus();
+    },
+
+    /**
+     * @private
+     * Moves the thumb to the indicated position. Note that a Vertical implementation is provided in Ext.slider.Vertical.
+     * Only changes the value if the click was within this.clickRange.
+     * @param {Object} local Object containing top and left values for the click event.
+     */
+    onClickChange : function(local) {
+        if (local.top > this.clickRange[0] && local.top < this.clickRange[1]) {
+            //find the nearest thumb to the click event
+            var thumb = this.getNearest(local, 'left'),
+                index = thumb.index;
+
+            this.setValue(index, Ext.util.Format.round(this.reverseValue(local.left), this.decimalPrecision), undefined, true);
+        }
+    },
+
+    /**
+     * @private
+     * Returns the nearest thumb to a click event, along with its distance
+     * @param {Object} local Object containing top and left values from a click event
+     * @param {String} prop The property of local to compare on. Use 'left' for horizontal sliders, 'top' for vertical ones
+     * @return {Object} The closest thumb object and its distance from the click event
+     */
+    getNearest: function(local, prop) {
+        var localValue = prop == 'top' ? this.innerEl.getHeight() - local[prop] : local[prop],
+            clickValue = this.reverseValue(localValue),
+            nearestDistance = (this.maxValue - this.minValue) + 5, //add a small fudge for the end of the slider 
+            index = 0,
+            nearest = null;
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                value = thumb.value,
+                dist  = Math.abs(value - clickValue);
+
+            if (Math.abs(dist <= nearestDistance)) {
+                nearest = thumb;
+                index = i;
+                nearestDistance = dist;
+            }
+        }
+        return nearest;
+    },
+
+    /**
+     * @private
+     * Handler for any keypresses captured by the slider. If the key is UP or RIGHT, the thumb is moved along to the right
+     * by this.keyIncrement. If DOWN or LEFT it is moved left. Pressing CTRL moves the slider to the end in either direction
+     * @param {Ext.EventObject} e The Event object
+     */
+    onKeyDown : function(e){
+        /*
+         * The behaviour for keyboard handling with multiple thumbs is currently undefined.
+         * There's no real sane default for it, so leave it like this until we come up
+         * with a better way of doing it.
+         */
+        if(this.disabled || this.thumbs.length !== 1){
+            e.preventDefault();
+            return;
+        }
+        var k = e.getKey(),
+            val;
+        switch(k){
+            case e.UP:
+            case e.RIGHT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.maxValue : this.getValue(0) + this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            case e.DOWN:
+            case e.LEFT:
+                e.stopEvent();
+                val = e.ctrlKey ? this.minValue : this.getValue(0) - this.keyIncrement;
+                this.setValue(0, val, undefined, true);
+            break;
+            default:
+                e.preventDefault();
+        }
+    },
+
+    /**
+     * @private
+     * If using snapping, this takes a desired new value and returns the closest snapped
+     * value to it
+     * @param {Number} value The unsnapped value
+     * @return {Number} The value of the nearest snap target
+     */
+    doSnap : function(value){
+        if (!(this.increment && value)) {
+            return value;
+        }
+        var newValue = value,
+            inc = this.increment,
+            m = value % inc;
+        if (m != 0) {
+            newValue -= m;
+            if (m * 2 >= inc) {
+                newValue += inc;
+            } else if (m * 2 < -inc) {
+                newValue -= inc;
+            }
+        }
+        return newValue.constrain(this.minValue,  this.maxValue);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.slider.MultiSlider.superclass.afterRender.apply(this, arguments);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i];
+
+            if (thumb.value !== undefined) {
+                var v = this.normalizeValue(thumb.value);
+
+                if (v !== thumb.value) {
+                    // delete this.value;
+                    this.setValue(i, v, false);
+                } else {
+                    this.moveThumb(i, this.translateValue(v), false);
+                }
+            }
+        };
+    },
+
+    /**
+     * @private
+     * Returns the ratio of pixels to mapped values. e.g. if the slider is 200px wide and maxValue - minValue is 100,
+     * the ratio is 2
+     * @return {Number} The ratio of pixels to mapped values
+     */
+    getRatio : function(){
+        var w = this.innerEl.getWidth(),
+            v = this.maxValue - this.minValue;
+        return v == 0 ? w : (w/v);
+    },
+
+    /**
+     * @private
+     * Returns a snapped, constrained value when given a desired value
+     * @param {Number} value Raw number value
+     * @return {Number} The raw value rounded to the correct d.p. and constrained within the set max and min values
+     */
+    normalizeValue : function(v){
+        v = this.doSnap(v);
+        v = Ext.util.Format.round(v, this.decimalPrecision);
+        v = v.constrain(this.minValue, this.maxValue);
+        return v;
+    },
+
+    /**
+     * Sets the minimum value for the slider instance. If the current value is less than the
+     * minimum value, the current value will be changed.
+     * @param {Number} val The new minimum value
+     */
+    setMinValue : function(val){
+        this.minValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value < val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Sets the maximum value for the slider instance. If the current value is more than the
+     * maximum value, the current value will be changed.
+     * @param {Number} val The new maximum value
+     */
+    setMaxValue : function(val){
+        this.maxValue = val;
+        var i = 0,
+            thumbs = this.thumbs,
+            len = thumbs.length,
+            t;
+            
+        for(; i < len; ++i){
+            t = thumbs[i];
+            t.value = t.value > val ? val : t.value;
+        }
+        this.syncThumb();
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} index Index of the thumb to move
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue : function(index, v, animate, changeComplete) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        v = this.normalizeValue(v);
+
+        if (v !== thumb.value && this.fireEvent('beforechange', this, v, thumb.value, thumb) !== false) {
+            thumb.value = v;
+            if(this.rendered){
+                this.moveThumb(index, this.translateValue(v), animate !== false);
+                this.fireEvent('change', this, v, thumb);
+                if(changeComplete){
+                    this.fireEvent('changecomplete', this, v, thumb);
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     */
+    translateValue : function(v) {
+        var ratio = this.getRatio();
+        return (v * ratio) - (this.minValue * ratio) - this.halfThumb;
+    },
+
+    /**
+     * @private
+     * Given a pixel location along the slider, returns the mapped slider value for that pixel.
+     * E.g. if we have a slider 200px wide with minValue = 100 and maxValue = 500, reverseValue(50)
+     * returns 200
+     * @param {Number} pos The position along the slider to return a mapped value for
+     * @return {Number} The mapped value for the given position
+     */
+    reverseValue : function(pos){
+        var ratio = this.getRatio();
+        return (pos + (this.minValue * ratio)) / ratio;
+    },
+
+    /**
+     * @private
+     * @param {Number} index Index of the thumb to move
+     */
+    moveThumb: function(index, v, animate){
+        var thumb = this.thumbs[index].el;
+
+        if(!animate || this.animate === false){
+            thumb.setLeft(v);
+        }else{
+            thumb.shift({left: v, stopFx: true, duration:.35});
+        }
+    },
+
+    // private
+    focus : function(){
+        this.focusEl.focus(10);
+    },
+
+    // private
+    onResize : function(w, h){
+        var thumbs = this.thumbs,
+            len = thumbs.length,
+            i = 0;
+            
+        /*
+         * If we happen to be animating during a resize, the position of the thumb will likely be off
+         * when the animation stops. As such, just stop any animations before syncing the thumbs.
+         */
+        for(; i < len; ++i){
+            thumbs[i].el.stopFx();    
+        }
+        // check to see if we're using an auto width
+        if(Ext.isNumber(w)){
+            this.innerEl.setWidth(w - (this.el.getPadding('l') + this.endEl.getPadding('r')));
+        }
+        this.syncThumb();
+        Ext.slider.MultiSlider.superclass.onResize.apply(this, arguments);
+    },
+
+    //private
+    onDisable: function(){
+        Ext.slider.MultiSlider.superclass.onDisable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.disable();
+
+            if(Ext.isIE){
+                //IE breaks when using overflow visible and opacity other than 1.
+                //Create a place holder for the thumb and display it.
+                var xy = el.getXY();
+                el.hide();
+
+                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
+
+                if (!this.thumbHolder) {
+                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
+                }
+
+                this.thumbHolder.show().setXY(xy);
+            }
+        }
+    },
+
+    //private
+    onEnable: function(){
+        Ext.slider.MultiSlider.superclass.onEnable.call(this);
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            var thumb = this.thumbs[i],
+                el    = thumb.el;
+
+            thumb.enable();
+
+            if (Ext.isIE) {
+                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
+
+                if (this.thumbHolder) this.thumbHolder.hide();
+
+                el.show();
+                this.syncThumb();
+            }
+        }
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        if (this.rendered) {
+            for (var i=0; i < this.thumbs.length; i++) {
+                this.moveThumb(i, this.translateValue(this.thumbs[i].value));
+            }
+        }
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @param {Number} index The index of the thumb to return a value for
+     * @return {Number} The current value of the slider
+     */
+    getValue : function(index) {
+        return this.thumbs[index].value;
+    },
+
+    /**
+     * Returns an array of values - one for the location of each thumb
+     * @return {Array} The set of thumb values
+     */
+    getValues: function() {
+        var values = [];
+
+        for (var i=0; i < this.thumbs.length; i++) {
+            values.push(this.thumbs[i].value);
+        }
+
+        return values;
+    },
+
+    // private
+    beforeDestroy : function(){
+        var thumbs = this.thumbs;
+        for(var i = 0, len = thumbs.length; i < len; ++i){
+            thumbs[i].destroy();
+            thumbs[i] = null;
+        }
+        Ext.destroyMembers(this, 'endEl', 'innerEl', 'focusEl', 'thumbHolder');
+        Ext.slider.MultiSlider.superclass.beforeDestroy.call(this);
+    }
+});
+
+Ext.reg('multislider', Ext.slider.MultiSlider);
+
+/**
+ * @class Ext.slider.SingleSlider
+ * @extends Ext.slider.MultiSlider
+ * Slider which supports vertical or horizontal orientation, keyboard adjustments,
+ * configurable snapping, axis clicking and animation. Can be added as an item to
+ * any container. Example usage:
+<pre><code>
+new Ext.slider.SingleSlider({
+    renderTo: Ext.getBody(),
+    width: 200,
+    value: 50,
+    increment: 10,
+    minValue: 0,
+    maxValue: 100
+});
+</code></pre>
+ * The class Ext.slider.SingleSlider is aliased to Ext.Slider for backwards compatibility.
+ */
+Ext.slider.SingleSlider = Ext.extend(Ext.slider.MultiSlider, {
+    constructor: function(config) {
+      config = config || {};
+
+      Ext.applyIf(config, {
+          values: [config.value || 0]
+      });
+
+      Ext.slider.SingleSlider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns the current value of the slider
+     * @return {Number} The current value of the slider
+     */
+    getValue: function() {
+        //just returns the value of the first thumb, which should be the only one in a single slider
+        return Ext.slider.SingleSlider.superclass.getValue.call(this, 0);
+    },
+
+    /**
+     * Programmatically sets the value of the Slider. Ensures that the value is constrained within
+     * the minValue and maxValue.
+     * @param {Number} value The value to set the slider to. (This will be constrained within minValue and maxValue)
+     * @param {Boolean} animate Turn on or off animation, defaults to true
+     */
+    setValue: function(value, animate) {
+        var args = Ext.toArray(arguments),
+            len  = args.length;
+
+        //this is to maintain backwards compatiblity for sliders with only one thunb. Usually you must pass the thumb
+        //index to setValue, but if we only have one thumb we inject the index here first if given the multi-slider
+        //signature without the required index. The index will always be 0 for a single slider
+        if (len == 1 || (len <= 3 && typeof arguments[1] != 'number')) {
+            args.unshift(0);
+        }
+
+        return Ext.slider.SingleSlider.superclass.setValue.apply(this, args);
+    },
+
+    /**
+     * Synchronizes the thumb position to the proper proportion of the total component width based
+     * on the current slider {@link #value}.  This will be called automatically when the Slider
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the Slider if necessary.
+     */
+    syncThumb : function() {
+        return Ext.slider.SingleSlider.superclass.syncThumb.apply(this, [0].concat(arguments));
+    },
+    
+    // private
+    getNearest : function(){
+        // Since there's only 1 thumb, it's always the nearest
+        return this.thumbs[0];    
+    }
+});
+
+//backwards compatibility
+Ext.Slider = Ext.slider.SingleSlider;
+
+Ext.reg('slider', Ext.slider.SingleSlider);
+
+// private class to support vertical sliders
+Ext.slider.Vertical = {
+    onResize : function(w, h){
+        this.innerEl.setHeight(h - (this.el.getPadding('t') + this.endEl.getPadding('b')));
+        this.syncThumb();
+    },
+
+    getRatio : function(){
+        var h = this.innerEl.getHeight(),
+            v = this.maxValue - this.minValue;
+        return h/v;
+    },
+
+    moveThumb: function(index, v, animate) {
+        var thumb = this.thumbs[index],
+            el    = thumb.el;
+
+        if (!animate || this.animate === false) {
+            el.setBottom(v);
+        } else {
+            el.shift({bottom: v, stopFx: true, duration:.35});
+        }
+    },
+
+    onClickChange : function(local) {
+        if (local.left > this.clickRange[0] && local.left < this.clickRange[1]) {
+            var thumb = this.getNearest(local, 'top'),
+                index = thumb.index,
+                value = this.minValue + this.reverseValue(this.innerEl.getHeight() - local.top);
+
+            this.setValue(index, Ext.util.Format.round(value, this.decimalPrecision), undefined, true);
+        }
+    }
+};
+
+//private class to support vertical dragging of thumbs within a slider
+Ext.slider.Thumb.Vertical = {
+    getNewValue: function() {
+        var slider   = this.slider,
+            innerEl  = slider.innerEl,
+            pos      = innerEl.translatePoints(this.tracker.getXY()),
+            bottom   = innerEl.getHeight() - pos.top;
+
+        return slider.minValue + Ext.util.Format.round(bottom / slider.getRatio(), slider.decimalPrecision);
+    }
+};
+/**
+ * @class Ext.ProgressBar
+ * @extends Ext.BoxComponent
+ * <p>An updateable progress bar component.  The progress bar supports two different modes: manual and automatic.</p>
+ * <p>In manual mode, you are responsible for showing, updating (via {@link #updateProgress}) and clearing the
+ * progress bar as needed from your own code.  This method is most appropriate when you want to show progress
+ * throughout an operation that has predictable points of interest at which you can update the control.</p>
+ * <p>In automatic mode, you simply call {@link #wait} and let the progress bar run indefinitely, only clearing it
+ * once the operation is complete.  You can optionally have the progress bar wait for a specific amount of time
+ * and then clear itself.  Automatic mode is most appropriate for timed operations or asynchronous operations in
+ * which you have no need for indicating intermediate progress.</p>
+ * @cfg {Float} value A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+ * @cfg {String} text The progress bar text (defaults to '')
+ * @cfg {Mixed} textEl The element to render the progress text to (defaults to the progress
+ * bar's internal text element)
+ * @cfg {String} id The progress bar element's id (defaults to an auto-generated id)
+ * @xtype progress
+ */
+Ext.ProgressBar = Ext.extend(Ext.BoxComponent, {
+   /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to the progress bar's wrapper element (defaults to 'x-progress')
+    */
+    baseCls : 'x-progress',
+    
+    /**
+    * @cfg {Boolean} animate
+    * True to animate the progress bar during transitions (defaults to false)
+    */
+    animate : false,
+
+    // private
+    waitTimer : null,
+
+    // private
+    initComponent : function(){
+        Ext.ProgressBar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event update
+             * Fires after each update interval
+             * @param {Ext.ProgressBar} this
+             * @param {Number} The current progress value
+             * @param {String} The current progress text
+             */
+            "update"
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        var tpl = new Ext.Template(
+            '<div class="{cls}-wrap">',
+                '<div class="{cls}-inner">',
+                    '<div class="{cls}-bar">',
+                        '<div class="{cls}-text">',
+                            '<div>&#160;</div>',
+                        '</div>',
+                    '</div>',
+                    '<div class="{cls}-text {cls}-text-back">',
+                        '<div>&#160;</div>',
+                    '</div>',
+                '</div>',
+            '</div>'
+        );
+
+        this.el = position ? tpl.insertBefore(position, {cls: this.baseCls}, true)
+            : tpl.append(ct, {cls: this.baseCls}, true);
+                
+        if(this.id){
+            this.el.dom.id = this.id;
+        }
+        var inner = this.el.dom.firstChild;
+        this.progressBar = Ext.get(inner.firstChild);
+
+        if(this.textEl){
+            //use an external text el
+            this.textEl = Ext.get(this.textEl);
+            delete this.textTopEl;
+        }else{
+            //setup our internal layered text els
+            this.textTopEl = Ext.get(this.progressBar.dom.firstChild);
+            var textBackEl = Ext.get(inner.childNodes[1]);
+            this.textTopEl.setStyle("z-index", 99).addClass('x-hidden');
+            this.textEl = new Ext.CompositeElement([this.textTopEl.dom.firstChild, textBackEl.dom.firstChild]);
+            this.textEl.setWidth(inner.offsetWidth);
+        }
+        this.progressBar.setHeight(inner.offsetHeight);
+    },
+    
+    // private
+    afterRender : function(){
+        Ext.ProgressBar.superclass.afterRender.call(this);
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }else{
+            this.updateText(this.text);
+        }
+    },
+
+    /**
+     * Updates the progress bar value, and optionally its text.  If the text argument is not specified,
+     * any existing text value will be unchanged.  To blank out existing text, pass ''.  Note that even
+     * if the progress bar value exceeds 1, it will never automatically reset -- you are responsible for
+     * determining when the progress is complete and calling {@link #reset} to clear and/or hide the control.
+     * @param {Float} value (optional) A floating point value between 0 and 1 (e.g., .5, defaults to 0)
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @param {Boolean} animate (optional) Whether to animate the transition of the progress bar. If this value is
+     * not specified, the default for the class is used (default to false)
+     * @return {Ext.ProgressBar} this
+     */
+    updateProgress : function(value, text, animate){
+        this.value = value || 0;
+        if(text){
+            this.updateText(text);
+        }
+        if(this.rendered && !this.isDestroyed){
+            var w = Math.floor(value*this.el.dom.firstChild.offsetWidth);
+            this.progressBar.setWidth(w, animate === true || (animate !== false && this.animate));
+            if(this.textTopEl){
+                //textTopEl should be the same width as the bar so overflow will clip as the bar moves
+                this.textTopEl.removeClass('x-hidden').setWidth(w);
+            }
+        }
+        this.fireEvent('update', this, value, text);
+        return this;
+    },
+
+    /**
+     * Initiates an auto-updating progress bar.  A duration can be specified, in which case the progress
+     * bar will automatically reset after a fixed amount of time and optionally call a callback function
+     * if specified.  If no duration is passed in, then the progress bar will run indefinitely and must
+     * be manually cleared by calling {@link #reset}.  The wait method accepts a config object with
+     * the following properties:
+     * <pre>
+Property   Type          Description
+---------- ------------  ----------------------------------------------------------------------
+duration   Number        The length of time in milliseconds that the progress bar should
+                         run before resetting itself (defaults to undefined, in which case it
+                         will run indefinitely until reset is called)
+interval   Number        The length of time in milliseconds between each progress update
+                         (defaults to 1000 ms)
+animate    Boolean       Whether to animate the transition of the progress bar. If this value is
+                         not specified, the default for the class is used.                                                   
+increment  Number        The number of progress update segments to display within the progress
+                         bar (defaults to 10).  If the bar reaches the end and is still
+                         updating, it will automatically wrap back to the beginning.
+text       String        Optional text to display in the progress bar element (defaults to '').
+fn         Function      A callback function to execute after the progress bar finishes auto-
+                         updating.  The function will be called with no arguments.  This function
+                         will be ignored if duration is not specified since in that case the
+                         progress bar can only be stopped programmatically, so any required function
+                         should be called by the same code after it resets the progress bar.
+scope      Object        The scope that is passed to the callback function (only applies when
+                         duration and fn are both passed).
+</pre>
+         *
+         * Example usage:
+         * <pre><code>
+var p = new Ext.ProgressBar({
+   renderTo: 'my-el'
+});
+
+//Wait for 5 seconds, then update the status el (progress bar will auto-reset)
+p.wait({
+   interval: 100, //bar will move fast!
+   duration: 5000,
+   increment: 15,
+   text: 'Updating...',
+   scope: this,
+   fn: function(){
+      Ext.fly('status').update('Done!');
+   }
+});
+
+//Or update indefinitely until some async action completes, then reset manually
+p.wait();
+myAction.on('complete', function(){
+    p.reset();
+    Ext.fly('status').update('Done!');
+});
+</code></pre>
+     * @param {Object} config (optional) Configuration options
+     * @return {Ext.ProgressBar} this
+     */
+    wait : function(o){
+        if(!this.waitTimer){
+            var scope = this;
+            o = o || {};
+            this.updateText(o.text);
+            this.waitTimer = Ext.TaskMgr.start({
+                run: function(i){
+                    var inc = o.increment || 10;
+                    i -= 1;
+                    this.updateProgress(((((i+inc)%inc)+1)*(100/inc))*0.01, null, o.animate);
+                },
+                interval: o.interval || 1000,
+                duration: o.duration,
+                onStop: function(){
+                    if(o.fn){
+                        o.fn.apply(o.scope || this);
+                    }
+                    this.reset();
+                },
+                scope: scope
+            });
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the progress bar is currently in a {@link #wait} operation
+     * @return {Boolean} True if waiting, else false
+     */
+    isWaiting : function(){
+        return this.waitTimer !== null;
+    },
+
+    /**
+     * Updates the progress bar text.  If specified, textEl will be updated, otherwise the progress
+     * bar itself will display the updated text.
+     * @param {String} text (optional) The string to display in the progress text element (defaults to '')
+     * @return {Ext.ProgressBar} this
+     */
+    updateText : function(text){
+        this.text = text || '&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+        }
+        return this;
+    },
+    
+    /**
+     * Synchronizes the inner bar width to the proper proportion of the total componet width based
+     * on the current progress {@link #value}.  This will be called automatically when the ProgressBar
+     * is resized by a layout, but if it is rendered auto width, this method can be called from
+     * another resize handler to sync the ProgressBar if necessary.
+     */
+    syncProgressBar : function(){
+        if(this.value){
+            this.updateProgress(this.value, this.text);
+        }
+        return this;
+    },
+
+    /**
+     * Sets the size of the progress bar.
+     * @param {Number} width The new width in pixels
+     * @param {Number} height The new height in pixels
+     * @return {Ext.ProgressBar} this
+     */
+    setSize : function(w, h){
+        Ext.ProgressBar.superclass.setSize.call(this, w, h);
+        if(this.textTopEl){
+            var inner = this.el.dom.firstChild;
+            this.textEl.setSize(inner.offsetWidth, inner.offsetHeight);
+        }
+        this.syncProgressBar();
+        return this;
+    },
+
+    /**
+     * Resets the progress bar value to 0 and text to empty string.  If hide = true, the progress
+     * bar will also be hidden (using the {@link #hideMode} property internally).
+     * @param {Boolean} hide (optional) True to hide the progress bar (defaults to false)
+     * @return {Ext.ProgressBar} this
+     */
+    reset : function(hide){
+        this.updateProgress(0);
+        if(this.textTopEl){
+            this.textTopEl.addClass('x-hidden');
+        }
+        this.clearTimer();
+        if(hide === true){
+            this.hide();
+        }
+        return this;
+    },
+    
+    // private
+    clearTimer : function(){
+        if(this.waitTimer){
+            this.waitTimer.onStop = null; //prevent recursion
+            Ext.TaskMgr.stop(this.waitTimer);
+            this.waitTimer = null;
+        }
+    },
+    
+    onDestroy: function(){
+        this.clearTimer();
+        if(this.rendered){
+            if(this.textEl.isComposite){
+                this.textEl.clear();
+            }
+            Ext.destroyMembers(this, 'textEl', 'progressBar', 'textTopEl');
+        }
+        Ext.ProgressBar.superclass.onDestroy.call(this);
+    }
+});
+Ext.reg('progress', Ext.ProgressBar);/*
+ * These classes are derivatives of the similarly named classes in the YUI Library.
+ * The original license:
+ * Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+ * Code licensed under the BSD License:
+ * http://developer.yahoo.net/yui/license.txt
+ */
+
+(function() {
+
+var Event=Ext.EventManager;
+var Dom=Ext.lib.Dom;
+
+/**
+ * @class Ext.dd.DragDrop
+ * Defines the interface and base operation of items that that can be
+ * dragged or can be drop targets.  It was designed to be extended, overriding
+ * the event handlers for startDrag, onDrag, onDragOver and onDragOut.
+ * Up to three html elements can be associated with a DragDrop instance:
+ * <ul>
+ * <li>linked element: the element that is passed into the constructor.
+ * This is the element which defines the boundaries for interaction with
+ * other DragDrop objects.</li>
+ * <li>handle element(s): The drag operation only occurs if the element that
+ * was clicked matches a handle element.  By default this is the linked
+ * element, but there are times that you will want only a portion of the
+ * linked element to initiate the drag operation, and the setHandleElId()
+ * method provides a way to define this.</li>
+ * <li>drag element: this represents the element that would be moved along
+ * with the cursor during a drag operation.  By default, this is the linked
+ * element itself as in {@link Ext.dd.DD}.  setDragElId() lets you define
+ * a separate element that would be moved, as in {@link Ext.dd.DDProxy}.
+ * </li>
+ * </ul>
+ * This class should not be instantiated until the onload event to ensure that
+ * the associated elements are available.
+ * The following would define a DragDrop obj that would interact with any
+ * other DragDrop obj in the "group1" group:
+ * <pre>
+ *  dd = new Ext.dd.DragDrop("div1", "group1");
+ * </pre>
+ * Since none of the event handlers have been implemented, nothing would
+ * actually happen if you were to run the code above.  Normally you would
+ * override this class or one of the default implementations, but you can
+ * also override the methods you want on an instance of the class...
+ * <pre>
+ *  dd.onDragDrop = function(e, id) {
+ *  &nbsp;&nbsp;alert("dd was dropped on " + id);
+ *  }
+ * </pre>
+ * @constructor
+ * @param {String} id of the element that is linked to this instance
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DragDrop:
+ *                    padding, isTarget, maintainOffset, primaryButtonOnly
+ */
+Ext.dd.DragDrop = function(id, sGroup, config) {
+    if(id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.dd.DragDrop.prototype = {
+
+    /**
+     * Set to false to enable a DragDrop object to fire drag events while dragging
+     * over its own Element. Defaults to true - DragDrop objects do not by default
+     * fire drag events to themselves.
+     * @property ignoreSelf
+     * @type Boolean
+     */
+
+    /**
+     * The id of the element associated with this object.  This is what we
+     * refer to as the "linked element" because the size and position of
+     * this element is used to determine when the drag and drop objects have
+     * interacted.
+     * @property id
+     * @type String
+     */
+    id: null,
+
+    /**
+     * Configuration attributes passed into the constructor
+     * @property config
+     * @type object
+     */
+    config: null,
+
+    /**
+     * The id of the element that will be dragged.  By default this is same
+     * as the linked element, but could be changed to another element. Ex:
+     * Ext.dd.DDProxy
+     * @property dragElId
+     * @type String
+     * @private
+     */
+    dragElId: null,
+
+    /**
+     * The ID of the element that initiates the drag operation.  By default
+     * this is the linked element, but could be changed to be a child of this
+     * element.  This lets us do things like only starting the drag when the
+     * header element within the linked html element is clicked.
+     * @property handleElId
+     * @type String
+     * @private
+     */
+    handleElId: null,
+
+    /**
+     * An object who's property names identify HTML tags to be considered invalid as drag handles.
+     * A non-null property value identifies the tag as invalid. Defaults to the 
+     * following value which prevents drag operations from being initiated by &lt;a> elements:<pre><code>
+{
+    A: "A"
+}</code></pre>
+     * @property invalidHandleTypes
+     * @type Object
+     */
+    invalidHandleTypes: null,
+
+    /**
+     * An object who's property names identify the IDs of elements to be considered invalid as drag handles.
+     * A non-null property value identifies the ID as invalid. For example, to prevent
+     * dragging from being initiated on element ID "foo", use:<pre><code>
+{
+    foo: true
+}</code></pre>
+     * @property invalidHandleIds
+     * @type Object
+     */
+    invalidHandleIds: null,
+
+    /**
+     * An Array of CSS class names for elements to be considered in valid as drag handles.
+     * @property invalidHandleClasses
+     * @type Array
+     */
+    invalidHandleClasses: null,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageX
+     * @type int
+     * @private
+     */
+    startPageX: 0,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageY
+     * @type int
+     * @private
+     */
+    startPageY: 0,
+
+    /**
+     * The group defines a logical collection of DragDrop objects that are
+     * related.  Instances only get events when interacting with other
+     * DragDrop object in the same group.  This lets us define multiple
+     * groups using a single DragDrop subclass if we want.
+     * @property groups
+     * @type object An object in the format {'group1':true, 'group2':true}
+     */
+    groups: null,
+
+    /**
+     * Individual drag/drop instances can be locked.  This will prevent
+     * onmousedown start drag.
+     * @property locked
+     * @type boolean
+     * @private
+     */
+    locked: false,
+
+    /**
+     * Lock this instance
+     * @method lock
+     */
+    lock: function() {
+        this.locked = true;
+    },
+
+    /**
+     * When set to true, other DD objects in cooperating DDGroups do not receive
+     * notification events when this DD object is dragged over them. Defaults to false.
+     * @property moveOnly
+     * @type boolean
+     */
+    moveOnly: false,
+
+    /**
+     * Unlock this instace
+     * @method unlock
+     */
+    unlock: function() {
+        this.locked = false;
+    },
+
+    /**
+     * By default, all instances can be a drop target.  This can be disabled by
+     * setting isTarget to false.
+     * @property isTarget
+     * @type boolean
+     */
+    isTarget: true,
+
+    /**
+     * The padding configured for this drag and drop object for calculating
+     * the drop zone intersection with this object.
+     * @property padding
+     * @type int[] An array containing the 4 padding values: [top, right, bottom, left]
+     */
+    padding: null,
+
+    /**
+     * Cached reference to the linked element
+     * @property _domRef
+     * @private
+     */
+    _domRef: null,
+
+    /**
+     * Internal typeof flag
+     * @property __ygDragDrop
+     * @private
+     */
+    __ygDragDrop: true,
+
+    /**
+     * Set to true when horizontal contraints are applied
+     * @property constrainX
+     * @type boolean
+     * @private
+     */
+    constrainX: false,
+
+    /**
+     * Set to true when vertical contraints are applied
+     * @property constrainY
+     * @type boolean
+     * @private
+     */
+    constrainY: false,
+
+    /**
+     * The left constraint
+     * @property minX
+     * @type int
+     * @private
+     */
+    minX: 0,
+
+    /**
+     * The right constraint
+     * @property maxX
+     * @type int
+     * @private
+     */
+    maxX: 0,
+
+    /**
+     * The up constraint
+     * @property minY
+     * @type int
+     * @private
+     */
+    minY: 0,
+
+    /**
+     * The down constraint
+     * @property maxY
+     * @type int
+     * @private
+     */
+    maxY: 0,
+
+    /**
+     * Maintain offsets when we resetconstraints.  Set to true when you want
+     * the position of the element relative to its parent to stay the same
+     * when the page changes
+     *
+     * @property maintainOffset
+     * @type boolean
+     */
+    maintainOffset: false,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * horizontal graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property xTicks
+     * @type int[]
+     */
+    xTicks: null,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * vertical graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property yTicks
+     * @type int[]
+     */
+    yTicks: null,
+
+    /**
+     * By default the drag and drop instance will only respond to the primary
+     * button click (left button for a right-handed mouse).  Set to true to
+     * allow drag and drop to start with any mouse click that is propogated
+     * by the browser
+     * @property primaryButtonOnly
+     * @type boolean
+     */
+    primaryButtonOnly: true,
+
+    /**
+     * The available property is false until the linked dom element is accessible.
+     * @property available
+     * @type boolean
+     */
+    available: false,
+
+    /**
+     * By default, drags can only be initiated if the mousedown occurs in the
+     * region the linked element is.  This is done in part to work around a
+     * bug in some browsers that mis-report the mousedown if the previous
+     * mouseup happened outside of the window.  This property is set to true
+     * if outer handles are defined.
+     *
+     * @property hasOuterHandles
+     * @type boolean
+     * @default false
+     */
+    hasOuterHandles: false,
+
+    /**
+     * Code that executes immediately before the startDrag event
+     * @method b4StartDrag
+     * @private
+     */
+    b4StartDrag: function(x, y) { },
+
+    /**
+     * Abstract method called after a drag/drop object is clicked
+     * and the drag or mousedown time thresholds have beeen met.
+     * @method startDrag
+     * @param {int} X click location
+     * @param {int} Y click location
+     */
+    startDrag: function(x, y) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDrag event
+     * @method b4Drag
+     * @private
+     */
+    b4Drag: function(e) { },
+
+    /**
+     * Abstract method called during the onMouseMove event while dragging an
+     * object.
+     * @method onDrag
+     * @param {Event} e the mousemove event
+     */
+    onDrag: function(e) { /* override this */ },
+
+    /**
+     * Abstract method called when this element fist begins hovering over
+     * another DragDrop obj
+     * @method onDragEnter
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of one or more
+     * dragdrop items being hovered over.
+     */
+    onDragEnter: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOver event
+     * @method b4DragOver
+     * @private
+     */
+    b4DragOver: function(e) { },
+
+    /**
+     * Abstract method called when this element is hovering over another
+     * DragDrop obj
+     * @method onDragOver
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of dd items
+     * being hovered over.
+     */
+    onDragOver: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOut event
+     * @method b4DragOut
+     * @private
+     */
+    b4DragOut: function(e) { },
+
+    /**
+     * Abstract method called when we are no longer hovering over an element
+     * @method onDragOut
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was hovering over.  In INTERSECT mode, an array of dd items
+     * that the mouse is no longer over.
+     */
+    onDragOut: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragDrop event
+     * @method b4DragDrop
+     * @private
+     */
+    b4DragDrop: function(e) { },
+
+    /**
+     * Abstract method called when this item is dropped on another DragDrop
+     * obj
+     * @method onDragDrop
+     * @param {Event} e the mouseup event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was dropped on.  In INTERSECT mode, an array of dd items this
+     * was dropped on.
+     */
+    onDragDrop: function(e, id) { /* override this */ },
+
+    /**
+     * Abstract method called when this item is dropped on an area with no
+     * drop target
+     * @method onInvalidDrop
+     * @param {Event} e the mouseup event
+     */
+    onInvalidDrop: function(e) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the endDrag event
+     * @method b4EndDrag
+     * @private
+     */
+    b4EndDrag: function(e) { },
+
+    /**
+     * Fired when we are done dragging the object
+     * @method endDrag
+     * @param {Event} e the mouseup event
+     */
+    endDrag: function(e) { /* override this */ },
+
+    /**
+     * Code executed immediately before the onMouseDown event
+     * @method b4MouseDown
+     * @param {Event} e the mousedown event
+     * @private
+     */
+    b4MouseDown: function(e) {  },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mousedown
+     * @method onMouseDown
+     * @param {Event} e the mousedown event
+     */
+    onMouseDown: function(e) { /* override this */ },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mouseup
+     * @method onMouseUp
+     * @param {Event} e the mouseup event
+     */
+    onMouseUp: function(e) { /* override this */ },
+
+    /**
+     * Override the onAvailable method to do what is needed after the initial
+     * position was determined.
+     * @method onAvailable
+     */
+    onAvailable: function () {
+    },
+
+    /**
+     * Provides default constraint padding to "constrainTo" elements (defaults to {left: 0, right:0, top:0, bottom:0}).
+     * @type Object
+     */
+    defaultPadding : {left:0, right:0, top:0, bottom:0},
+
+    /**
+     * Initializes the drag drop object's constraints to restrict movement to a certain element.
+ *
+ * Usage:
+ <pre><code>
+ var dd = new Ext.dd.DDProxy("dragDiv1", "proxytest",
+                { dragElId: "existingProxyDiv" });
+ dd.startDrag = function(){
+     this.constrainTo("parent-id");
+ };
+ </code></pre>
+ * Or you can initalize it using the {@link Ext.Element} object:
+ <pre><code>
+ Ext.get("dragDiv1").initDDProxy("proxytest", {dragElId: "existingProxyDiv"}, {
+     startDrag : function(){
+         this.constrainTo("parent-id");
+     }
+ });
+ </code></pre>
+     * @param {Mixed} constrainTo The element to constrain to.
+     * @param {Object/Number} pad (optional) Pad provides a way to specify "padding" of the constraints,
+     * and can be either a number for symmetrical padding (4 would be equal to {left:4, right:4, top:4, bottom:4}) or
+     * an object containing the sides to pad. For example: {right:10, bottom:10}
+     * @param {Boolean} inContent (optional) Constrain the draggable in the content box of the element (inside padding and borders)
+     */
+    constrainTo : function(constrainTo, pad, inContent){
+        if(Ext.isNumber(pad)){
+            pad = {left: pad, right:pad, top:pad, bottom:pad};
+        }
+        pad = pad || this.defaultPadding;
+        var b = Ext.get(this.getEl()).getBox(),
+            ce = Ext.get(constrainTo),
+            s = ce.getScroll(),
+            c, 
+            cd = ce.dom;
+        if(cd == document.body){
+            c = { x: s.left, y: s.top, width: Ext.lib.Dom.getViewWidth(), height: Ext.lib.Dom.getViewHeight()};
+        }else{
+            var xy = ce.getXY();
+            c = {x : xy[0], y: xy[1], width: cd.clientWidth, height: cd.clientHeight};
+        }
+
+
+        var topSpace = b.y - c.y,
+            leftSpace = b.x - c.x;
+
+        this.resetConstraints();
+        this.setXConstraint(leftSpace - (pad.left||0), // left
+                c.width - leftSpace - b.width - (pad.right||0), //right
+				this.xTickSize
+        );
+        this.setYConstraint(topSpace - (pad.top||0), //top
+                c.height - topSpace - b.height - (pad.bottom||0), //bottom
+				this.yTickSize
+        );
+    },
+
+    /**
+     * Returns a reference to the linked element
+     * @method getEl
+     * @return {HTMLElement} the html element
+     */
+    getEl: function() {
+        if (!this._domRef) {
+            this._domRef = Ext.getDom(this.id);
+        }
+
+        return this._domRef;
+    },
+
+    /**
+     * Returns a reference to the actual element to drag.  By default this is
+     * the same as the html element, but it can be assigned to another
+     * element. An example of this can be found in Ext.dd.DDProxy
+     * @method getDragEl
+     * @return {HTMLElement} the html element
+     */
+    getDragEl: function() {
+        return Ext.getDom(this.dragElId);
+    },
+
+    /**
+     * Sets up the DragDrop object.  Must be called in the constructor of any
+     * Ext.dd.DragDrop subclass
+     * @method init
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    init: function(id, sGroup, config) {
+        this.initTarget(id, sGroup, config);
+        Event.on(this.id, "mousedown", this.handleMouseDown, this);
+        // Event.on(this.id, "selectstart", Event.preventDefault);
+    },
+
+    /**
+     * Initializes Targeting functionality only... the object does not
+     * get a mousedown handler.
+     * @method initTarget
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    initTarget: function(id, sGroup, config) {
+
+        // configuration attributes
+        this.config = config || {};
+
+        // create a local reference to the drag and drop manager
+        this.DDM = Ext.dd.DDM;
+        // initialize the groups array
+        this.groups = {};
+
+        // assume that we have an element reference instead of an id if the
+        // parameter is not a string
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+
+        // set the id
+        this.id = id;
+
+        // add to an interaction group
+        this.addToGroup((sGroup) ? sGroup : "default");
+
+        // We don't want to register this as the handle with the manager
+        // so we just set the id rather than calling the setter.
+        this.handleElId = id;
+
+        // the linked element is the element that gets dragged by default
+        this.setDragElId(id);
+
+        // by default, clicked anchors will not start drag operations.
+        this.invalidHandleTypes = { A: "A" };
+        this.invalidHandleIds = {};
+        this.invalidHandleClasses = [];
+
+        this.applyConfig();
+
+        this.handleOnAvailable();
+    },
+
+    /**
+     * Applies the configuration parameters that were passed into the constructor.
+     * This is supposed to happen at each level through the inheritance chain.  So
+     * a DDProxy implentation will execute apply config on DDProxy, DD, and
+     * DragDrop in order to get all of the parameters that are available in
+     * each object.
+     * @method applyConfig
+     */
+    applyConfig: function() {
+
+        // configurable properties:
+        //    padding, isTarget, maintainOffset, primaryButtonOnly
+        this.padding           = this.config.padding || [0, 0, 0, 0];
+        this.isTarget          = (this.config.isTarget !== false);
+        this.maintainOffset    = (this.config.maintainOffset);
+        this.primaryButtonOnly = (this.config.primaryButtonOnly !== false);
+
+    },
+
+    /**
+     * Executed when the linked element is available
+     * @method handleOnAvailable
+     * @private
+     */
+    handleOnAvailable: function() {
+        this.available = true;
+        this.resetConstraints();
+        this.onAvailable();
+    },
+
+     /**
+     * Configures the padding for the target zone in px.  Effectively expands
+     * (or reduces) the virtual object size for targeting calculations.
+     * Supports css-style shorthand; if only one parameter is passed, all sides
+     * will have that padding, and if only two are passed, the top and bottom
+     * will have the first param, the left and right the second.
+     * @method setPadding
+     * @param {int} iTop    Top pad
+     * @param {int} iRight  Right pad
+     * @param {int} iBot    Bot pad
+     * @param {int} iLeft   Left pad
+     */
+    setPadding: function(iTop, iRight, iBot, iLeft) {
+        // this.padding = [iLeft, iRight, iTop, iBot];
+        if (!iRight && 0 !== iRight) {
+            this.padding = [iTop, iTop, iTop, iTop];
+        } else if (!iBot && 0 !== iBot) {
+            this.padding = [iTop, iRight, iTop, iRight];
+        } else {
+            this.padding = [iTop, iRight, iBot, iLeft];
+        }
+    },
+
+    /**
+     * Stores the initial placement of the linked element.
+     * @method setInitPosition
+     * @param {int} diffX   the X offset, default 0
+     * @param {int} diffY   the Y offset, default 0
+     */
+    setInitPosition: function(diffX, diffY) {
+        var el = this.getEl();
+
+        if (!this.DDM.verifyEl(el)) {
+            return;
+        }
+
+        var dx = diffX || 0;
+        var dy = diffY || 0;
+
+        var p = Dom.getXY( el );
+
+        this.initPageX = p[0] - dx;
+        this.initPageY = p[1] - dy;
+
+        this.lastPageX = p[0];
+        this.lastPageY = p[1];
+
+        this.setStartPosition(p);
+    },
+
+    /**
+     * Sets the start position of the element.  This is set when the obj
+     * is initialized, the reset when a drag is started.
+     * @method setStartPosition
+     * @param pos current position (from previous lookup)
+     * @private
+     */
+    setStartPosition: function(pos) {
+        var p = pos || Dom.getXY( this.getEl() );
+        this.deltaSetXY = null;
+
+        this.startPageX = p[0];
+        this.startPageY = p[1];
+    },
+
+    /**
+     * Add this instance to a group of related drag/drop objects.  All
+     * instances belong to at least one group, and can belong to as many
+     * groups as needed.
+     * @method addToGroup
+     * @param sGroup {string} the name of the group
+     */
+    addToGroup: function(sGroup) {
+        this.groups[sGroup] = true;
+        this.DDM.regDragDrop(this, sGroup);
+    },
+
+    /**
+     * Remove's this instance from the supplied interaction group
+     * @method removeFromGroup
+     * @param {string}  sGroup  The group to drop
+     */
+    removeFromGroup: function(sGroup) {
+        if (this.groups[sGroup]) {
+            delete this.groups[sGroup];
+        }
+
+        this.DDM.removeDDFromGroup(this, sGroup);
+    },
+
+    /**
+     * Allows you to specify that an element other than the linked element
+     * will be moved with the cursor during a drag
+     * @method setDragElId
+     * @param id {string} the id of the element that will be used to initiate the drag
+     */
+    setDragElId: function(id) {
+        this.dragElId = id;
+    },
+
+    /**
+     * Allows you to specify a child of the linked element that should be
+     * used to initiate the drag operation.  An example of this would be if
+     * you have a content div with text and links.  Clicking anywhere in the
+     * content area would normally start the drag operation.  Use this method
+     * to specify that an element inside of the content div is the element
+     * that starts the drag operation.
+     * @method setHandleElId
+     * @param id {string} the id of the element that will be used to
+     * initiate the drag.
+     */
+    setHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.handleElId = id;
+        this.DDM.regHandle(this.id, id);
+    },
+
+    /**
+     * Allows you to set an element outside of the linked element as a drag
+     * handle
+     * @method setOuterHandleElId
+     * @param id the id of the element that will be used to initiate the drag
+     */
+    setOuterHandleElId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        Event.on(id, "mousedown",
+                this.handleMouseDown, this);
+        this.setHandleElId(id);
+
+        this.hasOuterHandles = true;
+    },
+
+    /**
+     * Remove all drag and drop hooks for this element
+     * @method unreg
+     */
+    unreg: function() {
+        Event.un(this.id, "mousedown",
+                this.handleMouseDown);
+        this._domRef = null;
+        this.DDM._remove(this);
+    },
+
+    destroy : function(){
+        this.unreg();
+    },
+
+    /**
+     * Returns true if this instance is locked, or the drag drop mgr is locked
+     * (meaning that all drag/drop is disabled on the page.)
+     * @method isLocked
+     * @return {boolean} true if this obj or all drag/drop is locked, else
+     * false
+     */
+    isLocked: function() {
+        return (this.DDM.isLocked() || this.locked);
+    },
+
+    /**
+     * Fired when this object is clicked
+     * @method handleMouseDown
+     * @param {Event} e
+     * @param {Ext.dd.DragDrop} oDD the clicked dd object (this dd obj)
+     * @private
+     */
+    handleMouseDown: function(e, oDD){
+        if (this.primaryButtonOnly && e.button != 0) {
+            return;
+        }
+
+        if (this.isLocked()) {
+            return;
+        }
+
+        this.DDM.refreshCache(this.groups);
+
+        var pt = new Ext.lib.Point(Ext.lib.Event.getPageX(e), Ext.lib.Event.getPageY(e));
+        if (!this.hasOuterHandles && !this.DDM.isOverTarget(pt, this) )  {
+        } else {
+            if (this.clickValidator(e)) {
+
+                // set the initial element position
+                this.setStartPosition();
+
+                this.b4MouseDown(e);
+                this.onMouseDown(e);
+
+                this.DDM.handleMouseDown(e, this);
+
+                this.DDM.stopEvent(e);
+            } else {
+
+
+            }
+        }
+    },
+
+    clickValidator: function(e) {
+        var target = e.getTarget();
+        return ( this.isValidHandleChild(target) &&
+                    (this.id == this.handleElId ||
+                        this.DDM.handleWasClicked(target, this.id)) );
+    },
+
+    /**
+     * Allows you to specify a tag name that should not start a drag operation
+     * when clicked.  This is designed to facilitate embedding links within a
+     * drag handle that do something other than start the drag.
+     * @method addInvalidHandleType
+     * @param {string} tagName the type of element to exclude
+     */
+    addInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        this.invalidHandleTypes[type] = type;
+    },
+
+    /**
+     * Lets you to specify an element id for a child of a drag handle
+     * that should not initiate a drag
+     * @method addInvalidHandleId
+     * @param {string} id the element id of the element you wish to ignore
+     */
+    addInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        this.invalidHandleIds[id] = id;
+    },
+
+    /**
+     * Lets you specify a css class of elements that will not initiate a drag
+     * @method addInvalidHandleClass
+     * @param {string} cssClass the class of the elements you wish to ignore
+     */
+    addInvalidHandleClass: function(cssClass) {
+        this.invalidHandleClasses.push(cssClass);
+    },
+
+    /**
+     * Unsets an excluded tag name set by addInvalidHandleType
+     * @method removeInvalidHandleType
+     * @param {string} tagName the type of element to unexclude
+     */
+    removeInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        // this.invalidHandleTypes[type] = null;
+        delete this.invalidHandleTypes[type];
+    },
+
+    /**
+     * Unsets an invalid handle id
+     * @method removeInvalidHandleId
+     * @param {string} id the id of the element to re-enable
+     */
+    removeInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            id = Ext.id(id);
+        }
+        delete this.invalidHandleIds[id];
+    },
+
+    /**
+     * Unsets an invalid css class
+     * @method removeInvalidHandleClass
+     * @param {string} cssClass the class of the element(s) you wish to
+     * re-enable
+     */
+    removeInvalidHandleClass: function(cssClass) {
+        for (var i=0, len=this.invalidHandleClasses.length; i<len; ++i) {
+            if (this.invalidHandleClasses[i] == cssClass) {
+                delete this.invalidHandleClasses[i];
+            }
+        }
+    },
+
+    /**
+     * Checks the tag exclusion list to see if this click should be ignored
+     * @method isValidHandleChild
+     * @param {HTMLElement} node the HTMLElement to evaluate
+     * @return {boolean} true if this is a valid tag type, false if not
+     */
+    isValidHandleChild: function(node) {
+
+        var valid = true;
+        // var n = (node.nodeName == "#text") ? node.parentNode : node;
+        var nodeName;
+        try {
+            nodeName = node.nodeName.toUpperCase();
+        } catch(e) {
+            nodeName = node.nodeName;
+        }
+        valid = valid && !this.invalidHandleTypes[nodeName];
+        valid = valid && !this.invalidHandleIds[node.id];
+
+        for (var i=0, len=this.invalidHandleClasses.length; valid && i<len; ++i) {
+            valid = !Ext.fly(node).hasClass(this.invalidHandleClasses[i]);
+        }
+
+
+        return valid;
+
+    },
+
+    /**
+     * Create the array of horizontal tick marks if an interval was specified
+     * in setXConstraint().
+     * @method setXTicks
+     * @private
+     */
+    setXTicks: function(iStartX, iTickSize) {
+        this.xTicks = [];
+        this.xTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.xTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * Create the array of vertical tick marks if an interval was specified in
+     * setYConstraint().
+     * @method setYTicks
+     * @private
+     */
+    setYTicks: function(iStartY, iTickSize) {
+        this.yTicks = [];
+        this.yTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.yTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Use
+     * this method to limit the horizontal travel of the element.  Pass in
+     * 0,0 for the parameters if you want to lock the drag to the y axis.
+     * @method setXConstraint
+     * @param {int} iLeft the number of pixels the element can move to the left
+     * @param {int} iRight the number of pixels the element can move to the
+     * right
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element
+     * should move iTickSize pixels at a time.
+     */
+    setXConstraint: function(iLeft, iRight, iTickSize) {
+        this.leftConstraint = iLeft;
+        this.rightConstraint = iRight;
+
+        this.minX = this.initPageX - iLeft;
+        this.maxX = this.initPageX + iRight;
+        if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); }
+
+        this.constrainX = true;
+    },
+
+    /**
+     * Clears any constraints applied to this instance.  Also clears ticks
+     * since they can't exist independent of a constraint at this time.
+     * @method clearConstraints
+     */
+    clearConstraints: function() {
+        this.constrainX = false;
+        this.constrainY = false;
+        this.clearTicks();
+    },
+
+    /**
+     * Clears any tick interval defined for this instance
+     * @method clearTicks
+     */
+    clearTicks: function() {
+        this.xTicks = null;
+        this.yTicks = null;
+        this.xTickSize = 0;
+        this.yTickSize = 0;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Set
+     * this to limit the vertical travel of the element.  Pass in 0,0 for the
+     * parameters if you want to lock the drag to the x axis.
+     * @method setYConstraint
+     * @param {int} iUp the number of pixels the element can move up
+     * @param {int} iDown the number of pixels the element can move down
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element should move iTickSize pixels at a time.
+     */
+    setYConstraint: function(iUp, iDown, iTickSize) {
+        this.topConstraint = iUp;
+        this.bottomConstraint = iDown;
+
+        this.minY = this.initPageY - iUp;
+        this.maxY = this.initPageY + iDown;
+        if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); }
+
+        this.constrainY = true;
+
+    },
+
+    /**
+     * resetConstraints must be called if you manually reposition a dd element.
+     * @method resetConstraints
+     * @param {boolean} maintainOffset
+     */
+    resetConstraints: function() {
+        // Maintain offsets if necessary
+        if (this.initPageX || this.initPageX === 0) {
+            // figure out how much this thing has moved
+            var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0;
+            var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0;
+
+            this.setInitPosition(dx, dy);
+
+        // This is the first time we have detected the element's position
+        } else {
+            this.setInitPosition();
+        }
+
+        if (this.constrainX) {
+            this.setXConstraint( this.leftConstraint,
+                                 this.rightConstraint,
+                                 this.xTickSize        );
+        }
+
+        if (this.constrainY) {
+            this.setYConstraint( this.topConstraint,
+                                 this.bottomConstraint,
+                                 this.yTickSize         );
+        }
+    },
+
+    /**
+     * Normally the drag element is moved pixel by pixel, but we can specify
+     * that it move a number of pixels at a time.  This method resolves the
+     * location when we have it set up like this.
+     * @method getTick
+     * @param {int} val where we want to place the object
+     * @param {int[]} tickArray sorted array of valid points
+     * @return {int} the closest tick
+     * @private
+     */
+    getTick: function(val, tickArray) {
+        if (!tickArray) {
+            // If tick interval is not defined, it is effectively 1 pixel,
+            // so we return the value passed to us.
+            return val;
+        } else if (tickArray[0] >= val) {
+            // The value is lower than the first tick, so we return the first
+            // tick.
+            return tickArray[0];
+        } else {
+            for (var i=0, len=tickArray.length; i<len; ++i) {
+                var next = i + 1;
+                if (tickArray[next] && tickArray[next] >= val) {
+                    var diff1 = val - tickArray[i];
+                    var diff2 = tickArray[next] - val;
+                    return (diff2 > diff1) ? tickArray[i] : tickArray[next];
+                }
+            }
+
+            // The value is larger than the last tick, so we return the last
+            // tick.
+            return tickArray[tickArray.length - 1];
+        }
+    },
+
+    /**
+     * toString method
+     * @method toString
+     * @return {string} string representation of the dd obj
+     */
+    toString: function() {
+        return ("DragDrop " + this.id);
+    }
+
+};
+
+})();
+/*
+ * The drag and drop utility provides a framework for building drag and drop
+ * applications.  In addition to enabling drag and drop for specific elements,
+ * the drag and drop elements are tracked by the manager class, and the
+ * interactions between the various elements are tracked during the drag and
+ * the implementing code is notified about these important moments.
+ */
+
+// Only load the library once.  Rewriting the manager class would orphan
+// existing drag and drop instances.
+if (!Ext.dd.DragDropMgr) {
+
+/**
+ * @class Ext.dd.DragDropMgr
+ * DragDropMgr is a singleton that tracks the element interaction for
+ * all DragDrop items in the window.  Generally, you will not call
+ * this class directly, but it does have helper methods that could
+ * be useful in your DragDrop implementations.
+ * @singleton
+ */
+Ext.dd.DragDropMgr = function() {
+
+    var Event = Ext.EventManager;
+
+    return {
+
+        /**
+         * Two dimensional Array of registered DragDrop objects.  The first
+         * dimension is the DragDrop item group, the second the DragDrop
+         * object.
+         * @property ids
+         * @type String[]
+         * @private
+         * @static
+         */
+        ids: {},
+
+        /**
+         * Array of element ids defined as drag handles.  Used to determine
+         * if the element that generated the mousedown event is actually the
+         * handle and not the html element itself.
+         * @property handleIds
+         * @type String[]
+         * @private
+         * @static
+         */
+        handleIds: {},
+
+        /**
+         * the DragDrop object that is currently being dragged
+         * @property dragCurrent
+         * @type DragDrop
+         * @private
+         * @static
+         **/
+        dragCurrent: null,
+
+        /**
+         * the DragDrop object(s) that are being hovered over
+         * @property dragOvers
+         * @type Array
+         * @private
+         * @static
+         */
+        dragOvers: {},
+
+        /**
+         * the X distance between the cursor and the object being dragged
+         * @property deltaX
+         * @type int
+         * @private
+         * @static
+         */
+        deltaX: 0,
+
+        /**
+         * the Y distance between the cursor and the object being dragged
+         * @property deltaY
+         * @type int
+         * @private
+         * @static
+         */
+        deltaY: 0,
+
+        /**
+         * Flag to determine if we should prevent the default behavior of the
+         * events we define. By default this is true, but this can be set to
+         * false if you need the default behavior (not recommended)
+         * @property preventDefault
+         * @type boolean
+         * @static
+         */
+        preventDefault: true,
+
+        /**
+         * Flag to determine if we should stop the propagation of the events
+         * we generate. This is true by default but you may want to set it to
+         * false if the html element contains other features that require the
+         * mouse click.
+         * @property stopPropagation
+         * @type boolean
+         * @static
+         */
+        stopPropagation: true,
+
+        /**
+         * Internal flag that is set to true when drag and drop has been
+         * intialized
+         * @property initialized
+         * @private
+         * @static
+         */
+        initialized: false,
+
+        /**
+         * All drag and drop can be disabled.
+         * @property locked
+         * @private
+         * @static
+         */
+        locked: false,
+
+        /**
+         * Called the first time an element is registered.
+         * @method init
+         * @private
+         * @static
+         */
+        init: function() {
+            this.initialized = true;
+        },
+
+        /**
+         * In point mode, drag and drop interaction is defined by the
+         * location of the cursor during the drag/drop
+         * @property POINT
+         * @type int
+         * @static
+         */
+        POINT: 0,
+
+        /**
+         * In intersect mode, drag and drop interaction is defined by the
+         * overlap of two or more drag and drop objects.
+         * @property INTERSECT
+         * @type int
+         * @static
+         */
+        INTERSECT: 1,
+
+        /**
+         * The current drag and drop mode.  Default: POINT
+         * @property mode
+         * @type int
+         * @static
+         */
+        mode: 0,
+
+        /**
+         * Runs method on all drag and drop objects
+         * @method _execOnAll
+         * @private
+         * @static
+         */
+        _execOnAll: function(sMethod, args) {
+            for (var i in this.ids) {
+                for (var j in this.ids[i]) {
+                    var oDD = this.ids[i][j];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+                    oDD[sMethod].apply(oDD, args);
+                }
+            }
+        },
+
+        /**
+         * Drag and drop initialization.  Sets up the global event handlers
+         * @method _onLoad
+         * @private
+         * @static
+         */
+        _onLoad: function() {
+
+            this.init();
+
+
+            Event.on(document, "mouseup",   this.handleMouseUp, this, true);
+            Event.on(document, "mousemove", this.handleMouseMove, this, true);
+            Event.on(window,   "unload",    this._onUnload, this, true);
+            Event.on(window,   "resize",    this._onResize, this, true);
+            // Event.on(window,   "mouseout",    this._test);
+
+        },
+
+        /**
+         * Reset constraints on all drag and drop objs
+         * @method _onResize
+         * @private
+         * @static
+         */
+        _onResize: function(e) {
+            this._execOnAll("resetConstraints", []);
+        },
+
+        /**
+         * Lock all drag and drop functionality
+         * @method lock
+         * @static
+         */
+        lock: function() { this.locked = true; },
+
+        /**
+         * Unlock all drag and drop functionality
+         * @method unlock
+         * @static
+         */
+        unlock: function() { this.locked = false; },
+
+        /**
+         * Is drag and drop locked?
+         * @method isLocked
+         * @return {boolean} True if drag and drop is locked, false otherwise.
+         * @static
+         */
+        isLocked: function() { return this.locked; },
+
+        /**
+         * Location cache that is set for all drag drop objects when a drag is
+         * initiated, cleared when the drag is finished.
+         * @property locationCache
+         * @private
+         * @static
+         */
+        locationCache: {},
+
+        /**
+         * Set useCache to false if you want to force object the lookup of each
+         * drag and drop linked element constantly during a drag.
+         * @property useCache
+         * @type boolean
+         * @static
+         */
+        useCache: true,
+
+        /**
+         * The number of pixels that the mouse needs to move after the
+         * mousedown before the drag is initiated.  Default=3;
+         * @property clickPixelThresh
+         * @type int
+         * @static
+         */
+        clickPixelThresh: 3,
+
+        /**
+         * The number of milliseconds after the mousedown event to initiate the
+         * drag if we don't get a mouseup event. Default=350
+         * @property clickTimeThresh
+         * @type int
+         * @static
+         */
+        clickTimeThresh: 350,
+
+        /**
+         * Flag that indicates that either the drag pixel threshold or the
+         * mousdown time threshold has been met
+         * @property dragThreshMet
+         * @type boolean
+         * @private
+         * @static
+         */
+        dragThreshMet: false,
+
+        /**
+         * Timeout used for the click time threshold
+         * @property clickTimeout
+         * @type Object
+         * @private
+         * @static
+         */
+        clickTimeout: null,
+
+        /**
+         * The X position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startX
+         * @type int
+         * @private
+         * @static
+         */
+        startX: 0,
+
+        /**
+         * The Y position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startY
+         * @type int
+         * @private
+         * @static
+         */
+        startY: 0,
+
+        /**
+         * Each DragDrop instance must be registered with the DragDropMgr.
+         * This is executed in DragDrop.init()
+         * @method regDragDrop
+         * @param {DragDrop} oDD the DragDrop object to register
+         * @param {String} sGroup the name of the group this element belongs to
+         * @static
+         */
+        regDragDrop: function(oDD, sGroup) {
+            if (!this.initialized) { this.init(); }
+
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+            this.ids[sGroup][oDD.id] = oDD;
+        },
+
+        /**
+         * Removes the supplied dd instance from the supplied group. Executed
+         * by DragDrop.removeFromGroup, so don't call this function directly.
+         * @method removeDDFromGroup
+         * @private
+         * @static
+         */
+        removeDDFromGroup: function(oDD, sGroup) {
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+
+            var obj = this.ids[sGroup];
+            if (obj && obj[oDD.id]) {
+                delete obj[oDD.id];
+            }
+        },
+
+        /**
+         * Unregisters a drag and drop item.  This is executed in
+         * DragDrop.unreg, use that method instead of calling this directly.
+         * @method _remove
+         * @private
+         * @static
+         */
+        _remove: function(oDD) {
+            for (var g in oDD.groups) {
+                if (g && this.ids[g] && this.ids[g][oDD.id]) {
+                    delete this.ids[g][oDD.id];
+                }
+            }
+            delete this.handleIds[oDD.id];
+        },
+
+        /**
+         * Each DragDrop handle element must be registered.  This is done
+         * automatically when executing DragDrop.setHandleElId()
+         * @method regHandle
+         * @param {String} sDDId the DragDrop id this element is a handle for
+         * @param {String} sHandleId the id of the element that is the drag
+         * handle
+         * @static
+         */
+        regHandle: function(sDDId, sHandleId) {
+            if (!this.handleIds[sDDId]) {
+                this.handleIds[sDDId] = {};
+            }
+            this.handleIds[sDDId][sHandleId] = sHandleId;
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop item.
+         * @method isDragDrop
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop item,
+         * false otherwise
+         * @static
+         */
+        isDragDrop: function(id) {
+            return ( this.getDDById(id) ) ? true : false;
+        },
+
+        /**
+         * Returns the drag and drop instances that are in all groups the
+         * passed in instance belongs to.
+         * @method getRelated
+         * @param {DragDrop} p_oDD the obj to get related data for
+         * @param {boolean} bTargetsOnly if true, only return targetable objs
+         * @return {DragDrop[]} the related instances
+         * @static
+         */
+        getRelated: function(p_oDD, bTargetsOnly) {
+            var oDDs = [];
+            for (var i in p_oDD.groups) {
+                for (var j in this.ids[i]) {
+                    var dd = this.ids[i][j];
+                    if (! this.isTypeOfDD(dd)) {
+                        continue;
+                    }
+                    if (!bTargetsOnly || dd.isTarget) {
+                        oDDs[oDDs.length] = dd;
+                    }
+                }
+            }
+
+            return oDDs;
+        },
+
+        /**
+         * Returns true if the specified dd target is a legal target for
+         * the specifice drag obj
+         * @method isLegalTarget
+         * @param {DragDrop} oDD the drag obj
+         * @param {DragDrop} oTargetDD the target
+         * @return {boolean} true if the target is a legal target for the
+         * dd obj
+         * @static
+         */
+        isLegalTarget: function (oDD, oTargetDD) {
+            var targets = this.getRelated(oDD, true);
+            for (var i=0, len=targets.length;i<len;++i) {
+                if (targets[i].id == oTargetDD.id) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * My goal is to be able to transparently determine if an object is
+         * typeof DragDrop, and the exact subclass of DragDrop.  typeof
+         * returns "object", oDD.constructor.toString() always returns
+         * "DragDrop" and not the name of the subclass.  So for now it just
+         * evaluates a well-known variable in DragDrop.
+         * @method isTypeOfDD
+         * @param {Object} the object to evaluate
+         * @return {boolean} true if typeof oDD = DragDrop
+         * @static
+         */
+        isTypeOfDD: function (oDD) {
+            return (oDD && oDD.__ygDragDrop);
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop handle for the given Drag Drop object.
+         * @method isHandle
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop handle, false
+         * otherwise
+         * @static
+         */
+        isHandle: function(sDDId, sHandleId) {
+            return ( this.handleIds[sDDId] &&
+                            this.handleIds[sDDId][sHandleId] );
+        },
+
+        /**
+         * Returns the DragDrop instance for a given id
+         * @method getDDById
+         * @param {String} id the id of the DragDrop object
+         * @return {DragDrop} the drag drop object, null if it is not found
+         * @static
+         */
+        getDDById: function(id) {
+            for (var i in this.ids) {
+                if (this.ids[i][id]) {
+                    return this.ids[i][id];
+                }
+            }
+            return null;
+        },
+
+        /**
+         * Fired after a registered DragDrop object gets the mousedown event.
+         * Sets up the events required to track the object being dragged
+         * @method handleMouseDown
+         * @param {Event} e the event
+         * @param oDD the DragDrop object being dragged
+         * @private
+         * @static
+         */
+        handleMouseDown: function(e, oDD) {
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddDisable();
+            }
+            if(this.dragCurrent){
+                // the original browser mouseup wasn't handled (e.g. outside FF browser window)
+                // so clean up first to avoid breaking the next drag
+                this.handleMouseUp(e);
+            }
+            
+            this.currentTarget = e.getTarget();
+            this.dragCurrent = oDD;
+
+            var el = oDD.getEl();
+
+            // track start position
+            this.startX = e.getPageX();
+            this.startY = e.getPageY();
+
+            this.deltaX = this.startX - el.offsetLeft;
+            this.deltaY = this.startY - el.offsetTop;
+
+            this.dragThreshMet = false;
+
+            this.clickTimeout = setTimeout(
+                    function() {
+                        var DDM = Ext.dd.DDM;
+                        DDM.startDrag(DDM.startX, DDM.startY);
+                    },
+                    this.clickTimeThresh );
+        },
+
+        /**
+         * Fired when either the drag pixel threshol or the mousedown hold
+         * time threshold has been met.
+         * @method startDrag
+         * @param x {int} the X position of the original mousedown
+         * @param y {int} the Y position of the original mousedown
+         * @static
+         */
+        startDrag: function(x, y) {
+            clearTimeout(this.clickTimeout);
+            if (this.dragCurrent) {
+                this.dragCurrent.b4StartDrag(x, y);
+                this.dragCurrent.startDrag(x, y);
+            }
+            this.dragThreshMet = true;
+        },
+
+        /**
+         * Internal function to handle the mouseup event.  Will be invoked
+         * from the context of the document.
+         * @method handleMouseUp
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseUp: function(e) {
+
+            if(Ext.QuickTips){
+                Ext.QuickTips.ddEnable();
+            }
+            if (! this.dragCurrent) {
+                return;
+            }
+
+            clearTimeout(this.clickTimeout);
+
+            if (this.dragThreshMet) {
+                this.fireEvents(e, true);
+            } else {
+            }
+
+            this.stopDrag(e);
+
+            this.stopEvent(e);
+        },
+
+        /**
+         * Utility to stop event propagation and event default, if these
+         * features are turned on.
+         * @method stopEvent
+         * @param {Event} e the event as returned by this.getEvent()
+         * @static
+         */
+        stopEvent: function(e){
+            if(this.stopPropagation) {
+                e.stopPropagation();
+            }
+
+            if (this.preventDefault) {
+                e.preventDefault();
+            }
+        },
+
+        /**
+         * Internal function to clean up event handlers after the drag
+         * operation is complete
+         * @method stopDrag
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        stopDrag: function(e) {
+            // Fire the drag end event for the item that was dragged
+            if (this.dragCurrent) {
+                if (this.dragThreshMet) {
+                    this.dragCurrent.b4EndDrag(e);
+                    this.dragCurrent.endDrag(e);
+                }
+
+                this.dragCurrent.onMouseUp(e);
+            }
+
+            this.dragCurrent = null;
+            this.dragOvers = {};
+        },
+
+        /**
+         * Internal function to handle the mousemove event.  Will be invoked
+         * from the context of the html element.
+         *
+         * @TODO figure out what we can do about mouse events lost when the
+         * user drags objects beyond the window boundary.  Currently we can
+         * detect this in internet explorer by verifying that the mouse is
+         * down during the mousemove event.  Firefox doesn't give us the
+         * button state on the mousemove event.
+         * @method handleMouseMove
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseMove: function(e) {
+            if (! this.dragCurrent) {
+                return true;
+            }
+            // var button = e.which || e.button;
+
+            // check for IE mouseup outside of page boundary
+            if (Ext.isIE && (e.button !== 0 && e.button !== 1 && e.button !== 2)) {
+                this.stopEvent(e);
+                return this.handleMouseUp(e);
+            }
+
+            if (!this.dragThreshMet) {
+                var diffX = Math.abs(this.startX - e.getPageX());
+                var diffY = Math.abs(this.startY - e.getPageY());
+                if (diffX > this.clickPixelThresh ||
+                            diffY > this.clickPixelThresh) {
+                    this.startDrag(this.startX, this.startY);
+                }
+            }
+
+            if (this.dragThreshMet) {
+                this.dragCurrent.b4Drag(e);
+                this.dragCurrent.onDrag(e);
+                if(!this.dragCurrent.moveOnly){
+                    this.fireEvents(e, false);
+                }
+            }
+
+            this.stopEvent(e);
+
+            return true;
+        },
+
+        /**
+         * Iterates over all of the DragDrop elements to find ones we are
+         * hovering over or dropping on
+         * @method fireEvents
+         * @param {Event} e the event
+         * @param {boolean} isDrop is this a drop op or a mouseover op?
+         * @private
+         * @static
+         */
+        fireEvents: function(e, isDrop) {
+            var dc = this.dragCurrent;
+
+            // If the user did the mouse up outside of the window, we could
+            // get here even though we have ended the drag.
+            if (!dc || dc.isLocked()) {
+                return;
+            }
+
+            var pt = e.getPoint();
+
+            // cache the previous dragOver array
+            var oldOvers = [];
+
+            var outEvts   = [];
+            var overEvts  = [];
+            var dropEvts  = [];
+            var enterEvts = [];
+
+            // Check to see if the object(s) we were hovering over is no longer
+            // being hovered over so we can fire the onDragOut event
+            for (var i in this.dragOvers) {
+
+                var ddo = this.dragOvers[i];
+
+                if (! this.isTypeOfDD(ddo)) {
+                    continue;
+                }
+
+                if (! this.isOverTarget(pt, ddo, this.mode)) {
+                    outEvts.push( ddo );
+                }
+
+                oldOvers[i] = true;
+                delete this.dragOvers[i];
+            }
+
+            for (var sGroup in dc.groups) {
+
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+
+                for (i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+
+                    if (oDD.isTarget && !oDD.isLocked() && ((oDD != dc) || (dc.ignoreSelf === false))) {
+                        if (this.isOverTarget(pt, oDD, this.mode)) {
+                            // look for drop interactions
+                            if (isDrop) {
+                                dropEvts.push( oDD );
+                            // look for drag enter and drag over interactions
+                            } else {
+
+                                // initial drag over: dragEnter fires
+                                if (!oldOvers[oDD.id]) {
+                                    enterEvts.push( oDD );
+                                // subsequent drag overs: dragOver fires
+                                } else {
+                                    overEvts.push( oDD );
+                                }
+
+                                this.dragOvers[oDD.id] = oDD;
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (this.mode) {
+                if (outEvts.length) {
+                    dc.b4DragOut(e, outEvts);
+                    dc.onDragOut(e, outEvts);
+                }
+
+                if (enterEvts.length) {
+                    dc.onDragEnter(e, enterEvts);
+                }
+
+                if (overEvts.length) {
+                    dc.b4DragOver(e, overEvts);
+                    dc.onDragOver(e, overEvts);
+                }
+
+                if (dropEvts.length) {
+                    dc.b4DragDrop(e, dropEvts);
+                    dc.onDragDrop(e, dropEvts);
+                }
+
+            } else {
+                // fire dragout events
+                var len = 0;
+                for (i=0, len=outEvts.length; i<len; ++i) {
+                    dc.b4DragOut(e, outEvts[i].id);
+                    dc.onDragOut(e, outEvts[i].id);
+                }
+
+                // fire enter events
+                for (i=0,len=enterEvts.length; i<len; ++i) {
+                    // dc.b4DragEnter(e, oDD.id);
+                    dc.onDragEnter(e, enterEvts[i].id);
+                }
+
+                // fire over events
+                for (i=0,len=overEvts.length; i<len; ++i) {
+                    dc.b4DragOver(e, overEvts[i].id);
+                    dc.onDragOver(e, overEvts[i].id);
+                }
+
+                // fire drop events
+                for (i=0, len=dropEvts.length; i<len; ++i) {
+                    dc.b4DragDrop(e, dropEvts[i].id);
+                    dc.onDragDrop(e, dropEvts[i].id);
+                }
+
+            }
+
+            // notify about a drop that did not find a target
+            if (isDrop && !dropEvts.length) {
+                dc.onInvalidDrop(e);
+            }
+
+        },
+
+        /**
+         * Helper function for getting the best match from the list of drag
+         * and drop objects returned by the drag and drop events when we are
+         * in INTERSECT mode.  It returns either the first object that the
+         * cursor is over, or the object that has the greatest overlap with
+         * the dragged element.
+         * @method getBestMatch
+         * @param  {DragDrop[]} dds The array of drag and drop objects
+         * targeted
+         * @return {DragDrop}       The best single match
+         * @static
+         */
+        getBestMatch: function(dds) {
+            var winner = null;
+            // Return null if the input is not what we expect
+            //if (!dds || !dds.length || dds.length == 0) {
+               // winner = null;
+            // If there is only one item, it wins
+            //} else if (dds.length == 1) {
+
+            var len = dds.length;
+
+            if (len == 1) {
+                winner = dds[0];
+            } else {
+                // Loop through the targeted items
+                for (var i=0; i<len; ++i) {
+                    var dd = dds[i];
+                    // If the cursor is over the object, it wins.  If the
+                    // cursor is over multiple matches, the first one we come
+                    // to wins.
+                    if (dd.cursorIsOver) {
+                        winner = dd;
+                        break;
+                    // Otherwise the object with the most overlap wins
+                    } else {
+                        if (!winner ||
+                            winner.overlap.getArea() < dd.overlap.getArea()) {
+                            winner = dd;
+                        }
+                    }
+                }
+            }
+
+            return winner;
+        },
+
+        /**
+         * Refreshes the cache of the top-left and bottom-right points of the
+         * drag and drop objects in the specified group(s).  This is in the
+         * format that is stored in the drag and drop instance, so typical
+         * usage is:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache(ddinstance.groups);
+         * </code>
+         * Alternatively:
+         * <code>
+         * Ext.dd.DragDropMgr.refreshCache({group1:true, group2:true});
+         * </code>
+         * @TODO this really should be an indexed array.  Alternatively this
+         * method could accept both.
+         * @method refreshCache
+         * @param {Object} groups an associative array of groups to refresh
+         * @static
+         */
+        refreshCache: function(groups) {
+            for (var sGroup in groups) {
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+                for (var i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+
+                    if (this.isTypeOfDD(oDD)) {
+                    // if (this.isTypeOfDD(oDD) && oDD.isTarget) {
+                        var loc = this.getLocation(oDD);
+                        if (loc) {
+                            this.locationCache[oDD.id] = loc;
+                        } else {
+                            delete this.locationCache[oDD.id];
+                            // this will unregister the drag and drop object if
+                            // the element is not in a usable state
+                            // oDD.unreg();
+                        }
+                    }
+                }
+            }
+        },
+
+        /**
+         * This checks to make sure an element exists and is in the DOM.  The
+         * main purpose is to handle cases where innerHTML is used to remove
+         * drag and drop objects from the DOM.  IE provides an 'unspecified
+         * error' when trying to access the offsetParent of such an element
+         * @method verifyEl
+         * @param {HTMLElement} el the element to check
+         * @return {boolean} true if the element looks usable
+         * @static
+         */
+        verifyEl: function(el) {
+            if (el) {
+                var parent;
+                if(Ext.isIE){
+                    try{
+                        parent = el.offsetParent;
+                    }catch(e){}
+                }else{
+                    parent = el.offsetParent;
+                }
+                if (parent) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * Returns a Region object containing the drag and drop element's position
+         * and size, including the padding configured for it
+         * @method getLocation
+         * @param {DragDrop} oDD the drag and drop object to get the
+         *                       location for
+         * @return {Ext.lib.Region} a Region object representing the total area
+         *                             the element occupies, including any padding
+         *                             the instance is configured for.
+         * @static
+         */
+        getLocation: function(oDD) {
+            if (! this.isTypeOfDD(oDD)) {
+                return null;
+            }
+
+            var el = oDD.getEl(), pos, x1, x2, y1, y2, t, r, b, l, region;
+
+            try {
+                pos= Ext.lib.Dom.getXY(el);
+            } catch (e) { }
+
+            if (!pos) {
+                return null;
+            }
+
+            x1 = pos[0];
+            x2 = x1 + el.offsetWidth;
+            y1 = pos[1];
+            y2 = y1 + el.offsetHeight;
+
+            t = y1 - oDD.padding[0];
+            r = x2 + oDD.padding[1];
+            b = y2 + oDD.padding[2];
+            l = x1 - oDD.padding[3];
+
+            region = new Ext.lib.Region( t, r, b, l );
+            /*
+             * The code below is to ensure that large scrolling elements will
+             * only have their visible area recognized as a drop target, otherwise it 
+             * can potentially erronously register as a target when the element scrolls
+             * over the top of something below it.
+             */
+            el = Ext.get(el.parentNode);
+            while (el && region) {
+	            if (el.isScrollable()) {
+	                // check whether our element is visible in the view port:
+	                region = region.intersect(el.getRegion());
+	            }
+	            el = el.parent();
+            }
+            return region;
+        },
+
+        /**
+         * Checks the cursor location to see if it over the target
+         * @method isOverTarget
+         * @param {Ext.lib.Point} pt The point to evaluate
+         * @param {DragDrop} oTarget the DragDrop object we are inspecting
+         * @return {boolean} true if the mouse is over the target
+         * @private
+         * @static
+         */
+        isOverTarget: function(pt, oTarget, intersect) {
+            // use cache if available
+            var loc = this.locationCache[oTarget.id];
+            if (!loc || !this.useCache) {
+                loc = this.getLocation(oTarget);
+                this.locationCache[oTarget.id] = loc;
+
+            }
+
+            if (!loc) {
+                return false;
+            }
+
+            oTarget.cursorIsOver = loc.contains( pt );
+
+            // DragDrop is using this as a sanity check for the initial mousedown
+            // in this case we are done.  In POINT mode, if the drag obj has no
+            // contraints, we are also done. Otherwise we need to evaluate the
+            // location of the target as related to the actual location of the
+            // dragged element.
+            var dc = this.dragCurrent;
+            if (!dc || !dc.getTargetCoord ||
+                    (!intersect && !dc.constrainX && !dc.constrainY)) {
+                return oTarget.cursorIsOver;
+            }
+
+            oTarget.overlap = null;
+
+            // Get the current location of the drag element, this is the
+            // location of the mouse event less the delta that represents
+            // where the original mousedown happened on the element.  We
+            // need to consider constraints and ticks as well.
+            var pos = dc.getTargetCoord(pt.x, pt.y);
+
+            var el = dc.getDragEl();
+            var curRegion = new Ext.lib.Region( pos.y,
+                                                   pos.x + el.offsetWidth,
+                                                   pos.y + el.offsetHeight,
+                                                   pos.x );
+
+            var overlap = curRegion.intersect(loc);
+
+            if (overlap) {
+                oTarget.overlap = overlap;
+                return (intersect) ? true : oTarget.cursorIsOver;
+            } else {
+                return false;
+            }
+        },
+
+        /**
+         * unload event handler
+         * @method _onUnload
+         * @private
+         * @static
+         */
+        _onUnload: function(e, me) {
+            Event.removeListener(document, "mouseup",   this.handleMouseUp, this);
+            Event.removeListener(document, "mousemove", this.handleMouseMove, this);
+            Event.removeListener(window,   "resize",    this._onResize, this);
+            Ext.dd.DragDropMgr.unregAll();
+        },
+
+        /**
+         * Cleans up the drag and drop events and objects.
+         * @method unregAll
+         * @private
+         * @static
+         */
+        unregAll: function() {
+
+            if (this.dragCurrent) {
+                this.stopDrag();
+                this.dragCurrent = null;
+            }
+
+            this._execOnAll("unreg", []);
+
+            for (var i in this.elementCache) {
+                delete this.elementCache[i];
+            }
+
+            this.elementCache = {};
+            this.ids = {};
+        },
+
+        /**
+         * A cache of DOM elements
+         * @property elementCache
+         * @private
+         * @static
+         */
+        elementCache: {},
+
+        /**
+         * Get the wrapper for the DOM element specified
+         * @method getElWrapper
+         * @param {String} id the id of the element to get
+         * @return {Ext.dd.DDM.ElementWrapper} the wrapped element
+         * @private
+         * @deprecated This wrapper isn't that useful
+         * @static
+         */
+        getElWrapper: function(id) {
+            var oWrapper = this.elementCache[id];
+            if (!oWrapper || !oWrapper.el) {
+                oWrapper = this.elementCache[id] =
+                    new this.ElementWrapper(Ext.getDom(id));
+            }
+            return oWrapper;
+        },
+
+        /**
+         * Returns the actual DOM element
+         * @method getElement
+         * @param {String} id the id of the elment to get
+         * @return {Object} The element
+         * @deprecated use Ext.lib.Ext.getDom instead
+         * @static
+         */
+        getElement: function(id) {
+            return Ext.getDom(id);
+        },
+
+        /**
+         * Returns the style property for the DOM element (i.e.,
+         * document.getElById(id).style)
+         * @method getCss
+         * @param {String} id the id of the elment to get
+         * @return {Object} The style property of the element
+         * @deprecated use Ext.lib.Dom instead
+         * @static
+         */
+        getCss: function(id) {
+            var el = Ext.getDom(id);
+            return (el) ? el.style : null;
+        },
+
+        /**
+         * Inner class for cached elements
+         * @class Ext.dd.DragDropMgr.ElementWrapper
+         * @for DragDropMgr
+         * @private
+         * @deprecated
+         */
+        ElementWrapper: function(el) {
+                /**
+                 * The element
+                 * @property el
+                 */
+                this.el = el || null;
+                /**
+                 * The element id
+                 * @property id
+                 */
+                this.id = this.el && el.id;
+                /**
+                 * A reference to the style property
+                 * @property css
+                 */
+                this.css = this.el && el.style;
+            },
+
+        /**
+         * Returns the X position of an html element
+         * @method getPosX
+         * @param el the element for which to get the position
+         * @return {int} the X coordinate
+         * @for DragDropMgr
+         * @deprecated use Ext.lib.Dom.getX instead
+         * @static
+         */
+        getPosX: function(el) {
+            return Ext.lib.Dom.getX(el);
+        },
+
+        /**
+         * Returns the Y position of an html element
+         * @method getPosY
+         * @param el the element for which to get the position
+         * @return {int} the Y coordinate
+         * @deprecated use Ext.lib.Dom.getY instead
+         * @static
+         */
+        getPosY: function(el) {
+            return Ext.lib.Dom.getY(el);
+        },
+
+        /**
+         * Swap two nodes.  In IE, we use the native method, for others we
+         * emulate the IE behavior
+         * @method swapNode
+         * @param n1 the first node to swap
+         * @param n2 the other node to swap
+         * @static
+         */
+        swapNode: function(n1, n2) {
+            if (n1.swapNode) {
+                n1.swapNode(n2);
+            } else {
+                var p = n2.parentNode;
+                var s = n2.nextSibling;
+
+                if (s == n1) {
+                    p.insertBefore(n1, n2);
+                } else if (n2 == n1.nextSibling) {
+                    p.insertBefore(n2, n1);
+                } else {
+                    n1.parentNode.replaceChild(n2, n1);
+                    p.insertBefore(n1, s);
+                }
+            }
+        },
+
+        /**
+         * Returns the current scroll position
+         * @method getScroll
+         * @private
+         * @static
+         */
+        getScroll: function () {
+            var t, l, dde=document.documentElement, db=document.body;
+            if (dde && (dde.scrollTop || dde.scrollLeft)) {
+                t = dde.scrollTop;
+                l = dde.scrollLeft;
+            } else if (db) {
+                t = db.scrollTop;
+                l = db.scrollLeft;
+            } else {
+
+            }
+            return { top: t, left: l };
+        },
+
+        /**
+         * Returns the specified element style property
+         * @method getStyle
+         * @param {HTMLElement} el          the element
+         * @param {string}      styleProp   the style property
+         * @return {string} The value of the style property
+         * @deprecated use Ext.lib.Dom.getStyle
+         * @static
+         */
+        getStyle: function(el, styleProp) {
+            return Ext.fly(el).getStyle(styleProp);
+        },
+
+        /**
+         * Gets the scrollTop
+         * @method getScrollTop
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollTop: function () {
+            return this.getScroll().top;
+        },
+
+        /**
+         * Gets the scrollLeft
+         * @method getScrollLeft
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollLeft: function () {
+            return this.getScroll().left;
+        },
+
+        /**
+         * Sets the x/y position of an element to the location of the
+         * target element.
+         * @method moveToEl
+         * @param {HTMLElement} moveEl      The element to move
+         * @param {HTMLElement} targetEl    The position reference element
+         * @static
+         */
+        moveToEl: function (moveEl, targetEl) {
+            var aCoord = Ext.lib.Dom.getXY(targetEl);
+            Ext.lib.Dom.setXY(moveEl, aCoord);
+        },
+
+        /**
+         * Numeric array sort function
+         * @method numericSort
+         * @static
+         */
+        numericSort: function(a, b) {
+            return (a - b);
+        },
+
+        /**
+         * Internal counter
+         * @property _timeoutCount
+         * @private
+         * @static
+         */
+        _timeoutCount: 0,
+
+        /**
+         * Trying to make the load order less important.  Without this we get
+         * an error if this file is loaded before the Event Utility.
+         * @method _addListeners
+         * @private
+         * @static
+         */
+        _addListeners: function() {
+            var DDM = Ext.dd.DDM;
+            if ( Ext.lib.Event && document ) {
+                DDM._onLoad();
+            } else {
+                if (DDM._timeoutCount > 2000) {
+                } else {
+                    setTimeout(DDM._addListeners, 10);
+                    if (document && document.body) {
+                        DDM._timeoutCount += 1;
+                    }
+                }
+            }
+        },
+
+        /**
+         * Recursively searches the immediate parent and all child nodes for
+         * the handle element in order to determine wheter or not it was
+         * clicked.
+         * @method handleWasClicked
+         * @param node the html element to inspect
+         * @static
+         */
+        handleWasClicked: function(node, id) {
+            if (this.isHandle(id, node.id)) {
+                return true;
+            } else {
+                // check to see if this is a text node child of the one we want
+                var p = node.parentNode;
+
+                while (p) {
+                    if (this.isHandle(id, p.id)) {
+                        return true;
+                    } else {
+                        p = p.parentNode;
+                    }
+                }
+            }
+
+            return false;
+        }
+
+    };
+
+}();
+
+// shorter alias, save a few bytes
+Ext.dd.DDM = Ext.dd.DragDropMgr;
+Ext.dd.DDM._addListeners();
+
+}
+
+/**
+ * @class Ext.dd.DD
+ * A DragDrop implementation where the linked element follows the
+ * mouse cursor during a drag.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DD:
+ *                    scroll
+ */
+Ext.dd.DD = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+Ext.extend(Ext.dd.DD, Ext.dd.DragDrop, {
+
+    /**
+     * When set to true, the utility automatically tries to scroll the browser
+     * window when a drag and drop element is dragged near the viewport boundary.
+     * Defaults to true.
+     * @property scroll
+     * @type boolean
+     */
+    scroll: true,
+
+    /**
+     * Sets the pointer offset to the distance between the linked element's top
+     * left corner and the location the element was clicked
+     * @method autoOffset
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     */
+    autoOffset: function(iPageX, iPageY) {
+        var x = iPageX - this.startPageX;
+        var y = iPageY - this.startPageY;
+        this.setDelta(x, y);
+    },
+
+    /**
+     * Sets the pointer offset.  You can call this directly to force the
+     * offset to be in a particular location (e.g., pass in 0,0 to set it
+     * to the center of the object)
+     * @method setDelta
+     * @param {int} iDeltaX the distance from the left
+     * @param {int} iDeltaY the distance from the top
+     */
+    setDelta: function(iDeltaX, iDeltaY) {
+        this.deltaX = iDeltaX;
+        this.deltaY = iDeltaY;
+    },
+
+    /**
+     * Sets the drag element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method setDragElPos
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    setDragElPos: function(iPageX, iPageY) {
+        // the first time we do this, we are going to check to make sure
+        // the element has css positioning
+
+        var el = this.getDragEl();
+        this.alignElWithMouse(el, iPageX, iPageY);
+    },
+
+    /**
+     * Sets the element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method alignElWithMouse
+     * @param {HTMLElement} el the element to move
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    alignElWithMouse: function(el, iPageX, iPageY) {
+        var oCoord = this.getTargetCoord(iPageX, iPageY);
+        var fly = el.dom ? el : Ext.fly(el, '_dd');
+        if (!this.deltaSetXY) {
+            var aCoord = [oCoord.x, oCoord.y];
+            fly.setXY(aCoord);
+            var newLeft = fly.getLeft(true);
+            var newTop  = fly.getTop(true);
+            this.deltaSetXY = [ newLeft - oCoord.x, newTop - oCoord.y ];
+        } else {
+            fly.setLeftTop(oCoord.x + this.deltaSetXY[0], oCoord.y + this.deltaSetXY[1]);
+        }
+
+        this.cachePosition(oCoord.x, oCoord.y);
+        this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth);
+        return oCoord;
+    },
+
+    /**
+     * Saves the most recent position so that we can reset the constraints and
+     * tick marks on-demand.  We need to know this so that we can calculate the
+     * number of pixels the element is offset from its original position.
+     * @method cachePosition
+     * @param iPageX the current x position (optional, this just makes it so we
+     * don't have to look it up again)
+     * @param iPageY the current y position (optional, this just makes it so we
+     * don't have to look it up again)
+     */
+    cachePosition: function(iPageX, iPageY) {
+        if (iPageX) {
+            this.lastPageX = iPageX;
+            this.lastPageY = iPageY;
+        } else {
+            var aCoord = Ext.lib.Dom.getXY(this.getEl());
+            this.lastPageX = aCoord[0];
+            this.lastPageY = aCoord[1];
+        }
+    },
+
+    /**
+     * Auto-scroll the window if the dragged object has been moved beyond the
+     * visible window boundary.
+     * @method autoScroll
+     * @param {int} x the drag element's x position
+     * @param {int} y the drag element's y position
+     * @param {int} h the height of the drag element
+     * @param {int} w the width of the drag element
+     * @private
+     */
+    autoScroll: function(x, y, h, w) {
+
+        if (this.scroll) {
+            // The client height
+            var clientH = Ext.lib.Dom.getViewHeight();
+
+            // The client width
+            var clientW = Ext.lib.Dom.getViewWidth();
+
+            // The amt scrolled down
+            var st = this.DDM.getScrollTop();
+
+            // The amt scrolled right
+            var sl = this.DDM.getScrollLeft();
+
+            // Location of the bottom of the element
+            var bot = h + y;
+
+            // Location of the right of the element
+            var right = w + x;
+
+            // The distance from the cursor to the bottom of the visible area,
+            // adjusted so that we don't scroll if the cursor is beyond the
+            // element drag constraints
+            var toBot = (clientH + st - y - this.deltaY);
+
+            // The distance from the cursor to the right of the visible area
+            var toRight = (clientW + sl - x - this.deltaX);
+
+
+            // How close to the edge the cursor must be before we scroll
+            // var thresh = (document.all) ? 100 : 40;
+            var thresh = 40;
+
+            // How many pixels to scroll per autoscroll op.  This helps to reduce
+            // clunky scrolling. IE is more sensitive about this ... it needs this
+            // value to be higher.
+            var scrAmt = (document.all) ? 80 : 30;
+
+            // Scroll down if we are near the bottom of the visible page and the
+            // obj extends below the crease
+            if ( bot > clientH && toBot < thresh ) {
+                window.scrollTo(sl, st + scrAmt);
+            }
+
+            // Scroll up if the window is scrolled down and the top of the object
+            // goes above the top border
+            if ( y < st && st > 0 && y - st < thresh ) {
+                window.scrollTo(sl, st - scrAmt);
+            }
+
+            // Scroll right if the obj is beyond the right border and the cursor is
+            // near the border.
+            if ( right > clientW && toRight < thresh ) {
+                window.scrollTo(sl + scrAmt, st);
+            }
+
+            // Scroll left if the window has been scrolled to the right and the obj
+            // extends past the left border
+            if ( x < sl && sl > 0 && x - sl < thresh ) {
+                window.scrollTo(sl - scrAmt, st);
+            }
+        }
+    },
+
+    /**
+     * Finds the location the element should be placed if we want to move
+     * it to where the mouse location less the click offset would place us.
+     * @method getTargetCoord
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     * @return an object that contains the coordinates (Object.x and Object.y)
+     * @private
+     */
+    getTargetCoord: function(iPageX, iPageY) {
+        var x = iPageX - this.deltaX;
+        var y = iPageY - this.deltaY;
+
+        if (this.constrainX) {
+            if (x < this.minX) { x = this.minX; }
+            if (x > this.maxX) { x = this.maxX; }
+        }
+
+        if (this.constrainY) {
+            if (y < this.minY) { y = this.minY; }
+            if (y > this.maxY) { y = this.maxY; }
+        }
+
+        x = this.getTick(x, this.xTicks);
+        y = this.getTick(y, this.yTicks);
+
+
+        return {x:x, y:y};
+    },
+
+    /**
+     * Sets up config options specific to this class. Overrides
+     * Ext.dd.DragDrop, but all versions of this method through the
+     * inheritance chain are called
+     */
+    applyConfig: function() {
+        Ext.dd.DD.superclass.applyConfig.call(this);
+        this.scroll = (this.config.scroll !== false);
+    },
+
+    /**
+     * Event that fires prior to the onMouseDown event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4MouseDown: function(e) {
+        // this.resetConstraints();
+        this.autoOffset(e.getPageX(),
+                            e.getPageY());
+    },
+
+    /**
+     * Event that fires prior to the onDrag event.  Overrides
+     * Ext.dd.DragDrop.
+     */
+    b4Drag: function(e) {
+        this.setDragElPos(e.getPageX(),
+                            e.getPageY());
+    },
+
+    toString: function() {
+        return ("DD " + this.id);
+    }
+
+    //////////////////////////////////////////////////////////////////////////
+    // Debugging ygDragDrop events that can be overridden
+    //////////////////////////////////////////////////////////////////////////
+    /*
+    startDrag: function(x, y) {
+    },
+
+    onDrag: function(e) {
+    },
+
+    onDragEnter: function(e, id) {
+    },
+
+    onDragOver: function(e, id) {
+    },
+
+    onDragOut: function(e, id) {
+    },
+
+    onDragDrop: function(e, id) {
+    },
+
+    endDrag: function(e) {
+    }
+
+    */
+
+});
+/**
+ * @class Ext.dd.DDProxy
+ * A DragDrop implementation that inserts an empty, bordered div into
+ * the document that follows the cursor during drag operations.  At the time of
+ * the click, the frame div is resized to the dimensions of the linked html
+ * element, and moved to the exact location of the linked element.
+ *
+ * References to the "frame" element refer to the single proxy element that
+ * was created to be dragged in place of all DDProxy elements on the
+ * page.
+ *
+ * @extends Ext.dd.DD
+ * @constructor
+ * @param {String} id the id of the linked html element
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DDProxy in addition to those in DragDrop:
+ *                   resizeFrame, centerFrame, dragElId
+ */
+Ext.dd.DDProxy = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+    }
+};
+
+/**
+ * The default drag frame div id
+ * @property Ext.dd.DDProxy.dragElId
+ * @type String
+ * @static
+ */
+Ext.dd.DDProxy.dragElId = "ygddfdiv";
+
+Ext.extend(Ext.dd.DDProxy, Ext.dd.DD, {
+
+    /**
+     * By default we resize the drag frame to be the same size as the element
+     * we want to drag (this is to get the frame effect).  We can turn it off
+     * if we want a different behavior.
+     * @property resizeFrame
+     * @type boolean
+     */
+    resizeFrame: true,
+
+    /**
+     * By default the frame is positioned exactly where the drag element is, so
+     * we use the cursor offset provided by Ext.dd.DD.  Another option that works only if
+     * you do not have constraints on the obj is to have the drag frame centered
+     * around the cursor.  Set centerFrame to true for this effect.
+     * @property centerFrame
+     * @type boolean
+     */
+    centerFrame: false,
+
+    /**
+     * Creates the proxy element if it does not yet exist
+     * @method createFrame
+     */
+    createFrame: function() {
+        var self = this;
+        var body = document.body;
+
+        if (!body || !body.firstChild) {
+            setTimeout( function() { self.createFrame(); }, 50 );
+            return;
+        }
+
+        var div = this.getDragEl();
+
+        if (!div) {
+            div    = document.createElement("div");
+            div.id = this.dragElId;
+            var s  = div.style;
+
+            s.position   = "absolute";
+            s.visibility = "hidden";
+            s.cursor     = "move";
+            s.border     = "2px solid #aaa";
+            s.zIndex     = 999;
+
+            // appendChild can blow up IE if invoked prior to the window load event
+            // while rendering a table.  It is possible there are other scenarios
+            // that would cause this to happen as well.
+            body.insertBefore(div, body.firstChild);
+        }
+    },
+
+    /**
+     * Initialization for the drag frame element.  Must be called in the
+     * constructor of all subclasses
+     * @method initFrame
+     */
+    initFrame: function() {
+        this.createFrame();
+    },
+
+    applyConfig: function() {
+        Ext.dd.DDProxy.superclass.applyConfig.call(this);
+
+        this.resizeFrame = (this.config.resizeFrame !== false);
+        this.centerFrame = (this.config.centerFrame);
+        this.setDragElId(this.config.dragElId || Ext.dd.DDProxy.dragElId);
+    },
+
+    /**
+     * Resizes the drag frame to the dimensions of the clicked object, positions
+     * it over the object, and finally displays it
+     * @method showFrame
+     * @param {int} iPageX X click position
+     * @param {int} iPageY Y click position
+     * @private
+     */
+    showFrame: function(iPageX, iPageY) {
+        var el = this.getEl();
+        var dragEl = this.getDragEl();
+        var s = dragEl.style;
+
+        this._resizeProxy();
+
+        if (this.centerFrame) {
+            this.setDelta( Math.round(parseInt(s.width,  10)/2),
+                           Math.round(parseInt(s.height, 10)/2) );
+        }
+
+        this.setDragElPos(iPageX, iPageY);
+
+        Ext.fly(dragEl).show();
+    },
+
+    /**
+     * The proxy is automatically resized to the dimensions of the linked
+     * element when a drag is initiated, unless resizeFrame is set to false
+     * @method _resizeProxy
+     * @private
+     */
+    _resizeProxy: function() {
+        if (this.resizeFrame) {
+            var el = this.getEl();
+            Ext.fly(this.getDragEl()).setSize(el.offsetWidth, el.offsetHeight);
+        }
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4MouseDown: function(e) {
+        var x = e.getPageX();
+        var y = e.getPageY();
+        this.autoOffset(x, y);
+        this.setDragElPos(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4StartDrag: function(x, y) {
+        // show the drag frame
+        this.showFrame(x, y);
+    },
+
+    // overrides Ext.dd.DragDrop
+    b4EndDrag: function(e) {
+        Ext.fly(this.getDragEl()).hide();
+    },
+
+    // overrides Ext.dd.DragDrop
+    // By default we try to move the element to the last location of the frame.
+    // This is so that the default behavior mirrors that of Ext.dd.DD.
+    endDrag: function(e) {
+
+        var lel = this.getEl();
+        var del = this.getDragEl();
+
+        // Show the drag frame briefly so we can get its position
+        del.style.visibility = "";
+
+        this.beforeMove();
+        // Hide the linked element before the move to get around a Safari
+        // rendering bug.
+        lel.style.visibility = "hidden";
+        Ext.dd.DDM.moveToEl(lel, del);
+        del.style.visibility = "hidden";
+        lel.style.visibility = "";
+
+        this.afterDrag();
+    },
+
+    beforeMove : function(){
+
+    },
+
+    afterDrag : function(){
+
+    },
+
+    toString: function() {
+        return ("DDProxy " + this.id);
+    }
+
+});
+/**
+ * @class Ext.dd.DDTarget
+ * A DragDrop implementation that does not move, but can be a drop
+ * target.  You would get the same result by simply omitting implementation
+ * for the event callbacks, but this way we reduce the processing cost of the
+ * event listener and the callbacks.
+ * @extends Ext.dd.DragDrop
+ * @constructor
+ * @param {String} id the id of the element that is a drop target
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                 Valid properties for DDTarget in addition to those in
+ *                 DragDrop:
+ *                    none
+ */
+Ext.dd.DDTarget = function(id, sGroup, config) {
+    if (id) {
+        this.initTarget(id, sGroup, config);
+    }
+};
+
+// Ext.dd.DDTarget.prototype = new Ext.dd.DragDrop();
+Ext.extend(Ext.dd.DDTarget, Ext.dd.DragDrop, {
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    getDragEl: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    isValidHandleChild: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    startDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    endDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDrag: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragEnter: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOut: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onDragOver: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onInvalidDrop: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseDown: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    onMouseUp: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setXConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setYConstraint: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    resetConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearConstraints: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    clearTicks: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setInitPosition: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setDragElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    setOuterHandleElId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    addInvalidHandleType: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleClass: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleId: Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. A DDTarget does not support being dragged.
+     * @method
+     */
+    removeInvalidHandleType: Ext.emptyFn,
+
+    toString: function() {
+        return ("DDTarget " + this.id);
+    }
+});/**
+ * @class Ext.dd.DragTracker
+ * @extends Ext.util.Observable
+ * A DragTracker listens for drag events on an Element and fires events at the start and end of the drag,
+ * as well as during the drag. This is useful for components such as {@link Ext.slider.MultiSlider}, where there is
+ * an element that can be dragged around to change the Slider's value.
+ * DragTracker provides a series of template methods that should be overridden to provide functionality
+ * in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd.
+ * See {@link Ext.slider.MultiSlider}'s initEvents function for an example implementation.
+ */
+Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
+    /**
+     * @cfg {Boolean} active
+	 * Defaults to <tt>false</tt>.
+	 */	
+    active: false,
+    /**
+     * @cfg {Number} tolerance
+	 * Number of pixels the drag target must be moved before dragging is considered to have started. Defaults to <tt>5</tt>.
+	 */	
+    tolerance: 5,
+    /**
+     * @cfg {Boolean/Number} autoStart
+	 * Defaults to <tt>false</tt>. Specify <tt>true</tt> to defer trigger start by 1000 ms.
+	 * Specify a Number for the number of milliseconds to defer trigger start.
+	 */	
+    autoStart: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+	    this.addEvents(
+	        /**
+	         * @event mousedown
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousedown',
+	        /**
+	         * @event mouseup
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mouseup',
+	        /**
+	         * @event mousemove
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'mousemove',
+	        /**
+	         * @event dragstart
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragstart',
+	        /**
+	         * @event dragend
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'dragend',
+	        /**
+	         * @event drag
+	         * @param {Object} this
+	         * @param {Object} e event object
+	         */
+	        'drag'
+	    );
+	
+	    this.dragRegion = new Ext.lib.Region(0,0,0,0);
+	
+	    if(this.el){
+	        this.initEl(this.el);
+	    }
+        Ext.dd.DragTracker.superclass.constructor.call(this, config);
+    },
+
+    initEl: function(el){
+        this.el = Ext.get(el);
+        el.on('mousedown', this.onMouseDown, this,
+                this.delegate ? {delegate: this.delegate} : undefined);
+    },
+
+    destroy : function(){
+        this.el.un('mousedown', this.onMouseDown, this);
+        delete this.el;
+    },
+
+    onMouseDown: function(e, target){
+        if(this.fireEvent('mousedown', this, e) !== false && this.onBeforeStart(e) !== false){
+            this.startXY = this.lastXY = e.getXY();
+            this.dragTarget = this.delegate ? target : this.el.dom;
+            if(this.preventDefault !== false){
+                e.preventDefault();
+            }
+            Ext.getDoc().on({
+                scope: this,
+                mouseup: this.onMouseUp,
+                mousemove: this.onMouseMove,
+                selectstart: this.stopSelect
+            });
+            if(this.autoStart){
+                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this, [e]);
+            }
+        }
+    },
+
+    onMouseMove: function(e, target){
+        // HACK: IE hack to see if button was released outside of window. */
+        if(this.active && Ext.isIE && !e.browserEvent.button){
+            e.preventDefault();
+            this.onMouseUp(e);
+            return;
+        }
+
+        e.preventDefault();
+        var xy = e.getXY(), s = this.startXY;
+        this.lastXY = xy;
+        if(!this.active){
+            if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
+                this.triggerStart(e);
+            }else{
+                return;
+            }
+        }
+        this.fireEvent('mousemove', this, e);
+        this.onDrag(e);
+        this.fireEvent('drag', this, e);
+    },
+
+    onMouseUp: function(e) {
+        var doc = Ext.getDoc(),
+            wasActive = this.active;
+            
+        doc.un('mousemove', this.onMouseMove, this);
+        doc.un('mouseup', this.onMouseUp, this);
+        doc.un('selectstart', this.stopSelect, this);
+        e.preventDefault();
+        this.clearStart();
+        this.active = false;
+        delete this.elRegion;
+        this.fireEvent('mouseup', this, e);
+        if(wasActive){
+            this.onEnd(e);
+            this.fireEvent('dragend', this, e);
+        }
+    },
+
+    triggerStart: function(e) {
+        this.clearStart();
+        this.active = true;
+        this.onStart(e);
+        this.fireEvent('dragstart', this, e);
+    },
+
+    clearStart : function() {
+        if(this.timer){
+            clearTimeout(this.timer);
+            delete this.timer;
+        }
+    },
+
+    stopSelect : function(e) {
+        e.stopEvent();
+        return false;
+    },
+    
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when the user first clicks and
+     * holds the mouse button down. Return false to disallow the drag
+     * @param {Ext.EventObject} e The event object
+     */
+    onBeforeStart : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation starts
+     * (e.g. the user has moved the tracked element beyond the specified tolerance)
+     * @param {Ext.EventObject} e The event object
+     */
+    onStart : function(xy) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called whenever a drag has been detected.
+     * @param {Ext.EventObject} e The event object
+     */
+    onDrag : function(e) {
+
+    },
+
+    /**
+     * Template method which should be overridden by each DragTracker instance. Called when a drag operation has been completed
+     * (e.g. the user clicked and held the mouse down, dragged the element and then released the mouse button)
+     * @param {Ext.EventObject} e The event object
+     */
+    onEnd : function(e) {
+
+    },
+
+    /**
+     * Returns the drag target
+     * @return {Ext.Element} The element currently being tracked
+     */
+    getDragTarget : function(){
+        return this.dragTarget;
+    },
+
+    getDragCt : function(){
+        return this.el;
+    },
+
+    getXY : function(constrain){
+        return constrain ?
+               this.constrainModes[constrain].call(this, this.lastXY) : this.lastXY;
+    },
+
+    getOffset : function(constrain){
+        var xy = this.getXY(constrain),
+            s = this.startXY;
+        return [s[0]-xy[0], s[1]-xy[1]];
+    },
+
+    constrainModes: {
+        'point' : function(xy){
+
+            if(!this.elRegion){
+                this.elRegion = this.getDragCt().getRegion();
+            }
+
+            var dr = this.dragRegion;
+
+            dr.left = xy[0];
+            dr.top = xy[1];
+            dr.right = xy[0];
+            dr.bottom = xy[1];
+
+            dr.constrainTo(this.elRegion);
+
+            return [dr.left, dr.top];
+        }
+    }
+});/**
+ * @class Ext.dd.ScrollManager
+ * <p>Provides automatic scrolling of overflow regions in the page during drag operations.</p>
+ * <p>The ScrollManager configs will be used as the defaults for any scroll container registered with it,
+ * but you can also override most of the configs per scroll container by adding a 
+ * <tt>ddScrollConfig</tt> object to the target element that contains these properties: {@link #hthresh},
+ * {@link #vthresh}, {@link #increment} and {@link #frequency}.  Example usage:
+ * <pre><code>
+var el = Ext.get('scroll-ct');
+el.ddScrollConfig = {
+    vthresh: 50,
+    hthresh: -1,
+    frequency: 100,
+    increment: 200
+};
+Ext.dd.ScrollManager.register(el);
+</code></pre>
+ * <b>Note: This class uses "Point Mode" and is untested in "Intersect Mode".</b>
+ * @singleton
+ */
+Ext.dd.ScrollManager = function(){
+    var ddm = Ext.dd.DragDropMgr;
+    var els = {};
+    var dragEl = null;
+    var proc = {};
+    
+    var onStop = function(e){
+        dragEl = null;
+        clearProc();
+    };
+    
+    var triggerRefresh = function(){
+        if(ddm.dragCurrent){
+             ddm.refreshCache(ddm.dragCurrent.groups);
+        }
+    };
+    
+    var doScroll = function(){
+        if(ddm.dragCurrent){
+            var dds = Ext.dd.ScrollManager;
+            var inc = proc.el.ddScrollConfig ?
+                      proc.el.ddScrollConfig.increment : dds.increment;
+            if(!dds.animate){
+                if(proc.el.scroll(proc.dir, inc)){
+                    triggerRefresh();
+                }
+            }else{
+                proc.el.scroll(proc.dir, inc, true, dds.animDuration, triggerRefresh);
+            }
+        }
+    };
+    
+    var clearProc = function(){
+        if(proc.id){
+            clearInterval(proc.id);
+        }
+        proc.id = 0;
+        proc.el = null;
+        proc.dir = "";
+    };
+
+    var startProc = function(el, dir){
+        clearProc();
+        proc.el = el;
+        proc.dir = dir;
+        var group = el.ddScrollConfig ? el.ddScrollConfig.ddGroup : undefined,
+            freq  = (el.ddScrollConfig && el.ddScrollConfig.frequency)
+                  ? el.ddScrollConfig.frequency
+                  : Ext.dd.ScrollManager.frequency;
+
+        if (group === undefined || ddm.dragCurrent.ddGroup == group) {
+            proc.id = setInterval(doScroll, freq);
+        }
+    };
+    
+    var onFire = function(e, isDrop){
+        if(isDrop || !ddm.dragCurrent){ return; }
+        var dds = Ext.dd.ScrollManager;
+        if(!dragEl || dragEl != ddm.dragCurrent){
+            dragEl = ddm.dragCurrent;
+            // refresh regions on drag start
+            dds.refreshCache();
+        }
+        
+        var xy = Ext.lib.Event.getXY(e);
+        var pt = new Ext.lib.Point(xy[0], xy[1]);
+        for(var id in els){
+            var el = els[id], r = el._region;
+            var c = el.ddScrollConfig ? el.ddScrollConfig : dds;
+            if(r && r.contains(pt) && el.isScrollable()){
+                if(r.bottom - pt.y <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "down");
+                    }
+                    return;
+                }else if(r.right - pt.x <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "left");
+                    }
+                    return;
+                }else if(pt.y - r.top <= c.vthresh){
+                    if(proc.el != el){
+                        startProc(el, "up");
+                    }
+                    return;
+                }else if(pt.x - r.left <= c.hthresh){
+                    if(proc.el != el){
+                        startProc(el, "right");
+                    }
+                    return;
+                }
+            }
+        }
+        clearProc();
+    };
+    
+    ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);
+    ddm.stopDrag = ddm.stopDrag.createSequence(onStop, ddm);
+    
+    return {
+        /**
+         * Registers new overflow element(s) to auto scroll
+         * @param {Mixed/Array} el The id of or the element to be scrolled or an array of either
+         */
+        register : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.register(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                els[el.id] = el;
+            }
+        },
+        
+        /**
+         * Unregisters overflow element(s) so they are no longer scrolled
+         * @param {Mixed/Array} el The id of or the element to be removed or an array of either
+         */
+        unregister : function(el){
+            if(Ext.isArray(el)){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.unregister(el[i]);
+                }
+            }else{
+                el = Ext.get(el);
+                delete els[el.id];
+            }
+        },
+        
+        /**
+         * The number of pixels from the top or bottom edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        vthresh : 25,
+        /**
+         * The number of pixels from the right or left edge of a container the pointer needs to be to
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        hthresh : 25,
+
+        /**
+         * The number of pixels to scroll in each scroll increment (defaults to 100)
+         * @type Number
+         */
+        increment : 100,
+        
+        /**
+         * The frequency of scrolls in milliseconds (defaults to 500)
+         * @type Number
+         */
+        frequency : 500,
+        
+        /**
+         * True to animate the scroll (defaults to true)
+         * @type Boolean
+         */
+        animate: true,
+        
+        /**
+         * The animation duration in seconds - 
+         * MUST BE less than Ext.dd.ScrollManager.frequency! (defaults to .4)
+         * @type Number
+         */
+        animDuration: .4,
+        
+        /**
+         * The named drag drop {@link Ext.dd.DragSource#ddGroup group} to which this container belongs (defaults to undefined). 
+         * If a ddGroup is specified, then container scrolling will only occur when a dragged object is in the same ddGroup.
+         * @type String
+         */
+        ddGroup: undefined,
+        
+        /**
+         * Manually trigger a cache refresh.
+         */
+        refreshCache : function(){
+            for(var id in els){
+                if(typeof els[id] == 'object'){ // for people extending the object prototype
+                    els[id]._region = els[id].getRegion();
+                }
+            }
+        }
+    };
+}();/**
+ * @class Ext.dd.Registry
+ * Provides easy access to all drag drop components that are registered on a page.  Items can be retrieved either
+ * directly by DOM node id, or by passing in the drag drop event that occurred and looking up the event target.
+ * @singleton
+ */
+Ext.dd.Registry = function(){
+    var elements = {}; 
+    var handles = {}; 
+    var autoIdSeed = 0;
+
+    var getId = function(el, autogen){
+        if(typeof el == "string"){
+            return el;
+        }
+        var id = el.id;
+        if(!id && autogen !== false){
+            id = "extdd-" + (++autoIdSeed);
+            el.id = id;
+        }
+        return id;
+    };
+    
+    return {
+    /**
+     * Resgister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to register
+     * @param {Object} data (optional) An custom data object that will be passed between the elements that are involved
+     * in drag drop operations.  You can populate this object with any arbitrary properties that your own code
+     * knows how to interpret, plus there are some specific properties known to the Registry that should be
+     * populated in the data object (if applicable):
+     * <pre>
+Value      Description<br />
+---------  ------------------------------------------<br />
+handles    Array of DOM nodes that trigger dragging<br />
+           for the element being registered<br />
+isHandle   True if the element passed in triggers<br />
+           dragging itself, else false
+</pre>
+     */
+        register : function(el, data){
+            data = data || {};
+            if(typeof el == "string"){
+                el = document.getElementById(el);
+            }
+            data.ddel = el;
+            elements[getId(el)] = data;
+            if(data.isHandle !== false){
+                handles[data.ddel.id] = data;
+            }
+            if(data.handles){
+                var hs = data.handles;
+                for(var i = 0, len = hs.length; i < len; i++){
+                	handles[getId(hs[i])] = data;
+                }
+            }
+        },
+
+    /**
+     * Unregister a drag drop element
+     * @param {String/HTMLElement} element The id or DOM node to unregister
+     */
+        unregister : function(el){
+            var id = getId(el, false);
+            var data = elements[id];
+            if(data){
+                delete elements[id];
+                if(data.handles){
+                    var hs = data.handles;
+                    for(var i = 0, len = hs.length; i < len; i++){
+                    	delete handles[getId(hs[i], false)];
+                    }
+                }
+            }
+        },
+
+    /**
+     * Returns the handle registered for a DOM Node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} handle The custom handle data
+     */
+        getHandle : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return handles[id];
+        },
+
+    /**
+     * Returns the handle that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} handle The custom handle data
+     */
+        getHandleFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? handles[t.id] : null;
+        },
+
+    /**
+     * Returns a custom data object that is registered for a DOM node by id
+     * @param {String/HTMLElement} id The DOM node or id to look up
+     * @return {Object} data The custom data
+     */
+        getTarget : function(id){
+            if(typeof id != "string"){ // must be element?
+                id = id.id;
+            }
+            return elements[id];
+        },
+
+    /**
+     * Returns a custom data object that is registered for the DOM node that is the target of the event
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+        getTargetFromEvent : function(e){
+            var t = Ext.lib.Event.getTarget(e);
+            return t ? elements[t.id] || handles[t.id] : null;
+        }
+    };
+}();/**
+ * @class Ext.dd.StatusProxy
+ * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
+ * default drag proxy used by all Ext.dd components.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.dd.StatusProxy = function(config){
+    Ext.apply(this, config);
+    this.id = this.id || Ext.id();
+    this.el = new Ext.Layer({
+        dh: {
+            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
+                {tag: "div", cls: "x-dd-drop-icon"},
+                {tag: "div", cls: "x-dd-drag-ghost"}
+            ]
+        }, 
+        shadow: !config || config.shadow !== false
+    });
+    this.ghost = Ext.get(this.el.dom.childNodes[1]);
+    this.dropStatus = this.dropNotAllowed;
+};
+
+Ext.dd.StatusProxy.prototype = {
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class to apply to the status element when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class to apply to the status element when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
+     * over the current target element.
+     * @param {String} cssClass The css class for the new drop status indicator image
+     */
+    setStatus : function(cssClass){
+        cssClass = cssClass || this.dropNotAllowed;
+        if(this.dropStatus != cssClass){
+            this.el.replaceClass(this.dropStatus, cssClass);
+            this.dropStatus = cssClass;
+        }
+    },
+
+    /**
+     * Resets the status indicator to the default dropNotAllowed value
+     * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
+     */
+    reset : function(clearGhost){
+        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
+        this.dropStatus = this.dropNotAllowed;
+        if(clearGhost){
+            this.ghost.update("");
+        }
+    },
+
+    /**
+     * Updates the contents of the ghost element
+     * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
+     * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
+     */
+    update : function(html){
+        if(typeof html == "string"){
+            this.ghost.update(html);
+        }else{
+            this.ghost.update("");
+            html.style.margin = "0";
+            this.ghost.dom.appendChild(html);
+        }
+        var el = this.ghost.dom.firstChild; 
+        if(el){
+            Ext.fly(el).setStyle('float', 'none');
+        }
+    },
+
+    /**
+     * Returns the underlying proxy {@link Ext.Layer}
+     * @return {Ext.Layer} el
+    */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the ghost element
+     * @return {Ext.Element} el
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Hides the proxy
+     * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
+     */
+    hide : function(clear){
+        this.el.hide();
+        if(clear){
+            this.reset(true);
+        }
+    },
+
+    /**
+     * Stops the repair animation if it's currently running
+     */
+    stop : function(){
+        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
+            this.anim.stop();
+        }
+    },
+
+    /**
+     * Displays this proxy
+     */
+    show : function(){
+        this.el.show();
+    },
+
+    /**
+     * Force the Layer to sync its shadow and shim positions to the element
+     */
+    sync : function(){
+        this.el.sync();
+    },
+
+    /**
+     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
+     * invalid drop operation by the item being dragged.
+     * @param {Array} xy The XY position of the element ([x, y])
+     * @param {Function} callback The function to call after the repair is complete.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     */
+    repair : function(xy, callback, scope){
+        this.callback = callback;
+        this.scope = scope;
+        if(xy && this.animRepair !== false){
+            this.el.addClass("x-dd-drag-repair");
+            this.el.hideUnders(true);
+            this.anim = this.el.shift({
+                duration: this.repairDuration || .5,
+                easing: 'easeOut',
+                xy: xy,
+                stopFx: true,
+                callback: this.afterRepair,
+                scope: this
+            });
+        }else{
+            this.afterRepair();
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        this.hide(true);
+        if(typeof this.callback == "function"){
+            this.callback.call(this.scope || this);
+        }
+        this.callback = null;
+        this.scope = null;
+    },
+    
+    destroy: function(){
+        Ext.destroy(this.ghost, this.el);    
+    }
+};/**
+ * @class Ext.dd.DragSource
+ * @extends Ext.dd.DDProxy
+ * A simple class that provides the basic implementation needed to make any element draggable.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragSource = function(el, config){
+    this.el = Ext.get(el);
+    if(!this.dragData){
+        this.dragData = {};
+    }
+    
+    Ext.apply(this, config);
+    
+    if(!this.proxy){
+        this.proxy = new Ext.dd.StatusProxy();
+    }
+    Ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
+    
+    this.dragging = false;
+};
+
+Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    /**
+     * Returns the data object associated with this drag source
+     * @return {Object} data An object containing arbitrary data
+     */
+    getDragData : function(e){
+        return this.dragData;
+    },
+
+    // private
+    onDragEnter : function(e, id){
+        var target = Ext.dd.DragDropMgr.getDDById(id);
+        this.cachedTarget = target;
+        if(this.beforeDragEnter(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyEnter(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }else{
+                this.proxy.setStatus(this.dropAllowed);
+            }
+            
+            if(this.afterDragEnter){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * when the dragged item enters the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragEnter
+                 */
+                this.afterDragEnter(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * before the dragged item enters the drop target and optionally cancel the onDragEnter.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragEnter : function(target, e, id){
+        return true;
+    },
+
+    // private
+    alignElWithMouse: function() {
+        Ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.proxy.sync();
+    },
+
+    // private
+    onDragOver : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOver(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyOver(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }
+
+            if(this.afterDragOver){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * while the dragged item is over the drop target by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOver
+                 */
+                this.afterDragOver(target, e, id);
+            }
+        }
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action
+     * while the dragged item is over the drop target and optionally cancel the onDragOver.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOver : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onDragOut : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragOut(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                target.notifyOut(this, e, this.dragData);
+            }
+            this.proxy.reset();
+            if(this.afterDragOut){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after the dragged item is dragged out of the target without dropping.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dragged element
+                 * @method afterDragOut
+                 */
+                this.afterDragOut(target, e, id);
+            }
+        }
+        this.cachedTarget = null;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dragged out of the target without dropping, and optionally cancel the onDragOut.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    beforeDragOut : function(target, e, id){
+        return true;
+    },
+    
+    // private
+    onDragDrop : function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
+        if(this.beforeDragDrop(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                if(target.notifyDrop(this, e, this.dragData)){ // valid drop?
+                    this.onValidDrop(target, e, id);
+                }else{
+                    this.onInvalidDrop(target, e, id);
+                }
+            }else{
+                this.onValidDrop(target, e, id);
+            }
+            
+            if(this.afterDragDrop){
+                /**
+                 * An empty function by default, but provided so that you can perform a custom action
+                 * after a valid drag drop has occurred by providing an implementation.
+                 * @param {Ext.dd.DragDrop} target The drop target
+                 * @param {Event} e The event object
+                 * @param {String} id The id of the dropped element
+                 * @method afterDragDrop
+                 */
+                this.afterDragDrop(target, e, id);
+            }
+        }
+        delete this.cachedTarget;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the dragged
+     * item is dropped onto the target and optionally cancel the onDragDrop.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the drag drop event is valid, else false to cancel
+     */
+    beforeDragDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    onValidDrop : function(target, e, id){
+        this.hideProxy();
+        if(this.afterValidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after a valid drop has occurred by providing an implementation.
+             * @param {Object} target The target DD 
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterValidDrop(target, e, id);
+        }
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return this.el.getXY();  
+    },
+
+    // private
+    onInvalidDrop : function(target, e, id){
+        this.beforeInvalidDrop(target, e, id);
+        if(this.cachedTarget){
+            if(this.cachedTarget.isNotifyTarget){
+                this.cachedTarget.notifyOut(this, e, this.dragData);
+            }
+            this.cacheTarget = null;
+        }
+        this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
+
+        if(this.afterInvalidDrop){
+            /**
+             * An empty function by default, but provided so that you can perform a custom action
+             * after an invalid drop has occurred by providing an implementation.
+             * @param {Event} e The event object
+             * @param {String} id The id of the dropped element
+             * @method afterInvalidDrop
+             */
+            this.afterInvalidDrop(e, id);
+        }
+    },
+
+    // private
+    afterRepair : function(){
+        if(Ext.enableFx){
+            this.el.highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action after an invalid
+     * drop has occurred.
+     * @param {Ext.dd.DragDrop} target The drop target
+     * @param {Event} e The event object
+     * @param {String} id The id of the dragged element
+     * @return {Boolean} isValid True if the invalid drop should proceed, else false to cancel
+     */
+    beforeInvalidDrop : function(target, e, id){
+        return true;
+    },
+
+    // private
+    handleMouseDown : function(e){
+        if(this.dragging) {
+            return;
+        }
+        var data = this.getDragData(e);
+        if(data && this.onBeforeDrag(data, e) !== false){
+            this.dragData = data;
+            this.proxy.stop();
+            Ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
+        } 
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action before the initial
+     * drag event begins and optionally cancel it.
+     * @param {Object} data An object containing arbitrary data to be shared with drop targets
+     * @param {Event} e The event object
+     * @return {Boolean} isValid True if the drag event is valid, else false to cancel
+     */
+    onBeforeDrag : function(data, e){
+        return true;
+    },
+
+    /**
+     * An empty function by default, but provided so that you can perform a custom action once the initial
+     * drag event has begun.  The drag cannot be canceled from this function.
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     */
+    onStartDrag : Ext.emptyFn,
+
+    // private override
+    startDrag : function(x, y){
+        this.proxy.reset();
+        this.dragging = true;
+        this.proxy.update("");
+        this.onInitDrag(x, y);
+        this.proxy.show();
+    },
+
+    // private
+    onInitDrag : function(x, y){
+        var clone = this.el.dom.cloneNode(true);
+        clone.id = Ext.id(); // prevent duplicate ids
+        this.proxy.update(clone);
+        this.onStartDrag(x, y);
+        return true;
+    },
+
+    /**
+     * Returns the drag source's underlying {@link Ext.dd.StatusProxy}
+     * @return {Ext.dd.StatusProxy} proxy The StatusProxy
+     */
+    getProxy : function(){
+        return this.proxy;  
+    },
+
+    /**
+     * Hides the drag source's {@link Ext.dd.StatusProxy}
+     */
+    hideProxy : function(){
+        this.proxy.hide();  
+        this.proxy.reset(true);
+        this.dragging = false;
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    },
+
+    // private - override to prevent hiding
+    b4EndDrag: function(e) {
+    },
+
+    // private - override to prevent moving
+    endDrag : function(e){
+        this.onEndDrag(this.dragData, e);
+    },
+
+    // private
+    onEndDrag : function(data, e){
+    },
+    
+    // private - pin to cursor
+    autoOffset : function(x, y) {
+        this.setDelta(-12, -20);
+    },
+    
+    destroy: function(){
+        Ext.dd.DragSource.superclass.destroy.call(this);
+        Ext.destroy(this.proxy);
+    }
+});/**
+ * @class Ext.dd.DropTarget
+ * @extends Ext.dd.DDTarget
+ * A simple class that provides the basic implementation needed to make any element a drop target that can have
+ * draggable items dropped onto it.  The drop has no effect until an implementation of notifyDrop is provided.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropTarget = Ext.extend(Ext.dd.DDTarget, {
+    
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+    
+        Ext.apply(this, config);
+    
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    
+        Ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+              {isTarget: true});        
+    },
+    
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to undefined).
+     */
+    /**
+     * @cfg {String} overClass
+     * The CSS class applied to the drop target element while the drag source is over it (defaults to "").
+     */
+    /**
+     * @cfg {String} dropAllowed
+     * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
+     */
+    dropAllowed : "x-dd-drop-ok",
+    /**
+     * @cfg {String} dropNotAllowed
+     * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
+     */
+    dropNotAllowed : "x-dd-drop-nodrop",
+
+    // private
+    isTarget : true,
+
+    // private
+    isNotifyTarget : true,
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source is now over the
+     * target.  This default implementation adds the CSS class specified by overClass (if any) to the drop element
+     * and returns the dropAllowed config value.  This method should be overridden if drop validation is required.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        if(this.overClass){
+            this.el.addClass(this.overClass);
+        }
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the target.
+     * This method will be called on every mouse movement while the drag source is over the drop target.
+     * This default implementation simply returns the dropAllowed config value.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source has been dragged
+     * out of the target without dropping.  This default implementation simply removes the CSS class specified by
+     * overClass (if any) from the drop element.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    notifyOut : function(dd, e, data){
+        if(this.overClass){
+            this.el.removeClass(this.overClass);
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the dragged item has
+     * been dropped on it.  This method has no default implementation and returns false, so you must provide an
+     * implementation that does something to process the drop event and returns true so that the drag source's
+     * repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        return false;
+    },
+    
+    destroy : function(){
+        Ext.dd.DropTarget.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});/**
+ * @class Ext.dd.DragZone
+ * @extends Ext.dd.DragSource
+ * <p>This class provides a container DD instance that allows dragging of multiple child source nodes.</p>
+ * <p>This class does not move the drag target nodes, but a proxy element which may contain
+ * any DOM structure you wish. The DOM element to show in the proxy is provided by either a
+ * provided implementation of {@link #getDragData}, or by registered draggables registered with {@link Ext.dd.Registry}</p>
+ * <p>If you wish to provide draggability for an arbitrary number of DOM nodes, each of which represent some
+ * application object (For example nodes in a {@link Ext.DataView DataView}) then use of this class
+ * is the most efficient way to "activate" those nodes.</p>
+ * <p>By default, this class requires that draggable child nodes are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DragZone to manage any number of draggable elements is to configure
+ * the DragZone with  an implementation of the {@link #getDragData} method which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector. For example, to make the nodes of a DataView draggable, use the following
+ * technique. Knowledge of the use of the DataView is required:</p><pre><code>
+myDataView.on('render', function(v) {
+    myDataView.dragZone = new Ext.dd.DragZone(v.getEl(), {
+
+//      On receipt of a mousedown event, see if it is within a DataView node.
+//      Return a drag data object if so.
+        getDragData: function(e) {
+
+//          Use the DataView's own itemSelector (a mandatory property) to
+//          test if the mousedown is within one of the DataView's nodes.
+            var sourceEl = e.getTarget(v.itemSelector, 10);
+
+//          If the mousedown is within a DataView node, clone the node to produce
+//          a ddel element for use by the drag proxy. Also add application data
+//          to the returned data object.
+            if (sourceEl) {
+                d = sourceEl.cloneNode(true);
+                d.id = Ext.id();
+                return {
+                    ddel: d,
+                    sourceEl: sourceEl,
+                    repairXY: Ext.fly(sourceEl).getXY(),
+                    sourceStore: v.store,
+                    draggedRecord: v.{@link Ext.DataView#getRecord getRecord}(sourceEl)
+                }
+            }
+        },
+
+//      Provide coordinates for the proxy to slide back to on failed drag.
+//      This is the original XY coordinates of the draggable element captured
+//      in the getDragData method.
+        getRepairXY: function() {
+            return this.dragData.repairXY;
+        }
+    });
+});</code></pre>
+ * See the {@link Ext.dd.DropZone DropZone} documentation for details about building a DropZone which
+ * cooperates with this DragZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DragZone = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(el, config){
+        Ext.dd.DragZone.superclass.constructor.call(this, el, config);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.el);
+        }
+    },
+    
+    /**
+     * This property contains the data representing the dragged object. This data is set up by the implementation
+     * of the {@link #getDragData} method. It must contain a <tt>ddel</tt> property, but can contain
+     * any other data according to the application's needs.
+     * @type Object
+     * @property dragData
+     */
+    /**
+     * @cfg {Boolean} containerScroll True to register this container with the Scrollmanager
+     * for auto scrolling during drag operations.
+     */
+    /**
+     * @cfg {String} hlColor The color to use when visually highlighting the drag source in the afterRepair
+     * method after a failed drop (defaults to "c3daf9" - light blue)
+     */
+
+    /**
+     * Called when a mousedown occurs in this container. Looks in {@link Ext.dd.Registry}
+     * for a valid target to drag based on the mouse down. Override this method
+     * to provide your own lookup logic (e.g. finding a child by class name). Make sure your returned
+     * object has a "ddel" attribute (with an HTML Element) for other functions to work.
+     * @param {EventObject} e The mouse down event
+     * @return {Object} The dragData
+     */
+    getDragData : function(e){
+        return Ext.dd.Registry.getHandleFromEvent(e);
+    },
+    
+    /**
+     * Called once drag threshold has been reached to initialize the proxy element. By default, it clones the
+     * this.dragData.ddel
+     * @param {Number} x The x position of the click on the dragged object
+     * @param {Number} y The y position of the click on the dragged object
+     * @return {Boolean} true to continue the drag, false to cancel
+     */
+    onInitDrag : function(x, y){
+        this.proxy.update(this.dragData.ddel.cloneNode(true));
+        this.onStartDrag(x, y);
+        return true;
+    },
+    
+    /**
+     * Called after a repair of an invalid drop. By default, highlights this.dragData.ddel 
+     */
+    afterRepair : function(){
+        if(Ext.enableFx){
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    },
+
+    /**
+     * Called before a repair of an invalid drop to get the XY to animate to. By default returns
+     * the XY of this.dragData.ddel
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e){
+        return Ext.Element.fly(this.dragData.ddel).getXY();  
+    },
+    
+    destroy : function(){
+        Ext.dd.DragZone.superclass.destroy.call(this);
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.unregister(this.el);
+        }
+    }
+});/**
+ * @class Ext.dd.DropZone
+ * @extends Ext.dd.DropTarget
+ * <p>This class provides a container DD instance that allows dropping on multiple child target nodes.</p>
+ * <p>By default, this class requires that child nodes accepting drop are registered with {@link Ext.dd.Registry}.
+ * However a simpler way to allow a DropZone to manage any number of target elements is to configure the
+ * DropZone with an implementation of {@link #getTargetFromEvent} which interrogates the passed
+ * mouse event to see if it has taken place within an element, or class of elements. This is easily done
+ * by using the event's {@link Ext.EventObject#getTarget getTarget} method to identify a node based on a
+ * {@link Ext.DomQuery} selector.</p>
+ * <p>Once the DropZone has detected through calling getTargetFromEvent, that the mouse is over
+ * a drop target, that target is passed as the first parameter to {@link #onNodeEnter}, {@link #onNodeOver},
+ * {@link #onNodeOut}, {@link #onNodeDrop}. You may configure the instance of DropZone with implementations
+ * of these methods to provide application-specific behaviour for these events to update both
+ * application state, and UI state.</p>
+ * <p>For example to make a GridPanel a cooperating target with the example illustrated in
+ * {@link Ext.dd.DragZone DragZone}, the following technique might be used:</p><pre><code>
+myGridPanel.on('render', function() {
+    myGridPanel.dropZone = new Ext.dd.DropZone(myGridPanel.getView().scroller, {
+
+//      If the mouse is over a grid row, return that node. This is
+//      provided as the "target" parameter in all "onNodeXXXX" node event handling functions
+        getTargetFromEvent: function(e) {
+            return e.getTarget(myGridPanel.getView().rowSelector);
+        },
+
+//      On entry into a target node, highlight that node.
+        onNodeEnter : function(target, dd, e, data){ 
+            Ext.fly(target).addClass('my-row-highlight-class');
+        },
+
+//      On exit from a target node, unhighlight that node.
+        onNodeOut : function(target, dd, e, data){ 
+            Ext.fly(target).removeClass('my-row-highlight-class');
+        },
+
+//      While over a target node, return the default drop allowed class which
+//      places a "tick" icon into the drag proxy.
+        onNodeOver : function(target, dd, e, data){ 
+            return Ext.dd.DropZone.prototype.dropAllowed;
+        },
+
+//      On node drop we can interrogate the target to find the underlying
+//      application object that is the real target of the dragged data.
+//      In this case, it is a Record in the GridPanel's Store.
+//      We can use the data set up by the DragZone's getDragData method to read
+//      any data we decided to attach in the DragZone's getDragData method.
+        onNodeDrop : function(target, dd, e, data){
+            var rowIndex = myGridPanel.getView().findRowIndex(target);
+            var r = myGridPanel.getStore().getAt(rowIndex);
+            Ext.Msg.alert('Drop gesture', 'Dropped Record id ' + data.draggedRecord.id +
+                ' on Record id ' + r.id);
+            return true;
+        }
+    });
+}
+</code></pre>
+ * See the {@link Ext.dd.DragZone DragZone} documentation for details about building a DragZone which
+ * cooperates with this DropZone.
+ * @constructor
+ * @param {Mixed} el The container element
+ * @param {Object} config
+ */
+Ext.dd.DropZone = function(el, config){
+    Ext.dd.DropZone.superclass.constructor.call(this, el, config);
+};
+
+Ext.extend(Ext.dd.DropZone, Ext.dd.DropTarget, {
+    /**
+     * Returns a custom data object associated with the DOM node that is the target of the event.  By default
+     * this looks up the event target in the {@link Ext.dd.Registry}, although you can override this method to
+     * provide your own custom lookup.
+     * @param {Event} e The event
+     * @return {Object} data The custom data
+     */
+    getTargetFromEvent : function(e){
+        return Ext.dd.Registry.getTargetFromEvent(e);
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has entered a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from 
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeEnter : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is over a drop node
+     * that has either been registered or detected by a configured implementation of {@link #getTargetFromEvent}.
+     * The default implementation returns this.dropNotAllowed, so it should be
+     * overridden to provide the proper feedback.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onNodeOver : function(n, dd, e, data){
+        return this.dropAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dragged out of
+     * the drop node without dropping.  This method has no default implementation and should be overridden to provide
+     * node-specific processing if necessary.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     */
+    onNodeOut : function(n, dd, e, data){
+        
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped onto
+     * the drop node.  The default implementation returns false, so it should be overridden to provide the
+     * appropriate processing of the drop event and return true so that the drag source's repair action does not run.
+     * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from
+     * {@link #getTargetFromEvent} for this node)
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onNodeDrop : function(n, dd, e, data){
+        return false;
+    },
+
+    /**
+     * Called while the DropZone determines that a {@link Ext.dd.DragSource} is being dragged over it,
+     * but not over any of its registered drop nodes.  The default implementation returns this.dropNotAllowed, so
+     * it should be overridden to provide the proper feedback if necessary.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    onContainerOver : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * Called when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped on it,
+     * but not on any of its registered drop nodes.  The default implementation returns false, so it should be
+     * overridden to provide the appropriate processing of the drop event if you need the drop zone itself to
+     * be able to accept drops.  It should return true when valid so that the drag source's repair action does not run.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    onContainerDrop : function(dd, e, data){
+        return false;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source is now over
+     * the zone.  The default implementation returns this.dropNotAllowed and expects that only registered drop
+     * nodes can process drag drop operations, so if you need the drop zone itself to be able to process drops
+     * you should override this method and provide a custom implementation.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyEnter : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the drop zone.
+     * This method will be called on every mouse movement while the drag source is over the drop zone.
+     * It will call {@link #onNodeOver} while the drag source is over a registered node, and will also automatically
+     * delegate to the appropriate node-specific methods as necessary when the drag source enters and exits
+     * registered nodes ({@link #onNodeEnter}, {@link #onNodeOut}). If the drag source is not currently over a
+     * registered node, it will call {@link #onContainerOver}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {String} status The CSS class that communicates the drop status back to the source so that the
+     * underlying {@link Ext.dd.StatusProxy} can be updated
+     */
+    notifyOver : function(dd, e, data){
+        var n = this.getTargetFromEvent(e);
+        if(!n){ // not over valid drop target
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+                this.lastOverNode = null;
+            }
+            return this.onContainerOver(dd, e, data);
+        }
+        if(this.lastOverNode != n){
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+            }
+            this.onNodeEnter(n, dd, e, data);
+            this.lastOverNode = n;
+        }
+        return this.onNodeOver(n, dd, e, data);
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source has been dragged
+     * out of the zone without dropping.  If the drag source is currently over a registered node, the notification
+     * will be delegated to {@link #onNodeOut} for node-specific handling, otherwise it will be ignored.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag zone
+     */
+    notifyOut : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+    },
+
+    /**
+     * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the dragged item has
+     * been dropped on it.  The drag zone will look up the target node based on the event passed in, and if there
+     * is a node registered for that event, it will delegate to {@link #onNodeDrop} for node-specific handling,
+     * otherwise it will call {@link #onContainerDrop}.
+     * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone
+     * @param {Event} e The event
+     * @param {Object} data An object containing arbitrary data supplied by the drag source
+     * @return {Boolean} True if the drop was valid, else false
+     */
+    notifyDrop : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+        var n = this.getTargetFromEvent(e);
+        return n ?
+            this.onNodeDrop(n, dd, e, data) :
+            this.onContainerDrop(dd, e, data);
+    },
+
+    // private
+    triggerCacheRefresh : function(){
+        Ext.dd.DDM.refreshCache(this.groups);
+    }  
+});/**
+ * @class Ext.Element
+ */
+Ext.Element.addMethods({
+    /**
+     * Initializes a {@link Ext.dd.DD} drag drop object for this element.
+     * @param {String} group The group the DD object is member of
+     * @param {Object} config The DD config object
+     * @param {Object} overrides An object containing methods to override/implement on the DD object
+     * @return {Ext.dd.DD} The DD object
+     */
+    initDD : function(group, config, overrides){
+        var dd = new Ext.dd.DD(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDProxy} object for this element.
+     * @param {String} group The group the DDProxy object is member of
+     * @param {Object} config The DDProxy config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDProxy object
+     * @return {Ext.dd.DDProxy} The DDProxy object
+     */
+    initDDProxy : function(group, config, overrides){
+        var dd = new Ext.dd.DDProxy(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    },
+
+    /**
+     * Initializes a {@link Ext.dd.DDTarget} object for this element.
+     * @param {String} group The group the DDTarget object is member of
+     * @param {Object} config The DDTarget config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDTarget object
+     * @return {Ext.dd.DDTarget} The DDTarget object
+     */
+    initDDTarget : function(group, config, overrides){
+        var dd = new Ext.dd.DDTarget(Ext.id(this.dom), group, config);
+        return Ext.apply(dd, overrides);
+    }
+});
+/**
+ * @class Ext.data.Api
+ * @extends Object
+ * Ext.data.Api is a singleton designed to manage the data API including methods
+ * for validating a developer's DataProxy API.  Defines variables for CRUD actions
+ * create, read, update and destroy in addition to a mapping of RESTful HTTP methods
+ * GET, POST, PUT and DELETE to CRUD actions.
+ * @singleton
+ */
+Ext.data.Api = (function() {
+
+    // private validActions.  validActions is essentially an inverted hash of Ext.data.Api.actions, where value becomes the key.
+    // Some methods in this singleton (e.g.: getActions, getVerb) will loop through actions with the code <code>for (var verb in this.actions)</code>
+    // For efficiency, some methods will first check this hash for a match.  Those methods which do acces validActions will cache their result here.
+    // We cannot pre-define this hash since the developer may over-ride the actions at runtime.
+    var validActions = {};
+
+    return {
+        /**
+         * Defined actions corresponding to remote actions:
+         * <pre><code>
+actions: {
+    create  : 'create',  // Text representing the remote-action to create records on server.
+    read    : 'read',    // Text representing the remote-action to read/load data from server.
+    update  : 'update',  // Text representing the remote-action to update records on server.
+    destroy : 'destroy'  // Text representing the remote-action to destroy records on server.
+}
+         * </code></pre>
+         * @property actions
+         * @type Object
+         */
+        actions : {
+            create  : 'create',
+            read    : 'read',
+            update  : 'update',
+            destroy : 'destroy'
+        },
+
+        /**
+         * Defined {CRUD action}:{HTTP method} pairs to associate HTTP methods with the
+         * corresponding actions for {@link Ext.data.DataProxy#restful RESTful proxies}.
+         * Defaults to:
+         * <pre><code>
+restActions : {
+    create  : 'POST',
+    read    : 'GET',
+    update  : 'PUT',
+    destroy : 'DELETE'
+},
+         * </code></pre>
+         */
+        restActions : {
+            create  : 'POST',
+            read    : 'GET',
+            update  : 'PUT',
+            destroy : 'DELETE'
+        },
+
+        /**
+         * Returns true if supplied action-name is a valid API action defined in <code>{@link #actions}</code> constants
+         * @param {String} action Action to test for availability.
+         * @return {Boolean}
+         */
+        isAction : function(action) {
+            return (Ext.data.Api.actions[action]) ? true : false;
+        },
+
+        /**
+         * Returns the actual CRUD action KEY "create", "read", "update" or "destroy" from the supplied action-name.  This method is used internally and shouldn't generally
+         * need to be used directly.  The key/value pair of Ext.data.Api.actions will often be identical but this is not necessarily true.  A developer can override this naming
+         * convention if desired.  However, the framework internally calls methods based upon the KEY so a way of retreiving the the words "create", "read", "update" and "destroy" is
+         * required.  This method will cache discovered KEYS into the private validActions hash.
+         * @param {String} name The runtime name of the action.
+         * @return {String||null} returns the action-key, or verb of the user-action or null if invalid.
+         * @nodoc
+         */
+        getVerb : function(name) {
+            if (validActions[name]) {
+                return validActions[name];  // <-- found in cache.  return immediately.
+            }
+            for (var verb in this.actions) {
+                if (this.actions[verb] === name) {
+                    validActions[name] = verb;
+                    break;
+                }
+            }
+            return (validActions[name] !== undefined) ? validActions[name] : null;
+        },
+
+        /**
+         * Returns true if the supplied API is valid; that is, check that all keys match defined actions
+         * otherwise returns an array of mistakes.
+         * @return {String[]|true}
+         */
+        isValid : function(api){
+            var invalid = [];
+            var crud = this.actions; // <-- cache a copy of the actions.
+            for (var action in api) {
+                if (!(action in crud)) {
+                    invalid.push(action);
+                }
+            }
+            return (!invalid.length) ? true : invalid;
+        },
+
+        /**
+         * Returns true if the supplied verb upon the supplied proxy points to a unique url in that none of the other api-actions
+         * point to the same url.  The question is important for deciding whether to insert the "xaction" HTTP parameter within an
+         * Ajax request.  This method is used internally and shouldn't generally need to be called directly.
+         * @param {Ext.data.DataProxy} proxy
+         * @param {String} verb
+         * @return {Boolean}
+         */
+        hasUniqueUrl : function(proxy, verb) {
+            var url = (proxy.api[verb]) ? proxy.api[verb].url : null;
+            var unique = true;
+            for (var action in proxy.api) {
+                if ((unique = (action === verb) ? true : (proxy.api[action].url != url) ? true : false) === false) {
+                    break;
+                }
+            }
+            return unique;
+        },
+
+        /**
+         * This method is used internally by <tt>{@link Ext.data.DataProxy DataProxy}</tt> and should not generally need to be used directly.
+         * Each action of a DataProxy api can be initially defined as either a String or an Object.  When specified as an object,
+         * one can explicitly define the HTTP method (GET|POST) to use for each CRUD action.  This method will prepare the supplied API, setting
+         * each action to the Object form.  If your API-actions do not explicitly define the HTTP method, the "method" configuration-parameter will
+         * be used.  If the method configuration parameter is not specified, POST will be used.
+         <pre><code>
+new Ext.data.HttpProxy({
+    method: "POST",     // <-- default HTTP method when not specified.
+    api: {
+        create: 'create.php',
+        load: 'read.php',
+        save: 'save.php',
+        destroy: 'destroy.php'
+    }
+});
+
+// Alternatively, one can use the object-form to specify the API
+new Ext.data.HttpProxy({
+    api: {
+        load: {url: 'read.php', method: 'GET'},
+        create: 'create.php',
+        destroy: 'destroy.php',
+        save: 'update.php'
+    }
+});
+        </code></pre>
+         *
+         * @param {Ext.data.DataProxy} proxy
+         */
+        prepare : function(proxy) {
+            if (!proxy.api) {
+                proxy.api = {}; // <-- No api?  create a blank one.
+            }
+            for (var verb in this.actions) {
+                var action = this.actions[verb];
+                proxy.api[action] = proxy.api[action] || proxy.url || proxy.directFn;
+                if (typeof(proxy.api[action]) == 'string') {
+                    proxy.api[action] = {
+                        url: proxy.api[action],
+                        method: (proxy.restful === true) ? Ext.data.Api.restActions[action] : undefined
+                    };
+                }
+            }
+        },
+
+        /**
+         * Prepares a supplied Proxy to be RESTful.  Sets the HTTP method for each api-action to be one of
+         * GET, POST, PUT, DELETE according to the defined {@link #restActions}.
+         * @param {Ext.data.DataProxy} proxy
+         */
+        restify : function(proxy) {
+            proxy.restful = true;
+            for (var verb in this.restActions) {
+                proxy.api[this.actions[verb]].method ||
+                    (proxy.api[this.actions[verb]].method = this.restActions[verb]);
+            }
+            // TODO: perhaps move this interceptor elsewhere?  like into DataProxy, perhaps?  Placed here
+            // to satisfy initial 3.0 final release of REST features.
+            proxy.onWrite = proxy.onWrite.createInterceptor(function(action, o, response, rs) {
+                var reader = o.reader;
+                var res = new Ext.data.Response({
+                    action: action,
+                    raw: response
+                });
+
+                switch (response.status) {
+                    case 200:   // standard 200 response, send control back to HttpProxy#onWrite by returning true from this intercepted #onWrite
+                        return true;
+                        break;
+                    case 201:   // entity created but no response returned
+                        if (Ext.isEmpty(res.raw.responseText)) {
+                          res.success = true;
+                        } else {
+                          //if the response contains data, treat it like a 200
+                          return true;
+                        }
+                        break;
+                    case 204:  // no-content.  Create a fake response.
+                        res.success = true;
+                        res.data = null;
+                        break;
+                    default:
+                        return true;
+                        break;
+                }
+                if (res.success === true) {
+                    this.fireEvent("write", this, action, res.data, res, rs, o.request.arg);
+                } else {
+                    this.fireEvent('exception', this, 'remote', action, o, res, rs);
+                }
+                o.request.callback.call(o.request.scope, res.data, res, res.success);
+
+                return false;   // <-- false to prevent intercepted function from running.
+            }, proxy);
+        }
+    };
+})();
+
+/**
+ * Ext.data.Response
+ * Experimental.  Do not use directly.
+ */
+Ext.data.Response = function(params, response) {
+    Ext.apply(this, params, {
+        raw: response
+    });
+};
+Ext.data.Response.prototype = {
+    message : null,
+    success : false,
+    status : null,
+    root : null,
+    raw : null,
+
+    getMessage : function() {
+        return this.message;
+    },
+    getSuccess : function() {
+        return this.success;
+    },
+    getStatus : function() {
+        return this.status;
+    },
+    getRoot : function() {
+        return this.root;
+    },
+    getRawResponse : function() {
+        return this.raw;
+    }
+};
+
+/**
+ * @class Ext.data.Api.Error
+ * @extends Ext.Error
+ * Error class for Ext.data.Api errors
+ */
+Ext.data.Api.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.Api'
+});
+Ext.apply(Ext.data.Api.Error.prototype, {
+    lang: {
+        'action-url-undefined': 'No fallback url defined for this action.  When defining a DataProxy api, please be sure to define an url for each CRUD action in Ext.data.Api.actions or define a default url in addition to your api-configuration.',
+        'invalid': 'received an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions defined in Ext.data.Api.actions',
+        'invalid-url': 'Invalid url.  Please review your proxy configuration.',
+        'execute': 'Attempted to execute an unknown action.  Valid API actions are defined in Ext.data.Api.actions"'
+    }
+});
+
+
+
+/**
+ * @class Ext.data.SortTypes
+ * @singleton
+ * Defines the default sorting (casting?) comparison functions used when sorting data.
+ */
+Ext.data.SortTypes = {
+    /**
+     * Default sort that does nothing
+     * @param {Mixed} s The value being converted
+     * @return {Mixed} The comparison value
+     */
+    none : function(s){
+        return s;
+    },
+    
+    /**
+     * The regular expression used to strip tags
+     * @type {RegExp}
+     * @property
+     */
+    stripTagsRE : /<\/?[^>]+>/gi,
+    
+    /**
+     * Strips all HTML tags to sort on text only
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asText : function(s){
+        return String(s).replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Strips all HTML tags to sort on text only - Case insensitive
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCText : function(s){
+        return String(s).toUpperCase().replace(this.stripTagsRE, "");
+    },
+    
+    /**
+     * Case insensitive string
+     * @param {Mixed} s The value being converted
+     * @return {String} The comparison value
+     */
+    asUCString : function(s) {
+    	return String(s).toUpperCase();
+    },
+    
+    /**
+     * Date sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asDate : function(s) {
+        if(!s){
+            return 0;
+        }
+        if(Ext.isDate(s)){
+            return s.getTime();
+        }
+    	return Date.parse(String(s));
+    },
+    
+    /**
+     * Float sorting
+     * @param {Mixed} s The value being converted
+     * @return {Float} The comparison value
+     */
+    asFloat : function(s) {
+    	var val = parseFloat(String(s).replace(/,/g, ""));
+    	return isNaN(val) ? 0 : val;
+    },
+    
+    /**
+     * Integer sorting
+     * @param {Mixed} s The value being converted
+     * @return {Number} The comparison value
+     */
+    asInt : function(s) {
+        var val = parseInt(String(s).replace(/,/g, ""), 10);
+        return isNaN(val) ? 0 : val;
+    }
+};/**
+ * @class Ext.data.Record
+ * <p>Instances of this class encapsulate both Record <em>definition</em> information, and Record
+ * <em>value</em> information for use in {@link Ext.data.Store} objects, or any code which needs
+ * to access Records cached in an {@link Ext.data.Store} object.</p>
+ * <p>Constructors for this class are generated by passing an Array of field definition objects to {@link #create}.
+ * Instances are usually only created by {@link Ext.data.Reader} implementations when processing unformatted data
+ * objects.</p>
+ * <p>Note that an instance of a Record class may only belong to one {@link Ext.data.Store Store} at a time.
+ * In order to copy data from one Store to another, use the {@link #copy} method to create an exact
+ * copy of the Record, and insert the new instance into the other Store.</p>
+ * <p>When serializing a Record for submission to the server, be aware that it contains many private
+ * properties, and also a reference to its owning Store which in turn holds references to its Records.
+ * This means that a whole Record may not be encoded using {@link Ext.util.JSON.encode}. Instead, use the
+ * <code>{@link #data}</code> and <code>{@link #id}</code> properties.</p>
+ * <p>Record objects generated by this constructor inherit all the methods of Ext.data.Record listed below.</p>
+ * @constructor
+ * <p>This constructor should not be used to create Record objects. Instead, use {@link #create} to
+ * generate a subclass of Ext.data.Record configured with information about its constituent fields.<p>
+ * <p><b>The generated constructor has the same signature as this constructor.</b></p>
+ * @param {Object} data (Optional) An object, the properties of which provide values for the new Record's
+ * fields. If not specified the <code>{@link Ext.data.Field#defaultValue defaultValue}</code>
+ * for each field will be assigned.
+ * @param {Object} id (Optional) The id of the Record. The id is used by the
+ * {@link Ext.data.Store} object which owns the Record to index its collection
+ * of Records (therefore this id should be unique within each store). If an
+ * <code>id</code> is not specified a <b><code>{@link #phantom}</code></b>
+ * Record will be created with an {@link #Record.id automatically generated id}.
+ */
+Ext.data.Record = function(data, id){
+    // if no id, call the auto id method
+    this.id = (id || id === 0) ? id : Ext.data.Record.id(this);
+    this.data = data || {};
+};
+
+/**
+ * Generate a constructor for a specific Record layout.
+ * @param {Array} o An Array of <b>{@link Ext.data.Field Field}</b> definition objects.
+ * The constructor generated by this method may be used to create new Record instances. The data
+ * object must contain properties named after the {@link Ext.data.Field field}
+ * <b><tt>{@link Ext.data.Field#name}s</tt></b>.  Example usage:<pre><code>
+// create a Record constructor from a description of the fields
+var TopicRecord = Ext.data.Record.create([ // creates a subclass of Ext.data.Record
+    {{@link Ext.data.Field#name name}: 'title', {@link Ext.data.Field#mapping mapping}: 'topic_title'},
+    {name: 'author', mapping: 'username', allowBlank: false},
+    {name: 'totalPosts', mapping: 'topic_replies', type: 'int'},
+    {name: 'lastPost', mapping: 'post_time', type: 'date'},
+    {name: 'lastPoster', mapping: 'user2'},
+    {name: 'excerpt', mapping: 'post_text', allowBlank: false},
+    // In the simplest case, if no properties other than <tt>name</tt> are required,
+    // a field definition may consist of just a String for the field name.
+    'signature'
+]);
+
+// create Record instance
+var myNewRecord = new TopicRecord(
+    {
+        title: 'Do my job please',
+        author: 'noobie',
+        totalPosts: 1,
+        lastPost: new Date(),
+        lastPoster: 'Animal',
+        excerpt: 'No way dude!',
+        signature: ''
+    },
+    id // optionally specify the id of the record otherwise {@link #Record.id one is auto-assigned}
+);
+myStore.{@link Ext.data.Store#add add}(myNewRecord);
+</code></pre>
+ * @method create
+ * @return {Function} A constructor which is used to create new Records according
+ * to the definition. The constructor has the same signature as {@link #Record}.
+ * @static
+ */
+Ext.data.Record.create = function(o){
+    var f = Ext.extend(Ext.data.Record, {});
+    var p = f.prototype;
+    p.fields = new Ext.util.MixedCollection(false, function(field){
+        return field.name;
+    });
+    for(var i = 0, len = o.length; i < len; i++){
+        p.fields.add(new Ext.data.Field(o[i]));
+    }
+    f.getField = function(name){
+        return p.fields.get(name);
+    };
+    return f;
+};
+
+Ext.data.Record.PREFIX = 'ext-record';
+Ext.data.Record.AUTO_ID = 1;
+Ext.data.Record.EDIT = 'edit';
+Ext.data.Record.REJECT = 'reject';
+Ext.data.Record.COMMIT = 'commit';
+
+
+/**
+ * Generates a sequential id. This method is typically called when a record is {@link #create}d
+ * and {@link #Record no id has been specified}. The returned id takes the form:
+ * <tt>&#123;PREFIX}-&#123;AUTO_ID}</tt>.<div class="mdetail-params"><ul>
+ * <li><b><tt>PREFIX</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.PREFIX</tt>
+ * (defaults to <tt>'ext-record'</tt>)</p></li>
+ * <li><b><tt>AUTO_ID</tt></b> : String<p class="sub-desc"><tt>Ext.data.Record.AUTO_ID</tt>
+ * (defaults to <tt>1</tt> initially)</p></li>
+ * </ul></div>
+ * @param {Record} rec The record being created.  The record does not exist, it's a {@link #phantom}.
+ * @return {String} auto-generated string id, <tt>"ext-record-i++'</tt>;
+ */
+Ext.data.Record.id = function(rec) {
+    rec.phantom = true;
+    return [Ext.data.Record.PREFIX, '-', Ext.data.Record.AUTO_ID++].join('');
+};
+
+Ext.data.Record.prototype = {
+    /**
+     * <p><b>This property is stored in the Record definition's <u>prototype</u></b></p>
+     * A MixedCollection containing the defined {@link Ext.data.Field Field}s for this Record.  Read-only.
+     * @property fields
+     * @type Ext.util.MixedCollection
+     */
+    /**
+     * An object hash representing the data for this Record. Every field name in the Record definition
+     * is represented by a property of that name in this object. Note that unless you specified a field
+     * with {@link Ext.data.Field#name name} "id" in the Record definition, this will <b>not</b> contain
+     * an <tt>id</tt> property.
+     * @property data
+     * @type {Object}
+     */
+    /**
+     * The unique ID of the Record {@link #Record as specified at construction time}.
+     * @property id
+     * @type {Object}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.XmlReader XmlReader}</b>.</p>
+     * <p>The XML element which was the source of the data for this Record.</p>
+     * @property node
+     * @type {XMLElement}
+     */
+    /**
+     * <p><b>Only present if this Record was created by an {@link Ext.data.ArrayReader ArrayReader} or a {@link Ext.data.JsonReader JsonReader}</b>.</p>
+     * <p>The Array or object which was the source of the data for this Record.</p>
+     * @property json
+     * @type {Array|Object}
+     */
+    /**
+     * Readonly flag - true if this Record has been modified.
+     * @type Boolean
+     */
+    dirty : false,
+    editing : false,
+    error : null,
+    /**
+     * This object contains a key and value storing the original values of all modified
+     * fields or is null if no fields have been modified.
+     * @property modified
+     * @type {Object}
+     */
+    modified : null,
+    /**
+     * <tt>true</tt> when the record does not yet exist in a server-side database (see
+     * {@link #markDirty}).  Any record which has a real database pk set as its id property
+     * is NOT a phantom -- it's real.
+     * @property phantom
+     * @type {Boolean}
+     */
+    phantom : false,
+
+    // private
+    join : function(store){
+        /**
+         * The {@link Ext.data.Store} to which this Record belongs.
+         * @property store
+         * @type {Ext.data.Store}
+         */
+        this.store = store;
+    },
+
+    /**
+     * Set the {@link Ext.data.Field#name named field} to the specified value.  For example:
+     * <pre><code>
+// record has a field named 'firstname'
+var Employee = Ext.data.Record.{@link #create}([
+    {name: 'firstname'},
+    ...
+]);
+
+// update the 2nd record in the store:
+var rec = myStore.{@link Ext.data.Store#getAt getAt}(1);
+
+// set the value (shows dirty flag):
+rec.set('firstname', 'Betty');
+
+// commit the change (removes dirty flag):
+rec.{@link #commit}();
+
+// update the record in the store, bypass setting dirty flag,
+// and do not store the change in the {@link Ext.data.Store#getModifiedRecords modified records}
+rec.{@link #data}['firstname'] = 'Wilma'; // updates record, but not the view
+rec.{@link #commit}(); // updates the view
+     * </code></pre>
+     * <b>Notes</b>:<div class="mdetail-params"><ul>
+     * <li>If the store has a writer and <code>autoSave=true</code>, each set()
+     * will execute an XHR to the server.</li>
+     * <li>Use <code>{@link #beginEdit}</code> to prevent the store's <code>update</code>
+     * event firing while using set().</li>
+     * <li>Use <code>{@link #endEdit}</code> to have the store's <code>update</code>
+     * event fire.</li>
+     * </ul></div>
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to set.
+     * @param {String/Object/Array} value The value to set the field to.
+     */
+    set : function(name, value){
+        var encode = Ext.isPrimitive(value) ? String : Ext.encode;
+        if(encode(this.data[name]) == encode(value)) {
+            return;
+        }        
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        if(this.modified[name] === undefined){
+            this.modified[name] = this.data[name];
+        }
+        this.data[name] = value;
+        if(!this.editing){
+            this.afterEdit();
+        }
+    },
+
+    // private
+    afterEdit : function(){
+        if (this.store != undefined && typeof this.store.afterEdit == "function") {
+            this.store.afterEdit(this);
+        }
+    },
+
+    // private
+    afterReject : function(){
+        if(this.store){
+            this.store.afterReject(this);
+        }
+    },
+
+    // private
+    afterCommit : function(){
+        if(this.store){
+            this.store.afterCommit(this);
+        }
+    },
+
+    /**
+     * Get the value of the {@link Ext.data.Field#name named field}.
+     * @param {String} name The {@link Ext.data.Field#name name of the field} to get the value of.
+     * @return {Object} The value of the field.
+     */
+    get : function(name){
+        return this.data[name];
+    },
+
+    /**
+     * Begin an edit. While in edit mode, no events (e.g.. the <code>update</code> event)
+     * are relayed to the containing store.
+     * See also: <code>{@link #endEdit}</code> and <code>{@link #cancelEdit}</code>.
+     */
+    beginEdit : function(){
+        this.editing = true;
+        this.modified = this.modified || {};
+    },
+
+    /**
+     * Cancels all changes made in the current edit operation.
+     */
+    cancelEdit : function(){
+        this.editing = false;
+        delete this.modified;
+    },
+
+    /**
+     * End an edit. If any data was modified, the containing store is notified
+     * (ie, the store's <code>update</code> event will fire).
+     */
+    endEdit : function(){
+        this.editing = false;
+        if(this.dirty){
+            this.afterEdit();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Rejects all changes made to the Record since either creation, or the last commit operation.
+     * Modified fields are reverted to their original values.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of reject operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    reject : function(silent){
+        var m = this.modified;
+        for(var n in m){
+            if(typeof m[n] != "function"){
+                this.data[n] = m[n];
+            }
+        }
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterReject();
+        }
+    },
+
+    /**
+     * Usually called by the {@link Ext.data.Store} which owns the Record.
+     * Commits all changes made to the Record since either creation, or the last commit operation.
+     * <p>Developers should subscribe to the {@link Ext.data.Store#update} event
+     * to have their code notified of commit operations.</p>
+     * @param {Boolean} silent (optional) True to skip notification of the owning
+     * store of the change (defaults to false)
+     */
+    commit : function(silent){
+        this.dirty = false;
+        delete this.modified;
+        this.editing = false;
+        if(silent !== true){
+            this.afterCommit();
+        }
+    },
+
+    /**
+     * Gets a hash of only the fields that have been modified since this Record was created or commited.
+     * @return Object
+     */
+    getChanges : function(){
+        var m = this.modified, cs = {};
+        for(var n in m){
+            if(m.hasOwnProperty(n)){
+                cs[n] = this.data[n];
+            }
+        }
+        return cs;
+    },
+
+    // private
+    hasError : function(){
+        return this.error !== null;
+    },
+
+    // private
+    clearError : function(){
+        this.error = null;
+    },
+
+    /**
+     * Creates a copy (clone) of this Record.
+     * @param {String} id (optional) A new Record id, defaults to the id
+     * of the record being copied. See <code>{@link #id}</code>. 
+     * To generate a phantom record with a new id use:<pre><code>
+var rec = record.copy(); // clone the record
+Ext.data.Record.id(rec); // automatically generate a unique sequential id
+     * </code></pre>
+     * @return {Record}
+     */
+    copy : function(newId) {
+        return new this.constructor(Ext.apply({}, this.data), newId || this.id);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the passed field name has been <code>{@link #modified}</code>
+     * since the load or last commit.
+     * @param {String} fieldName {@link Ext.data.Field.{@link Ext.data.Field#name}
+     * @return {Boolean}
+     */
+    isModified : function(fieldName){
+        return !!(this.modified && this.modified.hasOwnProperty(fieldName));
+    },
+
+    /**
+     * By default returns <tt>false</tt> if any {@link Ext.data.Field field} within the
+     * record configured with <tt>{@link Ext.data.Field#allowBlank} = false</tt> returns
+     * <tt>true</tt> from an {@link Ext}.{@link Ext#isEmpty isempty} test.
+     * @return {Boolean}
+     */
+    isValid : function() {
+        return this.fields.find(function(f) {
+            return (f.allowBlank === false && Ext.isEmpty(this.data[f.name])) ? true : false;
+        },this) ? false : true;
+    },
+
+    /**
+     * <p>Marks this <b>Record</b> as <code>{@link #dirty}</code>.  This method
+     * is used interally when adding <code>{@link #phantom}</code> records to a
+     * {@link Ext.data.Store#writer writer enabled store}.</p>
+     * <br><p>Marking a record <code>{@link #dirty}</code> causes the phantom to
+     * be returned by {@link Ext.data.Store#getModifiedRecords} where it will
+     * have a create action composed for it during {@link Ext.data.Store#save store save}
+     * operations.</p>
+     */
+    markDirty : function(){
+        this.dirty = true;
+        if(!this.modified){
+            this.modified = {};
+        }
+        this.fields.each(function(f) {
+            this.modified[f.name] = this.data[f.name];
+        },this);
+    }
+};
+/**
+ * @class Ext.StoreMgr
+ * @extends Ext.util.MixedCollection
+ * The default global group of stores.
+ * @singleton
+ */
+Ext.StoreMgr = Ext.apply(new Ext.util.MixedCollection(), {
+    /**
+     * @cfg {Object} listeners @hide
+     */
+
+    /**
+     * Registers one or more Stores with the StoreMgr. You do not normally need to register stores
+     * manually.  Any store initialized with a {@link Ext.data.Store#storeId} will be auto-registered. 
+     * @param {Ext.data.Store} store1 A Store instance
+     * @param {Ext.data.Store} store2 (optional)
+     * @param {Ext.data.Store} etc... (optional)
+     */
+    register : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.add(s);
+        }
+    },
+
+    /**
+     * Unregisters one or more Stores with the StoreMgr
+     * @param {String/Object} id1 The id of the Store, or a Store instance
+     * @param {String/Object} id2 (optional)
+     * @param {String/Object} etc... (optional)
+     */
+    unregister : function(){
+        for(var i = 0, s; (s = arguments[i]); i++){
+            this.remove(this.lookup(s));
+        }
+    },
+
+    /**
+     * Gets a registered Store by id
+     * @param {String/Object} id The id of the Store, or a Store instance
+     * @return {Ext.data.Store}
+     */
+    lookup : function(id){
+        if(Ext.isArray(id)){
+            var fields = ['field1'], expand = !Ext.isArray(id[0]);
+            if(!expand){
+                for(var i = 2, len = id[0].length; i <= len; ++i){
+                    fields.push('field' + i);
+                }
+            }
+            return new Ext.data.ArrayStore({
+                fields: fields,
+                data: id,
+                expandData: expand,
+                autoDestroy: true,
+                autoCreated: true
+
+            });
+        }
+        return Ext.isObject(id) ? (id.events ? id : Ext.create(id, 'store')) : this.get(id);
+    },
+
+    // getKey implementation for MixedCollection
+    getKey : function(o){
+         return o.storeId;
+    }
+});/**
+ * @class Ext.data.Store
+ * @extends Ext.util.Observable
+ * <p>The Store class encapsulates a client side cache of {@link Ext.data.Record Record}
+ * objects which provide input data for Components such as the {@link Ext.grid.GridPanel GridPanel},
+ * the {@link Ext.form.ComboBox ComboBox}, or the {@link Ext.DataView DataView}.</p>
+ * <p><u>Retrieving Data</u></p>
+ * <p>A Store object may access a data object using:<div class="mdetail-params"><ul>
+ * <li>{@link #proxy configured implementation} of {@link Ext.data.DataProxy DataProxy}</li>
+ * <li>{@link #data} to automatically pass in data</li>
+ * <li>{@link #loadData} to manually pass in data</li>
+ * </ul></div></p>
+ * <p><u>Reading Data</u></p>
+ * <p>A Store object has no inherent knowledge of the format of the data object (it could be
+ * an Array, XML, or JSON). A Store object uses an appropriate {@link #reader configured implementation}
+ * of a {@link Ext.data.DataReader DataReader} to create {@link Ext.data.Record Record} instances from the data
+ * object.</p>
+ * <p><u>Store Types</u></p>
+ * <p>There are several implementations of Store available which are customized for use with
+ * a specific DataReader implementation.  Here is an example using an ArrayStore which implicitly
+ * creates a reader commensurate to an Array data object.</p>
+ * <pre><code>
+var myStore = new Ext.data.ArrayStore({
+    fields: ['fullname', 'first'],
+    idIndex: 0 // id for each record will be the first element
+});
+ * </code></pre>
+ * <p>For custom implementations create a basic {@link Ext.data.Store} configured as needed:</p>
+ * <pre><code>
+// create a {@link Ext.data.Record Record} constructor:
+var rt = Ext.data.Record.create([
+    {name: 'fullname'},
+    {name: 'first'}
+]);
+var myStore = new Ext.data.Store({
+    // explicitly create reader
+    reader: new Ext.data.ArrayReader(
+        {
+            idIndex: 0  // id for each record will be the first element
+        },
+        rt // recordType
+    )
+});
+ * </code></pre>
+ * <p>Load some data into store (note the data object is an array which corresponds to the reader):</p>
+ * <pre><code>
+var myData = [
+    [1, 'Fred Flintstone', 'Fred'],  // note that id for the record is the first element
+    [2, 'Barney Rubble', 'Barney']
+];
+myStore.loadData(myData);
+ * </code></pre>
+ * <p>Records are cached and made available through accessor functions.  An example of adding
+ * a record to the store:</p>
+ * <pre><code>
+var defaultData = {
+    fullname: 'Full Name',
+    first: 'First Name'
+};
+var recId = 100; // provide unique id for the record
+var r = new myStore.recordType(defaultData, ++recId); // create new record
+myStore.{@link #insert}(0, r); // insert a new record into the store (also see {@link #add})
+ * </code></pre>
+ * <p><u>Writing Data</u></p>
+ * <p>And <b>new in Ext version 3</b>, use the new {@link Ext.data.DataWriter DataWriter} to create an automated, <a href="http://extjs.com/deploy/dev/examples/writer/writer.html">Writable Store</a>
+ * along with <a href="http://extjs.com/deploy/dev/examples/restful/restful.html">RESTful features.</a>
+ * @constructor
+ * Creates a new Store.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype store
+ */
+Ext.data.Store = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {String} storeId If passed, the id to use to register with the <b>{@link Ext.StoreMgr StoreMgr}</b>.
+     * <p><b>Note</b>: if a (deprecated) <tt>{@link #id}</tt> is specified it will supersede the <tt>storeId</tt>
+     * assignment.</p>
+     */
+    /**
+     * @cfg {String} url If a <tt>{@link #proxy}</tt> is not specified the <tt>url</tt> will be used to
+     * implicitly configure a {@link Ext.data.HttpProxy HttpProxy} if an <tt>url</tt> is specified.
+     * Typically this option, or the <code>{@link #data}</code> option will be specified.
+     */
+    /**
+     * @cfg {Boolean/Object} autoLoad If <tt>{@link #data}</tt> is not specified, and if <tt>autoLoad</tt>
+     * is <tt>true</tt> or an <tt>Object</tt>, this store's {@link #load} method is automatically called
+     * after creation. If the value of <tt>autoLoad</tt> is an <tt>Object</tt>, this <tt>Object</tt> will
+     * be passed to the store's {@link #load} method.
+     */
+    /**
+     * @cfg {Ext.data.DataProxy} proxy The {@link Ext.data.DataProxy DataProxy} object which provides
+     * access to a data object.  See <code>{@link #url}</code>.
+     */
+    /**
+     * @cfg {Array} data An inline data object readable by the <code>{@link #reader}</code>.
+     * Typically this option, or the <code>{@link #url}</code> option will be specified.
+     */
+    /**
+     * @cfg {Ext.data.DataReader} reader The {@link Ext.data.DataReader Reader} object which processes the
+     * data object and returns an Array of {@link Ext.data.Record} objects which are cached keyed by their
+     * <b><tt>{@link Ext.data.Record#id id}</tt></b> property.
+     */
+    /**
+     * @cfg {Ext.data.DataWriter} writer
+     * <p>The {@link Ext.data.DataWriter Writer} object which processes a record object for being written
+     * to the server-side database.</p>
+     * <br><p>When a writer is installed into a Store the {@link #add}, {@link #remove}, and {@link #update}
+     * events on the store are monitored in order to remotely {@link #createRecords create records},
+     * {@link #destroyRecord destroy records}, or {@link #updateRecord update records}.</p>
+     * <br><p>The proxy for this store will relay any {@link #writexception} events to this store.</p>
+     * <br><p>Sample implementation:
+     * <pre><code>
+var writer = new {@link Ext.data.JsonWriter}({
+    encode: true,
+    writeAllFields: true // write all fields, not just those that changed
+});
+
+// Typical Store collecting the Proxy, Reader and Writer together.
+var store = new Ext.data.Store({
+    storeId: 'user',
+    root: 'records',
+    proxy: proxy,
+    reader: reader,
+    writer: writer,     // <-- plug a DataWriter into the store just as you would a Reader
+    paramsAsHash: true,
+    autoSave: false    // <-- false to delay executing create, update, destroy requests
+                        //     until specifically told to do so.
+});
+     * </code></pre></p>
+     */
+    writer : undefined,
+    /**
+     * @cfg {Object} baseParams
+     * <p>An object containing properties which are to be sent as parameters
+     * for <i>every</i> HTTP request.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     * <p><b>Note</b>: <code>baseParams</code> may be superseded by any <code>params</code>
+     * specified in a <code>{@link #load}</code> request, see <code>{@link #load}</code>
+     * for more details.</p>
+     * This property may be modified after creation using the <code>{@link #setBaseParam}</code>
+     * method.
+     * @property
+     */
+    /**
+     * @cfg {Object} sortInfo A config object to specify the sort order in the request of a Store's
+     * {@link #load} operation.  Note that for local sorting, the <tt>direction</tt> property is
+     * case-sensitive. See also {@link #remoteSort} and {@link #paramNames}.
+     * For example:<pre><code>
+sortInfo: {
+    field: 'fieldName',
+    direction: 'ASC' // or 'DESC' (case sensitive for local sorting)
+}
+</code></pre>
+     */
+    /**
+     * @cfg {boolean} remoteSort <tt>true</tt> if sorting is to be handled by requesting the <tt>{@link #proxy Proxy}</tt>
+     * to provide a refreshed version of the data object in sorted order, as opposed to sorting the Record cache
+     * in place (defaults to <tt>false</tt>).
+     * <p>If <tt>remoteSort</tt> is <tt>true</tt>, then clicking on a {@link Ext.grid.Column Grid Column}'s
+     * {@link Ext.grid.Column#header header} causes the current page to be requested from the server appending
+     * the following two parameters to the <b><tt>{@link #load params}</tt></b>:<div class="mdetail-params"><ul>
+     * <li><b><tt>sort</tt></b> : String<p class="sub-desc">The <tt>name</tt> (as specified in the Record's
+     * {@link Ext.data.Field Field definition}) of the field to sort on.</p></li>
+     * <li><b><tt>dir</tt></b> : String<p class="sub-desc">The direction of the sort, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul></div></p>
+     */
+    remoteSort : false,
+
+    /**
+     * @cfg {Boolean} autoDestroy <tt>true</tt> to destroy the store when the component the store is bound
+     * to is destroyed (defaults to <tt>false</tt>).
+     * <p><b>Note</b>: this should be set to true when using stores that are bound to only 1 component.</p>
+     */
+    autoDestroy : false,
+
+    /**
+     * @cfg {Boolean} pruneModifiedRecords <tt>true</tt> to clear all modified record information each time
+     * the store is loaded or when a record is removed (defaults to <tt>false</tt>). See {@link #getModifiedRecords}
+     * for the accessor method to retrieve the modified records.
+     */
+    pruneModifiedRecords : false,
+
+    /**
+     * Contains the last options object used as the parameter to the {@link #load} method. See {@link #load}
+     * for the details of what this may contain. This may be useful for accessing any params which were used
+     * to load the current Record cache.
+     * @property
+     */
+    lastOptions : null,
+
+    /**
+     * @cfg {Boolean} autoSave
+     * <p>Defaults to <tt>true</tt> causing the store to automatically {@link #save} records to
+     * the server when a record is modified (ie: becomes 'dirty'). Specify <tt>false</tt> to manually call {@link #save}
+     * to send all modifiedRecords to the server.</p>
+     * <br><p><b>Note</b>: each CRUD action will be sent as a separate request.</p>
+     */
+    autoSave : true,
+
+    /**
+     * @cfg {Boolean} batch
+     * <p>Defaults to <tt>true</tt> (unless <code>{@link #restful}:true</code>). Multiple
+     * requests for each CRUD action (CREATE, READ, UPDATE and DESTROY) will be combined
+     * and sent as one transaction. Only applies when <code>{@link #autoSave}</code> is set
+     * to <tt>false</tt>.</p>
+     * <br><p>If Store is RESTful, the DataProxy is also RESTful, and a unique transaction is
+     * generated for each record.</p>
+     */
+    batch : true,
+
+    /**
+     * @cfg {Boolean} restful
+     * Defaults to <tt>false</tt>.  Set to <tt>true</tt> to have the Store and the set
+     * Proxy operate in a RESTful manner. The store will automatically generate GET, POST,
+     * PUT and DELETE requests to the server. The HTTP method used for any given CRUD
+     * action is described in {@link Ext.data.Api#restActions}.  For additional information
+     * see {@link Ext.data.DataProxy#restful}.
+     * <p><b>Note</b>: if <code>{@link #restful}:true</code> <code>batch</code> will
+     * internally be set to <tt>false</tt>.</p>
+     */
+    restful: false,
+
+    /**
+     * @cfg {Object} paramNames
+     * <p>An object containing properties which specify the names of the paging and
+     * sorting parameters passed to remote servers when loading blocks of data. By default, this
+     * object takes the following form:</p><pre><code>
+{
+    start : 'start',  // The parameter name which specifies the start row
+    limit : 'limit',  // The parameter name which specifies number of rows to return
+    sort : 'sort',    // The parameter name which specifies the column to sort on
+    dir : 'dir'       // The parameter name which specifies the sort direction
+}
+</code></pre>
+     * <p>The server must produce the requested data block upon receipt of these parameter names.
+     * If different parameter names are required, this property can be overriden using a configuration
+     * property.</p>
+     * <p>A {@link Ext.PagingToolbar PagingToolbar} bound to this Store uses this property to determine
+     * the parameter names to use in its {@link #load requests}.
+     */
+    paramNames : undefined,
+
+    /**
+     * @cfg {Object} defaultParamNames
+     * Provides the default values for the {@link #paramNames} property. To globally modify the parameters
+     * for all stores, this object should be changed on the store prototype.
+     */
+    defaultParamNames : {
+        start : 'start',
+        limit : 'limit',
+        sort : 'sort',
+        dir : 'dir'
+    },
+
+    isDestroyed: false,    
+    hasMultiSort: false,
+
+    // private
+    batchKey : '_ext_batch_',
+
+    constructor : function(config){
+        /**
+         * @property multiSort
+         * @type Boolean
+         * True if this store is currently sorted by more than one field/direction combination.
+         */
+        
+        /**
+         * @property isDestroyed
+         * @type Boolean
+         * True if the store has been destroyed already. Read only
+         */
+        
+        this.data = new Ext.util.MixedCollection(false);
+        this.data.getKey = function(o){
+            return o.id;
+        };
+        
+
+        // temporary removed-records cache
+        this.removed = [];
+
+        if(config && config.data){
+            this.inlineData = config.data;
+            delete config.data;
+        }
+
+        Ext.apply(this, config);
+
+        /**
+         * See the <code>{@link #baseParams corresponding configuration option}</code>
+         * for a description of this property.
+         * To modify this property see <code>{@link #setBaseParam}</code>.
+         * @property
+         */
+        this.baseParams = Ext.isObject(this.baseParams) ? this.baseParams : {};
+
+        this.paramNames = Ext.applyIf(this.paramNames || {}, this.defaultParamNames);
+
+        if((this.url || this.api) && !this.proxy){
+            this.proxy = new Ext.data.HttpProxy({url: this.url, api: this.api});
+        }
+        // If Store is RESTful, so too is the DataProxy
+        if (this.restful === true && this.proxy) {
+            // When operating RESTfully, a unique transaction is generated for each record.
+            // TODO might want to allow implemention of faux REST where batch is possible using RESTful routes only.
+            this.batch = false;
+            Ext.data.Api.restify(this.proxy);
+        }
+
+        if(this.reader){ // reader passed
+            if(!this.recordType){
+                this.recordType = this.reader.recordType;
+            }
+            if(this.reader.onMetaChange){
+                this.reader.onMetaChange = this.reader.onMetaChange.createSequence(this.onMetaChange, this);
+            }
+            if (this.writer) { // writer passed
+                if (this.writer instanceof(Ext.data.DataWriter) === false) {    // <-- config-object instead of instance.
+                    this.writer = this.buildWriter(this.writer);
+                }
+                this.writer.meta = this.reader.meta;
+                this.pruneModifiedRecords = true;
+            }
+        }
+
+        /**
+         * The {@link Ext.data.Record Record} constructor as supplied to (or created by) the
+         * {@link Ext.data.DataReader Reader}. Read-only.
+         * <p>If the Reader was constructed by passing in an Array of {@link Ext.data.Field} definition objects,
+         * instead of a Record constructor, it will implicitly create a Record constructor from that Array (see
+         * {@link Ext.data.Record}.{@link Ext.data.Record#create create} for additional details).</p>
+         * <p>This property may be used to create new Records of the type held in this Store, for example:</p><pre><code>
+    // create the data store
+    var store = new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: [
+           {name: 'company'},
+           {name: 'price', type: 'float'},
+           {name: 'change', type: 'float'},
+           {name: 'pctChange', type: 'float'},
+           {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+        ]
+    });
+    store.loadData(myData);
+
+    // create the Grid
+    var grid = new Ext.grid.EditorGridPanel({
+        store: store,
+        colModel: new Ext.grid.ColumnModel({
+            columns: [
+                {id:'company', header: 'Company', width: 160, dataIndex: 'company'},
+                {header: 'Price', renderer: 'usMoney', dataIndex: 'price'},
+                {header: 'Change', renderer: change, dataIndex: 'change'},
+                {header: '% Change', renderer: pctChange, dataIndex: 'pctChange'},
+                {header: 'Last Updated', width: 85,
+                    renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+                    dataIndex: 'lastChange'}
+            ],
+            defaults: {
+                sortable: true,
+                width: 75
+            }
+        }),
+        autoExpandColumn: 'company', // match the id specified in the column model
+        height:350,
+        width:600,
+        title:'Array Grid',
+        tbar: [{
+            text: 'Add Record',
+            handler : function(){
+                var defaultData = {
+                    change: 0,
+                    company: 'New Company',
+                    lastChange: (new Date()).clearTime(),
+                    pctChange: 0,
+                    price: 10
+                };
+                var recId = 3; // provide unique id
+                var p = new store.recordType(defaultData, recId); // create new record
+                grid.stopEditing();
+                store.{@link #insert}(0, p); // insert a new record into the store (also see {@link #add})
+                grid.startEditing(0, 0);
+            }
+        }]
+    });
+         * </code></pre>
+         * @property recordType
+         * @type Function
+         */
+
+        if(this.recordType){
+            /**
+             * A {@link Ext.util.MixedCollection MixedCollection} containing the defined {@link Ext.data.Field Field}s
+             * for the {@link Ext.data.Record Records} stored in this Store. Read-only.
+             * @property fields
+             * @type Ext.util.MixedCollection
+             */
+            this.fields = this.recordType.prototype.fields;
+        }
+        this.modified = [];
+
+        this.addEvents(
+            /**
+             * @event datachanged
+             * Fires when the data cache has changed in a bulk manner (e.g., it has been sorted, filtered, etc.) and a
+             * widget that is using this Store as a Record cache should refresh its view.
+             * @param {Store} this
+             */
+            'datachanged',
+            /**
+             * @event metachange
+             * Fires when this store's reader provides new metadata (fields). This is currently only supported for JsonReaders.
+             * @param {Store} this
+             * @param {Object} meta The JSON metadata
+             */
+            'metachange',
+            /**
+             * @event add
+             * Fires when Records have been {@link #add}ed to the Store
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The array of Records added
+             * @param {Number} index The index at which the record(s) were added
+             */
+            'add',
+            /**
+             * @event remove
+             * Fires when a Record has been {@link #remove}d from the Store
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was removed
+             * @param {Number} index The index at which the record was removed
+             */
+            'remove',
+            /**
+             * @event update
+             * Fires when a Record has been updated
+             * @param {Store} this
+             * @param {Ext.data.Record} record The Record that was updated
+             * @param {String} operation The update operation being performed.  Value may be one of:
+             * <pre><code>
+     Ext.data.Record.EDIT
+     Ext.data.Record.REJECT
+     Ext.data.Record.COMMIT
+             * </code></pre>
+             */
+            'update',
+            /**
+             * @event clear
+             * Fires when the data cache has been cleared.
+             * @param {Store} this
+             * @param {Record[]} records The records that were cleared.
+             */
+            'clear',
+            /**
+             * @event exception
+             * <p>Fires if an exception occurs in the Proxy during a remote request.
+             * This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+             * for description.
+             */
+            'exception',
+            /**
+             * @event beforeload
+             * Fires before a request is made for a new data object.  If the beforeload handler returns
+             * <tt>false</tt> the {@link #load} action will be canceled.
+             * @param {Store} this
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'beforeload',
+            /**
+             * @event load
+             * Fires after a new set of Records has been loaded.
+             * @param {Store} this
+             * @param {Ext.data.Record[]} records The Records that were loaded
+             * @param {Object} options The loading options that were specified (see {@link #load} for details)
+             */
+            'load',
+            /**
+             * @event loadexception
+             * <p>This event is <b>deprecated</b> in favor of the catch-all <b><code>{@link #exception}</code></b>
+             * event instead.</p>
+             * <p>This event is relayed through the corresponding {@link Ext.data.DataProxy}.
+             * See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for additional details.
+             * @param {misc} misc See {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#loadexception loadexception}
+             * for description.
+             */
+            'loadexception',
+            /**
+             * @event beforewrite
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Record/Record[]} rs The Record(s) being written.
+             * @param {Object} options The loading options that were specified. Edit <code>options.params</code> to add Http parameters to the request.  (see {@link #save} for details)
+             * @param {Object} arg The callback's arg object passed to the {@link #request} function
+             */
+            'beforewrite',
+            /**
+             * @event write
+             * Fires if the server returns 200 after an Ext.data.Api.actions CRUD action.
+             * Success of the action is determined in the <code>result['successProperty']</code>property (<b>NOTE</b> for RESTful stores,
+             * a simple 20x response is sufficient for the actions "destroy" and "update".  The "create" action should should return 200 along with a database pk).
+             * @param {Ext.data.Store} store
+             * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+             * @param {Object} result The 'data' picked-out out of the response for convenience.
+             * @param {Ext.Direct.Transaction} res
+             * @param {Record/Record[]} rs Store's records, the subject(s) of the write-action
+             */
+            'write',
+            /**
+             * @event beforesave
+             * Fires before a save action is called. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'beforesave',
+            /**
+             * @event save
+             * Fires after a save is completed. A save encompasses destroying records, updating records and creating records.
+             * @param {Ext.data.Store} store
+             * @param {Number} batch The identifier for the batch that was saved.
+             * @param {Object} data An object containing the data that is to be saved. The object will contain a key for each appropriate action,
+             * with an array of records for each action.
+             */
+            'save'
+
+        );
+
+        if(this.proxy){
+            // TODO remove deprecated loadexception with ext-3.0.1
+            this.relayEvents(this.proxy,  ['loadexception', 'exception']);
+        }
+        // With a writer set for the Store, we want to listen to add/remove events to remotely create/destroy records.
+        if (this.writer) {
+            this.on({
+                scope: this,
+                add: this.createRecords,
+                remove: this.destroyRecord,
+                update: this.updateRecord,
+                clear: this.onClear
+            });
+        }
+
+        this.sortToggle = {};
+        if(this.sortField){
+            this.setDefaultSort(this.sortField, this.sortDir);
+        }else if(this.sortInfo){
+            this.setDefaultSort(this.sortInfo.field, this.sortInfo.direction);
+        }
+
+        Ext.data.Store.superclass.constructor.call(this);
+
+        if(this.id){
+            this.storeId = this.id;
+            delete this.id;
+        }
+        if(this.storeId){
+            Ext.StoreMgr.register(this);
+        }
+        if(this.inlineData){
+            this.loadData(this.inlineData);
+            delete this.inlineData;
+        }else if(this.autoLoad){
+            this.load.defer(10, this, [
+                typeof this.autoLoad == 'object' ?
+                    this.autoLoad : undefined]);
+        }
+        // used internally to uniquely identify a batch
+        this.batchCounter = 0;
+        this.batches = {};
+    },
+
+    /**
+     * builds a DataWriter instance when Store constructor is provided with a writer config-object instead of an instace.
+     * @param {Object} config Writer configuration
+     * @return {Ext.data.DataWriter}
+     * @private
+     */
+    buildWriter : function(config) {
+        var klass = undefined,
+            type = (config.format || 'json').toLowerCase();
+        switch (type) {
+            case 'json':
+                klass = Ext.data.JsonWriter;
+                break;
+            case 'xml':
+                klass = Ext.data.XmlWriter;
+                break;
+            default:
+                klass = Ext.data.JsonWriter;
+        }
+        return new klass(config);
+    },
+
+    /**
+     * Destroys the store.
+     */
+    destroy : function(){
+        if(!this.isDestroyed){
+            if(this.storeId){
+                Ext.StoreMgr.unregister(this);
+            }
+            this.clearData();
+            this.data = null;
+            Ext.destroy(this.proxy);
+            this.reader = this.writer = null;
+            this.purgeListeners();
+            this.isDestroyed = true;
+        }
+    },
+
+    /**
+     * Add Records to the Store and fires the {@link #add} event.  To add Records
+     * to the store from a remote source use <code>{@link #load}({add:true})</code>.
+     * See also <code>{@link #recordType}</code> and <code>{@link #insert}</code>.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects
+     * to add to the cache. See {@link #recordType}.
+     */
+    add : function(records) {
+        var i, len, record, index;
+        
+        records = [].concat(records);
+        if (records.length < 1) {
+            return;
+        }
+        
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        index = this.data.length;
+        this.data.addAll(records);
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * (Local sort only) Inserts the passed Record into the Store at the index where it
+     * should go based on the current sort information.
+     * @param {Ext.data.Record} record
+     */
+    addSorted : function(record){
+        var index = this.findInsertIndex(record);
+        this.insert(index, record);
+    },
+    
+    /**
+     * @private
+     * Update a record within the store with a new reference
+     */
+    doUpdate: function(rec){
+        var id = rec.id;
+        // unjoin the old record
+        this.getById(id).join(null);
+        
+        this.data.replace(id, rec);
+        if (this.snapshot) {
+            this.snapshot.replace(id, rec);
+        }
+        rec.join(this);
+        this.fireEvent('update', this, rec, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Remove Records from the Store and fires the {@link #remove} event.
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record object or array of records to remove from the cache.
+     */
+    remove : function(record){
+        if(Ext.isArray(record)){
+            Ext.each(record, function(r){
+                this.remove(r);
+            }, this);
+            return;
+        }
+        var index = this.data.indexOf(record);
+        if(index > -1){
+            record.join(null);
+            this.data.removeAt(index);
+        }
+        if(this.pruneModifiedRecords){
+            this.modified.remove(record);
+        }
+        if(this.snapshot){
+            this.snapshot.remove(record);
+        }
+        if(index > -1){
+            this.fireEvent('remove', this, record, index);
+        }
+    },
+
+    /**
+     * Remove a Record from the Store at the specified index. Fires the {@link #remove} event.
+     * @param {Number} index The index of the record to remove.
+     */
+    removeAt : function(index){
+        this.remove(this.getAt(index));
+    },
+
+    /**
+     * Remove all Records from the Store and fires the {@link #clear} event.
+     * @param {Boolean} silent [false] Defaults to <tt>false</tt>.  Set <tt>true</tt> to not fire clear event.
+     */
+    removeAll : function(silent){
+        var items = [];
+        this.each(function(rec){
+            items.push(rec);
+        });
+        this.clearData();
+        if(this.snapshot){
+            this.snapshot.clear();
+        }
+        if(this.pruneModifiedRecords){
+            this.modified = [];
+        }
+        if (silent !== true) {  // <-- prevents write-actions when we just want to clear a store.
+            this.fireEvent('clear', this, items);
+        }
+    },
+
+    // private
+    onClear: function(store, records){
+        Ext.each(records, function(rec, index){
+            this.destroyRecord(this, rec, index);
+        }, this);
+    },
+
+    /**
+     * Inserts Records into the Store at the given index and fires the {@link #add} event.
+     * See also <code>{@link #add}</code> and <code>{@link #addSorted}</code>.
+     * @param {Number} index The start index at which to insert the passed Records.
+     * @param {Ext.data.Record[]} records An Array of Ext.data.Record objects to add to the cache.
+     */
+    insert : function(index, records) {
+        var i, len, record;
+        
+        records = [].concat(records);
+        for (i = 0, len = records.length; i < len; i++) {
+            record = records[i];
+            
+            this.data.insert(index + i, record);
+            record.join(this);
+            
+            if (record.dirty || record.phantom) {
+                this.modified.push(record);
+            }
+        }
+        
+        if (this.snapshot) {
+            this.snapshot.addAll(records);
+        }
+        
+        this.fireEvent('add', this, records, index);
+    },
+
+    /**
+     * Get the index within the cache of the passed Record.
+     * @param {Ext.data.Record} record The Ext.data.Record object to find.
+     * @return {Number} The index of the passed Record. Returns -1 if not found.
+     */
+    indexOf : function(record){
+        return this.data.indexOf(record);
+    },
+
+    /**
+     * Get the index within the cache of the Record with the passed id.
+     * @param {String} id The id of the Record to find.
+     * @return {Number} The index of the Record. Returns -1 if not found.
+     */
+    indexOfId : function(id){
+        return this.data.indexOfKey(id);
+    },
+
+    /**
+     * Get the Record with the specified id.
+     * @param {String} id The id of the Record to find.
+     * @return {Ext.data.Record} The Record with the passed id. Returns undefined if not found.
+     */
+    getById : function(id){
+        return (this.snapshot || this.data).key(id);
+    },
+
+    /**
+     * Get the Record at the specified index.
+     * @param {Number} index The index of the Record to find.
+     * @return {Ext.data.Record} The Record at the passed index. Returns undefined if not found.
+     */
+    getAt : function(index){
+        return this.data.itemAt(index);
+    },
+
+    /**
+     * Returns a range of Records between specified indices.
+     * @param {Number} startIndex (optional) The starting index (defaults to 0)
+     * @param {Number} endIndex (optional) The ending index (defaults to the last Record in the Store)
+     * @return {Ext.data.Record[]} An array of Records
+     */
+    getRange : function(start, end){
+        return this.data.getRange(start, end);
+    },
+
+    // private
+    storeOptions : function(o){
+        o = Ext.apply({}, o);
+        delete o.callback;
+        delete o.scope;
+        this.lastOptions = o;
+    },
+
+    // private
+    clearData: function(){
+        this.data.each(function(rec) {
+            rec.join(null);
+        });
+        this.data.clear();
+    },
+
+    /**
+     * <p>Loads the Record cache from the configured <tt>{@link #proxy}</tt> using the configured <tt>{@link #reader}</tt>.</p>
+     * <br><p>Notes:</p><div class="mdetail-params"><ul>
+     * <li><b><u>Important</u></b>: loading is asynchronous! This call will return before the new data has been
+     * loaded. To perform any post-processing where information from the load call is required, specify
+     * the <tt>callback</tt> function to be called, or use a {@link Ext.util.Observable#listeners a 'load' event handler}.</li>
+     * <li>If using {@link Ext.PagingToolbar remote paging}, the first load call must specify the <tt>start</tt> and <tt>limit</tt>
+     * properties in the <code>options.params</code> property to establish the initial position within the
+     * dataset, and the number of Records to cache on each read from the Proxy.</li>
+     * <li>If using {@link #remoteSort remote sorting}, the configured <code>{@link #sortInfo}</code>
+     * will be automatically included with the posted parameters according to the specified
+     * <code>{@link #paramNames}</code>.</li>
+     * </ul></div>
+     * @param {Object} options An object containing properties which control loading options:<ul>
+     * <li><b><tt>params</tt></b> :Object<div class="sub-desc"><p>An object containing properties to pass as HTTP
+     * parameters to a remote data source. <b>Note</b>: <code>params</code> will override any
+     * <code>{@link #baseParams}</code> of the same name.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     * <li><b>callback</b> : Function<div class="sub-desc"><p>A function to be called after the Records
+     * have been loaded. The callback is called after the load event is fired, and is passed the following arguments:<ul>
+     * <li>r : Ext.data.Record[] An Array of Records loaded.</li>
+     * <li>options : Options object from the load call.</li>
+     * <li>success : Boolean success indicator.</li></ul></p></div></li>
+     * <li><b>scope</b> : Object<div class="sub-desc"><p>Scope with which to call the callback (defaults
+     * to the Store object)</p></div></li>
+     * <li><b>add</b> : Boolean<div class="sub-desc"><p>Indicator to append loaded records rather than
+     * replace the current cache.  <b>Note</b>: see note for <tt>{@link #loadData}</tt></p></div></li>
+     * </ul>
+     * @return {Boolean} If the <i>developer</i> provided <tt>{@link #beforeload}</tt> event handler returns
+     * <tt>false</tt>, the load call will abort and will return <tt>false</tt>; otherwise will return <tt>true</tt>.
+     */
+    load : function(options) {
+        options = Ext.apply({}, options);
+        this.storeOptions(options);
+        if(this.sortInfo && this.remoteSort){
+            var pn = this.paramNames;
+            options.params = Ext.apply({}, options.params);
+            options.params[pn.sort] = this.sortInfo.field;
+            options.params[pn.dir] = this.sortInfo.direction;
+        }
+        try {
+            return this.execute('read', null, options); // <-- null represents rs.  No rs for load actions.
+        } catch(e) {
+            this.handleException(e);
+            return false;
+        }
+    },
+
+    /**
+     * updateRecord  Should not be used directly.  This method will be called automatically if a Writer is set.
+     * Listens to 'update' event.
+     * @param {Object} store
+     * @param {Object} record
+     * @param {Object} action
+     * @private
+     */
+    updateRecord : function(store, record, action) {
+        if (action == Ext.data.Record.EDIT && this.autoSave === true && (!record.phantom || (record.phantom && record.isValid()))) {
+            this.save();
+        }
+    },
+
+    /**
+     * @private
+     * Should not be used directly.  Store#add will call this automatically if a Writer is set
+     * @param {Object} store
+     * @param {Object} records
+     * @param {Object} index
+     */
+    createRecords : function(store, records, index) {
+        var modified = this.modified,
+            length   = records.length,
+            record, i;
+        
+        for (i = 0; i < length; i++) {
+            record = records[i];
+            
+            if (record.phantom && record.isValid()) {
+                record.markDirty();  // <-- Mark new records dirty (Ed: why?)
+                
+                if (modified.indexOf(record) == -1) {
+                    modified.push(record);
+                }
+            }
+        }
+        if (this.autoSave === true) {
+            this.save();
+        }
+    },
+
+    /**
+     * Destroys a Record.  Should not be used directly.  It's called by Store#remove if a Writer is set.
+     * @param {Store} store this
+     * @param {Ext.data.Record} record
+     * @param {Number} index
+     * @private
+     */
+    destroyRecord : function(store, record, index) {
+        if (this.modified.indexOf(record) != -1) {  // <-- handled already if @cfg pruneModifiedRecords == true
+            this.modified.remove(record);
+        }
+        if (!record.phantom) {
+            this.removed.push(record);
+
+            // since the record has already been removed from the store but the server request has not yet been executed,
+            // must keep track of the last known index this record existed.  If a server error occurs, the record can be
+            // put back into the store.  @see Store#createCallback where the record is returned when response status === false
+            record.lastIndex = index;
+
+            if (this.autoSave === true) {
+                this.save();
+            }
+        }
+    },
+
+    /**
+     * This method should generally not be used directly.  This method is called internally
+     * by {@link #load}, or if a Writer is set will be called automatically when {@link #add},
+     * {@link #remove}, or {@link #update} events fire.
+     * @param {String} action Action name ('read', 'create', 'update', or 'destroy')
+     * @param {Record/Record[]} rs
+     * @param {Object} options
+     * @throws Error
+     * @private
+     */
+    execute : function(action, rs, options, /* private */ batch) {
+        // blow up if action not Ext.data.CREATE, READ, UPDATE, DESTROY
+        if (!Ext.data.Api.isAction(action)) {
+            throw new Ext.data.Api.Error('execute', action);
+        }
+        // make sure options has a fresh, new params hash
+        options = Ext.applyIf(options||{}, {
+            params: {}
+        });
+        if(batch !== undefined){
+            this.addToBatch(batch);
+        }
+        // have to separate before-events since load has a different signature than create,destroy and save events since load does not
+        // include the rs (record resultset) parameter.  Capture return values from the beforeaction into doRequest flag.
+        var doRequest = true;
+
+        if (action === 'read') {
+            doRequest = this.fireEvent('beforeload', this, options);
+            Ext.applyIf(options.params, this.baseParams);
+        }
+        else {
+            // if Writer is configured as listful, force single-record rs to be [{}] instead of {}
+            // TODO Move listful rendering into DataWriter where the @cfg is defined.  Should be easy now.
+            if (this.writer.listful === true && this.restful !== true) {
+                rs = (Ext.isArray(rs)) ? rs : [rs];
+            }
+            // if rs has just a single record, shift it off so that Writer writes data as '{}' rather than '[{}]'
+            else if (Ext.isArray(rs) && rs.length == 1) {
+                rs = rs.shift();
+            }
+            // Write the action to options.params
+            if ((doRequest = this.fireEvent('beforewrite', this, action, rs, options)) !== false) {
+                this.writer.apply(options.params, this.baseParams, action, rs);
+            }
+        }
+        if (doRequest !== false) {
+            // Send request to proxy.
+            if (this.writer && this.proxy.url && !this.proxy.restful && !Ext.data.Api.hasUniqueUrl(this.proxy, action)) {
+                options.params.xaction = action;    // <-- really old, probaby unecessary.
+            }
+            // Note:  Up until this point we've been dealing with 'action' as a key from Ext.data.Api.actions.
+            // We'll flip it now and send the value into DataProxy#request, since it's the value which maps to
+            // the user's configured DataProxy#api
+            // TODO Refactor all Proxies to accept an instance of Ext.data.Request (not yet defined) instead of this looooooong list
+            // of params.  This method is an artifact from Ext2.
+            this.proxy.request(Ext.data.Api.actions[action], rs, options.params, this.reader, this.createCallback(action, rs, batch), this, options);
+        }
+        return doRequest;
+    },
+
+    /**
+     * Saves all pending changes to the store.  If the commensurate Ext.data.Api.actions action is not configured, then
+     * the configured <code>{@link #url}</code> will be used.
+     * <pre>
+     * change            url
+     * ---------------   --------------------
+     * removed records   Ext.data.Api.actions.destroy
+     * phantom records   Ext.data.Api.actions.create
+     * {@link #getModifiedRecords modified records}  Ext.data.Api.actions.update
+     * </pre>
+     * @TODO:  Create extensions of Error class and send associated Record with thrown exceptions.
+     * e.g.:  Ext.data.DataReader.Error or Ext.data.Error or Ext.data.DataProxy.Error, etc.
+     * @return {Number} batch Returns a number to uniquely identify the "batch" of saves occurring. -1 will be returned
+     * if there are no items to save or the save was cancelled.
+     */
+    save : function() {
+        if (!this.writer) {
+            throw new Ext.data.Store.Error('writer-undefined');
+        }
+
+        var queue = [],
+            len,
+            trans,
+            batch,
+            data = {},
+            i;
+        // DESTROY:  First check for removed records.  Records in this.removed are guaranteed non-phantoms.  @see Store#remove
+        if(this.removed.length){
+            queue.push(['destroy', this.removed]);
+        }
+
+        // Check for modified records. Use a copy so Store#rejectChanges will work if server returns error.
+        var rs = [].concat(this.getModifiedRecords());
+        if(rs.length){
+            // CREATE:  Next check for phantoms within rs.  splice-off and execute create.
+            var phantoms = [];
+            for(i = rs.length-1; i >= 0; i--){
+                if(rs[i].phantom === true){
+                    var rec = rs.splice(i, 1).shift();
+                    if(rec.isValid()){
+                        phantoms.push(rec);
+                    }
+                }else if(!rs[i].isValid()){ // <-- while we're here, splice-off any !isValid real records
+                    rs.splice(i,1);
+                }
+            }
+            // If we have valid phantoms, create them...
+            if(phantoms.length){
+                queue.push(['create', phantoms]);
+            }
+
+            // UPDATE:  And finally, if we're still here after splicing-off phantoms and !isValid real records, update the rest...
+            if(rs.length){
+                queue.push(['update', rs]);
+            }
+        }
+        len = queue.length;
+        if(len){
+            batch = ++this.batchCounter;
+            for(i = 0; i < len; ++i){
+                trans = queue[i];
+                data[trans[0]] = trans[1];
+            }
+            if(this.fireEvent('beforesave', this, data) !== false){
+                for(i = 0; i < len; ++i){
+                    trans = queue[i];
+                    this.doTransaction(trans[0], trans[1], batch);
+                }
+                return batch;
+            }
+        }
+        return -1;
+    },
+
+    // private.  Simply wraps call to Store#execute in try/catch.  Defers to Store#handleException on error.  Loops if batch: false
+    doTransaction : function(action, rs, batch) {
+        function transaction(records) {
+            try{
+                this.execute(action, records, undefined, batch);
+            }catch (e){
+                this.handleException(e);
+            }
+        }
+        if(this.batch === false){
+            for(var i = 0, len = rs.length; i < len; i++){
+                transaction.call(this, rs[i]);
+            }
+        }else{
+            transaction.call(this, rs);
+        }
+    },
+
+    // private
+    addToBatch : function(batch){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key];
+
+        if(!o){
+            b[key] = o = {
+                id: batch,
+                count: 0,
+                data: {}
+            };
+        }
+        ++o.count;
+    },
+
+    removeFromBatch : function(batch, action, data){
+        var b = this.batches,
+            key = this.batchKey + batch,
+            o = b[key],
+            arr;
+
+
+        if(o){
+            arr = o.data[action] || [];
+            o.data[action] = arr.concat(data);
+            if(o.count === 1){
+                data = o.data;
+                delete b[key];
+                this.fireEvent('save', this, batch, data);
+            }else{
+                --o.count;
+            }
+        }
+    },
+
+    // @private callback-handler for remote CRUD actions
+    // Do not override -- override loadRecords, onCreateRecords, onDestroyRecords and onUpdateRecords instead.
+    createCallback : function(action, rs, batch) {
+        var actions = Ext.data.Api.actions;
+        return (action == 'read') ? this.loadRecords : function(data, response, success) {
+            // calls: onCreateRecords | onUpdateRecords | onDestroyRecords
+            this['on' + Ext.util.Format.capitalize(action) + 'Records'](success, rs, [].concat(data));
+            // If success === false here, exception will have been called in DataProxy
+            if (success === true) {
+                this.fireEvent('write', this, action, data, response, rs);
+            }
+            this.removeFromBatch(batch, action, data);
+        };
+    },
+
+    // Clears records from modified array after an exception event.
+    // NOTE:  records are left marked dirty.  Do we want to commit them even though they were not updated/realized?
+    // TODO remove this method?
+    clearModified : function(rs) {
+        if (Ext.isArray(rs)) {
+            for (var n=rs.length-1;n>=0;n--) {
+                this.modified.splice(this.modified.indexOf(rs[n]), 1);
+            }
+        } else {
+            this.modified.splice(this.modified.indexOf(rs), 1);
+        }
+    },
+
+    // remap record ids in MixedCollection after records have been realized.  @see Store#onCreateRecords, @see DataReader#realize
+    reMap : function(record) {
+        if (Ext.isArray(record)) {
+            for (var i = 0, len = record.length; i < len; i++) {
+                this.reMap(record[i]);
+            }
+        } else {
+            delete this.data.map[record._phid];
+            this.data.map[record.id] = record;
+            var index = this.data.keys.indexOf(record._phid);
+            this.data.keys.splice(index, 1, record.id);
+            delete record._phid;
+        }
+    },
+
+    // @protected onCreateRecord proxy callback for create action
+    onCreateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.realize(rs, data);
+            }
+            catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#realize splices-off the rs until empty.
+                    this.onCreateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected, onUpdateRecords proxy callback for update action
+    onUpdateRecords : function(success, rs, data) {
+        if (success === true) {
+            try {
+                this.reader.update(rs, data);
+            } catch (e) {
+                this.handleException(e);
+                if (Ext.isArray(rs)) {
+                    // Recurse to run back into the try {}.  DataReader#update splices-off the rs until empty.
+                    this.onUpdateRecords(success, rs, data);
+                }
+            }
+        }
+    },
+
+    // @protected onDestroyRecords proxy callback for destroy action
+    onDestroyRecords : function(success, rs, data) {
+        // splice each rec out of this.removed
+        rs = (rs instanceof Ext.data.Record) ? [rs] : [].concat(rs);
+        for (var i=0,len=rs.length;i<len;i++) {
+            this.removed.splice(this.removed.indexOf(rs[i]), 1);
+        }
+        if (success === false) {
+            // put records back into store if remote destroy fails.
+            // @TODO: Might want to let developer decide.
+            for (i=rs.length-1;i>=0;i--) {
+                this.insert(rs[i].lastIndex, rs[i]);    // <-- lastIndex set in Store#destroyRecord
+            }
+        }
+    },
+
+    // protected handleException.  Possibly temporary until Ext framework has an exception-handler.
+    handleException : function(e) {
+        // @see core/Error.js
+        Ext.handleError(e);
+    },
+
+    /**
+     * <p>Reloads the Record cache from the configured Proxy using the configured
+     * {@link Ext.data.Reader Reader} and the options from the last load operation
+     * performed.</p>
+     * <p><b>Note</b>: see the Important note in {@link #load}.</p>
+     * @param {Object} options <p>(optional) An <tt>Object</tt> containing
+     * {@link #load loading options} which may override the {@link #lastOptions options}
+     * used in the last {@link #load} operation. See {@link #load} for details
+     * (defaults to <tt>null</tt>, in which case the {@link #lastOptions} are
+     * used).</p>
+     * <br><p>To add new params to the existing params:</p><pre><code>
+lastOptions = myStore.lastOptions;
+Ext.apply(lastOptions.params, {
+    myNewParam: true
+});
+myStore.reload(lastOptions);
+     * </code></pre>
+     */
+    reload : function(options){
+        this.load(Ext.applyIf(options||{}, this.lastOptions));
+    },
+
+    // private
+    // Called as a callback by the Reader during a load operation.
+    loadRecords : function(o, options, success){
+        var i, len;
+        
+        if (this.isDestroyed === true) {
+            return;
+        }
+        if(!o || success === false){
+            if(success !== false){
+                this.fireEvent('load', this, [], options);
+            }
+            if(options.callback){
+                options.callback.call(options.scope || this, [], options, false, o);
+            }
+            return;
+        }
+        var r = o.records, t = o.totalRecords || r.length;
+        if(!options || options.add !== true){
+            if(this.pruneModifiedRecords){
+                this.modified = [];
+            }
+            for(i = 0, len = r.length; i < len; i++){
+                r[i].join(this);
+            }
+            if(this.snapshot){
+                this.data = this.snapshot;
+                delete this.snapshot;
+            }
+            this.clearData();
+            this.data.addAll(r);
+            this.totalLength = t;
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }else{
+            var toAdd = [],
+                rec,
+                cnt = 0;
+            for(i = 0, len = r.length; i < len; ++i){
+                rec = r[i];
+                if(this.indexOfId(rec.id) > -1){
+                    this.doUpdate(rec);
+                }else{
+                    toAdd.push(rec);
+                    ++cnt;
+                }
+            }
+            this.totalLength = Math.max(t, this.data.length + cnt);
+            this.add(toAdd);
+        }
+        this.fireEvent('load', this, r, options);
+        if(options.callback){
+            options.callback.call(options.scope || this, r, options, true);
+        }
+    },
+
+    /**
+     * Loads data from a passed data block and fires the {@link #load} event. A {@link Ext.data.Reader Reader}
+     * which understands the format of the data must have been configured in the constructor.
+     * @param {Object} data The data block from which to read the Records.  The format of the data expected
+     * is dependent on the type of {@link Ext.data.Reader Reader} that is configured and should correspond to
+     * that {@link Ext.data.Reader Reader}'s <tt>{@link Ext.data.Reader#readRecords}</tt> parameter.
+     * @param {Boolean} append (Optional) <tt>true</tt> to append the new Records rather the default to replace
+     * the existing cache.
+     * <b>Note</b>: that Records in a Store are keyed by their {@link Ext.data.Record#id id}, so added Records
+     * with ids which are already present in the Store will <i>replace</i> existing Records. Only Records with
+     * new, unique ids will be added.
+     */
+    loadData : function(o, append){
+        var r = this.reader.readRecords(o);
+        this.loadRecords(r, {add: append}, true);
+    },
+
+    /**
+     * Gets the number of cached records.
+     * <p>If using paging, this may not be the total size of the dataset. If the data object
+     * used by the Reader contains the dataset size, then the {@link #getTotalCount} function returns
+     * the dataset size.  <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records in the Store's cache.
+     */
+    getCount : function(){
+        return this.data.length || 0;
+    },
+
+    /**
+     * Gets the total number of records in the dataset as returned by the server.
+     * <p>If using paging, for this to be accurate, the data object used by the {@link #reader Reader}
+     * must contain the dataset size. For remote data sources, the value for this property
+     * (<tt>totalProperty</tt> for {@link Ext.data.JsonReader JsonReader},
+     * <tt>totalRecords</tt> for {@link Ext.data.XmlReader XmlReader}) shall be returned by a query on the server.
+     * <b>Note</b>: see the Important note in {@link #load}.</p>
+     * @return {Number} The number of Records as specified in the data object passed to the Reader
+     * by the Proxy.
+     * <p><b>Note</b>: this value is not updated when changing the contents of the Store locally.</p>
+     */
+    getTotalCount : function(){
+        return this.totalLength || 0;
+    },
+
+    /**
+     * Returns an object describing the current sort state of this Store.
+     * @return {Object} The sort state of the Store. An object with two properties:<ul>
+     * <li><b>field : String<p class="sub-desc">The name of the field by which the Records are sorted.</p></li>
+     * <li><b>direction : String<p class="sub-desc">The sort order, 'ASC' or 'DESC' (case-sensitive).</p></li>
+     * </ul>
+     * See <tt>{@link #sortInfo}</tt> for additional details.
+     */
+    getSortState : function(){
+        return this.sortInfo;
+    },
+
+    /**
+     * @private
+     * Invokes sortData if we have sortInfo to sort on and are not sorting remotely
+     */
+    applySort : function(){
+        if ((this.sortInfo || this.multiSortInfo) && !this.remoteSort) {
+            this.sortData();
+        }
+    },
+
+    /**
+     * @private
+     * Performs the actual sorting of data. This checks to see if we currently have a multi sort or not. It applies
+     * each sorter field/direction pair in turn by building an OR'ed master sorting function and running it against
+     * the full dataset
+     */
+    sortData : function() {
+        var sortInfo  = this.hasMultiSort ? this.multiSortInfo : this.sortInfo,
+            direction = sortInfo.direction || "ASC",
+            sorters   = sortInfo.sorters,
+            sortFns   = [];
+
+        //if we just have a single sorter, pretend it's the first in an array
+        if (!this.hasMultiSort) {
+            sorters = [{direction: direction, field: sortInfo.field}];
+        }
+
+        //create a sorter function for each sorter field/direction combo
+        for (var i=0, j = sorters.length; i < j; i++) {
+            sortFns.push(this.createSortFunction(sorters[i].field, sorters[i].direction));
+        }
+        
+        if (sortFns.length == 0) {
+            return;
+        }
+
+        //the direction modifier is multiplied with the result of the sorting functions to provide overall sort direction
+        //(as opposed to direction per field)
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        //create a function which ORs each sorter together to enable multi-sort
+        var fn = function(r1, r2) {
+          var result = sortFns[0].call(this, r1, r2);
+
+          //if we have more than one sorter, OR any additional sorter functions together
+          if (sortFns.length > 1) {
+              for (var i=1, j = sortFns.length; i < j; i++) {
+                  result = result || sortFns[i].call(this, r1, r2);
+              }
+          }
+
+          return directionModifier * result;
+        };
+
+        //sort the data
+        this.data.sort(direction, fn);
+        if (this.snapshot && this.snapshot != this.data) {
+            this.snapshot.sort(direction, fn);
+        }
+    },
+
+    /**
+     * @private
+     * Creates and returns a function which sorts an array by the given field and direction
+     * @param {String} field The field to create the sorter for
+     * @param {String} direction The direction to sort by (defaults to "ASC")
+     * @return {Function} A function which sorts by the field/direction combination provided
+     */
+    createSortFunction: function(field, direction) {
+        direction = direction || "ASC";
+        var directionModifier = direction.toUpperCase() == "DESC" ? -1 : 1;
+
+        var sortType = this.fields.get(field).sortType;
+
+        //create a comparison function. Takes 2 records, returns 1 if record 1 is greater,
+        //-1 if record 2 is greater or 0 if they are equal
+        return function(r1, r2) {
+            var v1 = sortType(r1.data[field]),
+                v2 = sortType(r2.data[field]);
+
+            return directionModifier * (v1 > v2 ? 1 : (v1 < v2 ? -1 : 0));
+        };
+    },
+
+    /**
+     * Sets the default sort column and order to be used by the next {@link #load} operation.
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    setDefaultSort : function(field, dir) {
+        dir = dir ? dir.toUpperCase() : 'ASC';
+        this.sortInfo = {field: field, direction: dir};
+        this.sortToggle[field] = dir;
+    },
+
+    /**
+     * Sort the Records.
+     * If remote sorting is used, the sort is performed on the server, and the cache is reloaded. If local
+     * sorting is used, the cache is sorted internally. See also {@link #remoteSort} and {@link #paramNames}.
+     * This function accepts two call signatures - pass in a field name as the first argument to sort on a single
+     * field, or pass in an array of sort configuration objects to sort by multiple fields.
+     * Single sort example:
+     * store.sort('name', 'ASC');
+     * Multi sort example:
+     * store.sort([
+     *   {
+     *     field    : 'name',
+     *     direction: 'ASC'
+     *   },
+     *   {
+     *     field    : 'salary',
+     *     direction: 'DESC'
+     *   }
+     * ], 'ASC');
+     * In this second form, the sort configs are applied in order, with later sorters sorting within earlier sorters' results.
+     * For example, if two records with the same name are present they will also be sorted by salary if given the sort configs
+     * above. Any number of sort configs can be added.
+     * @param {String/Array} fieldName The name of the field to sort by, or an array of ordered sort configs
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    sort : function(fieldName, dir) {
+        if (Ext.isArray(arguments[0])) {
+            return this.multiSort.call(this, fieldName, dir);
+        } else {
+            return this.singleSort(fieldName, dir);
+        }
+    },
+
+    /**
+     * Sorts the store contents by a single field and direction. This is called internally by {@link sort} and would
+     * not usually be called manually
+     * @param {String} fieldName The name of the field to sort by.
+     * @param {String} dir (optional) The sort order, 'ASC' or 'DESC' (case-sensitive, defaults to <tt>'ASC'</tt>)
+     */
+    singleSort: function(fieldName, dir) {
+        var field = this.fields.get(fieldName);
+        if (!field) {
+            return false;
+        }
+
+        var name       = field.name,
+            sortInfo   = this.sortInfo || null,
+            sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+        if (!dir) {
+            if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+            } else {
+                dir = field.sortDir;
+            }
+        }
+
+        this.sortToggle[name] = dir;
+        this.sortInfo = {field: name, direction: dir};
+        this.hasMultiSort = false;
+
+        if (this.remoteSort) {
+            if (!this.load(this.lastOptions)) {
+                if (sortToggle) {
+                    this.sortToggle[name] = sortToggle;
+                }
+                if (sortInfo) {
+                    this.sortInfo = sortInfo;
+                }
+            }
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+        return true;
+    },
+
+    /**
+     * Sorts the contents of this store by multiple field/direction sorters. This is called internally by {@link sort}
+     * and would not usually be called manually.
+     * Multi sorting only currently applies to local datasets - multiple sort data is not currently sent to a proxy
+     * if remoteSort is used.
+     * @param {Array} sorters Array of sorter objects (field and direction)
+     * @param {String} direction Overall direction to sort the ordered results by (defaults to "ASC")
+     */
+    multiSort: function(sorters, direction) {
+        this.hasMultiSort = true;
+        direction = direction || "ASC";
+
+        //toggle sort direction
+        if (this.multiSortInfo && direction == this.multiSortInfo.direction) {
+            direction = direction.toggle("ASC", "DESC");
+        }
+
+        /**
+         * Object containing overall sort direction and an ordered array of sorter configs used when sorting on multiple fields
+         * @property multiSortInfo
+         * @type Object
+         */
+        this.multiSortInfo = {
+            sorters  : sorters,
+            direction: direction
+        };
+        
+        if (this.remoteSort) {
+            this.singleSort(sorters[0].field, sorters[0].direction);
+
+        } else {
+            this.applySort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Calls the specified function for each of the {@link Ext.data.Record Records} in the cache.
+     * @param {Function} fn The function to call. The {@link Ext.data.Record Record} is passed as the first parameter.
+     * Returning <tt>false</tt> aborts and exits the iteration.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed.
+     * Defaults to the current {@link Ext.data.Record Record} in the iteration.
+     */
+    each : function(fn, scope){
+        this.data.each(fn, scope);
+    },
+
+    /**
+     * Gets all {@link Ext.data.Record records} modified since the last commit.  Modified records are
+     * persisted across load operations (e.g., during paging). <b>Note</b>: deleted records are not
+     * included.  See also <tt>{@link #pruneModifiedRecords}</tt> and
+     * {@link Ext.data.Record}<tt>{@link Ext.data.Record#markDirty markDirty}.</tt>.
+     * @return {Ext.data.Record[]} An array of {@link Ext.data.Record Records} containing outstanding
+     * modifications.  To obtain modified fields within a modified record see
+     *{@link Ext.data.Record}<tt>{@link Ext.data.Record#modified modified}.</tt>.
+     */
+    getModifiedRecords : function(){
+        return this.modified;
+    },
+
+    /**
+     * Sums the value of <tt>property</tt> for each {@link Ext.data.Record record} between <tt>start</tt>
+     * and <tt>end</tt> and returns the result.
+     * @param {String} property A field in each record
+     * @param {Number} start (optional) The record index to start at (defaults to <tt>0</tt>)
+     * @param {Number} end (optional) The last record index to include (defaults to length - 1)
+     * @return {Number} The sum
+     */
+    sum : function(property, start, end){
+        var rs = this.data.items, v = 0;
+        start = start || 0;
+        end = (end || end === 0) ? end : rs.length-1;
+
+        for(var i = start; i <= end; i++){
+            v += (rs[i].data[property] || 0);
+        }
+        return v;
+    },
+
+    /**
+     * @private
+     * Returns a filter function used to test a the given property's value. Defers most of the work to
+     * Ext.util.MixedCollection's createValueMatcher function
+     * @param {String} property The property to create the filter function for
+     * @param {String/RegExp} value The string/regex to compare the property value to
+     * @param {Boolean} anyMatch True if we don't care if the filter value is not the full value (defaults to false)
+     * @param {Boolean} caseSensitive True to create a case-sensitive regex (defaults to false)
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    createFilterFn : function(property, value, anyMatch, caseSensitive, exactMatch){
+        if(Ext.isEmpty(value, false)){
+            return false;
+        }
+        value = this.data.createValueMatcher(value, anyMatch, caseSensitive, exactMatch);
+        return function(r) {
+            return value.test(r.data[property]);
+        };
+    },
+
+    /**
+     * @private
+     * Given an array of filter functions (each with optional scope), constructs and returns a single function that returns
+     * the result of all of the filters ANDed together
+     * @param {Array} filters The array of filter objects (each object should contain an 'fn' and optional scope)
+     * @return {Function} The multiple filter function
+     */
+    createMultipleFilterFn: function(filters) {
+        return function(record) {
+            var isMatch = true;
+
+            for (var i=0, j = filters.length; i < j; i++) {
+                var filter = filters[i],
+                    fn     = filter.fn,
+                    scope  = filter.scope;
+
+                isMatch = isMatch && fn.call(scope, record);
+            }
+
+            return isMatch;
+        };
+    },
+
+    /**
+     * Filter the {@link Ext.data.Record records} by a specified property. Alternatively, pass an array of filter
+     * options to filter by more than one property.
+     * Single filter example:
+     * store.filter('name', 'Ed', true, true); //finds all records containing the substring 'Ed'
+     * Multiple filter example:
+     * <pre><code>
+     * store.filter([
+     *   {
+     *     property     : 'name',
+     *     value        : 'Ed',
+     *     anyMatch     : true, //optional, defaults to true
+     *     caseSensitive: true  //optional, defaults to true
+     *   },
+     *
+     *   //filter functions can also be passed
+     *   {
+     *     fn   : function(record) {
+     *       return record.get('age') == 24
+     *     },
+     *     scope: this
+     *   }
+     * ]);
+     * </code></pre>
+     * @param {String|Array} field A field on your records, or an array containing multiple filter options
+     * @param {String/RegExp} value Either a string that the field should begin with, or a RegExp to test
+     * against the field.
+     * @param {Boolean} anyMatch (optional) <tt>true</tt> to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) <tt>true</tt> for case sensitive comparison
+     * @param {Boolean} exactMatch True to force exact match (^ and $ characters added to the regex). Defaults to false. Ignored if anyMatch is true.
+     */
+    filter : function(property, value, anyMatch, caseSensitive, exactMatch){
+        var fn;
+        //we can accept an array of filter objects, or a single filter object - normalize them here
+        if (Ext.isObject(property)) {
+            property = [property];
+        }
+
+        if (Ext.isArray(property)) {
+            var filters = [];
+
+            //normalize the filters passed into an array of filter functions
+            for (var i=0, j = property.length; i < j; i++) {
+                var filter = property[i],
+                    func   = filter.fn,
+                    scope  = filter.scope || this;
+
+                //if we weren't given a filter function, construct one now
+                if (!Ext.isFunction(func)) {
+                    func = this.createFilterFn(filter.property, filter.value, filter.anyMatch, filter.caseSensitive, filter.exactMatch);
+                }
+
+                filters.push({fn: func, scope: scope});
+            }
+
+            fn = this.createMultipleFilterFn(filters);
+        } else {
+            //classic single property filter
+            fn = this.createFilterFn(property, value, anyMatch, caseSensitive, exactMatch);
+        }
+
+        return fn ? this.filterBy(fn) : this.clearFilter();
+    },
+
+    /**
+     * Filter by a function. The specified function will be called for each
+     * Record in this Store. If the function returns <tt>true</tt> the Record is included,
+     * otherwise it is filtered out.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     */
+    filterBy : function(fn, scope){
+        this.snapshot = this.snapshot || this.data;
+        this.data = this.queryBy(fn, scope || this);
+        this.fireEvent('datachanged', this);
+    },
+
+    /**
+     * Revert to a view of the Record cache with no filtering applied.
+     * @param {Boolean} suppressEvent If <tt>true</tt> the filter is cleared silently without firing the
+     * {@link #datachanged} event.
+     */
+    clearFilter : function(suppressEvent){
+        if(this.isFiltered()){
+            this.data = this.snapshot;
+            delete this.snapshot;
+            if(suppressEvent !== true){
+                this.fireEvent('datachanged', this);
+            }
+        }
+    },
+
+    /**
+     * Returns true if this store is currently filtered
+     * @return {Boolean}
+     */
+    isFiltered : function(){
+        return !!this.snapshot && this.snapshot != this.data;
+    },
+
+    /**
+     * Query the records by a specified property.
+     * @param {String} field A field on your records
+     * @param {String/RegExp} value Either a string that the field
+     * should begin with, or a RegExp to test against the field.
+     * @param {Boolean} anyMatch (optional) True to match any part not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     */
+    query : function(property, value, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.queryBy(fn) : this.data.clone();
+    },
+
+    /**
+     * Query the cached records in this Store using a filtering function. The specified function
+     * will be called with each record in this Store. If the function returns <tt>true</tt> the record is
+     * included in the results.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @return {MixedCollection} Returns an Ext.util.MixedCollection of the matched records
+     **/
+    queryBy : function(fn, scope){
+        var data = this.snapshot || this.data;
+        return data.filterBy(fn, scope||this);
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {String/RegExp} value Either a string that the field value
+     * should begin with, or a RegExp to test against the field.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @param {Boolean} anyMatch (optional) True to match any part of the string, not just the beginning
+     * @param {Boolean} caseSensitive (optional) True for case sensitive comparison
+     * @return {Number} The matched index or -1
+     */
+    find : function(property, value, start, anyMatch, caseSensitive){
+        var fn = this.createFilterFn(property, value, anyMatch, caseSensitive);
+        return fn ? this.data.findIndexBy(fn, null, start) : -1;
+    },
+
+    /**
+     * Finds the index of the first matching Record in this store by a specific field value.
+     * @param {String} fieldName The name of the Record field to test.
+     * @param {Mixed} value The value to match the field against.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findExact: function(property, value, start){
+        return this.data.findIndexBy(function(rec){
+            return rec.get(property) === value;
+        }, this, start);
+    },
+
+    /**
+     * Find the index of the first matching Record in this Store by a function.
+     * If the function returns <tt>true</tt> it is considered a match.
+     * @param {Function} fn The function to be called. It will be passed the following parameters:<ul>
+     * <li><b>record</b> : Ext.data.Record<p class="sub-desc">The {@link Ext.data.Record record}
+     * to test for filtering. Access field values using {@link Ext.data.Record#get}.</p></li>
+     * <li><b>id</b> : Object<p class="sub-desc">The ID of the Record passed.</p></li>
+     * </ul>
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this Store.
+     * @param {Number} startIndex (optional) The index to start searching at
+     * @return {Number} The matched index or -1
+     */
+    findBy : function(fn, scope, start){
+        return this.data.findIndexBy(fn, scope, start);
+    },
+
+    /**
+     * Collects unique values for a particular dataIndex from this store.
+     * @param {String} dataIndex The property to collect
+     * @param {Boolean} allowNull (optional) Pass true to allow null, undefined or empty string values
+     * @param {Boolean} bypassFilter (optional) Pass true to collect from all records, even ones which are filtered
+     * @return {Array} An array of the unique values
+     **/
+    collect : function(dataIndex, allowNull, bypassFilter){
+        var d = (bypassFilter === true && this.snapshot) ?
+                this.snapshot.items : this.data.items;
+        var v, sv, r = [], l = {};
+        for(var i = 0, len = d.length; i < len; i++){
+            v = d[i].data[dataIndex];
+            sv = String(v);
+            if((allowNull || !Ext.isEmpty(v)) && !l[sv]){
+                l[sv] = true;
+                r[r.length] = v;
+            }
+        }
+        return r;
+    },
+
+    // private
+    afterEdit : function(record){
+        if(this.modified.indexOf(record) == -1){
+            this.modified.push(record);
+        }
+        this.fireEvent('update', this, record, Ext.data.Record.EDIT);
+    },
+
+    // private
+    afterReject : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.REJECT);
+    },
+
+    // private
+    afterCommit : function(record){
+        this.modified.remove(record);
+        this.fireEvent('update', this, record, Ext.data.Record.COMMIT);
+    },
+
+    /**
+     * Commit all Records with {@link #getModifiedRecords outstanding changes}. To handle updates for changes,
+     * subscribe to the Store's {@link #update update event}, and perform updating when the third parameter is
+     * Ext.data.Record.COMMIT.
+     */
+    commitChanges : function(){
+        var modified = this.modified.slice(0),
+            length   = modified.length,
+            i;
+            
+        for (i = 0; i < length; i++){
+            modified[i].commit();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    /**
+     * {@link Ext.data.Record#reject Reject} outstanding changes on all {@link #getModifiedRecords modified records}.
+     */
+    rejectChanges : function() {
+        var modified = this.modified.slice(0),
+            removed  = this.removed.slice(0).reverse(),
+            mLength  = modified.length,
+            rLength  = removed.length,
+            i;
+        
+        for (i = 0; i < mLength; i++) {
+            modified[i].reject();
+        }
+        
+        for (i = 0; i < rLength; i++) {
+            this.insert(removed[i].lastIndex || 0, removed[i]);
+            removed[i].reject();
+        }
+        
+        this.modified = [];
+        this.removed  = [];
+    },
+
+    // private
+    onMetaChange : function(meta){
+        this.recordType = this.reader.recordType;
+        this.fields = this.recordType.prototype.fields;
+        delete this.snapshot;
+        if(this.reader.meta.sortInfo){
+            this.sortInfo = this.reader.meta.sortInfo;
+        }else if(this.sortInfo  && !this.fields.get(this.sortInfo.field)){
+            delete this.sortInfo;
+        }
+        if(this.writer){
+            this.writer.meta = this.reader.meta;
+        }
+        this.modified = [];
+        this.fireEvent('metachange', this, this.reader.meta);
+    },
+
+    // private
+    findInsertIndex : function(record){
+        this.suspendEvents();
+        var data = this.data.clone();
+        this.data.add(record);
+        this.applySort();
+        var index = this.data.indexOf(record);
+        this.data = data;
+        this.resumeEvents();
+        return index;
+    },
+
+    /**
+     * Set the value for a property name in this store's {@link #baseParams}.  Usage:</p><pre><code>
+myStore.setBaseParam('foo', {bar:3});
+</code></pre>
+     * @param {String} name Name of the property to assign
+     * @param {Mixed} value Value to assign the <tt>name</tt>d property
+     **/
+    setBaseParam : function (name, value){
+        this.baseParams = this.baseParams || {};
+        this.baseParams[name] = value;
+    }
+});
+
+Ext.reg('store', Ext.data.Store);
+
+/**
+ * @class Ext.data.Store.Error
+ * @extends Ext.Error
+ * Store Error extension.
+ * @param {String} name
+ */
+Ext.data.Store.Error = Ext.extend(Ext.Error, {
+    name: 'Ext.data.Store'
+});
+Ext.apply(Ext.data.Store.Error.prototype, {
+    lang: {
+        'writer-undefined' : 'Attempted to execute a write-action without a DataWriter installed.'
+    }
+});
+/**
+ * @class Ext.data.Field
+ * <p>This class encapsulates the field definition information specified in the field definition objects
+ * passed to {@link Ext.data.Record#create}.</p>
+ * <p>Developers do not need to instantiate this class. Instances are created by {@link Ext.data.Record.create}
+ * and cached in the {@link Ext.data.Record#fields fields} property of the created Record constructor's <b>prototype.</b></p>
+ */
+Ext.data.Field = Ext.extend(Object, {
+    
+    constructor : function(config){
+        if(Ext.isString(config)){
+            config = {name: config};
+        }
+        Ext.apply(this, config);
+        
+        var types = Ext.data.Types,
+            st = this.sortType,
+            t;
+
+        if(this.type){
+            if(Ext.isString(this.type)){
+                this.type = Ext.data.Types[this.type.toUpperCase()] || types.AUTO;
+            }
+        }else{
+            this.type = types.AUTO;
+        }
+
+        // named sortTypes are supported, here we look them up
+        if(Ext.isString(st)){
+            this.sortType = Ext.data.SortTypes[st];
+        }else if(Ext.isEmpty(st)){
+            this.sortType = this.type.sortType;
+        }
+
+        if(!this.convert){
+            this.convert = this.type.convert;
+        }
+    },
+    
+    /**
+     * @cfg {String} name
+     * The name by which the field is referenced within the Record. This is referenced by, for example,
+     * the <code>dataIndex</code> property in column definition objects passed to {@link Ext.grid.ColumnModel}.
+     * <p>Note: In the simplest case, if no properties other than <code>name</code> are required, a field
+     * definition may consist of just a String for the field name.</p>
+     */
+    /**
+     * @cfg {Mixed} type
+     * (Optional) The data type for automatic conversion from received data to the <i>stored</i> value if <code>{@link Ext.data.Field#convert convert}</code>
+     * has not been specified. This may be specified as a string value. Possible values are
+     * <div class="mdetail-params"><ul>
+     * <li>auto (Default, implies no conversion)</li>
+     * <li>string</li>
+     * <li>int</li>
+     * <li>float</li>
+     * <li>boolean</li>
+     * <li>date</li></ul></div>
+     * <p>This may also be specified by referencing a member of the {@link Ext.data.Types} class.</p>
+     * <p>Developers may create their own application-specific data types by defining new members of the
+     * {@link Ext.data.Types} class.</p>
+     */
+    /**
+     * @cfg {Function} convert
+     * (Optional) A function which converts the value provided by the Reader into an object that will be stored
+     * in the Record. It is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+     * the configured <code>{@link Ext.data.Field#defaultValue defaultValue}</code>.</div></li>
+     * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+     * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+     *  ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+     * </ul></div>
+     * <pre><code>
+// example of convert function
+function fullName(v, record){
+    return record.name.last + ', ' + record.name.first;
+}
+
+function location(v, record){
+    return !record.city ? '' : (record.city + ', ' + record.state);
+}
+
+var Dude = Ext.data.Record.create([
+    {name: 'fullname',  convert: fullName},
+    {name: 'firstname', mapping: 'name.first'},
+    {name: 'lastname',  mapping: 'name.last'},
+    {name: 'city', defaultValue: 'homeless'},
+    'state',
+    {name: 'location',  convert: location}
+]);
+
+// create the data store
+var store = new Ext.data.Store({
+    reader: new Ext.data.JsonReader(
+        {
+            idProperty: 'key',
+            root: 'daRoot',
+            totalProperty: 'total'
+        },
+        Dude  // recordType
+    )
+});
+
+var myData = [
+    { key: 1,
+      name: { first: 'Fat',    last:  'Albert' }
+      // notice no city, state provided in data object
+    },
+    { key: 2,
+      name: { first: 'Barney', last:  'Rubble' },
+      city: 'Bedrock', state: 'Stoneridge'
+    },
+    { key: 3,
+      name: { first: 'Cliff',  last:  'Claven' },
+      city: 'Boston',  state: 'MA'
+    }
+];
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} dateFormat
+     * <p>(Optional) Used when converting received data into a Date when the {@link #type} is specified as <code>"date"</code>.</p>
+     * <p>A format string for the {@link Date#parseDate Date.parseDate} function, or "timestamp" if the
+     * value provided by the Reader is a UNIX timestamp, or "time" if the value provided by the Reader is a
+     * javascript millisecond timestamp. See {@link Date}</p>
+     */
+    dateFormat: null,
+    
+    /**
+     * @cfg {Boolean} useNull
+     * <p>(Optional) Use when converting received data into a Number type (either int or float). If the value cannot be parsed,
+     * null will be used if useNull is true, otherwise the value will be 0. Defaults to <tt>false</tt>
+     */
+    useNull: false,
+    
+    /**
+     * @cfg {Mixed} defaultValue
+     * (Optional) The default value used <b>when a Record is being created by a {@link Ext.data.Reader Reader}</b>
+     * when the item referenced by the <code>{@link Ext.data.Field#mapping mapping}</code> does not exist in the data
+     * object (i.e. undefined). (defaults to "")
+     */
+    defaultValue: "",
+    /**
+     * @cfg {String/Number} mapping
+     * <p>(Optional) A path expression for use by the {@link Ext.data.DataReader} implementation
+     * that is creating the {@link Ext.data.Record Record} to extract the Field value from the data object.
+     * If the path expression is the same as the field name, the mapping may be omitted.</p>
+     * <p>The form of the mapping expression depends on the Reader being used.</p>
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.data.JsonReader}<div class="sub-desc">The mapping is a string containing the javascript
+     * expression to reference the data from an element of the data item's {@link Ext.data.JsonReader#root root} Array. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.XmlReader}<div class="sub-desc">The mapping is an {@link Ext.DomQuery} path to the data
+     * item relative to the DOM element that represents the {@link Ext.data.XmlReader#record record}. Defaults to the field name.</div></li>
+     * <li>{@link Ext.data.ArrayReader}<div class="sub-desc">The mapping is a number indicating the Array index
+     * of the field's value. Defaults to the field specification's Array position.</div></li>
+     * </ul></div>
+     * <p>If a more complex value extraction strategy is required, then configure the Field with a {@link #convert}
+     * function. This is passed the whole row object, and may interrogate it in whatever way is necessary in order to
+     * return the desired data.</p>
+     */
+    mapping: null,
+    /**
+     * @cfg {Function} sortType
+     * (Optional) A function which converts a Field's value to a comparable value in order to ensure
+     * correct sort ordering. Predefined functions are provided in {@link Ext.data.SortTypes}. A custom
+     * sort example:<pre><code>
+// current sort     after sort we want
+// +-+------+          +-+------+
+// |1|First |          |1|First |
+// |2|Last  |          |3|Second|
+// |3|Second|          |2|Last  |
+// +-+------+          +-+------+
+
+sortType: function(value) {
+   switch (value.toLowerCase()) // native toLowerCase():
+   {
+      case 'first': return 1;
+      case 'second': return 2;
+      default: return 3;
+   }
+}
+     * </code></pre>
+     */
+    sortType : null,
+    /**
+     * @cfg {String} sortDir
+     * (Optional) Initial direction to sort (<code>"ASC"</code> or  <code>"DESC"</code>).  Defaults to
+     * <code>"ASC"</code>.
+     */
+    sortDir : "ASC",
+    /**
+     * @cfg {Boolean} allowBlank
+     * (Optional) Used for validating a {@link Ext.data.Record record}, defaults to <code>true</code>.
+     * An empty value here will cause {@link Ext.data.Record}.{@link Ext.data.Record#isValid isValid}
+     * to evaluate to <code>false</code>.
+     */
+    allowBlank : true
+});
+/**
+ * @class Ext.data.DataReader
+ * Abstract base class for reading structured data from a data source and converting
+ * it into an object containing {@link Ext.data.Record} objects and metadata for use
+ * by an {@link Ext.data.Store}.  This class is intended to be extended and should not
+ * be created directly. For existing implementations, see {@link Ext.data.ArrayReader},
+ * {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}.
+ * @constructor Create a new DataReader
+ * @param {Object} meta Metadata configuration options (implementation-specific).
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created using {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.DataReader = function(meta, recordType){
+    /**
+     * This DataReader's configured metadata as passed to the constructor.
+     * @type Mixed
+     * @property meta
+     */
+    this.meta = meta;
+    /**
+     * @cfg {Array/Object} fields
+     * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+     * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+     * constructor created from {@link Ext.data.Record#create}.</p>
+     */
+    this.recordType = Ext.isArray(recordType) ?
+        Ext.data.Record.create(recordType) : recordType;
+
+    // if recordType defined make sure extraction functions are defined
+    if (this.recordType){
+        this.buildExtractors();
+    }
+};
+
+Ext.data.DataReader.prototype = {
+    /**
+     * @cfg {String} messageProperty [undefined] Optional name of a property within a server-response that represents a user-feedback message.
+     */
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getTotal: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getRoot: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getMessage: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getSuccess: Ext.emptyFn,
+    /**
+     * Abstract method created in extension's buildExtractors impl.
+     */
+    getId: Ext.emptyFn,
+    /**
+     * Abstract method, overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    buildExtractors : Ext.emptyFn,
+    /**
+     * Abstract method overridden in DataReader extensions such as {@link Ext.data.JsonReader} and {@link Ext.data.XmlReader}
+     */
+    extractValues : Ext.emptyFn,
+
+    /**
+     * Used for un-phantoming a record after a successful database insert.  Sets the records pk along with new data from server.
+     * You <b>must</b> return at least the database pk using the idProperty defined in your DataReader configuration.  The incoming
+     * data from server will be merged with the data in the local record.
+     * In addition, you <b>must</b> return record-data from the server in the same order received.
+     * Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be suppressed.
+     * @param {Record/Record[]} record The phantom record to be realized.
+     * @param {Object/Object[]} data The new record data to apply.  Must include the primary-key from database defined in idProperty field.
+     */
+    realize: function(rs, data){
+        if (Ext.isArray(rs)) {
+            for (var i = rs.length - 1; i >= 0; i--) {
+                // recurse
+                if (Ext.isArray(data)) {
+                    this.realize(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole invalid data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.realize(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (!this.isData(data)) {
+                // TODO: Let exception-handler choose to commit or not rather than blindly rs.commit() here.
+                //rs.commit();
+                throw new Ext.data.DataReader.Error('realize', rs);
+            }
+            rs.phantom = false; // <-- That's what it's all about
+            rs._phid = rs.id;  // <-- copy phantom-id -> _phid, so we can remap in Store#onCreateRecords
+            rs.id = this.getId(data);
+            rs.data = data;
+
+            rs.commit();
+            rs.store.reMap(rs);
+        }
+    },
+
+    /**
+     * Used for updating a non-phantom or "real" record's data with fresh data from server after remote-save.
+     * If returning data from multiple-records after a batch-update, you <b>must</b> return record-data from the server in
+     * the same order received.  Will perform a commit as well, un-marking dirty-fields.  Store's "update" event will be
+     * suppressed as the record receives fresh new data-hash
+     * @param {Record/Record[]} rs
+     * @param {Object/Object[]} data
+     */
+    update : function(rs, data) {
+        if (Ext.isArray(rs)) {
+            for (var i=rs.length-1; i >= 0; i--) {
+                if (Ext.isArray(data)) {
+                    this.update(rs.splice(i,1).shift(), data.splice(i,1).shift());
+                }
+                else {
+                    // weird...rs is an array but data isn't??  recurse but just send in the whole data object.
+                    // the else clause below will detect !this.isData and throw exception.
+                    this.update(rs.splice(i,1).shift(), data);
+                }
+            }
+        }
+        else {
+            // If rs is NOT an array but data IS, see if data contains just 1 record.  If so extract it and carry on.
+            if (Ext.isArray(data) && data.length == 1) {
+                data = data.shift();
+            }
+            if (this.isData(data)) {
+                rs.data = Ext.apply(rs.data, data);
+            }
+            rs.commit();
+        }
+    },
+
+    /**
+     * returns extracted, type-cast rows of data.  Iterates to call #extractValues for each row
+     * @param {Object[]/Object} data-root from server response
+     * @param {Boolean} returnRecords [false] Set true to return instances of Ext.data.Record
+     * @private
+     */
+    extractData : function(root, returnRecords) {
+        // A bit ugly this, too bad the Record's raw data couldn't be saved in a common property named "raw" or something.
+        var rawName = (this instanceof Ext.data.JsonReader) ? 'json' : 'node';
+
+        var rs = [];
+
+        // Had to add Check for XmlReader, #isData returns true if root is an Xml-object.  Want to check in order to re-factor
+        // #extractData into DataReader base, since the implementations are almost identical for JsonReader, XmlReader
+        if (this.isData(root) && !(this instanceof Ext.data.XmlReader)) {
+            root = [root];
+        }
+        var f       = this.recordType.prototype.fields,
+            fi      = f.items,
+            fl      = f.length,
+            rs      = [];
+        if (returnRecords === true) {
+            var Record = this.recordType;
+            for (var i = 0; i < root.length; i++) {
+                var n = root[i];
+                var record = new Record(this.extractValues(n, fi, fl), this.getId(n));
+                record[rawName] = n;    // <-- There's implementation of ugly bit, setting the raw record-data.
+                rs.push(record);
+            }
+        }
+        else {
+            for (var i = 0; i < root.length; i++) {
+                var data = this.extractValues(root[i], fi, fl);
+                data[this.meta.idProperty] = this.getId(root[i]);
+                rs.push(data);
+            }
+        }
+        return rs;
+    },
+
+    /**
+     * Returns true if the supplied data-hash <b>looks</b> and quacks like data.  Checks to see if it has a key
+     * corresponding to idProperty defined in your DataReader config containing non-empty pk.
+     * @param {Object} data
+     * @return {Boolean}
+     */
+    isData : function(data) {
+        return (data && Ext.isObject(data) && !Ext.isEmpty(this.getId(data))) ? true : false;
+    },
+
+    // private function a store will createSequence upon
+    onMetaChange : function(meta){
+        delete this.ef;
+        this.meta = meta;
+        this.recordType = Ext.data.Record.create(meta.fields);
+        this.buildExtractors();
+    }
+};
+
+/**
+ * @class Ext.data.DataReader.Error
+ * @extends Ext.Error
+ * General error class for Ext.data.DataReader
+ */
+Ext.data.DataReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataReader'
+});
+Ext.apply(Ext.data.DataReader.Error.prototype, {
+    lang : {
+        'update': "#update received invalid data from server.  Please see docs for DataReader#update and review your DataReader configuration.",
+        'realize': "#realize was called with invalid remote-data.  Please see the docs for DataReader#realize and review your DataReader configuration.",
+        'invalid-response': "#readResponse received an invalid response from the server."
+    }
+});
+/**
+ * @class Ext.data.DataWriter
+ * <p>Ext.data.DataWriter facilitates create, update, and destroy actions between
+ * an Ext.data.Store and a server-side framework. A Writer enabled Store will
+ * automatically manage the Ajax requests to perform CRUD actions on a Store.</p>
+ * <p>Ext.data.DataWriter is an abstract base class which is intended to be extended
+ * and should not be created directly. For existing implementations, see
+ * {@link Ext.data.JsonWriter}.</p>
+ * <p>Creating a writer is simple:</p>
+ * <pre><code>
+var writer = new Ext.data.JsonWriter({
+    encode: false   // &lt;--- false causes data to be printed to jsonData config-property of Ext.Ajax#reqeust
+});
+ * </code></pre>
+ * * <p>Same old JsonReader as Ext-2.x:</p>
+ * <pre><code>
+var reader = new Ext.data.JsonReader({idProperty: 'id'}, [{name: 'first'}, {name: 'last'}, {name: 'email'}]);
+ * </code></pre>
+ *
+ * <p>The proxy for a writer enabled store can be configured with a simple <code>url</code>:</p>
+ * <pre><code>
+// Create a standard HttpProxy instance.
+var proxy = new Ext.data.HttpProxy({
+    url: 'app.php/users'    // &lt;--- Supports "provides"-type urls, such as '/users.json', '/products.xml' (Hello Rails/Merb)
+});
+ * </code></pre>
+ * <p>For finer grained control, the proxy may also be configured with an <code>API</code>:</p>
+ * <pre><code>
+// Maximum flexibility with the API-configuration
+var proxy = new Ext.data.HttpProxy({
+    api: {
+        read    : 'app.php/users/read',
+        create  : 'app.php/users/create',
+        update  : 'app.php/users/update',
+        destroy : {  // &lt;--- Supports object-syntax as well
+            url: 'app.php/users/destroy',
+            method: "DELETE"
+        }
+    }
+});
+ * </code></pre>
+ * <p>Pulling it all together into a Writer-enabled Store:</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: true  // -- Cell-level updates.
+});
+ * </code></pre>
+ * <p>Initiating write-actions <b>automatically</b>, using the existing Ext2.0 Store/Record API:</p>
+ * <pre><code>
+var rec = store.getAt(0);
+rec.set('email', 'foo@bar.com');  // &lt;--- Immediately initiates an UPDATE action through configured proxy.
+
+store.remove(rec);  // &lt;---- Immediately initiates a DESTROY action through configured proxy.
+ * </code></pre>
+ * <p>For <b>record/batch</b> updates, use the Store-configuration {@link Ext.data.Store#autoSave autoSave:false}</p>
+ * <pre><code>
+var store = new Ext.data.Store({
+    proxy: proxy,
+    reader: reader,
+    writer: writer,
+    autoLoad: true,
+    autoSave: false  // -- disable cell-updates
+});
+
+var urec = store.getAt(0);
+urec.set('email', 'foo@bar.com');
+
+var drec = store.getAt(1);
+store.remove(drec);
+
+// Push the button!
+store.save();
+ * </code></pre>
+ * @constructor Create a new DataWriter
+ * @param {Object} meta Metadata configuration options (implementation-specific)
+ * @param {Object} recordType Either an Array of field definition objects as specified
+ * in {@link Ext.data.Record#create}, or an {@link Ext.data.Record} object created
+ * using {@link Ext.data.Record#create}.
+ */
+Ext.data.DataWriter = function(config){
+    Ext.apply(this, config);
+};
+Ext.data.DataWriter.prototype = {
+
+    /**
+     * @cfg {Boolean} writeAllFields
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have DataWriter return ALL fields of a modified
+     * record -- not just those that changed.
+     * <tt>false</tt> to have DataWriter only request modified fields from a record.
+     */
+    writeAllFields : false,
+    /**
+     * @cfg {Boolean} listful
+     * <tt>false</tt> by default.  Set <tt>true</tt> to have the DataWriter <b>always</b> write HTTP params as a list,
+     * even when acting upon a single record.
+     */
+    listful : false,    // <-- listful is actually not used internally here in DataWriter.  @see Ext.data.Store#execute.
+
+    /**
+     * Compiles a Store recordset into a data-format defined by an extension such as {@link Ext.data.JsonWriter} or {@link Ext.data.XmlWriter} in preparation for a {@link Ext.data.Api#actions server-write action}.  The first two params are similar similar in nature to {@link Ext#apply},
+     * Where the first parameter is the <i>receiver</i> of paramaters and the second, baseParams, <i>the source</i>.
+     * @param {Object} params The request-params receiver.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {String} action [{@link Ext.data.Api#actions create|update|destroy}]
+     * @param {Record/Record[]} rs The recordset to write, the subject(s) of the write action.
+     */
+    apply : function(params, baseParams, action, rs) {
+        var data    = [],
+        renderer    = action + 'Record';
+        // TODO implement @cfg listful here
+        if (Ext.isArray(rs)) {
+            Ext.each(rs, function(rec){
+                data.push(this[renderer](rec));
+            }, this);
+        }
+        else if (rs instanceof Ext.data.Record) {
+            data = this[renderer](rs);
+        }
+        this.render(params, baseParams, data);
+    },
+
+    /**
+     * abstract method meant to be overridden by all DataWriter extensions.  It's the extension's job to apply the "data" to the "params".
+     * The data-object provided to render is populated with data according to the meta-info defined in the user's DataReader config,
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Record[]} rs Store recordset
+     * @param {Object} params Http params to be sent to server.
+     * @param {Object} data object populated according to DataReader meta-data.
+     */
+    render : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} updateRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#updateRecord JsonWriter.updateRecord}
+     */
+    updateRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} createRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#createRecord JsonWriter.createRecord})
+     */
+    createRecord : Ext.emptyFn,
+
+    /**
+     * @cfg {Function} destroyRecord Abstract method that should be implemented in all subclasses
+     * (e.g.: {@link Ext.data.JsonWriter#destroyRecord JsonWriter.destroyRecord})
+     */
+    destroyRecord : Ext.emptyFn,
+
+    /**
+     * Converts a Record to a hash, taking into account the state of the Ext.data.Record along with configuration properties
+     * related to its rendering, such as {@link #writeAllFields}, {@link Ext.data.Record#phantom phantom}, {@link Ext.data.Record#getChanges getChanges} and
+     * {@link Ext.data.DataReader#idProperty idProperty}
+     * @param {Ext.data.Record} rec The Record from which to create a hash.
+     * @param {Object} config <b>NOT YET IMPLEMENTED</b>.  Will implement an exlude/only configuration for fine-control over which fields do/don't get rendered.
+     * @return {Object}
+     * @protected
+     * TODO Implement excludes/only configuration with 2nd param?
+     */
+    toHash : function(rec, config) {
+        var map = rec.fields.map,
+            data = {},
+            raw = (this.writeAllFields === false && rec.phantom === false) ? rec.getChanges() : rec.data,
+            m;
+        Ext.iterate(raw, function(prop, value){
+            if((m = map[prop])){
+                data[m.mapping ? m.mapping : m.name] = value;
+            }
+        });
+        // we don't want to write Ext auto-generated id to hash.  Careful not to remove it on Models not having auto-increment pk though.
+        // We can tell its not auto-increment if the user defined a DataReader field for it *and* that field's value is non-empty.
+        // we could also do a RegExp here for the Ext.data.Record AUTO_ID prefix.
+        if (rec.phantom) {
+            if (rec.fields.containsKey(this.meta.idProperty) && Ext.isEmpty(rec.data[this.meta.idProperty])) {
+                delete data[this.meta.idProperty];
+            }
+        } else {
+            data[this.meta.idProperty] = rec.id;
+        }
+        return data;
+    },
+
+    /**
+     * Converts a {@link Ext.data.DataWriter#toHash Hashed} {@link Ext.data.Record} to fields-array array suitable
+     * for encoding to xml via XTemplate, eg:
+<code><pre>&lt;tpl for=".">&lt;{name}>{value}&lt;/{name}&lt;/tpl></pre></code>
+     * eg, <b>non-phantom</b>:
+<code><pre>{id: 1, first: 'foo', last: 'bar'} --> [{name: 'id', value: 1}, {name: 'first', value: 'foo'}, {name: 'last', value: 'bar'}]</pre></code>
+     * {@link Ext.data.Record#phantom Phantom} records will have had their idProperty omitted in {@link #toHash} if determined to be auto-generated.
+     * Non AUTOINCREMENT pks should have been protected.
+     * @param {Hash} data Hashed by Ext.data.DataWriter#toHash
+     * @return {[Object]} Array of attribute-objects.
+     * @protected
+     */
+    toArray : function(data) {
+        var fields = [];
+        Ext.iterate(data, function(k, v) {fields.push({name: k, value: v});},this);
+        return fields;
+    }
+};/**
+ * @class Ext.data.DataProxy
+ * @extends Ext.util.Observable
+ * <p>Abstract base class for implementations which provide retrieval of unformatted data objects.
+ * This class is intended to be extended and should not be created directly. For existing implementations,
+ * see {@link Ext.data.DirectProxy}, {@link Ext.data.HttpProxy}, {@link Ext.data.ScriptTagProxy} and
+ * {@link Ext.data.MemoryProxy}.</p>
+ * <p>DataProxy implementations are usually used in conjunction with an implementation of {@link Ext.data.DataReader}
+ * (of the appropriate type which knows how to parse the data object) to provide a block of
+ * {@link Ext.data.Records} to an {@link Ext.data.Store}.</p>
+ * <p>The parameter to a DataProxy constructor may be an {@link Ext.data.Connection} or can also be the
+ * config object to an {@link Ext.data.Connection}.</p>
+ * <p>Custom implementations must implement either the <code><b>doRequest</b></code> method (preferred) or the
+ * <code>load</code> method (deprecated). See
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#doRequest doRequest} or
+ * {@link Ext.data.HttpProxy}.{@link Ext.data.HttpProxy#load load} for additional details.</p>
+ * <p><b><u>Example 1</u></b></p>
+ * <pre><code>
+proxy: new Ext.data.ScriptTagProxy({
+    {@link Ext.data.Connection#url url}: 'http://extjs.com/forum/topics-remote.php'
+}),
+ * </code></pre>
+ * <p><b><u>Example 2</u></b></p>
+ * <pre><code>
+proxy : new Ext.data.HttpProxy({
+    {@link Ext.data.Connection#method method}: 'GET',
+    {@link Ext.data.HttpProxy#prettyUrls prettyUrls}: false,
+    {@link Ext.data.Connection#url url}: 'local/default.php', // see options parameter for {@link Ext.Ajax#request}
+    {@link #api}: {
+        // all actions except the following will use above url
+        create  : 'local/new.php',
+        update  : 'local/update.php'
+    }
+}),
+ * </code></pre>
+ * <p>And <b>new in Ext version 3</b>, attach centralized event-listeners upon the DataProxy class itself!  This is a great place
+ * to implement a <i>messaging system</i> to centralize your application's user-feedback and error-handling.</p>
+ * <pre><code>
+// Listen to all "beforewrite" event fired by all proxies.
+Ext.data.DataProxy.on('beforewrite', function(proxy, action) {
+    console.log('beforewrite: ', action);
+});
+
+// Listen to "write" event fired by all proxies
+Ext.data.DataProxy.on('write', function(proxy, action, data, res, rs) {
+    console.info('write: ', action);
+});
+
+// Listen to "exception" event fired by all proxies
+Ext.data.DataProxy.on('exception', function(proxy, type, action, exception) {
+    console.error(type + action + ' exception);
+});
+ * </code></pre>
+ * <b>Note:</b> These three events are all fired with the signature of the corresponding <i>DataProxy instance</i> event {@link #beforewrite beforewrite}, {@link #write write} and {@link #exception exception}.
+ */
+Ext.data.DataProxy = function(conn){
+    // make sure we have a config object here to support ux proxies.
+    // All proxies should now send config into superclass constructor.
+    conn = conn || {};
+
+    // This line caused a bug when people use custom Connection object having its own request method.
+    // http://extjs.com/forum/showthread.php?t=67194.  Have to set DataProxy config
+    //Ext.applyIf(this, conn);
+
+    this.api     = conn.api;
+    this.url     = conn.url;
+    this.restful = conn.restful;
+    this.listeners = conn.listeners;
+
+    // deprecated
+    this.prettyUrls = conn.prettyUrls;
+
+    /**
+     * @cfg {Object} api
+     * Specific urls to call on CRUD action methods "read", "create", "update" and "destroy".
+     * Defaults to:<pre><code>
+api: {
+    read    : undefined,
+    create  : undefined,
+    update  : undefined,
+    destroy : undefined
+}
+     * </code></pre>
+     * <p>The url is built based upon the action being executed <tt>[load|create|save|destroy]</tt>
+     * using the commensurate <tt>{@link #api}</tt> property, or if undefined default to the
+     * configured {@link Ext.data.Store}.{@link Ext.data.Store#url url}.</p><br>
+     * <p>For example:</p>
+     * <pre><code>
+api: {
+    load :    '/controller/load',
+    create :  '/controller/new',  // Server MUST return idProperty of new record
+    save :    '/controller/update',
+    destroy : '/controller/destroy_action'
+}
+
+// Alternatively, one can use the object-form to specify each API-action
+api: {
+    load: {url: 'read.php', method: 'GET'},
+    create: 'create.php',
+    destroy: 'destroy.php',
+    save: 'update.php'
+}
+     * </code></pre>
+     * <p>If the specific URL for a given CRUD action is undefined, the CRUD action request
+     * will be directed to the configured <tt>{@link Ext.data.Connection#url url}</tt>.</p>
+     * <br><p><b>Note</b>: To modify the URL for an action dynamically the appropriate API
+     * property should be modified before the action is requested using the corresponding before
+     * action event.  For example to modify the URL associated with the load action:
+     * <pre><code>
+// modify the url for the action
+myStore.on({
+    beforeload: {
+        fn: function (store, options) {
+            // use <tt>{@link Ext.data.HttpProxy#setUrl setUrl}</tt> to change the URL for *just* this request.
+            store.proxy.setUrl('changed1.php');
+
+            // set optional second parameter to true to make this URL change
+            // permanent, applying this URL for all subsequent requests.
+            store.proxy.setUrl('changed1.php', true);
+
+            // Altering the proxy API should be done using the public
+            // method <tt>{@link Ext.data.DataProxy#setApi setApi}</tt>.
+            store.proxy.setApi('read', 'changed2.php');
+
+            // Or set the entire API with a config-object.
+            // When using the config-object option, you must redefine the <b>entire</b>
+            // API -- not just a specific action of it.
+            store.proxy.setApi({
+                read    : 'changed_read.php',
+                create  : 'changed_create.php',
+                update  : 'changed_update.php',
+                destroy : 'changed_destroy.php'
+            });
+        }
+    }
+});
+     * </code></pre>
+     * </p>
+     */
+
+    this.addEvents(
+        /**
+         * @event exception
+         * <p>Fires if an exception occurs in the Proxy during a remote request. This event is relayed
+         * through a corresponding {@link Ext.data.Store}.{@link Ext.data.Store#exception exception},
+         * so any Store instance may observe this event.</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of exception events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * <p>This event can be fired for one of two reasons:</p>
+         * <div class="mdetail-params"><ul>
+         * <li>remote-request <b>failed</b> : <div class="sub-desc">
+         * The server did not return status === 200.
+         * </div></li>
+         * <li>remote-request <b>succeeded</b> : <div class="sub-desc">
+         * The remote-request succeeded but the reader could not read the response.
+         * This means the server returned data, but the configured Reader threw an
+         * error while reading the response.  In this case, this event will be
+         * raised and the caught error will be passed along into this event.
+         * </div></li>
+         * </ul></div>
+         * <br><p>This event fires with two different contexts based upon the 2nd
+         * parameter <tt>type [remote|response]</tt>.  The first four parameters
+         * are identical between the two contexts -- only the final two parameters
+         * differ.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} type
+         * <p>The value of this parameter will be either <tt>'response'</tt> or <tt>'remote'</tt>.</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>An <b>invalid</b> response from the server was returned: either 404,
+         * 500 or the response meta-data does not match that defined in the DataReader
+         * (e.g.: root, idProperty, successProperty).</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>A <b>valid</b> response was returned from the server having
+         * successProperty === false.  This response might contain an error-message
+         * sent from the server.  For example, the user may have failed
+         * authentication/authorization or a database validation error occurred.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {String} action Name of the action (see {@link Ext.data.Api#actions}.
+         * @param {Object} options The options for the action that were specified in the {@link #request}.
+         * @param {Object} response
+         * <p>The value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : <div class="sub-desc">
+         * <p>The raw browser response object (e.g.: XMLHttpRequest)</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : <div class="sub-desc">
+         * <p>The decoded response object sent from the server.</p>
+         * </div></li>
+         * </ul></div>
+         * @param {Mixed} arg
+         * <p>The type and value of this parameter depends on the value of the <code>type</code> parameter:</p>
+         * <div class="mdetail-params"><ul>
+         * <li><b><tt>'response'</tt></b> : Error<div class="sub-desc">
+         * <p>The JavaScript Error object caught if the configured Reader could not read the data.
+         * If the remote request returns success===false, this parameter will be null.</p>
+         * </div></li>
+         * <li><b><tt>'remote'</tt></b> : Record/Record[]<div class="sub-desc">
+         * <p>This parameter will only exist if the <tt>action</tt> was a <b>write</b> action
+         * (Ext.data.Api.actions.create|update|destroy).</p>
+         * </div></li>
+         * </ul></div>
+         */
+        'exception',
+        /**
+         * @event beforeload
+         * Fires before a request to retrieve a data object.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} params The params object passed to the {@link #request} function
+         */
+        'beforeload',
+        /**
+         * @event load
+         * Fires before the load method's callback is called.
+         * @param {DataProxy} this The proxy for the request
+         * @param {Object} o The request transaction object
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'load',
+        /**
+         * @event loadexception
+         * <p>This event is <b>deprecated</b>.  The signature of the loadexception event
+         * varies depending on the proxy, use the catch-all {@link #exception} event instead.
+         * This event will fire in addition to the {@link #exception} event.</p>
+         * @param {misc} misc See {@link #exception}.
+         * @deprecated
+         */
+        'loadexception',
+        /**
+         * @event beforewrite
+         * <p>Fires before a request is generated for one of the actions Ext.data.Api.actions.create|update|destroy</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of beforewrite events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy for the request
+         * @param {String} action [Ext.data.Api.actions.create|update|destroy]
+         * @param {Record/Record[]} rs The Record(s) to create|update|destroy.
+         * @param {Object} params The request <code>params</code> object.  Edit <code>params</code> to add parameters to the request.
+         */
+        'beforewrite',
+        /**
+         * @event write
+         * <p>Fires before the request-callback is called</p>
+         * <p>In addition to being fired through the DataProxy instance that raised the event, this event is also fired
+         * through the Ext.data.DataProxy <i>class</i> to allow for centralized processing of write events from <b>all</b>
+         * DataProxies by attaching a listener to the Ext.data.DataProxy class itself.</p>
+         * @param {DataProxy} this The proxy that sent the request
+         * @param {String} action [Ext.data.Api.actions.create|upate|destroy]
+         * @param {Object} data The data object extracted from the server-response
+         * @param {Object} response The decoded response from server
+         * @param {Record/Record[]} rs The Record(s) from Store
+         * @param {Object} options The callback's <tt>options</tt> property as passed to the {@link #request} function
+         */
+        'write'
+    );
+    Ext.data.DataProxy.superclass.constructor.call(this);
+
+    // Prepare the proxy api.  Ensures all API-actions are defined with the Object-form.
+    try {
+        Ext.data.Api.prepare(this);
+    } catch (e) {
+        if (e instanceof Ext.data.Api.Error) {
+            e.toConsole();
+        }
+    }
+    // relay each proxy's events onto Ext.data.DataProxy class for centralized Proxy-listening
+    Ext.data.DataProxy.relayEvents(this, ['beforewrite', 'write', 'exception']);
+};
+
+Ext.extend(Ext.data.DataProxy, Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} restful
+     * <p>Defaults to <tt>false</tt>.  Set to <tt>true</tt> to operate in a RESTful manner.</p>
+     * <br><p> Note: this parameter will automatically be set to <tt>true</tt> if the
+     * {@link Ext.data.Store} it is plugged into is set to <code>restful: true</code>. If the
+     * Store is RESTful, there is no need to set this option on the proxy.</p>
+     * <br><p>RESTful implementations enable the serverside framework to automatically route
+     * actions sent to one url based upon the HTTP method, for example:
+     * <pre><code>
+store: new Ext.data.Store({
+    restful: true,
+    proxy: new Ext.data.HttpProxy({url:'/users'}); // all requests sent to /users
+    ...
+)}
+     * </code></pre>
+     * If there is no <code>{@link #api}</code> specified in the configuration of the proxy,
+     * all requests will be marshalled to a single RESTful url (/users) so the serverside
+     * framework can inspect the HTTP Method and act accordingly:
+     * <pre>
+<u>Method</u>   <u>url</u>        <u>action</u>
+POST     /users     create
+GET      /users     read
+PUT      /users/23  update
+DESTROY  /users/23  delete
+     * </pre></p>
+     * <p>If set to <tt>true</tt>, a {@link Ext.data.Record#phantom non-phantom} record's
+     * {@link Ext.data.Record#id id} will be appended to the url. Some MVC (e.g., Ruby on Rails,
+     * Merb and Django) support segment based urls where the segments in the URL follow the
+     * Model-View-Controller approach:<pre><code>
+     * someSite.com/controller/action/id
+     * </code></pre>
+     * Where the segments in the url are typically:<div class="mdetail-params"><ul>
+     * <li>The first segment : represents the controller class that should be invoked.</li>
+     * <li>The second segment : represents the class function, or method, that should be called.</li>
+     * <li>The third segment : represents the ID (a variable typically passed to the method).</li>
+     * </ul></div></p>
+     * <br><p>Refer to <code>{@link Ext.data.DataProxy#api}</code> for additional information.</p>
+     */
+    restful: false,
+
+    /**
+     * <p>Redefines the Proxy's API or a single action of an API. Can be called with two method signatures.</p>
+     * <p>If called with an object as the only parameter, the object should redefine the <b>entire</b> API, e.g.:</p><pre><code>
+proxy.setApi({
+    read    : '/users/read',
+    create  : '/users/create',
+    update  : '/users/update',
+    destroy : '/users/destroy'
+});
+</code></pre>
+     * <p>If called with two parameters, the first parameter should be a string specifying the API action to
+     * redefine and the second parameter should be the URL (or function if using DirectProxy) to call for that action, e.g.:</p><pre><code>
+proxy.setApi(Ext.data.Api.actions.read, '/users/new_load_url');
+</code></pre>
+     * @param {String/Object} api An API specification object, or the name of an action.
+     * @param {String/Function} url The URL (or function if using DirectProxy) to call for the action.
+     */
+    setApi : function() {
+        if (arguments.length == 1) {
+            var valid = Ext.data.Api.isValid(arguments[0]);
+            if (valid === true) {
+                this.api = arguments[0];
+            }
+            else {
+                throw new Ext.data.Api.Error('invalid', valid);
+            }
+        }
+        else if (arguments.length == 2) {
+            if (!Ext.data.Api.isAction(arguments[0])) {
+                throw new Ext.data.Api.Error('invalid', arguments[0]);
+            }
+            this.api[arguments[0]] = arguments[1];
+        }
+        Ext.data.Api.prepare(this);
+    },
+
+    /**
+     * Returns true if the specified action is defined as a unique action in the api-config.
+     * request.  If all API-actions are routed to unique urls, the xaction parameter is unecessary.  However, if no api is defined
+     * and all Proxy actions are routed to DataProxy#url, the server-side will require the xaction parameter to perform a switch to
+     * the corresponding code for CRUD action.
+     * @param {String [Ext.data.Api.CREATE|READ|UPDATE|DESTROY]} action
+     * @return {Boolean}
+     */
+    isApiAction : function(action) {
+        return (this.api[action]) ? true : false;
+    },
+
+    /**
+     * All proxy actions are executed through this method.  Automatically fires the "before" + action event
+     * @param {String} action Name of the action
+     * @param {Ext.data.Record/Ext.data.Record[]/null} rs Will be null when action is 'load'
+     * @param {Object} params
+     * @param {Ext.data.DataReader} reader
+     * @param {Function} callback
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the Proxy object.
+     * @param {Object} options Any options specified for the action (e.g. see {@link Ext.data.Store#load}.
+     */
+    request : function(action, rs, params, reader, callback, scope, options) {
+        if (!this.api[action] && !this.load) {
+            throw new Ext.data.DataProxy.Error('action-undefined', action);
+        }
+        params = params || {};
+        if ((action === Ext.data.Api.actions.read) ? this.fireEvent("beforeload", this, params) : this.fireEvent("beforewrite", this, action, rs, params) !== false) {
+            this.doRequest.apply(this, arguments);
+        }
+        else {
+            callback.call(scope || this, null, options, false);
+        }
+    },
+
+
+    /**
+     * <b>Deprecated</b> load method using old method signature. See {@doRequest} for preferred method.
+     * @deprecated
+     * @param {Object} params
+     * @param {Object} reader
+     * @param {Object} callback
+     * @param {Object} scope
+     * @param {Object} arg
+     */
+    load : null,
+
+    /**
+     * @cfg {Function} doRequest Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.
+     * (e.g.: {@link Ext.data.HttpProxy#doRequest HttpProxy.doRequest},
+     * {@link Ext.data.DirectProxy#doRequest DirectProxy.doRequest}).
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        // default implementation of doRequest for backwards compatibility with 2.0 proxies.
+        // If we're executing here, the action is probably "load".
+        // Call with the pre-3.0 method signature.
+        this.load(params, reader, callback, scope, options);
+    },
+
+    /**
+     * @cfg {Function} onRead Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for read {@link Ext.data.Api#actions action}.
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : Ext.emptyFn,
+    /**
+     * @cfg {Function} onWrite Abstract method that should be implemented in all subclasses.  <b>Note:</b> Should only be used by custom-proxy developers.  Callback for <i>create, update and destroy</i> {@link Ext.data.Api#actions actions}.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : Ext.emptyFn,
+    /**
+     * buildUrl
+     * Sets the appropriate url based upon the action being executed.  If restful is true, and only a single record is being acted upon,
+     * url will be built Rails-style, as in "/controller/action/32".  restful will aply iff the supplied record is an
+     * instance of Ext.data.Record rather than an Array of them.
+     * @param {String} action The api action being executed [read|create|update|destroy]
+     * @param {Ext.data.Record/Ext.data.Record[]} record The record or Array of Records being acted upon.
+     * @return {String} url
+     * @private
+     */
+    buildUrl : function(action, record) {
+        record = record || null;
+
+        // conn.url gets nullified after each request.  If it's NOT null here, that means the user must have intervened with a call
+        // to DataProxy#setUrl or DataProxy#setApi and changed it before the request was executed.  If that's the case, use conn.url,
+        // otherwise, build the url from the api or this.url.
+        var url = (this.conn && this.conn.url) ? this.conn.url : (this.api[action]) ? this.api[action].url : this.url;
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', action);
+        }
+
+        // look for urls having "provides" suffix used in some MVC frameworks like Rails/Merb and others.  The provides suffice informs
+        // the server what data-format the client is dealing with and returns data in the same format (eg: application/json, application/xml, etc)
+        // e.g.: /users.json, /users.xml, etc.
+        // with restful routes, we need urls like:
+        // PUT /users/1.json
+        // DELETE /users/1.json
+        var provides = null;
+        var m = url.match(/(.*)(\.json|\.xml|\.html)$/);
+        if (m) {
+            provides = m[2];    // eg ".json"
+            url      = m[1];    // eg: "/users"
+        }
+        // prettyUrls is deprectated in favor of restful-config
+        if ((this.restful === true || this.prettyUrls === true) && record instanceof Ext.data.Record && !record.phantom) {
+            url += '/' + record.id;
+        }
+        return (provides === null) ? url : url + provides;
+    },
+
+    /**
+     * Destroys the proxy by purging any event listeners and cancelling any active requests.
+     */
+    destroy: function(){
+        this.purgeListeners();
+    }
+});
+
+// Apply the Observable prototype to the DataProxy class so that proxy instances can relay their
+// events to the class.  Allows for centralized listening of all proxy instances upon the DataProxy class.
+Ext.apply(Ext.data.DataProxy, Ext.util.Observable.prototype);
+Ext.util.Observable.call(Ext.data.DataProxy);
+
+/**
+ * @class Ext.data.DataProxy.Error
+ * @extends Ext.Error
+ * DataProxy Error extension.
+ * constructor
+ * @param {String} message Message describing the error.
+ * @param {Record/Record[]} arg
+ */
+Ext.data.DataProxy.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name: 'Ext.data.DataProxy'
+});
+Ext.apply(Ext.data.DataProxy.Error.prototype, {
+    lang: {
+        'action-undefined': "DataProxy attempted to execute an API-action but found an undefined url / function.  Please review your Proxy url/api-configuration.",
+        'api-invalid': 'Recieved an invalid API-configuration.  Please ensure your proxy API-configuration contains only the actions from Ext.data.Api.actions.'
+    }
+});
+
+
+/**
+ * @class Ext.data.Request
+ * A simple Request class used internally to the data package to provide more generalized remote-requests
+ * to a DataProxy.
+ * TODO Not yet implemented.  Implement in Ext.data.Store#execute
+ */
+Ext.data.Request = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Request.prototype = {
+    /**
+     * @cfg {String} action
+     */
+    action : undefined,
+    /**
+     * @cfg {Ext.data.Record[]/Ext.data.Record} rs The Store recordset associated with the request.
+     */
+    rs : undefined,
+    /**
+     * @cfg {Object} params HTTP request params
+     */
+    params: undefined,
+    /**
+     * @cfg {Function} callback The function to call when request is complete
+     */
+    callback : Ext.emptyFn,
+    /**
+     * @cfg {Object} scope The scope of the callback funtion
+     */
+    scope : undefined,
+    /**
+     * @cfg {Ext.data.DataReader} reader The DataReader instance which will parse the received response
+     */
+    reader : undefined
+};
+/**
+ * @class Ext.data.Response
+ * A generic response class to normalize response-handling internally to the framework.
+ */
+Ext.data.Response = function(params) {
+    Ext.apply(this, params);
+};
+Ext.data.Response.prototype = {
+    /**
+     * @cfg {String} action {@link Ext.data.Api#actions}
+     */
+    action: undefined,
+    /**
+     * @cfg {Boolean} success
+     */
+    success : undefined,
+    /**
+     * @cfg {String} message
+     */
+    message : undefined,
+    /**
+     * @cfg {Array/Object} data
+     */
+    data: undefined,
+    /**
+     * @cfg {Object} raw The raw response returned from server-code
+     */
+    raw: undefined,
+    /**
+     * @cfg {Ext.data.Record/Ext.data.Record[]} records related to the Request action
+     */
+    records: undefined
+};
+/**
+ * @class Ext.data.ScriptTagProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that reads a data object from a URL which may be in a domain
+ * other than the originating domain of the running page.<br>
+ * <p>
+ * <b>Note that if you are retrieving data from a page that is in a domain that is NOT the same as the originating domain
+ * of the running page, you must use this class, rather than HttpProxy.</b><br>
+ * <p>
+ * The content passed back from a server resource requested by a ScriptTagProxy <b>must</b> be executable JavaScript
+ * source code because it is used as the source inside a &lt;script> tag.<br>
+ * <p>
+ * In order for the browser to process the returned data, the server must wrap the data object
+ * with a call to a callback function, the name of which is passed as a parameter by the ScriptTagProxy.
+ * Below is a Java example for a servlet which returns data for either a ScriptTagProxy, or an HttpProxy
+ * depending on whether the callback name was passed:
+ * <p>
+ * <pre><code>
+boolean scriptTag = false;
+String cb = request.getParameter("callback");
+if (cb != null) {
+    scriptTag = true;
+    response.setContentType("text/javascript");
+} else {
+    response.setContentType("application/x-json");
+}
+Writer out = response.getWriter();
+if (scriptTag) {
+    out.write(cb + "(");
+}
+out.print(dataBlock.toJsonString());
+if (scriptTag) {
+    out.write(");");
+}
+</code></pre>
+ * <p>Below is a PHP example to do the same thing:</p><pre><code>
+$callback = $_REQUEST['callback'];
+
+// Create the output object.
+$output = array('a' => 'Apple', 'b' => 'Banana');
+
+//start output
+if ($callback) {
+    header('Content-Type: text/javascript');
+    echo $callback . '(' . json_encode($output) . ');';
+} else {
+    header('Content-Type: application/x-json');
+    echo json_encode($output);
+}
+</code></pre>
+ * <p>Below is the ASP.Net code to do the same thing:</p><pre><code>
+String jsonString = "{success: true}";
+String cb = Request.Params.Get("callback");
+String responseString = "";
+if (!String.IsNullOrEmpty(cb)) {
+    responseString = cb + "(" + jsonString + ")";
+} else {
+    responseString = jsonString;
+}
+Response.Write(responseString);
+</code></pre>
+ *
+ * @constructor
+ * @param {Object} config A configuration object.
+ */
+Ext.data.ScriptTagProxy = function(config){
+    Ext.apply(this, config);
+
+    Ext.data.ScriptTagProxy.superclass.constructor.call(this, config);
+
+    this.head = document.getElementsByTagName("head")[0];
+
+    /**
+     * @event loadexception
+     * <b>Deprecated</b> in favor of 'exception' event.
+     * Fires if an exception occurs in the Proxy during data loading.  This event can be fired for one of two reasons:
+     * <ul><li><b>The load call timed out.</b>  This means the load callback did not execute within the time limit
+     * specified by {@link #timeout}.  In this case, this event will be raised and the
+     * fourth parameter (read error) will be null.</li>
+     * <li><b>The load succeeded but the reader could not read the response.</b>  This means the server returned
+     * data, but the configured Reader threw an error while reading the data.  In this case, this event will be
+     * raised and the caught error will be passed along as the fourth parameter of this event.</li></ul>
+     * Note that this event is also relayed through {@link Ext.data.Store}, so you can listen for it directly
+     * on any Store instance.
+     * @param {Object} this
+     * @param {Object} options The loading options that were specified (see {@link #load} for details).  If the load
+     * call timed out, this parameter will be null.
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data.
+     * If the remote request returns success: false, this parameter will be null.
+     */
+};
+
+Ext.data.ScriptTagProxy.TRANS_ID = 1000;
+
+Ext.extend(Ext.data.ScriptTagProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {String} url The URL from which to request the data object.
+     */
+    /**
+     * @cfg {Number} timeout (optional) The number of milliseconds to wait for a response. Defaults to 30 seconds.
+     */
+    timeout : 30000,
+    /**
+     * @cfg {String} callbackParam (Optional) The name of the parameter to pass to the server which tells
+     * the server the name of the callback function set up by the load call to process the returned data object.
+     * Defaults to "callback".<p>The server-side processing must read this parameter value, and generate
+     * javascript output which calls this named function passing the data object as its only parameter.
+     */
+    callbackParam : "callback",
+    /**
+     *  @cfg {Boolean} nocache (optional) Defaults to true. Disable caching by adding a unique parameter
+     * name to the request.
+     */
+    nocache : true,
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is <tt>read</tt>, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        var p = Ext.urlEncode(Ext.apply(params, this.extraParams));
+
+        var url = this.buildUrl(action, rs);
+        if (!url) {
+            throw new Ext.data.Api.Error('invalid-url', url);
+        }
+        url = Ext.urlAppend(url, p);
+
+        if(this.nocache){
+            url = Ext.urlAppend(url, '_dc=' + (new Date().getTime()));
+        }
+        var transId = ++Ext.data.ScriptTagProxy.TRANS_ID;
+        var trans = {
+            id : transId,
+            action: action,
+            cb : "stcCallback"+transId,
+            scriptId : "stcScript"+transId,
+            params : params,
+            arg : arg,
+            url : url,
+            callback : callback,
+            scope : scope,
+            reader : reader
+        };
+        window[trans.cb] = this.createCallback(action, rs, trans);
+        url += String.format("&{0}={1}", this.callbackParam, trans.cb);
+        if(this.autoAbort !== false){
+            this.abort();
+        }
+
+        trans.timeoutId = this.handleFailure.defer(this.timeout, this, [trans]);
+
+        var script = document.createElement("script");
+        script.setAttribute("src", url);
+        script.setAttribute("type", "text/javascript");
+        script.setAttribute("id", trans.scriptId);
+        this.head.appendChild(script);
+
+        this.trans = trans;
+    },
+
+    // @private createCallback
+    createCallback : function(action, rs, trans) {
+        var self = this;
+        return function(res) {
+            self.trans = false;
+            self.destroyTrans(trans, true);
+            if (action === Ext.data.Api.actions.read) {
+                self.onRead.call(self, action, trans, res);
+            } else {
+                self.onWrite.call(self, action, trans, res, rs);
+            }
+        };
+    },
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, res) {
+        var result;
+        try {
+            result = trans.reader.readRecords(res);
+        }catch(e){
+            // @deprecated: fire loadexception
+            this.fireEvent("loadexception", this, trans, res, e);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, trans.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            this.fireEvent('loadexception', this, trans, res);
+
+            this.fireEvent('exception', this, 'remote', action, trans, res, null);
+        } else {
+            this.fireEvent("load", this, res, trans.arg);
+        }
+        trans.callback.call(trans.scope||window, result, trans.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @protected
+     */
+    onWrite : function(action, trans, response, rs) {
+        var reader = trans.reader;
+        try {
+            // though we already have a response object here in STP, run through readResponse to catch any meta-data exceptions.
+            var res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, trans, res, e);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        if(!res.success === true){
+            this.fireEvent('exception', this, 'remote', action, trans, res, rs);
+            trans.callback.call(trans.scope||window, null, res, false);
+            return;
+        }
+        this.fireEvent("write", this, action, res.data, res, rs, trans.arg );
+        trans.callback.call(trans.scope||window, res.data, res, true);
+    },
+
+    // private
+    isLoading : function(){
+        return this.trans ? true : false;
+    },
+
+    /**
+     * Abort the current server request.
+     */
+    abort : function(){
+        if(this.isLoading()){
+            this.destroyTrans(this.trans);
+        }
+    },
+
+    // private
+    destroyTrans : function(trans, isLoaded){
+        this.head.removeChild(document.getElementById(trans.scriptId));
+        clearTimeout(trans.timeoutId);
+        if(isLoaded){
+            window[trans.cb] = undefined;
+            try{
+                delete window[trans.cb];
+            }catch(e){}
+        }else{
+            // if hasn't been loaded, wait for load to remove it to prevent script error
+            window[trans.cb] = function(){
+                window[trans.cb] = undefined;
+                try{
+                    delete window[trans.cb];
+                }catch(e){}
+            };
+        }
+    },
+
+    // private
+    handleFailure : function(trans){
+        this.trans = false;
+        this.destroyTrans(trans, false);
+        if (trans.action === Ext.data.Api.actions.read) {
+            // @deprecated firing loadexception
+            this.fireEvent("loadexception", this, null, trans.arg);
+        }
+
+        this.fireEvent('exception', this, 'response', trans.action, {
+            response: null,
+            options: trans.arg
+        });
+        trans.callback.call(trans.scope||window, null, trans.arg, false);
+    },
+
+    // inherit docs
+    destroy: function(){
+        this.abort();
+        Ext.data.ScriptTagProxy.superclass.destroy.call(this);
+    }
+});/**
+ * @class Ext.data.HttpProxy
+ * @extends Ext.data.DataProxy
+ * <p>An implementation of {@link Ext.data.DataProxy} that processes data requests within the same
+ * domain of the originating page.</p>
+ * <p><b>Note</b>: this class cannot be used to retrieve data from a domain other
+ * than the domain from which the running page was served. For cross-domain requests, use a
+ * {@link Ext.data.ScriptTagProxy ScriptTagProxy}.</p>
+ * <p>Be aware that to enable the browser to parse an XML document, the server must set
+ * the Content-Type header in the HTTP response to "<tt>text/xml</tt>".</p>
+ * @constructor
+ * @param {Object} conn
+ * An {@link Ext.data.Connection} object, or options parameter to {@link Ext.Ajax#request}.
+ * <p>Note that if this HttpProxy is being used by a {@link Ext.data.Store Store}, then the
+ * Store's call to {@link #load} will override any specified <tt>callback</tt> and <tt>params</tt>
+ * options. In this case, use the Store's {@link Ext.data.Store#events events} to modify parameters,
+ * or react to loading events. The Store's {@link Ext.data.Store#baseParams baseParams} may also be
+ * used to pass parameters known at instantiation time.</p>
+ * <p>If an options parameter is passed, the singleton {@link Ext.Ajax} object will be used to make
+ * the request.</p>
+ */
+Ext.data.HttpProxy = function(conn){
+    Ext.data.HttpProxy.superclass.constructor.call(this, conn);
+
+    /**
+     * The Connection object (Or options parameter to {@link Ext.Ajax#request}) which this HttpProxy
+     * uses to make requests to the server. Properties of this object may be changed dynamically to
+     * change the way data is requested.
+     * @property
+     */
+    this.conn = conn;
+
+    // nullify the connection url.  The url param has been copied to 'this' above.  The connection
+    // url will be set during each execution of doRequest when buildUrl is called.  This makes it easier for users to override the
+    // connection url during beforeaction events (ie: beforeload, beforewrite, etc).
+    // Url is always re-defined during doRequest.
+    this.conn.url = null;
+
+    this.useAjax = !conn || !conn.events;
+
+    // A hash containing active requests, keyed on action [Ext.data.Api.actions.create|read|update|destroy]
+    var actions = Ext.data.Api.actions;
+    this.activeRequest = {};
+    for (var verb in actions) {
+        this.activeRequest[actions[verb]] = undefined;
+    }
+};
+
+Ext.extend(Ext.data.HttpProxy, Ext.data.DataProxy, {
+    /**
+     * Return the {@link Ext.data.Connection} object being used by this Proxy.
+     * @return {Connection} The Connection object. This object may be used to subscribe to events on
+     * a finer-grained basis than the DataProxy events.
+     */
+    getConnection : function() {
+        return this.useAjax ? Ext.Ajax : this.conn;
+    },
+
+    /**
+     * Used for overriding the url used for a single request.  Designed to be called during a beforeaction event.  Calling setUrl
+     * will override any urls set via the api configuration parameter.  Set the optional parameter makePermanent to set the url for
+     * all subsequent requests.  If not set to makePermanent, the next request will use the same url or api configuration defined
+     * in the initial proxy configuration.
+     * @param {String} url
+     * @param {Boolean} makePermanent (Optional) [false]
+     *
+     * (e.g.: beforeload, beforesave, etc).
+     */
+    setUrl : function(url, makePermanent) {
+        this.conn.url = url;
+        if (makePermanent === true) {
+            this.url = url;
+            this.api = null;
+            Ext.data.Api.prepare(this);
+        }
+    },
+
+    /**
+     * HttpProxy implementation of DataProxy#doRequest
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, cb, scope, arg) {
+        var  o = {
+            method: (this.api[action]) ? this.api[action]['method'] : undefined,
+            request: {
+                callback : cb,
+                scope : scope,
+                arg : arg
+            },
+            reader: reader,
+            callback : this.createCallback(action, rs),
+            scope: this
+        };
+
+        // If possible, transmit data using jsonData || xmlData on Ext.Ajax.request (An installed DataWriter would have written it there.).
+        // Use std HTTP params otherwise.
+        if (params.jsonData) {
+            o.jsonData = params.jsonData;
+        } else if (params.xmlData) {
+            o.xmlData = params.xmlData;
+        } else {
+            o.params = params || {};
+        }
+        // Set the connection url.  If this.conn.url is not null here,
+        // the user must have overridden the url during a beforewrite/beforeload event-handler.
+        // this.conn.url is nullified after each request.
+        this.conn.url = this.buildUrl(action, rs);
+
+        if(this.useAjax){
+
+            Ext.applyIf(o, this.conn);
+
+            // If a currently running request is found for this action, abort it.
+            if (this.activeRequest[action]) {
+                ////
+                // Disabled aborting activeRequest while implementing REST.  activeRequest[action] will have to become an array
+                // TODO ideas anyone?
+                //
+                //Ext.Ajax.abort(this.activeRequest[action]);
+            }
+            this.activeRequest[action] = Ext.Ajax.request(o);
+        }else{
+            this.conn.request(o);
+        }
+        // request is sent, nullify the connection url in preparation for the next request
+        this.conn.url = null;
+    },
+
+    /**
+     * Returns a callback function for a request.  Note a special case is made for the
+     * read action vs all the others.
+     * @param {String} action [create|update|delete|load]
+     * @param {Ext.data.Record[]} rs The Store-recordset being acted upon
+     * @private
+     */
+    createCallback : function(action, rs) {
+        return function(o, success, response) {
+            this.activeRequest[action] = undefined;
+            if (!success) {
+                if (action === Ext.data.Api.actions.read) {
+                    // @deprecated: fire loadexception for backwards compat.
+                    // TODO remove
+                    this.fireEvent('loadexception', this, o, response);
+                }
+                this.fireEvent('exception', this, 'response', action, o, response);
+                o.request.callback.call(o.request.scope, null, o.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                this.onRead(action, o, response);
+            } else {
+                this.onWrite(action, o, response, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read action
+     * @param {String} action Action name as per {@link Ext.data.Api.actions#read}.
+     * @param {Object} o The request transaction object
+     * @param {Object} res The server response
+     * @fires loadexception (deprecated)
+     * @fires exception
+     * @fires load
+     * @protected
+     */
+    onRead : function(action, o, response) {
+        var result;
+        try {
+            result = o.reader.read(response);
+        }catch(e){
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response, e);
+
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (result.success === false) {
+            // @deprecated: fire old loadexception for backwards-compat.
+            // TODO remove
+            this.fireEvent('loadexception', this, o, response);
+
+            // Get DataReader read-back a response-object to pass along to exception event
+            var res = o.reader.readResponse(action, response);
+            this.fireEvent('exception', this, 'remote', action, o, res, null);
+        }
+        else {
+            this.fireEvent('load', this, o, o.request.arg);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made identical.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, result, o.request.arg, result.success);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} res The server response
+     * @fires exception
+     * @fires write
+     * @protected
+     */
+    onWrite : function(action, o, response, rs) {
+        var reader = o.reader;
+        var res;
+        try {
+            res = reader.readResponse(action, response);
+        } catch (e) {
+            this.fireEvent('exception', this, 'response', action, o, response, e);
+            o.request.callback.call(o.request.scope, null, o.request.arg, false);
+            return;
+        }
+        if (res.success === true) {
+            this.fireEvent('write', this, action, res.data, res, rs, o.request.arg);
+        } else {
+            this.fireEvent('exception', this, 'remote', action, o, res, rs);
+        }
+        // TODO refactor onRead, onWrite to be more generalized now that we're dealing with Ext.data.Response instance
+        // the calls to request.callback(...) in each will have to be made similar.
+        // NOTE reader.readResponse does not currently return Ext.data.Response
+        o.request.callback.call(o.request.scope, res.data, res, res.success);
+    },
+
+    // inherit docs
+    destroy: function(){
+        if(!this.useAjax){
+            this.conn.abort();
+        }else if(this.activeRequest){
+            var actions = Ext.data.Api.actions;
+            for (var verb in actions) {
+                if(this.activeRequest[actions[verb]]){
+                    Ext.Ajax.abort(this.activeRequest[actions[verb]]);
+                }
+            }
+        }
+        Ext.data.HttpProxy.superclass.destroy.call(this);
+    }
+});/**
+ * @class Ext.data.MemoryProxy
+ * @extends Ext.data.DataProxy
+ * An implementation of Ext.data.DataProxy that simply passes the data specified in its constructor
+ * to the Reader when its load method is called.
+ * @constructor
+ * @param {Object} data The data object which the Reader uses to construct a block of Ext.data.Records.
+ */
+Ext.data.MemoryProxy = function(data){
+    // Must define a dummy api with "read" action to satisfy DataProxy#doRequest and Ext.data.Api#prepare *before* calling super
+    var api = {};
+    api[Ext.data.Api.actions.read] = true;
+    Ext.data.MemoryProxy.superclass.constructor.call(this, {
+        api: api
+    });
+    this.data = data;
+};
+
+Ext.extend(Ext.data.MemoryProxy, Ext.data.DataProxy, {
+    /**
+     * @event loadexception
+     * Fires if an exception occurs in the Proxy during data loading. Note that this event is also relayed
+     * through {@link Ext.data.Store}, so you can listen for it directly on any Store instance.
+     * @param {Object} this
+     * @param {Object} arg The callback's arg object passed to the {@link #load} function
+     * @param {Object} null This parameter does not apply and will always be null for MemoryProxy
+     * @param {Error} e The JavaScript Error object caught if the configured Reader could not read the data
+     */
+
+       /**
+     * MemoryProxy implementation of DataProxy#doRequest
+     * @param {String} action
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback The function into which to pass the block of Ext.data.Records.
+     * The function must be passed <ul>
+     * <li>The Record block object</li>
+     * <li>The "arg" argument from the load function</li>
+     * <li>A boolean success indicator</li>
+     * </ul>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, arg) {
+        // No implementation for CRUD in MemoryProxy.  Assumes all actions are 'load'
+        params = params || {};
+        var result;
+        try {
+            result = reader.readRecords(this.data);
+        }catch(e){
+            // @deprecated loadexception
+            this.fireEvent("loadexception", this, null, arg, e);
+
+            this.fireEvent('exception', this, 'response', action, arg, null, e);
+            callback.call(scope, null, arg, false);
+            return;
+        }
+        callback.call(scope, result, arg, true);
+    }
+});/**
+ * @class Ext.data.Types
+ * <p>This is s static class containing the system-supplied data types which may be given to a {@link Ext.data.Field Field}.<p/>
+ * <p>The properties in this class are used as type indicators in the {@link Ext.data.Field Field} class, so to
+ * test whether a Field is of a certain type, compare the {@link Ext.data.Field#type type} property against properties
+ * of this class.</p>
+ * <p>Developers may add their own application-specific data types to this class. Definition names must be UPPERCASE.
+ * each type definition must contain three properties:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>convert</code> : <i>Function</i><div class="sub-desc">A function to convert raw data values from a data block into the data
+ * to be stored in the Field. The function is passed the collowing parameters:
+ * <div class="mdetail-params"><ul>
+ * <li><b>v</b> : Mixed<div class="sub-desc">The data value as read by the Reader, if undefined will use
+ * the configured <tt>{@link Ext.data.Field#defaultValue defaultValue}</tt>.</div></li>
+ * <li><b>rec</b> : Mixed<div class="sub-desc">The data object containing the row as read by the Reader.
+ * Depending on the Reader type, this could be an Array ({@link Ext.data.ArrayReader ArrayReader}), an object
+ * ({@link Ext.data.JsonReader JsonReader}), or an XML element ({@link Ext.data.XMLReader XMLReader}).</div></li>
+ * </ul></div></div></li>
+ * <li><code>sortType</code> : <i>Function</i> <div class="sub-desc">A function to convert the stored data into comparable form, as defined by {@link Ext.data.SortTypes}.</div></li>
+ * <li><code>type</code> : <i>String</i> <div class="sub-desc">A textual data type name.</div></li>
+ * </ul></div>
+ * <p>For example, to create a VELatLong field (See the Microsoft Bing Mapping API) containing the latitude/longitude value of a datapoint on a map from a JsonReader data block
+ * which contained the properties <code>lat</code> and <code>long</code>, you would define a new data type like this:</p>
+ *<pre><code>
+// Add a new Field data type which stores a VELatLong object in the Record.
+Ext.data.Types.VELATLONG = {
+    convert: function(v, data) {
+        return new VELatLong(data.lat, data.long);
+    },
+    sortType: function(v) {
+        return v.Latitude;  // When sorting, order by latitude
+    },
+    type: 'VELatLong'
+};
+</code></pre>
+ * <p>Then, when declaring a Record, use <pre><code>
+var types = Ext.data.Types; // allow shorthand type access
+UnitRecord = Ext.data.Record.create([
+    { name: 'unitName', mapping: 'UnitName' },
+    { name: 'curSpeed', mapping: 'CurSpeed', type: types.INT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'latitude', mapping: 'lat', type: types.FLOAT },
+    { name: 'position', type: types.VELATLONG }
+]);
+</code></pre>
+ * @singleton
+ */
+Ext.data.Types = new function(){
+    var st = Ext.data.SortTypes;
+    Ext.apply(this, {
+        /**
+         * @type Regexp
+         * @property stripRe
+         * A regular expression for stripping non-numeric characters from a numeric value. Defaults to <tt>/[\$,%]/g</tt>.
+         * This should be overridden for localization.
+         */
+        stripRe: /[\$,%]/g,
+        
+        /**
+         * @type Object.
+         * @property AUTO
+         * This data type means that no conversion is applied to the raw data before it is placed into a Record.
+         */
+        AUTO: {
+            convert: function(v){ return v; },
+            sortType: st.none,
+            type: 'auto'
+        },
+
+        /**
+         * @type Object.
+         * @property STRING
+         * This data type means that the raw data is converted into a String before it is placed into a Record.
+         */
+        STRING: {
+            convert: function(v){ return (v === undefined || v === null) ? '' : String(v); },
+            sortType: st.asUCString,
+            type: 'string'
+        },
+
+        /**
+         * @type Object.
+         * @property INT
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INTEGER</code> is equivalent.</p>
+         */
+        INT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseInt(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'int'
+        },
+        
+        /**
+         * @type Object.
+         * @property FLOAT
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>NUMBER</code> is equivalent.</p>
+         */
+        FLOAT: {
+            convert: function(v){
+                return v !== undefined && v !== null && v !== '' ?
+                    parseFloat(String(v).replace(Ext.data.Types.stripRe, ''), 10) : (this.useNull ? null : 0);
+            },
+            sortType: st.none,
+            type: 'float'
+        },
+        
+        /**
+         * @type Object.
+         * @property BOOL
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOLEAN</code> is equivalent.</p>
+         */
+        BOOL: {
+            convert: function(v){ return v === true || v === 'true' || v == 1; },
+            sortType: st.none,
+            type: 'bool'
+        },
+        
+        /**
+         * @type Object.
+         * @property DATE
+         * This data type means that the raw data is converted into a Date before it is placed into a Record.
+         * The date format is specified in the constructor of the {@link Ext.data.Field} to which this type is
+         * being applied.
+         */
+        DATE: {
+            convert: function(v){
+                var df = this.dateFormat;
+                if(!v){
+                    return null;
+                }
+                if(Ext.isDate(v)){
+                    return v;
+                }
+                if(df){
+                    if(df == 'timestamp'){
+                        return new Date(v*1000);
+                    }
+                    if(df == 'time'){
+                        return new Date(parseInt(v, 10));
+                    }
+                    return Date.parseDate(v, df);
+                }
+                var parsed = Date.parse(v);
+                return parsed ? new Date(parsed) : null;
+            },
+            sortType: st.asDate,
+            type: 'date'
+        }
+    });
+    
+    Ext.apply(this, {
+        /**
+         * @type Object.
+         * @property BOOLEAN
+         * <p>This data type means that the raw data is converted into a boolean before it is placed into
+         * a Record. The string "true" and the number 1 are converted to boolean <code>true</code>.</p>
+         * <p>The synonym <code>BOOL</code> is equivalent.</p>
+         */
+        BOOLEAN: this.BOOL,
+        /**
+         * @type Object.
+         * @property INTEGER
+         * This data type means that the raw data is converted into an integer before it is placed into a Record.
+         * <p>The synonym <code>INT</code> is equivalent.</p>
+         */
+        INTEGER: this.INT,
+        /**
+         * @type Object.
+         * @property NUMBER
+         * This data type means that the raw data is converted into a number before it is placed into a Record.
+         * <p>The synonym <code>FLOAT</code> is equivalent.</p>
+         */
+        NUMBER: this.FLOAT    
+    });
+};/**
+ * @class Ext.data.JsonWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action.
+ */
+Ext.data.JsonWriter = Ext.extend(Ext.data.DataWriter, {
+    /**
+     * @cfg {Boolean} encode <p><tt>true</tt> to {@link Ext.util.JSON#encode JSON encode} the
+     * {@link Ext.data.DataWriter#toHash hashed data} into a standard HTTP parameter named after this
+     * Reader's <code>meta.root</code> property which, by default is imported from the associated Reader. Defaults to <tt>true</tt>.</p>
+     * <p>If set to <code>false</code>, the hashed data is {@link Ext.util.JSON#encode JSON encoded}, along with
+     * the associated {@link Ext.data.Store}'s {@link Ext.data.Store#baseParams baseParams}, into the POST body.</p>
+     * <p>When using {@link Ext.data.DirectProxy}, set this to <tt>false</tt> since Ext.Direct.JsonProvider will perform
+     * its own json-encoding.  In addition, if you're using {@link Ext.data.HttpProxy}, setting to <tt>false</tt>
+     * will cause HttpProxy to transmit data using the <b>jsonData</b> configuration-params of {@link Ext.Ajax#request}
+     * instead of <b>params</b>.</p>
+     * <p>When using a {@link Ext.data.Store#restful} Store, some serverside frameworks are
+     * tuned to expect data through the jsonData mechanism.  In those cases, one will want to set <b>encode: <tt>false</tt></b>, as in
+     * let the lower-level connection object (eg: Ext.Ajax) do the encoding.</p>
+     */
+    encode : true,
+    /**
+     * @cfg {Boolean} encodeDelete False to send only the id to the server on delete, true to encode it in an object
+     * literal, eg: <pre><code>
+{id: 1}
+ * </code></pre> Defaults to <tt>false</tt>
+     */
+    encodeDelete: false,
+    
+    constructor : function(config){
+        Ext.data.JsonWriter.superclass.constructor.call(this, config);    
+    },
+
+    /**
+     * <p>This method should not need to be called by application code, however it may be useful on occasion to
+     * override it, or augment it with an {@link Function#createInterceptor interceptor} or {@link Function#createSequence sequence}.</p>
+     * <p>The provided implementation encodes the serialized data representing the Store's modified Records into the Ajax request's
+     * <code>params</code> according to the <code>{@link #encode}</code> setting.</p>
+     * @param {Object} Ajax request params object to write into.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data object representing the serialized modified records from the Store. May be either a single object,
+     * or an Array of objects - user implementations must handle both cases.
+     */
+    render : function(params, baseParams, data) {
+        if (this.encode === true) {
+            // Encode here now.
+            Ext.apply(params, baseParams);
+            params[this.meta.root] = Ext.encode(data);
+        } else {
+            // defer encoding for some other layer, probably in {@link Ext.Ajax#request}.  Place everything into "jsonData" key.
+            var jdata = Ext.apply({}, baseParams);
+            jdata[this.meta.root] = data;
+            params.jsonData = jdata;
+        }
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    createRecord : function(rec) {
+       return this.toHash(rec);
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    updateRecord : function(rec) {
+        return this.toHash(rec);
+
+    },
+    /**
+     * Implements abstract Ext.data.DataWriter#destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Object}
+     */
+    destroyRecord : function(rec){
+        if(this.encodeDelete){
+            var data = {};
+            data[this.meta.idProperty] = rec.id;
+            return data;
+        }else{
+            return rec.id;
+        }
+    }
+});/**
+ * @class Ext.data.JsonReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects
+ * from a JSON packet based on mappings in a provided {@link Ext.data.Record}
+ * constructor.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var myReader = new Ext.data.JsonReader({
+    // metadata configuration options:
+    {@link #idProperty}: 'id'
+    {@link #root}: 'rows',
+    {@link #totalProperty}: 'results',
+    {@link Ext.data.DataReader#messageProperty}: "msg"  // The element within the response that provides a user-feedback message (optional)
+
+    // the fields config option will internally create an {@link Ext.data.Record}
+    // constructor that provides mapping for reading the record data objects
+    {@link Ext.data.DataReader#fields fields}: [
+        // map Record&#39;s 'firstname' field to data object&#39;s key of same name
+        {name: 'name', mapping: 'firstname'},
+        // map Record&#39;s 'job' field to data object&#39;s 'occupation' key
+        {name: 'job', mapping: 'occupation'}
+    ]
+});
+</code></pre>
+ * <p>This would consume a JSON data object of the form:</p><pre><code>
+{
+    results: 2000, // Reader&#39;s configured {@link #totalProperty}
+    rows: [        // Reader&#39;s configured {@link #root}
+        // record data objects:
+        { {@link #idProperty id}: 1, firstname: 'Bill', occupation: 'Gardener' },
+        { {@link #idProperty id}: 2, firstname: 'Ben' , occupation: 'Horticulturalist' },
+        ...
+    ]
+}
+</code></pre>
+ * <p><b><u>Automatic configuration using metaData</u></b></p>
+ * <p>It is possible to change a JsonReader's metadata at any time by including
+ * a <b><tt>metaData</tt></b> property in the JSON data object. If the JSON data
+ * object has a <b><tt>metaData</tt></b> property, a {@link Ext.data.Store Store}
+ * object using this Reader will reconfigure itself to use the newly provided
+ * field definition and fire its {@link Ext.data.Store#metachange metachange}
+ * event. The metachange event handler may interrogate the <b><tt>metaData</tt></b>
+ * property to perform any configuration required.</p>
+ * <p>Note that reconfiguring a Store potentially invalidates objects which may
+ * refer to Fields or Records which no longer exist.</p>
+ * <p>To use this facility you would create the JsonReader like this:</p><pre><code>
+var myReader = new Ext.data.JsonReader();
+</code></pre>
+ * <p>The first data packet from the server would configure the reader by
+ * containing a <b><tt>metaData</tt></b> property <b>and</b> the data. For
+ * example, the JSON data object might take the form:</p><pre><code>
+{
+    metaData: {
+        "{@link #idProperty}": "id",
+        "{@link #root}": "rows",
+        "{@link #totalProperty}": "results"
+        "{@link #successProperty}": "success",
+        "{@link Ext.data.DataReader#fields fields}": [
+            {"name": "name"},
+            {"name": "job", "mapping": "occupation"}
+        ],
+        // used by store to set its sortInfo
+        "sortInfo":{
+           "field": "name",
+           "direction": "ASC"
+        },
+        // {@link Ext.PagingToolbar paging data} (if applicable)
+        "start": 0,
+        "limit": 2,
+        // custom property
+        "foo": "bar"
+    },
+    // Reader&#39;s configured {@link #successProperty}
+    "success": true,
+    // Reader&#39;s configured {@link #totalProperty}
+    "results": 2000,
+    // Reader&#39;s configured {@link #root}
+    // (this data simulates 2 results {@link Ext.PagingToolbar per page})
+    "rows": [ // <b>*Note:</b> this must be an Array
+        { "id": 1, "name": "Bill", "occupation": "Gardener" },
+        { "id": 2, "name":  "Ben", "occupation": "Horticulturalist" }
+    ]
+}
+ * </code></pre>
+ * <p>The <b><tt>metaData</tt></b> property in the JSON data object should contain:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>any of the configuration options for this class</li>
+ * <li>a <b><tt>{@link Ext.data.Record#fields fields}</tt></b> property which
+ * the JsonReader will use as an argument to the
+ * {@link Ext.data.Record#create data Record create method} in order to
+ * configure the layout of the Records it will produce.</li>
+ * <li>a <b><tt>{@link Ext.data.Store#sortInfo sortInfo}</tt></b> property
+ * which the JsonReader will use to set the {@link Ext.data.Store}'s
+ * {@link Ext.data.Store#sortInfo sortInfo} property</li>
+ * <li>any custom properties needed</li>
+ * </ul></div>
+ *
+ * @constructor
+ * Create a new JsonReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.JsonReader = function(meta, recordType){
+    meta = meta || {};
+    /**
+     * @cfg {String} idProperty [id] Name of the property within a row object
+     * that contains a record identifier value.  Defaults to <tt>id</tt>
+     */
+    /**
+     * @cfg {String} successProperty [success] Name of the property from which to
+     * retrieve the success attribute. Defaults to <tt>success</tt>.  See
+     * {@link Ext.data.DataProxy}.{@link Ext.data.DataProxy#exception exception}
+     * for additional information.
+     */
+    /**
+     * @cfg {String} totalProperty [total] Name of the property from which to
+     * retrieve the total number of records in the dataset. This is only needed
+     * if the whole dataset is not passed in one go, but is being paged from
+     * the remote server.  Defaults to <tt>total</tt>.
+     */
+    /**
+     * @cfg {String} root [undefined] <b>Required</b>.  The name of the property
+     * which contains the Array of row objects.  Defaults to <tt>undefined</tt>.
+     * An exception will be thrown if the root property is undefined. The data
+     * packet value for this property should be an empty array to clear the data
+     * or show no data.
+     */
+    Ext.applyIf(meta, {
+        idProperty: 'id',
+        successProperty: 'success',
+        totalProperty: 'total'
+    });
+
+    Ext.data.JsonReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.JsonReader, Ext.data.DataReader, {
+    /**
+     * This JsonReader's metadata as passed to the constructor, or as passed in
+     * the last data packet's <b><tt>metaData</tt></b> property.
+     * @type Mixed
+     * @property meta
+     */
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the JSON data in its responseText.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var json = response.responseText;
+        var o = Ext.decode(json);
+        if(!o) {
+            throw {message: 'JsonReader.read: Json object not found'};
+        }
+        return this.readRecords(o);
+    },
+
+    /*
+     * TODO: refactor code between JsonReader#readRecords, #readResponse into 1 method.
+     * there's ugly duplication going on due to maintaining backwards compat. with 2.0.  It's time to do this.
+     */
+    /**
+     * Decode a JSON response from server.
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} response The XHR object returned through an Ajax server request.
+     * @return {Response} A {@link Ext.data.Response Response} object containing the data response, and also status information.
+     */
+    readResponse : function(action, response) {
+        var o = (response.responseText !== undefined) ? Ext.decode(response.responseText) : response;
+        if(!o) {
+            throw new Ext.data.JsonReader.Error('response');
+        }
+
+        var root = this.getRoot(o),
+            success = this.getSuccess(o);
+        if (success && action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(root);
+            if (def && Ext.isEmpty(root)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+
+        // instantiate response object
+        var res = new Ext.data.Response({
+            action: action,
+            success: success,
+            data: (root) ? this.extractData(root, false) : [],
+            message: this.getMessage(o),
+            raw: o
+        });
+
+        // blow up if no successProperty
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.JsonReader.Error('successProperty-response', this.meta.successProperty);
+        }
+        return res;
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from a JSON object.
+     * @param {Object} o An object which contains an Array of row objects in the property specified
+     * in the config as 'root, and optionally a property, specified in the config as 'totalProperty'
+     * which contains the total size of the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        /**
+         * After any data loads, the raw JSON data is available for further custom processing.  If no data is
+         * loaded or there is a load exception this property will be undefined.
+         * @type Object
+         */
+        this.jsonData = o;
+        if(o.metaData){
+            this.onMetaChange(o.metaData);
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length, v;
+
+        var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
+        if(s.totalProperty){
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)){
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        // TODO return Ext.data.Response instance instead.  @see #readResponse
+        return {
+            success : success,
+            records : this.extractData(root, true), // <-- true to return [Ext.data.Record]
+            totalRecords : totalRecords
+        };
+    },
+
+    // private
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s = this.meta, Record = this.recordType,
+            f = Record.prototype.fields, fi = f.items, fl = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = s.root ? this.createAccessor(s.root) : function(p){return p;};
+        if (s.id || s.idProperty) {
+            var g = this.createAccessor(s.id || s.idProperty);
+            this.getId = function(rec) {
+                var r = g(rec);
+                return (r === undefined || r === '') ? null : r;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * @ignore
+     * TODO This isn't used anywhere??  Don't we want to use this where possible instead of complex #createAccessor?
+     */
+    simpleAccess : function(obj, subsc) {
+        return obj[subsc];
+    },
+
+    /**
+     * @ignore
+     */
+    createAccessor : function(){
+        var re = /[\[\.]/;
+        return function(expr) {
+            if(Ext.isEmpty(expr)){
+                return Ext.emptyFn;
+            }
+            if(Ext.isFunction(expr)){
+                return expr;
+            }
+            var i = String(expr).search(re);
+            if(i >= 0){
+                return new Function('obj', 'return obj' + (i > 0 ? '.' : '') + expr);
+            }
+            return function(obj){
+                return obj[expr];
+            };
+
+        };
+    }(),
+
+    /**
+     * type-casts a single row of raw-data from server
+     * @param {Object} data
+     * @param {Array} items
+     * @param {Integer} len
+     * @private
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});
+
+/**
+ * @class Ext.data.JsonReader.Error
+ * Error class for JsonReader
+ */
+Ext.data.JsonReader.Error = Ext.extend(Ext.Error, {
+    constructor : function(message, arg) {
+        this.arg = arg;
+        Ext.Error.call(this, message);
+    },
+    name : 'Ext.data.JsonReader'
+});
+Ext.apply(Ext.data.JsonReader.Error.prototype, {
+    lang: {
+        'response': 'An error occurred while json-decoding your server response',
+        'successProperty-response': 'Could not locate your "successProperty" in your server response.  Please review your JsonReader config to ensure the config-property "successProperty" matches the property in your server-response.  See the JsonReader docs.',
+        'root-undefined-config': 'Your JsonReader was configured without a "root" property.  Please review your JsonReader config and make sure to define the root property.  See the JsonReader docs.',
+        'idProperty-undefined' : 'Your JsonReader was configured without an "idProperty"  Please review your JsonReader configuration and ensure the "idProperty" is set (e.g.: "id").  See the JsonReader docs.',
+        'root-empty': 'Data was expected to be returned by the server in the "root" property of the response.  Please review your JsonReader configuration to ensure the "root" property matches that returned in the server-response.  See JsonReader docs.'
+    }
+});
+/**
+ * @class Ext.data.ArrayReader
+ * @extends Ext.data.JsonReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an Array.
+ * Each element of that Array represents a row of data fields. The
+ * fields are pulled into a Record object using as a subscript, the <code>mapping</code> property
+ * of the field definition if it exists, or the field's ordinal position in the definition.</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+    {name: 'name', mapping: 1},         // "mapping" only needed if an "id" field is present which
+    {name: 'occupation', mapping: 2}    // precludes using the ordinal position as the index.
+]);
+var myReader = new Ext.data.ArrayReader({
+    {@link #idIndex}: 0
+}, Employee);
+</code></pre>
+ * <p>This would consume an Array like this:</p>
+ * <pre><code>
+[ [1, 'Bill', 'Gardener'], [2, 'Ben', 'Horticulturalist'] ]
+ * </code></pre>
+ * @constructor
+ * Create a new ArrayReader
+ * @param {Object} meta Metadata configuration options.
+ * @param {Array/Object} recordType
+ * <p>Either an Array of {@link Ext.data.Field Field} definition objects (which
+ * will be passed to {@link Ext.data.Record#create}, or a {@link Ext.data.Record Record}
+ * constructor created from {@link Ext.data.Record#create}.</p>
+ */
+Ext.data.ArrayReader = Ext.extend(Ext.data.JsonReader, {
+    /**
+     * @cfg {String} successProperty
+     * @hide
+     */
+    /**
+     * @cfg {Number} id (optional) The subscript within row Array that provides an ID for the Record.
+     * Deprecated. Use {@link #idIndex} instead.
+     */
+    /**
+     * @cfg {Number} idIndex (optional) The subscript within row Array that provides an ID for the Record.
+     */
+    /**
+     * Create a data block containing Ext.data.Records from an Array.
+     * @param {Object} o An Array of row objects which represents the dataset.
+     * @return {Object} data A data block which is used by an Ext.data.Store object as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(o){
+        this.arrayData = o;
+        var s = this.meta,
+            sid = s ? Ext.num(s.idIndex, s.id) : null,
+            recordType = this.recordType,
+            fields = recordType.prototype.fields,
+            records = [],
+            success = true,
+            v;
+
+        var root = this.getRoot(o);
+
+        for(var i = 0, len = root.length; i < len; i++) {
+            var n = root[i],
+                values = {},
+                id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null);
+            for(var j = 0, jlen = fields.length; j < jlen; j++) {
+                var f = fields.items[j],
+                    k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j;
+                v = n[k] !== undefined ? n[k] : f.defaultValue;
+                v = f.convert(v, n);
+                values[f.name] = v;
+            }
+            var record = new recordType(values, id);
+            record.json = n;
+            records[records.length] = record;
+        }
+
+        var totalRecords = records.length;
+
+        if(s.totalProperty) {
+            v = parseInt(this.getTotal(o), 10);
+            if(!isNaN(v)) {
+                totalRecords = v;
+            }
+        }
+        if(s.successProperty){
+            v = this.getSuccess(o);
+            if(v === false || v === 'false'){
+                success = false;
+            }
+        }
+
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords
+        };
+    }
+});/**
+ * @class Ext.data.ArrayStore
+ * @extends Ext.data.Store
+ * <p>Formerly known as "SimpleStore".</p>
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from Array data easier.
+ * An ArrayStore will be automatically configured with a {@link Ext.data.ArrayReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.ArrayStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    // reader configs
+    idIndex: 0,  
+    fields: [
+       'company',
+       {name: 'price', type: 'float'},
+       {name: 'change', type: 'float'},
+       {name: 'pctChange', type: 'float'},
+       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+var myData = [
+    ['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
+    ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
+    ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
+    ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
+    ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
+];
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.ArrayReader ArrayReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype arraystore
+ */
+Ext.data.ArrayStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.ArrayStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.ArrayReader(config)
+        }));
+    },
+
+    loadData : function(data, append){
+        if(this.expandData === true){
+            var r = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                r[r.length] = [data[i]];
+            }
+            data = r;
+        }
+        Ext.data.ArrayStore.superclass.loadData.call(this, data, append);
+    }
+});
+Ext.reg('arraystore', Ext.data.ArrayStore);
+
+// backwards compat
+Ext.data.SimpleStore = Ext.data.ArrayStore;
+Ext.reg('simplestore', Ext.data.SimpleStore);/**
+ * @class Ext.data.JsonStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from JSON data easier.
+ * A JsonStore will be automatically configured with a {@link Ext.data.JsonReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.JsonStore({
+    // store configs
+    autoDestroy: true,
+    url: 'get-images.php',
+    storeId: 'myStore',
+    // reader configs
+    root: 'images',
+    idProperty: 'name',
+    fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date'}]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+{
+    images: [
+        {name: 'Image one', url:'/GetImage.php?id=1', size:46.5, lastmod: new Date(2007, 10, 29)},
+        {name: 'Image Two', url:'/GetImage.php?id=2', size:43.2, lastmod: new Date(2007, 10, 30)}
+    ]
+}
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>*Note:</b> Although not listed here, this class accepts all of the configuration options of
+ * <b>{@link Ext.data.JsonReader JsonReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype jsonstore
+ */
+Ext.data.JsonStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.JsonStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.JsonReader(config)
+        }));
+    }
+});
+Ext.reg('jsonstore', Ext.data.JsonStore);/**
+ * @class Ext.data.XmlWriter
+ * @extends Ext.data.DataWriter
+ * DataWriter extension for writing an array or single {@link Ext.data.Record} object(s) in preparation for executing a remote CRUD action via XML.
+ * XmlWriter uses an instance of {@link Ext.XTemplate} for maximum flexibility in defining your own custom XML schema if the default schema is not appropriate for your needs.
+ * See the {@link #tpl} configuration-property.
+ */
+Ext.data.XmlWriter = function(params) {
+    Ext.data.XmlWriter.superclass.constructor.apply(this, arguments);
+    // compile the XTemplate for rendering XML documents.
+    this.tpl = (typeof(this.tpl) === 'string') ? new Ext.XTemplate(this.tpl).compile() : this.tpl.compile();
+};
+Ext.extend(Ext.data.XmlWriter, Ext.data.DataWriter, {
+    /**
+     * @cfg {String} documentRoot [xrequest] (Optional) The name of the XML document root-node.  <b>Note:</b>
+     * this parameter is required </b>only when</b> sending extra {@link Ext.data.Store#baseParams baseParams} to the server
+     * during a write-request -- if no baseParams are set, the {@link Ext.data.XmlReader#record} meta-property can
+     * suffice as the XML document root-node for write-actions involving just a <b>single record</b>.  For requests
+     * involving <b>multiple</b> records and <b>NO</b> baseParams, the {@link Ext.data.XmlWriter#root} property can
+     * act as the XML document root.
+     */
+    documentRoot: 'xrequest',
+    /**
+     * @cfg {Boolean} forceDocumentRoot [false] Set to <tt>true</tt> to force XML documents having a root-node as defined
+     * by {@link #documentRoot}, even with no baseParams defined.
+     */
+    forceDocumentRoot: false,
+    /**
+     * @cfg {String} root [records] The name of the containing element which will contain the nodes of an write-action involving <b>multiple</b> records.  Each
+     * xml-record written to the server will be wrapped in an element named after {@link Ext.data.XmlReader#record} property.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;user>&lt;first>Barney&lt;/first>&lt;/user>
+</code></pre>
+     * However, when <b>multiple</b> records are written in a batch-operation, these records must be wrapped in a containing
+     * Element.
+     * eg:
+<code><pre>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+    &lt;records>
+        &lt;first>Barney&lt;/first>&lt;/user>
+        &lt;records>&lt;first>Barney&lt;/first>&lt;/user>
+    &lt;/records>
+</code></pre>
+     * Defaults to <tt>records</tt>.  Do not confuse the nature of this property with that of {@link #documentRoot}
+     */
+    root: 'records',
+    /**
+     * @cfg {String} xmlVersion [1.0] The <tt>version</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlVersion : '1.0',
+    /**
+     * @cfg {String} xmlEncoding [ISO-8859-15] The <tt>encoding</tt> written to header of xml documents.
+<code><pre>&lt;?xml version="1.0" encoding="ISO-8859-15"?></pre></code>
+     */
+    xmlEncoding: 'ISO-8859-15',
+    /**
+     * @cfg {String/Ext.XTemplate} tpl The XML template used to render {@link Ext.data.Api#actions write-actions} to your server.
+     * <p>One can easily provide his/her own custom {@link Ext.XTemplate#constructor template-definition} if the default does not suffice.</p>
+     * <p>Defaults to:</p>
+<code><pre>
+&lt;?xml version="{version}" encoding="{encoding}"?>
+    &lt;tpl if="documentRoot">&lt;{documentRoot}>
+    &lt;tpl for="baseParams">
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;{root}>',
+    &lt;tpl for="records">
+        &lt;{parent.record}>
+        &lt;tpl for=".">
+            &lt;{name}>{value}&lt;/{name}>
+        &lt;/tpl>
+        &lt;/{parent.record}>
+    &lt;/tpl>
+    &lt;tpl if="records.length &gt; 1">&lt;/{root}>&lt;/tpl>
+    &lt;tpl if="documentRoot">&lt;/{documentRoot}>&lt;/tpl>
+</pre></code>
+     * <p>Templates will be called with the following API</p>
+     * <ul>
+     * <li>{String} version [1.0] The xml version.</li>
+     * <li>{String} encoding [ISO-8859-15] The xml encoding.</li>
+     * <li>{String/false} documentRoot The XML document root-node name or <tt>false</tt> if not required.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * <li>{String} record The meta-data parameter defined on your {@link Ext.data.XmlReader#record} configuration represents the name of the xml-tag containing each record.</li>
+     * <li>{String} root The meta-data parameter defined by {@link Ext.data.XmlWriter#root} configuration-parameter.  Represents the name of the xml root-tag when sending <b>multiple</b> records to the server.</li>
+     * <li>{Array} records The records being sent to the server, ie: the subject of the write-action being performed.  The records parameter will be always be an array, even when only a single record is being acted upon.
+     *     Each item within the records array will contain an array of field objects having the following properties:
+     *     <ul>
+     *         <li>{String} name The field-name of the record as defined by your {@link Ext.data.Record#create Ext.data.Record definition}.  The "mapping" property will be used, otherwise it will match the "name" property.  Use this parameter to define the XML tag-name of the property.</li>
+     *         <li>{Mixed} value The record value of the field enclosed within XML tags specified by name property above.</li>
+     *     </ul></li>
+     * <li>{Array} baseParams.  The baseParams as defined upon {@link Ext.data.Store#baseParams}.  Note that the baseParams have been converted into an array of [{name : "foo", value: "bar"}, ...] pairs in the same manner as the <b>records</b> parameter above.  See {@link #documentRoot} and {@link #forceDocumentRoot}.</li>
+     * </ul>
+     */
+    // Encoding the ? here in case it's being included by some kind of page that will parse it (eg. PHP)
+    tpl: '<tpl for="."><\u003fxml version="{version}" encoding="{encoding}"\u003f><tpl if="documentRoot"><{documentRoot}><tpl for="baseParams"><tpl for="."><{name}>{value}</{name}></tpl></tpl></tpl><tpl if="records.length&gt;1"><{root}></tpl><tpl for="records"><{parent.record}><tpl for="."><{name}>{value}</{name}></tpl></{parent.record}></tpl><tpl if="records.length&gt;1"></{root}></tpl><tpl if="documentRoot"></{documentRoot}></tpl></tpl>',
+
+
+    /**
+     * XmlWriter implementation of the final stage of a write action.
+     * @param {Object} params Transport-proxy's (eg: {@link Ext.Ajax#request}) params-object to write-to.
+     * @param {Object} baseParams as defined by {@link Ext.data.Store#baseParams}.  The baseParms must be encoded by the extending class, eg: {@link Ext.data.JsonWriter}, {@link Ext.data.XmlWriter}.
+     * @param {Object/Object[]} data Data-object representing the compiled Store-recordset.
+     */
+    render : function(params, baseParams, data) {
+        baseParams = this.toArray(baseParams);
+        params.xmlData = this.tpl.applyTemplate({
+            version: this.xmlVersion,
+            encoding: this.xmlEncoding,
+            documentRoot: (baseParams.length > 0 || this.forceDocumentRoot === true) ? this.documentRoot : false,
+            record: this.meta.record,
+            root: this.root,
+            baseParams: baseParams,
+            records: (Ext.isArray(data[0])) ? data : [data]
+        });
+    },
+
+    /**
+     * createRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of <tt>name:value</tt> pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    createRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+    },
+
+    /**
+     * updateRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array of {name:value} pairs for attributes of the {@link Ext.data.Record}.  See {@link Ext.data.DataWriter#toHash}.
+     */
+    updateRecord : function(rec) {
+        return this.toArray(this.toHash(rec));
+
+    },
+    /**
+     * destroyRecord
+     * @protected
+     * @param {Ext.data.Record} rec
+     * @return {Array} Array containing a attribute-object (name/value pair) representing the {@link Ext.data.DataReader#idProperty idProperty}.
+     */
+    destroyRecord : function(rec) {
+        var data = {};
+        data[this.meta.idProperty] = rec.id;
+        return this.toArray(data);
+    }
+});
+/**
+ * @class Ext.data.XmlReader
+ * @extends Ext.data.DataReader
+ * <p>Data reader class to create an Array of {@link Ext.data.Record} objects from an XML document
+ * based on mappings in a provided {@link Ext.data.Record} constructor.</p>
+ * <p><b>Note</b>: that in order for the browser to parse a returned XML document, the Content-Type
+ * header in the HTTP response must be set to "text/xml" or "application/xml".</p>
+ * <p>Example code:</p>
+ * <pre><code>
+var Employee = Ext.data.Record.create([
+   {name: 'name', mapping: 'name'},     // "mapping" property not needed if it is the same as "name"
+   {name: 'occupation'}                 // This field will use "occupation" as the mapping.
+]);
+var myReader = new Ext.data.XmlReader({
+   totalProperty: "results", // The element which contains the total dataset size (optional)
+   record: "row",           // The repeated element which contains row information
+   idProperty: "id"         // The element within the row that provides an ID for the record (optional)
+   messageProperty: "msg"   // The element within the response that provides a user-feedback message (optional)
+}, Employee);
+</code></pre>
+ * <p>
+ * This would consume an XML file like this:
+ * <pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?>
+&lt;dataset>
+ &lt;results>2&lt;/results>
+ &lt;row>
+   &lt;id>1&lt;/id>
+   &lt;name>Bill&lt;/name>
+   &lt;occupation>Gardener&lt;/occupation>
+ &lt;/row>
+ &lt;row>
+   &lt;id>2&lt;/id>
+   &lt;name>Ben&lt;/name>
+   &lt;occupation>Horticulturalist&lt;/occupation>
+ &lt;/row>
+&lt;/dataset>
+</code></pre>
+ * @cfg {String} totalProperty The DomQuery path from which to retrieve the total number of records
+ * in the dataset. This is only needed if the whole dataset is not passed in one go, but is being
+ * paged from the remote server.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} record The DomQuery path to the repeated element which contains record information.
+ * @cfg {String} successProperty The DomQuery path to the success attribute used by forms.
+ * @cfg {String} idPath The DomQuery path relative from the record element to the element that contains
+ * a record identifier value.
+ * @constructor
+ * Create a new XmlReader.
+ * @param {Object} meta Metadata configuration options
+ * @param {Object} recordType Either an Array of field definition objects as passed to
+ * {@link Ext.data.Record#create}, or a Record constructor object created using {@link Ext.data.Record#create}.
+ */
+Ext.data.XmlReader = function(meta, recordType){
+    meta = meta || {};
+
+    // backwards compat, convert idPath or id / success
+    Ext.applyIf(meta, {
+        idProperty: meta.idProperty || meta.idPath || meta.id,
+        successProperty: meta.successProperty || meta.success
+    });
+
+    Ext.data.XmlReader.superclass.constructor.call(this, meta, recordType || meta.fields);
+};
+Ext.extend(Ext.data.XmlReader, Ext.data.DataReader, {
+    /**
+     * This method is only used by a DataProxy which has retrieved data from a remote server.
+     * @param {Object} response The XHR object which contains the parsed XML document.  The response is expected
+     * to contain a property called <tt>responseXML</tt> which refers to an XML document object.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    read : function(response){
+        var doc = response.responseXML;
+        if(!doc) {
+            throw {message: "XmlReader.read: XML Document not available"};
+        }
+        return this.readRecords(doc);
+    },
+
+    /**
+     * Create a data block containing Ext.data.Records from an XML document.
+     * @param {Object} doc A parsed XML document.
+     * @return {Object} records A data block which is used by an {@link Ext.data.Store} as
+     * a cache of Ext.data.Records.
+     */
+    readRecords : function(doc){
+        /**
+         * After any data loads/reads, the raw XML Document is available for further custom processing.
+         * @type XMLDocument
+         */
+        this.xmlData = doc;
+
+        var root    = doc.documentElement || doc,
+            q       = Ext.DomQuery,
+            totalRecords = 0,
+            success = true;
+
+        if(this.meta.totalProperty){
+            totalRecords = this.getTotal(root, 0);
+        }
+        if(this.meta.successProperty){
+            success = this.getSuccess(root);
+        }
+
+        var records = this.extractData(q.select(this.meta.record, root), true); // <-- true to return Ext.data.Record[]
+
+        // TODO return Ext.data.Response instance.  @see #readResponse
+        return {
+            success : success,
+            records : records,
+            totalRecords : totalRecords || records.length
+        };
+    },
+
+    /**
+     * Decode an XML response from server.
+     * @param {String} action [{@link Ext.data.Api#actions} create|read|update|destroy]
+     * @param {Object} response HTTP Response object from browser.
+     * @return {Ext.data.Response} An instance of {@link Ext.data.Response}
+     */
+    readResponse : function(action, response) {
+        var q = Ext.DomQuery,
+            doc = response.responseXML,
+            root = doc.documentElement || doc;
+
+        // create general Response instance.
+        var res = new Ext.data.Response({
+            action: action,
+            success : this.getSuccess(root),
+            message: this.getMessage(root),
+            data: this.extractData(q.select(this.meta.record, root) || q.select(this.meta.root, root), false),
+            raw: doc
+        });
+
+        if (Ext.isEmpty(res.success)) {
+            throw new Ext.data.DataReader.Error('successProperty-response', this.meta.successProperty);
+        }
+
+        // Create actions from a response having status 200 must return pk
+        if (action === Ext.data.Api.actions.create) {
+            var def = Ext.isDefined(res.data);
+            if (def && Ext.isEmpty(res.data)) {
+                throw new Ext.data.JsonReader.Error('root-empty', this.meta.root);
+            }
+            else if (!def) {
+                throw new Ext.data.JsonReader.Error('root-undefined-response', this.meta.root);
+            }
+        }
+        return res;
+    },
+
+    getSuccess : function() {
+        return true;
+    },
+
+    /**
+     * build response-data extractor functions.
+     * @private
+     * @ignore
+     */
+    buildExtractors : function() {
+        if(this.ef){
+            return;
+        }
+        var s       = this.meta,
+            Record  = this.recordType,
+            f       = Record.prototype.fields,
+            fi      = f.items,
+            fl      = f.length;
+
+        if(s.totalProperty) {
+            this.getTotal = this.createAccessor(s.totalProperty);
+        }
+        if(s.successProperty) {
+            this.getSuccess = this.createAccessor(s.successProperty);
+        }
+        if (s.messageProperty) {
+            this.getMessage = this.createAccessor(s.messageProperty);
+        }
+        this.getRoot = function(res) {
+            return (!Ext.isEmpty(res[this.meta.record])) ? res[this.meta.record] : res[this.meta.root];
+        };
+        if (s.idPath || s.idProperty) {
+            var g = this.createAccessor(s.idPath || s.idProperty);
+            this.getId = function(rec) {
+                var id = g(rec) || rec.id;
+                return (id === undefined || id === '') ? null : id;
+            };
+        } else {
+            this.getId = function(){return null;};
+        }
+        var ef = [];
+        for(var i = 0; i < fl; i++){
+            f = fi[i];
+            var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
+            ef.push(this.createAccessor(map));
+        }
+        this.ef = ef;
+    },
+
+    /**
+     * Creates a function to return some particular key of data from a response.
+     * @param {String} key
+     * @return {Function}
+     * @private
+     * @ignore
+     */
+    createAccessor : function(){
+        var q = Ext.DomQuery;
+        return function(key) {
+            if (Ext.isFunction(key)) {
+                return key;
+            }
+            switch(key) {
+                case this.meta.totalProperty:
+                    return function(root, def){
+                        return q.selectNumber(key, root, def);
+                    };
+                    break;
+                case this.meta.successProperty:
+                    return function(root, def) {
+                        var sv = q.selectValue(key, root, true);
+                        var success = sv !== false && sv !== 'false';
+                        return success;
+                    };
+                    break;
+                default:
+                    return function(root, def) {
+                        return q.selectValue(key, root, def);
+                    };
+                    break;
+            }
+        };
+    }(),
+
+    /**
+     * extracts values and type-casts a row of data from server, extracted by #extractData
+     * @param {Hash} data
+     * @param {Ext.data.Field[]} items
+     * @param {Number} len
+     * @private
+     * @ignore
+     */
+    extractValues : function(data, items, len) {
+        var f, values = {};
+        for(var j = 0; j < len; j++){
+            f = items[j];
+            var v = this.ef[j](data);
+            values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, data);
+        }
+        return values;
+    }
+});/**
+ * @class Ext.data.XmlStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to make creating {@link Ext.data.Store}s from XML data easier.
+ * A XmlStore will be automatically configured with a {@link Ext.data.XmlReader}.</p>
+ * <p>A store configuration would be something like:<pre><code>
+var store = new Ext.data.XmlStore({
+    // store configs
+    autoDestroy: true,
+    storeId: 'myStore',
+    url: 'sheldon.xml', // automatically configures a HttpProxy
+    // reader configs
+    record: 'Item', // records will have an "Item" tag
+    idPath: 'ASIN',
+    totalRecords: '@TotalResults'
+    fields: [
+        // set up the fields mapping into the xml doc
+        // The first needs mapping, the others are very basic
+        {name: 'Author', mapping: 'ItemAttributes > Author'},
+        'Title', 'Manufacturer', 'ProductGroup'
+    ]
+});
+ * </code></pre></p>
+ * <p>This store is configured to consume a returned object of the form:<pre><code>
+&#60?xml version="1.0" encoding="UTF-8"?>
+&#60ItemSearchResponse xmlns="http://webservices.amazon.com/AWSECommerceService/2009-05-15">
+    &#60Items>
+        &#60Request>
+            &#60IsValid>True&#60/IsValid>
+            &#60ItemSearchRequest>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60SearchIndex>Books&#60/SearchIndex>
+            &#60/ItemSearchRequest>
+        &#60/Request>
+        &#60TotalResults>203&#60/TotalResults>
+        &#60TotalPages>21&#60/TotalPages>
+        &#60Item>
+            &#60ASIN>0446355453&#60/ASIN>
+            &#60DetailPageURL>
+                http://www.amazon.com/
+            &#60/DetailPageURL>
+            &#60ItemAttributes>
+                &#60Author>Sidney Sheldon&#60/Author>
+                &#60Manufacturer>Warner Books&#60/Manufacturer>
+                &#60ProductGroup>Book&#60/ProductGroup>
+                &#60Title>Master of the Game&#60/Title>
+            &#60/ItemAttributes>
+        &#60/Item>
+    &#60/Items>
+&#60/ItemSearchResponse>
+ * </code></pre>
+ * An object literal of this form could also be used as the {@link #data} config option.</p>
+ * <p><b>Note:</b> Although not listed here, this class accepts all of the configuration options of 
+ * <b>{@link Ext.data.XmlReader XmlReader}</b>.</p>
+ * @constructor
+ * @param {Object} config
+ * @xtype xmlstore
+ */
+Ext.data.XmlStore = Ext.extend(Ext.data.Store, {
+    /**
+     * @cfg {Ext.data.DataReader} reader @hide
+     */
+    constructor: function(config){
+        Ext.data.XmlStore.superclass.constructor.call(this, Ext.apply(config, {
+            reader: new Ext.data.XmlReader(config)
+        }));
+    }
+});
+Ext.reg('xmlstore', Ext.data.XmlStore);/**
+ * @class Ext.data.GroupingStore
+ * @extends Ext.data.Store
+ * A specialized store implementation that provides for grouping records by one of the available fields. This
+ * is usually used in conjunction with an {@link Ext.grid.GroupingView} to provide the data model for
+ * a grouped GridPanel.
+ *
+ * Internally, GroupingStore is simply a normal Store with multi sorting enabled from the start. The grouping field
+ * and direction are always injected as the first sorter pair. GroupingView picks up on the configured groupField and
+ * builds grid rows appropriately.
+ *
+ * @constructor
+ * Creates a new GroupingStore.
+ * @param {Object} config A config object containing the objects needed for the Store to access data,
+ * and read the data into Records.
+ * @xtype groupingstore
+ */
+Ext.data.GroupingStore = Ext.extend(Ext.data.Store, {
+
+    //inherit docs
+    constructor: function(config) {
+        config = config || {};
+
+        //We do some preprocessing here to massage the grouping + sorting options into a single
+        //multi sort array. If grouping and sorting options are both presented to the constructor,
+        //the sorters array consists of the grouping sorter object followed by the sorting sorter object
+        //see Ext.data.Store's sorting functions for details about how multi sorting works
+        this.hasMultiSort  = true;
+        this.multiSortInfo = this.multiSortInfo || {sorters: []};
+
+        var sorters    = this.multiSortInfo.sorters,
+            groupField = config.groupField || this.groupField,
+            sortInfo   = config.sortInfo || this.sortInfo,
+            groupDir   = config.groupDir || this.groupDir;
+
+        //add the grouping sorter object first
+        if(groupField){
+            sorters.push({
+                field    : groupField,
+                direction: groupDir
+            });
+        }
+
+        //add the sorting sorter object if it is present
+        if (sortInfo) {
+            sorters.push(sortInfo);
+        }
+
+        Ext.data.GroupingStore.superclass.constructor.call(this, config);
+
+        this.addEvents(
+          /**
+           * @event groupchange
+           * Fired whenever a call to store.groupBy successfully changes the grouping on the store
+           * @param {Ext.data.GroupingStore} store The grouping store
+           * @param {String} groupField The field that the store is now grouped by
+           */
+          'groupchange'
+        );
+
+        this.applyGroupField();
+    },
+
+    /**
+     * @cfg {String} groupField
+     * The field name by which to sort the store's data (defaults to '').
+     */
+    /**
+     * @cfg {Boolean} remoteGroup
+     * True if the grouping should apply on the server side, false if it is local only (defaults to false).  If the
+     * grouping is local, it can be applied immediately to the data.  If it is remote, then it will simply act as a
+     * helper, automatically sending the grouping field name as the 'groupBy' param with each XHR call.
+     */
+    remoteGroup : false,
+    /**
+     * @cfg {Boolean} groupOnSort
+     * True to sort the data on the grouping field when a grouping operation occurs, false to sort based on the
+     * existing sort info (defaults to false).
+     */
+    groupOnSort:false,
+
+    /**
+     * @cfg {String} groupDir
+     * The direction to sort the groups. Defaults to <tt>'ASC'</tt>.
+     */
+    groupDir : 'ASC',
+
+    /**
+     * Clears any existing grouping and refreshes the data using the default sort.
+     */
+    clearGrouping : function(){
+        this.groupField = false;
+
+        if(this.remoteGroup){
+            if(this.baseParams){
+                delete this.baseParams.groupBy;
+                delete this.baseParams.groupDir;
+            }
+            var lo = this.lastOptions;
+            if(lo && lo.params){
+                delete lo.params.groupBy;
+                delete lo.params.groupDir;
+            }
+
+            this.reload();
+        }else{
+            this.sort();
+            this.fireEvent('datachanged', this);
+        }
+    },
+
+    /**
+     * Groups the data by the specified field.
+     * @param {String} field The field name by which to sort the store's data
+     * @param {Boolean} forceRegroup (optional) True to force the group to be refreshed even if the field passed
+     * in is the same as the current grouping field, false to skip grouping on the same field (defaults to false)
+     */
+    groupBy : function(field, forceRegroup, direction) {
+        direction = direction ? (String(direction).toUpperCase() == 'DESC' ? 'DESC' : 'ASC') : this.groupDir;
+
+        if (this.groupField == field && this.groupDir == direction && !forceRegroup) {
+            return; // already grouped by this field
+        }
+
+        //check the contents of the first sorter. If the field matches the CURRENT groupField (before it is set to the new one),
+        //remove the sorter as it is actually the grouper. The new grouper is added back in by this.sort
+        var sorters = this.multiSortInfo.sorters;
+        if (sorters.length > 0 && sorters[0].field == this.groupField) {
+            sorters.shift();
+        }
+
+        this.groupField = field;
+        this.groupDir = direction;
+        this.applyGroupField();
+
+        var fireGroupEvent = function() {
+            this.fireEvent('groupchange', this, this.getGroupState());
+        };
+
+        if (this.groupOnSort) {
+            this.sort(field, direction);
+            fireGroupEvent.call(this);
+            return;
+        }
+
+        if (this.remoteGroup) {
+            this.on('load', fireGroupEvent, this, {single: true});
+            this.reload();
+        } else {
+            this.sort(sorters);
+            fireGroupEvent.call(this);
+        }
+    },
+
+    //GroupingStore always uses multisorting so we intercept calls to sort here to make sure that our grouping sorter object
+    //is always injected first.
+    sort : function(fieldName, dir) {
+        if (this.remoteSort) {
+            return Ext.data.GroupingStore.superclass.sort.call(this, fieldName, dir);
+        }
+
+        var sorters = [];
+
+        //cater for any existing valid arguments to this.sort, massage them into an array of sorter objects
+        if (Ext.isArray(arguments[0])) {
+            sorters = arguments[0];
+        } else if (fieldName == undefined) {
+            //we preserve the existing sortInfo here because this.sort is called after
+            //clearGrouping and there may be existing sorting
+            sorters = this.sortInfo ? [this.sortInfo] : [];
+        } else {
+            //TODO: this is lifted straight from Ext.data.Store's singleSort function. It should instead be
+            //refactored into a common method if possible
+            var field = this.fields.get(fieldName);
+            if (!field) return false;
+
+            var name       = field.name,
+                sortInfo   = this.sortInfo || null,
+                sortToggle = this.sortToggle ? this.sortToggle[name] : null;
+
+            if (!dir) {
+                if (sortInfo && sortInfo.field == name) { // toggle sort dir
+                    dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
+                } else {
+                    dir = field.sortDir;
+                }
+            }
+
+            this.sortToggle[name] = dir;
+            this.sortInfo = {field: name, direction: dir};
+
+            sorters = [this.sortInfo];
+        }
+
+        //add the grouping sorter object as the first multisort sorter
+        if (this.groupField) {
+            sorters.unshift({direction: this.groupDir, field: this.groupField});
+        }
+
+        return this.multiSort.call(this, sorters, dir);
+    },
+
+    /**
+     * @private
+     * Saves the current grouping field and direction to this.baseParams and this.lastOptions.params
+     * if we're using remote grouping. Does not actually perform any grouping - just stores values
+     */
+    applyGroupField: function(){
+        if (this.remoteGroup) {
+            if(!this.baseParams){
+                this.baseParams = {};
+            }
+
+            Ext.apply(this.baseParams, {
+                groupBy : this.groupField,
+                groupDir: this.groupDir
+            });
+
+            var lo = this.lastOptions;
+            if (lo && lo.params) {
+                lo.params.groupDir = this.groupDir;
+
+                //this is deleted because of a bug reported at http://www.extjs.com/forum/showthread.php?t=82907
+                delete lo.params.groupBy;
+            }
+        }
+    },
+
+    /**
+     * @private
+     * TODO: This function is apparently never invoked anywhere in the framework. It has no documentation
+     * and should be considered for deletion
+     */
+    applyGrouping : function(alwaysFireChange){
+        if(this.groupField !== false){
+            this.groupBy(this.groupField, true, this.groupDir);
+            return true;
+        }else{
+            if(alwaysFireChange === true){
+                this.fireEvent('datachanged', this);
+            }
+            return false;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the grouping field that should be used. If groupOnSort is used this will be sortInfo's field,
+     * otherwise it will be this.groupField
+     * @return {String} The group field
+     */
+    getGroupState : function(){
+        return this.groupOnSort && this.groupField !== false ?
+               (this.sortInfo ? this.sortInfo.field : undefined) : this.groupField;
+    }
+});
+Ext.reg('groupingstore', Ext.data.GroupingStore);
+/**
+ * @class Ext.data.DirectProxy
+ * @extends Ext.data.DataProxy
+ */
+Ext.data.DirectProxy = function(config){
+    Ext.apply(this, config);
+    if(typeof this.paramOrder == 'string'){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+    Ext.data.DirectProxy.superclass.constructor.call(this, config);
+};
+
+Ext.extend(Ext.data.DirectProxy, Ext.data.DataProxy, {
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. A list of params to be executed
+     * server side.  Specify the params in the order in which they must be executed on the server-side
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash
+     * Send parameters as a collection of named arguments (defaults to <tt>true</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: true,
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.  directFn is a simple alternative to defining the api configuration-parameter
+     * for Store's which will not implement a full CRUD api.
+     */
+    directFn : undefined,
+
+    /**
+     * DirectProxy implementation of {@link Ext.data.DataProxy#doRequest}
+     * @param {String} action The crud action type (create, read, update, destroy)
+     * @param {Ext.data.Record/Ext.data.Record[]} rs If action is load, rs will be null
+     * @param {Object} params An object containing properties which are to be used as HTTP parameters
+     * for the request to the remote server.
+     * @param {Ext.data.DataReader} reader The Reader object which converts the data
+     * object into a block of Ext.data.Records.
+     * @param {Function} callback
+     * <div class="sub-desc"><p>A function to be called after the request.
+     * The <tt>callback</tt> is passed the following arguments:<ul>
+     * <li><tt>r</tt> : Ext.data.Record[] The block of Ext.data.Records.</li>
+     * <li><tt>options</tt>: Options object from the action request</li>
+     * <li><tt>success</tt>: Boolean success indicator</li></ul></p></div>
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} arg An optional argument which is passed to the callback as its second parameter.
+     * @protected
+     */
+    doRequest : function(action, rs, params, reader, callback, scope, options) {
+        var args = [],
+            directFn = this.api[action] || this.directFn;
+
+        switch (action) {
+            case Ext.data.Api.actions.create:
+                args.push(params.jsonData);		// <-- create(Hash)
+                break;
+            case Ext.data.Api.actions.read:
+                // If the method has no parameters, ignore the paramOrder/paramsAsHash.
+                if(directFn.directCfg.method.len > 0){
+                    if(this.paramOrder){
+                        for(var i = 0, len = this.paramOrder.length; i < len; i++){
+                            args.push(params[this.paramOrder[i]]);
+                        }
+                    }else if(this.paramsAsHash){
+                        args.push(params);
+                    }
+                }
+                break;
+            case Ext.data.Api.actions.update:
+                args.push(params.jsonData);        // <-- update(Hash/Hash[])
+                break;
+            case Ext.data.Api.actions.destroy:
+                args.push(params.jsonData);        // <-- destroy(Int/Int[])
+                break;
+        }
+
+        var trans = {
+            params : params || {},
+            request: {
+                callback : callback,
+                scope : scope,
+                arg : options
+            },
+            reader: reader
+        };
+
+        args.push(this.createCallback(action, rs, trans), this);
+        directFn.apply(window, args);
+    },
+
+    // private
+    createCallback : function(action, rs, trans) {
+        var me = this;
+        return function(result, res) {
+            if (!res.status) {
+                // @deprecated fire loadexception
+                if (action === Ext.data.Api.actions.read) {
+                    me.fireEvent("loadexception", me, trans, res, null);
+                }
+                me.fireEvent('exception', me, 'remote', action, trans, res, null);
+                trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+                return;
+            }
+            if (action === Ext.data.Api.actions.read) {
+                me.onRead(action, trans, result, res);
+            } else {
+                me.onWrite(action, trans, result, res, rs);
+            }
+        };
+    },
+
+    /**
+     * Callback for read actions
+     * @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @protected
+     */
+    onRead : function(action, trans, result, res) {
+        var records;
+        try {
+            records = trans.reader.readRecords(result);
+        }
+        catch (ex) {
+            // @deprecated: Fire old loadexception for backwards-compat.
+            this.fireEvent("loadexception", this, trans, res, ex);
+
+            this.fireEvent('exception', this, 'response', action, trans, res, ex);
+            trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
+            return;
+        }
+        this.fireEvent("load", this, res, trans.request.arg);
+        trans.request.callback.call(trans.request.scope, records, trans.request.arg, true);
+    },
+    /**
+     * Callback for write actions
+     * @param {String} action [{@link Ext.data.Api#actions create|read|update|destroy}]
+     * @param {Object} trans The request transaction object
+     * @param {Object} result Data object picked out of the server-response.
+     * @param {Object} res The server response
+     * @param {Ext.data.Record/[Ext.data.Record]} rs The Store resultset associated with the action.
+     * @protected
+     */
+    onWrite : function(action, trans, result, res, rs) {
+        var data = trans.reader.extractData(trans.reader.getRoot(result), false);
+        var success = trans.reader.getSuccess(result);
+        success = (success !== false);
+        if (success){
+            this.fireEvent("write", this, action, data, res, rs, trans.request.arg);
+        }else{
+            this.fireEvent('exception', this, 'remote', action, trans, result, rs);
+        }
+        trans.request.callback.call(trans.request.scope, data, res, success);
+    }
+});
+/**
+ * @class Ext.data.DirectStore
+ * @extends Ext.data.Store
+ * <p>Small helper class to create an {@link Ext.data.Store} configured with an
+ * {@link Ext.data.DirectProxy} and {@link Ext.data.JsonReader} to make interacting
+ * with an {@link Ext.Direct} Server-side {@link Ext.direct.Provider Provider} easier.
+ * To create a different proxy/reader combination create a basic {@link Ext.data.Store}
+ * configured as needed.</p>
+ *
+ * <p><b>*Note:</b> Although they are not listed, this class inherits all of the config options of:</p>
+ * <div><ul class="mdetail-params">
+ * <li><b>{@link Ext.data.Store Store}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ *
+ * </ul></div>
+ * <li><b>{@link Ext.data.JsonReader JsonReader}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.JsonReader#root root}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#idProperty idProperty}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.JsonReader#totalProperty totalProperty}</b></tt></li>
+ * </ul></div>
+ *
+ * <li><b>{@link Ext.data.DirectProxy DirectProxy}</b></li>
+ * <div class="sub-desc"><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.data.DirectProxy#directFn directFn}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramOrder paramOrder}</b></tt></li>
+ * <li><tt><b>{@link Ext.data.DirectProxy#paramsAsHash paramsAsHash}</b></tt></li>
+ * </ul></div>
+ * </ul></div>
+ *
+ * @xtype directstore
+ *
+ * @constructor
+ * @param {Object} config
+ */
+Ext.data.DirectStore = Ext.extend(Ext.data.Store, {
+    constructor : function(config){
+        // each transaction upon a singe record will generate a distinct Direct transaction since Direct queues them into one Ajax request.
+        var c = Ext.apply({}, {
+            batchTransactions: false
+        }, config);
+        Ext.data.DirectStore.superclass.constructor.call(this, Ext.apply(c, {
+            proxy: Ext.isDefined(c.proxy) ? c.proxy : new Ext.data.DirectProxy(Ext.copyTo({}, c, 'paramOrder,paramsAsHash,directFn,api')),
+            reader: (!Ext.isDefined(c.reader) && c.fields) ? new Ext.data.JsonReader(Ext.copyTo({}, c, 'totalProperty,root,idProperty'), c.fields) : c.reader
+        }));
+    }
+});
+Ext.reg('directstore', Ext.data.DirectStore);
+/**
+ * @class Ext.Direct
+ * @extends Ext.util.Observable
+ * <p><b><u>Overview</u></b></p>
+ *
+ * <p>Ext.Direct aims to streamline communication between the client and server
+ * by providing a single interface that reduces the amount of common code
+ * typically required to validate data and handle returned data packets
+ * (reading data, error conditions, etc).</p>
+ *
+ * <p>The Ext.direct namespace includes several classes for a closer integration
+ * with the server-side. The Ext.data namespace also includes classes for working
+ * with Ext.data.Stores which are backed by data from an Ext.Direct method.</p>
+ *
+ * <p><b><u>Specification</u></b></p>
+ *
+ * <p>For additional information consult the
+ * <a href="http://extjs.com/products/extjs/direct.php">Ext.Direct Specification</a>.</p>
+ *
+ * <p><b><u>Providers</u></b></p>
+ *
+ * <p>Ext.Direct uses a provider architecture, where one or more providers are
+ * used to transport data to and from the server. There are several providers
+ * that exist in the core at the moment:</p><div class="mdetail-params"><ul>
+ *
+ * <li>{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations</li>
+ * <li>{@link Ext.direct.PollingProvider PollingProvider} for repeated requests</li>
+ * <li>{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side
+ * on the client.</li>
+ * </ul></div>
+ *
+ * <p>A provider does not need to be invoked directly, providers are added via
+ * {@link Ext.Direct}.{@link Ext.Direct#add add}.</p>
+ *
+ * <p><b><u>Router</u></b></p>
+ *
+ * <p>Ext.Direct utilizes a "router" on the server to direct requests from the client
+ * to the appropriate server-side method. Because the Ext.Direct API is completely
+ * platform-agnostic, you could completely swap out a Java based server solution
+ * and replace it with one that uses C# without changing the client side JavaScript
+ * at all.</p>
+ *
+ * <p><b><u>Server side events</u></b></p>
+ *
+ * <p>Custom events from the server may be handled by the client by adding
+ * listeners, for example:</p>
+ * <pre><code>
+{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}
+
+// add a handler for a 'message' event sent by the server
+Ext.Direct.on('message', function(e){
+    out.append(String.format('&lt;p>&lt;i>{0}&lt;/i>&lt;/p>', e.data));
+            out.el.scrollTo('t', 100000, true);
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.Direct = Ext.extend(Ext.util.Observable, {
+    /**
+     * Each event type implements a getData() method. The default event types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>event</tt></b> : Ext.Direct.Event</li>
+     * <li><b><tt>exception</tt></b> : Ext.Direct.ExceptionEvent</li>
+     * <li><b><tt>rpc</tt></b> : Ext.Direct.RemotingEvent</li>
+     * </ul></div>
+     * @property eventTypes
+     * @type Object
+     */
+
+    /**
+     * Four types of possible exceptions which can occur:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>Ext.Direct.exceptions.TRANSPORT</tt></b> : 'xhr'</li>
+     * <li><b><tt>Ext.Direct.exceptions.PARSE</tt></b> : 'parse'</li>
+     * <li><b><tt>Ext.Direct.exceptions.LOGIN</tt></b> : 'login'</li>
+     * <li><b><tt>Ext.Direct.exceptions.SERVER</tt></b> : 'exception'</li>
+     * </ul></div>
+     * @property exceptions
+     * @type Object
+     */
+    exceptions: {
+        TRANSPORT: 'xhr',
+        PARSE: 'parse',
+        LOGIN: 'login',
+        SERVER: 'exception'
+    },
+
+    // private
+    constructor: function(){
+        this.addEvents(
+            /**
+             * @event event
+             * Fires after an event.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */
+            'event',
+            /**
+             * @event exception
+             * Fires after an event exception.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */
+            'exception'
+        );
+        this.transactions = {};
+        this.providers = {};
+    },
+
+    /**
+     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.
+     * If the provider is not already connected, it will auto-connect.
+     * <pre><code>
+var pollProv = new Ext.direct.PollingProvider({
+    url: 'php/poll2.php'
+});
+
+Ext.Direct.addProvider(
+    {
+        "type":"remoting",       // create a {@link Ext.direct.RemotingProvider}
+        "url":"php\/router.php", // url to connect to the Ext.Direct server-side router.
+        "actions":{              // each property within the actions object represents a Class
+            "TestAction":[       // array of methods within each server side Class
+            {
+                "name":"doEcho", // name of method
+                "len":1
+            },{
+                "name":"multiply",
+                "len":1
+            },{
+                "name":"doForm",
+                "formHandler":true, // handle form on server with Ext.Direct.Transaction
+                "len":1
+            }]
+        },
+        "namespace":"myApplication",// namespace to create the Remoting Provider in
+    },{
+        type: 'polling', // create a {@link Ext.direct.PollingProvider}
+        url:  'php/poll.php'
+    },
+    pollProv // reference to previously created instance
+);
+     * </code></pre>
+     * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance
+     * or config object for a Provider) or any number of Provider descriptions as arguments.  Each
+     * Provider description instructs Ext.Direct how to create client-side stub methods.
+     */
+    addProvider : function(provider){
+        var a = arguments;
+        if(a.length > 1){
+            for(var i = 0, len = a.length; i < len; i++){
+                this.addProvider(a[i]);
+            }
+            return;
+        }
+
+        // if provider has not already been instantiated
+        if(!provider.events){
+            provider = new Ext.Direct.PROVIDERS[provider.type](provider);
+        }
+        provider.id = provider.id || Ext.id();
+        this.providers[provider.id] = provider;
+
+        provider.on('data', this.onProviderData, this);
+        provider.on('exception', this.onProviderException, this);
+
+
+        if(!provider.isConnected()){
+            provider.connect();
+        }
+
+        return provider;
+    },
+
+    /**
+     * Retrieve a {@link Ext.direct.Provider provider} by the
+     * <b><tt>{@link Ext.direct.Provider#id id}</tt></b> specified when the provider is
+     * {@link #addProvider added}.
+     * @param {String} id Unique identifier assigned to the provider when calling {@link #addProvider}
+     */
+    getProvider : function(id){
+        return this.providers[id];
+    },
+
+    removeProvider : function(id){
+        var provider = id.id ? id : this.providers[id];
+        provider.un('data', this.onProviderData, this);
+        provider.un('exception', this.onProviderException, this);
+        delete this.providers[provider.id];
+        return provider;
+    },
+
+    addTransaction: function(t){
+        this.transactions[t.tid] = t;
+        return t;
+    },
+
+    removeTransaction: function(t){
+        delete this.transactions[t.tid || t];
+        return t;
+    },
+
+    getTransaction: function(tid){
+        return this.transactions[tid.tid || tid];
+    },
+
+    onProviderData : function(provider, e){
+        if(Ext.isArray(e)){
+            for(var i = 0, len = e.length; i < len; i++){
+                this.onProviderData(provider, e[i]);
+            }
+            return;
+        }
+        if(e.name && e.name != 'event' && e.name != 'exception'){
+            this.fireEvent(e.name, e);
+        }else if(e.type == 'exception'){
+            this.fireEvent('exception', e);
+        }
+        this.fireEvent('event', e, provider);
+    },
+
+    createEvent : function(response, extraProps){
+        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));
+    }
+});
+// overwrite impl. with static instance
+Ext.Direct = new Ext.Direct();
+
+Ext.Direct.TID = 1;
+Ext.Direct.PROVIDERS = {};/**
+ * @class Ext.Direct.Transaction
+ * @extends Object
+ * <p>Supporting Class for Ext.Direct (not intended to be used directly).</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.Direct.Transaction = function(config){
+    Ext.apply(this, config);
+    this.tid = ++Ext.Direct.TID;
+    this.retryCount = 0;
+};
+Ext.Direct.Transaction.prototype = {
+    send: function(){
+        this.provider.queueTransaction(this);
+    },
+
+    retry: function(){
+        this.retryCount++;
+        this.send();
+    },
+
+    getProvider: function(){
+        return this.provider;
+    }
+};Ext.Direct.Event = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.Direct.Event.prototype = {
+    status: true,
+    getData: function(){
+        return this.data;
+    }
+};
+
+Ext.Direct.RemotingEvent = Ext.extend(Ext.Direct.Event, {
+    type: 'rpc',
+    getTransaction: function(){
+        return this.transaction || Ext.Direct.getTransaction(this.tid);
+    }
+});
+
+Ext.Direct.ExceptionEvent = Ext.extend(Ext.Direct.RemotingEvent, {
+    status: false,
+    type: 'exception'
+});
+
+Ext.Direct.eventTypes = {
+    'rpc':  Ext.Direct.RemotingEvent,
+    'event':  Ext.Direct.Event,
+    'exception':  Ext.Direct.ExceptionEvent
+};
+/**
+ * @class Ext.direct.Provider
+ * @extends Ext.util.Observable
+ * <p>Ext.direct.Provider is an abstract class meant to be extended.</p>
+ * 
+ * <p>For example ExtJs implements the following subclasses:</p>
+ * <pre><code>
+Provider
+|
++---{@link Ext.direct.JsonProvider JsonProvider} 
+    |
+    +---{@link Ext.direct.PollingProvider PollingProvider}   
+    |
+    +---{@link Ext.direct.RemotingProvider RemotingProvider}   
+ * </code></pre>
+ * @abstract
+ */
+Ext.direct.Provider = Ext.extend(Ext.util.Observable, {    
+    /**
+     * @cfg {String} id
+     * The unique id of the provider (defaults to an {@link Ext#id auto-assigned id}).
+     * You should assign an id if you need to be able to access the provider later and you do
+     * not have an object reference available, for example:
+     * <pre><code>
+Ext.Direct.addProvider(
+    {
+        type: 'polling',
+        url:  'php/poll.php',
+        id:   'poll-provider'
+    }
+);
+     
+var p = {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#getProvider getProvider}('poll-provider');
+p.disconnect();
+     * </code></pre>
+     */
+        
+    /**
+     * @cfg {Number} priority
+     * Priority of the request. Lower is higher priority, <tt>0</tt> means "duplex" (always on).
+     * All Providers default to <tt>1</tt> except for PollingProvider which defaults to <tt>3</tt>.
+     */    
+    priority: 1,
+
+    /**
+     * @cfg {String} type
+     * <b>Required</b>, <tt>undefined</tt> by default.  The <tt>type</tt> of provider specified
+     * to {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#addProvider addProvider} to create a
+     * new Provider. Acceptable values by default are:<div class="mdetail-params"><ul>
+     * <li><b><tt>polling</tt></b> : {@link Ext.direct.PollingProvider PollingProvider}</li>
+     * <li><b><tt>remoting</tt></b> : {@link Ext.direct.RemotingProvider RemotingProvider}</li>
+     * </ul></div>
+     */    
+ 
+    // private
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.addEvents(
+            /**
+             * @event connect
+             * Fires when the Provider connects to the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'connect',
+            /**
+             * @event disconnect
+             * Fires when the Provider disconnects from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */            
+            'disconnect',
+            /**
+             * @event data
+             * Fires when the Provider receives data from the server-side
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */            
+            'data',
+            /**
+             * @event exception
+             * Fires when the Provider receives an exception from the server-side
+             */                        
+            'exception'
+        );
+        Ext.direct.Provider.superclass.constructor.call(this, config);
+    },
+
+    /**
+     * Returns whether or not the server-side is currently connected.
+     * Abstract method for subclasses to implement.
+     */
+    isConnected: function(){
+        return false;
+    },
+
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    connect: Ext.emptyFn,
+    
+    /**
+     * Abstract methods for subclasses to implement.
+     */
+    disconnect: Ext.emptyFn
+});
+/**
+ * @class Ext.direct.JsonProvider
+ * @extends Ext.direct.Provider
+ */
+Ext.direct.JsonProvider = Ext.extend(Ext.direct.Provider, {
+    parseResponse: function(xhr){
+        if(!Ext.isEmpty(xhr.responseText)){
+            if(typeof xhr.responseText == 'object'){
+                return xhr.responseText;
+            }
+            return Ext.decode(xhr.responseText);
+        }
+        return null;
+    },
+
+    getEvents: function(xhr){
+        var data = null;
+        try{
+            data = this.parseResponse(xhr);
+        }catch(e){
+            var event = new Ext.Direct.ExceptionEvent({
+                data: e,
+                xhr: xhr,
+                code: Ext.Direct.exceptions.PARSE,
+                message: 'Error parsing json response: \n\n ' + data
+            });
+            return [event];
+        }
+        var events = [];
+        if(Ext.isArray(data)){
+            for(var i = 0, len = data.length; i < len; i++){
+                events.push(Ext.Direct.createEvent(data[i]));
+            }
+        }else{
+            events.push(Ext.Direct.createEvent(data));
+        }
+        return events;
+    }
+});/**
+ * @class Ext.direct.PollingProvider
+ * @extends Ext.direct.JsonProvider
+ *
+ * <p>Provides for repetitive polling of the server at distinct {@link #interval intervals}.
+ * The initial request for data originates from the client, and then is responded to by the
+ * server.</p>
+ * 
+ * <p>All configurations for the PollingProvider should be generated by the server-side
+ * API portion of the Ext.Direct stack.</p>
+ *
+ * <p>An instance of PollingProvider may be created directly via the new keyword or by simply
+ * specifying <tt>type = 'polling'</tt>.  For example:</p>
+ * <pre><code>
+var pollA = new Ext.direct.PollingProvider({
+    type:'polling',
+    url: 'php/pollA.php',
+});
+Ext.Direct.addProvider(pollA);
+pollA.disconnect();
+
+Ext.Direct.addProvider(
+    {
+        type:'polling',
+        url: 'php/pollB.php',
+        id: 'pollB-provider'
+    }
+);
+var pollB = Ext.Direct.getProvider('pollB-provider');
+ * </code></pre>
+ */
+Ext.direct.PollingProvider = Ext.extend(Ext.direct.JsonProvider, {
+    /**
+     * @cfg {Number} priority
+     * Priority of the request (defaults to <tt>3</tt>). See {@link Ext.direct.Provider#priority}.
+     */
+    // override default priority
+    priority: 3,
+    
+    /**
+     * @cfg {Number} interval
+     * How often to poll the server-side in milliseconds (defaults to <tt>3000</tt> - every
+     * 3 seconds).
+     */
+    interval: 3000,
+
+    /**
+     * @cfg {Object} baseParams An object containing properties which are to be sent as parameters
+     * on every polling request
+     */
+    
+    /**
+     * @cfg {String/Function} url
+     * The url which the PollingProvider should contact with each request. This can also be
+     * an imported Ext.Direct method which will accept the baseParams as its only argument.
+     */
+
+    // private
+    constructor : function(config){
+        Ext.direct.PollingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforepoll
+             * Fired immediately before a poll takes place, an event handler can return false
+             * in order to cancel the poll.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'beforepoll',            
+            /**
+             * @event poll
+             * This event has not yet been implemented.
+             * @param {Ext.direct.PollingProvider}
+             */
+            'poll'
+        );
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.pollTask;
+    },
+
+    /**
+     * Connect to the server-side and begin the polling process. To handle each
+     * response subscribe to the data event.
+     */
+    connect: function(){
+        if(this.url && !this.pollTask){
+            this.pollTask = Ext.TaskMgr.start({
+                run: function(){
+                    if(this.fireEvent('beforepoll', this) !== false){
+                        if(typeof this.url == 'function'){
+                            this.url(this.baseParams);
+                        }else{
+                            Ext.Ajax.request({
+                                url: this.url,
+                                callback: this.onData,
+                                scope: this,
+                                params: this.baseParams
+                            });
+                        }
+                    }
+                },
+                interval: this.interval,
+                scope: this
+            });
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing PollingProvider, no url configured.';
+        }
+    },
+
+    /**
+     * Disconnect from the server-side and stop the polling process. The disconnect
+     * event will be fired on a successful disconnect.
+     */
+    disconnect: function(){
+        if(this.pollTask){
+            Ext.TaskMgr.stop(this.pollTask);
+            delete this.pollTask;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    // private
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i];
+                this.fireEvent('data', this, e);
+            }
+        }else{
+            var e = new Ext.Direct.ExceptionEvent({
+                data: e,
+                code: Ext.Direct.exceptions.TRANSPORT,
+                message: 'Unable to connect to the server.',
+                xhr: xhr
+            });
+            this.fireEvent('data', this, e);
+        }
+    }
+});
+
+Ext.Direct.PROVIDERS['polling'] = Ext.direct.PollingProvider;/**
+ * @class Ext.direct.RemotingProvider
+ * @extends Ext.direct.JsonProvider
+ * 
+ * <p>The {@link Ext.direct.RemotingProvider RemotingProvider} exposes access to
+ * server side methods on the client (a remote procedure call (RPC) type of
+ * connection where the client can initiate a procedure on the server).</p>
+ * 
+ * <p>This allows for code to be organized in a fashion that is maintainable,
+ * while providing a clear path between client and server, something that is
+ * not always apparent when using URLs.</p>
+ * 
+ * <p>To accomplish this the server-side needs to describe what classes and methods
+ * are available on the client-side. This configuration will typically be
+ * outputted by the server-side Ext.Direct stack when the API description is built.</p>
+ */
+Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, {       
+    /**
+     * @cfg {Object} actions
+     * Object literal defining the server side actions and methods. For example, if
+     * the Provider is configured with:
+     * <pre><code>
+"actions":{ // each property within the 'actions' object represents a server side Class 
+    "TestAction":[ // array of methods within each server side Class to be   
+    {              // stubbed out on client
+        "name":"doEcho", 
+        "len":1            
+    },{
+        "name":"multiply",// name of method
+        "len":2           // The number of parameters that will be used to create an
+                          // array of data to send to the server side function.
+                          // Ensure the server sends back a Number, not a String. 
+    },{
+        "name":"doForm",
+        "formHandler":true, // direct the client to use specialized form handling method 
+        "len":1
+    }]
+}
+     * </code></pre>
+     * <p>Note that a Store is not required, a server method can be called at any time.
+     * In the following example a <b>client side</b> handler is used to call the
+     * server side method "multiply" in the server-side "TestAction" Class:</p>
+     * <pre><code>
+TestAction.multiply(
+    2, 4, // pass two arguments to server, so specify len=2
+    // callback function after the server is called
+    // result: the result returned by the server
+    //      e: Ext.Direct.RemotingEvent object
+    function(result, e){
+        var t = e.getTransaction();
+        var action = t.action; // server side Class called
+        var method = t.method; // server side method called
+        if(e.status){
+            var answer = Ext.encode(result); // 8
+    
+        }else{
+            var msg = e.message; // failure message
+        }
+    }
+);
+     * </code></pre>
+     * In the example above, the server side "multiply" function will be passed two
+     * arguments (2 and 4).  The "multiply" method should return the value 8 which will be
+     * available as the <tt>result</tt> in the example above. 
+     */
+    
+    /**
+     * @cfg {String/Object} namespace
+     * Namespace for the Remoting Provider (defaults to the browser global scope of <i>window</i>).
+     * Explicitly specify the namespace Object, or specify a String to have a
+     * {@link Ext#namespace namespace created} implicitly.
+     */
+    
+    /**
+     * @cfg {String} url
+     * <b>Required<b>. The url to connect to the {@link Ext.Direct} server-side router. 
+     */
+    
+    /**
+     * @cfg {String} enableUrlEncode
+     * Specify which param will hold the arguments for the method.
+     * Defaults to <tt>'data'</tt>.
+     */
+    
+    /**
+     * @cfg {Number/Boolean} enableBuffer
+     * <p><tt>true</tt> or <tt>false</tt> to enable or disable combining of method
+     * calls. If a number is specified this is the amount of time in milliseconds
+     * to wait before sending a batched request (defaults to <tt>10</tt>).</p>
+     * <br><p>Calls which are received within the specified timeframe will be
+     * concatenated together and sent in a single request, optimizing the
+     * application by reducing the amount of round trips that have to be made
+     * to the server.</p>
+     */
+    enableBuffer: 10,
+    
+    /**
+     * @cfg {Number} maxRetries
+     * Number of times to re-attempt delivery on failure of a call. Defaults to <tt>1</tt>.
+     */
+    maxRetries: 1,
+    
+    /**
+     * @cfg {Number} timeout
+     * The timeout to use for each request. Defaults to <tt>undefined</tt>.
+     */
+    timeout: undefined,
+
+    constructor : function(config){
+        Ext.direct.RemotingProvider.superclass.constructor.call(this, config);
+        this.addEvents(
+            /**
+             * @event beforecall
+             * Fires immediately before the client-side sends off the RPC call.
+             * By returning false from an event handler you can prevent the call from
+             * executing.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'beforecall',            
+            /**
+             * @event call
+             * Fires immediately after the request to the server-side is sent. This does
+             * NOT fire after the response has come back from the call.
+             * @param {Ext.direct.RemotingProvider} provider
+             * @param {Ext.Direct.Transaction} transaction
+             * @param {Object} meta The meta data
+             */            
+            'call'
+        );
+        this.namespace = (Ext.isString(this.namespace)) ? Ext.ns(this.namespace) : this.namespace || window;
+        this.transactions = {};
+        this.callBuffer = [];
+    },
+
+    // private
+    initAPI : function(){
+        var o = this.actions;
+        for(var c in o){
+            var cls = this.namespace[c] || (this.namespace[c] = {}),
+                ms = o[c];
+            for(var i = 0, len = ms.length; i < len; i++){
+                var m = ms[i];
+                cls[m.name] = this.createMethod(c, m);
+            }
+        }
+    },
+
+    // inherited
+    isConnected: function(){
+        return !!this.connected;
+    },
+
+    connect: function(){
+        if(this.url){
+            this.initAPI();
+            this.connected = true;
+            this.fireEvent('connect', this);
+        }else if(!this.url){
+            throw 'Error initializing RemotingProvider, no url configured.';
+        }
+    },
+
+    disconnect: function(){
+        if(this.connected){
+            this.connected = false;
+            this.fireEvent('disconnect', this);
+        }
+    },
+
+    onData: function(opt, success, xhr){
+        if(success){
+            var events = this.getEvents(xhr);
+            for(var i = 0, len = events.length; i < len; i++){
+                var e = events[i],
+                    t = this.getTransaction(e);
+                this.fireEvent('data', this, e);
+                if(t){
+                    this.doCallback(t, e, true);
+                    Ext.Direct.removeTransaction(t);
+                }
+            }
+        }else{
+            var ts = [].concat(opt.ts);
+            for(var i = 0, len = ts.length; i < len; i++){
+                var t = this.getTransaction(ts[i]);
+                if(t && t.retryCount < this.maxRetries){
+                    t.retry();
+                }else{
+                    var e = new Ext.Direct.ExceptionEvent({
+                        data: e,
+                        transaction: t,
+                        code: Ext.Direct.exceptions.TRANSPORT,
+                        message: 'Unable to connect to the server.',
+                        xhr: xhr
+                    });
+                    this.fireEvent('data', this, e);
+                    if(t){
+                        this.doCallback(t, e, false);
+                        Ext.Direct.removeTransaction(t);
+                    }
+                }
+            }
+        }
+    },
+
+    getCallData: function(t){
+        return {
+            action: t.action,
+            method: t.method,
+            data: t.data,
+            type: 'rpc',
+            tid: t.tid
+        };
+    },
+
+    doSend : function(data){
+        var o = {
+            url: this.url,
+            callback: this.onData,
+            scope: this,
+            ts: data,
+            timeout: this.timeout
+        }, callData;
+
+        if(Ext.isArray(data)){
+            callData = [];
+            for(var i = 0, len = data.length; i < len; i++){
+                callData.push(this.getCallData(data[i]));
+            }
+        }else{
+            callData = this.getCallData(data);
+        }
+
+        if(this.enableUrlEncode){
+            var params = {};
+            params[Ext.isString(this.enableUrlEncode) ? this.enableUrlEncode : 'data'] = Ext.encode(callData);
+            o.params = params;
+        }else{
+            o.jsonData = callData;
+        }
+        Ext.Ajax.request(o);
+    },
+
+    combineAndSend : function(){
+        var len = this.callBuffer.length;
+        if(len > 0){
+            this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer);
+            this.callBuffer = [];
+        }
+    },
+
+    queueTransaction: function(t){
+        if(t.form){
+            this.processForm(t);
+            return;
+        }
+        this.callBuffer.push(t);
+        if(this.enableBuffer){
+            if(!this.callTask){
+                this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this);
+            }
+            this.callTask.delay(Ext.isNumber(this.enableBuffer) ? this.enableBuffer : 10);
+        }else{
+            this.combineAndSend();
+        }
+    },
+
+    doCall : function(c, m, args){
+        var data = null, hs = args[m.len], scope = args[m.len+1];
+
+        if(m.len !== 0){
+            data = args.slice(0, m.len);
+        }
+
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            args: args,
+            action: c,
+            method: m.name,
+            data: data,
+            cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            this.queueTransaction(t);
+            this.fireEvent('call', this, t, m);
+        }
+    },
+
+    doForm : function(c, m, form, callback, scope){
+        var t = new Ext.Direct.Transaction({
+            provider: this,
+            action: c,
+            method: m.name,
+            args:[form, callback, scope],
+            cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback,
+            isForm: true
+        });
+
+        if(this.fireEvent('beforecall', this, t, m) !== false){
+            Ext.Direct.addTransaction(t);
+            var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data',
+                params = {
+                    extTID: t.tid,
+                    extAction: c,
+                    extMethod: m.name,
+                    extType: 'rpc',
+                    extUpload: String(isUpload)
+                };
+            
+            // change made from typeof callback check to callback.params
+            // to support addl param passing in DirectSubmit EAC 6/2
+            Ext.apply(t, {
+                form: Ext.getDom(form),
+                isUpload: isUpload,
+                params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params
+            });
+            this.fireEvent('call', this, t, m);
+            this.processForm(t);
+        }
+    },
+    
+    processForm: function(t){
+        Ext.Ajax.request({
+            url: this.url,
+            params: t.params,
+            callback: this.onData,
+            scope: this,
+            form: t.form,
+            isUpload: t.isUpload,
+            ts: t
+        });
+    },
+
+    createMethod : function(c, m){
+        var f;
+        if(!m.formHandler){
+            f = function(){
+                this.doCall(c, m, Array.prototype.slice.call(arguments, 0));
+            }.createDelegate(this);
+        }else{
+            f = function(form, callback, scope){
+                this.doForm(c, m, form, callback, scope);
+            }.createDelegate(this);
+        }
+        f.directCfg = {
+            action: c,
+            method: m
+        };
+        return f;
+    },
+
+    getTransaction: function(opt){
+        return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null;
+    },
+
+    doCallback: function(t, e){
+        var fn = e.status ? 'success' : 'failure';
+        if(t && t.cb){
+            var hs = t.cb,
+                result = Ext.isDefined(e.result) ? e.result : e.data;
+            if(Ext.isFunction(hs)){
+                hs(result, e);
+            } else{
+                Ext.callback(hs[fn], hs.scope, [result, e]);
+                Ext.callback(hs.callback, hs.scope, [result, e]);
+            }
+        }
+    }
+});
+Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;/**
+ * @class Ext.Resizable
+ * @extends Ext.util.Observable
+ * <p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element
+ * and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
+ * the textarea in a div and set 'resizeChild' to true (or to the id of the element), <b>or</b> set wrap:true in your config and
+ * the element will be wrapped for you automatically.</p>
+ * <p>Here is the list of valid resize handles:</p>
+ * <pre>
+Value   Description
+------  -------------------
+ 'n'     north
+ 's'     south
+ 'e'     east
+ 'w'     west
+ 'nw'    northwest
+ 'sw'    southwest
+ 'se'    southeast
+ 'ne'    northeast
+ 'all'   all
+</pre>
+ * <p>Here's an example showing the creation of a typical Resizable:</p>
+ * <pre><code>
+var resizer = new Ext.Resizable('element-id', {
+    handles: 'all',
+    minWidth: 200,
+    minHeight: 100,
+    maxWidth: 500,
+    maxHeight: 400,
+    pinned: true
+});
+resizer.on('resize', myHandler);
+</code></pre>
+ * <p>To hide a particular handle, set its display to none in CSS, or through script:<br>
+ * resizer.east.setDisplayed(false);</p>
+ * @constructor
+ * Create a new resizable component
+ * @param {Mixed} el The id or element to resize
+ * @param {Object} config configuration options
+  */
+Ext.Resizable = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        this.el = Ext.get(el);
+        if(config && config.wrap){
+            config.resizeChild = this.el;
+            this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : {cls:'xresizable-wrap'});
+            this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
+            this.el.setStyle('overflow', 'hidden');
+            this.el.setPositioning(config.resizeChild.getPositioning());
+            config.resizeChild.clearPositioning();
+            if(!config.width || !config.height){
+                var csize = config.resizeChild.getSize();
+                this.el.setSize(csize.width, csize.height);
+            }
+            if(config.pinned && !config.adjustments){
+                config.adjustments = 'auto';
+            }
+        }
+
+        /**
+         * The proxy Element that is resized in place of the real Element during the resize operation.
+         * This may be queried using {@link Ext.Element#getBox} to provide the new area to resize to.
+         * Read only.
+         * @type Ext.Element.
+         * @property proxy
+         */
+        this.proxy = this.el.createProxy({tag: 'div', cls: 'x-resizable-proxy', id: this.el.id + '-rzproxy'}, Ext.getBody());
+        this.proxy.unselectable();
+        this.proxy.enableDisplayMode('block');
+
+        Ext.apply(this, config);
+
+        if(this.pinned){
+            this.disableTrackOver = true;
+            this.el.addClass('x-resizable-pinned');
+        }
+        // if the element isn't positioned, make it relative
+        var position = this.el.getStyle('position');
+        if(position != 'absolute' && position != 'fixed'){
+            this.el.setStyle('position', 'relative');
+        }
+        if(!this.handles){ // no handles passed, must be legacy style
+            this.handles = 's,e,se';
+            if(this.multiDirectional){
+                this.handles += ',n,w';
+            }
+        }
+        if(this.handles == 'all'){
+            this.handles = 'n s e w ne nw se sw';
+        }
+        var hs = this.handles.split(/\s*?[,;]\s*?| /);
+        var ps = Ext.Resizable.positions;
+        for(var i = 0, len = hs.length; i < len; i++){
+            if(hs[i] && ps[hs[i]]){
+                var pos = ps[hs[i]];
+                this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent, this.handleCls);
+            }
+        }
+        // legacy
+        this.corner = this.southeast;
+
+        if(this.handles.indexOf('n') != -1 || this.handles.indexOf('w') != -1){
+            this.updateBox = true;
+        }
+
+        this.activeHandle = null;
+
+        if(this.resizeChild){
+            if(typeof this.resizeChild == 'boolean'){
+                this.resizeChild = Ext.get(this.el.dom.firstChild, true);
+            }else{
+                this.resizeChild = Ext.get(this.resizeChild, true);
+            }
+        }
+
+        if(this.adjustments == 'auto'){
+            var rc = this.resizeChild;
+            var hw = this.west, he = this.east, hn = this.north, hs = this.south;
+            if(rc && (hw || hn)){
+                rc.position('relative');
+                rc.setLeft(hw ? hw.el.getWidth() : 0);
+                rc.setTop(hn ? hn.el.getHeight() : 0);
+            }
+            this.adjustments = [
+                (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
+                (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1
+            ];
+        }
+
+        if(this.draggable){
+            this.dd = this.dynamic ?
+                this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
+            this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
+            if(this.constrainTo){
+                this.dd.constrainTo(this.constrainTo);
+            }
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeresize
+             * Fired before resize is allowed. Set {@link #enabled} to false to cancel resize.
+             * @param {Ext.Resizable} this
+             * @param {Ext.EventObject} e The mousedown event
+             */
+            'beforeresize',
+            /**
+             * @event resize
+             * Fired after a resize.
+             * @param {Ext.Resizable} this
+             * @param {Number} width The new width
+             * @param {Number} height The new height
+             * @param {Ext.EventObject} e The mouseup event
+             */
+            'resize'
+        );
+
+        if(this.width !== null && this.height !== null){
+            this.resizeTo(this.width, this.height);
+        }else{
+            this.updateChildSize();
+        }
+        if(Ext.isIE){
+            this.el.dom.style.zoom = 1;
+        }
+        Ext.Resizable.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Array/String} adjustments String 'auto' or an array [width, height] with values to be <b>added</b> to the
+     * resize operation's new size (defaults to <tt>[0, 0]</tt>)
+     */
+    adjustments : [0, 0],
+    /**
+     * @cfg {Boolean} animate True to animate the resize (not compatible with dynamic sizing, defaults to false)
+     */
+    animate : false,
+    /**
+     * @cfg {Mixed} constrainTo Constrain the resize to a particular element
+     */
+    /**
+     * @cfg {Boolean} disableTrackOver True to disable mouse tracking. This is only applied at config time. (defaults to false)
+     */
+    disableTrackOver : false,
+    /**
+     * @cfg {Boolean} draggable Convenience to initialize drag drop (defaults to false)
+     */
+    draggable: false,
+    /**
+     * @cfg {Number} duration Animation duration if animate = true (defaults to 0.35)
+     */
+    duration : 0.35,
+    /**
+     * @cfg {Boolean} dynamic True to resize the element while dragging instead of using a proxy (defaults to false)
+     */
+    dynamic : false,
+    /**
+     * @cfg {String} easing Animation easing if animate = true (defaults to <tt>'easingOutStrong'</tt>)
+     */
+    easing : 'easeOutStrong',
+    /**
+     * @cfg {Boolean} enabled False to disable resizing (defaults to true)
+     */
+    enabled : true,
+    /**
+     * @property enabled Writable. False if resizing is disabled.
+     * @type Boolean
+     */
+    /**
+     * @cfg {String} handles String consisting of the resize handles to display (defaults to undefined).
+     * Specify either <tt>'all'</tt> or any of <tt>'n s e w ne nw se sw'</tt>.
+     */
+    handles : false,
+    /**
+     * @cfg {Boolean} multiDirectional <b>Deprecated</b>.  Deprecated style of adding multi-direction resize handles.
+     */
+    multiDirectional : false,
+    /**
+     * @cfg {Number} height The height of the element in pixels (defaults to null)
+     */
+    height : null,
+    /**
+     * @cfg {Number} width The width of the element in pixels (defaults to null)
+     */
+    width : null,
+    /**
+     * @cfg {Number} heightIncrement The increment to snap the height resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    heightIncrement : 0,
+    /**
+     * @cfg {Number} widthIncrement The increment to snap the width resize in pixels
+     * (only applies if <code>{@link #dynamic}==true</code>). Defaults to <tt>0</tt>.
+     */
+    widthIncrement : 0,
+    /**
+     * @cfg {Number} minHeight The minimum height for the element (defaults to 5)
+     */
+    minHeight : 5,
+    /**
+     * @cfg {Number} minWidth The minimum width for the element (defaults to 5)
+     */
+    minWidth : 5,
+    /**
+     * @cfg {Number} maxHeight The maximum height for the element (defaults to 10000)
+     */
+    maxHeight : 10000,
+    /**
+     * @cfg {Number} maxWidth The maximum width for the element (defaults to 10000)
+     */
+    maxWidth : 10000,
+    /**
+     * @cfg {Number} minX The minimum x for the element (defaults to 0)
+     */
+    minX: 0,
+    /**
+     * @cfg {Number} minY The minimum x for the element (defaults to 0)
+     */
+    minY: 0,
+    /**
+     * @cfg {Boolean} pinned True to ensure that the resize handles are always visible, false to display them only when the
+     * user mouses over the resizable borders. This is only applied at config time. (defaults to false)
+     */
+    pinned : false,
+    /**
+     * @cfg {Boolean} preserveRatio True to preserve the original ratio between height
+     * and width during resize (defaults to false)
+     */
+    preserveRatio : false,
+    /**
+     * @cfg {Boolean/String/Element} resizeChild True to resize the first child, or id/element to resize (defaults to false)
+     */
+    resizeChild : false,
+    /**
+     * @cfg {Boolean} transparent True for transparent handles. This is only applied at config time. (defaults to false)
+     */
+    transparent: false,
+    /**
+     * @cfg {Ext.lib.Region} resizeRegion Constrain the resize to a particular region
+     */
+    /**
+     * @cfg {Boolean} wrap True to wrap an element with a div if needed (required for textareas and images, defaults to false)
+     * in favor of the handles config option (defaults to false)
+     */
+    /**
+     * @cfg {String} handleCls A css class to add to each handle. Defaults to <tt>''</tt>.
+     */
+
+
+    /**
+     * Perform a manual resize and fires the 'resize' event.
+     * @param {Number} width
+     * @param {Number} height
+     */
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.updateChildSize();
+        this.fireEvent('resize', this, width, height, null);
+    },
+
+    // private
+    startSizing : function(e, handle){
+        this.fireEvent('beforeresize', this, e);
+        if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler
+
+            if(!this.overlay){
+                this.overlay = this.el.createProxy({tag: 'div', cls: 'x-resizable-overlay', html: '&#160;'}, Ext.getBody());
+                this.overlay.unselectable();
+                this.overlay.enableDisplayMode('block');
+                this.overlay.on({
+                    scope: this,
+                    mousemove: this.onMouseMove,
+                    mouseup: this.onMouseUp
+                });
+            }
+            this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
+
+            this.resizing = true;
+            this.startBox = this.el.getBox();
+            this.startPoint = e.getXY();
+            this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
+                            (this.startBox.y + this.startBox.height) - this.startPoint[1]];
+
+            this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.overlay.show();
+
+            if(this.constrainTo) {
+                var ct = Ext.get(this.constrainTo);
+                this.resizeRegion = ct.getRegion().adjust(
+                    ct.getFrameWidth('t'),
+                    ct.getFrameWidth('l'),
+                    -ct.getFrameWidth('b'),
+                    -ct.getFrameWidth('r')
+                );
+            }
+
+            this.proxy.setStyle('visibility', 'hidden'); // workaround display none
+            this.proxy.show();
+            this.proxy.setBox(this.startBox);
+            if(!this.dynamic){
+                this.proxy.setStyle('visibility', 'visible');
+            }
+        }
+    },
+
+    // private
+    onMouseDown : function(handle, e){
+        if(this.enabled){
+            e.stopEvent();
+            this.activeHandle = handle;
+            this.startSizing(e, handle);
+        }
+    },
+
+    // private
+    onMouseUp : function(e){
+        this.activeHandle = null;
+        var size = this.resizeElement();
+        this.resizing = false;
+        this.handleOut();
+        this.overlay.hide();
+        this.proxy.hide();
+        this.fireEvent('resize', this, size.width, size.height, e);
+    },
+
+    // private
+    updateChildSize : function(){
+        if(this.resizeChild){
+            var el = this.el;
+            var child = this.resizeChild;
+            var adj = this.adjustments;
+            if(el.dom.offsetWidth){
+                var b = el.getSize(true);
+                child.setSize(b.width+adj[0], b.height+adj[1]);
+            }
+            // Second call here for IE
+            // The first call enables instant resizing and
+            // the second call corrects scroll bars if they
+            // exist
+            if(Ext.isIE){
+                setTimeout(function(){
+                    if(el.dom.offsetWidth){
+                        var b = el.getSize(true);
+                        child.setSize(b.width+adj[0], b.height+adj[1]);
+                    }
+                }, 10);
+            }
+        }
+    },
+
+    // private
+    snap : function(value, inc, min){
+        if(!inc || !value){
+            return value;
+        }
+        var newValue = value;
+        var m = value % inc;
+        if(m > 0){
+            if(m > (inc/2)){
+                newValue = value + (inc-m);
+            }else{
+                newValue = value - m;
+            }
+        }
+        return Math.max(min, newValue);
+    },
+
+    /**
+     * <p>Performs resizing of the associated Element. This method is called internally by this
+     * class, and should not be called by user code.</p>
+     * <p>If a Resizable is being used to resize an Element which encapsulates a more complex UI
+     * component such as a Panel, this method may be overridden by specifying an implementation
+     * as a config option to provide appropriate behaviour at the end of the resize operation on
+     * mouseup, for example resizing the Panel, and relaying the Panel's content.</p>
+     * <p>The new area to be resized to is available by examining the state of the {@link #proxy}
+     * Element. Example:
+<pre><code>
+new Ext.Panel({
+    title: 'Resize me',
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    listeners: {
+        render: function(p) {
+            new Ext.Resizable(p.getEl(), {
+                handles: 'all',
+                pinned: true,
+                transparent: true,
+                resizeElement: function() {
+                    var box = this.proxy.getBox();
+                    p.updateBox(box);
+                    if (p.layout) {
+                        p.doLayout();
+                    }
+                    return box;
+                }
+           });
+       }
+    }
+}).show();
+</code></pre>
+     */
+    resizeElement : function(){
+        var box = this.proxy.getBox();
+        if(this.updateBox){
+            this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
+        }else{
+            this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
+        }
+        this.updateChildSize();
+        if(!this.dynamic){
+            this.proxy.hide();
+        }
+        if(this.draggable && this.constrainTo){
+            this.dd.resetConstraints();
+            this.dd.constrainTo(this.constrainTo);
+        }
+        return box;
+    },
+
+    // private
+    constrain : function(v, diff, m, mx){
+        if(v - diff < m){
+            diff = v - m;
+        }else if(v - diff > mx){
+            diff = v - mx;
+        }
+        return diff;
+    },
+
+    // private
+    onMouseMove : function(e){
+        if(this.enabled && this.activeHandle){
+            try{// try catch so if something goes wrong the user doesn't get hung
+
+            if(this.resizeRegion && !this.resizeRegion.contains(e.getPoint())) {
+                return;
+            }
+
+            //var curXY = this.startPoint;
+            var curSize = this.curSize || this.startBox,
+                x = this.startBox.x, y = this.startBox.y,
+                ox = x,
+                oy = y,
+                w = curSize.width,
+                h = curSize.height,
+                ow = w,
+                oh = h,
+                mw = this.minWidth,
+                mh = this.minHeight,
+                mxw = this.maxWidth,
+                mxh = this.maxHeight,
+                wi = this.widthIncrement,
+                hi = this.heightIncrement,
+                eventXY = e.getXY(),
+                diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0])),
+                diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1])),
+                pos = this.activeHandle.position,
+                tw,
+                th;
+
+            switch(pos){
+                case 'east':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    break;
+                case 'south':
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'southeast':
+                    w += diffX;
+                    h += diffY;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'north':
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'west':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+                case 'northeast':
+                    w += diffX;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'northwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    x += diffX;
+                    w -= diffX;
+                    break;
+               case 'southwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+            }
+
+            var sw = this.snap(w, wi, mw);
+            var sh = this.snap(h, hi, mh);
+            if(sw != w || sh != h){
+                switch(pos){
+                    case 'northeast':
+                        y -= sh - h;
+                    break;
+                    case 'north':
+                        y -= sh - h;
+                        break;
+                    case 'southwest':
+                        x -= sw - w;
+                    break;
+                    case 'west':
+                        x -= sw - w;
+                        break;
+                    case 'northwest':
+                        x -= sw - w;
+                        y -= sh - h;
+                    break;
+                }
+                w = sw;
+                h = sh;
+            }
+
+            if(this.preserveRatio){
+                switch(pos){
+                    case 'southeast':
+                    case 'east':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                       break;
+                    case 'south':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        break;
+                    case 'northeast':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                    break;
+                    case 'north':
+                        tw = w;
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        x += (tw - w) / 2;
+                        break;
+                    case 'southwest':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                        break;
+                    case 'west':
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        y += (th - h) / 2;
+                        tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                       break;
+                    case 'northwest':
+                        tw = w;
+                        th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                        y += th - h;
+                        x += tw - w;
+                        break;
+
+                }
+            }
+            this.proxy.setBounds(x, y, w, h);
+            if(this.dynamic){
+                this.resizeElement();
+            }
+            }catch(ex){}
+        }
+    },
+
+    // private
+    handleOver : function(){
+        if(this.enabled){
+            this.el.addClass('x-resizable-over');
+        }
+    },
+
+    // private
+    handleOut : function(){
+        if(!this.resizing){
+            this.el.removeClass('x-resizable-over');
+        }
+    },
+
+    /**
+     * Returns the element this component is bound to.
+     * @return {Ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+
+    /**
+     * Returns the resizeChild element (or null).
+     * @return {Ext.Element}
+     */
+    getResizeChild : function(){
+        return this.resizeChild;
+    },
+
+    /**
+     * Destroys this resizable. If the element was wrapped and
+     * removeEl is not true then the element remains.
+     * @param {Boolean} removeEl (optional) true to remove the element from the DOM
+     */
+    destroy : function(removeEl){
+        Ext.destroy(this.dd, this.overlay, this.proxy);
+        this.overlay = null;
+        this.proxy = null;
+
+        var ps = Ext.Resizable.positions;
+        for(var k in ps){
+            if(typeof ps[k] != 'function' && this[ps[k]]){
+                this[ps[k]].destroy();
+            }
+        }
+        if(removeEl){
+            this.el.update('');
+            Ext.destroy(this.el);
+            this.el = null;
+        }
+        this.purgeListeners();
+    },
+
+    syncHandleHeight : function(){
+        var h = this.el.getHeight(true);
+        if(this.west){
+            this.west.el.setHeight(h);
+        }
+        if(this.east){
+            this.east.el.setHeight(h);
+        }
+    }
+});
+
+// private
+// hash to map config positions to true positions
+Ext.Resizable.positions = {
+    n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast'
+};
+
+Ext.Resizable.Handle = Ext.extend(Object, {
+    constructor : function(rz, pos, disableTrackOver, transparent, cls){
+       if(!this.tpl){
+            // only initialize the template if resizable is used
+            var tpl = Ext.DomHelper.createTemplate(
+                {tag: 'div', cls: 'x-resizable-handle x-resizable-handle-{0}'}
+            );
+            tpl.compile();
+            Ext.Resizable.Handle.prototype.tpl = tpl;
+        }
+        this.position = pos;
+        this.rz = rz;
+        this.el = this.tpl.append(rz.el.dom, [this.position], true);
+        this.el.unselectable();
+        if(transparent){
+            this.el.setOpacity(0);
+        }
+        if(!Ext.isEmpty(cls)){
+            this.el.addClass(cls);
+        }
+        this.el.on('mousedown', this.onMouseDown, this);
+        if(!disableTrackOver){
+            this.el.on({
+                scope: this,
+                mouseover: this.onMouseOver,
+                mouseout: this.onMouseOut
+            });
+        }
+    },
+
+    // private
+    afterResize : function(rz){
+        // do nothing
+    },
+    // private
+    onMouseDown : function(e){
+        this.rz.onMouseDown(this, e);
+    },
+    // private
+    onMouseOver : function(e){
+        this.rz.handleOver(this, e);
+    },
+    // private
+    onMouseOut : function(e){
+        this.rz.handleOut(this, e);
+    },
+    // private
+    destroy : function(){
+        Ext.destroy(this.el);
+        this.el = null;
+    }
+});
+/**
+ * @class Ext.Window
+ * @extends Ext.Panel
+ * <p>A specialized panel intended for use as an application window.  Windows are floated, {@link #resizable}, and
+ * {@link #draggable} by default.  Windows can be {@link #maximizable maximized} to fill the viewport,
+ * restored to their prior size, and can be {@link #minimize}d.</p>
+ * <p>Windows can also be linked to a {@link Ext.WindowGroup} or managed by the {@link Ext.WindowMgr} to provide
+ * grouping, activation, to front, to back and other application-specific behavior.</p>
+ * <p>By default, Windows will be rendered to document.body. To {@link #constrain} a Window to another element
+ * specify {@link Ext.Component#renderTo renderTo}.</p>
+ * <p><b>Note:</b> By default, the <code>{@link #closable close}</code> header tool <i>destroys</i> the Window resulting in
+ * destruction of any child Components. This makes the Window object, and all its descendants <b>unusable</b>. To enable
+ * re-use of a Window, use <b><code>{@link #closeAction closeAction: 'hide'}</code></b>.</p>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype window
+ */
+Ext.Window = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} x
+     * The X position of the left edge of the window on initial showing. Defaults to centering the Window within
+     * the width of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Number} y
+     * The Y position of the top edge of the window on initial showing. Defaults to centering the Window within
+     * the height of the Window's container {@link Ext.Element Element) (The Element that the Window is rendered to).
+     */
+    /**
+     * @cfg {Boolean} modal
+     * True to make the window modal and mask everything behind it when displayed, false to display it without
+     * restricting access to other UI elements (defaults to false).
+     */
+    /**
+     * @cfg {String/Element} animateTarget
+     * Id or element from which the window should animate while opening (defaults to null with no animation).
+     */
+    /**
+     * @cfg {String} resizeHandles
+     * A valid {@link Ext.Resizable} handles config string (defaults to 'all').  Only applies when resizable = true.
+     */
+    /**
+     * @cfg {Ext.WindowGroup} manager
+     * A reference to the WindowGroup that should manage this window (defaults to {@link Ext.WindowMgr}).
+     */
+    /**
+    * @cfg {String/Number/Component} defaultButton
+    * <p>Specifies a Component to receive focus when this Window is focussed.</p>
+    * <p>This may be one of:</p><div class="mdetail-params"><ul>
+    * <li>The index of a footer Button.</li>
+    * <li>The id of a Component.</li>
+    * <li>A Component.</li>
+    * </ul></div>
+    */
+    /**
+    * @cfg {Function} onEsc
+    * Allows override of the built-in processing for the escape key. Default action
+    * is to close the Window (performing whatever action is specified in {@link #closeAction}.
+    * To prevent the Window closing when the escape key is pressed, specify this as
+    * Ext.emptyFn (See {@link Ext#emptyFn}).
+    */
+    /**
+     * @cfg {Boolean} collapsed
+     * True to render the window collapsed, false to render it expanded (defaults to false). Note that if
+     * {@link #expandOnShow} is true (the default) it will override the <tt>collapsed</tt> config and the window
+     * will always be expanded when shown.
+     */
+    /**
+     * @cfg {Boolean} maximized
+     * True to initially display the window in a maximized state. (Defaults to false).
+     */
+
+    /**
+    * @cfg {String} baseCls
+    * The base CSS class to apply to this panel's element (defaults to 'x-window').
+    */
+    baseCls : 'x-window',
+    /**
+     * @cfg {Boolean} resizable
+     * True to allow user resizing at each edge and corner of the window, false to disable resizing (defaults to true).
+     */
+    resizable : true,
+    /**
+     * @cfg {Boolean} draggable
+     * True to allow the window to be dragged by the header bar, false to disable dragging (defaults to true).  Note
+     * that by default the window will be centered in the viewport, so if dragging is disabled the window may need
+     * to be positioned programmatically after render (e.g., myWindow.setPosition(100, 100);).
+     */
+    draggable : true,
+    /**
+     * @cfg {Boolean} closable
+     * <p>True to display the 'close' tool button and allow the user to close the window, false to
+     * hide the button and disallow closing the window (defaults to true).</p>
+     * <p>By default, when close is requested by either clicking the close button in the header
+     * or pressing ESC when the Window has focus, the {@link #close} method will be called. This
+     * will <i>{@link Ext.Component#destroy destroy}</i> the Window and its content meaning that
+     * it may not be reused.</p>
+     * <p>To make closing a Window <i>hide</i> the Window so that it may be reused, set
+     * {@link #closeAction} to 'hide'.
+     */
+    closable : true,
+    /**
+     * @cfg {String} closeAction
+     * <p>The action to take when the close header tool is clicked:
+     * <div class="mdetail-params"><ul>
+     * <li><b><code>'{@link #close}'</code></b> : <b>Default</b><div class="sub-desc">
+     * {@link #close remove} the window from the DOM and {@link Ext.Component#destroy destroy}
+     * it and all descendant Components. The window will <b>not</b> be available to be
+     * redisplayed via the {@link #show} method.
+     * </div></li>
+     * <li><b><code>'{@link #hide}'</code></b> : <div class="sub-desc">
+     * {@link #hide} the window by setting visibility to hidden and applying negative offsets.
+     * The window will be available to be redisplayed via the {@link #show} method.
+     * </div></li>
+     * </ul></div>
+     * <p><b>Note:</b> This setting does not affect the {@link #close} method
+     * which will always {@link Ext.Component#destroy destroy} the window. To
+     * programatically <i>hide</i> a window, call {@link #hide}.</p>
+     */
+    closeAction : 'close',
+    /**
+     * @cfg {Boolean} constrain
+     * True to constrain the window within its containing element, false to allow it to fall outside of its
+     * containing element. By default the window will be rendered to document.body.  To render and constrain the
+     * window within another element specify {@link #renderTo}.
+     * (defaults to false).  Optionally the header only can be constrained using {@link #constrainHeader}.
+     */
+    constrain : false,
+    /**
+     * @cfg {Boolean} constrainHeader
+     * True to constrain the window header within its containing element (allowing the window body to fall outside
+     * of its containing element) or false to allow the header to fall outside its containing element (defaults to
+     * false). Optionally the entire window can be constrained using {@link #constrain}.
+     */
+    constrainHeader : false,
+    /**
+     * @cfg {Boolean} plain
+     * True to render the window body with a transparent background so that it will blend into the framing
+     * elements, false to add a lighter background color to visually highlight the body element and separate it
+     * more distinctly from the surrounding frame (defaults to false).
+     */
+    plain : false,
+    /**
+     * @cfg {Boolean} minimizable
+     * True to display the 'minimize' tool button and allow the user to minimize the window, false to hide the button
+     * and disallow minimizing the window (defaults to false).  Note that this button provides no implementation --
+     * the behavior of minimizing a window is implementation-specific, so the minimize event must be handled and a
+     * custom minimize behavior implemented for this option to be useful.
+     */
+    minimizable : false,
+    /**
+     * @cfg {Boolean} maximizable
+     * True to display the 'maximize' tool button and allow the user to maximize the window, false to hide the button
+     * and disallow maximizing the window (defaults to false).  Note that when a window is maximized, the tool button
+     * will automatically change to a 'restore' button with the appropriate behavior already built-in that will
+     * restore the window to its previous size.
+     */
+    maximizable : false,
+    /**
+     * @cfg {Number} minHeight
+     * The minimum height in pixels allowed for this window (defaults to 100).  Only applies when resizable = true.
+     */
+    minHeight : 100,
+    /**
+     * @cfg {Number} minWidth
+     * The minimum width in pixels allowed for this window (defaults to 200).  Only applies when resizable = true.
+     */
+    minWidth : 200,
+    /**
+     * @cfg {Boolean} expandOnShow
+     * True to always expand the window when it is displayed, false to keep it in its current state (which may be
+     * {@link #collapsed}) when displayed (defaults to true).
+     */
+    expandOnShow : true,
+    
+    /**
+     * @cfg {Number} showAnimDuration The number of seconds that the window show animation takes if enabled.
+     * Defaults to 0.25
+     */
+    showAnimDuration: 0.25,
+    
+    /**
+     * @cfg {Number} hideAnimDuration The number of seconds that the window hide animation takes if enabled.
+     * Defaults to 0.25
+     */
+    hideAnimDuration: 0.25,
+
+    // inherited docs, same default
+    collapsible : false,
+
+    /**
+     * @cfg {Boolean} initHidden
+     * True to hide the window until show() is explicitly called (defaults to true).
+     * @deprecated
+     */
+    initHidden : undefined,
+
+    /**
+     * @cfg {Boolean} hidden
+     * Render this component hidden (default is <tt>true</tt>). If <tt>true</tt>, the
+     * {@link #hide} method will be called internally.
+     */
+    hidden : true,
+
+    // The following configs are set to provide the basic functionality of a window.
+    // Changing them would require additional code to handle correctly and should
+    // usually only be done in subclasses that can provide custom behavior.  Changing them
+    // may have unexpected or undesirable results.
+    /** @cfg {String} elements @hide */
+    elements : 'header,body',
+    /** @cfg {Boolean} frame @hide */
+    frame : true,
+    /** @cfg {Boolean} floating @hide */
+    floating : true,
+
+    // private
+    initComponent : function(){
+        this.initTools();
+        Ext.Window.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event activate
+             * Fires after the window has been visually activated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event deactivate
+             * Fires after the window has been visually deactivated via {@link #setActive}.
+             * @param {Ext.Window} this
+             */
+            /**
+             * @event resize
+             * Fires after the window has been resized.
+             * @param {Ext.Window} this
+             * @param {Number} width The window's new width
+             * @param {Number} height The window's new height
+             */
+            'resize',
+            /**
+             * @event maximize
+             * Fires after the window has been maximized.
+             * @param {Ext.Window} this
+             */
+            'maximize',
+            /**
+             * @event minimize
+             * Fires after the window has been minimized.
+             * @param {Ext.Window} this
+             */
+            'minimize',
+            /**
+             * @event restore
+             * Fires after the window has been restored to its original size after being maximized.
+             * @param {Ext.Window} this
+             */
+            'restore'
+        );
+        // for backwards compat, this should be removed at some point
+        if(Ext.isDefined(this.initHidden)){
+            this.hidden = this.initHidden;
+        }
+        if(this.hidden === false){
+            this.hidden = true;
+            this.show();
+        }
+    },
+
+    // private
+    getState : function(){
+        return Ext.apply(Ext.Window.superclass.getState.call(this) || {}, this.getBox(true));
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.Window.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            this.el.addClass('x-window-plain');
+        }
+
+        // this element allows the Window to be focused for keyboard events
+        this.focusEl = this.el.createChild({
+                    tag: 'a', href:'#', cls:'x-dlg-focus',
+                    tabIndex:'-1', html: '&#160;'});
+        this.focusEl.swallowEvent('click', true);
+
+        this.proxy = this.el.createProxy('x-window-proxy');
+        this.proxy.enableDisplayMode('block');
+
+        if(this.modal){
+            this.mask = this.container.createChild({cls:'ext-el-mask'}, this.el.dom);
+            this.mask.enableDisplayMode('block');
+            this.mask.hide();
+            this.mon(this.mask, 'click', this.focus, this);
+        }
+        if(this.maximizable){
+            this.mon(this.header, 'dblclick', this.toggleMaximize, this);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.Window.superclass.initEvents.call(this);
+        if(this.animateTarget){
+            this.setAnimateTarget(this.animateTarget);
+        }
+
+        if(this.resizable){
+            this.resizer = new Ext.Resizable(this.el, {
+                minWidth: this.minWidth,
+                minHeight:this.minHeight,
+                handles: this.resizeHandles || 'all',
+                pinned: true,
+                resizeElement : this.resizerAction,
+                handleCls: 'x-window-handle'
+            });
+            this.resizer.window = this;
+            this.mon(this.resizer, 'beforeresize', this.beforeResize, this);
+        }
+
+        if(this.draggable){
+            this.header.addClass('x-window-draggable');
+        }
+        this.mon(this.el, 'mousedown', this.toFront, this);
+        this.manager = this.manager || Ext.WindowMgr;
+        this.manager.register(this);
+        if(this.maximized){
+            this.maximized = false;
+            this.maximize();
+        }
+        if(this.closable){
+            var km = this.getKeyMap();
+            km.on(27, this.onEsc, this);
+            km.disable();
+        }
+    },
+
+    initDraggable : function(){
+        /**
+         * <p>If this Window is configured {@link #draggable}, this property will contain
+         * an instance of {@link Ext.dd.DD} which handles dragging the Window's DOM Element.</p>
+         * <p>This has implementations of <code>startDrag</code>, <code>onDrag</code> and <code>endDrag</code>
+         * which perform the dragging action. If extra logic is needed at these points, use
+         * {@link Function#createInterceptor createInterceptor} or {@link Function#createSequence createSequence} to
+         * augment the existing implementations.</p>
+         * @type Ext.dd.DD
+         * @property dd
+         */
+        this.dd = new Ext.Window.DD(this);
+    },
+
+   // private
+    onEsc : function(k, e){
+        if (this.activeGhost) {
+            this.unghost();
+        }
+        e.stopEvent();
+        this[this.closeAction]();
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.hide();
+            this.clearAnchor();
+            Ext.destroy(
+                this.focusEl,
+                this.resizer,
+                this.dd,
+                this.proxy,
+                this.mask
+            );
+        }
+        Ext.Window.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.manager){
+            this.manager.unregister(this);
+        }
+        Ext.Window.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initTools : function(){
+        if(this.minimizable){
+            this.addTool({
+                id: 'minimize',
+                handler: this.minimize.createDelegate(this, [])
+            });
+        }
+        if(this.maximizable){
+            this.addTool({
+                id: 'maximize',
+                handler: this.maximize.createDelegate(this, [])
+            });
+            this.addTool({
+                id: 'restore',
+                handler: this.restore.createDelegate(this, []),
+                hidden:true
+            });
+        }
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction].createDelegate(this, [])
+            });
+        }
+    },
+
+    // private
+    resizerAction : function(){
+        var box = this.proxy.getBox();
+        this.proxy.hide();
+        this.window.handleResize(box);
+        return box;
+    },
+
+    // private
+    beforeResize : function(){
+        this.resizer.minHeight = Math.max(this.minHeight, this.getFrameHeight() + 40); // 40 is a magic minimum content size?
+        this.resizer.minWidth = Math.max(this.minWidth, this.getFrameWidth() + 40);
+        this.resizeBox = this.el.getBox();
+    },
+
+    // private
+    updateHandles : function(){
+        if(Ext.isIE && this.resizer){
+            this.resizer.syncHandleHeight();
+            this.el.repaint();
+        }
+    },
+
+    // private
+    handleResize : function(box){
+        var rz = this.resizeBox;
+        if(rz.x != box.x || rz.y != box.y){
+            this.updateBox(box);
+        }else{
+            this.setSize(box);
+            if (Ext.isIE6 && Ext.isStrict) {
+                this.doLayout();
+            }
+        }
+        this.focus();
+        this.updateHandles();
+        this.saveState();
+    },
+
+    /**
+     * Focuses the window.  If a defaultButton is set, it will receive focus, otherwise the
+     * window itself will receive focus.
+     */
+    focus : function(){
+        var f = this.focusEl,
+            db = this.defaultButton,
+            t = typeof db,
+            el,
+            ct;
+        if(Ext.isDefined(db)){
+            if(Ext.isNumber(db) && this.fbar){
+                f = this.fbar.items.get(db);
+            }else if(Ext.isString(db)){
+                f = Ext.getCmp(db);
+            }else{
+                f = db;
+            }
+            el = f.getEl();
+            ct = Ext.getDom(this.container);
+            if (el && ct) {
+                if (ct != document.body && !Ext.lib.Region.getRegion(ct).contains(Ext.lib.Region.getRegion(el.dom))){
+                    return;
+                }
+            }
+        }
+        f = f || this.focusEl;
+        f.focus.defer(10, f);
+    },
+
+    /**
+     * Sets the target element from which the window should animate while opening.
+     * @param {String/Element} el The target element or id
+     */
+    setAnimateTarget : function(el){
+        el = Ext.get(el);
+        this.animateTarget = el;
+    },
+
+    // private
+    beforeShow : function(){
+        delete this.el.lastXY;
+        delete this.el.lastLT;
+        if(this.x === undefined || this.y === undefined){
+            var xy = this.el.getAlignToXY(this.container, 'c-c');
+            var pos = this.el.translatePoints(xy[0], xy[1]);
+            this.x = this.x === undefined? pos.left : this.x;
+            this.y = this.y === undefined? pos.top : this.y;
+        }
+        this.el.setLeftTop(this.x, this.y);
+
+        if(this.expandOnShow){
+            this.expand(false);
+        }
+
+        if(this.modal){
+            Ext.getBody().addClass('x-body-masked');
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+            this.mask.show();
+        }
+    },
+
+    /**
+     * Shows the window, rendering it first if necessary, or activates it and brings it to front if hidden.
+     * @param {String/Element} animateTarget (optional) The target element or id from which the window should
+     * animate while opening (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is displayed
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    show : function(animateTarget, cb, scope){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        if(this.hidden === false){
+            this.toFront();
+            return this;
+        }
+        if(this.fireEvent('beforeshow', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('show', cb, scope, {single:true});
+        }
+        this.hidden = false;
+        if(Ext.isDefined(animateTarget)){
+            this.setAnimateTarget(animateTarget);
+        }
+        this.beforeShow();
+        if(this.animateTarget){
+            this.animShow();
+        }else{
+            this.afterShow();
+        }
+        return this;
+    },
+
+    // private
+    afterShow : function(isAnim){
+        if (this.isDestroyed){
+            return false;
+        }
+        this.proxy.hide();
+        this.el.setStyle('display', 'block');
+        this.el.show();
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+            this.cascade(this.setAutoScroll);
+        }
+
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.onWindowResize(this.onWindowResize, this);
+        }
+        this.doConstrain();
+        this.doLayout();
+        if(this.keyMap){
+            this.keyMap.enable();
+        }
+        this.toFront();
+        this.updateHandles();
+        if(isAnim && (Ext.isIE || Ext.isWebKit)){
+            var sz = this.getSize();
+            this.onResize(sz.width, sz.height);
+        }
+        this.onShow();
+        this.fireEvent('show', this);
+    },
+
+    // private
+    animShow : function(){
+        this.proxy.show();
+        this.proxy.setBox(this.animateTarget.getBox());
+        this.proxy.setOpacity(0);
+        var b = this.getBox();
+        this.el.setStyle('display', 'none');
+        this.proxy.shift(Ext.apply(b, {
+            callback: this.afterShow.createDelegate(this, [true], false),
+            scope: this,
+            easing: 'easeNone',
+            duration: this.showAnimDuration,
+            opacity: 0.5
+        }));
+    },
+
+    /**
+     * Hides the window, setting it to invisible and applying negative offsets.
+     * @param {String/Element} animateTarget (optional) The target element or id to which the window should
+     * animate while hiding (defaults to null with no animation)
+     * @param {Function} callback (optional) A callback function to call after the window is hidden
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Window.
+     * @return {Ext.Window} this
+     */
+    hide : function(animateTarget, cb, scope){
+        if(this.hidden || this.fireEvent('beforehide', this) === false){
+            return this;
+        }
+        if(cb){
+            this.on('hide', cb, scope, {single:true});
+        }
+        this.hidden = true;
+        if(animateTarget !== undefined){
+            this.setAnimateTarget(animateTarget);
+        }
+        if(this.modal){
+            this.mask.hide();
+            Ext.getBody().removeClass('x-body-masked');
+        }
+        if(this.animateTarget){
+            this.animHide();
+        }else{
+            this.el.hide();
+            this.afterHide();
+        }
+        return this;
+    },
+
+    // private
+    afterHide : function(){
+        this.proxy.hide();
+        if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){
+            Ext.EventManager.removeResizeListener(this.onWindowResize, this);
+        }
+        if(this.keyMap){
+            this.keyMap.disable();
+        }
+        this.onHide();
+        this.fireEvent('hide', this);
+    },
+
+    // private
+    animHide : function(){
+        this.proxy.setOpacity(0.5);
+        this.proxy.show();
+        var tb = this.getBox(false);
+        this.proxy.setBox(tb);
+        this.el.hide();
+        this.proxy.shift(Ext.apply(this.animateTarget.getBox(), {
+            callback: this.afterHide,
+            scope: this,
+            duration: this.hideAnimDuration,
+            easing: 'easeNone',
+            opacity: 0
+        }));
+    },
+
+    /**
+     * Method that is called immediately before the <code>show</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onShow : Ext.emptyFn,
+
+    /**
+     * Method that is called immediately before the <code>hide</code> event is fired.
+     * Defaults to <code>Ext.emptyFn</code>.
+     */
+    onHide : Ext.emptyFn,
+
+    // private
+    onWindowResize : function(){
+        if(this.maximized){
+            this.fitContainer();
+        }
+        if(this.modal){
+            this.mask.setSize('100%', '100%');
+            var force = this.mask.dom.offsetHeight;
+            this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
+        }
+        this.doConstrain();
+    },
+
+    // private
+    doConstrain : function(){
+        if(this.constrain || this.constrainHeader){
+            var offsets;
+            if(this.constrain){
+                offsets = {
+                    right:this.el.shadowOffset,
+                    left:this.el.shadowOffset,
+                    bottom:this.el.shadowOffset
+                };
+            }else {
+                var s = this.getSize();
+                offsets = {
+                    right:-(s.width - 100),
+                    bottom:-(s.height - 25 + this.el.getConstrainOffset())
+                };
+            }
+
+            var xy = this.el.getConstrainToXY(this.container, true, offsets);
+            if(xy){
+                this.setPosition(xy[0], xy[1]);
+            }
+        }
+    },
+
+    // private - used for dragging
+    ghost : function(cls){
+        var ghost = this.createGhost(cls);
+        var box = this.getBox(true);
+        ghost.setLeftTop(box.x, box.y);
+        ghost.setWidth(box.width);
+        this.el.hide();
+        this.activeGhost = ghost;
+        return ghost;
+    },
+
+    // private
+    unghost : function(show, matchPosition){
+        if(!this.activeGhost) {
+            return;
+        }
+        if(show !== false){
+            this.el.show();
+            this.focus.defer(10, this);
+            if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
+                this.cascade(this.setAutoScroll);
+            }
+        }
+        if(matchPosition !== false){
+            this.setPosition(this.activeGhost.getLeft(true), this.activeGhost.getTop(true));
+        }
+        this.activeGhost.hide();
+        this.activeGhost.remove();
+        delete this.activeGhost;
+    },
+
+    /**
+     * Placeholder method for minimizing the window.  By default, this method simply fires the {@link #minimize} event
+     * since the behavior of minimizing a window is application-specific.  To implement custom minimize behavior,
+     * either the minimize event can be handled or this method can be overridden.
+     * @return {Ext.Window} this
+     */
+    minimize : function(){
+        this.fireEvent('minimize', this);
+        return this;
+    },
+
+    /**
+     * <p>Closes the Window, removes it from the DOM, {@link Ext.Component#destroy destroy}s
+     * the Window object and all its descendant Components. The {@link Ext.Panel#beforeclose beforeclose}
+     * event is fired before the close happens and will cancel the close action if it returns false.<p>
+     * <p><b>Note:</b> This method is not affected by the {@link #closeAction} setting which
+     * only affects the action triggered when clicking the {@link #closable 'close' tool in the header}.
+     * To hide the Window without destroying it, call {@link #hide}.</p>
+     */
+    close : function(){
+        if(this.fireEvent('beforeclose', this) !== false){
+            if(this.hidden){
+                this.doClose();
+            }else{
+                this.hide(null, this.doClose, this);
+            }
+        }
+    },
+
+    // private
+    doClose : function(){
+        this.fireEvent('close', this);
+        this.destroy();
+    },
+
+    /**
+     * Fits the window within its current container and automatically replaces
+     * the {@link #maximizable 'maximize' tool button} with the 'restore' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    maximize : function(){
+        if(!this.maximized){
+            this.expand(false);
+            this.restoreSize = this.getSize();
+            this.restorePos = this.getPosition(true);
+            if (this.maximizable){
+                this.tools.maximize.hide();
+                this.tools.restore.show();
+            }
+            this.maximized = true;
+            this.el.disableShadow();
+
+            if(this.dd){
+                this.dd.lock();
+            }
+            if(this.collapsible){
+                this.tools.toggle.hide();
+            }
+            this.el.addClass('x-window-maximized');
+            this.container.addClass('x-window-maximized-ct');
+
+            this.setPosition(0, 0);
+            this.fitContainer();
+            this.fireEvent('maximize', this);
+        }
+        return this;
+    },
+
+    /**
+     * Restores a {@link #maximizable maximized}  window back to its original
+     * size and position prior to being maximized and also replaces
+     * the 'restore' tool button with the 'maximize' tool button.
+     * Also see {@link #toggleMaximize}.
+     * @return {Ext.Window} this
+     */
+    restore : function(){
+        if(this.maximized){
+            var t = this.tools;
+            this.el.removeClass('x-window-maximized');
+            if(t.restore){
+                t.restore.hide();
+            }
+            if(t.maximize){
+                t.maximize.show();
+            }
+            this.setPosition(this.restorePos[0], this.restorePos[1]);
+            this.setSize(this.restoreSize.width, this.restoreSize.height);
+            delete this.restorePos;
+            delete this.restoreSize;
+            this.maximized = false;
+            this.el.enableShadow(true);
+
+            if(this.dd){
+                this.dd.unlock();
+            }
+            if(this.collapsible && t.toggle){
+                t.toggle.show();
+            }
+            this.container.removeClass('x-window-maximized-ct');
+
+            this.doConstrain();
+            this.fireEvent('restore', this);
+        }
+        return this;
+    },
+
+    /**
+     * A shortcut method for toggling between {@link #maximize} and {@link #restore} based on the current maximized
+     * state of the window.
+     * @return {Ext.Window} this
+     */
+    toggleMaximize : function(){
+        return this[this.maximized ? 'restore' : 'maximize']();
+    },
+
+    // private
+    fitContainer : function(){
+        var vs = this.container.getViewSize(false);
+        this.setSize(vs.width, vs.height);
+    },
+
+    // private
+    // z-index is managed by the WindowManager and may be overwritten at any time
+    setZIndex : function(index){
+        if(this.modal){
+            this.mask.setStyle('z-index', index);
+        }
+        this.el.setZIndex(++index);
+        index += 5;
+
+        if(this.resizer){
+            this.resizer.proxy.setStyle('z-index', ++index);
+        }
+
+        this.lastZIndex = index;
+    },
+
+    /**
+     * Aligns the window to the specified element
+     * @param {Mixed} element The element to align to.
+     * @param {String} position (optional, defaults to "tl-bl?") The position to align to (see {@link Ext.Element#alignTo} for more details).
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @return {Ext.Window} this
+     */
+    alignTo : function(element, position, offsets){
+        var xy = this.el.getAlignToXY(element, position, offsets);
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    },
+
+    /**
+     * Anchors this window to another element and realigns it when the window is resized or scrolled.
+     * @param {Mixed} element The element to align to.
+     * @param {String} position The position to align to (see {@link Ext.Element#alignTo} for more details)
+     * @param {Array} offsets (optional) Offset the positioning by [x, y]
+     * @param {Boolean/Number} monitorScroll (optional) true to monitor body scroll and reposition. If this parameter
+     * is a number, it is used as the buffer delay (defaults to 50ms).
+     * @return {Ext.Window} this
+     */
+    anchorTo : function(el, alignment, offsets, monitorScroll){
+        this.clearAnchor();
+        this.anchorTarget = {
+            el: el,
+            alignment: alignment,
+            offsets: offsets
+        };
+
+        Ext.EventManager.onWindowResize(this.doAnchor, this);
+        var tm = typeof monitorScroll;
+        if(tm != 'undefined'){
+            Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
+                {buffer: tm == 'number' ? monitorScroll : 50});
+        }
+        return this.doAnchor();
+    },
+
+    /**
+     * Performs the anchor, using the saved anchorTarget property.
+     * @return {Ext.Window} this
+     * @private
+     */
+    doAnchor : function(){
+        var o = this.anchorTarget;
+        this.alignTo(o.el, o.alignment, o.offsets);
+        return this;
+    },
+
+    /**
+     * Removes any existing anchor from this window. See {@link #anchorTo}.
+     * @return {Ext.Window} this
+     */
+    clearAnchor : function(){
+        if(this.anchorTarget){
+            Ext.EventManager.removeResizeListener(this.doAnchor, this);
+            Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
+            delete this.anchorTarget;
+        }
+        return this;
+    },
+
+    /**
+     * Brings this window to the front of any other visible windows
+     * @param {Boolean} e (optional) Specify <tt>false</tt> to prevent the window from being focused.
+     * @return {Ext.Window} this
+     */
+    toFront : function(e){
+        if(this.manager.bringToFront(this)){
+            if(!e || !e.getTarget().focus){
+                this.focus();
+            }
+        }
+        return this;
+    },
+
+    /**
+     * Makes this the active window by showing its shadow, or deactivates it by hiding its shadow.  This method also
+     * fires the {@link #activate} or {@link #deactivate} event depending on which action occurred. This method is
+     * called internally by {@link Ext.WindowMgr}.
+     * @param {Boolean} active True to activate the window, false to deactivate it (defaults to false)
+     */
+    setActive : function(active){
+        if(active){
+            if(!this.maximized){
+                this.el.enableShadow(true);
+            }
+            this.fireEvent('activate', this);
+        }else{
+            this.el.disableShadow();
+            this.fireEvent('deactivate', this);
+        }
+    },
+
+    /**
+     * Sends this window to the back of (lower z-index than) any other visible windows
+     * @return {Ext.Window} this
+     */
+    toBack : function(){
+        this.manager.sendToBack(this);
+        return this;
+    },
+
+    /**
+     * Centers this window in the viewport
+     * @return {Ext.Window} this
+     */
+    center : function(){
+        var xy = this.el.getAlignToXY(this.container, 'c-c');
+        this.setPagePosition(xy[0], xy[1]);
+        return this;
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     **/
+});
+Ext.reg('window', Ext.Window);
+
+// private - custom Window DD implementation
+Ext.Window.DD = Ext.extend(Ext.dd.DD, {
+    
+    constructor : function(win){
+        this.win = win;
+        Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
+        this.setHandleElId(win.header.id);
+        this.scroll = false;        
+    },
+    
+    moveOnly:true,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        var w = this.win;
+        this.proxy = w.ghost(w.initialConfig.cls);
+        if(w.constrain !== false){
+            var so = w.el.shadowOffset;
+            this.constrainTo(w.container, {right: so, left: so, bottom: so});
+        }else if(w.constrainHeader !== false){
+            var s = this.proxy.getSize();
+            this.constrainTo(w.container, {right: -(s.width-this.headerOffsets[0]), bottom: -(s.height-this.headerOffsets[1])});
+        }
+    },
+    b4Drag : Ext.emptyFn,
+
+    onDrag : function(e){
+        this.alignElWithMouse(this.proxy, e.getPageX(), e.getPageY());
+    },
+
+    endDrag : function(e){
+        this.win.unghost();
+        this.win.saveState();
+    }
+});
+/**
+ * @class Ext.WindowGroup
+ * An object that manages a group of {@link Ext.Window} instances and provides z-order management
+ * and window activation behavior.
+ * @constructor
+ */
+Ext.WindowGroup = function(){
+    var list = {};
+    var accessList = [];
+    var front = null;
+
+    // private
+    var sortWindows = function(d1, d2){
+        return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;
+    };
+
+    // private
+    var orderWindows = function(){
+        var a = accessList, len = a.length;
+        if(len > 0){
+            a.sort(sortWindows);
+            var seed = a[0].manager.zseed;
+            for(var i = 0; i < len; i++){
+                var win = a[i];
+                if(win && !win.hidden){
+                    win.setZIndex(seed + (i*10));
+                }
+            }
+        }
+        activateLast();
+    };
+
+    // private
+    var setActiveWin = function(win){
+        if(win != front){
+            if(front){
+                front.setActive(false);
+            }
+            front = win;
+            if(win){
+                win.setActive(true);
+            }
+        }
+    };
+
+    // private
+    var activateLast = function(){
+        for(var i = accessList.length-1; i >=0; --i) {
+            if(!accessList[i].hidden){
+                setActiveWin(accessList[i]);
+                return;
+            }
+        }
+        // none to activate
+        setActiveWin(null);
+    };
+
+    return {
+        /**
+         * The starting z-index for windows in this WindowGroup (defaults to 9000)
+         * @type Number The z-index value
+         */
+        zseed : 9000,
+
+        /**
+         * <p>Registers a {@link Ext.Window Window} with this WindowManager. This should not
+         * need to be called under normal circumstances. Windows are automatically registered
+         * with a {@link Ext.Window#manager manager} at construction time.</p>
+         * <p>Where this may be useful is moving Windows between two WindowManagers. For example,
+         * to bring the Ext.MessageBox dialog under the same manager as the Desktop's
+         * WindowManager in the desktop sample app:</p><code><pre>
+var msgWin = Ext.MessageBox.getDialog();
+MyDesktop.getDesktop().getManager().register(msgWin);
+</pre></code>
+         * @param {Window} win The Window to register.
+         */
+        register : function(win){
+            if(win.manager){
+                win.manager.unregister(win);
+            }
+            win.manager = this;
+
+            list[win.id] = win;
+            accessList.push(win);
+            win.on('hide', activateLast);
+        },
+
+        /**
+         * <p>Unregisters a {@link Ext.Window Window} from this WindowManager. This should not
+         * need to be called. Windows are automatically unregistered upon destruction.
+         * See {@link #register}.</p>
+         * @param {Window} win The Window to unregister.
+         */
+        unregister : function(win){
+            delete win.manager;
+            delete list[win.id];
+            win.un('hide', activateLast);
+            accessList.remove(win);
+        },
+
+        /**
+         * Gets a registered window by id.
+         * @param {String/Object} id The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window}
+         */
+        get : function(id){
+            return typeof id == "object" ? id : list[id];
+        },
+
+        /**
+         * Brings the specified window to the front of any other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Boolean} True if the dialog was brought to the front, else false
+         * if it was already in front
+         */
+        bringToFront : function(win){
+            win = this.get(win);
+            if(win != front){
+                win._lastAccess = new Date().getTime();
+                orderWindows();
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Sends the specified window to the back of other active windows in this WindowGroup.
+         * @param {String/Object} win The id of the window or a {@link Ext.Window} instance
+         * @return {Ext.Window} The window
+         */
+        sendToBack : function(win){
+            win = this.get(win);
+            win._lastAccess = -(new Date().getTime());
+            orderWindows();
+            return win;
+        },
+
+        /**
+         * Hides all windows in this WindowGroup.
+         */
+        hideAll : function(){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function" && list[id].isVisible()){
+                    list[id].hide();
+                }
+            }
+        },
+
+        /**
+         * Gets the currently-active window in this WindowGroup.
+         * @return {Ext.Window} The active window
+         */
+        getActive : function(){
+            return front;
+        },
+
+        /**
+         * Returns zero or more windows in this WindowGroup using the custom search function passed to this method.
+         * The function should accept a single {@link Ext.Window} reference as its only argument and should
+         * return true if the window matches the search criteria, otherwise it should return false.
+         * @param {Function} fn The search function
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Window being tested.
+         * that gets passed to the function if not specified)
+         * @return {Array} An array of zero or more matching windows
+         */
+        getBy : function(fn, scope){
+            var r = [];
+            for(var i = accessList.length-1; i >=0; --i) {
+                var win = accessList[i];
+                if(fn.call(scope||win, win) !== false){
+                    r.push(win);
+                }
+            }
+            return r;
+        },
+
+        /**
+         * Executes the specified function once for every window in this WindowGroup, passing each
+         * window as the only parameter. Returning false from the function will stop the iteration.
+         * @param {Function} fn The function to execute for each item
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Window in the iteration.
+         */
+        each : function(fn, scope){
+            for(var id in list){
+                if(list[id] && typeof list[id] != "function"){
+                    if(fn.call(scope || list[id], list[id]) === false){
+                        return;
+                    }
+                }
+            }
+        }
+    };
+};
+
+
+/**
+ * @class Ext.WindowMgr
+ * @extends Ext.WindowGroup
+ * The default global window group that is available automatically.  To have more than one group of windows
+ * with separate z-order stacks, create additional instances of {@link Ext.WindowGroup} as needed.
+ * @singleton
+ */
+Ext.WindowMgr = new Ext.WindowGroup();/**
+ * @class Ext.MessageBox
+ * <p>Utility class for generating different styles of message boxes.  The alias Ext.Msg can also be used.<p/>
+ * <p>Note that the MessageBox is asynchronous.  Unlike a regular JavaScript <code>alert</code> (which will halt
+ * browser execution), showing a MessageBox will not cause the code to stop.  For this reason, if you have code
+ * that should only run <em>after</em> some user feedback from the MessageBox, you must use a callback function
+ * (see the <code>function</code> parameter for {@link #show} for more details).</p>
+ * <p>Example usage:</p>
+ *<pre><code>
+// Basic alert:
+Ext.Msg.alert('Status', 'Changes saved successfully.');
+
+// Prompt for user data and process the result using a callback:
+Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
+    if (btn == 'ok'){
+        // process text value and close...
+    }
+});
+
+// Show a dialog using config options:
+Ext.Msg.show({
+   title:'Save Changes?',
+   msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
+   buttons: Ext.Msg.YESNOCANCEL,
+   fn: processResult,
+   animEl: 'elId',
+   icon: Ext.MessageBox.QUESTION
+});
+</code></pre>
+ * @singleton
+ */
+Ext.MessageBox = function(){
+    var dlg, opt, mask, waitTimer,
+        bodyEl, msgEl, textboxEl, textareaEl, progressBar, pp, iconEl, spacerEl,
+        buttons, activeTextEl, bwidth, bufferIcon = '', iconCls = '',
+        buttonNames = ['ok', 'yes', 'no', 'cancel'];
+
+    // private
+    var handleButton = function(button){
+        buttons[button].blur();
+        if(dlg.isVisible()){
+            dlg.hide();
+            handleHide();
+            Ext.callback(opt.fn, opt.scope||window, [button, activeTextEl.dom.value, opt], 1);
+        }
+    };
+
+    // private
+    var handleHide = function(){
+        if(opt && opt.cls){
+            dlg.el.removeClass(opt.cls);
+        }
+        progressBar.reset();        
+    };
+
+    // private
+    var handleEsc = function(d, k, e){
+        if(opt && opt.closable !== false){
+            dlg.hide();
+            handleHide();
+        }
+        if(e){
+            e.stopEvent();
+        }
+    };
+
+    // private
+    var updateButtons = function(b){
+        var width = 0,
+            cfg;
+        if(!b){
+            Ext.each(buttonNames, function(name){
+                buttons[name].hide();
+            });
+            return width;
+        }
+        dlg.footer.dom.style.display = '';
+        Ext.iterate(buttons, function(name, btn){
+            cfg = b[name];
+            if(cfg){
+                btn.show();
+                btn.setText(Ext.isString(cfg) ? cfg : Ext.MessageBox.buttonText[name]);
+                width += btn.getEl().getWidth() + 15;
+            }else{
+                btn.hide();
+            }
+        });
+        return width;
+    };
+
+    return {
+        /**
+         * Returns a reference to the underlying {@link Ext.Window} element
+         * @return {Ext.Window} The window
+         */
+        getDialog : function(titleText){
+           if(!dlg){
+                var btns = [];
+                
+                buttons = {};
+                Ext.each(buttonNames, function(name){
+                    btns.push(buttons[name] = new Ext.Button({
+                        text: this.buttonText[name],
+                        handler: handleButton.createCallback(name),
+                        hideMode: 'offsets'
+                    }));
+                }, this);
+                dlg = new Ext.Window({
+                    autoCreate : true,
+                    title:titleText,
+                    resizable:false,
+                    constrain:true,
+                    constrainHeader:true,
+                    minimizable : false,
+                    maximizable : false,
+                    stateful: false,
+                    modal: true,
+                    shim:true,
+                    buttonAlign:"center",
+                    width:400,
+                    height:100,
+                    minHeight: 80,
+                    plain:true,
+                    footer:true,
+                    closable:true,
+                    close : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton("no");
+                        }else{
+                            handleButton("cancel");
+                        }
+                    },
+                    fbar: new Ext.Toolbar({
+                        items: btns,
+                        enableOverflow: false
+                    })
+                });
+                dlg.render(document.body);
+                dlg.getEl().addClass('x-window-dlg');
+                mask = dlg.mask;
+                bodyEl = dlg.body.createChild({
+                    html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'
+                });
+                iconEl = Ext.get(bodyEl.dom.firstChild);
+                var contentEl = bodyEl.dom.childNodes[1];
+                msgEl = Ext.get(contentEl.firstChild);
+                textboxEl = Ext.get(contentEl.childNodes[2].firstChild);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton("ok");
+                        }else if(opt.buttons.yes){
+                            handleButton("yes");
+                        }
+                    }
+                });
+                textareaEl = Ext.get(contentEl.childNodes[2].childNodes[1]);
+                textareaEl.enableDisplayMode();
+                progressBar = new Ext.ProgressBar({
+                    renderTo:bodyEl
+                });
+               bodyEl.createChild({cls:'x-clear'});
+            }
+            return dlg;
+        },
+
+        /**
+         * Updates the message box body text
+         * @param {String} text (optional) Replaces the message box element's innerHTML with the specified string (defaults to
+         * the XHTML-compliant non-breaking space character '&amp;#160;')
+         * @return {Ext.MessageBox} this
+         */
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.setSize(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            // Append a space here for sizing. In IE, for some reason, it wraps text incorrectly without one in some cases
+            msgEl.update(text ? text + ' ' : '&#160;');
+
+            var iw = iconCls != '' ? (iconEl.getWidth() + iconEl.getMargins('lr')) : 0,
+                mw = msgEl.getWidth() + msgEl.getMargins('lr'),
+                fw = dlg.getFrameWidth('lr'),
+                bw = dlg.body.getFrameWidth('lr'),
+                w;
+                
+            w = Math.max(Math.min(opt.width || iw+mw+fw+bw, opt.maxWidth || this.maxWidth),
+                    Math.max(opt.minWidth || this.minWidth, bwidth || 0));
+
+            if(opt.prompt === true){
+                activeTextEl.setWidth(w-iw-fw-bw);
+            }
+            if(opt.progress === true || opt.wait === true){
+                progressBar.setSize(w-iw-fw-bw);
+            }
+            if(Ext.isIE && w == bwidth){
+                w += 4; //Add offset when the content width is smaller than the buttons.    
+            }
+            msgEl.update(text || '&#160;');
+            dlg.setSize(w, 'auto').center();
+            return this;
+        },
+
+        /**
+         * Updates a progress-style message box's text and progress bar. Only relevant on message boxes
+         * initiated via {@link Ext.MessageBox#progress} or {@link Ext.MessageBox#wait},
+         * or by calling {@link Ext.MessageBox#show} with progress: true.
+         * @param {Number} value Any number between 0 and 1 (e.g., .5, defaults to 0)
+         * @param {String} progressText The progress text to display inside the progress bar (defaults to '')
+         * @param {String} msg The message box's body text is replaced with the specified string (defaults to undefined
+         * so that any existing body text will not get overwritten by default unless a new value is passed in)
+         * @return {Ext.MessageBox} this
+         */
+        updateProgress : function(value, progressText, msg){
+            progressBar.updateProgress(value, progressText);
+            if(msg){
+                this.updateText(msg);
+            }
+            return this;
+        },
+
+        /**
+         * Returns true if the message box is currently displayed
+         * @return {Boolean} True if the message box is visible, else false
+         */
+        isVisible : function(){
+            return dlg && dlg.isVisible();
+        },
+
+        /**
+         * Hides the message box if it is displayed
+         * @return {Ext.MessageBox} this
+         */
+        hide : function(){
+            var proxy = dlg ? dlg.activeGhost : null;
+            if(this.isVisible() || proxy){
+                dlg.hide();
+                handleHide();
+                if (proxy){
+                    // unghost is a private function, but i saw no better solution
+                    // to fix the locking problem when dragging while it closes
+                    dlg.unghost(false, false);
+                } 
+            }
+            return this;
+        },
+
+        /**
+         * Displays a new message box, or reinitializes an existing message box, based on the config options
+         * passed in. All display functions (e.g. prompt, alert, etc.) on MessageBox call this function internally,
+         * although those calls are basic shortcuts and do not support all of the config options allowed here.
+         * @param {Object} config The following config options are supported: <ul>
+         * <li><b>animEl</b> : String/Element<div class="sub-desc">An id or Element from which the message box should animate as it
+         * opens and closes (defaults to undefined)</div></li>
+         * <li><b>buttons</b> : Object/Boolean<div class="sub-desc">A button config object (e.g., Ext.MessageBox.OKCANCEL or {ok:'Foo',
+         * cancel:'Bar'}), or false to not show any buttons (defaults to false)</div></li>
+         * <li><b>closable</b> : Boolean<div class="sub-desc">False to hide the top-right close button (defaults to true). Note that
+         * progress and wait dialogs will ignore this property and always hide the close button as they can only
+         * be closed programmatically.</div></li>
+         * <li><b>cls</b> : String<div class="sub-desc">A custom CSS class to apply to the message box's container element</div></li>
+         * <li><b>defaultTextHeight</b> : Number<div class="sub-desc">The default height in pixels of the message box's multiline textarea
+         * if displayed (defaults to 75)</div></li>
+         * <li><b>fn</b> : Function<div class="sub-desc">A callback function which is called when the dialog is dismissed either
+         * by clicking on the configured buttons, or on the dialog close button, or by pressing
+         * the return button to enter input.
+         * <p>Progress and wait dialogs will ignore this option since they do not respond to user
+         * actions and can only be closed programmatically, so any required function should be called
+         * by the same code after it closes the dialog. Parameters passed:<ul>
+         * <li><b>buttonId</b> : String<div class="sub-desc">The ID of the button pressed, one of:<div class="sub-desc"><ul>
+         * <li><tt>ok</tt></li>
+         * <li><tt>yes</tt></li>
+         * <li><tt>no</tt></li>
+         * <li><tt>cancel</tt></li>
+         * </ul></div></div></li>
+         * <li><b>text</b> : String<div class="sub-desc">Value of the input field if either <tt><a href="#show-option-prompt" ext:member="show-option-prompt" ext:cls="Ext.MessageBox">prompt</a></tt>
+         * or <tt><a href="#show-option-multiline" ext:member="show-option-multiline" ext:cls="Ext.MessageBox">multiline</a></tt> is true</div></li>
+         * <li><b>opt</b> : Object<div class="sub-desc">The config object passed to show.</div></li>
+         * </ul></p></div></li>
+         * <li><b>scope</b> : Object<div class="sub-desc">The scope of the callback function</div></li>
+         * <li><b>icon</b> : String<div class="sub-desc">A CSS class that provides a background image to be used as the body icon for the
+         * dialog (e.g. Ext.MessageBox.WARNING or 'custom-class') (defaults to '')</div></li>
+         * <li><b>iconCls</b> : String<div class="sub-desc">The standard {@link Ext.Window#iconCls} to
+         * add an optional header icon (defaults to '')</div></li>
+         * <li><b>maxWidth</b> : Number<div class="sub-desc">The maximum width in pixels of the message box (defaults to 600)</div></li>
+         * <li><b>minWidth</b> : Number<div class="sub-desc">The minimum width in pixels of the message box (defaults to 100)</div></li>
+         * <li><b>modal</b> : Boolean<div class="sub-desc">False to allow user interaction with the page while the message box is
+         * displayed (defaults to true)</div></li>
+         * <li><b>msg</b> : String<div class="sub-desc">A string that will replace the existing message box body text (defaults to the
+         * XHTML-compliant non-breaking space character '&amp;#160;')</div></li>
+         * <li><a id="show-option-multiline"></a><b>multiline</b> : Boolean<div class="sub-desc">
+         * True to prompt the user to enter multi-line text (defaults to false)</div></li>
+         * <li><b>progress</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>progressText</b> : String<div class="sub-desc">The text to display inside the progress bar if progress = true (defaults to '')</div></li>
+         * <li><a id="show-option-prompt"></a><b>prompt</b> : Boolean<div class="sub-desc">True to prompt the user to enter single-line text (defaults to false)</div></li>
+         * <li><b>proxyDrag</b> : Boolean<div class="sub-desc">True to display a lightweight proxy while dragging (defaults to false)</div></li>
+         * <li><b>title</b> : String<div class="sub-desc">The title text</div></li>
+         * <li><b>value</b> : String<div class="sub-desc">The string value to set into the active textbox element if displayed</div></li>
+         * <li><b>wait</b> : Boolean<div class="sub-desc">True to display a progress bar (defaults to false)</div></li>
+         * <li><b>waitConfig</b> : Object<div class="sub-desc">A {@link Ext.ProgressBar#waitConfig} object (applies only if wait = true)</div></li>
+         * <li><b>width</b> : Number<div class="sub-desc">The width of the dialog in pixels</div></li>
+         * </ul>
+         * Example usage:
+         * <pre><code>
+Ext.Msg.show({
+   title: 'Address',
+   msg: 'Please enter your address:',
+   width: 300,
+   buttons: Ext.MessageBox.OKCANCEL,
+   multiline: true,
+   fn: saveAddress,
+   animEl: 'addAddressBtn',
+   icon: Ext.MessageBox.INFO
+});
+</code></pre>
+         * @return {Ext.MessageBox} this
+         */
+        show : function(options){
+            if(this.isVisible()){
+                this.hide();
+            }
+            opt = options;
+            var d = this.getDialog(opt.title || "&#160;");
+
+            d.setTitle(opt.title || "&#160;");
+            var allowClose = (opt.closable !== false && opt.progress !== true && opt.wait !== true);
+            d.tools.close.setDisplayed(allowClose);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false);
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(Ext.isNumber(opt.multiline) ? opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            activeTextEl.dom.value = opt.value || "";
+            if(opt.prompt){
+                d.focusEl = activeTextEl;
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons["ok"];
+                }else if(bs && bs.yes){
+                    db = buttons["yes"];
+                }
+                if (db){
+                    d.focusEl = db;
+                }
+            }
+            if(Ext.isDefined(opt.iconCls)){
+              d.setIconClass(opt.iconCls);
+            }
+            this.setIcon(Ext.isDefined(opt.icon) ? opt.icon : bufferIcon);
+            bwidth = updateButtons(opt.buttons);
+            progressBar.setVisible(opt.progress === true || opt.wait === true);
+            this.updateProgress(0, opt.progressText);
+            this.updateText(opt.msg);
+            if(opt.cls){
+                d.el.addClass(opt.cls);
+            }
+            d.proxyDrag = opt.proxyDrag === true;
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            if(!d.isVisible()){
+                // force it to the end of the z-index stack so it gets a cursor in FF
+                document.body.appendChild(dlg.el.dom);
+                d.setAnimateTarget(opt.animEl);
+                //workaround for window internally enabling keymap in afterShow
+                d.on('show', function(){
+                    if(allowClose === true){
+                        d.keyMap.enable();
+                    }else{
+                        d.keyMap.disable();
+                    }
+                }, this, {single:true});
+                d.show(opt.animEl);
+            }
+            if(opt.wait === true){
+                progressBar.wait(opt.waitConfig);
+            }
+            return this;
+        },
+
+        /**
+         * Adds the specified icon to the dialog.  By default, the class 'ext-mb-icon' is applied for default
+         * styling, and the class passed in is expected to supply the background image url. Pass in empty string ('')
+         * to clear any existing icon. This method must be called before the MessageBox is shown.
+         * The following built-in icon classes are supported, but you can also pass in a custom class name:
+         * <pre>
+Ext.MessageBox.INFO
+Ext.MessageBox.WARNING
+Ext.MessageBox.QUESTION
+Ext.MessageBox.ERROR
+         *</pre>
+         * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon
+         * @return {Ext.MessageBox} this
+         */
+        setIcon : function(icon){
+            if(!dlg){
+                bufferIcon = icon;
+                return;
+            }
+            bufferIcon = undefined;
+            if(icon && icon != ''){
+                iconEl.removeClass('x-hidden');
+                iconEl.replaceClass(iconCls, icon);
+                bodyEl.addClass('x-dlg-icon');
+                iconCls = icon;
+            }else{
+                iconEl.replaceClass(iconCls, 'x-hidden');
+                bodyEl.removeClass('x-dlg-icon');
+                iconCls = '';
+            }
+            return this;
+        },
+
+        /**
+         * Displays a message box with a progress bar.  This message box has no buttons and is not closeable by
+         * the user.  You are responsible for updating the progress bar as needed via {@link Ext.MessageBox#updateProgress}
+         * and closing the message box when the process is complete.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {String} progressText (optional) The text to display inside the progress bar (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        progress : function(title, msg, progressText){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false,
+                minWidth: this.minProgressWidth,
+                progressText: progressText
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with an infinitely auto-updating progress bar.  This can be used to block user
+         * interaction while waiting for a long-running process to complete that does not have defined intervals.
+         * You are responsible for closing the message box when the process is complete.
+         * @param {String} msg The message box body text
+         * @param {String} title (optional) The title bar text
+         * @param {Object} config (optional) A {@link Ext.ProgressBar#waitConfig} object
+         * @return {Ext.MessageBox} this
+         */
+        wait : function(msg, title, config){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                closable:false,
+                wait:true,
+                modal:true,
+                minWidth: this.minProgressWidth,
+                waitConfig: config
+            });
+            return this;
+        },
+
+        /**
+         * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt).
+         * If a callback function is passed it will be called after the user clicks the button, and the
+         * id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
+         * If a callback function is passed it will be called after the user clicks either button,
+         * and the id of the button that was clicked will be passed as the only parameter to the callback
+         * (could also be the top-right close button).
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @return {Ext.MessageBox} this
+         */
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope,
+                icon: this.QUESTION,
+                minWidth: this.minWidth
+            });
+            return this;
+        },
+
+        /**
+         * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
+         * The prompt can be a single-line or multi-line textbox.  If a callback function is passed it will be called after the user
+         * clicks either button, and the id of the button that was clicked (could also be the top-right
+         * close button) and the text that was entered will be passed as the two parameters to the callback.
+         * @param {String} title The title bar text
+         * @param {String} msg The message box body text
+         * @param {Function} fn (optional) The callback function invoked after the message box is closed
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser wnidow.
+         * @param {Boolean/Number} multiline (optional) True to create a multiline textbox using the defaultTextHeight
+         * property, or the height in pixels to create the textbox (defaults to false / single-line)
+         * @param {String} value (optional) Default value of the text input element (defaults to '')
+         * @return {Ext.MessageBox} this
+         */
+        prompt : function(title, msg, fn, scope, multiline, value){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth: this.minPromptWidth,
+                scope : scope,
+                prompt:true,
+                multiline: multiline,
+                value: value
+            });
+            return this;
+        },
+
+        /**
+         * Button config that displays a single OK button
+         * @type Object
+         */
+        OK : {ok:true},
+        /**
+         * Button config that displays a single Cancel button
+         * @type Object
+         */
+        CANCEL : {cancel:true},
+        /**
+         * Button config that displays OK and Cancel buttons
+         * @type Object
+         */
+        OKCANCEL : {ok:true, cancel:true},
+        /**
+         * Button config that displays Yes and No buttons
+         * @type Object
+         */
+        YESNO : {yes:true, no:true},
+        /**
+         * Button config that displays Yes, No and Cancel buttons
+         * @type Object
+         */
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        /**
+         * The CSS class that provides the INFO icon image
+         * @type String
+         */
+        INFO : 'ext-mb-info',
+        /**
+         * The CSS class that provides the WARNING icon image
+         * @type String
+         */
+        WARNING : 'ext-mb-warning',
+        /**
+         * The CSS class that provides the QUESTION icon image
+         * @type String
+         */
+        QUESTION : 'ext-mb-question',
+        /**
+         * The CSS class that provides the ERROR icon image
+         * @type String
+         */
+        ERROR : 'ext-mb-error',
+
+        /**
+         * The default height in pixels of the message box's multiline textarea if displayed (defaults to 75)
+         * @type Number
+         */
+        defaultTextHeight : 75,
+        /**
+         * The maximum width in pixels of the message box (defaults to 600)
+         * @type Number
+         */
+        maxWidth : 600,
+        /**
+         * The minimum width in pixels of the message box (defaults to 100)
+         * @type Number
+         */
+        minWidth : 100,
+        /**
+         * The minimum width in pixels of the message box if it is a progress-style dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minProgressWidth : 250,
+        /**
+         * The minimum width in pixels of the message box if it is a prompt dialog.  This is useful
+         * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+         * @type Number
+         */
+        minPromptWidth: 250,
+        /**
+         * An object containing the default button text strings that can be overriden for localized language support.
+         * Supported properties are: ok, cancel, yes and no.  Generally you should include a locale-specific
+         * resource file for handling language support across the framework.
+         * Customize the default text like so: Ext.MessageBox.buttonText.yes = "oui"; //french
+         * @type Object
+         */
+        buttonText : {
+            ok : "OK",
+            cancel : "Cancel",
+            yes : "Yes",
+            no : "No"
+        }
+    };
+}();
+
+/**
+ * Shorthand for {@link Ext.MessageBox}
+ */
+Ext.Msg = Ext.MessageBox;/**
+ * @class Ext.dd.PanelProxy
+ * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
+ * for the Panel's drag drop implementation, and should never need to be created directly.
+ * @constructor
+ * @param panel The {@link Ext.Panel} to proxy for
+ * @param config Configuration options
+ */
+Ext.dd.PanelProxy  = Ext.extend(Object, {
+    
+    constructor : function(panel, config){
+        this.panel = panel;
+        this.id = this.panel.id +'-ddproxy';
+        Ext.apply(this, config);        
+    },
+    
+    /**
+     * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
+     * false to drag with no proxy (defaults to true).
+     */
+    insertProxy : true,
+
+    // private overrides
+    setStatus : Ext.emptyFn,
+    reset : Ext.emptyFn,
+    update : Ext.emptyFn,
+    stop : Ext.emptyFn,
+    sync: Ext.emptyFn,
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getEl : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's ghost element
+     * @return {Element} The proxy's ghost element
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    /**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getProxy : function(){
+        return this.proxy;
+    },
+
+    /**
+     * Hides the proxy
+     */
+    hide : function(){
+        if(this.ghost){
+            if(this.proxy){
+                this.proxy.remove();
+                delete this.proxy;
+            }
+            this.panel.el.dom.style.display = '';
+            this.ghost.remove();
+            delete this.ghost;
+        }
+    },
+
+    /**
+     * Shows the proxy
+     */
+    show : function(){
+        if(!this.ghost){
+            this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
+            this.ghost.setXY(this.panel.el.getXY());
+            if(this.insertProxy){
+                this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
+                this.proxy.setSize(this.panel.getSize());
+            }
+            this.panel.el.dom.style.display = 'none';
+        }
+    },
+
+    // private
+    repair : function(xy, callback, scope){
+        this.hide();
+        if(typeof callback == "function"){
+            callback.call(scope || this);
+        }
+    },
+
+    /**
+     * Moves the proxy to a different position in the DOM.  This is typically called while dragging the Panel
+     * to keep the proxy sync'd to the Panel's location.
+     * @param {HTMLElement} parentNode The proxy's parent DOM node
+     * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
+     * to the parent's last child if not specified)
+     */
+    moveProxy : function(parentNode, before){
+        if(this.proxy){
+            parentNode.insertBefore(this.proxy.dom, before);
+        }
+    }
+});
+
+// private - DD implementation for Panels
+Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
+    
+    constructor : function(panel, cfg){
+        this.panel = panel;
+        this.dragData = {panel: panel};
+        this.proxy = new Ext.dd.PanelProxy(panel, cfg);
+        Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
+        var h = panel.header,
+            el = panel.body;
+        if(h){
+            this.setHandleElId(h.id);
+            el = panel.header;
+        }
+        el.setStyle('cursor', 'move');
+        this.scroll = false;        
+    },
+    
+    showFrame: Ext.emptyFn,
+    startDrag: Ext.emptyFn,
+    b4StartDrag: function(x, y) {
+        this.proxy.show();
+    },
+    b4MouseDown: function(e) {
+        var x = e.getPageX(),
+            y = e.getPageY();
+        this.autoOffset(x, y);
+    },
+    onInitDrag : function(x, y){
+        this.onStartDrag(x, y);
+        return true;
+    },
+    createFrame : Ext.emptyFn,
+    getDragEl : function(e){
+        return this.proxy.ghost.dom;
+    },
+    endDrag : function(e){
+        this.proxy.hide();
+        this.panel.saveState();
+    },
+
+    autoOffset : function(x, y) {
+        x -= this.startPageX;
+        y -= this.startPageY;
+        this.setDelta(x, y);
+    }
+});/**
+ * @class Ext.state.Provider
+ * Abstract base class for state provider implementations. This class provides methods
+ * for encoding and decoding <b>typed</b> variables including dates and defines the
+ * Provider interface.
+ */
+Ext.state.Provider = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(){
+        /**
+         * @event statechange
+         * Fires when a state change occurs.
+         * @param {Provider} this This state provider
+         * @param {String} key The state key which was changed
+         * @param {String} value The encoded value for the state
+         */
+        this.addEvents("statechange");
+        this.state = {};
+        Ext.state.Provider.superclass.constructor.call(this);
+    },
+    
+    /**
+     * Returns the current value for a key
+     * @param {String} name The key name
+     * @param {Mixed} defaultValue A default value to return if the key's value is not found
+     * @return {Mixed} The state data
+     */
+    get : function(name, defaultValue){
+        return typeof this.state[name] == "undefined" ?
+            defaultValue : this.state[name];
+    },
+
+    /**
+     * Clears a value from the state
+     * @param {String} name The key name
+     */
+    clear : function(name){
+        delete this.state[name];
+        this.fireEvent("statechange", this, name, null);
+    },
+
+    /**
+     * Sets the value for a key
+     * @param {String} name The key name
+     * @param {Mixed} value The value to set
+     */
+    set : function(name, value){
+        this.state[name] = value;
+        this.fireEvent("statechange", this, name, value);
+    },
+
+    /**
+     * Decodes a string previously encoded with {@link #encodeValue}.
+     * @param {String} value The value to decode
+     * @return {Mixed} The decoded value
+     */
+    decodeValue : function(cookie){
+        /**
+         * a -> Array
+         * n -> Number
+         * d -> Date
+         * b -> Boolean
+         * s -> String
+         * o -> Object
+         * -> Empty (null)
+         */
+        var re = /^(a|n|d|b|s|o|e)\:(.*)$/,
+            matches = re.exec(unescape(cookie)),
+            all,
+            type,
+            v,
+            kv;
+        if(!matches || !matches[1]){
+            return; // non state cookie
+        }
+        type = matches[1];
+        v = matches[2];
+        switch(type){
+            case 'e':
+                return null;
+            case 'n':
+                return parseFloat(v);
+            case 'd':
+                return new Date(Date.parse(v));
+            case 'b':
+                return (v == '1');
+            case 'a':
+                all = [];
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        all.push(this.decodeValue(val));
+                    }, this);
+                }
+                return all;
+           case 'o':
+                all = {};
+                if(v != ''){
+                    Ext.each(v.split('^'), function(val){
+                        kv = val.split('=');
+                        all[kv[0]] = this.decodeValue(kv[1]);
+                    }, this);
+                }
+                return all;
+           default:
+                return v;
+        }
+    },
+
+    /**
+     * Encodes a value including type information.  Decode with {@link #decodeValue}.
+     * @param {Mixed} value The value to encode
+     * @return {String} The encoded value
+     */
+    encodeValue : function(v){
+        var enc,
+            flat = '',
+            i = 0,
+            len,
+            key;
+        if(v == null){
+            return 'e:1';    
+        }else if(typeof v == 'number'){
+            enc = 'n:' + v;
+        }else if(typeof v == 'boolean'){
+            enc = 'b:' + (v ? '1' : '0');
+        }else if(Ext.isDate(v)){
+            enc = 'd:' + v.toGMTString();
+        }else if(Ext.isArray(v)){
+            for(len = v.length; i < len; i++){
+                flat += this.encodeValue(v[i]);
+                if(i != len - 1){
+                    flat += '^';
+                }
+            }
+            enc = 'a:' + flat;
+        }else if(typeof v == 'object'){
+            for(key in v){
+                if(typeof v[key] != 'function' && v[key] !== undefined){
+                    flat += key + '=' + this.encodeValue(v[key]) + '^';
+                }
+            }
+            enc = 'o:' + flat.substring(0, flat.length-1);
+        }else{
+            enc = 's:' + v;
+        }
+        return escape(enc);
+    }
+});
+/**
+ * @class Ext.state.Manager
+ * This is the global state manager. By default all components that are "state aware" check this class
+ * for state information if you don't pass them a custom state provider. In order for this class
+ * to be useful, it must be initialized with a provider when your application initializes. Example usage:
+ <pre><code>
+// in your initialization function
+init : function(){
+   Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+   var win = new Window(...);
+   win.restoreState();
+}
+ </code></pre>
+ * @singleton
+ */
+Ext.state.Manager = function(){
+    var provider = new Ext.state.Provider();
+
+    return {
+        /**
+         * Configures the default state provider for your application
+         * @param {Provider} stateProvider The state provider to set
+         */
+        setProvider : function(stateProvider){
+            provider = stateProvider;
+        },
+
+        /**
+         * Returns the current value for a key
+         * @param {String} name The key name
+         * @param {Mixed} defaultValue The default value to return if the key lookup does not match
+         * @return {Mixed} The state data
+         */
+        get : function(key, defaultValue){
+            return provider.get(key, defaultValue);
+        },
+
+        /**
+         * Sets the value for a key
+         * @param {String} name The key name
+         * @param {Mixed} value The state data
+         */
+         set : function(key, value){
+            provider.set(key, value);
+        },
+
+        /**
+         * Clears a value from the state
+         * @param {String} name The key name
+         */
+        clear : function(key){
+            provider.clear(key);
+        },
+
+        /**
+         * Gets the currently configured state provider
+         * @return {Provider} The state provider
+         */
+        getProvider : function(){
+            return provider;
+        }
+    };
+}();
+/**
+ * @class Ext.state.CookieProvider
+ * @extends Ext.state.Provider
+ * The default Provider implementation which saves state via cookies.
+ * <br />Usage:
+ <pre><code>
+   var cp = new Ext.state.CookieProvider({
+       path: "/cgi-bin/",
+       expires: new Date(new Date().getTime()+(1000*60*60*24*30)), //30 days
+       domain: "extjs.com"
+   });
+   Ext.state.Manager.setProvider(cp);
+ </code></pre>
+ * @cfg {String} path The path for which the cookie is active (defaults to root '/' which makes it active for all pages in the site)
+ * @cfg {Date} expires The cookie expiration date (defaults to 7 days from now)
+ * @cfg {String} domain The domain to save the cookie for.  Note that you cannot specify a different domain than
+ * your page is on, but you can specify a sub-domain, or simply the domain itself like 'extjs.com' to include
+ * all sub-domains if you need to access cookies across different sub-domains (defaults to null which uses the same
+ * domain the page is running on including the 'www' like 'www.extjs.com')
+ * @cfg {Boolean} secure True if the site is using SSL (defaults to false)
+ * @constructor
+ * Create a new CookieProvider
+ * @param {Object} config The configuration object
+ */
+Ext.state.CookieProvider = Ext.extend(Ext.state.Provider, {
+    
+    constructor : function(config){
+        Ext.state.CookieProvider.superclass.constructor.call(this);
+        this.path = "/";
+        this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days
+        this.domain = null;
+        this.secure = false;
+        Ext.apply(this, config);
+        this.state = this.readCookies();
+    },
+    
+    // private
+    set : function(name, value){
+        if(typeof value == "undefined" || value === null){
+            this.clear(name);
+            return;
+        }
+        this.setCookie(name, value);
+        Ext.state.CookieProvider.superclass.set.call(this, name, value);
+    },
+
+    // private
+    clear : function(name){
+        this.clearCookie(name);
+        Ext.state.CookieProvider.superclass.clear.call(this, name);
+    },
+
+    // private
+    readCookies : function(){
+        var cookies = {},
+            c = document.cookie + ";",
+            re = /\s?(.*?)=(.*?);/g,
+    	    matches,
+            name,
+            value;
+    	while((matches = re.exec(c)) != null){
+            name = matches[1];
+            value = matches[2];
+            if(name && name.substring(0,3) == "ys-"){
+                cookies[name.substr(3)] = this.decodeValue(value);
+            }
+        }
+        return cookies;
+    },
+
+    // private
+    setCookie : function(name, value){
+        document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +
+           ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    },
+
+    // private
+    clearCookie : function(name){
+        document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    }
+});/**
+ * @class Ext.DataView
+ * @extends Ext.BoxComponent
+ * A mechanism for displaying data using custom layout templates and formatting. DataView uses an {@link Ext.XTemplate}
+ * as its internal templating mechanism, and is bound to an {@link Ext.data.Store}
+ * so that as the data in the store changes the view is automatically updated to reflect the changes.  The view also
+ * provides built-in behavior for many common events that can occur for its contained items including click, doubleclick,
+ * mouseover, mouseout, etc. as well as a built-in selection model. <b>In order to use these features, an {@link #itemSelector}
+ * config must be provided for the DataView to determine what nodes it will be working with.</b>
+ *
+ * <p>The example below binds a DataView to a {@link Ext.data.Store} and renders it into an {@link Ext.Panel}.</p>
+ * <pre><code>
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var tpl = new Ext.XTemplate(
+    '&lt;tpl for="."&gt;',
+        '&lt;div class="thumb-wrap" id="{name}"&gt;',
+        '&lt;div class="thumb"&gt;&lt;img src="{url}" title="{name}"&gt;&lt;/div&gt;',
+        '&lt;span class="x-editable"&gt;{shortName}&lt;/span&gt;&lt;/div&gt;',
+    '&lt;/tpl&gt;',
+    '&lt;div class="x-clear"&gt;&lt;/div&gt;'
+);
+
+var panel = new Ext.Panel({
+    id:'images-view',
+    frame:true,
+    width:535,
+    autoHeight:true,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple DataView',
+
+    items: new Ext.DataView({
+        store: store,
+        tpl: tpl,
+        autoHeight:true,
+        multiSelect: true,
+        overClass:'x-view-over',
+        itemSelector:'div.thumb-wrap',
+        emptyText: 'No images to display'
+    })
+});
+panel.render(document.body);
+</code></pre>
+ * @constructor
+ * Create a new DataView
+ * @param {Object} config The config object
+ * @xtype dataview
+ */
+Ext.DataView = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String/Array} tpl
+     * The HTML fragment or an array of fragments that will make up the template used by this DataView.  This should
+     * be specified in the same format expected by the constructor of {@link Ext.XTemplate}.
+     */
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} to bind this DataView to.
+     */
+    /**
+     * @cfg {String} itemSelector
+     * <b>This is a required setting</b>. A simple CSS selector (e.g. <tt>div.some-class</tt> or 
+     * <tt>span:first-child</tt>) that will be used to determine what nodes this DataView will be
+     * working with.
+     */
+    /**
+     * @cfg {Boolean} multiSelect
+     * True to allow selection of more than one item at a time, false to allow selection of only a single item
+     * at a time or no selection at all, depending on the value of {@link #singleSelect} (defaults to false).
+     */
+    /**
+     * @cfg {Boolean} singleSelect
+     * True to allow selection of exactly one item at a time, false to allow no selection at all (defaults to false).
+     * Note that if {@link #multiSelect} = true, this value will be ignored.
+     */
+    /**
+     * @cfg {Boolean} simpleSelect
+     * True to enable multiselection by clicking on multiple items without requiring the user to hold Shift or Ctrl,
+     * false to force the user to hold Ctrl or Shift to select more than on item (defaults to false).
+     */
+    /**
+     * @cfg {String} overClass
+     * A CSS class to apply to each item in the view on mouseover (defaults to undefined).
+     */
+    /**
+     * @cfg {String} loadingText
+     * A string to display during data load operations (defaults to undefined).  If specified, this text will be
+     * displayed in a loading div and the view's contents will be cleared while loading, otherwise the view's
+     * contents will continue to display normally until the new data is loaded and the contents are replaced.
+     */
+    /**
+     * @cfg {String} selectedClass
+     * A CSS class to apply to each selected item in the view (defaults to 'x-view-selected').
+     */
+    selectedClass : "x-view-selected",
+    /**
+     * @cfg {String} emptyText
+     * The text to display in the view when there is no data to display (defaults to '').
+     */
+    emptyText : "",
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer emptyText being applied until the store's first load
+     */
+    deferEmptyText: true,
+    /**
+     * @cfg {Boolean} trackOver True to enable mouseenter and mouseleave events
+     */
+    trackOver: false,
+    
+    /**
+     * @cfg {Boolean} blockRefresh Set this to true to ignore datachanged events on the bound store. This is useful if
+     * you wish to provide custom transition animations via a plugin (defaults to false)
+     */
+    blockRefresh: false,
+
+    //private
+    last: false,
+
+    // private
+    initComponent : function(){
+        Ext.DataView.superclass.initComponent.call(this);
+        if(Ext.isString(this.tpl) || Ext.isArray(this.tpl)){
+            this.tpl = new Ext.XTemplate(this.tpl);
+        }
+
+        this.addEvents(
+            /**
+             * @event beforeclick
+             * Fires before a click is processed. Returns false to cancel the default action.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "beforeclick",
+            /**
+             * @event click
+             * Fires when a template node is clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "click",
+            /**
+             * @event mouseenter
+             * Fires when the mouse enters a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseenter",
+            /**
+             * @event mouseleave
+             * Fires when the mouse leaves a template node. trackOver:true or an overClass must be set to enable this event.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "mouseleave",
+            /**
+             * @event containerclick
+             * Fires when a click occurs and it is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containerclick",
+            /**
+             * @event dblclick
+             * Fires when a template node is double clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "dblclick",
+            /**
+             * @event contextmenu
+             * Fires when a template node is right clicked.
+             * @param {Ext.DataView} this
+             * @param {Number} index The index of the target node
+             * @param {HTMLElement} node The target node
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "contextmenu",
+            /**
+             * @event containercontextmenu
+             * Fires when a right click occurs that is not on a template node.
+             * @param {Ext.DataView} this
+             * @param {Ext.EventObject} e The raw event object
+             */
+            "containercontextmenu",
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change.
+             * @param {Ext.DataView} this
+             * @param {Array} selections Array of the selected nodes
+             */
+            "selectionchange",
+
+            /**
+             * @event beforeselect
+             * Fires before a selection is made. If any handlers return false, the selection is cancelled.
+             * @param {Ext.DataView} this
+             * @param {HTMLElement} node The node to be selected
+             * @param {Array} selections Array of currently selected nodes
+             */
+            "beforeselect"
+        );
+
+        this.store = Ext.StoreMgr.lookup(this.store);
+        this.all = new Ext.CompositeElementLite();
+        this.selected = new Ext.CompositeElementLite();
+    },
+
+    // private
+    afterRender : function(){
+        Ext.DataView.superclass.afterRender.call(this);
+
+		this.mon(this.getTemplateTarget(), {
+            "click": this.onClick,
+            "dblclick": this.onDblClick,
+            "contextmenu": this.onContextMenu,
+            scope:this
+        });
+
+        if(this.overClass || this.trackOver){
+            this.mon(this.getTemplateTarget(), {
+                "mouseover": this.onMouseOver,
+                "mouseout": this.onMouseOut,
+                scope:this
+            });
+        }
+
+        if(this.store){
+            this.bindStore(this.store, true);
+        }
+    },
+
+    /**
+     * Refreshes the view by reloading the data from the store and re-rendering the template.
+     */
+    refresh : function() {
+        this.clearSelections(false, true);
+        var el = this.getTemplateTarget(),
+            records = this.store.getRange();
+            
+        el.update('');
+        if(records.length < 1){
+            if(!this.deferEmptyText || this.hasSkippedEmptyText){
+                el.update(this.emptyText);
+            }
+            this.all.clear();
+        }else{
+            this.tpl.overwrite(el, this.collectData(records, 0));
+            this.all.fill(Ext.query(this.itemSelector, el.dom));
+            this.updateIndexes(0);
+        }
+        this.hasSkippedEmptyText = true;
+    },
+
+    getTemplateTarget: function(){
+        return this.el;
+    },
+
+    /**
+     * Function which can be overridden to provide custom formatting for each Record that is used by this
+     * DataView's {@link #tpl template} to render each node.
+     * @param {Array/Object} data The raw data object that was used to create the Record.
+     * @param {Number} recordIndex the index number of the Record being prepared for rendering.
+     * @param {Record} record The Record being prepared for rendering.
+     * @return {Array/Object} The formatted data in a format expected by the internal {@link #tpl template}'s overwrite() method.
+     * (either an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}))
+     */
+    prepareData : function(data){
+        return data;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * DataView's {@link #tpl template} to render the whole DataView.</p>
+     * <p>This is usually an Array of data objects, each element of which is processed by an
+     * {@link Ext.XTemplate XTemplate} which uses <tt>'&lt;tpl for="."&gt;'</tt> to iterate over its supplied
+     * data object as an Array. However, <i>named</i> properties may be placed into the data object to
+     * provide non-repeating data such as headings, totals etc.</p>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Array} An Array of data objects to be processed by a repeating XTemplate. May also
+     * contain <i>named</i> properties.
+     */
+    collectData : function(records, startIndex){
+        var r = [],
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            r[r.length] = this.prepareData(records[i].data, startIndex + i, records[i]);
+        }
+        return r;
+    },
+
+    // private
+    bufferRender : function(records, index){
+        var div = document.createElement('div');
+        this.tpl.overwrite(div, this.collectData(records, index));
+        return Ext.query(this.itemSelector, div);
+    },
+
+    // private
+    onUpdate : function(ds, record){
+        var index = this.store.indexOf(record);
+        if(index > -1){
+            var sel = this.isSelected(index),
+                original = this.all.elements[index],
+                node = this.bufferRender([record], index)[0];
+
+            this.all.replaceElement(index, node, true);
+            if(sel){
+                this.selected.replaceElement(original, node);
+                this.all.item(index).addClass(this.selectedClass);
+            }
+            this.updateIndexes(index, index);
+        }
+    },
+
+    // private
+    onAdd : function(ds, records, index){
+        if(this.all.getCount() === 0){
+            this.refresh();
+            return;
+        }
+        var nodes = this.bufferRender(records, index), n, a = this.all.elements;
+        if(index < this.all.getCount()){
+            n = this.all.item(index).insertSibling(nodes, 'before', true);
+            a.splice.apply(a, [index, 0].concat(nodes));
+        }else{
+            n = this.all.last().insertSibling(nodes, 'after', true);
+            a.push.apply(a, nodes);
+        }
+        this.updateIndexes(index);
+    },
+
+    // private
+    onRemove : function(ds, record, index){
+        this.deselect(index);
+        this.all.removeElement(index, true);
+        this.updateIndexes(index);
+        if (this.store.getCount() === 0){
+            this.refresh();
+        }
+    },
+
+    /**
+     * Refreshes an individual node's data from the store.
+     * @param {Number} index The item's data index in the store
+     */
+    refreshNode : function(index){
+        this.onUpdate(this.store, this.store.getAt(index));
+    },
+
+    // private
+    updateIndexes : function(startIndex, endIndex){
+        var ns = this.all.elements;
+        startIndex = startIndex || 0;
+        endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));
+        for(var i = startIndex; i <= endIndex; i++){
+            ns[i].viewIndex = i;
+        }
+    },
+    
+    /**
+     * Returns the store associated with this DataView.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Changes the data store bound to this view and refreshes it.
+     * @param {Store} store The store to bind to this view
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("beforeload", this.onBeforeLoad, this);
+                this.store.un("datachanged", this.onDataChanged, this);
+                this.store.un("add", this.onAdd, this);
+                this.store.un("remove", this.onRemove, this);
+                this.store.un("update", this.onUpdate, this);
+                this.store.un("clear", this.refresh, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                datachanged: this.onDataChanged,
+                add: this.onAdd,
+                remove: this.onRemove,
+                update: this.onUpdate,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store){
+            this.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Calls this.refresh if this.blockRefresh is not true
+     */
+    onDataChanged: function() {
+        if (this.blockRefresh !== true) {
+            this.refresh.apply(this, arguments);
+        }
+    },
+
+    /**
+     * Returns the template node the passed child belongs to, or null if it doesn't belong to one.
+     * @param {HTMLElement} node
+     * @return {HTMLElement} The template node
+     */
+    findItemFromChild : function(node){
+        return Ext.fly(node).findParent(this.itemSelector, this.getTemplateTarget());
+    },
+
+    // private
+    onClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget()),
+            index;
+        if(item){
+            index = this.indexOf(item);
+            if(this.onItemClick(item, index, e) !== false){
+                this.fireEvent("click", this, index, item, e);
+            }
+        }else{
+            if(this.fireEvent("containerclick", this, e) !== false){
+                this.onContainerClick(e);
+            }
+        }
+    },
+
+    onContainerClick : function(e){
+        this.clearSelections();
+    },
+
+    // private
+    onContextMenu : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("contextmenu", this, this.indexOf(item), item, e);
+        }else{
+            this.fireEvent("containercontextmenu", this, e);
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item){
+            this.fireEvent("dblclick", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOver : function(e){
+        var item = e.getTarget(this.itemSelector, this.getTemplateTarget());
+        if(item && item !== this.lastItem){
+            this.lastItem = item;
+            Ext.fly(item).addClass(this.overClass);
+            this.fireEvent("mouseenter", this, this.indexOf(item), item, e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        if(this.lastItem){
+            if(!e.within(this.lastItem, true, true)){
+                Ext.fly(this.lastItem).removeClass(this.overClass);
+                this.fireEvent("mouseleave", this, this.indexOf(this.lastItem), this.lastItem, e);
+                delete this.lastItem;
+            }
+        }
+    },
+
+    // private
+    onItemClick : function(item, index, e){
+        if(this.fireEvent("beforeclick", this, index, item, e) === false){
+            return false;
+        }
+        if(this.multiSelect){
+            this.doMultiSelection(item, index, e);
+            e.preventDefault();
+        }else if(this.singleSelect){
+            this.doSingleSelection(item, index, e);
+            e.preventDefault();
+        }
+        return true;
+    },
+
+    // private
+    doSingleSelection : function(item, index, e){
+        if(e.ctrlKey && this.isSelected(index)){
+            this.deselect(index);
+        }else{
+            this.select(index, false);
+        }
+    },
+
+    // private
+    doMultiSelection : function(item, index, e){
+        if(e.shiftKey && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, index, e.ctrlKey);
+            this.last = last; // reset the last
+        }else{
+            if((e.ctrlKey||this.simpleSelect) && this.isSelected(index)){
+                this.deselect(index);
+            }else{
+                this.select(index, e.ctrlKey || e.shiftKey || this.simpleSelect);
+            }
+        }
+    },
+
+    /**
+     * Gets the number of selected nodes.
+     * @return {Number} The node count
+     */
+    getSelectionCount : function(){
+        return this.selected.getCount();
+    },
+
+    /**
+     * Gets the currently selected nodes.
+     * @return {Array} An array of HTMLElements
+     */
+    getSelectedNodes : function(){
+        return this.selected.elements;
+    },
+
+    /**
+     * Gets the indexes of the selected nodes.
+     * @return {Array} An array of numeric indexes
+     */
+    getSelectedIndexes : function(){
+        var indexes = [], 
+            selected = this.selected.elements,
+            i = 0,
+            len = selected.length;
+            
+        for(; i < len; i++){
+            indexes.push(selected[i].viewIndex);
+        }
+        return indexes;
+    },
+
+    /**
+     * Gets an array of the selected records
+     * @return {Array} An array of {@link Ext.data.Record} objects
+     */
+    getSelectedRecords : function(){
+        return this.getRecords(this.selected.elements);
+    },
+
+    /**
+     * Gets an array of the records from an array of nodes
+     * @param {Array} nodes The nodes to evaluate
+     * @return {Array} records The {@link Ext.data.Record} objects
+     */
+    getRecords : function(nodes){
+        var records = [], 
+            i = 0,
+            len = nodes.length;
+            
+        for(; i < len; i++){
+            records[records.length] = this.store.getAt(nodes[i].viewIndex);
+        }
+        return records;
+    },
+
+    /**
+     * Gets a record from a node
+     * @param {HTMLElement} node The node to evaluate
+     * @return {Record} record The {@link Ext.data.Record} object
+     */
+    getRecord : function(node){
+        return this.store.getAt(node.viewIndex);
+    },
+
+    /**
+     * Clears all selections.
+     * @param {Boolean} suppressEvent (optional) True to skip firing of the selectionchange event
+     */
+    clearSelections : function(suppressEvent, skipUpdate){
+        if((this.multiSelect || this.singleSelect) && this.selected.getCount() > 0){
+            if(!skipUpdate){
+                this.selected.removeClass(this.selectedClass);
+            }
+            this.selected.clear();
+            this.last = false;
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        }
+    },
+
+    /**
+     * Returns true if the passed node is selected, else false.
+     * @param {HTMLElement/Number/Ext.data.Record} node The node, node index or record to check
+     * @return {Boolean} True if selected, else false
+     */
+    isSelected : function(node){
+        return this.selected.contains(this.getNode(node));
+    },
+
+    /**
+     * Deselects a node.
+     * @param {HTMLElement/Number/Record} node The node, node index or record to deselect
+     */
+    deselect : function(node){
+        if(this.isSelected(node)){
+            node = this.getNode(node);
+            this.selected.removeElement(node);
+            if(this.last == node.viewIndex){
+                this.last = false;
+            }
+            Ext.fly(node).removeClass(this.selectedClass);
+            this.fireEvent("selectionchange", this, this.selected.elements);
+        }
+    },
+
+    /**
+     * Selects a set of nodes.
+     * @param {Array/HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node,
+     * id of a template node, record associated with a node or an array of any of those to select
+     * @param {Boolean} keepExisting (optional) true to keep existing selections
+     * @param {Boolean} suppressEvent (optional) true to skip firing of the selectionchange vent
+     */
+    select : function(nodeInfo, keepExisting, suppressEvent){
+        if(Ext.isArray(nodeInfo)){
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            for(var i = 0, len = nodeInfo.length; i < len; i++){
+                this.select(nodeInfo[i], true, true);
+            }
+            if(!suppressEvent){
+                this.fireEvent("selectionchange", this, this.selected.elements);
+            }
+        } else{
+            var node = this.getNode(nodeInfo);
+            if(!keepExisting){
+                this.clearSelections(true);
+            }
+            if(node && !this.isSelected(node)){
+                if(this.fireEvent("beforeselect", this, node, this.selected.elements) !== false){
+                    Ext.fly(node).addClass(this.selectedClass);
+                    this.selected.add(node);
+                    this.last = node.viewIndex;
+                    if(!suppressEvent){
+                        this.fireEvent("selectionchange", this, this.selected.elements);
+                    }
+                }
+            }
+        }
+    },
+
+    /**
+     * Selects a range of nodes. All nodes between start and end are selected.
+     * @param {Number} start The index of the first node in the range
+     * @param {Number} end The index of the last node in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(start, end, keepExisting){
+        if(!keepExisting){
+            this.clearSelections(true);
+        }
+        this.select(this.getNodes(start, end), true);
+    },
+
+    /**
+     * Gets a template node.
+     * @param {HTMLElement/String/Number/Ext.data.Record} nodeInfo An HTMLElement template node, index of a template node, 
+     * the id of a template node or the record associated with the node.
+     * @return {HTMLElement} The node or null if it wasn't found
+     */
+    getNode : function(nodeInfo){
+        if(Ext.isString(nodeInfo)){
+            return document.getElementById(nodeInfo);
+        }else if(Ext.isNumber(nodeInfo)){
+            return this.all.elements[nodeInfo];
+        }else if(nodeInfo instanceof Ext.data.Record){
+            var idx = this.store.indexOf(nodeInfo);
+            return this.all.elements[idx];
+        }
+        return nodeInfo;
+    },
+
+    /**
+     * Gets a range nodes.
+     * @param {Number} start (optional) The index of the first node in the range
+     * @param {Number} end (optional) The index of the last node in the range
+     * @return {Array} An array of nodes
+     */
+    getNodes : function(start, end){
+        var ns = this.all.elements,
+            nodes = [],
+            i;
+            
+        start = start || 0;
+        end = !Ext.isDefined(end) ? Math.max(ns.length - 1, 0) : end;
+        if(start <= end){
+            for(i = start; i <= end && ns[i]; i++){
+                nodes.push(ns[i]);
+            }
+        } else{
+            for(i = start; i >= end && ns[i]; i--){
+                nodes.push(ns[i]);
+            }
+        }
+        return nodes;
+    },
+
+    /**
+     * Finds the index of the passed node.
+     * @param {HTMLElement/String/Number/Record} nodeInfo An HTMLElement template node, index of a template node, the id of a template node
+     * or a record associated with a node.
+     * @return {Number} The index of the node or -1
+     */
+    indexOf : function(node){
+        node = this.getNode(node);
+        if(Ext.isNumber(node.viewIndex)){
+            return node.viewIndex;
+        }
+        return this.all.indexOf(node);
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(this.loadingText){
+            this.clearSelections(false, true);
+            this.getTemplateTarget().update('<div class="loading-indicator">'+this.loadingText+'</div>');
+            this.all.clear();
+        }
+    },
+
+    onDestroy : function(){
+        this.all.clear();
+        this.selected.clear();
+        Ext.DataView.superclass.onDestroy.call(this);
+        this.bindStore(null);
+    }
+});
+
+/**
+ * Changes the data store bound to this view and refreshes it. (deprecated in favor of bindStore)
+ * @param {Store} store The store to bind to this view
+ */
+Ext.DataView.prototype.setStore = Ext.DataView.prototype.bindStore;
+
+Ext.reg('dataview', Ext.DataView);
+/**
+ * @class Ext.list.ListView
+ * @extends Ext.DataView
+ * <p>Ext.list.ListView is a fast and light-weight implentation of a
+ * {@link Ext.grid.GridPanel Grid} like view with the following characteristics:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>resizable columns</li>
+ * <li>selectable</li>
+ * <li>column widths are initially proportioned by percentage based on the container
+ * width and number of columns</li>
+ * <li>uses templates to render the data in any required format</li>
+ * <li>no horizontal scrolling</li>
+ * <li>no editing</li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+// consume JSON of this form:
+{
+   "images":[
+      {
+         "name":"dance_fever.jpg",
+         "size":2067,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/dance_fever.jpg"
+      },
+      {
+         "name":"zack_sink.jpg",
+         "size":2303,
+         "lastmod":1236974993000,
+         "url":"images\/thumbs\/zack_sink.jpg"
+      }
+   ]
+}
+var store = new Ext.data.JsonStore({
+    url: 'get-images.php',
+    root: 'images',
+    fields: [
+        'name', 'url',
+        {name:'size', type: 'float'},
+        {name:'lastmod', type:'date', dateFormat:'timestamp'}
+    ]
+});
+store.load();
+
+var listView = new Ext.list.ListView({
+    store: store,
+    multiSelect: true,
+    emptyText: 'No images to display',
+    reserveScrollOffset: true,
+    columns: [{
+        header: 'File',
+        width: .5,
+        dataIndex: 'name'
+    },{
+        header: 'Last Modified',
+        width: .35,
+        dataIndex: 'lastmod',
+        tpl: '{lastmod:date("m-d h:i a")}'
+    },{
+        header: 'Size',
+        dataIndex: 'size',
+        tpl: '{size:fileSize}', // format using Ext.util.Format.fileSize()
+        align: 'right'
+    }]
+});
+
+// put it in a Panel so it looks pretty
+var panel = new Ext.Panel({
+    id:'images-view',
+    width:425,
+    height:250,
+    collapsible:true,
+    layout:'fit',
+    title:'Simple ListView <i>(0 items selected)</i>',
+    items: listView
+});
+panel.render(document.body);
+
+// little bit of feedback
+listView.on('selectionchange', function(view, nodes){
+    var l = nodes.length;
+    var s = l != 1 ? 's' : '';
+    panel.setTitle('Simple ListView <i>('+l+' item'+s+' selected)</i>');
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ * @xtype listview
+ */
+Ext.list.ListView = Ext.extend(Ext.DataView, {
+    /**
+     * Set this property to <tt>true</tt> to disable the header click handler disabling sort
+     * (defaults to <tt>false</tt>).
+     * @type Boolean
+     * @property disableHeaders
+     */
+    /**
+     * @cfg {Boolean} hideHeaders
+     * <tt>true</tt> to hide the {@link #internalTpl header row} (defaults to <tt>false</tt> so
+     * the {@link #internalTpl header row} will be shown).
+     */
+    /**
+     * @cfg {String} itemSelector
+     * Defaults to <tt>'dl'</tt> to work with the preconfigured <b><tt>{@link Ext.DataView#tpl tpl}</tt></b>.
+     * This setting specifies the CSS selector (e.g. <tt>div.some-class</tt> or <tt>span:first-child</tt>)
+     * that will be used to determine what nodes the ListView will be working with.
+     */
+    itemSelector: 'dl',
+    /**
+     * @cfg {String} selectedClass The CSS class applied to a selected row (defaults to
+     * <tt>'x-list-selected'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-selected {background-color: yellow;}
+    </code></pre>
+     * @type String
+     */
+    selectedClass:'x-list-selected',
+    /**
+     * @cfg {String} overClass The CSS class applied when over a row (defaults to
+     * <tt>'x-list-over'</tt>). An example overriding the default styling:
+    <pre><code>
+    .x-list-over {background-color: orange;}
+    </code></pre>
+     * @type String
+     */
+    overClass:'x-list-over',
+    /**
+     * @cfg {Boolean} reserveScrollOffset
+     * By default will defer accounting for the configured <b><tt>{@link #scrollOffset}</tt></b>
+     * for 10 milliseconds.  Specify <tt>true</tt> to account for the configured
+     * <b><tt>{@link #scrollOffset}</tt></b> immediately.
+     */
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the scrollbar (defaults to
+     * <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+    /**
+     * @cfg {Boolean/Object} columnResize
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.ColumnResizer}
+     * to enable the columns to be resizable (defaults to <tt>true</tt>).
+     */
+    columnResize: true,
+    /**
+     * @cfg {Array} columns An array of column configuration objects, for example:
+     * <pre><code>
+{
+    align: 'right',
+    dataIndex: 'size',
+    header: 'Size',
+    tpl: '{size:fileSize}',
+    width: .35
+}
+     * </code></pre>
+     * Acceptable properties for each column configuration object are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>align</tt></b> : String<div class="sub-desc">Set the CSS text-align property
+     * of the column. Defaults to <tt>'left'</tt>.</div></li>
+     * <li><b><tt>dataIndex</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#dataIndex dataIndex} for details.</div></li>
+     * <li><b><tt>header</tt></b> : String<div class="sub-desc">See {@link Ext.grid.Column}.
+     * {@link Ext.grid.Column#header header} for details.</div></li>
+     * <li><b><tt>tpl</tt></b> : String<div class="sub-desc">Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.</div></li>
+     * <li><b><tt>width</tt></b> : Number<div class="sub-desc">Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Boolean/Object} columnSort
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.Sorter}
+     * to enable the columns to be sortable (defaults to <tt>true</tt>).
+     */
+    columnSort: true,
+    /**
+     * @cfg {String/Array} internalTpl
+     * The template to be used for the header row.  See {@link #tpl} for more details.
+     */
+
+    /*
+     * IE has issues when setting percentage based widths to 100%. Default to 99.
+     */
+    maxColumnWidth: Ext.isIE ? 99 : 100,
+
+    initComponent : function(){
+        if(this.columnResize){
+            this.colResizer = new Ext.list.ColumnResizer(this.colResizer);
+            this.colResizer.init(this);
+        }
+        if(this.columnSort){
+            this.colSorter = new Ext.list.Sorter(this.columnSort);
+            this.colSorter.init(this);
+        }
+        if(!this.internalTpl){
+            this.internalTpl = new Ext.XTemplate(
+                '<div class="x-list-header"><div class="x-list-header-inner">',
+                    '<tpl for="columns">',
+                    '<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',
+                        '{header}',
+                    '</em></div>',
+                    '</tpl>',
+                    '<div class="x-clear"></div>',
+                '</div></div>',
+                '<div class="x-list-body"><div class="x-list-body-inner">',
+                '</div></div>'
+            );
+        }
+        if(!this.tpl){
+            this.tpl = new Ext.XTemplate(
+                '<tpl for="rows">',
+                    '<dl>',
+                        '<tpl for="parent.columns">',
+                        '<dt style="width:{[values.width*100]}%;text-align:{align};">',
+                        '<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',
+                            '{[values.tpl.apply(parent)]}',
+                        '</em></dt>',
+                        '</tpl>',
+                        '<div class="x-clear"></div>',
+                    '</dl>',
+                '</tpl>'
+            );
+        };
+
+        var cs = this.columns,
+            allocatedWidth = 0,
+            colsWithWidth = 0,
+            len = cs.length,
+            columns = [];
+
+        for(var i = 0; i < len; i++){
+            var c = cs[i];
+            if(!c.isColumn) {
+                c.xtype = c.xtype ? (/^lv/.test(c.xtype) ? c.xtype : 'lv' + c.xtype) : 'lvcolumn';
+                c = Ext.create(c);
+            }
+            if(c.width) {
+                allocatedWidth += c.width*100;
+                if(allocatedWidth > this.maxColumnWidth){
+                    c.width -= (allocatedWidth - this.maxColumnWidth) / 100;
+                }
+                colsWithWidth++;
+            }
+            columns.push(c);
+        }
+
+        cs = this.columns = columns;
+
+        // auto calculate missing column widths
+        if(colsWithWidth < len){
+            var remaining = len - colsWithWidth;
+            if(allocatedWidth < this.maxColumnWidth){
+                var perCol = ((this.maxColumnWidth-allocatedWidth) / remaining)/100;
+                for(var j = 0; j < len; j++){
+                    var c = cs[j];
+                    if(!c.width){
+                        c.width = perCol;
+                    }
+                }
+            }
+        }
+        Ext.list.ListView.superclass.initComponent.call(this);
+    },
+
+    onRender : function(){
+        this.autoEl = {
+            cls: 'x-list-wrap'
+        };
+        Ext.list.ListView.superclass.onRender.apply(this, arguments);
+
+        this.internalTpl.overwrite(this.el, {columns: this.columns});
+
+        this.innerBody = Ext.get(this.el.dom.childNodes[1].firstChild);
+        this.innerHd = Ext.get(this.el.dom.firstChild.firstChild);
+
+        if(this.hideHeaders){
+            this.el.dom.firstChild.style.display = 'none';
+        }
+    },
+
+    getTemplateTarget : function(){
+        return this.innerBody;
+    },
+
+    /**
+     * <p>Function which can be overridden which returns the data object passed to this
+     * view's {@link #tpl template} to render the whole ListView. The returned object
+     * shall contain the following properties:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><b>columns</b> : String<div class="sub-desc">See <tt>{@link #columns}</tt></div></li>
+     * <li><b>rows</b> : String<div class="sub-desc">See
+     * <tt>{@link Ext.DataView}.{@link Ext.DataView#collectData collectData}</div></li>
+     * </ul></div>
+     * @param {Array} records An Array of {@link Ext.data.Record}s to be rendered into the DataView.
+     * @param {Number} startIndex the index number of the Record being prepared for rendering.
+     * @return {Object} A data object containing properties to be processed by a repeating
+     * XTemplate as described above.
+     */
+    collectData : function(){
+        var rs = Ext.list.ListView.superclass.collectData.apply(this, arguments);
+        return {
+            columns: this.columns,
+            rows: rs
+        };
+    },
+
+    verifyInternalSize : function(){
+        if(this.lastSize){
+            this.onResize(this.lastSize.width, this.lastSize.height);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        var body = this.innerBody.dom,
+            header = this.innerHd.dom,
+            scrollWidth = w - Ext.num(this.scrollOffset, Ext.getScrollBarWidth()) + 'px',
+            parentNode;
+            
+        if(!body){
+            return;
+        }
+        parentNode = body.parentNode;
+        if(Ext.isNumber(w)){
+            if(this.reserveScrollOffset || ((parentNode.offsetWidth - parentNode.clientWidth) > 10)){
+                body.style.width = scrollWidth;
+                header.style.width = scrollWidth;
+            }else{
+                body.style.width = w + 'px';
+                header.style.width = w + 'px';
+                setTimeout(function(){
+                    if((parentNode.offsetWidth - parentNode.clientWidth) > 10){
+                        body.style.width = scrollWidth;
+                        header.style.width = scrollWidth;
+                    }
+                }, 10);
+            }
+        }
+        if(Ext.isNumber(h)){
+            parentNode.style.height = Math.max(0, h - header.parentNode.offsetHeight) + 'px';
+        }
+    },
+
+    updateIndexes : function(){
+        Ext.list.ListView.superclass.updateIndexes.apply(this, arguments);
+        this.verifyInternalSize();
+    },
+
+    findHeaderIndex : function(header){
+        header = header.dom || header;
+        var parentNode = header.parentNode, 
+            children = parentNode.parentNode.childNodes,
+            i = 0,
+            c;
+        for(; c = children[i]; i++){
+            if(c == parentNode){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    setHdWidths : function(){
+        var els = this.innerHd.dom.getElementsByTagName('div'),
+            i = 0,
+            columns = this.columns,
+            len = columns.length;
+            
+        for(; i < len; i++){
+            els[i].style.width = (columns[i].width*100) + '%';
+        }
+    }
+});
+
+Ext.reg('listview', Ext.list.ListView);
+
+// Backwards compatibility alias
+Ext.ListView = Ext.list.ListView;/**
+ * @class Ext.list.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.list.ListView ListView}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.list.Column = Ext.extend(Object, {
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ListView constructor method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ListView will recreate a new Ext.list.Column
+     * Defaults to true.
+     */
+    isColumn: true,
+    
+    /**
+     * @cfg {String} align
+     * Set the CSS text-align property of the column. Defaults to <tt>'left'</tt>.
+     */        
+    align: 'left',
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the ListView.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&#160;'</tt>.
+     */    
+    header: '',
+    
+    /**
+     * @cfg {Number} width Optional. Percentage of the container width
+     * this column should be allocated.  Columns that have no width specified will be
+     * allocated with an equal percentage to fill 100% of the container width.  To easily take
+     * advantage of the full container width, leave the width of at least one column undefined.
+     * Note that if you do not want to take up the full width of the container, the width of
+     * every column needs to be explicitly defined.
+     */    
+    width: null,
+
+    /**
+     * @cfg {String} cls Optional. This option can be used to add a CSS class to the cell of each
+     * row for this column.
+     */
+    cls: '',
+    
+    /**
+     * @cfg {String} tpl Optional. Specify a string to pass as the
+     * configuration string for {@link Ext.XTemplate}.  By default an {@link Ext.XTemplate}
+     * will be implicitly created using the <tt>dataIndex</tt>.
+     */
+
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * ListViews's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    
+    constructor : function(c){
+        if(!c.tpl){
+            c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');
+        }
+        else if(Ext.isString(c.tpl)){
+            c.tpl = new Ext.XTemplate(c.tpl);
+        }
+        
+        Ext.apply(this, c);
+    }
+});
+
+Ext.reg('lvcolumn', Ext.list.Column);
+
+/**
+ * @class Ext.list.NumberColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.NumberColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */    
+    format: '0,000.00',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':number("' + (c.format || this.format) + '")}');       
+        Ext.list.NumberColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvnumbercolumn', Ext.list.NumberColumn);
+
+/**
+ * @class Ext.list.DateColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.list.Column#xtype xtype} config option of {@link Ext.list.Column}
+ * for more details.</p>
+ */
+Ext.list.DateColumn = Ext.extend(Ext.list.Column, {
+    format: 'm/d/Y',
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':date("' + (c.format || this.format) + '")}');      
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+Ext.reg('lvdatecolumn', Ext.list.DateColumn);
+
+/**
+ * @class Ext.list.BooleanColumn
+ * @extends Ext.list.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.list.Column#xtype xtype}
+ * config option of {@link Ext.list.Column} for more details.</p>
+ */
+Ext.list.BooleanColumn = Ext.extend(Ext.list.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsey (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsey (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+    
+    constructor : function(c) {
+        c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}');
+        
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        c.tpl.format = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+        
+        Ext.list.DateColumn.superclass.constructor.call(this, c);
+    }
+});
+
+Ext.reg('lvbooleancolumn', Ext.list.BooleanColumn);/**
+ * @class Ext.list.ColumnResizer
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.ColumnResizer = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} minPct The minimum percentage to allot for any column (defaults to <tt>.05</tt>)
+     */
+    minPct: .05,
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.ColumnResizer.superclass.constructor.call(this);
+    },
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);
+        this.tracker = new Ext.dd.DragTracker({
+            onBeforeStart: this.onBeforeStart.createDelegate(this),
+            onStart: this.onStart.createDelegate(this),
+            onDrag: this.onDrag.createDelegate(this),
+            onEnd: this.onEnd.createDelegate(this),
+            tolerance: 3,
+            autoStart: 300
+        });
+        this.tracker.initEl(view.innerHd);
+        view.on('beforedestroy', this.tracker.destroy, this.tracker);
+    },
+
+    handleHdMove : function(e, t){
+        var handleWidth = 5,
+            x = e.getPageX(),
+            header = e.getTarget('em', 3, true);
+        if(header){
+            var region = header.getRegion(),
+                style = header.dom.style,
+                parentNode = header.dom.parentNode;
+
+            if(x - region.left <= handleWidth && parentNode != parentNode.parentNode.firstChild){
+                this.activeHd = Ext.get(parentNode.previousSibling.firstChild);
+                style.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';
+            } else if(region.right - x <= handleWidth && parentNode != parentNode.parentNode.lastChild.previousSibling){
+                this.activeHd = header;
+                style.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';
+            } else{
+                delete this.activeHd;
+                style.cursor = '';
+            }
+        }
+    },
+
+    onBeforeStart : function(e){
+        this.dragHd = this.activeHd;
+        return !!this.dragHd;
+    },
+
+    onStart: function(e){
+        
+        var me = this,
+            view = me.view,
+            dragHeader = me.dragHd,
+            x = me.tracker.getXY()[0];            
+        
+        me.proxy = view.el.createChild({cls:'x-list-resizer'});
+        me.dragX = dragHeader.getX();
+        me.headerIndex = view.findHeaderIndex(dragHeader);
+        
+        me.headersDisabled = view.disableHeaders;
+        view.disableHeaders = true;
+        
+        me.proxy.setHeight(view.el.getHeight());
+        me.proxy.setX(me.dragX);
+        me.proxy.setWidth(x - me.dragX);
+        
+        this.setBoundaries();
+        
+    },
+    
+    // Sets up the boundaries for the drag/drop operation
+    setBoundaries: function(relativeX){
+        var view = this.view,
+            headerIndex = this.headerIndex,
+            width = view.innerHd.getWidth(),
+            relativeX = view.innerHd.getX(),
+            minWidth = Math.ceil(width * this.minPct),
+            maxWidth = width - minWidth,
+            numColumns = view.columns.length,
+            headers = view.innerHd.select('em', true),
+            minX = minWidth + relativeX,
+            maxX = maxWidth + relativeX,
+            header;
+          
+        if (numColumns == 2) {
+            this.minX = minX;
+            this.maxX = maxX;
+        }else{
+            header = headers.item(headerIndex + 2);
+            this.minX = headers.item(headerIndex).getX() + minWidth;
+            this.maxX = header ? header.getX() - minWidth : maxX;
+            if (headerIndex == 0) {
+                // First
+                this.minX = minX;
+            } else if (headerIndex == numColumns - 2) {
+                // Last
+                this.maxX = maxX;
+            }
+        }
+    },
+
+    onDrag: function(e){
+        var me = this,
+            cursorX = me.tracker.getXY()[0].constrain(me.minX, me.maxX);
+            
+        me.proxy.setWidth(cursorX - this.dragX);
+    },
+
+    onEnd: function(e){
+        /* calculate desired width by measuring proxy and then remove it */
+        var newWidth = this.proxy.getWidth(),
+            index = this.headerIndex,
+            view = this.view,
+            columns = view.columns,
+            width = view.innerHd.getWidth(),
+            newPercent = Math.ceil(newWidth * view.maxColumnWidth / width) / 100,
+            disabled = this.headersDisabled,
+            headerCol = columns[index],
+            otherCol = columns[index + 1],
+            totalPercent = headerCol.width + otherCol.width;
+
+        this.proxy.remove();
+
+        headerCol.width = newPercent;
+        otherCol.width = totalPercent - newPercent;
+      
+        delete this.dragHd;
+        view.setHdWidths();
+        view.refresh();
+        
+        setTimeout(function(){
+            view.disableHeaders = disabled;
+        }, 100);
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.ColumnResizer = Ext.list.ColumnResizer;/**
+ * @class Ext.list.Sorter
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.Sorter = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Array} sortClasses
+     * The CSS classes applied to a header when it is sorted. (defaults to <tt>["sort-asc", "sort-desc"]</tt>)
+     */
+    sortClasses : ["sort-asc", "sort-desc"],
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        Ext.list.Sorter.superclass.constructor.call(this);
+    },
+
+    init : function(listView){
+        this.view = listView;
+        listView.on('render', this.initEvents, this);
+    },
+
+    initEvents : function(view){
+        view.mon(view.innerHd, 'click', this.onHdClick, this);
+        view.innerHd.setStyle('cursor', 'pointer');
+        view.mon(view.store, 'datachanged', this.updateSortState, this);
+        this.updateSortState.defer(10, this, [view.store]);
+    },
+
+    updateSortState : function(store){
+        var state = store.getSortState();
+        if(!state){
+            return;
+        }
+        this.sortState = state;
+        var cs = this.view.columns, sortColumn = -1;
+        for(var i = 0, len = cs.length; i < len; i++){
+            if(cs[i].dataIndex == state.field){
+                sortColumn = i;
+                break;
+            }
+        }
+        if(sortColumn != -1){
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    updateSortIcon : function(col, dir){
+        var sc = this.sortClasses;
+        var hds = this.view.innerHd.select('em').removeClass(sc);
+        hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);
+    },
+
+    onHdClick : function(e){
+        var hd = e.getTarget('em', 3);
+        if(hd && !this.view.disableHeaders){
+            var index = this.view.findHeaderIndex(hd);
+            this.view.store.sort(this.view.columns[index].dataIndex);
+        }
+    }
+});
+
+// Backwards compatibility alias
+Ext.ListView.Sorter = Ext.list.Sorter;/**
+ * @class Ext.TabPanel
+ * <p>A basic tab container. TabPanels can be used exactly like a standard {@link Ext.Panel}
+ * for layout purposes, but also have special support for containing child Components
+ * (<tt>{@link Ext.Container#items items}</tt>) that are managed using a
+ * {@link Ext.layout.CardLayout CardLayout layout manager}, and displayed as separate tabs.</p>
+ *
+ * <b>Note:</b> By default, a tab's close tool <i>destroys</i> the child tab Component
+ * and all its descendants. This makes the child tab Component, and all its descendants <b>unusable</b>. To enable
+ * re-use of a tab, configure the TabPanel with <b><code>{@link #autoDestroy autoDestroy: false}</code></b>.
+ *
+ * <p><b><u>TabPanel header/footer elements</u></b></p>
+ * <p>TabPanels use their {@link Ext.Panel#header header} or {@link Ext.Panel#footer footer} element
+ * (depending on the {@link #tabPosition} configuration) to accommodate the tab selector buttons.
+ * This means that a TabPanel will not display any configured title, and will not display any
+ * configured header {@link Ext.Panel#tools tools}.</p>
+ * <p>To display a header, embed the TabPanel in a {@link Ext.Panel Panel} which uses
+ * <b><tt>{@link Ext.Container#layout layout:'fit'}</tt></b>.</p>
+ *
+ * <p><b><u>Tab Events</u></b></p>
+ * <p>There is no actual tab class &mdash; each tab is simply a {@link Ext.BoxComponent Component}
+ * such as a {@link Ext.Panel Panel}. However, when rendered in a TabPanel, each child Component
+ * can fire additional events that only exist for tabs and are not available from other Components.
+ * These events are:</p>
+ * <div><ul class="mdetail-params">
+ * <li><tt><b>{@link Ext.Panel#activate activate}</b></tt> : Fires when this Component becomes
+ * the active tab.</li>
+ * <li><tt><b>{@link Ext.Panel#deactivate deactivate}</b></tt> : Fires when the Component that
+ * was the active tab becomes deactivated.</li>
+ * <li><tt><b>{@link Ext.Panel#beforeclose beforeclose}</b></tt> : Fires when the user clicks on the close tool of a closeable tab.
+ * May be vetoed by returning <code>false</code> from a handler.</li>
+ * <li><tt><b>{@link Ext.Panel#close close}</b></tt> : Fires a closeable tab has been closed by the user.</li>
+ * </ul></div>
+ * <p><b><u>Creating TabPanels from Code</u></b></p>
+ * <p>TabPanels can be created and rendered completely in code, as in this example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: Ext.getBody(),
+    activeTab: 0,
+    items: [{
+        title: 'Tab 1',
+        html: 'A simple tab'
+    },{
+        title: 'Tab 2',
+        html: 'Another one'
+    }]
+});
+</code></pre>
+ * <p><b><u>Creating TabPanels from Existing Markup</u></b></p>
+ * <p>TabPanels can also be rendered from pre-existing markup in a couple of ways.</p>
+ * <div><ul class="mdetail-params">
+ *
+ * <li>Pre-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A container div with one or more nested tab divs with class <tt>'x-tab'</tt> can be rendered entirely
+ * from existing markup (See the {@link #autoTabs} example).</p>
+ * </div>
+ *
+ * <li>Un-Structured Markup</li>
+ * <div class="sub-desc">
+ * <p>A TabPanel can also be rendered from markup that is not strictly structured by simply specifying by id
+ * which elements should be the container and the tabs. Using this method tab content can be pulled from different
+ * elements within the page by id regardless of page structure. For example:</p>
+ * <pre><code>
+var tabs = new Ext.TabPanel({
+    renderTo: 'my-tabs',
+    activeTab: 0,
+    items:[
+        {contentEl:'tab1', title:'Tab 1'},
+        {contentEl:'tab2', title:'Tab 2'}
+    ]
+});
+
+// Note that the tabs do not have to be nested within the container (although they can be)
+&lt;div id="my-tabs">&lt;/div>
+&lt;div id="tab1" class="x-hide-display">A simple tab&lt;/div>
+&lt;div id="tab2" class="x-hide-display">Another one&lt;/div>
+</code></pre>
+ * Note that the tab divs in this example contain the class <tt>'x-hide-display'</tt> so that they can be rendered
+ * deferred without displaying outside the tabs. You could alternately set <tt>{@link #deferredRender} = false </tt>
+ * to render all content tabs on page load.
+ * </div>
+ *
+ * </ul></div>
+ *
+ * @extends Ext.Panel
+ * @constructor
+ * @param {Object} config The configuration options
+ * @xtype tabpanel
+ */
+Ext.TabPanel = Ext.extend(Ext.Panel,  {
+    /**
+     * @cfg {Boolean} layoutOnTabChange
+     * Set to true to force a layout of the active tab when the tab is changed. Defaults to false.
+     * See {@link Ext.layout.CardLayout}.<code>{@link Ext.layout.CardLayout#layoutOnCardChange layoutOnCardChange}</code>.
+     */
+    /**
+     * @cfg {String} tabCls <b>This config option is used on <u>child Components</u> of ths TabPanel.</b> A CSS
+     * class name applied to the tab strip item representing the child Component, allowing special
+     * styling to be applied.
+     */
+    /**
+     * @cfg {Boolean} deferredRender
+     * <p><tt>true</tt> by default to defer the rendering of child <tt>{@link Ext.Container#items items}</tt>
+     * to the browsers DOM until a tab is activated. <tt>false</tt> will render all contained
+     * <tt>{@link Ext.Container#items items}</tt> as soon as the {@link Ext.layout.CardLayout layout}
+     * is rendered. If there is a significant amount of content or a lot of heavy controls being
+     * rendered into panels that are not displayed by default, setting this to <tt>true</tt> might
+     * improve performance.</p>
+     * <br><p>The <tt>deferredRender</tt> property is internally passed to the layout manager for
+     * TabPanels ({@link Ext.layout.CardLayout}) as its {@link Ext.layout.CardLayout#deferredRender}
+     * configuration value.</p>
+     * <br><p><b>Note</b>: leaving <tt>deferredRender</tt> as <tt>true</tt> means that the content
+     * within an unactivated tab will not be available. For example, this means that if the TabPanel
+     * is within a {@link Ext.form.FormPanel form}, then until a tab is activated, any Fields within
+     * unactivated tabs will not be rendered, and will therefore not be submitted and will not be
+     * available to either {@link Ext.form.BasicForm#getValues getValues} or
+     * {@link Ext.form.BasicForm#setValues setValues}.</p>
+     */
+    deferredRender : true,
+    /**
+     * @cfg {Number} tabWidth The initial width in pixels of each new tab (defaults to 120).
+     */
+    tabWidth : 120,
+    /**
+     * @cfg {Number} minTabWidth The minimum width in pixels for each tab when {@link #resizeTabs} = true (defaults to 30).
+     */
+    minTabWidth : 30,
+    /**
+     * @cfg {Boolean} resizeTabs True to automatically resize each tab so that the tabs will completely fill the
+     * tab strip (defaults to false).  Setting this to true may cause specific widths that might be set per tab to
+     * be overridden in order to fit them all into view (although {@link #minTabWidth} will always be honored).
+     */
+    resizeTabs : false,
+    /**
+     * @cfg {Boolean} enableTabScroll True to enable scrolling to tabs that may be invisible due to overflowing the
+     * overall TabPanel width. Only available with tabPosition:'top' (defaults to false).
+     */
+    enableTabScroll : false,
+    /**
+     * @cfg {Number} scrollIncrement The number of pixels to scroll each time a tab scroll button is pressed
+     * (defaults to <tt>100</tt>, or if <tt>{@link #resizeTabs} = true</tt>, the calculated tab width).  Only
+     * applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    scrollIncrement : 0,
+    /**
+     * @cfg {Number} scrollRepeatInterval Number of milliseconds between each scroll while a tab scroll button is
+     * continuously pressed (defaults to <tt>400</tt>).
+     */
+    scrollRepeatInterval : 400,
+    /**
+     * @cfg {Float} scrollDuration The number of milliseconds that each scroll animation should last (defaults
+     * to <tt>.35</tt>). Only applies when <tt>{@link #animScroll} = true</tt>.
+     */
+    scrollDuration : 0.35,
+    /**
+     * @cfg {Boolean} animScroll True to animate tab scrolling so that hidden tabs slide smoothly into view (defaults
+     * to <tt>true</tt>).  Only applies when <tt>{@link #enableTabScroll} = true</tt>.
+     */
+    animScroll : true,
+    /**
+     * @cfg {String} tabPosition The position where the tab strip should be rendered (defaults to <tt>'top'</tt>).
+     * The only other supported value is <tt>'bottom'</tt>.  <b>Note</b>: tab scrolling is only supported for
+     * <tt>tabPosition: 'top'</tt>.
+     */
+    tabPosition : 'top',
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the panel (defaults to <tt>'x-tab-panel'</tt>).
+     */
+    baseCls : 'x-tab-panel',
+    /**
+     * @cfg {Boolean} autoTabs
+     * <p><tt>true</tt> to query the DOM for any divs with a class of 'x-tab' to be automatically converted
+     * to tabs and added to this panel (defaults to <tt>false</tt>).  Note that the query will be executed within
+     * the scope of the container element only (so that multiple tab panels from markup can be supported via this
+     * method).</p>
+     * <p>This method is only possible when the markup is structured correctly as a container with nested divs
+     * containing the class <tt>'x-tab'</tt>. To create TabPanels without these limitations, or to pull tab content
+     * from other elements on the page, see the example at the top of the class for generating tabs from markup.</p>
+     * <p>There are a couple of things to note when using this method:<ul>
+     * <li>When using the <tt>autoTabs</tt> config (as opposed to passing individual tab configs in the TabPanel's
+     * {@link #items} collection), you must use <tt>{@link #applyTo}</tt> to correctly use the specified <tt>id</tt>
+     * as the tab container. The <tt>autoTabs</tt> method <em>replaces</em> existing content with the TabPanel
+     * components.</li>
+     * <li>Make sure that you set <tt>{@link #deferredRender}: false</tt> so that the content elements for each
+     * tab will be rendered into the TabPanel immediately upon page load, otherwise they will not be transformed
+     * until each tab is activated and will be visible outside the TabPanel.</li>
+     * </ul>Example usage:</p>
+     * <pre><code>
+var tabs = new Ext.TabPanel({
+    applyTo: 'my-tabs',
+    activeTab: 0,
+    deferredRender: false,
+    autoTabs: true
+});
+
+// This markup will be converted to a TabPanel from the code above
+&lt;div id="my-tabs">
+    &lt;div class="x-tab" title="Tab 1">A simple tab&lt;/div>
+    &lt;div class="x-tab" title="Tab 2">Another one&lt;/div>
+&lt;/div>
+</code></pre>
+     */
+    autoTabs : false,
+    /**
+     * @cfg {String} autoTabSelector The CSS selector used to search for tabs in existing markup when
+     * <tt>{@link #autoTabs} = true</tt> (defaults to <tt>'div.x-tab'</tt>).  This can be any valid selector
+     * supported by {@link Ext.DomQuery#select}. Note that the query will be executed within the scope of this
+     * tab panel only (so that multiple tab panels from markup can be supported on a page).
+     */
+    autoTabSelector : 'div.x-tab',
+    /**
+     * @cfg {String/Number} activeTab A string id or the numeric index of the tab that should be initially
+     * activated on render (defaults to undefined).
+     */
+    activeTab : undefined,
+    /**
+     * @cfg {Number} tabMargin The number of pixels of space to calculate into the sizing and scrolling of
+     * tabs. If you change the margin in CSS, you will need to update this value so calculations are correct
+     * with either <tt>{@link #resizeTabs}</tt> or scrolling tabs. (defaults to <tt>2</tt>)
+     */
+    tabMargin : 2,
+    /**
+     * @cfg {Boolean} plain </tt>true</tt> to render the tab strip without a background container image
+     * (defaults to <tt>false</tt>).
+     */
+    plain : false,
+    /**
+     * @cfg {Number} wheelIncrement For scrolling tabs, the number of pixels to increment on mouse wheel
+     * scrolling (defaults to <tt>20</tt>).
+     */
+    wheelIncrement : 20,
+
+    /*
+     * This is a protected property used when concatenating tab ids to the TabPanel id for internal uniqueness.
+     * It does not generally need to be changed, but can be if external code also uses an id scheme that can
+     * potentially clash with this one.
+     */
+    idDelimiter : '__',
+
+    // private
+    itemCls : 'x-tab-item',
+
+    // private config overrides
+    elements : 'body',
+    headerAsText : false,
+    frame : false,
+    hideBorders :true,
+
+    // private
+    initComponent : function(){
+        this.frame = false;
+        Ext.TabPanel.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event beforetabchange
+             * Fires before the active tab changes. Handlers can <tt>return false</tt> to cancel the tab change.
+             * @param {TabPanel} this
+             * @param {Panel} newTab The tab being activated
+             * @param {Panel} currentTab The current active tab
+             */
+            'beforetabchange',
+            /**
+             * @event tabchange
+             * Fires after the active tab has changed.
+             * @param {TabPanel} this
+             * @param {Panel} tab The new active tab
+             */
+            'tabchange',
+            /**
+             * @event contextmenu
+             * Relays the contextmenu event from a tab selector element in the tab strip.
+             * @param {TabPanel} this
+             * @param {Panel} tab The target tab
+             * @param {EventObject} e
+             */
+            'contextmenu'
+        );
+        /**
+         * @cfg {Object} layoutConfig
+         * TabPanel implicitly uses {@link Ext.layout.CardLayout} as its layout manager.
+         * <code>layoutConfig</code> may be used to configure this layout manager.
+         * <code>{@link #deferredRender}</code> and <code>{@link #layoutOnTabChange}</code>
+         * configured on the TabPanel will be applied as configs to the layout manager.
+         */
+        this.setLayout(new Ext.layout.CardLayout(Ext.apply({
+            layoutOnCardChange: this.layoutOnTabChange,
+            deferredRender: this.deferredRender
+        }, this.layoutConfig)));
+
+        if(this.tabPosition == 'top'){
+            this.elements += ',header';
+            this.stripTarget = 'header';
+        }else {
+            this.elements += ',footer';
+            this.stripTarget = 'footer';
+        }
+        if(!this.stack){
+            this.stack = Ext.TabPanel.AccessStack();
+        }
+        this.initItems();
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.TabPanel.superclass.onRender.call(this, ct, position);
+
+        if(this.plain){
+            var pos = this.tabPosition == 'top' ? 'header' : 'footer';
+            this[pos].addClass('x-tab-panel-'+pos+'-plain');
+        }
+
+        var st = this[this.stripTarget];
+
+        this.stripWrap = st.createChild({cls:'x-tab-strip-wrap', cn:{
+            tag:'ul', cls:'x-tab-strip x-tab-strip-'+this.tabPosition}});
+
+        var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);
+        st.createChild({cls:'x-tab-strip-spacer'}, beforeEl);
+        this.strip = new Ext.Element(this.stripWrap.dom.firstChild);
+
+        // create an empty span with class x-tab-strip-text to force the height of the header element when there's no tabs.
+        this.edge = this.strip.createChild({tag:'li', cls:'x-tab-edge', cn: [{tag: 'span', cls: 'x-tab-strip-text', cn: '&#160;'}]});
+        this.strip.createChild({cls:'x-clear'});
+
+        this.body.addClass('x-tab-panel-body-'+this.tabPosition);
+
+        /**
+         * @cfg {Template/XTemplate} itemTpl <p>(Optional) A {@link Ext.Template Template} or
+         * {@link Ext.XTemplate XTemplate} which may be provided to process the data object returned from
+         * <tt>{@link #getTemplateArgs}</tt> to produce a clickable selector element in the tab strip.</p>
+         * <p>The main element created should be a <tt>&lt;li></tt> element. In order for a click event on
+         * a selector element to be connected to its item, it must take its <i>id</i> from the TabPanel's
+         * native <tt>{@link #getTemplateArgs}</tt>.</p>
+         * <p>The child element which contains the title text must be marked by the CSS class
+         * <tt>x-tab-strip-inner</tt>.</p>
+         * <p>To enable closability, the created element should contain an element marked by the CSS class
+         * <tt>x-tab-strip-close</tt>.</p>
+         * <p>If a custom <tt>itemTpl</tt> is supplied, it is the developer's responsibility to create CSS
+         * style rules to create the desired appearance.</p>
+         * Below is an example of how to create customized tab selector items:<pre><code>
+new Ext.TabPanel({
+    renderTo: document.body,
+    minTabWidth: 115,
+    tabWidth: 135,
+    enableTabScroll: true,
+    width: 600,
+    height: 250,
+    defaults: {autoScroll:true},
+    itemTpl: new Ext.XTemplate(
+    '&lt;li class="{cls}" id="{id}" style="overflow:hidden">',
+         '&lt;tpl if="closable">',
+            '&lt;a class="x-tab-strip-close">&lt;/a>',
+         '&lt;/tpl>',
+         '&lt;a class="x-tab-right" href="#" style="padding-left:6px">',
+            '&lt;em class="x-tab-left">',
+                '&lt;span class="x-tab-strip-inner">',
+                    '&lt;img src="{src}" style="float:left;margin:3px 3px 0 0">',
+                    '&lt;span style="margin-left:20px" class="x-tab-strip-text {iconCls}">{text} {extra}&lt;/span>',
+                '&lt;/span>',
+            '&lt;/em>',
+        '&lt;/a>',
+    '&lt;/li>'
+    ),
+    getTemplateArgs: function(item) {
+//      Call the native method to collect the base data. Like the ID!
+        var result = Ext.TabPanel.prototype.getTemplateArgs.call(this, item);
+
+//      Add stuff used in our template
+        return Ext.apply(result, {
+            closable: item.closable,
+            src: item.iconSrc,
+            extra: item.extraText || ''
+        });
+    },
+    items: [{
+        title: 'New Tab 1',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 1',
+        closable: true
+    }, {
+        title: 'New Tab 2',
+        iconSrc: '../shared/icons/fam/grid.png',
+        html: 'Tab Body 2',
+        extraText: 'Extra stuff in the tab button'
+    }]
+});
+</code></pre>
+         */
+        if(!this.itemTpl){
+            var tt = new Ext.Template(
+                 '<li class="{cls}" id="{id}"><a class="x-tab-strip-close"></a>',
+                 '<a class="x-tab-right" href="#"><em class="x-tab-left">',
+                 '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',
+                 '</em></a></li>'
+            );
+            tt.disableFormats = true;
+            tt.compile();
+            Ext.TabPanel.prototype.itemTpl = tt;
+        }
+
+        this.items.each(this.initTab, this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.TabPanel.superclass.afterRender.call(this);
+        if(this.autoTabs){
+            this.readTabs(false);
+        }
+        if(this.activeTab !== undefined){
+            var item = Ext.isObject(this.activeTab) ? this.activeTab : this.items.get(this.activeTab);
+            delete this.activeTab;
+            this.setActiveTab(item);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.TabPanel.superclass.initEvents.call(this);
+        this.mon(this.strip, {
+            scope: this,
+            mousedown: this.onStripMouseDown,
+            contextmenu: this.onStripContextMenu
+        });
+        if(this.enableTabScroll){
+            this.mon(this.strip, 'mousewheel', this.onWheel, this);
+        }
+    },
+
+    // private
+    findTargets : function(e){
+        var item = null,
+            itemEl = e.getTarget('li:not(.x-tab-edge)', this.strip);
+
+        if(itemEl){
+            item = this.getComponent(itemEl.id.split(this.idDelimiter)[1]);
+            if(item.disabled){
+                return {
+                    close : null,
+                    item : null,
+                    el : null
+                };
+            }
+        }
+        return {
+            close : e.getTarget('.x-tab-strip-close', this.strip),
+            item : item,
+            el : itemEl
+        };
+    },
+
+    // private
+    onStripMouseDown : function(e){
+        if(e.button !== 0){
+            return;
+        }
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.close){
+            if (t.item.fireEvent('beforeclose', t.item) !== false) {
+                t.item.fireEvent('close', t.item);
+                this.remove(t.item);
+            }
+            return;
+        }
+        if(t.item && t.item != this.activeTab){
+            this.setActiveTab(t.item);
+        }
+    },
+
+    // private
+    onStripContextMenu : function(e){
+        e.preventDefault();
+        var t = this.findTargets(e);
+        if(t.item){
+            this.fireEvent('contextmenu', this, t.item, e);
+        }
+    },
+
+    /**
+     * True to scan the markup in this tab panel for <tt>{@link #autoTabs}</tt> using the
+     * <tt>{@link #autoTabSelector}</tt>
+     * @param {Boolean} removeExisting True to remove existing tabs
+     */
+    readTabs : function(removeExisting){
+        if(removeExisting === true){
+            this.items.each(function(item){
+                this.remove(item);
+            }, this);
+        }
+        var tabs = this.el.query(this.autoTabSelector);
+        for(var i = 0, len = tabs.length; i < len; i++){
+            var tab = tabs[i],
+                title = tab.getAttribute('title');
+            tab.removeAttribute('title');
+            this.add({
+                title: title,
+                contentEl: tab
+            });
+        }
+    },
+
+    // private
+    initTab : function(item, index){
+        var before = this.strip.dom.childNodes[index],
+            p = this.getTemplateArgs(item),
+            el = before ?
+                 this.itemTpl.insertBefore(before, p) :
+                 this.itemTpl.append(this.strip, p),
+            cls = 'x-tab-strip-over',
+            tabEl = Ext.get(el);
+
+        tabEl.hover(function(){
+            if(!item.disabled){
+                tabEl.addClass(cls);
+            }
+        }, function(){
+            tabEl.removeClass(cls);
+        });
+
+        if(item.tabTip){
+            tabEl.child('span.x-tab-strip-text', true).qtip = item.tabTip;
+        }
+        item.tabEl = el;
+
+        // Route *keyboard triggered* click events to the tab strip mouse handler.
+        tabEl.select('a').on('click', function(e){
+            if(!e.getPageX()){
+                this.onStripMouseDown(e);
+            }
+        }, this, {preventDefault: true});
+
+        item.on({
+            scope: this,
+            disable: this.onItemDisabled,
+            enable: this.onItemEnabled,
+            titlechange: this.onItemTitleChanged,
+            iconchange: this.onItemIconChanged,
+            beforeshow: this.onBeforeShowItem
+        });
+    },
+
+
+
+    /**
+     * <p>Provides template arguments for rendering a tab selector item in the tab strip.</p>
+     * <p>This method returns an object hash containing properties used by the TabPanel's <tt>{@link #itemTpl}</tt>
+     * to create a formatted, clickable tab selector element. The properties which must be returned
+     * are:</p><div class="mdetail-params"><ul>
+     * <li><b>id</b> : String<div class="sub-desc">A unique identifier which links to the item</div></li>
+     * <li><b>text</b> : String<div class="sub-desc">The text to display</div></li>
+     * <li><b>cls</b> : String<div class="sub-desc">The CSS class name</div></li>
+     * <li><b>iconCls</b> : String<div class="sub-desc">A CSS class to provide appearance for an icon.</div></li>
+     * </ul></div>
+     * @param {Ext.BoxComponent} item The {@link Ext.BoxComponent BoxComponent} for which to create a selector element in the tab strip.
+     * @return {Object} An object hash containing the properties required to render the selector element.
+     */
+    getTemplateArgs : function(item) {
+        var cls = item.closable ? 'x-tab-strip-closable' : '';
+        if(item.disabled){
+            cls += ' x-item-disabled';
+        }
+        if(item.iconCls){
+            cls += ' x-tab-with-icon';
+        }
+        if(item.tabCls){
+            cls += ' ' + item.tabCls;
+        }
+
+        return {
+            id: this.id + this.idDelimiter + item.getItemId(),
+            text: item.title,
+            cls: cls,
+            iconCls: item.iconCls || ''
+        };
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.TabPanel.superclass.onAdd.call(this, c);
+        if(this.rendered){
+            var items = this.items;
+            this.initTab(c, items.indexOf(c));
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeAdd : function(item){
+        var existing = item.events ? (this.items.containsKey(item.getItemId()) ? item : null) : this.items.get(item);
+        if(existing){
+            this.setActiveTab(item);
+            return false;
+        }
+        Ext.TabPanel.superclass.onBeforeAdd.apply(this, arguments);
+        var es = item.elements;
+        item.elements = es ? es.replace(',header', '') : es;
+        item.border = (item.border === true);
+    },
+
+    // private
+    onRemove : function(c){
+        var te = Ext.get(c.tabEl);
+        // check if the tabEl exists, it won't if the tab isn't rendered
+        if(te){
+            te.select('a').removeAllListeners();
+            Ext.destroy(te);
+        }
+        Ext.TabPanel.superclass.onRemove.call(this, c);
+        this.stack.remove(c);
+        delete c.tabEl;
+        c.un('disable', this.onItemDisabled, this);
+        c.un('enable', this.onItemEnabled, this);
+        c.un('titlechange', this.onItemTitleChanged, this);
+        c.un('iconchange', this.onItemIconChanged, this);
+        c.un('beforeshow', this.onBeforeShowItem, this);
+        if(c == this.activeTab){
+            var next = this.stack.next();
+            if(next){
+                this.setActiveTab(next);
+            }else if(this.items.getCount() > 0){
+                this.setActiveTab(0);
+            }else{
+                this.setActiveTab(null);
+            }
+        }
+        if(!this.destroying){
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    onBeforeShowItem : function(item){
+        if(item != this.activeTab){
+            this.setActiveTab(item);
+            return false;
+        }
+    },
+
+    // private
+    onItemDisabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).addClass('x-item-disabled');
+        }
+        this.stack.remove(item);
+    },
+
+    // private
+    onItemEnabled : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).removeClass('x-item-disabled');
+        }
+    },
+
+    // private
+    onItemTitleChanged : function(item){
+        var el = this.getTabEl(item);
+        if(el){
+            Ext.fly(el).child('span.x-tab-strip-text', true).innerHTML = item.title;
+        }
+    },
+
+    //private
+    onItemIconChanged : function(item, iconCls, oldCls){
+        var el = this.getTabEl(item);
+        if(el){
+            el = Ext.get(el);
+            el.child('span.x-tab-strip-text').replaceClass(oldCls, iconCls);
+            el[Ext.isEmpty(iconCls) ? 'removeClass' : 'addClass']('x-tab-with-icon');
+        }
+    },
+
+    /**
+     * Gets the DOM element for the tab strip item which activates the child panel with the specified
+     * ID. Access this to change the visual treatment of the item, for example by changing the CSS class name.
+     * @param {Panel/Number/String} tab The tab component, or the tab's index, or the tabs id or itemId.
+     * @return {HTMLElement} The DOM node
+     */
+    getTabEl : function(item){
+        var c = this.getComponent(item);
+        return c ? c.tabEl : null;
+    },
+
+    // private
+    onResize : function(){
+        Ext.TabPanel.superclass.onResize.apply(this, arguments);
+        this.delegateUpdates();
+    },
+
+    /**
+     * Suspends any internal calculations or scrolling while doing a bulk operation. See {@link #endUpdate}
+     */
+    beginUpdate : function(){
+        this.suspendUpdates = true;
+    },
+
+    /**
+     * Resumes calculations and scrolling at the end of a bulk operation. See {@link #beginUpdate}
+     */
+    endUpdate : function(){
+        this.suspendUpdates = false;
+        this.delegateUpdates();
+    },
+
+    /**
+     * Hides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    hideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = 'none';
+            this.delegateUpdates();
+        }
+        this.stack.remove(item);
+    },
+
+    /**
+     * Unhides the tab strip item for the passed tab
+     * @param {Number/String/Panel} item The tab index, id or item
+     */
+    unhideTabStripItem : function(item){
+        item = this.getComponent(item);
+        var el = this.getTabEl(item);
+        if(el){
+            el.style.display = '';
+            this.delegateUpdates();
+        }
+    },
+
+    // private
+    delegateUpdates : function(){
+        var rendered = this.rendered;
+        if(this.suspendUpdates){
+            return;
+        }
+        if(this.resizeTabs && rendered){
+            this.autoSizeTabs();
+        }
+        if(this.enableTabScroll && rendered){
+            this.autoScrollTabs();
+        }
+    },
+
+    // private
+    autoSizeTabs : function(){
+        var count = this.items.length,
+            ce = this.tabPosition != 'bottom' ? 'header' : 'footer',
+            ow = this[ce].dom.offsetWidth,
+            aw = this[ce].dom.clientWidth;
+
+        if(!this.resizeTabs || count < 1 || !aw){ // !aw for display:none
+            return;
+        }
+
+        var each = Math.max(Math.min(Math.floor((aw-4) / count) - this.tabMargin, this.tabWidth), this.minTabWidth); // -4 for float errors in IE
+        this.lastTabWidth = each;
+        var lis = this.strip.query('li:not(.x-tab-edge)');
+        for(var i = 0, len = lis.length; i < len; i++) {
+            var li = lis[i],
+                inner = Ext.fly(li).child('.x-tab-strip-inner', true),
+                tw = li.offsetWidth,
+                iw = inner.offsetWidth;
+            inner.style.width = (each - (tw-iw)) + 'px';
+        }
+    },
+
+    // private
+    adjustBodyWidth : function(w){
+        if(this.header){
+            this.header.setWidth(w);
+        }
+        if(this.footer){
+            this.footer.setWidth(w);
+        }
+        return w;
+    },
+
+    /**
+     * Sets the specified tab as the active tab. This method fires the {@link #beforetabchange} event which
+     * can <tt>return false</tt> to cancel the tab change.
+     * @param {String/Number} item
+     * The id or tab Panel to activate. This parameter may be any of the following:
+     * <div><ul class="mdetail-params">
+     * <li>a <b><tt>String</tt></b> : representing the <code>{@link Ext.Component#itemId itemId}</code>
+     * or <code>{@link Ext.Component#id id}</code> of the child component </li>
+     * <li>a <b><tt>Number</tt></b> : representing the position of the child component
+     * within the <code>{@link Ext.Container#items items}</code> <b>property</b></li>
+     * </ul></div>
+     * <p>For additional information see {@link Ext.util.MixedCollection#get}.
+     */
+    setActiveTab : function(item){
+        item = this.getComponent(item);
+        if(this.fireEvent('beforetabchange', this, item, this.activeTab) === false){
+            return;
+        }
+        if(!this.rendered){
+            this.activeTab = item;
+            return;
+        }
+        if(this.activeTab != item){
+            if(this.activeTab){
+                var oldEl = this.getTabEl(this.activeTab);
+                if(oldEl){
+                    Ext.fly(oldEl).removeClass('x-tab-strip-active');
+                }
+            }
+            this.activeTab = item;
+            if(item){
+                var el = this.getTabEl(item);
+                Ext.fly(el).addClass('x-tab-strip-active');
+                this.stack.add(item);
+
+                this.layout.setActiveItem(item);
+                // Need to do this here, since setting the active tab slightly changes the size
+                this.delegateUpdates();
+                if(this.scrolling){
+                    this.scrollToTab(item, this.animScroll);
+                }
+            }
+            this.fireEvent('tabchange', this, item);
+        }
+    },
+
+    /**
+     * Returns the Component which is the currently active tab. <b>Note that before the TabPanel
+     * first activates a child Component, this method will return whatever was configured in the
+     * {@link #activeTab} config option.</b>
+     * @return {BoxComponent} The currently active child Component if one <i>is</i> active, or the {@link #activeTab} config value.
+     */
+    getActiveTab : function(){
+        return this.activeTab || null;
+    },
+
+    /**
+     * Gets the specified tab by id.
+     * @param {String} id The tab id
+     * @return {Panel} The tab
+     */
+    getItem : function(item){
+        return this.getComponent(item);
+    },
+
+    // private
+    autoScrollTabs : function(){
+        this.pos = this.tabPosition=='bottom' ? this.footer : this.header;
+        var count = this.items.length,
+            ow = this.pos.dom.offsetWidth,
+            tw = this.pos.dom.clientWidth,
+            wrap = this.stripWrap,
+            wd = wrap.dom,
+            cw = wd.offsetWidth,
+            pos = this.getScrollPos(),
+            l = this.edge.getOffsetsTo(this.stripWrap)[0] + pos;
+
+        if(!this.enableTabScroll || cw < 20){ // 20 to prevent display:none issues
+            return;
+        }
+        if(count == 0 || l <= tw){
+            // ensure the width is set if there's no tabs
+            wd.scrollLeft = 0;
+            wrap.setWidth(tw);
+            if(this.scrolling){
+                this.scrolling = false;
+                this.pos.removeClass('x-tab-scrolling');
+                this.scrollLeft.hide();
+                this.scrollRight.hide();
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '';
+                    wd.style.marginRight = '';
+                }
+            }
+        }else{
+            if(!this.scrolling){
+                this.pos.addClass('x-tab-scrolling');
+                // See here: http://extjs.com/forum/showthread.php?t=49308&highlight=isSafari
+                if(Ext.isAir || Ext.isWebKit){
+                    wd.style.marginLeft = '18px';
+                    wd.style.marginRight = '18px';
+                }
+            }
+            tw -= wrap.getMargins('lr');
+            wrap.setWidth(tw > 20 ? tw : 20);
+            if(!this.scrolling){
+                if(!this.scrollLeft){
+                    this.createScrollers();
+                }else{
+                    this.scrollLeft.show();
+                    this.scrollRight.show();
+                }
+            }
+            this.scrolling = true;
+            if(pos > (l-tw)){ // ensure it stays within bounds
+                wd.scrollLeft = l-tw;
+            }else{ // otherwise, make sure the active tab is still visible
+                this.scrollToTab(this.activeTab, false);
+            }
+            this.updateScrollButtons();
+        }
+    },
+
+    // private
+    createScrollers : function(){
+        this.pos.addClass('x-tab-scrolling-' + this.tabPosition);
+        var h = this.stripWrap.dom.offsetHeight;
+
+        // left
+        var sl = this.pos.insertFirst({
+            cls:'x-tab-scroller-left'
+        });
+        sl.setHeight(h);
+        sl.addClassOnOver('x-tab-scroller-left-over');
+        this.leftRepeater = new Ext.util.ClickRepeater(sl, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollLeft,
+            scope: this
+        });
+        this.scrollLeft = sl;
+
+        // right
+        var sr = this.pos.insertFirst({
+            cls:'x-tab-scroller-right'
+        });
+        sr.setHeight(h);
+        sr.addClassOnOver('x-tab-scroller-right-over');
+        this.rightRepeater = new Ext.util.ClickRepeater(sr, {
+            interval : this.scrollRepeatInterval,
+            handler: this.onScrollRight,
+            scope: this
+        });
+        this.scrollRight = sr;
+    },
+
+    // private
+    getScrollWidth : function(){
+        return this.edge.getOffsetsTo(this.stripWrap)[0] + this.getScrollPos();
+    },
+
+    // private
+    getScrollPos : function(){
+        return parseInt(this.stripWrap.dom.scrollLeft, 10) || 0;
+    },
+
+    // private
+    getScrollArea : function(){
+        return parseInt(this.stripWrap.dom.clientWidth, 10) || 0;
+    },
+
+    // private
+    getScrollAnim : function(){
+        return {duration:this.scrollDuration, callback: this.updateScrollButtons, scope: this};
+    },
+
+    // private
+    getScrollIncrement : function(){
+        return this.scrollIncrement || (this.resizeTabs ? this.lastTabWidth+2 : 100);
+    },
+
+    /**
+     * Scrolls to a particular tab if tab scrolling is enabled
+     * @param {Panel} item The item to scroll to
+     * @param {Boolean} animate True to enable animations
+     */
+
+    scrollToTab : function(item, animate){
+        if(!item){
+            return;
+        }
+        var el = this.getTabEl(item),
+            pos = this.getScrollPos(),
+            area = this.getScrollArea(),
+            left = Ext.fly(el).getOffsetsTo(this.stripWrap)[0] + pos,
+            right = left + el.offsetWidth;
+        if(left < pos){
+            this.scrollTo(left, animate);
+        }else if(right > (pos + area)){
+            this.scrollTo(right - area, animate);
+        }
+    },
+
+    // private
+    scrollTo : function(pos, animate){
+        this.stripWrap.scrollTo('left', pos, animate ? this.getScrollAnim() : false);
+        if(!animate){
+            this.updateScrollButtons();
+        }
+    },
+
+    onWheel : function(e){
+        var d = e.getWheelDelta()*this.wheelIncrement*-1;
+        e.stopEvent();
+
+        var pos = this.getScrollPos(),
+            newpos = pos + d,
+            sw = this.getScrollWidth()-this.getScrollArea();
+
+        var s = Math.max(0, Math.min(sw, newpos));
+        if(s != pos){
+            this.scrollTo(s, false);
+        }
+    },
+
+    // private
+    onScrollRight : function(){
+        var sw = this.getScrollWidth()-this.getScrollArea(),
+            pos = this.getScrollPos(),
+            s = Math.min(sw, pos + this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    onScrollLeft : function(){
+        var pos = this.getScrollPos(),
+            s = Math.max(0, pos - this.getScrollIncrement());
+        if(s != pos){
+            this.scrollTo(s, this.animScroll);
+        }
+    },
+
+    // private
+    updateScrollButtons : function(){
+        var pos = this.getScrollPos();
+        this.scrollLeft[pos === 0 ? 'addClass' : 'removeClass']('x-tab-scroller-left-disabled');
+        this.scrollRight[pos >= (this.getScrollWidth()-this.getScrollArea()) ? 'addClass' : 'removeClass']('x-tab-scroller-right-disabled');
+    },
+
+    // private
+    beforeDestroy : function() {
+        Ext.destroy(this.leftRepeater, this.rightRepeater);
+        this.deleteMembers('strip', 'edge', 'scrollLeft', 'scrollRight', 'stripWrap');
+        this.activeTab = null;
+        Ext.TabPanel.superclass.beforeDestroy.apply(this);
+    }
+
+    /**
+     * @cfg {Boolean} collapsible
+     * @hide
+     */
+    /**
+     * @cfg {String} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @cfg title
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Array} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} titleCollapse
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapsed
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+});
+Ext.reg('tabpanel', Ext.TabPanel);
+
+/**
+ * See {@link #setActiveTab}. Sets the specified tab as the active tab. This method fires
+ * the {@link #beforetabchange} event which can <tt>return false</tt> to cancel the tab change.
+ * @param {String/Panel} tab The id or tab Panel to activate
+ * @method activate
+ */
+Ext.TabPanel.prototype.activate = Ext.TabPanel.prototype.setActiveTab;
+
+// private utility class used by TabPanel
+Ext.TabPanel.AccessStack = function(){
+    var items = [];
+    return {
+        add : function(item){
+            items.push(item);
+            if(items.length > 10){
+                items.shift();
+            }
+        },
+
+        remove : function(item){
+            var s = [];
+            for(var i = 0, len = items.length; i < len; i++) {
+                if(items[i] != item){
+                    s.push(items[i]);
+                }
+            }
+            items = s;
+        },
+
+        next : function(){
+            return items.pop();
+        }
+    };
+};
+/**
+ * @class Ext.Button
+ * @extends Ext.BoxComponent
+ * Simple Button class
+ * @cfg {String} text The button text to be used as innerHTML (html tags are accepted)
+ * @cfg {String} icon The path to an image to display in the button (the image will be set as the background-image
+ * CSS property of the button by default, so if you want a mixed icon/text button, set cls:'x-btn-text-icon')
+ * @cfg {Function} handler A function called when the button is clicked (can be used instead of click event).
+ * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+ * <li><code>b</code> : Button<div class="sub-desc">This Button.</div></li>
+ * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+ * </ul></div>
+ * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width).
+ * See also {@link Ext.Panel}.<tt>{@link Ext.Panel#minButtonWidth minButtonWidth}</tt>.
+ * @cfg {String/Object} tooltip The tooltip for the button - can be a string to be used as innerHTML (html tags are accepted) or QuickTips config object
+ * @cfg {Boolean} hidden True to start hidden (defaults to false)
+ * @cfg {Boolean} disabled True to start disabled (defaults to false)
+ * @cfg {Boolean} pressed True to start pressed (only if enableToggle = true)
+ * @cfg {String} toggleGroup The group this toggle button is a member of (only 1 per group can be pressed)
+ * @cfg {Boolean/Object} repeat True to repeat fire the click event while the mouse is down. This can also be
+ * a {@link Ext.util.ClickRepeater ClickRepeater} config object (defaults to false).
+ * @constructor
+ * Create a new button
+ * @param {Object} config The config object
+ * @xtype button
+ */
+Ext.Button = Ext.extend(Ext.BoxComponent, {
+    /**
+     * Read-only. True if this button is hidden
+     * @type Boolean
+     */
+    hidden : false,
+    /**
+     * Read-only. True if this button is disabled
+     * @type Boolean
+     */
+    disabled : false,
+    /**
+     * Read-only. True if this button is pressed (only if enableToggle = true)
+     * @type Boolean
+     */
+    pressed : false,
+
+    /**
+     * @cfg {Number} tabIndex Set a DOM tabIndex for this button (defaults to undefined)
+     */
+
+    /**
+     * @cfg {Boolean} allowDepress
+     * False to not allow a pressed Button to be depressed (defaults to undefined). Only valid when {@link #enableToggle} is true.
+     */
+
+    /**
+     * @cfg {Boolean} enableToggle
+     * True to enable pressed/not pressed toggling (defaults to false)
+     */
+    enableToggle : false,
+    /**
+     * @cfg {Function} toggleHandler
+     * Function called when a Button with {@link #enableToggle} set to true is clicked. Two arguments are passed:<ul class="mdetail-params">
+     * <li><b>button</b> : Ext.Button<div class="sub-desc">this Button object</div></li>
+     * <li><b>state</b> : Boolean<div class="sub-desc">The next state of the Button, true means pressed.</div></li>
+     * </ul>
+     */
+    /**
+     * @cfg {Mixed} menu
+     * Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined).
+     */
+    /**
+     * @cfg {String} menuAlign
+     * The position to align the menu to (see {@link Ext.Element#alignTo} for more details, defaults to 'tl-bl?').
+     */
+    menuAlign : 'tl-bl?',
+
+    /**
+     * @cfg {String} overflowText If used in a {@link Ext.Toolbar Toolbar}, the
+     * text to be used if this item is shown in the overflow menu. See also
+     * {@link Ext.Toolbar.Item}.<code>{@link Ext.Toolbar.Item#overflowText overflowText}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A css class which sets a background image to be used as the icon for this button
+     */
+    /**
+     * @cfg {String} type
+     * submit, reset or button - defaults to 'button'
+     */
+    type : 'button',
+
+    // private
+    menuClassTarget : 'tr:nth(2)',
+
+    /**
+     * @cfg {String} clickEvent
+     * The DOM event that will fire the handler of the button. This can be any valid event name (dblclick, contextmenu).
+     * Defaults to <tt>'click'</tt>.
+     */
+    clickEvent : 'click',
+
+    /**
+     * @cfg {Boolean} handleMouseEvents
+     * False to disable visual cues on mouseover, mouseout and mousedown (defaults to true)
+     */
+    handleMouseEvents : true,
+
+    /**
+     * @cfg {String} tooltipType
+     * The type of tooltip to use. Either 'qtip' (default) for QuickTips or 'title' for title attribute.
+     */
+    tooltipType : 'qtip',
+
+    /**
+     * @cfg {String} buttonSelector
+     * <p>(Optional) A {@link Ext.DomQuery DomQuery} selector which is used to extract the active, clickable element from the
+     * DOM structure created.</p>
+     * <p>When a custom {@link #template} is used, you  must ensure that this selector results in the selection of
+     * a focussable element.</p>
+     * <p>Defaults to <b><tt>'button:first-child'</tt></b>.</p>
+     */
+    buttonSelector : 'button:first-child',
+
+    /**
+     * @cfg {String} scale
+     * <p>(Optional) The size of the Button. Three values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'small'<div class="sub-desc">Results in the button element being 16px high.</div></li>
+     * <li>'medium'<div class="sub-desc">Results in the button element being 24px high.</div></li>
+     * <li>'large'<div class="sub-desc">Results in the button element being 32px high.</div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'small'</tt></b>.</p>
+     */
+    scale : 'small',
+
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the
+     * <code>{@link #handler}</code> and <code>{@link #toggleHandler}</code> is
+     * executed. Defaults to this Button.
+     */
+
+    /**
+     * @cfg {String} iconAlign
+     * <p>(Optional) The side of the Button box to render the icon. Four values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'top'<div class="sub-desc"></div></li>
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * <li>'left'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'left'</tt></b>.</p>
+     */
+    iconAlign : 'left',
+
+    /**
+     * @cfg {String} arrowAlign
+     * <p>(Optional) The side of the Button box to render the arrow if the button has an associated {@link #menu}.
+     * Two values are allowed:</p>
+     * <ul class="mdetail-params">
+     * <li>'right'<div class="sub-desc"></div></li>
+     * <li>'bottom'<div class="sub-desc"></div></li>
+     * </ul>
+     * <p>Defaults to <b><tt>'right'</tt></b>.</p>
+     */
+    arrowAlign : 'right',
+
+    /**
+     * @cfg {Ext.Template} template (Optional)
+     * <p>A {@link Ext.Template Template} used to create the Button's DOM structure.</p>
+     * Instances, or subclasses which need a different DOM structure may provide a different
+     * template layout in conjunction with an implementation of {@link #getTemplateArgs}.
+     * @type Ext.Template
+     * @property template
+     */
+    /**
+     * @cfg {String} cls
+     * A CSS class string to apply to the button's main element.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object associated with this Button when configured with the {@link #menu} config option.
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * By default, if a width is not specified the button will attempt to stretch horizontally to fit its content.
+     * If the button is being managed by a width sizing layout (hbox, fit, anchor), set this to false to prevent
+     * the button from doing this automatic sizing.
+     * Defaults to <tt>undefined</tt>.
+     */
+
+    initComponent : function(){
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+        
+        Ext.Button.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this button is clicked
+             * @param {Button} this
+             * @param {EventObject} e The click event
+             */
+            'click',
+            /**
+             * @event toggle
+             * Fires when the 'pressed' state of this button changes (only if enableToggle = true)
+             * @param {Button} this
+             * @param {Boolean} pressed
+             */
+            'toggle',
+            /**
+             * @event mouseover
+             * Fires when the mouse hovers over the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits the button
+             * @param {Button} this
+             * @param {Event} e The event object
+             */
+            'mouseout',
+            /**
+             * @event menushow
+             * If this button has a menu, this event fires when it is shown
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menushow',
+            /**
+             * @event menuhide
+             * If this button has a menu, this event fires when it is hidden
+             * @param {Button} this
+             * @param {Menu} menu
+             */
+            'menuhide',
+            /**
+             * @event menutriggerover
+             * If this button has a menu, this event fires when the mouse enters the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerover',
+            /**
+             * @event menutriggerout
+             * If this button has a menu, this event fires when the mouse leaves the menu triggering element
+             * @param {Button} this
+             * @param {Menu} menu
+             * @param {EventObject} e
+             */
+            'menutriggerout'
+        );
+        
+        if(Ext.isString(this.toggleGroup)){
+            this.enableToggle = true;
+        }
+    },
+
+/**
+  * <p>This method returns an Array which provides substitution parameters for the {@link #template Template} used
+  * to create this Button's DOM structure.</p>
+  * <p>Instances or subclasses which use a different Template to create a different DOM structure may need to provide their
+  * own implementation of this method.</p>
+  * <p>The default implementation which provides data for the default {@link #template} returns an Array containing the
+  * following items:</p><div class="mdetail-params"><ul>
+  * <li>The &lt;button&gt;'s {@link #type}</li>
+  * <li>A CSS class name applied to the Button's main &lt;tbody&gt; element which determines the button's scale and icon alignment.</li>
+  * <li>A CSS class to determine the presence and position of an arrow icon. (<code>'x-btn-arrow'</code> or <code>'x-btn-arrow-bottom'</code> or <code>''</code>)</li>
+  * <li>The {@link #cls} CSS class name applied to the button's wrapping &lt;table&gt; element.</li>
+  * <li>The Component id which is applied to the button's wrapping &lt;table&gt; element.</li>
+  * </ul></div>
+  * @return {Array} Substitution data for a Template.
+ */
+    getTemplateArgs : function(){
+        return [this.type, 'x-btn-' + this.scale + ' x-btn-icon-' + this.scale + '-' + this.iconAlign, this.getMenuClass(), this.cls, this.id];
+    },
+
+    // private
+    setButtonClass : function(){
+        if(this.useSetClass){
+            if(!Ext.isEmpty(this.oldCls)){
+                this.el.removeClass([this.oldCls, 'x-btn-pressed']);
+            }
+            this.oldCls = (this.iconCls || this.icon) ? (this.text ? 'x-btn-text-icon' : 'x-btn-icon') : 'x-btn-noicon';
+            this.el.addClass([this.oldCls, this.pressed ? 'x-btn-pressed' : null]);
+        }
+    },
+
+    // protected
+    getMenuClass : function(){
+        return this.menu ? (this.arrowAlign != 'bottom' ? 'x-btn-arrow' : 'x-btn-arrow-bottom') : '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.template){
+            if(!Ext.Button.buttonTemplate){
+                // hideous table template
+                Ext.Button.buttonTemplate = new Ext.Template(
+                    '<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
+                    '<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i>&#160;</i></td></tr>',
+                    '<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',
+                    '</tbody></table>');
+                Ext.Button.buttonTemplate.compile();
+            }
+            this.template = Ext.Button.buttonTemplate;
+        }
+
+        var btn, targs = this.getTemplateArgs();
+
+        if(position){
+            btn = this.template.insertBefore(position, targs, true);
+        }else{
+            btn = this.template.append(ct, targs, true);
+        }
+        /**
+         * An {@link Ext.Element Element} encapsulating the Button's clickable element. By default,
+         * this references a <tt>&lt;button&gt;</tt> element. Read only.
+         * @type Ext.Element
+         * @property btnEl
+         */
+        this.btnEl = btn.child(this.buttonSelector);
+        this.mon(this.btnEl, {
+            scope: this,
+            focus: this.onFocus,
+            blur: this.onBlur
+        });
+
+        this.initButtonEl(btn, this.btnEl);
+
+        Ext.ButtonToggleMgr.register(this);
+    },
+
+    // private
+    initButtonEl : function(btn, btnEl){
+        this.el = btn;
+        this.setIcon(this.icon);
+        this.setText(this.text);
+        this.setIconClass(this.iconCls);
+        if(Ext.isDefined(this.tabIndex)){
+            btnEl.dom.tabIndex = this.tabIndex;
+        }
+        if(this.tooltip){
+            this.setTooltip(this.tooltip, true);
+        }
+
+        if(this.handleMouseEvents){
+            this.mon(btn, {
+                scope: this,
+                mouseover: this.onMouseOver,
+                mousedown: this.onMouseDown
+            });
+
+            // new functionality for monitoring on the document level
+            //this.mon(btn, 'mouseout', this.onMouseOut, this);
+        }
+
+        if(this.menu){
+            this.mon(this.menu, {
+                scope: this,
+                show: this.onMenuShow,
+                hide: this.onMenuHide
+            });
+        }
+
+        if(this.repeat){
+            var repeater = new Ext.util.ClickRepeater(btn, Ext.isObject(this.repeat) ? this.repeat : {});
+            this.mon(repeater, 'click', this.onRepeatClick, this);
+        }else{
+            this.mon(btn, this.clickEvent, this.onClick, this);
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Button.superclass.afterRender.call(this);
+        this.useSetClass = true;
+        this.setButtonClass();
+        this.doc = Ext.getDoc();
+        this.doAutoWidth();
+    },
+
+    /**
+     * Sets the CSS class that provides a background image to use as the button's icon.  This method also changes
+     * the value of the {@link iconCls} config internally.
+     * @param {String} cls The CSS class providing the icon image
+     * @return {Ext.Button} this
+     */
+    setIconClass : function(cls){
+        this.iconCls = cls;
+        if(this.el){
+            this.btnEl.dom.className = '';
+            this.btnEl.addClass(['x-btn-text', cls || '']);
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Sets the tooltip for this Button.
+     * @param {String/Object} tooltip. This may be:<div class="mdesc-details"><ul>
+     * <li><b>String</b> : A string to be used as innerHTML (html tags are accepted) to show in a tooltip</li>
+     * <li><b>Object</b> : A configuration object for {@link Ext.QuickTips#register}.</li>
+     * </ul></div>
+     * @return {Ext.Button} this
+     */
+    setTooltip : function(tooltip, /* private */ initial){
+        if(this.rendered){
+            if(!initial){
+                this.clearTip();
+            }
+            if(Ext.isObject(tooltip)){
+                Ext.QuickTips.register(Ext.apply({
+                      target: this.btnEl.id
+                }, tooltip));
+                this.tooltip = tooltip;
+            }else{
+                this.btnEl.dom[this.tooltipType] = tooltip;
+            }
+        }else{
+            this.tooltip = tooltip;
+        }
+        return this;
+    },
+
+    // private
+    clearTip : function(){
+        if(Ext.isObject(this.tooltip)){
+            Ext.QuickTips.unregister(this.btnEl);
+        }
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.rendered){
+            this.clearTip();
+        }
+        if(this.menu && this.destroyMenu !== false) {
+            Ext.destroy(this.btnEl, this.menu);
+        }
+        Ext.destroy(this.repeater);
+    },
+
+    // private
+    onDestroy : function(){
+        if(this.rendered){
+            this.doc.un('mouseover', this.monitorMouseOver, this);
+            this.doc.un('mouseup', this.onMouseUp, this);
+            delete this.doc;
+            delete this.btnEl;
+            Ext.ButtonToggleMgr.unregister(this);
+        }
+        Ext.Button.superclass.onDestroy.call(this);
+    },
+
+    // private
+    doAutoWidth : function(){
+        if(this.autoWidth !== false && this.el && this.text && this.width === undefined){
+            this.el.setWidth('auto');
+            if(Ext.isIE7 && Ext.isStrict){
+                var ib = this.btnEl;
+                if(ib && ib.getWidth() > 20){
+                    ib.clip();
+                    ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));
+                }
+            }
+            if(this.minWidth){
+                if(this.el.getWidth() < this.minWidth){
+                    this.el.setWidth(this.minWidth);
+                }
+            }
+        }
+    },
+
+    /**
+     * Assigns this Button's click handler
+     * @param {Function} handler The function to call when the button is clicked
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the handler function is executed.
+     * Defaults to this Button.
+     * @return {Ext.Button} this
+     */
+    setHandler : function(handler, scope){
+        this.handler = handler;
+        this.scope = scope;
+        return this;
+    },
+
+    /**
+     * Sets this Button's text
+     * @param {String} text The button text
+     * @return {Ext.Button} this
+     */
+    setText : function(text){
+        this.text = text;
+        if(this.el){
+            this.btnEl.update(text || '&#160;');
+            this.setButtonClass();
+        }
+        this.doAutoWidth();
+        return this;
+    },
+
+    /**
+     * Sets the background image (inline style) of the button.  This method also changes
+     * the value of the {@link icon} config internally.
+     * @param {String} icon The path to an image to display in the button
+     * @return {Ext.Button} this
+     */
+    setIcon : function(icon){
+        this.icon = icon;
+        if(this.el){
+            this.btnEl.setStyle('background-image', icon ? 'url(' + icon + ')' : '');
+            this.setButtonClass();
+        }
+        return this;
+    },
+
+    /**
+     * Gets the text for this Button
+     * @return {String} The button text
+     */
+    getText : function(){
+        return this.text;
+    },
+
+    /**
+     * If a state it passed, it becomes the pressed state otherwise the current state is toggled.
+     * @param {Boolean} state (optional) Force a particular state
+     * @param {Boolean} supressEvent (optional) True to stop events being fired when calling this method.
+     * @return {Ext.Button} this
+     */
+    toggle : function(state, suppressEvent){
+        state = state === undefined ? !this.pressed : !!state;
+        if(state != this.pressed){
+            if(this.rendered){
+                this.el[state ? 'addClass' : 'removeClass']('x-btn-pressed');
+            }
+            this.pressed = state;
+            if(!suppressEvent){
+                this.fireEvent('toggle', this, state);
+                if(this.toggleHandler){
+                    this.toggleHandler.call(this.scope || this, this, state);
+                }
+            }
+        }
+        return this;
+    },
+
+    // private
+    onDisable : function(){
+        this.onDisableChange(true);
+    },
+
+    // private
+    onEnable : function(){
+        this.onDisableChange(false);
+    },
+
+    onDisableChange : function(disabled){
+        if(this.el){
+            if(!Ext.isIE6 || !this.text){
+                this.el[disabled ? 'addClass' : 'removeClass'](this.disabledClass);
+            }
+            this.el.dom.disabled = disabled;
+        }
+        this.disabled = disabled;
+    },
+
+    /**
+     * Show this button's menu (if it has one)
+     */
+    showMenu : function(){
+        if(this.rendered && this.menu){
+            if(this.tooltip){
+                Ext.QuickTips.getQuickTip().cancelShow(this.btnEl);
+            }
+            if(this.menu.isVisible()){
+                this.menu.hide();
+            }
+            this.menu.ownerCt = this;
+            this.menu.show(this.el, this.menuAlign);
+        }
+        return this;
+    },
+
+    /**
+     * Hide this button's menu (if it has one)
+     */
+    hideMenu : function(){
+        if(this.hasVisibleMenu()){
+            this.menu.hide();
+        }
+        return this;
+    },
+
+    /**
+     * Returns true if the button has a menu and it is visible
+     * @return {Boolean}
+     */
+    hasVisibleMenu : function(){
+        return this.menu && this.menu.ownerCt == this && this.menu.isVisible();
+    },
+    
+    // private
+    onRepeatClick : function(repeat, e){
+        this.onClick(e);
+    },
+
+    // private
+    onClick : function(e){
+        if(e){
+            e.preventDefault();
+        }
+        if(e.button !== 0){
+            return;
+        }
+        if(!this.disabled){
+            this.doToggle();
+            if(this.menu && !this.hasVisibleMenu() && !this.ignoreNextClick){
+                this.showMenu();
+            }
+            this.fireEvent('click', this, e);
+            if(this.handler){
+                //this.el.removeClass('x-btn-over');
+                this.handler.call(this.scope || this, this, e);
+            }
+        }
+    },
+    
+    // private
+    doToggle: function(){
+        if (this.enableToggle && (this.allowDepress !== false || !this.pressed)) {
+            this.toggle();
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && !internal;
+    },
+
+    // private
+    onMouseOver : function(e){
+        if(!this.disabled){
+            var internal = e.within(this.el,  true);
+            if(!internal){
+                this.el.addClass('x-btn-over');
+                if(!this.monitoringMouseOver){
+                    this.doc.on('mouseover', this.monitorMouseOver, this);
+                    this.monitoringMouseOver = true;
+                }
+                this.fireEvent('mouseover', this, e);
+            }
+            if(this.isMenuTriggerOver(e, internal)){
+                this.fireEvent('menutriggerover', this, this.menu, e);
+            }
+        }
+    },
+
+    // private
+    monitorMouseOver : function(e){
+        if(e.target != this.el.dom && !e.within(this.el)){
+            if(this.monitoringMouseOver){
+                this.doc.un('mouseover', this.monitorMouseOver, this);
+                this.monitoringMouseOver = false;
+            }
+            this.onMouseOut(e);
+        }
+    },
+
+    // private
+    onMouseOut : function(e){
+        var internal = e.within(this.el) && e.target != this.el.dom;
+        this.el.removeClass('x-btn-over');
+        this.fireEvent('mouseout', this, e);
+        if(this.isMenuTriggerOut(e, internal)){
+            this.fireEvent('menutriggerout', this, this.menu, e);
+        }
+    },
+
+    focus : function() {
+        this.btnEl.focus();
+    },
+
+    blur : function() {
+        this.btnEl.blur();
+    },
+
+    // private
+    onFocus : function(e){
+        if(!this.disabled){
+            this.el.addClass('x-btn-focus');
+        }
+    },
+    // private
+    onBlur : function(e){
+        this.el.removeClass('x-btn-focus');
+    },
+
+    // private
+    getClickEl : function(e, isUp){
+       return this.el;
+    },
+
+    // private
+    onMouseDown : function(e){
+        if(!this.disabled && e.button === 0){
+            this.getClickEl(e).addClass('x-btn-click');
+            this.doc.on('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMouseUp : function(e){
+        if(e.button === 0){
+            this.getClickEl(e, true).removeClass('x-btn-click');
+            this.doc.un('mouseup', this.onMouseUp, this);
+        }
+    },
+    // private
+    onMenuShow : function(e){
+        if(this.menu.ownerCt == this){
+            this.menu.ownerCt = this;
+            this.ignoreNextClick = 0;
+            this.el.addClass('x-btn-menu-active');
+            this.fireEvent('menushow', this, this.menu);
+        }
+    },
+    // private
+    onMenuHide : function(e){
+        if(this.menu.ownerCt == this){
+            this.el.removeClass('x-btn-menu-active');
+            this.ignoreNextClick = this.restoreClick.defer(250, this);
+            this.fireEvent('menuhide', this, this.menu);
+            delete this.menu.ownerCt;
+        }
+    },
+
+    // private
+    restoreClick : function(){
+        this.ignoreNextClick = 0;
+    }
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String/Object} html @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+});
+Ext.reg('button', Ext.Button);
+
+// Private utility class used by Button
+Ext.ButtonToggleMgr = function(){
+   var groups = {};
+
+   function toggleGroup(btn, state){
+       if(state){
+           var g = groups[btn.toggleGroup];
+           for(var i = 0, l = g.length; i < l; i++){
+               if(g[i] != btn){
+                   g[i].toggle(false);
+               }
+           }
+       }
+   }
+
+   return {
+       register : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(!g){
+               g = groups[btn.toggleGroup] = [];
+           }
+           g.push(btn);
+           btn.on('toggle', toggleGroup);
+       },
+
+       unregister : function(btn){
+           if(!btn.toggleGroup){
+               return;
+           }
+           var g = groups[btn.toggleGroup];
+           if(g){
+               g.remove(btn);
+               btn.un('toggle', toggleGroup);
+           }
+       },
+
+       /**
+        * Gets the pressed button in the passed group or null
+        * @param {String} group
+        * @return Button
+        */
+       getPressed : function(group){
+           var g = groups[group];
+           if(g){
+               for(var i = 0, len = g.length; i < len; i++){
+                   if(g[i].pressed === true){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+/**
+ * @class Ext.SplitButton
+ * @extends Ext.Button
+ * A split button that provides a built-in dropdown arrow that can fire an event separately from the default
+ * click event of the button.  Typically this would be used to display a dropdown menu that provides additional
+ * options to the primary button action, but any custom handler can provide the arrowclick implementation.  Example usage:
+ * <pre><code>
+// display a dropdown menu:
+new Ext.SplitButton({
+	renderTo: 'button-ct', // the container id
+   	text: 'Options',
+   	handler: optionsHandler, // handle a click on the button itself
+   	menu: new Ext.menu.Menu({
+        items: [
+        	// these items will render as dropdown menu items when the arrow is clicked:
+	        {text: 'Item 1', handler: item1Handler},
+	        {text: 'Item 2', handler: item2Handler}
+        ]
+   	})
+});
+
+// Instead of showing a menu, you provide any type of custom
+// functionality you want when the dropdown arrow is clicked:
+new Ext.SplitButton({
+	renderTo: 'button-ct',
+   	text: 'Options',
+   	handler: optionsHandler,
+   	arrowHandler: myCustomHandler
+});
+</code></pre>
+ * @cfg {Function} arrowHandler A function called when the arrow button is clicked (can be used instead of click event)
+ * @cfg {String} arrowTooltip The title attribute of the arrow
+ * @constructor
+ * Create a new menu button
+ * @param {Object} config The config object
+ * @xtype splitbutton
+ */
+Ext.SplitButton = Ext.extend(Ext.Button, {
+	// private
+    arrowSelector : 'em',
+    split: true,
+
+    // private
+    initComponent : function(){
+        Ext.SplitButton.superclass.initComponent.call(this);
+        /**
+         * @event arrowclick
+         * Fires when this button's arrow is clicked
+         * @param {MenuButton} this
+         * @param {EventObject} e The click event
+         */
+        this.addEvents("arrowclick");
+    },
+
+    // private
+    onRender : function(){
+        Ext.SplitButton.superclass.onRender.apply(this, arguments);
+        if(this.arrowTooltip){
+            this.el.child(this.arrowSelector).dom[this.tooltipType] = this.arrowTooltip;
+        }
+    },
+
+    /**
+     * Sets this button's arrow click handler.
+     * @param {Function} handler The function to call when the arrow is clicked
+     * @param {Object} scope (optional) Scope for the function passed above
+     */
+    setArrowHandler : function(handler, scope){
+        this.arrowHandler = handler;
+        this.scope = scope;
+    },
+
+    getMenuClass : function(){
+        return 'x-btn-split' + (this.arrowAlign == 'bottom' ? '-bottom' : '');
+    },
+
+    isClickOnArrow : function(e){
+	if (this.arrowAlign != 'bottom') {
+	    var visBtn = this.el.child('em.x-btn-split');
+	    var right = visBtn.getRegion().right - visBtn.getPadding('r');
+	    return e.getPageX() > right;
+	} else {
+	    return e.getPageY() > this.btnEl.getRegion().bottom;
+	}
+    },
+
+    // private
+    onClick : function(e, t){
+        e.preventDefault();
+        if(!this.disabled){
+            if(this.isClickOnArrow(e)){
+                if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){
+                    this.showMenu();
+                }
+                this.fireEvent("arrowclick", this, e);
+                if(this.arrowHandler){
+                    this.arrowHandler.call(this.scope || this, this, e);
+                }
+            }else{
+                this.doToggle();
+                this.fireEvent("click", this, e);
+                if(this.handler){
+                    this.handler.call(this.scope || this, this, e);
+                }
+            }
+        }
+    },
+
+    // private
+    isMenuTriggerOver : function(e){
+        return this.menu && e.target.tagName == this.arrowSelector;
+    },
+
+    // private
+    isMenuTriggerOut : function(e, internal){
+        return this.menu && e.target.tagName != this.arrowSelector;
+    }
+});
+
+Ext.reg('splitbutton', Ext.SplitButton);/**
+ * @class Ext.CycleButton
+ * @extends Ext.SplitButton
+ * A specialized SplitButton that contains a menu of {@link Ext.menu.CheckItem} elements.  The button automatically
+ * cycles through each menu item on click, raising the button's {@link #change} event (or calling the button's
+ * {@link #changeHandler} function, if supplied) for the active menu item. Clicking on the arrow section of the
+ * button displays the dropdown menu just like a normal SplitButton.  Example usage:
+ * <pre><code>
+var btn = new Ext.CycleButton({
+    showText: true,
+    prependText: 'View as ',
+    items: [{
+        text:'text only',
+        iconCls:'view-text',
+        checked:true
+    },{
+        text:'HTML',
+        iconCls:'view-html'
+    }],
+    changeHandler:function(btn, item){
+        Ext.Msg.alert('Change View', item.text);
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new split button
+ * @param {Object} config The config object
+ * @xtype cycle
+ */
+Ext.CycleButton = Ext.extend(Ext.SplitButton, {
+    /**
+     * @cfg {Array} items An array of {@link Ext.menu.CheckItem} <b>config</b> objects to be used when creating the
+     * button's menu items (e.g., {text:'Foo', iconCls:'foo-icon'})
+     */
+    /**
+     * @cfg {Boolean} showText True to display the active item's text as the button text (defaults to false)
+     */
+    /**
+     * @cfg {String} prependText A static string to prepend before the active item's text when displayed as the
+     * button's text (only applies when showText = true, defaults to '')
+     */
+    /**
+     * @cfg {Function} changeHandler A callback function that will be invoked each time the active menu
+     * item in the button's menu has changed.  If this callback is not supplied, the SplitButton will instead
+     * fire the {@link #change} event on active item change.  The changeHandler function will be called with the
+     * following argument list: (SplitButton this, Ext.menu.CheckItem item)
+     */
+    /**
+     * @cfg {String} forceIcon A css class which sets an image to be used as the static icon for this button.  This
+     * icon will always be displayed regardless of which item is selected in the dropdown list.  This overrides the 
+     * default behavior of changing the button's icon to match the selected item's icon on change.
+     */
+    /**
+     * @property menu
+     * @type Menu
+     * The {@link Ext.menu.Menu Menu} object used to display the {@link Ext.menu.CheckItem CheckItems} representing the available choices.
+     */
+
+    // private
+    getItemText : function(item){
+        if(item && this.showText === true){
+            var text = '';
+            if(this.prependText){
+                text += this.prependText;
+            }
+            text += item.text;
+            return text;
+        }
+        return undefined;
+    },
+
+    /**
+     * Sets the button's active menu item.
+     * @param {Ext.menu.CheckItem} item The item to activate
+     * @param {Boolean} suppressEvent True to prevent the button's change event from firing (defaults to false)
+     */
+    setActiveItem : function(item, suppressEvent){
+        if(!Ext.isObject(item)){
+            item = this.menu.getComponent(item);
+        }
+        if(item){
+            if(!this.rendered){
+                this.text = this.getItemText(item);
+                this.iconCls = item.iconCls;
+            }else{
+                var t = this.getItemText(item);
+                if(t){
+                    this.setText(t);
+                }
+                this.setIconClass(item.iconCls);
+            }
+            this.activeItem = item;
+            if(!item.checked){
+                item.setChecked(true, suppressEvent);
+            }
+            if(this.forceIcon){
+                this.setIconClass(this.forceIcon);
+            }
+            if(!suppressEvent){
+                this.fireEvent('change', this, item);
+            }
+        }
+    },
+
+    /**
+     * Gets the currently active menu item.
+     * @return {Ext.menu.CheckItem} The active item
+     */
+    getActiveItem : function(){
+        return this.activeItem;
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the button's active menu item has changed.  Note that if a {@link #changeHandler} function
+             * is set on this CycleButton, it will be called instead on active item change and this change event will
+             * not be fired.
+             * @param {Ext.CycleButton} this
+             * @param {Ext.menu.CheckItem} item The menu item that was selected
+             */
+            "change"
+        );
+
+        if(this.changeHandler){
+            this.on('change', this.changeHandler, this.scope||this);
+            delete this.changeHandler;
+        }
+
+        this.itemCount = this.items.length;
+
+        this.menu = {cls:'x-cycle-menu', items:[]};
+        var checked = 0;
+        Ext.each(this.items, function(item, i){
+            Ext.apply(item, {
+                group: item.group || this.id,
+                itemIndex: i,
+                checkHandler: this.checkHandler,
+                scope: this,
+                checked: item.checked || false
+            });
+            this.menu.items.push(item);
+            if(item.checked){
+                checked = i;
+            }
+        }, this);
+        Ext.CycleButton.superclass.initComponent.call(this);
+        this.on('click', this.toggleSelected, this);
+        this.setActiveItem(checked, true);
+    },
+
+    // private
+    checkHandler : function(item, pressed){
+        if(pressed){
+            this.setActiveItem(item);
+        }
+    },
+
+    /**
+     * This is normally called internally on button click, but can be called externally to advance the button's
+     * active item programmatically to the next one in the menu.  If the current item is the last one in the menu
+     * the active item will be set to the first item in the menu.
+     */
+    toggleSelected : function(){
+        var m = this.menu;
+        m.render();
+        // layout if we haven't before so the items are active
+        if(!m.hasLayout){
+            m.doLayout();
+        }
+        
+        var nextIdx, checkItem;
+        for (var i = 1; i < this.itemCount; i++) {
+            nextIdx = (this.activeItem.itemIndex + i) % this.itemCount;
+            // check the potential item
+            checkItem = m.items.itemAt(nextIdx);
+            // if its not disabled then check it.
+            if (!checkItem.disabled) {
+                checkItem.setChecked(true);
+                break;
+            }
+        }
+    }
+});
+Ext.reg('cycle', Ext.CycleButton);/**
+ * @class Ext.Toolbar
+ * @extends Ext.Container
+ * <p>Basic Toolbar class. Although the <tt>{@link Ext.Container#defaultType defaultType}</tt> for Toolbar
+ * is <tt>{@link Ext.Button button}</tt>, Toolbar elements (child items for the Toolbar container) may
+ * be virtually any type of Component. Toolbar elements can be created explicitly via their constructors,
+ * or implicitly via their xtypes, and can be <tt>{@link #add}</tt>ed dynamically.</p>
+ * <p>Some items have shortcut strings for creation:</p>
+ * <pre>
+<u>Shortcut</u>  <u>xtype</u>          <u>Class</u>                  <u>Description</u>
+'->'      'tbfill'       {@link Ext.Toolbar.Fill}       begin using the right-justified button container
+'-'       'tbseparator'  {@link Ext.Toolbar.Separator}  add a vertical separator bar between toolbar items
+' '       'tbspacer'     {@link Ext.Toolbar.Spacer}     add horiztonal space between elements
+ * </pre>
+ *
+ * Example usage of various elements:
+ * <pre><code>
+var tb = new Ext.Toolbar({
+    renderTo: document.body,
+    width: 600,
+    height: 100,
+    items: [
+        {
+            // xtype: 'button', // default for Toolbars, same as 'tbbutton'
+            text: 'Button'
+        },
+        {
+            xtype: 'splitbutton', // same as 'tbsplitbutton'
+            text: 'Split Button'
+        },
+        // begin using the right-justified button container
+        '->', // same as {xtype: 'tbfill'}, // Ext.Toolbar.Fill
+        {
+            xtype: 'textfield',
+            name: 'field1',
+            emptyText: 'enter search term'
+        },
+        // add a vertical separator bar between toolbar items
+        '-', // same as {xtype: 'tbseparator'} to create Ext.Toolbar.Separator
+        'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.Toolbar.TextItem
+        {xtype: 'tbspacer'},// same as ' ' to create Ext.Toolbar.Spacer
+        'text 2',
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'text 3'
+    ]
+});
+ * </code></pre>
+ * Example adding a ComboBox within a menu of a button:
+ * <pre><code>
+// ComboBox creation
+var combo = new Ext.form.ComboBox({
+    store: new Ext.data.ArrayStore({
+        autoDestroy: true,
+        fields: ['initials', 'fullname'],
+        data : [
+            ['FF', 'Fred Flintstone'],
+            ['BR', 'Barney Rubble']
+        ]
+    }),
+    displayField: 'fullname',
+    typeAhead: true,
+    mode: 'local',
+    forceSelection: true,
+    triggerAction: 'all',
+    emptyText: 'Select a name...',
+    selectOnFocus: true,
+    width: 135,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon' //use iconCls if placing within menu to shift to right side of menu
+});
+
+// put ComboBox in a Menu
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+
+// add a Button with the menu
+tb.add({
+        text:'Button w/ Menu',
+        menu: menu  // assign menu by instance
+    });
+tb.doLayout();
+ * </code></pre>
+ * @constructor
+ * Creates a new Toolbar
+ * @param {Object/Array} config A config object or an array of buttons to <tt>{@link #add}</tt>
+ * @xtype toolbar
+ */
+Ext.Toolbar = function(config){
+    if(Ext.isArray(config)){
+        config = {items: config, layout: 'toolbar'};
+    } else {
+        config = Ext.apply({
+            layout: 'toolbar'
+        }, config);
+        if(config.buttons) {
+            config.items = config.buttons;
+        }
+    }
+    Ext.Toolbar.superclass.constructor.call(this, config);
+};
+
+(function(){
+
+var T = Ext.Toolbar;
+
+Ext.extend(T, Ext.Container, {
+
+    defaultType: 'button',
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>toolbar</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout
+     * is required (the constructor must be passed a configuration object in this
+     * case instead of an array).
+     * See {@link Ext.Container#layout} for additional information.
+     */
+
+    enableOverflow : false,
+
+    /**
+     * @cfg {Boolean} enableOverflow
+     * Defaults to false. Configure <tt>true</tt> to make the toolbar provide a button
+     * which activates a dropdown Menu to show items which overflow the Toolbar's width.
+     */
+    /**
+     * @cfg {String} buttonAlign
+     * <p>The default position at which to align child items. Defaults to <code>"left"</code></p>
+     * <p>May be specified as <code>"center"</code> to cause items added before a Fill (A <code>"->"</code>) item
+     * to be centered in the Toolbar. Items added after a Fill are still right-aligned.</p>
+     * <p>Specify as <code>"right"</code> to right align all child items.</p>
+     */
+
+    trackMenus : true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+    toolbarCls: 'x-toolbar',
+
+    initComponent : function(){
+        T.superclass.initComponent.call(this);
+
+        /**
+         * @event overflowchange
+         * Fires after the overflow state has changed.
+         * @param {Object} c The Container
+         * @param {Boolean} lastOverflow overflow state
+         */
+        this.addEvents('overflowchange');
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            if(!this.autoCreate){
+                this.autoCreate = {
+                    cls: this.toolbarCls + ' x-small-editor'
+                };
+            }
+            this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);
+            Ext.Toolbar.superclass.onRender.apply(this, arguments);
+        }
+    },
+
+    /**
+     * <p>Adds element(s) to the toolbar -- this function takes a variable number of
+     * arguments of mixed type and adds them to the toolbar.</p>
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} arg1 The following types of arguments are all valid:<br />
+     * <ul>
+     * <li>{@link Ext.Button} config: A valid button config object (equivalent to {@link #addButton})</li>
+     * <li>HtmlElement: Any standard HTML element (equivalent to {@link #addElement})</li>
+     * <li>Field: Any form field (equivalent to {@link #addField})</li>
+     * <li>Item: Any subclass of {@link Ext.Toolbar.Item} (equivalent to {@link #addItem})</li>
+     * <li>String: Any generic string (gets wrapped in a {@link Ext.Toolbar.TextItem}, equivalent to {@link #addText}).
+     * Note that there are a few special strings that are treated differently as explained next.</li>
+     * <li>'-': Creates a separator element (equivalent to {@link #addSeparator})</li>
+     * <li>' ': Creates a spacer element (equivalent to {@link #addSpacer})</li>
+     * <li>'->': Creates a fill element (equivalent to {@link #addFill})</li>
+     * </ul>
+     * @param {Mixed} arg2
+     * @param {Mixed} etc.
+     * @method add
+     */
+
+    // private
+    lookupComponent : function(c){
+        if(Ext.isString(c)){
+            if(c == '-'){
+                c = new T.Separator();
+            }else if(c == ' '){
+                c = new T.Spacer();
+            }else if(c == '->'){
+                c = new T.Fill();
+            }else{
+                c = new T.TextItem(c);
+            }
+            this.applyDefaults(c);
+        }else{
+            if(c.isFormField || c.render){ // some kind of form field, some kind of Toolbar.Item
+                c = this.createComponent(c);
+            }else if(c.tag){ // DomHelper spec
+                c = new T.Item({autoEl: c});
+            }else if(c.tagName){ // element
+                c = new T.Item({el:c});
+            }else if(Ext.isObject(c)){ // must be button config?
+                c = c.xtype ? this.createComponent(c) : this.constructButton(c);
+            }
+        }
+        return c;
+    },
+
+    // private
+    applyDefaults : function(c){
+        if(!Ext.isString(c)){
+            c = Ext.Toolbar.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(c.events){
+                Ext.applyIf(c.initialConfig, d);
+                Ext.apply(c, d);
+            }else{
+                Ext.applyIf(c, d);
+            }
+        }
+        return c;
+    },
+
+    /**
+     * Adds a separator
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Item} The separator {@link Ext.Toolbar.Item item}
+     */
+    addSeparator : function(){
+        return this.add(new T.Separator());
+    },
+
+    /**
+     * Adds a spacer element
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @return {Ext.Toolbar.Spacer} The spacer item
+     */
+    addSpacer : function(){
+        return this.add(new T.Spacer());
+    },
+
+    /**
+     * Forces subsequent additions into the float:right toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     */
+    addFill : function(){
+        this.add(new T.Fill());
+    },
+
+    /**
+     * Adds any standard HTML element to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Mixed} el The element or id of the element to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addElement : function(el){
+        return this.addItem(new T.Item({el:el}));
+    },
+
+    /**
+     * Adds any Toolbar.Item or subclass
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.Toolbar.Item} item
+     * @return {Ext.Toolbar.Item} The item
+     */
+    addItem : function(item){
+        return this.add.apply(this, arguments);
+    },
+
+    /**
+     * Adds a button (or buttons). See {@link Ext.Button} for more info on the config.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object/Array} config A button config or array of configs
+     * @return {Ext.Button/Array}
+     */
+    addButton : function(config){
+        if(Ext.isArray(config)){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+                buttons.push(this.addButton(config[i]));
+            }
+            return buttons;
+        }
+        return this.add(this.constructButton(config));
+    },
+
+    /**
+     * Adds text to the toolbar
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {String} text The text to add
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addText : function(text){
+        return this.addItem(new T.TextItem(text));
+    },
+
+    /**
+     * Adds a new element to the toolbar from the passed {@link Ext.DomHelper} config
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Object} config
+     * @return {Ext.Toolbar.Item} The element's item
+     */
+    addDom : function(config){
+        return this.add(new T.Item({autoEl: config}));
+    },
+
+    /**
+     * Adds a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have
+     * been rendered yet. For a field that has already been rendered, use {@link #addElement}.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Ext.form.Field} field
+     * @return {Ext.Toolbar.Item}
+     */
+    addField : function(field){
+        return this.add(field);
+    },
+
+    /**
+     * Inserts any {@link Ext.Toolbar.Item}/{@link Ext.Button} at the specified index.
+     * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>
+     * @param {Number} index The index where the item is to be inserted
+     * @param {Object/Ext.Toolbar.Item/Ext.Button/Array} item The button, or button config object to be
+     * inserted, or an array of buttons/configs.
+     * @return {Ext.Button/Item}
+     */
+    insertButton : function(index, item){
+        if(Ext.isArray(item)){
+            var buttons = [];
+            for(var i = 0, len = item.length; i < len; i++) {
+               buttons.push(this.insertButton(index + i, item[i]));
+            }
+            return buttons;
+        }
+        return Ext.Toolbar.superclass.insert.call(this, index, item);
+    },
+
+    // private
+    trackMenu : function(item, remove){
+        if(this.trackMenus && item.menu){
+            var method = remove ? 'mun' : 'mon';
+            this[method](item, 'menutriggerover', this.onButtonTriggerOver, this);
+            this[method](item, 'menushow', this.onButtonMenuShow, this);
+            this[method](item, 'menuhide', this.onButtonMenuHide, this);
+        }
+    },
+
+    // private
+    constructButton : function(item){
+        var b = item.events ? item : this.createComponent(item, item.split ? 'splitbutton' : this.defaultType);
+        return b;
+    },
+
+    // private
+    onAdd : function(c){
+        Ext.Toolbar.superclass.onAdd.call(this);
+        this.trackMenu(c);
+        if(this.disabled){
+            c.disable();
+        }
+    },
+
+    // private
+    onRemove : function(c){
+        Ext.Toolbar.superclass.onRemove.call(this);
+        if (c == this.activeMenuBtn) {
+            delete this.activeMenuBtn;
+        }
+        this.trackMenu(c, true);
+    },
+
+    // private
+    onDisable : function(){
+        this.items.each(function(item){
+             if(item.disable){
+                 item.disable();
+             }
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.items.each(function(item){
+             if(item.enable){
+                 item.enable();
+             }
+        });
+    },
+
+    // private
+    onButtonTriggerOver : function(btn){
+        if(this.activeMenuBtn && this.activeMenuBtn != btn){
+            this.activeMenuBtn.hideMenu();
+            btn.showMenu();
+            this.activeMenuBtn = btn;
+        }
+    },
+
+    // private
+    onButtonMenuShow : function(btn){
+        this.activeMenuBtn = btn;
+    },
+
+    // private
+    onButtonMenuHide : function(btn){
+        delete this.activeMenuBtn;
+    }
+});
+Ext.reg('toolbar', Ext.Toolbar);
+
+/**
+ * @class Ext.Toolbar.Item
+ * @extends Ext.BoxComponent
+ * The base class that other non-interacting Toolbar Item classes should extend in order to
+ * get some basic common toolbar item functionality.
+ * @constructor
+ * Creates a new Item
+ * @param {HTMLElement} el
+ * @xtype tbitem
+ */
+T.Item = Ext.extend(Ext.BoxComponent, {
+    hideParent: true, //  Hiding a Toolbar.Item hides its containing TD
+    enable:Ext.emptyFn,
+    disable:Ext.emptyFn,
+    focus:Ext.emptyFn
+    /**
+     * @cfg {String} overflowText Text to be used for the menu if the item is overflowed.
+     */
+});
+Ext.reg('tbitem', T.Item);
+
+/**
+ * @class Ext.Toolbar.Separator
+ * @extends Ext.Toolbar.Item
+ * A simple class that adds a vertical separator bar between toolbar items
+ * (css class:<tt>'xtb-sep'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbseparator'}, // or '-'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Separator
+ * @xtype tbseparator
+ */
+T.Separator = Ext.extend(T.Item, {
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'span', cls:'xtb-sep'}, position);
+    }
+});
+Ext.reg('tbseparator', T.Separator);
+
+/**
+ * @class Ext.Toolbar.Spacer
+ * @extends Ext.Toolbar.Item
+ * A simple element that adds extra horizontal space between items in a toolbar.
+ * By default a 2px wide space is added via css specification:<pre><code>
+.x-toolbar .xtb-spacer {
+    width:2px;
+}
+ * </code></pre>
+ * <p>Example usage:</p>
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbspacer'}, // or ' '
+        'Item 2',
+        // space width is also configurable via javascript
+        {xtype: 'tbspacer', width: 50}, // add a 50px space
+        'Item 3'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Spacer
+ * @xtype tbspacer
+ */
+T.Spacer = Ext.extend(T.Item, {
+    /**
+     * @cfg {Number} width
+     * The width of the spacer in pixels (defaults to 2px via css style <tt>.x-toolbar .xtb-spacer</tt>).
+     */
+
+    onRender : function(ct, position){
+        this.el = ct.createChild({tag:'div', cls:'xtb-spacer', style: this.width?'width:'+this.width+'px':''}, position);
+    }
+});
+Ext.reg('tbspacer', T.Spacer);
+
+/**
+ * @class Ext.Toolbar.Fill
+ * @extends Ext.Toolbar.Spacer
+ * A non-rendering placeholder item which instructs the Toolbar's Layout to begin using
+ * the right-justified button container.
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        'Item 1',
+        {xtype: 'tbfill'}, // or '->'
+        'Item 2'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new Fill
+ * @xtype tbfill
+ */
+T.Fill = Ext.extend(T.Item, {
+    // private
+    render : Ext.emptyFn,
+    isFill : true
+});
+Ext.reg('tbfill', T.Fill);
+
+/**
+ * @class Ext.Toolbar.TextItem
+ * @extends Ext.Toolbar.Item
+ * A simple class that renders text directly into a toolbar
+ * (with css class:<tt>'xtb-text'</tt>). Example usage:
+ * <pre><code>
+new Ext.Panel({
+    tbar : [
+        {xtype: 'tbtext', text: 'Item 1'} // or simply 'Item 1'
+    ]
+});
+</code></pre>
+ * @constructor
+ * Creates a new TextItem
+ * @param {String/Object} text A text string, or a config object containing a <tt>text</tt> property
+ * @xtype tbtext
+ */
+T.TextItem = Ext.extend(T.Item, {
+    /**
+     * @cfg {String} text The text to be used as innerHTML (html tags are accepted)
+     */
+
+    constructor: function(config){
+        T.TextItem.superclass.constructor.call(this, Ext.isString(config) ? {text: config} : config);
+    },
+
+    // private
+    onRender : function(ct, position) {
+        this.autoEl = {cls: 'xtb-text', html: this.text || ''};
+        T.TextItem.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates this item's text, setting the text to be used as innerHTML.
+     * @param {String} t The text to display (html accepted).
+     */
+    setText : function(t) {
+        if(this.rendered){
+            this.el.update(t);
+        }else{
+            this.text = t;
+        }
+    }
+});
+Ext.reg('tbtext', T.TextItem);
+
+// backwards compat
+T.Button = Ext.extend(Ext.Button, {});
+T.SplitButton = Ext.extend(Ext.SplitButton, {});
+Ext.reg('tbbutton', T.Button);
+Ext.reg('tbsplit', T.SplitButton);
+
+})();
+/**
+ * @class Ext.ButtonGroup
+ * @extends Ext.Panel
+ * Container for a group of buttons. Example usage:
+ * <pre><code>
+var p = new Ext.Panel({
+    title: 'Panel with Button Group',
+    width: 300,
+    height:200,
+    renderTo: document.body,
+    html: 'whatever',
+    tbar: [{
+        xtype: 'buttongroup',
+        {@link #columns}: 3,
+        title: 'Clipboard',
+        items: [{
+            text: 'Paste',
+            scale: 'large',
+            rowspan: 3, iconCls: 'add',
+            iconAlign: 'top',
+            cls: 'x-btn-as-arrow'
+        },{
+            xtype:'splitbutton',
+            text: 'Menu Button',
+            scale: 'large',
+            rowspan: 3,
+            iconCls: 'add',
+            iconAlign: 'top',
+            arrowAlign:'bottom',
+            menu: [{text: 'Menu Item 1'}]
+        },{
+            xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
+        },{
+            text: 'Copy', iconCls: 'add16'
+        },{
+            text: 'Format', iconCls: 'add16'
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * Create a new ButtonGroup.
+ * @param {Object} config The config object
+ * @xtype buttongroup
+ */
+Ext.ButtonGroup = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Number} columns The <tt>columns</tt> configuration property passed to the
+     * {@link #layout configured layout manager}. See {@link Ext.layout.TableLayout#columns}.
+     */
+    /**
+     * @cfg {String} baseCls  Defaults to <tt>'x-btn-group'</tt>.  See {@link Ext.Panel#baseCls}.
+     */
+    baseCls: 'x-btn-group',
+    /**
+     * @cfg {String} layout  Defaults to <tt>'table'</tt>.  See {@link Ext.Container#layout}.
+     */
+    layout:'table',
+    defaultType: 'button',
+    /**
+     * @cfg {Boolean} frame  Defaults to <tt>true</tt>.  See {@link Ext.Panel#frame}.
+     */
+    frame: true,
+    internalDefaults: {removeMode: 'container', hideParent: true},
+
+    initComponent : function(){
+        this.layoutConfig = this.layoutConfig || {};
+        Ext.applyIf(this.layoutConfig, {
+            columns : this.columns
+        });
+        if(!this.title){
+            this.addClass('x-btn-group-notitle');
+        }
+        this.on('afterlayout', this.onAfterLayout, this);
+        Ext.ButtonGroup.superclass.initComponent.call(this);
+    },
+
+    applyDefaults : function(c){
+        c = Ext.ButtonGroup.superclass.applyDefaults.call(this, c);
+        var d = this.internalDefaults;
+        if(c.events){
+            Ext.applyIf(c.initialConfig, d);
+            Ext.apply(c, d);
+        }else{
+            Ext.applyIf(c, d);
+        }
+        return c;
+    },
+
+    onAfterLayout : function(){
+        var bodyWidth = this.body.getFrameWidth('lr') + this.body.dom.firstChild.offsetWidth;
+        this.body.setWidth(bodyWidth);
+        this.el.setWidth(bodyWidth + this.getFrameWidth());
+    }
+    /**
+     * @cfg {Array} tools  @hide
+     */
+});
+
+Ext.reg('buttongroup', Ext.ButtonGroup);
+/**
+ * @class Ext.PagingToolbar
+ * @extends Ext.Toolbar
+ * <p>As the amount of records increases, the time required for the browser to render
+ * them increases. Paging is used to reduce the amount of data exchanged with the client.
+ * Note: if there are more records/rows than can be viewed in the available screen area, vertical
+ * scrollbars will be added.</p>
+ * <p>Paging is typically handled on the server side (see exception below). The client sends
+ * parameters to the server side, which the server needs to interpret and then respond with the
+ * approprate data.</p>
+ * <p><b>Ext.PagingToolbar</b> is a specialized toolbar that is bound to a {@link Ext.data.Store}
+ * and provides automatic paging control. This Component {@link Ext.data.Store#load load}s blocks
+ * of data into the <tt>{@link #store}</tt> by passing {@link Ext.data.Store#paramNames paramNames} used for
+ * paging criteria.</p>
+ * <p>PagingToolbar is typically used as one of the Grid's toolbars:</p>
+ * <pre><code>
+Ext.QuickTips.init(); // to display button quicktips
+
+var myStore = new Ext.data.Store({
+    reader: new Ext.data.JsonReader({
+        {@link Ext.data.JsonReader#totalProperty totalProperty}: 'results', 
+        ...
+    }),
+    ...
+});
+
+var myPageSize = 25;  // server script should only send back 25 items at a time
+
+var grid = new Ext.grid.GridPanel({
+    ...
+    store: myStore,
+    bbar: new Ext.PagingToolbar({
+        {@link #store}: myStore,       // grid and PagingToolbar using same store
+        {@link #displayInfo}: true,
+        {@link #pageSize}: myPageSize,
+        {@link #prependButtons}: true,
+        items: [
+            'text 1'
+        ]
+    })
+});
+ * </code></pre>
+ *
+ * <p>To use paging, pass the paging requirements to the server when the store is first loaded.</p>
+ * <pre><code>
+store.load({
+    params: {
+        // specify params for the first page load if using paging
+        start: 0,          
+        limit: myPageSize,
+        // other params
+        foo:   'bar'
+    }
+});
+ * </code></pre>
+ * 
+ * <p>If using {@link Ext.data.Store#autoLoad store's autoLoad} configuration:</p>
+ * <pre><code>
+var myStore = new Ext.data.Store({
+    {@link Ext.data.Store#autoLoad autoLoad}: {params:{start: 0, limit: 25}},
+    ...
+});
+ * </code></pre>
+ * 
+ * <p>The packet sent back from the server would have this form:</p>
+ * <pre><code>
+{
+    "success": true,
+    "results": 2000, 
+    "rows": [ // <b>*Note:</b> this must be an Array 
+        { "id":  1, "name": "Bill", "occupation": "Gardener" },
+        { "id":  2, "name":  "Ben", "occupation": "Horticulturalist" },
+        ...
+        { "id": 25, "name":  "Sue", "occupation": "Botanist" }
+    ]
+}
+ * </code></pre>
+ * <p><u>Paging with Local Data</u></p>
+ * <p>Paging can also be accomplished with local data using extensions:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><a href="http://extjs.com/forum/showthread.php?t=71532">Ext.ux.data.PagingStore</a></li>
+ * <li>Paging Memory Proxy (examples/ux/PagingMemoryProxy.js)</li>
+ * </ul></div>
+ * @constructor Create a new PagingToolbar
+ * @param {Object} config The config object
+ * @xtype paging
+ */
+(function() {
+
+var T = Ext.Toolbar;
+
+Ext.PagingToolbar = Ext.extend(Ext.Toolbar, {
+    /**
+     * @cfg {Ext.data.Store} store
+     * The {@link Ext.data.Store} the paging toolbar should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} displayInfo
+     * <tt>true</tt> to display the displayMsg (defaults to <tt>false</tt>)
+     */
+    /**
+     * @cfg {Number} pageSize
+     * The number of records to display per page (defaults to <tt>20</tt>)
+     */
+    pageSize : 20,
+    /**
+     * @cfg {Boolean} prependButtons
+     * <tt>true</tt> to insert any configured <tt>items</tt> <i>before</i> the paging buttons.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String} displayMsg
+     * The paging status message to display (defaults to <tt>'Displaying {0} - {1} of {2}'</tt>).
+     * Note that this string is formatted using the braced numbers <tt>{0}-{2}</tt> as tokens
+     * that are replaced by the values for start, end and total respectively. These tokens should
+     * be preserved when overriding this string if showing those values is desired.
+     */
+    displayMsg : 'Displaying {0} - {1} of {2}',
+    /**
+     * @cfg {String} emptyMsg
+     * The message to display when no records are found (defaults to 'No data to display')
+     */
+    emptyMsg : 'No data to display',
+    /**
+     * @cfg {String} beforePageText
+     * The text displayed before the input item (defaults to <tt>'Page'</tt>).
+     */
+    beforePageText : 'Page',
+    /**
+     * @cfg {String} afterPageText
+     * Customizable piece of the default paging text (defaults to <tt>'of {0}'</tt>). Note that
+     * this string is formatted using <tt>{0}</tt> as a token that is replaced by the number of
+     * total pages. This token should be preserved when overriding this string if showing the
+     * total page count is desired.
+     */
+    afterPageText : 'of {0}',
+    /**
+     * @cfg {String} firstText
+     * The quicktip text displayed for the first page button (defaults to <tt>'First Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    firstText : 'First Page',
+    /**
+     * @cfg {String} prevText
+     * The quicktip text displayed for the previous page button (defaults to <tt>'Previous Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    prevText : 'Previous Page',
+    /**
+     * @cfg {String} nextText
+     * The quicktip text displayed for the next page button (defaults to <tt>'Next Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    nextText : 'Next Page',
+    /**
+     * @cfg {String} lastText
+     * The quicktip text displayed for the last page button (defaults to <tt>'Last Page'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    lastText : 'Last Page',
+    /**
+     * @cfg {String} refreshText
+     * The quicktip text displayed for the Refresh button (defaults to <tt>'Refresh'</tt>).
+     * <b>Note</b>: quick tips must be initialized for the quicktip to show.
+     */
+    refreshText : 'Refresh',
+
+    /**
+     * <p><b>Deprecated</b>. <code>paramNames</code> should be set in the <b>data store</b>
+     * (see {@link Ext.data.Store#paramNames}).</p>
+     * <br><p>Object mapping of parameter names used for load calls, initially set to:</p>
+     * <pre>{start: 'start', limit: 'limit'}</pre>
+     * @type Object
+     * @property paramNames
+     * @deprecated
+     */
+
+    /**
+     * The number of records to display per page.  See also <tt>{@link #cursor}</tt>.
+     * @type Number
+     * @property pageSize
+     */
+
+    /**
+     * Indicator for the record position.  This property might be used to get the active page
+     * number for example:<pre><code>
+     * // t is reference to the paging toolbar instance
+     * var activePage = Math.ceil((t.cursor + t.pageSize) / t.pageSize);
+     * </code></pre>
+     * @type Number
+     * @property cursor
+     */
+
+    initComponent : function(){
+        var pagingItems = [this.first = new T.Button({
+            tooltip: this.firstText,
+            overflowText: this.firstText,
+            iconCls: 'x-tbar-page-first',
+            disabled: true,
+            handler: this.moveFirst,
+            scope: this
+        }), this.prev = new T.Button({
+            tooltip: this.prevText,
+            overflowText: this.prevText,
+            iconCls: 'x-tbar-page-prev',
+            disabled: true,
+            handler: this.movePrevious,
+            scope: this
+        }), '-', this.beforePageText,
+        this.inputItem = new Ext.form.NumberField({
+            cls: 'x-tbar-page-number',
+            allowDecimals: false,
+            allowNegative: false,
+            enableKeyEvents: true,
+            selectOnFocus: true,
+            submitValue: false,
+            listeners: {
+                scope: this,
+                keydown: this.onPagingKeyDown,
+                blur: this.onPagingBlur
+            }
+        }), this.afterTextItem = new T.TextItem({
+            text: String.format(this.afterPageText, 1)
+        }), '-', this.next = new T.Button({
+            tooltip: this.nextText,
+            overflowText: this.nextText,
+            iconCls: 'x-tbar-page-next',
+            disabled: true,
+            handler: this.moveNext,
+            scope: this
+        }), this.last = new T.Button({
+            tooltip: this.lastText,
+            overflowText: this.lastText,
+            iconCls: 'x-tbar-page-last',
+            disabled: true,
+            handler: this.moveLast,
+            scope: this
+        }), '-', this.refresh = new T.Button({
+            tooltip: this.refreshText,
+            overflowText: this.refreshText,
+            iconCls: 'x-tbar-loading',
+            handler: this.doRefresh,
+            scope: this
+        })];
+
+
+        var userItems = this.items || this.buttons || [];
+        if (this.prependButtons) {
+            this.items = userItems.concat(pagingItems);
+        }else{
+            this.items = pagingItems.concat(userItems);
+        }
+        delete this.buttons;
+        if(this.displayInfo){
+            this.items.push('->');
+            this.items.push(this.displayItem = new T.TextItem({}));
+        }
+        Ext.PagingToolbar.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event change
+             * Fires after the active page has been changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} pageData An object that has these properties:<ul>
+             * <li><code>total</code> : Number <div class="sub-desc">The total number of records in the dataset as
+             * returned by the server</div></li>
+             * <li><code>activePage</code> : Number <div class="sub-desc">The current page number</div></li>
+             * <li><code>pages</code> : Number <div class="sub-desc">The total number of pages (calculated from
+             * the total number of records in the dataset as returned by the server and the current {@link #pageSize})</div></li>
+             * </ul>
+             */
+            'change',
+            /**
+             * @event beforechange
+             * Fires just before the active page is changed.
+             * Return false to prevent the active page from being changed.
+             * @param {Ext.PagingToolbar} this
+             * @param {Object} params An object hash of the parameters which the PagingToolbar will send when
+             * loading the required page. This will contain:<ul>
+             * <li><code>start</code> : Number <div class="sub-desc">The starting row number for the next page of records to
+             * be retrieved from the server</div></li>
+             * <li><code>limit</code> : Number <div class="sub-desc">The number of records to be retrieved from the server</div></li>
+             * </ul>
+             * <p>(note: the names of the <b>start</b> and <b>limit</b> properties are determined
+             * by the store's {@link Ext.data.Store#paramNames paramNames} property.)</p>
+             * <p>Parameters may be added as required in the event handler.</p>
+             */
+            'beforechange'
+        );
+        this.on('afterlayout', this.onFirstLayout, this, {single: true});
+        this.cursor = 0;
+        this.bindStore(this.store, true);
+    },
+
+    // private
+    onFirstLayout : function(){
+        if(this.dsLoaded){
+            this.onLoad.apply(this, this.dsLoaded);
+        }
+    },
+
+    // private
+    updateInfo : function(){
+        if(this.displayItem){
+            var count = this.store.getCount();
+            var msg = count == 0 ?
+                this.emptyMsg :
+                String.format(
+                    this.displayMsg,
+                    this.cursor+1, this.cursor+count, this.store.getTotalCount()
+                );
+            this.displayItem.setText(msg);
+        }
+    },
+
+    // private
+    onLoad : function(store, r, o){
+        if(!this.rendered){
+            this.dsLoaded = [store, r, o];
+            return;
+        }
+        var p = this.getParams();
+        this.cursor = (o.params && o.params[p.start]) ? o.params[p.start] : 0;
+        var d = this.getPageData(), ap = d.activePage, ps = d.pages;
+
+        this.afterTextItem.setText(String.format(this.afterPageText, d.pages));
+        this.inputItem.setValue(ap);
+        this.first.setDisabled(ap == 1);
+        this.prev.setDisabled(ap == 1);
+        this.next.setDisabled(ap == ps);
+        this.last.setDisabled(ap == ps);
+        this.refresh.enable();
+        this.updateInfo();
+        this.fireEvent('change', this, d);
+    },
+
+    // private
+    getPageData : function(){
+        var total = this.store.getTotalCount();
+        return {
+            total : total,
+            activePage : Math.ceil((this.cursor+this.pageSize)/this.pageSize),
+            pages :  total < this.pageSize ? 1 : Math.ceil(total/this.pageSize)
+        };
+    },
+
+    /**
+     * Change the active page
+     * @param {Integer} page The page to display
+     */
+    changePage : function(page){
+        this.doLoad(((page-1) * this.pageSize).constrain(0, this.store.getTotalCount()));
+    },
+
+    // private
+    onLoadError : function(){
+        if(!this.rendered){
+            return;
+        }
+        this.refresh.enable();
+    },
+
+    // private
+    readPage : function(d){
+        var v = this.inputItem.getValue(), pageNum;
+        if (!v || isNaN(pageNum = parseInt(v, 10))) {
+            this.inputItem.setValue(d.activePage);
+            return false;
+        }
+        return pageNum;
+    },
+
+    onPagingFocus : function(){
+        this.inputItem.select();
+    },
+
+    //private
+    onPagingBlur : function(e){
+        this.inputItem.setValue(this.getPageData().activePage);
+    },
+
+    // private
+    onPagingKeyDown : function(field, e){
+        var k = e.getKey(), d = this.getPageData(), pageNum;
+        if (k == e.RETURN) {
+            e.stopEvent();
+            pageNum = this.readPage(d);
+            if(pageNum !== false){
+                pageNum = Math.min(Math.max(1, pageNum), d.pages) - 1;
+                this.doLoad(pageNum * this.pageSize);
+            }
+        }else if (k == e.HOME || k == e.END){
+            e.stopEvent();
+            pageNum = k == e.HOME ? 1 : d.pages;
+            field.setValue(pageNum);
+        }else if (k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){
+            e.stopEvent();
+            if((pageNum = this.readPage(d))){
+                var increment = e.shiftKey ? 10 : 1;
+                if(k == e.DOWN || k == e.PAGEDOWN){
+                    increment *= -1;
+                }
+                pageNum += increment;
+                if(pageNum >= 1 & pageNum <= d.pages){
+                    field.setValue(pageNum);
+                }
+            }
+        }
+    },
+
+    // private
+    getParams : function(){
+        //retain backwards compat, allow params on the toolbar itself, if they exist.
+        return this.paramNames || this.store.paramNames;
+    },
+
+    // private
+    beforeLoad : function(){
+        if(this.rendered && this.refresh){
+            this.refresh.disable();
+        }
+    },
+
+    // private
+    doLoad : function(start){
+        var o = {}, pn = this.getParams();
+        o[pn.start] = start;
+        o[pn.limit] = this.pageSize;
+        if(this.fireEvent('beforechange', this, o) !== false){
+            this.store.load({params:o});
+        }
+    },
+
+    /**
+     * Move to the first page, has the same effect as clicking the 'first' button.
+     */
+    moveFirst : function(){
+        this.doLoad(0);
+    },
+
+    /**
+     * Move to the previous page, has the same effect as clicking the 'previous' button.
+     */
+    movePrevious : function(){
+        this.doLoad(Math.max(0, this.cursor-this.pageSize));
+    },
+
+    /**
+     * Move to the next page, has the same effect as clicking the 'next' button.
+     */
+    moveNext : function(){
+        this.doLoad(this.cursor+this.pageSize);
+    },
+
+    /**
+     * Move to the last page, has the same effect as clicking the 'last' button.
+     */
+    moveLast : function(){
+        var total = this.store.getTotalCount(),
+            extra = total % this.pageSize;
+
+        this.doLoad(extra ? (total - extra) : total - this.pageSize);
+    },
+
+    /**
+     * Refresh the current page, has the same effect as clicking the 'refresh' button.
+     */
+    doRefresh : function(){
+        this.doLoad(this.cursor);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store}
+     * @param {Store} store The store to bind to this toolbar
+     * @param {Boolean} initial (Optional) true to not remove listeners
+     */
+    bindStore : function(store, initial){
+        var doLoad;
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.beforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.onLoadError, this);
+            }
+            if(!store){
+                this.store = null;
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                beforeload: this.beforeLoad,
+                load: this.onLoad,
+                exception: this.onLoadError
+            });
+            doLoad = true;
+        }
+        this.store = store;
+        if(doLoad){
+            this.onLoad(store, null, {});
+        }
+    },
+
+    /**
+     * Unbinds the paging toolbar from the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to unbind
+     */
+    unbind : function(store){
+        this.bindStore(null);
+    },
+
+    /**
+     * Binds the paging toolbar to the specified {@link Ext.data.Store} <b>(deprecated)</b>
+     * @param {Ext.data.Store} store The data store to bind
+     */
+    bind : function(store){
+        this.bindStore(store);
+    },
+
+    // private
+    onDestroy : function(){
+        this.bindStore(null);
+        Ext.PagingToolbar.superclass.onDestroy.call(this);
+    }
+});
+
+})();
+Ext.reg('paging', Ext.PagingToolbar);/**
+ * @class Ext.History
+ * @extends Ext.util.Observable
+ * History management component that allows you to register arbitrary tokens that signify application
+ * history state on navigation actions.  You can then handle the history {@link #change} event in order
+ * to reset your application UI to the appropriate state when the user navigates forward or backward through
+ * the browser history stack.
+ * @singleton
+ */
+Ext.History = (function () {
+    var iframe, hiddenField;
+    var ready = false;
+    var currentToken;
+
+    function getHash() {
+        var href = location.href, i = href.indexOf("#"),
+            hash = i >= 0 ? href.substr(i + 1) : null;
+             
+        if (Ext.isGecko) {
+            hash = decodeURIComponent(hash);
+        }
+        return hash;
+    }
+
+    function doSave() {
+        hiddenField.value = currentToken;
+    }
+
+    function handleStateChange(token) {
+        currentToken = token;
+        Ext.History.fireEvent('change', token);
+    }
+
+    function updateIFrame (token) {
+        var html = ['<html><body><div id="state">',Ext.util.Format.htmlEncode(token),'</div></body></html>'].join('');
+        try {
+            var doc = iframe.contentWindow.document;
+            doc.open();
+            doc.write(html);
+            doc.close();
+            return true;
+        } catch (e) {
+            return false;
+        }
+    }
+
+    function checkIFrame() {
+        if (!iframe.contentWindow || !iframe.contentWindow.document) {
+            setTimeout(checkIFrame, 10);
+            return;
+        }
+
+        var doc = iframe.contentWindow.document;
+        var elem = doc.getElementById("state");
+        var token = elem ? elem.innerText : null;
+
+        var hash = getHash();
+
+        setInterval(function () {
+
+            doc = iframe.contentWindow.document;
+            elem = doc.getElementById("state");
+
+            var newtoken = elem ? elem.innerText : null;
+
+            var newHash = getHash();
+
+            if (newtoken !== token) {
+                token = newtoken;
+                handleStateChange(token);
+                location.hash = token;
+                hash = token;
+                doSave();
+            } else if (newHash !== hash) {
+                hash = newHash;
+                updateIFrame(newHash);
+            }
+
+        }, 50);
+
+        ready = true;
+
+        Ext.History.fireEvent('ready', Ext.History);
+    }
+
+    function startUp() {
+        currentToken = hiddenField.value ? hiddenField.value : getHash();
+
+        if (Ext.isIE) {
+            checkIFrame();
+        } else {
+            var hash = getHash();
+            setInterval(function () {
+                var newHash = getHash();
+                if (newHash !== hash) {
+                    hash = newHash;
+                    handleStateChange(hash);
+                    doSave();
+                }
+            }, 50);
+            ready = true;
+            Ext.History.fireEvent('ready', Ext.History);
+        }
+    }
+
+    return {
+        /**
+         * The id of the hidden field required for storing the current history token.
+         * @type String
+         * @property
+         */
+        fieldId: 'x-history-field',
+        /**
+         * The id of the iframe required by IE to manage the history stack.
+         * @type String
+         * @property
+         */
+        iframeId: 'x-history-frame',
+
+        events:{},
+
+        /**
+         * Initialize the global History instance.
+         * @param {Boolean} onReady (optional) A callback function that will be called once the history
+         * component is fully initialized.
+         * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to the browser window.
+         */
+        init: function (onReady, scope) {
+            if(ready) {
+                Ext.callback(onReady, scope, [this]);
+                return;
+            }
+            if(!Ext.isReady){
+                Ext.onReady(function(){
+                    Ext.History.init(onReady, scope);
+                });
+                return;
+            }
+            hiddenField = Ext.getDom(Ext.History.fieldId);
+            if (Ext.isIE) {
+                iframe = Ext.getDom(Ext.History.iframeId);
+            }
+            this.addEvents(
+                /**
+                 * @event ready
+                 * Fires when the Ext.History singleton has been initialized and is ready for use.
+                 * @param {Ext.History} The Ext.History singleton.
+                 */
+                'ready',
+                /**
+                 * @event change
+                 * Fires when navigation back or forwards within the local page's history occurs.
+                 * @param {String} token An identifier associated with the page state at that point in its history.
+                 */
+                'change'
+            );
+            if(onReady){
+                this.on('ready', onReady, scope, {single:true});
+            }
+            startUp();
+        },
+
+        /**
+         * Add a new token to the history stack. This can be any arbitrary value, although it would
+         * commonly be the concatenation of a component id and another id marking the specifc history
+         * state of that component.  Example usage:
+         * <pre><code>
+// Handle tab changes on a TabPanel
+tabPanel.on('tabchange', function(tabPanel, tab){
+    Ext.History.add(tabPanel.id + ':' + tab.id);
+});
+</code></pre>
+         * @param {String} token The value that defines a particular application-specific history state
+         * @param {Boolean} preventDuplicates When true, if the passed token matches the current token
+         * it will not save a new history step. Set to false if the same state can be saved more than once
+         * at the same history stack location (defaults to true).
+         */
+        add: function (token, preventDup) {
+            if(preventDup !== false){
+                if(this.getToken() == token){
+                    return true;
+                }
+            }
+            if (Ext.isIE) {
+                return updateIFrame(token);
+            } else {
+                location.hash = token;
+                return true;
+            }
+        },
+
+        /**
+         * Programmatically steps back one step in browser history (equivalent to the user pressing the Back button).
+         */
+        back: function(){
+            history.go(-1);
+        },
+
+        /**
+         * Programmatically steps forward one step in browser history (equivalent to the user pressing the Forward button).
+         */
+        forward: function(){
+            history.go(1);
+        },
+
+        /**
+         * Retrieves the currently-active history token.
+         * @return {String} The token
+         */
+        getToken: function() {
+            return ready ? currentToken : getHash();
+        }
+    };
+})();
+Ext.apply(Ext.History, new Ext.util.Observable());/**
+ * @class Ext.Tip
+ * @extends Ext.Panel
+ * @xtype tip
+ * This is the base class for {@link Ext.QuickTip} and {@link Ext.Tooltip} that provides the basic layout and
+ * positioning that all tip-based classes require. This class can be used directly for simple, statically-positioned
+ * tips that are displayed programmatically, or it can be extended to provide custom tip implementations.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.Tip = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Boolean} closable True to render a close tool button into the tooltip header (defaults to false).
+     */
+    /**
+     * @cfg {Number} width
+     * Width in pixels of the tip (defaults to auto).  Width will be ignored if it exceeds the bounds of
+     * {@link #minWidth} or {@link #maxWidth}.  The maximum supported value is 500.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the tip in pixels (defaults to 40).
+     */
+    minWidth : 40,
+    /**
+     * @cfg {Number} maxWidth The maximum width of the tip in pixels (defaults to 300).  The maximum supported value is 500.
+     */
+    maxWidth : 300,
+    /**
+     * @cfg {Boolean/String} shadow True or "sides" for the default effect, "frame" for 4-way shadow, and "drop"
+     * for bottom-right shadow (defaults to "sides").
+     */
+    shadow : "sides",
+    /**
+     * @cfg {String} defaultAlign <b>Experimental</b>. The default {@link Ext.Element#alignTo} anchor position value
+     * for this tip relative to its element of origin (defaults to "tl-bl?").
+     */
+    defaultAlign : "tl-bl?",
+    autoRender: true,
+    quickShowInterval : 250,
+
+    // private panel overrides
+    frame:true,
+    hidden:true,
+    baseCls: 'x-tip',
+    floating:{shadow:true,shim:true,useDisplay:true,constrain:false},
+    autoHeight:true,
+
+    closeAction: 'hide',
+
+    // private
+    initComponent : function(){
+        Ext.Tip.superclass.initComponent.call(this);
+        if(this.closable && !this.title){
+            this.elements += ',header';
+        }
+    },
+
+    // private
+    afterRender : function(){
+        Ext.Tip.superclass.afterRender.call(this);
+        if(this.closable){
+            this.addTool({
+                id: 'close',
+                handler: this[this.closeAction],
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Shows this tip at the specified XY position.  Example usage:
+     * <pre><code>
+// Show the tip at x:50 and y:100
+tip.showAt([50,100]);
+</code></pre>
+     * @param {Array} xy An array containing the x and y coordinates
+     */
+    showAt : function(xy){
+        Ext.Tip.superclass.show.call(this);
+        if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){
+            this.doAutoWidth();
+        }
+        if(this.constrainPosition){
+            xy = this.el.adjustForConstraints(xy);
+        }
+        this.setPagePosition(xy[0], xy[1]);
+    },
+
+    // protected
+    doAutoWidth : function(adjust){
+        adjust = adjust || 0;
+        var bw = this.body.getTextWidth();
+        if(this.title){
+            bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));
+        }
+        bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr") + adjust;
+        this.setWidth(bw.constrain(this.minWidth, this.maxWidth));
+        
+        // IE7 repaint bug on initial show
+        if(Ext.isIE7 && !this.repainted){
+            this.el.repaint();
+            this.repainted = true;
+        }
+    },
+
+    /**
+     * <b>Experimental</b>. Shows this tip at a position relative to another element using a standard {@link Ext.Element#alignTo}
+     * anchor position value.  Example usage:
+     * <pre><code>
+// Show the tip at the default position ('tl-br?')
+tip.showBy('my-el');
+
+// Show the tip's top-left corner anchored to the element's top-right corner
+tip.showBy('my-el', 'tl-tr');
+</code></pre>
+     * @param {Mixed} el An HTMLElement, Ext.Element or string id of the target element to align to
+     * @param {String} position (optional) A valid {@link Ext.Element#alignTo} anchor position (defaults to 'tl-br?' or
+     * {@link #defaultAlign} if specified).
+     */
+    showBy : function(el, pos){
+        if(!this.rendered){
+            this.render(Ext.getBody());
+        }
+        this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));
+    },
+
+    initDraggable : function(){
+        this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);
+        this.header.addClass('x-tip-draggable');
+    }
+});
+
+Ext.reg('tip', Ext.Tip);
+
+// private - custom Tip DD implementation
+Ext.Tip.DD = function(tip, config){
+    Ext.apply(this, config);
+    this.tip = tip;
+    Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);
+    this.setHandleElId(tip.header.id);
+    this.scroll = false;
+};
+
+Ext.extend(Ext.Tip.DD, Ext.dd.DD, {
+    moveOnly:true,
+    scroll:false,
+    headerOffsets:[100, 25],
+    startDrag : function(){
+        this.tip.el.disableShadow();
+    },
+    endDrag : function(e){
+        this.tip.el.enableShadow(true);
+    }
+});/**
+ * @class Ext.ToolTip
+ * @extends Ext.Tip
+ * A standard tooltip implementation for providing additional information when hovering over a target element.
+ * @xtype tooltip
+ * @constructor
+ * Create a new Tooltip
+ * @param {Object} config The configuration options
+ */
+Ext.ToolTip = Ext.extend(Ext.Tip, {
+    /**
+     * When a Tooltip is configured with the <code>{@link #delegate}</code>
+     * option to cause selected child elements of the <code>{@link #target}</code>
+     * Element to each trigger a seperate show event, this property is set to
+     * the DOM element which triggered the show.
+     * @type DOMElement
+     * @property triggerElement
+     */
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to monitor
+     * for mouseover events to trigger showing this ToolTip.
+     */
+    /**
+     * @cfg {Boolean} autoHide True to automatically hide the tooltip after the
+     * mouse exits the target element or after the <code>{@link #dismissDelay}</code>
+     * has expired if set (defaults to true).  If <code>{@link closable} = true</code>
+     * a close tool button will be rendered into the tooltip header.
+     */
+    /**
+     * @cfg {Number} showDelay Delay in milliseconds before the tooltip displays
+     * after the mouse enters the target element (defaults to 500)
+     */
+    showDelay : 500,
+    /**
+     * @cfg {Number} hideDelay Delay in milliseconds after the mouse exits the
+     * target element but before the tooltip actually hides (defaults to 200).
+     * Set to 0 for the tooltip to hide immediately.
+     */
+    hideDelay : 200,
+    /**
+     * @cfg {Number} dismissDelay Delay in milliseconds before the tooltip
+     * automatically hides (defaults to 5000). To disable automatic hiding, set
+     * dismissDelay = 0.
+     */
+    dismissDelay : 5000,
+    /**
+     * @cfg {Array} mouseOffset An XY offset from the mouse position where the
+     * tooltip should be shown (defaults to [15,18]).
+     */
+    /**
+     * @cfg {Boolean} trackMouse True to have the tooltip follow the mouse as it
+     * moves over the target element (defaults to false).
+     */
+    trackMouse : false,
+    /**
+     * @cfg {Boolean} anchorToTarget True to anchor the tooltip to the target
+     * element, false to anchor it relative to the mouse coordinates (defaults
+     * to true).  When <code>anchorToTarget</code> is true, use
+     * <code>{@link #defaultAlign}</code> to control tooltip alignment to the
+     * target element.  When <code>anchorToTarget</code> is false, use
+     * <code>{@link #anchorPosition}</code> instead to control alignment.
+     */
+    anchorToTarget : true,
+    /**
+     * @cfg {Number} anchorOffset A numeric pixel value used to offset the
+     * default position of the anchor arrow (defaults to 0).  When the anchor
+     * position is on the top or bottom of the tooltip, <code>anchorOffset</code>
+     * will be used as a horizontal offset.  Likewise, when the anchor position
+     * is on the left or right side, <code>anchorOffset</code> will be used as
+     * a vertical offset.
+     */
+    anchorOffset : 0,
+    /**
+     * @cfg {String} delegate <p>Optional. A {@link Ext.DomQuery DomQuery}
+     * selector which allows selection of individual elements within the
+     * <code>{@link #target}</code> element to trigger showing and hiding the
+     * ToolTip as the mouse moves within the target.</p>
+     * <p>When specified, the child element of the target which caused a show
+     * event is placed into the <code>{@link #triggerElement}</code> property
+     * before the ToolTip is shown.</p>
+     * <p>This may be useful when a Component has regular, repeating elements
+     * in it, each of which need a Tooltip which contains information specific
+     * to that element. For example:</p><pre><code>
+var myGrid = new Ext.grid.gridPanel(gridConfig);
+myGrid.on('render', function(grid) {
+    var store = grid.getStore();  // Capture the Store.
+    var view = grid.getView();    // Capture the GridView.
+    myGrid.tip = new Ext.ToolTip({
+        target: view.mainBody,    // The overall target element.
+        delegate: '.x-grid3-row', // Each grid row causes its own seperate show and hide.
+        trackMouse: true,         // Moving within the row should not hide the tip.
+        renderTo: document.body,  // Render immediately so that tip.body can be
+                                  //  referenced prior to the first show.
+        listeners: {              // Change content dynamically depending on which element
+                                  //  triggered the show.
+            beforeshow: function updateTipBody(tip) {
+                var rowIndex = view.findRowIndex(tip.triggerElement);
+                tip.body.dom.innerHTML = 'Over Record ID ' + store.getAt(rowIndex).id;
+            }
+        }
+    });
+});
+     *</code></pre>
+     */
+
+    // private
+    targetCounter : 0,
+
+    constrainPosition : false,
+
+    // private
+    initComponent : function(){
+        Ext.ToolTip.superclass.initComponent.call(this);
+        this.lastActive = new Date();
+        this.initTarget(this.target);
+        this.origAnchor = this.anchor;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.ToolTip.superclass.onRender.call(this, ct, position);
+        this.anchorCls = 'x-tip-anchor-' + this.getAnchorPosition();
+        this.anchorEl = this.el.createChild({
+            cls: 'x-tip-anchor ' + this.anchorCls
+        });
+    },
+
+    // private
+    afterRender : function(){
+        Ext.ToolTip.superclass.afterRender.call(this);
+        this.anchorEl.setStyle('z-index', this.el.getZIndex() + 1).setVisibilityMode(Ext.Element.DISPLAY);
+    },
+
+    /**
+     * Binds this ToolTip to the specified element. The tooltip will be displayed when the mouse moves over the element.
+     * @param {Mixed} t The Element, HtmlElement, or ID of an element to bind to
+     */
+    initTarget : function(target){
+        var t;
+        if((t = Ext.get(target))){
+            if(this.target){
+                var tg = Ext.get(this.target);
+                this.mun(tg, 'mouseover', this.onTargetOver, this);
+                this.mun(tg, 'mouseout', this.onTargetOut, this);
+                this.mun(tg, 'mousemove', this.onMouseMove, this);
+            }
+            this.mon(t, {
+                mouseover: this.onTargetOver,
+                mouseout: this.onTargetOut,
+                mousemove: this.onMouseMove,
+                scope: this
+            });
+            this.target = t;
+        }
+        if(this.anchor){
+            this.anchorTarget = this.target;
+        }
+    },
+
+    // private
+    onMouseMove : function(e){
+        var t = this.delegate ? e.getTarget(this.delegate) : this.triggerElement = true;
+        if (t) {
+            this.targetXY = e.getXY();
+            if (t === this.triggerElement) {
+                if(!this.hidden && this.trackMouse){
+                    this.setPagePosition(this.getTargetXY());
+                }
+            } else {
+                this.hide();
+                this.lastActive = new Date(0);
+                this.onTargetOver(e);
+            }
+        } else if (!this.closable && this.isVisible()) {
+            this.hide();
+        }
+    },
+
+    // private
+    getTargetXY : function(){
+        if(this.delegate){
+            this.anchorTarget = this.triggerElement;
+        }
+        if(this.anchor){
+            this.targetCounter++;
+            var offsets = this.getOffsets(),
+                xy = (this.anchorToTarget && !this.trackMouse) ? this.el.getAlignToXY(this.anchorTarget, this.getAnchorAlign()) : this.targetXY,
+                dw = Ext.lib.Dom.getViewWidth() - 5,
+                dh = Ext.lib.Dom.getViewHeight() - 5,
+                de = document.documentElement,
+                bd = document.body,
+                scrollX = (de.scrollLeft || bd.scrollLeft || 0) + 5,
+                scrollY = (de.scrollTop || bd.scrollTop || 0) + 5,
+                axy = [xy[0] + offsets[0], xy[1] + offsets[1]],
+                sz = this.getSize();
+                
+            this.anchorEl.removeClass(this.anchorCls);
+
+            if(this.targetCounter < 2){
+                if(axy[0] < scrollX){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'l-r';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'left';
+                    return this.getTargetXY();
+                }
+                if(axy[0]+sz.width > dw){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'r-l';
+                        if(this.mouseOffset){this.mouseOffset[0] *= -1;}
+                    }
+                    this.anchor = 'right';
+                    return this.getTargetXY();
+                }
+                if(axy[1] < scrollY){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 't-b';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'top';
+                    return this.getTargetXY();
+                }
+                if(axy[1]+sz.height > dh){
+                    if(this.anchorToTarget){
+                        this.defaultAlign = 'b-t';
+                        if(this.mouseOffset){this.mouseOffset[1] *= -1;}
+                    }
+                    this.anchor = 'bottom';
+                    return this.getTargetXY();
+                }
+            }
+
+            this.anchorCls = 'x-tip-anchor-'+this.getAnchorPosition();
+            this.anchorEl.addClass(this.anchorCls);
+            this.targetCounter = 0;
+            return axy;
+        }else{
+            var mouseOffset = this.getMouseOffset();
+            return [this.targetXY[0]+mouseOffset[0], this.targetXY[1]+mouseOffset[1]];
+        }
+    },
+
+    getMouseOffset : function(){
+        var offset = this.anchor ? [0,0] : [15,18];
+        if(this.mouseOffset){
+            offset[0] += this.mouseOffset[0];
+            offset[1] += this.mouseOffset[1];
+        }
+        return offset;
+    },
+
+    // private
+    getAnchorPosition : function(){
+        if(this.anchor){
+            this.tipAnchor = this.anchor.charAt(0);
+        }else{
+            var m = this.defaultAlign.match(/^([a-z]+)-([a-z]+)(\?)?$/);
+            if(!m){
+               throw 'AnchorTip.defaultAlign is invalid';
+            }
+            this.tipAnchor = m[1].charAt(0);
+        }
+
+        switch(this.tipAnchor){
+            case 't': return 'top';
+            case 'b': return 'bottom';
+            case 'r': return 'right';
+        }
+        return 'left';
+    },
+
+    // private
+    getAnchorAlign : function(){
+        switch(this.anchor){
+            case 'top'  : return 'tl-bl';
+            case 'left' : return 'tl-tr';
+            case 'right': return 'tr-tl';
+            default     : return 'bl-tl';
+        }
+    },
+
+    // private
+    getOffsets : function(){
+        var offsets, 
+            ap = this.getAnchorPosition().charAt(0);
+        if(this.anchorToTarget && !this.trackMouse){
+            switch(ap){
+                case 't':
+                    offsets = [0, 9];
+                    break;
+                case 'b':
+                    offsets = [0, -13];
+                    break;
+                case 'r':
+                    offsets = [-13, 0];
+                    break;
+                default:
+                    offsets = [9, 0];
+                    break;
+            }
+        }else{
+            switch(ap){
+                case 't':
+                    offsets = [-15-this.anchorOffset, 30];
+                    break;
+                case 'b':
+                    offsets = [-19-this.anchorOffset, -13-this.el.dom.offsetHeight];
+                    break;
+                case 'r':
+                    offsets = [-15-this.el.dom.offsetWidth, -13-this.anchorOffset];
+                    break;
+                default:
+                    offsets = [25, -13-this.anchorOffset];
+                    break;
+            }
+        }
+        var mouseOffset = this.getMouseOffset();
+        offsets[0] += mouseOffset[0];
+        offsets[1] += mouseOffset[1];
+
+        return offsets;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        var t = e.getTarget(this.delegate);
+        if (t) {
+            this.triggerElement = t;
+            this.clearTimer('hide');
+            this.targetXY = e.getXY();
+            this.delayShow();
+        }
+    },
+
+    // private
+    delayShow : function(){
+        if(this.hidden && !this.showTimer){
+            if(this.lastActive.getElapsed() < this.quickShowInterval){
+                this.show();
+            }else{
+                this.showTimer = this.show.defer(this.showDelay, this);
+            }
+        }else if(!this.hidden && this.autoHide !== false){
+            this.show();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+        if(this.disabled || e.within(this.target.dom, true)){
+            return;
+        }
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // private
+    delayHide : function(){
+        if(!this.hidden && !this.hideTimer){
+            this.hideTimer = this.hide.defer(this.hideDelay, this);
+        }
+    },
+
+    /**
+     * Hides this tooltip if visible.
+     */
+    hide: function(){
+        this.clearTimer('dismiss');
+        this.lastActive = new Date();
+        if(this.anchorEl){
+            this.anchorEl.hide();
+        }
+        Ext.ToolTip.superclass.hide.call(this);
+        delete this.triggerElement;
+    },
+
+    /**
+     * Shows this tooltip at the current event target XY position.
+     */
+    show : function(){
+        if(this.anchor){
+            // pre-show it off screen so that the el will have dimensions
+            // for positioning calcs when getting xy next
+            this.showAt([-1000,-1000]);
+            this.origConstrainPosition = this.constrainPosition;
+            this.constrainPosition = false;
+            this.anchor = this.origAnchor;
+        }
+        this.showAt(this.getTargetXY());
+
+        if(this.anchor){
+            this.anchorEl.show();
+            this.syncAnchor();
+            this.constrainPosition = this.origConstrainPosition;
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        this.lastActive = new Date();
+        this.clearTimers();
+        Ext.ToolTip.superclass.showAt.call(this, xy);
+        if(this.dismissDelay && this.autoHide !== false){
+            this.dismissTimer = this.hide.defer(this.dismissDelay, this);
+        }
+        if(this.anchor && !this.anchorEl.isVisible()){
+            this.syncAnchor();
+            this.anchorEl.show();
+        }else{
+            this.anchorEl.hide();
+        }
+    },
+
+    // private
+    syncAnchor : function(){
+        var anchorPos, targetPos, offset;
+        switch(this.tipAnchor.charAt(0)){
+            case 't':
+                anchorPos = 'b';
+                targetPos = 'tl';
+                offset = [20+this.anchorOffset, 2];
+                break;
+            case 'r':
+                anchorPos = 'l';
+                targetPos = 'tr';
+                offset = [-2, 11+this.anchorOffset];
+                break;
+            case 'b':
+                anchorPos = 't';
+                targetPos = 'bl';
+                offset = [20+this.anchorOffset, -2];
+                break;
+            default:
+                anchorPos = 'r';
+                targetPos = 'tl';
+                offset = [2, 11+this.anchorOffset];
+                break;
+        }
+        this.anchorEl.alignTo(this.el, anchorPos+'-'+targetPos, offset);
+    },
+
+    // private
+    setPagePosition : function(x, y){
+        Ext.ToolTip.superclass.setPagePosition.call(this, x, y);
+        if(this.anchor){
+            this.syncAnchor();
+        }
+    },
+
+    // private
+    clearTimer : function(name){
+        name = name + 'Timer';
+        clearTimeout(this[name]);
+        delete this[name];
+    },
+
+    // private
+    clearTimers : function(){
+        this.clearTimer('show');
+        this.clearTimer('dismiss');
+        this.clearTimer('hide');
+    },
+
+    // private
+    onShow : function(){
+        Ext.ToolTip.superclass.onShow.call(this);
+        Ext.getDoc().on('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onHide : function(){
+        Ext.ToolTip.superclass.onHide.call(this);
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+    },
+
+    // private
+    onDocMouseDown : function(e){
+        if(this.autoHide !== true && !this.closable && !e.within(this.el.dom)){
+            this.disable();
+            this.doEnable.defer(100, this);
+        }
+    },
+    
+    // private
+    doEnable : function(){
+        if(!this.isDestroyed){
+            this.enable();
+        }
+    },
+
+    // private
+    onDisable : function(){
+        this.clearTimers();
+        this.hide();
+    },
+
+    // private
+    adjustPosition : function(x, y){
+        if(this.constrainPosition){
+            var ay = this.targetXY[1], h = this.getSize().height;
+            if(y <= ay && (y+h) >= ay){
+                y = ay-h-5;
+            }
+        }
+        return {x : x, y: y};
+    },
+    
+    beforeDestroy : function(){
+        this.clearTimers();
+        Ext.destroy(this.anchorEl);
+        delete this.anchorEl;
+        delete this.target;
+        delete this.anchorTarget;
+        delete this.triggerElement;
+        Ext.ToolTip.superclass.beforeDestroy.call(this);    
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
+        Ext.ToolTip.superclass.onDestroy.call(this);
+    }
+});
+
+Ext.reg('tooltip', Ext.ToolTip);/**
+ * @class Ext.QuickTip
+ * @extends Ext.ToolTip
+ * @xtype quicktip
+ * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
+ * {@link Ext.QuickTips} instance.  See the QuickTips class header for additional usage details and examples.
+ * @constructor
+ * Create a new Tip
+ * @param {Object} config The configuration options
+ */
+Ext.QuickTip = Ext.extend(Ext.ToolTip, {
+    /**
+     * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
+     */
+    /**
+     * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
+     */
+    interceptTitles : false,
+
+    // private
+    tagConfig : {
+        namespace : "ext",
+        attribute : "qtip",
+        width : "qwidth",
+        target : "target",
+        title : "qtitle",
+        hide : "hide",
+        cls : "qclass",
+        align : "qalign",
+        anchor : "anchor"
+    },
+
+    // private
+    initComponent : function(){
+        this.target = this.target || Ext.getDoc();
+        this.targets = this.targets || {};
+        Ext.QuickTip.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Configures a new quick tip instance and assigns it to a target element.  The following config values are
+     * supported (for example usage, see the {@link Ext.QuickTips} class header):
+     * <div class="mdetail-params"><ul>
+     * <li>autoHide</li>
+     * <li>cls</li>
+     * <li>dismissDelay (overrides the singleton value)</li>
+     * <li>target (required)</li>
+     * <li>text (required)</li>
+     * <li>title</li>
+     * <li>width</li></ul></div>
+     * @param {Object} config The config object
+     */
+    register : function(config){
+        var cs = Ext.isArray(config) ? config : arguments;
+        for(var i = 0, len = cs.length; i < len; i++){
+            var c = cs[i];
+            var target = c.target;
+            if(target){
+                if(Ext.isArray(target)){
+                    for(var j = 0, jlen = target.length; j < jlen; j++){
+                        this.targets[Ext.id(target[j])] = c;
+                    }
+                } else{
+                    this.targets[Ext.id(target)] = c;
+                }
+            }
+        }
+    },
+
+    /**
+     * Removes this quick tip from its element and destroys it.
+     * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+     */
+    unregister : function(el){
+        delete this.targets[Ext.id(el)];
+    },
+    
+    /**
+     * Hides a visible tip or cancels an impending show for a particular element.
+     * @param {String/HTMLElement/Element} el The element that is the target of the tip.
+     */
+    cancelShow: function(el){
+        var at = this.activeTarget;
+        el = Ext.get(el).dom;
+        if(this.isVisible()){
+            if(at && at.el == el){
+                this.hide();
+            }
+        }else if(at && at.el == el){
+            this.clearTimer('show');
+        }
+    },
+    
+    getTipCfg: function(e) {
+        var t = e.getTarget(), 
+            ttp, 
+            cfg;
+        if(this.interceptTitles && t.title && Ext.isString(t.title)){
+            ttp = t.title;
+            t.qtip = ttp;
+            t.removeAttribute("title");
+            e.preventDefault();
+        }else{
+            cfg = this.tagConfig;
+            ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
+        }
+        return ttp;
+    },
+
+    // private
+    onTargetOver : function(e){
+        if(this.disabled){
+            return;
+        }
+        this.targetXY = e.getXY();
+        var t = e.getTarget();
+        if(!t || t.nodeType !== 1 || t == document || t == document.body){
+            return;
+        }
+        if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
+            this.clearTimer('hide');
+            this.show();
+            return;
+        }
+        if(t && this.targets[t.id]){
+            this.activeTarget = this.targets[t.id];
+            this.activeTarget.el = t;
+            this.anchor = this.activeTarget.anchor;
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+            return;
+        }
+        var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
+        if(ttp = this.getTipCfg(e)){
+            var autoHide = et.getAttribute(cfg.hide, ns);
+            this.activeTarget = {
+                el: t,
+                text: ttp,
+                width: et.getAttribute(cfg.width, ns),
+                autoHide: autoHide != "user" && autoHide !== 'false',
+                title: et.getAttribute(cfg.title, ns),
+                cls: et.getAttribute(cfg.cls, ns),
+                align: et.getAttribute(cfg.align, ns)
+                
+            };
+            this.anchor = et.getAttribute(cfg.anchor, ns);
+            if(this.anchor){
+                this.anchorTarget = t;
+            }
+            this.delayShow();
+        }
+    },
+
+    // private
+    onTargetOut : function(e){
+
+        // If moving within the current target, and it does not have a new tip, ignore the mouseout
+        if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
+            return;
+        }
+
+        this.clearTimer('show');
+        if(this.autoHide !== false){
+            this.delayHide();
+        }
+    },
+
+    // inherit docs
+    showAt : function(xy){
+        var t = this.activeTarget;
+        if(t){
+            if(!this.rendered){
+                this.render(Ext.getBody());
+                this.activeTarget = t;
+            }
+            if(t.width){
+                this.setWidth(t.width);
+                this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
+                this.measureWidth = false;
+            } else{
+                this.measureWidth = true;
+            }
+            this.setTitle(t.title || '');
+            this.body.update(t.text);
+            this.autoHide = t.autoHide;
+            this.dismissDelay = t.dismissDelay || this.dismissDelay;
+            if(this.lastCls){
+                this.el.removeClass(this.lastCls);
+                delete this.lastCls;
+            }
+            if(t.cls){
+                this.el.addClass(t.cls);
+                this.lastCls = t.cls;
+            }
+            if(this.anchor){
+                this.constrainPosition = false;
+            }else if(t.align){ // TODO: this doesn't seem to work consistently
+                xy = this.el.getAlignToXY(t.el, t.align);
+                this.constrainPosition = false;
+            }else{
+                this.constrainPosition = true;
+            }
+        }
+        Ext.QuickTip.superclass.showAt.call(this, xy);
+    },
+
+    // inherit docs
+    hide: function(){
+        delete this.activeTarget;
+        Ext.QuickTip.superclass.hide.call(this);
+    }
+});
+Ext.reg('quicktip', Ext.QuickTip);/**
+ * @class Ext.QuickTips
+ * <p>Provides attractive and customizable tooltips for any element. The QuickTips
+ * singleton is used to configure and manage tooltips globally for multiple elements
+ * in a generic manner.  To create individual tooltips with maximum customizability,
+ * you should consider either {@link Ext.Tip} or {@link Ext.ToolTip}.</p>
+ * <p>Quicktips can be configured via tag attributes directly in markup, or by
+ * registering quick tips programmatically via the {@link #register} method.</p>
+ * <p>The singleton's instance of {@link Ext.QuickTip} is available via
+ * {@link #getQuickTip}, and supports all the methods, and all the all the
+ * configuration properties of Ext.QuickTip. These settings will apply to all
+ * tooltips shown by the singleton.</p>
+ * <p>Below is the summary of the configuration properties which can be used.
+ * For detailed descriptions see the config options for the {@link Ext.QuickTip QuickTip} class</p>
+ * <p><b>QuickTips singleton configs (all are optional)</b></p>
+ * <div class="mdetail-params"><ul><li>dismissDelay</li>
+ * <li>hideDelay</li>
+ * <li>maxWidth</li>
+ * <li>minWidth</li>
+ * <li>showDelay</li>
+ * <li>trackMouse</li></ul></div>
+ * <p><b>Target element configs (optional unless otherwise noted)</b></p>
+ * <div class="mdetail-params"><ul><li>autoHide</li>
+ * <li>cls</li>
+ * <li>dismissDelay (overrides singleton value)</li>
+ * <li>target (required)</li>
+ * <li>text (required)</li>
+ * <li>title</li>
+ * <li>width</li></ul></div>
+ * <p>Here is an example showing how some of these config options could be used:</p>
+ * <pre><code>
+// Init the singleton.  Any tag-based quick tips will start working.
+Ext.QuickTips.init();
+
+// Apply a set of config properties to the singleton
+Ext.apply(Ext.QuickTips.getQuickTip(), {
+    maxWidth: 200,
+    minWidth: 100,
+    showDelay: 50,      // Show 50ms after entering target
+    trackMouse: true
+});
+
+// Manually register a quick tip for a specific element
+Ext.QuickTips.register({
+    target: 'my-div',
+    title: 'My Tooltip',
+    text: 'This tooltip was added in code',
+    width: 100,
+    dismissDelay: 10000 // Hide after 10 seconds hover
+});
+</code></pre>
+ * <p>To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
+ * the <b>ext:</b> namespace.  The HTML element itself is automatically set as the quick tip target. Here is the summary
+ * of supported attributes (optional unless otherwise noted):</p>
+ * <ul><li><b>hide</b>: Specifying "user" is equivalent to setting autoHide = false.  Any other value will be the
+ * same as autoHide = true.</li>
+ * <li><b>qclass</b>: A CSS class to be applied to the quick tip (equivalent to the 'cls' target element config).</li>
+ * <li><b>qtip (required)</b>: The quick tip text (equivalent to the 'text' target element config).</li>
+ * <li><b>qtitle</b>: The quick tip title (equivalent to the 'title' target element config).</li>
+ * <li><b>qwidth</b>: The quick tip width (equivalent to the 'width' target element config).</li></ul>
+ * <p>Here is an example of configuring an HTML element to display a tooltip from markup:</p>
+ * <pre><code>
+// Add a quick tip to an HTML button
+&lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
+     ext:qtip="This is a quick tip from markup!">&lt;/input>
+</code></pre>
+ * @singleton
+ */
+Ext.QuickTips = function(){
+    var tip,
+        disabled = false;
+        
+    return {
+        /**
+         * Initialize the global QuickTips instance and prepare any quick tips.
+         * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true) 
+         */
+        init : function(autoRender){
+            if(!tip){
+                if(!Ext.isReady){
+                    Ext.onReady(function(){
+                        Ext.QuickTips.init(autoRender);
+                    });
+                    return;
+                }
+                tip = new Ext.QuickTip({
+                    elements:'header,body', 
+                    disabled: disabled
+                });
+                if(autoRender !== false){
+                    tip.render(Ext.getBody());
+                }
+            }
+        },
+        
+        // Protected method called by the dd classes
+        ddDisable : function(){
+            // don't disable it if we don't need to
+            if(tip && !disabled){
+                tip.disable();
+            }    
+        },
+        
+        // Protected method called by the dd classes
+        ddEnable : function(){
+            // only enable it if it hasn't been disabled
+            if(tip && !disabled){
+                tip.enable();
+            }
+        },
+
+        /**
+         * Enable quick tips globally.
+         */
+        enable : function(){
+            if(tip){
+                tip.enable();
+            }
+            disabled = false;
+        },
+
+        /**
+         * Disable quick tips globally.
+         */
+        disable : function(){
+            if(tip){
+                tip.disable();
+            }
+            disabled = true;
+        },
+
+        /**
+         * Returns true if quick tips are enabled, else false.
+         * @return {Boolean}
+         */
+        isEnabled : function(){
+            return tip !== undefined && !tip.disabled;
+        },
+
+        /**
+         * Gets the single {@link Ext.QuickTip QuickTip} instance used to show tips from all registered elements.
+         * @return {Ext.QuickTip}
+         */
+        getQuickTip : function(){
+            return tip;
+        },
+
+        /**
+         * Configures a new quick tip instance and assigns it to a target element.  See
+         * {@link Ext.QuickTip#register} for details.
+         * @param {Object} config The config object
+         */
+        register : function(){
+            tip.register.apply(tip, arguments);
+        },
+
+        /**
+         * Removes any registered quick tip from the target element and destroys it.
+         * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
+         */
+        unregister : function(){
+            tip.unregister.apply(tip, arguments);
+        },
+
+        /**
+         * Alias of {@link #register}.
+         * @param {Object} config The config object
+         */
+        tips : function(){
+            tip.register.apply(tip, arguments);
+        }
+    };
+}();/**
+ * @class Ext.slider.Tip
+ * @extends Ext.Tip
+ * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage:
+<pre>
+new Ext.Slider({
+    width: 214,
+    minValue: 0,
+    maxValue: 100,
+    plugins: new Ext.slider.Tip()
+});
+</pre>
+ * Optionally provide your own tip text by overriding getText:
+ <pre>
+ new Ext.Slider({
+     width: 214,
+     minValue: 0,
+     maxValue: 100,
+     plugins: new Ext.slider.Tip({
+         getText: function(thumb){
+             return String.format('<b>{0}% complete</b>', thumb.value);
+         }
+     })
+ });
+ </pre>
+ */
+Ext.slider.Tip = Ext.extend(Ext.Tip, {
+    minWidth: 10,
+    offsets : [0, -10],
+    
+    init: function(slider) {
+        slider.on({
+            scope    : this,
+            dragstart: this.onSlide,
+            drag     : this.onSlide,
+            dragend  : this.hide,
+            destroy  : this.destroy
+        });
+    },
+    
+    /**
+     * @private
+     * Called whenever a dragstart or drag event is received on the associated Thumb. 
+     * Aligns the Tip with the Thumb's new position.
+     * @param {Ext.slider.MultiSlider} slider The slider
+     * @param {Ext.EventObject} e The Event object
+     * @param {Ext.slider.Thumb} thumb The thumb that the Tip is attached to
+     */
+    onSlide : function(slider, e, thumb) {
+        this.show();
+        this.body.update(this.getText(thumb));
+        this.doAutoWidth();
+        this.el.alignTo(thumb.el, 'b-t?', this.offsets);
+    },
+
+    /**
+     * Used to create the text that appears in the Tip's body. By default this just returns
+     * the value of the Slider Thumb that the Tip is attached to. Override to customize.
+     * @param {Ext.slider.Thumb} thumb The Thumb that the Tip is attached to
+     * @return {String} The text to display in the tip
+     */
+    getText : function(thumb) {
+        return String(thumb.value);
+    }
+});
+
+//backwards compatibility - SliderTip used to be a ux before 3.2
+Ext.ux.SliderTip = Ext.slider.Tip;/**
+ * @class Ext.tree.TreePanel
+ * @extends Ext.Panel
+ * <p>The TreePanel provides tree-structured UI representation of tree-structured data.</p>
+ * <p>{@link Ext.tree.TreeNode TreeNode}s added to the TreePanel may each contain metadata
+ * used by your application in their {@link Ext.tree.TreeNode#attributes attributes} property.</p>
+ * <p><b>A TreePanel must have a {@link #root} node before it is rendered.</b> This may either be
+ * specified using the {@link #root} config option, or using the {@link #setRootNode} method.
+ * <p>An example of tree rendered to an existing div:</p><pre><code>
+var tree = new Ext.tree.TreePanel({
+    renderTo: 'tree-div',
+    useArrows: true,
+    autoScroll: true,
+    animate: true,
+    enableDD: true,
+    containerScroll: true,
+    border: false,
+    // auto create TreeLoader
+    dataUrl: 'get-nodes.php',
+
+    root: {
+        nodeType: 'async',
+        text: 'Ext JS',
+        draggable: false,
+        id: 'source'
+    }
+});
+
+tree.getRootNode().expand();
+ * </code></pre>
+ * <p>The example above would work with a data packet similar to this:</p><pre><code>
+[{
+    "text": "adapter",
+    "id": "source\/adapter",
+    "cls": "folder"
+}, {
+    "text": "dd",
+    "id": "source\/dd",
+    "cls": "folder"
+}, {
+    "text": "debug.js",
+    "id": "source\/debug.js",
+    "leaf": true,
+    "cls": "file"
+}]
+ * </code></pre>
+ * <p>An example of tree within a Viewport:</p><pre><code>
+new Ext.Viewport({
+    layout: 'border',
+    items: [{
+        region: 'west',
+        collapsible: true,
+        title: 'Navigation',
+        xtype: 'treepanel',
+        width: 200,
+        autoScroll: true,
+        split: true,
+        loader: new Ext.tree.TreeLoader(),
+        root: new Ext.tree.AsyncTreeNode({
+            expanded: true,
+            children: [{
+                text: 'Menu Option 1',
+                leaf: true
+            }, {
+                text: 'Menu Option 2',
+                leaf: true
+            }, {
+                text: 'Menu Option 3',
+                leaf: true
+            }]
+        }),
+        rootVisible: false,
+        listeners: {
+            click: function(n) {
+                Ext.Msg.alert('Navigation Tree Click', 'You clicked: "' + n.attributes.text + '"');
+            }
+        }
+    }, {
+        region: 'center',
+        xtype: 'tabpanel',
+        // remaining code not shown ...
+    }]
+});
+</code></pre>
+ *
+ * @cfg {Ext.tree.TreeNode} root The root node for the tree.
+ * @cfg {Boolean} rootVisible <tt>false</tt> to hide the root node (defaults to <tt>true</tt>)
+ * @cfg {Boolean} lines <tt>false</tt> to disable tree lines (defaults to <tt>true</tt>)
+ * @cfg {Boolean} enableDD <tt>true</tt> to enable drag and drop
+ * @cfg {Boolean} enableDrag <tt>true</tt> to enable just drag
+ * @cfg {Boolean} enableDrop <tt>true</tt> to enable just drop
+ * @cfg {Object} dragConfig Custom config to pass to the {@link Ext.tree.TreeDragZone} instance
+ * @cfg {Object} dropConfig Custom config to pass to the {@link Ext.tree.TreeDropZone} instance
+ * @cfg {String} ddGroup The DD group this TreePanel belongs to
+ * @cfg {Boolean} ddAppendOnly <tt>true</tt> if the tree should only allow append drops (use for trees which are sorted)
+ * @cfg {Boolean} ddScroll <tt>true</tt> to enable body scrolling
+ * @cfg {Boolean} containerScroll <tt>true</tt> to register this container with ScrollManager
+ * @cfg {Boolean} hlDrop <tt>false</tt> to disable node highlight on drop (defaults to the value of {@link Ext#enableFx})
+ * @cfg {String} hlColor The color of the node highlight (defaults to <tt>'C3DAF9'</tt>)
+ * @cfg {Boolean} animate <tt>true</tt> to enable animated expand/collapse (defaults to the value of {@link Ext#enableFx})
+ * @cfg {Boolean} singleExpand <tt>true</tt> if only 1 node per branch may be expanded
+ * @cfg {Object} selModel A tree selection model to use with this TreePanel (defaults to an {@link Ext.tree.DefaultSelectionModel})
+ * @cfg {Boolean} trackMouseOver <tt>false</tt> to disable mouse over highlighting
+ * @cfg {Ext.tree.TreeLoader} loader A {@link Ext.tree.TreeLoader} for use with this TreePanel
+ * @cfg {String} pathSeparator The token used to separate sub-paths in path strings (defaults to <tt>'/'</tt>)
+ * @cfg {Boolean} useArrows <tt>true</tt> to use Vista-style arrows in the tree (defaults to <tt>false</tt>)
+ * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+ *
+ * @constructor
+ * @param {Object} config
+ * @xtype treepanel
+ */
+Ext.tree.TreePanel = Ext.extend(Ext.Panel, {
+    rootVisible : true,
+    animate : Ext.enableFx,
+    lines : true,
+    enableDD : false,
+    hlDrop : Ext.enableFx,
+    pathSeparator : '/',
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents : [],
+
+    initComponent : function(){
+        Ext.tree.TreePanel.superclass.initComponent.call(this);
+
+        if(!this.eventModel){
+            this.eventModel = new Ext.tree.TreeEventModel(this);
+        }
+
+        // initialize the loader
+        var l = this.loader;
+        if(!l){
+            l = new Ext.tree.TreeLoader({
+                dataUrl: this.dataUrl,
+                requestMethod: this.requestMethod
+            });
+        }else if(Ext.isObject(l) && !l.load){
+            l = new Ext.tree.TreeLoader(l);
+        }
+        this.loader = l;
+
+        this.nodeHash = {};
+
+        /**
+        * The root node of this tree.
+        * @type Ext.tree.TreeNode
+        * @property root
+        */
+        if(this.root){
+            var r = this.root;
+            delete this.root;
+            this.setRootNode(r);
+        }
+
+
+        this.addEvents(
+
+            /**
+            * @event append
+            * Fires when a new child node is appended to a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The newly appended node
+            * @param {Number} index The index of the newly appended node
+            */
+           'append',
+           /**
+            * @event remove
+            * Fires when a child node is removed from a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node removed
+            */
+           'remove',
+           /**
+            * @event movenode
+            * Fires when a node is moved to a new location in the tree
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node moved
+            * @param {Node} oldParent The old parent of this node
+            * @param {Node} newParent The new parent of this node
+            * @param {Number} index The index it was moved to
+            */
+           'movenode',
+           /**
+            * @event insert
+            * Fires when a new child node is inserted in a node in this tree.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node inserted
+            * @param {Node} refNode The child node the node was inserted before
+            */
+           'insert',
+           /**
+            * @event beforeappend
+            * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be appended
+            */
+           'beforeappend',
+           /**
+            * @event beforeremove
+            * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be removed
+            */
+           'beforeremove',
+           /**
+            * @event beforemovenode
+            * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+            * @param {Tree} tree The owner tree
+            * @param {Node} node The node being moved
+            * @param {Node} oldParent The parent of the node
+            * @param {Node} newParent The new parent the node is moving to
+            * @param {Number} index The index it is being moved to
+            */
+           'beforemovenode',
+           /**
+            * @event beforeinsert
+            * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+            * @param {Tree} tree The owner tree
+            * @param {Node} parent The parent node
+            * @param {Node} node The child node to be inserted
+            * @param {Node} refNode The child node the node is being inserted before
+            */
+            'beforeinsert',
+
+            /**
+            * @event beforeload
+            * Fires before a node is loaded, return false to cancel
+            * @param {Node} node The node being loaded
+            */
+            'beforeload',
+            /**
+            * @event load
+            * Fires when a node is loaded
+            * @param {Node} node The node that was loaded
+            */
+            'load',
+            /**
+            * @event textchange
+            * Fires when the text for a node is changed
+            * @param {Node} node The node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpandnode
+            * Fires before a node is expanded, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpandnode',
+            /**
+            * @event beforecollapsenode
+            * Fires before a node is collapsed, return false to cancel.
+            * @param {Node} node The node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapsenode',
+            /**
+            * @event expandnode
+            * Fires when a node is expanded
+            * @param {Node} node The node
+            */
+            'expandnode',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of a node changes
+            * @param {Node} node The node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapsenode
+            * Fires when a node is collapsed
+            * @param {Node} node The node
+            */
+            'collapsenode',
+            /**
+            * @event beforeclick
+            * Fires before click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when a node is clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event containerclick
+            * Fires when the tree container is clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerclick',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing on a node. Return false to cancel the default action.
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when a node is double clicked
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event containerdblclick
+            * Fires when the tree container is double clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containerdblclick',
+            /**
+            * @event contextmenu
+            * Fires when a node is right clicked. To display a context menu in response to this
+            * event, first create a Menu object (see {@link Ext.menu.Menu} for details), then add
+            * a handler for this event:<pre><code>
+new Ext.tree.TreePanel({
+    title: 'My TreePanel',
+    root: new Ext.tree.AsyncTreeNode({
+        text: 'The Root',
+        children: [
+            { text: 'Child node 1', leaf: true },
+            { text: 'Child node 2', leaf: true }
+        ]
+    }),
+    contextMenu: new Ext.menu.Menu({
+        items: [{
+            id: 'delete-node',
+            text: 'Delete Node'
+        }],
+        listeners: {
+            itemclick: function(item) {
+                switch (item.id) {
+                    case 'delete-node':
+                        var n = item.parentMenu.contextNode;
+                        if (n.parentNode) {
+                            n.remove();
+                        }
+                        break;
+                }
+            }
+        }
+    }),
+    listeners: {
+        contextmenu: function(node, e) {
+//          Register the context node with the menu so that a Menu Item's handler function can access
+//          it via its {@link Ext.menu.BaseItem#parentMenu parentMenu} property.
+            node.select();
+            var c = node.getOwnerTree().contextMenu;
+            c.contextNode = node;
+            c.showAt(e.getXY());
+        }
+    }
+});
+</code></pre>
+            * @param {Node} node The node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event containercontextmenu
+            * Fires when the tree container is right clicked
+            * @param {Tree} this
+            * @param {Ext.EventObject} e The event object
+            */
+            'containercontextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for a node are rendered
+            * @param {Node} node The node
+            */
+            'beforechildrenrendered',
+           /**
+             * @event startdrag
+             * Fires when a node starts being dragged
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'startdrag',
+            /**
+             * @event enddrag
+             * Fires when a drag operation is complete
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {event} e The raw browser event
+             */
+            'enddrag',
+            /**
+             * @event dragdrop
+             * Fires when a dragged node is dropped on a valid DD target
+             * @param {Ext.tree.TreePanel} this
+             * @param {Ext.tree.TreeNode} node
+             * @param {DD} dd The dd it was dropped on
+             * @param {event} e The raw browser event
+             */
+            'dragdrop',
+            /**
+             * @event beforenodedrop
+             * Fires when a DD object is dropped on a node in this tree for preprocessing. Return false to cancel the drop. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source <b>OR</b> you can supply node(s)
+             * to be inserted by setting them on this object.</li>
+             * <li>cancel - Set this to true to cancel the drop.</li>
+             * <li>dropStatus - If the default drop action is cancelled but the drop is valid, setting this to true
+             * will prevent the animated 'repair' from appearing.</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'beforenodedrop',
+            /**
+             * @event nodedrop
+             * Fires after a DD object is dropped on a node in this tree. The dropEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Dropped node(s).</li>
+             * </ul>
+             * @param {Object} dropEvent
+             */
+            'nodedrop',
+             /**
+             * @event nodedragover
+             * Fires when a tree node is being targeted for a drag drop, return false to signal drop not allowed. The dragOverEvent
+             * passed to handlers has the following properties:<br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>tree - The TreePanel</li>
+             * <li>target - The node being targeted for the drop</li>
+             * <li>data - The drag data from the drag source</li>
+             * <li>point - The point of the drop - append, above or below</li>
+             * <li>source - The drag source</li>
+             * <li>rawEvent - Raw mouse event</li>
+             * <li>dropNode - Drop node(s) provided by the source.</li>
+             * <li>cancel - Set this to true to signal drop not allowed.</li>
+             * </ul>
+             * @param {Object} dragOverEvent
+             */
+            'nodedragover'
+        );
+        if(this.singleExpand){
+            this.on('beforeexpandnode', this.restrictExpand, this);
+        }
+    },
+
+    // private
+    proxyNodeEvent : function(ename, a1, a2, a3, a4, a5, a6){
+        if(ename == 'collapse' || ename == 'expand' || ename == 'beforecollapse' || ename == 'beforeexpand' || ename == 'move' || ename == 'beforemove'){
+            ename = ename+'node';
+        }
+        // args inline for performance while bubbling events
+        return this.fireEvent(ename, a1, a2, a3, a4, a5, a6);
+    },
+
+
+    /**
+     * Returns this root node for this tree
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree. If the TreePanel has already rendered a root node, the
+     * previous root node (and all of its descendants) are destroyed before the new root node is rendered.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.destroyRoot();
+        if(!node.render){ // attributes passed
+            node = this.loader.createNode(node);
+        }
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        if(!this.rootVisible){
+            var uiP = node.attributes.uiProvider;
+            node.ui = uiP ? new uiP(node) : new Ext.tree.RootTreeNodeUI(node);
+        }
+        if(this.innerCt){
+            this.clearInnerCt();
+            this.renderRoot();
+        }
+        return node;
+    },
+    
+    clearInnerCt : function(){
+        this.innerCt.update('');    
+    },
+    
+    // private
+    renderRoot : function(){
+        this.root.render();
+        if(!this.rootVisible){
+            this.root.renderChildren();
+        }
+    },
+
+    /**
+     * Gets a node in this tree by its id
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    // private
+    toString : function(){
+        return '[Tree'+(this.id?' '+this.id:'')+']';
+    },
+
+    // private
+    restrictExpand : function(node){
+        var p = node.parentNode;
+        if(p){
+            if(p.expandedChild && p.expandedChild.parentNode == p){
+                p.expandedChild.collapse();
+            }
+            p.expandedChild = node;
+        }
+    },
+
+    /**
+     * Retrieve an array of checked nodes, or an array of a specific attribute of checked nodes (e.g. 'id')
+     * @param {String} attribute (optional) Defaults to null (return the actual nodes)
+     * @param {TreeNode} startNode (optional) The node to start from, defaults to the root
+     * @return {Array}
+     */
+    getChecked : function(a, startNode){
+        startNode = startNode || this.root;
+        var r = [];
+        var f = function(){
+            if(this.attributes.checked){
+                r.push(!a ? this : (a == 'id' ? this.id : this.attributes[a]));
+            }
+        };
+        startNode.cascade(f);
+        return r;
+    },
+
+    /**
+     * Returns the default {@link Ext.tree.TreeLoader} for this TreePanel.
+     * @return {Ext.tree.TreeLoader} The TreeLoader for this TreePanel.
+     */
+    getLoader : function(){
+        return this.loader;
+    },
+
+    /**
+     * Expand all nodes
+     */
+    expandAll : function(){
+        this.root.expand(true);
+    },
+
+    /**
+     * Collapse all nodes
+     */
+    collapseAll : function(){
+        this.root.collapse(true);
+    },
+
+    /**
+     * Returns the selection model used by this TreePanel.
+     * @return {TreeSelectionModel} The selection model used by this TreePanel
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.tree.DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Expands a specified path in this TreePanel. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the expand is complete. The callback will be called with
+     * (bSuccess, oLastNode) where bSuccess is if the expand was successful and oLastNode is the last node that was expanded.
+     */
+    expandPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var curNode = this.root;
+        if(curNode.attributes[attr] != keys[1]){ // invalid root
+            if(callback){
+                callback(false, null);
+            }
+            return;
+        }
+        var index = 1;
+        var f = function(){
+            if(++index == keys.length){
+                if(callback){
+                    callback(true, curNode);
+                }
+                return;
+            }
+            var c = curNode.findChild(attr, keys[index]);
+            if(!c){
+                if(callback){
+                    callback(false, curNode);
+                }
+                return;
+            }
+            curNode = c;
+            c.expand(false, false, f);
+        };
+        curNode.expand(false, false, f);
+    },
+
+    /**
+     * Selects the node in this tree at the specified path. A path can be retrieved from a node with {@link Ext.data.Node#getPath}
+     * @param {String} path
+     * @param {String} attr (optional) The attribute used in the path (see {@link Ext.data.Node#getPath} for more info)
+     * @param {Function} callback (optional) The callback to call when the selection is complete. The callback will be called with
+     * (bSuccess, oSelNode) where bSuccess is if the selection was successful and oSelNode is the selected node.
+     */
+    selectPath : function(path, attr, callback){
+        if(Ext.isEmpty(path)){
+            if(callback){
+                callback(false, undefined);
+            }
+            return;
+        }
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator),
+            v = keys.pop();
+        if(keys.length > 1){
+            var f = function(success, node){
+                if(success && node){
+                    var n = node.findChild(attr, v);
+                    if(n){
+                        n.select();
+                        if(callback){
+                            callback(true, n);
+                        }
+                    }else if(callback){
+                        callback(false, n);
+                    }
+                }else{
+                    if(callback){
+                        callback(false, n);
+                    }
+                }
+            };
+            this.expandPath(keys.join(this.pathSeparator), attr, f);
+        }else{
+            this.root.select();
+            if(callback){
+                callback(true, this.root);
+            }
+        }
+    },
+
+    /**
+     * Returns the underlying Element for this tree
+     * @return {Ext.Element} The Element
+     */
+    getTreeEl : function(){
+        return this.body;
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.tree.TreePanel.superclass.onRender.call(this, ct, position);
+        this.el.addClass('x-tree');
+        this.innerCt = this.body.createChild({tag:'ul',
+               cls:'x-tree-root-ct ' +
+               (this.useArrows ? 'x-tree-arrows' : this.lines ? 'x-tree-lines' : 'x-tree-no-lines')});
+    },
+
+    // private
+    initEvents : function(){
+        Ext.tree.TreePanel.superclass.initEvents.call(this);
+
+        if(this.containerScroll){
+            Ext.dd.ScrollManager.register(this.body);
+        }
+        if((this.enableDD || this.enableDrop) && !this.dropZone){
+           /**
+            * The dropZone used by this tree if drop is enabled (see {@link #enableDD} or {@link #enableDrop})
+            * @property dropZone
+            * @type Ext.tree.TreeDropZone
+            */
+             this.dropZone = new Ext.tree.TreeDropZone(this, this.dropConfig || {
+               ddGroup: this.ddGroup || 'TreeDD', appendOnly: this.ddAppendOnly === true
+           });
+        }
+        if((this.enableDD || this.enableDrag) && !this.dragZone){
+           /**
+            * The dragZone used by this tree if drag is enabled (see {@link #enableDD} or {@link #enableDrag})
+            * @property dragZone
+            * @type Ext.tree.TreeDragZone
+            */
+            this.dragZone = new Ext.tree.TreeDragZone(this, this.dragConfig || {
+               ddGroup: this.ddGroup || 'TreeDD',
+               scroll: this.ddScroll
+           });
+        }
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    afterRender : function(){
+        Ext.tree.TreePanel.superclass.afterRender.call(this);
+        this.renderRoot();
+    },
+
+    beforeDestroy : function(){
+        if(this.rendered){
+            Ext.dd.ScrollManager.unregister(this.body);
+            Ext.destroy(this.dropZone, this.dragZone);
+        }
+        this.destroyRoot();
+        Ext.destroy(this.loader);
+        this.nodeHash = this.root = this.loader = null;
+        Ext.tree.TreePanel.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * Destroy the root node. Not included by itself because we need to pass the silent parameter.
+     * @private
+     */
+    destroyRoot : function(){
+        if(this.root && this.root.destroy){
+            this.root.destroy(true);
+        }
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @method removeAll
+     * @hide
+     */
+    /**
+     * @event afterLayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {Mixed} data  @hide
+     */
+    /**
+     * @cfg {Mixed} tpl  @hide
+     */
+    /**
+     * @cfg {String} tplWriteMode  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+
+Ext.tree.TreePanel.nodeTypes = {};
+
+Ext.reg('treepanel', Ext.tree.TreePanel);Ext.tree.TreeEventModel = function(tree){
+    this.tree = tree;
+    this.tree.on('render', this.initEvents, this);
+};
+
+Ext.tree.TreeEventModel.prototype = {
+    initEvents : function(){
+        var t = this.tree;
+
+        if(t.trackMouseOver !== false){
+            t.mon(t.innerCt, {
+                scope: this,
+                mouseover: this.delegateOver,
+                mouseout: this.delegateOut
+            });
+        }
+        t.mon(t.getTreeEl(), {
+            scope: this,
+            click: this.delegateClick,
+            dblclick: this.delegateDblClick,
+            contextmenu: this.delegateContextMenu
+        });
+    },
+
+    getNode : function(e){
+        var t;
+        if(t = e.getTarget('.x-tree-node-el', 10)){
+            var id = Ext.fly(t, '_treeEvents').getAttribute('tree-node-id', 'ext');
+            if(id){
+                return this.tree.getNodeById(id);
+            }
+        }
+        return null;
+    },
+
+    getNodeTarget : function(e){
+        var t = e.getTarget('.x-tree-node-icon', 1);
+        if(!t){
+            t = e.getTarget('.x-tree-node-el', 6);
+        }
+        return t;
+    },
+
+    delegateOut : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            var n = this.getNode(e);
+            this.onIconOut(e, n);
+            if(n == this.lastEcOver){
+                delete this.lastEcOver;
+            }
+        }
+        if((t = this.getNodeTarget(e)) && !e.within(t, true)){
+            this.onNodeOut(e, this.getNode(e));
+        }
+    },
+
+    delegateOver : function(e, t){
+        if(!this.beforeEvent(e)){
+            return;
+        }
+        if(Ext.isGecko && !this.trackingDoc){ // prevent hanging in FF
+            Ext.getBody().on('mouseover', this.trackExit, this);
+            this.trackingDoc = true;
+        }
+        if(this.lastEcOver){ // prevent hung highlight
+            this.onIconOut(e, this.lastEcOver);
+            delete this.lastEcOver;
+        }
+        if(e.getTarget('.x-tree-ec-icon', 1)){
+            this.lastEcOver = this.getNode(e);
+            this.onIconOver(e, this.lastEcOver);
+        }
+        if(t = this.getNodeTarget(e)){
+            this.onNodeOver(e, this.getNode(e));
+        }
+    },
+
+    trackExit : function(e){
+        if(this.lastOverNode){
+            if(this.lastOverNode.ui && !e.within(this.lastOverNode.ui.getEl())){
+                this.onNodeOut(e, this.lastOverNode);
+            }
+            delete this.lastOverNode;
+            Ext.getBody().un('mouseover', this.trackExit, this);
+            this.trackingDoc = false;
+        }
+
+    },
+
+    delegateClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(e.getTarget('input[type=checkbox]', 1)){
+                this.onCheckboxClick(e, this.getNode(e));
+            }else if(e.getTarget('.x-tree-ec-icon', 1)){
+                this.onIconClick(e, this.getNode(e));
+            }else if(this.getNodeTarget(e)){
+                this.onNodeClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'click');
+        }
+    },
+
+    delegateDblClick : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeDblClick(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'dblclick');
+        }
+    },
+
+    delegateContextMenu : function(e, t){
+        if(this.beforeEvent(e)){
+            if(this.getNodeTarget(e)){
+                this.onNodeContextMenu(e, this.getNode(e));
+            }
+        }else{
+            this.checkContainerEvent(e, 'contextmenu');
+        }
+    },
+    
+    checkContainerEvent: function(e, type){
+        if(this.disabled){
+            e.stopEvent();
+            return false;
+        }
+        this.onContainerEvent(e, type);    
+    },
+
+    onContainerEvent: function(e, type){
+        this.tree.fireEvent('container' + type, this.tree, e);
+    },
+
+    onNodeClick : function(e, node){
+        node.ui.onClick(e);
+    },
+
+    onNodeOver : function(e, node){
+        this.lastOverNode = node;
+        node.ui.onOver(e);
+    },
+
+    onNodeOut : function(e, node){
+        node.ui.onOut(e);
+    },
+
+    onIconOver : function(e, node){
+        node.ui.addClass('x-tree-ec-over');
+    },
+
+    onIconOut : function(e, node){
+        node.ui.removeClass('x-tree-ec-over');
+    },
+
+    onIconClick : function(e, node){
+        node.ui.ecClick(e);
+    },
+
+    onCheckboxClick : function(e, node){
+        node.ui.onCheckChange(e);
+    },
+
+    onNodeDblClick : function(e, node){
+        node.ui.onDblClick(e);
+    },
+
+    onNodeContextMenu : function(e, node){
+        node.ui.onContextMenu(e);
+    },
+
+    beforeEvent : function(e){
+        var node = this.getNode(e);
+        if(this.disabled || !node || !node.ui){
+            e.stopEvent();
+            return false;
+        }
+        return true;
+    },
+
+    disable: function(){
+        this.disabled = true;
+    },
+
+    enable: function(){
+        this.disabled = false;
+    }
+};/**
+ * @class Ext.tree.DefaultSelectionModel
+ * @extends Ext.util.Observable
+ * The default single selection for a TreePanel.
+ */
+Ext.tree.DefaultSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNode = null;
+   
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected node changes
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             */
+            'selectionchange',
+
+            /**
+             * @event beforeselect
+             * Fires before the selected node changes, return false to cancel the change
+             * @param {DefaultSelectionModel} this
+             * @param {TreeNode} node the new selection
+             * @param {TreeNode} node the old selection
+             */
+            'beforeselect'
+        );
+
+        Ext.apply(this, config);
+        Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node);
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, /* private*/ selectNextNode){
+        // If node is hidden, select the next node in whatever direction was being moved in.
+        if (!Ext.fly(node.ui.wrap).isVisible() && selectNextNode) {
+            return selectNextNode.call(this, node);
+        }
+        var last = this.selNode;
+        if(node == last){
+            node.ui.onSelectedChange(true);
+        }else if(this.fireEvent('beforeselect', this, node, last) !== false){
+            if(last && last.ui){
+                last.ui.onSelectedChange(false);
+            }
+            this.selNode = node;
+            node.ui.onSelectedChange(true);
+            this.fireEvent('selectionchange', this, node, last);
+        }
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    unselect : function(node, silent){
+        if(this.selNode == node){
+            this.clearSelections(silent);
+        }    
+    },
+    
+    /**
+     * Clear all selections
+     * @param {Boolean} silent True to stop the selectionchange event from firing.
+     */
+    clearSelections : function(silent){
+        var n = this.selNode;
+        if(n){
+            n.ui.onSelectedChange(false);
+            this.selNode = null;
+            if(silent !== true){
+                this.fireEvent('selectionchange', this, null);
+            }
+        }
+        return n;
+    },
+    
+    /**
+     * Get the selected node
+     * @return {TreeNode} The selected node
+     */
+    getSelectedNode : function(){
+        return this.selNode;    
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selNode == node;  
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectPrevious : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        var ps = s.previousSibling;
+        if(ps){
+            if(!ps.isExpanded() || ps.childNodes.length < 1){
+                return this.select(ps, this.selectPrevious);
+            } else{
+                var lc = ps.lastChild;
+                while(lc && lc.isExpanded() && Ext.fly(lc.ui.wrap).isVisible() && lc.childNodes.length > 0){
+                    lc = lc.lastChild;
+                }
+                return this.select(lc, this.selectPrevious);
+            }
+        } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
+            return this.select(s.parentNode, this.selectPrevious);
+        }
+        return null;
+    },
+
+    /**
+     * Selects the node above the selected node in the tree, intelligently walking the nodes
+     * @return TreeNode The new selection
+     */
+    selectNext : function(/* private */ s){
+        if(!(s = s || this.selNode || this.lastSelNode)){
+            return null;
+        }
+        // Here we pass in the current function to select to indicate the direction we're moving
+        if(s.firstChild && s.isExpanded() && Ext.fly(s.ui.wrap).isVisible()){
+             return this.select(s.firstChild, this.selectNext);
+         }else if(s.nextSibling){
+             return this.select(s.nextSibling, this.selectNext);
+         }else if(s.parentNode){
+            var newS = null;
+            s.parentNode.bubble(function(){
+                if(this.nextSibling){
+                    newS = this.getOwnerTree().selModel.select(this.nextSibling, this.selectNext);
+                    return false;
+                }
+            });
+            return newS;
+         }
+        return null;
+    },
+
+    onKeyDown : function(e){
+        var s = this.selNode || this.lastSelNode;
+        // undesirable, but required
+        var sm = this;
+        if(!s){
+            return;
+        }
+        var k = e.getKey();
+        switch(k){
+             case e.DOWN:
+                 e.stopEvent();
+                 this.selectNext();
+             break;
+             case e.UP:
+                 e.stopEvent();
+                 this.selectPrevious();
+             break;
+             case e.RIGHT:
+                 e.preventDefault();
+                 if(s.hasChildNodes()){
+                     if(!s.isExpanded()){
+                         s.expand();
+                     }else if(s.firstChild){
+                         this.select(s.firstChild, e);
+                     }
+                 }
+             break;
+             case e.LEFT:
+                 e.preventDefault();
+                 if(s.hasChildNodes() && s.isExpanded()){
+                     s.collapse();
+                 }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+        };
+    }
+});
+
+/**
+ * @class Ext.tree.MultiSelectionModel
+ * @extends Ext.util.Observable
+ * Multi selection for a TreePanel.
+ */
+Ext.tree.MultiSelectionModel = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(config){
+        this.selNodes = [];
+        this.selMap = {};
+        this.addEvents(
+            /**
+             * @event selectionchange
+             * Fires when the selected nodes change
+             * @param {MultiSelectionModel} this
+             * @param {Array} nodes Array of the selected nodes
+             */
+            'selectionchange'
+        );
+        Ext.apply(this, config);
+        Ext.tree.MultiSelectionModel.superclass.constructor.call(this);    
+    },
+    
+    init : function(tree){
+        this.tree = tree;
+        tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
+        tree.on('click', this.onNodeClick, this);
+    },
+    
+    onNodeClick : function(node, e){
+        if(e.ctrlKey && this.isSelected(node)){
+            this.unselect(node);
+        }else{
+            this.select(node, e, e.ctrlKey);
+        }
+    },
+    
+    /**
+     * Select a node.
+     * @param {TreeNode} node The node to select
+     * @param {EventObject} e (optional) An event associated with the selection
+     * @param {Boolean} keepExisting True to retain existing selections
+     * @return {TreeNode} The selected node
+     */
+    select : function(node, e, keepExisting){
+        if(keepExisting !== true){
+            this.clearSelections(true);
+        }
+        if(this.isSelected(node)){
+            this.lastSelNode = node;
+            return node;
+        }
+        this.selNodes.push(node);
+        this.selMap[node.id] = node;
+        this.lastSelNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, this.selNodes);
+        return node;
+    },
+    
+    /**
+     * Deselect a node.
+     * @param {TreeNode} node The node to unselect
+     */
+    unselect : function(node){
+        if(this.selMap[node.id]){
+            node.ui.onSelectedChange(false);
+            var sn = this.selNodes;
+            var index = sn.indexOf(node);
+            if(index != -1){
+                this.selNodes.splice(index, 1);
+            }
+            delete this.selMap[node.id];
+            this.fireEvent('selectionchange', this, this.selNodes);
+        }
+    },
+    
+    /**
+     * Clear all selections
+     */
+    clearSelections : function(suppressEvent){
+        var sn = this.selNodes;
+        if(sn.length > 0){
+            for(var i = 0, len = sn.length; i < len; i++){
+                sn[i].ui.onSelectedChange(false);
+            }
+            this.selNodes = [];
+            this.selMap = {};
+            if(suppressEvent !== true){
+                this.fireEvent('selectionchange', this, this.selNodes);
+            }
+        }
+    },
+    
+    /**
+     * Returns true if the node is selected
+     * @param {TreeNode} node The node to check
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        return this.selMap[node.id] ? true : false;  
+    },
+    
+    /**
+     * Returns an array of the selected nodes
+     * @return {Array}
+     */
+    getSelectedNodes : function(){
+        return this.selNodes.concat([]);
+    },
+
+    onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,
+
+    selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,
+
+    selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious
+});/**
+ * @class Ext.data.Tree
+ * @extends Ext.util.Observable
+ * Represents a tree data structure and bubbles all the events for its nodes. The nodes
+ * in the tree have most standard DOM functionality.
+ * @constructor
+ * @param {Node} root (optional) The root node
+ */
+Ext.data.Tree = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(root){
+        this.nodeHash = {};
+        /**
+         * The root node for this tree
+         * @type Node
+         */
+        this.root = null;
+        if(root){
+            this.setRootNode(root);
+        }
+        this.addEvents(
+            /**
+             * @event append
+             * Fires when a new child node is appended to a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append",
+            /**
+             * @event remove
+             * Fires when a child node is removed from a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node removed
+             */
+            "remove",
+            /**
+             * @event move
+             * Fires when a node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node moved
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move",
+            /**
+             * @event insert
+             * Fires when a new child node is inserted in a node in this tree.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert",
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended to a node in this tree, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend",
+            /**
+             * @event beforeremove
+             * Fires before a child is removed from a node in this tree, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove",
+            /**
+             * @event beforemove
+             * Fires before a node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} node The node being moved
+             * @param {Node} oldParent The parent of the node
+             * @param {Node} newParent The new parent the node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove",
+            /**
+             * @event beforeinsert
+             * Fires before a new child is inserted in a node in this tree, return false to cancel the insert.
+             * @param {Tree} tree The owner tree
+             * @param {Node} parent The parent node
+             * @param {Node} node The child node to be inserted
+             * @param {Node} refNode The child node the node is being inserted before
+             */
+            "beforeinsert"
+        );
+        Ext.data.Tree.superclass.constructor.call(this);        
+    },
+    
+    /**
+     * @cfg {String} pathSeparator
+     * The token used to separate paths in node ids (defaults to '/').
+     */
+    pathSeparator: "/",
+
+    // private
+    proxyNodeEvent : function(){
+        return this.fireEvent.apply(this, arguments);
+    },
+
+    /**
+     * Returns the root node for this tree.
+     * @return {Node}
+     */
+    getRootNode : function(){
+        return this.root;
+    },
+
+    /**
+     * Sets the root node for this tree.
+     * @param {Node} node
+     * @return {Node}
+     */
+    setRootNode : function(node){
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        this.registerNode(node);
+        return node;
+    },
+
+    /**
+     * Gets a node in this tree by its id.
+     * @param {String} id
+     * @return {Node}
+     */
+    getNodeById : function(id){
+        return this.nodeHash[id];
+    },
+
+    // private
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+
+    // private
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+
+    toString : function(){
+        return "[Tree"+(this.id?" "+this.id:"")+"]";
+    }
+});
+
+/**
+ * @class Ext.data.Node
+ * @extends Ext.util.Observable
+ * @cfg {Boolean} leaf true if this node is a leaf and does not have children
+ * @cfg {String} id The id for this node. If one is not specified, one is generated.
+ * @constructor
+ * @param {Object} attributes The attributes/config for the node
+ */
+Ext.data.Node = Ext.extend(Ext.util.Observable, {
+    
+    constructor: function(attributes){
+        /**
+         * The attributes supplied for the node. You can use this property to access any custom attributes you supplied.
+         * @type {Object}
+         */
+        this.attributes = attributes || {};
+        this.leaf = this.attributes.leaf;
+        /**
+         * The node id. @type String
+         */
+        this.id = this.attributes.id;
+        if(!this.id){
+            this.id = Ext.id(null, "xnode-");
+            this.attributes.id = this.id;
+        }
+        /**
+         * All child nodes of this node. @type Array
+         */
+        this.childNodes = [];
+        /**
+         * The parent node for this node. @type Node
+         */
+        this.parentNode = null;
+        /**
+         * The first direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.firstChild = null;
+        /**
+         * The last direct child node of this node, or null if this node has no child nodes. @type Node
+         */
+        this.lastChild = null;
+        /**
+         * The node immediately preceding this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.previousSibling = null;
+        /**
+         * The node immediately following this node in the tree, or null if there is no sibling node. @type Node
+         */
+        this.nextSibling = null;
+
+        this.addEvents({
+            /**
+             * @event append
+             * Fires when a new child node is appended
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The newly appended node
+             * @param {Number} index The index of the newly appended node
+             */
+            "append" : true,
+            /**
+             * @event remove
+             * Fires when a child node is removed
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The removed node
+             */
+            "remove" : true,
+            /**
+             * @event move
+             * Fires when this node is moved to a new location in the tree
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The old parent of this node
+             * @param {Node} newParent The new parent of this node
+             * @param {Number} index The index it was moved to
+             */
+            "move" : true,
+            /**
+             * @event insert
+             * Fires when a new child node is inserted.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node inserted
+             * @param {Node} refNode The child node the node was inserted before
+             */
+            "insert" : true,
+            /**
+             * @event beforeappend
+             * Fires before a new child is appended, return false to cancel the append.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be appended
+             */
+            "beforeappend" : true,
+            /**
+             * @event beforeremove
+             * Fires before a child is removed, return false to cancel the remove.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} node The child node to be removed
+             */
+            "beforeremove" : true,
+            /**
+             * @event beforemove
+             * Fires before this node is moved to a new location in the tree. Return false to cancel the move.
+             * @param {Tree} tree The owner tree
+             * @param {Node} this This node
+             * @param {Node} oldParent The parent of this node
+             * @param {Node} newParent The new parent this node is moving to
+             * @param {Number} index The index it is being moved to
+             */
+            "beforemove" : true,
+             /**
+              * @event beforeinsert
+              * Fires before a new child is inserted, return false to cancel the insert.
+              * @param {Tree} tree The owner tree
+              * @param {Node} this This node
+              * @param {Node} node The child node to be inserted
+              * @param {Node} refNode The child node the node is being inserted before
+              */
+            "beforeinsert" : true
+        });
+        this.listeners = this.attributes.listeners;
+        Ext.data.Node.superclass.constructor.call(this);    
+    },
+    
+    // private
+    fireEvent : function(evtName){
+        // first do standard event for this node
+        if(Ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
+            return false;
+        }
+        // then bubble it up to the tree if the event wasn't cancelled
+        var ot = this.getOwnerTree();
+        if(ot){
+            if(ot.proxyNodeEvent.apply(ot, arguments) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Returns true if this node is a leaf
+     * @return {Boolean}
+     */
+    isLeaf : function(){
+        return this.leaf === true;
+    },
+
+    // private
+    setFirstChild : function(node){
+        this.firstChild = node;
+    },
+
+    //private
+    setLastChild : function(node){
+        this.lastChild = node;
+    },
+
+
+    /**
+     * Returns true if this node is the last child of its parent
+     * @return {Boolean}
+     */
+    isLast : function(){
+       return (!this.parentNode ? true : this.parentNode.lastChild == this);
+    },
+
+    /**
+     * Returns true if this node is the first child of its parent
+     * @return {Boolean}
+     */
+    isFirst : function(){
+       return (!this.parentNode ? true : this.parentNode.firstChild == this);
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, else false.
+     * @return {Boolean}
+     */
+    hasChildNodes : function(){
+        return !this.isLeaf() && this.childNodes.length > 0;
+    },
+
+    /**
+     * Returns true if this node has one or more child nodes, or if the <tt>expandable</tt>
+     * node attribute is explicitly specified as true (see {@link #attributes}), otherwise returns false.
+     * @return {Boolean}
+     */
+    isExpandable : function(){
+        return this.attributes.expandable || this.hasChildNodes();
+    },
+
+    /**
+     * Insert node(s) as the last child node of this node.
+     * @param {Node/Array} node The node or Array of nodes to append
+     * @return {Node} The appended node if single append, or null if an array was passed
+     */
+    appendChild : function(node){
+        var multi = false;
+        if(Ext.isArray(node)){
+            multi = node;
+        }else if(arguments.length > 1){
+            multi = arguments;
+        }
+        // if passed an array or multiple args do them one by one
+        if(multi){
+            for(var i = 0, len = multi.length; i < len; i++) {
+                this.appendChild(multi[i]);
+            }
+        }else{
+            if(this.fireEvent("beforeappend", this.ownerTree, this, node) === false){
+                return false;
+            }
+            var index = this.childNodes.length;
+            var oldParent = node.parentNode;
+            // it's a move, make sure we move it cleanly
+            if(oldParent){
+                if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index) === false){
+                    return false;
+                }
+                oldParent.removeChild(node);
+            }
+            index = this.childNodes.length;
+            if(index === 0){
+                this.setFirstChild(node);
+            }
+            this.childNodes.push(node);
+            node.parentNode = this;
+            var ps = this.childNodes[index-1];
+            if(ps){
+                node.previousSibling = ps;
+                ps.nextSibling = node;
+            }else{
+                node.previousSibling = null;
+            }
+            node.nextSibling = null;
+            this.setLastChild(node);
+            node.setOwnerTree(this.getOwnerTree());
+            this.fireEvent("append", this.ownerTree, this, node, index);
+            if(oldParent){
+                node.fireEvent("move", this.ownerTree, node, oldParent, this, index);
+            }
+            return node;
+        }
+    },
+
+    /**
+     * Removes a child node from this node.
+     * @param {Node} node The node to remove
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} The removed node
+     */
+    removeChild : function(node, destroy){
+        var index = this.childNodes.indexOf(node);
+        if(index == -1){
+            return false;
+        }
+        if(this.fireEvent("beforeremove", this.ownerTree, this, node) === false){
+            return false;
+        }
+
+        // remove it from childNodes collection
+        this.childNodes.splice(index, 1);
+
+        // update siblings
+        if(node.previousSibling){
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+        if(node.nextSibling){
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+
+        // update child refs
+        if(this.firstChild == node){
+            this.setFirstChild(node.nextSibling);
+        }
+        if(this.lastChild == node){
+            this.setLastChild(node.previousSibling);
+        }
+
+        this.fireEvent("remove", this.ownerTree, this, node);
+        if(destroy){
+            node.destroy(true);
+        }else{
+            node.clear();
+        }
+        return node;
+    },
+
+    // private
+    clear : function(destroy){
+        // clear any references from the node
+        this.setOwnerTree(null, destroy);
+        this.parentNode = this.previousSibling = this.nextSibling = null;
+        if(destroy){
+            this.firstChild = this.lastChild = null;
+        }
+    },
+
+    /**
+     * Destroys the node.
+     */
+    destroy : function(/* private */ silent){
+        /*
+         * Silent is to be used in a number of cases
+         * 1) When setRootNode is called.
+         * 2) When destroy on the tree is called
+         * 3) For destroying child nodes on a node
+         */
+        if(silent === true){
+            this.purgeListeners();
+            this.clear(true);
+            Ext.each(this.childNodes, function(n){
+                n.destroy(true);
+            });
+            this.childNodes = null;
+        }else{
+            this.remove(true);
+        }
+    },
+
+    /**
+     * Inserts the first node before the second node in this nodes childNodes collection.
+     * @param {Node} node The node to insert
+     * @param {Node} refNode The node to insert before (if null the node is appended)
+     * @return {Node} The inserted node
+     */
+    insertBefore : function(node, refNode){
+        if(!refNode){ // like standard Dom, refNode can be null for append
+            return this.appendChild(node);
+        }
+        // nothing to do
+        if(node == refNode){
+            return false;
+        }
+
+        if(this.fireEvent("beforeinsert", this.ownerTree, this, node, refNode) === false){
+            return false;
+        }
+        var index = this.childNodes.indexOf(refNode);
+        var oldParent = node.parentNode;
+        var refIndex = index;
+
+        // when moving internally, indexes will change after remove
+        if(oldParent == this && this.childNodes.indexOf(node) < index){
+            refIndex--;
+        }
+
+        // it's a move, make sure we move it cleanly
+        if(oldParent){
+            if(node.fireEvent("beforemove", node.getOwnerTree(), node, oldParent, this, index, refNode) === false){
+                return false;
+            }
+            oldParent.removeChild(node);
+        }
+        if(refIndex === 0){
+            this.setFirstChild(node);
+        }
+        this.childNodes.splice(refIndex, 0, node);
+        node.parentNode = this;
+        var ps = this.childNodes[refIndex-1];
+        if(ps){
+            node.previousSibling = ps;
+            ps.nextSibling = node;
+        }else{
+            node.previousSibling = null;
+        }
+        node.nextSibling = refNode;
+        refNode.previousSibling = node;
+        node.setOwnerTree(this.getOwnerTree());
+        this.fireEvent("insert", this.ownerTree, this, node, refNode);
+        if(oldParent){
+            node.fireEvent("move", this.ownerTree, node, oldParent, this, refIndex, refNode);
+        }
+        return node;
+    },
+
+    /**
+     * Removes this node from its parent
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    remove : function(destroy){
+        if (this.parentNode) {
+            this.parentNode.removeChild(this, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Removes all child nodes from this node.
+     * @param {Boolean} destroy <tt>true</tt> to destroy the node upon removal. Defaults to <tt>false</tt>.
+     * @return {Node} this
+     */
+    removeAll : function(destroy){
+        var cn = this.childNodes,
+            n;
+        while((n = cn[0])){
+            this.removeChild(n, destroy);
+        }
+        return this;
+    },
+
+    /**
+     * Returns the child node at the specified index.
+     * @param {Number} index
+     * @return {Node}
+     */
+    item : function(index){
+        return this.childNodes[index];
+    },
+
+    /**
+     * Replaces one child node in this node with another.
+     * @param {Node} newChild The replacement node
+     * @param {Node} oldChild The node to replace
+     * @return {Node} The replaced node
+     */
+    replaceChild : function(newChild, oldChild){
+        var s = oldChild ? oldChild.nextSibling : null;
+        this.removeChild(oldChild);
+        this.insertBefore(newChild, s);
+        return oldChild;
+    },
+
+    /**
+     * Returns the index of a child node
+     * @param {Node} node
+     * @return {Number} The index of the node or -1 if it was not found
+     */
+    indexOf : function(child){
+        return this.childNodes.indexOf(child);
+    },
+
+    /**
+     * Returns the tree this node is in.
+     * @return {Tree}
+     */
+    getOwnerTree : function(){
+        // if it doesn't have one, look for one
+        if(!this.ownerTree){
+            var p = this;
+            while(p){
+                if(p.ownerTree){
+                    this.ownerTree = p.ownerTree;
+                    break;
+                }
+                p = p.parentNode;
+            }
+        }
+        return this.ownerTree;
+    },
+
+    /**
+     * Returns depth of this node (the root node has a depth of 0)
+     * @return {Number}
+     */
+    getDepth : function(){
+        var depth = 0;
+        var p = this;
+        while(p.parentNode){
+            ++depth;
+            p = p.parentNode;
+        }
+        return depth;
+    },
+
+    // private
+    setOwnerTree : function(tree, destroy){
+        // if it is a move, we need to update everyone
+        if(tree != this.ownerTree){
+            if(this.ownerTree){
+                this.ownerTree.unregisterNode(this);
+            }
+            this.ownerTree = tree;
+            // If we're destroying, we don't need to recurse since it will be called on each child node
+            if(destroy !== true){
+                Ext.each(this.childNodes, function(n){
+                    n.setOwnerTree(tree);
+                });
+            }
+            if(tree){
+                tree.registerNode(this);
+            }
+        }
+    },
+
+    /**
+     * Changes the id of this node.
+     * @param {String} id The new id for the node.
+     */
+    setId: function(id){
+        if(id !== this.id){
+            var t = this.ownerTree;
+            if(t){
+                t.unregisterNode(this);
+            }
+            this.id = this.attributes.id = id;
+            if(t){
+                t.registerNode(this);
+            }
+            this.onIdChange(id);
+        }
+    },
+
+    // private
+    onIdChange: Ext.emptyFn,
+
+    /**
+     * Returns the path for this node. The path can be used to expand or select this node programmatically.
+     * @param {String} attr (optional) The attr to use for the path (defaults to the node's id)
+     * @return {String} The path
+     */
+    getPath : function(attr){
+        attr = attr || "id";
+        var p = this.parentNode;
+        var b = [this.attributes[attr]];
+        while(p){
+            b.unshift(p.attributes[attr]);
+            p = p.parentNode;
+        }
+        var sep = this.getOwnerTree().pathSeparator;
+        return sep + b.join(sep);
+    },
+
+    /**
+     * Bubbles up the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the bubble is stopped.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.apply(scope || p, args || [p]) === false){
+                break;
+            }
+            p = p.parentNode;
+        }
+    },
+
+    /**
+     * Cascades down the tree from this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the cascade is stopped on that branch.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    cascade : function(fn, scope, args){
+        if(fn.apply(scope || this, args || [this]) !== false){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+                cs[i].cascade(fn, scope, args);
+            }
+        }
+    },
+
+    /**
+     * Interates the child nodes of this node, calling the specified function with each node. The arguments to the function
+     * will be the args provided or the current node. If the function returns false at any point,
+     * the iteration stops.
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node in the iteration.
+     * @param {Array} args (optional) The args to call the function with (default to passing the current Node)
+     */
+    eachChild : function(fn, scope, args){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+            if(fn.apply(scope || cs[i], args || [cs[i]]) === false){
+                break;
+            }
+        }
+    },
+
+    /**
+     * Finds the first child that has the attribute with the specified value.
+     * @param {String} attribute The attribute name
+     * @param {Mixed} value The value to search for
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChild : function(attribute, value, deep){
+        return this.findChildBy(function(){
+            return this.attributes[attribute] == value;
+        }, null, deep);
+    },
+
+    /**
+     * Finds the first child by a custom function. The child matches if the function passed returns <code>true</code>.
+     * @param {Function} fn A function which must return <code>true</code> if the passed Node is the required Node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Node being tested.
+     * @param {Boolean} deep (Optional) True to search through nodes deeper than the immediate children
+     * @return {Node} The found child or null if none was found
+     */
+    findChildBy : function(fn, scope, deep){
+        var cs = this.childNodes,
+            len = cs.length,
+            i = 0,
+            n,
+            res;
+        for(; i < len; i++){
+            n = cs[i];
+            if(fn.call(scope || n, n) === true){
+                return n;
+            }else if (deep){
+                res = n.findChildBy(fn, scope, deep);
+                if(res != null){
+                    return res;
+                }
+            }
+            
+        }
+        return null;
+    },
+
+    /**
+     * Sorts this nodes children using the supplied sort function.
+     * @param {Function} fn A function which, when passed two Nodes, returns -1, 0 or 1 depending upon required sort order.
+     * @param {Object} scope (optional)The scope (<code>this</code> reference) in which the function is executed. Defaults to the browser window.
+     */
+    sort : function(fn, scope){
+        var cs = this.childNodes;
+        var len = cs.length;
+        if(len > 0){
+            var sortFn = scope ? function(){fn.apply(scope, arguments);} : fn;
+            cs.sort(sortFn);
+            for(var i = 0; i < len; i++){
+                var n = cs[i];
+                n.previousSibling = cs[i-1];
+                n.nextSibling = cs[i+1];
+                if(i === 0){
+                    this.setFirstChild(n);
+                }
+                if(i == len-1){
+                    this.setLastChild(n);
+                }
+            }
+        }
+    },
+
+    /**
+     * Returns true if this node is an ancestor (at any point) of the passed node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    contains : function(node){
+        return node.isAncestor(this);
+    },
+
+    /**
+     * Returns true if the passed node is an ancestor (at any point) of this node.
+     * @param {Node} node
+     * @return {Boolean}
+     */
+    isAncestor : function(node){
+        var p = this.parentNode;
+        while(p){
+            if(p == node){
+                return true;
+            }
+            p = p.parentNode;
+        }
+        return false;
+    },
+
+    toString : function(){
+        return "[Node"+(this.id?" "+this.id:"")+"]";
+    }
+});/**
+ * @class Ext.tree.TreeNode
+ * @extends Ext.data.Node
+ * @cfg {String} text The text for this node
+ * @cfg {Boolean} expanded true to start the node expanded
+ * @cfg {Boolean} allowDrag False to make this node undraggable if {@link #draggable} = true (defaults to true)
+ * @cfg {Boolean} allowDrop False if this node cannot have child nodes dropped on it (defaults to true)
+ * @cfg {Boolean} disabled true to start the node disabled
+ * @cfg {String} icon The path to an icon for the node. The preferred way to do this
+ * is to use the cls or iconCls attributes and add the icon via a CSS background image.
+ * @cfg {String} cls A css class to be added to the node
+ * @cfg {String} iconCls A css class to be added to the nodes icon element for applying css background images
+ * @cfg {String} href URL of the link used for the node (defaults to #)
+ * @cfg {String} hrefTarget target frame for the link
+ * @cfg {Boolean} hidden True to render hidden. (Defaults to false).
+ * @cfg {String} qtip An Ext QuickTip for the node
+ * @cfg {Boolean} expandable If set to true, the node will always show a plus/minus icon, even when empty
+ * @cfg {String} qtipCfg An Ext QuickTip config for the node (used instead of qtip)
+ * @cfg {Boolean} singleClickExpand True for single click expand on this node
+ * @cfg {Function} uiProvider A UI <b>class</b> to use for this node (defaults to Ext.tree.TreeNodeUI)
+ * @cfg {Boolean} checked True to render a checked checkbox for this node, false to render an unchecked checkbox
+ * (defaults to undefined with no checkbox rendered)
+ * @cfg {Boolean} draggable True to make this node draggable (defaults to false)
+ * @cfg {Boolean} isTarget False to not allow this node to act as a drop target (defaults to true)
+ * @cfg {Boolean} allowChildren False to not allow this node to have child nodes (defaults to true)
+ * @cfg {Boolean} editable False to not allow this node to be edited by an {@link Ext.tree.TreeEditor} (defaults to true)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node
+ */
+Ext.tree.TreeNode = Ext.extend(Ext.data.Node, {
+    
+    constructor : function(attributes){
+        attributes = attributes || {};
+        if(Ext.isString(attributes)){
+            attributes = {text: attributes};
+        }
+        this.childrenRendered = false;
+        this.rendered = false;
+        Ext.tree.TreeNode.superclass.constructor.call(this, attributes);
+        this.expanded = attributes.expanded === true;
+        this.isTarget = attributes.isTarget !== false;
+        this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;
+        this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;
+
+        /**
+         * Read-only. The text for this node. To change it use <code>{@link #setText}</code>.
+         * @type String
+         */
+        this.text = attributes.text;
+        /**
+         * True if this node is disabled.
+         * @type Boolean
+         */
+        this.disabled = attributes.disabled === true;
+        /**
+         * True if this node is hidden.
+         * @type Boolean
+         */
+        this.hidden = attributes.hidden === true;
+    
+        this.addEvents(
+            /**
+            * @event textchange
+            * Fires when the text for this node is changed
+            * @param {Node} this This node
+            * @param {String} text The new text
+            * @param {String} oldText The old text
+            */
+            'textchange',
+            /**
+            * @event beforeexpand
+            * Fires before this node is expanded, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforeexpand',
+            /**
+            * @event beforecollapse
+            * Fires before this node is collapsed, return false to cancel.
+            * @param {Node} this This node
+            * @param {Boolean} deep
+            * @param {Boolean} anim
+            */
+            'beforecollapse',
+            /**
+            * @event expand
+            * Fires when this node is expanded
+            * @param {Node} this This node
+            */
+            'expand',
+            /**
+            * @event disabledchange
+            * Fires when the disabled status of this node changes
+            * @param {Node} this This node
+            * @param {Boolean} disabled
+            */
+            'disabledchange',
+            /**
+            * @event collapse
+            * Fires when this node is collapsed
+            * @param {Node} this This node
+            */
+            'collapse',
+            /**
+            * @event beforeclick
+            * Fires before click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforeclick',
+            /**
+            * @event click
+            * Fires when this node is clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'click',
+            /**
+            * @event checkchange
+            * Fires when a node with a checkbox's checked property changes
+            * @param {Node} this This node
+            * @param {Boolean} checked
+            */
+            'checkchange',
+            /**
+            * @event beforedblclick
+            * Fires before double click processing. Return false to cancel the default action.
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'beforedblclick',
+            /**
+            * @event dblclick
+            * Fires when this node is double clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'dblclick',
+            /**
+            * @event contextmenu
+            * Fires when this node is right clicked
+            * @param {Node} this This node
+            * @param {Ext.EventObject} e The event object
+            */
+            'contextmenu',
+            /**
+            * @event beforechildrenrendered
+            * Fires right before the child nodes for this node are rendered
+            * @param {Node} this This node
+            */
+            'beforechildrenrendered'
+        );
+    
+        var uiClass = this.attributes.uiProvider || this.defaultUI || Ext.tree.TreeNodeUI;
+    
+        /**
+         * Read-only. The UI for this node
+         * @type TreeNodeUI
+         */
+        this.ui = new uiClass(this);    
+    },
+    
+    preventHScroll : true,
+    /**
+     * Returns true if this node is expanded
+     * @return {Boolean}
+     */
+    isExpanded : function(){
+        return this.expanded;
+    },
+
+/**
+ * Returns the UI object for this node.
+ * @return {TreeNodeUI} The object which is providing the user interface for this tree
+ * node. Unless otherwise specified in the {@link #uiProvider}, this will be an instance
+ * of {@link Ext.tree.TreeNodeUI}
+ */
+    getUI : function(){
+        return this.ui;
+    },
+
+    getLoader : function(){
+        var owner;
+        return this.loader || ((owner = this.getOwnerTree()) && owner.loader ? owner.loader : (this.loader = new Ext.tree.TreeLoader()));
+    },
+
+    // private override
+    setFirstChild : function(node){
+        var of = this.firstChild;
+        Ext.tree.TreeNode.superclass.setFirstChild.call(this, node);
+        if(this.childrenRendered && of && node != of){
+            of.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // private override
+    setLastChild : function(node){
+        var ol = this.lastChild;
+        Ext.tree.TreeNode.superclass.setLastChild.call(this, node);
+        if(this.childrenRendered && ol && node != ol){
+            ol.renderIndent(true, true);
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+
+    // these methods are overridden to provide lazy rendering support
+    // private override
+    appendChild : function(n){
+        if(!n.render && !Ext.isArray(n)){
+            n = this.getLoader().createNode(n);
+        }
+        var node = Ext.tree.TreeNode.superclass.appendChild.call(this, n);
+        if(node && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return node;
+    },
+
+    // private override
+    removeChild : function(node, destroy){
+        this.ownerTree.getSelectionModel().unselect(node);
+        Ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);
+        // only update the ui if we're not destroying
+        if(!destroy){
+            var rendered = node.ui.rendered;
+            // if it's been rendered remove dom node
+            if(rendered){
+                node.ui.remove();
+            }
+            if(rendered && this.childNodes.length < 1){
+                this.collapse(false, false);
+            }else{
+                this.ui.updateExpandIcon();
+            }
+            if(!this.firstChild && !this.isHiddenRoot()){
+                this.childrenRendered = false;
+            }
+        }
+        return node;
+    },
+
+    // private override
+    insertBefore : function(node, refNode){
+        if(!node.render){
+            node = this.getLoader().createNode(node);
+        }
+        var newNode = Ext.tree.TreeNode.superclass.insertBefore.call(this, node, refNode);
+        if(newNode && refNode && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return newNode;
+    },
+
+    /**
+     * Sets the text for this node
+     * @param {String} text
+     */
+    setText : function(text){
+        var oldText = this.text;
+        this.text = this.attributes.text = text;
+        if(this.rendered){ // event without subscribing
+            this.ui.onTextChange(this, text, oldText);
+        }
+        this.fireEvent('textchange', this, text, oldText);
+    },
+    
+    /**
+     * Sets the icon class for this node.
+     * @param {String} cls
+     */
+    setIconCls : function(cls){
+        var old = this.attributes.iconCls;
+        this.attributes.iconCls = cls;
+        if(this.rendered){
+            this.ui.onIconClsChange(this, cls, old);
+        }
+    },
+    
+    /**
+     * Sets the tooltip for this node.
+     * @param {String} tip The text for the tip
+     * @param {String} title (Optional) The title for the tip
+     */
+    setTooltip : function(tip, title){
+        this.attributes.qtip = tip;
+        this.attributes.qtipTitle = title;
+        if(this.rendered){
+            this.ui.onTipChange(this, tip, title);
+        }
+    },
+    
+    /**
+     * Sets the icon for this node.
+     * @param {String} icon
+     */
+    setIcon : function(icon){
+        this.attributes.icon = icon;
+        if(this.rendered){
+            this.ui.onIconChange(this, icon);
+        }
+    },
+    
+    /**
+     * Sets the href for the node.
+     * @param {String} href The href to set
+     * @param {String} (Optional) target The target of the href
+     */
+    setHref : function(href, target){
+        this.attributes.href = href;
+        this.attributes.hrefTarget = target;
+        if(this.rendered){
+            this.ui.onHrefChange(this, href, target);
+        }
+    },
+    
+    /**
+     * Sets the class on this node.
+     * @param {String} cls
+     */
+    setCls : function(cls){
+        var old = this.attributes.cls;
+        this.attributes.cls = cls;
+        if(this.rendered){
+            this.ui.onClsChange(this, cls, old);
+        }
+    },
+
+    /**
+     * Triggers selection of this node
+     */
+    select : function(){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().select(this);
+        }
+    },
+
+    /**
+     * Triggers deselection of this node
+     * @param {Boolean} silent (optional) True to stop selection change events from firing.
+     */
+    unselect : function(silent){
+        var t = this.getOwnerTree();
+        if(t){
+            t.getSelectionModel().unselect(this, silent);
+        }
+    },
+
+    /**
+     * Returns true if this node is selected
+     * @return {Boolean}
+     */
+    isSelected : function(){
+        var t = this.getOwnerTree();
+        return t ? t.getSelectionModel().isSelected(this) : false;
+    },
+
+    /**
+     * Expand this node.
+     * @param {Boolean} deep (optional) True to expand all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    expand : function(deep, anim, callback, scope){
+        if(!this.expanded){
+            if(this.fireEvent('beforeexpand', this, deep, anim) === false){
+                return;
+            }
+            if(!this.childrenRendered){
+                this.renderChildren();
+            }
+            this.expanded = true;
+            if(!this.isHiddenRoot() && (this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animExpand(function(){
+                    this.fireEvent('expand', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.expandChildNodes(true, true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.expand();
+                this.fireEvent('expand', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else{
+           this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            this.expandChildNodes(true);
+        }
+    },
+
+    runCallback : function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isHiddenRoot : function(){
+        return this.isRoot && !this.getOwnerTree().rootVisible;
+    },
+
+    /**
+     * Collapse this node.
+     * @param {Boolean} deep (optional) True to collapse all children as well
+     * @param {Boolean} anim (optional) false to cancel the default animation
+     * @param {Function} callback (optional) A callback to be called when
+     * expanding this node completes (does not wait for deep expand to complete).
+     * Called with 1 parameter, this node.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    collapse : function(deep, anim, callback, scope){
+        if(this.expanded && !this.isHiddenRoot()){
+            if(this.fireEvent('beforecollapse', this, deep, anim) === false){
+                return;
+            }
+            this.expanded = false;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animCollapse(function(){
+                    this.fireEvent('collapse', this);
+                    this.runCallback(callback, scope || this, [this]);
+                    if(deep === true){
+                        this.collapseChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.collapse();
+                this.fireEvent('collapse', this);
+                this.runCallback(callback, scope || this, [this]);
+            }
+        }else if(!this.expanded){
+            this.runCallback(callback, scope || this, [this]);
+        }
+        if(deep === true){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].collapse(true, false);
+            }
+        }
+    },
+
+    // private
+    delayedExpand : function(delay){
+        if(!this.expandProcId){
+            this.expandProcId = this.expand.defer(delay, this);
+        }
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+        }
+        this.expandProcId = false;
+    },
+
+    /**
+     * Toggles expanded/collapsed state of the node
+     */
+    toggle : function(){
+        if(this.expanded){
+            this.collapse();
+        }else{
+            this.expand();
+        }
+    },
+
+    /**
+     * Ensures all parent nodes are expanded, and if necessary, scrolls
+     * the node into view.
+     * @param {Function} callback (optional) A function to call when the node has been made visible.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this TreeNode.
+     */
+    ensureVisible : function(callback, scope){
+        var tree = this.getOwnerTree();
+        tree.expandPath(this.parentNode ? this.parentNode.getPath() : this.getPath(), false, function(){
+            var node = tree.getNodeById(this.id);  // Somehow if we don't do this, we lose changes that happened to node in the meantime
+            tree.getTreeEl().scrollChildIntoView(node.ui.anchor);
+            this.runCallback(callback, scope || this, [this]);
+        }.createDelegate(this));
+    },
+
+    /**
+     * Expand all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also expand their child nodes
+     */
+    expandChildNodes : function(deep, anim) {
+        var cs = this.childNodes,
+            i,
+            len = cs.length;
+        for (i = 0; i < len; i++) {
+        	cs[i].expand(deep, anim);
+        }
+    },
+
+    /**
+     * Collapse all child nodes
+     * @param {Boolean} deep (optional) true if the child nodes should also collapse their child nodes
+     */
+    collapseChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].collapse(deep);
+        }
+    },
+
+    /**
+     * Disables this node
+     */
+    disable : function(){
+        this.disabled = true;
+        this.unselect();
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, true);
+        }
+        this.fireEvent('disabledchange', this, true);
+    },
+
+    /**
+     * Enables this node
+     */
+    enable : function(){
+        this.disabled = false;
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, false);
+        }
+        this.fireEvent('disabledchange', this, false);
+    },
+
+    // private
+    renderChildren : function(suppressEvent){
+        if(suppressEvent !== false){
+            this.fireEvent('beforechildrenrendered', this);
+        }
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].render(true);
+        }
+        this.childrenRendered = true;
+    },
+
+    // private
+    sort : function(fn, scope){
+        Ext.tree.TreeNode.superclass.sort.apply(this, arguments);
+        if(this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].render(true);
+            }
+        }
+    },
+
+    // private
+    render : function(bulkRender){
+        this.ui.render(bulkRender);
+        if(!this.rendered){
+            // make sure it is registered
+            this.getOwnerTree().registerNode(this);
+            this.rendered = true;
+            if(this.expanded){
+                this.expanded = false;
+                this.expand(false, false);
+            }
+        }
+    },
+
+    // private
+    renderIndent : function(deep, refresh){
+        if(refresh){
+            this.ui.childIndent = null;
+        }
+        this.ui.renderIndent();
+        if(deep === true && this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].renderIndent(true, refresh);
+            }
+        }
+    },
+
+    beginUpdate : function(){
+        this.childrenRendered = false;
+    },
+
+    endUpdate : function(){
+        if(this.expanded && this.rendered){
+            this.renderChildren();
+        }
+    },
+
+    //inherit docs
+    destroy : function(silent){
+        if(silent === true){
+            this.unselect(true);
+        }
+        Ext.tree.TreeNode.superclass.destroy.call(this, silent);
+        Ext.destroy(this.ui, this.loader);
+        this.ui = this.loader = null;
+    },
+
+    // private
+    onIdChange : function(id){
+        this.ui.onIdChange(id);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.node = Ext.tree.TreeNode;/**
+ * @class Ext.tree.AsyncTreeNode
+ * @extends Ext.tree.TreeNode
+ * @cfg {TreeLoader} loader A TreeLoader to be used by this node (defaults to the loader defined on the tree)
+ * @constructor
+ * @param {Object/String} attributes The attributes/config for the node or just a string with the text for the node 
+ */
+ Ext.tree.AsyncTreeNode = function(config){
+    this.loaded = config && config.loaded === true;
+    this.loading = false;
+    Ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);
+    /**
+    * @event beforeload
+    * Fires before this node is loaded, return false to cancel
+    * @param {Node} this This node
+    */
+    this.addEvents('beforeload', 'load');
+    /**
+    * @event load
+    * Fires when this node is loaded
+    * @param {Node} this This node
+    */
+    /**
+     * The loader used by this node (defaults to using the tree's defined loader)
+     * @type TreeLoader
+     * @property loader
+     */
+};
+Ext.extend(Ext.tree.AsyncTreeNode, Ext.tree.TreeNode, {
+    expand : function(deep, anim, callback, scope){
+        if(this.loading){ // if an async load is already running, waiting til it's done
+            var timer;
+            var f = function(){
+                if(!this.loading){ // done loading
+                    clearInterval(timer);
+                    this.expand(deep, anim, callback, scope);
+                }
+            }.createDelegate(this);
+            timer = setInterval(f, 200);
+            return;
+        }
+        if(!this.loaded){
+            if(this.fireEvent("beforeload", this) === false){
+                return;
+            }
+            this.loading = true;
+            this.ui.beforeLoad(this);
+            var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();
+            if(loader){
+                loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback, scope]), this);
+                return;
+            }
+        }
+        Ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node is currently loading
+     * @return {Boolean}
+     */
+    isLoading : function(){
+        return this.loading;  
+    },
+    
+    loadComplete : function(deep, anim, callback, scope){
+        this.loading = false;
+        this.loaded = true;
+        this.ui.afterLoad(this);
+        this.fireEvent("load", this);
+        this.expand(deep, anim, callback, scope);
+    },
+    
+    /**
+     * Returns true if this node has been loaded
+     * @return {Boolean}
+     */
+    isLoaded : function(){
+        return this.loaded;
+    },
+    
+    hasChildNodes : function(){
+        if(!this.isLeaf() && !this.loaded){
+            return true;
+        }else{
+            return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);
+        }
+    },
+
+    /**
+     * Trigger a reload for this node
+     * @param {Function} callback
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the callback is executed. Defaults to this Node.
+     */
+    reload : function(callback, scope){
+        this.collapse(false, false);
+        while(this.firstChild){
+            this.removeChild(this.firstChild).destroy();
+        }
+        this.childrenRendered = false;
+        this.loaded = false;
+        if(this.isHiddenRoot()){
+            this.expanded = false;
+        }
+        this.expand(false, false, callback, scope);
+    }
+});
+
+Ext.tree.TreePanel.nodeTypes.async = Ext.tree.AsyncTreeNode;/**
+ * @class Ext.tree.TreeNodeUI
+ * This class provides the default UI implementation for Ext TreeNodes.
+ * The TreeNode UI implementation is separate from the
+ * tree implementation, and allows customizing of the appearance of
+ * tree nodes.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ * <p>
+ * This class provides access to the user interface components of an Ext TreeNode, through
+ * {@link Ext.tree.TreeNode#getUI}
+ */
+Ext.tree.TreeNodeUI = Ext.extend(Object, {
+    
+    constructor : function(node){
+        Ext.apply(this, {
+            node: node,
+            rendered: false,
+            animating: false,
+            wasLeaf: true,
+            ecc: 'x-tree-ec-icon x-tree-elbow',
+            emptyIcon: Ext.BLANK_IMAGE_URL    
+        });
+    },
+    
+    // private
+    removeChild : function(node){
+        if(this.rendered){
+            this.ctNode.removeChild(node.ui.getEl());
+        }
+    },
+
+    // private
+    beforeLoad : function(){
+         this.addClass("x-tree-node-loading");
+    },
+
+    // private
+    afterLoad : function(){
+         this.removeClass("x-tree-node-loading");
+    },
+
+    // private
+    onTextChange : function(node, text, oldText){
+        if(this.rendered){
+            this.textNode.innerHTML = text;
+        }
+    },
+    
+    // private
+    onIconClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.iconNode).replaceClass(oldCls, cls);
+        }
+    },
+    
+    // private
+    onIconChange : function(node, icon){
+        if(this.rendered){
+            //'<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            var empty = Ext.isEmpty(icon);
+            this.iconNode.src = empty ? this.emptyIcon : icon;
+            Ext.fly(this.iconNode)[empty ? 'removeClass' : 'addClass']('x-tree-node-inline-icon');
+        }
+    },
+    
+    // private
+    onTipChange : function(node, tip, title){
+        if(this.rendered){
+            var hasTitle = Ext.isDefined(title);
+            if(this.textNode.setAttributeNS){
+                this.textNode.setAttributeNS("ext", "qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttributeNS("ext", "qtitle", title);
+                }
+            }else{
+                this.textNode.setAttribute("ext:qtip", tip);
+                if(hasTitle){
+                    this.textNode.setAttribute("ext:qtitle", title);
+                }
+            }
+        }
+    },
+    
+    // private
+    onHrefChange : function(node, href, target){
+        if(this.rendered){
+            this.anchor.href = this.getHref(href);
+            if(Ext.isDefined(target)){
+                this.anchor.target = target;
+            }
+        }
+    },
+    
+    // private
+    onClsChange : function(node, cls, oldCls){
+        if(this.rendered){
+            Ext.fly(this.elNode).replaceClass(oldCls, cls);
+        }    
+    },
+
+    // private
+    onDisableChange : function(node, state){
+        this.disabled = state;
+        if (this.checkbox) {
+            this.checkbox.disabled = state;
+        }
+        this[state ? 'addClass' : 'removeClass']('x-tree-node-disabled');
+    },
+
+    // private
+    onSelectedChange : function(state){
+        if(state){
+            this.focus();
+            this.addClass("x-tree-selected");
+        }else{
+            //this.blur();
+            this.removeClass("x-tree-selected");
+        }
+    },
+
+    // private
+    onMove : function(tree, node, oldParent, newParent, index, refNode){
+        this.childIndent = null;
+        if(this.rendered){
+            var targetNode = newParent.ui.getContainer();
+            if(!targetNode){//target not rendered
+                this.holder = document.createElement("div");
+                this.holder.appendChild(this.wrap);
+                return;
+            }
+            var insertBefore = refNode ? refNode.ui.getEl() : null;
+            if(insertBefore){
+                targetNode.insertBefore(this.wrap, insertBefore);
+            }else{
+                targetNode.appendChild(this.wrap);
+            }
+            this.node.renderIndent(true, oldParent != newParent);
+        }
+    },
+
+/**
+ * Adds one or more CSS classes to the node's UI element.
+ * Duplicate classes are automatically filtered out.
+ * @param {String/Array} className The CSS class to add, or an array of classes
+ */
+    addClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).addClass(cls);
+        }
+    },
+
+/**
+ * Removes one or more CSS classes from the node's UI element.
+ * @param {String/Array} className The CSS class to remove, or an array of classes
+ */
+    removeClass : function(cls){
+        if(this.elNode){
+            Ext.fly(this.elNode).removeClass(cls);
+        }
+    },
+
+    // private
+    remove : function(){
+        if(this.rendered){
+            this.holder = document.createElement("div");
+            this.holder.appendChild(this.wrap);
+        }
+    },
+
+    // private
+    fireEvent : function(){
+        return this.node.fireEvent.apply(this.node, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.node.on("move", this.onMove, this);
+
+        if(this.node.disabled){
+            this.onDisableChange(this.node, true);
+        }
+        if(this.node.hidden){
+            this.hide();
+        }
+        var ot = this.node.getOwnerTree();
+        var dd = ot.enableDD || ot.enableDrag || ot.enableDrop;
+        if(dd && (!this.node.isRoot || ot.rootVisible)){
+            Ext.dd.Registry.register(this.elNode, {
+                node: this.node,
+                handles: this.getDDHandles(),
+                isHandle: false
+            });
+        }
+    },
+
+    // private
+    getDDHandles : function(){
+        return [this.iconNode, this.textNode, this.elNode];
+    },
+
+/**
+ * Hides this node.
+ */
+    hide : function(){
+        this.node.hidden = true;
+        if(this.wrap){
+            this.wrap.style.display = "none";
+        }
+    },
+
+/**
+ * Shows this node.
+ */
+    show : function(){
+        this.node.hidden = false;
+        if(this.wrap){
+            this.wrap.style.display = "";
+        }
+    },
+
+    // private
+    onContextMenu : function(e){
+        if (this.node.hasListener("contextmenu") || this.node.getOwnerTree().hasListener("contextmenu")) {
+            e.preventDefault();
+            this.focus();
+            this.fireEvent("contextmenu", this.node, e);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        if(this.dropping){
+            e.stopEvent();
+            return;
+        }
+        if(this.fireEvent("beforeclick", this.node, e) !== false){
+            var a = e.getTarget('a');
+            if(!this.disabled && this.node.attributes.href && a){
+                this.fireEvent("click", this.node, e);
+                return;
+            }else if(a && e.ctrlKey){
+                e.stopEvent();
+            }
+            e.preventDefault();
+            if(this.disabled){
+                return;
+            }
+
+            if(this.node.attributes.singleClickExpand && !this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+
+            this.fireEvent("click", this.node, e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    onDblClick : function(e){
+        e.preventDefault();
+        if(this.disabled){
+            return;
+        }
+        if(this.fireEvent("beforedblclick", this.node, e) !== false){
+            if(this.checkbox){
+                this.toggleCheck();
+            }
+            if(!this.animating && this.node.isExpandable()){
+                this.node.toggle();
+            }
+            this.fireEvent("dblclick", this.node, e);
+        }
+    },
+
+    onOver : function(e){
+        this.addClass('x-tree-node-over');
+    },
+
+    onOut : function(e){
+        this.removeClass('x-tree-node-over');
+    },
+
+    // private
+    onCheckChange : function(){
+        var checked = this.checkbox.checked;
+        // fix for IE6
+        this.checkbox.defaultChecked = checked;
+        this.node.attributes.checked = checked;
+        this.fireEvent('checkchange', this.node, checked);
+    },
+
+    // private
+    ecClick : function(e){
+        if(!this.animating && this.node.isExpandable()){
+            this.node.toggle();
+        }
+    },
+
+    // private
+    startDrop : function(){
+        this.dropping = true;
+    },
+
+    // delayed drop so the click event doesn't get fired on a drop
+    endDrop : function(){
+       setTimeout(function(){
+           this.dropping = false;
+       }.createDelegate(this), 50);
+    },
+
+    // private
+    expand : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "";
+    },
+
+    // private
+    focus : function(){
+        if(!this.node.preventHScroll){
+            try{this.anchor.focus();
+            }catch(e){}
+        }else{
+            try{
+                var noscroll = this.node.getOwnerTree().getTreeEl().dom;
+                var l = noscroll.scrollLeft;
+                this.anchor.focus();
+                noscroll.scrollLeft = l;
+            }catch(e){}
+        }
+    },
+
+/**
+ * Sets the checked status of the tree node to the passed value, or, if no value was passed,
+ * toggles the checked status. If the node was rendered with no checkbox, this has no effect.
+ * @param {Boolean} value (optional) The new checked status.
+ */
+    toggleCheck : function(value){
+        var cb = this.checkbox;
+        if(cb){
+            cb.checked = (value === undefined ? !cb.checked : value);
+            this.onCheckChange();
+        }
+    },
+
+    // private
+    blur : function(){
+        try{
+            this.anchor.blur();
+        }catch(e){}
+    },
+
+    // private
+    animExpand : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.stopFx();
+        if(!this.node.isExpandable()){
+            this.updateExpandIcon();
+            this.ctNode.style.display = "";
+            Ext.callback(callback);
+            return;
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideIn('t', {
+           callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    highlight : function(){
+        var tree = this.node.getOwnerTree();
+        Ext.fly(this.wrap).highlight(
+            tree.hlColor || "C3DAF9",
+            {endColor: tree.hlBaseColor}
+        );
+    },
+
+    // private
+    collapse : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = "none";
+    },
+
+    // private
+    animCollapse : function(callback){
+        var ct = Ext.get(this.ctNode);
+        ct.enableDisplayMode('block');
+        ct.stopFx();
+
+        this.animating = true;
+        this.updateExpandIcon();
+
+        ct.slideOut('t', {
+            callback : function(){
+               this.animating = false;
+               Ext.callback(callback);
+            },
+            scope: this,
+            duration: this.node.ownerTree.duration || .25
+        });
+    },
+
+    // private
+    getContainer : function(){
+        return this.ctNode;
+    },
+
+/**
+ * Returns the element which encapsulates this node.
+ * @return {HtmlElement} The DOM element. The default implementation uses a <code>&lt;li></code>.
+ */
+    getEl : function(){
+        return this.wrap;
+    },
+
+    // private
+    appendDDGhost : function(ghostNode){
+        ghostNode.appendChild(this.elNode.cloneNode(true));
+    },
+
+    // private
+    getDDRepairXY : function(){
+        return Ext.lib.Dom.getXY(this.iconNode);
+    },
+
+    // private
+    onRender : function(){
+        this.render();
+    },
+
+    // private
+    render : function(bulkRender){
+        var n = this.node, a = n.attributes;
+        var targetNode = n.parentNode ?
+              n.parentNode.ui.getContainer() : n.ownerTree.innerCt.dom;
+
+        if(!this.rendered){
+            this.rendered = true;
+
+            this.renderElements(n, a, targetNode, bulkRender);
+
+            if(a.qtip){
+                this.onTipChange(n, a.qtip, a.qtipTitle);
+            }else if(a.qtipCfg){
+                a.qtipCfg.target = Ext.id(this.textNode);
+                Ext.QuickTips.register(a.qtipCfg);
+            }
+            this.initEvents();
+            if(!this.node.expanded){
+                this.updateExpandIcon(true);
+            }
+        }else{
+            if(bulkRender === true) {
+                targetNode.appendChild(this.wrap);
+            }
+        }
+    },
+
+    // private
+    renderElements : function(n, a, targetNode, bulkRender){
+        // add some indent caching, this helps performance when rendering a large tree
+        this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
+
+        var cb = Ext.isBoolean(a.checked),
+            nel,
+            href = this.getHref(a.href),
+            buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',
+            '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
+            '<img alt="" src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
+            '<img alt="" src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
+            cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',
+            '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
+             a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",
+            '<ul class="x-tree-node-ct" style="display:none;"></ul>',
+            "</li>"].join('');
+
+        if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
+            this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
+        }else{
+            this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
+        }
+
+        this.elNode = this.wrap.childNodes[0];
+        this.ctNode = this.wrap.childNodes[1];
+        var cs = this.elNode.childNodes;
+        this.indentNode = cs[0];
+        this.ecNode = cs[1];
+        this.iconNode = cs[2];
+        var index = 3;
+        if(cb){
+            this.checkbox = cs[3];
+            // fix for IE6
+            this.checkbox.defaultChecked = this.checkbox.checked;
+            index++;
+        }
+        this.anchor = cs[index];
+        this.textNode = cs[index].firstChild;
+    },
+    
+    /**
+     * @private Gets a normalized href for the node.
+     * @param {String} href
+     */
+    getHref : function(href){
+        return Ext.isEmpty(href) ? (Ext.isGecko ? '' : '#') : href;
+    },
+
+/**
+ * Returns the &lt;a> element that provides focus for the node's UI.
+ * @return {HtmlElement} The DOM anchor element.
+ */
+    getAnchor : function(){
+        return this.anchor;
+    },
+
+/**
+ * Returns the text node.
+ * @return {HtmlNode} The DOM text node.
+ */
+    getTextEl : function(){
+        return this.textNode;
+    },
+
+/**
+ * Returns the icon &lt;img> element.
+ * @return {HtmlElement} The DOM image element.
+ */
+    getIconEl : function(){
+        return this.iconNode;
+    },
+
+/**
+ * Returns the checked status of the node. If the node was rendered with no
+ * checkbox, it returns false.
+ * @return {Boolean} The checked flag.
+ */
+    isChecked : function(){
+        return this.checkbox ? this.checkbox.checked : false;
+    },
+
+    // private
+    updateExpandIcon : function(){
+        if(this.rendered){
+            var n = this.node,
+                c1,
+                c2,
+                cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow",
+                hasChild = n.hasChildNodes();
+            if(hasChild || n.attributes.expandable){
+                if(n.expanded){
+                    cls += "-minus";
+                    c1 = "x-tree-node-collapsed";
+                    c2 = "x-tree-node-expanded";
+                }else{
+                    cls += "-plus";
+                    c1 = "x-tree-node-expanded";
+                    c2 = "x-tree-node-collapsed";
+                }
+                if(this.wasLeaf){
+                    this.removeClass("x-tree-node-leaf");
+                    this.wasLeaf = false;
+                }
+                if(this.c1 != c1 || this.c2 != c2){
+                    Ext.fly(this.elNode).replaceClass(c1, c2);
+                    this.c1 = c1; this.c2 = c2;
+                }
+            }else{
+                if(!this.wasLeaf){
+                    Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-collapsed");
+                    delete this.c1;
+                    delete this.c2;
+                    this.wasLeaf = true;
+                }
+            }
+            var ecc = "x-tree-ec-icon "+cls;
+            if(this.ecc != ecc){
+                this.ecNode.className = ecc;
+                this.ecc = ecc;
+            }
+        }
+    },
+
+    // private
+    onIdChange: function(id){
+        if(this.rendered){
+            this.elNode.setAttribute('ext:tree-node-id', id);
+        }
+    },
+
+    // private
+    getChildIndent : function(){
+        if(!this.childIndent){
+            var buf = [],
+                p = this.node;
+            while(p){
+                if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){
+                    if(!p.isLast()) {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-elbow-line" />');
+                    } else {
+                        buf.unshift('<img alt="" src="'+this.emptyIcon+'" class="x-tree-icon" />');
+                    }
+                }
+                p = p.parentNode;
+            }
+            this.childIndent = buf.join("");
+        }
+        return this.childIndent;
+    },
+
+    // private
+    renderIndent : function(){
+        if(this.rendered){
+            var indent = "",
+                p = this.node.parentNode;
+            if(p){
+                indent = p.ui.getChildIndent();
+            }
+            if(this.indentMarkup != indent){ // don't rerender if not required
+                this.indentNode.innerHTML = indent;
+                this.indentMarkup = indent;
+            }
+            this.updateExpandIcon();
+        }
+    },
+
+    destroy : function(){
+        if(this.elNode){
+            Ext.dd.Registry.unregister(this.elNode.id);
+        }
+
+        Ext.each(['textnode', 'anchor', 'checkbox', 'indentNode', 'ecNode', 'iconNode', 'elNode', 'ctNode', 'wrap', 'holder'], function(el){
+            if(this[el]){
+                Ext.fly(this[el]).remove();
+                delete this[el];
+            }
+        }, this);
+        delete this.node;
+    }
+});
+
+/**
+ * @class Ext.tree.RootTreeNodeUI
+ * This class provides the default UI implementation for <b>root</b> Ext TreeNodes.
+ * The RootTreeNode UI implementation allows customizing the appearance of the root tree node.<br>
+ * <p>
+ * If you are customizing the Tree's user interface, you
+ * may need to extend this class, but you should never need to instantiate this class.<br>
+ */
+Ext.tree.RootTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    // private
+    render : function(){
+        if(!this.rendered){
+            var targetNode = this.node.ownerTree.innerCt.dom;
+            this.node.expanded = true;
+            targetNode.innerHTML = '<div class="x-tree-root-node"></div>';
+            this.wrap = this.ctNode = targetNode.firstChild;
+        }
+    },
+    collapse : Ext.emptyFn,
+    expand : Ext.emptyFn
+});/**
+ * @class Ext.tree.TreeLoader
+ * @extends Ext.util.Observable
+ * A TreeLoader provides for lazy loading of an {@link Ext.tree.TreeNode}'s child
+ * nodes from a specified URL. The response must be a JavaScript Array definition
+ * whose elements are node definition objects. e.g.:
+ * <pre><code>
+    [{
+        id: 1,
+        text: 'A leaf Node',
+        leaf: true
+    },{
+        id: 2,
+        text: 'A folder Node',
+        children: [{
+            id: 3,
+            text: 'A child Node',
+            leaf: true
+        }]
+   }]
+</code></pre>
+ * <br><br>
+ * A server request is sent, and child nodes are loaded only when a node is expanded.
+ * The loading node's id is passed to the server under the parameter name "node" to
+ * enable the server to produce the correct child nodes.
+ * <br><br>
+ * To pass extra parameters, an event handler may be attached to the "beforeload"
+ * event, and the parameters specified in the TreeLoader's baseParams property:
+ * <pre><code>
+    myTreeLoader.on("beforeload", function(treeLoader, node) {
+        this.baseParams.category = node.attributes.category;
+    }, this);
+</code></pre>
+ * This would pass an HTTP parameter called "category" to the server containing
+ * the value of the Node's "category" attribute.
+ * @constructor
+ * Creates a new Treeloader.
+ * @param {Object} config A config object containing config properties.
+ */
+Ext.tree.TreeLoader = function(config){
+    this.baseParams = {};
+    Ext.apply(this, config);
+
+    this.addEvents(
+        /**
+         * @event beforeload
+         * Fires before a network request is made to retrieve the Json text which specifies a node's children.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} callback The callback function specified in the {@link #load} call.
+         */
+        "beforeload",
+        /**
+         * @event load
+         * Fires when the node has been successfuly loaded.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "load",
+        /**
+         * @event loadexception
+         * Fires if the network request failed.
+         * @param {Object} This TreeLoader object.
+         * @param {Object} node The {@link Ext.tree.TreeNode} object being loaded.
+         * @param {Object} response The response object containing the data from the server.
+         */
+        "loadexception"
+    );
+    Ext.tree.TreeLoader.superclass.constructor.call(this);
+    if(Ext.isString(this.paramOrder)){
+        this.paramOrder = this.paramOrder.split(/[\s,|]/);
+    }
+};
+
+Ext.extend(Ext.tree.TreeLoader, Ext.util.Observable, {
+    /**
+    * @cfg {String} dataUrl The URL from which to request a Json string which
+    * specifies an array of node definition objects representing the child nodes
+    * to be loaded.
+    */
+    /**
+     * @cfg {String} requestMethod The HTTP request method for loading data (defaults to the value of {@link Ext.Ajax#method}).
+     */
+    /**
+     * @cfg {String} url Equivalent to {@link #dataUrl}.
+     */
+    /**
+     * @cfg {Boolean} preloadChildren If set to true, the loader recursively loads "children" attributes when doing the first load on nodes.
+     */
+    /**
+    * @cfg {Object} baseParams (optional) An object containing properties which
+    * specify HTTP parameters to be passed to each request for child nodes.
+    */
+    /**
+    * @cfg {Object} baseAttrs (optional) An object containing attributes to be added to all nodes
+    * created by this loader. If the attributes sent by the server have an attribute in this object,
+    * they take priority.
+    */
+    /**
+    * @cfg {Object} uiProviders (optional) An object containing properties which
+    * specify custom {@link Ext.tree.TreeNodeUI} implementations. If the optional
+    * <i>uiProvider</i> attribute of a returned child node is a string rather
+    * than a reference to a TreeNodeUI implementation, then that string value
+    * is used as a property name in the uiProviders object.
+    */
+    uiProviders : {},
+
+    /**
+    * @cfg {Boolean} clearOnLoad (optional) Default to true. Remove previously existing
+    * child nodes before loading.
+    */
+    clearOnLoad : true,
+
+    /**
+     * @cfg {Array/String} paramOrder Defaults to <tt>undefined</tt>. Only used when using directFn.
+     * Specifies the params in the order in which they must be passed to the server-side Direct method
+     * as either (1) an Array of String values, or (2) a String of params delimited by either whitespace,
+     * comma, or pipe. For example,
+     * any of the following would be acceptable:<pre><code>
+nodeParameter: 'node',
+paramOrder: ['param1','param2','param3']
+paramOrder: 'node param1 param2 param3'
+paramOrder: 'param1,node,param2,param3'
+paramOrder: 'param1|param2|param|node'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used when using directFn.
+     * Send parameters as a collection of named arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} nodeParameter The name of the parameter sent to the server which contains
+     * the identifier of the node. Defaults to <tt>'node'</tt>.
+     */
+    nodeParameter: 'node',
+
+    /**
+     * @cfg {Function} directFn
+     * Function to call when executing a request.
+     */
+    directFn : undefined,
+
+    /**
+     * Load an {@link Ext.tree.TreeNode} from the URL specified in the constructor.
+     * This is called automatically when a node is expanded, but may be used to reload
+     * a node (or append new children if the {@link #clearOnLoad} option is false.)
+     * @param {Ext.tree.TreeNode} node
+     * @param {Function} callback Function to call after the node has been loaded. The
+     * function is passed the TreeNode which was requested to be loaded.
+     * @param {Object} scope The scope (<code>this</code> reference) in which the callback is executed.
+     * defaults to the loaded TreeNode.
+     */
+    load : function(node, callback, scope){
+        if(this.clearOnLoad){
+            while(node.firstChild){
+                node.removeChild(node.firstChild);
+            }
+        }
+        if(this.doPreload(node)){ // preloaded json children
+            this.runCallback(callback, scope || node, [node]);
+        }else if(this.directFn || this.dataUrl || this.url){
+            this.requestData(node, callback, scope || node);
+        }
+    },
+
+    doPreload : function(node){
+        if(node.attributes.children){
+            if(node.childNodes.length < 1){ // preloaded?
+                var cs = node.attributes.children;
+                node.beginUpdate();
+                for(var i = 0, len = cs.length; i < len; i++){
+                    var cn = node.appendChild(this.createNode(cs[i]));
+                    if(this.preloadChildren){
+                        this.doPreload(cn);
+                    }
+                }
+                node.endUpdate();
+            }
+            return true;
+        }
+        return false;
+    },
+
+    getParams: function(node){
+        var bp = Ext.apply({}, this.baseParams),
+            np = this.nodeParameter,
+            po = this.paramOrder;
+
+        np && (bp[ np ] = node.id);
+
+        if(this.directFn){
+            var buf = [node.id];
+            if(po){
+                // reset 'buf' if the nodeParameter was included in paramOrder
+                if(np && po.indexOf(np) > -1){
+                    buf = [];
+                }
+
+                for(var i = 0, len = po.length; i < len; i++){
+                    buf.push(bp[ po[i] ]);
+                }
+            }else if(this.paramsAsHash){
+                buf = [bp];
+            }
+            return buf;
+        }else{
+            return bp;
+        }
+    },
+
+    requestData : function(node, callback, scope){
+        if(this.fireEvent("beforeload", this, node, callback) !== false){
+            if(this.directFn){
+                var args = this.getParams(node);
+                args.push(this.processDirectResponse.createDelegate(this, [{callback: callback, node: node, scope: scope}], true));
+                this.directFn.apply(window, args);
+            }else{
+                this.transId = Ext.Ajax.request({
+                    method:this.requestMethod,
+                    url: this.dataUrl||this.url,
+                    success: this.handleResponse,
+                    failure: this.handleFailure,
+                    scope: this,
+                    argument: {callback: callback, node: node, scope: scope},
+                    params: this.getParams(node)
+                });
+            }
+        }else{
+            // if the load is cancelled, make sure we notify
+            // the node that we are done
+            this.runCallback(callback, scope || node, []);
+        }
+    },
+
+    processDirectResponse: function(result, response, args){
+        if(response.status){
+            this.handleResponse({
+                responseData: Ext.isArray(result) ? result : null,
+                responseText: result,
+                argument: args
+            });
+        }else{
+            this.handleFailure({
+                argument: args
+            });
+        }
+    },
+
+    // private
+    runCallback: function(cb, scope, args){
+        if(Ext.isFunction(cb)){
+            cb.apply(scope, args);
+        }
+    },
+
+    isLoading : function(){
+        return !!this.transId;
+    },
+
+    abort : function(){
+        if(this.isLoading()){
+            Ext.Ajax.abort(this.transId);
+        }
+    },
+
+    /**
+    * <p>Override this function for custom TreeNode node implementation, or to
+    * modify the attributes at creation time.</p>
+    * Example:<pre><code>
+new Ext.tree.TreePanel({
+    ...
+    loader: new Ext.tree.TreeLoader({
+        url: 'dataUrl',
+        createNode: function(attr) {
+//          Allow consolidation consignments to have
+//          consignments dropped into them.
+            if (attr.isConsolidation) {
+                attr.iconCls = 'x-consol',
+                attr.allowDrop = true;
+            }
+            return Ext.tree.TreeLoader.prototype.createNode.call(this, attr);
+        }
+    }),
+    ...
+});
+</code></pre>
+    * @param attr {Object} The attributes from which to create the new node.
+    */
+    createNode : function(attr){
+        // apply baseAttrs, nice idea Corey!
+        if(this.baseAttrs){
+            Ext.applyIf(attr, this.baseAttrs);
+        }
+        if(this.applyLoader !== false && !attr.loader){
+            attr.loader = this;
+        }
+        if(Ext.isString(attr.uiProvider)){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        if(attr.nodeType){
+            return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+        }else{
+            return attr.leaf ?
+                        new Ext.tree.TreeNode(attr) :
+                        new Ext.tree.AsyncTreeNode(attr);
+        }
+    },
+
+    processResponse : function(response, node, callback, scope){
+        var json = response.responseText;
+        try {
+            var o = response.responseData || Ext.decode(json);
+            node.beginUpdate();
+            for(var i = 0, len = o.length; i < len; i++){
+                var n = this.createNode(o[i]);
+                if(n){
+                    node.appendChild(n);
+                }
+            }
+            node.endUpdate();
+            this.runCallback(callback, scope || node, [node]);
+        }catch(e){
+            this.handleFailure(response);
+        }
+    },
+
+    handleResponse : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.processResponse(response, a.node, a.callback, a.scope);
+        this.fireEvent("load", this, a.node, response);
+    },
+
+    handleFailure : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.fireEvent("loadexception", this, a.node, response);
+        this.runCallback(a.callback, a.scope || a.node, [a.node]);
+    },
+
+    destroy : function(){
+        this.abort();
+        this.purgeListeners();
+    }
+});/**
+ * @class Ext.tree.TreeFilter
+ * Note this class is experimental and doesn't update the indent (lines) or expand collapse icons of the nodes
+ * @param {TreePanel} tree
+ * @param {Object} config (optional)
+ */
+Ext.tree.TreeFilter = function(tree, config){
+    this.tree = tree;
+    this.filtered = {};
+    Ext.apply(this, config);
+};
+
+Ext.tree.TreeFilter.prototype = {
+    clearBlank:false,
+    reverse:false,
+    autoClear:false,
+    remove:false,
+
+     /**
+     * Filter the data by a specific attribute.
+     * @param {String/RegExp} value Either string that the attribute value
+     * should start with or a RegExp to test against the attribute
+     * @param {String} attr (optional) The attribute passed in your node's attributes collection. Defaults to "text".
+     * @param {TreeNode} startNode (optional) The node to start the filter at.
+     */
+    filter : function(value, attr, startNode){
+        attr = attr || "text";
+        var f;
+        if(typeof value == "string"){
+            var vlen = value.length;
+            // auto clear empty filter
+            if(vlen == 0 && this.clearBlank){
+                this.clear();
+                return;
+            }
+            value = value.toLowerCase();
+            f = function(n){
+                return n.attributes[attr].substr(0, vlen).toLowerCase() == value;
+            };
+        }else if(value.exec){ // regex?
+            f = function(n){
+                return value.test(n.attributes[attr]);
+            };
+        }else{
+            throw 'Illegal filter type, must be string or regex';
+        }
+        this.filterBy(f, null, startNode);
+	},
+
+    /**
+     * Filter by a function. The passed function will be called with each
+     * node in the tree (or from the startNode). If the function returns true, the node is kept
+     * otherwise it is filtered. If a node is filtered, its children are also filtered.
+     * @param {Function} fn The filter function
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the current Node.
+     */
+    filterBy : function(fn, scope, startNode){
+        startNode = startNode || this.tree.root;
+        if(this.autoClear){
+            this.clear();
+        }
+        var af = this.filtered, rv = this.reverse;
+        var f = function(n){
+            if(n == startNode){
+                return true;
+            }
+            if(af[n.id]){
+                return false;
+            }
+            var m = fn.call(scope || n, n);
+            if(!m || rv){
+                af[n.id] = n;
+                n.ui.hide();
+                return false;
+            }
+            return true;
+        };
+        startNode.cascade(f);
+        if(this.remove){
+           for(var id in af){
+               if(typeof id != "function"){
+                   var n = af[id];
+                   if(n && n.parentNode){
+                       n.parentNode.removeChild(n);
+                   }
+               }
+           }
+        }
+    },
+
+    /**
+     * Clears the current filter. Note: with the "remove" option
+     * set a filter cannot be cleared.
+     */
+    clear : function(){
+        var t = this.tree;
+        var af = this.filtered;
+        for(var id in af){
+            if(typeof id != "function"){
+                var n = af[id];
+                if(n){
+                    n.ui.show();
+                }
+            }
+        }
+        this.filtered = {};
+    }
+};
+/**
+ * @class Ext.tree.TreeSorter
+ * Provides sorting of nodes in a {@link Ext.tree.TreePanel}.  The TreeSorter automatically monitors events on the
+ * associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
+ * Example usage:<br />
+ * <pre><code>
+new Ext.tree.TreeSorter(myTree, {
+    folderSort: true,
+    dir: "desc",
+    sortType: function(node) {
+        // sort by a custom, typed attribute:
+        return parseInt(node.id, 10);
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} config
+ */
+Ext.tree.TreeSorter = Ext.extend(Object, {
+    
+    constructor: function(tree, config){
+        /**
+     * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
+     */
+    /**
+     * @cfg {String} property The named attribute on the node to sort by (defaults to "text").  Note that this
+     * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
+     */
+    /**
+     * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
+     */
+    /**
+     * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
+     */
+    /**
+     * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
+     */
+    /**
+     * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting.  The function
+     * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
+     * the node's sort value cast to the specific data type required for sorting.  This could be used, for example, when
+     * a node's text (or other attribute) should be sorted as a date or numeric value.  See the class description for
+     * example usage.  Note that if a sortType is specified, any {@link #property} config will be ignored.
+     */
+
+    Ext.apply(this, config);
+    tree.on({
+        scope: this,
+        beforechildrenrendered: this.doSort,
+        append: this.updateSort,
+        insert: this.updateSort,
+        textchange: this.updateSortParent
+    });
+
+    var desc = this.dir && this.dir.toLowerCase() == 'desc',
+        prop = this.property || 'text',
+        sortType = this.sortType,
+        folderSort = this.folderSort,
+        caseSensitive = this.caseSensitive === true,
+        leafAttr = this.leafAttr || 'leaf';
+
+    if(Ext.isString(sortType)){
+        sortType = Ext.data.SortTypes[sortType];
+    }
+    this.sortFn = function(n1, n2){
+        var attr1 = n1.attributes,
+            attr2 = n2.attributes;
+            
+        if(folderSort){
+            if(attr1[leafAttr] && !attr2[leafAttr]){
+                return 1;
+            }
+            if(!attr1[leafAttr] && attr2[leafAttr]){
+                return -1;
+            }
+        }
+        var prop1 = attr1[prop],
+            prop2 = attr2[prop],
+            v1 = sortType ? sortType(prop1) : (caseSensitive ? prop1 : prop1.toUpperCase()),
+            v2 = sortType ? sortType(prop2) : (caseSensitive ? prop2 : prop2.toUpperCase());
+            
+        if(v1 < v2){
+            return desc ? 1 : -1;
+        }else if(v1 > v2){
+            return desc ? -1 : 1;
+        }
+        return 0;
+    };
+    },
+    
+    doSort : function(node){
+        node.sort(this.sortFn);
+    },
+
+    updateSort : function(tree, node){
+        if(node.childrenRendered){
+            this.doSort.defer(1, this, [node]);
+        }
+    },
+
+    updateSortParent : function(node){
+        var p = node.parentNode;
+        if(p && p.childrenRendered){
+            this.doSort.defer(1, this, [p]);
+        }
+    }    
+});
+/**
+ * @class Ext.tree.TreeDropZone
+ * @extends Ext.dd.DropZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dropping
+ * @param {Object} config
+ */
+if(Ext.dd.DropZone){
+    
+Ext.tree.TreeDropZone = function(tree, config){
+    /**
+     * @cfg {Boolean} allowParentInsert
+     * Allow inserting a dragged node between an expanded parent node and its first child that will become a
+     * sibling of the parent when dropped (defaults to false)
+     */
+    this.allowParentInsert = config.allowParentInsert || false;
+    /**
+     * @cfg {String} allowContainerDrop
+     * True if drops on the tree container (outside of a specific tree node) are allowed (defaults to false)
+     */
+    this.allowContainerDrop = config.allowContainerDrop || false;
+    /**
+     * @cfg {String} appendOnly
+     * True if the tree should only allow append drops (use for trees which are sorted, defaults to false)
+     */
+    this.appendOnly = config.appendOnly || false;
+
+    Ext.tree.TreeDropZone.superclass.constructor.call(this, tree.getTreeEl(), config);
+    /**
+    * The TreePanel for this drop zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+    /**
+    * Arbitrary data that can be associated with this tree and will be included in the event object that gets
+    * passed to any nodedragover event handler (defaults to {})
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.dragOverData = {};
+    // private
+    this.lastInsertClass = "x-tree-no-status";
+};
+
+Ext.extend(Ext.tree.TreeDropZone, Ext.dd.DropZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    /**
+     * @cfg {String} expandDelay
+     * The delay in milliseconds to wait before expanding a target tree node while dragging a droppable node
+     * over the target (defaults to 1000)
+     */
+    expandDelay : 1000,
+
+    // private
+    expandNode : function(node){
+        if(node.hasChildNodes() && !node.isExpanded()){
+            node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));
+        }
+    },
+
+    // private
+    queueExpand : function(node){
+        this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);
+    },
+
+    // private
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+            this.expandProcId = false;
+        }
+    },
+
+    // private
+    isValidDropPoint : function(n, pt, dd, e, data){
+        if(!n || !data){ return false; }
+        var targetNode = n.node;
+        var dropNode = data.node;
+        // default drop rules
+        if(!(targetNode && targetNode.isTarget && pt)){
+            return false;
+        }
+        if(pt == "append" && targetNode.allowChildren === false){
+            return false;
+        }
+        if((pt == "above" || pt == "below") && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){
+            return false;
+        }
+        if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){
+            return false;
+        }
+        // reuse the object
+        var overEvent = this.dragOverData;
+        overEvent.tree = this.tree;
+        overEvent.target = targetNode;
+        overEvent.data = data;
+        overEvent.point = pt;
+        overEvent.source = dd;
+        overEvent.rawEvent = e;
+        overEvent.dropNode = dropNode;
+        overEvent.cancel = false;  
+        var result = this.tree.fireEvent("nodedragover", overEvent);
+        return overEvent.cancel === false && result !== false;
+    },
+
+    // private
+    getDropPoint : function(e, n, dd){
+        var tn = n.node;
+        if(tn.isRoot){
+            return tn.allowChildren !== false ? "append" : false; // always append for root
+        }
+        var dragEl = n.ddel;
+        var t = Ext.lib.Dom.getY(dragEl), b = t + dragEl.offsetHeight;
+        var y = Ext.lib.Event.getPageY(e);
+        var noAppend = tn.allowChildren === false || tn.isLeaf();
+        if(this.appendOnly || tn.parentNode.allowChildren === false){
+            return noAppend ? false : "append";
+        }
+        var noBelow = false;
+        if(!this.allowParentInsert){
+            noBelow = tn.hasChildNodes() && tn.isExpanded();
+        }
+        var q = (b - t) / (noAppend ? 2 : 3);
+        if(y >= t && y < (t + q)){
+            return "above";
+        }else if(!noBelow && (noAppend || y >= b-q && y <= b)){
+            return "below";
+        }else{
+            return "append";
+        }
+    },
+
+    // private
+    onNodeEnter : function(n, dd, e, data){
+        this.cancelExpand();
+    },
+    
+    onContainerOver : function(dd, e, data) {
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            return this.dropAllowed;
+        }
+        return this.dropNotAllowed;
+    },
+
+    // private
+    onNodeOver : function(n, dd, e, data){
+        var pt = this.getDropPoint(e, n, dd);
+        var node = n.node;
+        
+        // auto node expand check
+        if(!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()){
+            this.queueExpand(node);
+        }else if(pt != "append"){
+            this.cancelExpand();
+        }
+        
+        // set the insert point style on the target node
+        var returnCls = this.dropNotAllowed;
+        if(this.isValidDropPoint(n, pt, dd, e, data)){
+           if(pt){
+               var el = n.ddel;
+               var cls;
+               if(pt == "above"){
+                   returnCls = n.node.isFirst() ? "x-tree-drop-ok-above" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-above";
+               }else if(pt == "below"){
+                   returnCls = n.node.isLast() ? "x-tree-drop-ok-below" : "x-tree-drop-ok-between";
+                   cls = "x-tree-drag-insert-below";
+               }else{
+                   returnCls = "x-tree-drop-ok-append";
+                   cls = "x-tree-drag-append";
+               }
+               if(this.lastInsertClass != cls){
+                   Ext.fly(el).replaceClass(this.lastInsertClass, cls);
+                   this.lastInsertClass = cls;
+               }
+           }
+       }
+       return returnCls;
+    },
+
+    // private
+    onNodeOut : function(n, dd, e, data){
+        this.cancelExpand();
+        this.removeDropIndicators(n);
+    },
+
+    // private
+    onNodeDrop : function(n, dd, e, data){
+        var point = this.getDropPoint(e, n, dd);
+        var targetNode = n.node;
+        targetNode.ui.startDrop();
+        if(!this.isValidDropPoint(n, point, dd, e, data)){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        // first try to find the drop node
+        var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);
+        return this.processDrop(targetNode, data, point, dd, e, dropNode);
+    },
+    
+    onContainerDrop : function(dd, e, data){
+        if (this.allowContainerDrop && this.isValidDropPoint({ ddel: this.tree.getRootNode().ui.elNode, node: this.tree.getRootNode() }, "append", dd, e, data)) {
+            var targetNode = this.tree.getRootNode();       
+            targetNode.ui.startDrop();
+            var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, 'append', e) : null);
+            return this.processDrop(targetNode, data, 'append', dd, e, dropNode);
+        }
+        return false;
+    },
+    
+    // private
+    processDrop: function(target, data, point, dd, e, dropNode){
+        var dropEvent = {
+            tree : this.tree,
+            target: target,
+            data: data,
+            point: point,
+            source: dd,
+            rawEvent: e,
+            dropNode: dropNode,
+            cancel: !dropNode,
+            dropStatus: false
+        };
+        var retval = this.tree.fireEvent("beforenodedrop", dropEvent);
+        if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){
+            target.ui.endDrop();
+            return dropEvent.dropStatus;
+        }
+    
+        target = dropEvent.target;
+        if(point == 'append' && !target.isExpanded()){
+            target.expand(false, null, function(){
+                this.completeDrop(dropEvent);
+            }.createDelegate(this));
+        }else{
+            this.completeDrop(dropEvent);
+        }
+        return true;
+    },
+
+    // private
+    completeDrop : function(de){
+        var ns = de.dropNode, p = de.point, t = de.target;
+        if(!Ext.isArray(ns)){
+            ns = [ns];
+        }
+        var n;
+        for(var i = 0, len = ns.length; i < len; i++){
+            n = ns[i];
+            if(p == "above"){
+                t.parentNode.insertBefore(n, t);
+            }else if(p == "below"){
+                t.parentNode.insertBefore(n, t.nextSibling);
+            }else{
+                t.appendChild(n);
+            }
+        }
+        n.ui.focus();
+        if(Ext.enableFx && this.tree.hlDrop){
+            n.ui.highlight();
+        }
+        t.ui.endDrop();
+        this.tree.fireEvent("nodedrop", de);
+    },
+
+    // private
+    afterNodeMoved : function(dd, data, e, targetNode, dropNode){
+        if(Ext.enableFx && this.tree.hlDrop){
+            dropNode.ui.focus();
+            dropNode.ui.highlight();
+        }
+        this.tree.fireEvent("nodedrop", this.tree, targetNode, data, dd, e);
+    },
+
+    // private
+    getTree : function(){
+        return this.tree;
+    },
+
+    // private
+    removeDropIndicators : function(n){
+        if(n && n.ddel){
+            var el = n.ddel;
+            Ext.fly(el).removeClass([
+                    "x-tree-drag-insert-above",
+                    "x-tree-drag-insert-below",
+                    "x-tree-drag-append"]);
+            this.lastInsertClass = "_noclass";
+        }
+    },
+
+    // private
+    beforeDragDrop : function(target, e, id){
+        this.cancelExpand();
+        return true;
+    },
+
+    // private
+    afterRepair : function(data){
+        if(data && Ext.enableFx){
+            data.node.ui.highlight();
+        }
+        this.hideProxy();
+    }    
+});
+
+}/**
+ * @class Ext.tree.TreeDragZone
+ * @extends Ext.dd.DragZone
+ * @constructor
+ * @param {String/HTMLElement/Element} tree The {@link Ext.tree.TreePanel} for which to enable dragging
+ * @param {Object} config
+ */
+if(Ext.dd.DragZone){
+Ext.tree.TreeDragZone = function(tree, config){
+    Ext.tree.TreeDragZone.superclass.constructor.call(this, tree.innerCt, config);
+    /**
+    * The TreePanel for this drag zone
+    * @type Ext.tree.TreePanel
+    * @property
+    */
+    this.tree = tree;
+};
+
+Ext.extend(Ext.tree.TreeDragZone, Ext.dd.DragZone, {
+    /**
+     * @cfg {String} ddGroup
+     * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
+     * interact with other drag drop objects in the same group (defaults to 'TreeDD').
+     */
+    ddGroup : "TreeDD",
+
+    // private
+    onBeforeDrag : function(data, e){
+        var n = data.node;
+        return n && n.draggable && !n.disabled;
+    },
+
+    // private
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.tree.getSelectionModel().select(data.node);
+        this.tree.eventModel.disable();
+        this.proxy.update("");
+        data.node.ui.appendDDGhost(this.proxy.ghost.dom);
+        this.tree.fireEvent("startdrag", this.tree, data.node, e);
+    },
+
+    // private
+    getRepairXY : function(e, data){
+        return data.node.ui.getDDRepairXY();
+    },
+
+    // private
+    onEndDrag : function(data, e){
+        this.tree.eventModel.enable.defer(100, this.tree.eventModel);
+        this.tree.fireEvent("enddrag", this.tree, data.node, e);
+    },
+
+    // private
+    onValidDrop : function(dd, e, id){
+        this.tree.fireEvent("dragdrop", this.tree, this.dragData.node, dd, e);
+        this.hideProxy();
+    },
+
+    // private
+    beforeInvalidDrop : function(e, id){
+        // this scrolls the original position back into view
+        var sm = this.tree.getSelectionModel();
+        sm.clearSelections();
+        sm.select(this.dragData.node);
+    },
+    
+    // private
+    afterRepair : function(){
+        if (Ext.enableFx && this.tree.hlDrop) {
+            Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");
+        }
+        this.dragging = false;
+    }
+});
+}/**
+ * @class Ext.tree.TreeEditor
+ * @extends Ext.Editor
+ * Provides editor functionality for inline tree node editing.  Any valid {@link Ext.form.Field} subclass can be used
+ * as the editor field.
+ * @constructor
+ * @param {TreePanel} tree
+ * @param {Object} fieldConfig (optional) Either a prebuilt {@link Ext.form.Field} instance or a Field config object
+ * that will be applied to the default field instance (defaults to a {@link Ext.form.TextField}).
+ * @param {Object} config (optional) A TreeEditor config object
+ */
+Ext.tree.TreeEditor = function(tree, fc, config){
+    fc = fc || {};
+    var field = fc.events ? fc : new Ext.form.TextField(fc);
+    
+    Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);
+
+    this.tree = tree;
+
+    if(!tree.rendered){
+        tree.on('render', this.initEditor, this);
+    }else{
+        this.initEditor(tree);
+    }
+};
+
+Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {
+    /**
+     * @cfg {String} alignment
+     * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "l-l").
+     */
+    alignment: "l-l",
+    // inherit
+    autoSize: false,
+    /**
+     * @cfg {Boolean} hideEl
+     * True to hide the bound element while the editor is displayed (defaults to false)
+     */
+    hideEl : false,
+    /**
+     * @cfg {String} cls
+     * CSS class to apply to the editor (defaults to "x-small-editor x-tree-editor")
+     */
+    cls: "x-small-editor x-tree-editor",
+    /**
+     * @cfg {Boolean} shim
+     * True to shim the editor if selects/iframes could be displayed beneath it (defaults to false)
+     */
+    shim:false,
+    // inherit
+    shadow:"frame",
+    /**
+     * @cfg {Number} maxWidth
+     * The maximum width in pixels of the editor field (defaults to 250).  Note that if the maxWidth would exceed
+     * the containing tree element's size, it will be automatically limited for you to the container width, taking
+     * scroll and client offsets into account prior to each edit.
+     */
+    maxWidth: 250,
+    /**
+     * @cfg {Number} editDelay The number of milliseconds between clicks to register a double-click that will trigger
+     * editing on the current node (defaults to 350).  If two clicks occur on the same node within this time span,
+     * the editor for the node will display, otherwise it will be processed as a regular click.
+     */
+    editDelay : 350,
+
+    initEditor : function(tree){
+        tree.on({
+            scope      : this,
+            beforeclick: this.beforeNodeClick,
+            dblclick   : this.onNodeDblClick
+        });
+        
+        this.on({
+            scope          : this,
+            complete       : this.updateNode,
+            beforestartedit: this.fitToTree,
+            specialkey     : this.onSpecialKey
+        });
+        
+        this.on('startedit', this.bindScroll, this, {delay:10});
+    },
+
+    // private
+    fitToTree : function(ed, el){
+        var td = this.tree.getTreeEl().dom, nd = el.dom;
+        if(td.scrollLeft >  nd.offsetLeft){ // ensure the node left point is visible
+            td.scrollLeft = nd.offsetLeft;
+        }
+        var w = Math.min(
+                this.maxWidth,
+                (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - /*cushion*/5);
+        this.setSize(w, '');
+    },
+
+    /**
+     * Edit the text of the passed {@link Ext.tree.TreeNode TreeNode}.
+     * @param node {Ext.tree.TreeNode} The TreeNode to edit. The TreeNode must be {@link Ext.tree.TreeNode#editable editable}.
+     */
+    triggerEdit : function(node, defer){
+        this.completeEdit();
+		if(node.attributes.editable !== false){
+           /**
+            * The {@link Ext.tree.TreeNode TreeNode} this editor is bound to. Read-only.
+            * @type Ext.tree.TreeNode
+            * @property editNode
+            */
+			this.editNode = node;
+            if(this.tree.autoScroll){
+                Ext.fly(node.ui.getEl()).scrollIntoView(this.tree.body);
+            }
+            var value = node.text || '';
+            if (!Ext.isGecko && Ext.isEmpty(node.text)){
+                node.setText('&#160;');
+            }
+            this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, value]);
+            return false;
+        }
+    },
+
+    // private
+    bindScroll : function(){
+        this.tree.getTreeEl().on('scroll', this.cancelEdit, this);
+    },
+
+    // private
+    beforeNodeClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+        if(this.tree.getSelectionModel().isSelected(node)){
+            e.stopEvent();
+            return this.triggerEdit(node);
+        }
+    },
+
+    onNodeDblClick : function(node, e){
+        clearTimeout(this.autoEditTimer);
+    },
+
+    // private
+    updateNode : function(ed, value){
+        this.tree.getTreeEl().un('scroll', this.cancelEdit, this);
+        this.editNode.setText(value);
+    },
+
+    // private
+    onHide : function(){
+        Ext.tree.TreeEditor.superclass.onHide.call(this);
+        if(this.editNode){
+            this.editNode.ui.focus.defer(50, this.editNode.ui);
+        }
+    },
+
+    // private
+    onSpecialKey : function(field, e){
+        var k = e.getKey();
+        if(k == e.ESC){
+            e.stopEvent();
+            this.cancelEdit();
+        }else if(k == e.ENTER && !e.hasModifier()){
+            e.stopEvent();
+            this.completeEdit();
+        }
+    },
+    
+    onDestroy : function(){
+        clearTimeout(this.autoEditTimer);
+        Ext.tree.TreeEditor.superclass.onDestroy.call(this);
+        var tree = this.tree;
+        tree.un('beforeclick', this.beforeNodeClick, this);
+        tree.un('dblclick', this.onNodeDblClick, this);
+    }
+});/*! SWFObject v2.2 <http://code.google.com/p/swfobject/> 
+    is released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
+*/
+
+var swfobject = function() {
+    
+    var UNDEF = "undefined",
+        OBJECT = "object",
+        SHOCKWAVE_FLASH = "Shockwave Flash",
+        SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash",
+        FLASH_MIME_TYPE = "application/x-shockwave-flash",
+        EXPRESS_INSTALL_ID = "SWFObjectExprInst",
+        ON_READY_STATE_CHANGE = "onreadystatechange",
+        
+        win = window,
+        doc = document,
+        nav = navigator,
+        
+        plugin = false,
+        domLoadFnArr = [main],
+        regObjArr = [],
+        objIdArr = [],
+        listenersArr = [],
+        storedAltContent,
+        storedAltContentId,
+        storedCallbackFn,
+        storedCallbackObj,
+        isDomLoaded = false,
+        isExpressInstallActive = false,
+        dynamicStylesheet,
+        dynamicStylesheetMedia,
+        autoHideShow = true,
+    
+    /* Centralized function for browser feature detection
+        - User agent string detection is only used when no good alternative is possible
+        - Is executed directly for optimal performance
+    */  
+    ua = function() {
+        var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF,
+            u = nav.userAgent.toLowerCase(),
+            p = nav.platform.toLowerCase(),
+            windows = p ? (/win/).test(p) : /win/.test(u),
+            mac = p ? (/mac/).test(p) : /mac/.test(u),
+            webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, // returns either the webkit version or false if not webkit
+            ie = !+"\v1", // feature detection based on Andrea Giammarchi's solution: http://webreflection.blogspot.com/2009/01/32-bytes-to-know-if-your-browser-is-ie.html
+            playerVersion = [0,0,0],
+            d = null;
+        if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) {
+            d = nav.plugins[SHOCKWAVE_FLASH].description;
+            if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { // navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin indicates whether plug-ins are enabled or disabled in Safari 3+
+                plugin = true;
+                ie = false; // cascaded feature detection for Internet Explorer
+                d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
+                playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10);
+                playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10);
+                playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0;
+            }
+        }
+        else if (typeof win.ActiveXObject != UNDEF) {
+            try {
+                var a = new ActiveXObject(SHOCKWAVE_FLASH_AX);
+                if (a) { // a will return null when ActiveX is disabled
+                    d = a.GetVariable("$version");
+                    if (d) {
+                        ie = true; // cascaded feature detection for Internet Explorer
+                        d = d.split(" ")[1].split(",");
+                        playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+            }
+            catch(e) {}
+        }
+        return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac };
+    }(),
+    
+    /* Cross-browser onDomLoad
+        - Will fire an event as soon as the DOM of a web page is loaded
+        - Internet Explorer workaround based on Diego Perini's solution: http://javascript.nwbox.com/IEContentLoaded/
+        - Regular onload serves as fallback
+    */ 
+    onDomLoad = function() {
+        if (!ua.w3) { return; }
+        if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { // function is fired after onload, e.g. when script is inserted dynamically 
+            callDomLoadFunctions();
+        }
+        if (!isDomLoaded) {
+            if (typeof doc.addEventListener != UNDEF) {
+                doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false);
+            }       
+            if (ua.ie && ua.win) {
+                doc.attachEvent(ON_READY_STATE_CHANGE, function() {
+                    if (doc.readyState == "complete") {
+                        doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee);
+                        callDomLoadFunctions();
+                    }
+                });
+                if (win == top) { // if not inside an iframe
+                    (function(){
+                        if (isDomLoaded) { return; }
+                        try {
+                            doc.documentElement.doScroll("left");
+                        }
+                        catch(e) {
+                            setTimeout(arguments.callee, 0);
+                            return;
+                        }
+                        callDomLoadFunctions();
+                    })();
+                }
+            }
+            if (ua.wk) {
+                (function(){
+                    if (isDomLoaded) { return; }
+                    if (!(/loaded|complete/).test(doc.readyState)) {
+                        setTimeout(arguments.callee, 0);
+                        return;
+                    }
+                    callDomLoadFunctions();
+                })();
+            }
+            addLoadEvent(callDomLoadFunctions);
+        }
+    }();
+    
+    function callDomLoadFunctions() {
+        if (isDomLoaded) { return; }
+        try { // test if we can really add/remove elements to/from the DOM; we don't want to fire it too early
+            var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span"));
+            t.parentNode.removeChild(t);
+        }
+        catch (e) { return; }
+        isDomLoaded = true;
+        var dl = domLoadFnArr.length;
+        for (var i = 0; i < dl; i++) {
+            domLoadFnArr[i]();
+        }
+    }
+    
+    function addDomLoadEvent(fn) {
+        if (isDomLoaded) {
+            fn();
+        }
+        else { 
+            domLoadFnArr[domLoadFnArr.length] = fn; // Array.push() is only available in IE5.5+
+        }
+    }
+    
+    /* Cross-browser onload
+        - Based on James Edwards' solution: http://brothercake.com/site/resources/scripts/onload/
+        - Will fire an event as soon as a web page including all of its assets are loaded 
+     */
+    function addLoadEvent(fn) {
+        if (typeof win.addEventListener != UNDEF) {
+            win.addEventListener("load", fn, false);
+        }
+        else if (typeof doc.addEventListener != UNDEF) {
+            doc.addEventListener("load", fn, false);
+        }
+        else if (typeof win.attachEvent != UNDEF) {
+            addListener(win, "onload", fn);
+        }
+        else if (typeof win.onload == "function") {
+            var fnOld = win.onload;
+            win.onload = function() {
+                fnOld();
+                fn();
+            };
+        }
+        else {
+            win.onload = fn;
+        }
+    }
+    
+    /* Main function
+        - Will preferably execute onDomLoad, otherwise onload (as a fallback)
+    */
+    function main() { 
+        if (plugin) {
+            testPlayerVersion();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Detect the Flash Player version for non-Internet Explorer browsers
+        - Detecting the plug-in version via the object element is more precise than using the plugins collection item's description:
+          a. Both release and build numbers can be detected
+          b. Avoid wrong descriptions by corrupt installers provided by Adobe
+          c. Avoid wrong descriptions by multiple Flash Player entries in the plugin Array, caused by incorrect browser imports
+        - Disadvantage of this method is that it depends on the availability of the DOM, while the plugins collection is immediately available
+    */
+    function testPlayerVersion() {
+        var b = doc.getElementsByTagName("body")[0];
+        var o = createElement(OBJECT);
+        o.setAttribute("type", FLASH_MIME_TYPE);
+        var t = b.appendChild(o);
+        if (t) {
+            var counter = 0;
+            (function(){
+                if (typeof t.GetVariable != UNDEF) {
+                    var d = t.GetVariable("$version");
+                    if (d) {
+                        d = d.split(" ")[1].split(",");
+                        ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
+                    }
+                }
+                else if (counter < 10) {
+                    counter++;
+                    setTimeout(arguments.callee, 10);
+                    return;
+                }
+                b.removeChild(o);
+                t = null;
+                matchVersions();
+            })();
+        }
+        else {
+            matchVersions();
+        }
+    }
+    
+    /* Perform Flash Player and SWF version matching; static publishing only
+    */
+    function matchVersions() {
+        var rl = regObjArr.length;
+        if (rl > 0) {
+            for (var i = 0; i < rl; i++) { // for each registered object element
+                var id = regObjArr[i].id;
+                var cb = regObjArr[i].callbackFn;
+                var cbObj = {success:false, id:id};
+                if (ua.pv[0] > 0) {
+                    var obj = getElementById(id);
+                    if (obj) {
+                        if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { // Flash Player version >= published SWF version: Houston, we have a match!
+                            setVisibility(id, true);
+                            if (cb) {
+                                cbObj.success = true;
+                                cbObj.ref = getObjectById(id);
+                                cb(cbObj);
+                            }
+                        }
+                        else if (regObjArr[i].expressInstall && canExpressInstall()) { // show the Adobe Express Install dialog if set by the web page author and if supported
+                            var att = {};
+                            att.data = regObjArr[i].expressInstall;
+                            att.width = obj.getAttribute("width") || "0";
+                            att.height = obj.getAttribute("height") || "0";
+                            if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); }
+                            if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); }
+                            // parse HTML object param element's name-value pairs
+                            var par = {};
+                            var p = obj.getElementsByTagName("param");
+                            var pl = p.length;
+                            for (var j = 0; j < pl; j++) {
+                                if (p[j].getAttribute("name").toLowerCase() != "movie") {
+                                    par[p[j].getAttribute("name")] = p[j].getAttribute("value");
+                                }
+                            }
+                            showExpressInstall(att, par, id, cb);
+                        }
+                        else { // Flash Player and SWF version mismatch or an older Webkit engine that ignores the HTML object element's nested param elements: display alternative content instead of SWF
+                            displayAltContent(obj);
+                            if (cb) { cb(cbObj); }
+                        }
+                    }
+                }
+                else {  // if no Flash Player is installed or the fp version cannot be detected we let the HTML object element do its job (either show a SWF or alternative content)
+                    setVisibility(id, true);
+                    if (cb) {
+                        var o = getObjectById(id); // test whether there is an HTML object element or not
+                        if (o && typeof o.SetVariable != UNDEF) { 
+                            cbObj.success = true;
+                            cbObj.ref = o;
+                        }
+                        cb(cbObj);
+                    }
+                }
+            }
+        }
+    }
+    
+    function getObjectById(objectIdStr) {
+        var r = null;
+        var o = getElementById(objectIdStr);
+        if (o && o.nodeName == "OBJECT") {
+            if (typeof o.SetVariable != UNDEF) {
+                r = o;
+            }
+            else {
+                var n = o.getElementsByTagName(OBJECT)[0];
+                if (n) {
+                    r = n;
+                }
+            }
+        }
+        return r;
+    }
+    
+    /* Requirements for Adobe Express Install
+        - only one instance can be active at a time
+        - fp 6.0.65 or higher
+        - Win/Mac OS only
+        - no Webkit engines older than version 312
+    */
+    function canExpressInstall() {
+        return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312);
+    }
+    
+    /* Show the Adobe Express Install dialog
+        - Reference: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75
+    */
+    function showExpressInstall(att, par, replaceElemIdStr, callbackFn) {
+        isExpressInstallActive = true;
+        storedCallbackFn = callbackFn || null;
+        storedCallbackObj = {success:false, id:replaceElemIdStr};
+        var obj = getElementById(replaceElemIdStr);
+        if (obj) {
+            if (obj.nodeName == "OBJECT") { // static publishing
+                storedAltContent = abstractAltContent(obj);
+                storedAltContentId = null;
+            }
+            else { // dynamic publishing
+                storedAltContent = obj;
+                storedAltContentId = replaceElemIdStr;
+            }
+            att.id = EXPRESS_INSTALL_ID;
+            if (typeof att.width == UNDEF || (!(/%$/).test(att.width) && parseInt(att.width, 10) < 310)) {
+                att.width = "310";
+            }
+            
+            if (typeof att.height == UNDEF || (!(/%$/).test(att.height) && parseInt(att.height, 10) < 137)) {
+                att.height = "137";
+            }
+            doc.title = doc.title.slice(0, 47) + " - Flash Player Installation";
+            var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn",
+                fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title;
+            if (typeof par.flashvars != UNDEF) {
+                par.flashvars += "&" + fv;
+            }
+            else {
+                par.flashvars = fv;
+            }
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            if (ua.ie && ua.win && obj.readyState != 4) {
+                var newObj = createElement("div");
+                replaceElemIdStr += "SWFObjectNew";
+                newObj.setAttribute("id", replaceElemIdStr);
+                obj.parentNode.insertBefore(newObj, obj); // insert placeholder div that will be replaced by the object element that loads expressinstall.swf
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        obj.parentNode.removeChild(obj);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            createSWF(att, par, replaceElemIdStr);
+        }
+    }
+    
+    /* Functions to abstract and display alternative content
+    */
+    function displayAltContent(obj) {
+        if (ua.ie && ua.win && obj.readyState != 4) {
+            // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
+            // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
+            var el = createElement("div");
+            obj.parentNode.insertBefore(el, obj); // insert placeholder div that will be replaced by the alternative content
+            el.parentNode.replaceChild(abstractAltContent(obj), el);
+            obj.style.display = "none";
+            (function(){
+                if (obj.readyState == 4) {
+                    obj.parentNode.removeChild(obj);
+                }
+                else {
+                    setTimeout(arguments.callee, 10);
+                }
+            })();
+        }
+        else {
+            obj.parentNode.replaceChild(abstractAltContent(obj), obj);
+        }
+    } 
+
+    function abstractAltContent(obj) {
+        var ac = createElement("div");
+        if (ua.win && ua.ie) {
+            ac.innerHTML = obj.innerHTML;
+        }
+        else {
+            var nestedObj = obj.getElementsByTagName(OBJECT)[0];
+            if (nestedObj) {
+                var c = nestedObj.childNodes;
+                if (c) {
+                    var cl = c.length;
+                    for (var i = 0; i < cl; i++) {
+                        if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) {
+                            ac.appendChild(c[i].cloneNode(true));
+                        }
+                    }
+                }
+            }
+        }
+        return ac;
+    }
+    
+    /* Cross-browser dynamic SWF creation
+    */
+    function createSWF(attObj, parObj, id) {
+        var r, el = getElementById(id);
+        if (ua.wk && ua.wk < 312) { return r; }
+        if (el) {
+            if (typeof attObj.id == UNDEF) { // if no 'id' is defined for the object element, it will inherit the 'id' from the alternative content
+                attObj.id = id;
+            }
+            if (ua.ie && ua.win) { // Internet Explorer + the HTML object element + W3C DOM methods do not combine: fall back to outerHTML
+                var att = "";
+                for (var i in attObj) {
+                    if (attObj[i] != Object.prototype[i]) { // filter out prototype additions from other potential libraries
+                        if (i.toLowerCase() == "data") {
+                            parObj.movie = attObj[i];
+                        }
+                        else if (i.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            att += ' class="' + attObj[i] + '"';
+                        }
+                        else if (i.toLowerCase() != "classid") {
+                            att += ' ' + i + '="' + attObj[i] + '"';
+                        }
+                    }
+                }
+                var par = "";
+                for (var j in parObj) {
+                    if (parObj[j] != Object.prototype[j]) { // filter out prototype additions from other potential libraries
+                        par += '<param name="' + j + '" value="' + parObj[j] + '" />';
+                    }
+                }
+                el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';
+                objIdArr[objIdArr.length] = attObj.id; // stored to fix object 'leaks' on unload (dynamic publishing only)
+                r = getElementById(attObj.id);  
+            }
+            else { // well-behaving browsers
+                var o = createElement(OBJECT);
+                o.setAttribute("type", FLASH_MIME_TYPE);
+                for (var m in attObj) {
+                    if (attObj[m] != Object.prototype[m]) { // filter out prototype additions from other potential libraries
+                        if (m.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
+                            o.setAttribute("class", attObj[m]);
+                        }
+                        else if (m.toLowerCase() != "classid") { // filter out IE specific attribute
+                            o.setAttribute(m, attObj[m]);
+                        }
+                    }
+                }
+                for (var n in parObj) {
+                    if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { // filter out prototype additions from other potential libraries and IE specific param element
+                        createObjParam(o, n, parObj[n]);
+                    }
+                }
+                el.parentNode.replaceChild(o, el);
+                r = o;
+            }
+        }
+        return r;
+    }
+    
+    function createObjParam(el, pName, pValue) {
+        var p = createElement("param");
+        p.setAttribute("name", pName);  
+        p.setAttribute("value", pValue);
+        el.appendChild(p);
+    }
+    
+    /* Cross-browser SWF removal
+        - Especially needed to safely and completely remove a SWF in Internet Explorer
+    */
+    function removeSWF(id) {
+        var obj = getElementById(id);
+        if (obj && obj.nodeName == "OBJECT") {
+            if (ua.ie && ua.win) {
+                obj.style.display = "none";
+                (function(){
+                    if (obj.readyState == 4) {
+                        removeObjectInIE(id);
+                    }
+                    else {
+                        setTimeout(arguments.callee, 10);
+                    }
+                })();
+            }
+            else {
+                obj.parentNode.removeChild(obj);
+            }
+        }
+    }
+    
+    function removeObjectInIE(id) {
+        var obj = getElementById(id);
+        if (obj) {
+            for (var i in obj) {
+                if (typeof obj[i] == "function") {
+                    obj[i] = null;
+                }
+            }
+            obj.parentNode.removeChild(obj);
+        }
+    }
+    
+    /* Functions to optimize JavaScript compression
+    */
+    function getElementById(id) {
+        var el = null;
+        try {
+            el = doc.getElementById(id);
+        }
+        catch (e) {}
+        return el;
+    }
+    
+    function createElement(el) {
+        return doc.createElement(el);
+    }
+    
+    /* Updated attachEvent function for Internet Explorer
+        - Stores attachEvent information in an Array, so on unload the detachEvent functions can be called to avoid memory leaks
+    */  
+    function addListener(target, eventType, fn) {
+        target.attachEvent(eventType, fn);
+        listenersArr[listenersArr.length] = [target, eventType, fn];
+    }
+    
+    /* Flash Player and SWF content version matching
+    */
+    function hasPlayerVersion(rv) {
+        var pv = ua.pv, v = rv.split(".");
+        v[0] = parseInt(v[0], 10);
+        v[1] = parseInt(v[1], 10) || 0; // supports short notation, e.g. "9" instead of "9.0.0"
+        v[2] = parseInt(v[2], 10) || 0;
+        return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false;
+    }
+    
+    /* Cross-browser dynamic CSS creation
+        - Based on Bobby van der Sluis' solution: http://www.bobbyvandersluis.com/articles/dynamicCSS.php
+    */  
+    function createCSS(sel, decl, media, newStyle) {
+        if (ua.ie && ua.mac) { return; }
+        var h = doc.getElementsByTagName("head")[0];
+        if (!h) { return; } // to also support badly authored HTML pages that lack a head element
+        var m = (media && typeof media == "string") ? media : "screen";
+        if (newStyle) {
+            dynamicStylesheet = null;
+            dynamicStylesheetMedia = null;
+        }
+        if (!dynamicStylesheet || dynamicStylesheetMedia != m) { 
+            // create dynamic stylesheet + get a global reference to it
+            var s = createElement("style");
+            s.setAttribute("type", "text/css");
+            s.setAttribute("media", m);
+            dynamicStylesheet = h.appendChild(s);
+            if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) {
+                dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1];
+            }
+            dynamicStylesheetMedia = m;
+        }
+        // add style rule
+        if (ua.ie && ua.win) {
+            if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) {
+                dynamicStylesheet.addRule(sel, decl);
+            }
+        }
+        else {
+            if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) {
+                dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}"));
+            }
+        }
+    }
+    
+    function setVisibility(id, isVisible) {
+        if (!autoHideShow) { return; }
+        var v = isVisible ? "visible" : "hidden";
+        if (isDomLoaded && getElementById(id)) {
+            getElementById(id).style.visibility = v;
+        }
+        else {
+            createCSS("#" + id, "visibility:" + v);
+        }
+    }
+
+    /* Filter to avoid XSS attacks
+    */
+    function urlEncodeIfNecessary(s) {
+        var regex = /[\\\"<>\.;]/;
+        var hasBadChars = regex.exec(s) != null;
+        return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s;
+    }
+    
+    /* Release memory to avoid memory leaks caused by closures, fix hanging audio/video threads and force open sockets/NetConnections to disconnect (Internet Explorer only)
+    */
+    var cleanup = function() {
+        if (ua.ie && ua.win) {
+            window.attachEvent("onunload", function() {
+                // remove listeners to avoid memory leaks
+                var ll = listenersArr.length;
+                for (var i = 0; i < ll; i++) {
+                    listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]);
+                }
+                // cleanup dynamically embedded objects to fix audio/video threads and force open sockets and NetConnections to disconnect
+                var il = objIdArr.length;
+                for (var j = 0; j < il; j++) {
+                    removeSWF(objIdArr[j]);
+                }
+                // cleanup library's main closures to avoid memory leaks
+                for (var k in ua) {
+                    ua[k] = null;
+                }
+                ua = null;
+                for (var l in swfobject) {
+                    swfobject[l] = null;
+                }
+                swfobject = null;
+                window.detachEvent('onunload', arguments.callee);
+            });
+        }
+    }();
+    
+    return {
+        /* Public API
+            - Reference: http://code.google.com/p/swfobject/wiki/documentation
+        */ 
+        registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) {
+            if (ua.w3 && objectIdStr && swfVersionStr) {
+                var regObj = {};
+                regObj.id = objectIdStr;
+                regObj.swfVersion = swfVersionStr;
+                regObj.expressInstall = xiSwfUrlStr;
+                regObj.callbackFn = callbackFn;
+                regObjArr[regObjArr.length] = regObj;
+                setVisibility(objectIdStr, false);
+            }
+            else if (callbackFn) {
+                callbackFn({success:false, id:objectIdStr});
+            }
+        },
+        
+        getObjectById: function(objectIdStr) {
+            if (ua.w3) {
+                return getObjectById(objectIdStr);
+            }
+        },
+        
+        embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) {
+            var callbackObj = {success:false, id:replaceElemIdStr};
+            if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) {
+                setVisibility(replaceElemIdStr, false);
+                addDomLoadEvent(function() {
+                    widthStr += ""; // auto-convert to string
+                    heightStr += "";
+                    var att = {};
+                    if (attObj && typeof attObj === OBJECT) {
+                        for (var i in attObj) { // copy object to avoid the use of references, because web authors often reuse attObj for multiple SWFs
+                            att[i] = attObj[i];
+                        }
+                    }
+                    att.data = swfUrlStr;
+                    att.width = widthStr;
+                    att.height = heightStr;
+                    var par = {}; 
+                    if (parObj && typeof parObj === OBJECT) {
+                        for (var j in parObj) { // copy object to avoid the use of references, because web authors often reuse parObj for multiple SWFs
+                            par[j] = parObj[j];
+                        }
+                    }
+                    if (flashvarsObj && typeof flashvarsObj === OBJECT) {
+                        for (var k in flashvarsObj) { // copy object to avoid the use of references, because web authors often reuse flashvarsObj for multiple SWFs
+                            if (typeof par.flashvars != UNDEF) {
+                                par.flashvars += "&" + k + "=" + flashvarsObj[k];
+                            }
+                            else {
+                                par.flashvars = k + "=" + flashvarsObj[k];
+                            }
+                        }
+                    }
+                    if (hasPlayerVersion(swfVersionStr)) { // create SWF
+                        var obj = createSWF(att, par, replaceElemIdStr);
+                        if (att.id == replaceElemIdStr) {
+                            setVisibility(replaceElemIdStr, true);
+                        }
+                        callbackObj.success = true;
+                        callbackObj.ref = obj;
+                    }
+                    else if (xiSwfUrlStr && canExpressInstall()) { // show Adobe Express Install
+                        att.data = xiSwfUrlStr;
+                        showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+                        return;
+                    }
+                    else { // show alternative content
+                        setVisibility(replaceElemIdStr, true);
+                    }
+                    if (callbackFn) { callbackFn(callbackObj); }
+                });
+            }
+            else if (callbackFn) { callbackFn(callbackObj); }
+        },
+        
+        switchOffAutoHideShow: function() {
+            autoHideShow = false;
+        },
+        
+        ua: ua,
+        
+        getFlashPlayerVersion: function() {
+            return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] };
+        },
+        
+        hasFlashPlayerVersion: hasPlayerVersion,
+        
+        createSWF: function(attObj, parObj, replaceElemIdStr) {
+            if (ua.w3) {
+                return createSWF(attObj, parObj, replaceElemIdStr);
+            }
+            else {
+                return undefined;
+            }
+        },
+        
+        showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) {
+            if (ua.w3 && canExpressInstall()) {
+                showExpressInstall(att, par, replaceElemIdStr, callbackFn);
+            }
+        },
+        
+        removeSWF: function(objElemIdStr) {
+            if (ua.w3) {
+                removeSWF(objElemIdStr);
+            }
+        },
+        
+        createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) {
+            if (ua.w3) {
+                createCSS(selStr, declStr, mediaStr, newStyleBoolean);
+            }
+        },
+        
+        addDomLoadEvent: addDomLoadEvent,
+        
+        addLoadEvent: addLoadEvent,
+        
+        getQueryParamValue: function(param) {
+            var q = doc.location.search || doc.location.hash;
+            if (q) {
+                if (/\?/.test(q)) { q = q.split("?")[1]; } // strip question mark
+                if (param == null) {
+                    return urlEncodeIfNecessary(q);
+                }
+                var pairs = q.split("&");
+                for (var i = 0; i < pairs.length; i++) {
+                    if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) {
+                        return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1)));
+                    }
+                }
+            }
+            return "";
+        },
+        
+        // For internal usage only
+        expressInstallCallback: function() {
+            if (isExpressInstallActive) {
+                var obj = getElementById(EXPRESS_INSTALL_ID);
+                if (obj && storedAltContent) {
+                    obj.parentNode.replaceChild(storedAltContent, obj);
+                    if (storedAltContentId) {
+                        setVisibility(storedAltContentId, true);
+                        if (ua.ie && ua.win) { storedAltContent.style.display = "block"; }
+                    }
+                    if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); }
+                }
+                isExpressInstallActive = false;
+            } 
+        }
+    };
+}();
+/**
+ * @class Ext.FlashComponent
+ * @extends Ext.BoxComponent
+ * @constructor
+ * @xtype flash
+ */
+Ext.FlashComponent = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} flashVersion
+     * Indicates the version the flash content was published for. Defaults to <tt>'9.0.115'</tt>.
+     */
+    flashVersion : '9.0.115',
+
+    /**
+     * @cfg {String} backgroundColor
+     * The background color of the chart. Defaults to <tt>'#ffffff'</tt>.
+     */
+    backgroundColor: '#ffffff',
+
+    /**
+     * @cfg {String} wmode
+     * The wmode of the flash object. This can be used to control layering. Defaults to <tt>'opaque'</tt>.
+     */
+    wmode: 'opaque',
+
+    /**
+     * @cfg {Object} flashVars
+     * A set of key value pairs to be passed to the flash object as flash variables. Defaults to <tt>undefined</tt>.
+     */
+    flashVars: undefined,
+
+    /**
+     * @cfg {Object} flashParams
+     * A set of key value pairs to be passed to the flash object as parameters. Possible parameters can be found here:
+     * http://kb2.adobe.com/cps/127/tn_12701.html Defaults to <tt>undefined</tt>.
+     */
+    flashParams: undefined,
+
+    /**
+     * @cfg {String} url
+     * The URL of the chart to include. Defaults to <tt>undefined</tt>.
+     */
+    url: undefined,
+    swfId : undefined,
+    swfWidth: '100%',
+    swfHeight: '100%',
+
+    /**
+     * @cfg {Boolean} expressInstall
+     * True to prompt the user to install flash if not installed. Note that this uses
+     * Ext.FlashComponent.EXPRESS_INSTALL_URL, which should be set to the local resource. Defaults to <tt>false</tt>.
+     */
+    expressInstall: false,
+
+    initComponent : function(){
+        Ext.FlashComponent.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event initialize
+             *
+             * @param {Chart} this
+             */
+            'initialize'
+        );
+    },
+
+    onRender : function(){
+        Ext.FlashComponent.superclass.onRender.apply(this, arguments);
+
+        var params = Ext.apply({
+            allowScriptAccess: 'always',
+            bgcolor: this.backgroundColor,
+            wmode: this.wmode
+        }, this.flashParams), vars = Ext.apply({
+            allowedDomain: document.location.hostname,
+            YUISwfId: this.getId(),
+            YUIBridgeCallback: 'Ext.FlashEventProxy.onEvent'
+        }, this.flashVars);
+
+        new swfobject.embedSWF(this.url, this.id, this.swfWidth, this.swfHeight, this.flashVersion,
+            this.expressInstall ? Ext.FlashComponent.EXPRESS_INSTALL_URL : undefined, vars, params);
+
+        this.swf = Ext.getDom(this.id);
+        this.el = Ext.get(this.swf);
+    },
+
+    getSwfId : function(){
+        return this.swfId || (this.swfId = "extswf" + (++Ext.Component.AUTO_ID));
+    },
+
+    getId : function(){
+        return this.id || (this.id = "extflashcmp" + (++Ext.Component.AUTO_ID));
+    },
+
+    onFlashEvent : function(e){
+        switch(e.type){
+            case "swfReady":
+                this.initSwf();
+                return;
+            case "log":
+                return;
+        }
+        e.component = this;
+        this.fireEvent(e.type.toLowerCase().replace(/event$/, ''), e);
+    },
+
+    initSwf : function(){
+        this.onSwfReady(!!this.isInitialized);
+        this.isInitialized = true;
+        this.fireEvent('initialize', this);
+    },
+
+    beforeDestroy: function(){
+        if(this.rendered){
+            swfobject.removeSWF(this.swf.id);
+        }
+        Ext.FlashComponent.superclass.beforeDestroy.call(this);
+    },
+
+    onSwfReady : Ext.emptyFn
+});
+
+/**
+ * Sets the url for installing flash if it doesn't exist. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.FlashComponent.EXPRESS_INSTALL_URL = 'http:/' + '/swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf';
+
+Ext.reg('flash', Ext.FlashComponent);/**
+ * @class Ext.FlashProxy
+ * @singleton
+ */
+Ext.FlashEventProxy = {
+    onEvent : function(id, e){
+        var fp = Ext.getCmp(id);
+        if(fp){
+            fp.onFlashEvent(e);
+        }else{
+            arguments.callee.defer(10, this, [id, e]);
+        }
+    }
+};/**
+ * @class Ext.chart.Chart
+ * @extends Ext.FlashComponent
+ * The Ext.chart package provides the capability to visualize data with flash based charting.
+ * Each chart binds directly to an Ext.data.Store enabling automatic updates of the chart.
+ * To change the look and feel of a chart, see the {@link #chartStyle} and {@link #extraStyle} config options.
+ * @constructor
+ * @xtype chart
+ */
+
+ Ext.chart.Chart = Ext.extend(Ext.FlashComponent, {
+    refreshBuffer: 100,
+
+    /**
+     * @cfg {String} backgroundColor
+     * @hide
+     */
+
+    /**
+     * @cfg {Object} chartStyle
+     * Sets styles for this chart. This contains default styling, so modifying this property will <b>override</b>
+     * the built in styles of the chart. Use {@link #extraStyle} to add customizations to the default styling.
+     */
+    chartStyle: {
+        padding: 10,
+        animationEnabled: true,
+        font: {
+            name: 'Tahoma',
+            color: 0x444444,
+            size: 11
+        },
+        dataTip: {
+            padding: 5,
+            border: {
+                color: 0x99bbe8,
+                size:1
+            },
+            background: {
+                color: 0xDAE7F6,
+                alpha: .9
+            },
+            font: {
+                name: 'Tahoma',
+                color: 0x15428B,
+                size: 10,
+                bold: true
+            }
+        }
+    },
+
+    /**
+     * @cfg {String} url
+     * The url to load the chart from. This defaults to Ext.chart.Chart.CHART_URL, which should
+     * be modified to point to the local charts resource.
+     */
+
+    /**
+     * @cfg {Object} extraStyle
+     * Contains extra styles that will be added or overwritten to the default chartStyle. Defaults to <tt>null</tt>.
+     * For a detailed list of the options available, visit the YUI Charts site
+     * at <a href="http://developer.yahoo.com/yui/charts/#basicstyles">http://developer.yahoo.com/yui/charts/#basicstyles</a><br/>
+     * Some of the options availabe:<br />
+     * <ul style="padding:5px;padding-left:16px;list-style-type:inherit;">
+     * <li><b>padding</b> - The space around the edge of the chart's contents. Padding does not increase the size of the chart.</li>
+     * <li><b>animationEnabled</b> - A Boolean value that specifies whether marker animations are enabled or not. Enabled by default.</li>
+     * <li><b>font</b> - An Object defining the font style to be used in the chart. Defaults to <tt>{ name: 'Tahoma', color: 0x444444, size: 11 }</tt><br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>name</b> - font name</li>
+     *      <li><b>color</b> - font color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - font size in points (numeric portion only, ie: 11)</li>
+     *      <li><b>bold</b> - boolean</li>
+     *      <li><b>italic</b> - boolean</li>
+     *      <li><b>underline</b> - boolean</li>
+     *  </ul>
+     * </li>
+     * <li><b>border</b> - An object defining the border style around the chart. The chart itself will decrease in dimensions to accomodate the border.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>size</b> - border size in pixels (numeric portion only, ie: 1)</li>
+     *  </ul>
+     * </li>
+     * <li><b>background</b> - An object defining the background style of the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - border color (hex code, ie: "#ff0000", "ff0000" or 0xff0000)</li>
+     *      <li><b>image</b> - an image URL. May be relative to the current document or absolute.</li>
+     *  </ul>
+     * </li>
+     * <li><b>legend</b> - An object defining the legend style<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>display</b> - location of the legend. Possible values are "none", "left", "right", "top", and "bottom".</li>
+     *      <li><b>spacing</b> - an image URL. May be relative to the current document or absolute.</li>
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>dataTip</b> - An object defining the style of the data tip (tooltip).<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>padding, border, background, font</b> - same options as described above.</li>
+     *  </ul></li>
+     * <li><b>xAxis and yAxis</b> - An object defining the style of the style of either axis.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color</b> - same option as described above.</li>
+     *      <li><b>size</b> - same option as described above.</li>
+     *      <li><b>showLabels</b> - boolean</li>
+     *      <li><b>labelRotation</b> - a value in degrees from -90 through 90. Default is zero.</li>
+     *  </ul></li>
+     * <li><b>majorGridLines and minorGridLines</b> - An object defining the style of the style of the grid lines.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>zeroGridLine</b> - An object defining the style of the style of the zero grid line.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *  </ul></li></li>
+     * <li><b>majorTicks and minorTicks</b> - An object defining the style of the style of ticks in the chart.<br/>
+     *  <ul style="padding:5px;padding-left:26px;list-style-type:circle;">
+     *      <li><b>color, size</b> - same options as described above.</li>
+     *      <li><b>length</b> - the length of each tick in pixels extending from the axis.</li>
+     *      <li><b>display</b> - how the ticks are drawn. Possible values are "none", "inside", "outside", and "cross".</li>
+     *  </ul></li></li>
+     * </ul>
+     */
+    extraStyle: null,
+
+    /**
+     * @cfg {Object} seriesStyles
+     * Contains styles to apply to the series after a refresh. Defaults to <tt>null</tt>.
+     */
+    seriesStyles: null,
+
+    /**
+     * @cfg {Boolean} disableCaching
+     * True to add a "cache buster" to the end of the chart url. Defaults to true for Opera and IE.
+     */
+    disableCaching: Ext.isIE || Ext.isOpera,
+    disableCacheParam: '_dc',
+
+    initComponent : function(){
+        Ext.chart.Chart.superclass.initComponent.call(this);
+        if(!this.url){
+            this.url = Ext.chart.Chart.CHART_URL;
+        }
+        if(this.disableCaching){
+            this.url = Ext.urlAppend(this.url, String.format('{0}={1}', this.disableCacheParam, new Date().getTime()));
+        }
+        this.addEvents(
+            'itemmouseover',
+            'itemmouseout',
+            'itemclick',
+            'itemdoubleclick',
+            'itemdragstart',
+            'itemdrag',
+            'itemdragend',
+            /**
+             * @event beforerefresh
+             * Fires before a refresh to the chart data is called.  If the beforerefresh handler returns
+             * <tt>false</tt> the {@link #refresh} action will be cancelled.
+             * @param {Chart} this
+             */
+            'beforerefresh',
+            /**
+             * @event refresh
+             * Fires after the chart data has been refreshed.
+             * @param {Chart} this
+             */
+            'refresh'
+        );
+        this.store = Ext.StoreMgr.lookup(this.store);
+    },
+
+    /**
+     * Sets a single style value on the Chart instance.
+     *
+     * @param name {String} Name of the Chart style value to change.
+     * @param value {Object} New value to pass to the Chart style.
+     */
+     setStyle: function(name, value){
+         this.swf.setStyle(name, Ext.encode(value));
+     },
+
+    /**
+     * Resets all styles on the Chart instance.
+     *
+     * @param styles {Object} Initializer for all Chart styles.
+     */
+    setStyles: function(styles){
+        this.swf.setStyles(Ext.encode(styles));
+    },
+
+    /**
+     * Sets the styles on all series in the Chart.
+     *
+     * @param styles {Array} Initializer for all Chart series styles.
+     */
+    setSeriesStyles: function(styles){
+        this.seriesStyles = styles;
+        var s = [];
+        Ext.each(styles, function(style){
+            s.push(Ext.encode(style));
+        });
+        this.swf.setSeriesStyles(s);
+    },
+
+    setCategoryNames : function(names){
+        this.swf.setCategoryNames(names);
+    },
+
+    setLegendRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.legendFnName);
+        chart.legendFnName = chart.createFnProxy(function(name){
+            return fn.call(scope, name);
+        });
+        chart.swf.setLegendLabelFunction(chart.legendFnName);
+    },
+
+    setTipRenderer : function(fn, scope){
+        var chart = this;
+        scope = scope || chart;
+        chart.removeFnProxy(chart.tipFnName);
+        chart.tipFnName = chart.createFnProxy(function(item, index, series){
+            var record = chart.store.getAt(index);
+            return fn.call(scope, chart, record, index, series);
+        });
+        chart.swf.setDataTipFunction(chart.tipFnName);
+    },
+
+    setSeries : function(series){
+        this.series = series;
+        this.refresh();
+    },
+
+    /**
+     * Changes the data store bound to this chart and refreshes it.
+     * @param {Store} store The store to bind to this chart
+     */
+    bindStore : function(store, initial){
+        if(!initial && this.store){
+            if(store !== this.store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un("datachanged", this.refresh, this);
+                this.store.un("add", this.delayRefresh, this);
+                this.store.un("remove", this.delayRefresh, this);
+                this.store.un("update", this.delayRefresh, this);
+                this.store.un("clear", this.refresh, this);
+            }
+        }
+        if(store){
+            store = Ext.StoreMgr.lookup(store);
+            store.on({
+                scope: this,
+                datachanged: this.refresh,
+                add: this.delayRefresh,
+                remove: this.delayRefresh,
+                update: this.delayRefresh,
+                clear: this.refresh
+            });
+        }
+        this.store = store;
+        if(store && !initial){
+            this.refresh();
+        }
+    },
+
+    onSwfReady : function(isReset){
+        Ext.chart.Chart.superclass.onSwfReady.call(this, isReset);
+        var ref;
+        this.swf.setType(this.type);
+
+        if(this.chartStyle){
+            this.setStyles(Ext.apply({}, this.extraStyle, this.chartStyle));
+        }
+
+        if(this.categoryNames){
+            this.setCategoryNames(this.categoryNames);
+        }
+
+        if(this.tipRenderer){
+            ref = this.getFunctionRef(this.tipRenderer);
+            this.setTipRenderer(ref.fn, ref.scope);
+        }
+        if(this.legendRenderer){
+            ref = this.getFunctionRef(this.legendRenderer);
+            this.setLegendRenderer(ref.fn, ref.scope);
+        }
+        if(!isReset){
+            this.bindStore(this.store, true);
+        }
+        this.refresh.defer(10, this);
+    },
+
+    delayRefresh : function(){
+        if(!this.refreshTask){
+            this.refreshTask = new Ext.util.DelayedTask(this.refresh, this);
+        }
+        this.refreshTask.delay(this.refreshBuffer);
+    },
+
+    refresh : function(){
+        if(this.fireEvent('beforerefresh', this) !== false){
+            var styleChanged = false;
+            // convert the store data into something YUI charts can understand
+            var data = [], rs = this.store.data.items;
+            for(var j = 0, len = rs.length; j < len; j++){
+                data[j] = rs[j].data;
+            }
+            //make a copy of the series definitions so that we aren't
+            //editing them directly.
+            var dataProvider = [];
+            var seriesCount = 0;
+            var currentSeries = null;
+            var i = 0;
+            if(this.series){
+                seriesCount = this.series.length;
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = this.series[i];
+                    var clonedSeries = {};
+                    for(var prop in currentSeries){
+                        if(prop == "style" && currentSeries.style !== null){
+                            clonedSeries.style = Ext.encode(currentSeries.style);
+                            styleChanged = true;
+                            //we don't want to modify the styles again next time
+                            //so null out the style property.
+                            // this causes issues
+                            // currentSeries.style = null;
+                        } else{
+                            clonedSeries[prop] = currentSeries[prop];
+                        }
+                    }
+                    dataProvider.push(clonedSeries);
+                }
+            }
+
+            if(seriesCount > 0){
+                for(i = 0; i < seriesCount; i++){
+                    currentSeries = dataProvider[i];
+                    if(!currentSeries.type){
+                        currentSeries.type = this.type;
+                    }
+                    currentSeries.dataProvider = data;
+                }
+            } else{
+                dataProvider.push({type: this.type, dataProvider: data});
+            }
+            this.swf.setDataProvider(dataProvider);
+            if(this.seriesStyles){
+                this.setSeriesStyles(this.seriesStyles);
+            }
+            this.fireEvent('refresh', this);
+        }
+    },
+
+    // private
+    createFnProxy : function(fn){
+        var fnName = 'extFnProxy' + (++Ext.chart.Chart.PROXY_FN_ID);
+        Ext.chart.Chart.proxyFunction[fnName] = fn;
+        return 'Ext.chart.Chart.proxyFunction.' + fnName;
+    },
+
+    // private
+    removeFnProxy : function(fn){
+        if(!Ext.isEmpty(fn)){
+            fn = fn.replace('Ext.chart.Chart.proxyFunction.', '');
+            delete Ext.chart.Chart.proxyFunction[fn];
+        }
+    },
+
+    // private
+    getFunctionRef : function(val){
+        if(Ext.isFunction(val)){
+            return {
+                fn: val,
+                scope: this
+            };
+        }else{
+            return {
+                fn: val.fn,
+                scope: val.scope || this
+            };
+        }
+    },
+
+    // private
+    onDestroy: function(){
+        if (this.refreshTask && this.refreshTask.cancel){
+            this.refreshTask.cancel();
+        }
+        Ext.chart.Chart.superclass.onDestroy.call(this);
+        this.bindStore(null);
+        this.removeFnProxy(this.tipFnName);
+        this.removeFnProxy(this.legendFnName);
+    }
+});
+Ext.reg('chart', Ext.chart.Chart);
+Ext.chart.Chart.PROXY_FN_ID = 0;
+Ext.chart.Chart.proxyFunction = {};
+
+/**
+ * Sets the url to load the chart from. This should be set to a local resource.
+ * @static
+ * @type String
+ */
+Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.2/build/charts/assets/charts.swf';
+
+/**
+ * @class Ext.chart.PieChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype piechart
+ */
+Ext.chart.PieChart = Ext.extend(Ext.chart.Chart, {
+    type: 'pie',
+
+    onSwfReady : function(isReset){
+        Ext.chart.PieChart.superclass.onSwfReady.call(this, isReset);
+
+        this.setDataField(this.dataField);
+        this.setCategoryField(this.categoryField);
+    },
+
+    setDataField : function(field){
+        this.dataField = field;
+        this.swf.setDataField(field);
+    },
+
+    setCategoryField : function(field){
+        this.categoryField = field;
+        this.swf.setCategoryField(field);
+    }
+});
+Ext.reg('piechart', Ext.chart.PieChart);
+
+/**
+ * @class Ext.chart.CartesianChart
+ * @extends Ext.chart.Chart
+ * @constructor
+ * @xtype cartesianchart
+ */
+Ext.chart.CartesianChart = Ext.extend(Ext.chart.Chart, {
+    onSwfReady : function(isReset){
+        Ext.chart.CartesianChart.superclass.onSwfReady.call(this, isReset);
+        this.labelFn = [];
+        if(this.xField){
+            this.setXField(this.xField);
+        }
+        if(this.yField){
+            this.setYField(this.yField);
+        }
+        if(this.xAxis){
+            this.setXAxis(this.xAxis);
+        }
+        if(this.xAxes){
+            this.setXAxes(this.xAxes);
+        }
+        if(this.yAxis){
+            this.setYAxis(this.yAxis);
+        }
+        if(this.yAxes){
+            this.setYAxes(this.yAxes);
+        }
+        if(Ext.isDefined(this.constrainViewport)){
+            this.swf.setConstrainViewport(this.constrainViewport);
+        }
+    },
+
+    setXField : function(value){
+        this.xField = value;
+        this.swf.setHorizontalField(value);
+    },
+
+    setYField : function(value){
+        this.yField = value;
+        this.swf.setVerticalField(value);
+    },
+
+    setXAxis : function(value){
+        this.xAxis = this.createAxis('xAxis', value);
+        this.swf.setHorizontalAxis(this.xAxis);
+    },
+
+    setXAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('xAxis' + i, value[i]);
+            this.swf.setHorizontalAxis(axis);
+        }
+    },
+
+    setYAxis : function(value){
+        this.yAxis = this.createAxis('yAxis', value);
+        this.swf.setVerticalAxis(this.yAxis);
+    },
+
+    setYAxes : function(value){
+        var axis;
+        for(var i = 0; i < value.length; i++) {
+            axis = this.createAxis('yAxis' + i, value[i]);
+            this.swf.setVerticalAxis(axis);
+        }
+    },
+
+    createAxis : function(axis, value){
+        var o = Ext.apply({}, value),
+            ref,
+            old;
+
+        if(this[axis]){
+            old = this[axis].labelFunction;
+            this.removeFnProxy(old);
+            this.labelFn.remove(old);
+        }
+        if(o.labelRenderer){
+            ref = this.getFunctionRef(o.labelRenderer);
+            o.labelFunction = this.createFnProxy(function(v){
+                return ref.fn.call(ref.scope, v);
+            });
+            delete o.labelRenderer;
+            this.labelFn.push(o.labelFunction);
+        }
+        if(axis.indexOf('xAxis') > -1 && o.position == 'left'){
+            o.position = 'bottom';
+        }
+        return o;
+    },
+
+    onDestroy : function(){
+        Ext.chart.CartesianChart.superclass.onDestroy.call(this);
+        Ext.each(this.labelFn, function(fn){
+            this.removeFnProxy(fn);
+        }, this);
+    }
+});
+Ext.reg('cartesianchart', Ext.chart.CartesianChart);
+
+/**
+ * @class Ext.chart.LineChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype linechart
+ */
+Ext.chart.LineChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'line'
+});
+Ext.reg('linechart', Ext.chart.LineChart);
+
+/**
+ * @class Ext.chart.ColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype columnchart
+ */
+Ext.chart.ColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'column'
+});
+Ext.reg('columnchart', Ext.chart.ColumnChart);
+
+/**
+ * @class Ext.chart.StackedColumnChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedcolumnchart
+ */
+Ext.chart.StackedColumnChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackcolumn'
+});
+Ext.reg('stackedcolumnchart', Ext.chart.StackedColumnChart);
+
+/**
+ * @class Ext.chart.BarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype barchart
+ */
+Ext.chart.BarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'bar'
+});
+Ext.reg('barchart', Ext.chart.BarChart);
+
+/**
+ * @class Ext.chart.StackedBarChart
+ * @extends Ext.chart.CartesianChart
+ * @constructor
+ * @xtype stackedbarchart
+ */
+Ext.chart.StackedBarChart = Ext.extend(Ext.chart.CartesianChart, {
+    type: 'stackbar'
+});
+Ext.reg('stackedbarchart', Ext.chart.StackedBarChart);
+
+
+
+/**
+ * @class Ext.chart.Axis
+ * Defines a CartesianChart's vertical or horizontal axis.
+ * @constructor
+ */
+Ext.chart.Axis = function(config){
+    Ext.apply(this, config);
+};
+
+Ext.chart.Axis.prototype =
+{
+    /**
+     * The type of axis.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The direction in which the axis is drawn. May be "horizontal" or "vertical".
+     *
+     * @property orientation
+     * @type String
+     */
+    orientation: "horizontal",
+
+    /**
+     * If true, the items on the axis will be drawn in opposite direction.
+     *
+     * @property reverse
+     * @type Boolean
+     */
+    reverse: false,
+
+    /**
+     * A string reference to the globally-accessible function that may be called to
+     * determine each of the label values for this axis.
+     *
+     * @property labelFunction
+     * @type String
+     */
+    labelFunction: null,
+
+    /**
+     * If true, labels that overlap previously drawn labels on the axis will be hidden.
+     *
+     * @property hideOverlappingLabels
+     * @type Boolean
+     */
+    hideOverlappingLabels: true,
+
+    /**
+     * The space, in pixels, between labels on an axis.
+     *
+     * @property labelSpacing
+     * @type Number
+     */
+    labelSpacing: 2
+};
+
+/**
+ * @class Ext.chart.NumericAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in numeric values.
+ * @constructor
+ */
+Ext.chart.NumericAxis = Ext.extend(Ext.chart.Axis, {
+    type: "numeric",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Number
+     */
+    minimum: NaN,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: NaN,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property minorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * If true, and the bounds are calculated automatically, either the minimum
+     * or maximum will be set to zero.
+     *
+     * @property alwaysShowZero
+     * @type Boolean
+     */
+    alwaysShowZero: true,
+
+    /**
+     * The scaling algorithm to use on this axis. May be "linear" or
+     * "logarithmic".
+     *
+     * @property scale
+     * @type String
+     */
+    scale: "linear",
+
+    /**
+     * Indicates whether to round the major unit.
+     *
+     * @property roundMajorUnit
+     * @type Boolean
+     */
+    roundMajorUnit: true,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true,
+
+    /**
+     * Indicates the position of the axis relative to the chart
+     *
+     * @property position
+     * @type String
+     */
+    position: 'left',
+
+    /**
+     * Indicates whether to extend maximum beyond data's maximum to the nearest
+     * majorUnit.
+     *
+     * @property adjustMaximumByMajorUnit
+     * @type Boolean
+     */
+    adjustMaximumByMajorUnit: true,
+
+    /**
+     * Indicates whether to extend the minimum beyond data's minimum to the
+     * nearest majorUnit.
+     *
+     * @property adjustMinimumByMajorUnit
+     * @type Boolean
+     */
+    adjustMinimumByMajorUnit: true
+
+});
+
+/**
+ * @class Ext.chart.TimeAxis
+ * @extends Ext.chart.Axis
+ * A type of axis whose units are measured in time-based values.
+ * @constructor
+ */
+Ext.chart.TimeAxis = Ext.extend(Ext.chart.Axis, {
+    type: "time",
+
+    /**
+     * The minimum value drawn by the axis. If not set explicitly, the axis
+     * minimum will be calculated automatically.
+     *
+     * @property minimum
+     * @type Date
+     */
+    minimum: null,
+
+    /**
+     * The maximum value drawn by the axis. If not set explicitly, the axis
+     * maximum will be calculated automatically.
+     *
+     * @property maximum
+     * @type Number
+     */
+    maximum: null,
+
+    /**
+     * The spacing between major intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    majorUnit: NaN,
+
+    /**
+     * The time unit used by the majorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    majorTimeUnit: null,
+
+    /**
+     * The spacing between minor intervals on this axis.
+     *
+     * @property majorUnit
+     * @type Number
+     */
+    minorUnit: NaN,
+
+    /**
+     * The time unit used by the minorUnit.
+     *
+     * @property majorTimeUnit
+     * @type String
+     */
+    minorTimeUnit: null,
+
+    /**
+     * If true, the labels, ticks, gridlines, and other objects will snap to the
+     * nearest major or minor unit. If false, their position will be based on
+     * the minimum value.
+     *
+     * @property snapToUnits
+     * @type Boolean
+     */
+    snapToUnits: true,
+
+    /**
+     * Series that are stackable will only stack when this value is set to true.
+     *
+     * @property stackingEnabled
+     * @type Boolean
+     */
+    stackingEnabled: false,
+
+    /**
+     * Indicates whether to factor in the size of the labels when calculating a
+     * major unit.
+     *
+     * @property calculateByLabelSize
+     * @type Boolean
+     */
+    calculateByLabelSize: true
+
+});
+
+/**
+ * @class Ext.chart.CategoryAxis
+ * @extends Ext.chart.Axis
+ * A type of axis that displays items in categories.
+ * @constructor
+ */
+Ext.chart.CategoryAxis = Ext.extend(Ext.chart.Axis, {
+    type: "category",
+
+    /**
+     * A list of category names to display along this axis.
+     *
+     * @property categoryNames
+     * @type Array
+     */
+    categoryNames: null,
+
+    /**
+     * Indicates whether or not to calculate the number of categories (ticks and
+     * labels) when there is not enough room to display all labels on the axis.
+     * If set to true, the axis will determine the number of categories to plot.
+     * If not, all categories will be plotted.
+     *
+     * @property calculateCategoryCount
+     * @type Boolean
+     */
+    calculateCategoryCount: false
+
+});
+
+/**
+ * @class Ext.chart.Series
+ * Series class for the charts widget.
+ * @constructor
+ */
+Ext.chart.Series = function(config) { Ext.apply(this, config); };
+
+Ext.chart.Series.prototype =
+{
+    /**
+     * The type of series.
+     *
+     * @property type
+     * @type String
+     */
+    type: null,
+
+    /**
+     * The human-readable name of the series.
+     *
+     * @property displayName
+     * @type String
+     */
+    displayName: null
+};
+
+/**
+ * @class Ext.chart.CartesianSeries
+ * @extends Ext.chart.Series
+ * CartesianSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.CartesianSeries = Ext.extend(Ext.chart.Series, {
+    /**
+     * The field used to access the x-axis value from the items from the data
+     * source.
+     *
+     * @property xField
+     * @type String
+     */
+    xField: null,
+
+    /**
+     * The field used to access the y-axis value from the items from the data
+     * source.
+     *
+     * @property yField
+     * @type String
+     */
+    yField: null,
+
+    /**
+     * False to not show this series in the legend. Defaults to <tt>true</tt>.
+     *
+     * @property showInLegend
+     * @type Boolean
+     */
+    showInLegend: true,
+
+    /**
+     * Indicates which axis the series will bind to
+     *
+     * @property axis
+     * @type String
+     */
+    axis: 'primary'
+});
+
+/**
+ * @class Ext.chart.ColumnSeries
+ * @extends Ext.chart.CartesianSeries
+ * ColumnSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.ColumnSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "column"
+});
+
+/**
+ * @class Ext.chart.LineSeries
+ * @extends Ext.chart.CartesianSeries
+ * LineSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.LineSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "line"
+});
+
+/**
+ * @class Ext.chart.BarSeries
+ * @extends Ext.chart.CartesianSeries
+ * BarSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.BarSeries = Ext.extend(Ext.chart.CartesianSeries, {
+    type: "bar"
+});
+
+
+/**
+ * @class Ext.chart.PieSeries
+ * @extends Ext.chart.Series
+ * PieSeries class for the charts widget.
+ * @constructor
+ */
+Ext.chart.PieSeries = Ext.extend(Ext.chart.Series, {
+    type: "pie",
+    dataField: null,
+    categoryField: null
+});/**
+ * @class Ext.menu.Menu
+ * @extends Ext.Container
+ * <p>A menu object.  This is the container to which you may add menu items.  Menu can also serve as a base class
+ * when you want a specialized menu based off of another component (like {@link Ext.menu.DateMenu} for example).</p>
+ * <p>Menus may contain either {@link Ext.menu.Item menu items}, or general {@link Ext.Component Component}s.</p>
+ * <p>To make a contained general {@link Ext.Component Component} line up with other {@link Ext.menu.Item menu items}
+ * specify <tt>iconCls: 'no-icon'</tt>.  This reserves a space for an icon, and indents the Component in line
+ * with the other menu items.  See {@link Ext.form.ComboBox}.{@link Ext.form.ComboBox#getListParent getListParent}
+ * for an example.</p>
+ * <p>By default, Menus are absolutely positioned, floating Components. By configuring a Menu with
+ * <b><tt>{@link #floating}:false</tt></b>, a Menu may be used as child of a Container.</p>
+ *
+ * @xtype menu
+ */
+Ext.menu.Menu = Ext.extend(Ext.Container, {
+    /**
+     * @cfg {Object} defaults
+     * A config object that will be applied to all items added to this container either via the {@link #items}
+     * config or via the {@link #add} method.  The defaults config can contain any number of
+     * name/value property pairs to be added to each item, and should be valid for the types of items
+     * being added to the menu.
+     */
+    /**
+     * @cfg {Mixed} items
+     * An array of items to be added to this menu. Menus may contain either {@link Ext.menu.Item menu items},
+     * or general {@link Ext.Component Component}s.
+     */
+    /**
+     * @cfg {Number} minWidth The minimum width of the menu in pixels (defaults to 120)
+     */
+    minWidth : 120,
+    /**
+     * @cfg {Boolean/String} shadow True or 'sides' for the default effect, 'frame' for 4-way shadow, and 'drop'
+     * for bottom-right shadow (defaults to 'sides')
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String} subMenuAlign The {@link Ext.Element#alignTo} anchor position value to use for submenus of
+     * this menu (defaults to 'tl-tr?')
+     */
+    subMenuAlign : 'tl-tr?',
+    /**
+     * @cfg {String} defaultAlign The default {@link Ext.Element#alignTo} anchor position value for this menu
+     * relative to its element of origin (defaults to 'tl-bl?')
+     */
+    defaultAlign : 'tl-bl?',
+    /**
+     * @cfg {Boolean} allowOtherMenus True to allow multiple menus to be displayed at the same time (defaults to false)
+     */
+    allowOtherMenus : false,
+    /**
+     * @cfg {Boolean} ignoreParentClicks True to ignore clicks on any item in this menu that is a parent item (displays
+     * a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false).
+     */
+    ignoreParentClicks : false,
+    /**
+     * @cfg {Boolean} enableScrolling True to allow the menu container to have scroller controls if the menu is too long (defaults to true).
+     */
+    enableScrolling : true,
+    /**
+     * @cfg {Number} maxHeight The maximum height of the menu. Only applies when enableScrolling is set to True (defaults to null).
+     */
+    maxHeight : null,
+    /**
+     * @cfg {Number} scrollIncrement The amount to scroll the menu. Only applies when enableScrolling is set to True (defaults to 24).
+     */
+    scrollIncrement : 24,
+    /**
+     * @cfg {Boolean} showSeparator True to show the icon separator. (defaults to true).
+     */
+    showSeparator : true,
+    /**
+     * @cfg {Array} defaultOffsets An array specifying the [x, y] offset in pixels by which to
+     * change the default Menu popup position after aligning according to the {@link #defaultAlign}
+     * configuration. Defaults to <tt>[0, 0]</tt>.
+     */
+    defaultOffsets : [0, 0],
+
+    /**
+     * @cfg {Boolean} plain
+     * True to remove the incised line down the left side of the menu. Defaults to <tt>false</tt>.
+     */
+    plain : false,
+
+    /**
+     * @cfg {Boolean} floating
+     * <p>By default, a Menu configured as <b><code>floating:true</code></b>
+     * will be rendered as an {@link Ext.Layer} (an absolutely positioned,
+     * floating Component with zindex=15000).
+     * If configured as <b><code>floating:false</code></b>, the Menu may be
+     * used as child item of another Container instead of a free-floating
+     * {@link Ext.Layer Layer}.
+     */
+    floating : true,
+
+
+    /**
+     * @cfg {Number} zIndex
+     * zIndex to use when the menu is floating.
+     */
+    zIndex: 15000,
+
+    // private
+    hidden : true,
+
+    /**
+     * @cfg {String/Object} layout
+     * This class assigns a default layout (<code>layout:'<b>menu</b>'</code>).
+     * Developers <i>may</i> override this configuration option if another layout is required.
+     * See {@link Ext.Container#layout} for additional information.
+     */
+    layout : 'menu',
+    hideMode : 'offsets',    // Important for laying out Components
+    scrollerHeight : 8,
+    autoLayout : true,       // Provided for backwards compat
+    defaultType : 'menuitem',
+    bufferResize : false,
+
+    initComponent : function(){
+        if(Ext.isArray(this.initialConfig)){
+            Ext.apply(this, {items:this.initialConfig});
+        }
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this menu is clicked (or when the enter key is pressed while it is active)
+             * @param {Ext.menu.Menu} this
+            * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event mouseover
+             * Fires when the mouse is hovering over this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * Fires when the mouse exits this menu
+             * @param {Ext.menu.Menu} this
+             * @param {Ext.EventObject} e
+             * @param {Ext.menu.Item} menuItem The menu item that was clicked
+             */
+            'mouseout',
+            /**
+             * @event itemclick
+             * Fires when a menu item contained in this menu is clicked
+             * @param {Ext.menu.BaseItem} baseItem The BaseItem that was clicked
+             * @param {Ext.EventObject} e
+             */
+            'itemclick'
+        );
+        Ext.menu.MenuMgr.register(this);
+        if(this.floating){
+            Ext.EventManager.onWindowResize(this.hide, this);
+        }else{
+            if(this.initialConfig.hidden !== false){
+                this.hidden = false;
+            }
+            this.internalDefaults = {hideOnClick: false};
+        }
+        Ext.menu.Menu.superclass.initComponent.call(this);
+        if(this.autoLayout){
+            var fn = this.doLayout.createDelegate(this, []);
+            this.on({
+                add: fn,
+                remove: fn
+            });
+        }
+    },
+
+    //private
+    getLayoutTarget : function() {
+        return this.ul;
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!ct){
+            ct = Ext.getBody();
+        }
+
+        var dh = {
+            id: this.getId(),
+            cls: 'x-menu ' + ((this.floating) ? 'x-menu-floating x-layer ' : '') + (this.cls || '') + (this.plain ? ' x-menu-plain' : '') + (this.showSeparator ? '' : ' x-menu-nosep'),
+            style: this.style,
+            cn: [
+                {tag: 'a', cls: 'x-menu-focus', href: '#', onclick: 'return false;', tabIndex: '-1'},
+                {tag: 'ul', cls: 'x-menu-list'}
+            ]
+        };
+        if(this.floating){
+            this.el = new Ext.Layer({
+                shadow: this.shadow,
+                dh: dh,
+                constrain: false,
+                parentEl: ct,
+                zindex: this.zIndex
+            });
+        }else{
+            this.el = ct.createChild(dh);
+        }
+        Ext.menu.Menu.superclass.onRender.call(this, ct, position);
+
+        if(!this.keyNav){
+            this.keyNav = new Ext.menu.MenuNav(this);
+        }
+        // generic focus element
+        this.focusEl = this.el.child('a.x-menu-focus');
+        this.ul = this.el.child('ul.x-menu-list');
+        this.mon(this.ul, {
+            scope: this,
+            click: this.onClick,
+            mouseover: this.onMouseOver,
+            mouseout: this.onMouseOut
+        });
+        if(this.enableScrolling){
+            this.mon(this.el, {
+                scope: this,
+                delegate: '.x-menu-scroller',
+                click: this.onScroll,
+                mouseover: this.deactivateActive
+            });
+        }
+    },
+
+    // private
+    findTargetItem : function(e){
+        var t = e.getTarget('.x-menu-list-item', this.ul, true);
+        if(t && t.menuItemId){
+            return this.items.get(t.menuItemId);
+        }
+    },
+
+    // private
+    onClick : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.isFormField){
+                this.setActiveItem(t);
+            }else if(t instanceof Ext.menu.BaseItem){
+                if(t.menu && this.ignoreParentClicks){
+                    t.expandMenu();
+                    e.preventDefault();
+                }else if(t.onClick){
+                    t.onClick(e);
+                    this.fireEvent('click', this, t, e);
+                }
+            }
+        }
+    },
+
+    // private
+    setActiveItem : function(item, autoExpand){
+        if(item != this.activeItem){
+            this.deactivateActive();
+            if((this.activeItem = item).isFormField){
+                item.focus();
+            }else{
+                item.activate(autoExpand);
+            }
+        }else if(autoExpand){
+            item.expandMenu();
+        }
+    },
+
+    deactivateActive : function(){
+        var a = this.activeItem;
+        if(a){
+            if(a.isFormField){
+                //Fields cannot deactivate, but Combos must collapse
+                if(a.collapse){
+                    a.collapse();
+                }
+            }else{
+                a.deactivate();
+            }
+            delete this.activeItem;
+        }
+    },
+
+    // private
+    tryActivate : function(start, step){
+        var items = this.items;
+        for(var i = start, len = items.length; i >= 0 && i < len; i+= step){
+            var item = items.get(i);
+            if(item.isVisible() && !item.disabled && (item.canActivate || item.isFormField)){
+                this.setActiveItem(item, false);
+                return item;
+            }
+        }
+        return false;
+    },
+
+    // private
+    onMouseOver : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t.canActivate && !t.disabled){
+                this.setActiveItem(t, true);
+            }
+        }
+        this.over = true;
+        this.fireEvent('mouseover', this, e, t);
+    },
+
+    // private
+    onMouseOut : function(e){
+        var t = this.findTargetItem(e);
+        if(t){
+            if(t == this.activeItem && t.shouldDeactivate && t.shouldDeactivate(e)){
+                this.activeItem.deactivate();
+                delete this.activeItem;
+            }
+        }
+        this.over = false;
+        this.fireEvent('mouseout', this, e, t);
+    },
+
+    // private
+    onScroll : function(e, t){
+        if(e){
+            e.stopEvent();
+        }
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        ul.scrollTop += this.scrollIncrement * (top ? -1 : 1);
+        if(top ? ul.scrollTop <= 0 : ul.scrollTop + this.activeMax >= ul.scrollHeight){
+           this.onScrollerOut(null, t);
+        }
+    },
+
+    // private
+    onScrollerIn : function(e, t){
+        var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top');
+        if(top ? ul.scrollTop > 0 : ul.scrollTop + this.activeMax < ul.scrollHeight){
+            Ext.fly(t).addClass(['x-menu-item-active', 'x-menu-scroller-active']);
+        }
+    },
+
+    // private
+    onScrollerOut : function(e, t){
+        Ext.fly(t).removeClass(['x-menu-item-active', 'x-menu-scroller-active']);
+    },
+
+    /**
+     * If <code>{@link #floating}=true</code>, shows this menu relative to
+     * another element using {@link #showat}, otherwise uses {@link Ext.Component#show}.
+     * @param {Mixed} element The element to align to
+     * @param {String} position (optional) The {@link Ext.Element#alignTo} anchor position to use in aligning to
+     * the element (defaults to this.defaultAlign)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    show : function(el, pos, parentMenu){
+        if(this.floating){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+                this.doLayout(false, true);
+            }
+            this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign, this.defaultOffsets), parentMenu);
+        }else{
+            Ext.menu.Menu.superclass.show.call(this);
+        }
+    },
+
+    /**
+     * Displays this menu at a specific xy position and fires the 'show' event if a
+     * handler for the 'beforeshow' event does not return false cancelling the operation.
+     * @param {Array} xyPosition Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based)
+     * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+     */
+    showAt : function(xy, parentMenu){
+        if(this.fireEvent('beforeshow', this) !== false){
+            this.parentMenu = parentMenu;
+            if(!this.el){
+                this.render();
+            }
+            if(this.enableScrolling){
+                // set the position so we can figure out the constrain value.
+                this.el.setXY(xy);
+                //constrain the value, keep the y coordinate the same
+                xy[1] = this.constrainScroll(xy[1]);
+                xy = [this.el.adjustForConstraints(xy)[0], xy[1]];
+            }else{
+                //constrain to the viewport.
+                xy = this.el.adjustForConstraints(xy);
+            }
+            this.el.setXY(xy);
+            this.el.show();
+            Ext.menu.Menu.superclass.onShow.call(this);
+            if(Ext.isIE){
+                // internal event, used so we don't couple the layout to the menu
+                this.fireEvent('autosize', this);
+                if(!Ext.isIE8){
+                    this.el.repaint();
+                }
+            }
+            this.hidden = false;
+            this.focus();
+            this.fireEvent('show', this);
+        }
+    },
+
+    constrainScroll : function(y){
+        var max, full = this.ul.setHeight('auto').getHeight(),
+            returnY = y, normalY, parentEl, scrollTop, viewHeight;
+        if(this.floating){
+            parentEl = Ext.fly(this.el.dom.parentNode);
+            scrollTop = parentEl.getScroll().top;
+            viewHeight = parentEl.getViewSize().height;
+            //Normalize y by the scroll position for the parent element.  Need to move it into the coordinate space
+            //of the view.
+            normalY = y - scrollTop;
+            max = this.maxHeight ? this.maxHeight : viewHeight - normalY;
+            if(full > viewHeight) {
+                max = viewHeight;
+                //Set returnY equal to (0,0) in view space by reducing y by the value of normalY
+                returnY = y - normalY;
+            } else if(max < full) {
+                returnY = y - (full - max);
+                max = full;
+            }
+        }else{
+            max = this.getHeight();
+        }
+        // Always respect maxHeight 
+        if (this.maxHeight){
+            max = Math.min(this.maxHeight, max);
+        }
+        if(full > max && max > 0){
+            this.activeMax = max - this.scrollerHeight * 2 - this.el.getFrameWidth('tb') - Ext.num(this.el.shadowOffset, 0);
+            this.ul.setHeight(this.activeMax);
+            this.createScrollers();
+            this.el.select('.x-menu-scroller').setDisplayed('');
+        }else{
+            this.ul.setHeight(full);
+            this.el.select('.x-menu-scroller').setDisplayed('none');
+        }
+        this.ul.dom.scrollTop = 0;
+        return returnY;
+    },
+
+    createScrollers : function(){
+        if(!this.scroller){
+            this.scroller = {
+                pos: 0,
+                top: this.el.insertFirst({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-top',
+                    html: '&#160;'
+                }),
+                bottom: this.el.createChild({
+                    tag: 'div',
+                    cls: 'x-menu-scroller x-menu-scroller-bottom',
+                    html: '&#160;'
+                })
+            };
+            this.scroller.top.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.topRepeater = new Ext.util.ClickRepeater(this.scroller.top, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.top], false)
+                }
+            });
+            this.scroller.bottom.hover(this.onScrollerIn, this.onScrollerOut, this);
+            this.scroller.bottomRepeater = new Ext.util.ClickRepeater(this.scroller.bottom, {
+                listeners: {
+                    click: this.onScroll.createDelegate(this, [null, this.scroller.bottom], false)
+                }
+            });
+        }
+    },
+
+    onLayout : function(){
+        if(this.isVisible()){
+            if(this.enableScrolling){
+                this.constrainScroll(this.el.getTop());
+            }
+            if(this.floating){
+                this.el.sync();
+            }
+        }
+    },
+
+    focus : function(){
+        if(!this.hidden){
+            this.doFocus.defer(50, this);
+        }
+    },
+
+    doFocus : function(){
+        if(!this.hidden){
+            this.focusEl.focus();
+        }
+    },
+
+    /**
+     * Hides this menu and optionally all parent menus
+     * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
+     */
+    hide : function(deep){
+        if (!this.isDestroyed) {
+            this.deepHide = deep;
+            Ext.menu.Menu.superclass.hide.call(this);
+            delete this.deepHide;
+        }
+    },
+
+    // private
+    onHide : function(){
+        Ext.menu.Menu.superclass.onHide.call(this);
+        this.deactivateActive();
+        if(this.el && this.floating){
+            this.el.hide();
+        }
+        var pm = this.parentMenu;
+        if(this.deepHide === true && pm){
+            if(pm.floating){
+                pm.hide(true);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+
+    // private
+    lookupComponent : function(c){
+         if(Ext.isString(c)){
+            c = (c == 'separator' || c == '-') ? new Ext.menu.Separator() : new Ext.menu.TextItem(c);
+             this.applyDefaults(c);
+         }else{
+            if(Ext.isObject(c)){
+                c = this.getMenuItem(c);
+            }else if(c.tagName || c.el){ // element. Wrap it.
+                c = new Ext.BoxComponent({
+                    el: c
+                });
+            }
+         }
+         return c;
+    },
+
+    applyDefaults : function(c) {
+        if (!Ext.isString(c)) {
+            c = Ext.menu.Menu.superclass.applyDefaults.call(this, c);
+            var d = this.internalDefaults;
+            if(d){
+                if(c.events){
+                    Ext.applyIf(c.initialConfig, d);
+                    Ext.apply(c, d);
+                }else{
+                    Ext.applyIf(c, d);
+                }
+            }
+        }
+        return c;
+    },
+
+    // private
+    getMenuItem : function(config) {
+        config.ownerCt = this;
+        
+        if (!config.isXType) {
+            if (!config.xtype && Ext.isBoolean(config.checked)) {
+                return new Ext.menu.CheckItem(config);
+            }
+            return Ext.create(config, this.defaultType);
+        }
+        return config;
+    },
+
+    /**
+     * Adds a separator bar to the menu
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addSeparator : function() {
+        return this.add(new Ext.menu.Separator());
+    },
+
+    /**
+     * Adds an {@link Ext.Element} object to the menu
+     * @param {Mixed} el The element or DOM node to add, or its id
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addElement : function(el) {
+        return this.add(new Ext.menu.BaseItem({
+            el: el
+        }));
+    },
+
+    /**
+     * Adds an existing object based on {@link Ext.menu.BaseItem} to the menu
+     * @param {Ext.menu.Item} item The menu item to add
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addItem : function(item) {
+        return this.add(item);
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.Item} based an the supplied config object and adds it to the menu
+     * @param {Object} config A MenuItem config object
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addMenuItem : function(config) {
+        return this.add(this.getMenuItem(config));
+    },
+
+    /**
+     * Creates a new {@link Ext.menu.TextItem} with the supplied text and adds it to the menu
+     * @param {String} text The text to display in the menu item
+     * @return {Ext.menu.Item} The menu item that was added
+     */
+    addText : function(text){
+        return this.add(new Ext.menu.TextItem(text));
+    },
+
+    //private
+    onDestroy : function(){
+        Ext.EventManager.removeResizeListener(this.hide, this);
+        var pm = this.parentMenu;
+        if(pm && pm.activeChild == this){
+            delete pm.activeChild;
+        }
+        delete this.parentMenu;
+        Ext.menu.Menu.superclass.onDestroy.call(this);
+        Ext.menu.MenuMgr.unregister(this);
+        if(this.keyNav) {
+            this.keyNav.disable();
+        }
+        var s = this.scroller;
+        if(s){
+            Ext.destroy(s.topRepeater, s.bottomRepeater, s.top, s.bottom);
+        }
+        Ext.destroy(
+            this.el,
+            this.focusEl,
+            this.ul
+        );
+    }
+});
+
+Ext.reg('menu', Ext.menu.Menu);
+
+// MenuNav is a private utility class used internally by the Menu
+Ext.menu.MenuNav = Ext.extend(Ext.KeyNav, function(){
+    function up(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){
+            m.tryActivate(m.items.length-1, -1);
+        }
+    }
+    function down(e, m){
+        if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){
+            m.tryActivate(0, 1);
+        }
+    }
+    return {
+        constructor : function(menu){
+            Ext.menu.MenuNav.superclass.constructor.call(this, menu.el);
+            this.scope = this.menu = menu;
+        },
+
+        doRelay : function(e, h){
+            var k = e.getKey();
+//          Keystrokes within a form Field (e.g.: down in a Combo) do not navigate. Allow only TAB
+            if (this.menu.activeItem && this.menu.activeItem.isFormField && k != e.TAB) {
+                return false;
+            }
+            if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){
+                this.menu.tryActivate(0, 1);
+                return false;
+            }
+            return h.call(this.scope || this, e, this.menu);
+        },
+
+        tab: function(e, m) {
+            e.stopEvent();
+            if (e.shiftKey) {
+                up(e, m);
+            } else {
+                down(e, m);
+            }
+        },
+
+        up : up,
+
+        down : down,
+
+        right : function(e, m){
+            if(m.activeItem){
+                m.activeItem.expandMenu(true);
+            }
+        },
+
+        left : function(e, m){
+            m.hide();
+            if(m.parentMenu && m.parentMenu.activeItem){
+                m.parentMenu.activeItem.activate();
+            }
+        },
+
+        enter : function(e, m){
+            if(m.activeItem){
+                e.stopPropagation();
+                m.activeItem.onClick(e);
+                m.fireEvent('click', this, m.activeItem);
+                return true;
+            }
+        }
+    };
+}());
+/**
+ * @class Ext.menu.MenuMgr
+ * Provides a common registry of all menu items on a page so that they can be easily accessed by id.
+ * @singleton
+ */
+Ext.menu.MenuMgr = function(){
+   var menus, 
+       active, 
+       map,
+       groups = {}, 
+       attached = false, 
+       lastShow = new Date();
+   
+
+   // private - called when first menu is created
+   function init(){
+       menus = {};
+       active = new Ext.util.MixedCollection();
+       map = Ext.getDoc().addKeyListener(27, hideAll);
+       map.disable();
+   }
+
+   // private
+   function hideAll(){
+       if(active && active.length > 0){
+           var c = active.clone();
+           c.each(function(m){
+               m.hide();
+           });
+           return true;
+       }
+       return false;
+   }
+
+   // private
+   function onHide(m){
+       active.remove(m);
+       if(active.length < 1){
+           map.disable();
+           Ext.getDoc().un("mousedown", onMouseDown);
+           attached = false;
+       }
+   }
+
+   // private
+   function onShow(m){
+       var last = active.last();
+       lastShow = new Date();
+       active.add(m);
+       if(!attached){
+           map.enable();
+           Ext.getDoc().on("mousedown", onMouseDown);
+           attached = true;
+       }
+       if(m.parentMenu){
+          m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3);
+          m.parentMenu.activeChild = m;
+       }else if(last && !last.isDestroyed && last.isVisible()){
+          m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3);
+       }
+   }
+
+   // private
+   function onBeforeHide(m){
+       if(m.activeChild){
+           m.activeChild.hide();
+       }
+       if(m.autoHideTimer){
+           clearTimeout(m.autoHideTimer);
+           delete m.autoHideTimer;
+       }
+   }
+
+   // private
+   function onBeforeShow(m){
+       var pm = m.parentMenu;
+       if(!pm && !m.allowOtherMenus){
+           hideAll();
+       }else if(pm && pm.activeChild){
+           pm.activeChild.hide();
+       }
+   }
+
+   // private
+   function onMouseDown(e){
+       if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){
+           hideAll();
+       }
+   }
+
+   return {
+
+       /**
+        * Hides all menus that are currently visible
+        * @return {Boolean} success True if any active menus were hidden.
+        */
+       hideAll : function(){
+            return hideAll();
+       },
+
+       // private
+       register : function(menu){
+           if(!menus){
+               init();
+           }
+           menus[menu.id] = menu;
+           menu.on({
+               beforehide: onBeforeHide,
+               hide: onHide,
+               beforeshow: onBeforeShow,
+               show: onShow
+           });
+       },
+
+        /**
+         * Returns a {@link Ext.menu.Menu} object
+         * @param {String/Object} menu The string menu id, an existing menu object reference, or a Menu config that will
+         * be used to generate and return a new Menu instance.
+         * @return {Ext.menu.Menu} The specified menu, or null if none are found
+         */
+       get : function(menu){
+           if(typeof menu == "string"){ // menu id
+               if(!menus){  // not initialized, no menus to return
+                   return null;
+               }
+               return menus[menu];
+           }else if(menu.events){  // menu instance
+               return menu;
+           }else if(typeof menu.length == 'number'){ // array of menu items?
+               return new Ext.menu.Menu({items:menu});
+           }else{ // otherwise, must be a config
+               return Ext.create(menu, 'menu');
+           }
+       },
+
+       // private
+       unregister : function(menu){
+           delete menus[menu.id];
+           menu.un("beforehide", onBeforeHide);
+           menu.un("hide", onHide);
+           menu.un("beforeshow", onBeforeShow);
+           menu.un("show", onShow);
+       },
+
+       // private
+       registerCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               if(!groups[g]){
+                   groups[g] = [];
+               }
+               groups[g].push(menuItem);
+           }
+       },
+
+       // private
+       unregisterCheckable : function(menuItem){
+           var g = menuItem.group;
+           if(g){
+               groups[g].remove(menuItem);
+           }
+       },
+       
+       // private
+       onCheckChange: function(item, state){
+           if(item.group && state){
+               var group = groups[item.group],
+                   i = 0,
+                   len = group.length,
+                   current;
+                   
+               for(; i < len; i++){
+                   current = group[i];
+                   if(current != item){
+                       current.setChecked(false);
+                   }
+               }
+           }
+       },
+
+       getCheckedItem : function(groupId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].checked){
+                       return g[i];
+                   }
+               }
+           }
+           return null;
+       },
+
+       setCheckedItem : function(groupId, itemId){
+           var g = groups[groupId];
+           if(g){
+               for(var i = 0, l = g.length; i < l; i++){
+                   if(g[i].id == itemId){
+                       g[i].setChecked(true);
+                   }
+               }
+           }
+           return null;
+       }
+   };
+}();
+/**
+ * @class Ext.menu.BaseItem
+ * @extends Ext.Component
+ * The base class for all items that render into menus.  BaseItem provides default rendering, activated state
+ * management and base configuration options shared by all menu components.
+ * @constructor
+ * Creates a new BaseItem
+ * @param {Object} config Configuration options
+ * @xtype menubaseitem
+ */
+Ext.menu.BaseItem = Ext.extend(Ext.Component, {
+    /**
+     * @property parentMenu
+     * @type Ext.menu.Menu
+     * The parent Menu of this Item.
+     */
+    /**
+     * @cfg {Function} handler
+     * A function that will handle the click event of this menu item (optional).
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>b</code> : Item<div class="sub-desc">This menu Item.</div></li>
+     * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the handler function will be called.
+     */
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to false)
+     */
+    canActivate : false,
+    /**
+     * @cfg {String} activeClass The CSS class to use when the item becomes activated (defaults to "x-menu-item-active")
+     */
+    activeClass : "x-menu-item-active",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to true)
+     */
+    hideOnClick : true,
+    /**
+     * @cfg {Number} clickHideDelay Length of time in milliseconds to wait before hiding after a click (defaults to 1)
+     */
+    clickHideDelay : 1,
+
+    // private
+    ctype : "Ext.menu.BaseItem",
+
+    // private
+    actionMode : "container",
+
+    initComponent : function(){
+        Ext.menu.BaseItem.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this item is clicked
+             * @param {Ext.menu.BaseItem} this
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event activate
+             * Fires when this item is activated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'activate',
+            /**
+             * @event deactivate
+             * Fires when this item is deactivated
+             * @param {Ext.menu.BaseItem} this
+             */
+            'deactivate'
+        );
+        if(this.handler){
+            this.on("click", this.handler, this.scope);
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        Ext.menu.BaseItem.superclass.onRender.apply(this, arguments);
+        if(this.ownerCt && this.ownerCt instanceof Ext.menu.Menu){
+            this.parentMenu = this.ownerCt;
+        }else{
+            this.container.addClass('x-menu-list-item');
+            this.mon(this.el, {
+                scope: this,
+                click: this.onClick,
+                mouseenter: this.activate,
+                mouseleave: this.deactivate
+            });
+        }
+    },
+
+    /**
+     * Sets the function that will handle click events for this item (equivalent to passing in the {@link #handler}
+     * config property).  If an existing handler is already registered, it will be unregistered for you.
+     * @param {Function} handler The function that should be called on click
+     * @param {Object} scope The scope (<code>this</code> reference) in which the handler function is executed. Defaults to this menu item.
+     */
+    setHandler : function(handler, scope){
+        if(this.handler){
+            this.un("click", this.handler, this.scope);
+        }
+        this.on("click", this.handler = handler, this.scope = scope);
+    },
+
+    // private
+    onClick : function(e){
+        if(!this.disabled && this.fireEvent("click", this, e) !== false
+                && (this.parentMenu && this.parentMenu.fireEvent("itemclick", this, e) !== false)){
+            this.handleClick(e);
+        }else{
+            e.stopEvent();
+        }
+    },
+
+    // private
+    activate : function(){
+        if(this.disabled){
+            return false;
+        }
+        var li = this.container;
+        li.addClass(this.activeClass);
+        this.region = li.getRegion().adjust(2, 2, -2, -2);
+        this.fireEvent("activate", this);
+        return true;
+    },
+
+    // private
+    deactivate : function(){
+        this.container.removeClass(this.activeClass);
+        this.fireEvent("deactivate", this);
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        return !this.region || !this.region.contains(e.getPoint());
+    },
+
+    // private
+    handleClick : function(e){
+        var pm = this.parentMenu;
+        if(this.hideOnClick){
+            if(pm.floating){
+                this.clickHideDelayTimer = pm.hide.defer(this.clickHideDelay, pm, [true]);
+            }else{
+                pm.deactivateActive();
+            }
+        }
+    },
+    
+    beforeDestroy: function(){
+        clearTimeout(this.clickHideDelayTimer);
+        Ext.menu.BaseItem.superclass.beforeDestroy.call(this);    
+    },
+
+    // private. Do nothing
+    expandMenu : Ext.emptyFn,
+
+    // private. Do nothing
+    hideMenu : Ext.emptyFn
+});
+Ext.reg('menubaseitem', Ext.menu.BaseItem);/**
+ * @class Ext.menu.TextItem
+ * @extends Ext.menu.BaseItem
+ * Adds a static text string to a menu, usually used as either a heading or group separator.
+ * @constructor
+ * Creates a new TextItem
+ * @param {Object/String} config If config is a string, it is used as the text to display, otherwise it
+ * is applied as a config object (and should contain a <tt>text</tt> property).
+ * @xtype menutextitem
+ */
+Ext.menu.TextItem = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} text The text to display for this item (defaults to '')
+     */
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    /**
+     * @cfg {String} itemCls The default CSS class to use for text items (defaults to "x-menu-text")
+     */
+    itemCls : "x-menu-text",
+    
+    constructor : function(config) {
+        if (typeof config == 'string') {
+            config = {
+                text: config
+            };
+        }
+        Ext.menu.TextItem.superclass.constructor.call(this, config);
+    },
+
+    // private
+    onRender : function() {
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = this.text;
+        this.el = s;
+        Ext.menu.TextItem.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menutextitem', Ext.menu.TextItem);/**
+ * @class Ext.menu.Separator
+ * @extends Ext.menu.BaseItem
+ * Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will
+ * add one of these by using "-" in you call to add() or in your items config rather than creating one directly.
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype menuseparator
+ */
+Ext.menu.Separator = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @cfg {String} itemCls The default CSS class to use for separators (defaults to "x-menu-sep")
+     */
+    itemCls : "x-menu-sep",
+    /**
+     * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false)
+     */
+    hideOnClick : false,
+    
+    /** 
+     * @cfg {String} activeClass
+     * @hide 
+     */
+    activeClass: '',
+
+    // private
+    onRender : function(li){
+        var s = document.createElement("span");
+        s.className = this.itemCls;
+        s.innerHTML = "&#160;";
+        this.el = s;
+        li.addClass("x-menu-sep-li");
+        Ext.menu.Separator.superclass.onRender.apply(this, arguments);
+    }
+});
+Ext.reg('menuseparator', Ext.menu.Separator);/**
+ * @class Ext.menu.Item
+ * @extends Ext.menu.BaseItem
+ * A base class for all menu items that require menu-related functionality (like sub-menus) and are not static
+ * display items.  Item extends the base functionality of {@link Ext.menu.BaseItem} by adding menu-specific
+ * activation and click handling.
+ * @constructor
+ * Creates a new Item
+ * @param {Object} config Configuration options
+ * @xtype menuitem
+ */
+Ext.menu.Item = Ext.extend(Ext.menu.BaseItem, {
+    /**
+     * @property menu
+     * @type Ext.menu.Menu
+     * The submenu associated with this Item if one was configured.
+     */
+    /**
+     * @cfg {Mixed} menu (optional) Either an instance of {@link Ext.menu.Menu} or the config object for an
+     * {@link Ext.menu.Menu} which acts as the submenu when this item is activated.
+     */
+    /**
+     * @cfg {String} icon The path to an icon to display in this item (defaults to Ext.BLANK_IMAGE_URL).  If
+     * icon is specified {@link #iconCls} should not be.
+     */
+    /**
+     * @cfg {String} iconCls A CSS class that specifies a background image that will be used as the icon for
+     * this item (defaults to '').  If iconCls is specified {@link #icon} should not be.
+     */
+    /**
+     * @cfg {String} text The text to display in this item (defaults to '').
+     */
+    /**
+     * @cfg {String} href The href attribute to use for the underlying anchor link (defaults to '#').
+     */
+    /**
+     * @cfg {String} hrefTarget The target attribute to use for the underlying anchor link (defaults to '').
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for menu items (defaults to 'x-menu-item')
+     */
+    itemCls : 'x-menu-item',
+    /**
+     * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to true)
+     */
+    canActivate : true,
+    /**
+     * @cfg {Number} showDelay Length of time in milliseconds to wait before showing this item (defaults to 200)
+     */
+    showDelay: 200,
+    
+    /**
+     * @cfg {String} altText The altText to use for the icon, if it exists. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+    
+    // doc'd in BaseItem
+    hideDelay: 200,
+
+    // private
+    ctype: 'Ext.menu.Item',
+
+    initComponent : function(){
+        Ext.menu.Item.superclass.initComponent.call(this);
+        if(this.menu){
+            // If array of items, turn it into an object config so we
+            // can set the ownerCt property in the config
+            if (Ext.isArray(this.menu)){
+                this.menu = { items: this.menu };
+            }
+            
+            // An object config will work here, but an instance of a menu
+            // will have already setup its ref's and have no effect
+            if (Ext.isObject(this.menu)){
+                this.menu.ownerCt = this;
+            }
+            
+            this.menu = Ext.menu.MenuMgr.get(this.menu);
+            this.menu.ownerCt = undefined;
+        }
+    },
+
+    // private
+    onRender : function(container, position){
+        if (!this.itemTpl) {
+            this.itemTpl = Ext.menu.Item.prototype.itemTpl = new Ext.XTemplate(
+                '<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"',
+                    '<tpl if="hrefTarget">',
+                        ' target="{hrefTarget}"',
+                    '</tpl>',
+                 '>',
+                     '<img alt="{altText}" src="{icon}" class="x-menu-item-icon {iconCls}"/>',
+                     '<span class="x-menu-item-text">{text}</span>',
+                 '</a>'
+             );
+        }
+        var a = this.getTemplateArgs();
+        this.el = position ? this.itemTpl.insertBefore(position, a, true) : this.itemTpl.append(container, a, true);
+        this.iconEl = this.el.child('img.x-menu-item-icon');
+        this.textEl = this.el.child('.x-menu-item-text');
+        if(!this.href) { // if no link defined, prevent the default anchor event
+            this.mon(this.el, 'click', Ext.emptyFn, null, { preventDefault: true });
+        }
+        Ext.menu.Item.superclass.onRender.call(this, container, position);
+    },
+
+    getTemplateArgs: function() {
+        return {
+            id: this.id,
+            cls: this.itemCls + (this.menu ?  ' x-menu-item-arrow' : '') + (this.cls ?  ' ' + this.cls : ''),
+            href: this.href || '#',
+            hrefTarget: this.hrefTarget,
+            icon: this.icon || Ext.BLANK_IMAGE_URL,
+            iconCls: this.iconCls || '',
+            text: this.itemText||this.text||'&#160;',
+            altText: this.altText || ''
+        };
+    },
+
+    /**
+     * Sets the text to display in this menu item
+     * @param {String} text The text to display
+     */
+    setText : function(text){
+        this.text = text||'&#160;';
+        if(this.rendered){
+            this.textEl.update(this.text);
+            this.parentMenu.layout.doAutoSize();
+        }
+    },
+
+    /**
+     * Sets the CSS class to apply to the item's icon element
+     * @param {String} cls The CSS class to apply
+     */
+    setIconClass : function(cls){
+        var oldCls = this.iconCls;
+        this.iconCls = cls;
+        if(this.rendered){
+            this.iconEl.replaceClass(oldCls, this.iconCls);
+        }
+    },
+
+    //private
+    beforeDestroy: function(){
+        clearTimeout(this.showTimer);
+        clearTimeout(this.hideTimer);
+        if (this.menu){
+            delete this.menu.ownerCt;
+            this.menu.destroy();
+        }
+        Ext.menu.Item.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    handleClick : function(e){
+        if(!this.href){ // if no link defined, stop the event automatically
+            e.stopEvent();
+        }
+        Ext.menu.Item.superclass.handleClick.apply(this, arguments);
+    },
+
+    // private
+    activate : function(autoExpand){
+        if(Ext.menu.Item.superclass.activate.apply(this, arguments)){
+            this.focus();
+            if(autoExpand){
+                this.expandMenu();
+            }
+        }
+        return true;
+    },
+
+    // private
+    shouldDeactivate : function(e){
+        if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){
+            if(this.menu && this.menu.isVisible()){
+                return !this.menu.getEl().getRegion().contains(e.getPoint());
+            }
+            return true;
+        }
+        return false;
+    },
+
+    // private
+    deactivate : function(){
+        Ext.menu.Item.superclass.deactivate.apply(this, arguments);
+        this.hideMenu();
+    },
+
+    // private
+    expandMenu : function(autoActivate){
+        if(!this.disabled && this.menu){
+            clearTimeout(this.hideTimer);
+            delete this.hideTimer;
+            if(!this.menu.isVisible() && !this.showTimer){
+                this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]);
+            }else if (this.menu.isVisible() && autoActivate){
+                this.menu.tryActivate(0, 1);
+            }
+        }
+    },
+
+    // private
+    deferExpand : function(autoActivate){
+        delete this.showTimer;
+        this.menu.show(this.container, this.parentMenu.subMenuAlign || 'tl-tr?', this.parentMenu);
+        if(autoActivate){
+            this.menu.tryActivate(0, 1);
+        }
+    },
+
+    // private
+    hideMenu : function(){
+        clearTimeout(this.showTimer);
+        delete this.showTimer;
+        if(!this.hideTimer && this.menu && this.menu.isVisible()){
+            this.hideTimer = this.deferHide.defer(this.hideDelay, this);
+        }
+    },
+
+    // private
+    deferHide : function(){
+        delete this.hideTimer;
+        if(this.menu.over){
+            this.parentMenu.setActiveItem(this, false);
+        }else{
+            this.menu.hide();
+        }
+    }
+});
+Ext.reg('menuitem', Ext.menu.Item);/**
+ * @class Ext.menu.CheckItem
+ * @extends Ext.menu.Item
+ * Adds a menu item that contains a checkbox by default, but can also be part of a radio group.
+ * @constructor
+ * Creates a new CheckItem
+ * @param {Object} config Configuration options
+ * @xtype menucheckitem
+ */
+Ext.menu.CheckItem = Ext.extend(Ext.menu.Item, {
+    /**
+     * @cfg {String} group
+     * All check items with the same group name will automatically be grouped into a single-select
+     * radio button group (defaults to '')
+     */
+    /**
+     * @cfg {String} itemCls The default CSS class to use for check items (defaults to "x-menu-item x-menu-check-item")
+     */
+    itemCls : "x-menu-item x-menu-check-item",
+    /**
+     * @cfg {String} groupClass The default CSS class to use for radio group check items (defaults to "x-menu-group-item")
+     */
+    groupClass : "x-menu-group-item",
+
+    /**
+     * @cfg {Boolean} checked True to initialize this checkbox as checked (defaults to false).  Note that
+     * if this checkbox is part of a radio group (group = true) only the first item in the group that is
+     * initialized with checked = true will be rendered as checked.
+     */
+    checked: false,
+
+    // private
+    ctype: "Ext.menu.CheckItem",
+    
+    initComponent : function(){
+        Ext.menu.CheckItem.superclass.initComponent.call(this);
+	    this.addEvents(
+	        /**
+	         * @event beforecheckchange
+	         * Fires before the checked value is set, providing an opportunity to cancel if needed
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The new checked value that will be set
+	         */
+	        "beforecheckchange" ,
+	        /**
+	         * @event checkchange
+	         * Fires after the checked value has been set
+	         * @param {Ext.menu.CheckItem} this
+	         * @param {Boolean} checked The checked value that was set
+	         */
+	        "checkchange"
+	    );
+	    /**
+	     * A function that handles the checkchange event.  The function is undefined by default, but if an implementation
+	     * is provided, it will be called automatically when the checkchange event fires.
+	     * @param {Ext.menu.CheckItem} this
+	     * @param {Boolean} checked The checked value that was set
+	     * @method checkHandler
+	     */
+	    if(this.checkHandler){
+	        this.on('checkchange', this.checkHandler, this.scope);
+	    }
+	    Ext.menu.MenuMgr.registerCheckable(this);
+    },
+
+    // private
+    onRender : function(c){
+        Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);
+        if(this.group){
+            this.el.addClass(this.groupClass);
+        }
+        if(this.checked){
+            this.checked = false;
+            this.setChecked(true, true);
+        }
+    },
+
+    // private
+    destroy : function(){
+        Ext.menu.MenuMgr.unregisterCheckable(this);
+        Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Set the checked state of this item
+     * @param {Boolean} checked The new checked value
+     * @param {Boolean} suppressEvent (optional) True to prevent the checkchange event from firing (defaults to false)
+     */
+    setChecked : function(state, suppressEvent){
+        var suppress = suppressEvent === true;
+        if(this.checked != state && (suppress || this.fireEvent("beforecheckchange", this, state) !== false)){
+            Ext.menu.MenuMgr.onCheckChange(this, state);
+            if(this.container){
+                this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");
+            }
+            this.checked = state;
+            if(!suppress){
+                this.fireEvent("checkchange", this, state);
+            }
+        }
+    },
+
+    // private
+    handleClick : function(e){
+       if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item
+           this.setChecked(!this.checked);
+       }
+       Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);
+    }
+});
+Ext.reg('menucheckitem', Ext.menu.CheckItem);/**
+ * @class Ext.menu.DateMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing an {@link Ext.DatePicker} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.DatePicker}</b>.</li>
+ * <li>If subclassing DateMenu, any configuration options for the DatePicker must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the DateMenu.
+ * Applying {@link Ext.DatePicker DatePicker} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the DatePicker's configuration.</li>
+ * </ul></div>
+ * @xtype datemenu
+ */
+ Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>picker</code> : DatePicker<div class="sub-desc">The Ext.DatePicker.</div></li>
+     * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this DateMenu instance.
+     */    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a date is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    /** 
+     * @cfg {String} pickerId
+     * An id to assign to the underlying date picker. Defaults to <tt>null</tt>.
+     */
+    pickerId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * The {@link Ext.DatePicker} instance for this DateMenu
+     * @property picker
+     * @type DatePicker
+     */
+    cls : 'x-date-menu',
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+
+    initComponent : function(){
+        this.on('beforeshow', this.onBeforeShow, this);
+        if(this.strict = (Ext.isIE7 && Ext.isStrict)){
+            this.on('show', this.onShow, this, {single: true, delay: 20});
+        }
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.picker = new Ext.DatePicker(Ext.applyIf({
+                internalRender: this.strict || !Ext.isIE,
+                ctCls: 'x-menu-date-item',
+                id: this.pickerId
+            }, this.initialConfig))
+        });
+        this.picker.purgeListeners();
+        Ext.menu.DateMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a date is selected from the {@link #picker Ext.DatePicker}
+         * @param {DatePicker} picker The {@link #picker Ext.DatePicker}
+         * @param {Date} date The selected date
+         */
+        this.relayEvents(this.picker, ['select']);
+        this.on('show', this.picker.focus, this.picker);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function() {
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    },
+
+    onBeforeShow : function(){
+        if(this.picker){
+            this.picker.hideMonthPicker(true);
+        }
+    },
+
+    onShow : function(){
+        var el = this.picker.getEl();
+        el.setWidth(el.getWidth()); //nasty hack for IE7 strict mode
+    }
+ });
+ Ext.reg('datemenu', Ext.menu.DateMenu);
+ /**
+ * @class Ext.menu.ColorMenu
+ * @extends Ext.menu.Menu
+ * <p>A menu containing a {@link Ext.ColorPalette} Component.</p>
+ * <p>Notes:</p><div class="mdetail-params"><ul>
+ * <li>Although not listed here, the <b>constructor</b> for this class
+ * accepts all of the configuration options of <b>{@link Ext.ColorPalette}</b>.</li>
+ * <li>If subclassing ColorMenu, any configuration options for the ColorPalette must be
+ * applied to the <tt><b>initialConfig</b></tt> property of the ColorMenu.
+ * Applying {@link Ext.ColorPalette ColorPalette} configuration settings to
+ * <b><tt>this</tt></b> will <b>not</b> affect the ColorPalette's configuration.</li>
+ * </ul></div> * 
+ * @xtype colormenu
+ */
+ Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, {
+    /** 
+     * @cfg {Boolean} enableScrolling
+     * @hide 
+     */
+    enableScrolling : false,
+    /**
+     * @cfg {Function} handler
+     * Optional. A function that will handle the select event of this menu.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li>
+     * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope
+     * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * function will be called.  Defaults to this ColorMenu instance.
+     */    
+    
+    /** 
+     * @cfg {Boolean} hideOnClick
+     * False to continue showing the menu after a color is selected, defaults to true.
+     */
+    hideOnClick : true,
+    
+    cls : 'x-color-menu',
+    
+    /** 
+     * @cfg {String} paletteId
+     * An id to assign to the underlying color palette. Defaults to <tt>null</tt>.
+     */
+    paletteId : null,
+    
+    /** 
+     * @cfg {Number} maxHeight
+     * @hide 
+     */
+    /** 
+     * @cfg {Number} scrollIncrement
+     * @hide 
+     */
+    /**
+     * @property palette
+     * @type ColorPalette
+     * The {@link Ext.ColorPalette} instance for this ColorMenu
+     */
+    
+    
+    /**
+     * @event click
+     * @hide
+     */
+    
+    /**
+     * @event itemclick
+     * @hide
+     */
+    
+    initComponent : function(){
+        Ext.apply(this, {
+            plain: true,
+            showSeparator: false,
+            items: this.palette = new Ext.ColorPalette(Ext.applyIf({
+                id: this.paletteId
+            }, this.initialConfig))
+        });
+        this.palette.purgeListeners();
+        Ext.menu.ColorMenu.superclass.initComponent.call(this);
+        /**
+         * @event select
+         * Fires when a color is selected from the {@link #palette Ext.ColorPalette}
+         * @param {Ext.ColorPalette} palette The {@link #palette Ext.ColorPalette}
+	     * @param {String} color The 6-digit color hex code (without the # symbol)
+         */
+        this.relayEvents(this.palette, ['select']);
+        this.on('select', this.menuHide, this);
+        if(this.handler){
+            this.on('select', this.handler, this.scope || this);
+        }
+    },
+
+    menuHide : function(){
+        if(this.hideOnClick){
+            this.hide(true);
+        }
+    }
+});
+Ext.reg('colormenu', Ext.menu.ColorMenu);
+/**
+ * @class Ext.form.Field
+ * @extends Ext.BoxComponent
+ * Base class for form fields that provides default event handling, sizing, value handling and other functionality.
+ * @constructor
+ * Creates a new Field
+ * @param {Object} config Configuration options
+ * @xtype field
+ */
+Ext.form.Field = Ext.extend(Ext.BoxComponent,  {
+    /**
+     * <p>The label Element associated with this Field. <b>Only available after this Field has been rendered by a
+     * {@link form Ext.layout.FormLayout} layout manager.</b></p>
+     * @type Ext.Element
+     * @property label
+     */
+    /**
+     * @cfg {String} inputType The type attribute for input fields -- e.g. radio, text, password, file (defaults
+     * to 'text'). The types 'file' and 'password' must be used to render those field types currently -- there are
+     * no separate Ext components for those. Note that if you use <tt>inputType:'file'</tt>, {@link #emptyText}
+     * is not supported and should be avoided.
+     */
+    /**
+     * @cfg {Number} tabIndex The tabIndex for this field. Note this only applies to fields that are rendered,
+     * not those which are built via applyTo (defaults to undefined).
+     */
+    /**
+     * @cfg {Mixed} value A value to initialize this field with (defaults to undefined).
+     */
+    /**
+     * @cfg {String} name The field's HTML name attribute (defaults to '').
+     * <b>Note</b>: this property must be set if this field is to be automatically included with
+     * {@link Ext.form.BasicForm#submit form submit()}.
+     */
+    /**
+     * @cfg {String} cls A custom CSS class to apply to the field's underlying element (defaults to '').
+     */
+
+    /**
+     * @cfg {String} invalidClass The CSS class to use when marking a field invalid (defaults to 'x-form-invalid')
+     */
+    invalidClass : 'x-form-invalid',
+    /**
+     * @cfg {String} invalidText The error text to use when marking a field invalid and no message is provided
+     * (defaults to 'The value in this field is invalid')
+     */
+    invalidText : 'The value in this field is invalid',
+    /**
+     * @cfg {String} focusClass The CSS class to use when the field receives focus (defaults to 'x-form-focus')
+     */
+    focusClass : 'x-form-focus',
+    /**
+     * @cfg {Boolean} preventMark
+     * <tt>true</tt> to disable {@link #markInvalid marking the field invalid}.
+     * Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {String/Boolean} validationEvent The event that should initiate field validation. Set to false to disable
+      automatic validation (defaults to 'keyup').
+     */
+    validationEvent : 'keyup',
+    /**
+     * @cfg {Boolean} validateOnBlur Whether the field should validate when it loses focus (defaults to true).
+     */
+    validateOnBlur : true,
+    /**
+     * @cfg {Number} validationDelay The length of time in milliseconds after user input begins until validation
+     * is initiated (defaults to 250)
+     */
+    validationDelay : 250,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: 'input', type: 'text', size: '20', autocomplete: 'off'}</code></pre>
+     */
+    defaultAutoCreate : {tag: 'input', type: 'text', size: '20', autocomplete: 'off'},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {String} msgTarget <p>The location where the message text set through {@link #markInvalid} should display.
+     * Must be one of the following values:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>qtip</code> Display a quick tip containing the message when the user hovers over the field. This is the default.
+     * <div class="subdesc"><b>{@link Ext.QuickTips#init Ext.QuickTips.init} must have been called for this setting to work.</b></div</li>
+     * <li><code>title</code> Display the message in a default browser title attribute popup.</li>
+     * <li><code>under</code> Add a block div beneath the field containing the error message.</li>
+     * <li><code>side</code> Add an error icon to the right of the field, displaying the message in a popup on hover.</li>
+     * <li><code>[element id]</code> Add the error message directly to the innerHTML of the specified element.</li>
+     * </ul></div>
+     */
+    msgTarget : 'qtip',
+    /**
+     * @cfg {String} msgFx <b>Experimental</b> The effect used when displaying a validation message under the field
+     * (defaults to 'normal').
+     */
+    msgFx : 'normal',
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to mark the field as readOnly in HTML
+     * (defaults to <tt>false</tt>).
+     * <br><p><b>Note</b>: this only sets the element's readOnly DOM attribute.
+     * Setting <code>readOnly=true</code>, for example, will not disable triggering a
+     * ComboBox or DateField; it gives you the option of forcing the user to choose
+     * via the trigger without typing in the text box. To hide the trigger use
+     * <code>{@link Ext.form.TriggerField#hideTrigger hideTrigger}</code>.</p>
+     */
+    readOnly : false,
+    /**
+     * @cfg {Boolean} disabled True to disable the field (defaults to false).
+     * <p>Be aware that conformant with the <a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.12.1">HTML specification</a>,
+     * disabled Fields will not be {@link Ext.form.BasicForm#submit submitted}.</p>
+     */
+    disabled : false,
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * Defaults to <tt>true</tt>.
+     */
+    submitValue: true,
+
+    // private
+    isFormField : true,
+
+    // private
+    msgDisplay: '',
+
+    // private
+    hasFocus : false,
+
+    // private
+    initComponent : function(){
+        Ext.form.Field.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event focus
+             * Fires when this field receives input focus.
+             * @param {Ext.form.Field} this
+             */
+            'focus',
+            /**
+             * @event blur
+             * Fires when this field loses input focus.
+             * @param {Ext.form.Field} this
+             */
+            'blur',
+            /**
+             * @event specialkey
+             * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.
+             * To handle other keys see {@link Ext.Panel#keys} or {@link Ext.KeyMap}.
+             * You can check {@link Ext.EventObject#getKey} to determine which key was pressed.
+             * For example: <pre><code>
+var form = new Ext.form.FormPanel({
+    ...
+    items: [{
+            fieldLabel: 'Field 1',
+            name: 'field1',
+            allowBlank: false
+        },{
+            fieldLabel: 'Field 2',
+            name: 'field2',
+            listeners: {
+                specialkey: function(field, e){
+                    // e.HOME, e.END, e.PAGE_UP, e.PAGE_DOWN,
+                    // e.TAB, e.ESC, arrow keys: e.LEFT, e.RIGHT, e.UP, e.DOWN
+                    if (e.{@link Ext.EventObject#getKey getKey()} == e.ENTER) {
+                        var form = field.ownerCt.getForm();
+                        form.submit();
+                    }
+                }
+            }
+        }
+    ],
+    ...
+});
+             * </code></pre>
+             * @param {Ext.form.Field} this
+             * @param {Ext.EventObject} e The event object
+             */
+            'specialkey',
+            /**
+             * @event change
+             * Fires just before the field blurs if the field value has changed.
+             * @param {Ext.form.Field} this
+             * @param {Mixed} newValue The new value
+             * @param {Mixed} oldValue The original value
+             */
+            'change',
+            /**
+             * @event invalid
+             * Fires after the field has been marked as invalid.
+             * @param {Ext.form.Field} this
+             * @param {String} msg The validation message
+             */
+            'invalid',
+            /**
+             * @event valid
+             * Fires after the field has been validated with no errors.
+             * @param {Ext.form.Field} this
+             */
+            'valid'
+        );
+    },
+
+    /**
+     * Returns the {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     * attribute of the field if available.
+     * @return {String} name The field {@link Ext.form.Field#name name} or {@link Ext.form.ComboBox#hiddenName hiddenName}
+     */
+    getName : function(){
+        return this.rendered && this.el.dom.name ? this.el.dom.name : this.name || this.id || '';
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var cfg = this.getAutoCreate();
+
+            if(!cfg.name){
+                cfg.name = this.name || this.id;
+            }
+            if(this.inputType){
+                cfg.type = this.inputType;
+            }
+            this.autoEl = cfg;
+        }
+        Ext.form.Field.superclass.onRender.call(this, ct, position);
+        if(this.submitValue === false){
+            this.el.dom.removeAttribute('name');
+        }
+        var type = this.el.dom.type;
+        if(type){
+            if(type == 'password'){
+                type = 'text';
+            }
+            this.el.addClass('x-form-'+type);
+        }
+        if(this.readOnly){
+            this.setReadOnly(true);
+        }
+        if(this.tabIndex !== undefined){
+            this.el.dom.setAttribute('tabIndex', this.tabIndex);
+        }
+
+        this.el.addClass([this.fieldClass, this.cls]);
+    },
+
+    // private
+    getItemCt : function(){
+        return this.itemCt;
+    },
+
+    // private
+    initValue : function(){
+        if(this.value !== undefined){
+            this.setValue(this.value);
+        }else if(!Ext.isEmpty(this.el.dom.value) && this.el.dom.value != this.emptyText){
+            this.setValue(this.el.dom.value);
+        }
+        /**
+         * The original value of the field as configured in the {@link #value} configuration, or
+         * as loaded by the last form load operation if the form's {@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+         * setting is <code>true</code>.
+         * @type mixed
+         * @property originalValue
+         */
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * <p>Returns true if the value of this Field has been changed from its original value.
+     * Will return false if the field is disabled or has not been rendered yet.</p>
+     * <p>Note that if the owning {@link Ext.form.BasicForm form} was configured with
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     * then the <i>original value</i> is updated when the values are loaded by
+     * {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#setValues setValues}.</p>
+     * @return {Boolean} True if this field has been changed from its original value (and
+     * is not disabled), false otherwise.
+     */
+    isDirty : function() {
+        if(this.disabled || !this.rendered) {
+            return false;
+        }
+        return String(this.getValue()) !== String(this.originalValue);
+    },
+
+    /**
+     * Sets the read only state of this field.
+     * @param {Boolean} readOnly Whether the field should be read only.
+     */
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.el.dom.readOnly = readOnly;
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.form.Field.superclass.afterRender.call(this);
+        this.initEvents();
+        this.initValue();
+    },
+
+    // private
+    fireKey : function(e){
+        if(e.isSpecialKey()){
+            this.fireEvent('specialkey', this, e);
+        }
+    },
+
+    /**
+     * Resets the current field value to the originally loaded value and clears any validation messages.
+     * See {@link Ext.form.BasicForm}.{@link Ext.form.BasicForm#trackResetOnLoad trackResetOnLoad}
+     */
+    reset : function(){
+        this.setValue(this.originalValue);
+        this.clearInvalid();
+    },
+
+    // private
+    initEvents : function(){
+        this.mon(this.el, Ext.EventManager.getKeyEvent(), this.fireKey,  this);
+        this.mon(this.el, 'focus', this.onFocus, this);
+
+        // standardise buffer across all browsers + OS-es for consistent event order.
+        // (the 10ms buffer for Editors fixes a weird FF/Win editor issue when changing OS window focus)
+        this.mon(this.el, 'blur', this.onBlur, this, this.inEditor ? {buffer:10} : null);
+    },
+
+    // private
+    preFocus: Ext.emptyFn,
+
+    // private
+    onFocus : function(){
+        this.preFocus();
+        if(this.focusClass){
+            this.el.addClass(this.focusClass);
+        }
+        if(!this.hasFocus){
+            this.hasFocus = true;
+            /**
+             * <p>The value that the Field had at the time it was last focused. This is the value that is passed
+             * to the {@link #change} event which is fired if the value has been changed when the Field is blurred.</p>
+             * <p><b>This will be undefined until the Field has been visited.</b> Compare {@link #originalValue}.</p>
+             * @type mixed
+             * @property startValue
+             */
+            this.startValue = this.getValue();
+            this.fireEvent('focus', this);
+        }
+    },
+
+    // private
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    onBlur : function(){
+        this.beforeBlur();
+        if(this.focusClass){
+            this.el.removeClass(this.focusClass);
+        }
+        this.hasFocus = false;
+        if(this.validationEvent !== false && (this.validateOnBlur || this.validationEvent == 'blur')){
+            this.validate();
+        }
+        var v = this.getValue();
+        if(String(v) !== String(this.startValue)){
+            this.fireEvent('change', this, v, this.startValue);
+        }
+        this.fireEvent('blur', this);
+        this.postBlur();
+    },
+
+    // private
+    postBlur : Ext.emptyFn,
+
+    /**
+     * Returns whether or not the field value is currently valid by
+     * {@link #validateValue validating} the {@link #processValue processed value}
+     * of the field. <b>Note</b>: {@link #disabled} fields are ignored.
+     * @param {Boolean} preventMark True to disable marking the field invalid
+     * @return {Boolean} True if the value is valid, else false
+     */
+    isValid : function(preventMark){
+        if(this.disabled){
+            return true;
+        }
+        var restore = this.preventMark;
+        this.preventMark = preventMark === true;
+        var v = this.validateValue(this.processValue(this.getRawValue()), preventMark);
+        this.preventMark = restore;
+        return v;
+    },
+
+    /**
+     * Validates the field value
+     * @return {Boolean} True if the value is valid, else false
+     */
+    validate : function(){
+        if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){
+            this.clearInvalid();
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * This method should only be overridden if necessary to prepare raw values
+     * for validation (see {@link #validate} and {@link #isValid}).  This method
+     * is expected to return the processed value for the field which will
+     * be used for validation (see validateValue method).
+     * @param {Mixed} value
+     */
+    processValue : function(value){
+        return value;
+    },
+
+    /**
+     * Uses getErrors to build an array of validation errors. If any errors are found, markInvalid is called
+     * with the first and false is returned, otherwise true is returned. Previously, subclasses were invited
+     * to provide an implementation of this to process validations - from 3.2 onwards getErrors should be
+     * overridden instead.
+     * @param {Mixed} The current value of the field
+     * @return {Boolean} True if all validations passed, false if one or more failed
+     */
+     validateValue : function(value) {
+         //currently, we only show 1 error at a time for a field, so just use the first one
+         var error = this.getErrors(value)[0];
+
+         if (error == undefined) {
+             return true;
+         } else {
+             this.markInvalid(error);
+             return false;
+         }
+     },
+    
+    /**
+     * Runs this field's validators and returns an array of error messages for any validation failures.
+     * This is called internally during validation and would not usually need to be used manually.
+     * Each subclass should override or augment the return value to provide their own errors
+     * @return {Array} All error messages for this field
+     */
+    getErrors: function() {
+        return [];
+    },
+
+    /**
+     * Gets the active error message for this field.
+     * @return {String} Returns the active error message on the field, if there is no error, an empty string is returned.
+     */
+    getActiveError : function(){
+        return this.activeError || '';
+    },
+
+    /**
+     * <p>Display an error message associated with this field, using {@link #msgTarget} to determine how to
+     * display the message and applying {@link #invalidClass} to the field's UI element.</p>
+     * <p><b>Note</b>: this method does not cause the Field's {@link #validate} method to return <code>false</code>
+     * if the value does <i>pass</i> validation. So simply marking a Field as invalid will not prevent
+     * submission of forms submitted with the {@link Ext.form.Action.Submit#clientValidation} option set.</p>
+     * {@link #isValid invalid}.
+     * @param {String} msg (optional) The validation message (defaults to {@link #invalidText})
+     */
+    markInvalid : function(msg){
+        //don't set the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            msg = msg || this.invalidText;
+
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.mark(this, msg);
+            }else if(this.msgTarget){
+                this.el.addClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = msg;
+                    t.style.display = this.msgDisplay;
+                }
+            }
+        }
+        
+        this.setActiveError(msg);
+    },
+    
+    /**
+     * Clear any invalid styles/messages for this field
+     */
+    clearInvalid : function(){
+        //don't remove the error icon if we're not rendered or marking is prevented
+        if (this.rendered && !this.preventMark) {
+            this.el.removeClass(this.invalidClass);
+            var mt = this.getMessageHandler();
+            if(mt){
+                mt.clear(this);
+            }else if(this.msgTarget){
+                this.el.removeClass(this.invalidClass);
+                var t = Ext.getDom(this.msgTarget);
+                if(t){
+                    t.innerHTML = '';
+                    t.style.display = 'none';
+                }
+            }
+        }
+        
+        this.unsetActiveError();
+    },
+
+    /**
+     * Sets the current activeError to the given string. Fires the 'invalid' event.
+     * This does not set up the error icon, only sets the message and fires the event. To show the error icon,
+     * use markInvalid instead, which calls this method internally
+     * @param {String} msg The error message
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    setActiveError: function(msg, suppressEvent) {
+        this.activeError = msg;
+        if (suppressEvent !== true) this.fireEvent('invalid', this, msg);
+    },
+    
+    /**
+     * Clears the activeError and fires the 'valid' event. This is called internally by clearInvalid and would not
+     * usually need to be called manually
+     * @param {Boolean} suppressEvent True to suppress the 'invalid' event from being fired
+     */
+    unsetActiveError: function(suppressEvent) {
+        delete this.activeError;
+        if (suppressEvent !== true) this.fireEvent('valid', this);
+    },
+
+    // private
+    getMessageHandler : function(){
+        return Ext.form.MessageTargets[this.msgTarget];
+    },
+
+    // private
+    getErrorCt : function(){
+        return this.el.findParent('.x-form-element', 5, true) || // use form element wrap if available
+            this.el.findParent('.x-form-field-wrap', 5, true);   // else direct field wrap
+    },
+
+    // Alignment for 'under' target
+    alignErrorEl : function(){
+        this.errorEl.setWidth(this.getErrorCt().getWidth(true) - 20);
+    },
+
+    // Alignment for 'side' target
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.el, 'tl-tr', [2, 0]);
+    },
+
+    /**
+     * Returns the raw data value which may or may not be a valid, defined value.  To return a normalized value see {@link #getValue}.
+     * @return {Mixed} value The field value
+     */
+    getRawValue : function(){
+        var v = this.rendered ? this.el.getValue() : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
+     * @return {Mixed} value The field value
+     */
+    getValue : function(){
+        if(!this.rendered) {
+            return this.value;
+        }
+        var v = this.el.getValue();
+        if(v === this.emptyText || v === undefined){
+            v = '';
+        }
+        return v;
+    },
+
+    /**
+     * Sets the underlying DOM field's value directly, bypassing validation.  To set the value with validation see {@link #setValue}.
+     * @param {Mixed} value The value to set
+     * @return {Mixed} value The field value that is set
+     */
+    setRawValue : function(v){
+        return this.rendered ? (this.el.dom.value = (Ext.isEmpty(v) ? '' : v)) : '';
+    },
+
+    /**
+     * Sets a data value into the field and validates it.  To set the value directly without validation see {@link #setRawValue}.
+     * @param {Mixed} value The value to set
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        this.value = v;
+        if(this.rendered){
+            this.el.dom.value = (Ext.isEmpty(v) ? '' : v);
+            this.validate();
+        }
+        return this;
+    },
+
+    // private, does not work for all fields
+    append : function(v){
+         this.setValue([this.getValue(), v].join(''));
+    }
+
+    /**
+     * @cfg {Boolean} autoWidth @hide
+     */
+    /**
+     * @cfg {Boolean} autoHeight @hide
+     */
+
+    /**
+     * @cfg {String} autoEl @hide
+     */
+});
+
+
+Ext.form.MessageTargets = {
+    'qtip' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.qtip = msg;
+            field.el.dom.qclass = 'x-form-invalid-tip';
+            if(Ext.QuickTips){ // fix for floating editors interacting with DND
+                Ext.QuickTips.enable();
+            }
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            field.el.dom.qtip = '';
+        }
+    },
+    'title' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            field.el.dom.title = msg;
+        },
+        clear: function(field){
+            field.el.dom.title = '';
+        }
+    },
+    'under' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorEl){
+                var elp = field.getErrorCt();
+                if(!elp){ // field has no container el
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorEl = elp.createChild({cls:'x-form-invalid-msg'});
+                field.on('resize', field.alignErrorEl, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorEl);
+                }, field);
+            }
+            field.alignErrorEl();
+            field.errorEl.update(msg);
+            Ext.form.Field.msgFx[field.msgFx].show(field.errorEl, field);
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorEl){
+                Ext.form.Field.msgFx[field.msgFx].hide(field.errorEl, field);
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    },
+    'side' : {
+        mark: function(field, msg){
+            field.el.addClass(field.invalidClass);
+            if(!field.errorIcon){
+                var elp = field.getErrorCt();
+                // field has no container el
+                if(!elp){
+                    field.el.dom.title = msg;
+                    return;
+                }
+                field.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});
+                if (field.ownerCt) {
+                    field.ownerCt.on('afterlayout', field.alignErrorIcon, field);
+                    field.ownerCt.on('expand', field.alignErrorIcon, field);
+                }
+                field.on('resize', field.alignErrorIcon, field);
+                field.on('destroy', function(){
+                    Ext.destroy(this.errorIcon);
+                }, field);
+            }
+            field.alignErrorIcon();
+            field.errorIcon.dom.qtip = msg;
+            field.errorIcon.dom.qclass = 'x-form-invalid-tip';
+            field.errorIcon.show();
+        },
+        clear: function(field){
+            field.el.removeClass(field.invalidClass);
+            if(field.errorIcon){
+                field.errorIcon.dom.qtip = '';
+                field.errorIcon.hide();
+            }else{
+                field.el.dom.title = '';
+            }
+        }
+    }
+};
+
+// anything other than normal should be considered experimental
+Ext.form.Field.msgFx = {
+    normal : {
+        show: function(msgEl, f){
+            msgEl.setDisplayed('block');
+        },
+
+        hide : function(msgEl, f){
+            msgEl.setDisplayed(false).update('');
+        }
+    },
+
+    slide : {
+        show: function(msgEl, f){
+            msgEl.slideIn('t', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('t', {stopFx:true,useDisplay:true});
+        }
+    },
+
+    slideRight : {
+        show: function(msgEl, f){
+            msgEl.fixDisplay();
+            msgEl.alignTo(f.el, 'tl-tr');
+            msgEl.slideIn('l', {stopFx:true});
+        },
+
+        hide : function(msgEl, f){
+            msgEl.slideOut('l', {stopFx:true,useDisplay:true});
+        }
+    }
+};
+Ext.reg('field', Ext.form.Field);
+/**
+ * @class Ext.form.TextField
+ * @extends Ext.form.Field
+ * <p>Basic text field.  Can be used as a direct replacement for traditional text inputs,
+ * or as the base class for more sophisticated input controls (like {@link Ext.form.TextArea}
+ * and {@link Ext.form.ComboBox}).</p>
+ * <p><b><u>Validation</u></b></p>
+ * <p>The validation procedure is described in the documentation for {@link #validateValue}.</p>
+ * <p><b><u>Alter Validation Behavior</u></b></p>
+ * <p>Validation behavior for each field can be configured:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.form.TextField#invalidText invalidText}</code> : the default validation message to
+ * show if any validation step above does not provide a message when invalid</li>
+ * <li><code>{@link Ext.form.TextField#maskRe maskRe}</code> : filter out keystrokes before any validation occurs</li>
+ * <li><code>{@link Ext.form.TextField#stripCharsRe stripCharsRe}</code> : filter characters after being typed in,
+ * but before being validated</li>
+ * <li><code>{@link Ext.form.Field#invalidClass invalidClass}</code> : alternate style when invalid</li>
+ * <li><code>{@link Ext.form.Field#validateOnBlur validateOnBlur}</code>,
+ * <code>{@link Ext.form.Field#validationDelay validationDelay}</code>, and
+ * <code>{@link Ext.form.Field#validationEvent validationEvent}</code> : modify how/when validation is triggered</li>
+ * </ul></div>
+ * 
+ * @constructor Creates a new TextField
+ * @param {Object} config Configuration options
+ * 
+ * @xtype textfield
+ */
+Ext.form.TextField = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} vtypeText A custom error message to display in place of the default message provided
+     * for the <b><code>{@link #vtype}</code></b> currently set for this field (defaults to <tt>''</tt>).  <b>Note</b>:
+     * only applies if <b><code>{@link #vtype}</code></b> is set, else ignored.
+     */
+    /**
+     * @cfg {RegExp} stripCharsRe A JavaScript RegExp object used to strip unwanted content from the value
+     * before validation (defaults to <tt>null</tt>).
+     */
+    /**
+     * @cfg {Boolean} grow <tt>true</tt> if this field should automatically grow and shrink to its content
+     * (defaults to <tt>false</tt>)
+     */
+    grow : false,
+    /**
+     * @cfg {Number} growMin The minimum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>30</tt>)
+     */
+    growMin : 30,
+    /**
+     * @cfg {Number} growMax The maximum width to allow when <code><b>{@link #grow}</b> = true</code> (defaults
+     * to <tt>800</tt>)
+     */
+    growMax : 800,
+    /**
+     * @cfg {String} vtype A validation type name as defined in {@link Ext.form.VTypes} (defaults to <tt>null</tt>)
+     */
+    vtype : null,
+    /**
+     * @cfg {RegExp} maskRe An input mask regular expression that will be used to filter keystrokes that do
+     * not match (defaults to <tt>null</tt>). The maskRe will not operate on any paste events.
+     */
+    maskRe : null,
+    /**
+     * @cfg {Boolean} disableKeyFilter Specify <tt>true</tt> to disable input keystroke filtering (defaults
+     * to <tt>false</tt>)
+     */
+    disableKeyFilter : false,
+    /**
+     * @cfg {Boolean} allowBlank Specify <tt>false</tt> to validate that the value's length is > 0 (defaults to
+     * <tt>true</tt>)
+     */
+    allowBlank : true,
+    /**
+     * @cfg {Number} minLength Minimum input field length required (defaults to <tt>0</tt>)
+     */
+    minLength : 0,
+    /**
+     * @cfg {Number} maxLength Maximum input field length allowed by validation (defaults to Number.MAX_VALUE).
+     * This behavior is intended to provide instant feedback to the user by improving usability to allow pasting
+     * and editing or overtyping and back tracking. To restrict the maximum number of characters that can be
+     * entered into the field use <tt><b>{@link Ext.form.Field#autoCreate autoCreate}</b></tt> to add
+     * any attributes you want to a field, for example:<pre><code>
+var myField = new Ext.form.NumberField({
+    id: 'mobile',
+    anchor:'90%',
+    fieldLabel: 'Mobile',
+    maxLength: 16, // for validation
+    autoCreate: {tag: 'input', type: 'text', size: '20', autocomplete: 'off', maxlength: '10'}
+});
+</code></pre>
+     */
+    maxLength : Number.MAX_VALUE,
+    /**
+     * @cfg {String} minLengthText Error text to display if the <b><tt>{@link #minLength minimum length}</tt></b>
+     * validation fails (defaults to <tt>'The minimum length for this field is {minLength}'</tt>)
+     */
+    minLengthText : 'The minimum length for this field is {0}',
+    /**
+     * @cfg {String} maxLengthText Error text to display if the <b><tt>{@link #maxLength maximum length}</tt></b>
+     * validation fails (defaults to <tt>'The maximum length for this field is {maxLength}'</tt>)
+     */
+    maxLengthText : 'The maximum length for this field is {0}',
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to automatically select any existing field text when the field
+     * receives input focus (defaults to <tt>false</tt>)
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} blankText The error text to display if the <b><tt>{@link #allowBlank}</tt></b> validation
+     * fails (defaults to <tt>'This field is required'</tt>)
+     */
+    blankText : 'This field is required',
+    /**
+     * @cfg {Function} validator
+     * <p>A custom validation function to be called during field validation ({@link #validateValue})
+     * (defaults to <tt>null</tt>). If specified, this function will be called first, allowing the
+     * developer to override the default validation process.</p>
+     * <br><p>This function will be passed the following Parameters:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>value</code>: <i>Mixed</i>
+     * <div class="sub-desc">The current field value</div></li>
+     * </ul></div>
+     * <br><p>This function is to Return:</p>
+     * <div class="mdetail-params"><ul>
+     * <li><code>true</code>: <i>Boolean</i>
+     * <div class="sub-desc"><code>true</code> if the value is valid</div></li>
+     * <li><code>msg</code>: <i>String</i>
+     * <div class="sub-desc">An error message if the value is invalid</div></li>
+     * </ul></div>
+     */
+    validator : null,
+    /**
+     * @cfg {RegExp} regex A JavaScript RegExp object to be tested against the field value during validation
+     * (defaults to <tt>null</tt>). If the test fails, the field will be marked invalid using
+     * <b><tt>{@link #regexText}</tt></b>.
+     */
+    regex : null,
+    /**
+     * @cfg {String} regexText The error text to display if <b><tt>{@link #regex}</tt></b> is used and the
+     * test fails during validation (defaults to <tt>''</tt>)
+     */
+    regexText : '',
+    /**
+     * @cfg {String} emptyText The default text to place into an empty field (defaults to <tt>null</tt>).
+     * <b>Note</b>: that this value will be submitted to the server if this field is enabled and configured
+     * with a {@link #name}.
+     */
+    emptyText : null,
+    /**
+     * @cfg {String} emptyClass The CSS class to apply to an empty field to style the <b><tt>{@link #emptyText}</tt></b>
+     * (defaults to <tt>'x-form-empty-field'</tt>).  This class is automatically added and removed as needed
+     * depending on the current field value.
+     */
+    emptyClass : 'x-form-empty-field',
+
+    /**
+     * @cfg {Boolean} enableKeyEvents <tt>true</tt> to enable the proxying of key events for the HTML input
+     * field (defaults to <tt>false</tt>)
+     */
+
+    initComponent : function(){
+        Ext.form.TextField.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event autosize
+             * Fires when the <tt><b>{@link #autoSize}</b></tt> function is triggered. The field may or
+             * may not have actually changed size according to the default logic, but this event provides
+             * a hook for the developer to apply additional logic at runtime to resize the field if needed.
+             * @param {Ext.form.Field} this This text field
+             * @param {Number} width The new field width
+             */
+            'autosize',
+
+            /**
+             * @event keydown
+             * Keydown input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+            /**
+             * @event keyup
+             * Keyup input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keyup',
+            /**
+             * @event keypress
+             * Keypress input field event. This event only fires if <tt><b>{@link #enableKeyEvents}</b></tt>
+             * is set to true.
+             * @param {Ext.form.TextField} this This text field
+             * @param {Ext.EventObject} e
+             */
+            'keypress'
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.TextField.superclass.initEvents.call(this);
+        if(this.validationEvent == 'keyup'){
+            this.validationTask = new Ext.util.DelayedTask(this.validate, this);
+            this.mon(this.el, 'keyup', this.filterValidation, this);
+        }
+        else if(this.validationEvent !== false && this.validationEvent != 'blur'){
+        	this.mon(this.el, this.validationEvent, this.validate, this, {buffer: this.validationDelay});
+        }
+        if(this.selectOnFocus || this.emptyText){            
+            this.mon(this.el, 'mousedown', this.onMouseDown, this);
+            
+            if(this.emptyText){
+                this.applyEmptyText();
+            }
+        }
+        if(this.maskRe || (this.vtype && this.disableKeyFilter !== true && (this.maskRe = Ext.form.VTypes[this.vtype+'Mask']))){
+        	this.mon(this.el, 'keypress', this.filterKeys, this);
+        }
+        if(this.grow){
+        	this.mon(this.el, 'keyup', this.onKeyUpBuffered, this, {buffer: 50});
+			this.mon(this.el, 'click', this.autoSize, this);
+        }
+        if(this.enableKeyEvents){
+            this.mon(this.el, {
+                scope: this,
+                keyup: this.onKeyUp,
+                keydown: this.onKeyDown,
+                keypress: this.onKeyPress
+            });
+        }
+    },
+    
+    onMouseDown: function(e){
+        if(!this.hasFocus){
+            this.mon(this.el, 'mouseup', Ext.emptyFn, this, { single: true, preventDefault: true });
+        }
+    },
+
+    processValue : function(value){
+        if(this.stripCharsRe){
+            var newValue = value.replace(this.stripCharsRe, '');
+            if(newValue !== value){
+                this.setRawValue(newValue);
+                return newValue;
+            }
+        }
+        return value;
+    },
+
+    filterValidation : function(e){
+        if(!e.isNavKeyPress()){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+    
+    //private
+    onDisable: function(){
+        Ext.form.TextField.superclass.onDisable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = 'on';
+        }
+    },
+    
+    //private
+    onEnable: function(){
+        Ext.form.TextField.superclass.onEnable.call(this);
+        if(Ext.isIE){
+            this.el.dom.unselectable = '';
+        }
+    },
+
+    // private
+    onKeyUpBuffered : function(e){
+        if(this.doAutoSize(e)){
+            this.autoSize();
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress();
+    },
+
+    // private
+    onKeyUp : function(e){
+        this.fireEvent('keyup', this, e);
+    },
+
+    // private
+    onKeyDown : function(e){
+        this.fireEvent('keydown', this, e);
+    },
+
+    // private
+    onKeyPress : function(e){
+        this.fireEvent('keypress', this, e);
+    },
+
+    /**
+     * Resets the current field value to the originally-loaded value and clears any validation messages.
+     * Also adds <tt><b>{@link #emptyText}</b></tt> and <tt><b>{@link #emptyClass}</b></tt> if the
+     * original value was blank.
+     */
+    reset : function(){
+        Ext.form.TextField.superclass.reset.call(this);
+        this.applyEmptyText();
+    },
+
+    applyEmptyText : function(){
+        if(this.rendered && this.emptyText && this.getRawValue().length < 1 && !this.hasFocus){
+            this.setRawValue(this.emptyText);
+            this.el.addClass(this.emptyClass);
+        }
+    },
+
+    // private
+    preFocus : function(){
+        var el = this.el,
+            isEmpty;
+        if(this.emptyText){
+            if(el.dom.value == this.emptyText){
+                this.setRawValue('');
+                isEmpty = true;
+            }
+            el.removeClass(this.emptyClass);
+        }
+        if(this.selectOnFocus || isEmpty){
+            el.dom.select();
+        }
+    },
+
+    // private
+    postBlur : function(){
+        this.applyEmptyText();
+    },
+
+    // private
+    filterKeys : function(e){
+        if(e.ctrlKey){
+            return;
+        }
+        var k = e.getKey();
+        if(Ext.isGecko && (e.isNavKeyPress() || k == e.BACKSPACE || (k == e.DELETE && e.button == -1))){
+            return;
+        }
+        var cc = String.fromCharCode(e.getCharCode());
+        if(!Ext.isGecko && e.isSpecialKey() && !cc){
+            return;
+        }
+        if(!this.maskRe.test(cc)){
+            e.stopEvent();
+        }
+    },
+
+    setValue : function(v){
+        if(this.emptyText && this.el && !Ext.isEmpty(v)){
+            this.el.removeClass(this.emptyClass);
+        }
+        Ext.form.TextField.superclass.setValue.apply(this, arguments);
+        this.applyEmptyText();
+        this.autoSize();
+        return this;
+    },
+
+    /**
+     * <p>Validates a value according to the field's validation rules and returns an array of errors
+     * for any failing validations. Validation rules are processed in the following order:</p>
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><b>1. Field specific validator</b>
+     * <div class="sub-desc">
+     * <p>A validator offers a way to customize and reuse a validation specification.
+     * If a field is configured with a <code>{@link #validator}</code>
+     * function, it will be passed the current field value.  The <code>{@link #validator}</code>
+     * function is expected to return either:
+     * <div class="mdetail-params"><ul>
+     * <li>Boolean <tt>true</tt> if the value is valid (validation continues).</li>
+     * <li>a String to represent the invalid message if invalid (validation halts).</li>
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>2. Basic Validation</b>
+     * <div class="sub-desc">
+     * <p>If the <code>{@link #validator}</code> has not halted validation,
+     * basic validation proceeds as follows:</p>
+     * 
+     * <div class="mdetail-params"><ul>
+     * 
+     * <li><code>{@link #allowBlank}</code> : (Invalid message =
+     * <code>{@link #emptyText}</code>)<div class="sub-desc">
+     * Depending on the configuration of <code>{@link #allowBlank}</code>, a
+     * blank field will cause validation to halt at this step and return
+     * Boolean true or false accordingly.  
+     * </div></li>
+     * 
+     * <li><code>{@link #minLength}</code> : (Invalid message =
+     * <code>{@link #minLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #minLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * <li><code>{@link #maxLength}</code> : (Invalid message =
+     * <code>{@link #maxLengthText}</code>)<div class="sub-desc">
+     * If the passed value does not satisfy the <code>{@link #maxLength}</code>
+     * specified, validation halts.
+     * </div></li>
+     * 
+     * </ul></div>
+     * </div></li>
+     * 
+     * <li><b>3. Preconfigured Validation Types (VTypes)</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field
+     * configured with a <code>{@link #vtype}</code> will utilize the
+     * corresponding {@link Ext.form.VTypes VTypes} validation function.
+     * If invalid, either the field's <code>{@link #vtypeText}</code> or
+     * the VTypes vtype Text property will be used for the invalid message.
+     * Keystrokes on the field will be filtered according to the VTypes
+     * vtype Mask property.</p>
+     * </div></li>
+     * 
+     * <li><b>4. Field specific regex test</b>
+     * <div class="sub-desc">
+     * <p>If none of the prior validation steps halts validation, a field's
+     * configured <code>{@link #regex}</code> test will be processed.
+     * The invalid message for this test is configured with
+     * <code>{@link #regexText}</code>.</p>
+     * </div></li>
+     * 
+     * @param {Mixed} value The value to validate. The processed raw value will be used if nothing is passed
+     * @return {Array} Array of any validation errors
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.TextField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());        
+        
+        if (Ext.isFunction(this.validator)) {
+            var msg = this.validator(value);
+            if (msg !== true) {
+                errors.push(msg);
+            }
+        }
+        
+        if (value.length < 1 || value === this.emptyText) {
+            if (this.allowBlank) {
+                //if value is blank and allowBlank is true, there cannot be any additional errors
+                return errors;
+            } else {
+                errors.push(this.blankText);
+            }
+        }
+        
+        if (!this.allowBlank && (value.length < 1 || value === this.emptyText)) { // if it's blank
+            errors.push(this.blankText);
+        }
+        
+        if (value.length < this.minLength) {
+            errors.push(String.format(this.minLengthText, this.minLength));
+        }
+        
+        if (value.length > this.maxLength) {
+            errors.push(String.format(this.maxLengthText, this.maxLength));
+        }
+        
+        if (this.vtype) {
+            var vt = Ext.form.VTypes;
+            if(!vt[this.vtype](value, this)){
+                errors.push(this.vtypeText || vt[this.vtype +'Text']);
+            }
+        }
+        
+        if (this.regex && !this.regex.test(value)) {
+            errors.push(this.regexText);
+        }
+        
+        return errors;
+    },
+
+    /**
+     * Selects text in this field
+     * @param {Number} start (optional) The index where the selection should start (defaults to 0)
+     * @param {Number} end (optional) The index where the selection should end (defaults to the text length)
+     */
+    selectText : function(start, end){
+        var v = this.getRawValue();
+        var doFocus = false;
+        if(v.length > 0){
+            start = start === undefined ? 0 : start;
+            end = end === undefined ? v.length : end;
+            var d = this.el.dom;
+            if(d.setSelectionRange){
+                d.setSelectionRange(start, end);
+            }else if(d.createTextRange){
+                var range = d.createTextRange();
+                range.moveStart('character', start);
+                range.moveEnd('character', end-v.length);
+                range.select();
+            }
+            doFocus = Ext.isGecko || Ext.isOpera;
+        }else{
+            doFocus = true;
+        }
+        if(doFocus){
+            this.focus();
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
+     * This only takes effect if <tt><b>{@link #grow}</b> = true</tt>, and fires the {@link #autosize} event.
+     */
+    autoSize : function(){
+        if(!this.grow || !this.rendered){
+            return;
+        }
+        if(!this.metrics){
+            this.metrics = Ext.util.TextMetrics.createInstance(this.el);
+        }
+        var el = this.el;
+        var v = el.dom.value;
+        var d = document.createElement('div');
+        d.appendChild(document.createTextNode(v));
+        v = d.innerHTML;
+        Ext.removeNode(d);
+        d = null;
+        v += '&#160;';
+        var w = Math.min(this.growMax, Math.max(this.metrics.getWidth(v) + /* add extra padding */ 10, this.growMin));
+        this.el.setWidth(w);
+        this.fireEvent('autosize', this, w);
+    },
+	
+	onDestroy: function(){
+		if(this.validationTask){
+			this.validationTask.cancel();
+			this.validationTask = null;
+		}
+		Ext.form.TextField.superclass.onDestroy.call(this);
+	}
+});
+Ext.reg('textfield', Ext.form.TextField);
+/**
+ * @class Ext.form.TriggerField
+ * @extends Ext.form.TextField
+ * Provides a convenient wrapper for TextFields that adds a clickable trigger button (looks like a combobox by default).
+ * The trigger has no default action, so you must assign a function to implement the trigger click handler by
+ * overriding {@link #onTriggerClick}. You can create a TriggerField directly, as it renders exactly like a combobox
+ * for which you can provide a custom implementation.  For example:
+ * <pre><code>
+var trigger = new Ext.form.TriggerField();
+trigger.onTriggerClick = myTriggerFn;
+trigger.applyToMarkup('my-field');
+</code></pre>
+ *
+ * However, in general you will most likely want to use TriggerField as the base class for a reusable component.
+ * {@link Ext.form.DateField} and {@link Ext.form.ComboBox} are perfect examples of this.
+ *
+ * @constructor
+ * Create a new TriggerField.
+ * @param {Object} config Configuration options (valid {@Ext.form.TextField} config options will also be applied
+ * to the base TextField)
+ * @xtype trigger
+ */
+Ext.form.TriggerField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the
+     * trigger element for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to act as the trigger button for a TriggerField.</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing, positioning
+     * and appearance of the trigger.  Defaults to:</p>
+     * <pre><code>{tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.triggerClass}</code></pre>
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "16", autocomplete: "off"}</code></pre>
+     */
+    defaultAutoCreate : {tag: "input", type: "text", size: "16", autocomplete: "off"},
+    /**
+     * @cfg {Boolean} hideTrigger <tt>true</tt> to hide the trigger element and display only the base
+     * text field (defaults to <tt>false</tt>)
+     */
+    hideTrigger:false,
+    /**
+     * @cfg {Boolean} editable <tt>false</tt> to prevent the user from typing text directly into the field,
+     * the field will only respond to a click on the trigger to set the value. (defaults to <tt>true</tt>).
+     */
+    editable: true,
+    /**
+     * @cfg {Boolean} readOnly <tt>true</tt> to prevent the user from changing the field, and
+     * hides the trigger.  Superceeds the editable and hideTrigger options if the value is true.
+     * (defaults to <tt>false</tt>)
+     */
+    readOnly: false,
+    /**
+     * @cfg {String} wrapFocusClass The class added to the to the wrap of the trigger element. Defaults to
+     * <tt>x-trigger-wrap-focus</tt>.
+     */
+    wrapFocusClass: 'x-trigger-wrap-focus',
+    /**
+     * @hide
+     * @method autoSize
+     */
+    autoSize: Ext.emptyFn,
+    // private
+    monitorTab : true,
+    // private
+    deferHeight : true,
+    // private
+    mimicing : false,
+
+    actionMode: 'wrap',
+
+    defaultTriggerWidth: 17,
+
+    // private
+    onResize : function(w, h){
+        Ext.form.TriggerField.superclass.onResize.call(this, w, h);
+        var tw = this.getTriggerWidth();
+        if(Ext.isNumber(w)){
+            this.el.setWidth(w - tw);
+        }
+        this.wrap.setWidth(this.el.getWidth() + tw);
+    },
+
+    getTriggerWidth: function(){
+        var tw = this.trigger.getWidth();
+        if(!this.hideTrigger && !this.readOnly && tw === 0){
+            tw = this.defaultTriggerWidth;
+        }
+        return tw;
+    },
+
+    // private
+    alignErrorIcon : function(){
+        if(this.wrap){
+            this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.doc = Ext.isIE ? Ext.getBody() : Ext.getDoc();
+        Ext.form.TriggerField.superclass.onRender.call(this, ct, position);
+
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap x-form-field-trigger-wrap'});
+        this.trigger = this.wrap.createChild(this.triggerConfig ||
+                {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.triggerClass});
+        this.initTrigger();
+        if(!this.width){
+            this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    getWidth: function() {
+        return(this.el.getWidth() + this.trigger.getWidth());
+    },
+
+    updateEditState: function(){
+        if(this.rendered){
+            if (this.readOnly) {
+                this.el.dom.readOnly = true;
+                this.el.addClass('x-trigger-noedit');
+                this.mun(this.el, 'click', this.onTriggerClick, this);
+                this.trigger.setDisplayed(false);
+            } else {
+                if (!this.editable) {
+                    this.el.dom.readOnly = true;
+                    this.el.addClass('x-trigger-noedit');
+                    this.mon(this.el, 'click', this.onTriggerClick, this);
+                } else {
+                    this.el.dom.readOnly = false;
+                    this.el.removeClass('x-trigger-noedit');
+                    this.mun(this.el, 'click', this.onTriggerClick, this);
+                }
+                this.trigger.setDisplayed(!this.hideTrigger);
+            }
+            this.onResize(this.width || this.wrap.getWidth());
+        }
+    },
+
+    /**
+     * Changes the hidden status of the trigger.
+     * @param {Boolean} hideTrigger True to hide the trigger, false to show it.
+     */
+    setHideTrigger: function(hideTrigger){
+        if(hideTrigger != this.hideTrigger){
+            this.hideTrigger = hideTrigger;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Allow or prevent the user from directly editing the field text.  If false is passed,
+     * the user will only be able to modify the field using the trigger.  Will also add
+     * a click event to the text field which will call the trigger. This method
+     * is the runtime equivalent of setting the {@link #editable} config option at config time.
+     * @param {Boolean} value True to allow the user to directly edit the field text.
+     */
+    setEditable: function(editable){
+        if(editable != this.editable){
+            this.editable = editable;
+            this.updateEditState();
+        }
+    },
+
+    /**
+     * Setting this to true will supersede settings {@link #editable} and {@link #hideTrigger}.
+     * Setting this to false will defer back to {@link #editable} and {@link #hideTrigger}. This method
+     * is the runtime equivalent of setting the {@link #readOnly} config option at config time.
+     * @param {Boolean} value True to prevent the user changing the field and explicitly
+     * hide the trigger.
+     */
+    setReadOnly: function(readOnly){
+        if(readOnly != this.readOnly){
+            this.readOnly = readOnly;
+            this.updateEditState();
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.TriggerField.superclass.afterRender.call(this);
+        this.updateEditState();
+    },
+
+    // private
+    initTrigger : function(){
+        this.mon(this.trigger, 'click', this.onTriggerClick, this, {preventDefault:true});
+        this.trigger.addClassOnOver('x-form-trigger-over');
+        this.trigger.addClassOnClick('x-form-trigger-click');
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.trigger, this.wrap);
+        if (this.mimicing){
+            this.doc.un('mousedown', this.mimicBlur, this);
+        }
+        delete this.doc;
+        Ext.form.TriggerField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    onFocus : function(){
+        Ext.form.TriggerField.superclass.onFocus.call(this);
+        if(!this.mimicing){
+            this.wrap.addClass(this.wrapFocusClass);
+            this.mimicing = true;
+            this.doc.on('mousedown', this.mimicBlur, this, {delay: 10});
+            if(this.monitorTab){
+                this.on('specialkey', this.checkTab, this);
+            }
+        }
+    },
+
+    // private
+    checkTab : function(me, e){
+        if(e.getKey() == e.TAB){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    onBlur : Ext.emptyFn,
+
+    // private
+    mimicBlur : function(e){
+        if(!this.isDestroyed && !this.wrap.contains(e.target) && this.validateBlur(e)){
+            this.triggerBlur();
+        }
+    },
+
+    // private
+    triggerBlur : function(){
+        this.mimicing = false;
+        this.doc.un('mousedown', this.mimicBlur, this);
+        if(this.monitorTab && this.el){
+            this.un('specialkey', this.checkTab, this);
+        }
+        Ext.form.TriggerField.superclass.onBlur.call(this);
+        if(this.wrap){
+            this.wrap.removeClass(this.wrapFocusClass);
+        }
+    },
+
+    beforeBlur : Ext.emptyFn,
+
+    // private
+    // This should be overriden by any subclass that needs to check whether or not the field can be blurred.
+    validateBlur : function(e){
+        return true;
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function.  See Ext.form.ComboBox and Ext.form.DateField for
+     * sample implementations.
+     * @method
+     * @param {EventObject} e
+     */
+    onTriggerClick : Ext.emptyFn
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+});
+
+/**
+ * @class Ext.form.TwinTriggerField
+ * @extends Ext.form.TriggerField
+ * TwinTriggerField is not a public class to be used directly.  It is meant as an abstract base class
+ * to be extended by an implementing class.  For an example of implementing this class, see the custom
+ * SearchField implementation here:
+ * <a href="http://extjs.com/deploy/ext/examples/form/custom.html">http://extjs.com/deploy/ext/examples/form/custom.html</a>
+ */
+Ext.form.TwinTriggerField = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} triggerConfig
+     * <p>A {@link Ext.DomHelper DomHelper} config object specifying the structure of the trigger elements
+     * for this Field. (Optional).</p>
+     * <p>Specify this when you need a customized element to contain the two trigger elements for this Field.
+     * Each trigger element must be marked by the CSS class <tt>x-form-trigger</tt> (also see
+     * <tt>{@link #trigger1Class}</tt> and <tt>{@link #trigger2Class}</tt>).</p>
+     * <p>Note that when using this option, it is the developer's responsibility to ensure correct sizing,
+     * positioning and appearance of the triggers.</p>
+     */
+    /**
+     * @cfg {String} trigger1Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+    /**
+     * @cfg {String} trigger2Class
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> by default and <tt>triggerClass</tt> will be <b>appended</b> if specified.
+     */
+
+    initComponent : function(){
+        Ext.form.TwinTriggerField.superclass.initComponent.call(this);
+
+        this.triggerConfig = {
+            tag:'span', cls:'x-form-twin-triggers', cn:[
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger1Class},
+            {tag: "img", src: Ext.BLANK_IMAGE_URL, alt: "", cls: "x-form-trigger " + this.trigger2Class}
+        ]};
+    },
+
+    getTrigger : function(index){
+        return this.triggers[index];
+    },
+    
+    afterRender: function(){
+        Ext.form.TwinTriggerField.superclass.afterRender.call(this);
+        var triggers = this.triggers,
+            i = 0,
+            len = triggers.length;
+            
+        for(; i < len; ++i){
+            if(this['hideTrigger' + (i + 1)]){
+                    triggers[i].hide();
+                }
+
+        }    
+    },
+
+    initTrigger : function(){
+        var ts = this.trigger.select('.x-form-trigger', true),
+            triggerField = this;
+            
+        ts.each(function(t, all, index){
+            var triggerIndex = 'Trigger'+(index+1);
+            t.hide = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = 'none';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = true;
+            };
+            t.show = function(){
+                var w = triggerField.wrap.getWidth();
+                this.dom.style.display = '';
+                triggerField.el.setWidth(w-triggerField.trigger.getWidth());
+                triggerField['hidden' + triggerIndex] = false;
+            };
+            this.mon(t, 'click', this['on'+triggerIndex+'Click'], this, {preventDefault:true});
+            t.addClassOnOver('x-form-trigger-over');
+            t.addClassOnClick('x-form-trigger-click');
+        }, this);
+        this.triggers = ts.elements;
+    },
+
+    getTriggerWidth: function(){
+        var tw = 0;
+        Ext.each(this.triggers, function(t, index){
+            var triggerIndex = 'Trigger' + (index + 1),
+                w = t.getWidth();
+            if(w === 0 && !this['hidden' + triggerIndex]){
+                tw += this.defaultTriggerWidth;
+            }else{
+                tw += w;
+            }
+        }, this);
+        return tw;
+    },
+
+    // private
+    onDestroy : function() {
+        Ext.destroy(this.triggers);
+        Ext.form.TwinTriggerField.superclass.onDestroy.call(this);
+    },
+
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger1Click : Ext.emptyFn,
+    /**
+     * The function that should handle the trigger's click event.  This method does nothing by default
+     * until overridden by an implementing function. See {@link Ext.form.TriggerField#onTriggerClick}
+     * for additional information.
+     * @method
+     * @param {EventObject} e
+     */
+    onTrigger2Click : Ext.emptyFn
+});
+Ext.reg('trigger', Ext.form.TriggerField);
+/**
+ * @class Ext.form.TextArea
+ * @extends Ext.form.TextField
+ * Multiline text field.  Can be used as a direct replacement for traditional textarea fields, plus adds
+ * support for auto-sizing.
+ * @constructor
+ * Creates a new TextArea
+ * @param {Object} config Configuration options
+ * @xtype textarea
+ */
+Ext.form.TextArea = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {Number} growMin The minimum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>60</tt>)
+     */
+    growMin : 60,
+    /**
+     * @cfg {Number} growMax The maximum height to allow when <tt>{@link Ext.form.TextField#grow grow}=true</tt>
+     * (defaults to <tt>1000</tt>)
+     */
+    growMax: 1000,
+    growAppend : '&#160;\n&#160;',
+
+    enterIsSpecial : false,
+
+    /**
+     * @cfg {Boolean} preventScrollbars <tt>true</tt> to prevent scrollbars from appearing regardless of how much text is
+     * in the field. This option is only relevant when {@link #grow} is <tt>true</tt>. Equivalent to setting overflow: hidden, defaults to 
+     * <tt>false</tt>.
+     */
+    preventScrollbars: false,
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or true for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "textarea", style: "width:100px;height:60px;", autocomplete: "off"}</code></pre>
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.defaultAutoCreate = {
+                tag: "textarea",
+                style:"width:100px;height:60px;",
+                autocomplete: "off"
+            };
+        }
+        Ext.form.TextArea.superclass.onRender.call(this, ct, position);
+        if(this.grow){
+            this.textSizeEl = Ext.DomHelper.append(document.body, {
+                tag: "pre", cls: "x-form-grow-sizer"
+            });
+            if(this.preventScrollbars){
+                this.el.setStyle("overflow", "hidden");
+            }
+            this.el.setHeight(this.growMin);
+        }
+    },
+
+    onDestroy : function(){
+        Ext.removeNode(this.textSizeEl);
+        Ext.form.TextArea.superclass.onDestroy.call(this);
+    },
+
+    fireKey : function(e){
+        if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
+            this.fireEvent("specialkey", this, e);
+        }
+    },
+    
+    // private
+    doAutoSize : function(e){
+        return !e.isNavKeyPress() || e.getKey() == e.ENTER;
+    },
+    
+    // inherit docs
+    filterValidation: function(e) {            
+        if(!e.isNavKeyPress() || (!this.enterIsSpecial && e.keyCode == e.ENTER)){
+            this.validationTask.delay(this.validationDelay);
+        }
+    },
+
+    /**
+     * Automatically grows the field to accomodate the height of the text up to the maximum field height allowed.
+     * This only takes effect if grow = true, and fires the {@link #autosize} event if the height changes.
+     */
+    autoSize: function(){
+        if(!this.grow || !this.textSizeEl){
+            return;
+        }
+        var el = this.el,
+            v = Ext.util.Format.htmlEncode(el.dom.value),
+            ts = this.textSizeEl,
+            h;
+            
+        Ext.fly(ts).setWidth(this.el.getWidth());
+        if(v.length < 1){
+            v = "&#160;&#160;";
+        }else{
+            v += this.growAppend;
+            if(Ext.isIE){
+                v = v.replace(/\n/g, '&#160;<br />');
+            }
+        }
+        ts.innerHTML = v;
+        h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin));
+        if(h != this.lastHeight){
+            this.lastHeight = h;
+            this.el.setHeight(h);
+            this.fireEvent("autosize", this, h);
+        }
+    }
+});
+Ext.reg('textarea', Ext.form.TextArea);/**
+ * @class Ext.form.NumberField
+ * @extends Ext.form.TextField
+ * Numeric text field that provides automatic keystroke filtering and numeric validation.
+ * @constructor
+ * Creates a new NumberField
+ * @param {Object} config Configuration options
+ * @xtype numberfield
+ */
+Ext.form.NumberField = Ext.extend(Ext.form.TextField,  {
+    /**
+     * @cfg {RegExp} stripCharsRe @hide
+     */
+    /**
+     * @cfg {RegExp} maskRe @hide
+     */
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to "x-form-field x-form-num-field")
+     */
+    fieldClass: "x-form-field x-form-num-field",
+    
+    /**
+     * @cfg {Boolean} allowDecimals False to disallow decimal values (defaults to true)
+     */
+    allowDecimals : true,
+    
+    /**
+     * @cfg {String} decimalSeparator Character(s) to allow as the decimal separator (defaults to '.')
+     */
+    decimalSeparator : ".",
+    
+    /**
+     * @cfg {Number} decimalPrecision The maximum precision to display after the decimal separator (defaults to 2)
+     */
+    decimalPrecision : 2,
+    
+    /**
+     * @cfg {Boolean} allowNegative False to prevent entering a negative sign (defaults to true)
+     */
+    allowNegative : true,
+    
+    /**
+     * @cfg {Number} minValue The minimum allowed value (defaults to Number.NEGATIVE_INFINITY)
+     */
+    minValue : Number.NEGATIVE_INFINITY,
+    
+    /**
+     * @cfg {Number} maxValue The maximum allowed value (defaults to Number.MAX_VALUE)
+     */
+    maxValue : Number.MAX_VALUE,
+    
+    /**
+     * @cfg {String} minText Error text to display if the minimum value validation fails (defaults to "The minimum value for this field is {minValue}")
+     */
+    minText : "The minimum value for this field is {0}",
+    
+    /**
+     * @cfg {String} maxText Error text to display if the maximum value validation fails (defaults to "The maximum value for this field is {maxValue}")
+     */
+    maxText : "The maximum value for this field is {0}",
+    
+    /**
+     * @cfg {String} nanText Error text to display if the value is not a valid number.  For example, this can happen
+     * if a valid character like '.' or '-' is left in the field with no number (defaults to "{value} is not a valid number")
+     */
+    nanText : "{0} is not a valid number",
+    
+    /**
+     * @cfg {String} baseChars The base set of characters to evaluate as valid numbers (defaults to '0123456789').
+     */
+    baseChars : "0123456789",
+    
+    /**
+     * @cfg {Boolean} autoStripChars True to automatically strip not allowed characters from the field. Defaults to <tt>false</tt>
+     */
+    autoStripChars: false,
+
+    // private
+    initEvents : function() {
+        var allowed = this.baseChars + '';
+        if (this.allowDecimals) {
+            allowed += this.decimalSeparator;
+        }
+        if (this.allowNegative) {
+            allowed += '-';
+        }
+        allowed = Ext.escapeRe(allowed);
+        this.maskRe = new RegExp('[' + allowed + ']');
+        if (this.autoStripChars) {
+            this.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
+        }
+        
+        Ext.form.NumberField.superclass.initEvents.call(this);
+    },
+    
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validations run test that the value is a number, and that it is within the
+     * configured min and max values.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.NumberField.superclass.getErrors.apply(this, arguments);
+        
+        value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());
+        
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+        
+        value = String(value).replace(this.decimalSeparator, ".");
+        
+        if(isNaN(value)){
+            errors.push(String.format(this.nanText, value));
+        }
+        
+        var num = this.parseValue(value);
+        
+        if (num < this.minValue) {
+            errors.push(String.format(this.minText, this.minValue));
+        }
+        
+        if (num > this.maxValue) {
+            errors.push(String.format(this.maxText, this.maxValue));
+        }
+        
+        return errors;
+    },
+
+    getValue : function() {
+        return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));
+    },
+
+    setValue : function(v) {
+    	v = Ext.isNumber(v) ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
+        v = this.fixPrecision(v);
+        v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
+        return Ext.form.NumberField.superclass.setValue.call(this, v);
+    },
+    
+    /**
+     * Replaces any existing {@link #minValue} with the new value.
+     * @param {Number} value The minimum value
+     */
+    setMinValue : function(value) {
+        this.minValue = Ext.num(value, Number.NEGATIVE_INFINITY);
+    },
+    
+    /**
+     * Replaces any existing {@link #maxValue} with the new value.
+     * @param {Number} value The maximum value
+     */
+    setMaxValue : function(value) {
+        this.maxValue = Ext.num(value, Number.MAX_VALUE);    
+    },
+
+    // private
+    parseValue : function(value) {
+        value = parseFloat(String(value).replace(this.decimalSeparator, "."));
+        return isNaN(value) ? '' : value;
+    },
+
+    /**
+     * @private
+     * 
+     */
+    fixPrecision : function(value) {
+        var nan = isNaN(value);
+        
+        if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
+            return nan ? '' : value;
+        }
+        
+        return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
+    },
+
+    beforeBlur : function() {
+        var v = this.parseValue(this.getRawValue());
+        
+        if (!Ext.isEmpty(v)) {
+            this.setValue(v);
+        }
+    }
+});
+
+Ext.reg('numberfield', Ext.form.NumberField);
+/**
+ * @class Ext.form.DateField
+ * @extends Ext.form.TriggerField
+ * Provides a date input field with a {@link Ext.DatePicker} dropdown and automatic date validation.
+ * @constructor
+ * Create a new DateField
+ * @param {Object} config
+ * @xtype datefield
+ */
+Ext.form.DateField = Ext.extend(Ext.form.TriggerField,  {
+    /**
+     * @cfg {String} format
+     * The default date format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : "m/d/Y",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "<tt>|</tt>" to try when parsing a user input value and it
+     * does not match the defined format (defaults to
+     * <tt>'m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j'</tt>).
+     */
+    altFormats : "m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d|n-j|n/j",
+    /**
+     * @cfg {String} disabledDaysText
+     * The tooltip to display when the date falls on a disabled day (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDaysText : "Disabled",
+    /**
+     * @cfg {String} disabledDatesText
+     * The tooltip text to display when the date falls on a disabled date (defaults to <tt>'Disabled'</tt>)
+     */
+    disabledDatesText : "Disabled",
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before <tt>{@link #minValue}</tt> (defaults to
+     * <tt>'The date in this field must be after {minValue}'</tt>).
+     */
+    minText : "The date in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the date in the cell is after <tt>{@link #maxValue}</tt> (defaults to
+     * <tt>'The date in this field must be before {maxValue}'</tt>).
+     */
+    maxText : "The date in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the date in the field is invalid (defaults to
+     * <tt>'{value} is not a valid date - it must be in the format {format}'</tt>).
+     */
+    invalidText : "{0} is not a valid date - it must be in the format {1}",
+    /**
+     * @cfg {String} triggerClass
+     * An additional CSS class used to style the trigger button.  The trigger will always get the
+     * class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-date-trigger'</tt> which displays a calendar icon).
+     */
+    triggerClass : 'x-form-date-trigger',
+    /**
+     * @cfg {Boolean} showToday
+     * <tt>false</tt> to hide the footer area of the DatePicker containing the Today button and disable
+     * the keyboard handler for spacebar that selects the current date (defaults to <tt>true</tt>).
+     */
+    showToday : true,
+    
+    /**
+     * @cfg {Number} startDay
+     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
+     */
+    startDay : 0,
+    
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed date. Can be either a Javascript date object or a string date in a
+     * valid format (defaults to null).
+     */
+    /**
+     * @cfg {Array} disabledDays
+     * An array of days to disable, 0 based (defaults to null). Some examples:<pre><code>
+// disable Sunday and Saturday:
+disabledDays:  [0, 6]
+// disable weekdays:
+disabledDays: [1,2,3,4,5]
+     * </code></pre>
+     */
+    /**
+     * @cfg {Array} disabledDates
+     * An array of "dates" to disable, as strings. These strings will be used to build a dynamic regular
+     * expression so they are very powerful. Some examples:<pre><code>
+// disable these exact dates:
+disabledDates: ["03/08/2003", "09/16/2003"]
+// disable these days for every year:
+disabledDates: ["03/08", "09/16"]
+// only match the beginning (useful if you are using short years):
+disabledDates: ["^03/08"]
+// disable every day in March 2006:
+disabledDates: ["03/../2006"]
+// disable every day in every March:
+disabledDates: ["^03"]
+     * </code></pre>
+     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
+     * In order to support regular expressions, if you are using a {@link #format date format} that has "." in
+     * it, you will have to escape the dot when restricting dates. For example: <tt>["03\\.08\\.03"]</tt>.
+     */
+    /**
+     * @cfg {String/Object} autoCreate
+     * A {@link Ext.DomHelper DomHelper element specification object}, or <tt>true</tt> for the default element
+     * specification object:<pre><code>
+     * autoCreate: {tag: "input", type: "text", size: "10", autocomplete: "off"}
+     * </code></pre>
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "10", autocomplete: "off"},
+
+    // in the absence of a time value, a default value of 12 noon will be used
+    // (note: 12 noon was chosen because it steers well clear of all DST timezone changes)
+    initTime: '12', // 24 hour format
+
+    initTimeFormat: 'H',
+
+    // PUBLIC -- to be documented
+    safeParse : function(value, format) {
+        if (Date.formatContainsHourInfo(format)) {
+            // if parse format contains hour information, no DST adjustment is necessary
+            return Date.parseDate(value, format);
+        } else {
+            // set time to 12 noon, then clear the time
+            var parsedDate = Date.parseDate(value + ' ' + this.initTime, format + ' ' + this.initTimeFormat);
+ 
+            if (parsedDate) {
+                return parsedDate.clearTime();
+            }
+        }
+    },
+
+    initComponent : function(){
+        Ext.form.DateField.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /**
+             * @event select
+             * Fires when a date is selected via the date picker.
+             * @param {Ext.form.DateField} this
+             * @param {Date} date The date that was selected
+             */
+            'select'
+        );
+
+        if(Ext.isString(this.minValue)){
+            this.minValue = this.parseDate(this.minValue);
+        }
+        if(Ext.isString(this.maxValue)){
+            this.maxValue = this.parseDate(this.maxValue);
+        }
+        this.disabledDatesRE = null;
+        this.initDisabledDays();
+    },
+
+    initEvents: function() {
+        Ext.form.DateField.superclass.initEvents.call(this);
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "down": function(e) {
+                this.onTriggerClick();
+            },
+            scope: this,
+            forceKeyDown: true
+        });
+    },
+
+
+    // private
+    initDisabledDays : function(){
+        if(this.disabledDates){
+            var dd = this.disabledDates,
+                len = dd.length - 1,
+                re = "(?:";
+
+            Ext.each(dd, function(d, i){
+                re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
+                if(i != len){
+                    re += '|';
+                }
+            }, this);
+            this.disabledDatesRE = new RegExp(re + ')');
+        }
+    },
+
+    /**
+     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
+     * @param {Array} disabledDates An array of date strings (see the <tt>{@link #disabledDates}</tt> config
+     * for details on supported values) used to disable a pattern of dates.
+     */
+    setDisabledDates : function(dd){
+        this.disabledDates = dd;
+        this.initDisabledDays();
+        if(this.menu){
+            this.menu.picker.setDisabledDates(this.disabledDatesRE);
+        }
+    },
+
+    /**
+     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
+     * @param {Array} disabledDays An array of disabled day indexes. See the <tt>{@link #disabledDays}</tt>
+     * config for details on supported values.
+     */
+    setDisabledDays : function(dd){
+        this.disabledDays = dd;
+        if(this.menu){
+            this.menu.picker.setDisabledDays(dd);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #minValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The minimum date that can be selected
+     */
+    setMinValue : function(dt){
+        this.minValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMinDate(this.minValue);
+        }
+    },
+
+    /**
+     * Replaces any existing <tt>{@link #maxValue}</tt> with the new value and refreshes the DatePicker.
+     * @param {Date} value The maximum date that can be selected
+     */
+    setMaxValue : function(dt){
+        this.maxValue = (Ext.isString(dt) ? this.parseDate(dt) : dt);
+        if(this.menu){
+            this.menu.picker.setMaxDate(this.maxValue);
+        }
+    },
+
+    /**
+     * Runs all of NumberFields validations and returns an array of any errors. Note that this first
+     * runs TextField's validations, so the returned array is an amalgamation of all field errors.
+     * The additional validation checks are testing that the date format is valid, that the chosen
+     * date is within the min and max date constraints set, that the date chosen is not in the disabledDates
+     * regex and that the day chosed is not one of the disabledDays.
+     * @param {Mixed} value The value to get errors for (defaults to the current field value)
+     * @return {Array} All validation errors for this field
+     */
+    getErrors: function(value) {
+        var errors = Ext.form.DateField.superclass.getErrors.apply(this, arguments);
+
+        value = this.formatDate(value || this.processValue(this.getRawValue()));
+
+        if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
+             return errors;
+        }
+
+        var svalue = value;
+        value = this.parseDate(value);
+        if (!value) {
+            errors.push(String.format(this.invalidText, svalue, this.format));
+            return errors;
+        }
+
+        var time = value.getTime();
+        if (this.minValue && time < this.minValue.clearTime().getTime()) {
+            errors.push(String.format(this.minText, this.formatDate(this.minValue)));
+        }
+
+        if (this.maxValue && time > this.maxValue.clearTime().getTime()) {
+            errors.push(String.format(this.maxText, this.formatDate(this.maxValue)));
+        }
+
+        if (this.disabledDays) {
+            var day = value.getDay();
+
+            for(var i = 0; i < this.disabledDays.length; i++) {
+                if (day === this.disabledDays[i]) {
+                    errors.push(this.disabledDaysText);
+                    break;
+                }
+            }
+        }
+
+        var fvalue = this.formatDate(value);
+        if (this.disabledDatesRE && this.disabledDatesRE.test(fvalue)) {
+            errors.push(String.format(this.disabledDatesText, fvalue));
+        }
+
+        return errors;
+    },
+
+    // private
+    // Provides logic to override the default TriggerField.validateBlur which just returns true
+    validateBlur : function(){
+        return !this.menu || !this.menu.isVisible();
+    },
+
+    /**
+     * Returns the current date value of the date field.
+     * @return {Date} The date value
+     */
+    getValue : function(){
+        return this.parseDate(Ext.form.DateField.superclass.getValue.call(this)) || "";
+    },
+
+    /**
+     * Sets the value of the date field.  You can pass a date object or any string that can be
+     * parsed into a valid date, using <tt>{@link #format}</tt> as the date format, according
+     * to the same rules as {@link Date#parseDate} (the default format used is <tt>"m/d/Y"</tt>).
+     * <br />Usage:
+     * <pre><code>
+//All of these calls set the same date value (May 4, 2006)
+
+//Pass a date object:
+var dt = new Date('5/4/2006');
+dateField.setValue(dt);
+
+//Pass a date string (default format):
+dateField.setValue('05/04/2006');
+
+//Pass a date string (custom format):
+dateField.format = 'Y-m-d';
+dateField.setValue('2006-05-04');
+</code></pre>
+     * @param {String/Date} date The date or valid date string
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(date){
+        return Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));
+    },
+
+    // private
+    parseDate : function(value) {
+        if(!value || Ext.isDate(value)){
+            return value;
+        }
+
+        var v = this.safeParse(value, this.format),
+            af = this.altFormats,
+            afa = this.altFormatsArray;
+
+        if (!v && af) {
+            afa = afa || af.split("|");
+
+            for (var i = 0, len = afa.length; i < len && !v; i++) {
+                v = this.safeParse(value, afa[i]);
+            }
+        }
+        return v;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.menu, this.keyNav);
+        Ext.form.DateField.superclass.onDestroy.call(this);
+    },
+
+    // private
+    formatDate : function(date){
+        return Ext.isDate(date) ? date.dateFormat(this.format) : date;
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
+    onTriggerClick : function(){
+        if(this.disabled){
+            return;
+        }
+        if(this.menu == null){
+            this.menu = new Ext.menu.DateMenu({
+                hideOnClick: false,
+                focusOnSelect: false
+            });
+        }
+        this.onFocus();
+        Ext.apply(this.menu.picker,  {
+            minDate : this.minValue,
+            maxDate : this.maxValue,
+            disabledDatesRE : this.disabledDatesRE,
+            disabledDatesText : this.disabledDatesText,
+            disabledDays : this.disabledDays,
+            disabledDaysText : this.disabledDaysText,
+            format : this.format,
+            showToday : this.showToday,
+            startDay: this.startDay,
+            minText : String.format(this.minText, this.formatDate(this.minValue)),
+            maxText : String.format(this.maxText, this.formatDate(this.maxValue))
+        });
+        this.menu.picker.setValue(this.getValue() || new Date());
+        this.menu.show(this.el, "tl-bl?");
+        this.menuEvents('on');
+    },
+
+    //private
+    menuEvents: function(method){
+        this.menu[method]('select', this.onSelect, this);
+        this.menu[method]('hide', this.onMenuHide, this);
+        this.menu[method]('show', this.onFocus, this);
+    },
+
+    onSelect: function(m, d){
+        this.setValue(d);
+        this.fireEvent('select', this, d);
+        this.menu.hide();
+    },
+
+    onMenuHide: function(){
+        this.focus(false, 60);
+        this.menuEvents('un');
+    },
+
+    // private
+    beforeBlur : function(){
+        var v = this.parseDate(this.getRawValue());
+        if(v){
+            this.setValue(v);
+        }
+    }
+
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+    /**
+     * @hide
+     * @method autoSize
+     */
+});
+Ext.reg('datefield', Ext.form.DateField);
+/**
+ * @class Ext.form.DisplayField
+ * @extends Ext.form.Field
+ * A display-only text field which is not validated and not submitted.
+ * @constructor
+ * Creates a new DisplayField.
+ * @param {Object} config Configuration options
+ * @xtype displayfield
+ */
+Ext.form.DisplayField = Ext.extend(Ext.form.Field,  {
+    validationEvent : false,
+    validateOnBlur : false,
+    defaultAutoCreate : {tag: "div"},
+    /**
+     * @cfg {String} fieldClass The default CSS class for the field (defaults to <tt>"x-form-display-field"</tt>)
+     */
+    fieldClass : "x-form-display-field",
+    /**
+     * @cfg {Boolean} htmlEncode <tt>false</tt> to skip HTML-encoding the text when rendering it (defaults to
+     * <tt>false</tt>). This might be useful if you want to include tags in the field's innerHTML rather than
+     * rendering them as string literals per the default logic.
+     */
+    htmlEncode: false,
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    isValid : function(){
+        return true;
+    },
+
+    validate : function(){
+        return true;
+    },
+
+    getRawValue : function(){
+        var v = this.rendered ? this.el.dom.innerHTML : Ext.value(this.value, '');
+        if(v === this.emptyText){
+            v = '';
+        }
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlDecode(v);
+        }
+        return v;
+    },
+
+    getValue : function(){
+        return this.getRawValue();
+    },
+    
+    getName: function() {
+        return this.name;
+    },
+
+    setRawValue : function(v){
+        if(this.htmlEncode){
+            v = Ext.util.Format.htmlEncode(v);
+        }
+        return this.rendered ? (this.el.dom.innerHTML = (Ext.isEmpty(v) ? '' : v)) : (this.value = v);
+    },
+
+    setValue : function(v){
+        this.setRawValue(v);
+        return this;
+    }
+    /** 
+     * @cfg {String} inputType 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} disabled 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} readOnly 
+     * @hide
+     */
+    /** 
+     * @cfg {Boolean} validateOnBlur 
+     * @hide
+     */
+    /** 
+     * @cfg {Number} validationDelay 
+     * @hide
+     */
+    /** 
+     * @cfg {String/Boolean} validationEvent 
+     * @hide
+     */
+});
+
+Ext.reg('displayfield', Ext.form.DisplayField);
+/**
+ * @class Ext.form.ComboBox
+ * @extends Ext.form.TriggerField
+ * <p>A combobox control with support for autocomplete, remote-loading, paging and many other features.</p>
+ * <p>A ComboBox works in a similar manner to a traditional HTML &lt;select> field. The difference is
+ * that to submit the {@link #valueField}, you must specify a {@link #hiddenName} to create a hidden input
+ * field to hold the value of the valueField. The <i>{@link #displayField}</i> is shown in the text field
+ * which is named according to the {@link #name}.</p>
+ * <p><b><u>Events</u></b></p>
+ * <p>To do something when something in ComboBox is selected, configure the select event:<pre><code>
+var cb = new Ext.form.ComboBox({
+    // all of your config options
+    listeners:{
+         scope: yourScope,
+         'select': yourFunction
+    }
+});
+
+// Alternatively, you can assign events after the object is created:
+var cb = new Ext.form.ComboBox(yourOptions);
+cb.on('select', yourFunction, yourScope);
+ * </code></pre></p>
+ *
+ * <p><b><u>ComboBox in Grid</u></b></p>
+ * <p>If using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a {@link Ext.grid.Column#renderer renderer}
+ * will be needed to show the displayField when the editor is not active.  Set up the renderer manually, or implement
+ * a reusable render, for example:<pre><code>
+// create reusable renderer
+Ext.util.Format.comboRenderer = function(combo){
+    return function(value){
+        var record = combo.findRecord(combo.{@link #valueField}, value);
+        return record ? record.get(combo.{@link #displayField}) : combo.{@link #valueNotFoundText};
+    }
+}
+
+// create the combo instance
+var combo = new Ext.form.ComboBox({
+    {@link #typeAhead}: true,
+    {@link #triggerAction}: 'all',
+    {@link #lazyRender}:true,
+    {@link #mode}: 'local',
+    {@link #store}: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]
+    }),
+    {@link #valueField}: 'myId',
+    {@link #displayField}: 'displayText'
+});
+
+// snippet of column model used within grid
+var cm = new Ext.grid.ColumnModel([{
+       ...
+    },{
+       header: "Some Header",
+       dataIndex: 'whatever',
+       width: 130,
+       editor: combo, // specify reference to combo instance
+       renderer: Ext.util.Format.comboRenderer(combo) // pass combo instance to reusable renderer
+    },
+    ...
+]);
+ * </code></pre></p>
+ *
+ * <p><b><u>Filtering</u></b></p>
+ * <p>A ComboBox {@link #doQuery uses filtering itself}, for information about filtering the ComboBox
+ * store manually see <tt>{@link #lastQuery}</tt>.</p>
+ * @constructor
+ * Create a new ComboBox.
+ * @param {Object} config Configuration options
+ * @xtype combo
+ */
+Ext.form.ComboBox = Ext.extend(Ext.form.TriggerField, {
+    /**
+     * @cfg {Mixed} transform The id, DOM node or element of an existing HTML SELECT to convert to a ComboBox.
+     * Note that if you specify this and the combo is going to be in an {@link Ext.form.BasicForm} or
+     * {@link Ext.form.FormPanel}, you must also set <tt>{@link #lazyRender} = true</tt>.
+     */
+    /**
+     * @cfg {Boolean} lazyRender <tt>true</tt> to prevent the ComboBox from rendering until requested
+     * (should always be used when rendering into an {@link Ext.Editor} (e.g. {@link Ext.grid.EditorGridPanel Grids}),
+     * defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String/Object} autoCreate <p>A {@link Ext.DomHelper DomHelper} element spec, or <tt>true</tt> for a default
+     * element spec. Used to create the {@link Ext.Component#getEl Element} which will encapsulate this Component.
+     * See <tt>{@link Ext.Component#autoEl autoEl}</tt> for details.  Defaults to:</p>
+     * <pre><code>{tag: "input", type: "text", size: "24", autocomplete: "off"}</code></pre>
+     */
+    /**
+     * @cfg {Ext.data.Store/Array} store The data source to which this combo is bound (defaults to <tt>undefined</tt>).
+     * Acceptable values for this property are:
+     * <div class="mdetail-params"><ul>
+     * <li><b>any {@link Ext.data.Store Store} subclass</b></li>
+     * <li><b>an Array</b> : Arrays will be converted to a {@link Ext.data.ArrayStore} internally,
+     * automatically generating {@link Ext.data.Field#name field names} to work with all data components.
+     * <div class="mdetail-params"><ul>
+     * <li><b>1-dimensional array</b> : (e.g., <tt>['Foo','Bar']</tt>)<div class="sub-desc">
+     * A 1-dimensional array will automatically be expanded (each array item will be used for both the combo
+     * {@link #valueField} and {@link #displayField})</div></li>
+     * <li><b>2-dimensional array</b> : (e.g., <tt>[['f','Foo'],['b','Bar']]</tt>)<div class="sub-desc">
+     * For a multi-dimensional array, the value in index 0 of each item will be assumed to be the combo
+     * {@link #valueField}, while the value at index 1 is assumed to be the combo {@link #displayField}.
+     * </div></li></ul></div></li></ul></div>
+     * <p>See also <tt>{@link #mode}</tt>.</p>
+     */
+    /**
+     * @cfg {String} title If supplied, a header element is created containing this text and added into the top of
+     * the dropdown list (defaults to undefined, with no header element)
+     */
+
+    // private
+    defaultAutoCreate : {tag: "input", type: "text", size: "24", autocomplete: "off"},
+    /**
+     * @cfg {Number} listWidth The width (used as a parameter to {@link Ext.Element#setWidth}) of the dropdown
+     * list (defaults to the width of the ComboBox field).  See also <tt>{@link #minListWidth}
+     */
+    /**
+     * @cfg {String} displayField The underlying {@link Ext.data.Field#name data field name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field1'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p>See also <tt>{@link #valueField}</tt>.</p>
+     * <p><b>Note</b>: if using a ComboBox in an {@link Ext.grid.EditorGridPanel Editor Grid} a
+     * {@link Ext.grid.Column#renderer renderer} will be needed to show the displayField when the editor is not
+     * active.</p>
+     */
+    /**
+     * @cfg {String} valueField The underlying {@link Ext.data.Field#name data value name} to bind to this
+     * ComboBox (defaults to undefined if <tt>{@link #mode} = 'remote'</tt> or <tt>'field2'</tt> if
+     * {@link #transform transforming a select} or if the {@link #store field name is autogenerated based on
+     * the store configuration}).
+     * <p><b>Note</b>: use of a <tt>valueField</tt> requires the user to make a selection in order for a value to be
+     * mapped.  See also <tt>{@link #hiddenName}</tt>, <tt>{@link #hiddenValue}</tt>, and <tt>{@link #displayField}</tt>.</p>
+     */
+    /**
+     * @cfg {String} hiddenName If specified, a hidden form field with this name is dynamically generated to store the
+     * field's data value (defaults to the underlying DOM element's name). Required for the combo's value to automatically
+     * post during a form submission.  See also {@link #valueField}.
+     */
+    /**
+     * @cfg {String} hiddenId If <tt>{@link #hiddenName}</tt> is specified, <tt>hiddenId</tt> can also be provided
+     * to give the hidden field a unique id.  The <tt>hiddenId</tt> and combo {@link Ext.Component#id id} should be 
+     * different, since no two DOM nodes should share the same id.
+     */
+    /**
+     * @cfg {String} hiddenValue Sets the initial value of the hidden field if {@link #hiddenName} is
+     * specified to contain the selected {@link #valueField}, from the Store. Defaults to the configured
+     * <tt>{@link Ext.form.Field#value value}</tt>.
+     */
+    /**
+     * @cfg {String} listClass The CSS class to add to the predefined <tt>'x-combo-list'</tt> class
+     * applied the dropdown list element (defaults to '').
+     */
+    listClass : '',
+    /**
+     * @cfg {String} selectedClass CSS class to apply to the selected item in the dropdown list
+     * (defaults to <tt>'x-combo-selected'</tt>)
+     */
+    selectedClass : 'x-combo-selected',
+    /**
+     * @cfg {String} listEmptyText The empty text to display in the data view if no items are found.
+     * (defaults to '')
+     */
+    listEmptyText: '',
+    /**
+     * @cfg {String} triggerClass An additional CSS class used to style the trigger button.  The trigger will always
+     * get the class <tt>'x-form-trigger'</tt> and <tt>triggerClass</tt> will be <b>appended</b> if specified
+     * (defaults to <tt>'x-form-arrow-trigger'</tt> which displays a downward arrow icon).
+     */
+    triggerClass : 'x-form-arrow-trigger',
+    /**
+     * @cfg {Boolean/String} shadow <tt>true</tt> or <tt>"sides"</tt> for the default effect, <tt>"frame"</tt> for
+     * 4-way shadow, and <tt>"drop"</tt> for bottom-right
+     */
+    shadow : 'sides',
+    /**
+     * @cfg {String/Array} listAlign A valid anchor position value. See <tt>{@link Ext.Element#alignTo}</tt> for details
+     * on supported anchor positions and offsets. To specify x/y offsets as well, this value
+     * may be specified as an Array of <tt>{@link Ext.Element#alignTo}</tt> method arguments.</p>
+     * <pre><code>[ 'tl-bl?', [6,0] ]</code></pre>(defaults to <tt>'tl-bl?'</tt>)
+     */
+    listAlign : 'tl-bl?',
+    /**
+     * @cfg {Number} maxHeight The maximum height in pixels of the dropdown list before scrollbars are shown
+     * (defaults to <tt>300</tt>)
+     */
+    maxHeight : 300,
+    /**
+     * @cfg {Number} minHeight The minimum height in pixels of the dropdown list when the list is constrained by its
+     * distance to the viewport edges (defaults to <tt>90</tt>)
+     */
+    minHeight : 90,
+    /**
+     * @cfg {String} triggerAction The action to execute when the trigger is clicked.
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'query'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">{@link #doQuery run the query} using the {@link Ext.form.Field#getRawValue raw value}.</p></li>
+     * <li><b><tt>'all'</tt></b> :
+     * <p class="sub-desc">{@link #doQuery run the query} specified by the <tt>{@link #allQuery}</tt> config option</p></li>
+     * </ul></div>
+     * <p>See also <code>{@link #queryParam}</code>.</p>
+     */
+    triggerAction : 'query',
+    /**
+     * @cfg {Number} minChars The minimum number of characters the user must type before autocomplete and
+     * {@link #typeAhead} activate (defaults to <tt>4</tt> if <tt>{@link #mode} = 'remote'</tt> or <tt>0</tt> if
+     * <tt>{@link #mode} = 'local'</tt>, does not apply if
+     * <tt>{@link Ext.form.TriggerField#editable editable} = false</tt>).
+     */
+    minChars : 4,
+    /**
+     * @cfg {Boolean} autoSelect <tt>true</tt> to select the first result gathered by the data store (defaults
+     * to <tt>true</tt>).  A false value would require a manual selection from the dropdown list to set the components value
+     * unless the value of ({@link #typeAheadDelay}) were true.
+     */
+    autoSelect : true,
+    /**
+     * @cfg {Boolean} typeAhead <tt>true</tt> to populate and autoselect the remainder of the text being
+     * typed after a configurable delay ({@link #typeAheadDelay}) if it matches a known value (defaults
+     * to <tt>false</tt>)
+     */
+    typeAhead : false,
+    /**
+     * @cfg {Number} queryDelay The length of time in milliseconds to delay between the start of typing and
+     * sending the query to filter the dropdown list (defaults to <tt>500</tt> if <tt>{@link #mode} = 'remote'</tt>
+     * or <tt>10</tt> if <tt>{@link #mode} = 'local'</tt>)
+     */
+    queryDelay : 500,
+    /**
+     * @cfg {Number} pageSize If greater than <tt>0</tt>, a {@link Ext.PagingToolbar} is displayed in the
+     * footer of the dropdown list and the {@link #doQuery filter queries} will execute with page start and
+     * {@link Ext.PagingToolbar#pageSize limit} parameters. Only applies when <tt>{@link #mode} = 'remote'</tt>
+     * (defaults to <tt>0</tt>).
+     */
+    pageSize : 0,
+    /**
+     * @cfg {Boolean} selectOnFocus <tt>true</tt> to select any existing text in the field immediately on focus.
+     * Only applies when <tt>{@link Ext.form.TriggerField#editable editable} = true</tt> (defaults to
+     * <tt>false</tt>).
+     */
+    selectOnFocus : false,
+    /**
+     * @cfg {String} queryParam Name of the query ({@link Ext.data.Store#baseParam baseParam} name for the store)
+     * as it will be passed on the querystring (defaults to <tt>'query'</tt>)
+     */
+    queryParam : 'query',
+    /**
+     * @cfg {String} loadingText The text to display in the dropdown list while data is loading.  Only applies
+     * when <tt>{@link #mode} = 'remote'</tt> (defaults to <tt>'Loading...'</tt>)
+     */
+    loadingText : 'Loading...',
+    /**
+     * @cfg {Boolean} resizable <tt>true</tt> to add a resize handle to the bottom of the dropdown list
+     * (creates an {@link Ext.Resizable} with 'se' {@link Ext.Resizable#pinned pinned} handles).
+     * Defaults to <tt>false</tt>.
+     */
+    resizable : false,
+    /**
+     * @cfg {Number} handleHeight The height in pixels of the dropdown list resize handle if
+     * <tt>{@link #resizable} = true</tt> (defaults to <tt>8</tt>)
+     */
+    handleHeight : 8,
+    /**
+     * @cfg {String} allQuery The text query to send to the server to return all records for the list
+     * with no filtering (defaults to '')
+     */
+    allQuery: '',
+    /**
+     * @cfg {String} mode Acceptable values are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>'remote'</tt></b> : <b>Default</b>
+     * <p class="sub-desc">Automatically loads the <tt>{@link #store}</tt> the <b>first</b> time the trigger
+     * is clicked. If you do not want the store to be automatically loaded the first time the trigger is
+     * clicked, set to <tt>'local'</tt> and manually load the store.  To force a requery of the store
+     * <b>every</b> time the trigger is clicked see <tt>{@link #lastQuery}</tt>.</p></li>
+     * <li><b><tt>'local'</tt></b> :
+     * <p class="sub-desc">ComboBox loads local data</p>
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    renderTo: document.body,
+    mode: 'local',
+    store: new Ext.data.ArrayStore({
+        id: 0,
+        fields: [
+            'myId',  // numeric value is the key
+            'displayText'
+        ],
+        data: [[1, 'item1'], [2, 'item2']]  // data is local
+    }),
+    valueField: 'myId',
+    displayField: 'displayText',
+    triggerAction: 'all'
+});
+     * </code></pre></li>
+     * </ul></div>
+     */
+    mode: 'remote',
+    /**
+     * @cfg {Number} minListWidth The minimum width of the dropdown list in pixels (defaults to <tt>70</tt>, will
+     * be ignored if <tt>{@link #listWidth}</tt> has a higher value)
+     */
+    minListWidth : 70,
+    /**
+     * @cfg {Boolean} forceSelection <tt>true</tt> to restrict the selected value to one of the values in the list,
+     * <tt>false</tt> to allow the user to set arbitrary text into the field (defaults to <tt>false</tt>)
+     */
+    forceSelection : false,
+    /**
+     * @cfg {Number} typeAheadDelay The length of time in milliseconds to wait until the typeahead text is displayed
+     * if <tt>{@link #typeAhead} = true</tt> (defaults to <tt>250</tt>)
+     */
+    typeAheadDelay : 250,
+    /**
+     * @cfg {String} valueNotFoundText When using a name/value combo, if the value passed to setValue is not found in
+     * the store, valueNotFoundText will be displayed as the field text if defined (defaults to undefined). If this
+     * default text is used, it means there is no value set and no validation will occur on this field.
+     */
+
+    /**
+     * @cfg {Boolean} lazyInit <tt>true</tt> to not initialize the list for this combo until the field is focused
+     * (defaults to <tt>true</tt>)
+     */
+    lazyInit : true,
+
+    /**
+     * @cfg {Boolean} clearFilterOnReset <tt>true</tt> to clear any filters on the store (when in local mode) when reset is called
+     * (defaults to <tt>true</tt>)
+     */
+    clearFilterOnReset : true,
+
+    /**
+     * @cfg {Boolean} submitValue False to clear the name attribute on the field so that it is not submitted during a form post.
+     * If a hiddenName is specified, setting this to true will cause both the hidden field and the element to be submitted.
+     * Defaults to <tt>undefined</tt>.
+     */
+    submitValue: undefined,
+
+    /**
+     * The value of the match string used to filter the store. Delete this property to force a requery.
+     * Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'remote',
+    ...
+    listeners: {
+        // delete the previous query in the beforequery event or set
+        // combo.lastQuery = null (this will reload the store the next time it expands)
+        beforequery: function(qe){
+            delete qe.combo.lastQuery;
+        }
+    }
+});
+     * </code></pre>
+     * To make sure the filter in the store is not cleared the first time the ComboBox trigger is used
+     * configure the combo with <tt>lastQuery=''</tt>. Example use:
+     * <pre><code>
+var combo = new Ext.form.ComboBox({
+    ...
+    mode: 'local',
+    triggerAction: 'all',
+    lastQuery: ''
+});
+     * </code></pre>
+     * @property lastQuery
+     * @type String
+     */
+
+    // private
+    initComponent : function(){
+        Ext.form.ComboBox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event expand
+             * Fires when the dropdown list is expanded
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'expand',
+            /**
+             * @event collapse
+             * Fires when the dropdown list is collapsed
+             * @param {Ext.form.ComboBox} combo This combo box
+             */
+            'collapse',
+
+            /**
+             * @event beforeselect
+             * Fires before a list item is selected. Return false to cancel the selection.
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'beforeselect',
+            /**
+             * @event select
+             * Fires when a list item is selected
+             * @param {Ext.form.ComboBox} combo This combo box
+             * @param {Ext.data.Record} record The data record returned from the underlying store
+             * @param {Number} index The index of the selected item in the dropdown list
+             */
+            'select',
+            /**
+             * @event beforequery
+             * Fires before all queries are processed. Return false to cancel the query or set the queryEvent's
+             * cancel property to true.
+             * @param {Object} queryEvent An object that has these properties:<ul>
+             * <li><code>combo</code> : Ext.form.ComboBox <div class="sub-desc">This combo box</div></li>
+             * <li><code>query</code> : String <div class="sub-desc">The query</div></li>
+             * <li><code>forceAll</code> : Boolean <div class="sub-desc">True to force "all" query</div></li>
+             * <li><code>cancel</code> : Boolean <div class="sub-desc">Set to true to cancel the query</div></li>
+             * </ul>
+             */
+            'beforequery'
+        );
+        if(this.transform){
+            var s = Ext.getDom(this.transform);
+            if(!this.hiddenName){
+                this.hiddenName = s.name;
+            }
+            if(!this.store){
+                this.mode = 'local';
+                var d = [], opts = s.options;
+                for(var i = 0, len = opts.length;i < len; i++){
+                    var o = opts[i],
+                        value = (o.hasAttribute ? o.hasAttribute('value') : o.getAttributeNode('value').specified) ? o.value : o.text;
+                    if(o.selected && Ext.isEmpty(this.value, true)) {
+                        this.value = value;
+                    }
+                    d.push([value, o.text]);
+                }
+                this.store = new Ext.data.ArrayStore({
+                    idIndex: 0,
+                    fields: ['value', 'text'],
+                    data : d,
+                    autoDestroy: true
+                });
+                this.valueField = 'value';
+                this.displayField = 'text';
+            }
+            s.name = Ext.id(); // wipe out the name in case somewhere else they have a reference
+            if(!this.lazyRender){
+                this.target = true;
+                this.el = Ext.DomHelper.insertBefore(s, this.autoCreate || this.defaultAutoCreate);
+                this.render(this.el.parentNode, s);
+            }
+            Ext.removeNode(s);
+        }
+        //auto-configure store from local array data
+        else if(this.store){
+            this.store = Ext.StoreMgr.lookup(this.store);
+            if(this.store.autoCreated){
+                this.displayField = this.valueField = 'field1';
+                if(!this.store.expandData){
+                    this.displayField = 'field2';
+                }
+                this.mode = 'local';
+            }
+        }
+
+        this.selectedIndex = -1;
+        if(this.mode == 'local'){
+            if(!Ext.isDefined(this.initialConfig.queryDelay)){
+                this.queryDelay = 10;
+            }
+            if(!Ext.isDefined(this.initialConfig.minChars)){
+                this.minChars = 0;
+            }
+        }
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(this.hiddenName && !Ext.isDefined(this.submitValue)){
+            this.submitValue = false;
+        }
+        Ext.form.ComboBox.superclass.onRender.call(this, ct, position);
+        if(this.hiddenName){
+            this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName,
+                    id: (this.hiddenId || Ext.id())}, 'before', true);
+
+        }
+        if(Ext.isGecko){
+            this.el.dom.setAttribute('autocomplete', 'off');
+        }
+
+        if(!this.lazyInit){
+            this.initList();
+        }else{
+            this.on('focus', this.initList, this, {single: true});
+        }
+    },
+
+    // private
+    initValue : function(){
+        Ext.form.ComboBox.superclass.initValue.call(this);
+        if(this.hiddenField){
+            this.hiddenField.value =
+                Ext.value(Ext.isDefined(this.hiddenValue) ? this.hiddenValue : this.value, '');
+        }
+    },
+
+    getParentZIndex : function(){
+        var zindex;
+        if (this.ownerCt){
+            this.findParentBy(function(ct){
+                zindex = parseInt(ct.getPositionEl().getStyle('z-index'), 10);
+                return !!zindex;
+            });
+        }
+        return zindex;
+    },
+    
+    getZIndex : function(listParent){
+        listParent = listParent || Ext.getDom(this.getListParent() || Ext.getBody());
+        var zindex = parseInt(Ext.fly(listParent).getStyle('z-index'), 10);
+        if(!zindex){
+            zindex = this.getParentZIndex();
+        }
+        return (zindex || 12000) + 5;
+    },
+
+    // private
+    initList : function(){
+        if(!this.list){
+            var cls = 'x-combo-list',
+                listParent = Ext.getDom(this.getListParent() || Ext.getBody());
+
+            this.list = new Ext.Layer({
+                parentEl: listParent,
+                shadow: this.shadow,
+                cls: [cls, this.listClass].join(' '),
+                constrain:false,
+                zindex: this.getZIndex(listParent)
+            });
+
+            var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
+            this.list.setSize(lw, 0);
+            this.list.swallowEvent('mousewheel');
+            this.assetHeight = 0;
+            if(this.syncFont !== false){
+                this.list.setStyle('font-size', this.el.getStyle('font-size'));
+            }
+            if(this.title){
+                this.header = this.list.createChild({cls:cls+'-hd', html: this.title});
+                this.assetHeight += this.header.getHeight();
+            }
+
+            this.innerList = this.list.createChild({cls:cls+'-inner'});
+            this.mon(this.innerList, 'mouseover', this.onViewOver, this);
+            this.mon(this.innerList, 'mousemove', this.onViewMove, this);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+
+            if(this.pageSize){
+                this.footer = this.list.createChild({cls:cls+'-ft'});
+                this.pageTb = new Ext.PagingToolbar({
+                    store: this.store,
+                    pageSize: this.pageSize,
+                    renderTo:this.footer
+                });
+                this.assetHeight += this.footer.getHeight();
+            }
+
+            if(!this.tpl){
+                /**
+                * @cfg {String/Ext.XTemplate} tpl <p>The template string, or {@link Ext.XTemplate} instance to
+                * use to display each item in the dropdown list. The dropdown list is displayed in a
+                * DataView. See {@link #view}.</p>
+                * <p>The default template string is:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div class="x-combo-list-item">{' + this.displayField + '}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>Override the default value to create custom UI layouts for items in the list.
+                * For example:</p><pre><code>
+                  '&lt;tpl for=".">&lt;div ext:qtip="{state}. {nick}" class="x-combo-list-item">{state}&lt;/div>&lt;/tpl>'
+                * </code></pre>
+                * <p>The template <b>must</b> contain one or more substitution parameters using field
+                * names from the Combo's</b> {@link #store Store}. In the example above an
+                * <pre>ext:qtip</pre> attribute is added to display other fields from the Store.</p>
+                * <p>To preserve the default visual look of list items, add the CSS class name
+                * <pre>x-combo-list-item</pre> to the template's container element.</p>
+                * <p>Also see {@link #itemSelector} for additional details.</p>
+                */
+                this.tpl = '<tpl for="."><div class="'+cls+'-item">{' + this.displayField + '}</div></tpl>';
+                /**
+                 * @cfg {String} itemSelector
+                 * <p>A simple CSS selector (e.g. div.some-class or span:first-child) that will be
+                 * used to determine what nodes the {@link #view Ext.DataView} which handles the dropdown
+                 * display will be working with.</p>
+                 * <p><b>Note</b>: this setting is <b>required</b> if a custom XTemplate has been
+                 * specified in {@link #tpl} which assigns a class other than <pre>'x-combo-list-item'</pre>
+                 * to dropdown list items</b>
+                 */
+            }
+
+            /**
+            * The {@link Ext.DataView DataView} used to display the ComboBox's options.
+            * @type Ext.DataView
+            */
+            this.view = new Ext.DataView({
+                applyTo: this.innerList,
+                tpl: this.tpl,
+                singleSelect: true,
+                selectedClass: this.selectedClass,
+                itemSelector: this.itemSelector || '.' + cls + '-item',
+                emptyText: this.listEmptyText,
+                deferEmptyText: false
+            });
+
+            this.mon(this.view, {
+                containerclick : this.onViewClick,
+                click : this.onViewClick,
+                scope :this
+            });
+
+            this.bindStore(this.store, true);
+
+            if(this.resizable){
+                this.resizer = new Ext.Resizable(this.list,  {
+                   pinned:true, handles:'se'
+                });
+                this.mon(this.resizer, 'resize', function(r, w, h){
+                    this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;
+                    this.listWidth = w;
+                    this.innerList.setWidth(w - this.list.getFrameWidth('lr'));
+                    this.restrictHeight();
+                }, this);
+
+                this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');
+            }
+        }
+    },
+
+    /**
+     * <p>Returns the element used to house this ComboBox's pop-up list. Defaults to the document body.</p>
+     * A custom implementation may be provided as a configuration option if the floating list needs to be rendered
+     * to a different Element. An example might be rendering the list inside a Menu so that clicking
+     * the list does not hide the Menu:<pre><code>
+var store = new Ext.data.ArrayStore({
+    autoDestroy: true,
+    fields: ['initials', 'fullname'],
+    data : [
+        ['FF', 'Fred Flintstone'],
+        ['BR', 'Barney Rubble']
+    ]
+});
+
+var combo = new Ext.form.ComboBox({
+    store: store,
+    displayField: 'fullname',
+    emptyText: 'Select a name...',
+    forceSelection: true,
+    getListParent: function() {
+        return this.el.up('.x-menu');
+    },
+    iconCls: 'no-icon', //use iconCls if placing within menu to shift to right side of menu
+    mode: 'local',
+    selectOnFocus: true,
+    triggerAction: 'all',
+    typeAhead: true,
+    width: 135
+});
+
+var menu = new Ext.menu.Menu({
+    id: 'mainMenu',
+    items: [
+        combo // A Field in a Menu
+    ]
+});
+</code></pre>
+     */
+    getListParent : function() {
+        return document.body;
+    },
+
+    /**
+     * Returns the store associated with this combo.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    // private
+    bindStore : function(store, initial){
+        if(this.store && !initial){
+            if(this.store !== store && this.store.autoDestroy){
+                this.store.destroy();
+            }else{
+                this.store.un('beforeload', this.onBeforeLoad, this);
+                this.store.un('load', this.onLoad, this);
+                this.store.un('exception', this.collapse, this);
+            }
+            if(!store){
+                this.store = null;
+                if(this.view){
+                    this.view.bindStore(null);
+                }
+                if(this.pageTb){
+                    this.pageTb.bindStore(null);
+                }
+            }
+        }
+        if(store){
+            if(!initial) {
+                this.lastQuery = null;
+                if(this.pageTb) {
+                    this.pageTb.bindStore(store);
+                }
+            }
+
+            this.store = Ext.StoreMgr.lookup(store);
+            this.store.on({
+                scope: this,
+                beforeload: this.onBeforeLoad,
+                load: this.onLoad,
+                exception: this.collapse
+            });
+
+            if(this.view){
+                this.view.bindStore(store);
+            }
+        }
+    },
+
+    reset : function(){
+        if(this.clearFilterOnReset && this.mode == 'local'){
+            this.store.clearFilter();
+        }
+        Ext.form.ComboBox.superclass.reset.call(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.ComboBox.superclass.initEvents.call(this);
+
+        /**
+         * @property keyNav
+         * @type Ext.KeyNav
+         * <p>A {@link Ext.KeyNav KeyNav} object which handles navigation keys for this ComboBox. This performs actions
+         * based on keystrokes typed when the input field is focused.</p>
+         * <p><b>After the ComboBox has been rendered</b>, you may override existing navigation key functionality,
+         * or add your own based upon key names as specified in the {@link Ext.KeyNav KeyNav} class.</p>
+         * <p>The function is executed in the scope (<code>this</code> reference of the ComboBox. Example:</p><pre><code>
+myCombo.keyNav.esc = function(e) {  // Override ESC handling function
+    this.collapse();                // Standard behaviour of Ext's ComboBox.
+    this.setValue(this.startValue); // We reset to starting value on ESC
+};
+myCombo.keyNav.tab = function() {   // Override TAB handling function
+    this.onViewClick(false);        // Select the currently highlighted row
+};
+</code></pre>
+         */
+        this.keyNav = new Ext.KeyNav(this.el, {
+            "up" : function(e){
+                this.inKeyMode = true;
+                this.selectPrev();
+            },
+
+            "down" : function(e){
+                if(!this.isExpanded()){
+                    this.onTriggerClick();
+                }else{
+                    this.inKeyMode = true;
+                    this.selectNext();
+                }
+            },
+
+            "enter" : function(e){
+                this.onViewClick();
+            },
+
+            "esc" : function(e){
+                this.collapse();
+            },
+
+            "tab" : function(e){
+                if (this.forceSelection === true) {
+                    this.collapse();
+                } else {
+                    this.onViewClick(false);
+                }
+                return true;
+            },
+
+            scope : this,
+
+            doRelay : function(e, h, hname){
+                if(hname == 'down' || this.scope.isExpanded()){
+                    // this MUST be called before ComboBox#fireKey()
+                    var relay = Ext.KeyNav.prototype.doRelay.apply(this, arguments);
+                    if(!Ext.isIE && Ext.EventManager.useKeydown){
+                        // call Combo#fireKey() for browsers which use keydown event (except IE)
+                        this.scope.fireKey(e);
+                    }
+                    return relay;
+                }
+                return true;
+            },
+
+            forceKeyDown : true,
+            defaultEventAction: 'stopEvent'
+        });
+        this.queryDelay = Math.max(this.queryDelay || 10,
+                this.mode == 'local' ? 10 : 250);
+        this.dqTask = new Ext.util.DelayedTask(this.initQuery, this);
+        if(this.typeAhead){
+            this.taTask = new Ext.util.DelayedTask(this.onTypeAhead, this);
+        }
+        if(!this.enableKeyEvents){
+            this.mon(this.el, 'keyup', this.onKeyUp, this);
+        }
+    },
+
+
+    // private
+    onDestroy : function(){
+        if (this.dqTask){
+            this.dqTask.cancel();
+            this.dqTask = null;
+        }
+        this.bindStore(null);
+        Ext.destroy(
+            this.resizer,
+            this.view,
+            this.pageTb,
+            this.list
+        );
+        Ext.destroyMembers(this, 'hiddenField');
+        Ext.form.ComboBox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    fireKey : function(e){
+        if (!this.isExpanded()) {
+            Ext.form.ComboBox.superclass.fireKey.call(this, e);
+        }
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.ComboBox.superclass.onResize.apply(this, arguments);
+        if(!isNaN(w) && this.isVisible() && this.list){
+            this.doResize(w);
+        }else{
+            this.bufferSize = w;
+        }
+    },
+
+    doResize: function(w){
+        if(!Ext.isDefined(this.listWidth)){
+            var lw = Math.max(w, this.minListWidth);
+            this.list.setWidth(lw);
+            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.form.ComboBox.superclass.onEnable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = false;
+        }
+    },
+
+    // private
+    onDisable : function(){
+        Ext.form.ComboBox.superclass.onDisable.apply(this, arguments);
+        if(this.hiddenField){
+            this.hiddenField.disabled = true;
+        }
+    },
+
+    // private
+    onBeforeLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        this.innerList.update(this.loadingText ?
+               '<div class="loading-indicator">'+this.loadingText+'</div>' : '');
+        this.restrictHeight();
+        this.selectedIndex = -1;
+    },
+
+    // private
+    onLoad : function(){
+        if(!this.hasFocus){
+            return;
+        }
+        if(this.store.getCount() > 0 || this.listEmptyText){
+            this.expand();
+            this.restrictHeight();
+            if(this.lastQuery == this.allQuery){
+                if(this.editable){
+                    this.el.dom.select();
+                }
+
+                if(this.autoSelect !== false && !this.selectByValue(this.value, true)){
+                    this.select(0, true);
+                }
+            }else{
+                if(this.autoSelect !== false){
+                    this.selectNext();
+                }
+                if(this.typeAhead && this.lastKey != Ext.EventObject.BACKSPACE && this.lastKey != Ext.EventObject.DELETE){
+                    this.taTask.delay(this.typeAheadDelay);
+                }
+            }
+        }else{
+            this.collapse();
+        }
+
+    },
+
+    // private
+    onTypeAhead : function(){
+        if(this.store.getCount() > 0){
+            var r = this.store.getAt(0);
+            var newValue = r.data[this.displayField];
+            var len = newValue.length;
+            var selStart = this.getRawValue().length;
+            if(selStart != len){
+                this.setRawValue(newValue);
+                this.selectText(selStart, newValue.length);
+            }
+        }
+    },
+
+    // private
+    assertValue : function(){
+        var val = this.getRawValue(),
+            rec;
+
+        if(this.valueField && Ext.isDefined(this.value)){
+            rec = this.findRecord(this.valueField, this.value);
+        }
+        if(!rec || rec.get(this.displayField) != val){
+            rec = this.findRecord(this.displayField, val);
+        }
+        if(!rec && this.forceSelection){
+            if(val.length > 0 && val != this.emptyText){
+                this.el.dom.value = Ext.value(this.lastSelectionText, '');
+                this.applyEmptyText();
+            }else{
+                this.clearValue();
+            }
+        }else{
+            if(rec && this.valueField){
+                // onSelect may have already set the value and by doing so
+                // set the display field properly.  Let's not wipe out the
+                // valueField here by just sending the displayField.
+                if (this.value == val){
+                    return;
+                }
+                val = rec.get(this.valueField || this.displayField);
+            }
+            this.setValue(val);
+        }
+    },
+
+    // private
+    onSelect : function(record, index){
+        if(this.fireEvent('beforeselect', this, record, index) !== false){
+            this.setValue(record.data[this.valueField || this.displayField]);
+            this.collapse();
+            this.fireEvent('select', this, record, index);
+        }
+    },
+
+    // inherit docs
+    getName: function(){
+        var hf = this.hiddenField;
+        return hf && hf.name ? hf.name : this.hiddenName || Ext.form.ComboBox.superclass.getName.call(this);
+    },
+
+    /**
+     * Returns the currently selected field value or empty string if no value is set.
+     * @return {String} value The selected value
+     */
+    getValue : function(){
+        if(this.valueField){
+            return Ext.isDefined(this.value) ? this.value : '';
+        }else{
+            return Ext.form.ComboBox.superclass.getValue.call(this);
+        }
+    },
+
+    /**
+     * Clears any text/value currently set in the field
+     */
+    clearValue : function(){
+        if(this.hiddenField){
+            this.hiddenField.value = '';
+        }
+        this.setRawValue('');
+        this.lastSelectionText = '';
+        this.applyEmptyText();
+        this.value = '';
+    },
+
+    /**
+     * Sets the specified value into the field.  If the value finds a match, the corresponding record text
+     * will be displayed in the field.  If the value does not match the data value of an existing item,
+     * and the valueNotFoundText config option is defined, it will be displayed as the default field text.
+     * Otherwise the field will be blank (although the value will still be set).
+     * @param {String} value The value to match
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var text = v;
+        if(this.valueField){
+            var r = this.findRecord(this.valueField, v);
+            if(r){
+                text = r.data[this.displayField];
+            }else if(Ext.isDefined(this.valueNotFoundText)){
+                text = this.valueNotFoundText;
+            }
+        }
+        this.lastSelectionText = text;
+        if(this.hiddenField){
+            this.hiddenField.value = Ext.value(v, '');
+        }
+        Ext.form.ComboBox.superclass.setValue.call(this, text);
+        this.value = v;
+        return this;
+    },
+
+    // private
+    findRecord : function(prop, value){
+        var record;
+        if(this.store.getCount() > 0){
+            this.store.each(function(r){
+                if(r.data[prop] == value){
+                    record = r;
+                    return false;
+                }
+            });
+        }
+        return record;
+    },
+
+    // private
+    onViewMove : function(e, t){
+        this.inKeyMode = false;
+    },
+
+    // private
+    onViewOver : function(e, t){
+        if(this.inKeyMode){ // prevent key nav and mouse over conflicts
+            return;
+        }
+        var item = this.view.findItemFromChild(t);
+        if(item){
+            var index = this.view.indexOf(item);
+            this.select(index, false);
+        }
+    },
+
+    // private
+    onViewClick : function(doFocus){
+        var index = this.view.getSelectedIndexes()[0],
+            s = this.store,
+            r = s.getAt(index);
+        if(r){
+            this.onSelect(r, index);
+        }else {
+            this.collapse();
+        }
+        if(doFocus !== false){
+            this.el.focus();
+        }
+    },
+
+
+    // private
+    restrictHeight : function(){
+        this.innerList.dom.style.height = '';
+        var inner = this.innerList.dom,
+            pad = this.list.getFrameWidth('tb') + (this.resizable ? this.handleHeight : 0) + this.assetHeight,
+            h = Math.max(inner.clientHeight, inner.offsetHeight, inner.scrollHeight),
+            ha = this.getPosition()[1]-Ext.getBody().getScroll().top,
+            hb = Ext.lib.Dom.getViewHeight()-ha-this.getSize().height,
+            space = Math.max(ha, hb, this.minHeight || 0)-this.list.shadowOffset-pad-5;
+
+        h = Math.min(h, space, this.maxHeight);
+
+        this.innerList.setHeight(h);
+        this.list.beginUpdate();
+        this.list.setHeight(h+pad);
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+        this.list.endUpdate();
+    },
+
+    /**
+     * Returns true if the dropdown list is expanded, else false.
+     */
+    isExpanded : function(){
+        return this.list && this.list.isVisible();
+    },
+
+    /**
+     * Select an item in the dropdown list by its data value. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {String} value The data value of the item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     * @return {Boolean} True if the value matched an item in the list, else false
+     */
+    selectByValue : function(v, scrollIntoView){
+        if(!Ext.isEmpty(v, true)){
+            var r = this.findRecord(this.valueField || this.displayField, v);
+            if(r){
+                this.select(this.store.indexOf(r), scrollIntoView);
+                return true;
+            }
+        }
+        return false;
+    },
+
+    /**
+     * Select an item in the dropdown list by its numeric index in the list. This function does NOT cause the select event to fire.
+     * The store must be loaded and the list expanded for this function to work, otherwise use setValue.
+     * @param {Number} index The zero-based index of the list item to select
+     * @param {Boolean} scrollIntoView False to prevent the dropdown list from autoscrolling to display the
+     * selected item if it is not currently in view (defaults to true)
+     */
+    select : function(index, scrollIntoView){
+        this.selectedIndex = index;
+        this.view.select(index);
+        if(scrollIntoView !== false){
+            var el = this.view.getNode(index);
+            if(el){
+                this.innerList.scrollChildIntoView(el, false);
+            }
+        }
+
+    },
+
+    // private
+    selectNext : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex < ct-1){
+                this.select(this.selectedIndex+1);
+            }
+        }
+    },
+
+    // private
+    selectPrev : function(){
+        var ct = this.store.getCount();
+        if(ct > 0){
+            if(this.selectedIndex == -1){
+                this.select(0);
+            }else if(this.selectedIndex !== 0){
+                this.select(this.selectedIndex-1);
+            }
+        }
+    },
+
+    // private
+    onKeyUp : function(e){
+        var k = e.getKey();
+        if(this.editable !== false && this.readOnly !== true && (k == e.BACKSPACE || !e.isSpecialKey())){
+
+            this.lastKey = k;
+            this.dqTask.delay(this.queryDelay);
+        }
+        Ext.form.ComboBox.superclass.onKeyUp.call(this, e);
+    },
+
+    // private
+    validateBlur : function(){
+        return !this.list || !this.list.isVisible();
+    },
+
+    // private
+    initQuery : function(){
+        this.doQuery(this.getRawValue());
+    },
+
+    // private
+    beforeBlur : function(){
+        this.assertValue();
+    },
+
+    // private
+    postBlur  : function(){
+        Ext.form.ComboBox.superclass.postBlur.call(this);
+        this.collapse();
+        this.inKeyMode = false;
+    },
+
+    /**
+     * Execute a query to filter the dropdown list.  Fires the {@link #beforequery} event prior to performing the
+     * query allowing the query action to be canceled if needed.
+     * @param {String} query The SQL query to execute
+     * @param {Boolean} forceAll <tt>true</tt> to force the query to execute even if there are currently fewer
+     * characters in the field than the minimum specified by the <tt>{@link #minChars}</tt> config option.  It
+     * also clears any filter previously saved in the current store (defaults to <tt>false</tt>)
+     */
+    doQuery : function(q, forceAll){
+        q = Ext.isEmpty(q) ? '' : q;
+        var qe = {
+            query: q,
+            forceAll: forceAll,
+            combo: this,
+            cancel:false
+        };
+        if(this.fireEvent('beforequery', qe)===false || qe.cancel){
+            return false;
+        }
+        q = qe.query;
+        forceAll = qe.forceAll;
+        if(forceAll === true || (q.length >= this.minChars)){
+            if(this.lastQuery !== q){
+                this.lastQuery = q;
+                if(this.mode == 'local'){
+                    this.selectedIndex = -1;
+                    if(forceAll){
+                        this.store.clearFilter();
+                    }else{
+                        this.store.filter(this.displayField, q);
+                    }
+                    this.onLoad();
+                }else{
+                    this.store.baseParams[this.queryParam] = q;
+                    this.store.load({
+                        params: this.getParams(q)
+                    });
+                    this.expand();
+                }
+            }else{
+                this.selectedIndex = -1;
+                this.onLoad();
+            }
+        }
+    },
+
+    // private
+    getParams : function(q){
+        var params = {},
+            paramNames = this.store.paramNames;
+        if(this.pageSize){
+            params[paramNames.start] = 0;
+            params[paramNames.limit] = this.pageSize;
+        }
+        return params;
+    },
+
+    /**
+     * Hides the dropdown list if it is currently expanded. Fires the {@link #collapse} event on completion.
+     */
+    collapse : function(){
+        if(!this.isExpanded()){
+            return;
+        }
+        this.list.hide();
+        Ext.getDoc().un('mousewheel', this.collapseIf, this);
+        Ext.getDoc().un('mousedown', this.collapseIf, this);
+        this.fireEvent('collapse', this);
+    },
+
+    // private
+    collapseIf : function(e){
+        if(!this.isDestroyed && !e.within(this.wrap) && !e.within(this.list)){
+            this.collapse();
+        }
+    },
+
+    /**
+     * Expands the dropdown list if it is currently hidden. Fires the {@link #expand} event on completion.
+     */
+    expand : function(){
+        if(this.isExpanded() || !this.hasFocus){
+            return;
+        }
+
+        if(this.title || this.pageSize){
+            this.assetHeight = 0;
+            if(this.title){
+                this.assetHeight += this.header.getHeight();
+            }
+            if(this.pageSize){
+                this.assetHeight += this.footer.getHeight();
+            }
+        }
+
+        if(this.bufferSize){
+            this.doResize(this.bufferSize);
+            delete this.bufferSize;
+        }
+        this.list.alignTo.apply(this.list, [this.el].concat(this.listAlign));
+
+        // zindex can change, re-check it and set it if necessary
+        this.list.setZIndex(this.getZIndex());
+        this.list.show();
+        if(Ext.isGecko2){
+            this.innerList.setOverflow('auto'); // necessary for FF 2.0/Mac
+        }
+        this.mon(Ext.getDoc(), {
+            scope: this,
+            mousewheel: this.collapseIf,
+            mousedown: this.collapseIf
+        });
+        this.fireEvent('expand', this);
+    },
+
+    /**
+     * @method onTriggerClick
+     * @hide
+     */
+    // private
+    // Implements the default empty TriggerField.onTriggerClick function
+    onTriggerClick : function(){
+        if(this.readOnly || this.disabled){
+            return;
+        }
+        if(this.isExpanded()){
+            this.collapse();
+            this.el.focus();
+        }else {
+            this.onFocus({});
+            if(this.triggerAction == 'all') {
+                this.doQuery(this.allQuery, true);
+            } else {
+                this.doQuery(this.getRawValue());
+            }
+            this.el.focus();
+        }
+    }
+
+    /**
+     * @hide
+     * @method autoSize
+     */
+    /**
+     * @cfg {Boolean} grow @hide
+     */
+    /**
+     * @cfg {Number} growMin @hide
+     */
+    /**
+     * @cfg {Number} growMax @hide
+     */
+
+});
+Ext.reg('combo', Ext.form.ComboBox);
+/**
+ * @class Ext.form.Checkbox
+ * @extends Ext.form.Field
+ * Single checkbox field.  Can be used as a direct replacement for traditional checkbox fields.
+ * @constructor
+ * Creates a new Checkbox
+ * @param {Object} config Configuration options
+ * @xtype checkbox
+ */
+Ext.form.Checkbox = Ext.extend(Ext.form.Field,  {
+    /**
+     * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
+     */
+    focusClass : undefined,
+    /**
+     * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to 'x-form-field')
+     */
+    fieldClass : 'x-form-field',
+    /**
+     * @cfg {Boolean} checked <tt>true</tt> if the checkbox should render initially checked (defaults to <tt>false</tt>)
+     */
+    checked : false,
+    /**
+     * @cfg {String} boxLabel The text that appears beside the checkbox
+     */
+    boxLabel: '&#160;',
+    /**
+     * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
+     * {tag: 'input', type: 'checkbox', autocomplete: 'off'})
+     */
+    defaultAutoCreate : { tag: 'input', type: 'checkbox', autocomplete: 'off'},
+    /**
+     * @cfg {String} inputValue The value that should go into the generated input element's value attribute
+     */
+    /**
+     * @cfg {Function} handler A function called when the {@link #checked} value changes (can be used instead of
+     * handling the check event). The handler is passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>checkbox</b> : Ext.form.Checkbox<div class="sub-desc">The Checkbox being toggled.</div></li>
+     * <li><b>checked</b> : Boolean<div class="sub-desc">The new checked state of the checkbox.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope An object to use as the scope ('this' reference) of the {@link #handler} function
+     * (defaults to this Checkbox).
+     */
+
+    // private
+    actionMode : 'wrap',
+
+	// private
+    initComponent : function(){
+        Ext.form.Checkbox.superclass.initComponent.call(this);
+        this.addEvents(
+            /**
+             * @event check
+             * Fires when the checkbox is checked or unchecked.
+             * @param {Ext.form.Checkbox} this This checkbox
+             * @param {Boolean} checked The new checked value
+             */
+            'check'
+        );
+    },
+
+    // private
+    onResize : function(){
+        Ext.form.Checkbox.superclass.onResize.apply(this, arguments);
+        if(!this.boxLabel && !this.fieldLabel){
+            this.el.alignTo(this.wrap, 'c-c');
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.form.Checkbox.superclass.initEvents.call(this);
+        this.mon(this.el, {
+            scope: this,
+            click: this.onClick,
+            change: this.onClick
+        });
+    },
+
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * @hide
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking.
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.Checkbox.superclass.onRender.call(this, ct, position);
+        if(this.inputValue !== undefined){
+            this.el.dom.value = this.inputValue;
+        }
+        this.wrap = this.el.wrap({cls: 'x-form-check-wrap'});
+        if(this.boxLabel){
+            this.wrap.createChild({tag: 'label', htmlFor: this.el.id, cls: 'x-form-cb-label', html: this.boxLabel});
+        }
+        if(this.checked){
+            this.setValue(true);
+        }else{
+            this.checked = this.el.dom.checked;
+        }
+        // Need to repaint for IE, otherwise positioning is broken
+        if (Ext.isIE && !Ext.isStrict) {
+            this.wrap.repaint();
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    // private
+    onDestroy : function(){
+        Ext.destroy(this.wrap);
+        Ext.form.Checkbox.superclass.onDestroy.call(this);
+    },
+
+    // private
+    initValue : function() {
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Returns the checked state of the checkbox.
+     * @return {Boolean} True if checked, else false
+     */
+    getValue : function(){
+        if(this.rendered){
+            return this.el.dom.checked;
+        }
+        return this.checked;
+    },
+
+	// private
+    onClick : function(){
+        if(this.el.dom.checked != this.checked){
+            this.setValue(this.el.dom.checked);
+        }
+    },
+
+    /**
+     * Sets the checked state of the checkbox, fires the 'check' event, and calls a
+     * <code>{@link #handler}</code> (if configured).
+     * @param {Boolean/String} checked The following values will check the checkbox:
+     * <code>true, 'true', '1', or 'on'</code>. Any other value will uncheck the checkbox.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+        var checked = this.checked,
+            inputVal = this.inputValue;
+            
+        if (v === false) {
+            this.checked = false;
+        } else {
+            this.checked = (v === true || v === 'true' || v == '1' || (inputVal ? v == inputVal : String(v).toLowerCase() == 'on'));
+        }
+        
+        if(this.rendered){
+            this.el.dom.checked = this.checked;
+            this.el.dom.defaultChecked = this.checked;
+        }
+        if(checked != this.checked){
+            this.fireEvent('check', this, this.checked);
+            if(this.handler){
+                this.handler.call(this.scope || this, this, this.checked);
+            }
+        }
+        return this;
+    }
+});
+Ext.reg('checkbox', Ext.form.Checkbox);
+/**
+ * @class Ext.form.CheckboxGroup
+ * @extends Ext.form.Field
+ * <p>A grouping container for {@link Ext.form.Checkbox} controls.</p>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var myCheckboxGroup = new Ext.form.CheckboxGroup({
+    id:'myGroup',
+    xtype: 'checkboxgroup',
+    fieldLabel: 'Single Column',
+    itemCls: 'x-check-group-alt',
+    // Put all controls in a single column with width 100%
+    columns: 1,
+    items: [
+        {boxLabel: 'Item 1', name: 'cb-col-1'},
+        {boxLabel: 'Item 2', name: 'cb-col-2', checked: true},
+        {boxLabel: 'Item 3', name: 'cb-col-3'}
+    ]
+});
+ * </code></pre>
+ * @constructor
+ * Creates a new CheckboxGroup
+ * @param {Object} config Configuration options
+ * @xtype checkboxgroup
+ */
+Ext.form.CheckboxGroup = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Checkbox Checkbox}es or Checkbox config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {String/Number/Array} columns Specifies the number of columns to use when displaying grouped
+     * checkbox/radio controls using automatic layout.  This config can take several types of values:
+     * <ul><li><b>'auto'</b> : <p class="sub-desc">The controls will be rendered one per column on one row and the width
+     * of each column will be evenly distributed based on the width of the overall field container. This is the default.</p></li>
+     * <li><b>Number</b> : <p class="sub-desc">If you specific a number (e.g., 3) that number of columns will be
+     * created and the contained controls will be automatically distributed based on the value of {@link #vertical}.</p></li>
+     * <li><b>Array</b> : Object<p class="sub-desc">You can also specify an array of column widths, mixing integer
+     * (fixed width) and float (percentage width) values as needed (e.g., [100, .25, .75]). Any integer values will
+     * be rendered first, then any float values will be calculated as a percentage of the remaining space. Float
+     * values do not have to add up to 1 (100%) although if you want the controls to take up the entire field
+     * container you should do so.</p></li></ul>
+     */
+    columns : 'auto',
+    /**
+     * @cfg {Boolean} vertical True to distribute contained controls across columns, completely filling each column
+     * top to bottom before starting on the next column.  The number of controls in each column will be automatically
+     * calculated to keep columns as even as possible.  The default value is false, so that controls will be added
+     * to columns one at a time, completely filling each row left to right before starting on the next row.
+     */
+    vertical : false,
+    /**
+     * @cfg {Boolean} allowBlank False to validate that at least one item in the group is checked (defaults to true).
+     * If no items are selected at validation time, {@link @blankText} will be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails (defaults to "You must
+     * select at least one item in this group")
+     */
+    blankText : "You must select at least one item in this group",
+
+    // private
+    defaultType : 'checkbox',
+
+    // private
+    groupCls : 'x-form-check-group',
+
+    // private
+    initComponent: function(){
+        this.addEvents(
+            /**
+             * @event change
+             * Fires when the state of a child checkbox changes.
+             * @param {Ext.form.CheckboxGroup} this
+             * @param {Array} checked An array containing the checked boxes.
+             */
+            'change'
+        );
+        this.on('change', this.validate, this);
+        Ext.form.CheckboxGroup.superclass.initComponent.call(this);
+    },
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            var panelCfg = {
+                autoEl: {
+                    id: this.id
+                },
+                cls: this.groupCls,
+                layout: 'column',
+                renderTo: ct,
+                bufferResize: false // Default this to false, since it doesn't really have a proper ownerCt.
+            };
+            var colCfg = {
+                xtype: 'container',
+                defaultType: this.defaultType,
+                layout: 'form',
+                defaults: {
+                    hideLabel: true,
+                    anchor: '100%'
+                }
+            };
+
+            if(this.items[0].items){
+
+                // The container has standard ColumnLayout configs, so pass them in directly
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: this.items.length},
+                    defaults: this.defaults,
+                    items: this.items
+                });
+                for(var i=0, len=this.items.length; i<len; i++){
+                    Ext.applyIf(this.items[i], colCfg);
+                }
+
+            }else{
+
+                // The container has field item configs, so we have to generate the column
+                // panels first then move the items into the columns as needed.
+
+                var numCols, cols = [];
+
+                if(typeof this.columns == 'string'){ // 'auto' so create a col per item
+                    this.columns = this.items.length;
+                }
+                if(!Ext.isArray(this.columns)){
+                    var cs = [];
+                    for(var i=0; i<this.columns; i++){
+                        cs.push((100/this.columns)*.01); // distribute by even %
+                    }
+                    this.columns = cs;
+                }
+
+                numCols = this.columns.length;
+
+                // Generate the column configs with the correct width setting
+                for(var i=0; i<numCols; i++){
+                    var cc = Ext.apply({items:[]}, colCfg);
+                    cc[this.columns[i] <= 1 ? 'columnWidth' : 'width'] = this.columns[i];
+                    if(this.defaults){
+                        cc.defaults = Ext.apply(cc.defaults || {}, this.defaults);
+                    }
+                    cols.push(cc);
+                };
+
+                // Distribute the original items into the columns
+                if(this.vertical){
+                    var rows = Math.ceil(this.items.length / numCols), ri = 0;
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        if(i>0 && i%rows==0){
+                            ri++;
+                        }
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ri].items.push(this.items[i]);
+                    };
+                }else{
+                    for(var i=0, len=this.items.length; i<len; i++){
+                        var ci = i % numCols;
+                        if(this.items[i].fieldLabel){
+                            this.items[i].hideLabel = false;
+                        }
+                        cols[ci].items.push(this.items[i]);
+                    };
+                }
+
+                Ext.apply(panelCfg, {
+                    layoutConfig: {columns: numCols},
+                    items: cols
+                });
+            }
+
+            this.panel = new Ext.Container(panelCfg);
+            this.panel.ownerCt = this;
+            this.el = this.panel.getEl();
+
+            if(this.forId && this.itemCls){
+                var l = this.el.up(this.itemCls).child('label', true);
+                if(l){
+                    l.setAttribute('htmlFor', this.forId);
+                }
+            }
+
+            var fields = this.panel.findBy(function(c){
+                return c.isFormField;
+            }, this);
+
+            this.items = new Ext.util.MixedCollection();
+            this.items.addAll(fields);
+        }
+        Ext.form.CheckboxGroup.superclass.onRender.call(this, ct, position);
+    },
+
+    initValue : function(){
+        if(this.value){
+            this.setValue.apply(this, this.buffered ? this.value : [this.value]);
+            delete this.buffered;
+            delete this.value;
+        }
+    },
+
+    afterRender : function(){
+        Ext.form.CheckboxGroup.superclass.afterRender.call(this);
+        this.eachItem(function(item){
+            item.on('check', this.fireChecked, this);
+            item.inGroup = true;
+        });
+    },
+
+    // private
+    doLayout: function(){
+        //ugly method required to layout hidden items
+        if(this.rendered){
+            this.panel.forceLayout = this.ownerCt.forceLayout;
+            this.panel.doLayout();
+        }
+    },
+
+    // private
+    fireChecked: function(){
+        var arr = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                arr.push(item);
+            }
+        });
+        this.fireEvent('change', this, arr);
+    },
+    
+    /**
+     * Runs CheckboxGroup's validations and returns an array of any errors. The only error by default
+     * is if allowBlank is set to true and no items are checked.
+     * @return {Array} Array of all validation errors
+     */
+    getErrors: function() {
+        var errors = Ext.form.CheckboxGroup.superclass.getErrors.apply(this, arguments);
+        
+        if (!this.allowBlank) {
+            var blank = true;
+            
+            this.eachItem(function(f){
+                if (f.checked) {
+                    return (blank = false);
+                }
+            });
+            
+            if (blank) errors.push(this.blankText);
+        }
+        
+        return errors;
+    },
+
+    // private
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        
+        return dirty;
+    },
+
+    // private
+    setReadOnly : function(readOnly){
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    // private
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    // private
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        this.panel.setSize(w, h);
+        this.panel.doLayout();
+    },
+
+    // inherit docs from Field
+    reset : function(){
+        if (this.originalValue) {
+            // Clear all items
+            this.eachItem(function(c){
+                if(c.setValue){
+                    c.setValue(false);
+                    c.originalValue = c.getValue();
+                }
+            });
+            // Set items stored in originalValue, ugly - set a flag to reset the originalValue
+            // during the horrible onSetValue.  This will allow trackResetOnLoad to function.
+            this.resetOriginal = true;
+            this.setValue(this.originalValue);
+            delete this.resetOriginal;
+        } else {
+            this.eachItem(function(c){
+                if(c.reset){
+                    c.reset();
+                }
+            });
+        }
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+
+    /**
+     * {@link Ext.form.Checkbox#setValue Set the value(s)} of an item or items
+     * in the group. Examples illustrating how this method may be called:
+     * <pre><code>
+// call with name and value
+myCheckboxGroup.setValue('cb-col-1', true);
+// call with an array of boolean values
+myCheckboxGroup.setValue([true, false, false]);
+// call with an object literal specifying item:value pairs
+myCheckboxGroup.setValue({
+    'cb-col-2': false,
+    'cb-col-3': true
+});
+// use comma separated string to set items with name to true (checked)
+myCheckboxGroup.setValue('cb-col-1,cb-col-3');
+     * </code></pre>
+     * See {@link Ext.form.Checkbox#setValue} for additional information.
+     * @param {Mixed} id The checkbox to check, or as described by example shown.
+     * @param {Boolean} value (optional) The value to set the item.
+     * @return {Ext.form.CheckboxGroup} this
+     */
+    setValue: function(){
+        if(this.rendered){
+            this.onSetValue.apply(this, arguments);
+        }else{
+            this.buffered = true;
+            this.value = arguments;
+        }
+        return this;
+    },
+
+    /**
+     * @private
+     * Sets the values of one or more of the items within the CheckboxGroup
+     * @param {String|Array|Object} id Can take multiple forms. Can be optionally:
+     * <ul>
+     *   <li>An ID string to be used with a second argument</li>
+     *   <li>An array of the form ['some', 'list', 'of', 'ids', 'to', 'mark', 'checked']</li>
+     *   <li>An array in the form [true, true, false, true, false] etc, where each item relates to the check status of
+     *       the checkbox at the same index</li>
+     *   <li>An object containing ids of the checkboxes as keys and check values as properties</li>
+     * </ul>
+     * @param {String} value The value to set the field to if the first argument was a string
+     */
+    onSetValue: function(id, value){
+        if(arguments.length == 1){
+            if(Ext.isArray(id)){
+                Ext.each(id, function(val, idx){
+                    if (Ext.isObject(val) && val.setValue){ // array of checkbox components to be checked
+                        val.setValue(true);
+                        if (this.resetOriginal === true) {
+                            val.originalValue = val.getValue();
+                        }
+                    } else { // an array of boolean values
+                        var item = this.items.itemAt(idx);
+                        if(item){
+                            item.setValue(val);
+                        }
+                    }
+                }, this);
+            }else if(Ext.isObject(id)){
+                // set of name/value pairs
+                for(var i in id){
+                    var f = this.getBox(i);
+                    if(f){
+                        f.setValue(id[i]);
+                    }
+                }
+            }else{
+                this.setValueForItem(id);
+            }
+        }else{
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+            }
+        }
+    },
+
+    // private
+    beforeDestroy: function(){
+        Ext.destroy(this.panel);
+        if (!this.rendered) {
+            Ext.destroy(this.items);
+        }
+        Ext.form.CheckboxGroup.superclass.beforeDestroy.call(this);
+
+    },
+
+    setValueForItem : function(val){
+        val = String(val).split(',');
+        this.eachItem(function(item){
+            if(val.indexOf(item.inputValue)> -1){
+                item.setValue(true);
+            }
+        });
+    },
+
+    // private
+    getBox : function(id){
+        var box = null;
+        this.eachItem(function(f){
+            if(id == f || f.dataIndex == id || f.id == id || f.getName() == id){
+                box = f;
+                return false;
+            }
+        });
+        return box;
+    },
+
+    /**
+     * Gets an array of the selected {@link Ext.form.Checkbox} in the group.
+     * @return {Array} An array of the selected checkboxes.
+     */
+    getValue : function(){
+        var out = [];
+        this.eachItem(function(item){
+            if(item.checked){
+                out.push(item);
+            }
+        });
+        return out;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @cfg {String} name
+     * @hide
+     */
+
+    /**
+     * @method getRawValue
+     * @hide
+     */
+    getRawValue : Ext.emptyFn,
+
+    /**
+     * @method setRawValue
+     * @hide
+     */
+    setRawValue : Ext.emptyFn
+
+});
+
+Ext.reg('checkboxgroup', Ext.form.CheckboxGroup);
+/**
+ * @class Ext.form.CompositeField
+ * @extends Ext.form.Field
+ * Composite field allowing a number of form Fields to be rendered on the same row. The fields are rendered
+ * using an hbox layout internally, so all of the normal HBox layout config items are available. Example usage:
+ * <pre>
+{
+    xtype: 'compositefield',
+    labelWidth: 120
+    items: [
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Title',
+            width     : 20
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'First',
+            flex      : 1
+        },
+        {
+            xtype     : 'textfield',
+            fieldLabel: 'Last',
+            flex      : 1
+        }
+    ]
+}
+ * </pre>
+ * In the example above the composite's fieldLabel will be set to 'Title, First, Last' as it groups the fieldLabels
+ * of each of its children. This can be overridden by setting a fieldLabel on the compositefield itself:
+ * <pre>
+{
+    xtype: 'compositefield',
+    fieldLabel: 'Custom label',
+    items: [...]
+}
+ * </pre>
+ * Any Ext.form.* component can be placed inside a composite field.
+ */
+Ext.form.CompositeField = Ext.extend(Ext.form.Field, {
+
+    /**
+     * @property defaultMargins
+     * @type String
+     * The margins to apply by default to each field in the composite
+     */
+    defaultMargins: '0 5 0 0',
+
+    /**
+     * @property skipLastItemMargin
+     * @type Boolean
+     * If true, the defaultMargins are not applied to the last item in the composite field set (defaults to true)
+     */
+    skipLastItemMargin: true,
+
+    /**
+     * @property isComposite
+     * @type Boolean
+     * Signifies that this is a Composite field
+     */
+    isComposite: true,
+
+    /**
+     * @property combineErrors
+     * @type Boolean
+     * True to combine errors from the individual fields into a single error message at the CompositeField level (defaults to true)
+     */
+    combineErrors: true,
+    
+    /**
+     * @cfg {String} labelConnector The string to use when joining segments of the built label together (defaults to ', ')
+     */
+    labelConnector: ', ',
+    
+    /**
+     * @cfg {Object} defaults Any default properties to assign to the child fields.
+     */
+
+    //inherit docs
+    //Builds the composite field label
+    initComponent: function() {
+        var labels = [],
+            items  = this.items,
+            item;
+
+        for (var i=0, j = items.length; i < j; i++) {
+            item = items[i];
+            
+            if (!Ext.isEmpty(item.ref)){
+                item.ref = '../' + item.ref;
+            }
+
+            labels.push(item.fieldLabel);
+
+            //apply any defaults
+            Ext.applyIf(item, this.defaults);
+
+            //apply default margins to each item except the last
+            if (!(i == j - 1 && this.skipLastItemMargin)) {
+                Ext.applyIf(item, {margins: this.defaultMargins});
+            }
+        }
+
+        this.fieldLabel = this.fieldLabel || this.buildLabel(labels);
+
+        /**
+         * @property fieldErrors
+         * @type Ext.util.MixedCollection
+         * MixedCollection of current errors on the Composite's subfields. This is used internally to track when
+         * to show and hide error messages at the Composite level. Listeners are attached to the MixedCollection's
+         * add, remove and replace events to update the error icon in the UI as errors are added or removed.
+         */
+        this.fieldErrors = new Ext.util.MixedCollection(true, function(item) {
+            return item.field;
+        });
+
+        this.fieldErrors.on({
+            scope  : this,
+            add    : this.updateInvalidMark,
+            remove : this.updateInvalidMark,
+            replace: this.updateInvalidMark
+        });
+
+        Ext.form.CompositeField.superclass.initComponent.apply(this, arguments);
+        
+        this.innerCt = new Ext.Container({
+            layout  : 'hbox',
+            items   : this.items,
+            cls     : 'x-form-composite',
+            defaultMargins: '0 3 0 0',
+            ownerCt: this
+        });
+        this.innerCt.ownerCt = undefined;
+        
+        var fields = this.innerCt.findBy(function(c) {
+            return c.isFormField;
+        }, this);
+
+        /**
+         * @property items
+         * @type Ext.util.MixedCollection
+         * Internal collection of all of the subfields in this Composite
+         */
+        this.items = new Ext.util.MixedCollection();
+        this.items.addAll(fields);
+        
+    },
+
+    /**
+     * @private
+     * Creates an internal container using hbox and renders the fields to it
+     */
+    onRender: function(ct, position) {
+        if (!this.el) {
+            /**
+             * @property innerCt
+             * @type Ext.Container
+             * A container configured with hbox layout which is responsible for laying out the subfields
+             */
+            var innerCt = this.innerCt;
+            innerCt.render(ct);
+
+            this.el = innerCt.getEl();
+
+            //if we're combining subfield errors into a single message, override the markInvalid and clearInvalid
+            //methods of each subfield and show them at the Composite level instead
+            if (this.combineErrors) {
+                this.eachItem(function(field) {
+                    Ext.apply(field, {
+                        markInvalid : this.onFieldMarkInvalid.createDelegate(this, [field], 0),
+                        clearInvalid: this.onFieldClearInvalid.createDelegate(this, [field], 0)
+                    });
+                });
+            }
+
+            //set the label 'for' to the first item
+            var l = this.el.parent().parent().child('label', true);
+            if (l) {
+                l.setAttribute('for', this.items.items[0].id);
+            }
+        }
+
+        Ext.form.CompositeField.superclass.onRender.apply(this, arguments);
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's markInvalid method is called.
+     * By default this just adds the subfield's error to the internal fieldErrors MixedCollection
+     * @param {Ext.form.Field} field The field that was marked invalid
+     * @param {String} message The error message
+     */
+    onFieldMarkInvalid: function(field, message) {
+        var name  = field.getName(),
+            error = {
+                field: name, 
+                errorName: field.fieldLabel || name,
+                error: message
+            };
+
+        this.fieldErrors.replace(name, error);
+
+        if (!field.preventMark) {
+            field.el.addClass(field.invalidClass);
+        }
+    },
+
+    /**
+     * Called if combineErrors is true and a subfield's clearInvalid method is called.
+     * By default this just updates the internal fieldErrors MixedCollection.
+     * @param {Ext.form.Field} field The field that was marked invalid
+     */
+    onFieldClearInvalid: function(field) {
+        this.fieldErrors.removeKey(field.getName());
+
+        field.el.removeClass(field.invalidClass);
+    },
+
+    /**
+     * @private
+     * Called after a subfield is marked valid or invalid, this checks to see if any of the subfields are
+     * currently invalid. If any subfields are invalid it builds a combined error message marks the composite
+     * invalid, otherwise clearInvalid is called
+     */
+    updateInvalidMark: function() {
+        var ieStrict = Ext.isIE6 && Ext.isStrict;
+
+        if (this.fieldErrors.length == 0) {
+            this.clearInvalid();
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.clearInvalid.defer(50, this);
+            }
+        } else {
+            var message = this.buildCombinedErrorMessage(this.fieldErrors.items);
+
+            this.sortErrors();
+            this.markInvalid(message);
+
+            //IE6 in strict mode has a layout bug when using 'under' as the error message target. This fixes it
+            if (ieStrict) {
+                this.markInvalid(message);
+            }
+        }
+    },
+
+    /**
+     * Performs validation checks on each subfield and returns false if any of them fail validation.
+     * @return {Boolean} False if any subfield failed validation
+     */
+    validateValue: function(value, preventMark) {
+        var valid = true;
+
+        this.eachItem(function(field) {
+            if (!field.isValid(preventMark)) {
+                valid = false;
+            }
+        });
+
+        return valid;
+    },
+
+    /**
+     * Takes an object containing error messages for contained fields, returning a combined error
+     * string (defaults to just placing each item on a new line). This can be overridden to provide
+     * custom combined error message handling.
+     * @param {Array} errors Array of errors in format: [{field: 'title', error: 'some error'}]
+     * @return {String} The combined error message
+     */
+    buildCombinedErrorMessage: function(errors) {
+        var combined = [],
+            error;
+
+        for (var i = 0, j = errors.length; i < j; i++) {
+            error = errors[i];
+
+            combined.push(String.format("{0}: {1}", error.errorName, error.error));
+        }
+
+        return combined.join("<br />");
+    },
+
+    /**
+     * Sorts the internal fieldErrors MixedCollection by the order in which the fields are defined.
+     * This is called before displaying errors to ensure that the errors are presented in the expected order.
+     * This function can be overridden to provide a custom sorting order if needed.
+     */
+    sortErrors: function() {
+        var fields = this.items;
+
+        this.fieldErrors.sort("ASC", function(a, b) {
+            var findByName = function(key) {
+                return function(field) {
+                    return field.getName() == key;
+                };
+            };
+
+            var aIndex = fields.findIndexBy(findByName(a.field)),
+                bIndex = fields.findIndexBy(findByName(b.field));
+
+            return aIndex < bIndex ? -1 : 1;
+        });
+    },
+
+    /**
+     * Resets each field in the composite to their previous value
+     */
+    reset: function() {
+        this.eachItem(function(item) {
+            item.reset();
+        });
+
+        // Defer the clearInvalid so if BaseForm's collection is being iterated it will be called AFTER it is complete.
+        // Important because reset is being called on both the group and the individual items.
+        (function() {
+            this.clearInvalid();
+        }).defer(50, this);
+    },
+    
+    /**
+     * Calls clearInvalid on all child fields. This is a convenience function and should not often need to be called
+     * as fields usually take care of clearing themselves
+     */
+    clearInvalidChildren: function() {
+        this.eachItem(function(item) {
+            item.clearInvalid();
+        });
+    },
+
+    /**
+     * Builds a label string from an array of subfield labels.
+     * By default this just joins the labels together with a comma
+     * @param {Array} segments Array of each of the labels in the composite field's subfields
+     * @return {String} The built label
+     */
+    buildLabel: function(segments) {
+        return Ext.clean(segments).join(this.labelConnector);
+    },
+
+    /**
+     * Checks each field in the composite and returns true if any is dirty
+     * @return {Boolean} True if any field is dirty
+     */
+    isDirty: function(){
+        //override the behaviour to check sub items.
+        if (this.disabled || !this.rendered) {
+            return false;
+        }
+
+        var dirty = false;
+        this.eachItem(function(item){
+            if(item.isDirty()){
+                dirty = true;
+                return false;
+            }
+        });
+        return dirty;
+    },
+
+    /**
+     * @private
+     * Convenience function which passes the given function to every item in the composite
+     * @param {Function} fn The function to call
+     * @param {Object} scope Optional scope object
+     */
+    eachItem: function(fn, scope) {
+        if(this.items && this.items.each){
+            this.items.each(fn, scope || this);
+        }
+    },
+
+    /**
+     * @private
+     * Passes the resize call through to the inner panel
+     */
+    onResize: function(adjWidth, adjHeight, rawWidth, rawHeight) {
+        var innerCt = this.innerCt;
+
+        if (this.rendered && innerCt.rendered) {
+            innerCt.setSize(adjWidth, adjHeight);
+        }
+
+        Ext.form.CompositeField.superclass.onResize.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Forces the internal container to be laid out again
+     */
+    doLayout: function(shallow, force) {
+        if (this.rendered) {
+            var innerCt = this.innerCt;
+
+            innerCt.forceLayout = this.ownerCt.forceLayout;
+            innerCt.doLayout(shallow, force);
+        }
+    },
+
+    /**
+     * @private
+     */
+    beforeDestroy: function(){
+        Ext.destroy(this.innerCt);
+
+        Ext.form.CompositeField.superclass.beforeDestroy.call(this);
+    },
+
+    //override the behaviour to check sub items.
+    setReadOnly : function(readOnly) {
+        if (readOnly == undefined) {
+            readOnly = true;
+        }
+        readOnly = !!readOnly;
+
+        if(this.rendered){
+            this.eachItem(function(item){
+                item.setReadOnly(readOnly);
+            });
+        }
+        this.readOnly = readOnly;
+    },
+
+    onShow : function() {
+        Ext.form.CompositeField.superclass.onShow.call(this);
+        this.doLayout();
+    },
+
+    //override the behaviour to check sub items.
+    onDisable : function(){
+        this.eachItem(function(item){
+            item.disable();
+        });
+    },
+
+    //override the behaviour to check sub items.
+    onEnable : function(){
+        this.eachItem(function(item){
+            item.enable();
+        });
+    }
+});
+
+Ext.reg('compositefield', Ext.form.CompositeField);/**
+ * @class Ext.form.Radio
+ * @extends Ext.form.Checkbox
+ * Single radio field.  Same as Checkbox, but provided as a convenience for automatically setting the input type.
+ * Radio grouping is handled automatically by the browser if you give each radio in a group the same name.
+ * @constructor
+ * Creates a new Radio
+ * @param {Object} config Configuration options
+ * @xtype radio
+ */
+Ext.form.Radio = Ext.extend(Ext.form.Checkbox, {
+    inputType: 'radio',
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    /**
+     * If this radio is part of a group, it will return the selected value
+     * @return {String}
+     */
+    getGroupValue : function(){
+    	var p = this.el.up('form') || Ext.getBody();
+        var c = p.child('input[name="'+this.el.dom.name+'"]:checked', true);
+        return c ? c.value : null;
+    },
+
+    /**
+     * Sets either the checked/unchecked status of this Radio, or, if a string value
+     * is passed, checks a sibling Radio of the same name whose value is the value specified.
+     * @param value {String/Boolean} Checked value, or the value of the sibling radio button to check.
+     * @return {Ext.form.Field} this
+     */
+    setValue : function(v){
+    	var checkEl,
+            els,
+            radio;
+    	if (typeof v == 'boolean') {
+            Ext.form.Radio.superclass.setValue.call(this, v);
+        } else if (this.rendered) {
+            checkEl = this.getCheckEl();
+            radio = checkEl.child('input[name="' + this.el.dom.name + '"][value="' + v + '"]', true);
+            if(radio){
+                Ext.getCmp(radio.id).setValue(true);
+            }
+        }
+        if(this.rendered && this.checked){
+            checkEl = checkEl || this.getCheckEl();
+            els = this.getCheckEl().select('input[name="' + this.el.dom.name + '"]');
+			els.each(function(el){
+				if(el.dom.id != this.id){
+					Ext.getCmp(el.dom.id).setValue(false);
+				}
+			}, this);
+        }
+        return this;
+    },
+
+    // private
+    getCheckEl: function(){
+        if(this.inGroup){
+            return this.el.up('.x-form-radio-group');
+        }
+        return this.el.up('form') || Ext.getBody();
+    }
+});
+Ext.reg('radio', Ext.form.Radio);
+/**
+ * @class Ext.form.RadioGroup
+ * @extends Ext.form.CheckboxGroup
+ * A grouping container for {@link Ext.form.Radio} controls.
+ * @constructor
+ * Creates a new RadioGroup
+ * @param {Object} config Configuration options
+ * @xtype radiogroup
+ */
+Ext.form.RadioGroup = Ext.extend(Ext.form.CheckboxGroup, {
+    /**
+     * @cfg {Array} items An Array of {@link Ext.form.Radio Radio}s or Radio config objects
+     * to arrange in the group.
+     */
+    /**
+     * @cfg {Boolean} allowBlank True to allow every item in the group to be blank (defaults to true).
+     * If allowBlank = false and no items are selected at validation time, {@link @blankText} will
+     * be used as the error text.
+     */
+    allowBlank : true,
+    /**
+     * @cfg {String} blankText Error text to display if the {@link #allowBlank} validation fails
+     * (defaults to 'You must select one item in this group')
+     */
+    blankText : 'You must select one item in this group',
+    
+    // private
+    defaultType : 'radio',
+    
+    // private
+    groupCls : 'x-form-radio-group',
+    
+    /**
+     * @event change
+     * Fires when the state of a child radio changes.
+     * @param {Ext.form.RadioGroup} this
+     * @param {Ext.form.Radio} checked The checked radio
+     */
+    
+    /**
+     * Gets the selected {@link Ext.form.Radio} in the group, if it exists.
+     * @return {Ext.form.Radio} The selected radio.
+     */
+    getValue : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        return out;
+    },
+    
+    /**
+     * Sets the checked radio in the group.
+     * @param {String/Ext.form.Radio} id The radio to check.
+     * @param {Boolean} value The value to set the radio.
+     * @return {Ext.form.RadioGroup} this
+     */
+    onSetValue : function(id, value){
+        if(arguments.length > 1){
+            var f = this.getBox(id);
+            if(f){
+                f.setValue(value);
+                if(f.checked){
+                    this.eachItem(function(item){
+                        if (item !== f){
+                            item.setValue(false);
+                        }
+                    });
+                }
+            }
+        }else{
+            this.setValueForItem(id);
+        }
+    },
+    
+    setValueForItem : function(val){
+        val = String(val).split(',')[0];
+        this.eachItem(function(item){
+            item.setValue(val == item.inputValue);
+        });
+    },
+    
+    // private
+    fireChecked : function(){
+        if(!this.checkTask){
+            this.checkTask = new Ext.util.DelayedTask(this.bufferChecked, this);
+        }
+        this.checkTask.delay(10);
+    },
+    
+    // private
+    bufferChecked : function(){
+        var out = null;
+        this.eachItem(function(item){
+            if(item.checked){
+                out = item;
+                return false;
+            }
+        });
+        this.fireEvent('change', this, out);
+    },
+    
+    onDestroy : function(){
+        if(this.checkTask){
+            this.checkTask.cancel();
+            this.checkTask = null;
+        }
+        Ext.form.RadioGroup.superclass.onDestroy.call(this);
+    }
+
+});
+
+Ext.reg('radiogroup', Ext.form.RadioGroup);
+/**
+ * @class Ext.form.Hidden
+ * @extends Ext.form.Field
+ * A basic hidden field for storing hidden values in forms that need to be passed in the form submit.
+ * @constructor
+ * Create a new Hidden field.
+ * @param {Object} config Configuration options
+ * @xtype hidden
+ */
+Ext.form.Hidden = Ext.extend(Ext.form.Field, {
+    // private
+    inputType : 'hidden',
+    
+    shouldLayout: false,
+
+    // private
+    onRender : function(){
+        Ext.form.Hidden.superclass.onRender.apply(this, arguments);
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    // These are all private overrides
+    setSize : Ext.emptyFn,
+    setWidth : Ext.emptyFn,
+    setHeight : Ext.emptyFn,
+    setPosition : Ext.emptyFn,
+    setPagePosition : Ext.emptyFn,
+    markInvalid : Ext.emptyFn,
+    clearInvalid : Ext.emptyFn
+});
+Ext.reg('hidden', Ext.form.Hidden);/**
+ * @class Ext.form.BasicForm
+ * @extends Ext.util.Observable
+ * <p>Encapsulates the DOM &lt;form> element at the heart of the {@link Ext.form.FormPanel FormPanel} class, and provides
+ * input field management, validation, submission, and form loading services.</p>
+ * <p>By default, Ext Forms are submitted through Ajax, using an instance of {@link Ext.form.Action.Submit}.
+ * To enable normal browser submission of an Ext Form, use the {@link #standardSubmit} config option.</p>
+ * <p><b><u>File Uploads</u></b></p>
+ * <p>{@link #fileUpload File uploads} are not performed using Ajax submission, that
+ * is they are <b>not</b> performed using XMLHttpRequests. Instead the form is submitted in the standard
+ * manner with the DOM <tt>&lt;form></tt> element temporarily modified to have its
+ * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+ * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+ * but removed after the return data has been gathered.</p>
+ * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+ * server is using JSON to send the return object, then the
+ * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+ * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+ * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+ * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+ * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+ * is created containing a <tt>responseText</tt> property in order to conform to the
+ * requirements of event handlers and callbacks.</p>
+ * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+ * and some server technologies (notably JEE) may require some custom processing in order to
+ * retrieve parameter names and parameter values from the packet content.</p>
+ * @constructor
+ * @param {Mixed} el The form element or its id
+ * @param {Object} config Configuration options
+ */
+Ext.form.BasicForm = Ext.extend(Ext.util.Observable, {
+
+    constructor: function(el, config){
+        Ext.apply(this, config);
+        if(Ext.isString(this.paramOrder)){
+            this.paramOrder = this.paramOrder.split(/[\s,|]/);
+        }
+        /**
+         * A {@link Ext.util.MixedCollection MixedCollection} containing all the Ext.form.Fields in this form.
+         * @type MixedCollection
+         * @property items
+         */
+        this.items = new Ext.util.MixedCollection(false, function(o){
+            return o.getItemId();
+        });
+        this.addEvents(
+            /**
+             * @event beforeaction
+             * Fires before any action is performed. Return false to cancel the action.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} to be performed
+             */
+            'beforeaction',
+            /**
+             * @event actionfailed
+             * Fires when an action fails.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that failed
+             */
+            'actionfailed',
+            /**
+             * @event actioncomplete
+             * Fires when an action is completed.
+             * @param {Form} this
+             * @param {Action} action The {@link Ext.form.Action} that completed
+             */
+            'actioncomplete'
+        );
+
+        if(el){
+            this.initEl(el);
+        }
+        Ext.form.BasicForm.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {String} method
+     * The request method to use (GET or POST) for form actions if one isn't supplied in the action options.
+     */
+    /**
+     * @cfg {DataReader} reader
+     * An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to read
+     * data when executing 'load' actions. This is optional as there is built-in
+     * support for processing JSON.  For additional information on using an XMLReader
+     * see the example provided in examples/form/xml-form.html.
+     */
+    /**
+     * @cfg {DataReader} errorReader
+     * <p>An Ext.data.DataReader (e.g. {@link Ext.data.XmlReader}) to be used to
+     * read field error messages returned from 'submit' actions. This is optional
+     * as there is built-in support for processing JSON.</p>
+     * <p>The Records which provide messages for the invalid Fields must use the
+     * Field name (or id) as the Record ID, and must contain a field called 'msg'
+     * which contains the error message.</p>
+     * <p>The errorReader does not have to be a full-blown implementation of a
+     * DataReader. It simply needs to implement a <tt>read(xhr)</tt> function
+     * which returns an Array of Records in an object with the following
+     * structure:</p><pre><code>
+{
+    records: recordArray
+}
+</code></pre>
+     */
+    /**
+     * @cfg {String} url
+     * The URL to use for form actions if one isn't supplied in the
+     * <code>{@link #doAction doAction} options</code>.
+     */
+    /**
+     * @cfg {Boolean} fileUpload
+     * Set to true if this form is a file upload.
+     * <p>File uploads are not performed using normal 'Ajax' techniques, that is they are <b>not</b>
+     * performed using XMLHttpRequests. Instead the form is submitted in the standard manner with the
+     * DOM <tt>&lt;form></tt> element temporarily modified to have its
+     * <a href="http://www.w3.org/TR/REC-html40/present/frames.html#adef-target">target</a> set to refer
+     * to a dynamically generated, hidden <tt>&lt;iframe></tt> which is inserted into the document
+     * but removed after the return data has been gathered.</p>
+     * <p>The server response is parsed by the browser to create the document for the IFRAME. If the
+     * server is using JSON to send the return object, then the
+     * <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.17">Content-Type</a> header
+     * must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.</p>
+     * <p>Characters which are significant to an HTML parser must be sent as HTML entities, so encode
+     * "&lt;" as "&amp;lt;", "&amp;" as "&amp;amp;" etc.</p>
+     * <p>The response text is retrieved from the document, and a fake XMLHttpRequest object
+     * is created containing a <tt>responseText</tt> property in order to conform to the
+     * requirements of event handlers and callbacks.</p>
+     * <p>Be aware that file upload packets are sent with the content type <a href="http://www.faqs.org/rfcs/rfc2388.html">multipart/form</a>
+     * and some server technologies (notably JEE) may require some custom processing in order to
+     * retrieve parameter names and parameter values from the packet content.</p>
+     */
+    /**
+     * @cfg {Object} baseParams
+     * <p>Parameters to pass with all requests. e.g. baseParams: {id: '123', foo: 'bar'}.</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+     */
+    /**
+     * @cfg {Number} timeout Timeout for form actions in seconds (default is 30 seconds).
+     */
+    timeout: 30,
+
+    /**
+     * @cfg {Object} api (Optional) If specified load and submit actions will be handled
+     * with {@link Ext.form.Action.DirectLoad} and {@link Ext.form.Action.DirectSubmit}.
+     * Methods which have been imported by Ext.Direct can be specified here to load and submit
+     * forms.
+     * Such as the following:<pre><code>
+api: {
+    load: App.ss.MyProfile.load,
+    submit: App.ss.MyProfile.submit
+}
+</code></pre>
+     * <p>Load actions can use <code>{@link #paramOrder}</code> or <code>{@link #paramsAsHash}</code>
+     * to customize how the load method is invoked.
+     * Submit actions will always use a standard form submit. The formHandler configuration must
+     * be set on the associated server-side method which has been imported by Ext.Direct</p>
+     */
+
+    /**
+     * @cfg {Array/String} paramOrder <p>A list of params to be executed server side.
+     * Defaults to <tt>undefined</tt>. Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration.</p>
+     * <br><p>Specify the params in the order in which they must be executed on the
+     * server-side as either (1) an Array of String values, or (2) a String of params
+     * delimited by either whitespace, comma, or pipe. For example,
+     * any of the following would be acceptable:</p><pre><code>
+paramOrder: ['param1','param2','param3']
+paramOrder: 'param1 param2 param3'
+paramOrder: 'param1,param2,param3'
+paramOrder: 'param1|param2|param'
+     </code></pre>
+     */
+    paramOrder: undefined,
+
+    /**
+     * @cfg {Boolean} paramsAsHash Only used for the <code>{@link #api}</code>
+     * <code>load</code> configuration. Send parameters as a collection of named
+     * arguments (defaults to <tt>false</tt>). Providing a
+     * <tt>{@link #paramOrder}</tt> nullifies this configuration.
+     */
+    paramsAsHash: false,
+
+    /**
+     * @cfg {String} waitTitle
+     * The default title to show for the waiting message box (defaults to <tt>'Please Wait...'</tt>)
+     */
+    waitTitle: 'Please Wait...',
+
+    // private
+    activeAction : null,
+
+    /**
+     * @cfg {Boolean} trackResetOnLoad If set to <tt>true</tt>, {@link #reset}() resets to the last loaded
+     * or {@link #setValues}() data instead of when the form was first created.  Defaults to <tt>false</tt>.
+     */
+    trackResetOnLoad : false,
+
+    /**
+     * @cfg {Boolean} standardSubmit
+     * <p>If set to <tt>true</tt>, standard HTML form submits are used instead
+     * of XHR (Ajax) style form submissions. Defaults to <tt>false</tt>.</p>
+     * <br><p><b>Note:</b> When using <code>standardSubmit</code>, the
+     * <code>options</code> to <code>{@link #submit}</code> are ignored because
+     * Ext's Ajax infrastracture is bypassed. To pass extra parameters (e.g.
+     * <code>baseParams</code> and <code>params</code>), utilize hidden fields
+     * to submit extra data, for example:</p>
+     * <pre><code>
+new Ext.FormPanel({
+    standardSubmit: true,
+    baseParams: {
+        foo: 'bar'
+    },
+    {@link url}: 'myProcess.php',
+    items: [{
+        xtype: 'textfield',
+        name: 'userName'
+    }],
+    buttons: [{
+        text: 'Save',
+        handler: function(){
+            var fp = this.ownerCt.ownerCt,
+                form = fp.getForm();
+            if (form.isValid()) {
+                // check if there are baseParams and if
+                // hiddent items have been added already
+                if (fp.baseParams && !fp.paramsAdded) {
+                    // add hidden items for all baseParams
+                    for (i in fp.baseParams) {
+                        fp.add({
+                            xtype: 'hidden',
+                            name: i,
+                            value: fp.baseParams[i]
+                        });
+                    }
+                    fp.doLayout();
+                    // set a custom flag to prevent re-adding
+                    fp.paramsAdded = true;
+                }
+                form.{@link #submit}();
+            }
+        }
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * By default wait messages are displayed with Ext.MessageBox.wait. You can target a specific
+     * element by passing it or its id or mask the form itself by passing in true.
+     * @type Mixed
+     * @property waitMsgTarget
+     */
+
+    // private
+    initEl : function(el){
+        this.el = Ext.get(el);
+        this.id = this.el.id || Ext.id();
+        if(!this.standardSubmit){
+            this.el.on('submit', this.onSubmit, this);
+        }
+        this.el.addClass('x-form');
+    },
+
+    /**
+     * Get the HTML form Element
+     * @return Ext.Element
+     */
+    getEl: function(){
+        return this.el;
+    },
+
+    // private
+    onSubmit : function(e){
+        e.stopEvent();
+    },
+
+    /**
+     * Destroys this object.
+     * @private
+     * @param {Boolean} bound true if the object is bound to a form panel. If this is the case
+     * the FormPanel will take care of destroying certain things, so we're just doubling up.
+     */
+    destroy: function(bound){
+        if(bound !== true){
+            this.items.each(function(f){
+                Ext.destroy(f);
+            });
+            Ext.destroy(this.el);
+        }
+        this.items.clear();
+        this.purgeListeners();
+    },
+
+    /**
+     * Returns true if client-side validation on the form is successful.
+     * @return Boolean
+     */
+    isValid : function(){
+        var valid = true;
+        this.items.each(function(f){
+           if(!f.validate()){
+               valid = false;
+           }
+        });
+        return valid;
+    },
+
+    /**
+     * <p>Returns true if any fields in this form have changed from their original values.</p>
+     * <p>Note that if this BasicForm was configured with {@link #trackResetOnLoad} then the
+     * Fields' <i>original values</i> are updated when the values are loaded by {@link #setValues}
+     * or {@link #loadRecord}.</p>
+     * @return Boolean
+     */
+    isDirty : function(){
+        var dirty = false;
+        this.items.each(function(f){
+           if(f.isDirty()){
+               dirty = true;
+               return false;
+           }
+        });
+        return dirty;
+    },
+
+    /**
+     * Performs a predefined action ({@link Ext.form.Action.Submit} or
+     * {@link Ext.form.Action.Load}) or a custom extension of {@link Ext.form.Action}
+     * to perform application-specific processing.
+     * @param {String/Object} actionName The name of the predefined action type,
+     * or instance of {@link Ext.form.Action} to perform.
+     * @param {Object} options (optional) The options to pass to the {@link Ext.form.Action}.
+     * All of the config options listed below are supported by both the
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * actions unless otherwise noted (custom actions could also accept
+     * other config options):<ul>
+     *
+     * <li><b>url</b> : String<div class="sub-desc">The url for the action (defaults
+     * to the form's {@link #url}.)</div></li>
+     *
+     * <li><b>method</b> : String<div class="sub-desc">The form method to use (defaults
+     * to the form's method, or POST if not defined)</div></li>
+     *
+     * <li><b>params</b> : String/Object<div class="sub-desc"><p>The params to pass
+     * (defaults to the form's baseParams, or none if not defined)</p>
+     * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p></div></li>
+     *
+     * <li><b>headers</b> : Object<div class="sub-desc">Request headers to set for the action
+     * (defaults to the form's default headers)</div></li>
+     *
+     * <li><b>success</b> : Function<div class="sub-desc">The callback that will
+     * be invoked after a successful response (see top of
+     * {@link Ext.form.Action.Submit submit} and {@link Ext.form.Action.Load load}
+     * for a description of what constitutes a successful response).
+     * The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>failure</b> : Function<div class="sub-desc">The callback that will be invoked after a
+     * failed transaction attempt. The function is passed the following parameters:<ul>
+     * <li><tt>form</tt> : The {@link Ext.form.BasicForm} that requested the action.</li>
+     * <li><tt>action</tt> : The {@link Ext.form.Action Action} object which performed the operation.
+     * <div class="sub-desc">The action object contains these properties of interest:<ul>
+     * <li><tt>{@link Ext.form.Action#failureType failureType}</tt></li>
+     * <li><tt>{@link Ext.form.Action#response response}</tt></li>
+     * <li><tt>{@link Ext.form.Action#result result}</tt> : interrogate for custom postprocessing</li>
+     * <li><tt>{@link Ext.form.Action#type type}</tt></li>
+     * </ul></div></li></ul></div></li>
+     *
+     * <li><b>scope</b> : Object<div class="sub-desc">The scope in which to call the
+     * callback functions (The <tt>this</tt> reference for the callback functions).</div></li>
+     *
+     * <li><b>clientValidation</b> : Boolean<div class="sub-desc">Submit Action only.
+     * Determines whether a Form's fields are validated in a final call to
+     * {@link Ext.form.BasicForm#isValid isValid} prior to submission. Set to <tt>false</tt>
+     * to prevent this. If undefined, pre-submission field validation is performed.</div></li></ul>
+     *
+     * @return {BasicForm} this
+     */
+    doAction : function(action, options){
+        if(Ext.isString(action)){
+            action = new Ext.form.Action.ACTION_TYPES[action](this, options);
+        }
+        if(this.fireEvent('beforeaction', this, action) !== false){
+            this.beforeAction(action);
+            action.run.defer(100, action);
+        }
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Submit submit action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details).<br>
+     * <p><b>Note:</b> this is ignored when using the {@link #standardSubmit} option.</p>
+     * <p>The following code:</p><pre><code>
+myFormPanel.getForm().submit({
+    clientValidation: true,
+    url: 'updateConsignment.php',
+    params: {
+        newStatus: 'delivered'
+    },
+    success: function(form, action) {
+       Ext.Msg.alert('Success', action.result.msg);
+    },
+    failure: function(form, action) {
+        switch (action.failureType) {
+            case Ext.form.Action.CLIENT_INVALID:
+                Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
+                break;
+            case Ext.form.Action.CONNECT_FAILURE:
+                Ext.Msg.alert('Failure', 'Ajax communication failed');
+                break;
+            case Ext.form.Action.SERVER_INVALID:
+               Ext.Msg.alert('Failure', action.result.msg);
+       }
+    }
+});
+</code></pre>
+     * would process the following server response for a successful submission:<pre><code>
+{
+    "success":true, // note this is Boolean, not string
+    "msg":"Consignment updated"
+}
+</code></pre>
+     * and the following server response for a failed submission:<pre><code>
+{
+    "success":false, // note this is Boolean, not string
+    "msg":"You do not have permission to perform this operation"
+}
+</code></pre>
+     * @return {BasicForm} this
+     */
+    submit : function(options){
+        options = options || {};
+        if(this.standardSubmit){
+            var v = options.clientValidation === false || this.isValid();
+            if(v){
+                var el = this.el.dom;
+                if(this.url && Ext.isEmpty(el.action)){
+                    el.action = this.url;
+                }
+                el.submit();
+            }
+            return v;
+        }
+        var submitAction = String.format('{0}submit', this.api ? 'direct' : '');
+        this.doAction(submitAction, options);
+        return this;
+    },
+
+    /**
+     * Shortcut to {@link #doAction do} a {@link Ext.form.Action.Load load action}.
+     * @param {Object} options The options to pass to the action (see {@link #doAction} for details)
+     * @return {BasicForm} this
+     */
+    load : function(options){
+        var loadAction = String.format('{0}load', this.api ? 'direct' : '');
+        this.doAction(loadAction, options);
+        return this;
+    },
+
+    /**
+     * Persists the values in this form into the passed {@link Ext.data.Record} object in a beginEdit/endEdit block.
+     * @param {Record} record The record to edit
+     * @return {BasicForm} this
+     */
+    updateRecord : function(record){
+        record.beginEdit();
+        var fs = record.fields,
+            field,
+            value;
+        fs.each(function(f){
+            field = this.findField(f.name);
+            if(field){
+                value = field.getValue();
+                if (Ext.type(value) !== false && value.getGroupValue) {
+                    value = value.getGroupValue();
+                } else if ( field.eachItem ) {
+                    value = [];
+                    field.eachItem(function(item){
+                        value.push(item.getValue());
+                    });
+                }
+                record.set(f.name, value);
+            }
+        }, this);
+        record.endEdit();
+        return this;
+    },
+
+    /**
+     * Loads an {@link Ext.data.Record} into this form by calling {@link #setValues} with the
+     * {@link Ext.data.Record#data record data}.
+     * See also {@link #trackResetOnLoad}.
+     * @param {Record} record The record to load
+     * @return {BasicForm} this
+     */
+    loadRecord : function(record){
+        this.setValues(record.data);
+        return this;
+    },
+
+    // private
+    beforeAction : function(action){
+        // Call HtmlEditor's syncValue before actions
+        this.items.each(function(f){
+            if(f.isFormField && f.syncValue){
+                f.syncValue();
+            }
+        });
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.mask(o.waitMsg, 'x-mask-loading');
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget = Ext.get(this.waitMsgTarget);
+                this.waitMsgTarget.mask(o.waitMsg, 'x-mask-loading');
+            }else{
+                Ext.MessageBox.wait(o.waitMsg, o.waitTitle || this.waitTitle);
+            }
+        }
+    },
+
+    // private
+    afterAction : function(action, success){
+        this.activeAction = null;
+        var o = action.options;
+        if(o.waitMsg){
+            if(this.waitMsgTarget === true){
+                this.el.unmask();
+            }else if(this.waitMsgTarget){
+                this.waitMsgTarget.unmask();
+            }else{
+                Ext.MessageBox.updateProgress(1);
+                Ext.MessageBox.hide();
+            }
+        }
+        if(success){
+            if(o.reset){
+                this.reset();
+            }
+            Ext.callback(o.success, o.scope, [this, action]);
+            this.fireEvent('actioncomplete', this, action);
+        }else{
+            Ext.callback(o.failure, o.scope, [this, action]);
+            this.fireEvent('actionfailed', this, action);
+        }
+    },
+
+    /**
+     * Find a {@link Ext.form.Field} in this form.
+     * @param {String} id The value to search for (specify either a {@link Ext.Component#id id},
+     * {@link Ext.grid.Column#dataIndex dataIndex}, {@link Ext.form.Field#getName name or hiddenName}).
+     * @return Field
+     */
+    findField : function(id) {
+        var field = this.items.get(id);
+
+        if (!Ext.isObject(field)) {
+            //searches for the field corresponding to the given id. Used recursively for composite fields
+            var findMatchingField = function(f) {
+                if (f.isFormField) {
+                    if (f.dataIndex == id || f.id == id || f.getName() == id) {
+                        field = f;
+                        return false;
+                    } else if (f.isComposite) {
+                        return f.items.each(findMatchingField);
+                    } else if (f instanceof Ext.form.CheckboxGroup && f.rendered) {
+                        return f.eachItem(findMatchingField);
+                    }
+                }
+            };
+
+            this.items.each(findMatchingField);
+        }
+        return field || null;
+    },
+
+
+    /**
+     * Mark fields in this form invalid in bulk.
+     * @param {Array/Object} errors Either an array in the form [{id:'fieldId', msg:'The message'},...] or an object hash of {id: msg, id2: msg2}
+     * @return {BasicForm} this
+     */
+    markInvalid : function(errors){
+        if (Ext.isArray(errors)) {
+            for(var i = 0, len = errors.length; i < len; i++){
+                var fieldError = errors[i];
+                var f = this.findField(fieldError.id);
+                if(f){
+                    f.markInvalid(fieldError.msg);
+                }
+            }
+        } else {
+            var field, id;
+            for(id in errors){
+                if(!Ext.isFunction(errors[id]) && (field = this.findField(id))){
+                    field.markInvalid(errors[id]);
+                }
+            }
+        }
+
+        return this;
+    },
+
+    /**
+     * Set values for fields in this form in bulk.
+     * @param {Array/Object} values Either an array in the form:<pre><code>
+[{id:'clientName', value:'Fred. Olsen Lines'},
+ {id:'portOfLoading', value:'FXT'},
+ {id:'portOfDischarge', value:'OSL'} ]</code></pre>
+     * or an object hash of the form:<pre><code>
+{
+    clientName: 'Fred. Olsen Lines',
+    portOfLoading: 'FXT',
+    portOfDischarge: 'OSL'
+}</code></pre>
+     * @return {BasicForm} this
+     */
+    setValues : function(values){
+        if(Ext.isArray(values)){ // array of objects
+            for(var i = 0, len = values.length; i < len; i++){
+                var v = values[i];
+                var f = this.findField(v.id);
+                if(f){
+                    f.setValue(v.value);
+                    if(this.trackResetOnLoad){
+                        f.originalValue = f.getValue();
+                    }
+                }
+            }
+        }else{ // object hash
+            var field, id;
+            for(id in values){
+                if(!Ext.isFunction(values[id]) && (field = this.findField(id))){
+                    field.setValue(values[id]);
+                    if(this.trackResetOnLoad){
+                        field.originalValue = field.getValue();
+                    }
+                }
+            }
+        }
+        return this;
+    },
+
+    /**
+     * <p>Returns the fields in this form as an object with key/value pairs as they would be submitted using a standard form submit.
+     * If multiple fields exist with the same name they are returned as an array.</p>
+     * <p><b>Note:</b> The values are collected from all enabled HTML input elements within the form, <u>not</u> from
+     * the Ext Field objects. This means that all returned values are Strings (or Arrays of Strings) and that the
+     * value can potentially be the emptyText of a field.</p>
+     * @param {Boolean} asString (optional) Pass true to return the values as a string. (defaults to false, returning an Object)
+     * @return {String/Object}
+     */
+    getValues : function(asString){
+        var fs = Ext.lib.Ajax.serializeForm(this.el.dom);
+        if(asString === true){
+            return fs;
+        }
+        return Ext.urlDecode(fs);
+    },
+
+    /**
+     * Retrieves the fields in the form as a set of key/value pairs, using the {@link Ext.form.Field#getValue getValue()} method.
+     * If multiple fields exist with the same name they are returned as an array.
+     * @param {Boolean} dirtyOnly (optional) True to return only fields that are dirty.
+     * @return {Object} The values in the form
+     */
+    getFieldValues : function(dirtyOnly){
+        var o = {},
+            n,
+            key,
+            val;
+        this.items.each(function(f) {
+            if (!f.disabled && (dirtyOnly !== true || f.isDirty())) {
+                n = f.getName();
+                key = o[n];
+                val = f.getValue();
+
+                if(Ext.isDefined(key)){
+                    if(Ext.isArray(key)){
+                        o[n].push(val);
+                    }else{
+                        o[n] = [key, val];
+                    }
+                }else{
+                    o[n] = val;
+                }
+            }
+        });
+        return o;
+    },
+
+    /**
+     * Clears all invalid messages in this form.
+     * @return {BasicForm} this
+     */
+    clearInvalid : function(){
+        this.items.each(function(f){
+           f.clearInvalid();
+        });
+        return this;
+    },
+
+    /**
+     * Resets this form.
+     * @return {BasicForm} this
+     */
+    reset : function(){
+        this.items.each(function(f){
+            f.reset();
+        });
+        return this;
+    },
+
+    /**
+     * Add Ext.form Components to this form's Collection. This does not result in rendering of
+     * the passed Component, it just enables the form to validate Fields, and distribute values to
+     * Fields.
+     * <p><b>You will not usually call this function. In order to be rendered, a Field must be added
+     * to a {@link Ext.Container Container}, usually an {@link Ext.form.FormPanel FormPanel}.
+     * The FormPanel to which the field is added takes care of adding the Field to the BasicForm's
+     * collection.</b></p>
+     * @param {Field} field1
+     * @param {Field} field2 (optional)
+     * @param {Field} etc (optional)
+     * @return {BasicForm} this
+     */
+    add : function(){
+        this.items.addAll(Array.prototype.slice.call(arguments, 0));
+        return this;
+    },
+
+    /**
+     * Removes a field from the items collection (does NOT remove its markup).
+     * @param {Field} field
+     * @return {BasicForm} this
+     */
+    remove : function(field){
+        this.items.remove(field);
+        return this;
+    },
+
+    /**
+     * Removes all fields from the collection that have been destroyed.
+     */
+    cleanDestroyed : function() {
+        this.items.filterBy(function(o) { return !!o.isDestroyed; }).each(this.remove, this);
+    },
+
+    /**
+     * Iterates through the {@link Ext.form.Field Field}s which have been {@link #add add}ed to this BasicForm,
+     * checks them for an id attribute, and calls {@link Ext.form.Field#applyToMarkup} on the existing dom element with that id.
+     * @return {BasicForm} this
+     */
+    render : function(){
+        this.items.each(function(f){
+            if(f.isFormField && !f.rendered && document.getElementById(f.id)){ // if the element exists
+                f.applyToMarkup(f.id);
+            }
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#apply} for all fields in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyToFields : function(o){
+        this.items.each(function(f){
+           Ext.apply(f, o);
+        });
+        return this;
+    },
+
+    /**
+     * Calls {@link Ext#applyIf} for all field in this form with the passed object.
+     * @param {Object} values
+     * @return {BasicForm} this
+     */
+    applyIfToFields : function(o){
+        this.items.each(function(f){
+           Ext.applyIf(f, o);
+        });
+        return this;
+    },
+
+    callFieldMethod : function(fnName, args){
+        args = args || [];
+        this.items.each(function(f){
+            if(Ext.isFunction(f[fnName])){
+                f[fnName].apply(f, args);
+            }
+        });
+        return this;
+    }
+});
+
+// back compat
+Ext.BasicForm = Ext.form.BasicForm;
+/**
+ * @class Ext.form.FormPanel
+ * @extends Ext.Panel
+ * <p>Standard form container.</p>
+ *
+ * <p><b><u>Layout</u></b></p>
+ * <p>By default, FormPanel is configured with <tt>layout:'form'</tt> to use an {@link Ext.layout.FormLayout}
+ * layout manager, which styles and renders fields and labels correctly. When nesting additional Containers
+ * within a FormPanel, you should ensure that any descendant Containers which host input Fields use the
+ * {@link Ext.layout.FormLayout} layout manager.</p>
+ *
+ * <p><b><u>BasicForm</u></b></p>
+ * <p>Although <b>not listed</b> as configuration options of FormPanel, the FormPanel class accepts all
+ * of the config options required to configure its internal {@link Ext.form.BasicForm} for:
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.BasicForm#fileUpload file uploads}</li>
+ * <li>functionality for {@link Ext.form.BasicForm#doAction loading, validating and submitting} the form</li>
+ * </ul></div>
+ *
+ * <p><b>Note</b>: If subclassing FormPanel, any configuration options for the BasicForm must be applied to
+ * the <tt><b>initialConfig</b></tt> property of the FormPanel. Applying {@link Ext.form.BasicForm BasicForm}
+ * configuration settings to <b><tt>this</tt></b> will <b>not</b> affect the BasicForm's configuration.</p>
+ *
+ * <p><b><u>Form Validation</u></b></p>
+ * <p>For information on form validation see the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li>{@link Ext.form.TextField}</li>
+ * <li>{@link Ext.form.VTypes}</li>
+ * <li>{@link Ext.form.BasicForm#doAction BasicForm.doAction <b>clientValidation</b> notes}</li>
+ * <li><tt>{@link Ext.form.FormPanel#monitorValid monitorValid}</tt></li>
+ * </ul></div>
+ *
+ * <p><b><u>Form Submission</u></b></p>
+ * <p>By default, Ext Forms are submitted through Ajax, using {@link Ext.form.Action}. To enable normal browser
+ * submission of the {@link Ext.form.BasicForm BasicForm} contained in this FormPanel, see the
+ * <tt><b>{@link Ext.form.BasicForm#standardSubmit standardSubmit}</b></tt> option.</p>
+ *
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype form
+ */
+Ext.FormPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} formId (optional) The id of the FORM tag (defaults to an auto-generated id).
+     */
+    /**
+     * @cfg {Boolean} hideLabels
+     * <p><tt>true</tt> to hide field labels by default (sets <tt>display:none</tt>). Defaults to
+     * <tt>false</tt>.</p>
+     * <p>Also see {@link Ext.Component}.<tt>{@link Ext.Component#hideLabel hideLabel}</tt>.
+     */
+    /**
+     * @cfg {Number} labelPad
+     * The default padding in pixels for field labels (defaults to <tt>5</tt>). <tt>labelPad</tt> only
+     * applies if <tt>{@link #labelWidth}</tt> is also specified, otherwise it will be ignored.
+     */
+    /**
+     * @cfg {String} labelSeparator
+     * See {@link Ext.Component}.<tt>{@link Ext.Component#labelSeparator labelSeparator}</tt>
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels in pixels. This property cascades to child containers
+     * and can be overridden on any child container (e.g., a fieldset can specify a different <tt>labelWidth</tt>
+     * for its fields) (defaults to <tt>100</tt>).
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the x-form-item of fields. This property cascades to child containers.
+     */
+    /**
+     * @cfg {Array} buttons
+     * An array of {@link Ext.Button}s or {@link Ext.Button} configs used to add buttons to the footer of this FormPanel.<br>
+     * <p>Buttons in the footer of a FormPanel may be configured with the option <tt>formBind: true</tt>. This causes
+     * the form's {@link #monitorValid valid state monitor task} to enable/disable those Buttons depending on
+     * the form's valid/invalid state.</p>
+     */
+
+
+    /**
+     * @cfg {Number} minButtonWidth Minimum width of all buttons in pixels (defaults to <tt>75</tt>).
+     */
+    minButtonWidth : 75,
+
+    /**
+     * @cfg {String} labelAlign The label alignment value used for the <tt>text-align</tt> specification
+     * for the <b>container</b>. Valid values are <tt>"left</tt>", <tt>"top"</tt> or <tt>"right"</tt>
+     * (defaults to <tt>"left"</tt>). This property cascades to child <b>containers</b> and can be
+     * overridden on any child <b>container</b> (e.g., a fieldset can specify a different <tt>labelAlign</tt>
+     * for its fields).
+     */
+    labelAlign : 'left',
+
+    /**
+     * @cfg {Boolean} monitorValid If <tt>true</tt>, the form monitors its valid state <b>client-side</b> and
+     * regularly fires the {@link #clientvalidation} event passing that state.<br>
+     * <p>When monitoring valid state, the FormPanel enables/disables any of its configured
+     * {@link #buttons} which have been configured with <code>formBind: true</code> depending
+     * on whether the {@link Ext.form.BasicForm#isValid form is valid} or not. Defaults to <tt>false</tt></p>
+     */
+    monitorValid : false,
+
+    /**
+     * @cfg {Number} monitorPoll The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200)
+     */
+    monitorPoll : 200,
+
+    /**
+     * @cfg {String} layout Defaults to <tt>'form'</tt>.  Normally this configuration property should not be altered.
+     * For additional details see {@link Ext.layout.FormLayout} and {@link Ext.Container#layout Ext.Container.layout}.
+     */
+    layout : 'form',
+
+    // private
+    initComponent : function(){
+        this.form = this.createForm();
+        Ext.FormPanel.superclass.initComponent.call(this);
+
+        this.bodyCfg = {
+            tag: 'form',
+            cls: this.baseCls + '-body',
+            method : this.method || 'POST',
+            id : this.formId || Ext.id()
+        };
+        if(this.fileUpload) {
+            this.bodyCfg.enctype = 'multipart/form-data';
+        }
+        this.initItems();
+
+        this.addEvents(
+            /**
+             * @event clientvalidation
+             * If the monitorValid config option is true, this event fires repetitively to notify of valid state
+             * @param {Ext.form.FormPanel} this
+             * @param {Boolean} valid true if the form has passed client-side validation
+             */
+            'clientvalidation'
+        );
+
+        this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);
+    },
+
+    // private
+    createForm : function(){
+        var config = Ext.applyIf({listeners: {}}, this.initialConfig);
+        return new Ext.form.BasicForm(null, config);
+    },
+
+    // private
+    initFields : function(){
+        var f = this.form;
+        var formPanel = this;
+        var fn = function(c){
+            if(formPanel.isField(c)){
+                f.add(c);
+            }else if(c.findBy && c != formPanel){
+                formPanel.applySettings(c);
+                //each check required for check/radio groups.
+                if(c.items && c.items.each){
+                    c.items.each(fn, this);
+                }
+            }
+        };
+        this.items.each(fn, this);
+    },
+
+    // private
+    applySettings: function(c){
+        var ct = c.ownerCt;
+        Ext.applyIf(c, {
+            labelAlign: ct.labelAlign,
+            labelWidth: ct.labelWidth,
+            itemCls: ct.itemCls
+        });
+    },
+
+    // private
+    getLayoutTarget : function(){
+        return this.form.el;
+    },
+
+    /**
+     * Provides access to the {@link Ext.form.BasicForm Form} which this Panel contains.
+     * @return {Ext.form.BasicForm} The {@link Ext.form.BasicForm Form} which this Panel contains.
+     */
+    getForm : function(){
+        return this.form;
+    },
+
+    // private
+    onRender : function(ct, position){
+        this.initFields();
+        Ext.FormPanel.superclass.onRender.call(this, ct, position);
+        this.form.initEl(this.body);
+    },
+
+    // private
+    beforeDestroy : function(){
+        this.stopMonitoring();
+        this.form.destroy(true);
+        Ext.FormPanel.superclass.beforeDestroy.call(this);
+    },
+
+    // Determine if a Component is usable as a form Field.
+    isField : function(c) {
+        return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid;
+    },
+
+    // private
+    initEvents : function(){
+        Ext.FormPanel.superclass.initEvents.call(this);
+        // Listeners are required here to catch bubbling events from children.
+        this.on({
+            scope: this,
+            add: this.onAddEvent,
+            remove: this.onRemoveEvent
+        });
+        if(this.monitorValid){ // initialize after render
+            this.startMonitoring();
+        }
+    },
+
+    // private
+    onAdd: function(c){
+        Ext.FormPanel.superclass.onAdd.call(this, c);
+        this.processAdd(c);
+    },
+
+    // private
+    onAddEvent: function(ct, c){
+        if(ct !== this){
+            this.processAdd(c);
+        }
+    },
+
+    // private
+    processAdd : function(c){
+        // If a single form Field, add it
+        if(this.isField(c)){
+            this.form.add(c);
+        // If a Container, add any Fields it might contain
+        }else if(c.findBy){
+            this.applySettings(c);
+            this.form.add.apply(this.form, c.findBy(this.isField));
+        }
+    },
+
+    // private
+    onRemove: function(c){
+        Ext.FormPanel.superclass.onRemove.call(this, c);
+        this.processRemove(c);
+    },
+
+    onRemoveEvent: function(ct, c){
+        if(ct !== this){
+            this.processRemove(c);
+        }
+    },
+
+    // private
+    processRemove: function(c){
+        if(!this.destroying){
+            // If a single form Field, remove it
+            if(this.isField(c)){
+                this.form.remove(c);
+            // If a Container, its already destroyed by the time it gets here.  Remove any references to destroyed fields.
+            }else if (c.findBy){
+                Ext.each(c.findBy(this.isField), this.form.remove, this.form);
+                /*
+                 * This isn't the most efficient way of getting rid of the items, however it's the most
+                 * correct, which in this case is most important.
+                 */
+                this.form.cleanDestroyed();
+            }
+        }
+    },
+
+    /**
+     * Starts monitoring of the valid state of this form. Usually this is done by passing the config
+     * option "monitorValid"
+     */
+    startMonitoring : function(){
+        if(!this.validTask){
+            this.validTask = new Ext.util.TaskRunner();
+            this.validTask.start({
+                run : this.bindHandler,
+                interval : this.monitorPoll || 200,
+                scope: this
+            });
+        }
+    },
+
+    /**
+     * Stops monitoring of the valid state of this form
+     */
+    stopMonitoring : function(){
+        if(this.validTask){
+            this.validTask.stopAll();
+            this.validTask = null;
+        }
+    },
+
+    /**
+     * This is a proxy for the underlying BasicForm's {@link Ext.form.BasicForm#load} call.
+     * @param {Object} options The options to pass to the action (see {@link Ext.form.BasicForm#doAction} for details)
+     */
+    load : function(){
+        this.form.load.apply(this.form, arguments);
+    },
+
+    // private
+    onDisable : function(){
+        Ext.FormPanel.superclass.onDisable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.disable();
+            });
+        }
+    },
+
+    // private
+    onEnable : function(){
+        Ext.FormPanel.superclass.onEnable.call(this);
+        if(this.form){
+            this.form.items.each(function(){
+                 this.enable();
+            });
+        }
+    },
+
+    // private
+    bindHandler : function(){
+        var valid = true;
+        this.form.items.each(function(f){
+            if(!f.isValid(true)){
+                valid = false;
+                return false;
+            }
+        });
+        if(this.fbar){
+            var fitems = this.fbar.items.items;
+            for(var i = 0, len = fitems.length; i < len; i++){
+                var btn = fitems[i];
+                if(btn.formBind === true && btn.disabled === valid){
+                    btn.setDisabled(!valid);
+                }
+            }
+        }
+        this.fireEvent('clientvalidation', this, valid);
+    }
+});
+Ext.reg('form', Ext.FormPanel);
+
+Ext.form.FormPanel = Ext.FormPanel;
+/**
+ * @class Ext.form.FieldSet
+ * @extends Ext.Panel
+ * Standard container used for grouping items within a {@link Ext.form.FormPanel form}.
+ * <pre><code>
+var form = new Ext.FormPanel({
+    title: 'Simple Form with FieldSets',
+    labelWidth: 75, // label settings here cascade unless overridden
+    url: 'save-form.php',
+    frame:true,
+    bodyStyle:'padding:5px 5px 0',
+    width: 700,
+    renderTo: document.body,
+    layout:'column', // arrange items in columns
+    defaults: {      // defaults applied to items
+        layout: 'form',
+        border: false,
+        bodyStyle: 'padding:4px'
+    },
+    items: [{
+        // Fieldset in Column 1
+        xtype:'fieldset',
+        columnWidth: 0.5,
+        title: 'Fieldset 1',
+        collapsible: true,
+        autoHeight:true,
+        defaults: {
+            anchor: '-20' // leave room for error icon
+        },
+        defaultType: 'textfield',
+        items :[{
+                fieldLabel: 'Field 1'
+            }, {
+                fieldLabel: 'Field 2'
+            }, {
+                fieldLabel: 'Field 3'
+            }
+        ]
+    },{
+        // Fieldset in Column 2 - Panel inside
+        xtype:'fieldset',
+        title: 'Show Panel', // title, header, or checkboxToggle creates fieldset header
+        autoHeight:true,
+        columnWidth: 0.5,
+        checkboxToggle: true,
+        collapsed: true, // fieldset initially collapsed
+        layout:'anchor',
+        items :[{
+            xtype: 'panel',
+            anchor: '100%',
+            title: 'Panel inside a fieldset',
+            frame: true,
+            height: 100
+        }]
+    }]
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config Configuration options
+ * @xtype fieldset
+ */
+Ext.form.FieldSet = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {Mixed} checkboxToggle <tt>true</tt> to render a checkbox into the fieldset frame just
+     * in front of the legend to expand/collapse the fieldset when the checkbox is toggled. (defaults
+     * to <tt>false</tt>).
+     * <p>A {@link Ext.DomHelper DomHelper} element spec may also be specified to create the checkbox.
+     * If <tt>true</tt> is specified, the default DomHelper config object used to create the element
+     * is:</p><pre><code>
+     * {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'}
+     * </code></pre>
+     */
+    /**
+     * @cfg {String} checkboxName The name to assign to the fieldset's checkbox if <tt>{@link #checkboxToggle} = true</tt>
+     * (defaults to <tt>'[checkbox id]-checkbox'</tt>).
+     */
+    /**
+     * @cfg {Boolean} collapsible
+     * <tt>true</tt> to make the fieldset collapsible and have the expand/collapse toggle button automatically
+     * rendered into the legend element, <tt>false</tt> to keep the fieldset statically sized with no collapse
+     * button (defaults to <tt>false</tt>). Another option is to configure <tt>{@link #checkboxToggle}</tt>.
+     */
+    /**
+     * @cfg {Number} labelWidth The width of labels. This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see
+     * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).
+     * This property cascades to child containers.
+     */
+    /**
+     * @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).
+     */
+    baseCls : 'x-fieldset',
+    /**
+     * @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).
+     */
+    layout : 'form',
+    /**
+     * @cfg {Boolean} animCollapse
+     * <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the
+     * animation (defaults to <tt>false</tt>).
+     */
+    animCollapse : false,
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('fieldset');
+            this.el.id = this.id;
+            if (this.title || this.header || this.checkboxToggle) {
+                this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';
+            }
+        }
+
+        Ext.form.FieldSet.superclass.onRender.call(this, ct, position);
+
+        if(this.checkboxToggle){
+            var o = typeof this.checkboxToggle == 'object' ?
+                    this.checkboxToggle :
+                    {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
+            this.checkbox = this.header.insertFirst(o);
+            this.checkbox.dom.checked = !this.collapsed;
+            this.mon(this.checkbox, 'click', this.onCheckClick, this);
+        }
+    },
+
+    // private
+    onCollapse : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = false;
+        }
+        Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);
+
+    },
+
+    // private
+    onExpand : function(doAnim, animArg){
+        if(this.checkbox){
+            this.checkbox.dom.checked = true;
+        }
+        Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
+    },
+
+    /**
+     * This function is called by the fieldset's checkbox when it is toggled (only applies when
+     * checkboxToggle = true).  This method should never be called externally, but can be
+     * overridden to provide custom behavior when the checkbox is toggled if needed.
+     */
+    onCheckClick : function(){
+        this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} applyTo
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} bodyBorder
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} border
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} collapseFirst
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {String} disabledClass
+     * @hide
+     */
+    /**
+     * @cfg {String} elements
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} floating
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} footer
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} frame
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} header
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} headerAsText
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideCollapseTool
+     * @hide
+     */
+    /**
+     * @cfg {String} iconCls
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/String} shadow
+     * @hide
+     */
+    /**
+     * @cfg {Number} shadowOffset
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} shim
+     * @hide
+     */
+    /**
+     * @cfg {Object/Array} tbar
+     * @hide
+     */
+    /**
+     * @cfg {Array} tools
+     * @hide
+     */
+    /**
+     * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
+     * @hide
+     */
+    /**
+     * @cfg {String} xtype
+     * @hide
+     */
+    /**
+     * @property header
+     * @hide
+     */
+    /**
+     * @property footer
+     * @hide
+     */
+    /**
+     * @method focus
+     * @hide
+     */
+    /**
+     * @method getBottomToolbar
+     * @hide
+     */
+    /**
+     * @method getTopToolbar
+     * @hide
+     */
+    /**
+     * @method setIconClass
+     * @hide
+     */
+    /**
+     * @event activate
+     * @hide
+     */
+    /**
+     * @event beforeclose
+     * @hide
+     */
+    /**
+     * @event bodyresize
+     * @hide
+     */
+    /**
+     * @event close
+     * @hide
+     */
+    /**
+     * @event deactivate
+     * @hide
+     */
+});
+Ext.reg('fieldset', Ext.form.FieldSet);/**
+ * @class Ext.form.HtmlEditor
+ * @extends Ext.form.Field
+ * Provides a lightweight HTML Editor component. Some toolbar features are not supported by Safari and will be
+ * automatically hidden when needed.  These are noted in the config options where appropriate.
+ * <br><br>The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not
+ * enabled by default unless the global {@link Ext.QuickTips} singleton is {@link Ext.QuickTips#init initialized}.
+ * <br><br><b>Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT
+ * supported by this editor.</b>
+ * <br><br>An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within
+ * any element that has display set to 'none' can cause problems in Safari and Firefox due to their default iframe reloading bugs.
+ * <br><br>Example usage:
+ * <pre><code>
+// Simple example rendered with default options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.form.HtmlEditor({
+    renderTo: Ext.getBody(),
+    width: 800,
+    height: 300
+});
+
+// Passed via xtype into a container and with custom options:
+Ext.QuickTips.init();  // enable tooltips
+new Ext.Panel({
+    title: 'HTML Editor',
+    renderTo: Ext.getBody(),
+    width: 600,
+    height: 300,
+    frame: true,
+    layout: 'fit',
+    items: {
+        xtype: 'htmleditor',
+        enableColors: false,
+        enableAlignments: false
+    }
+});
+</code></pre>
+ * @constructor
+ * Create a new HtmlEditor
+ * @param {Object} config
+ * @xtype htmleditor
+ */
+
+Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
+    /**
+     * @cfg {Boolean} enableFormat Enable the bold, italic and underline buttons (defaults to true)
+     */
+    enableFormat : true,
+    /**
+     * @cfg {Boolean} enableFontSize Enable the increase/decrease font size buttons (defaults to true)
+     */
+    enableFontSize : true,
+    /**
+     * @cfg {Boolean} enableColors Enable the fore/highlight color buttons (defaults to true)
+     */
+    enableColors : true,
+    /**
+     * @cfg {Boolean} enableAlignments Enable the left, center, right alignment buttons (defaults to true)
+     */
+    enableAlignments : true,
+    /**
+     * @cfg {Boolean} enableLists Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true)
+     */
+    enableLists : true,
+    /**
+     * @cfg {Boolean} enableSourceEdit Enable the switch to source edit button. Not available in Safari. (defaults to true)
+     */
+    enableSourceEdit : true,
+    /**
+     * @cfg {Boolean} enableLinks Enable the create link button. Not available in Safari. (defaults to true)
+     */
+    enableLinks : true,
+    /**
+     * @cfg {Boolean} enableFont Enable font selection. Not available in Safari. (defaults to true)
+     */
+    enableFont : true,
+    /**
+     * @cfg {String} createLinkText The default text for the create link prompt
+     */
+    createLinkText : 'Please enter the URL for the link:',
+    /**
+     * @cfg {String} defaultLinkValue The default value for the create link prompt (defaults to http:/ /)
+     */
+    defaultLinkValue : 'http:/'+'/',
+    /**
+     * @cfg {Array} fontFamilies An array of available font families
+     */
+    fontFamilies : [
+        'Arial',
+        'Courier New',
+        'Tahoma',
+        'Times New Roman',
+        'Verdana'
+    ],
+    defaultFont: 'tahoma',
+    /**
+     * @cfg {String} defaultValue A default value to be put into the editor to resolve focus issues (defaults to &#160; (Non-breaking space) in Opera and IE6, &#8203; (Zero-width space) in all other browsers).
+     */
+    defaultValue: (Ext.isOpera || Ext.isIE6) ? '&#160;' : '&#8203;',
+
+    // private properties
+    actionMode: 'wrap',
+    validationEvent : false,
+    deferHeight: true,
+    initialized : false,
+    activated : false,
+    sourceEditMode : false,
+    onFocus : Ext.emptyFn,
+    iframePad:3,
+    hideMode:'offsets',
+    defaultAutoCreate : {
+        tag: "textarea",
+        style:"width:500px;height:300px;",
+        autocomplete: "off"
+    },
+
+    // private
+    initComponent : function(){
+        this.addEvents(
+            /**
+             * @event initialize
+             * Fires when the editor is fully initialized (including the iframe)
+             * @param {HtmlEditor} this
+             */
+            'initialize',
+            /**
+             * @event activate
+             * Fires when the editor is first receives the focus. Any insertion must wait
+             * until after this event.
+             * @param {HtmlEditor} this
+             */
+            'activate',
+             /**
+             * @event beforesync
+             * Fires before the textarea is updated with content from the editor iframe. Return false
+             * to cancel the sync.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforesync',
+             /**
+             * @event beforepush
+             * Fires before the iframe editor is updated with content from the textarea. Return false
+             * to cancel the push.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'beforepush',
+             /**
+             * @event sync
+             * Fires when the textarea is updated with content from the editor iframe.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'sync',
+             /**
+             * @event push
+             * Fires when the iframe editor is updated with content from the textarea.
+             * @param {HtmlEditor} this
+             * @param {String} html
+             */
+            'push',
+             /**
+             * @event editmodechange
+             * Fires when the editor switches edit modes
+             * @param {HtmlEditor} this
+             * @param {Boolean} sourceEdit True if source edit, false if standard editing.
+             */
+            'editmodechange'
+        );
+        Ext.form.HtmlEditor.superclass.initComponent.call(this);
+    },
+
+    // private
+    createFontOptions : function(){
+        var buf = [], fs = this.fontFamilies, ff, lc;
+        for(var i = 0, len = fs.length; i< len; i++){
+            ff = fs[i];
+            lc = ff.toLowerCase();
+            buf.push(
+                '<option value="',lc,'" style="font-family:',ff,';"',
+                    (this.defaultFont == lc ? ' selected="true">' : '>'),
+                    ff,
+                '</option>'
+            );
+        }
+        return buf.join('');
+    },
+
+    /*
+     * Protected method that will not generally be called directly. It
+     * is called when the editor creates its toolbar. Override this method if you need to
+     * add custom toolbar buttons.
+     * @param {HtmlEditor} editor
+     */
+    createToolbar : function(editor){
+        var items = [];
+        var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();
+
+
+        function btn(id, toggle, handler){
+            return {
+                itemId : id,
+                cls : 'x-btn-icon',
+                iconCls: 'x-edit-'+id,
+                enableToggle:toggle !== false,
+                scope: editor,
+                handler:handler||editor.relayBtnCmd,
+                clickEvent:'mousedown',
+                tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined,
+                overflowText: editor.buttonTips[id].title || undefined,
+                tabIndex:-1
+            };
+        }
+
+
+        if(this.enableFont && !Ext.isSafari2){
+            var fontSelectItem = new Ext.Toolbar.Item({
+               autoEl: {
+                    tag:'select',
+                    cls:'x-font-select',
+                    html: this.createFontOptions()
+               }
+            });
+
+            items.push(
+                fontSelectItem,
+                '-'
+            );
+        }
+
+        if(this.enableFormat){
+            items.push(
+                btn('bold'),
+                btn('italic'),
+                btn('underline')
+            );
+        }
+
+        if(this.enableFontSize){
+            items.push(
+                '-',
+                btn('increasefontsize', false, this.adjustFont),
+                btn('decreasefontsize', false, this.adjustFont)
+            );
+        }
+
+        if(this.enableColors){
+            items.push(
+                '-', {
+                    itemId:'forecolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-forecolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.forecolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        allowReselect: true,
+                        focus: Ext.emptyFn,
+                        value:'000000',
+                        plain:true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                this.execCmd('forecolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                this.deferFocus();
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }, {
+                    itemId:'backcolor',
+                    cls:'x-btn-icon',
+                    iconCls: 'x-edit-backcolor',
+                    clickEvent:'mousedown',
+                    tooltip: tipsEnabled ? editor.buttonTips.backcolor || undefined : undefined,
+                    tabIndex:-1,
+                    menu : new Ext.menu.ColorMenu({
+                        focus: Ext.emptyFn,
+                        value:'FFFFFF',
+                        plain:true,
+                        allowReselect: true,
+                        listeners: {
+                            scope: this,
+                            select: function(cp, color){
+                                if(Ext.isGecko){
+                                    this.execCmd('useCSS', false);
+                                    this.execCmd('hilitecolor', color);
+                                    this.execCmd('useCSS', true);
+                                    this.deferFocus();
+                                }else{
+                                    this.execCmd(Ext.isOpera ? 'hilitecolor' : 'backcolor', Ext.isWebKit || Ext.isIE ? '#'+color : color);
+                                    this.deferFocus();
+                                }
+                            }
+                        },
+                        clickEvent:'mousedown'
+                    })
+                }
+            );
+        }
+
+        if(this.enableAlignments){
+            items.push(
+                '-',
+                btn('justifyleft'),
+                btn('justifycenter'),
+                btn('justifyright')
+            );
+        }
+
+        if(!Ext.isSafari2){
+            if(this.enableLinks){
+                items.push(
+                    '-',
+                    btn('createlink', false, this.createLink)
+                );
+            }
+
+            if(this.enableLists){
+                items.push(
+                    '-',
+                    btn('insertorderedlist'),
+                    btn('insertunorderedlist')
+                );
+            }
+            if(this.enableSourceEdit){
+                items.push(
+                    '-',
+                    btn('sourceedit', true, function(btn){
+                        this.toggleSourceEdit(!this.sourceEditMode);
+                    })
+                );
+            }
+        }
+
+        // build the toolbar
+        var tb = new Ext.Toolbar({
+            renderTo: this.wrap.dom.firstChild,
+            items: items
+        });
+
+        if (fontSelectItem) {
+            this.fontSelect = fontSelectItem.el;
+
+            this.mon(this.fontSelect, 'change', function(){
+                var font = this.fontSelect.dom.value;
+                this.relayCmd('fontname', font);
+                this.deferFocus();
+            }, this);
+        }
+
+        // stop form submits
+        this.mon(tb.el, 'click', function(e){
+            e.preventDefault();
+        });
+
+        this.tb = tb;
+        this.tb.doLayout();
+    },
+
+    onDisable: function(){
+        this.wrap.mask();
+        Ext.form.HtmlEditor.superclass.onDisable.call(this);
+    },
+
+    onEnable: function(){
+        this.wrap.unmask();
+        Ext.form.HtmlEditor.superclass.onEnable.call(this);
+    },
+
+    setReadOnly: function(readOnly){
+
+        Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);
+        if(this.initialized){
+            if(Ext.isIE){
+                this.getEditorBody().contentEditable = !readOnly;
+            }else{
+                this.setDesignMode(!readOnly);
+            }
+            var bd = this.getEditorBody();
+            if(bd){
+                bd.style.cursor = this.readOnly ? 'default' : 'text';
+            }
+            this.disableItems(readOnly);
+        }
+    },
+
+    /**
+     * Protected method that will not generally be called directly. It
+     * is called when the editor initializes the iframe with HTML contents. Override this method if you
+     * want to change the initialization markup of the iframe (e.g. to add stylesheets).
+     *
+     * Note: IE8-Standards has unwanted scroller behavior, so the default meta tag forces IE7 compatibility
+     */
+    getDocMarkup : function(){
+        var h = Ext.fly(this.iframe).getHeight() - this.iframePad * 2;
+        return String.format('<html><head><style type="text/css">body{border: 0; margin: 0; padding: {0}px; height: {1}px; cursor: text}</style></head><body></body></html>', this.iframePad, h);
+    },
+
+    // private
+    getEditorBody : function(){
+        var doc = this.getDoc();
+        return doc.body || doc.documentElement;
+    },
+
+    // private
+    getDoc : function(){
+        return Ext.isIE ? this.getWin().document : (this.iframe.contentDocument || this.getWin().document);
+    },
+
+    // private
+    getWin : function(){
+        return Ext.isIE ? this.iframe.contentWindow : window.frames[this.iframe.name];
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.form.HtmlEditor.superclass.onRender.call(this, ct, position);
+        this.el.dom.style.border = '0 none';
+        this.el.dom.setAttribute('tabIndex', -1);
+        this.el.addClass('x-hidden');
+        if(Ext.isIE){ // fix IE 1px bogus margin
+            this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;');
+        }
+        this.wrap = this.el.wrap({
+            cls:'x-html-editor-wrap', cn:{cls:'x-html-editor-tb'}
+        });
+
+        this.createToolbar(this);
+
+        this.disableItems(true);
+
+        this.tb.doLayout();
+
+        this.createIFrame();
+
+        if(!this.width){
+            var sz = this.el.getSize();
+            this.setSize(sz.width, this.height || sz.height);
+        }
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+
+    createIFrame: function(){
+        var iframe = document.createElement('iframe');
+        iframe.name = Ext.id();
+        iframe.frameBorder = '0';
+        iframe.style.overflow = 'auto';
+        iframe.src = Ext.SSL_SECURE_URL;
+
+        this.wrap.dom.appendChild(iframe);
+        this.iframe = iframe;
+
+        this.monitorTask = Ext.TaskMgr.start({
+            run: this.checkDesignMode,
+            scope: this,
+            interval:100
+        });
+    },
+
+    initFrame : function(){
+        Ext.TaskMgr.stop(this.monitorTask);
+        var doc = this.getDoc();
+        this.win = this.getWin();
+
+        doc.open();
+        doc.write(this.getDocMarkup());
+        doc.close();
+
+        var task = { // must defer to wait for browser to be ready
+            run : function(){
+                var doc = this.getDoc();
+                if(doc.body || doc.readyState == 'complete'){
+                    Ext.TaskMgr.stop(task);
+                    this.setDesignMode(true);
+                    this.initEditor.defer(10, this);
+                }
+            },
+            interval : 10,
+            duration:10000,
+            scope: this
+        };
+        Ext.TaskMgr.start(task);
+    },
+
+
+    checkDesignMode : function(){
+        if(this.wrap && this.wrap.dom.offsetWidth){
+            var doc = this.getDoc();
+            if(!doc){
+                return;
+            }
+            if(!doc.editorInitialized || this.getDesignMode() != 'on'){
+                this.initFrame();
+            }
+        }
+    },
+
+    /* private
+     * set current design mode. To enable, mode can be true or 'on', off otherwise
+     */
+    setDesignMode : function(mode){
+        var doc = this.getDoc();
+        if (doc) {
+            if(this.readOnly){
+                mode = false;
+            }
+            doc.designMode = (/on|true/i).test(String(mode).toLowerCase()) ?'on':'off';
+        }
+
+    },
+
+    // private
+    getDesignMode : function(){
+        var doc = this.getDoc();
+        if(!doc){ return ''; }
+        return String(doc.designMode).toLowerCase();
+
+    },
+
+    disableItems: function(disabled){
+        if(this.fontSelect){
+            this.fontSelect.dom.disabled = disabled;
+        }
+        this.tb.items.each(function(item){
+            if(item.getItemId() != 'sourceedit'){
+                item.setDisabled(disabled);
+            }
+        });
+    },
+
+    // private
+    onResize : function(w, h){
+        Ext.form.HtmlEditor.superclass.onResize.apply(this, arguments);
+        if(this.el && this.iframe){
+            if(Ext.isNumber(w)){
+                var aw = w - this.wrap.getFrameWidth('lr');
+                this.el.setWidth(aw);
+                this.tb.setWidth(aw);
+                this.iframe.style.width = Math.max(aw, 0) + 'px';
+            }
+            if(Ext.isNumber(h)){
+                var ah = h - this.wrap.getFrameWidth('tb') - this.tb.el.getHeight();
+                this.el.setHeight(ah);
+                this.iframe.style.height = Math.max(ah, 0) + 'px';
+                var bd = this.getEditorBody();
+                if(bd){
+                    bd.style.height = Math.max((ah - (this.iframePad*2)), 0) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * Toggles the editor between standard and source edit mode.
+     * @param {Boolean} sourceEdit (optional) True for source edit, false for standard
+     */
+    toggleSourceEdit : function(sourceEditMode){
+        var iframeHeight,
+            elHeight;
+
+        if (sourceEditMode === undefined) {
+            sourceEditMode = !this.sourceEditMode;
+        }
+        this.sourceEditMode = sourceEditMode === true;
+        var btn = this.tb.getComponent('sourceedit');
+
+        if (btn.pressed !== this.sourceEditMode) {
+            btn.toggle(this.sourceEditMode);
+            if (!btn.xtbHidden) {
+                return;
+            }
+        }
+        if (this.sourceEditMode) {
+            // grab the height of the containing panel before we hide the iframe
+            this.previousSize = this.getSize();
+
+            iframeHeight = Ext.get(this.iframe).getHeight();
+
+            this.disableItems(true);
+            this.syncValue();
+            this.iframe.className = 'x-hidden';
+            this.el.removeClass('x-hidden');
+            this.el.dom.removeAttribute('tabIndex');
+            this.el.focus();
+            this.el.dom.style.height = iframeHeight + 'px';
+        }
+        else {
+            elHeight = parseInt(this.el.dom.style.height, 10);
+            if (this.initialized) {
+                this.disableItems(this.readOnly);
+            }
+            this.pushValue();
+            this.iframe.className = '';
+            this.el.addClass('x-hidden');
+            this.el.dom.setAttribute('tabIndex', -1);
+            this.deferFocus();
+
+            this.setSize(this.previousSize);
+            delete this.previousSize;
+            this.iframe.style.height = elHeight + 'px';
+        }
+        this.fireEvent('editmodechange', this, this.sourceEditMode);
+    },
+
+    // private used internally
+    createLink : function() {
+        var url = prompt(this.createLinkText, this.defaultLinkValue);
+        if(url && url != 'http:/'+'/'){
+            this.relayCmd('createlink', url);
+        }
+    },
+
+    // private
+    initEvents : function(){
+        this.originalValue = this.getValue();
+    },
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    markInvalid : Ext.emptyFn,
+
+    /**
+     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
+     * @method
+     */
+    clearInvalid : Ext.emptyFn,
+
+    // docs inherit from Field
+    setValue : function(v){
+        Ext.form.HtmlEditor.superclass.setValue.call(this, v);
+        this.pushValue();
+        return this;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. If you need/want
+     * custom HTML cleanup, this is the method you should override.
+     * @param {String} html The HTML to be cleaned
+     * @return {String} The cleaned HTML
+     */
+    cleanHtml: function(html) {
+        html = String(html);
+        if(Ext.isWebKit){ // strip safari nonsense
+            html = html.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi, '');
+        }
+
+        /*
+         * Neat little hack. Strips out all the non-digit characters from the default
+         * value and compares it to the character code of the first character in the string
+         * because it can cause encoding issues when posted to the server.
+         */
+        if(html.charCodeAt(0) == this.defaultValue.replace(/\D/g, '')){
+            html = html.substring(1);
+        }
+        return html;
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Syncs the contents
+     * of the editor iframe with the textarea.
+     */
+    syncValue : function(){
+        if(this.initialized){
+            var bd = this.getEditorBody();
+            var html = bd.innerHTML;
+            if(Ext.isWebKit){
+                var bs = bd.getAttribute('style'); // Safari puts text-align styles on the body element!
+                var m = bs.match(/text-align:(.*?);/i);
+                if(m && m[1]){
+                    html = '<div style="'+m[0]+'">' + html + '</div>';
+                }
+            }
+            html = this.cleanHtml(html);
+            if(this.fireEvent('beforesync', this, html) !== false){
+                this.el.dom.value = html;
+                this.fireEvent('sync', this, html);
+            }
+        }
+    },
+
+    //docs inherit from Field
+    getValue : function() {
+        this[this.sourceEditMode ? 'pushValue' : 'syncValue']();
+        return Ext.form.HtmlEditor.superclass.getValue.call(this);
+    },
+
+    /**
+     * Protected method that will not generally be called directly. Pushes the value of the textarea
+     * into the iframe editor.
+     */
+    pushValue : function(){
+        if(this.initialized){
+            var v = this.el.dom.value;
+            if(!this.activated && v.length < 1){
+                v = this.defaultValue;
+            }
+            if(this.fireEvent('beforepush', this, v) !== false){
+                this.getEditorBody().innerHTML = v;
+                if(Ext.isGecko){
+                    // Gecko hack, see: https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8
+                    this.setDesignMode(false);  //toggle off first
+                    this.setDesignMode(true);
+                }
+                this.fireEvent('push', this, v);
+            }
+
+        }
+    },
+
+    // private
+    deferFocus : function(){
+        this.focus.defer(10, this);
+    },
+
+    // docs inherit from Field
+    focus : function(){
+        if(this.win && !this.sourceEditMode){
+            this.win.focus();
+        }else{
+            this.el.focus();
+        }
+    },
+
+    // private
+    initEditor : function(){
+        //Destroying the component during/before initEditor can cause issues.
+        try{
+            var dbody = this.getEditorBody(),
+                ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat', 'background-color', 'color'),
+                doc,
+                fn;
+
+            ss['background-attachment'] = 'fixed'; // w3c
+            dbody.bgProperties = 'fixed'; // ie
+
+            Ext.DomHelper.applyStyles(dbody, ss);
+
+            doc = this.getDoc();
+
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                }catch(e){}
+            }
+
+            /*
+             * We need to use createDelegate here, because when using buffer, the delayed task is added
+             * as a property to the function. When the listener is removed, the task is deleted from the function.
+             * Since onEditorEvent is shared on the prototype, if we have multiple html editors, the first time one of the editors
+             * is destroyed, it causes the fn to be deleted from the prototype, which causes errors. Essentially, we're just anonymizing the function.
+             */
+            fn = this.onEditorEvent.createDelegate(this);
+            Ext.EventManager.on(doc, {
+                mousedown: fn,
+                dblclick: fn,
+                click: fn,
+                keyup: fn,
+                buffer:100
+            });
+
+            if(Ext.isGecko){
+                Ext.EventManager.on(doc, 'keypress', this.applyCommand, this);
+            }
+            if(Ext.isIE || Ext.isWebKit || Ext.isOpera){
+                Ext.EventManager.on(doc, 'keydown', this.fixKeys, this);
+            }
+            doc.editorInitialized = true;
+            this.initialized = true;
+            this.pushValue();
+            this.setReadOnly(this.readOnly);
+            this.fireEvent('initialize', this);
+        }catch(e){}
+    },
+
+    // private
+    beforeDestroy : function(){
+        if(this.monitorTask){
+            Ext.TaskMgr.stop(this.monitorTask);
+        }
+        if(this.rendered){
+            Ext.destroy(this.tb);
+            var doc = this.getDoc();
+            if(doc){
+                try{
+                    Ext.EventManager.removeAll(doc);
+                    for (var prop in doc){
+                        delete doc[prop];
+                    }
+                }catch(e){}
+            }
+            if(this.wrap){
+                this.wrap.dom.innerHTML = '';
+                this.wrap.remove();
+            }
+        }
+        Ext.form.HtmlEditor.superclass.beforeDestroy.call(this);
+    },
+
+    // private
+    onFirstFocus : function(){
+        this.activated = true;
+        this.disableItems(this.readOnly);
+        if(Ext.isGecko){ // prevent silly gecko errors
+            this.win.focus();
+            var s = this.win.getSelection();
+            if(!s.focusNode || s.focusNode.nodeType != 3){
+                var r = s.getRangeAt(0);
+                r.selectNodeContents(this.getEditorBody());
+                r.collapse(true);
+                this.deferFocus();
+            }
+            try{
+                this.execCmd('useCSS', true);
+                this.execCmd('styleWithCSS', false);
+            }catch(e){}
+        }
+        this.fireEvent('activate', this);
+    },
+
+    // private
+    adjustFont: function(btn){
+        var adjust = btn.getItemId() == 'increasefontsize' ? 1 : -1,
+            doc = this.getDoc(),
+            v = parseInt(doc.queryCommandValue('FontSize') || 2, 10);
+        if((Ext.isSafari && !Ext.isSafari2) || Ext.isChrome || Ext.isAir){
+            // Safari 3 values
+            // 1 = 10px, 2 = 13px, 3 = 16px, 4 = 18px, 5 = 24px, 6 = 32px
+            if(v <= 10){
+                v = 1 + adjust;
+            }else if(v <= 13){
+                v = 2 + adjust;
+            }else if(v <= 16){
+                v = 3 + adjust;
+            }else if(v <= 18){
+                v = 4 + adjust;
+            }else if(v <= 24){
+                v = 5 + adjust;
+            }else {
+                v = 6 + adjust;
+            }
+            v = v.constrain(1, 6);
+        }else{
+            if(Ext.isSafari){ // safari
+                adjust *= 2;
+            }
+            v = Math.max(1, v+adjust) + (Ext.isSafari ? 'px' : 0);
+        }
+        this.execCmd('FontSize', v);
+    },
+
+    // private
+    onEditorEvent : function(e){
+        this.updateToolbar();
+    },
+
+
+    /**
+     * Protected method that will not generally be called directly. It triggers
+     * a toolbar update by reading the markup state of the current selection in the editor.
+     */
+    updateToolbar: function(){
+
+        if(this.readOnly){
+            return;
+        }
+
+        if(!this.activated){
+            this.onFirstFocus();
+            return;
+        }
+
+        var btns = this.tb.items.map,
+            doc = this.getDoc();
+
+        if(this.enableFont && !Ext.isSafari2){
+            var name = (doc.queryCommandValue('FontName')||this.defaultFont).toLowerCase();
+            if(name != this.fontSelect.dom.value){
+                this.fontSelect.dom.value = name;
+            }
+        }
+        if(this.enableFormat){
+            btns.bold.toggle(doc.queryCommandState('bold'));
+            btns.italic.toggle(doc.queryCommandState('italic'));
+            btns.underline.toggle(doc.queryCommandState('underline'));
+        }
+        if(this.enableAlignments){
+            btns.justifyleft.toggle(doc.queryCommandState('justifyleft'));
+            btns.justifycenter.toggle(doc.queryCommandState('justifycenter'));
+            btns.justifyright.toggle(doc.queryCommandState('justifyright'));
+        }
+        if(!Ext.isSafari2 && this.enableLists){
+            btns.insertorderedlist.toggle(doc.queryCommandState('insertorderedlist'));
+            btns.insertunorderedlist.toggle(doc.queryCommandState('insertunorderedlist'));
+        }
+
+        Ext.menu.MenuMgr.hideAll();
+
+        this.syncValue();
+    },
+
+    // private
+    relayBtnCmd : function(btn){
+        this.relayCmd(btn.getItemId());
+    },
+
+    /**
+     * Executes a Midas editor command on the editor document and performs necessary focus and
+     * toolbar updates. <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    relayCmd : function(cmd, value){
+        (function(){
+            this.focus();
+            this.execCmd(cmd, value);
+            this.updateToolbar();
+        }).defer(10, this);
+    },
+
+    /**
+     * Executes a Midas editor command directly on the editor document.
+     * For visual commands, you should use {@link #relayCmd} instead.
+     * <b>This should only be called after the editor is initialized.</b>
+     * @param {String} cmd The Midas command
+     * @param {String/Boolean} value (optional) The value to pass to the command (defaults to null)
+     */
+    execCmd : function(cmd, value){
+        var doc = this.getDoc();
+        doc.execCommand(cmd, false, value === undefined ? null : value);
+        this.syncValue();
+    },
+
+    // private
+    applyCommand : function(e){
+        if(e.ctrlKey){
+            var c = e.getCharCode(), cmd;
+            if(c > 0){
+                c = String.fromCharCode(c);
+                switch(c){
+                    case 'b':
+                        cmd = 'bold';
+                    break;
+                    case 'i':
+                        cmd = 'italic';
+                    break;
+                    case 'u':
+                        cmd = 'underline';
+                    break;
+                }
+                if(cmd){
+                    this.win.focus();
+                    this.execCmd(cmd);
+                    this.deferFocus();
+                    e.preventDefault();
+                }
+            }
+        }
+    },
+
+    /**
+     * Inserts the passed text at the current cursor position. Note: the editor must be initialized and activated
+     * to insert text.
+     * @param {String} text
+     */
+    insertAtCursor : function(text){
+        if(!this.activated){
+            return;
+        }
+        if(Ext.isIE){
+            this.win.focus();
+            var doc = this.getDoc(),
+                r = doc.selection.createRange();
+            if(r){
+                r.pasteHTML(text);
+                this.syncValue();
+                this.deferFocus();
+            }
+        }else{
+            this.win.focus();
+            this.execCmd('InsertHTML', text);
+            this.deferFocus();
+        }
+    },
+
+    // private
+    fixKeys : function(){ // load time branching for fastest keydown performance
+        if(Ext.isIE){
+            return function(e){
+                var k = e.getKey(),
+                    doc = this.getDoc(),
+                        r;
+                if(k == e.TAB){
+                    e.stopEvent();
+                    r = doc.selection.createRange();
+                    if(r){
+                        r.collapse(true);
+                        r.pasteHTML('&nbsp;&nbsp;&nbsp;&nbsp;');
+                        this.deferFocus();
+                    }
+                }else if(k == e.ENTER){
+                    r = doc.selection.createRange();
+                    if(r){
+                        var target = r.parentElement();
+                        if(!target || target.tagName.toLowerCase() != 'li'){
+                            e.stopEvent();
+                            r.pasteHTML('<br />');
+                            r.collapse(false);
+                            r.select();
+                        }
+                    }
+                }
+            };
+        }else if(Ext.isOpera){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.win.focus();
+                    this.execCmd('InsertHTML','&nbsp;&nbsp;&nbsp;&nbsp;');
+                    this.deferFocus();
+                }
+            };
+        }else if(Ext.isWebKit){
+            return function(e){
+                var k = e.getKey();
+                if(k == e.TAB){
+                    e.stopEvent();
+                    this.execCmd('InsertText','\t');
+                    this.deferFocus();
+                }else if(k == e.ENTER){
+                    e.stopEvent();
+                    this.execCmd('InsertHtml','<br /><br />');
+                    this.deferFocus();
+                }
+             };
+        }
+    }(),
+
+    /**
+     * Returns the editor's toolbar. <b>This is only available after the editor has been rendered.</b>
+     * @return {Ext.Toolbar}
+     */
+    getToolbar : function(){
+        return this.tb;
+    },
+
+    /**
+     * Object collection of toolbar tooltips for the buttons in the editor. The key
+     * is the command id associated with that button and the value is a valid QuickTips object.
+     * For example:
+<pre><code>
+{
+    bold : {
+        title: 'Bold (Ctrl+B)',
+        text: 'Make the selected text bold.',
+        cls: 'x-html-editor-tip'
+    },
+    italic : {
+        title: 'Italic (Ctrl+I)',
+        text: 'Make the selected text italic.',
+        cls: 'x-html-editor-tip'
+    },
+    ...
+</code></pre>
+    * @type Object
+     */
+    buttonTips : {
+        bold : {
+            title: 'Bold (Ctrl+B)',
+            text: 'Make the selected text bold.',
+            cls: 'x-html-editor-tip'
+        },
+        italic : {
+            title: 'Italic (Ctrl+I)',
+            text: 'Make the selected text italic.',
+            cls: 'x-html-editor-tip'
+        },
+        underline : {
+            title: 'Underline (Ctrl+U)',
+            text: 'Underline the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        increasefontsize : {
+            title: 'Grow Text',
+            text: 'Increase the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        decreasefontsize : {
+            title: 'Shrink Text',
+            text: 'Decrease the font size.',
+            cls: 'x-html-editor-tip'
+        },
+        backcolor : {
+            title: 'Text Highlight Color',
+            text: 'Change the background color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        forecolor : {
+            title: 'Font Color',
+            text: 'Change the color of the selected text.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyleft : {
+            title: 'Align Text Left',
+            text: 'Align text to the left.',
+            cls: 'x-html-editor-tip'
+        },
+        justifycenter : {
+            title: 'Center Text',
+            text: 'Center text in the editor.',
+            cls: 'x-html-editor-tip'
+        },
+        justifyright : {
+            title: 'Align Text Right',
+            text: 'Align text to the right.',
+            cls: 'x-html-editor-tip'
+        },
+        insertunorderedlist : {
+            title: 'Bullet List',
+            text: 'Start a bulleted list.',
+            cls: 'x-html-editor-tip'
+        },
+        insertorderedlist : {
+            title: 'Numbered List',
+            text: 'Start a numbered list.',
+            cls: 'x-html-editor-tip'
+        },
+        createlink : {
+            title: 'Hyperlink',
+            text: 'Make the selected text a hyperlink.',
+            cls: 'x-html-editor-tip'
+        },
+        sourceedit : {
+            title: 'Source Edit',
+            text: 'Switch to source editing mode.',
+            cls: 'x-html-editor-tip'
+        }
+    }
+
+    // hide stuff that is not compatible
+    /**
+     * @event blur
+     * @hide
+     */
+    /**
+     * @event change
+     * @hide
+     */
+    /**
+     * @event focus
+     * @hide
+     */
+    /**
+     * @event specialkey
+     * @hide
+     */
+    /**
+     * @cfg {String} fieldClass @hide
+     */
+    /**
+     * @cfg {String} focusClass @hide
+     */
+    /**
+     * @cfg {String} autoCreate @hide
+     */
+    /**
+     * @cfg {String} inputType @hide
+     */
+    /**
+     * @cfg {String} invalidClass @hide
+     */
+    /**
+     * @cfg {String} invalidText @hide
+     */
+    /**
+     * @cfg {String} msgFx @hide
+     */
+    /**
+     * @cfg {String} validateOnBlur @hide
+     */
+    /**
+     * @cfg {Boolean} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} applyTo @hide
+     */
+    /**
+     * @cfg {String} autoHeight  @hide
+     */
+    /**
+     * @cfg {String} autoWidth  @hide
+     */
+    /**
+     * @cfg {String} cls  @hide
+     */
+    /**
+     * @cfg {String} disabled  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} msgTarget  @hide
+     */
+    /**
+     * @cfg {String} readOnly  @hide
+     */
+    /**
+     * @cfg {String} style  @hide
+     */
+    /**
+     * @cfg {String} validationDelay  @hide
+     */
+    /**
+     * @cfg {String} validationEvent  @hide
+     */
+    /**
+     * @cfg {String} tabIndex  @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method validate
+     * @hide
+     */
+    /**
+     * @event valid
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+    /**
+     * @cfg keys
+     * @hide
+     */
+});
+Ext.reg('htmleditor', Ext.form.HtmlEditor);
+/**
+ * @class Ext.form.TimeField
+ * @extends Ext.form.ComboBox
+ * Provides a time input field with a time dropdown and automatic time validation.  Example usage:
+ * <pre><code>
+new Ext.form.TimeField({
+    minValue: '9:00 AM',
+    maxValue: '6:00 PM',
+    increment: 30
+});
+</code></pre>
+ * @constructor
+ * Create a new TimeField
+ * @param {Object} config
+ * @xtype timefield
+ */
+Ext.form.TimeField = Ext.extend(Ext.form.ComboBox, {
+    /**
+     * @cfg {Date/String} minValue
+     * The minimum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    minValue : undefined,
+    /**
+     * @cfg {Date/String} maxValue
+     * The maximum allowed time. Can be either a Javascript date object with a valid time value or a string
+     * time in a valid format -- see {@link #format} and {@link #altFormats} (defaults to undefined).
+     */
+    maxValue : undefined,
+    /**
+     * @cfg {String} minText
+     * The error text to display when the date in the cell is before minValue (defaults to
+     * 'The time in this field must be equal to or after {0}').
+     */
+    minText : "The time in this field must be equal to or after {0}",
+    /**
+     * @cfg {String} maxText
+     * The error text to display when the time is after maxValue (defaults to
+     * 'The time in this field must be equal to or before {0}').
+     */
+    maxText : "The time in this field must be equal to or before {0}",
+    /**
+     * @cfg {String} invalidText
+     * The error text to display when the time in the field is invalid (defaults to
+     * '{value} is not a valid time').
+     */
+    invalidText : "{0} is not a valid time",
+    /**
+     * @cfg {String} format
+     * The default time format string which can be overriden for localization support.  The format must be
+     * valid according to {@link Date#parseDate} (defaults to 'g:i A', e.g., '3:15 PM').  For 24-hour time
+     * format try 'H:i' instead.
+     */
+    format : "g:i A",
+    /**
+     * @cfg {String} altFormats
+     * Multiple date formats separated by "|" to try when parsing a user input value and it doesn't match the defined
+     * format (defaults to 'g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A').
+     */
+    altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hi a|giA|hiA|gi A|hi A",
+    /**
+     * @cfg {Number} increment
+     * The number of minutes between each time value in the list (defaults to 15).
+     */
+    increment: 15,
+
+    // private override
+    mode: 'local',
+    // private override
+    triggerAction: 'all',
+    // private override
+    typeAhead: false,
+
+    // private - This is the date to use when generating time values in the absence of either minValue
+    // or maxValue.  Using the current date causes DST issues on DST boundary dates, so this is an
+    // arbitrary "safe" date that can be any date aside from DST boundary dates.
+    initDate: '1/1/2008',
+
+    initDateFormat: 'j/n/Y',
+
+    // private
+    initComponent : function(){
+        if(Ext.isDefined(this.minValue)){
+            this.setMinValue(this.minValue, true);
+        }
+        if(Ext.isDefined(this.maxValue)){
+            this.setMaxValue(this.maxValue, true);
+        }
+        if(!this.store){
+            this.generateStore(true);
+        }
+        Ext.form.TimeField.superclass.initComponent.call(this);
+    },
+
+    /**
+     * Replaces any existing {@link #minValue} with the new time and refreshes the store.
+     * @param {Date/String} value The minimum time that can be selected
+     */
+    setMinValue: function(value, /* private */ initial){
+        this.setLimit(value, true, initial);
+        return this;
+    },
+
+    /**
+     * Replaces any existing {@link #maxValue} with the new time and refreshes the store.
+     * @param {Date/String} value The maximum time that can be selected
+     */
+    setMaxValue: function(value, /* private */ initial){
+        this.setLimit(value, false, initial);
+        return this;
+    },
+
+    // private
+    generateStore: function(initial){
+        var min = this.minValue || new Date(this.initDate).clearTime(),
+            max = this.maxValue || new Date(this.initDate).clearTime().add('mi', (24 * 60) - 1),
+            times = [];
+
+        while(min <= max){
+            times.push(min.dateFormat(this.format));
+            min = min.add('mi', this.increment);
+        }
+        this.bindStore(times, initial);
+    },
+
+    // private
+    setLimit: function(value, isMin, initial){
+        var d;
+        if(Ext.isString(value)){
+            d = this.parseDate(value);
+        }else if(Ext.isDate(value)){
+            d = value;
+        }
+        if(d){
+            var val = new Date(this.initDate).clearTime();
+            val.setHours(d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds());
+            this[isMin ? 'minValue' : 'maxValue'] = val;
+            if(!initial){
+                this.generateStore();
+            }
+        }
+    },
+
+    // inherited docs
+    getValue : function(){
+        var v = Ext.form.TimeField.superclass.getValue.call(this);
+        return this.formatDate(this.parseDate(v)) || '';
+    },
+
+    // inherited docs
+    setValue : function(value){
+        return Ext.form.TimeField.superclass.setValue.call(this, this.formatDate(this.parseDate(value)));
+    },
+
+    // private overrides
+    validateValue : Ext.form.DateField.prototype.validateValue,
+
+    formatDate : Ext.form.DateField.prototype.formatDate,
+
+    parseDate: function(value) {
+        if (!value || Ext.isDate(value)) {
+            return value;
+        }
+
+        var id = this.initDate + ' ',
+            idf = this.initDateFormat + ' ',
+            v = Date.parseDate(id + value, idf + this.format), // *** handle DST. note: this.format is a TIME-only format
+            af = this.altFormats;
+
+        if (!v && af) {
+            if (!this.altFormatsArray) {
+                this.altFormatsArray = af.split("|");
+            }
+            for (var i = 0, afa = this.altFormatsArray, len = afa.length; i < len && !v; i++) {
+                v = Date.parseDate(id + value, idf + afa[i]);
+            }
+        }
+
+        return v;
+    }
+});
+Ext.reg('timefield', Ext.form.TimeField);/**
+ * @class Ext.form.SliderField
+ * @extends Ext.form.Field
+ * Wraps a {@link Ext.slider.MultiSlider Slider} so it can be used as a form field.
+ * @constructor
+ * Creates a new SliderField
+ * @param {Object} config Configuration options. Note that you can pass in any slider configuration options, as well as
+ * as any field configuration options.
+ * @xtype sliderfield
+ */
+Ext.form.SliderField = Ext.extend(Ext.form.Field, {
+    
+    /**
+     * @cfg {Boolean} useTips
+     * True to use an Ext.slider.Tip to display tips for the value. Defaults to <tt>true</tt>.
+     */
+    useTips : true,
+    
+    /**
+     * @cfg {Function} tipText
+     * A function used to display custom text for the slider tip. Defaults to <tt>null</tt>, which will
+     * use the default on the plugin.
+     */
+    tipText : null,
+    
+    // private override
+    actionMode: 'wrap',
+    
+    /**
+     * Initialize the component.
+     * @private
+     */
+    initComponent : function() {
+        var cfg = Ext.copyTo({
+            id: this.id + '-slider'
+        }, this.initialConfig, ['vertical', 'minValue', 'maxValue', 'decimalPrecision', 'keyIncrement', 'increment', 'clickToChange', 'animate']);
+        
+        // only can use it if it exists.
+        if (this.useTips) {
+            var plug = this.tipText ? {getText: this.tipText} : {};
+            cfg.plugins = [new Ext.slider.Tip(plug)];
+        }
+        this.slider = new Ext.Slider(cfg);
+        Ext.form.SliderField.superclass.initComponent.call(this);
+    },    
+    
+    /**
+     * Set up the hidden field
+     * @param {Object} ct The container to render to.
+     * @param {Object} position The position in the container to render to.
+     * @private
+     */
+    onRender : function(ct, position){
+        this.autoCreate = {
+            id: this.id,
+            name: this.name,
+            type: 'hidden',
+            tag: 'input'    
+        };
+        Ext.form.SliderField.superclass.onRender.call(this, ct, position);
+        this.wrap = this.el.wrap({cls: 'x-form-field-wrap'});
+        this.resizeEl = this.positionEl = this.wrap;
+        this.slider.render(this.wrap);
+    },
+    
+    /**
+     * Ensure that the slider size is set automatically when the field resizes.
+     * @param {Object} w The width
+     * @param {Object} h The height
+     * @param {Object} aw The adjusted width
+     * @param {Object} ah The adjusted height
+     * @private
+     */
+    onResize : function(w, h, aw, ah){
+        Ext.form.SliderField.superclass.onResize.call(this, w, h, aw, ah);
+        this.slider.setSize(w, h);    
+    },
+    
+    /**
+     * Initialize any events for this class.
+     * @private
+     */
+    initEvents : function(){
+        Ext.form.SliderField.superclass.initEvents.call(this);
+        this.slider.on('change', this.onChange, this);   
+    },
+    
+    /**
+     * Utility method to set the value of the field when the slider changes.
+     * @param {Object} slider The slider object.
+     * @param {Object} v The new value.
+     * @private
+     */
+    onChange : function(slider, v){
+        this.setValue(v, undefined, true);
+    },
+    
+    /**
+     * Enable the slider when the field is enabled.
+     * @private
+     */
+    onEnable : function(){
+        Ext.form.SliderField.superclass.onEnable.call(this);
+        this.slider.enable();
+    },
+    
+    /**
+     * Disable the slider when the field is disabled.
+     * @private
+     */
+    onDisable : function(){
+        Ext.form.SliderField.superclass.onDisable.call(this);
+        this.slider.disable();    
+    },
+    
+    /**
+     * Ensure the slider is destroyed when the field is destroyed.
+     * @private
+     */
+    beforeDestroy : function(){
+        Ext.destroy(this.slider);
+        Ext.form.SliderField.superclass.beforeDestroy.call(this);
+    },
+    
+    /**
+     * If a side icon is shown, do alignment to the slider
+     * @private
+     */
+    alignErrorIcon : function(){
+        this.errorIcon.alignTo(this.slider.el, 'tl-tr', [2, 0]);
+    },
+    
+    /**
+     * Sets the minimum field value.
+     * @param {Number} v The new minimum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMinValue : function(v){
+        this.slider.setMinValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the maximum field value.
+     * @param {Number} v The new maximum value.
+     * @return {Ext.form.SliderField} this
+     */
+    setMaxValue : function(v){
+        this.slider.setMaxValue(v);
+        return this;    
+    },
+    
+    /**
+     * Sets the value for this field.
+     * @param {Number} v The new value.
+     * @param {Boolean} animate (optional) Whether to animate the transition. If not specified, it will default to the animate config.
+     * @return {Ext.form.SliderField} this
+     */
+    setValue : function(v, animate, /* private */ silent){
+        // silent is used if the setValue method is invoked by the slider
+        // which means we don't need to set the value on the slider.
+        if(!silent){
+            this.slider.setValue(v, animate);
+        }
+        return Ext.form.SliderField.superclass.setValue.call(this, this.slider.getValue());
+    },
+    
+    /**
+     * Gets the current value for this field.
+     * @return {Number} The current value.
+     */
+    getValue : function(){
+        return this.slider.getValue();    
+    }
+});
+
+Ext.reg('sliderfield', Ext.form.SliderField);/**
+ * @class Ext.form.Label
+ * @extends Ext.BoxComponent
+ * Basic Label field.
+ * @constructor
+ * Creates a new Label
+ * @param {Ext.Element/String/Object} config The configuration options.  If an element is passed, it is set as the internal
+ * element and its id used as the component id.  If a string is passed, it is assumed to be the id of an existing element
+ * and is used as the component id.  Otherwise, it is assumed to be a standard config object and is applied to the component.
+ * @xtype label
+ */
+Ext.form.Label = Ext.extend(Ext.BoxComponent, {
+    /**
+     * @cfg {String} text The plain text to display within the label (defaults to ''). If you need to include HTML
+     * tags within the label's innerHTML, use the {@link #html} config instead.
+     */
+    /**
+     * @cfg {String} forId The id of the input element to which this label will be bound via the standard HTML 'for'
+     * attribute. If not specified, the attribute will not be added to the label.
+     */
+    /**
+     * @cfg {String} html An HTML fragment that will be used as the label's innerHTML (defaults to '').
+     * Note that if {@link #text} is specified it will take precedence and this value will be ignored.
+     */
+
+    // private
+    onRender : function(ct, position){
+        if(!this.el){
+            this.el = document.createElement('label');
+            this.el.id = this.getId();
+            this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');
+            if(this.forId){
+                this.el.setAttribute('for', this.forId);
+            }
+        }
+        Ext.form.Label.superclass.onRender.call(this, ct, position);
+    },
+
+    /**
+     * Updates the label's innerHTML with the specified string.
+     * @param {String} text The new label text
+     * @param {Boolean} encode (optional) False to skip HTML-encoding the text when rendering it
+     * to the label (defaults to true which encodes the value). This might be useful if you want to include
+     * tags in the label's innerHTML rather than rendering them as string literals per the default logic.
+     * @return {Label} this
+     */
+    setText : function(t, encode){
+        var e = encode === false;
+        this[!e ? 'text' : 'html'] = t;
+        delete this[e ? 'text' : 'html'];
+        if(this.rendered){
+            this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;
+        }
+        return this;
+    }
+});
+
+Ext.reg('label', Ext.form.Label);/**
+ * @class Ext.form.Action
+ * <p>The subclasses of this class provide actions to perform upon {@link Ext.form.BasicForm Form}s.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * the Form needs to perform an action such as submit or load. The Configuration options
+ * listed for this class are set through the Form's action methods: {@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}</p>
+ * <p>The instance of Action which performed the action is passed to the success
+ * and failure callbacks of the Form's action methods ({@link Ext.form.BasicForm#submit submit},
+ * {@link Ext.form.BasicForm#load load} and {@link Ext.form.BasicForm#doAction doAction}),
+ * and to the {@link Ext.form.BasicForm#actioncomplete actioncomplete} and
+ * {@link Ext.form.BasicForm#actionfailed actionfailed} event handlers.</p>
+ */
+Ext.form.Action = function(form, options){
+    this.form = form;
+    this.options = options || {};
+};
+
+/**
+ * Failure type returned when client side validation of the Form fails
+ * thus aborting a submit action. Client side validation is performed unless
+ * {@link #clientValidation} is explicitly set to <tt>false</tt>.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CLIENT_INVALID = 'client';
+/**
+ * <p>Failure type returned when server side processing fails and the {@link #result}'s
+ * <tt style="font-weight:bold">success</tt> property is set to <tt>false</tt>.</p>
+ * <p>In the case of a form submission, field-specific error messages may be returned in the
+ * {@link #result}'s <tt style="font-weight:bold">errors</tt> property.</p>
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.SERVER_INVALID = 'server';
+/**
+ * Failure type returned when a communication error happens when attempting
+ * to send a request to the remote server. The {@link #response} may be examined to
+ * provide further information.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.CONNECT_FAILURE = 'connect';
+/**
+ * Failure type returned when the response's <tt style="font-weight:bold">success</tt>
+ * property is set to <tt>false</tt>, or no field values are returned in the response's
+ * <tt style="font-weight:bold">data</tt> property.
+ * @type {String}
+ * @static
+ */
+Ext.form.Action.LOAD_FAILURE = 'load';
+
+Ext.form.Action.prototype = {
+/**
+ * @cfg {String} url The URL that the Action is to invoke.
+ */
+/**
+ * @cfg {Boolean} reset When set to <tt><b>true</b></tt>, causes the Form to be
+ * {@link Ext.form.BasicForm.reset reset} on Action success. If specified, this happens
+ * <b>before</b> the {@link #success} callback is called and before the Form's
+ * {@link Ext.form.BasicForm.actioncomplete actioncomplete} event fires.
+ */
+/**
+ * @cfg {String} method The HTTP method to use to access the requested URL. Defaults to the
+ * {@link Ext.form.BasicForm}'s method, or if that is not specified, the underlying DOM form's method.
+ */
+/**
+ * @cfg {Mixed} params <p>Extra parameter values to pass. These are added to the Form's
+ * {@link Ext.form.BasicForm#baseParams} and passed to the specified URL along with the Form's
+ * input fields.</p>
+ * <p>Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode}.</p>
+ */
+/**
+ * @cfg {Number} timeout The number of seconds to wait for a server response before
+ * failing with the {@link #failureType} as {@link #Action.CONNECT_FAILURE}. If not specified,
+ * defaults to the configured <tt>{@link Ext.form.BasicForm#timeout timeout}</tt> of the
+ * {@link Ext.form.BasicForm form}.
+ */
+/**
+ * @cfg {Function} success The function to call when a valid success return packet is recieved.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Function} failure The function to call when a failure packet was recieved, or when an
+ * error ocurred in the Ajax communication.
+ * The function is passed the following parameters:<ul class="mdetail-params">
+ * <li><b>form</b> : Ext.form.BasicForm<div class="sub-desc">The form that requested the action</div></li>
+ * <li><b>action</b> : Ext.form.Action<div class="sub-desc">The Action class. If an Ajax
+ * error ocurred, the failure type will be in {@link #failureType}. The {@link #result}
+ * property of this object may be examined to perform custom postprocessing.</div></li>
+ * </ul>
+ */
+/**
+ * @cfg {Object} scope The scope in which to call the callback functions (The <tt>this</tt> reference
+ * for the callback functions).
+ */
+/**
+ * @cfg {String} waitMsg The message to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+/**
+ * @cfg {String} waitTitle The title to be displayed by a call to {@link Ext.MessageBox#wait}
+ * during the time the action is being processed.
+ */
+
+/**
+ * @cfg {Boolean} submitEmptyText If set to <tt>true</tt>, the emptyText value will be sent with the form
+ * when it is submitted.  Defaults to <tt>true</tt>.
+ */
+
+/**
+ * The type of action this Action instance performs.
+ * Currently only "submit" and "load" are supported.
+ * @type {String}
+ */
+    type : 'default',
+/**
+ * The type of failure detected will be one of these: {@link #CLIENT_INVALID},
+ * {@link #SERVER_INVALID}, {@link #CONNECT_FAILURE}, or {@link #LOAD_FAILURE}.  Usage:
+ * <pre><code>
+var fp = new Ext.form.FormPanel({
+...
+buttons: [{
+    text: 'Save',
+    formBind: true,
+    handler: function(){
+        if(fp.getForm().isValid()){
+            fp.getForm().submit({
+                url: 'form-submit.php',
+                waitMsg: 'Submitting your data...',
+                success: function(form, action){
+                    // server responded with success = true
+                    var result = action.{@link #result};
+                },
+                failure: function(form, action){
+                    if (action.{@link #failureType} === Ext.form.Action.{@link #CONNECT_FAILURE}) {
+                        Ext.Msg.alert('Error',
+                            'Status:'+action.{@link #response}.status+': '+
+                            action.{@link #response}.statusText);
+                    }
+                    if (action.failureType === Ext.form.Action.{@link #SERVER_INVALID}){
+                        // server responded with success = false
+                        Ext.Msg.alert('Invalid', action.{@link #result}.errormsg);
+                    }
+                }
+            });
+        }
+    }
+},{
+    text: 'Reset',
+    handler: function(){
+        fp.getForm().reset();
+    }
+}]
+ * </code></pre>
+ * @property failureType
+ * @type {String}
+ */
+ /**
+ * The XMLHttpRequest object used to perform the action.
+ * @property response
+ * @type {Object}
+ */
+ /**
+ * The decoded response object containing a boolean <tt style="font-weight:bold">success</tt> property and
+ * other, action-specific properties.
+ * @property result
+ * @type {Object}
+ */
+
+    // interface method
+    run : function(options){
+
+    },
+
+    // interface method
+    success : function(response){
+
+    },
+
+    // interface method
+    handleResponse : function(response){
+
+    },
+
+    // default connection failure
+    failure : function(response){
+        this.response = response;
+        this.failureType = Ext.form.Action.CONNECT_FAILURE;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    // shared code among all Actions to validate that there was a response
+    // with either responseText or responseXml
+    processResponse : function(response){
+        this.response = response;
+        if(!response.responseText && !response.responseXML){
+            return true;
+        }
+        this.result = this.handleResponse(response);
+        return this.result;
+    },
+    
+    decodeResponse: function(response) {
+        try {
+            return Ext.decode(response.responseText);
+        } catch(e) {
+            return false;
+        } 
+    },
+
+    // utility functions used internally
+    getUrl : function(appendParams){
+        var url = this.options.url || this.form.url || this.form.el.dom.action;
+        if(appendParams){
+            var p = this.getParams();
+            if(p){
+                url = Ext.urlAppend(url, p);
+            }
+        }
+        return url;
+    },
+
+    // private
+    getMethod : function(){
+        return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();
+    },
+
+    // private
+    getParams : function(){
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        if(p){
+            if(typeof p == "object"){
+                p = Ext.urlEncode(Ext.applyIf(p, bp));
+            }else if(typeof p == 'string' && bp){
+                p += '&' + Ext.urlEncode(bp);
+            }
+        }else if(bp){
+            p = Ext.urlEncode(bp);
+        }
+        return p;
+    },
+
+    // private
+    createCallback : function(opts){
+        var opts = opts || {};
+        return {
+            success: this.success,
+            failure: this.failure,
+            scope: this,
+            timeout: (opts.timeout*1000) || (this.form.timeout*1000),
+            upload: this.form.fileUpload ? this.success : undefined
+        };
+    }
+};
+
+/**
+ * @class Ext.form.Action.Submit
+ * @extends Ext.form.Action
+ * <p>A class which handles submission of data from {@link Ext.form.BasicForm Form}s
+ * and processes the returned response.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#submit submit}ting.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet may contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean
+ * <div class="sub-desc">The <code>success</code> property is required.</div></li>
+ * <li><b><code>errors</code></b> property : Object
+ * <div class="sub-desc"><div class="sub-desc">The <code>errors</code> property,
+ * which is optional, contains error messages for invalid fields.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so a typical response
+ * packet may look like this:</p><pre><code>
+{
+    success: false,
+    errors: {
+        clientCode: "Client not found",
+        portOfLoading: "This field must not be null"
+    }
+}</code></pre>
+ * <p>Other data may be placed into the response for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ * <p>Alternatively, if an {@link #errorReader} is specified as an {@link Ext.data.XmlReader XmlReader}:</p><pre><code>
+    errorReader: new Ext.data.XmlReader({
+            record : 'field',
+            success: '@success'
+        }, [
+            'id', 'msg'
+        ]
+    )
+</code></pre>
+ * <p>then the results may be sent back in XML format:</p><pre><code>
+&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;message success="false"&gt;
+&lt;errors&gt;
+    &lt;field&gt;
+        &lt;id&gt;clientCode&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Code not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+    &lt;field&gt;
+        &lt;id&gt;portOfLoading&lt;/id&gt;
+        &lt;msg&gt;&lt;![CDATA[Port not found. &lt;br /&gt;&lt;i&gt;This is a test validation message from the server &lt;/i&gt;]]&gt;&lt;/msg&gt;
+    &lt;/field&gt;
+&lt;/errors&gt;
+&lt;/message&gt;
+</code></pre>
+ * <p>Other elements may be placed into the response XML for processing by the {@link Ext.form.BasicForm}'s callback
+ * or event handler methods. The XML document is available in the {@link #errorReader}'s {@link Ext.data.XmlReader#xmlData xmlData} property.</p>
+ */
+Ext.form.Action.Submit = function(form, options){
+    Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
+};
+
+Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
+    /**
+     * @cfg {Ext.data.DataReader} errorReader <p><b>Optional. JSON is interpreted with
+     * no need for an errorReader.</b></p>
+     * <p>A Reader which reads a single record from the returned data. The DataReader's
+     * <b>success</b> property specifies how submission success is determined. The Record's
+     * data provides the error messages to apply to any invalid form Fields.</p>
+     */
+    /**
+     * @cfg {boolean} clientValidation Determines whether a Form's fields are validated
+     * in a final call to {@link Ext.form.BasicForm#isValid isValid} prior to submission.
+     * Pass <tt>false</tt> in the Form's submit options to prevent this. If not defined, pre-submission field validation
+     * is performed.
+     */
+    type : 'submit',
+
+    // private
+    run : function(){
+        var o = this.options,
+            method = this.getMethod(),
+            isGet = method == 'GET';
+        if(o.clientValidation === false || this.form.isValid()){
+            if (o.submitEmptyText === false) {
+                var fields = this.form.items,
+                    emptyFields = [],
+                    setupEmptyFields = function(f){
+                        if (f.el.getValue() == f.emptyText) {
+                            emptyFields.push(f);
+                            f.el.dom.value = "";
+                        }
+                        if(f.isComposite && f.rendered){
+                            f.items.each(setupEmptyFields);
+                        }
+                    };
+                    
+                fields.each(setupEmptyFields);
+            }
+            Ext.Ajax.request(Ext.apply(this.createCallback(o), {
+                form:this.form.el.dom,
+                url:this.getUrl(isGet),
+                method: method,
+                headers: o.headers,
+                params:!isGet ? this.getParams() : null,
+                isUpload: this.form.fileUpload
+            }));
+            if (o.submitEmptyText === false) {
+                Ext.each(emptyFields, function(f) {
+                    if (f.applyEmptyText) {
+                        f.applyEmptyText();
+                    }
+                });
+            }
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || result.success){
+            this.form.afterAction(this, true);
+            return;
+        }
+        if(result.errors){
+            this.form.markInvalid(result.errors);
+        }
+        this.failureType = Ext.form.Action.SERVER_INVALID;
+        this.form.afterAction(this, false);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.errorReader){
+            var rs = this.form.errorReader.read(response);
+            var errors = [];
+            if(rs.records){
+                for(var i = 0, len = rs.records.length; i < len; i++) {
+                    var r = rs.records[i];
+                    errors[i] = r.data;
+                }
+            }
+            if(errors.length < 1){
+                errors = null;
+            }
+            return {
+                success : rs.success,
+                errors : errors
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+/**
+ * @class Ext.form.Action.Load
+ * @extends Ext.form.Action
+ * <p>A class which handles loading of data from a server into the Fields of an {@link Ext.form.BasicForm}.</p>
+ * <p>Instances of this class are only created by a {@link Ext.form.BasicForm Form} when
+ * {@link Ext.form.BasicForm#load load}ing.</p>
+ * <p><u><b>Response Packet Criteria</b></u></p>
+ * <p>A response packet <b>must</b> contain:
+ * <div class="mdetail-params"><ul>
+ * <li><b><code>success</code></b> property : Boolean</li>
+ * <li><b><code>data</code></b> property : Object</li>
+ * <div class="sub-desc">The <code>data</code> property contains the values of Fields to load.
+ * The individual value object for each Field is passed to the Field's
+ * {@link Ext.form.Field#setValue setValue} method.</div></li>
+ * </ul></div>
+ * <p><u><b>JSON Packets</b></u></p>
+ * <p>By default, response packets are assumed to be JSON, so for the following form load call:<pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    title: 'Client and routing info',
+    items: [{
+        fieldLabel: 'Client',
+        name: 'clientName'
+    }, {
+        fieldLabel: 'Port of loading',
+        name: 'portOfLoading'
+    }, {
+        fieldLabel: 'Port of discharge',
+        name: 'portOfDischarge'
+    }]
+});
+myFormPanel.{@link Ext.form.FormPanel#getForm getForm}().{@link Ext.form.BasicForm#load load}({
+    url: '/getRoutingInfo.php',
+    params: {
+        consignmentRef: myConsignmentRef
+    },
+    failure: function(form, action) {
+        Ext.Msg.alert("Load failed", action.result.errorMessage);
+    }
+});
+</code></pre>
+ * a <b>success response</b> packet may look like this:</p><pre><code>
+{
+    success: true,
+    data: {
+        clientName: "Fred. Olsen Lines",
+        portOfLoading: "FXT",
+        portOfDischarge: "OSL"
+    }
+}</code></pre>
+ * while a <b>failure response</b> packet may look like this:</p><pre><code>
+{
+    success: false,
+    errorMessage: "Consignment reference not found"
+}</code></pre>
+ * <p>Other data may be placed into the response for processing the {@link Ext.form.BasicForm Form}'s
+ * callback or event handler methods. The object decoded from this JSON is available in the
+ * {@link Ext.form.Action#result result} property.</p>
+ */
+Ext.form.Action.Load = function(form, options){
+    Ext.form.Action.Load.superclass.constructor.call(this, form, options);
+    this.reader = this.form.reader;
+};
+
+Ext.extend(Ext.form.Action.Load, Ext.form.Action, {
+    // private
+    type : 'load',
+
+    // private
+    run : function(){
+        Ext.Ajax.request(Ext.apply(
+                this.createCallback(this.options), {
+                    method:this.getMethod(),
+                    url:this.getUrl(false),
+                    headers: this.options.headers,
+                    params:this.getParams()
+        }));
+    },
+
+    // private
+    success : function(response){
+        var result = this.processResponse(response);
+        if(result === true || !result.success || !result.data){
+            this.failureType = Ext.form.Action.LOAD_FAILURE;
+            this.form.afterAction(this, false);
+            return;
+        }
+        this.form.clearInvalid();
+        this.form.setValues(result.data);
+        this.form.afterAction(this, true);
+    },
+
+    // private
+    handleResponse : function(response){
+        if(this.form.reader){
+            var rs = this.form.reader.read(response);
+            var data = rs.records && rs.records[0] ? rs.records[0].data : null;
+            return {
+                success : rs.success,
+                data : data
+            };
+        }
+        return this.decodeResponse(response);
+    }
+});
+
+
+
+/**
+ * @class Ext.form.Action.DirectLoad
+ * @extends Ext.form.Action.Load
+ * <p>Provides Ext.direct support for loading form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>load</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+
+// load the form
+myFormPanel.getForm().load({
+    // pass 2 arguments to server side getBasicInfo method (len=2)
+    params: {
+        foo: 'bar',
+        uid: 34
+    }
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "data":[34,"bar"] // note the order of the params
+    }
+]
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following format:
+ * <pre><code>
+[
+    {
+        "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+        "result":{
+            "success":true,
+            "data":{
+                "name":"Fred Flintstone",
+                "company":"Slate Rock and Gravel",
+                "email":"fred.flintstone@slaterg.com"
+            }
+        }
+    }
+]
+ * </code></pre>
+ */
+Ext.form.Action.DirectLoad = Ext.extend(Ext.form.Action.Load, {
+    constructor: function(form, opts) {
+        Ext.form.Action.DirectLoad.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directload',
+
+    run : function(){
+        var args = this.getParams();
+        args.push(this.success, this);
+        this.form.api.load.apply(window, args);
+    },
+
+    getParams : function() {
+        var buf = [], o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        var paramOrder = this.form.paramOrder;
+        if(paramOrder){
+            for(var i = 0, len = paramOrder.length; i < len; i++){
+                buf.push(o[paramOrder[i]]);
+            }
+        }else if(this.form.paramsAsHash){
+            buf.push(o);
+        }
+        return buf;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectLoad.superclass.success.call(this, response);
+    }
+});
+
+/**
+ * @class Ext.form.Action.DirectSubmit
+ * @extends Ext.form.Action.Submit
+ * <p>Provides Ext.direct support for submitting form data.</p>
+ * <p>This example illustrates usage of Ext.Direct to <b>submit</b> a form through Ext.Direct.</p>
+ * <pre><code>
+var myFormPanel = new Ext.form.FormPanel({
+    // configs for FormPanel
+    title: 'Basic Information',
+    renderTo: document.body,
+    width: 300, height: 160,
+    padding: 10,
+    buttons:[{
+        text: 'Submit',
+        handler: function(){
+            myFormPanel.getForm().submit({
+                params: {
+                    foo: 'bar',
+                    uid: 34
+                }
+            });
+        }
+    }],
+
+    // configs apply to child items
+    defaults: {anchor: '100%'},
+    defaultType: 'textfield',
+    items: [{
+        fieldLabel: 'Name',
+        name: 'name'
+    },{
+        fieldLabel: 'Email',
+        name: 'email'
+    },{
+        fieldLabel: 'Company',
+        name: 'company'
+    }],
+
+    // configs for BasicForm
+    api: {
+        // The server-side method to call for load() requests
+        load: Profile.getBasicInfo,
+        // The server-side must mark the submit handler as a 'formHandler'
+        submit: Profile.updateBasicInfo
+    },
+    // specify the order for the passed params
+    paramOrder: ['uid', 'foo']
+});
+ * </code></pre>
+ * The data packet sent to the server will resemble something like:
+ * <pre><code>
+{
+    "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+    "result":{
+        "success":true,
+        "id":{
+            "extAction":"Profile","extMethod":"updateBasicInfo",
+            "extType":"rpc","extTID":"6","extUpload":"false",
+            "name":"Aaron Conran","email":"aaron@extjs.com","company":"Ext JS, LLC"
+        }
+    }
+}
+ * </code></pre>
+ * The form will process a data packet returned by the server that is similar
+ * to the following:
+ * <pre><code>
+// sample success packet (batched requests)
+[
+    {
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
+        "result":{
+            "success":true
+        }
+    }
+]
+
+// sample failure packet (one request)
+{
+        "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+        "result":{
+            "errors":{
+                "email":"already taken"
+            },
+            "success":false,
+            "foo":"bar"
+        }
+}
+ * </code></pre>
+ * Also see the discussion in {@link Ext.form.Action.DirectLoad}.
+ */
+Ext.form.Action.DirectSubmit = Ext.extend(Ext.form.Action.Submit, {
+    constructor : function(form, opts) {
+        Ext.form.Action.DirectSubmit.superclass.constructor.call(this, form, opts);
+    },
+    type : 'directsubmit',
+    // override of Submit
+    run : function(){
+        var o = this.options;
+        if(o.clientValidation === false || this.form.isValid()){
+            // tag on any additional params to be posted in the
+            // form scope
+            this.success.params = this.getParams();
+            this.form.api.submit(this.form.el.dom, this.success, this);
+        }else if (o.clientValidation !== false){ // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    getParams : function() {
+        var o = {};
+        var bp = this.form.baseParams;
+        var p = this.options.params;
+        Ext.apply(o, p, bp);
+        return o;
+    },
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse : function(result) {
+        this.result = result;
+        return result;
+    },
+
+    success : function(response, trans){
+        if(trans.type == Ext.Direct.exceptions.SERVER){
+            response = {};
+        }
+        Ext.form.Action.DirectSubmit.superclass.success.call(this, response);
+    }
+});
+
+Ext.form.Action.ACTION_TYPES = {
+    'load' : Ext.form.Action.Load,
+    'submit' : Ext.form.Action.Submit,
+    'directload' : Ext.form.Action.DirectLoad,
+    'directsubmit' : Ext.form.Action.DirectSubmit
+};
+/**
+ * @class Ext.form.VTypes
+ * <p>This is a singleton object which contains a set of commonly used field validation functions.
+ * The validations provided are basic and intended to be easily customizable and extended.</p>
+ * <p>To add custom VTypes specify the <code>{@link Ext.form.TextField#vtype vtype}</code> validation
+ * test function, and optionally specify any corresponding error text to display and any keystroke
+ * filtering mask to apply. For example:</p>
+ * <pre><code>
+// custom Vtype for vtype:'time'
+var timeTest = /^([1-9]|1[0-9]):([0-5][0-9])(\s[a|p]m)$/i;
+Ext.apply(Ext.form.VTypes, {
+    //  vtype validation function
+    time: function(val, field) {
+        return timeTest.test(val);
+    },
+    // vtype Text property: The error text to display when the validation function returns false
+    timeText: 'Not a valid time.  Must be in the format "12:34 PM".',
+    // vtype Mask property: The keystroke filter mask
+    timeMask: /[\d\s:amp]/i
+});
+ * </code></pre>
+ * Another example:
+ * <pre><code>
+// custom Vtype for vtype:'IPAddress'
+Ext.apply(Ext.form.VTypes, {
+    IPAddress:  function(v) {
+        return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
+    },
+    IPAddressText: 'Must be a numeric IP address',
+    IPAddressMask: /[\d\.]/i
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.form.VTypes = function(){
+    // closure these in so they are only created once.
+    var alpha = /^[a-zA-Z_]+$/,
+        alphanum = /^[a-zA-Z0-9_]+$/,
+        email = /^(\w+)([\-+.\'][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,
+        url = /(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
+
+    // All these messages and functions are configurable
+    return {
+        /**
+         * The function used to validate email addresses.  Note that this is a very basic validation -- complete
+         * validation per the email RFC specifications is very complex and beyond the scope of this class, although
+         * this function can be overridden if a more comprehensive validation scheme is desired.  See the validation
+         * section of the <a href="http://en.wikipedia.org/wiki/E-mail_address">Wikipedia article on email addresses</a>
+         * for additional information.  This implementation is intended to validate the following emails:<tt>
+         * 'barney@example.de', 'barney.rubble@example.com', 'barney-rubble@example.coop', 'barney+rubble@example.com'
+         * </tt>.
+         * @param {String} value The email address
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'email' : function(v){
+            return email.test(v);
+        },
+        /**
+         * The error text to display when the email validation function returns false.  Defaults to:
+         * <tt>'This field should be an e-mail address in the format "user@example.com"'</tt>
+         * @type String
+         */
+        'emailText' : 'This field should be an e-mail address in the format "user@example.com"',
+        /**
+         * The keystroke filter mask to be applied on email input.  See the {@link #email} method for
+         * information about more complex email validation. Defaults to:
+         * <tt>/[a-z0-9_\.\-\+\'@]/i</tt>
+         * @type RegExp
+         */
+        'emailMask' : /[a-z0-9_\.\-\+\'@]/i,
+
+        /**
+         * The function used to validate URLs
+         * @param {String} value The URL
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'url' : function(v){
+            return url.test(v);
+        },
+        /**
+         * The error text to display when the url validation function returns false.  Defaults to:
+         * <tt>'This field should be a URL in the format "http:/'+'/www.example.com"'</tt>
+         * @type String
+         */
+        'urlText' : 'This field should be a URL in the format "http:/'+'/www.example.com"',
+
+        /**
+         * The function used to validate alpha values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alpha' : function(v){
+            return alpha.test(v);
+        },
+        /**
+         * The error text to display when the alpha validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters and _'</tt>
+         * @type String
+         */
+        'alphaText' : 'This field should only contain letters and _',
+        /**
+         * The keystroke filter mask to be applied on alpha input.  Defaults to:
+         * <tt>/[a-z_]/i</tt>
+         * @type RegExp
+         */
+        'alphaMask' : /[a-z_]/i,
+
+        /**
+         * The function used to validate alphanumeric values
+         * @param {String} value The value
+         * @return {Boolean} true if the RegExp test passed, and false if not.
+         */
+        'alphanum' : function(v){
+            return alphanum.test(v);
+        },
+        /**
+         * The error text to display when the alphanumeric validation function returns false.  Defaults to:
+         * <tt>'This field should only contain letters, numbers and _'</tt>
+         * @type String
+         */
+        'alphanumText' : 'This field should only contain letters, numbers and _',
+        /**
+         * The keystroke filter mask to be applied on alphanumeric input.  Defaults to:
+         * <tt>/[a-z0-9_]/i</tt>
+         * @type RegExp
+         */
+        'alphanumMask' : /[a-z0-9_]/i
+    };
+}();
+/**
+ * @class Ext.grid.GridPanel
+ * @extends Ext.Panel
+ * <p>This class represents the primary interface of a component based grid control to represent data
+ * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>
+ * <div class="mdetail-params"><ul>
+ * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface
+ * <div class="sub-desc"></div></li>
+ * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior
+ * <div class="sub-desc"></div></li>
+ * </ul></div>
+ * <p>Example usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    {@link #store}: new {@link Ext.data.Store}({
+        {@link Ext.data.Store#autoDestroy autoDestroy}: true,
+        {@link Ext.data.Store#reader reader}: reader,
+        {@link Ext.data.Store#data data}: xg.dummyData
+    }),
+    {@link #colModel}: new {@link Ext.grid.ColumnModel}({
+        {@link Ext.grid.ColumnModel#defaults defaults}: {
+            width: 120,
+            sortable: true
+        },
+        {@link Ext.grid.ColumnModel#columns columns}: [
+            {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
+            {header: 'Change', dataIndex: 'change'},
+            {header: '% Change', dataIndex: 'pctChange'},
+            // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype
+            {
+                header: 'Last Updated', width: 135, dataIndex: 'lastChange',
+                xtype: 'datecolumn', format: 'M d, Y'
+            }
+        ]
+    }),
+    {@link #viewConfig}: {
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+
+//      Return CSS class to apply to rows depending upon data values
+        {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {
+            var c = record.{@link Ext.data.Record#get get}('change');
+            if (c < 0) {
+                return 'price-fall';
+            } else if (c > 0) {
+                return 'price-rise';
+            }
+        }
+    },
+    {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),
+    width: 600,
+    height: 300,
+    frame: true,
+    title: 'Framed with Row Selection and Horizontal Scrolling',
+    iconCls: 'icon-grid'
+});
+ * </code></pre>
+ * <p><b><u>Notes:</u></b></p>
+ * <div class="mdetail-params"><ul>
+ * <li>Although this class inherits many configuration options from base classes, some of them
+ * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will
+ * have no effect.</li>
+ * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to
+ * scroll its rows. These dimensions can either be set explicitly through the
+ * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>
+ * configuration options or implicitly set by using the grid as a child item of a
+ * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}
+ * provide the sizing of its child items (for example the Container of the Grid may specify
+ * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>
+ * <li>To access the data in a Grid, it is necessary to use the data model encapsulated
+ * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype grid
+ */
+Ext.grid.GridPanel = Ext.extend(Ext.Panel, {
+    /**
+     * @cfg {String} autoExpandColumn
+     * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in
+     * this grid that should expand to fill unused space. This value specified here can not
+     * be <tt>0</tt>.</p>
+     * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with
+     * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>
+     * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>
+     * for additional details.</p>
+     * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>
+     */
+    autoExpandColumn : false,
+    
+    /**
+     * @cfg {Number} autoExpandMax The maximum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>1000</tt>.
+     */
+    autoExpandMax : 1000,
+    
+    /**
+     * @cfg {Number} autoExpandMin The minimum width the <tt>{@link #autoExpandColumn}</tt>
+     * can have (if enabled). Defaults to <tt>50</tt>.
+     */
+    autoExpandMin : 50,
+    
+    /**
+     * @cfg {Boolean} columnLines <tt>true</tt> to add css for column separation lines.
+     * Default is <tt>false</tt>.
+     */
+    columnLines : false,
+    
+    /**
+     * @cfg {Object} cm Shorthand for <tt>{@link #colModel}</tt>.
+     */
+    /**
+     * @cfg {Object} colModel The {@link Ext.grid.ColumnModel} to use when rendering the grid (required).
+     */
+    /**
+     * @cfg {Array} columns An array of {@link Ext.grid.Column columns} to auto create a
+     * {@link Ext.grid.ColumnModel}.  The ColumnModel may be explicitly created via the
+     * <tt>{@link #colModel}</tt> configuration property.
+     */
+    /**
+     * @cfg {String} ddGroup The DD group this GridPanel belongs to. Defaults to <tt>'GridDD'</tt> if not specified.
+     */
+    /**
+     * @cfg {String} ddText
+     * Configures the text in the drag proxy.  Defaults to:
+     * <pre><code>
+     * ddText : '{0} selected row{1}'
+     * </code></pre>
+     * <tt>{0}</tt> is replaced with the number of selected rows.
+     */
+    ddText : '{0} selected row{1}',
+    
+    /**
+     * @cfg {Boolean} deferRowRender <P>Defaults to <tt>true</tt> to enable deferred row rendering.</p>
+     * <p>This allows the GridPanel to be initially rendered empty, with the expensive update of the row
+     * structure deferred so that layouts with GridPanels appear more quickly.</p>
+     */
+    deferRowRender : true,
+    
+    /**
+     * @cfg {Boolean} disableSelection <p><tt>true</tt> to disable selections in the grid. Defaults to <tt>false</tt>.</p>
+     * <p>Ignored if a {@link #selModel SelectionModel} is specified.</p>
+     */
+    /**
+     * @cfg {Boolean} enableColumnResize <tt>false</tt> to turn off column resizing for the whole grid. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} enableColumnHide
+     * Defaults to <tt>true</tt> to enable {@link Ext.grid.Column#hidden hiding of columns}
+     * with the {@link #enableHdMenu header menu}.
+     */
+    enableColumnHide : true,
+    
+    /**
+     * @cfg {Boolean} enableColumnMove Defaults to <tt>true</tt> to enable drag and drop reorder of columns. <tt>false</tt>
+     * to turn off column reordering via drag drop.
+     */
+    enableColumnMove : true,
+    
+    /**
+     * @cfg {Boolean} enableDragDrop <p>Enables dragging of the selected rows of the GridPanel. Defaults to <tt>false</tt>.</p>
+     * <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's {@link #getView GridView} to
+     * create an instance of {@link Ext.grid.GridDragZone}. <b>Note</b>: this is available only <b>after</b>
+     * the Grid has been rendered as the GridView's <tt>{@link Ext.grid.GridView#dragZone dragZone}</tt>
+     * property.</p>
+     * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's implementations of
+     * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} are able
+     * to process the {@link Ext.grid.GridDragZone#getDragData data} which is provided.</p>
+     */
+    enableDragDrop : false,
+    
+    /**
+     * @cfg {Boolean} enableHdMenu Defaults to <tt>true</tt> to enable the drop down button for menu in the headers.
+     */
+    enableHdMenu : true,
+    
+    /**
+     * @cfg {Boolean} hideHeaders True to hide the grid's header. Defaults to <code>false</code>.
+     */
+    /**
+     * @cfg {Object} loadMask An {@link Ext.LoadMask} config or true to mask the grid while
+     * loading. Defaults to <code>false</code>.
+     */
+    loadMask : false,
+    
+    /**
+     * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if <tt>autoHeight</tt> is not on.
+     */
+    /**
+     * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Defaults to <tt>25</tt>.
+     */
+    minColumnWidth : 25,
+    
+    /**
+     * @cfg {Object} sm Shorthand for <tt>{@link #selModel}</tt>.
+     */
+    /**
+     * @cfg {Object} selModel Any subclass of {@link Ext.grid.AbstractSelectionModel} that will provide
+     * the selection model for the grid (defaults to {@link Ext.grid.RowSelectionModel} if not specified).
+     */
+    /**
+     * @cfg {Ext.data.Store} store The {@link Ext.data.Store} the grid should use as its data source (required).
+     */
+    /**
+     * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.
+     * <p>This causes the CSS class <tt><b>x-grid3-row-alt</b></tt> to be added to alternate rows of
+     * the grid. A default CSS rule is provided which sets a background colour, but you can override this
+     * with a rule which either overrides the <b>background-color</b> style using the '!important'
+     * modifier, or which uses a CSS selector of higher specificity.</p>
+     */
+    stripeRows : false,
+    
+    /**
+     * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is <tt>true</tt>
+     * for GridPanel, but <tt>false</tt> for EditorGridPanel.
+     */
+    trackMouseOver : true,
+    
+    /**
+     * @cfg {Array} stateEvents
+     * An array of events that, when fired, should trigger this component to save its state.
+     * Defaults to:<pre><code>
+     * stateEvents: ['columnmove', 'columnresize', 'sortchange', 'groupchange']
+     * </code></pre>
+     * <p>These can be any types of events supported by this component, including browser or
+     * custom events (e.g., <tt>['click', 'customerchange']</tt>).</p>
+     * <p>See {@link Ext.Component#stateful} for an explanation of saving and restoring
+     * Component state.</p>
+     */
+    stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],
+    
+    /**
+     * @cfg {Object} view The {@link Ext.grid.GridView} used by the grid. This can be set
+     * before a call to {@link Ext.Component#render render()}.
+     */
+    view : null,
+
+    /**
+     * @cfg {Array} bubbleEvents
+     * <p>An array of events that, when fired, should be bubbled to any parent container.
+     * See {@link Ext.util.Observable#enableBubble}.
+     * Defaults to <tt>[]</tt>.
+     */
+    bubbleEvents: [],
+
+    /**
+     * @cfg {Object} viewConfig A config object that will be applied to the grid's UI view.  Any of
+     * the config options available for {@link Ext.grid.GridView} can be specified here. This option
+     * is ignored if <tt>{@link #view}</tt> is specified.
+     */
+
+    // private
+    rendered : false,
+    
+    // private
+    viewReady : false,
+
+    // private
+    initComponent : function() {
+        Ext.grid.GridPanel.superclass.initComponent.call(this);
+
+        if (this.columnLines) {
+            this.cls = (this.cls || '') + ' x-grid-with-col-lines';
+        }
+        // override any provided value since it isn't valid
+        // and is causing too many bug reports ;)
+        this.autoScroll = false;
+        this.autoWidth = false;
+
+        if(Ext.isArray(this.columns)){
+            this.colModel = new Ext.grid.ColumnModel(this.columns);
+            delete this.columns;
+        }
+
+        // check and correct shorthanded configs
+        if(this.ds){
+            this.store = this.ds;
+            delete this.ds;
+        }
+        if(this.cm){
+            this.colModel = this.cm;
+            delete this.cm;
+        }
+        if(this.sm){
+            this.selModel = this.sm;
+            delete this.sm;
+        }
+        this.store = Ext.StoreMgr.lookup(this.store);
+
+        this.addEvents(
+            // raw events
+            /**
+             * @event click
+             * The raw click event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event dblclick
+             * The raw dblclick event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event contextmenu
+             * The raw contextmenu event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event mousedown
+             * The raw mousedown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mousedown',
+            /**
+             * @event mouseup
+             * The raw mouseup event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseup',
+            /**
+             * @event mouseover
+             * The raw mouseover event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseover',
+            /**
+             * @event mouseout
+             * The raw mouseout event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'mouseout',
+            /**
+             * @event keypress
+             * The raw keypress event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keypress',
+            /**
+             * @event keydown
+             * The raw keydown event for the entire grid.
+             * @param {Ext.EventObject} e
+             */
+            'keydown',
+
+            // custom events
+            /**
+             * @event cellmousedown
+             * Fires before a cell is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellmousedown',
+            /**
+             * @event rowmousedown
+             * Fires before a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowmousedown',
+            /**
+             * @event headermousedown
+             * Fires before a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headermousedown',
+
+            /**
+             * @event groupmousedown
+             * Fires before a group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupmousedown',
+
+            /**
+             * @event rowbodymousedown
+             * Fires before the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodymousedown',
+
+            /**
+             * @event containermousedown
+             * Fires before the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containermousedown',
+
+            /**
+             * @event cellclick
+             * Fires when a cell is clicked.
+             * The data for the cell is drawn from the {@link Ext.data.Record Record}
+             * for this row. To access the data in the listener function use the
+             * following technique:
+             * <pre><code>
+function(grid, rowIndex, columnIndex, e) {
+    var record = grid.getStore().getAt(rowIndex);  // Get the Record
+    var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name
+    var data = record.get(fieldName);
+}
+</code></pre>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellclick',
+            /**
+             * @event celldblclick
+             * Fires when a cell is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'celldblclick',
+            /**
+             * @event rowclick
+             * Fires when a row is clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowclick',
+            /**
+             * @event rowdblclick
+             * Fires when a row is double clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowdblclick',
+            /**
+             * @event headerclick
+             * Fires when a header is clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerclick',
+            /**
+             * @event headerdblclick
+             * Fires when a header cell is double clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headerdblclick',
+            /**
+             * @event groupclick
+             * Fires when group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupclick',
+            /**
+             * @event groupdblclick
+             * Fires when group header is double clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupdblclick',
+            /**
+             * @event containerclick
+             * Fires when the container is clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerclick',
+            /**
+             * @event containerdblclick
+             * Fires when the container is double clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containerdblclick',
+
+            /**
+             * @event rowbodyclick
+             * Fires when the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodyclick',
+            /**
+             * @event rowbodydblclick
+             * Fires when the row body is double clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodydblclick',
+
+            /**
+             * @event rowcontextmenu
+             * Fires when a row is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowcontextmenu',
+            /**
+             * @event cellcontextmenu
+             * Fires when a cell is right clicked
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Number} cellIndex
+             * @param {Ext.EventObject} e
+             */
+            'cellcontextmenu',
+            /**
+             * @event headercontextmenu
+             * Fires when a header is right clicked
+             * @param {Grid} this
+             * @param {Number} columnIndex
+             * @param {Ext.EventObject} e
+             */
+            'headercontextmenu',
+            /**
+             * @event groupcontextmenu
+             * Fires when group header is right clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.
+             * @param {Grid} this
+             * @param {String} groupField
+             * @param {String} groupValue
+             * @param {Ext.EventObject} e
+             */
+            'groupcontextmenu',
+            /**
+             * @event containercontextmenu
+             * Fires when the container is right clicked. The container consists of any part of the grid body that is not covered by a row.
+             * @param {Grid} this
+             * @param {Ext.EventObject} e
+             */
+            'containercontextmenu',
+            /**
+             * @event rowbodycontextmenu
+             * Fires when the row body is right clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>
+             * @param {Grid} this
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'rowbodycontextmenu',
+            /**
+             * @event bodyscroll
+             * Fires when the body element is scrolled
+             * @param {Number} scrollLeft
+             * @param {Number} scrollTop
+             */
+            'bodyscroll',
+            /**
+             * @event columnresize
+             * Fires when the user resizes a column
+             * @param {Number} columnIndex
+             * @param {Number} newSize
+             */
+            'columnresize',
+            /**
+             * @event columnmove
+             * Fires when the user moves a column
+             * @param {Number} oldIndex
+             * @param {Number} newIndex
+             */
+            'columnmove',
+            /**
+             * @event sortchange
+             * Fires when the grid's store sort changes
+             * @param {Grid} this
+             * @param {Object} sortInfo An object with the keys field and direction
+             */
+            'sortchange',
+            /**
+             * @event groupchange
+             * Fires when the grid's grouping changes (only applies for grids with a {@link Ext.grid.GroupingView GroupingView})
+             * @param {Grid} this
+             * @param {String} groupField A string with the grouping field, null if the store is not grouped.
+             */
+            'groupchange',
+            /**
+             * @event reconfigure
+             * Fires when the grid is reconfigured with a new store and/or column model.
+             * @param {Grid} this
+             * @param {Ext.data.Store} store The new store
+             * @param {Ext.grid.ColumnModel} colModel The new column model
+             */
+            'reconfigure',
+            /**
+             * @event viewready
+             * Fires when the grid view is available (use this for selecting a default row).
+             * @param {Grid} this
+             */
+            'viewready'
+        );
+    },
+
+    // private
+    onRender : function(ct, position){
+        Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);
+
+        var c = this.getGridEl();
+
+        this.el.addClass('x-grid-panel');
+
+        this.mon(c, {
+            scope: this,
+            mousedown: this.onMouseDown,
+            click: this.onClick,
+            dblclick: this.onDblClick,
+            contextmenu: this.onContextMenu
+        });
+
+        this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);
+
+        var view = this.getView();
+        view.init(this);
+        view.render();
+        this.getSelectionModel().init(this);
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.GridPanel.superclass.initEvents.call(this);
+
+        if(this.loadMask){
+            this.loadMask = new Ext.LoadMask(this.bwrap,
+                    Ext.apply({store:this.store}, this.loadMask));
+        }
+    },
+
+    initStateEvents : function(){
+        Ext.grid.GridPanel.superclass.initStateEvents.call(this);
+        this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});
+    },
+
+    applyState : function(state){
+        var cm = this.colModel,
+            cs = state.columns,
+            store = this.store,
+            s,
+            c,
+            colIndex;
+
+        if(cs){
+            for(var i = 0, len = cs.length; i < len; i++){
+                s = cs[i];
+                c = cm.getColumnById(s.id);
+                if(c){
+                    colIndex = cm.getIndexById(s.id);
+                    cm.setState(colIndex, {
+                        hidden: s.hidden,
+                        width: s.width,
+                        sortable: s.sortable
+                    });
+                    if(colIndex != i){
+                        cm.moveColumn(colIndex, i);
+                    }
+                }
+            }
+        }
+        if(store){
+            s = state.sort;
+            if(s){
+                store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);
+            }
+            s = state.group;
+            if(store.groupBy){
+                if(s){
+                    store.groupBy(s);
+                }else{
+                    store.clearGrouping();
+                }
+            }
+
+        }
+        var o = Ext.apply({}, state);
+        delete o.columns;
+        delete o.sort;
+        Ext.grid.GridPanel.superclass.applyState.call(this, o);
+    },
+
+    getState : function(){
+        var o = {columns: []},
+            store = this.store,
+            ss,
+            gs;
+
+        for(var i = 0, c; (c = this.colModel.config[i]); i++){
+            o.columns[i] = {
+                id: c.id,
+                width: c.width
+            };
+            if(c.hidden){
+                o.columns[i].hidden = true;
+            }
+            if(c.sortable){
+                o.columns[i].sortable = true;
+            }
+        }
+        if(store){
+            ss = store.getSortState();
+            if(ss){
+                o.sort = ss;
+            }
+            if(store.getGroupState){
+                gs = store.getGroupState();
+                if(gs){
+                    o.group = gs;
+                }
+            }
+        }
+        return o;
+    },
+
+    // private
+    afterRender : function(){
+        Ext.grid.GridPanel.superclass.afterRender.call(this);
+        var v = this.view;
+        this.on('bodyresize', v.layout, v);
+        v.layout(true);
+        if(this.deferRowRender){
+            if (!this.deferRowRenderTask){
+                this.deferRowRenderTask = new Ext.util.DelayedTask(v.afterRender, this.view);
+            }
+            this.deferRowRenderTask.delay(10);
+        }else{
+            v.afterRender();
+        }
+        this.viewReady = true;
+    },
+
+    /**
+     * <p>Reconfigures the grid to use a different Store and Column Model
+     * and fires the 'reconfigure' event. The View will be bound to the new
+     * objects and refreshed.</p>
+     * <p>Be aware that upon reconfiguring a GridPanel, certain existing settings <i>may</i> become
+     * invalidated. For example the configured {@link #autoExpandColumn} may no longer exist in the
+     * new ColumnModel. Also, an existing {@link Ext.PagingToolbar PagingToolbar} will still be bound
+     * to the old Store, and will need rebinding. Any {@link #plugins} might also need reconfiguring
+     * with the new data.</p>
+     * @param {Ext.data.Store} store The new {@link Ext.data.Store} object
+     * @param {Ext.grid.ColumnModel} colModel The new {@link Ext.grid.ColumnModel} object
+     */
+    reconfigure : function(store, colModel){
+        var rendered = this.rendered;
+        if(rendered){
+            if(this.loadMask){
+                this.loadMask.destroy();
+                this.loadMask = new Ext.LoadMask(this.bwrap,
+                        Ext.apply({}, {store:store}, this.initialConfig.loadMask));
+            }
+        }
+        if(this.view){
+            this.view.initData(store, colModel);
+        }
+        this.store = store;
+        this.colModel = colModel;
+        if(rendered){
+            this.view.refresh(true);
+        }
+        this.fireEvent('reconfigure', this, store, colModel);
+    },
+
+    // private
+    onDestroy : function(){
+        if (this.deferRowRenderTask && this.deferRowRenderTask.cancel){
+            this.deferRowRenderTask.cancel();
+        }
+        if(this.rendered){
+            Ext.destroy(this.view, this.loadMask);
+        }else if(this.store && this.store.autoDestroy){
+            this.store.destroy();
+        }
+        Ext.destroy(this.colModel, this.selModel);
+        this.store = this.selModel = this.colModel = this.view = this.loadMask = null;
+        Ext.grid.GridPanel.superclass.onDestroy.call(this);
+    },
+
+    // private
+    processEvent : function(name, e){
+        this.view.processEvent(name, e);
+    },
+
+    // private
+    onClick : function(e){
+        this.processEvent('click', e);
+    },
+
+    // private
+    onMouseDown : function(e){
+        this.processEvent('mousedown', e);
+    },
+
+    // private
+    onContextMenu : function(e, t){
+        this.processEvent('contextmenu', e);
+    },
+
+    // private
+    onDblClick : function(e){
+        this.processEvent('dblclick', e);
+    },
+
+    // private
+    walkCells : function(row, col, step, fn, scope){
+        var cm    = this.colModel,
+            clen  = cm.getColumnCount(),
+            ds    = this.store,
+            rlen  = ds.getCount(),
+            first = true;
+
+        if(step < 0){
+            if(col < 0){
+                row--;
+                first = false;
+            }
+            while(row >= 0){
+                if(!first){
+                    col = clen-1;
+                }
+                first = false;
+                while(col >= 0){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col--;
+                }
+                row--;
+            }
+        } else {
+            if(col >= clen){
+                row++;
+                first = false;
+            }
+            while(row < rlen){
+                if(!first){
+                    col = 0;
+                }
+                first = false;
+                while(col < clen){
+                    if(fn.call(scope || this, row, col, cm) === true){
+                        return [row, col];
+                    }
+                    col++;
+                }
+                row++;
+            }
+        }
+        return null;
+    },
+
+    /**
+     * Returns the grid's underlying element.
+     * @return {Element} The element
+     */
+    getGridEl : function(){
+        return this.body;
+    },
+
+    // private for compatibility, overridden by editor grid
+    stopEditing : Ext.emptyFn,
+
+    /**
+     * Returns the grid's selection model configured by the <code>{@link #selModel}</code>
+     * configuration option. If no selection model was configured, this will create
+     * and return a {@link Ext.grid.RowSelectionModel RowSelectionModel}.
+     * @return {SelectionModel}
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new Ext.grid.RowSelectionModel(
+                    this.disableSelection ? {selectRow: Ext.emptyFn} : null);
+        }
+        return this.selModel;
+    },
+
+    /**
+     * Returns the grid's data store.
+     * @return {Ext.data.Store} The store
+     */
+    getStore : function(){
+        return this.store;
+    },
+
+    /**
+     * Returns the grid's ColumnModel.
+     * @return {Ext.grid.ColumnModel} The column model
+     */
+    getColumnModel : function(){
+        return this.colModel;
+    },
+
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.GridView} The grid view
+     */
+    getView : function() {
+        if (!this.view) {
+            this.view = new Ext.grid.GridView(this.viewConfig);
+        }
+        
+        return this.view;
+    },
+    /**
+     * Called to get grid's drag proxy text, by default returns this.ddText.
+     * @return {String} The text
+     */
+    getDragDropText : function(){
+        var count = this.selModel.getCount();
+        return String.format(this.ddText, count, count == 1 ? '' : 's');
+    }
+
+    /**
+     * @cfg {String/Number} activeItem
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoDestroy
+     * @hide
+     */
+    /**
+     * @cfg {Object/String/Function} autoLoad
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} autoWidth
+     * @hide
+     */
+    /**
+     * @cfg {Boolean/Number} bufferResize
+     * @hide
+     */
+    /**
+     * @cfg {String} defaultType
+     * @hide
+     */
+    /**
+     * @cfg {Object} defaults
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} hideBorders
+     * @hide
+     */
+    /**
+     * @cfg {Mixed} items
+     * @hide
+     */
+    /**
+     * @cfg {String} layout
+     * @hide
+     */
+    /**
+     * @cfg {Object} layoutConfig
+     * @hide
+     */
+    /**
+     * @cfg {Boolean} monitorResize
+     * @hide
+     */
+    /**
+     * @property items
+     * @hide
+     */
+    /**
+     * @method add
+     * @hide
+     */
+    /**
+     * @method cascade
+     * @hide
+     */
+    /**
+     * @method doLayout
+     * @hide
+     */
+    /**
+     * @method find
+     * @hide
+     */
+    /**
+     * @method findBy
+     * @hide
+     */
+    /**
+     * @method findById
+     * @hide
+     */
+    /**
+     * @method findByType
+     * @hide
+     */
+    /**
+     * @method getComponent
+     * @hide
+     */
+    /**
+     * @method getLayout
+     * @hide
+     */
+    /**
+     * @method getUpdater
+     * @hide
+     */
+    /**
+     * @method insert
+     * @hide
+     */
+    /**
+     * @method load
+     * @hide
+     */
+    /**
+     * @method remove
+     * @hide
+     */
+    /**
+     * @event add
+     * @hide
+     */
+    /**
+     * @event afterlayout
+     * @hide
+     */
+    /**
+     * @event beforeadd
+     * @hide
+     */
+    /**
+     * @event beforeremove
+     * @hide
+     */
+    /**
+     * @event remove
+     * @hide
+     */
+
+
+
+    /**
+     * @cfg {String} allowDomMove  @hide
+     */
+    /**
+     * @cfg {String} autoEl @hide
+     */
+    /**
+     * @cfg {String} applyTo  @hide
+     */
+    /**
+     * @cfg {String} autoScroll  @hide
+     */
+    /**
+     * @cfg {String} bodyBorder  @hide
+     */
+    /**
+     * @cfg {String} bodyStyle  @hide
+     */
+    /**
+     * @cfg {String} contentEl  @hide
+     */
+    /**
+     * @cfg {String} disabledClass  @hide
+     */
+    /**
+     * @cfg {String} elements  @hide
+     */
+    /**
+     * @cfg {String} html  @hide
+     */
+    /**
+     * @cfg {Boolean} preventBodyReset
+     * @hide
+     */
+    /**
+     * @property disabled
+     * @hide
+     */
+    /**
+     * @method applyToMarkup
+     * @hide
+     */
+    /**
+     * @method enable
+     * @hide
+     */
+    /**
+     * @method disable
+     * @hide
+     */
+    /**
+     * @method setDisabled
+     * @hide
+     */
+});
+Ext.reg('grid', Ext.grid.GridPanel);/**
+ * @class Ext.grid.PivotGrid
+ * @extends Ext.grid.GridPanel
+ * <p>The PivotGrid component enables rapid summarization of large data sets. It provides a way to reduce a large set of
+ * data down into a format where trends and insights become more apparent. A classic example is in sales data; a company
+ * will often have a record of all sales it makes for a given period - this will often encompass thousands of rows of
+ * data. The PivotGrid allows you to see how well each salesperson performed, which cities generate the most revenue, 
+ * how products perform between cities and so on.</p>
+ * <p>A PivotGrid is composed of two axes (left and top), one {@link #measure} and one {@link #aggregator aggregation}
+ * function. Each axis can contain one or more {@link #dimension}, which are ordered into a hierarchy. Dimensions on the 
+ * left axis can also specify a width. Each dimension in each axis can specify its sort ordering, defaulting to "ASC", 
+ * and must specify one of the fields in the {@link Ext.data.Record Record} used by the PivotGrid's 
+ * {@link Ext.data.Store Store}.</p>
+<pre><code>
+// This is the record representing a single sale
+var SaleRecord = Ext.data.Record.create([
+    {name: 'person',   type: 'string'},
+    {name: 'product',  type: 'string'},
+    {name: 'city',     type: 'string'},
+    {name: 'state',    type: 'string'},
+    {name: 'year',     type: 'int'},
+    {name: 'value',    type: 'int'}
+]);
+
+// A simple store that loads SaleRecord data from a url
+var myStore = new Ext.data.Store({
+    url: 'data.json',
+    autoLoad: true,
+    reader: new Ext.data.JsonReader({
+        root: 'rows',
+        idProperty: 'id'
+    }, SaleRecord)
+});
+
+// Create the PivotGrid itself, referencing the store
+var pivot = new Ext.grid.PivotGrid({
+    store     : myStore,
+    aggregator: 'sum',
+    measure   : 'value',
+
+    leftAxis: [
+        {
+            width: 60,
+            dataIndex: 'product'
+        },
+        {
+            width: 120,
+            dataIndex: 'person',
+            direction: 'DESC'
+        }
+    ],
+
+    topAxis: [
+        {
+            dataIndex: 'year'
+        }
+    ]
+});
+</code></pre>
+ * <p>The specified {@link #measure} is the field from SaleRecord that is extracted from each combination
+ * of product and person (on the left axis) and year on the top axis. There may be several SaleRecords in the 
+ * data set that share this combination, so an array of measure fields is produced. This array is then 
+ * aggregated using the {@link #aggregator} function.</p>
+ * <p>The default aggregator function is sum, which simply adds up all of the extracted measure values. Other
+ * built-in aggregator functions are count, avg, min and max. In addition, you can specify your own function.
+ * In this example we show the code used to sum the measures, but you can return any value you like. See
+ * {@link #aggregator} for more details.</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    aggregator: function(records, measure) {
+        var length = records.length,
+            total  = 0,
+            i;
+
+        for (i = 0; i < length; i++) {
+            total += records[i].get(measure);
+        }
+
+        return total;
+    },
+    
+    renderer: function(value) {
+        return Math.round(value);
+    },
+    
+    //your normal config here
+});
+</code></pre>
+ * <p><u>Renderers</u></p>
+ * <p>PivotGrid optionally accepts a {@link #renderer} function which can modify the data in each cell before it
+ * is rendered. The renderer is passed the value that would usually be placed in the cell and is expected to return
+ * the new value. For example let's imagine we had height data expressed as a decimal - here's how we might use a
+ * renderer to display the data in feet and inches notation:</p>
+<pre><code>
+new Ext.grid.PivotGrid({
+    //in each case the value is a decimal number of feet
+    renderer  : function(value) {
+        var feet   = Math.floor(value),
+            inches = Math.round((value - feet) * 12);
+
+        return String.format("{0}' {1}\"", feet, inches);
+    },
+    //normal config here
+});
+</code></pre>
+ * <p><u>Reconfiguring</u></p>
+ * <p>All aspects PivotGrid's configuration can be updated at runtime. It is easy to change the {@link #setMeasure measure}, 
+ * {@link #setAggregator aggregation function}, {@link #setLeftAxis left} and {@link #setTopAxis top} axes and refresh the grid.</p>
+ * <p>In this case we reconfigure the PivotGrid to have city and year as the top axis dimensions, rendering the average sale
+ * value into the cells:</p>
+<pre><code>
+//the left axis can also be changed
+pivot.topAxis.setDimensions([
+    {dataIndex: 'city', direction: 'DESC'},
+    {dataIndex: 'year', direction: 'ASC'}
+]);
+
+pivot.setMeasure('value');
+pivot.setAggregator('avg');
+
+pivot.view.refresh(true);
+</code></pre>
+ * <p>See the {@link Ext.grid.PivotAxis PivotAxis} documentation for further detail on reconfiguring axes.</p>
+ */
+Ext.grid.PivotGrid = Ext.extend(Ext.grid.GridPanel, {
+    
+    /**
+     * @cfg {String|Function} aggregator The aggregation function to use to combine the measures extracted
+     * for each dimension combination. Can be any of the built-in aggregators (sum, count, avg, min, max).
+     * Can also be a function which accepts two arguments (an array of Records to aggregate, and the measure 
+     * to aggregate them on) and should return a String.
+     */
+    aggregator: 'sum',
+    
+    /**
+     * @cfg {Function} renderer Optional renderer to pass values through before they are rendered to the dom. This
+     * gives an opportunity to modify cell contents after the value has been computed.
+     */
+    renderer: undefined,
+    
+    /**
+     * @cfg {String} measure The field to extract from each Record when pivoting around the two axes. See the class
+     * introduction docs for usage
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} leftAxis Either and array of {@link #dimension} to use on the left axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    /**
+     * @cfg {Array|Ext.grid.PivotAxis} topAxis Either and array of {@link #dimension} to use on the top axis, or
+     * a {@link Ext.grid.PivotAxis} instance. If an array is passed, it is turned into a PivotAxis internally.
+     */
+    
+    //inherit docs
+    initComponent: function() {
+        Ext.grid.PivotGrid.superclass.initComponent.apply(this, arguments);
+        
+        this.initAxes();
+        
+        //no resizing of columns is allowed yet in PivotGrid
+        this.enableColumnResize = false;
+        
+        this.viewConfig = Ext.apply(this.viewConfig || {}, {
+            forceFit: true
+        });
+        
+        //TODO: dummy col model that is never used - GridView is too tightly integrated with ColumnModel
+        //in 3.x to remove this altogether.
+        this.colModel = new Ext.grid.ColumnModel({});
+    },
+    
+    /**
+     * Returns the function currently used to aggregate the records in each Pivot cell
+     * @return {Function} The current aggregator function
+     */
+    getAggregator: function() {
+        if (typeof this.aggregator == 'string') {
+            return Ext.grid.PivotAggregatorMgr.types[this.aggregator];
+        } else {
+            return this.aggregator;
+        }
+    },
+    
+    /**
+     * Sets the function to use when aggregating data for each cell.
+     * @param {String|Function} aggregator The new aggregator function or named function string
+     */
+    setAggregator: function(aggregator) {
+        this.aggregator = aggregator;
+    },
+    
+    /**
+     * Sets the field name to use as the Measure in this Pivot Grid
+     * @param {String} measure The field to make the measure
+     */
+    setMeasure: function(measure) {
+        this.measure = measure;
+    },
+    
+    /**
+     * Sets the left axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setLeftAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the left Axis for this Pivot Grid
+         * @property leftAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.leftAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * Sets the top axis of this pivot grid. Optionally refreshes the grid afterwards.
+     * @param {Ext.grid.PivotAxis} axis The pivot axis
+     * @param {Boolean} refresh True to immediately refresh the grid and its axes (defaults to false)
+     */
+    setTopAxis: function(axis, refresh) {
+        /**
+         * The configured {@link Ext.grid.PivotAxis} used as the top Axis for this Pivot Grid
+         * @property topAxis
+         * @type Ext.grid.PivotAxis
+         */
+        this.topAxis = axis;
+        
+        if (refresh) {
+            this.view.refresh();
+        }
+    },
+    
+    /**
+     * @private
+     * Creates the top and left axes. Should usually only need to be called once from initComponent
+     */
+    initAxes: function() {
+        var PivotAxis = Ext.grid.PivotAxis;
+        
+        if (!(this.leftAxis instanceof PivotAxis)) {
+            this.setLeftAxis(new PivotAxis({
+                orientation: 'vertical',
+                dimensions : this.leftAxis || [],
+                store      : this.store
+            }));
+        };
+        
+        if (!(this.topAxis instanceof PivotAxis)) {
+            this.setTopAxis(new PivotAxis({
+                orientation: 'horizontal',
+                dimensions : this.topAxis || [],
+                store      : this.store
+            }));
+        };
+    },
+    
+    /**
+     * @private
+     * @return {Array} 2-dimensional array of cell data
+     */
+    extractData: function() {
+        var records  = this.store.data.items,
+            recCount = records.length,
+            cells    = [],
+            record, i, j, k;
+        
+        if (recCount == 0) {
+            return [];
+        }
+        
+        var leftTuples = this.leftAxis.getTuples(),
+            leftCount  = leftTuples.length,
+            topTuples  = this.topAxis.getTuples(),
+            topCount   = topTuples.length,
+            aggregator = this.getAggregator();
+        
+        for (i = 0; i < recCount; i++) {
+            record = records[i];
+            
+            for (j = 0; j < leftCount; j++) {
+                cells[j] = cells[j] || [];
+                
+                if (leftTuples[j].matcher(record) === true) {
+                    for (k = 0; k < topCount; k++) {
+                        cells[j][k] = cells[j][k] || [];
+                        
+                        if (topTuples[k].matcher(record)) {
+                            cells[j][k].push(record);
+                        }
+                    }
+                }
+            }
+        }
+        
+        var rowCount = cells.length,
+            colCount, row;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = cells[i];
+            colCount = row.length;
+            
+            for (j = 0; j < colCount; j++) {
+                cells[i][j] = aggregator(cells[i][j], this.measure);
+            }
+        }
+        
+        return cells;
+    },
+    
+    /**
+     * Returns the grid's GridView object.
+     * @return {Ext.grid.PivotGridView} The grid view
+     */
+    getView: function() {
+        if (!this.view) {
+            this.view = new Ext.grid.PivotGridView(this.viewConfig);
+        }
+        
+        return this.view;
+    }
+});
+
+Ext.reg('pivotgrid', Ext.grid.PivotGrid);
+
+
+Ext.grid.PivotAggregatorMgr = new Ext.AbstractManager();
+
+Ext.grid.PivotAggregatorMgr.registerType('sum', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return total;
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('avg', function(records, measure) {
+    var length = records.length,
+        total  = 0,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        total += records[i].get(measure);
+    }
+    
+    return (total / length) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('min', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.min.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('max', function(records, measure) {
+    var data   = [],
+        length = records.length,
+        i;
+    
+    for (i = 0; i < length; i++) {
+        data.push(records[i].get(measure));
+    }
+    
+    return Math.max.apply(this, data) || 'n/a';
+});
+
+Ext.grid.PivotAggregatorMgr.registerType('count', function(records, measure) {
+    return records.length;
+});/**
+ * @class Ext.grid.GridView
+ * @extends Ext.util.Observable
+ * <p>This class encapsulates the user interface of an {@link Ext.grid.GridPanel}.
+ * Methods of this class may be used to access user interface elements to enable
+ * special display effects. Do not change the DOM structure of the user interface.</p>
+ * <p>This class does not provide ways to manipulate the underlying data. The data
+ * model of a Grid is held in an {@link Ext.data.Store}.</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GridView = Ext.extend(Ext.util.Observable, {
+    /**
+     * Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
+     * parameters to the row template for the current row to customize how it is rendered using the <b>rowParams</b>
+     * parameter.  This function should return the CSS class name (or empty string '' for none) that will be added
+     * to the row's wrapping div.  To apply multiple class names, simply return them space-delimited within the string
+     * (e.g., 'my-class another-class'). Example usage:
+    <pre><code>
+viewConfig: {
+    forceFit: true,
+    showPreview: true, // custom property
+    enableRowBody: true, // required to create a second, full-width row to show expanded Record data
+    getRowClass: function(record, rowIndex, rp, ds){ // rp = rowParams
+        if(this.showPreview){
+            rp.body = '&lt;p>'+record.data.excerpt+'&lt;/p>';
+            return 'x-grid3-row-expanded';
+        }
+        return 'x-grid3-row-collapsed';
+    }
+},
+    </code></pre>
+     * @param {Record} record The {@link Ext.data.Record} corresponding to the current row.
+     * @param {Number} index The row index.
+     * @param {Object} rowParams A config object that is passed to the row template during rendering that allows
+     * customization of various aspects of a grid row.
+     * <p>If {@link #enableRowBody} is configured <b><tt></tt>true</b>, then the following properties may be set
+     * by this function, and will be used to render a full-width expansion row below each grid row:</p>
+     * <ul>
+     * <li><code>body</code> : String <div class="sub-desc">An HTML fragment to be used as the expansion row's body content (defaults to '').</div></li>
+     * <li><code>bodyStyle</code> : String <div class="sub-desc">A CSS style specification that will be applied to the expansion row's &lt;tr> element. (defaults to '').</div></li>
+     * </ul>
+     * The following property will be passed in, and may be appended to:
+     * <ul>
+     * <li><code>tstyle</code> : String <div class="sub-desc">A CSS style specification that willl be applied to the &lt;table> element which encapsulates
+     * both the standard grid row, and any expansion row.</div></li>
+     * </ul>
+     * @param {Store} store The {@link Ext.data.Store} this grid is bound to
+     * @method getRowClass
+     * @return {String} a CSS class name to add to the row.
+     */
+
+    /**
+     * @cfg {Boolean} enableRowBody True to add a second TR element per row that can be used to provide a row body
+     * that spans beneath the data row.  Use the {@link #getRowClass} method's rowParams config to customize the row body.
+     */
+
+    /**
+     * @cfg {String} emptyText Default text (html tags are accepted) to display in the grid body when no rows
+     * are available (defaults to ''). This value will be used to update the <tt>{@link #mainBody}</tt>:
+    <pre><code>
+    this.mainBody.update('&lt;div class="x-grid-empty">' + this.emptyText + '&lt;/div>');
+    </code></pre>
+     */
+
+    /**
+     * @cfg {Boolean} headersDisabled True to disable the grid column headers (defaults to <tt>false</tt>).
+     * Use the {@link Ext.grid.ColumnModel ColumnModel} <tt>{@link Ext.grid.ColumnModel#menuDisabled menuDisabled}</tt>
+     * config to disable the <i>menu</i> for individual columns.  While this config is true the
+     * following will be disabled:<div class="mdetail-params"><ul>
+     * <li>clicking on header to sort</li>
+     * <li>the trigger to reveal the menu.</li>
+     * </ul></div>
+     */
+
+    /**
+     * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations
+     * of the template methods of DragZone to enable dragging of the selected rows of a GridPanel.
+     * See {@link Ext.grid.GridDragZone} for details.</p>
+     * <p>This will <b>only</b> be present:<div class="mdetail-params"><ul>
+     * <li><i>if</i> the owning GridPanel was configured with {@link Ext.grid.GridPanel#enableDragDrop enableDragDrop}: <tt>true</tt>.</li>
+     * <li><i>after</i> the owning GridPanel has been rendered.</li>
+     * </ul></div>
+     * @property dragZone
+     * @type {Ext.grid.GridDragZone}
+     */
+
+    /**
+     * @cfg {Boolean} deferEmptyText True to defer <tt>{@link #emptyText}</tt> being applied until the store's
+     * first load (defaults to <tt>true</tt>).
+     */
+    deferEmptyText : true,
+
+    /**
+     * @cfg {Number} scrollOffset The amount of space to reserve for the vertical scrollbar
+     * (defaults to <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
+     * calculated.
+     */
+    scrollOffset : undefined,
+
+    /**
+     * @cfg {Boolean} autoFill
+     * Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * when the grid is <b>initially rendered</b>.  The
+     * {@link Ext.grid.Column#width initially configured width}</tt> of each column will be adjusted
+     * to fit the grid width and prevent horizontal scrolling. If columns are later resized (manually
+     * or programmatically), the other columns in the grid will <b>not</b> be resized to fit the grid width.
+     * See <tt>{@link #forceFit}</tt> also.
+     */
+    autoFill : false,
+
+    /**
+     * @cfg {Boolean} forceFit
+     * <p>Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
+     * at <b>all times</b>.</p>
+     * <p>The {@link Ext.grid.Column#width initially configured width}</tt> of each
+     * column will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are
+     * later resized (manually or programmatically), the other columns in the grid <b>will</b> be resized
+     * to fit the grid width.</p>
+     * <p>Columns which are configured with <code>fixed: true</code> are omitted from being resized.</p>
+     * <p>See <tt>{@link #autoFill}</tt>.</p>
+     */
+    forceFit : false,
+
+    /**
+     * @cfg {Array} sortClasses The CSS classes applied to a header when it is sorted. (defaults to <tt>['sort-asc', 'sort-desc']</tt>)
+     */
+    sortClasses : ['sort-asc', 'sort-desc'],
+
+    /**
+     * @cfg {String} sortAscText The text displayed in the 'Sort Ascending' menu item (defaults to <tt>'Sort Ascending'</tt>)
+     */
+    sortAscText : 'Sort Ascending',
+
+    /**
+     * @cfg {String} sortDescText The text displayed in the 'Sort Descending' menu item (defaults to <tt>'Sort Descending'</tt>)
+     */
+    sortDescText : 'Sort Descending',
+
+    /**
+     * @cfg {String} columnsText The text displayed in the 'Columns' menu item (defaults to <tt>'Columns'</tt>)
+     */
+    columnsText : 'Columns',
+
+    /**
+     * @cfg {String} selectedRowClass The CSS class applied to a selected row (defaults to <tt>'x-grid3-row-selected'</tt>). An
+     * example overriding the default styling:
+    <pre><code>
+    .x-grid3-row-selected {background-color: yellow;}
+    </code></pre>
+     * Note that this only controls the row, and will not do anything for the text inside it.  To style inner
+     * facets (like text) use something like:
+    <pre><code>
+    .x-grid3-row-selected .x-grid3-cell-inner {
+        color: #FFCC00;
+    }
+    </code></pre>
+     * @type String
+     */
+    selectedRowClass : 'x-grid3-row-selected',
+
+    // private
+    borderWidth : 2,
+    tdClass : 'x-grid3-cell',
+    hdCls : 'x-grid3-hd',
+    
+    
+    /**
+     * @cfg {Boolean} markDirty True to show the dirty cell indicator when a cell has been modified. Defaults to <tt>true</tt>.
+     */
+    markDirty : true,
+
+    /**
+     * @cfg {Number} cellSelectorDepth The number of levels to search for cells in event delegation (defaults to <tt>4</tt>)
+     */
+    cellSelectorDepth : 4,
+    
+    /**
+     * @cfg {Number} rowSelectorDepth The number of levels to search for rows in event delegation (defaults to <tt>10</tt>)
+     */
+    rowSelectorDepth : 10,
+
+    /**
+     * @cfg {Number} rowBodySelectorDepth The number of levels to search for row bodies in event delegation (defaults to <tt>10</tt>)
+     */
+    rowBodySelectorDepth : 10,
+
+    /**
+     * @cfg {String} cellSelector The selector used to find cells internally (defaults to <tt>'td.x-grid3-cell'</tt>)
+     */
+    cellSelector : 'td.x-grid3-cell',
+    
+    /**
+     * @cfg {String} rowSelector The selector used to find rows internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowSelector : 'div.x-grid3-row',
+
+    /**
+     * @cfg {String} rowBodySelector The selector used to find row bodies internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowBodySelector : 'div.x-grid3-row-body',
+
+    // private
+    firstRowCls: 'x-grid3-row-first',
+    lastRowCls: 'x-grid3-row-last',
+    rowClsRe: /(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,
+    
+    /**
+     * @cfg {String} headerMenuOpenCls The CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open'
+     */
+    headerMenuOpenCls: 'x-grid3-hd-menu-open',
+    
+    /**
+     * @cfg {String} rowOverCls The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over'
+     */
+    rowOverCls: 'x-grid3-row-over',
+
+    constructor : function(config) {
+        Ext.apply(this, config);
+        
+        // These events are only used internally by the grid components
+        this.addEvents(
+            /**
+             * @event beforerowremoved
+             * Internal UI Event. Fired before a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row to be removed.
+             * @param {Ext.data.Record} record The Record to be removed
+             */
+            'beforerowremoved',
+            
+            /**
+             * @event beforerowsinserted
+             * Internal UI Event. Fired before rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first row to be inserted.
+             * @param {Number} lastRow The index of the last row to be inserted.
+             */
+            'beforerowsinserted',
+            
+            /**
+             * @event beforerefresh
+             * Internal UI Event. Fired before the view is refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'beforerefresh',
+            
+            /**
+             * @event rowremoved
+             * Internal UI Event. Fired after a row is removed.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} rowIndex The index of the row that was removed.
+             * @param {Ext.data.Record} record The Record that was removed
+             */
+            'rowremoved',
+            
+            /**
+             * @event rowsinserted
+             * Internal UI Event. Fired after rows are inserted.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the first inserted.
+             * @param {Number} lastRow The index of the last row inserted.
+             */
+            'rowsinserted',
+            
+            /**
+             * @event rowupdated
+             * Internal UI Event. Fired after a row has been updated.
+             * @param {Ext.grid.GridView} view
+             * @param {Number} firstRow The index of the row updated.
+             * @param {Ext.data.record} record The Record backing the row updated.
+             */
+            'rowupdated',
+            
+            /**
+             * @event refresh
+             * Internal UI Event. Fired after the GridView's body has been refreshed.
+             * @param {Ext.grid.GridView} view
+             */
+            'refresh'
+        );
+        
+        Ext.grid.GridView.superclass.constructor.call(this);
+    },
+
+    /* -------------------------------- UI Specific ----------------------------- */
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}">{header}</div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * The template to use when rendering headers. Has a default template
+     * @property headerTpl
+     * @type Ext.Template
+     */
+    headerTpl: new Ext.Template(
+        '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+            '<thead>',
+                '<tr class="x-grid3-hd-row">{cells}</tr>',
+            '</thead>',
+        '</table>'
+    ),
+    
+    /**
+     * The template to use when rendering the body. Has a default template
+     * @property bodyTpl
+     * @type Ext.Template
+     */
+    bodyTpl: new Ext.Template('{rows}'),
+    
+    /**
+     * The template to use to render each cell. Has a default template
+     * @property cellTpl
+     * @type Ext.Template
+     */
+    cellTpl: new Ext.Template(
+        '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>',
+            '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',
+        '</td>'
+    ),
+    
+    /**
+     * @private
+     * Provides default templates if they are not given for this particular instance. Most of the templates are defined on
+     * the prototype, the ones defined inside this function are done so because they are based on Grid or GridView configuration
+     */
+    initTemplates : function() {
+        var templates = this.templates || {},
+            template, name,
+            
+            headerCellTpl = new Ext.Template(
+                '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}">',
+                    '<div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '',
+                        '{value}',
+                        '<img alt="" class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />',
+                    '</div>',
+                '</td>'
+            ),
+        
+            rowBodyText = [
+                '<tr class="x-grid3-row-body-tr" style="{bodyStyle}">',
+                    '<td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on">',
+                        '<div class="x-grid3-row-body">{body}</div>',
+                    '</td>',
+                '</tr>'
+            ].join(""),
+        
+            innerText = [
+                '<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
+                     '<tbody>',
+                        '<tr>{cells}</tr>',
+                        this.enableRowBody ? rowBodyText : '',
+                     '</tbody>',
+                '</table>'
+            ].join("");
+        
+        Ext.applyIf(templates, {
+            hcell   : headerCellTpl,
+            cell    : this.cellTpl,
+            body    : this.bodyTpl,
+            header  : this.headerTpl,
+            master  : this.masterTpl,
+            row     : new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}">' + innerText + '</div>'),
+            rowInner: new Ext.Template(innerText)
+        });
+
+        for (name in templates) {
+            template = templates[name];
+            
+            if (template && Ext.isFunction(template.compile) && !template.compiled) {
+                template.disableFormats = true;
+                template.compile();
+            }
+        }
+
+        this.templates = templates;
+        this.colRe = new RegExp('x-grid3-td-([^\\s]+)', '');
+    },
+
+    /**
+     * @private
+     * Each GridView has its own private flyweight, accessed through this method
+     */
+    fly : function(el) {
+        if (!this._flyweight) {
+            this._flyweight = new Ext.Element.Flyweight(document.body);
+        }
+        this._flyweight.dom = el;
+        return this._flyweight;
+    },
+
+    // private
+    getEditorParent : function() {
+        return this.scroller.dom;
+    },
+
+    /**
+     * @private
+     * Finds and stores references to important elements
+     */
+    initElements : function() {
+        var Element  = Ext.Element,
+            el       = Ext.get(this.grid.getGridEl().dom.firstChild),
+            mainWrap = new Element(el.child('div.x-grid3-viewport')),
+            mainHd   = new Element(mainWrap.child('div.x-grid3-header')),
+            scroller = new Element(mainWrap.child('div.x-grid3-scroller'));
+        
+        if (this.grid.hideHeaders) {
+            mainHd.setDisplayed(false);
+        }
+        
+        if (this.forceFit) {
+            scroller.setStyle('overflow-x', 'hidden');
+        }
+        
+        /**
+         * <i>Read-only</i>. The GridView's body Element which encapsulates all rows in the Grid.
+         * This {@link Ext.Element Element} is only available after the GridPanel has been rendered.
+         * @type Ext.Element
+         * @property mainBody
+         */
+        
+        Ext.apply(this, {
+            el      : el,
+            mainWrap: mainWrap,
+            scroller: scroller,
+            mainHd  : mainHd,
+            innerHd : mainHd.child('div.x-grid3-header-inner').dom,
+            mainBody: new Element(Element.fly(scroller).child('div.x-grid3-body')),
+            focusEl : new Element(Element.fly(scroller).child('a')),
+            
+            resizeMarker: new Element(el.child('div.x-grid3-resize-marker')),
+            resizeProxy : new Element(el.child('div.x-grid3-resize-proxy'))
+        });
+        
+        this.focusEl.swallowEvent('click', true);
+    },
+
+    // private
+    getRows : function() {
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // finder methods, used with delegation
+
+    // private
+    findCell : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth);
+    },
+
+    /**
+     * <p>Return the index of the grid column which contains the passed HTMLElement.</p>
+     * See also {@link #findRowIndex}
+     * @param {HTMLElement} el The target element
+     * @return {Number} The column index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findCellIndex : function(el, requiredCls) {
+        var cell = this.findCell(el),
+            hasCls;
+        
+        if (cell) {
+            hasCls = this.fly(cell).hasClass(requiredCls);
+            if (!requiredCls || hasCls) {
+                return this.getCellIndex(cell);
+            }
+        }
+        return false;
+    },
+
+    // private
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe);
+            
+            if (match && match[1]) {
+                return this.cm.getIndexById(match[1]);
+            }
+        }
+        return false;
+    },
+
+    // private
+    findHeaderCell : function(el) {
+        var cell = this.findCell(el);
+        return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null;
+    },
+
+    // private
+    findHeaderIndex : function(el){
+        return this.findCellIndex(el, this.hdCls);
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row element, or null if the target element is not within a row of this GridView.
+     */
+    findRow : function(el) {
+        if (!el) {
+            return false;
+        }
+        return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth);
+    },
+
+    /**
+     * Return the index of the grid row which contains the passed HTMLElement.
+     * See also {@link #findCellIndex}
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {Number} The row index, or <b>false</b> if the target element is not within a row of this GridView.
+     */
+    findRowIndex : function(el) {
+        var row = this.findRow(el);
+        return row ? row.rowIndex : false;
+    },
+
+    /**
+     * Return the HtmlElement representing the grid row body which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row body element, or null if the target element is not within a row body of this GridView.
+     */
+    findRowBody : function(el) {
+        if (!el) {
+            return false;
+        }
+        
+        return this.fly(el).findParent(this.rowBodySelector, this.rowBodySelectorDepth);
+    },
+
+    // getter methods for fetching elements dynamically in the grid
+
+    /**
+     * Return the <tt>&lt;div></tt> HtmlElement which represents a Grid row for the specified index.
+     * @param {Number} index The row index
+     * @return {HtmlElement} The div element.
+     */
+    getRow : function(row) {
+        return this.getRows()[row];
+    },
+
+    /**
+     * Returns the grid's <tt>&lt;td></tt> HtmlElement at the specified coordinates.
+     * @param {Number} row The row index in which to find the cell.
+     * @param {Number} col The column index of the cell.
+     * @return {HtmlElement} The td at the specified coordinates.
+     */
+    getCell : function(row, col) {
+        return Ext.fly(this.getRow(row)).query(this.cellSelector)[col]; 
+    },
+
+    /**
+     * Return the <tt>&lt;td></tt> HtmlElement which represents the Grid's header cell for the specified column index.
+     * @param {Number} index The column index
+     * @return {HtmlElement} The td element.
+     */
+    getHeaderCell : function(index) {
+        return this.mainHd.dom.getElementsByTagName('td')[index];
+    },
+
+    // manipulating elements
+
+    // private - use getRowClass to apply custom row classes
+    addRowClass : function(rowId, cls) {
+        var row = this.getRow(rowId);
+        if (row) {
+            this.fly(row).addClass(cls);
+        }
+    },
+
+    // private
+    removeRowClass : function(row, cls) {
+        var r = this.getRow(row);
+        if(r){
+            this.fly(r).removeClass(cls);
+        }
+    },
+
+    // private
+    removeRow : function(row) {
+        Ext.removeNode(this.getRow(row));
+        this.syncFocusEl(row);
+    },
+
+    // private
+    removeRows : function(firstRow, lastRow) {
+        var bd = this.mainBody.dom,
+            rowIndex;
+            
+        for (rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            Ext.removeNode(bd.childNodes[firstRow]);
+        }
+        
+        this.syncFocusEl(firstRow);
+    },
+
+    /* ----------------------------------- Scrolling functions -------------------------------------------*/
+    
+    // private
+    getScrollState : function() {
+        var sb = this.scroller.dom;
+        
+        return {
+            left: sb.scrollLeft, 
+            top : sb.scrollTop
+        };
+    },
+
+    // private
+    restoreScroll : function(state) {
+        var sb = this.scroller.dom;
+        sb.scrollLeft = state.left;
+        sb.scrollTop  = state.top;
+    },
+
+    /**
+     * Scrolls the grid to the top
+     */
+    scrollToTop : function() {
+        var dom = this.scroller.dom;
+        
+        dom.scrollTop  = 0;
+        dom.scrollLeft = 0;
+    },
+
+    // private
+    syncScroll : function() {
+        this.syncHeaderScroll();
+        var mb = this.scroller.dom;
+        this.grid.fireEvent('bodyscroll', mb.scrollLeft, mb.scrollTop);
+    },
+
+    // private
+    syncHeaderScroll : function() {
+        var innerHd    = this.innerHd,
+            scrollLeft = this.scroller.dom.scrollLeft;
+        
+        innerHd.scrollLeft = scrollLeft;
+        innerHd.scrollLeft = scrollLeft; // second time for IE (1/2 time first fails, other browsers ignore)
+    },
+    
+    /**
+     * @private
+     * Ensures the given column has the given icon class
+     */
+    updateSortIcon : function(col, dir) {
+        var sortClasses = this.sortClasses,
+            sortClass   = sortClasses[dir == "DESC" ? 1 : 0],
+            headers     = this.mainHd.select('td').removeClass(sortClasses);
+        
+        headers.item(col).addClass(sortClass);
+    },
+
+    /**
+     * @private
+     * Updates the size of every column and cell in the grid
+     */
+    updateAllColumnWidths : function() {
+        var totalWidth = this.getTotalWidth(),
+            colCount   = this.cm.getColumnCount(),
+            rows       = this.getRows(),
+            rowCount   = rows.length,
+            widths     = [],
+            row, rowFirstChild, trow, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            widths[i] = this.getColumnWidth(i);
+            this.getHeaderCell(i).style.width = widths[i];
+        }
+        
+        this.updateHeaderWidth();
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                trow = rowFirstChild.rows[0];
+                
+                for (j = 0; j < colCount; j++) {
+                    trow.childNodes[j].style.width = widths[j];
+                }
+            }
+        }
+        
+        this.onAllColumnWidthsUpdated(widths, totalWidth);
+    },
+
+    /**
+     * @private
+     * Called after a column's width has been updated, this resizes all of the cells for that column in each row
+     * @param {Number} column The column index
+     */
+    updateColumnWidth : function(column, width) {
+        var columnWidth = this.getColumnWidth(column),
+            totalWidth  = this.getTotalWidth(),
+            headerCell  = this.getHeaderCell(column),
+            nodes       = this.getRows(),
+            nodeCount   = nodes.length,
+            row, i, firstChild;
+        
+        this.updateHeaderWidth();
+        headerCell.style.width = columnWidth;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            firstChild = row.firstChild;
+            
+            row.style.width = totalWidth;
+            if (firstChild) {
+                firstChild.style.width = totalWidth;
+                firstChild.rows[0].childNodes[column].style.width = columnWidth;
+            }
+        }
+        
+        this.onColumnWidthUpdated(column, columnWidth, totalWidth);
+    },
+    
+    /**
+     * @private
+     * Sets the hidden status of a given column.
+     * @param {Number} col The column index
+     * @param {Boolean} hidden True to make the column hidden
+     */
+    updateColumnHidden : function(col, hidden) {
+        var totalWidth = this.getTotalWidth(),
+            display    = hidden ? 'none' : '',
+            headerCell = this.getHeaderCell(col),
+            nodes      = this.getRows(),
+            nodeCount  = nodes.length,
+            row, rowFirstChild, i;
+        
+        this.updateHeaderWidth();
+        headerCell.style.display = display;
+        
+        for (i = 0; i < nodeCount; i++) {
+            row = nodes[i];
+            row.style.width = totalWidth;
+            rowFirstChild = row.firstChild;
+            
+            if (rowFirstChild) {
+                rowFirstChild.style.width = totalWidth;
+                rowFirstChild.rows[0].childNodes[col].style.display = display;
+            }
+        }
+        
+        this.onColumnHiddenUpdated(col, hidden, totalWidth);
+        delete this.lastViewWidth; //recalc
+        this.layout();
+    },
+
+    /**
+     * @private
+     * Renders all of the rows to a string buffer and returns the string. This is called internally
+     * by renderRows and performs the actual string building for the rows - it does not inject HTML into the DOM.
+     * @param {Array} columns The column data acquired from getColumnData.
+     * @param {Array} records The array of records to render
+     * @param {Ext.data.Store} store The store to render the rows from
+     * @param {Number} startRow The index of the first row being rendered. Sometimes we only render a subset of
+     * the rows so this is used to maintain logic for striping etc
+     * @param {Number} colCount The total number of columns in the column model
+     * @param {Boolean} stripe True to stripe the rows
+     * @return {String} A string containing the HTML for the rendered rows
+     */
+    doRender : function(columns, records, store, startRow, colCount, stripe) {
+        var templates = this.templates,
+            cellTemplate = templates.cell,
+            rowTemplate = templates.row,
+            last = colCount - 1,
+            tstyle = 'width:' + this.getTotalWidth() + ';',
+            // buffers
+            rowBuffer = [],
+            colBuffer = [],
+            rowParams = {tstyle: tstyle},
+            meta = {},
+            len  = records.length,
+            alt,
+            column,
+            record, i, j, rowIndex;
+
+        //build up each row's HTML
+        for (j = 0; j < len; j++) {
+            record    = records[j];
+            colBuffer = [];
+
+            rowIndex = j + startRow;
+
+            //build up each column's HTML
+            for (i = 0; i < colCount; i++) {
+                column = columns[i];
+                
+                meta.id    = column.id;
+                meta.css   = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.style = column.style;
+                meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+
+                if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                    meta.css += ' x-grid3-dirty-cell';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+
+            alt = [];
+            //set up row striping and row dirtiness CSS classes
+            if (stripe && ((rowIndex + 1) % 2 === 0)) {
+                alt[0] = 'x-grid3-row-alt';
+            }
+
+            if (record.dirty) {
+                alt[1] = ' x-grid3-dirty-row';
+            }
+
+            rowParams.cols = colCount;
+
+            if (this.getRowClass) {
+                alt[2] = this.getRowClass(record, rowIndex, rowParams, store);
+            }
+
+            rowParams.alt   = alt.join(' ');
+            rowParams.cells = colBuffer.join('');
+
+            rowBuffer[rowBuffer.length] = rowTemplate.apply(rowParams);
+        }
+
+        return rowBuffer.join('');
+    },
+
+    /**
+     * @private
+     * Adds CSS classes and rowIndex to each row
+     * @param {Number} startRow The row to start from (defaults to 0)
+     */
+    processRows : function(startRow, skipStripe) {
+        if (!this.ds || this.ds.getCount() < 1) {
+            return;
+        }
+
+        var rows   = this.getRows(),
+            length = rows.length,
+            row, i;
+
+        skipStripe = skipStripe || !this.grid.stripeRows;
+        startRow   = startRow   || 0;
+
+        for (i = 0; i < length; i++) {
+            row = rows[i];
+            if (row) {
+                row.rowIndex = i;
+                if (!skipStripe) {
+                    row.className = row.className.replace(this.rowClsRe, ' ');
+                    if ((i + 1) % 2 === 0){
+                        row.className += ' x-grid3-row-alt';
+                    }
+                }
+            }
+        }
+
+        // add first/last-row classes
+        if (startRow === 0) {
+            Ext.fly(rows[0]).addClass(this.firstRowCls);
+        }
+
+        Ext.fly(rows[length - 1]).addClass(this.lastRowCls);
+    },
+    
+    /**
+     * @private
+     */
+    afterRender : function() {
+        if (!this.ds || !this.cm) {
+            return;
+        }
+        
+        this.mainBody.dom.innerHTML = this.renderBody() || '&#160;';
+        this.processRows(0, true);
+
+        if (this.deferEmptyText !== true) {
+            this.applyEmptyText();
+        }
+        
+        this.grid.fireEvent('viewready', this.grid);
+    },
+    
+    /**
+     * @private
+     * This is always intended to be called after renderUI. Sets up listeners on the UI elements
+     * and sets up options like column menus, moving and resizing.
+     */
+    afterRenderUI: function() {
+        var grid = this.grid;
+        
+        this.initElements();
+
+        // get mousedowns early
+        Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
+
+        this.mainHd.on({
+            scope    : this,
+            mouseover: this.handleHdOver,
+            mouseout : this.handleHdOut,
+            mousemove: this.handleHdMove
+        });
+
+        this.scroller.on('scroll', this.syncScroll,  this);
+        
+        if (grid.enableColumnResize !== false) {
+            this.splitZone = new Ext.grid.GridView.SplitDragZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableColumnMove) {
+            this.columnDrag = new Ext.grid.GridView.ColumnDragZone(grid, this.innerHd);
+            this.columnDrop = new Ext.grid.HeaderDropZone(grid, this.mainHd.dom);
+        }
+
+        if (grid.enableHdMenu !== false) {
+            this.hmenu = new Ext.menu.Menu({id: grid.id + '-hctx'});
+            this.hmenu.add(
+                {itemId:'asc',  text: this.sortAscText,  cls: 'xg-hmenu-sort-asc'},
+                {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
+            );
+
+            if (grid.enableColumnHide !== false) {
+                this.colMenu = new Ext.menu.Menu({id:grid.id + '-hcols-menu'});
+                this.colMenu.on({
+                    scope     : this,
+                    beforeshow: this.beforeColMenuShow,
+                    itemclick : this.handleHdMenuClick
+                });
+                this.hmenu.add('-', {
+                    itemId:'columns',
+                    hideOnClick: false,
+                    text: this.columnsText,
+                    menu: this.colMenu,
+                    iconCls: 'x-cols-icon'
+                });
+            }
+
+            this.hmenu.on('itemclick', this.handleHdMenuClick, this);
+        }
+
+        if (grid.trackMouseOver) {
+            this.mainBody.on({
+                scope    : this,
+                mouseover: this.onRowOver,
+                mouseout : this.onRowOut
+            });
+        }
+
+        if (grid.enableDragDrop || grid.enableDrag) {
+            this.dragZone = new Ext.grid.GridDragZone(grid, {
+                ddGroup : grid.ddGroup || 'GridDD'
+            });
+        }
+
+        this.updateHeaderSortState();
+    },
+
+    /**
+     * @private
+     * Renders each of the UI elements in turn. This is called internally, once, by this.render. It does not
+     * render rows from the store, just the surrounding UI elements.
+     */
+    renderUI : function() {
+        var templates = this.templates;
+
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            header: this.renderHeaders(),
+            ostyle: 'width:' + this.getOffsetWidth() + ';',
+            bstyle: 'width:' + this.getTotalWidth()  + ';'
+        });
+    },
+
+    // private
+    processEvent : function(name, e) {
+        var target = e.getTarget(),
+            grid   = this.grid,
+            header = this.findHeaderIndex(target),
+            row, cell, col, body;
+
+        grid.fireEvent(name, e);
+
+        if (header !== false) {
+            grid.fireEvent('header' + name, grid, header, e);
+        } else {
+            row = this.findRowIndex(target);
+
+//          Grid's value-added events must bubble correctly to allow cancelling via returning false: cell->column->row
+//          We must allow a return of false at any of these levels to cancel the event processing.
+//          Particularly allowing rowmousedown to be cancellable by prior handlers which need to prevent selection.
+            if (row !== false) {
+                cell = this.findCellIndex(target);
+                if (cell !== false) {
+                    col = grid.colModel.getColumnAt(cell);
+                    if (grid.fireEvent('cell' + name, grid, row, cell, e) !== false) {
+                        if (!col || (col.processEvent && (col.processEvent(name, e, grid, row, cell) !== false))) {
+                            grid.fireEvent('row' + name, grid, row, e);
+                        }
+                    }
+                } else {
+                    if (grid.fireEvent('row' + name, grid, row, e) !== false) {
+                        (body = this.findRowBody(target)) && grid.fireEvent('rowbody' + name, grid, row, e);
+                    }
+                }
+            } else {
+                grid.fireEvent('container' + name, grid, e);
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Sizes the grid's header and body elements
+     */
+    layout : function(initial) {
+        if (!this.mainBody) {
+            return; // not rendered
+        }
+
+        var grid       = this.grid,
+            gridEl     = grid.getGridEl(),
+            gridSize   = gridEl.getSize(true),
+            gridWidth  = gridSize.width,
+            gridHeight = gridSize.height,
+            scroller   = this.scroller,
+            scrollStyle, headerHeight, scrollHeight;
+        
+        if (gridWidth < 20 || gridHeight < 20) {
+            return;
+        }
+        
+        if (grid.autoHeight) {
+            scrollStyle = scroller.dom.style;
+            scrollStyle.overflow = 'visible';
+            
+            if (Ext.isWebKit) {
+                scrollStyle.position = 'static';
+            }
+        } else {
+            this.el.setSize(gridWidth, gridHeight);
+            
+            headerHeight = this.mainHd.getHeight();
+            scrollHeight = gridHeight - headerHeight;
+            
+            scroller.setSize(gridWidth, scrollHeight);
+            
+            if (this.innerHd) {
+                this.innerHd.style.width = (gridWidth) + "px";
+            }
+        }
+        
+        if (this.forceFit || (initial === true && this.autoFill)) {
+            if (this.lastViewWidth != gridWidth) {
+                this.fitColumns(false, false);
+                this.lastViewWidth = gridWidth;
+            }
+        } else {
+            this.autoExpand();
+            this.syncHeaderScroll();
+        }
+        
+        this.onLayout(gridWidth, scrollHeight);
+    },
+
+    // template functions for subclasses and plugins
+    // these functions include precalculated values
+    onLayout : function(vw, vh) {
+        // do nothing
+    },
+
+    onColumnWidthUpdated : function(col, w, tw) {
+        //template method
+    },
+
+    onAllColumnWidthsUpdated : function(ws, tw) {
+        //template method
+    },
+
+    onColumnHiddenUpdated : function(col, hidden, tw) {
+        // template method
+    },
+
+    updateColumnText : function(col, text) {
+        // template method
+    },
+
+    afterMove : function(colIndex) {
+        // template method
+    },
+
+    /* ----------------------------------- Core Specific -------------------------------------------*/
+    // private
+    init : function(grid) {
+        this.grid = grid;
+
+        this.initTemplates();
+        this.initData(grid.store, grid.colModel);
+        this.initUI(grid);
+    },
+
+    // private
+    getColumnId : function(index){
+        return this.cm.getColumnId(index);
+    },
+
+    // private
+    getOffsetWidth : function() {
+        return (this.cm.getTotalWidth() + this.getScrollOffset()) + 'px';
+    },
+
+    // private
+    getScrollOffset: function() {
+        return Ext.num(this.scrollOffset, Ext.getScrollBarWidth());
+    },
+
+    /**
+     * @private
+     * Renders the header row using the 'header' template. Does not inject the HTML into the DOM, just
+     * returns a string.
+     * @return {String} Rendered header row
+     */
+    renderHeaders : function() {
+        var colModel   = this.cm,
+            templates  = this.templates,
+            headerTpl  = templates.hcell,
+            properties = {},
+            colCount   = colModel.getColumnCount(),
+            last       = colCount - 1,
+            cells      = [],
+            i, cssCls;
+        
+        for (i = 0; i < colCount; i++) {
+            if (i == 0) {
+                cssCls = 'x-grid3-cell-first ';
+            } else {
+                cssCls = i == last ? 'x-grid3-cell-last ' : '';
+            }
+            
+            properties = {
+                id     : colModel.getColumnId(i),
+                value  : colModel.getColumnHeader(i) || '',
+                style  : this.getColumnStyle(i, true),
+                css    : cssCls,
+                tooltip: this.getColumnTooltip(i)
+            };
+            
+            if (colModel.config[i].align == 'right') {
+                properties.istyle = 'padding-right: 16px;';
+            } else {
+                delete properties.istyle;
+            }
+            
+            cells[i] = headerTpl.apply(properties);
+        }
+        
+        return templates.header.apply({
+            cells : cells.join(""),
+            tstyle: String.format("width: {0};", this.getTotalWidth())
+        });
+    },
+
+    /**
+     * @private
+     */
+    getColumnTooltip : function(i) {
+        var tooltip = this.cm.getColumnTooltip(i);
+        if (tooltip) {
+            if (Ext.QuickTips.isEnabled()) {
+                return 'ext:qtip="' + tooltip + '"';
+            } else {
+                return 'title="' + tooltip + '"';
+            }
+        }
+        
+        return '';
+    },
+
+    // private
+    beforeUpdate : function() {
+        this.grid.stopEditing(true);
+    },
+
+    /**
+     * @private
+     * Re-renders the headers and ensures they are sized correctly
+     */
+    updateHeaders : function() {
+        this.innerHd.firstChild.innerHTML = this.renderHeaders();
+        
+        this.updateHeaderWidth(false);
+    },
+    
+    /**
+     * @private
+     * Ensures that the header is sized to the total width available to it
+     * @param {Boolean} updateMain True to update the mainBody's width also (defaults to true)
+     */
+    updateHeaderWidth: function(updateMain) {
+        var innerHdChild = this.innerHd.firstChild,
+            totalWidth   = this.getTotalWidth();
+        
+        innerHdChild.style.width = this.getOffsetWidth();
+        innerHdChild.firstChild.style.width = totalWidth;
+        
+        if (updateMain !== false) {
+            this.mainBody.dom.style.width = totalWidth;
+        }
+    },
+
+    /**
+     * Focuses the specified row.
+     * @param {Number} row The row index
+     */
+    focusRow : function(row) {
+        this.focusCell(row, 0, false);
+    },
+
+    /**
+     * Focuses the specified cell.
+     * @param {Number} row The row index
+     * @param {Number} col The column index
+     */
+    focusCell : function(row, col, hscroll) {
+        this.syncFocusEl(this.ensureVisible(row, col, hscroll));
+        
+        var focusEl = this.focusEl;
+        
+        if (Ext.isGecko) {
+            focusEl.focus();
+        } else {
+            focusEl.focus.defer(1, focusEl);
+        }
+    },
+
+    /**
+     * @private
+     * Finds the Elements corresponding to the given row and column indexes
+     */
+    resolveCell : function(row, col, hscroll) {
+        if (!Ext.isNumber(row)) {
+            row = row.rowIndex;
+        }
+        
+        if (!this.ds) {
+            return null;
+        }
+        
+        if (row < 0 || row >= this.ds.getCount()) {
+            return null;
+        }
+        col = (col !== undefined ? col : 0);
+
+        var rowEl    = this.getRow(row),
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            cellEl;
+            
+        if (!(hscroll === false && col === 0)) {
+            while (col < colCount && colModel.isHidden(col)) {
+                col++;
+            }
+            
+            cellEl = this.getCell(row, col);
+        }
+
+        return {row: rowEl, cell: cellEl};
+    },
+
+    /**
+     * @private
+     * Returns the XY co-ordinates of a given row/cell resolution (see {@link #resolveCell})
+     * @return {Array} X and Y coords
+     */
+    getResolvedXY : function(resolved) {
+        if (!resolved) {
+            return null;
+        }
+        
+        var cell = resolved.cell,
+            row  = resolved.row;
+        
+        if (cell) {
+            return Ext.fly(cell).getXY();
+        } else {
+            return [this.el.getX(), Ext.fly(row).getY()];
+        }
+    },
+
+    /**
+     * @private
+     * Moves the focus element to the x and y co-ordinates of the given row and column
+     */
+    syncFocusEl : function(row, col, hscroll) {
+        var xy = row;
+        
+        if (!Ext.isArray(xy)) {
+            row = Math.min(row, Math.max(0, this.getRows().length-1));
+            
+            if (isNaN(row)) {
+                return;
+            }
+            
+            xy = this.getResolvedXY(this.resolveCell(row, col, hscroll));
+        }
+        
+        this.focusEl.setXY(xy || this.scroller.getXY());
+    },
+
+    /**
+     * @private
+     */
+    ensureVisible : function(row, col, hscroll) {
+        var resolved = this.resolveCell(row, col, hscroll);
+        
+        if (!resolved || !resolved.row) {
+            return null;
+        }
+
+        var rowEl  = resolved.row,
+            cellEl = resolved.cell,
+            c = this.scroller.dom,
+            p = rowEl,
+            ctop = 0,
+            stop = this.el.dom;
+
+        while (p && p != stop) {
+            ctop += p.offsetTop;
+            p = p.offsetParent;
+        }
+
+        ctop -= this.mainHd.dom.offsetHeight;
+        stop = parseInt(c.scrollTop, 10);
+
+        var cbot = ctop + rowEl.offsetHeight,
+            ch = c.clientHeight,
+            sbot = stop + ch;
+
+
+        if (ctop < stop) {
+          c.scrollTop = ctop;
+        } else if(cbot > sbot) {
+            c.scrollTop = cbot-ch;
+        }
+
+        if (hscroll !== false) {
+            var cleft  = parseInt(cellEl.offsetLeft, 10),
+                cright = cleft + cellEl.offsetWidth,
+                sleft  = parseInt(c.scrollLeft, 10),
+                sright = sleft + c.clientWidth;
+                
+            if (cleft < sleft) {
+                c.scrollLeft = cleft;
+            } else if(cright > sright) {
+                c.scrollLeft = cright-c.clientWidth;
+            }
+        }
+        
+        return this.getResolvedXY(resolved);
+    },
+
+    // private
+    insertRows : function(dm, firstRow, lastRow, isUpdate) {
+        var last = dm.getCount() - 1;
+        if( !isUpdate && firstRow === 0 && lastRow >= last) {
+            this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+                this.refresh();
+            this.fireEvent('rowsinserted', this, firstRow, lastRow);
+        } else {
+            if (!isUpdate) {
+                this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
+            }
+            var html = this.renderRows(firstRow, lastRow),
+                before = this.getRow(firstRow);
+            if (before) {
+                if(firstRow === 0){
+                    Ext.fly(this.getRow(0)).removeClass(this.firstRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeBegin', before, html);
+            } else {
+                var r = this.getRow(last - 1);
+                if(r){
+                    Ext.fly(r).removeClass(this.lastRowCls);
+                }
+                Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html);
+            }
+            if (!isUpdate) {
+                this.processRows(firstRow);
+                this.fireEvent('rowsinserted', this, firstRow, lastRow);
+            } else if (firstRow === 0 || firstRow >= last) {
+                //ensure first/last row is kept after an update.
+                Ext.fly(this.getRow(firstRow)).addClass(firstRow === 0 ? this.firstRowCls : this.lastRowCls);
+            }
+        }
+        this.syncFocusEl(firstRow);
+    },
+
+    /**
+     * @private
+     * DEPRECATED - this doesn't appear to be called anywhere in the library, remove in 4.0. 
+     */
+    deleteRows : function(dm, firstRow, lastRow) {
+        if (dm.getRowCount() < 1) {
+            this.refresh();
+        } else {
+            this.fireEvent('beforerowsdeleted', this, firstRow, lastRow);
+
+            this.removeRows(firstRow, lastRow);
+
+            this.processRows(firstRow);
+            this.fireEvent('rowsdeleted', this, firstRow, lastRow);
+        }
+    },
+
+    /**
+     * @private
+     * Builds a CSS string for the given column index
+     * @param {Number} colIndex The column index
+     * @param {Boolean} isHeader True if getting the style for the column's header
+     * @return {String} The CSS string
+     */
+    getColumnStyle : function(colIndex, isHeader) {
+        var colModel  = this.cm,
+            colConfig = colModel.config,
+            style     = isHeader ? '' : colConfig[colIndex].css || '',
+            align     = colConfig[colIndex].align;
+        
+        style += String.format("width: {0};", this.getColumnWidth(colIndex));
+        
+        if (colModel.isHidden(colIndex)) {
+            style += 'display: none; ';
+        }
+        
+        if (align) {
+            style += String.format("text-align: {0};", align);
+        }
+        
+        return style;
+    },
+
+    /**
+     * @private
+     * Returns the width of a given column minus its border width
+     * @return {Number} The column index
+     * @return {String|Number} The width in pixels
+     */
+    getColumnWidth : function(column) {
+        var columnWidth = this.cm.getColumnWidth(column),
+            borderWidth = this.borderWidth;
+        
+        if (Ext.isNumber(columnWidth)) {
+            if (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2)) {
+                return columnWidth + "px";
+            } else {
+                return Math.max(columnWidth - borderWidth, 0) + "px";
+            }
+        } else {
+            return columnWidth;
+        }
+    },
+
+    /**
+     * @private
+     * Returns the total width of all visible columns
+     * @return {String} 
+     */
+    getTotalWidth : function() {
+        return this.cm.getTotalWidth() + 'px';
+    },
+
+    /**
+     * @private
+     * Resizes each column to fit the available grid width.
+     * TODO: The second argument isn't even used, remove it in 4.0
+     * @param {Boolean} preventRefresh True to prevent resizing of each row to the new column sizes (defaults to false)
+     * @param {null} onlyExpand NOT USED, will be removed in 4.0
+     * @param {Number} omitColumn The index of a column to leave at its current width. Defaults to undefined
+     * @return {Boolean} True if the operation succeeded, false if not or undefined if the grid view is not yet initialized
+     */
+    fitColumns : function(preventRefresh, onlyExpand, omitColumn) {
+        var grid          = this.grid,
+            colModel      = this.cm,
+            totalColWidth = colModel.getTotalWidth(false),
+            gridWidth     = this.getGridInnerWidth(),
+            extraWidth    = gridWidth - totalColWidth,
+            columns       = [],
+            extraCol      = 0,
+            width         = 0,
+            colWidth, fraction, i;
+        
+        // not initialized, so don't screw up the default widths
+        if (gridWidth < 20 || extraWidth === 0) {
+            return false;
+        }
+        
+        var visibleColCount = colModel.getColumnCount(true),
+            totalColCount   = colModel.getColumnCount(false),
+            adjCount        = visibleColCount - (Ext.isNumber(omitColumn) ? 1 : 0);
+        
+        if (adjCount === 0) {
+            adjCount = 1;
+            omitColumn = undefined;
+        }
+        
+        //FIXME: the algorithm used here is odd and potentially confusing. Includes this for loop and the while after it.
+        for (i = 0; i < totalColCount; i++) {
+            if (!colModel.isFixed(i) && i !== omitColumn) {
+                colWidth = colModel.getColumnWidth(i);
+                columns.push(i, colWidth);
+                
+                if (!colModel.isHidden(i)) {
+                    extraCol = i;
+                    width += colWidth;
+                }
+            }
+        }
+        
+        fraction = (gridWidth - colModel.getTotalWidth()) / width;
+        
+        while (columns.length) {
+            colWidth = columns.pop();
+            i        = columns.pop();
+            
+            colModel.setColumnWidth(i, Math.max(grid.minColumnWidth, Math.floor(colWidth + colWidth * fraction)), true);
+        }
+        
+        //this has been changed above so remeasure now
+        totalColWidth = colModel.getTotalWidth(false);
+        
+        if (totalColWidth > gridWidth) {
+            var adjustCol = (adjCount == visibleColCount) ? extraCol : omitColumn,
+                newWidth  = Math.max(1, colModel.getColumnWidth(adjustCol) - (totalColWidth - gridWidth));
+            
+            colModel.setColumnWidth(adjustCol, newWidth, true);
+        }
+        
+        if (preventRefresh !== true) {
+            this.updateAllColumnWidths();
+        }
+        
+        return true;
+    },
+
+    /**
+     * @private
+     * Resizes the configured autoExpandColumn to take the available width after the other columns have 
+     * been accounted for
+     * @param {Boolean} preventUpdate True to prevent the resizing of all rows (defaults to false)
+     */
+    autoExpand : function(preventUpdate) {
+        var grid             = this.grid,
+            colModel         = this.cm,
+            gridWidth        = this.getGridInnerWidth(),
+            totalColumnWidth = colModel.getTotalWidth(false),
+            autoExpandColumn = grid.autoExpandColumn;
+        
+        if (!this.userResized && autoExpandColumn) {
+            if (gridWidth != totalColumnWidth) {
+                //if we are not already using all available width, resize the autoExpandColumn
+                var colIndex     = colModel.getIndexById(autoExpandColumn),
+                    currentWidth = colModel.getColumnWidth(colIndex),
+                    desiredWidth = gridWidth - totalColumnWidth + currentWidth,
+                    newWidth     = Math.min(Math.max(desiredWidth, grid.autoExpandMin), grid.autoExpandMax);
+                
+                if (currentWidth != newWidth) {
+                    colModel.setColumnWidth(colIndex, newWidth, true);
+                    
+                    if (preventUpdate !== true) {
+                        this.updateColumnWidth(colIndex, newWidth);
+                    }
+                }
+            }
+        }
+    },
+    
+    /**
+     * Returns the total internal width available to the grid, taking the scrollbar into account
+     * @return {Number} The total width
+     */
+    getGridInnerWidth: function() {
+        return this.grid.getGridEl().getWidth(true) - this.getScrollOffset();
+    },
+
+    /**
+     * @private
+     * Returns an array of column configurations - one for each column
+     * @return {Array} Array of column config objects. This includes the column name, renderer, id style and renderer
+     */
+    getColumnData : function() {
+        var columns  = [],
+            colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            fields   = this.ds.fields,
+            i, name;
+        
+        for (i = 0; i < colCount; i++) {
+            name = colModel.getDataIndex(i);
+            
+            columns[i] = {
+                name    : Ext.isDefined(name) ? name : (fields.get(i) ? fields.get(i).name : undefined),
+                renderer: colModel.getRenderer(i),
+                scope   : colModel.getRendererScope(i),
+                id      : colModel.getColumnId(i),
+                style   : this.getColumnStyle(i)
+            };
+        }
+        
+        return columns;
+    },
+
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid     = this.grid,
+            store    = grid.store,
+            stripe   = grid.stripeRows,
+            colModel = grid.colModel,
+            colCount = colModel.getColumnCount(),
+            rowCount = store.getCount(),
+            records;
+        
+        if (rowCount < 1) {
+            return '';
+        }
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        records  = store.getRange(startRow, endRow);
+        
+        return this.doRender(this.getColumnData(), records, store, startRow, colCount, stripe);
+    },
+
+    // private
+    renderBody : function(){
+        var markup = this.renderRows() || '&#160;';
+        return this.templates.body.apply({rows: markup});
+    },
+
+    /**
+     * @private
+     * Refreshes a row by re-rendering it. Fires the rowupdated event when done
+     */
+    refreshRow: function(record) {
+        var store     = this.ds,
+            colCount  = this.cm.getColumnCount(),
+            columns   = this.getColumnData(),
+            last      = colCount - 1,
+            cls       = ['x-grid3-row'],
+            rowParams = {
+                tstyle: String.format("width: {0};", this.getTotalWidth())
+            },
+            colBuffer = [],
+            cellTpl   = this.templates.cell,
+            rowIndex, row, column, meta, css, i;
+        
+        if (Ext.isNumber(record)) {
+            rowIndex = record;
+            record   = store.getAt(rowIndex);
+        } else {
+            rowIndex = store.indexOf(record);
+        }
+        
+        //the record could not be found
+        if (!record || rowIndex < 0) {
+            return;
+        }
+        
+        //builds each column in this row
+        for (i = 0; i < colCount; i++) {
+            column = columns[i];
+            
+            if (i == 0) {
+                css = 'x-grid3-cell-first';
+            } else {
+                css = (i == last) ? 'x-grid3-cell-last ' : '';
+            }
+            
+            meta = {
+                id      : column.id,
+                style   : column.style,
+                css     : css,
+                attr    : "",
+                cellAttr: ""
+            };
+            // Need to set this after, because we pass meta to the renderer
+            meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);
+            
+            if (Ext.isEmpty(meta.value)) {
+                meta.value = '&#160;';
+            }
+            
+            if (this.markDirty && record.dirty && typeof record.modified[column.name] != 'undefined') {
+                meta.css += ' x-grid3-dirty-cell';
+            }
+            
+            colBuffer[i] = cellTpl.apply(meta);
+        }
+        
+        row = this.getRow(rowIndex);
+        row.className = '';
+        
+        if (this.grid.stripeRows && ((rowIndex + 1) % 2 === 0)) {
+            cls.push('x-grid3-row-alt');
+        }
+        
+        if (this.getRowClass) {
+            rowParams.cols = colCount;
+            cls.push(this.getRowClass(record, rowIndex, rowParams, store));
+        }
+        
+        this.fly(row).addClass(cls).setStyle(rowParams.tstyle);
+        rowParams.cells = colBuffer.join("");
+        row.innerHTML = this.templates.rowInner.apply(rowParams);
+        
+        this.fireEvent('rowupdated', this, rowIndex, record);
+    },
+
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getTotalWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+
+    /**
+     * @private
+     * Displays the configured emptyText if there are currently no rows to display
+     */
+    applyEmptyText : function() {
+        if (this.emptyText && !this.hasRows()) {
+            this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
+        }
+    },
+
+    /**
+     * @private
+     * Adds sorting classes to the column headers based on the bound store's sortInfo. Fires the 'sortchange' event
+     * if the sorting has changed since this function was last run.
+     */
+    updateHeaderSortState : function() {
+        var state = this.ds.getSortState();
+        if (!state) {
+            return;
+        }
+
+        if (!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)) {
+            this.grid.fireEvent('sortchange', this.grid, state);
+        }
+
+        this.sortState = state;
+
+        var sortColumn = this.cm.findColumnIndex(state.field);
+        if (sortColumn != -1) {
+            var sortDir = state.direction;
+            this.updateSortIcon(sortColumn, sortDir);
+        }
+    },
+
+    /**
+     * @private
+     * Removes any sorting indicator classes from the column headers
+     */
+    clearHeaderSortState : function() {
+        if (!this.sortState) {
+            return;
+        }
+        this.grid.fireEvent('sortchange', this.grid, null);
+        this.mainHd.select('td').removeClass(this.sortClasses);
+        delete this.sortState;
+    },
+
+    /**
+     * @private
+     * Destroys all objects associated with the GridView
+     */
+    destroy : function() {
+        var me              = this,
+            grid            = me.grid,
+            gridEl          = grid.getGridEl(),
+            dragZone        = me.dragZone,
+            splitZone       = me.splitZone,
+            columnDrag      = me.columnDrag,
+            columnDrop      = me.columnDrop,
+            scrollToTopTask = me.scrollToTopTask,
+            columnDragData,
+            columnDragProxy;
+        
+        if (scrollToTopTask && scrollToTopTask.cancel) {
+            scrollToTopTask.cancel();
+        }
+        
+        Ext.destroyMembers(me, 'colMenu', 'hmenu');
+
+        me.initData(null, null);
+        me.purgeListeners();
+        
+        Ext.fly(me.innerHd).un("click", me.handleHdDown, me);
+
+        if (grid.enableColumnMove) {
+            columnDragData = columnDrag.dragData;
+            columnDragProxy = columnDrag.proxy;
+            Ext.destroy(
+                columnDrag.el,
+                columnDragProxy.ghost,
+                columnDragProxy.el,
+                columnDrop.el,
+                columnDrop.proxyTop,
+                columnDrop.proxyBottom,
+                columnDragData.ddel,
+                columnDragData.header
+            );
+            
+            if (columnDragProxy.anim) {
+                Ext.destroy(columnDragProxy.anim);
+            }
+            
+            delete columnDragProxy.ghost;
+            delete columnDragData.ddel;
+            delete columnDragData.header;
+            columnDrag.destroy();
+            
+            delete Ext.dd.DDM.locationCache[columnDrag.id];
+            delete columnDrag._domRef;
+
+            delete columnDrop.proxyTop;
+            delete columnDrop.proxyBottom;
+            columnDrop.destroy();
+            delete Ext.dd.DDM.locationCache["gridHeader" + gridEl.id];
+            delete columnDrop._domRef;
+            delete Ext.dd.DDM.ids[columnDrop.ddGroup];
+        }
+
+        if (splitZone) { // enableColumnResize
+            splitZone.destroy();
+            delete splitZone._domRef;
+            delete Ext.dd.DDM.ids["gridSplitters" + gridEl.id];
+        }
+
+        Ext.fly(me.innerHd).removeAllListeners();
+        Ext.removeNode(me.innerHd);
+        delete me.innerHd;
+
+        Ext.destroy(
+            me.el,
+            me.mainWrap,
+            me.mainHd,
+            me.scroller,
+            me.mainBody,
+            me.focusEl,
+            me.resizeMarker,
+            me.resizeProxy,
+            me.activeHdBtn,
+            me._flyweight,
+            dragZone,
+            splitZone
+        );
+
+        delete grid.container;
+
+        if (dragZone) {
+            dragZone.destroy();
+        }
+
+        Ext.dd.DDM.currentTarget = null;
+        delete Ext.dd.DDM.locationCache[gridEl.id];
+
+        Ext.EventManager.removeResizeListener(me.onWindowResize, me);
+    },
+
+    // private
+    onDenyColumnHide : function() {
+
+    },
+
+    // private
+    render : function() {
+        if (this.autoFill) {
+            var ct = this.grid.ownerCt;
+            
+            if (ct && ct.getLayout()) {
+                ct.on('afterlayout', function() {
+                    this.fitColumns(true, true);
+                    this.updateHeaders();
+                    this.updateHeaderSortState();
+                }, this, {single: true});
+            }
+        } else if (this.forceFit) {
+            this.fitColumns(true, false);
+        } else if (this.grid.autoExpandColumn) {
+            this.autoExpand(true);
+        }
+        
+        this.grid.getGridEl().dom.innerHTML = this.renderUI();
+        
+        this.afterRenderUI();
+    },
+
+    /* --------------------------------- Model Events and Handlers --------------------------------*/
+    
+    /**
+     * @private
+     * Binds a new Store and ColumnModel to this GridView. Removes any listeners from the old objects (if present)
+     * and adds listeners to the new ones
+     * @param {Ext.data.Store} newStore The new Store instance
+     * @param {Ext.grid.ColumnModel} newColModel The new ColumnModel instance
+     */
+    initData : function(newStore, newColModel) {
+        var me = this;
+        
+        if (me.ds) {
+            var oldStore = me.ds;
+            
+            oldStore.un('add', me.onAdd, me);
+            oldStore.un('load', me.onLoad, me);
+            oldStore.un('clear', me.onClear, me);
+            oldStore.un('remove', me.onRemove, me);
+            oldStore.un('update', me.onUpdate, me);
+            oldStore.un('datachanged', me.onDataChange, me);
+            
+            if (oldStore !== newStore && oldStore.autoDestroy) {
+                oldStore.destroy();
+            }
+        }
+        
+        if (newStore) {
+            newStore.on({
+                scope      : me,
+                load       : me.onLoad,
+                add        : me.onAdd,
+                remove     : me.onRemove,
+                update     : me.onUpdate,
+                clear      : me.onClear,
+                datachanged: me.onDataChange
+            });
+        }
+        
+        if (me.cm) {
+            var oldColModel = me.cm;
+            
+            oldColModel.un('configchange', me.onColConfigChange, me);
+            oldColModel.un('widthchange',  me.onColWidthChange, me);
+            oldColModel.un('headerchange', me.onHeaderChange, me);
+            oldColModel.un('hiddenchange', me.onHiddenChange, me);
+            oldColModel.un('columnmoved',  me.onColumnMove, me);
+        }
+        
+        if (newColModel) {
+            delete me.lastViewWidth;
+            
+            newColModel.on({
+                scope       : me,
+                configchange: me.onColConfigChange,
+                widthchange : me.onColWidthChange,
+                headerchange: me.onHeaderChange,
+                hiddenchange: me.onHiddenChange,
+                columnmoved : me.onColumnMove
+            });
+        }
+        
+        me.ds = newStore;
+        me.cm = newColModel;
+    },
+
+    // private
+    onDataChange : function(){
+        this.refresh(true);
+        this.updateHeaderSortState();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onClear : function() {
+        this.refresh();
+        this.syncFocusEl(0);
+    },
+
+    // private
+    onUpdate : function(store, record) {
+        this.refreshRow(record);
+    },
+
+    // private
+    onAdd : function(store, records, index) {
+        this.insertRows(store, index, index + (records.length-1));
+    },
+
+    // private
+    onRemove : function(store, record, index, isUpdate) {
+        if (isUpdate !== true) {
+            this.fireEvent('beforerowremoved', this, index, record);
+        }
+        
+        this.removeRow(index);
+        
+        if (isUpdate !== true) {
+            this.processRows(index);
+            this.applyEmptyText();
+            this.fireEvent('rowremoved', this, index, record);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a store is loaded, scrolls to the top row
+     */
+    onLoad : function() {
+        if (Ext.isGecko) {
+            if (!this.scrollToTopTask) {
+                this.scrollToTopTask = new Ext.util.DelayedTask(this.scrollToTop, this);
+            }
+            this.scrollToTopTask.delay(1);
+        } else {
+            this.scrollToTop();
+        }
+    },
+
+    // private
+    onColWidthChange : function(cm, col, width) {
+        this.updateColumnWidth(col, width);
+    },
+
+    // private
+    onHeaderChange : function(cm, col, text) {
+        this.updateHeaders();
+    },
+
+    // private
+    onHiddenChange : function(cm, col, hidden) {
+        this.updateColumnHidden(col, hidden);
+    },
+
+    // private
+    onColumnMove : function(cm, oldIndex, newIndex) {
+        this.indexMap = null;
+        this.refresh(true);
+        this.restoreScroll(this.getScrollState());
+        
+        this.afterMove(newIndex);
+        this.grid.fireEvent('columnmove', oldIndex, newIndex);
+    },
+
+    // private
+    onColConfigChange : function() {
+        delete this.lastViewWidth;
+        this.indexMap = null;
+        this.refresh(true);
+    },
+
+    /* -------------------- UI Events and Handlers ------------------------------ */
+    // private
+    initUI : function(grid) {
+        grid.on('headerclick', this.onHeaderClick, this);
+    },
+
+    // private
+    initEvents : Ext.emptyFn,
+
+    // private
+    onHeaderClick : function(g, index) {
+        if (this.headersDisabled || !this.cm.isSortable(index)) {
+            return;
+        }
+        g.stopEditing(true);
+        g.store.sort(this.cm.getDataIndex(index));
+    },
+
+    /**
+     * @private
+     * Adds the hover class to a row when hovered over
+     */
+    onRowOver : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false) {
+            this.addRowClass(row, this.rowOverCls);
+        }
+    },
+
+    /**
+     * @private
+     * Removes the hover class from a row on mouseout
+     */
+    onRowOut : function(e, target) {
+        var row = this.findRowIndex(target);
+        
+        if (row !== false && !e.within(this.getRow(row), true)) {
+            this.removeRowClass(row, this.rowOverCls);
+        }
+    },
+
+    // private
+    onRowSelect : function(row) {
+        this.addRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onRowDeselect : function(row) {
+        this.removeRowClass(row, this.selectedRowClass);
+    },
+
+    // private
+    onCellSelect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).addClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    onCellDeselect : function(row, col) {
+        var cell = this.getCell(row, col);
+        if (cell) {
+            this.fly(cell).removeClass('x-grid3-cell-selected');
+        }
+    },
+
+    // private
+    handleWheel : function(e) {
+        e.stopPropagation();
+    },
+
+    /**
+     * @private
+     * Called by the SplitDragZone when a drag has been completed. Resizes the columns
+     */
+    onColumnSplitterMoved : function(cellIndex, width) {
+        this.userResized = true;
+        this.grid.colModel.setColumnWidth(cellIndex, width, true);
+
+        if (this.forceFit) {
+            this.fitColumns(true, false, cellIndex);
+            this.updateAllColumnWidths();
+        } else {
+            this.updateColumnWidth(cellIndex, width);
+            this.syncHeaderScroll();
+        }
+
+        this.grid.fireEvent('columnresize', cellIndex, width);
+    },
+
+    /**
+     * @private
+     * Click handler for the shared column dropdown menu, called on beforeshow. Builds the menu
+     * which displays the list of columns for the user to show or hide.
+     */
+    beforeColMenuShow : function() {
+        var colModel = this.cm,
+            colCount = colModel.getColumnCount(),
+            colMenu  = this.colMenu,
+            i;
+
+        colMenu.removeAll();
+
+        for (i = 0; i < colCount; i++) {
+            if (colModel.config[i].hideable !== false) {
+                colMenu.add(new Ext.menu.CheckItem({
+                    text       : colModel.getColumnHeader(i),
+                    itemId     : 'col-' + colModel.getColumnId(i),
+                    checked    : !colModel.isHidden(i),
+                    disabled   : colModel.config[i].hideable === false,
+                    hideOnClick: false
+                }));
+            }
+        }
+    },
+    
+    /**
+     * @private
+     * Attached as the 'itemclick' handler to the header menu and the column show/hide submenu (if available).
+     * Performs sorting if the sorter buttons were clicked, otherwise hides/shows the column that was clicked.
+     */
+    handleHdMenuClick : function(item) {
+        var store     = this.ds,
+            dataIndex = this.cm.getDataIndex(this.hdCtxIndex);
+
+        switch (item.getItemId()) {
+            case 'asc':
+                store.sort(dataIndex, 'ASC');
+                break;
+            case 'desc':
+                store.sort(dataIndex, 'DESC');
+                break;
+            default:
+                this.handleHdMenuClickDefault(item);
+        }
+        return true;
+    },
+    
+    /**
+     * Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides
+     * the column hide/show functionality based on the check state of the menu item. A different implementation can be provided
+     * if needed.
+     * @param {Ext.menu.BaseItem} item The menu item that was clicked
+     */
+    handleHdMenuClickDefault: function(item) {
+        var colModel = this.cm,
+            itemId   = item.getItemId(),
+            index    = colModel.getIndexById(itemId.substr(4));
+
+        if (index != -1) {
+            if (item.checked && colModel.getColumnsBy(this.isHideableColumn, this).length <= 1) {
+                this.onDenyColumnHide();
+                return;
+            }
+            colModel.setHidden(index, item.checked);
+        }
+    },
+
+    /**
+     * @private
+     * Called when a header cell is clicked - shows the menu if the click happened over a trigger button
+     */
+    handleHdDown : function(e, target) {
+        if (Ext.fly(target).hasClass('x-grid3-hd-btn')) {
+            e.stopEvent();
+            
+            var colModel  = this.cm,
+                header    = this.findHeaderCell(target),
+                index     = this.getCellIndex(header),
+                sortable  = colModel.isSortable(index),
+                menu      = this.hmenu,
+                menuItems = menu.items,
+                menuCls   = this.headerMenuOpenCls;
+            
+            this.hdCtxIndex = index;
+            
+            Ext.fly(header).addClass(menuCls);
+            menuItems.get('asc').setDisabled(!sortable);
+            menuItems.get('desc').setDisabled(!sortable);
+            
+            menu.on('hide', function() {
+                Ext.fly(header).removeClass(menuCls);
+            }, this, {single:true});
+            
+            menu.show(target, 'tl-bl?');
+        }
+    },
+
+    /**
+     * @private
+     * Attached to the headers' mousemove event. This figures out the CSS cursor to use based on where the mouse is currently
+     * pointed. If the mouse is currently hovered over the extreme left or extreme right of any header cell and the cell next 
+     * to it is resizable it is given the resize cursor, otherwise the cursor is set to an empty string.
+     */
+    handleHdMove : function(e) {
+        var header = this.findHeaderCell(this.activeHdRef);
+        
+        if (header && !this.headersDisabled) {
+            var handleWidth  = this.splitHandleWidth || 5,
+                activeRegion = this.activeHdRegion,
+                headerStyle  = header.style,
+                colModel     = this.cm,
+                cursor       = '',
+                pageX        = e.getPageX();
+                
+            if (this.grid.enableColumnResize !== false) {
+                var activeHeaderIndex = this.activeHdIndex,
+                    previousVisible   = this.getPreviousVisible(activeHeaderIndex),
+                    currentResizable  = colModel.isResizable(activeHeaderIndex),
+                    previousResizable = previousVisible && colModel.isResizable(previousVisible),
+                    inLeftResizer     = pageX - activeRegion.left <= handleWidth,
+                    inRightResizer    = activeRegion.right - pageX <= (!this.activeHdBtn ? handleWidth : 2);
+                
+                if (inLeftResizer && previousResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'e-resize' : 'col-resize'; // col-resize not always supported
+                } else if (inRightResizer && currentResizable) {
+                    cursor = Ext.isAir ? 'move' : Ext.isWebKit ? 'w-resize' : 'col-resize';
+                }
+            }
+            
+            headerStyle.cursor = cursor;
+        }
+    },
+    
+    /**
+     * @private
+     * Returns the index of the nearest currently visible header to the left of the given index.
+     * @param {Number} index The header index
+     * @return {Number/undefined} The index of the nearest visible header
+     */
+    getPreviousVisible: function(index) {
+        while (index > 0) {
+            if (!this.cm.isHidden(index - 1)) {
+                return index;
+            }
+            index--;
+        }
+        return undefined;
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseover event - adds the over class to the header cell if the menu is not disabled
+     * for that cell
+     */
+    handleHdOver : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && !this.headersDisabled) {
+            var fly = this.fly(header);
+            
+            this.activeHdRef = target;
+            this.activeHdIndex = this.getCellIndex(header);
+            this.activeHdRegion = fly.getRegion();
+            
+            if (!this.isMenuDisabled(this.activeHdIndex, fly)) {
+                fly.addClass('x-grid3-hd-over');
+                this.activeHdBtn = fly.child('.x-grid3-hd-btn');
+                
+                if (this.activeHdBtn) {
+                    this.activeHdBtn.dom.style.height = (header.firstChild.offsetHeight - 1) + 'px';
+                }
+            }
+        }
+    },
+
+    /**
+     * @private
+     * Tied to the header element's mouseout event. Removes the hover class from the header cell
+     */
+    handleHdOut : function(e, target) {
+        var header = this.findHeaderCell(target);
+        
+        if (header && (!Ext.isIE || !e.within(header, true))) {
+            this.activeHdRef = null;
+            this.fly(header).removeClass('x-grid3-hd-over');
+            header.style.cursor = '';
+        }
+    },
+    
+    /**
+     * @private
+     * Used by {@link #handleHdOver} to determine whether or not to show the header menu class on cell hover
+     * @param {Number} cellIndex The header cell index
+     * @param {Ext.Element} el The cell element currently being hovered over
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return this.cm.isMenuDisabled(cellIndex);
+    },
+
+    /**
+     * @private
+     * Returns true if there are any rows rendered into the GridView
+     * @return {Boolean} True if any rows have been rendered
+     */
+    hasRows : function() {
+        var fc = this.mainBody.dom.firstChild;
+        return fc && fc.nodeType == 1 && fc.className != 'x-grid-empty';
+    },
+    
+    /**
+     * @private
+     */
+    isHideableColumn : function(c) {
+        return !c.hidden;
+    },
+
+    /**
+     * @private
+     * DEPRECATED - will be removed in Ext JS 5.0
+     */
+    bind : function(d, c) {
+        this.initData(d, c);
+    }
+});
+
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridView.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+
+    constructor: function(grid, hd){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.marker = this.view.resizeMarker;
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,
+            'gridSplitters' + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.scroll = false;
+        this.hw = this.view.splitHandleWidth || 5;
+    },
+
+    b4StartDrag : function(x, y){
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var h = this.view.mainWrap.getHeight();
+        this.marker.setHeight(h);
+        this.marker.show();
+        this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);
+        this.proxy.setHeight(h);
+        var w = this.cm.getColumnWidth(this.cellIndex),
+            minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+    allowHeaderDrag : function(e){
+        return true;
+    },
+
+    handleMouseDown : function(e){
+        var t = this.view.findHeaderCell(e.getTarget());
+        if(t && this.allowHeaderDrag(e)){
+            var xy = this.view.fly(t).getXY(), 
+                x = xy[0],
+                exy = e.getXY(), 
+                ex = exy[0],
+                w = t.offsetWidth, 
+                adjust = false;
+                
+            if((ex - x) <= this.hw){
+                adjust = -1;
+            }else if((x+w) - ex <= this.hw){
+                adjust = 0;
+            }
+            if(adjust !== false){
+                this.cm = this.grid.colModel;
+                var ci = this.view.getCellIndex(t);
+                if(adjust == -1){
+                  if (ci + adjust < 0) {
+                    return;
+                  }
+                    while(this.cm.isHidden(ci+adjust)){
+                        --adjust;
+                        if(ci+adjust < 0){
+                            return;
+                        }
+                    }
+                }
+                this.cellIndex = ci+adjust;
+                this.split = t.dom;
+                if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                    Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+                }
+            }else if(this.view.columnDrag){
+                this.view.columnDrag.callHandleMouseDown(e);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.marker.hide();
+        var v = this.view,
+            endX = Math.max(this.minX, e.getPageX()),
+            diff = endX - this.startPos,
+            disabled = this.dragHeadersDisabled;
+            
+        v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});
+/**
+ * @class Ext.grid.PivotGridView
+ * @extends Ext.grid.GridView
+ * Specialised GridView for rendering Pivot Grid components. Config can be passed to the PivotGridView via the PivotGrid constructor's
+ * viewConfig option:
+<pre><code>
+new Ext.grid.PivotGrid({
+    viewConfig: {
+        title: 'My Pivot Grid',
+        getCellCls: function(value) {
+            return value > 10 'red' : 'green';
+        }
+    }
+});
+</code></pre>
+ * <p>Currently {@link #title} and {@link #getCellCls} are the only configuration options accepted by PivotGridView. All other 
+ * interaction is performed via the {@link Ext.grid.PivotGrid PivotGrid} class.</p>
+ */
+Ext.grid.PivotGridView = Ext.extend(Ext.grid.GridView, {
+    
+    /**
+     * The CSS class added to all group header cells. Defaults to 'grid-hd-group-cell'
+     * @property colHeaderCellCls
+     * @type String
+     */
+    colHeaderCellCls: 'grid-hd-group-cell',
+    
+    /**
+     * @cfg {String} title Optional title to be placed in the top left corner of the PivotGrid. Defaults to an empty string.
+     */
+    title: '',
+    
+    /**
+     * @cfg {Function} getCellCls Optional function which should return a CSS class name for each cell value. This is useful when
+     * color coding cells based on their value. Defaults to undefined.
+     */
+    
+    /**
+     * Returns the headers to be rendered at the top of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of columns it groups (column in this case refers to normal grid columns). In the example below we have 5 city groups, which are
+     * each part of a continent supergroup. The colspan for each city group refers to the number of normal grid columns that group spans,
+     * so in this case the grid would be expected to have a total of 12 columns:
+<pre><code>
+[
+    {
+        items: [
+            {header: 'England',   colspan: 5},
+            {header: 'USA',       colspan: 3}
+        ]
+    },
+    {
+        items: [
+            {header: 'London',    colspan: 2},
+            {header: 'Cambridge', colspan: 3},
+            {header: 'Palo Alto', colspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     */
+    getColumnHeaders: function() {
+        return this.grid.topAxis.buildHeaders();;
+    },
+    
+    /**
+     * Returns the headers to be rendered on the left of the grid. Should be a 2-dimensional array, where each item specifies the number
+     * of rows it groups. In the example below we have 5 city groups, which are each part of a continent supergroup. The rowspan for each 
+     * city group refers to the number of normal grid columns that group spans, so in this case the grid would be expected to have a 
+     * total of 12 rows:
+<pre><code>
+[
+    {
+        width: 90,
+        items: [
+            {header: 'England',   rowspan: 5},
+            {header: 'USA',       rowspan: 3}
+        ]
+    },
+    {
+        width: 50,
+        items: [
+            {header: 'London',    rowspan: 2},
+            {header: 'Cambridge', rowspan: 3},
+            {header: 'Palo Alto', rowspan: 3}
+        ]
+    }
+]
+</code></pre>
+     * In the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->
+     * State -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
+     * @return {Array} A tree structure containing the headers to be rendered. Must include the colspan property at each level, which should
+     * be the sum of all child nodes beneath this node.
+     * Each group may specify the width it should be rendered with.
+     * @return {Array} The row groups
+     */
+    getRowHeaders: function() {
+        return this.grid.leftAxis.buildHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders rows between start and end indexes
+     * @param {Number} startRow Index of the first row to render
+     * @param {Number} endRow Index of the last row to render
+     */
+    renderRows : function(startRow, endRow) {
+        var grid          = this.grid,
+            rows          = grid.extractData(),
+            rowCount      = rows.length,
+            templates     = this.templates,
+            renderer      = grid.renderer,
+            hasRenderer   = typeof renderer == 'function',
+            getCellCls    = this.getCellCls,
+            hasGetCellCls = typeof getCellCls == 'function',
+            cellTemplate  = templates.cell,
+            rowTemplate   = templates.row,
+            rowBuffer     = [],
+            meta          = {},
+            tstyle        = 'width:' + this.getGridInnerWidth() + 'px;',
+            colBuffer, colCount, column, i, row;
+        
+        startRow = startRow || 0;
+        endRow   = Ext.isDefined(endRow) ? endRow : rowCount - 1;
+        
+        for (i = 0; i < rowCount; i++) {
+            row = rows[i];
+            colCount  = row.length;
+            colBuffer = [];
+            
+            //build up each column's HTML
+            for (var j = 0; j < colCount; j++) {
+                
+                meta.id    = i + '-' + j;
+                meta.css   = j === 0 ? 'x-grid3-cell-first ' : (j == (colCount - 1) ? 'x-grid3-cell-last ' : '');
+                meta.attr  = meta.cellAttr = '';
+                meta.value = row[j];
+
+                if (Ext.isEmpty(meta.value)) {
+                    meta.value = '&#160;';
+                }
+                
+                if (hasRenderer) {
+                    meta.value = renderer(meta.value);
+                }
+                
+                if (hasGetCellCls) {
+                    meta.css += getCellCls(meta.value) + ' ';
+                }
+
+                colBuffer[colBuffer.length] = cellTemplate.apply(meta);
+            }
+            
+            rowBuffer[rowBuffer.length] = rowTemplate.apply({
+                tstyle: tstyle,
+                cols  : colCount,
+                cells : colBuffer.join(""),
+                alt   : ''
+            });
+        }
+        
+        return rowBuffer.join("");
+    },
+    
+    /**
+     * The master template to use when rendering the GridView. Has a default template
+     * @property Ext.Template
+     * @type masterTpl
+     */
+    masterTpl: new Ext.Template(
+        '<div class="x-grid3 x-pivotgrid" hidefocus="true">',
+            '<div class="x-grid3-viewport">',
+                '<div class="x-grid3-header">',
+                    '<div class="x-grid3-header-title"><span>{title}</span></div>',
+                    '<div class="x-grid3-header-inner">',
+                        '<div class="x-grid3-header-offset" style="{ostyle}"></div>',
+                    '</div>',
+                    '<div class="x-clear"></div>',
+                '</div>',
+                '<div class="x-grid3-scroller">',
+                    '<div class="x-grid3-row-headers"></div>',
+                    '<div class="x-grid3-body" style="{bstyle}">{body}</div>',
+                    '<a href="#" class="x-grid3-focus" tabIndex="-1"></a>',
+                '</div>',
+            '</div>',
+            '<div class="x-grid3-resize-marker">&#160;</div>',
+            '<div class="x-grid3-resize-proxy">&#160;</div>',
+        '</div>'
+    ),
+    
+    /**
+     * @private
+     * Adds a gcell template to the internal templates object. This is used to render the headers in a multi-level column header.
+     */
+    initTemplates: function() {
+        Ext.grid.PivotGridView.superclass.initTemplates.apply(this, arguments);
+        
+        var templates = this.templates || {};
+        if (!templates.gcell) {
+            templates.gcell = new Ext.XTemplate(
+                '<td class="x-grid3-hd x-grid3-gcell x-grid3-td-{id} ux-grid-hd-group-row-{row} ' + this.colHeaderCellCls + '" style="{style}">',
+                    '<div {tooltip} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', 
+                        this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '', '{value}',
+                    '</div>',
+                '</td>'
+            );
+        }
+        
+        this.templates = templates;
+        this.hrowRe = new RegExp("ux-grid-hd-group-row-(\\d+)", "");
+    },
+    
+    /**
+     * @private
+     * Sets up the reference to the row headers element
+     */
+    initElements: function() {
+        Ext.grid.PivotGridView.superclass.initElements.apply(this, arguments);
+        
+        /**
+         * @property rowHeadersEl
+         * @type Ext.Element
+         * The element containing all row headers
+         */
+        this.rowHeadersEl = new Ext.Element(this.scroller.child('div.x-grid3-row-headers'));
+        
+        /**
+         * @property headerTitleEl
+         * @type Ext.Element
+         * The element that contains the optional title (top left section of the pivot grid)
+         */
+        this.headerTitleEl = new Ext.Element(this.mainHd.child('div.x-grid3-header-title'));
+    },
+    
+    /**
+     * @private
+     * Takes row headers into account when calculating total available width
+     */
+    getGridInnerWidth: function() {
+        var previousWidth = Ext.grid.PivotGridView.superclass.getGridInnerWidth.apply(this, arguments);
+        
+        return previousWidth - this.getTotalRowHeaderWidth();
+    },
+    
+    /**
+     * Returns the total width of all row headers as specified by {@link #getRowHeaders}
+     * @return {Number} The total width
+     */
+    getTotalRowHeaderWidth: function() {
+        var headers = this.getRowHeaders(),
+            length  = headers.length,
+            total   = 0,
+            i;
+        
+        for (i = 0; i< length; i++) {
+            total += headers[i].width;
+        }
+        
+        return total;
+    },
+    
+    /**
+     * @private
+     * Returns the total height of all column headers
+     * @return {Number} The total height
+     */
+    getTotalColumnHeaderHeight: function() {
+        return this.getColumnHeaders().length * 21;
+    },
+    
+    /**
+     * Inherit docs
+     * @private
+     * @param {HTMLElement} el
+     */
+    getCellIndex : function(el) {
+        if (el) {
+            var match = el.className.match(this.colRe),
+                data;
+ 
+            if (match && (data = match[1])) {
+                return parseInt(data.split('-')[1], 10);
+            }
+        }
+        return false;
+    },
+    
+    
+    /**
+     * @private
+     * Slight specialisation of the GridView renderUI - just adds the row headers
+     */
+    renderUI : function() {
+        var templates  = this.templates,
+            innerWidth = this.getGridInnerWidth();
+            
+        return templates.master.apply({
+            body  : templates.body.apply({rows:'&#160;'}),
+            ostyle: 'width:' + innerWidth + 'px',
+            bstyle: 'width:' + innerWidth + 'px'
+        });
+    },
+    
+    /**
+     * @private
+     * Make sure that the headers and rows are all sized correctly during layout
+     */
+    onLayout: function(width, height) {
+        Ext.grid.PivotGridView.superclass.onLayout.apply(this, arguments);
+        
+        var width = this.getGridInnerWidth();
+        
+        this.resizeColumnHeaders(width);
+        this.resizeAllRows(width);
+    },
+    
+    /**
+     * Refreshs the grid UI
+     * @param {Boolean} headersToo (optional) True to also refresh the headers
+     */
+    refresh : function(headersToo) {
+        this.fireEvent('beforerefresh', this);
+        this.grid.stopEditing(true);
+        
+        var result = this.renderBody();
+        this.mainBody.update(result).setWidth(this.getGridInnerWidth());
+        if (headersToo === true) {
+            this.updateHeaders();
+            this.updateHeaderSortState();
+        }
+        this.processRows(0, true);
+        this.layout();
+        this.applyEmptyText();
+        this.fireEvent('refresh', this);
+    },
+    
+    /**
+     * @private
+     * Bypasses GridView's renderHeaders as they are taken care of separately by the PivotAxis instances
+     */
+    renderHeaders: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Taken care of by PivotAxis
+     */
+    fitColumns: Ext.emptyFn,
+    
+    /**
+     * @private
+     * Called on layout, ensures that the width of each column header is correct. Omitting this can lead to faulty
+     * layouts when nested in a container.
+     * @param {Number} width The new width
+     */
+    resizeColumnHeaders: function(width) {
+        var topAxis = this.grid.topAxis;
+        
+        if (topAxis.rendered) {
+            topAxis.el.setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Sets the row header div to the correct width. Should be called after rendering and reconfiguration of headers
+     */
+    resizeRowHeaders: function() {
+        var rowHeaderWidth = this.getTotalRowHeaderWidth(),
+            marginStyle    = String.format("margin-left: {0}px;", rowHeaderWidth);
+        
+        this.rowHeadersEl.setWidth(rowHeaderWidth);
+        this.mainBody.applyStyles(marginStyle);
+        Ext.fly(this.innerHd).applyStyles(marginStyle);
+        
+        this.headerTitleEl.setWidth(rowHeaderWidth);
+        this.headerTitleEl.setHeight(this.getTotalColumnHeaderHeight());
+    },
+    
+    /**
+     * @private
+     * Resizes all rendered rows to the given width. Usually called by onLayout
+     * @param {Number} width The new width
+     */
+    resizeAllRows: function(width) {
+        var rows   = this.getRows(),
+            length = rows.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            Ext.fly(rows[i]).setWidth(width);
+            Ext.fly(rows[i]).child('table').setWidth(width);
+        }
+    },
+    
+    /**
+     * @private
+     * Updates the Row Headers, deferring the updating of Column Headers to GridView
+     */
+    updateHeaders: function() {
+        this.renderGroupRowHeaders();
+        this.renderGroupColumnHeaders();
+    },
+    
+    /**
+     * @private
+     * Renders all row header groups at all levels based on the structure fetched from {@link #getGroupRowHeaders}
+     */
+    renderGroupRowHeaders: function() {
+        var leftAxis = this.grid.leftAxis;
+        
+        this.resizeRowHeaders();
+        leftAxis.rendered = false;
+        leftAxis.render(this.rowHeadersEl);
+        
+        this.setTitle(this.title);
+    },
+    
+    /**
+     * Sets the title text in the top left segment of the PivotGridView
+     * @param {String} title The title
+     */
+    setTitle: function(title) {
+        this.headerTitleEl.child('span').dom.innerHTML = title;
+    },
+    
+    /**
+     * @private
+     * Renders all column header groups at all levels based on the structure fetched from {@link #getColumnHeaders}
+     */
+    renderGroupColumnHeaders: function() {
+        var topAxis = this.grid.topAxis;
+        
+        topAxis.rendered = false;
+        topAxis.render(this.innerHd.firstChild);
+    },
+    
+    /**
+     * @private
+     * Overridden to test whether the user is hovering over a group cell, in which case we don't show the menu
+     */
+    isMenuDisabled: function(cellIndex, el) {
+        return true;
+    }
+});/**
+ * @class Ext.grid.PivotAxis
+ * @extends Ext.Component
+ * <p>PivotAxis is a class that supports a {@link Ext.grid.PivotGrid}. Each PivotGrid contains two PivotAxis instances - the left
+ * axis and the top axis. Each PivotAxis defines an ordered set of dimensions, each of which should correspond to a field in a
+ * Store's Record (see {@link Ext.grid.PivotGrid} documentation for further explanation).</p>
+ * <p>Developers should have little interaction with the PivotAxis instances directly as most of their management is performed by
+ * the PivotGrid. An exception is the dynamic reconfiguration of axes at run time - to achieve this we use PivotAxis's 
+ * {@link #setDimensions} function and refresh the grid:</p>
+<pre><code>
+var pivotGrid = new Ext.grid.PivotGrid({
+    //some PivotGrid config here
+});
+
+//change the left axis dimensions
+pivotGrid.leftAxis.setDimensions([
+    {
+        dataIndex: 'person',
+        direction: 'DESC',
+        width    : 100
+    },
+    {
+        dataIndex: 'product',
+        direction: 'ASC',
+        width    : 80
+    }
+]);
+
+pivotGrid.view.refresh(true);
+</code></pre>
+ * This clears the previous dimensions on the axis and redraws the grid with the new dimensions.
+ */
+Ext.grid.PivotAxis = Ext.extend(Ext.Component, {
+    /**
+     * @cfg {String} orientation One of 'vertical' or 'horizontal'. Defaults to horizontal
+     */
+    orientation: 'horizontal',
+    
+    /**
+     * @cfg {Number} defaultHeaderWidth The width to render each row header that does not have a width specified via 
+     {@link #getRowGroupHeaders}. Defaults to 80.
+     */
+    defaultHeaderWidth: 80,
+    
+    /**
+     * @private
+     * @cfg {Number} paddingWidth The amount of padding used by each cell.
+     * TODO: From 4.x onwards this can be removed as it won't be needed. For now it is used to account for the differences between
+     * the content box and border box measurement models
+     */
+    paddingWidth: 7,
+    
+    /**
+     * Updates the dimensions used by this axis
+     * @param {Array} dimensions The new dimensions
+     */
+    setDimensions: function(dimensions) {
+        this.dimensions = dimensions;
+    },
+    
+    /**
+     * @private
+     * Builds the html table that contains the dimensions for this axis. This branches internally between vertical
+     * and horizontal orientations because the table structure is slightly different in each case
+     */
+    onRender: function(ct, position) {
+        var rows = this.orientation == 'horizontal'
+                 ? this.renderHorizontalRows()
+                 : this.renderVerticalRows();
+        
+        this.el = Ext.DomHelper.overwrite(ct.dom, {tag: 'table', cn: rows}, true);
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for horizontal oriented axes
+     * @return {Object} The HTML Domspec for a horizontal oriented axis
+     */
+    renderHorizontalRows: function() {
+        var headers  = this.buildHeaders(),
+            rowCount = headers.length,
+            rows     = [],
+            cells, cols, colCount, i, j;
+        
+        for (i = 0; i < rowCount; i++) {
+            cells = [];
+            cols  = headers[i].items;
+            colCount = cols.length;
+
+            for (j = 0; j < colCount; j++) {
+                cells.push({
+                    tag: 'td',
+                    html: cols[j].header,
+                    colspan: cols[j].span
+                });
+            }
+
+            rows[i] = {
+                tag: 'tr',
+                cn: cells
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Specialised renderer for vertical oriented axes
+     * @return {Object} The HTML Domspec for a vertical oriented axis
+     */
+    renderVerticalRows: function() {
+        var headers  = this.buildHeaders(),
+            colCount = headers.length,
+            rowCells = [],
+            rows     = [],
+            rowCount, col, row, colWidth, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            col = headers[i];
+            colWidth = col.width || 80;
+            rowCount = col.items.length;
+            
+            for (j = 0; j < rowCount; j++) {
+                row = col.items[j];
+                
+                rowCells[row.start] = rowCells[row.start] || [];
+                rowCells[row.start].push({
+                    tag    : 'td',
+                    html   : row.header,
+                    rowspan: row.span,
+                    width  : Ext.isBorderBox ? colWidth : colWidth - this.paddingWidth
+                });
+            }
+        }
+        
+        rowCount = rowCells.length;
+        for (i = 0; i < rowCount; i++) {
+            rows[i] = {
+                tag: 'tr',
+                cn : rowCells[i]
+            };
+        }
+        
+        return rows;
+    },
+    
+    /**
+     * @private
+     * Returns the set of all unique tuples based on the bound store and dimension definitions.
+     * Internally we construct a new, temporary store to make use of the multi-sort capabilities of Store. In
+     * 4.x this functionality should have been moved to MixedCollection so this step should not be needed.
+     * @return {Array} All unique tuples
+     */
+    getTuples: function() {
+        var newStore = new Ext.data.Store({});
+        
+        newStore.data = this.store.data.clone();
+        newStore.fields = this.store.fields;
+        
+        var sorters    = [],
+            dimensions = this.dimensions,
+            length     = dimensions.length,
+            i;
+        
+        for (i = 0; i < length; i++) {
+            sorters.push({
+                field    : dimensions[i].dataIndex,
+                direction: dimensions[i].direction || 'ASC'
+            });
+        }
+        
+        newStore.sort(sorters);
+        
+        var records = newStore.data.items,
+            hashes  = [],
+            tuples  = [],
+            recData, hash, info, data, key;
+        
+        length = records.length;
+        
+        for (i = 0; i < length; i++) {
+            info = this.getRecordInfo(records[i]);
+            data = info.data;
+            hash = "";
+            
+            for (key in data) {
+                hash += data[key] + '---';
+            }
+            
+            if (hashes.indexOf(hash) == -1) {
+                hashes.push(hash);
+                tuples.push(info);
+            }
+        }
+        
+        newStore.destroy();
+        
+        return tuples;
+    },
+    
+    /**
+     * @private
+     */
+    getRecordInfo: function(record) {
+        var dimensions = this.dimensions,
+            length  = dimensions.length,
+            data    = {},
+            dimension, dataIndex, i;
+        
+        //get an object containing just the data we are interested in based on the configured dimensions
+        for (i = 0; i < length; i++) {
+            dimension = dimensions[i];
+            dataIndex = dimension.dataIndex;
+            
+            data[dataIndex] = record.get(dataIndex);
+        }
+        
+        //creates a specialised matcher function for a given tuple. The returned function will return
+        //true if the record passed to it matches the dataIndex values of each dimension in this axis
+        var createMatcherFunction = function(data) {
+            return function(record) {
+                for (var dataIndex in data) {
+                    if (record.get(dataIndex) != data[dataIndex]) {
+                        return false;
+                    }
+                }
+                
+                return true;
+            };
+        };
+        
+        return {
+            data: data,
+            matcher: createMatcherFunction(data)
+        };
+    },
+    
+    /**
+     * @private
+     * Uses the calculated set of tuples to build an array of headers that can be rendered into a table using rowspan or
+     * colspan. Basically this takes the set of tuples and spans any cells that run into one another, so if we had dimensions
+     * of Person and Product and several tuples containing different Products for the same Person, those Products would be
+     * spanned.
+     * @return {Array} The headers
+     */
+    buildHeaders: function() {
+        var tuples     = this.getTuples(),
+            rowCount   = tuples.length,
+            dimensions = this.dimensions,
+            dimension,
+            colCount   = dimensions.length,
+            headers    = [],
+            tuple, rows, currentHeader, previousHeader, span, start, isLast, changed, i, j;
+        
+        for (i = 0; i < colCount; i++) {
+            dimension = dimensions[i];
+            rows  = [];
+            span  = 0;
+            start = 0;
+            
+            for (j = 0; j < rowCount; j++) {
+                tuple  = tuples[j];
+                isLast = j == (rowCount - 1);
+                currentHeader = tuple.data[dimension.dataIndex];
+                
+                /*
+                 * 'changed' indicates that we need to create a new cell. This should be true whenever the cell
+                 * above (previousHeader) is different from this cell, or when the cell on the previous dimension
+                 * changed (e.g. if the current dimension is Product and the previous was Person, we need to start
+                 * a new cell if Product is the same but Person changed, so we check the previous dimension and tuple)
+                 */
+                changed = previousHeader != undefined && previousHeader != currentHeader;
+                if (i > 0 && j > 0) {
+                    changed = changed || tuple.data[dimensions[i-1].dataIndex] != tuples[j-1].data[dimensions[i-1].dataIndex];
+                }
+                
+                if (changed) {                    
+                    rows.push({
+                        header: previousHeader,
+                        span  : span,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                if (isLast) {
+                    rows.push({
+                        header: currentHeader,
+                        span  : span + 1,
+                        start : start
+                    });
+                    
+                    start += span;
+                    span = 0;
+                }
+                
+                previousHeader = currentHeader;
+                span++;
+            }
+            
+            headers.push({
+                items: rows,
+                width: dimension.width || this.defaultHeaderWidth
+            });
+            
+            previousHeader = undefined;
+        }
+        
+        return headers;
+    }
+});
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDragZone = Ext.extend(Ext.dd.DragZone, {
+    maxDragWidth: 120,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
+        if(hd2){
+            this.setHandleElId(Ext.id(hd));
+            this.setOuterHandleElId(Ext.id(hd2));
+        }
+        this.scroll = false;
+    },
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            h = this.view.findHeaderCell(t);
+        if(h){
+            return {ddel: h.firstChild, header:h};
+        }
+        return false;
+    },
+
+    onInitDrag : function(e){
+        // keep the value here so we can restore it;
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var clone = this.dragData.ddel.cloneNode(true);
+        clone.id = Ext.id();
+        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
+        this.proxy.update(clone);
+        return true;
+    },
+
+    afterValidDrop : function(){
+        this.completeDrop();
+    },
+
+    afterInvalidDrop : function(){
+        this.completeDrop();
+    },
+    
+    completeDrop: function(){
+        var v = this.view,
+            disabled = this.dragHeadersDisabled;
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    }
+});
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDropZone = Ext.extend(Ext.dd.DropZone, {
+    proxyOffsets : [-4, -9],
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        // split the proxies so they don't interfere with mouse events
+        this.proxyTop = Ext.DomHelper.append(document.body, {
+            cls:"col-move-top", html:"&#160;"
+        }, true);
+        this.proxyBottom = Ext.DomHelper.append(document.body, {
+            cls:"col-move-bottom", html:"&#160;"
+        }, true);
+        this.proxyTop.hide = this.proxyBottom.hide = function(){
+            this.setLeftTop(-100,-100);
+            this.setStyle("visibility", "hidden");
+        };
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        // temporarily disabled
+        //Ext.dd.ScrollManager.register(this.view.scroller.dom);
+        Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
+    },
+
+    getTargetFromEvent : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            cindex = this.view.findCellIndex(t);
+        if(cindex !== false){
+            return this.view.getHeaderCell(cindex);
+        }
+    },
+
+    nextVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.nextSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.nextSibling;
+        }
+        return null;
+    },
+
+    prevVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.prevSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.prevSibling;
+        }
+        return null;
+    },
+
+    positionIndicator : function(h, n, e){
+        var x = Ext.lib.Event.getPageX(e),
+            r = Ext.lib.Dom.getRegion(n.firstChild),
+            px, 
+            pt, 
+            py = r.top + this.proxyOffsets[1];
+        if((r.right - x) <= (r.right-r.left)/2){
+            px = r.right+this.view.borderWidth;
+            pt = "after";
+        }else{
+            px = r.left;
+            pt = "before";
+        }
+
+        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){
+            return false;
+        }
+
+        px +=  this.proxyOffsets[0];
+        this.proxyTop.setLeftTop(px, py);
+        this.proxyTop.show();
+        if(!this.bottomOffset){
+            this.bottomOffset = this.view.mainHd.getHeight();
+        }
+        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
+        this.proxyBottom.show();
+        return pt;
+    },
+
+    onNodeEnter : function(n, dd, e, data){
+        if(data.header != n){
+            this.positionIndicator(data.header, n, e);
+        }
+    },
+
+    onNodeOver : function(n, dd, e, data){
+        var result = false;
+        if(data.header != n){
+            result = this.positionIndicator(data.header, n, e);
+        }
+        if(!result){
+            this.proxyTop.hide();
+            this.proxyBottom.hide();
+        }
+        return result ? this.dropAllowed : this.dropNotAllowed;
+    },
+
+    onNodeOut : function(n, dd, e, data){
+        this.proxyTop.hide();
+        this.proxyBottom.hide();
+    },
+
+    onNodeDrop : function(n, dd, e, data){
+        var h = data.header;
+        if(h != n){
+            var cm = this.grid.colModel,
+                x = Ext.lib.Event.getPageX(e),
+                r = Ext.lib.Dom.getRegion(n.firstChild),
+                pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before",
+                oldIndex = this.view.getCellIndex(h),
+                newIndex = this.view.getCellIndex(n);
+            if(pt == "after"){
+                newIndex++;
+            }
+            if(oldIndex < newIndex){
+                newIndex--;
+            }
+            cm.moveColumn(oldIndex, newIndex);
+            return true;
+        }
+        return false;
+    }
+});
+
+Ext.grid.GridView.ColumnDragZone = Ext.extend(Ext.grid.HeaderDragZone, {
+    
+    constructor : function(grid, hd){
+        Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
+        this.proxy.el.addClass('x-grid3-col-dd');
+    },
+    
+    handleMouseDown : function(e){
+    },
+
+    callHandleMouseDown : function(e){
+        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
+    }
+});// private
+// This is a support class used internally by the Grid components
+Ext.grid.SplitDragZone = Ext.extend(Ext.dd.DDProxy, {
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.proxy = this.view.resizeProxy;
+        Ext.grid.SplitDragZone.superclass.constructor.call(this, hd,
+            "gridSplitters" + this.grid.getGridEl().id, {
+            dragElId : Ext.id(this.proxy.dom), resizeFrame:false
+        });
+        this.setHandleElId(Ext.id(hd));
+        this.setOuterHandleElId(Ext.id(hd2));
+        this.scroll = false;
+    },
+
+    b4StartDrag : function(x, y){
+        this.view.headersDisabled = true;
+        this.proxy.setHeight(this.view.mainWrap.getHeight());
+        var w = this.cm.getColumnWidth(this.cellIndex);
+        var minw = Math.max(w-this.grid.minColumnWidth, 0);
+        this.resetConstraints();
+        this.setXConstraint(minw, 1000);
+        this.setYConstraint(0, 0);
+        this.minX = x - minw;
+        this.maxX = x + 1000;
+        this.startPos = x;
+        Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
+    },
+
+
+    handleMouseDown : function(e){
+        var ev = Ext.EventObject.setEvent(e);
+        var t = this.fly(ev.getTarget());
+        if(t.hasClass("x-grid-split")){
+            this.cellIndex = this.view.getCellIndex(t.dom);
+            this.split = t.dom;
+            this.cm = this.grid.colModel;
+            if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
+                Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
+            }
+        }
+    },
+
+    endDrag : function(e){
+        this.view.headersDisabled = false;
+        var endX = Math.max(this.minX, Ext.lib.Event.getPageX(e));
+        var diff = endX - this.startPos;
+        this.view.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
+    },
+
+    autoOffset : function(){
+        this.setDelta(0,0);
+    }
+});/**
+ * @class Ext.grid.GridDragZone
+ * @extends Ext.dd.DragZone
+ * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
+ * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
+ * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
+ * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+ * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
+ * to process the {@link #getDragData data} which is provided.
+ */
+Ext.grid.GridDragZone = function(grid, config){
+    this.view = grid.getView();
+    Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
+    this.scroll = false;
+    this.grid = grid;
+    this.ddel = document.createElement('div');
+    this.ddel.className = 'x-grid-dd-wrap';
+};
+
+Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
+    ddGroup : "GridDD",
+
+    /**
+     * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
+     * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
+     * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
+     * <p>The data object contains the following properties:<ul>
+     * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
+     * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
+     * <li><b>rowIndex</b> : Number<div class="sub-desc">The index of the row which receieved the mousedown gesture which triggered the drag.</div></li>
+     * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
+     * </ul></p>
+     */
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e);
+        var rowIndex = this.view.findRowIndex(t);
+        if(rowIndex !== false){
+            var sm = this.grid.selModel;
+            if(!sm.isSelected(rowIndex) || e.hasModifier()){
+                sm.handleMouseDown(this.grid, rowIndex, e);
+            }
+            return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
+        }
+        return false;
+    },
+
+    /**
+     * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
+     * of the data being dragged.</p>
+     * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
+     */
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.ddel.innerHTML = this.grid.getDragDropText();
+        this.proxy.update(this.ddel);
+        // fire start drag?
+    },
+
+    /**
+     * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
+     * the selected rows to show that they have not been dragged.
+     */
+    afterRepair : function(){
+        this.dragging = false;
+    },
+
+    /**
+     * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
+     * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e, data){
+        return false;
+    },
+
+    onEndDrag : function(data, e){
+        // fire end drag?
+    },
+
+    onValidDrop : function(dd, e, id){
+        // fire drag drop?
+        this.hideProxy();
+    },
+
+    beforeInvalidDrop : function(e, id){
+
+    }
+});
+/**
+ * @class Ext.grid.ColumnModel
+ * @extends Ext.util.Observable
+ * <p>After the data has been read into the client side cache (<b>{@link Ext.data.Store Store}</b>),
+ * the ColumnModel is used to configure how and what parts of that data will be displayed in the
+ * vertical slices (columns) of the grid. The Ext.grid.ColumnModel Class is the default implementation
+ * of a ColumnModel used by implentations of {@link Ext.grid.GridPanel GridPanel}.</p>
+ * <p>Data is mapped into the store's records and then indexed into the ColumnModel using the
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt>:</p>
+ * <pre><code>
+{data source} == mapping ==> {data store} == <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> ==> {ColumnModel}
+ * </code></pre>
+ * <p>Each {@link Ext.grid.Column Column} in the grid's ColumnModel is configured with a
+ * <tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt> to specify how the data within
+ * each record in the store is indexed into the ColumnModel.</p>
+ * <p>There are two ways to initialize the ColumnModel class:</p>
+ * <p><u>Initialization Method 1: an Array</u></p>
+<pre><code>
+ var colModel = new Ext.grid.ColumnModel([
+    { header: "Ticker", width: 60, sortable: true},
+    { header: "Company Name", width: 150, sortable: true, id: 'company'},
+    { header: "Market Cap.", width: 100, sortable: true},
+    { header: "$ Sales", width: 100, sortable: true, renderer: money},
+    { header: "Employees", width: 100, sortable: true, resizable: false}
+ ]);
+ </code></pre>
+ * <p>The ColumnModel may be initialized with an Array of {@link Ext.grid.Column} column configuration
+ * objects to define the initial layout / display of the columns in the Grid. The order of each
+ * {@link Ext.grid.Column} column configuration object within the specified Array defines the initial
+ * order of the column display.  A Column's display may be initially hidden using the
+ * <tt>{@link Ext.grid.Column#hidden hidden}</tt></b> config property (and then shown using the column
+ * header menu).  Fields that are not included in the ColumnModel will not be displayable at all.</p>
+ * <p>How each column in the grid correlates (maps) to the {@link Ext.data.Record} field in the
+ * {@link Ext.data.Store Store} the column draws its data from is configured through the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b>.  If the
+ * <b><tt>{@link Ext.grid.Column#dataIndex dataIndex}</tt></b> is not explicitly defined (as shown in the
+ * example above) it will use the column configuration's index in the Array as the index.</p>
+ * <p>See <b><tt>{@link Ext.grid.Column}</tt></b> for additional configuration options for each column.</p>
+ * <p><u>Initialization Method 2: an Object</u></p>
+ * <p>In order to use configuration options from <tt>Ext.grid.ColumnModel</tt>, an Object may be used to
+ * initialize the ColumnModel.  The column configuration Array will be specified in the <tt><b>{@link #columns}</b></tt>
+ * config property. The <tt><b>{@link #defaults}</b></tt> config property can be used to apply defaults
+ * for all columns, e.g.:</p><pre><code>
+ var colModel = new Ext.grid.ColumnModel({
+    columns: [
+        { header: "Ticker", width: 60, menuDisabled: false},
+        { header: "Company Name", width: 150, id: 'company'},
+        { header: "Market Cap."},
+        { header: "$ Sales", renderer: money},
+        { header: "Employees", resizable: false}
+    ],
+    defaults: {
+        sortable: true,
+        menuDisabled: true,
+        width: 100
+    },
+    listeners: {
+        {@link #hiddenchange}: function(cm, colIndex, hidden) {
+            saveConfig(colIndex, hidden);
+        }
+    }
+});
+ </code></pre>
+ * <p>In both examples above, the ability to apply a CSS class to all cells in a column (including the
+ * header) is demonstrated through the use of the <b><tt>{@link Ext.grid.Column#id id}</tt></b> config
+ * option. This column could be styled by including the following css:</p><pre><code>
+ //add this css *after* the core css is loaded
+.x-grid3-td-company {
+    color: red; // entire column will have red font
+}
+// modify the header row only, adding an icon to the column header
+.x-grid3-hd-company {
+    background: transparent
+        url(../../resources/images/icons/silk/building.png)
+        no-repeat 3px 3px ! important;
+        padding-left:20px;
+}
+ </code></pre>
+ * Note that the "Company Name" column could be specified as the
+ * <b><tt>{@link Ext.grid.GridPanel}.{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></b>.
+ * @constructor
+ * @param {Mixed} config Specify either an Array of {@link Ext.grid.Column} configuration objects or specify
+ * a configuration Object (see introductory section discussion utilizing Initialization Method 2 above).
+ */
+Ext.grid.ColumnModel = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Number} defaultWidth (optional) The width of columns which have no <tt>{@link #width}</tt>
+     * specified (defaults to <tt>100</tt>).  This property shall preferably be configured through the
+     * <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultWidth: 100,
+
+    /**
+     * @cfg {Boolean} defaultSortable (optional) Default sortable of columns which have no
+     * sortable specified (defaults to <tt>false</tt>).  This property shall preferably be configured
+     * through the <tt><b>{@link #defaults}</b></tt> config property.
+     */
+    defaultSortable: false,
+
+    /**
+     * @cfg {Array} columns An Array of object literals.  The config options defined by
+     * <b>{@link Ext.grid.Column}</b> are the options which may appear in the object literal for each
+     * individual column definition.
+     */
+
+    /**
+     * @cfg {Object} defaults Object literal which will be used to apply {@link Ext.grid.Column}
+     * configuration options to all <tt><b>{@link #columns}</b></tt>.  Configuration options specified with
+     * individual {@link Ext.grid.Column column} configs will supersede these <tt><b>{@link #defaults}</b></tt>.
+     */
+
+    constructor : function(config) {
+        /**
+	     * An Array of {@link Ext.grid.Column Column definition} objects representing the configuration
+	     * of this ColumnModel.  See {@link Ext.grid.Column} for the configuration properties that may
+	     * be specified.
+	     * @property config
+	     * @type Array
+	     */
+	    if (config.columns) {
+	        Ext.apply(this, config);
+	        this.setConfig(config.columns, true);
+	    } else {
+	        this.setConfig(config, true);
+	    }
+	    
+	    this.addEvents(
+	        /**
+	         * @event widthchange
+	         * Fires when the width of a column is programmaticially changed using
+	         * <code>{@link #setColumnWidth}</code>.
+	         * Note internal resizing suppresses the event from firing. See also
+	         * {@link Ext.grid.GridPanel}.<code>{@link #columnresize}</code>.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Number} newWidth The new width
+	         */
+	        "widthchange",
+	        
+	        /**
+	         * @event headerchange
+	         * Fires when the text of a header changes.
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {String} newText The new header text
+	         */
+	        "headerchange",
+	        
+	        /**
+	         * @event hiddenchange
+	         * Fires when a column is hidden or "unhidden".
+	         * @param {ColumnModel} this
+	         * @param {Number} columnIndex The column index
+	         * @param {Boolean} hidden true if hidden, false otherwise
+	         */
+	        "hiddenchange",
+	        
+	        /**
+	         * @event columnmoved
+	         * Fires when a column is moved.
+	         * @param {ColumnModel} this
+	         * @param {Number} oldIndex
+	         * @param {Number} newIndex
+	         */
+	        "columnmoved",
+	        
+	        /**
+	         * @event configchange
+	         * Fires when the configuration is changed
+	         * @param {ColumnModel} this
+	         */
+	        "configchange"
+	    );
+	    
+	    Ext.grid.ColumnModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * Returns the id of the column at the specified index.
+     * @param {Number} index The column index
+     * @return {String} the id
+     */
+    getColumnId : function(index) {
+        return this.config[index].id;
+    },
+
+    getColumnAt : function(index) {
+        return this.config[index];
+    },
+
+    /**
+     * <p>Reconfigures this column model according to the passed Array of column definition objects.
+     * For a description of the individual properties of a column definition object, see the
+     * <a href="#Ext.grid.ColumnModel-configs">Config Options</a>.</p>
+     * <p>Causes the {@link #configchange} event to be fired. A {@link Ext.grid.GridPanel GridPanel}
+     * using this ColumnModel will listen for this event and refresh its UI automatically.</p>
+     * @param {Array} config Array of Column definition objects.
+     * @param {Boolean} initial Specify <tt>true</tt> to bypass cleanup which deletes the <tt>totalWidth</tt>
+     * and destroys existing editors.
+     */
+    setConfig : function(config, initial) {
+        var i, c, len;
+        
+        if (!initial) { // cleanup
+            delete this.totalWidth;
+            
+            for (i = 0, len = this.config.length; i < len; i++) {
+                c = this.config[i];
+                
+                if (c.setEditor) {
+                    //check here, in case we have a special column like a CheckboxSelectionModel
+                    c.setEditor(null);
+                }
+            }
+        }
+
+        // backward compatibility
+        this.defaults = Ext.apply({
+            width: this.defaultWidth,
+            sortable: this.defaultSortable
+        }, this.defaults);
+
+        this.config = config;
+        this.lookup = {};
+
+        for (i = 0, len = config.length; i < len; i++) {
+            c = Ext.applyIf(config[i], this.defaults);
+            
+            // if no id, create one using column's ordinal position
+            if (Ext.isEmpty(c.id)) {
+                c.id = i;
+            }
+            
+            if (!c.isColumn) {
+                var Cls = Ext.grid.Column.types[c.xtype || 'gridcolumn'];
+                c = new Cls(c);
+                config[i] = c;
+            }
+            
+            this.lookup[c.id] = c;
+        }
+        
+        if (!initial) {
+            this.fireEvent('configchange', this);
+        }
+    },
+
+    /**
+     * Returns the column for a specified id.
+     * @param {String} id The column id
+     * @return {Object} the column
+     */
+    getColumnById : function(id) {
+        return this.lookup[id];
+    },
+
+    /**
+     * Returns the index for a specified column id.
+     * @param {String} id The column id
+     * @return {Number} the index, or -1 if not found
+     */
+    getIndexById : function(id) {
+        for (var i = 0, len = this.config.length; i < len; i++) {
+            if (this.config[i].id == id) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Moves a column from one position to another.
+     * @param {Number} oldIndex The index of the column to move.
+     * @param {Number} newIndex The position at which to reinsert the coolumn.
+     */
+    moveColumn : function(oldIndex, newIndex) {
+        var config = this.config,
+            c      = config[oldIndex];
+            
+        config.splice(oldIndex, 1);
+        config.splice(newIndex, 0, c);
+        this.dataMap = null;
+        this.fireEvent("columnmoved", this, oldIndex, newIndex);
+    },
+
+    /**
+     * Returns the number of columns.
+     * @param {Boolean} visibleOnly Optional. Pass as true to only include visible columns.
+     * @return {Number}
+     */
+    getColumnCount : function(visibleOnly) {
+        var length = this.config.length,
+            c = 0,
+            i;
+        
+        if (visibleOnly === true) {
+            for (i = 0; i < length; i++) {
+                if (!this.isHidden(i)) {
+                    c++;
+                }
+            }
+            
+            return c;
+        }
+        
+        return length;
+    },
+
+    /**
+     * Returns the column configs that return true by the passed function that is called
+     * with (columnConfig, index)
+<pre><code>
+// returns an array of column config objects for all hidden columns
+var columns = grid.getColumnModel().getColumnsBy(function(c){
+  return c.hidden;
+});
+</code></pre>
+     * @param {Function} fn A function which, when passed a {@link Ext.grid.Column Column} object, must
+     * return <code>true</code> if the column is to be included in the returned Array.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function
+     * is executed. Defaults to this ColumnModel.
+     * @return {Array} result
+     */
+    getColumnsBy : function(fn, scope) {
+        var config = this.config,
+            length = config.length,
+            result = [],
+            i, c;
+            
+        for (i = 0; i < length; i++){
+            c = config[i];
+            
+            if (fn.call(scope || this, c, i) === true) {
+                result[result.length] = c;
+            }
+        }
+        
+        return result;
+    },
+
+    /**
+     * Returns true if the specified column is sortable.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isSortable : function(col) {
+        return !!this.config[col].sortable;
+    },
+
+    /**
+     * Returns true if the specified column menu is disabled.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isMenuDisabled : function(col) {
+        return !!this.config[col].menuDisabled;
+    },
+
+    /**
+     * Returns the rendering (formatting) function defined for the column.
+     * @param {Number} col The column index.
+     * @return {Function} The function used to render the cell. See {@link #setRenderer}.
+     */
+    getRenderer : function(col) {
+        return this.config[col].renderer || Ext.grid.ColumnModel.defaultRenderer;
+    },
+
+    getRendererScope : function(col) {
+        return this.config[col].scope;
+    },
+
+    /**
+     * Sets the rendering (formatting) function for a column.  See {@link Ext.util.Format} for some
+     * default formatting functions.
+     * @param {Number} col The column index
+     * @param {Function} fn The function to use to process the cell's raw data
+     * to return HTML markup for the grid view. The render function is called with
+     * the following parameters:<ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     * (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record was extracted.</p></li></ul>
+     */
+    setRenderer : function(col, fn) {
+        this.config[col].renderer = fn;
+    },
+
+    /**
+     * Returns the width for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getColumnWidth : function(col) {
+        var width = this.config[col].width;
+        if(typeof width != 'number'){
+            width = this.defaultWidth;
+        }
+        return width;
+    },
+
+    /**
+     * Sets the width for a column.
+     * @param {Number} col The column index
+     * @param {Number} width The new width
+     * @param {Boolean} suppressEvent True to suppress firing the <code>{@link #widthchange}</code>
+     * event. Defaults to false.
+     */
+    setColumnWidth : function(col, width, suppressEvent) {
+        this.config[col].width = width;
+        this.totalWidth = null;
+        
+        if (!suppressEvent) {
+             this.fireEvent("widthchange", this, col, width);
+        }
+    },
+
+    /**
+     * Returns the total width of all columns.
+     * @param {Boolean} includeHidden True to include hidden column widths
+     * @return {Number}
+     */
+    getTotalWidth : function(includeHidden) {
+        if (!this.totalWidth) {
+            this.totalWidth = 0;
+            for (var i = 0, len = this.config.length; i < len; i++) {
+                if (includeHidden || !this.isHidden(i)) {
+                    this.totalWidth += this.getColumnWidth(i);
+                }
+            }
+        }
+        return this.totalWidth;
+    },
+
+    /**
+     * Returns the header for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnHeader : function(col) {
+        return this.config[col].header;
+    },
+
+    /**
+     * Sets the header for a column.
+     * @param {Number} col The column index
+     * @param {String} header The new header
+     */
+    setColumnHeader : function(col, header) {
+        this.config[col].header = header;
+        this.fireEvent("headerchange", this, col, header);
+    },
+
+    /**
+     * Returns the tooltip for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnTooltip : function(col) {
+            return this.config[col].tooltip;
+    },
+    /**
+     * Sets the tooltip for a column.
+     * @param {Number} col The column index
+     * @param {String} tooltip The new tooltip
+     */
+    setColumnTooltip : function(col, tooltip) {
+            this.config[col].tooltip = tooltip;
+    },
+
+    /**
+     * Returns the dataIndex for the specified column.
+<pre><code>
+// Get field name for the column
+var fieldName = grid.getColumnModel().getDataIndex(columnIndex);
+</code></pre>
+     * @param {Number} col The column index
+     * @return {String} The column's dataIndex
+     */
+    getDataIndex : function(col) {
+        return this.config[col].dataIndex;
+    },
+
+    /**
+     * Sets the dataIndex for a column.
+     * @param {Number} col The column index
+     * @param {String} dataIndex The new dataIndex
+     */
+    setDataIndex : function(col, dataIndex) {
+        this.config[col].dataIndex = dataIndex;
+    },
+
+    /**
+     * Finds the index of the first matching column for the given dataIndex.
+     * @param {String} col The dataIndex to find
+     * @return {Number} The column index, or -1 if no match was found
+     */
+    findColumnIndex : function(dataIndex) {
+        var c = this.config;
+        for(var i = 0, len = c.length; i < len; i++){
+            if(c[i].dataIndex == dataIndex){
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /**
+     * Returns true if the cell is editable.
+<pre><code>
+var store = new Ext.data.Store({...});
+var colModel = new Ext.grid.ColumnModel({
+  columns: [...],
+  isCellEditable: function(col, row) {
+    var record = store.getAt(row);
+    if (record.get('readonly')) { // replace with your condition
+      return false;
+    }
+    return Ext.grid.ColumnModel.prototype.isCellEditable.call(this, col, row);
+  }
+});
+var grid = new Ext.grid.GridPanel({
+  store: store,
+  colModel: colModel,
+  ...
+});
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Boolean}
+     */
+    isCellEditable : function(colIndex, rowIndex) {
+        var c = this.config[colIndex],
+            ed = c.editable;
+
+        //force boolean
+        return !!(ed || (!Ext.isDefined(ed) && c.editor));
+    },
+
+    /**
+     * Returns the editor defined for the cell/column.
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor} The {@link Ext.Editor Editor} that was created to wrap
+     * the {@link Ext.form.Field Field} used to edit the cell.
+     */
+    getCellEditor : function(colIndex, rowIndex) {
+        return this.config[colIndex].getCellEditor(rowIndex);
+    },
+
+    /**
+     * Sets if a column is editable.
+     * @param {Number} col The column index
+     * @param {Boolean} editable True if the column is editable
+     */
+    setEditable : function(col, editable) {
+        this.config[col].editable = editable;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#hidden hidden}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isHidden : function(colIndex) {
+        return !!this.config[colIndex].hidden; // ensure returns boolean
+    },
+
+    /**
+     * Returns <tt>true</tt> if the column is <code>{@link Ext.grid.Column#fixed fixed}</code>,
+     * <tt>false</tt> otherwise.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isFixed : function(colIndex) {
+        return !!this.config[colIndex].fixed;
+    },
+
+    /**
+     * Returns true if the column can be resized
+     * @return {Boolean}
+     */
+    isResizable : function(colIndex) {
+        return colIndex >= 0 && this.config[colIndex].resizable !== false && this.config[colIndex].fixed !== true;
+    },
+    
+    /**
+     * Sets if a column is hidden.
+<pre><code>
+myGrid.getColumnModel().setHidden(0, true); // hide column 0 (0 = the first column).
+</code></pre>
+     * @param {Number} colIndex The column index
+     * @param {Boolean} hidden True if the column is hidden
+     */
+    setHidden : function(colIndex, hidden) {
+        var c = this.config[colIndex];
+        if(c.hidden !== hidden){
+            c.hidden = hidden;
+            this.totalWidth = null;
+            this.fireEvent("hiddenchange", this, colIndex, hidden);
+        }
+    },
+
+    /**
+     * Sets the editor for a column and destroys the prior editor.
+     * @param {Number} col The column index
+     * @param {Object} editor The editor object
+     */
+    setEditor : function(col, editor) {
+        this.config[col].setEditor(editor);
+    },
+
+    /**
+     * Destroys this column model by purging any event listeners. Destroys and dereferences all Columns.
+     */
+    destroy : function() {
+        var length = this.config.length,
+            i = 0;
+
+        for (; i < length; i++){
+            this.config[i].destroy(); // Column's destroy encapsulates all cleanup.
+        }
+        delete this.config;
+        delete this.lookup;
+        this.purgeListeners();
+    },
+
+    /**
+     * @private
+     * Setup any saved state for the column, ensures that defaults are applied.
+     */
+    setState : function(col, state) {
+        state = Ext.applyIf(state, this.defaults);
+        Ext.apply(this.config[col], state);
+    }
+});
+
+// private
+Ext.grid.ColumnModel.defaultRenderer = function(value) {
+    if (typeof value == "string" && value.length < 1) {
+        return "&#160;";
+    }
+    return value;
+};/**
+ * @class Ext.grid.AbstractSelectionModel
+ * @extends Ext.util.Observable
+ * Abstract base class for grid SelectionModels.  It provides the interface that should be
+ * implemented by descendant classes.  This class should not be directly instantiated.
+ * @constructor
+ */
+Ext.grid.AbstractSelectionModel = Ext.extend(Ext.util.Observable,  {
+    /**
+     * The GridPanel for which this SelectionModel is handling selection. Read-only.
+     * @type Object
+     * @property grid
+     */
+
+    constructor : function(){
+        this.locked = false;
+        Ext.grid.AbstractSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore Called by the grid automatically. Do not call directly. */
+    init : function(grid){
+        this.grid = grid;
+        if(this.lockOnInit){
+            delete this.lockOnInit;
+            this.locked = false;
+            this.lock();
+        }
+        this.initEvents();
+    },
+
+    /**
+     * Locks the selections.
+     */
+    lock : function(){
+        if(!this.locked){
+            this.locked = true;
+            // If the grid has been set, then the view is already initialized.
+            var g = this.grid;
+            if(g){
+                g.getView().on({
+                    scope: this,
+                    beforerefresh: this.sortUnLock,
+                    refresh: this.sortLock
+                });
+            }else{
+                this.lockOnInit = true;
+            }
+        }
+    },
+
+    // set the lock states before and after a view refresh
+    sortLock : function() {
+        this.locked = true;
+    },
+
+    // set the lock states before and after a view refresh
+    sortUnLock : function() {
+        this.locked = false;
+    },
+
+    /**
+     * Unlocks the selections.
+     */
+    unlock : function(){
+        if(this.locked){
+            this.locked = false;
+            var g = this.grid,
+                gv;
+                
+            // If the grid has been set, then the view is already initialized.
+            if(g){
+                gv = g.getView();
+                gv.un('beforerefresh', this.sortUnLock, this);
+                gv.un('refresh', this.sortLock, this);    
+            }else{
+                delete this.lockOnInit;
+            }
+        }
+    },
+
+    /**
+     * Returns true if the selections are locked.
+     * @return {Boolean}
+     */
+    isLocked : function(){
+        return this.locked;
+    },
+
+    destroy: function(){
+        this.unlock();
+        this.purgeListeners();
+    }
+});/**
+ * @class Ext.grid.RowSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * The default SelectionModel used by {@link Ext.grid.GridPanel}.
+ * It supports multiple selections and keyboard selection/navigation. The objects stored
+ * as selections and returned by {@link #getSelected}, and {@link #getSelections} are
+ * the {@link Ext.data.Record Record}s which provide the data for the selected rows.
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.RowSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    /**
+     * @cfg {Boolean} singleSelect
+     * <tt>true</tt> to allow selection of only one row at a time (defaults to <tt>false</tt>
+     * allowing multiple selections)
+     */
+    singleSelect : false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        this.selections = new Ext.util.MixedCollection(false, function(o){
+            return o.id;
+        });
+
+        this.last = false;
+        this.lastActive = false;
+
+        this.addEvents(
+	        /**
+	         * @event selectionchange
+	         * Fires when the selection changes
+	         * @param {SelectionModel} this
+	         */
+	        'selectionchange',
+	        /**
+	         * @event beforerowselect
+	         * Fires before a row is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The index to be selected
+	         * @param {Boolean} keepExisting False if other selections will be cleared
+	         * @param {Record} record The record to be selected
+	         */
+	        'beforerowselect',
+	        /**
+	         * @event rowselect
+	         * Fires when a row is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected index
+	         * @param {Ext.data.Record} r The selected record
+	         */
+	        'rowselect',
+	        /**
+	         * @event rowdeselect
+	         * Fires when a row is deselected.  To prevent deselection
+	         * {@link Ext.grid.AbstractSelectionModel#lock lock the selections}. 
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex
+	         * @param {Record} record
+	         */
+	        'rowdeselect'
+        );
+        Ext.grid.RowSelectionModel.superclass.constructor.call(this);
+    },
+
+    /**
+     * @cfg {Boolean} moveEditorOnEnter
+     * <tt>false</tt> to turn off moving the editor to the next row down when the enter key is pressed
+     * or the next row up when shift + enter keys are pressed.
+     */
+    // private
+    initEvents : function(){
+
+        if(!this.grid.enableDragDrop && !this.grid.enableDrag){
+            this.grid.on('rowmousedown', this.handleMouseDown, this);
+        }
+
+        this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
+            up: this.onKeyPress, 
+            down: this.onKeyPress,
+            scope: this
+        });
+
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onRefresh,
+            rowupdated: this.onRowUpdated,
+            rowremoved: this.onRemove
+        });
+    },
+    
+    onKeyPress : function(e, name){
+        var up = name == 'up',
+            method = up ? 'selectPrevious' : 'selectNext',
+            add = up ? -1 : 1,
+            last;
+        if(!e.shiftKey || this.singleSelect){
+            this[method](false);
+        }else if(this.last !== false && this.lastActive !== false){
+            last = this.last;
+            this.selectRange(this.last,  this.lastActive + add);
+            this.grid.getView().focusRow(this.lastActive);
+            if(last !== false){
+                this.last = last;
+            }
+        }else{
+           this.selectFirstRow();
+        }
+    },
+
+    // private
+    onRefresh : function(){
+        var ds = this.grid.store,
+            s = this.getSelections(),
+            i = 0,
+            len = s.length, 
+            index, r;
+            
+        this.silent = true;
+        this.clearSelections(true);
+        for(; i < len; i++){
+            r = s[i];
+            if((index = ds.indexOfId(r.id)) != -1){
+                this.selectRow(index, true);
+            }
+        }
+        if(s.length != this.selections.getCount()){
+            this.fireEvent('selectionchange', this);
+        }
+        this.silent = false;
+    },
+
+    // private
+    onRemove : function(v, index, r){
+        if(this.selections.remove(r) !== false){
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    onRowUpdated : function(v, index, r){
+        if(this.isSelected(r)){
+            v.onRowSelect(index);
+        }
+    },
+
+    /**
+     * Select records.
+     * @param {Array} records The records to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectRecords : function(records, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        var ds = this.grid.store,
+            i = 0,
+            len = records.length;
+        for(; i < len; i++){
+            this.selectRow(ds.indexOf(records[i]), true);
+        }
+    },
+
+    /**
+     * Gets the number of selected rows.
+     * @return {Number}
+     */
+    getCount : function(){
+        return this.selections.length;
+    },
+
+    /**
+     * Selects the first row in the grid.
+     */
+    selectFirstRow : function(){
+        this.selectRow(0);
+    },
+
+    /**
+     * Select the last row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     */
+    selectLastRow : function(keepExisting){
+        this.selectRow(this.grid.store.getCount() - 1, keepExisting);
+    },
+
+    /**
+     * Selects the row immediately following the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a next row, else <tt>false</tt>
+     */
+    selectNext : function(keepExisting){
+        if(this.hasNext()){
+            this.selectRow(this.last+1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Selects the row that precedes the last selected row.
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @return {Boolean} <tt>true</tt> if there is a previous row, else <tt>false</tt>
+     */
+    selectPrevious : function(keepExisting){
+        if(this.hasPrevious()){
+            this.selectRow(this.last-1, keepExisting);
+            this.grid.getView().focusRow(this.last);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * Returns true if there is a next record to select
+     * @return {Boolean}
+     */
+    hasNext : function(){
+        return this.last !== false && (this.last+1) < this.grid.store.getCount();
+    },
+
+    /**
+     * Returns true if there is a previous record to select
+     * @return {Boolean}
+     */
+    hasPrevious : function(){
+        return !!this.last;
+    },
+
+
+    /**
+     * Returns the selected records
+     * @return {Array} Array of selected records
+     */
+    getSelections : function(){
+        return [].concat(this.selections.items);
+    },
+
+    /**
+     * Returns the first selected record.
+     * @return {Record}
+     */
+    getSelected : function(){
+        return this.selections.itemAt(0);
+    },
+
+    /**
+     * Calls the passed function with each selection. If the function returns
+     * <tt>false</tt>, iteration is stopped and this function returns
+     * <tt>false</tt>. Otherwise it returns <tt>true</tt>.
+     * @param {Function} fn The function to call upon each iteration. It is passed the selected {@link Ext.data.Record Record}.
+     * @param {Object} scope (optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to this RowSelectionModel.
+     * @return {Boolean} true if all selections were iterated
+     */
+    each : function(fn, scope){
+        var s = this.getSelections(),
+            i = 0,
+            len = s.length;
+            
+        for(; i < len; i++){
+            if(fn.call(scope || this, s[i], i) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Clears all selections if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * @param {Boolean} fast (optional) <tt>true</tt> to bypass the
+     * conditional checks and events described in {@link #deselectRow}.
+     */
+    clearSelections : function(fast){
+        if(this.isLocked()){
+            return;
+        }
+        if(fast !== true){
+            var ds = this.grid.store,
+                s = this.selections;
+            s.each(function(r){
+                this.deselectRow(ds.indexOfId(r.id));
+            }, this);
+            s.clear();
+        }else{
+            this.selections.clear();
+        }
+        this.last = false;
+    },
+
+
+    /**
+     * Selects all rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}. 
+     */
+    selectAll : function(){
+        if(this.isLocked()){
+            return;
+        }
+        this.selections.clear();
+        for(var i = 0, len = this.grid.store.getCount(); i < len; i++){
+            this.selectRow(i, true);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selections.length > 0;
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified row is selected.
+     * @param {Number/Record} index The record or index of the record to check
+     * @return {Boolean}
+     */
+    isSelected : function(index){
+        var r = Ext.isNumber(index) ? this.grid.store.getAt(index) : index;
+        return (r && this.selections.key(r.id) ? true : false);
+    },
+
+    /**
+     * Returns <tt>true</tt> if the specified record id is selected.
+     * @param {String} id The id of record to check
+     * @return {Boolean}
+     */
+    isIdSelected : function(id){
+        return (this.selections.key(id) ? true : false);
+    },
+
+    // private
+    handleMouseDown : function(g, rowIndex, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        var view = this.grid.getView();
+        if(e.shiftKey && !this.singleSelect && this.last !== false){
+            var last = this.last;
+            this.selectRange(last, rowIndex, e.ctrlKey);
+            this.last = last; // reset the last
+            view.focusRow(rowIndex);
+        }else{
+            var isSelected = this.isSelected(rowIndex);
+            if(e.ctrlKey && isSelected){
+                this.deselectRow(rowIndex);
+            }else if(!isSelected || this.getCount() > 1){
+                this.selectRow(rowIndex, e.ctrlKey || e.shiftKey);
+                view.focusRow(rowIndex);
+            }
+        }
+    },
+
+    /**
+     * Selects multiple rows.
+     * @param {Array} rows Array of the indexes of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep
+     * existing selections (defaults to <tt>false</tt>)
+     */
+    selectRows : function(rows, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        for(var i = 0, len = rows.length; i < len; i++){
+            this.selectRow(rows[i], true);
+        }
+    },
+
+    /**
+     * Selects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.
+     * All rows in between startRow and endRow are also selected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     * @param {Boolean} keepExisting (optional) True to retain existing selections
+     */
+    selectRange : function(startRow, endRow, keepExisting){
+        var i;
+        if(this.isLocked()){
+            return;
+        }
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        if(startRow <= endRow){
+            for(i = startRow; i <= endRow; i++){
+                this.selectRow(i, true);
+            }
+        }else{
+            for(i = startRow; i >= endRow; i--){
+                this.selectRow(i, true);
+            }
+        }
+    },
+
+    /**
+     * Deselects a range of rows if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is not locked}.  
+     * All rows in between startRow and endRow are also deselected.
+     * @param {Number} startRow The index of the first row in the range
+     * @param {Number} endRow The index of the last row in the range
+     */
+    deselectRange : function(startRow, endRow, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        for(var i = startRow; i <= endRow; i++){
+            this.deselectRow(i, preventViewNotify);
+        }
+    },
+
+    /**
+     * Selects a row.  Before selecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked} and fires the
+     * {@link #beforerowselect} event.  If these checks are satisfied the row
+     * will be selected and followed up by  firing the {@link #rowselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} row The index of the row to select
+     * @param {Boolean} keepExisting (optional) <tt>true</tt> to keep existing selections
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    selectRow : function(index, keepExisting, preventViewNotify){
+        if(this.isLocked() || (index < 0 || index >= this.grid.store.getCount()) || (keepExisting && this.isSelected(index))){
+            return;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r && this.fireEvent('beforerowselect', this, index, keepExisting, r) !== false){
+            if(!keepExisting || this.singleSelect){
+                this.clearSelections();
+            }
+            this.selections.add(r);
+            this.last = this.lastActive = index;
+            if(!preventViewNotify){
+                this.grid.getView().onRowSelect(index);
+            }
+            if(!this.silent){
+                this.fireEvent('rowselect', this, index, r);
+                this.fireEvent('selectionchange', this);
+            }
+        }
+    },
+
+    /**
+     * Deselects a row.  Before deselecting a row, checks if the selection model
+     * {@link Ext.grid.AbstractSelectionModel#isLocked is locked}.
+     * If this check is satisfied the row will be deselected and followed up by
+     * firing the {@link #rowdeselect} and {@link #selectionchange} events.
+     * @param {Number} row The index of the row to deselect
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     */
+    deselectRow : function(index, preventViewNotify){
+        if(this.isLocked()){
+            return;
+        }
+        if(this.last == index){
+            this.last = false;
+        }
+        if(this.lastActive == index){
+            this.lastActive = false;
+        }
+        var r = this.grid.store.getAt(index);
+        if(r){
+            this.selections.remove(r);
+            if(!preventViewNotify){
+                this.grid.getView().onRowDeselect(index);
+            }
+            this.fireEvent('rowdeselect', this, index, r);
+            this.fireEvent('selectionchange', this);
+        }
+    },
+
+    // private
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    },
+
+    // private
+    onEditorKey : function(field, e){
+        var k = e.getKey(), 
+            newCell, 
+            g = this.grid, 
+            last = g.lastEdit,
+            ed = g.activeEditor,
+            shift = e.shiftKey,
+            ae, last, r, c;
+            
+        if(k == e.TAB){
+            e.stopEvent();
+            ed.completeEdit();
+            if(shift){
+                newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
+            }else{
+                newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
+            }
+        }else if(k == e.ENTER){
+            if(this.moveEditorOnEnter !== false){
+                if(shift){
+                    newCell = g.walkCells(last.row - 1, last.col, -1, this.acceptsNav, this);
+                }else{
+                    newCell = g.walkCells(last.row + 1, last.col, 1, this.acceptsNav, this);
+                }
+            }
+        }
+        if(newCell){
+            r = newCell[0];
+            c = newCell[1];
+
+            this.onEditorSelect(r, last.row);
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+            }
+            g.startEditing(r, c);
+        }
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    },
+    
+    destroy : function(){
+        Ext.destroy(this.rowNav);
+        this.rowNav = null;
+        Ext.grid.RowSelectionModel.superclass.destroy.call(this);
+    }
+});
+/**
+ * @class Ext.grid.Column
+ * <p>This class encapsulates column configuration data to be used in the initialization of a
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>While subclasses are provided to render data in different ways, this class renders a passed
+ * data field unchanged and is usually used for textual columns.</p>
+ */
+Ext.grid.Column = Ext.extend(Ext.util.Observable, {
+    /**
+     * @cfg {Boolean} editable Optional. Defaults to <tt>true</tt>, enabling the configured
+     * <tt>{@link #editor}</tt>.  Set to <tt>false</tt> to initially disable editing on this column.
+     * The initial configuration may be dynamically altered using
+     * {@link Ext.grid.ColumnModel}.{@link Ext.grid.ColumnModel#setEditable setEditable()}.
+     */
+    /**
+     * @cfg {String} id Optional. A name which identifies this column (defaults to the column's initial
+     * ordinal position.) The <tt>id</tt> is used to create a CSS <b>class</b> name which is applied to all
+     * table cells (including headers) in that column (in this context the <tt>id</tt> does not need to be
+     * unique). The class name takes the form of <pre>x-grid3-td-<b>id</b></pre>
+     * Header cells will also receive this class name, but will also have the class <pre>x-grid3-hd</pre>
+     * So, to target header cells, use CSS selectors such as:<pre>.x-grid3-hd-row .x-grid3-td-<b>id</b></pre>
+     * The {@link Ext.grid.GridPanel#autoExpandColumn} grid config option references the column via this
+     * unique identifier.
+     */
+    /**
+     * @cfg {String} header Optional. The header text to be used as innerHTML
+     * (html tags are accepted) to display in the Grid view.  <b>Note</b>: to
+     * have a clickable header with no text displayed use <tt>'&amp;#160;'</tt>.
+     */
+    /**
+     * @cfg {Boolean} groupable Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to disable the header menu item to group by the column selected. Defaults to <tt>true</tt>,
+     * which enables the header menu group option.  Set to <tt>false</tt> to disable (but still show) the
+     * group option in the header menu for the column. See also <code>{@link #groupName}</code>.
+     */
+    /**
+     * @cfg {String} groupName Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text with which to prefix the group field value in the group header line.
+     * See also {@link #groupRenderer} and
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#showGroupName showGroupName}.
+     */
+    /**
+     * @cfg {Function} groupRenderer <p>Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the function used to format the grouping field value for display in the group
+     * {@link #groupName header}.  If a <tt><b>groupRenderer</b></tt> is not specified, the configured
+     * <tt><b>{@link #renderer}</b></tt> will be called; if a <tt><b>{@link #renderer}</b></tt> is also not specified
+     * the new value of the group field will be used.</p>
+     * <p>The called function (either the <tt><b>groupRenderer</b></tt> or <tt><b>{@link #renderer}</b></tt>) will be
+     * passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>v</b> : Object<p class="sub-desc">The new value of the group field.</p></li>
+     * <li><b>unused</b> : undefined<p class="sub-desc">Unused parameter.</p></li>
+     * <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">The column index of the group field.</p></li>
+     * <li><b>ds</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></p>
+     * <p>The function should return a string value.</p>
+     */
+    /**
+     * @cfg {String} emptyGroupText Optional. If the grid is being rendered by an {@link Ext.grid.GroupingView}, this option
+     * may be used to specify the text to display when there is an empty group value. Defaults to the
+     * {@link Ext.grid.GroupingView}.{@link Ext.grid.GroupingView#emptyGroupText emptyGroupText}.
+     */
+    /**
+     * @cfg {String} dataIndex <p><b>Required</b>. The name of the field in the
+     * grid's {@link Ext.data.Store}'s {@link Ext.data.Record} definition from
+     * which to draw the column's value.</p>
+     */
+    /**
+     * @cfg {Number} width
+     * Optional. The initial width in pixels of the column.
+     * The width of each column can also be affected if any of the following are configured:
+     * <div class="mdetail-params"><ul>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#autoExpandColumn autoExpandColumn}</tt></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#forceFit forceFit}</tt>
+     * <div class="sub-desc">
+     * <p>By specifying <tt>forceFit:true</tt>, {@link #fixed non-fixed width} columns will be
+     * re-proportioned (based on the relative initial widths) to fill the width of the grid so
+     * that no horizontal scrollbar is shown.</p>
+     * </div></li>
+     * <li>{@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#autoFill autoFill}</tt></li>
+     * <li>{@link Ext.grid.GridPanel}.<tt>{@link Ext.grid.GridPanel#minColumnWidth minColumnWidth}</tt></li>
+     * <br><p><b>Note</b>: when the width of each column is determined, a space on the right side
+     * is reserved for the vertical scrollbar.  The
+     * {@link Ext.grid.GridView}.<tt>{@link Ext.grid.GridView#scrollOffset scrollOffset}</tt>
+     * can be modified to reduce or eliminate the reserved offset.</p>
+     */
+    /**
+     * @cfg {Boolean} sortable Optional. <tt>true</tt> if sorting is to be allowed on this column.
+     * Defaults to the value of the <code>{@link Ext.grid.ColumnModel#defaultSortable}</code> property.
+     * Whether local/remote sorting is used is specified in <code>{@link Ext.data.Store#remoteSort}</code>.
+     */
+    /**
+     * @cfg {Boolean} fixed Optional. <tt>true</tt> if the column width cannot be changed.  Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} resizable Optional. <tt>false</tt> to disable column resizing. Defaults to <tt>true</tt>.
+     */
+    /**
+     * @cfg {Boolean} menuDisabled Optional. <tt>true</tt> to disable the column menu. Defaults to <tt>false</tt>.
+     */
+    /**
+     * @cfg {Boolean} hidden
+     * Optional. <tt>true</tt> to initially hide this column. Defaults to <tt>false</tt>.
+     * A hidden column {@link Ext.grid.GridPanel#enableColumnHide may be shown via the header row menu}.
+     * If a column is never to be shown, simply do not include this column in the Column Model at all.
+     */
+    /**
+     * @cfg {String} tooltip Optional. A text string to use as the column header's tooltip.  If Quicktips
+     * are enabled, this value will be used as the text of the quick tip, otherwise it will be set as the
+     * header's HTML title attribute. Defaults to ''.
+     */
+    /**
+     * @cfg {Mixed} renderer
+     * <p>For an alternative to specifying a renderer see <code>{@link #xtype}</code></p>
+     * <p>Optional. A renderer is an 'interceptor' method which can be used transform data (value,
+     * appearance, etc.) before it is rendered). This may be specified in either of three ways:
+     * <div class="mdetail-params"><ul>
+     * <li>A renderer function used to return HTML markup for a cell given the cell's data value.</li>
+     * <li>A string which references a property name of the {@link Ext.util.Format} class which
+     * provides a renderer function.</li>
+     * <li>An object specifying both the renderer function, and its execution scope (<tt><b>this</b></tt>
+     * reference) e.g.:<pre style="margin-left:1.2em"><code>
+{
+    fn: this.gridRenderer,
+    scope: this
+}
+</code></pre></li></ul></div>
+     * If not specified, the default renderer uses the raw data value.</p>
+     * <p>For information about the renderer function (passed parameters, etc.), see
+     * {@link Ext.grid.ColumnModel#setRenderer}. An example of specifying renderer function inline:</p><pre><code>
+var companyColumn = {
+   header: 'Company Name',
+   dataIndex: 'company',
+   renderer: function(value, metaData, record, rowIndex, colIndex, store) {
+      // provide the logic depending on business rules
+      // name of your own choosing to manipulate the cell depending upon
+      // the data in the underlying Record object.
+      if (value == 'whatever') {
+          //metaData.css : String : A CSS class name to add to the TD element of the cell.
+          //metaData.attr : String : An html attribute definition string to apply to
+          //                         the data container element within the table
+          //                         cell (e.g. 'style="color:red;"').
+          metaData.css = 'name-of-css-class-you-will-define';
+      }
+      return value;
+   }
+}
+     * </code></pre>
+     * See also {@link #scope}.
+     */
+    /**
+     * @cfg {String} xtype Optional. A String which references a predefined {@link Ext.grid.Column} subclass
+     * type which is preconfigured with an appropriate <code>{@link #renderer}</code> to be easily
+     * configured into a ColumnModel. The predefined {@link Ext.grid.Column} subclass types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>gridcolumn</tt></b> : {@link Ext.grid.Column} (<b>Default</b>)<p class="sub-desc"></p></li>
+     * <li><b><tt>booleancolumn</tt></b> : {@link Ext.grid.BooleanColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>numbercolumn</tt></b> : {@link Ext.grid.NumberColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>datecolumn</tt></b> : {@link Ext.grid.DateColumn}<p class="sub-desc"></p></li>
+     * <li><b><tt>templatecolumn</tt></b> : {@link Ext.grid.TemplateColumn}<p class="sub-desc"></p></li>
+     * </ul></div>
+     * <p>Configuration properties for the specified <code>xtype</code> may be specified with
+     * the Column configuration properties, for example:</p>
+     * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    columns: [{
+        header: 'Last Updated',
+        dataIndex: 'lastChange',
+        width: 85,
+        sortable: true,
+        //renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+        xtype: 'datecolumn', // use xtype instead of renderer
+        format: 'M/d/Y' // configuration property for {@link Ext.grid.DateColumn}
+    }, {
+        ...
+    }]
+});
+     * </code></pre>
+     */
+    /**
+     * @cfg {Object} scope Optional. The scope (<tt><b>this</b></tt> reference) in which to execute the
+     * renderer.  Defaults to the Column configuration object.
+     */
+    /**
+     * @cfg {String} align Optional. Set the CSS text-align property of the column.  Defaults to undefined.
+     */
+    /**
+     * @cfg {String} css Optional. An inline style definition string which is applied to all table cells in the column
+     * (excluding headers). Defaults to undefined.
+     */
+    /**
+     * @cfg {Boolean} hideable Optional. Specify as <tt>false</tt> to prevent the user from hiding this column
+     * (defaults to true).  To disallow column hiding globally for all columns in the grid, use
+     * {@link Ext.grid.GridPanel#enableColumnHide} instead.
+     */
+    /**
+     * @cfg {Ext.form.Field} editor Optional. The {@link Ext.form.Field} to use when editing values in this column
+     * if editing is supported by the grid. See <tt>{@link #editable}</tt> also.
+     */
+
+    /**
+     * @private
+     * @cfg {Boolean} isColumn
+     * Used by ColumnModel setConfig method to avoid reprocessing a Column
+     * if <code>isColumn</code> is not set ColumnModel will recreate a new Ext.grid.Column
+     * Defaults to true.
+     */
+    isColumn : true,
+
+    constructor : function(config){
+        Ext.apply(this, config);
+
+        if(Ext.isString(this.renderer)){
+            this.renderer = Ext.util.Format[this.renderer];
+        }else if(Ext.isObject(this.renderer)){
+            this.scope = this.renderer.scope;
+            this.renderer = this.renderer.fn;
+        }
+        if(!this.scope){
+            this.scope = this;
+        }
+
+        var ed = this.editor;
+        delete this.editor;
+        this.setEditor(ed);
+        this.addEvents(
+            /**
+             * @event click
+             * Fires when this Column is clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'click',
+            /**
+             * @event contextmenu
+             * Fires when this Column is right clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'contextmenu',
+            /**
+             * @event dblclick
+             * Fires when this Column is double clicked.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'dblclick',
+            /**
+             * @event mousedown
+             * Fires when this Column receives a mousedown event.
+             * @param {Column} this
+             * @param {Grid} The owning GridPanel
+             * @param {Number} rowIndex
+             * @param {Ext.EventObject} e
+             */
+            'mousedown'
+        );
+        Ext.grid.Column.superclass.constructor.call(this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        return this.fireEvent(name, this, grid, rowIndex, e);
+    },
+
+    /**
+     * @private
+     * Clean up. Remove any Editor. Remove any listeners.
+     */
+    destroy: function() {
+        if(this.setEditor){
+            this.setEditor(null);
+        }
+        this.purgeListeners();
+    },
+
+    /**
+     * Optional. A function which returns displayable data when passed the following parameters:
+     * <div class="mdetail-params"><ul>
+     * <li><b>value</b> : Object<p class="sub-desc">The data value for the cell.</p></li>
+     * <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     * <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     * <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container
+     * element <i>within</i> the table cell (e.g. 'style="color:red;"').</p></li></ul></p></li>
+     * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record} from which the data was
+     * extracted.</p></li>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">Row index</p></li>
+     * <li><b>colIndex</b> : Number<p class="sub-desc">Column index</p></li>
+     * <li><b>store</b> : Ext.data.Store<p class="sub-desc">The {@link Ext.data.Store} object from which the Record
+     * was extracted.</p></li>
+     * </ul></div>
+     * @property renderer
+     * @type Function
+     */
+    renderer : function(value){
+        return value;
+    },
+
+    // private
+    getEditor: function(rowIndex){
+        return this.editable !== false ? this.editor : null;
+    },
+
+    /**
+     * Sets a new editor for this column.
+     * @param {Ext.Editor/Ext.form.Field} editor The editor to set
+     */
+    setEditor : function(editor){
+        var ed = this.editor;
+        if(ed){
+            if(ed.gridEditor){
+                ed.gridEditor.destroy();
+                delete ed.gridEditor;
+            }else{
+                ed.destroy();
+            }
+        }
+        this.editor = null;
+        if(editor){
+            //not an instance, create it
+            if(!editor.isXType){
+                editor = Ext.create(editor, 'textfield');
+            }
+            this.editor = editor;
+        }
+    },
+
+    /**
+     * Returns the {@link Ext.Editor editor} defined for this column that was created to wrap the {@link Ext.form.Field Field}
+     * used to edit the cell.
+     * @param {Number} rowIndex The row index
+     * @return {Ext.Editor}
+     */
+    getCellEditor: function(rowIndex){
+        var ed = this.getEditor(rowIndex);
+        if(ed){
+            if(!ed.startEdit){
+                if(!ed.gridEditor){
+                    ed.gridEditor = new Ext.grid.GridEditor(ed);
+                }
+                ed = ed.gridEditor;
+            }
+        }
+        return ed;
+    }
+});
+
+/**
+ * @class Ext.grid.BooleanColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders boolean data fields.  See the {@link Ext.grid.Column#xtype xtype}
+ * config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.BooleanColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} trueText
+     * The string returned by the renderer when the column value is not falsy (defaults to <tt>'true'</tt>).
+     */
+    trueText: 'true',
+    /**
+     * @cfg {String} falseText
+     * The string returned by the renderer when the column value is falsy (but not undefined) (defaults to
+     * <tt>'false'</tt>).
+     */
+    falseText: 'false',
+    /**
+     * @cfg {String} undefinedText
+     * The string returned by the renderer when the column value is undefined (defaults to <tt>'&amp;#160;'</tt>).
+     */
+    undefinedText: '&#160;',
+
+    constructor: function(cfg){
+        Ext.grid.BooleanColumn.superclass.constructor.call(this, cfg);
+        var t = this.trueText, f = this.falseText, u = this.undefinedText;
+        this.renderer = function(v){
+            if(v === undefined){
+                return u;
+            }
+            if(!v || v === 'false'){
+                return f;
+            }
+            return t;
+        };
+    }
+});
+
+/**
+ * @class Ext.grid.NumberColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a numeric data field according to a {@link #format} string.  See the
+ * {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more details.</p>
+ */
+Ext.grid.NumberColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Ext.util.Format#number} to format a numeric value for this Column
+     * (defaults to <tt>'0,000.00'</tt>).
+     */
+    format : '0,000.00',
+    constructor: function(cfg){
+        Ext.grid.NumberColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.numberRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.DateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a passed date according to the default locale, or a configured
+ * {@link #format}. See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column}
+ * for more details.</p>
+ */
+Ext.grid.DateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} format
+     * A formatting string as used by {@link Date#format} to format a Date for this Column
+     * (defaults to <tt>'m/d/Y'</tt>).
+     */
+    format : 'm/d/Y',
+    constructor: function(cfg){
+        Ext.grid.DateColumn.superclass.constructor.call(this, cfg);
+        this.renderer = Ext.util.Format.dateRenderer(this.format);
+    }
+});
+
+/**
+ * @class Ext.grid.TemplateColumn
+ * @extends Ext.grid.Column
+ * <p>A Column definition class which renders a value by processing a {@link Ext.data.Record Record}'s
+ * {@link Ext.data.Record#data data} using a {@link #tpl configured} {@link Ext.XTemplate XTemplate}.
+ * See the {@link Ext.grid.Column#xtype xtype} config option of {@link Ext.grid.Column} for more
+ * details.</p>
+ */
+Ext.grid.TemplateColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String/XTemplate} tpl
+     * An {@link Ext.XTemplate XTemplate}, or an XTemplate <i>definition string</i> to use to process a
+     * {@link Ext.data.Record Record}'s {@link Ext.data.Record#data data} to produce a column's rendered value.
+     */
+    constructor: function(cfg){
+        Ext.grid.TemplateColumn.superclass.constructor.call(this, cfg);
+        var tpl = (!Ext.isPrimitive(this.tpl) && this.tpl.compile) ? this.tpl : new Ext.XTemplate(this.tpl);
+        this.renderer = function(value, p, r){
+            return tpl.apply(r.data);
+        };
+        this.tpl = tpl;
+    }
+});
+
+/**
+ * @class Ext.grid.ActionColumn
+ * @extends Ext.grid.Column
+ * <p>A Grid column type which renders an icon, or a series of icons in a grid cell, and offers a scoped click
+ * handler for each icon. Example usage:</p>
+<pre><code>
+new Ext.grid.GridPanel({
+    store: myStore,
+    columns: [
+        {
+            xtype: 'actioncolumn',
+            width: 50,
+            items: [
+                {
+                    icon   : 'sell.gif',                // Use a URL in the icon config
+                    tooltip: 'Sell stock',
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Sell " + rec.get('company'));
+                    }
+                },
+                {
+                    getClass: function(v, meta, rec) {  // Or return a class from a function
+                        if (rec.get('change') < 0) {
+                            this.items[1].tooltip = 'Do not buy!';
+                            return 'alert-col';
+                        } else {
+                            this.items[1].tooltip = 'Buy stock';
+                            return 'buy-col';
+                        }
+                    },
+                    handler: function(grid, rowIndex, colIndex) {
+                        var rec = store.getAt(rowIndex);
+                        alert("Buy " + rec.get('company'));
+                    }
+                }
+            ]
+        }
+        //any other columns here
+    ]
+});
+</pre></code>
+ * <p>The action column can be at any index in the columns array, and a grid can have any number of
+ * action columns. </p>
+ */
+Ext.grid.ActionColumn = Ext.extend(Ext.grid.Column, {
+    /**
+     * @cfg {String} icon
+     * The URL of an image to display as the clickable element in the column. 
+     * Optional - defaults to <code>{@link Ext#BLANK_IMAGE_URL Ext.BLANK_IMAGE_URL}</code>.
+     */
+    /**
+     * @cfg {String} iconCls
+     * A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a <code>{@link #getClass}</code> function.
+     */
+    /**
+     * @cfg {Function} handler A function called when the icon is clicked.
+     * The handler is passed the following parameters:<div class="mdetail-params"><ul>
+     * <li><code>grid</code> : GridPanel<div class="sub-desc">The owning GridPanel.</div></li>
+     * <li><code>rowIndex</code> : Number<div class="sub-desc">The row index clicked on.</div></li>
+     * <li><code>colIndex</code> : Number<div class="sub-desc">The column index clicked on.</div></li>
+     * <li><code>item</code> : Object<div class="sub-desc">The clicked item (or this Column if multiple 
+     * {@link #items} were not configured).</div></li>
+     * <li><code>e</code> : Event<div class="sub-desc">The click event.</div></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
+     * and <code>{@link #getClass}</code> fuctions are executed. Defaults to this Column.
+     */
+    /**
+     * @cfg {String} tooltip A tooltip message to be displayed on hover. {@link Ext.QuickTips#init Ext.QuickTips} must have 
+     * been initialized.
+     */
+    /**
+     * @cfg {Boolean} stopSelection Defaults to <code>true</code>. Prevent grid <i>row</i> selection upon mousedown.
+     */
+    /**
+     * @cfg {Function} getClass A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<div class="mdetail-params"><ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div>
+     */
+    /**
+     * @cfg {Array} items An Array which may contain multiple icon definitions, each element of which may contain:
+     * <div class="mdetail-params"><ul>
+     * <li><code>icon</code> : String<div class="sub-desc">The url of an image to display as the clickable element 
+     * in the column.</div></li>
+     * <li><code>iconCls</code> : String<div class="sub-desc">A CSS class to apply to the icon image.
+     * To determine the class dynamically, configure the item with a <code>getClass</code> function.</div></li>
+     * <li><code>getClass</code> : Function<div class="sub-desc">A function which returns the CSS class to apply to the icon image.
+     * The function is passed the following parameters:<ul>
+     *     <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
+     *     <li><b>metadata</b> : Object<p class="sub-desc">An object in which you may set the following attributes:<ul>
+     *         <li><b>css</b> : String<p class="sub-desc">A CSS class name to add to the cell's TD element.</p></li>
+     *         <li><b>attr</b> : String<p class="sub-desc">An HTML attribute definition string to apply to the data container element <i>within</i> the table cell
+     *         (e.g. 'style="color:red;"').</p></li>
+     *     </ul></p></li>
+     *     <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data.</p></li>
+     *     <li><b>rowIndex</b> : Number<p class="sub-desc">The row index..</p></li>
+     *     <li><b>colIndex</b> : Number<p class="sub-desc">The column index.</p></li>
+     *     <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
+     * </ul></div></li>
+     * <li><code>handler</code> : Function<div class="sub-desc">A function called when the icon is clicked.</div></li>
+     * <li><code>scope</code> : Scope<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the 
+     * <code>handler</code> and <code>getClass</code> functions are executed. Fallback defaults are this Column's
+     * configured scope, then this Column.</div></li>
+     * <li><code>tooltip</code> : String<div class="sub-desc">A tooltip message to be displayed on hover. 
+     * {@link Ext.QuickTips#init Ext.QuickTips} must have been initialized.</div></li>
+     * </ul></div>
+     */
+    header: '&#160;',
+
+    actionIdRe: /x-action-col-(\d+)/,
+    
+    /**
+     * @cfg {String} altText The alt text to use for the image element. Defaults to <tt>''</tt>.
+     */
+    altText: '',
+
+    constructor: function(cfg) {
+        var me = this,
+            items = cfg.items || (me.items = [me]),
+            l = items.length,
+            i,
+            item;
+
+        Ext.grid.ActionColumn.superclass.constructor.call(me, cfg);
+
+//      Renderer closure iterates through items creating an <img> element for each and tagging with an identifying 
+//      class name x-action-col-{n}
+        me.renderer = function(v, meta) {
+//          Allow a configured renderer to create initial value (And set the other values in the "metadata" argument!)
+            v = Ext.isFunction(cfg.renderer) ? cfg.renderer.apply(this, arguments)||'' : '';
+
+            meta.css += ' x-action-col-cell';
+            for (i = 0; i < l; i++) {
+                item = items[i];
+                v += '<img alt="' + (item.altText || me.altText) + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
+                    '" class="x-action-col-icon x-action-col-' + String(i) + ' ' + (item.iconCls || '') +
+                    ' ' + (Ext.isFunction(item.getClass) ? item.getClass.apply(item.scope||this.scope||this, arguments) : '') + '"' +
+                    ((item.tooltip) ? ' ext:qtip="' + item.tooltip + '"' : '') + ' />';
+            }
+            return v;
+        };
+    },
+
+    destroy: function() {
+        delete this.items;
+        delete this.renderer;
+        return Ext.grid.ActionColumn.superclass.destroy.apply(this, arguments);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     * Also fires any configured click handlers. By default, cancels the mousedown event to prevent selection.
+     * Returns the event handler's status to allow cancelling of GridView's bubbling process.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        var m = e.getTarget().className.match(this.actionIdRe),
+            item, fn;
+        if (m && (item = this.items[parseInt(m[1], 10)])) {
+            if (name == 'click') {
+                (fn = item.handler || this.handler) && fn.call(item.scope||this.scope||this, grid, rowIndex, colIndex, item, e);
+            } else if ((name == 'mousedown') && (item.stopSelection !== false)) {
+                return false;
+            }
+        }
+        return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments);
+    }
+});
+
+/*
+ * @property types
+ * @type Object
+ * @member Ext.grid.Column
+ * @static
+ * <p>An object containing predefined Column classes keyed by a mnemonic code which may be referenced
+ * by the {@link Ext.grid.ColumnModel#xtype xtype} config option of ColumnModel.</p>
+ * <p>This contains the following properties</p><div class="mdesc-details"><ul>
+ * <li>gridcolumn : <b>{@link Ext.grid.Column Column constructor}</b></li>
+ * <li>booleancolumn : <b>{@link Ext.grid.BooleanColumn BooleanColumn constructor}</b></li>
+ * <li>numbercolumn : <b>{@link Ext.grid.NumberColumn NumberColumn constructor}</b></li>
+ * <li>datecolumn : <b>{@link Ext.grid.DateColumn DateColumn constructor}</b></li>
+ * <li>templatecolumn : <b>{@link Ext.grid.TemplateColumn TemplateColumn constructor}</b></li>
+ * </ul></div>
+ */
+Ext.grid.Column.types = {
+    gridcolumn : Ext.grid.Column,
+    booleancolumn: Ext.grid.BooleanColumn,
+    numbercolumn: Ext.grid.NumberColumn,
+    datecolumn: Ext.grid.DateColumn,
+    templatecolumn: Ext.grid.TemplateColumn,
+    actioncolumn: Ext.grid.ActionColumn
+};/**
+ * @class Ext.grid.RowNumberer
+ * This is a utility class that can be passed into a {@link Ext.grid.ColumnModel} as a column config that provides
+ * an automatic row numbering column.
+ * <br>Usage:<br>
+ <pre><code>
+ // This is a typical column config with the first column providing row numbers
+ var colModel = new Ext.grid.ColumnModel([
+    new Ext.grid.RowNumberer(),
+    {header: "Name", width: 80, sortable: true},
+    {header: "Code", width: 50, sortable: true},
+    {header: "Description", width: 200, sortable: true}
+ ]);
+ </code></pre>
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.RowNumberer = Ext.extend(Object, {
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the row
+     * number column (defaults to '').
+     */
+    header: "",
+    /**
+     * @cfg {Number} width The default width in pixels of the row number column (defaults to 23).
+     */
+    width: 23,
+    /**
+     * @cfg {Boolean} sortable True if the row number column is sortable (defaults to false).
+     * @hide
+     */
+    sortable: false,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+        if(this.rowspan){
+            this.renderer = this.renderer.createDelegate(this);
+        }
+    },
+
+    // private
+    fixed:true,
+    hideable: false,
+    menuDisabled:true,
+    dataIndex: '',
+    id: 'numberer',
+    rowspan: undefined,
+
+    // private
+    renderer : function(v, p, record, rowIndex){
+        if(this.rowspan){
+            p.cellAttr = 'rowspan="'+this.rowspan+'"';
+        }
+        return rowIndex+1;
+    }
+});/**
+ * @class Ext.grid.CheckboxSelectionModel
+ * @extends Ext.grid.RowSelectionModel
+ * A custom selection model that renders a column of checkboxes that can be toggled to select or deselect rows.
+ * @constructor
+ * @param {Object} config The configuration options
+ */
+Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
+
+    /**
+     * @cfg {Boolean} checkOnly <tt>true</tt> if rows can only be selected by clicking on the
+     * checkbox column (defaults to <tt>false</tt>).
+     */
+    /**
+     * @cfg {String} header Any valid text or HTML fragment to display in the header cell for the
+     * checkbox column.  Defaults to:<pre><code>
+     * '&lt;div class="x-grid3-hd-checker">&#38;#160;&lt;/div>'</tt>
+     * </code></pre>
+     * The default CSS class of <tt>'x-grid3-hd-checker'</tt> displays a checkbox in the header
+     * and provides support for automatic check all/none behavior on header click. This string
+     * can be replaced by any valid HTML fragment, including a simple text string (e.g.,
+     * <tt>'Select Rows'</tt>), but the automatic check all/none behavior will only work if the
+     * <tt>'x-grid3-hd-checker'</tt> class is supplied.
+     */
+    header : '<div class="x-grid3-hd-checker">&#160;</div>',
+    /**
+     * @cfg {Number} width The default width in pixels of the checkbox column (defaults to <tt>20</tt>).
+     */
+    width : 20,
+    /**
+     * @cfg {Boolean} sortable <tt>true</tt> if the checkbox column is sortable (defaults to
+     * <tt>false</tt>).
+     */
+    sortable : false,
+
+    // private
+    menuDisabled : true,
+    fixed : true,
+    hideable: false,
+    dataIndex : '',
+    id : 'checker',
+    isColumn: true, // So that ColumnModel doesn't feed this through the Column constructor
+
+    constructor : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this, arguments);
+        if(this.checkOnly){
+            this.handleMouseDown = Ext.emptyFn;
+        }
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
+        this.grid.on('render', function(){
+            Ext.fly(this.grid.getView().innerHd).on('mousedown', this.onHdMouseDown, this);
+        }, this);
+    },
+
+    /**
+     * @private
+     * Process and refire events routed from the GridView's processEvent method.
+     */
+    processEvent : function(name, e, grid, rowIndex, colIndex){
+        if (name == 'mousedown') {
+            this.onMouseDown(e, e.getTarget());
+            return false;
+        } else {
+            return Ext.grid.Column.prototype.processEvent.apply(this, arguments);
+        }
+    },
+
+    // private
+    onMouseDown : function(e, t){
+        if(e.button === 0 && t.className == 'x-grid3-row-checker'){ // Only fire if left-click
+            e.stopEvent();
+            var row = e.getTarget('.x-grid3-row');
+            if(row){
+                var index = row.rowIndex;
+                if(this.isSelected(index)){
+                    this.deselectRow(index);
+                }else{
+                    this.selectRow(index, true);
+                    this.grid.getView().focusRow(index);
+                }
+            }
+        }
+    },
+
+    // private
+    onHdMouseDown : function(e, t) {
+        if(t.className == 'x-grid3-hd-checker'){
+            e.stopEvent();
+            var hd = Ext.fly(t.parentNode);
+            var isChecked = hd.hasClass('x-grid3-hd-checker-on');
+            if(isChecked){
+                hd.removeClass('x-grid3-hd-checker-on');
+                this.clearSelections();
+            }else{
+                hd.addClass('x-grid3-hd-checker-on');
+                this.selectAll();
+            }
+        }
+    },
+
+    // private
+    renderer : function(v, p, record){
+        return '<div class="x-grid3-row-checker">&#160;</div>';
+    },
+    
+    onEditorSelect: function(row, lastRow){
+        if(lastRow != row && !this.checkOnly){
+            this.selectRow(row); // *** highlight newly-selected cell and update selection
+        }
+    }
+});/**
+ * @class Ext.grid.CellSelectionModel
+ * @extends Ext.grid.AbstractSelectionModel
+ * This class provides the basic implementation for <i>single</i> <b>cell</b> selection in a grid.
+ * The object stored as the selection contains the following properties:
+ * <div class="mdetail-params"><ul>
+ * <li><b>cell</b> : see {@link #getSelectedCell} 
+ * <li><b>record</b> : Ext.data.record The {@link Ext.data.Record Record}
+ * which provides the data for the row containing the selection</li>
+ * </ul></div>
+ * @constructor
+ * @param {Object} config The object containing the configuration of this model.
+ */
+Ext.grid.CellSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel,  {
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+
+	    this.selection = null;
+	
+	    this.addEvents(
+	        /**
+	         * @event beforecellselect
+	         * Fires before a cell is selected, return false to cancel the selection.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "beforecellselect",
+	        /**
+	         * @event cellselect
+	         * Fires when a cell is selected.
+	         * @param {SelectionModel} this
+	         * @param {Number} rowIndex The selected row index
+	         * @param {Number} colIndex The selected cell index
+	         */
+	        "cellselect",
+	        /**
+	         * @event selectionchange
+	         * Fires when the active selection changes.
+	         * @param {SelectionModel} this
+	         * @param {Object} selection null for no selection or an object with two properties
+	         * <div class="mdetail-params"><ul>
+	         * <li><b>cell</b> : see {@link #getSelectedCell} 
+	         * <li><b>record</b> : Ext.data.record<p class="sub-desc">The {@link Ext.data.Record Record}
+	         * which provides the data for the row containing the selection</p></li>
+	         * </ul></div>
+	         */
+	        "selectionchange"
+	    );
+	
+	    Ext.grid.CellSelectionModel.superclass.constructor.call(this);
+    },
+
+    /** @ignore */
+    initEvents : function(){
+        this.grid.on('cellmousedown', this.handleMouseDown, this);
+        this.grid.on(Ext.EventManager.getKeyEvent(), this.handleKeyDown, this);
+        this.grid.getView().on({
+            scope: this,
+            refresh: this.onViewChange,
+            rowupdated: this.onRowUpdated,
+            beforerowremoved: this.clearSelections,
+            beforerowsinserted: this.clearSelections
+        });
+        if(this.grid.isEditor){
+            this.grid.on('beforeedit', this.beforeEdit,  this);
+        }
+    },
+
+	//private
+    beforeEdit : function(e){
+        this.select(e.row, e.column, false, true, e.record);
+    },
+
+	//private
+    onRowUpdated : function(v, index, r){
+        if(this.selection && this.selection.record == r){
+            v.onCellSelect(index, this.selection.cell[1]);
+        }
+    },
+
+	//private
+    onViewChange : function(){
+        this.clearSelections(true);
+    },
+
+	/**
+     * Returns an array containing the row and column indexes of the currently selected cell
+     * (e.g., [0, 0]), or null if none selected. The array has elements:
+     * <div class="mdetail-params"><ul>
+     * <li><b>rowIndex</b> : Number<p class="sub-desc">The index of the selected row</p></li>
+     * <li><b>cellIndex</b> : Number<p class="sub-desc">The index of the selected cell. 
+     * Due to possible column reordering, the cellIndex should <b>not</b> be used as an
+     * index into the Record's data. Instead, use the cellIndex to determine the <i>name</i>
+     * of the selected cell and use the field name to retrieve the data value from the record:<pre><code>
+// get name
+var fieldName = grid.getColumnModel().getDataIndex(cellIndex);
+// get data value based on name
+var data = record.get(fieldName);
+     * </code></pre></p></li>
+     * </ul></div>
+     * @return {Array} An array containing the row and column indexes of the selected cell, or null if none selected.
+	 */
+    getSelectedCell : function(){
+        return this.selection ? this.selection.cell : null;
+    },
+
+    /**
+     * If anything is selected, clears all selections and fires the selectionchange event.
+     * @param {Boolean} preventNotify <tt>true</tt> to prevent the gridview from
+     * being notified about the change.
+     */
+    clearSelections : function(preventNotify){
+        var s = this.selection;
+        if(s){
+            if(preventNotify !== true){
+                this.grid.view.onCellDeselect(s.cell[0], s.cell[1]);
+            }
+            this.selection = null;
+            this.fireEvent("selectionchange", this, null);
+        }
+    },
+
+    /**
+     * Returns <tt>true</tt> if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selection ? true : false;
+    },
+
+    /** @ignore */
+    handleMouseDown : function(g, row, cell, e){
+        if(e.button !== 0 || this.isLocked()){
+            return;
+        }
+        this.select(row, cell);
+    },
+
+    /**
+     * Selects a cell.  Before selecting a cell, fires the
+     * {@link #beforecellselect} event.  If this check is satisfied the cell
+     * will be selected and followed up by  firing the {@link #cellselect} and
+     * {@link #selectionchange} events.
+     * @param {Number} rowIndex The index of the row to select
+     * @param {Number} colIndex The index of the column to select
+     * @param {Boolean} preventViewNotify (optional) Specify <tt>true</tt> to
+     * prevent notifying the view (disables updating the selected appearance)
+     * @param {Boolean} preventFocus (optional) Whether to prevent the cell at
+     * the specified rowIndex / colIndex from being focused.
+     * @param {Ext.data.Record} r (optional) The record to select
+     */
+    select : function(rowIndex, colIndex, preventViewNotify, preventFocus, /*internal*/ r){
+        if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){
+            this.clearSelections();
+            r = r || this.grid.store.getAt(rowIndex);
+            this.selection = {
+                record : r,
+                cell : [rowIndex, colIndex]
+            };
+            if(!preventViewNotify){
+                var v = this.grid.getView();
+                v.onCellSelect(rowIndex, colIndex);
+                if(preventFocus !== true){
+                    v.focusCell(rowIndex, colIndex);
+                }
+            }
+            this.fireEvent("cellselect", this, rowIndex, colIndex);
+            this.fireEvent("selectionchange", this, this.selection);
+        }
+    },
+
+	//private
+    isSelectable : function(rowIndex, colIndex, cm){
+        return !cm.isHidden(colIndex);
+    },
+    
+    // private
+    onEditorKey: function(field, e){
+        if(e.getKey() == e.TAB){
+            this.handleKeyDown(e);
+        }
+    },
+
+    /** @ignore */
+    handleKeyDown : function(e){
+        if(!e.isNavKeyPress()){
+            return;
+        }
+        
+        var k = e.getKey(),
+            g = this.grid,
+            s = this.selection,
+            sm = this,
+            walk = function(row, col, step){
+                return g.walkCells(
+                    row,
+                    col,
+                    step,
+                    g.isEditor && g.editing ? sm.acceptsNav : sm.isSelectable, // *** handle tabbing while editorgrid is in edit mode
+                    sm
+                );
+            },
+            cell, newCell, r, c, ae;
+
+        switch(k){
+            case e.ESC:
+            case e.PAGE_UP:
+            case e.PAGE_DOWN:
+                // do nothing
+                break;
+            default:
+                // *** call e.stopEvent() only for non ESC, PAGE UP/DOWN KEYS
+                e.stopEvent();
+                break;
+        }
+
+        if(!s){
+            cell = walk(0, 0, 1); // *** use private walk() function defined above
+            if(cell){
+                this.select(cell[0], cell[1]);
+            }
+            return;
+        }
+
+        cell = s.cell;  // currently selected cell
+        r = cell[0];    // current row
+        c = cell[1];    // current column
+        
+        switch(k){
+            case e.TAB:
+                if(e.shiftKey){
+                    newCell = walk(r, c - 1, -1);
+                }else{
+                    newCell = walk(r, c + 1, 1);
+                }
+                break;
+            case e.DOWN:
+                newCell = walk(r + 1, c, 1);
+                break;
+            case e.UP:
+                newCell = walk(r - 1, c, -1);
+                break;
+            case e.RIGHT:
+                newCell = walk(r, c + 1, 1);
+                break;
+            case e.LEFT:
+                newCell = walk(r, c - 1, -1);
+                break;
+            case e.ENTER:
+                if (g.isEditor && !g.editing) {
+                    g.startEditing(r, c);
+                    return;
+                }
+                break;
+        }
+
+        if(newCell){
+            // *** reassign r & c variables to newly-selected cell's row and column
+            r = newCell[0];
+            c = newCell[1];
+
+            this.select(r, c); // *** highlight newly-selected cell and update selection
+
+            if(g.isEditor && g.editing){ // *** handle tabbing while editorgrid is in edit mode
+                ae = g.activeEditor;
+                if(ae && ae.field.triggerBlur){
+                    // *** if activeEditor is a TriggerField, explicitly call its triggerBlur() method
+                    ae.field.triggerBlur();
+                }
+                g.startEditing(r, c);
+            }
+        }
+    },
+
+    acceptsNav : function(row, col, cm){
+        return !cm.isHidden(col) && cm.isCellEditable(col, row);
+    }
+});/**
+ * @class Ext.grid.EditorGridPanel
+ * @extends Ext.grid.GridPanel
+ * <p>This class extends the {@link Ext.grid.GridPanel GridPanel Class} to provide cell editing
+ * on selected {@link Ext.grid.Column columns}. The editable columns are specified by providing
+ * an {@link Ext.grid.ColumnModel#editor editor} in the {@link Ext.grid.Column column configuration}.</p>
+ * <p>Editability of columns may be controlled programatically by inserting an implementation
+ * of {@link Ext.grid.ColumnModel#isCellEditable isCellEditable} into the
+ * {@link Ext.grid.ColumnModel ColumnModel}.</p>
+ * <p>Editing is performed on the value of the <i>field</i> specified by the column's
+ * <tt>{@link Ext.grid.ColumnModel#dataIndex dataIndex}</tt> in the backing {@link Ext.data.Store Store}
+ * (so if you are using a {@link Ext.grid.ColumnModel#setRenderer renderer} in order to display
+ * transformed data, this must be accounted for).</p>
+ * <p>If a value-to-description mapping is used to render a column, then a {@link Ext.form.Field#ComboBox ComboBox}
+ * which uses the same {@link Ext.form.Field#valueField value}-to-{@link Ext.form.Field#displayFieldField description}
+ * mapping would be an appropriate editor.</p>
+ * If there is a more complex mismatch between the visible data in the grid, and the editable data in
+ * the {@link Edt.data.Store Store}, then code to transform the data both before and after editing can be
+ * injected using the {@link #beforeedit} and {@link #afteredit} events.
+ * @constructor
+ * @param {Object} config The config object
+ * @xtype editorgrid
+ */
+Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, {
+    /**
+     * @cfg {Number} clicksToEdit
+     * <p>The number of clicks on a cell required to display the cell's editor (defaults to 2).</p>
+     * <p>Setting this option to 'auto' means that mousedown <i>on the selected cell</i> starts
+     * editing that cell.</p>
+     */
+    clicksToEdit: 2,
+
+    /**
+    * @cfg {Boolean} forceValidation
+    * True to force validation even if the value is unmodified (defaults to false)
+    */
+    forceValidation: false,
+
+    // private
+    isEditor : true,
+    // private
+    detectEdit: false,
+
+    /**
+     * @cfg {Boolean} autoEncode
+     * True to automatically HTML encode and decode values pre and post edit (defaults to false)
+     */
+    autoEncode : false,
+
+    /**
+     * @cfg {Boolean} trackMouseOver @hide
+     */
+    // private
+    trackMouseOver: false, // causes very odd FF errors
+
+    // private
+    initComponent : function(){
+        Ext.grid.EditorGridPanel.superclass.initComponent.call(this);
+
+        if(!this.selModel){
+            /**
+             * @cfg {Object} selModel Any subclass of AbstractSelectionModel that will provide the selection model for
+             * the grid (defaults to {@link Ext.grid.CellSelectionModel} if not specified).
+             */
+            this.selModel = new Ext.grid.CellSelectionModel();
+        }
+
+        this.activeEditor = null;
+
+        this.addEvents(
+            /**
+             * @event beforeedit
+             * Fires before cell editing is triggered. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value for the field being edited.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "beforeedit",
+            /**
+             * @event afteredit
+             * Fires after a cell is edited. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * </ul>
+             *
+             * <pre><code>
+grid.on('afteredit', afterEdit, this );
+
+function afterEdit(e) {
+    // execute an XHR to send/commit data to the server, in callback do (if successful):
+    e.record.commit();
+};
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "afteredit",
+            /**
+             * @event validateedit
+             * Fires after a cell is edited, but before the value is set in the record. Return false
+             * to cancel the change. The edit event object has the following properties <br />
+             * <ul style="padding:5px;padding-left:16px;">
+             * <li>grid - This grid</li>
+             * <li>record - The record being edited</li>
+             * <li>field - The field name being edited</li>
+             * <li>value - The value being set</li>
+             * <li>originalValue - The original value for the field, before the edit.</li>
+             * <li>row - The grid row index</li>
+             * <li>column - The grid column index</li>
+             * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
+             * </ul>
+             * Usage example showing how to remove the red triangle (dirty record indicator) from some
+             * records (not all).  By observing the grid's validateedit event, it can be cancelled if
+             * the edit occurs on a targeted row (for example) and then setting the field's new value
+             * in the Record directly:
+             * <pre><code>
+grid.on('validateedit', function(e) {
+  var myTargetRow = 6;
+
+  if (e.row == myTargetRow) {
+    e.cancel = true;
+    e.record.data[e.field] = e.value;
+  }
+});
+             * </code></pre>
+             * @param {Object} e An edit event (see above for description)
+             */
+            "validateedit"
+        );
+    },
+
+    // private
+    initEvents : function(){
+        Ext.grid.EditorGridPanel.superclass.initEvents.call(this);
+
+        this.getGridEl().on('mousewheel', this.stopEditing.createDelegate(this, [true]), this);
+        this.on('columnresize', this.stopEditing, this, [true]);
+
+        if(this.clicksToEdit == 1){
+            this.on("cellclick", this.onCellDblClick, this);
+        }else {
+            var view = this.getView();
+            if(this.clicksToEdit == 'auto' && view.mainBody){
+                view.mainBody.on('mousedown', this.onAutoEditClick, this);
+            }
+            this.on('celldblclick', this.onCellDblClick, this);
+        }
+    },
+
+    onResize : function(){
+        Ext.grid.EditorGridPanel.superclass.onResize.apply(this, arguments);
+        var ae = this.activeEditor;
+        if(this.editing && ae){
+            ae.realign(true);
+        }
+    },
+
+    // private
+    onCellDblClick : function(g, row, col){
+        this.startEditing(row, col);
+    },
+
+    // private
+    onAutoEditClick : function(e, t){
+        if(e.button !== 0){
+            return;
+        }
+        var row = this.view.findRowIndex(t),
+            col = this.view.findCellIndex(t);
+        if(row !== false && col !== false){
+            this.stopEditing();
+            if(this.selModel.getSelectedCell){ // cell sm
+                var sc = this.selModel.getSelectedCell();
+                if(sc && sc[0] === row && sc[1] === col){
+                    this.startEditing(row, col);
+                }
+            }else{
+                if(this.selModel.isSelected(row)){
+                    this.startEditing(row, col);
+                }
+            }
+        }
+    },
+
+    // private
+    onEditComplete : function(ed, value, startValue){
+        this.editing = false;
+        this.lastActiveEditor = this.activeEditor;
+        this.activeEditor = null;
+
+        var r = ed.record,
+            field = this.colModel.getDataIndex(ed.col);
+        value = this.postEditValue(value, startValue, r, field);
+        if(this.forceValidation === true || String(value) !== String(startValue)){
+            var e = {
+                grid: this,
+                record: r,
+                field: field,
+                originalValue: startValue,
+                value: value,
+                row: ed.row,
+                column: ed.col,
+                cancel:false
+            };
+            if(this.fireEvent("validateedit", e) !== false && !e.cancel && String(value) !== String(startValue)){
+                r.set(field, e.value);
+                delete e.cancel;
+                this.fireEvent("afteredit", e);
+            }
+        }
+        this.view.focusCell(ed.row, ed.col);
+    },
+
+    /**
+     * Starts editing the specified for the specified row/column
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    startEditing : function(row, col){
+        this.stopEditing();
+        if(this.colModel.isCellEditable(col, row)){
+            this.view.ensureVisible(row, col, true);
+            var r = this.store.getAt(row),
+                field = this.colModel.getDataIndex(col),
+                e = {
+                    grid: this,
+                    record: r,
+                    field: field,
+                    value: r.data[field],
+                    row: row,
+                    column: col,
+                    cancel:false
+                };
+            if(this.fireEvent("beforeedit", e) !== false && !e.cancel){
+                this.editing = true;
+                var ed = this.colModel.getCellEditor(col, row);
+                if(!ed){
+                    return;
+                }
+                if(!ed.rendered){
+                    ed.parentEl = this.view.getEditorParent(ed);
+                    ed.on({
+                        scope: this,
+                        render: {
+                            fn: function(c){
+                                c.field.focus(false, true);
+                            },
+                            single: true,
+                            scope: this
+                        },
+                        specialkey: function(field, e){
+                            this.getSelectionModel().onEditorKey(field, e);
+                        },
+                        complete: this.onEditComplete,
+                        canceledit: this.stopEditing.createDelegate(this, [true])
+                    });
+                }
+                Ext.apply(ed, {
+                    row     : row,
+                    col     : col,
+                    record  : r
+                });
+                this.lastEdit = {
+                    row: row,
+                    col: col
+                };
+                this.activeEditor = ed;
+                // Set the selectSameEditor flag if we are reusing the same editor again and
+                // need to prevent the editor from firing onBlur on itself.
+                ed.selectSameEditor = (this.activeEditor == this.lastActiveEditor);
+                var v = this.preEditValue(r, field);
+                ed.startEdit(this.view.getCell(row, col).firstChild, Ext.isDefined(v) ? v : '');
+
+                // Clear the selectSameEditor flag
+                (function(){
+                    delete ed.selectSameEditor;
+                }).defer(50);
+            }
+        }
+    },
+
+    // private
+    preEditValue : function(r, field){
+        var value = r.data[field];
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlDecode(value) : value;
+    },
+
+    // private
+    postEditValue : function(value, originalValue, r, field){
+        return this.autoEncode && Ext.isString(value) ? Ext.util.Format.htmlEncode(value) : value;
+    },
+
+    /**
+     * Stops any active editing
+     * @param {Boolean} cancel (optional) True to cancel any changes
+     */
+    stopEditing : function(cancel){
+        if(this.editing){
+            // Store the lastActiveEditor to check if it is changing
+            var ae = this.lastActiveEditor = this.activeEditor;
+            if(ae){
+                ae[cancel === true ? 'cancelEdit' : 'completeEdit']();
+                this.view.focusCell(ae.row, ae.col);
+            }
+            this.activeEditor = null;
+        }
+        this.editing = false;
+    }
+});
+Ext.reg('editorgrid', Ext.grid.EditorGridPanel);// private
+// This is a support class used internally by the Grid components
+Ext.grid.GridEditor = function(field, config){
+    Ext.grid.GridEditor.superclass.constructor.call(this, field, config);
+    field.monitorTab = false;
+};
+
+Ext.extend(Ext.grid.GridEditor, Ext.Editor, {
+    alignment: "tl-tl",
+    autoSize: "width",
+    hideEl : false,
+    cls: "x-small-editor x-grid-editor",
+    shim:false,
+    shadow:false
+});/**
+ * @class Ext.grid.PropertyRecord
+ * A specific {@link Ext.data.Record} type that represents a name/value pair and is made to work with the
+ * {@link Ext.grid.PropertyGrid}.  Typically, PropertyRecords do not need to be created directly as they can be
+ * created implicitly by simply using the appropriate data configs either via the {@link Ext.grid.PropertyGrid#source}
+ * config property or by calling {@link Ext.grid.PropertyGrid#setSource}.  However, if the need arises, these records
+ * can also be created explicitly as shwon below.  Example usage:
+ * <pre><code>
+var rec = new Ext.grid.PropertyRecord({
+    name: 'Birthday',
+    value: new Date(Date.parse('05/26/1972'))
+});
+// Add record to an already populated grid
+grid.store.addSorted(rec);
+</code></pre>
+ * @constructor
+ * @param {Object} config A data object in the format: {name: [name], value: [value]}.  The specified value's type
+ * will be read automatically by the grid to determine the type of editor to use when displaying it.
+ */
+Ext.grid.PropertyRecord = Ext.data.Record.create([
+    {name:'name',type:'string'}, 'value'
+]);
+
+/**
+ * @class Ext.grid.PropertyStore
+ * @extends Ext.util.Observable
+ * A custom wrapper for the {@link Ext.grid.PropertyGrid}'s {@link Ext.data.Store}. This class handles the mapping
+ * between the custom data source objects supported by the grid and the {@link Ext.grid.PropertyRecord} format
+ * required for compatibility with the underlying store. Generally this class should not need to be used directly --
+ * the grid's data should be accessed from the underlying store via the {@link #store} property.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyStore = Ext.extend(Ext.util.Observable, {
+    
+    constructor : function(grid, source){
+        this.grid = grid;
+        this.store = new Ext.data.Store({
+            recordType : Ext.grid.PropertyRecord
+        });
+        this.store.on('update', this.onUpdate,  this);
+        if(source){
+            this.setSource(source);
+        }
+        Ext.grid.PropertyStore.superclass.constructor.call(this);    
+    },
+    
+    // protected - should only be called by the grid.  Use grid.setSource instead.
+    setSource : function(o){
+        this.source = o;
+        this.store.removeAll();
+        var data = [];
+        for(var k in o){
+            if(this.isEditableValue(o[k])){
+                data.push(new Ext.grid.PropertyRecord({name: k, value: o[k]}, k));
+            }
+        }
+        this.store.loadRecords({records: data}, {}, true);
+    },
+
+    // private
+    onUpdate : function(ds, record, type){
+        if(type == Ext.data.Record.EDIT){
+            var v = record.data.value;
+            var oldValue = record.modified.value;
+            if(this.grid.fireEvent('beforepropertychange', this.source, record.id, v, oldValue) !== false){
+                this.source[record.id] = v;
+                record.commit();
+                this.grid.fireEvent('propertychange', this.source, record.id, v, oldValue);
+            }else{
+                record.reject();
+            }
+        }
+    },
+
+    // private
+    getProperty : function(row){
+       return this.store.getAt(row);
+    },
+
+    // private
+    isEditableValue: function(val){
+        return Ext.isPrimitive(val) || Ext.isDate(val);
+    },
+
+    // private
+    setValue : function(prop, value, create){
+        var r = this.getRec(prop);
+        if(r){
+            r.set('value', value);
+            this.source[prop] = value;
+        }else if(create){
+            // only create if specified.
+            this.source[prop] = value;
+            r = new Ext.grid.PropertyRecord({name: prop, value: value}, prop);
+            this.store.add(r);
+
+        }
+    },
+    
+    // private
+    remove : function(prop){
+        var r = this.getRec(prop);
+        if(r){
+            this.store.remove(r);
+            delete this.source[prop];
+        }
+    },
+    
+    // private
+    getRec : function(prop){
+        return this.store.getById(prop);
+    },
+
+    // protected - should only be called by the grid.  Use grid.getSource instead.
+    getSource : function(){
+        return this.source;
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyColumnModel
+ * @extends Ext.grid.ColumnModel
+ * A custom column model for the {@link Ext.grid.PropertyGrid}.  Generally it should not need to be used directly.
+ * @constructor
+ * @param {Ext.grid.Grid} grid The grid this store will be bound to
+ * @param {Object} source The source data config object
+ */
+Ext.grid.PropertyColumnModel = Ext.extend(Ext.grid.ColumnModel, {
+    // private - strings used for locale support
+    nameText : 'Name',
+    valueText : 'Value',
+    dateFormat : 'm/j/Y',
+    trueText: 'true',
+    falseText: 'false',
+    
+    constructor : function(grid, store){
+        var g = Ext.grid,
+	        f = Ext.form;
+	        
+	    this.grid = grid;
+	    g.PropertyColumnModel.superclass.constructor.call(this, [
+	        {header: this.nameText, width:50, sortable: true, dataIndex:'name', id: 'name', menuDisabled:true},
+	        {header: this.valueText, width:50, resizable:false, dataIndex: 'value', id: 'value', menuDisabled:true}
+	    ]);
+	    this.store = store;
+	
+	    var bfield = new f.Field({
+	        autoCreate: {tag: 'select', children: [
+	            {tag: 'option', value: 'true', html: this.trueText},
+	            {tag: 'option', value: 'false', html: this.falseText}
+	        ]},
+	        getValue : function(){
+	            return this.el.dom.value == 'true';
+	        }
+	    });
+	    this.editors = {
+	        'date' : new g.GridEditor(new f.DateField({selectOnFocus:true})),
+	        'string' : new g.GridEditor(new f.TextField({selectOnFocus:true})),
+	        'number' : new g.GridEditor(new f.NumberField({selectOnFocus:true, style:'text-align:left;'})),
+	        'boolean' : new g.GridEditor(bfield, {
+	            autoSize: 'both'
+	        })
+	    };
+	    this.renderCellDelegate = this.renderCell.createDelegate(this);
+	    this.renderPropDelegate = this.renderProp.createDelegate(this);
+    },
+
+    // private
+    renderDate : function(dateVal){
+        return dateVal.dateFormat(this.dateFormat);
+    },
+
+    // private
+    renderBool : function(bVal){
+        return this[bVal ? 'trueText' : 'falseText'];
+    },
+
+    // private
+    isCellEditable : function(colIndex, rowIndex){
+        return colIndex == 1;
+    },
+
+    // private
+    getRenderer : function(col){
+        return col == 1 ?
+            this.renderCellDelegate : this.renderPropDelegate;
+    },
+
+    // private
+    renderProp : function(v){
+        return this.getPropertyName(v);
+    },
+
+    // private
+    renderCell : function(val, meta, rec){
+        var renderer = this.grid.customRenderers[rec.get('name')];
+        if(renderer){
+            return renderer.apply(this, arguments);
+        }
+        var rv = val;
+        if(Ext.isDate(val)){
+            rv = this.renderDate(val);
+        }else if(typeof val == 'boolean'){
+            rv = this.renderBool(val);
+        }
+        return Ext.util.Format.htmlEncode(rv);
+    },
+
+    // private
+    getPropertyName : function(name){
+        var pn = this.grid.propertyNames;
+        return pn && pn[name] ? pn[name] : name;
+    },
+
+    // private
+    getCellEditor : function(colIndex, rowIndex){
+        var p = this.store.getProperty(rowIndex),
+            n = p.data.name, 
+            val = p.data.value;
+        if(this.grid.customEditors[n]){
+            return this.grid.customEditors[n];
+        }
+        if(Ext.isDate(val)){
+            return this.editors.date;
+        }else if(typeof val == 'number'){
+            return this.editors.number;
+        }else if(typeof val == 'boolean'){
+            return this.editors['boolean'];
+        }else{
+            return this.editors.string;
+        }
+    },
+
+    // inherit docs
+    destroy : function(){
+        Ext.grid.PropertyColumnModel.superclass.destroy.call(this);
+        this.destroyEditors(this.editors);
+        this.destroyEditors(this.grid.customEditors);
+    },
+    
+    destroyEditors: function(editors){
+        for(var ed in editors){
+            Ext.destroy(editors[ed]);
+        }
+    }
+});
+
+/**
+ * @class Ext.grid.PropertyGrid
+ * @extends Ext.grid.EditorGridPanel
+ * A specialized grid implementation intended to mimic the traditional property grid as typically seen in
+ * development IDEs.  Each row in the grid represents a property of some object, and the data is stored
+ * as a set of name/value pairs in {@link Ext.grid.PropertyRecord}s.  Example usage:
+ * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    title: 'Properties Grid',
+    autoHeight: true,
+    width: 300,
+    renderTo: 'grid-ct',
+    source: {
+        "(name)": "My Object",
+        "Created": new Date(Date.parse('10/15/2006')),
+        "Available": false,
+        "Version": .01,
+        "Description": "A test object"
+    }
+});
+</code></pre>
+ * @constructor
+ * @param {Object} config The grid config object
+ */
+Ext.grid.PropertyGrid = Ext.extend(Ext.grid.EditorGridPanel, {
+    /**
+    * @cfg {Object} propertyNames An object containing property name/display name pairs.
+    * If specified, the display name will be shown in the name column instead of the property name.
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customEditors An object containing name/value pairs of custom editor type definitions that allow
+    * the grid to support additional types of editable fields.  By default, the grid supports strongly-typed editing
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with a custom input control by specifying a custom editor.  The name of the editor
+    * type should correspond with the name of the property that will use the editor.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customEditors: {
+        'Start Time': new Ext.grid.GridEditor(new Ext.form.TimeField({selectOnFocus:true}))
+    },
+    source: {
+        'Start Time': '10:00 AM'
+    }
+});
+</code></pre>
+    */
+    /**
+    * @cfg {Object} source A data object to use as the data source of the grid (see {@link #setSource} for details).
+    */
+    /**
+    * @cfg {Object} customRenderers An object containing name/value pairs of custom renderer type definitions that allow
+    * the grid to support custom rendering of fields.  By default, the grid supports strongly-typed rendering
+    * of strings, dates, numbers and booleans using built-in form editors, but any custom type can be supported and
+    * associated with the type of the value.  The name of the renderer type should correspond with the name of the property
+    * that it will render.  Example usage:
+    * <pre><code>
+var grid = new Ext.grid.PropertyGrid({
+    ...
+    customRenderers: {
+        Available: function(v){
+            if(v){
+                return '<span style="color: green;">Yes</span>';
+            }else{
+                return '<span style="color: red;">No</span>';
+            }
+        }
+    },
+    source: {
+        Available: true
+    }
+});
+</code></pre>
+    */
+
+    // private config overrides
+    enableColumnMove:false,
+    stripeRows:false,
+    trackMouseOver: false,
+    clicksToEdit:1,
+    enableHdMenu : false,
+    viewConfig : {
+        forceFit:true
+    },
+
+    // private
+    initComponent : function(){
+        this.customRenderers = this.customRenderers || {};
+        this.customEditors = this.customEditors || {};
+        this.lastEditRow = null;
+        var store = new Ext.grid.PropertyStore(this);
+        this.propStore = store;
+        var cm = new Ext.grid.PropertyColumnModel(this, store);
+        store.store.sort('name', 'ASC');
+        this.addEvents(
+            /**
+             * @event beforepropertychange
+             * Fires before a property value changes.  Handlers can return false to cancel the property change
+             * (this will internally call {@link Ext.data.Record#reject} on the property's record).
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'beforepropertychange',
+            /**
+             * @event propertychange
+             * Fires after a property value has changed.
+             * @param {Object} source The source data object for the grid (corresponds to the same object passed in
+             * as the {@link #source} config property).
+             * @param {String} recordId The record's id in the data store
+             * @param {Mixed} value The current edited property value
+             * @param {Mixed} oldValue The original property value prior to editing
+             */
+            'propertychange'
+        );
+        this.cm = cm;
+        this.ds = store.store;
+        Ext.grid.PropertyGrid.superclass.initComponent.call(this);
+
+		this.mon(this.selModel, 'beforecellselect', function(sm, rowIndex, colIndex){
+            if(colIndex === 0){
+                this.startEditing.defer(200, this, [rowIndex, 1]);
+                return false;
+            }
+        }, this);
+    },
+
+    // private
+    onRender : function(){
+        Ext.grid.PropertyGrid.superclass.onRender.apply(this, arguments);
+
+        this.getGridEl().addClass('x-props-grid');
+    },
+
+    // private
+    afterRender: function(){
+        Ext.grid.PropertyGrid.superclass.afterRender.apply(this, arguments);
+        if(this.source){
+            this.setSource(this.source);
+        }
+    },
+
+    /**
+     * Sets the source data object containing the property data.  The data object can contain one or more name/value
+     * pairs representing all of the properties of an object to display in the grid, and this data will automatically
+     * be loaded into the grid's {@link #store}.  The values should be supplied in the proper data type if needed,
+     * otherwise string type will be assumed.  If the grid already contains data, this method will replace any
+     * existing data.  See also the {@link #source} config value.  Example usage:
+     * <pre><code>
+grid.setSource({
+    "(name)": "My Object",
+    "Created": new Date(Date.parse('10/15/2006')),  // date type
+    "Available": false,  // boolean type
+    "Version": .01,      // decimal type
+    "Description": "A test object"
+});
+</code></pre>
+     * @param {Object} source The data object
+     */
+    setSource : function(source){
+        this.propStore.setSource(source);
+    },
+
+    /**
+     * Gets the source data object containing the property data.  See {@link #setSource} for details regarding the
+     * format of the data object.
+     * @return {Object} The data object
+     */
+    getSource : function(){
+        return this.propStore.getSource();
+    },
+    
+    /**
+     * Sets the value of a property.
+     * @param {String} prop The name of the property to set
+     * @param {Mixed} value The value to test
+     * @param {Boolean} create (Optional) True to create the property if it doesn't already exist. Defaults to <tt>false</tt>.
+     */
+    setProperty : function(prop, value, create){
+        this.propStore.setValue(prop, value, create);    
+    },
+    
+    /**
+     * Removes a property from the grid.
+     * @param {String} prop The name of the property to remove
+     */
+    removeProperty : function(prop){
+        this.propStore.remove(prop);
+    }
+
+    /**
+     * @cfg store
+     * @hide
+     */
+    /**
+     * @cfg colModel
+     * @hide
+     */
+    /**
+     * @cfg cm
+     * @hide
+     */
+    /**
+     * @cfg columns
+     * @hide
+     */
+});
+Ext.reg("propertygrid", Ext.grid.PropertyGrid);
+/**
+ * @class Ext.grid.GroupingView
+ * @extends Ext.grid.GridView
+ * Adds the ability for single level grouping to the grid. A {@link Ext.data.GroupingStore GroupingStore}
+ * must be used to enable grouping.  Some grouping characteristics may also be configured at the
+ * {@link Ext.grid.Column Column level}<div class="mdetail-params"><ul>
+ * <li><code>{@link Ext.grid.Column#emptyGroupText emptyGroupText}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupable groupable}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupName groupName}</code></li>
+ * <li><code>{@link Ext.grid.Column#groupRender groupRender}</code></li>
+ * </ul></div>
+ * <p>Sample usage:</p>
+ * <pre><code>
+var grid = new Ext.grid.GridPanel({
+    // A groupingStore is required for a GroupingView
+    store: new {@link Ext.data.GroupingStore}({
+        autoDestroy: true,
+        reader: reader,
+        data: xg.dummyData,
+        sortInfo: {field: 'company', direction: 'ASC'},
+        {@link Ext.data.GroupingStore#groupOnSort groupOnSort}: true,
+        {@link Ext.data.GroupingStore#remoteGroup remoteGroup}: true,
+        {@link Ext.data.GroupingStore#groupField groupField}: 'industry'
+    }),
+    colModel: new {@link Ext.grid.ColumnModel}({
+        columns:[
+            {id:'company',header: 'Company', width: 60, dataIndex: 'company'},
+            // {@link Ext.grid.Column#groupable groupable}, {@link Ext.grid.Column#groupName groupName}, {@link Ext.grid.Column#groupRender groupRender} are also configurable at column level
+            {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price', {@link Ext.grid.Column#groupable groupable}: false},
+            {header: 'Change', dataIndex: 'change', renderer: Ext.util.Format.usMoney},
+            {header: 'Industry', dataIndex: 'industry'},
+            {header: 'Last Updated', renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
+        ],
+        defaults: {
+            sortable: true,
+            menuDisabled: false,
+            width: 20
+        }
+    }),
+
+    view: new Ext.grid.GroupingView({
+        {@link Ext.grid.GridView#forceFit forceFit}: true,
+        // custom grouping text template to display the number of items per group
+        {@link #groupTextTpl}: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+
+    frame:true,
+    width: 700,
+    height: 450,
+    collapsible: true,
+    animCollapse: false,
+    title: 'Grouping Example',
+    iconCls: 'icon-grid',
+    renderTo: document.body
+});
+ * </code></pre>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {
+
+    /**
+     * @cfg {String} groupByText Text displayed in the grid header menu for grouping by a column
+     * (defaults to 'Group By This Field').
+     */
+    groupByText : 'Group By This Field',
+    /**
+     * @cfg {String} showGroupsText Text displayed in the grid header for enabling/disabling grouping
+     * (defaults to 'Show in Groups').
+     */
+    showGroupsText : 'Show in Groups',
+    /**
+     * @cfg {Boolean} hideGroupedColumn <tt>true</tt> to hide the column that is currently grouped (defaults to <tt>false</tt>)
+     */
+    hideGroupedColumn : false,
+    /**
+     * @cfg {Boolean} showGroupName If <tt>true</tt> will display a prefix plus a ': ' before the group field value
+     * in the group header line.  The prefix will consist of the <tt><b>{@link Ext.grid.Column#groupName groupName}</b></tt>
+     * (or the configured <tt><b>{@link Ext.grid.Column#header header}</b></tt> if not provided) configured in the
+     * {@link Ext.grid.Column} for each set of grouped rows (defaults to <tt>true</tt>).
+     */
+    showGroupName : true,
+    /**
+     * @cfg {Boolean} startCollapsed <tt>true</tt> to start all groups collapsed (defaults to <tt>false</tt>)
+     */
+    startCollapsed : false,
+    /**
+     * @cfg {Boolean} enableGrouping <tt>false</tt> to disable grouping functionality (defaults to <tt>true</tt>)
+     */
+    enableGrouping : true,
+    /**
+     * @cfg {Boolean} enableGroupingMenu <tt>true</tt> to enable the grouping control in the column menu (defaults to <tt>true</tt>)
+     */
+    enableGroupingMenu : true,
+    /**
+     * @cfg {Boolean} enableNoGroups <tt>true</tt> to allow the user to turn off grouping (defaults to <tt>true</tt>)
+     */
+    enableNoGroups : true,
+    /**
+     * @cfg {String} emptyGroupText The text to display when there is an empty group value (defaults to <tt>'(None)'</tt>).
+     * May also be specified per column, see {@link Ext.grid.Column}.{@link Ext.grid.Column#emptyGroupText emptyGroupText}.
+     */
+    emptyGroupText : '(None)',
+    /**
+     * @cfg {Boolean} ignoreAdd <tt>true</tt> to skip refreshing the view when new rows are added (defaults to <tt>false</tt>)
+     */
+    ignoreAdd : false,
+    /**
+     * @cfg {String} groupTextTpl The template used to render the group header (defaults to <tt>'{text}'</tt>).
+     * This is used to format an object which contains the following properties:
+     * <div class="mdetail-params"><ul>
+     * <li><b>group</b> : String<p class="sub-desc">The <i>rendered</i> value of the group field.
+     * By default this is the unchanged value of the group field. If a <tt><b>{@link Ext.grid.Column#groupRenderer groupRenderer}</b></tt>
+     * is specified, it is the result of a call to that function.</p></li>
+     * <li><b>gvalue</b> : Object<p class="sub-desc">The <i>raw</i> value of the group field.</p></li>
+     * <li><b>text</b> : String<p class="sub-desc">The configured header (as described in <tt>{@link #showGroupName})</tt>
+     * if <tt>{@link #showGroupName}</tt> is <tt>true</tt>) plus the <i>rendered</i> group field value.</p></li>
+     * <li><b>groupId</b> : String<p class="sub-desc">A unique, generated ID which is applied to the
+     * View Element which contains the group.</p></li>
+     * <li><b>startRow</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
+     * <li><b>rs</b> : Array<p class="sub-desc">Contains a single element: The Record providing the data
+     * for the row which caused group change.</p></li>
+     * <li><b>cls</b> : String<p class="sub-desc">The generated class name string to apply to the group header Element.</p></li>
+     * <li><b>style</b> : String<p class="sub-desc">The inline style rules to apply to the group header Element.</p></li>
+     * </ul></div></p>
+     * See {@link Ext.XTemplate} for information on how to format data using a template. Possible usage:<pre><code>
+var grid = new Ext.grid.GridPanel({
+    ...
+    view: new Ext.grid.GroupingView({
+        groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+    }),
+});
+     * </code></pre>
+     */
+    groupTextTpl : '{text}',
+
+    /**
+     * @cfg {String} groupMode Indicates how to construct the group identifier. <tt>'value'</tt> constructs the id using
+     * raw value, <tt>'display'</tt> constructs the id using the rendered value. Defaults to <tt>'value'</tt>.
+     */
+    groupMode: 'value',
+
+    /**
+     * @cfg {Function} groupRenderer This property must be configured in the {@link Ext.grid.Column} for
+     * each column.
+     */
+    
+    /**
+     * @cfg {Boolean} cancelEditOnToggle True to cancel any editing when the group header is toggled. Defaults to <tt>true</tt>.
+     */
+    cancelEditOnToggle: true,
+
+    // private
+    initTemplates : function(){
+        Ext.grid.GroupingView.superclass.initTemplates.call(this);
+        this.state = {};
+
+        var sm = this.grid.getSelectionModel();
+        sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',
+                this.onBeforeRowSelect, this);
+
+        if(!this.startGroup){
+            this.startGroup = new Ext.XTemplate(
+                '<div id="{groupId}" class="x-grid-group {cls}">',
+                    '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">', this.groupTextTpl ,'</div></div>',
+                    '<div id="{groupId}-bd" class="x-grid-group-body">'
+            );
+        }
+        this.startGroup.compile();
+
+        if (!this.endGroup) {
+            this.endGroup = '</div></div>';
+        }
+    },
+
+    // private
+    findGroup : function(el){
+        return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);
+    },
+
+    // private
+    getGroups : function(){
+        return this.hasRows() ? this.mainBody.dom.childNodes : [];
+    },
+
+    // private
+    onAdd : function(ds, records, index) {
+        if (this.canGroup() && !this.ignoreAdd) {
+            var ss = this.getScrollState();
+            this.fireEvent('beforerowsinserted', ds, index, index + (records.length-1));
+            this.refresh();
+            this.restoreScroll(ss);
+            this.fireEvent('rowsinserted', ds, index, index + (records.length-1));
+        } else if (!this.canGroup()) {
+            Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);
+        }
+    },
+
+    // private
+    onRemove : function(ds, record, index, isUpdate){
+        Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);
+        var g = document.getElementById(record._groupId);
+        if(g && g.childNodes[1].childNodes.length < 1){
+            Ext.removeNode(g);
+        }
+        this.applyEmptyText();
+    },
+
+    // private
+    refreshRow : function(record){
+        if(this.ds.getCount()==1){
+            this.refresh();
+        }else{
+            this.isUpdating = true;
+            Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);
+            this.isUpdating = false;
+        }
+    },
+
+    // private
+    beforeMenuShow : function(){
+        var item, items = this.hmenu.items, disabled = this.cm.config[this.hdCtxIndex].groupable === false;
+        if((item = items.get('groupBy'))){
+            item.setDisabled(disabled);
+        }
+        if((item = items.get('showGroups'))){
+            item.setDisabled(disabled);
+            item.setChecked(this.canGroup(), true);
+        }
+    },
+
+    // private
+    renderUI : function(){
+        var markup = Ext.grid.GroupingView.superclass.renderUI.call(this);
+
+        if(this.enableGroupingMenu && this.hmenu){
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            if(this.enableNoGroups){
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+        return markup;
+    },
+
+    processEvent: function(name, e){
+        Ext.grid.GroupingView.superclass.processEvent.call(this, name, e);
+        var hd = e.getTarget('.x-grid-group-hd', this.mainBody);
+        if(hd){
+            // group value is at the end of the string
+            var field = this.getGroupField(),
+                prefix = this.getPrefix(field),
+                groupValue = hd.id.substring(prefix.length),
+                emptyRe = new RegExp('gp-' + Ext.escapeRe(field) + '--hd');
+
+            // remove trailing '-hd'
+            groupValue = groupValue.substr(0, groupValue.length - 3);
+            
+            // also need to check for empty groups
+            if(groupValue || emptyRe.test(hd.id)){
+                this.grid.fireEvent('group' + name, this.grid, field, groupValue, e);
+            }
+            if(name == 'mousedown' && e.button == 0){
+                this.toggleGroup(hd.parentNode);
+            }
+        }
+
+    },
+
+    // private
+    onGroupByClick : function(){
+        var grid = this.grid;
+        this.enableGrouping = true;
+        grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));
+        grid.fireEvent('groupchange', grid, grid.store.getGroupState());
+        this.beforeMenuShow(); // Make sure the checkboxes get properly set when changing groups
+        this.refresh();
+    },
+
+    // private
+    onShowGroupsClick : function(mi, checked){
+        this.enableGrouping = checked;
+        if(checked){
+            this.onGroupByClick();
+        }else{
+            this.grid.store.clearGrouping();
+            this.grid.fireEvent('groupchange', this, null);
+        }
+    },
+
+    /**
+     * Toggle the group that contains the specific row.
+     * @param {Number} rowIndex The row inside the group
+     * @param {Boolean} expanded (optional)
+     */
+    toggleRowIndex : function(rowIndex, expanded){
+        if(!this.canGroup()){
+            return;
+        }
+        var row = this.getRow(rowIndex);
+        if(row){
+            this.toggleGroup(this.findGroup(row), expanded);
+        }
+    },
+
+    /**
+     * Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed.
+     * @param {String} groupId The groupId assigned to the group (see getGroupId)
+     * @param {Boolean} expanded (optional)
+     */
+    toggleGroup : function(group, expanded){
+        var gel = Ext.get(group),
+            id = Ext.util.Format.htmlEncode(gel.id);
+ 
+        expanded = Ext.isDefined(expanded) ? expanded : gel.hasClass('x-grid-group-collapsed');
+        if(this.state[id] !== expanded){
+            if (this.cancelEditOnToggle !== false) {
+                this.grid.stopEditing(true);
+            }
+            this.state[id] = expanded;
+            gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');
+        }
+    },
+
+    /**
+     * Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed.
+     * @param {Boolean} expanded (optional)
+     */
+    toggleAllGroups : function(expanded){
+        var groups = this.getGroups();
+        for(var i = 0, len = groups.length; i < len; i++){
+            this.toggleGroup(groups[i], expanded);
+        }
+    },
+
+    /**
+     * Expands all grouped rows.
+     */
+    expandAllGroups : function(){
+        this.toggleAllGroups(true);
+    },
+
+    /**
+     * Collapses all grouped rows.
+     */
+    collapseAllGroups : function(){
+        this.toggleAllGroups(false);
+    },
+
+    // private
+    getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){
+        var column = this.cm.config[colIndex],
+            g = groupRenderer ? groupRenderer.call(column.scope, v, {}, r, rowIndex, colIndex, ds) : String(v);
+        if(g === '' || g === '&#160;'){
+            g = column.emptyGroupText || this.emptyGroupText;
+        }
+        return g;
+    },
+
+    // private
+    getGroupField : function(){
+        return this.grid.store.getGroupState();
+    },
+
+    // private
+    afterRender : function(){
+        if(!this.ds || !this.cm){
+            return;
+        }
+        Ext.grid.GroupingView.superclass.afterRender.call(this);
+        if(this.grid.deferRowRender){
+            this.updateGroupWidths();
+        }
+    },
+    
+    afterRenderUI: function () {
+        Ext.grid.GroupingView.superclass.afterRenderUI.call(this);
+
+        if (this.enableGroupingMenu && this.hmenu) {
+            this.hmenu.add('-',{
+                itemId:'groupBy',
+                text: this.groupByText,
+                handler: this.onGroupByClick,
+                scope: this,
+                iconCls:'x-group-by-icon'
+            });
+            
+            if (this.enableNoGroups) {
+                this.hmenu.add({
+                    itemId:'showGroups',
+                    text: this.showGroupsText,
+                    checked: true,
+                    checkHandler: this.onShowGroupsClick,
+                    scope: this
+                });
+            }
+            
+            this.hmenu.on('beforeshow', this.beforeMenuShow, this);
+        }
+    },
+
+    // private
+    renderRows : function(){
+        var groupField = this.getGroupField();
+        var eg = !!groupField;
+        // if they turned off grouping and the last grouped field is hidden
+        if(this.hideGroupedColumn) {
+            var colIndex = this.cm.findColumnIndex(groupField),
+                hasLastGroupField = Ext.isDefined(this.lastGroupField);
+            if(!eg && hasLastGroupField){
+                this.mainBody.update('');
+                this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);
+                delete this.lastGroupField;
+            }else if (eg && !hasLastGroupField){
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }else if (eg && hasLastGroupField && groupField !== this.lastGroupField) {
+                this.mainBody.update('');
+                var oldIndex = this.cm.findColumnIndex(this.lastGroupField);
+                this.cm.setHidden(oldIndex, false);
+                this.lastGroupField = groupField;
+                this.cm.setHidden(colIndex, true);
+            }
+        }
+        return Ext.grid.GroupingView.superclass.renderRows.apply(
+                    this, arguments);
+    },
+
+    // private
+    doRender : function(cs, rs, ds, startRow, colCount, stripe){
+        if(rs.length < 1){
+            return '';
+        }
+
+        if(!this.canGroup() || this.isUpdating){
+            return Ext.grid.GroupingView.superclass.doRender.apply(this, arguments);
+        }
+
+        var groupField = this.getGroupField(),
+            colIndex = this.cm.findColumnIndex(groupField),
+            g,
+            gstyle = 'width:' + this.getTotalWidth() + ';',
+            cfg = this.cm.config[colIndex],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            prefix = this.showGroupName ? (cfg.groupName || cfg.header)+': ' : '',
+            groups = [],
+            curGroup, i, len, gid;
+
+        for(i = 0, len = rs.length; i < len; i++){
+            var rowIndex = startRow + i,
+                r = rs[i],
+                gvalue = r.data[groupField];
+
+                g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);
+            if(!curGroup || curGroup.group != g){
+                gid = this.constructId(gvalue, groupField, colIndex);
+                // if state is defined use it, however state is in terms of expanded
+                // so negate it, otherwise use the default.
+                this.state[gid] = !(Ext.isDefined(this.state[gid]) ? !this.state[gid] : this.startCollapsed);
+                curGroup = {
+                    group: g,
+                    gvalue: gvalue,
+                    text: prefix + g,
+                    groupId: gid,
+                    startRow: rowIndex,
+                    rs: [r],
+                    cls: this.state[gid] ? '' : 'x-grid-group-collapsed',
+                    style: gstyle
+                };
+                groups.push(curGroup);
+            }else{
+                curGroup.rs.push(r);
+            }
+            r._groupId = gid;
+        }
+
+        var buf = [];
+        for(i = 0, len = groups.length; i < len; i++){
+            g = groups[i];
+            this.doGroupStart(buf, g, cs, ds, colCount);
+            buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(
+                    this, cs, g.rs, ds, g.startRow, colCount, stripe);
+
+            this.doGroupEnd(buf, g, cs, ds, colCount);
+        }
+        return buf.join('');
+    },
+
+    /**
+     * Dynamically tries to determine the groupId of a specific value
+     * @param {String} value
+     * @return {String} The group id
+     */
+    getGroupId : function(value){
+        var field = this.getGroupField();
+        return this.constructId(value, field, this.cm.findColumnIndex(field));
+    },
+
+    // private
+    constructId : function(value, field, idx){
+        var cfg = this.cm.config[idx],
+            groupRenderer = cfg.groupRenderer || cfg.renderer,
+            val = (this.groupMode == 'value') ? value : this.getGroup(value, {data:{}}, groupRenderer, 0, idx, this.ds);
+
+        return this.getPrefix(field) + Ext.util.Format.htmlEncode(val);
+    },
+
+    // private
+    canGroup  : function(){
+        return this.enableGrouping && !!this.getGroupField();
+    },
+
+    // private
+    getPrefix: function(field){
+        return this.grid.getGridEl().id + '-gp-' + field + '-';
+    },
+
+    // private
+    doGroupStart : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.startGroup.apply(g);
+    },
+
+    // private
+    doGroupEnd : function(buf, g, cs, ds, colCount){
+        buf[buf.length] = this.endGroup;
+    },
+
+    // private
+    getRows : function(){
+        if(!this.canGroup()){
+            return Ext.grid.GroupingView.superclass.getRows.call(this);
+        }
+        var r = [],
+            gs = this.getGroups(),
+            g,
+            i = 0,
+            len = gs.length,
+            j,
+            jlen;
+        for(; i < len; ++i){
+            g = gs[i].childNodes[1];
+            if(g){
+                g = g.childNodes;
+                for(j = 0, jlen = g.length; j < jlen; ++j){
+                    r[r.length] = g[j];
+                }
+            }
+        }
+        return r;
+    },
+
+    // private
+    updateGroupWidths : function(){
+        if(!this.canGroup() || !this.hasRows()){
+            return;
+        }
+        var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.getScrollOffset()) +'px';
+        var gs = this.getGroups();
+        for(var i = 0, len = gs.length; i < len; i++){
+            gs[i].firstChild.style.width = tw;
+        }
+    },
+
+    // private
+    onColumnWidthUpdated : function(col, w, tw){
+        Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this, col, w, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onAllColumnWidthsUpdated : function(ws, tw){
+        Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this, ws, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onColumnHiddenUpdated : function(col, hidden, tw){
+        Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this, col, hidden, tw);
+        this.updateGroupWidths();
+    },
+
+    // private
+    onLayout : function(){
+        this.updateGroupWidths();
+    },
+
+    // private
+    onBeforeRowSelect : function(sm, rowIndex){
+        this.toggleRowIndex(rowIndex, true);
+    }
+});
+// private
+Ext.grid.GroupingView.GROUP_ID = 1000;
Index: /trunk/workshop-routing-foss4g/web/ext/gpl-3.0.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/ext/gpl-3.0.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/ext/gpl-3.0.txt	(revision 76)
@@ -0,0 +1,674 @@
+                    GNU GENERAL PUBLIC LICENSE
+                       Version 3, 29 June 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU General Public License is a free, copyleft license for
+software and other kinds of works.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+the GNU General Public License is intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.  We, the Free Software Foundation, use the
+GNU General Public License for most of our software; it applies also to
+any other work released this way by its authors.  You can apply it to
+your programs, too.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  To protect your rights, we need to prevent others from denying you
+these rights or asking you to surrender the rights.  Therefore, you have
+certain responsibilities if you distribute copies of the software, or if
+you modify it: responsibilities to respect the freedom of others.
+
+  For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must pass on to the recipients the same
+freedoms that you received.  You must make sure that they, too, receive
+or can get the source code.  And you must show them these terms so they
+know their rights.
+
+  Developers that use the GNU GPL protect your rights with two steps:
+(1) assert copyright on the software, and (2) offer you this License
+giving you legal permission to copy, distribute and/or modify it.
+
+  For the developers' and authors' protection, the GPL clearly explains
+that there is no warranty for this free software.  For both users' and
+authors' sake, the GPL requires that modified versions be marked as
+changed, so that their problems will not be attributed erroneously to
+authors of previous versions.
+
+  Some devices are designed to deny users access to install or run
+modified versions of the software inside them, although the manufacturer
+can do so.  This is fundamentally incompatible with the aim of
+protecting users' freedom to change the software.  The systematic
+pattern of such abuse occurs in the area of products for individuals to
+use, which is precisely where it is most unacceptable.  Therefore, we
+have designed this version of the GPL to prohibit the practice for those
+products.  If such problems arise substantially in other domains, we
+stand ready to extend this provision to those domains in future versions
+of the GPL, as needed to protect the freedom of users.
+
+  Finally, every program is threatened constantly by software patents.
+States should not allow patents to restrict development and use of
+software on general-purpose computers, but in those that do, we wish to
+avoid the special danger that patents applied to a free program could
+make it effectively proprietary.  To prevent this, the GPL assures that
+patents cannot be used to render the program non-free.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Use with the GNU Affero General Public License.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU Affero General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the special requirements of the GNU Affero General Public License,
+section 13, concerning interaction through a network will apply to the
+combination as such.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU General Public License from time to time.  Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If the program does terminal interaction, make it output a short
+notice like this when it starts in an interactive mode:
+
+    <program>  Copyright (C) <year>  <name of author>
+    This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
+    This is free software, and you are welcome to redistribute it
+    under certain conditions; type `show c' for details.
+
+The hypothetical commands `show w' and `show c' should show the appropriate
+parts of the General Public License.  Of course, your program's commands
+might be different; for a GUI interface, you would use an "about box".
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU GPL, see
+<http://www.gnu.org/licenses/>.
+
+  The GNU General Public License does not permit incorporating your program
+into proprietary programs.  If your program is a subroutine library, you
+may consider it more useful to permit linking proprietary applications with
+the library.  If this is what you want to do, use the GNU Lesser General
+Public License instead of this License.  But first, please read
+<http://www.gnu.org/philosophy/why-not-lgpl.html>.
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/license.txt	(revision 76)
@@ -0,0 +1,38 @@
+This license applies to all code and content in the 'branches', 'trunk', and
+'project' directories of the Openlayers code repository at svn.openlayers.org,
+and applies to all release of OpenLayers later than 2.5.
+
+Copyright (c) 2005-2010 OpenLayers Contributors. See authors.txt for
+  full list.
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted (subject to the limitations in the
+disclaimer below) provided that the following conditions are met:
+
+ * Redistributions of source code must retain the above copyright
+   notice, this list of conditions and the following disclaimer.
+
+ * Redistributions in binary form must reproduce the above copyright
+   notice, this list of conditions and the following disclaimer in the
+   documentation and/or other materials provided with the
+   distribution.
+
+ * Neither the name of OpenLayers nor the names of its contributors 
+   may be used to endorse or promote products derived from this 
+   software without specific prior written permission.
+
+NO EXPRESS OR IMPLIED LICENSES TO ANY PARTY'S PATENT RIGHTS ARE
+GRANTED BY THIS LICENSE.  THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT
+HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED
+WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR
+BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
+WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE
+OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN
+IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/google.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/google.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/google.css	(revision 76)
@@ -0,0 +1,10 @@
+.olLayerGoogleCopyright {
+    right: 3px;
+    bottom: 2px;
+    left: auto;  
+}
+.olLayerGooglePoweredBy {
+    left: 2px;
+    bottom: 2px;   
+}
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/style.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/style.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/style.css	(revision 76)
@@ -0,0 +1,397 @@
+div.olMap {
+    z-index: 0;
+    padding: 0px!important;
+    margin: 0px!important;
+    cursor: default;
+}
+
+div.olMapViewport {
+    text-align: left;
+}
+
+div.olLayerDiv {
+   -moz-user-select: none;
+}
+
+.olLayerGoogleCopyright {
+    left: 2px;
+    bottom: 2px;  
+}
+.olLayerGooglePoweredBy {
+    left: 2px;
+    bottom: 15px;   
+}
+.olControlAttribution {
+    font-size: smaller; 
+    right: 3px; 
+    bottom: 4.5em; 
+    position: absolute; 
+    display: block;
+}
+.olControlScale {
+    right: 3px;
+    bottom: 3em;
+    display: block;
+    position: absolute;
+    font-size: smaller;
+}
+.olControlScaleLine {
+   display: block;
+   position: absolute;
+   left: 10px;
+   bottom: 15px;
+   font-size: xx-small;
+}
+.olControlScaleLineBottom {
+   border: solid 2px black;
+   border-bottom: none;
+   margin-top:-2px;
+   text-align: center;
+}
+.olControlScaleLineTop {
+   border: solid 2px black;
+   border-top: none;
+   text-align: center;
+}
+
+.olControlPermalink {
+    right: 3px;
+    bottom: 1.5em;
+    display: block;
+    position: absolute;
+    font-size: smaller;
+} 
+
+div.olControlMousePosition {
+    bottom: 0em;
+    right: 3px;
+    display: block;
+    position: absolute;
+    font-family: Arial;
+    font-size: smaller;
+}
+
+.olControlOverviewMapContainer {
+    position: absolute;
+    bottom: 0px;
+    right: 0px;
+}
+
+.olControlOverviewMapElement {
+    padding: 10px 18px 10px 10px;
+    background-color: #00008B;
+    -moz-border-radius: 1em 0 0 0;
+}
+
+.olControlOverviewMapMinimizeButton {
+    right: 0px;
+    bottom: 80px;
+}    
+
+.olControlOverviewMapMaximizeButton {
+    right: 0px;
+    bottom: 80px;
+}
+
+.olControlOverviewMapExtentRectangle {
+    overflow: hidden;
+    background-image: url("img/blank.gif");
+    cursor: move;
+    border: 2px dotted red;
+}
+.olControlOverviewMapRectReplacement {
+    overflow: hidden;
+    cursor: move;
+    background-image: url("img/overview_replacement.gif");
+    background-repeat: no-repeat;
+    background-position: center;
+}
+
+.olLayerGeoRSSDescription {
+    float:left;
+    width:100%;
+    overflow:auto;
+    font-size:1.0em;
+}
+.olLayerGeoRSSClose {
+    float:right;
+    color:gray;
+    font-size:1.2em;
+    margin-right:6px;
+    font-family:sans-serif;
+}
+.olLayerGeoRSSTitle {
+    float:left;font-size:1.2em;
+}
+
+.olPopupContent {
+    padding:5px;
+    overflow: auto;
+}    
+.olControlNavToolbar { 
+    width:0px;
+    height:0px;
+}    
+.olControlNavToolbar div { 
+  display:block;
+  width:  28px;
+  height: 28px;
+  top: 300px;
+  left: 6px;
+  position: relative;
+}
+
+.olControlNavigationHistory {
+   background-image: url("img/navigation_history.png");
+   background-repeat: no-repeat;
+   width:  24px;
+   height: 24px;
+
+}
+.olControlNavigationHistoryPreviousItemActive { 
+  background-position: 0px 0px;
+}
+.olControlNavigationHistoryPreviousItemInactive { 
+   background-position: 0px -24px;
+}
+.olControlNavigationHistoryNextItemActive { 
+   background-position: -24px 0px;
+}
+.olControlNavigationHistoryNextItemInactive { 
+   background-position: -24px -24px;
+}
+
+.olControlNavToolbar .olControlNavigationItemActive { 
+  background-image: url("img/panning-hand-on.png");
+  background-repeat: no-repeat;
+}
+.olControlNavToolbar .olControlNavigationItemInactive { 
+  background-image: url("img/panning-hand-off.png");
+  background-repeat: no-repeat;
+}
+.olControlNavToolbar .olControlZoomBoxItemActive { 
+  background-image: url("img/drag-rectangle-on.png");
+  background-color: orange;
+  background-repeat: no-repeat;
+}
+.olControlNavToolbar .olControlZoomBoxItemInactive { 
+  background-image: url("img/drag-rectangle-off.png");
+  background-repeat: no-repeat;
+}
+.olControlEditingToolbar  {
+    float:right;
+    right: 0px;
+    height: 30px; 
+    width: 200px;
+}
+.olControlEditingToolbar div { 
+  background-image: url("img/editing_tool_bar.png");
+  background-repeat: no-repeat;
+  float:right;
+  width:  24px;
+  height: 24px;
+  margin: 5px;
+}
+.olControlEditingToolbar .olControlNavigationItemActive { 
+  background-position: -103px -23px; 
+}
+.olControlEditingToolbar .olControlNavigationItemInactive { 
+  background-position: -103px -0px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePointItemActive { 
+  background-position: -77px -23px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePointItemInactive { 
+  background-position: -77px -0px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePathItemInactive { 
+  background-position: -51px 0px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePathItemActive { 
+  background-position: -51px -23px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePolygonItemInactive { 
+  background-position: -26px 0px; 
+}
+.olControlEditingToolbar .olControlDrawFeaturePolygonItemActive { 
+  background-position: -26px -23px ;                                                                   
+}
+div.olControlSaveFeaturesItemActive { 
+    background-image: url(img/save_features_on.png);
+    background-repeat: no-repeat;
+    background-position: 0px 1px;
+}
+div.olControlSaveFeaturesItemInactive { 
+    background-image: url(img/save_features_off.png);
+    background-repeat: no-repeat;
+    background-position: 0px 1px;
+}
+
+.olHandlerBoxZoomBox {
+    border: 2px solid red;
+    position: absolute;
+    background-color: white;
+    opacity: 0.50;
+    font-size: 1px;
+    filter: alpha(opacity=50);
+}
+.olHandlerBoxSelectFeature {
+    border: 2px solid blue;
+    position: absolute;
+    background-color: white;
+    opacity: 0.50;
+    font-size: 1px;
+    filter: alpha(opacity=50);
+}   
+
+.olControlPanPanel {
+    top: 10px;
+    left: 5px;
+}  
+
+.olControlPanPanel div {
+    background-image: url(img/pan-panel.png);
+    height: 18px;
+    width: 18px;
+    cursor: pointer;
+    position: absolute;
+}
+
+.olControlPanPanel .olControlPanNorthItemInactive {
+    top: 0px;
+    left: 9px;
+    background-position: 0px 0px;
+}
+.olControlPanPanel .olControlPanSouthItemInactive {
+    top: 36px;
+    left: 9px;
+    background-position: 18px 0px;
+}
+.olControlPanPanel .olControlPanWestItemInactive {
+    position: absolute;
+    top: 18px;
+    left: 0px;
+    background-position: 0px 18px;
+}
+.olControlPanPanel .olControlPanEastItemInactive {
+    top: 18px;
+    left: 18px;
+    background-position: 18px 18px;
+}
+
+.olControlZoomPanel {
+    top: 71px;
+    left: 14px;
+} 
+
+.olControlZoomPanel div {
+    background-image: url(img/zoom-panel.png);
+    position: absolute;
+    height: 18px;
+    width: 18px;
+    cursor: pointer;
+}
+
+.olControlZoomPanel .olControlZoomInItemInactive {
+    top: 0px;
+    left: 0px;
+    background-position: 0px 0px;
+}
+
+.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
+    top: 18px;
+    left: 0px;
+    background-position: 0px -18px;
+}
+
+.olControlZoomPanel .olControlZoomOutItemInactive {
+    top: 36px;
+    left: 0px;
+    background-position: 0px 18px;
+}
+
+.olPopupCloseBox {
+  background: url("img/close.gif") no-repeat;
+  cursor: pointer;
+}
+
+.olFramedCloudPopupContent {
+    padding: 5px;
+    overflow: auto;
+}
+
+.olControlNoSelect {
+ -moz-user-select: none;
+}
+
+.olImageLoadError {
+    background-color: pink;
+    opacity: 0.5;
+    filter: alpha(opacity=50); /* IE */
+}
+
+/**
+ * Cursor styles
+ */
+
+.olCursorWait {
+    cursor: wait;
+}
+.olDragDown {
+    cursor: move;
+}
+.olDrawBox {
+    cursor: crosshair;
+}
+.olControlDragFeatureOver {
+    cursor: move;
+}
+.olControlDragFeatureActive.olControlDragFeatureOver.olDragDown {
+    cursor: -moz-grabbing;
+}
+
+/**
+ * Layer switcher
+ */
+.olControlLayerSwitcher {
+    position: absolute;
+    top: 25px;
+    right: 0px;
+    width: 20em;
+    font-family: sans-serif;
+    font-weight: bold;
+    margin-top: 3px;
+    margin-left: 3px;
+    margin-bottom: 3px;
+    font-size: smaller;
+    color: white;
+    background-color: transparent;
+}
+
+.olControlLayerSwitcher .layersDiv {
+    padding-top: 5px;
+    padding-left: 10px;
+    padding-bottom: 5px;
+    padding-right: 75px;
+    background-color: darkblue;
+    width: 100%;
+    height: 100%;
+}
+
+.olControlLayerSwitcher .layersDiv .baseLbl,
+.olControlLayerSwitcher .layersDiv .dataLbl {
+    margin-top: 3px;
+    margin-left: 3px;
+    margin-bottom: 3px;
+}
+
+.olControlLayerSwitcher .layersDiv .baseLayersDiv,
+.olControlLayerSwitcher .layersDiv .dataLayersDiv {
+    padding-left: 10px;
+}
+
+.olControlLayerSwitcher .maximizeDiv,
+.olControlLayerSwitcher .minimizeDiv {
+    top: 5px;
+    right: 0px;
+}
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/ie6-style.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/ie6-style.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/theme/default/ie6-style.css	(revision 76)
@@ -0,0 +1,7 @@
+.olControlZoomPanel div {
+    background-image: url(img/zoom-panel-NOALPHA.png);
+}
+.olControlPanPanel div {
+    background-image: url(img/pan-panel-NOALPHA.png);
+}
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Gears/gears_init.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Gears/gears_init.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Gears/gears_init.js	(revision 76)
@@ -0,0 +1,88 @@
+/*
+ * Copyright 2007, Google Inc.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ *  1. Redistributions of source code must retain the above copyright notice,
+ *     this list of conditions and the following disclaimer.
+ *  2. Redistributions in binary form must reproduce the above copyright notice,
+ *     this list of conditions and the following disclaimer in the documentation
+ *     and/or other materials provided with the distribution.
+ *  3. Neither the name of Google Inc. nor the names of its contributors may be
+ *     used to endorse or promote products derived from this software without
+ *     specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS OR IMPLIED
+ * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO
+ * EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
+ * OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
+ * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
+ * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ * Sets up google.gears.*, which is *the only* supported way to access Gears.
+ *
+ * Circumvent this file at your own risk!
+ *
+ * In the future, Gears may automatically define google.gears.* without this
+ * file. Gears may use these objects to transparently fix bugs and compatibility
+ * issues. Applications that use the code below will continue to work seamlessly
+ * when that happens.
+ */
+
+(function() {
+  // We are already defined. Hooray!
+  if (window.google && google.gears) {
+    return;
+  }
+
+  var factory = null;
+
+  // Firefox
+  if (typeof GearsFactory != 'undefined') {
+    factory = new GearsFactory();
+  } else {
+    // IE
+    try {
+      factory = new ActiveXObject('Gears.Factory');
+      // privateSetGlobalObject is only required and supported on WinCE.
+      if (factory.getBuildInfo().indexOf('ie_mobile') != -1) {
+        factory.privateSetGlobalObject(this);
+      }
+    } catch (e) {
+      // Safari
+      if ((typeof navigator.mimeTypes != 'undefined')
+           && navigator.mimeTypes["application/x-googlegears"]) {
+        factory = document.createElement("object");
+        factory.style.display = "none";
+        factory.width = 0;
+        factory.height = 0;
+        factory.type = "application/x-googlegears";
+        document.documentElement.appendChild(factory);
+      }
+    }
+  }
+
+  // *Do not* define any objects if Gears is not installed. This mimics the
+  // behavior of Gears defining the objects in the future.
+  if (!factory) {
+    return;
+  }
+
+  // Now set up the objects, being careful not to overwrite anything.
+  //
+  // Note: In Internet Explorer for Windows Mobile, you can't add properties to
+  // the window object. However, global objects are automatically added as
+  // properties of the window object in all browsers.
+  if (!window.google) {
+    google = {};
+  }
+
+  if (!google.gears) {
+    google.gears = {factory: factory};
+  }
+})();
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/km.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/km.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/km.js	(revision 76)
@@ -0,0 +1,26 @@
+/* Translators (2009 onwards):
+ *  - ááááá¶áá·ááá
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["km"]
+ * Dictionary for áá¶áá¶ááááá.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["km"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "ááááááá¶ááá¢á
+á·áááááááá",
+
+    'baseLayer': "ááááá¶áááá¶áâ",
+
+    'errorLoadingGML': "ááá á»áááá¡á»áááááááá»áá¯ááá¶á GML ${url}",
+
+    'scale': "áá¶ááááááá¶á = á¡ á ${scaleDenom}"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/io.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/io.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/io.js	(revision 76)
@@ -0,0 +1,19 @@
+/* Translators (2009 onwards):
+ *  - Malafaya
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["io"]
+ * Dictionary for Ido.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["io"] = OpenLayers.Util.applyDefaults({
+
+    'scale': "Skalo = 1 : ${scaleDenom}"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/es.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/es.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/es.js	(revision 76)
@@ -0,0 +1,129 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["es"]
+ * Dictionary for Spanish, UTF8 encoding. Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang.es = {
+
+    'unhandledRequest': "Respuesta a peticiÃ³n no gestionada ${statusText}",
+
+    'permalink': "Enlace permanente",
+
+    'overlays': "Capas superpuestas",
+
+    'baseLayer': "Capa Base",
+
+    'sameProjection':
+        "El mapa de vista general sÃ³lo funciona si estÃ¡ en la misma proyecciÃ³n que el mapa principal",
+
+    'readNotImplemented': "Lectura no implementada.",
+
+    'writeNotImplemented': "Escritura no implementada.",
+
+    'noFID': "No se puede actualizar un elemento para el que no existe FID.",
+
+    'errorLoadingGML': "Error cargando el fichero GML ${url}",
+
+    'browserNotSupported':
+        "Su navegador no soporta renderizaciÃ³n vectorial. Los renderizadores soportados actualmente son:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : el componente debe ser del tipo ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent se ha llamado desde una capa sin renderizador. Esto normalmente quiere decir que " +
+        "se ha destruido una capa, pero no el manejador asociado a ella.",
+
+    // console message
+    'minZoomLevelError':
+        "La propiedad minZoomLevel debe sÃ³lo utilizarse " +
+        "con las capas que tienen FixedZoomLevels. El hecho de que " +
+        "una capa wfs compruebe minZoomLevel es una reliquia del " +
+        "pasado. Sin embargo, no podemos eliminarla sin discontinuar " +
+        "probablemente las aplicaciones OL que puedan depender de ello. " +
+        "AsÃ­ pues estamos haciÃ©ndolo obsoleto --la comprobaciÃ³n " +
+        "minZoomLevel se eliminarÃ¡ en la versiÃ³n 3.0. Utilice el ajuste " +
+        "de resolution min/max en su lugar, tal como se describe aquÃ­: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "TransacciÃ³n WFS: ÃXITO ${response}",
+
+    'commitFailed': "TransacciÃ³n WFS: FALLÃ ${response}",
+
+    'googleWarning':
+        "La capa Google no pudo ser cargada correctamente.<br><br>" +
+        "Para evitar este mensaje, seleccione una nueva Capa Base " +
+        "en el selector de capas en la esquina superior derecha.<br><br>" +
+        "Probablemente, esto se debe a que el script de la biblioteca de " +
+	"Google Maps no fue correctamente incluido en su pÃ¡gina, o no " +
+	"contiene la clave del API correcta para su sitio.<br><br>" +
+        "Desarrolladores: Para ayudar a hacer funcionar esto correctamente, " +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>haga clic aquÃ­</a>",
+
+    'getLayerWarning':
+        "La capa ${layerType} no pudo ser cargada correctamente.<br><br>" +
+        "Para evitar este mensaje, seleccione una nueva Capa Base " +
+        "en el selector de capas en la esquina superior derecha.<br><br>" +
+        "Probablemente, esto se debe a que el script de " +
+	"la biblioteca ${layerLib} " +
+        "no fue correctamente incluido en su pÃ¡gina.<br><br>" +
+        "Desarrolladores: Para ayudar a hacer funcionar esto correctamente, " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>haga clic aquÃ­</a>",
+
+    'scale': "Escala = 1 : ${scaleDenom}",
+
+    //labels for the graticule control
+    'W': 'O',
+    'E': 'E',
+    'N': 'N',
+    'S': 'S',
+    'graticule': 'RetÃ­cula',
+    
+    // console message
+    'layerAlreadyAdded':
+        "IntentÃ³ aÃ±adir la capa: ${layerName} al mapa, pero ya habÃ­a sido aÃ±adida previamente",
+
+    // console message
+    'reprojectDeprecated':
+        "EstÃ¡ usando la opciÃ³n 'reproject' en la capa " +
+        "${layerName}. Esta opciÃ³n es obsoleta: su uso fue diseÃ±ado " +
+        "para soportar la visualizaciÃ³n de datos sobre mapas base comerciales, " + 
+        "pero ahora esa funcionalidad deberÃ­a conseguirse mediante el soporte " +
+        "de la proyecciÃ³n Spherical Mercator. MÃ¡s informaciÃ³n disponible en " +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "Este mÃ©todo es obsoleto y se eliminarÃ¡ en la versiÃ³n 3.0. " +
+        "Por favor utilice el mÃ©todo ${newMethod} en su lugar.",
+
+    // console message
+    'boundsAddError': "Debe proporcionar los valores x e y a la funciÃ³n add.",
+
+    // console message
+    'lonlatAddError': "Debe proporcionar los valores lon y lat a la funciÃ³n add.",
+
+    // console message
+    'pixelAddError': "Debe proporcionar los valores x e y a la funciÃ³n add.",
+
+    // console message
+    'unsupportedGeometryType': "Tipo de geometrÃ­a no soportada: ${geomType}",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition fallÃ³: el elemento con id ${elemId} puede haberse colocado de manera errÃ³nea.",
+                    
+    // console message
+    'filterEvaluateNotImplemented': "evaluate no estÃ¡ implementado para este tipo de filtro.",
+
+    // **** end ****
+    'end': ''
+
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/te.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/te.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/te.js	(revision 76)
@@ -0,0 +1,27 @@
+/* Translators (2009 onwards):
+ *  - Veeven
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["te"]
+ * Dictionary for à°€à±à°²à±à°à±.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["te"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "à°žà±à°¥à°¿à°°à°²à°¿à°à°à±",
+
+    'W': "à°ª",
+
+    'E': "à°€à±",
+
+    'N': "à°",
+
+    'S': "à°Š"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/be-tarask.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/be-tarask.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/be-tarask.js	(revision 76)
@@ -0,0 +1,89 @@
+/* Translators (2009 onwards):
+ *  - EugeneZelenko
+ *  - Jim-by
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["be-tarask"]
+ * Dictionary for ÐÐµÐ»Ð°ÑÑÑÐºÐ°Ñ (ÑÐ°ÑÐ°ÑÐºÐµÐ²ÑÑÐ°).  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["be-tarask"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "ÐÐµÐ°Ð¿ÑÐ°ÑÐ°Ð²Ð°ÐœÑ Ð²ÑÐœÑÐº Ð·Ð°Ð¿ÑÑÑ ${statusText}",
+
+    'permalink': "Ð¡ÑÐ°Ð»Ð°Ñ ÑÐ¿Ð°ÑÑÐ»ÐºÐ°",
+
+    'overlays': "Ð¡Ð»Ð°Ñ",
+
+    'baseLayer': "ÐÐ°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹",
+
+    'sameProjection': "ÐÐ³Ð»ÑÐŽÐœÐ°Ñ ÐŒÐ°Ð¿Ð° Ð¿ÑÐ°ÑÑÐµ ÑÐŸÐ»ÑÐºÑ ÐºÐ°Ð»Ñ ÑÐœÐ° ÐŒÐ°Ðµ ÑÑÑ Ð¶ Ð¿ÑÐ°ÐµÐºÑÑÑ, ÑÑÐŸ Ñ Ð°ÑÐœÐŸÑÐœÐ°Ñ ÐŒÐ°Ð¿Ð°",
+
+    'readNotImplemented': "Ð€ÑÐœÐºÑÑÑÐœÐ°Ð»ÑÐœÐ°ÑÑÑÑ ÑÑÑÐ°ÐœÑÐœÑ ÐœÑ ÑÑÐ²ÐŸÑÐ°ÐœÐ°Ñ.",
+
+    'writeNotImplemented': "Ð€ÑÐœÐºÑÑÑÐœÐ°Ð»ÑÐœÐ°ÑÑÑÑ Ð·Ð°Ð¿ÑÑÑ ÐœÑ ÑÑÐ²ÐŸÑÐ°ÐœÐ°Ñ.",
+
+    'noFID': "ÐÐµÐŒÐ°Ð³ÑÑÐŒÐ° Ð°Ð±ÐœÐ°Ð²ÑÑÑ ÐŒÐ°Ð³ÑÑÐŒÐ°ÑÑÑÑ, ÐŽÐ»Ñ ÑÐºÐŸÐ³Ð° ÐœÐµ ÑÑÐœÑÐµ FID.",
+
+    'errorLoadingGML': "ÐÐ°ÐŒÑÐ»ÐºÐ° Ð·Ð°Ð³ÑÑÐ·ÐºÑ ÑÐ°Ð¹Ð»Ð° GML ${url}",
+
+    'browserNotSupported': "ÐÐ°Ñ Ð±ÑÐ°ÑÐ·ÑÑ ÐœÐµ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°Ðµ Ð²ÑÐºÑÐ°ÑÐœÑÑ Ð³ÑÐ°ÑÑÐºÑ. Ð£ ÑÑÐ¿ÐµÑÐ°ÑÐœÑ ÐŒÐŸÐŒÐ°ÐœÑ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°ÑÑÑÐ°: ${renderers}",
+
+    'componentShouldBe': "addFeatures : ÐºÐ°ÐŒÐ¿Ð°ÐœÑÐœÑ Ð¿Ð°Ð²ÑÐœÐµÐœ Ð±ÑÑÑ ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent Ð²ÑÐºÐ»ÑÐºÐ°ÐœÑ ÐŽÐ»Ñ ÑÐ»ÐŸÑ Ð±ÑÐ· ÑÑÐœÐŽÑÑÑ. ÐÐ²ÑÑÐ°Ð¹ÐœÐ° Ð³ÑÑÐ° Ð°Ð·ÐœÐ°ÑÐ°Ðµ, ÑÑÐŸ ÐÑ Ð·ÑÐœÑÑÑÑÐ»Ñ ÑÐ»ÐŸÐ¹, Ð°Ð»Ðµ Ð¿Ð°ÐºÑÐœÑÐ»Ñ Ð·ÑÐ²ÑÐ·Ð°ÐœÑ Ð·Ñ ÑÐŒ Ð°Ð¿ÑÐ°ÑÐŸÑÑÑÑÐº.",
+
+    'minZoomLevelError': "Ð£Ð»Ð°ÑÑÑÑÐ²Ð°ÑÑÑÑ minZoomLevel Ð¿ÑÑÐ·ÐœÐ°ÑÐ°ÐœÐ° ÑÐŸÐ»ÑÐºÑ ÐŽÐ»Ñ Ð²ÑÐºÐ°ÑÑÑÑÐ°ÐœÑÐœÑ ÑÐ° ÑÐ»Ð°ÑÐŒÑ Ð²ÑÑÐ²ÐŸÑÐœÑÐŒÑ Ð°ÐŽ FixedZoomLevels. Ð¢ÐŸÐµ, ÑÑÐŸ  Ð³ÑÑÑ wfs-ÑÐ»ÐŸÐ¹ Ð¿ÑÐ°Ð²ÑÑÐ°ÐµÑÑÐ° ÐœÐ° minZoomLevel â ÑÑÑ
+Ð° Ð¿ÑÐŸÑÐ»Ð°Ð³Ð°. ÐÐ»Ðµ ÐŒÑ ÐœÑ ÐŒÐŸÐ¶Ð°ÐŒ Ð²ÑÐŽÐ°Ð»ÑÑÑ Ð³ÑÑÑÑ ÐŒÐ°Ð³ÑÑÐŒÐ°ÑÑÑÑ, ÑÐ°ÐŒÑ ÑÑÐŸ Ð°ÐŽ ÑÐµ Ð·Ð°Ð»ÐµÐ¶Ð°ÑÑ ÐœÐµÐºÐ°ÑÐŸÑÑÑ Ð·Ð°ÑÐœÐ°Ð²Ð°ÐœÑÑ ÐœÐ° OL ÐŽÐ°ÑÑÐ°ÑÐ°Ð²Ð°ÐœÑÐœÑ. Ð¢ÑÐŒ ÐœÑ ÐŒÐµÐœÑ, Ð¿ÑÐ°Ð²ÐµÑÐºÐ° minZoomLevel Ð±ÑÐŽÐ·Ðµ Ð²ÑÐŽÐ°Ð»ÐµÐœÐ°Ñ Ñ Ð²ÑÑÑÑÑ 3.0. ÐÐ°Ð»Ñ Ð»Ð°ÑÐºÐ°, Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°ÐµÑÐµ Ð·Ð°ÐŒÐµÑÑ ÑÐµ ÑÑÑÐ°ÐœÐŸÑÐºÑ ÐŒÑÐœÑÐŒÐ°Ð»ÑÐœÐ°Ð³Ð°/ÐŒÐ°ÐºÑÑÐŒÐ°Ð»ÑÐœÐ°Ð³Ð° Ð¿Ð°ÐŒÐµÑÐ°Ñ, ÑÐº Ð°Ð¿ÑÑÐ°ÐœÐ° ÑÑÑ: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-ÑÑÐ°ÐœÐ·Ð°ÐºÑÑÑ: ÐÐÐ¡Ð¬ÐÐÐ¥ ${response}",
+
+    'commitFailed': "WFS-ÑÑÐ°ÐœÐ·Ð°ÐºÑÑÑ: ÐÐÐÐ«ÐÐÐ ${response}",
+
+    'googleWarning': "ÐÐµ Ð°ÑÑÑÐŒÐ°Ð»Ð°ÑÑ Ð·Ð°Ð³ÑÑÐ·ÑÑÑ ÑÐ»ÐŸÐ¹ Google. \x3cbr\x3e\x3cbr\x3eÐÐ°Ð± Ð¿Ð°Ð·Ð±Ð°Ð²ÑÑÑÐ° Ð³ÑÑÐ°Ð³Ð° Ð¿Ð°Ð²ÐµÐŽÐ°ÐŒÐ»ÐµÐœÑÐœÑ, Ð²ÑÐ±ÐµÑÑÑÐµ ÐœÐŸÐ²Ñ Ð±Ð°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹ Ñ ÑÑÐ¿ÑÑÐµ Ñ Ð²ÐµÑÑ
+ÐœÑÐŒ Ð¿ÑÐ°Ð²ÑÐŒ ÐºÑÑÐµ.\x3cbr\x3e\x3cbr\x3e Ð¥ÑÑÑÑÐ¹ Ð·Ð° ÑÑÑ, Ð¿ÑÑÑÑÐœÐ° Ñ ÑÑÐŒ, ÑÑÐŸ ÑÐºÑÑÐ¿Ñ Ð±ÑÐ±Ð»ÑÑÑÑÐºÑ Google Maps ÐœÑ Ð±ÑÑ ÑÐºÐ»ÑÑÐ°ÐœÑÑ Ð°Ð»ÑÐ±ÐŸ ÐœÐµ ÑÑÑÑÐŒÐ»ÑÐ²Ð°Ðµ ÑÐ»ÑÑÐœÑ API-ÐºÐ»ÑÑ ÐŽÐ»Ñ ÐÐ°ÑÐ°Ð³Ð° ÑÐ°Ð¹ÑÐ°.\x3cbr\x3e\x3cbr\x3eÐ Ð°ÑÐ¿ÑÐ°ÑÐŸÑÑÑÑÐºÐ°ÐŒ: ÐÐ»Ñ ÑÐ°Ð³ÐŸ, ÐºÐ°Ð± ÐŽÐ°Ð²ÐµÐŽÐ°ÑÑÐ° ÑÐº Ð·ÑÐ°Ð±ÑÑÑ ÑÐ°Ðº, ÐºÐ°Ð± ÑÑÑ Ð¿ÑÐ°ÑÐ°Ð²Ð°Ð»Ð°, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eÐœÐ°ÑÑÑÑÐœÑÑÐµ ÑÑÑ\x3c/a\x3e",
+
+    'getLayerWarning': "ÐÐµÐŒÐ°Ð³ÑÑÐŒÐ° Ð·Ð°Ð³ÑÑÐ·ÑÑÑ ÑÐ»ÐŸÐ¹ ${layerType}.\x3cbr\x3e\x3cbr\x3eÐÐ°Ð± Ð¿Ð°Ð·Ð±Ð°Ð²ÑÑÑÐ° Ð³ÑÑÐ°Ð³Ð° Ð¿Ð°Ð²ÐµÐŽÐ°ÐŒÐ»ÐµÐœÑÐœÑ, Ð²ÑÐ±ÐµÑÑÑÐµ ÐœÐŸÐ²Ñ Ð±Ð°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹ Ñ ÑÑÐ¿ÑÑÐµ Ñ Ð²ÐµÑÑ
+ÐœÑÐŒ Ð¿ÑÐ°Ð²ÑÐŒ ÐºÑÑÐµ.\x3cbr\x3e\x3cbr\x3eÐ¥ÑÑÑÑÐ¹ Ð·Ð° ÑÑÑ, Ð¿ÑÑÑÑÐœÐ° Ñ ÑÑÐŒ, ÑÑÐŸ ÑÐºÑÑÐ¿Ñ Ð±ÑÐ±Ð»ÑÑÑÑÐºÑ ${layerLib} ÐœÑ Ð±ÑÑ ÑÐ»ÑÑÐœÐ° ÑÐºÐ»ÑÑÐ°ÐœÑ.\x3cbr\x3e\x3cbr\x3eÐ Ð°ÑÐ¿ÑÐ°ÑÐŸÑÑÑÑÐºÐ°ÐŒ: ÐÐ»Ñ ÑÐ°Ð³ÐŸ, ÐºÐ°Ð± ÐŽÐ°Ð²ÐµÐŽÐ°ÑÑÐ° ÑÐº Ð·ÑÐ°Ð±ÑÑÑ ÑÐ°Ðº, ÐºÐ°Ð± ÑÑÑ Ð¿ÑÐ°ÑÐ°Ð²Ð°Ð»Ð°, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eÐœÐ°ÑÑÑÑÐœÑÑÐµ ÑÑÑ\x3c/a\x3e",
+
+    'scale': "ÐÐ°ÑÑÐ°Ð± = 1 : ${scaleDenom}",
+
+    'W': "Ð",
+
+    'E': "Ð£",
+
+    'N': "ÐÐœ",
+
+    'S': "ÐÐŽ",
+
+    'layerAlreadyAdded': "ÐÑ Ð¿Ð°ÑÐ¿ÑÐ°Ð±Ð°Ð²Ð°Ð»Ñ ÐŽÐ°ÐŽÐ°ÑÑ ÑÐ»ÐŸÐ¹ ${layerName} ÐœÐ° ÐŒÐ°Ð¿Ñ, Ð°Ð»Ðµ ÑÐœ ÑÐ¶ÐŸ ÐŽÐ°ÐŽÐ°ÐŽÐ·ÐµÐœÑ",
+
+    'reprojectDeprecated': "ÐÑ Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°ÐµÑÐµ ÑÑÑÐ°ÐœÐŸÑÐºÑ \'reproject\' ÐŽÐ»Ñ ÑÐ»ÐŸÑ ${layerName}. ÐÑÑÐ°Ñ ÑÑÑÐ°ÐœÐŸÑÐºÐ° Ð·ÑÑÑÐ»ÑÐµÑÑÐ° ÑÐ°ÑÑÐ°ÑÑÐ»Ð°Ð¹: ÑÐœÐ° Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°Ð»Ð°ÑÑ ÐŽÐ»Ñ Ð¿Ð°ÐŽÑÑÑÐŒÐºÑ Ð¿Ð°ÐºÐ°Ð·Ñ Ð·ÑÐ²ÐµÑÑÐ°Ðº ÐœÐ° ÐºÐ°ÐŒÑÑÑÑÐ¹ÐœÑÑ
+ Ð±Ð°Ð·Ð°Ð²ÑÑ
+ ÐŒÐ°Ð¿Ð°Ñ
+, Ð°Ð»Ðµ Ð³ÑÑÐ° ÑÑÐœÐºÑÑÑ ÑÑÐ¿ÐµÑ ÑÑÐ°Ð»ÑÐ·Ð°Ð²Ð°ÐœÐ°Ñ Ñ ÑÐ±ÑÐŽÐ°Ð²Ð°ÐœÐ°Ð¹ Ð¿Ð°ÐŽÑÑÑÐŒÑÑ ÑÑÑÑÑÑÐœÐ°Ð¹ Ð¿ÑÐ°ÐµÐºÑÑÑ ÐÑÑÐºÐ°ÑÐ°ÑÐ°. ÐÐ°ÐŽÐ°ÑÐºÐŸÐ²Ð°Ñ ÑÐœÑÐ°ÑÐŒÐ°ÑÑÑ ÑÑÑÑÑ ÐœÐ° http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "ÐÑÑÑ ÐŒÑÑÐ°ÐŽ ÑÐ°ÑÑÐ°ÑÑÐ»Ñ Ñ Ð±ÑÐŽÐ·Ðµ Ð²ÑÐŽÐ°Ð»ÐµÐœÑ Ñ Ð²ÑÑÑÑÑ 3.0. ÐÐ°Ð»Ñ Ð»Ð°ÑÐºÐ°, Ð·Ð°ÐŒÐµÑÑ ÑÐ³ÐŸ Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°Ð¹ÑÐµ ${newMethod}.",
+
+    'boundsAddError': "ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ x Ñ y ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",
+
+    'lonlatAddError': "ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ lon Ñ lat ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",
+
+    'pixelAddError': "ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ x Ñ y ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",
+
+    'unsupportedGeometryType': "Ð¢ÑÐ¿ Ð³ÐµÐ°ÐŒÑÑÑÑÑ ÐœÐµ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°ÐµÑÑÐ°: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition failed: Ð²ÐµÑÐ°Ð³ÐŸÐŽÐœÐ° ÑÐ»ÐµÐŒÑÐœÑ Ð· ÑÐŽÑÐœÑÑÑÑÐºÐ°ÑÐ°ÑÐ°ÐŒ ${elemId} Ð·Ð°Ð¹ÐŒÐ°Ðµ ÐœÑÑÐ»ÑÑÐœÐ°Ðµ ÐŒÐµÑÑÐ°.",
+
+    'filterEvaluateNotImplemented': "evaluate ÐœÐµ ÑÑÐ°Ð»ÑÐ·Ð°Ð²Ð°ÐœÑ ÐŽÐ»Ñ Ð³ÑÑÐ°Ð³Ð° ÑÑÐ¿Ñ ÑÑÐ»ÑÑÑÑ."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-TW.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-TW.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-TW.js	(revision 76)
@@ -0,0 +1,144 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["zh-TW"]
+ * Dictionary for Traditional Chinese. (Used Mainly in Taiwan) 
+ * Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["zh-TW"] = {
+
+    'unhandledRequest': "æªèççè«æ±ïŒå³ååŒçº ${statusText}ã",
+
+    'permalink': "æ°žä¹
+é£çµ",
+
+    'overlays': "é¡å€åå±€",
+
+    'baseLayer': "åºç€åå±€",
+
+    'sameProjection':
+        "å°åçž®èŠœ(OverviewMap)åªèœåšè·äž»å°åçžåæåœ±æèµ·äœçšã",
+
+    'readNotImplemented': "æ²æå¯Šäœè®åçåèœã",
+
+    'writeNotImplemented': "æ²æå¯Šäœå¯«å
+¥çåèœã",
+
+    'noFID': "å çºæ²æ FID æä»¥ç¡æ³æŽæ° featureã",
+
+    'errorLoadingGML': "è®åGMLæªæ¡ ${url} é¯èª€ã",
+
+    'browserNotSupported':
+        "æšççèŠœåšæªæ¯æŽåéæž²æ. ç®åæ¯æŽçæž²ææ¹åŒæ¯:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : å
+ä»¶æè©²çº ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent åšäžåæ²æè¢«æž²æçåå±€è£¡è¢«åŒå«ãééåžžæå³èæš " +
+        "æ§æ¯äºäžååå±€ïŒäœäžŠæªæ§æ¯çžéçhandlerã",
+
+    // console message
+    'minZoomLevelError':
+        "minZoomLevel å±¬æ§å
+é©åçšåš " +
+        "FixedZoomLevels-descendent é¡åçåå±€. éå" +
+        "wfs layer ç minZoomLevel æ¯éå»æéºçäžäŸçïŒ" +
+        "ç¶èæåäžèœç§»é€å®èäžè®å®å°" +
+        "éå»ççšåŒçžå®¹æ§çµŠç Žå£æã" +
+        "å æ­€æåå°æè¿Žé¿äœ¿çšå® -- minZoomLevel " +
+        "æåš3.0è¢«ç§»é€ïŒè«æ¹" +
+        "çšåšééæè¿°ç min/max resolution èš­å®: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS Transaction: æå ${response}",
+
+    'commitFailed': "WFS Transaction: å€±æ ${response}",
+
+    'googleWarning':
+        "The Google Layer åå±€ç¡æ³è¢«æ­£ç¢ºçèŒå
+¥ã<br><br>" +
+        "èŠè¿Žé¿éåèšæ¯, è«åšå³äžè§çåå±€æ¹è®åšè£¡ïŒ" +
+        "éžäžåæ°çåºç€åå±€ã<br><br>" +
+        "åŸæå¯èœæ¯å çº Google Maps çåœåŒåº«" +
+        "è
+³æ¬æ²æè¢«æ­£ç¢ºççœ®å
+¥ïŒææ²æå
+å« " +
+        "æšç¶²ç«äžæ­£ç¢ºç API key <br><br>" +
+        "éçŒè
+: èŠå¹«å©éåè¡çºæ­£ç¢ºå®æïŒ" +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>è«æéè£¡</a>",
+
+    'getLayerWarning':
+        "${layerType} åå±€ç¡æ³è¢«æ­£ç¢ºçèŒå
+¥ã<br><br>" +
+        "èŠè¿Žé¿éåèšæ¯, è«åšå³äžè§çåå±€æ¹è®åšè£¡ïŒ" +
+        "éžäžåæ°çåºç€åå±€ã<br><br>" +
+        "åŸæå¯èœæ¯å çº ${layerLib} çåœåŒåº«" +
+        "è
+³æ¬æ²æè¢«æ­£ç¢ºççœ®å
+¥ã<br><br>" +
+        "éçŒè
+: èŠå¹«å©éåè¡çºæ­£ç¢ºå®æïŒ" +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>è«æéè£¡</a>",
+
+    'scale': "Scale = 1 : ${scaleDenom}",
+
+    // console message
+    'layerAlreadyAdded':
+        "äœ è©Šèæ°å¢åå±€: ${layerName} å°å°åäžïŒäœåå±€ä¹åå°±å·²ç¶è¢«æ°å¢äºã",
+
+    // console message
+    'reprojectDeprecated':
+        "äœ æ­£äœ¿çš 'reproject' éåéžé 
+ " +
+        "åš ${layerName} å±€ãéåéžé 
+å·²ç¶äžåäœ¿çš:" +
+        "å®çäœ¿çšåæ¬æ¯èš­èšçšäŸæ¯æŽåšåæ¥­å°åäžç§åºè³æïŒ" + 
+        "äœéååèœå·²ç¶è¢«" +
+        "Spherical Mercatoræåä»£ãæŽå€çè³èšå¯ä»¥åš " +
+        "http://trac.openlayers.org/wiki/SphericalMercator æŸå°ã",
+
+    // console message
+    'methodDeprecated':
+        "éåæ¹æ³å·²ç¶äžåäœ¿çšäžåš3.0å°æè¢«ç§»é€ïŒ" +
+        "è«äœ¿çš ${newMethod} äŸä»£æ¿ã",
+
+    // console message
+    'boundsAddError': "æšå¿
+é å³å
+¥ x è· y å
+©è
+çåŒé² add åœæžã",
+
+    // console message
+    'lonlatAddError': "æšå¿
+é å³å
+¥ lon è· lat å
+©è
+çåŒé² add åœæžã",
+
+    // console message
+    'pixelAddError': "æšå¿
+é å³å
+¥ x è· y å
+©è
+çåŒé² add åœæžã",
+
+    // console message
+    'unsupportedGeometryType': "æªæ¯æŽçå¹Ÿäœåå¥: ${geomType}ã",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition å€±æ: id ${elemId} ç element å¯èœè¢«é¯çœ®ã",
+                    
+    'end': ''
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/is.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/is.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/is.js	(revision 76)
@@ -0,0 +1,37 @@
+/* Translators (2009 onwards):
+ *  - Ãvar ArnfjÃ¶rÃ° Bjarmason
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["is"]
+ * Dictionary for Ãslenska.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["is"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "Varanlegur tengill",
+
+    'overlays': "Ãekjur",
+
+    'baseLayer': "Grunnlag",
+
+    'sameProjection': "YfirlitskortiÃ° virkar aÃ°eins ef ÃŸaÃ° er Ã­ sÃ¶mu vÃ¶rpun og aÃ°alkortiÃ°",
+
+    'readNotImplemented': "Skrifun er Ã³ÃºtfÃŠrÃ°.",
+
+    'writeNotImplemented': "Lestur er Ã³ÃºtfÃŠrÃ°ur.",
+
+    'errorLoadingGML': "Villa kom upp viÃ° aÃ° hlaÃ°a inn GML skrÃ¡nni ${url}",
+
+    'scale': "Skali = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "ÃÃº reyndir aÃ° bÃŠta laginu ${layerName} Ã¡ kortiÃ° en ÃŸaÃ° er ÃŸegar bÃºiÃ° aÃ° bÃŠta ÃŸvÃ­ viÃ°",
+
+    'methodDeprecated': "Ãetta fall hefur veriÃ° Ãºrelt og verÃ°ur fjarlÃŠgt Ã­ 3.0. NotaÃ°u ${newMethod} Ã­ staÃ°in."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hu.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Translators (2009 onwards):
+ *  - City-busz
+ *  - Glanthor Reviol
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["hu"]
+ * Dictionary for Magyar.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["hu"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Nem kezelt kÃ©rÃ©s visszatÃ©rÃ©se ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "RÃ¡vetÃ­tÃ©sek",
+
+    'baseLayer': "AlaprÃ©teg",
+
+    'sameProjection': "Az Ã¡ttekintÅ tÃ©rkÃ©p csak abban az esetben mÅ±kÃ¶dik, ha ugyanazon a vetÃŒleten van, mint a fÅ tÃ©rkÃ©p.",
+
+    'readNotImplemented': "OlvasÃ¡s nincs vÃ©grehajtva.",
+
+    'writeNotImplemented': "ÃrÃ¡s nincs vÃ©grehajtva.",
+
+    'noFID': "Nem frissÃ­thetÅ olyan jellemzÅ, amely nem rendelkezik FID-del.",
+
+    'errorLoadingGML': "Hiba GML-fÃ¡jl betÃ¶ltÃ©sekor ${url}",
+
+    'browserNotSupported': "A bÃ¶ngÃ©szÅje nem tÃ¡mogatja a vektoros renderelÃ©st. A jelenleg tÃ¡mogatott renderelÅk:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : az Ã¶sszetevÅnek ilyen tÃ­pusÃºnak kell lennie: ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent rÃ©teget hÃ­vott meg renderelÅ nÃ©lkÃŒl. Ez rendszerint azt jelenti, hogy megsemmisÃ­tett egy fÃ³liÃ¡t, de nÃ©hÃ¡ny ahhoz tÃ¡rsÃ­tott kezelÅt nem.",
+
+    'minZoomLevelError': "A minZoomLevel tulajdonsÃ¡got csak a kÃ¶vetkezÅvel valÃ³ hasznÃ¡latra szÃ¡ntÃ¡k: FixedZoomLevels-leszÃ¡rmazott fÃ³liÃ¡k. Ez azt jelenti, hogy a minZoomLevel wfs fÃ³lia jelÃ¶lÅnÃ©gyzetei mÃ¡r a mÃºltÃ©. Mi azonban nem tÃ¡volÃ­thatjuk el annak a veszÃ©lye nÃ©lkÃŒl, hogy az esetlegesen ettÅl fÃŒggÅ OL alapÃº alkalmazÃ¡sokat tÃ¶nkretennÃ©nk. EzÃ©rt ezt Ã©rvÃ©nytelenÃ­tjÃŒk -- a minZoomLevel az alul levÅ jelÃ¶lÅnÃ©gyzet a 3.0-s verziÃ³bÃ³l el lesz tÃ¡volÃ­tva. KÃ©rjÃŒk, helyette hasznÃ¡lja a  min/max felbontÃ¡s beÃ¡llÃ­tÃ¡st, amelyrÅl az alÃ¡bbi helyen talÃ¡l leÃ­rÃ¡st: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS tranzakciÃ³: SIKERES ${response}",
+
+    'commitFailed': "WFS tranzakciÃ³: SIKERTELEN ${response}",
+
+    'googleWarning': "A Google fÃ³lia betÃ¶ltÃ©se sikertelen.\x3cbr\x3e\x3cbr\x3eAhhoz, hogy ez az ÃŒzenet eltÅ±njÃ¶n, vÃ¡lasszon egy Ãºj BaseLayer fÃ³liÃ¡t a jobb felsÅ sarokban talÃ¡lhatÃ³ fÃ³liakapcsolÃ³ segÃ­tsÃ©gÃ©vel.\x3cbr\x3e\x3cbr\x3eNagy valÃ³szÃ­nÅ±sÃ©ggel ez azÃ©rt van, mert a Google Maps kÃ¶nyvtÃ¡r parancsfÃ¡jlja nem talÃ¡lhatÃ³, vagy nem tartalmazza az Ãn oldalÃ¡hoz tartozÃ³ megfelelÅ API-kulcsot.\x3cbr\x3e\x3cbr\x3eFejlesztÅknek: A helyes mÅ±kÃ¶dtetÃ©sre vonatkozÃ³ segÃ­tsÃ©g az alÃ¡bbi helyen Ã©rhetÅ el, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3ekattintson ide\x3c/a\x3e",
+
+    'getLayerWarning': "A(z) ${layerType} fÃ³lia nem tÃ¶ltÅdÃ¶tt be helyesen.\x3cbr\x3e\x3cbr\x3eAhhoz, hogy ez az ÃŒzenet eltÅ±njÃ¶n, vÃ¡lasszon egy Ãºj BaseLayer fÃ³liÃ¡t a jobb felsÅ sarokban talÃ¡lhatÃ³ fÃ³liakapcsolÃ³ segÃ­tsÃ©gÃ©vel.\x3cbr\x3e\x3cbr\x3eNagy valÃ³szÃ­nÅ±sÃ©ggel ez azÃ©rt van, mert a(z) ${layerLib} kÃ¶nyvtÃ¡r parancsfÃ¡jlja helytelen.\x3cbr\x3e\x3cbr\x3eFejlesztÅknek: A helyes mÅ±kÃ¶dtetÃ©sre vonatkozÃ³ segÃ­tsÃ©g az alÃ¡bbi helyen Ã©rhetÅ el, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3ekattintson ide\x3c/a\x3e",
+
+    'scale': "LÃ©ptÃ©k = 1 : ${scaleDenom}",
+
+    'W': "Ny",
+
+    'E': "K",
+
+    'N': "Ã",
+
+    'S': "D",
+
+    'layerAlreadyAdded': "MegprÃ³bÃ¡lta hozzÃ¡adni a(z) ${layerName} fÃ³liÃ¡t a tÃ©rkÃ©phez, de az mÃ¡r hozzÃ¡ van adva",
+
+    'reprojectDeprecated': "Ãn a \'reproject\' beÃ¡llÃ­tÃ¡st hasznÃ¡lja a(z) ${layerName} fÃ³liÃ¡n. Ez a beÃ¡llÃ­tÃ¡s Ã©rvÃ©nytelen: hasznÃ¡lata az ÃŒzleti alaptÃ©rkÃ©pek fÃ¶lÃ¶tti adatok megjelenÃ­tÃ©sÃ©nek tÃ¡mogatÃ¡sÃ¡ra szolgÃ¡lt, de ezt a funkciÃ³ ezentÃºl a GÃ¶mbi Mercator hasznÃ¡latÃ¡val Ã©rhetÅ el. TovÃ¡bbi informÃ¡ciÃ³ az alÃ¡bbi helyen Ã©rhetÅ el: http://trac.openlayers.org/wiki/SphericalMercator",
+
+    'methodDeprecated': "Ez a mÃ³dszer Ã©rvÃ©nytelenÃ­tve lett Ã©s a 3.0-s verziÃ³bÃ³l el lesz tÃ¡volÃ­tva. HasznÃ¡lja a(z) ${newMethod} mÃ³dszert helyette.",
+
+    'boundsAddError': "Az x Ã©s y Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",
+
+    'lonlatAddError': "A hossz. Ã©s szÃ©l. Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",
+
+    'pixelAddError': "Az x Ã©s y Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",
+
+    'unsupportedGeometryType': "Nem tÃ¡mogatott geometriatÃ­pus: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition sikertelen: lehetsÃ©ges, hogy a(z) ${elemId} azonosÃ­tÃ³jÃº elem tÃ©ves helyre kerÃŒlt.",
+
+    'filterEvaluateNotImplemented': "ennÃ©l a szÅ±rÅtÃ­pusnÃ¡l kiÃ©rtÃ©kelÃ©s nem hajtÃ³dik vÃ©gre."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hsb.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hsb.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hsb.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Michawiki
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["hsb"]
+ * Dictionary for Hornjoserbsce.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["hsb"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "WotmoÅwa njewobdÅºÄÅaneho napraÅ¡owanja ${statusText}",
+
+    'permalink': "Trajny wotkaz",
+
+    'overlays': "NaworÅ¡towanja",
+
+    'baseLayer': "ZakÅadna runina",
+
+    'sameProjection': "PÅehladowa karta jenoÅŸ funguje, hdyÅŸ je w samsnej projekciji kaÅŸ hÅowna karta",
+
+    'readNotImplemented': "Äitanje njeimplementowane.",
+
+    'writeNotImplemented': "Pisanje njeimplementowane.",
+
+    'noFID': "Funkcija, za kotruÅŸ FID njeje, njeda so aktualizowaÄ.",
+
+    'errorLoadingGML': "Zmylk pÅi zaÄitowanju dataje ${url}",
+
+    'browserNotSupported': "TwÃ³j wobhladowak wektorowe rysowanje njepodpÄruje. Tuchwilu podpÄrowane rysowaki su:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: komponenta mÄÅa ${geomType} byÄ",
+
+    'getFeatureError': "getFeatureFromEvent bu na worÅ¡Äe bjez rysowak zawoÅany. To zwjetÅ¡a woznamjenja, zo sy worÅ¡tu zniÄiÅ, ale nic wobdÅºÄÅak, kotryÅŸ je z njej zwjazany.",
+
+    'minZoomLevelError': "KajkosÄ minZoomLevel je jenoÅŸ za wuÅŸiwanje z worÅ¡tami myslena, kotreÅŸ wot FixedZoomLevels pochadÅºeja. Zo tuta worÅ¡ta wfs za minZoomLevel pÅepruwuje, je relikt zaÅdÅºenosÄe. NjemÃ³ÅŸemy wÅ¡ak ju wotstroniÄ, bjeztoho zo aplikacije, kotreÅŸ na OpenLayers bazÄruja a snano tutu kajkosÄ wuÅŸiwaja, hiÅŸo njefunguja. Tohodla smy ju jako zestarjenu woznamjenili -- pÅepruwowanje za minZoomLevel budu so we wersiji 3.0 wotstronjeÄ. ProÅ¡u wuÅŸij mÄsto toho nastajenje min/max, kaÅŸ je tu wopisane: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-Transakcija: WUSPÄÅ NA ${response}",
+
+    'commitFailed': "WFS-Transakcija: NJEPORADÅ¹ENA ${response}",
+
+    'googleWarning': "WorÅ¡ta Google njemÃ³ÅŸeÅ¡e so korektnje zaÄitaÄ.\x3cbr\x3e\x3cbr\x3eZo by tutu zdÅºÄlenku wotbyÅ, wubjer nowy BaseLayer z wubÄra worÅ¡tow horjeka naprawo.\x3cbr\x3e\x3cbr\x3eNajskerje so to stawa, dokelÅŸ skript biblioteki Google Maps pak njebu zapÅijaty pak njewobsahuje korektny kluÄ API za twoje sydÅo.\x3cbr\x3e\x3cbr\x3eWuwiwarjo: Za pomoc ke korektnemu fungowanju worÅ¡tow\n\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3etu kliknyÄ\x3c/a\x3e",
+
+    'getLayerWarning': "WorÅ¡ta ${layerType} njemÃ³ÅŸeÅ¡e so korektnje zaÄitaÄ.\x3cbr\x3e\x3cbr\x3eZo by tutu zdÅºÄlenku wotbyÅ, wubjer nowy BaseLayer z wubÄra worÅ¡tow horjeka naprawo.\x3cbr\x3e\x3cbr\x3eNajskerje so to stawa, dokelÅŸ skript biblioteki ${layerLib} njebu korektnje zapÅijaty.\x3cbr\x3e\x3cbr\x3eWuwiwarjo: Za pomoc ke korektnemu fungowanju worÅ¡tow\n\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3etu kliknyÄ\x3c/a\x3e",
+
+    'scale': "MÄritko = 1 : ${scaleDenom}",
+
+    'W': "Z",
+
+    'E': "W",
+
+    'N': "S",
+
+    'S': "J",
+
+    'layerAlreadyAdded': "Sy spytaÅ runinu ${layerName} karÄe dodaÄ, ale je so hiÅŸo dodaÅa",
+
+    'reprojectDeprecated': "WuÅŸiwaÅ¡ opciju \"reproject\" woÅÅ¡ty ${layerName}. Tuta opcija je zestarjena: jeje wuÅŸiwanje bÄ myslene, zo by zwobraznjenje datow nad komercielnymi bazowymi kartami podpÄraÅo, ale funkcionalnosÄ mÄÅa so nÄtko z pomocu Sperical Mercator docpÄÄ. DalÅ¡e informacije steja na http://trac.openlayers.org/wiki/SphericalMercator k dispoziciji.",
+
+    'methodDeprecated': "Tuta metoda je so njeschwaliÅa a budÅºe so w 3.0 wotstronjeÄ. ProÅ¡u wuÅŸij ${newMethod} mÄsto toho.",
+
+    'boundsAddError': "DyrbiÅ¡ hÃ³dnotu x kaÅŸ teÅŸ y funkciji \"add\" pÅepodaÄ.",
+
+    'lonlatAddError': "DyrbiÅ¡ hÃ³dnotu lon kaÅŸ teÅŸ lat funkciji \"add\" pÅepodaÄ.",
+
+    'pixelAddError': "DyrbiÅ¡ hÃ³dnotu x kaÅŸ teÅŸ y funkciji \"add\" pÅepodaÄ.",
+
+    'unsupportedGeometryType': "NjepodpÄrowany geometrijowy typ: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition je so njeporadÅºiÅ: element z id ${elemId} bu snano wopak zamÄstnjeny.",
+
+    'filterEvaluateNotImplemented': "wuhÃ³dnoÄenje njeje za tutÃ³n filtrowy typ implementowany."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sk.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sk.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sk.js	(revision 76)
@@ -0,0 +1,71 @@
+/* Translators (2009 onwards):
+ *  - Helix84
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["sk"]
+ * Dictionary for SlovenÄina.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["sk"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "NeobslÃºÅŸenÃ© poÅŸiadavky vracajÃº ${statusText}",
+
+    'permalink': "TrvalÃœ odkaz",
+
+    'overlays': "Prekrytia",
+
+    'baseLayer': "ZÃ¡kladnÃ¡ vrstva",
+
+    'sameProjection': "PrehÄŸadovÃ¡ mapka funguje iba vtedy, keÄ je v rovnakej projekcii ako hlavnÃ¡ mapa",
+
+    'readNotImplemented': "ÄÃ­tanie nie je implementovanÃ©.",
+
+    'writeNotImplemented': "ZÃ¡pis nie je implementovanÃœ.",
+
+    'noFID': "Nie je moÅŸnÃ© aktualizovaÅ¥ vlastnosÅ¥, pre ktorÃº neexistuje FID.",
+
+    'errorLoadingGML': "Chyba pri naÄÃ­tanÃ­ sÃºboru GML ${url}",
+
+    'browserNotSupported': "VÃ¡Å¡ prehliadaÄ nepodporuje vykresÄŸovanie vektorov. MomentÃ¡lne podporovanÃ© vykresÄŸovaÄe sÃº:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: komponent by mal byÅ¥ ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent bola zavolanÃ¡ na vrstve bez vykresÄŸovaÄa. To zvyÄajne znamenÃ¡, ÅŸe ste odstrÃ¡nili vrstvu, ale nie niektorÃº z obslÃºh, ktorÃ¡ je s Åou asociovanÃ¡.",
+
+    'minZoomLevelError': "VlastnosÅ¥ minZoomLevel je urÄenÃœ iba na pouÅŸitie s vrstvami odvodenÃœmi od FixedZoomLevels. To, ÅŸe tÃ¡to wfs vrstva kontroluje minZoomLevel je pozostatok z minulosti. NemÃŽÅŸeme ho vÅ¡ak odstrÃ¡niÅ¥, aby sme sa vyhli moÅŸnÃ©mu poruÅ¡eniu aplikÃ¡ciÃ­ zaloÅŸenÃœch na Open Layers, ktorÃ© na tomto mÃŽÅŸe zÃ¡visieÅ¥. Preto ho oznaÄujeme ako zavrhovanÃœ - dolu uvedenÃ¡ kontrola minZoomLevel bude odstrÃ¡nenÃ¡ vo verzii 3.0. PouÅŸite prosÃ­m namiesto toho kontrolu min./max. rozlÃ­Å¡enia podÄŸa tu uvedenÃ©ho popisu: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Transakcia WFS: ÃSPEÅ NÃ ${response}",
+
+    'commitFailed': "Transakcia WFS: ZLYHALA ${response}",
+
+    'googleWarning': "Vrstvu Google nebolo moÅŸnÃ© sprÃ¡vne naÄÃ­taÅ¥.\x3cbr\x3e\x3cbr\x3eAby ste sa tejto sprÃ¡vy zbavili vyberte novÃº BaseLayer v prepÃ­naÄi vrstiev v pravom hornom rohu.\x3cbr\x3e\x3cbr\x3eToto sa stalo pravdepodobne preto, ÅŸe skript kniÅŸnice Google Maps buÄ nebol naÄÃ­tanÃœ alebo neobsahuje sprÃ¡vny kÄŸÃºÄ API pre vaÅ¡u lokalitu.\x3cbr\x3e\x3cbr\x3eVÃœvojÃ¡ri: Tu mÃŽÅŸete zÃ­skaÅ¥ \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3epomoc so sfunkÄnenÃ­m\x3c/a\x3e",
+
+    'getLayerWarning': "Vrstvu ${layerType} nebolo moÅŸnÃ© sprÃ¡vne naÄÃ­taÅ¥.\x3cbr\x3e\x3cbr\x3eAby ste sa tejto sprÃ¡vy zbavili vyberte novÃº BaseLayer v prepÃ­naÄi vrstiev v pravom hornom rohu.\x3cbr\x3e\x3cbr\x3eToto sa stalo pravdepodobne preto, ÅŸe skript kniÅŸnice ${layerType} buÄ nebol naÄÃ­tanÃœ alebo neobsahuje sprÃ¡vny kÄŸÃºÄ API pre vaÅ¡u lokalitu.\x3cbr\x3e\x3cbr\x3eVÃœvojÃ¡ri: Tu mÃŽÅŸete zÃ­skaÅ¥ \x3ca href=\'http://trac.openlayers.org/wiki/${layerType}\' target=\'_blank\'\x3epomoc so sfunkÄnenÃ­m\x3c/a\x3e",
+
+    'scale': "Mierka = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "PokÃºsili ste sa do mapy pridaÅ¥ vrstvu ${layerName}, ale tÃ¡ uÅŸ bola pridanÃ¡",
+
+    'reprojectDeprecated': "PouÅŸÃ­vate voÄŸby âreprojectâ vrstvy ${layerType}. TÃ¡to voÄŸba je zzavrhovanÃ¡: jej pouÅŸitie bolo navrhnutÃ© na podporu zobrazovania Ãºdajov nad komerÄnÃœmi zÃ¡kladovÃœmi mapami, ale tÃºto funkcionalitu je teraz moÅŸnÃ© dosiahnuÅ¥ pomocou Spherical Mercator. ÄalÅ¡ie informÃ¡cie zÃ­skate na strÃ¡nke http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "TÃ¡to metÃ³da je zavrhovanÃ¡ a bude odstrÃ¡nenÃ¡ vo verzii 3.0. PouÅŸite prosÃ­m namiesto nej metÃ³du ${newMethod}.",
+
+    'boundsAddError': "SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty x aj y.",
+
+    'lonlatAddError': "SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty lon (zem. dÄºÅŸka) aj lat (zem. Å¡Ã­rka).",
+
+    'pixelAddError': "SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty x aj y.",
+
+    'unsupportedGeometryType': "NepodporovanÃœ typ geometrie: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition zlyhalo: prvok s id ${elemId} mÃŽÅŸe byÅ¥ zle umiestnenÃœ.",
+
+    'filterEvaluateNotImplemented': "evaluate nie je implementovanÃœ pre tento typ filtra"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/vi.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/vi.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/vi.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Minh Nguyen
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["vi"]
+ * Dictionary for Tiáº¿ng Viá»t.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["vi"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "KhÃŽng xá»­ lÃœ ÄÆ°á»£c pháº£n há»i ${statusText} cho yÃªu cáº§u",
+
+    'permalink': "LiÃªn káº¿t thÆ°á»ng trá»±c",
+
+    'overlays': "Láº¥p báº£n Äá»",
+
+    'baseLayer': "Lá»p ná»n",
+
+    'sameProjection': "Báº£n Äá» toÃ n cáº£nh chá» hoáº¡t Äá»ng khi cÃ¹ng phÃ©p chiáº¿u vá»i báº£n Äá» chÃ­nh",
+
+    'readNotImplemented': "ChÆ°a há» trá»£ chá»©c nÄng Äá»c.",
+
+    'writeNotImplemented': "ChÆ°a há» trá»£ chá»©c nÄng viáº¿t.",
+
+    'noFID': "KhÃŽng thá» cáº­p nháº­t tÃ­nh nÄng thiáº¿u FID.",
+
+    'errorLoadingGML': "Lá»i táº£i táº­p tin GML táº¡i ${url}",
+
+    'browserNotSupported': "TrÃ¬nh duyá»t cá»§a báº¡n khÃŽng há» trá»£ chá»©c nÄng váºœ báº±ng vectÆ¡. Hiá»n há» trá»£ cÃ¡c bá» káº¿t xuáº¥t:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: bá» pháº­n cáº§n pháº£i lÃ  ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent ÄÆ°á»£c gá»i tá»« lá»p khÃŽng cÃ³ bá» káº¿t xuáº¥t. ThÆ°á»ng thÃ¬ cÃ³ láºœ lá»p bá» xÃ³a nhÆ°ng má»t pháº§n xá»­ lÃœ cá»§a nÃ³ váº«n cÃ²n.",
+
+    'minZoomLevelError': "Chá» nÃªn sá»­ dá»¥ng thuá»c tÃ­nh minZoomLevel vá»i cÃ¡c lá»p FixedZoomLevels-descendent. Viá»c lá»p wfs nÃ y tÃ¬m cho minZoomLevel lÃ  di tÃ­ch cÃ²n láº¡i tá»« xÆ°a. Tuy nhiÃªn, náº¿u chÃºng tÃŽi dá»i nÃ³ thÃ¬ sáºœ vá»¡ cÃ¡c chÆ°Æ¡ng trÃ¬nh OpenLayers mÃ  dá»±a trÃªn nÃ³. Bá»i váº­y chÃºng tÃŽi pháº£n Äá»i sá»­ dá»¥ng nÃ³\x26nbsp;â bÆ°á»c tÃ¬m cho minZoomLevel sáºœ ÄÆ°á»£c dá»i vÃ o phiÃªn báº£n 3.0. Xin sá»­ dá»¥ng thiáº¿t láº­p Äá» phÃ¢n tÃ­ch tá»i thiá»u / tá»i Äa thay tháº¿, theo hÆ°á»ng dáº«n nÃ y: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Giao dá»ch WFS: THÃNH CÃNG ${response}",
+
+    'commitFailed': "Giao dá»ch WFS: THáº€T Báº I ${response}",
+
+    'googleWarning': "KhÃŽng thá» táº£i lá»p Google ÄÃºng Äáº¯n.\x3cbr\x3e\x3cbr\x3eÄá» trÃ¡nh thÃŽng bÃ¡o nÃ y láº§n sau, hÃ£y chá»n BaseLayer má»i dÃ¹ng Äiá»u khiá»n chá»n lá»p á» gÃ³c trÃªn pháº£i.\x3cbr\x3e\x3cbr\x3eCháº¯c script thÆ° viá»n Google Maps hoáº·c khÃŽng ÄÆ°á»£c bao gá»m hoáº·c khÃŽng chá»©a khÃ³a API há»£p vá»i website cá»§a báº¡n.\x3cbr\x3e\x3cbr\x3e\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eTrá»£ giÃºp vá» tÃ­nh nÄng nÃ y\x3c/a\x3e cho ngÆ°á»i phÃ¡t triá»n.",
+
+    'getLayerWarning': "KhÃŽng thá» táº£i lá»p ${layerType} ÄÃºng Äáº¯n.\x3cbr\x3e\x3cbr\x3eÄá» trÃ¡nh thÃŽng bÃ¡o nÃ y láº§n sau, hÃ£y chá»n BaseLayer má»i dÃ¹ng Äiá»u khiá»n chá»n lá»p á» gÃ³c trÃªn pháº£i.\x3cbr\x3e\x3cbr\x3eCháº¯c script thÆ° viá»n ${layerLib} khÃŽng ÄÆ°á»£c bao gá»m ÄÃºng kiá»u.\x3cbr\x3e\x3cbr\x3e\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eTrá»£ giÃºp vá» tÃ­nh nÄng nÃ y\x3c/a\x3e cho ngÆ°á»i phÃ¡t triá»n.",
+
+    'scale': "Tá»· lá» = 1 : ${scaleDenom}",
+
+    'W': "T",
+
+    'E': "Ä",
+
+    'N': "B",
+
+    'S': "N",
+
+    'layerAlreadyAdded': "Báº¡n muá»n thÃªm lá»p ${layerName} vÃ o báº£n Äá», nhÆ°ng lá»p nÃ y ÄÃ£ ÄÆ°á»£c thÃªm",
+
+    'reprojectDeprecated': "Báº¡n Äang Ã¡p dá»¥ng cháº¿ Äá» âreprojectâ vÃ o lá»p ${layerName}. Cháº¿ Äá» nÃ y ÄÃ£ bá» pháº£n Äá»i: nÃ³ cÃ³ má»¥c ÄÃ­ch há» trá»£ láº¥p dá»¯ liá»u trÃªn cÃ¡c ná»n báº£n Äá» thÆ°Æ¡ng máº¡i; nÃªn thá»±c hiá»n hiá»u á»©ng ÄÃ³ dÃ¹ng tÃ­nh nÄng Mercator HÃ¬nh cáº§u. CÃ³ sáºµn thÃªm chi tiáº¿t táº¡i http://trac.openlayers.org/wiki/SphericalMercator .",
+
+    'methodDeprecated': "PhÆ°Æ¡ng thá»©c nÃ y ÄÃ£ bá» pháº£n Äá»i vÃ  sáºœ bá» dá»i vÃ o phiÃªn báº£n 3.0. Xin hÃ£y sá»­ dá»¥ng ${newMethod} thay tháº¿.",
+
+    'boundsAddError': "Cáº§n pháº£i cho cáº£ giÃ¡ trá» x vÃ  y vÃ o hÃ m add.",
+
+    'lonlatAddError': "Cáº§n pháº£i cho cáº£ giÃ¡ trá» lon vÃ  lat vÃ o hÃ m add.",
+
+    'pixelAddError': "Cáº§n pháº£i cho cáº£ giÃ¡ trá» x vÃ  y vÃ o hÃ m add.",
+
+    'unsupportedGeometryType': "KhÃŽng há» trá»£ kiá»u Äá»a lÃœ: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition bá» tháº¥t báº¡i: nguyÃªn tá» vá»i ID ${elemId} cÃ³ thá» á» chá» sai.",
+
+    'filterEvaluateNotImplemented': "chÆ°a há» trá»£ evaluate cho loáº¡i bá» lá»c nÃ y."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-CN.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-CN.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/zh-CN.js	(revision 76)
@@ -0,0 +1,140 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["zh-CN"]
+ * Dictionary for Simplified Chinese.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["zh-CN"] = {
+
+    'unhandledRequest': "æªå€ççè¯·æ±ïŒè¿ååŒäžº ${statusText}",
+
+    'permalink': "æ°žä¹
+éŸæ¥",
+
+    'overlays': "å å å±",
+
+    'baseLayer': "åºç¡åŸå±",
+
+    'sameProjection':
+        "é¹°çŒå°åŸåªæåšåäž»å°åŸäœ¿çšçžåçæåœ±çæ¶åæèœæ­£åžžå
+±å·¥äœ",
+
+    'readNotImplemented': "è¯»ååèœæ²¡æå®ç°ã",
+
+    'writeNotImplemented': "åå
+¥åèœæ²¡æå®ç°ã",
+
+    'noFID': "æ æ³æŽæ°featureïŒçŒºå°FIDã",
+
+    'errorLoadingGML': "å èœœGMLæä»¶ ${url} åºç°éè¯¯ã",
+
+    'browserNotSupported':
+        "äœ äœ¿çšçæµè§åšäžæ¯æç¢éæž²æãåœåæ¯æçæž²ææ¹åŒå
+æ¬ïŒ\n${renderers}",
+
+    'componentShouldBe': "addFeatures : ç»ä»¶ç±»ååºè¯¥æ¯ ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEventæ¹æ³åšäžäžªæ²¡ææž²æåšçåŸå±äžè¢«è°çšã è¿éåžžæå³çæš" +
+        "éæ¯äºäžäžªåŸå±ïŒäœå¹¶æªéæ¯å
+¶å
+³èçhandlerã",
+
+    // console message
+    'minZoomLevelError':
+        "minZoomLevelå±æ§ä»
+éåçšäº" +
+        "äœ¿çšäºåºå®çŒ©æŸçº§å«çåŸå±ãè¿äžª " +
+        "wfs åŸå±æ£æ¥ minZoomLevel æ¯è¿å»éçäžæ¥çã" +
+        "ç¶èïŒæä»¬äžèœç§»é€å®ïŒ" +
+        "èç ŽåäŸèµäºå®çåºäºOLçåºçšçšåºã" +
+        "å æ­€ïŒæä»¬åºé€äºå® -- minZoomLevel " +
+        "å°äŒåš3.0äž­è¢«ç§»é€ãè¯·æ¹çš " +
+        "min/max resolution è®Ÿçœ®ïŒåèïŒ" +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS Transaction: æåã ${response}",
+
+    'commitFailed': "WFS Transaction: å€±èŽ¥ã ${response}",
+
+    'googleWarning':
+        "GoogleåŸå±äžèœæ­£ç¡®å èœœã<br><br>" +
+        "èŠæ¶é€è¿äžªä¿¡æ¯ïŒè¯·åšå³äžè§ç" +
+        "åŸå±æ§å¶é¢æ¿äž­éæ©å
+¶ä»çåºç¡åŸå±ã<br><br>" +
+        "è¿ç§æ
+åµåŸå¯èœæ¯æ²¡ææ­£ç¡®çå
+å«Googleå°åŸèæ¬åºïŒ" +
+        "æè
+æ¯æ²¡æå
+å«åšäœ çç«ç¹äž" +
+        "äœ¿çšçæ­£ç¡®çGoogle Maps APIå¯åã<br><br>" +
+        "åŒåè
+ïŒè·åäœ¿å
+¶æ­£ç¡®å·¥äœçåž®å©ä¿¡æ¯ïŒ" +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>ç¹å»è¿é</a>",
+
+    'getLayerWarning':
+        "${layerType} åŸå±äžèœæ­£ç¡®å èœœã<br><br>" +
+        "èŠæ¶é€è¿äžªä¿¡æ¯ïŒè¯·åšå³äžè§ç" +
+        "åŸå±æ§å¶é¢æ¿äž­éæ©å
+¶ä»çåºç¡åŸå±ã<br><br>" +
+        "è¿ç§æ
+åµåŸå¯èœæ¯æ²¡ææ­£ç¡®çå
+å«" +
+        "${layerLib} èæ¬åºã<br><br>" +
+        "åŒåè
+ïŒè·åäœ¿å
+¶æ­£ç¡®å·¥äœçåž®å©ä¿¡æ¯ïŒ" +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>ç¹å»è¿é</a>",
+
+    'scale': "æ¯äŸå°º = 1 : ${scaleDenom}",
+
+    // console message
+    'layerAlreadyAdded':
+        "äœ å°è¯æ·»å åŸå±ïŒ ${layerName} å°å°åŸäž­ïŒäœæ¯å®ä¹åå°±å·²ç»è¢«æ·»å ã",
+
+    // console message
+    'reprojectDeprecated':
+        "äœ æ­£åšäœ¿çš ${layerName} åŸå±äžç'reproject'éé¡¹ã" +
+        "è¿äžªéé¡¹å·²ç»äžåäœ¿çšïŒ" +
+        "å®æ¯è¢«è®Ÿè®¡çšæ¥æ¯ææŸç€ºåäžçå°åŸæ°æ®ïŒ" + 
+        "äžè¿ç°åšè¯¥åèœå¯ä»¥éè¿äœ¿çšSpherical Mercatoræ¥å®ç°ã" +
+        "æŽå€ä¿¡æ¯å¯ä»¥åé
+" +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "è¯¥æ¹æ³å·²ç»äžåè¢«æ¯æïŒå¹¶äžå°åš3.0äž­è¢«ç§»é€ã" +
+        "è¯·äœ¿çš ${newMethod} æ¹æ³æ¥æ¿ä»£ã",
+
+    // console message
+    'boundsAddError': "æšå¿
+é¡»äŒ é x å y äž€äžªåæ°åŒå° add æ¹æ³ã",
+
+    // console message
+    'lonlatAddError': "æšå¿
+é¡»äŒ é lon å lat äž€äžªåæ°åŒå° add æ¹æ³ã",
+
+    // console message
+    'pixelAddError': "æšå¿
+é¡»äŒ é x and y äž€äžªåæ°åŒå° add æ¹æ³ã",
+
+    // console message
+    'unsupportedGeometryType': "äžæ¯æçå äœäœç±»åïŒ ${geomType}",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition å€±èŽ¥ïŒid äžº ${elemId} çå
+çŽ å¯èœè¢«éçœ®ã",
+                    
+    'end': ''
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/da-DK.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/da-DK.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/da-DK.js	(revision 76)
@@ -0,0 +1,119 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["da-DK"]
+ * Dictionary for Danish.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang['da-DK'] = {
+
+    'unhandledRequest': "En ikke hÃ¥ndteret forespÃžrgsel returnerede ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Kortlag",
+
+    'baseLayer': "Baggrundslag",
+
+    'sameProjection':
+        "Oversigtskortet fungerer kun nÃ¥r det har samme projektion som hovedkortet",
+
+    'readNotImplemented': "LÃŠsning er ikke implementeret.",
+
+    'writeNotImplemented': "Skrivning er ikke implementeret.",
+
+    'noFID': "Kan ikke opdateret en feature (et objekt) der ikke har et FID.",
+
+    'errorLoadingGML': "Fejlede under indlÃŠsning af GML fil ${url}",
+
+    'browserNotSupported':
+        "Din browser understÃžtter ikke vektor visning. FÃžlgende vektor visninger understÃžttes:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : komponenten skal vÃŠre en ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent blev kaldt pÃ¥ et lag uden en visning. Dette betyder som regel at du " +
+        "har destrueret et lag, men ikke de hÃ¥ndteringer der var tilknyttet.",
+
+    // console message
+    'minZoomLevelError':
+        "Egenskaben minZoomLevel er kun beregnet til brug " +
+        "med FixedZoomLevels. At dette WFS lag kontrollerer " +
+        "minZoomLevel egenskaben, er et levn fra en tidligere " +
+        "version. Vi kan desvÃŠrre ikke fjerne dette uden at risikere " +
+        "at ÃždelÃŠgge eksisterende OL baserede programmer der " +
+        " benytter denne funktionalitet. " +
+        "Egenskaben bÃžr derfor ikke anvendes, og minZoomLevel " +
+        "kontrollen herunder vil blive fjernet i version 3.0. " +
+        "Benyt istedet min/max oplÃžsnings indstillingerne, som " +
+        "er beskrevet her: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS transaktion: LYKKEDES ${response}",
+
+    'commitFailed': "WFS transaktion: MISLYKKEDES ${response}",
+
+    'googleWarning':
+        "Google laget kunne ikke indlÃŠses.<br><br>" +
+        "For at fjerne denne besked, vÃŠlg et nyt bagrundskort i " +
+        "lagskifteren i Ãžverste hÃžjre hjÃžrne.<br><br>" +
+        "Fejlen skyldes formentlig at Google Maps bibliotekts " +
+        "scriptet ikke er inkluderet, eller ikke indeholder den " +
+        "korrkte API nÃžgle for dit site.<br><br>" +
+        "Udviklere: For hjÃŠlp til at fÃ¥ dette til at fungere, " +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>klik her</a>",
+
+    'getLayerWarning':
+        "${layerType}-laget kunne ikke indlÃŠses.<br><br>" +
+        "For at fjerne denne besked, vÃŠlg et nyt bagrundskort i " +
+        "lagskifteren i Ãžverste hÃžjre hjÃžrne.<br><br>" +
+        "Fejlen skyldes formentlig at ${layerLib} bibliotekts " +
+        "scriptet ikke er inkluderet.<br><br>" +
+        "Udviklere: For hjÃŠlp til at fÃ¥ dette til at fungere, " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>klik her</a>",
+
+    'scale': "MÃ¥lforhold = 1 : ${scaleDenom}",
+
+    // console message
+    'layerAlreadyAdded':
+        "Du har forsÃžgt at tilfÃžje laget: ${layerName} til kortet, men det er allerede tilfÃžjet",
+
+    // console message
+    'reprojectDeprecated':
+        "Du anvender indstillingen 'reproject' pÃ¥ laget ${layerName}." + 
+        "Denne indstilling bÃžr ikke lÃŠngere anvendes. Den var beregnet " +
+        "til at vise data ovenpÃ¥ kommercielle grundkort, men den funktionalitet " +
+        "bÃžr nu opnÃ¥s ved at anvende Spherical Mercator understÃžttelsen. " +
+        "Mere information er tilgÃŠngelig her: " +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "Denne funktion bÃžr ikke lÃŠngere anvendes, og vil blive fjernet i version 3.0. " +
+        "Anvend venligst funktionen ${newMethod} istedet.",
+
+    // console message
+    'boundsAddError': "Du skal angive bÃ¥de x og y vÃŠrdier i kaldet til add funktionen.",
+
+    // console message
+    'lonlatAddError': "Du skal angive bÃ¥de lon og lat vÃŠrdier i kaldet til add funktionen.",
+
+    // console message
+    'pixelAddError': "Du skal angive bÃ¥de x og y vÃŠrdier i kaldet til add funktionen.",
+
+    // console message
+    'unsupportedGeometryType': "Geometri typen: ${geomType} er ikke understÃžttet.",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition fejlede: elementet med id ${elemId} er mÃ¥ske placeret forkert.",
+
+    // console message
+    'filterEvaluateNotImplemented': "evaluering er ikke implementeret for denne filter type."
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt-BR.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt-BR.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt-BR.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Translators (2009 onwards):
+ *  - Luckas Blade
+ *  - Rodrigo Avila
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["pt-br"]
+ * Dictionary for PortuguÃªs do Brasil.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["pt-br"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "A requisiÃ§Ã£o retornou um erro nÃ£o tratado: ${statusText}",
+
+    'permalink': "Link para essa pÃ¡gina",
+
+    'overlays': "Camadas de SobreposiÃ§Ã£o",
+
+    'baseLayer': "Camada Base",
+
+    'sameProjection': "O mapa de referÃªncia sÃ³ funciona quando ele estÃ¡ na mesma projeÃ§Ã£o do mapa principal",
+
+    'readNotImplemented': "Leitura nÃ£o implementada.",
+
+    'writeNotImplemented': "Escrita nÃ£o implementada.",
+
+    'noFID': "NÃ£o Ã© possÃ­vel atualizar uma feiÃ§Ã£o que nÃ£o tenha um FID.",
+
+    'errorLoadingGML': "Erro ao carregar o arquivo GML ${url}",
+
+    'browserNotSupported': "Seu navegador nÃ£o suporta renderizaÃ§Ã£o de vetores. Os renderizadores suportados atualmente sÃ£o:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: o componente deve ser do tipo ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent foi executado mas nenhum renderizador foi encontrado. Isso pode indicar que vocÃª destruiu uma camana, mas nÃ£o o handler associado a ela.",
+
+    'minZoomLevelError': "A propriedade minZoomLevel Ã© de uso restrito das camadas descendentes de FixedZoomLevels. A verificaÃ§Ã£o dessa propriedade pelas camadas wfs Ã© um resÃ­duo do passado. NÃ£o podemos, entretanto nÃ£o Ã© possÃ­vel removÃª-la sem possÃ­velmente quebrar o funcionamento de aplicaÃ§Ãµes OL que possuem depÃªncia com ela. Portanto estamos tornando seu uso obsoleto -- a verificaÃ§Ã£o desse atributo serÃ¡ removida na versÃ£o 3.0. Ao invÃ©s, use as opÃ§Ãµes de resoluÃ§Ã£o min/max como descrito em: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "TransaÃ§Ã£o WFS : SUCESSO ${response}",
+
+    'commitFailed': "TransaÃ§Ã£o WFS : ERRO ${response}",
+
+    'googleWarning': "NÃ£o foi possÃ­vel carregar a camada Google corretamente.\x3cbr\x3e\x3cbr\x3ePara se livrar dessa mensagem, selecione uma nova Camada Base, na ferramenta de alternaÃ§Ã£o de camadas localizaÃ§Ã£o do canto superior direito.\x3cbr\x3e\x3cbr\x3eMuito provavelmente, isso foi causado porque o script da biblioteca do Google Maps nÃ£o foi incluÃ­do, ou porque ele nÃ£o contÃ©m a chave correta da API para o seu site.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: Para obter ajuda em solucionar esse problema \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3ecliquem aqui\x3c/a\x3e",
+
+    'getLayerWarning': "NÃ£o foi possÃ­vel carregar a camada ${layerType} corretamente.\x3cbr\x3e\x3cbr\x3ePara se livrar dessa mensagem, selecione uma nova Camada Base, na ferramenta de alternaÃ§Ã£o de camadas localizaÃ§Ã£o do canto superior direito.\x3cbr\x3e\x3cbr\x3eMuito provavelmente, isso foi causado porque o script da biblioteca ${layerLib} nÃ£o foi incluÃ­do corretamente.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: Para obter ajuda em solucionar esse problema \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3ecliquem aqui\x3c/a\x3e",
+
+    'scale': "Escala = 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "L",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "VocÃª tentou adicionar a camada: ${layerName} ao mapa, mas ela jÃ¡ foi adicionada",
+
+    'reprojectDeprecated': "VocÃª estÃ¡ usando a opÃ§Ã£o \'reproject\' na camada ${layerName}. Essa opÃ§Ã£o estÃ¡ obsoleta: seu uso foi projetado para suportar a visualizaÃ§Ã£o de dados sobre bases de mapas comerciais, entretanto essa funcionalidade deve agora ser alcanÃ§ada usando o suporte Ã  projeÃ§Ã£o Mercator. Mais informaÃ§Ã£o estÃ¡ disponÃ­vel em: http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Esse mÃ©todo estÃ¡ obsoleto e serÃ¡ removido na versÃ£o 3.0. Ao invÃ©s, por favor use ${newMethod}.",
+
+    'boundsAddError': "VocÃª deve informar ambos os valores x e y para a funÃ§Ã£o add.",
+
+    'lonlatAddError': "VocÃª deve informar ambos os valores lon e lat para a funÃ§Ã£o add.",
+
+    'pixelAddError': "VocÃª deve informar ambos os valores x e y para a funÃ§Ã£o add.",
+
+    'unsupportedGeometryType': "Tipo geomÃ©trico nÃ£o suportado: ${geomType}.",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition falhou: o elemento de id ${elemId} deve estar fora do lugar.",
+
+    'filterEvaluateNotImplemented': "evaluete nÃ£o estÃ¡ implementado para este tipo de filtro."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ru.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ru.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ru.js	(revision 76)
@@ -0,0 +1,89 @@
+/* Translators (2009 onwards):
+ *  - Ferrer
+ *  - Komzpa
+ *  - Lockal
+ *  - ÐÐ»ÐµÐºÑÐ°ÐœÐŽÑ Ð¡ÐžÐ³Ð°ÑÑÐ²
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ru"]
+ * Dictionary for Ð ÑÑÑÐºÐžÐ¹.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["ru"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "ÐÐµÐŸÐ±ÑÐ°Ð±ÐŸÑÐ°ÐœÐœÑÐ¹ Ð·Ð°Ð¿ÑÐŸÑ Ð²ÐµÑÐœÑÐ» ${statusText}",
+
+    'permalink': "ÐÐŸÑÑÐŸÑÐœÐœÐ°Ñ ÑÑÑÐ»ÐºÐ°",
+
+    'overlays': "Ð¡Ð»ÐŸÐž",
+
+    'baseLayer': "ÐÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹",
+
+    'sameProjection': "ÐÐ±Ð·ÐŸÑÐœÐ°Ñ ÐºÐ°ÑÑÐ° ÑÐ°Ð±ÐŸÑÐ°ÐµÑ ÑÐŸÐ»ÑÐºÐŸ ÑÐŸÐ³ÐŽÐ°, ÐºÐŸÐ³ÐŽÐ° ÐžÐŒÐµÐµÑ ÑÑ Ð¶Ðµ Ð¿ÑÐŸÐµÐºÑÐžÑ, ÑÑÐŸ Ðž ÐŸÑÐœÐŸÐ²ÐœÐ°Ñ",
+
+    'readNotImplemented': "Ð§ÑÐµÐœÐžÐµ ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐŸ.",
+
+    'writeNotImplemented': "ÐÐ°Ð¿ÐžÑÑ ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐ°.",
+
+    'noFID': "ÐÐµÐ²ÐŸÐ·ÐŒÐŸÐ¶ÐœÐŸ ÐŸÐ±ÐœÐŸÐ²ÐžÑÑ ÐŸÐ±ÑÐµÐºÑ, ÐŽÐ»Ñ ÐºÐŸÑÐŸÑÐŸÐ³ÐŸ ÐœÐµÑ FID.",
+
+    'errorLoadingGML': "ÐÑÐžÐ±ÐºÐ° Ð¿ÑÐž Ð·Ð°Ð³ÑÑÐ·ÐºÐµ ÑÐ°Ð¹Ð»Ð° GML ${url}",
+
+    'browserNotSupported': "ÐÐ°Ñ Ð±ÑÐ°ÑÐ·ÐµÑ ÐœÐµ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÐµÑ Ð²ÐµÐºÑÐŸÑÐœÑÑ Ð³ÑÐ°ÑÐžÐºÑ. ÐÐ° ÐŽÐ°ÐœÐœÑÐ¹ ÐŒÐŸÐŒÐµÐœÑ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÑÑÑÑ:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: ÐºÐŸÐŒÐ¿ÐŸÐœÐµÐœÑ ÐŽÐŸÐ»Ð¶ÐµÐœ Ð±ÑÑÑ ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent Ð²ÑÐ·Ð²Ð°Ðœ ÐŽÐ»Ñ ÑÐ»ÐŸÑ Ð±ÐµÐ· ÑÐµÐœÐŽÐµÑÐµÑÐ°. ÐÐ±ÑÑÐœÐŸ ÑÑÐŸ Ð³ÐŸÐ²ÐŸÑÐžÑ ÐŸ ÑÐŸÐŒ, ÑÑÐŸ Ð²Ñ ÑÐœÐžÑÑÐŸÐ¶ÐžÐ»Ðž ÑÐ»ÐŸÐ¹, ÐœÐŸ ÐŸÑÑÐ°Ð²ÐžÐ»Ðž ÑÐ²ÑÐ·Ð°ÐœÐœÑÐ¹ Ñ ÐœÐžÐŒ ÐŸÐ±ÑÐ°Ð±ÐŸÑÑÐžÐº.",
+
+    'minZoomLevelError': "Ð¡Ð²ÐŸÐ¹ÑÑÐ²ÐŸ minZoomLevel Ð¿ÑÐµÐŽÐœÐ°Ð·ÐœÐ°ÑÐµÐœÐŸ ÑÐŸÐ»ÑÐºÐŸ ÐŽÐ»Ñ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÐŸÐ²Ð°ÐœÐžÑ ÑÐŸ ÑÐ»ÐŸÑÐŒÐž, ÑÐ²Ð»ÑÑÑÐžÐŒÐžÑÑ Ð¿ÐŸÑÐŸÐŒÐºÐ°ÐŒÐž FixedZoomLevels. Ð¢ÐŸ, ÑÑÐŸ ÑÑÐŸÑ WFS-ÑÐ»ÐŸÐ¹ Ð¿ÑÐŸÐ²ÐµÑÑÐµÑÑÑ ÐœÐ° minZoomLevel â ÑÐµÐ»ÐžÐºÑ Ð¿ÑÐŸÑÐ»ÐŸÐ³ÐŸ. ÐÐŽÐœÐ°ÐºÐŸ ÐŒÑ ÐœÐµ ÐŒÐŸÐ¶ÐµÐŒ ÑÐŽÐ°Ð»ÐžÑÑ ÑÑÑ ÑÑÐœÐºÑÐžÑ, ÑÐ°Ðº ÐºÐ°Ðº, Ð²ÐŸÐ·ÐŒÐŸÐ¶ÐœÐŸ, ÐŸÑ ÐœÐµÑ Ð·Ð°Ð²ÐžÑÑÑ ÐœÐµÐºÐŸÑÐŸÑÑÐµ ÐŸÑÐœÐŸÐ²Ð°ÐœÐœÑÐµ ÐœÐ° OpenLayers Ð¿ÑÐžÐ»ÐŸÐ¶ÐµÐœÐžÑ. Ð€ÑÐœÐºÑÐžÑ ÐŸÐ±ÑÑÐ²Ð»ÐµÐœÐ° ÑÑÑÐ°ÑÐµÐ²ÑÐµÐ¹ â Ð¿ÑÐŸÐ²ÐµÑÐºÐ° minZoomLevel Ð±ÑÐŽÐµÑ ÑÐŽÐ°Ð»ÐµÐœÐ° Ð² 3.0. ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ°, ÐžÑÐ¿ÐŸÐ»ÑÐ·ÑÐ¹ÑÐµ Ð²ÐŒÐµÑÑÐŸ ÐœÐµÑ ÐœÐ°ÑÑÑÐŸÐ¹ÐºÑ ÐŒÐžÐœ/ÐŒÐ°ÐºÑ ÑÐ°Ð·ÑÐµÑÐµÐœÐžÑ, ÐŸÐ¿ÐžÑÐ°ÐœÐœÑÑ Ð·ÐŽÐµÑÑ: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Ð¢ÑÐ°ÐœÐ·Ð°ÐºÑÐžÑ WFS: Ð£Ð¡ÐÐÐšÐÐ ${response}",
+
+    'commitFailed': "Ð¢ÑÐ°ÐœÐ·Ð°ÐºÑÐžÑ WFS: ÐÐšÐÐÐÐ ${response}",
+
+    'googleWarning': "Ð¡Ð»ÐŸÐ¹ Google ÐœÐµ ÑÐŽÐ°Ð»ÐŸÑÑ ÐœÐŸÑÐŒÐ°Ð»ÑÐœÐŸ Ð·Ð°Ð³ÑÑÐ·ÐžÑÑ.\x3cbr\x3e\x3cbr\x3eÐ§ÑÐŸÐ±Ñ ÐžÐ·Ð±Ð°Ð²ÐžÑÑÑÑ ÐŸÑ ÑÑÐŸÐ³ÐŸ ÑÐŸÐŸÐ±ÑÐµÐœÐžÑ, Ð²ÑÐ±ÐžÑÐµ ÐŽÑÑÐ³ÐŸÐ¹ ÐŸÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹ Ð² Ð¿ÐµÑÐµÐºÐ»ÑÑÐ°ÑÐµÐ»Ðµ Ð² Ð¿ÑÐ°Ð²ÐŸÐŒ Ð²ÐµÑÑ
+ÐœÐµÐŒ ÑÐ³Ð»Ñ.\x3cbr\x3e\x3cbr\x3eÐ¡ÐºÐŸÑÐµÐµ Ð²ÑÐµÐ³ÐŸ, Ð¿ÑÐžÑÐžÐœÐ° Ð² ÑÐŸÐŒ, ÑÑÐŸ Ð±ÐžÐ±Ð»ÐžÐŸÑÐµÐºÐ° Google Maps ÐœÐµ Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐžÐ»Ðž ÐœÐµ ÑÐŸÐŽÐµÑÐ¶ÐžÑ ÐºÐŸÑÑÐµÐºÑÐœÐŸÐ³ÐŸ API-ÐºÐ»ÑÑÐ° ÐŽÐ»Ñ Ð²Ð°ÑÐµÐ³ÐŸ ÑÐ°Ð¹ÑÐ°.\x3cbr\x3e\x3cbr\x3eÐ Ð°Ð·ÑÐ°Ð±ÐŸÑÑÐžÐºÐ°ÐŒ: ÑÑÐŸÐ±Ñ ÑÐ·ÐœÐ°ÑÑ, ÐºÐ°Ðº ÑÐŽÐµÐ»Ð°ÑÑ, ÑÑÐŸÐ±Ñ Ð²ÑÑ Ð·Ð°ÑÐ°Ð±ÐŸÑÐ°Ð»ÐŸ, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eÑÑÐ»ÐºÐœÐžÑÐµ ÑÑÑ\x3c/a\x3e",
+
+    'getLayerWarning': "Ð¡Ð»ÐŸÐ¹ ${layerType} ÐœÐµ ÑÐŽÐ°Ð»ÐŸÑÑ ÐœÐŸÑÐŒÐ°Ð»ÑÐœÐŸ Ð·Ð°Ð³ÑÑÐ·ÐžÑÑ. \x3cbr\x3e\x3cbr\x3eÐ§ÑÐŸÐ±Ñ ÐžÐ·Ð±Ð°Ð²ÐžÑÑÑÑ ÐŸÑ ÑÑÐŸÐ³ÐŸ ÑÐŸÐŸÐ±ÑÐµÐœÐžÑ, Ð²ÑÐ±ÐžÑÐµ ÐŽÑÑÐ³ÐŸÐ¹ ÐŸÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹ Ð² Ð¿ÐµÑÐµÐºÐ»ÑÑÐ°ÑÐµÐ»Ðµ Ð² Ð¿ÑÐ°Ð²ÐŸÐŒ Ð²ÐµÑÑ
+ÐœÐµÐŒ ÑÐ³Ð»Ñ.\x3cbr\x3e\x3cbr\x3eÐ¡ÐºÐŸÑÐµÐµ Ð²ÑÐµÐ³ÐŸ, Ð¿ÑÐžÑÐžÐœÐ° Ð² ÑÐŸÐŒ, ÑÑÐŸ Ð±ÐžÐ±Ð»ÐžÐŸÑÐµÐºÐ° ${layerLib} ÐœÐµ Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐžÐ»Ðž Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐœÐµÐºÐŸÑÑÐµÐºÑÐœÐŸ.\x3cbr\x3e\x3cbr\x3eÐ Ð°Ð·ÑÐ°Ð±ÐŸÑÑÐžÐºÐ°ÐŒ: ÑÑÐŸÐ±Ñ ÑÐ·ÐœÐ°ÑÑ, ÐºÐ°Ðº ÑÐŽÐµÐ»Ð°ÑÑ, ÑÑÐŸÐ±Ñ Ð²ÑÑ Ð·Ð°ÑÐ°Ð±ÐŸÑÐ°Ð»ÐŸ, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eÑÑÐ»ÐºÐœÐžÑÐµ ÑÑÑ\x3c/a\x3e",
+
+    'scale': "ÐÐ°ÑÑÑÐ°Ð± = 1 : ${scaleDenom}",
+
+    'W': "Ð",
+
+    'E': "Ð",
+
+    'N': "Ð¡",
+
+    'S': "Ð®",
+
+    'layerAlreadyAdded': "ÐÑ Ð¿ÐŸÐ¿ÑÑÐ°Ð»ÐžÑÑ ÐŽÐŸÐ±Ð°Ð²ÐžÑÑ ÑÐ»ÐŸÐ¹ Â«${layerName}Â» ÐœÐ° ÐºÐ°ÑÑÑ, ÐœÐŸ ÐŸÐœ ÑÐ¶Ðµ Ð±ÑÐ» ÐŽÐŸÐ±Ð°Ð²Ð»ÐµÐœ",
+
+    'reprojectDeprecated': "ÐÑ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÑÐµÑÐµ ÐŸÐ¿ÑÐžÑ \'reproject\' ÐŽÐ»Ñ ÑÐ»ÐŸÑ ${layerName}. Ð­ÑÐ° ÐŸÐ¿ÑÐžÑ ÑÐ²Ð»ÑÐµÑÑÑ ÑÑÑÐ°ÑÐµÐ²ÑÐµÐ¹: ÐµÐµ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÐŸÐ²Ð°ÐœÐžÐµ Ð¿ÑÐµÐŽÐ¿ÐŸÐ»Ð°Ð³Ð°Ð»ÐŸÑÑ ÐŽÐ»Ñ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐºÐž Ð¿ÐŸÐºÐ°Ð·Ð° ÐŽÐ°ÐœÐœÑÑ
+ Ð¿ÐŸÐ²ÐµÑÑ
+ ÐºÐŸÐŒÐŒÐµÑÑÐµÑÐºÐžÑ
+ Ð±Ð°Ð·ÐŸÐ²ÑÑ
+ ÐºÐ°ÑÑ, ÐœÐŸ ÑÐµÐ¿ÐµÑÑ ÑÑÐŸÑ ÑÑÐœÐºÑÐžÐŸÐœÐ°Ð» ÐœÐµÑÑÑ Ð²ÑÑÑÐŸÐµÐœÐœÐ°Ñ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐºÐ° ÑÑÐµÑÐžÑÐµÑÐºÐŸÐ¹ Ð¿ÑÐŸÐµÐºÑÐžÐž ÐÐµÑÐºÐ°ÑÐŸÑÐ°. ÐÐŸÐ»ÑÑÐµ ÑÐ²ÐµÐŽÐµÐœÐžÐ¹ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ ÐœÐ° http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Ð­ÑÐŸÑ ÐŒÐµÑÐŸÐŽ ÑÑÐžÑÐ°ÐµÑÑÑ ÑÑÑÐ°ÑÐµÐ²ÑÐžÐŒ Ðž Ð±ÑÐŽÐµÑ ÑÐŽÐ°Ð»ÑÐœ Ð² Ð²ÐµÑÑÐžÐž 3.0. ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ°, Ð¿ÐŸÐ»ÑÐ·ÑÐ¹ÑÐµÑÑ ${newMethod}.",
+
+    'boundsAddError': "Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, x Ðž y.",
+
+    'lonlatAddError': "Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, lon Ðž lat.",
+
+    'pixelAddError': "Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, x Ðž y.",
+
+    'unsupportedGeometryType': "ÐÐµÐ¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÐµÐŒÑÐ¹ ÑÐžÐ¿ Ð³ÐµÐŸÐŒÐµÑÑÐžÐž: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition failed: ÑÐ»ÐµÐŒÐµÐœÑ Ñ id ${elemId} ÐŒÐŸÐ¶ÐµÑ ÐœÐ°Ñ
+ÐŸÐŽÐžÑÑÑÑ ÐœÐµ Ð² ÐœÑÐ¶ÐœÐŸÐŒ ÐŒÐµÑÑÐµ.",
+
+    'filterEvaluateNotImplemented': "evaluate ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐŸ ÐŽÐ»Ñ ÑÐžÐ»ÑÑÑÐ° ÐŽÐ°ÐœÐœÐŸÐ³ÐŸ ÑÐžÐ¿Ð°."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fur.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fur.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fur.js	(revision 76)
@@ -0,0 +1,35 @@
+/* Translators (2009 onwards):
+ *  - Klenje
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["fur"]
+ * Dictionary for Furlan.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["fur"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "Leam Permanent",
+
+    'overlays': "Livei parsore",
+
+    'baseLayer': "Livel di base",
+
+    'browserNotSupported': "Il to sgarfadÃŽr nol supuarte la renderizazion vetoriÃ¢l. Al moment a son supuartÃ¢ts:\n${renderers}",
+
+    'scale': "Scjale = 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "E",
+
+    'N': "N",
+
+    'S': "S"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/id.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/id.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/id.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Translators (2009 onwards):
+ *  - Irwangatot
+ *  - IvanLanin
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["id"]
+ * Dictionary for Bahasa Indonesia.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["id"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Permintaan yang tak tertangani menghasilkan ${statusText}",
+
+    'permalink': "Pranala permanen",
+
+    'overlays': "Hamparan",
+
+    'baseLayer': "Lapisan Dasar",
+
+    'sameProjection': "Peta tinjauan hanya bekerja bila dalam proyeksi yang sama dengan peta utama",
+
+    'readNotImplemented': "Membaca tidak diterapkan.",
+
+    'writeNotImplemented': "Menyimpan tidak diterapkan.",
+
+    'noFID': "Tidak dapat memperbarui fitur yang tidak memiliki FID.",
+
+    'errorLoadingGML': "Kesalahan dalam memuat berkas GML ${url}",
+
+    'browserNotSupported': "Peramban Anda tidak mendukung penggambaran vektor. Penggambar yang didukung saat ini adalah:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : komponen harus berupa ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent diterapkan pada lapisan tanpa penggambar. Ini biasanya berarti Anda menghapus sebuah lapisan, tetapi tidak menghapus penangan yang terkait dengannya.",
+
+    'minZoomLevelError': "Properti minZoomLevel hanya ditujukan bekerja dengan lapisan FixedZoomLevels-descendent. Pengecekan minZoomLevel oleh lapisan wfs adalah peninggalan masa lalu. Kami tidak dapat menghapusnya tanpa kemungkinan merusak aplikasi berbasis OL yang mungkin bergantung padanya. Karenanya, kami menganggapnya tidak berlaku -- Cek minZoomLevel di bawah ini akan dihapus pada 3.0. Silakan gunakan penyetelan resolusi min/maks seperti dijabarkan di sini: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS Transaksi: BERHASIL ${respon}",
+
+    'commitFailed': "WFS Transaksi: GAGAL ${respon}",
+
+    'googleWarning': "Lapisan Google tidak dapat dimuat dengan benar.\x3cbr\x3e\x3cbr\x3eUntuk menghilangkan pesan ini, pilih suatu BaseLayer baru melalui penukar lapisan (layer switcher) di ujung kanan atas.\x3cbr\x3e\x3cbr\x3eKemungkinan besar ini karena pustaka skrip Google Maps tidak disertakan atau tidak mengandung kunci API yang tepat untuk situs Anda.\x3cbr\x3e\x3cbr\x3ePengembang: Untuk bantuan mengatasi masalah ini, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eklik di sini\x3c/a\x3e",
+
+    'getLayerWarning': "Lapisan ${layerType} tidak dapat dimuat dengan benar.\x3cbr\x3e\x3cbr\x3eUntuk menghilangkan pesan ini, pilih suatu BaseLayer baru melalui penukar lapisan (layer switcher) di ujung kanan atas.\x3cbr\x3e\x3cbr\x3eKemungkinan besar ini karena pustaka skrip Google Maps tidak disertakan dengan benar.\x3cbr\x3e\x3cbr\x3ePengembang: Untuk bantuan mengatasi masalah ini, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eklik di sini\x3c/a\x3e",
+
+    'scale': "Sekala = 1 : ${scaleDenom}",
+
+    'W': "B",
+
+    'E': "T",
+
+    'N': "U",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Anda mencoba menambahkan lapisan: ${layerName} ke dalam peta, tapi lapisan itu telah ditambahkan",
+
+    'reprojectDeprecated': "Anda menggunakan opsi \'reproject\' pada lapisan ${layerName}. Opsi ini telah ditinggalkan: penggunaannya dirancang untuk mendukung tampilan data melalui peta dasar komersial, tapi fungsionalitas tersebut saat ini harus dilakukan dengan menggunakan dukungan Spherical Mercator. Informasi lebih lanjut tersedia di http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Metode ini telah usang dan akan dihapus di 3.0. Sebaliknya, harap gunakan ${newMethod}.",
+
+    'boundsAddError': "Anda harus memberikan kedua nilai x dan y ke fungsi penambah.",
+
+    'lonlatAddError': "Anda harus memberikan kedua nilai lon dan lat ke fungsi penambah.",
+
+    'pixelAddError': "Anda harus memberikan kedua nilai x dan y ke fungsi penambah.",
+
+    'unsupportedGeometryType': "Tipe geometri tak didukung: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition gagal: elemen dengan id ${elemId} mungkin salah tempat.",
+
+    'filterEvaluateNotImplemented': "evaluasi tidak tersedia untuk tipe filter ini."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sv-SE.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sv-SE.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/sv-SE.js	(revision 76)
@@ -0,0 +1,71 @@
+/* Translators (2009 onwards):
+ *  - Sannab
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["sv"]
+ * Dictionary for Svenska.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["sv"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Ej hanterad frÃ¥ga retur ${statusText}",
+
+    'permalink': "PermalÃ€nk",
+
+    'overlays': "Kartlager",
+
+    'baseLayer': "Bakgrundskarta",
+
+    'sameProjection': "Ãversiktskartan fungerar endast nÃ€r den har samma projektion som huvudkartan",
+
+    'readNotImplemented': "LÃ€sning ej implementerad.",
+
+    'writeNotImplemented': "Skrivning ej implementerad.",
+
+    'noFID': "Kan ej uppdatera feature (objekt) fÃ¶r vilket FID saknas.",
+
+    'errorLoadingGML': "Fel i laddning av GML-fil ${url}",
+
+    'browserNotSupported': "Din webblÃ€sare stÃ¶der inte vektorvisning. FÃ¶r nÃ€rvarande stÃ¶ds fÃ¶ljande visning:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : komponenten skall vara en ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent anropad fÃ¶r lager utan utritning. Detta betyder oftast att man raderat ett lager, men inte en hanterare som Ã€r knuten till lagret.",
+
+    'minZoomLevelError': "Egenskapen minZoomLevel Ã€r endast avsedd att anvÃ€ndas med lager med FixedZoomLevels. Att detta WFS-lager kontrollerar minZoomLevel Ã€r en relik frÃ¥n Ã€ldre versioner. Vi kan dock inte ta bort det utan att riskera att OL-baserade tillÃ€mpningar som anvÃ€nder detta slutar fungera. DÃ€rfÃ¶r Ã€r det satt som deprecated, minZoomLevel kommer att tas bort i version 3.0. AnvÃ€nd i stÃ€llet instÃ€llning av min/max resolution som beskrivs hÃ€r: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-transaktion: LYCKADES ${response}",
+
+    'commitFailed': "WFS-transaktion: MISSLYCKADES ${response}",
+
+    'googleWarning': "Google-lagret kunde inte laddas korrekt.\x3cbr\x3e\x3cbr\x3eFÃ¶r att slippa detta meddelande, vÃ€lj en annan bakgrundskarta i lagervÃ€ljaren i Ã¶vre hÃ¶gra hÃ¶rnet.\x3cbr\x3e\x3cbr\x3eSannolikt beror felet pÃ¥ att Google Maps-biblioteket inte Ã€r inkluderat pÃ¥ webbsidan eller pÃ¥ att sidan inte anger korrekt API-nyckel fÃ¶r webbplatsen.\x3cbr\x3e\x3cbr\x3eUtvecklare: hjÃ€lp fÃ¶r att Ã¥tgÃ€rda detta, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eklicka hÃ€r\x3c/a\x3e.",
+
+    'getLayerWarning': "${layerType}-lagret kunde inte laddas korrekt.\x3cbr\x3e\x3cbr\x3eFÃ¶r att slippa detta meddelande, vÃ€lj en annan bakgrundskarta i lagervÃ€ljaren i Ã¶vre hÃ¶gra hÃ¶rnet.\x3cbr\x3e\x3cbr\x3eSannolikt beror felet pÃ¥ att ${layerLib}-biblioteket inte Ã€r inkluderat pÃ¥ webbsidan.\x3cbr\x3e\x3cbr\x3eUtvecklare: hjÃ€lp fÃ¶r att Ã¥tgÃ€rda detta, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eklicka hÃ€r\x3c/a\x3e.",
+
+    'scale': "\x3cstrong\x3eSkala\x3c/strong\x3e 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "Du fÃ¶rsÃ¶kte lÃ€gga till lagret: ${layerName} pÃ¥ kartan, men det har lagts till tidigare",
+
+    'reprojectDeprecated': "Du anvÃ€nder instÃ€llningen \'reproject\' pÃ¥ lagret ${layerName}. Denna instÃ€llning markerad som deprecated: den var avsedd att anvÃ€ndas fÃ¶r att stÃ¶dja visning av kartdata pÃ¥ kommersiella bakgrundskartor, men nu bÃ¶r man i stÃ€llet anvÃ€nda Spherical Mercator-stÃ¶d fÃ¶r den funktionaliteten. Mer information finns pÃ¥ http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Denna metod Ã€r markerad som deprecated och kommer att tas bort i 3.0. AnvÃ€nd ${newMethod} i stÃ€llet.",
+
+    'boundsAddError': "Du mÃ¥ste skicka bÃ¥de x- och y-vÃ€rde till funktionen add.",
+
+    'lonlatAddError': "Du mÃ¥ste skicka bÃ¥de lon- och lat-vÃ€rde till funktionen add.",
+
+    'pixelAddError': "Du mÃ¥ste skicka bÃ¥de x- och y-vÃ€rde till funktionen add.",
+
+    'unsupportedGeometryType': "StÃ¶d saknas fÃ¶r geometritypen: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition misslyckades: elementet med id ${elemId} kan placeras fel.",
+
+    'filterEvaluateNotImplemented': "evaluering har ej implementerats fÃ¶r denna typ av filter."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nb.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nb.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nb.js	(revision 76)
@@ -0,0 +1,118 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["nb"]
+ * Dictionary for norwegian bokmÃ¥l (Norway). Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["nb"] = {
+
+    'unhandledRequest': "Ubehandlet forespÃžrsel returnerte ${statusText}",
+
+    'permalink': "Kobling til denne siden",
+
+    'overlays': "Kartlag",
+
+    'baseLayer': "Bakgrunnskart",
+
+    'sameProjection':
+        "Oversiktskartet fungerer bare nÃ¥r det har samme projeksjon som hovedkartet",
+
+    'readNotImplemented': "Lesing er ikke implementert.",
+
+    'writeNotImplemented': "Skriving er ikke implementert.",
+
+    'noFID': "Kan ikke oppdatere et feature (et objekt) som ikke har FID.",
+
+    'errorLoadingGML': "Feil under lasting av GML-fil ${url}",
+
+    'browserNotSupported':
+        "Din nettleser stÃžtter ikke vektortegning. Tegnemetodene som stÃžttes er:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : komponenten mÃ¥ vÃŠre en ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent har blitt kjÃžrt mot et lag uten noen tegnemetode. Dette betyr som regel at du " +
+        "fjernet et lag uten Ã¥ fjerne alle hÃ¥ndterere tilknyttet laget.",
+
+    // console message
+    'minZoomLevelError':
+        "Egenskapen minZoomLevel er kun ment til bruk pÃ¥ lag " +
+        "basert pÃ¥ FixedZoomLevels. At dette wfs-laget sjekker " +
+        "minZoomLevel er en etterlevning fra tidligere versjoner. Det kan dog ikke " +
+        "tas bort uten Ã¥ risikere at OL-baserte applikasjoner " +
+        "slutter Ã¥ virke, sÃ¥ det er merket som foreldet: " +
+        "minZoomLevel i sjekken nedenfor vil fjernes i 3.0. " +
+        "Vennligst bruk innstillingene for min/maks opplÃžsning " +
+        "som er beskrevet her: "+
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-transaksjon: LYKTES ${response}",
+
+    'commitFailed': "WFS-transaksjon: MISLYKTES ${response}",
+
+    'googleWarning':
+        "Google-laget kunne ikke lastes.<br><br>" +
+        "Bytt til et annet bakgrunnslag i lagvelgeren i " +
+        "Ãžvre hÃžyre hjÃžrne for Ã¥ slippe denne meldingen.<br><br>" +
+        "Sannsynligvis forÃ¥rsakes feilen av at Google Maps-biblioteket " +
+        "ikke er riktig inkludert pÃ¥ nettsiden, eller at det ikke er " +
+        "angitt riktig API-nÃžkkel for nettstedet.<br><br>" +
+        "Utviklere: For hjelp til Ã¥ fÃ¥ dette til Ã¥ virke se "+
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>her</a>.",
+
+    'getLayerWarning':
+        "${layerType}-laget kunne ikke lastes.<br><br>" +
+        "Bytt til et annet bakgrunnslag i lagvelgeren i " +
+        "Ãžvre hÃžyre hjÃžrne for Ã¥ slippe denne meldingen.<br><br>" +
+        "Sannsynligvis forÃ¥rsakes feilen av at " +
+        "${layerLib}-biblioteket ikke var riktig inkludert " +
+        "pÃ¥ nettsiden.<br><br>" +
+        "Utviklere: For hjelp til Ã¥ fÃ¥ dette til Ã¥ virke se " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>her</a>.",
+
+    'scale': "<strong>Skala</strong> 1 : ${scaleDenom}",
+
+    // console message
+    'layerAlreadyAdded':
+        "Du forsÃžkte Ã¥ legge til laget ${layerName} pÃ¥ kartet, men det er allerede lagt til",
+
+    // console message
+    'reprojectDeprecated':
+        "Du bruker innstillingen 'reproject' pÃ¥ laget ${layerName}. " +
+        "Denne innstillingen er foreldet, den var ment for Ã¥ stÃžtte " +
+        "visning av kartdata over kommersielle bakgrunnskart, men det " +
+        "bÃžr nÃ¥ gjÃžres med stÃžtten for Spherical Mercator. Mer informasjon " +
+        "finnes pÃ¥ http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "Denne metoden er markert som foreldet og vil bli fjernet i 3.0. " +
+        "Vennligst bruk ${newMethod} i stedet.",
+
+    // console message
+    'boundsAddError': "Du mÃ¥ gi bÃ¥de x- og y-verdier til funksjonen add.",
+
+    // console message
+    'lonlatAddError': "Du mÃ¥ gi bÃ¥de lon- og lat-verdier til funksjonen add.",
+
+    // console message
+    'pixelAddError': "Du mÃ¥ gi bÃ¥de x- og y-verdier til funksjonen add.",
+
+    // console message
+    'unsupportedGeometryType': "Geometritypen ${geomType} er ikke stÃžttet",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition feilet: elementet med id ${elemId} kan vÃŠre feilplassert.",
+                    
+    'end': ''
+};
+
+OpenLayers.Lang["no"] = OpenLayers.Lang["nb"];
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/el.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/el.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/el.js	(revision 76)
@@ -0,0 +1,19 @@
+/* Translators (2009 onwards):
+ *  - Omnipaedista
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["el"]
+ * Dictionary for ÎÎ»Î»Î·ÎœÎ¹ÎºÎ¬.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["el"] = OpenLayers.Util.applyDefaults({
+
+    'scale': "ÎÎ»Î¯ÎŒÎ±ÎºÎ± ~ 1 : ${scaleDenom}"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gsw.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gsw.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gsw.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Als-Holder
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["gsw"]
+ * Dictionary for Alemannisch.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["gsw"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Nit behandleti AafrogsruckmÃ€ldig ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Iberlagerige",
+
+    'baseLayer': "Grundcharte",
+
+    'sameProjection': "D Ibersichts-Charte funktioniert nume, wÃ€nn si di glych ProjÃ€ktion brucht wie d Hauptcharte",
+
+    'readNotImplemented': "LÃ€se nit implementiert.",
+
+    'writeNotImplemented': "Schrybe nit implementiert.",
+
+    'noFID': "E Feature, wu s kei FID derfir git, cha nit aktualisiert wÃ€re.",
+
+    'errorLoadingGML': "FÃ€hler bim Lade vu dr GML-Datei ${url}",
+
+    'browserNotSupported': "Dyy Browser unterstitzt kei Vektordarstellig. AktuÃ€ll unterstitzti Renderer:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : KomponÃ€nt sott dr Typ ${geomType} syy",
+
+    'getFeatureError': "getFeatureFromEvent isch uf eme Layer ohni Renderer ufgruefe wore. Des heisst normalerwys, ass Du e Layer kaputt gmacht hesch, aber nit dr Handler, wu derzue ghert.",
+
+    'minZoomLevelError': "D minZoomLevel-Eigeschaft isch nume dÃ€nk fir d Layer, wu vu dr FixedZoomLevels abstamme. Ass dÃ€Ã€ wfs-Layer minZoomLevel prieft, scih e Relikt us dr Vergangeheit. Mir chenne s aber nit Ã€ndere ohni OL_basierti AawÃ€ndige villicht kaputt gehn, wu dervu abhÃ€nge.  Us dÃ€m Grund het die Funktion d Eigeschaft \'deprecated\' iberchuu. D minZoomLevel-Priefig unte wird in dr Version 3.0 usegnuu. Bitte verwÃ€nd statt dÃ€m e min/max-Uflesig wie s do bschriben isch: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-Transaktion: ERFOLGRYCH ${response}",
+
+    'commitFailed': "WFS-Transaktion: FÃHLGSCHLAA ${response}",
+
+    'googleWarning': "Dr Google-Layer het nit korrÃ€kt chenne glade wÃ€re.\x3cbr\x3e\x3cbr\x3eGo die MÃ€ldig nimi z kriege, wehl e andere Hintergrundlayer us em LayerSwitcher im rÃ€chte obere Ecke.\x3cbr\x3e\x3cbr\x3eDÃ€Ã€ FÃ€hler git s seli hyfig, wel s Skript vu dr Google-Maps-Bibliothek nit yybunde woren isch oder wel s kei giltige API-Schlissel fir Dyy URL din het.\x3cbr\x3e\x3cbr\x3eEntwickler: Fir Hilf zum korrÃ€kte Yybinde vum Google-Layer \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3edoo drucke\x3c/a\x3e",
+
+    'getLayerWarning': "Dr ${layerType}-Layer het nit korrÃ€kt chenne glade wÃ€re.\x3cbr\x3e\x3cbr\x3eGo die MÃ€ldig nimi z kriege, wehl e andere Hintergrundlayer us em LayerSwitcher im rÃ€chte obere Ecke.\x3cbr\x3e\x3cbr\x3eDÃ€Ã€ FÃ€hler git s seli hyfig, wel s Skript vu dr \'${layerLib}\'-Bibliothek nit yybunde woren isch oder wel s kei giltige API-Schlissel fir Dyy URL din het.\x3cbr\x3e\x3cbr\x3eEntwickler: Fir Hilf zum korrÃ€kte Yybinde vu Layer \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3edoo drucke\x3c/a\x3e",
+
+    'scale': "MaÃstab = 1 : ${scaleDenom}",
+
+    'W': "W",
+
+    'E': "O",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Du hesch versuecht dÃ€Ã€ Layer in d Charte yyzfiege: ${layerName}, aber Ã€r isch schoi yygfiegt",
+
+    'reprojectDeprecated': "Du bruchsch d \'reproject\'-Option bim ${layerName}-Layer. Die Option isch nimi giltig: si isch aagleit wore go   Date iber kommerziÃ€lli Grundcharte lege, aber des sott mer jetz mache mit dr Unterstitzig vu Spherical Mercator. Meh Informatione git s uf http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Die Methode isch veraltet un wird us dr Version 3.0 usegnuu. Bitte verwÃ€bnd statt dÃ€m ${newMethod}.",
+
+    'boundsAddError': "Du muesch e x-WÃ€rt un e y-WÃ€rt yygee bi dr Zuefieg-Funktion",
+
+    'lonlatAddError': "Du meusch e Lengi- un e Breiti-Grad yygee bi dr Zuefieg-Funktion.",
+
+    'pixelAddError': "Du muesch x- un y-WÃ€rt aagee bi dr Zuefieg-Funktion.",
+
+    'unsupportedGeometryType': "Nit unterstitze Geometrii-Typ: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition fÃ€hlgschlaa: ElemÃ€nt mit ID ${elemId} isch villicht falsch gsetzt.",
+
+    'filterEvaluateNotImplemented': "evaluiere isch nit implemÃ€ntiert in dÃ€m Filtertyp."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gl.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gl.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/gl.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - ToliÃ±o
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["gl"]
+ * Dictionary for Galego.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["gl"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Solicitude non xerada; a resposta foi: ${statusText}",
+
+    'permalink': "LigazÃ³n permanente",
+
+    'overlays': "Capas superpostas",
+
+    'baseLayer': "Capa base",
+
+    'sameProjection': "A vista xeral do mapa sÃ³ funciona cando estÃ¡ na mesma proxecciÃ³n cÃ³ mapa principal",
+
+    'readNotImplemented': "Lectura non implementada.",
+
+    'writeNotImplemented': "Escritura non implementada.",
+
+    'noFID': "Non se pode actualizar a funcionalidade para a que non hai FID.",
+
+    'errorLoadingGML': "Erro ao cargar o ficheiro GML ${url}",
+
+    'browserNotSupported': "O seu navegador non soporta a renderizaciÃ³n de vectores. Os renderizadores soportados actualmente son:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: o compoÃ±ente debera ser de tipo ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent ten sido chamado a unha capa sen renderizador. Isto normalmente significa que destruÃ­u unha capa, mais non o executador que estÃ¡ asociado con ela.",
+
+    'minZoomLevelError': "A propiedade minZoomLevel Ã© sÃ³ para uso conxuntamente coas capas FixedZoomLevels-descendent. O feito de que esa capa wfs verifique o minZoomLevel Ã© unha reliquia do pasado. Non podemos, con todo, eliminala sen a posibilidade de non romper as aplicaciÃ³ns baseadas en OL que poidan depender dela. Por iso a estamos deixando obsoleta (a comprobaciÃ³n minZoomLevel de embaixo serÃ¡ eliminada na versiÃ³n 3.0). Por favor, no canto diso use o axuste de resoluciÃ³n mÃ­n/mÃ¡x tal e como estÃ¡ descrito aquÃ­: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "TransacciÃ³n WFS: ÃXITO ${response}",
+
+    'commitFailed': "TransacciÃ³n WFS: FALLIDA ${response}",
+
+    'googleWarning': "A capa do Google non puido cargarse correctamente.\x3cbr\x3e\x3cbr\x3ePara evitar esta mensaxe, escolla unha nova capa base no seleccionador de capas na marxe superior dereita.\x3cbr\x3e\x3cbr\x3eProbablemente, isto acontece porque a escritura da librarÃ­a do Google Maps ou ben non foi incluÃ­da ou ben non contÃ©n a clave API correcta para o seu sitio.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: para axudar a facer funcionar isto correctamente, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3epremede aquÃ­\x3c/a\x3e",
+
+    'getLayerWarning': "A capa ${layerType} foi incapaz de cargarse correctamente.\x3cbr\x3e\x3cbr\x3ePara evitar esta mensaxe, escolla unha nova capa base no seleccionador de capas na marxe superior dereita.\x3cbr\x3e\x3cbr\x3eProbablemente, isto acontece porque a escritura da librarÃ­a ${layerLib} non foi ben incluÃ­da.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: para axudar a facer funcionar isto correctamente, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3epremede aquÃ­\x3c/a\x3e",
+
+    'scale': "Escala = 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "L",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Intentou engadir a capa: ${layerName} ao mapa, pero xa fora engadida",
+
+    'reprojectDeprecated': "EstÃ¡ usando a opciÃ³n \"reproject\" na capa ${layerName}. Esta opciÃ³n estÃ¡ obsoleta: o seu uso foi deseÃ±ado para a visualizaciÃ³n de datos sobre mapas base comerciais, pero esta funcionalidade debera agora ser obtida utilizando a proxecciÃ³n Spherical Mercator. Hai dispoÃ±ible mÃ¡is informaciÃ³n en http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Este mÃ©todo estÃ¡ obsoleto e serÃ¡ eliminado na versiÃ³n 3.0. Por favor, no canto deste use ${newMethod}.",
+
+    'boundsAddError': "Debe achegar os valores x e y Ã¡ funciÃ³n add.",
+
+    'lonlatAddError': "Debe achegar tanto o valor lon coma o lat Ã¡ funciÃ³n add.",
+
+    'pixelAddError': "Debe achegar os valores x e y Ã¡ funciÃ³n add.",
+
+    'unsupportedGeometryType': "Tipo xeomÃ©trico non soportado: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition fallou: o elemento con id ${elemId} pode non estar na sÃºa posiciÃ³n.",
+
+    'filterEvaluateNotImplemented': "avaliar non estÃ¡ implementado para este tipo de filtro."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en.js	(revision 76)
@@ -0,0 +1,128 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["en"]
+ * Dictionary for English.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang.en = {
+
+    'unhandledRequest': "Unhandled request return ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Base Layer",
+
+    'sameProjection':
+        "The overview map only works when it is in the same projection as the main map",
+
+    'readNotImplemented': "Read not implemented.",
+
+    'writeNotImplemented': "Write not implemented.",
+
+    'noFID': "Can't update a feature for which there is no FID.",
+
+    'errorLoadingGML': "Error in loading GML file ${url}",
+
+    'browserNotSupported':
+        "Your browser does not support vector rendering. Currently supported renderers are:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : component should be an ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent called on layer with no renderer. This usually means you " +
+        "destroyed a layer, but not some handler which is associated with it.",
+
+    // console message
+    'minZoomLevelError':
+        "The minZoomLevel property is only intended for use " +
+        "with the FixedZoomLevels-descendent layers. That this " +
+        "wfs layer checks for minZoomLevel is a relic of the" +
+        "past. We cannot, however, remove it without possibly " +
+        "breaking OL based applications that may depend on it." +
+        " Therefore we are deprecating it -- the minZoomLevel " +
+        "check below will be removed at 3.0. Please instead " +
+        "use min/max resolution setting as described here: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS Transaction: SUCCESS ${response}",
+
+    'commitFailed': "WFS Transaction: FAILED ${response}",
+
+    'googleWarning':
+        "The Google Layer was unable to load correctly.<br><br>" +
+        "To get rid of this message, select a new BaseLayer " +
+        "in the layer switcher in the upper-right corner.<br><br>" +
+        "Most likely, this is because the Google Maps library " +
+        "script was either not included, or does not contain the " +
+        "correct API key for your site.<br><br>" +
+        "Developers: For help getting this working correctly, " +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>click here</a>",
+
+    'getLayerWarning':
+        "The ${layerType} Layer was unable to load correctly.<br><br>" +
+        "To get rid of this message, select a new BaseLayer " +
+        "in the layer switcher in the upper-right corner.<br><br>" +
+        "Most likely, this is because the ${layerLib} library " +
+        "script was not correctly included.<br><br>" +
+        "Developers: For help getting this working correctly, " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>click here</a>",
+
+    'scale': "Scale = 1 : ${scaleDenom}",
+    
+    //labels for the graticule control
+    'W': 'W',
+    'E': 'E',
+    'N': 'N',
+    'S': 'S',
+    'graticule': 'Graticule',
+
+    // console message
+    'layerAlreadyAdded':
+        "You tried to add the layer: ${layerName} to the map, but it has already been added",
+
+    // console message
+    'reprojectDeprecated':
+        "You are using the 'reproject' option " +
+        "on the ${layerName} layer. This option is deprecated: " +
+        "its use was designed to support displaying data over commercial " + 
+        "basemaps, but that functionality should now be achieved by using " +
+        "Spherical Mercator support. More information is available from " +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "This method has been deprecated and will be removed in 3.0. " +
+        "Please use ${newMethod} instead.",
+
+    // console message
+    'boundsAddError': "You must pass both x and y values to the add function.",
+
+    // console message
+    'lonlatAddError': "You must pass both lon and lat values to the add function.",
+
+    // console message
+    'pixelAddError': "You must pass both x and y values to the add function.",
+
+    // console message
+    'unsupportedGeometryType': "Unsupported geometry type: ${geomType}",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition failed: element with id ${elemId} may be misplaced.",
+
+    // console message
+    'filterEvaluateNotImplemented': "evaluate is not implemented for this filter type.",
+
+    // **** end ****
+    'end': ''
+    
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ar.js	(revision 76)
@@ -0,0 +1,45 @@
+/* Translators (2009 onwards):
+ *  - Meno25
+ *  - Mutarjem horr
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ar"]
+ * Dictionary for Ø§ÙØ¹Ø±ØšÙØ©.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["ar"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "ÙØµÙØ© Ø¯Ø§ØŠÙ
+Ø©",
+
+    'baseLayer': "Ø§ÙØ·ØšÙØ© Ø§ÙØ§Ø³Ø§Ø³ÙØ©",
+
+    'readNotImplemented': "Ø§ÙÙØ±Ø§Ø¡Ø© ØºÙØ± Ù
+Ø­ÙÙØ©.",
+
+    'writeNotImplemented': "Ø§ÙÙØªØ§ØšØ© ØºÙØ± Ù
+Ø­ÙÙØ©",
+
+    'errorLoadingGML': "Ø®Ø·Ø£ Ø¹ÙØ¯ ØªØ­Ù
+ÙÙ Ø§ÙÙ
+ÙÙ Ø¬Ù Ø§Ù
+ Ø§Ù ${url}",
+
+    'scale': "Ø§ÙÙØ³ØšØ© = 1 : ${scaleDenom}",
+
+    'W': "Øº",
+
+    'E': "ØŽØ±",
+
+    'N': "ØŽÙ
+",
+
+    'S': "Ø¬"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/br.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/br.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/br.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Fulup
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["br"]
+ * Dictionary for Brezhoneg.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["br"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Distro evel reked anveret ${statusText}",
+
+    'permalink': "Peurliamm",
+
+    'overlays': "GwiskadoÃ¹",
+
+    'baseLayer': "Gwiskad diazez",
+
+    'sameProjection': "Ne\'z ar gartenn lec\'hiaÃ± en-dro nemet pa vez heÃ±vel ar banndres anezhi ha hini ar gartenn bennaÃ±",
+
+    'readNotImplemented': "N\'eo ket emplementet al lenn.",
+
+    'writeNotImplemented': "N\'eo ket emplementet ar skrivaÃ±.",
+
+    'noFID': "N\'haller ket hizivaat un elfenn ma n\'eus ket a niverenn-anaout (FID) eviti.",
+
+    'errorLoadingGML': "Fazi e-ser kargaÃ± ar restr GML ${url}",
+
+    'browserNotSupported': "N\'eo ket skoret an daskor vektorel gant ho merdeer. Setu aze an daskorerioÃ¹ skoret evit ar poent :\n${renderers}",
+
+    'componentShouldBe': "addFeatures : bez\' e tlefe ar parzh besaÃ± eus ar seurt ${geomType}",
+
+    'getFeatureError': "Galvet eo bet getFeatureFromEvent called war ur gwiskad hep daskorer. Kement-se a dalvez ez eus bet freuzet ur gwiskad hag hoc\'h eus miret un embreger bennak stag outaÃ±.",
+
+    'minZoomLevelError': "Ne zleer implijout ar perzh minZoomLevel nemet evit gwiskadoÃ¹ FixedZoomLevels-descendent. Ar fed ma wiria ar gwiskad WHS-se hag-eÃ± ez eus eus minZoomLevel zo un aspadenn gozh. Koulskoude n\'omp ket evit e ziverkaÃ± kuit da derriÃ± arloadoÃ¹ diazezet war OL a c\'hallfe bezaÃ± stag outaÃ±. Setu perak eo dispredet -- Lamet kuit e vo ar gwiriaÃ± minZoomLevel a-is er stumm 3.0. Ober gant an arventennoÃ¹ bihanaÃ±/brasaÃ± evel deskrivet amaÃ± e plas : http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Treuzgread WFS : MAT EO ${response}",
+
+    'commitFailed': "Treuzgread WFS Transaction: C\'HWITET ${response}",
+
+    'googleWarning': "N\'eus ket bet gallet kargaÃ± ar gwiskad Google ent reizh.\x3cbr\x3e\x3cbr\x3eEvit en em zizober eus ar c\'hemenn-maÃ±, dibabit ur BaseLayer nevez en diuzer gwiskadoÃ¹ er c\'horn dehoÃ¹ el laez.\x3cbr\x3e\x3cbr\x3eSur a-walc\'h eo peogwir n\'eo ket bet ensoc\'het levraoueg Google Maps pe neuze ne glot ket an alc\'hwez API gant ho lec\'hienn.\x3cbr\x3e\x3cbr\x3eDiorroerien : Evit reizhaÃ± an dra-se, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclick here\x3c/a\x3e",
+
+    'getLayerWarning': "N\'haller ket kargaÃ± ar gwiskad ${layerType} ent reizh.\x3cbr\x3e\x3cbr\x3eEvit en em zizober eus ar c\'hemenn-maÃ±, dibabit ur BaseLayer nevez en diuzer gwiskadoÃ¹ er c\'horn dehoÃ¹ el laez.\x3cbr\x3e\x3cbr\x3eSur a-walc\'h eo peogwir n\'eo ket bet ensoc\'het mat al levraoueg ${layerLib}.\x3cbr\x3e\x3cbr\x3eDiorroerien : Evit gouzout penaos reizhaÃ± an dra-se, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclick here\x3c/a\x3e",
+
+    'scale': "Skeul = 1 : ${scaleDenom}",
+
+    'W': "K",
+
+    'E': "R",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Klasket hoc\'h eus ouzhpennaÃ± ar gwiskad : ${layerName} d\'ar gartenn, met ouzhpennet e oa bet c\'hoazh",
+
+    'reprojectDeprecated': "Emaoc\'h oc\'h implijout an dibarzh \'reproject\' war ar gwiskad ${layerName}. Dispredet eo an dibarzh-maÃ± : bet eo hag e talveze da ziskwel roadennoÃ¹ war-c\'horre kartennoÃ¹ diazez kenwerzhel, un dra hag a c\'haller ober bremaÃ± gant an arc\'hwel dre skor banndres boullek Mercator. Muioc\'h a ditouroÃ¹ a c\'haller da gaout war http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Dispredet eo an daore-se ha tennet e vo kuit eus ar stumm 3.0. Grit gant ${newMethod} e plas.",
+
+    'boundsAddError': "Rekis eo tremen an div dalvoudenn x ha y d\'an arc\'hwel add.",
+
+    'lonlatAddError': "Rekis eo tremen an div dalvoudenn hedred ha ledred d\'an arc\'hwel add.",
+
+    'pixelAddError': "Rekis eo tremen an div dalvoudenn x ha y d\'an arc\'hwel add.",
+
+    'unsupportedGeometryType': "Seurt mentoniezh anskoret : ${geomType}",
+
+    'pagePositionFailed': "C\'hwitet eo OpenLayers.Util.pagePosition : marteze emaÃ± lec\'hiet fall an elfenn id ${elemId}.",
+
+    'filterEvaluateNotImplemented': "N\'eo ket bet emplementet ar priziaÃ± evit seurt siloÃ¹ c\'hoazh."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fr.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Translators (2009 onwards):
+ *  - Damouns
+ *  - IAlex
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["fr"]
+ * Dictionary for FranÃ§ais.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["fr"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "RequÃªte non gÃ©rÃ©e, retournant ${statusText}",
+
+    'permalink': "Permalien",
+
+    'overlays': "Calques",
+
+    'baseLayer': "Calque de base",
+
+    'sameProjection': "La carte de situation ne fonctionne que lorsque sa projection est la mÃªme que celle de la carte principale",
+
+    'readNotImplemented': "Lecture non implÃ©mentÃ©e.",
+
+    'writeNotImplemented': "Ecriture non implÃ©mentÃ©e.",
+
+    'noFID': "Impossible de mettre Ã  jour un objet sans identifiant (fid).",
+
+    'errorLoadingGML': "Erreur au chargement du fichier GML ${url}",
+
+    'browserNotSupported': "Votre navigateur ne supporte pas le rendu vectoriel. Les renderers actuellement supportÃ©s sont : \n${renderers}",
+
+    'componentShouldBe': "addFeatures : le composant devrait Ãªtre de type ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent a Ã©tÃ© appelÃ© sur un calque sans renderer. Cela signifie gÃ©nÃ©ralement que vous avez dÃ©truit cette couche, mais que vous avez conservÃ© un handler qui lui Ã©tait associÃ©.",
+
+    'minZoomLevelError': "La propriÃ©tÃ© minZoomLevel doit seulement Ãªtre utilisÃ©e pour des couches FixedZoomLevels-descendent. Le fait que cette couche WFS vÃ©rifie la prÃ©sence de minZoomLevel est une relique du passÃ©. Nous ne pouvons toutefois la supprimer sans casser des applications qui pourraient en dÃ©pendre. C\'est pourquoi nous la dÃ©prÃ©cions -- la vÃ©rification du minZoomLevel sera supprimÃ©e en version 3.0. A la place, merci d\'utiliser les paramÃštres de rÃ©solutions min/max tel que dÃ©crit sur : http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Transaction WFS : SUCCES ${response}",
+
+    'commitFailed': "Transaction WFS : ECHEC ${response}",
+
+    'googleWarning': "La couche Google n\'a pas Ã©tÃ© en mesure de se charger correctement.\x3cbr\x3e\x3cbr\x3ePour supprimer ce message, choisissez une nouvelle BaseLayer dans le sÃ©lecteur de couche en haut Ã  droite.\x3cbr\x3e\x3cbr\x3eCela est possiblement causÃ© par la non-inclusion de la librairie Google Maps, ou alors parce que la clÃ© de l\'API ne correspond pas Ã  votre site.\x3cbr\x3e\x3cbr\x3eDÃ©veloppeurs : pour savoir comment corriger ceci, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3ecliquez ici\x3c/a\x3e",
+
+    'getLayerWarning': "La couche ${layerType} n\'est pas en mesure de se charger correctement.\x3cbr\x3e\x3cbr\x3ePour supprimer ce message, choisissez une nouvelle BaseLayer dans le sÃ©lecteur de couche en haut Ã  droite.\x3cbr\x3e\x3cbr\x3eCela est possiblement causÃ© par la non-inclusion de la librairie ${layerLib}.\x3cbr\x3e\x3cbr\x3eDÃ©veloppeurs : pour savoir comment corriger ceci, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3ecliquez ici\x3c/a\x3e",
+
+    'scale': "Echelle ~ 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "E",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Vous avez essayÃ© d\'ajouter Ã  la carte le calque : ${layerName}, mais il est dÃ©jÃ  prÃ©sent",
+
+    'reprojectDeprecated': "Vous utilisez l\'option \'reproject\' sur la couche ${layerName}. Cette option est dÃ©prÃ©ciÃ©e : Son usage permettait d\'afficher des donnÃ©es au dessus de couches raster commerciales.Cette fonctionalitÃ© est maintenant supportÃ©e en utilisant le support de la projection Mercator SphÃ©rique. Plus d\'information est disponible sur http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Cette mÃ©thode est dÃ©prÃ©ciÃ©e, et sera supprimÃ©e Ã  la version 3.0. Merci d\'utiliser ${newMethod} Ã  la place.",
+
+    'boundsAddError': "Vous devez passer les deux valeurs x et y Ã  la fonction add.",
+
+    'lonlatAddError': "Vous devez passer les deux valeurs lon et lat Ã  la fonction add.",
+
+    'pixelAddError': "Vous devez passer les deux valeurs x et y Ã  la fonction add.",
+
+    'unsupportedGeometryType': "Type de gÃ©omÃ©trie non supportÃ© : ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition a Ã©chouÃ©: l\'Ã©lÃ©ment d\'id ${elemId} pourrait Ãªtre mal positionnÃ©.",
+
+    'filterEvaluateNotImplemented': "Ã©valuer n\'a pas encore Ã©tÃ© implÃ©mentÃ© pour ce type de filtre."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hr.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hr.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/hr.js	(revision 76)
@@ -0,0 +1,61 @@
+/* Translators (2009 onwards):
+ *  - Mvrban
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["hr"]
+ * Dictionary for Hrvatski.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["hr"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "NepodrÅŸani zahtjev ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Osnovna karta",
+
+    'sameProjection': "Pregledna karta radi jedino kao je u istoj projekciji kao i glava karta",
+
+    'readNotImplemented': "Äitanje nije implementirano.",
+
+    'writeNotImplemented': "Pisanje nije implementirano.",
+
+    'noFID': "Ne mogu aÅŸurirati znaÄajku za koju ne postoji FID.",
+
+    'errorLoadingGML': "GreÅ¡ka u uÄitavanju GML datoteke ${url}",
+
+    'browserNotSupported': "VaÅ¡ preglednik ne podrÅŸava vektorsko renderiranje. Trenutno podrÅŸani rendereri su: ${renderers}",
+
+    'componentShouldBe': "addFeatures : komponenta bi trebala biti ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent je pozvao Layer bez renderera. Ovo obiÄno znaÄi da ste uniÅ¡tiili Layer, a ne neki Handler koji je povezan s njim.",
+
+    'commitSuccess': "WFS Transakcija: USPJEÅ NA ${response}",
+
+    'commitFailed': "WFS Transakcija: NEUSPJEÅ NA ${response}",
+
+    'scale': "Mjerilo = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "PokuÅ¡ali ste dodati layer:  ${layerName} na kartu, ali je veÄ dodan",
+
+    'methodDeprecated': "Ova metoda nije odobrena i biti Äe maknuta u 3.0. Koristite ${newMethod}.",
+
+    'boundsAddError': "Morate dati obje vrijednosti ,  x i y  da bi dodali funkciju.",
+
+    'lonlatAddError': "Morate dati obje vrijednosti , (lon i lat) da bi dodali funkciju.",
+
+    'pixelAddError': "Morate dati obje vrijednosti ,  x i y  da bi dodali funkciju.",
+
+    'unsupportedGeometryType': "NepodrÅŸani tip geometrije: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition nije uspjelo: element sa id ${elemId} moÅŸe biti krivo smjeÅ¡ten."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nl.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nl.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nl.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Siebrand
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["nl"]
+ * Dictionary for Nederlands.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["nl"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Het verzoek is niet afgehandeld met de volgende melding: ${statusText}",
+
+    'permalink': "Permanente verwijzing",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Achtergrondkaart",
+
+    'sameProjection': "De overzichtskaart werkt alleen als de projectie gelijk is aan de projectie van de hoofdkaart",
+
+    'readNotImplemented': "Lezen is niet geÃ¯mplementeerd.",
+
+    'writeNotImplemented': "Schrijven is niet geÃ¯mplementeerd.",
+
+    'noFID': "Een optie die geen FID heeft kan niet bijgewerkt worden.",
+
+    'errorLoadingGML': "Er is een fout opgetreden bij het laden van het GML bestand van ${url}",
+
+    'browserNotSupported': "Uw browser ondersteunt het weergeven van vectoren niet.\nMomenteel ondersteunde weergavemogelijkheden:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : component moet van het type ${geomType} zijn",
+
+    'getFeatureError': "getFeatureFromEvent is aangeroepen op een laag zonder rederer.\nDit betekent meestal dat u een laag hebt verwijderd, maar niet een handler die ermee geassocieerd was.",
+
+    'minZoomLevelError': "De eigenschap minZoomLevel is alleen bedoeld voor gebruik lagen met die afstammen van FixedZoomLevels-lagen.\nDat deze WFS-laag minZoomLevel controleert, is een overblijfsel uit het verleden.\nWe kunnen deze controle echter niet verwijderen zonder op OL gebaseerde applicaties die hervan afhankelijk zijn stuk te maken.\nDaarom heeft deze functionaliteit de eigenschap \'deprecated\' gekregen - de minZoomLevel wordt verwijderd in versie 3.0.\nGebruik in plaats van deze functie de mogelijkheid om min/max voor resolutie in te stellen zoals op de volgende pagina wordt beschreven:\nhttp://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS-transactie: succesvol ${response}",
+
+    'commitFailed': "WFS-transactie: mislukt ${response}",
+
+    'googleWarning': "De Google-Layer kon niet correct geladen worden.\x3cbr /\x3e\x3cbr /\x3e\nOm deze melding niet meer te krijgen, moet u een andere achtergrondkaart kiezen in de laagwisselaar in de rechterbovenhoek.\x3cbr /\x3e\x3cbr /\x3e\nDit komt waarschijnlijk doordat de bibliotheek ${layerLib} niet correct ingevoegd is.\x3cbr /\x3e\x3cbr /\x3e\nOntwikkelaars: \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eklik hier\x3c/a\x3e om dit werkend te krijgen.",
+
+    'getLayerWarning': "De laag ${layerType} kon niet goed geladen worden.\x3cbr /\x3e\x3cbr /\x3e\nOm deze melding niet meer te krijgen, moet u een andere achtergrondkaart kiezen in de laagwisselaar in de rechterbovenhoek.\x3cbr /\x3e\x3cbr /\x3e\nDit komt waarschijnlijk doordat de bibliotheek ${layerLib} niet correct is ingevoegd.\x3cbr /\x3e\x3cbr /\x3e\nOntwikkelaars: \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eklik hier\x3c/a\x3e om dit werkend te krijgen.",
+
+    'scale': "Schaal = 1 : ${scaleDenom}",
+
+    'W': "W",
+
+    'E': "O",
+
+    'N': "N",
+
+    'S': "Z",
+
+    'layerAlreadyAdded': "U hebt geprobeerd om de laag  ${layerName} aan de kaart toe te voegen, maar deze is al toegevoegd",
+
+    'reprojectDeprecated': "U gebruikt de optie \'reproject\' op de laag ${layerName}.\nDeze optie is vervallen: deze optie was ontwikkeld om gegevens over commerciÃ«le basiskaarten weer te geven, maar deze functionaliteit wordt nu bereikt door ondersteuning van Spherical Mercator.\nMeer informatie is beschikbaar op http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Deze methode is verouderd en wordt verwijderd in versie 3.0.\nGebruik ${newMethod}.",
+
+    'boundsAddError': "U moet zowel de x- als de y-waarde doorgeven aan de toevoegfunctie.",
+
+    'lonlatAddError': "U moet zowel de lengte- als de breedtewaarde doorgeven aan de toevoegfunctie.",
+
+    'pixelAddError': "U moet zowel de x- als de y-waarde doorgeven aan de toevoegfunctie.",
+
+    'unsupportedGeometryType': "Dit geometrietype wordt niet ondersteund: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition is mislukt: het element met id ${elemId} is wellicht onjuist geplaatst.",
+
+    'filterEvaluateNotImplemented': "evalueren is niet geÃ¯mplementeerd voor dit filtertype."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nn.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nn.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nn.js	(revision 76)
@@ -0,0 +1,27 @@
+/* Translators (2009 onwards):
+ *  - Harald Khan
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["nn"]
+ * Dictionary for âªNorsk (nynorsk)â¬.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["nn"] = OpenLayers.Util.applyDefaults({
+
+    'scale': "Skala = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "Du freista Ã¥ leggja til laget Â«${layerName}Â» pÃ¥ kartet, men det har alt vorte lagt til.",
+
+    'boundsAddError': "Du er nÃžydd til Ã¥ gje bÃ¥de ein x- og ein y-verdi til Â«addÂ»-funksjonen.",
+
+    'lonlatAddError': "Du er nÃžydd til Ã¥ gje bÃ¥de lon- og lat-verdiar til Â«addÂ»-funksjonen.",
+
+    'pixelAddError': "Du er nÃžydd til Ã¥ gje bÃ¥de ein x- og ein y-verdi til Â«addÂ»-funksjonen."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/it.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/it.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/it.js	(revision 76)
@@ -0,0 +1,116 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["it"]
+ * Dictionary for Italian.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang.it = {
+
+    'unhandledRequest': "Codice di ritorno della richiesta ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Livello base",
+
+    'sameProjection':
+        "La mini mappa funziona solamente se ha la stessa proiezione della mappa principale",
+
+    'readNotImplemented': "Lettura non implementata.",
+
+    'writeNotImplemented': "Scrittura non implementata.",
+
+    'noFID': "Impossibile aggiornare un elemento grafico che non abbia il FID.",
+
+    'errorLoadingGML': "Errore nel caricamento del file GML ${url}",
+
+    'browserNotSupported':
+        "Il tuo browser non supporta il rendering vettoriale. I renderizzatore attualemnte supportati sono:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : il componente dovrebbe essere di tipo ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent chiamata su di un livello senza renderizzatore. CiÃ² significa che " +
+        "il livello Ãš stato cancellato, ma non i gestori associati ad esso.",
+
+    // console message
+    'minZoomLevelError':
+        "La proprietÃ  minZoomLevel Ãš da utilizzare solamente " +
+        "con livelli che abbiano FixedZoomLevels. Il fatto che " +
+        "questo livello wfs controlli la proprietÃ  minZoomLevel Ãš " +
+        "un retaggio del passato. Non possiamo comunque rimuoverla " +
+        "senza rompere le vecchie applicazioni che dipendono su di essa." +
+        "Quindi siamo costretti a deprecarla -- minZoomLevel " +
+        "e sarÃ  rimossa dalla vesione 3.0. Si prega di utilizzare i " +
+        "settaggi di risoluzione min/max come descritto qui: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Transazione WFS: SUCCESS ${response}",
+
+    'commitFailed': "Transazione WFS: FAILED ${response}",
+
+    'googleWarning':
+        "Il livello Google non Ãš riuscito a caricare correttamente.<br><br>" +
+        "Per evitare questo messaggio, seleziona un nuovo BaseLayer " +
+        "nel selettore di livelli nell'angolo in alto a destra.<br><br>" +
+        "PiÃ¹ precisamente, ciÃ² accade perchÃš la libreria Google Maps " +
+        "non Ãš stata inclusa nella pagina, oppure non contiene la " +
+        "corretta API key per il tuo sito.<br><br>" +
+        "Sviluppatori: Per aiuto su come farlo funzionare correttamente, " +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>clicca qui</a>",
+
+    'getLayerWarning':
+        "Il livello ${layerType} non Ãš riuscito a caricare correttamente.<br><br>" +
+        "Per evitare questo messaggio, seleziona un nuovo BaseLayer " +
+        "nel selettore di livelli nell'angolo in alto a destra.<br><br>" +
+        "PiÃ¹ precisamente, ciÃ² accade perchÃš la libreria ${layerLib} " +
+        "non Ãš stata inclusa nella pagina.<br><br>" +
+        "Sviluppatori: Per aiuto su come farlo funzionare correttamente, " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>clicca qui</a>",
+
+    'scale': "Scala = 1 : ${scaleDenom}",
+
+    // console message
+    'layerAlreadyAdded':
+        "Stai cercando di aggiungere il livello: ${layerName} alla mappa, ma tale livello Ãš giÃ  stato aggiunto.",
+
+    // console message
+    'reprojectDeprecated':
+        "Stai utilizzando l'opzione 'reproject' sul livello ${layerName}. " +
+        "Questa opzione Ãš deprecata: il suo utilizzo Ãš stato introdotto per" +
+        "supportare il disegno dei dati sopra mappe commerciali, ma tale " + 
+        "funzionalitÃ  dovrebbe essere ottenuta tramite l'utilizzo della proiezione " +
+        "Spherical Mercator. Per maggiori informazioni consultare qui " +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "Questo metodo Ãš stato deprecato e sarÃ  rimosso dalla versione 3.0. " +
+        "Si prega di utilizzare il metodo ${newMethod} in alternativa.",
+
+    // console message
+    'boundsAddError': "Devi specificare i valori di x e y alla funzione add.",
+
+    // console message
+    'lonlatAddError': "Devi specificare i valori di lon e lat alla funzione add.",
+
+    // console message
+    'pixelAddError': "Devi specificare i valori di x e y alla funzione add.",
+
+    // console message
+    'unsupportedGeometryType': "Tipo di geometria non supportata: ${geomType}",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition fallita: l'elemento con id ${elemId} Ãš posizionato in modo errato.",
+                    
+    'end': ''
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/cs-CZ.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/cs-CZ.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/cs-CZ.js	(revision 76)
@@ -0,0 +1,69 @@
+/* Translators (2009 onwards):
+ *  - Mormegil
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["cs-CZ"]
+ * Dictionary for Äesky.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["cs-CZ"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "NezpracovanÃ¡ nÃ¡vratovÃ¡ hodnota ${statusText}",
+
+    'permalink': "TrvalÃœ odkaz",
+
+    'overlays': "PÅekryvnÃ© vrstvy",
+
+    'baseLayer': "PodkladovÃ© vrstvy",
+
+    'sameProjection': "PÅehledka pracuje sprÃ¡vnÄ pouze tehdy, pokud je ve stejnÃ© projekci jako hlavnÃ­ mapa",
+
+    'readNotImplemented': "Read nenÃ­ implementovÃ¡no.",
+
+    'writeNotImplemented': "Write nenÃ­ implementovÃ¡no.",
+
+    'noFID': "Nelze aktualizovat prvek, pro kterÃœ neexistuje FID.",
+
+    'errorLoadingGML': "Chyba pÅi naÄÃ­tÃ¡nÃ­ souboru GML ${url}",
+
+    'browserNotSupported': "VÃ¡Å¡ prohlÃ­ÅŸeÄ nepodporuje vykreslovÃ¡nÃ­ vektorÅ¯. MomentÃ¡lnÄ podporovanÃ© nÃ¡stroje jsou::\n${renderers}",
+
+    'componentShouldBe': "addFeatures : komponenta by mÄla bÃœt ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent bylo zavolÃ¡no na vrstvÄ, kterÃ¡ nemÃ¡ vykreslovaÄ. To obyÄejnÄ znamenÃ¡, ÅŸe jste odstranil vrstvu, ale ne rutinu s nÃ­ asociovanou.",
+
+    'minZoomLevelError': "Vlastnost minZoomLevel by se mÄla pouÅŸÃ­vat pouze s potomky FixedZoomLevels vrstvami. To znamenÃ¡, ÅŸe vrstva wfs kontroluje, zda-li minZoomLevel nenÃ­ zbytek z minulosti.Nelze to ovÅ¡em vyjmout bez moÅŸnosti, ÅŸe bychom rozbili aplikace postavenÃ© na OL, kterÃ© by na tom mohly zÃ¡viset. Proto tuto vlastnost nedoporuÄujeme pouÅŸÃ­vat --  kontrola minZoomLevel bude odstranÄna ve verzi 3.0. PouÅŸijte prosÃ­m radÄji nastavenÃ­ min/max podle pÅÃ­kaldu popsanÃ©ho na: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "WFS Transaction: ÃSPÄCH ${response}",
+
+    'commitFailed': "WFS Transaction: CHYBA ${response}",
+
+    'googleWarning': "NepodaÅilo se sprÃ¡vnÄ naÄÃ­st vrstvu Google.\x3cbr\x3e\x3cbr\x3eAbyste se zbavili tÃ©to zprÃ¡vy, zvolte jinou zÃ¡kladnÃ­ vrstvu v pÅepÃ­naÄi vrstev.\x3cbr\x3e\x3cbr\x3eTo se vÄtÅ¡inou stÃ¡vÃ¡, pokud nebyl naÄten skript, nebo neobsahuje sprÃ¡vnÃœ klÃ­Ä pro API pro tuto strÃ¡nku.\x3cbr\x3e\x3cbr\x3eVÃœvojÃ¡Åi: Pro pomoc, aby tohle fungovalo , \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3ekliknÄte sem\x3c/a\x3e",
+
+    'getLayerWarning': "The ${layerType} Layer was unable to load correctly.\x3cbr\x3e\x3cbr\x3eTo get rid of this message, select a new BaseLayer in the layer switcher in the upper-right corner.\x3cbr\x3e\x3cbr\x3eMost likely, this is because the ${layerLib} library script was either not correctly included.\x3cbr\x3e\x3cbr\x3eDevelopers: For help getting this working correctly, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclick here\x3c/a\x3e",
+
+    'scale': "MÄÅÃ­tko = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "Pokusili jste se pÅidat vrstvu: ${layerName} do mapy, ale tato vrstva je jiÅŸ v mapÄ pÅÃ­tomna.",
+
+    'reprojectDeprecated': "PouÅŸil jste volbu \'reproject\' ve vrstvÄ ${layerName}. Tato volba nenÃ­ doporuÄenÃ¡: byla zde proto, aby bylo moÅŸno zobrazovat data z okomerÄnÃ­ch serverÅ¯, ale tato funkce je nynÃ­ zajiÅ¡tÄna pomocÃ­ podpory Spherical Mercator. VÃ­ce informacÃ­ naleznete na http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Tato metoda je zavrÅŸenÃ¡ a bude ve verzi 3.0 odstranÄna. ProsÃ­m, pouÅŸijte radÄji ${newMethod}.",
+
+    'boundsAddError': "Pro pÅÃ­davnou funkci musÃ­te zadat obÄ souÅadnice x a y.",
+
+    'lonlatAddError': "Pro pÅÃ­davnou funkci musÃ­te zadat obÄ souÅadnice lon a lat.",
+
+    'pixelAddError': "Pro pÅÃ­davnou funkci musÃ­te zadat obÄ souÅadnice x a y.",
+
+    'unsupportedGeometryType': "NepodporovanÃœ typ geometrie: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition selhalo: element s  id ${elemId} je asi umÃ­stÄn chybnÄ."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ca.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ca.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ca.js	(revision 76)
@@ -0,0 +1,128 @@
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ca"]
+ * Dictionary for Catalan, UTF8 encoding. Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang.ca = {
+
+    'unhandledRequest': "Resposta a peticiÃ³ no gestionada ${statusText}",
+
+    'permalink': "EnllaÃ§ permanent",
+
+    'overlays': "Capes addicionals",
+
+    'baseLayer': "Capa Base",
+
+    'sameProjection':
+        "El mapa de referÃšncia nomÃ©s funciona si tÃ© la mateixa projecciÃ³ que el mapa principal",
+
+    'readNotImplemented': "Lectura no implementada.",
+
+    'writeNotImplemented': "Escriptura no implementada.",
+
+    'noFID': "No es pot actualitzar un element per al que no existeix FID.",
+
+    'errorLoadingGML': "Error carregant el fitxer GML ${url}",
+
+    'browserNotSupported':
+        "El seu navegador no suporta renderitzaciÃ³ vectorial. Els renderitzadors suportats actualment sÃ³n:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : el component ha de ser de tipus ${geomType}",
+
+    // console message
+    'getFeatureError':
+        "getFeatureFromEvent ha estat cridat des d'una capa sense renderizador. AixÃ² normalment vol dir que " +
+        "s'ha eliminat una capa, perÃ² no el handler associat a ella.",
+
+    // console message
+    'minZoomLevelError':
+        "La propietat minZoomLevel s'ha d'utilitzar nomÃ©s " +
+        "amb les capes que tenen FixedZoomLevels. El fet que " +
+        "una capa wfs comprovi minZoomLevel Ã©s una relÃ­quia del " +
+        "passat. No podem, perÃ², eliminar-la sense trencar " +
+        "les aplicacions d'OpenLayers que en puguin dependre. " +
+        "AixÃ­ doncs estem fent-la obsoleta -- la comprovaciÃ³ " +
+        "minZoomLevel s'eliminarÃ  a la versiÃ³ 3.0. Feu servir " +
+        "els parÃ metres min/max resolution en substituciÃ³, tal com es descriu aquÃ­: " +
+        "http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "TransacciÃ³ WFS: CORRECTA ${response}",
+
+    'commitFailed': "TransacciÃ³ WFS: HA FALLAT ${response}",
+
+    'googleWarning':
+        "La capa Google no s'ha pogut carregar correctament.<br><br>" +
+        "Per evitar aquest missatge, seleccioneu una nova Capa Base " +
+        "al gestor de capes de la cantonada superior dreta.<br><br>" +
+        "Probablement aixÃ² Ã©s degut a que l'script de la biblioteca de " +
+    "Google Maps no ha estat inclÃ²s a la vostra pÃ gina, o no " +
+    "contÃ© la clau de l'API correcta per a la vostra adreÃ§a.<br><br>" +
+        "Desenvolupadors: Per obtenir consells sobre com fer anar aixÃ², " +
+        "<a href='http://trac.openlayers.org/wiki/Google' " +
+        "target='_blank'>fÃ©u clic aquÃ­</a>",
+
+    'getLayerWarning':
+        "Per evitar aquest missatge, seleccioneu una nova Capa Base " +
+        "al gestor de capes de la cantonada superior dreta.<br><br>" +
+        "Probablement aixÃ² Ã©s degut a que l'script de la biblioteca " +
+        "${layerLib} " +
+        "no ha estat inclÃ²s a la vostra pÃ gina.<br><br>" +
+        "Desenvolupadors: Per obtenir consells sobre com fer anar aixÃ², " +
+        "<a href='http://trac.openlayers.org/wiki/${layerLib}' " +
+        "target='_blank'>fÃ©u clic aquÃ­</a>",
+
+    'scale': "Escala = 1 : ${scaleDenom}",
+
+    //labels for the graticule control
+    'W': 'O',
+    'E': 'E',
+    'N': 'N',
+    'S': 'S',
+    'graticule': 'RetÃ­cula',    
+        
+    // console message
+    'layerAlreadyAdded':
+        "Heu intentat afegir la capa: ${layerName} al mapa, perÃ² ja ha estat afegida anteriorment",
+
+    // console message
+    'reprojectDeprecated':
+        "Esteu fent servir l'opciÃ³ 'reproject' a la capa " +
+        "${layerName}. Aquesta opciÃ³ Ã©s obsoleta: el seu Ãºs fou concebut " +
+        "per suportar la visualitzaciÃ³ de dades sobre mapes base comercials, " + 
+        "perÃ² ara aquesta funcionalitat s'hauria d'assolir mitjanÃ§ant el suport " +
+        "de la projecciÃ³ Spherical Mercator. MÃ©s informaciÃ³ disponible a " +
+        "http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    // console message
+    'methodDeprecated':
+        "Aquest mÃštode Ã©s obsolet i s'eliminarÃ  a la versiÃ³ 3.0. " +
+        "Si us plau feu servir em mÃštode alternatiu ${newMethod}.",
+
+    // console message
+    'boundsAddError': "Ha de proporcionar els valors x i y a la funciÃ³ add.",
+
+    // console message
+    'lonlatAddError': "Ha de proporcionar els valors lon i lat a la funciÃ³ add.",
+
+    // console message
+    'pixelAddError': "Ha de proporcionar els valors x i y a la funciÃ³ add.",
+
+    // console message
+    'unsupportedGeometryType': "Tipus de geometria no suportada: ${geomType}",
+
+    // console message
+    'pagePositionFailed':
+        "OpenLayers.Util.pagePosition ha fallat: l'element amb id ${elemId} pot estar fora de lloc.",
+                    
+    // console message
+    'filterEvaluateNotImplemented': "evaluate no estÃ  implementat per aquest tipus de filtre.",
+
+    // **** end ****
+    'end': ''
+
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en-CA.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en-CA.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/en-CA.js	(revision 76)
@@ -0,0 +1,21 @@
+/**
+ * @requires OpenLayers/Lang/en.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["en-CA"]
+ * Dictionary for English-CA.  This dictionary inherits from the standard
+ *     English dictionary.  Override only those entries with language specific
+ *     to the CA region.
+ *     
+ * Keys for entries are used in calls to <OpenLayers.Lang.translate>.  Entry
+ *     bodies are normal strings or strings formatted for use with
+ *     <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang['en-CA'] = OpenLayers.Util.applyDefaults({
+
+    // add any entries specific for this region here
+    // e.g.
+    // "someKey": "Some regionally specific value"
+    
+}, OpenLayers.Lang["en"]);
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/pt.js	(revision 76)
@@ -0,0 +1,81 @@
+/* Translators (2009 onwards):
+ *  - Hamilton Abreu
+ *  - Malafaya
+ *  - Waldir
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["pt"]
+ * Dictionary for PortuguÃªs.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["pt"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Servidor devolveu erro nÃ£o contemplado ${statusText}",
+
+    'permalink': "LigaÃ§Ã£o permanente",
+
+    'overlays': "SobreposiÃ§Ãµes",
+
+    'baseLayer': "Camada Base",
+
+    'sameProjection': "O mapa panorÃ¢mico sÃ³ funciona quando estÃ¡ na mesma projeÃ§Ã£o que o mapa principal",
+
+    'readNotImplemented': "Leitura nÃ£o implementada.",
+
+    'writeNotImplemented': "Escrita nÃ£o implementada.",
+
+    'noFID': "NÃ£o Ã© possÃ­vel atualizar um elemento para a qual nÃ£o hÃ¡ FID.",
+
+    'errorLoadingGML': "Erro ao carregar ficheiro GML ${url}",
+
+    'browserNotSupported': "O seu navegador nÃ£o suporta renderizaÃ§Ã£o vetorial. Actualmente os renderizadores suportados sÃ£o:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: componente deve ser um(a) ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent foi chamado numa camada sem renderizador. Isto normalmente significa que destruiu uma camada, mas nÃ£o um manipulador \'\'(handler)\'\' que lhe estÃ¡ associado.",
+
+    'minZoomLevelError': "A propriedade minZoomLevel sÃ³ deve ser usada com as camadas descendentes da FixedZoomLevels. A verificaÃ§Ã£o da propriedade por esta camada wfs Ã© uma relÃ­quia do passado. No entanto, nÃ£o podemos removÃª-la sem correr o risco de afectar aplicaÃ§Ãµes OL que dependam dela. Portanto, estamos a tornÃ¡-la obsoleta -- a verificaÃ§Ã£o minZoomLevel serÃ¡ removida na versÃ£o 3.0. Em vez dela, por favor, use as opÃ§Ãµes de resoluÃ§Ã£o min/max descritas aqui: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "TransacÃ§Ã£o WFS: SUCESSO ${response}",
+
+    'commitFailed': "TransacÃ§Ã£o WFS: FALHOU ${response}",
+
+    'googleWarning': "A Camada Google nÃ£o foi correctamente carregada.\x3cbr\x3e\x3cbr\x3ePara deixar de receber esta mensagem, seleccione uma nova Camada-Base no \'\'switcher\'\' de camadas no canto superior direito.\x3cbr\x3e\x3cbr\x3eProvavelmente, isto acontece porque o \'\'script\'\' da biblioteca do Google Maps nÃ£o foi incluÃ­do ou nÃ£o contÃ©m a chave API correcta para o seu sÃ­tio.\x3cbr\x3e\x3cbr\x3eProgramadores: Para ajuda sobre como solucionar o problema \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclique aqui\x3c/a\x3e .",
+
+    'getLayerWarning': "A camada ${layerType} nÃ£o foi correctamente carregada.\x3cbr\x3e\x3cbr\x3ePara desactivar esta mensagem, seleccione uma nova Camada-Base no \'\'switcher\'\' de camadas no canto superior direito.\x3cbr\x3e\x3cbr\x3eProvavelmente, isto acontece porque o \'\'script\'\' da biblioteca ${layerLib} nÃ£o foi incluÃ­do correctamente.\x3cbr\x3e\x3cbr\x3eProgramadores: Para ajuda sobre como solucionar o problema \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclique aqui\x3c/a\x3e .",
+
+    'scale': "Escala = 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "E",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "VocÃª tentou adicionar a camada: ${layerName} ao mapa, mas ela jÃ¡ tinha sido adicionada antes",
+
+    'reprojectDeprecated': "EstÃ¡ usando a opÃ§Ã£o \'reproject\' na camada ${layerName}. Esta opÃ§Ã£o Ã© obsoleta: foi concebida para permitir a apresentaÃ§Ã£o de dados sobre mapas-base comerciais, mas esta funcionalidade Ã© agora suportada pelo Mercator EsfÃ©rico. Mais informaÃ§Ã£o estÃ¡ disponÃ­vel em http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Este mÃ©todo foi declarado obsoleto e serÃ¡ removido na versÃ£o 3.0. Por favor, use ${newMethod} em vez disso.",
+
+    'boundsAddError': "VocÃª deve passar tanto o valor x como o y Ã  funÃ§Ã£o de adiÃ§Ã£o.",
+
+    'lonlatAddError': "VocÃª deve passar tanto o valor lon como o lat Ã  funÃ§Ã£o de adiÃ§Ã£o.",
+
+    'pixelAddError': "VocÃª deve passar tanto o valor x como o y Ã  funÃ§Ã£o de adiÃ§Ã£o.",
+
+    'unsupportedGeometryType': "Tipo de geometria nÃ£o suportado: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition falhou: o elemento com o id ${elemId} poderÃ¡ estar mal-posicionado.",
+
+    'filterEvaluateNotImplemented': "avaliar nÃ£o estÃ¡ implementado para este tipo de filtro."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nds.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nds.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/nds.js	(revision 76)
@@ -0,0 +1,61 @@
+/* Translators (2009 onwards):
+ *  - Slomox
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["nds"]
+ * Dictionary for PlattdÃŒÃŒtsch.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["nds"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Unbehannelt TrÃŒchmellels fÃ¶r de Anfraag ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Achtergrundkoort",
+
+    'sameProjection': "De Ãversichtskoort geiht blot, wenn de sÃŒlve Projekschoon as bi de HÃ¶Ã¶ftkoort bruukt warrt",
+
+    'readNotImplemented': "Lesen is nich inricht.",
+
+    'writeNotImplemented': "Schrieven is nich inricht.",
+
+    'noFID': "En Feature, dat keen FID hett, kann nich aktuell maakt warrn.",
+
+    'errorLoadingGML': "Fehler biât Laden vun de GML-Datei ${url}",
+
+    'browserNotSupported': "Dien Browser ÃŒnnerstÃŒtt keen Vektorbiller. ÃnnerstÃŒtt Renderers:\n${renderers}",
+
+    'componentShouldBe': "addFeatures : Kumponent schull man den Typ ${geomType} hebben",
+
+    'getFeatureError': "getFeatureFromEvent is von en Laag ahn Render opropen worrn. Dat bedÃŒÃŒdt normalerwies, dat en Laag wegmaakt worrn is, aver nich de Handler, de dor op verwiest.",
+
+    'commitSuccess': "WFS-Transakschoon: hett klappt ${response}",
+
+    'commitFailed': "WFS-Transakschoon: hett nich klappt ${response}",
+
+    'scale': "Skaal = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "Du versÃ¶chst de Laag â${layerName}â to de Koort totofÃ¶gen, man de is al tofÃ¶Ã¶gt",
+
+    'methodDeprecated': "Disse Methood is oold un schall dat in 3.0 nich mehr geven. Bruuk dor man beter ${newMethod} fÃ¶r.",
+
+    'boundsAddError': "De Weert x un y, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",
+
+    'lonlatAddError': "De Weert lon un lat, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",
+
+    'pixelAddError': "De Weert x un y, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",
+
+    'unsupportedGeometryType': "Nich ÃŒnnerstÃŒtt Geometrie-Typ: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition gÃŒng nich: Element mit de Id ${elemId} is villicht anân verkehrten Platz."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ksh.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ksh.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ksh.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Purodha
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ksh"]
+ * Dictionary for Ripoarisch.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["ksh"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Met dÃ€ Antwoot op en Aanfrooch ham_mer nix aanjefange: ${statusText}",
+
+    'permalink': "Lengk op Duuer",
+
+    'overlays': "DrÃ¶vver jelaat",
+
+    'baseLayer': "Jrund-Nivoh",
+
+    'sameProjection': "De Ãvverseeschs_Kaat deiht et bloÃ, wann se de sÃ€lve ProjÃ€xjuhn bruche deiht, wi de Houp_Kaat",
+
+    'readNotImplemented': "â\x3ccode lang=\"en\"\x3eread\x3c/code\x3eâ is em Projramm nit fÃŒrjesinn.",
+
+    'writeNotImplemented': "â\x3ccode lang=\"en\"\x3ewrite\x3c/code\x3eâ is em Projramm nit fÃŒrjesinn.",
+
+    'noFID': "En Saach, woh kein \x3ci lang=\"en\"\x3eFID\x3c/i\x3e fÃ¶r doh es, lÃ¶ht sesch nit Ã€ndere.",
+
+    'errorLoadingGML': "FÃ€hler beim \x3ci lang=\"en\"\x3eGML\x3c/i\x3e-Datei-Laade vun \x3ccode\x3e${url}\x3c/code\x3e",
+
+    'browserNotSupported': "Dinge Brauser kann kein VÃ€ktore uÃjÃ€vve. De Zoote UÃjaabe, di em Momang jon, sen:\n${renderers}",
+
+    'componentShouldBe': "\x3ccode lang=\"en\"\x3eaddFeatures\x3c/code\x3e: dÃ€ Aandeil sullt vun dÃ€ Zoot â\x3ccode lang=\"en\"\x3e${geomType}\x3c/code\x3eâ sin.",
+
+    'getFeatureError': "\x3ccode lang=\"en\"\x3egetFeatureFromEvent\x3c/code\x3e es vun enem Nivoh opjeroofe woode, woh et kei Projramm zom UÃjÃ€vve jit. Dat bedÃŒgg fÃ¶r jewÃ¶hnlesch, dat De e Nivoh kapott jemaat hÃ€s, Ã€vver nit e Projramm fÃ¶r domet Ã¶mzejonn, wat domet verbonge es.",
+
+    'minZoomLevelError': "De Eijeschaff â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ es bloÃ dofÃ¶r jedaach, dat mer se met dÃ€ NivvohÃ bruch, di vun \x3ccode lang=\"en\"\x3eFixedZoomLevels\x3c/code\x3e affhange don. Dat dat \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-Nivvoh Ã¶vverhoup de Eijeschaff â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ prÃ¶hfe deiht, es noch Ã¶vveresch vun frÃ¶hjer. Mer kÃŒnne dat Ã€vver jez nit fott lohÃe, oohne dat mer Jevaa loufe, dat Aanwendunge vun OpenLayers nit mieh loufe, di sesch doh velleijsch noch drop am verlohÃe sin. DrÃ¶m sare mer, dat mer et nit mieh han welle, un de â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ-Eijeschaff weed hee vun de Version 3.0 af nit mieh jeprÃ¶Ã¶f wÃ€de. Nemm dofÃ¶r de Enstellung fÃ¶r de hÃŒhÃte un de kleinÃte OplÃ¶hsung, esu wi et en http://trac.openlayers.org/wiki/SettingZoomLevels opjeschrevve es.",
+
+    'commitSuccess': "DÃ€ \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-VÃ¶rjang es joot jeloufe: ${response}",
+
+    'commitFailed': "DÃ€ \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-VÃ¶rjang es scheif jejange: ${response}",
+
+    'googleWarning': "Dat Nivvoh \x3ccode lang=\"en\"\x3eGoogle\x3c/code\x3e kunnt nit reschtesch jelaade wÃ€Ã€de.\x3cbr /\x3e\x3cbr /\x3eÃm hee di Nohreesch loÃ ze krijje, donn en ander Jrund-Nivvoh uÃsÃ¶hke, rÃ€hÃ bovve en de Ãk.\x3cbr /\x3e\x3cbr /\x3eWascheinlesch es dat wiel dat \x3ci lang=\"en\"\x3eGoogle-Maps\x3c/i\x3e-Skrepp entweeder nit reschtesch enjebonge wood, udder nit dÃ€ reschtejje \x3ci lang=\"en\"\x3eAPI\x3c/i\x3e-SchlÃ¶Ãel fÃ¶r Ding Web-Ãait scheke deiht.\x3cbr /\x3e\x3cbr /\x3eFÃ¶r Projrammierer jidd_et HÃ¶lp do_drÃ¶vver, \x3ca href=\"http://trac.openlayers.org/wiki/Google\" target=\"_blank\"\x3ewi mer dat aan et Loufe brengk\x3c/a\x3e.",
+
+    'getLayerWarning': "Dat Nivvoh \x3ccode\x3e${layerType}\x3c/code\x3e kunnt nit reschtesch jelaade wÃ€Ã€de.\x3cbr /\x3e\x3cbr /\x3eÃm hee di Nohreesch loÃ ze krijje, donn en ander Jrund-Nivvoh uÃsÃ¶hkre, rÃ€hÃ bovve en de Ãk.\x3cbr /\x3e\x3cbr /\x3eWascheinlesch es dat, wiel dat Skrepp \x3ccode\x3e${layerLib}\x3c/code\x3e nit reschtesch enjebonge wood.\x3cbr /\x3e\x3cbr /\x3eFÃ¶r Projrammierer jidd_Et HÃ¶lp do_drÃ¶vver, \x3ca href=\"http://trac.openlayers.org/wiki/${layerLib}\" target=\"_blank\"\x3ewi mer dat aan et Loufe brengk\x3c/a\x3e.",
+
+    'scale': "MohÃshtaab = 1 : ${scaleDenom}",
+
+    'W': "W",
+
+    'E': "O",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Do hÃ€Ã versÃ¶hk, dat Nivvoh \x3ccode\x3e${layerName}\x3c/code\x3e en di Kaat eren ze brÃ€nge, et wohr Ã€vver ald do dren.",
+
+    'reprojectDeprecated': "Do bruchs de UÃwahl \x3ccode\x3ereproject\x3c/code\x3e op dÃ€m Nivvoh \x3ccode\x3e${layerName}\x3c/code\x3e. Di UÃwahl es nit mieh jÃ€hn jesinn. Se wohr dofÃ¶r jedaach, Ã¶m Date op jeschÃ€Ã€fsmÃ€Ãesch eruÃ jejovve Kaate bovve drop ze moole, wat Ã€vver enzwesche besser met dÃ€ ÃngershtÃ¶zung fÃ¶r de ÃfÃ€Ã€resche MÃ€kaator Beldscher jeiht. Doh kanns De mieh drÃ¶vver fenge op dÃ€ Sigg: http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Hee di Metood es nim_mih aktoÃ€ll un et weed se en dÃ€ Version 3.0 nit mieh jÃ€vve. Nemm \x3ccode\x3e${newMethod}\x3c/code\x3e dofÃ¶Ã¶r.",
+
+    'boundsAddError': "Do moÃ beeds vun de \x3ccode\x3ex\x3c/code\x3e un \x3ccode\x3ey\x3c/code\x3e WÃ€Ã€te aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",
+
+    'lonlatAddError': "Do moÃ beeds \x3ccode\x3elon\x3c/code\x3e un \x3ccode\x3elat\x3c/code\x3e aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",
+
+    'pixelAddError': "Do moÃ beeds \x3ccode\x3ex\x3c/code\x3e un \x3ccode\x3ey\x3c/code\x3e aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",
+
+    'unsupportedGeometryType': "De Zoot Jommetrii dom_mer nit ongershtÃ¶ze: \x3ccode\x3e${geomType}\x3c/code\x3e",
+
+    'pagePositionFailed': "\x3ccode lang=\"en\"\x3eOpenLayers.Util.pagePosition\x3c/code\x3e es donevve jejange: dat Denge met dÃ€ KÃ€nnong \x3ccode\x3e${elemId}\x3c/code\x3e kÃŒnnt am verkeehte Plaz sin.",
+
+    'filterEvaluateNotImplemented': "â\x3ccode lang=\"en\"\x3eevaluate\x3c/code\x3eâ es fÃ¶r di Zoot Fellter nit enjereschdt."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/bg.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/bg.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/bg.js	(revision 76)
@@ -0,0 +1,31 @@
+/* Translators (2009 onwards):
+ *  - DCLXVI
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["bg"]
+ * Dictionary for ÐÑÐ»Ð³Ð°ÑÑÐºÐž.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["bg"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "ÐÐŸÑÑÐŸÑÐœÐœÐ° Ð¿ÑÐµÐ¿ÑÐ°ÑÐºÐ°",
+
+    'baseLayer': "ÐÑÐœÐŸÐ²ÐµÐœ ÑÐ»ÐŸÐ¹",
+
+    'errorLoadingGML': "ÐÑÐµÑÐºÐ° Ð¿ÑÐž Ð·Ð°ÑÐµÐ¶ÐŽÐ°ÐœÐµ ÐœÐ° GML ÑÐ°Ð¹Ð» ${url}",
+
+    'scale': "ÐÐ°ÑÐ°Ð± = 1 : ${scaleDenom}",
+
+    'layerAlreadyAdded': "ÐÐ¿ÐžÑÐ°Ñ
+ÑÐµ ÐŽÐ° ÐŽÐŸÐ±Ð°Ð²ÐžÑÐµ ÑÐ»ÐŸÐ¹ ${layerName} Ð² ÐºÐ°ÑÑÐ°ÑÐ°, ÐœÐŸ ÑÐŸÐ¹ Ð²ÐµÑÐµ Ðµ ÐŽÐŸÐ±Ð°Ð²ÐµÐœ",
+
+    'methodDeprecated': "Ð¢ÐŸÐ·Ðž ÐŒÐµÑÐŸÐŽ Ðµ ÐŸÑÑÐ°ÑÑÐ» Ðž ÑÐµ Ð±ÑÐŽÐµ Ð¿ÑÐµÐŒÐ°Ñ
+Ð²Ð°Ñ Ð² 3.0. ÐÐŒÐµÑÑÐŸ ÐœÐµÐ³ÐŸ ÐžÐ·Ð¿ÐŸÐ»Ð·Ð²Ð°Ð¹ÑÐµ ${newMethod}."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/de.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/de.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/de.js	(revision 76)
@@ -0,0 +1,81 @@
+/* Translators (2009 onwards):
+ *  - Grille chompa
+ *  - Nikiwaibel
+ *  - Umherirrender
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["de"]
+ * Dictionary for Deutsch.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["de"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Unbehandelte AnfragerÃŒckmeldung ${statusText}",
+
+    'permalink': "Permalink",
+
+    'overlays': "Overlays",
+
+    'baseLayer': "Grundkarte",
+
+    'sameProjection': "Die Ãbersichtskarte funktioniert nur, wenn sie dieselbe Projektion wie die Hauptkarte verwendet",
+
+    'readNotImplemented': "Lesen nicht implementiert.",
+
+    'writeNotImplemented': "Schreiben nicht implementiert.",
+
+    'noFID': "Ein Feature, fÃŒr das keine FID existiert, kann nicht aktualisiert werden.",
+
+    'errorLoadingGML': "Fehler beim Laden der GML-Datei ${url}",
+
+    'browserNotSupported': "Ihr Browser unterstÃŒtzt keine Vektordarstellung. Aktuell unterstÃŒtzte Renderer:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: Komponente muss vom Typ ${geomType} sein",
+
+    'getFeatureError': "getFeatureFromEvent wurde vom einem Layer ohne Renderer aufgerufen. Dies bedeutet normalerweise, dass ein Layer entfernt wurde, aber nicht Handler, die auf ihn verweisen.",
+
+    'minZoomLevelError': "Die \x3ccode\x3eminZoomLevel\x3c/code\x3e-Eigenschaft ist nur fÃŒr die Verwendung mit \x3ccode\x3eFixedZoomLevels\x3c/code\x3e-untergeordneten Layers vorgesehen. Das dieser \x3ctt\x3ewfs\x3c/tt\x3e-Layer die \x3ccode\x3eminZoomLevel\x3c/code\x3e-Eigenschaft ÃŒberprÃŒft ist ein Relikt der Vergangenheit. Wir kÃ¶nnen diese ÃberprÃŒfung nicht entfernen, ohne das OL basierende Applikationen nicht mehr funktionieren. Daher markieren wir es als veraltet - die \x3ccode\x3eminZoomLevel\x3c/code\x3e-ÃberprÃŒfung wird in Version 3.0 entfernt werden. Bitte verwenden Sie stattdessen die Min-/Max-LÃ¶sung, wie sie unter http://trac.openlayers.org/wiki/SettingZoomLevels beschrieben ist.",
+
+    'commitSuccess': "WFS-Transaktion: Erfolgreich ${response}",
+
+    'commitFailed': "WFS-Transaktion: Fehlgeschlagen ${response}",
+
+    'googleWarning': "Der Google-Layer konnte nicht korrekt geladen werden.\x3cbr\x3e\x3cbr\x3eUm diese Meldung nicht mehr zu erhalten, wÃ€hlen Sie einen anderen Hintergrundlayer aus dem LayerSwitcher in der rechten oberen Ecke.\x3cbr\x3e\x3cbr\x3eSehr wahrscheinlich tritt dieser Fehler auf, weil das Skript der Google-Maps-Bibliothek nicht eingebunden wurde oder keinen gÃŒltigen API-SchlÃŒssel fÃŒr Ihre URL enthÃ€lt.\x3cbr\x3e\x3cbr\x3eEntwickler: Besuche \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3edas Wiki\x3c/a\x3e fÃŒr Hilfe zum korrekten Einbinden des Google-Layers",
+
+    'getLayerWarning': "Der ${layerType}-Layer konnte nicht korrekt geladen werden.\x3cbr\x3e\x3cbr\x3eUm diese Meldung nicht mehr zu erhalten, wÃ€hlen Sie einen anderen Hintergrundlayer aus dem LayerSwitcher in der rechten oberen Ecke.\x3cbr\x3e\x3cbr\x3eSehr wahrscheinlich tritt dieser Fehler auf, weil das Skript der \'${layerLib}\'-Bibliothek nicht eingebunden wurde.\x3cbr\x3e\x3cbr\x3eEntwickler: Besuche \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3edas Wiki\x3c/a\x3e fÃŒr Hilfe zum korrekten Einbinden von Layern",
+
+    'scale': "MaÃstab = 1 : ${scaleDenom}",
+
+    'W': "W",
+
+    'E': "O",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Sie versuchen den Layer â${layerName}â zur Karte hinzuzufÃŒgen, er wurde aber bereits hinzugefÃŒgt",
+
+    'reprojectDeprecated': "Sie verwenden die âReprojectâ-Option des Layers ${layerName}. Diese Option ist veraltet: Sie wurde entwickelt um die Anzeige von Daten auf kommerziellen Basiskarten zu unterstÃŒtzen, aber diese Funktion sollte jetzt durch UnterstÃŒtzung der âSpherical Mercatorâ erreicht werden. Weitere Informationen sind unter http://trac.openlayers.org/wiki/SphericalMercator verfÃŒgbar.",
+
+    'methodDeprecated': "Die Methode ist veraltet und wird in 3.0 entfernt. Bitte verwende stattdessen ${newMethod}.",
+
+    'boundsAddError': "Beide Werte (x und y) mÃŒssen der add-Funktion ÃŒbergeben werden.",
+
+    'lonlatAddError': "Beide Werte (lon und lat) mÃŒssen der add-Funktion ÃŒbergeben werden.",
+
+    'pixelAddError': "Beide Werte (x und y) mÃŒssen der add-Funktion ÃŒbergeben werden.",
+
+    'unsupportedGeometryType': "Nicht unterstÃŒtzter Geometrie-Typ: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition fehlgeschlagen: Element mit Id ${elemId} mÃ¶glicherweise falsch platziert.",
+
+    'filterEvaluateNotImplemented': "âevaluateâ ist fÃŒr diesen Filter-Typ nicht implementiert."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ia.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ia.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ia.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - McDutchie
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ia"]
+ * Dictionary for Interlingua.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["ia"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "Le responsa a un requesta non esseva maneate: ${statusText}",
+
+    'permalink': "Permaligamine",
+
+    'overlays': "Superpositiones",
+
+    'baseLayer': "Strato de base",
+
+    'sameProjection': "Le mini-carta functiona solmente si illo es in le mesme projection que le carta principal",
+
+    'readNotImplemented': "Lectura non implementate.",
+
+    'writeNotImplemented': "Scriptura non implementate.",
+
+    'noFID': "Non pote actualisar un elemento sin FID.",
+
+    'errorLoadingGML': "Error al cargamento del file GML ${url}",
+
+    'browserNotSupported': "Tu navigator non supporta le rendition de vectores. Le renditores actualmente supportate es:\n${renderers}",
+
+    'componentShouldBe': "addFeatures: le componente debe esser del typo ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent ha essite appellate in un strato sin renditor. Isto significa generalmente que tu ha destruite un strato, ma lassava un gestor associate con illo.",
+
+    'minZoomLevelError': "Le proprietate minZoomLevel es solmente pro uso con le stratos descendente de FixedZoomLevels. Le facto que iste strato WFS verifica minZoomLevel es un reliquia del passato. Nonobstante, si nos lo remove immediatemente, nos pote rumper applicationes a base de OL que depende de illo. Ergo nos lo declara obsolete; le verification de minZoomLevel in basso essera removite in version 3.0. Per favor usa in su loco le configuration de resolutiones min/max como describite a: http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Transaction WFS: SUCCESSO ${response}",
+
+    'commitFailed': "Transaction WFS: FALLEVA ${response}",
+
+    'googleWarning': "Le strato Google non poteva esser cargate correctemente.\x3cbr\x3e\x3cbr\x3ePro disfacer te de iste message, selige un nove BaseLayer in le selector de strato in alto a dextra.\x3cbr\x3e\x3cbr\x3eMulto probabilemente, isto es proque le script del libreria de Google Maps non esseva includite o non contine le clave API correcte pro tu sito.\x3cbr\x3e\x3cbr\x3eDisveloppatores: Pro adjuta de corriger isto, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclicca hic\x3c/a",
+
+    'getLayerWarning': "Le strato ${layerType} non poteva esser cargate correctemente.\x3cbr\x3e\x3cbr\x3ePro disfacer te de iste message, selige un nove BaseLayer in le selector de strato in alto a dextra.\x3cbr\x3e\x3cbr\x3eMulto probabilemente, isto es proque le script del libreria de ${layerLib} non esseva correctemente includite.\x3cbr\x3e\x3cbr\x3eDisveloppatores: Pro adjuta de corriger isto, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclicca hic\x3c/a\x3e",
+
+    'scale': "Scala = 1 : ${scaleDenom}",
+
+    'W': "W",
+
+    'E': "E",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "Tu tentava adder le strato: ${layerName} al carta, ma illo es ja presente",
+
+    'reprojectDeprecated': "Tu usa le option \'reproject\' in le strato ${layerName} layer. Iste option es obsolescente: illo esseva pro poter monstrar datos super cartas de base commercial, ma iste functionalitate pote ora esser attingite con le uso de Spherical Mercator. Ulterior information es disponibile a http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Iste methodo ha essite declarate obsolescente e essera removite in version 3.0. Per favor usa ${newMethod} in su loco.",
+
+    'boundsAddError': "Tu debe passar le duo valores x e y al function add.",
+
+    'lonlatAddError': "Tu debe passar le duo valores lon e lat al function add.",
+
+    'pixelAddError': "Tu debe passar le duo valores x e y al function add.",
+
+    'unsupportedGeometryType': "Typo de geometria non supportate: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition falleva: le elemento con id ${elemId} pote esser mal placiate.",
+
+    'filterEvaluateNotImplemented': "\"evaluate\" non es implementate pro iste typo de filtro."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ja.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ja.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/ja.js	(revision 76)
@@ -0,0 +1,92 @@
+/* Translators (2009 onwards):
+ *  - Fryed-peach
+ *  - Mage Whopper
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["ja"]
+ * Dictionary for æ¥æ¬èª.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["ja"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "æªåŠçã®èŠæ±ã¯ ${statusText} ãè¿ããŸã",
+
+    'permalink': "ããŒããªã³ã¯",
+
+    'overlays': "ãªãŒããŒã¬ã€",
+
+    'baseLayer': "åºåºã¬ã€ã€ãŒ",
+
+    'sameProjection': "æŠèŠ³å°å³ã¯ã¡ã€ã³ã®å°å³ãšåãæåœ±æ³ããšãå Žåã®ã¿æ©èœããŸã",
+
+    'readNotImplemented': "èª­ã¿èŸŒã¿ã¯å®è£
+ãããŠããŸããã",
+
+    'writeNotImplemented': "æžãèŸŒã¿ã¯å®è£
+ãããŠããŸããã",
+
+    'noFID': "FID ã®ãªãå°ç©ã¯æŽæ°ã§ããŸããã",
+
+    'errorLoadingGML': "GML ãã¡ã€ã« ${url} ã®èª­ã¿èŸŒã¿ãšã©ãŒ",
+
+    'browserNotSupported': "ããªãã®ãã©ãŠã¶ã¯ãã¯ã¿ãŒã°ã©ãã£ãã¯ã¹ã®æåã«å¯Ÿå¿ããŠããŸãããçŸæç¹ã§å¯Ÿå¿ããŠãããœãããŠã§ã¢ã¯ä»¥äžã®ãã®ã§ãã\n${renderers}",
+
+    'componentShouldBe': "addFeatures: èŠçŽ ã¯ ${geomType} ã§ããã¹ãã§ã",
+
+    'getFeatureError': "getFeatureFromEvent ãã¬ã³ãã©ãŒã®ãªãã¬ã€ã€ãŒããåŒã°ããŸãããéåžžãããã¯ããªããã¬ã€ã€ãŒããããã«é¢é£ã¥ããããããã€ãã®ãã³ãã©ãé€ããŠãç Žå£ããŠããŸã£ãããšãæå³ããŸãã",
+
+    'minZoomLevelError': "minZoomLevel ãã­ããã£ã¯ FixedZoomLevels ãç¶æ¿ããã¬ã€ã€ãŒã§ã®äœ¿çšã®ã¿ãæ³å®ããŠããŸãããã® minZoomLevel ã«å¯Ÿãã WFS ã¬ã€ã€ãŒã®æ€æ»ã¯æ­Žå²çãªãã®ã§ããããããªããããã®æ€æ»ãé€å»ãããšããã«äŸå­ãã OpenLayers ããŒã¹ã®ã¢ããªã±ãŒã·ã§ã³ãç Žå£ããŠããŸãå¯èœæ§ããããŸãããã£ãŠå»æ­¢ãäºå®ãããŠããããã® minZoomLevel æ€æ»ã¯ããŒãžã§ã³3.0ã§é€å»ãããŸããä»£ããã«ãhttp://trac.openlayers.org/wiki/SettingZoomLevels ã§è§£èª¬ãããŠãããæå°ããã³æå€§è§£ååºŠèš­å®ãäœ¿çšããŠãã ããã",
+
+    'commitSuccess': "WFS ãã©ã³ã¶ã¯ã·ã§ã³: æå ${response}",
+
+    'commitFailed': "WFS ãã©ã³ã¶ã¯ã·ã§ã³: å€±æ ${response}",
+
+    'googleWarning': "Google ã¬ã€ã€ãŒãæ­£ããèª­ã¿èŸŒã¿ãè¡ããŸããã§ããã\x3cbr\x3e\x3cbr\x3eãã®ã¡ãã»ãŒãžãæ¶ãã«ã¯ãå³äžã®é
+ã«ããã¬ã€ã€ãŒåãæ¿ãéšåã§æ°ããåºåºã¬ã€ã€ãŒãéžãã§ãã ããã\x3cbr\x3e\x3cbr\x3eãããããããã¯ Google ãããçšã©ã€ãã©ãªã®ã¹ã¯ãªãããçµã¿èŸŒãŸããŠããªãããããªãã®ãµã€ãã«å¯Ÿå¿ããæ­£ãã API ã­ãŒãèš­å®ãããŠããªãããã§ãã\x3cbr\x3e\x3cbr\x3eéçºè
+ã®æ¹ãž: æ­£ããåäœããããããã«\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eãã¡ãã®ãŠã£ã­\x3c/a\x3eãåç
+§ããŠãã ããã",
+
+    'getLayerWarning': "${layerType} ã¬ã€ã€ãŒãæ­£ããèª­ã¿èŸŒã¿ãè¡ããŸããã§ããã\x3cbr\x3e\x3cbr\x3eãã®ã¡ãã»ãŒãžãæ¶ãã«ã¯ãå³äžã®é
+ã«ããã¬ã€ã€ãŒåãæ¿ãéšåã§æ°ããåºåºã¬ã€ã€ãŒãéžãã§ãã ããã\x3cbr\x3e\x3cbr\x3eãããããããã¯ ${layerLib} ã©ã€ãã©ãªã®ã¹ã¯ãªãããæ­£ããçµã¿èŸŒãŸããŠããªãããã§ãã\x3cbr\x3e\x3cbr\x3eéçºè
+ã®æ¹ãž: æ­£ããåäœããããããã«\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eãã¡ãã®ãŠã£ã­\x3c/a\x3eãåç
+§ããŠãã ããã",
+
+    'scale': "çž®å°º = 1 : ${scaleDenom}",
+
+    'W': "è¥¿",
+
+    'E': "æ±",
+
+    'N': "å",
+
+    'S': "å",
+
+    'layerAlreadyAdded': "ããªãã¯ã${layerName}ããå°å³ã«è¿œå ããããšè©Šã¿ãŸãããããã®ã¬ã€ã€ãŒã¯æ¢ã«è¿œå ãããŠããŸã",
+
+    'reprojectDeprecated': "ããªãã¯ã${layerName}ãã¬ã€ã€ãŒã§ reproject ãªãã·ã§ã³ãäœ¿ã£ãŠããŸãããã®ãªãã·ã§ã³ã¯åçšã®åºåºå°å³äžã«æ
+å ±ãè¡šç€ºããç®çã§èš­èšãããŸããããçŸåšã§ã¯ãã®æ©èœã¯ Spherical Mercator ãµããŒããå©çšããŠå®çŸãããŠããããã®ãªãã·ã§ã³ã®äœ¿çšã¯éæšå¥šã§ããè¿œå ã®æ
+å ±ã¯ http://trac.openlayers.org/wiki/SphericalMercator ã§å
+¥æã§ããŸãã",
+
+    'methodDeprecated': "ãã®ã¡ãœããã¯å»æ­¢ãäºå®ãããŠãããããŒãžã§ã³3.0ã§é€å»ãããŸããä»£ããã« ${newMethod} ãäœ¿çšããŠãã ããã",
+
+    'boundsAddError': "x ãš y äž¡æ¹ã®å€ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",
+
+    'lonlatAddError': "lon ãš lat äž¡æ¹ã®å€ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",
+
+    'pixelAddError': "x ãš y ã®å€äž¡æ¹ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",
+
+    'unsupportedGeometryType': "æªå¯Ÿå¿ã®åœ¢ç¶å: ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition ãå€±æããŸãã: id ${elemId} ããã€èŠçŽ ãèª€ã£ãäœçœ®ã«ããå¯èœæ§ããããŸãã",
+
+    'filterEvaluateNotImplemented': "ãã®ãã£ã«ã¿ãŒåã«ã€ããŠ evaluate ã¯å®è£
+ãããŠããŸããã"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fi.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fi.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/fi.js	(revision 76)
@@ -0,0 +1,34 @@
+/* Translators (2009 onwards):
+ *  - Nike
+ *  - Str4nd
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["fi"]
+ * Dictionary for Suomi.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["fi"] = OpenLayers.Util.applyDefaults({
+
+    'permalink': "Ikilinkki",
+
+    'overlays': "Kerrokset",
+
+    'baseLayer': "Peruskerros",
+
+    'sameProjection': "Yleiskuvakarttaa voi kÃ€yttÃ€Ã€ vain, kun sillÃ€ on sama projektio kuin pÃ€Ã€kartalla.",
+
+    'W': "L",
+
+    'E': "I",
+
+    'N': "P",
+
+    'S': "E"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/oc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/oc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang/oc.js	(revision 76)
@@ -0,0 +1,79 @@
+/* Translators (2009 onwards):
+ *  - Cedric31
+ */
+
+/**
+ * @requires OpenLayers/Lang.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang["oc"]
+ * Dictionary for Occitan.  Keys for entries are used in calls to
+ *     <OpenLayers.Lang.translate>.  Entry bodies are normal strings or
+ *     strings formatted for use with <OpenLayers.String.format> calls.
+ */
+OpenLayers.Lang["oc"] = OpenLayers.Util.applyDefaults({
+
+    'unhandledRequest': "RequÃšsta pas gerida, retorna ${statusText}",
+
+    'permalink': "Permaligam",
+
+    'overlays': "Calques",
+
+    'baseLayer': "Calc de basa",
+
+    'sameProjection': "La carta de situacion fonciona pas que quora sa projeccion es la meteissa que la de la carta principala",
+
+    'readNotImplemented': "Lectura pas implementada.",
+
+    'writeNotImplemented': "Escritura pas implementada.",
+
+    'noFID': "Impossible de metre a jorn un objÃšcte sens identificant (fid).",
+
+    'errorLoadingGML': "Error al cargament del fichiÃšr GML ${url}",
+
+    'browserNotSupported': "VÃ²stre navegidor supÃ²rta pas lo rendut vectorial. Los renderers actualament suportats son : \n${renderers}",
+
+    'componentShouldBe': "addFeatures : lo compausant deuriÃ¡ Ãšsser de tipe ${geomType}",
+
+    'getFeatureError': "getFeatureFromEvent es estat apelat sus un calc sens renderer. AquÃ² significa generalament qu\'avÃštz destruch aqueste jaÃ§, mas qu\'avÃštz conservat un handler que li Ãšra associat.",
+
+    'minZoomLevelError': "La proprietat minZoomLevel deu Ãšsser utilizada solament per de jaces FixedZoomLevels-descendent. Lo fach qu\'aqueste jaÃ§ WFS verifique la presÃ©ncia de minZoomLevel es una relica del passat. ÃaquelÃ , la podÃšm suprimir sens copar d\'aplicacions que ne poiriÃ¡n dependre. Es per aquÃ² que la depreciam -- la verificacion del minZoomLevel serÃ  suprimida en version 3.0. A la plaÃ§a, mercÃ©s d\'utilizar los paramÃštres de resolucions min/max tal coma descrich sus : http://trac.openlayers.org/wiki/SettingZoomLevels",
+
+    'commitSuccess': "Transaccion WFS : SUCCES ${response}",
+
+    'commitFailed': "Transaccion WFS : FRACAS ${response}",
+
+    'googleWarning': "Lo jaÃ§ Google es pas estat en mesura de se cargar corrÃšctament.\x3cbr\x3e\x3cbr\x3ePer suprimir aqueste messatge, causissÃštz una BaseLayer novÃšla dins lo selector de jaÃ§ en naut a drecha.\x3cbr\x3e\x3cbr\x3eAquÃ² es possiblament causat par la non-inclusion de la librariÃ¡ Google Maps, o alara perque que la clau de l\'API correspond pas a vÃ²stre site.\x3cbr\x3e\x3cbr\x3eDesvolopaires : per saber cossÃ­ corregir aquÃ², \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclicatz aicÃ­\x3c/a\x3e",
+
+    'getLayerWarning': "Lo jaÃ§ ${layerType} es pas en mesura de se cargar corrÃšctament.\x3cbr\x3e\x3cbr\x3ePer suprimir aqueste messatge, causissÃštz una  BaseLayer novÃšla dins lo selector de jaÃ§ en naut a drecha.\x3cbr\x3e\x3cbr\x3eAquÃ² es possiblament causat per la non-inclusion de la librariÃ¡ ${layerLib}.\x3cbr\x3e\x3cbr\x3eDesvolopaires : per saber cossÃ­ corregir aquÃ­, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclicatz aicÃ­\x3c/a\x3e",
+
+    'scale': "Escala ~ 1 : ${scaleDenom}",
+
+    'W': "O",
+
+    'E': "Ã",
+
+    'N': "N",
+
+    'S': "S",
+
+    'layerAlreadyAdded': "AvÃštz ensajat d\'apondre a la carta lo calc : ${layerName}, mas ja es present",
+
+    'reprojectDeprecated': "Utilizatz l\'opcion \'reproject\' sul jaÃ§ ${layerName}. Aquesta opcion es despreciada : Son usatge permetiÃ¡ d\'afichar de donadas al dessÃºs de jaces raster comercials. Aquesta foncionalitat ara es suportada en utilizant lo supÃ²rt de la projeccion Mercator Esferica. Mai d\'informacion es disponibla sus http://trac.openlayers.org/wiki/SphericalMercator.",
+
+    'methodDeprecated': "Aqueste metÃ²de es despreciada, e serÃ  suprimida a la version 3.0. MercÃ©s d\'utilizar ${newMethod} a la plaÃ§a.",
+
+    'boundsAddError': "Vos cal passar las doas valors x e y a la foncion add.",
+
+    'lonlatAddError': "Vos cal passar las doas valors lon e lat a la foncion add.",
+
+    'pixelAddError': "Vos cal passar las doas valors x e y a la foncion add.",
+
+    'unsupportedGeometryType': "Tipe de geometria pas suportat : ${geomType}",
+
+    'pagePositionFailed': "OpenLayers.Util.pagePosition a fracassat : l\'element d\'id ${elemId} poiriÃ¡ Ãšsser mal posicionat.",
+
+    'filterEvaluateNotImplemented': "evaluar es pas encara estat implementat per aqueste tipe de filtre."
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/FeatureId.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/FeatureId.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/FeatureId.js	(revision 76)
@@ -0,0 +1,81 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Filter.js
+ */
+
+/**
+ * Class: OpenLayers.Filter.FeatureId
+ * This class represents a ogc:FeatureId Filter, as being used for rule-based SLD
+ * styling
+ * 
+ * Inherits from
+ * - <OpenLayers.Filter>
+ */
+OpenLayers.Filter.FeatureId = OpenLayers.Class(OpenLayers.Filter, {
+
+    /** 
+     * APIProperty: fids
+     * {Array(String)} Feature Ids to evaluate this rule against. To be passed
+     * To be passed inside the params object.
+     */
+    fids: null,
+    
+    /** 
+     * Constructor: OpenLayers.Filter.FeatureId
+     * Creates an ogc:FeatureId rule.
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *           rule
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.FeatureId>}
+     */
+    initialize: function(options) {
+        this.fids = [];
+        OpenLayers.Filter.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: evaluate
+     * evaluates this rule for a specific feature
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature>} feature to apply the rule to.
+     *           For vector features, the check is run against the fid,
+     *           for plain features against the id.
+     * 
+     * Returns:
+     * {Boolean} true if the rule applies, false if it does not
+     */
+    evaluate: function(feature) {
+        for (var i=0, len=this.fids.length; i<len; i++) {
+            var fid = feature.fid || feature.id;
+            if (fid == this.fids[i]) {
+                return true;
+            }
+        }
+        return false;
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.FeatureId>} Clone of this filter.
+     */
+    clone: function() {
+        var filter = new OpenLayers.Filter.FeatureId();
+        OpenLayers.Util.extend(filter, this);
+        filter.fids = this.fids.slice();
+        return filter;
+    },
+    
+    CLASS_NAME: "OpenLayers.Filter.FeatureId"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Comparison.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Comparison.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Comparison.js	(revision 76)
@@ -0,0 +1,258 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Filter.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Filter.Comparison
+ * This class represents a comparison filter.
+ * 
+ * Inherits from
+ * - <OpenLayers.Filter>
+ */
+OpenLayers.Filter.Comparison = OpenLayers.Class(OpenLayers.Filter, {
+
+    /**
+     * APIProperty: type
+     * {String} type: type of the comparison. This is one of
+     * - OpenLayers.Filter.Comparison.EQUAL_TO                 = "==";
+     * - OpenLayers.Filter.Comparison.NOT_EQUAL_TO             = "!=";
+     * - OpenLayers.Filter.Comparison.LESS_THAN                = "<";
+     * - OpenLayers.Filter.Comparison.GREATER_THAN             = ">";
+     * - OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO    = "<=";
+     * - OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO = ">=";
+     * - OpenLayers.Filter.Comparison.BETWEEN                  = "..";
+     * - OpenLayers.Filter.Comparison.LIKE                     = "~"; 
+     */
+    type: null,
+    
+    /**
+     * APIProperty: property
+     * {String}
+     * name of the context property to compare
+     */
+    property: null,
+    
+    /**
+     * APIProperty: value
+     * {Number} or {String}
+     * comparison value for binary comparisons. In the case of a String, this
+     * can be a combination of text and propertyNames in the form
+     * "literal ${propertyName}"
+     */
+    value: null,
+    
+    /**
+     * Property: matchCase
+     * {Boolean} Force case sensitive searches for EQUAL_TO and NOT_EQUAL_TO
+     *     comparisons.  The Filter Encoding 1.1 specification added a matchCase
+     *     attribute to ogc:PropertyIsEqualTo and ogc:PropertyIsNotEqualTo
+     *     elements.  This property will be serialized with those elements only
+     *     if using the v1.1.0 filter format. However, when evaluating filters
+     *     here, the matchCase property will always be respected (for EQUAL_TO
+     *     and NOT_EQUAL_TO).  Default is true.
+     */
+    matchCase: true,
+    
+    /**
+     * APIProperty: lowerBoundary
+     * {Number} or {String}
+     * lower boundary for between comparisons. In the case of a String, this
+     * can be a combination of text and propertyNames in the form
+     * "literal ${propertyName}"
+     */
+    lowerBoundary: null,
+    
+    /**
+     * APIProperty: upperBoundary
+     * {Number} or {String}
+     * upper boundary for between comparisons. In the case of a String, this
+     * can be a combination of text and propertyNames in the form
+     * "literal ${propertyName}"
+     */
+    upperBoundary: null,
+
+    /** 
+     * Constructor: OpenLayers.Filter.Comparison
+     * Creates a comparison rule.
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *           rule
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Comparison>}
+     */
+    initialize: function(options) {
+        OpenLayers.Filter.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: evaluate
+     * Evaluates this filter in a specific context.
+     * 
+     * Parameters:
+     * context - {Object} Context to use in evaluating the filter.  If a vector
+     *     feature is provided, the feature.attributes will be used as context.
+     * 
+     * Returns:
+     * {Boolean} The filter applies.
+     */
+    evaluate: function(context) {
+        if (context instanceof OpenLayers.Feature.Vector) {
+            context = context.attributes;
+        }
+        var result = false;
+        var got = context[this.property];
+        switch(this.type) {
+            case OpenLayers.Filter.Comparison.EQUAL_TO:
+                var exp = this.value;
+                if(!this.matchCase &&
+                   typeof got == "string" && typeof exp == "string") {
+                    result = (got.toUpperCase() == exp.toUpperCase());
+                } else {
+                    result = (got == exp);
+                }
+                break;
+            case OpenLayers.Filter.Comparison.NOT_EQUAL_TO:
+                var exp = this.value;
+                if(!this.matchCase &&
+                   typeof got == "string" && typeof exp == "string") {
+                    result = (got.toUpperCase() != exp.toUpperCase());
+                } else {
+                    result = (got != exp);
+                }
+                break;
+            case OpenLayers.Filter.Comparison.LESS_THAN:
+                result = got < this.value;
+                break;
+            case OpenLayers.Filter.Comparison.GREATER_THAN:
+                result = got > this.value;
+                break;
+            case OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO:
+                result = got <= this.value;
+                break;
+            case OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO:
+                result = got >= this.value;
+                break;
+            case OpenLayers.Filter.Comparison.BETWEEN:
+                result = (got >= this.lowerBoundary) &&
+                    (got <= this.upperBoundary);
+                break;
+            case OpenLayers.Filter.Comparison.LIKE:
+                var regexp = new RegExp(this.value, "gi");
+                result = regexp.test(got);
+                break;
+        }
+        return result;
+    },
+    
+    /**
+     * APIMethod: value2regex
+     * Converts the value of this rule into a regular expression string,
+     * according to the wildcard characters specified. This method has to
+     * be called after instantiation of this class, if the value is not a
+     * regular expression already.
+     * 
+     * Parameters:
+     * wildCard   - {<Char>} wildcard character in the above value, default
+     *              is "*"
+     * singleChar - {<Char>) single-character wildcard in the above value
+     *              default is "."
+     * escape     - {<Char>) escape character in the above value, default is
+     *              "!"
+     * 
+     * Returns:
+     * {String} regular expression string
+     */
+    value2regex: function(wildCard, singleChar, escapeChar) {
+        if (wildCard == ".") {
+            var msg = "'.' is an unsupported wildCard character for "+
+                    "OpenLayers.Filter.Comparison";
+            OpenLayers.Console.error(msg);
+            return null;
+        }
+        
+
+        // set UMN MapServer defaults for unspecified parameters
+        wildCard = wildCard ? wildCard : "*";
+        singleChar = singleChar ? singleChar : ".";
+        escapeChar = escapeChar ? escapeChar : "!";
+        
+        this.value = this.value.replace(
+                new RegExp("\\"+escapeChar+"(.|$)", "g"), "\\$1");
+        this.value = this.value.replace(
+                new RegExp("\\"+singleChar, "g"), ".");
+        this.value = this.value.replace(
+                new RegExp("\\"+wildCard, "g"), ".*");
+        this.value = this.value.replace(
+                new RegExp("\\\\.\\*", "g"), "\\"+wildCard);
+        this.value = this.value.replace(
+                new RegExp("\\\\\\.", "g"), "\\"+singleChar);
+        
+        return this.value;
+    },
+    
+    /**
+     * Method: regex2value
+     * Convert the value of this rule from a regular expression string into an
+     *     ogc literal string using a wildCard of *, a singleChar of ., and an
+     *     escape of !.  Leaves the <value> property unmodified.
+     * 
+     * Returns:
+     * {String} A string value.
+     */
+    regex2value: function() {
+        
+        var value = this.value;
+        
+        // replace ! with !!
+        value = value.replace(/!/g, "!!");
+
+        // replace \. with !. (watching out for \\.)
+        value = value.replace(/(\\)?\\\./g, function($0, $1) {
+            return $1 ? $0 : "!.";
+        });
+        
+        // replace \* with #* (watching out for \\*)
+        value = value.replace(/(\\)?\\\*/g, function($0, $1) {
+            return $1 ? $0 : "!*";
+        });
+        
+        // replace \\ with \
+        value = value.replace(/\\\\/g, "\\");
+
+        // convert .* to * (the sequence #.* is not allowed)
+        value = value.replace(/\.\*/g, "*");
+        
+        return value;
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Comparison>} Clone of this filter.
+     */
+    clone: function() {
+        return OpenLayers.Util.extend(new OpenLayers.Filter.Comparison(), this);
+    },
+    
+    CLASS_NAME: "OpenLayers.Filter.Comparison"
+});
+
+
+OpenLayers.Filter.Comparison.EQUAL_TO                 = "==";
+OpenLayers.Filter.Comparison.NOT_EQUAL_TO             = "!=";
+OpenLayers.Filter.Comparison.LESS_THAN                = "<";
+OpenLayers.Filter.Comparison.GREATER_THAN             = ">";
+OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO    = "<=";
+OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO = ">=";
+OpenLayers.Filter.Comparison.BETWEEN                  = "..";
+OpenLayers.Filter.Comparison.LIKE                     = "~";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Logical.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Logical.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Logical.js	(revision 76)
@@ -0,0 +1,119 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Filter.js
+ */
+
+/**
+ * Class: OpenLayers.Filter.Logical
+ * This class represents ogc:And, ogc:Or and ogc:Not rules.
+ * 
+ * Inherits from
+ * - <OpenLayers.Filter>
+ */
+OpenLayers.Filter.Logical = OpenLayers.Class(OpenLayers.Filter, {
+
+    /**
+     * APIProperty: filters
+     * {Array(<OpenLayers.Filter>)} Child filters for this filter.
+     */
+    filters: null, 
+     
+    /**
+     * APIProperty: type
+     * {String} type of logical operator. Available types are:
+     * - OpenLayers.Filter.Logical.AND = "&&";
+     * - OpenLayers.Filter.Logical.OR  = "||";
+     * - OpenLayers.Filter.Logical.NOT = "!";
+     */
+    type: null,
+
+    /** 
+     * Constructor: OpenLayers.Filter.Logical
+     * Creates a logical filter (And, Or, Not).
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *     filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Logical>}
+     */
+    initialize: function(options) {
+        this.filters = [];
+        OpenLayers.Filter.prototype.initialize.apply(this, [options]);
+    },
+    
+    /** 
+     * APIMethod: destroy
+     * Remove reference to child filters.
+     */
+    destroy: function() {
+        this.filters = null;
+        OpenLayers.Filter.prototype.destroy.apply(this);
+    },
+
+    /**
+     * APIMethod: evaluate
+     * Evaluates this filter in a specific context.
+     * 
+     * Parameters:
+     * context - {Object} Context to use in evaluating the filter.  A vector
+     *     feature may also be provided to evaluate feature attributes in 
+     *     comparison filters or geometries in spatial filters.
+     * 
+     * Returns:
+     * {Boolean} The filter applies.
+     */
+    evaluate: function(context) {
+        switch(this.type) {
+            case OpenLayers.Filter.Logical.AND:
+                for (var i=0, len=this.filters.length; i<len; i++) {
+                    if (this.filters[i].evaluate(context) == false) {
+                        return false;
+                    }
+                }
+                return true;
+                
+            case OpenLayers.Filter.Logical.OR:
+                for (var i=0, len=this.filters.length; i<len; i++) {
+                    if (this.filters[i].evaluate(context) == true) {
+                        return true;
+                    }
+                }
+                return false;
+            
+            case OpenLayers.Filter.Logical.NOT:
+                return (!this.filters[0].evaluate(context));
+        }
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Logical>} Clone of this filter.
+     */
+    clone: function() {
+        var filters = [];        
+        for(var i=0, len=this.filters.length; i<len; ++i) {
+            filters.push(this.filters[i].clone());
+        }
+        return new OpenLayers.Filter.Logical({
+            type: this.type,
+            filters: filters
+        });
+    },
+    
+    CLASS_NAME: "OpenLayers.Filter.Logical"
+});
+
+
+OpenLayers.Filter.Logical.AND = "&&";
+OpenLayers.Filter.Logical.OR  = "||";
+OpenLayers.Filter.Logical.NOT = "!";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Spatial.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Spatial.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter/Spatial.js	(revision 76)
@@ -0,0 +1,128 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Filter.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Filter.Spatial
+ * This class represents a spatial filter.
+ * Currently implemented: BBOX, DWithin and Intersects
+ * 
+ * Inherits from
+ * - <OpenLayers.Filter>
+ */
+OpenLayers.Filter.Spatial = OpenLayers.Class(OpenLayers.Filter, {
+
+    /**
+     * APIProperty: type
+     * {String} Type of spatial filter.
+     *
+     * The type should be one of:
+     * - OpenLayers.Filter.Spatial.BBOX
+     * - OpenLayers.Filter.Spatial.INTERSECTS
+     * - OpenLayers.Filter.Spatial.DWITHIN
+     * - OpenLayers.Filter.Spatial.WITHIN
+     * - OpenLayers.Filter.Spatial.CONTAINS
+     */
+    type: null,
+    
+    /**
+     * APIProperty: property
+     * {String} Name of the context property to compare.
+     */
+    property: null,
+    
+    /**
+     * APIProperty: value
+     * {<OpenLayers.Bounds> || <OpenLayers.Geometry>} The bounds or geometry
+     *     to be used by the filter.  Use bounds for BBOX filters and geometry
+     *     for INTERSECTS or DWITHIN filters.
+     */
+    value: null,
+
+    /**
+     * APIProperty: distance
+     * {Number} The distance to use in a DWithin spatial filter.
+     */
+    distance: null,
+
+    /**
+     * APIProperty: distanceUnits
+     * {String} The units to use for the distance, e.g. 'm'.
+     */
+    distanceUnits: null,
+    
+    /** 
+     * Constructor: OpenLayers.Filter.Spatial
+     * Creates a spatial filter.
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *     filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Spatial>}
+     */
+    initialize: function(options) {
+        OpenLayers.Filter.prototype.initialize.apply(this, [options]);
+    },
+
+   /**
+    * Method: evaluate
+    * Evaluates this filter for a specific feature.
+    * 
+    * Parameters:
+    * feature - {<OpenLayers.Feature.Vector>} feature to apply the filter to.
+    * 
+    * Returns:
+    * {Boolean} The feature meets filter criteria.
+    */
+    evaluate: function(feature) {
+        var intersect = false;
+        switch(this.type) {
+            case OpenLayers.Filter.Spatial.BBOX:
+            case OpenLayers.Filter.Spatial.INTERSECTS:
+                if(feature.geometry) {
+                    var geom = this.value;
+                    if(this.value.CLASS_NAME == "OpenLayers.Bounds") {
+                        geom = this.value.toGeometry();
+                    }
+                    if(feature.geometry.intersects(geom)) {
+                        intersect = true;
+                    }
+                }
+                break;
+            default:
+                OpenLayers.Console.error(
+                    OpenLayers.i18n("filterEvaluateNotImplemented"));
+                break;
+        }
+        return intersect;
+    },
+
+    /**
+     * APIMethod: clone
+     * Clones this filter.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter.Spatial>} Clone of this filter.
+     */
+    clone: function() {
+        var options = OpenLayers.Util.applyDefaults({
+            value: this.value && this.value.clone && this.value.clone()
+        }, this);
+        return new OpenLayers.Filter.Spatial(options);
+    },
+    CLASS_NAME: "OpenLayers.Filter.Spatial"
+});
+
+OpenLayers.Filter.Spatial.BBOX = "BBOX";
+OpenLayers.Filter.Spatial.INTERSECTS = "INTERSECTS";
+OpenLayers.Filter.Spatial.DWITHIN = "DWITHIN";
+OpenLayers.Filter.Spatial.WITHIN = "WITHIN";
+OpenLayers.Filter.Spatial.CONTAINS = "CONTAINS";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Map.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Map.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Map.js	(revision 76)
@@ -0,0 +1,2417 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Events.js
+ * @requires OpenLayers/Tween.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Map
+ * Instances of OpenLayers.Map are interactive maps embedded in a web page.
+ * Create a new map with the <OpenLayers.Map> constructor.
+ * 
+ * On their own maps do not provide much functionality.  To extend a map
+ * it's necessary to add controls (<OpenLayers.Control>) and 
+ * layers (<OpenLayers.Layer>) to the map. 
+ */
+OpenLayers.Map = OpenLayers.Class({
+    
+    /**
+     * Constant: Z_INDEX_BASE
+     * {Object} Base z-indexes for different classes of thing 
+     */
+    Z_INDEX_BASE: {
+        BaseLayer: 100,
+        Overlay: 325,
+        Feature: 725,
+        Popup: 750,
+        Control: 1000
+    },
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * map.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * All event objects have at least the following properties:
+     *  - *object* {Object} A reference to map.events.object.
+     *  - *element* {DOMElement} A reference to map.events.element.
+     *
+     * Browser events have the following additional properties:
+     *  - *xy* {<OpenLayers.Pixel>} The pixel location of the event (relative
+     *      to the the map viewport).
+     *  - other properties that come with browser events
+     *
+     * Supported map event types:
+     *  - *preaddlayer* triggered before a layer has been added.  The event
+     *      object will include a *layer* property that references the layer  
+     *      to be added.
+     *  - *addlayer* triggered after a layer has been added.  The event object
+     *      will include a *layer* property that references the added layer.
+     *  - *removelayer* triggered after a layer has been removed.  The event
+     *      object will include a *layer* property that references the removed
+     *      layer.
+     *  - *changelayer* triggered after a layer name change, order change,
+     *      opacity change, params change or visibility change
+     *      (due to resolution thresholds). Listeners will receive an event
+     *      object with *layer* and *property* properties. The *layer*
+     *      property will be a reference to the changed layer. 
+     *      The *property* property will be a key to the
+     *      changed property (name, order, opacity, params or visibility).
+     *  - *movestart* triggered after the start of a drag, pan, or zoom
+     *  - *move* triggered after each drag, pan, or zoom
+     *  - *moveend* triggered after a drag, pan, or zoom completes
+     *  - *zoomend* triggered after a zoom completes
+     *  - *mouseover* triggered after mouseover the map
+     *  - *mouseout* triggered after mouseout the map
+     *  - *mousemove* triggered after mousemove the map
+     *  - *changebaselayer* triggered after the base layer changes
+     */
+    EVENT_TYPES: [ 
+        "preaddlayer", "addlayer", "removelayer", "changelayer", "movestart",
+        "move", "moveend", "zoomend", "popupopen", "popupclose",
+        "addmarker", "removemarker", "clearmarkers", "mouseover",
+        "mouseout", "mousemove", "dragstart", "drag", "dragend",
+        "changebaselayer"],
+
+    /**
+     * Property: id
+     * {String} Unique identifier for the map
+     */
+    id: null,
+    
+    /**
+     * Property: fractionalZoom
+     * {Boolean} For a base layer that supports it, allow the map resolution
+     *     to be set to a value between one of the values in the resolutions
+     *     array.  Default is false.
+     *
+     * When fractionalZoom is set to true, it is possible to zoom to
+     *     an arbitrary extent.  This requires a base layer from a source
+     *     that supports requests for arbitrary extents (i.e. not cached
+     *     tiles on a regular lattice).  This means that fractionalZoom
+     *     will not work with commercial layers (Google, Yahoo, VE), layers
+     *     using TileCache, or any other pre-cached data sources.
+     *
+     * If you are using fractionalZoom, then you should also use
+     *     <getResolutionForZoom> instead of layer.resolutions[zoom] as the
+     *     former works for non-integer zoom levels.
+     */
+    fractionalZoom: false,
+    
+    /**
+     * APIProperty: events
+     * {<OpenLayers.Events>} An events object that handles all 
+     *                       events on the map
+     */
+    events: null,
+    
+    /**
+     * APIProperty: allOverlays
+     * {Boolean} Allow the map to function with "overlays" only.  Defaults to
+     *     false.  If true, the lowest layer in the draw order will act as
+     *     the base layer.  In addition, if set to true, all layers will
+     *     have isBaseLayer set to false when they are added to the map.
+     *
+     * Note:
+     * If you set map.allOverlays to true, then you *cannot* use
+     *     map.setBaseLayer or layer.setIsBaseLayer.  With allOverlays true,
+     *     the lowest layer in the draw layer is the base layer.  So, to change
+     *     the base layer, use <setLayerIndex> or <raiseLayer> to set the layer
+     *     index to 0.
+     */
+    allOverlays: false,
+
+    /**
+     * APIProperty: div
+     * {DOMElement|String} The element that contains the map (or an id for
+     *     that element).  If the <OpenLayers.Map> constructor is called
+     *     with two arguments, this should be provided as the first argument.
+     *     Alternatively, the map constructor can be called with the options
+     *     object as the only argument.  In this case (one argument), a
+     *     div property may or may not be provided.  If the div property
+     *     is not provided, the map can be rendered to a container later
+     *     using the <render> method.
+     *     
+     * Note:
+     * If you are calling <render> after map construction, do not use
+     *     <maxResolution>  auto.  Instead, divide your <maxExtent> by your
+     *     maximum expected dimension.
+     */
+    div: null,
+    
+    /**
+     * Property: dragging
+     * {Boolean} The map is currently being dragged.
+     */
+    dragging: false,
+
+    /**
+     * Property: size
+     * {<OpenLayers.Size>} Size of the main div (this.div)
+     */
+    size: null,
+    
+    /**
+     * Property: viewPortDiv
+     * {HTMLDivElement} The element that represents the map viewport
+     */
+    viewPortDiv: null,
+
+    /**
+     * Property: layerContainerOrigin
+     * {<OpenLayers.LonLat>} The lonlat at which the later container was
+     *                       re-initialized (on-zoom)
+     */
+    layerContainerOrigin: null,
+
+    /**
+     * Property: layerContainerDiv
+     * {HTMLDivElement} The element that contains the layers.
+     */
+    layerContainerDiv: null,
+
+    /**
+     * APIProperty: layers
+     * {Array(<OpenLayers.Layer>)} Ordered list of layers in the map
+     */
+    layers: null,
+
+    /**
+     * Property: controls
+     * {Array(<OpenLayers.Control>)} List of controls associated with the map.
+     *
+     * If not provided in the map options at construction, the map will
+     *     be given the following controls by default:
+     *  - <OpenLayers.Control.Navigation>
+     *  - <OpenLayers.Control.PanZoom>
+     *  - <OpenLayers.Control.ArgParser>
+     *  - <OpenLayers.Control.Attribution>
+     */
+    controls: null,
+
+    /**
+     * Property: popups
+     * {Array(<OpenLayers.Popup>)} List of popups associated with the map
+     */
+    popups: null,
+
+    /**
+     * APIProperty: baseLayer
+     * {<OpenLayers.Layer>} The currently selected base layer.  This determines
+     * min/max zoom level, projection, etc.
+     */
+    baseLayer: null,
+    
+    /**
+     * Property: center
+     * {<OpenLayers.LonLat>} The current center of the map
+     */
+    center: null,
+
+    /**
+     * Property: resolution
+     * {Float} The resolution of the map.
+     */
+    resolution: null,
+
+    /**
+     * Property: zoom
+     * {Integer} The current zoom level of the map
+     */
+    zoom: 0,    
+
+    /**
+     * Property: panRatio
+     * {Float} The ratio of the current extent within
+     *         which panning will tween.
+     */
+    panRatio: 1.5,    
+
+    /**
+     * Property: viewRequestID
+     * {String} Used to store a unique identifier that changes when the map 
+     *          view changes. viewRequestID should be used when adding data 
+     *          asynchronously to the map: viewRequestID is incremented when 
+     *          you initiate your request (right now during changing of 
+     *          baselayers and changing of zooms). It is stored here in the 
+     *          map and also in the data that will be coming back 
+     *          asynchronously. Before displaying this data on request 
+     *          completion, we check that the viewRequestID of the data is 
+     *          still the same as that of the map. Fix for #480
+     */
+    viewRequestID: 0,
+
+  // Options
+
+    /**
+     * APIProperty: tileSize
+     * {<OpenLayers.Size>} Set in the map options to override the default tile
+     *                     size for this map.
+     */
+    tileSize: null,
+
+    /**
+     * APIProperty: projection
+     * {String} Set in the map options to override the default projection 
+     *          string this map - also set maxExtent, maxResolution, and 
+     *          units if appropriate.  Default is "EPSG:4326".
+     */
+    projection: "EPSG:4326",    
+        
+    /**
+     * APIProperty: units
+     * {String} The map units.  Defaults to 'degrees'.  Possible values are
+     *          'degrees' (or 'dd'), 'm', 'ft', 'km', 'mi', 'inches'.
+     */
+    units: 'degrees',
+
+    /**
+     * APIProperty: resolutions
+     * {Array(Float)} A list of map resolutions (map units per pixel) in 
+     *     descending order.  If this is not set in the layer constructor, it 
+     *     will be set based on other resolution related properties 
+     *     (maxExtent, maxResolution, maxScale, etc.).
+     */
+    resolutions: null,
+
+    /**
+     * APIProperty: maxResolution
+     * {Float} Default max is 360 deg / 256 px, which corresponds to
+     *          zoom level 0 on gmaps.  Specify a different value in the map 
+     *          options if you are not using a geographic projection and 
+     *          displaying the whole world.
+     */
+    maxResolution: 1.40625,
+
+    /**
+     * APIProperty: minResolution
+     * {Float}
+     */
+    minResolution: null,
+
+    /**
+     * APIProperty: maxScale
+     * {Float}
+     */
+    maxScale: null,
+
+    /**
+     * APIProperty: minScale
+     * {Float}
+     */
+    minScale: null,
+
+    /**
+     * APIProperty: maxExtent
+     * {<OpenLayers.Bounds>} The maximum extent for the map.  Defaults to the
+     *                       whole world in decimal degrees 
+     *                       (-180, -90, 180, 90).  Specify a different
+     *                        extent in the map options if you are not using a 
+     *                        geographic projection and displaying the whole 
+     *                        world.
+     */
+    maxExtent: null,
+    
+    /**
+     * APIProperty: minExtent
+     * {<OpenLayers.Bounds>}
+     */
+    minExtent: null,
+    
+    /**
+     * APIProperty: restrictedExtent
+     * {<OpenLayers.Bounds>} Limit map navigation to this extent where possible.
+     *     If a non-null restrictedExtent is set, panning will be restricted
+     *     to the given bounds.  In addition, zooming to a resolution that
+     *     displays more than the restricted extent will center the map
+     *     on the restricted extent.  If you wish to limit the zoom level
+     *     or resolution, use maxResolution.
+     */
+    restrictedExtent: null,
+
+    /**
+     * APIProperty: numZoomLevels
+     * {Integer} Number of zoom levels for the map.  Defaults to 16.  Set a
+     *           different value in the map options if needed.
+     */
+    numZoomLevels: 16,
+
+    /**
+     * APIProperty: theme
+     * {String} Relative path to a CSS file from which to load theme styles.
+     *          Specify null in the map options (e.g. {theme: null}) if you 
+     *          want to get cascading style declarations - by putting links to 
+     *          stylesheets or style declarations directly in your page.
+     */
+    theme: null,
+    
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support.Projection used by
+     *     several controls to display data to user. If this property is set,
+     *     it will be set on any control which has a null displayProjection
+     *     property at the time the control is added to the map. 
+     */
+    displayProjection: null,
+
+    /**
+     * APIProperty: fallThrough
+     * {Boolean} Should OpenLayers allow events on the map to fall through to
+     *           other elements on the page, or should it swallow them? (#457)
+     *           Default is to fall through.
+     */
+    fallThrough: true,
+    
+    /**
+     * Property: panTween
+     * {OpenLayers.Tween} Animated panning tween object, see panTo()
+     */
+    panTween: null,
+
+    /**
+     * APIProperty: eventListeners
+     * {Object} If set as an option at construction, the eventListeners
+     *     object will be registered with <OpenLayers.Events.on>.  Object
+     *     structure must be a listeners object as shown in the example for
+     *     the events.on method.
+     */
+    eventListeners: null,
+
+    /**
+     * APIProperty: panMethod
+     * {Function} The Easing function to be used for tweening.  Default is
+     * OpenLayers.Easing.Expo.easeOut. Setting this to 'null' turns off
+     * animated panning.
+     */
+    panMethod: OpenLayers.Easing.Expo.easeOut,
+    
+    /**
+     * Property: panDuration
+     * {Integer} The number of steps to be passed to the
+     * OpenLayers.Tween.start() method when the map is
+     * panned.
+     * Default is 50.
+     */
+    panDuration: 50,
+    
+    /**
+     * Property: paddingForPopups
+     * {<OpenLayers.Bounds>} Outside margin of the popup. Used to prevent 
+     *     the popup from getting too close to the map border.
+     */
+    paddingForPopups : null,
+    
+    /**
+     * Constructor: OpenLayers.Map
+     * Constructor for a new OpenLayers.Map instance.  There are two possible
+     *     ways to call the map constructor.  See the examples below.
+     *
+     * Parameters:
+     * div - {DOMElement|String}  The element or id of an element in your page
+     *     that will contain the map.  May be omitted if the <div> option is
+     *     provided or if you intend to call the <render> method later.
+     * options - {Object} Optional object with properties to tag onto the map.
+     *
+     * Examples (method one):
+     * (code)
+     * // create a map with default options in an element with the id "map1"
+     * var map = new OpenLayers.Map("map1");
+     *
+     * // create a map with non-default options in an element with id "map2"
+     * var options = {
+     *     maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000),
+     *     maxResolution: 156543,
+     *     units: 'm',
+     *     projection: "EPSG:41001"
+     * };
+     * var map = new OpenLayers.Map("map2", options);
+     * (end)
+     *
+     * Examples (method two - single argument):
+     * (code)
+     * // create a map with non-default options
+     * var map = new OpenLayers.Map({
+     *     div: "map_id",
+     *     maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000),
+     *     maxResolution: 156543,
+     *     units: 'm',
+     *     projection: "EPSG:41001"
+     * });
+     *
+     * // create a map without a reference to a container - call render later
+     * var map = new OpenLayers.Map({
+     *     maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000),
+     *     maxResolution: 156543,
+     *     units: 'm',
+     *     projection: "EPSG:41001"
+     * });
+     */    
+    initialize: function (div, options) {
+        
+        // If only one argument is provided, check if it is an object.
+        if(arguments.length === 1 && typeof div === "object") {
+            options = div;
+            div = options && options.div;
+        }
+
+        // Simple-type defaults are set in class definition. 
+        //  Now set complex-type defaults 
+        this.tileSize = new OpenLayers.Size(OpenLayers.Map.TILE_WIDTH,
+                                            OpenLayers.Map.TILE_HEIGHT);
+        
+        this.maxExtent = new OpenLayers.Bounds(-180, -90, 180, 90);
+        
+        this.paddingForPopups = new OpenLayers.Bounds(15, 15, 15, 15);
+
+        this.theme = OpenLayers._getScriptLocation() + 
+                             'theme/default/style.css'; 
+
+        // now override default options 
+        OpenLayers.Util.extend(this, options);
+
+        // initialize layers array
+        this.layers = [];
+
+        this.id = OpenLayers.Util.createUniqueID("OpenLayers.Map_");
+
+        this.div = OpenLayers.Util.getElement(div);
+        if(!this.div) {
+            this.div = document.createElement("div");
+            this.div.style.height = "1px";
+            this.div.style.width = "1px";
+        }
+        
+        OpenLayers.Element.addClass(this.div, 'olMap');
+
+        // the viewPortDiv is the outermost div we modify
+        var id = this.id + "_OpenLayers_ViewPort";
+        this.viewPortDiv = OpenLayers.Util.createDiv(id, null, null, null,
+                                                     "relative", null,
+                                                     "hidden");
+        this.viewPortDiv.style.width = "100%";
+        this.viewPortDiv.style.height = "100%";
+        this.viewPortDiv.className = "olMapViewport";
+        this.div.appendChild(this.viewPortDiv);
+
+        // the layerContainerDiv is the one that holds all the layers
+        id = this.id + "_OpenLayers_Container";
+        this.layerContainerDiv = OpenLayers.Util.createDiv(id);
+        this.layerContainerDiv.style.zIndex=this.Z_INDEX_BASE['Popup']-1;
+        
+        this.viewPortDiv.appendChild(this.layerContainerDiv);
+
+        this.events = new OpenLayers.Events(this, 
+                                            this.div, 
+                                            this.EVENT_TYPES, 
+                                            this.fallThrough, 
+                                            {includeXY: true});
+        this.updateSize();
+        if(this.eventListeners instanceof Object) {
+            this.events.on(this.eventListeners);
+        }
+ 
+        // update the map size and location before the map moves
+        this.events.register("movestart", this, this.updateSize);
+
+        // Because Mozilla does not support the "resize" event for elements 
+        // other than "window", we need to put a hack here. 
+        if (OpenLayers.String.contains(navigator.appName, "Microsoft")) {
+            // If IE, register the resize on the div
+            this.events.register("resize", this, this.updateSize);
+        } else {
+            // Else updateSize on catching the window's resize
+            //  Note that this is ok, as updateSize() does nothing if the 
+            //  map's size has not actually changed.
+            this.updateSizeDestroy = OpenLayers.Function.bind(this.updateSize, 
+                this);
+            OpenLayers.Event.observe(window, 'resize',
+                            this.updateSizeDestroy);
+        }
+        
+        // only append link stylesheet if the theme property is set
+        if(this.theme) {
+            // check existing links for equivalent url
+            var addNode = true;
+            var nodes = document.getElementsByTagName('link');
+            for(var i=0, len=nodes.length; i<len; ++i) {
+                if(OpenLayers.Util.isEquivalentUrl(nodes.item(i).href,
+                                                   this.theme)) {
+                    addNode = false;
+                    break;
+                }
+            }
+            // only add a new node if one with an equivalent url hasn't already
+            // been added
+            if(addNode) {
+                var cssNode = document.createElement('link');
+                cssNode.setAttribute('rel', 'stylesheet');
+                cssNode.setAttribute('type', 'text/css');
+                cssNode.setAttribute('href', this.theme);
+                document.getElementsByTagName('head')[0].appendChild(cssNode);
+            }
+        }
+        
+        if (this.controls == null) {
+            if (OpenLayers.Control != null) { // running full or lite?
+                this.controls = [ new OpenLayers.Control.Navigation(),
+                                  new OpenLayers.Control.PanZoom(),
+                                  new OpenLayers.Control.ArgParser(),
+                                  new OpenLayers.Control.Attribution()
+                                ];
+            } else {
+                this.controls = [];
+            }
+        }
+
+        for(var i=0, len=this.controls.length; i<len; i++) {
+            this.addControlToMap(this.controls[i]);
+        }
+
+        this.popups = [];
+
+        this.unloadDestroy = OpenLayers.Function.bind(this.destroy, this);
+        
+
+        // always call map.destroy()
+        OpenLayers.Event.observe(window, 'unload', this.unloadDestroy);
+        
+        // add any initial layers
+        if (options && options.layers) {
+            this.addLayers(options.layers);        
+            // set center (and optionally zoom)
+            if (options.center) {
+                // zoom can be undefined here
+                this.setCenter(options.center, options.zoom);
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: render
+     * Render the map to a specified container.
+     * 
+     * Parameters:
+     * div - {String|DOMElement} The container that the map should be rendered
+     *     to. If different than the current container, the map viewport
+     *     will be moved from the current to the new container.
+     */
+    render: function(div) {
+        this.div = OpenLayers.Util.getElement(div);
+        OpenLayers.Element.addClass(this.div, 'olMap');
+        this.events.attachToElement(this.div);
+        this.viewPortDiv.parentNode.removeChild(this.viewPortDiv);
+        this.div.appendChild(this.viewPortDiv);
+        this.updateSize();
+    },
+
+    /**
+     * Method: unloadDestroy
+     * Function that is called to destroy the map on page unload. stored here
+     *     so that if map is manually destroyed, we can unregister this.
+     */
+    unloadDestroy: null,
+    
+    /**
+     * Method: updateSizeDestroy
+     * When the map is destroyed, we need to stop listening to updateSize
+     *    events: this method stores the function we need to unregister in 
+     *    non-IE browsers.
+     */
+    updateSizeDestroy: null,
+
+    /**
+     * APIMethod: destroy
+     * Destroy this map
+     */
+    destroy:function() {
+        // if unloadDestroy is null, we've already been destroyed
+        if (!this.unloadDestroy) {
+            return false;
+        }
+        
+        // make sure panning doesn't continue after destruction
+        if(this.panTween) {
+            this.panTween.stop();
+            this.panTween = null;
+        }
+
+        // map has been destroyed. dont do it again!
+        OpenLayers.Event.stopObserving(window, 'unload', this.unloadDestroy);
+        this.unloadDestroy = null;
+
+        if (this.updateSizeDestroy) {
+            OpenLayers.Event.stopObserving(window, 'resize', 
+                                           this.updateSizeDestroy);
+        } else {
+            this.events.unregister("resize", this, this.updateSize);
+        }    
+        
+        this.paddingForPopups = null;    
+
+        if (this.controls != null) {
+            for (var i = this.controls.length - 1; i>=0; --i) {
+                this.controls[i].destroy();
+            } 
+            this.controls = null;
+        }
+        if (this.layers != null) {
+            for (var i = this.layers.length - 1; i>=0; --i) {
+                //pass 'false' to destroy so that map wont try to set a new 
+                // baselayer after each baselayer is removed
+                this.layers[i].destroy(false);
+            } 
+            this.layers = null;
+        }
+        if (this.viewPortDiv) {
+            this.div.removeChild(this.viewPortDiv);
+        }
+        this.viewPortDiv = null;
+
+        if(this.eventListeners) {
+            this.events.un(this.eventListeners);
+            this.eventListeners = null;
+        }
+        this.events.destroy();
+        this.events = null;
+
+    },
+
+    /**
+     * APIMethod: setOptions
+     * Change the map options
+     *
+     * Parameters:
+     * options - {Object} Hashtable of options to tag to the map
+     */
+    setOptions: function(options) {
+        OpenLayers.Util.extend(this, options);
+    },
+
+    /**
+     * APIMethod: getTileSize
+     * Get the tile size for the map
+     *
+     * Returns:
+     * {<OpenLayers.Size>}
+     */
+     getTileSize: function() {
+         return this.tileSize;
+     },
+
+
+    /**
+     * APIMethod: getBy
+     * Get a list of objects given a property and a match item.
+     *
+     * Parameters:
+     * array - {String} A property on the map whose value is an array.
+     * property - {String} A property on each item of the given array.
+     * match - {String | Object} A string to match.  Can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     match.test(map[array][i][property]) evaluates to true, the item will
+     *     be included in the array returned.  If no items are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array} An array of items where the given property matches the given
+     *     criteria.
+     */
+    getBy: function(array, property, match) {
+        var test = (typeof match.test == "function");
+        var found = OpenLayers.Array.filter(this[array], function(item) {
+            return item[property] == match || (test && match.test(item[property]));
+        });
+        return found;
+    },
+
+    /**
+     * APIMethod: getLayersBy
+     * Get a list of layers with properties matching the given criteria.
+     *
+     * Parameter:
+     * property - {String} A layer property to be matched.
+     * match - {String | Object} A string to match.  Can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     match.test(layer[property]) evaluates to true, the layer will be
+     *     included in the array returned.  If no layers are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Layer>)} A list of layers matching the given criteria.
+     *     An empty array is returned if no matches are found.
+     */
+    getLayersBy: function(property, match) {
+        return this.getBy("layers", property, match);
+    },
+
+    /**
+     * APIMethod: getLayersByName
+     * Get a list of layers with names matching the given name.
+     *
+     * Parameter:
+     * match - {String | Object} A layer name.  The name can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     name.test(layer.name) evaluates to true, the layer will be included
+     *     in the list of layers returned.  If no layers are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Layer>)} A list of layers matching the given name.
+     *     An empty array is returned if no matches are found.
+     */
+    getLayersByName: function(match) {
+        return this.getLayersBy("name", match);
+    },
+
+    /**
+     * APIMethod: getLayersByClass
+     * Get a list of layers of a given class (CLASS_NAME).
+     *
+     * Parameter:
+     * match - {String | Object} A layer class name.  The match can also be a
+     *     regular expression literal or object.  In addition, it can be any
+     *     object with a method named test.  For reqular expressions or other,
+     *     if type.test(layer.CLASS_NAME) evaluates to true, the layer will
+     *     be included in the list of layers returned.  If no layers are
+     *     found, an empty array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Layer>)} A list of layers matching the given class.
+     *     An empty array is returned if no matches are found.
+     */
+    getLayersByClass: function(match) {
+        return this.getLayersBy("CLASS_NAME", match);
+    },
+
+    /**
+     * APIMethod: getControlsBy
+     * Get a list of controls with properties matching the given criteria.
+     *
+     * Parameter:
+     * property - {String} A control property to be matched.
+     * match - {String | Object} A string to match.  Can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     match.test(layer[property]) evaluates to true, the layer will be
+     *     included in the array returned.  If no layers are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Control>)} A list of controls matching the given
+     *     criteria.  An empty array is returned if no matches are found.
+     */
+    getControlsBy: function(property, match) {
+        return this.getBy("controls", property, match);
+    },
+
+    /**
+     * APIMethod: getControlsByClass
+     * Get a list of controls of a given class (CLASS_NAME).
+     *
+     * Parameter:
+     * match - {String | Object} A control class name.  The match can also be a
+     *     regular expression literal or object.  In addition, it can be any
+     *     object with a method named test.  For reqular expressions or other,
+     *     if type.test(control.CLASS_NAME) evaluates to true, the control will
+     *     be included in the list of controls returned.  If no controls are
+     *     found, an empty array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Control>)} A list of controls matching the given class.
+     *     An empty array is returned if no matches are found.
+     */
+    getControlsByClass: function(match) {
+        return this.getControlsBy("CLASS_NAME", match);
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                  Layer Functions                     */
+  /*                                                      */
+  /*     The following functions deal with adding and     */
+  /*        removing Layers to and from the Map           */
+  /*                                                      */
+  /********************************************************/         
+
+    /**
+     * APIMethod: getLayer
+     * Get a layer based on its id
+     *
+     * Parameter:
+     * id - {String} A layer id
+     *
+     * Returns:
+     * {<OpenLayers.Layer>} The Layer with the corresponding id from the map's 
+     *                      layer collection, or null if not found.
+     */
+    getLayer: function(id) {
+        var foundLayer = null;
+        for (var i=0, len=this.layers.length; i<len; i++) {
+            var layer = this.layers[i];
+            if (layer.id == id) {
+                foundLayer = layer;
+                break;
+            }
+        }
+        return foundLayer;
+    },
+
+    /**
+    * Method: setLayerZIndex
+    * 
+    * Parameters:
+    * layer - {<OpenLayers.Layer>} 
+    * zIdx - {int} 
+    */    
+    setLayerZIndex: function (layer, zIdx) {
+        layer.setZIndex(
+            this.Z_INDEX_BASE[layer.isBaseLayer ? 'BaseLayer' : 'Overlay']
+            + zIdx * 5 );
+    },
+
+    /**
+     * Method: resetLayersZIndex
+     * Reset each layer's z-index based on layer's array index
+     */
+    resetLayersZIndex: function() {
+        for (var i=0, len=this.layers.length; i<len; i++) {
+            var layer = this.layers[i];
+            this.setLayerZIndex(layer, i);
+        }
+    },
+
+    /**
+    * APIMethod: addLayer
+    *
+    * Parameters:
+    * layer - {<OpenLayers.Layer>} 
+    */    
+    addLayer: function (layer) {
+        for(var i=0, len=this.layers.length; i <len; i++) {
+            if (this.layers[i] == layer) {
+                var msg = OpenLayers.i18n('layerAlreadyAdded', 
+                                                      {'layerName':layer.name});
+                OpenLayers.Console.warn(msg);
+                return false;
+            }
+        }
+        if(this.allOverlays) {
+            layer.isBaseLayer = false;
+        }
+
+        if (this.events.triggerEvent("preaddlayer", {layer: layer}) === false) {
+            return;
+        }
+        
+        layer.div.className = "olLayerDiv";
+        layer.div.style.overflow = "";
+        this.setLayerZIndex(layer, this.layers.length);
+
+        if (layer.isFixed) {
+            this.viewPortDiv.appendChild(layer.div);
+        } else {
+            this.layerContainerDiv.appendChild(layer.div);
+        }
+        this.layers.push(layer);
+        layer.setMap(this);
+
+        if (layer.isBaseLayer || (this.allOverlays && !this.baseLayer))  {
+            if (this.baseLayer == null) {
+                // set the first baselaye we add as the baselayer
+                this.setBaseLayer(layer);
+            } else {
+                layer.setVisibility(false);
+            }
+        } else {
+            layer.redraw();
+        }
+
+        this.events.triggerEvent("addlayer", {layer: layer});
+        layer.afterAdd();
+    },
+
+    /**
+    * APIMethod: addLayers 
+    *
+    * Parameters:
+    * layers - {Array(<OpenLayers.Layer>)} 
+    */    
+    addLayers: function (layers) {
+        for (var i=0, len=layers.length; i<len; i++) {
+            this.addLayer(layers[i]);
+        }
+    },
+
+    /** 
+     * APIMethod: removeLayer
+     * Removes a layer from the map by removing its visual element (the 
+     *   layer.div property), then removing it from the map's internal list 
+     *   of layers, setting the layer's map property to null. 
+     * 
+     *   a "removelayer" event is triggered.
+     * 
+     *   very worthy of mention is that simply removing a layer from a map
+     *   will not cause the removal of any popups which may have been created
+     *   by the layer. this is due to the fact that it was decided at some
+     *   point that popups would not belong to layers. thus there is no way 
+     *   for us to know here to which layer the popup belongs.
+     *    
+     *     A simple solution to this is simply to call destroy() on the layer.
+     *     the default OpenLayers.Layer class's destroy() function
+     *     automatically takes care to remove itself from whatever map it has
+     *     been attached to. 
+     * 
+     *     The correct solution is for the layer itself to register an 
+     *     event-handler on "removelayer" and when it is called, if it 
+     *     recognizes itself as the layer being removed, then it cycles through
+     *     its own personal list of popups, removing them from the map.
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} 
+     * setNewBaseLayer - {Boolean} Default is true
+     */
+    removeLayer: function(layer, setNewBaseLayer) {
+        if (setNewBaseLayer == null) {
+            setNewBaseLayer = true;
+        }
+
+        if (layer.isFixed) {
+            this.viewPortDiv.removeChild(layer.div);
+        } else {
+            this.layerContainerDiv.removeChild(layer.div);
+        }
+        OpenLayers.Util.removeItem(this.layers, layer);
+        layer.removeMap(this);
+        layer.map = null;
+
+        // if we removed the base layer, need to set a new one
+        if(this.baseLayer == layer) {
+            this.baseLayer = null;
+            if(setNewBaseLayer) {
+                for(var i=0, len=this.layers.length; i<len; i++) {
+                    var iLayer = this.layers[i];
+                    if (iLayer.isBaseLayer || this.allOverlays) {
+                        this.setBaseLayer(iLayer);
+                        break;
+                    }
+                }
+            }
+        }
+
+        this.resetLayersZIndex();
+
+        this.events.triggerEvent("removelayer", {layer: layer});
+    },
+
+    /**
+     * APIMethod: getNumLayers
+     * 
+     * Returns:
+     * {Int} The number of layers attached to the map.
+     */
+    getNumLayers: function () {
+        return this.layers.length;
+    },
+
+    /** 
+     * APIMethod: getLayerIndex
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer>}
+     *
+     * Returns:
+     * {Integer} The current (zero-based) index of the given layer in the map's
+     *           layer stack. Returns -1 if the layer isn't on the map.
+     */
+    getLayerIndex: function (layer) {
+        return OpenLayers.Util.indexOf(this.layers, layer);
+    },
+    
+    /** 
+     * APIMethod: setLayerIndex
+     * Move the given layer to the specified (zero-based) index in the layer
+     *     list, changing its z-index in the map display. Use
+     *     map.getLayerIndex() to find out the current index of a layer. Note
+     *     that this cannot (or at least should not) be effectively used to
+     *     raise base layers above overlays.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} 
+     * idx - {int} 
+     */
+    setLayerIndex: function (layer, idx) {
+        var base = this.getLayerIndex(layer);
+        if (idx < 0) {
+            idx = 0;
+        } else if (idx > this.layers.length) {
+            idx = this.layers.length;
+        }
+        if (base != idx) {
+            this.layers.splice(base, 1);
+            this.layers.splice(idx, 0, layer);
+            for (var i=0, len=this.layers.length; i<len; i++) {
+                this.setLayerZIndex(this.layers[i], i);
+            }
+            this.events.triggerEvent("changelayer", {
+                layer: layer, property: "order"
+            });
+            if(this.allOverlays) {
+                if(idx === 0) {
+                    this.setBaseLayer(layer);
+                } else if(this.baseLayer !== this.layers[0]) {
+                    this.setBaseLayer(this.layers[0]);
+                }
+            }
+        }
+    },
+
+    /** 
+     * APIMethod: raiseLayer
+     * Change the index of the given layer by delta. If delta is positive, 
+     *     the layer is moved up the map's layer stack; if delta is negative,
+     *     the layer is moved down.  Again, note that this cannot (or at least
+     *     should not) be effectively used to raise base layers above overlays.
+     *
+     * Paremeters:
+     * layer - {<OpenLayers.Layer>} 
+     * delta - {int} 
+     */
+    raiseLayer: function (layer, delta) {
+        var idx = this.getLayerIndex(layer) + delta;
+        this.setLayerIndex(layer, idx);
+    },
+    
+    /** 
+     * APIMethod: setBaseLayer
+     * Allows user to specify one of the currently-loaded layers as the Map's
+     *     new base layer.
+     * 
+     * Parameters:
+     * newBaseLayer - {<OpenLayers.Layer>}
+     */
+    setBaseLayer: function(newBaseLayer) {
+        
+        if (newBaseLayer != this.baseLayer) {
+          
+            // ensure newBaseLayer is already loaded
+            if (OpenLayers.Util.indexOf(this.layers, newBaseLayer) != -1) {
+
+                // preserve center and scale when changing base layers
+                var center = this.getCenter();
+                var newResolution = OpenLayers.Util.getResolutionFromScale(
+                    this.getScale(), newBaseLayer.units
+                );
+
+                // make the old base layer invisible 
+                if (this.baseLayer != null && !this.allOverlays) {
+                    this.baseLayer.setVisibility(false);
+                }
+
+                // set new baselayer
+                this.baseLayer = newBaseLayer;
+                
+                // Increment viewRequestID since the baseLayer is 
+                // changing. This is used by tiles to check if they should 
+                // draw themselves.
+                this.viewRequestID++;
+                if(!this.allOverlays || this.baseLayer.visibility) {
+                    this.baseLayer.setVisibility(true);
+                }
+
+                // recenter the map
+                if (center != null) {
+                    // new zoom level derived from old scale
+                    var newZoom = this.getZoomForResolution(
+                        newResolution || this.resolution, true
+                    );
+                    // zoom and force zoom change
+                    this.setCenter(center, newZoom, false, true);
+                }
+
+                this.events.triggerEvent("changebaselayer", {
+                    layer: this.baseLayer
+                });
+            }        
+        }
+    },
+
+
+  /********************************************************/
+  /*                                                      */
+  /*                 Control Functions                    */
+  /*                                                      */
+  /*     The following functions deal with adding and     */
+  /*        removing Controls to and from the Map         */
+  /*                                                      */
+  /********************************************************/         
+
+    /**
+     * APIMethod: addControl
+     * Add the passed over control to the map. Optionally 
+     *     position the control at the given pixel.
+     * 
+     * Parameters:
+     * control - {<OpenLayers.Control>}
+     * px - {<OpenLayers.Pixel>}
+     */    
+    addControl: function (control, px) {
+        this.controls.push(control);
+        this.addControlToMap(control, px);
+    },
+    
+    /**
+     * APIMethod: addControls
+     * Add all of the passed over controls to the map. 
+     *     You can pass over an optional second array
+     *     with pixel-objects to position the controls.
+     *     The indices of the two arrays should match and
+     *     you can add null as pixel for those controls 
+     *     you want to be autopositioned.   
+     *     
+     * Parameters:
+     * controls - {Array(<OpenLayers.Control>)}
+     * pixels - {Array(<OpenLayers.Pixel>)}
+     */    
+    addControls: function (controls, pixels) {
+        var pxs = (arguments.length === 1) ? [] : pixels;
+        for (var i=0, len=controls.length; i<len; i++) {
+            var ctrl = controls[i];
+            var px = (pxs[i]) ? pxs[i] : null;
+            this.addControl( ctrl, px );
+        }
+    },
+
+    /**
+     * Method: addControlToMap
+     * 
+     * Parameters:
+     * 
+     * control - {<OpenLayers.Control>}
+     * px - {<OpenLayers.Pixel>}
+     */    
+    addControlToMap: function (control, px) {
+        // If a control doesn't have a div at this point, it belongs in the
+        // viewport.
+        control.outsideViewport = (control.div != null);
+        
+        // If the map has a displayProjection, and the control doesn't, set 
+        // the display projection.
+        if (this.displayProjection && !control.displayProjection) {
+            control.displayProjection = this.displayProjection;
+        }    
+        
+        control.setMap(this);
+        var div = control.draw(px);
+        if (div) {
+            if(!control.outsideViewport) {
+                div.style.zIndex = this.Z_INDEX_BASE['Control'] +
+                                    this.controls.length;
+                this.viewPortDiv.appendChild( div );
+            }
+        }
+        if(control.autoActivate) {
+            control.activate();
+        }
+    },
+    
+    /**
+     * APIMethod: getControl
+     * 
+     * Parameters:
+     * id - {String} ID of the control to return.
+     * 
+     * Returns:
+     * {<OpenLayers.Control>} The control from the map's list of controls 
+     *                        which has a matching 'id'. If none found, 
+     *                        returns null.
+     */    
+    getControl: function (id) {
+        var returnControl = null;
+        for(var i=0, len=this.controls.length; i<len; i++) {
+            var control = this.controls[i];
+            if (control.id == id) {
+                returnControl = control;
+                break;
+            }
+        }
+        return returnControl;
+    },
+    
+    /** 
+     * APIMethod: removeControl
+     * Remove a control from the map. Removes the control both from the map 
+     *     object's internal array of controls, as well as from the map's 
+     *     viewPort (assuming the control was not added outsideViewport)
+     * 
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control to remove.
+     */    
+    removeControl: function (control) {
+        //make sure control is non-null and actually part of our map
+        if ( (control) && (control == this.getControl(control.id)) ) {
+            if (control.div && (control.div.parentNode == this.viewPortDiv)) {
+                this.viewPortDiv.removeChild(control.div);
+            }
+            OpenLayers.Util.removeItem(this.controls, control);
+        }
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                  Popup Functions                     */
+  /*                                                      */
+  /*     The following functions deal with adding and     */
+  /*        removing Popups to and from the Map           */
+  /*                                                      */
+  /********************************************************/         
+
+    /** 
+     * APIMethod: addPopup
+     * 
+     * Parameters:
+     * popup - {<OpenLayers.Popup>}
+     * exclusive - {Boolean} If true, closes all other popups first
+     */
+    addPopup: function(popup, exclusive) {
+
+        if (exclusive) {
+            //remove all other popups from screen
+            for (var i = this.popups.length - 1; i >= 0; --i) {
+                this.removePopup(this.popups[i]);
+            }
+        }
+
+        popup.map = this;
+        this.popups.push(popup);
+        var popupDiv = popup.draw();
+        if (popupDiv) {
+            popupDiv.style.zIndex = this.Z_INDEX_BASE['Popup'] +
+                                    this.popups.length;
+            this.layerContainerDiv.appendChild(popupDiv);
+        }
+    },
+    
+    /** 
+    * APIMethod: removePopup
+    * 
+    * Parameters:
+    * popup - {<OpenLayers.Popup>}
+    */
+    removePopup: function(popup) {
+        OpenLayers.Util.removeItem(this.popups, popup);
+        if (popup.div) {
+            try { this.layerContainerDiv.removeChild(popup.div); }
+            catch (e) { } // Popups sometimes apparently get disconnected
+                      // from the layerContainerDiv, and cause complaints.
+        }
+        popup.map = null;
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*              Container Div Functions                 */
+  /*                                                      */
+  /*   The following functions deal with the access to    */
+  /*    and maintenance of the size of the container div  */
+  /*                                                      */
+  /********************************************************/     
+
+    /**
+     * APIMethod: getSize
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} An <OpenLayers.Size> object that represents the 
+     *                     size, in pixels, of the div into which OpenLayers 
+     *                     has been loaded. 
+     *                     Note - A clone() of this locally cached variable is
+     *                     returned, so as not to allow users to modify it.
+     */
+    getSize: function () {
+        var size = null;
+        if (this.size != null) {
+            size = this.size.clone();
+        }
+        return size;
+    },
+
+    /**
+     * APIMethod: updateSize
+     * This function should be called by any external code which dynamically
+     *     changes the size of the map div (because mozilla wont let us catch 
+     *     the "onresize" for an element)
+     */
+    updateSize: function() {
+        // the div might have moved on the page, also
+        var newSize = this.getCurrentSize();
+        if (newSize && !isNaN(newSize.h) && !isNaN(newSize.w)) {
+            this.events.clearMouseCache();
+            var oldSize = this.getSize();
+            if (oldSize == null) {
+                this.size = oldSize = newSize;
+            }
+            if (!newSize.equals(oldSize)) {
+                
+                // store the new size
+                this.size = newSize;
+    
+                //notify layers of mapresize
+                for(var i=0, len=this.layers.length; i<len; i++) {
+                    this.layers[i].onMapResize();                
+                }
+    
+                var center = this.getCenter();
+    
+                if (this.baseLayer != null && center != null) {
+                    var zoom = this.getZoom();
+                    this.zoom = null;
+                    this.setCenter(center, zoom);
+                }
+    
+            }
+        }
+    },
+    
+    /**
+     * Method: getCurrentSize
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} A new <OpenLayers.Size> object with the dimensions 
+     *                     of the map div
+     */
+    getCurrentSize: function() {
+
+        var size = new OpenLayers.Size(this.div.clientWidth, 
+                                       this.div.clientHeight);
+
+        if (size.w == 0 && size.h == 0 || isNaN(size.w) && isNaN(size.h)) {
+            size.w = this.div.offsetWidth;
+            size.h = this.div.offsetHeight;
+        }
+        if (size.w == 0 && size.h == 0 || isNaN(size.w) && isNaN(size.h)) {
+            size.w = parseInt(this.div.style.width);
+            size.h = parseInt(this.div.style.height);
+        }
+        return size;
+    },
+
+    /** 
+     * Method: calculateBounds
+     * 
+     * Parameters:
+     * center - {<OpenLayers.LonLat>} Default is this.getCenter()
+     * resolution - {float} Default is this.getResolution() 
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A bounds based on resolution, center, and 
+     *                       current mapsize.
+     */
+    calculateBounds: function(center, resolution) {
+
+        var extent = null;
+        
+        if (center == null) {
+            center = this.getCenter();
+        }                
+        if (resolution == null) {
+            resolution = this.getResolution();
+        }
+    
+        if ((center != null) && (resolution != null)) {
+
+            var size = this.getSize();
+            var w_deg = size.w * resolution;
+            var h_deg = size.h * resolution;
+        
+            extent = new OpenLayers.Bounds(center.lon - w_deg / 2,
+                                           center.lat - h_deg / 2,
+                                           center.lon + w_deg / 2,
+                                           center.lat + h_deg / 2);
+        
+        }
+
+        return extent;
+    },
+
+
+  /********************************************************/
+  /*                                                      */
+  /*            Zoom, Center, Pan Functions               */
+  /*                                                      */
+  /*    The following functions handle the validation,    */
+  /*   getting and setting of the Zoom Level and Center   */
+  /*       as well as the panning of the Map              */
+  /*                                                      */
+  /********************************************************/
+    /**
+     * APIMethod: getCenter
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>}
+     */
+    getCenter: function () {
+        var center = null;
+        if (this.center) {
+            center = this.center.clone();
+        }
+        return center;
+    },
+
+
+    /**
+     * APIMethod: getZoom
+     * 
+     * Returns:
+     * {Integer}
+     */
+    getZoom: function () {
+        return this.zoom;
+    },
+    
+    /** 
+     * APIMethod: pan
+     * Allows user to pan by a value of screen pixels
+     * 
+     * Parameters:
+     * dx - {Integer}
+     * dy - {Integer}
+     * options - {Object} Options to configure panning:
+     *  - *animate* {Boolean} Use panTo instead of setCenter. Default is true.
+     *  - *dragging* {Boolean} Call setCenter with dragging true.  Default is
+     *    false.
+     */
+    pan: function(dx, dy, options) {
+        options = OpenLayers.Util.applyDefaults(options, {
+            animate: true,
+            dragging: false
+        });
+        // getCenter
+        var centerPx = this.getViewPortPxFromLonLat(this.getCenter());
+
+        // adjust
+        var newCenterPx = centerPx.add(dx, dy);
+        
+        // only call setCenter if not dragging or there has been a change
+        if (!options.dragging || !newCenterPx.equals(centerPx)) {
+            var newCenterLonLat = this.getLonLatFromViewPortPx(newCenterPx);
+            if (options.animate) {
+                this.panTo(newCenterLonLat);
+            } else {
+                this.setCenter(newCenterLonLat, null, options.dragging);
+            }    
+        }
+
+   },
+   
+   /** 
+     * APIMethod: panTo
+     * Allows user to pan to a new lonlat
+     * If the new lonlat is in the current extent the map will slide smoothly
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.Lonlat>}
+     */
+    panTo: function(lonlat) {
+        if (this.panMethod && this.getExtent().scale(this.panRatio).containsLonLat(lonlat)) {
+            if (!this.panTween) {
+                this.panTween = new OpenLayers.Tween(this.panMethod);
+            }
+            var center = this.getCenter();
+
+            // center will not change, don't do nothing
+            if (lonlat.lon == center.lon &&
+                lonlat.lat == center.lat) {
+                return;
+            }
+
+            var from = {
+                lon: center.lon,
+                lat: center.lat
+            };
+            var to = {
+                lon: lonlat.lon,
+                lat: lonlat.lat
+            };
+            this.panTween.start(from, to, this.panDuration, {
+                callbacks: {
+                    start: OpenLayers.Function.bind(function(lonlat) {
+                        this.events.triggerEvent("movestart");
+                    }, this),
+                    eachStep: OpenLayers.Function.bind(function(lonlat) {
+                        lonlat = new OpenLayers.LonLat(lonlat.lon, lonlat.lat);
+                        this.moveTo(lonlat, this.zoom, {
+                            'dragging': true,
+                            'noEvent': true
+                        });
+                    }, this),
+                    done: OpenLayers.Function.bind(function(lonlat) {
+                        lonlat = new OpenLayers.LonLat(lonlat.lon, lonlat.lat);
+                        this.moveTo(lonlat, this.zoom, {
+                            'noEvent': true
+                        });
+                        this.events.triggerEvent("moveend");
+                    }, this)
+                }
+            });
+        } else {
+            this.setCenter(lonlat);
+        }
+    },
+
+    /**
+     * APIMethod: setCenter
+     * Set the map center (and optionally, the zoom level).
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>} The new center location.
+     * zoom - {Integer} Optional zoom level.
+     * dragging - {Boolean} Specifies whether or not to trigger 
+     *                      movestart/end events
+     * forceZoomChange - {Boolean} Specifies whether or not to trigger zoom 
+     *                             change events (needed on baseLayer change)
+     *
+     * TBD: reconsider forceZoomChange in 3.0
+     */
+    setCenter: function(lonlat, zoom, dragging, forceZoomChange) {
+        this.moveTo(lonlat, zoom, {
+            'dragging': dragging,
+            'forceZoomChange': forceZoomChange,
+            'caller': 'setCenter'
+        });
+    },
+
+    /**
+     * Method: moveTo
+     *
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     * zoom - {Integer}
+     * options - {Object}
+     */
+    moveTo: function(lonlat, zoom, options) {
+        if (!options) { 
+            options = {};
+        }
+        if (zoom != null) {
+            zoom = parseFloat(zoom);
+            if (!this.fractionalZoom) {
+                zoom = Math.round(zoom);
+            }
+        }
+        // dragging is false by default
+        var dragging = options.dragging;
+        // forceZoomChange is false by default
+        var forceZoomChange = options.forceZoomChange;
+        // noEvent is false by default
+        var noEvent = options.noEvent;
+
+        if (this.panTween && options.caller == "setCenter") {
+            this.panTween.stop();
+        }    
+             
+        if (!this.center && !this.isValidLonLat(lonlat)) {
+            lonlat = this.maxExtent.getCenterLonLat();
+        }
+
+        if(this.restrictedExtent != null) {
+            // In 3.0, decide if we want to change interpretation of maxExtent.
+            if(lonlat == null) { 
+                lonlat = this.getCenter(); 
+            }
+            if(zoom == null) { 
+                zoom = this.getZoom(); 
+            }
+            var resolution = this.getResolutionForZoom(zoom);
+            var extent = this.calculateBounds(lonlat, resolution); 
+            if(!this.restrictedExtent.containsBounds(extent)) {
+                var maxCenter = this.restrictedExtent.getCenterLonLat(); 
+                if(extent.getWidth() > this.restrictedExtent.getWidth()) { 
+                    lonlat = new OpenLayers.LonLat(maxCenter.lon, lonlat.lat); 
+                } else if(extent.left < this.restrictedExtent.left) {
+                    lonlat = lonlat.add(this.restrictedExtent.left -
+                                        extent.left, 0); 
+                } else if(extent.right > this.restrictedExtent.right) { 
+                    lonlat = lonlat.add(this.restrictedExtent.right -
+                                        extent.right, 0); 
+                } 
+                if(extent.getHeight() > this.restrictedExtent.getHeight()) { 
+                    lonlat = new OpenLayers.LonLat(lonlat.lon, maxCenter.lat); 
+                } else if(extent.bottom < this.restrictedExtent.bottom) { 
+                    lonlat = lonlat.add(0, this.restrictedExtent.bottom -
+                                        extent.bottom); 
+                } 
+                else if(extent.top > this.restrictedExtent.top) { 
+                    lonlat = lonlat.add(0, this.restrictedExtent.top -
+                                        extent.top); 
+                } 
+            }
+        }
+        
+        var zoomChanged = forceZoomChange || (
+                            (this.isValidZoomLevel(zoom)) && 
+                            (zoom != this.getZoom()) );
+
+        var centerChanged = (this.isValidLonLat(lonlat)) && 
+                            (!lonlat.equals(this.center));
+
+
+        // if neither center nor zoom will change, no need to do anything
+        if (zoomChanged || centerChanged || !dragging) {
+
+            if (!this.dragging && !noEvent) {
+                this.events.triggerEvent("movestart");
+            }
+
+            if (centerChanged) {
+                if ((!zoomChanged) && (this.center)) { 
+                    // if zoom hasnt changed, just slide layerContainer
+                    //  (must be done before setting this.center to new value)
+                    this.centerLayerContainer(lonlat);
+                }
+                this.center = lonlat.clone();
+            }
+
+            // (re)set the layerContainerDiv's location
+            if ((zoomChanged) || (this.layerContainerOrigin == null)) {
+                this.layerContainerOrigin = this.center.clone();
+                this.layerContainerDiv.style.left = "0px";
+                this.layerContainerDiv.style.top  = "0px";
+            }
+
+            if (zoomChanged) {
+                this.zoom = zoom;
+                this.resolution = this.getResolutionForZoom(zoom);
+                // zoom level has changed, increment viewRequestID.
+                this.viewRequestID++;
+            }    
+            
+            var bounds = this.getExtent();
+            
+            //send the move call to the baselayer and all the overlays    
+
+            if(this.baseLayer.visibility) {
+                this.baseLayer.moveTo(bounds, zoomChanged, dragging);
+                if(dragging) {
+                    this.baseLayer.events.triggerEvent("move");
+                } else {
+                    this.baseLayer.events.triggerEvent("moveend",
+                        {"zoomChanged": zoomChanged}
+                    );
+                }
+            }
+            
+            bounds = this.baseLayer.getExtent();
+            
+            for (var i=0, len=this.layers.length; i<len; i++) {
+                var layer = this.layers[i];
+                if (layer !== this.baseLayer && !layer.isBaseLayer) {
+                    var inRange = layer.calculateInRange();
+                    if (layer.inRange != inRange) {
+                        // the inRange property has changed. If the layer is
+                        // no longer in range, we turn it off right away. If
+                        // the layer is no longer out of range, the moveTo
+                        // call below will turn on the layer.
+                        layer.inRange = inRange;
+                        if (!inRange) {
+                            layer.display(false);
+                        }
+                        this.events.triggerEvent("changelayer", {
+                            layer: layer, property: "visibility"
+                        });
+                    }
+                    if (inRange && layer.visibility) {
+                        layer.moveTo(bounds, zoomChanged, dragging);
+                        if(dragging) {
+                            layer.events.triggerEvent("move");
+                        } else {
+                            layer.events.triggerEvent("moveend",
+                                {"zoomChanged": zoomChanged}
+                            );
+                        }
+                    }
+                }                
+            }
+            
+            if (zoomChanged) {
+                //redraw popups
+                for (var i=0, len=this.popups.length; i<len; i++) {
+                    this.popups[i].updatePosition();
+                }
+            }    
+            
+            this.events.triggerEvent("move");
+    
+            if (zoomChanged) { this.events.triggerEvent("zoomend"); }
+        }
+
+        // even if nothing was done, we want to notify of this
+        if (!dragging && !noEvent) {
+            this.events.triggerEvent("moveend");
+        }
+        
+        // Store the map dragging state for later use
+        this.dragging = !!dragging; 
+
+    },
+
+    /** 
+     * Method: centerLayerContainer
+     * This function takes care to recenter the layerContainerDiv.
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     */
+    centerLayerContainer: function (lonlat) {
+
+        var originPx = this.getViewPortPxFromLonLat(this.layerContainerOrigin);
+        var newPx = this.getViewPortPxFromLonLat(lonlat);
+
+        if ((originPx != null) && (newPx != null)) {
+            this.layerContainerDiv.style.left = Math.round(originPx.x - newPx.x) + "px";
+            this.layerContainerDiv.style.top  = Math.round(originPx.y - newPx.y) + "px";
+        }
+    },
+
+    /**
+     * Method: isValidZoomLevel
+     * 
+     * Parameters:
+     * zoomLevel - {Integer}
+     * 
+     * Returns:
+     * {Boolean} Whether or not the zoom level passed in is non-null and 
+     *           within the min/max range of zoom levels.
+     */
+    isValidZoomLevel: function(zoomLevel) {
+       return ( (zoomLevel != null) &&
+                (zoomLevel >= 0) && 
+                (zoomLevel < this.getNumZoomLevels()) );
+    },
+    
+    /**
+     * Method: isValidLonLat
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     * 
+     * Returns:
+     * {Boolean} Whether or not the lonlat passed in is non-null and within
+     *           the maxExtent bounds
+     */
+    isValidLonLat: function(lonlat) {
+        var valid = false;
+        if (lonlat != null) {
+            var maxExtent = this.getMaxExtent();
+            valid = maxExtent.containsLonLat(lonlat);        
+        }
+        return valid;
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                 Layer Options                        */
+  /*                                                      */
+  /*    Accessor functions to Layer Options parameters    */
+  /*                                                      */
+  /********************************************************/
+    
+    /**
+     * APIMethod: getProjection
+     * This method returns a string representing the projection. In 
+     *     the case of projection support, this will be the srsCode which
+     *     is loaded -- otherwise it will simply be the string value that
+     *     was passed to the projection at startup.
+     *
+     * FIXME: In 3.0, we will remove getProjectionObject, and instead
+     *     return a Projection object from this function. 
+     * 
+     * Returns:
+     * {String} The Projection string from the base layer or null. 
+     */
+    getProjection: function() {
+        var projection = this.getProjectionObject();
+        return projection ? projection.getCode() : null;
+    },
+    
+    /**
+     * APIMethod: getProjectionObject
+     * Returns the projection obect from the baselayer.
+     *
+     * Returns:
+     * {<OpenLayers.Projection>} The Projection of the base layer.
+     */
+    getProjectionObject: function() {
+        var projection = null;
+        if (this.baseLayer != null) {
+            projection = this.baseLayer.projection;
+        }
+        return projection;
+    },
+    
+    /**
+     * APIMethod: getMaxResolution
+     * 
+     * Returns:
+     * {String} The Map's Maximum Resolution
+     */
+    getMaxResolution: function() {
+        var maxResolution = null;
+        if (this.baseLayer != null) {
+            maxResolution = this.baseLayer.maxResolution;
+        }
+        return maxResolution;
+    },
+        
+    /**
+     * APIMethod: getMaxExtent
+     *
+     * Parameters:
+     * options - {Object} 
+     * 
+     * Allowed Options:
+     * restricted - {Boolean} If true, returns restricted extent (if it is 
+     *     available.)
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} The maxExtent property as set on the current 
+     *     baselayer, unless the 'restricted' option is set, in which case
+     *     the 'restrictedExtent' option from the map is returned (if it
+     *     is set).
+     */
+    getMaxExtent: function (options) {
+        var maxExtent = null;
+        if(options && options.restricted && this.restrictedExtent){
+            maxExtent = this.restrictedExtent;
+        } else if (this.baseLayer != null) {
+            maxExtent = this.baseLayer.maxExtent;
+        }        
+        return maxExtent;
+    },
+    
+    /**
+     * APIMethod: getNumZoomLevels
+     * 
+     * Returns:
+     * {Integer} The total number of zoom levels that can be displayed by the 
+     *           current baseLayer.
+     */
+    getNumZoomLevels: function() {
+        var numZoomLevels = null;
+        if (this.baseLayer != null) {
+            numZoomLevels = this.baseLayer.numZoomLevels;
+        }
+        return numZoomLevels;
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                 Baselayer Functions                  */
+  /*                                                      */
+  /*    The following functions, all publicly exposed     */
+  /*       in the API?, are all merely wrappers to the    */
+  /*       the same calls on whatever layer is set as     */
+  /*                the current base layer                */
+  /*                                                      */
+  /********************************************************/
+
+    /**
+     * APIMethod: getExtent
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A Bounds object which represents the lon/lat 
+     *                       bounds of the current viewPort. 
+     *                       If no baselayer is set, returns null.
+     */
+    getExtent: function () {
+        var extent = null;
+        if (this.baseLayer != null) {
+            extent = this.baseLayer.getExtent();
+        }
+        return extent;
+    },
+
+    /**
+     * APIMethod: getResolution
+     * 
+     * Returns:
+     * {Float} The current resolution of the map. 
+     *         If no baselayer is set, returns null.
+     */
+    getResolution: function () {
+        var resolution = null;
+        if (this.baseLayer != null) {
+            resolution = this.baseLayer.getResolution();
+        } else if(this.allOverlays === true && this.layers.length > 0) {
+            // while adding the 1st layer to the map in allOverlays mode,
+            // this.baseLayer is not set yet when we need the resolution
+            // for calculateInRange.
+            resolution = this.layers[0].getResolution();
+        }
+        return resolution;
+    },
+
+    /**
+     * APIMethod: getUnits
+     * 
+     * Returns:
+     * {Float} The current units of the map. 
+     *         If no baselayer is set, returns null.
+     */
+    getUnits: function () {
+        var units = null;
+        if (this.baseLayer != null) {
+            units = this.baseLayer.units;
+        }
+        return units;
+    },
+
+     /**
+      * APIMethod: getScale
+      * 
+      * Returns:
+      * {Float} The current scale denominator of the map. 
+      *         If no baselayer is set, returns null.
+      */
+    getScale: function () {
+        var scale = null;
+        if (this.baseLayer != null) {
+            var res = this.getResolution();
+            var units = this.baseLayer.units;
+            scale = OpenLayers.Util.getScaleFromResolution(res, units);
+        }
+        return scale;
+    },
+
+
+    /**
+     * APIMethod: getZoomForExtent
+     * 
+     * Parameters: 
+     * bounds - {<OpenLayers.Bounds>}
+     * closest - {Boolean} Find the zoom level that most closely fits the 
+     *     specified bounds. Note that this may result in a zoom that does 
+     *     not exactly contain the entire extent.
+     *     Default is false.
+     * 
+     * Returns:
+     * {Integer} A suitable zoom level for the specified bounds.
+     *           If no baselayer is set, returns null.
+     */
+    getZoomForExtent: function (bounds, closest) {
+        var zoom = null;
+        if (this.baseLayer != null) {
+            zoom = this.baseLayer.getZoomForExtent(bounds, closest);
+        }
+        return zoom;
+    },
+
+    /**
+     * APIMethod: getResolutionForZoom
+     * 
+     * Parameter:
+     * zoom - {Float}
+     * 
+     * Returns:
+     * {Float} A suitable resolution for the specified zoom.  If no baselayer
+     *     is set, returns null.
+     */
+    getResolutionForZoom: function(zoom) {
+        var resolution = null;
+        if(this.baseLayer) {
+            resolution = this.baseLayer.getResolutionForZoom(zoom);
+        }
+        return resolution;
+    },
+
+    /**
+     * APIMethod: getZoomForResolution
+     * 
+     * Parameter:
+     * resolution - {Float}
+     * closest - {Boolean} Find the zoom level that corresponds to the absolute 
+     *     closest resolution, which may result in a zoom whose corresponding
+     *     resolution is actually smaller than we would have desired (if this
+     *     is being called from a getZoomForExtent() call, then this means that
+     *     the returned zoom index might not actually contain the entire 
+     *     extent specified... but it'll be close).
+     *     Default is false.
+     * 
+     * Returns:
+     * {Integer} A suitable zoom level for the specified resolution.
+     *           If no baselayer is set, returns null.
+     */
+    getZoomForResolution: function(resolution, closest) {
+        var zoom = null;
+        if (this.baseLayer != null) {
+            zoom = this.baseLayer.getZoomForResolution(resolution, closest);
+        }
+        return zoom;
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                  Zooming Functions                   */
+  /*                                                      */
+  /*    The following functions, all publicly exposed     */
+  /*       in the API, are all merely wrappers to the     */
+  /*               the setCenter() function               */
+  /*                                                      */
+  /********************************************************/
+  
+    /** 
+     * APIMethod: zoomTo
+     * Zoom to a specific zoom level
+     * 
+     * Parameters:
+     * zoom - {Integer}
+     */
+    zoomTo: function(zoom) {
+        if (this.isValidZoomLevel(zoom)) {
+            this.setCenter(null, zoom);
+        }
+    },
+    
+    /**
+     * APIMethod: zoomIn
+     * 
+     * Parameters:
+     * zoom - {int}
+     */
+    zoomIn: function() {
+        this.zoomTo(this.getZoom() + 1);
+    },
+    
+    /**
+     * APIMethod: zoomOut
+     * 
+     * Parameters:
+     * zoom - {int}
+     */
+    zoomOut: function() {
+        this.zoomTo(this.getZoom() - 1);
+    },
+
+    /**
+     * APIMethod: zoomToExtent
+     * Zoom to the passed in bounds, recenter
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * closest - {Boolean} Find the zoom level that most closely fits the 
+     *     specified bounds. Note that this may result in a zoom that does 
+     *     not exactly contain the entire extent.
+     *     Default is false.
+     * 
+     */
+    zoomToExtent: function(bounds, closest) {
+        var center = bounds.getCenterLonLat();
+        if (this.baseLayer.wrapDateLine) {
+            var maxExtent = this.getMaxExtent();
+
+            //fix straddling bounds (in the case of a bbox that straddles the 
+            // dateline, it's left and right boundaries will appear backwards. 
+            // we fix this by allowing a right value that is greater than the
+            // max value at the dateline -- this allows us to pass a valid 
+            // bounds to calculate zoom)
+            //
+            bounds = bounds.clone();
+            while (bounds.right < bounds.left) {
+                bounds.right += maxExtent.getWidth();
+            }
+            //if the bounds was straddling (see above), then the center point 
+            // we got from it was wrong. So we take our new bounds and ask it
+            // for the center. Because our new bounds is at least partially 
+            // outside the bounds of maxExtent, the new calculated center 
+            // might also be. We don't want to pass a bad center value to 
+            // setCenter, so we have it wrap itself across the date line.
+            //
+            center = bounds.getCenterLonLat().wrapDateLine(maxExtent);
+        }
+        this.setCenter(center, this.getZoomForExtent(bounds, closest));
+    },
+
+    /** 
+     * APIMethod: zoomToMaxExtent
+     * Zoom to the full extent and recenter.
+     *
+     * Parameters:
+     * options - 
+     * 
+     * Allowed Options:
+     * restricted - {Boolean} True to zoom to restricted extent if it is 
+     *     set. Defaults to true.
+     */
+    zoomToMaxExtent: function(options) {
+        //restricted is true by default
+        var restricted = (options) ? options.restricted : true;
+
+        var maxExtent = this.getMaxExtent({
+            'restricted': restricted 
+        });
+        this.zoomToExtent(maxExtent);
+    },
+
+    /** 
+     * APIMethod: zoomToScale
+     * Zoom to a specified scale 
+     * 
+     * Parameters:
+     * scale - {float}
+     * closest - {Boolean} Find the zoom level that most closely fits the 
+     *     specified scale. Note that this may result in a zoom that does 
+     *     not exactly contain the entire extent.
+     *     Default is false.
+     * 
+     */
+    zoomToScale: function(scale, closest) {
+        var res = OpenLayers.Util.getResolutionFromScale(scale, 
+                                                         this.baseLayer.units);
+        var size = this.getSize();
+        var w_deg = size.w * res;
+        var h_deg = size.h * res;
+        var center = this.getCenter();
+
+        var extent = new OpenLayers.Bounds(center.lon - w_deg / 2,
+                                           center.lat - h_deg / 2,
+                                           center.lon + w_deg / 2,
+                                           center.lat + h_deg / 2);
+        this.zoomToExtent(extent, closest);
+    },
+    
+  /********************************************************/
+  /*                                                      */
+  /*             Translation Functions                    */
+  /*                                                      */
+  /*      The following functions translate between       */
+  /*           LonLat, LayerPx, and ViewPortPx            */
+  /*                                                      */
+  /********************************************************/
+      
+  //
+  // TRANSLATION: LonLat <-> ViewPortPx
+  //
+
+    /**
+     * Method: getLonLatFromViewPortPx
+     * 
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} An OpenLayers.LonLat which is the passed-in view 
+     *                       port <OpenLayers.Pixel>, translated into lon/lat
+     *                       by the current base layer.
+     */
+    getLonLatFromViewPortPx: function (viewPortPx) {
+        var lonlat = null; 
+        if (this.baseLayer != null) {
+            lonlat = this.baseLayer.getLonLatFromViewPortPx(viewPortPx);
+        }
+        return lonlat;
+    },
+
+    /**
+     * APIMethod: getViewPortPxFromLonLat
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel which is the passed-in 
+     *                      <OpenLayers.LonLat>, translated into view port 
+     *                      pixels by the current base layer.
+     */
+    getViewPortPxFromLonLat: function (lonlat) {
+        var px = null; 
+        if (this.baseLayer != null) {
+            px = this.baseLayer.getViewPortPxFromLonLat(lonlat);
+        }
+        return px;
+    },
+
+    
+  //
+  // CONVENIENCE TRANSLATION FUNCTIONS FOR API
+  //
+
+    /**
+     * APIMethod: getLonLatFromPixel
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.LonLat>} An OpenLayers.LonLat corresponding to the given
+     *                       OpenLayers.Pixel, translated into lon/lat by the 
+     *                       current base layer
+     */
+    getLonLatFromPixel: function (px) {
+        return this.getLonLatFromViewPortPx(px);
+    },
+
+    /**
+     * APIMethod: getPixelFromLonLat
+     * Returns a pixel location given a map location.  The map location is
+     *     translated to an integer pixel location (in viewport pixel
+     *     coordinates) by the current base layer.
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>} A map location.
+     * 
+     * Returns: 
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel corresponding to the 
+     *     <OpenLayers.LonLat> translated into view port pixels by the current
+     *     base layer.
+     */
+    getPixelFromLonLat: function (lonlat) {
+        var px = this.getViewPortPxFromLonLat(lonlat);
+        px.x = Math.round(px.x);
+        px.y = Math.round(px.y);
+        return px;
+    },
+    
+    /**
+     * Method: getGeodesicPixelSize
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} The pixel to get the geodesic length for. If
+     *     not provided, the center pixel of the map viewport will be used.
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} The geodesic size of the pixel in kilometers.
+     */
+    getGeodesicPixelSize: function(px) {
+        var lonlat = px ? this.getLonLatFromPixel(px) : (this.getCenter() ||
+            new OpenLayers.LonLat(0, 0));
+        var res = this.getResolution();
+        var left = lonlat.add(-res / 2, 0);
+        var right = lonlat.add(res / 2, 0);
+        var bottom = lonlat.add(0, -res / 2);
+        var top = lonlat.add(0, res / 2);
+        var dest = new OpenLayers.Projection("EPSG:4326");
+        var source = this.getProjectionObject() || dest;
+        if(!source.equals(dest)) {
+            left.transform(source, dest);
+            right.transform(source, dest);
+            bottom.transform(source, dest);
+            top.transform(source, dest);
+        }
+        
+        return new OpenLayers.Size(
+            OpenLayers.Util.distVincenty(left, right),
+            OpenLayers.Util.distVincenty(bottom, top)
+        );
+    },
+
+
+
+  //
+  // TRANSLATION: ViewPortPx <-> LayerPx
+  //
+
+    /**
+     * APIMethod: getViewPortPxFromLayerPx
+     * 
+     * Parameters:
+     * layerPx - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} Layer Pixel translated into ViewPort Pixel 
+     *                      coordinates
+     */
+    getViewPortPxFromLayerPx:function(layerPx) {
+        var viewPortPx = null;
+        if (layerPx != null) {
+            var dX = parseInt(this.layerContainerDiv.style.left);
+            var dY = parseInt(this.layerContainerDiv.style.top);
+            viewPortPx = layerPx.add(dX, dY);            
+        }
+        return viewPortPx;
+    },
+    
+    /**
+     * APIMethod: getLayerPxFromViewPortPx
+     * 
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} ViewPort Pixel translated into Layer Pixel 
+     *                      coordinates
+     */
+    getLayerPxFromViewPortPx:function(viewPortPx) {
+        var layerPx = null;
+        if (viewPortPx != null) {
+            var dX = -parseInt(this.layerContainerDiv.style.left);
+            var dY = -parseInt(this.layerContainerDiv.style.top);
+            layerPx = viewPortPx.add(dX, dY);
+            if (isNaN(layerPx.x) || isNaN(layerPx.y)) {
+                layerPx = null;
+            }
+        }
+        return layerPx;
+    },
+    
+  //
+  // TRANSLATION: LonLat <-> LayerPx
+  //
+
+    /**
+     * Method: getLonLatFromLayerPx
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.LonLat>}
+     */
+    getLonLatFromLayerPx: function (px) {
+       //adjust for displacement of layerContainerDiv
+       px = this.getViewPortPxFromLayerPx(px);
+       return this.getLonLatFromViewPortPx(px);         
+    },
+    
+    /**
+     * APIMethod: getLayerPxFromLonLat
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>} lonlat
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel which is the passed-in 
+     *                      <OpenLayers.LonLat>, translated into layer pixels 
+     *                      by the current base layer
+     */
+    getLayerPxFromLonLat: function (lonlat) {
+       //adjust for displacement of layerContainerDiv
+       var px = this.getPixelFromLonLat(lonlat);
+       return this.getLayerPxFromViewPortPx(px);         
+    },
+
+    CLASS_NAME: "OpenLayers.Map"
+});
+
+/**
+ * Constant: TILE_WIDTH
+ * {Integer} 256 Default tile width (unless otherwise specified)
+ */
+OpenLayers.Map.TILE_WIDTH = 256;
+/**
+ * Constant: TILE_HEIGHT
+ * {Integer} 256 Default tile height (unless otherwise specified)
+ */
+OpenLayers.Map.TILE_HEIGHT = 256;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler.js	(revision 76)
@@ -0,0 +1,287 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Events.js
+ */
+
+/**
+ * Class: OpenLayers.Handler
+ * Base class to construct a higher-level handler for event sequences.  All
+ *     handlers have activate and deactivate methods.  In addition, they have
+ *     methods named like browser events.  When a handler is activated, any
+ *     additional methods named like a browser event is registered as a
+ *     listener for the corresponding event.  When a handler is deactivated,
+ *     those same methods are unregistered as event listeners.
+ *
+ * Handlers also typically have a callbacks object with keys named like
+ *     the abstracted events or event sequences that they are in charge of
+ *     handling.  The controls that wrap handlers define the methods that
+ *     correspond to these abstract events - so instead of listening for
+ *     individual browser events, they only listen for the abstract events
+ *     defined by the handler.
+ *     
+ * Handlers are created by controls, which ultimately have the responsibility
+ *     of making changes to the the state of the application.  Handlers
+ *     themselves may make temporary changes, but in general are expected to
+ *     return the application in the same state that they found it.
+ */
+OpenLayers.Handler = OpenLayers.Class({
+
+    /**
+     * Property: id
+     * {String}
+     */
+    id: null,
+        
+    /**
+     * APIProperty: control
+     * {<OpenLayers.Control>}. The control that initialized this handler.  The
+     *     control is assumed to have a valid map property - that map is used
+     *     in the handler's own setMap method.
+     */
+    control: null,
+
+    /**
+     * Property: map
+     * {<OpenLayers.Map>}
+     */
+    map: null,
+
+    /**
+     * APIProperty: keyMask
+     * {Integer} Use bitwise operators and one or more of the OpenLayers.Handler
+     *     constants to construct a keyMask.  The keyMask is used by
+     *     <checkModifiers>.  If the keyMask matches the combination of keys
+     *     down on an event, checkModifiers returns true.
+     *
+     * Example:
+     * (code)
+     *     // handler only responds if the Shift key is down
+     *     handler.keyMask = OpenLayers.Handler.MOD_SHIFT;
+     *
+     *     // handler only responds if Ctrl-Shift is down
+     *     handler.keyMask = OpenLayers.Handler.MOD_SHIFT |
+     *                       OpenLayers.Handler.MOD_CTRL;
+     * (end)
+     */
+    keyMask: null,
+
+    /**
+     * Property: active
+     * {Boolean}
+     */
+    active: false,
+    
+    /**
+     * Property: evt
+     * {Event} This property references the last event handled by the handler.
+     *     Note that this property is not part of the stable API.  Use of the
+     *     evt property should be restricted to controls in the library
+     *     or other applications that are willing to update with changes to
+     *     the OpenLayers code.
+     */
+    evt: null,
+
+    /**
+     * Constructor: OpenLayers.Handler
+     * Construct a handler.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that initialized this
+     *     handler.  The control is assumed to have a valid map property; that
+     *     map is used in the handler's own setMap method.  If a map property
+     *     is present in the options argument it will be used instead.
+     * callbacks - {Object} An object whose properties correspond to abstracted
+     *     events or sequences of browser events.  The values for these
+     *     properties are functions defined by the control that get called by
+     *     the handler.
+     * options - {Object} An optional object whose properties will be set on
+     *     the handler.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Util.extend(this, options);
+        this.control = control;
+        this.callbacks = callbacks;
+
+        var map = this.map || control.map;
+        if (map) {
+            this.setMap(map); 
+        }
+        
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+    },
+    
+    /**
+     * Method: setMap
+     */
+    setMap: function (map) {
+        this.map = map;
+    },
+
+    /**
+     * Method: checkModifiers
+     * Check the keyMask on the handler.  If no <keyMask> is set, this always
+     *     returns true.  If a <keyMask> is set and it matches the combination
+     *     of keys down on an event, this returns true.
+     *
+     * Returns:
+     * {Boolean} The keyMask matches the keys down on an event.
+     */
+    checkModifiers: function (evt) {
+        if(this.keyMask == null) {
+            return true;
+        }
+        /* calculate the keyboard modifier mask for this event */
+        var keyModifiers =
+            (evt.shiftKey ? OpenLayers.Handler.MOD_SHIFT : 0) |
+            (evt.ctrlKey  ? OpenLayers.Handler.MOD_CTRL  : 0) |
+            (evt.altKey   ? OpenLayers.Handler.MOD_ALT   : 0);
+    
+        /* if it differs from the handler object's key mask,
+           bail out of the event handler */
+        return (keyModifiers == this.keyMask);
+    },
+
+    /**
+     * APIMethod: activate
+     * Turn on the handler.  Returns false if the handler was already active.
+     * 
+     * Returns: 
+     * {Boolean} The handler was activated.
+     */
+    activate: function() {
+        if(this.active) {
+            return false;
+        }
+        // register for event handlers defined on this class.
+        var events = OpenLayers.Events.prototype.BROWSER_EVENTS;
+        for (var i=0, len=events.length; i<len; i++) {
+            if (this[events[i]]) {
+                this.register(events[i], this[events[i]]); 
+            }
+        } 
+        this.active = true;
+        return true;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Turn off the handler.  Returns false if the handler was already inactive.
+     * 
+     * Returns:
+     * {Boolean} The handler was deactivated.
+     */
+    deactivate: function() {
+        if(!this.active) {
+            return false;
+        }
+        // unregister event handlers defined on this class.
+        var events = OpenLayers.Events.prototype.BROWSER_EVENTS;
+        for (var i=0, len=events.length; i<len; i++) {
+            if (this[events[i]]) {
+                this.unregister(events[i], this[events[i]]); 
+            }
+        } 
+        this.active = false;
+        return true;
+    },
+
+    /**
+    * Method: callback
+    * Trigger the control's named callback with the given arguments
+    *
+    * Parameters:
+    * name - {String} The key for the callback that is one of the properties
+    *     of the handler's callbacks object.
+    * args - {Array(*)} An array of arguments (any type) with which to call 
+    *     the callback (defined by the control).
+    */
+    callback: function (name, args) {
+        if (name && this.callbacks[name]) {
+            this.callbacks[name].apply(this.control, args);
+        }
+    },
+
+    /**
+    * Method: register
+    * register an event on the map
+    */
+    register: function (name, method) {
+        // TODO: deal with registerPriority in 3.0
+        this.map.events.registerPriority(name, this, method);
+        this.map.events.registerPriority(name, this, this.setEvent);
+    },
+
+    /**
+    * Method: unregister
+    * unregister an event from the map
+    */
+    unregister: function (name, method) {
+        this.map.events.unregister(name, this, method);   
+        this.map.events.unregister(name, this, this.setEvent);
+    },
+    
+    /**
+     * Method: setEvent
+     * With each registered browser event, the handler sets its own evt
+     *     property.  This property can be accessed by controls if needed
+     *     to get more information about the event that the handler is
+     *     processing.
+     *
+     * This allows modifier keys on the event to be checked (alt, shift,
+     *     and ctrl cannot be checked with the keyboard handler).  For a
+     *     control to determine which modifier keys are associated with the
+     *     event that a handler is currently processing, it should access
+     *     (code)handler.evt.altKey || handler.evt.shiftKey ||
+     *     handler.evt.ctrlKey(end).
+     *
+     * Parameters:
+     * evt - {Event} The browser event.
+     */
+    setEvent: function(evt) {
+        this.evt = evt;
+        return true;
+    },
+
+    /**
+     * Method: destroy
+     * Deconstruct the handler.
+     */
+    destroy: function () {
+        // unregister event listeners
+        this.deactivate();
+        // eliminate circular references
+        this.control = this.map = null;        
+    },
+
+    CLASS_NAME: "OpenLayers.Handler"
+});
+
+/**
+ * Constant: OpenLayers.Handler.MOD_NONE
+ * If set as the <keyMask>, <checkModifiers> returns false if any key is down.
+ */
+OpenLayers.Handler.MOD_NONE  = 0;
+
+/**
+ * Constant: OpenLayers.Handler.MOD_SHIFT
+ * If set as the <keyMask>, <checkModifiers> returns false if Shift is down.
+ */
+OpenLayers.Handler.MOD_SHIFT = 1;
+
+/**
+ * Constant: OpenLayers.Handler.MOD_CTRL
+ * If set as the <keyMask>, <checkModifiers> returns false if Ctrl is down.
+ */
+OpenLayers.Handler.MOD_CTRL  = 2;
+
+/**
+ * Constant: OpenLayers.Handler.MOD_ALT
+ * If set as the <keyMask>, <checkModifiers> returns false if Alt is down.
+ */
+OpenLayers.Handler.MOD_ALT   = 4;
+
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v2.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v2.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v2.js	(revision 76)
@@ -0,0 +1,193 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/GML/Base.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GML.v2
+ * Parses GML version 2.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.GML.Base>
+ */
+OpenLayers.Format.GML.v2 = OpenLayers.Class(OpenLayers.Format.GML.Base, {
+    
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocation: "http://www.opengis.net/gml http://schemas.opengis.net/gml/2.1.2/feature.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.GML.v2
+     * Create a parser for GML v2.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (required).
+     * geometryName - {String} Geometry element name.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.GML.Base.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "gml": OpenLayers.Util.applyDefaults({
+            "outerBoundaryIs": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                container.outer = obj.components[0];
+            },
+            "innerBoundaryIs": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                container.inner.push(obj.components[0]);
+            },
+            "Box": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                if(!container.components) {
+                    container.components = [];
+                }
+                var min = obj.points[0];
+                var max = obj.points[1];
+                container.components.push(
+                    new OpenLayers.Bounds(min.x, min.y, max.x, max.y)
+                );
+            }
+        }, OpenLayers.Format.GML.Base.prototype.readers["gml"]),
+        "feature": OpenLayers.Format.GML.Base.prototype.readers["feature"],
+        "wfs": OpenLayers.Format.GML.Base.prototype.readers["wfs"]
+    },
+
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>) | OpenLayers.Feature.Vector}
+     *     An array of features or a single feature.
+     *
+     * Returns:
+     * {String} Given an array of features, a doc with a gml:featureMembers
+     *     element will be returned.  Given a single feature, a doc with a
+     *     gml:featureMember element will be returned.
+     */
+    write: function(features) {
+        var name;
+        if(features instanceof Array) {
+            // GML2 only has abstract feature collections
+            // wfs provides a feature collection from a well-known schema
+            name = "wfs:FeatureCollection";
+        } else {
+            name = "gml:featureMember";
+        }
+        var root = this.writeNode(name, features);
+        this.setAttributeNS(
+            root, this.namespaces["xsi"],
+            "xsi:schemaLocation", this.schemaLocation
+        );
+
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "gml": OpenLayers.Util.applyDefaults({
+            "Point": function(geometry) {
+                var node = this.createElementNSPlus("gml:Point");
+                this.writeNode("coordinates", [geometry], node);
+                return node;
+            },
+            "coordinates": function(points) {
+                var numPoints = points.length;
+                var parts = new Array(numPoints);
+                var point;
+                for(var i=0; i<numPoints; ++i) {
+                    point = points[i];
+                    if(this.xy) {
+                        parts[i] = point.x + "," + point.y;
+                    } else {
+                        parts[i] = point.y + "," + point.x;
+                    }
+                    if(point.z != undefined) { // allow null or undefined
+                        parts[i] += "," + point.z;
+                    }
+                }
+                return this.createElementNSPlus("gml:coordinates", {
+                    attributes: {
+                        decimal: ".", cs: ",", ts: " "
+                    },
+                    value: (numPoints == 1) ? parts[0] : parts.join(" ")
+                });
+            },
+            "LineString": function(geometry) {
+                var node = this.createElementNSPlus("gml:LineString");
+                this.writeNode("coordinates", geometry.components, node);
+                return node;
+            },
+            "Polygon": function(geometry) {
+                var node = this.createElementNSPlus("gml:Polygon");
+                this.writeNode("outerBoundaryIs", geometry.components[0], node);
+                for(var i=1; i<geometry.components.length; ++i) {
+                    this.writeNode(
+                        "innerBoundaryIs", geometry.components[i], node
+                    );
+                }
+                return node;
+            },
+            "outerBoundaryIs": function(ring) {
+                var node = this.createElementNSPlus("gml:outerBoundaryIs");
+                this.writeNode("LinearRing", ring, node);
+                return node;
+            },
+            "innerBoundaryIs": function(ring) {
+                var node = this.createElementNSPlus("gml:innerBoundaryIs");
+                this.writeNode("LinearRing", ring, node);
+                return node;
+            },
+            "LinearRing": function(ring) {
+                var node = this.createElementNSPlus("gml:LinearRing");
+                this.writeNode("coordinates", ring.components, node);
+                return node;
+            },
+            "Box": function(bounds) {
+                var node = this.createElementNSPlus("gml:Box");
+                this.writeNode("coordinates", [
+                    {x: bounds.left, y: bounds.bottom},
+                    {x: bounds.right, y: bounds.top}
+                ], node);
+                // srsName attribute is optional for gml:Box
+                if(this.srsName) {
+                    node.setAttribute("srsName", this.srsName);
+                }
+                return node;
+            }
+        }, OpenLayers.Format.GML.Base.prototype.writers["gml"]),
+        "feature": OpenLayers.Format.GML.Base.prototype.writers["feature"],
+        "wfs": OpenLayers.Format.GML.Base.prototype.writers["wfs"]
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.GML.v2" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v3.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v3.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/v3.js	(revision 76)
@@ -0,0 +1,462 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/GML/Base.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GML.v3
+ * Parses GML version 3.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.GML.Base>
+ */
+OpenLayers.Format.GML.v3 = OpenLayers.Class(OpenLayers.Format.GML.Base, {
+    
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.  The writers
+     *     conform with the Simple Features Profile for GML.
+     */
+    schemaLocation: "http://www.opengis.net/gml http://schemas.opengis.net/gml/3.1.1/profiles/gmlsfProfile/1.0.0/gmlsf.xsd",
+
+    /**
+     * Property: curve
+     * {Boolean} Write gml:Curve instead of gml:LineString elements.  This also
+     *     affects the elements in multi-part geometries.  Default is false.
+     *     To write gml:Curve elements instead of gml:LineString, set curve
+     *     to true in the options to the contstructor (cannot be changed after
+     *     instantiation).
+     */
+    curve: false,
+    
+    /**
+     * Property: multiCurve
+     * {Boolean} Write gml:MultiCurve instead of gml:MultiLineString.  Since
+     *     the latter is deprecated in GML 3, the default is true.  To write
+     *     gml:MultiLineString instead of gml:MultiCurve, set multiCurve to
+     *     false in the options to the constructor (cannot be changed after
+     *     instantiation).
+     */
+    multiCurve: true,
+    
+    /**
+     * Property: surface
+     * {Boolean} Write gml:Surface instead of gml:Polygon elements.  This also
+     *     affects the elements in multi-part geometries.  Default is false.
+     *     To write gml:Surface elements instead of gml:Polygon, set surface
+     *     to true in the options to the contstructor (cannot be changed after
+     *     instantiation).
+     */
+    surface: false,
+
+    /**
+     * Property: multiSurface
+     * {Boolean} Write gml:multiSurface instead of gml:MultiPolygon.  Since
+     *     the latter is deprecated in GML 3, the default is true.  To write
+     *     gml:MultiPolygon instead of gml:multiSurface, set multiSurface to
+     *     false in the options to the constructor (cannot be changed after
+     *     instantiation).
+     */
+    multiSurface: true,
+
+    /**
+     * Constructor: OpenLayers.Format.GML.v3
+     * Create a parser for GML v3.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (required).
+     * geometryName - {String} Geometry element name.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.GML.Base.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "gml": OpenLayers.Util.applyDefaults({
+            "featureMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Curve": function(node, container) {
+                var obj = {points: []};
+                this.readChildNodes(node, obj);
+                if(!container.components) {
+                    container.components = [];
+                }
+                container.components.push(
+                    new OpenLayers.Geometry.LineString(obj.points)
+                );
+            },
+            "segments": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "LineStringSegment": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                if(obj.points) {
+                    Array.prototype.push.apply(container.points, obj.points);
+                }
+            },
+            "pos": function(node, obj) {
+                var str = this.getChildValue(node).replace(
+                    this.regExes.trimSpace, ""
+                );
+                var coords = str.split(this.regExes.splitSpace);
+                var point;
+                if(this.xy) {
+                    point = new OpenLayers.Geometry.Point(
+                        coords[0], coords[1], coords[2]
+                    );
+                } else {
+                    point = new OpenLayers.Geometry.Point(
+                        coords[1], coords[0], coords[2]
+                    );
+                }
+                obj.points = [point];
+            },
+            "posList": function(node, obj) {
+                var str = this.getChildValue(node).replace(
+                    this.regExes.trimSpace, ""
+                );
+                var coords = str.split(this.regExes.splitSpace);
+                var dim = parseInt(node.getAttribute("dimension")) || 2;
+                var j, x, y, z;
+                var numPoints = coords.length / dim;
+                var points = new Array(numPoints);
+                for(var i=0, len=coords.length; i<len; i += dim) {
+                    x = coords[i];
+                    y = coords[i+1];
+                    z = (dim == 2) ? undefined : coords[i+2];
+                    if (this.xy) {
+                        points[i/dim] = new OpenLayers.Geometry.Point(x, y, z);
+                    } else {
+                        points[i/dim] = new OpenLayers.Geometry.Point(y, x, z);
+                    }
+                }
+                obj.points = points;
+            },
+            "Surface": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "patches": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "PolygonPatch": function(node, obj) {
+                this.readers.gml.Polygon.apply(this, [node, obj]);
+            },
+            "exterior": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                container.outer = obj.components[0];
+            },
+            "interior": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                container.inner.push(obj.components[0]);
+            },
+            "MultiCurve": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                if(obj.components.length > 0) {
+                    container.components = [
+                        new OpenLayers.Geometry.MultiLineString(obj.components)
+                    ];
+                }
+            },
+            "curveMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "MultiSurface": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                if(obj.components.length > 0) {
+                    container.components = [
+                        new OpenLayers.Geometry.MultiPolygon(obj.components)
+                    ];
+                }
+            },
+            "surfaceMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "surfaceMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "pointMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "lineStringMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "polygonMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "geometryMembers": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Envelope": function(node, container) {
+                var obj = {points: new Array(2)};
+                this.readChildNodes(node, obj);
+                if(!container.components) {
+                    container.components = [];
+                }
+                var min = obj.points[0];
+                var max = obj.points[1];
+                container.components.push(
+                    new OpenLayers.Bounds(min.x, min.y, max.x, max.y)
+                );
+            },
+            "lowerCorner": function(node, container) {
+                var obj = {};
+                this.readers.gml.pos.apply(this, [node, obj]);
+                container.points[0] = obj.points[0];
+            },
+            "upperCorner": function(node, container) {
+                var obj = {};
+                this.readers.gml.pos.apply(this, [node, obj]);
+                container.points[1] = obj.points[0];
+            }
+        }, OpenLayers.Format.GML.Base.prototype.readers["gml"]),            
+        "feature": OpenLayers.Format.GML.Base.prototype.readers["feature"],
+        "wfs": OpenLayers.Format.GML.Base.prototype.readers["wfs"]
+    },
+    
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>) | OpenLayers.Feature.Vector}
+     *     An array of features or a single feature.
+     *
+     * Returns:
+     * {String} Given an array of features, a doc with a gml:featureMembers
+     *     element will be returned.  Given a single feature, a doc with a
+     *     gml:featureMember element will be returned.
+     */
+    write: function(features) {
+        var name;
+        if(features instanceof Array) {
+            name = "featureMembers";
+        } else {
+            name = "featureMember";
+        }
+        var root = this.writeNode("gml:" + name, features);
+        this.setAttributeNS(
+            root, this.namespaces["xsi"],
+            "xsi:schemaLocation", this.schemaLocation
+        );
+
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "gml": OpenLayers.Util.applyDefaults({
+            "featureMembers": function(features) {
+                var node = this.createElementNSPlus("gml:featureMembers");
+                for(var i=0, len=features.length; i<len; ++i) {
+                    this.writeNode("feature:_typeName", features[i], node);
+                }
+                return node;
+            },
+            "Point": function(geometry) {
+                var node = this.createElementNSPlus("gml:Point");
+                this.writeNode("pos", geometry, node);
+                return node;
+            },
+            "pos": function(point) {
+                // only 2d for simple features profile
+                var pos = (this.xy) ?
+                    (point.x + " " + point.y) : (point.y + " " + point.x);
+                return this.createElementNSPlus("gml:pos", {
+                    value: pos
+                });
+            },
+            "LineString": function(geometry) {
+                var node = this.createElementNSPlus("gml:LineString");
+                this.writeNode("posList", geometry.components, node);
+                return node;
+            },
+            "Curve": function(geometry) {
+                var node = this.createElementNSPlus("gml:Curve");
+                this.writeNode("segments", geometry, node);
+                return node;
+            },
+            "segments": function(geometry) {
+                var node = this.createElementNSPlus("gml:segments");
+                this.writeNode("LineStringSegment", geometry, node);
+                return node;
+            },
+            "LineStringSegment": function(geometry) {
+                var node = this.createElementNSPlus("gml:LineStringSegment");
+                this.writeNode("posList", geometry.components, node);
+                return node;
+            },
+            "posList": function(points) {
+                // only 2d for simple features profile
+                var len = points.length;
+                var parts = new Array(len);
+                var point;
+                for(var i=0; i<len; ++i) {
+                    point = points[i];
+                    if(this.xy) {
+                        parts[i] = point.x + " " + point.y;
+                    } else {
+                        parts[i] = point.y + " " + point.x;
+                    }
+                }
+                return this.createElementNSPlus("gml:posList", {
+                    value: parts.join(" ")
+                }); 
+            },
+            "Surface": function(geometry) {
+                var node = this.createElementNSPlus("gml:Surface");
+                this.writeNode("patches", geometry, node);
+                return node;
+            },
+            "patches": function(geometry) {
+                var node = this.createElementNSPlus("gml:patches");
+                this.writeNode("PolygonPatch", geometry, node);
+                return node;
+            },
+            "PolygonPatch": function(geometry) {
+                var node = this.createElementNSPlus("gml:PolygonPatch", {
+                    attributes: {interpolation: "planar"}
+                });
+                this.writeNode("exterior", geometry.components[0], node);
+                for(var i=1, len=geometry.components.length; i<len; ++i) {
+                    this.writeNode(
+                        "interior", geometry.components[i], node
+                    );
+                }
+                return node;
+            },
+            "Polygon": function(geometry) {
+                var node = this.createElementNSPlus("gml:Polygon");
+                this.writeNode("exterior", geometry.components[0], node);
+                for(var i=1, len=geometry.components.length; i<len; ++i) {
+                    this.writeNode(
+                        "interior", geometry.components[i], node
+                    );
+                }
+                return node;
+            },
+            "exterior": function(ring) {
+                var node = this.createElementNSPlus("gml:exterior");
+                this.writeNode("LinearRing", ring, node);
+                return node;
+            },
+            "interior": function(ring) {
+                var node = this.createElementNSPlus("gml:interior");
+                this.writeNode("LinearRing", ring, node);
+                return node;
+            },
+            "LinearRing": function(ring) {
+                var node = this.createElementNSPlus("gml:LinearRing");
+                this.writeNode("posList", ring.components, node);
+                return node;
+            },
+            "MultiCurve": function(geometry) {
+                var node = this.createElementNSPlus("gml:MultiCurve");
+                for(var i=0, len=geometry.components.length; i<len; ++i) {
+                    this.writeNode("curveMember", geometry.components[i], node);
+                }
+                return node;
+            },
+            "curveMember": function(geometry) {
+                var node = this.createElementNSPlus("gml:curveMember");
+                if(this.curve) {
+                    this.writeNode("Curve", geometry, node);
+                } else {
+                    this.writeNode("LineString", geometry, node);
+                }
+                return node;
+            },
+            "MultiSurface": function(geometry) {
+                var node = this.createElementNSPlus("gml:MultiSurface");
+                for(var i=0, len=geometry.components.length; i<len; ++i) {
+                    this.writeNode("surfaceMember", geometry.components[i], node);
+                }
+                return node;
+            },
+            "surfaceMember": function(polygon) {
+                var node = this.createElementNSPlus("gml:surfaceMember");
+                if(this.surface) {
+                    this.writeNode("Surface", polygon, node);
+                } else {
+                    this.writeNode("Polygon", polygon, node);
+                }
+                return node;
+            },
+            "Envelope": function(bounds) {
+                var node = this.createElementNSPlus("gml:Envelope");
+                this.writeNode("lowerCorner", bounds, node);
+                this.writeNode("upperCorner", bounds, node);
+                // srsName attribute is required for gml:Envelope
+                if(this.srsName) {
+                    node.setAttribute("srsName", this.srsName);
+                }
+                return node;
+            },
+            "lowerCorner": function(bounds) {
+                // only 2d for simple features profile
+                var pos = (this.xy) ?
+                    (bounds.left + " " + bounds.bottom) :
+                    (bounds.bottom + " " + bounds.left);
+                return this.createElementNSPlus("gml:lowerCorner", {
+                    value: pos
+                });
+            },
+            "upperCorner": function(bounds) {
+                // only 2d for simple features profile
+                var pos = (this.xy) ?
+                    (bounds.right + " " + bounds.top) :
+                    (bounds.top + " " + bounds.right);
+                return this.createElementNSPlus("gml:upperCorner", {
+                    value: pos
+                });
+            }
+        }, OpenLayers.Format.GML.Base.prototype.writers["gml"]),
+        "feature": OpenLayers.Format.GML.Base.prototype.writers["feature"],
+        "wfs": OpenLayers.Format.GML.Base.prototype.writers["wfs"]
+    },
+
+    /**
+     * Function: setGeometryTypes
+     * Sets the <geometryTypes> mapping.
+     */
+    setGeometryTypes: function() {
+        this.geometryTypes = {
+            "OpenLayers.Geometry.Point": "Point",
+            "OpenLayers.Geometry.MultiPoint": "MultiPoint",
+            "OpenLayers.Geometry.LineString": (this.curve === true) ? "Curve": "LineString",
+            "OpenLayers.Geometry.MultiLineString": (this.multiCurve === false) ? "MultiLineString" : "MultiCurve",
+            "OpenLayers.Geometry.Polygon": (this.surface === true) ? "Surface" : "Polygon",
+            "OpenLayers.Geometry.MultiPolygon": (this.multiSurface === false) ? "MultiPolygon" : "MultiSurface",
+            "OpenLayers.Geometry.Collection": "GeometryCollection"
+        };
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.GML.v3" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/Base.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/Base.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML/Base.js	(revision 76)
@@ -0,0 +1,578 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/GML.js
+ */
+
+/**
+ * Though required in the full build, if the GML format is excluded, we set
+ * the namespace here.
+ */
+if(!OpenLayers.Format.GML) {
+    OpenLayers.Format.GML = {};
+}
+
+/**
+ * Class: OpenLayers.Format.GML.Base
+ * Superclass for GML parsers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.GML.Base = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        gml: "http://www.opengis.net/gml",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance",
+        wfs: "http://www.opengis.net/wfs" // this is a convenience for reading wfs:FeatureCollection
+    },
+    
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "gml",
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocation: null,
+    
+    /**
+     * APIProperty: featureType
+     * {Array(String) or String} The local (without prefix) feature typeName(s).
+     */
+    featureType: null,
+    
+    /**
+     * APIProperty: featureNS
+     * {String} The feature namespace.  Must be set in the options at
+     *     construction.
+     */
+    featureNS: null,
+
+    /**
+     * APIProperty: geometry
+     * {String} Name of geometry element.  Defaults to "geometry".
+     */
+    geometryName: "geometry",
+
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract attributes from GML.  Default is true.
+     */
+    extractAttributes: true,
+    
+    /**
+     * APIProperty: srsName
+     * {String} URI for spatial reference system.  This is optional for
+     *     single part geometries and mandatory for collections and multis.
+     *     If set, the srsName attribute will be written for all geometries.
+     *     Default is null.
+     */
+    srsName: null,
+
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate true:(x,y) or false:(y,x)
+     * Changing is not recommended, a new Format should be instantiated.
+     */ 
+    xy: true,
+
+    /**
+     * Property: geometryTypes
+     * {Object} Maps OpenLayers geometry class names to GML element names.
+     *     Use <setGeometryTypes> before accessing this property.
+     */
+    geometryTypes: null,
+
+    /**
+     * Property: singleFeatureType
+     * {Boolean} True if there is only 1 featureType, and not an array
+     *     of featuretypes.
+     */
+    singleFeatureType: null,
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Constructor: OpenLayers.Format.GML.Base
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.GML.v2> or <OpenLayers.Format.GML.v3> constructor
+     *     instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     *
+     * Valid options properties:
+     * featureType - {Array(String) or String} Local (without prefix) feature 
+     *     typeName(s) (required).
+     * featureNS - {String} Feature namespace (required).
+     * geometryName - {String} Geometry element name.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.setGeometryTypes();
+        if(options && options.featureNS) {
+            this.setNamespace("feature", options.featureNS);
+        }
+        this.singleFeatureType = !options || (typeof options.featureType === "string");
+    },
+    
+    /**
+     * Method: read
+     *
+     * Parameters:
+     * data - {DOMElement} A gml:featureMember element, a gml:featureMembers
+     *     element, or an element containing either of the above at any level.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} An array of features.
+     */
+    read: function(data) {
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var features = [];
+        this.readNode(data, {features: features});
+        if(features.length == 0) {
+            // look for gml:featureMember elements
+            var elements = this.getElementsByTagNameNS(
+                data, this.namespaces.gml, "featureMember"
+            );
+            if(elements.length) {
+                for(var i=0, len=elements.length; i<len; ++i) {
+                    this.readNode(elements[i], {features: features});
+                }
+            } else {
+                // look for gml:featureMembers elements (this is v3, but does no harm here)
+                var elements = this.getElementsByTagNameNS(
+                    data, this.namespaces.gml, "featureMembers"
+                );
+                if(elements.length) {
+                    // there can be only one
+                    this.readNode(elements[0], {features: features});
+                }
+            }
+        }
+        return features;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "gml": {
+            "featureMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "featureMembers": function(node, obj) {
+                this.readChildNodes(node, obj);                
+            },
+            "name": function(node, obj) {
+                obj.name = this.getChildValue(node);
+            },
+            "boundedBy": function(node, obj) {
+                var container = {};
+                this.readChildNodes(node, container);
+                if(container.components && container.components.length > 0) {
+                    obj.bounds = container.components[0];
+                }
+            },
+            "Point": function(node, container) {
+                var obj = {points: []};
+                this.readChildNodes(node, obj);
+                if(!container.components) {
+                    container.components = [];
+                }
+                container.components.push(obj.points[0]);
+            },
+            "coordinates": function(node, obj) {
+                var str = this.getChildValue(node).replace(
+                    this.regExes.trimSpace, ""
+                );
+                str = str.replace(this.regExes.trimComma, ",");
+                var pointList = str.split(this.regExes.splitSpace);
+                var coords;
+                var numPoints = pointList.length;
+                var points = new Array(numPoints);
+                for(var i=0; i<numPoints; ++i) {
+                    coords = pointList[i].split(",");
+                    if (this.xy) {
+                        points[i] = new OpenLayers.Geometry.Point(
+                            coords[0], coords[1], coords[2]
+                        );
+                    } else {
+                        points[i] = new OpenLayers.Geometry.Point(
+                            coords[1], coords[0], coords[2]
+                        );
+                    }
+                }
+                obj.points = points;
+            },
+            "coord": function(node, obj) {
+                var coord = {};
+                this.readChildNodes(node, coord);
+                if(!obj.points) {
+                    obj.points = [];
+                }
+                obj.points.push(new OpenLayers.Geometry.Point(
+                    coord.x, coord.y, coord.z
+                ));
+            },
+            "X": function(node, coord) {
+                coord.x = this.getChildValue(node);
+            },
+            "Y": function(node, coord) {
+                coord.y = this.getChildValue(node);
+            },
+            "Z": function(node, coord) {
+                coord.z = this.getChildValue(node);
+            },
+            "MultiPoint": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                container.components = [
+                    new OpenLayers.Geometry.MultiPoint(obj.components)
+                ];
+            },
+            "pointMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "LineString": function(node, container) {
+                var obj = {};
+                this.readChildNodes(node, obj);
+                if(!container.components) {
+                    container.components = [];
+                }
+                container.components.push(
+                    new OpenLayers.Geometry.LineString(obj.points)
+                );
+            },
+            "MultiLineString": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                container.components = [
+                    new OpenLayers.Geometry.MultiLineString(obj.components)
+                ];
+            },
+            "lineStringMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Polygon": function(node, container) {
+                var obj = {outer: null, inner: []};
+                this.readChildNodes(node, obj);
+                obj.inner.unshift(obj.outer);
+                if(!container.components) {
+                    container.components = [];
+                }
+                container.components.push(
+                    new OpenLayers.Geometry.Polygon(obj.inner)
+                );
+            },
+            "LinearRing": function(node, obj) {
+                var container = {};
+                this.readChildNodes(node, container);
+                obj.components = [new OpenLayers.Geometry.LinearRing(
+                    container.points
+                )];
+            },
+            "MultiPolygon": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                container.components = [
+                    new OpenLayers.Geometry.MultiPolygon(obj.components)
+                ];
+            },
+            "polygonMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "GeometryCollection": function(node, container) {
+                var obj = {components: []};
+                this.readChildNodes(node, obj);
+                container.components = [
+                    new OpenLayers.Geometry.Collection(obj.components)
+                ];
+            },
+            "geometryMember": function(node, obj) {
+                this.readChildNodes(node, obj);
+            }
+        },
+        "feature": {
+            "*": function(node, obj) {
+                // The node can either be named like the featureType, or it
+                // can be a child of the feature:featureType.  Children can be
+                // geometry or attributes.
+                var name;
+                var local = node.localName || node.nodeName.split(":").pop();
+                // Since an attribute can have the same name as the feature type
+                // we only want to read the node as a feature if the parent
+                // node can have feature nodes as children.  In this case, the
+                // obj.features property is set.
+                if (obj.features) {
+                    if (!this.singleFeatureType &&
+                        (OpenLayers.Util.indexOf(this.featureType, local) !== -1)) {
+                        name = "_typeName";
+                    } else if(local === this.featureType) {
+                        name = "_typeName";
+                    }
+                } else {
+                    // Assume attribute elements have one child node and that the child
+                    // is a text node.  Otherwise assume it is a geometry node.
+                    if(node.childNodes.length == 0 ||
+                       (node.childNodes.length == 1 && node.firstChild.nodeType == 3)) {
+                        if(this.extractAttributes) {
+                            name = "_attribute";
+                        }
+                    } else {
+                        name = "_geometry";
+                    }
+                }
+                if(name) {
+                    this.readers.feature[name].apply(this, [node, obj]);
+                }
+            },
+            "_typeName": function(node, obj) {
+                var container = {components: [], attributes: {}};
+                this.readChildNodes(node, container);
+                // look for common gml namespaced elements
+                if(container.name) {
+                    container.attributes.name = container.name;
+                }
+                var feature = new OpenLayers.Feature.Vector(
+                    container.components[0], container.attributes
+                );
+                if (!this.singleFeatureType) {
+                    feature.type = node.nodeName.split(":").pop();
+                    feature.namespace = node.namespaceURI;
+                }
+                var fid = node.getAttribute("fid") ||
+                    this.getAttributeNS(node, this.namespaces["gml"], "id");
+                if(fid) {
+                    feature.fid = fid;
+                }
+                if(this.internalProjection && this.externalProjection &&
+                   feature.geometry) {
+                    feature.geometry.transform(
+                        this.externalProjection, this.internalProjection
+                    );
+                }
+                if(container.bounds) {
+                    feature.bounds = container.bounds;
+                }
+                obj.features.push(feature);
+            },
+            "_geometry": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "_attribute": function(node, obj) {
+                var local = node.localName || node.nodeName.split(":").pop();
+                var value = this.getChildValue(node);
+                obj.attributes[local] = value;
+            }
+        },
+        "wfs": {
+            "FeatureCollection": function(node, obj) {
+                this.readChildNodes(node, obj);
+            }
+        }
+    },
+    
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>) | OpenLayers.Feature.Vector}
+     *     An array of features or a single feature.
+     *
+     * Returns:
+     * {String} Given an array of features, a doc with a gml:featureMembers
+     *     element will be returned.  Given a single feature, a doc with a
+     *     gml:featureMember element will be returned.
+     */
+    write: function(features) {
+        var name;
+        if(features instanceof Array) {
+            name = "featureMembers";
+        } else {
+            name = "featureMember";
+        }
+        var root = this.writeNode("gml:" + name, features);
+        this.setAttributeNS(
+            root, this.namespaces["xsi"],
+            "xsi:schemaLocation", this.schemaLocation
+        );
+
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+    
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "gml": {
+            "featureMember": function(feature) {
+                var node = this.createElementNSPlus("gml:featureMember");
+                this.writeNode("feature:_typeName", feature, node);
+                return node;
+            },
+            "MultiPoint": function(geometry) {
+                var node = this.createElementNSPlus("gml:MultiPoint");
+                for(var i=0; i<geometry.components.length; ++i) {
+                    this.writeNode("pointMember", geometry.components[i], node);
+                }
+                return node;
+            },
+            "pointMember": function(geometry) {
+                var node = this.createElementNSPlus("gml:pointMember");
+                this.writeNode("Point", geometry, node);
+                return node;
+            },
+            "MultiLineString": function(geometry) {
+                var node = this.createElementNSPlus("gml:MultiLineString");
+                for(var i=0; i<geometry.components.length; ++i) {
+                    this.writeNode("lineStringMember", geometry.components[i], node);
+                }
+                return node;
+            },
+            "lineStringMember": function(geometry) {
+                var node = this.createElementNSPlus("gml:lineStringMember");
+                this.writeNode("LineString", geometry, node);
+                return node;
+            },
+            "MultiPolygon": function(geometry) {
+                var node = this.createElementNSPlus("gml:MultiPolygon");
+                for(var i=0; i<geometry.components.length; ++i) {
+                    this.writeNode(
+                        "polygonMember", geometry.components[i], node
+                    );
+                }
+                return node;
+            },
+            "polygonMember": function(geometry) {
+                var node = this.createElementNSPlus("gml:polygonMember");
+                this.writeNode("Polygon", geometry, node);
+                return node;
+            },
+            "GeometryCollection": function(geometry) {
+                var node = this.createElementNSPlus("gml:GeometryCollection");
+                for(var i=0, len=geometry.components.length; i<len; ++i) {
+                    this.writeNode("geometryMember", geometry.components[i], node);
+                }
+                return node;
+            },
+            "geometryMember": function(geometry) {
+                var node = this.createElementNSPlus("gml:geometryMember");
+                var child = this.writeNode("feature:_geometry", geometry);
+                node.appendChild(child.firstChild);
+                return node;
+            }
+        },
+        "feature": {
+            "_typeName": function(feature) {
+                var node = this.createElementNSPlus("feature:" + this.featureType, {
+                    attributes: {fid: feature.fid}
+                });
+                if(feature.geometry) {
+                    this.writeNode("feature:_geometry", feature.geometry, node);
+                }
+                for(var name in feature.attributes) {
+                    var value = feature.attributes[name];
+                    if(value != null) {
+                        this.writeNode(
+                            "feature:_attribute",
+                            {name: name, value: value}, node
+                        );
+                    }
+                }
+                return node;
+            },
+            "_geometry": function(geometry) {
+                if(this.externalProjection && this.internalProjection) {
+                    geometry = geometry.clone().transform(
+                        this.internalProjection, this.externalProjection
+                    );
+                }    
+                var node = this.createElementNSPlus(
+                    "feature:" + this.geometryName
+                );
+                var type = this.geometryTypes[geometry.CLASS_NAME];
+                var child = this.writeNode("gml:" + type, geometry, node);
+                if(this.srsName) {
+                    child.setAttribute("srsName", this.srsName);
+                }
+                return node;
+            },
+            "_attribute": function(obj) {
+                return this.createElementNSPlus("feature:" + obj.name, {
+                    value: obj.value
+                });
+            }
+        },
+        "wfs": {
+            "FeatureCollection": function(features) {
+                /**
+                 * This is only here because GML2 only describes abstract
+                 * feature collections.  Typically, you would not be using
+                 * the GML format to write wfs elements.  This just provides
+                 * some way to write out lists of features.  GML3 defines the
+                 * featureMembers element, so that is used by default instead.
+                 */
+                var node = this.createElementNSPlus("wfs:FeatureCollection");
+                for(var i=0, len=features.length; i<len; ++i) {
+                    this.writeNode("gml:featureMember", features[i], node);
+                }
+                return node;
+            }
+        }
+    },
+    
+    /**
+     * Function: setGeometryTypes
+     * Sets the <geometryTypes> mapping.
+     */
+    setGeometryTypes: function() {
+        this.geometryTypes = {
+            "OpenLayers.Geometry.Point": "Point",
+            "OpenLayers.Geometry.MultiPoint": "MultiPoint",
+            "OpenLayers.Geometry.LineString": "LineString",
+            "OpenLayers.Geometry.MultiLineString": "MultiLineString",
+            "OpenLayers.Geometry.Polygon": "Polygon",
+            "OpenLayers.Geometry.MultiPolygon": "MultiPolygon",
+            "OpenLayers.Geometry.Collection": "GeometryCollection"
+        };
+    },
+
+    CLASS_NAME: "OpenLayers.Format.GML.Base" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoJSON.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoJSON.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoJSON.js	(revision 76)
@@ -0,0 +1,716 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/JSON.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/MultiPoint.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/MultiLineString.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ * @requires OpenLayers/Geometry/MultiPolygon.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GeoJSON
+ * Read and write GeoJSON. Create a new parser with the
+ *     <OpenLayers.Format.GeoJSON> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.JSON>
+ */
+OpenLayers.Format.GeoJSON = OpenLayers.Class(OpenLayers.Format.JSON, {
+
+    /**
+     * APIProperty: ignoreExtraDims
+     * {Boolean} Ignore dimensions higher than 2 when reading geometry
+     * coordinates.
+     */ 
+    ignoreExtraDims: false,
+    
+    /**
+     * Constructor: OpenLayers.Format.GeoJSON
+     * Create a new parser for GeoJSON.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.JSON.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Deserialize a GeoJSON string.
+     *
+     * Parameters:
+     * json - {String} A GeoJSON string
+     * type - {String} Optional string that determines the structure of
+     *     the output.  Supported values are "Geometry", "Feature", and
+     *     "FeatureCollection".  If absent or null, a default of
+     *     "FeatureCollection" is assumed.
+     * filter - {Function} A function which will be called for every key and
+     *     value at every level of the final result. Each value will be
+     *     replaced by the result of the filter function. This can be used to
+     *     reform generic objects into instances of classes, or to transform
+     *     date strings into Date objects.
+     *
+     * Returns: 
+     * {Object} The return depends on the value of the type argument. If type
+     *     is "FeatureCollection" (the default), the return will be an array
+     *     of <OpenLayers.Feature.Vector>. If type is "Geometry", the input json
+     *     must represent a single geometry, and the return will be an
+     *     <OpenLayers.Geometry>.  If type is "Feature", the input json must
+     *     represent a single feature, and the return will be an
+     *     <OpenLayers.Feature.Vector>.
+     */
+    read: function(json, type, filter) {
+        type = (type) ? type : "FeatureCollection";
+        var results = null;
+        var obj = null;
+        if (typeof json == "string") {
+            obj = OpenLayers.Format.JSON.prototype.read.apply(this,
+                                                              [json, filter]);
+        } else { 
+            obj = json;
+        }    
+        if(!obj) {
+            OpenLayers.Console.error("Bad JSON: " + json);
+        } else if(typeof(obj.type) != "string") {
+            OpenLayers.Console.error("Bad GeoJSON - no type: " + json);
+        } else if(this.isValidType(obj, type)) {
+            switch(type) {
+                case "Geometry":
+                    try {
+                        results = this.parseGeometry(obj);
+                    } catch(err) {
+                        OpenLayers.Console.error(err);
+                    }
+                    break;
+                case "Feature":
+                    try {
+                        results = this.parseFeature(obj);
+                        results.type = "Feature";
+                    } catch(err) {
+                        OpenLayers.Console.error(err);
+                    }
+                    break;
+                case "FeatureCollection":
+                    // for type FeatureCollection, we allow input to be any type
+                    results = [];
+                    switch(obj.type) {
+                        case "Feature":
+                            try {
+                                results.push(this.parseFeature(obj));
+                            } catch(err) {
+                                results = null;
+                                OpenLayers.Console.error(err);
+                            }
+                            break;
+                        case "FeatureCollection":
+                            for(var i=0, len=obj.features.length; i<len; ++i) {
+                                try {
+                                    results.push(this.parseFeature(obj.features[i]));
+                                } catch(err) {
+                                    results = null;
+                                    OpenLayers.Console.error(err);
+                                }
+                            }
+                            break;
+                        default:
+                            try {
+                                var geom = this.parseGeometry(obj);
+                                results.push(new OpenLayers.Feature.Vector(geom));
+                            } catch(err) {
+                                results = null;
+                                OpenLayers.Console.error(err);
+                            }
+                    }
+                break;
+            }
+        }
+        return results;
+    },
+    
+    /**
+     * Method: isValidType
+     * Check if a GeoJSON object is a valid representative of the given type.
+     *
+     * Returns:
+     * {Boolean} The object is valid GeoJSON object of the given type.
+     */
+    isValidType: function(obj, type) {
+        var valid = false;
+        switch(type) {
+            case "Geometry":
+                if(OpenLayers.Util.indexOf(
+                    ["Point", "MultiPoint", "LineString", "MultiLineString",
+                     "Polygon", "MultiPolygon", "Box", "GeometryCollection"],
+                    obj.type) == -1) {
+                    // unsupported geometry type
+                    OpenLayers.Console.error("Unsupported geometry type: " +
+                                              obj.type);
+                } else {
+                    valid = true;
+                }
+                break;
+            case "FeatureCollection":
+                // allow for any type to be converted to a feature collection
+                valid = true;
+                break;
+            default:
+                // for Feature types must match
+                if(obj.type == type) {
+                    valid = true;
+                } else {
+                    OpenLayers.Console.error("Cannot convert types from " +
+                                              obj.type + " to " + type);
+                }
+        }
+        return valid;
+    },
+    
+    /**
+     * Method: parseFeature
+     * Convert a feature object from GeoJSON into an
+     *     <OpenLayers.Feature.Vector>.
+     *
+     * Parameters:
+     * obj - {Object} An object created from a GeoJSON object
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature.
+     */
+    parseFeature: function(obj) {
+        var feature, geometry, attributes, bbox;
+        attributes = (obj.properties) ? obj.properties : {};
+        bbox = (obj.geometry && obj.geometry.bbox) || obj.bbox;
+        try {
+            geometry = this.parseGeometry(obj.geometry);
+        } catch(err) {
+            // deal with bad geometries
+            throw err;
+        }
+        feature = new OpenLayers.Feature.Vector(geometry, attributes);
+        if(bbox) {
+            feature.bounds = OpenLayers.Bounds.fromArray(bbox);
+        }
+        if(obj.id) {
+            feature.fid = obj.id;
+        }
+        return feature;
+    },
+    
+    /**
+     * Method: parseGeometry
+     * Convert a geometry object from GeoJSON into an <OpenLayers.Geometry>.
+     *
+     * Parameters:
+     * obj - {Object} An object created from a GeoJSON object
+     *
+     * Returns: 
+     * {<OpenLayers.Geometry>} A geometry.
+     */
+    parseGeometry: function(obj) {
+        if (obj == null) {
+            return null;
+        }
+        var geometry, collection = false;
+        if(obj.type == "GeometryCollection") {
+            if(!(obj.geometries instanceof Array)) {
+                throw "GeometryCollection must have geometries array: " + obj;
+            }
+            var numGeom = obj.geometries.length;
+            var components = new Array(numGeom);
+            for(var i=0; i<numGeom; ++i) {
+                components[i] = this.parseGeometry.apply(
+                    this, [obj.geometries[i]]
+                );
+            }
+            geometry = new OpenLayers.Geometry.Collection(components);
+            collection = true;
+        } else {
+            if(!(obj.coordinates instanceof Array)) {
+                throw "Geometry must have coordinates array: " + obj;
+            }
+            if(!this.parseCoords[obj.type.toLowerCase()]) {
+                throw "Unsupported geometry type: " + obj.type;
+            }
+            try {
+                geometry = this.parseCoords[obj.type.toLowerCase()].apply(
+                    this, [obj.coordinates]
+                );
+            } catch(err) {
+                // deal with bad coordinates
+                throw err;
+            }
+        }
+        // We don't reproject collections because the children are reprojected
+        // for us when they are created.
+        if (this.internalProjection && this.externalProjection && !collection) {
+            geometry.transform(this.externalProjection, 
+                               this.internalProjection); 
+        }                       
+        return geometry;
+    },
+    
+    /**
+     * Property: parseCoords
+     * Object with properties corresponding to the GeoJSON geometry types.
+     *     Property values are functions that do the actual parsing.
+     */
+    parseCoords: {
+        /**
+         * Method: parseCoords.point
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array - {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "point": function(array) {
+            if (this.ignoreExtraDims == false && 
+                  array.length != 2) {
+                    throw "Only 2D points are supported: " + array;
+            }
+            return new OpenLayers.Geometry.Point(array[0], array[1]);
+        },
+        
+        /**
+         * Method: parseCoords.multipoint
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "multipoint": function(array) {
+            var points = [];
+            var p = null;
+            for(var i=0, len=array.length; i<len; ++i) {
+                try {
+                    p = this.parseCoords["point"].apply(this, [array[i]]);
+                } catch(err) {
+                    throw err;
+                }
+                points.push(p);
+            }
+            return new OpenLayers.Geometry.MultiPoint(points);
+        },
+
+        /**
+         * Method: parseCoords.linestring
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array - {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "linestring": function(array) {
+            var points = [];
+            var p = null;
+            for(var i=0, len=array.length; i<len; ++i) {
+                try {
+                    p = this.parseCoords["point"].apply(this, [array[i]]);
+                } catch(err) {
+                    throw err;
+                }
+                points.push(p);
+            }
+            return new OpenLayers.Geometry.LineString(points);
+        },
+        
+        /**
+         * Method: parseCoords.multilinestring
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array - {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "multilinestring": function(array) {
+            var lines = [];
+            var l = null;
+            for(var i=0, len=array.length; i<len; ++i) {
+                try {
+                    l = this.parseCoords["linestring"].apply(this, [array[i]]);
+                } catch(err) {
+                    throw err;
+                }
+                lines.push(l);
+            }
+            return new OpenLayers.Geometry.MultiLineString(lines);
+        },
+        
+        /**
+         * Method: parseCoords.polygon
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "polygon": function(array) {
+            var rings = [];
+            var r, l;
+            for(var i=0, len=array.length; i<len; ++i) {
+                try {
+                    l = this.parseCoords["linestring"].apply(this, [array[i]]);
+                } catch(err) {
+                    throw err;
+                }
+                r = new OpenLayers.Geometry.LinearRing(l.components);
+                rings.push(r);
+            }
+            return new OpenLayers.Geometry.Polygon(rings);
+        },
+
+        /**
+         * Method: parseCoords.multipolygon
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array - {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "multipolygon": function(array) {
+            var polys = [];
+            var p = null;
+            for(var i=0, len=array.length; i<len; ++i) {
+                try {
+                    p = this.parseCoords["polygon"].apply(this, [array[i]]);
+                } catch(err) {
+                    throw err;
+                }
+                polys.push(p);
+            }
+            return new OpenLayers.Geometry.MultiPolygon(polys);
+        },
+
+        /**
+         * Method: parseCoords.box
+         * Convert a coordinate array from GeoJSON into an
+         *     <OpenLayers.Geometry>.
+         *
+         * Parameters:
+         * array - {Object} The coordinates array from the GeoJSON fragment.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry>} A geometry.
+         */
+        "box": function(array) {
+            if(array.length != 2) {
+                throw "GeoJSON box coordinates must have 2 elements";
+            }
+            return new OpenLayers.Geometry.Polygon([
+                new OpenLayers.Geometry.LinearRing([
+                    new OpenLayers.Geometry.Point(array[0][0], array[0][1]),
+                    new OpenLayers.Geometry.Point(array[1][0], array[0][1]),
+                    new OpenLayers.Geometry.Point(array[1][0], array[1][1]),
+                    new OpenLayers.Geometry.Point(array[0][0], array[1][1]),
+                    new OpenLayers.Geometry.Point(array[0][0], array[0][1])
+                ])
+            ]);
+        }
+
+    },
+
+    /**
+     * APIMethod: write
+     * Serialize a feature, geometry, array of features into a GeoJSON string.
+     *
+     * Parameters:
+     * obj - {Object} An <OpenLayers.Feature.Vector>, <OpenLayers.Geometry>,
+     *     or an array of features.
+     * pretty - {Boolean} Structure the output with newlines and indentation.
+     *     Default is false.
+     *
+     * Returns:
+     * {String} The GeoJSON string representation of the input geometry,
+     *     features, or array of features.
+     */
+    write: function(obj, pretty) {
+        var geojson = {
+            "type": null
+        };
+        if(obj instanceof Array) {
+            geojson.type = "FeatureCollection";
+            var numFeatures = obj.length;
+            geojson.features = new Array(numFeatures);
+            for(var i=0; i<numFeatures; ++i) {
+                var element = obj[i];
+                if(!element instanceof OpenLayers.Feature.Vector) {
+                    var msg = "FeatureCollection only supports collections " +
+                              "of features: " + element;
+                    throw msg;
+                }
+                geojson.features[i] = this.extract.feature.apply(
+                    this, [element]
+                );
+            }
+        } else if (obj.CLASS_NAME.indexOf("OpenLayers.Geometry") == 0) {
+            geojson = this.extract.geometry.apply(this, [obj]);
+        } else if (obj instanceof OpenLayers.Feature.Vector) {
+            geojson = this.extract.feature.apply(this, [obj]);
+            if(obj.layer && obj.layer.projection) {
+                geojson.crs = this.createCRSObject(obj);
+            }
+        }
+        return OpenLayers.Format.JSON.prototype.write.apply(this,
+                                                            [geojson, pretty]);
+    },
+
+    /**
+     * Method: createCRSObject
+     * Create the CRS object for an object.
+     *
+     * Parameters:
+     * object - {<OpenLayers.Feature.Vector>} 
+     *
+     * Returns:
+     * {Object} An object which can be assigned to the crs property
+     * of a GeoJSON object.
+     */
+    createCRSObject: function(object) {
+       var proj = object.layer.projection.toString();
+       var crs = {};
+       if (proj.match(/epsg:/i)) {
+           var code = parseInt(proj.substring(proj.indexOf(":") + 1));
+           if (code == 4326) {
+               crs = {
+                   "type": "OGC",
+                   "properties": {
+                       "urn": "urn:ogc:def:crs:OGC:1.3:CRS84"
+                   }
+               };
+           } else {    
+               crs = {
+                   "type": "EPSG",
+                   "properties": {
+                       "code": code 
+                   }
+               };
+           }    
+       }
+       return crs;
+    },
+    
+    /**
+     * Property: extract
+     * Object with properties corresponding to the GeoJSON types.
+     *     Property values are functions that do the actual value extraction.
+     */
+    extract: {
+        /**
+         * Method: extract.feature
+         * Return a partial GeoJSON object representing a single feature.
+         *
+         * Parameters:
+         * feature - {<OpenLayers.Feature.Vector>}
+         *
+         * Returns:
+         * {Object} An object representing the point.
+         */
+        'feature': function(feature) {
+            var geom = this.extract.geometry.apply(this, [feature.geometry]);
+            return {
+                "type": "Feature",
+                "id": feature.fid == null ? feature.id : feature.fid,
+                "properties": feature.attributes,
+                "geometry": geom
+            };
+        },
+        
+        /**
+         * Method: extract.geometry
+         * Return a GeoJSON object representing a single geometry.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry>}
+         *
+         * Returns:
+         * {Object} An object representing the geometry.
+         */
+        'geometry': function(geometry) {
+            if (geometry == null) {
+                return null;
+            }
+            if (this.internalProjection && this.externalProjection) {
+                geometry = geometry.clone();
+                geometry.transform(this.internalProjection, 
+                                   this.externalProjection);
+            }                       
+            var geometryType = geometry.CLASS_NAME.split('.')[2];
+            var data = this.extract[geometryType.toLowerCase()].apply(this, [geometry]);
+            var json;
+            if(geometryType == "Collection") {
+                json = {
+                    "type": "GeometryCollection",
+                    "geometries": data
+                };
+            } else {
+                json = {
+                    "type": geometryType,
+                    "coordinates": data
+                };
+            }
+            
+            return json;
+        },
+
+        /**
+         * Method: extract.point
+         * Return an array of coordinates from a point.
+         *
+         * Parameters:
+         * point - {<OpenLayers.Geometry.Point>}
+         *
+         * Returns: 
+         * {Array} An array of coordinates representing the point.
+         */
+        'point': function(point) {
+            return [point.x, point.y];
+        },
+
+        /**
+         * Method: extract.multipoint
+         * Return an array of point coordinates from a multipoint.
+         *
+         * Parameters:
+         * multipoint - {<OpenLayers.Geometry.MultiPoint>}
+         *
+         * Returns:
+         * {Array} An array of point coordinate arrays representing
+         *     the multipoint.
+         */
+        'multipoint': function(multipoint) {
+            var array = [];
+            for(var i=0, len=multipoint.components.length; i<len; ++i) {
+                array.push(this.extract.point.apply(this, [multipoint.components[i]]));
+            }
+            return array;
+        },
+        
+        /**
+         * Method: extract.linestring
+         * Return an array of coordinate arrays from a linestring.
+         *
+         * Parameters:
+         * linestring - {<OpenLayers.Geometry.LineString>}
+         *
+         * Returns:
+         * {Array} An array of coordinate arrays representing
+         *     the linestring.
+         */
+        'linestring': function(linestring) {
+            var array = [];
+            for(var i=0, len=linestring.components.length; i<len; ++i) {
+                array.push(this.extract.point.apply(this, [linestring.components[i]]));
+            }
+            return array;
+        },
+
+        /**
+         * Method: extract.multilinestring
+         * Return an array of linestring arrays from a linestring.
+         * 
+         * Parameters:
+         * linestring - {<OpenLayers.Geometry.MultiLineString>}
+         * 
+         * Returns:
+         * {Array} An array of linestring arrays representing
+         *     the multilinestring.
+         */
+        'multilinestring': function(multilinestring) {
+            var array = [];
+            for(var i=0, len=multilinestring.components.length; i<len; ++i) {
+                array.push(this.extract.linestring.apply(this, [multilinestring.components[i]]));
+            }
+            return array;
+        },
+        
+        /**
+         * Method: extract.polygon
+         * Return an array of linear ring arrays from a polygon.
+         *
+         * Parameters:
+         * polygon - {<OpenLayers.Geometry.Polygon>}
+         * 
+         * Returns:
+         * {Array} An array of linear ring arrays representing the polygon.
+         */
+        'polygon': function(polygon) {
+            var array = [];
+            for(var i=0, len=polygon.components.length; i<len; ++i) {
+                array.push(this.extract.linestring.apply(this, [polygon.components[i]]));
+            }
+            return array;
+        },
+
+        /**
+         * Method: extract.multipolygon
+         * Return an array of polygon arrays from a multipolygon.
+         * 
+         * Parameters:
+         * multipolygon - {<OpenLayers.Geometry.MultiPolygon>}
+         * 
+         * Returns:
+         * {Array} An array of polygon arrays representing
+         *     the multipolygon
+         */
+        'multipolygon': function(multipolygon) {
+            var array = [];
+            for(var i=0, len=multipolygon.components.length; i<len; ++i) {
+                array.push(this.extract.polygon.apply(this, [multipolygon.components[i]]));
+            }
+            return array;
+        },
+        
+        /**
+         * Method: extract.collection
+         * Return an array of geometries from a geometry collection.
+         * 
+         * Parameters:
+         * collection - {<OpenLayers.Geometry.Collection>}
+         * 
+         * Returns:
+         * {Array} An array of geometry objects representing the geometry
+         *     collection.
+         */
+        'collection': function(collection) {
+            var len = collection.components.length;
+            var array = new Array(len);
+            for(var i=0; i<len; ++i) {
+                array[i] = this.extract.geometry.apply(
+                    this, [collection.components[i]]
+                );
+            }
+            return array;
+        }
+        
+
+    },
+
+    CLASS_NAME: "OpenLayers.Format.GeoJSON" 
+
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer.js	(revision 76)
@@ -0,0 +1,91 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSDescribeLayer
+ * Read SLD WMS DescribeLayer response
+ * DescribeLayer is meant to couple WMS to WFS and WCS
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMSDescribeLayer = OpenLayers.Class(OpenLayers.Format.XML, {
+
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.1.1".
+     */
+    defaultVersion: "1.1.1",
+   
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+
+    /**
+     * Constructor: OpenLayers.Format.WMSDescribeLayer
+     * Create a new parser for WMS DescribeLayer responses.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read DescribeLayer data from a string, and return the response. 
+     * The OGC currently defines 2 formats which are allowed for output,
+     * so we need to parse these 2 types
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} Array of {<LayerDescription>} objects which have:
+     * - {String} owsType: WFS/WCS
+     * - {String} owsURL: the online resource
+     * - {String} typeName: the name of the typename on the service
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version;
+        if(!version) {
+            version = root.getAttribute("version");
+            if(!version) {
+                version = this.defaultVersion;
+            }
+        }
+        // these are identical to us, but some WMS use 1.1.1 and some use 1.1.0
+        if (version == "1.1.1" || version == "1.1.0") {
+            version = "1.1";
+        }
+        var constructor = OpenLayers.Format.WMSDescribeLayer[
+            "v" + version.replace(/\./g, "_")
+        ];
+        if(!constructor) {
+            throw "Can't find a WMS DescribeLayer parser for version " + 
+                version;
+        }
+        var parser = new constructor(this.options);
+        var describelayer = parser.read(data);
+        describelayer.version = version;
+        return describelayer;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WMSDescribeLayer" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_0_0.js	(revision 76)
@@ -0,0 +1,150 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WFST/v1.js
+ * @requires OpenLayers/Format/Filter/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFST.v1_0_0
+ * A format for creating WFS v1.0.0 transactions.  Create a new instance with the
+ *     <OpenLayers.Format.WFST.v1_0_0> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.Filter.v1_0_0>
+ *  - <OpenLayers.Format.WFST.v1>
+ */
+OpenLayers.Format.WFST.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.Filter.v1_0_0, OpenLayers.Format.WFST.v1, {
+    
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: "1.0.0",
+
+    /**
+     * APIProperty: srsNameInQuery
+     * {Boolean} If true the reference system is passed in Query requests
+     *     via the "srsName" attribute to the "wfs:Query" element, this
+     *     property defaults to false as it isn't WFS 1.0.0 compliant.
+     */
+    srsNameInQuery: false,
+    
+    /**
+     * Property: schemaLocations
+     * {Object} Properties are namespace aliases, values are schema locations.
+     */
+    schemaLocations: {
+        "wfs": "http://schemas.opengis.net/wfs/1.0.0/WFS-transaction.xsd"
+    },
+
+    /**
+     * Constructor: OpenLayers.Format.WFST.v1_0_0
+     * A class for parsing and generating WFS v1.0.0 transactions.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (optional).
+     * featurePrefix - {String} Feature namespace alias (optional - only used
+     *     if featureNS is provided).  Default is 'feature'.
+     * geometryName - {String} Name of geometry attribute.  Default is 'the_geom'.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.Filter.v1_0_0.prototype.initialize.apply(this, [options]);
+        OpenLayers.Format.WFST.v1.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wfs": OpenLayers.Util.applyDefaults({
+            "WFS_TransactionResponse": function(node, obj) {
+                obj.insertIds = [];
+                obj.success = false;
+                this.readChildNodes(node, obj);
+            },
+            "InsertResult": function(node, container) {
+                var obj = {fids: []};
+                this.readChildNodes(node, obj);
+                container.insertIds.push(obj.fids[0]);
+            },
+            "TransactionResult": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Status": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "SUCCESS": function(node, obj) {
+                obj.success = true;
+            }
+        }, OpenLayers.Format.WFST.v1.prototype.readers["wfs"]),
+        "gml": OpenLayers.Format.GML.v2.prototype.readers["gml"],
+        "feature": OpenLayers.Format.GML.v2.prototype.readers["feature"],
+        "ogc": OpenLayers.Format.Filter.v1_0_0.prototype.readers["ogc"]
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "wfs": OpenLayers.Util.applyDefaults({
+            "Query": function(options) {
+                options = OpenLayers.Util.extend({
+                    featureNS: this.featureNS,
+                    featurePrefix: this.featurePrefix,
+                    featureType: this.featureType,
+                    srsName: this.srsName,
+                    srsNameInQuery: this.srsNameInQuery
+                }, options);
+                var node = this.createElementNSPlus("wfs:Query", {
+                    attributes: {
+                        typeName: (options.featureNS ? options.featurePrefix + ":" : "") +
+                            options.featureType
+                    }
+                });
+                if(options.srsNameInQuery && options.srsName) {
+                    node.setAttribute("srsName", options.srsName);
+                }
+                if(options.featureNS) {
+                    node.setAttribute("xmlns:" + options.featurePrefix, options.featureNS);
+                }
+                if(options.propertyNames) {
+                    for(var i=0,len = options.propertyNames.length; i<len; i++) {
+                        this.writeNode(
+                            "ogc:PropertyName", 
+                            {property: options.propertyNames[i]},
+                            node
+                        );
+                    }
+                }
+                if(options.filter) {
+                    this.setFilterProperty(options.filter);
+                    this.writeNode("ogc:Filter", options.filter, node);
+                }
+                return node;
+            }
+        }, OpenLayers.Format.WFST.v1.prototype.writers["wfs"]),
+        "gml": OpenLayers.Format.GML.v2.prototype.writers["gml"],
+        "feature": OpenLayers.Format.GML.v2.prototype.writers["feature"],
+        "ogc": OpenLayers.Format.Filter.v1_0_0.prototype.writers["ogc"]
+    },
+   
+    CLASS_NAME: "OpenLayers.Format.WFST.v1_0_0" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1_1_0.js	(revision 76)
@@ -0,0 +1,161 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WFST/v1.js
+ * @requires OpenLayers/Format/Filter/v1_1_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFST.v1_1_0
+ * A format for creating WFS v1.1.0 transactions.  Create a new instance with the
+ *     <OpenLayers.Format.WFST.v1_1_0> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.Filter.v1_1_0>
+ *  - <OpenLayers.Format.WFST.v1>
+ */
+OpenLayers.Format.WFST.v1_1_0 = OpenLayers.Class(
+    OpenLayers.Format.Filter.v1_1_0, OpenLayers.Format.WFST.v1, {
+    
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: "1.1.0",
+    
+    /**
+     * Property: schemaLocations
+     * {Object} Properties are namespace aliases, values are schema locations.
+     */
+    schemaLocations: {
+        "wfs": "http://schemas.opengis.net/wfs/1.1.0/wfs.xsd"
+    },
+    
+    /**
+     * Constructor: OpenLayers.Format.WFST.v1_1_0
+     * A class for parsing and generating WFS v1.1.0 transactions.
+     *
+     * To read additional information like hit count (numberOfFeatures) from
+     * the  FeatureCollection, call the <OpenLayers.Format.WFST.v1.read> method
+     * with {output: "object"} as 2nd argument. Note that it is possible to
+     * just request the hit count from a WFS 1.1.0 server with the
+     * resultType="hits" request parameter.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (optional).
+     * featurePrefix - {String} Feature namespace alias (optional - only used
+     *     if featureNS is provided).  Default is 'feature'.
+     * geometryName - {String} Name of geometry attribute.  Default is 'the_geom'.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.Filter.v1_1_0.prototype.initialize.apply(this, [options]);
+        OpenLayers.Format.WFST.v1.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wfs": OpenLayers.Util.applyDefaults({
+            "FeatureCollection": function(node, obj) {
+                obj.numberOfFeatures = parseInt(node.getAttribute(
+                    "numberOfFeatures"));
+                OpenLayers.Format.WFST.v1.prototype.readers["wfs"]["FeatureCollection"].apply(
+                    this, arguments);
+            },
+            "TransactionResponse": function(node, obj) {
+                obj.insertIds = [];
+                obj.success = false;
+                this.readChildNodes(node, obj);
+            },
+            "TransactionSummary": function(node, obj) {
+                // this is a limited test of success
+                obj.success = true;
+            },
+            "InsertResults": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Feature": function(node, container) {
+                var obj = {fids: []};
+                this.readChildNodes(node, obj);
+                container.insertIds.push(obj.fids[0]);
+            }
+        }, OpenLayers.Format.WFST.v1.prototype.readers["wfs"]),
+        "gml": OpenLayers.Format.GML.v3.prototype.readers["gml"],
+        "feature": OpenLayers.Format.GML.v3.prototype.readers["feature"],
+        "ogc": OpenLayers.Format.Filter.v1_1_0.prototype.readers["ogc"]
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "wfs": OpenLayers.Util.applyDefaults({
+            "GetFeature": function(options) {
+                var node = OpenLayers.Format.WFST.v1.prototype.writers["wfs"]["GetFeature"].apply(this, arguments);
+                options && options.resultType && this.setAttributes(node, {
+                    resultType: options.resultType
+                });
+                return node;
+            },
+            "Query": function(options) {
+                options = OpenLayers.Util.extend({
+                    featureNS: this.featureNS,
+                    featurePrefix: this.featurePrefix,
+                    featureType: this.featureType,
+                    srsName: this.srsName
+                }, options);
+                var node = this.createElementNSPlus("wfs:Query", {
+                    attributes: {
+                        typeName: (options.featureNS ? options.featurePrefix + ":" : "") +
+                            options.featureType,
+                        srsName: options.srsName
+                    }
+                });
+                if(options.featureNS) {
+                    node.setAttribute("xmlns:" + options.featurePrefix, options.featureNS);
+                }
+                if(options.propertyNames) {
+                    for(var i=0,len = options.propertyNames.length; i<len; i++) {
+                        this.writeNode(
+                            "wfs:PropertyName", 
+                            {property: options.propertyNames[i]},
+                            node
+                        );
+                    }
+                }
+                if(options.filter) {
+                    this.setFilterProperty(options.filter);
+                    this.writeNode("ogc:Filter", options.filter, node);
+                }
+                return node;
+            },
+            "PropertyName": function(obj) {
+                return this.createElementNSPlus("wfs:PropertyName", {
+                    value: obj.property
+                });
+            }            
+        }, OpenLayers.Format.WFST.v1.prototype.writers["wfs"]),
+        "gml": OpenLayers.Format.GML.v3.prototype.writers["gml"],
+        "feature": OpenLayers.Format.GML.v3.prototype.writers["feature"],
+        "ogc": OpenLayers.Format.Filter.v1_1_0.prototype.writers["ogc"]
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WFST.v1_1_0" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST/v1.js	(revision 76)
@@ -0,0 +1,368 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/WFST.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFST.v1
+ * Superclass for WFST parsers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WFST.v1 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance",
+        wfs: "http://www.opengis.net/wfs",
+        gml: "http://www.opengis.net/gml",
+        ogc: "http://www.opengis.net/ogc"
+    },
+    
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "wfs",
+
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: null,
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocations: null,
+    
+    /**
+     * APIProperty: srsName
+     * {String} URI for spatial reference system.
+     */
+    srsName: null,
+
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract attributes from GML.  Default is true.
+     */
+    extractAttributes: true,
+    
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate true:(x,y) or false:(y,x)
+     * Changing is not recommended, a new Format should be instantiated.
+     */ 
+    xy: true,
+
+    /**
+     * Property: stateName
+     * {Object} Maps feature states to node names.
+     */
+    stateName: null,
+
+    /**
+     * Constructor: OpenLayers.Format.WFST.v1
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.WFST.v1_0_0> or <OpenLayers.Format.WFST.v1_1_0>
+     *     constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        // set state name mapping
+        this.stateName = {};
+        this.stateName[OpenLayers.State.INSERT] = "wfs:Insert";
+        this.stateName[OpenLayers.State.UPDATE] = "wfs:Update";
+        this.stateName[OpenLayers.State.DELETE] = "wfs:Delete";
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: getSrsName
+     */
+    getSrsName: function(feature, options) {
+        var srsName = options && options.srsName;
+        if(!srsName) {
+            if(feature && feature.layer) {
+                srsName = feature.layer.projection.getCode();
+            } else {
+                srsName = this.srsName;
+            }
+        }
+        return srsName;
+    },
+
+    /**
+     * APIMethod: read
+     * Parse the response from a transaction.  Because WFS is split into
+     *     Transaction requests (create, update, and delete) and GetFeature
+     *     requests (read), this method handles parsing of both types of
+     *     responses.
+     *
+     * Parameters:
+     * data - {String | Document} The WFST document to read
+     * options - {Object} Options for the reader
+     *
+     * Valid options properties:
+     * output - {String} either "features" or "object". The default is
+     *     "features", which means that the method will return an array of
+     *     features. If set to "object", an object with a "features" property
+     *     and other properties read by the parser will be returned.
+     *
+     * Returns:
+     * {Array | Object} Output depending on the output option.
+     */
+    read: function(data, options) {
+        options = options || {};
+        OpenLayers.Util.applyDefaults(options, {
+            output: "features"
+        });
+        
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var obj = {};
+        if(data) {
+            this.readNode(data, obj);
+        }
+        if(obj.features && options.output === "features") {
+            obj = obj.features;
+        }
+        return obj;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wfs": {
+            "FeatureCollection": function(node, obj) {
+                obj.features = [];
+                this.readChildNodes(node, obj);
+            }
+        }
+    },
+    
+    /**
+     * Method: write
+     * Given an array of features, write a WFS transaction.  This assumes
+     *     the features have a state property that determines the operation
+     *     type - insert, update, or delete.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} A list of features.
+     *
+     * Returns:
+     * {String} A serialized WFS transaction.
+     */
+    write: function(features) {
+        var node = this.writeNode("wfs:Transaction", features);
+        var value = this.schemaLocationAttr();
+        if(value) {
+            this.setAttributeNS(
+                node, this.namespaces["xsi"], "xsi:schemaLocation",  value
+            )
+        }
+        return OpenLayers.Format.XML.prototype.write.apply(this, [node]);
+    },
+    
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "wfs": {
+            "GetFeature": function(options) {
+                var node = this.createElementNSPlus("wfs:GetFeature", {
+                    attributes: {
+                        service: "WFS",
+                        version: this.version,
+                        outputFormat: options && options.outputFormat,
+                        maxFeatures: options && options.maxFeatures,
+                        "xsi:schemaLocation": this.schemaLocationAttr(options)
+                    }
+                });
+                if (typeof this.featureType == "string") {
+                    this.writeNode("Query", options, node);
+                } else {
+                    for (var i=0,len = this.featureType.length; i<len; i++) { 
+                        options.featureType = this.featureType[i]; 
+                        this.writeNode("Query", options, node); 
+                    } 
+                }
+                return node;
+            },
+            "Transaction": function(features) {
+                var node = this.createElementNSPlus("wfs:Transaction", {
+                    attributes: {
+                        service: "WFS",
+                        version: this.version
+                    }
+                });
+                if(features) {
+                    var name, feature;
+                    for(var i=0, len=features.length; i<len; ++i) {
+                        feature = features[i];
+                        name = this.stateName[feature.state];
+                        if(name) {
+                            this.writeNode(name, feature, node);
+                        }
+                    }
+                }
+                return node;
+            },
+            "Insert": function(feature) {
+                var node = this.createElementNSPlus("wfs:Insert");
+                this.srsName = this.getSrsName(feature);
+                this.writeNode("feature:_typeName", feature, node);
+                return node;
+            },
+            "Update": function(feature) {
+                var node = this.createElementNSPlus("wfs:Update", {
+                    attributes: {
+                        typeName: (this.featureNS ? this.featurePrefix + ":" : "") +
+                            this.featureType
+                    }
+                });
+                if(this.featureNS) {
+                    node.setAttribute("xmlns:" + this.featurePrefix, this.featureNS);
+                }
+                
+                // add in geometry
+                if (this.geometryName !== null) {
+                    this.writeNode(
+                        "Property", {name: this.geometryName, value: feature}, node
+                    );
+                }
+        
+                // add in attributes
+                for(var key in feature.attributes) {
+                    if(feature.attributes[key] !== undefined) {
+                        this.writeNode(
+                            "Property", {name: key, value: feature.attributes[key]}, node
+                        );
+                    }
+                }
+                
+                // add feature id filter
+                this.writeNode("ogc:Filter", new OpenLayers.Filter.FeatureId({
+                    fids: [feature.fid]
+                }), node);
+        
+                return node;
+            },
+            "Property": function(obj) {
+                var node = this.createElementNSPlus("wfs:Property");
+                this.writeNode("Name", obj.name, node);
+                if(obj.value !== null) {
+                    this.writeNode("Value", obj.value, node);
+                }
+                return node;
+            },
+            "Name": function(name) {
+                return this.createElementNSPlus("wfs:Name", {value: name});
+            },
+            "Value": function(obj) {
+                var node;
+                if(obj instanceof OpenLayers.Feature.Vector) {
+                    node = this.createElementNSPlus("wfs:Value");
+                    this.srsName = this.getSrsName(obj);
+                    var geom = this.writeNode("feature:_geometry", obj.geometry).firstChild;
+                    node.appendChild(geom);
+                } else {
+                    node = this.createElementNSPlus("wfs:Value", {value: obj});                
+                }
+                return node;
+            },
+            "Delete": function(feature) {
+                var node = this.createElementNSPlus("wfs:Delete", {
+                    attributes: {
+                        typeName: (this.featureNS ? this.featurePrefix + ":" : "") +
+                            this.featureType
+                    }
+                });
+                if(this.featureNS) {
+                    node.setAttribute("xmlns:" + this.featurePrefix, this.featureNS);
+                }
+                this.writeNode("ogc:Filter", new OpenLayers.Filter.FeatureId({
+                    fids: [feature.fid]
+                }), node);
+                return node;
+            }
+        }
+    },
+
+    /**
+     * Method: schemaLocationAttr
+     * Generate the xsi:schemaLocation attribute value.
+     *
+     * Returns:
+     * {String} The xsi:schemaLocation attribute or undefined if none.
+     */
+    schemaLocationAttr: function(options) {
+        options = OpenLayers.Util.extend({
+            featurePrefix: this.featurePrefix,
+            schema: this.schema
+        }, options);
+        var schemaLocations = OpenLayers.Util.extend({}, this.schemaLocations);
+        if(options.schema) {
+            schemaLocations[options.featurePrefix] = options.schema;
+        }
+        var parts = [];
+        var uri;
+        for(var key in schemaLocations) {
+            uri = this.namespaces[key];
+            if(uri) {
+                parts.push(uri + " " + schemaLocations[key]);
+            }
+        }
+        var value = parts.join(" ") || undefined;
+        return value;
+    },
+    
+    /**
+     * Method: setFilterProperty
+     * Set the property of each spatial filter.
+     *
+     * Parameters:
+     * filter - {<OpenLayers.Filter>}
+     */
+    setFilterProperty: function(filter) {
+        if(filter.filters) {
+            for(var i=0, len=filter.filters.length; i<len; ++i) {
+                this.setFilterProperty(filter.filters[i]);
+            }
+        } else {
+            if(filter instanceof OpenLayers.Filter.Spatial) {
+                // got a spatial filter, set its property
+                filter.property = this.geometryName;
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WFST.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFSCapabilities
+ * Read WFS Capabilities.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WFSCapabilities = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.1.0".
+     */
+    defaultVersion: "1.1.0",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+
+    /**
+     * Constructor: OpenLayers.Format.WFSCapabilities
+     * Create a new parser for WFS capabilities.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return a list of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} List of named layers.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version;
+        if(!version) {
+            version = root.getAttribute("version");
+            if(!version) {
+                version = this.defaultVersion;
+            }
+        }
+        var constr = OpenLayers.Format.WFSCapabilities[
+            "v" + version.replace(/\./g, "_")
+        ];
+        if(!constr) {
+            throw "Can't find a WFS capabilities parser for version " + version;
+        }
+        var parser = new constr(this.options);
+        var capabilities = parser.read(data);
+        capabilities.version = version;
+        return capabilities;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WFSCapabilities" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain/v2_0_2.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain/v2_0_2.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain/v2_0_2.js	(revision 76)
@@ -0,0 +1,243 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/CSWGetDomain.js
+ */
+
+/**
+ * Class: OpenLayers.Format.CSWGetDomain.v2_0_2
+ *     A format for creating CSWGetDomain v2.0.2 transactions. 
+ *     Create a new instance with the
+ *     <OpenLayers.Format.CSWGetDomain.v2_0_2> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.CSWGetDomain.v2_0_2 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance",
+        csw: "http://www.opengis.net/cat/csw/2.0.2"
+    },
+
+    /**
+     * Property: defaultPrefix
+     * {String} The default prefix (used by Format.XML).
+     */
+    defaultPrefix: "csw",
+    
+    /**
+     * Property: version
+     * {String} CSW version number.
+     */
+    version: "2.0.2",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/cat/csw/2.0.2
+     *   http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd
+     */
+    schemaLocation: "http://www.opengis.net/cat/csw/2.0.2 http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd",
+
+    /**
+     * APIProperty: PropertyName
+     * {String} Value of the csw:PropertyName element, used when
+     *     writing a GetDomain document.
+     */
+    PropertyName: null,
+
+    /**
+     * APIProperty: ParameterName
+     * {String} Value of the csw:ParameterName element, used when
+     *     writing a GetDomain document.
+     */
+    ParameterName: null,
+    
+    /**
+     * Constructor: OpenLayers.Format.CSWGetDomain.v2_0_2
+     * A class for parsing and generating CSWGetDomain v2.0.2 transactions.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * - PropertyName
+     * - ParameterName
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Parse the response from a GetDomain request.
+     */
+    read: function(data) {
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var obj = {};
+        this.readNode(data, obj);
+        return obj;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "csw": {
+            "GetDomainResponse": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "DomainValues": function(node, obj) {
+                if (!(obj.DomainValues instanceof Array)) {
+                    obj.DomainValues = [];
+                }
+                var attrs = node.attributes;
+                var domainValue = {};
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    domainValue[attrs[i].name] = attrs[i].nodeValue;
+                }
+                this.readChildNodes(node, domainValue);
+                obj.DomainValues.push(domainValue);
+            },
+            "PropertyName": function(node, obj) {
+                obj.PropertyName = this.getChildValue(node);
+            },
+            "ParameterName": function(node, obj) {
+                obj.ParameterName = this.getChildValue(node);
+            },
+            "ListOfValues": function(node, obj) {
+                if (!(obj.ListOfValues instanceof Array)) {
+                    obj.ListOfValues = [];
+                }
+                this.readChildNodes(node, obj.ListOfValues);
+            },
+            "Value": function(node, obj) {
+                var attrs = node.attributes;
+                var value = {}
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    value[attrs[i].name] = attrs[i].nodeValue;
+                }
+                value.value = this.getChildValue(node);
+                obj.push({Value: value});
+            },
+            "ConceptualScheme": function(node, obj) {
+                obj.ConceptualScheme = {};
+                this.readChildNodes(node, obj.ConceptualScheme);
+            },
+            "Name": function(node, obj) {
+                obj.Name = this.getChildValue(node);
+            },
+            "Document": function(node, obj) {
+                obj.Document = this.getChildValue(node);
+            },
+            "Authority": function(node, obj) {
+                obj.Authority = this.getChildValue(node);
+            },
+            "RangeOfValues": function(node, obj) {
+                obj.RangeOfValues = {};
+                this.readChildNodes(node, obj.RangeOfValues);
+            },
+            "MinValue": function(node, obj) {
+                var attrs = node.attributes;
+                var value = {}
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    value[attrs[i].name] = attrs[i].nodeValue;
+                }
+                value.value = this.getChildValue(node);
+                obj.MinValue = value;
+            },
+            "MaxValue": function(node, obj) {
+                var attrs = node.attributes;
+                var value = {}
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    value[attrs[i].name] = attrs[i].nodeValue;
+                }
+                value.value = this.getChildValue(node);
+                obj.MaxValue = value;
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: write
+     * Given an configuration js object, write a CSWGetDomain request. 
+     *
+     * Parameters:
+     * options - {Object} A object mapping the request.
+     *
+     * Returns:
+     * {String} A serialized CSWGetDomain request.
+     */
+    write: function(options) {
+        var node = this.writeNode("csw:GetDomain", options);
+        return OpenLayers.Format.XML.prototype.write.apply(this, [node]);
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "csw": {
+            "GetDomain": function(options) {
+                var node = this.createElementNSPlus("csw:GetDomain", {
+                    attributes: {
+                        service: "CSW",
+                        version: this.version
+                    }
+                });
+                if (options.PropertyName || this.PropertyName) {
+                    this.writeNode(
+                        "csw:PropertyName",
+                        options.PropertyName || this.PropertyName,
+                        node
+                    );
+                } else if (options.ParameterName || this.ParameterName) {
+                    this.writeNode(
+                        "csw:ParameterName",
+                        options.ParameterName || this.ParameterName,
+                        node
+                    );
+                }
+                this.readChildNodes(node, options);
+                return node;
+            },
+            "PropertyName": function(value) {
+                var node = this.createElementNSPlus("csw:PropertyName", {
+                    value: value
+                });
+                return node;
+            },
+            "ParameterName": function(value) {
+                var node = this.createElementNSPlus("csw:ParameterName", {
+                    value: value
+                });
+                return node;
+            }
+        }
+    },
+   
+    CLASS_NAME: "OpenLayers.Format.CSWGetDomain.v2_0_2" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_0_0.js	(revision 76)
@@ -0,0 +1,169 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/GML/v2.js
+ * @requires OpenLayers/Format/Filter/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Filter.v1_0_0
+ * Write ogc:Filter version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.GML.v2>
+ *  - <OpenLayers.Format.Filter.v1>
+ */
+OpenLayers.Format.Filter.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.GML.v2, OpenLayers.Format.Filter.v1, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.0.0
+     */
+    VERSION: "1.0.0",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/ogc/filter/1.0.0/filter.xsd
+     */
+    schemaLocation: "http://www.opengis.net/ogc/filter/1.0.0/filter.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.Filter.v1_0_0
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.Filter> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.GML.v2.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ogc": OpenLayers.Util.applyDefaults({
+            "PropertyIsEqualTo": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.EQUAL_TO
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsNotEqualTo": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.NOT_EQUAL_TO
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsLike": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.LIKE
+                });
+                this.readChildNodes(node, filter);
+                var wildCard = node.getAttribute("wildCard");
+                var singleChar = node.getAttribute("singleChar");
+                var esc = node.getAttribute("escape");
+                filter.value2regex(wildCard, singleChar, esc);
+                obj.filters.push(filter);
+            }
+        }, OpenLayers.Format.Filter.v1.prototype.readers["ogc"]),
+        "gml": OpenLayers.Format.GML.v2.prototype.readers["gml"],
+        "feature": OpenLayers.Format.GML.v2.prototype.readers["feature"]        
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "ogc": OpenLayers.Util.applyDefaults({
+            "PropertyIsEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsEqualTo");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsNotEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsNotEqualTo");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsLike": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsLike", {
+                    attributes: {
+                        wildCard: "*", singleChar: ".", escape: "!"
+                    }
+                });
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                // convert regex string to ogc string
+                this.writeNode("Literal", filter.regex2value(), node);
+                return node;
+            },
+            "BBOX": function(filter) {
+                var node = this.createElementNSPlus("ogc:BBOX");
+                this.writeNode("PropertyName", filter, node);
+                var box = this.writeNode("gml:Box", filter.value, node);
+                if(filter.projection) {
+                    box.setAttribute("srsName", filter.projection);
+                }
+                return node;
+            }}, OpenLayers.Format.Filter.v1.prototype.writers["ogc"]),
+            
+        "gml": OpenLayers.Format.GML.v2.prototype.writers["gml"],
+        "feature": OpenLayers.Format.GML.v2.prototype.writers["feature"]
+        
+    },
+
+    /**
+     * Method: writeSpatial
+     *
+     * Read a {<OpenLayers.Filter.Spatial>} filter and converts it into XML.
+     *
+     * Parameters:
+     * filter - {<OpenLayers.Filter.Spatial>} The filter.
+     * name - {String} Name of the generated XML element.
+     *
+     * Returns:
+     * {DOMElement} The created XML element.
+     */
+    writeSpatial: function(filter, name) {
+        var node = this.createElementNSPlus("ogc:"+name);
+        this.writeNode("PropertyName", filter, node);
+        var child;
+        if(filter.value instanceof OpenLayers.Geometry) {
+            child = this.writeNode("feature:_geometry", filter.value).firstChild;
+        } else {
+            child = this.writeNode("gml:Box", filter.value);
+        }
+        if(filter.projection) {
+            child.setAttribute("srsName", filter.projection);
+        }
+        node.appendChild(child);
+        return node;
+    },
+
+
+    CLASS_NAME: "OpenLayers.Format.Filter.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1_1_0.js	(revision 76)
@@ -0,0 +1,182 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/Filter/v1.js
+ * @requires OpenLayers/Format/GML/v3.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Filter.v1_1_0
+ * Write ogc:Filter version 1.1.0.
+ *
+ * Differences from the v1.0.0 parser:
+ *  - uses GML v3 instead of GML v2
+ *  - reads matchCase attribute on ogc:PropertyIsEqual and
+ *        ogc:PropertyIsNotEqualelements.
+ *  - writes matchCase attribute from comparison filters of type EQUAL_TO and
+ *        type NOT_EQUAL_TO.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.Filter.v1>
+ */
+OpenLayers.Format.Filter.v1_1_0 = OpenLayers.Class(
+    OpenLayers.Format.GML.v3, OpenLayers.Format.Filter.v1, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.1.0
+     */
+    VERSION: "1.1.0",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/ogc/filter/1.1.0/filter.xsd
+     */
+    schemaLocation: "http://www.opengis.net/ogc/filter/1.1.0/filter.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.Filter.v1_1_0
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.Filter> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.GML.v3.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ogc": OpenLayers.Util.applyDefaults({
+            "PropertyIsEqualTo": function(node, obj) {
+                var matchCase = node.getAttribute("matchCase");
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
+                    matchCase: !(matchCase === "false" || matchCase === "0")
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsNotEqualTo": function(node, obj) {
+                var matchCase = node.getAttribute("matchCase");
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.NOT_EQUAL_TO,
+                    matchCase: !(matchCase === "false" || matchCase === "0")
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsLike": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.LIKE
+                });
+                this.readChildNodes(node, filter);
+                var wildCard = node.getAttribute("wildCard");
+                var singleChar = node.getAttribute("singleChar");
+                var esc = node.getAttribute("escapeChar");
+                filter.value2regex(wildCard, singleChar, esc);
+                obj.filters.push(filter);
+            }
+        }, OpenLayers.Format.Filter.v1.prototype.readers["ogc"]),
+        "gml": OpenLayers.Format.GML.v3.prototype.readers["gml"],
+        "feature": OpenLayers.Format.GML.v3.prototype.readers["feature"]        
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "ogc": OpenLayers.Util.applyDefaults({
+            "PropertyIsEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsEqualTo", {
+                    attributes: {matchCase: filter.matchCase}
+                });
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsNotEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsNotEqualTo", {
+                    attributes: {matchCase: filter.matchCase}
+                });
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsLike": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsLike", {
+                    attributes: {
+                        wildCard: "*", singleChar: ".", escapeChar: "!"
+                    }
+                });
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                // convert regex string to ogc string
+                this.writeNode("Literal", filter.regex2value(), node);
+                return node;
+            },
+            "BBOX": function(filter) {
+                var node = this.createElementNSPlus("ogc:BBOX");
+                this.writeNode("PropertyName", filter, node);
+                var box = this.writeNode("gml:Envelope", filter.value);
+                if(filter.projection) {
+                    box.setAttribute("srsName", filter.projection);
+                }
+                node.appendChild(box); 
+                return node;
+            }}, OpenLayers.Format.Filter.v1.prototype.writers["ogc"]),
+            
+        "gml": OpenLayers.Format.GML.v3.prototype.writers["gml"],
+        "feature": OpenLayers.Format.GML.v3.prototype.writers["feature"]
+    },
+
+    /**
+     * Method: writeSpatial
+     *
+     * Read a {<OpenLayers.Filter.Spatial>} filter and converts it into XML.
+     *
+     * Parameters:
+     * filter - {<OpenLayers.Filter.Spatial>} The filter.
+     * name - {String} Name of the generated XML element.
+     *
+     * Returns:
+     * {DOMElement} The created XML element.
+     */
+    writeSpatial: function(filter, name) {
+        var node = this.createElementNSPlus("ogc:"+name);
+        this.writeNode("PropertyName", filter, node);
+        var child;
+        if(filter.value instanceof OpenLayers.Geometry) {
+            child = this.writeNode("feature:_geometry", filter.value).firstChild;
+        } else {
+            child = this.writeNode("gml:Envelope", filter.value);
+        }
+        if(filter.projection) {
+            child.setAttribute("srsName", filter.projection);
+        }
+        node.appendChild(child);
+        return node;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.Filter.v1_1_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter/v1.js	(revision 76)
@@ -0,0 +1,426 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+/**
+ * @requires OpenLayers/Format/Filter.js
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Filter.v1
+ * Superclass for Filter version 1 parsers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.Filter.v1 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ogc: "http://www.opengis.net/ogc",
+        gml: "http://www.opengis.net/gml",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+    
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "ogc",
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocation: null,
+    
+    /**
+     * Constructor: OpenLayers.Format.Filter.v1
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.Filter> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: read
+     *
+     * Parameters:
+     * data - {DOMElement} A Filter document element.
+     *
+     * Returns:
+     * {<OpenLayers.Filter>} A filter object.
+     */
+    read: function(data) {
+        var obj = {};
+        this.readers.ogc["Filter"].apply(this, [data, obj]);
+        return obj.filter;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ogc": {
+            "Filter": function(node, parent) {
+                // Filters correspond to subclasses of OpenLayers.Filter.
+                // Since they contain information we don't persist, we
+                // create a temporary object and then pass on the filter
+                // (ogc:Filter) to the parent obj.
+                var obj = {
+                    fids: [],
+                    filters: []
+                };
+                this.readChildNodes(node, obj);
+                if(obj.fids.length > 0) {
+                    parent.filter = new OpenLayers.Filter.FeatureId({
+                        fids: obj.fids
+                    });
+                } else if(obj.filters.length > 0) {
+                    parent.filter = obj.filters[0];
+                }
+            },
+            "FeatureId": function(node, obj) {
+                var fid = node.getAttribute("fid");
+                if(fid) {
+                    obj.fids.push(fid);
+                }
+            },
+            "And": function(node, obj) {
+                var filter = new OpenLayers.Filter.Logical({
+                    type: OpenLayers.Filter.Logical.AND
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "Or": function(node, obj) {
+                var filter = new OpenLayers.Filter.Logical({
+                    type: OpenLayers.Filter.Logical.OR
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "Not": function(node, obj) {
+                var filter = new OpenLayers.Filter.Logical({
+                    type: OpenLayers.Filter.Logical.NOT
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsLessThan": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.LESS_THAN
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsGreaterThan": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.GREATER_THAN
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsLessThanOrEqualTo": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsGreaterThanOrEqualTo": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "PropertyIsBetween": function(node, obj) {
+                var filter = new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.BETWEEN
+                });
+                this.readChildNodes(node, filter);
+                obj.filters.push(filter);
+            },
+            "Literal": function(node, obj) {
+                obj.value = OpenLayers.String.numericIf(
+                    this.getChildValue(node));
+            },
+            "PropertyName": function(node, filter) {
+                filter.property = this.getChildValue(node);
+            },
+            "LowerBoundary": function(node, filter) {
+                filter.lowerBoundary = OpenLayers.String.numericIf(
+                    this.readOgcExpression(node));
+            },
+            "UpperBoundary": function(node, filter) {
+                filter.upperBoundary = OpenLayers.String.numericIf(
+                    this.readOgcExpression(node));
+            },
+            "Intersects": function(node, obj) {
+                this.readSpatial(node, obj, OpenLayers.Filter.Spatial.INTERSECTS);
+            },
+            "Within": function(node, obj) {
+                this.readSpatial(node, obj, OpenLayers.Filter.Spatial.WITHIN);
+            },
+            "Contains": function(node, obj) {
+                this.readSpatial(node, obj, OpenLayers.Filter.Spatial.CONTAINS);
+            },
+            "DWithin": function(node, obj) {
+                this.readSpatial(node, obj, OpenLayers.Filter.Spatial.DWITHIN);
+            },
+            "Distance": function(node, obj) {
+                obj.distance = parseInt(this.getChildValue(node));
+                obj.distanceUnits = node.getAttribute("units");
+            }
+        }
+    },
+    
+    /**
+     * Method: readSpatial
+     *
+     * Read a {<OpenLayers.Filter.Spatial>} filter.
+     * 
+     * Parameters:
+     * node - {DOMElement} A DOM element that contains an ogc:expression.
+     * obj - {Object} The target object.
+     * type - {String} One of the OpenLayers.Filter.Spatial.* constants.
+     *
+     * Returns:
+     * {<OpenLayers.Filter.Spatial>} The created filter.
+     */
+    readSpatial: function(node, obj, type) {
+        var filter = new OpenLayers.Filter.Spatial({
+            type: type
+        });
+        this.readChildNodes(node, filter);
+        filter.value = filter.components[0];
+        delete filter.components;
+        obj.filters.push(filter);
+    },
+
+    /**
+     * Method: readOgcExpression
+     * Limited support for OGC expressions.
+     *
+     * Parameters:
+     * node - {DOMElement} A DOM element that contains an ogc:expression.
+     *
+     * Returns:
+     * {String} A value to be used in a symbolizer.
+     */
+    readOgcExpression: function(node) {
+        var obj = {};
+        this.readChildNodes(node, obj);
+        var value = obj.value;
+        if(value === undefined) {
+            value = this.getChildValue(node);
+        }
+        return value;
+    },
+
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * filter - {<OpenLayers.Filter>} A filter object.
+     *
+     * Returns:
+     * {DOMElement} An ogc:Filter element.
+     */
+    write: function(filter) {
+        return this.writers.ogc["Filter"].apply(this, [filter]);
+    },
+    
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "ogc": {
+            "Filter": function(filter) {
+                var node = this.createElementNSPlus("ogc:Filter");
+                var sub = filter.CLASS_NAME.split(".").pop();
+                if(sub == "FeatureId") {
+                    for(var i=0; i<filter.fids.length; ++i) {
+                        this.writeNode("FeatureId", filter.fids[i], node);
+                    }
+                } else {
+                    this.writeNode(this.getFilterType(filter), filter, node);
+                }
+                return node;
+            },
+            "FeatureId": function(fid) {
+                return this.createElementNSPlus("ogc:FeatureId", {
+                    attributes: {fid: fid}
+                });
+            },
+            "And": function(filter) {
+                var node = this.createElementNSPlus("ogc:And");
+                var childFilter;
+                for(var i=0; i<filter.filters.length; ++i) {
+                    childFilter = filter.filters[i];
+                    this.writeNode(
+                        this.getFilterType(childFilter), childFilter, node
+                    );
+                }
+                return node;
+            },
+            "Or": function(filter) {
+                var node = this.createElementNSPlus("ogc:Or");
+                var childFilter;
+                for(var i=0; i<filter.filters.length; ++i) {
+                    childFilter = filter.filters[i];
+                    this.writeNode(
+                        this.getFilterType(childFilter), childFilter, node
+                    );
+                }
+                return node;
+            },
+            "Not": function(filter) {
+                var node = this.createElementNSPlus("ogc:Not");
+                var childFilter = filter.filters[0];
+                this.writeNode(
+                    this.getFilterType(childFilter), childFilter, node
+                );
+                return node;
+            },
+            "PropertyIsLessThan": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsLessThan");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);                
+                return node;
+            },
+            "PropertyIsGreaterThan": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsGreaterThan");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsLessThanOrEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsLessThanOrEqualTo");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsGreaterThanOrEqualTo": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsGreaterThanOrEqualTo");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("Literal", filter.value, node);
+                return node;
+            },
+            "PropertyIsBetween": function(filter) {
+                var node = this.createElementNSPlus("ogc:PropertyIsBetween");
+                // no ogc:expression handling for now
+                this.writeNode("PropertyName", filter, node);
+                this.writeNode("LowerBoundary", filter, node);
+                this.writeNode("UpperBoundary", filter, node);
+                return node;
+            },
+            "PropertyName": function(filter) {
+                // no ogc:expression handling for now
+                return this.createElementNSPlus("ogc:PropertyName", {
+                    value: filter.property
+                });
+            },
+            "Literal": function(value) {
+                // no ogc:expression handling for now
+                return this.createElementNSPlus("ogc:Literal", {
+                    value: value
+                });
+            },
+            "LowerBoundary": function(filter) {
+                // no ogc:expression handling for now
+                var node = this.createElementNSPlus("ogc:LowerBoundary");
+                this.writeNode("Literal", filter.lowerBoundary, node);
+                return node;
+            },
+            "UpperBoundary": function(filter) {
+                // no ogc:expression handling for now
+                var node = this.createElementNSPlus("ogc:UpperBoundary");
+                this.writeNode("Literal", filter.upperBoundary, node);
+                return node;
+            },
+            "INTERSECTS": function(filter) {
+                return this.writeSpatial(filter, "Intersects");
+            },
+            "WITHIN": function(filter) {
+                return this.writeSpatial(filter, "Within");
+            },
+            "CONTAINS": function(filter) {
+                return this.writeSpatial(filter, "Contains");
+            },
+            "DWITHIN": function(filter) {
+                var node = this.writeSpatial(filter, "DWithin");
+                this.writeNode("Distance", filter, node);
+                return node;
+            },
+            "Distance": function(filter) {
+                return this.createElementNSPlus("ogc:Distance", {
+                    attributes: {
+                        units: filter.distanceUnits
+                    },
+                    value: filter.distance
+                });
+            }
+        }
+    },
+
+    /**
+     * Method: getFilterType
+     */
+    getFilterType: function(filter) {
+        var filterType = this.filterMap[filter.type];
+        if(!filterType) {
+            throw "Filter writing not supported for rule type: " + filter.type;
+        }
+        return filterType;
+    },
+    
+    /**
+     * Property: filterMap
+     * {Object} Contains a member for each filter type.  Values are node names
+     *     for corresponding OGC Filter child elements.
+     */
+    filterMap: {
+        "&&": "And",
+        "||": "Or",
+        "!": "Not",
+        "==": "PropertyIsEqualTo",
+        "!=": "PropertyIsNotEqualTo",
+        "<": "PropertyIsLessThan",
+        ">": "PropertyIsGreaterThan",
+        "<=": "PropertyIsLessThanOrEqualTo",
+        ">=": "PropertyIsGreaterThanOrEqualTo",
+        "..": "PropertyIsBetween",
+        "~": "PropertyIsLike",
+        "BBOX": "BBOX",
+        "DWITHIN": "DWITHIN",
+        "WITHIN": "WITHIN",
+        "CONTAINS": "CONTAINS",
+        "INTERSECTS": "INTERSECTS"
+    },
+
+    CLASS_NAME: "OpenLayers.Format.Filter.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_0_0.js	(revision 76)
@@ -0,0 +1,76 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMC/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMC.v1_0_0
+ * Read and write WMC version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMC.v1>
+ */
+OpenLayers.Format.WMC.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.WMC.v1, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.0.0
+     */
+    VERSION: "1.0.0",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/context
+     *     http://schemas.opengis.net/context/1.0.0/context.xsd
+     */
+    schemaLocation: "http://www.opengis.net/context http://schemas.opengis.net/context/1.0.0/context.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.WMC.v1_0_0
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.WMC> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WMC.v1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Method: write_wmc_Layer
+     * Create a Layer node given a layer context object. This method adds
+     *     elements specific to version 1.0.0.
+     *
+     * Parameters:
+     * context - {Object} A layer context object.}
+     *
+     * Returns:
+     * {Element} A WMC Layer element node.
+     */
+    write_wmc_Layer: function(context) {
+        var node = OpenLayers.Format.WMC.v1.prototype.write_wmc_Layer.apply(
+            this, [context]
+        );
+    
+        // optional FormatList element
+        node.appendChild(this.write_wmc_FormatList(context));
+
+        // optional StyleList element
+        node.appendChild(this.write_wmc_StyleList(context));
+        
+        // OpenLayers specific properties go in an Extension element
+        node.appendChild(this.write_wmc_LayerExtension(context));
+    },    
+
+    CLASS_NAME: "OpenLayers.Format.WMC.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1_1_0.js	(revision 76)
@@ -0,0 +1,127 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMC/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMC.v1_1_0
+ * Read and write WMC version 1.1.0.
+ *
+ * Differences between 1.1.0 and 1.0.0:
+ *     - 1.1.0 Layers have optional sld:MinScaleDenominator and
+ *       sld:MaxScaleDenominator
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMC.v1>
+ */
+OpenLayers.Format.WMC.v1_1_0 = OpenLayers.Class(
+    OpenLayers.Format.WMC.v1, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.1.0
+     */
+    VERSION: "1.1.0",
+
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/context
+     *     http://schemas.opengis.net/context/1.1.0/context.xsd
+     */
+    schemaLocation: "http://www.opengis.net/context http://schemas.opengis.net/context/1.1.0/context.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.WMC.v1_1_0
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.WMC> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WMC.v1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Method: read_sld_MinScaleDenominator
+     * Read a sld:MinScaleDenominator node.
+     *
+     * Parameters:
+     * layerContext - {Object} An object representing a layer.
+     * node - {Element} An element node.
+     */
+    read_sld_MinScaleDenominator: function(layerContext, node) {
+        var minScaleDenominator = parseFloat(this.getChildValue(node));
+        if (minScaleDenominator > 0) {
+            layerContext.maxScale = minScaleDenominator;
+        }
+    },
+
+    /**
+     * Method: read_sld_MaxScaleDenominator
+     * Read a sld:MaxScaleDenominator node.
+     *
+     * Parameters:
+     * layerContext - {Object} An object representing a layer.
+     * node - {Element} An element node.
+     */
+    read_sld_MaxScaleDenominator: function(layerContext, node) {
+        layerContext.minScale = parseFloat(this.getChildValue(node));
+    },
+
+    /**
+     * Method: write_wmc_Layer
+     * Create a Layer node given a layer context object. This method adds
+     *     elements specific to version 1.1.0.
+     *
+     * Parameters:
+     * context - {Object} A layer context object.}
+     *
+     * Returns:
+     * {Element} A WMC Layer element node.
+     */
+    write_wmc_Layer: function(context) {
+        var node = OpenLayers.Format.WMC.v1.prototype.write_wmc_Layer.apply(
+            this, [context]
+        );
+        
+        // min/max scale denominator elements go before the 4th element in v1
+        if(context.maxScale) {
+            var minSD = this.createElementNS(
+                this.namespaces.sld, "sld:MinScaleDenominator"
+            );
+            minSD.appendChild(this.createTextNode(context.maxScale.toPrecision(16)));
+            node.appendChild(minSD);
+        }
+        
+        if(context.minScale) {
+            var maxSD = this.createElementNS(
+                this.namespaces.sld, "sld:MaxScaleDenominator"
+            );
+            maxSD.appendChild(this.createTextNode(context.minScale.toPrecision(16)));
+            node.appendChild(maxSD);
+        }
+
+        // optional FormatList element
+        node.appendChild(this.write_wmc_FormatList(context));
+
+        // optional StyleList element
+        node.appendChild(this.write_wmc_StyleList(context));
+        
+        // OpenLayers specific properties go in an Extension element
+        node.appendChild(this.write_wmc_LayerExtension(context));
+        
+        return node;
+        
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMC.v1_1_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC/v1.js	(revision 76)
@@ -0,0 +1,835 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMC.js
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMC.v1
+ * Superclass for WMC version 1 parsers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMC.v1 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ol: "http://openlayers.org/context",
+        wmc: "http://www.opengis.net/context",
+        sld: "http://www.opengis.net/sld",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+    
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocation: "",
+
+    /**
+     * Method: getNamespacePrefix
+     * Get the namespace prefix for a given uri from the <namespaces> object.
+     *
+     * Returns:
+     * {String} A namespace prefix or null if none found.
+     */
+    getNamespacePrefix: function(uri) {
+        var prefix = null;
+        if(uri == null) {
+            prefix = this.namespaces[this.defaultPrefix];
+        } else {
+            for(prefix in this.namespaces) {
+                if(this.namespaces[prefix] == uri) {
+                    break;
+                }
+            }
+        }
+        return prefix;
+    },
+    
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "wmc",
+
+    /**
+     * Property: rootPrefix
+     * {String} Prefix on the root node that maps to the context namespace URI.
+     */
+    rootPrefix: null,
+    
+    /**
+     * Property: defaultStyleName
+     * {String} Style name used if layer has no style param.  Default is "".
+     */
+    defaultStyleName: "",
+    
+    /**
+     * Property: defaultStyleTitle
+     * {String} Default style title.  Default is "Default".
+     */
+    defaultStyleTitle: "Default",
+    
+    /**
+     * Constructor: OpenLayers.Format.WMC.v1
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.WMC> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * Method: read
+     * Read capabilities data from a string, and return a list of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} List of named layers.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        this.rootPrefix = root.prefix;
+        var context = {
+            version: root.getAttribute("version")
+        };
+        this.runChildNodes(context, root);
+        return context;
+    },
+    
+    /**
+     * Method: runChildNodes
+     */
+    runChildNodes: function(obj, node) {
+        var children = node.childNodes;
+        var childNode, processor, prefix, local;
+        for(var i=0, len=children.length; i<len; ++i) {
+            childNode = children[i];
+            if(childNode.nodeType == 1) {
+                prefix = this.getNamespacePrefix(childNode.namespaceURI);
+                local = childNode.nodeName.split(":").pop();
+                processor = this["read_" + prefix + "_" + local];
+                if(processor) {
+                    processor.apply(this, [obj, childNode]);
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: read_wmc_General
+     */
+    read_wmc_General: function(context, node) {
+        this.runChildNodes(context, node);
+    },
+    
+    /**
+     * Method: read_wmc_BoundingBox
+     */
+    read_wmc_BoundingBox: function(context, node) {
+        context.projection = node.getAttribute("SRS");
+        context.bounds = new OpenLayers.Bounds(
+            parseFloat(node.getAttribute("minx")),
+            parseFloat(node.getAttribute("miny")),
+            parseFloat(node.getAttribute("maxx")),
+            parseFloat(node.getAttribute("maxy"))
+        );
+    },
+    
+    /**
+     * Method: read_wmc_LayerList
+     */
+    read_wmc_LayerList: function(context, node) {
+        // layersContext is an array containing info for each layer
+        context.layersContext = [];
+        this.runChildNodes(context, node);
+    },
+    
+    /**
+     * Method: read_wmc_Layer
+     */
+    read_wmc_Layer: function(context, node) {
+        var layerContext = {
+            visibility: (node.getAttribute("hidden") != "1"),
+            queryable: (node.getAttribute("queryable") == "1"),
+            formats: [],
+            styles: []
+        };
+
+        this.runChildNodes(layerContext, node);
+        // set properties common to multiple objects on layer options/params
+        context.layersContext.push(layerContext);
+    },
+    
+    /**
+     * Method: read_wmc_Extension
+     */
+    read_wmc_Extension: function(obj, node) {
+        this.runChildNodes(obj, node);
+    },
+
+    /**
+     * Method: read_ol_units
+     */
+    read_ol_units: function(layerContext, node) {
+        layerContext.units = this.getChildValue(node);
+    },
+    
+    /**
+     * Method: read_ol_maxExtent
+     */
+    read_ol_maxExtent: function(obj, node) {
+        var bounds = new OpenLayers.Bounds(
+            node.getAttribute("minx"), node.getAttribute("miny"),
+            node.getAttribute("maxx"), node.getAttribute("maxy")
+        );
+        obj.maxExtent = bounds;
+    },
+    
+    /**
+     * Method: read_ol_transparent
+     */
+    read_ol_transparent: function(layerContext, node) {
+        layerContext.transparent = this.getChildValue(node);
+    },
+
+    /**
+     * Method: read_ol_numZoomLevels
+     */
+    read_ol_numZoomLevels: function(layerContext, node) {
+        layerContext.numZoomLevels = parseInt(this.getChildValue(node));
+    },
+
+    /**
+     * Method: read_ol_opacity
+     */
+    read_ol_opacity: function(layerContext, node) {
+        layerContext.opacity = parseFloat(this.getChildValue(node));
+    },
+
+    /**
+     * Method: read_ol_singleTile
+     */
+    read_ol_singleTile: function(layerContext, node) {
+        layerContext.singleTile = (this.getChildValue(node) == "true");
+    },
+
+    /**
+     * Method: read_ol_tileSize
+     */
+    read_ol_tileSize: function(layerContext, node) {
+        var obj = {"width": node.getAttribute("width"), "height": node.getAttribute("height")};
+        layerContext.tileSize = obj;
+    },
+    
+    /**
+     * Method: read_ol_isBaseLayer
+     */
+    read_ol_isBaseLayer: function(layerContext, node) {
+        layerContext.isBaseLayer = (this.getChildValue(node) == "true");
+    },
+
+    /**
+     * Method: read_ol_displayInLayerSwitcher
+     */
+    read_ol_displayInLayerSwitcher: function(layerContext, node) {
+        layerContext.displayInLayerSwitcher = (this.getChildValue(node) == "true");
+    },
+
+    /**
+     * Method: read_wmc_Server
+     */
+    read_wmc_Server: function(layerContext, node) {
+        layerContext.version = node.getAttribute("version");
+        var server = {};
+        var links = node.getElementsByTagName("OnlineResource");
+        if(links.length > 0) {
+            this.read_wmc_OnlineResource(server, links[0]);
+        }
+        layerContext.url = server.href;
+    },
+
+    /**
+     * Method: read_wmc_FormatList
+     */
+    read_wmc_FormatList: function(layerContext, node) {
+        this.runChildNodes(layerContext, node);
+    },
+
+    /**
+     * Method: read_wmc_Format
+     */
+    read_wmc_Format: function(layerContext, node) {
+        var format = {
+            value: this.getChildValue(node)
+        };
+        if(node.getAttribute("current") == "1") {
+            format.current = true;
+        }
+        layerContext.formats.push(format);
+    },
+    
+    /**
+     * Method: read_wmc_StyleList
+     */
+    read_wmc_StyleList: function(layerContext, node) {
+        this.runChildNodes(layerContext, node);
+    },
+
+    /**
+     * Method: read_wmc_Style
+     */
+    read_wmc_Style: function(layerContext, node) {
+        var style = {};
+        this.runChildNodes(style, node);
+        if(node.getAttribute("current") == "1") {
+            style.current = true;
+        }
+        layerContext.styles.push(style);
+    },
+    
+    /**
+     * Method: read_wmc_SLD
+     */
+    read_wmc_SLD: function(style, node) {
+        this.runChildNodes(style, node);
+        // style either comes back with an href or a body property
+    },
+    
+    /**
+     * Method: read_sld_StyledLayerDescriptor
+     */
+    read_sld_StyledLayerDescriptor: function(sld, node) {
+        var xml = OpenLayers.Format.XML.prototype.write.apply(this, [node]);
+        sld.body = xml;
+    },
+
+    /**
+     * Method: read_wmc_OnlineResource
+     */
+    read_wmc_OnlineResource: function(obj, node) {
+        obj.href = this.getAttributeNS(
+            node, this.namespaces.xlink, "href"
+        );
+    },
+    
+    /**
+     * Method: read_wmc_Name
+     */
+    read_wmc_Name: function(obj, node) {
+        var name = this.getChildValue(node);
+        if(name) {
+            obj.name = name;
+        }
+    },
+
+    /**
+     * Method: read_wmc_Title
+     */
+    read_wmc_Title: function(obj, node) {
+        var title = this.getChildValue(node);
+        if(title) {
+            obj.title = title;
+        }
+    },
+
+    /**
+     * Method: read_wmc_MetadataURL
+     */
+    read_wmc_MetadataURL: function(layerContext, node) {
+        var metadataURL = {};
+        var links = node.getElementsByTagName("OnlineResource");
+        if(links.length > 0) {
+            this.read_wmc_OnlineResource(metadataURL, links[0]);
+        }
+        layerContext.metadataURL = metadataURL.href;
+
+    },
+
+    /**
+     * Method: read_wmc_Abstract
+     */
+    read_wmc_Abstract: function(obj, node) {
+        var abst = this.getChildValue(node);
+        if(abst) {
+            obj["abstract"] = abst;
+        }
+    },
+    
+    /**
+     * Method: read_wmc_LegendURL
+     */
+    read_wmc_LegendURL: function(style, node) {
+        var legend = {
+            width: node.getAttribute('width'),
+            height: node.getAttribute('height')
+        };
+        var links = node.getElementsByTagName("OnlineResource");
+        if(links.length > 0) {
+            this.read_wmc_OnlineResource(legend, links[0]);
+        }
+        style.legend = legend;
+    },
+    
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * context - {Object} An object representing the map context.
+     * options - {Object} Optional object.
+     *
+     * Returns:
+     * {String} A WMC document string.
+     */
+    write: function(context, options) {
+        var root = this.createElementDefaultNS("ViewContext");
+        this.setAttributes(root, {
+            version: this.VERSION,
+            id: (options && typeof options.id == "string") ?
+                    options.id :
+                    OpenLayers.Util.createUniqueID("OpenLayers_Context_")
+        });
+        
+        // add schemaLocation attribute
+        this.setAttributeNS(
+            root, this.namespaces.xsi,
+            "xsi:schemaLocation", this.schemaLocation
+        );
+        
+        // required General element
+        root.appendChild(this.write_wmc_General(context));
+
+        // required LayerList element
+        root.appendChild(this.write_wmc_LayerList(context));
+
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+    
+    /**
+     * Method: createElementDefaultNS
+     * Shorthand for createElementNS with namespace from <defaultPrefix>.
+     *     Can optionally be used to set attributes and a text child value.
+     *
+     * Parameters:
+     * name - {String} The qualified node name.
+     * childValue - {String} Optional value for text child node.
+     * attributes - {Object} Optional object representing attributes.
+     *
+     * Returns:
+     * {Element} An element node.
+     */
+    createElementDefaultNS: function(name, childValue, attributes) {
+        var node = this.createElementNS(
+            this.namespaces[this.defaultPrefix],
+            name
+        );
+        if(childValue) {
+            node.appendChild(this.createTextNode(childValue));
+        }
+        if(attributes) {
+            this.setAttributes(node, attributes);
+        }
+        return node;
+    },
+    
+    /**
+     * Method: setAttributes
+     * Set multiple attributes given key value pairs from an object.
+     *
+     * Parameters:
+     * node - {Element} An element node.
+     * obj - {Object} An object whose properties represent attribute names and
+     *     values represent attribute values.
+     */
+    setAttributes: function(node, obj) {
+        var value;
+        for(var name in obj) {
+            value = obj[name].toString();
+            if(value.match(/[A-Z]/)) {
+                // safari lowercases attributes with setAttribute
+                this.setAttributeNS(node, null, name, value);
+            } else {
+                node.setAttribute(name, value);
+            }
+        }
+    },
+
+    /**
+     * Method: write_wmc_General
+     * Create a General node given an context object.
+     *
+     * Parameters:
+     * context - {Object} Context object.
+     *
+     * Returns:
+     * {Element} A WMC General element node.
+     */
+    write_wmc_General: function(context) {
+        var node = this.createElementDefaultNS("General");
+
+        // optional Window element
+        if(context.size) {
+            node.appendChild(this.createElementDefaultNS(
+                "Window", null,
+                {
+                    width: context.size.w,
+                    height: context.size.h
+                }
+            ));
+        }
+        
+        // required BoundingBox element
+        var bounds = context.bounds;
+        node.appendChild(this.createElementDefaultNS(
+            "BoundingBox", null,
+            {
+                minx: bounds.left.toPrecision(18),
+                miny: bounds.bottom.toPrecision(18),
+                maxx: bounds.right.toPrecision(18),
+                maxy: bounds.top.toPrecision(18),
+                SRS: context.projection
+            }
+        ));
+
+        // required Title element
+        node.appendChild(this.createElementDefaultNS(
+            "Title", context.title
+        ));
+        
+        // OpenLayers specific map properties
+        node.appendChild(this.write_ol_MapExtension(context));
+        
+        return node;
+    },
+    
+    /**
+     * Method: write_ol_MapExtension
+     */
+    write_ol_MapExtension: function(context) {
+        var node = this.createElementDefaultNS("Extension");
+        
+        var bounds = context.maxExtent;
+        if(bounds) {
+            var maxExtent = this.createElementNS(
+                this.namespaces.ol, "ol:maxExtent"
+            );
+            this.setAttributes(maxExtent, {
+                minx: bounds.left.toPrecision(18),
+                miny: bounds.bottom.toPrecision(18),
+                maxx: bounds.right.toPrecision(18),
+                maxy: bounds.top.toPrecision(18)
+            });
+            node.appendChild(maxExtent);
+        }
+        
+        return node;
+    },
+    
+    /**
+     * Method: write_wmc_LayerList
+     * Create a LayerList node given an context object.
+     *
+     * Parameters:
+     * context - {Object} Context object.
+     *
+     * Returns:
+     * {Element} A WMC LayerList element node.
+     */
+    write_wmc_LayerList: function(context) {
+        var list = this.createElementDefaultNS("LayerList");
+        
+        for(var i=0, len=context.layersContext.length; i<len; ++i) {
+            list.appendChild(this.write_wmc_Layer(context.layersContext[i]));
+        }
+        
+        return list;
+    },
+
+    /**
+     * Method: write_wmc_Layer
+     * Create a Layer node given a layer context object.
+     *
+     * Parameters:
+     * context - {Object} A layer context object.}
+     *
+     * Returns:
+     * {Element} A WMC Layer element node.
+     */
+    write_wmc_Layer: function(context) {
+        var node = this.createElementDefaultNS(
+            "Layer", null, {
+                queryable: context.queryable ? "1" : "0",
+                hidden: context.visibility ? "0" : "1"
+            }
+        );
+        
+        // required Server element
+        node.appendChild(this.write_wmc_Server(context));
+
+        // required Name element
+        node.appendChild(this.createElementDefaultNS(
+            "Name", context.name
+        ));
+        
+        // required Title element
+        node.appendChild(this.createElementDefaultNS(
+            "Title", context.title
+        ));
+
+        // optional MetadataURL element
+        if (context.metadataURL) {
+            node.appendChild(this.write_wmc_MetadataURL(context.metadataURL));
+        }
+        
+        return node;
+    },
+    
+    /**
+     * Method: write_wmc_LayerExtension
+     * Add OpenLayers specific layer parameters to an Extension element.
+     *
+     * Parameters:
+     * context - {Object} A layer context object.
+     *
+     * Returns:
+     * {Element} A WMC Extension element (for a layer).
+     */
+    write_wmc_LayerExtension: function(context) {
+        var node = this.createElementDefaultNS("Extension");
+        
+        var bounds = context.maxExtent;
+        var maxExtent = this.createElementNS(
+            this.namespaces.ol, "ol:maxExtent"
+        );
+        this.setAttributes(maxExtent, {
+            minx: bounds.left.toPrecision(18),
+            miny: bounds.bottom.toPrecision(18),
+            maxx: bounds.right.toPrecision(18),
+            maxy: bounds.top.toPrecision(18)
+        });
+        node.appendChild(maxExtent);
+        
+        if (context.tileSize && !context.singleTile) {
+            var size = this.createElementNS(
+                this.namespaces.ol, "ol:tileSize"
+            );
+            this.setAttributes(size, context.tileSize);
+            node.appendChild(size);
+        }
+        
+        var properties = [
+            "transparent", "numZoomLevels", "units", "isBaseLayer",
+            "opacity", "displayInLayerSwitcher", "singleTile"
+        ];
+        var child;
+        for(var i=0, len=properties.length; i<len; ++i) {
+            child = this.createOLPropertyNode(context, properties[i]);
+            if(child) {
+                node.appendChild(child);
+            }
+        }
+
+        return node;
+    },
+    
+    /**
+     * Method: createOLPropertyNode
+     * Create a node representing an OpenLayers property.  If the property is
+     *     null or undefined, null will be returned.
+     *
+     * Parameters:
+     * object - {Object} An object.
+     * prop - {String} A property.
+     *
+     * Returns:
+     * {Element} A property node.
+     */
+    createOLPropertyNode: function(obj, prop) {
+        var node = null;
+        if(obj[prop] != null) {
+            node = this.createElementNS(this.namespaces.ol, "ol:" + prop);
+            node.appendChild(this.createTextNode(obj[prop].toString()));
+        }
+        return node;
+    },
+
+    /**
+     * Method: write_wmc_Server
+     * Create a Server node given a layer context object.
+     *
+     * Parameters:
+     * context - {Object} Layer context object.
+     *
+     * Returns:
+     * {Element} A WMC Server element node.
+     */
+    write_wmc_Server: function(context) {
+        var node = this.createElementDefaultNS("Server");
+        this.setAttributes(node, {
+            service: "OGC:WMS",
+            version: context.version
+        });
+        
+        // required OnlineResource element
+        node.appendChild(this.write_wmc_OnlineResource(context.url));
+        
+        return node;
+    },
+
+    /**
+     * Method: write_wmc_MetadataURL
+     * Create a MetadataURL node given a metadataURL string.
+     *
+     * Parameters:
+     * metadataURL - {String} MetadataURL string value.
+     *
+     * Returns:
+     * {Element} A WMC metadataURL element node.
+     */
+    write_wmc_MetadataURL: function(metadataURL) {
+        var node = this.createElementDefaultNS("MetadataURL");
+
+        // required OnlineResource element
+        node.appendChild(this.write_wmc_OnlineResource(metadataURL));
+
+        return node;
+    },
+
+    /**
+     * Method: write_wmc_FormatList
+     * Create a FormatList node given a layer context.
+     *
+     * Parameters:
+     * context - {Object} Layer context object.
+     *
+     * Returns:
+     * {Element} A WMC FormatList element node.
+     */
+    write_wmc_FormatList: function(context) {
+        var node = this.createElementDefaultNS("FormatList");
+        for (var i=0, len=context.formats.length; i<len; i++) {
+            var format = context.formats[i];
+            node.appendChild(this.createElementDefaultNS(
+                "Format",
+                format.value,
+                (format.current && format.current == true) ?
+                    {current: "1"} : null
+            ));
+        }
+
+        return node;
+    },
+
+    /**
+     * Method: write_wmc_StyleList
+     * Create a StyleList node given a layer context.
+     *
+     * Parameters:
+     * context - {Object} Layer context object.
+     *
+     * Returns:
+     * {Element} A WMC StyleList element node.
+     */
+    write_wmc_StyleList: function(layer) {
+        var node = this.createElementDefaultNS("StyleList");
+
+        var styles = layer.styles;
+        if (styles && styles instanceof Array) {
+            var sld;
+            for (var i=0, len=styles.length; i<len; i++) {
+                var s = styles[i];
+                // three style types to consider
+                // [1] linked SLD
+                // [2] inline SLD
+                // [3] named style
+                // running child nodes always gets name, optionally gets href or body
+                var style = this.createElementDefaultNS(
+                    "Style",
+                    null,
+                    (s.current && s.current == true) ?
+                    {current: "1"} : null
+                );
+                if(s.href) { // [1]
+                    sld = this.createElementDefaultNS("SLD");
+                    var link = this.write_wmc_OnlineResource(s.href);
+                    sld.appendChild(link);
+                    // Name is required.
+                    sld.appendChild(this.createElementDefaultNS("Name", s.name));
+                    // Title is optional.
+                    if (s.title) {
+                        sld.appendChild(this.createElementDefaultNS("Title", s.title));
+                    }
+                    style.appendChild(sld);
+                } else if(s.body) { // [2]
+                    sld = this.createElementDefaultNS("SLD");
+                    // read in body as xml doc - assume proper namespace declarations
+                    var doc = OpenLayers.Format.XML.prototype.read.apply(this, [s.body]);
+                    // append to StyledLayerDescriptor node
+                    var imported = doc.documentElement;
+                    if(sld.ownerDocument && sld.ownerDocument.importNode) {
+                        imported = sld.ownerDocument.importNode(imported, true);
+                    }
+                    sld.appendChild(imported);
+                    // Name is required.
+                    sld.appendChild(this.createElementDefaultNS("Name", s.name));
+                    // Title is optional.
+                    if (s.title) {
+                        sld.appendChild(this.createElementDefaultNS("Title", s.title));
+                    }
+                    style.appendChild(sld);            
+                } else { // [3]
+                    // both Name and Title are required.
+                    style.appendChild(this.createElementDefaultNS("Name", s.name));
+                    style.appendChild(this.createElementDefaultNS("Title", s.title));
+                    // Abstract is optional
+                    if (s['abstract']) { // abstract is a js keyword
+                        style.appendChild(this.createElementDefaultNS(
+                            "Abstract", s['abstract']
+                        ));
+                    }
+                }
+                node.appendChild(style);
+            }
+        }
+
+        return node;
+    },
+
+    /**
+     * Method: write_wmc_OnlineResource
+     * Create an OnlineResource node given a URL.
+     *
+     * Parameters:
+     * href - {String} URL for the resource.
+     *
+     * Returns:
+     * {Element} A WMC OnlineResource element node.
+     */
+    write_wmc_OnlineResource: function(href) {
+        var node = this.createElementDefaultNS("OnlineResource");
+        this.setAttributeNS(node, this.namespaces.xlink, "xlink:type", "simple");
+        this.setAttributeNS(node, this.namespaces.xlink, "xlink:href", href);
+        return node;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMC.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext.js	(revision 76)
@@ -0,0 +1,81 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/Context.js
+ */
+
+/**
+ * Class: OpenLayers.Format.OWSContext
+ * Read and write OWS Context documents. OWS Context documents are a 
+ * preliminary OGC (Open Geospatial Consortium) standard for storing the 
+ * state of a web mapping application. In a way it is the successor to
+ * Web Map Context (WMC), since it is more generic and more types of layers
+ * can be stored. Also, nesting of layers is supported since version 0.3.1.
+ * For more information see: http://www.ogcnetwork.net/context
+ */
+OpenLayers.Format.OWSContext = OpenLayers.Class(OpenLayers.Format.Context,{
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "0.3.1".
+     */
+    defaultVersion: "0.3.1",
+    
+    /**
+     * Method: getParser
+     * Get the OWSContext parser given a version. Create a new parser if it does not
+     * already exist.
+     *
+     * Parameters:
+     * version - {String} The version of the parser.
+     *
+     * Returns:
+     * {<OpenLayers.Format.OWSContext>} An OWSContext parser.
+     */
+    getParser: function(version) {
+        var v = version || this.version || this.defaultVersion;
+        // 0.3.1 is backwards compatible with 0.3.0
+        if (v === "0.3.0") {
+            v = this.defaultVersion;
+        }
+        if(!this.parser || this.parser.VERSION != v) {
+            var format = OpenLayers.Format.OWSContext[
+                "v" + v.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a OWSContext parser for version " + v;
+            }
+            this.parser = new format(this.options);
+        }
+        return this.parser;
+    },
+
+    /**
+     * Method: toContext
+     * Create a context object free from layer given a map or a
+     * context object.
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Map> | Object} The map or context.
+     *
+     * Returns:
+     * {Object} A context object.
+     */
+    toContext: function(obj) {
+        var context = {};
+        if(obj.CLASS_NAME == "OpenLayers.Map") {
+            context.bounds = obj.getExtent();
+            context.maxExtent = obj.maxExtent;
+            context.projection = obj.projection;
+            context.size = obj.getSize();
+            context.layers = obj.layers;
+        }
+        return context;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.OWSContext" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSDescribeFeatureType.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSDescribeFeatureType.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSDescribeFeatureType.js	(revision 76)
@@ -0,0 +1,198 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ *
+ * Class: OpenLayers.Format.WFSDescribeFeatureType
+ * Read WFS DescribeFeatureType response
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WFSDescribeFeatureType = OpenLayers.Class(
+    OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        xsd: "http://www.w3.org/2001/XMLSchema"
+    },
+    
+    /**
+     * Constructor: OpenLayers.Format.WFSDescribeFeatureType
+     * Create a new parser for WFS DescribeFeatureType responses.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "xsd": {
+            "schema": function(node, obj) {
+                var complexTypes = [];
+                var customTypes = {};
+                var schema = {
+                    complexTypes: complexTypes,
+                    customTypes: customTypes
+                };
+                
+                this.readChildNodes(node, schema);
+
+                var attributes = node.attributes;
+                var attr, name;
+                for(var i=0, len=attributes.length; i<len; ++i) {
+                    attr = attributes[i];
+                    name = attr.name;
+                    if(name.indexOf("xmlns") == 0) {
+                        this.setNamespace(name.split(":")[1] || "", attr.value);
+                    } else {
+                        obj[name] = attr.value;
+                    }
+                }
+                obj.featureTypes = complexTypes;                
+                obj.targetPrefix = this.namespaceAlias[obj.targetNamespace];
+                
+                // map complexTypes to names of customTypes
+                var complexType, customType;
+                for(var i=0, len=complexTypes.length; i<len; ++i) {
+                    complexType = complexTypes[i];
+                    customType = customTypes[complexType.typeName];
+                    if(customTypes[complexType.typeName]) {
+                        complexType.typeName = customType.name;
+                    }
+                }
+            },
+            "complexType": function(node, obj) {
+                var complexType = {
+                    // this is a temporary typeName, it will be overwritten by
+                    // the schema reader with the metadata found in the
+                    // customTypes hash
+                    "typeName": node.getAttribute("name")
+                };
+                this.readChildNodes(node, complexType);
+                obj.complexTypes.push(complexType);
+            },
+            "complexContent": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "extension": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "sequence": function(node, obj) {
+                var sequence = {
+                    elements: []
+                };
+                this.readChildNodes(node, sequence);
+                obj.properties = sequence.elements;
+            },
+            "element": function(node, obj) {
+                if(obj.elements) {
+                    var element = {};
+                    var attributes = node.attributes;
+                    var attr;
+                    for(var i=0, len=attributes.length; i<len; ++i) {
+                        attr = attributes[i];
+                        element[attr.name] = attr.value;
+                    }
+                    
+                    var type = element.type;
+                    if(!type) {
+                        type = {};
+                        this.readChildNodes(node, type);
+                        element.restriction = type;
+                        element.type = type.base;
+                    }
+                    var fullType = type.base || type;
+                    element.localType = fullType.split(":").pop();
+                    obj.elements.push(element);
+                }
+                
+                if(obj.complexTypes) {
+                    var type = node.getAttribute("type");
+                    var localType = type.split(":").pop();
+                    obj.customTypes[localType] = {
+                        "name": node.getAttribute("name"),
+                        "type": type
+                    };
+                }
+            },
+            "simpleType": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "restriction": function(node, obj) {
+                obj.base = node.getAttribute("base");
+                this.readRestriction(node, obj);
+            }
+        }
+    },
+    
+    /**
+     * Method: readRestriction
+     * Reads restriction defined in the child nodes of a restriction element
+     * 
+     * Parameters:
+     * node {DOMElement} - the node to parse
+     * obj {Object} - the object that receives the read result
+     */
+    readRestriction: function(node, obj) {
+        var children = node.childNodes;
+        var child, nodeName, value;
+        for(var i=0, len=children.length; i<len; ++i) {
+            child = children[i];
+            if(child.nodeType == 1) {
+                nodeName = child.nodeName.split(":").pop();
+                value = child.getAttribute("value");
+                if(!obj[nodeName]) {
+                    obj[nodeName] = value;
+                } else {
+                    if(typeof obj[nodeName] == "string") {
+                        obj[nodeName] = [obj[nodeName]];
+                    }
+                    obj[nodeName].push(value);
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: read
+     *
+     * Parameters:
+     * data - {DOMElement|String} A WFS DescribeFeatureType document.
+     *
+     * Returns:
+     * {Object} An object representing the WFS DescribeFeatureType response.
+     */
+    read: function(data) {
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var schema = {};
+        this.readNode(data, schema);
+        
+        return schema;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WFSDescribeFeatureType" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities.js	(revision 76)
@@ -0,0 +1,83 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+ 
+/**
+ * Class: OpenLayers.Format.SOSCapabilities
+ * Read SOS Capabilities.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.SOSCapabilities = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.0.0".
+     */
+    defaultVersion: "1.0.0",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+
+    /**
+     * Property: parser
+     * {<OpenLayers.Format>} A cached versioned format used for reading.
+     */
+    parser: null,     
+
+    /**
+     * Constructor: OpenLayers.Format.SOSCapabilities
+     * Create a new parser for SOS capabilities.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return information about
+     * the service (offering and observedProperty mostly).
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} Info about the SOS
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version || root.getAttribute("version") || this.defaultVersion;
+        if(!this.parser || this.parser.version !== version) {
+            var constr = OpenLayers.Format.SOSCapabilities[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!constr) {
+                throw "Can't find a SOS capabilities parser for version " + version;
+            }
+            var parser = new constr(this.options);
+        }
+        var capabilities = parser.read(data);
+        capabilities.version = version;
+        return capabilities; 
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.SOSCapabilities" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords.js	(revision 76)
@@ -0,0 +1,34 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format.js
+ */
+
+/**
+ * Function: OpenLayers.Format.CSWGetRecords.
+ *     Default version is 2.0.2.
+ *
+ * Returns:
+ * {<OpenLayers.Format>} A CSWGetRecords format of the given version.
+ */
+OpenLayers.Format.CSWGetRecords = function(options) {
+    options = OpenLayers.Util.applyDefaults(
+        options, OpenLayers.Format.CSWGetRecords.DEFAULTS
+    );
+    var cls = OpenLayers.Format.CSWGetRecords["v"+options.version.replace(/\./g, "_")];
+    if(!cls) {
+        throw "Unsupported CSWGetRecords version: " + options.version;
+    }
+    return new cls(options);
+};
+
+/**
+ * Constant: OpenLayers.Format.CSWGetRecords.DEFAULTS
+ * {Object} Default properties for the CSWGetRecords format.
+ */
+OpenLayers.Format.CSWGetRecords.DEFAULTS = {
+    "version": "2.0.2"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GML.js	(revision 76)
@@ -0,0 +1,924 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/MultiPoint.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/MultiLineString.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ * @requires OpenLayers/Geometry/MultiPolygon.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GML
+ * Read/Wite GML. Create a new instance with the <OpenLayers.Format.GML>
+ *     constructor.  Supports the GML simple features profile.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.GML = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /*
+     * APIProperty: featureNS
+     * {String} Namespace used for feature attributes.  Default is
+     *     "http://mapserver.gis.umn.edu/mapserver".
+     */
+    featureNS: "http://mapserver.gis.umn.edu/mapserver",
+    
+    /**
+     * APIProperty: featurePrefix
+     * {String} Namespace alias (or prefix) for feature nodes.  Default is
+     *     "feature".
+     */
+    featurePrefix: "feature",
+    
+    /*
+     * APIProperty: featureName
+     * {String} Element name for features. Default is "featureMember".
+     */
+    featureName: "featureMember", 
+    
+    /*
+     * APIProperty: layerName
+     * {String} Name of data layer. Default is "features".
+     */
+    layerName: "features",
+    
+    /**
+     * APIProperty: geometryName
+     * {String} Name of geometry element.  Defaults to "geometry".
+     */
+    geometryName: "geometry",
+    
+    /** 
+     * APIProperty: collectionName
+     * {String} Name of featureCollection element.
+     */
+    collectionName: "FeatureCollection",
+    
+    /**
+     * APIProperty: gmlns
+     * {String} GML Namespace.
+     */
+    gmlns: "http://www.opengis.net/gml",
+
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract attributes from GML.
+     */
+    extractAttributes: true,
+    
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate true:(x,y) or false:(y,x)
+     * Changing is not recommended, a new Format should be instantiated.
+     */ 
+    xy: true,
+    
+    /**
+     * Constructor: OpenLayers.Format.GML
+     * Create a new parser for GML.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        // compile regular expressions once instead of every time they are used
+        this.regExes = {
+            trimSpace: (/^\s*|\s*$/g),
+            removeSpace: (/\s*/g),
+            splitSpace: (/\s+/),
+            trimComma: (/\s*,\s*/g)
+        };
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Read data from a string, and return a list of features. 
+     * 
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} An array of features.
+     */
+    read: function(data) {
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var featureNodes = this.getElementsByTagNameNS(data.documentElement,
+                                                       this.gmlns,
+                                                       this.featureName);
+        var features = [];
+        for(var i=0; i<featureNodes.length; i++) {
+            var feature = this.parseFeature(featureNodes[i]);
+            if(feature) {
+                features.push(feature);
+            }
+        }
+        return features;
+    },
+    
+    /**
+     * Method: parseFeature
+     * This function is the core of the GML parsing code in OpenLayers.
+     *    It creates the geometries that are then attached to the returned
+     *    feature, and calls parseAttributes() to get attribute data out.
+     *    
+     * Parameters:
+     * node - {DOMElement} A GML feature node. 
+     */
+    parseFeature: function(node) {
+        // only accept one geometry per feature - look for highest "order"
+        var order = ["MultiPolygon", "Polygon",
+                     "MultiLineString", "LineString",
+                     "MultiPoint", "Point", "Envelope"];
+        // FIXME: In case we parse a feature with no geometry, but boundedBy an Envelope,
+        // this code creates a geometry derived from the Envelope. This is not correct.
+        var type, nodeList, geometry, parser;
+        for(var i=0; i<order.length; ++i) {
+            type = order[i];
+            nodeList = this.getElementsByTagNameNS(node, this.gmlns, type);
+            if(nodeList.length > 0) {
+                // only deal with first geometry of this type
+                parser = this.parseGeometry[type.toLowerCase()];
+                if(parser) {
+                    geometry = parser.apply(this, [nodeList[0]]);
+                    if (this.internalProjection && this.externalProjection) {
+                        geometry.transform(this.externalProjection, 
+                                           this.internalProjection); 
+                    }                       
+                } else {
+                    OpenLayers.Console.error(OpenLayers.i18n(
+                                "unsupportedGeometryType", {'geomType':type}));
+                }
+                // stop looking for different geometry types
+                break;
+            }
+        }
+
+        var bounds;
+        var boxNodes = this.getElementsByTagNameNS(node, this.gmlns, "Box");
+        for(i=0; i<boxNodes.length; ++i) {
+            var boxNode = boxNodes[i];
+            var box = this.parseGeometry["box"].apply(this, [boxNode]);
+            var parentNode = boxNode.parentNode;
+            var parentName = parentNode.localName ||
+                             parentNode.nodeName.split(":").pop();
+            if(parentName === "boundedBy") {
+                bounds = box;
+            } else {
+                geometry = box.toGeometry();
+            }
+        }
+        
+        // construct feature (optionally with attributes)
+        var attributes;
+        if(this.extractAttributes) {
+            attributes = this.parseAttributes(node);
+        }
+        var feature = new OpenLayers.Feature.Vector(geometry, attributes);
+        feature.bounds = bounds;
+        
+        feature.gml = {
+            featureType: node.firstChild.nodeName.split(":")[1],
+            featureNS: node.firstChild.namespaceURI,
+            featureNSPrefix: node.firstChild.prefix
+        };
+                
+        // assign fid - this can come from a "fid" or "id" attribute
+        var childNode = node.firstChild;
+        var fid;
+        while(childNode) {
+            if(childNode.nodeType == 1) {
+                fid = childNode.getAttribute("fid") ||
+                      childNode.getAttribute("id");
+                if(fid) {
+                    break;
+                }
+            }
+            childNode = childNode.nextSibling;
+        }
+        feature.fid = fid;
+        return feature;
+    },
+    
+    /**
+     * Property: parseGeometry
+     * Properties of this object are the functions that parse geometries based
+     *     on their type.
+     */
+    parseGeometry: {
+        
+        /**
+         * Method: parseGeometry.point
+         * Given a GML node representing a point geometry, create an OpenLayers
+         *     point geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.Point>} A point geometry.
+         */
+        point: function(node) {
+            /**
+             * Three coordinate variations to consider:
+             * 1) <gml:pos>x y z</gml:pos>
+             * 2) <gml:coordinates>x, y, z</gml:coordinates>
+             * 3) <gml:coord><gml:X>x</gml:X><gml:Y>y</gml:Y></gml:coord>
+             */
+            var nodeList, coordString;
+            var coords = [];
+
+            // look for <gml:pos>
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns, "pos");
+            if(nodeList.length > 0) {
+                coordString = nodeList[0].firstChild.nodeValue;
+                coordString = coordString.replace(this.regExes.trimSpace, "");
+                coords = coordString.split(this.regExes.splitSpace);
+            }
+
+            // look for <gml:coordinates>
+            if(coords.length == 0) {
+                nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "coordinates");
+                if(nodeList.length > 0) {
+                    coordString = nodeList[0].firstChild.nodeValue;
+                    coordString = coordString.replace(this.regExes.removeSpace,
+                                                      "");
+                    coords = coordString.split(",");
+                }
+            }
+
+            // look for <gml:coord>
+            if(coords.length == 0) {
+                nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "coord");
+                if(nodeList.length > 0) {
+                    var xList = this.getElementsByTagNameNS(nodeList[0],
+                                                            this.gmlns, "X");
+                    var yList = this.getElementsByTagNameNS(nodeList[0],
+                                                            this.gmlns, "Y");
+                    if(xList.length > 0 && yList.length > 0) {
+                        coords = [xList[0].firstChild.nodeValue,
+                                  yList[0].firstChild.nodeValue];
+                    }
+                }
+            }
+                
+            // preserve third dimension
+            if(coords.length == 2) {
+                coords[2] = null;
+            }
+            
+            if (this.xy) {
+                return new OpenLayers.Geometry.Point(coords[0], coords[1],
+                                                 coords[2]);
+            }
+            else{
+                return new OpenLayers.Geometry.Point(coords[1], coords[0],
+                                                 coords[2]);
+            }
+        },
+        
+        /**
+         * Method: parseGeometry.multipoint
+         * Given a GML node representing a multipoint geometry, create an
+         *     OpenLayers multipoint geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.MultiPoint>} A multipoint geometry.
+         */
+        multipoint: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "Point");
+            var components = [];
+            if(nodeList.length > 0) {
+                var point;
+                for(var i=0; i<nodeList.length; ++i) {
+                    point = this.parseGeometry.point.apply(this, [nodeList[i]]);
+                    if(point) {
+                        components.push(point);
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.MultiPoint(components);
+        },
+        
+        /**
+         * Method: parseGeometry.linestring
+         * Given a GML node representing a linestring geometry, create an
+         *     OpenLayers linestring geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.LineString>} A linestring geometry.
+         */
+        linestring: function(node, ring) {
+            /**
+             * Two coordinate variations to consider:
+             * 1) <gml:posList dimension="d">x0 y0 z0 x1 y1 z1</gml:posList>
+             * 2) <gml:coordinates>x0, y0, z0 x1, y1, z1</gml:coordinates>
+             */
+            var nodeList, coordString;
+            var coords = [];
+            var points = [];
+
+            // look for <gml:posList>
+            nodeList = this.getElementsByTagNameNS(node, this.gmlns, "posList");
+            if(nodeList.length > 0) {
+                coordString = this.getChildValue(nodeList[0]);
+                coordString = coordString.replace(this.regExes.trimSpace, "");
+                coords = coordString.split(this.regExes.splitSpace);
+                var dim = parseInt(nodeList[0].getAttribute("dimension"));
+                var j, x, y, z;
+                for(var i=0; i<coords.length/dim; ++i) {
+                    j = i * dim;
+                    x = coords[j];
+                    y = coords[j+1];
+                    z = (dim == 2) ? null : coords[j+2];
+                    if (this.xy) {
+                        points.push(new OpenLayers.Geometry.Point(x, y, z));
+                    } else {
+                        points.push(new OpenLayers.Geometry.Point(y, x, z));
+                    }
+                }
+            }
+
+            // look for <gml:coordinates>
+            if(coords.length == 0) {
+                nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "coordinates");
+                if(nodeList.length > 0) {
+                    coordString = this.getChildValue(nodeList[0]);
+                    coordString = coordString.replace(this.regExes.trimSpace,
+                                                      "");
+                    coordString = coordString.replace(this.regExes.trimComma,
+                                                      ",");
+                    var pointList = coordString.split(this.regExes.splitSpace);
+                    for(var i=0; i<pointList.length; ++i) {
+                        coords = pointList[i].split(",");
+                        if(coords.length == 2) {
+                            coords[2] = null;
+                        }
+                        if (this.xy) {
+                            points.push(new OpenLayers.Geometry.Point(coords[0],
+                                                                  coords[1],
+                                                                  coords[2]));
+                        } else {
+                            points.push(new OpenLayers.Geometry.Point(coords[1],
+                                                                  coords[0],
+                                                                  coords[2]));
+                        }
+                    }
+                }
+            }
+
+            var line = null;
+            if(points.length != 0) {
+                if(ring) {
+                    line = new OpenLayers.Geometry.LinearRing(points);
+                } else {
+                    line = new OpenLayers.Geometry.LineString(points);
+                }
+            }
+            return line;
+        },
+        
+        /**
+         * Method: parseGeometry.multilinestring
+         * Given a GML node representing a multilinestring geometry, create an
+         *     OpenLayers multilinestring geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.MultiLineString>} A multilinestring geometry.
+         */
+        multilinestring: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "LineString");
+            var components = [];
+            if(nodeList.length > 0) {
+                var line;
+                for(var i=0; i<nodeList.length; ++i) {
+                    line = this.parseGeometry.linestring.apply(this,
+                                                               [nodeList[i]]);
+                    if(line) {
+                        components.push(line);
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.MultiLineString(components);
+        },
+        
+        /**
+         * Method: parseGeometry.polygon
+         * Given a GML node representing a polygon geometry, create an
+         *     OpenLayers polygon geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.Polygon>} A polygon geometry.
+         */
+        polygon: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "LinearRing");
+            var components = [];
+            if(nodeList.length > 0) {
+                // this assumes exterior ring first, inner rings after
+                var ring;
+                for(var i=0; i<nodeList.length; ++i) {
+                    ring = this.parseGeometry.linestring.apply(this,
+                                                        [nodeList[i], true]);
+                    if(ring) {
+                        components.push(ring);
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.Polygon(components);
+        },
+        
+        /**
+         * Method: parseGeometry.multipolygon
+         * Given a GML node representing a multipolygon geometry, create an
+         *     OpenLayers multipolygon geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.MultiPolygon>} A multipolygon geometry.
+         */
+        multipolygon: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                       "Polygon");
+            var components = [];
+            if(nodeList.length > 0) {
+                var polygon;
+                for(var i=0; i<nodeList.length; ++i) {
+                    polygon = this.parseGeometry.polygon.apply(this,
+                                                               [nodeList[i]]);
+                    if(polygon) {
+                        components.push(polygon);
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.MultiPolygon(components);
+        },
+        
+        envelope: function(node) {
+            var components = [];
+            var coordString;
+            var envelope;
+            
+            var lpoint = this.getElementsByTagNameNS(node, this.gmlns, "lowerCorner");
+            if (lpoint.length > 0) {
+                var coords = [];
+                
+                if(lpoint.length > 0) {
+                    coordString = lpoint[0].firstChild.nodeValue;
+                    coordString = coordString.replace(this.regExes.trimSpace, "");
+                    coords = coordString.split(this.regExes.splitSpace);
+                }
+                
+                if(coords.length == 2) {
+                    coords[2] = null;
+                }
+                if (this.xy) {
+                    var lowerPoint = new OpenLayers.Geometry.Point(coords[0], coords[1],coords[2]);
+                } else {
+                    var lowerPoint = new OpenLayers.Geometry.Point(coords[1], coords[0],coords[2]);
+                }
+            }
+            
+            var upoint = this.getElementsByTagNameNS(node, this.gmlns, "upperCorner");
+            if (upoint.length > 0) {
+                var coords = [];
+                
+                if(upoint.length > 0) {
+                    coordString = upoint[0].firstChild.nodeValue;
+                    coordString = coordString.replace(this.regExes.trimSpace, "");
+                    coords = coordString.split(this.regExes.splitSpace);
+                }
+                
+                if(coords.length == 2) {
+                    coords[2] = null;
+                }
+                if (this.xy) {
+                    var upperPoint = new OpenLayers.Geometry.Point(coords[0], coords[1],coords[2]);
+                } else {
+                    var upperPoint = new OpenLayers.Geometry.Point(coords[1], coords[0],coords[2]);
+                }
+            }
+            
+            if (lowerPoint && upperPoint) {
+                components.push(new OpenLayers.Geometry.Point(lowerPoint.x, lowerPoint.y));
+                components.push(new OpenLayers.Geometry.Point(upperPoint.x, lowerPoint.y));
+                components.push(new OpenLayers.Geometry.Point(upperPoint.x, upperPoint.y));
+                components.push(new OpenLayers.Geometry.Point(lowerPoint.x, upperPoint.y));
+                components.push(new OpenLayers.Geometry.Point(lowerPoint.x, lowerPoint.y));
+                
+                var ring = new OpenLayers.Geometry.LinearRing(components);
+                envelope = new OpenLayers.Geometry.Polygon([ring]);
+            }
+            return envelope; 
+        },
+
+        /**
+         * Method: parseGeometry.box
+         * Given a GML node representing a box geometry, create an
+         *     OpenLayers.Bounds.
+         *
+         * Parameters:
+         * node - {DOMElement} A GML node.
+         *
+         * Returns:
+         * {<OpenLayers.Bounds>} A bounds representing the box.
+         */
+        box: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.gmlns,
+                                                   "coordinates");
+            var coordString;
+            var coords, beginPoint = null, endPoint = null;
+            if (nodeList.length > 0) {
+                coordString = nodeList[0].firstChild.nodeValue;
+                coords = coordString.split(" ");
+                if (coords.length == 2) {
+                    beginPoint = coords[0].split(",");
+                    endPoint = coords[1].split(",");
+                }
+            }
+            if (beginPoint !== null && endPoint !== null) {
+                return new OpenLayers.Bounds(parseFloat(beginPoint[0]),
+                    parseFloat(beginPoint[1]),
+                    parseFloat(endPoint[0]),
+                    parseFloat(endPoint[1]) );
+            }
+        }
+        
+    },
+    
+    /**
+     * Method: parseAttributes
+     *
+     * Parameters:
+     * node - {<DOMElement>}
+     *
+     * Returns:
+     * {Object} An attributes object.
+     */
+    parseAttributes: function(node) {
+        var attributes = {};
+        // assume attributes are children of the first type 1 child
+        var childNode = node.firstChild;
+        var children, i, child, grandchildren, grandchild, name, value;
+        while(childNode) {
+            if(childNode.nodeType == 1) {
+                // attributes are type 1 children with one type 3 child
+                children = childNode.childNodes;
+                for(i=0; i<children.length; ++i) {
+                    child = children[i];
+                    if(child.nodeType == 1) {
+                        grandchildren = child.childNodes;
+                        if(grandchildren.length == 1) {
+                            grandchild = grandchildren[0];
+                            if(grandchild.nodeType == 3 ||
+                               grandchild.nodeType == 4) {
+                                name = (child.prefix) ?
+                                        child.nodeName.split(":")[1] :
+                                        child.nodeName;
+                                value = grandchild.nodeValue.replace(
+                                                this.regExes.trimSpace, "");
+                                attributes[name] = value;
+                            }
+                        } else {
+                            // If child has no childNodes (grandchildren),
+                            // set an attribute with null value.
+                            // e.g. <prefix:fieldname/> becomes
+                            // {fieldname: null}
+                            attributes[child.nodeName.split(":").pop()] = null;
+                        }
+                    }
+                }
+                break;
+            }
+            childNode = childNode.nextSibling;
+        }
+        return attributes;
+    },
+    
+    /**
+     * APIMethod: write
+     * Generate a GML document string given a list of features. 
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} List of features to
+     *     serialize into a string.
+     *
+     * Returns:
+     * {String} A string representing the GML document.
+     */
+    write: function(features) {
+        if(!(features instanceof Array)) {
+            features = [features];
+        }
+        var gml = this.createElementNS("http://www.opengis.net/wfs",
+                                       "wfs:" + this.collectionName);
+        for(var i=0; i<features.length; i++) {
+            gml.appendChild(this.createFeatureXML(features[i]));
+        }
+        return OpenLayers.Format.XML.prototype.write.apply(this, [gml]);
+    },
+
+    /** 
+     * Method: createFeatureXML
+     * Accept an OpenLayers.Feature.Vector, and build a GML node for it.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature to be built as GML.
+     *
+     * Returns:
+     * {DOMElement} A node reprensting the feature in GML.
+     */
+    createFeatureXML: function(feature) {
+        var geometry = feature.geometry;
+        var geometryNode = this.buildGeometryNode(geometry);
+        var geomContainer = this.createElementNS(this.featureNS,
+                                                 this.featurePrefix + ":" +
+                                                 this.geometryName);
+        geomContainer.appendChild(geometryNode);
+        var featureNode = this.createElementNS(this.gmlns,
+                                               "gml:" + this.featureName);
+        var featureContainer = this.createElementNS(this.featureNS,
+                                                    this.featurePrefix + ":" +
+                                                    this.layerName);
+        var fid = feature.fid || feature.id;
+        featureContainer.setAttribute("fid", fid);
+        featureContainer.appendChild(geomContainer);
+        for(var attr in feature.attributes) {
+            var attrText = this.createTextNode(feature.attributes[attr]); 
+            var nodename = attr.substring(attr.lastIndexOf(":") + 1);
+            var attrContainer = this.createElementNS(this.featureNS,
+                                                     this.featurePrefix + ":" +
+                                                     nodename);
+            attrContainer.appendChild(attrText);
+            featureContainer.appendChild(attrContainer);
+        }    
+        featureNode.appendChild(featureContainer);
+        return featureNode;
+    },
+    
+    /**
+     * APIMethod: buildGeometryNode
+     */
+    buildGeometryNode: function(geometry) {
+        if (this.externalProjection && this.internalProjection) {
+            geometry = geometry.clone();
+            geometry.transform(this.internalProjection, 
+                               this.externalProjection);
+        }    
+        var className = geometry.CLASS_NAME;
+        var type = className.substring(className.lastIndexOf(".") + 1);
+        var builder = this.buildGeometry[type.toLowerCase()];
+        return builder.apply(this, [geometry]);
+    },
+
+    /**
+     * Property: buildGeometry
+     * Object containing methods to do the actual geometry node building
+     *     based on geometry type.
+     */
+    buildGeometry: {
+        // TBD retrieve the srs from layer
+        // srsName is non-standard, so not including it until it's right.
+        // gml.setAttribute("srsName",
+        //                  "http://www.opengis.net/gml/srs/epsg.xml#4326");
+
+        /**
+         * Method: buildGeometry.point
+         * Given an OpenLayers point geometry, create a GML point.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Point>} A point geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML point node.
+         */
+        point: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:Point");
+            gml.appendChild(this.buildCoordinatesNode(geometry));
+            return gml;
+        },
+        
+        /**
+         * Method: buildGeometry.multipoint
+         * Given an OpenLayers multipoint geometry, create a GML multipoint.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.MultiPoint>} A multipoint geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML multipoint node.
+         */
+        multipoint: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:MultiPoint");
+            var points = geometry.components;
+            var pointMember, pointGeom;
+            for(var i=0; i<points.length; i++) { 
+                pointMember = this.createElementNS(this.gmlns,
+                                                   "gml:pointMember");
+                pointGeom = this.buildGeometry.point.apply(this,
+                                                               [points[i]]);
+                pointMember.appendChild(pointGeom);
+                gml.appendChild(pointMember);
+            }
+            return gml;            
+        },
+        
+        /**
+         * Method: buildGeometry.linestring
+         * Given an OpenLayers linestring geometry, create a GML linestring.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.LineString>} A linestring geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML linestring node.
+         */
+        linestring: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:LineString");
+            gml.appendChild(this.buildCoordinatesNode(geometry));
+            return gml;
+        },
+        
+        /**
+         * Method: buildGeometry.multilinestring
+         * Given an OpenLayers multilinestring geometry, create a GML
+         *     multilinestring.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.MultiLineString>} A multilinestring
+         *     geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML multilinestring node.
+         */
+        multilinestring: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:MultiLineString");
+            var lines = geometry.components;
+            var lineMember, lineGeom;
+            for(var i=0; i<lines.length; ++i) {
+                lineMember = this.createElementNS(this.gmlns,
+                                                  "gml:lineStringMember");
+                lineGeom = this.buildGeometry.linestring.apply(this,
+                                                                   [lines[i]]);
+                lineMember.appendChild(lineGeom);
+                gml.appendChild(lineMember);
+            }
+            return gml;
+        },
+        
+        /**
+         * Method: buildGeometry.linearring
+         * Given an OpenLayers linearring geometry, create a GML linearring.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.LinearRing>} A linearring geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML linearring node.
+         */
+        linearring: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:LinearRing");
+            gml.appendChild(this.buildCoordinatesNode(geometry));
+            return gml;
+        },
+        
+        /**
+         * Method: buildGeometry.polygon
+         * Given an OpenLayers polygon geometry, create a GML polygon.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Polygon>} A polygon geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML polygon node.
+         */
+        polygon: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:Polygon");
+            var rings = geometry.components;
+            var ringMember, ringGeom, type;
+            for(var i=0; i<rings.length; ++i) {
+                type = (i==0) ? "outerBoundaryIs" : "innerBoundaryIs";
+                ringMember = this.createElementNS(this.gmlns,
+                                                  "gml:" + type);
+                ringGeom = this.buildGeometry.linearring.apply(this,
+                                                                   [rings[i]]);
+                ringMember.appendChild(ringGeom);
+                gml.appendChild(ringMember);
+            }
+            return gml;
+        },
+        
+        /**
+         * Method: buildGeometry.multipolygon
+         * Given an OpenLayers multipolygon geometry, create a GML multipolygon.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.MultiPolygon>} A multipolygon
+         *     geometry.
+         *
+         * Returns:
+         * {DOMElement} A GML multipolygon node.
+         */
+        multipolygon: function(geometry) {
+            var gml = this.createElementNS(this.gmlns, "gml:MultiPolygon");
+            var polys = geometry.components;
+            var polyMember, polyGeom;
+            for(var i=0; i<polys.length; ++i) {
+                polyMember = this.createElementNS(this.gmlns,
+                                                  "gml:polygonMember");
+                polyGeom = this.buildGeometry.polygon.apply(this,
+                                                                [polys[i]]);
+                polyMember.appendChild(polyGeom);
+                gml.appendChild(polyMember);
+            }
+            return gml;
+
+        },
+ 
+        /**
+         * Method: buildGeometry.bounds
+         * Given an OpenLayers bounds, create a GML box.
+         *
+         * Parameters:
+         * bounds - {<OpenLayers.Geometry.Bounds>} A bounds object.
+         *
+         * Returns:
+         * {DOMElement} A GML box node.
+         */
+        bounds: function(bounds) {
+            var gml = this.createElementNS(this.gmlns, "gml:Box");
+            gml.appendChild(this.buildCoordinatesNode(bounds));
+            return gml;
+        }
+    },
+
+    /**
+     * Method: buildCoordinates
+     * builds the coordinates XmlNode
+     * (code)
+     * <gml:coordinates decimal="." cs="," ts=" ">...</gml:coordinates>
+     * (end)
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>} 
+     *
+     * Returns:
+     * {XmlNode} created xmlNode
+     */
+    buildCoordinatesNode: function(geometry) {
+        var coordinatesNode = this.createElementNS(this.gmlns,
+                                                   "gml:coordinates");
+        coordinatesNode.setAttribute("decimal", ".");
+        coordinatesNode.setAttribute("cs", ",");
+        coordinatesNode.setAttribute("ts", " ");
+
+        var parts = [];
+
+        if(geometry instanceof OpenLayers.Bounds){
+            parts.push(geometry.left + "," + geometry.bottom);
+            parts.push(geometry.right + "," + geometry.top);
+        } else {
+            var points = (geometry.components) ? geometry.components : [geometry];
+            for(var i=0; i<points.length; i++) {
+                parts.push(points[i].x + "," + points[i].y);                
+            }            
+        }
+
+        var txtNode = this.createTextNode(parts.join(" "));
+        coordinatesNode.appendChild(txtNode);
+        
+        return coordinatesNode;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.GML" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetObservation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetObservation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetObservation.js	(revision 76)
@@ -0,0 +1,262 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/GML.js
+ * @requires OpenLayers/Format/GML/v3.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SOSGetObservation
+ * Read and write SOS GetObersation (to get the actual values from a sensor) 
+ *     version 1.0.0
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.SOSGetObservation = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ows: "http://www.opengis.net/ows",
+        gml: "http://www.opengis.net/gml",
+        sos: "http://www.opengis.net/sos/1.0",
+        ogc: "http://www.opengis.net/ogc",
+        om: "http://www.opengis.net/om/1.0",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Constant: VERSION
+     * {String} 1.0.0
+     */
+    VERSION: "1.0.0",
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location
+     */
+    schemaLocation: "http://www.opengis.net/sos/1.0 http://schemas.opengis.net/sos/1.0.0/sosGetObservation.xsd",
+
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "sos",
+
+    /**
+     * Constructor: OpenLayers.Format.SOSGetObservation
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * Method: read
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} An object containing the measurements
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var info = {measurements: []};
+        this.readNode(data, info);
+        return info;
+    },
+
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * options - {Object} Optional object.
+     *
+     * Returns:
+     * {String} An SOS GetObservation request XML string.
+     */
+    write: function(options) {
+        var node = this.writeNode("sos:GetObservation", options);
+        node.setAttribute("xmlns:om", this.namespaces.om);
+        this.setAttributeNS(
+            node, this.namespaces.xsi,
+            "xsi:schemaLocation", this.schemaLocation
+        );
+        return OpenLayers.Format.XML.prototype.write.apply(this, [node]);
+    }, 
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "om": {
+            "ObservationCollection": function(node, obj) {
+                obj.id = this.getAttributeNS(node, this.namespaces.gml, "id");
+                this.readChildNodes(node, obj);
+            },
+            "member": function(node, observationCollection) {
+                this.readChildNodes(node, observationCollection);
+            },
+            "Measurement": function(node, observationCollection) {
+                var measurement = {};
+                observationCollection.measurements.push(measurement);
+                this.readChildNodes(node, measurement);
+            },
+            "samplingTime": function(node, measurement) {
+                var samplingTime = {};
+                measurement.samplingTime = samplingTime;
+                this.readChildNodes(node, samplingTime);
+            },
+            "observedProperty": function(node, measurement) {
+                measurement.observedProperty = 
+                    this.getAttributeNS(node, this.namespaces.xlink, "href");
+                this.readChildNodes(node, measurement);
+            },
+            "procedure": function(node, measurement) {
+                measurement.procedure = 
+                    this.getAttributeNS(node, this.namespaces.xlink, "href");
+                this.readChildNodes(node, measurement);
+            },
+            "result": function(node, measurement) {
+                var result = {};
+                measurement.result = result;
+                if (this.getChildValue(node) !== '') {
+                    result.value = this.getChildValue(node);
+                    result.uom = node.getAttribute("uom");
+                } else {
+                    this.readChildNodes(node, result);
+                }
+            }
+        },
+        "gml": OpenLayers.Util.applyDefaults({
+            "TimeInstant": function(node, samplingTime) {
+               var timeInstant = {};
+                samplingTime.timeInstant = timeInstant;
+                this.readChildNodes(node, timeInstant);
+            },
+            "timePosition": function(node, timeInstant) {
+                timeInstant.timePosition = this.getChildValue(node);
+            }
+        }, OpenLayers.Format.GML.v3.prototype.readers.gml)
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "sos": {
+            "GetObservation": function(options) {
+                var node = this.createElementNSPlus("GetObservation", {
+                    attributes: {
+                        version: this.VERSION,
+                        service: 'SOS'
+                    } 
+                }); 
+                this.writeNode("offering", options, node);
+                this.writeNode("eventTime", options, node);
+                this.writeNode("procedure", options, node);
+                this.writeNode("observedProperty", options, node);
+                this.writeNode("responseFormat", options, node);
+                this.writeNode("resultModel", options, node);                                
+                this.writeNode("responseMode", options, node);
+                return node; 
+            },
+            "responseFormat": function(options) {
+                return this.createElementNSPlus("responseFormat", 
+                    {value: options.responseFormat});
+            },
+            "procedure": function(options) {
+                return this.createElementNSPlus("procedure", 
+                    {value: options.procedure});
+            },
+            "offering": function(options) {
+                return this.createElementNSPlus("offering", {value: 
+                    options.offering});
+            },
+            "observedProperty": function(options) {
+                return this.createElementNSPlus("observedProperty", 
+                    {value: options.observedProperty});
+            },
+            "eventTime": function(options) {
+                var node = this.createElementNSPlus("eventTime");
+                if (options.eventTime === 'latest') {
+                    this.writeNode("ogc:TM_Equals", options, node);
+                }
+                return node;
+            },
+            "resultModel": function(options) {
+                return this.createElementNSPlus("resultModel", {value: 
+                    options.resultModel});
+            },
+            "responseMode": function(options) {
+                return this.createElementNSPlus("responseMode", {value: 
+                    options.responseMode});
+            }
+        },
+        "ogc": {
+            "TM_Equals": function(options) {
+                var node = this.createElementNSPlus("ogc:TM_Equals");
+                this.writeNode("ogc:PropertyName", {property: 
+                    "urn:ogc:data:time:iso8601"}, node);
+                if (options.eventTime === 'latest') {
+                    this.writeNode("gml:TimeInstant", {value: 'latest'}, node);
+                }
+                return node;
+            },
+            "PropertyName": function(options) {
+                return this.createElementNSPlus("ogc:PropertyName", 
+                    {value: options.property});
+            }
+        },
+        "gml": {
+            "TimeInstant": function(options) {
+                var node = this.createElementNSPlus("gml:TimeInstant");
+                this.writeNode("gml:timePosition", options, node);
+                return node;
+            },
+            "timePosition": function(options) {
+                var node = this.createElementNSPlus("gml:timePosition", 
+                    {value: options.value});
+                return node;
+            }
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.SOSGetObservation" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities.js	(revision 76)
@@ -0,0 +1,82 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities
+ * Read WMS Capabilities.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMSCapabilities = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.1.1".
+     */
+    defaultVersion: "1.1.1",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+    
+    /**
+     * Property: parser
+     * {<OpenLayers.Format>} A cached versioned format used for reading.
+     */
+    parser: null,
+
+    /**
+     * Constructor: OpenLayers.Format.WMSCapabilities
+     * Create a new parser for WMS capabilities.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return a list of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} List of named layers.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version || root.getAttribute("version") || this.defaultVersion;
+        if(!this.parser || this.parser.version !== version) {
+            var constr = OpenLayers.Format.WMSCapabilities[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!constr) {
+                throw "Can't find a WMS capabilities parser for version " + version;
+            }
+            this.parser = new constr(this.options);
+        }
+        var capabilities = this.parser.read(data);
+        capabilities.version = version;
+        return capabilities;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD.js	(revision 76)
@@ -0,0 +1,131 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Style.js
+ * @requires OpenLayers/Rule.js
+ * @requires OpenLayers/Filter/FeatureId.js
+ * @requires OpenLayers/Filter/Logical.js
+ * @requires OpenLayers/Filter/Comparison.js
+ * @requires OpenLayers/Filter/Spatial.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SLD
+ * Read/Wite SLD. Create a new instance with the <OpenLayers.Format.SLD>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.SLD = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.0.0".
+     */
+    defaultVersion: "1.0.0",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+    
+    /**
+     * APIProperty: namedLayersAsArray
+     * {Boolean} Generate a namedLayers array.  If false, the namedLayers
+     *     property value will be an object keyed by layer name. Default is
+     *     false.
+     */
+    namedLayersAsArray: false,
+    
+    /**
+     * Property: parser
+     * {Object} Instance of the versioned parser.  Cached for multiple read and
+     *     write calls of the same version.
+     */
+    parser: null,
+
+    /**
+     * Constructor: OpenLayers.Format.SLD
+     * Create a new parser for SLD.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: write
+     * Write a SLD document given a list of styles.
+     *
+     * Parameters:
+     * sld - {Object} An object representing the SLD.
+     * options - {Object} Optional configuration object.
+     *
+     * Returns:
+     * {String} An SLD document string.
+     */
+    write: function(sld, options) {
+        var version = (options && options.version) ||
+                      this.version || this.defaultVersion;
+        if(!this.parser || this.parser.VERSION != version) {
+            var format = OpenLayers.Format.SLD[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a SLD parser for version " +
+                      version;
+            }
+            this.parser = new format(this.options);
+        }
+        var root = this.parser.write(sld);
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Read and SLD doc and return an object representing the SLD.
+     *
+     * Parameters:
+     * data - {String | DOMElement} Data to read.
+     * options - {Object} Options for the reader.
+     *
+     * Returns:
+     * {Object} An object representing the SLD.
+     */
+    read: function(data, options) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version;
+        if(!version) {
+            version = root.getAttribute("version");
+            if(!version) {
+                version = this.defaultVersion;
+            }
+        }
+        if(!this.parser || this.parser.VERSION != version) {
+            var format = OpenLayers.Format.SLD[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a SLD parser for version " +
+                      version;
+            }
+            this.parser = new format(this.options);
+        }
+        var sld = this.parser.read(data, options);
+        return sld;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.SLD" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFST.js	(revision 76)
@@ -0,0 +1,34 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format.js
+ */
+
+/**
+ * Function: OpenLayers.Format.WFST
+ * Used to create a versioned WFS protocol.  Default version is 1.0.0.
+ *
+ * Returns:
+ * {<OpenLayers.Format>} A WFST format of the given version.
+ */
+OpenLayers.Format.WFST = function(options) {
+    options = OpenLayers.Util.applyDefaults(
+        options, OpenLayers.Format.WFST.DEFAULTS
+    );
+    var cls = OpenLayers.Format.WFST["v"+options.version.replace(/\./g, "_")];
+    if(!cls) {
+        throw "Unsupported WFST version: " + options.version;
+    }
+    return new cls(options);
+};
+
+/**
+ * Constant: OpenLayers.Format.WFST.DEFAULTS
+ * {Object} Default properties for the WFST format.
+ */
+OpenLayers.Format.WFST.DEFAULTS = {
+    "version": "1.0.0"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/KML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/KML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/KML.js	(revision 76)
@@ -0,0 +1,1429 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ * @requires OpenLayers/Geometry/Collection.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ * @requires OpenLayers/Console.js
+ * @requires OpenLayers/Projection.js
+ */
+
+/**
+ * Class: OpenLayers.Format.KML
+ * Read/Write KML. Create a new instance with the <OpenLayers.Format.KML>
+ *     constructor. 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.KML = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        kml: "http://www.opengis.net/kml/2.2",
+        gx: "http://www.google.com/kml/ext/2.2"
+    },
+
+    /**
+     * APIProperty: kmlns
+     * {String} KML Namespace to use. Defaults to 2.0 namespace.
+     */
+    kmlns: "http://earth.google.com/kml/2.0",
+    
+    /** 
+     * APIProperty: placemarksDesc
+     * {String} Name of the placemarks.  Default is "No description available".
+     */
+    placemarksDesc: "No description available",
+    
+    /** 
+     * APIProperty: foldersName
+     * {String} Name of the folders.  Default is "OpenLayers export".
+     *          If set to null, no name element will be created.
+     */
+    foldersName: "OpenLayers export",
+    
+    /** 
+     * APIProperty: foldersDesc
+     * {String} Description of the folders. Default is "Exported on [date]."
+     *          If set to null, no description element will be created.
+     */
+    foldersDesc: "Exported on " + new Date(),
+    
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract attributes from KML.  Default is true.
+     *           Extracting styleUrls requires this to be set to true
+     */
+    extractAttributes: true,
+    
+    /**
+     * Property: extractStyles
+     * {Boolean} Extract styles from KML.  Default is false.
+     *           Extracting styleUrls also requires extractAttributes to be
+     *           set to true
+     */
+    extractStyles: false,
+    
+    /**
+     * APIProperty: extractTracks
+     * {Boolean} Extract gx:Track elements from Placemark elements.  Default
+     *     is false.  If true, features will be generated for all points in
+     *     all gx:Track elements.  Features will have a when (Date) attribute
+     *     based on when elements in the track.  If tracks include angle
+     *     elements, features will have heading, tilt, and roll attributes.
+     *     If track point coordinates have three values, features will have
+     *     an altitude attribute with the third coordinate value.
+     */
+    extractTracks: false,
+    
+    /**
+     * APIProperty: trackAttributes
+     * {Array} If <extractTracks> is true, points within gx:Track elements will 
+     *     be parsed as features with when, heading, tilt, and roll attributes.
+     *     Any additional attribute names can be provided in <trackAttributes>.
+     */
+    trackAttributes: null,
+    
+    /**
+     * Property: internalns
+     * {String} KML Namespace to use -- defaults to the namespace of the
+     *     Placemark node being parsed, but falls back to kmlns. 
+     */
+    internalns: null,
+
+    /**
+     * Property: features
+     * {Array} Array of features
+     *     
+     */
+    features: null,
+
+    /**
+     * Property: styles
+     * {Object} Storage of style objects
+     *     
+     */
+    styles: null,
+    
+    /**
+     * Property: styleBaseUrl
+     * {String}
+     */
+    styleBaseUrl: "",
+
+    /**
+     * Property: fetched
+     * {Object} Storage of KML URLs that have been fetched before
+     *     in order to prevent reloading them.
+     */
+    fetched: null,
+
+    /**
+     * APIProperty: maxDepth
+     * {Integer} Maximum depth for recursive loading external KML URLs 
+     *           Defaults to 0: do no external fetching
+     */
+    maxDepth: 0,
+
+    /**
+     * Constructor: OpenLayers.Format.KML
+     * Create a new parser for KML.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        // compile regular expressions once instead of every time they are used
+        this.regExes = {
+            trimSpace: (/^\s*|\s*$/g),
+            removeSpace: (/\s*/g),
+            splitSpace: (/\s+/),
+            trimComma: (/\s*,\s*/g),
+            kmlColor: (/(\w{2})(\w{2})(\w{2})(\w{2})/),
+            kmlIconPalette: (/root:\/\/icons\/palette-(\d+)(\.\w+)/),
+            straightBracket: (/\$\[(.*?)\]/g)
+        };
+        // KML coordinates are always in longlat WGS84
+        this.externalProjection = new OpenLayers.Projection("EPSG:4326");
+
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Read data from a string, and return a list of features. 
+     * 
+     * Parameters: 
+     * data    - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} List of features.
+     */
+    read: function(data) {
+        this.features = [];
+        this.styles   = {};
+        this.fetched  = {};
+
+        // Set default options 
+        var options = {
+            depth: 0,
+            styleBaseUrl: this.styleBaseUrl
+        };
+
+        return this.parseData(data, options);
+    },
+
+    /**
+     * Method: parseData
+     * Read data from a string, and return a list of features. 
+     * 
+     * Parameters: 
+     * data    - {String} or {DOMElement} data to read/parse.
+     * options - {Object} Hash of options
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} List of features.
+     */
+    parseData: function(data, options) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+
+        // Loop throught the following node types in this order and
+        // process the nodes found 
+        var types = ["Link", "NetworkLink", "Style", "StyleMap", "Placemark"];
+        for(var i=0, len=types.length; i<len; ++i) {
+            var type = types[i];
+
+            var nodes = this.getElementsByTagNameNS(data, "*", type);
+
+            // skip to next type if no nodes are found
+            if(nodes.length == 0) { 
+                continue;
+            }
+
+            switch (type.toLowerCase()) {
+
+                // Fetch external links 
+                case "link":
+                case "networklink":
+                    this.parseLinks(nodes, options);
+                    break;
+
+                // parse style information
+                case "style":
+                    if (this.extractStyles) {
+                        this.parseStyles(nodes, options);
+                    }
+                    break;
+                case "stylemap":
+                    if (this.extractStyles) {
+                        this.parseStyleMaps(nodes, options);
+                    }
+                    break;
+
+                // parse features
+                case "placemark":
+                    this.parseFeatures(nodes, options);
+                    break;
+            }
+        }
+        
+        return this.features;
+    },
+
+    /**
+     * Method: parseLinks
+     * Finds URLs of linked KML documents and fetches them
+     * 
+     * Parameters: 
+     * nodes   - {Array} of {DOMElement} data to read/parse.
+     * options - {Object} Hash of options
+     * 
+     */
+    parseLinks: function(nodes, options) {
+        
+        // Fetch external links <NetworkLink> and <Link>
+        // Don't do anything if we have reached our maximum depth for recursion
+        if (options.depth >= this.maxDepth) {
+            return false;
+        }
+
+        // increase depth
+        var newOptions = OpenLayers.Util.extend({}, options);
+        newOptions.depth++;
+
+        for(var i=0, len=nodes.length; i<len; i++) {
+            var href = this.parseProperty(nodes[i], "*", "href");
+            if(href && !this.fetched[href]) {
+                this.fetched[href] = true; // prevent reloading the same urls
+                var data = this.fetchLink(href);
+                if (data) {
+                    this.parseData(data, newOptions);
+                }
+            } 
+        }
+
+    },
+
+    /**
+     * Method: fetchLink
+     * Fetches a URL and returns the result
+     * 
+     * Parameters: 
+     * href  - {String} url to be fetched
+     * 
+     */
+    fetchLink: function(href) {
+        var request = OpenLayers.Request.GET({url: href, async: false});
+        if (request) {
+            return request.responseText;
+        }
+    },
+
+    /**
+     * Method: parseStyles
+     * Looks for <Style> nodes in the data and parses them
+     * Also parses <StyleMap> nodes, but only uses the 'normal' key
+     * 
+     * Parameters: 
+     * nodes    - {Array} of {DOMElement} data to read/parse.
+     * options  - {Object} Hash of options
+     * 
+     */
+    parseStyles: function(nodes, options) {
+        for(var i=0, len=nodes.length; i<len; i++) {
+            var style = this.parseStyle(nodes[i]);
+            if(style) {
+                var styleName = (options.styleBaseUrl || "") + "#" + style.id;
+                
+                this.styles[styleName] = style;
+            }
+        }
+    },
+
+    /**
+     * Method: parseKmlColor
+     * Parses a kml color (in 'aabbggrr' format) and returns the corresponding 
+     * color and opacity or null if the color is invalid.
+     *
+     * Parameters: 
+     * kmlColor - {String} a kml formated color
+     *
+     * Returns:
+     * {Object}
+     */
+    parseKmlColor: function(kmlColor) {
+        var color = null;
+        if (kmlColor) {
+            var matches = kmlColor.match(this.regExes.kmlColor);
+            if (matches) {
+                color = {
+                    color: '#' + matches[4] + matches[3] + matches[2],
+                    opacity: parseInt(matches[1], 16) / 255
+                };
+            }
+        }
+        return color;
+    },
+
+    /**
+     * Method: parseStyle
+     * Parses the children of a <Style> node and builds the style hash
+     * accordingly
+     * 
+     * Parameters: 
+     * node - {DOMElement} <Style> node
+     * 
+     */
+    parseStyle: function(node) {
+        var style = {};
+        
+        var types = ["LineStyle", "PolyStyle", "IconStyle", "BalloonStyle", 
+                     "LabelStyle"];
+        var type, nodeList, geometry, parser;
+        for(var i=0, len=types.length; i<len; ++i) {
+            type = types[i];
+            styleTypeNode = this.getElementsByTagNameNS(node, 
+                                                   "*", type)[0];
+            if(!styleTypeNode) { 
+                continue;
+            }
+
+            // only deal with first geometry of this type
+            switch (type.toLowerCase()) {
+                case "linestyle":
+                    var kmlColor = this.parseProperty(styleTypeNode, "*", "color");
+                    var color = this.parseKmlColor(kmlColor);
+                    if (color) {
+                        style["strokeColor"] = color.color;
+                        style["strokeOpacity"] = color.opacity;
+                    }
+                    
+                    var width = this.parseProperty(styleTypeNode, "*", "width");
+                    if (width) {
+                        style["strokeWidth"] = width;
+                    }
+                    break;
+
+                case "polystyle":
+                    var kmlColor = this.parseProperty(styleTypeNode, "*", "color");
+                    var color = this.parseKmlColor(kmlColor);
+                    if (color) {
+                        style["fillOpacity"] = color.opacity;
+                        style["fillColor"] = color.color;
+                    }
+                    // Check if fill is disabled
+                    var fill = this.parseProperty(styleTypeNode, "*", "fill");
+                    if (fill == "0") {
+                        style["fillColor"] = "none";
+                    }
+                    // Check if outline is disabled
+                    var outline = this.parseProperty(styleTypeNode, "*", "outline");
+                    if (outline == "0") {
+                        style["strokeWidth"] = "0";
+                    }
+                   
+                    break;
+
+                case "iconstyle":
+                    // set scale
+                    var scale = parseFloat(this.parseProperty(styleTypeNode, 
+                                                          "*", "scale") || 1);
+  
+                    // set default width and height of icon
+                    var width = 32 * scale;
+                    var height = 32 * scale;
+
+                    var iconNode = this.getElementsByTagNameNS(styleTypeNode, 
+                                               "*", 
+                                               "Icon")[0];
+                    if (iconNode) {
+                        var href = this.parseProperty(iconNode, "*", "href");
+                        if (href) {                                                   
+
+                            var w = this.parseProperty(iconNode, "*", "w");
+                            var h = this.parseProperty(iconNode, "*", "h");
+
+                            // Settings for Google specific icons that are 64x64
+                            // We set the width and height to 64 and halve the
+                            // scale to prevent icons from being too big
+                            var google = "http://maps.google.com/mapfiles/kml";
+                            if (OpenLayers.String.startsWith(
+                                                 href, google) && !w && !h) {
+                                w = 64;
+                                h = 64;
+                                scale = scale / 2;
+                            }
+                                
+                            // if only dimension is defined, make sure the
+                            // other one has the same value
+                            w = w || h;
+                            h = h || w;
+
+                            if (w) {
+                                width = parseInt(w) * scale;
+                            }
+
+                            if (h) {
+                                height = parseInt(h) * scale;
+                            }
+
+                            // support for internal icons 
+                            //    (/root://icons/palette-x.png)
+                            // x and y tell the position on the palette:
+                            // - in pixels
+                            // - starting from the left bottom
+                            // We translate that to a position in the list 
+                            // and request the appropriate icon from the 
+                            // google maps website
+                            var matches = href.match(this.regExes.kmlIconPalette);
+                            if (matches)  {
+                                var palette = matches[1];
+                                var file_extension = matches[2];
+
+                                var x = this.parseProperty(iconNode, "*", "x");
+                                var y = this.parseProperty(iconNode, "*", "y");
+
+                                var posX = x ? x/32 : 0;
+                                var posY = y ? (7 - y/32) : 7;
+
+                                var pos = posY * 8 + posX;
+                                href = "http://maps.google.com/mapfiles/kml/pal" 
+                                     + palette + "/icon" + pos + file_extension;
+                            }
+
+                            style["graphicOpacity"] = 1; // fully opaque
+                            style["externalGraphic"] = href;
+                        }
+
+                    }
+
+
+                    // hotSpots define the offset for an Icon
+                    var hotSpotNode = this.getElementsByTagNameNS(styleTypeNode, 
+                                               "*", 
+                                               "hotSpot")[0];
+                    if (hotSpotNode) {
+                        var x = parseFloat(hotSpotNode.getAttribute("x"));
+                        var y = parseFloat(hotSpotNode.getAttribute("y"));
+
+                        var xUnits = hotSpotNode.getAttribute("xunits");
+                        if (xUnits == "pixels") {
+                            style["graphicXOffset"] = -x * scale;
+                        }
+                        else if (xUnits == "insetPixels") {
+                            style["graphicXOffset"] = -width + (x * scale);
+                        }
+                        else if (xUnits == "fraction") {
+                            style["graphicXOffset"] = -width * x;
+                        }
+
+                        var yUnits = hotSpotNode.getAttribute("yunits");
+                        if (yUnits == "pixels") {
+                            style["graphicYOffset"] = -height + (y * scale) + 1;
+                        }
+                        else if (yUnits == "insetPixels") {
+                            style["graphicYOffset"] = -(y * scale) + 1;
+                        }
+                        else if (yUnits == "fraction") {
+                            style["graphicYOffset"] =  -height * (1 - y) + 1;
+                        }
+                    }
+
+                    style["graphicWidth"] = width;
+                    style["graphicHeight"] = height;
+                    break;
+
+                case "balloonstyle":
+                    var balloonStyle = OpenLayers.Util.getXmlNodeValue(
+                                            styleTypeNode);
+                    if (balloonStyle) {
+                        style["balloonStyle"] = balloonStyle.replace(
+                                       this.regExes.straightBracket, "${$1}");
+                    }
+                    break;
+                case "labelstyle":
+                    var kmlColor = this.parseProperty(styleTypeNode, "*", "color");
+                    var color = this.parseKmlColor(kmlColor);
+                    if (color) {
+                        style["fontColor"] = color.color;
+                        style["fontOpacity"] = color.opacity;
+                    }
+                    break;
+
+                default:
+            }
+        }
+
+        // Some polygons have no line color, so we use the fillColor for that
+        if (!style["strokeColor"] && style["fillColor"]) {
+            style["strokeColor"] = style["fillColor"];
+        }
+
+        var id = node.getAttribute("id");
+        if (id && style) {
+            style.id = id;
+        }
+
+        return style;
+    },
+
+    /**
+     * Method: parseStyleMaps
+     * Looks for <Style> nodes in the data and parses them
+     * Also parses <StyleMap> nodes, but only uses the 'normal' key
+     * 
+     * Parameters: 
+     * nodes    - {Array} of {DOMElement} data to read/parse.
+     * options  - {Object} Hash of options
+     * 
+     */
+    parseStyleMaps: function(nodes, options) {
+        // Only the default or "normal" part of the StyleMap is processed now
+        // To do the select or "highlight" bit, we'd need to change lots more
+
+        for(var i=0, len=nodes.length; i<len; i++) {
+            var node = nodes[i];
+            var pairs = this.getElementsByTagNameNS(node, "*", 
+                            "Pair");
+
+            var id = node.getAttribute("id");
+            for (var j=0, jlen=pairs.length; j<jlen; j++) {
+                var pair = pairs[j];
+                // Use the shortcut in the SLD format to quickly retrieve the 
+                // value of a node. Maybe it's good to have a method in 
+                // Format.XML to do this
+                var key = this.parseProperty(pair, "*", "key");
+                var styleUrl = this.parseProperty(pair, "*", "styleUrl");
+
+                if (styleUrl && key == "normal") {
+                    this.styles[(options.styleBaseUrl || "") + "#" + id] =
+                        this.styles[(options.styleBaseUrl || "") + styleUrl];
+                }
+
+                if (styleUrl && key == "highlight") {
+                    // TODO: implement the "select" part
+                }
+
+            }
+        }
+
+    },
+
+
+    /**
+     * Method: parseFeatures
+     * Loop through all Placemark nodes and parse them.
+     * Will create a list of features
+     * 
+     * Parameters: 
+     * nodes    - {Array} of {DOMElement} data to read/parse.
+     * options  - {Object} Hash of options
+     * 
+     */
+    parseFeatures: function(nodes, options) {
+        var features = [];
+        for(var i=0, len=nodes.length; i<len; i++) {
+            var featureNode = nodes[i];
+            var feature = this.parseFeature.apply(this,[featureNode]) ;
+            if(feature) {
+
+                // Create reference to styleUrl 
+                if (this.extractStyles && feature.attributes &&
+                    feature.attributes.styleUrl) {
+                    feature.style = this.getStyle(feature.attributes.styleUrl, options);
+                }
+
+                if (this.extractStyles) {
+                    // Make sure that <Style> nodes within a placemark are 
+                    // processed as well
+                    var inlineStyleNode = this.getElementsByTagNameNS(featureNode,
+                                                        "*",
+                                                        "Style")[0];
+                    if (inlineStyleNode) {
+                        var inlineStyle= this.parseStyle(inlineStyleNode);
+                        if (inlineStyle) {
+                            feature.style = OpenLayers.Util.extend(
+                                feature.style, inlineStyle
+                            );
+                        }
+                    }
+                }
+
+                // check if gx:Track elements should be parsed
+                if (this.extractTracks) {
+                    var tracks = this.getElementsByTagNameNS(
+                        featureNode, this.namespaces.gx, "Track"
+                    );
+                    if (tracks && tracks.length > 0) {
+                        var track = tracks[0];
+                        var container = {
+                            features: [],
+                            feature: feature
+                        };
+                        this.readNode(track, container);
+                        if (container.features.length > 0) {
+                            features.push.apply(features, container.features);
+                        }
+                    }
+                } else {
+                    // add feature to list of features
+                    features.push(feature);                    
+                }
+            } else {
+                throw "Bad Placemark: " + i;
+            }
+        }
+
+        // add new features to existing feature list
+        this.features = this.features.concat(features);
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "kml": {
+            "when": function(node, container) {
+                container.whens.push(OpenLayers.Date.parse(
+                    this.getChildValue(node)
+                ));
+            },
+            "_trackPointAttribute": function(node, container) {
+                var name = node.nodeName.split(":").pop();
+                container.attributes[name].push(this.getChildValue(node));
+            }
+        },
+        "gx": {
+            "Track": function(node, container) {
+                var obj = {
+                    whens: [],
+                    points: [],
+                    angles: []
+                };
+                if (this.trackAttributes) {
+                    var name;
+                    obj.attributes = {};
+                    for (var i=0, ii=this.trackAttributes.length; i<ii; ++i) {
+                        name = this.trackAttributes[i];
+                        obj.attributes[name] = [];
+                        if (!(name in this.readers.kml)) {
+                            this.readers.kml[name] = this.readers.kml._trackPointAttribute;
+                        }
+                    }
+                }
+                this.readChildNodes(node, obj);
+                if (obj.whens.length !== obj.points.length) {
+                    throw new Error("gx:Track with unequal number of when (" + obj.whens.length + ") and gx:coord (" + obj.points.length + ") elements.");
+                }
+                var hasAngles = obj.angles.length > 0;
+                if (hasAngles && obj.whens.length !== obj.angles.length) {
+                    throw new Error("gx:Track with unequal number of when (" + obj.whens.length + ") and gx:angles (" + obj.angles.length + ") elements.");
+                }
+                var feature, point, angles;
+                for (var i=0, ii=obj.whens.length; i<ii; ++i) {
+                    feature = container.feature.clone();
+                    feature.fid = container.feature.fid || container.feature.id;
+                    point = obj.points[i];
+                    feature.geometry = point;
+                    if ("z" in point) {
+                        feature.attributes.altitude = point.z;
+                    }
+                    if (this.internalProjection && this.externalProjection) {
+                        feature.geometry.transform(
+                            this.externalProjection, this.internalProjection
+                        ); 
+                    }
+                    if (this.trackAttributes) {
+                        for (var j=0, jj=this.trackAttributes.length; j<jj; ++j) {
+                            feature.attributes[name] = obj.attributes[this.trackAttributes[j]][i];
+                        }
+                    }
+                    feature.attributes.when = obj.whens[i];
+                    feature.attributes.trackId = container.feature.id;
+                    if (hasAngles) {
+                        angles = obj.angles[i];
+                        feature.attributes.heading = parseFloat(angles[0]);
+                        feature.attributes.tilt = parseFloat(angles[1]);
+                        feature.attributes.roll = parseFloat(angles[2]);
+                    }
+                    container.features.push(feature);
+                }
+            },
+            "coord": function(node, container) {
+                var str = this.getChildValue(node);
+                var coords = str.replace(this.regExes.trimSpace, "").split(/\s+/);
+                var point = new OpenLayers.Geometry.Point(coords[0], coords[1]);
+                if (coords.length > 2) {
+                    point.z = parseFloat(coords[2]);
+                }
+                container.points.push(point);
+            },
+            "angles": function(node, container) {
+                var str = this.getChildValue(node);
+                var parts = str.replace(this.regExes.trimSpace, "").split(/\s+/);
+                container.angles.push(parts);
+            }
+        }
+    },
+    
+    /**
+     * Method: parseFeature
+     * This function is the core of the KML parsing code in OpenLayers.
+     *     It creates the geometries that are then attached to the returned
+     *     feature, and calls parseAttributes() to get attribute data out.
+     *
+     * Parameters:
+     * node - {DOMElement}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A vector feature.
+     */
+    parseFeature: function(node) {
+        // only accept one geometry per feature - look for highest "order"
+        var order = ["MultiGeometry", "Polygon", "LineString", "Point"];
+        var type, nodeList, geometry, parser;
+        for(var i=0, len=order.length; i<len; ++i) {
+            type = order[i];
+            this.internalns = node.namespaceURI ? 
+                    node.namespaceURI : this.kmlns;
+            nodeList = this.getElementsByTagNameNS(node, 
+                                                   this.internalns, type);
+            if(nodeList.length > 0) {
+                // only deal with first geometry of this type
+                var parser = this.parseGeometry[type.toLowerCase()];
+                if(parser) {
+                    geometry = parser.apply(this, [nodeList[0]]);
+                    if (this.internalProjection && this.externalProjection) {
+                        geometry.transform(this.externalProjection, 
+                                           this.internalProjection); 
+                    }                       
+                } else {
+                    OpenLayers.Console.error(OpenLayers.i18n(
+                                "unsupportedGeometryType", {'geomType':type}));
+                }
+                // stop looking for different geometry types
+                break;
+            }
+        }
+
+        // construct feature (optionally with attributes)
+        var attributes;
+        if(this.extractAttributes) {
+            attributes = this.parseAttributes(node);
+        }
+        var feature = new OpenLayers.Feature.Vector(geometry, attributes);
+
+        var fid = node.getAttribute("id") || node.getAttribute("name");
+        if(fid != null) {
+            feature.fid = fid;
+        }
+
+        return feature;
+    },        
+    
+    /**
+     * Method: getStyle
+     * Retrieves a style from a style hash using styleUrl as the key
+     * If the styleUrl doesn't exist yet, we try to fetch it 
+     * Internet
+     * 
+     * Parameters: 
+     * styleUrl  - {String} URL of style
+     * options   - {Object} Hash of options 
+     *
+     * Returns:
+     * {Object}  - (reference to) Style hash
+     */
+    getStyle: function(styleUrl, options) {
+
+        var styleBaseUrl = OpenLayers.Util.removeTail(styleUrl);
+
+        var newOptions = OpenLayers.Util.extend({}, options);
+        newOptions.depth++;
+        newOptions.styleBaseUrl = styleBaseUrl;
+
+        // Fetch remote Style URLs (if not fetched before) 
+        if (!this.styles[styleUrl] 
+                && !OpenLayers.String.startsWith(styleUrl, "#") 
+                && newOptions.depth <= this.maxDepth
+                && !this.fetched[styleBaseUrl] ) {
+
+            var data = this.fetchLink(styleBaseUrl);
+            if (data) {
+                this.parseData(data, newOptions);
+            }
+
+        }
+
+        // return requested style
+        var style = OpenLayers.Util.extend({}, this.styles[styleUrl]);
+        return style;
+    },
+    
+    /**
+     * Property: parseGeometry
+     * Properties of this object are the functions that parse geometries based
+     *     on their type.
+     */
+    parseGeometry: {
+        
+        /**
+         * Method: parseGeometry.point
+         * Given a KML node representing a point geometry, create an OpenLayers
+         *     point geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A KML Point node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.Point>} A point geometry.
+         */
+        point: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.internalns,
+                                                       "coordinates");
+            var coords = [];
+            if(nodeList.length > 0) {
+                var coordString = nodeList[0].firstChild.nodeValue;
+                coordString = coordString.replace(this.regExes.removeSpace, "");
+                coords = coordString.split(",");
+            }
+
+            var point = null;
+            if(coords.length > 1) {
+                // preserve third dimension
+                if(coords.length == 2) {
+                    coords[2] = null;
+                }
+                point = new OpenLayers.Geometry.Point(coords[0], coords[1],
+                                                      coords[2]);
+            } else {
+                throw "Bad coordinate string: " + coordString;
+            }
+            return point;
+        },
+        
+        /**
+         * Method: parseGeometry.linestring
+         * Given a KML node representing a linestring geometry, create an
+         *     OpenLayers linestring geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A KML LineString node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.LineString>} A linestring geometry.
+         */
+        linestring: function(node, ring) {
+            var nodeList = this.getElementsByTagNameNS(node, this.internalns,
+                                                       "coordinates");
+            var line = null;
+            if(nodeList.length > 0) {
+                var coordString = this.getChildValue(nodeList[0]);
+
+                coordString = coordString.replace(this.regExes.trimSpace,
+                                                  "");
+                coordString = coordString.replace(this.regExes.trimComma,
+                                                  ",");
+                var pointList = coordString.split(this.regExes.splitSpace);
+                var numPoints = pointList.length;
+                var points = new Array(numPoints);
+                var coords, numCoords;
+                for(var i=0; i<numPoints; ++i) {
+                    coords = pointList[i].split(",");
+                    numCoords = coords.length;
+                    if(numCoords > 1) {
+                        if(coords.length == 2) {
+                            coords[2] = null;
+                        }
+                        points[i] = new OpenLayers.Geometry.Point(coords[0],
+                                                                  coords[1],
+                                                                  coords[2]);
+                    } else {
+                        throw "Bad LineString point coordinates: " +
+                              pointList[i];
+                    }
+                }
+                if(numPoints) {
+                    if(ring) {
+                        line = new OpenLayers.Geometry.LinearRing(points);
+                    } else {
+                        line = new OpenLayers.Geometry.LineString(points);
+                    }
+                } else {
+                    throw "Bad LineString coordinates: " + coordString;
+                }
+            }
+
+            return line;
+        },
+        
+        /**
+         * Method: parseGeometry.polygon
+         * Given a KML node representing a polygon geometry, create an
+         *     OpenLayers polygon geometry.
+         *
+         * Parameters:
+         * node - {DOMElement} A KML Polygon node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.Polygon>} A polygon geometry.
+         */
+        polygon: function(node) {
+            var nodeList = this.getElementsByTagNameNS(node, this.internalns,
+                                                       "LinearRing");
+            var numRings = nodeList.length;
+            var components = new Array(numRings);
+            if(numRings > 0) {
+                // this assumes exterior ring first, inner rings after
+                var ring;
+                for(var i=0, len=nodeList.length; i<len; ++i) {
+                    ring = this.parseGeometry.linestring.apply(this,
+                                                        [nodeList[i], true]);
+                    if(ring) {
+                        components[i] = ring;
+                    } else {
+                        throw "Bad LinearRing geometry: " + i;
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.Polygon(components);
+        },
+        
+        /**
+         * Method: parseGeometry.multigeometry
+         * Given a KML node representing a multigeometry, create an
+         *     OpenLayers geometry collection.
+         *
+         * Parameters:
+         * node - {DOMElement} A KML MultiGeometry node.
+         *
+         * Returns:
+         * {<OpenLayers.Geometry.Collection>} A geometry collection.
+         */
+        multigeometry: function(node) {
+            var child, parser;
+            var parts = [];
+            var children = node.childNodes;
+            for(var i=0, len=children.length; i<len; ++i ) {
+                child = children[i];
+                if(child.nodeType == 1) {
+                    var type = (child.prefix) ?
+                            child.nodeName.split(":")[1] :
+                            child.nodeName;
+                    var parser = this.parseGeometry[type.toLowerCase()];
+                    if(parser) {
+                        parts.push(parser.apply(this, [child]));
+                    }
+                }
+            }
+            return new OpenLayers.Geometry.Collection(parts);
+        }
+        
+    },
+
+    /**
+     * Method: parseAttributes
+     *
+     * Parameters:
+     * node - {DOMElement}
+     *
+     * Returns:
+     * {Object} An attributes object.
+     */
+    parseAttributes: function(node) {
+        var attributes = {};
+       
+        // Extended Data is parsed first.
+        var edNodes = node.getElementsByTagName("ExtendedData");
+        if (edNodes.length) {
+            attributes = this.parseExtendedData(edNodes[0]);
+        }
+        
+        // assume attribute nodes are type 1 children with a type 3 or 4 child
+        var child, grandchildren, grandchild;
+        var children = node.childNodes;
+
+        for(var i=0, len=children.length; i<len; ++i) {
+            child = children[i];
+            if(child.nodeType == 1) {
+                grandchildren = child.childNodes;
+                if(grandchildren.length >= 1 && grandchildren.length <= 3) {
+                    var grandchild;
+                    switch (grandchildren.length) {
+                        case 1:
+                            grandchild = grandchildren[0];
+                            break;
+                        case 2:
+                            var c1 = grandchildren[0];
+                            var c2 = grandchildren[1];
+                            grandchild = (c1.nodeType == 3 || c1.nodeType == 4) ?
+                                c1 : c2;
+                            break;
+                        case 3:
+                        default:
+                            grandchild = grandchildren[1];
+                            break;
+                    }
+                    if(grandchild.nodeType == 3 || grandchild.nodeType == 4) {
+                        var name = (child.prefix) ?
+                                child.nodeName.split(":")[1] :
+                                child.nodeName;
+                        var value = OpenLayers.Util.getXmlNodeValue(grandchild);
+                        if (value) {
+                            value = value.replace(this.regExes.trimSpace, "");
+                            attributes[name] = value;
+                        }
+                    }
+                } 
+            }
+        }
+        return attributes;
+    },
+
+    /**
+     * Method: parseExtendedData
+     * Parse ExtendedData from KML. Limited support for schemas/datatypes.
+     *     See http://code.google.com/apis/kml/documentation/kmlreference.html#extendeddata
+     *     for more information on extendeddata.
+     */
+    parseExtendedData: function(node) {
+        var attributes = {};
+        var i, len, data, key;
+        var dataNodes = node.getElementsByTagName("Data");
+        for (i = 0, len = dataNodes.length; i < len; i++) {
+            data = dataNodes[i];
+            key = data.getAttribute("name");
+            var ed = {};
+            var valueNode = data.getElementsByTagName("value");
+            if (valueNode.length) {
+                ed['value'] = this.getChildValue(valueNode[0]);
+            }    
+            var nameNode = data.getElementsByTagName("displayName");
+            if (nameNode.length) {
+                ed['displayName'] = this.getChildValue(nameNode[0]);
+            }
+            attributes[key] = ed;
+        }
+        var simpleDataNodes = node.getElementsByTagName("SimpleData");
+        for (i = 0, len = simpleDataNodes.length; i < len; i++) {
+            var ed = {};
+            data = simpleDataNodes[i];
+            key = data.getAttribute("name");
+            ed['value'] = this.getChildValue(data);
+            ed['displayName'] = key;
+            attributes[key] = ed;
+        }
+        
+        return attributes;    
+    },
+    
+    /**
+     * Method: parseProperty
+     * Convenience method to find a node and return its value
+     *
+     * Parameters:
+     * xmlNode    - {<DOMElement>}
+     * namespace  - {String} namespace of the node to find
+     * tagName    - {String} name of the property to parse
+     * 
+     * Returns:
+     * {String} The value for the requested property (defaults to null)
+     */    
+    parseProperty: function(xmlNode, namespace, tagName) {
+        var value;
+        var nodeList = this.getElementsByTagNameNS(xmlNode, namespace, tagName);
+        try {
+            value = OpenLayers.Util.getXmlNodeValue(nodeList[0]);
+        } catch(e) {
+            value = null;
+        }
+     
+        return value;
+    },                                                              
+
+    /**
+     * APIMethod: write
+     * Accept Feature Collection, and return a string. 
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>} An array of features.
+     *
+     * Returns:
+     * {String} A KML string.
+     */
+    write: function(features) {
+        if(!(features instanceof Array)) {
+            features = [features];
+        }
+        var kml = this.createElementNS(this.kmlns, "kml");
+        var folder = this.createFolderXML();
+        for(var i=0, len=features.length; i<len; ++i) {
+            folder.appendChild(this.createPlacemarkXML(features[i]));
+        }
+        kml.appendChild(folder);
+        return OpenLayers.Format.XML.prototype.write.apply(this, [kml]);
+    },
+
+    /**
+     * Method: createFolderXML
+     * Creates and returns a KML folder node
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    createFolderXML: function() {
+        // Folder
+        var folder = this.createElementNS(this.kmlns, "Folder");
+
+        // Folder name
+        if (this.foldersName) {
+            var folderName = this.createElementNS(this.kmlns, "name");
+            var folderNameText = this.createTextNode(this.foldersName); 
+            folderName.appendChild(folderNameText);
+            folder.appendChild(folderName);
+        }
+
+        // Folder description
+        if (this.foldersDesc) {
+            var folderDesc = this.createElementNS(this.kmlns, "description");        
+            var folderDescText = this.createTextNode(this.foldersDesc); 
+            folderDesc.appendChild(folderDescText);
+            folder.appendChild(folderDesc);
+        }
+
+        return folder;
+    },
+
+    /**
+     * Method: createPlacemarkXML
+     * Creates and returns a KML placemark node representing the given feature. 
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    createPlacemarkXML: function(feature) {        
+        // Placemark name
+        var placemarkName = this.createElementNS(this.kmlns, "name");
+        var name = feature.style && feature.style.label ? feature.style.label :
+                   feature.attributes.name || feature.id;
+        placemarkName.appendChild(this.createTextNode(name));
+
+        // Placemark description
+        var placemarkDesc = this.createElementNS(this.kmlns, "description");
+        var desc = feature.attributes.description || this.placemarksDesc;
+        placemarkDesc.appendChild(this.createTextNode(desc));
+        
+        // Placemark
+        var placemarkNode = this.createElementNS(this.kmlns, "Placemark");
+        if(feature.fid != null) {
+            placemarkNode.setAttribute("id", feature.fid);
+        }
+        placemarkNode.appendChild(placemarkName);
+        placemarkNode.appendChild(placemarkDesc);
+
+        // Geometry node (Point, LineString, etc. nodes)
+        var geometryNode = this.buildGeometryNode(feature.geometry);
+        placemarkNode.appendChild(geometryNode);        
+        
+        // TBD - deal with remaining (non name/description) attributes.
+        return placemarkNode;
+    },    
+
+    /**
+     * Method: buildGeometryNode
+     * Builds and returns a KML geometry node with the given geometry.
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    buildGeometryNode: function(geometry) {
+        if (this.internalProjection && this.externalProjection) {
+            geometry = geometry.clone();
+            geometry.transform(this.internalProjection, 
+                               this.externalProjection);
+        }                       
+        var className = geometry.CLASS_NAME;
+        var type = className.substring(className.lastIndexOf(".") + 1);
+        var builder = this.buildGeometry[type.toLowerCase()];
+        var node = null;
+        if(builder) {
+            node = builder.apply(this, [geometry]);
+        }
+        return node;
+    },
+
+    /**
+     * Property: buildGeometry
+     * Object containing methods to do the actual geometry node building
+     *     based on geometry type.
+     */
+    buildGeometry: {
+        // TBD: Anybody care about namespace aliases here (these nodes have
+        //    no prefixes)?
+
+        /**
+         * Method: buildGeometry.point
+         * Given an OpenLayers point geometry, create a KML point.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Point>} A point geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML point node.
+         */
+        point: function(geometry) {
+            var kml = this.createElementNS(this.kmlns, "Point");
+            kml.appendChild(this.buildCoordinatesNode(geometry));
+            return kml;
+        },
+        
+        /**
+         * Method: buildGeometry.multipoint
+         * Given an OpenLayers multipoint geometry, create a KML
+         *     GeometryCollection.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Point>} A multipoint geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML GeometryCollection node.
+         */
+        multipoint: function(geometry) {
+            return this.buildGeometry.collection.apply(this, [geometry]);
+        },
+
+        /**
+         * Method: buildGeometry.linestring
+         * Given an OpenLayers linestring geometry, create a KML linestring.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.LineString>} A linestring geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML linestring node.
+         */
+        linestring: function(geometry) {
+            var kml = this.createElementNS(this.kmlns, "LineString");
+            kml.appendChild(this.buildCoordinatesNode(geometry));
+            return kml;
+        },
+        
+        /**
+         * Method: buildGeometry.multilinestring
+         * Given an OpenLayers multilinestring geometry, create a KML
+         *     GeometryCollection.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Point>} A multilinestring geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML GeometryCollection node.
+         */
+        multilinestring: function(geometry) {
+            return this.buildGeometry.collection.apply(this, [geometry]);
+        },
+
+        /**
+         * Method: buildGeometry.linearring
+         * Given an OpenLayers linearring geometry, create a KML linearring.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.LinearRing>} A linearring geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML linearring node.
+         */
+        linearring: function(geometry) {
+            var kml = this.createElementNS(this.kmlns, "LinearRing");
+            kml.appendChild(this.buildCoordinatesNode(geometry));
+            return kml;
+        },
+        
+        /**
+         * Method: buildGeometry.polygon
+         * Given an OpenLayers polygon geometry, create a KML polygon.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Polygon>} A polygon geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML polygon node.
+         */
+        polygon: function(geometry) {
+            var kml = this.createElementNS(this.kmlns, "Polygon");
+            var rings = geometry.components;
+            var ringMember, ringGeom, type;
+            for(var i=0, len=rings.length; i<len; ++i) {
+                type = (i==0) ? "outerBoundaryIs" : "innerBoundaryIs";
+                ringMember = this.createElementNS(this.kmlns, type);
+                ringGeom = this.buildGeometry.linearring.apply(this,
+                                                               [rings[i]]);
+                ringMember.appendChild(ringGeom);
+                kml.appendChild(ringMember);
+            }
+            return kml;
+        },
+        
+        /**
+         * Method: buildGeometry.multipolygon
+         * Given an OpenLayers multipolygon geometry, create a KML
+         *     GeometryCollection.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Point>} A multipolygon geometry.
+         *
+         * Returns:
+         * {DOMElement} A KML GeometryCollection node.
+         */
+        multipolygon: function(geometry) {
+            return this.buildGeometry.collection.apply(this, [geometry]);
+        },
+
+        /**
+         * Method: buildGeometry.collection
+         * Given an OpenLayers geometry collection, create a KML MultiGeometry.
+         *
+         * Parameters:
+         * geometry - {<OpenLayers.Geometry.Collection>} A geometry collection.
+         *
+         * Returns:
+         * {DOMElement} A KML MultiGeometry node.
+         */
+        collection: function(geometry) {
+            var kml = this.createElementNS(this.kmlns, "MultiGeometry");
+            var child;
+            for(var i=0, len=geometry.components.length; i<len; ++i) {
+                child = this.buildGeometryNode.apply(this,
+                                                     [geometry.components[i]]);
+                if(child) {
+                    kml.appendChild(child);
+                }
+            }
+            return kml;
+        }
+    },
+
+    /**
+     * Method: buildCoordinatesNode
+     * Builds and returns the KML coordinates node with the given geometry
+     * <coordinates>...</coordinates>
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Return:
+     * {DOMElement}
+     */     
+    buildCoordinatesNode: function(geometry) {
+        var coordinatesNode = this.createElementNS(this.kmlns, "coordinates");
+        
+        var path;
+        var points = geometry.components;
+        if(points) {
+            // LineString or LinearRing
+            var point;
+            var numPoints = points.length;
+            var parts = new Array(numPoints);
+            for(var i=0; i<numPoints; ++i) {
+                point = points[i];
+                parts[i] = point.x + "," + point.y;
+            }
+            path = parts.join(" ");
+        } else {
+            // Point
+            path = geometry.x + "," + geometry.y;
+        }
+        
+        var txtNode = this.createTextNode(path);
+        coordinatesNode.appendChild(txtNode);
+        
+        return coordinatesNode;
+    },    
+
+    CLASS_NAME: "OpenLayers.Format.KML" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Text.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Text.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Text.js	(revision 76)
@@ -0,0 +1,152 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Text
+ * Read Text format. Create a new instance with the <OpenLayers.Format.Text>
+ *     constructor. This reads text which is formatted like CSV text, using
+ *     tabs as the seperator by default. It provides parsing of data originally
+ *     used in the MapViewerService, described on the wiki. This Format is used
+ *     by the <OpenLayers.Layer.Text> class.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.Text = OpenLayers.Class(OpenLayers.Format, {
+    
+    /**
+     * APIProperty: defaultStyle
+     * defaultStyle allows one to control the default styling of the features.
+     *    It should be a symbolizer hash. By default, this is set to match the
+     *    Layer.Text behavior, which is to use the default OpenLayers Icon.
+     */
+    defaultStyle: null,
+     
+    /**
+     * APIProperty: extractStyles
+     * set to true to extract styles from the TSV files, using information
+     * from the image or icon, iconSize and iconOffset fields. This will result
+     * in features with a symbolizer (style) property set, using the
+     * default symbolizer specified in <defaultStyle>. Set to false if you
+     * wish to use a styleMap or OpenLayers.Style options to style your
+     * layer instead.
+     */
+    extractStyles: true,
+
+    /**
+     * Constructor: OpenLayers.Format.Text
+     * Create a new parser for TSV Text.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        options = options || {};
+
+        if(options.extractStyles !== false) {
+            options.defaultStyle = {
+                'externalGraphic': OpenLayers.Util.getImagesLocation() +
+                                                                "marker.png",
+                'graphicWidth': 21,
+                'graphicHeight': 25,
+                'graphicXOffset': -10.5,
+                'graphicYOffset': -12.5
+            };
+        }
+        
+        OpenLayers.Format.prototype.initialize.apply(this, [options]);
+    }, 
+
+    /**
+     * APIMethod: read
+     * Return a list of features from a Tab Seperated Values text string.
+     * 
+     * Parameters:
+     * data - {String} 
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s
+     */
+    read: function(text) {
+        var lines = text.split('\n');
+        var columns;
+        var features = [];
+        // length - 1 to allow for trailing new line
+        for (var lcv = 0; lcv < (lines.length - 1); lcv++) {
+            var currLine = lines[lcv].replace(/^\s*/,'').replace(/\s*$/,'');
+        
+            if (currLine.charAt(0) != '#') { /* not a comment */
+            
+                if (!columns) {
+                    //First line is columns
+                    columns = currLine.split('\t');
+                } else {
+                    var vals = currLine.split('\t');
+                    var geometry = new OpenLayers.Geometry.Point(0,0);
+                    var attributes = {};
+                    var style = this.defaultStyle ? 
+                        OpenLayers.Util.applyDefaults({}, this.defaultStyle) :
+                        null;  
+                    var icon, iconSize, iconOffset, overflow;
+                    var set = false;
+                    for (var valIndex = 0; valIndex < vals.length; valIndex++) {
+                        if (vals[valIndex]) {
+                            if (columns[valIndex] == 'point') {
+                                var coords = vals[valIndex].split(',');
+                                geometry.y = parseFloat(coords[0]);
+                                geometry.x = parseFloat(coords[1]);
+                                set = true;
+                            } else if (columns[valIndex] == 'lat') {
+                                geometry.y = parseFloat(vals[valIndex]);
+                                set = true;
+                            } else if (columns[valIndex] == 'lon') {
+                                geometry.x = parseFloat(vals[valIndex]);
+                                set = true;
+                            } else if (columns[valIndex] == 'title')
+                                attributes['title'] = vals[valIndex];
+                            else if (columns[valIndex] == 'image' ||
+                                     columns[valIndex] == 'icon' && style) {
+                                style['externalGraphic'] = vals[valIndex];
+                            } else if (columns[valIndex] == 'iconSize' && style) {
+                                var size = vals[valIndex].split(',');
+                                style['graphicWidth'] = parseFloat(size[0]);
+                                style['graphicHeight'] = parseFloat(size[1]);
+                            } else if (columns[valIndex] == 'iconOffset' && style) {
+                                var offset = vals[valIndex].split(',');
+                                style['graphicXOffset'] = parseFloat(offset[0]);
+                                style['graphicYOffset'] = parseFloat(offset[1]);
+                            } else if (columns[valIndex] == 'description') {
+                                attributes['description'] = vals[valIndex];
+                            } else if (columns[valIndex] == 'overflow') {
+                                attributes['overflow'] = vals[valIndex];
+                            } else {
+                                // For StyleMap filtering, allow additional
+                                // columns to be stored as attributes.
+                                attributes[columns[valIndex]] = vals[valIndex];
+                            }    
+                        }
+                    }
+                    if (set) {
+                      if (this.internalProjection && this.externalProjection) {
+                          geometry.transform(this.externalProjection, 
+                                             this.internalProjection); 
+                      }
+                      var feature = new OpenLayers.Feature.Vector(geometry, attributes, style);
+                      features.push(feature);
+                    }
+                }
+            }
+        }
+        return features;
+    },   
+
+    CLASS_NAME: "OpenLayers.Format.Text" 
+});    
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Filter.js	(revision 76)
@@ -0,0 +1,115 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Filter/FeatureId.js
+ * @requires OpenLayers/Filter/Logical.js
+ * @requires OpenLayers/Filter/Comparison.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Filter
+ * Read/Wite ogc:Filter. Create a new instance with the <OpenLayers.Format.Filter>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.Filter = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.0.0".
+     */
+    defaultVersion: "1.0.0",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+    
+    /**
+     * Property: parser
+     * {Object} Instance of the versioned parser.  Cached for multiple read and
+     *     write calls of the same version.
+     */
+    parser: null,
+
+    /**
+     * Constructor: OpenLayers.Format.Filter
+     * Create a new parser for Filter.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: write
+     * Write an ogc:Filter given a filter object.
+     *
+     * Parameters:
+     * filter - {<OpenLayers.Filter>} An filter.
+     * options - {Object} Optional configuration object.
+     *
+     * Returns:
+     * {Elment} An ogc:Filter element node.
+     */
+    write: function(filter, options) {
+        var version = (options && options.version) ||
+                      this.version || this.defaultVersion;
+        if(!this.parser || this.parser.VERSION != version) {
+            var format = OpenLayers.Format.Filter[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a Filter parser for version " +
+                      version;
+            }
+            this.parser = new format(this.options);
+        }
+        return this.parser.write(filter);
+        //return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Read and Filter doc and return an object representing the Filter.
+     *
+     * Parameters:
+     * data - {String | DOMElement} Data to read.
+     *
+     * Returns:
+     * {<OpenLayers.Filter>} A filter object.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var version = this.version;
+        if(!version) {
+            version = this.defaultVersion;
+        }
+        if(!this.parser || this.parser.VERSION != version) {
+            var format = OpenLayers.Format.Filter[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a Filter parser for version " +
+                      version;
+            }
+            this.parser = new format(this.options);
+        }
+        var filter = this.parser.read(data);
+        return filter;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.Filter" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML.js	(revision 76)
@@ -0,0 +1,1028 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/MultiPolygon.js
+ * @requires OpenLayers/Geometry/LinearRing.js
+ */
+
+/**
+ * Class: OpenLayers.Format.ArcXML
+ * Read/Wite ArcXML. Create a new instance with the <OpenLayers.Format.ArcXML>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.ArcXML = OpenLayers.Class(OpenLayers.Format.XML, {
+
+    /**
+     * Property: fontStyleKeys
+     * {Array} List of keys used in font styling.
+     */
+    fontStyleKeys: [
+        'antialiasing', 'blockout', 'font', 'fontcolor','fontsize', 'fontstyle',
+        'glowing', 'interval', 'outline', 'printmode', 'shadow', 'transparency'
+    ],
+
+    /**
+     * Property: request
+     * A get_image request destined for an ArcIMS server.
+     */
+    request: null,
+    
+    /**
+     * Property: response
+     * A parsed response from an ArcIMS server.
+     */
+    response: null,
+
+    /**
+     * Constructor: OpenLayers.Format.ArcXML
+     * Create a new parser/writer for ArcXML.  Create an instance of this class
+     *    to begin authoring a request to an ArcIMS service.  This is used
+     *    primarily by the ArcIMS layer, but could be used to do other wild
+     *    stuff, like geocoding.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        this.request = new OpenLayers.Format.ArcXML.Request();
+        this.response = new OpenLayers.Format.ArcXML.Response();
+
+        if (options) {
+            if (options.requesttype == "feature") {
+                this.request.get_image = null;
+            
+                var qry = this.request.get_feature.query;
+                this.addCoordSys(qry.featurecoordsys, options.featureCoordSys);
+                this.addCoordSys(qry.filtercoordsys, options.filterCoordSys);
+            
+                if (options.polygon) {
+                    qry.isspatial = true;
+                    qry.spatialfilter.polygon = options.polygon;
+                } else if (options.envelope) {
+                    qry.isspatial = true;
+                    qry.spatialfilter.envelope = {minx:0, miny:0, maxx:0, maxy:0};
+                    this.parseEnvelope(qry.spatialfilter.envelope, options.envelope);
+                }
+            } else if (options.requesttype == "image") {
+                this.request.get_feature = null;
+            
+                var props = this.request.get_image.properties;
+                this.parseEnvelope(props.envelope, options.envelope);
+            
+                this.addLayers(props.layerlist, options.layers);
+                this.addImageSize(props.imagesize, options.tileSize);
+                this.addCoordSys(props.featurecoordsys, options.featureCoordSys);
+                this.addCoordSys(props.filtercoordsys, options.filterCoordSys);
+            } else {
+                // if an arcxml object is being created with no request type, it is
+                // probably going to consume a response, so do not throw an error if
+                // the requesttype is not defined
+                this.request = null;
+            }
+        }
+        
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: parseEnvelope
+     * Parse an array of coordinates into an ArcXML envelope structure.
+     *
+     * Parameters:
+     * env - {Object} An envelope object that will contain the parsed coordinates.
+     * arr - {Array(double)} An array of coordinates in the order: [ minx, miny, maxx, maxy ]
+     */
+    parseEnvelope: function(env, arr) {
+        if (arr && arr.length == 4) {          
+            env.minx = arr[0];
+            env.miny = arr[1];
+            env.maxx = arr[2];
+            env.maxy = arr[3];
+        }
+    },
+    
+    /** 
+     * Method: addLayers
+     * Add a collection of layers to another collection of layers. Each layer in the list is tuple of
+     * { id, visible }.  These layer collections represent the 
+     * /ARCXML/REQUEST/get_image/PROPERTIES/LAYERLIST/LAYERDEF items in ArcXML
+     *
+     * TODO: Add support for dynamic layer rendering.
+     *
+     * Parameters:
+     * ll - {Array({id,visible})} A list of layer definitions.
+     * lyrs - {Array({id,visible})} A list of layer definitions.
+     */
+    addLayers: function(ll, lyrs) {
+        for(var lind = 0, len=lyrs.length; lind < len; lind++) {
+            ll.push(lyrs[lind]);
+        }
+    },
+    
+    /**
+     * Method: addImageSize
+     * Set the size of the requested image.
+     *
+     * Parameters:
+     * imsize - {Object} An ArcXML imagesize object.
+     * olsize - {OpenLayers.Size} The image size to set.
+     */
+    addImageSize: function(imsize, olsize) {
+        if (olsize !== null) {
+            imsize.width = olsize.w;
+            imsize.height = olsize.h;
+            imsize.printwidth = olsize.w;
+            imsize.printheight = olsize.h;
+        }
+    },
+
+    /**
+     * Method: addCoordSys
+     * Add the coordinate system information to an object. The object may be 
+     *
+     * Parameters:
+     * featOrFilt - {Object} A featurecoordsys or filtercoordsys ArcXML structure.
+     * fsys - {String} or {OpenLayers.Projection} or {filtercoordsys} or 
+     * {featurecoordsys} A projection representation. If it's a {String}, 
+     * the value is assumed to be the SRID.  If it's a {OpenLayers.Projection} 
+     * AND Proj4js is available, the projection number and name are extracted 
+     * from there.  If it's a filter or feature ArcXML structure, it is copied.
+     */
+    addCoordSys: function(featOrFilt, fsys) {
+        if (typeof fsys == "string") {
+            featOrFilt.id = parseInt(fsys);
+            featOrFilt.string = fsys;
+        }
+        // is this a proj4js instance?
+        else if (typeof fsys == "object" && fsys.proj !== null){
+            featOrFilt.id = fsys.proj.srsProjNumber;
+            featOrFilt.string = fsys.proj.srsCode;
+        } else {
+            featOrFilt = fsys;
+        }
+    },
+
+    /**
+     * APIMethod: iserror
+     * Check to see if the response from the server was an error.
+     *
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse. If nothing is supplied,
+     * the current response is examined.
+     *
+     * Returns:
+     * {Boolean} true if the response was an error.
+     */
+    iserror: function(data) {
+        var ret = null; 
+        
+        if (!data) {
+            ret = (this.response.error !== '');
+        } else {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+            var errorNodes = data.documentElement.getElementsByTagName("ERROR");
+            ret = (errorNodes !== null && errorNodes.length > 0);
+        }
+
+        return ret;
+    },
+
+    /**
+     * APIMethod: read
+     * Read data from a string, and return an response. 
+     * 
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {OpenLayers.Format.ArcXML.Response} An ArcXML response. Note that this response
+     *     data may change in the future. 
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        
+        var arcNode = null;
+        if (data && data.documentElement) {
+            if(data.documentElement.nodeName == "ARCXML") {
+                arcNode = data.documentElement;
+            } else {
+                arcNode = data.documentElement.getElementsByTagName("ARCXML")[0];
+            }
+        }
+          
+        // in Safari, arcNode will be there but will have a child named 
+        // parsererror
+        if (!arcNode || arcNode.firstChild.nodeName === 'parsererror') {
+            var error, source;
+            try {
+                error = data.firstChild.nodeValue;
+                source = data.firstChild.childNodes[1].firstChild.nodeValue;
+            } catch (err) {
+                // pass
+            }
+            throw {
+                message: "Error parsing the ArcXML request", 
+                error: error,
+                source: source
+            };
+        }
+        
+        var response = this.parseResponse(arcNode);
+        return response;
+    },
+    
+    /**
+     * APIMethod: write
+     * Generate an ArcXml document string for sending to an ArcIMS server. 
+     * 
+     * Returns:
+     * {String} A string representing the ArcXML document request.
+     */
+    write: function(request) {       
+        if (!request) {
+            request = this.request;
+        }    
+        var root = this.createElementNS("", "ARCXML");
+        root.setAttribute("version","1.1");
+
+        var reqElem = this.createElementNS("", "REQUEST");
+        
+        if (request.get_image != null) {
+            var getElem = this.createElementNS("", "GET_IMAGE");
+            reqElem.appendChild(getElem);
+
+            var propElem = this.createElementNS("", "PROPERTIES");
+            getElem.appendChild(propElem);
+
+            var props = request.get_image.properties;
+            if (props.featurecoordsys != null) {
+                var feat = this.createElementNS("", "FEATURECOORDSYS");
+                propElem.appendChild(feat);
+                
+                if (props.featurecoordsys.id === 0) {
+                    feat.setAttribute("string", props.featurecoordsys['string']);
+                }
+                else {
+                    feat.setAttribute("id", props.featurecoordsys.id);
+                }
+            }
+          
+            if (props.filtercoordsys != null) {
+                var filt = this.createElementNS("", "FILTERCOORDSYS");
+                propElem.appendChild(filt);
+
+                if (props.filtercoordsys.id === 0) {
+                    filt.setAttribute("string", props.filtercoordsys.string);
+                }
+                else {
+                    filt.setAttribute("id", props.filtercoordsys.id);
+                }
+            }
+          
+            if (props.envelope != null) {
+                var env = this.createElementNS("", "ENVELOPE");
+                propElem.appendChild(env);
+
+                env.setAttribute("minx", props.envelope.minx);
+                env.setAttribute("miny", props.envelope.miny);
+                env.setAttribute("maxx", props.envelope.maxx);
+                env.setAttribute("maxy", props.envelope.maxy);
+            }        
+          
+            var imagesz = this.createElementNS("", "IMAGESIZE");
+            propElem.appendChild(imagesz);
+          
+            imagesz.setAttribute("height", props.imagesize.height);
+            imagesz.setAttribute("width", props.imagesize.width);
+          
+            if (props.imagesize.height != props.imagesize.printheight ||
+                 props.imagesize.width != props.imagesize.printwidth) {
+                imagesz.setAttribute("printheight", props.imagesize.printheight);
+                imagesz.setArrtibute("printwidth", props.imagesize.printwidth);
+            }
+          
+            if (props.background != null) {
+                var backgrnd = this.createElementNS("", "BACKGROUND");
+                propElem.appendChild(backgrnd);
+            
+                backgrnd.setAttribute("color", 
+                    props.background.color.r + "," + 
+                    props.background.color.g + "," + 
+                    props.background.color.b);
+              
+                if (props.background.transcolor !== null) {
+                    backgrnd.setAttribute("transcolor", 
+                        props.background.transcolor.r + "," + 
+                        props.background.transcolor.g + "," + 
+                        props.background.transcolor.b);
+                }
+            }
+          
+            if (props.layerlist != null && props.layerlist.length > 0) {
+                var layerlst = this.createElementNS("", "LAYERLIST");
+                propElem.appendChild(layerlst);
+            
+                for (var ld = 0; ld < props.layerlist.length; ld++) {
+                    var ldef = this.createElementNS("", "LAYERDEF");
+                    layerlst.appendChild(ldef);
+              
+                    ldef.setAttribute("id", props.layerlist[ld].id);
+                    ldef.setAttribute("visible", props.layerlist[ld].visible);
+              
+                    if (typeof props.layerlist[ld].query == "object") {
+                        var query = props.layerlist[ld].query;
+
+                        if (query.where.length < 0) {
+                            continue;
+                        }
+                  
+                        var queryElem = null;
+                        if (typeof query.spatialfilter == "boolean" && query.spatialfilter) {
+                            // handle spatial filter madness
+                            queryElem = this.createElementNS("", "SPATIALQUERY");
+                        }
+                        else {
+                            queryElem = this.createElementNS("", "QUERY");
+                        }
+                
+                        queryElem.setAttribute("where", query.where);
+                
+                        if (typeof query.accuracy == "number" && query.accuracy > 0) {
+                            queryElem.setAttribute("accuracy", query.accuracy);
+                        }
+                        if (typeof query.featurelimit == "number" && query.featurelimit < 2000) {
+                            queryElem.setAttribute("featurelimit", query.featurelimit);
+                        }
+                        if (typeof query.subfields == "string" && query.subfields != "#ALL#") {
+                            queryElem.setAttribute("subfields", query.subfields);
+                        }
+                        if (typeof query.joinexpression == "string" && query.joinexpression.length > 0) {
+                            queryElem.setAttribute("joinexpression", query.joinexpression);
+                        }
+                        if (typeof query.jointables == "string" && query.jointables.length > 0) {
+                            queryElem.setAttribute("jointables", query.jointables);
+                        }
+
+                        ldef.appendChild(queryElem);
+                    }
+              
+                    if (typeof props.layerlist[ld].renderer == "object") {
+                        this.addRenderer(ldef, props.layerlist[ld].renderer);                  
+                    }
+                }
+            }
+        } else if (request.get_feature != null) {
+            var getElem = this.createElementNS("", "GET_FEATURES");
+            getElem.setAttribute("outputmode", "newxml");
+            getElem.setAttribute("checkesc", "true");
+          
+            if (request.get_feature.geometry) {
+                getElem.setAttribute("geometry", request.get_feature.geometry);
+            }
+            else {
+                getElem.setAttribute("geometry", "false");
+            }
+          
+            if (request.get_feature.compact) {
+                getElem.setAttribute("compact", request.get_feature.compact);
+            }
+          
+            if (request.get_feature.featurelimit == "number") {
+                getElem.setAttribute("featurelimit", request.get_feature.featurelimit);
+            }
+          
+            getElem.setAttribute("globalenvelope", "true");
+            reqElem.appendChild(getElem);
+          
+            if (request.get_feature.layer != null && request.get_feature.layer.length > 0) {
+                var lyrElem = this.createElementNS("", "LAYER");
+                lyrElem.setAttribute("id", request.get_feature.layer);
+                getElem.appendChild(lyrElem);
+            }
+          
+            var fquery = request.get_feature.query;
+            if (fquery != null) {
+                var qElem = null;
+                if (fquery.isspatial) {
+                    qElem = this.createElementNS("", "SPATIALQUERY");
+                } else {
+                    qElem = this.createElementNS("", "QUERY");
+                }
+                getElem.appendChild(qElem);
+                
+                if (typeof fquery.accuracy == "number") {
+                    qElem.setAttribute("accuracy", fquery.accuracy);
+                }
+                //qElem.setAttribute("featurelimit", "5");
+            
+                if (fquery.featurecoordsys != null) {
+                    var fcsElem1 = this.createElementNS("", "FEATURECOORDSYS");
+              
+                    if (fquery.featurecoordsys.id == 0) {
+                        fcsElem1.setAttribute("string", fquery.featurecoordsys.string);
+                    } else {
+                        fcsElem1.setAttribute("id", fquery.featurecoordsys.id);
+                    }
+                    qElem.appendChild(fcsElem1);
+                }
+            
+                if (fquery.filtercoordsys != null) {
+                    var fcsElem2 = this.createElementNS("", "FILTERCOORDSYS");
+              
+                    if (fquery.filtercoordsys.id === 0) {
+                        fcsElem2.setAttribute("string", fquery.filtercoordsys.string);
+                    } else {
+                        fcsElem2.setAttribute("id", fquery.filtercoordsys.id);
+                    }
+                    qElem.appendChild(fcsElem2);
+                }
+            
+                if (fquery.buffer > 0) {   
+                    var bufElem = this.createElementNS("", "BUFFER");
+                    bufElem.setAttribute("distance", fquery.buffer);
+                    qElem.appendChild(bufElem);
+                }
+            
+                if (fquery.isspatial) {
+                    var spfElem = this.createElementNS("", "SPATIALFILTER");
+                    spfElem.setAttribute("relation", fquery.spatialfilter.relation);
+                    qElem.appendChild(spfElem);
+              
+                    if (fquery.spatialfilter.envelope) {
+                        var envElem = this.createElementNS("", "ENVELOPE"); 
+                        envElem.setAttribute("minx", fquery.spatialfilter.envelope.minx);
+                        envElem.setAttribute("miny", fquery.spatialfilter.envelope.miny);
+                        envElem.setAttribute("maxx", fquery.spatialfilter.envelope.maxx);
+                        envElem.setAttribute("maxy", fquery.spatialfilter.envelope.maxy);
+                        spfElem.appendChild(envElem);
+                    } else if(typeof fquery.spatialfilter.polygon == "object") {
+                        spfElem.appendChild(this.writePolygonGeometry(fquery.spatialfilter.polygon));                
+                    }
+                }
+            
+                if (fquery.where != null && fquery.where.length > 0) {
+                    qElem.setAttribute("where", fquery.where);
+                }
+            }
+        }
+
+        root.appendChild(reqElem);
+
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    },
+    
+    
+    addGroupRenderer: function(ldef, toprenderer) {
+        var topRelem = this.createElementNS("", "GROUPRENDERER");
+        ldef.appendChild(topRelem);
+      
+        for (var rind = 0; rind < toprenderer.length; rind++) {
+            var renderer = toprenderer[rind];
+            this.addRenderer(topRelem, renderer);
+        }
+    },
+    
+    
+    addRenderer: function(topRelem, renderer) {
+        if (renderer instanceof Array) {
+            this.addGroupRenderer(topRelem, renderer);
+        } else {
+            var renderElem = this.createElementNS("", renderer.type.toUpperCase() + "RENDERER");
+            topRelem.appendChild(renderElem);
+          
+            if (renderElem.tagName == "VALUEMAPRENDERER") {
+                this.addValueMapRenderer(renderElem, renderer);
+            } else if (renderElem.tagName == "VALUEMAPLABELRENDERER") {
+                this.addValueMapLabelRenderer(renderElem, renderer);
+            } else if (renderElem.tagName == "SIMPLELABELRENDERER") {
+                this.addSimpleLabelRenderer(renderElem, renderer);
+            } else if (renderElem.tagName == "SCALEDEPENDENTRENDERER") {
+                this.addScaleDependentRenderer(renderElem, renderer);
+            }
+        }             
+    },
+    
+    
+    addScaleDependentRenderer: function(renderElem, renderer) {
+        if (typeof renderer.lower == "string" || typeof renderer.lower == "number") {
+            renderElem.setAttribute("lower", renderer.lower);
+        }
+        if (typeof renderer.upper == "string" || typeof renderer.upper == "number") {
+            renderElem.setAttribute("upper", renderer.upper);
+        }
+        
+        this.addRenderer(renderElem, renderer.renderer);
+    },
+    
+    
+    addValueMapLabelRenderer: function(renderElem, renderer) {
+        renderElem.setAttribute("lookupfield", renderer.lookupfield);
+        renderElem.setAttribute("labelfield", renderer.labelfield);
+      
+        if (typeof renderer.exacts == "object") {
+            for (var ext=0, extlen=renderer.exacts.length; ext<extlen; ext++) {
+                var exact = renderer.exacts[ext];
+          
+                var eelem = this.createElementNS("", "EXACT");
+          
+                if (typeof exact.value == "string") {
+                    eelem.setAttribute("value", exact.value);
+                }
+                if (typeof exact.label == "string") {
+                    eelem.setAttribute("label", exact.label);
+                }
+                if (typeof exact.method == "string") {
+                    eelem.setAttribute("method", exact.method);
+                }
+
+                renderElem.appendChild(eelem);
+            
+                if (typeof exact.symbol == "object") {
+                    var selem = null;
+                
+                    if (exact.symbol.type == "text") {
+                        selem = this.createElementNS("", "TEXTSYMBOL");
+                    }
+                
+                    if (selem != null) {
+                        var keys = this.fontStyleKeys;
+                        for (var i = 0, len = keys.length; i < len; i++) {
+                            var key = keys[i];
+                            if (exact.symbol[key]) {
+                                selem.setAttribute(key, exact.symbol[key]);
+                            }
+                        }    
+                        eelem.appendChild(selem);
+                    }
+                }
+            } // for each exact
+        }      
+    },
+    
+    addValueMapRenderer: function(renderElem, renderer) {
+        renderElem.setAttribute("lookupfield", renderer.lookupfield);
+        
+        if (typeof renderer.ranges == "object") {
+            for(var rng=0, rnglen=renderer.ranges.length; rng<rnglen; rng++) {
+                var range = renderer.ranges[rng];
+                
+                var relem = this.createElementNS("", "RANGE");
+                relem.setAttribute("lower", range.lower);
+                relem.setAttribute("upper", range.upper);
+                
+                renderElem.appendChild(relem);
+                
+                if (typeof range.symbol == "object") {
+                    var selem = null;
+              
+                    if (range.symbol.type == "simplepolygon") {
+                        selem = this.createElementNS("", "SIMPLEPOLYGONSYMBOL");
+                    }
+              
+                    if (selem != null) {
+                        if (typeof range.symbol.boundarycolor == "string") {
+                            selem.setAttribute("boundarycolor", range.symbol.boundarycolor);
+                        }
+                        if (typeof range.symbol.fillcolor == "string") {
+                            selem.setAttribute("fillcolor", range.symbol.fillcolor);
+                        }
+                        if (typeof range.symbol.filltransparency == "number") {
+                            selem.setAttribute("filltransparency", range.symbol.filltransparency);
+                        }
+                        relem.appendChild(selem);
+                    }   
+                }
+            } // for each range
+        } else if (typeof renderer.exacts == "object") {
+            for (var ext=0, extlen=renderer.exacts.length; ext<extlen; ext++) {
+                var exact = renderer.exacts[ext];
+          
+                var eelem = this.createElementNS("", "EXACT");
+                if (typeof exact.value == "string") {
+                    eelem.setAttribute("value", exact.value);
+                }
+                if (typeof exact.label == "string") {
+                    eelem.setAttribute("label", exact.label);
+                }
+                if (typeof exact.method == "string") {
+                    eelem.setAttribute("method", exact.method);
+                }
+            
+                renderElem.appendChild(eelem);
+            
+                if (typeof exact.symbol == "object") {
+                    var selem = null;
+            
+                    if (exact.symbol.type == "simplemarker") {
+                        selem = this.createElementNS("", "SIMPLEMARKERSYMBOL");
+                    }
+            
+                    if (selem != null) {
+                        if (typeof exact.symbol.antialiasing == "string") {
+                            selem.setAttribute("antialiasing", exact.symbol.antialiasing);
+                        }
+                        if (typeof exact.symbol.color == "string") {
+                            selem.setAttribute("color", exact.symbol.color);
+                        }
+                        if (typeof exact.symbol.outline == "string") {
+                            selem.setAttribute("outline", exact.symbol.outline);
+                        }
+                        if (typeof exact.symbol.overlap == "string") {
+                            selem.setAttribute("overlap", exact.symbol.overlap);
+                        }
+                        if (typeof exact.symbol.shadow == "string") {
+                            selem.setAttribute("shadow", exact.symbol.shadow);
+                        }
+                        if (typeof exact.symbol.transparency == "number") {
+                            selem.setAttribute("transparency", exact.symbol.transparency);
+                        }
+                        //if (typeof exact.symbol.type == "string")
+                        //    selem.setAttribute("type", exact.symbol.type);
+                        if (typeof exact.symbol.usecentroid == "string") {
+                            selem.setAttribute("usecentroid", exact.symbol.usecentroid);
+                        }
+                        if (typeof exact.symbol.width == "number") {
+                            selem.setAttribute("width", exact.symbol.width);
+                        }
+                
+                        eelem.appendChild(selem);
+                    }
+                }
+            } // for each exact
+        }
+    },
+    
+    
+    addSimpleLabelRenderer: function(renderElem, renderer) {
+        renderElem.setAttribute("field", renderer.field);
+        var keys = ['featureweight', 'howmanylabels', 'labelbufferratio', 
+                    'labelpriorities', 'labelweight', 'linelabelposition',
+                    'rotationalangles'];
+        for (var i=0, len=keys.length; i<len; i++) {
+            var key = keys[i];
+            if (renderer[key]) {
+                renderElem.setAttribute(key, renderer[key]);
+            }
+        }     
+           
+        if (renderer.symbol.type == "text") {
+            var symbol = renderer.symbol;
+            var selem = this.createElementNS("", "TEXTSYMBOL");
+            renderElem.appendChild(selem);
+          
+            var keys = this.fontStyleKeys;
+            for (var i=0, len=keys.length; i<len; i++) {
+                var key = keys[i];
+                if (symbol[key]) {
+                    selem.setAttribute(key, renderer[key]);
+                }
+            }    
+        }    
+    },
+    
+    writePolygonGeometry: function(polygon) {
+        if (!(polygon instanceof OpenLayers.Geometry.Polygon)) {
+            throw { 
+                message:'Cannot write polygon geometry to ArcXML with an ' +
+                    polygon.CLASS_NAME + ' object.',
+                geometry: polygon
+            };
+        }
+        
+        var polyElem = this.createElementNS("", "POLYGON");
+      
+        for (var ln=0, lnlen=polygon.components.length; ln<lnlen; ln++) {
+            var ring = polygon.components[ln];
+            var ringElem = this.createElementNS("", "RING");
+        
+            for (var rn=0, rnlen=ring.components.length; rn<rnlen; rn++) {
+                var point = ring.components[rn];
+                var pointElem = this.createElementNS("", "POINT");
+            
+                pointElem.setAttribute("x", point.x);
+                pointElem.setAttribute("y", point.y);
+            
+                ringElem.appendChild(pointElem);
+            }
+        
+            polyElem.appendChild(ringElem);
+        }
+      
+        return polyElem;
+    },
+    
+    /**
+     * Method: parseResponse
+     * Take an ArcXML response, and parse in into this object's internal properties.
+     *
+     * Parameters:
+     * data - {String} or {DOMElement} The ArcXML response, as either a string or the
+     * top level DOMElement of the response.
+     */
+    parseResponse: function(data) {
+        if(typeof data == "string") { 
+            var newData = new OpenLayers.Format.XML();
+            data = newData.read(data);
+        }
+        var response = new OpenLayers.Format.ArcXML.Response();
+        
+        var errorNode = data.getElementsByTagName("ERROR");
+        
+        if (errorNode != null && errorNode.length > 0) {
+            response.error = this.getChildValue(errorNode, "Unknown error.");
+        } else {
+            var responseNode = data.getElementsByTagName("RESPONSE");
+          
+            if (responseNode == null || responseNode.length == 0) {
+                response.error = "No RESPONSE tag found in ArcXML response.";
+                return response;
+            }
+          
+            var rtype = responseNode[0].firstChild.nodeName;
+            if (rtype == "#text") {
+                rtype = responseNode[0].firstChild.nextSibling.nodeName;
+            }
+          
+            if (rtype == "IMAGE") {
+                var envelopeNode = data.getElementsByTagName("ENVELOPE");
+                var outputNode = data.getElementsByTagName("OUTPUT");
+                
+                if (envelopeNode == null || envelopeNode.length == 0) {
+                    response.error = "No ENVELOPE tag found in ArcXML response.";
+                } else if (outputNode == null || outputNode.length == 0) {
+                    response.error = "No OUTPUT tag found in ArcXML response.";
+                } else {
+                    var envAttr = this.parseAttributes(envelopeNode[0]);            
+                    var outputAttr = this.parseAttributes(outputNode[0]);
+                  
+                    if (typeof outputAttr.type == "string") {
+                        response.image = { 
+                            envelope: envAttr, 
+                            output: { 
+                                type: outputAttr.type, 
+                                data: this.getChildValue(outputNode[0])
+                            }
+                        };
+                    } else {
+                        response.image = { envelope: envAttr, output: outputAttr };
+                    }
+                }
+            } else if (rtype == "FEATURES") {
+                var features = responseNode[0].getElementsByTagName("FEATURES");
+            
+                // get the feature count
+                var featureCount = features[0].getElementsByTagName("FEATURECOUNT");
+                response.features.featurecount = featureCount[0].getAttribute("count");
+            
+                if (response.features.featurecount > 0) {
+                    // get the feature envelope
+                    var envelope = features[0].getElementsByTagName("ENVELOPE");
+                    response.features.envelope = this.parseAttributes(envelope[0], typeof(0));
+
+                    // get the field values per feature
+                    var featureList = features[0].getElementsByTagName("FEATURE");
+                    for (var fn = 0; fn < featureList.length; fn++) {
+                        var feature = new OpenLayers.Feature.Vector();
+                        var fields = featureList[fn].getElementsByTagName("FIELD");
+
+                        for (var fdn = 0; fdn < fields.length; fdn++) {
+                            var fieldName = fields[fdn].getAttribute("name");
+                            var fieldValue = fields[fdn].getAttribute("value");
+                            feature.attributes[ fieldName ] = fieldValue;
+                        }
+
+                        var geom = featureList[fn].getElementsByTagName("POLYGON");
+
+                        if (geom.length > 0) {
+                            // if there is a polygon, create an openlayers polygon, and assign
+                            // it to the .geometry property of the feature
+                            var ring = geom[0].getElementsByTagName("RING");
+
+                            var polys = [];
+                            for (var rn = 0; rn < ring.length; rn++) {
+                                var linearRings = [];
+                                linearRings.push(this.parsePointGeometry(ring[rn]));
+
+                                var holes = ring[rn].getElementsByTagName("HOLE");
+                                for (var hn = 0; hn < holes.length; hn++) {
+                                    linearRings.push(this.parsePointGeometry(holes[hn]));
+                                }
+                                holes = null;
+                                polys.push(new OpenLayers.Geometry.Polygon(linearRings));
+                                linearRings = null;
+                            }
+                            ring = null;
+                          
+                            if (polys.length == 1) {
+                                feature.geometry = polys[0];
+                            } else
+                            {
+                                feature.geometry = new OpenLayers.Geometry.MultiPolygon(polys);
+                            }
+                        }
+
+                        response.features.feature.push(feature);
+                    }
+                }
+            } else {
+                response.error = "Unidentified response type.";
+            }
+        }
+        return response;
+    },
+    
+    
+    /**
+     * Method: parseAttributes
+     *
+     * Parameters:
+     * node - {<DOMElement>} An element to parse attributes from.
+     *
+     * Returns:
+     * {Object} An attributes object, with properties set to attribute values.
+     */
+    parseAttributes: function(node,type) {
+        var attributes = {};
+        for(var attr = 0; attr < node.attributes.length; attr++) {
+            if (type == "number") {
+                attributes[node.attributes[attr].nodeName] = parseFloat(node.attributes[attr].nodeValue);
+            } else {
+                attributes[node.attributes[attr].nodeName] = node.attributes[attr].nodeValue;
+            }
+        }
+        return attributes;
+    },
+    
+    
+    /**
+     * Method: parsePointGeometry
+     *
+     * Parameters:
+     * node - {<DOMElement>} An element to parse <COORDS> or <POINT> arcxml data from.
+     *
+     * Returns:
+     * {OpenLayers.Geometry.LinearRing} A linear ring represented by the node's points.
+     */
+    parsePointGeometry: function(node) {
+        var ringPoints = [];
+        var coords = node.getElementsByTagName("COORDS");
+
+        if (coords.length > 0) {
+            // if coords is present, it's the only coords item
+            var coordArr = this.getChildValue(coords[0]);
+            coordArr = coordArr.split(/;/);
+            for (var cn = 0; cn < coordArr.length; cn++) {
+                var coordItems = coordArr[cn].split(/ /);
+                ringPoints.push(new OpenLayers.Geometry.Point(parseFloat(coordItems[0]), parseFloat(coordItems[1])));
+            }
+            coords = null;
+        } else {
+            var point = node.getElementsByTagName("POINT");
+            if (point.length > 0) {
+                for (var pn = 0; pn < point.length; pn++) {
+                    ringPoints.push(
+                        new OpenLayers.Geometry.Point(
+                            parseFloat(point[pn].getAttribute("x")),
+                            parseFloat(point[pn].getAttribute("y"))
+                        )
+                    );
+                }
+            }
+            point = null;
+        }
+
+        return new OpenLayers.Geometry.LinearRing(ringPoints);      
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.ArcXML" 
+});
+
+OpenLayers.Format.ArcXML.Request = OpenLayers.Class({
+    initialize: function(params) {
+        var defaults = {
+            get_image: {
+                properties: {
+                    background: null,
+                    /*{ 
+                        color: { r:255, g:255, b:255 },
+                        transcolor: null
+                    },*/
+                    draw: true,
+                    envelope: {
+                        minx: 0, 
+                        miny: 0, 
+                        maxx: 0, 
+                        maxy: 0
+                    },
+                    featurecoordsys: { 
+                        id:0, 
+                        string:"",
+                        datumtransformid:0,
+                        datumtransformstring:""
+                    },
+                    filtercoordsys:{
+                        id:0,
+                        string:"",
+                        datumtransformid:0,
+                        datumtransformstring:""
+                    },
+                    imagesize:{
+                        height:0,
+                        width:0,
+                        dpi:96,
+                        printheight:0,
+                        printwidth:0,
+                        scalesymbols:false
+                    },
+                    layerlist:[],
+                    /* no support for legends */
+                    output:{
+                        baseurl:"",
+                        legendbaseurl:"",
+                        legendname:"",
+                        legendpath:"",
+                        legendurl:"",
+                        name:"",
+                        path:"",
+                        type:"jpg",
+                        url:""
+                    }
+                }
+            },
+
+            get_feature: {
+                layer: "",
+                query: {
+                    isspatial: false,
+                    featurecoordsys: {
+                        id:0,
+                        string:"",
+                        datumtransformid:0,
+                        datumtransformstring:""
+                    },
+                    filtercoordsys: {
+                        id:0,
+                        string:"",
+                        datumtransformid:0,
+                        datumtransformstring:""
+                    },
+                    buffer:0,
+                    where:"",
+                    spatialfilter: {
+                        relation: "envelope_intersection",
+                        envelope: null
+                    }
+                }
+            },
+      
+            environment: {
+                separators: {
+                    cs:" ",
+                    ts:";"
+                }
+            },
+      
+            layer: [],
+            workspaces: []
+        };
+      
+        return OpenLayers.Util.extend(this, defaults);      
+    },
+  
+    CLASS_NAME: "OpenLayers.Format.ArcXML.Request"
+});
+
+OpenLayers.Format.ArcXML.Response = OpenLayers.Class({  
+    initialize: function(params) {
+        var defaults = {
+            image: {
+                envelope:null,
+                output:''
+            },
+      
+            features: {
+                featurecount: 0,
+                envelope: null,
+                feature: []
+            },
+      
+            error:''
+        };
+  
+        return OpenLayers.Util.extend(this, defaults);
+    },
+  
+    CLASS_NAME: "OpenLayers.Format.ArcXML.Response"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer/v1_1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer/v1_1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSDescribeLayer/v1_1.js	(revision 76)
@@ -0,0 +1,100 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSDescribeLayer.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSDescribeLayer.v1_1
+ * Read SLD WMS DescribeLayer response for WMS 1.1.X
+ * WMS 1.1.X is tightly coupled to SLD 1.0.0
+ *
+ * Example DescribeLayer request: 
+ * http://demo.opengeo.org/geoserver/wms?request=DescribeLayer&version=1.1.1&layers=topp:states
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSDescribeLayer>
+ */
+OpenLayers.Format.WMSDescribeLayer.v1_1 = OpenLayers.Class(
+    OpenLayers.Format.WMSDescribeLayer, {
+    
+    /**
+     * Constructor: OpenLayers.Format.WMSDescribeLayer
+     * Create a new parser for WMS DescribeLayer responses.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WMSDescribeLayer.prototype.initialize.apply(this, 
+            [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Read DescribeLayer data from a string, and return the response. 
+     * The OGC defines 2 formats which are allowed for output,
+     * so we need to parse these 2 types for version 1.1.X
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} Array of {<LayerDescription>} objects which have:
+     * - {String} owsType: WFS/WCS
+     * - {String} owsURL: the online resource
+     * - {String} typeName: the name of the typename on the service
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var children = root.childNodes; 
+        var describelayer = [];
+        var childNode, nodeName;
+        for(var i=0; i<children.length; ++i) { 
+            childNode = children[i];
+            nodeName = childNode.nodeName; 
+            if (nodeName == 'LayerDescription') {
+                var layerName = childNode.getAttribute('name');
+                var owsType = '';
+                var owsURL = '';
+                var typeName = '';
+                // check for owsType and owsURL attributes
+                if (childNode.getAttribute('owsType')) {
+                  owsType = childNode.getAttribute('owsType');
+                  owsURL = childNode.getAttribute('owsURL');
+                } else {
+                    // look for wfs or wcs attribute
+                    if (childNode.getAttribute('wfs') != '') {
+                        owsType = 'WFS';
+                        owsURL = childNode.getAttribute('wfs');
+                    } else if (childNode.getAttribute('wcs') != '') {
+                        owsType = 'WCS';
+                        owsURL = childNode.getAttribute('wcs');
+                    }
+                }
+                // look for Query child
+                var query = childNode.getElementsByTagName('Query');
+                if(query.length > 0) {
+                    typeName = query[0].getAttribute('typeName');
+                    if (!typeName) {
+                        // because of Ionic bug
+                        typeName = query[0].getAttribute('typename');
+                    }
+                }
+                describelayer.push({layerName: layerName, owsType: owsType, 
+                    owsURL: owsURL, typeName: typeName}); 
+            }
+        }
+        return describelayer;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WMSDescribeLayer.v1_1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSGetFeatureInfo.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSGetFeatureInfo.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSGetFeatureInfo.js	(revision 76)
@@ -0,0 +1,284 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSGetFeatureInfo
+ * Class to read GetFeatureInfo responses from Web Mapping Services
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMSGetFeatureInfo = OpenLayers.Class(OpenLayers.Format.XML, {
+
+    /**
+     * APIProperty: layerIdentifier
+     * {String} All xml nodes containing this search criteria will populate an
+     *     internal array of layer nodes.
+     */ 
+    layerIdentifier: '_layer',
+
+    /**
+     * APIProperty: featureIdentifier
+     * {String} All xml nodes containing this search criteria will populate an 
+     *     internal array of feature nodes for each layer node found.
+     */
+    featureIdentifier: '_feature',
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Property: gmlFormat
+     * {<OpenLayers.Format.GML>} internal GML format for parsing geometries
+     *     in msGMLOutput
+     */
+    gmlFormat: null,
+
+    /**
+     * Constructor: OpenLayers.Format.WMSGetFeatureInfo
+     * Create a new parser for WMS GetFeatureInfo responses
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, arguments);
+        OpenLayers.Util.extend(this, options);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read WMS GetFeatureInfo data from a string, and return an array of features
+     *
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} An array of features.
+     */
+    read: function(data) {
+        var result;
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        if(root) {
+            var scope = this;
+            var read = this["read_" + root.nodeName];
+            if(read) {
+                result = read.call(this, root);
+            } else {
+                // fall-back to GML since this is a common output format for WMS
+                // GetFeatureInfo responses
+                result = new OpenLayers.Format.GML((this.options ? this.options : {})).read(data);
+            }
+        } else {
+            result = data;
+        }
+        return result;
+    },
+    
+    
+    /**
+     * Method: read_msGMLOutput
+     * Parse msGMLOutput nodes.
+     *
+     * Parameters:
+     * data - {DOMElement}
+     *
+     * Returns:
+     * {Array}
+     */
+    read_msGMLOutput: function(data) {
+        var response = [];
+        var layerNodes = this.getSiblingNodesByTagCriteria(data,
+            this.layerIdentifier);
+        if (layerNodes) {
+            for (var i=0, len=layerNodes.length; i<len; ++i) {
+                var node = layerNodes[i];
+                var layerName = node.nodeName;
+                if (node.prefix) {
+                    layerName = layerName.split(':')[1];
+                }
+                var layerName = layerName.replace(this.layerIdentifier, '');
+                var featureNodes = this.getSiblingNodesByTagCriteria(node, 
+                    this.featureIdentifier);
+                if (featureNodes) {
+                    for (var j = 0; j < featureNodes.length; j++) {
+                        var featureNode = featureNodes[j];
+                        var geomInfo = this.parseGeometry(featureNode);
+                        var attributes = this.parseAttributes(featureNode);
+                        var feature = new OpenLayers.Feature.Vector(geomInfo.geometry, 
+                            attributes, null);
+                        feature.bounds = geomInfo.bounds;
+                        feature.type = layerName;
+                        response.push(feature);
+                    }
+                }
+            }
+        }
+        return response;
+    },
+    
+    /**
+     * Method: read_FeatureInfoResponse
+     * Parse FeatureInfoResponse nodes.
+     *
+     * Parameters:
+     * data - {DOMElement}
+     *
+     * Returns:
+     * {Array}
+     */
+    read_FeatureInfoResponse: function(data) {
+        var response = [];
+        var featureNodes = this.getElementsByTagNameNS(data, '*',
+            'FIELDS');
+
+        for(var i=0, len=featureNodes.length;i<len;i++) {
+            var featureNode = featureNodes[i];
+            var geom = null;
+
+            var attributes = {};
+            for(var j=0, jlen=featureNode.attributes.length; j<jlen; j++) {
+                var attribute = featureNode.attributes[j];
+                attributes[attribute.nodeName] = attribute.nodeValue;
+            }
+
+            response.push(
+                new OpenLayers.Feature.Vector(geom, attributes, null)
+            );
+        }
+        return response;
+    },
+
+    /**
+     * Method: getSiblingNodesByTagCriteria
+     * Recursively searches passed xml node and all it's descendant levels for 
+     *     nodes whose tagName contains the passed search string. This returns an 
+     *     array of all sibling nodes which match the criteria from the highest 
+     *     hierarchial level from which a match is found.
+     * 
+     * Parameters:
+     * node - {DOMElement} An xml node
+     * criteria - {String} Search string which will match some part of a tagName 
+     *                                       
+     * Returns:
+     * Array({DOMElement)) An array of sibling xml nodes
+     */                
+    getSiblingNodesByTagCriteria: function(node, criteria){
+        var nodes = [];
+        var children, tagName, n, matchNodes, child;
+        if (node && node.hasChildNodes()) {
+            children = node.childNodes;
+            n = children.length;
+
+            for(var k=0; k<n; k++){
+                child = children[k];
+                while (child && child.nodeType != 1) {
+                    child = child.nextSibling;
+                    k++;
+                }
+                tagName = (child ? child.nodeName : '');
+                if (tagName.length > 0 && tagName.indexOf(criteria) > -1) {
+                    nodes.push(child);
+                } else {
+                    matchNodes = this.getSiblingNodesByTagCriteria(
+                        child, criteria);
+
+                    if(matchNodes.length > 0){
+                        (nodes.length == 0) ? 
+                            nodes = matchNodes : nodes.push(matchNodes);
+                    }
+                }
+            }
+
+        }
+        return nodes;
+    },
+
+    /**
+     * Method: parseAttributes
+     *
+     * Parameters:
+     * node - {<DOMElement>}
+     *
+     * Returns:
+     * {Object} An attributes object.
+     * 
+     * Notes:
+     * Assumes that attributes are direct child xml nodes of the passed node
+     * and contain only a single text node. 
+     */    
+    parseAttributes: function(node){
+        var attributes = {};
+        if (node.nodeType == 1) {
+            var children = node.childNodes;
+            var n = children.length;
+            for (var i = 0; i < n; ++i) {
+                var child = children[i];
+                if (child.nodeType == 1) {
+                    var grandchildren = child.childNodes;
+                    if (grandchildren.length == 1) {
+                        var grandchild = grandchildren[0];
+                        if (grandchild.nodeType == 3 ||
+                            grandchild.nodeType == 4) {
+                            var name = (child.prefix) ? 
+                                child.nodeName.split(":")[1] : child.nodeName;
+                            var value = grandchild.nodeValue.replace(
+                                this.regExes.trimSpace, "");
+                            attributes[name] = value;
+                        }
+                    }
+                }
+            }
+        }
+        return attributes;
+    },
+
+    /**
+     * Method: parseGeometry
+     * Parse the geometry and the feature bounds out of the node using 
+     *     Format.GML
+     *
+     * Parameters:
+     * node - {<DOMElement>}
+     *
+     * Returns:
+     * {Object} An object containing the geometry and the feature bounds
+    */
+    parseGeometry: function(node) {
+        // we need to use the old Format.GML parser since we do not know the 
+        // geometry name
+        if (!this.gmlFormat) {
+            this.gmlFormat = new OpenLayers.Format.GML();
+        }
+        var feature = this.gmlFormat.parseFeature(node);
+        var geometry, bounds = null;
+        if (feature) {
+            geometry = feature.geometry && feature.geometry.clone();
+            bounds = feature.bounds && feature.bounds.clone();
+            feature.destroy();
+        }
+        return {geometry: geometry, bounds: bounds};
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMSGetFeatureInfo"
+    
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GPX.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GPX.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GPX.js	(revision 76)
@@ -0,0 +1,184 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Projection.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GPX
+ * Read/write GPX parser. Create a new instance with the 
+ *     <OpenLayers.Format.GPX> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.GPX = OpenLayers.Class(OpenLayers.Format.XML, {
+   /**
+    * APIProperty: extractWaypoints
+    * {Boolean} Extract waypoints from GPX. (default: true)
+    */
+    extractWaypoints: true,
+    
+   /**
+    * APIProperty: extractTracks
+    * {Boolean} Extract tracks from GPX. (default: true)
+    */
+    extractTracks: true,
+    
+   /**
+    * APIProperty: extractRoutes
+    * {Boolean} Extract routes from GPX. (default: true)
+    */
+    extractRoutes: true,
+    
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract feature attributes from GPX. (default: true)
+     *     NOTE: Attributes as part of extensions to the GPX standard may not
+     *     be extracted.
+     */
+    extractAttributes: true,
+    
+    /**
+     * Constructor: OpenLayers.Format.GPX
+     * Create a new parser for GPX.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        // GPX coordinates are always in longlat WGS84
+        this.externalProjection = new OpenLayers.Projection("EPSG:4326");
+
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Return a list of features from a GPX doc
+     *
+     * Parameters:
+     * doc - {Element} 
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s
+     */
+    read: function(doc) {
+        if (typeof doc == "string") { 
+            doc = OpenLayers.Format.XML.prototype.read.apply(this, [doc]);
+        }
+        var features = [];
+        
+        if(this.extractTracks) {
+            var tracks = doc.getElementsByTagName("trk");
+            for (var i=0, len=tracks.length; i<len; i++) {
+                // Attributes are only in trk nodes, not trkseg nodes
+                var attrs = {};
+                if(this.extractAttributes) {
+                    attrs = this.parseAttributes(tracks[i]);
+                }
+                
+                var segs = this.getElementsByTagNameNS(tracks[i], tracks[i].namespaceURI, "trkseg");
+                for (var j = 0, seglen = segs.length; j < seglen; j++) {
+                    // We don't yet support extraction of trkpt attributes
+                    // All trksegs of a trk get that trk's attributes
+                    var track = this.extractSegment(segs[j], "trkpt");
+                    features.push(new OpenLayers.Feature.Vector(track, attrs));
+                }
+            }
+        }
+        
+        if(this.extractRoutes) {
+            var routes = doc.getElementsByTagName("rte");
+            for (var k=0, klen=routes.length; k<klen; k++) {
+                var attrs = {};
+                if(this.extractAttributes) {
+                    attrs = this.parseAttributes(routes[k]);
+                }
+                var route = this.extractSegment(routes[k], "rtept");
+                features.push(new OpenLayers.Feature.Vector(route, attrs));
+            }
+        }
+        
+        if(this.extractWaypoints) {
+            var waypoints = doc.getElementsByTagName("wpt");
+            for (var l = 0, len = waypoints.length; l < len; l++) {
+                var attrs = {};
+                if(this.extractAttributes) {
+                    attrs = this.parseAttributes(waypoints[l]);
+                }
+                var wpt = new OpenLayers.Geometry.Point(waypoints[l].getAttribute("lon"), waypoints[l].getAttribute("lat"));
+                features.push(new OpenLayers.Feature.Vector(wpt, attrs));
+            }
+        }
+        
+        if (this.internalProjection && this.externalProjection) {
+            for (var g = 0, featLength = features.length; g < featLength; g++) {
+                features[g].geometry.transform(this.externalProjection,
+                                    this.internalProjection);
+            }
+        }
+        
+        return features;
+    },
+    
+   /**
+    * Method: extractSegment
+    *
+    * Parameters:
+    * segment - {<DOMElement>} a trkseg or rte node to parse
+    * segmentType - {String} nodeName of waypoints that form the line
+    *
+    * Returns:
+    * {<OpenLayers.Geometry.LineString>} A linestring geometry
+    */
+    extractSegment: function(segment, segmentType) {
+        var points = this.getElementsByTagNameNS(segment, segment.namespaceURI, segmentType);
+        var point_features = [];
+        for (var i = 0, len = points.length; i < len; i++) {
+            point_features.push(new OpenLayers.Geometry.Point(points[i].getAttribute("lon"), points[i].getAttribute("lat")));
+        }
+        return new OpenLayers.Geometry.LineString(point_features);
+    },
+    
+    /**
+     * Method: parseAttributes
+     *
+     * Parameters:
+     * node - {<DOMElement>}
+     *
+     * Returns:
+     * {Object} An attributes object.
+     */
+    parseAttributes: function(node) {
+        // node is either a wpt, trk or rte
+        // attributes are children of the form <attr>value</attr>
+        var attributes = {};
+        var attrNode = node.firstChild;
+        while(attrNode) {
+            if(attrNode.nodeType == 1) {
+                var value = attrNode.firstChild;
+                if(value.nodeType == 3 || value.nodeType == 4) {
+                    name = (attrNode.prefix) ?
+                        attrNode.nodeName.split(":")[1] :
+                        attrNode.nodeName;
+                    if(name != "trkseg" && name != "rtept") {
+                        attributes[name] = value.nodeValue;
+                    }
+                }
+            }
+            attrNode = attrNode.nextSibling;
+        }
+        return attributes;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.GPX"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoRSS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoRSS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/GeoRSS.js	(revision 76)
@@ -0,0 +1,420 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ */
+
+/**
+ * Class: OpenLayers.Format.GeoRSS
+ * Read/write GeoRSS parser. Create a new instance with the 
+ *     <OpenLayers.Format.GeoRSS> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.GeoRSS = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: rssns
+     * {String} RSS namespace to use. Defaults to
+     *   "http://backend.userland.com/rss2"
+     */
+    rssns: "http://backend.userland.com/rss2",
+    
+    /**
+     * APIProperty: featurens
+     * {String} Feature Attributes namespace.  Defaults to
+     *    "http://mapserver.gis.umn.edu/mapserver"
+     */
+    featureNS: "http://mapserver.gis.umn.edu/mapserver",
+    
+    /**
+     * APIProperty: georssns
+     * {String} GeoRSS namespace to use.  Defaults to
+     *     "http://www.georss.org/georss"
+     */
+    georssns: "http://www.georss.org/georss",
+
+    /**
+     * APIProperty: geons
+     * {String} W3C Geo namespace to use.  Defaults to
+     *     "http://www.w3.org/2003/01/geo/wgs84_pos#"
+     */
+    geons: "http://www.w3.org/2003/01/geo/wgs84_pos#",
+    
+    /**
+     * APIProperty: featureTitle
+     * {String} Default title for features.  Defaults to "Untitled"
+     */
+    featureTitle: "Untitled",
+    
+    /**
+     * APIProperty: featureDescription
+     * {String} Default description for features.  Defaults to "No Description"
+     */
+    featureDescription: "No Description",
+    
+    /**
+     * Property: gmlParse
+     * {Object} GML Format object for parsing features
+     * Non-API and only created if necessary
+     */
+    gmlParser: null,
+
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate: true:(x,y) or false:(y,x)
+     * For GeoRSS the default is (y,x), therefore: false
+     */ 
+    xy: false,
+    
+    /**
+     * Constructor: OpenLayers.Format.GeoRSS
+     * Create a new parser for GeoRSS.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: createGeometryFromItem
+     * Return a geometry from a GeoRSS Item.
+     *
+     * Parameters:
+     * item - {DOMElement} A GeoRSS item node.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry>} A geometry representing the node.
+     */
+    createGeometryFromItem: function(item) {
+        var point = this.getElementsByTagNameNS(item, this.georssns, "point");
+        var lat = this.getElementsByTagNameNS(item, this.geons, 'lat');
+        var lon = this.getElementsByTagNameNS(item, this.geons, 'long');
+        
+        var line = this.getElementsByTagNameNS(item,
+                                                this.georssns,
+                                                "line");
+        var polygon = this.getElementsByTagNameNS(item,
+                                                this.georssns,
+                                                "polygon");
+        var where = this.getElementsByTagNameNS(item, 
+                                                this.georssns, 
+                                                "where");
+        var box = this.getElementsByTagNameNS(item, 
+                                              this.georssns, 
+                                              "box");
+												
+        if (point.length > 0 || (lat.length > 0 && lon.length > 0)) {
+            var location;
+            if (point.length > 0) {
+                location = OpenLayers.String.trim(
+                                point[0].firstChild.nodeValue).split(/\s+/);
+                if (location.length !=2) {
+                    location = OpenLayers.String.trim(
+                                point[0].firstChild.nodeValue).split(/\s*,\s*/);
+                }
+            } else {
+                location = [parseFloat(lat[0].firstChild.nodeValue),
+                                parseFloat(lon[0].firstChild.nodeValue)];
+            }    
+
+            var geometry = new OpenLayers.Geometry.Point(parseFloat(location[1]),
+                                                         parseFloat(location[0]));
+              
+        } else if (line.length > 0) {
+            var coords = OpenLayers.String.trim(this.concatChildValues(line[0])).split(/\s+/);
+            var components = []; 
+            var point;
+            for (var i=0, len=coords.length; i<len; i+=2) {
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[i+1]), 
+                                                     parseFloat(coords[i]));
+                components.push(point);
+            }
+            geometry = new OpenLayers.Geometry.LineString(components);
+        } else if (polygon.length > 0) { 
+            var coords = OpenLayers.String.trim(this.concatChildValues(polygon[0])).split(/\s+/);
+            var components = []; 
+            var point;
+            for (var i=0, len=coords.length; i<len; i+=2) {
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[i+1]), 
+                                                     parseFloat(coords[i]));
+                components.push(point);
+            }
+            geometry = new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(components)]);
+        } else if (where.length > 0) { 
+            if (!this.gmlParser) {
+              this.gmlParser = new OpenLayers.Format.GML({'xy': this.xy});
+            }
+            var feature = this.gmlParser.parseFeature(where[0]);
+            geometry = feature.geometry;
+        } else if (box.length  > 0) {
+            var coords = OpenLayers.String.trim(box[0].firstChild.nodeValue).split(/\s+/);
+            var components = [];
+            var point;
+            if (coords.length > 3) {
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[1]), 
+                                                     parseFloat(coords[0]));
+                components.push(point);
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[1]), 
+                                                     parseFloat(coords[2]));
+                components.push(point);
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[3]), 
+                                                     parseFloat(coords[2]));
+                components.push(point);
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[3]), 
+                                                     parseFloat(coords[0]));
+                components.push(point);
+                point = new OpenLayers.Geometry.Point(parseFloat(coords[1]), 
+                                                     parseFloat(coords[0]));
+                components.push(point);
+            }
+            geometry = new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(components)]);									 
+        }
+        
+        if (geometry && this.internalProjection && this.externalProjection) {
+            geometry.transform(this.externalProjection, 
+                               this.internalProjection);
+        }
+
+        return geometry;
+    },        
+
+    /**
+     * Method: createFeatureFromItem
+     * Return a feature from a GeoRSS Item.
+     *
+     * Parameters:
+     * item - {DOMElement} A GeoRSS item node.
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature representing the item.
+     */
+    createFeatureFromItem: function(item) {
+        var geometry = this.createGeometryFromItem(item);
+     
+        /* Provide defaults for title and description */
+        var title = this.getChildValue(item, "*", "title", this.featureTitle);
+       
+        /* First try RSS descriptions, then Atom summaries */
+        var description = this.getChildValue(
+            item, "*", "description",
+            this.getChildValue(item, "*", "content",
+                this.getChildValue(item, "*", "summary", this.featureDescription)));
+
+        /* If no link URL is found in the first child node, try the
+           href attribute */
+        var link = this.getChildValue(item, "*", "link");
+        if(!link) {
+            try {
+                link = this.getElementsByTagNameNS(item, "*", "link")[0].getAttribute("href");
+            } catch(e) {
+                link = null;
+            }
+        }
+
+        var id = this.getChildValue(item, "*", "id", null);
+        
+        var data = {
+            "title": title,
+            "description": description,
+            "link": link
+        };
+        var feature = new OpenLayers.Feature.Vector(geometry, data);
+        feature.fid = id;
+        return feature;
+    },        
+    
+    /**
+     * Method: getChildValue
+     *
+     * Parameters:
+     * node - {DOMElement}
+     * nsuri - {String} Child node namespace uri ("*" for any).
+     * name - {String} Child node name.
+     * def - {String} Optional string default to return if no child found.
+     *
+     * Returns:
+     * {String} The value of the first child with the given tag name.  Returns
+     *     default value or empty string if none found.
+     */
+    getChildValue: function(node, nsuri, name, def) {
+        var value;
+        var eles = this.getElementsByTagNameNS(node, nsuri, name);
+        if(eles && eles[0] && eles[0].firstChild
+            && eles[0].firstChild.nodeValue) {
+            value = eles[0].firstChild.nodeValue;
+        } else {
+            value = (def == undefined) ? "" : def;
+        }
+        return value;
+    },
+    
+    /**
+     * APIMethod: read
+     * Return a list of features from a GeoRSS doc
+     
+     * Parameters:
+     * data - {Element} 
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s
+     */
+    read: function(doc) {
+        if (typeof doc == "string") { 
+            doc = OpenLayers.Format.XML.prototype.read.apply(this, [doc]);
+        }
+
+        /* Try RSS items first, then Atom entries */
+        var itemlist = null;
+        itemlist = this.getElementsByTagNameNS(doc, '*', 'item');
+        if (itemlist.length == 0) {
+            itemlist = this.getElementsByTagNameNS(doc, '*', 'entry');
+        }
+        
+        var numItems = itemlist.length;
+        var features = new Array(numItems);
+        for(var i=0; i<numItems; i++) {
+            features[i] = this.createFeatureFromItem(itemlist[i]);
+        }
+        return features;
+    },
+    
+
+    /**
+     * APIMethod: write
+     * Accept Feature Collection, and return a string. 
+     * 
+     * Parameters: 
+     * features - {Array(<OpenLayers.Feature.Vector>)} List of features to serialize into a string.
+     */
+    write: function(features) {
+        var georss;
+        if(features instanceof Array) {
+            georss = this.createElementNS(this.rssns, "rss");
+            for(var i=0, len=features.length; i<len; i++) {
+                georss.appendChild(this.createFeatureXML(features[i]));
+            }
+        } else {
+            georss = this.createFeatureXML(features);
+        }
+        return OpenLayers.Format.XML.prototype.write.apply(this, [georss]);
+    },
+
+    /**
+     * Method: createFeatureXML
+     * Accept an <OpenLayers.Feature.Vector>, and build a geometry for it.
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     *
+     * Returns:
+     * {DOMElement}
+     */
+    createFeatureXML: function(feature) {
+        var geometryNode = this.buildGeometryNode(feature.geometry);
+        var featureNode = this.createElementNS(this.rssns, "item");
+        var titleNode = this.createElementNS(this.rssns, "title");
+        titleNode.appendChild(this.createTextNode(feature.attributes.title ? feature.attributes.title : ""));
+        var descNode = this.createElementNS(this.rssns, "description");
+        descNode.appendChild(this.createTextNode(feature.attributes.description ? feature.attributes.description : ""));
+        featureNode.appendChild(titleNode);
+        featureNode.appendChild(descNode);
+        if (feature.attributes.link) {
+            var linkNode = this.createElementNS(this.rssns, "link");
+            linkNode.appendChild(this.createTextNode(feature.attributes.link));
+            featureNode.appendChild(linkNode);
+        }    
+        for(var attr in feature.attributes) {
+            if (attr == "link" || attr == "title" || attr == "description") { continue; } 
+            var attrText = this.createTextNode(feature.attributes[attr]); 
+            var nodename = attr;
+            if (attr.search(":") != -1) {
+                nodename = attr.split(":")[1];
+            }    
+            var attrContainer = this.createElementNS(this.featureNS, "feature:"+nodename);
+            attrContainer.appendChild(attrText);
+            featureNode.appendChild(attrContainer);
+        }    
+        featureNode.appendChild(geometryNode);
+        return featureNode;
+    },    
+    
+    /** 
+     * Method: buildGeometryNode
+     * builds a GeoRSS node with a given geometry
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     *
+     * Returns:
+     * {DOMElement} A gml node.
+     */
+    buildGeometryNode: function(geometry) {
+        if (this.internalProjection && this.externalProjection) {
+            geometry = geometry.clone();
+            geometry.transform(this.internalProjection, 
+                               this.externalProjection);
+        }
+        var node;
+        // match Polygon
+        if (geometry.CLASS_NAME == "OpenLayers.Geometry.Polygon") {
+            node = this.createElementNS(this.georssns, 'georss:polygon');
+            
+            node.appendChild(this.buildCoordinatesNode(geometry.components[0]));
+        }
+        // match LineString
+        else if (geometry.CLASS_NAME == "OpenLayers.Geometry.LineString") {
+            node = this.createElementNS(this.georssns, 'georss:line');
+            
+            node.appendChild(this.buildCoordinatesNode(geometry));
+        }
+        // match Point
+        else if (geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+            node = this.createElementNS(this.georssns, 'georss:point');
+            node.appendChild(this.buildCoordinatesNode(geometry));
+        } else {
+            throw "Couldn't parse " + geometry.CLASS_NAME;
+        }  
+        return node;         
+    },
+    
+    /** 
+     * Method: buildCoordinatesNode
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     */
+    buildCoordinatesNode: function(geometry) {
+        var points = null;
+        
+        if (geometry.components) {
+            points = geometry.components;
+        }
+
+        var path;
+        if (points) {
+            var numPoints = points.length;
+            var parts = new Array(numPoints);
+            for (var i = 0; i < numPoints; i++) {
+                parts[i] = points[i].y + " " + points[i].x;
+            }
+            path = parts.join(" ");
+        } else {
+            path = geometry.y + " " + geometry.x;
+        }
+        return this.createTextNode(path);
+    },
+
+    CLASS_NAME: "OpenLayers.Format.GeoRSS" 
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords/v2_0_2.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords/v2_0_2.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetRecords/v2_0_2.js	(revision 76)
@@ -0,0 +1,440 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/CSWGetRecords.js
+ * @requires OpenLayers/Format/Filter/v1_0_0.js
+ * @requires OpenLayers/Format/Filter/v1_1_0.js
+ * @requires OpenLayers/Format/OWSCommon/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.CSWGetRecords.v2_0_2
+ *     A format for creating CSWGetRecords v2.0.2 transactions. 
+ *     Create a new instance with the
+ *     <OpenLayers.Format.CSWGetRecords.v2_0_2> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.CSWGetRecords.v2_0_2 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance",
+        csw: "http://www.opengis.net/cat/csw/2.0.2",
+        dc: "http://purl.org/dc/elements/1.1/",
+        dct: "http://purl.org/dc/terms/",
+        ows: "http://www.opengis.net/ows"
+    },
+    
+    /**
+     * Property: defaultPrefix
+     * {String} The default prefix (used by Format.XML).
+     */
+    defaultPrefix: "csw",
+    
+    /**
+     * Property: version
+     * {String} CSW version number.
+     */
+    version: "2.0.2",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/cat/csw/2.0.2
+     *   http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd
+     */
+    schemaLocation: "http://www.opengis.net/cat/csw/2.0.2 http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd",
+
+    /**
+     * APIProperty: requestId
+     * {String} Value of the requestId attribute of the GetRecords element.
+     */
+    requestId: null,
+
+    /**
+     * APIProperty: resultType
+     * {String} Value of the resultType attribute of the GetRecords element,
+     *     specifies the result type in the GetRecords response, "hits" is
+     *     the default.
+     */
+    resultType: null,
+
+    /**
+     * APIProperty: outputFormat
+     * {String} Value of the outputFormat attribute of the GetRecords element,
+     *     specifies the format of the GetRecords response,
+     *     "application/xml" is the default.
+     */
+    outputFormat: null,
+
+    /**
+     * APIProperty: outputSchema
+     * {String} Value of the outputSchema attribute of the GetRecords element,
+     *     specifies the schema of the GetRecords response.
+     */
+    outputSchema: null,
+
+    /**
+     * APIProperty: startPosition
+     * {String} Value of the startPosition attribute of the GetRecords element,
+     *     specifies the start position (offset+1) for the GetRecords response,
+     *     1 is the default.
+     */
+    startPosition: null,
+
+    /**
+     * APIProperty: maxRecords
+     * {String} Value of the maxRecords attribute of the GetRecords element,
+     *     specifies the maximum number of records in the GetRecords response,
+     *     10 is the default.
+     */
+    maxRecords: null,
+
+    /**
+     * APIProperty: DistributedSearch
+     * {String} Value of the csw:DistributedSearch element, used when writing
+     *     a csw:GetRecords document.
+     */
+    DistributedSearch: null,
+
+    /**
+     * APIProperty: ResponseHandler
+     * {Array({String})} Values of the csw:ResponseHandler elements, used when
+     *     writting a csw:GetRecords document.
+     */
+    ResponseHandler: null,
+
+    /**
+     * APIProperty: Query
+     * {String} Value of the csw:Query element, used when writing a csw:GetRecords
+     *     document.
+     */
+    Query: null,
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Constructor: OpenLayers.Format.CSWGetRecords.v2_0_2
+     * A class for parsing and generating CSWGetRecords v2.0.2 transactions.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties (documented as class properties):
+     * - requestId
+     * - resultType
+     * - outputFormat
+     * - outputSchema
+     * - startPosition
+     * - maxRecords
+     * - DistributedSearch
+     * - ResponseHandler
+     * - Query
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Parse the response from a GetRecords request.
+     */
+    read: function(data) {
+        if(typeof data == "string") { 
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var obj = {};
+        this.readNode(data, obj);
+        return obj;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "csw": {
+            "GetRecordsResponse": function(node, obj) {
+                obj.records = [];
+                this.readChildNodes(node, obj);
+                var version = this.getAttributeNS(node, "", 'version');
+                if (version != "") {
+                    obj.version = version;
+                }
+            },
+            "RequestId": function(node, obj) {
+                obj.RequestId = this.getChildValue(node);
+            },
+            "SearchStatus": function(node, obj) {
+                obj.SearchStatus = {};
+                var timestamp = this.getAttributeNS(node, "", 'timestamp');
+                if (timestamp != "") {
+                    obj.SearchStatus.timestamp = timestamp;
+                }
+            },
+            "SearchResults": function(node, obj) {
+                this.readChildNodes(node, obj);
+                var attrs = node.attributes;
+                var SearchResults = {};
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    if ((attrs[i].name == "numberOfRecordsMatched") ||
+                        (attrs[i].name == "numberOfRecordsReturned") ||
+                        (attrs[i].name == "nextRecord")) {
+                        SearchResults[attrs[i].name] = parseInt(attrs[i].nodeValue);
+                    } else {
+                        SearchResults[attrs[i].name] = attrs[i].nodeValue;
+                    }
+                }
+                obj.SearchResults = SearchResults;
+            },
+            "SummaryRecord": function(node, obj) {
+                var record = {type: "SummaryRecord"};
+                this.readChildNodes(node, record);
+                obj.records.push(record);
+            },
+            "BriefRecord": function(node, obj) {
+                var record = {type: "BriefRecord"};
+                this.readChildNodes(node, record);
+                obj.records.push(record);
+            },
+            "DCMIRecord": function(node, obj) {
+                var record = {type: "DCMIRecord"};
+                this.readChildNodes(node, record);
+                obj.records.push(record);
+            },
+            "Record": function(node, obj) {
+                var record = {type: "Record"};
+                this.readChildNodes(node, record);
+                obj.records.push(record);
+            }
+        },
+        "dc": {
+            // audience, contributor, coverage, creator, date, description, format,
+            // identifier, language, provenance, publisher, relation, rights,
+            // rightsHolder, source, subject, title, type, URI
+            "*": function(node, obj) {
+                var name = node.localName || node.nodeName.split(":").pop();
+                if (!(obj[name] instanceof Array)) {
+                    obj[name] = new Array();
+                }
+                var dc_element = {};
+                var attrs = node.attributes;
+                for(var i=0, len=attrs.length; i<len; ++i) {
+                    dc_element[attrs[i].name] = attrs[i].nodeValue;
+                }
+                dc_element.value = this.getChildValue(node);
+                obj[name].push(dc_element);
+            }
+        },
+        "dct": {
+            // abstract, modified, spatial
+            "*": function(node, obj) {
+                var name = node.localName || node.nodeName.split(":").pop();
+                if (!(obj[name] instanceof Array)) {
+                    obj[name] = new Array();
+                }
+                obj[name].push(this.getChildValue(node));
+            }
+        },
+        "ows": OpenLayers.Util.applyDefaults({
+            "BoundingBox": function(node, obj) {
+                if (obj.bounds) {
+                    obj.BoundingBox = [{crs: obj.projection, value: 
+                        [
+                            obj.bounds.left, 
+                            obj.bounds.bottom, 
+                            obj.bounds.right, 
+                            obj.bounds.top
+                    ]
+                    }];
+                    delete obj.projection;
+                    delete obj.bounds;
+                }
+                OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers["ows"]["BoundingBox"].apply(
+                    this, arguments);
+            }
+        }, OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers["ows"])
+    },
+    
+    /**
+     * Method: write
+     * Given an configuration js object, write a CSWGetRecords request. 
+     *
+     * Parameters:
+     * options - {Object} A object mapping the request.
+     *
+     * Returns:
+     * {String} A serialized CSWGetRecords request.
+     */
+    write: function(options) {
+        var node = this.writeNode("csw:GetRecords", options);
+        return OpenLayers.Format.XML.prototype.write.apply(this, [node]);
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "csw": {
+            "GetRecords": function(options) {
+                if (!options) {
+                    options = {};
+                }
+                var node = this.createElementNSPlus("csw:GetRecords", {
+                    attributes: {
+                        service: "CSW",
+                        version: this.version,
+                        requestId: options.requestId || this.requestId,
+                        resultType: options.resultType || this.resultType,
+                        outputFormat: options.outputFormat || this.outputFormat,
+                        outputSchema: options.outputSchema || this.outputSchema,
+                        startPosition: options.startPosition || this.startPosition,
+                        maxRecords: options.maxRecords || this.maxRecords
+                    }
+                });
+                if (options.DistributedSearch || this.DistributedSearch) {
+                    this.writeNode(
+                        "csw:DistributedSearch",
+                        options.DistributedSearch || this.DistributedSearch,
+                        node
+                    );
+                }
+                var ResponseHandler = options.ResponseHandler || this.ResponseHandler;
+                if (ResponseHandler instanceof Array && ResponseHandler.length > 0) {
+                    // ResponseHandler must be a non-empty array
+                    for(var i=0, len=ResponseHandler.length; i<len; i++) {
+                        this.writeNode(
+                            "csw:ResponseHandler",
+                            ResponseHandler[i],
+                            node
+                        );
+                    }
+                }
+                this.writeNode("Query", options.Query || this.Query, node);
+                return node;
+            },
+            "DistributedSearch": function(options) {
+                var node = this.createElementNSPlus("csw:DistributedSearch", {
+                    attributes: {
+                        hopCount: options.hopCount
+                    }
+                });
+                return node;
+            },
+            "ResponseHandler": function(options) {
+                var node = this.createElementNSPlus("csw:ResponseHandler", {
+                    value: options.value
+                });
+                return node;
+            },
+            "Query": function(options) {
+                if (!options) {
+                    options = {};
+                }
+                var node = this.createElementNSPlus("csw:Query", {
+                    attributes: {
+                        typeNames: options.typeNames || "csw:Record"
+                    }
+                });
+                var ElementName = options.ElementName;
+                if (ElementName instanceof Array && ElementName.length > 0) {
+                    // ElementName must be a non-empty array
+                    for(var i=0, len=ElementName.length; i<len; i++) {
+                        this.writeNode(
+                            "csw:ElementName",
+                            ElementName[i],
+                            node
+                        );
+                    }
+                } else {
+                    this.writeNode(
+                        "csw:ElementSetName",
+                        options.ElementSetName || {value: 'summary'},
+                        node
+                    );
+                }
+                if (options.Constraint) {
+                    this.writeNode(
+                        "csw:Constraint",
+                        options.Constraint,
+                        node
+                    );
+                }
+                //TODO: not implemented in ogc filters?
+                //if (options.SortBy) {
+                    //this.writeNode(
+                        //"ogc:SortBy",
+                        //options.SortBy,
+                        //node
+                    //);
+                //}
+                return node;
+            },
+            "ElementName": function(options) {
+                var node = this.createElementNSPlus("csw:ElementName", {
+                    value: options.value
+                });
+                return node;
+            },
+            "ElementSetName": function(options) {
+                var node = this.createElementNSPlus("csw:ElementSetName", {
+                    attributes: {
+                        typeNames: options.typeNames
+                    },
+                    value: options.value
+                });
+                return node;
+            },
+            "Constraint": function(options) {
+                var node = this.createElementNSPlus("csw:Constraint", {
+                    attributes: {
+                        version: options.version
+                    }
+                });
+                if (options.Filter) {
+                    var format = new OpenLayers.Format.Filter({
+                        version: options.version
+                    });
+                    node.appendChild(format.write(options.Filter));
+                } else if (options.CqlText) {
+                    var child = this.createElementNSPlus("CqlText", {
+                        value: options.CqlText.value
+                    });
+                    node.appendChild(child);
+                }
+                return node;
+            }
+        }
+    },
+   
+    CLASS_NAME: "OpenLayers.Format.CSWGetRecords.v2_0_2" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSCapabilities/v1_0_0.js	(revision 76)
@@ -0,0 +1,158 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/SOSCapabilities.js
+ * @requires OpenLayers/Format/OWSCommon/v1_1_0.js
+ * @requires OpenLayers/Format/GML/v3.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SOSCapabilities.v1_0_0
+ * Read SOS Capabilities version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.SOSCapabilities>
+ */
+OpenLayers.Format.SOSCapabilities.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.SOSCapabilities, {
+
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ows: "http://www.opengis.net/ows/1.1",
+        sos: "http://www.opengis.net/sos/1.0",
+        gml: "http://www.opengis.net/gml",
+        xlink: "http://www.w3.org/1999/xlink"
+    },
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+    
+    /**
+     * Constructor: OpenLayers.Format.SOSCapabilities.v1_0_0
+     * Create a new parser for SOS capabilities version 1.0.0. 
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return info about the SOS.
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} Information about the SOS service.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var capabilities = {};
+        this.readNode(data, capabilities);
+        return capabilities;
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "gml": OpenLayers.Util.applyDefaults({
+            "name": function(node, obj) {
+                obj.name = this.getChildValue(node);
+            },
+            "TimePeriod": function(node, obj) {
+                obj.timePeriod = {};
+                this.readChildNodes(node, obj.timePeriod);
+            },
+            "beginPosition": function(node, timePeriod) {
+                timePeriod.beginPosition = this.getChildValue(node);
+            },
+            "endPosition": function(node, timePeriod) {
+                timePeriod.endPosition = this.getChildValue(node);
+            }
+        }, OpenLayers.Format.GML.v3.prototype.readers["gml"]),
+        "sos": {
+            "Capabilities": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Contents": function(node, obj) {
+                obj.contents = {};
+                this.readChildNodes(node, obj.contents);
+            },
+            "ObservationOfferingList": function(node, contents) {
+                contents.offeringList = {};
+                this.readChildNodes(node, contents.offeringList);
+            },
+            "ObservationOffering": function(node, offeringList) {
+                var id = this.getAttributeNS(node, this.namespaces.gml, "id");
+                offeringList[id] = {
+                    procedures: [],
+                    observedProperties: [],
+                    featureOfInterestIds: [],
+                    responseFormats: [],
+                    resultModels: [],
+                    responseModes: []
+                };
+                this.readChildNodes(node, offeringList[id]);
+            },
+            "time": function(node, offering) {
+                offering.time = {};
+                this.readChildNodes(node, offering.time);
+            },
+            "procedure": function(node, offering) {
+                offering.procedures.push(this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href"));
+            },
+            "observedProperty": function(node, offering) {
+                offering.observedProperties.push(this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href"));
+            },
+            "featureOfInterest": function(node, offering) {
+                offering.featureOfInterestIds.push(this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href"));
+            },
+            "responseFormat": function(node, offering) {
+                offering.responseFormats.push(this.getChildValue(node));
+            },
+            "resultModel": function(node, offering) {
+                offering.resultModels.push(this.getChildValue(node));
+            },
+            "responseMode": function(node, offering) {
+                offering.responseModes.push(this.getChildValue(node));;
+            }
+        },
+        "ows": OpenLayers.Format.OWSCommon.v1_1_0.prototype.readers["ows"]
+    },    
+    
+    CLASS_NAME: "OpenLayers.Format.SOSCapabilities.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities.js	(revision 76)
@@ -0,0 +1,162 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+ 
+/**
+ * Class: OpenLayers.Format.WMTSCapabilities
+ * Read WMTS Capabilities.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMTSCapabilities = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.0.0".
+     */
+    defaultVersion: "1.0.0",
+    
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+
+    /**
+     * Property: parser
+     * {<OpenLayers.Format>} A cached versioned format used for reading.
+     */
+    parser: null,
+    
+    /**
+     * APIProperty: yx
+     * {Object} Members in the yx object are used to determine if a CRS URN
+     *     corresponds to a CRS with y,x axis order.  Member names are CRS URNs
+     *     and values are boolean.  By default, the following CRS URN are 
+     *     assumed to correspond to a CRS with y,x axis order:
+     *
+     * * urn:ogc:def:crs:EPSG::4326
+     */
+    yx: {
+        "urn:ogc:def:crs:EPSG::4326": true
+    },
+
+    /**
+     * Constructor: OpenLayers.Format.WMTSCapabilities
+     * Create a new parser for WMTS capabilities.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return information about
+     * the service (offering and observedProperty mostly).
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} Info about the WMTS Capabilities
+     */
+    read: function(data) {
+        if (typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version || root.getAttribute("version") || this.defaultVersion;
+        if (!this.parser || this.parser.version !== version) {
+            var constr = OpenLayers.Format.WMTSCapabilities[
+                "v" + version.replace(/\./g, "_")
+            ];
+            if (!constr) {
+                throw new Error("Can't find a WMTS capabilities parser for version " + version);
+            }
+            this.parser = new constr(this.options);
+        }
+        return this.parser.read(data);
+    },
+
+    /**
+     * APIMethod: createLayer
+     * Create a WMTS layer given a capabilities object.
+     *
+     * Parameters:
+     * capabilities - {Object} The object returned from a <read> call to this 
+     *     format.
+     * config - {Object} Configuration properties for the layer.  Defaults for
+     *     the layer will apply if not provided.
+     *
+     * Required config properties:
+     * layer - {String} The layer identifier.
+     * matrixSet - {String} The matrix set identifier.
+     *
+     * Returns:
+     * {<OpenLayers.Layer.WMTS>} A properly configured WMTS layer.  Throws an
+     *     error if an incomplete config is provided.  Returns undefined if no
+     *     layer could be created with the provided config.
+     */ 
+    createLayer: function(capabilities, config) {
+        var layer;
+
+        // confirm required properties are supplied in config
+        var required = {
+            layer: true,
+            matrixSet: true
+        };
+        for (var prop in required) {
+            if (!(prop in config)) {
+                throw new Error("Missing property '" + prop + "' in layer configuration.");
+            }
+        }
+
+        var contents = capabilities.contents;
+        var matrixSet = contents.tileMatrixSets[config.matrixSet];
+
+        // find the layer definition with the given identifier
+        var layers = contents.layers;
+        var layerDef;
+        for (var i=0, ii=contents.layers.length; i<ii; ++i) {
+            if (contents.layers[i].identifier === config.layer) {
+                layerDef = contents.layers[i];
+                break;
+            }
+        }
+        
+        if (layerDef && matrixSet) {
+            // get the default style for the layer
+            var style;
+            for (var i=0, ii=layerDef.styles.length; i<ii; ++i) {
+                style = layerDef.styles[i];
+                if (style.isDefault) {
+                    break;
+                }
+            }
+            
+            layer = new OpenLayers.Layer.WMTS(
+                OpenLayers.Util.applyDefaults(config, {
+                    url: capabilities.operationsMetadata.GetTile.dcp.http.get,
+                    name: layerDef.title,
+                    style: style,
+                    matrixIds: matrixSet.matrixIds
+                })
+            );
+        }
+        return layer;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WMTSCapabilities" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_0.js	(revision 76)
@@ -0,0 +1,62 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities/v1_1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities/v1_1_0
+ * Read WMS Capabilities version 1.1.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSCapabilities.v1_1>
+ */
+OpenLayers.Format.WMSCapabilities.v1_1_0 = OpenLayers.Class(
+    OpenLayers.Format.WMSCapabilities.v1_1, {
+    
+    /**
+     * Property: version
+     * {String} The specific parser version.
+     */
+    version: "1.1.0",
+    
+    /**
+     * Constructor: OpenLayers.Format.WMSCapabilities.v1_1_0
+     * Create a new parser for WMS capabilities version 1.1.0.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WMSCapabilities.v1_1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wms": OpenLayers.Util.applyDefaults({
+            "SRS": function(node, obj) {
+                var srs = this.getChildValue(node);
+                var values = srs.split(/ +/);
+                for (var i=0, len=values.length; i<len; i++) {
+                    obj.srs[values[i]] = true;
+                }
+            }
+        }, OpenLayers.Format.WMSCapabilities.v1_1.prototype.readers["wms"])
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1_1_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1.js	(revision 76)
@@ -0,0 +1,418 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities.js
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities.v1
+ * Abstract class not to be instantiated directly. Creates
+ * the common parts for both WMS 1.1.X and WMS 1.3.X.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMSCapabilities.v1 = OpenLayers.Class(
+    OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        wms: "http://www.opengis.net/wms",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "wms",
+    
+    /**
+     * Constructor: OpenLayers.Format.WMSCapabilities.v1
+     * Create an instance of one of the subclasses.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return a list of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} List of named layers.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var capabilities = {};
+        this.readNode(data, capabilities);
+    
+        // postprocess the layer list
+        this.postProcessLayers(capabilities);
+    
+        return capabilities;
+    },
+
+    /**
+     * Method: postProcessLayers
+     * Post process the layers, so that the nested layer structure is converted
+     * to a flat layer list with only named layers.
+     *
+     * Parameters:
+     * capabilities - {Object} The object (structure) returned by the parser with
+     *     all the info from the GetCapabilities response.
+     */
+    postProcessLayers: function(capabilities) {
+        if (capabilities.capability) {
+            capabilities.capability.layers = [];
+            var layers = capabilities.capability.nestedLayers;
+            for (var i=0, len = layers.length; i<len; ++i) {
+                var layer = layers[i];
+                this.processLayer(capabilities.capability, layer);
+            }
+        }
+    },
+
+    /**
+     * Method: processLayer
+     * Recursive submethod of postProcessLayers. This function will among
+     * others deal with property inheritance.
+     *
+     * Parameters:
+     * capability - {Object} The capability part of the capabilities object
+     * layer - {Object} The layer that needs processing
+     * parentLayer - {Object} The parent layer of the respective layer
+    */
+    processLayer: function(capability, layer, parentLayer) {
+        if (layer.formats === undefined) {
+            layer.formats = capability.request.getmap.formats;
+        }
+
+        // deal with property inheritance
+        if(parentLayer) {
+            // add style
+            layer.styles = layer.styles.concat(parentLayer.styles);
+            var attributes = ["queryable",
+                              "cascaded",
+                              "fixedWidth",
+                              "fixedHeight",
+                              "opaque",
+                              "noSubsets",
+                              "llbbox",
+                              "minScale",
+                              "maxScale",
+                              "attribution"];
+
+            var complexAttr = ["srs",
+                               "bbox",
+                               "dimensions",
+                               "authorityURLs"];
+            
+            var key;
+            for (var j=0; j<attributes.length; j++) {
+                key = attributes[j];
+                if (key in parentLayer) {
+                    // only take parent value if not present (null or undefined)
+                    if (layer[key] == null) {
+                        layer[key] = parentLayer[key];
+                    }
+                    // if attribute isn't present, and we haven't
+                    // inherited anything from a parent layer
+                    // set to default value
+                    if (layer[key] == null) {
+                        var intAttr = ["cascaded", "fixedWidth", "fixedHeight"];
+                        var boolAttr = ["queryable", "opaque", "noSubsets"];
+                        if (OpenLayers.Util.indexOf(intAttr, key) != -1) {
+                            layer[key] = 0;
+                        }
+                        if (OpenLayers.Util.indexOf(boolAttr, key) != -1) {
+                            layer[key] = false;
+                        }
+                    }
+                }
+            }
+
+            for (var j=0; j<complexAttr.length; j++) {
+                key = complexAttr[j];
+                layer[key] = OpenLayers.Util.extend(
+                    layer[key], parentLayer[key]);
+            }
+        }
+
+        // process sublayers
+        for (var i=0, len=layer.nestedLayers.length; i<len; i++) {
+            var childLayer = layer.nestedLayers[i];
+            this.processLayer(capability, childLayer, layer);
+        }
+        
+        if (layer.name) {
+            capability.layers.push(layer);
+        }
+    
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wms": {
+            "Service": function(node, obj) {
+                obj.service = {};
+                this.readChildNodes(node, obj.service);
+            },
+            "Name": function(node, obj) {
+                obj.name = this.getChildValue(node);
+            },
+            "Title": function(node, obj) {
+                obj.title = this.getChildValue(node);
+            },
+            "Abstract": function(node, obj) {
+                obj["abstract"] = this.getChildValue(node);
+            },
+            "BoundingBox": function(node, obj) {
+                var bbox = {};
+                bbox.bbox = [
+                    parseFloat(node.getAttribute("minx")),
+                    parseFloat(node.getAttribute("miny")),
+                    parseFloat(node.getAttribute("maxx")),
+                    parseFloat(node.getAttribute("maxy"))
+                ];
+                var res = {
+                    x: parseFloat(node.getAttribute("resx")),
+                    y: parseFloat(node.getAttribute("resy"))
+                };
+
+                if (! (isNaN(res.x) && isNaN(res.y))) {
+                    bbox.res = res;
+                }
+                // return the bbox so that descendant classes can set the
+                // CRS and SRS and add it to the obj
+                return bbox;
+            },
+            "OnlineResource": function(node, obj) {
+                obj.href = this.getAttributeNS(node, this.namespaces.xlink, 
+                    "href");
+            },
+            "ContactInformation": function(node, obj) {
+                obj.contactInformation = {};
+                this.readChildNodes(node, obj.contactInformation);
+            },
+            "ContactPersonPrimary": function(node, obj) {
+                obj.personPrimary = {};
+                this.readChildNodes(node, obj.personPrimary);
+            },
+            "ContactPerson": function(node, obj) {
+                obj.person = this.getChildValue(node);
+            },
+            "ContactOrganization": function(node, obj) {
+                obj.organization = this.getChildValue(node);
+            },
+            "ContactPosition": function(node, obj) {
+                obj.position = this.getChildValue(node);
+            },
+            "ContactAddress": function(node, obj) {
+                obj.contactAddress = {};
+                this.readChildNodes(node, obj.contactAddress);
+            },
+            "AddressType": function(node, obj) {
+                obj.type = this.getChildValue(node);
+            },
+            "Address": function(node, obj) {
+                obj.address = this.getChildValue(node);
+            },
+            "City": function(node, obj) {
+                obj.city = this.getChildValue(node);
+            },
+            "StateOrProvince": function(node, obj) {
+                obj.stateOrProvince = this.getChildValue(node);
+            },
+            "PostCode": function(node, obj) {
+                obj.postcode = this.getChildValue(node);
+            },
+            "Country": function(node, obj) {
+                obj.country = this.getChildValue(node);
+            },
+            "ContactVoiceTelephone": function(node, obj) {
+                obj.phone = this.getChildValue(node);
+            },
+            "ContactFacsimileTelephone": function(node, obj) {
+                obj.fax = this.getChildValue(node);
+            },
+            "ContactElectronicMailAddress": function(node, obj) {
+                obj.email = this.getChildValue(node);
+            },
+            "Fees": function(node, obj) {
+                var fees = this.getChildValue(node);
+                if (fees && fees.toLowerCase() != "none") {
+                    obj.fees = fees;
+                }
+            },
+            "AccessConstraints": function(node, obj) {
+                var constraints = this.getChildValue(node);
+                if (constraints && constraints.toLowerCase() != "none") {
+                    obj.accessConstraints = constraints;
+                }
+            },
+            "Capability": function(node, obj) {
+                obj.capability = {nestedLayers: []};
+                this.readChildNodes(node, obj.capability);
+            },
+            "Request": function(node, obj) {
+                obj.request = {};
+                this.readChildNodes(node, obj.request);
+            },
+            "GetCapabilities": function(node, obj) {
+                obj.getcapabilities = {formats: []};
+                this.readChildNodes(node, obj.getcapabilities);
+            },
+            "Format": function(node, obj) {
+                if (obj.formats instanceof Array) {
+                    obj.formats.push(this.getChildValue(node));
+                } else {
+                    obj.format = this.getChildValue(node);
+                }
+            },
+            "DCPType": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "HTTP": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Get": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Post": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "GetMap": function(node, obj) {
+                obj.getmap = {formats: []};
+                this.readChildNodes(node, obj.getmap);
+            },
+            "GetFeatureInfo": function(node, obj) {
+                obj.getfeatureinfo = {formats: []};
+                this.readChildNodes(node, obj.getfeatureinfo);
+            },
+            "Exception": function(node, obj) {
+                obj.exception = {formats: []};
+                this.readChildNodes(node, obj.exception);
+            },
+            "Layer": function(node, obj) {
+                var attrNode = node.getAttributeNode("queryable");
+                var queryable = (attrNode && attrNode.specified) ? 
+                    node.getAttribute("queryable") : null;
+                attrNode = node.getAttributeNode("cascaded");
+                var cascaded = (attrNode && attrNode.specified) ?
+                    node.getAttribute("cascaded") : null;
+                attrNode = node.getAttributeNode("opaque");
+                var opaque = (attrNode && attrNode.specified) ?
+                    node.getAttribute('opaque') : null;
+                var noSubsets = node.getAttribute('noSubsets');
+                var fixedWidth = node.getAttribute('fixedWidth');
+                var fixedHeight = node.getAttribute('fixedHeight');
+                var layer = {nestedLayers: [], styles: [], srs: {}, 
+                    metadataURLs: [], bbox: {}, dimensions: {},
+                    authorityURLs: {}, identifiers: {}, keywords: [],
+                    queryable: (queryable && queryable !== "") ? 
+                        ( queryable === "1" || queryable === "true" ) : null,
+                    cascaded: (cascaded !== null) ? parseInt(cascaded) : null,
+                    opaque: opaque ? 
+                        (opaque === "1" || opaque === "true" ) : null,
+                    noSubsets: (noSubsets !== null) ? 
+                        ( noSubsets === "1" || noSubsets === "true" ) : null,
+                    fixedWidth: (fixedWidth != null) ? 
+                        parseInt(fixedWidth) : null,
+                    fixedHeight: (fixedHeight != null) ? 
+                        parseInt(fixedHeight) : null
+                };
+                obj.nestedLayers.push(layer);
+                this.readChildNodes(node, layer);
+                if(layer.name) {
+                    var parts = layer.name.split(":");
+                    if(parts.length > 0) {
+                        layer.prefix = parts[0];
+                    }
+                }
+            },
+            "Attribution": function(node, obj) {
+                obj.attribution = {};
+                this.readChildNodes(node, obj.attribution);
+            },
+            "LogoURL": function(node, obj) {
+                obj.logo = {
+                    width: node.getAttribute("width"),
+                    height: node.getAttribute("height")
+                };
+                this.readChildNodes(node, obj.logo);
+            },
+            "Style": function(node, obj) {
+                var style = {};
+                obj.styles.push(style);
+                this.readChildNodes(node, style);
+            },
+            "LegendURL": function(node, obj) {
+                var legend = {
+                    width: node.getAttribute("width"),
+                    height: node.getAttribute("height")
+                };
+                obj.legend = legend;
+                this.readChildNodes(node, legend);
+            },
+            "MetadataURL": function(node, obj) {
+                var metadataURL = {type: node.getAttribute("type")};
+                obj.metadataURLs.push(metadataURL);
+                this.readChildNodes(node, metadataURL);
+            },
+            "DataURL": function(node, obj) {
+                obj.dataURL = {};
+                this.readChildNodes(node, obj.dataURL);
+            },
+            "FeatureListURL": function(node, obj) {
+                obj.featureListURL = {};
+                this.readChildNodes(node, obj.featureListURL);
+            },
+            "AuthorityURL": function(node, obj) {
+                var name = node.getAttribute("name");
+                var authority = {};
+                this.readChildNodes(node, authority);
+                obj.authorityURLs[name] = authority.href;
+            },
+            "Identifier": function(node, obj) {
+                var authority = node.getAttribute("authority");
+                obj.identifiers[authority] = this.getChildValue(node);
+            },
+            "KeywordList": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "SRS": function(node, obj) {
+                obj.srs[this.getChildValue(node)] = true;
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1.js	(revision 76)
@@ -0,0 +1,118 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities.v1_1
+ * Abstract class not to be instantiated directly.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSCapabilities.v1>
+ */
+OpenLayers.Format.WMSCapabilities.v1_1 = OpenLayers.Class(
+    OpenLayers.Format.WMSCapabilities.v1, {
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wms": OpenLayers.Util.applyDefaults({
+            "WMT_MS_Capabilities": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Keyword": function(node, obj) {
+                if (obj.keywords) {
+                    obj.keywords.push(this.getChildValue(node));
+                }
+            },
+            "DescribeLayer": function(node, obj) {
+                obj.describelayer = {formats: []};
+                this.readChildNodes(node, obj.describelayer);
+            },
+            "GetLegendGraphic": function(node, obj) {
+                obj.getlegendgraphic = {formats: []};
+                this.readChildNodes(node, obj.getlegendgraphic);
+            },
+            "GetStyles": function(node, obj) {
+                obj.getstyles = {formats: []};
+                this.readChildNodes(node, obj.getstyles);
+            },
+            "PutStyles": function(node, obj) {
+                obj.putstyles = {formats: []};
+                this.readChildNodes(node, obj.putstyles);
+            },
+            "UserDefinedSymbolization": function(node, obj) {
+                var userSymbols = {
+                    supportSLD: parseInt(node.getAttribute("SupportSLD")) == 1,
+                    userLayer: parseInt(node.getAttribute("UserLayer")) == 1,
+                    userStyle: parseInt(node.getAttribute("UserStyle")) == 1,
+                    remoteWFS: parseInt(node.getAttribute("RemoteWFS")) == 1
+                };
+                obj.userSymbols = userSymbols;
+            },
+            "LatLonBoundingBox": function(node, obj) {
+                obj.llbbox = [
+                    parseFloat(node.getAttribute("minx")),
+                    parseFloat(node.getAttribute("miny")),
+                    parseFloat(node.getAttribute("maxx")),
+                    parseFloat(node.getAttribute("maxy"))
+                ];
+            },
+            "BoundingBox": function(node, obj) {
+                var bbox = OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"].BoundingBox.apply(this, [node, obj]);
+                bbox.srs  = node.getAttribute("SRS");
+                obj.bbox[bbox.srs] = bbox;
+            },
+            "ScaleHint": function(node, obj) {
+                var min = node.getAttribute("min");
+                var max = node.getAttribute("max");
+                var rad2 = Math.pow(2, 0.5);
+                var ipm = OpenLayers.INCHES_PER_UNIT["m"];
+                obj.maxScale = parseFloat(
+                    ((min / rad2) * ipm * 
+                        OpenLayers.DOTS_PER_INCH).toPrecision(13)
+                );
+                obj.minScale = parseFloat(
+                    ((max / rad2) * ipm * 
+                        OpenLayers.DOTS_PER_INCH).toPrecision(13)
+                );
+            },
+            "Dimension": function(node, obj) {
+                var name = node.getAttribute("name").toLowerCase();
+                var dim = {
+                    name: name,
+                    units: node.getAttribute("units"),
+                    unitsymbol: node.getAttribute("unitSymbol")
+                };
+                obj.dimensions[dim.name] = dim;
+            },
+            "Extent": function(node, obj) {
+                var name = node.getAttribute("name").toLowerCase();
+                if (name in obj["dimensions"]) {
+                    var extent = obj.dimensions[name];
+                    extent.nearestVal = 
+                        node.getAttribute("nearestValue") === "1";
+                    extent.multipleVal = 
+                        node.getAttribute("multipleValues") === "1";
+                    extent.current = node.getAttribute("current") === "1";
+                    extent["default"] = node.getAttribute("default") || "";
+                    var values = this.getChildValue(node);
+                    extent.values = values.split(",");
+                }
+                }
+        }, OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"])
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1_1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_1_1.js	(revision 76)
@@ -0,0 +1,58 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities/v1_1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities/v1_1_1
+ * Read WMS Capabilities version 1.1.1.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSCapabilities.v1_1>
+ */
+OpenLayers.Format.WMSCapabilities.v1_1_1 = OpenLayers.Class(
+    OpenLayers.Format.WMSCapabilities.v1_1, {
+    
+    /**
+     * Property: version
+     * {String} The specific parser version.
+     */
+    version: "1.1.1",
+    
+    /**
+     * Constructor: OpenLayers.Format.WMSCapabilities.v1_1_1
+     * Create a new parser for WMS capabilities version 1.1.1.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WMSCapabilities.v1_1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wms": OpenLayers.Util.applyDefaults({
+            "SRS": function(node, obj) {
+                obj.srs[this.getChildValue(node)] = true;
+            }
+        }, OpenLayers.Format.WMSCapabilities.v1_1.prototype.readers["wms"])
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1_1_1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3_0.js	(revision 76)
@@ -0,0 +1,30 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities/v1_3.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities/v1_3_0
+ * Read WMS Capabilities version 1.3.0. 
+ * SLD 1.1.0 adds in the extra operations DescribeLayer and GetLegendGraphic, 
+ * see: http://schemas.opengis.net/sld/1.1.0/sld_capabilities.xsd
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSCapabilities.v1_3>
+ */
+OpenLayers.Format.WMSCapabilities.v1_3_0 = OpenLayers.Class(
+    OpenLayers.Format.WMSCapabilities.v1_3, {
+    
+    /**
+     * Property: version
+     * {String} The specific parser version.
+     */
+    version: "1.3.0",
+    
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1_3_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMSCapabilities/v1_3.js	(revision 76)
@@ -0,0 +1,128 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMSCapabilities/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMSCapabilities/v1_3
+ * Abstract base class for WMS Capabilities version 1.3.X. 
+ * SLD 1.1.0 adds in the extra operations DescribeLayer and GetLegendGraphic, 
+ * see: http://schemas.opengis.net/sld/1.1.0/sld_capabilities.xsd
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMSCapabilities.v1>
+ */
+OpenLayers.Format.WMSCapabilities.v1_3 = OpenLayers.Class(
+    OpenLayers.Format.WMSCapabilities.v1, {
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "wms": OpenLayers.Util.applyDefaults({
+            "WMS_Capabilities": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "LayerLimit": function(node, obj) {
+                obj.layerLimit = parseInt(this.getChildValue(node));
+            },
+            "MaxWidth": function(node, obj) {
+                obj.maxWidth = parseInt(this.getChildValue(node));
+            },
+            "MaxHeight": function(node, obj) {
+                obj.maxHeight = parseInt(this.getChildValue(node));
+            },
+            "BoundingBox": function(node, obj) {
+                var bbox = OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"].BoundingBox.apply(this, [node, obj]);
+                bbox.srs  = node.getAttribute("CRS");
+                obj.bbox[bbox.srs] = bbox;
+            },
+            "CRS": function(node, obj) {
+                // CRS is the synonym of SRS
+                this.readers.wms.SRS.apply(this, [node, obj]); 
+            },
+            "EX_GeographicBoundingBox": function(node, obj) {
+                // replacement of LatLonBoundingBox
+                obj.llbbox = [];
+                this.readChildNodes(node, obj.llbbox);
+                
+            },
+            "westBoundLongitude": function(node, obj) {
+                obj[0] = this.getChildValue(node);
+            },
+            "eastBoundLongitude": function(node, obj) {
+                obj[2] = this.getChildValue(node);
+            },
+            "southBoundLatitude": function(node, obj) {
+                obj[1] = this.getChildValue(node);
+            },
+            "northBoundLatitude": function(node, obj) {
+                obj[3] = this.getChildValue(node);
+            },
+            "MinScaleDenominator": function(node, obj) {
+                obj.maxScale = parseFloat(this.getChildValue(node)).toPrecision(16);
+            },
+            "MaxScaleDenominator": function(node, obj) {
+                obj.minScale = parseFloat(this.getChildValue(node)).toPrecision(16);
+            },
+            "Dimension": function(node, obj) {
+                // dimension has extra attributes: default, multipleValues, 
+                // nearestValue, current which used to be part of Extent. It now
+                // also contains the values.
+                var name = node.getAttribute("name").toLowerCase();
+                var dim = {
+                    name: name,
+                    units: node.getAttribute("units"),
+                    unitsymbol: node.getAttribute("unitSymbol"),
+                    nearestVal: node.getAttribute("nearestValue") === "1",
+                    multipleVal: node.getAttribute("multipleValues") === "1",
+                    "default": node.getAttribute("default") || "",
+                    current: node.getAttribute("current") === "1",
+                    values: this.getChildValue(node).split(",")
+                    
+                };
+                // Theoretically there can be more dimensions with the same
+                // name, but with a different unit. Until we meet such a case,
+                // let's just keep the same structure as the WMS 1.1 
+                // GetCapabilities parser uses. We will store the last
+                // one encountered.
+                obj.dimensions[dim.name] = dim;
+            },
+            "Keyword": function(node, obj) {
+                // TODO: should we change the structure of keyword in v1.js?
+                // Make it an object with a value instead of a string?
+                var keyword = {value: this.getChildValue(node), 
+                    vocabulary: node.getAttribute("vocabulary")};
+                if (obj.keywords) {
+                    obj.keywords.push(keyword);
+                }
+            }
+        }, OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"]),
+        "sld": {
+            "UserDefinedSymbolization": function(node, obj) {
+                this.readers.wms.UserDefinedSymbolization.apply(this, [node, obj]);
+                // add the two extra attributes
+                obj.userSymbols.inlineFeature = parseInt(node.getAttribute("InlineFeature")) == 1;
+                obj.userSymbols.remoteWCS = parseInt(node.getAttribute("RemoteWCS")) == 1;
+            },
+            "DescribeLayer": function(node, obj) {
+                this.readers.wms.DescribeLayer.apply(this, [node, obj]);
+            },
+            "GetLegendGraphic": function(node, obj) {
+                this.readers.wms.GetLegendGraphic.apply(this, [node, obj]);
+            }
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WMSCapabilities.v1_3" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WKT.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WKT.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WKT.js	(revision 76)
@@ -0,0 +1,358 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WKT
+ * Class for reading and writing Well-Known Text.  Create a new instance
+ * with the <OpenLayers.Format.WKT> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.WKT = OpenLayers.Class(OpenLayers.Format, {
+    
+    /**
+     * Constructor: OpenLayers.Format.WKT
+     * Create a new parser for WKT
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *           this instance
+     *
+     * Returns:
+     * {<OpenLayers.Format.WKT>} A new WKT parser.
+     */
+    initialize: function(options) {
+        this.regExes = {
+            'typeStr': /^\s*(\w+)\s*\(\s*(.*)\s*\)\s*$/,
+            'spaces': /\s+/,
+            'parenComma': /\)\s*,\s*\(/,
+            'doubleParenComma': /\)\s*\)\s*,\s*\(\s*\(/,  // can't use {2} here
+            'trimParens': /^\s*\(?(.*?)\)?\s*$/
+        };
+        OpenLayers.Format.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * Method: read
+     * Deserialize a WKT string and return a vector feature or an
+     * array of vector features.  Supports WKT for POINT, MULTIPOINT,
+     * LINESTRING, MULTILINESTRING, POLYGON, MULTIPOLYGON, and
+     * GEOMETRYCOLLECTION.
+     *
+     * Parameters:
+     * wkt - {String} A WKT string
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>|Array} A feature or array of features for
+     * GEOMETRYCOLLECTION WKT.
+     */
+    read: function(wkt) {
+        var features, type, str;
+        var matches = this.regExes.typeStr.exec(wkt);
+        if(matches) {
+            type = matches[1].toLowerCase();
+            str = matches[2];
+            if(this.parse[type]) {
+                features = this.parse[type].apply(this, [str]);
+            }
+            if (this.internalProjection && this.externalProjection) {
+                if (features && 
+                    features.CLASS_NAME == "OpenLayers.Feature.Vector") {
+                    features.geometry.transform(this.externalProjection,
+                                                this.internalProjection);
+                } else if (features &&
+                           type != "geometrycollection" &&
+                           typeof features == "object") {
+                    for (var i=0, len=features.length; i<len; i++) {
+                        var component = features[i];
+                        component.geometry.transform(this.externalProjection,
+                                                     this.internalProjection);
+                    }
+                }
+            }
+        }    
+        return features;
+    },
+
+    /**
+     * Method: write
+     * Serialize a feature or array of features into a WKT string.
+     *
+     * Parameters:
+     * features - {<OpenLayers.Feature.Vector>|Array} A feature or array of
+     *            features
+     *
+     * Returns:
+     * {String} The WKT string representation of the input geometries
+     */
+    write: function(features) {
+        var collection, geometry, type, data, isCollection;
+        if(features.constructor == Array) {
+            collection = features;
+            isCollection = true;
+        } else {
+            collection = [features];
+            isCollection = false;
+        }
+        var pieces = [];
+        if(isCollection) {
+            pieces.push('GEOMETRYCOLLECTION(');
+        }
+        for(var i=0, len=collection.length; i<len; ++i) {
+            if(isCollection && i>0) {
+                pieces.push(',');
+            }
+            geometry = collection[i].geometry;
+            type = geometry.CLASS_NAME.split('.')[2].toLowerCase();
+            if(!this.extract[type]) {
+                return null;
+            }
+            if (this.internalProjection && this.externalProjection) {
+                geometry = geometry.clone();
+                geometry.transform(this.internalProjection, 
+                                   this.externalProjection);
+            }                       
+            data = this.extract[type].apply(this, [geometry]);
+            pieces.push(type.toUpperCase() + '(' + data + ')');
+        }
+        if(isCollection) {
+            pieces.push(')');
+        }
+        return pieces.join('');
+    },
+    
+    /**
+     * Object with properties corresponding to the geometry types.
+     * Property values are functions that do the actual data extraction.
+     */
+    extract: {
+        /**
+         * Return a space delimited string of point coordinates.
+         * @param {<OpenLayers.Geometry.Point>} point
+         * @returns {String} A string of coordinates representing the point
+         */
+        'point': function(point) {
+            return point.x + ' ' + point.y;
+        },
+
+        /**
+         * Return a comma delimited string of point coordinates from a multipoint.
+         * @param {<OpenLayers.Geometry.MultiPoint>} multipoint
+         * @returns {String} A string of point coordinate strings representing
+         *                  the multipoint
+         */
+        'multipoint': function(multipoint) {
+            var array = [];
+            for(var i=0, len=multipoint.components.length; i<len; ++i) {
+                array.push('(' +
+                           this.extract.point.apply(this, [multipoint.components[i]]) +
+                           ')');
+            }
+            return array.join(',');
+        },
+        
+        /**
+         * Return a comma delimited string of point coordinates from a line.
+         * @param {<OpenLayers.Geometry.LineString>} linestring
+         * @returns {String} A string of point coordinate strings representing
+         *                  the linestring
+         */
+        'linestring': function(linestring) {
+            var array = [];
+            for(var i=0, len=linestring.components.length; i<len; ++i) {
+                array.push(this.extract.point.apply(this, [linestring.components[i]]));
+            }
+            return array.join(',');
+        },
+
+        /**
+         * Return a comma delimited string of linestring strings from a multilinestring.
+         * @param {<OpenLayers.Geometry.MultiLineString>} multilinestring
+         * @returns {String} A string of of linestring strings representing
+         *                  the multilinestring
+         */
+        'multilinestring': function(multilinestring) {
+            var array = [];
+            for(var i=0, len=multilinestring.components.length; i<len; ++i) {
+                array.push('(' +
+                           this.extract.linestring.apply(this, [multilinestring.components[i]]) +
+                           ')');
+            }
+            return array.join(',');
+        },
+        
+        /**
+         * Return a comma delimited string of linear ring arrays from a polygon.
+         * @param {<OpenLayers.Geometry.Polygon>} polygon
+         * @returns {String} An array of linear ring arrays representing the polygon
+         */
+        'polygon': function(polygon) {
+            var array = [];
+            for(var i=0, len=polygon.components.length; i<len; ++i) {
+                array.push('(' +
+                           this.extract.linestring.apply(this, [polygon.components[i]]) +
+                           ')');
+            }
+            return array.join(',');
+        },
+
+        /**
+         * Return an array of polygon arrays from a multipolygon.
+         * @param {<OpenLayers.Geometry.MultiPolygon>} multipolygon
+         * @returns {Array} An array of polygon arrays representing
+         *                  the multipolygon
+         */
+        'multipolygon': function(multipolygon) {
+            var array = [];
+            for(var i=0, len=multipolygon.components.length; i<len; ++i) {
+                array.push('(' +
+                           this.extract.polygon.apply(this, [multipolygon.components[i]]) +
+                           ')');
+            }
+            return array.join(',');
+        }
+
+    },
+
+    /**
+     * Object with properties corresponding to the geometry types.
+     * Property values are functions that do the actual parsing.
+     */
+    parse: {
+        /**
+         * Return point feature given a point WKT fragment.
+         * @param {String} str A WKT fragment representing the point
+         * @returns {<OpenLayers.Feature.Vector>} A point feature
+         * @private
+         */
+        'point': function(str) {
+            var coords = OpenLayers.String.trim(str).split(this.regExes.spaces);
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Point(coords[0], coords[1])
+            );
+        },
+
+        /**
+         * Return a multipoint feature given a multipoint WKT fragment.
+         * @param {String} A WKT fragment representing the multipoint
+         * @returns {<OpenLayers.Feature.Vector>} A multipoint feature
+         * @private
+         */
+        'multipoint': function(str) {
+            var point;
+            var points = OpenLayers.String.trim(str).split(this.regExes.parenComma);
+            var components = [];
+            for(var i=0, len=points.length; i<len; ++i) {
+                point = points[i].replace(this.regExes.trimParens, '$1');
+                components.push(this.parse.point.apply(this, [point]).geometry);
+            }
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.MultiPoint(components)
+            );
+        },
+        
+        /**
+         * Return a linestring feature given a linestring WKT fragment.
+         * @param {String} A WKT fragment representing the linestring
+         * @returns {<OpenLayers.Feature.Vector>} A linestring feature
+         * @private
+         */
+        'linestring': function(str) {
+            var points = OpenLayers.String.trim(str).split(',');
+            var components = [];
+            for(var i=0, len=points.length; i<len; ++i) {
+                components.push(this.parse.point.apply(this, [points[i]]).geometry);
+            }
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.LineString(components)
+            );
+        },
+
+        /**
+         * Return a multilinestring feature given a multilinestring WKT fragment.
+         * @param {String} A WKT fragment representing the multilinestring
+         * @returns {<OpenLayers.Feature.Vector>} A multilinestring feature
+         * @private
+         */
+        'multilinestring': function(str) {
+            var line;
+            var lines = OpenLayers.String.trim(str).split(this.regExes.parenComma);
+            var components = [];
+            for(var i=0, len=lines.length; i<len; ++i) {
+                line = lines[i].replace(this.regExes.trimParens, '$1');
+                components.push(this.parse.linestring.apply(this, [line]).geometry);
+            }
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.MultiLineString(components)
+            );
+        },
+        
+        /**
+         * Return a polygon feature given a polygon WKT fragment.
+         * @param {String} A WKT fragment representing the polygon
+         * @returns {<OpenLayers.Feature.Vector>} A polygon feature
+         * @private
+         */
+        'polygon': function(str) {
+            var ring, linestring, linearring;
+            var rings = OpenLayers.String.trim(str).split(this.regExes.parenComma);
+            var components = [];
+            for(var i=0, len=rings.length; i<len; ++i) {
+                ring = rings[i].replace(this.regExes.trimParens, '$1');
+                linestring = this.parse.linestring.apply(this, [ring]).geometry;
+                linearring = new OpenLayers.Geometry.LinearRing(linestring.components);
+                components.push(linearring);
+            }
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Polygon(components)
+            );
+        },
+
+        /**
+         * Return a multipolygon feature given a multipolygon WKT fragment.
+         * @param {String} A WKT fragment representing the multipolygon
+         * @returns {<OpenLayers.Feature.Vector>} A multipolygon feature
+         * @private
+         */
+        'multipolygon': function(str) {
+            var polygon;
+            var polygons = OpenLayers.String.trim(str).split(this.regExes.doubleParenComma);
+            var components = [];
+            for(var i=0, len=polygons.length; i<len; ++i) {
+                polygon = polygons[i].replace(this.regExes.trimParens, '$1');
+                components.push(this.parse.polygon.apply(this, [polygon]).geometry);
+            }
+            return new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.MultiPolygon(components)
+            );
+        },
+
+        /**
+         * Return an array of features given a geometrycollection WKT fragment.
+         * @param {String} A WKT fragment representing the geometrycollection
+         * @returns {Array} An array of OpenLayers.Feature.Vector
+         * @private
+         */
+        'geometrycollection': function(str) {
+            // separate components of the collection with |
+            str = str.replace(/,\s*([A-Za-z])/g, '|$1');
+            var wktArray = OpenLayers.String.trim(str).split('|');
+            var components = [];
+            for(var i=0, len=wktArray.length; i<len; ++i) {
+                components.push(OpenLayers.Format.WKT.prototype.read.apply(this,[wktArray[i]]));
+            }
+            return components;
+        }
+
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WKT" 
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_0_0.js	(revision 76)
@@ -0,0 +1,50 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/OWSCommon/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.OWSCommon.v1_0_0
+ * Parser for OWS Common version 1.0.0 which can be used by other parsers.
+ * It is not intended to be used on its own.
+ */
+OpenLayers.Format.OWSCommon.v1_0_0 = OpenLayers.Class(OpenLayers.Format.OWSCommon.v1, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ows: "http://www.opengis.net/ows/1.0",
+        xlink: "http://www.w3.org/1999/xlink"
+    },    
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ows": OpenLayers.Format.OWSCommon.v1.prototype.readers["ows"]
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "ows": OpenLayers.Format.OWSCommon.v1.prototype.writers["ows"]
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.OWSCommon.v1_1_0"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1_1_0.js	(revision 76)
@@ -0,0 +1,64 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/OWSCommon/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.OWSCommon.v1_1_0
+ * Parser for OWS Common version 1.1.0 which can be used by other parsers.
+ * It is not intended to be used on its own.
+ */
+OpenLayers.Format.OWSCommon.v1_1_0 = OpenLayers.Class(OpenLayers.Format.OWSCommon.v1, {
+
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ows: "http://www.opengis.net/ows/1.1",
+        xlink: "http://www.w3.org/1999/xlink"
+    },    
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ows": OpenLayers.Util.applyDefaults({
+            "AllowedValues": function(node, parameter) {
+                parameter.allowedValues = {};
+                this.readChildNodes(node, parameter.allowedValues);
+            },
+            "AnyValue": function(node, parameter) {
+                parameter.anyValue = true;
+            },
+            "Range": function(node, allowedValues) {
+                allowedValues.range = {};
+                this.readChildNodes(node, allowedValues.range);
+            },
+            "MinimumValue": function(node, range) {
+                range.minValue = this.getChildValue(node);
+            },
+            "MaximumValue": function(node, range) {
+                range.maxValue = this.getChildValue(node);
+            },
+            "Identifier": function(node, obj) {
+            	obj.identifier = this.getChildValue(node);
+            },
+            "SupportedCRS": function(node, obj) {
+                obj.supportedCRS = this.getChildValue(node);
+            }
+        }, OpenLayers.Format.OWSCommon.v1.prototype.readers["ows"])
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.OWSCommon.v1_1_0"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSCommon/v1.js	(revision 76)
@@ -0,0 +1,256 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+if (!OpenLayers.Format.OWSCommon) {
+    OpenLayers.Format.OWSCommon = {};
+}
+
+/**
+ * Class: OpenLayers.Format.OWSCommon.v1
+ * Common readers and writers for OWSCommon v1.X formats
+ */
+OpenLayers.Format.OWSCommon.v1 = OpenLayers.Class(OpenLayers.Format.XML, {
+   
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "ows": {
+            "ServiceIdentification": function(node, obj) {
+                obj.serviceIdentification = {};
+                this.readChildNodes(node, obj.serviceIdentification);
+            },
+            "Title": function(node, obj) {
+                obj.title = this.getChildValue(node);
+            },
+            "Abstract": function(node, serviceIdentification) {
+                serviceIdentification["abstract"] = this.getChildValue(node);
+            },
+            "Keywords": function(node, serviceIdentification) {
+                serviceIdentification.keywords = {};
+                this.readChildNodes(node, serviceIdentification.keywords);
+            },
+            "Keyword": function(node, keywords) {
+                keywords[this.getChildValue(node)] = true;
+            },
+            "ServiceType": function(node, serviceIdentification) {
+                serviceIdentification.serviceType = {
+                    codeSpace: node.getAttribute('codeSpace'), 
+                    value: this.getChildValue(node)};
+            },
+            "ServiceTypeVersion": function(node, serviceIdentification) {
+                serviceIdentification.serviceTypeVersion = this.getChildValue(node);
+            },
+            "Fees": function(node, serviceIdentification) {
+                serviceIdentification.fees = this.getChildValue(node);
+            },
+            "AccessConstraints": function(node, serviceIdentification) {
+                serviceIdentification.accessConstraints = 
+                    this.getChildValue(node);
+            },
+            "ServiceProvider": function(node, obj) {
+                obj.serviceProvider = {};
+                this.readChildNodes(node, obj.serviceProvider);
+            },
+            "ProviderName": function(node, serviceProvider) {
+                serviceProvider.providerName = this.getChildValue(node);
+            },
+            "ProviderSite": function(node, serviceProvider) {
+                serviceProvider.providerSite = this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href");
+            },
+            "ServiceContact": function(node, serviceProvider) {
+                serviceProvider.serviceContact = {};
+                this.readChildNodes(node, serviceProvider.serviceContact);
+            },
+            "IndividualName": function(node, serviceContact) {
+                serviceContact.individualName = this.getChildValue(node);
+            },
+            "PositionName": function(node, serviceContact) {
+                serviceContact.positionName = this.getChildValue(node);
+            },
+            "ContactInfo": function(node, serviceContact) {
+                serviceContact.contactInfo = {};
+                this.readChildNodes(node, serviceContact.contactInfo);
+            },
+            "Phone": function(node, contactInfo) {
+                contactInfo.phone = {};
+                this.readChildNodes(node, contactInfo.phone);
+            },
+            "Voice": function(node, phone) {
+                phone.voice = this.getChildValue(node);
+            },
+            "Address": function(node, contactInfo) {
+                contactInfo.address = {};
+                this.readChildNodes(node, contactInfo.address);
+            },
+            "DeliveryPoint": function(node, address) {
+                address.deliveryPoint = this.getChildValue(node);
+            },
+            "City": function(node, address) {
+                address.city = this.getChildValue(node);
+            },
+            "AdministrativeArea": function(node, address) {
+                address.administrativeArea = this.getChildValue(node);
+            },
+            "PostalCode": function(node, address) {
+                address.postalCode = this.getChildValue(node);
+            },
+            "Country": function(node, address) {
+                address.country = this.getChildValue(node);
+            },
+            "ElectronicMailAddress": function(node, address) {
+                address.electronicMailAddress = this.getChildValue(node);
+            },
+            "Role": function(node, serviceContact) {
+                serviceContact.role = this.getChildValue(node);
+            },
+            "OperationsMetadata": function(node, obj) {
+                obj.operationsMetadata = {};
+                this.readChildNodes(node, obj.operationsMetadata);
+            },
+            "Operation": function(node, operationsMetadata) {
+                var name = node.getAttribute("name");
+                operationsMetadata[name] = {};
+                this.readChildNodes(node, operationsMetadata[name]);
+            },
+            "DCP": function(node, operation) {
+                operation.dcp = {};
+                this.readChildNodes(node, operation.dcp);
+            },
+            "HTTP": function(node, dcp) {
+                dcp.http = {};
+                this.readChildNodes(node, dcp.http);
+            },
+            "Get": function(node, http) {
+                http.get = this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href");
+            },
+            "Post": function(node, http) {
+                http.post = this.getAttributeNS(node, 
+                    this.namespaces.xlink, "href");
+            },
+            "Parameter": function(node, operation) {
+                if (!operation.parameters) {
+                    operation.parameters = {};
+                }
+                var name = node.getAttribute("name");
+                operation.parameters[name] = {};
+                this.readChildNodes(node, operation.parameters[name]);
+            },
+            "Value": function(node, allowedValues) {
+                allowedValues[this.getChildValue(node)] = true;
+            },
+            "OutputFormat": function(node, obj) {
+                obj.formats.push({value: this.getChildValue(node)});
+                this.readChildNodes(node, obj);
+            },
+            "WGS84BoundingBox": function(node, obj) {
+                var boundingBox = {};
+                boundingBox.crs = node.getAttribute("crs");
+                if (obj.BoundingBox) {
+                    obj.BoundingBox.push(boundingBox);
+                } else {
+                    obj.projection = boundingBox.crs;
+                    boundingBox = obj;
+               }
+               this.readChildNodes(node, boundingBox);
+            },
+            "BoundingBox": function(node, obj) {
+                // FIXME: We consider that BoundingBox is the same as WGS84BoundingBox
+                // LowerCorner = "min_x min_y"
+                // UpperCorner = "max_x max_y"
+                // It should normally depend on the projection
+                this.readers['ows']['WGS84BoundingBox'].apply(this, [node, obj]);
+            },
+            "LowerCorner": function(node, obj) {
+                var str = this.getChildValue(node).replace(
+                    this.regExes.trimSpace, "");
+                str = str.replace(this.regExes.trimComma, ",");
+                var pointList = str.split(this.regExes.splitSpace);
+                obj.left = pointList[0];
+                obj.bottom = pointList[1];
+            },
+            "UpperCorner": function(node, obj) {
+                var str = this.getChildValue(node).replace(
+                    this.regExes.trimSpace, "");
+                str = str.replace(this.regExes.trimComma, ",");
+                var pointList = str.split(this.regExes.splitSpace);
+                obj.right = pointList[0];
+                obj.top = pointList[1];
+                obj.bounds = new OpenLayers.Bounds(obj.left, obj.bottom,
+                    obj.right, obj.top);
+                delete obj.left;
+                delete obj.bottom;
+                delete obj.right;
+                delete obj.top;
+            }
+        }
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "ows": {
+            "BoundingBox": function(options) {
+                var node = this.createElementNSPlus("ows:BoundingBox", {
+                    attributes: {
+                        crs: options.projection
+                    }
+                });
+                this.writeNode("ows:LowerCorner", options, node);
+                this.writeNode("ows:UpperCorner", options, node);
+                return node;
+            },
+            "LowerCorner": function(options) {
+                var node = this.createElementNSPlus("ows:LowerCorner", {
+                    value: options.bounds.left + " " + options.bounds.bottom });
+                return node;
+            },
+            "UpperCorner": function(options) {
+                var node = this.createElementNSPlus("ows:UpperCorner", {
+                    value: options.bounds.right + " " + options.bounds.top });
+                return node;
+            },
+            "Title": function(title) {
+                var node = this.createElementNSPlus("ows:Title", {
+                    value: title });
+                return node;
+            },
+            "OutputFormat": function(format) {
+                var node = this.createElementNSPlus("ows:OutputFormat", {
+                    value: format });
+                return node;
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.OWSCommon.v1"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1_0_0.js	(revision 76)
@@ -0,0 +1,51 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/SLD/v1.js
+ * @requires OpenLayers/Format/Filter/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SLD.v1_0_0
+ * Write SLD version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.SLD.v1>
+ */
+OpenLayers.Format.SLD.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.SLD.v1, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.0.0
+     */
+    VERSION: "1.0.0",
+    
+    /**
+     * Property: schemaLocation
+     * {String} http://www.opengis.net/sld
+     *   http://schemas.opengis.net/sld/1.0.0/StyledLayerDescriptor.xsd
+     */
+    schemaLocation: "http://www.opengis.net/sld http://schemas.opengis.net/sld/1.0.0/StyledLayerDescriptor.xsd",
+
+    /**
+     * Constructor: OpenLayers.Format.SLD.v1_0_0
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.SLD> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.SLD.v1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    CLASS_NAME: "OpenLayers.Format.SLD.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SLD/v1.js	(revision 76)
@@ -0,0 +1,1100 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Rule.js
+ * @requires OpenLayers/Format/SLD.js
+ * @requires OpenLayers/Format/Filter/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SLD.v1
+ * Superclass for SLD version 1 parsers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.Filter.v1_0_0>
+ */
+OpenLayers.Format.SLD.v1 = OpenLayers.Class(OpenLayers.Format.Filter.v1_0_0, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        sld: "http://www.opengis.net/sld",
+        ogc: "http://www.opengis.net/ogc",
+        gml: "http://www.opengis.net/gml",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+    
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "sld",
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location for a particular minor version.
+     */
+    schemaLocation: null,
+    
+    /** 
+     * APIProperty: multipleSymbolizers
+     * {Boolean} Support multiple symbolizers per rule.  Default is false.  if
+     *     true, an OpenLayers.Style2 instance will be created to represent 
+     *     user styles instead of an OpenLayers.Style instace.  The 
+     *     OpenLayers.Style2 class allows collections of rules with multiple
+     *     symbolizers, but is not currently useful for client side rendering.
+     *     If multiple symbolizers is true, multiple FeatureTypeStyle elements
+     *     are preserved in reading/writing by setting symbolizer zIndex values.
+     *     In addition, the <defaultSymbolizer> property is ignored if 
+     *     multiple symbolizers are supported (defaults should be applied
+     *     when rendering).
+     */
+    multipleSymbolizers: false,
+
+    /**
+     * Property: featureTypeCounter
+     * {Number} Private counter for multiple feature type styles.
+     */
+    featureTypeCounter: null,
+
+    /**
+     * APIProperty: defaultSymbolizer.
+     * {Object} A symbolizer with the SLD defaults.
+     */
+    defaultSymbolizer: {
+        fillColor: "#808080",
+        fillOpacity: 1,
+        strokeColor: "#000000",
+        strokeOpacity: 1,
+        strokeWidth: 1,
+        strokeDashstyle: "solid",
+        pointRadius: 3,
+        graphicName: "square"
+    },
+    
+    /**
+     * Constructor: OpenLayers.Format.SLD.v1
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.SLD> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.Filter.v1_0_0.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: read
+     *
+     * Parameters:
+     * data - {DOMElement} An SLD document element.
+     * options - {Object} Options for the reader.
+     *
+     * Valid options:
+     * namedLayersAsArray - {Boolean}  Generate a namedLayers array.  If false,
+     *     the namedLayers property value will be an object keyed by layer name.
+     *     Default is false.
+     *
+     * Returns:
+     * {Object} An object representing the SLD.
+     */
+    read: function(data, options) {
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+        var sld = {
+            namedLayers: options.namedLayersAsArray === true ? [] : {}
+        };
+        this.readChildNodes(data, sld);
+        return sld;
+    },
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: OpenLayers.Util.applyDefaults({
+        "sld": {
+            "StyledLayerDescriptor": function(node, sld) {
+                sld.version = node.getAttribute("version");
+                this.readChildNodes(node, sld);
+            },
+            "Name": function(node, obj) {
+                obj.name = this.getChildValue(node);
+            },
+            "Title": function(node, obj) {
+                obj.title = this.getChildValue(node);
+            },
+            "Abstract": function(node, obj) {
+                obj.description = this.getChildValue(node);
+            },
+            "NamedLayer": function(node, sld) {
+                var layer = {
+                    userStyles: [],
+                    namedStyles: []
+                };
+                this.readChildNodes(node, layer);
+                // give each of the user styles this layer name
+                for(var i=0, len=layer.userStyles.length; i<len; ++i) {
+                    layer.userStyles[i].layerName = layer.name;
+                }
+                if(sld.namedLayers instanceof Array) {
+                    sld.namedLayers.push(layer);                
+                } else {
+                    sld.namedLayers[layer.name] = layer;
+                }
+            },
+            "NamedStyle": function(node, layer) {
+                layer.namedStyles.push(
+                    this.getChildName(node.firstChild)
+                );
+            },
+            "UserStyle": function(node, layer) {
+                var obj = {defaultsPerSymbolizer: true, rules: []};
+                this.featureTypeCounter = -1;
+                this.readChildNodes(node, obj);
+                var style;
+                if (this.multipleSymbolizers) {
+                    delete obj.defaultsPerSymbolizer;
+                    style = new OpenLayers.Style2(obj);
+                } else {
+                    style = new OpenLayers.Style(this.defaultSymbolizer, obj);
+                }
+                layer.userStyles.push(style);
+            },
+            "IsDefault": function(node, style) {
+                if(this.getChildValue(node) == "1") {
+                    style.isDefault = true;
+                }
+            },
+            "FeatureTypeStyle": function(node, style) {
+                ++this.featureTypeCounter;
+                var obj = {
+                    rules: this.multipleSymbolizers ? style.rules : []
+                };
+                this.readChildNodes(node, obj);
+                if (!this.multipleSymbolizers) {
+                    style.rules = obj.rules;
+                }
+            },
+            "Rule": function(node, obj) {
+                var config;
+                if (this.multipleSymbolizers) {
+                    config = {symbolizers: []};
+                }
+                var rule = new OpenLayers.Rule(config);
+                this.readChildNodes(node, rule);
+                obj.rules.push(rule);
+            },
+            "ElseFilter": function(node, rule) {
+                rule.elseFilter = true;
+            },
+            "MinScaleDenominator": function(node, rule) {
+                rule.minScaleDenominator = parseFloat(this.getChildValue(node));
+            },
+            "MaxScaleDenominator": function(node, rule) {
+                rule.maxScaleDenominator = parseFloat(this.getChildValue(node));
+            },
+            "TextSymbolizer": function(node, rule) {
+                var config = {};
+                this.readChildNodes(node, config);
+                if (this.multipleSymbolizers) {
+                    config.zIndex = this.featureTypeCounter;
+                    rule.symbolizers.push(
+                        new OpenLayers.Symbolizer.Text(config)
+                    );
+                } else {
+                    rule.symbolizer["Text"] = OpenLayers.Util.applyDefaults(
+                        config, rule.symbolizer["Text"]
+                    );
+                }
+            },
+            "Label": function(node, symbolizer) {
+                // only supporting literal or property name
+                var obj = {};
+                this.readChildNodes(node, obj);
+                if(obj.property) {
+                    symbolizer.label = "${" + obj.property + "}";
+                } else {
+                    var value = this.readOgcExpression(node);
+                    if(value) {
+                        symbolizer.label = value;
+                    }
+                }
+            },
+            "Font": function(node, symbolizer) {
+                this.readChildNodes(node, symbolizer);
+            },
+            "Halo": function(node, symbolizer) {
+                // halo has a fill, so send fresh object
+                var obj = {};
+                this.readChildNodes(node, obj);
+                symbolizer.haloRadius = obj.haloRadius;
+                symbolizer.haloColor = obj.fillColor;
+                symbolizer.haloOpacity = obj.fillOpacity;
+            },
+            "Radius": function(node, symbolizer) {
+                var radius = this.readOgcExpression(node);
+                if(radius != null) {
+                    // radius is only used for halo
+                    symbolizer.haloRadius = radius;
+                }
+            },
+            "RasterSymbolizer": function(node, rule) {
+                var config = {};
+                this.readChildNodes(node, config);
+                if (this.multipleSymbolizers) {
+                    config.zIndex = this.featureTypeCounter;
+                    rule.symbolizers.push(
+                        new OpenLayers.Symbolizer.Raster(config)
+                    );
+                } else {
+                    rule.symbolizer["Raster"] = OpenLayers.Util.applyDefaults(
+                        config, rule.symbolizer["Raster"]
+                    );
+                }
+            },
+            "Geometry": function(node, obj) {
+                obj.geometry = {};
+                this.readChildNodes(node, obj.geometry);
+            },
+            "ColorMap": function(node, symbolizer) {
+                symbolizer.colorMap = [];
+                this.readChildNodes(node, symbolizer.colorMap);
+            },
+            "ColorMapEntry": function(node, colorMap) {
+                var q = node.getAttribute("quantity");
+                var o = node.getAttribute("opacity");
+                colorMap.push({
+                    color: node.getAttribute("color"),
+                    quantity: q !== null ? parseFloat(q) : undefined,
+                    label: node.getAttribute("label") || undefined,
+                    opacity: o !== null ? parseFloat(o) : undefined
+                });
+            },
+            "LineSymbolizer": function(node, rule) {
+                var config = {};
+                this.readChildNodes(node, config);
+                if (this.multipleSymbolizers) {
+                    config.zIndex = this.featureTypeCounter;
+                    rule.symbolizers.push(
+                        new OpenLayers.Symbolizer.Line(config)
+                    );
+                } else {
+                    rule.symbolizer["Line"] = OpenLayers.Util.applyDefaults(
+                        config, rule.symbolizer["Line"]
+                    );
+                }
+            },
+            "PolygonSymbolizer": function(node, rule) {
+                var config = {
+                    fill: false,
+                    stroke: false
+                };
+                if (!this.multipleSymbolizers) {
+                    config = rule.symbolizer["Polygon"] || config;
+                }
+                this.readChildNodes(node, config);
+                if (this.multipleSymbolizers) {
+                    config.zIndex = this.featureTypeCounter;
+                    rule.symbolizers.push(
+                        new OpenLayers.Symbolizer.Polygon(config)
+                    );
+                } else {
+                    rule.symbolizer["Polygon"] = config;
+                }
+            },
+            "PointSymbolizer": function(node, rule) {
+                var config = {
+                    fill: false,
+                    stroke: false,
+                    graphic: false
+                };
+                if (!this.multipleSymbolizers) {
+                    config = rule.symbolizer["Point"] || config;
+                }
+                this.readChildNodes(node, config);
+                if (this.multipleSymbolizers) {
+                    config.zIndex = this.featureTypeCounter;
+                    rule.symbolizers.push(
+                        new OpenLayers.Symbolizer.Point(config)
+                    );
+                } else {
+                    rule.symbolizer["Point"] = config;
+                }
+            },
+            "Stroke": function(node, symbolizer) {
+                symbolizer.stroke = true;
+                this.readChildNodes(node, symbolizer);
+            },
+            "Fill": function(node, symbolizer) {
+                symbolizer.fill = true;
+                this.readChildNodes(node, symbolizer);
+            },
+            "CssParameter": function(node, symbolizer) {
+                var cssProperty = node.getAttribute("name");
+                var symProperty = this.cssMap[cssProperty];
+                if(symProperty) {
+                    // Limited support for parsing of OGC expressions
+                    var value = this.readOgcExpression(node);
+                    // always string, could be an empty string
+                    if(value) {
+                        symbolizer[symProperty] = value;
+                    }
+                }
+            },
+            "Graphic": function(node, symbolizer) {
+                symbolizer.graphic = true;
+                var graphic = {};
+                // painter's order not respected here, clobber previous with next
+                this.readChildNodes(node, graphic);
+                // directly properties with names that match symbolizer properties
+                var properties = [
+                    "stroke", "strokeColor", "strokeWidth", "strokeOpacity",
+                    "strokeLinecap", "fill", "fillColor", "fillOpacity",
+                    "graphicName", "rotation", "graphicFormat"
+                ];
+                var prop, value;
+                for(var i=0, len=properties.length; i<len; ++i) {
+                    prop = properties[i];
+                    value = graphic[prop];
+                    if(value != undefined) {
+                        symbolizer[prop] = value;
+                    }
+                }
+                // set other generic properties with specific graphic property names
+                if(graphic.opacity != undefined) {
+                    symbolizer.graphicOpacity = graphic.opacity;
+                }
+                if(graphic.size != undefined) {
+                    symbolizer.pointRadius = graphic.size / 2;
+                }
+                if(graphic.href != undefined) {
+                    symbolizer.externalGraphic = graphic.href;
+                }
+                if(graphic.rotation != undefined) {
+                    symbolizer.rotation = graphic.rotation;
+                }
+            },
+            "ExternalGraphic": function(node, graphic) {
+                this.readChildNodes(node, graphic);
+            },
+            "Mark": function(node, graphic) {
+                this.readChildNodes(node, graphic);
+            },
+            "WellKnownName": function(node, graphic) {
+                graphic.graphicName = this.getChildValue(node);
+            },
+            "Opacity": function(node, obj) {
+                var opacity = this.readOgcExpression(node);
+                // always string, could be empty string
+                if(opacity) {
+                    obj.opacity = opacity;
+                }
+            },
+            "Size": function(node, obj) {
+                var size = this.readOgcExpression(node);
+                // always string, could be empty string
+                if(size) {
+                    obj.size = size;
+                }
+            },
+            "Rotation": function(node, obj) {
+                var rotation = this.readOgcExpression(node);
+                // always string, could be empty string
+                if(rotation) {
+                    obj.rotation = rotation;
+                }
+            },
+            "OnlineResource": function(node, obj) {
+                obj.href = this.getAttributeNS(
+                    node, this.namespaces.xlink, "href"
+                );
+            },
+            "Format": function(node, graphic) {
+                graphic.graphicFormat = this.getChildValue(node);
+            }
+        }
+    }, OpenLayers.Format.Filter.v1_0_0.prototype.readers),
+    
+    /**
+     * Property: cssMap
+     * {Object} Object mapping supported css property names to OpenLayers
+     *     symbolizer property names.
+     */
+    cssMap: {
+        "stroke": "strokeColor",
+        "stroke-opacity": "strokeOpacity",
+        "stroke-width": "strokeWidth",
+        "stroke-linecap": "strokeLinecap",
+        "stroke-dasharray": "strokeDashstyle",
+        "fill": "fillColor",
+        "fill-opacity": "fillOpacity",
+        "font-family": "fontFamily",
+        "font-size": "fontSize",
+        "font-weight": "fontWeight",
+        "font-style": "fontStyle"
+    },
+    
+    /**
+     * Method: getCssProperty
+     * Given a symbolizer property, get the corresponding CSS property
+     *     from the <cssMap>.
+     *
+     * Parameters:
+     * sym - {String} A symbolizer property name.
+     *
+     * Returns:
+     * {String} A CSS property name or null if none found.
+     */
+    getCssProperty: function(sym) {
+        var css = null;
+        for(var prop in this.cssMap) {
+            if(this.cssMap[prop] == sym) {
+                css = prop;
+                break;
+            }
+        }
+        return css;
+    },
+    
+    /**
+     * Method: getGraphicFormat
+     * Given a href for an external graphic, try to determine the mime-type.
+     *     This method doesn't try too hard, and will fall back to
+     *     <defautlGraphicFormat> if one of the known <graphicFormats> is not
+     *     the file extension of the provided href.
+     *
+     * Parameters:
+     * href - {String}
+     *
+     * Returns:
+     * {String} The graphic format.
+     */
+    getGraphicFormat: function(href) {
+        var format, regex;
+        for(var key in this.graphicFormats) {
+            if(this.graphicFormats[key].test(href)) {
+                format = key;
+                break;
+            }
+        }
+        return format || this.defautlGraphicFormat;
+    },
+    
+    /**
+     * Property: defaultGraphicFormat
+     * {String} If none other can be determined from <getGraphicFormat>, this
+     *     default will be returned.
+     */
+    defaultGraphicFormat: "image/png",
+    
+    /**
+     * Property: graphicFormats
+     * {Object} Mapping of image mime-types to regular extensions matching 
+     *     well-known file extensions.
+     */
+    graphicFormats: {
+        "image/jpeg": /\.jpe?g$/i,
+        "image/gif": /\.gif$/i,
+        "image/png": /\.png$/i
+    },
+
+    /**
+     * Method: write
+     *
+     * Parameters:
+     * sld - {Object} An object representing the SLD.
+     *
+     * Returns:
+     * {DOMElement} The root of an SLD document.
+     */
+    write: function(sld) {
+        return this.writers.sld.StyledLayerDescriptor.apply(this, [sld]);
+    },
+    
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: OpenLayers.Util.applyDefaults({
+        "sld": {
+            "StyledLayerDescriptor": function(sld) {
+                var root = this.createElementNSPlus(
+                    "sld:StyledLayerDescriptor",
+                    {attributes: {
+                        "version": this.VERSION,
+                        "xsi:schemaLocation": this.schemaLocation
+                    }}
+                );
+
+                // For ArcGIS Server it is necessary to define this
+                // at the root level (see ticket:2166).
+                root.setAttribute("xmlns:ogc", this.namespaces.ogc);
+                root.setAttribute("xmlns:gml", this.namespaces.gml);
+
+                // add in optional name
+                if(sld.name) {
+                    this.writeNode("Name", sld.name, root);
+                }
+                // add in optional title
+                if(sld.title) {
+                    this.writeNode("Title", sld.title, root);
+                }
+                // add in optional description
+                if(sld.description) {
+                    this.writeNode("Abstract", sld.description, root);
+                }
+                // add in named layers
+                // allow namedLayers to be an array
+                if(sld.namedLayers instanceof Array) {
+                    for(var i=0, len=sld.namedLayers.length; i<len; ++i) {
+                        this.writeNode("NamedLayer", sld.namedLayers[i], root);
+                    }
+                } else {
+                    for(var name in sld.namedLayers) {
+                        this.writeNode("NamedLayer", sld.namedLayers[name], root);
+                    }
+                }
+                return root;
+            },
+            "Name": function(name) {
+                return this.createElementNSPlus("sld:Name", {value: name});
+            },
+            "Title": function(title) {
+                return this.createElementNSPlus("sld:Title", {value: title});
+            },
+            "Abstract": function(description) {
+                return this.createElementNSPlus(
+                    "sld:Abstract", {value: description}
+                );
+            },
+            "NamedLayer": function(layer) {
+                var node = this.createElementNSPlus("sld:NamedLayer");
+
+                // add in required name
+                this.writeNode("Name", layer.name, node);
+
+                // optional sld:LayerFeatureConstraints here
+
+                // add in named styles
+                if(layer.namedStyles) {
+                    for(var i=0, len=layer.namedStyles.length; i<len; ++i) {
+                        this.writeNode(
+                            "NamedStyle", layer.namedStyles[i], node
+                        );
+                    }
+                }
+                
+                // add in user styles
+                if(layer.userStyles) {
+                    for(var i=0, len=layer.userStyles.length; i<len; ++i) {
+                        this.writeNode(
+                            "UserStyle", layer.userStyles[i], node
+                        );
+                    }
+                }
+                
+                return node;
+            },
+            "NamedStyle": function(name) {
+                var node = this.createElementNSPlus("sld:NamedStyle");
+                this.writeNode("Name", name, node);
+                return node;
+            },
+            "UserStyle": function(style) {
+                var node = this.createElementNSPlus("sld:UserStyle");
+
+                // add in optional name
+                if(style.name) {
+                    this.writeNode("Name", style.name, node);
+                }
+                // add in optional title
+                if(style.title) {
+                    this.writeNode("Title", style.title, node);
+                }
+                // add in optional description
+                if(style.description) {
+                    this.writeNode("Abstract", style.description, node);
+                }
+                
+                // add isdefault
+                if(style.isDefault) {
+                    this.writeNode("IsDefault", style.isDefault, node);
+                }
+                
+                // add FeatureTypeStyles
+                if (this.multipleSymbolizers && style.rules) {
+                    // group style objects by symbolizer zIndex
+                    var rulesByZ = {
+                        0: []
+                    };
+                    var zValues = [0];
+                    var rule, ruleMap, symbolizer, zIndex, clone;
+                    for (var i=0, ii=style.rules.length; i<ii; ++i) {
+                        rule = style.rules[i];
+                        if (rule.symbolizers) {
+                            ruleMap = {};
+                            for (var j=0, jj=rule.symbolizers.length; j<jj; ++j) {
+                                symbolizer = rule.symbolizers[j];
+                                zIndex = symbolizer.zIndex;
+                                if (!(zIndex in ruleMap)) {
+                                    clone = rule.clone();
+                                    clone.symbolizers = [];
+                                    ruleMap[zIndex] = clone;
+                                }
+                                ruleMap[zIndex].symbolizers.push(symbolizer.clone());
+                            }
+                            for (zIndex in ruleMap) {
+                                if (!(zIndex in rulesByZ)) {
+                                    zValues.push(zIndex);
+                                    rulesByZ[zIndex] = [];
+                                }
+                                rulesByZ[zIndex].push(ruleMap[zIndex]);
+                            }
+                        } else {
+                            // no symbolizers in rule
+                            rulesByZ[0].push(rule.clone());
+                        }
+                    }
+                    // write one FeatureTypeStyle per zIndex
+                    zValues.sort();
+                    var rules;
+                    for (var i=0, ii=zValues.length; i<ii; ++i) {
+                        rules = rulesByZ[zValues[i]];
+                        if (rules.length > 0) {
+                            clone = style.clone();
+                            clone.rules = rulesByZ[zValues[i]];
+                            this.writeNode("FeatureTypeStyle", clone, node);
+                        }
+                    }                    
+                } else {
+                    this.writeNode("FeatureTypeStyle", style, node);
+                }
+                
+                return node;
+            },
+            "IsDefault": function(bool) {
+                return this.createElementNSPlus(
+                    "sld:IsDefault", {value: (bool) ? "1" : "0"}
+                );
+            },
+            "FeatureTypeStyle": function(style) {
+                var node = this.createElementNSPlus("sld:FeatureTypeStyle");
+                
+                // OpenLayers currently stores no Name, Title, Abstract,
+                // FeatureTypeName, or SemanticTypeIdentifier information
+                // related to FeatureTypeStyle
+                
+                // add in rules
+                for(var i=0, len=style.rules.length; i<len; ++i) {
+                    this.writeNode("Rule", style.rules[i], node);
+                }
+                
+                return node;
+            },
+            "Rule": function(rule) {
+                var node = this.createElementNSPlus("sld:Rule");
+
+                // add in optional name
+                if(rule.name) {
+                    this.writeNode("Name", rule.name, node);
+                }
+                // add in optional title
+                if(rule.title) {
+                    this.writeNode("Title", rule.title, node);
+                }
+                // add in optional description
+                if(rule.description) {
+                    this.writeNode("Abstract", rule.description, node);
+                }
+                
+                // add in LegendGraphic here
+                
+                // add in optional filters
+                if(rule.elseFilter) {
+                    this.writeNode("ElseFilter", null, node);
+                } else if(rule.filter) {
+                    this.writeNode("ogc:Filter", rule.filter, node);
+                }
+                
+                // add in scale limits
+                if(rule.minScaleDenominator != undefined) {
+                    this.writeNode(
+                        "MinScaleDenominator", rule.minScaleDenominator, node
+                    );
+                }
+                if(rule.maxScaleDenominator != undefined) {
+                    this.writeNode(
+                        "MaxScaleDenominator", rule.maxScaleDenominator, node
+                    );
+                }
+                
+                var type, symbolizer;
+                if (this.multipleSymbolizers && rule.symbolizers) {
+                    var symbolizer;
+                    for (var i=0, ii=rule.symbolizers.length; i<ii; ++i) {
+                        symbolizer = rule.symbolizers[i];
+                        type = symbolizer.CLASS_NAME.split(".").pop();
+                        this.writeNode(
+                            type + "Symbolizer", symbolizer, node
+                        );
+                    }
+                } else {
+                    // add in symbolizers (relies on geometry type keys)
+                    var types = OpenLayers.Style.SYMBOLIZER_PREFIXES;
+                    for(var i=0, len=types.length; i<len; ++i) {
+                        type = types[i];
+                        symbolizer = rule.symbolizer[type];
+                        if(symbolizer) {
+                            this.writeNode(
+                                type + "Symbolizer", symbolizer, node
+                            );
+                        }
+                    }
+                }
+                return node;
+
+            },
+            "ElseFilter": function() {
+                return this.createElementNSPlus("sld:ElseFilter");
+            },
+            "MinScaleDenominator": function(scale) {
+                return this.createElementNSPlus(
+                    "sld:MinScaleDenominator", {value: scale}
+                );
+            },
+            "MaxScaleDenominator": function(scale) {
+                return this.createElementNSPlus(
+                    "sld:MaxScaleDenominator", {value: scale}
+                );
+            },
+            "LineSymbolizer": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:LineSymbolizer");
+                this.writeNode("Stroke", symbolizer, node);
+                return node;
+            },
+            "Stroke": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Stroke");
+
+                // GraphicFill here
+                // GraphicStroke here
+
+                // add in CssParameters
+                if(symbolizer.strokeColor != undefined) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "strokeColor"},
+                        node
+                    );
+                }
+                if(symbolizer.strokeOpacity != undefined) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "strokeOpacity"},
+                        node
+                    );
+                }
+                if(symbolizer.strokeWidth != undefined) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "strokeWidth"},
+                        node
+                    );
+                }
+                if(symbolizer.strokeDashstyle != undefined && symbolizer.strokeDashstyle !== "solid") {
+                    // assumes valid stroke-dasharray value
+                    this.writeNode(
+                        "CssParameter", 
+                        {symbolizer: symbolizer, key: "strokeDashstyle"},
+                        node
+                    );
+                }
+                if(symbolizer.strokeLinecap != undefined) {
+                    this.writeNode(
+                        "CssParameter", 
+                        {symbolizer: symbolizer, key: "strokeLinecap"},
+                        node
+                    );
+                }
+                return node;
+            },
+            "CssParameter": function(obj) {
+                // not handling ogc:expressions for now
+                return this.createElementNSPlus("sld:CssParameter", {
+                    attributes: {name: this.getCssProperty(obj.key)},
+                    value: obj.symbolizer[obj.key]
+                });
+            },
+            "TextSymbolizer": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:TextSymbolizer");
+                // add in optional Label
+                if(symbolizer.label != null) {
+                    this.writeNode("Label", symbolizer.label, node);
+                }
+                // add in optional Font
+                if(symbolizer.fontFamily != null ||
+                   symbolizer.fontSize != null ||
+                   symbolizer.fontWeight != null ||
+                   symbolizer.fontStyle != null) {
+                    this.writeNode("Font", symbolizer, node);
+                }
+                // add in optional Halo
+                if(symbolizer.haloRadius != null ||
+                   symbolizer.haloColor != null ||
+                   symbolizer.haloOpacity != null) {
+                    this.writeNode("Halo", symbolizer, node);
+                }
+                // add in optional Fill
+                if(symbolizer.fillColor != null ||
+                   symbolizer.fillOpacity != null) {
+                    this.writeNode("Fill", symbolizer, node);
+                }
+                return node;
+            },
+            "Font": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Font");
+                // add in CssParameters
+                if(symbolizer.fontFamily) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fontFamily"},
+                        node
+                    );
+                }
+                if(symbolizer.fontSize) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fontSize"},
+                        node
+                    );
+                }
+                if(symbolizer.fontWeight) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fontWeight"},
+                        node
+                    );
+                }
+                if(symbolizer.fontStyle) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fontStyle"},
+                        node
+                    );
+                }
+                return node;
+            },
+            "Label": function(label) {
+                // only the simplest of ogc:expression handled
+                // {label: "some text and a ${propertyName}"}
+                var node = this.createElementNSPlus("sld:Label");
+                var tokens = label.split("${");
+                node.appendChild(this.createTextNode(tokens[0]));
+                var item, last;
+                for(var i=1, len=tokens.length; i<len; i++) {
+                    item = tokens[i];
+                    last = item.indexOf("}"); 
+                    if(last > 0) {
+                        this.writeNode(
+                            "ogc:PropertyName",
+                            {property: item.substring(0, last)},
+                            node
+                        );
+                        node.appendChild(
+                            this.createTextNode(item.substring(++last))
+                        );
+                    } else {
+                        // no ending }, so this is a literal ${
+                        node.appendChild(
+                            this.createTextNode("${" + item)
+                        );
+                    }
+                }
+                return node;
+            },
+            "Halo": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Halo");
+                if(symbolizer.haloRadius) {
+                    this.writeNode("Radius", symbolizer.haloRadius, node);
+                }
+                if(symbolizer.haloColor || symbolizer.haloOpacity) {
+                    this.writeNode("Fill", {
+                        fillColor: symbolizer.haloColor,
+                        fillOpacity: symbolizer.haloOpacity
+                    }, node);
+                }
+                return node;
+            },
+            "Radius": function(value) {
+                return this.createElementNSPlus("sld:Radius", {
+                    value: value
+                });
+            },
+            "RasterSymbolizer": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:RasterSymbolizer");
+                if (symbolizer.geometry) {
+                    this.writeNode("Geometry", symbolizer.geometry, node);
+                }
+                if (symbolizer.opacity) {
+                    this.writeNode("Opacity", symbolizer.opacity, node);
+                }
+                if (symbolizer.colorMap) {
+                    this.writeNode("ColorMap", symbolizer.colorMap, node);
+                }
+                return node;
+            },
+            "Geometry": function(geometry) {
+                var node = this.createElementNSPlus("sld:Geometry");
+                if (geometry.property) {
+                    this.writeNode("ogc:PropertyName", geometry, node);
+                }
+                return node;
+            },
+            "ColorMap": function(colorMap) {
+                var node = this.createElementNSPlus("sld:ColorMap");
+                for (var i=0, len=colorMap.length; i<len; ++i) {
+                    this.writeNode("ColorMapEntry", colorMap[i], node);
+                }
+                return node;
+            },
+            "ColorMapEntry": function(colorMapEntry) {
+                var node = this.createElementNSPlus("sld:ColorMapEntry");
+                var a = colorMapEntry;
+                node.setAttribute("color", a.color);
+                a.opacity !== undefined && node.setAttribute("opacity",
+                    parseFloat(a.opacity));
+                a.quantity !== undefined && node.setAttribute("quantity",
+                    parseFloat(a.quantity));
+                a.label !== undefined && node.setAttribute("label", a.label);
+                return node;
+            },
+            "PolygonSymbolizer": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:PolygonSymbolizer");
+                if(symbolizer.fill !== false) {
+                    this.writeNode("Fill", symbolizer, node);
+                }
+                if(symbolizer.stroke !== false) {
+                    this.writeNode("Stroke", symbolizer, node);
+                }
+                return node;
+            },
+            "Fill": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Fill");
+                
+                // GraphicFill here
+                
+                // add in CssParameters
+                if(symbolizer.fillColor) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fillColor"},
+                        node
+                    );
+                }
+                if(symbolizer.fillOpacity != null) {
+                    this.writeNode(
+                        "CssParameter",
+                        {symbolizer: symbolizer, key: "fillOpacity"},
+                        node
+                    );
+                }
+                return node;
+            },
+            "PointSymbolizer": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:PointSymbolizer");
+                this.writeNode("Graphic", symbolizer, node);
+                return node;
+            },
+            "Graphic": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Graphic");
+                if(symbolizer.externalGraphic != undefined) {
+                    this.writeNode("ExternalGraphic", symbolizer, node);
+                } else {
+                    this.writeNode("Mark", symbolizer, node);
+                }
+                
+                if(symbolizer.graphicOpacity != undefined) {
+                    this.writeNode("Opacity", symbolizer.graphicOpacity, node);
+                }
+                if(symbolizer.pointRadius != undefined) {
+                    this.writeNode("Size", symbolizer.pointRadius * 2, node);
+                }
+                if(symbolizer.rotation != undefined) {
+                    this.writeNode("Rotation", symbolizer.rotation, node);
+                }
+                return node;
+            },
+            "ExternalGraphic": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:ExternalGraphic");
+                this.writeNode(
+                    "OnlineResource", symbolizer.externalGraphic, node
+                );
+                var format = symbolizer.graphicFormat ||
+                             this.getGraphicFormat(symbolizer.externalGraphic);
+                this.writeNode("Format", format, node);
+                return node;
+            },
+            "Mark": function(symbolizer) {
+                var node = this.createElementNSPlus("sld:Mark");
+                if(symbolizer.graphicName) {
+                    this.writeNode("WellKnownName", symbolizer.graphicName, node);
+                }
+                if (symbolizer.fill !== false) {
+                    this.writeNode("Fill", symbolizer, node);
+                }
+                if (symbolizer.stroke !== false) {
+                    this.writeNode("Stroke", symbolizer, node);
+                }
+                return node;
+            },
+            "WellKnownName": function(name) {
+                return this.createElementNSPlus("sld:WellKnownName", {
+                    value: name
+                });
+            },
+            "Opacity": function(value) {
+                return this.createElementNSPlus("sld:Opacity", {
+                    value: value
+                });
+            },
+            "Size": function(value) {
+                return this.createElementNSPlus("sld:Size", {
+                    value: value
+                });
+            },
+            "Rotation": function(value) {
+                return this.createElementNSPlus("sld:Rotation", {
+                    value: value
+                });
+            },
+            "OnlineResource": function(href) {
+                return this.createElementNSPlus("sld:OnlineResource", {
+                    attributes: {
+                        "xlink:type": "simple",
+                        "xlink:href": href
+                    }
+                });
+            },
+            "Format": function(format) {
+                return this.createElementNSPlus("sld:Format", {
+                    value: format
+                });
+            }
+        }
+    }, OpenLayers.Format.Filter.v1_0_0.prototype.writers),
+    
+    CLASS_NAME: "OpenLayers.Format.SLD.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/JSON.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/JSON.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/JSON.js	(revision 76)
@@ -0,0 +1,389 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Note:
+ * This work draws heavily from the public domain JSON serializer/deserializer
+ *     at http://www.json.org/json.js. Rewritten so that it doesn't modify
+ *     basic data prototypes.
+ */
+
+/**
+ * @requires OpenLayers/Format.js
+ */
+
+/**
+ * Class: OpenLayers.Format.JSON
+ * A parser to read/write JSON safely.  Create a new instance with the
+ *     <OpenLayers.Format.JSON> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.JSON = OpenLayers.Class(OpenLayers.Format, {
+    
+    /**
+     * APIProperty: indent
+     * {String} For "pretty" printing, the indent string will be used once for
+     *     each indentation level.
+     */
+    indent: "    ",
+    
+    /**
+     * APIProperty: space
+     * {String} For "pretty" printing, the space string will be used after
+     *     the ":" separating a name/value pair.
+     */
+    space: " ",
+    
+    /**
+     * APIProperty: newline
+     * {String} For "pretty" printing, the newline string will be used at the
+     *     end of each name/value pair or array item.
+     */
+    newline: "\n",
+    
+    /**
+     * Property: level
+     * {Integer} For "pretty" printing, this is incremented/decremented during
+     *     serialization.
+     */
+    level: 0,
+
+    /**
+     * Property: pretty
+     * {Boolean} Serialize with extra whitespace for structure.  This is set
+     *     by the <write> method.
+     */
+    pretty: false,
+
+    /**
+     * Constructor: OpenLayers.Format.JSON
+     * Create a new parser for JSON.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Deserialize a json string.
+     *
+     * Parameters:
+     * json - {String} A JSON string
+     * filter - {Function} A function which will be called for every key and
+     *     value at every level of the final result. Each value will be
+     *     replaced by the result of the filter function. This can be used to
+     *     reform generic objects into instances of classes, or to transform
+     *     date strings into Date objects.
+     *     
+     * Returns:
+     * {Object} An object, array, string, or number .
+     */
+    read: function(json, filter) {
+        /**
+         * Parsing happens in three stages. In the first stage, we run the text
+         *     against a regular expression which looks for non-JSON
+         *     characters. We are especially concerned with '()' and 'new'
+         *     because they can cause invocation, and '=' because it can cause
+         *     mutation. But just to be safe, we will reject all unexpected
+         *     characters.
+         */
+        try {
+            if (/^[\],:{}\s]*$/.test(json.replace(/\\["\\\/bfnrtu]/g, '@').
+                                replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').
+                                replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
+
+                /**
+                 * In the second stage we use the eval function to compile the
+                 *     text into a JavaScript structure. The '{' operator is
+                 *     subject to a syntactic ambiguity in JavaScript - it can
+                 *     begin a block or an object literal. We wrap the text in
+                 *     parens to eliminate the ambiguity.
+                 */
+                var object = eval('(' + json + ')');
+
+                /**
+                 * In the optional third stage, we recursively walk the new
+                 *     structure, passing each name/value pair to a filter
+                 *     function for possible transformation.
+                 */
+                if(typeof filter === 'function') {
+                    function walk(k, v) {
+                        if(v && typeof v === 'object') {
+                            for(var i in v) {
+                                if(v.hasOwnProperty(i)) {
+                                    v[i] = walk(i, v[i]);
+                                }
+                            }
+                        }
+                        return filter(k, v);
+                    }
+                    object = walk('', object);
+                }
+
+                if(this.keepData) {
+                    this.data = object;
+                }
+
+                return object;
+            }
+        } catch(e) {
+            // Fall through if the regexp test fails.
+        }
+        return null;
+    },
+
+    /**
+     * APIMethod: write
+     * Serialize an object into a JSON string.
+     *
+     * Parameters:
+     * value - {String} The object, array, string, number, boolean or date
+     *     to be serialized.
+     * pretty - {Boolean} Structure the output with newlines and indentation.
+     *     Default is false.
+     *
+     * Returns:
+     * {String} The JSON string representation of the input value.
+     */
+    write: function(value, pretty) {
+        this.pretty = !!pretty;
+        var json = null;
+        var type = typeof value;
+        if(this.serialize[type]) {
+            try {
+                json = this.serialize[type].apply(this, [value]);
+            } catch(err) {
+                OpenLayers.Console.error("Trouble serializing: " + err);
+            }
+        }
+        return json;
+    },
+    
+    /**
+     * Method: writeIndent
+     * Output an indentation string depending on the indentation level.
+     *
+     * Returns:
+     * {String} An appropriate indentation string.
+     */
+    writeIndent: function() {
+        var pieces = [];
+        if(this.pretty) {
+            for(var i=0; i<this.level; ++i) {
+                pieces.push(this.indent);
+            }
+        }
+        return pieces.join('');
+    },
+    
+    /**
+     * Method: writeNewline
+     * Output a string representing a newline if in pretty printing mode.
+     *
+     * Returns:
+     * {String} A string representing a new line.
+     */
+    writeNewline: function() {
+        return (this.pretty) ? this.newline : '';
+    },
+    
+    /**
+     * Method: writeSpace
+     * Output a string representing a space if in pretty printing mode.
+     *
+     * Returns:
+     * {String} A space.
+     */
+    writeSpace: function() {
+        return (this.pretty) ? this.space : '';
+    },
+
+    /**
+     * Property: serialize
+     * Object with properties corresponding to the serializable data types.
+     *     Property values are functions that do the actual serializing.
+     */
+    serialize: {
+        /**
+         * Method: serialize.object
+         * Transform an object into a JSON string.
+         *
+         * Parameters:
+         * object - {Object} The object to be serialized.
+         * 
+         * Returns:
+         * {String} A JSON string representing the object.
+         */
+        'object': function(object) {
+            // three special objects that we want to treat differently
+            if(object == null) {
+                return "null";
+            }
+            if(object.constructor == Date) {
+                return this.serialize.date.apply(this, [object]);
+            }
+            if(object.constructor == Array) {
+                return this.serialize.array.apply(this, [object]);
+            }
+            var pieces = ['{'];
+            this.level += 1;
+            var key, keyJSON, valueJSON;
+            
+            var addComma = false;
+            for(key in object) {
+                if(object.hasOwnProperty(key)) {
+                    // recursive calls need to allow for sub-classing
+                    keyJSON = OpenLayers.Format.JSON.prototype.write.apply(this,
+                                                    [key, this.pretty]);
+                    valueJSON = OpenLayers.Format.JSON.prototype.write.apply(this,
+                                                    [object[key], this.pretty]);
+                    if(keyJSON != null && valueJSON != null) {
+                        if(addComma) {
+                            pieces.push(',');
+                        }
+                        pieces.push(this.writeNewline(), this.writeIndent(),
+                                    keyJSON, ':', this.writeSpace(), valueJSON);
+                        addComma = true;
+                    }
+                }
+            }
+            
+            this.level -= 1;
+            pieces.push(this.writeNewline(), this.writeIndent(), '}');
+            return pieces.join('');
+        },
+        
+        /**
+         * Method: serialize.array
+         * Transform an array into a JSON string.
+         *
+         * Parameters:
+         * array - {Array} The array to be serialized
+         * 
+         * Returns:
+         * {String} A JSON string representing the array.
+         */
+        'array': function(array) {
+            var json;
+            var pieces = ['['];
+            this.level += 1;
+    
+            for(var i=0, len=array.length; i<len; ++i) {
+                // recursive calls need to allow for sub-classing
+                json = OpenLayers.Format.JSON.prototype.write.apply(this,
+                                                    [array[i], this.pretty]);
+                if(json != null) {
+                    if(i > 0) {
+                        pieces.push(',');
+                    }
+                    pieces.push(this.writeNewline(), this.writeIndent(), json);
+                }
+            }
+
+            this.level -= 1;    
+            pieces.push(this.writeNewline(), this.writeIndent(), ']');
+            return pieces.join('');
+        },
+        
+        /**
+         * Method: serialize.string
+         * Transform a string into a JSON string.
+         *
+         * Parameters:
+         * string - {String} The string to be serialized
+         * 
+         * Returns:
+         * {String} A JSON string representing the string.
+         */
+        'string': function(string) {
+            // If the string contains no control characters, no quote characters, and no
+            // backslash characters, then we can simply slap some quotes around it.
+            // Otherwise we must also replace the offending characters with safe
+            // sequences.    
+            var m = {
+                '\b': '\\b',
+                '\t': '\\t',
+                '\n': '\\n',
+                '\f': '\\f',
+                '\r': '\\r',
+                '"' : '\\"',
+                '\\': '\\\\'
+            };
+            if(/["\\\x00-\x1f]/.test(string)) {
+                return '"' + string.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                    var c = m[b];
+                    if(c) {
+                        return c;
+                    }
+                    c = b.charCodeAt();
+                    return '\\u00' +
+                        Math.floor(c / 16).toString(16) +
+                        (c % 16).toString(16);
+                }) + '"';
+            }
+            return '"' + string + '"';
+        },
+
+        /**
+         * Method: serialize.number
+         * Transform a number into a JSON string.
+         *
+         * Parameters:
+         * number - {Number} The number to be serialized.
+         *
+         * Returns:
+         * {String} A JSON string representing the number.
+         */
+        'number': function(number) {
+            return isFinite(number) ? String(number) : "null";
+        },
+        
+        /**
+         * Method: serialize.boolean
+         * Transform a boolean into a JSON string.
+         *
+         * Parameters:
+         * bool - {Boolean} The boolean to be serialized.
+         * 
+         * Returns:
+         * {String} A JSON string representing the boolean.
+         */
+        'boolean': function(bool) {
+            return String(bool);
+        },
+        
+        /**
+         * Method: serialize.object
+         * Transform a date into a JSON string.
+         *
+         * Parameters:
+         * date - {Date} The date to be serialized.
+         * 
+         * Returns:
+         * {String} A JSON string representing the date.
+         */
+        'date': function(date) {    
+            function format(number) {
+                // Format integers to have at least two digits.
+                return (number < 10) ? '0' + number : number;
+            }
+            return '"' + date.getFullYear() + '-' +
+                    format(date.getMonth() + 1) + '-' +
+                    format(date.getDate()) + 'T' +
+                    format(date.getHours()) + ':' +
+                    format(date.getMinutes()) + ':' +
+                    format(date.getSeconds()) + '"';
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.JSON" 
+
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML/Features.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML/Features.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/ArcXML/Features.js	(revision 76)
@@ -0,0 +1,49 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/ArcXML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.ArcXML.Features
+ * Read/Wite ArcXML features. Create a new instance with the 
+ *     <OpenLayers.Format.ArcXML.Features> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.ArcXML.Features = OpenLayers.Class(OpenLayers.Format.XML, {
+
+    /**
+     * Constructor: OpenLayers.Format.ArcXML.Features
+     * Create a new parser/writer for ArcXML Features.  Create an instance of this class
+     * to get a set of features from an ArcXML response.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {     
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Read data from a string of ArcXML, and return a set of OpenLayers features. 
+     * 
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} A collection of features.
+     */
+    read: function(data) {
+        var axl = new OpenLayers.Format.ArcXML();
+        var parsed = axl.read(data);
+        
+        return parsed.features.feature;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetFeatureOfInterest.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetFeatureOfInterest.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/SOSGetFeatureOfInterest.js	(revision 76)
@@ -0,0 +1,193 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+ 
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/GML/v3.js
+ */
+
+/**
+ * Class: OpenLayers.Format.SOSGetFeatureOfInterest
+ * Read and write SOS GetFeatureOfInterest. This is used to get to
+ * the location of the features (stations). The stations can have 1 or more
+ * sensors.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.SOSGetFeatureOfInterest = OpenLayers.Class(
+    OpenLayers.Format.XML, {
+    
+    /**
+     * Constant: VERSION
+     * {String} 1.0.0
+     */
+    VERSION: "1.0.0",
+
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        sos: "http://www.opengis.net/sos/1.0",
+        gml: "http://www.opengis.net/gml",
+        sa: "http://www.opengis.net/sampling/1.0",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location
+     */
+    schemaLocation: "http://www.opengis.net/sos/1.0 http://schemas.opengis.net/sos/1.0.0/sosAll.xsd",
+
+    /**
+     * Property: defaultPrefix
+     */
+    defaultPrefix: "sos",
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+    
+    /**
+     * Constructor: OpenLayers.Format.SOSGetFeatureOfInterest
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: read
+     * Parse a GetFeatureOfInterest response and return an array of features
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Feature.Vector>)} An array of features. 
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+
+        var info = {features: []};
+        this.readNode(data, info);
+       
+        var features = [];
+        for (var i=0, len=info.features.length; i<len; i++) {
+            var container = info.features[i];
+            // reproject features if needed
+            if(this.internalProjection && this.externalProjection &&
+                container.components[0]) {
+                    container.components[0].transform(
+                        this.externalProjection, this.internalProjection
+                    );
+            }             
+            var feature = new OpenLayers.Feature.Vector(
+                container.components[0], container.attributes);
+            features.push(feature);
+        }
+        return features;
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "sa": {
+            "SamplingPoint": function(node, obj) {
+                // sampling point can also be without a featureMember if 
+                // there is only 1
+                if (!obj.attributes) {
+                    var feature = {attributes: {}};
+                    obj.features.push(feature);
+                    obj = feature;
+                }
+                obj.attributes.id = this.getAttributeNS(node, 
+                    this.namespaces.gml, "id");
+                this.readChildNodes(node, obj);
+            },
+            "position": function (node, obj) {
+                this.readChildNodes(node, obj);
+            }
+        },
+        "gml": OpenLayers.Util.applyDefaults({
+            "FeatureCollection": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "featureMember": function(node, obj) {
+                var feature = {attributes: {}};
+                obj.features.push(feature);
+                this.readChildNodes(node, feature);
+            },
+            "name": function(node, obj) {
+                obj.attributes.name = this.getChildValue(node);
+            },
+            "pos": function(node, obj) {
+                // we need to parse the srsName to get to the 
+                // externalProjection, that's why we cannot use
+                // GML v3 for this
+                if (!this.externalProjection) {
+                    this.externalProjection = new OpenLayers.Projection(
+                        node.getAttribute("srsName"));
+                }
+             OpenLayers.Format.GML.v3.prototype.readers.gml.pos.apply(
+                    this, [node, obj]);
+            }
+        }, OpenLayers.Format.GML.v3.prototype.readers.gml)
+    },
+    
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "sos": {
+            "GetFeatureOfInterest": function(options) {
+                var node = this.createElementNSPlus("GetFeatureOfInterest", {
+                    attributes: {
+                        version: this.VERSION,
+                        service: 'SOS',
+                        "xsi:schemaLocation": this.schemaLocation
+                    } 
+                }); 
+                for (var i=0, len=options.fois.length; i<len; i++) {
+                    this.writeNode("FeatureOfInterestId", {foi: options.fois[i]}, node);
+                }
+                return node; 
+            },
+            "FeatureOfInterestId": function(options) {
+                var node = this.createElementNSPlus("FeatureOfInterestId", {value: options.foi});
+                return node;
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.SOSGetFeatureOfInterest" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/CSWGetDomain.js	(revision 76)
@@ -0,0 +1,34 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format.js
+ */
+
+/**
+ * Function: OpenLayers.Format.CSWGetDomain.
+ *     Default version is 2.0.2.
+ *
+ * Returns:
+ * {<OpenLayers.Format>} A CSWGetDomain format of the given version.
+ */
+OpenLayers.Format.CSWGetDomain = function(options) {
+    options = OpenLayers.Util.applyDefaults(
+        options, OpenLayers.Format.CSWGetDomain.DEFAULTS
+    );
+    var cls = OpenLayers.Format.CSWGetDomain["v"+options.version.replace(/\./g, "_")];
+    if(!cls) {
+        throw "Unsupported CSWGetDomain version: " + options.version;
+    }
+    return new cls(options);
+};
+
+/**
+ * Constant: OpenLayers.Format.CSWGetDomain.DEFAULTS
+ * {Object} Default properties for the CSWGetDomain format.
+ */
+OpenLayers.Format.CSWGetDomain.DEFAULTS = {
+    "version": "2.0.2"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Context.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Context.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Context.js	(revision 76)
@@ -0,0 +1,334 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Context
+ * Base class for both Format.WMC and Format.OWSContext
+ */
+OpenLayers.Format.Context = OpenLayers.Class({
+
+    /**
+     * APIProperty: version
+     * {String} Specify a version string if one is known.
+     */
+    version: null,
+
+    /**
+     * Property: layerOptions
+     * {Object} Default options for layers created by the parser. These
+     *     options are overridden by the options which are read from the
+     *     capabilities document.
+     */
+    layerOptions: null,
+
+    /**
+     * Property: layerParams
+     * {Object} Default parameters for layers created by the parser. This
+     *     can be used e.g. to override DEFAULT_PARAMS for 
+     *     OpenLayers.Layer.WMS.
+     */
+    layerParams: null,
+
+    /**
+     * Property: parser
+     * {Object} Instance of the versioned parser.  Cached for multiple read and
+     *     write calls of the same version.
+     */
+    parser: null,
+
+    /**
+     * Constructor: OpenLayers.Format.Context
+     * Create a new parser for Context documents.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Util.extend(this, options);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read Context data from a string, and return an object with map
+     *     properties and a list of layers.
+     *
+     * Parameters:
+     * data - {String} or {DOMElement} data to read/parse.
+     * options - {Object} The options object must contain a map property.  If
+     *     the map property is a string, it must be the id of a dom element
+     *     where the new map will be placed.  If the map property is an
+     *     <OpenLayers.Map>, the layers from the context document will be added
+     *     to the map.
+     *
+     * Returns:
+     * {<OpenLayers.Map>} A map based on the context.
+     */
+    read: function(data, options) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var root = data.documentElement;
+        var version = this.version;
+        if(!version) {
+            version = root.getAttribute("version");
+        }
+        var parser = this.getParser(version);
+        var context = parser.read(data, options);
+        var map;
+        if(options && options.map) {
+            this.context = context;
+            if(options.map instanceof OpenLayers.Map) {
+                map = this.mergeContextToMap(context, options.map);
+            } else {
+                var mapOptions = options.map;
+                if(OpenLayers.Util.isElement(mapOptions) ||
+                   typeof mapOptions == "string") {
+                    // we assume mapOptions references a div
+                    // element
+                    mapOptions = {div: mapOptions};
+                }
+                map = this.contextToMap(context, mapOptions);
+            }
+        } else {
+            // not documented as part of the API, provided as a non-API option
+            map = context;
+        }
+        return map;
+    },
+
+    /**
+     * Method: getLayerFromContext
+     * Create a WMS layer from a layerContext object.
+     *
+     * Parameters:
+     * layerContext - {Object} An object representing a WMS layer.
+     *
+     * Returns:
+     * {<OpenLayers.Layer.WMS>} A WMS layer.
+     */
+    getLayerFromContext: function(layerContext) {
+        var i, len;
+        // fill initial options object from layerContext
+        var options = {
+            queryable: layerContext.queryable, //keep queryable for api compatibility
+            visibility: layerContext.visibility,
+            maxExtent: layerContext.maxExtent,
+            metadata: OpenLayers.Util.applyDefaults(layerContext.metadata, 
+                {styles: layerContext.styles}),
+            numZoomLevels: layerContext.numZoomLevels,
+            units: layerContext.units,
+            isBaseLayer: layerContext.isBaseLayer,
+            opacity: layerContext.opacity,
+            displayInLayerSwitcher: layerContext.displayInLayerSwitcher,
+            singleTile: layerContext.singleTile,
+            tileSize: (layerContext.tileSize) ? 
+                new OpenLayers.Size(
+                    layerContext.tileSize.width, 
+                    layerContext.tileSize.height
+                ) : undefined,
+            minScale: layerContext.minScale || layerContext.maxScaleDenominator,
+            maxScale: layerContext.maxScale || layerContext.minScaleDenominator
+        };
+        if (this.layerOptions) {
+            OpenLayers.Util.applyDefaults(options, this.layerOptions);
+        }
+
+        var params = {
+            layers: layerContext.name,
+            transparent: layerContext.transparent,
+            version: layerContext.version
+        };
+        if (layerContext.formats && layerContext.formats.length>0) {
+            // set default value for params if current attribute is not positionned
+            params.format = layerContext.formats[0].value;
+            for (i=0, len=layerContext.formats.length; i<len; i++) {
+                var format = layerContext.formats[i];
+                if (format.current == true) {
+                    params.format = format.value;
+                    break;
+                }
+            }
+        }
+        if (layerContext.styles && layerContext.styles.length>0) {
+            for (i=0, len=layerContext.styles.length; i<len; i++) {
+                var style = layerContext.styles[i];
+                if (style.current == true) {
+                    // three style types to consider
+                    // 1) linked SLD
+                    // 2) inline SLD
+                    // 3) named style
+                    if(style.href) {
+                        params.sld = style.href;
+                    } else if(style.body) {
+                        params.sld_body = style.body;
+                    } else {
+                        params.styles = style.name;
+                    }
+                    break;
+                }
+            }
+        }
+        if (this.layerParams) {
+            OpenLayers.Util.applyDefaults(params, this.layerParams);
+        }
+
+        var layer = null;
+        var service = layerContext.service;
+        if (service == OpenLayers.Format.Context.serviceTypes.WFS) {
+            options.strategies = [new OpenLayers.Strategy.BBOX()];
+            options.protocol = new OpenLayers.Protocol.WFS({
+                url: layerContext.url,
+                // since we do not know featureNS, let the protocol
+                // determine it automagically using featurePrefix
+                featurePrefix: layerContext.name.split(":")[0],
+                featureType: layerContext.name.split(":").pop()
+            });
+            layer = new OpenLayers.Layer.Vector(
+                layerContext.title || layerContext.name,
+                options
+            );
+        } else if (service == OpenLayers.Format.Context.serviceTypes.KML) {
+            // use a vector layer with an HTTP Protcol and a Fixed strategy
+            options.strategies = [new OpenLayers.Strategy.Fixed()];
+            options.protocol = new OpenLayers.Protocol.HTTP({
+                url: layerContext.url, 
+                format: new OpenLayers.Format.KML()
+            });
+            layer = new OpenLayers.Layer.Vector(
+                layerContext.title || layerContext.name,
+                options
+            );
+        } else if (service == OpenLayers.Format.Context.serviceTypes.GML) {
+            // use a vector layer with a HTTP Protocol and a Fixed strategy
+            options.strategies = [new OpenLayers.Strategy.Fixed()];
+            options.protocol = new OpenLayers.Protocol.HTTP({
+                url: layerContext.url, 
+                format: new OpenLayers.Format.GML()
+            });
+            layer = new OpenLayers.Layer.Vector(
+                layerContext.title || layerContext.name,
+                options
+            );
+        } else if (layerContext.features) {
+            // inline GML or KML features
+            layer = new OpenLayers.Layer.Vector(
+                layerContext.title || layerContext.name,
+                options
+            );
+            layer.addFeatures(layerContext.features);
+        } else if (layerContext.categoryLayer !== true) {
+            layer = new OpenLayers.Layer.WMS(
+                layerContext.title || layerContext.name,
+                layerContext.url,
+                params,
+                options
+            );
+        }
+        return layer;
+    },
+
+    /**
+     * Method: getLayersFromContext
+     * Create an array of layers from an array of layerContext objects.
+     *
+     * Parameters:
+     * layersContext - {Array(Object)} An array of objects representing layers.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Layer>)} An array of layers.
+     */
+    getLayersFromContext: function(layersContext) {
+        var layers = [];
+        for (var i=0, len=layersContext.length; i<len; i++) {
+            var layer = this.getLayerFromContext(layersContext[i]);
+            if (layer !== null) {
+                layers.push(layer);
+            }
+        }
+        return layers;
+    },
+
+    /**
+     * Method: contextToMap
+     * Create a map given a context object.
+     *
+     * Parameters:
+     * context - {Object} The context object.
+     * options - {Object} Default map options.
+     *
+     * Returns:
+     * {<OpenLayers.Map>} A map based on the context object.
+     */
+    contextToMap: function(context, options) {
+        options = OpenLayers.Util.applyDefaults({
+            maxExtent: context.maxExtent,
+            projection: context.projection
+        }, options);
+        var map = new OpenLayers.Map(options);
+        map.addLayers(this.getLayersFromContext(context.layersContext));
+        map.setCenter(
+            context.bounds.getCenterLonLat(),
+            map.getZoomForExtent(context.bounds, true)
+        );
+        return map;
+    },
+
+    /**
+     * Method: mergeContextToMap
+     * Add layers from a context object to a map.
+     *
+     * Parameters:
+     * context - {Object} The context object.
+     * map - {<OpenLayers.Map>} The map.
+     *
+     * Returns:
+     * {<OpenLayers.Map>} The same map with layers added.
+     */
+    mergeContextToMap: function(context, map) {
+        map.addLayers(this.getLayersFromContext(context.layersContext));
+        return map;
+    },
+
+    /**
+     * APIMethod: write
+     * Write a context document given a map.
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Map> | Object} A map or context object.
+     * options - {Object} Optional configuration object.
+     *
+     * Returns:
+     * {String} A context document string.
+     */
+    write: function(obj, options) {
+        obj = this.toContext(obj);
+        var version = options && options.version;
+        var parser = this.getParser(version);
+        var context = parser.write(obj, options);
+        return context;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.Context"
+});
+
+/**
+ * Constant: OpenLayers.Format.Context.serviceTypes
+ * Enumeration for service types
+ */
+OpenLayers.Format.Context.serviceTypes = {
+    "WMS": "urn:ogc:serviceType:WMS",
+    "WFS": "urn:ogc:serviceType:WFS",
+    "WCS": "urn:ogc:serviceType:WCS",
+    "GML": "urn:ogc:serviceType:GML",
+    "SLD": "urn:ogc:serviceType:SLD",
+    "FES": "urn:ogc:serviceType:FES",
+    "KML": "urn:ogc:serviceType:KML"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMC.js	(revision 76)
@@ -0,0 +1,152 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/Context.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMC
+ * Read and write Web Map Context documents.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WMC = OpenLayers.Class(OpenLayers.Format.Context, {
+    
+    /**
+     * APIProperty: defaultVersion
+     * {String} Version number to assume if none found.  Default is "1.1.0".
+     */
+    defaultVersion: "1.1.0",
+    
+    /**
+     * Method: getParser
+     * Get the WMC parser given a version. Create a new parser if it does not
+     * already exist.
+     *
+     * Parameters:
+     * version - {String} The version of the parser.
+     *
+     * Returns:
+     * {<OpenLayers.Format.WMC.v1>} A WMC parser.
+     */
+    getParser: function(version) {
+        var v = version || this.version || this.defaultVersion;
+        if(!this.parser || this.parser.VERSION != v) {
+            var format = OpenLayers.Format.WMC[
+                "v" + v.replace(/\./g, "_")
+            ];
+            if(!format) {
+                throw "Can't find a WMC parser for version " + v;
+            }
+            this.parser = new format(this.options);
+        }
+        return this.parser;
+    },
+
+    /**
+     * Method: layerToContext
+     * Create a layer context object given a wms layer object.
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Layer.WMS>} The layer.
+     *
+     * Returns:
+     * {Object} A layer context object.
+     */
+    layerToContext: function(layer) {
+        var parser = this.getParser();
+        var layerContext = {
+            queryable: layer.queryable,
+            visibility: layer.visibility,
+            name: layer.params["LAYERS"],
+            title: layer.name,
+            metadataURL: layer.metadataURL,
+            version: layer.params["VERSION"],
+            url: layer.url,
+            maxExtent: layer.maxExtent,
+            transparent: layer.params["TRANSPARENT"],
+            numZoomLevels: layer.numZoomLevels,
+            units: layer.units,
+            isBaseLayer: layer.isBaseLayer,
+            opacity: layer.opacity,
+            displayInLayerSwitcher: layer.displayInLayerSwitcher,
+            singleTile: layer.singleTile,
+            tileSize: (layer.singleTile || !layer.tileSize) ? 
+                undefined : {width: layer.tileSize.w, height: layer.tileSize.h},
+            minScale : (layer.options.resolutions ||
+                        layer.options.scales || 
+                        layer.options.maxResolution || 
+                        layer.options.minScale) ? 
+                        layer.minScale : undefined,
+            maxScale : (layer.options.resolutions ||
+                        layer.options.scales || 
+                        layer.options.minResolution || 
+                        layer.options.maxScale) ? 
+                        layer.maxScale : undefined,
+            formats: [{
+                value: layer.params["FORMAT"],
+                current: true
+            }],
+            styles: [{
+                href: layer.params["SLD"],
+                body: layer.params["SLD_BODY"],
+                name: layer.params["STYLES"] || parser.defaultStyleName,
+                title: parser.defaultStyleTitle,
+                current: true
+            }]
+        };
+        return layerContext;
+    },
+    
+    /**
+     * Method: toContext
+     * Create a context object free from layer given a map or a
+     * context object.
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Map> | Object} The map or context.
+     *
+     * Returns:
+     * {Object} A context object.
+     */
+    toContext: function(obj) {
+        var context = {};
+        var layers = obj.layers;
+        if(obj.CLASS_NAME == "OpenLayers.Map") {
+            context.bounds = obj.getExtent();
+            context.maxExtent = obj.maxExtent;
+            context.projection = obj.projection;
+            context.size = obj.getSize();
+        }
+        else {
+            // copy all obj properties except the "layers" property
+            OpenLayers.Util.applyDefaults(context, obj);
+            if(context.layers != undefined) {
+                delete(context.layers);
+            }
+        }
+
+        if (context.layersContext == undefined) {
+            context.layersContext = [];
+        }
+
+        // let's convert layers into layersContext object (if any)
+        if (layers != undefined && layers instanceof Array) {
+            for (var i=0, len=layers.length; i<len; i++) {
+                var layer = layers[i];
+                if(layer instanceof OpenLayers.Layer.WMS) {
+                    context.layersContext.push(this.layerToContext(layer));
+                }
+            }
+        }
+        return context;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WMC" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WMTSCapabilities/v1_0_0.js	(revision 76)
@@ -0,0 +1,221 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WMTSCapabilities.js
+ * @requires OpenLayers/Format/OWSCommon/v1_1_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WMTSCapabilities.v1_0_0
+ * Read WMTS Capabilities version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WMTSCapabilities>
+ */
+OpenLayers.Format.WMTSCapabilities.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.OWSCommon.v1_1_0, {
+        
+    /**
+     * Property: version
+     * {String} The parser version ("1.0.0").
+     */
+    version: "1.0.0",
+
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        ows: "http://www.opengis.net/ows/1.1",
+        wmts: "http://www.opengis.net/wmts/1.0",
+        xlink: "http://www.w3.org/1999/xlink"
+    },    
+    
+    /**
+     * Property: yx
+     * {Object} Members in the yx object are used to determine if a CRS URN
+     *     corresponds to a CRS with y,x axis order.  Member names are CRS URNs
+     *     and values are boolean.  Defaults come from the 
+     *     <OpenLayers.Format.WMTSCapabilities> prototype.
+     */
+    yx: null,
+
+    /**
+     * Property: defaultPrefix
+     * {String} The default namespace alias for creating element nodes.
+     */
+    defaultPrefix: "wmts",
+
+    /**
+     * Constructor: OpenLayers.Format.WMTSCapabilities.v1_0_0
+     * Create a new parser for WMTS capabilities version 1.0.0. 
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+        var yx = OpenLayers.Util.extend(
+            {}, OpenLayers.Format.WMTSCapabilities.prototype.yx
+        );
+        this.yx = OpenLayers.Util.extend(yx, this.yx);
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return info about the WMTS.
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} Information about the SOS service.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var capabilities = {};
+        this.readNode(data, capabilities);
+        capabilities.version = this.version;
+        return capabilities;
+    },
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {        
+        "wmts": {
+            "Capabilities": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Contents": function(node, obj) {
+                obj.contents = {};                
+                obj.contents.layers = [];
+                obj.contents.tileMatrixSets = {};                
+                this.readChildNodes(node, obj.contents);
+            },
+            "Layer": function(node, obj) {
+                var layer = {
+                    styles: [],
+                    formats: [],
+                    tileMatrixSetLinks: []
+                };
+                layer.layers = [];
+                this.readChildNodes(node, layer);
+                obj.layers.push(layer);
+            },
+            "Style": function(node, obj) {
+                var style = {};
+                style.isDefault = (node.getAttribute("isDefault") === "true");
+                this.readChildNodes(node, style);
+                obj.styles.push(style);
+            },
+            "Format": function(node, obj) {
+                obj.formats.push(this.getChildValue(node)); 
+            },
+            "TileMatrixSetLink": function(node, obj) {
+                var tileMatrixSetLink = {};
+                this.readChildNodes(node, tileMatrixSetLink);
+                obj.tileMatrixSetLinks.push(tileMatrixSetLink);
+            },
+            "TileMatrixSet": function(node, obj) {
+                // node could be child of wmts:Contents or wmts:TileMatrixSetLink
+                // duck type wmts:Contents by looking for layers
+                if (obj.layers) {
+                    // TileMatrixSet as object type in schema
+                    var tileMatrixSet = {
+                        matrixIds: []
+                    };
+                    this.readChildNodes(node, tileMatrixSet);
+                    obj.tileMatrixSets[tileMatrixSet.identifier] = tileMatrixSet;
+                } else {
+                    // TileMatrixSet as string type in schema
+                    obj.tileMatrixSet = this.getChildValue(node);
+                }
+            },
+            "TileMatrix": function(node, obj) {
+                var tileMatrix = {
+                    supportedCRS: obj.supportedCRS
+                };
+                this.readChildNodes(node, tileMatrix);
+                obj.matrixIds.push(tileMatrix);
+            },
+            "ScaleDenominator": function(node, obj) {
+                obj.scaleDenominator = parseFloat(this.getChildValue(node)); 
+            },
+            "TopLeftCorner": function(node, obj) {                
+                var topLeftCorner = this.getChildValue(node);
+                var coords = topLeftCorner.split(" ");
+                // decide on axis order for the given CRS
+                var yx;
+                if (obj.supportedCRS) {
+                    // extract out version from URN
+                    var crs = obj.supportedCRS.replace(
+                        /urn:ogc:def:crs:(\w+):.+:(\w+)$/, 
+                        "urn:ogc:def:crs:$1::$2"
+                    );
+                    yx = !!this.yx[crs];
+                }
+                if (yx) {
+                    obj.topLeftCorner = new OpenLayers.LonLat(
+                        coords[1], coords[0]
+                    );
+                } else {
+                    obj.topLeftCorner = new OpenLayers.LonLat(
+                        coords[0], coords[1]
+                    );
+                }
+            },
+            "TileWidth": function(node, obj) {
+                obj.tileWidth = parseInt(this.getChildValue(node)); 
+            },
+            "TileHeight": function(node, obj) {
+                obj.tileHeight = parseInt(this.getChildValue(node)); 
+            },
+            "MatrixWidth": function(node, obj) {
+                obj.matrixWidth = parseInt(this.getChildValue(node)); 
+            },
+            "MatrixHeight": function(node, obj) {
+                obj.matrixHeight = parseInt(this.getChildValue(node)); 
+            },        
+            // not used for now, can be added in the future though
+            /*"Themes": function(node, obj) {
+                obj.themes = [];
+                this.readChildNodes(node, obj.themes);
+            },
+            "Theme": function(node, obj) {
+                var theme = {};                
+                this.readChildNodes(node, theme);
+                obj.push(theme);
+            },*/
+            "WSDL": function(node, obj) {
+                obj.wsdl = {};
+                obj.wsdl.href = node.getAttribute("xlink:href");
+                // TODO: other attributes of <WSDL> element                
+            },
+            "ServiceMetadataURL": function(node, obj) {
+                obj.serviceMetadataUrl = {};
+                obj.serviceMetadataUrl.href = node.getAttribute("xlink:href");
+                // TODO: other attributes of <ServiceMetadataURL> element                
+            }            
+        },
+        "ows": OpenLayers.Format.OWSCommon.v1_1_0.prototype.readers["ows"]
+    },    
+    
+    CLASS_NAME: "OpenLayers.Format.WMTSCapabilities.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_0_0.js	(revision 76)
@@ -0,0 +1,157 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WFSCapabilities/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFSCapabilities/v1_0_0
+ * Read WMS Capabilities version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WFSCapabilities>
+ */
+OpenLayers.Format.WFSCapabilities.v1_0_0 = OpenLayers.Class(
+    OpenLayers.Format.WFSCapabilities.v1, {
+    
+    /**
+     * Constructor: OpenLayers.Format.WFSCapabilities.v1_0_0
+     * Create a new parser for WFS capabilities version 1.0.0.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WFSCapabilities.v1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+    
+    /**
+     * Method: read_cap_Service
+     */
+    read_cap_Service: function(capabilities, node) {
+        var service = {};
+        this.runChildNodes(service, node);
+        capabilities.service = service;
+    },
+
+    /**
+     * Method: read_cap_Fees
+     */
+    read_cap_Fees: function(service, node) {
+        var fees = this.getChildValue(node);
+        if (fees && fees.toLowerCase() != "none") {
+            service.fees = fees;
+        }
+    },
+
+    /**
+     * Method: read_cap_AccessConstraints
+     */
+    read_cap_AccessConstraints: function(service, node) {
+        var constraints = this.getChildValue(node);
+        if (constraints && constraints.toLowerCase() != "none") {
+            service.accessConstraints = constraints;
+        }
+    },
+    
+    /**
+     * Method: read_cap_OnlineResource
+     */
+    read_cap_OnlineResource: function(service, node) {
+        var onlineResource = this.getChildValue(node);
+        if (onlineResource && onlineResource.toLowerCase() != "none") {
+            service.onlineResource = onlineResource;
+        }
+    },
+    
+    /**
+     * Method: read_cap_Keywords
+     */
+    read_cap_Keywords: function(service, node) {
+        var keywords = this.getChildValue(node);
+        if (keywords && keywords.toLowerCase() != "none") {
+            service.keywords = keywords.split(', ');
+        }
+    },
+    
+    /**
+     * Method: read_cap_Capability
+     */
+    read_cap_Capability: function(capabilities, node) {
+        var capability = {};
+        this.runChildNodes(capability, node);
+        capabilities.capability = capability;
+    },
+    
+    /**
+     * Method: read_cap_Request
+     */
+    read_cap_Request: function(obj, node) {
+        var request = {};
+        this.runChildNodes(request, node);
+        obj.request = request;
+    },
+    
+    /**
+     * Method: read_cap_GetFeature
+     */
+    read_cap_GetFeature: function(request, node) {
+        var getfeature = {
+            href: {}, // DCPType
+            formats: [] // ResultFormat
+        };
+        this.runChildNodes(getfeature, node);
+        request.getfeature = getfeature;
+    },
+    
+    /**
+     * Method: read_cap_ResultFormat
+     */
+    read_cap_ResultFormat: function(obj, node) {
+        var children = node.childNodes;
+        var childNode;
+        for(var i=0; i<children.length; i++) {
+            childNode = children[i];
+            if(childNode.nodeType == 1) {
+                obj.formats.push(childNode.nodeName);
+            }
+        }
+    },
+    
+    /**
+     * Method: read_cap_DCPType
+     */
+    read_cap_DCPType: function(obj, node) {
+        this.runChildNodes(obj, node);
+    },
+    
+    /**
+     * Method: read_cap_HTTP
+     */
+    read_cap_HTTP: function(obj, node) {
+        this.runChildNodes(obj.href, node);
+    },
+    
+    /**
+     * Method: read_cap_Get
+     */
+    read_cap_Get: function(obj, node) {
+        obj.get = node.getAttribute("onlineResource");
+    },
+    
+    /**
+     * Method: read_cap_Post
+     */
+    read_cap_Post: function(obj, node) {
+        obj.post = node.getAttribute("onlineResource");
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WFSCapabilities.v1_0_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1_1_0.js	(revision 76)
@@ -0,0 +1,36 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WFSCapabilities/v1.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFSCapabilities/v1_1_0
+ * Read WFS Capabilities version 1.1.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.WFSCapabilities>
+ */
+OpenLayers.Format.WFSCapabilities.v1_1_0 = OpenLayers.Class(
+    OpenLayers.Format.WFSCapabilities.v1, {
+    
+    /**
+     * Constructor: OpenLayers.Format.WFSCapabilities.v1_1_0
+     * Create a new parser for WFS capabilities version 1.1.0.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.WFSCapabilities.v1.prototype.initialize.apply(
+            this, [options]
+        );
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WFSCapabilities.v1_1_0" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFSCapabilities/v1.js	(revision 76)
@@ -0,0 +1,126 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/WFSCapabilities.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFSCapabilities.v1
+ * Abstract class not to be instantiated directly.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.WFSCapabilities.v1 = OpenLayers.Class(
+    OpenLayers.Format.WFSCapabilities, {
+    
+    /**
+     * Constructor: OpenLayers.Format.WFSCapabilities.v1_1
+     * Create an instance of one of the subclasses.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        this.options = options;
+    },
+
+    /**
+     * APIMethod: read
+     * Read capabilities data from a string, and return a list of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Array} List of named layers.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        var capabilities = {};
+        var root = data.documentElement;
+        this.runChildNodes(capabilities, root);
+        return capabilities;
+    },
+    
+    /**
+     * Method: runChildNodes
+     */
+    runChildNodes: function(obj, node) {
+        var children = node.childNodes;
+        var childNode, processor;
+        for(var i=0; i<children.length; ++i) {
+            childNode = children[i];
+            if(childNode.nodeType == 1) {
+                processor = this["read_cap_" + childNode.nodeName];
+                if(processor) {
+                    processor.apply(this, [obj, childNode]);
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: read_cap_FeatureTypeList
+     */
+    read_cap_FeatureTypeList: function(request, node) {
+        var featureTypeList = {
+            featureTypes: []
+        };
+        this.runChildNodes(featureTypeList, node);
+        request.featureTypeList = featureTypeList;
+    },
+    
+    /**
+     * Method: read_cap_FeatureType
+     */
+    read_cap_FeatureType: function(featureTypeList, node, parentLayer) {
+        var featureType = {};
+        this.runChildNodes(featureType, node);
+        featureTypeList.featureTypes.push(featureType);
+    },
+    
+    /**
+     * Method: read_cap_Name
+     */
+    read_cap_Name: function(obj, node) {
+        var name = this.getChildValue(node);
+        if(name) {
+            var parts = name.split(":");
+            obj.name = parts.pop();
+            if(parts.length > 0) {
+                obj.featureNS = this.lookupNamespaceURI(node, parts[0]);
+            }
+        }
+    },
+
+    /**
+     * Method: read_cap_Title
+     */
+    read_cap_Title: function(obj, node) {
+        var title = this.getChildValue(node);
+        if(title) {
+            obj.title = title;
+        }
+    },
+
+    /**
+     * Method: read_cap_Abstract
+     */
+    read_cap_Abstract: function(obj, node) {
+        var abst = this.getChildValue(node);
+        if(abst) {
+            obj["abstract"] = abst;
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.WFSCapabilities.v1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OSM.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OSM.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OSM.js	(revision 76)
@@ -0,0 +1,457 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ * @requires OpenLayers/Projection.js
+ */
+
+/**  
+ * Class: OpenLayers.Format.OSM
+ * OSM parser. Create a new instance with the 
+ *     <OpenLayers.Format.OSM> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.OSM = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * APIProperty: checkTags
+     * {Boolean} Should tags be checked to determine whether something
+     * should be treated as a seperate node. Will slow down parsing.
+     * Default is false.
+     */
+    checkTags: false,
+
+    /**
+     * Property: interestingTagsExclude
+     * {Array} List of tags to exclude from 'interesting' checks on nodes.
+     * Must be set when creating the format. Will only be used if checkTags
+     * is set.
+     */
+    interestingTagsExclude: null, 
+    
+    /**
+     * APIProperty: areaTags
+     * {Array} List of tags indicating that something is an area.  
+     * Must be set when creating the format. Will only be used if 
+     * checkTags is true.
+     */
+    areaTags: null, 
+    
+    /**
+     * Constructor: OpenLayers.Format.OSM
+     * Create a new parser for OSM.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        var layer_defaults = {
+          'interestingTagsExclude': ['source', 'source_ref', 
+              'source:ref', 'history', 'attribution', 'created_by'],
+          'areaTags': ['area', 'building', 'leisure', 'tourism', 'ruins',
+              'historic', 'landuse', 'military', 'natural', 'sport'] 
+        };
+          
+        layer_defaults = OpenLayers.Util.extend(layer_defaults, options);
+        
+        var interesting = {};
+        for (var i = 0; i < layer_defaults.interestingTagsExclude.length; i++) {
+            interesting[layer_defaults.interestingTagsExclude[i]] = true;
+        }
+        layer_defaults.interestingTagsExclude = interesting;
+        
+        var area = {};
+        for (var i = 0; i < layer_defaults.areaTags.length; i++) {
+            area[layer_defaults.areaTags[i]] = true;
+        }
+        layer_defaults.areaTags = area;
+
+        // OSM coordinates are always in longlat WGS84
+        this.externalProjection = new OpenLayers.Projection("EPSG:4326");
+        
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [layer_defaults]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Return a list of features from a OSM doc
+     
+     * Parameters:
+     * data - {Element} 
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s
+     */
+    read: function(doc) {
+        if (typeof doc == "string") { 
+            doc = OpenLayers.Format.XML.prototype.read.apply(this, [doc]);
+        }
+
+        var nodes = this.getNodes(doc);
+        var ways = this.getWays(doc);
+        
+        // Geoms will contain at least ways.length entries.
+        var feat_list = new Array(ways.length);
+        
+        for (var i = 0; i < ways.length; i++) {
+            // We know the minimal of this one ahead of time. (Could be -1
+            // due to areas/polygons)
+            var point_list = new Array(ways[i].nodes.length);
+            
+            var poly = this.isWayArea(ways[i]) ? 1 : 0; 
+            for (var j = 0; j < ways[i].nodes.length; j++) {
+               var node = nodes[ways[i].nodes[j]];
+               
+               var point = new OpenLayers.Geometry.Point(node.lon, node.lat);
+               
+               // Since OSM is topological, we stash the node ID internally. 
+               point.osm_id = parseInt(ways[i].nodes[j]);
+               point_list[j] = point;
+               
+               // We don't display nodes if they're used inside other 
+               // elements.
+               node.used = true; 
+            }
+            var geometry = null;
+            if (poly) { 
+                geometry = new OpenLayers.Geometry.Polygon(
+                    new OpenLayers.Geometry.LinearRing(point_list));
+            } else {    
+                geometry = new OpenLayers.Geometry.LineString(point_list);
+            }
+            if (this.internalProjection && this.externalProjection) {
+                geometry.transform(this.externalProjection, 
+                    this.internalProjection);
+            }        
+            var feat = new OpenLayers.Feature.Vector(geometry,
+                ways[i].tags);
+            feat.osm_id = parseInt(ways[i].id);
+            feat.fid = "way." + feat.osm_id;
+            feat_list[i] = feat;
+        } 
+        for (var node_id in nodes) {
+            var node = nodes[node_id];
+            if (!node.used || this.checkTags) {
+                var tags = null;
+                
+                if (this.checkTags) {
+                    var result = this.getTags(node.node, true);
+                    if (node.used && !result[1]) {
+                        continue;
+                    }
+                    tags = result[0];
+                } else { 
+                    tags = this.getTags(node.node);
+                }    
+                
+                var feat = new OpenLayers.Feature.Vector(
+                    new OpenLayers.Geometry.Point(node['lon'], node['lat']),
+                    tags);
+                if (this.internalProjection && this.externalProjection) {
+                    feat.geometry.transform(this.externalProjection, 
+                        this.internalProjection);
+                }        
+                feat.osm_id = parseInt(node_id); 
+                feat.fid = "node." + feat.osm_id;
+                feat_list.push(feat);
+            }   
+            // Memory cleanup
+            node.node = null;
+        }        
+        return feat_list;
+    },
+
+    /**
+     * Method: getNodes
+     * Return the node items from a doc.  
+     *
+     * Parameters:
+     * node - {DOMElement} node to parse tags from
+     */
+    getNodes: function(doc) {
+        var node_list = doc.getElementsByTagName("node");
+        var nodes = {};
+        for (var i = 0; i < node_list.length; i++) {
+            var node = node_list[i];
+            var id = node.getAttribute("id");
+            nodes[id] = {
+                'lat': node.getAttribute("lat"),
+                'lon': node.getAttribute("lon"),
+                'node': node
+            };
+        }
+        return nodes;
+    },
+
+    /**
+     * Method: getWays
+     * Return the way items from a doc.  
+     *
+     * Parameters:
+     * node - {DOMElement} node to parse tags from
+     */
+    getWays: function(doc) {
+        var way_list = doc.getElementsByTagName("way");
+        var return_ways = [];
+        for (var i = 0; i < way_list.length; i++) {
+            var way = way_list[i];
+            var way_object = {
+              id: way.getAttribute("id")
+            };
+            
+            way_object.tags = this.getTags(way);
+            
+            var node_list = way.getElementsByTagName("nd");
+            
+            way_object.nodes = new Array(node_list.length);
+            
+            for (var j = 0; j < node_list.length; j++) {
+                way_object.nodes[j] = node_list[j].getAttribute("ref");
+            }  
+            return_ways.push(way_object);
+        }
+        return return_ways; 
+        
+    },  
+    
+    /**
+     * Method: getTags
+     * Return the tags list attached to a specific DOM element.
+     *
+     * Parameters:
+     * node - {DOMElement} node to parse tags from
+     * interesting_tags - {Boolean} whether the return from this function should
+     *    return a boolean indicating that it has 'interesting tags' -- 
+     *    tags like attribution and source are ignored. (To change the list
+     *    of tags, see interestingTagsExclude)
+     * 
+     * Returns:
+     * tags - {Object} hash of tags
+     * interesting - {Boolean} if interesting_tags is passed, returns
+     *     whether there are any interesting tags on this element.
+     */
+    getTags: function(dom_node, interesting_tags) {
+        var tag_list = dom_node.getElementsByTagName("tag");
+        var tags = {};
+        var interesting = false;
+        for (var j = 0; j < tag_list.length; j++) {
+            var key = tag_list[j].getAttribute("k");
+            tags[key] = tag_list[j].getAttribute("v");
+            if (interesting_tags) {
+                if (!this.interestingTagsExclude[key]) {
+                    interesting = true;
+                }
+            }    
+        }  
+        return interesting_tags ? [tags, interesting] : tags;     
+    },
+
+    /** 
+     * Method: isWayArea
+     * Given a way object from getWays, check whether the tags and geometry
+     * indicate something is an area.
+     *
+     * Returns:
+     * {Boolean}
+     */
+    isWayArea: function(way) { 
+        var poly_shaped = false;
+        var poly_tags = false;
+        
+        if (way.nodes[0] == way.nodes[way.nodes.length - 1]) {
+            poly_shaped = true;
+        }
+        if (this.checkTags) {
+            for(var key in way.tags) {
+                if (this.areaTags[key]) {
+                    poly_tags = true;
+                    break;
+                }
+            }
+        }    
+        return poly_shaped && (this.checkTags ? poly_tags : true);            
+    }, 
+
+    /**
+     * APIMethod: write 
+     * Takes a list of features, returns a serialized OSM format file for use
+     * in tools like JOSM.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)}
+     */
+    write: function(features) { 
+        if (!(features instanceof Array)) {
+            features = [features];
+        }
+        
+        this.osm_id = 1;
+        this.created_nodes = {};
+        var root_node = this.createElementNS(null, "osm");
+        root_node.setAttribute("version", "0.5");
+        root_node.setAttribute("generator", "OpenLayers "+ OpenLayers.VERSION_NUMBER);
+
+        // Loop backwards, because the deserializer puts nodes last, and 
+        // we want them first if possible
+        for(var i = features.length - 1; i >= 0; i--) {
+            var nodes = this.createFeatureNodes(features[i]);
+            for (var j = 0; j < nodes.length; j++) {
+                root_node.appendChild(nodes[j]);
+            }    
+        }
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root_node]);
+    },
+
+    /**
+     * Method: createFeatureNodes
+     * Takes a feature, returns a list of nodes from size 0->n.
+     * Will include all pieces of the serialization that are required which
+     * have not already been created. Calls out to createXML based on geometry
+     * type.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     */
+    createFeatureNodes: function(feature) {
+        var nodes = [];
+        var className = feature.geometry.CLASS_NAME;
+        var type = className.substring(className.lastIndexOf(".") + 1);
+        type = type.toLowerCase();
+        var builder = this.createXML[type];
+        if (builder) {
+            nodes = builder.apply(this, [feature]);
+        }
+        return nodes;
+    },
+    
+    /**
+     * Method: createXML
+     * Takes a feature, returns a list of nodes from size 0->n.
+     * Will include all pieces of the serialization that are required which
+     * have not already been created.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     */
+    createXML: {
+        'point': function(point) {
+            var id = null;
+            var geometry = point.geometry ? point.geometry : point;
+            var already_exists = false; // We don't return anything if the node
+                                        // has already been created
+            if (point.osm_id) {
+                id = point.osm_id;
+                if (this.created_nodes[id]) {
+                    already_exists = true;
+                }    
+            } else {
+               id = -this.osm_id;
+               this.osm_id++; 
+            }
+            if (already_exists) {
+                node = this.created_nodes[id];
+            } else {    
+                var node = this.createElementNS(null, "node");
+            }
+            this.created_nodes[id] = node;
+            node.setAttribute("id", id);
+            node.setAttribute("lon", geometry.x); 
+            node.setAttribute("lat", geometry.y);
+            if (point.attributes) {
+                this.serializeTags(point, node);
+            }
+            this.setState(point, node);
+            return already_exists ? [] : [node];
+        }, 
+        linestring: function(feature) {
+            var nodes = [];
+            var geometry = feature.geometry;
+            if (feature.osm_id) {
+                id = feature.osm_id;
+            } else {
+               id = -this.osm_id;
+               this.osm_id++; 
+            }
+            var way = this.createElementNS(null, "way");
+            way.setAttribute("id", id);
+            for (var i = 0; i < geometry.components.length; i++) {
+                var node = this.createXML['point'].apply(this, [geometry.components[i]]);
+                if (node.length) {
+                    node = node[0];
+                    var node_ref = node.getAttribute("id");
+                    nodes.push(node);
+                } else {
+                    node_ref = geometry.components[i].osm_id;
+                    node = this.created_nodes[node_ref];
+                }
+                this.setState(feature, node);
+                var nd_dom = this.createElementNS(null, "nd");
+                nd_dom.setAttribute("ref", node_ref);
+                way.appendChild(nd_dom);
+            }
+            this.serializeTags(feature, way);
+            nodes.push(way);
+            
+            return nodes;
+        },
+        polygon: function(feature) {
+            var attrs = OpenLayers.Util.extend({'area':'yes'}, feature.attributes);
+            var feat = new OpenLayers.Feature.Vector(feature.geometry.components[0], attrs); 
+            feat.osm_id = feature.osm_id;
+            return this.createXML['linestring'].apply(this, [feat]);
+        }
+    },
+
+    /**
+     * Method: serializeTags
+     * Given a feature, serialize the attributes onto the given node.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * node - {DOMNode}
+     */
+    serializeTags: function(feature, node) {
+        for (var key in feature.attributes) {
+            var tag = this.createElementNS(null, "tag");
+            tag.setAttribute("k", key);
+            tag.setAttribute("v", feature.attributes[key]);
+            node.appendChild(tag);
+        }
+    },
+
+    /**
+     * Method: setState 
+     * OpenStreetMap has a convention that 'state' is stored for modification or deletion.
+     * This allows the file to be uploaded via JOSM or the bulk uploader tool.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * node - {DOMNode}
+     */
+    setState: function(feature, node) {
+        if (feature.state) {
+            var state = null;
+            switch(feature.state) {
+                case OpenLayers.State.UPDATE:
+                    state = "modify";
+                case OpenLayers.State.DELETE:
+                    state = "delete";
+            }
+            if (state) {
+                node.setAttribute("action", state);
+            }
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Format.OSM" 
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/WFS.js	(revision 76)
@@ -0,0 +1,220 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/GML.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Format.WFS
+ * Read/Write WFS. 
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.GML>
+ */
+OpenLayers.Format.WFS = OpenLayers.Class(OpenLayers.Format.GML, {
+    
+    /** 
+     * Property: layer
+     */
+    layer: null,
+    
+    /**
+     * APIProperty: wfsns
+     */
+    wfsns: "http://www.opengis.net/wfs",
+    
+    /**
+     * Property: ogcns
+     */
+    ogcns: "http://www.opengis.net/ogc",
+    
+    /*
+     * Constructor: OpenLayers.Format.WFS
+     * Create a WFS-T formatter. This requires a layer: that layer should
+     * have two properties: geometry_column and typename. The parser
+     * for this format is subclassed entirely from GML: There is a writer 
+     * only, which uses most of the code from the GML layer, and wraps
+     * it in transactional elements.
+     * 
+     * Parameters: 
+     * options - {Object} 
+     * layer - {<OpenLayers.Layer>} 
+     */
+    
+    initialize: function(options, layer) {
+        OpenLayers.Format.GML.prototype.initialize.apply(this, [options]);
+        this.layer = layer;
+        if (this.layer.featureNS) {
+            this.featureNS = this.layer.featureNS;
+        }    
+        if (this.layer.options.geometry_column) {
+            this.geometryName = this.layer.options.geometry_column;
+        }
+        if (this.layer.options.typename) {
+            this.featureName = this.layer.options.typename;
+        }
+    },
+    
+    /**
+     * Method: write 
+     * Takes a feature list, and generates a WFS-T Transaction 
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    write: function(features) {
+    
+        var transaction = this.createElementNS(this.wfsns, 'wfs:Transaction');
+        transaction.setAttribute("version","1.0.0");
+        transaction.setAttribute("service","WFS");
+        for (var i=0; i < features.length; i++) {
+            switch (features[i].state) {
+                case OpenLayers.State.INSERT:
+                    transaction.appendChild(this.insert(features[i]));
+                    break;
+                case OpenLayers.State.UPDATE:
+                    transaction.appendChild(this.update(features[i]));
+                    break;
+                case OpenLayers.State.DELETE:
+                    transaction.appendChild(this.remove(features[i]));
+                    break;
+            }
+        }
+        
+        return OpenLayers.Format.XML.prototype.write.apply(this,[transaction]);
+    },
+   
+    /**
+     * Method: createFeatureXML
+     *
+     * Parameters: 
+     * feature - {<OpenLayers.Feature.Vector>}
+     */ 
+    createFeatureXML: function(feature) {
+        var geometryNode = this.buildGeometryNode(feature.geometry);
+        var geomContainer = this.createElementNS(this.featureNS, "feature:" + this.geometryName);
+        geomContainer.appendChild(geometryNode);
+        var featureContainer = this.createElementNS(this.featureNS, "feature:" + this.featureName);
+        featureContainer.appendChild(geomContainer);
+        for(var attr in feature.attributes) {
+            var attrText = this.createTextNode(feature.attributes[attr]); 
+            var nodename = attr;
+            if (attr.search(":") != -1) {
+                nodename = attr.split(":")[1];
+            }    
+            var attrContainer = this.createElementNS(this.featureNS, "feature:" + nodename);
+            attrContainer.appendChild(attrText);
+            featureContainer.appendChild(attrContainer);
+        }    
+        return featureContainer;
+    },
+    
+    /**
+     * Method: insert 
+     * Takes a feature, and generates a WFS-T Transaction "Insert" 
+     *
+     * Parameters: 
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    insert: function(feature) {
+        var insertNode = this.createElementNS(this.wfsns, 'wfs:Insert');
+        insertNode.appendChild(this.createFeatureXML(feature));
+        return insertNode;
+    },
+    
+    /**
+     * Method: update
+     * Takes a feature, and generates a WFS-T Transaction "Update" 
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    update: function(feature) {
+        if (!feature.fid) { OpenLayers.Console.userError(OpenLayers.i18n("noFID")); }
+        var updateNode = this.createElementNS(this.wfsns, 'wfs:Update');
+        updateNode.setAttribute("typeName", this.featurePrefix + ':' + this.featureName); 
+        updateNode.setAttribute("xmlns:" + this.featurePrefix, this.featureNS); 
+
+        var propertyNode = this.createElementNS(this.wfsns, 'wfs:Property');
+        var nameNode = this.createElementNS(this.wfsns, 'wfs:Name');
+        
+        var txtNode = this.createTextNode(this.geometryName);
+        nameNode.appendChild(txtNode);
+        propertyNode.appendChild(nameNode);
+        
+        var valueNode = this.createElementNS(this.wfsns, 'wfs:Value');
+        
+        var geometryNode = this.buildGeometryNode(feature.geometry);
+        
+        if(feature.layer){
+            geometryNode.setAttribute(
+                "srsName", feature.layer.projection.getCode()
+            );
+        }
+        
+        valueNode.appendChild(geometryNode);
+        
+        propertyNode.appendChild(valueNode);
+        updateNode.appendChild(propertyNode);
+        
+         // add in attributes
+        for(var propName in feature.attributes) {
+            propertyNode = this.createElementNS(this.wfsns, 'wfs:Property');
+            nameNode = this.createElementNS(this.wfsns, 'wfs:Name');
+            nameNode.appendChild(this.createTextNode(propName));
+            propertyNode.appendChild(nameNode);
+            valueNode = this.createElementNS(this.wfsns, 'wfs:Value');
+            valueNode.appendChild(this.createTextNode(feature.attributes[propName]));
+            propertyNode.appendChild(valueNode);
+            updateNode.appendChild(propertyNode);
+        }
+        
+        
+        var filterNode = this.createElementNS(this.ogcns, 'ogc:Filter');
+        var filterIdNode = this.createElementNS(this.ogcns, 'ogc:FeatureId');
+        filterIdNode.setAttribute("fid", feature.fid);
+        filterNode.appendChild(filterIdNode);
+        updateNode.appendChild(filterNode);
+
+        return updateNode;
+    },
+    
+    /**
+     * Method: remove 
+     * Takes a feature, and generates a WFS-T Transaction "Delete" 
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    remove: function(feature) {
+        if (!feature.fid) { 
+            OpenLayers.Console.userError(OpenLayers.i18n("noFID")); 
+            return false; 
+        }
+        var deleteNode = this.createElementNS(this.wfsns, 'wfs:Delete');
+        deleteNode.setAttribute("typeName", this.featurePrefix + ':' + this.featureName); 
+        deleteNode.setAttribute("xmlns:" + this.featurePrefix, this.featureNS); 
+
+        var filterNode = this.createElementNS(this.ogcns, 'ogc:Filter');
+        var filterIdNode = this.createElementNS(this.ogcns, 'ogc:FeatureId');
+        filterIdNode.setAttribute("fid", feature.fid);
+        filterNode.appendChild(filterIdNode);
+        deleteNode.appendChild(filterNode);
+
+        return deleteNode;
+    },
+
+    /**
+     * APIMethod: destroy
+     * Remove ciruclar ref to layer 
+     */
+    destroy: function() {
+        this.layer = null;
+    },
+
+    CLASS_NAME: "OpenLayers.Format.WFS" 
+});    
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Atom.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Atom.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/Atom.js	(revision 76)
@@ -0,0 +1,727 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/GML/v3.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Format.Atom
+ * Read/write Atom feeds. Create a new instance with the
+ *     <OpenLayers.Format.AtomFeed> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.Atom = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.  Properties
+     *     of this object should not be set individually.  Read-only.  All
+     *     XML subclasses should have their own namespaces object.  Use
+     *     <setNamespace> to add or set a namespace alias after construction.
+     */
+    namespaces: {
+        atom: "http://www.w3.org/2005/Atom",
+        georss: "http://www.georss.org/georss"
+    },
+    
+    /**
+     * APIProperty: feedTitle
+     * {String} Atom feed elements require a title.  Default is "untitled".
+     */
+    feedTitle: "untitled",
+
+    /**
+     * APIProperty: defaultEntryTitle
+     * {String} Atom entry elements require a title.  In cases where one is
+     *     not provided in the feature attributes, this will be used.  Default
+     *     is "untitled".
+     */
+    defaultEntryTitle: "untitled",
+
+    /**
+     * Property: gmlParse
+     * {Object} GML Format object for parsing features
+     * Non-API and only created if necessary
+     */
+    gmlParser: null,
+    
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate: true:(x,y) or false:(y,x)
+     * For GeoRSS the default is (y,x), therefore: false
+     */
+    xy: false,
+    
+    /**
+     * Constructor: OpenLayers.Format.AtomEntry
+     * Create a new parser for Atom.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: read
+     * Return a list of features from an Atom feed or entry document.
+     
+     * Parameters:
+     * doc - {Element} or {String}
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s
+     */
+    read: function(doc) {
+        if (typeof doc == "string") {
+            doc = OpenLayers.Format.XML.prototype.read.apply(this, [doc]);
+        }
+        return this.parseFeatures(doc);
+    },
+    
+    /**
+     * APIMethod: write
+     * Serialize or more feature nodes to Atom documents.
+     *
+     * Parameters:
+     * features - a single {<OpenLayers.Feature.Vector>} or an
+     * Array({<OpenLayers.Feature.Vector>}).
+     *
+     * Returns:
+     * {String} an Atom entry document if passed one feature node, or a feed
+     * document if passed an array of feature nodes.
+     */
+    write: function(features) {
+        var doc;
+        if (features instanceof Array) {
+            doc = this.createElementNSPlus("atom:feed");
+            doc.appendChild(
+                this.createElementNSPlus("atom:title", {
+                    value: this.feedTitle
+                })
+            );
+            for (var i=0, ii=features.length; i<ii; i++) {
+                doc.appendChild(this.buildEntryNode(features[i]));
+            }
+        }
+        else {
+            doc = this.buildEntryNode(features);
+        }
+        return OpenLayers.Format.XML.prototype.write.apply(this, [doc]);
+    },
+    
+    /**
+     * Method: buildContentNode
+     *
+     * Parameters:
+     * content - {Object}
+     *
+     * Returns:
+     * {DOMElement} an Atom content node.
+     *
+     * TODO: types other than text.
+     */
+    buildContentNode: function(content) {
+        var node = this.createElementNSPlus("atom:content", {
+            attributes: {
+                type: content.type || null
+            }
+        });
+        if (content.src) {
+            node.setAttribute("src", content.src);
+        } else {
+            if (content.type == "text" || content.type == null) {
+                node.appendChild(
+                    this.createTextNode(content.value)
+                );
+            } else if (content.type == "html") {
+                if (typeof content.value != "string") {
+                    throw "HTML content must be in form of an escaped string";
+                }
+                node.appendChild(
+                    this.createTextNode(content.value)
+                );
+            } else if (content.type == "xhtml") {
+                node.appendChild(content.value);
+            } else if (content.type == "xhtml" ||
+                           content.type.match(/(\+|\/)xml$/)) {
+                node.appendChild(content.value);
+            }
+            else { // MUST be a valid Base64 encoding
+                node.appendChild(
+                    this.createTextNode(content.value)
+                );
+            }
+        }
+        return node;
+    },
+    
+    /**
+     * Method: buildEntryNode
+     * Build an Atom entry node from a feature object.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     *
+     * Returns:
+     * {DOMElement} an Atom entry node.
+     *
+     * These entries are geared for publication using AtomPub.
+     *
+     * TODO: support extension elements
+     */
+    buildEntryNode: function(feature) {
+        var attrib = feature.attributes;
+        var atomAttrib = attrib.atom || {};
+        var entryNode = this.createElementNSPlus("atom:entry");
+        
+        // atom:author
+        if (atomAttrib.authors) {
+            var authors = atomAttrib.authors instanceof Array ?
+                atomAttrib.authors : [atomAttrib.authors];
+            for (var i=0, ii=authors.length; i<ii; i++) {
+                entryNode.appendChild(
+                    this.buildPersonConstructNode(
+                        "author", authors[i]
+                    )
+                );
+            }
+        }
+        
+        // atom:category
+        if (atomAttrib.categories) {
+            var categories = atomAttrib.categories instanceof Array ?
+                atomAttrib.categories : [atomAttrib.categories];
+            var category;
+            for (var i=0, ii=categories.length; i<ii; i++) {
+                category = categories[i];
+                entryNode.appendChild(
+                    this.createElementNSPlus("atom:category", {
+                        attributes: {
+                            term: category.term,
+                            scheme: category.scheme || null,
+                            label: category.label || null
+                        }
+                    })
+                );
+            }
+        }
+        
+        // atom:content
+        if (atomAttrib.content) {
+            entryNode.appendChild(this.buildContentNode(atomAttrib.content));
+        }
+        
+        // atom:contributor
+        if (atomAttrib.contributors) {
+            var contributors = atomAttrib.contributors instanceof Array ?
+                atomAttrib.contributors : [atomAttrib.contributors];
+            for (var i=0, ii=contributors.length; i<ii; i++) {
+                entryNode.appendChild(
+                    this.buildPersonConstructNode(
+                        "contributor",
+                        contributors[i]
+                        )
+                    );
+            }
+        }
+        
+        // atom:id
+        if (feature.fid) {
+            entryNode.appendChild(
+                this.createElementNSPlus("atom:id", {
+                    value: feature.fid
+                })
+            );
+        }
+        
+        // atom:link
+        if (atomAttrib.links) {
+            var links = atomAttrib.links instanceof Array ?
+                atomAttrib.links : [atomAttrib.links];
+            var link;
+            for (var i=0, ii=links.length; i<ii; i++) {
+                link = links[i];
+                entryNode.appendChild(
+                    this.createElementNSPlus("atom:link", {
+                        attributes: {
+                            href: link.href,
+                            rel: link.rel || null,
+                            type: link.type || null,
+                            hreflang: link.hreflang || null,
+                            title: link.title || null,
+                            length: link.length || null
+                        }
+                    })
+                );
+            }
+        }
+        
+        // atom:published
+        if (atomAttrib.published) {
+            entryNode.appendChild(
+                this.createElementNSPlus("atom:published", {
+                    value: atomAttrib.published
+                })
+            );
+        }
+        
+        // atom:rights
+        if (atomAttrib.rights) {
+            entryNode.appendChild(
+                this.createElementNSPlus("atom:rights", {
+                    value: atomAttrib.rights
+                })
+            );
+        }
+        
+        // atom:source not implemented
+        
+        // atom:summary
+        if (atomAttrib.summary || attrib.description) {
+            entryNode.appendChild(
+                this.createElementNSPlus("atom:summary", {
+                    value: atomAttrib.summary || attrib.description
+                })
+            );
+        }
+        
+        // atom:title
+        entryNode.appendChild(
+            this.createElementNSPlus("atom:title", {
+                value: atomAttrib.title || attrib.title || this.defaultEntryTitle
+            })
+        );
+        
+        // atom:updated
+        if (atomAttrib.updated) {
+            entryNode.appendChild(
+                this.createElementNSPlus("atom:updated", {
+                    value: atomAttrib.updated
+                })
+            );
+        }
+        
+        // georss:where
+        if (feature.geometry) {
+            var whereNode = this.createElementNSPlus("georss:where");
+            whereNode.appendChild(
+                this.buildGeometryNode(feature.geometry)
+            );
+            entryNode.appendChild(whereNode);
+        }
+        
+        return entryNode;
+    },
+    
+    /**
+     * Method: initGmlParser
+     * Creates a GML parser.
+     */
+    initGmlParser: function() {
+        this.gmlParser = new OpenLayers.Format.GML.v3({
+            xy: this.xy,
+            featureNS: "http://example.com#feature",
+            internalProjection: this.internalProjection,
+            externalProjection: this.externalProjection
+        });
+    },
+    
+    /**
+     * Method: buildGeometryNode
+     * builds a GeoRSS node with a given geometry
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     *
+     * Returns:
+     * {DOMElement} A gml node.
+     */
+    buildGeometryNode: function(geometry) {
+        if (!this.gmlParser) {
+            this.initGmlParser();
+        }
+        var node = this.gmlParser.writeNode("feature:_geometry", geometry);
+        return node.firstChild;
+    },
+    
+    /**
+     * Method: buildPersonConstructNode
+     *
+     * Parameters:
+     * name - {String}
+     * value - {Object}
+     *
+     * Returns:
+     * {DOMElement} an Atom person construct node.
+     *
+     * Example:
+     * >>> buildPersonConstructNode("author", {name: "John Smith"})
+     * {<author><name>John Smith</name></author>}
+     *
+     * TODO: how to specify extension elements? Add to the oNames array?
+     */
+    buildPersonConstructNode: function(name, value) {
+        var oNames = ["uri", "email"];
+        var personNode = this.createElementNSPlus("atom:" + name);
+        personNode.appendChild(
+            this.createElementNSPlus("atom:name", {
+                value: value.name
+            })
+        );
+        for (var i=0, ii=oNames.length; i<ii; i++) {
+            if (value[oNames[i]]) {
+                personNode.appendChild(
+                    this.createElementNSPlus("atom:" + oNames[i], {
+                        value: value[oNames[i]]
+                    })
+                );
+            }
+        }
+        return personNode;
+    },
+    
+    /**
+     * Method: getFirstChildValue
+     *
+     * Parameters:
+     * node - {DOMElement}
+     * nsuri - {String} Child node namespace uri ("*" for any).
+     * name - {String} Child node name.
+     * def - {String} Optional string default to return if no child found.
+     *
+     * Returns:
+     * {String} The value of the first child with the given tag name.  Returns
+     *     default value or empty string if none found.
+     */
+    getFirstChildValue: function(node, nsuri, name, def) {
+        var value;
+        var nodes = this.getElementsByTagNameNS(node, nsuri, name);
+        if (nodes && nodes.length > 0) {
+            value = this.getChildValue(nodes[0], def);
+        } else {
+            value = def;
+        }
+        return value;
+    },
+    
+    /**
+     * Method: parseFeature
+     * Parse feature from an Atom entry node..
+     *
+     * Parameters:
+     * node - {DOMElement} An Atom entry or feed node.
+     *
+     * Returns:
+     * An <OpenLayers.Feature.Vector>.
+     */
+    parseFeature: function(node) {
+        var atomAttrib = {};
+        var value = null;
+        var nodes = null;
+        var attval = null;
+        var atomns = this.namespaces.atom;
+        
+        // atomAuthor*
+        this.parsePersonConstructs(node, "author", atomAttrib);
+        
+        // atomCategory*
+        nodes = this.getElementsByTagNameNS(node, atomns, "category");
+        if (nodes.length > 0) {
+            atomAttrib.categories = [];
+        }
+        for (var i=0, ii=nodes.length; i<ii; i++) {
+            value = {};
+            value.term = nodes[i].getAttribute("term");
+            attval = nodes[i].getAttribute("scheme");
+            if (attval) { value.scheme = attval; }
+            attval = nodes[i].getAttribute("label");
+            if (attval) { value.label = attval; }
+            atomAttrib.categories.push(value);
+        }
+        
+        // atomContent?
+        nodes = this.getElementsByTagNameNS(node, atomns, "content");
+        if (nodes.length > 0) {
+            value = {};
+            attval = nodes[0].getAttribute("type");
+            if (attval) {
+                value.type = attval;
+            }
+            attval = nodes[0].getAttribute("src");
+            if (attval) {
+                value.src = attval;
+            } else {
+                if (value.type == "text" || 
+                    value.type == "html" || 
+                    value.type == null ) {
+                    value.value = this.getFirstChildValue(
+                                        node,
+                                        atomns,
+                                        "content",
+                                        null
+                                        );
+                } else if (value.type == "xhtml" ||
+                           value.type.match(/(\+|\/)xml$/)) {
+                    value.value = this.getChildEl(nodes[0]);
+                } else { // MUST be base64 encoded
+                    value.value = this.getFirstChildValue(
+                                        node,
+                                        atomns,
+                                        "content",
+                                        null
+                                        );
+                }
+                atomAttrib.content = value;
+            }
+        }
+        
+        // atomContributor*
+        this.parsePersonConstructs(node, "contributor", atomAttrib);
+        
+        // atomId
+        atomAttrib.id = this.getFirstChildValue(node, atomns, "id", null);
+        
+        // atomLink*
+        nodes = this.getElementsByTagNameNS(node, atomns, "link");
+        if (nodes.length > 0) {
+            atomAttrib.links = new Array(nodes.length);
+        }
+        var oAtts = ["rel", "type", "hreflang", "title", "length"];
+        for (var i=0, ii=nodes.length; i<ii; i++) {
+            value = {};
+            value.href = nodes[i].getAttribute("href");
+            for (var j=0, jj=oAtts.length; j<jj; j++) {
+                attval = nodes[i].getAttribute(oAtts[j]);
+                if (attval) {
+                    value[oAtts[j]] = attval;
+                }
+            }
+            atomAttrib.links[i] = value;
+        }
+        
+        // atomPublished?
+        value = this.getFirstChildValue(node, atomns, "published", null);
+        if (value) {
+            atomAttrib.published = value;
+        }
+        
+        // atomRights?
+        value = this.getFirstChildValue(node, atomns, "rights", null);
+        if (value) {
+            atomAttrib.rights = value;
+        }
+        
+        // atomSource? -- not implemented
+        
+        // atomSummary?
+        value = this.getFirstChildValue(node, atomns, "summary", null);
+        if (value) {
+            atomAttrib.summary = value;
+        }
+        
+        // atomTitle
+        atomAttrib.title = this.getFirstChildValue(
+                                node, atomns, "title", null
+                                );
+        
+        // atomUpdated
+        atomAttrib.updated = this.getFirstChildValue(
+                                node, atomns, "updated", null
+                                );
+        
+        var featureAttrib = {
+            title: atomAttrib.title,
+            description: atomAttrib.summary,
+            atom: atomAttrib
+        };
+        var geometry = this.parseLocations(node)[0];
+        var feature = new OpenLayers.Feature.Vector(geometry, featureAttrib);
+        feature.fid = atomAttrib.id;
+        return feature;
+    },
+    
+    /**
+     * Method: parseFeatures
+     * Return features from an Atom entry or feed.
+     *
+     * Parameters:
+     * node - {DOMElement} An Atom entry or feed node.
+     *
+     * Returns:
+     * An Array of <OpenLayers.Feature.Vector>s.
+     */
+    parseFeatures: function(node) {
+        var features = [];
+        var entries = this.getElementsByTagNameNS(
+            node, this.namespaces.atom, "entry"
+        );
+        if (entries.length == 0) {
+            entries = [node];
+        }
+        for (var i=0, ii=entries.length; i<ii; i++) {
+            features.push(this.parseFeature(entries[i]));
+        }
+        return features;
+    },
+    
+    /**
+     * Method: parseLocations
+     * Parse the locations from an Atom entry or feed.
+     *
+     * Parameters:
+     * node - {DOMElement} An Atom entry or feed node.
+     *
+     * Returns:
+     * An Array of <OpenLayers.Geometry>s.
+     */
+    parseLocations: function(node) {
+        var georssns = this.namespaces.georss;
+
+        var locations = {components: []};
+        var where = this.getElementsByTagNameNS(node, georssns, "where");
+        if (where && where.length > 0) {
+            if (!this.gmlParser) {
+                this.initGmlParser();
+            }
+            for (var i=0, ii=where.length; i<ii; i++) {
+                this.gmlParser.readChildNodes(where[i], locations);
+            }
+        }
+        
+        var components = locations.components;
+        var point = this.getElementsByTagNameNS(node, georssns, "point");
+        if (point && point.length > 0) {
+            for (var i=0, ii=point.length; i<ii; i++) {
+                var xy = OpenLayers.String.trim(
+                            point[i].firstChild.nodeValue
+                            ).split(/\s+/);
+                if (xy.length !=2) {
+                    xy = OpenLayers.String.trim(
+                                point[i].firstChild.nodeValue
+                                ).split(/\s*,\s*/);
+                }
+                components.push(
+                    new OpenLayers.Geometry.Point(
+                        parseFloat(xy[1]),
+                        parseFloat(xy[0])
+                    )
+                );
+            }
+        }
+
+        var line = this.getElementsByTagNameNS(node, georssns, "line");
+        if (line && line.length > 0) {
+            var coords;
+            var p;
+            var points;
+            for (var i=0, ii=line.length; i<ii; i++) {
+                coords = OpenLayers.String.trim(
+                                line[i].firstChild.nodeValue
+                                ).split(/\s+/);
+                points = [];
+                for (var j=0, jj=coords.length; j<jj; j+=2) {
+                    p = new OpenLayers.Geometry.Point(
+                        parseFloat(coords[j+1]),
+                        parseFloat(coords[j])
+                    );
+                    points.push(p);
+                }
+                components.push(
+                    new OpenLayers.Geometry.LineString(points)
+                );
+            }
+        }        
+
+        var polygon = this.getElementsByTagNameNS(node, georssns, "polygon");
+        if (polygon && polygon.length > 0) {
+            var coords;
+            var p;
+            var points;
+            for (var i=0, ii=polygon.length; i<ii; i++) {
+                coords = OpenLayers.String.trim(
+                            polygon[i].firstChild.nodeValue
+                            ).split(/\s+/);
+                points = [];
+                for (var j=0, jj=coords.length; j<jj; j+=2) {
+                    p = new OpenLayers.Geometry.Point(
+                        parseFloat(coords[j+1]),
+                        parseFloat(coords[j])
+                    );
+                    points.push(p);
+                }
+                components.push(
+                    new OpenLayers.Geometry.Polygon(
+                        [new OpenLayers.Geometry.LinearRing(components)]
+                    )
+                );
+            }
+        }
+        
+        if (this.internalProjection && this.externalProjection) {
+            for (var i=0, ii=components.length; i<ii; i++) {
+                if (components[i]) {
+                    components[i].transform(
+                        this.externalProjection,
+                        this.internalProjection
+                    );
+                }
+            }
+        }
+        
+        return components;
+    },
+    
+    /**
+     * Method: parsePersonConstruct
+     * Parse Atom person constructs from an Atom entry node.
+     *
+     * Parameters:
+     * node - {DOMElement} An Atom entry or feed node.
+     * name - {String} Construcy name ("author" or "contributor")
+     * data = {Object} Object in which to put parsed persons.
+     *
+     * Returns:
+     * An {Object}.
+     */
+    parsePersonConstructs: function(node, name, data) {
+        var persons = [];
+        var atomns = this.namespaces.atom;
+        var nodes = this.getElementsByTagNameNS(node, atomns, name);
+        var oAtts = ["uri", "email"];
+        for (var i=0, ii=nodes.length; i<ii; i++) {
+            var value = {};
+            value.name = this.getFirstChildValue(
+                            nodes[i],
+                            atomns,
+                            "name",
+                            null
+                            );
+            for (var j=0, jj=oAtts.length; j<jj; j++) {
+                var attval = this.getFirstChildValue(
+                            nodes[i],
+                            atomns,
+                            oAtts[j],
+                            null);
+                if (attval) {
+                    value[oAtts[j]] = attval;
+                }
+            }
+            persons.push(value);
+        }
+        if (persons.length > 0) {
+            data[name + "s"] = persons;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Format.Atom"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/XML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/XML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/XML.js	(revision 76)
@@ -0,0 +1,881 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format.js
+ */
+
+/**
+ * Class: OpenLayers.Format.XML
+ * Read and write XML.  For cross-browser XML generation, use methods on an
+ *     instance of the XML format class instead of on <code>document<end>.
+ *     The DOM creation and traversing methods exposed here all mimic the
+ *     W3C XML DOM methods.  Create a new parser with the
+ *     <OpenLayers.Format.XML> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format>
+ */
+OpenLayers.Format.XML = OpenLayers.Class(OpenLayers.Format, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.  Properties
+     *     of this object should not be set individually.  Read-only.  All
+     *     XML subclasses should have their own namespaces object.  Use
+     *     <setNamespace> to add or set a namespace alias after construction.
+     */
+    namespaces: null,
+    
+    /**
+     * Property: namespaceAlias
+     * {Object} Mapping of namespace URI to namespace alias.  This object
+     *     is read-only.  Use <setNamespace> to add or set a namespace alias.
+     */
+    namespaceAlias: null,
+    
+    /**
+     * Property: defaultPrefix
+     * {String} The default namespace alias for creating element nodes.
+     */
+    defaultPrefix: null,
+    
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {},
+    
+    /**
+     * Property: writers
+     * As a compliment to the <readers> property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {},
+
+    /**
+     * Property: xmldom
+     * {XMLDom} If this browser uses ActiveX, this will be set to a XMLDOM
+     *     object.  It is not intended to be a browser sniffing property.
+     *     Instead, the xmldom property is used instead of <code>document<end>
+     *     where namespaced node creation methods are not supported. In all
+     *     other browsers, this remains null.
+     */
+    xmldom: null,
+
+    /**
+     * Constructor: OpenLayers.Format.XML
+     * Construct an XML parser.  The parser is used to read and write XML.
+     *     Reading XML from a string returns a DOM element.  Writing XML from
+     *     a DOM element returns a string.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on
+     *     the object.
+     */
+    initialize: function(options) {
+        if(window.ActiveXObject) {
+            this.xmldom = new ActiveXObject("Microsoft.XMLDOM");
+        }
+        OpenLayers.Format.prototype.initialize.apply(this, [options]);
+        // clone the namespace object and set all namespace aliases
+        this.namespaces = OpenLayers.Util.extend({}, this.namespaces);
+        this.namespaceAlias = {};
+        for(var alias in this.namespaces) {
+            this.namespaceAlias[this.namespaces[alias]] = alias;
+        }
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Clean up.
+     */
+    destroy: function() {
+        this.xmldom = null;
+        OpenLayers.Format.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: setNamespace
+     * Set a namespace alias and URI for the format.
+     *
+     * Parameters:
+     * alias - {String} The namespace alias (prefix).
+     * uri - {String} The namespace URI.
+     */
+    setNamespace: function(alias, uri) {
+        this.namespaces[alias] = uri;
+        this.namespaceAlias[uri] = alias;
+    },
+
+    /**
+     * APIMethod: read
+     * Deserialize a XML string and return a DOM node.
+     *
+     * Parameters:
+     * text - {String} A XML string
+     
+     * Returns:
+     * {DOMElement} A DOM node
+     */
+    read: function(text) {
+        var index = text.indexOf('<');
+        if(index > 0) {
+            text = text.substring(index);
+        }
+        var node = OpenLayers.Util.Try(
+            OpenLayers.Function.bind((
+                function() {
+                    var xmldom;
+                    /**
+                     * Since we want to be able to call this method on the prototype
+                     * itself, this.xmldom may not exist even if in IE.
+                     */
+                    if(window.ActiveXObject && !this.xmldom) {
+                        xmldom = new ActiveXObject("Microsoft.XMLDOM");
+                    } else {
+                        xmldom = this.xmldom;
+                        
+                    }
+                    xmldom.loadXML(text);
+                    return xmldom;
+                }
+            ), this),
+            function() {
+                return new DOMParser().parseFromString(text, 'text/xml');
+            },
+            function() {
+                var req = new XMLHttpRequest();
+                req.open("GET", "data:" + "text/xml" +
+                         ";charset=utf-8," + encodeURIComponent(text), false);
+                if(req.overrideMimeType) {
+                    req.overrideMimeType("text/xml");
+                }
+                req.send(null);
+                return req.responseXML;
+            }
+        );
+
+        if(this.keepData) {
+            this.data = node;
+        }
+
+        return node;
+    },
+
+    /**
+     * APIMethod: write
+     * Serialize a DOM node into a XML string.
+     * 
+     * Parameters:
+     * node - {DOMElement} A DOM node.
+     *
+     * Returns:
+     * {String} The XML string representation of the input node.
+     */
+    write: function(node) {
+        var data;
+        if(this.xmldom) {
+            data = node.xml;
+        } else {
+            var serializer = new XMLSerializer();
+            if (node.nodeType == 1) {
+                // Add nodes to a document before serializing. Everything else
+                // is serialized as is. This may need more work. See #1218 .
+                var doc = document.implementation.createDocument("", "", null);
+                if (doc.importNode) {
+                    node = doc.importNode(node, true);
+                }
+                doc.appendChild(node);
+                data = serializer.serializeToString(doc);
+            } else {
+                data = serializer.serializeToString(node);
+            }
+        }
+        return data;
+    },
+
+    /**
+     * APIMethod: createElementNS
+     * Create a new element with namespace.  This node can be appended to
+     *     another node with the standard node.appendChild method.  For
+     *     cross-browser support, this method must be used instead of
+     *     document.createElementNS.
+     *
+     * Parameters:
+     * uri - {String} Namespace URI for the element.
+     * name - {String} The qualified name of the element (prefix:localname).
+     * 
+     * Returns:
+     * {Element} A DOM element with namespace.
+     */
+    createElementNS: function(uri, name) {
+        var element;
+        if(this.xmldom) {
+            if(typeof uri == "string") {
+                element = this.xmldom.createNode(1, name, uri);
+            } else {
+                element = this.xmldom.createNode(1, name, "");
+            }
+        } else {
+            element = document.createElementNS(uri, name);
+        }
+        return element;
+    },
+
+    /**
+     * APIMethod: createTextNode
+     * Create a text node.  This node can be appended to another node with
+     *     the standard node.appendChild method.  For cross-browser support,
+     *     this method must be used instead of document.createTextNode.
+     * 
+     * Parameters:
+     * text - {String} The text of the node.
+     * 
+     * Returns: 
+     * {DOMElement} A DOM text node.
+     */
+    createTextNode: function(text) {
+        var node;
+        if (typeof text !== "string") {
+            text = String(text);
+        }
+        if(this.xmldom) {
+            node = this.xmldom.createTextNode(text);
+        } else {
+            node = document.createTextNode(text);
+        }
+        return node;
+    },
+
+    /**
+     * APIMethod: getElementsByTagNameNS
+     * Get a list of elements on a node given the namespace URI and local name.
+     *     To return all nodes in a given namespace, use '*' for the name
+     *     argument.  To return all nodes of a given (local) name, regardless
+     *     of namespace, use '*' for the uri argument.
+     * 
+     * Parameters:
+     * node - {Element} Node on which to search for other nodes.
+     * uri - {String} Namespace URI.
+     * name - {String} Local name of the tag (without the prefix).
+     * 
+     * Returns:
+     * {NodeList} A node list or array of elements.
+     */
+    getElementsByTagNameNS: function(node, uri, name) {
+        var elements = [];
+        if(node.getElementsByTagNameNS) {
+            elements = node.getElementsByTagNameNS(uri, name);
+        } else {
+            // brute force method
+            var allNodes = node.getElementsByTagName("*");
+            var potentialNode, fullName;
+            for(var i=0, len=allNodes.length; i<len; ++i) {
+                potentialNode = allNodes[i];
+                fullName = (potentialNode.prefix) ?
+                           (potentialNode.prefix + ":" + name) : name;
+                if((name == "*") || (fullName == potentialNode.nodeName)) {
+                    if((uri == "*") || (uri == potentialNode.namespaceURI)) {
+                        elements.push(potentialNode);
+                    }
+                }
+            }
+        }
+        return elements;
+    },
+
+    /**
+     * APIMethod: getAttributeNodeNS
+     * Get an attribute node given the namespace URI and local name.
+     * 
+     * Parameters:
+     * node - {Element} Node on which to search for attribute nodes.
+     * uri - {String} Namespace URI.
+     * name - {String} Local name of the attribute (without the prefix).
+     * 
+     * Returns:
+     * {DOMElement} An attribute node or null if none found.
+     */
+    getAttributeNodeNS: function(node, uri, name) {
+        var attributeNode = null;
+        if(node.getAttributeNodeNS) {
+            attributeNode = node.getAttributeNodeNS(uri, name);
+        } else {
+            var attributes = node.attributes;
+            var potentialNode, fullName;
+            for(var i=0, len=attributes.length; i<len; ++i) {
+                potentialNode = attributes[i];
+                if(potentialNode.namespaceURI == uri) {
+                    fullName = (potentialNode.prefix) ?
+                               (potentialNode.prefix + ":" + name) : name;
+                    if(fullName == potentialNode.nodeName) {
+                        attributeNode = potentialNode;
+                        break;
+                    }
+                }
+            }
+        }
+        return attributeNode;
+    },
+
+    /**
+     * APIMethod: getAttributeNS
+     * Get an attribute value given the namespace URI and local name.
+     * 
+     * Parameters:
+     * node - {Element} Node on which to search for an attribute.
+     * uri - {String} Namespace URI.
+     * name - {String} Local name of the attribute (without the prefix).
+     * 
+     * Returns:
+     * {String} An attribute value or and empty string if none found.
+     */
+    getAttributeNS: function(node, uri, name) {
+        var attributeValue = "";
+        if(node.getAttributeNS) {
+            attributeValue = node.getAttributeNS(uri, name) || "";
+        } else {
+            var attributeNode = this.getAttributeNodeNS(node, uri, name);
+            if(attributeNode) {
+                attributeValue = attributeNode.nodeValue;
+            }
+        }
+        return attributeValue;
+    },
+    
+    /**
+     * APIMethod: getChildValue
+     * Get the textual value of the node if it exists, or return an
+     *     optional default string.  Returns an empty string if no first child
+     *     exists and no default value is supplied.
+     *
+     * Parameters:
+     * node - {DOMElement} The element used to look for a first child value.
+     * def - {String} Optional string to return in the event that no
+     *     first child value exists.
+     *
+     * Returns:
+     * {String} The value of the first child of the given node.
+     */
+    getChildValue: function(node, def) {
+        var value = def || "";
+        if(node) {
+            for(var child=node.firstChild; child; child=child.nextSibling) {
+                switch(child.nodeType) {
+                    case 3: // text node
+                    case 4: // cdata section
+                        value += child.nodeValue;
+                }
+            }
+        }
+        return value;
+    },
+
+    /**
+     * APIMethod: concatChildValues
+     * *Deprecated*. Use <getChildValue> instead.
+     *
+     * Concatenate the value of all child nodes if any exist, or return an
+     *     optional default string.  Returns an empty string if no children
+     *     exist and no default value is supplied.  Not optimized for large
+     *     numbers of child nodes.
+     *
+     * Parameters:
+     * node - {DOMElement} The element used to look for child values.
+     * def - {String} Optional string to return in the event that no
+     *     child exist.
+     *
+     * Returns:
+     * {String} The concatenated value of all child nodes of the given node.
+     */
+    concatChildValues: function(node, def) {
+        var value = "";
+        var child = node.firstChild;
+        var childValue;
+        while(child) {
+            childValue = child.nodeValue;
+            if(childValue) {
+                value += childValue;
+            }
+            child = child.nextSibling;
+        }
+        if(value == "" && def != undefined) {
+            value = def;
+        }
+        return value;
+    },
+    
+    /**
+     * APIMethod: isSimpleContent
+     * Test if the given node has only simple content (i.e. no child element
+     *     nodes).
+     *
+     * Parameters:
+     * node - {DOMElement} An element node.
+     *
+     * Returns:
+     * {Boolean} The node has no child element nodes (nodes of type 1). 
+     */
+    isSimpleContent: function(node) {
+        var simple = true;
+        for(var child=node.firstChild; child; child=child.nextSibling) {
+            if(child.nodeType === 1) {
+                simple = false;
+                break;
+            }
+        }
+        return simple;
+    },
+    
+    /**
+     * APIMethod: contentType
+     * Determine the content type for a given node.
+     *
+     * Parameters:
+     * node - {DOMElement}
+     *
+     * Returns:
+     * {Integer} One of OpenLayers.Format.XML.CONTENT_TYPE.{EMPTY,SIMPLE,COMPLEX,MIXED}
+     *     if the node has no, simple, complex, or mixed content.
+     */
+    contentType: function(node) {
+        var simple = false,
+            complex = false;
+            
+        var type = OpenLayers.Format.XML.CONTENT_TYPE.EMPTY;
+
+        for(var child=node.firstChild; child; child=child.nextSibling) {
+            switch(child.nodeType) {
+                case 1: // element
+                    complex = true;
+                    break;
+                case 8: // comment
+                    break;
+                default:
+                    simple = true;
+            }
+            if(complex && simple) {
+                break;
+            }
+        }
+        
+        if(complex && simple) {
+            type = OpenLayers.Format.XML.CONTENT_TYPE.MIXED;
+        } else if(complex) {
+            return OpenLayers.Format.XML.CONTENT_TYPE.COMPLEX;
+        } else if(simple) {
+            return OpenLayers.Format.XML.CONTENT_TYPE.SIMPLE;
+        }
+        return type;
+    },
+
+    /**
+     * APIMethod: hasAttributeNS
+     * Determine whether a node has a particular attribute matching the given
+     *     name and namespace.
+     * 
+     * Parameters:
+     * node - {Element} Node on which to search for an attribute.
+     * uri - {String} Namespace URI.
+     * name - {String} Local name of the attribute (without the prefix).
+     * 
+     * Returns:
+     * {Boolean} The node has an attribute matching the name and namespace.
+     */
+    hasAttributeNS: function(node, uri, name) {
+        var found = false;
+        if(node.hasAttributeNS) {
+            found = node.hasAttributeNS(uri, name);
+        } else {
+            found = !!this.getAttributeNodeNS(node, uri, name);
+        }
+        return found;
+    },
+    
+    /**
+     * APIMethod: setAttributeNS
+     * Adds a new attribute or changes the value of an attribute with the given
+     *     namespace and name.
+     *
+     * Parameters:
+     * node - {Element} Element node on which to set the attribute.
+     * uri - {String} Namespace URI for the attribute.
+     * name - {String} Qualified name (prefix:localname) for the attribute.
+     * value - {String} Attribute value.
+     */
+    setAttributeNS: function(node, uri, name, value) {
+        if(node.setAttributeNS) {
+            node.setAttributeNS(uri, name, value);
+        } else {
+            if(this.xmldom) {
+                if(uri) {
+                    var attribute = node.ownerDocument.createNode(
+                        2, name, uri
+                    );
+                    attribute.nodeValue = value;
+                    node.setAttributeNode(attribute);
+                } else {
+                    node.setAttribute(name, value);
+                }
+            } else {
+                throw "setAttributeNS not implemented";
+            }
+        }
+    },
+
+    /**
+     * Method: createElementNSPlus
+     * Shorthand for creating namespaced elements with optional attributes and
+     *     child text nodes.
+     *
+     * Parameters:
+     * name - {String} The qualified node name.
+     * options - {Object} Optional object for node configuration.
+     *
+     * Valid options:
+     * uri - {String} Optional namespace uri for the element - supply a prefix
+     *     instead if the namespace uri is a property of the format's namespace
+     *     object.
+     * attributes - {Object} Optional attributes to be set using the
+     *     <setAttributes> method.
+     * value - {String} Optional text to be appended as a text node.
+     *
+     * Returns:
+     * {Element} An element node.
+     */
+    createElementNSPlus: function(name, options) {
+        options = options || {};
+        // order of prefix preference
+        // 1. in the uri option
+        // 2. in the prefix option
+        // 3. in the qualified name
+        // 4. from the defaultPrefix
+        var uri = options.uri || this.namespaces[options.prefix];
+        if(!uri) {
+            var loc = name.indexOf(":");
+            uri = this.namespaces[name.substring(0, loc)];
+        }
+        if(!uri) {
+            uri = this.namespaces[this.defaultPrefix];
+        }
+        var node = this.createElementNS(uri, name);
+        if(options.attributes) {
+            this.setAttributes(node, options.attributes);
+        }
+        var value = options.value;
+        if(value != null) {
+            node.appendChild(this.createTextNode(value));
+        }
+        return node;
+    },
+    
+    /**
+     * Method: setAttributes
+     * Set multiple attributes given key value pairs from an object.
+     *
+     * Parameters:
+     * node - {Element} An element node.
+     * obj - {Object || Array} An object whose properties represent attribute
+     *     names and values represent attribute values.  If an attribute name
+     *     is a qualified name ("prefix:local"), the prefix will be looked up
+     *     in the parsers {namespaces} object.  If the prefix is found,
+     *     setAttributeNS will be used instead of setAttribute.
+     */
+    setAttributes: function(node, obj) {
+        var value, uri;
+        for(var name in obj) {
+            if(obj[name] != null && obj[name].toString) {
+                value = obj[name].toString();
+                // check for qualified attribute name ("prefix:local")
+                uri = this.namespaces[name.substring(0, name.indexOf(":"))] || null;
+                this.setAttributeNS(node, uri, name, value);
+            }
+        }
+    },
+
+    /**
+     * Method: readNode
+     * Shorthand for applying one of the named readers given the node
+     *     namespace and local name.  Readers take two args (node, obj) and
+     *     generally extend or modify the second.
+     *
+     * Parameters:
+     * node - {DOMElement} The node to be read (required).
+     * obj - {Object} The object to be modified (optional).
+     *
+     * Returns:
+     * {Object} The input object, modified (or a new one if none was provided).
+     */
+    readNode: function(node, obj) {
+        if(!obj) {
+            obj = {};
+        }
+        var group = this.readers[node.namespaceURI ? this.namespaceAlias[node.namespaceURI]: this.defaultPrefix];
+        if(group) {
+            var local = node.localName || node.nodeName.split(":").pop();
+            var reader = group[local] || group["*"];
+            if(reader) {
+                reader.apply(this, [node, obj]);
+            }
+        }
+        return obj;
+    },
+
+    /**
+     * Method: readChildNodes
+     * Shorthand for applying the named readers to all children of a node.
+     *     For each child of type 1 (element), <readSelf> is called.
+     *
+     * Parameters:
+     * node - {DOMElement} The node to be read (required).
+     * obj - {Object} The object to be modified (optional).
+     *
+     * Returns:
+     * {Object} The input object, modified.
+     */
+    readChildNodes: function(node, obj) {
+        if(!obj) {
+            obj = {};
+        }
+        var children = node.childNodes;
+        var child;
+        for(var i=0, len=children.length; i<len; ++i) {
+            child = children[i];
+            if(child.nodeType == 1) {
+                this.readNode(child, obj);
+            }
+        }
+        return obj;
+    },
+
+    /**
+     * Method: writeNode
+     * Shorthand for applying one of the named writers and appending the
+     *     results to a node.  If a qualified name is not provided for the
+     *     second argument (and a local name is used instead), the namespace
+     *     of the parent node will be assumed.
+     *
+     * Parameters:
+     * name - {String} The name of a node to generate.  If a qualified name
+     *     (e.g. "pre:Name") is used, the namespace prefix is assumed to be
+     *     in the <writers> group.  If a local name is used (e.g. "Name") then
+     *     the namespace of the parent is assumed.  If a local name is used
+     *     and no parent is supplied, then the default namespace is assumed.
+     * obj - {Object} Structure containing data for the writer.
+     * parent - {DOMElement} Result will be appended to this node.  If no parent
+     *     is supplied, the node will not be appended to anything.
+     *
+     * Returns:
+     * {DOMElement} The child node.
+     */
+    writeNode: function(name, obj, parent) {
+        var prefix, local;
+        var split = name.indexOf(":");
+        if(split > 0) {
+            prefix = name.substring(0, split);
+            local = name.substring(split + 1);
+        } else {
+            if(parent) {
+                prefix = this.namespaceAlias[parent.namespaceURI];
+            } else {
+                prefix = this.defaultPrefix;
+            }
+            local = name;
+        }
+        var child = this.writers[prefix][local].apply(this, [obj]);
+        if(parent) {
+            parent.appendChild(child);
+        }
+        return child;
+    },
+
+    /**
+     * APIMethod: getChildEl
+     * Get the first child element.  Optionally only return the first child
+     *     if it matches the given name and namespace URI.
+     *
+     * Parameters:
+     * node - {DOMElement} The parent node.
+     * name - {String} Optional node name (local) to search for.
+     * uri - {String} Optional namespace URI to search for.
+     *
+     * Returns:
+     * {DOMElement} The first child.  Returns null if no element is found, if
+     *     something significant besides an element is found, or if the element
+     *     found does not match the optional name and uri.
+     */
+    getChildEl: function(node, name, uri) {
+        return node && this.getThisOrNextEl(node.firstChild, name, uri);
+    },
+    
+    /**
+     * APIMethod: getNextEl
+     * Get the next sibling element.  Optionally get the first sibling only
+     *     if it matches the given local name and namespace URI.
+     *
+     * Parameters:
+     * node - {DOMElement} The node.
+     * name - {String} Optional local name of the sibling to search for.
+     * uri - {String} Optional namespace URI of the sibling to search for.
+     *
+     * Returns:
+     * {DOMElement} The next sibling element.  Returns null if no element is
+     *     found, something significant besides an element is found, or the
+     *     found element does not match the optional name and uri.
+     */
+    getNextEl: function(node, name, uri) {
+        return node && this.getThisOrNextEl(node.nextSibling, name, uri);
+    },
+    
+    /**
+     * Method: getThisOrNextEl
+     * Return this node or the next element node.  Optionally get the first
+     *     sibling with the given local name or namespace URI.
+     *
+     * Parameters:
+     * node - {DOMElement} The node.
+     * name - {String} Optional local name of the sibling to search for.
+     * uri - {String} Optional namespace URI of the sibling to search for.
+     *
+     * Returns:
+     * {DOMElement} The next sibling element.  Returns null if no element is
+     *     found, something significant besides an element is found, or the
+     *     found element does not match the query.
+     */
+    getThisOrNextEl: function(node, name, uri) {
+        outer: for(var sibling=node; sibling; sibling=sibling.nextSibling) {
+            switch(sibling.nodeType) {
+                case 1: // Element
+                    if((!name || name === (sibling.localName || sibling.nodeName.split(":").pop())) &&
+                       (!uri || uri === sibling.namespaceURI)) {
+                        // matches
+                        break outer;
+                    }
+                    sibling = null;
+                    break outer;
+                case 3: // Text
+                    if(/^\s*$/.test(sibling.nodeValue)) {
+                        break;
+                    }
+                case 4: // CDATA
+                case 6: // ENTITY_NODE
+                case 12: // NOTATION_NODE
+                case 10: // DOCUMENT_TYPE_NODE
+                case 11: // DOCUMENT_FRAGMENT_NODE
+                    sibling = null;
+                    break outer;
+            } // ignore comments and processing instructions
+        }
+        return sibling || null;
+    },
+    
+    /**
+     * APIMethod: lookupNamespaceURI
+     * Takes a prefix and returns the namespace URI associated with it on the given
+     *     node if found (and null if not). Supplying null for the prefix will
+     *     return the default namespace.
+     *
+     * For browsers that support it, this calls the native lookupNamesapceURI
+     *     function.  In other browsers, this is an implementation of
+     *     http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespaceURI.
+     *
+     * For browsers that don't support the attribute.ownerElement property, this
+     *     method cannot be called on attribute nodes.
+     *     
+     * Parameters:
+     * node - {DOMElement} The node from which to start looking.
+     * prefix - {String} The prefix to lookup or null to lookup the default namespace.
+     * 
+     * Returns:
+     * {String} The namespace URI for the given prefix.  Returns null if the prefix
+     *     cannot be found or the node is the wrong type.
+     */
+    lookupNamespaceURI: function(node, prefix) {
+        var uri = null;
+        if(node) {
+            if(node.lookupNamespaceURI) {
+                uri = node.lookupNamespaceURI(prefix);
+            } else {
+                outer: switch(node.nodeType) {
+                    case 1: // ELEMENT_NODE
+                        if(node.namespaceURI !== null && node.prefix === prefix) {
+                            uri = node.namespaceURI;
+                            break outer;
+                        }
+                        var len = node.attributes.length;
+                        if(len) {
+                            var attr;
+                            for(var i=0; i<len; ++i) {
+                                attr = node.attributes[i];
+                                if(attr.prefix === "xmlns" && attr.name === "xmlns:" + prefix) {
+                                    uri = attr.value || null;
+                                    break outer;
+                                } else if(attr.name === "xmlns" && prefix === null) {
+                                    uri = attr.value || null;
+                                    break outer;
+                                }
+                            }
+                        }
+                        uri = this.lookupNamespaceURI(node.parentNode, prefix);
+                        break outer;
+                    case 2: // ATTRIBUTE_NODE
+                        uri = this.lookupNamespaceURI(node.ownerElement, prefix);
+                        break outer;
+                    case 9: // DOCUMENT_NODE
+                        uri = this.lookupNamespaceURI(node.documentElement, prefix);
+                        break outer;
+                    case 6: // ENTITY_NODE
+                    case 12: // NOTATION_NODE
+                    case 10: // DOCUMENT_TYPE_NODE
+                    case 11: // DOCUMENT_FRAGMENT_NODE
+                        break outer;
+                    default: 
+                        // TEXT_NODE (3), CDATA_SECTION_NODE (4), ENTITY_REFERENCE_NODE (5),
+                        // PROCESSING_INSTRUCTION_NODE (7), COMMENT_NODE (8)
+                        uri =  this.lookupNamespaceURI(node.parentNode, prefix);
+                        break outer;
+                }
+            }
+        }
+        return uri;
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.XML" 
+
+});     
+
+OpenLayers.Format.XML.CONTENT_TYPE = {EMPTY: 0, SIMPLE: 1, COMPLEX: 2, MIXED: 3};
+
+/**
+ * APIFunction: OpenLayers.Format.XML.lookupNamespaceURI
+ * Takes a prefix and returns the namespace URI associated with it on the given
+ *     node if found (and null if not). Supplying null for the prefix will
+ *     return the default namespace.
+ *
+ * For browsers that support it, this calls the native lookupNamesapceURI
+ *     function.  In other browsers, this is an implementation of
+ *     http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespaceURI.
+ *
+ * For browsers that don't support the attribute.ownerElement property, this
+ *     method cannot be called on attribute nodes.
+ *     
+ * Parameters:
+ * node - {DOMElement} The node from which to start looking.
+ * prefix - {String} The prefix to lookup or null to lookup the default namespace.
+ * 
+ * Returns:
+ * {String} The namespace URI for the given prefix.  Returns null if the prefix
+ *     cannot be found or the node is the wrong type.
+ */
+OpenLayers.Format.XML.lookupNamespaceURI = OpenLayers.Function.bind(
+    OpenLayers.Format.XML.prototype.lookupNamespaceURI,
+    OpenLayers.Format.XML.prototype
+);
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext/v0_3_1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext/v0_3_1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format/OWSContext/v0_3_1.js	(revision 76)
@@ -0,0 +1,589 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Format/XML.js
+ * @requires OpenLayers/Format/KML.js
+ * @requires OpenLayers/Format/GML.js
+ * @requires OpenLayers/Format/GML/v2.js
+ * @requires OpenLayers/Format/SLD/v1_0_0.js
+ * @requires OpenLayers/Format/OWSContext.js
+ * @requires OpenLayers/Format/OWSCommon/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Format.OWSContext.v0_3_1
+ * Read and write OWSContext version 0.3.1.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Format.XML>
+ */
+OpenLayers.Format.OWSContext.v0_3_1 = OpenLayers.Class(OpenLayers.Format.XML, {
+    
+    /**
+     * Property: namespaces
+     * {Object} Mapping of namespace aliases to namespace URIs.
+     */
+    namespaces: {
+        owc: "http://www.opengis.net/ows-context",
+        gml: "http://www.opengis.net/gml",
+        kml: "http://www.opengis.net/kml/2.2",
+        ogc: "http://www.opengis.net/ogc",
+        ows: "http://www.opengis.net/ows",
+        sld: "http://www.opengis.net/sld",
+        xlink: "http://www.w3.org/1999/xlink",
+        xsi: "http://www.w3.org/2001/XMLSchema-instance"
+    },
+
+    /**
+     * Constant: VERSION
+     * {String} 0.3.1
+     */
+    VERSION: "0.3.1", 
+
+    /**
+     * Property: schemaLocation
+     * {String} Schema location
+     */
+    schemaLocation: "http://www.opengis.net/ows-context http://www.ogcnetwork.net/schemas/owc/0.3.1/owsContext.xsd",
+
+    /**
+     * Property: defaultPrefix
+     * {String} Default namespace prefix to use.
+     */
+    defaultPrefix: "owc",
+
+    /**
+     * APIProperty: extractAttributes
+     * {Boolean} Extract attributes from GML.  Default is true.
+     */
+    extractAttributes: true,
+    
+    /**
+     * APIProperty: xy
+     * {Boolean} Order of the GML coordinate true:(x,y) or false:(y,x)
+     * Changing is not recommended, a new Format should be instantiated.
+     */ 
+    xy: true, 
+
+    /**
+     * Property: regExes
+     * Compiled regular expressions for manipulating strings.
+     */
+    regExes: {
+        trimSpace: (/^\s*|\s*$/g),
+        removeSpace: (/\s*/g),
+        splitSpace: (/\s+/),
+        trimComma: (/\s*,\s*/g)
+    },
+
+    /**
+     * Property: featureNS
+     * {String} The namespace uri to use for writing InlineGeometry
+     */
+    featureNS: "http://mapserver.gis.umn.edu/mapserver",
+
+    /**
+     * Property: featureType
+     * {String} The name to use as the feature type when writing out
+     *     InlineGeometry
+     */
+    featureType: 'vector',
+              
+    /**
+     * Property: geometryName
+     * {String} The name to use for the geometry attribute when writing out
+     *     InlineGeometry
+     */
+    geometryName: 'geometry',
+
+    /**
+     * Property: nestingLayerLookup
+     * {Object} Hashtable lookup for nesting layer nodes. Used while writing 
+     *     the OWS context document. It is necessary to keep track of the 
+     *     nestingPaths for which nesting layer nodes have already been 
+     *     created, so (nesting) layer nodes are added to those nodes.
+     *
+     * For example:
+     *
+     *     If there are three layers with nestingPaths:
+     *         layer1.metadata.nestingPath = "a/b/"
+     *         layer2.metadata.nestingPath = "a/b/"
+     *         layer2.metadata.nestingPath = "a/c"
+     *
+     *     then a nesting layer node "a" should be created once and added 
+     *     to the resource list, a nesting layer node "b" should be created 
+     *     once and added under "a", and a nesting layer node "c" should be 
+     *     created and added under "a". The lookup paths for these nodes 
+     *     will be "a", "a/b", and "a/c" respectively.
+     */
+    nestingLayerLookup: null,
+
+    /**
+     * Constructor: OpenLayers.Format.OWSContext.v0_3_1
+     * Instances of this class are not created directly.  Use the
+     *     <OpenLayers.Format.OWSContext> constructor instead.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *     this instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Format.XML.prototype.initialize.apply(this, [options]);
+        OpenLayers.Format.GML.v2.prototype.setGeometryTypes.call(this);
+    },
+
+    /**
+     * Method: setNestingPath
+     * Set the nestingPath property of the layer depending on the position
+     *     of the layer in hierarchy of layers.
+     *
+     * Parameters:
+     * l - {Object} An object that may have a layersContext array property.
+     * 
+     */
+    setNestingPath : function(l){
+        if(l.layersContext){
+            for (var i = 0, len = l.layersContext.length; i < len; i++) {
+                var layerContext = l.layersContext[i];
+                var nPath = [];
+                var nTitle = l.title || "";
+                if(l.metadata && l.metadata.nestingPath){
+                    nPath = l.metadata.nestingPath.slice();
+                }
+                if (nTitle != "") {
+                    nPath.push(nTitle);
+                }
+                layerContext.metadata.nestingPath = nPath;
+                if(layerContext.layersContext){
+                    this.setNestingPath(layerContext);
+                }
+            }
+        }
+    },
+
+    /**
+     * Function: decomposeNestingPath
+     * Takes a nestingPath like "a/b/c" and decomposes it into subpaths:
+     * "a", "a/b", "a/b/c"
+     *
+     * Parameters:
+     * nPath  - {Array} the nesting path
+     *
+     * Returns:
+     * Array({String}) Array with subpaths, or empty array if there is nothing
+     *     to decompose
+     */
+    decomposeNestingPath: function(nPath){
+        var a = [];
+        if (nPath instanceof Array) {
+            while (nPath.length > 0) {
+                a.push(nPath.slice());
+                nPath.pop();
+            }
+            a.reverse();
+        }
+        return a;
+    },
+
+    /**
+     * APIMethod: read
+     * Read OWS context data from a string or DOMElement, and return a list 
+     *     of layers. 
+     * 
+     * Parameters: 
+     * data - {String} or {DOMElement} data to read/parse.
+     *
+     * Returns:
+     * {Object} The context object with a flat layer list as a property named
+     *     layersContext.
+     */
+    read: function(data) {
+        if(typeof data == "string") {
+            data = OpenLayers.Format.XML.prototype.read.apply(this, [data]);
+        }
+        if(data && data.nodeType == 9) {
+            data = data.documentElement;
+        }
+        var context = {};
+        this.readNode(data, context);
+        // since an OWSContext can be nested we need to go through this
+        // structure recursively      
+        this.setNestingPath({layersContext : context.layersContext});
+        // after nesting path has been set, create a flat list of layers
+        var layers = [];
+        this.processLayer(layers, context);
+        delete context.layersContext;
+        context.layersContext = layers;
+        return context;
+    },
+
+    /**
+     * Method: processLayer
+     * Recursive function to get back a flat list of layers from the hierarchic
+     *     layer structure.
+     *
+     * Parameters:
+     * layerArray - {Array({Object})} Array of layerContext objects
+     * layerContext - {Object} layerContext object
+     */
+    processLayer: function(layerArray, layer) {
+        if (layer.layersContext) {
+            for (var i=0, len = layer.layersContext.length; i<len; i++) {
+                var l = layer.layersContext[i];
+                layerArray.push(l);
+                if (l.layersContext) {
+                    this.processLayer(layerArray, l);
+                }
+            }
+        }
+    },
+
+    /**
+     * APIMethod: write
+     *
+     * Parameters:
+     * context - {Object} An object representing the map context.
+     * options - {Object} Optional object.
+     *
+     * Returns:
+     * {String} An OWS Context document string.
+     */
+    write: function(context, options) {
+        var name = "OWSContext";
+        this.nestingLayerLookup = {}; //start with empty lookup
+        options = options || {};
+        OpenLayers.Util.applyDefaults(options, context);
+        var root = this.writeNode(name, options);
+        this.nestingLayerLookup = null; //clear lookup
+        this.setAttributeNS(
+            root, this.namespaces["xsi"],
+            "xsi:schemaLocation", this.schemaLocation
+        );
+        return OpenLayers.Format.XML.prototype.write.apply(this, [root]);
+    }, 
+
+    /**
+     * Property: readers
+     * Contains public functions, grouped by namespace prefix, that will
+     *     be applied when a namespaced node is found matching the function
+     *     name.  The function will be applied in the scope of this parser
+     *     with two arguments: the node being read and a context object passed
+     *     from the parent.
+     */
+    readers: {
+        "kml": {
+            "Document": function(node, obj) {
+                obj.features = new OpenLayers.Format.KML(
+                    {kmlns: this.namespaces.kml, 
+                        extractStyles: true}).read(node);
+            }
+        },
+        "owc": { 
+            "OWSContext": function(node, obj) {
+                this.readChildNodes(node, obj);
+            }, 
+            "General": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "ResourceList": function(node, obj) {
+                this.readChildNodes(node, obj);
+            },
+            "Layer": function(node, obj) {
+                var layerContext = {
+                    metadata: {},
+                    visibility: (node.getAttribute("hidden") != "1"),
+                    queryable: (node.getAttribute("queryable") == "1"),
+                    opacity: ((node.getAttribute("opacity") != null) ? 
+                        parseFloat(node.getAttribute("opacity")) : null),
+                    name: node.getAttribute("name"),
+                    /* A category layer is a dummy layer meant for creating
+                       hierarchies. It is not a physical layer in the 
+                       OpenLayers sense. The assumption we make here is that
+                       category layers do not have a name attribute */
+                    categoryLayer: (node.getAttribute("name") == null),
+                    formats: [],
+                    styles: []
+                };
+                if (!obj.layersContext) {
+                    obj.layersContext = [];
+                }
+                obj.layersContext.push(layerContext);
+                this.readChildNodes(node, layerContext);
+            },
+            "InlineGeometry": function(node, obj) {
+                obj.features = [];
+                var elements = this.getElementsByTagNameNS(node, 
+                    this.namespaces.gml, "featureMember");
+                var el;
+                if (elements.length >= 1) {
+                    el = elements[0];
+                }
+                if (el && el.firstChild) {
+                    var featurenode = (el.firstChild.nextSibling) ? 
+                        el.firstChild.nextSibling : el.firstChild;
+                    this.setNamespace("feature", featurenode.namespaceURI);
+                    this.featureType = featurenode.localName || 
+                        featurenode.nodeName.split(":").pop();
+                    this.readChildNodes(node, obj);
+                }
+            },
+            "Server": function(node, obj) {
+                // when having multiple Server types, we prefer WMS
+                if ((!obj.service && !obj.version) || 
+                    (obj.service != 
+                        OpenLayers.Format.Context.serviceTypes.WMS)) {
+                            obj.service = node.getAttribute("service");
+                            obj.version = node.getAttribute("version");
+                            this.readChildNodes(node, obj);
+                }
+            },
+            "Name": function(node, obj) {
+                obj.name = this.getChildValue(node);
+                this.readChildNodes(node, obj);
+            },
+            "Title": function(node, obj) {
+                obj.title = this.getChildValue(node);
+                this.readChildNodes(node, obj);
+            },
+            "StyleList": function(node, obj) {
+                this.readChildNodes(node, obj.styles);
+            },
+            "Style": function(node, obj) {
+                var style = {};
+                obj.push(style);
+                this.readChildNodes(node, style);
+            },
+            "LegendURL": function(node, obj) {
+                var legend = {};
+                obj.legend = legend;
+                this.readChildNodes(node, legend);
+            },
+            "OnlineResource": function(node, obj) {
+                obj.url = this.getAttributeNS(node, this.namespaces.xlink, 
+                    "href");
+                this.readChildNodes(node, obj);
+            }
+        },
+        "ows": OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers.ows,
+        "gml": OpenLayers.Format.GML.v2.prototype.readers.gml,
+        "sld": OpenLayers.Format.SLD.v1_0_0.prototype.readers.sld,
+        "feature": OpenLayers.Format.GML.v2.prototype.readers.feature
+    },
+
+    /**
+     * Property: writers
+     * As a compliment to the readers property, this structure contains public
+     *     writing functions grouped by namespace alias and named like the
+     *     node names they produce.
+     */
+    writers: {
+        "owc": {
+            "OWSContext": function(options) {
+                var node = this.createElementNSPlus("OWSContext", {
+                    attributes: {
+                        version: this.VERSION,
+                        id: options.id || OpenLayers.Util.createUniqueID("OpenLayers_OWSContext_")
+                    } 
+                }); 
+                this.writeNode("General", options, node);
+                this.writeNode("ResourceList", options, node);
+                return node; 
+            },
+            "General": function(options) {
+                var node = this.createElementNSPlus("General");
+                this.writeNode("ows:BoundingBox", options, node);
+                this.writeNode("ows:Title", options.title || 'OpenLayers OWSContext', node);
+                return node;
+            },
+            "ResourceList": function(options) {
+                var node = this.createElementNSPlus("ResourceList");
+                for (var i=0, len=options.layers.length; i<len; i++) {
+                    var layer = options.layers[i];
+                    var decomposedPath = this.decomposeNestingPath(layer.metadata.nestingPath);
+                    this.writeNode("_Layer", {layer: layer, subPaths: decomposedPath}, node);
+                }
+                return node;
+            },
+            "Server": function(options) {
+                var node = this.createElementNSPlus("Server", {attributes: {
+                    version: options.version,
+                    service: options.service }
+                });
+                this.writeNode("OnlineResource", options, node);
+                return node;
+            },
+            "OnlineResource": function(options) {
+                var node = this.createElementNSPlus("OnlineResource", {attributes: {
+                    "xlink:href": options.url }
+                });
+                return node;
+            },
+            "InlineGeometry": function(layer) {
+                var node = this.createElementNSPlus("InlineGeometry");
+                this.writeNode("gml:boundedBy", layer.getDataExtent(), node);
+                for (var i=0, len=layer.features.length; i<len; i++) {
+                    this.writeNode("gml:featureMember", layer.features[i], node);
+                }
+                return node;
+            },
+            "StyleList": function(styles) {
+                var node = this.createElementNSPlus("StyleList");
+                for (var i=0, len=styles.length; i<len; i++) {
+                    this.writeNode("Style", styles[i], node);
+                }
+                return node;
+            },
+            "Style": function(style) {
+                var node = this.createElementNSPlus("Style");
+                this.writeNode("Name", style, node);
+                this.writeNode("Title", style, node);
+                this.writeNode("LegendURL", style, node);
+                return node;
+            },
+            "Name": function(obj) {
+                var node = this.createElementNSPlus("Name", {
+                    value: obj.name });
+                return node;
+            },
+            "Title": function(obj) {
+                var node = this.createElementNSPlus("Title", {
+                    value: obj.title });
+                return node;
+            },
+            "LegendURL": function(style) {
+                var node = this.createElementNSPlus("LegendURL");
+                this.writeNode("OnlineResource", style.legend, node);
+                return node;
+            },
+            "_WMS": function(layer) {
+                var node = this.createElementNSPlus("Layer", {attributes: {
+                    name: layer.params.LAYERS,
+                    queryable: layer.queryable ? "1" : "0",
+                    hidden: layer.visibility ? "0" : "1",
+                    opacity: layer.opacity ? layer.opacity: null}
+                });
+                this.writeNode("ows:Title", layer.name, node);
+                this.writeNode("ows:OutputFormat", layer.params.FORMAT, node);
+                this.writeNode("Server", {service: 
+                    OpenLayers.Format.Context.serviceTypes.WMS,
+                    version: layer.params.VERSION, url: layer.url}, node);
+                if (layer.metadata.styles && layer.metadata.styles.length > 0) {
+                    this.writeNode("StyleList", layer.metadata.styles, node);
+                }
+                return node;
+            },
+            "_Layer": function(options) {
+                var layer, subPaths, node, title;
+                layer = options.layer;
+                subPaths = options.subPaths;
+                node = null;
+                title = null;
+                // subPaths is an array of an array
+                // recursively calling _Layer writer eats up subPaths, until a 
+                // real writer is called and nodes are returned.
+                if(subPaths.length > 0){
+                    var path = subPaths[0].join("/");
+                    var index = path.lastIndexOf("/");
+                    node = this.nestingLayerLookup[path];
+                    title = (index > 0)?path.substring(index + 1, path.length):path;
+                    if(!node){
+                        // category layer
+                        node = this.createElementNSPlus("Layer");
+                        this.writeNode("ows:Title", title, node);
+                        this.nestingLayerLookup[path] = node;
+                    }
+                    options.subPaths.shift();//remove a path after each call
+                    this.writeNode("_Layer", options, node);
+                    return node;
+                } else {
+                    // write out the actual layer
+                    if (layer instanceof OpenLayers.Layer.WMS) {
+                        node = this.writeNode("_WMS", layer);
+                    } else if (layer instanceof OpenLayers.Layer.Vector) {
+                        if (layer.protocol instanceof OpenLayers.Protocol.WFS.v1) {
+                            node = this.writeNode("_WFS", layer);
+                        } else if (layer.protocol instanceof OpenLayers.Protocol.HTTP) {
+                            if (layer.protocol.format instanceof OpenLayers.Format.GML) {
+                                layer.protocol.format.version = "2.1.2";
+                                node = this.writeNode("_GML", layer);
+                            } else if (layer.protocol.format instanceof OpenLayers.Format.KML) {
+                                layer.protocol.format.version = "2.2";
+                                node = this.writeNode("_KML", layer);
+                            }
+                        } else {
+                            // write out as inline GML since we have no idea
+                            // about the original Format
+                            this.setNamespace("feature", this.featureNS);
+                            node = this.writeNode("_InlineGeometry", layer);
+                        }
+                    }
+                    if (layer.options.maxScale) {
+                        this.writeNode("sld:MinScaleDenominator", 
+                            layer.options.maxScale, node);
+                    }
+                    if (layer.options.minScale) {
+                        this.writeNode("sld:MaxScaleDenominator", 
+                            layer.options.minScale, node);
+                    }
+                    this.nestingLayerLookup[layer.name] = node;
+                    return node;
+                }
+            },
+            "_WFS": function(layer) {
+                var node = this.createElementNSPlus("Layer", {attributes: {
+                    name: layer.protocol.featurePrefix + ":" + layer.protocol.featureType,
+                    hidden: layer.visibility ? "0" : "1" }
+                });
+                this.writeNode("ows:Title", layer.name, node);
+                this.writeNode("Server", {service: 
+                    OpenLayers.Format.Context.serviceTypes.WFS, 
+                    version: layer.protocol.version, 
+                    url: layer.protocol.url}, node);
+                return node;
+            },
+            "_InlineGeometry": function(layer) {
+                var node = this.createElementNSPlus("Layer", {attributes: {
+                    name: this.featureType,
+                    hidden: layer.visibility ? "0" : "1" }
+                });
+                this.writeNode("ows:Title", layer.name, node);
+                this.writeNode("InlineGeometry", layer, node);
+                return node;
+            },
+            "_GML": function(layer) {
+                var node = this.createElementNSPlus("Layer");
+                this.writeNode("ows:Title", layer.name, node);
+                this.writeNode("Server", {service: 
+                    OpenLayers.Format.Context.serviceTypes.GML, 
+                    url: layer.protocol.url, version: 
+                    layer.protocol.format.version}, node);
+                return node;
+            },
+            "_KML": function(layer) {
+                var node = this.createElementNSPlus("Layer");
+                this.writeNode("ows:Title", layer.name, node);
+                this.writeNode("Server", {service: 
+                    OpenLayers.Format.Context.serviceTypes.KML,
+                    version: layer.protocol.format.version, url: 
+                    layer.protocol.url}, node);
+                return node;
+            }
+        },
+        "gml": OpenLayers.Util.applyDefaults({
+            "boundedBy": function(bounds) {
+                var node = this.createElementNSPlus("gml:boundedBy");
+                this.writeNode("gml:Box", bounds, node);
+                return node;
+            }
+        }, OpenLayers.Format.GML.v2.prototype.writers.gml),
+        "ows": OpenLayers.Format.OWSCommon.v1_0_0.prototype.writers.ows,
+        "sld": OpenLayers.Format.SLD.v1_0_0.prototype.writers.sld,
+        "feature": OpenLayers.Format.GML.v2.prototype.writers.feature
+    },
+    
+    CLASS_NAME: "OpenLayers.Format.OWSContext.v0_3_1" 
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request/XMLHttpRequest.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request/XMLHttpRequest.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request/XMLHttpRequest.js	(revision 76)
@@ -0,0 +1,384 @@
+// XMLHttpRequest.js Copyright (C) 2010 Sergey Ilinsky (http://www.ilinsky.com)
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+/**
+ * @requires OpenLayers/Request.js
+ */
+
+(function () {
+
+    // Save reference to earlier defined object implementation (if any)
+    var oXMLHttpRequest    = window.XMLHttpRequest;
+
+    // Define on browser type
+    var bGecko    = !!window.controllers,
+        bIE        = window.document.all && !window.opera,
+        bIE7    = bIE && window.navigator.userAgent.match(/MSIE ([\.0-9]+)/) && RegExp.$1 == 7;
+
+    // Constructor
+    function cXMLHttpRequest() {
+        this._object    = oXMLHttpRequest && !bIE7 ? new oXMLHttpRequest : new window.ActiveXObject("Microsoft.XMLHTTP");
+        this._listeners    = [];
+    };
+
+    // BUGFIX: Firefox with Firebug installed would break pages if not executed
+    if (bGecko && oXMLHttpRequest.wrapped)
+        cXMLHttpRequest.wrapped    = oXMLHttpRequest.wrapped;
+
+    // Constants
+    cXMLHttpRequest.UNSENT                = 0;
+    cXMLHttpRequest.OPENED                = 1;
+    cXMLHttpRequest.HEADERS_RECEIVED    = 2;
+    cXMLHttpRequest.LOADING                = 3;
+    cXMLHttpRequest.DONE                = 4;
+
+    // Public Properties
+    cXMLHttpRequest.prototype.readyState    = cXMLHttpRequest.UNSENT;
+    cXMLHttpRequest.prototype.responseText    = '';
+    cXMLHttpRequest.prototype.responseXML    = null;
+    cXMLHttpRequest.prototype.status        = 0;
+    cXMLHttpRequest.prototype.statusText    = '';
+
+    // Instance-level Events Handlers
+    cXMLHttpRequest.prototype.onreadystatechange    = null;
+
+    // Class-level Events Handlers
+    cXMLHttpRequest.onreadystatechange    = null;
+    cXMLHttpRequest.onopen                = null;
+    cXMLHttpRequest.onsend                = null;
+    cXMLHttpRequest.onabort                = null;
+
+    // Public Methods
+    cXMLHttpRequest.prototype.open    = function(sMethod, sUrl, bAsync, sUser, sPassword) {
+        // Delete headers, required when object is reused
+        delete this._headers;
+
+        // When bAsync parameter value is omitted, use true as default
+        if (arguments.length < 3)
+            bAsync    = true;
+
+        // Save async parameter for fixing Gecko bug with missing readystatechange in synchronous requests
+        this._async        = bAsync;
+
+        // Set the onreadystatechange handler
+        var oRequest    = this,
+            nState        = this.readyState,
+            fOnUnload;
+
+        // BUGFIX: IE - memory leak on page unload (inter-page leak)
+        if (bIE && bAsync) {
+            fOnUnload = function() {
+                if (nState != cXMLHttpRequest.DONE) {
+                    fCleanTransport(oRequest);
+                    // Safe to abort here since onreadystatechange handler removed
+                    oRequest.abort();
+                }
+            };
+                window.attachEvent("onunload", fOnUnload);
+        }
+
+        // Add method sniffer
+        if (cXMLHttpRequest.onopen)
+            cXMLHttpRequest.onopen.apply(this, arguments);
+
+        if (arguments.length > 4)
+            this._object.open(sMethod, sUrl, bAsync, sUser, sPassword);
+        else
+        if (arguments.length > 3)
+            this._object.open(sMethod, sUrl, bAsync, sUser);
+        else
+            this._object.open(sMethod, sUrl, bAsync);
+
+        if (!bGecko && !bIE) {
+            this.readyState    = cXMLHttpRequest.OPENED;
+            fReadyStateChange(this);
+        }
+
+        this._object.onreadystatechange    = function() {
+            if (bGecko && !bAsync)
+                return;
+
+            // Synchronize state
+            oRequest.readyState        = oRequest._object.readyState;
+
+            //
+            fSynchronizeValues(oRequest);
+
+            // BUGFIX: Firefox fires unnecessary DONE when aborting
+            if (oRequest._aborted) {
+                // Reset readyState to UNSENT
+                oRequest.readyState    = cXMLHttpRequest.UNSENT;
+
+                // Return now
+                return;
+            }
+
+            if (oRequest.readyState == cXMLHttpRequest.DONE) {
+                //
+                fCleanTransport(oRequest);
+// Uncomment this block if you need a fix for IE cache
+/*
+                // BUGFIX: IE - cache issue
+                if (!oRequest._object.getResponseHeader("Date")) {
+                    // Save object to cache
+                    oRequest._cached    = oRequest._object;
+
+                    // Instantiate a new transport object
+                    cXMLHttpRequest.call(oRequest);
+
+                    // Re-send request
+                    if (sUser) {
+                         if (sPassword)
+                    oRequest._object.open(sMethod, sUrl, bAsync, sUser, sPassword);
+                        else
+                            oRequest._object.open(sMethod, sUrl, bAsync, sUser);
+                    }
+                    else
+                        oRequest._object.open(sMethod, sUrl, bAsync);
+                    oRequest._object.setRequestHeader("If-Modified-Since", oRequest._cached.getResponseHeader("Last-Modified") || new window.Date(0));
+                    // Copy headers set
+                    if (oRequest._headers)
+                        for (var sHeader in oRequest._headers)
+                            if (typeof oRequest._headers[sHeader] == "string")    // Some frameworks prototype objects with functions
+                                oRequest._object.setRequestHeader(sHeader, oRequest._headers[sHeader]);
+
+                    oRequest._object.onreadystatechange    = function() {
+                        // Synchronize state
+                        oRequest.readyState        = oRequest._object.readyState;
+
+                        if (oRequest._aborted) {
+                            //
+                            oRequest.readyState    = cXMLHttpRequest.UNSENT;
+
+                            // Return
+                            return;
+                        }
+
+                        if (oRequest.readyState == cXMLHttpRequest.DONE) {
+                            // Clean Object
+                            fCleanTransport(oRequest);
+
+                            // get cached request
+                            if (oRequest.status == 304)
+                                oRequest._object    = oRequest._cached;
+
+                            //
+                            delete oRequest._cached;
+
+                            //
+                            fSynchronizeValues(oRequest);
+
+                            //
+                            fReadyStateChange(oRequest);
+
+                            // BUGFIX: IE - memory leak in interrupted
+                            if (bIE && bAsync)
+                                window.detachEvent("onunload", fOnUnload);
+                        }
+                    };
+                    oRequest._object.send(null);
+
+                    // Return now - wait until re-sent request is finished
+                    return;
+                };
+*/
+                // BUGFIX: IE - memory leak in interrupted
+                if (bIE && bAsync)
+                    window.detachEvent("onunload", fOnUnload);
+            }
+
+            // BUGFIX: Some browsers (Internet Explorer, Gecko) fire OPEN readystate twice
+            if (nState != oRequest.readyState)
+                fReadyStateChange(oRequest);
+
+            nState    = oRequest.readyState;
+        }
+    };
+    cXMLHttpRequest.prototype.send    = function(vData) {
+        // Add method sniffer
+        if (cXMLHttpRequest.onsend)
+            cXMLHttpRequest.onsend.apply(this, arguments);
+
+        // BUGFIX: Safari - fails sending documents created/modified dynamically, so an explicit serialization required
+        // BUGFIX: IE - rewrites any custom mime-type to "text/xml" in case an XMLNode is sent
+        // BUGFIX: Gecko - fails sending Element (this is up to the implementation either to standard)
+        if (vData && vData.nodeType) {
+            vData    = window.XMLSerializer ? new window.XMLSerializer().serializeToString(vData) : vData.xml;
+            if (!this._headers["Content-Type"])
+                this._object.setRequestHeader("Content-Type", "application/xml");
+        }
+
+        this._object.send(vData);
+
+        // BUGFIX: Gecko - missing readystatechange calls in synchronous requests
+        if (bGecko && !this._async) {
+            this.readyState    = cXMLHttpRequest.OPENED;
+
+            // Synchronize state
+            fSynchronizeValues(this);
+
+            // Simulate missing states
+            while (this.readyState < cXMLHttpRequest.DONE) {
+                this.readyState++;
+                fReadyStateChange(this);
+                // Check if we are aborted
+                if (this._aborted)
+                    return;
+            }
+        }
+    };
+    cXMLHttpRequest.prototype.abort    = function() {
+        // Add method sniffer
+        if (cXMLHttpRequest.onabort)
+            cXMLHttpRequest.onabort.apply(this, arguments);
+
+        // BUGFIX: Gecko - unnecessary DONE when aborting
+        if (this.readyState > cXMLHttpRequest.UNSENT)
+            this._aborted    = true;
+
+        this._object.abort();
+
+        // BUGFIX: IE - memory leak
+        fCleanTransport(this);
+    };
+    cXMLHttpRequest.prototype.getAllResponseHeaders    = function() {
+        return this._object.getAllResponseHeaders();
+    };
+    cXMLHttpRequest.prototype.getResponseHeader    = function(sName) {
+        return this._object.getResponseHeader(sName);
+    };
+    cXMLHttpRequest.prototype.setRequestHeader    = function(sName, sValue) {
+        // BUGFIX: IE - cache issue
+        if (!this._headers)
+            this._headers    = {};
+        this._headers[sName]    = sValue;
+
+        return this._object.setRequestHeader(sName, sValue);
+    };
+
+    // EventTarget interface implementation
+    cXMLHttpRequest.prototype.addEventListener    = function(sName, fHandler, bUseCapture) {
+        for (var nIndex = 0, oListener; oListener = this._listeners[nIndex]; nIndex++)
+            if (oListener[0] == sName && oListener[1] == fHandler && oListener[2] == bUseCapture)
+                return;
+        // Add listener
+        this._listeners.push([sName, fHandler, bUseCapture]);
+    };
+
+    cXMLHttpRequest.prototype.removeEventListener    = function(sName, fHandler, bUseCapture) {
+        for (var nIndex = 0, oListener; oListener = this._listeners[nIndex]; nIndex++)
+            if (oListener[0] == sName && oListener[1] == fHandler && oListener[2] == bUseCapture)
+                break;
+        // Remove listener
+        if (oListener)
+            this._listeners.splice(nIndex, 1);
+    };
+
+    cXMLHttpRequest.prototype.dispatchEvent    = function(oEvent) {
+        var oEventPseudo    = {
+            'type':            oEvent.type,
+            'target':        this,
+            'currentTarget':this,
+            'eventPhase':    2,
+            'bubbles':        oEvent.bubbles,
+            'cancelable':    oEvent.cancelable,
+            'timeStamp':    oEvent.timeStamp,
+            'stopPropagation':    function() {},    // There is no flow
+            'preventDefault':    function() {},    // There is no default action
+            'initEvent':        function() {}    // Original event object should be initialized
+        };
+
+        // Execute onreadystatechange
+        if (oEventPseudo.type == "readystatechange" && this.onreadystatechange)
+            (this.onreadystatechange.handleEvent || this.onreadystatechange).apply(this, [oEventPseudo]);
+
+        // Execute listeners
+        for (var nIndex = 0, oListener; oListener = this._listeners[nIndex]; nIndex++)
+            if (oListener[0] == oEventPseudo.type && !oListener[2])
+                (oListener[1].handleEvent || oListener[1]).apply(this, [oEventPseudo]);
+    };
+
+    //
+    cXMLHttpRequest.prototype.toString    = function() {
+        return '[' + "object" + ' ' + "XMLHttpRequest" + ']';
+    };
+
+    cXMLHttpRequest.toString    = function() {
+        return '[' + "XMLHttpRequest" + ']';
+    };
+
+    // Helper function
+    function fReadyStateChange(oRequest) {
+        // Sniffing code
+        if (cXMLHttpRequest.onreadystatechange)
+            cXMLHttpRequest.onreadystatechange.apply(oRequest);
+
+        // Fake event
+        oRequest.dispatchEvent({
+            'type':            "readystatechange",
+            'bubbles':        false,
+            'cancelable':    false,
+            'timeStamp':    new Date + 0
+        });
+    };
+
+    function fGetDocument(oRequest) {
+        var oDocument    = oRequest.responseXML,
+            sResponse    = oRequest.responseText;
+        // Try parsing responseText
+        if (bIE && sResponse && oDocument && !oDocument.documentElement && oRequest.getResponseHeader("Content-Type").match(/[^\/]+\/[^\+]+\+xml/)) {
+            oDocument    = new window.ActiveXObject("Microsoft.XMLDOM");
+            oDocument.async                = false;
+            oDocument.validateOnParse    = false;
+            oDocument.loadXML(sResponse);
+        }
+        // Check if there is no error in document
+        if (oDocument)
+            if ((bIE && oDocument.parseError != 0) || !oDocument.documentElement || (oDocument.documentElement && oDocument.documentElement.tagName == "parsererror"))
+                return null;
+        return oDocument;
+    };
+
+    function fSynchronizeValues(oRequest) {
+        try {    oRequest.responseText    = oRequest._object.responseText;    } catch (e) {}
+        try {    oRequest.responseXML    = fGetDocument(oRequest._object);    } catch (e) {}
+        try {    oRequest.status            = oRequest._object.status;            } catch (e) {}
+        try {    oRequest.statusText        = oRequest._object.statusText;        } catch (e) {}
+    };
+
+    function fCleanTransport(oRequest) {
+        // BUGFIX: IE - memory leak (on-page leak)
+        oRequest._object.onreadystatechange    = new window.Function;
+    };
+
+    // Internet Explorer 5.0 (missing apply)
+    if (!window.Function.prototype.apply) {
+        window.Function.prototype.apply    = function(oRequest, oArguments) {
+            if (!oArguments)
+                oArguments    = [];
+            oRequest.__func    = this;
+            oRequest.__func(oArguments[0], oArguments[1], oArguments[2], oArguments[3], oArguments[4]);
+            delete oRequest.__func;
+        };
+    };
+
+    // Register new object with window
+    /**
+     * Class: OpenLayers.Request.XMLHttpRequest
+     * Standard-compliant (W3C) cross-browser implementation of the
+     *     XMLHttpRequest object.  From
+     *     http://code.google.com/p/xmlhttprequest/.
+     */
+    OpenLayers.Request.XMLHttpRequest = cXMLHttpRequest;
+})();
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control.js	(revision 76)
@@ -0,0 +1,368 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Control
+ * Controls affect the display or behavior of the map. They allow everything
+ * from panning and zooming to displaying a scale indicator. Controls by 
+ * default are added to the map they are contained within however it is
+ * possible to add a control to an external div by passing the div in the
+ * options parameter.
+ * 
+ * Example:
+ * The following example shows how to add many of the common controls
+ * to a map.
+ * 
+ * > var map = new OpenLayers.Map('map', { controls: [] });
+ * >
+ * > map.addControl(new OpenLayers.Control.PanZoomBar());
+ * > map.addControl(new OpenLayers.Control.MouseToolbar());
+ * > map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
+ * > map.addControl(new OpenLayers.Control.Permalink());
+ * > map.addControl(new OpenLayers.Control.Permalink('permalink'));
+ * > map.addControl(new OpenLayers.Control.MousePosition());
+ * > map.addControl(new OpenLayers.Control.OverviewMap());
+ * > map.addControl(new OpenLayers.Control.KeyboardDefaults());
+ *
+ * The next code fragment is a quick example of how to intercept 
+ * shift-mouse click to display the extent of the bounding box
+ * dragged out by the user.  Usually controls are not created
+ * in exactly this manner.  See the source for a more complete 
+ * example:
+ *
+ * > var control = new OpenLayers.Control();
+ * > OpenLayers.Util.extend(control, {
+ * >     draw: function () {
+ * >         // this Handler.Box will intercept the shift-mousedown
+ * >         // before Control.MouseDefault gets to see it
+ * >         this.box = new OpenLayers.Handler.Box( control, 
+ * >             {"done": this.notice},
+ * >             {keyMask: OpenLayers.Handler.MOD_SHIFT});
+ * >         this.box.activate();
+ * >     },
+ * >
+ * >     notice: function (bounds) {
+ * >         OpenLayers.Console.userError(bounds);
+ * >     }
+ * > }); 
+ * > map.addControl(control);
+ * 
+ */
+OpenLayers.Control = OpenLayers.Class({
+
+    /** 
+     * Property: id 
+     * {String} 
+     */
+    id: null,
+    
+    /** 
+     * Property: map 
+     * {<OpenLayers.Map>} this gets set in the addControl() function in
+     * OpenLayers.Map 
+     */
+    map: null,
+
+    /** 
+     * Property: div 
+     * {DOMElement} 
+     */
+    div: null,
+
+    /** 
+     * Property: type 
+     * {Number} Controls can have a 'type'. The type determines the type of
+     * interactions which are possible with them when they are placed in an
+     * <OpenLayers.Control.Panel>. 
+     */
+    type: null, 
+
+    /** 
+     * Property: allowSelection
+     * {Boolean} By deafault, controls do not allow selection, because
+     * it may interfere with map dragging. If this is true, OpenLayers
+     * will not prevent selection of the control.
+     * Default is false.
+     */
+    allowSelection: false,  
+
+    /** 
+     * Property: displayClass 
+     * {string}  This property is used for CSS related to the drawing of the
+     * Control. 
+     */
+    displayClass: "",
+    
+    /**
+    * Property: title  
+    * {string}  This property is used for showing a tooltip over the  
+    * Control.  
+    */ 
+    title: "",
+
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     false.
+     */
+    autoActivate: false,
+
+    /** 
+     * Property: active 
+     * {Boolean} The control is active.
+     */
+    active: null,
+
+    /** 
+     * Property: handler 
+     * {<OpenLayers.Handler>} null
+     */
+    handler: null,
+
+    /**
+     * APIProperty: eventListeners
+     * {Object} If set as an option at construction, the eventListeners
+     *     object will be registered with <OpenLayers.Events.on>.  Object
+     *     structure must be a listeners object as shown in the example for
+     *     the events.on method.
+     */
+    eventListeners: null,
+
+    /** 
+     * Property: events
+     * {<OpenLayers.Events>} Events instance for triggering control specific
+     *     events.
+     */
+    events: null,
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * control.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * All event objects have at least the following properties:
+     * object - {Object} A reference to control.events.object (a reference
+     *      to the control).
+     * element - {DOMElement} A reference to control.events.element (which
+     *      will be null unless documented otherwise).
+     *
+     * Supported map event types:
+     * activate - Triggered when activated.
+     * deactivate - Triggered when deactivated.
+     */
+    EVENT_TYPES: ["activate", "deactivate"],
+
+    /**
+     * Constructor: OpenLayers.Control
+     * Create an OpenLayers Control.  The options passed as a parameter
+     * directly extend the control.  For example passing the following:
+     * 
+     * > var control = new OpenLayers.Control({div: myDiv});
+     *
+     * Overrides the default div attribute value of null.
+     * 
+     * Parameters:
+     * options - {Object} 
+     */
+    initialize: function (options) {
+        // We do this before the extend so that instances can override
+        // className in options.
+        this.displayClass = 
+            this.CLASS_NAME.replace("OpenLayers.", "ol").replace(/\./g, "");
+        
+        OpenLayers.Util.extend(this, options);
+        
+        this.events = new OpenLayers.Events(this, null, this.EVENT_TYPES);
+        if(this.eventListeners instanceof Object) {
+            this.events.on(this.eventListeners);
+        }
+        if (this.id == null) {
+            this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+        }
+    },
+
+    /**
+     * Method: destroy
+     * The destroy method is used to perform any clean up before the control
+     * is dereferenced.  Typically this is where event listeners are removed
+     * to prevent memory leaks.
+     */
+    destroy: function () {
+        if(this.events) {
+            if(this.eventListeners) {
+                this.events.un(this.eventListeners);
+            }
+            this.events.destroy();
+            this.events = null;
+        }
+        this.eventListeners = null;
+
+        // eliminate circular references
+        if (this.handler) {
+            this.handler.destroy();
+            this.handler = null;
+        }
+        if(this.handlers) {
+            for(var key in this.handlers) {
+                if(this.handlers.hasOwnProperty(key) &&
+                   typeof this.handlers[key].destroy == "function") {
+                    this.handlers[key].destroy();
+                }
+            }
+            this.handlers = null;
+        }
+        if (this.map) {
+            this.map.removeControl(this);
+            this.map = null;
+        }
+    },
+
+    /** 
+     * Method: setMap
+     * Set the map property for the control. This is done through an accessor
+     * so that subclasses can override this and take special action once 
+     * they have their map variable set. 
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        this.map = map;
+        if (this.handler) {
+            this.handler.setMap(map);
+        }
+    },
+  
+    /**
+     * Method: draw
+     * The draw method is called when the control is ready to be displayed
+     * on the page.  If a div has not been created one is created.  Controls
+     * with a visual component will almost always want to override this method 
+     * to customize the look of control. 
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} The top-left pixel position of the control
+     *      or null.
+     *
+     * Returns:
+     * {DOMElement} A reference to the DIV DOMElement containing the control
+     */
+    draw: function (px) {
+        if (this.div == null) {
+            this.div = OpenLayers.Util.createDiv(this.id);
+            this.div.className = this.displayClass;
+            if (!this.allowSelection) {
+                this.div.className += " olControlNoSelect";
+                this.div.setAttribute("unselectable", "on", 0);
+                this.div.onselectstart = OpenLayers.Function.False; 
+            }    
+            if (this.title != "") {
+                this.div.title = this.title;
+            }
+        }
+        if (px != null) {
+            this.position = px.clone();
+        }
+        this.moveTo(this.position);
+        return this.div;
+    },
+
+    /**
+     * Method: moveTo
+     * Sets the left and top style attributes to the passed in pixel 
+     * coordinates.
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     */
+    moveTo: function (px) {
+        if ((px != null) && (this.div != null)) {
+            this.div.style.left = px.x + "px";
+            this.div.style.top = px.y + "px";
+        }
+    },
+
+    /**
+     * Method: activate
+     * Explicitly activates a control and it's associated
+     * handler if one has been set.  Controls can be
+     * deactivated by calling the deactivate() method.
+     * 
+     * Returns:
+     * {Boolean}  True if the control was successfully activated or
+     *            false if the control was already active.
+     */
+    activate: function () {
+        if (this.active) {
+            return false;
+        }
+        if (this.handler) {
+            this.handler.activate();
+        }
+        this.active = true;
+        if(this.map) {
+            OpenLayers.Element.addClass(
+                this.map.viewPortDiv,
+                this.displayClass.replace(/ /g, "") + "Active"
+            );
+        }
+        this.events.triggerEvent("activate");
+        return true;
+    },
+    
+    /**
+     * Method: deactivate
+     * Deactivates a control and it's associated handler if any.  The exact
+     * effect of this depends on the control itself.
+     * 
+     * Returns:
+     * {Boolean} True if the control was effectively deactivated or false
+     *           if the control was already inactive.
+     */
+    deactivate: function () {
+        if (this.active) {
+            if (this.handler) {
+                this.handler.deactivate();
+            }
+            this.active = false;
+            if(this.map) {
+                OpenLayers.Element.removeClass(
+                    this.map.viewPortDiv,
+                    this.displayClass.replace(/ /g, "") + "Active"
+                );
+            }
+            this.events.triggerEvent("deactivate");
+            return true;
+        }
+        return false;
+    },
+
+    CLASS_NAME: "OpenLayers.Control"
+});
+
+/**
+ * Constant: OpenLayers.Control.TYPE_BUTTON
+ */
+OpenLayers.Control.TYPE_BUTTON = 1;
+
+/**
+ * Constant: OpenLayers.Control.TYPE_TOGGLE
+ */
+OpenLayers.Control.TYPE_TOGGLE = 2;
+
+/**
+ * Constant: OpenLayers.Control.TYPE_TOOL
+ */
+OpenLayers.Control.TYPE_TOOL   = 3;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Lang.js	(revision 76)
@@ -0,0 +1,133 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Namespace: OpenLayers.Lang
+ * Internationalization namespace.  Contains dictionaries in various languages
+ *     and methods to set and get the current language.
+ */
+OpenLayers.Lang = {
+    
+    /** 
+     * Property: code
+     * {String}  Current language code to use in OpenLayers.  Use the
+     *     <setCode> method to set this value and the <getCode> method to
+     *     retrieve it.
+     */
+    code: null,
+
+    /** 
+     * APIProperty: defaultCode
+     * {String} Default language to use when a specific language can't be
+     *     found.  Default is "en".
+     */
+    defaultCode: "en",
+        
+    /**
+     * APIFunction: getCode
+     * Get the current language code.
+     *
+     * Returns:
+     * The current language code.
+     */
+    getCode: function() {
+        if(!OpenLayers.Lang.code) {
+            OpenLayers.Lang.setCode();
+        }
+        return OpenLayers.Lang.code;
+    },
+    
+    /**
+     * APIFunction: setCode
+     * Set the language code for string translation.  This code is used by
+     *     the <OpenLayers.Lang.translate> method.
+     *
+     * Parameters-
+     * code - {String} These codes follow the IETF recommendations at
+     *     http://www.ietf.org/rfc/rfc3066.txt.  If no value is set, the
+     *     browser's language setting will be tested.  If no <OpenLayers.Lang>
+     *     dictionary exists for the code, the <OpenLayers.String.defaultLang>
+     *     will be used.
+     */
+    setCode: function(code) {
+        var lang;
+        if(!code) {
+            code = (OpenLayers.Util.getBrowserName() == "msie") ?
+                navigator.userLanguage : navigator.language;
+        }
+        var parts = code.split('-');
+        parts[0] = parts[0].toLowerCase();
+        if(typeof OpenLayers.Lang[parts[0]] == "object") {
+            lang = parts[0];
+        }
+
+        // check for regional extensions
+        if(parts[1]) {
+            var testLang = parts[0] + '-' + parts[1].toUpperCase();
+            if(typeof OpenLayers.Lang[testLang] == "object") {
+                lang = testLang;
+            }
+        }
+        if(!lang) {
+            OpenLayers.Console.warn(
+                'Failed to find OpenLayers.Lang.' + parts.join("-") +
+                ' dictionary, falling back to default language'
+            );
+            lang = OpenLayers.Lang.defaultCode;
+        }
+        
+        OpenLayers.Lang.code = lang;
+    },
+
+    /**
+     * APIMethod: translate
+     * Looks up a key from a dictionary based on the current language string.
+     *     The value of <getCode> will be used to determine the appropriate
+     *     dictionary.  Dictionaries are stored in <OpenLayers.Lang>.
+     *
+     * Parameters:
+     * key - {String} The key for an i18n string value in the dictionary.
+     * context - {Object} Optional context to be used with
+     *     <OpenLayers.String.format>.
+     * 
+     * Returns:
+     * {String} A internationalized string.
+     */
+    translate: function(key, context) {
+        var dictionary = OpenLayers.Lang[OpenLayers.Lang.getCode()];
+        var message = dictionary[key];
+        if(!message) {
+            // Message not found, fall back to message key
+            message = key;
+        }
+        if(context) {
+            message = OpenLayers.String.format(message, context);
+        }
+        return message;
+    }
+    
+};
+
+
+/**
+ * APIMethod: OpenLayers.i18n
+ * Alias for <OpenLayers.Lang.translate>.  Looks up a key from a dictionary
+ *     based on the current language string. The value of
+ *     <OpenLayers.Lang.getCode> will be used to determine the appropriate
+ *     dictionary.  Dictionaries are stored in <OpenLayers.Lang>.
+ *
+ * Parameters:
+ * key - {String} The key for an i18n string value in the dictionary.
+ * context - {Object} Optional context to be used with
+ *     <OpenLayers.String.format>.
+ * 
+ * Returns:
+ * {String} A internationalized string.
+ */
+OpenLayers.i18n = OpenLayers.Lang.translate;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/SingleFile.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/SingleFile.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/SingleFile.js	(revision 76)
@@ -0,0 +1,10 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+var OpenLayers = {
+    singleFile: true
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style2.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style2.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style2.js	(revision 76)
@@ -0,0 +1,111 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Rule.js
+ * @requires OpenLayers/Symbolizer/Point.js
+ * @requires OpenLayers/Symbolizer/Line.js
+ * @requires OpenLayers/Symbolizer/Polygon.js
+ * @requires OpenLayers/Symbolizer/Text.js
+ * @requires OpenLayers/Symbolizer/Raster.js
+ */
+
+/**
+ * Class: OpenLayers.Style2
+ * This class represents a collection of rules for rendering features.
+ */
+OpenLayers.Style2 = OpenLayers.Class({
+
+    /**
+     * Property: id
+     * {String} A unique id for this session.
+     */
+    id: null,
+    
+    /**
+     * APIProperty: name
+     * {String} Style identifier.
+     */
+    name: null,
+    
+    /**
+     * APIProperty: title
+     * {String} Title of this style.
+     */
+    title: null,
+    
+    /**
+     * APIProperty: description
+     * {String} Description of this style.
+     */
+    description: null,
+
+    /**
+     * APIProperty: layerName
+     * {<String>} Name of the layer that this style belongs to, usually
+     *     according to the NamedLayer attribute of an SLD document.
+     */
+    layerName: null,
+    
+    /**
+     * APIProperty: isDefault
+     * {Boolean}
+     */
+    isDefault: false,
+     
+    /** 
+     * APIProperty: rules 
+     * {Array(<OpenLayers.Rule>)} Collection of rendering rules.
+     */
+    rules: null,
+    
+    /** 
+     * Constructor: OpenLayers.Style2
+     * Creates a style representing a collection of rendering rules.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     style.  Any documented properties may be set at construction.
+     *
+     * Return:
+     * {<OpenLayers.Style2>} A new style object.
+     */
+    initialize: function(config) {
+        OpenLayers.Util.extend(this, config);
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+    },
+
+    /** 
+     * APIMethod: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        for (var i=0, len=this.rules.length; i<len; i++) {
+            this.rules[i].destroy();
+        }
+        delete this.rules;
+    },
+
+    /**
+     * APIMethod: clone
+     * Clones this style.
+     * 
+     * Returns:
+     * {<OpenLayers.Style2>} Clone of this style.
+     */
+    clone: function() {
+        var config = OpenLayers.Util.extend({}, this);
+        // clone rules
+        if (this.rules) {
+            config.rules = [];
+            for (var i=0, len=this.rules.length; i<len; ++i) {
+                config.rules.push(this.rules[i].clone());
+            }
+        }
+        return new OpenLayers.Style2(config);
+    },
+    
+    CLASS_NAME: "OpenLayers.Style2"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image/IFrame.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image/IFrame.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image/IFrame.js	(revision 76)
@@ -0,0 +1,262 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Tile.Image.IFrame
+ * Instances of OpenLayers.Tile.Image.IFrame are used to manage the image tiles
+ * used by Layer.WMS.Post loaded via HTTP-POST-protocol. Create a new image
+ * tile with the <OpenLayers.Tile.Image.IFrame> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Tile.Image>
+ */
+OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
+    
+    /**
+     * Property: layerAlphaHack
+     * {Boolean} Always false for an instance.
+     */
+
+    /**
+     * Constructor: OpenLayers.Tile.Image.IFrame
+     * Constructor for a new <OpenLayers.Tile.Image.IFrame> instance.
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} layer that the tile will go in.
+     * position - {<OpenLayers.Pixel>}
+     * bounds - {<OpenLayers.Bounds>}
+     * size - {<OpenLayers.Size>}
+     */   
+    initialize: function(layer, position, bounds, url, size) {
+        OpenLayers.Tile.Image.prototype.initialize.apply(this, arguments);
+        this.layerAlphaHack = false;
+    },
+
+    /** 
+     * Method: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        if(this.imgDiv != null) {
+            // unregister the "load" handler
+            OpenLayers.Event.stopObservingElement(this.imgDiv.firstChild);
+        }
+        OpenLayers.Tile.Image.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: clear
+     * Removes the iframe from DOM (avoids back-button problems).
+     */
+    clear: function() {
+        if(this.imgDiv) {
+            var iFrame = this.imgDiv.firstChild;
+            OpenLayers.Event.stopObservingElement(iFrame);
+            this.imgDiv.removeChild(iFrame);
+        }
+    },
+
+    /**
+     * Method: clone
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Tile.Image.IFrame>} The tile to be cloned
+     *
+     * Returns:
+     * {<OpenLayers.Tile.Image.IFrame>} An exact clone of this 
+     * <OpenLayers.Tile.Image.IFrame>
+     */
+    clone: function (obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Tile.Image.IFrame(
+                this.layer, this.position, this.bounds, this.url, this.size);
+        } 
+        
+        //pick up properties from superclass
+        obj = OpenLayers.Tile.Image.prototype.clone.apply(this, [obj]);
+        
+        return obj;
+    },
+
+    /**
+     * Method: renderTile
+     */
+     renderTile: function() {
+        if(OpenLayers.Tile.Image.prototype.renderTile.apply(this, arguments)) {
+            // create a html form and add it temporary to the layer div
+            var form = this.createRequestForm();
+            this.imgDiv.appendChild(form);
+
+            // submit the form (means fetching the image)
+            form.submit();
+            this.imgDiv.removeChild(form);
+        }
+    },
+
+    /**
+     * Method: initImgDiv
+     * Creates the imgDiv property on the tile.
+     */
+    initImgDiv: function() {
+        this.imgDiv = this.createImgDiv();
+
+        OpenLayers.Util.modifyDOMElement(this.imgDiv, this.id, null,
+            this.layer.getImageSize(), "relative");
+        this.imgDiv.className = 'olTileImage';
+
+        this.frame.appendChild(this.imgDiv); 
+        this.layer.div.appendChild(this.frame); 
+
+        if(this.layer.opacity != null) {
+            
+            OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
+                                             null, null, null, 
+                                             this.layer.opacity);
+        }
+
+        // we need this reference to check back the viewRequestID
+        this.imgDiv.map = this.layer.map;
+    },
+
+    /**
+     * Method: createImgDiv
+     * Creates a div with iframe.and eventPane
+     *
+     * Returns:
+     * {DOMElement}
+     */
+    createImgDiv: function() {
+        var eventPane = document.createElement("div");
+
+        if(OpenLayers.Util.getBrowserName() == "msie") {
+            // IE cannot handle events on elements without backgroundcolor. So we
+            // use this little hack to make elements transparent
+            eventPane.style.backgroundColor = '#FFFFFF';
+            eventPane.style.filter          = 'chroma(color=#FFFFFF)';
+        }
+
+        OpenLayers.Util.modifyDOMElement(eventPane, null,
+            new OpenLayers.Pixel(0,0), this.layer.getImageSize(), "absolute");
+
+        var imgDiv = document.createElement("div");
+        imgDiv.appendChild(eventPane);
+        return imgDiv;
+    },
+
+    /**
+     * Method: createIFrame
+     * Create the IFrame which shows the image.
+     *
+     * Returns:
+     * {DOMElement} Iframe
+     */
+    createIFrame: function() {
+        var id = this.id+'_iFrame';
+        var iframe;
+        if(OpenLayers.Util.getBrowserName() == "msie") {
+            // InternetExplorer does not set the name attribute of an iFrame 
+            // properly via DOM manipulation, so we need to do it on our own with
+            // this hack.
+            iframe = document.createElement('<iframe name="'+id+'">');
+
+            // IFrames in InternetExplorer are not transparent, if you set the
+            // backgroundColor transparent. This is a workarround to get 
+            // transparent iframes.
+            iframe.style.backgroundColor = '#FFFFFF';
+            iframe.style.filter          = 'chroma(color=#FFFFFF)';
+        }
+        else {
+            iframe = document.createElement('iframe');
+            iframe.style.backgroundColor = 'transparent';
+        
+            // iframe.name needs to be an unique id, otherwise it 
+            // could happen that other iframes are overwritten.
+            iframe.name = id;
+        }
+        iframe.id = id;
+
+        // some special properties to avoid scaling the images and scrollbars 
+        // in the iframe
+        iframe.scrolling             = 'no';
+        iframe.marginWidth           = '0px';
+        iframe.marginHeight          = '0px';
+        iframe.frameBorder           = '0';
+
+        OpenLayers.Util.modifyDOMElement(iframe, id, 
+            new OpenLayers.Pixel(0,0), this.layer.getImageSize(), "absolute");
+
+        //bind a listener to the onload of the iframe so that we
+        // can register when a tile has finished loading.
+        var onload = function() {
+            this.show();
+            //normally isLoading should always be true here but there are some
+            // right funky conditions where loading and then reloading a tile
+            // with the same url *really*fast*. this check prevents sending
+            // a 'loadend' if the msg has already been sent
+            //
+            if (this.isLoading) {
+                this.isLoading = false;
+                this.events.triggerEvent("loadend");
+            }
+        };
+        OpenLayers.Event.observe(iframe, 'load',
+            OpenLayers.Function.bind(onload, this));
+
+        return iframe;
+    },
+    
+    /**
+     * Method: createRequestForm
+     * Create the html <form> element with width, height, bbox and all 
+     * parameters specified in the layer params.
+     *
+     * Returns: 
+     * {DOMElement} The form element which sends the HTTP-POST request to the
+     *              WMS. 
+     */
+    createRequestForm: function() {
+        // creation of the form element
+        var form = document.createElement('form');
+        form.method = 'POST';
+        var cacheId = this.layer.params["_OLSALT"];
+        cacheId = (cacheId ? cacheId + "_" : "") + this.bounds.toBBOX();
+        form.action = OpenLayers.Util.urlAppend(this.layer.url, cacheId);
+
+        // insert the iframe, which has been removed to avoid back-button
+        // problems
+        this.imgDiv.insertBefore(this.createIFrame(), this.imgDiv.firstChild);
+
+        form.target = this.id+'_iFrame';
+
+        // adding all parameters in layer params as hidden fields to the html
+        // form element
+        var imageSize = this.layer.getImageSize();
+        var params = OpenLayers.Util.extend(
+            {
+                "BBOX": this.encodeBBOX ? this.bounds.toBBOX() :
+                        this.bounds.toArray(),
+                "WIDTH": imageSize.w,
+                "HEIGHT": imageSize.h
+            }, this.layer.params);
+            
+        for(var par in params) {
+            var field = document.createElement('input');
+            field.type  = 'hidden';
+            field.name  = par;
+            field.value = params[par];
+            form.appendChild(field);
+        }   
+
+        return form;
+    },
+    
+    CLASS_NAME: "OpenLayers.Tile.Image.IFrame"
+  }
+);
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/WFS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/WFS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/WFS.js	(revision 76)
@@ -0,0 +1,192 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+ 
+/**
+ * @requires OpenLayers/Tile.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ */
+
+/**
+ * Class: OpenLayers.Tile.WFS
+ * Instances of OpenLayers.Tile.WFS are used to manage the image tiles
+ * used by various layers.  Create a new image tile with the
+ * <OpenLayers.Tile.WFS> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Tile>
+ */
+OpenLayers.Tile.WFS = OpenLayers.Class(OpenLayers.Tile, {
+
+    /** 
+     * Property: features 
+     * {Array(<OpenLayers.Feature>)} list of features in this tile 
+     */
+    features: null,
+
+    /** 
+     * Property: url 
+     * {String} 
+     */
+    url: null,
+    
+    /** 
+     * Property: request 
+     * {<OpenLayers.Request.XMLHttpRequest>} 
+     */ 
+    request: null,     
+    
+    /** TBD 3.0 - reorder the parameters to the init function to put URL 
+     *             as last, so we can continue to call tile.initialize() 
+     *             without changing the arguments. 
+     * 
+     * Constructor: OpenLayers.Tile.WFS
+     * Constructor for a new <OpenLayers.Tile.WFS> instance.
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} layer that the tile will go in.
+     * position - {<OpenLayers.Pixel>}
+     * bounds - {<OpenLayers.Bounds>}
+     * url - {<String>}
+     * size - {<OpenLayers.Size>}
+     */   
+    initialize: function(layer, position, bounds, url, size) {
+        OpenLayers.Tile.prototype.initialize.apply(this, arguments);
+        this.url = url;        
+        this.features = [];
+    },
+
+    /** 
+     * APIMethod: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        OpenLayers.Tile.prototype.destroy.apply(this, arguments);
+        this.destroyAllFeatures();
+        this.features = null;
+        this.url = null;
+        if(this.request) {
+            this.request.abort();
+            //this.request.destroy();
+            this.request = null;
+        }
+    },
+
+    /** 
+     * Method: clear
+     *  Clear the tile of any bounds/position-related data so that it can 
+     *   be reused in a new location.
+     */
+    clear: function() {
+        this.destroyAllFeatures();
+    },
+    
+    /**
+     * Method: draw
+     * Check that a tile should be drawn, and load features for it.
+     */
+    draw:function() {
+        if (OpenLayers.Tile.prototype.draw.apply(this, arguments)) {
+            if (this.isLoading) {
+                //if already loading, send 'reload' instead of 'loadstart'.
+                this.events.triggerEvent("reload"); 
+            } else {
+                this.isLoading = true;
+                this.events.triggerEvent("loadstart");
+            }
+            this.loadFeaturesForRegion(this.requestSuccess);
+        }
+    },
+
+    /** 
+    * Method: loadFeaturesForRegion
+    * Abort any pending requests and issue another request for data. 
+    *
+    * Input are function pointers for what to do on success and failure.
+    *
+    * Parameters:
+    * success - {function}
+    * failure - {function}
+    */
+    loadFeaturesForRegion:function(success, failure) {
+        if(this.request) {
+            this.request.abort();
+        }
+        this.request = OpenLayers.Request.GET({
+            url: this.url,
+            success: success,
+            failure: failure,
+            scope: this
+        });
+    },
+    
+    /**
+    * Method: requestSuccess
+    * Called on return from request succcess. Adds results via 
+    * layer.addFeatures in vector mode, addResults otherwise. 
+    *
+    * Parameters:
+    * request - {<OpenLayers.Request.XMLHttpRequest>}
+    */
+    requestSuccess:function(request) {
+        if (this.features) {
+            var doc = request.responseXML;
+            if (!doc || !doc.documentElement) {
+                doc = request.responseText; 
+            }
+            if (this.layer.vectorMode) {
+                this.layer.addFeatures(this.layer.formatObject.read(doc));
+            } else {
+                var xml = new OpenLayers.Format.XML();
+                if (typeof doc == "string") {
+                    doc = xml.read(doc);
+                }
+                var resultFeatures = xml.getElementsByTagNameNS(
+                    doc, "http://www.opengis.net/gml", "featureMember"
+                );
+                this.addResults(resultFeatures);
+            }
+        }
+        if (this.events) {
+            this.events.triggerEvent("loadend"); 
+        }
+
+        //request produced with success, we can delete the request object.
+        //this.request.destroy();
+        this.request = null;
+    },
+
+    /**
+     * Method: addResults
+     * Construct new feature via layer featureClass constructor, and add to
+     * this.features.
+     * 
+     * Parameters:
+     * results - {Object}
+     */
+    addResults: function(results) {
+        for (var i=0; i < results.length; i++) {
+            var feature = new this.layer.featureClass(this.layer, 
+                                                      results[i]);
+            this.features.push(feature);
+        }
+    },
+
+
+    /** 
+     * Method: destroyAllFeatures
+     * Iterate through and call destroy() on each feature, removing it from
+     *   the local array
+     */
+    destroyAllFeatures: function() {
+        while(this.features.length > 0) {
+            var feature = this.features.shift();
+            feature.destroy();
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Tile.WFS"
+  }
+);
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile/Image.js	(revision 76)
@@ -0,0 +1,578 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Tile.js
+ */
+
+/**
+ * Class: OpenLayers.Tile.Image
+ * Instances of OpenLayers.Tile.Image are used to manage the image tiles
+ * used by various layers.  Create a new image tile with the
+ * <OpenLayers.Tile.Image> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Tile>
+ */
+OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
+
+    /** 
+     * Property: url
+     * {String} The URL of the image being requested. No default. Filled in by
+     * layer.getURL() function. 
+     */
+    url: null,
+    
+    /** 
+     * Property: imgDiv
+     * {DOMElement} The div element which wraps the image.
+     */
+    imgDiv: null,
+
+    /**
+     * Property: frame
+     * {DOMElement} The image element is appended to the frame.  Any gutter on
+     * the image will be hidden behind the frame. 
+     */ 
+    frame: null, 
+    
+    /**
+     * Property: layerAlphaHack
+     * {Boolean} True if the png alpha hack needs to be applied on the layer's div.
+     */
+    layerAlphaHack: null,
+    
+    /**
+     * Property: isBackBuffer
+     * {Boolean} Is this tile a back buffer tile?
+     */
+    isBackBuffer: false,
+    
+    /**
+     * Property: lastRatio
+     * {Float} Used in transition code only.  This is the previous ratio
+     *     of the back buffer tile resolution to the map resolution.  Compared
+     *     with the current ratio to determine if zooming occurred.
+     */
+    lastRatio: 1,
+
+    /**
+     * Property: isFirstDraw
+     * {Boolean} Is this the first time the tile is being drawn?
+     *     This is used to force resetBackBuffer to synchronize
+     *     the backBufferTile with the foreground tile the first time
+     *     the foreground tile loads so that if the user zooms
+     *     before the layer has fully loaded, the backBufferTile for
+     *     tiles that have been loaded can be used.
+     */
+    isFirstDraw: true,
+        
+    /**
+     * Property: backBufferTile
+     * {<OpenLayers.Tile>} A clone of the tile used to create transition
+     *     effects when the tile is moved or changes resolution.
+     */
+    backBufferTile: null,
+
+    /** TBD 3.0 - reorder the parameters to the init function to remove 
+     *             URL. the getUrl() function on the layer gets called on 
+     *             each draw(), so no need to specify it here.
+     * 
+     * Constructor: OpenLayers.Tile.Image
+     * Constructor for a new <OpenLayers.Tile.Image> instance.
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} layer that the tile will go in.
+     * position - {<OpenLayers.Pixel>}
+     * bounds - {<OpenLayers.Bounds>}
+     * url - {<String>} Deprecated. Remove me in 3.0.
+     * size - {<OpenLayers.Size>}
+     */   
+    initialize: function(layer, position, bounds, url, size) {
+        OpenLayers.Tile.prototype.initialize.apply(this, arguments);
+
+        this.url = url; //deprecated remove me
+        
+        this.frame = document.createElement('div'); 
+        this.frame.style.overflow = 'hidden'; 
+        this.frame.style.position = 'absolute'; 
+
+        this.layerAlphaHack = this.layer.alpha && OpenLayers.Util.alphaHack();
+    },
+
+    /** 
+     * APIMethod: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        if (this.imgDiv != null)  {
+            if (this.layerAlphaHack) {
+                // unregister the "load" handler
+                OpenLayers.Event.stopObservingElement(this.imgDiv.childNodes[0]);                
+            }
+
+            // unregister the "load" and "error" handlers. Only the "error" handler if
+            // this.layerAlphaHack is true.
+            OpenLayers.Event.stopObservingElement(this.imgDiv);
+            
+            if (this.imgDiv.parentNode == this.frame) {
+                this.frame.removeChild(this.imgDiv);
+                this.imgDiv.map = null;
+            }
+            this.imgDiv.urls = null;
+            // abort any currently loading image
+            this.imgDiv.src = OpenLayers.Util.getImagesLocation() + "blank.gif";
+        }
+        this.imgDiv = null;
+        if ((this.frame != null) && (this.frame.parentNode == this.layer.div)) { 
+            this.layer.div.removeChild(this.frame); 
+        }
+        this.frame = null; 
+        
+        /* clean up the backBufferTile if it exists */
+        if (this.backBufferTile) {
+            this.backBufferTile.destroy();
+            this.backBufferTile = null;
+        }
+        
+        this.layer.events.unregister("loadend", this, this.resetBackBuffer);
+        
+        OpenLayers.Tile.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: clone
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Tile.Image>} The tile to be cloned
+     *
+     * Returns:
+     * {<OpenLayers.Tile.Image>} An exact clone of this <OpenLayers.Tile.Image>
+     */
+    clone: function (obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Tile.Image(this.layer, 
+                                            this.position, 
+                                            this.bounds, 
+                                            this.url, 
+                                            this.size);        
+        } 
+        
+        //pick up properties from superclass
+        obj = OpenLayers.Tile.prototype.clone.apply(this, [obj]);
+        
+        //dont want to directly copy the image div
+        obj.imgDiv = null;
+            
+        
+        return obj;
+    },
+    
+    /**
+     * Method: draw
+     * Check that a tile should be drawn, and draw it.
+     * 
+     * Returns:
+     * {Boolean} Always returns true.
+     */
+    draw: function() {
+        if (this.layer != this.layer.map.baseLayer && this.layer.reproject) {
+            this.bounds = this.getBoundsFromBaseLayer(this.position);
+        }
+        var drawTile = OpenLayers.Tile.prototype.draw.apply(this, arguments);
+        
+        if ((OpenLayers.Util.indexOf(this.layer.SUPPORTED_TRANSITIONS, this.layer.transitionEffect) != -1) || 
+            this.layer.singleTile) {
+            if (drawTile) {
+                //we use a clone of this tile to create a double buffer for visual
+                //continuity.  The backBufferTile is used to create transition
+                //effects while the tile in the grid is repositioned and redrawn
+                if (!this.backBufferTile) {
+                    this.backBufferTile = this.clone();
+                    this.backBufferTile.hide();
+                    // this is important.  It allows the backBuffer to place itself
+                    // appropriately in the DOM.  The Image subclass needs to put
+                    // the backBufferTile behind the main tile so the tiles can
+                    // load over top and display as soon as they are loaded.
+                    this.backBufferTile.isBackBuffer = true;
+                    
+                    // potentially end any transition effects when the tile loads
+                    this.events.register('loadend', this, this.resetBackBuffer);
+                    
+                    // clear transition back buffer tile only after all tiles in
+                    // this layer have loaded to avoid visual glitches
+                    this.layer.events.register("loadend", this, this.resetBackBuffer);
+                }
+                // run any transition effects
+                this.startTransition();
+            } else {
+                // if we aren't going to draw the tile, then the backBuffer should
+                // be hidden too!
+                if (this.backBufferTile) {
+                    this.backBufferTile.clear();
+                }
+            }
+        } else {
+            if (drawTile && this.isFirstDraw) {
+                this.events.register('loadend', this, this.showTile);
+                this.isFirstDraw = false;
+            }   
+        }    
+        
+        if (!drawTile) {
+            return false;
+        }
+        
+        if (this.isLoading) {
+            //if we're already loading, send 'reload' instead of 'loadstart'.
+            this.events.triggerEvent("reload"); 
+        } else {
+            this.isLoading = true;
+            this.events.triggerEvent("loadstart");
+        }
+        
+        return this.renderTile();
+    },
+    
+    /** 
+     * Method: resetBackBuffer
+     * Triggered by two different events, layer loadend, and tile loadend.
+     *     In any of these cases, we check to see if we can hide the 
+     *     backBufferTile yet and update its parameters to match the 
+     *     foreground tile.
+     *
+     * Basic logic:
+     *  - If the backBufferTile hasn't been drawn yet, reset it
+     *  - If layer is still loading, show foreground tile but don't hide
+     *    the backBufferTile yet
+     *  - If layer is done loading, reset backBuffer tile and show 
+     *    foreground tile
+     */
+    resetBackBuffer: function() {
+        this.showTile();
+        if (this.backBufferTile && 
+            (this.isFirstDraw || !this.layer.numLoadingTiles)) {
+            this.isFirstDraw = false;
+            // check to see if the backBufferTile is within the max extents
+            // before rendering it 
+            var maxExtent = this.layer.maxExtent;
+            var withinMaxExtent = (maxExtent &&
+                                   this.bounds.intersectsBounds(maxExtent, false));
+            if (withinMaxExtent) {
+                this.backBufferTile.position = this.position;
+                this.backBufferTile.bounds = this.bounds;
+                this.backBufferTile.size = this.size;
+                this.backBufferTile.imageSize = this.layer.getImageSize(this.bounds) || this.size;
+                this.backBufferTile.imageOffset = this.layer.imageOffset;
+                this.backBufferTile.resolution = this.layer.getResolution();
+                this.backBufferTile.renderTile();
+            }
+
+            this.backBufferTile.hide();
+        }
+    },
+    
+    /**
+     * Method: renderTile
+     * Internal function to actually initialize the image tile,
+     *     position it correctly, and set its url.
+     */
+    renderTile: function() {
+        if (this.imgDiv == null) {
+            this.initImgDiv();
+        }
+
+        this.imgDiv.viewRequestID = this.layer.map.viewRequestID;
+        
+        if (this.layer.async) {
+            // Asyncronous image requests call the asynchronous getURL method
+            // on the layer to fetch an image that covers 'this.bounds', in the scope of
+            // 'this', setting the 'url' property of the layer itself, and running
+            // the callback 'positionFrame' when the image request returns.
+            this.layer.getURLasync(this.bounds, this, "url", this.positionImage);
+        } else {
+            // syncronous image requests get the url and position the frame immediately,
+            // and don't wait for an image request to come back.
+          
+            // needed for changing to a different server for onload error
+            if (this.layer.url instanceof Array) {
+                this.imgDiv.urls = this.layer.url.slice();
+            }
+          
+            this.url = this.layer.getURL(this.bounds);
+          
+            // position the frame immediately
+            this.positionImage(); 
+        }
+        return true;
+    },
+
+    /**
+     * Method: positionImage
+     * Using the properties currenty set on the layer, position the tile correctly.
+     * This method is used both by the async and non-async versions of the Tile.Image
+     * code.
+     */
+     positionImage: function() {
+        // if the this layer doesn't exist at the point the image is
+        // returned, do not attempt to use it for size computation
+        if (this.layer === null) {
+            return;
+        }
+        // position the frame 
+        OpenLayers.Util.modifyDOMElement(this.frame, 
+                                          null, this.position, this.size);   
+
+        var imageSize = this.layer.getImageSize(this.bounds); 
+        if (this.layerAlphaHack) {
+            OpenLayers.Util.modifyAlphaImageDiv(this.imgDiv,
+                    null, null, imageSize, this.url);
+        } else {
+            OpenLayers.Util.modifyDOMElement(this.imgDiv,
+                    null, null, imageSize) ;
+            this.imgDiv.src = this.url;
+        }
+    },
+
+    /** 
+     * Method: clear
+     *  Clear the tile of any bounds/position-related data so that it can 
+     *   be reused in a new location.
+     */
+    clear: function() {
+        if(this.imgDiv) {
+            this.hide();
+            if (OpenLayers.Tile.Image.useBlankTile) { 
+                this.imgDiv.src = OpenLayers.Util.getImagesLocation() + "blank.gif";
+            }    
+        }
+    },
+
+    /**
+     * Method: initImgDiv
+     * Creates the imgDiv property on the tile.
+     */
+    initImgDiv: function() {
+        
+        var offset = this.layer.imageOffset; 
+        var size = this.layer.getImageSize(this.bounds); 
+     
+        if (this.layerAlphaHack) {
+            this.imgDiv = OpenLayers.Util.createAlphaImageDiv(null,
+                                                           offset,
+                                                           size,
+                                                           null,
+                                                           "relative",
+                                                           null,
+                                                           null,
+                                                           null,
+                                                           true);
+        } else {
+            this.imgDiv = OpenLayers.Util.createImage(null,
+                                                      offset,
+                                                      size,
+                                                      null,
+                                                      "relative",
+                                                      null,
+                                                      null,
+                                                      true);
+        }
+        
+        this.imgDiv.className = 'olTileImage';
+
+        /* checkImgURL used to be used to called as a work around, but it
+           ended up hiding problems instead of solving them and broke things
+           like relative URLs. See discussion on the dev list:
+           http://openlayers.org/pipermail/dev/2007-January/000205.html
+
+        OpenLayers.Event.observe( this.imgDiv, "load",
+            OpenLayers.Function.bind(this.checkImgURL, this) );
+        */
+        this.frame.style.zIndex = this.isBackBuffer ? 0 : 1;
+        this.frame.appendChild(this.imgDiv); 
+        this.layer.div.appendChild(this.frame); 
+
+        if(this.layer.opacity != null) {
+            
+            OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
+                                             null, null, null, 
+                                             this.layer.opacity);
+        }
+
+        // we need this reference to check back the viewRequestID
+        this.imgDiv.map = this.layer.map;
+
+        //bind a listener to the onload of the image div so that we 
+        // can register when a tile has finished loading.
+        var onload = function() {
+            
+            //normally isLoading should always be true here but there are some 
+            // right funky conditions where loading and then reloading a tile
+            // with the same url *really*fast*. this check prevents sending 
+            // a 'loadend' if the msg has already been sent
+            //
+            if (this.isLoading) { 
+                this.isLoading = false; 
+                this.events.triggerEvent("loadend"); 
+            }
+        };
+        
+        if (this.layerAlphaHack) { 
+            OpenLayers.Event.observe(this.imgDiv.childNodes[0], 'load', 
+                                     OpenLayers.Function.bind(onload, this));    
+        } else { 
+            OpenLayers.Event.observe(this.imgDiv, 'load', 
+                                 OpenLayers.Function.bind(onload, this)); 
+        } 
+        
+
+        // Bind a listener to the onerror of the image div so that we
+        // can registere when a tile has finished loading with errors.
+        var onerror = function() {
+
+            // If we have gone through all image reload attempts, it is time
+            // to realize that we are done with this image. Since
+            // OpenLayers.Util.onImageLoadError already has taken care about
+            // the error, we can continue as if the image was loaded
+            // successfully.
+            if (this.imgDiv._attempts > OpenLayers.IMAGE_RELOAD_ATTEMPTS) {
+                onload.call(this);
+            }
+        };
+        OpenLayers.Event.observe(this.imgDiv, "error",
+                                 OpenLayers.Function.bind(onerror, this));
+    },
+
+    /**
+     * Method: checkImgURL
+     * Make sure that the image that just loaded is the one this tile is meant
+     * to display, since panning/zooming might have changed the tile's URL in
+     * the meantime. If the tile URL did change before the image loaded, set
+     * the imgDiv display to 'none', as either (a) it will be reset to visible
+     * when the new URL loads in the image, or (b) we don't want to display
+     * this tile after all because its new bounds are outside our maxExtent.
+     * 
+     * This function should no longer  be neccesary with the improvements to
+     * Grid.js in OpenLayers 2.3. The lack of a good isEquivilantURL function
+     * caused problems in 2.2, but it's possible that with the improved 
+     * isEquivilant URL function, this might be neccesary at some point.
+     * 
+     * See discussion in the thread at 
+     * http://openlayers.org/pipermail/dev/2007-January/000205.html
+     */
+    checkImgURL: function () {
+        // Sometimes our image will load after it has already been removed
+        // from the map, in which case this check is not needed.  
+        if (this.layer) {
+            var loaded = this.layerAlphaHack ? this.imgDiv.firstChild.src : this.imgDiv.src;
+            if (!OpenLayers.Util.isEquivalentUrl(loaded, this.url)) {
+                this.hide();
+            }
+        }
+    },
+    
+    /**
+     * Method: startTransition
+     * This method is invoked on tiles that are backBuffers for tiles in the
+     *     grid.  The grid tile is about to be cleared and a new tile source
+     *     loaded.  This is where the transition effect needs to be started
+     *     to provide visual continuity.
+     */
+    startTransition: function() {
+        // backBufferTile has to be valid and ready to use
+        if (!this.backBufferTile || !this.backBufferTile.imgDiv) {
+            return;
+        }
+
+        // calculate the ratio of change between the current resolution of the
+        // backBufferTile and the layer.  If several animations happen in a
+        // row, then the backBufferTile will scale itself appropriately for
+        // each request.
+        var ratio = 1;
+        if (this.backBufferTile.resolution) {
+            ratio = this.backBufferTile.resolution / this.layer.getResolution();
+        }
+        
+        // if the ratio is not the same as it was last time (i.e. we are
+        // zooming), then we need to adjust the backBuffer tile
+        if (ratio != this.lastRatio) {
+            if (this.layer.transitionEffect == 'resize') {
+                // In this case, we can just immediately resize the 
+                // backBufferTile.
+                var upperLeft = new OpenLayers.LonLat(
+                    this.backBufferTile.bounds.left, 
+                    this.backBufferTile.bounds.top
+                );
+                var size = new OpenLayers.Size(
+                    this.backBufferTile.size.w * ratio,
+                    this.backBufferTile.size.h * ratio
+                );
+
+                var px = this.layer.map.getLayerPxFromLonLat(upperLeft);
+                OpenLayers.Util.modifyDOMElement(this.backBufferTile.frame, 
+                                                 null, px, size);
+                var imageSize = this.backBufferTile.imageSize;
+                imageSize = new OpenLayers.Size(imageSize.w * ratio, 
+                                                imageSize.h * ratio);
+                var imageOffset = this.backBufferTile.imageOffset;
+                if(imageOffset) {
+                    imageOffset = new OpenLayers.Pixel(
+                        imageOffset.x * ratio, imageOffset.y * ratio
+                    );
+                }
+
+                OpenLayers.Util.modifyDOMElement(
+                    this.backBufferTile.imgDiv, null, imageOffset, imageSize
+                ) ;
+
+                this.backBufferTile.show();
+            }
+        } else {
+            // default effect is just to leave the existing tile
+            // until the new one loads if this is a singleTile and
+            // there was no change in resolution.  Otherwise we
+            // don't bother to show the backBufferTile at all
+            if (this.layer.singleTile) {
+                this.backBufferTile.show();
+            } else {
+                this.backBufferTile.hide();
+            }
+        }
+        this.lastRatio = ratio;
+
+    },
+    
+    /** 
+     * Method: show
+     * Show the tile by showing its frame.
+     */
+    show: function() {
+        this.frame.style.display = '';
+        // Force a reflow on gecko based browsers to actually show the element
+        // before continuing execution.
+        if (OpenLayers.Util.indexOf(this.layer.SUPPORTED_TRANSITIONS, 
+                this.layer.transitionEffect) != -1) {
+            if (navigator.userAgent.toLowerCase().indexOf("gecko") != -1) { 
+                this.frame.scrollLeft = this.frame.scrollLeft; 
+            } 
+        }
+    },
+    
+    /** 
+     * Method: hide
+     * Hide the tile by hiding its frame.
+     */
+    hide: function() {
+        this.frame.style.display = 'none';
+    },
+    
+    CLASS_NAME: "OpenLayers.Tile.Image"
+  }
+);
+
+OpenLayers.Tile.Image.useBlankTile = ( 
+    OpenLayers.Util.getBrowserName() == "safari" || 
+    OpenLayers.Util.getBrowserName() == "opera"); 
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Ajax.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Ajax.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Ajax.js	(revision 76)
@@ -0,0 +1,678 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ * @requires OpenLayers/Console.js
+ */
+
+OpenLayers.ProxyHost = "";
+//OpenLayers.ProxyHost = "examples/proxy.cgi?url=";
+
+/**
+ * Ajax reader for OpenLayers
+ *
+ *  @uri url to do remote XML http get
+ *  @param {String} 'get' format params (x=y&a=b...)
+ *  @who object to handle callbacks for this request
+ *  @complete  the function to be called on success 
+ *  @failure  the function to be called on failure
+ *  
+ *   example usage from a caller:
+ *  
+ *     caps: function(request) {
+ *      -blah-  
+ *     },
+ *  
+ *     OpenLayers.loadURL(url,params,this,caps);
+ *
+ * Notice the above example does not provide an error handler; a default empty
+ * handler is provided which merely logs the error if a failure handler is not 
+ * supplied
+ *
+ */
+
+
+/**
+ * Function: OpenLayers.nullHandler
+ * @param {} request
+ */
+OpenLayers.nullHandler = function(request) {
+    OpenLayers.Console.userError(OpenLayers.i18n("unhandledRequest", {'statusText':request.statusText}));
+};
+
+/** 
+ * APIFunction: OpenLayers.loadURL
+ * Background load a document.  For more flexibility in using XMLHttpRequest,
+ *     see the <OpenLayers.Request> methods.
+ *
+ * Parameters:
+ * uri - {String} URI of source doc
+ * params - {String} or {Object} GET params. Either a string in the form
+ *     "?hello=world&foo=bar" (do not forget the leading question mark)
+ *     or an object in the form {'hello': 'world', 'foo': 'bar}
+ * caller - {Object} object which gets callbacks
+ * onComplete - {Function} Optional callback for success.  The callback
+ *     will be called with this set to caller and will receive the request
+ *     object as an argument.  Note that if you do not specify an onComplete
+ *     function, <OpenLayers.nullHandler> will be called (which pops up a 
+ *     user friendly error message dialog).
+ * onFailure - {Function} Optional callback for failure.  In the event of
+ *     a failure, the callback will be called with this set to caller and will
+ *     receive the request object as an argument.  Note that if you do not
+ *     specify an onComplete function, <OpenLayers.nullHandler> will be called
+ *     (which pops up a user friendly error message dialog).
+ *
+ * Returns:
+ * {<OpenLayers.Request.XMLHttpRequest>}  The request object. To abort loading,
+ *     call request.abort().
+ */
+OpenLayers.loadURL = function(uri, params, caller,
+                                  onComplete, onFailure) {
+    
+    if(typeof params == 'string') {
+        params = OpenLayers.Util.getParameters(params);
+    }
+    var success = (onComplete) ? onComplete : OpenLayers.nullHandler;
+    var failure = (onFailure) ? onFailure : OpenLayers.nullHandler;
+    
+    return OpenLayers.Request.GET({
+        url: uri, params: params,
+        success: success, failure: failure, scope: caller
+    });
+};
+
+/** 
+ * Function: OpenLayers.parseXMLString
+ * Parse XML into a doc structure
+ * 
+ * Parameters:
+ * text - {String} 
+ * 
+ * Returns:
+ * {?} Parsed AJAX Responsev
+ */
+OpenLayers.parseXMLString = function(text) {
+
+    //MS sucks, if the server is bad it dies
+    var index = text.indexOf('<');
+    if (index > 0) {
+        text = text.substring(index);
+    }
+
+    var ajaxResponse = OpenLayers.Util.Try(
+        function() {
+            var xmldom = new ActiveXObject('Microsoft.XMLDOM');
+            xmldom.loadXML(text);
+            return xmldom;
+        },
+        function() {
+            return new DOMParser().parseFromString(text, 'text/xml');
+        },
+        function() {
+            var req = new XMLHttpRequest();
+            req.open("GET", "data:" + "text/xml" +
+                     ";charset=utf-8," + encodeURIComponent(text), false);
+            if (req.overrideMimeType) {
+                req.overrideMimeType("text/xml");
+            }
+            req.send(null);
+            return req.responseXML;
+        }
+    );
+
+    return ajaxResponse;
+};
+
+
+/**
+ * Namespace: OpenLayers.Ajax
+ */
+OpenLayers.Ajax = {
+
+    /**
+     * Method: emptyFunction
+     */
+    emptyFunction: function () {},
+
+    /**
+     * Method: getTransport
+     * 
+     * Returns: 
+     * {Object} Transport mechanism for whichever browser we're in, or false if
+     *          none available.
+     */
+    getTransport: function() {
+        return OpenLayers.Util.Try(
+            function() {return new XMLHttpRequest();},
+            function() {return new ActiveXObject('Msxml2.XMLHTTP');},
+            function() {return new ActiveXObject('Microsoft.XMLHTTP');}
+        ) || false;
+    },
+
+    /**
+     * Property: activeRequestCount
+     * {Integer}
+     */
+    activeRequestCount: 0
+};
+
+/**
+ * Namespace: OpenLayers.Ajax.Responders
+ * {Object}
+ */
+OpenLayers.Ajax.Responders = {
+  
+    /**
+     * Property: responders
+     * {Array}
+     */
+    responders: [],
+
+    /**
+     * Method: register
+     *  
+     * Parameters:
+     * responderToAdd - {?}
+     */
+    register: function(responderToAdd) {
+        for (var i = 0; i < this.responders.length; i++){
+            if (responderToAdd == this.responders[i]){
+                return;
+            }
+        }
+        this.responders.push(responderToAdd);
+    },
+
+    /**
+     * Method: unregister
+     *  
+     * Parameters:
+     * responderToRemove - {?}
+     */
+    unregister: function(responderToRemove) {
+        OpenLayers.Util.removeItem(this.reponders, responderToRemove);
+    },
+
+    /**
+     * Method: dispatch
+     * 
+     * Parameters:
+     * callback - {?}
+     * request - {?}
+     * transport - {?}
+     */
+    dispatch: function(callback, request, transport) {
+        var responder;
+        for (var i = 0; i < this.responders.length; i++) {
+            responder = this.responders[i];
+     
+            if (responder[callback] && 
+                typeof responder[callback] == 'function') {
+                try {
+                    responder[callback].apply(responder, 
+                                              [request, transport]);
+                } catch (e) {}
+            }
+        }
+    }
+};
+
+OpenLayers.Ajax.Responders.register({
+    /** 
+     * Function: onCreate
+     */
+    onCreate: function() {
+        OpenLayers.Ajax.activeRequestCount++;
+    },
+
+    /**
+     * Function: onComplete
+     */
+     onComplete: function() {
+         OpenLayers.Ajax.activeRequestCount--;
+     }
+});
+
+/**
+ * Class: OpenLayers.Ajax.Base
+ */
+OpenLayers.Ajax.Base = OpenLayers.Class({
+      
+    /**
+     * Constructor: OpenLayers.Ajax.Base
+     * 
+     * Parameters: 
+     * options - {Object}
+     */
+    initialize: function(options) {
+        this.options = {
+            method:       'post',
+            asynchronous: true,
+            contentType:  'application/xml',
+            parameters:   ''
+        };
+        OpenLayers.Util.extend(this.options, options || {});
+        
+        this.options.method = this.options.method.toLowerCase();
+        
+        if (typeof this.options.parameters == 'string') {
+            this.options.parameters = 
+                OpenLayers.Util.getParameters(this.options.parameters);
+        }
+    }
+});
+
+/**
+ * Class: OpenLayers.Ajax.Request
+ * *Deprecated*.  Use <OpenLayers.Request> method instead.
+ *
+ * Inherit:
+ *  - <OpenLayers.Ajax.Base>
+ */
+OpenLayers.Ajax.Request = OpenLayers.Class(OpenLayers.Ajax.Base, {
+
+    /**
+     * Property: _complete
+     *
+     * {Boolean}
+     */
+    _complete: false,
+      
+    /**
+     * Constructor: OpenLayers.Ajax.Request
+     * 
+     * Parameters: 
+     * url - {String}
+     * options - {Object}
+     */
+    initialize: function(url, options) {
+        OpenLayers.Ajax.Base.prototype.initialize.apply(this, [options]);
+        
+        if (OpenLayers.ProxyHost && OpenLayers.String.startsWith(url, "http")) {
+            url = OpenLayers.ProxyHost + encodeURIComponent(url);
+        }
+        
+        this.transport = OpenLayers.Ajax.getTransport();
+        this.request(url);
+    },
+
+    /**
+     * Method: request
+     * 
+     * Parameters:
+     * url - {String}
+     */
+    request: function(url) {
+        this.url = url;
+        this.method = this.options.method;
+        var params = OpenLayers.Util.extend({}, this.options.parameters);
+        
+        if (this.method != 'get' && this.method != 'post') {
+            // simulate other verbs over post
+            params['_method'] = this.method;
+            this.method = 'post';
+        }
+
+        this.parameters = params;        
+        
+        if (params = OpenLayers.Util.getParameterString(params)) {
+            // when GET, append parameters to URL
+            if (this.method == 'get') {
+                this.url += ((this.url.indexOf('?') > -1) ? '&' : '?') + params;
+            } else if (/Konqueror|Safari|KHTML/.test(navigator.userAgent)) {
+                params += '&_=';
+            }
+        }
+        try {
+            var response = new OpenLayers.Ajax.Response(this);
+            if (this.options.onCreate) {
+                this.options.onCreate(response);
+            }
+            
+            OpenLayers.Ajax.Responders.dispatch('onCreate', 
+                                                this, 
+                                                response);
+    
+            this.transport.open(this.method.toUpperCase(), 
+                                this.url,
+                                this.options.asynchronous);
+    
+            if (this.options.asynchronous) {
+                window.setTimeout(
+                    OpenLayers.Function.bind(this.respondToReadyState, this, 1),
+                    10);
+            }
+            
+            this.transport.onreadystatechange = 
+                OpenLayers.Function.bind(this.onStateChange, this);    
+            this.setRequestHeaders();
+    
+            this.body =  this.method == 'post' ?
+                (this.options.postBody || params) : null;
+            this.transport.send(this.body);
+    
+            // Force Firefox to handle ready state 4 for synchronous requests
+            if (!this.options.asynchronous && 
+                this.transport.overrideMimeType) {
+                this.onStateChange();
+            }
+        } catch (e) {
+            this.dispatchException(e);
+        }
+    },
+
+    /**
+     * Method: onStateChange
+     */
+    onStateChange: function() {
+        var readyState = this.transport.readyState;
+        if (readyState > 1 && !((readyState == 4) && this._complete)) {
+            this.respondToReadyState(this.transport.readyState);
+        }
+    },
+     
+    /**
+     * Method: setRequestHeaders
+     */
+    setRequestHeaders: function() {
+        var headers = {
+            'X-Requested-With': 'XMLHttpRequest',
+            'Accept': 'text/javascript, text/html, application/xml, text/xml, */*',
+            'OpenLayers': true
+        };
+
+        if (this.method == 'post') {
+            headers['Content-type'] = this.options.contentType +
+                (this.options.encoding ? '; charset=' + this.options.encoding : '');
+    
+            /* Force "Connection: close" for older Mozilla browsers to work
+             * around a bug where XMLHttpRequest sends an incorrect
+             * Content-length header. See Mozilla Bugzilla #246651.
+             */
+            if (this.transport.overrideMimeType &&
+                (navigator.userAgent.match(/Gecko\/(\d{4})/) || [0,2005])[1] < 2005) {
+                headers['Connection'] = 'close';
+            }
+        }
+        // user-defined headers
+        if (typeof this.options.requestHeaders == 'object') {    
+            var extras = this.options.requestHeaders;
+            
+            if (typeof extras.push == 'function') {
+                for (var i = 0, length = extras.length; i < length; i += 2) {
+                    headers[extras[i]] = extras[i+1];
+                }
+            } else {
+                for (var i in extras) {
+                    headers[i] = extras[i];
+                }
+            }
+        }
+        
+        for (var name in headers) {
+            this.transport.setRequestHeader(name, headers[name]);
+        }
+    },
+    
+    /**
+     * Method: success
+     *
+     * Returns:
+     * {Boolean} - 
+     */
+    success: function() {
+        var status = this.getStatus();
+        return !status || (status >=200 && status < 300);
+    },
+    
+    /**
+     * Method: getStatus
+     *
+     * Returns:
+     * {Integer} - Status
+     */
+    getStatus: function() {
+        try {
+            return this.transport.status || 0;
+        } catch (e) {
+            return 0;
+        }
+    },
+
+    /**
+     * Method: respondToReadyState
+     *
+     * Parameters:
+     * readyState - {?}
+     */
+    respondToReadyState: function(readyState) {
+        var state = OpenLayers.Ajax.Request.Events[readyState];
+        var response = new OpenLayers.Ajax.Response(this);
+    
+        if (state == 'Complete') {
+            try {
+                this._complete = true;
+                (this.options['on' + response.status] ||
+                    this.options['on' + (this.success() ? 'Success' : 'Failure')] ||
+                    OpenLayers.Ajax.emptyFunction)(response);
+            } catch (e) {
+                this.dispatchException(e);
+            }
+    
+            var contentType = response.getHeader('Content-type');
+        }
+    
+        try {
+            (this.options['on' + state] || 
+             OpenLayers.Ajax.emptyFunction)(response);
+             OpenLayers.Ajax.Responders.dispatch('on' + state, 
+                                                 this, 
+                                                 response);
+        } catch (e) {
+            this.dispatchException(e);
+        }
+    
+        if (state == 'Complete') {
+            // avoid memory leak in MSIE: clean up
+            this.transport.onreadystatechange = OpenLayers.Ajax.emptyFunction;
+        }
+    },
+    
+    /**
+     * Method: getHeader
+     * 
+     * Parameters:
+     * name - {String} Header name
+     *
+     * Returns:
+     * {?} - response header for the given name
+     */
+    getHeader: function(name) {
+        try {
+            return this.transport.getResponseHeader(name);
+        } catch (e) {
+            return null;
+        }
+    },
+
+    /**
+     * Method: dispatchException
+     * If the optional onException function is set, execute it
+     * and then dispatch the call to any other listener registered
+     * for onException.
+     * 
+     * If no optional onException function is set, we suspect that
+     * the user may have also not used
+     * OpenLayers.Ajax.Responders.register to register a listener
+     * for the onException call.  To make sure that something
+     * gets done with this exception, only dispatch the call if there
+     * are listeners.
+     *
+     * If you explicitly want to swallow exceptions, set
+     * request.options.onException to an empty function (function(){})
+     * or register an empty function with <OpenLayers.Ajax.Responders>
+     * for onException.
+     * 
+     * Parameters:
+     * exception - {?}
+     */
+    dispatchException: function(exception) {
+        var handler = this.options.onException;
+        if(handler) {
+            // call options.onException and alert any other listeners
+            handler(this, exception);
+            OpenLayers.Ajax.Responders.dispatch('onException', this, exception);
+        } else {
+            // check if there are any other listeners
+            var listener = false;
+            var responders = OpenLayers.Ajax.Responders.responders;
+            for (var i = 0; i < responders.length; i++) {
+                if(responders[i].onException) {
+                    listener = true;
+                    break;
+                }
+            }
+            if(listener) {
+                // call all listeners
+                OpenLayers.Ajax.Responders.dispatch('onException', this, exception);
+            } else {
+                // let the exception through
+                throw exception;
+            }
+        }
+    }
+});
+
+/** 
+ * Property: Events
+ * {Array(String)}
+ */
+OpenLayers.Ajax.Request.Events =
+  ['Uninitialized', 'Loading', 'Loaded', 'Interactive', 'Complete'];
+
+/**
+ * Class: OpenLayers.Ajax.Response
+ */
+OpenLayers.Ajax.Response = OpenLayers.Class({
+
+    /**
+     * Property: status
+     *
+     * {Integer}
+     */
+    status: 0,
+    
+
+    /**
+     * Property: statusText
+     *
+     * {String}
+     */
+    statusText: '',
+      
+    /**
+     * Constructor: OpenLayers.Ajax.Response
+     * 
+     * Parameters: 
+     * request - {Object}
+     */
+    initialize: function(request) {
+        this.request = request;
+        var transport = this.transport = request.transport,
+            readyState = this.readyState = transport.readyState;
+        
+        if ((readyState > 2 &&
+            !(!!(window.attachEvent && !window.opera))) ||
+            readyState == 4) {
+            this.status       = this.getStatus();
+            this.statusText   = this.getStatusText();
+            this.responseText = transport.responseText == null ?
+                '' : String(transport.responseText);
+        }
+        
+        if(readyState == 4) {
+            var xml = transport.responseXML;
+            this.responseXML  = xml === undefined ? null : xml;
+        }
+    },
+    
+    /**
+     * Method: getStatus
+     */
+    getStatus: OpenLayers.Ajax.Request.prototype.getStatus,
+    
+    /**
+     * Method: getStatustext
+     *
+     * Returns:
+     * {String} - statusText
+     */
+    getStatusText: function() {
+        try {
+            return this.transport.statusText || '';
+        } catch (e) {
+            return '';
+        }
+    },
+    
+    /**
+     * Method: getHeader
+     */
+    getHeader: OpenLayers.Ajax.Request.prototype.getHeader,
+    
+    /** 
+     * Method: getResponseHeader
+     *
+     * Returns:
+     * {?} - response header for given name
+     */
+    getResponseHeader: function(name) {
+        return this.transport.getResponseHeader(name);
+    }
+});
+
+
+/**
+ * Function: getElementsByTagNameNS
+ * 
+ * Parameters:
+ * parentnode - {?}
+ * nsuri - {?}
+ * nsprefix - {?}
+ * tagname - {?}
+ * 
+ * Returns:
+ * {?}
+ */
+OpenLayers.Ajax.getElementsByTagNameNS  = function(parentnode, nsuri, 
+                                                   nsprefix, tagname) {
+    var elem = null;
+    if (parentnode.getElementsByTagNameNS) {
+        elem = parentnode.getElementsByTagNameNS(nsuri, tagname);
+    } else {
+        elem = parentnode.getElementsByTagName(nsprefix + ':' + tagname);
+    }
+    return elem;
+};
+
+
+/**
+ * Function: serializeXMLToString
+ * Wrapper function around XMLSerializer, which doesn't exist/work in
+ *     IE/Safari. We need to come up with a way to serialize in those browser:
+ *     for now, these browsers will just fail. #535, #536
+ *
+ * Parameters: 
+ * xmldom {XMLNode} xml dom to serialize
+ * 
+ * Returns:
+ * {?}
+ */
+OpenLayers.Ajax.serializeXMLToString = function(xmldom) {
+    var serializer = new XMLSerializer();
+    var data = serializer.serializeToString(xmldom);
+    return data;
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Class.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Class.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Class.js	(revision 76)
@@ -0,0 +1,116 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Constructor: OpenLayers.Class
+ * Base class used to construct all other classes. Includes support for 
+ *     multiple inheritance. 
+ *     
+ * This constructor is new in OpenLayers 2.5.  At OpenLayers 3.0, the old 
+ *     syntax for creating classes and dealing with inheritance 
+ *     will be removed.
+ * 
+ * To create a new OpenLayers-style class, use the following syntax:
+ * > var MyClass = OpenLayers.Class(prototype);
+ *
+ * To create a new OpenLayers-style class with multiple inheritance, use the
+ *     following syntax:
+ * > var MyClass = OpenLayers.Class(Class1, Class2, prototype);
+ * Note that instanceof reflection will only reveil Class1 as superclass.
+ * Class2 ff are mixins.
+ *
+ */
+OpenLayers.Class = function() {
+    var Class = function() {
+        /**
+         * This following condition can be removed at 3.0 - this is only for
+         * backwards compatibility while the Class.inherit method is still
+         * in use.  So at 3.0, the following three lines would be replaced with
+         * simply:
+         * this.initialize.apply(this, arguments);
+         */
+        if (arguments && arguments[0] != OpenLayers.Class.isPrototype) {
+            this.initialize.apply(this, arguments);
+        }
+    };
+    var extended = {};
+    var parent, initialize, Type;
+    for(var i=0, len=arguments.length; i<len; ++i) {
+        Type = arguments[i];
+        if(typeof Type == "function") {
+            // make the class passed as the first argument the superclass
+            if(i == 0 && len > 1) {
+                initialize = Type.prototype.initialize;
+                // replace the initialize method with an empty function,
+                // because we do not want to create a real instance here
+                Type.prototype.initialize = function() {};
+                // the line below makes sure that the new class has a
+                // superclass
+                extended = new Type();
+                // restore the original initialize method
+                if(initialize === undefined) {
+                    delete Type.prototype.initialize;
+                } else {
+                    Type.prototype.initialize = initialize;
+                }
+            }
+            // get the prototype of the superclass
+            parent = Type.prototype;
+        } else {
+            // in this case we're extending with the prototype
+            parent = Type;
+        }
+        OpenLayers.Util.extend(extended, parent);
+    }
+    Class.prototype = extended;
+    return Class;
+};
+
+/**
+ * Property: isPrototype
+ * *Deprecated*.  This is no longer needed and will be removed at 3.0.
+ */
+OpenLayers.Class.isPrototype = function () {};
+
+/**
+ * APIFunction: OpenLayers.create
+ * *Deprecated*.  Old method to create an OpenLayers style class.  Use the
+ *     <OpenLayers.Class> constructor instead.
+ *
+ * Returns:
+ * An OpenLayers class
+ */
+OpenLayers.Class.create = function() {
+    return function() {
+        if (arguments && arguments[0] != OpenLayers.Class.isPrototype) {
+            this.initialize.apply(this, arguments);
+        }
+    };
+};
+
+
+/**
+ * APIFunction: inherit
+ * *Deprecated*.  Old method to inherit from one or more OpenLayers style
+ *     classes.  Use the <OpenLayers.Class> constructor instead.
+ *
+ * Parameters:
+ * class - One or more classes can be provided as arguments
+ *
+ * Returns:
+ * An object prototype
+ */
+OpenLayers.Class.inherit = function () {
+    var superClass = arguments[0];
+    var proto = new superClass(OpenLayers.Class.isPrototype);
+    for (var i=1, len=arguments.length; i<len; i++) {
+        if (typeof arguments[i] == "function") {
+            var mixin = arguments[i];
+            arguments[i] = new mixin(OpenLayers.Class.isPrototype);
+        }
+        OpenLayers.Util.extend(proto, arguments[i]);
+    }
+    return proto;
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Element.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Element.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Element.js	(revision 76)
@@ -0,0 +1,251 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Namespace: OpenLayers.Element
+ */
+OpenLayers.Element = {
+
+    /**
+     * APIFunction: visible
+     * 
+     * Parameters: 
+     * element - {DOMElement}
+     * 
+     * Returns:
+     * {Boolean} Is the element visible?
+     */
+    visible: function(element) {
+        return OpenLayers.Util.getElement(element).style.display != 'none';
+    },
+
+    /**
+     * APIFunction: toggle
+     * Toggle the visibility of element(s) passed in
+     * 
+     * Parameters:
+     * element - {DOMElement} Actually user can pass any number of elements
+     */
+    toggle: function() {
+        for (var i=0, len=arguments.length; i<len; i++) {
+            var element = OpenLayers.Util.getElement(arguments[i]);
+            var display = OpenLayers.Element.visible(element) ? 'hide' 
+                                                              : 'show';
+            OpenLayers.Element[display](element);
+        }
+    },
+
+
+    /**
+     * APIFunction: hide
+     * Hide element(s) passed in
+     * 
+     * Parameters:
+     * element - {DOMElement} Actually user can pass any number of elements
+     */
+    hide: function() {
+        for (var i=0, len=arguments.length; i<len; i++) {
+            var element = OpenLayers.Util.getElement(arguments[i]);
+            if (element) {
+                element.style.display = 'none';
+            }
+        }
+    },
+
+    /**
+     * APIFunction: show
+     * Show element(s) passed in
+     * 
+     * Parameters:
+     * element - {DOMElement} Actually user can pass any number of elements
+     */
+    show: function() {
+        for (var i=0, len=arguments.length; i<len; i++) {
+            var element = OpenLayers.Util.getElement(arguments[i]);
+            if (element) {
+                element.style.display = '';
+            }
+        }
+    },
+
+    /**
+     * APIFunction: remove
+     * Remove the specified element from the DOM.
+     * 
+     * Parameters:
+     * element - {DOMElement}
+     */
+    remove: function(element) {
+        element = OpenLayers.Util.getElement(element);
+        element.parentNode.removeChild(element);
+    },
+
+    /**
+     * APIFunction: getHeight
+     *  
+     * Parameters:
+     * element - {DOMElement}
+     * 
+     * Returns:
+     * {Integer} The offset height of the element passed in
+     */
+    getHeight: function(element) {
+        element = OpenLayers.Util.getElement(element);
+        return element.offsetHeight;
+    },
+
+    /**
+     * APIFunction: getDimensions
+     * *Deprecated*. Returns dimensions of the element passed in.
+     *  
+     * Parameters:
+     * element - {DOMElement}
+     * 
+     * Returns:
+     * {Object} Object with 'width' and 'height' properties which are the 
+     *          dimensions of the element passed in.
+     */
+    getDimensions: function(element) {
+        element = OpenLayers.Util.getElement(element);
+        if (OpenLayers.Element.getStyle(element, 'display') != 'none') {
+            return {width: element.offsetWidth, height: element.offsetHeight};
+        }
+    
+        // All *Width and *Height properties give 0 on elements with display none,
+        // so enable the element temporarily
+        var els = element.style;
+        var originalVisibility = els.visibility;
+        var originalPosition = els.position;
+        var originalDisplay = els.display;
+        els.visibility = 'hidden';
+        els.position = 'absolute';
+        els.display = '';
+        var originalWidth = element.clientWidth;
+        var originalHeight = element.clientHeight;
+        els.display = originalDisplay;
+        els.position = originalPosition;
+        els.visibility = originalVisibility;
+        return {width: originalWidth, height: originalHeight};
+    },
+
+    /**
+     * Function: hasClass
+     * Tests if an element has the given CSS class name.
+     *
+     * Parameters:
+     * element - {DOMElement} A DOM element node.
+     * name - {String} The CSS class name to search for.
+     *
+     * Returns:
+     * {Boolean} The element has the given class name.
+     */
+    hasClass: function(element, name) {
+        var names = element.className;
+        return (!!names && new RegExp("(^|\\s)" + name + "(\\s|$)").test(names));
+    },
+    
+    /**
+     * Function: addClass
+     * Add a CSS class name to an element.  Safe where element already has
+     *     the class name.
+     *
+     * Parameters:
+     * element - {DOMElement} A DOM element node.
+     * name - {String} The CSS class name to add.
+     *
+     * Returns:
+     * {DOMElement} The element.
+     */
+    addClass: function(element, name) {
+        if(!OpenLayers.Element.hasClass(element, name)) {
+            element.className += (element.className ? " " : "") + name;
+        }
+        return element;
+    },
+
+    /**
+     * Function: removeClass
+     * Remove a CSS class name from an element.  Safe where element does not
+     *     have the class name.
+     *
+     * Parameters:
+     * element - {DOMElement} A DOM element node.
+     * name - {String} The CSS class name to remove.
+     *
+     * Returns:
+     * {DOMElement} The element.
+     */
+    removeClass: function(element, name) {
+        var names = element.className;
+        if(names) {
+            element.className = OpenLayers.String.trim(
+                names.replace(
+                    new RegExp("(^|\\s+)" + name + "(\\s+|$)"), " "
+                )
+            );
+        }
+        return element;
+    },
+
+    /**
+     * Function: toggleClass
+     * Remove a CSS class name from an element if it exists.  Add the class name
+     *     if it doesn't exist.
+     *
+     * Parameters:
+     * element - {DOMElement} A DOM element node.
+     * name - {String} The CSS class name to toggle.
+     *
+     * Returns:
+     * {DOMElement} The element.
+     */
+    toggleClass: function(element, name) {
+        if(OpenLayers.Element.hasClass(element, name)) {
+            OpenLayers.Element.removeClass(element, name);
+        } else {
+            OpenLayers.Element.addClass(element, name);
+        }
+        return element;
+    },
+
+    /**
+     * APIFunction: getStyle
+     * 
+     * Parameters:
+     * element - {DOMElement}
+     * style - {?}
+     * 
+     * Returns:
+     * {?}
+     */
+    getStyle: function(element, style) {
+        element = OpenLayers.Util.getElement(element);
+
+        var value = null;
+        if (element && element.style) {
+            value = element.style[OpenLayers.String.camelize(style)];
+            if (!value) {
+                if (document.defaultView && 
+                    document.defaultView.getComputedStyle) {
+                    
+                    var css = document.defaultView.getComputedStyle(element, null);
+                    value = css ? css.getPropertyValue(style) : null;
+                } else if (element.currentStyle) {
+                    value = element.currentStyle[OpenLayers.String.camelize(style)];
+                }
+            }
+        
+            var positions = ['left', 'top', 'right', 'bottom'];
+            if (window.opera &&
+                (OpenLayers.Util.indexOf(positions,style) != -1) &&
+                (OpenLayers.Element.getStyle(element, 'position') == 'static')) { 
+                value = 'auto';
+            }
+        }
+    
+        return value == 'auto' ? null : value;
+    }
+
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/LonLat.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/LonLat.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/LonLat.js	(revision 76)
@@ -0,0 +1,190 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.LonLat
+ * This class represents a longitude and latitude pair
+ */
+OpenLayers.LonLat = OpenLayers.Class({
+
+    /** 
+     * APIProperty: lon
+     * {Float} The x-axis coodinate in map units
+     */
+    lon: 0.0,
+    
+    /** 
+     * APIProperty: lat
+     * {Float} The y-axis coordinate in map units
+     */
+    lat: 0.0,
+
+    /**
+     * Constructor: OpenLayers.LonLat
+     * Create a new map location.
+     *
+     * Parameters:
+     * lon - {Number} The x-axis coordinate in map units.  If your map is in
+     *     a geographic projection, this will be the Longitude.  Otherwise,
+     *     it will be the x coordinate of the map location in your map units.
+     * lat - {Number} The y-axis coordinate in map units.  If your map is in
+     *     a geographic projection, this will be the Latitude.  Otherwise,
+     *     it will be the y coordinate of the map location in your map units.
+     */
+    initialize: function(lon, lat) {
+        this.lon = OpenLayers.Util.toFloat(lon);
+        this.lat = OpenLayers.Util.toFloat(lat);
+    },
+    
+    /**
+     * Method: toString
+     * Return a readable string version of the lonlat
+     *
+     * Returns:
+     * {String} String representation of OpenLayers.LonLat object. 
+     *           (ex. <i>"lon=5,lat=42"</i>)
+     */
+    toString:function() {
+        return ("lon=" + this.lon + ",lat=" + this.lat);
+    },
+
+    /** 
+     * APIMethod: toShortString
+     * 
+     * Returns:
+     * {String} Shortened String representation of OpenLayers.LonLat object. 
+     *         (ex. <i>"5, 42"</i>)
+     */
+    toShortString:function() {
+        return (this.lon + ", " + this.lat);
+    },
+
+    /** 
+     * APIMethod: clone
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} New OpenLayers.LonLat object with the same lon 
+     *                       and lat values
+     */
+    clone:function() {
+        return new OpenLayers.LonLat(this.lon, this.lat);
+    },
+
+    /** 
+     * APIMethod: add
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} A new OpenLayers.LonLat object with the lon and 
+     *                       lat passed-in added to this's. 
+     */
+    add:function(lon, lat) {
+        if ( (lon == null) || (lat == null) ) {
+            var msg = OpenLayers.i18n("lonlatAddError");
+            OpenLayers.Console.error(msg);
+            return null;
+        }
+        return new OpenLayers.LonLat(this.lon + OpenLayers.Util.toFloat(lon), 
+                                     this.lat + OpenLayers.Util.toFloat(lat));
+    },
+
+    /** 
+     * APIMethod: equals
+     * 
+     * Parameters:
+     * ll - {<OpenLayers.LonLat>}
+     * 
+     * Returns:
+     * {Boolean} Boolean value indicating whether the passed-in 
+     *           <OpenLayers.LonLat> object has the same lon and lat 
+     *           components as this.
+     *           Note: if ll passed in is null, returns false
+     */
+    equals:function(ll) {
+        var equals = false;
+        if (ll != null) {
+            equals = ((this.lon == ll.lon && this.lat == ll.lat) ||
+                      (isNaN(this.lon) && isNaN(this.lat) && isNaN(ll.lon) && isNaN(ll.lat)));
+        }
+        return equals;
+    },
+
+    /**
+     * APIMethod: transform
+     * Transform the LonLat object from source to dest. This transformation is
+     *    *in place*: if you want a *new* lonlat, use .clone() first.
+     *
+     * Parameters: 
+     * source - {<OpenLayers.Projection>} Source projection. 
+     * dest   - {<OpenLayers.Projection>} Destination projection. 
+     *
+     * Returns:
+     * {<OpenLayers.LonLat>} Itself, for use in chaining operations.
+     */
+    transform: function(source, dest) {
+        var point = OpenLayers.Projection.transform(
+            {'x': this.lon, 'y': this.lat}, source, dest);
+        this.lon = point.x;
+        this.lat = point.y;
+        return this;
+    },
+    
+    /**
+     * APIMethod: wrapDateLine
+     * 
+     * Parameters:
+     * maxExtent - {<OpenLayers.Bounds>}
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} A copy of this lonlat, but wrapped around the 
+     *                       "dateline" (as specified by the borders of 
+     *                       maxExtent)
+     */
+    wrapDateLine: function(maxExtent) {    
+
+        var newLonLat = this.clone();
+    
+        if (maxExtent) {
+            //shift right?
+            while (newLonLat.lon < maxExtent.left) {
+                newLonLat.lon +=  maxExtent.getWidth();
+            }    
+           
+            //shift left?
+            while (newLonLat.lon > maxExtent.right) {
+                newLonLat.lon -= maxExtent.getWidth();
+            }    
+        }
+                
+        return newLonLat;
+    },
+
+    CLASS_NAME: "OpenLayers.LonLat"
+});
+
+/** 
+ * Function: fromString
+ * Alternative constructor that builds a new <OpenLayers.LonLat> from a 
+ *     parameter string
+ * 
+ * Parameters:
+ * str - {String} Comma-separated Lon,Lat coordinate string. 
+ *                 (ex. <i>"5,40"</i>)
+ * 
+ * Returns:
+ * {<OpenLayers.LonLat>} New <OpenLayers.LonLat> object built from the 
+ *                       passed-in String.
+ */
+OpenLayers.LonLat.fromString = function(str) {
+    var pair = str.split(",");
+    return new OpenLayers.LonLat(pair[0], pair[1]);
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Bounds.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Bounds.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Bounds.js	(revision 76)
@@ -0,0 +1,681 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Bounds
+ * Instances of this class represent bounding boxes.  Data stored as left,
+ * bottom, right, top floats. All values are initialized to null, however,
+ * you should make sure you set them before using the bounds for anything.
+ * 
+ * Possible use case:
+ * > bounds = new OpenLayers.Bounds();
+ * > bounds.extend(new OpenLayers.LonLat(4,5));
+ * > bounds.extend(new OpenLayers.LonLat(5,6));
+ * > bounds.toBBOX(); // returns 4,5,5,6
+ */
+OpenLayers.Bounds = OpenLayers.Class({
+
+    /**
+     * Property: left
+     * {Number} Minimum horizontal coordinate.
+     */
+    left: null,
+
+    /**
+     * Property: bottom
+     * {Number} Minimum vertical coordinate.
+     */
+    bottom: null,
+
+    /**
+     * Property: right
+     * {Number} Maximum horizontal coordinate.
+     */
+    right: null,
+
+    /**
+     * Property: top
+     * {Number} Maximum vertical coordinate.
+     */
+    top: null,
+    
+    /**
+     * Property: centerLonLat
+     * {<OpenLayers.LonLat>} A cached center location.  This should not be
+     *     accessed directly.  Use <getCenterLonLat> instead.
+     */
+    centerLonLat: null,
+
+    /**
+     * Constructor: OpenLayers.Bounds
+     * Construct a new bounds object.
+     *
+     * Parameters:
+     * left - {Number} The left bounds of the box.  Note that for width
+     *        calculations, this is assumed to be less than the right value.
+     * bottom - {Number} The bottom bounds of the box.  Note that for height
+     *          calculations, this is assumed to be more than the top value.
+     * right - {Number} The right bounds.
+     * top - {Number} The top bounds.
+     */
+    initialize: function(left, bottom, right, top) {
+        if (left != null) {
+            this.left = OpenLayers.Util.toFloat(left);
+        }
+        if (bottom != null) {
+            this.bottom = OpenLayers.Util.toFloat(bottom);
+        }
+        if (right != null) {
+            this.right = OpenLayers.Util.toFloat(right);
+        }
+        if (top != null) {
+            this.top = OpenLayers.Util.toFloat(top);
+        }
+    },
+
+    /**
+     * Method: clone
+     * Create a cloned instance of this bounds.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} A fresh copy of the bounds
+     */
+    clone:function() {
+        return new OpenLayers.Bounds(this.left, this.bottom, 
+                                     this.right, this.top);
+    },
+
+    /**
+     * Method: equals
+     * Test a two bounds for equivalence.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     *
+     * Returns:
+     * {Boolean} The passed-in bounds object has the same left,
+     *           right, top, bottom components as this.  Note that if bounds 
+     *           passed in is null, returns false.
+     */
+    equals:function(bounds) {
+        var equals = false;
+        if (bounds != null) {
+            equals = ((this.left == bounds.left) && 
+                      (this.right == bounds.right) &&
+                      (this.top == bounds.top) && 
+                      (this.bottom == bounds.bottom));
+        }
+        return equals;
+    },
+
+    /** 
+     * APIMethod: toString
+     * 
+     * Returns:
+     * {String} String representation of bounds object. 
+     *          (ex.<i>"left-bottom=(5,42) right-top=(10,45)"</i>)
+     */
+    toString:function() {
+        return ( "left-bottom=(" + this.left + "," + this.bottom + ")"
+                 + " right-top=(" + this.right + "," + this.top + ")" );
+    },
+
+    /**
+     * APIMethod: toArray
+     *
+     * Parameters:
+     * reverseAxisOrder - {Boolean} Should we reverse the axis order?
+     *
+     * Returns:
+     * {Array} array of left, bottom, right, top
+     */
+    toArray: function(reverseAxisOrder) {
+        if (reverseAxisOrder === true) {
+            return [this.bottom, this.left, this.top, this.right];
+        } else {
+            return [this.left, this.bottom, this.right, this.top];
+        }
+    },    
+
+    /** 
+     * APIMethod: toBBOX
+     * 
+     * Parameters:
+     * decimal - {Integer} How many significant digits in the bbox coords?
+     *                     Default is 6
+     * reverseAxisOrder - {Boolean} Should we reverse the axis order?
+     * 
+     * Returns:
+     * {String} Simple String representation of bounds object.
+     *          (ex. <i>"5,42,10,45"</i>)
+     */
+    toBBOX:function(decimal, reverseAxisOrder) {
+        if (decimal== null) {
+            decimal = 6; 
+        }
+        var mult = Math.pow(10, decimal);
+        var xmin = Math.round(this.left * mult) / mult;
+        var ymin = Math.round(this.bottom * mult) / mult;
+        var xmax = Math.round(this.right * mult) / mult;
+        var ymax = Math.round(this.top * mult) / mult;
+        if (reverseAxisOrder === true) {
+            return ymin + "," + xmin + "," + ymax + "," + xmax;
+        } else {
+            return xmin + "," + ymin + "," + xmax + "," + ymax;
+        }
+    },
+ 
+    /**
+     * APIMethod: toGeometry
+     * Create a new polygon geometry based on this bounds.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Polygon>} A new polygon with the coordinates
+     *     of this bounds.
+     */
+    toGeometry: function() {
+        return new OpenLayers.Geometry.Polygon([
+            new OpenLayers.Geometry.LinearRing([
+                new OpenLayers.Geometry.Point(this.left, this.bottom),
+                new OpenLayers.Geometry.Point(this.right, this.bottom),
+                new OpenLayers.Geometry.Point(this.right, this.top),
+                new OpenLayers.Geometry.Point(this.left, this.top)
+            ])
+        ]);
+    },
+    
+    /**
+     * APIMethod: getWidth
+     * 
+     * Returns:
+     * {Float} The width of the bounds
+     */
+    getWidth:function() {
+        return (this.right - this.left);
+    },
+
+    /**
+     * APIMethod: getHeight
+     * 
+     * Returns:
+     * {Float} The height of the bounds (top minus bottom).
+     */
+    getHeight:function() {
+        return (this.top - this.bottom);
+    },
+
+    /**
+     * APIMethod: getSize
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} The size of the box.
+     */
+    getSize:function() {
+        return new OpenLayers.Size(this.getWidth(), this.getHeight());
+    },
+
+    /**
+     * APIMethod: getCenterPixel
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} The center of the bounds in pixel space.
+     */
+    getCenterPixel:function() {
+        return new OpenLayers.Pixel( (this.left + this.right) / 2,
+                                     (this.bottom + this.top) / 2);
+    },
+
+    /**
+     * APIMethod: getCenterLonLat
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} The center of the bounds in map space.
+     */
+    getCenterLonLat:function() {
+        if(!this.centerLonLat) {
+            this.centerLonLat = new OpenLayers.LonLat(
+                (this.left + this.right) / 2, (this.bottom + this.top) / 2
+            );
+        }
+        return this.centerLonLat;
+    },
+
+    /**
+     * Method: scale
+     * Scales the bounds around a pixel or lonlat. Note that the new 
+     *     bounds may return non-integer properties, even if a pixel
+     *     is passed. 
+     * 
+     * Parameters:
+     * ratio - {Float} 
+     * origin - {<OpenLayers.Pixel> or <OpenLayers.LonLat>}
+     *          Default is center.
+     *
+     * Returns:
+     * {<OpenLayers.Bound>} A new bounds that is scaled by ratio
+     *                      from origin.
+     */
+
+    scale: function(ratio, origin){
+        if(origin == null){
+            origin = this.getCenterLonLat();
+        }
+        
+        var origx,origy;
+
+        // get origin coordinates
+        if(origin.CLASS_NAME == "OpenLayers.LonLat"){
+            origx = origin.lon;
+            origy = origin.lat;
+        } else {
+            origx = origin.x;
+            origy = origin.y;
+        }
+
+        var left = (this.left - origx) * ratio + origx;
+        var bottom = (this.bottom - origy) * ratio + origy;
+        var right = (this.right - origx) * ratio + origx;
+        var top = (this.top - origy) * ratio + origy;
+        
+        return new OpenLayers.Bounds(left, bottom, right, top);
+    },
+
+    /**
+     * APIMethod: add
+     * 
+     * Parameters:
+     * x - {Float}
+     * y - {Float}
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A new bounds whose coordinates are the same as
+     *     this, but shifted by the passed-in x and y values.
+     */
+    add:function(x, y) {
+        if ( (x == null) || (y == null) ) {
+            var msg = OpenLayers.i18n("boundsAddError");
+            OpenLayers.Console.error(msg);
+            return null;
+        }
+        return new OpenLayers.Bounds(this.left + x, this.bottom + y,
+                                     this.right + x, this.top + y);
+    },
+    
+    /**
+     * APIMethod: extend
+     * Extend the bounds to include the point, lonlat, or bounds specified.
+     *     Note, this function assumes that left < right and bottom < top.
+     * 
+     * Parameters: 
+     * object - {Object} Can be LonLat, Point, or Bounds
+     */
+    extend:function(object) {
+        var bounds = null;
+        if (object) {
+            // clear cached center location
+            switch(object.CLASS_NAME) {
+                case "OpenLayers.LonLat":    
+                    bounds = new OpenLayers.Bounds(object.lon, object.lat,
+                                                    object.lon, object.lat);
+                    break;
+                case "OpenLayers.Geometry.Point":
+                    bounds = new OpenLayers.Bounds(object.x, object.y,
+                                                    object.x, object.y);
+                    break;
+                    
+                case "OpenLayers.Bounds":    
+                    bounds = object;
+                    break;
+            }
+    
+            if (bounds) {
+                this.centerLonLat = null;
+                if ( (this.left == null) || (bounds.left < this.left)) {
+                    this.left = bounds.left;
+                }
+                if ( (this.bottom == null) || (bounds.bottom < this.bottom) ) {
+                    this.bottom = bounds.bottom;
+                } 
+                if ( (this.right == null) || (bounds.right > this.right) ) {
+                    this.right = bounds.right;
+                }
+                if ( (this.top == null) || (bounds.top > this.top) ) { 
+                    this.top = bounds.top;
+                }
+            }
+        }
+    },
+
+    /**
+     * APIMethod: containsLonLat
+     * 
+     * Parameters:
+     * ll - {<OpenLayers.LonLat>}
+     * inclusive - {Boolean} Whether or not to include the border.
+     *     Default is true.
+     *
+     * Returns:
+     * {Boolean} The passed-in lonlat is within this bounds.
+     */
+    containsLonLat:function(ll, inclusive) {
+        return this.contains(ll.lon, ll.lat, inclusive);
+    },
+
+    /**
+     * APIMethod: containsPixel
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     * inclusive - {Boolean} Whether or not to include the border. Default is
+     *     true.
+     *
+     * Returns:
+     * {Boolean} The passed-in pixel is within this bounds.
+     */
+    containsPixel:function(px, inclusive) {
+        return this.contains(px.x, px.y, inclusive);
+    },
+    
+    /**
+     * APIMethod: contains
+     * 
+     * Parameters:
+     * x - {Float}
+     * y - {Float}
+     * inclusive - {Boolean} Whether or not to include the border. Default is
+     *     true.
+     *
+     * Returns:
+     * {Boolean} Whether or not the passed-in coordinates are within this
+     *     bounds.
+     */
+    contains:function(x, y, inclusive) {
+        //set default
+        if (inclusive == null) {
+            inclusive = true;
+        }
+
+        if (x == null || y == null) {
+            return false;
+        }
+
+        x = OpenLayers.Util.toFloat(x);
+        y = OpenLayers.Util.toFloat(y);
+
+        var contains = false;
+        if (inclusive) {
+            contains = ((x >= this.left) && (x <= this.right) && 
+                        (y >= this.bottom) && (y <= this.top));
+        } else {
+            contains = ((x > this.left) && (x < this.right) && 
+                        (y > this.bottom) && (y < this.top));
+        }              
+        return contains;
+    },
+
+    /**
+     * APIMethod: intersectsBounds
+     * Determine whether the target bounds intersects this bounds.  Bounds are
+     *     considered intersecting if any of their edges intersect or if one
+     *     bounds contains the other.
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} The target bounds.
+     * inclusive - {Boolean} Treat coincident borders as intersecting.  Default
+     *     is true.  If false, bounds that do not overlap but only touch at the
+     *     border will not be considered as intersecting.
+     *
+     * Returns:
+     * {Boolean} The passed-in bounds object intersects this bounds.
+     */
+    intersectsBounds:function(bounds, inclusive) {
+        if (inclusive == null) {
+            inclusive = true;
+        }
+        var intersects = false;
+        var mightTouch = (
+            this.left == bounds.right ||
+            this.right == bounds.left ||
+            this.top == bounds.bottom ||
+            this.bottom == bounds.top
+        );
+        
+        // if the two bounds only touch at an edge, and inclusive is false,
+        // then the bounds don't *really* intersect.
+        if (inclusive || !mightTouch) {
+            // otherwise, if one of the boundaries even partially contains another,
+            // inclusive of the edges, then they do intersect.
+            var inBottom = (
+                ((bounds.bottom >= this.bottom) && (bounds.bottom <= this.top)) ||
+                ((this.bottom >= bounds.bottom) && (this.bottom <= bounds.top))
+            );
+            var inTop = (
+                ((bounds.top >= this.bottom) && (bounds.top <= this.top)) ||
+                ((this.top > bounds.bottom) && (this.top < bounds.top))
+            );
+            var inLeft = (
+                ((bounds.left >= this.left) && (bounds.left <= this.right)) ||
+                ((this.left >= bounds.left) && (this.left <= bounds.right))
+            );
+            var inRight = (
+                ((bounds.right >= this.left) && (bounds.right <= this.right)) ||
+                ((this.right >= bounds.left) && (this.right <= bounds.right))
+            );
+            intersects = ((inBottom || inTop) && (inLeft || inRight));
+        }
+        return intersects;
+    },
+    
+    /**
+     * APIMethod: containsBounds
+     * Determine whether the target bounds is contained within this bounds.
+     * 
+     * bounds - {<OpenLayers.Bounds>} The target bounds.
+     * partial - {Boolean} If any of the target corners is within this bounds
+     *     consider the bounds contained.  Default is false.  If false, the
+     *     entire target bounds must be contained within this bounds.
+     * inclusive - {Boolean} Treat shared edges as contained.  Default is
+     *     true.
+     *
+     * Returns:
+     * {Boolean} The passed-in bounds object is contained within this bounds. 
+     */
+    containsBounds:function(bounds, partial, inclusive) {
+        if (partial == null) {
+            partial = false;
+        }
+        if (inclusive == null) {
+            inclusive = true;
+        }
+        var bottomLeft  = this.contains(bounds.left, bounds.bottom, inclusive);
+        var bottomRight = this.contains(bounds.right, bounds.bottom, inclusive);
+        var topLeft  = this.contains(bounds.left, bounds.top, inclusive);
+        var topRight = this.contains(bounds.right, bounds.top, inclusive);
+        
+        return (partial) ? (bottomLeft || bottomRight || topLeft || topRight)
+                         : (bottomLeft && bottomRight && topLeft && topRight);
+    },
+
+    /** 
+     * APIMethod: determineQuadrant
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     * 
+     * Returns:
+     * {String} The quadrant ("br" "tr" "tl" "bl") of the bounds in which the
+     *     coordinate lies.
+     */
+    determineQuadrant: function(lonlat) {
+    
+        var quadrant = "";
+        var center = this.getCenterLonLat();
+        
+        quadrant += (lonlat.lat < center.lat) ? "b" : "t";
+        quadrant += (lonlat.lon < center.lon) ? "l" : "r";
+    
+        return quadrant; 
+    },
+    
+    /**
+     * APIMethod: transform
+     * Transform the Bounds object from source to dest. 
+     *
+     * Parameters: 
+     * source - {<OpenLayers.Projection>} Source projection. 
+     * dest   - {<OpenLayers.Projection>} Destination projection. 
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} Itself, for use in chaining operations.
+     */
+    transform: function(source, dest) {
+        // clear cached center location
+        this.centerLonLat = null;
+        var ll = OpenLayers.Projection.transform(
+            {'x': this.left, 'y': this.bottom}, source, dest);
+        var lr = OpenLayers.Projection.transform(
+            {'x': this.right, 'y': this.bottom}, source, dest);
+        var ul = OpenLayers.Projection.transform(
+            {'x': this.left, 'y': this.top}, source, dest);
+        var ur = OpenLayers.Projection.transform(
+            {'x': this.right, 'y': this.top}, source, dest);
+        this.left   = Math.min(ll.x, ul.x);
+        this.bottom = Math.min(ll.y, lr.y);
+        this.right  = Math.max(lr.x, ur.x);
+        this.top    = Math.max(ul.y, ur.y);
+        return this;
+    },
+
+    /**
+     * APIMethod: wrapDateLine
+     *  
+     * Parameters:
+     * maxExtent - {<OpenLayers.Bounds>}
+     * options - {Object} Some possible options are:
+     *                    leftTolerance - {float} Allow for a margin of error 
+     *                                            with the 'left' value of this 
+     *                                            bound.
+     *                                            Default is 0.
+     *                    rightTolerance - {float} Allow for a margin of error 
+     *                                             with the 'right' value of 
+     *                                             this bound.
+     *                                             Default is 0.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A copy of this bounds, but wrapped around the 
+     *                       "dateline" (as specified by the borders of 
+     *                       maxExtent). Note that this function only returns 
+     *                       a different bounds value if this bounds is 
+     *                       *entirely* outside of the maxExtent. If this 
+     *                       bounds straddles the dateline (is part in/part 
+     *                       out of maxExtent), the returned bounds will be 
+     *                       merely a copy of this one.
+     */
+    wrapDateLine: function(maxExtent, options) {    
+        options = options || {};
+        
+        var leftTolerance = options.leftTolerance || 0;
+        var rightTolerance = options.rightTolerance || 0;
+
+        var newBounds = this.clone();
+    
+        if (maxExtent) {
+
+           //shift right?
+           while ( newBounds.left < maxExtent.left && 
+                   (newBounds.right - rightTolerance) <= maxExtent.left ) { 
+                newBounds = newBounds.add(maxExtent.getWidth(), 0);
+           }
+
+           //shift left?
+           while ( (newBounds.left + leftTolerance) >= maxExtent.right && 
+                   newBounds.right > maxExtent.right ) { 
+                newBounds = newBounds.add(-maxExtent.getWidth(), 0);
+           }
+        }
+                
+        return newBounds;
+    },
+
+    CLASS_NAME: "OpenLayers.Bounds"
+});
+
+/** 
+ * APIFunction: fromString
+ * Alternative constructor that builds a new OpenLayers.Bounds from a 
+ *     parameter string
+ * 
+ * Parameters: 
+ * str - {String}Comma-separated bounds string. (ex. <i>"5,42,10,45"</i>)
+ * 
+ * Returns:
+ * {<OpenLayers.Bounds>} New bounds object built from the 
+ *                       passed-in String.
+ */
+OpenLayers.Bounds.fromString = function(str) {
+    var bounds = str.split(",");
+    return OpenLayers.Bounds.fromArray(bounds);
+};
+
+/** 
+ * APIFunction: fromArray
+ * Alternative constructor that builds a new OpenLayers.Bounds
+ *     from an array
+ * 
+ * Parameters:
+ * bbox - {Array(Float)} Array of bounds values (ex. <i>[5,42,10,45]</i>)
+ *
+ * Returns:
+ * {<OpenLayers.Bounds>} New bounds object built from the passed-in Array.
+ */
+OpenLayers.Bounds.fromArray = function(bbox) {
+    return new OpenLayers.Bounds(parseFloat(bbox[0]),
+                                 parseFloat(bbox[1]),
+                                 parseFloat(bbox[2]),
+                                 parseFloat(bbox[3]));
+};
+
+/** 
+ * APIFunction: fromSize
+ * Alternative constructor that builds a new OpenLayers.Bounds
+ *     from a size
+ * 
+ * Parameters:
+ * size - {<OpenLayers.Size>} 
+ *
+ * Returns:
+ * {<OpenLayers.Bounds>} New bounds object built from the passed-in size.
+ */
+OpenLayers.Bounds.fromSize = function(size) {
+    return new OpenLayers.Bounds(0,
+                                 size.h,
+                                 size.w,
+                                 0);
+};
+
+/**
+ * Function: oppositeQuadrant
+ * Get the opposite quadrant for a given quadrant string.
+ *
+ * Parameters:
+ * quadrant - {String} two character quadrant shortstring
+ *
+ * Returns:
+ * {String} The opposing quadrant ("br" "tr" "tl" "bl"). For Example, if 
+ *          you pass in "bl" it returns "tr", if you pass in "br" it 
+ *          returns "tl", etc.
+ */
+OpenLayers.Bounds.oppositeQuadrant = function(quadrant) {
+    var opp = "";
+    
+    opp += (quadrant.charAt(0) == 't') ? 'b' : 't';
+    opp += (quadrant.charAt(1) == 'l') ? 'r' : 'l';
+    
+    return opp;
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Size.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Size.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Size.js	(revision 76)
@@ -0,0 +1,85 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Size
+ * Instances of this class represent a width/height pair
+ */
+OpenLayers.Size = OpenLayers.Class({
+
+    /**
+     * APIProperty: w
+     * {Number} width
+     */
+    w: 0.0,
+    
+    /**
+     * APIProperty: h
+     * {Number} height
+     */
+    h: 0.0,
+
+
+    /**
+     * Constructor: OpenLayers.Size
+     * Create an instance of OpenLayers.Size
+     *
+     * Parameters:
+     * w - {Number} width
+     * h - {Number} height
+     */
+    initialize: function(w, h) {
+        this.w = parseFloat(w);
+        this.h = parseFloat(h);
+    },
+
+    /**
+     * Method: toString
+     * Return the string representation of a size object
+     *
+     * Returns:
+     * {String} The string representation of OpenLayers.Size object. 
+     * (ex. <i>"w=55,h=66"</i>)
+     */
+    toString:function() {
+        return ("w=" + this.w + ",h=" + this.h);
+    },
+
+    /**
+     * APIMethod: clone
+     * Create a clone of this size object
+     *
+     * Returns:
+     * {<OpenLayers.Size>} A new OpenLayers.Size object with the same w and h
+     * values
+     */
+    clone:function() {
+        return new OpenLayers.Size(this.w, this.h);
+    },
+
+    /**
+     *
+     * APIMethod: equals
+     * Determine where this size is equal to another
+     *
+     * Parameters:
+     * sz - {<OpenLayers.Size>}
+     *
+     * Returns: 
+     * {Boolean} The passed in size has the same h and w properties as this one.
+     * Note that if sz passed in is null, returns false.
+     *
+     */
+    equals:function(sz) {
+        var equals = false;
+        if (sz != null) {
+            equals = ((this.w == sz.w && this.h == sz.h) ||
+                      (isNaN(this.w) && isNaN(this.h) && isNaN(sz.w) && isNaN(sz.h)));
+        }
+        return equals;
+    },
+
+    CLASS_NAME: "OpenLayers.Size"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Pixel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Pixel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes/Pixel.js	(revision 76)
@@ -0,0 +1,125 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Pixel
+ * This class represents a screen coordinate, in x and y coordinates
+ */
+OpenLayers.Pixel = OpenLayers.Class({
+    
+    /**
+     * APIProperty: x
+     * {Number} The x coordinate
+     */
+    x: 0.0,
+
+    /**
+     * APIProperty: y
+     * {Number} The y coordinate
+     */
+    y: 0.0,
+    
+    /**
+     * Constructor: OpenLayers.Pixel
+     * Create a new OpenLayers.Pixel instance
+     *
+     * Parameters:
+     * x - {Number} The x coordinate
+     * y - {Number} The y coordinate
+     *
+     * Returns:
+     * An instance of OpenLayers.Pixel
+     */
+    initialize: function(x, y) {
+        this.x = parseFloat(x);
+        this.y = parseFloat(y);
+    },
+    
+    /**
+     * Method: toString
+     * Cast this object into a string
+     *
+     * Returns:
+     * {String} The string representation of Pixel. ex: "x=200.4,y=242.2"
+     */
+    toString:function() {
+        return ("x=" + this.x + ",y=" + this.y);
+    },
+
+    /**
+     * APIMethod: clone
+     * Return a clone of this pixel object
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} A clone pixel
+     */
+    clone:function() {
+        return new OpenLayers.Pixel(this.x, this.y); 
+    },
+    
+    /**
+     * APIMethod: equals
+     * Determine whether one pixel is equivalent to another
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {Boolean} The point passed in as parameter is equal to this. Note that
+     * if px passed in is null, returns false.
+     */
+    equals:function(px) {
+        var equals = false;
+        if (px != null) {
+            equals = ((this.x == px.x && this.y == px.y) ||
+                      (isNaN(this.x) && isNaN(this.y) && isNaN(px.x) && isNaN(px.y)));
+        }
+        return equals;
+    },
+
+    /**
+     * APIMethod: add
+     *
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} A new Pixel with this pixel's x&y augmented by the 
+     * values passed in.
+     */
+    add:function(x, y) {
+        if ( (x == null) || (y == null) ) {
+            var msg = OpenLayers.i18n("pixelAddError");
+            OpenLayers.Console.error(msg);
+            return null;
+        }
+        return new OpenLayers.Pixel(this.x + x, this.y + y);
+    },
+
+    /**
+    * APIMethod: offset
+    * 
+    * Parameters
+    * px - {<OpenLayers.Pixel>}
+    * 
+    * Returns:
+    * {<OpenLayers.Pixel>} A new Pixel with this pixel's x&y augmented by the 
+    *                      x&y values of the pixel passed in.
+    */
+    offset:function(px) {
+        var newPx = this.clone();
+        if (px) {
+            newPx = this.add(px.x, px.y);
+        }
+        return newPx;
+    },
+
+    CLASS_NAME: "OpenLayers.Pixel"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Text.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Text.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Text.js	(revision 76)
@@ -0,0 +1,65 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Symbolizer.js
+ */
+
+/**
+ * Class: OpenLayers.Symbolizer.Text
+ * A symbolizer used to render text labels for features.
+ */
+OpenLayers.Symbolizer.Text = OpenLayers.Class(OpenLayers.Symbolizer, {
+    
+    /** 
+     * APIProperty: label
+     * {String} The text for the label.
+     */
+    label: null,
+    
+    /** 
+     * APIProperty: fontFamily
+     * {String} The font family for the label.
+     */
+    fontFamily: null,
+
+    /** 
+     * APIProperty: fontSize
+     * {String} The font size for the label.
+     */
+    fontSize: null,
+
+    /** 
+     * APIProperty: fontWeight
+     * {String} The font weight for the label.
+     */
+    fontWeight: null,
+    
+    /**
+     * Property: fontStyle
+     * {String} The font style for the label.
+     */
+    fontStyle: null,
+
+    /**
+     * Constructor: OpenLayers.Symbolizer.Text
+     * Create a symbolizer for rendering text labels.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new text symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Symbolizer.prototype.initialize.apply(this, arguments);
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer.Text"
+    
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Line.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Line.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Line.js	(revision 76)
@@ -0,0 +1,69 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Symbolizer.js
+ */
+
+/**
+ * Class: OpenLayers.Symbolizer.Line
+ * A symbolizer used to render line features.
+ */
+OpenLayers.Symbolizer.Line = OpenLayers.Class(OpenLayers.Symbolizer, {
+
+    /**
+     * APIProperty: strokeColor
+     * {String} Color for line stroke.  This is a RGB hex value (e.g. "#ff0000"
+     *     for red).
+     */
+    strokeColor: null,
+    
+    /**
+     * APIProperty: strokeOpacity
+     * {Number} Stroke opacity (0-1).
+     */
+    strokeOpacity: null,
+    
+    /**
+     * APIProperty: strokeWidth
+     * {Number} Pixel stroke width.
+     */
+    strokeWidth: null,
+    
+    /**
+     * APIProperty: strokeLinecap
+     * {String} Stroke cap type ("butt", "round", or "square").
+     */
+    strokeLinecap: null,
+    
+    /**
+     * Property: strokeDashstyle
+     * {String} Stroke dash style according to the SLD spec. Note that the
+     *     OpenLayers values for strokeDashstyle ("dot", "dash", "dashdot",
+     *     "longdash", "longdashdot", or "solid") will not work in SLD, but
+     *     most SLD patterns will render correctly in OpenLayers.
+     */
+    strokeDashstyle: null,
+
+    /**
+     * Constructor: OpenLayers.Symbolizer.Line
+     * Create a symbolizer for rendering lines.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new line symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Symbolizer.prototype.initialize.apply(this, arguments);
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer.Line"
+    
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Polygon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Polygon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Polygon.js	(revision 76)
@@ -0,0 +1,81 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Symbolizer.js
+ */
+
+/**
+ * Class: OpenLayers.Symbolizer.Polygon
+ * A symbolizer used to render line features.
+ */
+OpenLayers.Symbolizer.Polygon = OpenLayers.Class(OpenLayers.Symbolizer, {
+    
+    /**
+     * APIProperty: strokeColor
+     * {String} Color for line stroke.  This is a RGB hex value (e.g. "#ff0000"
+     *     for red).
+     */
+    strokeColor: null,
+    
+    /**
+     * APIProperty: strokeOpacity
+     * {Number} Stroke opacity (0-1).
+     */
+    strokeOpacity: null,
+    
+    /**
+     * APIProperty: strokeWidth
+     * {Number} Pixel stroke width.
+     */
+    strokeWidth: null,
+    
+    /**
+     * APIProperty: strokeLinecap
+     * {String} Stroke cap type ("butt", "round", or "square").
+     */
+    strokeLinecap: null,
+    
+    /**
+     * Property: strokeDashstyle
+     * {String} Stroke dash style according to the SLD spec. Note that the
+     *     OpenLayers values for strokeDashstyle ("dot", "dash", "dashdot",
+     *     "longdash", "longdashdot", or "solid") will not work in SLD, but
+     *     most SLD patterns will render correctly in OpenLayers.
+     */
+    strokeDashstyle: null,
+
+    /**
+     * APIProperty: fillColor
+     * {String} RGB hex fill color (e.g. "#ff0000" for red).
+     */
+    fillColor: null,
+    
+    /**
+     * APIProperty: fillOpacity
+     * {Number} Fill opacity (0-1).
+     */
+    fillOpacity: null, 
+
+    /**
+     * Constructor: OpenLayers.Symbolizer.Polygon
+     * Create a symbolizer for rendering polygons.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new polygon symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Symbolizer.prototype.initialize.apply(this, arguments);
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer.Polygon"
+    
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Point.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Point.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Point.js	(revision 76)
@@ -0,0 +1,141 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Symbolizer.js
+ */
+
+/**
+ * Class: OpenLayers.Symbolizer.Point
+ * A symbolizer used to render point features.
+ */
+OpenLayers.Symbolizer.Point = OpenLayers.Class(OpenLayers.Symbolizer, {
+    
+    /**
+     * APIProperty: strokeColor
+     * {String} Color for line stroke.  This is a RGB hex value (e.g. "#ff0000"
+     *     for red).
+     */
+    strokeColor: null,
+    
+    /**
+     * APIProperty: strokeOpacity
+     * {Number} Stroke opacity (0-1).
+     */
+    strokeOpacity: null,
+    
+    /**
+     * APIProperty: strokeWidth
+     * {Number} Pixel stroke width.
+     */
+    strokeWidth: null,
+    
+    /**
+     * APIProperty: strokeLinecap
+     * {String} Stroke cap type ("butt", "round", or "square").
+     */
+    strokeLinecap: null,
+    
+    /**
+     * Property: strokeDashstyle
+     * {String} Stroke dash style according to the SLD spec. Note that the
+     *     OpenLayers values for strokeDashstyle ("dot", "dash", "dashdot",
+     *     "longdash", "longdashdot", or "solid") will not work in SLD, but
+     *     most SLD patterns will render correctly in OpenLayers.
+     */
+    strokeDashstyle: null,
+
+    /**
+     * APIProperty: fillColor
+     * {String} RGB hex fill color (e.g. "#ff0000" for red).
+     */
+    fillColor: null,
+    
+    /**
+     * APIProperty: fillOpacity
+     * {Number} Fill opacity (0-1).
+     */
+    fillOpacity: null, 
+
+    /**
+     * APIProperty: pointRadius
+     * {Number} Pixel point radius.
+     */
+    pointRadius: null,
+
+    /**
+     * APIProperty: externalGraphic
+     * {String} Url to an external graphic that will be used for rendering 
+     *     points.
+     */
+    externalGraphic: null,
+    
+    /**
+     * APIProperty: graphicWidth
+     * {Number} Pixel width for sizing an external graphic.
+     */
+    graphicWidth: null,
+    
+    /**
+     * APIProperty: graphicHeight
+     * {Number} Pixel height for sizing an external graphic.
+     */
+    graphicHeight: null,
+    
+    /**
+     * APIProperty: graphicOpacity
+     * {Number} Opacity (0-1) for an external graphic.
+     */
+    graphicOpacity: null,
+    
+    /**
+     * APIProperty: graphicXOffset
+     * {Number} Pixel offset along the positive x axis for displacing an 
+     *     external graphic.
+     */
+    graphicXOffset: null,
+    
+    /**
+     * APIProperty: graphicYOffset
+     * {Number} Pixel offset along the positive y axis for displacing an 
+     *     external graphic.
+     */
+    graphicYOffset: null,
+
+    /**
+     * APIProperty: rotation
+     * {Number} The rotation of a graphic in the clockwise direction about its 
+     *     center point (or any point off center as specified by 
+     *     <graphicXOffset> and <graphicYOffset>).
+     */
+    rotation: null,
+    
+    /**
+     * APIProperty: graphicName
+     * {String} Named graphic to use when rendering points.  Supported values 
+     *     include "circle", "square", "star", "x", "cross", and "triangle".
+     */
+    graphicName: null,
+    
+    /**
+     * Constructor: OpenLayers.Symbolizer.Point
+     * Create a symbolizer for rendering points.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new point symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Symbolizer.prototype.initialize.apply(this, arguments);
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer.Point"
+    
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Raster.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Raster.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer/Raster.js	(revision 76)
@@ -0,0 +1,34 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Symbolizer.js
+ */
+
+/**
+ * Class: OpenLayers.Symbolizer.Raster
+ * A symbolizer used to render raster images.
+ */
+OpenLayers.Symbolizer.Raster = OpenLayers.Class(OpenLayers.Symbolizer, {
+    
+    /**
+     * Constructor: OpenLayers.Symbolizer.Raster
+     * Create a symbolizer for rendering rasters.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new raster symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Symbolizer.prototype.initialize.apply(this, arguments);
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer.Raster"
+    
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Filter.js	(revision 76)
@@ -0,0 +1,68 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Style.js
+ */
+
+/**
+ * Class: OpenLayers.Filter
+ * This class represents an OGC Filter.
+ */
+OpenLayers.Filter = OpenLayers.Class({
+    
+    /** 
+     * Constructor: OpenLayers.Filter
+     * This is an abstract class.  Create an instance of a filter subclass.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter>}
+     */
+    initialize: function(options) {
+        OpenLayers.Util.extend(this, options);
+    },
+
+    /** 
+     * APIMethod: destroy
+     * Remove reference to anything added.
+     */
+    destroy: function() {
+    },
+
+    /**
+     * APIMethod: evaluate
+     * Evaluates this filter in a specific context.  Should be implemented by
+     *     subclasses.
+     * 
+     * Parameters:
+     * context - {Object} Context to use in evaluating the filter.  If a vector
+     *     feature is provided, the feature.attributes will be used as context.
+     * 
+     * Returns:
+     * {Boolean} The filter applies.
+     */
+    evaluate: function(context) {
+        return true;
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this filter. Should be implementted by subclasses.
+     * 
+     * Returns:
+     * {<OpenLayers.Filter>} Clone of this filter.
+     */
+    clone: function() {
+        return null;
+    },
+    
+    CLASS_NAME: "OpenLayers.Filter"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Filter.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Filter.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Filter.js	(revision 76)
@@ -0,0 +1,164 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ * @requires OpenLayers/Filter.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Filter
+ * Strategy for limiting features that get added to a layer by 
+ *     evaluating a filter.  The strategy maintains a cache of
+ *     all features until removeFeatures is called on the layer.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Filter = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * APIProperty: filter
+     * {<OpenLayers.Filter>}  Filter for limiting features sent to the layer.
+     *     Use the <setFilter> method to update this filter after construction.
+     */
+    filter: null,
+    
+    /**
+     * Property: cache
+     * {Array(<OpenLayers.Feature.Vector>)} List of currently cached
+     *     features.
+     */
+    cache: null,
+    
+    /**
+     * Property: caching
+     * {Boolean} The filter is currently caching features.
+     */
+    caching: false,
+    
+    /**
+     * Constructor: OpenLayers.Strategy.Filter
+     * Create a new filter strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.  Strategy must be constructed with at least a <filter> 
+     *     property.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+        if (!this.filter || !(this.filter instanceof OpenLayers.Filter)) {
+            throw new Error("Filter strategy must be constructed with a filter");
+        }
+    },
+
+    /**
+     * APIMethod: activate
+     * Activate the strategy.  Register any listeners, do appropriate setup.
+     *     By default, this strategy automatically activates itself when a layer
+     *     is added to a map.
+     *
+     * Returns:
+     * {Boolean} True if the strategy was successfully activated or false if
+     *      the strategy was already active.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.apply(this, arguments);
+        if (activated) {
+            this.cache = [];
+            this.layer.events.on({
+                "beforefeaturesadded": this.handleAdd,
+                "beforefeaturesremoved": this.handleRemove,
+                scope: this
+            });
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the strategy.  Clear the feature cache.
+     *
+     * Returns:
+     * {Boolean} True if the strategy was successfully deactivated or false if
+     *      the strategy was already inactive.
+     */
+    deactivate: function() {
+        this.cache = null;
+        if (this.layer && this.layer.events) {
+            this.layer.events.un({
+                "beforefeaturesadded": this.handleAdd,
+                "beforefeaturesremoved": this.handleRemove,
+                scope: this
+            });            
+        }
+        return OpenLayers.Strategy.prototype.deactivate.apply(this, arguments);
+    },
+    
+    /**
+     * Method: handleAdd
+     */
+    handleAdd: function(event) {
+        if (!this.caching) {
+            var features = event.features;
+            event.features = [];
+            var feature;
+            for (var i=0, ii=features.length; i<ii; ++i) {
+                feature = features[i];
+                if (this.filter.evaluate(feature)) {
+                    event.features.push(feature);
+                } else {
+                    this.cache.push(feature);
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: handleRemove
+     */
+    handleRemove: function(event) {
+        if (!this.caching) {
+            this.cache = [];
+        }
+    },
+
+    /** 
+     * APIMethod: setFilter
+     * Update the filter for this strategy.  This will re-evaluate
+     *     any features on the layer and in the cache.  Only features
+     *     for which filter.evalute(feature) returns true will be
+     *     added to the layer.  Others will be cached by the strategy.
+     *
+     * Parameters:
+     * filter - <OpenLayers.Filter> A filter for evaluating features.
+     */
+    setFilter: function(filter) {
+        this.filter = filter;
+        var previousCache = this.cache;
+        this.cache = [];
+        // look through layer for features to remove from layer
+        this.handleAdd({features: this.layer.features});
+        // cache now contains features to remove from layer
+        if (this.cache.length > 0) {
+            this.caching = true;
+            this.layer.removeFeatures(this.cache.slice(), {silent: true});
+            this.caching = false;
+        }
+        // now look through previous cache for features to add to layer
+        if (previousCache.length > 0) {
+            var event = {features: previousCache};
+            this.handleAdd(event);
+            // event has features to add to layer
+            this.caching = true;
+            this.layer.addFeatures(event.features, {silent: true});
+            this.caching = false;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Strategy.Filter"
+
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Paging.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Paging.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Paging.js	(revision 76)
@@ -0,0 +1,236 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Paging
+ * Strategy for vector feature paging
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Paging = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * Property: features
+     * {Array(<OpenLayers.Feature.Vector>)} Cached features.
+     */
+    features: null,
+    
+    /**
+     * Property: length
+     * {Integer} Number of features per page.  Default is 10.
+     */
+    length: 10,
+    
+    /**
+     * Property: num
+     * {Integer} The currently displayed page number.
+     */
+    num: null,
+    
+    /**
+     * Property: paging
+     * {Boolean} The strategy is currently changing pages.
+     */
+    paging: false,
+
+    /**
+     * Constructor: OpenLayers.Strategy.Paging
+     * Create a new paging strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: activate
+     * Activate the strategy.  Register any listeners, do appropriate setup.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully activated.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.call(this);
+        if(activated) {
+            this.layer.events.on({
+                "beforefeaturesadded": this.cacheFeatures,
+                scope: this
+            });
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the strategy.  Unregister any listeners, do appropriate
+     *     tear-down.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            this.clearCache();
+            this.layer.events.un({
+                "beforefeaturesadded": this.cacheFeatures,
+                scope: this
+            });
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: cacheFeatures
+     * Cache features before they are added to the layer.
+     *
+     * Parameters:
+     * event - {Object} The event that this was listening for.  This will come
+     *     with a batch of features to be paged.
+     */
+    cacheFeatures: function(event) {
+        if(!this.paging) {
+            this.clearCache();
+            this.features = event.features;
+            this.pageNext(event);
+        }
+    },
+    
+    /**
+     * Method: clearCache
+     * Clear out the cached features.  This destroys features, assuming
+     *     nothing else has a reference.
+     */
+    clearCache: function() {
+        if(this.features) {
+            for(var i=0; i<this.features.length; ++i) {
+                this.features[i].destroy();
+            }
+        }
+        this.features = null;
+        this.num = null;
+    },
+    
+    /**
+     * APIMethod: pageCount
+     * Get the total count of pages given the current cache of features.
+     *
+     * Returns:
+     * {Integer} The page count.
+     */
+    pageCount: function() {
+        var numFeatures = this.features ? this.features.length : 0;
+        return Math.ceil(numFeatures / this.length);
+    },
+
+    /**
+     * APIMethod: pageNum
+     * Get the zero based page number.
+     *
+     * Returns:
+     * {Integer} The current page number being displayed.
+     */
+    pageNum: function() {
+        return this.num;
+    },
+
+    /**
+     * APIMethod: pageLength
+     * Gets or sets page length.
+     *
+     * Parameters:
+     * newLength: {Integer} Optional length to be set.
+     *
+     * Returns:
+     * {Integer} The length of a page (number of features per page).
+     */
+    pageLength: function(newLength) {
+        if(newLength && newLength > 0) {
+            this.length = newLength;
+        }
+        return this.length;
+    },
+
+    /**
+     * APIMethod: pageNext
+     * Display the next page of features.
+     *
+     * Returns:
+     * {Boolean} A new page was displayed.
+     */
+    pageNext: function(event) {
+        var changed = false;
+        if(this.features) {
+            if(this.num === null) {
+                this.num = -1;
+            }
+            var start = (this.num + 1) * this.length;
+            changed = this.page(start, event);
+        }
+        return changed;
+    },
+
+    /**
+     * APIMethod: pagePrevious
+     * Display the previous page of features.
+     *
+     * Returns:
+     * {Boolean} A new page was displayed.
+     */
+    pagePrevious: function() {
+        var changed = false;
+        if(this.features) {
+            if(this.num === null) {
+                this.num = this.pageCount();
+            }
+            var start = (this.num - 1) * this.length;
+            changed = this.page(start);
+        }
+        return changed;
+    },
+    
+    /**
+     * Method: page
+     * Display the page starting at the given index from the cache.
+     *
+     * Returns:
+     * {Boolean} A new page was displayed.
+     */
+    page: function(start, event) {
+        var changed = false;
+        if(this.features) {
+            if(start >= 0 && start < this.features.length) {
+                var num = Math.floor(start / this.length);
+                if(num != this.num) {
+                    this.paging = true;
+                    var features = this.features.slice(start, start + this.length);
+                    this.layer.removeFeatures(this.layer.features);
+                    this.num = num;
+                    // modify the event if any
+                    if(event && event.features) {
+                        // this.was called by an event listener
+                        event.features = features;
+                    } else {
+                        // this was called directly on the strategy
+                        this.layer.addFeatures(features);
+                    }
+                    this.paging = false;
+                    changed = true;
+                }
+            }
+        }
+        return changed;
+    },
+    
+    CLASS_NAME: "OpenLayers.Strategy.Paging" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/BBOX.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/BBOX.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/BBOX.js	(revision 76)
@@ -0,0 +1,278 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ * @requires OpenLayers/Filter/Spatial.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.BBOX
+ * A simple strategy that reads new features when the viewport invalidates
+ *     some bounds.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.BBOX = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * Property: bounds
+     * {<OpenLayers.Bounds>} The current data bounds (in the same projection
+     *     as the layer - not always the same projection as the map).
+     */
+    bounds: null,
+    
+    /** 
+     * Property: resolution 
+     * {Float} The current data resolution. 
+     */ 
+    resolution: null, 
+           
+    /**
+     * APIProperty: ratio
+     * {Float} The ratio of the data bounds to the viewport bounds (in each
+     *     dimension).  Default is 2.
+     */
+    ratio: 2,
+
+    /** 
+     * Property: resFactor 
+     * {Float} Optional factor used to determine when previously requested 
+     *     features are invalid.  If set, the resFactor will be compared to the
+     *     resolution of the previous request to the current map resolution.
+     *     If resFactor > (old / new) and 1/resFactor < (old / new).  If you
+     *     set a resFactor of 1, data will be requested every time the
+     *     resolution changes.  If you set a resFactor of 3, data will be
+     *     requested if the old resolution is 3 times the new, or if the new is
+     *     3 times the old.  If the old bounds do not contain the new bounds
+     *     new data will always be requested (with or without considering
+     *     resFactor). 
+     */ 
+    resFactor: null, 
+    
+    /**
+     * Property: response
+     * {<OpenLayers.Protocol.Response>} The protocol response object returned
+     *      by the layer protocol.
+     */
+    response: null,
+
+    /**
+     * Constructor: OpenLayers.Strategy.BBOX
+     * Create a new BBOX strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: activate
+     * Set up strategy with regard to reading new batches of remote data.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully activated.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.call(this);
+        if(activated) {
+            this.layer.events.on({
+                "moveend": this.update,
+                scope: this
+            });
+            this.layer.events.on({
+                "refresh": this.update,
+                scope: this
+            });
+        }
+        return activated;
+    },
+    
+    /**
+     * Method: deactivate
+     * Tear down strategy with regard to reading new batches of remote data.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            this.layer.events.un({
+                "moveend": this.update,
+                scope: this
+            });
+            this.layer.events.un({
+                "refresh": this.update,
+                scope: this
+            });
+        }
+        return deactivated;
+    },
+
+    /**
+     * Method: update
+     * Callback function called on "moveend" or "refresh" layer events.
+     *
+     * Parameters:
+     * options - {Object} An object with a property named "force", this
+     *      property references a boolean value indicating if new data
+     *      must be incondtionally read.
+     */
+    update: function(options) {
+        var mapBounds = this.getMapBounds();
+        if ((options && options.force) || this.invalidBounds(mapBounds)) {
+            this.calculateBounds(mapBounds);
+            this.resolution = this.layer.map.getResolution(); 
+            this.triggerRead();
+        }
+    },
+    
+    /**
+     * Method: getMapBounds
+     * Get the map bounds expressed in the same projection as this layer.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} Map bounds in the projection of the layer.
+     */
+    getMapBounds: function() {
+        var bounds = this.layer.map.getExtent();
+        if(!this.layer.projection.equals(this.layer.map.getProjectionObject())) {
+            bounds = bounds.clone().transform(
+                this.layer.map.getProjectionObject(), this.layer.projection
+            );
+        }
+        return bounds;
+    },
+
+    /**
+     * Method: invalidBounds
+     * Determine whether the previously requested set of features is invalid. 
+     *     This occurs when the new map bounds do not contain the previously 
+     *     requested bounds.  In addition, if <resFactor> is set, it will be 
+     *     considered.
+     *
+     * Parameters:
+     * mapBounds - {<OpenLayers.Bounds>} the current map extent, will be
+     *      retrieved from the map object if not provided
+     *
+     * Returns:
+     * {Boolean} 
+     */
+    invalidBounds: function(mapBounds) {
+        if(!mapBounds) {
+            mapBounds = this.getMapBounds();
+        }
+        var invalid = !this.bounds || !this.bounds.containsBounds(mapBounds);
+        if(!invalid && this.resFactor) {
+            var ratio = this.resolution / this.layer.map.getResolution();
+            invalid = (ratio >= this.resFactor || ratio <= (1 / this.resFactor));
+        }
+        return invalid;
+    },
+ 
+    /**
+     * Method: calculateBounds
+     *
+     * Parameters:
+     * mapBounds - {<OpenLayers.Bounds>} the current map extent, will be
+     *      retrieved from the map object if not provided
+     */
+    calculateBounds: function(mapBounds) {
+        if(!mapBounds) {
+            mapBounds = this.getMapBounds();
+        }
+        var center = mapBounds.getCenterLonLat();
+        var dataWidth = mapBounds.getWidth() * this.ratio;
+        var dataHeight = mapBounds.getHeight() * this.ratio;
+        this.bounds = new OpenLayers.Bounds(
+            center.lon - (dataWidth / 2),
+            center.lat - (dataHeight / 2),
+            center.lon + (dataWidth / 2),
+            center.lat + (dataHeight / 2)
+        );
+    },
+    
+    /**
+     * Method: triggerRead
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} The protocol response object
+     *      returned by the layer protocol.
+     */
+    triggerRead: function() {
+        if (this.response) {
+            this.layer.protocol.abort(this.response);
+            this.layer.events.triggerEvent("loadend");
+        }
+        this.layer.events.triggerEvent("loadstart");
+        this.response = this.layer.protocol.read({
+            filter: this.createFilter(),
+            callback: this.merge,
+            scope: this
+        });
+    },
+ 
+    /**
+     * Method: createFilter
+     * Creates a spatial BBOX filter. If the layer that this strategy belongs
+     * to has a filter property, this filter will be combined with the BBOX 
+     * filter.
+     * 
+     * Returns
+     * {<OpenLayers.Filter>} The filter object.
+     */
+    createFilter: function() {
+        var filter = new OpenLayers.Filter.Spatial({
+            type: OpenLayers.Filter.Spatial.BBOX,
+            value: this.bounds,
+            projection: this.layer.projection
+        });
+        if (this.layer.filter) {
+            filter = new OpenLayers.Filter.Logical({
+                type: OpenLayers.Filter.Logical.AND,
+                filters: [this.layer.filter, filter]
+            });
+        }
+        return filter;
+    },
+   
+    /**
+     * Method: merge
+     * Given a list of features, determine which ones to add to the layer.
+     *     If the layer projection differs from the map projection, features
+     *     will be transformed from the layer projection to the map projection.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object passed
+     *      by the protocol.
+     */
+    merge: function(resp) {
+        this.layer.destroyFeatures();
+        var features = resp.features;
+        if(features && features.length > 0) {
+            var remote = this.layer.projection;
+            var local = this.layer.map.getProjectionObject();
+            if(!local.equals(remote)) {
+                var geom;
+                for(var i=0, len=features.length; i<len; ++i) {
+                    geom = features[i].geometry;
+                    if(geom) {
+                        geom.transform(remote, local);
+                    }
+                }
+            }
+            this.layer.addFeatures(features);
+        }
+        this.response = null;
+        this.layer.events.triggerEvent("loadend");
+    },
+   
+    CLASS_NAME: "OpenLayers.Strategy.BBOX" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Refresh.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Refresh.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Refresh.js	(revision 76)
@@ -0,0 +1,140 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Refresh
+ * A strategy that refreshes the layer. By default the strategy waits for a
+ *     call to <refresh> before refreshing.  By configuring the strategy with 
+ *     the <interval> option, refreshing can take place automatically.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Refresh = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * Property: force
+     * {Boolean} Force a refresh on the layer. Default is false.
+     */
+    force: false,
+
+    /**
+     * Property: interval
+     * {Number} Auto-refresh. Default is 0.  If > 0, layer will be refreshed 
+     *     every N milliseconds.
+     */
+    interval: 0,
+    
+    /**
+     * Property: timer
+     * {Number} The id of the timer.
+     */
+    timer: null,
+
+    /**
+     * Constructor: OpenLayers.Strategy.Refresh
+     * Create a new Refresh strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+    },
+   
+    /**
+     * APIMethod: activate
+     * Activate the strategy. Register any listeners, do appropriate setup.
+     * 
+     * Returns:
+     * {Boolean} True if the strategy was successfully activated.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.call(this);
+        if(activated) {
+            if(this.layer.visibility === true) {
+                this.start();
+            } 
+            this.layer.events.on({
+                "visibilitychanged": this.reset,
+                scope: this
+            });
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the strategy. Unregister any listeners, do appropriate
+     *     tear-down.
+     * 
+     * Returns:
+     * {Boolean} True if the strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            this.stop();
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: reset
+     * Start or cancel the refresh interval depending on the visibility of 
+     *     the layer.
+     */
+    reset: function() {
+        if(this.layer.visibility === true) {
+            this.start();
+        } else {
+            this.stop();
+        }
+    },
+    
+    /**
+     * Method: start
+     * Start the refresh interval. 
+     */
+    start: function() {
+        if(this.interval && typeof this.interval === "number" && 
+            this.interval > 0) {
+
+            this.timer = window.setInterval(
+                OpenLayers.Function.bind(this.refresh, this),
+                this.interval);
+        }
+    },
+    
+    /**
+     * APIMethod: refresh
+     * Tell the strategy to refresh which will refresh the layer.
+     */
+    refresh: function() {
+        if (this.layer && this.layer.refresh && 
+            typeof this.layer.refresh == "function") {
+
+            this.layer.refresh({force: this.force});
+        }
+    },
+   
+    /**
+     * Method: stop
+     * Cancels the refresh interval. 
+     */
+    stop: function() {
+        if(this.timer !== null) {
+            window.clearInterval(this.timer);
+            this.timer = null;
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Strategy.Refresh" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Save.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Save.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Save.js	(revision 76)
@@ -0,0 +1,229 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Save
+ * A strategy that commits newly created or modified features.  By default
+ *     the strategy waits for a call to <save> before persisting changes.  By
+ *     configuring the strategy with the <auto> option, changes can be saved
+ *     automatically.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Save = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * strategy.events.register(type, obj, listener);
+     * (end)
+     *
+     *  - *start* Triggered before saving
+     *  - *success* Triggered after a successful transaction
+     *  - *fail* Triggered after a failed transaction
+     *      
+     */
+    EVENT_TYPES: ["start", "success", "fail"],
+ 
+    /** 
+     * Property: events
+     * {<OpenLayers.Events>} Events instance for triggering this protocol
+     *    events.
+     */
+    events: null,
+    
+    /**
+     * APIProperty: auto
+     * {Boolean | Number} Auto-save.  Default is false.  If true, features will be
+     *     saved immediately after being added to the layer and with each
+     *     modification or deletion.  If auto is a number, features will be
+     *     saved on an interval provided by the value (in seconds).
+     */
+    auto: false,
+    
+    /**
+     * Property: timer
+     * {Number} The id of the timer.
+     */
+    timer: null,
+
+    /**
+     * Constructor: OpenLayers.Strategy.Save
+     * Create a new Save strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+        this.events = new OpenLayers.Events(this, null, this.EVENT_TYPES);
+    },
+   
+    /**
+     * APIMethod: activate
+     * Activate the strategy.  Register any listeners, do appropriate setup.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully activated.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.call(this);
+        if(activated) {
+            if(this.auto) {
+                if(typeof this.auto === "number") {
+                    this.timer = window.setInterval(
+                        OpenLayers.Function.bind(this.save, this),
+                        this.auto * 1000
+                    );
+                } else {
+                    this.layer.events.on({
+                        "featureadded": this.triggerSave,
+                        "afterfeaturemodified": this.triggerSave,
+                        scope: this
+                    });
+                }
+            }
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the strategy.  Unregister any listeners, do appropriate
+     *     tear-down.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            if(this.auto) {
+                if(typeof this.auto === "number") {
+                    window.clearInterval(this.timer);
+                } else {
+                    this.layer.events.un({
+                        "featureadded": this.triggerSave,
+                        "afterfeaturemodified": this.triggerSave,
+                        scope: this
+                    });
+                }
+            }
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: triggerSave
+     * Registered as a listener.  Calls save if a feature has insert, update,
+     *     or delete state.
+     *
+     * Parameters:
+     * event - {Object} The event this function is listening for.
+     */
+    triggerSave: function(event) {
+        var feature = event.feature;
+        if(feature.state === OpenLayers.State.INSERT ||
+           feature.state === OpenLayers.State.UPDATE ||
+           feature.state === OpenLayers.State.DELETE) {
+            this.save([event.feature]);
+        }
+    },
+    
+    /**
+     * APIMethod: save
+     * Tell the layer protocol to commit unsaved features.  If the layer
+     *     projection differs from the map projection, features will be
+     *     transformed into the layer projection before being committed.
+     *
+     * Parameters:
+     * features - {Array} Features to be saved.  If null, then default is all
+     *     features in the layer.  Features are assumed to be in the map
+     *     projection.
+     */
+    save: function(features) {
+        if(!features) {
+            features = this.layer.features;
+        }
+        this.events.triggerEvent("start", {features:features});
+        var remote = this.layer.projection;
+        var local = this.layer.map.getProjectionObject();
+        if(!local.equals(remote)) {
+            var len = features.length;
+            var clones = new Array(len);
+            var orig, clone;
+            for(var i=0; i<len; ++i) {
+                orig = features[i];
+                clone = orig.clone();
+                clone.fid = orig.fid;
+                clone.state = orig.state;
+                if(orig.url) {
+                    clone.url = orig.url;
+                }
+                clone._original = orig;
+                clone.geometry.transform(local, remote);
+                clones[i] = clone;
+            }
+            features = clones;
+        }
+        this.layer.protocol.commit(features, {
+            callback: this.onCommit,
+            scope: this
+        });
+    },
+    
+    /**
+     * Method: onCommit
+     * Called after protocol commit.
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>} A response object.
+     */
+    onCommit: function(response) {
+        var evt = {"response": response};
+        if(response.success()) {
+            var features = response.reqFeatures;
+            // deal with inserts, updates, and deletes
+            var state, feature;
+            var destroys = [];
+            var insertIds = response.insertIds || [];
+            var j = 0;
+            for(var i=0, len=features.length; i<len; ++i) {
+                feature = features[i];
+                // if projection was different, we may be dealing with clones
+                feature = feature._original || feature;
+                state = feature.state;
+                if(state) {
+                    if(state == OpenLayers.State.DELETE) {
+                        destroys.push(feature);
+                    } else if(state == OpenLayers.State.INSERT) {
+                        feature.fid = insertIds[j];
+                        ++j;
+                    }
+                    feature.state = null;
+                }
+            }
+
+            if(destroys.length > 0) {
+                this.layer.destroyFeatures(destroys);
+            }
+
+            this.events.triggerEvent("success", evt);
+
+        } else {
+            this.events.triggerEvent("fail", evt);
+        }
+    },
+   
+    CLASS_NAME: "OpenLayers.Strategy.Save" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Fixed.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Fixed.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Fixed.js	(revision 76)
@@ -0,0 +1,138 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Fixed
+ * A simple strategy that requests features once and never requests new data.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Fixed = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * APIProperty: preload
+     * {Boolean} Load data before layer made visible. Enabling this may result
+     *   in considerable overhead if your application loads many data layers
+     *   that are not visible by default. Default is false.
+     */
+    preload: false,
+
+    /**
+     * Constructor: OpenLayers.Strategy.Fixed
+     * Create a new Fixed strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: destroy
+     * Clean up the strategy.
+     */
+    destroy: function() {
+        OpenLayers.Strategy.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: activate
+     * Activate the strategy: load data or add listener to load when visible
+     *
+     * Returns:
+     * {Boolean} True if the strategy was successfully activated or false if
+     *      the strategy was already active.
+     */
+    activate: function() {
+        if(OpenLayers.Strategy.prototype.activate.apply(this, arguments)) {
+            this.layer.events.on({
+                "refresh": this.load,
+                scope: this
+            });
+            if(this.layer.visibility == true || this.preload) {
+                this.load();
+            } else {
+                this.layer.events.on({
+                    "visibilitychanged": this.load,
+                    scope: this
+                });
+            }
+            return true;
+        }
+        return false;
+    },
+    
+    /**
+     * Method: deactivate
+     * Deactivate the strategy.  Undo what is done in <activate>.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            this.layer.events.un({
+                "refresh": this.load,
+                "visibilitychanged": this.load,
+                scope: this
+            });
+        }
+        return deactivated;
+    },
+
+    /**
+     * Method: load
+     * Tells protocol to load data and unhooks the visibilitychanged event
+     *
+     * Parameters:
+     * options - {Object} options to pass to protocol read.
+     */
+    load: function(options) {
+        this.layer.events.triggerEvent("loadstart");
+        this.layer.protocol.read(OpenLayers.Util.applyDefaults({
+            callback: this.merge,
+            filter: this.layer.filter,
+            scope: this
+        }, options));
+        this.layer.events.un({
+            "visibilitychanged": this.load,
+            scope: this
+        });
+    },
+
+    /**
+     * Method: merge
+     * Add all features to the layer.
+     */
+    merge: function(resp) {
+        this.layer.destroyFeatures();
+        var features = resp.features;
+        if (features && features.length > 0) {
+            var remote = this.layer.projection;
+            var local = this.layer.map.getProjectionObject();
+            if(!local.equals(remote)) {
+                var geom;
+                for(var i=0, len=features.length; i<len; ++i) {
+                    geom = features[i].geometry;
+                    if(geom) {
+                        geom.transform(remote, local);
+                    }
+                }
+            }
+            this.layer.addFeatures(features);
+        }
+        this.layer.events.triggerEvent("loadend");
+    },
+
+    CLASS_NAME: "OpenLayers.Strategy.Fixed"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Cluster.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Cluster.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy/Cluster.js	(revision 76)
@@ -0,0 +1,280 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Strategy.js
+ */
+
+/**
+ * Class: OpenLayers.Strategy.Cluster
+ * Strategy for vector feature clustering.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Strategy>
+ */
+OpenLayers.Strategy.Cluster = OpenLayers.Class(OpenLayers.Strategy, {
+    
+    /**
+     * APIProperty: distance
+     * {Integer} Pixel distance between features that should be considered a
+     *     single cluster.  Default is 20 pixels.
+     */
+    distance: 20,
+    
+    /**
+     * APIProperty: threshold
+     * {Integer} Optional threshold below which original features will be
+     *     added to the layer instead of clusters.  For example, a threshold
+     *     of 3 would mean that any time there are 2 or fewer features in
+     *     a cluster, those features will be added directly to the layer instead
+     *     of a cluster representing those features.  Default is null (which is
+     *     equivalent to 1 - meaning that clusters may contain just one feature).
+     */
+    threshold: null,
+    
+    /**
+     * Property: features
+     * {Array(<OpenLayers.Feature.Vector>)} Cached features.
+     */
+    features: null,
+    
+    /**
+     * Property: clusters
+     * {Array(<OpenLayers.Feature.Vector>)} Calculated clusters.
+     */
+    clusters: null,
+    
+    /**
+     * Property: clustering
+     * {Boolean} The strategy is currently clustering features.
+     */
+    clustering: false,
+    
+    /**
+     * Property: resolution
+     * {Float} The resolution (map units per pixel) of the current cluster set.
+     */
+    resolution: null,
+
+    /**
+     * Constructor: OpenLayers.Strategy.Cluster
+     * Create a new clustering strategy.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Strategy.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: activate
+     * Activate the strategy.  Register any listeners, do appropriate setup.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully activated.
+     */
+    activate: function() {
+        var activated = OpenLayers.Strategy.prototype.activate.call(this);
+        if(activated) {
+            this.layer.events.on({
+                "beforefeaturesadded": this.cacheFeatures,
+                "moveend": this.cluster,
+                scope: this
+            });
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the strategy.  Unregister any listeners, do appropriate
+     *     tear-down.
+     * 
+     * Returns:
+     * {Boolean} The strategy was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Strategy.prototype.deactivate.call(this);
+        if(deactivated) {
+            this.clearCache();
+            this.layer.events.un({
+                "beforefeaturesadded": this.cacheFeatures,
+                "moveend": this.cluster,
+                scope: this
+            });
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: cacheFeatures
+     * Cache features before they are added to the layer.
+     *
+     * Parameters:
+     * event - {Object} The event that this was listening for.  This will come
+     *     with a batch of features to be clustered.
+     *     
+     * Returns:
+     * {Boolean} False to stop features from being added to the layer.
+     */
+    cacheFeatures: function(event) {
+        var propagate = true;
+        if(!this.clustering) {
+            this.clearCache();
+            this.features = event.features;
+            this.cluster();
+            propagate = false;
+        }
+        return propagate;
+    },
+    
+    /**
+     * Method: clearCache
+     * Clear out the cached features.
+     */
+    clearCache: function() {
+        this.features = null;
+    },
+    
+    /**
+     * Method: cluster
+     * Cluster features based on some threshold distance.
+     *
+     * Parameters:
+     * event - {Object} The event received when cluster is called as a
+     *     result of a moveend event.
+     */
+    cluster: function(event) {
+        if((!event || event.zoomChanged) && this.features) {
+            var resolution = this.layer.map.getResolution();
+            if(resolution != this.resolution || !this.clustersExist()) {
+                this.resolution = resolution;
+                var clusters = [];
+                var feature, clustered, cluster;
+                for(var i=0; i<this.features.length; ++i) {
+                    feature = this.features[i];
+                    if(feature.geometry) {
+                        clustered = false;
+                        for(var j=clusters.length-1; j>=0; --j) {
+                            cluster = clusters[j];
+                            if(this.shouldCluster(cluster, feature)) {
+                                this.addToCluster(cluster, feature);
+                                clustered = true;
+                                break;
+                            }
+                        }
+                        if(!clustered) {
+                            clusters.push(this.createCluster(this.features[i]));
+                        }
+                    }
+                }
+                this.layer.removeAllFeatures();
+                if(clusters.length > 0) {
+                    if(this.threshold > 1) {
+                        var clone = clusters.slice();
+                        clusters = [];
+                        var candidate;
+                        for(var i=0, len=clone.length; i<len; ++i) {
+                            candidate = clone[i];
+                            if(candidate.attributes.count < this.threshold) {
+                                Array.prototype.push.apply(clusters, candidate.cluster);
+                            } else {
+                                clusters.push(candidate);
+                            }
+                        }
+                    }
+                    this.clustering = true;
+                    // A legitimate feature addition could occur during this
+                    // addFeatures call.  For clustering to behave well, features
+                    // should be removed from a layer before requesting a new batch.
+                    this.layer.addFeatures(clusters);
+                    this.clustering = false;
+                }
+                this.clusters = clusters;
+            }
+        }
+    },
+    
+    /**
+     * Method: clustersExist
+     * Determine whether calculated clusters are already on the layer.
+     *
+     * Returns:
+     * {Boolean} The calculated clusters are already on the layer.
+     */
+    clustersExist: function() {
+        var exist = false;
+        if(this.clusters && this.clusters.length > 0 &&
+           this.clusters.length == this.layer.features.length) {
+            exist = true;
+            for(var i=0; i<this.clusters.length; ++i) {
+                if(this.clusters[i] != this.layer.features[i]) {
+                    exist = false;
+                    break;
+                }
+            }
+        }
+        return exist;
+    },
+    
+    /**
+     * Method: shouldCluster
+     * Determine whether to include a feature in a given cluster.
+     *
+     * Parameters:
+     * cluster - {<OpenLayers.Feature.Vector>} A cluster.
+     * feature - {<OpenLayers.Feature.Vector>} A feature.
+     *
+     * Returns:
+     * {Boolean} The feature should be included in the cluster.
+     */
+    shouldCluster: function(cluster, feature) {
+        var cc = cluster.geometry.getBounds().getCenterLonLat();
+        var fc = feature.geometry.getBounds().getCenterLonLat();
+        var distance = (
+            Math.sqrt(
+                Math.pow((cc.lon - fc.lon), 2) + Math.pow((cc.lat - fc.lat), 2)
+            ) / this.resolution
+        );
+        return (distance <= this.distance);
+    },
+    
+    /**
+     * Method: addToCluster
+     * Add a feature to a cluster.
+     *
+     * Parameters:
+     * cluster - {<OpenLayers.Feature.Vector>} A cluster.
+     * feature - {<OpenLayers.Feature.Vector>} A feature.
+     */
+    addToCluster: function(cluster, feature) {
+        cluster.cluster.push(feature);
+        cluster.attributes.count += 1;
+    },
+    
+    /**
+     * Method: createCluster
+     * Given a feature, create a cluster.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A cluster.
+     */
+    createCluster: function(feature) {
+        var center = feature.geometry.getBounds().getCenterLonLat();
+        var cluster = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(center.lon, center.lat),
+            {count: 1}
+        );
+        cluster.cluster = [feature];
+        return cluster;
+    },
+
+    CLASS_NAME: "OpenLayers.Strategy.Cluster" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/FramedCloud.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/FramedCloud.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/FramedCloud.js	(revision 76)
@@ -0,0 +1,231 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Popup/Framed.js
+ * @requires OpenLayers/Util.js
+ */
+
+/**
+ * Class: OpenLayers.Popup.FramedCloud
+ * 
+ * Inherits from: 
+ *  - <OpenLayers.Popup.Framed>
+ */
+OpenLayers.Popup.FramedCloud = 
+  OpenLayers.Class(OpenLayers.Popup.Framed, {
+
+    /** 
+     * Property: contentDisplayClass
+     * {String} The CSS class of the popup content div.
+     */
+    contentDisplayClass: "olFramedCloudPopupContent",
+
+    /**
+     * APIProperty: autoSize
+     * {Boolean} Framed Cloud is autosizing by default.
+     */
+    autoSize: true,
+
+    /**
+     * APIProperty: panMapIfOutOfView
+     * {Boolean} Framed Cloud does pan into view by default.
+     */
+    panMapIfOutOfView: true,
+
+    /**
+     * APIProperty: imageSize
+     * {<OpenLayers.Size>}
+     */
+    imageSize: new OpenLayers.Size(1276, 736),
+
+    /**
+     * APIProperty: isAlphaImage
+     * {Boolean} The FramedCloud does not use an alpha image (in honor of the 
+     *     good ie6 folk out there)
+     */
+    isAlphaImage: false,
+
+    /** 
+     * APIProperty: fixedRelativePosition
+     * {Boolean} The Framed Cloud popup works in just one fixed position.
+     */
+    fixedRelativePosition: false,
+
+    /**
+     * Property: positionBlocks
+     * {Object} Hash of differen position blocks, keyed by relativePosition
+     *     two-character code string (ie "tl", "tr", "bl", "br")
+     */
+    positionBlocks: {
+        "tl": {
+            'offset': new OpenLayers.Pixel(44, 0),
+            'padding': new OpenLayers.Bounds(8, 40, 8, 9),
+            'blocks': [
+                { // top-left
+                    size: new OpenLayers.Size('auto', 'auto'),
+                    anchor: new OpenLayers.Bounds(0, 51, 22, 0),
+                    position: new OpenLayers.Pixel(0, 0)
+                },
+                { //top-right
+                    size: new OpenLayers.Size(22, 'auto'),
+                    anchor: new OpenLayers.Bounds(null, 50, 0, 0),
+                    position: new OpenLayers.Pixel(-1238, 0)
+                },
+                { //bottom-left
+                    size: new OpenLayers.Size('auto', 19),
+                    anchor: new OpenLayers.Bounds(0, 32, 22, null),
+                    position: new OpenLayers.Pixel(0, -631)
+                },
+                { //bottom-right
+                    size: new OpenLayers.Size(22, 18),
+                    anchor: new OpenLayers.Bounds(null, 32, 0, null),
+                    position: new OpenLayers.Pixel(-1238, -632)
+                },
+                { // stem
+                    size: new OpenLayers.Size(81, 35),
+                    anchor: new OpenLayers.Bounds(null, 0, 0, null),
+                    position: new OpenLayers.Pixel(0, -688)
+                }
+            ]
+        },
+        "tr": {
+            'offset': new OpenLayers.Pixel(-45, 0),
+            'padding': new OpenLayers.Bounds(8, 40, 8, 9),
+            'blocks': [
+                { // top-left
+                    size: new OpenLayers.Size('auto', 'auto'),
+                    anchor: new OpenLayers.Bounds(0, 51, 22, 0),
+                    position: new OpenLayers.Pixel(0, 0)
+                },
+                { //top-right
+                    size: new OpenLayers.Size(22, 'auto'),
+                    anchor: new OpenLayers.Bounds(null, 50, 0, 0),
+                    position: new OpenLayers.Pixel(-1238, 0)
+                },
+                { //bottom-left
+                    size: new OpenLayers.Size('auto', 19),
+                    anchor: new OpenLayers.Bounds(0, 32, 22, null),
+                    position: new OpenLayers.Pixel(0, -631)
+                },
+                { //bottom-right
+                    size: new OpenLayers.Size(22, 19),
+                    anchor: new OpenLayers.Bounds(null, 32, 0, null),
+                    position: new OpenLayers.Pixel(-1238, -631)
+                },
+                { // stem
+                    size: new OpenLayers.Size(81, 35),
+                    anchor: new OpenLayers.Bounds(0, 0, null, null),
+                    position: new OpenLayers.Pixel(-215, -687)
+                }
+            ]
+        },
+        "bl": {
+            'offset': new OpenLayers.Pixel(45, 0),
+            'padding': new OpenLayers.Bounds(8, 9, 8, 40),
+            'blocks': [
+                { // top-left
+                    size: new OpenLayers.Size('auto', 'auto'),
+                    anchor: new OpenLayers.Bounds(0, 21, 22, 32),
+                    position: new OpenLayers.Pixel(0, 0)
+                },
+                { //top-right
+                    size: new OpenLayers.Size(22, 'auto'),
+                    anchor: new OpenLayers.Bounds(null, 21, 0, 32),
+                    position: new OpenLayers.Pixel(-1238, 0)
+                },
+                { //bottom-left
+                    size: new OpenLayers.Size('auto', 21),
+                    anchor: new OpenLayers.Bounds(0, 0, 22, null),
+                    position: new OpenLayers.Pixel(0, -629)
+                },
+                { //bottom-right
+                    size: new OpenLayers.Size(22, 21),
+                    anchor: new OpenLayers.Bounds(null, 0, 0, null),
+                    position: new OpenLayers.Pixel(-1238, -629)
+                },
+                { // stem
+                    size: new OpenLayers.Size(81, 33),
+                    anchor: new OpenLayers.Bounds(null, null, 0, 0),
+                    position: new OpenLayers.Pixel(-101, -674)
+                }
+            ]
+        },
+        "br": {
+            'offset': new OpenLayers.Pixel(-44, 0),
+            'padding': new OpenLayers.Bounds(8, 9, 8, 40),
+            'blocks': [
+                { // top-left
+                    size: new OpenLayers.Size('auto', 'auto'),
+                    anchor: new OpenLayers.Bounds(0, 21, 22, 32),
+                    position: new OpenLayers.Pixel(0, 0)
+                },
+                { //top-right
+                    size: new OpenLayers.Size(22, 'auto'),
+                    anchor: new OpenLayers.Bounds(null, 21, 0, 32),
+                    position: new OpenLayers.Pixel(-1238, 0)
+                },
+                { //bottom-left
+                    size: new OpenLayers.Size('auto', 21),
+                    anchor: new OpenLayers.Bounds(0, 0, 22, null),
+                    position: new OpenLayers.Pixel(0, -629)
+                },
+                { //bottom-right
+                    size: new OpenLayers.Size(22, 21),
+                    anchor: new OpenLayers.Bounds(null, 0, 0, null),
+                    position: new OpenLayers.Pixel(-1238, -629)
+                },
+                { // stem
+                    size: new OpenLayers.Size(81, 33),
+                    anchor: new OpenLayers.Bounds(0, null, null, 0),
+                    position: new OpenLayers.Pixel(-311, -674)
+                }
+            ]
+        }
+    },
+
+    /**
+     * APIProperty: minSize
+     * {<OpenLayers.Size>}
+     */
+    minSize: new OpenLayers.Size(105, 10),
+
+    /**
+     * APIProperty: maxSize
+     * {<OpenLayers.Size>}
+     */
+    maxSize: new OpenLayers.Size(1200, 660),
+
+    /** 
+     * Constructor: OpenLayers.Popup.FramedCloud
+     * 
+     * Parameters:
+     * id - {String}
+     * lonlat - {<OpenLayers.LonLat>}
+     * contentSize - {<OpenLayers.Size>}
+     * contentHTML - {String}
+     * anchor - {Object} Object to which we'll anchor the popup. Must expose 
+     *     a 'size' (<OpenLayers.Size>) and 'offset' (<OpenLayers.Pixel>) 
+     *     (Note that this is generally an <OpenLayers.Icon>).
+     * closeBox - {Boolean}
+     * closeBoxCallback - {Function} Function to be called on closeBox click.
+     */
+    initialize:function(id, lonlat, contentSize, contentHTML, anchor, closeBox, 
+                        closeBoxCallback) {
+
+        this.imageSrc = OpenLayers.Util.getImagesLocation() + 'cloud-popup-relative.png';
+        OpenLayers.Popup.Framed.prototype.initialize.apply(this, arguments);
+        this.contentDiv.className = this.contentDisplayClass;
+    },
+
+    /** 
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        OpenLayers.Popup.Framed.prototype.destroy.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Popup.FramedCloud"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Framed.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Framed.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Framed.js	(revision 76)
@@ -0,0 +1,343 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Popup/Anchored.js
+ */
+
+/**
+ * Class: OpenLayers.Popup.Framed
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Popup.Anchored>
+ */
+OpenLayers.Popup.Framed =
+  OpenLayers.Class(OpenLayers.Popup.Anchored, {
+
+    /**
+     * Property: imageSrc
+     * {String} location of the image to be used as the popup frame
+     */
+    imageSrc: null,
+
+    /**
+     * Property: imageSize
+     * {<OpenLayers.Size>} Size (measured in pixels) of the image located
+     *     by the 'imageSrc' property.
+     */
+    imageSize: null,
+
+    /**
+     * APIProperty: isAlphaImage
+     * {Boolean} The image has some alpha and thus needs to use the alpha 
+     *     image hack. Note that setting this to true will have no noticeable
+     *     effect in FF or IE7 browsers, but will all but crush the ie6 
+     *     browser. 
+     *     Default is false.
+     */
+    isAlphaImage: false,
+
+    /**
+     * Property: positionBlocks
+     * {Object} Hash of different position blocks (Object/Hashs). Each block 
+     *     will be keyed by a two-character 'relativePosition' 
+     *     code string (ie "tl", "tr", "bl", "br"). Block properties are 
+     *     'offset', 'padding' (self-explanatory), and finally the 'blocks'
+     *     parameter, which is an array of the block objects. 
+     * 
+     *     Each block object must have 'size', 'anchor', and 'position' 
+     *     properties.
+     * 
+     *     Note that positionBlocks should never be modified at runtime.
+     */
+    positionBlocks: null,
+
+    /**
+     * Property: blocks
+     * {Array[Object]} Array of objects, each of which is one "block" of the 
+     *     popup. Each block has a 'div' and an 'image' property, both of 
+     *     which are DOMElements, and the latter of which is appended to the 
+     *     former. These are reused as the popup goes changing positions for
+     *     great economy and elegance.
+     */
+    blocks: null,
+
+    /** 
+     * APIProperty: fixedRelativePosition
+     * {Boolean} We want the framed popup to work dynamically placed relative
+     *     to its anchor but also in just one fixed position. A well designed
+     *     framed popup will have the pixels and logic to display itself in 
+     *     any of the four relative positions, but (understandably), this will
+     *     not be the case for all of them. By setting this property to 'true', 
+     *     framed popup will not recalculate for the best placement each time
+     *     it's open, but will always open the same way. 
+     *     Note that if this is set to true, it is generally advisable to also
+     *     set the 'panIntoView' property to true so that the popup can be 
+     *     scrolled into view (since it will often be offscreen on open)
+     *     Default is false.
+     */
+    fixedRelativePosition: false,
+
+    /** 
+     * Constructor: OpenLayers.Popup.Framed
+     * 
+     * Parameters:
+     * id - {String}
+     * lonlat - {<OpenLayers.LonLat>}
+     * contentSize - {<OpenLayers.Size>}
+     * contentHTML - {String}
+     * anchor - {Object} Object to which we'll anchor the popup. Must expose 
+     *     a 'size' (<OpenLayers.Size>) and 'offset' (<OpenLayers.Pixel>) 
+     *     (Note that this is generally an <OpenLayers.Icon>).
+     * closeBox - {Boolean}
+     * closeBoxCallback - {Function} Function to be called on closeBox click.
+     */
+    initialize:function(id, lonlat, contentSize, contentHTML, anchor, closeBox, 
+                        closeBoxCallback) {
+
+        OpenLayers.Popup.Anchored.prototype.initialize.apply(this, arguments);
+
+        if (this.fixedRelativePosition) {
+            //based on our decided relativePostion, set the current padding
+            // this keeps us from getting into trouble 
+            this.updateRelativePosition();
+            
+            //make calculateRelativePosition always return the specified
+            // fixed position.
+            this.calculateRelativePosition = function(px) {
+                return this.relativePosition;
+            };
+        }
+
+        this.contentDiv.style.position = "absolute";
+        this.contentDiv.style.zIndex = 1;
+
+        if (closeBox) {
+            this.closeDiv.style.zIndex = 1;
+        }
+
+        this.groupDiv.style.position = "absolute";
+        this.groupDiv.style.top = "0px";
+        this.groupDiv.style.left = "0px";
+        this.groupDiv.style.height = "100%";
+        this.groupDiv.style.width = "100%";
+    },
+
+    /** 
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        this.imageSrc = null;
+        this.imageSize = null;
+        this.isAlphaImage = null;
+
+        this.fixedRelativePosition = false;
+        this.positionBlocks = null;
+
+        //remove our blocks
+        for(var i = 0; i < this.blocks.length; i++) {
+            var block = this.blocks[i];
+
+            if (block.image) {
+                block.div.removeChild(block.image);
+            }
+            block.image = null;
+
+            if (block.div) {
+                this.groupDiv.removeChild(block.div);
+            }
+            block.div = null;
+        }
+        this.blocks = null;
+
+        OpenLayers.Popup.Anchored.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: setBackgroundColor
+     */
+    setBackgroundColor:function(color) {
+        //does nothing since the framed popup's entire scheme is based on a 
+        // an image -- changing the background color makes no sense. 
+    },
+
+    /**
+     * APIMethod: setBorder
+     */
+    setBorder:function() {
+        //does nothing since the framed popup's entire scheme is based on a 
+        // an image -- changing the popup's border makes no sense. 
+    },
+
+    /**
+     * Method: setOpacity
+     * Sets the opacity of the popup.
+     * 
+     * Parameters:
+     * opacity - {float} A value between 0.0 (transparent) and 1.0 (solid).   
+     */
+    setOpacity:function(opacity) {
+        //does nothing since we suppose that we'll never apply an opacity
+        // to a framed popup
+    },
+
+    /**
+     * APIMethod: setSize
+     * Overridden here, because we need to update the blocks whenever the size
+     *     of the popup has changed.
+     * 
+     * Parameters:
+     * contentSize - {<OpenLayers.Size>} the new size for the popup's 
+     *     contents div (in pixels).
+     */
+    setSize:function(contentSize) { 
+        OpenLayers.Popup.Anchored.prototype.setSize.apply(this, arguments);
+
+        this.updateBlocks();
+    },
+
+    /**
+     * Method: updateRelativePosition
+     * When the relative position changes, we need to set the new padding 
+     *     BBOX on the popup, reposition the close div, and update the blocks.
+     */
+    updateRelativePosition: function() {
+
+        //update the padding
+        this.padding = this.positionBlocks[this.relativePosition].padding;
+
+        //update the position of our close box to new padding
+        if (this.closeDiv) {
+            // use the content div's css padding to determine if we should
+            //  padd the close div
+            var contentDivPadding = this.getContentDivPadding();
+
+            this.closeDiv.style.right = contentDivPadding.right + 
+                                        this.padding.right + "px";
+            this.closeDiv.style.top = contentDivPadding.top + 
+                                      this.padding.top + "px";
+        }
+
+        this.updateBlocks();
+    },
+
+    /** 
+     * Method: calculateNewPx
+     * Besides the standard offset as determined by the Anchored class, our 
+     *     Framed popups have a special 'offset' property for each of their 
+     *     positions, which is used to offset the popup relative to its anchor.
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} The the new px position of the popup on the screen
+     *     relative to the passed-in px.
+     */
+    calculateNewPx:function(px) {
+        var newPx = OpenLayers.Popup.Anchored.prototype.calculateNewPx.apply(
+            this, arguments
+        );
+
+        newPx = newPx.offset(this.positionBlocks[this.relativePosition].offset);
+
+        return newPx;
+    },
+
+    /**
+     * Method: createBlocks
+     */
+    createBlocks: function() {
+        this.blocks = [];
+
+        //since all positions contain the same number of blocks, we can 
+        // just pick the first position and use its blocks array to create
+        // our blocks array
+        var firstPosition = null;
+        for(var key in this.positionBlocks) {
+            firstPosition = key;
+            break;
+        }
+        
+        var position = this.positionBlocks[firstPosition];
+        for (var i = 0; i < position.blocks.length; i++) {
+
+            var block = {};
+            this.blocks.push(block);
+
+            var divId = this.id + '_FrameDecorationDiv_' + i;
+            block.div = OpenLayers.Util.createDiv(divId, 
+                null, null, null, "absolute", null, "hidden", null
+            );
+
+            var imgId = this.id + '_FrameDecorationImg_' + i;
+            var imageCreator = 
+                (this.isAlphaImage) ? OpenLayers.Util.createAlphaImageDiv
+                                    : OpenLayers.Util.createImage;
+
+            block.image = imageCreator(imgId, 
+                null, this.imageSize, this.imageSrc, 
+                "absolute", null, null, null
+            );
+
+            block.div.appendChild(block.image);
+            this.groupDiv.appendChild(block.div);
+        }
+    },
+
+    /**
+     * Method: updateBlocks
+     * Internal method, called on initialize and when the popup's relative
+     *     position has changed. This function takes care of re-positioning
+     *     the popup's blocks in their appropropriate places.
+     */
+    updateBlocks: function() {
+        if (!this.blocks) {
+            this.createBlocks();
+        }
+        
+        if (this.size && this.relativePosition) {
+            var position = this.positionBlocks[this.relativePosition];
+            for (var i = 0; i < position.blocks.length; i++) {
+    
+                var positionBlock = position.blocks[i];
+                var block = this.blocks[i];
+    
+                // adjust sizes
+                var l = positionBlock.anchor.left;
+                var b = positionBlock.anchor.bottom;
+                var r = positionBlock.anchor.right;
+                var t = positionBlock.anchor.top;
+    
+                //note that we use the isNaN() test here because if the 
+                // size object is initialized with a "auto" parameter, the 
+                // size constructor calls parseFloat() on the string, 
+                // which will turn it into NaN
+                //
+                var w = (isNaN(positionBlock.size.w)) ? this.size.w - (r + l) 
+                                                      : positionBlock.size.w;
+    
+                var h = (isNaN(positionBlock.size.h)) ? this.size.h - (b + t) 
+                                                      : positionBlock.size.h;
+    
+                block.div.style.width = (w < 0 ? 0 : w) + 'px';
+                block.div.style.height = (h < 0 ? 0 : h) + 'px';
+    
+                block.div.style.left = (l != null) ? l + 'px' : '';
+                block.div.style.bottom = (b != null) ? b + 'px' : '';
+                block.div.style.right = (r != null) ? r + 'px' : '';            
+                block.div.style.top = (t != null) ? t + 'px' : '';
+    
+                block.image.style.left = positionBlock.position.x + 'px';
+                block.image.style.top = positionBlock.position.y + 'px';
+            }
+    
+            this.contentDiv.style.left = this.padding.left + "px";
+            this.contentDiv.style.top = this.padding.top + "px";
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Popup.Framed"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/AnchoredBubble.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/AnchoredBubble.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/AnchoredBubble.js	(revision 76)
@@ -0,0 +1,190 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Popup/Anchored.js
+ */
+
+/**
+ * Class: OpenLayers.Popup.AnchoredBubble
+ * 
+ * Inherits from: 
+ *  - <OpenLayers.Popup.Anchored>
+ */
+OpenLayers.Popup.AnchoredBubble = 
+  OpenLayers.Class(OpenLayers.Popup.Anchored, {
+
+    /**
+     * Property: rounded
+     * {Boolean} Has the popup been rounded yet?
+     */
+    rounded: false, 
+    
+    /** 
+     * Constructor: OpenLayers.Popup.AnchoredBubble
+     * 
+     * Parameters:
+     * id - {String}
+     * lonlat - {<OpenLayers.LonLat>}
+     * contentSize - {<OpenLayers.Size>}
+     * contentHTML - {String}
+     * anchor - {Object} Object to which we'll anchor the popup. Must expose 
+     *     a 'size' (<OpenLayers.Size>) and 'offset' (<OpenLayers.Pixel>) 
+     *     (Note that this is generally an <OpenLayers.Icon>).
+     * closeBox - {Boolean}
+     * closeBoxCallback - {Function} Function to be called on closeBox click.
+     */
+    initialize:function(id, lonlat, contentSize, contentHTML, anchor, closeBox,
+                        closeBoxCallback) {
+        
+        this.padding = new OpenLayers.Bounds(
+            0, OpenLayers.Popup.AnchoredBubble.CORNER_SIZE,
+            0, OpenLayers.Popup.AnchoredBubble.CORNER_SIZE
+        );
+        OpenLayers.Popup.Anchored.prototype.initialize.apply(this, arguments);
+    },
+
+    /** 
+     * Method: draw
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {DOMElement} Reference to a div that contains the drawn popup.
+     */
+    draw: function(px) {
+        
+        OpenLayers.Popup.Anchored.prototype.draw.apply(this, arguments);
+
+        this.setContentHTML();
+        
+        //set the popup color and opacity           
+        this.setBackgroundColor(); 
+        this.setOpacity();
+
+        return this.div;
+    },
+
+    /**
+     * Method: updateRelativePosition
+     * The popup has been moved to a new relative location, in which case
+     *     we will want to re-do the rico corners.
+     */
+    updateRelativePosition: function() {
+        this.setRicoCorners();
+    },
+
+    /**
+     * APIMethod: setSize
+     * 
+     * Parameters:
+     * contentSize - {<OpenLayers.Size>} the new size for the popup's 
+     *     contents div (in pixels).
+     */
+    setSize:function(contentSize) { 
+        OpenLayers.Popup.Anchored.prototype.setSize.apply(this, arguments);
+
+        this.setRicoCorners();
+    },  
+
+    /**
+     * APIMethod: setBackgroundColor
+     * 
+     * Parameters:
+     * color - {String}
+     */
+    setBackgroundColor:function(color) { 
+        if (color != undefined) {
+            this.backgroundColor = color; 
+        }
+        
+        if (this.div != null) {
+            if (this.contentDiv != null) {
+                this.div.style.background = "transparent";
+                OpenLayers.Rico.Corner.changeColor(this.groupDiv, 
+                                                   this.backgroundColor);
+            }
+        }
+    },  
+    
+    /**
+     * APIMethod: setOpacity
+     * 
+     * Parameters: 
+     * opacity - {float}
+     */
+    setOpacity:function(opacity) { 
+        OpenLayers.Popup.Anchored.prototype.setOpacity.call(this, opacity);
+        
+        if (this.div != null) {
+            if (this.groupDiv != null) {
+                OpenLayers.Rico.Corner.changeOpacity(this.groupDiv, 
+                                                     this.opacity);
+            }
+        }
+    },  
+ 
+    /** 
+     * Method: setBorder
+     * Always sets border to 0. Bubble Popups can not have a border.
+     * 
+     * Parameters:
+     * border - {Integer}
+     */
+    setBorder:function(border) { 
+        this.border = 0;
+    },      
+ 
+    /** 
+     * Method: setRicoCorners
+     * Update RICO corners according to the popup's current relative postion.
+     */
+    setRicoCorners:function() {
+    
+        var corners = this.getCornersToRound(this.relativePosition);
+        var options = {corners: corners,
+                         color: this.backgroundColor,
+                       bgColor: "transparent",
+                         blend: false};
+
+        if (!this.rounded) {
+            OpenLayers.Rico.Corner.round(this.div, options);
+            this.rounded = true;
+        } else {
+            OpenLayers.Rico.Corner.reRound(this.groupDiv, options);
+            //set the popup color and opacity
+            this.setBackgroundColor(); 
+            this.setOpacity();
+        }
+    },
+
+    /** 
+     * Method: getCornersToRound
+     *  
+     * Returns:
+     * {String} The proper corners string ("tr tl bl br") for rico to round.
+     */
+    getCornersToRound:function() {
+
+        var corners = ['tl', 'tr', 'bl', 'br'];
+
+        //we want to round all the corners _except_ the opposite one. 
+        var corner = OpenLayers.Bounds.oppositeQuadrant(this.relativePosition);
+        OpenLayers.Util.removeItem(corners, corner);
+
+        return corners.join(" ");
+    },
+
+    CLASS_NAME: "OpenLayers.Popup.AnchoredBubble"
+});
+
+/**
+ * Constant: CORNER_SIZE
+ * {Integer} 5. Border space for the RICO corners.
+ */
+OpenLayers.Popup.AnchoredBubble.CORNER_SIZE = 5;
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Anchored.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Anchored.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup/Anchored.js	(revision 76)
@@ -0,0 +1,198 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Popup.js
+ */
+
+/**
+ * Class: OpenLayers.Popup.Anchored
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Popup>
+ */
+OpenLayers.Popup.Anchored = 
+  OpenLayers.Class(OpenLayers.Popup, {
+
+    /** 
+     * Parameter: relativePosition
+     * {String} Relative position of the popup ("br", "tr", "tl" or "bl").
+     */
+    relativePosition: null,
+    
+    /**
+     * APIProperty: keepInMap 
+     * {Boolean} If panMapIfOutOfView is false, and this property is true, 
+     *     contrain the popup such that it always fits in the available map
+     *     space. By default, this is set. If you are creating popups that are
+     *     near map edges and not allowing pannning, and especially if you have
+     *     a popup which has a fixedRelativePosition, setting this to false may
+     *     be a smart thing to do.
+     *   
+     *     For anchored popups, default is true, since subclasses will
+     *     usually want this functionality.
+     */
+    keepInMap: true,
+
+    /**
+     * Parameter: anchor
+     * {Object} Object to which we'll anchor the popup. Must expose a 
+     *     'size' (<OpenLayers.Size>) and 'offset' (<OpenLayers.Pixel>).
+     */
+    anchor: null,
+
+    /** 
+    * Constructor: OpenLayers.Popup.Anchored
+    * 
+    * Parameters:
+    * id - {String}
+    * lonlat - {<OpenLayers.LonLat>}
+    * contentSize - {<OpenLayers.Size>}
+    * contentHTML - {String}
+    * anchor - {Object} Object which must expose a 'size' <OpenLayers.Size> 
+    *     and 'offset' <OpenLayers.Pixel> (generally an <OpenLayers.Icon>).
+    * closeBox - {Boolean}
+    * closeBoxCallback - {Function} Function to be called on closeBox click.
+    */
+    initialize:function(id, lonlat, contentSize, contentHTML, anchor, closeBox,
+                        closeBoxCallback) {
+        var newArguments = [
+            id, lonlat, contentSize, contentHTML, closeBox, closeBoxCallback
+        ];
+        OpenLayers.Popup.prototype.initialize.apply(this, newArguments);
+
+        this.anchor = (anchor != null) ? anchor 
+                                       : { size: new OpenLayers.Size(0,0),
+                                           offset: new OpenLayers.Pixel(0,0)};
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        this.anchor = null;
+        this.relativePosition = null;
+        
+        OpenLayers.Popup.prototype.destroy.apply(this, arguments);        
+    },
+
+    /**
+     * APIMethod: show
+     * Overridden from Popup since user might hide popup and then show() it 
+     *     in a new location (meaning we might want to update the relative
+     *     position on the show)
+     */
+    show: function() {
+        this.updatePosition();
+        OpenLayers.Popup.prototype.show.apply(this, arguments);
+    },
+
+    /**
+     * Method: moveTo
+     * Since the popup is moving to a new px, it might need also to be moved
+     *     relative to where the marker is. We first calculate the new 
+     *     relativePosition, and then we calculate the new px where we will 
+     *     put the popup, based on the new relative position. 
+     * 
+     *     If the relativePosition has changed, we must also call 
+     *     updateRelativePosition() to make any visual changes to the popup 
+     *     which are associated with putting it in a new relativePosition.
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     */
+    moveTo: function(px) {
+        var oldRelativePosition = this.relativePosition;
+        this.relativePosition = this.calculateRelativePosition(px);
+        
+        var newPx = this.calculateNewPx(px);
+        
+        var newArguments = new Array(newPx);        
+        OpenLayers.Popup.prototype.moveTo.apply(this, newArguments);
+        
+        //if this move has caused the popup to change its relative position, 
+        // we need to make the appropriate cosmetic changes.
+        if (this.relativePosition != oldRelativePosition) {
+            this.updateRelativePosition();
+        }
+    },
+
+    /**
+     * APIMethod: setSize
+     * 
+     * Parameters:
+     * contentSize - {<OpenLayers.Size>} the new size for the popup's 
+     *     contents div (in pixels).
+     */
+    setSize:function(contentSize) { 
+        OpenLayers.Popup.prototype.setSize.apply(this, arguments);
+
+        if ((this.lonlat) && (this.map)) {
+            var px = this.map.getLayerPxFromLonLat(this.lonlat);
+            this.moveTo(px);
+        }
+    },  
+    
+    /** 
+     * Method: calculateRelativePosition
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {String} The relative position ("br" "tr" "tl" "bl") at which the popup
+     *     should be placed.
+     */
+    calculateRelativePosition:function(px) {
+        var lonlat = this.map.getLonLatFromLayerPx(px);        
+        
+        var extent = this.map.getExtent();
+        var quadrant = extent.determineQuadrant(lonlat);
+        
+        return OpenLayers.Bounds.oppositeQuadrant(quadrant);
+    }, 
+
+    /**
+     * Method: updateRelativePosition
+     * The popup has been moved to a new relative location, so we may want to 
+     *     make some cosmetic adjustments to it. 
+     * 
+     *     Note that in the classic Anchored popup, there is nothing to do 
+     *     here, since the popup looks exactly the same in all four positions.
+     *     Subclasses such as the AnchoredBubble and Framed, however, will 
+     *     want to do something special here.
+     */
+    updateRelativePosition: function() {
+        //to be overridden by subclasses
+    },
+
+    /** 
+     * Method: calculateNewPx
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} The the new px position of the popup on the screen
+     *     relative to the passed-in px.
+     */
+    calculateNewPx:function(px) {
+        var newPx = px.offset(this.anchor.offset);
+        
+        //use contentSize if size is not already set
+        var size = this.size || this.contentSize;
+
+        var top = (this.relativePosition.charAt(0) == 't');
+        newPx.y += (top) ? -(size.h + this.anchor.size.h) : this.anchor.size.h;
+        
+        var left = (this.relativePosition.charAt(1) == 'l');
+        newPx.x += (left) ? -(size.w + this.anchor.size.w) : this.anchor.size.w;
+
+        return newPx;   
+    },
+
+    CLASS_NAME: "OpenLayers.Popup.Anchored"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tile.js	(revision 76)
@@ -0,0 +1,281 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/*
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Console.js
+ */
+
+/*
+ * Class: OpenLayers.Tile 
+ * This is a class designed to designate a single tile, however
+ *     it is explicitly designed to do relatively little. Tiles store 
+ *     information about themselves -- such as the URL that they are related
+ *     to, and their size - but do not add themselves to the layer div 
+ *     automatically, for example. Create a new tile with the 
+ *     <OpenLayers.Tile> constructor, or a subclass. 
+ * 
+ * TBD 3.0 - remove reference to url in above paragraph
+ * 
+ */
+OpenLayers.Tile = OpenLayers.Class({
+    
+    /** 
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types
+     */
+    EVENT_TYPES: [ "loadstart", "loadend", "reload", "unload"],
+    
+    /**
+     * APIProperty: events
+     * {<OpenLayers.Events>} An events object that handles all 
+     *                       events on the tile.
+     */
+    events: null,
+
+    /**
+     * Property: id 
+     * {String} null
+     */
+    id: null,
+    
+    /** 
+     * Property: layer 
+     * {<OpenLayers.Layer>} layer the tile is attached to 
+     */
+    layer: null,
+    
+    /**
+     * Property: url
+     * {String} url of the request.
+     *
+     * TBD 3.0 
+     * Deprecated. The base tile class does not need an url. This should be 
+     * handled in subclasses. Does not belong here.
+     */
+    url: null,
+
+    /** 
+     * APIProperty: bounds 
+     * {<OpenLayers.Bounds>} null
+     */
+    bounds: null,
+    
+    /** 
+     * Property: size 
+     * {<OpenLayers.Size>} null
+     */
+    size: null,
+    
+    /** 
+     * Property: position 
+     * {<OpenLayers.Pixel>} Top Left pixel of the tile
+     */    
+    position: null,
+
+    /**
+     * Property: isLoading
+     * {Boolean} Is the tile loading?
+     */
+    isLoading: false,
+        
+    /** TBD 3.0 -- remove 'url' from the list of parameters to the constructor.
+     *             there is no need for the base tile class to have a url.
+     * 
+     * Constructor: OpenLayers.Tile
+     * Constructor for a new <OpenLayers.Tile> instance.
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} layer that the tile will go in.
+     * position - {<OpenLayers.Pixel>}
+     * bounds - {<OpenLayers.Bounds>}
+     * url - {<String>}
+     * size - {<OpenLayers.Size>}
+     */   
+    initialize: function(layer, position, bounds, url, size) {
+        this.layer = layer;
+        this.position = position.clone();
+        this.bounds = bounds.clone();
+        this.url = url;
+        this.size = size.clone();
+
+        //give the tile a unique id based on its BBOX.
+        this.id = OpenLayers.Util.createUniqueID("Tile_");
+        
+        this.events = new OpenLayers.Events(this, null, this.EVENT_TYPES);
+    },
+
+    /**
+     * Method: unload
+     * Call immediately before destroying if you are listening to tile
+     * events, so that counters are properly handled if tile is still
+     * loading at destroy-time. Will only fire an event if the tile is
+     * still loading.
+     */
+    unload: function() {
+       if (this.isLoading) { 
+           this.isLoading = false; 
+           this.events.triggerEvent("unload"); 
+       }
+    },
+    
+    /** 
+     * APIMethod: destroy
+     * Nullify references to prevent circular references and memory leaks.
+     */
+    destroy:function() {
+        this.layer  = null;
+        this.bounds = null;
+        this.size = null;
+        this.position = null;
+        
+        this.events.destroy();
+        this.events = null;
+    },
+    
+    /**
+     * Method: clone
+     *
+     * Parameters:
+     * obj - {<OpenLayers.Tile>} The tile to be cloned
+     *
+     * Returns:
+     * {<OpenLayers.Tile>} An exact clone of this <OpenLayers.Tile>
+     */
+    clone: function (obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Tile(this.layer, 
+                                      this.position, 
+                                      this.bounds, 
+                                      this.url, 
+                                      this.size);
+        } 
+        
+        // catch any randomly tagged-on properties
+        OpenLayers.Util.applyDefaults(obj, this);
+        
+        return obj;
+    },
+
+    /**
+     * Method: draw
+     * Clear whatever is currently in the tile, then return whether or not 
+     *     it should actually be re-drawn.
+     * 
+     * Returns:
+     * {Boolean} Whether or not the tile should actually be drawn. Note that 
+     *     this is not really the best way of doing things, but such is 
+     *     the way the code has been developed. Subclasses call this and
+     *     depend on the return to know if they should draw or not.
+     */
+    draw: function() {
+        var maxExtent = this.layer.maxExtent;
+        var withinMaxExtent = (maxExtent &&
+                               this.bounds.intersectsBounds(maxExtent, false));
+ 
+        // The only case where we *wouldn't* want to draw the tile is if the 
+        // tile is outside its layer's maxExtent.
+        this.shouldDraw = (withinMaxExtent || this.layer.displayOutsideMaxExtent);
+                
+        //clear tile's contents and mark as not drawn
+        this.clear();
+        
+        return this.shouldDraw;
+    },
+    
+    /** 
+     * Method: moveTo
+     * Reposition the tile.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * redraw - {Boolean} Call draw method on tile after moving.
+     *     Default is true
+     */
+    moveTo: function (bounds, position, redraw) {
+        if (redraw == null) {
+            redraw = true;
+        }
+
+        this.bounds = bounds.clone();
+        this.position = position.clone();
+        if (redraw) {
+            this.draw();
+        }
+    },
+
+    /** 
+     * Method: clear
+     * Clear the tile of any bounds/position-related data so that it can 
+     *     be reused in a new location. To be implemented by subclasses.
+     */
+    clear: function() {
+        // to be implemented by subclasses
+    },
+    
+    /**   
+     * Method: getBoundsFromBaseLayer
+     * Take the pixel locations of the corner of the tile, and pass them to 
+     *     the base layer and ask for the location of those pixels, so that 
+     *     displaying tiles over Google works fine.
+     *
+     * Parameters:
+     * position - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * bounds - {<OpenLayers.Bounds>} 
+     */
+    getBoundsFromBaseLayer: function(position) {
+        var msg = OpenLayers.i18n('reprojectDeprecated',
+                                              {'layerName':this.layer.name});
+        OpenLayers.Console.warn(msg);
+        var topLeft = this.layer.map.getLonLatFromLayerPx(position); 
+        var bottomRightPx = position.clone();
+        bottomRightPx.x += this.size.w;
+        bottomRightPx.y += this.size.h;
+        var bottomRight = this.layer.map.getLonLatFromLayerPx(bottomRightPx); 
+        // Handle the case where the base layer wraps around the date line.
+        // Google does this, and it breaks WMS servers to request bounds in 
+        // that fashion.  
+        if (topLeft.lon > bottomRight.lon) {
+            if (topLeft.lon < 0) {
+                topLeft.lon = -180 - (topLeft.lon+180);
+            } else {
+                bottomRight.lon = 180+bottomRight.lon+180;
+            }        
+        }
+        var bounds = new OpenLayers.Bounds(topLeft.lon, 
+                                       bottomRight.lat, 
+                                       bottomRight.lon, 
+                                       topLeft.lat);  
+        return bounds;
+    },        
+        
+    /** 
+     * Method: showTile
+     * Show the tile only if it should be drawn.
+     */
+    showTile: function() { 
+        if (this.shouldDraw) {
+            this.show();
+        }
+    },
+    
+    /** 
+     * Method: show
+     * Show the tile.  To be implemented by subclasses.
+     */
+    show: function() { },
+    
+    /** 
+     * Method: hide
+     * Hide the tile.  To be implemented by subclasses.
+     */
+    hide: function() { },
+    
+    CLASS_NAME: "OpenLayers.Tile"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/StyleMap.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/StyleMap.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/StyleMap.js	(revision 76)
@@ -0,0 +1,160 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Style.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+ 
+/**
+ * Class: OpenLayers.StyleMap
+ */
+OpenLayers.StyleMap = OpenLayers.Class({
+    
+    /**
+     * Property: styles
+     * Hash of {<OpenLayers.Style>}, keyed by names of well known
+     * rendering intents (e.g. "default", "temporary", "select", "delete").
+     */
+    styles: null,
+    
+    /**
+     * Property: extendDefault
+     * {Boolean} if true, every render intent will extend the symbolizers
+     * specified for the "default" intent at rendering time. Otherwise, every
+     * rendering intent will be treated as a completely independent style.
+     */
+    extendDefault: true,
+    
+    /**
+     * Constructor: OpenLayers.StyleMap
+     * 
+     * Parameters:
+     * style   - {Object} Optional. Either a style hash, or a style object, or
+     *           a hash of style objects (style hashes) keyed by rendering
+     *           intent. If just one style hash or style object is passed,
+     *           this will be used for all known render intents (default,
+     *           select, temporary)
+     * options - {Object} optional hash of additional options for this
+     *           instance
+     */
+    initialize: function (style, options) {
+        this.styles = {
+            "default": new OpenLayers.Style(
+                OpenLayers.Feature.Vector.style["default"]),
+            "select": new OpenLayers.Style(
+                OpenLayers.Feature.Vector.style["select"]),
+            "temporary": new OpenLayers.Style(
+                OpenLayers.Feature.Vector.style["temporary"]),
+            "delete": new OpenLayers.Style(
+                OpenLayers.Feature.Vector.style["delete"])
+        };
+        
+        // take whatever the user passed as style parameter and convert it
+        // into parts of stylemap.
+        if(style instanceof OpenLayers.Style) {
+            // user passed a style object
+            this.styles["default"] = style;
+            this.styles["select"] = style;
+            this.styles["temporary"] = style;
+            this.styles["delete"] = style;
+        } else if(typeof style == "object") {
+            for(var key in style) {
+                if(style[key] instanceof OpenLayers.Style) {
+                    // user passed a hash of style objects
+                    this.styles[key] = style[key];
+                } else if(typeof style[key] == "object") {
+                    // user passsed a hash of style hashes
+                    this.styles[key] = new OpenLayers.Style(style[key]);
+                } else {
+                    // user passed a style hash (i.e. symbolizer)
+                    this.styles["default"] = new OpenLayers.Style(style);
+                    this.styles["select"] = new OpenLayers.Style(style);
+                    this.styles["temporary"] = new OpenLayers.Style(style);
+                    this.styles["delete"] = new OpenLayers.Style(style);
+                    break;
+                }
+            }
+        }
+        OpenLayers.Util.extend(this, options);
+    },
+
+    /**
+     * Method: destroy
+     */
+    destroy: function() {
+        for(var key in this.styles) {
+            this.styles[key].destroy();
+        }
+        this.styles = null;
+    },
+    
+    /**
+     * Method: createSymbolizer
+     * Creates the symbolizer for a feature for a render intent.
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature>} The feature to evaluate the rules
+     *           of the intended style against.
+     * intent  - {String} The intent determines the symbolizer that will be
+     *           used to draw the feature. Well known intents are "default"
+     *           (for just drawing the features), "select" (for selected
+     *           features) and "temporary" (for drawing features).
+     * 
+     * Returns:
+     * {Object} symbolizer hash
+     */
+    createSymbolizer: function(feature, intent) {
+        if(!feature) {
+            feature = new OpenLayers.Feature.Vector();
+        }
+        if(!this.styles[intent]) {
+            intent = "default";
+        }
+        feature.renderIntent = intent;
+        var defaultSymbolizer = {};
+        if(this.extendDefault && intent != "default") {
+            defaultSymbolizer = this.styles["default"].createSymbolizer(feature);
+        }
+        return OpenLayers.Util.extend(defaultSymbolizer,
+            this.styles[intent].createSymbolizer(feature));
+    },
+    
+    /**
+     * Method: addUniqueValueRules
+     * Convenience method to create comparison rules for unique values of a
+     * property. The rules will be added to the style object for a specified
+     * rendering intent. This method is a shortcut for creating something like
+     * the "unique value legends" familiar from well known desktop GIS systems
+     * 
+     * Parameters:
+     * renderIntent - {String} rendering intent to add the rules to
+     * property     - {String} values of feature attributes to create the
+     *                rules for
+     * symbolizers  - {Object} Hash of symbolizers, keyed by the desired
+     *                property values 
+     * context      - {Object} An optional object with properties that
+     *                symbolizers' property values should be evaluated
+     *                against. If no context is specified, feature.attributes
+     *                will be used
+     */
+    addUniqueValueRules: function(renderIntent, property, symbolizers, context) {
+        var rules = [];
+        for (var value in symbolizers) {
+            rules.push(new OpenLayers.Rule({
+                symbolizer: symbolizers[value],
+                context: context,
+                filter: new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
+                    property: property,
+                    value: value
+                })
+            }));
+        }
+        this.styles[renderIntent].addRules(rules);
+    },
+
+    CLASS_NAME: "OpenLayers.StyleMap"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Symbolizer.js	(revision 76)
@@ -0,0 +1,51 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Symbolizer
+ * Base class representing a symbolizer used for feature rendering.
+ */
+OpenLayers.Symbolizer = OpenLayers.Class({
+    
+
+    /**
+     * APIProperty: zIndex
+     * {Number} The zIndex determines the rendering order for a symbolizer.
+     *     Symbolizers with larger zIndex values are rendered over symbolizers
+     *     with smaller zIndex values.  Default is 0.
+     */
+    zIndex: 0,
+    
+    /**
+     * Constructor: OpenLayers.Symbolizer
+     * Instances of this class are not useful.  See one of the subclasses.
+     *
+     * Parameters:
+     * config - {Object} An object containing properties to be set on the 
+     *     symbolizer.  Any documented symbolizer property can be set at 
+     *     construction.
+     *
+     * Returns:
+     * A new symbolizer.
+     */
+    initialize: function(config) {
+        OpenLayers.Util.extend(this, config);
+    },
+    
+    /** 
+     * APIMethod: clone
+     * Create a copy of this symbolizer.
+     *
+     * Returns a symbolizer of the same type with the same properties.
+     */
+    clone: function() {
+        var Type = eval(this.CLASS_NAME);
+        return new Type(OpenLayers.Util.extend({}, this));
+    },
+    
+    CLASS_NAME: "OpenLayers.Symbolizer"
+    
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/BaseTypes.js	(revision 76)
@@ -0,0 +1,682 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/BaseTypes/Class.js
+ * @requires OpenLayers/BaseTypes/LonLat.js
+ * @requires OpenLayers/BaseTypes/Size.js
+ * @requires OpenLayers/BaseTypes/Pixel.js
+ * @requires OpenLayers/BaseTypes/Bounds.js
+ * @requires OpenLayers/BaseTypes/Element.js
+ * @requires OpenLayers/Lang/en.js
+ * @requires OpenLayers/Console.js
+ */
+ 
+/** 
+ * Header: OpenLayers Base Types
+ * OpenLayers custom string, number and function functions are described here.
+ */
+
+/**
+ * Namespace: OpenLayers.String
+ * Contains convenience functions for string manipulation.
+ */
+OpenLayers.String = {
+
+    /**
+     * APIFunction: startsWith
+     * Test whether a string starts with another string. 
+     * 
+     * Parameters:
+     * str - {String} The string to test.
+     * sub - {Sring} The substring to look for.
+     *  
+     * Returns:
+     * {Boolean} The first string starts with the second.
+     */
+    startsWith: function(str, sub) {
+        return (str.indexOf(sub) == 0);
+    },
+
+    /**
+     * APIFunction: contains
+     * Test whether a string contains another string.
+     * 
+     * Parameters:
+     * str - {String} The string to test.
+     * sub - {String} The substring to look for.
+     * 
+     * Returns:
+     * {Boolean} The first string contains the second.
+     */
+    contains: function(str, sub) {
+        return (str.indexOf(sub) != -1);
+    },
+    
+    /**
+     * APIFunction: trim
+     * Removes leading and trailing whitespace characters from a string.
+     * 
+     * Parameters:
+     * str - {String} The (potentially) space padded string.  This string is not
+     *     modified.
+     * 
+     * Returns:
+     * {String} A trimmed version of the string with all leading and 
+     *     trailing spaces removed.
+     */
+    trim: function(str) {
+        return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
+    },
+    
+    /**
+     * APIFunction: camelize
+     * Camel-case a hyphenated string. 
+     *     Ex. "chicken-head" becomes "chickenHead", and
+     *     "-chicken-head" becomes "ChickenHead".
+     *
+     * Parameters:
+     * str - {String} The string to be camelized.  The original is not modified.
+     * 
+     * Returns:
+     * {String} The string, camelized
+     */
+    camelize: function(str) {
+        var oStringList = str.split('-');
+        var camelizedString = oStringList[0];
+        for (var i=1, len=oStringList.length; i<len; i++) {
+            var s = oStringList[i];
+            camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
+        }
+        return camelizedString;
+    },
+    
+    /**
+     * APIFunction: format
+     * Given a string with tokens in the form ${token}, return a string
+     *     with tokens replaced with properties from the given context
+     *     object.  Represent a literal "${" by doubling it, e.g. "${${".
+     *
+     * Parameters:
+     * template - {String} A string with tokens to be replaced.  A template
+     *     has the form "literal ${token}" where the token will be replaced
+     *     by the value of context["token"].
+     * context - {Object} An optional object with properties corresponding
+     *     to the tokens in the format string.  If no context is sent, the
+     *     window object will be used.
+     * args - {Array} Optional arguments to pass to any functions found in
+     *     the context.  If a context property is a function, the token
+     *     will be replaced by the return from the function called with
+     *     these arguments.
+     *
+     * Returns:
+     * {String} A string with tokens replaced from the context object.
+     */
+    format: function(template, context, args) {
+        if(!context) {
+            context = window;
+        }
+
+        // Example matching: 
+        // str   = ${foo.bar}
+        // match = foo.bar
+        var replacer = function(str, match) {
+            var replacement;
+
+            // Loop through all subs. Example: ${a.b.c}
+            // 0 -> replacement = context[a];
+            // 1 -> replacement = context[a][b];
+            // 2 -> replacement = context[a][b][c];
+            var subs = match.split(/\.+/);
+            for (var i=0; i< subs.length; i++) {
+                if (i == 0) {
+                    replacement = context;
+                }
+
+                replacement = replacement[subs[i]];
+            }
+
+            if(typeof replacement == "function") {
+                replacement = args ?
+                    replacement.apply(null, args) :
+                    replacement();
+            }
+
+            // If replacement is undefined, return the string 'undefined'.
+            // This is a workaround for a bugs in browsers not properly 
+            // dealing with non-participating groups in regular expressions:
+            // http://blog.stevenlevithan.com/archives/npcg-javascript
+            if (typeof replacement == 'undefined') {
+                return 'undefined';
+            } else {
+                return replacement; 
+            }
+        };
+
+        return template.replace(OpenLayers.String.tokenRegEx, replacer);
+    },
+
+    /**
+     * Property: OpenLayers.String.tokenRegEx
+     * Used to find tokens in a string.
+     * Examples: ${a}, ${a.b.c}, ${a-b}, ${5}
+     */
+    tokenRegEx:  /\$\{([\w.]+?)\}/g,
+    
+    /**
+     * Property: OpenLayers.String.numberRegEx
+     * Used to test strings as numbers.
+     */
+    numberRegEx: /^([+-]?)(?=\d|\.\d)\d*(\.\d*)?([Ee]([+-]?\d+))?$/,
+    
+    /**
+     * APIFunction: OpenLayers.String.isNumeric
+     * Determine whether a string contains only a numeric value.
+     *
+     * Examples:
+     * (code)
+     * OpenLayers.String.isNumeric("6.02e23") // true
+     * OpenLayers.String.isNumeric("12 dozen") // false
+     * OpenLayers.String.isNumeric("4") // true
+     * OpenLayers.String.isNumeric(" 4 ") // false
+     * (end)
+     *
+     * Returns:
+     * {Boolean} String contains only a number.
+     */
+    isNumeric: function(value) {
+        return OpenLayers.String.numberRegEx.test(value);
+    },
+    
+    /**
+     * APIFunction: numericIf
+     * Converts a string that appears to be a numeric value into a number.
+     * 
+     * Returns
+     * {Number|String} a Number if the passed value is a number, a String
+     *     otherwise. 
+     */
+    numericIf: function(value) {
+        return OpenLayers.String.isNumeric(value) ? parseFloat(value) : value;
+    }
+
+};
+
+if (!String.prototype.startsWith) {
+    /**
+     * APIMethod: String.startsWith
+     * *Deprecated*. Whether or not a string starts with another string. 
+     * 
+     * Parameters:
+     * sStart - {Sring} The string we're testing for.
+     *  
+     * Returns:
+     * {Boolean} Whether or not this string starts with the string passed in.
+     */
+    String.prototype.startsWith = function(sStart) {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                                {'newMethod':'OpenLayers.String.startsWith'}));
+        return OpenLayers.String.startsWith(this, sStart);
+    };
+}
+
+if (!String.prototype.contains) {
+    /**
+     * APIMethod: String.contains
+     * *Deprecated*. Whether or not a string contains another string.
+     * 
+     * Parameters:
+     * str - {String} The string that we're testing for.
+     * 
+     * Returns:
+     * {Boolean} Whether or not this string contains with the string passed in.
+     */
+    String.prototype.contains = function(str) {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                                  {'newMethod':'OpenLayers.String.contains'}));
+        return OpenLayers.String.contains(this, str);
+    };
+}
+
+if (!String.prototype.trim) {
+    /**
+     * APIMethod: String.trim
+     * *Deprecated*. Removes leading and trailing whitespace characters from a string.
+     * 
+     * Returns:
+     * {String} A trimmed version of the string - all leading and 
+     *          trailing spaces removed
+     */
+    String.prototype.trim = function() {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                                      {'newMethod':'OpenLayers.String.trim'}));
+        return OpenLayers.String.trim(this);
+    };
+}
+
+if (!String.prototype.camelize) {
+    /**
+     * APIMethod: String.camelize
+     * *Deprecated*. Camel-case a hyphenated string. 
+     *     Ex. "chicken-head" becomes "chickenHead", and
+     *     "-chicken-head" becomes "ChickenHead".
+     * 
+     * Returns:
+     * {String} The string, camelized
+     */
+    String.prototype.camelize = function() {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                                  {'newMethod':'OpenLayers.String.camelize'}));
+        return OpenLayers.String.camelize(this);
+    };
+}
+
+/**
+ * Namespace: OpenLayers.Number
+ * Contains convenience functions for manipulating numbers.
+ */
+OpenLayers.Number = {
+
+    /**
+     * Property: decimalSeparator
+     * Decimal separator to use when formatting numbers.
+     */
+    decimalSeparator: ".",
+    
+    /**
+     * Property: thousandsSeparator
+     * Thousands separator to use when formatting numbers.
+     */
+    thousandsSeparator: ",",
+    
+    /**
+     * APIFunction: limitSigDigs
+     * Limit the number of significant digits on a float.
+     * 
+     * Parameters:
+     * num - {Float}
+     * sig - {Integer}
+     * 
+     * Returns:
+     * {Float} The number, rounded to the specified number of significant
+     *     digits.
+     */
+    limitSigDigs: function(num, sig) {
+        var fig = 0;
+        if (sig > 0) {
+            fig = parseFloat(num.toPrecision(sig));
+        }
+        return fig;
+    },
+    
+    /**
+     * APIFunction: format
+     * Formats a number for output.
+     * 
+     * Parameters:
+     * num  - {Float}
+     * dec  - {Integer} Number of decimal places to round to.
+     *        Defaults to 0. Set to null to leave decimal places unchanged.
+     * tsep - {String} Thousands separator.
+     *        Default is ",".
+     * dsep - {String} Decimal separator.
+     *        Default is ".".
+     *
+     * Returns:
+     * {String} A string representing the formatted number.
+     */
+    format: function(num, dec, tsep, dsep) {
+        dec = (typeof dec != "undefined") ? dec : 0; 
+        tsep = (typeof tsep != "undefined") ? tsep :
+            OpenLayers.Number.thousandsSeparator; 
+        dsep = (typeof dsep != "undefined") ? dsep :
+            OpenLayers.Number.decimalSeparator;
+
+        if (dec != null) {
+            num = parseFloat(num.toFixed(dec));
+        }
+
+        var parts = num.toString().split(".");
+        if (parts.length == 1 && dec == null) {
+            // integer where we do not want to touch the decimals
+            dec = 0;
+        }
+        
+        var integer = parts[0];
+        if (tsep) {
+            var thousands = /(-?[0-9]+)([0-9]{3})/; 
+            while(thousands.test(integer)) { 
+                integer = integer.replace(thousands, "$1" + tsep + "$2"); 
+            }
+        }
+        
+        var str;
+        if (dec == 0) {
+            str = integer;
+        } else {
+            var rem = parts.length > 1 ? parts[1] : "0";
+            if (dec != null) {
+                rem = rem + new Array(dec - rem.length + 1).join("0");
+            }
+            str = integer + dsep + rem;
+        }
+        return str;
+    }
+};
+
+if (!Number.prototype.limitSigDigs) {
+    /**
+     * APIMethod: Number.limitSigDigs
+     * *Deprecated*. Limit the number of significant digits on an integer. Does *not*
+     *     work with floats!
+     * 
+     * Parameters:
+     * sig - {Integer}
+     * 
+     * Returns:
+     * {Integer} The number, rounded to the specified number of significant digits.
+     *           If null, 0, or negative value passed in, returns 0
+     */
+    Number.prototype.limitSigDigs = function(sig) {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                              {'newMethod':'OpenLayers.Number.limitSigDigs'}));
+        return OpenLayers.Number.limitSigDigs(this, sig);
+    };
+}
+
+/**
+ * Namespace: OpenLayers.Function
+ * Contains convenience functions for function manipulation.
+ */
+OpenLayers.Function = {
+    /**
+     * APIFunction: bind
+     * Bind a function to an object.  Method to easily create closures with
+     *     'this' altered.
+     * 
+     * Parameters:
+     * func - {Function} Input function.
+     * object - {Object} The object to bind to the input function (as this).
+     * 
+     * Returns:
+     * {Function} A closure with 'this' set to the passed in object.
+     */
+    bind: function(func, object) {
+        // create a reference to all arguments past the second one
+        var args = Array.prototype.slice.apply(arguments, [2]);
+        return function() {
+            // Push on any additional arguments from the actual function call.
+            // These will come after those sent to the bind call.
+            var newArgs = args.concat(
+                Array.prototype.slice.apply(arguments, [0])
+            );
+            return func.apply(object, newArgs);
+        };
+    },
+    
+    /**
+     * APIFunction: bindAsEventListener
+     * Bind a function to an object, and configure it to receive the event
+     *     object as first parameter when called. 
+     * 
+     * Parameters:
+     * func - {Function} Input function to serve as an event listener.
+     * object - {Object} A reference to this.
+     * 
+     * Returns:
+     * {Function}
+     */
+    bindAsEventListener: function(func, object) {
+        return function(event) {
+            return func.call(object, event || window.event);
+        };
+    },
+    
+    /**
+     * APIFunction: False
+     * A simple function to that just does "return false". We use this to 
+     * avoid attaching anonymous functions to DOM event handlers, which 
+     * causes "issues" on IE<8.
+     * 
+     * Usage:
+     * document.onclick = OpenLayers.Function.False;
+     * 
+     * Returns:
+     * {Boolean}
+     */
+    False : function() {
+        return false;
+    },
+
+    /**
+     * APIFunction: True
+     * A simple function to that just does "return true". We use this to 
+     * avoid attaching anonymous functions to DOM event handlers, which 
+     * causes "issues" on IE<8.
+     * 
+     * Usage:
+     * document.onclick = OpenLayers.Function.True;
+     * 
+     * Returns:
+     * {Boolean}
+     */
+    True : function() {
+        return true;
+    }
+};
+
+if (!Function.prototype.bind) {
+    /**
+     * APIMethod: Function.bind
+     * *Deprecated*. Bind a function to an object. 
+     * Method to easily create closures with 'this' altered.
+     * 
+     * Parameters:
+     * object - {Object} the this parameter
+     * 
+     * Returns:
+     * {Function} A closure with 'this' altered to the first
+     *            argument.
+     */
+    Function.prototype.bind = function() {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                                {'newMethod':'OpenLayers.Function.bind'}));
+        // new function takes the same arguments with this function up front
+        Array.prototype.unshift.apply(arguments, [this]);
+        return OpenLayers.Function.bind.apply(null, arguments);
+    };
+}
+
+if (!Function.prototype.bindAsEventListener) {
+    /**
+     * APIMethod: Function.bindAsEventListener
+     * *Deprecated*. Bind a function to an object, and configure it to receive the
+     *     event object as first parameter when called. 
+     * 
+     * Parameters:
+     * object - {Object} A reference to this.
+     * 
+     * Returns:
+     * {Function}
+     */
+    Function.prototype.bindAsEventListener = function(object) {
+        OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",
+                        {'newMethod':'OpenLayers.Function.bindAsEventListener'}));
+        return OpenLayers.Function.bindAsEventListener(this, object);
+    };
+}
+
+/**
+ * Namespace: OpenLayers.Array
+ * Contains convenience functions for array manipulation.
+ */
+OpenLayers.Array = {
+
+    /**
+     * APIMethod: filter
+     * Filter an array.  Provides the functionality of the
+     *     Array.prototype.filter extension to the ECMA-262 standard.  Where
+     *     available, Array.prototype.filter will be used.
+     *
+     * Based on well known example from http://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/filter
+     *
+     * Parameters:
+     * array - {Array} The array to be filtered.  This array is not mutated.
+     *     Elements added to this array by the callback will not be visited.
+     * callback - {Function} A function that is called for each element in
+     *     the array.  If this function returns true, the element will be
+     *     included in the return.  The function will be called with three
+     *     arguments: the element in the array, the index of that element, and
+     *     the array itself.  If the optional caller parameter is specified
+     *     the callback will be called with this set to caller.
+     * caller - {Object} Optional object to be set as this when the callback
+     *     is called.
+     *
+     * Returns:
+     * {Array} An array of elements from the passed in array for which the
+     *     callback returns true.
+     */
+    filter: function(array, callback, caller) {
+        var selected = [];
+        if (Array.prototype.filter) {
+            selected = array.filter(callback, caller);
+        } else {
+            var len = array.length;
+            if (typeof callback != "function") {
+                throw new TypeError();
+            }
+            for(var i=0; i<len; i++) {
+                if (i in array) {
+                    var val = array[i];
+                    if (callback.call(caller, val, i, array)) {
+                        selected.push(val);
+                    }
+                }
+            }        
+        }
+        return selected;
+    }
+    
+};
+
+/**
+ * Namespace: OpenLayers.Date
+ * Contains implementations of Date.parse and date.toISOString that match the 
+ *     ECMAScript 5 specification for parsing RFC 3339 dates.
+ *     http://tools.ietf.org/html/rfc3339
+ */
+OpenLayers.Date = {
+    
+    /**
+     * APIMethod: toISOString
+     * Generates a string representing a date.  The format of the string follows 
+     *     the profile of ISO 8601 for date and time on the Internet (see 
+     *     http://tools.ietf.org/html/rfc3339).  If the toISOString method is 
+     *     available on the Date prototype, that is used.  The toISOString
+     *     method for Date instances is defined in ECMA-262.
+     *
+     * Parameters:
+     * date - {Date} A date object.
+     *
+     * Returns:
+     * {String} A string representing the date (e.g. 
+     *     "2010-08-07T16:58:23.123Z").  If the date does not have a valid time
+     *     (i.e. isNaN(date.getTime())) this method returns the string "Invalid
+     *     Date".  The ECMA standard says the toISOString method should throw
+     *     RangeError in this case, but Firefox returns a string instead.  For
+     *     best results, use isNaN(date.getTime()) to determine date validity
+     *     before generating date strings.  
+     */
+    toISOString: (function() {
+        if ("toISOString" in Date.prototype) {
+            return function(date) {
+                return date.toISOString();
+            }
+        } else {
+            function pad(num, len) {
+                var str = num + "";
+                while (str.length < len) {
+                    str = "0" + str;
+                }
+                return str;
+            }
+            return function(date) {
+                var str;
+                if (isNaN(date.getTime())) {
+                    // ECMA-262 says throw RangeError, Firefox returns 
+                    // "Invalid Date"
+                    str = "Invalid Date";
+                } else {
+                    str = 
+                        date.getUTCFullYear() + "-" +
+                        pad(date.getUTCMonth() + 1, 2) + "-" +
+                        pad(date.getUTCDate(), 2) + "T" +
+                        pad(date.getUTCHours(), 2) + ":" +
+                        pad(date.getUTCMinutes(), 2) + ":" +
+                        pad(date.getUTCSeconds(), 2) + "." +
+                        pad(date.getUTCMilliseconds(), 3) + "Z";
+                }
+                return str;
+            }
+        }
+
+    })(),
+    
+    /**
+     * APIMethod: parse
+     * Generate a date object from a string.  The format for the string follows
+     *     the profile of ISO 8601 for date and time on the Internet (see 
+     *     http://tools.ietf.org/html/rfc3339).  If the parse method on 
+     *     the Date constructor returns a valid date for the given string,
+     *     that method is used.
+     *
+     * Parameters:
+     * str - {String} A string representing the date (e.g. 
+     *     "2010", "2010-08", "2010-08-07", "2010-08-07T16:58:23.123Z",
+     *     "2010-08-07T11:58:23.123-06").
+     * 
+     * Returns:
+     * {Date} A date object.  If the string could not be parsed, an invalid
+     *     date is returned (i.e. isNaN(date.getTime())).
+     */
+    parse: function(str) {
+        var date;
+        // first check if the native parse method can parse it
+        var elapsed = Date.parse(str);
+        if (!isNaN(elapsed)) {
+            date = new Date(elapsed);
+        } else {
+            var match = str.match(/^(?:(\d{4})(?:-(\d{2})(?:-(\d{2}))?)?)?(?:T(\d{1,2}):(\d{2}):(\d{2}(?:\.\d+)?)(Z|(?:[+-]\d{1,2}(?::(\d{2}))?)))?$/);
+            var date;
+            if (match && (match[1] || match[7])) { // must have at least year or time
+                var year = parseInt(match[1], 10) || 0;
+                var month = (parseInt(match[2], 10) - 1) || 0;
+                var day = parseInt(match[3], 10) || 1;
+                date = new Date(Date.UTC(year, month, day));
+                // optional time
+                var type = match[7];
+                if (type) {
+                    var hours = parseInt(match[4], 10);
+                    var minutes = parseInt(match[5], 10);
+                    var secFrac = parseFloat(match[6]);
+                    var seconds = secFrac | 0;
+                    var milliseconds = Math.round(1000 * (secFrac - seconds));
+                    date.setUTCHours(hours, minutes, seconds, milliseconds);
+                    // check offset
+                    if (type !== "Z") {
+                        var hoursOffset = parseInt(type, 10);
+                        var minutesOffset = parseInt(match[8]) || 0;
+                        var offset = -1000 * (60 * (hoursOffset * 60) + minutesOffset * 60);
+                        date = new Date(date.getTime() + offset);
+                    }
+                }
+            } else {
+                date = new Date("invalid");
+            }
+        }
+        return date;
+    }
+
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Popup.js	(revision 76)
@@ -0,0 +1,1052 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * Class: OpenLayers.Popup
+ * A popup is a small div that can opened and closed on the map.
+ * Typically opened in response to clicking on a marker.  
+ * See <OpenLayers.Marker>.  Popup's don't require their own
+ * layer and are added the the map using the <OpenLayers.Map.addPopup>
+ * method.
+ *
+ * Example:
+ * (code)
+ * popup = new OpenLayers.Popup("chicken", 
+ *                    new OpenLayers.LonLat(5,40),
+ *                    new OpenLayers.Size(200,200),
+ *                    "example popup",
+ *                    true);
+ *       
+ * map.addPopup(popup);
+ * (end)
+ */
+OpenLayers.Popup = OpenLayers.Class({
+
+    /** 
+     * Property: events  
+     * {<OpenLayers.Events>} custom event manager 
+     */
+    events: null,
+    
+    /** Property: id
+     * {String} the unique identifier assigned to this popup.
+     */
+    id: "",
+
+    /** 
+     * Property: lonlat 
+     * {<OpenLayers.LonLat>} the position of this popup on the map
+     */
+    lonlat: null,
+
+    /** 
+     * Property: div 
+     * {DOMElement} the div that contains this popup.
+     */
+    div: null,
+
+    /** 
+     * Property: contentSize 
+     * {<OpenLayers.Size>} the width and height of the content.
+     */
+    contentSize: null,    
+
+    /** 
+     * Property: size 
+     * {<OpenLayers.Size>} the width and height of the popup.
+     */
+    size: null,    
+
+    /** 
+     * Property: contentHTML 
+     * {String} An HTML string for this popup to display.
+     */
+    contentHTML: null,
+    
+    /** 
+     * Property: backgroundColor 
+     * {String} the background color used by the popup.
+     */
+    backgroundColor: "",
+    
+    /** 
+     * Property: opacity 
+     * {float} the opacity of this popup (between 0.0 and 1.0)
+     */
+    opacity: "",
+
+    /** 
+     * Property: border 
+     * {String} the border size of the popup.  (eg 2px)
+     */
+    border: "",
+    
+    /** 
+     * Property: contentDiv 
+     * {DOMElement} a reference to the element that holds the content of
+     *              the div.
+     */
+    contentDiv: null,
+    
+    /** 
+     * Property: groupDiv 
+     * {DOMElement} First and only child of 'div'. The group Div contains the
+     *     'contentDiv' and the 'closeDiv'.
+     */
+    groupDiv: null,
+
+    /** 
+     * Property: closeDiv
+     * {DOMElement} the optional closer image
+     */
+    closeDiv: null,
+
+    /** 
+     * APIProperty: autoSize
+     * {Boolean} Resize the popup to auto-fit the contents.
+     *     Default is false.
+     */
+    autoSize: false,
+
+    /**
+     * APIProperty: minSize
+     * {<OpenLayers.Size>} Minimum size allowed for the popup's contents.
+     */
+    minSize: null,
+
+    /**
+     * APIProperty: maxSize
+     * {<OpenLayers.Size>} Maximum size allowed for the popup's contents.
+     */
+    maxSize: null,
+
+    /** 
+     * Property: displayClass
+     * {String} The CSS class of the popup.
+     */
+    displayClass: "olPopup",
+
+    /** 
+     * Property: contentDisplayClass
+     * {String} The CSS class of the popup content div.
+     */
+    contentDisplayClass: "olPopupContent",
+
+    /** 
+     * Property: padding 
+     * {int or <OpenLayers.Bounds>} An extra opportunity to specify internal 
+     *     padding of the content div inside the popup. This was originally
+     *     confused with the css padding as specified in style.css's 
+     *     'olPopupContent' class. We would like to get rid of this altogether,
+     *     except that it does come in handy for the framed and anchoredbubble
+     *     popups, who need to maintain yet another barrier between their 
+     *     content and the outer border of the popup itself. 
+     * 
+     *     Note that in order to not break API, we must continue to support 
+     *     this property being set as an integer. Really, though, we'd like to 
+     *     have this specified as a Bounds object so that user can specify
+     *     distinct left, top, right, bottom paddings. With the 3.0 release
+     *     we can make this only a bounds.
+     */
+    padding: 0,
+
+    /** 
+     * Property: disableFirefoxOverflowHack
+     * {Boolean} The hack for overflow in Firefox causes all elements 
+     *     to be re-drawn, which causes Flash elements to be 
+     *     re-initialized, which is troublesome.
+     *     With this property the hack can be disabled.
+     */
+    disableFirefoxOverflowHack: false,
+
+    /**
+     * Method: fixPadding
+     * To be removed in 3.0, this function merely helps us to deal with the 
+     *     case where the user may have set an integer value for padding, 
+     *     instead of an <OpenLayers.Bounds> object.
+     */
+    fixPadding: function() {
+        if (typeof this.padding == "number") {
+            this.padding = new OpenLayers.Bounds(
+                this.padding, this.padding, this.padding, this.padding
+            );
+        }
+    },
+
+    /**
+     * APIProperty: panMapIfOutOfView
+     * {Boolean} When drawn, pan map such that the entire popup is visible in
+     *     the current viewport (if necessary).
+     *     Default is false.
+     */
+    panMapIfOutOfView: false,
+    
+    /**
+     * APIProperty: keepInMap 
+     * {Boolean} If panMapIfOutOfView is false, and this property is true, 
+     *     contrain the popup such that it always fits in the available map
+     *     space. By default, this is not set on the base class. If you are
+     *     creating popups that are near map edges and not allowing pannning,
+     *     and especially if you have a popup which has a
+     *     fixedRelativePosition, setting this to false may be a smart thing to
+     *     do. Subclasses may want to override this setting.
+     *   
+     *     Default is false.
+     */
+    keepInMap: false,
+
+    /**
+     * APIProperty: closeOnMove
+     * {Boolean} When map pans, close the popup.
+     *     Default is false.
+     */
+    closeOnMove: false,
+    
+    /** 
+     * Property: map 
+     * {<OpenLayers.Map>} this gets set in Map.js when the popup is added to the map
+     */
+    map: null,
+
+    /** 
+    * Constructor: OpenLayers.Popup
+    * Create a popup.
+    * 
+    * Parameters: 
+    * id - {String} a unqiue identifier for this popup.  If null is passed
+    *               an identifier will be automatically generated. 
+    * lonlat - {<OpenLayers.LonLat>}  The position on the map the popup will
+    *                                 be shown.
+    * contentSize - {<OpenLayers.Size>} The size of the content.
+    * contentHTML - {String}          An HTML string to display inside the   
+    *                                 popup.
+    * closeBox - {Boolean}            Whether to display a close box inside
+    *                                 the popup.
+    * closeBoxCallback - {Function}   Function to be called on closeBox click.
+    */
+    initialize:function(id, lonlat, contentSize, contentHTML, closeBox, closeBoxCallback) {
+        if (id == null) {
+            id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+        }
+
+        this.id = id;
+        this.lonlat = lonlat;
+
+        this.contentSize = (contentSize != null) ? contentSize 
+                                  : new OpenLayers.Size(
+                                                   OpenLayers.Popup.WIDTH,
+                                                   OpenLayers.Popup.HEIGHT);
+        if (contentHTML != null) { 
+             this.contentHTML = contentHTML;
+        }
+        this.backgroundColor = OpenLayers.Popup.COLOR;
+        this.opacity = OpenLayers.Popup.OPACITY;
+        this.border = OpenLayers.Popup.BORDER;
+
+        this.div = OpenLayers.Util.createDiv(this.id, null, null, 
+                                             null, null, null, "hidden");
+        this.div.className = this.displayClass;
+        
+        var groupDivId = this.id + "_GroupDiv";
+        this.groupDiv = OpenLayers.Util.createDiv(groupDivId, null, null, 
+                                                    null, "relative", null,
+                                                    "hidden");
+
+        var id = this.div.id + "_contentDiv";
+        this.contentDiv = OpenLayers.Util.createDiv(id, null, this.contentSize.clone(), 
+                                                    null, "relative");
+        this.contentDiv.className = this.contentDisplayClass;
+        this.groupDiv.appendChild(this.contentDiv);
+        this.div.appendChild(this.groupDiv);
+
+        if (closeBox) {
+            this.addCloseBox(closeBoxCallback);
+        } 
+
+        this.registerEvents();
+    },
+
+    /** 
+     * Method: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+
+        this.id = null;
+        this.lonlat = null;
+        this.size = null;
+        this.contentHTML = null;
+        
+        this.backgroundColor = null;
+        this.opacity = null;
+        this.border = null;
+        
+        if (this.closeOnMove && this.map) {
+            this.map.events.unregister("movestart", this, this.hide);
+        }
+
+        this.events.destroy();
+        this.events = null;
+        
+        if (this.closeDiv) {
+            OpenLayers.Event.stopObservingElement(this.closeDiv); 
+            this.groupDiv.removeChild(this.closeDiv);
+        }
+        this.closeDiv = null;
+        
+        this.div.removeChild(this.groupDiv);
+        this.groupDiv = null;
+
+        if (this.map != null) {
+            this.map.removePopup(this);
+        }
+        this.map = null;
+        this.div = null;
+        
+        this.autoSize = null;
+        this.minSize = null;
+        this.maxSize = null;
+        this.padding = null;
+        this.panMapIfOutOfView = null;
+    },
+
+    /** 
+    * Method: draw
+    * Constructs the elements that make up the popup.
+    *
+    * Parameters:
+    * px - {<OpenLayers.Pixel>} the position the popup in pixels.
+    * 
+    * Returns:
+    * {DOMElement} Reference to a div that contains the drawn popup
+    */
+    draw: function(px) {
+        if (px == null) {
+            if ((this.lonlat != null) && (this.map != null)) {
+                px = this.map.getLayerPxFromLonLat(this.lonlat);
+            }
+        }
+
+        // this assumes that this.map already exists, which is okay because 
+        // this.draw is only called once the popup has been added to the map.
+        if (this.closeOnMove) {
+            this.map.events.register("movestart", this, this.hide);
+        }
+        
+        //listen to movestart, moveend to disable overflow (FF bug)
+        if (!this.disableFirefoxOverflowHack && OpenLayers.Util.getBrowserName() == 'firefox') {
+            this.map.events.register("movestart", this, function() {
+                var style = document.defaultView.getComputedStyle(
+                    this.contentDiv, null
+                );
+                var currentOverflow = style.getPropertyValue("overflow");
+                if (currentOverflow != "hidden") {
+                    this.contentDiv._oldOverflow = currentOverflow;
+                    this.contentDiv.style.overflow = "hidden";
+                }
+            });
+            this.map.events.register("moveend", this, function() {
+                var oldOverflow = this.contentDiv._oldOverflow;
+                if (oldOverflow) {
+                    this.contentDiv.style.overflow = oldOverflow;
+                    this.contentDiv._oldOverflow = null;
+                }
+            });
+        }
+
+        this.moveTo(px);
+        if (!this.autoSize && !this.size) {
+            this.setSize(this.contentSize);
+        }
+        this.setBackgroundColor();
+        this.setOpacity();
+        this.setBorder();
+        this.setContentHTML();
+        
+        if (this.panMapIfOutOfView) {
+            this.panIntoView();
+        }    
+
+        return this.div;
+    },
+
+    /** 
+     * Method: updatePosition
+     * if the popup has a lonlat and its map members set, 
+     * then have it move itself to its proper position
+     */
+    updatePosition: function() {
+        if ((this.lonlat) && (this.map)) {
+            var px = this.map.getLayerPxFromLonLat(this.lonlat);
+            if (px) {
+                this.moveTo(px);           
+            }    
+        }
+    },
+
+    /**
+     * Method: moveTo
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} the top and left position of the popup div. 
+     */
+    moveTo: function(px) {
+        if ((px != null) && (this.div != null)) {
+            this.div.style.left = px.x + "px";
+            this.div.style.top = px.y + "px";
+        }
+    },
+
+    /**
+     * Method: visible
+     *
+     * Returns:      
+     * {Boolean} Boolean indicating whether or not the popup is visible
+     */
+    visible: function() {
+        return OpenLayers.Element.visible(this.div);
+    },
+
+    /**
+     * Method: toggle
+     * Toggles visibility of the popup.
+     */
+    toggle: function() {
+        if (this.visible()) {
+            this.hide();
+        } else {
+            this.show();
+        }
+    },
+
+    /**
+     * Method: show
+     * Makes the popup visible.
+     */
+    show: function() {
+        OpenLayers.Element.show(this.div);
+
+        if (this.panMapIfOutOfView) {
+            this.panIntoView();
+        }    
+    },
+
+    /**
+     * Method: hide
+     * Makes the popup invisible.
+     */
+    hide: function() {
+        OpenLayers.Element.hide(this.div);
+    },
+
+    /**
+     * Method: setSize
+     * Used to adjust the size of the popup. 
+     *
+     * Parameters:
+     * contentSize - {<OpenLayers.Size>} the new size for the popup's 
+     *     contents div (in pixels).
+     */
+    setSize:function(contentSize) { 
+        this.size = contentSize.clone(); 
+        
+        // if our contentDiv has a css 'padding' set on it by a stylesheet, we 
+        //  must add that to the desired "size". 
+        var contentDivPadding = this.getContentDivPadding();
+        var wPadding = contentDivPadding.left + contentDivPadding.right;
+        var hPadding = contentDivPadding.top + contentDivPadding.bottom;
+
+        // take into account the popup's 'padding' property
+        this.fixPadding();
+        wPadding += this.padding.left + this.padding.right;
+        hPadding += this.padding.top + this.padding.bottom;
+
+        // make extra space for the close div
+        if (this.closeDiv) {
+            var closeDivWidth = parseInt(this.closeDiv.style.width);
+            wPadding += closeDivWidth + contentDivPadding.right;
+        }
+
+        //increase size of the main popup div to take into account the 
+        // users's desired padding and close div.        
+        this.size.w += wPadding;
+        this.size.h += hPadding;
+
+        //now if our browser is IE, we need to actually make the contents 
+        // div itself bigger to take its own padding into effect. this makes 
+        // me want to shoot someone, but so it goes.
+        if (OpenLayers.Util.getBrowserName() == "msie") {
+            this.contentSize.w += 
+                contentDivPadding.left + contentDivPadding.right;
+            this.contentSize.h += 
+                contentDivPadding.bottom + contentDivPadding.top;
+        }
+
+        if (this.div != null) {
+            this.div.style.width = this.size.w + "px";
+            this.div.style.height = this.size.h + "px";
+        }
+        if (this.contentDiv != null){
+            this.contentDiv.style.width = contentSize.w + "px";
+            this.contentDiv.style.height = contentSize.h + "px";
+        }
+    },  
+
+    /**
+     * APIMethod: updateSize
+     * Auto size the popup so that it precisely fits its contents (as 
+     *     determined by this.contentDiv.innerHTML). Popup size will, of
+     *     course, be limited by the available space on the current map
+     */
+    updateSize: function() {
+        
+        // determine actual render dimensions of the contents by putting its
+        // contents into a fake contentDiv (for the CSS) and then measuring it
+        var preparedHTML = "<div class='" + this.contentDisplayClass+ "'>" + 
+            this.contentDiv.innerHTML + 
+            "</div>";
+ 
+        var containerElement = (this.map) ? this.map.layerContainerDiv
+        								  : document.body;
+        var realSize = OpenLayers.Util.getRenderedDimensions(
+            preparedHTML, null,	{
+                displayClass: this.displayClass,
+                containerElement: containerElement
+            }
+        );
+
+        // is the "real" size of the div is safe to display in our map?
+        var safeSize = this.getSafeContentSize(realSize);
+
+        var newSize = null;
+        if (safeSize.equals(realSize)) {
+            //real size of content is small enough to fit on the map, 
+            // so we use real size.
+            newSize = realSize;
+
+        } else {
+
+            //make a new OL.Size object with the clipped dimensions 
+            // set or null if not clipped.
+            var fixedSize = new OpenLayers.Size();
+            fixedSize.w = (safeSize.w < realSize.w) ? safeSize.w : null;
+            fixedSize.h = (safeSize.h < realSize.h) ? safeSize.h : null;
+        
+            if (fixedSize.w && fixedSize.h) {
+                //content is too big in both directions, so we will use 
+                // max popup size (safeSize), knowing well that it will 
+                // overflow both ways.                
+                newSize = safeSize;
+            } else {
+                //content is clipped in only one direction, so we need to 
+                // run getRenderedDimensions() again with a fixed dimension
+                var clippedSize = OpenLayers.Util.getRenderedDimensions(
+                    preparedHTML, fixedSize, {
+                        displayClass: this.contentDisplayClass,
+                        containerElement: containerElement
+                    }
+                );
+                
+                //if the clipped size is still the same as the safeSize, 
+                // that means that our content must be fixed in the 
+                // offending direction. If overflow is 'auto', this means 
+                // we are going to have a scrollbar for sure, so we must 
+                // adjust for that.
+                //
+                var currentOverflow = OpenLayers.Element.getStyle(
+                    this.contentDiv, "overflow"
+                );
+                if ( (currentOverflow != "hidden") && 
+                     (clippedSize.equals(safeSize)) ) {
+                    var scrollBar = OpenLayers.Util.getScrollbarWidth();
+                    if (fixedSize.w) {
+                        clippedSize.h += scrollBar;
+                    } else {
+                        clippedSize.w += scrollBar;
+                    }
+                }
+                
+                newSize = this.getSafeContentSize(clippedSize);
+            }
+        }                        
+        this.setSize(newSize);     
+    },    
+
+    /**
+     * Method: setBackgroundColor
+     * Sets the background color of the popup.
+     *
+     * Parameters:
+     * color - {String} the background color.  eg "#FFBBBB"
+     */
+    setBackgroundColor:function(color) { 
+        if (color != undefined) {
+            this.backgroundColor = color; 
+        }
+        
+        if (this.div != null) {
+            this.div.style.backgroundColor = this.backgroundColor;
+        }
+    },  
+    
+    /**
+     * Method: setOpacity
+     * Sets the opacity of the popup.
+     * 
+     * Parameters:
+     * opacity - {float} A value between 0.0 (transparent) and 1.0 (solid).   
+     */
+    setOpacity:function(opacity) { 
+        if (opacity != undefined) {
+            this.opacity = opacity; 
+        }
+        
+        if (this.div != null) {
+            // for Mozilla and Safari
+            this.div.style.opacity = this.opacity;
+
+            // for IE
+            this.div.style.filter = 'alpha(opacity=' + this.opacity*100 + ')';
+        }
+    },  
+    
+    /**
+     * Method: setBorder
+     * Sets the border style of the popup.
+     *
+     * Parameters:
+     * border - {String} The border style value. eg 2px 
+     */
+    setBorder:function(border) { 
+        if (border != undefined) {
+            this.border = border;
+        }
+        
+        if (this.div != null) {
+            this.div.style.border = this.border;
+        }
+    },      
+    
+    /**
+     * Method: setContentHTML
+     * Allows the user to set the HTML content of the popup.
+     *
+     * Parameters:
+     * contentHTML - {String} HTML for the div.
+     */
+    setContentHTML:function(contentHTML) {
+
+        if (contentHTML != null) {
+            this.contentHTML = contentHTML;
+        }
+       
+        if ((this.contentDiv != null) && 
+            (this.contentHTML != null) &&
+            (this.contentHTML != this.contentDiv.innerHTML)) {
+       
+            this.contentDiv.innerHTML = this.contentHTML;
+       
+            if (this.autoSize) {
+                
+                //if popup has images, listen for when they finish
+                // loading and resize accordingly
+                this.registerImageListeners();
+
+                //auto size the popup to its current contents
+                this.updateSize();
+            }
+        }    
+
+    },
+    
+    /**
+     * Method: registerImageListeners
+     * Called when an image contained by the popup loaded. this function
+     *     updates the popup size, then unregisters the image load listener.
+     */   
+    registerImageListeners: function() { 
+
+        // As the images load, this function will call updateSize() to 
+        // resize the popup to fit the content div (which presumably is now
+        // bigger than when the image was not loaded).
+        // 
+        // If the 'panMapIfOutOfView' property is set, we will pan the newly
+        // resized popup back into view.
+        // 
+        // Note that this function, when called, will have 'popup' and 
+        // 'img' properties in the context.
+        //
+        var onImgLoad = function() {
+            
+            this.popup.updateSize();
+     
+            if ( this.popup.visible() && this.popup.panMapIfOutOfView ) {
+                this.popup.panIntoView();
+            }
+
+            OpenLayers.Event.stopObserving(
+                this.img, "load", this.img._onImageLoad
+            );
+    
+        };
+
+        //cycle through the images and if their size is 0x0, that means that 
+        // they haven't been loaded yet, so we attach the listener, which 
+        // will fire when the images finish loading and will resize the 
+        // popup accordingly to its new size.
+        var images = this.contentDiv.getElementsByTagName("img");
+        for (var i = 0, len = images.length; i < len; i++) {
+            var img = images[i];
+            if (img.width == 0 || img.height == 0) {
+
+                var context = {
+                    'popup': this,
+                    'img': img
+                };
+
+                //expando this function to the image itself before registering
+                // it. This way we can easily and properly unregister it.
+                img._onImgLoad = OpenLayers.Function.bind(onImgLoad, context);
+
+                OpenLayers.Event.observe(img, 'load', img._onImgLoad);
+            }    
+        } 
+    },
+
+    /**
+     * APIMethod: getSafeContentSize
+     * 
+     * Parameters:
+     * size - {<OpenLayers.Size>} Desired size to make the popup.
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} A size to make the popup which is neither smaller
+     *     than the specified minimum size, nor bigger than the maximum 
+     *     size (which is calculated relative to the size of the viewport).
+     */
+    getSafeContentSize: function(size) {
+
+        var safeContentSize = size.clone();
+
+        // if our contentDiv has a css 'padding' set on it by a stylesheet, we 
+        //  must add that to the desired "size". 
+        var contentDivPadding = this.getContentDivPadding();
+        var wPadding = contentDivPadding.left + contentDivPadding.right;
+        var hPadding = contentDivPadding.top + contentDivPadding.bottom;
+
+        // take into account the popup's 'padding' property
+        this.fixPadding();
+        wPadding += this.padding.left + this.padding.right;
+        hPadding += this.padding.top + this.padding.bottom;
+
+        if (this.closeDiv) {
+            var closeDivWidth = parseInt(this.closeDiv.style.width);
+            wPadding += closeDivWidth + contentDivPadding.right;
+        }
+
+        // prevent the popup from being smaller than a specified minimal size
+        if (this.minSize) {
+            safeContentSize.w = Math.max(safeContentSize.w, 
+                (this.minSize.w - wPadding));
+            safeContentSize.h = Math.max(safeContentSize.h, 
+                (this.minSize.h - hPadding));
+        }
+
+        // prevent the popup from being bigger than a specified maximum size
+        if (this.maxSize) {
+            safeContentSize.w = Math.min(safeContentSize.w, 
+                (this.maxSize.w - wPadding));
+            safeContentSize.h = Math.min(safeContentSize.h, 
+                (this.maxSize.h - hPadding));
+        }
+        
+        //make sure the desired size to set doesn't result in a popup that 
+        // is bigger than the map's viewport.
+        //
+        if (this.map && this.map.size) {
+            
+            var extraX = 0, extraY = 0;
+            if (this.keepInMap && !this.panMapIfOutOfView) {
+                var px = this.map.getPixelFromLonLat(this.lonlat);
+                switch (this.relativePosition) {
+                    case "tr":
+                        extraX = px.x;
+                        extraY = this.map.size.h - px.y;
+                        break;
+                    case "tl":
+                        extraX = this.map.size.w - px.x;
+                        extraY = this.map.size.h - px.y;
+                        break;
+                    case "bl":
+                        extraX = this.map.size.w - px.x;
+                        extraY = px.y;
+                        break;
+                    case "br":
+                        extraX = px.x;
+                        extraY = px.y;
+                        break;
+                    default:    
+                        extraX = px.x;
+                        extraY = this.map.size.h - px.y;
+                        break;
+                }
+            }    
+          
+            var maxY = this.map.size.h - 
+                this.map.paddingForPopups.top - 
+                this.map.paddingForPopups.bottom - 
+                hPadding - extraY;
+            
+            var maxX = this.map.size.w - 
+                this.map.paddingForPopups.left - 
+                this.map.paddingForPopups.right - 
+                wPadding - extraX;
+            
+            safeContentSize.w = Math.min(safeContentSize.w, maxX);
+            safeContentSize.h = Math.min(safeContentSize.h, maxY);
+        }
+        
+        return safeContentSize;
+    },
+    
+    /**
+     * Method: getContentDivPadding
+     * Glorious, oh glorious hack in order to determine the css 'padding' of 
+     *     the contentDiv. IE/Opera return null here unless we actually add the 
+     *     popup's main 'div' element (which contains contentDiv) to the DOM. 
+     *     So we make it invisible and then add it to the document temporarily. 
+     *
+     *     Once we've taken the padding readings we need, we then remove it 
+     *     from the DOM (it will actually get added to the DOM in 
+     *     Map.js's addPopup)
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getContentDivPadding: function() {
+
+        //use cached value if we have it
+        var contentDivPadding = this._contentDivPadding;
+        if (!contentDivPadding) {
+
+        	if (this.div.parentNode == null) {
+	        	//make the div invisible and add it to the page        
+	            this.div.style.display = "none";
+	            document.body.appendChild(this.div);
+	    	}
+	            
+            //read the padding settings from css, put them in an OL.Bounds        
+            contentDivPadding = new OpenLayers.Bounds(
+                OpenLayers.Element.getStyle(this.contentDiv, "padding-left"),
+                OpenLayers.Element.getStyle(this.contentDiv, "padding-bottom"),
+                OpenLayers.Element.getStyle(this.contentDiv, "padding-right"),
+                OpenLayers.Element.getStyle(this.contentDiv, "padding-top")
+            );
+    
+            //cache the value
+            this._contentDivPadding = contentDivPadding;
+
+            if (this.div.parentNode == document.body) {
+	            //remove the div from the page and make it visible again
+	            document.body.removeChild(this.div);
+	            this.div.style.display = "";
+            }
+        }
+        return contentDivPadding;
+    },
+
+    /**
+     * Method: addCloseBox
+     * 
+     * Parameters:
+     * callback - {Function} The callback to be called when the close button
+     *     is clicked.
+     */
+    addCloseBox: function(callback) {
+
+        this.closeDiv = OpenLayers.Util.createDiv(
+            this.id + "_close", null, new OpenLayers.Size(17, 17)
+        );
+        this.closeDiv.className = "olPopupCloseBox"; 
+        
+        // use the content div's css padding to determine if we should
+        //  padd the close div
+        var contentDivPadding = this.getContentDivPadding();
+         
+        this.closeDiv.style.right = contentDivPadding.right + "px";
+        this.closeDiv.style.top = contentDivPadding.top + "px";
+        this.groupDiv.appendChild(this.closeDiv);
+
+        var closePopup = callback || function(e) {
+            this.hide();
+            OpenLayers.Event.stop(e);
+        };
+        OpenLayers.Event.observe(this.closeDiv, "click", 
+                OpenLayers.Function.bindAsEventListener(closePopup, this));
+    },
+
+    /**
+     * Method: panIntoView
+     * Pans the map such that the popup is totaly viewable (if necessary)
+     */
+    panIntoView: function() {
+        
+        var mapSize = this.map.getSize();
+    
+        //start with the top left corner of the popup, in px, 
+        // relative to the viewport
+        var origTL = this.map.getViewPortPxFromLayerPx( new OpenLayers.Pixel(
+            parseInt(this.div.style.left),
+            parseInt(this.div.style.top)
+        ));
+        var newTL = origTL.clone();
+    
+        //new left (compare to margins, using this.size to calculate right)
+        if (origTL.x < this.map.paddingForPopups.left) {
+            newTL.x = this.map.paddingForPopups.left;
+        } else 
+        if ( (origTL.x + this.size.w) > (mapSize.w - this.map.paddingForPopups.right)) {
+            newTL.x = mapSize.w - this.map.paddingForPopups.right - this.size.w;
+        }
+        
+        //new top (compare to margins, using this.size to calculate bottom)
+        if (origTL.y < this.map.paddingForPopups.top) {
+            newTL.y = this.map.paddingForPopups.top;
+        } else 
+        if ( (origTL.y + this.size.h) > (mapSize.h - this.map.paddingForPopups.bottom)) {
+            newTL.y = mapSize.h - this.map.paddingForPopups.bottom - this.size.h;
+        }
+        
+        var dx = origTL.x - newTL.x;
+        var dy = origTL.y - newTL.y;
+        
+        this.map.pan(dx, dy);
+    },
+
+    /** 
+     * Method: registerEvents
+     * Registers events on the popup.
+     *
+     * Do this in a separate function so that subclasses can 
+     *   choose to override it if they wish to deal differently
+     *   with mouse events
+     * 
+     *   Note in the following handler functions that some special
+     *    care is needed to deal correctly with mousing and popups. 
+     *   
+     *   Because the user might select the zoom-rectangle option and
+     *    then drag it over a popup, we need a safe way to allow the
+     *    mousemove and mouseup events to pass through the popup when
+     *    they are initiated from outside.
+     * 
+     *   Otherwise, we want to essentially kill the event propagation
+     *    for all other events, though we have to do so carefully, 
+     *    without disabling basic html functionality, like clicking on 
+     *    hyperlinks or drag-selecting text.
+     */
+     registerEvents:function() {
+        this.events = new OpenLayers.Events(this, this.div, null, true);
+
+        this.events.on({
+            "mousedown": this.onmousedown,
+            "mousemove": this.onmousemove,
+            "mouseup": this.onmouseup,
+            "click": this.onclick,
+            "mouseout": this.onmouseout,
+            "dblclick": this.ondblclick,
+            scope: this
+        });
+        
+     },
+
+    /** 
+     * Method: onmousedown 
+     * When mouse goes down within the popup, make a note of
+     *   it locally, and then do not propagate the mousedown 
+     *   (but do so safely so that user can select text inside)
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    onmousedown: function (evt) {
+        this.mousedown = true;
+        OpenLayers.Event.stop(evt, true);
+    },
+
+    /** 
+     * Method: onmousemove
+     * If the drag was started within the popup, then 
+     *   do not propagate the mousemove (but do so safely
+     *   so that user can select text inside)
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    onmousemove: function (evt) {
+        if (this.mousedown) {
+            OpenLayers.Event.stop(evt, true);
+        }
+    },
+
+    /** 
+     * Method: onmouseup
+     * When mouse comes up within the popup, after going down 
+     *   in it, reset the flag, and then (once again) do not 
+     *   propagate the event, but do so safely so that user can 
+     *   select text inside
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    onmouseup: function (evt) {
+        if (this.mousedown) {
+            this.mousedown = false;
+            OpenLayers.Event.stop(evt, true);
+        }
+    },
+
+    /**
+     * Method: onclick
+     * Ignore clicks, but allowing default browser handling
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    onclick: function (evt) {
+        OpenLayers.Event.stop(evt, true);
+    },
+
+    /** 
+     * Method: onmouseout
+     * When mouse goes out of the popup set the flag to false so that
+     *   if they let go and then drag back in, we won't be confused.
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    onmouseout: function (evt) {
+        this.mousedown = false;
+    },
+    
+    /** 
+     * Method: ondblclick
+     * Ignore double-clicks, but allowing default browser handling
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    ondblclick: function (evt) {
+        OpenLayers.Event.stop(evt, true);
+    },
+
+    CLASS_NAME: "OpenLayers.Popup"
+});
+
+OpenLayers.Popup.WIDTH = 200;
+OpenLayers.Popup.HEIGHT = 200;
+OpenLayers.Popup.COLOR = "white";
+OpenLayers.Popup.OPACITY = 1;
+OpenLayers.Popup.BORDER = "0px";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Events.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Events.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Events.js	(revision 76)
@@ -0,0 +1,855 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Util.js
+ */
+
+/**
+ * Namespace: OpenLayers.Event
+ * Utility functions for event handling.
+ */
+OpenLayers.Event = {
+
+    /** 
+     * Property: observers 
+     * {Object} A hashtable cache of the event observers. Keyed by
+     * element._eventCacheID 
+     */
+    observers: false,
+    
+    /** 
+     * Constant: KEY_BACKSPACE 
+     * {int} 
+     */
+    KEY_BACKSPACE: 8,
+
+    /** 
+     * Constant: KEY_TAB 
+     * {int} 
+     */
+    KEY_TAB: 9,
+
+    /** 
+     * Constant: KEY_RETURN 
+     * {int} 
+     */
+    KEY_RETURN: 13,
+
+    /** 
+     * Constant: KEY_ESC 
+     * {int} 
+     */
+    KEY_ESC: 27,
+
+    /** 
+     * Constant: KEY_LEFT 
+     * {int} 
+     */
+    KEY_LEFT: 37,
+
+    /** 
+     * Constant: KEY_UP 
+     * {int} 
+     */
+    KEY_UP: 38,
+
+    /** 
+     * Constant: KEY_RIGHT 
+     * {int} 
+     */
+    KEY_RIGHT: 39,
+
+    /** 
+     * Constant: KEY_DOWN 
+     * {int} 
+     */
+    KEY_DOWN: 40,
+
+    /** 
+     * Constant: KEY_DELETE 
+     * {int} 
+     */
+    KEY_DELETE: 46,
+
+
+    /**
+     * Method: element
+     * Cross browser event element detection.
+     * 
+     * Parameters:
+     * event - {Event} 
+     * 
+     * Returns:
+     * {DOMElement} The element that caused the event 
+     */
+    element: function(event) {
+        return event.target || event.srcElement;
+    },
+
+    /**
+     * Method: isLeftClick
+     * Determine whether event was caused by a left click. 
+     *
+     * Parameters:
+     * event - {Event} 
+     * 
+     * Returns:
+     * {Boolean}
+     */
+    isLeftClick: function(event) {
+        return (((event.which) && (event.which == 1)) ||
+                ((event.button) && (event.button == 1)));
+    },
+
+    /**
+     * Method: isRightClick
+     * Determine whether event was caused by a right mouse click. 
+     *
+     * Parameters:
+     * event - {Event} 
+     * 
+     * Returns:
+     * {Boolean}
+     */
+     isRightClick: function(event) {
+        return (((event.which) && (event.which == 3)) ||
+                ((event.button) && (event.button == 2)));
+    },
+     
+    /**
+     * Method: stop
+     * Stops an event from propagating. 
+     *
+     * Parameters: 
+     * event - {Event} 
+     * allowDefault - {Boolean} If true, we stop the event chain but 
+     *                               still allow the default browser 
+     *                               behaviour (text selection, radio-button 
+     *                               clicking, etc)
+     *                               Default false
+     */
+    stop: function(event, allowDefault) {
+        
+        if (!allowDefault) { 
+            if (event.preventDefault) {
+                event.preventDefault();
+            } else {
+                event.returnValue = false;
+            }
+        }
+                
+        if (event.stopPropagation) {
+            event.stopPropagation();
+        } else {
+            event.cancelBubble = true;
+        }
+    },
+
+    /** 
+     * Method: findElement
+     * 
+     * Parameters:
+     * event - {Event} 
+     * tagName - {String} 
+     * 
+     * Returns:
+     * {DOMElement} The first node with the given tagName, starting from the
+     * node the event was triggered on and traversing the DOM upwards
+     */
+    findElement: function(event, tagName) {
+        var element = OpenLayers.Event.element(event);
+        while (element.parentNode && (!element.tagName ||
+              (element.tagName.toUpperCase() != tagName.toUpperCase()))){
+            element = element.parentNode;
+        }
+        return element;
+    },
+
+    /** 
+     * Method: observe
+     * 
+     * Parameters:
+     * elementParam - {DOMElement || String} 
+     * name - {String} 
+     * observer - {function} 
+     * useCapture - {Boolean} 
+     */
+    observe: function(elementParam, name, observer, useCapture) {
+        var element = OpenLayers.Util.getElement(elementParam);
+        useCapture = useCapture || false;
+
+        if (name == 'keypress' &&
+           (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
+           || element.attachEvent)) {
+            name = 'keydown';
+        }
+
+        //if observers cache has not yet been created, create it
+        if (!this.observers) {
+            this.observers = {};
+        }
+
+        //if not already assigned, make a new unique cache ID
+        if (!element._eventCacheID) {
+            var idPrefix = "eventCacheID_";
+            if (element.id) {
+                idPrefix = element.id + "_" + idPrefix;
+            }
+            element._eventCacheID = OpenLayers.Util.createUniqueID(idPrefix);
+        }
+
+        var cacheID = element._eventCacheID;
+
+        //if there is not yet a hash entry for this element, add one
+        if (!this.observers[cacheID]) {
+            this.observers[cacheID] = [];
+        }
+
+        //add a new observer to this element's list
+        this.observers[cacheID].push({
+            'element': element,
+            'name': name,
+            'observer': observer,
+            'useCapture': useCapture
+        });
+
+        //add the actual browser event listener
+        if (element.addEventListener) {
+            element.addEventListener(name, observer, useCapture);
+        } else if (element.attachEvent) {
+            element.attachEvent('on' + name, observer);
+        }
+    },
+
+    /** 
+     * Method: stopObservingElement
+     * Given the id of an element to stop observing, cycle through the 
+     *   element's cached observers, calling stopObserving on each one, 
+     *   skipping those entries which can no longer be removed.
+     * 
+     * parameters:
+     * elementParam - {DOMElement || String} 
+     */
+    stopObservingElement: function(elementParam) {
+        var element = OpenLayers.Util.getElement(elementParam);
+        var cacheID = element._eventCacheID;
+
+        this._removeElementObservers(OpenLayers.Event.observers[cacheID]);
+    },
+
+    /**
+     * Method: _removeElementObservers
+     *
+     * Parameters:
+     * elementObservers - {Array(Object)} Array of (element, name, 
+     *                                         observer, usecapture) objects, 
+     *                                         taken directly from hashtable
+     */
+    _removeElementObservers: function(elementObservers) {
+        if (elementObservers) {
+            for(var i = elementObservers.length-1; i >= 0; i--) {
+                var entry = elementObservers[i];
+                var args = new Array(entry.element,
+                                     entry.name,
+                                     entry.observer,
+                                     entry.useCapture);
+                var removed = OpenLayers.Event.stopObserving.apply(this, args);
+            }
+        }
+    },
+
+    /**
+     * Method: stopObserving
+     * 
+     * Parameters:
+     * elementParam - {DOMElement || String} 
+     * name - {String} 
+     * observer - {function} 
+     * useCapture - {Boolean} 
+     *  
+     * Returns:
+     * {Boolean} Whether or not the event observer was removed
+     */
+    stopObserving: function(elementParam, name, observer, useCapture) {
+        useCapture = useCapture || false;
+    
+        var element = OpenLayers.Util.getElement(elementParam);
+        var cacheID = element._eventCacheID;
+
+        if (name == 'keypress') {
+            if ( navigator.appVersion.match(/Konqueror|Safari|KHTML/) || 
+                 element.detachEvent) {
+              name = 'keydown';
+            }
+        }
+
+        // find element's entry in this.observers cache and remove it
+        var foundEntry = false;
+        var elementObservers = OpenLayers.Event.observers[cacheID];
+        if (elementObservers) {
+    
+            // find the specific event type in the element's list
+            var i=0;
+            while(!foundEntry && i < elementObservers.length) {
+                var cacheEntry = elementObservers[i];
+    
+                if ((cacheEntry.name == name) &&
+                    (cacheEntry.observer == observer) &&
+                    (cacheEntry.useCapture == useCapture)) {
+    
+                    elementObservers.splice(i, 1);
+                    if (elementObservers.length == 0) {
+                        delete OpenLayers.Event.observers[cacheID];
+                    }
+                    foundEntry = true;
+                    break; 
+                }
+                i++;           
+            }
+        }
+    
+        //actually remove the event listener from browser
+        if (foundEntry) {
+            if (element.removeEventListener) {
+                element.removeEventListener(name, observer, useCapture);
+            } else if (element && element.detachEvent) {
+                element.detachEvent('on' + name, observer);
+            }
+        }
+        return foundEntry;
+    },
+    
+    /** 
+     * Method: unloadCache
+     * Cycle through all the element entries in the events cache and call
+     *   stopObservingElement on each. 
+     */
+    unloadCache: function() {
+        // check for OpenLayers.Event before checking for observers, because
+        // OpenLayers.Event may be undefined in IE if no map instance was
+        // created
+        if (OpenLayers.Event && OpenLayers.Event.observers) {
+            for (var cacheID in OpenLayers.Event.observers) {
+                var elementObservers = OpenLayers.Event.observers[cacheID];
+                OpenLayers.Event._removeElementObservers.apply(this, 
+                                                           [elementObservers]);
+            }
+            OpenLayers.Event.observers = false;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Event"
+};
+
+/* prevent memory leaks in IE */
+OpenLayers.Event.observe(window, 'unload', OpenLayers.Event.unloadCache, false);
+
+// FIXME: Remove this in 3.0. In 3.0, Event.stop will no longer be provided
+// by OpenLayers.
+if (window.Event) {
+    OpenLayers.Util.applyDefaults(window.Event, OpenLayers.Event);
+} else {
+    var Event = OpenLayers.Event;
+}
+
+/**
+ * Class: OpenLayers.Events
+ */
+OpenLayers.Events = OpenLayers.Class({
+
+    /** 
+     * Constant: BROWSER_EVENTS
+     * {Array(String)} supported events 
+     */
+    BROWSER_EVENTS: [
+        "mouseover", "mouseout",
+        "mousedown", "mouseup", "mousemove", 
+        "click", "dblclick", "rightclick", "dblrightclick",
+        "resize", "focus", "blur"
+    ],
+
+    /** 
+     * Property: listeners 
+     * {Object} Hashtable of Array(Function): events listener functions  
+     */
+    listeners: null,
+
+    /** 
+     * Property: object 
+     * {Object}  the code object issuing application events 
+     */
+    object: null,
+
+    /** 
+     * Property: element 
+     * {DOMElement}  the DOM element receiving browser events 
+     */
+    element: null,
+
+    /** 
+     * Property: eventTypes 
+     * {Array(String)}  list of support application events 
+     */
+    eventTypes: null,
+
+    /** 
+     * Property: eventHandler 
+     * {Function}  bound event handler attached to elements 
+     */
+    eventHandler: null,
+
+    /** 
+     * APIProperty: fallThrough 
+     * {Boolean} 
+     */
+    fallThrough: null,
+
+    /** 
+     * APIProperty: includeXY
+     * {Boolean} Should the .xy property automatically be created for browser
+     *    mouse events? In general, this should be false. If it is true, then
+     *    mouse events will automatically generate a '.xy' property on the 
+     *    event object that is passed. (Prior to OpenLayers 2.7, this was true
+     *    by default.) Otherwise, you can call the getMousePosition on the
+     *    relevant events handler on the object available via the 'evt.object'
+     *    property of the evt object. So, for most events, you can call:
+     *    function named(evt) { 
+     *        this.xy = this.object.events.getMousePosition(evt) 
+     *    } 
+     *
+     *    This option typically defaults to false for performance reasons:
+     *    when creating an events object whose primary purpose is to manage
+     *    relatively positioned mouse events within a div, it may make
+     *    sense to set it to true.
+     *
+     *    This option is also used to control whether the events object caches
+     *    offsets. If this is false, it will not: the reason for this is that
+     *    it is only expected to be called many times if the includeXY property
+     *    is set to true. If you set this to true, you are expected to clear 
+     *    the offset cache manually (using this.clearMouseCache()) if:
+     *        the border of the element changes
+     *        the location of the element in the page changes
+    */
+    includeXY: false,      
+
+    /**
+     * Method: clearMouseListener
+     * A version of <clearMouseCache> that is bound to this instance so that
+     *     it can be used with <OpenLayers.Event.observe> and
+     *     <OpenLayers.Event.stopObserving>.
+     */
+    clearMouseListener: null,
+
+    /**
+     * Constructor: OpenLayers.Events
+     * Construct an OpenLayers.Events object.
+     *
+     * Parameters:
+     * object - {Object} The js object to which this Events object  is being
+     * added element - {DOMElement} A dom element to respond to browser events
+     * eventTypes - {Array(String)} Array of custom application events 
+     * fallThrough - {Boolean} Allow events to fall through after these have
+     *                         been handled?
+     * options - {Object} Options for the events object.
+     */
+    initialize: function (object, element, eventTypes, fallThrough, options) {
+        OpenLayers.Util.extend(this, options);
+        this.object     = object;
+        this.fallThrough = fallThrough;
+        this.listeners  = {};
+
+        // keep a bound copy of handleBrowserEvent() so that we can
+        // pass the same function to both Event.observe() and .stopObserving()
+        this.eventHandler = OpenLayers.Function.bindAsEventListener(
+            this.handleBrowserEvent, this
+        );
+        
+        // to be used with observe and stopObserving
+        this.clearMouseListener = OpenLayers.Function.bind(
+            this.clearMouseCache, this
+        );
+
+        // if eventTypes is specified, create a listeners list for each 
+        // custom application event.
+        this.eventTypes = [];
+        if (eventTypes != null) {
+            for (var i=0, len=eventTypes.length; i<len; i++) {
+                this.addEventType(eventTypes[i]);
+            }
+        }
+        
+        // if a dom element is specified, add a listeners list 
+        // for browser events on the element and register them
+        if (element != null) {
+            this.attachToElement(element);
+        }
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function () {
+        if (this.element) {
+            OpenLayers.Event.stopObservingElement(this.element);
+            if(this.element.hasScrollEvent) {
+                OpenLayers.Event.stopObserving(
+                    window, "scroll", this.clearMouseListener
+                );
+            }
+        }
+        this.element = null;
+
+        this.listeners = null;
+        this.object = null;
+        this.eventTypes = null;
+        this.fallThrough = null;
+        this.eventHandler = null;
+    },
+
+    /**
+     * APIMethod: addEventType
+     * Add a new event type to this events object.
+     * If the event type has already been added, do nothing.
+     * 
+     * Parameters:
+     * eventName - {String}
+     */
+    addEventType: function(eventName) {
+        if (!this.listeners[eventName]) {
+            this.eventTypes.push(eventName);
+            this.listeners[eventName] = [];
+        }
+    },
+
+    /**
+     * Method: attachToElement
+     *
+     * Parameters:
+     * element - {HTMLDOMElement} a DOM element to attach browser events to
+     */
+    attachToElement: function (element) {
+        if(this.element) {
+            OpenLayers.Event.stopObservingElement(this.element);
+        }
+        this.element = element;
+        for (var i=0, len=this.BROWSER_EVENTS.length; i<len; i++) {
+            var eventType = this.BROWSER_EVENTS[i];
+
+            // every browser event has a corresponding application event 
+            // (whether it's listened for or not).
+            this.addEventType(eventType);
+            
+            // use Prototype to register the event cross-browser
+            OpenLayers.Event.observe(element, eventType, this.eventHandler);
+        }
+        // disable dragstart in IE so that mousedown/move/up works normally
+        OpenLayers.Event.observe(element, "dragstart", OpenLayers.Event.stop);
+    },
+    
+    /**
+     * APIMethod: on
+     * Convenience method for registering listeners with a common scope.
+     *     Internally, this method calls <register> as shown in the examples
+     *     below.
+     *
+     * Example use:
+     * (code)
+     * // register a single listener for the "loadstart" event
+     * events.on({"loadstart", loadStartListener});
+     *
+     * // this is equivalent to the following
+     * events.register("loadstart", undefined, loadStartListener);
+     *
+     * // register multiple listeners to be called with the same `this` object
+     * events.on({
+     *     "loadstart": loadStartListener,
+     *     "loadend": loadEndListener,
+     *     scope: object
+     * });
+     *
+     * // this is equivalent to the following
+     * events.register("loadstart", object, loadStartListener);
+     * events.register("loadstart", object, loadEndListener);
+     * (end)
+     */
+    on: function(object) {
+        for(var type in object) {
+            if(type != "scope") {
+                this.register(type, object.scope, object[type]);
+            }
+        }
+    },
+
+    /**
+     * APIMethod: register
+     * Register an event on the events object.
+     *
+     * When the event is triggered, the 'func' function will be called, in the
+     * context of 'obj'. Imagine we were to register an event, specifying an 
+     * OpenLayers.Bounds Object as 'obj'. When the event is triggered, the 
+     * context in the callback function will be our Bounds object. This means
+     * that within our callback function, we can access the properties and 
+     * methods of the Bounds object through the "this" variable. So our 
+     * callback could execute something like: 
+     * :    leftStr = "Left: " + this.left;
+     *   
+     *                   or
+     *  
+     * :    centerStr = "Center: " + this.getCenterLonLat();
+     *
+     * Parameters:
+     * type - {String} Name of the event to register
+     * obj - {Object} The object to bind the context to for the callback#.
+     *                     If no object is specified, default is the Events's 
+     *                     'object' property.
+     * func - {Function} The callback function. If no callback is 
+     *                        specified, this function does nothing.
+     * 
+     * 
+     */
+    register: function (type, obj, func) {
+
+        if ( (func != null) && 
+             (OpenLayers.Util.indexOf(this.eventTypes, type) != -1) ) {
+
+            if (obj == null)  {
+                obj = this.object;
+            }
+            var listeners = this.listeners[type];
+            listeners.push( {obj: obj, func: func} );
+        }
+    },
+
+    /**
+     * APIMethod: registerPriority
+     * Same as register() but adds the new listener to the *front* of the
+     *     events queue instead of to the end.
+     *    
+     *     TODO: get rid of this in 3.0 - Decide whether listeners should be 
+     *     called in the order they were registered or in reverse order.
+     *
+     *
+     * Parameters:
+     * type - {String} Name of the event to register
+     * obj - {Object} The object to bind the context to for the callback#.
+     *                If no object is specified, default is the Events's 
+     *                'object' property.
+     * func - {Function} The callback function. If no callback is 
+     *                   specified, this function does nothing.
+     */
+    registerPriority: function (type, obj, func) {
+
+        if (func != null) {
+            if (obj == null)  {
+                obj = this.object;
+            }
+            var listeners = this.listeners[type];
+            if (listeners != null) {
+                listeners.unshift( {obj: obj, func: func} );
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: un
+     * Convenience method for unregistering listeners with a common scope.
+     *     Internally, this method calls <unregister> as shown in the examples
+     *     below.
+     *
+     * Example use:
+     * (code)
+     * // unregister a single listener for the "loadstart" event
+     * events.un({"loadstart", loadStartListener});
+     *
+     * // this is equivalent to the following
+     * events.unregister("loadstart", undefined, loadStartListener);
+     *
+     * // unregister multiple listeners with the same `this` object
+     * events.un({
+     *     "loadstart": loadStartListener,
+     *     "loadend": loadEndListener,
+     *     scope: object
+     * });
+     *
+     * // this is equivalent to the following
+     * events.unregister("loadstart", object, loadStartListener);
+     * events.unregister("loadstart", object, loadEndListener);
+     * (end)
+     */
+    un: function(object) {
+        for(var type in object) {
+            if(type != "scope") {
+                this.unregister(type, object.scope, object[type]);
+            }
+        }
+    },
+
+    /**
+     * APIMethod: unregister
+     *
+     * Parameters:
+     * type - {String} 
+     * obj - {Object} If none specified, defaults to this.object
+     * func - {Function} 
+     */
+    unregister: function (type, obj, func) {
+        if (obj == null)  {
+            obj = this.object;
+        }
+        var listeners = this.listeners[type];
+        if (listeners != null) {
+            for (var i=0, len=listeners.length; i<len; i++) {
+                if (listeners[i].obj == obj && listeners[i].func == func) {
+                    listeners.splice(i, 1);
+                    break;
+                }
+            }
+        }
+    },
+
+    /** 
+     * Method: remove
+     * Remove all listeners for a given event type. If type is not registered,
+     *     does nothing.
+     *
+     * Parameters:
+     * type - {String} 
+     */
+    remove: function(type) {
+        if (this.listeners[type] != null) {
+            this.listeners[type] = [];
+        }
+    },
+
+    /**
+     * APIMethod: triggerEvent
+     * Trigger a specified registered event.  
+     * 
+     * Parameters:
+     * type - {String} 
+     * evt - {Event}
+     *
+     * Returns:
+     * {Boolean} The last listener return.  If a listener returns false, the
+     *     chain of listeners will stop getting called.
+     */
+    triggerEvent: function (type, evt) {
+        var listeners = this.listeners[type];
+
+        // fast path
+        if(!listeners || listeners.length == 0) {
+            return;
+        }
+
+        // prep evt object with object & div references
+        if (evt == null) {
+            evt = {};
+        }
+        evt.object = this.object;
+        evt.element = this.element;
+        if(!evt.type) {
+            evt.type = type;
+        }
+    
+        // execute all callbacks registered for specified type
+        // get a clone of the listeners array to
+        // allow for splicing during callbacks
+        var listeners = listeners.slice(), continueChain;
+        for (var i=0, len=listeners.length; i<len; i++) {
+            var callback = listeners[i];
+            // bind the context to callback.obj
+            continueChain = callback.func.apply(callback.obj, [evt]);
+
+            if ((continueChain != undefined) && (continueChain == false)) {
+                // if callback returns false, execute no more callbacks.
+                break;
+            }
+        }
+        // don't fall through to other DOM elements
+        if (!this.fallThrough) {           
+            OpenLayers.Event.stop(evt, true);
+        }
+        return continueChain;
+    },
+
+    /**
+     * Method: handleBrowserEvent
+     * Basically just a wrapper to the triggerEvent() function, but takes 
+     *     care to set a property 'xy' on the event with the current mouse 
+     *     position.
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    handleBrowserEvent: function (evt) {
+        if (this.includeXY) {
+            evt.xy = this.getMousePosition(evt);
+        } 
+        this.triggerEvent(evt.type, evt);
+    },
+
+    /**
+     * APIMethod: clearMouseCache
+     * Clear cached data about the mouse position. This should be called any 
+     *     time the element that events are registered on changes position 
+     *     within the page.
+     */
+    clearMouseCache: function() { 
+        this.element.scrolls = null;
+        this.element.lefttop = null;
+        this.element.offsets = null;
+    },      
+
+    /**
+     * Method: getMousePosition
+     * 
+     * Parameters:
+     * evt - {Event} 
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} The current xy coordinate of the mouse, adjusted
+     *                      for offsets
+     */
+    getMousePosition: function (evt) {
+        if (!this.includeXY) {
+            this.clearMouseCache();
+        } else if (!this.element.hasScrollEvent) {
+            OpenLayers.Event.observe(window, "scroll", this.clearMouseListener);
+            this.element.hasScrollEvent = true;
+        }
+        
+        if (!this.element.scrolls) {
+            this.element.scrolls = [
+                (document.documentElement.scrollLeft
+                         || document.body.scrollLeft),
+                (document.documentElement.scrollTop
+                         || document.body.scrollTop)
+            ];
+        }
+
+        if (!this.element.lefttop) {
+            this.element.lefttop = [
+                (document.documentElement.clientLeft || 0),
+                (document.documentElement.clientTop  || 0)
+            ];
+        }
+        
+        if (!this.element.offsets) {
+            this.element.offsets = OpenLayers.Util.pagePosition(this.element);
+            this.element.offsets[0] += this.element.scrolls[0];
+            this.element.offsets[1] += this.element.scrolls[1];
+        }
+        return new OpenLayers.Pixel(
+            (evt.clientX + this.element.scrolls[0]) - this.element.offsets[0]
+                         - this.element.lefttop[0], 
+            (evt.clientY + this.element.scrolls[1]) - this.element.offsets[1]
+                         - this.element.lefttop[1]
+        ); 
+    },
+
+    CLASS_NAME: "OpenLayers.Events"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/OverviewMap.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/OverviewMap.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/OverviewMap.js	(revision 76)
@@ -0,0 +1,720 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/** 
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/BaseTypes.js
+ * @requires OpenLayers/Events.js
+ */
+
+/**
+ * Class: OpenLayers.Control.OverviewMap
+ * The OverMap control creates a small overview map, useful to display the 
+ * extent of a zoomed map and your main map and provide additional 
+ * navigation options to the User.  By default the overview map is drawn in
+ * the lower right corner of the main map. Create a new overview map with the
+ * <OpenLayers.Control.OverviewMap> constructor.
+ *
+ * Inerits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.OverviewMap = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: element
+     * {DOMElement} The DOM element that contains the overview map
+     */
+    element: null,
+    
+    /**
+     * APIProperty: ovmap
+     * {<OpenLayers.Map>} A reference to the overview map itself.
+     */
+    ovmap: null,
+
+    /**
+     * APIProperty: size
+     * {<OpenLayers.Size>} The overvew map size in pixels.  Note that this is
+     * the size of the map itself - the element that contains the map (default
+     * class name olControlOverviewMapElement) may have padding or other style
+     * attributes added via CSS.
+     */
+    size: new OpenLayers.Size(180, 90),
+
+    /**
+     * APIProperty: layers
+     * {Array(<OpenLayers.Layer>)} Ordered list of layers in the overview map.
+     * If none are sent at construction, the base layer for the main map is used.
+     */
+    layers: null,
+    
+    /**
+     * APIProperty: minRectSize
+     * {Integer} The minimum width or height (in pixels) of the extent
+     *     rectangle on the overview map.  When the extent rectangle reaches
+     *     this size, it will be replaced depending on the value of the
+     *     <minRectDisplayClass> property.  Default is 15 pixels.
+     */
+    minRectSize: 15,
+    
+    /**
+     * APIProperty: minRectDisplayClass
+     * {String} Replacement style class name for the extent rectangle when
+     *     <minRectSize> is reached.  This string will be suffixed on to the
+     *     displayClass.  Default is "RectReplacement".
+     *
+     * Example CSS declaration:
+     * (code)
+     * .olControlOverviewMapRectReplacement {
+     *     overflow: hidden;
+     *     cursor: move;
+     *     background-image: url("img/overview_replacement.gif");
+     *     background-repeat: no-repeat;
+     *     background-position: center;
+     * }
+     * (end)
+     */
+    minRectDisplayClass: "RectReplacement",
+
+    /**
+     * APIProperty: minRatio
+     * {Float} The ratio of the overview map resolution to the main map
+     *     resolution at which to zoom farther out on the overview map.
+     */
+    minRatio: 8,
+
+    /**
+     * APIProperty: maxRatio
+     * {Float} The ratio of the overview map resolution to the main map
+     *     resolution at which to zoom farther in on the overview map.
+     */
+    maxRatio: 32,
+    
+    /**
+     * APIProperty: mapOptions
+     * {Object} An object containing any non-default properties to be sent to
+     *     the overview map's map constructor.  These should include any
+     *     non-default options that the main map was constructed with.
+     */
+    mapOptions: null,
+
+    /**
+     * APIProperty: autoPan
+     * {Boolean} Always pan the overview map, so the extent marker remains in
+     *     the center.  Default is false.  If true, when you drag the extent
+     *     marker, the overview map will update itself so the marker returns
+     *     to the center.
+     */
+    autoPan: false,
+    
+    /**
+     * Property: handlers
+     * {Object}
+     */
+    handlers: null,
+
+    /**
+     * Property: resolutionFactor
+     * {Object}
+     */
+    resolutionFactor: 1,
+
+    /**
+     * APIProperty: maximized
+     * {Boolean} Start as maximized (visible). Defaults to false.
+     */
+    maximized: false,
+
+    /**
+     * Constructor: OpenLayers.Control.OverviewMap
+     * Create a new overview map
+     *
+     * Parameters:
+     * object - {Object} Properties of this object will be set on the overview
+     * map object.  Note, to set options on the map object contained in this
+     * control, set <mapOptions> as one of the options properties.
+     */
+    initialize: function(options) {
+        this.layers = [];
+        this.handlers = {};
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Deconstruct the control
+     */
+    destroy: function() {
+        if (!this.mapDiv) { // we've already been destroyed
+            return;
+        }
+        if (this.handlers.click) {
+            this.handlers.click.destroy();
+        }
+        if (this.handlers.drag) {
+            this.handlers.drag.destroy();
+        }
+
+        this.mapDiv.removeChild(this.extentRectangle);
+        this.extentRectangle = null;
+
+        if (this.rectEvents) {
+            this.rectEvents.destroy();
+            this.rectEvents = null;
+        }
+
+        if (this.ovmap) {
+            this.ovmap.destroy();
+            this.ovmap = null;
+        }
+        
+        this.element.removeChild(this.mapDiv);
+        this.mapDiv = null;
+
+        this.div.removeChild(this.element);
+        this.element = null;
+
+        if (this.maximizeDiv) {
+            OpenLayers.Event.stopObservingElement(this.maximizeDiv);
+            this.div.removeChild(this.maximizeDiv);
+            this.maximizeDiv = null;
+        }
+        
+        if (this.minimizeDiv) {
+            OpenLayers.Event.stopObservingElement(this.minimizeDiv);
+            this.div.removeChild(this.minimizeDiv);
+            this.minimizeDiv = null;
+        }
+
+        this.map.events.un({
+            "moveend": this.update,
+            "changebaselayer": this.baseLayerDraw,
+            scope: this
+        });
+
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);    
+    },
+
+    /**
+     * Method: draw
+     * Render the control in the browser.
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        if(!(this.layers.length > 0)) {
+            if (this.map.baseLayer) {
+                var layer = this.map.baseLayer.clone();
+                this.layers = [layer];
+            } else {
+                this.map.events.register("changebaselayer", this, this.baseLayerDraw);
+                return this.div;
+            }
+        }
+
+        // create overview map DOM elements
+        this.element = document.createElement('div');
+        this.element.className = this.displayClass + 'Element';
+        this.element.style.display = 'none';
+
+        this.mapDiv = document.createElement('div');
+        this.mapDiv.style.width = this.size.w + 'px';
+        this.mapDiv.style.height = this.size.h + 'px';
+        this.mapDiv.style.position = 'relative';
+        this.mapDiv.style.overflow = 'hidden';
+        this.mapDiv.id = OpenLayers.Util.createUniqueID('overviewMap');
+        
+        this.extentRectangle = document.createElement('div');
+        this.extentRectangle.style.position = 'absolute';
+        this.extentRectangle.style.zIndex = 1000;  //HACK
+        this.extentRectangle.className = this.displayClass+'ExtentRectangle';
+        this.mapDiv.appendChild(this.extentRectangle);
+
+        this.element.appendChild(this.mapDiv);  
+
+        this.div.appendChild(this.element);
+
+        // Optionally add min/max buttons if the control will go in the
+        // map viewport.
+        if(!this.outsideViewport) {
+            this.div.className += " " + this.displayClass + 'Container';
+            var imgLocation = OpenLayers.Util.getImagesLocation();
+            // maximize button div
+            var img = imgLocation + 'layer-switcher-maximize.png';
+            this.maximizeDiv = OpenLayers.Util.createAlphaImageDiv(
+                                        this.displayClass + 'MaximizeButton', 
+                                        null, 
+                                        new OpenLayers.Size(18,18), 
+                                        img, 
+                                        'absolute');
+            this.maximizeDiv.style.display = 'none';
+            this.maximizeDiv.className = this.displayClass + 'MaximizeButton';
+            OpenLayers.Event.observe(this.maximizeDiv, 'click', 
+                OpenLayers.Function.bindAsEventListener(this.maximizeControl,
+                                                        this)
+            );
+            this.div.appendChild(this.maximizeDiv);
+    
+            // minimize button div
+            var img = imgLocation + 'layer-switcher-minimize.png';
+            this.minimizeDiv = OpenLayers.Util.createAlphaImageDiv(
+                                        'OpenLayers_Control_minimizeDiv', 
+                                        null, 
+                                        new OpenLayers.Size(18,18), 
+                                        img, 
+                                        'absolute');
+            this.minimizeDiv.style.display = 'none';
+            this.minimizeDiv.className = this.displayClass + 'MinimizeButton';
+            OpenLayers.Event.observe(this.minimizeDiv, 'click', 
+                OpenLayers.Function.bindAsEventListener(this.minimizeControl,
+                                                        this)
+            );
+            this.div.appendChild(this.minimizeDiv);
+            
+            var eventsToStop = ['dblclick','mousedown'];
+            
+            for (var i=0, len=eventsToStop.length; i<len; i++) {
+
+                OpenLayers.Event.observe(this.maximizeDiv, 
+                                         eventsToStop[i], 
+                                         OpenLayers.Event.stop);
+
+                OpenLayers.Event.observe(this.minimizeDiv,
+                                         eventsToStop[i], 
+                                         OpenLayers.Event.stop);
+            }
+            
+            this.minimizeControl();
+        } else {
+            // show the overview map
+            this.element.style.display = '';
+        }
+        if(this.map.getExtent()) {
+            this.update();
+        }
+        
+        this.map.events.register('moveend', this, this.update);
+        
+        if (this.maximized) {
+            this.maximizeControl();
+        }
+        return this.div;
+    },
+    
+    /**
+     * Method: baseLayerDraw
+     * Draw the base layer - called if unable to complete in the initial draw
+     */
+    baseLayerDraw: function() {
+        this.draw();
+        this.map.events.unregister("changebaselayer", this, this.baseLayerDraw);
+    },
+
+    /**
+     * Method: rectDrag
+     * Handle extent rectangle drag
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} The pixel location of the drag.
+     */
+    rectDrag: function(px) {
+        var deltaX = this.handlers.drag.last.x - px.x;
+        var deltaY = this.handlers.drag.last.y - px.y;
+        if(deltaX != 0 || deltaY != 0) {
+            var rectTop = this.rectPxBounds.top;
+            var rectLeft = this.rectPxBounds.left;
+            var rectHeight = Math.abs(this.rectPxBounds.getHeight());
+            var rectWidth = this.rectPxBounds.getWidth();
+            // don't allow dragging off of parent element
+            var newTop = Math.max(0, (rectTop - deltaY));
+            newTop = Math.min(newTop,
+                              this.ovmap.size.h - this.hComp - rectHeight);
+            var newLeft = Math.max(0, (rectLeft - deltaX));
+            newLeft = Math.min(newLeft,
+                               this.ovmap.size.w - this.wComp - rectWidth);
+            this.setRectPxBounds(new OpenLayers.Bounds(newLeft,
+                                                       newTop + rectHeight,
+                                                       newLeft + rectWidth,
+                                                       newTop));
+        }
+    },
+    
+    /**
+     * Method: mapDivClick
+     * Handle browser events
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} evt
+     */
+    mapDivClick: function(evt) {
+        var pxCenter = this.rectPxBounds.getCenterPixel();
+        var deltaX = evt.xy.x - pxCenter.x;
+        var deltaY = evt.xy.y - pxCenter.y;
+        var top = this.rectPxBounds.top;
+        var left = this.rectPxBounds.left;
+        var height = Math.abs(this.rectPxBounds.getHeight());
+        var width = this.rectPxBounds.getWidth();
+        var newTop = Math.max(0, (top + deltaY));
+        newTop = Math.min(newTop, this.ovmap.size.h - height);
+        var newLeft = Math.max(0, (left + deltaX));
+        newLeft = Math.min(newLeft, this.ovmap.size.w - width);
+        this.setRectPxBounds(new OpenLayers.Bounds(newLeft,
+                                                   newTop + height,
+                                                   newLeft + width,
+                                                   newTop));
+        this.updateMapToRect();
+    },
+
+    /**
+     * Method: maximizeControl
+     * Unhide the control.  Called when the control is in the map viewport.
+     *
+     * Parameters:
+     * e - {<OpenLayers.Event>}
+     */
+    maximizeControl: function(e) {
+        this.element.style.display = '';
+        this.showToggle(false);
+        if (e != null) {
+            OpenLayers.Event.stop(e);                                            
+        }
+    },
+
+    /**
+     * Method: minimizeControl
+     * Hide all the contents of the control, shrink the size, 
+     * add the maximize icon
+     * 
+     * Parameters:
+     * e - {<OpenLayers.Event>}
+     */
+    minimizeControl: function(e) {
+        this.element.style.display = 'none';
+        this.showToggle(true);
+        if (e != null) {
+            OpenLayers.Event.stop(e);                                            
+        }
+    },
+
+    /**
+     * Method: showToggle
+     * Hide/Show the toggle depending on whether the control is minimized
+     *
+     * Parameters:
+     * minimize - {Boolean} 
+     */
+    showToggle: function(minimize) {
+        this.maximizeDiv.style.display = minimize ? '' : 'none';
+        this.minimizeDiv.style.display = minimize ? 'none' : '';
+    },
+
+    /**
+     * Method: update
+     * Update the overview map after layers move.
+     */
+    update: function() {
+        if(this.ovmap == null) {
+            this.createMap();
+        }
+        
+        if(this.autoPan || !this.isSuitableOverview()) {
+            this.updateOverview();
+        }
+        
+        // update extent rectangle
+        this.updateRectToMap();
+    },
+    
+    /**
+     * Method: isSuitableOverview
+     * Determines if the overview map is suitable given the extent and
+     * resolution of the main map.
+     */
+    isSuitableOverview: function() {
+        var mapExtent = this.map.getExtent();
+        var maxExtent = this.map.maxExtent;
+        var testExtent = new OpenLayers.Bounds(
+                                Math.max(mapExtent.left, maxExtent.left),
+                                Math.max(mapExtent.bottom, maxExtent.bottom),
+                                Math.min(mapExtent.right, maxExtent.right),
+                                Math.min(mapExtent.top, maxExtent.top));        
+
+        if (this.ovmap.getProjection() != this.map.getProjection()) {
+            testExtent = testExtent.transform(
+                this.map.getProjectionObject(),
+                this.ovmap.getProjectionObject() );
+        }
+
+        var resRatio = this.ovmap.getResolution() / this.map.getResolution();
+        return ((resRatio > this.minRatio) &&
+                (resRatio <= this.maxRatio) &&
+                (this.ovmap.getExtent().containsBounds(testExtent)));
+    },
+    
+    /**
+     * Method updateOverview
+     * Called by <update> if <isSuitableOverview> returns true
+     */
+    updateOverview: function() {
+        var mapRes = this.map.getResolution();
+        var targetRes = this.ovmap.getResolution();
+        var resRatio = targetRes / mapRes;
+        if(resRatio > this.maxRatio) {
+            // zoom in overview map
+            targetRes = this.minRatio * mapRes;            
+        } else if(resRatio <= this.minRatio) {
+            // zoom out overview map
+            targetRes = this.maxRatio * mapRes;
+        }
+        var center;
+        if (this.ovmap.getProjection() != this.map.getProjection()) {
+            center = this.map.center.clone();
+            center.transform(this.map.getProjectionObject(),
+                this.ovmap.getProjectionObject() );
+        } else {
+            center = this.map.center;
+        }
+        this.ovmap.setCenter(center, this.ovmap.getZoomForResolution(
+            targetRes * this.resolutionFactor));
+        this.updateRectToMap();
+    },
+    
+    /**
+     * Method: createMap
+     * Construct the map that this control contains
+     */
+    createMap: function() {
+        // create the overview map
+        var options = OpenLayers.Util.extend(
+                        {controls: [], maxResolution: 'auto', 
+                         fallThrough: false}, this.mapOptions);
+        this.ovmap = new OpenLayers.Map(this.mapDiv, options);
+        
+        // prevent ovmap from being destroyed when the page unloads, because
+        // the OverviewMap control has to do this (and does it).
+        OpenLayers.Event.stopObserving(window, 'unload', this.ovmap.unloadDestroy);
+        
+        this.ovmap.addLayers(this.layers);
+        this.ovmap.zoomToMaxExtent();
+        // check extent rectangle border width
+        this.wComp = parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
+                                               'border-left-width')) +
+                     parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
+                                               'border-right-width'));
+        this.wComp = (this.wComp) ? this.wComp : 2;
+        this.hComp = parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
+                                               'border-top-width')) +
+                     parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
+                                               'border-bottom-width'));
+        this.hComp = (this.hComp) ? this.hComp : 2;
+
+        this.handlers.drag = new OpenLayers.Handler.Drag(
+            this, {move: this.rectDrag, done: this.updateMapToRect},
+            {map: this.ovmap}
+        );
+        this.handlers.click = new OpenLayers.Handler.Click(
+            this, {
+                "click": this.mapDivClick
+            },{
+                "single": true, "double": false,
+                "stopSingle": true, "stopDouble": true,
+                "pixelTolerance": 1,
+                map: this.ovmap
+            }
+        );
+        this.handlers.click.activate();
+        
+        this.rectEvents = new OpenLayers.Events(this, this.extentRectangle,
+                                                null, true);
+        this.rectEvents.register("mouseover", this, function(e) {
+            if(!this.handlers.drag.active && !this.map.dragging) {
+                this.handlers.drag.activate();
+            }
+        });
+        this.rectEvents.register("mouseout", this, function(e) {
+            if(!this.handlers.drag.dragging) {
+                this.handlers.drag.deactivate();
+            }
+        });
+
+        if (this.ovmap.getProjection() != this.map.getProjection()) {
+            var sourceUnits = this.map.getProjectionObject().getUnits() ||
+                this.map.units || this.map.baseLayer.units;
+            var targetUnits = this.ovmap.getProjectionObject().getUnits() ||
+                this.ovmap.units || this.ovmap.baseLayer.units;
+            this.resolutionFactor = sourceUnits && targetUnits ?
+                OpenLayers.INCHES_PER_UNIT[sourceUnits] /
+                OpenLayers.INCHES_PER_UNIT[targetUnits] : 1;
+        }
+    },
+        
+    /**
+     * Method: updateRectToMap
+     * Updates the extent rectangle position and size to match the map extent
+     */
+    updateRectToMap: function() {
+        // If the projections differ we need to reproject
+        var bounds;
+        if (this.ovmap.getProjection() != this.map.getProjection()) {
+            bounds = this.map.getExtent().transform(
+                this.map.getProjectionObject(), 
+                this.ovmap.getProjectionObject() );
+        } else {
+            bounds = this.map.getExtent();
+        }
+        var pxBounds = this.getRectBoundsFromMapBounds(bounds);
+        if (pxBounds) {
+            this.setRectPxBounds(pxBounds);
+        }
+    },
+    
+    /**
+     * Method: updateMapToRect
+     * Updates the map extent to match the extent rectangle position and size
+     */
+    updateMapToRect: function() {
+        var lonLatBounds = this.getMapBoundsFromRectBounds(this.rectPxBounds);
+        if (this.ovmap.getProjection() != this.map.getProjection()) {
+            lonLatBounds = lonLatBounds.transform(
+                this.ovmap.getProjectionObject(),
+                this.map.getProjectionObject() );
+        }
+        this.map.panTo(lonLatBounds.getCenterLonLat());
+    },
+
+    /**
+     * Method: setRectPxBounds
+     * Set extent rectangle pixel bounds.
+     *
+     * Parameters:
+     * pxBounds - {<OpenLayers.Bounds>}
+     */
+    setRectPxBounds: function(pxBounds) {
+        var top = Math.max(pxBounds.top, 0);
+        var left = Math.max(pxBounds.left, 0);
+        var bottom = Math.min(pxBounds.top + Math.abs(pxBounds.getHeight()),
+                              this.ovmap.size.h - this.hComp);
+        var right = Math.min(pxBounds.left + pxBounds.getWidth(),
+                             this.ovmap.size.w - this.wComp);
+        var width = Math.max(right - left, 0);
+        var height = Math.max(bottom - top, 0);
+        if(width < this.minRectSize || height < this.minRectSize) {
+            this.extentRectangle.className = this.displayClass +
+                                             this.minRectDisplayClass;
+            var rLeft = left + (width / 2) - (this.minRectSize / 2);
+            var rTop = top + (height / 2) - (this.minRectSize / 2);
+            this.extentRectangle.style.top = Math.round(rTop) + 'px';
+            this.extentRectangle.style.left = Math.round(rLeft) + 'px';
+            this.extentRectangle.style.height = this.minRectSize + 'px';
+            this.extentRectangle.style.width = this.minRectSize + 'px';
+        } else {
+            this.extentRectangle.className = this.displayClass +
+                                             'ExtentRectangle';
+            this.extentRectangle.style.top = Math.round(top) + 'px';
+            this.extentRectangle.style.left = Math.round(left) + 'px';
+            this.extentRectangle.style.height = Math.round(height) + 'px';
+            this.extentRectangle.style.width = Math.round(width) + 'px';
+        }
+        this.rectPxBounds = new OpenLayers.Bounds(
+            Math.round(left), Math.round(bottom),
+            Math.round(right), Math.round(top)
+        );
+    },
+
+    /**
+     * Method: getRectBoundsFromMapBounds
+     * Get the rect bounds from the map bounds.
+     *
+     * Parameters:
+     * lonLatBounds - {<OpenLayers.Bounds>}
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>}A bounds which is the passed-in map lon/lat extent
+     * translated into pixel bounds for the overview map
+     */
+    getRectBoundsFromMapBounds: function(lonLatBounds) {
+        var leftBottomLonLat = new OpenLayers.LonLat(lonLatBounds.left,
+                                                     lonLatBounds.bottom);
+        var rightTopLonLat = new OpenLayers.LonLat(lonLatBounds.right,
+                                                   lonLatBounds.top);
+        var leftBottomPx = this.getOverviewPxFromLonLat(leftBottomLonLat);
+        var rightTopPx = this.getOverviewPxFromLonLat(rightTopLonLat);
+        var bounds = null;
+        if (leftBottomPx && rightTopPx) {
+            bounds = new OpenLayers.Bounds(leftBottomPx.x, leftBottomPx.y,
+                                           rightTopPx.x, rightTopPx.y);
+        }
+        return bounds;
+    },
+
+    /**
+     * Method: getMapBoundsFromRectBounds
+     * Get the map bounds from the rect bounds.
+     *
+     * Parameters:
+     * pxBounds - {<OpenLayers.Bounds>}
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} Bounds which is the passed-in overview rect bounds
+     * translated into lon/lat bounds for the overview map
+     */
+    getMapBoundsFromRectBounds: function(pxBounds) {
+        var leftBottomPx = new OpenLayers.Pixel(pxBounds.left,
+                                                pxBounds.bottom);
+        var rightTopPx = new OpenLayers.Pixel(pxBounds.right,
+                                              pxBounds.top);
+        var leftBottomLonLat = this.getLonLatFromOverviewPx(leftBottomPx);
+        var rightTopLonLat = this.getLonLatFromOverviewPx(rightTopPx);
+        return new OpenLayers.Bounds(leftBottomLonLat.lon, leftBottomLonLat.lat,
+                                     rightTopLonLat.lon, rightTopLonLat.lat);
+    },
+
+    /**
+     * Method: getLonLatFromOverviewPx
+     * Get a map location from a pixel location
+     *
+     * Parameters:
+     * overviewMapPx - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.LonLat>} Location which is the passed-in overview map
+     * OpenLayers.Pixel, translated into lon/lat by the overview map
+     */
+    getLonLatFromOverviewPx: function(overviewMapPx) {
+        var size = this.ovmap.size;
+        var res  = this.ovmap.getResolution();
+        var center = this.ovmap.getExtent().getCenterLonLat();
+    
+        var delta_x = overviewMapPx.x - (size.w / 2);
+        var delta_y = overviewMapPx.y - (size.h / 2);
+        
+        return new OpenLayers.LonLat(center.lon + delta_x * res ,
+                                     center.lat - delta_y * res); 
+    },
+
+    /**
+     * Method: getOverviewPxFromLonLat
+     * Get a pixel location from a map location
+     *
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} Location which is the passed-in OpenLayers.LonLat, 
+     * translated into overview map pixels
+     */
+    getOverviewPxFromLonLat: function(lonlat) {
+        var res  = this.ovmap.getResolution();
+        var extent = this.ovmap.getExtent();
+        var px = null;
+        if (extent) {
+            px = new OpenLayers.Pixel(
+                        Math.round(1/res * (lonlat.lon - extent.left)),
+                        Math.round(1/res * (extent.top - lonlat.lat)));
+        } 
+        return px;
+    },
+
+    CLASS_NAME: 'OpenLayers.Control.OverviewMap'
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomPanel.js	(revision 76)
@@ -0,0 +1,54 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/Panel.js
+ * @requires OpenLayers/Control/ZoomIn.js
+ * @requires OpenLayers/Control/ZoomOut.js
+ * @requires OpenLayers/Control/ZoomToMaxExtent.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ZoomPanel
+ * The ZoomPanel control is a compact collecton of 3 zoom controls: a 
+ * <OpenLayers.Control.ZoomIn>, a <OpenLayers.Control.ZoomToMaxExtent>, and a
+ * <OpenLayers.Control.ZoomOut>. By default it is drawn in the upper left 
+ * corner of the map.
+ *
+ * Note: 
+ * If you wish to use this class with the default images and you want 
+ *       it to look nice in ie6, you should add the following, conditionally
+ *       added css stylesheet to your HTML file:
+ * 
+ * (code)
+ * <!--[if lte IE 6]>
+ *   <link rel="stylesheet" href="../theme/default/ie6-style.css" type="text/css" />
+ * <![endif]-->
+ * (end)
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control.Panel>
+ */
+OpenLayers.Control.ZoomPanel = OpenLayers.Class(OpenLayers.Control.Panel, {
+
+    /**
+     * Constructor: OpenLayers.Control.ZoomPanel 
+     * Add the three zooming controls.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.Panel.prototype.initialize.apply(this, [options]);
+        this.addControls([
+            new OpenLayers.Control.ZoomIn(),
+            new OpenLayers.Control.ZoomToMaxExtent(),
+            new OpenLayers.Control.ZoomOut()
+        ]);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ZoomPanel"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/EditingToolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/EditingToolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/EditingToolbar.js	(revision 76)
@@ -0,0 +1,63 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/Panel.js
+ * @requires OpenLayers/Control/Navigation.js
+ * @requires OpenLayers/Control/DrawFeature.js
+ * @requires OpenLayers/Handler/Point.js
+ * @requires OpenLayers/Handler/Path.js
+ * @requires OpenLayers/Handler/Polygon.js
+ */
+
+/**
+ * Class: OpenLayers.Control.EditingToolbar 
+ * The EditingToolbar is a panel of 4 controls to draw polygons, lines, 
+ * points, or to navigate the map by panning. By default it appears in the 
+ * upper right corner of the map.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control.Panel>
+ */
+OpenLayers.Control.EditingToolbar = OpenLayers.Class(
+  OpenLayers.Control.Panel, {
+
+    /**
+     * Constructor: OpenLayers.Control.EditingToolbar
+     * Create an editing toolbar for a given layer. 
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} 
+     * options - {Object} 
+     */
+    initialize: function(layer, options) {
+        OpenLayers.Control.Panel.prototype.initialize.apply(this, [options]);
+        
+        this.addControls(
+          [ new OpenLayers.Control.Navigation() ]
+        );  
+        var controls = [
+          new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Point, {'displayClass': 'olControlDrawFeaturePoint'}),
+          new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Path, {'displayClass': 'olControlDrawFeaturePath'}),
+          new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Polygon, {'displayClass': 'olControlDrawFeaturePolygon'})
+        ];
+        this.addControls(controls);
+    },
+
+    /**
+     * Method: draw
+     * calls the default draw, and then activates mouse defaults.
+     *
+     * Returns:
+     * {DOMElement}
+     */
+    draw: function() {
+        var div = OpenLayers.Control.Panel.prototype.draw.apply(this, arguments);
+        this.activateControl(this.controls[0]);
+        return div;
+    },
+
+    CLASS_NAME: "OpenLayers.Control.EditingToolbar"
+});    
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavToolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavToolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavToolbar.js	(revision 76)
@@ -0,0 +1,55 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/Panel.js
+ * @requires OpenLayers/Control/Navigation.js
+ * @requires OpenLayers/Control/ZoomBox.js
+ */
+
+/**
+ * Class: OpenLayers.Control.NavToolbar
+ * This Toolbar is an alternative to the Navigation control that displays
+ *     the state of the control, and provides a UI for changing state to
+ *     use the zoomBox via a Panel control.
+ *
+ * If you wish to change the properties of the Navigation control used
+ *     in the NavToolbar, see: 
+ *     http://trac.openlayers.org/wiki/Toolbars#SubclassingNavToolbar 
+ * 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control.Panel>
+ */
+OpenLayers.Control.NavToolbar = OpenLayers.Class(OpenLayers.Control.Panel, {
+
+    /**
+     * Constructor: OpenLayers.Control.NavToolbar 
+     * Add our two mousedefaults controls.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.Panel.prototype.initialize.apply(this, [options]);
+        this.addControls([
+          new OpenLayers.Control.Navigation(),
+          new OpenLayers.Control.ZoomBox()
+        ]);
+    },
+
+    /**
+     * Method: draw 
+     * calls the default draw, and then activates mouse defaults.
+     */
+    draw: function() {
+        var div = OpenLayers.Control.Panel.prototype.draw.apply(this, arguments);
+        this.activateControl(this.controls[0]);
+        return div;
+    },
+
+    CLASS_NAME: "OpenLayers.Control.NavToolbar"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseToolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseToolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseToolbar.js	(revision 76)
@@ -0,0 +1,406 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/MouseDefaults.js
+ */
+
+/**
+ * Class: OpenLayers.Control.MouseToolbar
+ * This class is DEPRECATED in 2.4 and will be removed by 3.0.
+ * If you need this functionality, use <OpenLayers.Control.NavToolbar>
+ * instead!!! 
+ */
+OpenLayers.Control.MouseToolbar = OpenLayers.Class(
+                                            OpenLayers.Control.MouseDefaults, {
+    
+    /**
+     * Property: mode
+     */ 
+    mode: null,
+    /**
+     * Property: buttons
+     */
+    buttons: null,
+    
+    /**
+     * APIProperty: direction
+     * {String} 'vertical' or 'horizontal'
+     */
+    direction: "vertical",
+    
+    /**
+     * Property: buttonClicked
+     * {String}
+     */
+    buttonClicked: null,
+    
+    /**
+     * Constructor: OpenLayers.Control.MouseToolbar
+     *
+     * Parameters:
+     * position - {<OpenLayers.Pixel>}
+     * direction - {String}
+     */
+    initialize: function(position, direction) {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+        this.position = new OpenLayers.Pixel(OpenLayers.Control.MouseToolbar.X,
+                                             OpenLayers.Control.MouseToolbar.Y);
+        if (position) {
+            this.position = position;
+        }
+        if (direction) {
+            this.direction = direction; 
+        }
+        this.measureDivs = [];
+    },
+    
+    /**
+     * APIMethod: destroy 
+     */
+    destroy: function() {
+        for( var btnId in this.buttons) {
+            var btn = this.buttons[btnId];
+            btn.map = null;
+            btn.events.destroy();
+        }
+        OpenLayers.Control.MouseDefaults.prototype.destroy.apply(this, 
+                                                                 arguments);
+    },
+    
+    /**
+     * Method: draw
+     */
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments); 
+        OpenLayers.Control.MouseDefaults.prototype.draw.apply(this, arguments);
+        this.buttons = {};
+        var sz = new OpenLayers.Size(28,28);
+        var centered = new OpenLayers.Pixel(OpenLayers.Control.MouseToolbar.X,0);
+        this._addButton("zoombox", "drag-rectangle-off.png", "drag-rectangle-on.png", centered, sz, "Shift->Drag to zoom to area");
+        centered = centered.add((this.direction == "vertical" ? 0 : sz.w), (this.direction == "vertical" ? sz.h : 0));
+        this._addButton("pan", "panning-hand-off.png", "panning-hand-on.png", centered, sz, "Drag the map to pan.");
+        centered = centered.add((this.direction == "vertical" ? 0 : sz.w), (this.direction == "vertical" ? sz.h : 0));
+        this.switchModeTo("pan");
+
+        return this.div;
+    },
+    
+    /**
+     * Method: _addButton
+     */
+    _addButton:function(id, img, activeImg, xy, sz, title) {
+        var imgLocation = OpenLayers.Util.getImagesLocation() + img;
+        var activeImgLocation = OpenLayers.Util.getImagesLocation() + activeImg;
+        // var btn = new ol.AlphaImage("_"+id, imgLocation, xy, sz);
+        var btn = OpenLayers.Util.createAlphaImageDiv(
+                                    "OpenLayers_Control_MouseToolbar_" + id, 
+                                    xy, sz, imgLocation, "absolute");
+
+        //we want to add the outer div
+        this.div.appendChild(btn);
+        btn.imgLocation = imgLocation;
+        btn.activeImgLocation = activeImgLocation;
+        
+        btn.events = new OpenLayers.Events(this, btn, null, true);
+        btn.events.on({
+            "mousedown": this.buttonDown,
+            "mouseup": this.buttonUp,
+            "dblclick": OpenLayers.Event.stop,
+            scope: this
+        });
+        btn.action = id;
+        btn.title = title;
+        btn.alt = title;
+        btn.map = this.map;
+
+        //we want to remember/reference the outer div
+        this.buttons[id] = btn;
+        return btn;
+    },
+
+    /**
+     * Method: buttonDown
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    buttonDown: function(evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        this.buttonClicked = evt.element.action;
+        OpenLayers.Event.stop(evt);
+    },
+
+    /**
+     * Method: buttonUp
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    buttonUp: function(evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        if (this.buttonClicked != null) {
+            if (this.buttonClicked == evt.element.action) {
+                this.switchModeTo(evt.element.action);
+            }
+            OpenLayers.Event.stop(evt);
+            this.buttonClicked = null;
+        }
+    },
+    
+    /**
+     * Method: defaultDblClick 
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultDblClick: function (evt) {
+        this.switchModeTo("pan");
+        this.performedDrag = false;
+        var newCenter = this.map.getLonLatFromViewPortPx( evt.xy ); 
+        this.map.setCenter(newCenter, this.map.zoom + 1);
+        OpenLayers.Event.stop(evt);
+        return false;
+    },
+
+    /**
+     * Method: defaultMouseDown
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseDown: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        this.mouseDragStart = evt.xy.clone();
+        this.performedDrag = false;
+        this.startViaKeyboard = false;
+        if (evt.shiftKey && this.mode !="zoombox") {
+            this.switchModeTo("zoombox");
+            this.startViaKeyboard = true;
+        } else if (evt.altKey && this.mode !="measure") {
+            this.switchModeTo("measure");
+        } else if (!this.mode) {
+            this.switchModeTo("pan");
+        }
+        
+        switch (this.mode) {
+            case "zoombox":
+                this.map.div.style.cursor = "crosshair";
+                this.zoomBox = OpenLayers.Util.createDiv('zoomBox',
+                                                         this.mouseDragStart,
+                                                         null,
+                                                         null,
+                                                         "absolute",
+                                                         "2px solid red");
+                this.zoomBox.style.backgroundColor = "white";
+                this.zoomBox.style.filter = "alpha(opacity=50)"; // IE
+                this.zoomBox.style.opacity = "0.50";
+                this.zoomBox.style.fontSize = "1px";
+                this.zoomBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+                this.map.viewPortDiv.appendChild(this.zoomBox);
+                this.performedDrag = true;
+                break;
+            case "measure":
+                var distance = "";
+                if (this.measureStart) {
+                    var measureEnd = this.map.getLonLatFromViewPortPx(this.mouseDragStart);
+                    distance = OpenLayers.Util.distVincenty(this.measureStart, measureEnd);
+                    distance = Math.round(distance * 100) / 100;
+                    distance = distance + "km";
+                    this.measureStartBox = this.measureBox;
+                }    
+                this.measureStart = this.map.getLonLatFromViewPortPx(this.mouseDragStart);;
+                this.measureBox = OpenLayers.Util.createDiv(null,
+                                                         this.mouseDragStart.add(
+                                                           -2-parseInt(this.map.layerContainerDiv.style.left),
+                                                           -2-parseInt(this.map.layerContainerDiv.style.top)),
+                                                         null,
+                                                         null,
+                                                         "absolute");
+                this.measureBox.style.width="4px";
+                this.measureBox.style.height="4px";
+                this.measureBox.style.fontSize = "1px";
+                this.measureBox.style.backgroundColor="red";
+                this.measureBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+                this.map.layerContainerDiv.appendChild(this.measureBox);
+                if (distance) {
+                    this.measureBoxDistance = OpenLayers.Util.createDiv(null,
+                                                         this.mouseDragStart.add(
+                                                           -2-parseInt(this.map.layerContainerDiv.style.left),
+                                                           2-parseInt(this.map.layerContainerDiv.style.top)),
+                                                         null,
+                                                         null,
+                                                         "absolute");
+                    
+                    this.measureBoxDistance.innerHTML = distance;
+                    this.measureBoxDistance.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+                    this.map.layerContainerDiv.appendChild(this.measureBoxDistance);
+                    this.measureDivs.push(this.measureBoxDistance);
+                }
+                this.measureBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+                this.map.layerContainerDiv.appendChild(this.measureBox);
+                this.measureDivs.push(this.measureBox);
+                break;
+            default:
+                this.map.div.style.cursor = "move";
+                break;
+        }
+        document.onselectstart = OpenLayers.Function.False;
+        OpenLayers.Event.stop(evt);
+    },
+
+    /**
+     * Method: switchModeTo 
+     *
+     * Parameters:
+     * mode - {String} 
+     */
+    switchModeTo: function(mode) {
+        if (mode != this.mode) {
+            
+
+            if (this.mode && this.buttons[this.mode]) {
+                OpenLayers.Util.modifyAlphaImageDiv(this.buttons[this.mode], null, null, null, this.buttons[this.mode].imgLocation);
+            }
+            if (this.mode == "measure" && mode != "measure") {
+                for(var i=0, len=this.measureDivs.length; i<len; i++) {
+                    if (this.measureDivs[i]) { 
+                        this.map.layerContainerDiv.removeChild(this.measureDivs[i]);
+                    }
+                }
+                this.measureDivs = [];
+                this.measureStart = null;
+            }
+            this.mode = mode;
+            if (this.buttons[mode]) {
+                OpenLayers.Util.modifyAlphaImageDiv(this.buttons[mode], null, null, null, this.buttons[mode].activeImgLocation);
+            }
+            switch (this.mode) {
+                case "zoombox":
+                    this.map.div.style.cursor = "crosshair";
+                    break;
+                default:
+                    this.map.div.style.cursor = "";
+                    break;
+            }
+
+        } 
+    }, 
+
+    /**
+     * Method: leaveMode
+     */
+    leaveMode: function() {
+        this.switchModeTo("pan");
+    },
+    
+    /**
+     * Method: defaultMouseMove
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseMove: function (evt) {
+        if (this.mouseDragStart != null) {
+            switch (this.mode) {
+                case "zoombox": 
+                    var deltaX = Math.abs(this.mouseDragStart.x - evt.xy.x);
+                    var deltaY = Math.abs(this.mouseDragStart.y - evt.xy.y);
+                    this.zoomBox.style.width = Math.max(1, deltaX) + "px";
+                    this.zoomBox.style.height = Math.max(1, deltaY) + "px";
+                    if (evt.xy.x < this.mouseDragStart.x) {
+                        this.zoomBox.style.left = evt.xy.x+"px";
+                    }
+                    if (evt.xy.y < this.mouseDragStart.y) {
+                        this.zoomBox.style.top = evt.xy.y+"px";
+                    }
+                    break;
+                default:
+                    var deltaX = this.mouseDragStart.x - evt.xy.x;
+                    var deltaY = this.mouseDragStart.y - evt.xy.y;
+                    var size = this.map.getSize();
+                    var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX,
+                                                     size.h / 2 + deltaY);
+                    var newCenter = this.map.getLonLatFromViewPortPx( newXY ); 
+                    this.map.setCenter(newCenter, null, true);
+                    this.mouseDragStart = evt.xy.clone();
+            }
+            this.performedDrag = true;
+        }
+    },
+
+    /**
+     * Method: defaultMouseUp
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseUp: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        switch (this.mode) {
+            case "zoombox":
+                this.zoomBoxEnd(evt);
+                if (this.startViaKeyboard) {
+                    this.leaveMode();
+                }
+                break;
+            case "pan":
+                if (this.performedDrag) {
+                    this.map.setCenter(this.map.center);
+                }        
+        }
+        document.onselectstart = null;
+        this.mouseDragStart = null;
+        this.map.div.style.cursor = "default";
+    },
+
+    /**
+     * Method: defaultMouseOut
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseOut: function (evt) {
+        if (this.mouseDragStart != null
+            && OpenLayers.Util.mouseLeft(evt, this.map.div)) {
+            if (this.zoomBox) {
+                this.removeZoomBox();
+                if (this.startViaKeyboard) {
+                    this.leaveMode();
+                }
+            }
+            this.mouseDragStart = null;
+            this.map.div.style.cursor = "default";
+        }
+    },
+
+    /**
+     * Method: defaultClick
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultClick: function (evt) {
+        if (this.performedDrag)  {
+            this.performedDrag = false;
+            return false;
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.MouseToolbar"
+});
+
+OpenLayers.Control.MouseToolbar.X = 6;
+OpenLayers.Control.MouseToolbar.Y = 300;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragPan.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragPan.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragPan.js	(revision 76)
@@ -0,0 +1,94 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Drag.js
+ */
+
+/**
+ * Class: OpenLayers.Control.DragPan
+ * The DragPan control pans the map with a drag of the mouse.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
+
+    /** 
+     * Property: type
+     * {OpenLayers.Control.TYPES}
+     */
+    type: OpenLayers.Control.TYPE_TOOL,
+    
+    /**
+     * Property: panned
+     * {Boolean} The map moved.
+     */
+    panned: false,
+    
+    /**
+     * Property: interval
+     * {Integer} The number of milliseconds that should ellapse before
+     *     panning the map again. Set this to increase dragging performance.
+     *     Defaults to 25 milliseconds.
+     */
+    interval: 25,
+    
+    /**
+     * APIProperty: documentDrag
+     * {Boolean} If set to true, mouse dragging will continue even if the
+     *     mouse cursor leaves the map viewport. Default is false.
+     */
+    documentDrag: false,
+    
+    /**
+     * Method: draw
+     * Creates a Drag handler, using <panMap> and
+     * <panMapDone> as callbacks.
+     */    
+    draw: function() {
+        this.handler = new OpenLayers.Handler.Drag(this, {
+                "move": this.panMap,
+                "done": this.panMapDone
+            }, {
+                interval: this.interval,
+                documentDrag: this.documentDrag
+            }
+        );
+    },
+
+    /**
+    * Method: panMap
+    *
+    * Parameters:
+    * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
+    */
+    panMap: function(xy) {
+        this.panned = true;
+        this.map.pan(
+            this.handler.last.x - xy.x,
+            this.handler.last.y - xy.y,
+            {dragging: this.handler.dragging, animate: false}
+        );
+    },
+    
+    /**
+     * Method: panMapDone
+     * Finish the panning operation.  Only call setCenter (through <panMap>)
+     *     if the map has actually been moved.
+     *
+     * Parameters:
+     * xy - {<OpenLayers.Pixel>} Pixel of the mouse position
+     */
+    panMapDone: function(xy) {
+        if(this.panned) {
+            this.panMap(xy);
+            this.panned = false;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.DragPan"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Snapping.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Snapping.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Snapping.js	(revision 76)
@@ -0,0 +1,547 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Layer/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Snapping
+ * Acts as a snapping agent while editing vector features.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Snapping = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * control.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * Supported control event types (in addition to those from <OpenLayers.Control>):
+     * beforesnap - Triggered before a snap occurs.  Listeners receive an
+     *     event object with *point*, *x*, *y*, *distance*, *layer*, and
+     *     *snapType* properties.  The point property will be original point
+     *     geometry considered for snapping. The x and y properties represent
+     *     coordinates the point will receive. The distance is the distance
+     *     of the snap.  The layer is the target layer.  The snapType property
+     *     will be one of "node", "vertex", or "edge". Return false to stop
+     *     snapping from occurring.
+     * snap - Triggered when a snap occurs.  Listeners receive an event with
+     *     *point*, *snapType*, *layer*, and *distance* properties.  The point
+     *     will be the location snapped to.  The snapType will be one of "node",
+     *     "vertex", or "edge".  The layer will be the target layer.  The
+     *     distance will be the distance of the snap in map units.
+     * unsnap - Triggered when a vertex is unsnapped.  Listeners receive an
+     *     event with a *point* property.
+     */
+    EVENT_TYPES: ["beforesnap", "snap", "unsnap"],
+    
+    /**
+     * CONSTANT: DEFAULTS
+     * Default target properties.
+     */
+    DEFAULTS: {
+        tolerance: 10,
+        node: true,
+        edge: true,
+        vertex: true
+    },
+    
+    /**
+     * Property: greedy
+     * {Boolean} Snap to closest feature in first layer with an eligible
+     *     feature.  Default is true.
+     */
+    greedy: true,
+    
+    /**
+     * Property: precedence
+     * {Array} List representing precedence of different snapping types.
+     *     Default is "node", "vertex", "edge".
+     */
+    precedence: ["node", "vertex", "edge"],
+    
+    /**
+     * Property: resolution
+     * {Float} The map resolution for the previously considered snap.
+     */
+    resolution: null,
+    
+    /**
+     * Property: geoToleranceCache
+     * {Object} A cache of geo-tolerances.  Tolerance values (in map units) are
+     *     calculated when the map resolution changes.
+     */
+    geoToleranceCache: null,
+    
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>} The current editable layer.  Set at
+     *     construction or after construction with <setLayer>.
+     */
+    layer: null,
+    
+    /**
+     * Property: feature
+     * {<OpenLayers.Feature.Vector>} The current editable feature.
+     */
+    feature: null,
+    
+    /**
+     * Property: point
+     * {<OpenLayers.Geometry.Point>} The currently snapped vertex.
+     */
+    point: null,
+
+    /**
+     * Constructor: OpenLayers.Control.Snapping
+     * Creates a new snapping control. A control is constructed with an editable
+     *     layer and a set of configuration objects for target layers. While the
+     *     control is active, dragging vertices while drawing new features or
+     *     modifying existing features on the editable layer will engage
+     *     snapping to features on the target layers. Whether a vertex snaps to
+     *     a feature on a target layer depends on the target layer configuration.
+     *
+     * Parameters:
+     * options - {Object} An object containing all configuration properties for
+     *     the control.
+     *
+     * Valid options:
+     * layer - {OpenLayers.Layer.Vector} The editable layer.  Features from this
+     *     layer that are digitized or modified may have vertices snapped to
+     *     features from any of the target layers.
+     * targets - {Array(Object | OpenLayers.Layer.Vector)} A list of objects for
+     *     configuring target layers.  See valid properties of the target
+     *     objects below.  If the items in the targets list are vector layers
+     *     (instead of configuration objects), the defaults from the <defaults>
+     *     property will apply.  The editable layer itself may be a target
+     *     layer - allowing newly created or edited features to be snapped to
+     *     existing features from the same layer.  If no targets are provided
+     *     the layer given in the constructor (as <layer>) will become the
+     *     initial target.
+     * defaults - {Object} An object with default properties to be applied
+     *     to all target objects.
+     * greedy - {Boolean} Snap to closest feature in first target layer that
+     *     applies.  Default is true.  If false, all features in all target
+     *     layers will be checked and the closest feature in all target layers
+     *     will be chosen.  The greedy property determines if the order of the
+     *     target layers is significant.  By default, the order of the target
+     *     layers is significant where layers earlier in the target layer list
+     *     have precedence over layers later in the list.  Within a single
+     *     layer, the closest feature is always chosen for snapping.  This
+     *     property only determines whether the search for a closer feature
+     *     continues after an eligible feature is found in a target layer.
+     *
+     * Valid target properties:
+     * layer - {OpenLayers.Layer.Vector} A target layer.  Features from this
+     *     layer will be eligible to act as snapping target for the editable
+     *     layer.
+     * tolerance - {Float} The distance (in pixels) at which snapping may occur.
+     *     Default is 10.
+     * node - {Boolean} Snap to nodes (first or last point in a geometry) in
+     *     target layer.  Default is true.
+     * nodeTolerance - {Float} Optional distance at which snapping may occur
+     *     for nodes specifically.  If none is provided, <tolerance> will be
+     *     used.
+     * vertex - {Boolean} Snap to vertices in target layer.  Default is true.
+     * vertexTolerance - {Float} Optional distance at which snapping may occur
+     *     for vertices specifically.  If none is provided, <tolerance> will be
+     *     used.
+     * edge - {Boolean} Snap to edges in target layer.  Default is true.
+     * edgeTolerance - {Float} Optional distance at which snapping may occur
+     *     for edges specifically.  If none is provided, <tolerance> will be
+     *     used.
+     * filter - {OpenLayers.Filter} Optional filter to evaluate to determine if
+     *     feature is eligible for snapping.  If filter evaluates to true for a
+     *     target feature a vertex may be snapped to the feature. 
+     */
+    initialize: function(options) {
+        // concatenate events specific to measure with those from the base
+        Array.prototype.push.apply(
+            this.EVENT_TYPES, OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.options = options || {}; // TODO: this could be done by the super
+        
+        // set the editable layer if provided
+        if(this.options.layer) {
+            this.setLayer(this.options.layer);
+        }
+        // configure target layers
+        var defaults = OpenLayers.Util.extend({}, this.options.defaults);
+        this.defaults = OpenLayers.Util.applyDefaults(defaults, this.DEFAULTS);
+        this.setTargets(this.options.targets);
+        if(this.targets.length === 0 && this.layer) {
+            this.addTargetLayer(this.layer);
+        }
+
+        this.geoToleranceCache = {};
+    },
+    
+    /**
+     * APIMethod: setLayer
+     * Set the editable layer.  Call the setLayer method if the editable layer
+     *     changes and the same control should be used on a new editable layer.
+     *     If the control is already active, it will be active after the new
+     *     layer is set.
+     *
+     * Parameters:
+     * layer - {OpenLayers.Layer.Vector}  The new editable layer.
+     */
+    setLayer: function(layer) {
+        if(this.active) {
+            this.deactivate();
+            this.layer = layer;
+            this.activate();
+        } else {
+            this.layer = layer;
+        }
+    },
+    
+    /**
+     * Method: setTargets
+     * Set the targets for the snapping agent.
+     *
+     * Parameters:
+     * targets - {Array} An array of target configs or target layers.
+     */
+    setTargets: function(targets) {
+        this.targets = [];
+        if(targets && targets.length) {
+            var target;
+            for(var i=0, len=targets.length; i<len; ++i) {
+                target = targets[i];
+                if(target instanceof OpenLayers.Layer.Vector) {
+                    this.addTargetLayer(target);
+                } else {
+                    this.addTarget(target);
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: addTargetLayer
+     * Add a target layer with the default target config.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} A target layer.
+     */
+    addTargetLayer: function(layer) {
+        this.addTarget({layer: layer});
+    },
+    
+    /**
+     * Method: addTarget
+     * Add a configured target layer.
+     *
+     * Parameters:
+     * target - {Object} A target config.
+     */
+    addTarget: function(target) {
+        target = OpenLayers.Util.applyDefaults(target, this.defaults);
+        target.nodeTolerance = target.nodeTolerance || target.tolerance;
+        target.vertexTolerance = target.vertexTolerance || target.tolerance;
+        target.edgeTolerance = target.edgeTolerance || target.tolerance;
+        this.targets.push(target);
+    },
+    
+    /**
+     * Method: removeTargetLayer
+     * Remove a target layer.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} The target layer to remove.
+     */
+    removeTargetLayer: function(layer) {
+        var target;
+        for(var i=this.targets.length-1; i>=0; --i) {
+            target = this.targets[i];
+            if(target.layer === layer) {
+                this.removeTarget(target);
+            }
+        }
+    },
+    
+    /**
+     * Method: removeTarget
+     * Remove a target.
+     *
+     * Parameters:
+     * target - {Object} A target config.
+     *
+     * Returns:
+     * {Array} The targets array.
+     */
+    removeTarget: function(target) {
+        return OpenLayers.Util.removeItem(this.targets, target);
+    },
+    
+    /**
+     * APIMethod: activate
+     * Activate the control.  Activating the control registers listeners for
+     *     editing related events so that during feature creation and
+     *     modification, moving vertices will trigger snapping.
+     */
+    activate: function() {
+        var activated = OpenLayers.Control.prototype.activate.call(this);
+        if(activated) {
+            if(this.layer && this.layer.events) {
+                this.layer.events.on({
+                    sketchstarted: this.onSketchModified,
+                    sketchmodified: this.onSketchModified,
+                    vertexmodified: this.onVertexModified,
+                    scope: this
+                });
+            }
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control.  Deactivating the control unregisters listeners
+     *     so feature editing may proceed without engaging the snapping agent.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Control.prototype.deactivate.call(this);
+        if(deactivated) {
+            if(this.layer && this.layer.events) {
+                this.layer.events.un({
+                    sketchstarted: this.onSketchModified,
+                    sketchmodified: this.onSketchModified,
+                    vertexmodified: this.onVertexModified,
+                    scope: this
+                });
+            }
+        }
+        this.feature = null;
+        this.point = null;
+        return deactivated;
+    },
+    
+    /**
+     * Method: onSketchModified
+     * Registered as a listener for the sketchmodified event on the editable
+     *     layer.
+     *
+     * Parameters:
+     * event - {Object} The sketch modified event.
+     */
+    onSketchModified: function(event) {
+        this.feature = event.feature;
+        this.considerSnapping(event.vertex, event.vertex);
+    },
+    
+    /**
+     * Method: onVertexModified
+     * Registered as a listener for the vertexmodified event on the editable
+     *     layer.
+     *
+     * Parameters:
+     * event - {Object} The vertex modified event.
+     */
+    onVertexModified: function(event) {
+        this.feature = event.feature;
+        var loc = this.layer.map.getLonLatFromViewPortPx(event.pixel);
+        this.considerSnapping(
+            event.vertex, new OpenLayers.Geometry.Point(loc.lon, loc.lat)
+        );
+    },
+
+    /**
+     * Method: considerSnapping
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point}} The vertex to be snapped (or
+     *     unsnapped).
+     * loc - {<OpenLayers.Geometry.Point>} The location of the mouse in map
+     *     coords.
+     */
+    considerSnapping: function(point, loc) {
+        var best = {
+            rank: Number.POSITIVE_INFINITY,
+            dist: Number.POSITIVE_INFINITY,
+            x: null, y: null
+        };
+        var snapped = false;
+        var result, target;
+        for(var i=0, len=this.targets.length; i<len; ++i) {
+            target = this.targets[i];
+            result = this.testTarget(target, loc);
+            if(result) {
+                if(this.greedy) {
+                    best = result;
+                    best.target = target; 
+                    snapped = true;
+                    break;
+                } else {
+                    if((result.rank < best.rank) ||
+                       (result.rank === best.rank && result.dist < best.dist)) {
+                        best = result;
+                        best.target = target;
+                        snapped = true;
+                    }
+                }
+            }
+        }
+        if(snapped) {
+            var proceed = this.events.triggerEvent("beforesnap", {
+                point: point, x: best.x, y: best.y, distance: best.dist,
+                layer: best.target.layer, snapType: this.precedence[best.rank]
+            });
+            if(proceed !== false) {
+                point.x = best.x;
+                point.y = best.y;
+                this.point = point;
+                this.events.triggerEvent("snap", {
+                    point: point,
+                    snapType: this.precedence[best.rank],
+                    layer: best.target.layer,
+                    distance: best.dist
+                });
+            } else {
+                snapped = false;
+            }
+        }
+        if(this.point && !snapped) {
+            point.x = loc.x;
+            point.y = loc.y;
+            this.point = null;
+            this.events.triggerEvent("unsnap", {point: point});
+        }
+    },
+    
+    /**
+     * Method: testTarget
+     *
+     * Parameters:
+     * target - {Object} Object with target layer configuration.
+     * loc - {<OpenLayers.Geometry.Point>} The location of the mouse in map
+     *     coords.
+     *
+     * Returns:
+     * {Object} A result object with rank, dist, x, and y properties.
+     *     Returns null if candidate is not eligible for snapping.
+     */
+    testTarget: function(target, loc) {
+        var tolerance = {
+            node: this.getGeoTolerance(target.nodeTolerance),
+            vertex: this.getGeoTolerance(target.vertexTolerance),
+            edge: this.getGeoTolerance(target.edgeTolerance)
+        };
+        // this could be cached if we don't support setting tolerance values directly
+        var maxTolerance = Math.max(
+            tolerance.node, tolerance.vertex, tolerance.edge
+        );
+        var result = {
+            rank: Number.POSITIVE_INFINITY, dist: Number.POSITIVE_INFINITY
+        };
+        var eligible = false;
+        var features = target.layer.features;
+        var feature, type, vertices, vertex, closest, dist, found;
+        var numTypes = this.precedence.length;
+        var ll = new OpenLayers.LonLat(loc.x, loc.y);
+        for(var i=0, len=features.length; i<len; ++i) {
+            feature = features[i];
+            if(feature !== this.feature && !feature._sketch &&
+               feature.state !== OpenLayers.State.DELETE &&
+               (!target.filter || target.filter.evaluate(feature.attributes))) {
+                if(feature.atPoint(ll, maxTolerance, maxTolerance)) {
+                    for(var j=0, stop=Math.min(result.rank+1, numTypes); j<stop; ++j) {
+                        type = this.precedence[j];
+                        if(target[type]) {
+                            if(type === "edge") {
+                                closest = feature.geometry.distanceTo(loc, {details: true});
+                                dist = closest.distance;
+                                if(dist <= tolerance[type] && dist < result.dist) {
+                                    result = {
+                                        rank: j, dist: dist,
+                                        x: closest.x0, y: closest.y0 // closest coords on feature
+                                    };
+                                    eligible = true;
+                                    // don't look for lower precedence types for this feature
+                                    break;
+                                }
+                            } else {
+                                // look for nodes or vertices
+                                vertices = feature.geometry.getVertices(type === "node");
+                                found = false;
+                                for(var k=0, klen=vertices.length; k<klen; ++k) {
+                                    vertex = vertices[k];
+                                    dist = vertex.distanceTo(loc);
+                                    if(dist <= tolerance[type] &&
+                                       (j < result.rank || (j === result.rank && dist < result.dist))) {
+                                        result = {
+                                            rank: j, dist: dist,
+                                            x: vertex.x, y: vertex.y
+                                        };
+                                        eligible = true;
+                                        found = true;
+                                    }
+                                }
+                                if(found) {
+                                    // don't look for lower precedence types for this feature
+                                    break;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        return eligible ? result : null;
+    },
+    
+    /**
+     * Method: getGeoTolerance
+     * Calculate a tolerance in map units given a tolerance in pixels.  This
+     *     takes advantage of the <geoToleranceCache> when the map resolution
+     *     has not changed.
+     *     
+     * Parameters:
+     * tolerance - {Number} A tolerance value in pixels.
+     *
+     * Returns:
+     * {Number} A tolerance value in map units.
+     */
+    getGeoTolerance: function(tolerance) {
+        var resolution = this.layer.map.getResolution();
+        if(resolution !== this.resolution) {
+            this.resolution = resolution;
+            this.geoToleranceCache = {};
+        }
+        var geoTolerance = this.geoToleranceCache[tolerance];
+        if(geoTolerance === undefined) {
+            geoTolerance = tolerance * resolution;
+            this.geoToleranceCache[tolerance] = geoTolerance;
+        }
+        return geoTolerance;
+    },
+    
+    /**
+     * Method: destroy
+     * Clean up the control.
+     */
+    destroy: function() {
+        if(this.active) {
+            this.deactivate(); // TODO: this should be handled by the super
+        }
+        delete this.layer;
+        delete this.targets;
+        OpenLayers.Control.prototype.destroy.call(this);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Snapping"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Graticule.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Graticule.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Graticule.js	(revision 76)
@@ -0,0 +1,373 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Graticule
+ * The Graticule displays a grid of latitude/longitude lines reprojected on
+ * the map.  
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ *  
+ */
+OpenLayers.Control.Graticule = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map. Default is
+     *     true. 
+     */
+    autoActivate: true,
+    
+    /**
+    * APIProperty: intervals
+    * {Array(Float)} A list of possible graticule widths in degrees.
+    */
+    intervals: [ 45, 30, 20, 10, 5, 2, 1,
+                 0.5, 0.2, 0.1, 0.05, 0.01, 
+                 0.005, 0.002, 0.001 ],
+
+    /**
+     * APIProperty: displayInLayerSwitcher
+     * {Boolean} Allows the Graticule control to be switched on and off by 
+     *     LayerSwitcher control. Defaults is true.
+     */
+    displayInLayerSwitcher: true,
+
+    /**
+     * APIProperty: visible
+     * {Boolean} should the graticule be initially visible (default=true)
+     */
+    visible: true,
+
+    /**
+     * APIProperty: numPoints
+     * {Integer} The number of points to use in each graticule line.  Higher
+     * numbers result in a smoother curve for projected maps 
+     */
+    numPoints: 50,
+
+    /**
+     * APIProperty: targetSize
+     * {Integer} The maximum size of the grid in pixels on the map
+     */
+    targetSize: 200,
+
+    /**
+     * APIProperty: layerName
+     * {String} The name to be displayed in the layer switcher, default is set 
+     *     by {<OpenLayers.Lang>}.
+     */
+    layerName: null,
+
+    /**
+     * APIProperty: labelled
+     * {Boolean} Should the graticule lines be labelled?. default=true
+     */
+    labelled: true,
+
+    /**
+     * APIProperty: labelFormat
+     * {String} the format of the labels, default = 'dm'. See
+     * <OpenLayers.Util.getFormattedLonLat> for other options.
+     */
+    labelFormat: 'dm',
+
+    /**
+     * APIProperty: lineSymbolizer
+     * {symbolizer} the symbolizer used to render lines
+     */
+    lineSymbolizer: {
+                strokeColor: "#333",
+                strokeWidth: 1,
+                strokeOpacity: 0.5
+            },
+
+    /**
+     * APIProperty: labelSymbolizer
+     * {symbolizer} the symbolizer used to render labels
+     */
+     labelSymbolizer: {},
+
+    /**
+     * Property: gratLayer
+     * {OpenLayers.Layer.Vector} vector layer used to draw the graticule on
+     */
+    gratLayer: null,
+
+    /**
+     * Constructor: OpenLayers.Control.Graticule
+     * Create a new graticule control to display a grid of latitude longitude
+     * lines.
+     * 
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        options = options || {};
+        options.layerName = options.layerName || OpenLayers.i18n("graticule");
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        this.labelSymbolizer.stroke = false;
+        this.labelSymbolizer.fill = false;
+        this.labelSymbolizer.label = "${label}";
+        this.labelSymbolizer.labelAlign = "${labelAlign}";
+        this.labelSymbolizer.labelXOffset = "${xOffset}";
+        this.labelSymbolizer.labelYOffset = "${yOffset}";
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        this.deactivate();        
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);        
+        if (this.gratLayer) {
+            this.gratLayer.destroy();
+            this.gratLayer = null;
+        }
+    },
+    
+    /**
+     * Method: draw
+     *
+     * initializes the graticule layer and does the initial update
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        if (!this.gratLayer) {
+            var gratStyle = new OpenLayers.Style({},{
+                rules: [new OpenLayers.Rule({'symbolizer':
+                    {"Point":this.labelSymbolizer,
+                     "Line":this.lineSymbolizer}
+                })]
+            });
+            this.gratLayer = new OpenLayers.Layer.Vector(this.layerName, {
+                styleMap: new OpenLayers.StyleMap({'default':gratStyle}),
+                visibility: this.visible,
+                displayInLayerSwitcher: this.displayInLayerSwitcher
+            });
+        }
+        return this.div;
+    },
+
+     /**
+     * APIMethod: activate
+     */
+    activate: function() {
+        if (OpenLayers.Control.prototype.activate.apply(this, arguments)) {
+            this.map.addLayer(this.gratLayer);
+            this.map.events.register('moveend', this, this.update);     
+            this.update();
+            return true;            
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * APIMethod: deactivate
+     */
+    deactivate: function() {
+        if (OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
+            this.map.events.unregister('moveend', this, this.update);
+            this.map.removeLayer(this.gratLayer);
+            return true;
+        } else {
+            return false;
+        }
+    },
+    /**
+     * Method: update
+     *
+     * calculates the grid to be displayed and actually draws it
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    update: function() {
+        //wait for the map to be initialized before proceeding
+        var mapBounds = this.map.getExtent();
+        if (!mapBounds) {
+            return;
+        }
+        
+        //clear out the old grid
+        this.gratLayer.destroyFeatures();
+        
+        //get the projection objects required
+        var llProj = new OpenLayers.Projection("EPSG:4326");
+        var mapProj = this.map.getProjectionObject();
+        var mapRes = this.map.getResolution();
+        
+        //if the map is in lon/lat, then the lines are straight and only one
+        //point is required
+        if (mapProj.proj && mapProj.proj.projName == "longlat") {
+            this.numPoints = 1;
+        }
+        
+        //get the map center in EPSG:4326
+        var mapCenter = this.map.getCenter(); //lon and lat here are really map x and y
+        var mapCenterLL = new OpenLayers.Pixel(mapCenter.lon, mapCenter.lat);
+        OpenLayers.Projection.transform(mapCenterLL, mapProj, llProj);
+        
+        /* This block of code determines the lon/lat interval to use for the
+         * grid by calculating the diagonal size of one grid cell at the map
+         * center.  Iterates through the intervals array until the diagonal
+         * length is less than the targetSize option.
+         */
+        //find lat/lon interval that results in a grid of less than the target size
+        var testSq = this.targetSize*mapRes;
+        testSq *= testSq;   //compare squares rather than doing a square root to save time
+        var llInterval;
+        for (var i=0; i<this.intervals.length; ++i) {
+            llInterval = this.intervals[i];   //could do this for both x and y??
+            var delta = llInterval/2;  
+            var p1 = mapCenterLL.offset(new OpenLayers.Pixel(-delta, -delta));  //test coords in EPSG:4326 space
+            var p2 = mapCenterLL.offset(new OpenLayers.Pixel( delta,  delta));
+            OpenLayers.Projection.transform(p1, llProj, mapProj); // convert them back to map projection
+            OpenLayers.Projection.transform(p2, llProj, mapProj);
+            var distSq = (p1.x-p2.x)*(p1.x-p2.x) + (p1.y-p2.y)*(p1.y-p2.y);
+            if (distSq <= testSq) {
+                break;
+            }
+        }
+        //alert(llInterval);
+        
+        //round the LL center to an even number based on the interval
+        mapCenterLL.x = Math.floor(mapCenterLL.x/llInterval)*llInterval;
+        mapCenterLL.y = Math.floor(mapCenterLL.y/llInterval)*llInterval;
+        //TODO adjust for minutses/seconds?
+        
+        /* The following 2 blocks calculate the nodes of the grid along a 
+         * line of constant longitude (then latitiude) running through the
+         * center of the map until it reaches the map edge.  The calculation
+         * goes from the center in both directions to the edge.
+         */
+        //get the central longitude line, increment the latitude
+        var iter = 0;
+        var centerLonPoints = [mapCenterLL.clone()];
+        var newPoint = mapCenterLL.clone();
+        var mapXY;
+        do {
+            newPoint = newPoint.offset(new OpenLayers.Pixel(0,llInterval));
+            mapXY = OpenLayers.Projection.transform(newPoint.clone(), llProj, mapProj);
+            centerLonPoints.unshift(newPoint);
+        } while (mapBounds.containsPixel(mapXY) && ++iter<1000);
+        newPoint = mapCenterLL.clone();
+        do {          
+            newPoint = newPoint.offset(new OpenLayers.Pixel(0,-llInterval));
+            mapXY = OpenLayers.Projection.transform(newPoint.clone(), llProj, mapProj);
+            centerLonPoints.push(newPoint);
+        } while (mapBounds.containsPixel(mapXY) && ++iter<1000);
+        
+        //get the central latitude line, increment the longitude
+        iter = 0;
+        var centerLatPoints = [mapCenterLL.clone()];
+        newPoint = mapCenterLL.clone();
+        do {
+            newPoint = newPoint.offset(new OpenLayers.Pixel(-llInterval, 0));
+            mapXY = OpenLayers.Projection.transform(newPoint.clone(), llProj, mapProj);
+            centerLatPoints.unshift(newPoint);
+        } while (mapBounds.containsPixel(mapXY) && ++iter<1000);
+        newPoint = mapCenterLL.clone();
+        do {          
+            newPoint = newPoint.offset(new OpenLayers.Pixel(llInterval, 0));
+            mapXY = OpenLayers.Projection.transform(newPoint.clone(), llProj, mapProj);
+            centerLatPoints.push(newPoint);
+        } while (mapBounds.containsPixel(mapXY) && ++iter<1000);
+        
+        //now generate a line for each node in the central lat and lon lines
+        //first loop over constant longitude
+        var lines = [];
+        for(var i=0; i < centerLatPoints.length; ++i) {
+            var lon = centerLatPoints[i].x;
+            var pointList = [];
+            var labelPoint = null;
+            var latEnd = Math.min(centerLonPoints[0].y, 90);
+            var latStart = Math.max(centerLonPoints[centerLonPoints.length - 1].y, -90);
+            var latDelta = (latEnd - latStart)/this.numPoints;
+            var lat = latStart;
+            for(var j=0; j<= this.numPoints; ++j) {
+                var gridPoint = new OpenLayers.Geometry.Point(lon,lat);
+                gridPoint.transform(llProj, mapProj);
+                pointList.push(gridPoint);
+                lat += latDelta;
+                if (gridPoint.y >= mapBounds.bottom && !labelPoint) {
+                    labelPoint = gridPoint;
+                }
+            }
+            if (this.labelled) {
+                //keep track of when this grid line crosses the map bounds to set
+                //the label position
+                //labels along the bottom, add 10 pixel offset up into the map
+                //TODO add option for labels on top
+                var labelPos = new OpenLayers.Geometry.Point(labelPoint.x,mapBounds.bottom);
+                var labelAttrs = {
+                    value: lon,
+                    label: this.labelled?OpenLayers.Util.getFormattedLonLat(lon, "lon", this.labelFormat):"",
+                    labelAlign: "cb",
+                    xOffset: 0,
+                    yOffset: 2
+                }; 
+                this.gratLayer.addFeatures(new OpenLayers.Feature.Vector(labelPos,labelAttrs));
+            }
+            var geom = new OpenLayers.Geometry.LineString(pointList);
+            lines.push(new OpenLayers.Feature.Vector(geom));
+        }
+        
+        //now draw the lines of constant latitude
+        for (var j=0; j < centerLonPoints.length; ++j) {
+            lat = centerLonPoints[j].y;
+            if (lat<-90 || lat>90) {  //latitudes only valid between -90 and 90
+                continue;
+            }
+            var pointList = [];
+            var lonStart = centerLatPoints[0].x;
+            var lonEnd = centerLatPoints[centerLatPoints.length - 1].x;
+            var lonDelta = (lonEnd - lonStart)/this.numPoints;
+            var lon = lonStart;
+            var labelPoint = null;
+            for(var i=0; i <= this.numPoints ; ++i) {
+                var gridPoint = new OpenLayers.Geometry.Point(lon,lat);
+                gridPoint.transform(llProj, mapProj);
+                pointList.push(gridPoint);
+                lon += lonDelta;
+                if (gridPoint.x < mapBounds.right) {
+                    labelPoint = gridPoint;
+                }
+            }
+            if (this.labelled) {
+                //keep track of when this grid line crosses the map bounds to set
+                //the label position
+                //labels along the right, 30 pixel offset left into the map
+                //TODO add option for labels on left
+                var labelPos = new OpenLayers.Geometry.Point(mapBounds.right, labelPoint.y); 
+                var labelAttrs = {
+                    value: lat,
+                    label: this.labelled?OpenLayers.Util.getFormattedLonLat(lat, "lat", this.labelFormat):"",
+                    labelAlign: "rb",
+                    xOffset: -2,
+                    yOffset: 2
+                }; 
+                this.gratLayer.addFeatures(new OpenLayers.Feature.Vector(labelPos,labelAttrs));
+            }
+            var geom = new OpenLayers.Geometry.LineString(pointList);
+            lines.push(new OpenLayers.Feature.Vector(geom));
+          }
+          this.gratLayer.addFeatures(lines);
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.Graticule"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseDefaults.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseDefaults.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MouseDefaults.js	(revision 76)
@@ -0,0 +1,368 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.MouseDefaults
+ * This class is DEPRECATED in 2.4 and will be removed by 3.0.
+ * If you need this functionality, use <OpenLayers.Control.Navigation> 
+ * instead!!!
+ *
+ * This class is DEPRECATED in 2.4 and will be removed by 3.0.
+ *     If you need this functionality, use Control.Navigation instead!!!
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.MouseDefaults = OpenLayers.Class(OpenLayers.Control, {
+
+    /** WARNING WARNING WARNING!!!
+        This class is DEPRECATED in 2.4 and will be removed by 3.0.
+        If you need this functionality, use Control.Navigation instead!!! */
+
+    /** 
+     * Property: performedDrag
+     * {Boolean}
+     */
+    performedDrag: false,
+
+    /** 
+     * Property: wheelObserver 
+     * {Function}
+     */
+    wheelObserver: null,
+
+    /** 
+     * Constructor: OpenLayers.Control.MouseDefaults
+     */
+    initialize: function() {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: destroy
+     */    
+    destroy: function() {
+        
+        if (this.handler) {
+            this.handler.destroy();
+        }
+        this.handler = null;
+
+        this.map.events.un({
+            "click": this.defaultClick,
+            "dblclick": this.defaultDblClick,
+            "mousedown": this.defaultMouseDown,
+            "mouseup": this.defaultMouseUp,
+            "mousemove": this.defaultMouseMove,
+            "mouseout": this.defaultMouseOut,
+            scope: this
+        });
+
+        //unregister mousewheel events specifically on the window and document
+        OpenLayers.Event.stopObserving(window, "DOMMouseScroll", 
+                                        this.wheelObserver);
+        OpenLayers.Event.stopObserving(window, "mousewheel", 
+                                        this.wheelObserver);
+        OpenLayers.Event.stopObserving(document, "mousewheel", 
+                                        this.wheelObserver);
+        this.wheelObserver = null;
+                      
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);        
+    },
+
+    /**
+     * Method: draw
+     */
+    draw: function() {
+        this.map.events.on({
+            "click": this.defaultClick,
+            "dblclick": this.defaultDblClick,
+            "mousedown": this.defaultMouseDown,
+            "mouseup": this.defaultMouseUp,
+            "mousemove": this.defaultMouseMove,
+            "mouseout": this.defaultMouseOut,
+            scope: this
+        });
+
+        this.registerWheelEvents();
+
+    },
+
+    /**
+     * Method: registerWheelEvents
+     */
+    registerWheelEvents: function() {
+
+        this.wheelObserver = OpenLayers.Function.bindAsEventListener(
+            this.onWheelEvent, this
+        );
+        
+        //register mousewheel events specifically on the window and document
+        OpenLayers.Event.observe(window, "DOMMouseScroll", this.wheelObserver);
+        OpenLayers.Event.observe(window, "mousewheel", this.wheelObserver);
+        OpenLayers.Event.observe(document, "mousewheel", this.wheelObserver);
+    },
+
+    /**
+     * Method: defaultClick
+     * 
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean}
+     */
+    defaultClick: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        var notAfterDrag = !this.performedDrag;
+        this.performedDrag = false;
+        return notAfterDrag;
+    },
+
+    /**
+     * Method: defaultDblClick
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultDblClick: function (evt) {
+        var newCenter = this.map.getLonLatFromViewPortPx( evt.xy ); 
+        this.map.setCenter(newCenter, this.map.zoom + 1);
+        OpenLayers.Event.stop(evt);
+        return false;
+    },
+
+    /**
+     * Method: defaultMouseDown
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseDown: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        this.mouseDragStart = evt.xy.clone();
+        this.performedDrag  = false;
+        if (evt.shiftKey) {
+            this.map.div.style.cursor = "crosshair";
+            this.zoomBox = OpenLayers.Util.createDiv('zoomBox',
+                                                     this.mouseDragStart,
+                                                     null,
+                                                     null,
+                                                     "absolute",
+                                                     "2px solid red");
+            this.zoomBox.style.backgroundColor = "white";
+            this.zoomBox.style.filter = "alpha(opacity=50)"; // IE
+            this.zoomBox.style.opacity = "0.50";
+            this.zoomBox.style.fontSize = "1px";
+            this.zoomBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+            this.map.viewPortDiv.appendChild(this.zoomBox);
+        }
+        document.onselectstart = OpenLayers.Function.False;
+        OpenLayers.Event.stop(evt);
+    },
+
+    /**
+     * Method: defaultMouseMove
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseMove: function (evt) {
+        // record the mouse position, used in onWheelEvent
+        this.mousePosition = evt.xy.clone();
+
+        if (this.mouseDragStart != null) {
+            if (this.zoomBox) {
+                var deltaX = Math.abs(this.mouseDragStart.x - evt.xy.x);
+                var deltaY = Math.abs(this.mouseDragStart.y - evt.xy.y);
+                this.zoomBox.style.width = Math.max(1, deltaX) + "px";
+                this.zoomBox.style.height = Math.max(1, deltaY) + "px";
+                if (evt.xy.x < this.mouseDragStart.x) {
+                    this.zoomBox.style.left = evt.xy.x+"px";
+                }
+                if (evt.xy.y < this.mouseDragStart.y) {
+                    this.zoomBox.style.top = evt.xy.y+"px";
+                }
+            } else {
+                var deltaX = this.mouseDragStart.x - evt.xy.x;
+                var deltaY = this.mouseDragStart.y - evt.xy.y;
+                var size = this.map.getSize();
+                var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX,
+                                                 size.h / 2 + deltaY);
+                var newCenter = this.map.getLonLatFromViewPortPx( newXY ); 
+                this.map.setCenter(newCenter, null, true);
+                this.mouseDragStart = evt.xy.clone();
+                this.map.div.style.cursor = "move";
+            }
+            this.performedDrag = true;
+        }
+    },
+
+    /**
+     * Method: defaultMouseUp
+     * 
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    defaultMouseUp: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        if (this.zoomBox) {
+            this.zoomBoxEnd(evt);    
+        } else {
+            if (this.performedDrag) {
+                this.map.setCenter(this.map.center);
+            }
+        }
+        document.onselectstart=null;
+        this.mouseDragStart = null;
+        this.map.div.style.cursor = "";
+    },
+
+    /**
+     * Method: defaultMouseOut
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultMouseOut: function (evt) {
+        if (this.mouseDragStart != null && 
+            OpenLayers.Util.mouseLeft(evt, this.map.div)) {
+            if (this.zoomBox) {
+                this.removeZoomBox();
+            }
+            this.mouseDragStart = null;
+        }
+    },
+
+
+    /** 
+     * Method: defaultWheelUp
+     * User spun scroll wheel up
+     * 
+     */
+    defaultWheelUp: function(evt) {
+        if (this.map.getZoom() <= this.map.getNumZoomLevels()) {
+            this.map.setCenter(this.map.getLonLatFromPixel(evt.xy),
+                               this.map.getZoom() + 1);
+        }
+    },
+
+    /**
+     * Method: defaultWheelDown
+     * User spun scroll wheel down
+     */
+    defaultWheelDown: function(evt) {
+        if (this.map.getZoom() > 0) {
+            this.map.setCenter(this.map.getLonLatFromPixel(evt.xy),
+                               this.map.getZoom() - 1);
+        }
+    },
+
+    /**
+     * Method: zoomBoxEnd
+     * Zoombox function. 
+     */
+    zoomBoxEnd: function(evt) {
+        if (this.mouseDragStart != null) {
+            if (Math.abs(this.mouseDragStart.x - evt.xy.x) > 5 ||    
+                Math.abs(this.mouseDragStart.y - evt.xy.y) > 5) {   
+                var start = this.map.getLonLatFromViewPortPx( this.mouseDragStart ); 
+                var end = this.map.getLonLatFromViewPortPx( evt.xy );
+                var top = Math.max(start.lat, end.lat);
+                var bottom = Math.min(start.lat, end.lat);
+                var left = Math.min(start.lon, end.lon);
+                var right = Math.max(start.lon, end.lon);
+                var bounds = new OpenLayers.Bounds(left, bottom, right, top);
+                this.map.zoomToExtent(bounds);
+            } else {
+                var end = this.map.getLonLatFromViewPortPx( evt.xy );
+                this.map.setCenter(new OpenLayers.LonLat(
+                  (end.lon),
+                  (end.lat)
+                 ), this.map.getZoom() + 1);
+            }    
+            this.removeZoomBox();
+       }
+    },
+
+    /**
+     * Method: removeZoomBox
+     * Remove the zoombox from the screen and nullify our reference to it.
+     */
+    removeZoomBox: function() {
+        this.map.viewPortDiv.removeChild(this.zoomBox);
+        this.zoomBox = null;
+    },
+
+
+/**
+ *  Mouse ScrollWheel code thanks to http://adomas.org/javascript-mouse-wheel/
+ */
+
+
+    /**
+     * Method: onWheelEvent
+     * Catch the wheel event and handle it xbrowserly
+     *
+     * Parameters: 
+     * e - {Event} 
+     */
+    onWheelEvent: function(e){
+    
+        // first determine whether or not the wheeling was inside the map
+        var inMap = false;
+        var elem = OpenLayers.Event.element(e);
+        while(elem != null) {
+            if (this.map && elem == this.map.div) {
+                inMap = true;
+                break;
+            }
+            elem = elem.parentNode;
+        }
+        
+        if (inMap) {
+            
+            var delta = 0;
+            if (!e) {
+                e = window.event;
+            }
+            if (e.wheelDelta) {
+                delta = e.wheelDelta/120; 
+                if (window.opera && window.opera.version() < 9.2) {
+                    delta = -delta;
+                }
+            } else if (e.detail) {
+                delta = -e.detail / 3;
+            }
+            if (delta) {
+                // add the mouse position to the event because mozilla has a bug
+                // with clientX and clientY (see https://bugzilla.mozilla.org/show_bug.cgi?id=352179)
+                // getLonLatFromViewPortPx(e) returns wrong values
+                e.xy = this.mousePosition;
+
+                if (delta < 0) {
+                   this.defaultWheelDown(e);
+                } else {
+                   this.defaultWheelUp(e);
+                }
+            }
+            
+            //only wheel the map, not the window
+            OpenLayers.Event.stop(e);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.MouseDefaults"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Permalink.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Permalink.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Permalink.js	(revision 76)
@@ -0,0 +1,220 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/ArgParser.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Permalink
+ * The Permalink control is hyperlink that will return the user to the 
+ * current map view. By default it is drawn in the lower right corner of the
+ * map. The href is updated as the map is zoomed, panned and whilst layers
+ * are switched.
+ * `
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * APIProperty: argParserClass
+     * {Class} The ArgParser control class (not instance) to use with this
+     *     control.
+     */
+    argParserClass: OpenLayers.Control.ArgParser,
+
+    /** 
+     * Property: element 
+     * {DOMElement}
+     */
+    element: null,
+    
+    /** 
+     * APIProperty: base
+     * {String}
+     */
+    base: '',
+
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support.  Projection used
+     *     when creating the coordinates in the link. This will reproject the
+     *     map coordinates into display coordinates. If you are using this
+     *     functionality, the permalink which is last added to the map will
+     *     determine the coordinate type which is read from the URL, which
+     *     means you should not add permalinks with different
+     *     displayProjections to the same map. 
+     */
+    displayProjection: null, 
+
+    /**
+     * Constructor: OpenLayers.Control.Permalink
+     *
+     * Parameters: 
+     * element - {DOMElement} 
+     * base - {String} 
+     * options - {Object} options to the control. 
+     */
+    initialize: function(element, base, options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.element = OpenLayers.Util.getElement(element);        
+        this.base = base || document.location.href;
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function()  {
+        if (this.element.parentNode == this.div) {
+            this.div.removeChild(this.element);
+        }
+        this.element = null;
+
+        this.map.events.unregister('moveend', this, this.updateLink);
+
+        OpenLayers.Control.prototype.destroy.apply(this, arguments); 
+    },
+
+    /**
+     * Method: setMap
+     * Set the map property for the control. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+
+        //make sure we have an arg parser attached
+        for(var i=0, len=this.map.controls.length; i<len; i++) {
+            var control = this.map.controls[i];
+            if (control.CLASS_NAME == this.argParserClass.CLASS_NAME) {
+                
+                // If a permalink is added to the map, and an ArgParser already
+                // exists, we override the displayProjection to be the one
+                // on the permalink. 
+                if (control.displayProjection != this.displayProjection) {
+                    this.displayProjection = control.displayProjection;
+                }    
+                
+                break;
+            }
+        }
+        if (i == this.map.controls.length) {
+            this.map.addControl(new this.argParserClass(
+                { 'displayProjection': this.displayProjection }));       
+        }
+
+    },
+
+    /**
+     * Method: draw
+     *
+     * Returns:
+     * {DOMElement}
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+          
+        if (!this.element) {
+            this.div.className = this.displayClass;
+            this.element = document.createElement("a");
+            this.element.innerHTML = OpenLayers.i18n("permalink");
+            this.element.href="";
+            this.div.appendChild(this.element);
+        }
+        this.map.events.on({
+            'moveend': this.updateLink,
+            'changelayer': this.updateLink,
+            'changebaselayer': this.updateLink,
+            scope: this
+        });
+        
+        // Make it so there is at least a link even though the map may not have
+        // moved yet.
+        this.updateLink();
+        
+        return this.div;
+    },
+   
+    /**
+     * Method: updateLink 
+     */
+    updateLink: function() {
+        var href = this.base;
+        if (href.indexOf('?') != -1) {
+            href = href.substring( 0, href.indexOf('?') );
+        }
+
+        href += '?' + OpenLayers.Util.getParameterString(this.createParams());
+        this.element.href = href;
+    }, 
+    
+    /**
+     * APIMethod: createParams
+     * Creates the parameters that need to be encoded into the permalink url.
+     * 
+     * Parameters:
+     * center - {<OpenLayers.LonLat>} center to encode in the permalink.
+     *     Defaults to the current map center.
+     * zoom - {Integer} zoom level to encode in the permalink. Defaults to the
+     *     current map zoom level.
+     * layers - {Array(<OpenLayers.Layer>)} layers to encode in the permalink.
+     *     Defaults to the current map layers.
+     * 
+     * Returns:
+     * {Object} Hash of parameters that will be url-encoded into the
+     * permalink.
+     */
+    createParams: function(center, zoom, layers) {
+        center = center || this.map.getCenter();
+          
+        var params = OpenLayers.Util.getParameters(this.base);
+        
+        // If there's still no center, map is not initialized yet. 
+        // Break out of this function, and simply return the params from the
+        // base link.
+        if (center) { 
+
+            //zoom
+            params.zoom = zoom || this.map.getZoom(); 
+
+            //lon,lat
+            var lat = center.lat;
+            var lon = center.lon;
+            
+            if (this.displayProjection) {
+                var mapPosition = OpenLayers.Projection.transform(
+                  { x: lon, y: lat }, 
+                  this.map.getProjectionObject(), 
+                  this.displayProjection );
+                lon = mapPosition.x;  
+                lat = mapPosition.y;  
+            }       
+            params.lat = Math.round(lat*100000)/100000;
+            params.lon = Math.round(lon*100000)/100000;
+    
+            //layers        
+            layers = layers || this.map.layers;  
+            params.layers = '';
+            for (var i=0, len=layers.length; i<len; i++) {
+                var layer = layers[i];
+    
+                if (layer.isBaseLayer) {
+                    params.layers += (layer == this.map.baseLayer) ? "B" : "0";
+                } else {
+                    params.layers += (layer.getVisibility()) ? "T" : "F";           
+                }
+            }
+        }
+
+        return params;
+    }, 
+
+    CLASS_NAME: "OpenLayers.Control.Permalink"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoom.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoom.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoom.js	(revision 76)
@@ -0,0 +1,246 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.PanZoom
+ * The PanZoom is a visible control, composed of a
+ * <OpenLayers.Control.PanPanel> and a <OpenLayers.Control.ZoomPanel>. By
+ * default it is drawn in the upper left corner of the map.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.PanZoom = OpenLayers.Class(OpenLayers.Control, {
+
+    /** 
+     * APIProperty: slideFactor
+     * {Integer} Number of pixels by which we'll pan the map in any direction 
+     *     on clicking the arrow buttons.  If you want to pan by some ratio
+     *     of the map dimensions, use <slideRatio> instead.
+     */
+    slideFactor: 50,
+
+    /** 
+     * APIProperty: slideRatio
+     * {Number} The fraction of map width/height by which we'll pan the map            
+     *     on clicking the arrow buttons.  Default is null.  If set, will
+     *     override <slideFactor>. E.g. if slideRatio is .5, then the Pan Up
+     *     button will pan up half the map height. 
+     */
+    slideRatio: null,
+
+    /** 
+     * Property: buttons
+     * {Array(DOMElement)} Array of Button Divs 
+     */
+    buttons: null,
+
+    /** 
+     * Property: position
+     * {<OpenLayers.Pixel>} 
+     */
+    position: null,
+
+    /**
+     * Constructor: OpenLayers.Control.PanZoom
+     * 
+     * Parameters:
+     * options - {Object}
+     */
+    initialize: function(options) {
+        this.position = new OpenLayers.Pixel(OpenLayers.Control.PanZoom.X,
+                                             OpenLayers.Control.PanZoom.Y);
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+        this.removeButtons();
+        this.buttons = null;
+        this.position = null;
+    },
+
+    /**
+     * Method: draw
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} 
+     * 
+     * Returns:
+     * {DOMElement} A reference to the container div for the PanZoom control.
+     */
+    draw: function(px) {
+        // initialize our internal div
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        px = this.position;
+
+        // place the controls
+        this.buttons = [];
+
+        var sz = new OpenLayers.Size(18,18);
+        var centered = new OpenLayers.Pixel(px.x+sz.w/2, px.y);
+
+        this._addButton("panup", "north-mini.png", centered, sz);
+        px.y = centered.y+sz.h;
+        this._addButton("panleft", "west-mini.png", px, sz);
+        this._addButton("panright", "east-mini.png", px.add(sz.w, 0), sz);
+        this._addButton("pandown", "south-mini.png", 
+                        centered.add(0, sz.h*2), sz);
+        this._addButton("zoomin", "zoom-plus-mini.png", 
+                        centered.add(0, sz.h*3+5), sz);
+        this._addButton("zoomworld", "zoom-world-mini.png", 
+                        centered.add(0, sz.h*4+5), sz);
+        this._addButton("zoomout", "zoom-minus-mini.png", 
+                        centered.add(0, sz.h*5+5), sz);
+        return this.div;
+    },
+    
+    /**
+     * Method: _addButton
+     * 
+     * Parameters:
+     * id - {String} 
+     * img - {String} 
+     * xy - {<OpenLayers.Pixel>} 
+     * sz - {<OpenLayers.Size>} 
+     * 
+     * Returns:
+     * {DOMElement} A Div (an alphaImageDiv, to be precise) that contains the
+     *     image of the button, and has all the proper event handlers set.
+     */
+    _addButton:function(id, img, xy, sz) {
+        var imgLocation = OpenLayers.Util.getImagesLocation() + img;
+        var btn = OpenLayers.Util.createAlphaImageDiv(
+                                    this.id + "_" + id, 
+                                    xy, sz, imgLocation, "absolute");
+
+        //we want to add the outer div
+        this.div.appendChild(btn);
+
+        OpenLayers.Event.observe(btn, "mousedown", 
+            OpenLayers.Function.bindAsEventListener(this.buttonDown, btn));
+        OpenLayers.Event.observe(btn, "dblclick", 
+            OpenLayers.Function.bindAsEventListener(this.doubleClick, btn));
+        OpenLayers.Event.observe(btn, "click", 
+            OpenLayers.Function.bindAsEventListener(this.doubleClick, btn));
+        btn.action = id;
+        btn.map = this.map;
+    
+        if(!this.slideRatio){
+            var slideFactorPixels = this.slideFactor;
+            var getSlideFactor = function() {
+                return slideFactorPixels;
+            };
+        } else {
+            var slideRatio = this.slideRatio;
+            var getSlideFactor = function(dim) {
+                return this.map.getSize()[dim] * slideRatio;
+            };
+        }
+
+        btn.getSlideFactor = getSlideFactor;
+
+        //we want to remember/reference the outer div
+        this.buttons.push(btn);
+        return btn;
+    },
+    
+    /**
+     * Method: _removeButton
+     * 
+     * Parameters:
+     * btn - {Object}
+     */
+    _removeButton: function(btn) {
+        OpenLayers.Event.stopObservingElement(btn);
+        btn.map = null;
+        btn.getSlideFactor = null;
+        this.div.removeChild(btn);
+        OpenLayers.Util.removeItem(this.buttons, btn);
+    },
+    
+    /**
+     * Method: removeButtons
+     */
+    removeButtons: function() {
+        for(var i=this.buttons.length-1; i>=0; --i) {
+            this._removeButton(this.buttons[i]);
+        }
+    },
+    
+    /**
+     * Method: doubleClick
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean}
+     */
+    doubleClick: function (evt) {
+        OpenLayers.Event.stop(evt);
+        return false;
+    },
+    
+    /**
+     * Method: buttonDown
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    buttonDown: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+
+        switch (this.action) {
+            case "panup": 
+                this.map.pan(0, -this.getSlideFactor("h"));
+                break;
+            case "pandown": 
+                this.map.pan(0, this.getSlideFactor("h"));
+                break;
+            case "panleft": 
+                this.map.pan(-this.getSlideFactor("w"), 0);
+                break;
+            case "panright": 
+                this.map.pan(this.getSlideFactor("w"), 0);
+                break;
+            case "zoomin": 
+                this.map.zoomIn(); 
+                break;
+            case "zoomout": 
+                this.map.zoomOut(); 
+                break;
+            case "zoomworld": 
+                this.map.zoomToMaxExtent(); 
+                break;
+        }
+
+        OpenLayers.Event.stop(evt);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.PanZoom"
+});
+
+/**
+ * Constant: X
+ * {Integer}
+ */
+OpenLayers.Control.PanZoom.X = 4;
+
+/**
+ * Constant: Y
+ * {Integer}
+ */
+OpenLayers.Control.PanZoom.Y = 4;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/LayerSwitcher.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/LayerSwitcher.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/LayerSwitcher.js	(revision 76)
@@ -0,0 +1,620 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/** 
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.LayerSwitcher
+ * The LayerSwitcher control displays a table of contents for the map. This 
+ * allows the user interface to switch between BaseLasyers and to show or hide
+ * Overlays. By default the switcher is shown minimized on the right edge of 
+ * the map, the user may expand it by clicking on the handle.
+ *
+ * To create the LayerSwitcher outside of the map, pass the Id of a html div 
+ * as the first argument to the constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.LayerSwitcher = 
+  OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * APIProperty: roundedCorner
+     * {Boolean} If true the Rico library is used for rounding the corners
+     *     of the layer switcher div, defaults to true.
+     */
+    roundedCorner: true,
+
+    /**  
+     * APIProperty: roundedCornerColor
+     * {String} The color of the rounded corners, only applies if roundedCorner
+     *     is true, defaults to "darkblue".
+     */
+    roundedCornerColor: "darkblue",
+    
+    /**  
+     * Property: layerStates 
+     * {Array(Object)} Basically a copy of the "state" of the map's layers 
+     *     the last time the control was drawn. We have this in order to avoid
+     *     unnecessarily redrawing the control.
+     */
+    layerStates: null,
+    
+
+  // DOM Elements
+  
+    /**
+     * Property: layersDiv
+     * {DOMElement} 
+     */
+    layersDiv: null,
+    
+    /** 
+     * Property: baseLayersDiv
+     * {DOMElement}
+     */
+    baseLayersDiv: null,
+
+    /** 
+     * Property: baseLayers
+     * {Array(<OpenLayers.Layer>)}
+     */
+    baseLayers: null,
+    
+    
+    /** 
+     * Property: dataLbl
+     * {DOMElement} 
+     */
+    dataLbl: null,
+    
+    /** 
+     * Property: dataLayersDiv
+     * {DOMElement} 
+     */
+    dataLayersDiv: null,
+
+    /** 
+     * Property: dataLayers
+     * {Array(<OpenLayers.Layer>)} 
+     */
+    dataLayers: null,
+
+
+    /** 
+     * Property: minimizeDiv
+     * {DOMElement} 
+     */
+    minimizeDiv: null,
+
+    /** 
+     * Property: maximizeDiv
+     * {DOMElement} 
+     */
+    maximizeDiv: null,
+    
+    /**
+     * APIProperty: ascending
+     * {Boolean} 
+     */
+    ascending: true,
+ 
+    /**
+     * Constructor: OpenLayers.Control.LayerSwitcher
+     * 
+     * Parameters:
+     * options - {Object}
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+        this.layerStates = [];
+    },
+
+    /**
+     * APIMethod: destroy 
+     */    
+    destroy: function() {
+        
+        OpenLayers.Event.stopObservingElement(this.div);
+
+        OpenLayers.Event.stopObservingElement(this.minimizeDiv);
+        OpenLayers.Event.stopObservingElement(this.maximizeDiv);
+
+        //clear out layers info and unregister their events 
+        this.clearLayersArray("base");
+        this.clearLayersArray("data");
+        
+        this.map.events.un({
+            "addlayer": this.redraw,
+            "changelayer": this.redraw,
+            "removelayer": this.redraw,
+            "changebaselayer": this.redraw,
+            scope: this
+        });
+        
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+    },
+
+    /** 
+     * Method: setMap
+     *
+     * Properties:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+
+        this.map.events.on({
+            "addlayer": this.redraw,
+            "changelayer": this.redraw,
+            "removelayer": this.redraw,
+            "changebaselayer": this.redraw,
+            scope: this
+        });
+    },
+
+    /**
+     * Method: draw
+     *
+     * Returns:
+     * {DOMElement} A reference to the DIV DOMElement containing the 
+     *     switcher tabs.
+     */  
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this);
+
+        // create layout divs
+        this.loadContents();
+
+        // set mode to minimize
+        if(!this.outsideViewport) {
+            this.minimizeControl();
+        }
+
+        // populate div with current info
+        this.redraw();    
+
+        return this.div;
+    },
+
+    /** 
+     * Method: clearLayersArray
+     * User specifies either "base" or "data". we then clear all the
+     *     corresponding listeners, the div, and reinitialize a new array.
+     * 
+     * Parameters:
+     * layersType - {String}  
+     */
+    clearLayersArray: function(layersType) {
+        var layers = this[layersType + "Layers"];
+        if (layers) {
+            for(var i=0, len=layers.length; i<len ; i++) {
+                var layer = layers[i];
+                OpenLayers.Event.stopObservingElement(layer.inputElem);
+                OpenLayers.Event.stopObservingElement(layer.labelSpan);
+            }
+        }
+        this[layersType + "LayersDiv"].innerHTML = "";
+        this[layersType + "Layers"] = [];
+    },
+
+
+    /**
+     * Method: checkRedraw
+     * Checks if the layer state has changed since the last redraw() call.
+     * 
+     * Returns:
+     * {Boolean} The layer state changed since the last redraw() call. 
+     */
+    checkRedraw: function() {
+        var redraw = false;
+        if ( !this.layerStates.length ||
+             (this.map.layers.length != this.layerStates.length) ) {
+            redraw = true;
+        } else {
+            for (var i=0, len=this.layerStates.length; i<len; i++) {
+                var layerState = this.layerStates[i];
+                var layer = this.map.layers[i];
+                if ( (layerState.name != layer.name) || 
+                     (layerState.inRange != layer.inRange) || 
+                     (layerState.id != layer.id) || 
+                     (layerState.visibility != layer.visibility) ) {
+                    redraw = true;
+                    break;
+                }    
+            }
+        }    
+        return redraw;
+    },
+    
+    /** 
+     * Method: redraw
+     * Goes through and takes the current state of the Map and rebuilds the
+     *     control to display that state. Groups base layers into a 
+     *     radio-button group and lists each data layer with a checkbox.
+     *
+     * Returns: 
+     * {DOMElement} A reference to the DIV DOMElement containing the control
+     */  
+    redraw: function() {
+        //if the state hasn't changed since last redraw, no need 
+        // to do anything. Just return the existing div.
+        if (!this.checkRedraw()) { 
+            return this.div; 
+        } 
+
+        //clear out previous layers 
+        this.clearLayersArray("base");
+        this.clearLayersArray("data");
+        
+        var containsOverlays = false;
+        var containsBaseLayers = false;
+        
+        // Save state -- for checking layer if the map state changed.
+        // We save this before redrawing, because in the process of redrawing
+        // we will trigger more visibility changes, and we want to not redraw
+        // and enter an infinite loop.
+        var len = this.map.layers.length;
+        this.layerStates = new Array(len);
+        for (var i=0; i <len; i++) {
+            var layer = this.map.layers[i];
+            this.layerStates[i] = {
+                'name': layer.name, 
+                'visibility': layer.visibility,
+                'inRange': layer.inRange,
+                'id': layer.id
+            };
+        }    
+
+        var layers = this.map.layers.slice();
+        if (!this.ascending) { layers.reverse(); }
+        for(var i=0, len=layers.length; i<len; i++) {
+            var layer = layers[i];
+            var baseLayer = layer.isBaseLayer;
+
+            if (layer.displayInLayerSwitcher) {
+
+                if (baseLayer) {
+                    containsBaseLayers = true;
+                } else {
+                    containsOverlays = true;
+                }    
+
+                // only check a baselayer if it is *the* baselayer, check data
+                //  layers if they are visible
+                var checked = (baseLayer) ? (layer == this.map.baseLayer)
+                                          : layer.getVisibility();
+    
+                // create input element
+                var inputElem = document.createElement("input");
+                inputElem.id = this.id + "_input_" + layer.name;
+                inputElem.name = (baseLayer) ? this.id + "_baseLayers" : layer.name;
+                inputElem.type = (baseLayer) ? "radio" : "checkbox";
+                inputElem.value = layer.name;
+                inputElem.checked = checked;
+                inputElem.defaultChecked = checked;
+
+                if (!baseLayer && !layer.inRange) {
+                    inputElem.disabled = true;
+                }
+                var context = {
+                    'inputElem': inputElem,
+                    'layer': layer,
+                    'layerSwitcher': this
+                };
+                OpenLayers.Event.observe(inputElem, "mouseup", 
+                    OpenLayers.Function.bindAsEventListener(this.onInputClick,
+                                                            context)
+                );
+                
+                // create span
+                var labelSpan = document.createElement("span");
+                OpenLayers.Element.addClass(labelSpan, "labelSpan")
+                if (!baseLayer && !layer.inRange) {
+                    labelSpan.style.color = "gray";
+                }
+                labelSpan.innerHTML = layer.name;
+                labelSpan.style.verticalAlign = (baseLayer) ? "bottom" 
+                                                            : "baseline";
+                OpenLayers.Event.observe(labelSpan, "click", 
+                    OpenLayers.Function.bindAsEventListener(this.onInputClick,
+                                                            context)
+                );
+                // create line break
+                var br = document.createElement("br");
+    
+                
+                var groupArray = (baseLayer) ? this.baseLayers
+                                             : this.dataLayers;
+                groupArray.push({
+                    'layer': layer,
+                    'inputElem': inputElem,
+                    'labelSpan': labelSpan
+                });
+                                                     
+    
+                var groupDiv = (baseLayer) ? this.baseLayersDiv
+                                           : this.dataLayersDiv;
+                groupDiv.appendChild(inputElem);
+                groupDiv.appendChild(labelSpan);
+                groupDiv.appendChild(br);
+            }
+        }
+
+        // if no overlays, dont display the overlay label
+        this.dataLbl.style.display = (containsOverlays) ? "" : "none";        
+        
+        // if no baselayers, dont display the baselayer label
+        this.baseLbl.style.display = (containsBaseLayers) ? "" : "none";        
+
+        return this.div;
+    },
+
+    /** 
+     * Method:
+     * A label has been clicked, check or uncheck its corresponding input
+     * 
+     * Parameters:
+     * e - {Event} 
+     *
+     * Context:  
+     *  - {DOMElement} inputElem
+     *  - {<OpenLayers.Control.LayerSwitcher>} layerSwitcher
+     *  - {<OpenLayers.Layer>} layer
+     */
+
+    onInputClick: function(e) {
+
+        if (!this.inputElem.disabled) {
+            if (this.inputElem.type == "radio") {
+                this.inputElem.checked = true;
+                this.layer.map.setBaseLayer(this.layer);
+            } else {
+                this.inputElem.checked = !this.inputElem.checked;
+                this.layerSwitcher.updateMap();
+            }
+        }
+        OpenLayers.Event.stop(e);
+    },
+    
+    /**
+     * Method: onLayerClick
+     * Need to update the map accordingly whenever user clicks in either of
+     *     the layers.
+     * 
+     * Parameters: 
+     * e - {Event} 
+     */
+    onLayerClick: function(e) {
+        this.updateMap();
+    },
+
+
+    /** 
+     * Method: updateMap
+     * Cycles through the loaded data and base layer input arrays and makes
+     *     the necessary calls to the Map object such that that the map's 
+     *     visual state corresponds to what the user has selected in 
+     *     the control.
+     */
+    updateMap: function() {
+
+        // set the newly selected base layer        
+        for(var i=0, len=this.baseLayers.length; i<len; i++) {
+            var layerEntry = this.baseLayers[i];
+            if (layerEntry.inputElem.checked) {
+                this.map.setBaseLayer(layerEntry.layer, false);
+            }
+        }
+
+        // set the correct visibilities for the overlays
+        for(var i=0, len=this.dataLayers.length; i<len; i++) {
+            var layerEntry = this.dataLayers[i];   
+            layerEntry.layer.setVisibility(layerEntry.inputElem.checked);
+        }
+
+    },
+
+    /** 
+     * Method: maximizeControl
+     * Set up the labels and divs for the control
+     * 
+     * Parameters:
+     * e - {Event} 
+     */
+    maximizeControl: function(e) {
+
+        // set the div's width and height to empty values, so
+        // the div dimensions can be controlled by CSS
+        this.div.style.width = "";
+        this.div.style.height = "";
+
+        this.showControls(false);
+
+        if (e != null) {
+            OpenLayers.Event.stop(e);                                            
+        }
+    },
+    
+    /** 
+     * Method: minimizeControl
+     * Hide all the contents of the control, shrink the size, 
+     *     add the maximize icon
+     *
+     * Parameters:
+     * e - {Event} 
+     */
+    minimizeControl: function(e) {
+
+        // to minimize the control we set its div's width
+        // and height to 0px, we cannot just set "display"
+        // to "none" because it would hide the maximize
+        // div
+        this.div.style.width = "0px";
+        this.div.style.height = "0px";
+
+        this.showControls(true);
+
+        if (e != null) {
+            OpenLayers.Event.stop(e);                                            
+        }
+    },
+
+    /**
+     * Method: showControls
+     * Hide/Show all LayerSwitcher controls depending on whether we are
+     *     minimized or not
+     * 
+     * Parameters:
+     * minimize - {Boolean}
+     */
+    showControls: function(minimize) {
+
+        this.maximizeDiv.style.display = minimize ? "" : "none";
+        this.minimizeDiv.style.display = minimize ? "none" : "";
+
+        this.layersDiv.style.display = minimize ? "none" : "";
+    },
+    
+    /** 
+     * Method: loadContents
+     * Set up the labels and divs for the control
+     */
+    loadContents: function() {
+
+        //configure main div
+
+        OpenLayers.Event.observe(this.div, "mouseup", 
+            OpenLayers.Function.bindAsEventListener(this.mouseUp, this));
+        OpenLayers.Event.observe(this.div, "click",
+                      this.ignoreEvent);
+        OpenLayers.Event.observe(this.div, "mousedown",
+            OpenLayers.Function.bindAsEventListener(this.mouseDown, this));
+        OpenLayers.Event.observe(this.div, "dblclick", this.ignoreEvent);
+
+        // layers list div        
+        this.layersDiv = document.createElement("div");
+        this.layersDiv.id = this.id + "_layersDiv";
+        OpenLayers.Element.addClass(this.layersDiv, "layersDiv");
+
+        this.baseLbl = document.createElement("div");
+        this.baseLbl.innerHTML = OpenLayers.i18n("baseLayer");
+        OpenLayers.Element.addClass(this.baseLbl, "baseLbl");
+        
+        this.baseLayersDiv = document.createElement("div");
+        OpenLayers.Element.addClass(this.baseLayersDiv, "baseLayersDiv");
+
+        this.dataLbl = document.createElement("div");
+        this.dataLbl.innerHTML = OpenLayers.i18n("overlays");
+        OpenLayers.Element.addClass(this.dataLbl, "dataLbl");
+        
+        this.dataLayersDiv = document.createElement("div");
+        OpenLayers.Element.addClass(this.dataLayersDiv, "dataLayersDiv");
+
+        if (this.ascending) {
+            this.layersDiv.appendChild(this.baseLbl);
+            this.layersDiv.appendChild(this.baseLayersDiv);
+            this.layersDiv.appendChild(this.dataLbl);
+            this.layersDiv.appendChild(this.dataLayersDiv);
+        } else {
+            this.layersDiv.appendChild(this.dataLbl);
+            this.layersDiv.appendChild(this.dataLayersDiv);
+            this.layersDiv.appendChild(this.baseLbl);
+            this.layersDiv.appendChild(this.baseLayersDiv);
+        }    
+ 
+        this.div.appendChild(this.layersDiv);
+
+        if(this.roundedCorner) {
+            OpenLayers.Rico.Corner.round(this.div, {
+                corners: "tl bl",
+                bgColor: "transparent",
+                color: this.roundedCornerColor,
+                blend: false
+            });
+            OpenLayers.Rico.Corner.changeOpacity(this.layersDiv, 0.75);
+        }
+
+        var imgLocation = OpenLayers.Util.getImagesLocation();
+        var sz = new OpenLayers.Size(18,18);        
+
+        // maximize button div
+        var img = imgLocation + 'layer-switcher-maximize.png';
+        this.maximizeDiv = OpenLayers.Util.createAlphaImageDiv(
+                                    "OpenLayers_Control_MaximizeDiv", 
+                                    null, 
+                                    sz, 
+                                    img, 
+                                    "absolute");
+        OpenLayers.Element.addClass(this.maximizeDiv, "maximizeDiv");
+        this.maximizeDiv.style.display = "none";
+        OpenLayers.Event.observe(this.maximizeDiv, "click", 
+            OpenLayers.Function.bindAsEventListener(this.maximizeControl, this)
+        );
+        
+        this.div.appendChild(this.maximizeDiv);
+
+        // minimize button div
+        var img = imgLocation + 'layer-switcher-minimize.png';
+        var sz = new OpenLayers.Size(18,18);        
+        this.minimizeDiv = OpenLayers.Util.createAlphaImageDiv(
+                                    "OpenLayers_Control_MinimizeDiv", 
+                                    null, 
+                                    sz, 
+                                    img, 
+                                    "absolute");
+        OpenLayers.Element.addClass(this.minimizeDiv, "minimizeDiv");
+        this.minimizeDiv.style.display = "none";
+        OpenLayers.Event.observe(this.minimizeDiv, "click", 
+            OpenLayers.Function.bindAsEventListener(this.minimizeControl, this)
+        );
+
+        this.div.appendChild(this.minimizeDiv);
+    },
+    
+    /** 
+     * Method: ignoreEvent
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    ignoreEvent: function(evt) {
+        OpenLayers.Event.stop(evt);
+    },
+
+    /** 
+     * Method: mouseDown
+     * Register a local 'mouseDown' flag so that we'll know whether or not
+     *     to ignore a mouseUp event
+     * 
+     * Parameters:
+     * evt - {Event}
+     */
+    mouseDown: function(evt) {
+        this.isMouseDown = true;
+        this.ignoreEvent(evt);
+    },
+
+    /** 
+     * Method: mouseUp
+     * If the 'isMouseDown' flag has been set, that means that the drag was 
+     *     started from within the LayerSwitcher control, and thus we can 
+     *     ignore the mouseup. Otherwise, let the Event continue.
+     *  
+     * Parameters:
+     * evt - {Event} 
+     */
+    mouseUp: function(evt) {
+        if (this.isMouseDown) {
+            this.isMouseDown = false;
+            this.ignoreEvent(evt);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.LayerSwitcher"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ArgParser.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ArgParser.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ArgParser.js	(revision 76)
@@ -0,0 +1,166 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ArgParser
+ * The ArgParser control adds location bar querystring parsing functionality 
+ * to an OpenLayers Map.
+ * When added to a Map control, on a page load/refresh, the Map will 
+ * automatically take the href string and parse it for lon, lat, zoom, and 
+ * layers information. 
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Parameter: center
+     * {<OpenLayers.LonLat>}
+     */
+    center: null,
+    
+    /**
+     * Parameter: zoom
+     * {int}
+     */
+    zoom: null,
+
+    /**
+     * Parameter: layers 
+     * {Array(<OpenLayers.Layer>)}
+     */
+    layers: null,
+    
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support. 
+     *     Projection used when reading the coordinates from the URL. This will
+     *
+     *     reproject the map coordinates from the URL into the map's
+     *     projection.
+     *
+     *     If you are using this functionality, be aware that any permalink
+     *     which is added to the map will determine the coordinate type which
+     *     is read from the URL, which means you should not add permalinks with
+     *     different displayProjections to the same map. 
+     */
+    displayProjection: null, 
+
+    /**
+     * Constructor: OpenLayers.Control.ArgParser
+     *
+     * Parameters:
+     * options - {Object}
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * Method: setMap
+     * Set the map property for the control. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+
+        //make sure we dont already have an arg parser attached
+        for(var i=0, len=this.map.controls.length; i<len; i++) {
+            var control = this.map.controls[i];
+            if ( (control != this) &&
+                 (control.CLASS_NAME == "OpenLayers.Control.ArgParser") ) {
+                
+                // If a second argparser is added to the map, then we 
+                // override the displayProjection to be the one added to the
+                // map. 
+                if (control.displayProjection != this.displayProjection) {
+                    this.displayProjection = control.displayProjection;
+                }    
+                
+                break;
+            }
+        }
+        if (i == this.map.controls.length) {
+
+            var args = OpenLayers.Util.getParameters();
+            // Be careful to set layer first, to not trigger unnecessary layer loads
+            if (args.layers) {
+                this.layers = args.layers;
+    
+                // when we add a new layer, set its visibility 
+                this.map.events.register('addlayer', this, 
+                                         this.configureLayers);
+                this.configureLayers();
+            }
+            if (args.lat && args.lon) {
+                this.center = new OpenLayers.LonLat(parseFloat(args.lon),
+                                                    parseFloat(args.lat));
+                if (args.zoom) {
+                    this.zoom = parseInt(args.zoom);
+                }
+    
+                // when we add a new baselayer to see when we can set the center
+                this.map.events.register('changebaselayer', this, 
+                                         this.setCenter);
+                this.setCenter();
+            }
+        }
+    },
+   
+    /** 
+     * Method: setCenter
+     * As soon as a baseLayer has been loaded, we center and zoom
+     *   ...and remove the handler.
+     */
+    setCenter: function() {
+        
+        if (this.map.baseLayer) {
+            //dont need to listen for this one anymore
+            this.map.events.unregister('changebaselayer', this, 
+                                       this.setCenter);
+            
+            if (this.displayProjection) {
+                this.center.transform(this.displayProjection, 
+                                      this.map.getProjectionObject()); 
+            }      
+
+            this.map.setCenter(this.center, this.zoom);
+        }
+    },
+
+    /** 
+     * Method: configureLayers
+     * As soon as all the layers are loaded, cycle through them and 
+     *   hide or show them. 
+     */
+    configureLayers: function() {
+
+        if (this.layers.length == this.map.layers.length) { 
+            this.map.events.unregister('addlayer', this, this.configureLayers);
+
+            for(var i=0, len=this.layers.length; i<len; i++) {
+                
+                var layer = this.map.layers[i];
+                var c = this.layers.charAt(i);
+                
+                if (c == "B") {
+                    this.map.setBaseLayer(layer);
+                } else if ( (c == "T") || (c == "F") ) {
+                    layer.setVisibility(c == "T");
+                }
+            }
+        }
+    },     
+
+    CLASS_NAME: "OpenLayers.Control.ArgParser"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Scale.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Scale.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Scale.js	(revision 76)
@@ -0,0 +1,99 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Scale
+ * The Scale control displays the current map scale as a ratio (e.g. Scale = 
+ * 1:1M). By default it is displayed in the lower right corner of the map.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Scale = OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * Parameter: element
+     * {DOMElement}
+     */
+    element: null,
+    
+    /**
+     * APIProperty: geodesic
+     * {Boolean} Use geodesic measurement. Default is false. The recommended
+     * setting for maps in EPSG:4326 is false, and true EPSG:900913. If set to
+     * true, the scale will be calculated based on the horizontal size of the
+     * pixel in the center of the map viewport.
+     */
+    geodesic: false,
+
+    /**
+     * Constructor: OpenLayers.Control.Scale
+     * 
+     * Parameters:
+     * element - {DOMElement} 
+     * options - {Object} 
+     */
+    initialize: function(element, options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.element = OpenLayers.Util.getElement(element);        
+    },
+
+    /**
+     * Method: draw
+     * 
+     * Returns:
+     * {DOMElement}
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        if (!this.element) {
+            this.element = document.createElement("div");
+            this.div.appendChild(this.element);
+        }
+        this.map.events.register( 'moveend', this, this.updateScale);
+        this.updateScale();
+        return this.div;
+    },
+   
+    /**
+     * Method: updateScale
+     */
+    updateScale: function() {
+        var scale;
+        if(this.geodesic === true) {
+            var units = this.map.getUnits();
+            if(!units) {
+                return;
+            }
+            var inches = OpenLayers.INCHES_PER_UNIT;
+            scale = (this.map.getGeodesicPixelSize().w || 0.000001) *
+                    inches["km"] * OpenLayers.DOTS_PER_INCH;
+        } else {
+            scale = this.map.getScale();
+        }
+            
+        if (!scale) {
+            return;
+        }
+
+        if (scale >= 9500 && scale <= 950000) {
+            scale = Math.round(scale / 1000) + "K";
+        } else if (scale >= 950000) {
+            scale = Math.round(scale / 1000000) + "M";
+        } else {
+            scale = Math.round(scale);
+        }    
+        
+        this.element.innerHTML = OpenLayers.i18n("scale", {'scaleDenom':scale});
+    }, 
+
+    CLASS_NAME: "OpenLayers.Control.Scale"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/KeyboardDefaults.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/KeyboardDefaults.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/KeyboardDefaults.js	(revision 76)
@@ -0,0 +1,127 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Keyboard.js
+ */
+
+/**
+ * Class: OpenLayers.Control.KeyboardDefaults
+ * The KeyboardDefaults control adds panning and zooming functions, controlled
+ * with the keyboard. By default arrow keys pan, +/- keys zoom & Page Up/Page
+ * Down/Home/End scroll by three quarters of a page.
+ * 
+ * This control has no visible appearance.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.KeyboardDefaults = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     true.
+     */
+    autoActivate: true,
+
+    /**
+     * APIProperty: slideFactor
+     * Pixels to slide by.
+     */
+    slideFactor: 75,
+
+    /**
+     * Constructor: OpenLayers.Control.KeyboardDefaults
+     */
+    initialize: function() {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        if (this.handler) {
+            this.handler.destroy();
+        }        
+        this.handler = null;
+        
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: draw
+     * Create handler.
+     */
+    draw: function() {
+        this.handler = new OpenLayers.Handler.Keyboard( this, { 
+                                "keydown": this.defaultKeyPress });
+    },
+    
+    /**
+     * Method: defaultKeyPress
+     * When handling the key event, we only use evt.keyCode. This holds 
+     * some drawbacks, though we get around them below. When interpretting
+     * the keycodes below (including the comments associated with them),
+     * consult the URL below. For instance, the Safari browser returns
+     * "IE keycodes", and so is supported by any keycode labeled "IE".
+     * 
+     * Very informative URL:
+     *    http://unixpapa.com/js/key.html
+     *
+     * Parameters:
+     * code - {Integer} 
+     */
+    defaultKeyPress: function (evt) {
+        switch(evt.keyCode) {
+            case OpenLayers.Event.KEY_LEFT:
+                this.map.pan(-this.slideFactor, 0);
+                break;
+            case OpenLayers.Event.KEY_RIGHT: 
+                this.map.pan(this.slideFactor, 0);
+                break;
+            case OpenLayers.Event.KEY_UP:
+                this.map.pan(0, -this.slideFactor);
+                break;
+            case OpenLayers.Event.KEY_DOWN:
+                this.map.pan(0, this.slideFactor);
+                break;
+            
+            case 33: // Page Up. Same in all browsers.
+                var size = this.map.getSize();
+                this.map.pan(0, -0.75*size.h);
+                break;
+            case 34: // Page Down. Same in all browsers.
+                var size = this.map.getSize();
+                this.map.pan(0, 0.75*size.h);
+                break; 
+            case 35: // End. Same in all browsers.
+                var size = this.map.getSize();
+                this.map.pan(0.75*size.w, 0);
+                break; 
+            case 36: // Home. Same in all browsers.
+                var size = this.map.getSize();
+                this.map.pan(-0.75*size.w, 0);
+                break; 
+
+            case 43:  // +/= (ASCII), keypad + (ASCII, Opera)
+            case 61:  // +/= (Mozilla, Opera, some ASCII)
+            case 187: // +/= (IE)
+            case 107: // keypad + (IE, Mozilla)
+                this.map.zoomIn();
+                break; 
+            case 45:  // -/_ (ASCII, Opera), keypad - (ASCII, Opera)
+            case 109: // -/_ (Mozilla), keypad - (Mozilla, IE)
+            case 189: // -/_ (IE)
+            case 95:  // -/_ (some ASCII)
+                this.map.zoomOut();
+                break; 
+        } 
+    },
+
+    CLASS_NAME: "OpenLayers.Control.KeyboardDefaults"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DragFeature.js	(revision 76)
@@ -0,0 +1,303 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Drag.js
+ * @requires OpenLayers/Handler/Feature.js
+ */
+
+/**
+ * Class: OpenLayers.Control.DragFeature
+ * The DragFeature control moves a feature with a drag of the mouse. Create a
+ * new control with the <OpenLayers.Control.DragFeature> constructor.
+ *
+ * Inherits From:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.DragFeature = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * APIProperty: geometryTypes
+     * {Array(String)} To restrict dragging to a limited set of geometry types,
+     *     send a list of strings corresponding to the geometry class names.
+     */
+    geometryTypes: null,
+    
+    /**
+     * APIProperty: onStart
+     * {Function} Define this function if you want to know when a drag starts.
+     *     The function should expect to receive two arguments: the feature
+     *     that is about to be dragged and the pixel location of the mouse.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature that is about to be
+     *     dragged.
+     * pixel - {<OpenLayers.Pixel>} The pixel location of the mouse.
+     */
+    onStart: function(feature, pixel) {},
+
+    /**
+     * APIProperty: onDrag
+     * {Function} Define this function if you want to know about each move of a
+     *     feature. The function should expect to receive two arguments: the
+     *     feature that is being dragged and the pixel location of the mouse.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature that was dragged.
+     * pixel - {<OpenLayers.Pixel>} The pixel location of the mouse.
+     */
+    onDrag: function(feature, pixel) {},
+
+    /**
+     * APIProperty: onComplete
+     * {Function} Define this function if you want to know when a feature is
+     *     done dragging. The function should expect to receive two arguments:
+     *     the feature that is being dragged and the pixel location of the
+     *     mouse.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature that was dragged.
+     * pixel - {<OpenLayers.Pixel>} The pixel location of the mouse.
+     */
+    onComplete: function(feature, pixel) {},
+
+    /**
+     * APIProperty: documentDrag
+     * {Boolean} If set to true, mouse dragging will continue even if the
+     *     mouse cursor leaves the map viewport. Default is false.
+     */
+    documentDrag: false,
+    
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>}
+     */
+    layer: null,
+    
+    /**
+     * Property: feature
+     * {<OpenLayers.Feature.Vector>}
+     */
+    feature: null,
+
+    /**
+     * Property: dragCallbacks
+     * {Object} The functions that are sent to the drag handler for callback.
+     */
+    dragCallbacks: {},
+
+    /**
+     * Property: featureCallbacks
+     * {Object} The functions that are sent to the feature handler for callback.
+     */
+    featureCallbacks: {},
+    
+    /**
+     * Property: lastPixel
+     * {<OpenLayers.Pixel>}
+     */
+    lastPixel: null,
+
+    /**
+     * Constructor: OpenLayers.Control.DragFeature
+     * Create a new control to drag features.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} The layer containing features to be
+     *     dragged.
+     * options - {Object} Optional object whose properties will be set on the
+     *     control.
+     */
+    initialize: function(layer, options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.layer = layer;
+        this.handlers = {
+            drag: new OpenLayers.Handler.Drag(
+                this, OpenLayers.Util.extend({
+                    down: this.downFeature,
+                    move: this.moveFeature,
+                    up: this.upFeature,
+                    out: this.cancel,
+                    done: this.doneDragging
+                }, this.dragCallbacks), {
+                    documentDrag: this.documentDrag
+                }
+            ),
+            feature: new OpenLayers.Handler.Feature(
+                this, this.layer, OpenLayers.Util.extend({
+                    over: this.overFeature,
+                    out: this.outFeature
+                }, this.featureCallbacks),
+                {geometryTypes: this.geometryTypes}
+            )
+        };
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Take care of things that are not handled in superclass
+     */
+    destroy: function() {
+        this.layer = null;
+        OpenLayers.Control.prototype.destroy.apply(this, []);
+    },
+
+    /**
+     * APIMethod: activate
+     * Activate the control and the feature handler.
+     * 
+     * Returns:
+     * {Boolean} Successfully activated the control and feature handler.
+     */
+    activate: function() {
+        return (this.handlers.feature.activate() &&
+                OpenLayers.Control.prototype.activate.apply(this, arguments));
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control and all handlers.
+     * 
+     * Returns:
+     * {Boolean} Successfully deactivated the control.
+     */
+    deactivate: function() {
+        // the return from the handlers is unimportant in this case
+        this.handlers.drag.deactivate();
+        this.handlers.feature.deactivate();
+        this.feature = null;
+        this.dragging = false;
+        this.lastPixel = null;
+        OpenLayers.Element.removeClass(
+            this.map.viewPortDiv, this.displayClass + "Over"
+        );
+        return OpenLayers.Control.prototype.deactivate.apply(this, arguments);
+    },
+
+    /**
+     * Method: overFeature
+     * Called when the feature handler detects a mouse-over on a feature.
+     *     This activates the drag handler.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The selected feature.
+     */
+    overFeature: function(feature) {
+        if(!this.handlers.drag.dragging) {
+            this.feature = feature;
+            this.handlers.drag.activate();
+            this.over = true;
+            OpenLayers.Element.addClass(this.map.viewPortDiv, this.displayClass + "Over");
+        } else {
+            if(this.feature.id == feature.id) {
+                this.over = true;
+            } else {
+                this.over = false;
+            }
+        }
+    },
+
+    /**
+     * Method: downFeature
+     * Called when the drag handler detects a mouse-down.
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} Location of the mouse event.
+     */
+    downFeature: function(pixel) {
+        this.lastPixel = pixel;
+        this.onStart(this.feature, pixel);
+    },
+
+    /**
+     * Method: moveFeature
+     * Called when the drag handler detects a mouse-move.  Also calls the
+     *     optional onDrag method.
+     * 
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} Location of the mouse event.
+     */
+    moveFeature: function(pixel) {
+        var res = this.map.getResolution();
+        this.feature.geometry.move(res * (pixel.x - this.lastPixel.x),
+                                   res * (this.lastPixel.y - pixel.y));
+        this.layer.drawFeature(this.feature);
+        this.lastPixel = pixel;
+        this.onDrag(this.feature, pixel);
+    },
+
+    /**
+     * Method: upFeature
+     * Called when the drag handler detects a mouse-up.
+     * 
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} Location of the mouse event.
+     */
+    upFeature: function(pixel) {
+        if(!this.over) {
+            this.handlers.drag.deactivate();
+        }
+    },
+
+    /**
+     * Method: doneDragging
+     * Called when the drag handler is done dragging.
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} The last event pixel location.  If this event
+     *     came from a mouseout, this may not be in the map viewport.
+     */
+    doneDragging: function(pixel) {
+        this.onComplete(this.feature, pixel);
+    },
+
+    /**
+     * Method: outFeature
+     * Called when the feature handler detects a mouse-out on a feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature that the mouse left.
+     */
+    outFeature: function(feature) {
+        if(!this.handlers.drag.dragging) {
+            this.over = false;
+            this.handlers.drag.deactivate();
+            OpenLayers.Element.removeClass(
+                this.map.viewPortDiv, this.displayClass + "Over"
+            );
+            this.feature = null;
+        } else {
+            if(this.feature.id == feature.id) {
+                this.over = false;
+            }
+        }
+    },
+        
+    /**
+     * Method: cancel
+     * Called when the drag handler detects a mouse-out (from the map viewport).
+     */
+    cancel: function() {
+        this.handlers.drag.deactivate();
+        this.over = false;
+    },
+
+    /**
+     * Method: setMap
+     * Set the map property for the control and all handlers.
+     *
+     * Parameters: 
+     * map - {<OpenLayers.Map>} The control's map.
+     */
+    setMap: function(map) {
+        this.handlers.drag.setMap(map);
+        this.handlers.feature.setMap(map);
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.DragFeature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SelectFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SelectFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SelectFeature.js	(revision 76)
@@ -0,0 +1,613 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Handler/Feature.js
+ * @requires OpenLayers/Layer/Vector/RootContainer.js
+ */
+
+/**
+ * Class: OpenLayers.Control.SelectFeature
+ * The SelectFeature control selects vector features from a given layer on 
+ * click or hover. 
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.SelectFeature = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types:
+     *  - *beforefeaturehighlighted* Triggered before a feature is highlighted
+     *  - *featurehighlighted* Triggered when a feature is highlighted
+     *  - *featureunhighlighted* Triggered when a feature is unhighlighted
+     */
+    EVENT_TYPES: ["beforefeaturehighlighted", "featurehighlighted", "featureunhighlighted"],
+    
+    /**
+     * Property: multipleKey
+     * {String} An event modifier ('altKey' or 'shiftKey') that temporarily sets
+     *     the <multiple> property to true.  Default is null.
+     */
+    multipleKey: null,
+    
+    /**
+     * Property: toggleKey
+     * {String} An event modifier ('altKey' or 'shiftKey') that temporarily sets
+     *     the <toggle> property to true.  Default is null.
+     */
+    toggleKey: null,
+    
+    /**
+     * APIProperty: multiple
+     * {Boolean} Allow selection of multiple geometries.  Default is false.
+     */
+    multiple: false, 
+
+    /**
+     * APIProperty: clickout
+     * {Boolean} Unselect features when clicking outside any feature.
+     *     Default is true.
+     */
+    clickout: true,
+
+    /**
+     * APIProperty: toggle
+     * {Boolean} Unselect a selected feature on click.  Default is false.  Only
+     *     has meaning if hover is false.
+     */
+    toggle: false,
+
+    /**
+     * APIProperty: hover
+     * {Boolean} Select on mouse over and deselect on mouse out.  If true, this
+     * ignores clicks and only listens to mouse moves.
+     */
+    hover: false,
+
+    /**
+     * APIProperty: highlightOnly
+     * {Boolean} If true do not actually select features (i.e. place them in the
+     * layer's selected features array), just highlight them. This property has
+     * no effect if hover is false. Defaults to false.
+     */
+    highlightOnly: false,
+    
+    /**
+     * APIProperty: box
+     * {Boolean} Allow feature selection by drawing a box.
+     */
+    box: false,
+    
+    /**
+     * Property: onBeforeSelect 
+     * {Function} Optional function to be called before a feature is selected.
+     *     The function should expect to be called with a feature.
+     */
+    onBeforeSelect: function() {},
+    
+    /**
+     * APIProperty: onSelect 
+     * {Function} Optional function to be called when a feature is selected.
+     *     The function should expect to be called with a feature.
+     */
+    onSelect: function() {},
+
+    /**
+     * APIProperty: onUnselect
+     * {Function} Optional function to be called when a feature is unselected.
+     *     The function should expect to be called with a feature.
+     */
+    onUnselect: function() {},
+    
+    /**
+     * Property: scope
+     * {Object} The scope to use with the onBeforeSelect, onSelect, onUnselect
+     *     callbacks. If null the scope will be this control.
+     */
+    scope: null,
+
+    /**
+     * APIProperty: geometryTypes
+     * {Array(String)} To restrict selecting to a limited set of geometry types,
+     *     send a list of strings corresponding to the geometry class names.
+     */
+    geometryTypes: null,
+
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>} The vector layer with a common renderer
+     * root for all layers this control is configured with (if an array of
+     * layers was passed to the constructor), or the vector layer the control
+     * was configured with (if a single layer was passed to the constructor).
+     */
+    layer: null,
+    
+    /**
+     * Property: layers
+     * {Array(<OpenLayers.Layer.Vector>} The layers this control will work on,
+     * or null if the control was configured with a single layer
+     */
+    layers: null,
+    
+    /**
+     * APIProperty: callbacks
+     * {Object} The functions that are sent to the handlers.feature for callback
+     */
+    callbacks: null,
+    
+    /**
+     * APIProperty: selectStyle 
+     * {Object} Hash of styles
+     */
+    selectStyle: null,
+    
+    /**
+     * Property: renderIntent
+     * {String} key used to retrieve the select style from the layer's
+     * style map.
+     */
+    renderIntent: "select",
+
+    /**
+     * Property: handlers
+     * {Object} Object with references to multiple <OpenLayers.Handler>
+     *     instances.
+     */
+    handlers: null,
+
+    /**
+     * Constructor: OpenLayers.Control.SelectFeature
+     * Create a new control for selecting features.
+     *
+     * Parameters:
+     * layers - {<OpenLayers.Layer.Vector>}, or an array of vector layers. The
+     *     layer(s) this control will select features from.
+     * options - {Object} 
+     */
+    initialize: function(layers, options) {
+        // concatenate events specific to this control with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.SelectFeature.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        if(this.scope === null) {
+            this.scope = this;
+        }
+        this.initLayer(layers);
+        var callbacks = {
+            click: this.clickFeature,
+            clickout: this.clickoutFeature
+        };
+        if (this.hover) {
+            callbacks.over = this.overFeature;
+            callbacks.out = this.outFeature;
+        }
+             
+        this.callbacks = OpenLayers.Util.extend(callbacks, this.callbacks);
+        this.handlers = {
+            feature: new OpenLayers.Handler.Feature(
+                this, this.layer, this.callbacks,
+                {geometryTypes: this.geometryTypes}
+            )
+        };
+
+        if (this.box) {
+            this.handlers.box = new OpenLayers.Handler.Box(
+                this, {done: this.selectBox},
+                {boxDivClassName: "olHandlerBoxSelectFeature"}
+            ); 
+        }
+    },
+
+    /**
+     * Method: initLayer
+     * Assign the layer property. If layers is an array, we need to use
+     *     a RootContainer.
+     *
+     * Parameters:
+     * layers - {<OpenLayers.Layer.Vector>}, or an array of vector layers.
+     */
+    initLayer: function(layers) {
+        if(layers instanceof Array) {
+            this.layers = layers;
+            this.layer = new OpenLayers.Layer.Vector.RootContainer(
+                this.id + "_container", {
+                    layers: layers
+                }
+            );
+        } else {
+            this.layer = layers;
+        }
+    },
+    
+    /**
+     * Method: destroy
+     */
+    destroy: function() {
+        if(this.active && this.layers) {
+            this.map.removeLayer(this.layer);
+        }
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+        if(this.layers) {
+            this.layer.destroy();
+        }
+    },
+
+    /**
+     * Method: activate
+     * Activates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively activated.
+     */
+    activate: function () {
+        if (!this.active) {
+            if(this.layers) {
+                this.map.addLayer(this.layer);
+            }
+            this.handlers.feature.activate();
+            if(this.box && this.handlers.box) {
+                this.handlers.box.activate();
+            }
+        }
+        return OpenLayers.Control.prototype.activate.apply(
+            this, arguments
+        );
+    },
+
+    /**
+     * Method: deactivate
+     * Deactivates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively deactivated.
+     */
+    deactivate: function () {
+        if (this.active) {
+            this.handlers.feature.deactivate();
+            if(this.handlers.box) {
+                this.handlers.box.deactivate();
+            }
+            if(this.layers) {
+                this.map.removeLayer(this.layer);
+            }
+        }
+        return OpenLayers.Control.prototype.deactivate.apply(
+            this, arguments
+        );
+    },
+
+    /**
+     * Method: unselectAll
+     * Unselect all selected features.  To unselect all except for a single
+     *     feature, set the options.except property to the feature.
+     *
+     * Parameters:
+     * options - {Object} Optional configuration object.
+     */
+    unselectAll: function(options) {
+        // we'll want an option to supress notification here
+        var layers = this.layers || [this.layer];
+        var layer, feature;
+        for(var l=0; l<layers.length; ++l) {
+            layer = layers[l];
+            for(var i=layer.selectedFeatures.length-1; i>=0; --i) {
+                feature = layer.selectedFeatures[i];
+                if(!options || options.except != feature) {
+                    this.unselect(feature);
+                }
+            }
+        }
+    },
+
+    /**
+     * Method: clickFeature
+     * Called on click in a feature
+     * Only responds if this.hover is false.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    clickFeature: function(feature) {
+        if(!this.hover) {
+            var selected = (OpenLayers.Util.indexOf(
+                feature.layer.selectedFeatures, feature) > -1);
+            if(selected) {
+                if(this.toggleSelect()) {
+                    this.unselect(feature);
+                } else if(!this.multipleSelect()) {
+                    this.unselectAll({except: feature});
+                }
+            } else {
+                if(!this.multipleSelect()) {
+                    this.unselectAll({except: feature});
+                }
+                this.select(feature);
+            }
+        }
+    },
+
+    /**
+     * Method: multipleSelect
+     * Allow for multiple selected features based on <multiple> property and
+     *     <multipleKey> event modifier.
+     *
+     * Returns:
+     * {Boolean} Allow for multiple selected features.
+     */
+    multipleSelect: function() {
+        return this.multiple || (this.handlers.feature.evt &&
+                                 this.handlers.feature.evt[this.multipleKey]);
+    },
+    
+    /**
+     * Method: toggleSelect
+     * Event should toggle the selected state of a feature based on <toggle>
+     *     property and <toggleKey> event modifier.
+     *
+     * Returns:
+     * {Boolean} Toggle the selected state of a feature.
+     */
+    toggleSelect: function() {
+        return this.toggle || (this.handlers.feature.evt &&
+                               this.handlers.feature.evt[this.toggleKey]);
+    },
+
+    /**
+     * Method: clickoutFeature
+     * Called on click outside a previously clicked (selected) feature.
+     * Only responds if this.hover is false.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Vector.Feature>} 
+     */
+    clickoutFeature: function(feature) {
+        if(!this.hover && this.clickout) {
+            this.unselectAll();
+        }
+    },
+
+    /**
+     * Method: overFeature
+     * Called on over a feature.
+     * Only responds if this.hover is true.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    overFeature: function(feature) {
+        var layer = feature.layer;
+        if(this.hover) {
+            if(this.highlightOnly) {
+                this.highlight(feature);
+            } else if(OpenLayers.Util.indexOf(
+                layer.selectedFeatures, feature) == -1) {
+                this.select(feature);
+            }
+        }
+    },
+
+    /**
+     * Method: outFeature
+     * Called on out of a selected feature.
+     * Only responds if this.hover is true.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    outFeature: function(feature) {
+        if(this.hover) {
+            if(this.highlightOnly) {
+                // we do nothing if we're not the last highlighter of the
+                // feature
+                if(feature._lastHighlighter == this.id) {
+                    // if another select control had highlighted the feature before
+                    // we did it ourself then we use that control to highlight the
+                    // feature as it was before we highlighted it, else we just
+                    // unhighlight it
+                    if(feature._prevHighlighter &&
+                       feature._prevHighlighter != this.id) {
+                        delete feature._lastHighlighter;
+                        var control = this.map.getControl(
+                            feature._prevHighlighter);
+                        if(control) {
+                            control.highlight(feature);
+                        }
+                    } else {
+                        this.unhighlight(feature);
+                    }
+                }
+            } else {
+                this.unselect(feature);
+            }
+        }
+    },
+
+    /**
+     * Method: highlight
+     * Redraw feature with the select style.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    highlight: function(feature) {
+        var layer = feature.layer;
+        var cont = this.events.triggerEvent("beforefeaturehighlighted", {
+            feature : feature
+        });
+        if(cont !== false) {
+            feature._prevHighlighter = feature._lastHighlighter;
+            feature._lastHighlighter = this.id;
+            var style = this.selectStyle || this.renderIntent;
+            layer.drawFeature(feature, style);
+            this.events.triggerEvent("featurehighlighted", {feature : feature});
+        }
+    },
+
+    /**
+     * Method: unhighlight
+     * Redraw feature with the "default" style
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    unhighlight: function(feature) {
+        var layer = feature.layer;
+        feature._lastHighlighter = feature._prevHighlighter;
+        delete feature._prevHighlighter;
+        layer.drawFeature(feature, feature.style || feature.layer.style ||
+            "default");
+        this.events.triggerEvent("featureunhighlighted", {feature : feature});
+    },
+    
+    /**
+     * Method: select
+     * Add feature to the layer's selectedFeature array, render the feature as
+     * selected, and call the onSelect function.
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    select: function(feature) {
+        var cont = this.onBeforeSelect.call(this.scope, feature);
+        var layer = feature.layer;
+        if(cont !== false) {
+            cont = layer.events.triggerEvent("beforefeatureselected", {
+                feature: feature
+            });
+            if(cont !== false) {
+                layer.selectedFeatures.push(feature);
+                this.highlight(feature);
+                // if the feature handler isn't involved in the feature
+                // selection (because the box handler is used or the
+                // feature is selected programatically) we fake the
+                // feature handler to allow unselecting on click
+                if(!this.handlers.feature.lastFeature) {
+                    this.handlers.feature.lastFeature = layer.selectedFeatures[0];
+                }
+                layer.events.triggerEvent("featureselected", {feature: feature});
+                this.onSelect.call(this.scope, feature);
+            }
+        }
+    },
+
+    /**
+     * Method: unselect
+     * Remove feature from the layer's selectedFeature array, render the feature as
+     * normal, and call the onUnselect function.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     */
+    unselect: function(feature) {
+        var layer = feature.layer;
+        // Store feature style for restoration later
+        this.unhighlight(feature);
+        OpenLayers.Util.removeItem(layer.selectedFeatures, feature);
+        layer.events.triggerEvent("featureunselected", {feature: feature});
+        this.onUnselect.call(this.scope, feature);
+    },
+    
+    /**
+     * Method: selectBox
+     * Callback from the handlers.box set up when <box> selection is true
+     *     on.
+     *
+     * Parameters:
+     * position - {<OpenLayers.Bounds> || <OpenLayers.Pixel> }  
+     */
+    selectBox: function(position) {
+        if (position instanceof OpenLayers.Bounds) {
+            var minXY = this.map.getLonLatFromPixel(
+                new OpenLayers.Pixel(position.left, position.bottom)
+            );
+            var maxXY = this.map.getLonLatFromPixel(
+                new OpenLayers.Pixel(position.right, position.top)
+            );
+            var bounds = new OpenLayers.Bounds(
+                minXY.lon, minXY.lat, maxXY.lon, maxXY.lat
+            );
+            
+            // if multiple is false, first deselect currently selected features
+            if (!this.multipleSelect()) {
+                this.unselectAll();
+            }
+            
+            // because we're using a box, we consider we want multiple selection
+            var prevMultiple = this.multiple;
+            this.multiple = true;
+            var layers = this.layers || [this.layer];
+            var layer;
+            for(var l=0; l<layers.length; ++l) {
+                layer = layers[l];
+                for(var i=0, len = layer.features.length; i<len; ++i) {
+                    var feature = layer.features[i];
+                    // check if the feature is displayed
+                    if (!feature.getVisibility()) {
+                        continue;
+                    }
+
+                    if (this.geometryTypes == null || OpenLayers.Util.indexOf(
+                            this.geometryTypes, feature.geometry.CLASS_NAME) > -1) {
+                        if (bounds.toGeometry().intersects(feature.geometry)) {
+                            if (OpenLayers.Util.indexOf(layer.selectedFeatures, feature) == -1) {
+                                this.select(feature);
+                            }
+                        }
+                    }
+                }
+            }
+            this.multiple = prevMultiple;
+        }
+    },
+
+    /** 
+     * Method: setMap
+     * Set the map property for the control. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        this.handlers.feature.setMap(map);
+        if (this.box) {
+            this.handlers.box.setMap(map);
+        }
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+    
+    /**
+     * APIMethod: setLayer
+     * Attach a new layer to the control, overriding any existing layers.
+     *
+     * Parameters:
+     * layers - Array of {<OpenLayers.Layer.Vector>} or a single
+     *     {<OpenLayers.Layer.Vector>}
+     */
+    setLayer: function(layers) {
+        var isActive = this.active;
+        this.unselectAll();
+        this.deactivate();
+        if(this.layers) {
+            this.layer.destroy();
+            this.layers = null;
+        }
+        this.initLayer(layers);
+        this.handlers.feature.layer = this.layer;
+        if (isActive) {
+            this.activate();
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.SelectFeature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMSGetFeatureInfo.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMSGetFeatureInfo.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMSGetFeatureInfo.js	(revision 76)
@@ -0,0 +1,524 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Click.js
+ * @requires OpenLayers/Handler/Hover.js
+ * @requires OpenLayers/Request.js
+ */
+
+/**
+ * Class: OpenLayers.Control.WMSGetFeatureInfo
+ * The WMSGetFeatureInfo control uses a WMS query to get information about a point on the map.  The
+ * information may be in a display-friendly format such as HTML, or a machine-friendly format such 
+ * as GML, depending on the server's capabilities and the client's configuration.  This control 
+ * handles click or hover events, attempts to parse the results using an OpenLayers.Format, and 
+ * fires a 'getfeatureinfo' event with the click position, the raw body of the response, and an 
+ * array of features if it successfully read the response.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.WMSGetFeatureInfo = OpenLayers.Class(OpenLayers.Control, {
+
+   /**
+     * APIProperty: hover
+     * {Boolean} Send GetFeatureInfo requests when mouse stops moving.
+     *     Default is false.
+     */
+    hover: false,
+
+    /**
+     * APIProperty: drillDown
+     * {Boolean} Drill down over all WMS layers in the map. When
+     *     using drillDown mode, hover is not possible, and an infoFormat that
+     *     returns parseable features is required. Default is false.
+     */
+    drillDown: false,
+
+    /**
+     * APIProperty: maxFeatures
+     * {Integer} Maximum number of features to return from a WMS query. This
+     *     sets the feature_count parameter on WMS GetFeatureInfo
+     *     requests.
+     */
+    maxFeatures: 10,
+
+    /** APIProperty: clickCallback
+     *  {String} The click callback to register in the
+     *      {<OpenLayers.Handler.Click>} object created when the hover
+     *      option is set to false. Default is "click".
+     */
+    clickCallback: "click",
+    
+    /**
+     * Property: layers
+     * {Array(<OpenLayers.Layer.WMS>)} The layers to query for feature info.
+     *     If omitted, all map WMS layers with a url that matches this <url> or
+     *     <layerUrls> will be considered.
+     */
+    layers: null,
+
+    /**
+     * Property: queryVisible
+     * {Boolean} If true, filter out hidden layers when searching the map for
+     *     layers to query.  Default is false.
+     */
+    queryVisible: false,
+
+    /**
+     * Property: url
+     * {String} The URL of the WMS service to use.  If not provided, the url
+     *     of the first eligible layer will be used.
+     */
+    url: null,
+    
+    /**
+     * Property: layerUrls
+     * {Array(String)} Optional list of urls for layers that should be queried.
+     *     This can be used when the layer url differs from the url used for
+     *     making GetFeatureInfo requests (in the case of a layer using cached
+     *     tiles).
+     */
+    layerUrls: null,
+
+    /**
+     * Property: infoFormat
+     * {String} The mimetype to request from the server
+     */
+    infoFormat: 'text/html',
+    
+    /**
+     * Property: vendorParams
+     * {Object} Additional parameters that will be added to the request, for
+     * WMS implementations that support them. This could e.g. look like
+     * (start code)
+     * {
+     *     radius: 5
+     * }
+     * (end)
+     */
+    vendorParams: {},
+    
+    /**
+     * Property: format
+     * {<OpenLayers.Format>} A format for parsing GetFeatureInfo responses.
+     *     Default is <OpenLayers.Format.WMSGetFeatureInfo>.
+     */
+    format: null,
+    
+    /**
+     * Property: formatOptions
+     * {Object} Optional properties to set on the format (if one is not provided
+     *     in the <format> property.
+     */
+    formatOptions: null,
+
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Additional options for the handlers used by this control, e.g.
+     * (start code)
+     * {
+     *     "click": {delay: 100},
+     *     "hover": {delay: 300}
+     * }
+     * (end)
+     */
+    handlerOptions: null,
+    
+    /**
+     * Property: handler
+     * {Object} Reference to the <OpenLayers.Handler> for this control
+     */
+    handler: null,
+    
+    /**
+     * Property: hoverRequest
+     * {<OpenLayers.Request>} contains the currently running hover request
+     *     (if any).
+     */
+    hoverRequest: null,
+    
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types (in addition to those from <OpenLayers.Control>):
+     * beforegetfeatureinfo - Triggered before the request is sent.
+     *      The event object has an *xy* property with the position of the 
+     *      mouse click or hover event that triggers the request.
+     * nogetfeatureinfo - no queryable layers were found.
+     * getfeatureinfo - Triggered when a GetFeatureInfo response is received.
+     *      The event object has a *text* property with the body of the
+     *      response (String), a *features* property with an array of the
+     *      parsed features, an *xy* property with the position of the mouse
+     *      click or hover event that triggered the request, and a *request*
+     *      property with the request itself. If drillDown is set to true and
+     *      multiple requests were issued to collect feature info from all
+     *      layers, *text* and *request* will only contain the response body
+     *      and request object of the last request.
+     */
+    EVENT_TYPES: ["beforegetfeatureinfo", "nogetfeatureinfo", "getfeatureinfo"],
+
+    /**
+     * Constructor: <OpenLayers.Control.WMSGetFeatureInfo>
+     *
+     * Parameters:
+     * options - {Object} 
+     */
+    initialize: function(options) {
+        // concatenate events specific to vector with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.WMSGetFeatureInfo.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+
+        options = options || {};
+        options.handlerOptions = options.handlerOptions || {};
+
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        if(!this.format) {
+            this.format = new OpenLayers.Format.WMSGetFeatureInfo(
+                options.formatOptions
+            );
+        }
+        
+        if(this.drillDown === true) {
+            this.hover = false;
+        }
+
+        if(this.hover) {
+            this.handler = new OpenLayers.Handler.Hover(
+                   this, {
+                       'move': this.cancelHover,
+                       'pause': this.getInfoForHover
+                   },
+                   OpenLayers.Util.extend(this.handlerOptions.hover || {}, {
+                       'delay': 250
+                   }));
+        } else {
+            var callbacks = {};
+            callbacks[this.clickCallback] = this.getInfoForClick;
+            this.handler = new OpenLayers.Handler.Click(
+                this, callbacks, this.handlerOptions.click || {});
+        }
+    },
+
+    /**
+     * Method: activate
+     * Activates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively activated.
+     */
+    activate: function () {
+        if (!this.active) {
+            this.handler.activate();
+        }
+        return OpenLayers.Control.prototype.activate.apply(
+            this, arguments
+        );
+    },
+
+    /**
+     * Method: deactivate
+     * Deactivates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively deactivated.
+     */
+    deactivate: function () {
+        return OpenLayers.Control.prototype.deactivate.apply(
+            this, arguments
+        );
+    },
+    
+    /**
+     * Method: getInfoForClick 
+     * Called on click
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    getInfoForClick: function(evt) {
+        this.events.triggerEvent("beforegetfeatureinfo", {xy: evt.xy});
+        // Set the cursor to "wait" to tell the user we're working on their
+        // click.
+        OpenLayers.Element.addClass(this.map.viewPortDiv, "olCursorWait");
+        this.request(evt.xy, {});
+    },
+   
+    /**
+     * Method: getInfoForHover
+     * Pause callback for the hover handler
+     *
+     * Parameters:
+     * evt - {Object}
+     */
+    getInfoForHover: function(evt) {
+        this.events.triggerEvent("beforegetfeatureinfo", {xy: evt.xy});
+        this.request(evt.xy, {hover: true});
+    },
+
+    /**
+     * Method: cancelHover
+     * Cancel callback for the hover handler
+     */
+    cancelHover: function() {
+        if (this.hoverRequest) {
+            this.hoverRequest.abort();
+            this.hoverRequest = null;
+        }
+    },
+
+    /**
+     * Method: findLayers
+     * Internal method to get the layers, independent of whether we are
+     *     inspecting the map or using a client-provided array
+     */
+    findLayers: function() {
+
+        var candidates = this.layers || this.map.layers;
+        var layers = [];
+        var layer, url;
+        for(var i=0, len=candidates.length; i<len; ++i) {
+            layer = candidates[i];
+            if(layer instanceof OpenLayers.Layer.WMS &&
+               (!this.queryVisible || layer.getVisibility())) {
+                url = layer.url instanceof Array ? layer.url[0] : layer.url;
+                // if the control was not configured with a url, set it
+                // to the first layer url
+                if(this.drillDown === false && !this.url) {
+                    this.url = url;
+                }
+                if(this.drillDown === true || this.urlMatches(url)) {
+                    layers.push(layer);
+                }
+            }
+        }
+        return layers;
+    },
+    
+    /**
+     * Method: urlMatches
+     * Test to see if the provided url matches either the control <url> or one
+     *     of the <layerUrls>.
+     *
+     * Parameters:
+     * url - {String} The url to test.
+     *
+     * Returns:
+     * {Boolean} The provided url matches the control <url> or one of the
+     *     <layerUrls>.
+     */
+    urlMatches: function(url) {
+        var matches = OpenLayers.Util.isEquivalentUrl(this.url, url);
+        if(!matches && this.layerUrls) {
+            for(var i=0, len=this.layerUrls.length; i<len; ++i) {
+                if(OpenLayers.Util.isEquivalentUrl(this.layerUrls[i], url)) {
+                    matches = true;
+                    break;
+                }
+            }
+        }
+        return matches;
+    },
+
+    /**
+     * Method: buildWMSOptions
+     * Build an object with the relevant WMS options for the GetFeatureInfo request
+     *
+     * Parameters:
+     * url - {String} The url to be used for sending the request
+     * layers - {Array(<OpenLayers.Layer.WMS)} An array of layers
+     * clickPosition - {<OpenLayers.Pixel>} The position on the map where the mouse
+     *     event occurred.
+     * format - {String} The format from the corresponding GetMap request
+     */
+    buildWMSOptions: function(url, layers, clickPosition, format) {
+        var layerNames = [], styleNames = [];
+        for (var i = 0, len = layers.length; i < len; i++) { 
+            layerNames = layerNames.concat(layers[i].params.LAYERS);
+            styleNames = styleNames.concat(this.getStyleNames(layers[i]));
+        }
+        var params = OpenLayers.Util.extend({
+            service: "WMS",
+            version: layers[0].params.VERSION,
+            request: "GetFeatureInfo",
+            layers: layerNames,
+            query_layers: layerNames,
+            styles: styleNames,
+            bbox: this.map.getExtent().toBBOX(null,
+                layers[0].reverseAxisOrder()),
+            feature_count: this.maxFeatures,
+            height: this.map.getSize().h,
+            width: this.map.getSize().w,
+            format: format,
+            info_format: this.infoFormat
+        }, (parseFloat(layers[0].params.VERSION) >= 1.3) ?
+            {
+                crs: this.map.getProjection(),
+                i: clickPosition.x,
+                j: clickPosition.y
+            } :
+            {
+                srs: this.map.getProjection(),
+                x: clickPosition.x,
+                y: clickPosition.y
+            }
+        );
+        OpenLayers.Util.applyDefaults(params, this.vendorParams);
+        return {
+            url: url,
+            params: OpenLayers.Util.upperCaseObject(params),
+            callback: function(request) {
+                this.handleResponse(clickPosition, request);
+            },
+            scope: this
+        };
+    },
+
+    /**
+     * Method: getStyleNames
+     * Gets the STYLES parameter for the layer. Make sure the STYLES parameter
+     * matches the LAYERS parameter
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer.WMS>}
+     *
+     * Returns:
+     * {Array(String)} The STYLES parameter
+     */
+    getStyleNames: function(layer) {
+        // in the event of a WMS layer bundling multiple layers but not
+        // specifying styles,we need the same number of commas to specify
+        // the default style for each of the layers.  We can't just leave it
+        // blank as we may be including other layers that do specify styles.
+        var styleNames;
+        if (layer.params.STYLES) {
+            styleNames = layer.params.STYLES;
+        } else {
+            if (layer.params.LAYERS instanceof Array) {
+                styleNames = new Array(layer.params.LAYERS.length);
+            } else { // Assume it's a String
+                styleNames = layer.params.LAYERS.replace(/[^,]/g, "");
+            }
+        }
+        return styleNames;
+    },
+
+    /**
+     * Method: request
+     * Sends a GetFeatureInfo request to the WMS
+     * 
+     * Parameters:
+     * clickPosition - {<OpenLayers.Pixel>} The position on the map where the
+     *     mouse event occurred.
+     * options - {Object} additional options for this method.
+     * 
+     * Valid options:
+     * - *hover* {Boolean} true if we do the request for the hover handler
+     */
+    request: function(clickPosition, options) {
+        var layers = this.findLayers();
+        if(layers.length == 0) {
+            this.events.triggerEvent("nogetfeatureinfo");
+            // Reset the cursor.
+            OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+            return;
+        }
+        
+        options = options || {};
+        if(this.drillDown === false) {
+            var wmsOptions = this.buildWMSOptions(this.url, layers,
+                clickPosition, layers[0].params.FORMAT); 
+            var request = OpenLayers.Request.GET(wmsOptions);
+    
+            if (options.hover === true) {
+                this.hoverRequest = request;
+            }
+        } else {
+            this._requestCount = 0;
+            this._numRequests = 0;
+            this.features = [];
+            // group according to service url to combine requests
+            var services = {}, url;
+            for(var i=0, len=layers.length; i<len; i++) {
+                var layer = layers[i];
+                var service, found = false;
+                url = layer.url instanceof Array ? layer.url[0] : layer.url;
+                if(url in services) {
+                    services[url].push(layer);
+                } else {
+                    this._numRequests++;
+                    services[url] = [layer];
+                }
+            }
+            var layers;
+            for (var url in services) {
+                layers = services[url];
+                var wmsOptions = this.buildWMSOptions(url, layers, 
+                    clickPosition, layers[0].params.FORMAT);
+                OpenLayers.Request.GET(wmsOptions); 
+            }
+        }
+    },
+
+    /**
+     * Method: triggerGetFeatureInfo
+     * Trigger the getfeatureinfo event when all is done
+     *
+     * Parameters:
+     * request - {XMLHttpRequest} The request object
+     * xy - {<OpenLayers.Pixel>} The position on the map where the
+     *     mouse event occurred.
+     * features - {Array(<OpenLayers.Feature.Vector>)}
+     */
+    triggerGetFeatureInfo: function(request, xy, features) {
+        this.events.triggerEvent("getfeatureinfo", {
+            text: request.responseText,
+            features: features,
+            request: request,
+            xy: xy
+        });
+
+        // Reset the cursor.
+        OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+    },
+    
+    /**
+     * Method: handleResponse
+     * Handler for the GetFeatureInfo response.
+     * 
+     * Parameters:
+     * xy - {<OpenLayers.Pixel>} The position on the map where the
+     *     mouse event occurred.
+     * request - {XMLHttpRequest} The request object.
+     */
+    handleResponse: function(xy, request) {
+        
+        var doc = request.responseXML;
+        if(!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        var features = this.format.read(doc);
+        if (this.drillDown === false) {
+            this.triggerGetFeatureInfo(request, xy, features);
+        } else {
+            this._requestCount++;
+            this._features = (this._features || []).concat(features);
+            if (this._requestCount === this._numRequests) {
+                this.triggerGetFeatureInfo(request, xy, this._features.concat()); 
+                delete this._features;
+                delete this._requestCount;
+                delete this._numRequests;
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.WMSGetFeatureInfo"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Navigation.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Navigation.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Navigation.js	(revision 76)
@@ -0,0 +1,303 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/ZoomBox.js
+ * @requires OpenLayers/Control/DragPan.js
+ * @requires OpenLayers/Handler/MouseWheel.js
+ * @requires OpenLayers/Handler/Click.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Navigation
+ * The navigation control handles map browsing with mouse events (dragging,
+ *     double-clicking, and scrolling the wheel).  Create a new navigation 
+ *     control with the <OpenLayers.Control.Navigation> control.  
+ * 
+ *     Note that this control is added to the map by default (if no controls 
+ *     array is sent in the options object to the <OpenLayers.Map> 
+ *     constructor).
+ * 
+ * Inherits:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Navigation = OpenLayers.Class(OpenLayers.Control, {
+
+    /** 
+     * Property: dragPan
+     * {<OpenLayers.Control.DragPan>} 
+     */
+    dragPan: null,
+
+    /**
+     * APIProprety: dragPanOptions
+     * {Object} Options passed to the DragPan control.
+     */
+    dragPanOptions: null,
+
+    /**
+     * APIProperty: documentDrag
+     * {Boolean} Allow panning of the map by dragging outside map viewport.
+     *     Default is false.
+     */
+    documentDrag: false,
+
+    /** 
+     * Property: zoomBox
+     * {<OpenLayers.Control.ZoomBox>}
+     */
+    zoomBox: null,
+
+    /**
+     * APIProperty: zoomBoxEnabled
+     * {Boolean} Whether the user can draw a box to zoom
+     */
+    zoomBoxEnabled: true, 
+
+    /**
+     * APIProperty: zoomWheelEnabled
+     * {Boolean} Whether the mousewheel should zoom the map
+     */
+    zoomWheelEnabled: true,
+    
+    /**
+     * Property: mouseWheelOptions
+     * {Object} Options passed to the MouseWheel control (only useful if
+     *     <zoomWheelEnabled> is set to true)
+     */
+    mouseWheelOptions: null,
+
+    /**
+     * APIProperty: handleRightClicks
+     * {Boolean} Whether or not to handle right clicks. Default is false.
+     */
+    handleRightClicks: false,
+
+    /**
+     * APIProperty: zoomBoxKeyMask
+     * {Integer} <OpenLayers.Handler> key code of the key, which has to be
+     *    pressed, while drawing the zoom box with the mouse on the screen. 
+     *    You should probably set handleRightClicks to true if you use this
+     *    with MOD_CTRL, to disable the context menu for machines which use
+     *    CTRL-Click as a right click.
+     * Default: <OpenLayers.Handler.MOD_SHIFT
+     */
+    zoomBoxKeyMask: OpenLayers.Handler.MOD_SHIFT,
+    
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     true.
+     */
+    autoActivate: true,
+
+    /**
+     * Constructor: OpenLayers.Control.Navigation
+     * Create a new navigation control
+     * 
+     * Parameters:
+     * options - {Object} An optional object whose properties will be set on
+     *                    the control
+     */
+    initialize: function(options) {
+        this.handlers = {};
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * Method: destroy
+     * The destroy method is used to perform any clean up before the control
+     * is dereferenced.  Typically this is where event listeners are removed
+     * to prevent memory leaks.
+     */
+    destroy: function() {
+        this.deactivate();
+
+        if (this.dragPan) {
+            this.dragPan.destroy();
+        }
+        this.dragPan = null;
+
+        if (this.zoomBox) {
+            this.zoomBox.destroy();
+        }
+        this.zoomBox = null;
+        OpenLayers.Control.prototype.destroy.apply(this,arguments);
+    },
+    
+    /**
+     * Method: activate
+     */
+    activate: function() {
+        this.dragPan.activate();
+        if (this.zoomWheelEnabled) {
+            this.handlers.wheel.activate();
+        }    
+        this.handlers.click.activate();
+        if (this.zoomBoxEnabled) {
+            this.zoomBox.activate();
+        }
+        return OpenLayers.Control.prototype.activate.apply(this,arguments);
+    },
+
+    /**
+     * Method: deactivate
+     */
+    deactivate: function() {
+        this.zoomBox.deactivate();
+        this.dragPan.deactivate();
+        this.handlers.click.deactivate();
+        this.handlers.wheel.deactivate();
+        return OpenLayers.Control.prototype.deactivate.apply(this,arguments);
+    },
+    
+    /**
+     * Method: draw
+     */
+    draw: function() {
+        // disable right mouse context menu for support of right click events
+        if (this.handleRightClicks) {
+            this.map.viewPortDiv.oncontextmenu = OpenLayers.Function.False;
+        }
+
+        var clickCallbacks = { 
+            'dblclick': this.defaultDblClick, 
+            'dblrightclick': this.defaultDblRightClick 
+        };
+        var clickOptions = {
+            'double': true, 
+            'stopDouble': true
+        };
+        this.handlers.click = new OpenLayers.Handler.Click(
+            this, clickCallbacks, clickOptions
+        );
+        this.dragPan = new OpenLayers.Control.DragPan(
+            OpenLayers.Util.extend({
+                map: this.map,
+                documentDrag: this.documentDrag
+            }, this.dragPanOptions)
+        );
+        this.zoomBox = new OpenLayers.Control.ZoomBox(
+                    {map: this.map, keyMask: this.zoomBoxKeyMask});
+        this.dragPan.draw();
+        this.zoomBox.draw();
+        this.handlers.wheel = new OpenLayers.Handler.MouseWheel(
+                                    this, {"up"  : this.wheelUp,
+                                           "down": this.wheelDown},
+                                    this.mouseWheelOptions );
+    },
+
+    /**
+     * Method: defaultDblClick 
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultDblClick: function (evt) {
+        var newCenter = this.map.getLonLatFromViewPortPx( evt.xy ); 
+        this.map.setCenter(newCenter, this.map.zoom + 1);
+    },
+
+    /**
+     * Method: defaultDblRightClick 
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    defaultDblRightClick: function (evt) {
+        var newCenter = this.map.getLonLatFromViewPortPx( evt.xy ); 
+        this.map.setCenter(newCenter, this.map.zoom - 1);
+    },
+    
+    /**
+     * Method: wheelChange  
+     *
+     * Parameters:
+     * evt - {Event}
+     * deltaZ - {Integer}
+     */
+    wheelChange: function(evt, deltaZ) {
+        var currentZoom = this.map.getZoom();
+        var newZoom = this.map.getZoom() + Math.round(deltaZ);
+        newZoom = Math.max(newZoom, 0);
+        newZoom = Math.min(newZoom, this.map.getNumZoomLevels());
+        if (newZoom === currentZoom) {
+            return;
+        }
+        var size    = this.map.getSize();
+        var deltaX  = size.w/2 - evt.xy.x;
+        var deltaY  = evt.xy.y - size.h/2;
+        var newRes  = this.map.baseLayer.getResolutionForZoom(newZoom);
+        var zoomPoint = this.map.getLonLatFromPixel(evt.xy);
+        var newCenter = new OpenLayers.LonLat(
+                            zoomPoint.lon + deltaX * newRes,
+                            zoomPoint.lat + deltaY * newRes );
+        this.map.setCenter( newCenter, newZoom );
+    },
+
+    /** 
+     * Method: wheelUp
+     * User spun scroll wheel up
+     * 
+     * Parameters:
+     * evt - {Event}
+     * delta - {Integer}
+     */
+    wheelUp: function(evt, delta) {
+        this.wheelChange(evt, delta || 1);
+    },
+
+    /** 
+     * Method: wheelDown
+     * User spun scroll wheel down
+     * 
+     * Parameters:
+     * evt - {Event}
+     * delta - {Integer}
+     */
+    wheelDown: function(evt, delta) {
+        this.wheelChange(evt, delta || -1);
+    },
+    
+    /**
+     * Method: disableZoomBox
+     */
+    disableZoomBox : function() {
+        this.zoomBoxEnabled = false;
+        this.zoomBox.deactivate();       
+    },
+    
+    /**
+     * Method: enableZoomBox
+     */
+    enableZoomBox : function() {
+        this.zoomBoxEnabled = true;
+        if (this.active) {
+            this.zoomBox.activate();
+        }    
+    },
+    
+    /**
+     * Method: disableZoomWheel
+     */
+    
+    disableZoomWheel : function() {
+        this.zoomWheelEnabled = false;
+        this.handlers.wheel.deactivate();       
+    },
+    
+    /**
+     * Method: enableZoomWheel
+     */
+    
+    enableZoomWheel : function() {
+        this.zoomWheelEnabled = true;
+        if (this.active) {
+            this.handlers.wheel.activate();
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Navigation"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ScaleLine.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ScaleLine.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ScaleLine.js	(revision 76)
@@ -0,0 +1,223 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ScaleLine
+ * The ScaleLine displays a small line indicator representing the current 
+ * map scale on the map. By default it is drawn in the lower left corner of
+ * the map.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ *  
+ * Is a very close copy of:
+ *  - <OpenLayers.Control.Scale>
+ */
+OpenLayers.Control.ScaleLine = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: maxWidth
+     * {Integer} Maximum width of the scale line in pixels.  Default is 100.
+     */
+    maxWidth: 100,
+
+    /**
+     * Property: topOutUnits
+     * {String} Units for zoomed out on top bar.  Default is km.
+     */
+    topOutUnits: "km",
+    
+    /**
+     * Property: topInUnits
+     * {String} Units for zoomed in on top bar.  Default is m.
+     */
+    topInUnits: "m",
+
+    /**
+     * Property: bottomOutUnits
+     * {String} Units for zoomed out on bottom bar.  Default is mi.
+     */
+    bottomOutUnits: "mi",
+
+    /**
+     * Property: bottomInUnits
+     * {String} Units for zoomed in on bottom bar.  Default is ft.
+     */
+    bottomInUnits: "ft",
+    
+    /**
+     * Property: eTop
+     * {DOMElement}
+     */
+    eTop: null,
+
+    /**
+     * Property: eBottom
+     * {DOMElement}
+     */
+    eBottom:null,
+    
+    /**
+     * APIProperty: geodesic
+     * {Boolean} Use geodesic measurement. Default is false. The recommended
+     * setting for maps in EPSG:4326 is false, and true EPSG:900913. If set to
+     * true, the scale will be calculated based on the horizontal size of the
+     * pixel in the center of the map viewport.
+     */
+    geodesic: false,
+
+    /**
+     * Constructor: OpenLayers.Control.ScaleLine
+     * Create a new scale line control.
+     * 
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);     
+    },
+
+    /**
+     * Method: draw
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        if (!this.eTop) {
+            // stick in the top bar
+            this.eTop = document.createElement("div");
+            this.eTop.className = this.displayClass + "Top";
+            var theLen = this.topInUnits.length;
+            this.div.appendChild(this.eTop);
+            if((this.topOutUnits == "") || (this.topInUnits == "")) {
+                this.eTop.style.visibility = "hidden";
+            } else {
+                this.eTop.style.visibility = "visible";
+            }
+
+            // and the bottom bar
+            this.eBottom = document.createElement("div");
+            this.eBottom.className = this.displayClass + "Bottom";
+            this.div.appendChild(this.eBottom);
+            if((this.bottomOutUnits == "") || (this.bottomInUnits == "")) {
+                this.eBottom.style.visibility = "hidden";
+            } else {
+                this.eBottom.style.visibility = "visible";
+            }
+        }
+        this.map.events.register('moveend', this, this.update);
+        this.update();
+        return this.div;
+    },
+
+    /** 
+     * Method: getBarLen
+     * Given a number, round it down to the nearest 1,2,5 times a power of 10.
+     * That seems a fairly useful set of number groups to use.
+     * 
+     * Parameters:
+     * maxLen - {float}  the number we're rounding down from
+     * 
+     * Returns:
+     * {Float} the rounded number (less than or equal to maxLen)
+     */
+    getBarLen: function(maxLen) {
+        // nearest power of 10 lower than maxLen
+        var digits = parseInt(Math.log(maxLen) / Math.log(10));
+        var pow10 = Math.pow(10, digits);
+        
+        // ok, find first character
+        var firstChar = parseInt(maxLen / pow10);
+
+        // right, put it into the correct bracket
+        var barLen;
+        if(firstChar > 5) {
+            barLen = 5;
+        } else if(firstChar > 2) {
+            barLen = 2;
+        } else {
+            barLen = 1;
+        }
+
+        // scale it up the correct power of 10
+        return barLen * pow10;
+    },
+
+    /**
+     * Method: update
+     * Update the size of the bars, and the labels they contain.
+     */
+    update: function() {
+        var res = this.map.getResolution();
+        if (!res) {
+            return;
+        }
+
+        var curMapUnits = this.map.getUnits();
+        var inches = OpenLayers.INCHES_PER_UNIT;
+
+        // convert maxWidth to map units
+        var maxSizeData = this.maxWidth * res * inches[curMapUnits];
+        var geodesicRatio = 1;
+        if(this.geodesic === true) {
+            var maxSizeGeodesic = (this.map.getGeodesicPixelSize().w ||
+                0.000001) * this.maxWidth;
+            var maxSizeKilometers = maxSizeData / inches["km"];
+            geodesicRatio = maxSizeGeodesic / maxSizeKilometers;
+            maxSizeData *= geodesicRatio;
+        }
+
+        // decide whether to use large or small scale units     
+        var topUnits;
+        var bottomUnits;
+        if(maxSizeData > 100000) {
+            topUnits = this.topOutUnits;
+            bottomUnits = this.bottomOutUnits;
+        } else {
+            topUnits = this.topInUnits;
+            bottomUnits = this.bottomInUnits;
+        }
+
+        // and to map units units
+        var topMax = maxSizeData / inches[topUnits];
+        var bottomMax = maxSizeData / inches[bottomUnits];
+
+        // now trim this down to useful block length
+        var topRounded = this.getBarLen(topMax);
+        var bottomRounded = this.getBarLen(bottomMax);
+
+        // and back to display units
+        topMax = topRounded / inches[curMapUnits] * inches[topUnits];
+        bottomMax = bottomRounded / inches[curMapUnits] * inches[bottomUnits];
+
+        // and to pixel units
+        var topPx = topMax / res / geodesicRatio;
+        var bottomPx = bottomMax / res / geodesicRatio;
+        
+        // now set the pixel widths
+        // and the values inside them
+        
+        if (this.eBottom.style.visibility == "visible"){
+            this.eBottom.style.width = Math.round(bottomPx) + "px"; 
+            this.eBottom.innerHTML = bottomRounded + " " + bottomUnits ;
+        }
+            
+        if (this.eTop.style.visibility == "visible"){
+            this.eTop.style.width = Math.round(topPx) + "px";
+            this.eTop.innerHTML = topRounded + " " + topUnits;
+        }
+        
+    }, 
+
+    CLASS_NAME: "OpenLayers.Control.ScaleLine"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Measure.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Measure.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Measure.js	(revision 76)
@@ -0,0 +1,321 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Measure
+ * Allows for drawing of features for measurements.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Measure = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * control.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * Supported control event types (in addition to those from <OpenLayers.Control>):
+     * measure - Triggered when a measurement sketch is complete.  Listeners
+     *      will receive an event with measure, units, order, and geometry
+     *      properties.
+     * measurepartial - Triggered when a new point is added to the
+     *      measurement sketch.  Listeners receive an event with measure,
+     *      units, order, and geometry.
+     */
+    EVENT_TYPES: ['measure', 'measurepartial'],
+
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Used to set non-default properties on the control's handler
+     */
+    handlerOptions: null,
+    
+    /**
+     * Property: callbacks
+     * {Object} The functions that are sent to the handler for callback
+     */
+    callbacks: null,
+    
+    /**
+     * Property: displaySystem
+     * {String} Display system for output measurements.  Supported values
+     *     are 'english', 'metric', and 'geographic'.  Default is 'metric'.
+     */
+    displaySystem: 'metric',
+    
+    /**
+     * Property: geodesic
+     * {Boolean} Calculate geodesic metrics instead of planar metrics.  This
+     *     requires that geometries can be transformed into Geographic/WGS84
+     *     (if that is not already the map projection).  Default is false.
+     */
+    geodesic: false,
+    
+    /**
+     * Property: displaySystemUnits
+     * {Object} Units for various measurement systems.  Values are arrays
+     *     of unit abbreviations (from OpenLayers.INCHES_PER_UNIT) in decreasing
+     *     order of length.
+     */
+    displaySystemUnits: {
+        geographic: ['dd'],
+        english: ['mi', 'ft', 'in'],
+        metric: ['km', 'm']
+    },
+
+    /**
+     * Property: delay
+     * {Number} Number of milliseconds between clicks before the event is
+     *     considered a double-click.  The "measurepartial" event will not
+     *     be triggered if the sketch is completed within this time.  This
+     *     is required for IE where creating a browser reflow (if a listener
+     *     is modifying the DOM by displaying the measurement values) messes
+     *     with the dblclick listener in the sketch handler.
+     */
+    partialDelay: 300,
+
+    /**
+     * Property: delayedTrigger
+     * {Number} Timeout id of trigger for measurepartial.
+     */
+    delayedTrigger: null,
+    
+    /**
+     * APIProperty: persist
+     * {Boolean} Keep the temporary measurement sketch drawn after the
+     *     measurement is complete.  The geometry will persist until a new
+     *     measurement is started, the control is deactivated, or <cancel> is
+     *     called.
+     */
+    persist: false,
+
+    /**
+     * Constructor: OpenLayers.Control.Measure
+     * 
+     * Parameters:
+     * handler - {<OpenLayers.Handler>} 
+     * options - {Object} 
+     */
+    initialize: function(handler, options) {
+        // concatenate events specific to measure with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.Measure.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.callbacks = OpenLayers.Util.extend(
+            {done: this.measureComplete, point: this.measurePartial},
+            this.callbacks
+        );
+
+        // let the handler options override, so old code that passes 'persist' 
+        // directly to the handler does not need an update
+        this.handlerOptions = OpenLayers.Util.extend(
+            {persist: this.persist}, this.handlerOptions
+        );
+        this.handler = new handler(this, this.callbacks, this.handlerOptions);
+    },
+    
+    /**
+     * APIMethod: cancel
+     * Stop the control from measuring.  If <persist> is true, the temporary
+     *     sketch will be erased.
+     */
+    cancel: function() {
+        this.handler.cancel();
+    },
+    
+    /**
+     * Method: updateHandler
+     *
+     * Parameters:
+     * handler - {Function} One of the sketch handler constructors.
+     * options - {Object} Options for the handler.
+     */
+    updateHandler: function(handler, options) {
+        var active = this.active;
+        if(active) {
+            this.deactivate();
+        }
+        this.handler = new handler(this, this.callbacks, options);
+        if(active) {
+            this.activate();
+        }
+    },
+
+    /**
+     * Method: measureComplete
+     * Called when the measurement sketch is done.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     */
+    measureComplete: function(geometry) {
+        if(this.delayedTrigger) {
+            window.clearTimeout(this.delayedTrigger);
+        }
+        this.measure(geometry, "measure");
+    },
+    
+    /**
+     * Method: measurePartial
+     * Called each time a new point is added to the measurement sketch.
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>} The last point added.
+     * geometry - {<OpenLayers.Geometry>} The sketch geometry.
+     */
+    measurePartial: function(point, geometry) {
+        if (geometry.getLength() > 0) {
+            geometry = geometry.clone();
+            this.delayedTrigger = window.setTimeout(
+                OpenLayers.Function.bind(function() {
+                    this.measure(geometry, "measurepartial");
+                }, this),
+                this.partialDelay
+            );
+        }
+    },
+
+    /**
+     * Method: measure
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * eventType - {String}
+     */
+    measure: function(geometry, eventType) {
+        var stat, order;
+        if(geometry.CLASS_NAME.indexOf('LineString') > -1) {
+            stat = this.getBestLength(geometry);
+            order = 1;
+        } else {
+            stat = this.getBestArea(geometry);
+            order = 2;
+        }
+        this.events.triggerEvent(eventType, {
+            measure: stat[0],
+            units: stat[1],
+            order: order,
+            geometry: geometry
+        });
+    },
+    
+    /**
+     * Method: getBestArea
+     * Based on the <displaySystem> returns the area of a geometry.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     *
+     * Returns:
+     * {Array([Float, String])}  Returns a two item array containing the
+     *     area and the units abbreviation.
+     */
+    getBestArea: function(geometry) {
+        var units = this.displaySystemUnits[this.displaySystem];
+        var unit, area;
+        for(var i=0, len=units.length; i<len; ++i) {
+            unit = units[i];
+            area = this.getArea(geometry, unit);
+            if(area > 1) {
+                break;
+            }
+        }
+        return [area, unit];
+    },
+    
+    /**
+     * Method: getArea
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * units - {String} Unit abbreviation
+     *
+     * Returns:
+     * {Float} The geometry area in the given units.
+     */
+    getArea: function(geometry, units) {
+        var area, geomUnits;
+        if(this.geodesic) {
+            area = geometry.getGeodesicArea(this.map.getProjectionObject());
+            geomUnits = "m";
+        } else {
+            area = geometry.getArea();
+            geomUnits = this.map.getUnits();
+        }
+        var inPerDisplayUnit = OpenLayers.INCHES_PER_UNIT[units];
+        if(inPerDisplayUnit) {
+            var inPerMapUnit = OpenLayers.INCHES_PER_UNIT[geomUnits];
+            area *= Math.pow((inPerMapUnit / inPerDisplayUnit), 2);
+        }
+        return area;
+    },
+    
+    /**
+     * Method: getBestLength
+     * Based on the <displaySystem> returns the length of a geometry.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     *
+     * Returns:
+     * {Array([Float, String])}  Returns a two item array containing the
+     *     length and the units abbreviation.
+     */
+    getBestLength: function(geometry) {
+        var units = this.displaySystemUnits[this.displaySystem];
+        var unit, length;
+        for(var i=0, len=units.length; i<len; ++i) {
+            unit = units[i];
+            length = this.getLength(geometry, unit);
+            if(length > 1) {
+                break;
+            }
+        }
+        return [length, unit];
+    },
+
+    /**
+     * Method: getLength
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * units - {String} Unit abbreviation
+     *
+     * Returns:
+     * {Float} The geometry length in the given units.
+     */
+    getLength: function(geometry, units) {
+        var length, geomUnits;
+        if(this.geodesic) {
+            length = geometry.getGeodesicLength(this.map.getProjectionObject());
+            geomUnits = "m";
+        } else {
+            length = geometry.getLength();
+            geomUnits = this.map.getUnits();
+        }
+        var inPerDisplayUnit = OpenLayers.INCHES_PER_UNIT[units];
+        if(inPerDisplayUnit) {
+            var inPerMapUnit = OpenLayers.INCHES_PER_UNIT[geomUnits];
+            length *= (inPerMapUnit / inPerDisplayUnit);
+        }
+        return length;
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Measure"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Attribution.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Attribution.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Attribution.js	(revision 76)
@@ -0,0 +1,97 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Attribution
+ * The attribution control adds attribution from layers to the map display. 
+ * It uses 'attribution' property of each layer.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Attribution = 
+  OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * APIProperty: seperator
+     * {String} String used to seperate layers.
+     */
+    separator: ", ",
+    
+    /**
+     * Constructor: OpenLayers.Control.Attribution 
+     * 
+     * Parameters:
+     * options - {Object} Options for control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /** 
+     * Method: destroy
+     * Destroy control.
+     */
+    destroy: function() {
+        this.map.events.un({
+            "removelayer": this.updateAttribution,
+            "addlayer": this.updateAttribution,
+            "changelayer": this.updateAttribution,
+            "changebaselayer": this.updateAttribution,
+            scope: this
+        });
+        
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+    },    
+    
+    /**
+     * Method: draw
+     * Initialize control.
+     * 
+     * Returns: 
+     * {DOMElement} A reference to the DIV DOMElement containing the control
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        
+        this.map.events.on({
+            'changebaselayer': this.updateAttribution,
+            'changelayer': this.updateAttribution,
+            'addlayer': this.updateAttribution,
+            'removelayer': this.updateAttribution,
+            scope: this
+        });
+        this.updateAttribution();
+        
+        return this.div;    
+    },
+
+    /**
+     * Method: updateAttribution
+     * Update attribution string.
+     */
+    updateAttribution: function() {
+        var attributions = [];
+        if (this.map && this.map.layers) {
+            for(var i=0, len=this.map.layers.length; i<len; i++) {
+                var layer = this.map.layers[i];
+                if (layer.attribution && layer.getVisibility()) {
+                    // add attribution only if attribution text is unique
+                    if (OpenLayers.Util.indexOf(
+                                    attributions, layer.attribution) === -1) {
+                        attributions.push( layer.attribution );
+                    }
+                }
+            } 
+            this.div.innerHTML = attributions.join(this.separator);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Attribution"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoomBar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoomBar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanZoomBar.js	(revision 76)
@@ -0,0 +1,396 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control/PanZoom.js
+ */
+
+/**
+ * Class: OpenLayers.Control.PanZoomBar
+ * The PanZoomBar is a visible control composed of a
+ * <OpenLayers.Control.PanPanel> and a <OpenLayers.Control.ZoomBar>. 
+ * By default it is displayed in the upper left corner of the map as 4
+ * directional arrows above a vertical slider.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control.PanZoom>
+ */
+OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
+
+    /** 
+     * APIProperty: zoomStopWidth
+     */
+    zoomStopWidth: 18,
+
+    /** 
+     * APIProperty: zoomStopHeight
+     */
+    zoomStopHeight: 11,
+
+    /** 
+     * Property: slider
+     */
+    slider: null,
+
+    /** 
+     * Property: sliderEvents
+     * {<OpenLayers.Events>}
+     */
+    sliderEvents: null,
+
+    /** 
+     * Property: zoombarDiv
+     * {DOMElement}
+     */
+    zoombarDiv: null,
+
+    /** 
+     * Property: divEvents
+     * {<OpenLayers.Events>}
+     */
+    divEvents: null,
+
+    /** 
+     * APIProperty: zoomWorldIcon
+     * {Boolean}
+     */
+    zoomWorldIcon: false,
+
+    /**
+     * APIProperty: forceFixedZoomLevel
+     * {Boolean} Force a fixed zoom level even though the map has 
+     *     fractionalZoom
+     */
+    forceFixedZoomLevel: false,
+
+    /**
+     * Property: mouseDragStart
+     * {<OpenLayers.Pixel>}
+     */
+    mouseDragStart: null,
+
+    /**
+     * Property: zoomStart
+     * {<OpenLayers.Pixel>}
+     */
+    zoomStart: null,
+
+    /**
+     * Constructor: OpenLayers.Control.PanZoomBar
+     */ 
+    initialize: function() {
+        OpenLayers.Control.PanZoom.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+
+        this._removeZoomBar();
+
+        this.map.events.un({
+            "changebaselayer": this.redraw,
+            scope: this
+        });
+
+        OpenLayers.Control.PanZoom.prototype.destroy.apply(this, arguments);
+
+        delete this.mouseDragStart;
+        delete this.zoomStart;
+    },
+    
+    /**
+     * Method: setMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        OpenLayers.Control.PanZoom.prototype.setMap.apply(this, arguments);
+        this.map.events.register("changebaselayer", this, this.redraw);
+    },
+
+    /** 
+     * Method: redraw
+     * clear the div and start over.
+     */
+    redraw: function() {
+        if (this.div != null) {
+            this.removeButtons();
+            this._removeZoomBar();
+        }  
+        this.draw();
+    },
+    
+    /**
+    * Method: draw 
+    *
+    * Parameters:
+    * px - {<OpenLayers.Pixel>} 
+    */
+    draw: function(px) {
+        // initialize our internal div
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        px = this.position.clone();
+
+        // place the controls
+        this.buttons = [];
+
+        var sz = new OpenLayers.Size(18,18);
+        var centered = new OpenLayers.Pixel(px.x+sz.w/2, px.y);
+        var wposition = sz.w;
+
+        if (this.zoomWorldIcon) {
+            centered = new OpenLayers.Pixel(px.x+sz.w, px.y);
+        }
+
+        this._addButton("panup", "north-mini.png", centered, sz);
+        px.y = centered.y+sz.h;
+        this._addButton("panleft", "west-mini.png", px, sz);
+        if (this.zoomWorldIcon) {
+            this._addButton("zoomworld", "zoom-world-mini.png", px.add(sz.w, 0), sz);
+            
+            wposition *= 2;
+        }
+        this._addButton("panright", "east-mini.png", px.add(wposition, 0), sz);
+        this._addButton("pandown", "south-mini.png", centered.add(0, sz.h*2), sz);
+        this._addButton("zoomin", "zoom-plus-mini.png", centered.add(0, sz.h*3+5), sz);
+        centered = this._addZoomBar(centered.add(0, sz.h*4 + 5));
+        this._addButton("zoomout", "zoom-minus-mini.png", centered, sz);
+        return this.div;
+    },
+
+    /** 
+    * Method: _addZoomBar
+    * 
+    * Parameters:
+    * location - {<OpenLayers.Pixel>} where zoombar drawing is to start.
+    */
+    _addZoomBar:function(centered) {
+        var imgLocation = OpenLayers.Util.getImagesLocation();
+        
+        var id = this.id + "_" + this.map.id;
+        var zoomsToEnd = this.map.getNumZoomLevels() - 1 - this.map.getZoom();
+        var slider = OpenLayers.Util.createAlphaImageDiv(id,
+                       centered.add(-1, zoomsToEnd * this.zoomStopHeight), 
+                       new OpenLayers.Size(20,9), 
+                       imgLocation+"slider.png",
+                       "absolute");
+        this.slider = slider;
+        
+        this.sliderEvents = new OpenLayers.Events(this, slider, null, true,
+                                            {includeXY: true});
+        this.sliderEvents.on({
+            "mousedown": this.zoomBarDown,
+            "mousemove": this.zoomBarDrag,
+            "mouseup": this.zoomBarUp,
+            "dblclick": this.doubleClick,
+            "click": this.doubleClick
+        });
+        
+        var sz = new OpenLayers.Size();
+        sz.h = this.zoomStopHeight * this.map.getNumZoomLevels();
+        sz.w = this.zoomStopWidth;
+        var div = null;
+        
+        if (OpenLayers.Util.alphaHack()) {
+            var id = this.id + "_" + this.map.id;
+            div = OpenLayers.Util.createAlphaImageDiv(id, centered,
+                                      new OpenLayers.Size(sz.w, 
+                                              this.zoomStopHeight),
+                                      imgLocation + "zoombar.png", 
+                                      "absolute", null, "crop");
+            div.style.height = sz.h + "px";
+        } else {
+            div = OpenLayers.Util.createDiv(
+                        'OpenLayers_Control_PanZoomBar_Zoombar' + this.map.id,
+                        centered,
+                        sz,
+                        imgLocation+"zoombar.png");
+        }
+        
+        this.zoombarDiv = div;
+        
+        this.divEvents = new OpenLayers.Events(this, div, null, true, 
+                                                {includeXY: true});
+        this.divEvents.on({
+            "mousedown": this.divClick,
+            "mousemove": this.passEventToSlider,
+            "dblclick": this.doubleClick,
+            "click": this.doubleClick
+        });
+        
+        this.div.appendChild(div);
+
+        this.startTop = parseInt(div.style.top);
+        this.div.appendChild(slider);
+
+        this.map.events.register("zoomend", this, this.moveZoomBar);
+
+        centered = centered.add(0, 
+            this.zoomStopHeight * this.map.getNumZoomLevels());
+        return centered; 
+    },
+    
+    /**
+     * Method: _removeZoomBar
+     */
+    _removeZoomBar: function() {
+        this.sliderEvents.un({
+            "mousedown": this.zoomBarDown,
+            "mousemove": this.zoomBarDrag,
+            "mouseup": this.zoomBarUp,
+            "dblclick": this.doubleClick,
+            "click": this.doubleClick
+        });
+        this.sliderEvents.destroy();
+
+        this.divEvents.un({
+            "mousedown": this.divClick,
+            "mousemove": this.passEventToSlider,
+            "dblclick": this.doubleClick,
+            "click": this.doubleClick
+        });
+        this.divEvents.destroy();
+        
+        this.div.removeChild(this.zoombarDiv);
+        this.zoombarDiv = null;
+        this.div.removeChild(this.slider);
+        this.slider = null;
+        
+        this.map.events.unregister("zoomend", this, this.moveZoomBar);
+    },
+    
+    /**
+     * Method: passEventToSlider
+     * This function is used to pass events that happen on the div, or the map,
+     * through to the slider, which then does its moving thing.
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    passEventToSlider:function(evt) {
+        this.sliderEvents.handleBrowserEvent(evt);
+    },
+    
+    /**
+     * Method: divClick
+     * Picks up on clicks directly on the zoombar div
+     *           and sets the zoom level appropriately.
+     */
+    divClick: function (evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        var y = evt.xy.y;
+        var top = OpenLayers.Util.pagePosition(evt.object)[1];
+        var levels = (y - top)/this.zoomStopHeight;
+        if(this.forceFixedZoomLevel || !this.map.fractionalZoom) {
+            levels = Math.floor(levels);
+        }    
+        var zoom = (this.map.getNumZoomLevels() - 1) - levels; 
+        zoom = Math.min(Math.max(zoom, 0), this.map.getNumZoomLevels() - 1);
+        this.map.zoomTo(zoom);
+        OpenLayers.Event.stop(evt);
+    },
+    
+    /*
+     * Method: zoomBarDown
+     * event listener for clicks on the slider
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    zoomBarDown:function(evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        this.map.events.on({
+            "mousemove": this.passEventToSlider,
+            "mouseup": this.passEventToSlider,
+            scope: this
+        });
+        this.mouseDragStart = evt.xy.clone();
+        this.zoomStart = evt.xy.clone();
+        this.div.style.cursor = "move";
+        // reset the div offsets just in case the div moved
+        this.zoombarDiv.offsets = null; 
+        OpenLayers.Event.stop(evt);
+    },
+    
+    /*
+     * Method: zoomBarDrag
+     * This is what happens when a click has occurred, and the client is
+     * dragging.  Here we must ensure that the slider doesn't go beyond the
+     * bottom/top of the zoombar div, as well as moving the slider to its new
+     * visual location
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    zoomBarDrag:function(evt) {
+        if (this.mouseDragStart != null) {
+            var deltaY = this.mouseDragStart.y - evt.xy.y;
+            var offsets = OpenLayers.Util.pagePosition(this.zoombarDiv);
+            if ((evt.clientY - offsets[1]) > 0 && 
+                (evt.clientY - offsets[1]) < parseInt(this.zoombarDiv.style.height) - 2) {
+                var newTop = parseInt(this.slider.style.top) - deltaY;
+                this.slider.style.top = newTop+"px";
+                this.mouseDragStart = evt.xy.clone();
+            }
+            OpenLayers.Event.stop(evt);
+        }
+    },
+    
+    /*
+     * Method: zoomBarUp
+     * Perform cleanup when a mouseup event is received -- discover new zoom
+     * level and switch to it.
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    zoomBarUp:function(evt) {
+        if (!OpenLayers.Event.isLeftClick(evt)) {
+            return;
+        }
+        if (this.mouseDragStart) {
+            this.div.style.cursor="";
+            this.map.events.un({
+                "mouseup": this.passEventToSlider,
+                "mousemove": this.passEventToSlider,
+                scope: this
+            });
+            var deltaY = this.zoomStart.y - evt.xy.y;
+            var zoomLevel = this.map.zoom;
+            if (!this.forceFixedZoomLevel && this.map.fractionalZoom) {
+                zoomLevel += deltaY/this.zoomStopHeight;
+                zoomLevel = Math.min(Math.max(zoomLevel, 0), 
+                                     this.map.getNumZoomLevels() - 1);
+            } else {
+                zoomLevel += Math.round(deltaY/this.zoomStopHeight);
+            }
+            this.map.zoomTo(zoomLevel);
+            this.mouseDragStart = null;
+            this.zoomStart = null;
+            OpenLayers.Event.stop(evt);
+        }
+    },
+    
+    /*
+    * Method: moveZoomBar
+    * Change the location of the slider to match the current zoom level.
+    */
+    moveZoomBar:function() {
+        var newTop = 
+            ((this.map.getNumZoomLevels()-1) - this.map.getZoom()) * 
+            this.zoomStopHeight + this.startTop + 1;
+        this.slider.style.top = newTop + "px";
+    },    
+    
+    CLASS_NAME: "OpenLayers.Control.PanZoomBar"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DrawFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DrawFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/DrawFeature.js	(revision 76)
@@ -0,0 +1,126 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Control.DrawFeature
+ * The DrawFeature control draws point, line or polygon features on a vector
+ * layer when active.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.DrawFeature = OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>}
+     */
+    layer: null,
+
+    /**
+     * Property: callbacks
+     * {Object} The functions that are sent to the handler for callback
+     */
+    callbacks: null,
+    
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types:
+     * featureadded - Triggered when a feature is added
+     */
+    EVENT_TYPES: ["featureadded"],
+    
+    /**
+     * APIProperty: multi
+     * {Boolean} Cast features to multi-part geometries before passing to the
+     *     layer.  Default is false.
+     */
+    multi: false,
+
+    /**
+     * APIProperty: featureAdded
+     * {Function} Called after each feature is added
+     */
+    featureAdded: function() {},
+
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Used to set non-default properties on the control's handler
+     */
+    handlerOptions: null,
+    
+    /**
+     * Constructor: OpenLayers.Control.DrawFeature
+     * 
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} 
+     * handler - {<OpenLayers.Handler>} 
+     * options - {Object} 
+     */
+    initialize: function(layer, handler, options) {
+        
+        // concatenate events specific to vector with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.DrawFeature.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.callbacks = OpenLayers.Util.extend(
+            {
+                done: this.drawFeature,
+                modify: function(vertex, feature) {
+                    this.layer.events.triggerEvent(
+                        "sketchmodified", {vertex: vertex, feature: feature}
+                    );
+                },
+                create: function(vertex, feature) {
+                    this.layer.events.triggerEvent(
+                        "sketchstarted", {vertex: vertex, feature: feature}
+                    );
+                }
+            },
+            this.callbacks
+        );
+        this.layer = layer;
+        this.handlerOptions = this.handlerOptions || {};
+        if (!("multi" in this.handlerOptions)) {
+            this.handlerOptions.multi = this.multi;
+        }
+        var sketchStyle = this.layer.styleMap && this.layer.styleMap.styles.temporary;
+        if(sketchStyle) {
+            this.handlerOptions.layerOptions = OpenLayers.Util.applyDefaults(
+                this.handlerOptions.layerOptions,
+                {styleMap: new OpenLayers.StyleMap({"default": sketchStyle})}
+            );
+        }
+        this.handler = new handler(this, this.callbacks, this.handlerOptions);
+    },
+
+    /**
+     * Method: drawFeature
+     */
+    drawFeature: function(geometry) {
+        var feature = new OpenLayers.Feature.Vector(geometry);
+        var proceed = this.layer.events.triggerEvent(
+            "sketchcomplete", {feature: feature}
+        );
+        if(proceed !== false) {
+            feature.state = OpenLayers.State.INSERT;
+            this.layer.addFeatures([feature]);
+            this.featureAdded(feature);
+            this.events.triggerEvent("featureadded",{feature : feature});
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.DrawFeature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomIn.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomIn.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomIn.js	(revision 76)
@@ -0,0 +1,35 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ZoomIn
+ * The ZoomIn control is a button to increase the zoom level of a map.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ZoomIn = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: type
+     * {String} The type of <OpenLayers.Control> -- When added to a 
+     *     <Control.Panel>, 'type' is used by the panel to determine how to 
+     *     handle our events.
+     */
+    type: OpenLayers.Control.TYPE_BUTTON,
+    
+    /**
+     * Method: trigger
+     */
+    trigger: function(){
+        this.map.zoomIn();
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ZoomIn"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Button.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Button.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Button.js	(revision 76)
@@ -0,0 +1,44 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Button 
+ * The Button control is a very simple push-button, for use with 
+ * <OpenLayers.Control.Panel>.
+ * When clicked, the function trigger() is executed.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ *
+ * Use:
+ * (code)
+ * var button = new OpenLayers.Control.Button({
+ *     displayClass: "MyButton", trigger: myFunction
+ * });
+ * panel.addControls([button]);
+ * (end)
+ * 
+ * Will create a button with CSS class MyButtonItemInactive, that
+ *     will call the function MyFunction() when clicked.
+ */
+OpenLayers.Control.Button = OpenLayers.Class(OpenLayers.Control, {
+    /**
+     * Property: type
+     * {Integer} OpenLayers.Control.TYPE_BUTTON.
+     */
+    type: OpenLayers.Control.TYPE_BUTTON,
+    
+    /**
+     * Method: trigger
+     * Called by a control panel when the button is clicked.
+     */
+    trigger: function() {},
+
+    CLASS_NAME: "OpenLayers.Control.Button"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomOut.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomOut.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomOut.js	(revision 76)
@@ -0,0 +1,35 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ZoomOut
+ * The ZoomOut control is a button to decrease the zoom level of a map.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ZoomOut = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: type
+     * {String} The type of <OpenLayers.Control> -- When added to a 
+     *     <Control.Panel>, 'type' is used by the panel to determine how to 
+     *     handle our events.
+     */
+    type: OpenLayers.Control.TYPE_BUTTON,
+    
+    /**
+     * Method: trigger
+     */
+    trigger: function(){
+        this.map.zoomOut();
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ZoomOut"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MousePosition.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MousePosition.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/MousePosition.js	(revision 76)
@@ -0,0 +1,213 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.MousePosition
+ * The MousePosition control displays geographic coordinates of the mouse
+ * pointer, as it is moved about the map.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.MousePosition = OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     true.
+     */
+    autoActivate: true,
+
+    /** 
+     * Property: element
+     * {DOMElement} 
+     */
+    element: null,
+    
+    /** 
+     * APIProperty: prefix
+     * {String}
+     */
+    prefix: '',
+    
+    /** 
+     * APIProperty: separator
+     * {String}
+     */
+    separator: ', ',
+    
+    /** 
+     * APIProperty: suffix
+     * {String}
+     */
+    suffix: '',
+    
+    /** 
+     * APIProperty: numDigits
+     * {Integer}
+     */
+    numDigits: 5,
+    
+    /** 
+     * APIProperty: granularity
+     * {Integer} 
+     */
+    granularity: 10,
+
+    /**
+     * APIProperty: emptyString 
+     * {String} Set this to some value to set when the mouse is outside the
+     *     map.
+     */
+    emptyString: null,
+    
+    /** 
+     * Property: lastXy
+     * {<OpenLayers.Pixel>}
+     */
+    lastXy: null,
+
+    /**
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} The projection in which the 
+     * mouse position is displayed
+     */
+    displayProjection: null, 
+    
+    /**
+     * Constructor: OpenLayers.Control.MousePosition
+     * 
+     * Parameters:
+     * options - {Object} Options for control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * Method: destroy
+     */
+     destroy: function() {
+         this.deactivate();
+         OpenLayers.Control.prototype.destroy.apply(this, arguments);
+     },
+
+    /**
+     * APIMethod: activate
+     */
+    activate: function() {
+        if (OpenLayers.Control.prototype.activate.apply(this, arguments)) {
+            this.map.events.register('mousemove', this, this.redraw);
+            this.map.events.register('mouseout', this, this.reset);
+            this.redraw();
+            return true;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * APIMethod: deactivate
+     */
+    deactivate: function() {
+        if (OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
+            this.map.events.unregister('mousemove', this, this.redraw);
+            this.map.events.unregister('mouseout', this, this.reset);
+            this.element.innerHTML = "";
+            return true;
+        } else {
+            return false;
+        }
+    },
+
+    /**
+     * Method: draw
+     * {DOMElement}
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+
+        if (!this.element) {
+            this.div.left = "";
+            this.div.top = "";
+            this.element = this.div;
+        }
+        
+        return this.div;
+    },
+   
+    /**
+     * Method: redraw  
+     */
+    redraw: function(evt) {
+
+        var lonLat;
+
+        if (evt == null) {
+            this.reset();
+            return;
+        } else {
+            if (this.lastXy == null ||
+                Math.abs(evt.xy.x - this.lastXy.x) > this.granularity ||
+                Math.abs(evt.xy.y - this.lastXy.y) > this.granularity)
+            {
+                this.lastXy = evt.xy;
+                return;
+            }
+
+            lonLat = this.map.getLonLatFromPixel(evt.xy);
+            if (!lonLat) { 
+                // map has not yet been properly initialized
+                return;
+            }    
+            if (this.displayProjection) {
+                lonLat.transform(this.map.getProjectionObject(), 
+                                 this.displayProjection );
+            }      
+            this.lastXy = evt.xy;
+            
+        }
+        
+        var newHtml = this.formatOutput(lonLat);
+
+        if (newHtml != this.element.innerHTML) {
+            this.element.innerHTML = newHtml;
+        }
+    },
+
+    /**
+     * Method: reset
+     */
+    reset: function(evt) {
+        if (this.emptyString != null) {
+            this.element.innerHTML = this.emptyString;
+        }
+    },
+
+    /**
+     * Method: formatOutput
+     * Override to provide custom display output
+     *
+     * Parameters:
+     * lonLat - {<OpenLayers.LonLat>} Location to display
+     */
+    formatOutput: function(lonLat) {
+        var digits = parseInt(this.numDigits);
+        var newHtml =
+            this.prefix +
+            lonLat.lon.toFixed(digits) +
+            this.separator + 
+            lonLat.lat.toFixed(digits) +
+            this.suffix;
+        return newHtml;
+    },
+
+    CLASS_NAME: "OpenLayers.Control.MousePosition"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Pan.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Pan.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Pan.js	(revision 76)
@@ -0,0 +1,86 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Pan
+ * The Pan control is a single button to pan the map in one direction. For
+ * a more complete control see <OpenLayers.Control.PanPanel>.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Pan = OpenLayers.Class(OpenLayers.Control, {
+
+    /** 
+     * APIProperty: slideFactor
+     * {Integer} Number of pixels by which we'll pan the map in any direction 
+     *     on clicking the arrow buttons, defaults to 50.
+     */
+    slideFactor: 50,
+
+    /** 
+     * Property: direction
+     * {String} in {'North', 'South', 'East', 'West'}
+     */
+    direction: null,
+
+    /**
+     * Property: type
+     * {String} The type of <OpenLayers.Control> -- When added to a 
+     *     <Control.Panel>, 'type' is used by the panel to determine how to 
+     *     handle our events.
+     */
+    type: OpenLayers.Control.TYPE_BUTTON,
+
+    /**
+     * Constructor: OpenLayers.Control.Pan 
+     * Control which handles the panning (in any of the cardinal directions)
+     *     of the map by a set px distance. 
+     *
+     * Parameters:
+     * direction - {String} The direction this button should pan.
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(direction, options) {
+    
+        this.direction = direction;
+        this.CLASS_NAME += this.direction;
+        
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+    },
+    
+    /**
+     * Method: trigger
+     */
+    trigger: function(){
+    
+        switch (this.direction) {
+            case OpenLayers.Control.Pan.NORTH: 
+                this.map.pan(0, -this.slideFactor);
+                break;
+            case OpenLayers.Control.Pan.SOUTH: 
+                this.map.pan(0, this.slideFactor);
+                break;
+            case OpenLayers.Control.Pan.WEST: 
+                this.map.pan(-this.slideFactor, 0);
+                break;
+            case OpenLayers.Control.Pan.EAST: 
+                this.map.pan(this.slideFactor, 0);
+                break;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Pan"
+});
+
+OpenLayers.Control.Pan.NORTH = "North";
+OpenLayers.Control.Pan.SOUTH = "South";
+OpenLayers.Control.Pan.EAST = "East";
+OpenLayers.Control.Pan.WEST = "West";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavigationHistory.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavigationHistory.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/NavigationHistory.js	(revision 76)
@@ -0,0 +1,423 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/Button.js
+ */
+
+/**
+ * Class: OpenLayers.Control.NavigationHistory
+ * A navigation history control.  This is a meta-control, that creates two
+ *     dependent controls: <previous> and <next>.  Call the trigger method
+ *     on the <previous> and <next> controls to restore previous and next
+ *     history states.  The previous and next controls will become active
+ *     when there are available states to restore and will become deactive
+ *     when there are no states to restore.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.NavigationHistory = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: type
+     * {String} Note that this control is not intended to be added directly
+     *     to a control panel.  Instead, add the sub-controls previous and
+     *     next.  These sub-controls are button type controls that activate
+     *     and deactivate themselves.  If this parent control is added to
+     *     a panel, it will act as a toggle.
+     */
+    type: OpenLayers.Control.TYPE_TOGGLE,
+
+    /**
+     * APIProperty: previous
+     * {<OpenLayers.Control>} A button type control whose trigger method restores
+     *     the previous state managed by this control.
+     */
+    previous: null,
+    
+    /**
+     * APIProperty: previousOptions
+     * {Object} Set this property on the options argument of the constructor
+     *     to set optional properties on the <previous> control.
+     */
+    previousOptions: null,
+    
+    /**
+     * APIProperty: next
+     * {<OpenLayers.Control>} A button type control whose trigger method restores
+     *     the next state managed by this control.
+     */
+    next: null,
+
+    /**
+     * APIProperty: nextOptions
+     * {Object} Set this property on the options argument of the constructor
+     *     to set optional properties on the <next> control.
+     */
+    nextOptions: null,
+
+    /**
+     * APIProperty: limit
+     * {Integer} Optional limit on the number of history items to retain.  If
+     *     null, there is no limit.  Default is 50.
+     */
+    limit: 50,
+
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     true.
+     */
+    autoActivate: true,
+
+    /**
+     * Property: clearOnDeactivate
+     * {Boolean} Clear the history when the control is deactivated.  Default
+     *     is false.
+     */
+    clearOnDeactivate: false,
+
+    /**
+     * Property: registry
+     * {Object} An object with keys corresponding to event types.  Values
+     *     are functions that return an object representing the current state.
+     */
+    registry: null,
+
+    /**
+     * Property: nextStack
+     * {Array} Array of items in the history.
+     */
+    nextStack: null,
+
+    /**
+     * Property: previousStack
+     * {Array} List of items in the history.  First item represents the current
+     *     state.
+     */
+    previousStack: null,
+    
+    /**
+     * Property: listeners
+     * {Object} An object containing properties corresponding to event types.
+     *     This object is used to configure the control and is modified on
+     *     construction.
+     */
+    listeners: null,
+    
+    /**
+     * Property: restoring
+     * {Boolean} Currently restoring a history state.  This is set to true
+     *     before calling restore and set to false after restore returns.
+     */
+    restoring: false,
+    
+    /**
+     * Constructor: OpenLayers.Control.NavigationHistory 
+     * 
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        this.registry = OpenLayers.Util.extend({
+            "moveend": this.getState
+        }, this.registry);
+        
+        var previousOptions = {
+            trigger: OpenLayers.Function.bind(this.previousTrigger, this),
+            displayClass: this.displayClass + " " + this.displayClass + "Previous"
+        };
+        OpenLayers.Util.extend(previousOptions, this.previousOptions);
+        this.previous = new OpenLayers.Control.Button(previousOptions);
+        
+        var nextOptions = {
+            trigger: OpenLayers.Function.bind(this.nextTrigger, this),
+            displayClass: this.displayClass + " " + this.displayClass + "Next"
+        };
+        OpenLayers.Util.extend(nextOptions, this.nextOptions);
+        this.next = new OpenLayers.Control.Button(nextOptions);
+
+        this.clear();
+    },
+    
+    /**
+     * Method: onPreviousChange
+     * Called when the previous history stack changes.
+     *
+     * Parameters:
+     * state - {Object} An object representing the state to be restored
+     *     if previous is triggered again or null if no previous states remain.
+     * length - {Integer} The number of remaining previous states that can
+     *     be restored.
+     */
+    onPreviousChange: function(state, length) {
+        if(state && !this.previous.active) {
+            this.previous.activate();
+        } else if(!state && this.previous.active) {
+            this.previous.deactivate();
+        }
+    },
+    
+    /**
+     * Method: onNextChange
+     * Called when the next history stack changes.
+     *
+     * Parameters:
+     * state - {Object} An object representing the state to be restored
+     *     if next is triggered again or null if no next states remain.
+     * length - {Integer} The number of remaining next states that can
+     *     be restored.
+     */
+    onNextChange: function(state, length) {
+        if(state && !this.next.active) {
+            this.next.activate();
+        } else if(!state && this.next.active) {
+            this.next.deactivate();
+        }
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Destroy the control.
+     */
+    destroy: function() {
+        OpenLayers.Control.prototype.destroy.apply(this);
+        this.previous.destroy();
+        this.next.destroy();
+        this.deactivate();
+        for(var prop in this) {
+            this[prop] = null;
+        }
+    },
+    
+    /** 
+     * Method: setMap
+     * Set the map property for the control and <previous> and <next> child
+     *     controls.
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        this.map = map;
+        this.next.setMap(map);
+        this.previous.setMap(map);
+    },
+
+    /**
+     * Method: draw
+     * Called when the control is added to the map.
+     */
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        this.next.draw();
+        this.previous.draw();
+    },
+    
+    /**
+     * Method: previousTrigger
+     * Restore the previous state.  If no items are in the previous history
+     *     stack, this has no effect.
+     *
+     * Returns:
+     * {Object} Item representing state that was restored.  Undefined if no
+     *     items are in the previous history stack.
+     */
+    previousTrigger: function() {
+        var current = this.previousStack.shift();
+        var state = this.previousStack.shift();
+        if(state != undefined) {
+            this.nextStack.unshift(current);
+            this.previousStack.unshift(state);
+            this.restoring = true;
+            this.restore(state);
+            this.restoring = false;
+            this.onNextChange(this.nextStack[0], this.nextStack.length);
+            this.onPreviousChange(
+                this.previousStack[1], this.previousStack.length - 1
+            );
+        } else {
+            this.previousStack.unshift(current);
+        }
+        return state;
+    },
+    
+    /**
+     * APIMethod: nextTrigger
+     * Restore the next state.  If no items are in the next history
+     *     stack, this has no effect.  The next history stack is populated
+     *     as states are restored from the previous history stack.
+     *
+     * Returns:
+     * {Object} Item representing state that was restored.  Undefined if no
+     *     items are in the next history stack.
+     */
+    nextTrigger: function() {
+        var state = this.nextStack.shift();
+        if(state != undefined) {
+            this.previousStack.unshift(state);
+            this.restoring = true;
+            this.restore(state);
+            this.restoring = false;
+            this.onNextChange(this.nextStack[0], this.nextStack.length);
+            this.onPreviousChange(
+                this.previousStack[1], this.previousStack.length - 1
+            );
+        }
+        return state;
+    },
+    
+    /**
+     * APIMethod: clear
+     * Clear history.
+     */
+    clear: function() {
+        this.previousStack = [];
+        this.previous.deactivate();
+        this.nextStack = [];
+        this.next.deactivate();
+    },
+
+    /**
+     * Method: getState
+     * Get the current state and return it.
+     *
+     * Returns:
+     * {Object} An object representing the current state.
+     */
+    getState: function() {
+        return {
+            center: this.map.getCenter(),
+            resolution: this.map.getResolution(),
+            projection: this.map.getProjectionObject(),
+            units: this.map.getProjectionObject().getUnits() || 
+                this.map.units || this.map.baseLayer.units
+        };
+    },
+
+    /**
+     * Method: restore
+     * Update the state with the given object.
+     *
+     * Parameters:
+     * state - {Object} An object representing the state to restore.
+     */
+    restore: function(state) {
+        var center, zoom;
+        if (this.map.getProjectionObject() == state.projection) { 
+            zoom = this.map.getZoomForResolution(state.resolution);
+            center = state.center;
+        } else {
+            center = state.center.clone();
+            center.transform(state.projection, this.map.getProjectionObject());
+            var sourceUnits = state.units;
+            var targetUnits = this.map.getProjectionObject().getUnits() || 
+                this.map.units || this.map.baseLayer.units;
+            var resolutionFactor = sourceUnits && targetUnits ? 
+                OpenLayers.INCHES_PER_UNIT[sourceUnits] / OpenLayers.INCHES_PER_UNIT[targetUnits] : 1;
+            zoom = this.map.getZoomForResolution(resolutionFactor*state.resolution); 
+        }
+        this.map.setCenter(center, zoom);
+    },
+    
+    /**
+     * Method: setListeners
+     * Sets functions to be registered in the listeners object.
+     */
+    setListeners: function() {
+        this.listeners = {};
+        for(var type in this.registry) {
+            this.listeners[type] = OpenLayers.Function.bind(function() {
+                if(!this.restoring) {
+                    var state = this.registry[type].apply(this, arguments);
+                    this.previousStack.unshift(state);
+                    if(this.previousStack.length > 1) {
+                        this.onPreviousChange(
+                            this.previousStack[1], this.previousStack.length - 1
+                        );
+                    }
+                    if(this.previousStack.length > (this.limit + 1)) {
+                        this.previousStack.pop();
+                    }
+                    if(this.nextStack.length > 0) {
+                        this.nextStack = [];
+                        this.onNextChange(null, 0);
+                    }
+                }
+                return true;
+            }, this);
+        }
+    },
+
+    /**
+     * APIMethod: activate
+     * Activate the control.  This registers any listeners.
+     *
+     * Returns:
+     * {Boolean} Control successfully activated.
+     */
+    activate: function() {
+        var activated = false;
+        if(this.map) {
+            if(OpenLayers.Control.prototype.activate.apply(this)) {
+                if(this.listeners == null) {
+                    this.setListeners();
+                }
+                for(var type in this.listeners) {
+                    this.map.events.register(type, this, this.listeners[type]);
+                }
+                activated = true;
+                if(this.previousStack.length == 0) {
+                    this.initStack();
+                }
+            }
+        }
+        return activated;
+    },
+    
+    /**
+     * Method: initStack
+     * Called after the control is activated if the previous history stack is
+     *     empty.
+     */
+    initStack: function() {
+        if(this.map.getCenter()) {
+            this.listeners.moveend();
+        }
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control.  This unregisters any listeners.
+     *
+     * Returns:
+     * {Boolean} Control successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(this.map) {
+            if(OpenLayers.Control.prototype.deactivate.apply(this)) {
+                for(var type in this.listeners) {
+                    this.map.events.unregister(
+                        type, this, this.listeners[type]
+                    );
+                }
+                if(this.clearOnDeactivate) {
+                    this.clear();
+                }
+                deactivated = true;
+            }
+        }
+        return deactivated;
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.NavigationHistory"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMTSGetFeatureInfo.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMTSGetFeatureInfo.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/WMTSGetFeatureInfo.js	(revision 76)
@@ -0,0 +1,442 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Click.js
+ * @requires OpenLayers/Handler/Hover.js
+ * @requires OpenLayers/Request.js
+ * @requires OpenLayers/Format/WMSGetFeatureInfo.js
+ */
+
+/**
+ * Class: OpenLayers.Control.WMTSGetFeatureInfo
+ * The WMTSGetFeatureInfo control uses a WMTS query to get information about a 
+ *     point on the map.  The information may be in a display-friendly format 
+ *     such as HTML, or a machine-friendly format such as GML, depending on the 
+ *     server's capabilities and the client's configuration.  This control 
+ *     handles click or hover events, attempts to parse the results using an 
+ *     OpenLayers.Format, and fires a 'getfeatureinfo' event for each layer
+ *     queried.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.WMTSGetFeatureInfo = OpenLayers.Class(OpenLayers.Control, {
+
+   /**
+     * APIProperty: hover
+     * {Boolean} Send GetFeatureInfo requests when mouse stops moving.
+     *     Default is false.
+     */
+    hover: false,
+    
+    /**
+     * Property: requestEncoding
+     * {String} One of "KVP" or "REST".  Only KVP encoding is supported at this 
+     *     time.
+     */
+    requestEncoding: "KVP",
+
+    /**
+     * APIProperty: drillDown
+     * {Boolean} Drill down over all WMTS layers in the map. When
+     *     using drillDown mode, hover is not possible.  A getfeatureinfo event
+     *     will be fired for each layer queried.
+     */
+    drillDown: false,
+
+    /**
+     * APIProperty: maxFeatures
+     * {Integer} Maximum number of features to return from a WMTS query. This
+     *     sets the feature_count parameter on WMTS GetFeatureInfo
+     *     requests.
+     */
+    maxFeatures: 10,
+
+    /** APIProperty: clickCallback
+     *  {String} The click callback to register in the
+     *      {<OpenLayers.Handler.Click>} object created when the hover
+     *      option is set to false. Default is "click".
+     */
+    clickCallback: "click",
+    
+    /**
+     * Property: layers
+     * {Array(<OpenLayers.Layer.WMTS>)} The layers to query for feature info.
+     *     If omitted, all map WMTS layers will be considered.
+     */
+    layers: null,
+
+    /**
+     * APIProperty: queryVisible
+     * {Boolean} Filter out hidden layers when searching the map for layers to 
+     *     query.  Default is true.
+     */
+    queryVisible: true,
+
+    /**
+     * Property: infoFormat
+     * {String} The mimetype to request from the server
+     */
+    infoFormat: 'text/html',
+    
+    /**
+     * Property: vendorParams
+     * {Object} Additional parameters that will be added to the request, for
+     * WMTS implementations that support them. This could e.g. look like
+     * (start code)
+     * {
+     *     radius: 5
+     * }
+     * (end)
+     */
+    vendorParams: {},
+    
+    /**
+     * Property: format
+     * {<OpenLayers.Format>} A format for parsing GetFeatureInfo responses.
+     *     Default is <OpenLayers.Format.WMSGetFeatureInfo>.
+     */
+    format: null,
+    
+    /**
+     * Property: formatOptions
+     * {Object} Optional properties to set on the format (if one is not provided
+     *     in the <format> property.
+     */
+    formatOptions: null,
+
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Additional options for the handlers used by this control, e.g.
+     * (start code)
+     * {
+     *     "click": {delay: 100},
+     *     "hover": {delay: 300}
+     * }
+     * (end)
+     */
+    handlerOptions: null,
+    
+    /**
+     * Property: handler
+     * {Object} Reference to the <OpenLayers.Handler> for this control
+     */
+    handler: null,
+    
+    /**
+     * Property: hoverRequest
+     * {<OpenLayers.Request>} contains the currently running hover request
+     *     (if any).
+     */
+    hoverRequest: null,
+    
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types (in addition to those from <OpenLayers.Control>):
+     * beforegetfeatureinfo - Triggered before each request is sent.
+     *      The event object has an *xy* property with the position of the 
+     *      mouse click or hover event that triggers the request and a *layer*
+     *      property referencing the layer about to be queried.  If a listener
+     *      returns false, the request will not be issued.
+     * getfeatureinfo - Triggered when a GetFeatureInfo response is received.
+     *      The event object has a *text* property with the body of the
+     *      response (String), a *features* property with an array of the
+     *      parsed features, an *xy* property with the position of the mouse
+     *      click or hover event that triggered the request, a *layer* property
+     *      referencing the layer queried and a *request* property with the 
+     *      request itself. If drillDown is set to true, one event will be fired
+     *      for each layer queried.
+     * exception - Triggered when a GetFeatureInfo request fails (with a 
+     *      status other than 200) or whenparsing fails.  Listeners will receive 
+     *      an event with *request*, *xy*, and *layer*  properties.  In the case 
+     *      of a parsing error, the event will also contain an *error* property.
+     */
+    EVENT_TYPES: ["beforegetfeatureinfo", "getfeatureinfo", "exception"],
+    
+    /** 
+     * Property: pending
+     * {Number}  The number of pending requests.
+     */
+    pending: 0,
+
+    /**
+     * Constructor: <OpenLayers.Control.WMTSGetFeatureInfo>
+     *
+     * Parameters:
+     * options - {Object} 
+     */
+    initialize: function(options) {
+        // concatenate events specific to vector with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.WMTSGetFeatureInfo.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+
+        options = options || {};
+        options.handlerOptions = options.handlerOptions || {};
+
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        if (!this.format) {
+            this.format = new OpenLayers.Format.WMSGetFeatureInfo(
+                options.formatOptions
+            );
+        }
+        
+        if (this.drillDown === true) {
+            this.hover = false;
+        }
+
+        if (this.hover) {
+            this.handler = new OpenLayers.Handler.Hover(
+                this, {
+                    move: this.cancelHover,
+                    pause: this.getInfoForHover
+                },
+                OpenLayers.Util.extend(
+                    this.handlerOptions.hover || {}, {delay: 250}
+                )
+            );
+        } else {
+            var callbacks = {};
+            callbacks[this.clickCallback] = this.getInfoForClick;
+            this.handler = new OpenLayers.Handler.Click(
+                this, callbacks, this.handlerOptions.click || {}
+            );
+        }
+    },
+
+    /**
+     * Method: activate
+     * Activates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively activated.
+     */
+    activate: function () {
+        if (!this.active) {
+            this.handler.activate();
+        }
+        return OpenLayers.Control.prototype.activate.apply(
+            this, arguments
+        );
+    },
+
+    /**
+     * Method: deactivate
+     * Deactivates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively deactivated.
+     */
+    deactivate: function () {
+        return OpenLayers.Control.prototype.deactivate.apply(
+            this, arguments
+        );
+    },
+    
+    /**
+     * Method: getInfoForClick 
+     * Called on click
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    getInfoForClick: function(evt) {
+        this.request(evt.xy, {});
+    },
+   
+    /**
+     * Method: getInfoForHover
+     * Pause callback for the hover handler
+     *
+     * Parameters:
+     * evt - {Object}
+     */
+    getInfoForHover: function(evt) {
+        this.request(evt.xy, {hover: true});
+    },
+
+    /**
+     * Method: cancelHover
+     * Cancel callback for the hover handler
+     */
+    cancelHover: function() {
+        if (this.hoverRequest) {
+            --this.pending;
+            if (this.pending <= 0) {
+                OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+                this.pending = 0;
+            }            
+            this.hoverRequest.abort();
+            this.hoverRequest = null;
+        }
+    },
+
+    /**
+     * Method: findLayers
+     * Internal method to get the layers, independent of whether we are
+     *     inspecting the map or using a client-provided array
+     */
+    findLayers: function() {
+        var candidates = this.layers || this.map.layers;
+        var layers = [];
+        var layer;
+        for (var i=candidates.length-1; i>=0; --i) {
+            layer = candidates[i];
+            if (layer instanceof OpenLayers.Layer.WMTS &&
+                layer.requestEncoding === this.requestEncoding &&
+                (!this.queryVisible || layer.getVisibility())) {
+                layers.push(layer);
+                if (!this.drillDown || this.hover) {
+                    break;
+                }
+            }
+        }
+        return layers;
+    },
+    
+    /**
+     * Method: buildRequestOptions
+     * Build an object with the relevant options for the GetFeatureInfo request.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.WMTS>} A WMTS layer.
+     * xy - {<OpenLayers.Pixel>} The position on the map where the 
+     *     mouse event occurred.
+     */
+    buildRequestOptions: function(layer, xy) {
+        var loc = this.map.getLonLatFromPixel(xy);
+        var getTileUrl = layer.getURL(
+            new OpenLayers.Bounds(loc.lon, loc.lat, loc.lon, loc.lat)
+        );
+        var params = OpenLayers.Util.getParameters(getTileUrl);
+        var tileInfo = layer.getTileInfo(loc);
+        OpenLayers.Util.extend(params, {
+            service: "WMTS",
+            version: layer.version,
+            request: "GetFeatureInfo",
+            infoFormat: this.infoFormat,
+            i: tileInfo.i,
+            j: tileInfo.j
+        });
+        OpenLayers.Util.applyDefaults(params, this.vendorParams);
+        return {
+            url: layer.url instanceof Array ? layer.url[0] : layer.url,
+            params: OpenLayers.Util.upperCaseObject(params),
+            callback: function(request) {
+                this.handleResponse(xy, request, layer);
+            },
+            scope: this
+        };
+    },
+
+    /**
+     * Method: request
+     * Sends a GetFeatureInfo request to the WMTS
+     * 
+     * Parameters:
+     * xy - {<OpenLayers.Pixel>} The position on the map where the mouse event 
+     *     occurred.
+     * options - {Object} additional options for this method.
+     * 
+     * Valid options:
+     * - *hover* {Boolean} true if we do the request for the hover handler
+     */
+    request: function(xy, options) {
+        options = options || {};
+        var layers = this.findLayers();
+        if (layers.length > 0) {
+            var issue, layer;
+            for (var i=0, len=layers.length; i<len; i++) {
+                layer = layers[i];
+                issue = this.events.triggerEvent("beforegetfeatureinfo", {
+                    xy: xy,
+                    layer: layer
+                });
+                if (issue !== false) {
+                    ++this.pending;
+                    var requestOptions = this.buildRequestOptions(layer, xy);
+                    var request = OpenLayers.Request.GET(requestOptions);
+                    if (options.hover === true) {
+                        this.hoverRequest = request;
+                    }
+                }
+            }
+            if (this.pending > 0) {
+                OpenLayers.Element.addClass(this.map.viewPortDiv, "olCursorWait");
+            }
+        }
+    },
+
+    /**
+     * Method: handleResponse
+     * Handler for the GetFeatureInfo response.
+     * 
+     * Parameters:
+     * xy - {<OpenLayers.Pixel>} The position on the map where the mouse event 
+     *     occurred.
+     * request - {XMLHttpRequest} The request object.
+     * layer - {<OpenLayers.Layer.WMTS>} The queried layer.
+     */
+    handleResponse: function(xy, request, layer) {
+        --this.pending;
+        if (this.pending <= 0) {
+            OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+            this.pending = 0;
+        }
+        if (request.status && (request.status < 200 || request.status >= 300)) {
+            this.events.triggerEvent("exception", {
+                xy: xy, 
+                request: request,
+                layer: layer
+            });
+        } else {
+            var doc = request.responseXML;
+            if (!doc || !doc.documentElement) {
+                doc = request.responseText;
+            }
+            var features, except;
+            try {
+                features = this.format.read(doc);
+            } catch (error) {
+                except = true;
+                this.events.triggerEvent("exception", {
+                    xy: xy,
+                    request: request,
+                    error: error,
+                    layer: layer
+                });
+            }
+            if (!except) {
+                this.events.triggerEvent("getfeatureinfo", {
+                    text: request.responseText,
+                    features: features,
+                    request: request,
+                    xy: xy,
+                    layer: layer
+                });
+            }
+        }
+    },
+   
+    /** 
+     * Method: setMap
+     * Set the map property for the control. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        this.handler.setMap(map);
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.WMTSGetFeatureInfo"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SLDSelect.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SLDSelect.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/SLDSelect.js	(revision 76)
@@ -0,0 +1,570 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Layer/WMS/Post.js
+ * @requires OpenLayers/Handler/RegularPolygon.js
+ * @requires OpenLayers/Handler/Polygon.js
+ * @requires OpenLayers/Handler/Path.js
+ * @requires OpenLayers/Handler/Click.js
+ * @requires OpenLayers/Filter/Spatial.js
+ */
+
+/**
+ * Class: OpenLayers.Control.SLDSelect
+ * Perform selections on WMS layers using Styled Layer Descriptor (SLD)
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.SLDSelect = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * control.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * Supported control event types (in addition to those from 
+     * <OpenLayers.Control>):
+     * selected - Triggered when a selection occurs.  Listeners receive an 
+     *     event with *filters* and *layer* properties.  Filters will be an 
+     *     array of OpenLayers.Filter objects created in order to perform 
+     *     the particular selection.
+     */
+    EVENT_TYPES: ["selected"],
+
+    /**
+     * APIProperty: clearOnDeactivate
+     * {Boolean} Should the selection be cleared when the control is 
+     *     deactivated. Default value is false.
+     */
+    clearOnDeactivate: false,
+
+    /**
+     * APIProperty: layers
+     * {Array(<OpenLayers.Layer.WMS>)} The WMS layers this control will work 
+     *     on.
+     */
+    layers: null,
+
+    /**
+     * Property: callbacks
+     * {Object} The functions that are sent to the handler for callback
+     */
+    callbacks: null,
+
+    /**
+     * APIProperty: selectionSymbolizer
+     * {Object} Determines the styling of the selected objects. Default is
+     *     a selection in red.
+     */
+    selectionSymbolizer: {
+        'Polygon': {fillColor: '#FF0000', stroke: false},
+        'Line': {strokeColor: '#FF0000', strokeWidth: 2},
+        'Point': {graphicName: 'square', fillColor: '#FF0000', pointRadius: 5}
+    },
+
+    /**
+     * APIProperty: layerOptions
+     * {Object} The options to apply to the selection layer, by default the
+     *     selection layer will be kept out of the layer switcher.
+     */
+    layerOptions: null,
+
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Used to set non-default properties on the control's handler
+     */
+    handlerOptions: null,
+
+    /**
+     * APIProperty: sketchStyle
+     * {<OpenLayers.Style>|Object} Style or symbolizer to use for the sketch
+     * handler. The recommended way of styling the sketch layer, however, is
+     * to configure an <OpenLayers.StyleMap> in the layerOptions of the
+     * <handlerOptions>:
+     * 
+     * (code)
+     * new OpenLayers.Control.SLDSelect(OpenLayers.Handler.Path, {
+     *     handlerOptions: {
+     *         layerOptions: {
+     *             styleMap: new OpenLayers.StyleMap({
+     *                 "default": {strokeColor: "yellow"}
+     *             });
+     *         }
+     *     }
+     * });
+     * (end)
+     */
+    sketchStyle: null,
+
+    /**
+     * APIProperty: wfsCache
+     * {Object} Cache to use for storing parsed results from
+     *     <OpenLayers.Format.WFSDescribeFeatureType.read>. If not provided,
+     *     these will be cached on the prototype.
+     */
+    wfsCache: {},
+
+    /**
+     * APIProperty: layerCache
+     * {Object} Cache to use for storing references to the selection layers.
+     *     Normally each source layer will have exactly 1 selection layer of
+     *     type OpenLayers.Layer.WMS.Post. If not provided, layers will
+     *     be cached on the prototype. Note that if <clearOnDeactivate> is
+     *     true, the layer will no longer be cached after deactivating the
+     *     control.
+     */
+    layerCache: {},
+
+    /**
+     * Constructor: OpenLayers.Control.SLDSelect
+     * Create a new control for selecting features in WMS layers using
+     *     Styled Layer Descriptor (SLD).
+     *
+     * Parameters:
+     * handler - {<OpenLayers.Class>} A sketch handler class. This determines
+     *     the type of selection, e.g. box (<OpenLayers.Handler.Box>), point
+     *     (<OpenLayers.Handler.Point>), path (<OpenLayers.Handler.Path>) or
+     *     polygon (<OpenLayers.Handler.Polygon>) selection. To use circle
+     *     type selection, use <OpenLayers.Handler.RegularPolygon> and pass
+     *     the number of desired sides (e.g. 40) as "sides" property to the
+     *     <handlerOptions>.
+     * options - {Object} An object containing all configuration properties for
+     *     the control.
+     *
+     * Valid options:
+     * layers - Array({<OpenLayers.Layer.WMS>}) The layers to perform the
+     *     selection on.
+     */
+    initialize: function(handler, options) {
+        // concatenate events specific to this control with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.SLDSelect.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+
+        this.callbacks = OpenLayers.Util.extend({done: this.select, 
+            click: this.select}, this.callbacks);
+        this.handlerOptions = this.handlerOptions || {};
+        this.layerOptions = OpenLayers.Util.applyDefaults(this.layerOptions, {
+            displayInLayerSwitcher: false
+        });
+        if (this.sketchStyle) {
+            this.handlerOptions.layerOptions = OpenLayers.Util.applyDefaults(
+                this.handlerOptions.layerOptions,
+                {styleMap: new OpenLayers.StyleMap({"default": this.sketchStyle})}
+            );
+        }
+        this.handler = new handler(this, this.callbacks, this.handlerOptions);
+    },
+
+    /**
+     * APIMethod: destroy
+     * Take care of things that are not handled in superclass.
+     */
+    destroy: function() {
+        for (var key in this.layerCache) {
+            delete this.layerCache[key];
+        }
+        for (var key in this.wfsCache) {
+            delete this.wfsCache[key];
+        }
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: coupleLayerVisiblity
+     * Couple the selection layer and the source layer with respect to
+     *     layer visibility. So if the source layer is turned off, the
+     *     selection layer is also turned off.
+     *
+     * Parameters:
+     * evt - {Object}
+     */
+    coupleLayerVisiblity: function(evt) {
+        this.setVisibility(evt.object.getVisibility());
+    },
+
+    /**
+     * Method: createSelectionLayer
+     * Creates a "clone" from the source layer in which the selection can
+     * be drawn. This ensures both the source layer and the selection are 
+     * visible and not only the selection.
+     *
+     * Parameters:
+     * source - {<OpenLayers.Layer.WMS>} The source layer on which the selection
+     *     is performed.
+     *
+     * Returns:
+     * {<OpenLayers.Layer.WMS.Post>} A WMS Post layer since SLD selections can
+     *     easily get quite long.
+     */
+    createSelectionLayer: function(source) {
+        // check if we already have a selection layer for the source layer
+        var selectionLayer;
+        if (!this.layerCache[source.id]) {
+            selectionLayer = new OpenLayers.Layer.WMS.Post(source.name, 
+                source.url, source.params, 
+                OpenLayers.Util.applyDefaults(
+                    this.layerOptions,
+                    source.getOptions())
+            );
+            this.layerCache[source.id] = selectionLayer;
+            // make sure the layers are coupled wrt visibility, but only
+            // if they are not displayed in the layer switcher, because in
+            // that case the user cannot control visibility.
+            if (this.layerOptions.displayInLayerSwitcher === false) {
+                source.events.on({
+                    "visibilitychanged": this.coupleLayerVisiblity,
+                    scope: selectionLayer});
+            }
+            this.map.addLayer(selectionLayer);
+        } else {
+            selectionLayer = this.layerCache[source.id];
+        }
+        return selectionLayer;
+    },
+
+    /**
+     * Method: createSLD
+     * Create the SLD document for the layer using the supplied filters.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.WMS>}
+     * filters - Array({<OpenLayers.Filter>}) The filters to be applied.
+     * geometryAttributes - Array({Object}) The geometry attributes of the 
+     *     layer.
+     *
+     * Returns:
+     * {String} The SLD document generated as a string.
+     */
+    createSLD: function(layer, filters, geometryAttributes) {
+        var sld = {version: "1.0.0", namedLayers: {}};
+        var layerNames = [layer.params.LAYERS].join(",").split(",");
+        for (var i=0, len=layerNames.length; i<len; i++) { 
+            var name = layerNames[i];
+            sld.namedLayers[name] = {name: name, userStyles: []};
+            var symbolizer = this.selectionSymbolizer;
+            var geometryAttribute = geometryAttributes[i];
+            if (geometryAttribute.type.indexOf('Polygon') >= 0) {
+                symbolizer = {Polygon: this.selectionSymbolizer['Polygon']};
+            } else if (geometryAttribute.type.indexOf('LineString') >= 0) {
+                symbolizer = {Line: this.selectionSymbolizer['Line']};
+            } else if (geometryAttribute.type.indexOf('Point') >= 0) {
+                symbolizer = {Point: this.selectionSymbolizer['Point']};
+            }
+            var filter = filters[i];
+            sld.namedLayers[name].userStyles.push({name: 'default', rules: [
+                new OpenLayers.Rule({symbolizer: symbolizer, 
+                    filter: filter, 
+                    maxScaleDenominator: layer.options.minScale})
+            ]});
+        }
+        return new OpenLayers.Format.SLD().write(sld);
+    },
+
+    /**
+     * Method: parseDescribeLayer
+     * Parse the SLD WMS DescribeLayer response and issue the corresponding
+     *     WFS DescribeFeatureType request
+     *
+     * request - {XMLHttpRequest} The request object.
+     */
+    parseDescribeLayer: function(request) {
+        var format = new OpenLayers.Format.WMSDescribeLayer();
+        var doc = request.responseXML;
+        if(!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        var describeLayer = format.read(doc);
+        var typeNames = [];
+        var url = null;
+        for (var i=0, len=describeLayer.length; i<len; i++) {
+            // perform a WFS DescribeFeatureType request
+            if (describeLayer[i].owsType == "WFS") {
+                typeNames.push(describeLayer[i].typeName);
+                url = describeLayer[i].owsURL;
+            }
+        }
+        var options = {
+            url: url,
+            params: {
+                SERVICE: "WFS",
+                TYPENAME: typeNames.toString(),
+                REQUEST: "DescribeFeatureType",
+                VERSION: "1.0.0"
+            },
+            callback: function(request) {
+                var format = new OpenLayers.Format.WFSDescribeFeatureType();
+                var doc = request.responseXML;
+                if(!doc || !doc.documentElement) {
+                    doc = request.responseText;
+                }
+                var describeFeatureType = format.read(doc);
+                this.control.wfsCache[this.layer.id] = describeFeatureType;
+                this.control._queue && this.control.applySelection();
+            },
+            scope: this
+        };
+        OpenLayers.Request.GET(options);
+    },
+
+   /**
+    * Method: getGeometryAttributes
+    * Look up the geometry attributes from the WFS DescribeFeatureType response
+    *
+    * Parameters:
+    * layer - {<OpenLayers.Layer.WMS>} The layer for which to look up the 
+    *     geometry attributes.
+    *
+    * Returns:
+    * Array({Object}) Array of geometry attributes
+    */ 
+   getGeometryAttributes: function(layer) {
+        var result = [];
+        var cache = this.wfsCache[layer.id];
+        for (var i=0, len=cache.featureTypes.length; i<len; i++) {
+            var typeName = cache.featureTypes[i];
+            var properties = typeName.properties;
+            for (var j=0, lenj=properties.length; j < lenj; j++) {
+                var property = properties[j];
+                var type = property.type;
+                if ((type.indexOf('LineString') >= 0) ||
+                    (type.indexOf('GeometryAssociationType') >=0) ||
+                    (type.indexOf('GeometryPropertyType') >= 0) ||
+                    (type.indexOf('Point') >= 0) ||
+                    (type.indexOf('Polygon') >= 0) ) {
+                        result.push(property);
+                }
+            }
+        }
+        return result;
+    },
+
+    /**
+     * APIMethod: activate
+     * Activate the control. Activating the control will perform a SLD WMS
+     *     DescribeLayer request followed by a WFS DescribeFeatureType request
+     *     so that the proper symbolizers can be chosen based on the geometry
+     *     type.
+     */
+    activate: function() {
+        var activated = OpenLayers.Control.prototype.activate.call(this);
+        if(activated) {
+            for (var i=0, len=this.layers.length; i<len; i++) {
+                var layer = this.layers[i];
+                if (layer && !this.wfsCache[layer.id]) {
+                    var options = {
+                        url: layer.url,
+                        params: {
+                            SERVICE: "WMS",
+                            VERSION: layer.params.VERSION,
+                            LAYERS: layer.params.LAYERS,
+                            REQUEST: "DescribeLayer"
+                        },
+                        callback: this.parseDescribeLayer,
+                        scope: {layer: layer, control: this}
+                    };
+                    OpenLayers.Request.GET(options);
+                }
+            }
+        }
+        return activated;
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control. If clearOnDeactivate is true, remove the
+     *     selection layer(s).
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Control.prototype.deactivate.call(this);
+        if(deactivated) {
+            for (var i=0, len=this.layers.length; i<len; i++) {
+                var layer = this.layers[i];
+                if (layer && this.clearOnDeactivate === true) {
+                    var layerCache = this.layerCache;
+                    var selectionLayer = layerCache[layer.id];
+                    if (selectionLayer) {
+                        layer.events.un({
+                            "visibilitychanged": this.coupleLayerVisiblity,
+                            scope: selectionLayer});
+                        selectionLayer.destroy();
+                        delete layerCache[layer.id];
+                    }
+                }
+            }
+        }
+        return deactivated;
+    },
+
+    /**
+     * APIMethod: setLayers
+     * Set the layers on which the selection should be performed.  Call the 
+     *     setLayers method if the layer(s) to be used change and the same 
+     *     control should be used on a new set of layers.
+     *     If the control is already active, it will be active after the new
+     *     set of layers is set.
+     *
+     * Parameters:
+     * layers - {Array(<OpenLayers.Layer.WMS>)}  The new set of layers on which 
+     *     the selection should be performed.
+     */
+    setLayers: function(layers) {
+        if(this.active) {
+            this.deactivate();
+            this.layers = layers;
+            this.activate();
+        } else {
+            this.layers = layers;
+        }
+    },
+
+    /**
+     * Function: createFilter
+     * Create the filter to be used in the SLD.
+     *
+     * Parameters:
+     * geometryAttribute - {Object} Used to get the name of the geometry 
+     *     attribute which is needed for constructing the spatial filter.
+     * geometry - {<OpenLayers.Geometry>} The geometry to use.
+     *
+     * Returns:
+     * {<OpenLayers.Filter.Spatial>} The spatial filter created.
+     */
+    createFilter: function(geometryAttribute, geometry) {
+        var filter = null;
+        if (this.handler instanceof OpenLayers.Handler.RegularPolygon) {
+            // box
+            if (this.handler.irregular === true) {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.BBOX,
+                    property: geometryAttribute.name,
+                    value: geometry.getBounds()}
+                );
+            } else {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.INTERSECTS,
+                    property: geometryAttribute.name,
+                    value: geometry}
+                );
+            }
+        } else if (this.handler instanceof OpenLayers.Handler.Polygon) {
+            filter = new OpenLayers.Filter.Spatial({
+                type: OpenLayers.Filter.Spatial.INTERSECTS,
+                property: geometryAttribute.name,
+                value: geometry}
+            );
+        } else if (this.handler instanceof OpenLayers.Handler.Path) {
+            // if source layer is point based, use DWITHIN instead
+            if (geometryAttribute.type.indexOf('Point') >= 0) {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.DWITHIN,
+                    property: geometryAttribute.name,
+                    distance: this.map.getExtent().getWidth()*0.01 ,
+                    distanceUnits: this.map.getUnits(),
+                    value: geometry}
+                );
+            } else {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.INTERSECTS,
+                    property: geometryAttribute.name,
+                    value: geometry}
+                );
+            }
+        } else if (this.handler instanceof OpenLayers.Handler.Click) {
+            if (geometryAttribute.type.indexOf('Polygon') >= 0) {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.INTERSECTS,
+                    property: geometryAttribute.name,
+                    value: geometry}
+                );
+            } else {
+                filter = new OpenLayers.Filter.Spatial({
+                    type: OpenLayers.Filter.Spatial.DWITHIN,
+                    property: geometryAttribute.name,
+                    distance: this.map.getExtent().getWidth()*0.01 ,
+                    distanceUnits: this.map.getUnits(),
+                    value: geometry}
+                );
+            }
+        }
+        return filter;
+    },
+
+    /**
+     * Method: select
+     * When the handler is done, use SLD_BODY on the selection layer to
+     *     display the selection in the map.
+     *
+     * Parameters:
+     * geometry - {Object} or {<OpenLayers.Geometry>}
+     */
+    select: function(geometry) {
+        this._queue = function() {
+            for (var i=0, len=this.layers.length; i<len; i++) {
+                var layer = this.layers[i];
+                var geometryAttributes = this.getGeometryAttributes(layer);
+                var filters = [];
+                for (var j=0, lenj=geometryAttributes.length; j<lenj; j++) {
+                    var geometryAttribute = geometryAttributes[j];
+                    if (geometryAttribute !== null) {
+                        // from the click handler we will not get an actual 
+                        // geometry so transform
+                        if (!(geometry instanceof OpenLayers.Geometry)) {
+                            var point = this.map.getLonLatFromPixel(
+                                geometry.xy);
+                            geometry = new OpenLayers.Geometry.Point(
+                                point.lon, point.lat);
+                        }
+                        var filter = this.createFilter(geometryAttribute,
+                        geometry);
+                        if (filter !== null) {
+                            filters.push(filter);
+                        }
+                    }
+                }
+    
+                var selectionLayer = this.createSelectionLayer(layer);
+                var sld = this.createSLD(layer, filters, geometryAttributes);
+    
+                this.events.triggerEvent("selected", {
+                    layer: layer,
+                    filters: filters
+                });
+    
+                selectionLayer.mergeNewParams({SLD_BODY: sld});
+                delete this._queue;
+            }
+        };
+        this.applySelection();
+    },
+    
+    /**
+     * Method: applySelection
+     * Checks if all required wfs data is cached, and applies the selection
+     */
+    applySelection: function() {
+        var canApply = true;
+        for (var i=0, len=this.layers.length; i<len; i++) {
+            if(!this.wfsCache[this.layers[i].id]) {
+                canApply = false;
+                break;
+            }
+        }
+        canApply && this._queue.call(this);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.SLDSelect"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomToMaxExtent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomToMaxExtent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomToMaxExtent.js	(revision 76)
@@ -0,0 +1,40 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ZoomToMaxExtent 
+ * The ZoomToMaxExtent control is a button that zooms out to the maximum
+ * extent of the map. It is designed to be used with a 
+ * <OpenLayers.Control.Panel>.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ZoomToMaxExtent = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Property: type
+     * {String} The type of <OpenLayers.Control> -- When added to a 
+     *     <Control.Panel>, 'type' is used by the panel to determine how to 
+     *     handle our events.
+     */
+    type: OpenLayers.Control.TYPE_BUTTON,
+    
+    /*
+     * Method: trigger
+     * Do the zoom.
+     */
+    trigger: function() {
+        if (this.map) {
+            this.map.zoomToMaxExtent();
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ZoomToMaxExtent"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/TransformFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/TransformFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/TransformFeature.js	(revision 76)
@@ -0,0 +1,579 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/DragFeature.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Geometry/LineString.js
+ * @requires OpenLayers/Geometry/Point.js
+ */
+
+/**
+ * Class: OpenLayers.Control.TransformFeature
+ * Control to transform features with a standard transformation box.
+ *
+ * Inherits From:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.TransformFeature = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types:
+     *  - *beforesetfeature* Triggered before a feature is set for
+     *      tranformation. The feature will not be set if a listener returns
+     *      false. Listeners receive a *feature* property, with the feature
+     *      that will be set for transformation. Listeners are allowed to
+     *      set the control's *scale*, *ratio* and *rotation* properties,
+     *      which will set the initial scale, ratio and rotation of the
+     *      feature, like the <setFeature> method's initialParams argument.
+     *  - *setfeature* Triggered when a feature is set for tranformation.
+     *      Listeners receive a *feature* property, with the feature that
+     *      is now set for transformation.
+     *  - *beforetransform* Triggered while dragging, before a feature is
+     *      transformed. The feature will not be transformed if a listener
+     *      returns false (but the box still will). Listeners receive one or
+     *      more of *center*, *scale*, *ratio* and *rotation*. The *center*
+     *      property is an <OpenLayers.Geometry.Point> object with the new
+     *      center of the transformed feature, the others are Floats with the
+     *      scale, ratio or rotation change since the last transformation.
+     *  - *transform* Triggered while dragging, when a feature is transformed.
+     *      Listeners receive an event object with one or more of *center*,
+     *      *scale*, *ratio* and *rotation*. The *center* property is an
+     *      <OpenLayers.Geometry.Point> object with the new center of the
+     *      transformed feature, the others are Floats with the scale, ratio
+     *      or rotation change of the feature since the last transformation.
+     *  - *transformcomplete* Triggered after dragging. Listeners receive
+     *      an event object with the transformed *feature*.
+     */
+    EVENT_TYPES: ["beforesetfeature", "setfeature", "beforetransform",
+        "transform", "transformcomplete"],
+
+    /**
+     * APIProperty: geometryTypes
+     * {Array(String)} To restrict transformation to a limited set of geometry
+     *     types, send a list of strings corresponding to the geometry class
+     *     names.
+     */
+    geometryTypes: null,
+
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>}
+     */
+    layer: null,
+    
+    /**
+     * APIProperty: preserveAspectRatio
+     * {Boolean} set to true to not change the feature's aspect ratio.
+     */
+    preserveAspectRatio: false,
+    
+    /**
+     * APIProperty: rotate
+     * {Boolean} set to false if rotation should be disabled. Default is true.
+     *     To be passed with the constructor or set when the control is not
+     *     active.
+     */
+    rotate: true,
+    
+    /**
+     * APIProperty: feature
+     * {<OpenLayers.Feature.Vector>} Feature currently available for
+     *     transformation. Read-only, use <setFeature> to set it manually.
+     */
+    feature: null,
+    
+    /**
+     * APIProperty: renderIntent
+     * {String|Object} Render intent for the transformation box and
+     *     handles. A symbolizer object can also be provided here.
+     */
+    renderIntent: "temporary",
+    
+    /**
+     * APIProperty: rotationHandleSymbolizer
+     * {Object|String} Optional. A custom symbolizer for the rotation handles.
+     *     A render intent can also be provided here. Defaults to
+     *     (code)
+     *     {
+     *         stroke: false,
+     *         pointRadius: 10,
+     *         fillOpacity: 0,
+     *         cursor: "pointer"
+     *     }
+     *     (end)
+     */
+    rotationHandleSymbolizer: null,
+    
+    /**
+     * APIProperty: box
+     * {<OpenLayers.Feature.Vector>} The transformation box rectangle.
+     *     Read-only.
+     */
+    box: null,
+    
+    /**
+     * APIProperty: center
+     * {<OpenLayers.Geometry.Point>} The center of the feature bounds.
+     * Read-only.
+     */
+    center: null,
+    
+    /**
+     * APIProperty: scale
+     * {Float} The scale of the feature, relative to the scale the time the
+     *     feature was set. Read-only, except for *beforesetfeature*
+     *     listeners.
+     */
+    scale: 1,
+    
+    /**
+     * APIProperty: ratio
+     * {Float} The ratio of the feature relative to the ratio the time the
+     *     feature was set. Read-only, except for *beforesetfeature*
+     *     listeners.
+     */
+    ratio: 1,
+    
+    /**
+     * Property: rotation
+     * {Integer} the current rotation angle of the box. Read-only, except for
+     *     *beforesetfeature* listeners.
+     */
+    rotation: 0,
+    
+    /**
+     * APIProperty: handles
+     * {Array(<OpenLayers.Feature.Vector>)} The 8 handles currently available
+     *     for scaling/resizing. Numbered counterclockwise, starting from the
+     *     southwest corner. Read-only.
+     */
+    handles: null,
+    
+    /**
+     * APIProperty: rotationHandles
+     * {Array(<OpenLayers.Feature.Vector>)} The 4 rotation handles currently
+     *     available for rotating. Numbered counterclockwise, starting from
+     *     the southwest corner. Read-only.
+     */
+    rotationHandles: null,
+    
+    /**
+     * Property: dragControl
+     * {<OpenLayers.Control.DragFeature>}
+     */
+    dragControl: null,
+    
+    /**
+     * Constructor: OpenLayers.Control.TransformFeature
+     * Create a new transform feature control.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} Layer that contains features that
+     *     will be transformed.
+     * options - {Object} Optional object whose properties will be set on the
+     *     control.
+     */
+    initialize: function(layer, options) {
+        // concatenate events specific to this control with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.TransformFeature.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+
+        this.layer = layer;
+
+        if(!this.rotationHandleSymbolizer) {
+            this.rotationHandleSymbolizer = {
+                stroke: false,
+                pointRadius: 10,
+                fillOpacity: 0,
+                cursor: "pointer"
+            };
+        }
+
+        this.createBox();
+        this.createControl();        
+    },
+    
+    /**
+     * APIMethod: activate
+     * Activates the control.
+     */
+    activate: function() {
+        var activated = false;
+        if(OpenLayers.Control.prototype.activate.apply(this, arguments)) {
+            this.dragControl.activate();
+            this.layer.addFeatures([this.box]);
+            this.rotate && this.layer.addFeatures(this.rotationHandles);
+            this.layer.addFeatures(this.handles);        
+            activated = true;
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivates the control.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
+            this.layer.removeFeatures(this.handles);
+            this.rotate && this.layer.removeFeatures(this.rotationHandles);
+            this.layer.removeFeatures([this.box]);
+            this.dragControl.deactivate();
+            deactivated = true;
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: setMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        this.dragControl.setMap(map);
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: setFeature
+     * Place the transformation box on a feature and start transforming it.
+     * If the control is not active, it will be activated.
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * initialParams - {Object} Initial values for rotation, scale or ratio.
+     *     Setting a rotation value here will cause the transformation box to
+     *     start rotated. Setting a scale or ratio will not affect the
+     *     transormation box, but applications may use this to keep track of
+     *     scale and ratio of a feature across multiple transforms.
+     */
+    setFeature: function(feature, initialParams) {
+        initialParams = OpenLayers.Util.applyDefaults(initialParams, {
+            rotation: 0,
+            scale: 1,
+            ratio: 1
+        });
+        var evt = {feature: feature};
+        
+        var oldRotation = this.rotation;
+        var oldCenter = this.center;
+        OpenLayers.Util.extend(this, initialParams);
+
+        if(this.events.triggerEvent("beforesetfeature", evt) === false) {
+            return;
+        }
+
+        this.feature = feature;
+        this.activate();
+
+        this._setfeature = true;
+
+        var featureBounds = this.feature.geometry.getBounds();
+        this.box.move(featureBounds.getCenterLonLat());
+        this.box.geometry.rotate(-oldRotation, oldCenter);
+        this._angle = 0;
+
+        var ll;
+        if(this.rotation) {
+            var geom = feature.geometry.clone();
+            geom.rotate(-this.rotation, this.center);
+            var box = new OpenLayers.Feature.Vector(
+                geom.getBounds().toGeometry());
+            box.geometry.rotate(this.rotation, this.center);
+            this.box.geometry.rotate(this.rotation, this.center);
+            this.box.move(box.geometry.getBounds().getCenterLonLat());
+            var llGeom = box.geometry.components[0].components[0];
+            ll = llGeom.getBounds().getCenterLonLat();
+        } else {
+            ll = new OpenLayers.LonLat(featureBounds.left, featureBounds.bottom);
+        }
+        this.handles[0].move(ll);
+        
+        delete this._setfeature;
+
+        this.events.triggerEvent("setfeature", evt);
+    },
+    
+    /**
+     * Method: createBox
+     * Creates the box with all handles and transformation handles.
+     */
+    createBox: function() {
+        var control = this;
+        
+        this.center = new OpenLayers.Geometry.Point(0, 0);
+        var box = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.LineString([
+                new OpenLayers.Geometry.Point(-1, -1),
+                new OpenLayers.Geometry.Point(0, -1),
+                new OpenLayers.Geometry.Point(1, -1),
+                new OpenLayers.Geometry.Point(1, 0),
+                new OpenLayers.Geometry.Point(1, 1),
+                new OpenLayers.Geometry.Point(0, 1),
+                new OpenLayers.Geometry.Point(-1, 1),
+                new OpenLayers.Geometry.Point(-1, 0),
+                new OpenLayers.Geometry.Point(-1, -1)
+            ]), null,
+            typeof this.renderIntent == "string" ? null : this.renderIntent
+        );
+        
+        // Override for box move - make sure that the center gets updated
+        box.geometry.move = function(x, y) {
+            control._moving = true;
+            OpenLayers.Geometry.LineString.prototype.move.apply(this, arguments);
+            control.center.move(x, y);
+            delete control._moving;
+        };
+
+        // Overrides for vertex move, resize and rotate - make sure that
+        // handle and rotationHandle geometries are also moved, resized and
+        // rotated.
+        var vertexMoveFn = function(x, y) {
+            OpenLayers.Geometry.Point.prototype.move.apply(this, arguments);
+            this._rotationHandle && this._rotationHandle.geometry.move(x, y);
+            this._handle.geometry.move(x, y);
+        };
+        var vertexResizeFn = function(scale, center, ratio) {
+            OpenLayers.Geometry.Point.prototype.resize.apply(this, arguments);
+            this._rotationHandle && this._rotationHandle.geometry.resize(
+                scale, center, ratio);
+            this._handle.geometry.resize(scale, center, ratio);
+        };
+        var vertexRotateFn = function(angle, center) {
+            OpenLayers.Geometry.Point.prototype.rotate.apply(this, arguments);
+            this._rotationHandle && this._rotationHandle.geometry.rotate(
+                angle, center);
+            this._handle.geometry.rotate(angle, center);
+        };
+        
+        // Override for handle move - make sure that the box and other handles
+        // are updated, and finally transform the feature.
+        var handleMoveFn = function(x, y) {
+            var oldX = this.x, oldY = this.y;
+            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
+            if(control._moving) {
+                return;
+            }
+            var evt = control.dragControl.handlers.drag.evt;
+            var preserveAspectRatio = !control._setfeature &&
+                control.preserveAspectRatio;
+            var reshape = !preserveAspectRatio && !(evt && evt.shiftKey);
+            var oldGeom = new OpenLayers.Geometry.Point(oldX, oldY);
+            var centerGeometry = control.center;
+            this.rotate(-control.rotation, centerGeometry);
+            oldGeom.rotate(-control.rotation, centerGeometry);
+            var dx1 = this.x - centerGeometry.x;
+            var dy1 = this.y - centerGeometry.y;
+            var dx0 = dx1 - (this.x - oldGeom.x);
+            var dy0 = dy1 - (this.y - oldGeom.y);
+            this.x = oldX;
+            this.y = oldY;
+            var scale, ratio = 1;
+            if (reshape) {
+                scale = Math.abs(dy0) < 0.00001 ? 1 : dy1 / dy0;
+                ratio = (Math.abs(dx0) < 0.00001 ? 1 : (dx1 / dx0)) / scale;
+            } else {
+                var l0 = Math.sqrt((dx0 * dx0) + (dy0 * dy0));
+                var l1 = Math.sqrt((dx1 * dx1) + (dy1 * dy1));
+                scale = l1 / l0;
+            }
+
+            // rotate the box to 0 before resizing - saves us some
+            // calculations and is inexpensive because we don't drawFeature.
+            control._moving = true;
+            control.box.geometry.rotate(-control.rotation, centerGeometry);
+            delete control._moving;
+
+            control.box.geometry.resize(scale, centerGeometry, ratio);
+            control.box.geometry.rotate(control.rotation, centerGeometry);
+            control.transformFeature({scale: scale, ratio: ratio});
+        };
+        
+        // Override for rotation handle move - make sure that the box and
+        // other handles are updated, and finally transform the feature.
+        var rotationHandleMoveFn = function(x, y){
+            var oldX = this.x, oldY = this.y;
+            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
+            if(control._moving) {
+                return;
+            }
+            var evt = control.dragControl.handlers.drag.evt;
+            var constrain = (evt && evt.shiftKey) ? 45 : 1;
+            var centerGeometry = control.center;
+            var dx1 = this.x - centerGeometry.x;
+            var dy1 = this.y - centerGeometry.y;
+            var dx0 = dx1 - x;
+            var dy0 = dy1 - y;
+            this.x = oldX;
+            this.y = oldY;
+            var a0 = Math.atan2(dy0, dx0);
+            var a1 = Math.atan2(dy1, dx1);
+            var angle = a1 - a0;
+            angle *= 180 / Math.PI;
+            control._angle = (control._angle + angle) % 360;
+            var diff = control.rotation % constrain;
+            if(Math.abs(control._angle) >= constrain || diff !== 0) {
+                angle = Math.round(control._angle / constrain) * constrain -
+                    diff;
+                control._angle = 0;
+                control.box.geometry.rotate(angle, centerGeometry);
+                control.transformFeature({rotation: angle});
+            } 
+        };
+
+        var handles = new Array(8);
+        var rotationHandles = new Array(4);
+        var geom, handle, rotationHandle;
+        for(var i=0; i<8; ++i) {
+            geom = box.geometry.components[i];
+            handle = new OpenLayers.Feature.Vector(geom.clone(), null,
+                typeof this.renderIntent == "string" ? null :
+                this.renderIntent);
+            if(i % 2 == 0) {
+                rotationHandle = new OpenLayers.Feature.Vector(geom.clone(),
+                    null, typeof this.rotationHandleSymbolizer == "string" ?
+                    null : this.rotationHandleSymbolizer);
+                rotationHandle.geometry.move = rotationHandleMoveFn;
+                geom._rotationHandle = rotationHandle;
+                rotationHandles[i/2] = rotationHandle;
+            }
+            geom.move = vertexMoveFn;
+            geom.resize = vertexResizeFn;
+            geom.rotate = vertexRotateFn;
+            handle.geometry.move = handleMoveFn;
+            geom._handle = handle;
+            handles[i] = handle;
+        }
+        
+        this.box = box;
+        this.rotationHandles = rotationHandles;
+        this.handles = handles;
+    },
+    
+    /**
+     * Method: createControl
+     * Creates a DragFeature control for this control.
+     */
+    createControl: function() {
+        var control = this;
+        this.dragControl = new OpenLayers.Control.DragFeature(this.layer, {
+            documentDrag: true,
+            // avoid moving the feature itself - move the box instead
+            moveFeature: function(pixel) {
+                if(this.feature === control.feature) {
+                    this.feature = control.box;
+                }
+                OpenLayers.Control.DragFeature.prototype.moveFeature.apply(this,
+                    arguments);
+            },
+            // transform while dragging
+            onDrag: function(feature, pixel) {
+                if(feature === control.box) {
+                    control.transformFeature({center: control.center});
+                    control.drawHandles();
+                }
+            },
+            // set a new feature
+            onStart: function(feature, pixel) {
+                var eligible = !control.geometryTypes ||
+                    OpenLayers.Util.indexOf(control.geometryTypes,
+                        feature.geometry.CLASS_NAME) !== -1;
+                var i = OpenLayers.Util.indexOf(control.handles, feature);
+                i += OpenLayers.Util.indexOf(control.rotationHandles,
+                    feature);
+                if(feature !== control.feature && feature !== control.box &&
+                                                        i == -2 && eligible) {
+                    control.setFeature(feature);
+                }
+            },
+            onComplete: function(feature, pixel) {
+                control.events.triggerEvent("transformcomplete",
+                    {feature: control.feature});
+            }
+        });
+    },
+    
+    /**
+     * Method: drawHandles
+     * Draws the handles to match the box.
+     */
+    drawHandles: function() {
+        var layer = this.layer;
+        for(var i=0; i<8; ++i) {
+            if(this.rotate && i % 2 === 0) {
+                layer.drawFeature(this.rotationHandles[i/2],
+                    this.rotationHandleSymbolizer);
+            }
+            layer.drawFeature(this.handles[i], this.renderIntent);
+        }
+    },
+    
+    /**
+     * Method: transformFeature
+     * Transforms the feature.
+     * 
+     * Parameters:
+     * mods - {Object} An object with optional scale, ratio, rotation and
+     *     center properties.
+     */
+    transformFeature: function(mods) {
+        if(!this._setfeature) {
+            this.scale *= (mods.scale || 1);
+            this.ratio *= (mods.ratio || 1);
+            var oldRotation = this.rotation;
+            this.rotation = (this.rotation + (mods.rotation || 0)) % 360;
+            
+            if(this.events.triggerEvent("beforetransform", mods) !== false) {
+                var feature = this.feature;
+                var geom = feature.geometry;
+                var center = this.center;
+                geom.rotate(-oldRotation, center);
+                if(mods.scale || mods.ratio) {
+                    geom.resize(mods.scale, center, mods.ratio);
+                } else if(mods.center) {
+                    feature.move(mods.center.getBounds().getCenterLonLat());
+                }
+                geom.rotate(this.rotation, center);
+                this.layer.drawFeature(feature);
+                feature.toState(OpenLayers.State.UPDATE);
+                this.events.triggerEvent("transform", mods);
+            }
+        }
+        this.layer.drawFeature(this.box, this.renderIntent);
+        this.drawHandles();
+    },
+        
+    /**
+     * APIMethod: destroy
+     * Take care of things that are not handled in superclass.
+     */
+    destroy: function() {
+        var geom;
+        for(var i=0; i<8; ++i) {
+            geom = this.box.geometry.components[i];
+            geom._handle.destroy();
+            geom._handle = null;
+            geom._rotationHandle && geom._rotationHandle.destroy();
+            geom._rotationHandle = null;
+        }
+        this.box.destroy();
+        this.box = null;
+        this.layer = null;
+        this.dragControl.destroy();
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.TransformFeature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Split.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Split.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Split.js	(revision 76)
@@ -0,0 +1,498 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Path.js
+ * @requires OpenLayers/Layer/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Split
+ * Acts as a split feature agent while editing vector features.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Split = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * control.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * Supported control event types (in addition to those from <OpenLayers.Control>):
+     * beforesplit - Triggered before a split occurs.  Listeners receive an
+     *     event object with *source* and *target* properties.
+     * split - Triggered when a split occurs.  Listeners receive an event with
+     *     an *original* property and a *features* property.  The original
+     *     is a reference to the target feature that the sketch or modified
+     *     feature intersects.  The features property is a list of all features
+     *     that result from this single split.  This event is triggered before
+     *     the resulting features are added to the layer (while the layer still
+     *     has a reference to the original).
+     * aftersplit - Triggered after all splits resulting from a single sketch
+     *     or feature modification have occurred.  The original features
+     *     have been destroyed and features that result from the split
+     *     have already been added to the layer.  Listeners receive an event
+     *     with a *source* and *features* property.  The source references the
+     *     sketch or modified feature used as a splitter.  The features
+     *     property is a list of all resulting features.
+     */
+    EVENT_TYPES: ["beforesplit", "split", "aftersplit"],
+    
+    /**
+     * APIProperty: layer
+     * {<OpenLayers.Layer.Vector>} The target layer with features to be split.
+     *     Set at construction or after construction with <setLayer>.
+     */
+    layer: null,
+    
+    /**
+     * Property: source
+     * {<OpenLayers.Layer.Vector>} Optional source layer.  Any newly created
+     *     or modified features from this layer will be used to split features
+     *     on the target layer.  If not provided, a temporary sketch layer will
+     *     be created.
+     */
+    source: null,
+    
+    /**
+     * Property: sourceOptions
+     * {Options} If a temporary sketch layer is created, these layer options
+     *     will be applied.
+     */
+    sourceOptions: null,
+
+    /**
+     * APIProperty: tolerance
+     * {Number} Distance between the calculated intersection and a vertex on
+     *     the source geometry below which the existing vertex will be used
+     *     for the split.  Default is null.
+     */
+    tolerance: null,
+    
+    /**
+     * APIProperty: edge
+     * {Boolean} Allow splits given intersection of edges only.  Default is
+     *     true.  If false, a vertex on the source must be within the
+     *     <tolerance> distance of the calculated intersection for a split
+     *     to occur.
+     */
+    edge: true,
+    
+    /**
+     * APIProperty: deferDelete
+     * {Boolean} Instead of removing features from the layer, set feature
+     *     states of split features to DELETE.  This assumes a save strategy
+     *     or other component is in charge of removing features from the
+     *     layer.  Default is false.  If false, split features will be
+     *     immediately deleted from the layer.
+     */
+    deferDelete: false,
+    
+    /**
+     * APIProperty: mutual
+     * {Boolean} If source and target layers are the same, split source
+     *     features and target features where they intersect.  Default is
+     *     true.  If false, only target features will be split.
+     */
+    mutual: true,
+    
+    /**
+     * APIProperty: targetFilter
+     * {OpenLayers.Filter} Optional filter that will be evaluated
+     *     to determine if a feature from the target layer is eligible for
+     *     splitting.
+     */
+    targetFilter: null,
+    
+    /**
+     * APIProperty: sourceFilter
+     * {OpenLayers.Filter} Optional filter that will be evaluated
+     *     to determine if a feature from the target layer is eligible for
+     *     splitting.
+     */
+    sourceFilter: null,
+    
+    /**
+     * Property: handler
+     * {<OpenLayers.Handler.Path>} The temporary sketch handler created if
+     *     no source layer is provided.
+     */
+    handler: null,
+
+    /**
+     * Constructor: OpenLayers.Control.Split
+     * Creates a new split control. A control is constructed with a target
+     *     layer and an optional source layer. While the control is active,
+     *     creating new features or modifying existing features on the source
+     *     layer will result in splitting any eligible features on the target
+     *     layer.  If no source layer is provided, a temporary sketch layer will
+     *     be created to create lines for splitting features on the target.
+     *
+     * Parameters:
+     * options - {Object} An object containing all configuration properties for
+     *     the control.
+     *
+     * Valid options:
+     * layer - {OpenLayers.Layer.Vector} The target layer.  Features from this
+     *     layer will be split by new or modified features on the source layer
+     *     or temporary sketch layer.
+     * source - {OpenLayers.Layer.Vector} Optional source layer.  If provided
+     *     newly created features or modified features will be used to split
+     *     features on the target layer.  If not provided, a temporary sketch
+     *     layer will be created for drawing lines.
+     * tolerance - {Number} Optional value for the distance between a source
+     *     vertex and the calculated intersection below which the split will
+     *     occur at the vertex.
+     * edge - {Boolean} Allow splits given intersection of edges only.  Default
+     *     is true.  If false, a vertex on the source must be within the
+     *     <tolerance> distance of the calculated intersection for a split
+     *     to occur.
+     * mutual - {Boolean} If source and target are the same, split source
+     *     features and target features where they intersect.  Default is
+     *     true.  If false, only target features will be split.
+     * targetFilter - {OpenLayers.Filter} Optional filter that will be evaluated
+     *     to determine if a feature from the target layer is eligible for
+     *     splitting.
+     * sourceFilter - {OpenLayers.Filter} Optional filter that will be evaluated
+     *     to determine if a feature from the target layer is eligible for
+     *     splitting.
+     */
+    initialize: function(options) {
+        // concatenate events specific to measure with those from the base
+        Array.prototype.push.apply(
+            this.EVENT_TYPES, OpenLayers.Control.prototype.EVENT_TYPES
+        );
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.options = options || {}; // TODO: this could be done by the super
+        
+        // set the source layer if provided
+        if(this.options.source) {
+            this.setSource(this.options.source);
+        }
+    },
+    
+    /**
+     * APIMethod: setSource
+     * Set the source layer for edits layer.
+     *
+     * Parameters:
+     * layer - {OpenLayers.Layer.Vector}  The new source layer layer.  If
+     *     null, a temporary sketch layer will be created.
+     */
+    setSource: function(layer) {
+        if(this.active) {
+            this.deactivate();
+            if(this.handler) {
+                this.handler.destroy();
+                delete this.handler;
+            }
+            this.source = layer;
+            this.activate();
+        } else {
+            this.source = layer;
+        }
+    },
+    
+    /**
+     * APIMethod: activate
+     * Activate the control.  Activating the control registers listeners for
+     *     editing related events so that during feature creation and
+     *     modification, features in the target will be considered for
+     *     splitting.
+     */
+    activate: function() {
+        var activated = OpenLayers.Control.prototype.activate.call(this);
+        if(activated) {
+            if(!this.source) {
+                if(!this.handler) {
+                    this.handler = new OpenLayers.Handler.Path(this,
+                        {done: function(geometry) {
+                            this.onSketchComplete({
+                                feature: new OpenLayers.Feature.Vector(geometry)
+                            });
+                        }},
+                        {layerOptions: this.sourceOptions}
+                    );
+                }
+                this.handler.activate();
+            } else if(this.source.events) {
+                this.source.events.on({
+                    sketchcomplete: this.onSketchComplete,
+                    afterfeaturemodified: this.afterFeatureModified,
+                    scope: this
+                });
+            }
+        }
+        return activated;
+    },
+    
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control.  Deactivating the control unregisters listeners
+     *     so feature editing may proceed without engaging the split agent.
+     */
+    deactivate: function() {
+        var deactivated = OpenLayers.Control.prototype.deactivate.call(this);
+        if(deactivated) {
+            if(this.source && this.source.events) {
+                this.layer.events.un({
+                    sketchcomplete: this.onSketchComplete,
+                    afterfeaturemodified: this.afterFeatureModified,
+                    scope: this
+                });
+            }
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: onSketchComplete
+     * Registered as a listener for the sketchcomplete event on the editable
+     *     layer.
+     *
+     * Parameters:
+     * event - {Object} The sketch complete event.
+     *
+     * Returns:
+     * {Boolean} Stop the sketch from being added to the layer (it has been
+     *     split).
+     */
+    onSketchComplete: function(event) {
+        this.feature = null;
+        return !this.considerSplit(event.feature);
+    },
+    
+    /**
+     * Method: afterFeatureModified
+     * Registered as a listener for the afterfeaturemodified event on the
+     *     editable layer.
+     *
+     * Parameters:
+     * event - {Object} The after feature modified event.
+     */
+    afterFeatureModified: function(event) {
+        if(event.modified) {
+            var feature = event.feature;
+            if(feature.geometry instanceof OpenLayers.Geometry.LineString ||
+               feature.geometry instanceof OpenLayers.Geometry.MultiLineString) {
+                this.feature = event.feature;
+                this.considerSplit(event.feature);
+            }
+        }
+    },
+    
+    /**
+     * Method: removeByGeometry
+     * Remove a feature from a list based on the given geometry.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>} A list of features.
+     * geometry - {<OpenLayers.Geometry>} A geometry.
+     */
+    removeByGeometry: function(features, geometry) {
+        for(var i=0, len=features.length; i<len; ++i) {
+            if(features[i].geometry === geometry) {
+                features.splice(i, 1);
+                break;
+            }
+        }
+    },
+    
+    /**
+     * Method: isEligible
+     * Test if a target feature is eligible for splitting.
+     *
+     * Parameters:
+     * target - {<OpenLayers.Feature.Vector>} The target feature.
+     *
+     * Returns:
+     * {Boolean} The target is eligible for splitting.
+     */
+    isEligible: function(target) {
+        return (
+            target.state !== OpenLayers.State.DELETE
+        ) && (
+            target.geometry instanceof OpenLayers.Geometry.LineString ||
+            target.geometry instanceof OpenLayers.Geometry.MultiLineString
+        ) && (
+            this.feature !== target
+        ) && (
+            !this.targetFilter ||
+            this.targetFilter.evaluate(target.attributes)
+        );
+    },
+
+    /**
+     * Method: considerSplit
+     * Decide whether or not to split target features with the supplied
+     *     feature.  If <mutual> is true, both the source and target features
+     *     will be split if eligible.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector}} The newly created or modified
+     *     feature.
+     *
+     * Returns:
+     * {Boolean} The supplied feature was split (and destroyed).
+     */
+    considerSplit: function(feature) {
+        var sourceSplit = false;
+        var targetSplit = false;
+        if(!this.sourceFilter ||
+           this.sourceFilter.evaluate(feature.attributes)) {
+            var features = this.layer && this.layer.features || [];
+            var target, results, proceed;
+            var additions = [], removals = [];
+            var mutual = (this.layer === this.source) && this.mutual;
+            var options = {
+                edge: this.edge,
+                tolerance: this.tolerance,
+                mutual: mutual
+            };
+            var sourceParts = [feature.geometry];
+            var targetFeature, targetParts;
+            var source, parts;
+            for(var i=0, len=features.length; i<len; ++i) {
+                targetFeature = features[i];
+                if(this.isEligible(targetFeature)) {
+                    targetParts = [targetFeature.geometry];
+                    // work through source geoms - this array may change
+                    for(var j=0; j<sourceParts.length; ++j) { 
+                        source = sourceParts[j];
+                        // work through target parts - this array may change
+                        for(var k=0; k<targetParts.length; ++k) {
+                            target = targetParts[k];
+                            if(source.getBounds().intersectsBounds(target.getBounds())) {
+                                results = source.split(target, options);
+                                if(results) {
+                                    proceed = this.events.triggerEvent(
+                                        "beforesplit", {source: feature, target: targetFeature}
+                                    );
+                                    if(proceed !== false) {
+                                        if(mutual) {
+                                            parts = results[0];
+                                            // handle parts that result from source splitting
+                                            if(parts.length > 1) {
+                                                // splice in new source parts
+                                                parts.unshift(j, 1); // add args for splice below
+                                                Array.prototype.splice.apply(sourceParts, parts);
+                                                j += parts.length - 3;
+                                            }
+                                            results = results[1];
+                                        }
+                                        // handle parts that result from target splitting
+                                        if(results.length > 1) {
+                                            // splice in new target parts
+                                            results.unshift(k, 1); // add args for splice below
+                                            Array.prototype.splice.apply(targetParts, results);
+                                            k += results.length - 3;
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                    if(targetParts && targetParts.length > 1) {
+                        this.geomsToFeatures(targetFeature, targetParts);
+                        this.events.triggerEvent("split", {
+                            original: targetFeature,
+                            features: targetParts
+                        });
+                        Array.prototype.push.apply(additions, targetParts);
+                        removals.push(targetFeature);
+                        targetSplit = true;
+                    }
+                }
+            }
+            if(sourceParts && sourceParts.length > 1) {
+                this.geomsToFeatures(feature, sourceParts);
+                this.events.triggerEvent("split", {
+                    original: feature,
+                    features: sourceParts
+                });
+                Array.prototype.push.apply(additions, sourceParts);
+                removals.push(feature);
+                sourceSplit = true;
+            }
+            if(sourceSplit || targetSplit) {
+                // remove and add feature events are suppressed
+                // listen for split event on this control instead
+                if(this.deferDelete) {
+                    // Set state instead of removing.  Take care to avoid
+                    // setting delete for features that have not yet been
+                    // inserted - those should be destroyed immediately.
+                    var feat, destroys = [];
+                    for(var i=0, len=removals.length; i<len; ++i) {
+                        feat = removals[i];
+                        if(feat.state === OpenLayers.State.INSERT) {
+                            destroys.push(feat);
+                        } else {
+                            feat.state = OpenLayers.State.DELETE;
+                            this.layer.drawFeature(feat);
+                        }
+                    }
+                    this.layer.destroyFeatures(destroys, {silent: true});
+                    for(var i=0, len=additions.length; i<len; ++i) {
+                        additions[i].state = OpenLayers.State.INSERT;
+                    }
+                } else {
+                    this.layer.destroyFeatures(removals, {silent: true});
+                }
+                this.layer.addFeatures(additions, {silent: true});
+                this.events.triggerEvent("aftersplit", {
+                    source: feature,
+                    features: additions
+                });
+            }
+        }
+        return sourceSplit;
+    },
+    
+    /**
+     * Method: geomsToFeatures
+     * Create new features given a template feature and a list of geometries.
+     *     The list of geometries is modified in place.  The result will be
+     *     a list of new features.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature to be cloned.
+     * geoms - {Array(<OpenLayers.Geometry>)} List of goemetries.  This will
+     *     become a list of new features.
+     */
+    geomsToFeatures: function(feature, geoms) {
+        var clone = feature.clone();
+        delete clone.geometry;
+        var newFeature;
+        for(var i=0, len=geoms.length; i<len; ++i) {
+            // turn results list from geoms to features
+            newFeature = clone.clone();
+            newFeature.geometry = geoms[i];
+            newFeature.state = OpenLayers.State.INSERT;
+            geoms[i] = newFeature;
+        }
+    },
+    
+    /**
+     * Method: destroy
+     * Clean up the control.
+     */
+    destroy: function() {
+        if(this.active) {
+            this.deactivate(); // TODO: this should be handled by the super
+        }
+        OpenLayers.Control.prototype.destroy.call(this);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Split"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/GetFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/GetFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/GetFeature.js	(revision 76)
@@ -0,0 +1,595 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Click.js
+ * @requires OpenLayers/Handler/Box.js
+ * @requires OpenLayers/Handler/Hover.js
+ * @requires OpenLayers/Filter/Spatial.js
+ */
+
+/**
+ * Class: OpenLayers.Control.GetFeature
+ * Gets vector features for locations underneath the mouse cursor. Can be
+ *     configured to act on click, hover or dragged boxes. Uses an
+ *     <OpenLayers.Protocol> that supports spatial filters to retrieve
+ *     features from a server and fires events that notify applications of the
+ *     selected features. 
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.GetFeature = OpenLayers.Class(OpenLayers.Control, {
+    
+    /**
+     * APIProperty: protocol
+     * {<OpenLayers.Protocol>} Required. The protocol used for fetching
+     *     features.
+     */
+    protocol: null,
+    
+    /**
+     * APIProperty: multipleKey
+     * {String} An event modifier ('altKey' or 'shiftKey') that temporarily sets
+     *     the <multiple> property to true.  Default is null.
+     */
+    multipleKey: null,
+    
+    /**
+     * APIProperty: toggleKey
+     * {String} An event modifier ('altKey' or 'shiftKey') that temporarily sets
+     *     the <toggle> property to true.  Default is null.
+     */
+    toggleKey: null,
+    
+    /**
+     * Property: modifiers
+     * {Object} The event modifiers to use, according to the current event
+     *     being handled by this control's handlers
+     */
+    modifiers: null,
+    
+    /**
+     * APIProperty: multiple
+     * {Boolean} Allow selection of multiple geometries.  Default is false.
+     */
+    multiple: false, 
+
+    /**
+     * APIProperty: click
+     * {Boolean} Use a click handler for selecting/unselecting features. If
+     *     both <click> and <box> are set to true, the click handler takes
+     *     precedence over the box handler if a box with zero extent was
+     *     selected.  Default is true.
+     */
+    click: true,
+
+    /**
+     * APIProperty: single
+     * {Boolean} Tells whether select by click should select a single
+     *     feature. If set to false, all matching features are selected.
+     *     If set to true, only the best matching feature is selected.
+     *     This option has an effect only of the <click> option is set
+     *     to true. Default is true.
+     */
+    single: true,
+    
+    /**
+     * APIProperty: clickout
+     * {Boolean} Unselect features when clicking outside any feature.
+     *     Applies only if <click> is true.  Default is true.
+     */
+    clickout: true,
+    
+    /**
+     * APIProperty: toggle
+     * {Boolean} Unselect a selected feature on click.  Applies only if
+     *     <click> is true.  Default is false.
+     */
+    toggle: false,
+
+    /**
+     * APIProperty: clickTolerance
+     * {Integer} Tolerance for the filter query in pixels. This has the
+     *     same effect as the tolerance parameter on WMS GetFeatureInfo
+     *     requests.  Will be ignored for box selections.  Applies only if
+     *     <click> or <hover> is true.  Default is 5.  Note that this not
+     *     only affects requests on click, but also on hover.
+     */
+    clickTolerance: 5,
+    
+    /**
+     * APIProperty: hover
+     * {Boolean} Send feature requests on mouse moves.  Default is false.
+     */
+    hover: false,
+
+    /**
+     * APIProperty: box
+     * {Boolean} Allow feature selection by drawing a box. If set to
+     *     true set <click> to false to disable the click handler and
+     *     rely on the box handler only, even for "zero extent" boxes.
+     *     See the description of the <click> option for additional
+     *     information.  Default is false.
+     */
+    box: false,
+    
+    /**
+     * APIProperty: maxFeatures
+     * {Integer} Maximum number of features to return from a query in single mode
+     *     if supported by the <protocol>. This set of features is then used to
+     *     determine the best match client-side. Default is 10.
+     */
+    maxFeatures: 10,
+    
+    /**
+     * Property: features
+     * {Object} Hash of {<OpenLayers.Feature.Vector>}, keyed by fid, holding
+     *     the currently selected features
+     */
+    features: null,
+    
+    /**
+     * Proeprty: hoverFeature
+     * {<OpenLayers.Feature.Vector>} The feature currently selected by the
+     *     hover handler
+     */
+    hoverFeature: null,
+    
+    /**
+     * APIProperty: handlerOptions
+     * {Object} Additional options for the handlers used by this control. This
+     *     is a hash with the keys "click", "box" and "hover".
+     */
+    handlerOptions: null,
+    
+    /**
+     * Property: handlers
+     * {Object} Object with references to multiple <OpenLayers.Handler>
+     *     instances.
+     */
+    handlers: null,
+
+    /**
+     * Property: hoverResponse
+     * {<OpenLayers.Protocol.Response>} The response object associated with
+     *     the currently running hover request (if any).
+     */
+    hoverResponse: null,
+    
+    /**
+     * Property: filterType
+     * {<String>} The type of filter to use when sending off a request. 
+     *     Possible values: 
+     *     OpenLayers.Filter.Spatial.<BBOX|INTERSECTS|WITHIN|CONTAINS>
+     *     Defaults to: OpenLayers.Filter.Spatial.BBOX
+     */
+    filterType: OpenLayers.Filter.Spatial.BBOX,
+
+    /**
+     * Constant: EVENT_TYPES
+     *
+     * Supported event types:
+     * beforefeatureselected - Triggered when <click> is true before a
+     *      feature is selected. The event object has a feature property with
+     *      the feature about to select
+     * featureselected - Triggered when <click> is true and a feature is
+     *      selected. The event object has a feature property with the
+     *      selected feature
+     * beforefeaturesselected - Triggered when <click> is true before a
+     *      set of features is selected. The event object is an array of
+     *      feature properties with the features about to be selected.  
+     *      Return false after receiving this event to discontinue processing
+     *      of all featureselected events and the featuresselected event.
+     * featuresselected - Triggered when <click> is true and a set of
+     *      features is selected.  The event object is an array of feature
+     *      properties of the selected features
+     * featureunselected - Triggered when <click> is true and a feature is
+     *      unselected. The event object has a feature property with the
+     *      unselected feature
+     * clickout - Triggered when when <click> is true and no feature was
+     *      selected.
+     * hoverfeature - Triggered when <hover> is true and the mouse has
+     *      stopped over a feature
+     * outfeature - Triggered when <hover> is true and the mouse moves
+     *      moved away from a hover-selected feature
+     */
+    EVENT_TYPES: ["featureselected", "featuresselected", "featureunselected", 
+        "clickout", "beforefeatureselected", "beforefeaturesselected", 
+        "hoverfeature", "outfeature"],
+
+    /**
+     * Constructor: OpenLayers.Control.GetFeature
+     * Create a new control for fetching remote features.
+     *
+     * Parameters:
+     * options - {Object} A configuration object which at least has to contain
+     *     a <protocol> property
+     */
+    initialize: function(options) {
+        // concatenate events specific to vector with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Control.GetFeature.prototype.EVENT_TYPES.concat(
+            OpenLayers.Control.prototype.EVENT_TYPES
+        );
+
+        options.handlerOptions = options.handlerOptions || {};
+
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        
+        this.features = {};
+
+        this.handlers = {};
+        
+        if(this.click) {
+            this.handlers.click = new OpenLayers.Handler.Click(this,
+                {click: this.selectClick}, this.handlerOptions.click || {});
+        }
+
+        if(this.box) {
+            this.handlers.box = new OpenLayers.Handler.Box(
+                this, {done: this.selectBox},
+                OpenLayers.Util.extend(this.handlerOptions.box, {
+                    boxDivClassName: "olHandlerBoxSelectFeature"
+                })
+            ); 
+        }
+        
+        if(this.hover) {
+            this.handlers.hover = new OpenLayers.Handler.Hover(
+                this, {'move': this.cancelHover, 'pause': this.selectHover},
+                OpenLayers.Util.extend(this.handlerOptions.hover, {
+                    'delay': 250
+                })
+            );
+        }
+    },
+    
+    /**
+     * Method: activate
+     * Activates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively activated.
+     */
+    activate: function () {
+        if (!this.active) {
+            for(var i in this.handlers) {
+                this.handlers[i].activate();
+            }
+        }
+        return OpenLayers.Control.prototype.activate.apply(
+            this, arguments
+        );
+    },
+
+    /**
+     * Method: deactivate
+     * Deactivates the control.
+     * 
+     * Returns:
+     * {Boolean} The control was effectively deactivated.
+     */
+    deactivate: function () {
+        if (this.active) {
+            for(var i in this.handlers) {
+                this.handlers[i].deactivate();
+            }
+        }
+        return OpenLayers.Control.prototype.deactivate.apply(
+            this, arguments
+        );
+    },
+    
+    /**
+     * Method: selectClick
+     * Called on click
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     */
+    selectClick: function(evt) {
+        var bounds = this.pixelToBounds(evt.xy);
+        
+        this.setModifiers(evt);
+        this.request(bounds, {single: this.single});
+    },
+
+    /**
+     * Method: selectBox
+     * Callback from the handlers.box set up when <box> selection is on
+     *
+     * Parameters:
+     * position - {<OpenLayers.Bounds>}  
+     */
+    selectBox: function(position) {
+        var bounds;
+        if (position instanceof OpenLayers.Bounds) {
+            var minXY = this.map.getLonLatFromPixel(
+                new OpenLayers.Pixel(position.left, position.bottom)
+            );
+            var maxXY = this.map.getLonLatFromPixel(
+                new OpenLayers.Pixel(position.right, position.top)
+            );
+            bounds = new OpenLayers.Bounds(
+                minXY.lon, minXY.lat, maxXY.lon, maxXY.lat
+            );
+            
+        } else {
+            if(this.click) {
+                // box without extent - let the click handler take care of it
+                return;
+            }
+            bounds = this.pixelToBounds(position);
+        }
+        this.setModifiers(this.handlers.box.dragHandler.evt);
+        this.request(bounds);
+    },
+    
+    /**
+     * Method selectHover
+     * Callback from the handlers.hover set up when <hover> selection is on
+     *
+     * Parameters:
+     * evt {Object} - event object with an xy property
+     */
+    selectHover: function(evt) {
+        var bounds = this.pixelToBounds(evt.xy);
+        this.request(bounds, {single: true, hover: true});
+    },
+
+    /**
+     * Method: cancelHover
+     * Callback from the handlers.hover set up when <hover> selection is on
+     */
+    cancelHover: function() {
+        if (this.hoverResponse) {
+            this.protocol.abort(this.hoverResponse);
+            this.hoverResponse = null;
+
+            OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+        }
+    },
+
+    /**
+     * Method: request
+     * Sends a GetFeature request to the WFS
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} bounds for the request's BBOX filter
+     * options - {Object} additional options for this method.
+     * 
+     * Supported options include:
+     * single - {Boolean} A single feature should be returned.
+     *     Note that this will be ignored if the protocol does not
+     *     return the geometries of the features.
+     * hover - {Boolean} Do the request for the hover handler.
+     */
+    request: function(bounds, options) {
+        options = options || {};
+        var filter = new OpenLayers.Filter.Spatial({
+            type: this.filterType, 
+            value: bounds
+        });
+        
+        // Set the cursor to "wait" to tell the user we're working.
+        OpenLayers.Element.addClass(this.map.viewPortDiv, "olCursorWait");
+
+        var response = this.protocol.read({
+            maxFeatures: options.single == true ? this.maxFeatures : undefined,
+            filter: filter,
+            callback: function(result) {
+                if(result.success()) {
+                    if(result.features.length) {
+                        if(options.single == true) {
+                            this.selectBestFeature(result.features,
+                                bounds.getCenterLonLat(), options);
+                        } else {
+                            this.select(result.features);
+                        }
+                    } else if(options.hover) {
+                        this.hoverSelect();
+                    } else {
+                        this.events.triggerEvent("clickout");
+                        if(this.clickout) {
+                            this.unselectAll();
+                        }
+                    }
+                }
+                // Reset the cursor.
+                OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");
+            },
+            scope: this
+        });
+        if(options.hover == true) {
+            this.hoverResponse = response;
+        }
+    },
+
+    /**
+     * Method: selectBestFeature
+     * Selects the feature from an array of features that is the best match
+     *     for the click position.
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)}
+     * clickPosition - {<OpenLayers.LonLat>}
+     * options - {Object} additional options for this method
+     * 
+     * Supported options include:
+     * hover - {Boolean} Do the selection for the hover handler.
+     */
+    selectBestFeature: function(features, clickPosition, options) {
+        options = options || {};
+        if(features.length) {
+            var point = new OpenLayers.Geometry.Point(clickPosition.lon,
+                clickPosition.lat);
+            var feature, resultFeature, dist;
+            var minDist = Number.MAX_VALUE;
+            for(var i=0; i<features.length; ++i) {
+                feature = features[i];
+                if(feature.geometry) {
+                    dist = point.distanceTo(feature.geometry, {edge: false});
+                    if(dist < minDist) {
+                        minDist = dist;
+                        resultFeature = feature;
+                        if(minDist == 0) {
+                            break;
+                        }
+                    }
+                }
+            }
+            
+            if(options.hover == true) {
+                this.hoverSelect(resultFeature);
+            } else {
+                this.select(resultFeature || features);
+            } 
+        }
+    },
+    
+    /**
+     * Method: setModifiers
+     * Sets the multiple and toggle modifiers according to the current event
+     * 
+     * Parameters:
+     * evt {<OpenLayers.Event>}
+     */
+    setModifiers: function(evt) {
+        this.modifiers = {
+            multiple: this.multiple || (this.multipleKey && evt[this.multipleKey]),
+            toggle: this.toggle || (this.toggleKey && evt[this.toggleKey])
+        };        
+    },
+
+    /**
+     * Method: select
+     * Add feature to the hash of selected features and trigger the
+     * featureselected and featuresselected events.
+     * 
+     * Parameters:
+     * features - {<OpenLayers.Feature.Vector>} or an array of features
+     */
+    select: function(features) {
+        if(!this.modifiers.multiple && !this.modifiers.toggle) {
+            this.unselectAll();
+        }
+        if(!(features instanceof Array)) {
+            features = [features];
+        }
+        
+        var cont = this.events.triggerEvent("beforefeaturesselected", {
+            features: features
+        });
+        if(cont !== false) {
+            var selectedFeatures = [];
+            var feature;
+            for(var i=0, len=features.length; i<len; ++i) {
+                feature = features[i];
+                if(this.features[feature.fid || feature.id]) {
+                    if(this.modifiers.toggle) {
+                        this.unselect(this.features[feature.fid || feature.id]);
+                    }
+                } else {
+                    cont = this.events.triggerEvent("beforefeatureselected", {
+                        feature: feature
+                    });
+                    if(cont !== false) {
+                        this.features[feature.fid || feature.id] = feature;
+                        selectedFeatures.push(feature);
+                
+                        this.events.triggerEvent("featureselected",
+                            {feature: feature});
+                    }
+                }
+            }
+            this.events.triggerEvent("featuresselected", {
+                features: selectedFeatures
+            });
+        }
+    },
+    
+    /**
+     * Method: hoverSelect
+     * Sets/unsets the <hoverFeature>
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} the feature to hover-select.
+     *     If none is provided, the current <hoverFeature> will be nulled and
+     *     the outfeature event will be triggered.
+     */
+    hoverSelect: function(feature) {
+        var fid = feature ? feature.fid || feature.id : null;
+        var hfid = this.hoverFeature ?
+            this.hoverFeature.fid || this.hoverFeature.id : null;
+            
+        if(hfid && hfid != fid) {
+            this.events.triggerEvent("outfeature",
+                {feature: this.hoverFeature});
+            this.hoverFeature = null;
+        }
+        if(fid && fid != hfid) {
+            this.events.triggerEvent("hoverfeature", {feature: feature});
+            this.hoverFeature = feature;
+        }
+    },
+
+    /**
+     * Method: unselect
+     * Remove feature from the hash of selected features and trigger the
+     * featureunselected event.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     */
+    unselect: function(feature) {
+        delete this.features[feature.fid || feature.id];
+        this.events.triggerEvent("featureunselected", {feature: feature});
+    },
+    
+    /**
+     * Method: unselectAll
+     * Unselect all selected features.
+     */
+    unselectAll: function() {
+        // we'll want an option to supress notification here
+        for(var fid in this.features) {
+            this.unselect(this.features[fid]);
+        }
+    },
+    
+    /** 
+     * Method: setMap
+     * Set the map property for the control. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        for(var i in this.handlers) {
+            this.handlers[i].setMap(map);
+        }
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+    
+    /**
+     * Method: pixelToBounds
+     * Takes a pixel as argument and creates bounds after adding the
+     * <clickTolerance>.
+     * 
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>}
+     */
+    pixelToBounds: function(pixel) {
+        var llPx = pixel.add(-this.clickTolerance/2, this.clickTolerance/2);
+        var urPx = pixel.add(this.clickTolerance/2, -this.clickTolerance/2);
+        var ll = this.map.getLonLatFromPixel(llPx);
+        var ur = this.map.getLonLatFromPixel(urPx);
+        return new OpenLayers.Bounds(ll.lon, ll.lat, ur.lon, ur.lat);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.GetFeature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomBox.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomBox.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ZoomBox.js	(revision 76)
@@ -0,0 +1,95 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Handler/Box.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ZoomBox
+ * The ZoomBox control enables zooming directly to a given extent, by drawing 
+ * a box on the map. The box is drawn by holding down shift, whilst dragging 
+ * the mouse.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ZoomBox = OpenLayers.Class(OpenLayers.Control, {
+    /**
+     * Property: type
+     * {OpenLayers.Control.TYPE}
+     */
+    type: OpenLayers.Control.TYPE_TOOL,
+
+    /**
+     * Property: out
+     * {Boolean} Should the control be used for zooming out?
+     */
+    out: false,
+
+    /**
+     * Property: alwaysZoom
+     * {Boolean} Always zoom in/out, when box drawed 
+     */
+    alwaysZoom: false,
+
+    /**
+     * Method: draw
+     */    
+    draw: function() {
+        this.handler = new OpenLayers.Handler.Box( this,
+                            {done: this.zoomBox}, {keyMask: this.keyMask} );
+    },
+
+    /**
+     * Method: zoomBox
+     *
+     * Parameters:
+     * position - {<OpenLayers.Bounds>} or {<OpenLayers.Pixel>}
+     */
+    zoomBox: function (position) {
+        if (position instanceof OpenLayers.Bounds) {
+            var bounds;
+            if (!this.out) {
+                var minXY = this.map.getLonLatFromPixel(
+                            new OpenLayers.Pixel(position.left, position.bottom));
+                var maxXY = this.map.getLonLatFromPixel(
+                            new OpenLayers.Pixel(position.right, position.top));
+                bounds = new OpenLayers.Bounds(minXY.lon, minXY.lat,
+                                               maxXY.lon, maxXY.lat);
+            } else {
+                var pixWidth = Math.abs(position.right-position.left);
+                var pixHeight = Math.abs(position.top-position.bottom);
+                var zoomFactor = Math.min((this.map.size.h / pixHeight),
+                    (this.map.size.w / pixWidth));
+                var extent = this.map.getExtent();
+                var center = this.map.getLonLatFromPixel(
+                    position.getCenterPixel());
+                var xmin = center.lon - (extent.getWidth()/2)*zoomFactor;
+                var xmax = center.lon + (extent.getWidth()/2)*zoomFactor;
+                var ymin = center.lat - (extent.getHeight()/2)*zoomFactor;
+                var ymax = center.lat + (extent.getHeight()/2)*zoomFactor;
+                bounds = new OpenLayers.Bounds(xmin, ymin, xmax, ymax);
+            }
+            // always zoom in/out 
+            var lastZoom = this.map.getZoom(); 
+            this.map.zoomToExtent(bounds);
+            if (lastZoom == this.map.getZoom() && this.alwaysZoom == true){ 
+                this.map.zoomTo(lastZoom + (this.out ? -1 : 1)); 
+            }
+        } else { // it's a pixel
+            if (!this.out) {
+                this.map.setCenter(this.map.getLonLatFromPixel(position),
+                               this.map.getZoom() + 1);
+            } else {
+                this.map.setCenter(this.map.getLonLatFromPixel(position),
+                               this.map.getZoom() - 1);
+            }
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ZoomBox"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/PanPanel.js	(revision 76)
@@ -0,0 +1,63 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/Panel.js
+ * @requires OpenLayers/Control/Pan.js
+ */
+
+/**
+ * Class: OpenLayers.Control.PanPanel
+ * The PanPanel is visible control for panning the map North, South, East or
+ * West in small steps. By default it is drawn in the top left corner of the
+ * map.
+ *
+ * Note: 
+ * If you wish to use this class with the default images and you want 
+ *       it to look nice in ie6, you should add the following, conditionally
+ *       added css stylesheet to your HTML file:
+ * 
+ * (code)
+ * <!--[if lte IE 6]>
+ *   <link rel="stylesheet" href="../theme/default/ie6-style.css" type="text/css" />
+ * <![endif]-->
+ * (end)
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control.Panel> 
+ */
+OpenLayers.Control.PanPanel = OpenLayers.Class(OpenLayers.Control.Panel, {
+
+    /** 
+     * APIProperty: slideFactor
+     * {Integer} Number of pixels by which we'll pan the map in any direction 
+     *     on clicking the arrow buttons, defaults to 50.
+     */
+    slideFactor: 50,
+
+    /**
+     * Constructor: OpenLayers.Control.PanPanel 
+     * Add the four directional pan buttons.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.Panel.prototype.initialize.apply(this, [options]);
+        this.addControls([
+            new OpenLayers.Control.Pan(OpenLayers.Control.Pan.NORTH,
+                                       {slideFactor: this.slideFactor}),
+            new OpenLayers.Control.Pan(OpenLayers.Control.Pan.SOUTH,
+                                       {slideFactor: this.slideFactor}),
+            new OpenLayers.Control.Pan(OpenLayers.Control.Pan.EAST,
+                                       {slideFactor: this.slideFactor}),
+            new OpenLayers.Control.Pan(OpenLayers.Control.Pan.WEST,
+                                       {slideFactor: this.slideFactor})
+        ]);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.PanPanel"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Panel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Panel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/Panel.js	(revision 76)
@@ -0,0 +1,371 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control.js
+ */
+
+/**
+ * Class: OpenLayers.Control.Panel
+ * The Panel control is a container for other controls. With it toolbars
+ * may be composed.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
+    /**
+     * Property: controls
+     * {Array(<OpenLayers.Control>)}
+     */
+    controls: null,    
+    
+    /**
+     * APIProperty: autoActivate
+     * {Boolean} Activate the control when it is added to a map.  Default is
+     *     true.
+     */
+    autoActivate: true,
+
+    /** 
+     * APIProperty: defaultControl
+     * {<OpenLayers.Control>} The control which is activated when the control is
+     * activated (turned on), which also happens at instantiation.
+     * If <saveState> is true, <defaultControl> will be nullified after the
+     * first activation of the panel.
+     */
+    defaultControl: null,
+    
+    /**
+     * APIProperty: saveState
+     * {Boolean} If set to true, the active state of this panel's controls will
+     * be stored on panel deactivation, and restored on reactivation. Default
+     * is false.
+     */
+    saveState: false,
+      
+    /**
+     * Property: activeState
+     * {Object} stores the active state of this panel's controls.
+     */
+    activeState: null,
+
+    /**
+     * Constructor: OpenLayers.Control.Panel
+     * Create a new control panel.
+     *
+     * Each control in the panel is represented by an icon. When clicking 
+     *     on an icon, the <activateControl> method is called.
+     *
+     * Specific properties for controls on a panel:
+     * type - {Number} One of <OpenLayers.Control.TYPE_TOOL>,
+     *     <OpenLayers.Control.TYPE_TOGGLE>, <OpenLayers.Control.TYPE_BUTTON>.
+     *     If not provided, <OpenLayers.Control.TYPE_TOOL> is assumed.
+     * title - {string} Text displayed when mouse is over the icon that 
+     *     represents the control.     
+     *
+     * The <OpenLayers.Control.type> of a control determines the behavior when
+     * clicking its icon:
+     * <OpenLayers.Control.TYPE_TOOL> - The control is activated and other
+     *     controls of this type in the same panel are deactivated. This is
+     *     the default type.
+     * <OpenLayers.Control.TYPE_TOGGLE> - The active state of the control is
+     *     toggled.
+     * <OpenLayers.Control.TYPE_BUTTON> - The
+     *     <OpenLayers.Control.Button.trigger> method of the control is called,
+     *     but its active state is not changed.
+     *
+     * If a control is <OpenLayers.Control.active>, it will be drawn with the
+     * olControl[Name]ItemActive class, otherwise with the
+     * olControl[Name]ItemInactive class.
+     *
+     * Parameters:
+     * options - {Object} An optional object whose properties will be used
+     *     to extend the control.
+     */
+    initialize: function(options) {
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        this.controls = [];
+        this.activeState = {};
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        OpenLayers.Control.prototype.destroy.apply(this, arguments);
+        for(var i = this.controls.length - 1 ; i >= 0; i--) {
+            if(this.controls[i].events) {
+                this.controls[i].events.un({
+                    "activate": this.redraw,
+                    "deactivate": this.redraw,
+                    scope: this
+                });
+            }
+            OpenLayers.Event.stopObservingElement(this.controls[i].panel_div);
+            this.controls[i].panel_div = null;
+        }
+        this.activeState = null;
+    },
+
+    /**
+     * APIMethod: activate
+     */
+    activate: function() {
+        if (OpenLayers.Control.prototype.activate.apply(this, arguments)) {
+            var control;
+            for (var i=0, len=this.controls.length; i<len; i++) {
+                control = this.controls[i];
+                if (control === this.defaultControl ||
+                            (this.saveState && this.activeState[control.id])) {
+                    control.activate();
+                }
+            }    
+            if (this.saveState === true) {
+                this.defaultControl = null;
+            }
+            this.redraw();
+            return true;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * APIMethod: deactivate
+     */
+    deactivate: function() {
+        if (OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
+            var control;
+            for (var i=0, len=this.controls.length; i<len; i++) {
+                control = this.controls[i];
+                this.activeState[control.id] = control.deactivate();
+            }    
+            return true;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: draw
+     *
+     * Returns:
+     * {DOMElement}
+     */    
+    draw: function() {
+        OpenLayers.Control.prototype.draw.apply(this, arguments);
+        this.addControlsToMap(this.controls);
+        return this.div;
+    },
+
+    /**
+     * Method: redraw
+     */
+    redraw: function() {
+        if (this.div.children.length>0) {
+            for (var l=this.div.children.length, i=l-1 ; i>=0 ; i--) {
+                this.div.removeChild(this.div.children[i]);
+            }
+        }
+        this.div.innerHTML = "";
+        if (this.active) {
+            for (var i=0, len=this.controls.length; i<len; i++) {
+                var element = this.controls[i].panel_div;
+                if (this.controls[i].active) {
+                    element.className = this.controls[i].displayClass + "ItemActive";
+                } else {    
+                    element.className = this.controls[i].displayClass + "ItemInactive";
+                }    
+                this.div.appendChild(element);
+            }
+        }
+    },
+
+    /**
+     * APIMethod: activateControl
+     * This method is called when the user click on the icon representing a 
+     *     control in the panel.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>}
+     */
+    activateControl: function (control) {
+        if (!this.active) { return false; }
+        if (control.type == OpenLayers.Control.TYPE_BUTTON) {
+            control.trigger();
+            this.redraw();
+            return;
+        }
+        if (control.type == OpenLayers.Control.TYPE_TOGGLE) {
+            if (control.active) {
+                control.deactivate();
+            } else {
+                control.activate();
+            }
+            this.redraw();
+            return;
+        }
+        var c;
+        for (var i=0, len=this.controls.length; i<len; i++) {
+            c = this.controls[i];
+            if (c != control &&
+               (c.type === OpenLayers.Control.TYPE_TOOL || c.type == null)) {
+                c.deactivate();
+            }
+        }
+        control.activate();
+    },
+
+    /**
+     * APIMethod: addControls
+     * To build a toolbar, you add a set of controls to it. addControls
+     * lets you add a single control or a list of controls to the 
+     * Control Panel.
+     *
+     * Parameters:
+     * controls - {<OpenLayers.Control>} Controls to add in the panel.
+     */    
+    addControls: function(controls) {
+        if (!(controls instanceof Array)) {
+            controls = [controls];
+        }
+        this.controls = this.controls.concat(controls);
+        
+        // Give each control a panel_div which will be used later.
+        // Access to this div is via the panel_div attribute of the 
+        // control added to the panel.
+        // Also, stop mousedowns and clicks, but don't stop mouseup,
+        // since they need to pass through.
+        for (var i=0, len=controls.length; i<len; i++) {
+            var element = document.createElement("div");
+            controls[i].panel_div = element;
+            if (controls[i].title != "") {
+                controls[i].panel_div.title = controls[i].title;
+            }
+            OpenLayers.Event.observe(controls[i].panel_div, "click", 
+                OpenLayers.Function.bind(this.onClick, this, controls[i]));
+            OpenLayers.Event.observe(controls[i].panel_div, "dblclick", 
+                OpenLayers.Function.bind(this.onDoubleClick, this, controls[i]));
+            OpenLayers.Event.observe(controls[i].panel_div, "mousedown", 
+                OpenLayers.Function.bindAsEventListener(OpenLayers.Event.stop));
+        }    
+
+        if (this.map) { // map.addControl() has already been called on the panel
+            this.addControlsToMap(controls);
+            this.redraw();
+        }
+    },
+   
+    /**
+     * Method: addControlsToMap
+     * Only for internal use in draw() and addControls() methods.
+     *
+     * Parameters:
+     * controls - {Array(<OpenLayers.Control>)} Controls to add into map.
+     */         
+    addControlsToMap: function (controls) {
+        var control;
+        for (var i=0, len=controls.length; i<len; i++) {
+            control = controls[i];
+            if (control.autoActivate === true) {
+                control.autoActivate = false;
+                this.map.addControl(control);
+                control.autoActivate = true;
+            } else {
+                this.map.addControl(control);
+                control.deactivate();
+            }
+            control.events.on({
+                "activate": this.redraw,
+                "deactivate": this.redraw,
+                scope: this
+            });
+        }  
+    },
+
+    /**
+     * Method: onClick
+     */
+    onClick: function (ctrl, evt) {
+        OpenLayers.Event.stop(evt ? evt : window.event);
+        this.activateControl(ctrl);
+    },
+
+    /**
+     * Method: onDoubleClick
+     */
+    onDoubleClick: function(ctrl, evt) {
+        OpenLayers.Event.stop(evt ? evt : window.event);
+    },
+
+    /**
+     * APIMethod: getControlsBy
+     * Get a list of controls with properties matching the given criteria.
+     *
+     * Parameter:
+     * property - {String} A control property to be matched.
+     * match - {String | Object} A string to match.  Can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     match.test(control[property]) evaluates to true, the control will be
+     *     included in the array returned.  If no controls are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Control>)} A list of controls matching the given criteria.
+     *     An empty array is returned if no matches are found.
+     */
+    getControlsBy: function(property, match) {
+        var test = (typeof match.test == "function");
+        var found = OpenLayers.Array.filter(this.controls, function(item) {
+            return item[property] == match || (test && match.test(item[property]));
+        });
+        return found;
+    },
+
+    /**
+     * APIMethod: getControlsByName
+     * Get a list of contorls with names matching the given name.
+     *
+     * Parameter:
+     * match - {String | Object} A control name.  The name can also be a regular
+     *     expression literal or object.  In addition, it can be any object
+     *     with a method named test.  For reqular expressions or other, if
+     *     name.test(control.name) evaluates to true, the control will be included
+     *     in the list of controls returned.  If no controls are found, an empty
+     *     array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Control>)} A list of controls matching the given name.
+     *     An empty array is returned if no matches are found.
+     */
+    getControlsByName: function(match) {
+        return this.getControlsBy("name", match);
+    },
+
+    /**
+     * APIMethod: getControlsByClass
+     * Get a list of controls of a given type (CLASS_NAME).
+     *
+     * Parameter:
+     * match - {String | Object} A control class name.  The type can also be a
+     *     regular expression literal or object.  In addition, it can be any
+     *     object with a method named test.  For reqular expressions or other,
+     *     if type.test(control.CLASS_NAME) evaluates to true, the control will
+     *     be included in the list of controls returned.  If no controls are
+     *     found, an empty array is returned.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Control>)} A list of controls matching the given type.
+     *     An empty array is returned if no matches are found.
+     */
+    getControlsByClass: function(match) {
+        return this.getControlsBy("CLASS_NAME", match);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.Panel"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ModifyFeature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ModifyFeature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Control/ModifyFeature.js	(revision 76)
@@ -0,0 +1,777 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Control/DragFeature.js
+ * @requires OpenLayers/Control/SelectFeature.js
+ * @requires OpenLayers/Handler/Keyboard.js
+ */
+
+/**
+ * Class: OpenLayers.Control.ModifyFeature
+ * Control to modify features.  When activated, a click renders the vertices
+ *     of a feature - these vertices can then be dragged.  By default, the
+ *     delete key will delete the vertex under the mouse.  New features are
+ *     added by dragging "virtual vertices" between vertices.  Create a new
+ *     control with the <OpenLayers.Control.ModifyFeature> constructor.
+ *
+ * Inherits From:
+ *  - <OpenLayers.Control>
+ */
+OpenLayers.Control.ModifyFeature = OpenLayers.Class(OpenLayers.Control, {
+
+    /**
+     * APIProperty: geometryTypes
+     * {Array(String)} To restrict modification to a limited set of geometry
+     *     types, send a list of strings corresponding to the geometry class
+     *     names.
+     */
+    geometryTypes: null,
+
+    /**
+     * APIProperty: clickout
+     * {Boolean} Unselect features when clicking outside any feature.
+     *     Default is true.
+     */
+    clickout: true,
+
+    /**
+     * APIProperty: toggle
+     * {Boolean} Unselect a selected feature on click.
+     *      Default is true.
+     */
+    toggle: true,
+    
+    /**
+     * APIProperty: standalone
+     * {Boolean} Set to true to create a control without SelectFeature
+     *     capabilities. Default is false.  If standalone is true, to modify
+     *     a feature, call the <selectFeature> method with the target feature.
+     *     Note that you must call the <unselectFeature> method to finish
+     *     feature modification in standalone mode (before starting to modify
+     *     another feature).
+     */
+    standalone: false,
+
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>}
+     */
+    layer: null,
+    
+    /**
+     * Property: feature
+     * {<OpenLayers.Feature.Vector>} Feature currently available for modification.
+     */
+    feature: null,
+    
+    /**
+     * Property: vertices
+     * {Array(<OpenLayers.Feature.Vector>)} Verticies currently available
+     *     for dragging.
+     */
+    vertices: null,
+    
+    /**
+     * Property: virtualVertices
+     * {Array(<OpenLayers.Feature.Vector>)} Virtual vertices in the middle
+     *     of each edge.
+     */
+    virtualVertices: null,
+
+    /**
+     * Property: selectControl
+     * {<OpenLayers.Control.SelectFeature>}
+     */
+    selectControl: null,
+    
+    /**
+     * Property: dragControl
+     * {<OpenLayers.Control.DragFeature>}
+     */
+    dragControl: null,
+    
+    /**
+     * Property: handlers
+     * {Object}
+     */
+    handlers: null,
+    
+    /**
+     * APIProperty: deleteCodes
+     * {Array(Integer)} Keycodes for deleting verticies.  Set to null to disable
+     *     vertex deltion by keypress.  If non-null, keypresses with codes
+     *     in this array will delete vertices under the mouse. Default
+     *     is 46 and 68, the 'delete' and lowercase 'd' keys.
+     */
+    deleteCodes: null,
+
+    /**
+     * APIProperty: virtualStyle
+     * {Object} A symbolizer to be used for virtual vertices.
+     */
+    virtualStyle: null,
+
+    /**
+     * APIProperty: mode
+     * {Integer} Bitfields specifying the modification mode. Defaults to
+     *      OpenLayers.Control.ModifyFeature.RESHAPE. To set the mode to a
+     *      combination of options, use the | operator. For example, to allow
+     *      the control to both resize and rotate features, use the following
+     *      syntax
+     * (code)
+     * control.mode = OpenLayers.Control.ModifyFeature.RESIZE |
+     *                OpenLayers.Control.ModifyFeature.ROTATE;
+     *  (end)
+     */
+    mode: null,
+
+    /**
+     * Property: modified
+     * {Boolean} The currently selected feature has been modified.
+     */
+    modified: false,
+
+    /**
+     * Property: radiusHandle
+     * {<OpenLayers.Feature.Vector>} A handle for rotating/resizing a feature.
+     */
+    radiusHandle: null,
+
+    /**
+     * Property: dragHandle
+     * {<OpenLayers.Feature.Vector>} A handle for dragging a feature.
+     */
+    dragHandle: null,
+
+    /**
+     * APIProperty: onModificationStart 
+     * {Function} *Deprecated*.  Register for "beforefeaturemodified" instead.
+     *     The "beforefeaturemodified" event is triggered on the layer before
+     *     any modification begins.
+     *
+     * Optional function to be called when a feature is selected
+     *     to be modified. The function should expect to be called with a
+     *     feature.  This could be used for example to allow to lock the
+     *     feature on server-side.
+     */
+    onModificationStart: function() {},
+
+    /**
+     * APIProperty: onModification
+     * {Function} *Deprecated*.  Register for "featuremodified" instead.
+     *     The "featuremodified" event is triggered on the layer with each
+     *     feature modification.
+     *
+     * Optional function to be called when a feature has been
+     *     modified.  The function should expect to be called with a feature.
+     */
+    onModification: function() {},
+
+    /**
+     * APIProperty: onModificationEnd
+     * {Function} *Deprecated*.  Register for "afterfeaturemodified" instead.
+     *     The "afterfeaturemodified" event is triggered on the layer after
+     *     a feature has been modified.
+     *
+     * Optional function to be called when a feature is finished 
+     *     being modified.  The function should expect to be called with a
+     *     feature.
+     */
+    onModificationEnd: function() {},
+
+    /**
+     * Constructor: OpenLayers.Control.ModifyFeature
+     * Create a new modify feature control.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.Vector>} Layer that contains features that
+     *     will be modified.
+     * options - {Object} Optional object whose properties will be set on the
+     *     control.
+     */
+    initialize: function(layer, options) {
+        this.layer = layer;
+        this.vertices = [];
+        this.virtualVertices = [];
+        this.virtualStyle = OpenLayers.Util.extend({},
+            this.layer.style || this.layer.styleMap.createSymbolizer());
+        this.virtualStyle.fillOpacity = 0.3;
+        this.virtualStyle.strokeOpacity = 0.3;
+        this.deleteCodes = [46, 68];
+        this.mode = OpenLayers.Control.ModifyFeature.RESHAPE;
+        OpenLayers.Control.prototype.initialize.apply(this, [options]);
+        if(!(this.deleteCodes instanceof Array)) {
+            this.deleteCodes = [this.deleteCodes];
+        }
+        var control = this;
+
+        // configure the select control
+        var selectOptions = {
+            geometryTypes: this.geometryTypes,
+            clickout: this.clickout,
+            toggle: this.toggle,
+            onBeforeSelect: this.beforeSelectFeature,
+            onSelect: this.selectFeature,
+            onUnselect: this.unselectFeature,
+            scope: this
+        };
+        if(this.standalone === false) {
+            this.selectControl = new OpenLayers.Control.SelectFeature(
+                layer, selectOptions
+            );
+        }
+
+        // configure the drag control
+        var dragOptions = {
+            geometryTypes: ["OpenLayers.Geometry.Point"],
+            snappingOptions: this.snappingOptions,
+            onStart: function(feature, pixel) {
+                control.dragStart.apply(control, [feature, pixel]);
+            },
+            onDrag: function(feature, pixel) {
+                control.dragVertex.apply(control, [feature, pixel]);
+            },
+            onComplete: function(feature) {
+                control.dragComplete.apply(control, [feature]);
+            },
+            featureCallbacks: {
+                over: function(feature) {
+                    /**
+                     * In normal mode, the feature handler is set up to allow
+                     * dragging of all points.  In standalone mode, we only
+                     * want to allow dragging of sketch vertices and virtual
+                     * vertices - or, in the case of a modifiable point, the
+                     * point itself.
+                     */
+                    if(control.standalone !== true || feature._sketch ||
+                       control.feature === feature) {
+                        control.dragControl.overFeature.apply(
+                            control.dragControl, [feature]);
+                    }
+                }
+            }
+        };
+        this.dragControl = new OpenLayers.Control.DragFeature(
+            layer, dragOptions
+        );
+
+        // configure the keyboard handler
+        var keyboardOptions = {
+            keydown: this.handleKeypress
+        };
+        this.handlers = {
+            keyboard: new OpenLayers.Handler.Keyboard(this, keyboardOptions)
+        };
+    },
+
+    /**
+     * APIMethod: destroy
+     * Take care of things that are not handled in superclass.
+     */
+    destroy: function() {
+        this.layer = null;
+        this.standalone || this.selectControl.destroy();
+        this.dragControl.destroy();
+        OpenLayers.Control.prototype.destroy.apply(this, []);
+    },
+
+    /**
+     * APIMethod: activate
+     * Activate the control.
+     * 
+     * Returns:
+     * {Boolean} Successfully activated the control.
+     */
+    activate: function() {
+        return ((this.standalone || this.selectControl.activate()) &&
+                this.handlers.keyboard.activate() &&
+                OpenLayers.Control.prototype.activate.apply(this, arguments));
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Deactivate the control.
+     *
+     * Returns: 
+     * {Boolean} Successfully deactivated the control.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        // the return from the controls is unimportant in this case
+        if(OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
+            this.layer.removeFeatures(this.vertices, {silent: true});
+            this.layer.removeFeatures(this.virtualVertices, {silent: true});
+            this.vertices = [];
+            this.dragControl.deactivate();
+            var feature = this.feature;
+            var valid = feature && feature.geometry && feature.layer;
+            if(this.standalone === false) {
+                if(valid) {
+                    this.selectControl.unselect.apply(this.selectControl,
+                                                      [feature]);
+                }
+                this.selectControl.deactivate();
+            } else {
+                if(valid) {
+                    this.unselectFeature(feature);
+                }
+            }
+            this.handlers.keyboard.deactivate();
+            deactivated = true;
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: beforeSelectFeature
+     * Called before a feature is selected.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature about to be selected.
+     */
+    beforeSelectFeature: function(feature) {
+        return this.layer.events.triggerEvent(
+            "beforefeaturemodified", {feature: feature}
+        );
+    },
+
+    /**
+     * Method: selectFeature
+     * Called when the select feature control selects a feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} the selected feature.
+     */
+    selectFeature: function(feature) {
+        this.feature = feature;
+        this.modified = false;
+        this.resetVertices();
+        this.dragControl.activate();
+        this.onModificationStart(this.feature);
+    },
+
+    /**
+     * Method: unselectFeature
+     * Called when the select feature control unselects a feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The unselected feature.
+     */
+    unselectFeature: function(feature) {
+        this.layer.removeFeatures(this.vertices, {silent: true});
+        this.vertices = [];
+        this.layer.destroyFeatures(this.virtualVertices, {silent: true});
+        this.virtualVertices = [];
+        if(this.dragHandle) {
+            this.layer.destroyFeatures([this.dragHandle], {silent: true});
+            delete this.dragHandle;
+        }
+        if(this.radiusHandle) {
+            this.layer.destroyFeatures([this.radiusHandle], {silent: true});
+            delete this.radiusHandle;
+        }
+        this.feature = null;
+        this.dragControl.deactivate();
+        this.onModificationEnd(feature);
+        this.layer.events.triggerEvent("afterfeaturemodified", {
+            feature: feature,
+            modified: this.modified
+        });
+        this.modified = false;
+    },
+
+    /**
+     * Method: dragStart
+     * Called by the drag feature control with before a feature is dragged.
+     *     This method is used to differentiate between points and vertices
+     *     of higher order geometries.  This respects the <geometryTypes>
+     *     property and forces a select of points when the drag control is
+     *     already active (and stops events from propagating to the select
+     *     control).
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The point or vertex about to be
+     *     dragged.
+     * pixel - {<OpenLayers.Pixel>} Pixel location of the mouse event.
+     */
+    dragStart: function(feature, pixel) {
+        // only change behavior if the feature is not in the vertices array
+        if(feature != this.feature && !feature.geometry.parent &&
+           feature != this.dragHandle && feature != this.radiusHandle) {
+            if(this.standalone === false && this.feature) {
+                // unselect the currently selected feature
+                this.selectControl.clickFeature.apply(this.selectControl,
+                                                      [this.feature]);
+            }
+            // check any constraints on the geometry type
+            if(this.geometryTypes == null ||
+               OpenLayers.Util.indexOf(this.geometryTypes,
+                                       feature.geometry.CLASS_NAME) != -1) {
+                // select the point
+                this.standalone || this.selectControl.clickFeature.apply(
+                                            this.selectControl, [feature]);
+                /**
+                 * TBD: These lines improve workflow by letting the user
+                 *     immediately start dragging after the mouse down.
+                 *     However, it is very ugly to be messing with controls
+                 *     and their handlers in this way.  I'd like a better
+                 *     solution if the workflow change is necessary.
+                 */
+                // prepare the point for dragging
+                this.dragControl.overFeature.apply(this.dragControl,
+                                                   [feature]);
+                this.dragControl.lastPixel = pixel;
+                this.dragControl.handlers.drag.started = true;
+                this.dragControl.handlers.drag.start = pixel;
+                this.dragControl.handlers.drag.last = pixel;
+            }
+        }
+    },
+    
+    /**
+     * Method: dragVertex
+     * Called by the drag feature control with each drag move of a vertex.
+     *
+     * Parameters:
+     * vertex - {<OpenLayers.Feature.Vector>} The vertex being dragged.
+     * pixel - {<OpenLayers.Pixel>} Pixel location of the mouse event.
+     */
+    dragVertex: function(vertex, pixel) {
+        this.modified = true;
+        /**
+         * Five cases:
+         * 1) dragging a simple point
+         * 2) dragging a virtual vertex
+         * 3) dragging a drag handle
+         * 4) dragging a real vertex
+         * 5) dragging a radius handle
+         */
+        if(this.feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+            // dragging a simple point
+            if(this.feature != vertex) {
+                this.feature = vertex;
+            }
+            this.layer.events.triggerEvent("vertexmodified", {
+                vertex: vertex.geometry,
+                feature: this.feature,
+                pixel: pixel
+            });
+        } else {
+            if(vertex._index) {
+                // dragging a virtual vertex
+                vertex.geometry.parent.addComponent(vertex.geometry,
+                                                    vertex._index);
+                // move from virtual to real vertex
+                delete vertex._index;
+                OpenLayers.Util.removeItem(this.virtualVertices, vertex);
+                this.vertices.push(vertex);
+            } else if(vertex == this.dragHandle) {
+                // dragging a drag handle
+                this.layer.removeFeatures(this.vertices, {silent: true});
+                this.vertices = [];
+                if(this.radiusHandle) {
+                    this.layer.destroyFeatures([this.radiusHandle], {silent: true});
+                    this.radiusHandle = null;
+                }
+            } else if(vertex !== this.radiusHandle) {
+                // dragging a real vertex
+                this.layer.events.triggerEvent("vertexmodified", {
+                    vertex: vertex.geometry,
+                    feature: this.feature,
+                    pixel: pixel
+                });
+            }
+            // dragging a radius handle - no special treatment
+            if(this.virtualVertices.length > 0) {
+                this.layer.destroyFeatures(this.virtualVertices, {silent: true});
+                this.virtualVertices = [];
+            }
+            this.layer.drawFeature(this.feature, this.standalone ? undefined :
+                                            this.selectControl.renderIntent);
+        }
+        // keep the vertex on top so it gets the mouseout after dragging
+        // this should be removed in favor of an option to draw under or
+        // maintain node z-index
+        this.layer.drawFeature(vertex);
+    },
+    
+    /**
+     * Method: dragComplete
+     * Called by the drag feature control when the feature dragging is complete.
+     *
+     * Parameters:
+     * vertex - {<OpenLayers.Feature.Vector>} The vertex being dragged.
+     */
+    dragComplete: function(vertex) {
+        this.resetVertices();
+        this.setFeatureState();
+        this.onModification(this.feature);
+        this.layer.events.triggerEvent("featuremodified", 
+                                       {feature: this.feature});
+    },
+    
+    /**
+     * Method: setFeatureState
+     * Called when the feature is modified.  If the current state is not
+     *     INSERT or DELETE, the state is set to UPDATE.
+     */
+    setFeatureState: function() {
+        if(this.feature.state != OpenLayers.State.INSERT &&
+           this.feature.state != OpenLayers.State.DELETE) {
+            this.feature.state = OpenLayers.State.UPDATE;
+        }
+    },
+    
+    /**
+     * Method: resetVertices
+     */
+    resetVertices: function() {
+        // if coming from a drag complete we're about to destroy the vertex
+        // that was just dragged. For that reason, the drag feature control
+        // will never detect a mouse-out on that vertex, meaning that the drag
+        // handler won't be deactivated. This can cause errors because the drag
+        // feature control still has a feature to drag but that feature is
+        // destroyed. To prevent this, we call outFeature on the drag feature
+        // control if the control actually has a feature to drag.
+        if(this.dragControl.feature) {
+            this.dragControl.outFeature(this.dragControl.feature);
+        }
+        if(this.vertices.length > 0) {
+            this.layer.removeFeatures(this.vertices, {silent: true});
+            this.vertices = [];
+        }
+        if(this.virtualVertices.length > 0) {
+            this.layer.removeFeatures(this.virtualVertices, {silent: true});
+            this.virtualVertices = [];
+        }
+        if(this.dragHandle) {
+            this.layer.destroyFeatures([this.dragHandle], {silent: true});
+            this.dragHandle = null;
+        }
+        if(this.radiusHandle) {
+            this.layer.destroyFeatures([this.radiusHandle], {silent: true});
+            this.radiusHandle = null;
+        }
+        if(this.feature &&
+           this.feature.geometry.CLASS_NAME != "OpenLayers.Geometry.Point") {
+            if((this.mode & OpenLayers.Control.ModifyFeature.DRAG)) {
+                this.collectDragHandle();
+            }
+            if((this.mode & (OpenLayers.Control.ModifyFeature.ROTATE |
+                             OpenLayers.Control.ModifyFeature.RESIZE))) {
+                this.collectRadiusHandle();
+            }
+            if(this.mode & OpenLayers.Control.ModifyFeature.RESHAPE){
+                // Don't collect vertices when we're resizing
+                if (!(this.mode & OpenLayers.Control.ModifyFeature.RESIZE)){
+                    this.collectVertices();
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: handleKeypress
+     * Called by the feature handler on keypress.  This is used to delete
+     *     vertices. If the <deleteCode> property is set, vertices will
+     *     be deleted when a feature is selected for modification and
+     *     the mouse is over a vertex.
+     *
+     * Parameters:
+     * {Integer} Key code corresponding to the keypress event.
+     */
+    handleKeypress: function(evt) {
+        var code = evt.keyCode;
+        
+        // check for delete key
+        if(this.feature &&
+           OpenLayers.Util.indexOf(this.deleteCodes, code) != -1) {
+            var vertex = this.dragControl.feature;
+            if(vertex &&
+               OpenLayers.Util.indexOf(this.vertices, vertex) != -1 &&
+               !this.dragControl.handlers.drag.dragging &&
+               vertex.geometry.parent) {
+                // remove the vertex
+                vertex.geometry.parent.removeComponent(vertex.geometry);
+                this.layer.drawFeature(this.feature, this.standalone ?
+                                       undefined :
+                                       this.selectControl.renderIntent);
+                this.resetVertices();
+                this.setFeatureState();
+                this.onModification(this.feature);
+                this.layer.events.triggerEvent("featuremodified", 
+                                               {feature: this.feature});
+            }
+        }
+    },
+
+    /**
+     * Method: collectVertices
+     * Collect the vertices from the modifiable feature's geometry and push
+     *     them on to the control's vertices array.
+     */
+    collectVertices: function() {
+        this.vertices = [];
+        this.virtualVertices = [];        
+        var control = this;
+        function collectComponentVertices(geometry) {
+            var i, vertex, component, len;
+            if(geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+                vertex = new OpenLayers.Feature.Vector(geometry);
+                vertex._sketch = true;
+                control.vertices.push(vertex);
+            } else {
+                var numVert = geometry.components.length;
+                if(geometry.CLASS_NAME == "OpenLayers.Geometry.LinearRing") {
+                    numVert -= 1;
+                }
+                for(i=0; i<numVert; ++i) {
+                    component = geometry.components[i];
+                    if(component.CLASS_NAME == "OpenLayers.Geometry.Point") {
+                        vertex = new OpenLayers.Feature.Vector(component);
+                        vertex._sketch = true;
+                        control.vertices.push(vertex);
+                    } else {
+                        collectComponentVertices(component);
+                    }
+                }
+                
+                // add virtual vertices in the middle of each edge
+                if(geometry.CLASS_NAME != "OpenLayers.Geometry.MultiPoint") {
+                    for(i=0, len=geometry.components.length; i<len-1; ++i) {
+                        var prevVertex = geometry.components[i];
+                        var nextVertex = geometry.components[i + 1];
+                        if(prevVertex.CLASS_NAME == "OpenLayers.Geometry.Point" &&
+                           nextVertex.CLASS_NAME == "OpenLayers.Geometry.Point") {
+                            var x = (prevVertex.x + nextVertex.x) / 2;
+                            var y = (prevVertex.y + nextVertex.y) / 2;
+                            var point = new OpenLayers.Feature.Vector(
+                                new OpenLayers.Geometry.Point(x, y),
+                                null, control.virtualStyle
+                            );
+                            // set the virtual parent and intended index
+                            point.geometry.parent = geometry;
+                            point._index = i + 1;
+                            point._sketch = true;
+                            control.virtualVertices.push(point);
+                        }
+                    }
+                }
+            }
+        }
+        collectComponentVertices.call(this, this.feature.geometry);
+        this.layer.addFeatures(this.virtualVertices, {silent: true});
+        this.layer.addFeatures(this.vertices, {silent: true});
+    },
+
+    /**
+     * Method: collectDragHandle
+     * Collect the drag handle for the selected geometry.
+     */
+    collectDragHandle: function() {
+        var geometry = this.feature.geometry;
+        var center = geometry.getBounds().getCenterLonLat();
+        var originGeometry = new OpenLayers.Geometry.Point(
+            center.lon, center.lat
+        );
+        var origin = new OpenLayers.Feature.Vector(originGeometry);
+        originGeometry.move = function(x, y) {
+            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
+            geometry.move(x, y);
+        };
+        origin._sketch = true;
+        this.dragHandle = origin;
+        this.layer.addFeatures([this.dragHandle], {silent: true});
+    },
+
+    /**
+     * Method: collectRadiusHandle
+     * Collect the radius handle for the selected geometry.
+     */
+    collectRadiusHandle: function() {
+        var geometry = this.feature.geometry;
+        var bounds = geometry.getBounds();
+        var center = bounds.getCenterLonLat();
+        var originGeometry = new OpenLayers.Geometry.Point(
+            center.lon, center.lat
+        );
+        var radiusGeometry = new OpenLayers.Geometry.Point(
+            bounds.right, bounds.bottom
+        );
+        var radius = new OpenLayers.Feature.Vector(radiusGeometry);
+        var resize = (this.mode & OpenLayers.Control.ModifyFeature.RESIZE);
+        var reshape = (this.mode & OpenLayers.Control.ModifyFeature.RESHAPE);
+        var rotate = (this.mode & OpenLayers.Control.ModifyFeature.ROTATE);
+
+        radiusGeometry.move = function(x, y) {
+            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
+            var dx1 = this.x - originGeometry.x;
+            var dy1 = this.y - originGeometry.y;
+            var dx0 = dx1 - x;
+            var dy0 = dy1 - y;
+            if(rotate) {
+                var a0 = Math.atan2(dy0, dx0);
+                var a1 = Math.atan2(dy1, dx1);
+                var angle = a1 - a0;
+                angle *= 180 / Math.PI;
+                geometry.rotate(angle, originGeometry);
+            }
+            if(resize) {
+                var scale, ratio;
+                // 'resize' together with 'reshape' implies that the aspect 
+                // ratio of the geometry will not be preserved whilst resizing 
+                if (reshape) {
+                    scale = dy1 / dy0;
+                    ratio = (dx1 / dx0) / scale;
+                } else {
+                    var l0 = Math.sqrt((dx0 * dx0) + (dy0 * dy0));
+                    var l1 = Math.sqrt((dx1 * dx1) + (dy1 * dy1));
+                    scale = l1 / l0;
+                }
+                geometry.resize(scale, originGeometry, ratio);
+            }
+        };
+        radius._sketch = true;
+        this.radiusHandle = radius;
+        this.layer.addFeatures([this.radiusHandle], {silent: true});
+    },
+
+    /**
+     * Method: setMap
+     * Set the map property for the control and all handlers.
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>} The control's map.
+     */
+    setMap: function(map) {
+        this.standalone || this.selectControl.setMap(map);
+        this.dragControl.setMap(map);
+        OpenLayers.Control.prototype.setMap.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Control.ModifyFeature"
+});
+
+/**
+ * Constant: RESHAPE
+ * {Integer} Constant used to make the control work in reshape mode
+ */
+OpenLayers.Control.ModifyFeature.RESHAPE = 1;
+/**
+ * Constant: RESIZE
+ * {Integer} Constant used to make the control work in resize mode
+ */
+OpenLayers.Control.ModifyFeature.RESIZE = 2;
+/**
+ * Constant: ROTATE
+ * {Integer} Constant used to make the control work in rotate mode
+ */
+OpenLayers.Control.ModifyFeature.ROTATE = 4;
+/**
+ * Constant: DRAG
+ * {Integer} Constant used to make the control work in drag mode
+ */
+OpenLayers.Control.ModifyFeature.DRAG = 8;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker/Box.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker/Box.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker/Box.js	(revision 76)
@@ -0,0 +1,120 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Marker.js
+ */
+
+/**
+ * Class: OpenLayers.Marker.Box
+ *
+ * Inherits from:
+ *  - <OpenLayers.Marker> 
+ */
+OpenLayers.Marker.Box = OpenLayers.Class(OpenLayers.Marker, {
+
+    /** 
+     * Property: bounds 
+     * {<OpenLayers.Bounds>} 
+     */
+    bounds: null,
+
+    /** 
+     * Property: div 
+     * {DOMElement} 
+     */
+    div: null,
+    
+    /** 
+     * Constructor: OpenLayers.Marker.Box
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * borderColor - {String} 
+     * borderWidth - {int} 
+     */
+    initialize: function(bounds, borderColor, borderWidth) {
+        this.bounds = bounds;
+        this.div    = OpenLayers.Util.createDiv();
+        this.div.style.overflow = 'hidden';
+        this.events = new OpenLayers.Events(this, this.div, null);
+        this.setBorder(borderColor, borderWidth);
+    },
+
+    /**
+     * Method: destroy 
+     */    
+    destroy: function() {
+
+        this.bounds = null;
+        this.div = null;
+
+        OpenLayers.Marker.prototype.destroy.apply(this, arguments);
+    },
+
+    /** 
+     * Method: setBorder
+     * Allow the user to change the box's color and border width
+     * 
+     * Parameters:
+     * color - {String} Default is "red"
+     * width - {int} Default is 2
+     */
+    setBorder: function (color, width) {
+        if (!color) {
+            color = "red";
+        }
+        if (!width) {
+            width = 2;
+        }
+        this.div.style.border = width + "px solid " + color;
+    },
+    
+    /** 
+    * Method: draw
+    * 
+    * Parameters:
+    * px - {<OpenLayers.Pixel>} 
+    * sz - {<OpenLayers.Size>} 
+    * 
+    * Returns: 
+    * {DOMElement} A new DOM Image with this markerŽs icon set at the 
+    *         location passed-in
+    */
+    draw: function(px, sz) {
+        OpenLayers.Util.modifyDOMElement(this.div, null, px, sz);
+        return this.div;
+    }, 
+
+    /**
+     * Method: onScreen
+     * 
+     * Rreturn:
+     * {Boolean} Whether or not the marker is currently visible on screen.
+     */
+    onScreen:function() {
+        var onScreen = false;
+        if (this.map) {
+            var screenBounds = this.map.getExtent();
+            onScreen = screenBounds.containsBounds(this.bounds, true, true);
+        }    
+        return onScreen;
+    },
+    
+    /**
+     * Method: display
+     * Hide or show the icon
+     * 
+     * Parameters:
+     * display - {Boolean} 
+     */
+    display: function(display) {
+        this.div.style.display = (display) ? "" : "none";
+    },
+
+    CLASS_NAME: "OpenLayers.Marker.Box"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer.js	(revision 76)
@@ -0,0 +1,362 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Renderer 
+ * This is the base class for all renderers.
+ *
+ * This is based on a merger code written by Paul Spencer and Bertil Chapuis.
+ * It is largely composed of virtual functions that are to be implemented
+ * in technology-specific subclasses, but there is some generic code too.
+ * 
+ * The functions that *are* implemented here merely deal with the maintenance
+ *  of the size and extent variables, as well as the cached 'resolution' 
+ *  value. 
+ * 
+ * A note to the user that all subclasses should use getResolution() instead
+ *  of directly accessing this.resolution in order to correctly use the 
+ *  cacheing system.
+ *
+ */
+OpenLayers.Renderer = OpenLayers.Class({
+
+    /** 
+     * Property: container
+     * {DOMElement} 
+     */
+    container: null,
+    
+    /**
+     * Property: root
+     * {DOMElement}
+     */
+    root: null,
+
+    /** 
+     * Property: extent
+     * {<OpenLayers.Bounds>}
+     */
+    extent: null,
+
+    /**
+     * Property: locked
+     * {Boolean} If the renderer is currently in a state where many things
+     *     are changing, the 'locked' property is set to true. This means 
+     *     that renderers can expect at least one more drawFeature event to be
+     *     called with the 'locked' property set to 'true': In some renderers,
+     *     this might make sense to use as a 'only update local information'
+     *     flag. 
+     */  
+    locked: false,
+    
+    /** 
+     * Property: size
+     * {<OpenLayers.Size>} 
+     */
+    size: null,
+    
+    /**
+     * Property: resolution
+     * {Float} cache of current map resolution
+     */
+    resolution: null,
+    
+    /**
+     * Property: map  
+     * {<OpenLayers.Map>} Reference to the map -- this is set in Vector's setMap()
+     */
+    map: null,
+    
+    /**
+     * Constructor: OpenLayers.Renderer 
+     *
+     * Parameters:
+     * containerID - {<String>} 
+     * options - {Object} options for this renderer. See sublcasses for
+     *     supported options.
+     */
+    initialize: function(containerID, options) {
+        this.container = OpenLayers.Util.getElement(containerID);
+    },
+    
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        this.container = null;
+        this.extent = null;
+        this.size =  null;
+        this.resolution = null;
+        this.map = null;
+    },
+
+    /**
+     * APIMethod: supported
+     * This should be overridden by specific subclasses
+     * 
+     * Returns:
+     * {Boolean} Whether or not the browser supports the renderer class
+     */
+    supported: function() {
+        return false;
+    },    
+    
+    /**
+     * Method: setExtent
+     * Set the visible part of the layer.
+     *
+     * Resolution has probably changed, so we nullify the resolution 
+     * cache (this.resolution) -- this way it will be re-computed when 
+     * next it is needed.
+     * We nullify the resolution cache (this.resolution) if resolutionChanged
+     * is set to true - this way it will be re-computed on the next
+     * getResolution() request.
+     *
+     * Parameters:
+     * extent - {<OpenLayers.Bounds>}
+     * resolutionChanged - {Boolean}
+     */
+    setExtent: function(extent, resolutionChanged) {
+        this.extent = extent.clone();
+        if (resolutionChanged) {
+            this.resolution = null;
+        }
+    },
+    
+    /**
+     * Method: setSize
+     * Sets the size of the drawing surface.
+     * 
+     * Resolution has probably changed, so we nullify the resolution 
+     * cache (this.resolution) -- this way it will be re-computed when 
+     * next it is needed.
+     *
+     * Parameters:
+     * size - {<OpenLayers.Size>} 
+     */
+    setSize: function(size) {
+        this.size = size.clone();
+        this.resolution = null;
+    },
+    
+    /** 
+     * Method: getResolution
+     * Uses cached copy of resolution if available to minimize computing
+     * 
+     * Returns:
+     * The current map's resolution
+     */
+    getResolution: function() {
+        this.resolution = this.resolution || this.map.getResolution();
+        return this.resolution;
+    },
+    
+    /**
+     * Method: drawFeature
+     * Draw the feature.  The optional style argument can be used
+     * to override the feature's own style.  This method should only
+     * be called from layer.drawFeature().
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     * style - {<Object>}
+     * 
+     * Returns:
+     * {Boolean} true if the feature has been drawn completely, false if not,
+     *     undefined if the feature had no geometry
+     */
+    drawFeature: function(feature, style) {
+        if(style == null) {
+            style = feature.style;
+        }
+        if (feature.geometry) {
+            var bounds = feature.geometry.getBounds();
+            if(bounds) {
+                if (!bounds.intersectsBounds(this.extent)) {
+                    style = {display: "none"};
+                }
+                var rendered = this.drawGeometry(feature.geometry, style, feature.id);
+                if(style.display != "none" && style.label && rendered !== false) {
+                    var location = feature.geometry.getCentroid(); 
+                    if(style.labelXOffset || style.labelYOffset) {
+                        xOffset = isNaN(style.labelXOffset) ? 0 : style.labelXOffset;
+                        yOffset = isNaN(style.labelYOffset) ? 0 : style.labelYOffset;
+                        var res = this.getResolution();
+                        location.move(xOffset*res, yOffset*res);
+                    }
+                    this.drawText(feature.id, style, location);
+                } else {
+                    this.removeText(feature.id);
+                }
+                return rendered;
+            }
+        }
+    },
+
+
+    /** 
+     * Method: drawGeometry
+     * 
+     * Draw a geometry.  This should only be called from the renderer itself.
+     * Use layer.drawFeature() from outside the renderer.
+     * virtual function
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} 
+     * style - {Object} 
+     * featureId - {<String>} 
+     */
+    drawGeometry: function(geometry, style, featureId) {},
+        
+    /**
+     * Method: drawText
+     * Function for drawing text labels.
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * featureId - {String}
+     * style -
+     * location - {<OpenLayers.Geometry.Point>}
+     */
+    drawText: function(featureId, style, location) {},
+
+    /**
+     * Method: removeText
+     * Function for removing text labels.
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * featureId - {String}
+     */
+    removeText: function(featureId) {},
+    
+    /**
+     * Method: clear
+     * Clear all vectors from the renderer.
+     * virtual function.
+     */    
+    clear: function() {},
+
+    /**
+     * Method: getFeatureIdFromEvent
+     * Returns a feature id from an event on the renderer.  
+     * How this happens is specific to the renderer.  This should be
+     * called from layer.getFeatureFromEvent().
+     * Virtual function.
+     * 
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     *
+     * Returns:
+     * {String} A feature id or null.
+     */
+    getFeatureIdFromEvent: function(evt) {},
+    
+    /**
+     * Method: eraseFeatures 
+     * This is called by the layer to erase features
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    eraseFeatures: function(features) {
+        if(!(features instanceof Array)) {
+            features = [features];
+        }
+        for(var i=0, len=features.length; i<len; ++i) {
+            var feature = features[i];
+            this.eraseGeometry(feature.geometry, feature.id);
+            this.removeText(feature.id);
+        }
+    },
+    
+    /**
+     * Method: eraseGeometry
+     * Remove a geometry from the renderer (by id).
+     * virtual function.
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} 
+     * featureId - {String}
+     */
+    eraseGeometry: function(geometry, featureId) {},
+    
+    /**
+     * Method: moveRoot
+     * moves this renderer's root to a (different) renderer.
+     * To be implemented by subclasses that require a common renderer root for
+     * feature selection.
+     * 
+     * Parameters:
+     * renderer - {<OpenLayers.Renderer>} target renderer for the moved root
+     */
+    moveRoot: function(renderer) {},
+
+    /**
+     * Method: getRenderLayerId
+     * Gets the layer that this renderer's output appears on. If moveRoot was
+     * used, this will be different from the id of the layer containing the
+     * features rendered by this renderer.
+     * 
+     * Returns:
+     * {String} the id of the output layer.
+     */
+    getRenderLayerId: function() {
+        return this.container.id;
+    },
+    
+    /**
+     * Method: applyDefaultSymbolizer
+     * 
+     * Parameters:
+     * symbolizer - {Object}
+     * 
+     * Returns:
+     * {Object}
+     */
+    applyDefaultSymbolizer: function(symbolizer) {
+        var result = OpenLayers.Util.extend({},
+            OpenLayers.Renderer.defaultSymbolizer);
+        if(symbolizer.stroke === false) {
+            delete result.strokeWidth;
+            delete result.strokeColor;
+        }
+        if(symbolizer.fill === false) {
+            delete result.fillColor;
+        }
+        OpenLayers.Util.extend(result, symbolizer);
+        return result;
+    },
+
+    CLASS_NAME: "OpenLayers.Renderer"
+});
+
+/**
+ * Constant: OpenLayers.Renderer.defaultSymbolizer
+ * {Object} Properties from this symbolizer will be applied to symbolizers
+ *     with missing properties. This can also be used to set a global
+ *     symbolizer default in OpenLayers. To be SLD 1.x compliant, add the
+ *     following code before rendering any vector features:
+ * (code)
+ * OpenLayers.Renderer.defaultSymbolizer = {
+ *     fillColor: "#808080",
+ *     fillOpacity: 1,
+ *     strokeColor: "#000000",
+ *     strokeOpacity: 1,
+ *     strokeWidth: 1,
+ *     pointRadius: 3,
+ *     graphicName: "square"
+ * };
+ * (end)
+ */
+OpenLayers.Renderer.defaultSymbolizer = {
+    fillColor: "#000000",
+    strokeColor: "#000000",
+    strokeWidth: 2,
+    fillOpacity: 1,
+    strokeOpacity: 1,
+    pointRadius: 0
+};
+    
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Rule.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Rule.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Rule.js	(revision 76)
@@ -0,0 +1,240 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Style.js
+ * @requires OpenLayers/Symbolizer/Point.js
+ * @requires OpenLayers/Symbolizer/Line.js
+ * @requires OpenLayers/Symbolizer/Polygon.js
+ * @requires OpenLayers/Symbolizer/Text.js
+ * @requires OpenLayers/Symbolizer/Raster.js
+ */
+
+/**
+ * Class: OpenLayers.Rule
+ * This class represents an SLD Rule, as being used for rule-based SLD styling.
+ */
+OpenLayers.Rule = OpenLayers.Class({
+    
+    /**
+     * Property: id
+     * {String} A unique id for this session.
+     */
+    id: null,
+    
+    /**
+     * APIProperty: name
+     * {String} name of this rule
+     */
+    name: null,
+    
+    /**
+     * Property: title
+     * {String} Title of this rule (set if included in SLD)
+     */
+    title: null,
+    
+    /**
+     * Property: description
+     * {String} Description of this rule (set if abstract is included in SLD)
+     */
+    description: null,
+
+    /**
+     * Property: context
+     * {Object} An optional object with properties that the rule should be
+     * evaluated against. If no context is specified, feature.attributes will
+     * be used.
+     */
+    context: null,
+    
+    /**
+     * Property: filter
+     * {<OpenLayers.Filter>} Optional filter for the rule.
+     */
+    filter: null,
+
+    /**
+     * Property: elseFilter
+     * {Boolean} Determines whether this rule is only to be applied only if
+     * no other rules match (ElseFilter according to the SLD specification). 
+     * Default is false.  For instances of OpenLayers.Rule, if elseFilter is
+     * false, the rule will always apply.  For subclasses, the else property is 
+     * ignored.
+     */
+    elseFilter: false,
+    
+    /**
+     * Property: symbolizer
+     * {Object} Symbolizer or hash of symbolizers for this rule. If hash of
+     * symbolizers, keys are one or more of ["Point", "Line", "Polygon"]. The
+     * latter if useful if it is required to style e.g. vertices of a line
+     * with a point symbolizer. Note, however, that this is not implemented
+     * yet in OpenLayers, but it is the way how symbolizers are defined in
+     * SLD.
+     */
+    symbolizer: null,
+    
+    /**
+     * Property: symbolizers
+     * {Array} Collection of symbolizers associated with this rule.  If 
+     *     provided at construction, the symbolizers array has precedence
+     *     over the deprecated symbolizer property.  Note that multiple 
+     *     symbolizers are not currently supported by the vector renderers.
+     *     Rules with multiple symbolizers are currently only useful for
+     *     maintaining elements in an SLD document.
+     */
+    symbolizers: null,
+    
+    /**
+     * APIProperty: minScaleDenominator
+     * {Number} or {String} minimum scale at which to draw the feature.
+     * In the case of a String, this can be a combination of text and
+     * propertyNames in the form "literal ${propertyName}"
+     */
+    minScaleDenominator: null,
+
+    /**
+     * APIProperty: maxScaleDenominator
+     * {Number} or {String} maximum scale at which to draw the feature.
+     * In the case of a String, this can be a combination of text and
+     * propertyNames in the form "literal ${propertyName}"
+     */
+    maxScaleDenominator: null,
+    
+    /** 
+     * Constructor: OpenLayers.Rule
+     * Creates a Rule.
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *           rule
+     * 
+     * Returns:
+     * {<OpenLayers.Rule>}
+     */
+    initialize: function(options) {
+        this.symbolizer = {};
+        OpenLayers.Util.extend(this, options);
+        if (this.symbolizers) {
+            delete this.symbolizer;
+        }
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+    },
+
+    /** 
+     * APIMethod: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        for (var i in this.symbolizer) {
+            this.symbolizer[i] = null;
+        }
+        this.symbolizer = null;
+        delete this.symbolizers;
+    },
+    
+    /**
+     * APIMethod: evaluate
+     * evaluates this rule for a specific feature
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature>} feature to apply the rule to.
+     * 
+     * Returns:
+     * {Boolean} true if the rule applies, false if it does not.
+     * This rule is the default rule and always returns true.
+     */
+    evaluate: function(feature) {
+        var context = this.getContext(feature);
+        var applies = true;
+
+        if (this.minScaleDenominator || this.maxScaleDenominator) {
+            var scale = feature.layer.map.getScale();
+        }
+        
+        // check if within minScale/maxScale bounds
+        if (this.minScaleDenominator) {
+            applies = scale >= OpenLayers.Style.createLiteral(
+                    this.minScaleDenominator, context);
+        }
+        if (applies && this.maxScaleDenominator) {
+            applies = scale < OpenLayers.Style.createLiteral(
+                    this.maxScaleDenominator, context);
+        }
+        
+        // check if optional filter applies
+        if(applies && this.filter) {
+            // feature id filters get the feature, others get the context
+            if(this.filter.CLASS_NAME == "OpenLayers.Filter.FeatureId") {
+                applies = this.filter.evaluate(feature);
+            } else {
+                applies = this.filter.evaluate(context);
+            }
+        }
+
+        return applies;
+    },
+    
+    /**
+     * Method: getContext
+     * Gets the context for evaluating this rule
+     * 
+     * Paramters:
+     * feature - {<OpenLayers.Feature>} feature to take the context from if
+     *           none is specified.
+     */
+    getContext: function(feature) {
+        var context = this.context;
+        if (!context) {
+            context = feature.attributes || feature.data;
+        }
+        if (typeof this.context == "function") {
+            context = this.context(feature);
+        }
+        return context;
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this rule.
+     * 
+     * Returns:
+     * {<OpenLayers.Rule>} Clone of this rule.
+     */
+    clone: function() {
+        var options = OpenLayers.Util.extend({}, this);
+        if (this.symbolizers) {
+            // clone symbolizers
+            var len = this.symbolizers.length;
+            options.symbolizers = new Array(len);
+            for (var i=0; i<len; ++i) {
+                options.symbolizers[i] = this.symbolizers[i].clone();
+            }
+        } else {
+            // clone symbolizer
+            options.symbolizer = {};
+            var value, type;
+            for(var key in this.symbolizer) {
+                value = this.symbolizer[key];
+                type = typeof value;
+                if(type === "object") {
+                    options.symbolizer[key] = OpenLayers.Util.extend({}, value);
+                } else if(type === "string") {
+                    options.symbolizer[key] = value;
+                }
+            }
+        }
+        // clone filter
+        options.filter = this.filter && this.filter.clone();
+        // clone context
+        options.context = this.context && OpenLayers.Util.extend({}, this.context);
+        return new OpenLayers.Rule(options);
+    },
+        
+    CLASS_NAME: "OpenLayers.Rule"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer.js	(revision 76)
@@ -0,0 +1,1304 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Map.js
+ * @requires OpenLayers/Projection.js
+ */
+
+/**
+ * Class: OpenLayers.Layer
+ */
+OpenLayers.Layer = OpenLayers.Class({
+
+    /**
+     * APIProperty: id
+     * {String}
+     */
+    id: null,
+
+    /** 
+     * APIProperty: name
+     * {String}
+     */
+    name: null,
+
+    /** 
+     * APIProperty: div
+     * {DOMElement}
+     */
+    div: null,
+
+    /**
+     * Property: opacity
+     * {Float} The layer's opacity. Float number between 0.0 and 1.0.
+     */
+    opacity: null,
+
+    /**
+     * APIProperty: alwaysInRange
+     * {Boolean} If a layer's display should not be scale-based, this should 
+     *     be set to true. This will cause the layer, as an overlay, to always 
+     *     be 'active', by always returning true from the calculateInRange() 
+     *     function. 
+     * 
+     *     If not explicitly specified for a layer, its value will be 
+     *     determined on startup in initResolutions() based on whether or not 
+     *     any scale-specific properties have been set as options on the 
+     *     layer. If no scale-specific options have been set on the layer, we 
+     *     assume that it should always be in range.
+     * 
+     *     See #987 for more info.
+     */
+    alwaysInRange: null,   
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * layer.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * All event objects have at least the following properties:
+     * object - {Object} A reference to layer.events.object.
+     * element - {DOMElement} A reference to layer.events.element.
+     *
+     * Supported map event types:
+     * loadstart - Triggered when layer loading starts.
+     * loadend - Triggered when layer loading ends.
+     * loadcancel - Triggered when layer loading is canceled.
+     * visibilitychanged - Triggered when layer visibility is changed.
+     * move - Triggered when layer moves (triggered with every mousemove
+     *     during a drag).
+     * moveend - Triggered when layer is done moving, object passed as
+     *     argument has a zoomChanged boolean property which tells that the
+     *     zoom has changed.
+     */
+    EVENT_TYPES: ["loadstart", "loadend", "loadcancel", "visibilitychanged",
+                  "move", "moveend"],
+
+    /**
+     * Constant: RESOLUTION_PROPERTIES
+     * {Array} The properties that are used for calculating resolutions
+     *     information.
+     */
+    RESOLUTION_PROPERTIES: [
+        'scales', 'resolutions',
+        'maxScale', 'minScale',
+        'maxResolution', 'minResolution',
+        'numZoomLevels', 'maxZoomLevel'
+    ],
+
+    /**
+     * APIProperty: events
+     * {<OpenLayers.Events>}
+     */
+    events: null,
+
+    /**
+     * APIProperty: map
+     * {<OpenLayers.Map>} This variable is set when the layer is added to 
+     *     the map, via the accessor function setMap().
+     */
+    map: null,
+    
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} Whether or not the layer is a base layer. This should be set 
+     *     individually by all subclasses. Default is false
+     */
+    isBaseLayer: false,
+ 
+    /**
+     * Property: alpha
+     * {Boolean} The layer's images have an alpha channel.  Default is false. 
+     */
+    alpha: false,
+
+    /** 
+     * APIProperty: displayInLayerSwitcher
+     * {Boolean} Display the layer's name in the layer switcher.  Default is
+     *     true.
+     */
+    displayInLayerSwitcher: true,
+
+    /**
+     * APIProperty: visibility
+     * {Boolean} The layer should be displayed in the map.  Default is true.
+     */
+    visibility: true,
+
+    /**
+     * APIProperty: attribution
+     * {String} Attribution string, displayed when an 
+     *     <OpenLayers.Control.Attribution> has been added to the map.
+     */
+    attribution: null, 
+
+    /** 
+     * Property: inRange
+     * {Boolean} The current map resolution is within the layer's min/max 
+     *     range. This is set in <OpenLayers.Map.setCenter> whenever the zoom 
+     *     changes.
+     */
+    inRange: false,
+    
+    /**
+     * Propery: imageSize
+     * {<OpenLayers.Size>} For layers with a gutter, the image is larger than 
+     *     the tile by twice the gutter in each dimension.
+     */
+    imageSize: null,
+    
+    /**
+     * Property: imageOffset
+     * {<OpenLayers.Pixel>} For layers with a gutter, the image offset 
+     *     represents displacement due to the gutter.
+     */
+    imageOffset: null,
+
+  // OPTIONS
+
+    /** 
+     * Property: options
+     * {Object} An optional object whose properties will be set on the layer.
+     *     Any of the layer properties can be set as a property of the options
+     *     object and sent to the constructor when the layer is created.
+     */
+    options: null,
+
+    /**
+     * APIProperty: eventListeners
+     * {Object} If set as an option at construction, the eventListeners
+     *     object will be registered with <OpenLayers.Events.on>.  Object
+     *     structure must be a listeners object as shown in the example for
+     *     the events.on method.
+     */
+    eventListeners: null,
+
+    /**
+     * APIProperty: gutter
+     * {Integer} Determines the width (in pixels) of the gutter around image
+     *     tiles to ignore.  By setting this property to a non-zero value,
+     *     images will be requested that are wider and taller than the tile
+     *     size by a value of 2 x gutter.  This allows artifacts of rendering
+     *     at tile edges to be ignored.  Set a gutter value that is equal to
+     *     half the size of the widest symbol that needs to be displayed.
+     *     Defaults to zero.  Non-tiled layers always have zero gutter.
+     */ 
+    gutter: 0, 
+
+    /**
+     * APIProperty: projection
+     * {<OpenLayers.Projection>} or {<String>} Set in the layer options to
+     *     override the default projection string this layer - also set maxExtent,
+     *     maxResolution, and units if appropriate. Can be either a string or
+     *     an <OpenLayers.Projection> object when created -- will be converted
+     *     to an object when setMap is called if a string is passed.  
+     */
+    projection: null,    
+    
+    /**
+     * APIProperty: units
+     * {String} The layer map units.  Defaults to 'degrees'.  Possible values
+     *     are 'degrees' (or 'dd'), 'm', 'ft', 'km', 'mi', 'inches'.
+     */
+    units: null,
+
+    /**
+     * APIProperty: scales
+     * {Array}  An array of map scales in descending order.  The values in the
+     *     array correspond to the map scale denominator.  Note that these
+     *     values only make sense if the display (monitor) resolution of the
+     *     client is correctly guessed by whomever is configuring the
+     *     application.  In addition, the units property must also be set.
+     *     Use <resolutions> instead wherever possible.
+     */
+    scales: null,
+
+    /**
+     * APIProperty: resolutions
+     * {Array} A list of map resolutions (map units per pixel) in descending
+     *     order.  If this is not set in the layer constructor, it will be set
+     *     based on other resolution related properties (maxExtent,
+     *     maxResolution, maxScale, etc.).
+     */
+    resolutions: null,
+    
+    /**
+     * APIProperty: maxExtent
+     * {<OpenLayers.Bounds>}  The center of these bounds will not stray outside
+     *     of the viewport extent during panning.  In addition, if
+     *     <displayOutsideMaxExtent> is set to false, data will not be
+     *     requested that falls completely outside of these bounds.
+     */
+    maxExtent: null,
+    
+    /**
+     * APIProperty: minExtent
+     * {<OpenLayers.Bounds>}
+     */
+    minExtent: null,
+    
+    /**
+     * APIProperty: maxResolution
+     * {Float} Default max is 360 deg / 256 px, which corresponds to
+     *     zoom level 0 on gmaps.  Specify a different value in the layer 
+     *     options if you are not using a geographic projection and 
+     *     displaying the whole world.
+     */
+    maxResolution: null,
+
+    /**
+     * APIProperty: minResolution
+     * {Float}
+     */
+    minResolution: null,
+
+    /**
+     * APIProperty: numZoomLevels
+     * {Integer}
+     */
+    numZoomLevels: null,
+   
+    /**
+     * APIProperty: minScale
+     * {Float}
+     */
+    minScale: null,
+    
+    /**
+     * APIProperty: maxScale
+     * {Float}
+     */
+    maxScale: null,
+
+    /**
+     * APIProperty: displayOutsideMaxExtent
+     * {Boolean} Request map tiles that are completely outside of the max 
+     *     extent for this layer. Defaults to false.
+     */
+    displayOutsideMaxExtent: false,
+
+    /**
+     * APIProperty: wrapDateLine
+     * {Boolean} #487 for more info.   
+     */
+    wrapDateLine: false,
+    
+    /**
+     * APIProperty: transitionEffect
+     * {String} The transition effect to use when the map is panned or
+     *     zoomed.  
+     *
+     * There are currently two supported values:
+     *  - *null* No transition effect (the default).
+     *  - *resize*  Existing tiles are resized on zoom to provide a visual
+     *    effect of the zoom having taken place immediately.  As the
+     *    new tiles become available, they are drawn over top of the
+     *    resized tiles.
+     */
+    transitionEffect: null,
+    
+    /**
+     * Property: SUPPORTED_TRANSITIONS
+     * {Array} An immutable (that means don't change it!) list of supported 
+     *     transitionEffect values.
+     */
+    SUPPORTED_TRANSITIONS: ['resize'],
+
+    /**
+     * Property: metadata
+     * {Object} This object can be used to store additional information on a
+     *     layer object.
+     */
+    metadata: {},
+    
+    /**
+     * Constructor: OpenLayers.Layer
+     *
+     * Parameters:
+     * name - {String} The layer name
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, options) {
+
+        this.addOptions(options);
+
+        this.name = name;
+        
+        if (this.id == null) {
+
+            this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+
+            this.div = OpenLayers.Util.createDiv(this.id);
+            this.div.style.width = "100%";
+            this.div.style.height = "100%";
+            this.div.dir = "ltr";
+
+            this.events = new OpenLayers.Events(this, this.div, 
+                                                this.EVENT_TYPES);
+            if(this.eventListeners instanceof Object) {
+                this.events.on(this.eventListeners);
+            }
+
+        }
+
+        if (this.wrapDateLine) {
+            this.displayOutsideMaxExtent = true;
+        }
+    },
+    
+    /**
+     * Method: destroy
+     * Destroy is a destructor: this is to alleviate cyclic references which
+     *     the Javascript garbage cleaner can not take care of on its own.
+     *
+     * Parameters:
+     * setNewBaseLayer - {Boolean} Set a new base layer when this layer has
+     *     been destroyed.  Default is true.
+     */
+    destroy: function(setNewBaseLayer) {
+        if (setNewBaseLayer == null) {
+            setNewBaseLayer = true;
+        }
+        if (this.map != null) {
+            this.map.removeLayer(this, setNewBaseLayer);
+        }
+        this.projection = null;
+        this.map = null;
+        this.name = null;
+        this.div = null;
+        this.options = null;
+
+        if (this.events) {
+            if(this.eventListeners) {
+                this.events.un(this.eventListeners);
+            }
+            this.events.destroy();
+        }
+        this.eventListeners = null;
+        this.events = null;
+    },
+    
+   /**
+    * Method: clone
+    *
+    * Parameters:
+    * obj - {<OpenLayers.Layer>} The layer to be cloned
+    *
+    * Returns:
+    * {<OpenLayers.Layer>} An exact clone of this <OpenLayers.Layer>
+    */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer(this.name, this.getOptions());
+        }
+        
+        // catch any randomly tagged-on properties
+        OpenLayers.Util.applyDefaults(obj, this);
+        
+        // a cloned layer should never have its map property set
+        //  because it has not been added to a map yet. 
+        obj.map = null;
+        
+        return obj;
+    },
+    
+    /**
+     * Method: getOptions
+     * Extracts an object from the layer with the properties that were set as
+     *     options, but updates them with the values currently set on the
+     *     instance.
+     * 
+     * Returns:
+     * {Object} the <options> of the layer, representing the current state.
+     */
+    getOptions: function() {
+        var options = {};
+        for(var o in this.options) {
+            options[o] = this[o];
+        }
+        return options;
+    },
+    
+    /** 
+     * APIMethod: setName
+     * Sets the new layer name for this layer.  Can trigger a changelayer event
+     *     on the map.
+     *
+     * Parameters:
+     * newName - {String} The new name.
+     */
+    setName: function(newName) {
+        if (newName != this.name) {
+            this.name = newName;
+            if (this.map != null) {
+                this.map.events.triggerEvent("changelayer", {
+                    layer: this,
+                    property: "name"
+                });
+            }
+        }
+    },    
+    
+   /**
+    * APIMethod: addOptions
+    * 
+    * Parameters:
+    * newOptions - {Object}
+    */
+    addOptions: function (newOptions) {
+
+        if (this.options == null) {
+            this.options = {};
+        }
+
+        // update our copy for clone
+        OpenLayers.Util.extend(this.options, newOptions);
+
+        // add new options to this
+        OpenLayers.Util.extend(this, newOptions);
+
+        // make sure this.projection references a projection object
+        if(typeof this.projection == "string") {
+            this.projection = new OpenLayers.Projection(this.projection);
+        }
+
+        // get the units from the projection, if we have a projection
+        // and it it has units
+        if(this.projection && this.projection.getUnits()) {
+            this.units = this.projection.getUnits();
+        }
+
+        // re-initialize resolutions if necessary, i.e. if any of the
+        // properties of the "properties" array defined below is set
+        // in the new options
+        if(this.map) {
+            var properties = this.RESOLUTION_PROPERTIES.concat(
+                ["projection", "units", "minExtent", "maxExtent"]
+            );
+            for(var o in newOptions) {
+                if(newOptions.hasOwnProperty(o) &&
+                   OpenLayers.Util.indexOf(properties, o) >= 0) {
+
+                    this.initResolutions();
+                    break;
+                }
+            }
+        }
+    },
+
+    /**
+     * APIMethod: onMapResize
+     * This function can be implemented by subclasses
+     */
+    onMapResize: function() {
+        //this function can be implemented by subclasses  
+    },
+
+    /**
+     * APIMethod: redraw
+     * Redraws the layer.  Returns true if the layer was redrawn, false if not.
+     *
+     * Returns:
+     * {Boolean} The layer was redrawn.
+     */
+    redraw: function() {
+        var redrawn = false;
+        if (this.map) {
+
+            // min/max Range may have changed
+            this.inRange = this.calculateInRange();
+
+            // map's center might not yet be set
+            var extent = this.getExtent();
+
+            if (extent && this.inRange && this.visibility) {
+                var zoomChanged = true;
+                this.moveTo(extent, zoomChanged, false);
+                this.events.triggerEvent("moveend",
+                    {"zoomChanged": zoomChanged});
+                redrawn = true;
+            }
+        }
+        return redrawn;
+    },
+
+    /**
+     * Method: moveTo
+     * 
+     * Parameters:
+     * bound - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean} Tells when zoom has changed, as layers have to
+     *     do some init work in that case.
+     * dragging - {Boolean}
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        var display = this.visibility;
+        if (!this.isBaseLayer) {
+            display = display && this.inRange;
+        }
+        this.display(display);
+    },
+
+    /**
+     * Method: setMap
+     * Set the map property for the layer. This is done through an accessor
+     *     so that subclasses can override this and take special action once 
+     *     they have their map variable set. 
+     * 
+     *     Here we take care to bring over any of the necessary default 
+     *     properties from the map. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        if (this.map == null) {
+        
+            this.map = map;
+            
+            // grab some essential layer data from the map if it hasn't already
+            //  been set
+            this.maxExtent = this.maxExtent || this.map.maxExtent;
+            this.minExtent = this.minExtent || this.map.minExtent;
+
+            this.projection = this.projection || this.map.projection;
+            if (typeof this.projection == "string") {
+                this.projection = new OpenLayers.Projection(this.projection);
+            }
+
+            // Check the projection to see if we can get units -- if not, refer
+            // to properties.
+            this.units = this.projection.getUnits() ||
+                         this.units || this.map.units;
+            
+            this.initResolutions();
+            
+            if (!this.isBaseLayer) {
+                this.inRange = this.calculateInRange();
+                var show = ((this.visibility) && (this.inRange));
+                this.div.style.display = show ? "" : "none";
+            }
+            
+            // deal with gutters
+            this.setTileSize();
+        }
+    },
+    
+    /**
+     * Method: afterAdd
+     * Called at the end of the map.addLayer sequence.  At this point, the map
+     *     will have a base layer.  To be overridden by subclasses.
+     */
+    afterAdd: function() {
+    },
+    
+    /**
+     * APIMethod: removeMap
+     * Just as setMap() allows each layer the possibility to take a 
+     *     personalized action on being added to the map, removeMap() allows
+     *     each layer to take a personalized action on being removed from it. 
+     *     For now, this will be mostly unused, except for the EventPane layer,
+     *     which needs this hook so that it can remove the special invisible
+     *     pane. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    removeMap: function(map) {
+        //to be overridden by subclasses
+    },
+    
+    /**
+     * APIMethod: getImageSize
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} optional tile bounds, can be used
+     *     by subclasses that have to deal with different tile sizes at the
+     *     layer extent edges (e.g. Zoomify)
+     * 
+     * Returns:
+     * {<OpenLayers.Size>} The size that the image should be, taking into 
+     *     account gutters.
+     */ 
+    getImageSize: function(bounds) { 
+        return (this.imageSize || this.tileSize); 
+    },    
+  
+    /**
+     * APIMethod: setTileSize
+     * Set the tile size based on the map size.  This also sets layer.imageSize
+     *     and layer.imageOffset for use by Tile.Image.
+     * 
+     * Parameters:
+     * size - {<OpenLayers.Size>}
+     */
+    setTileSize: function(size) {
+        var tileSize = (size) ? size :
+                                ((this.tileSize) ? this.tileSize :
+                                                   this.map.getTileSize());
+        this.tileSize = tileSize;
+        if(this.gutter) {
+          // layers with gutters need non-null tile sizes
+          //if(tileSize == null) {
+          //    OpenLayers.console.error("Error in layer.setMap() for " +
+          //                              this.name + ": layers with " +
+          //                              "gutters need non-null tile sizes");
+          //}
+            this.imageOffset = new OpenLayers.Pixel(-this.gutter, 
+                                                    -this.gutter); 
+            this.imageSize = new OpenLayers.Size(tileSize.w + (2*this.gutter), 
+                                                 tileSize.h + (2*this.gutter)); 
+        }
+    },
+
+    /**
+     * APIMethod: getVisibility
+     * 
+     * Returns:
+     * {Boolean} The layer should be displayed (if in range).
+     */
+    getVisibility: function() {
+        return this.visibility;
+    },
+
+    /** 
+     * APIMethod: setVisibility
+     * Set the visibility flag for the layer and hide/show & redraw 
+     *     accordingly. Fire event unless otherwise specified
+     * 
+     * Note that visibility is no longer simply whether or not the layer's
+     *     style.display is set to "block". Now we store a 'visibility' state 
+     *     property on the layer class, this allows us to remember whether or 
+     *     not we *desire* for a layer to be visible. In the case where the 
+     *     map's resolution is out of the layer's range, this desire may be 
+     *     subverted.
+     * 
+     * Parameters:
+     * visible - {Boolean} Whether or not to display the layer (if in range)
+     */
+    setVisibility: function(visibility) {
+        if (visibility != this.visibility) {
+            this.visibility = visibility;
+            this.display(visibility);
+            this.redraw();
+            if (this.map != null) {
+                this.map.events.triggerEvent("changelayer", {
+                    layer: this,
+                    property: "visibility"
+                });
+            }
+            this.events.triggerEvent("visibilitychanged");
+        }
+    },
+
+    /** 
+     * APIMethod: display
+     * Hide or show the Layer
+     * 
+     * Parameters:
+     * display - {Boolean}
+     */
+    display: function(display) {
+        if (display != (this.div.style.display != "none")) {
+            this.div.style.display = (display && this.calculateInRange()) ? "block" : "none";
+        }
+    },
+
+    /**
+     * APIMethod: calculateInRange
+     * 
+     * Returns:
+     * {Boolean} The layer is displayable at the current map's current
+     *     resolution. Note that if 'alwaysInRange' is true for the layer, 
+     *     this function will always return true.
+     */
+    calculateInRange: function() {
+        var inRange = false;
+
+        if (this.alwaysInRange) {
+            inRange = true;
+        } else {
+            if (this.map) {
+                var resolution = this.map.getResolution();
+                inRange = ( (resolution >= this.minResolution) &&
+                            (resolution <= this.maxResolution) );
+            }
+        }
+        return inRange;
+    },
+
+    /** 
+     * APIMethod: setIsBaseLayer
+     * 
+     * Parameters:
+     * isBaseLayer - {Boolean}
+     */
+    setIsBaseLayer: function(isBaseLayer) {
+        if (isBaseLayer != this.isBaseLayer) {
+            this.isBaseLayer = isBaseLayer;
+            if (this.map != null) {
+                this.map.events.triggerEvent("changebaselayer", {
+                    layer: this
+                });
+            }
+        }
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*                 Baselayer Functions                  */
+  /*                                                      */
+  /********************************************************/
+  
+    /** 
+     * Method: initResolutions
+     * This method's responsibility is to set up the 'resolutions' array 
+     *     for the layer -- this array is what the layer will use to interface
+     *     between the zoom levels of the map and the resolution display 
+     *     of the layer.
+     * 
+     * The user has several options that determine how the array is set up.
+     *  
+     * For a detailed explanation, see the following wiki from the 
+     *     openlayers.org homepage:
+     *     http://trac.openlayers.org/wiki/SettingZoomLevels
+     */
+    initResolutions: function() {
+
+        // ok we want resolutions, here's our strategy:
+        //
+        // 1. if resolutions are defined in the layer config, use them
+        // 2. else, if scales are defined in the layer config then derive
+        //    resolutions from these scales
+        // 3. else, attempt to calculate resolutions from maxResolution,
+        //    minResolution, numZoomLevels, maxZoomLevel set in the
+        //    layer config
+        // 4. if we still don't have resolutions, and if resolutions
+        //    are defined in the same, use them
+        // 5. else, if scales are defined in the map then derive
+        //    resolutions from these scales
+        // 6. else, attempt to calculate resolutions from maxResolution,
+        //    minResolution, numZoomLevels, maxZoomLevel set in the
+        //    map
+        // 7. hope for the best!
+
+        var i, len;
+        var props = {}, alwaysInRange = true;
+
+        // get resolution data from layer config
+        // (we also set alwaysInRange in the layer as appropriate)
+        for(i=0, len=this.RESOLUTION_PROPERTIES.length; i<len; i++) {
+            var p = this.RESOLUTION_PROPERTIES[i];
+            props[p] = this.options[p];
+            if(alwaysInRange && this.options[p]) {
+                alwaysInRange = false;
+            }
+        }
+        if(this.alwaysInRange == null) {
+            this.alwaysInRange = alwaysInRange;
+        }
+
+        // if we don't have resolutions then attempt to derive them from scales
+        if(props.resolutions == null) {
+            props.resolutions = this.resolutionsFromScales(props.scales);
+        }
+
+        // if we still don't have resolutions then attempt to calculate them
+        if(props.resolutions == null) {
+            props.resolutions = this.calculateResolutions(props);
+        }
+
+        // if we couldn't calculate resolutions then we look at we have
+        // in the map
+        if(props.resolutions == null) {
+            for(i=0, len=this.RESOLUTION_PROPERTIES.length; i<len; i++) {
+                var p = this.RESOLUTION_PROPERTIES[i];
+                props[p] = this.options[p] != null ?
+                    this.options[p] : this.map[p];
+            }
+            if(props.resolutions == null) {
+                props.resolutions = this.resolutionsFromScales(props.scales);
+            }
+            if(props.resolutions == null) {
+                props.resolutions = this.calculateResolutions(props);
+            }
+        }
+
+        // ok, we new need to set properties in the instance
+
+        // get maxResolution from the config if it's defined there
+        var maxResolution;
+        if(this.options.maxResolution &&
+           this.options.maxResolution !== "auto") {
+            maxResolution = this.options.maxResolution;
+        }
+        if(this.options.minScale) {
+            maxResolution = OpenLayers.Util.getResolutionFromScale(
+                this.options.minScale, this.units);
+        }
+
+        // get minResolution from the config if it's defined there
+        var minResolution;
+        if(this.options.minResolution &&
+           this.options.minResolution !== "auto") {
+            minResolution = this.options.minResolution;
+        }
+        if(this.options.maxScale) {
+            minResolution = OpenLayers.Util.getResolutionFromScale(
+                this.options.maxScale, this.units);
+        }
+
+        if(props.resolutions) {
+
+            //sort resolutions array descendingly
+            props.resolutions.sort(function(a, b) {
+                return (b - a);
+            });
+
+            // if we still don't have a maxResolution get it from the
+            // resolutions array
+            if(!maxResolution) {
+                maxResolution = props.resolutions[0];
+            }
+
+            // if we still don't have a minResolution get it from the
+            // resolutions array
+            if(!minResolution) {
+                var lastIdx = props.resolutions.length - 1;
+                minResolution = props.resolutions[lastIdx];
+            }
+        }
+
+        this.resolutions = props.resolutions;
+        if(this.resolutions) {
+            len = this.resolutions.length;
+            this.scales = new Array(len);
+            for(i=0; i<len; i++) {
+                this.scales[i] = OpenLayers.Util.getScaleFromResolution(
+                    this.resolutions[i], this.units);
+            }
+            this.numZoomLevels = len;
+        }
+        this.minResolution = minResolution;
+        if(minResolution) {
+            this.maxScale = OpenLayers.Util.getScaleFromResolution(
+                minResolution, this.units);
+        }
+        this.maxResolution = maxResolution;
+        if(maxResolution) {
+            this.minScale = OpenLayers.Util.getScaleFromResolution(
+                maxResolution, this.units);
+        }
+    },
+
+    /**
+     * Method: resolutionsFromScales
+     * Derive resolutions from scales.
+     *
+     * Parameters:
+     * scales - {Array(Number)} Scales
+     *
+     * Returns
+     * {Array(Number)} Resolutions
+     */
+    resolutionsFromScales: function(scales) {
+        if(scales == null) {
+            return;
+        }
+        var resolutions, i, len;
+        len = scales.length;
+        resolutions = new Array(len);
+        for(i=0; i<len; i++) {
+            resolutions[i] = OpenLayers.Util.getResolutionFromScale(
+                scales[i], this.units);
+        }
+        return resolutions;
+    },
+
+    /**
+     * Method: calculateResolutions
+     * Calculate resolutions based on the provided properties.
+     *
+     * Parameters:
+     * props - {Object} Properties
+     *
+     * Return:
+     * {Array({Number})} Array of resolutions.
+     */
+    calculateResolutions: function(props) {
+
+        // determine maxResolution
+        var maxResolution = props.maxResolution;
+        if(props.minScale != null) {
+            maxResolution =
+                OpenLayers.Util.getResolutionFromScale(props.minScale,
+                                                       this.units);
+        } else if(maxResolution == "auto" && this.maxExtent != null) {
+            var viewSize = this.map.getSize();
+            var wRes = this.maxExtent.getWidth() / viewSize.w;
+            var hRes = this.maxExtent.getHeight() / viewSize.h;
+            maxResolution = Math.max(wRes, hRes);
+        }
+
+        // determine minResolution
+        var minResolution = props.minResolution;
+        if(props.maxScale != null) {
+            minResolution =
+                OpenLayers.Util.getResolutionFromScale(props.maxScale,
+                                                       this.units);
+        } else if(props.minResolution == "auto" && this.minExtent != null) {
+            var viewSize = this.map.getSize();
+            var wRes = this.minExtent.getWidth() / viewSize.w;
+            var hRes = this.minExtent.getHeight()/ viewSize.h;
+            minResolution = Math.max(wRes, hRes);
+        }
+
+        // determine numZoomLevels
+        var maxZoomLevel = props.maxZoomLevel;
+        var numZoomLevels = props.numZoomLevels;
+        if(typeof minResolution === "number" &&
+           typeof maxResolution === "number" && numZoomLevels === undefined) {
+            var ratio = maxResolution / minResolution;
+            numZoomLevels = Math.floor(Math.log(ratio) / Math.log(2)) + 1;
+        } else if(numZoomLevels === undefined && maxZoomLevel != null) {
+            numZoomLevels = maxZoomLevel + 1;
+        }
+
+        // are we able to calculate resolutions?
+        if(typeof numZoomLevels !== "number" || numZoomLevels <= 0 ||
+           (typeof maxResolution !== "number" &&
+                typeof minResolution !== "number")) {
+            return;
+        }
+
+        // now we have numZoomLevels and at least one of maxResolution
+        // or minResolution, we can populate the resolutions array
+
+        var resolutions = new Array(numZoomLevels);
+        var base = 2;
+        if(typeof minResolution == "number" &&
+           typeof maxResolution == "number") {
+            // if maxResolution and minResolution are set, we calculate
+            // the base for exponential scaling that starts at
+            // maxResolution and ends at minResolution in numZoomLevels
+            // steps.
+            base = Math.pow(
+                    (maxResolution / minResolution),
+                (1 / (numZoomLevels - 1))
+            );
+        }
+
+        var i;
+        if(typeof maxResolution === "number") {
+            for(i=0; i<numZoomLevels; i++) {
+                resolutions[i] = maxResolution / Math.pow(base, i);
+            }
+        } else {
+            for(i=0; i<numZoomLevels; i++) {
+                resolutions[numZoomLevels - 1 - i] =
+                    minResolution * Math.pow(base, i);
+            }
+        }
+
+        return resolutions;
+    },
+
+    /**
+     * APIMethod: getResolution
+     * 
+     * Returns:
+     * {Float} The currently selected resolution of the map, taken from the
+     *     resolutions array, indexed by current zoom level.
+     */
+    getResolution: function() {
+        var zoom = this.map.getZoom();
+        return this.getResolutionForZoom(zoom);
+    },
+
+    /** 
+     * APIMethod: getExtent
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A Bounds object which represents the lon/lat 
+     *     bounds of the current viewPort.
+     */
+    getExtent: function() {
+        // just use stock map calculateBounds function -- passing no arguments
+        //  means it will user map's current center & resolution
+        //
+        return this.map.calculateBounds();
+    },
+
+    /**
+     * APIMethod: getZoomForExtent
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * closest - {Boolean} Find the zoom level that most closely fits the 
+     *     specified bounds. Note that this may result in a zoom that does 
+     *     not exactly contain the entire extent.
+     *     Default is false.
+     *
+     * Returns:
+     * {Integer} The index of the zoomLevel (entry in the resolutions array) 
+     *     for the passed-in extent. We do this by calculating the ideal 
+     *     resolution for the given extent (based on the map size) and then 
+     *     calling getZoomForResolution(), passing along the 'closest'
+     *     parameter.
+     */
+    getZoomForExtent: function(extent, closest) {
+        var viewSize = this.map.getSize();
+        var idealResolution = Math.max( extent.getWidth()  / viewSize.w,
+                                        extent.getHeight() / viewSize.h );
+
+        return this.getZoomForResolution(idealResolution, closest);
+    },
+    
+    /** 
+     * Method: getDataExtent
+     * Calculates the max extent which includes all of the data for the layer.
+     *     This function is to be implemented by subclasses.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getDataExtent: function () {
+        //to be implemented by subclasses
+    },
+
+    /**
+     * APIMethod: getResolutionForZoom
+     * 
+     * Parameter:
+     * zoom - {Float}
+     * 
+     * Returns:
+     * {Float} A suitable resolution for the specified zoom.
+     */
+    getResolutionForZoom: function(zoom) {
+        zoom = Math.max(0, Math.min(zoom, this.resolutions.length - 1));
+        var resolution;
+        if(this.map.fractionalZoom) {
+            var low = Math.floor(zoom);
+            var high = Math.ceil(zoom);
+            resolution = this.resolutions[low] -
+                ((zoom-low) * (this.resolutions[low]-this.resolutions[high]));
+        } else {
+            resolution = this.resolutions[Math.round(zoom)];
+        }
+        return resolution;
+    },
+
+    /**
+     * APIMethod: getZoomForResolution
+     * 
+     * Parameters:
+     * resolution - {Float}
+     * closest - {Boolean} Find the zoom level that corresponds to the absolute 
+     *     closest resolution, which may result in a zoom whose corresponding
+     *     resolution is actually smaller than we would have desired (if this
+     *     is being called from a getZoomForExtent() call, then this means that
+     *     the returned zoom index might not actually contain the entire 
+     *     extent specified... but it'll be close).
+     *     Default is false.
+     * 
+     * Returns:
+     * {Integer} The index of the zoomLevel (entry in the resolutions array) 
+     *     that corresponds to the best fit resolution given the passed in 
+     *     value and the 'closest' specification.
+     */
+    getZoomForResolution: function(resolution, closest) {
+        var zoom;
+        if(this.map.fractionalZoom) {
+            var lowZoom = 0;
+            var highZoom = this.resolutions.length - 1;
+            var highRes = this.resolutions[lowZoom];
+            var lowRes = this.resolutions[highZoom];
+            var res;
+            for(var i=0, len=this.resolutions.length; i<len; ++i) {
+                res = this.resolutions[i];
+                if(res >= resolution) {
+                    highRes = res;
+                    lowZoom = i;
+                }
+                if(res <= resolution) {
+                    lowRes = res;
+                    highZoom = i;
+                    break;
+                }
+            }
+            var dRes = highRes - lowRes;
+            if(dRes > 0) {
+                zoom = lowZoom + ((highRes - resolution) / dRes);
+            } else {
+                zoom = lowZoom;
+            }
+        } else {
+            var diff;
+            var minDiff = Number.POSITIVE_INFINITY;
+            for(var i=0, len=this.resolutions.length; i<len; i++) {            
+                if (closest) {
+                    diff = Math.abs(this.resolutions[i] - resolution);
+                    if (diff > minDiff) {
+                        break;
+                    }
+                    minDiff = diff;
+                } else {
+                    if (this.resolutions[i] < resolution) {
+                        break;
+                    }
+                }
+            }
+            zoom = Math.max(0, i-1);
+        }
+        return zoom;
+    },
+    
+    /**
+     * APIMethod: getLonLatFromViewPortPx
+     * 
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.LonLat>} An OpenLayers.LonLat which is the passed-in 
+     *     view port <OpenLayers.Pixel>, translated into lon/lat by the layer.
+     */
+    getLonLatFromViewPortPx: function (viewPortPx) {
+        var lonlat = null;
+        if (viewPortPx != null) {
+            var size = this.map.getSize();
+            var center = this.map.getCenter();
+            if (center) {
+                var res  = this.map.getResolution();
+        
+                var delta_x = viewPortPx.x - (size.w / 2);
+                var delta_y = viewPortPx.y - (size.h / 2);
+            
+                lonlat = new OpenLayers.LonLat(center.lon + delta_x * res ,
+                                             center.lat - delta_y * res); 
+
+                if (this.wrapDateLine) {
+                    lonlat = lonlat.wrapDateLine(this.maxExtent);
+                }
+            } // else { DEBUG STATEMENT }
+        }
+        return lonlat;
+    },
+
+    /**
+     * APIMethod: getViewPortPxFromLonLat
+     * Returns a pixel location given a map location.  This method will return
+     *     fractional pixel values.
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     *
+     * Returns: 
+     * {<OpenLayers.Pixel>} An <OpenLayers.Pixel> which is the passed-in 
+     *     <OpenLayers.LonLat>,translated into view port pixels.
+     */
+    getViewPortPxFromLonLat: function (lonlat) {
+        var px = null; 
+        if (lonlat != null) {
+            var resolution = this.map.getResolution();
+            var extent = this.map.getExtent();
+            px = new OpenLayers.Pixel(
+                (1/resolution * (lonlat.lon - extent.left)),
+                (1/resolution * (extent.top - lonlat.lat))
+            );    
+        }
+        return px;
+    },
+    
+    /**
+     * APIMethod: setOpacity
+     * Sets the opacity for the entire layer (all images)
+     * 
+     * Parameter:
+     * opacity - {Float}
+     */
+    setOpacity: function(opacity) {
+        if (opacity != this.opacity) {
+            this.opacity = opacity;
+            for(var i=0, len=this.div.childNodes.length; i<len; ++i) {
+                var element = this.div.childNodes[i].firstChild;
+                OpenLayers.Util.modifyDOMElement(element, null, null, null, 
+                                                 null, null, null, opacity);
+            }
+            if (this.map != null) {
+                this.map.events.triggerEvent("changelayer", {
+                    layer: this,
+                    property: "opacity"
+                });
+            }
+        }
+    },
+
+    /**
+     * Method: getZIndex
+     * 
+     * Returns: 
+     * {Integer} the z-index of this layer
+     */    
+    getZIndex: function () {
+        return this.div.style.zIndex;
+    },
+
+    /**
+     * Method: setZIndex
+     * 
+     * Parameters: 
+     * zIndex - {Integer}
+     */    
+    setZIndex: function (zIndex) {
+        this.div.style.zIndex = zIndex;
+    },
+
+    /**
+     * Method: adjustBounds
+     * This function will take a bounds, and if wrapDateLine option is set
+     *     on the layer, it will return a bounds which is wrapped around the 
+     *     world. We do not wrap for bounds which *cross* the 
+     *     maxExtent.left/right, only bounds which are entirely to the left 
+     *     or entirely to the right.
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     */
+    adjustBounds: function (bounds) {
+
+        if (this.gutter) {
+            // Adjust the extent of a bounds in map units by the 
+            // layer's gutter in pixels.
+            var mapGutter = this.gutter * this.map.getResolution();
+            bounds = new OpenLayers.Bounds(bounds.left - mapGutter,
+                                           bounds.bottom - mapGutter,
+                                           bounds.right + mapGutter,
+                                           bounds.top + mapGutter);
+        }
+
+        if (this.wrapDateLine) {
+            // wrap around the date line, within the limits of rounding error
+            var wrappingOptions = { 
+                'rightTolerance':this.getResolution()
+            };    
+            bounds = bounds.wrapDateLine(this.maxExtent, wrappingOptions);
+                              
+        }
+        return bounds;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Projection.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Projection.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Projection.js	(revision 76)
@@ -0,0 +1,178 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Util.js
+ */
+
+/**
+ * Class: OpenLayers.Projection
+ * Class for coordinate transforms between coordinate systems.
+ *     Depends on the proj4js library. If proj4js is not available, 
+ *     then this is just an empty stub.
+ */
+OpenLayers.Projection = OpenLayers.Class({
+
+    /**
+     * Property: proj
+     * {Object} Proj4js.Proj instance.
+     */
+    proj: null,
+    
+    /**
+     * Property: projCode
+     * {String}
+     */
+    projCode: null,
+
+    /**
+     * Constructor: OpenLayers.Projection
+     * This class offers several methods for interacting with a wrapped 
+     *     pro4js projection object. 
+     *
+     * Parameters:
+     * projCode - {String} A string identifying the Well Known Identifier for
+     *    the projection.
+     * options - {Object} An optional object to set additional properties
+     *     on the layer.
+     *
+     * Returns:
+     * {<OpenLayers.Projection>} A projection object.
+     */
+    initialize: function(projCode, options) {
+        OpenLayers.Util.extend(this, options);
+        this.projCode = projCode;
+        if (window.Proj4js) {
+            this.proj = new Proj4js.Proj(projCode);
+        }
+    },
+    
+    /**
+     * APIMethod: getCode
+     * Get the string SRS code.
+     *
+     * Returns:
+     * {String} The SRS code.
+     */
+    getCode: function() {
+        return this.proj ? this.proj.srsCode : this.projCode;
+    },
+   
+    /**
+     * APIMethod: getUnits
+     * Get the units string for the projection -- returns null if 
+     *     proj4js is not available.
+     *
+     * Returns:
+     * {String} The units abbreviation.
+     */
+    getUnits: function() {
+        return this.proj ? this.proj.units : null;
+    },
+
+    /**
+     * Method: toString
+     * Convert projection to string (getCode wrapper).
+     *
+     * Returns:
+     * {String} The projection code.
+     */
+    toString: function() {
+        return this.getCode();
+    },
+
+    /**
+     * Method: equals
+     * Test equality of two projection instances.  Determines equality based
+     *     soley on the projection code.
+     *
+     * Returns:
+     * {Boolean} The two projections are equivalent.
+     */
+    equals: function(projection) {
+        if (projection && projection.getCode) {
+            return this.getCode() == projection.getCode();
+        } else {
+            return false;
+        }    
+    },
+
+    /* Method: destroy
+     * Destroy projection object.
+     */
+    destroy: function() {
+        delete this.proj;
+        delete this.projCode;
+    },
+    
+    CLASS_NAME: "OpenLayers.Projection" 
+});     
+
+/**
+ * Property: transforms
+ * Transforms is an object, with from properties, each of which may
+ * have a to property. This allows you to define projections without 
+ * requiring support for proj4js to be included.
+ *
+ * This object has keys which correspond to a 'source' projection object.  The
+ * keys should be strings, corresponding to the projection.getCode() value.
+ * Each source projection object should have a set of destination projection
+ * keys included in the object. 
+ * 
+ * Each value in the destination object should be a transformation function,
+ * where the function is expected to be passed an object with a .x and a .y
+ * property.  The function should return the object, with the .x and .y
+ * transformed according to the transformation function.
+ *
+ * Note - Properties on this object should not be set directly.  To add a
+ *     transform method to this object, use the <addTransform> method.  For an
+ *     example of usage, see the OpenLayers.Layer.SphericalMercator file.
+ */
+OpenLayers.Projection.transforms = {};
+
+/**
+ * APIMethod: addTransform
+ * Set a custom transform method between two projections.  Use this method in
+ *     cases where the proj4js lib is not available or where custom projections
+ *     need to be handled.
+ *
+ * Parameters:
+ * from - {String} The code for the source projection
+ * to - {String} the code for the destination projection
+ * method - {Function} A function that takes a point as an argument and
+ *     transforms that point from the source to the destination projection
+ *     in place.  The original point should be modified.
+ */
+OpenLayers.Projection.addTransform = function(from, to, method) {
+    if(!OpenLayers.Projection.transforms[from]) {
+        OpenLayers.Projection.transforms[from] = {};
+    }
+    OpenLayers.Projection.transforms[from][to] = method;
+};
+
+/**
+ * APIMethod: transform
+ * Transform a point coordinate from one projection to another.  Note that
+ *     the input point is transformed in place.
+ * 
+ * Parameters:
+ * point - {{OpenLayers.Geometry.Point> | Object} An object with x and y
+ *     properties representing coordinates in those dimensions.
+ * sourceProj - {OpenLayers.Projection} Source map coordinate system
+ * destProj - {OpenLayers.Projection} Destination map coordinate system
+ *
+ * Returns:
+ * point - {object} A transformed coordinate.  The original point is modified.
+ */
+OpenLayers.Projection.transform = function(point, source, dest) {
+    if (source.proj && dest.proj) {
+        point = Proj4js.transform(source.proj, dest.proj, point);
+    } else if (source && dest && 
+               OpenLayers.Projection.transforms[source.getCode()] && 
+               OpenLayers.Projection.transforms[source.getCode()][dest.getCode()]) {
+        OpenLayers.Projection.transforms[source.getCode()][dest.getCode()](point); 
+    }
+    return point;
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Util.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Util.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Util.js	(revision 76)
@@ -0,0 +1,1797 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Namespace: Util
+ */
+OpenLayers.Util = {};
+
+/** 
+ * Function: getElement
+ * This is the old $() from prototype
+ */
+OpenLayers.Util.getElement = function() {
+    var elements = [];
+
+    for (var i=0, len=arguments.length; i<len; i++) {
+        var element = arguments[i];
+        if (typeof element == 'string') {
+            element = document.getElementById(element);
+        }
+        if (arguments.length == 1) {
+            return element;
+        }
+        elements.push(element);
+    }
+    return elements;
+};
+
+/**
+ * Function: isElement
+ * A cross-browser implementation of "e instanceof Element".
+ *
+ * Parameters:
+ * o - {Object} The object to test.
+ *
+ * Returns:
+ * {Boolean}
+ */
+OpenLayers.Util.isElement = function(o) {
+    return !!(o && o.nodeType === 1);
+};
+
+/** 
+ * Maintain existing definition of $.
+ */
+if(typeof window.$  === "undefined") {
+    window.$ = OpenLayers.Util.getElement;
+}
+
+/**
+ * APIFunction: extend
+ * Copy all properties of a source object to a destination object.  Modifies
+ *     the passed in destination object.  Any properties on the source object
+ *     that are set to undefined will not be (re)set on the destination object.
+ *
+ * Parameters:
+ * destination - {Object} The object that will be modified
+ * source - {Object} The object with properties to be set on the destination
+ *
+ * Returns:
+ * {Object} The destination object.
+ */
+OpenLayers.Util.extend = function(destination, source) {
+    destination = destination || {};
+    if(source) {
+        for(var property in source) {
+            var value = source[property];
+            if(value !== undefined) {
+                destination[property] = value;
+            }
+        }
+
+        /**
+         * IE doesn't include the toString property when iterating over an object's
+         * properties with the for(property in object) syntax.  Explicitly check if
+         * the source has its own toString property.
+         */
+
+        /*
+         * FF/Windows < 2.0.0.13 reports "Illegal operation on WrappedNative
+         * prototype object" when calling hawOwnProperty if the source object
+         * is an instance of window.Event.
+         */
+
+        var sourceIsEvt = typeof window.Event == "function"
+                          && source instanceof window.Event;
+
+        if(!sourceIsEvt
+           && source.hasOwnProperty && source.hasOwnProperty('toString')) {
+            destination.toString = source.toString;
+        }
+    }
+    return destination;
+};
+
+
+/** 
+ * Function: removeItem
+ * Remove an object from an array. Iterates through the array
+ *     to find the item, then removes it.
+ *
+ * Parameters:
+ * array - {Array}
+ * item - {Object}
+ * 
+ * Return
+ * {Array} A reference to the array
+ */
+OpenLayers.Util.removeItem = function(array, item) {
+    for(var i = array.length - 1; i >= 0; i--) {
+        if(array[i] == item) {
+            array.splice(i,1);
+            //break;more than once??
+        }
+    }
+    return array;
+};
+
+/**
+ * Function: clearArray
+ * *Deprecated*. This function will disappear in 3.0.
+ * Please use "array.length = 0" instead.
+ * 
+ * Parameters:
+ * array - {Array}
+ */
+OpenLayers.Util.clearArray = function(array) {
+    OpenLayers.Console.warn(
+        OpenLayers.i18n(
+            "methodDeprecated", {'newMethod': 'array = []'}
+        )
+    );
+    array.length = 0;
+};
+
+/** 
+ * Function: indexOf
+ * Seems to exist already in FF, but not in MOZ.
+ * 
+ * Parameters:
+ * array - {Array}
+ * obj - {Object}
+ * 
+ * Returns:
+ * {Integer} The index at, which the first object was found in the array.
+ *           If not found, returns -1.
+ */
+OpenLayers.Util.indexOf = function(array, obj) {
+    // use the build-in function if available.
+    if (typeof array.indexOf == "function") {
+        return array.indexOf(obj);
+    } else {
+        for (var i = 0, len = array.length; i < len; i++) {
+            if (array[i] == obj) {
+                return i;
+            }
+        }
+        return -1;   
+    }
+};
+
+
+
+/**
+ * Function: modifyDOMElement
+ * 
+ * Modifies many properties of a DOM element all at once.  Passing in 
+ * null to an individual parameter will avoid setting the attribute.
+ *
+ * Parameters:
+ * id - {String} The element id attribute to set.
+ * px - {<OpenLayers.Pixel>} The left and top style position.
+ * sz - {<OpenLayers.Size>}  The width and height style attributes.
+ * position - {String}       The position attribute.  eg: absolute, 
+ *                           relative, etc.
+ * border - {String}         The style.border attribute.  eg:
+ *                           solid black 2px
+ * overflow - {String}       The style.overview attribute.  
+ * opacity - {Float}         Fractional value (0.0 - 1.0)
+ */
+OpenLayers.Util.modifyDOMElement = function(element, id, px, sz, position, 
+                                            border, overflow, opacity) {
+
+    if (id) {
+        element.id = id;
+    }
+    if (px) {
+        element.style.left = px.x + "px";
+        element.style.top = px.y + "px";
+    }
+    if (sz) {
+        element.style.width = sz.w + "px";
+        element.style.height = sz.h + "px";
+    }
+    if (position) {
+        element.style.position = position;
+    }
+    if (border) {
+        element.style.border = border;
+    }
+    if (overflow) {
+        element.style.overflow = overflow;
+    }
+    if (parseFloat(opacity) >= 0.0 && parseFloat(opacity) < 1.0) {
+        element.style.filter = 'alpha(opacity=' + (opacity * 100) + ')';
+        element.style.opacity = opacity;
+    } else if (parseFloat(opacity) == 1.0) {
+        element.style.filter = '';
+        element.style.opacity = '';
+    }
+};
+
+/** 
+ * Function: createDiv
+ * Creates a new div and optionally set some standard attributes.
+ * Null may be passed to each parameter if you do not wish to
+ * set a particular attribute.
+ * Note - zIndex is NOT set on the resulting div.
+ * 
+ * Parameters:
+ * id - {String} An identifier for this element.  If no id is
+ *               passed an identifier will be created 
+ *               automatically.
+ * px - {<OpenLayers.Pixel>} The element left and top position. 
+ * sz - {<OpenLayers.Size>} The element width and height.
+ * imgURL - {String} A url pointing to an image to use as a 
+ *                   background image.
+ * position - {String} The style.position value. eg: absolute,
+ *                     relative etc.
+ * border - {String} The the style.border value. 
+ *                   eg: 2px solid black
+ * overflow - {String} The style.overflow value. Eg. hidden
+ * opacity - {Float} Fractional value (0.0 - 1.0)
+ * 
+ * Returns: 
+ * {DOMElement} A DOM Div created with the specified attributes.
+ */
+OpenLayers.Util.createDiv = function(id, px, sz, imgURL, position, 
+                                     border, overflow, opacity) {
+
+    var dom = document.createElement('div');
+
+    if (imgURL) {
+        dom.style.backgroundImage = 'url(' + imgURL + ')';
+    }
+
+    //set generic properties
+    if (!id) {
+        id = OpenLayers.Util.createUniqueID("OpenLayersDiv");
+    }
+    if (!position) {
+        position = "absolute";
+    }
+    OpenLayers.Util.modifyDOMElement(dom, id, px, sz, position, 
+                                     border, overflow, opacity);
+
+    return dom;
+};
+
+/**
+ * Function: createImage
+ * Creates an img element with specific attribute values.
+ *  
+ * Parameters:
+ * id - {String} The id field for the img.  If none assigned one will be
+ *               automatically generated.
+ * px - {<OpenLayers.Pixel>} The left and top positions.
+ * sz - {<OpenLayers.Size>} The style.width and style.height values.
+ * imgURL - {String} The url to use as the image source.
+ * position - {String} The style.position value.
+ * border - {String} The border to place around the image.
+ * opacity - {Float} Fractional value (0.0 - 1.0)
+ * delayDisplay - {Boolean} If true waits until the image has been
+ *                          loaded.
+ * 
+ * Returns:
+ * {DOMElement} A DOM Image created with the specified attributes.
+ */
+OpenLayers.Util.createImage = function(id, px, sz, imgURL, position, border,
+                                       opacity, delayDisplay) {
+
+    var image = document.createElement("img");
+
+    //set generic properties
+    if (!id) {
+        id = OpenLayers.Util.createUniqueID("OpenLayersDiv");
+    }
+    if (!position) {
+        position = "relative";
+    }
+    OpenLayers.Util.modifyDOMElement(image, id, px, sz, position, 
+                                     border, null, opacity);
+
+    if(delayDisplay) {
+        image.style.display = "none";
+        OpenLayers.Event.observe(image, "load", 
+            OpenLayers.Function.bind(OpenLayers.Util.onImageLoad, image));
+        OpenLayers.Event.observe(image, "error", 
+            OpenLayers.Function.bind(OpenLayers.Util.onImageLoadError, image));
+        
+    }
+    
+    //set special properties
+    image.style.alt = id;
+    image.galleryImg = "no";
+    if (imgURL) {
+        image.src = imgURL;
+    }
+
+
+        
+    return image;
+};
+
+/**
+ * Function: setOpacity
+ * *Deprecated*.  This function has been deprecated. Instead, please use 
+ *     <OpenLayers.Util.modifyDOMElement> 
+ *     or 
+ *     <OpenLayers.Util.modifyAlphaImageDiv>
+ * 
+ * Set the opacity of a DOM Element
+ *     Note that for this function to work in IE, elements must "have layout"
+ *     according to:
+ *     http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/haslayout.asp
+ *
+ * Parameters:
+ * element - {DOMElement} Set the opacity on this DOM element
+ * opacity - {Float} Opacity value (0.0 - 1.0)
+ */
+OpenLayers.Util.setOpacity = function(element, opacity) {
+    OpenLayers.Util.modifyDOMElement(element, null, null, null,
+                                     null, null, null, opacity);
+};
+
+/**
+ * Function: onImageLoad
+ * Bound to image load events.  For all images created with <createImage> or
+ *     <createAlphaImageDiv>, this function will be bound to the load event.
+ */
+OpenLayers.Util.onImageLoad = function() {
+    // The complex check here is to solve issues described in #480.
+    // Every time a map view changes, it increments the 'viewRequestID' 
+    // property. As the requests for the images for the new map view are sent
+    // out, they are tagged with this unique viewRequestID. 
+    // 
+    // If an image has no viewRequestID property set, we display it regardless, 
+    // but if it does have a viewRequestID property, we check that it matches 
+    // the viewRequestID set on the map.
+    // 
+    // If the viewRequestID on the map has changed, that means that the user
+    // has changed the map view since this specific request was sent out, and
+    // therefore this tile does not need to be displayed (so we do not execute
+    // this code that turns its display on).
+    //
+    if (!this.viewRequestID ||
+        (this.map && this.viewRequestID == this.map.viewRequestID)) { 
+        this.style.display = "";  
+    }
+    OpenLayers.Element.removeClass(this, "olImageLoadError");
+};
+
+/**
+ * Property: IMAGE_RELOAD_ATTEMPTS
+ * {Integer} How many times should we try to reload an image before giving up?
+ *           Default is 0
+ */
+OpenLayers.IMAGE_RELOAD_ATTEMPTS = 0;
+
+/**
+ * Function: onImageLoadError 
+ */
+OpenLayers.Util.onImageLoadError = function() {
+    this._attempts = (this._attempts) ? (this._attempts + 1) : 1;
+    if (this._attempts <= OpenLayers.IMAGE_RELOAD_ATTEMPTS) {
+        var urls = this.urls;
+        if (urls && urls instanceof Array && urls.length > 1){
+            var src = this.src.toString();
+            var current_url, k;
+            for (k = 0; current_url = urls[k]; k++){
+                if(src.indexOf(current_url) != -1){
+                    break;
+                }
+            }
+            var guess = Math.floor(urls.length * Math.random());
+            var new_url = urls[guess];
+            k = 0;
+            while(new_url == current_url && k++ < 4){
+                guess = Math.floor(urls.length * Math.random());
+                new_url = urls[guess];
+            }
+            this.src = src.replace(current_url, new_url);
+        } else {
+            this.src = this.src;
+        }
+    } else {
+        OpenLayers.Element.addClass(this, "olImageLoadError");
+    }
+    this.style.display = "";
+};
+
+/**
+ * Property: alphaHackNeeded
+ * {Boolean} true if the png alpha hack is necessary and possible, false otherwise.
+ */
+OpenLayers.Util.alphaHackNeeded = null;
+
+/**
+ * Function: alphaHack
+ * Checks whether it's necessary (and possible) to use the png alpha
+ * hack which allows alpha transparency for png images under Internet
+ * Explorer.
+ * 
+ * Returns:
+ * {Boolean} true if the png alpha hack is necessary and possible, false otherwise.
+ */
+OpenLayers.Util.alphaHack = function() {
+    if (OpenLayers.Util.alphaHackNeeded == null) {
+        var arVersion = navigator.appVersion.split("MSIE");
+        var version = parseFloat(arVersion[1]);
+        var filter = false;
+    
+        // IEs4Lin dies when trying to access document.body.filters, because 
+        // the property is there, but requires a DLL that can't be provided. This
+        // means that we need to wrap this in a try/catch so that this can
+        // continue.
+    
+        try { 
+            filter = !!(document.body.filters);
+        } catch (e) {}    
+    
+        OpenLayers.Util.alphaHackNeeded = (filter && 
+                                           (version >= 5.5) && (version < 7));
+    }
+    return OpenLayers.Util.alphaHackNeeded;
+};
+
+/** 
+ * Function: modifyAlphaImageDiv
+ * 
+ * div - {DOMElement} Div containing Alpha-adjusted Image
+ * id - {String}
+ * px - {<OpenLayers.Pixel>}
+ * sz - {<OpenLayers.Size>}
+ * imgURL - {String}
+ * position - {String}
+ * border - {String}
+ * sizing {String} 'crop', 'scale', or 'image'. Default is "scale"
+ * opacity - {Float} Fractional value (0.0 - 1.0)
+ */ 
+OpenLayers.Util.modifyAlphaImageDiv = function(div, id, px, sz, imgURL, 
+                                               position, border, sizing, 
+                                               opacity) {
+
+    OpenLayers.Util.modifyDOMElement(div, id, px, sz, position,
+                                     null, null, opacity);
+
+    var img = div.childNodes[0];
+
+    if (imgURL) {
+        img.src = imgURL;
+    }
+    OpenLayers.Util.modifyDOMElement(img, div.id + "_innerImage", null, sz, 
+                                     "relative", border);
+    
+    if (OpenLayers.Util.alphaHack()) {
+        if(div.style.display != "none") {
+            div.style.display = "inline-block";
+        }
+        if (sizing == null) {
+            sizing = "scale";
+        }
+        
+        div.style.filter = "progid:DXImageTransform.Microsoft" +
+                           ".AlphaImageLoader(src='" + img.src + "', " +
+                           "sizingMethod='" + sizing + "')";
+        if (parseFloat(div.style.opacity) >= 0.0 && 
+            parseFloat(div.style.opacity) < 1.0) {
+            div.style.filter += " alpha(opacity=" + div.style.opacity * 100 + ")";
+        }
+
+        img.style.filter = "alpha(opacity=0)";
+    }
+};
+
+/** 
+ * Function: createAlphaImageDiv
+ * 
+ * id - {String}
+ * px - {<OpenLayers.Pixel>}
+ * sz - {<OpenLayers.Size>}
+ * imgURL - {String}
+ * position - {String}
+ * border - {String}
+ * sizing - {String} 'crop', 'scale', or 'image'. Default is "scale"
+ * opacity - {Float} Fractional value (0.0 - 1.0)
+ * delayDisplay - {Boolean} If true waits until the image has been
+ *                          loaded.
+ * 
+ * Returns:
+ * {DOMElement} A DOM Div created with a DOM Image inside it. If the hack is 
+ *              needed for transparency in IE, it is added.
+ */ 
+OpenLayers.Util.createAlphaImageDiv = function(id, px, sz, imgURL, 
+                                               position, border, sizing, 
+                                               opacity, delayDisplay) {
+    
+    var div = OpenLayers.Util.createDiv();
+    var img = OpenLayers.Util.createImage(null, null, null, null, null, null, 
+                                          null, false);
+    div.appendChild(img);
+
+    if (delayDisplay) {
+        img.style.display = "none";
+        OpenLayers.Event.observe(img, "load",
+            OpenLayers.Function.bind(OpenLayers.Util.onImageLoad, div));
+        OpenLayers.Event.observe(img, "error",
+            OpenLayers.Function.bind(OpenLayers.Util.onImageLoadError, div));
+    }
+
+    OpenLayers.Util.modifyAlphaImageDiv(div, id, px, sz, imgURL, position, 
+                                        border, sizing, opacity);
+    
+    return div;
+};
+
+
+/** 
+ * Function: upperCaseObject
+ * Creates a new hashtable and copies over all the keys from the 
+ *     passed-in object, but storing them under an uppercased
+ *     version of the key at which they were stored.
+ * 
+ * Parameters: 
+ * object - {Object}
+ * 
+ * Returns: 
+ * {Object} A new Object with all the same keys but uppercased
+ */
+OpenLayers.Util.upperCaseObject = function (object) {
+    var uObject = {};
+    for (var key in object) {
+        uObject[key.toUpperCase()] = object[key];
+    }
+    return uObject;
+};
+
+/** 
+ * Function: applyDefaults
+ * Takes an object and copies any properties that don't exist from
+ *     another properties, by analogy with OpenLayers.Util.extend() from
+ *     Prototype.js.
+ * 
+ * Parameters:
+ * to - {Object} The destination object.
+ * from - {Object} The source object.  Any properties of this object that
+ *     are undefined in the to object will be set on the to object.
+ *
+ * Returns:
+ * {Object} A reference to the to object.  Note that the to argument is modified
+ *     in place and returned by this function.
+ */
+OpenLayers.Util.applyDefaults = function (to, from) {
+    to = to || {};
+    /*
+     * FF/Windows < 2.0.0.13 reports "Illegal operation on WrappedNative
+     * prototype object" when calling hawOwnProperty if the source object is an
+     * instance of window.Event.
+     */
+    var fromIsEvt = typeof window.Event == "function"
+                    && from instanceof window.Event;
+
+    for (var key in from) {
+        if (to[key] === undefined ||
+            (!fromIsEvt && from.hasOwnProperty
+             && from.hasOwnProperty(key) && !to.hasOwnProperty(key))) {
+            to[key] = from[key];
+        }
+    }
+    /**
+     * IE doesn't include the toString property when iterating over an object's
+     * properties with the for(property in object) syntax.  Explicitly check if
+     * the source has its own toString property.
+     */
+    if(!fromIsEvt && from && from.hasOwnProperty
+       && from.hasOwnProperty('toString') && !to.hasOwnProperty('toString')) {
+        to.toString = from.toString;
+    }
+    
+    return to;
+};
+
+/**
+ * Function: getParameterString
+ * 
+ * Parameters:
+ * params - {Object}
+ * 
+ * Returns:
+ * {String} A concatenation of the properties of an object in 
+ *          http parameter notation. 
+ *          (ex. <i>"key1=value1&key2=value2&key3=value3"</i>)
+ *          If a parameter is actually a list, that parameter will then
+ *          be set to a comma-seperated list of values (foo,bar) instead
+ *          of being URL escaped (foo%3Abar). 
+ */
+OpenLayers.Util.getParameterString = function(params) {
+    var paramsArray = [];
+    
+    for (var key in params) {
+      var value = params[key];
+      if ((value != null) && (typeof value != 'function')) {
+        var encodedValue;
+        if (typeof value == 'object' && value.constructor == Array) {
+          /* value is an array; encode items and separate with "," */
+          var encodedItemArray = [];
+          var item;
+          for (var itemIndex=0, len=value.length; itemIndex<len; itemIndex++) {
+            item = value[itemIndex];
+            encodedItemArray.push(encodeURIComponent(
+                (item === null || item === undefined) ? "" : item)
+            );
+          }
+          encodedValue = encodedItemArray.join(",");
+        }
+        else {
+          /* value is a string; simply encode */
+          encodedValue = encodeURIComponent(value);
+        }
+        paramsArray.push(encodeURIComponent(key) + "=" + encodedValue);
+      }
+    }
+    
+    return paramsArray.join("&");
+};
+
+/**
+ * Function: urlAppend
+ * Appends a parameter string to a url. This function includes the logic for
+ * using the appropriate character (none, & or ?) to append to the url before
+ * appending the param string.
+ * 
+ * Parameters:
+ * url - {String} The url to append to
+ * paramStr - {String} The param string to append
+ * 
+ * Returns:
+ * {String} The new url
+ */
+OpenLayers.Util.urlAppend = function(url, paramStr) {
+    var newUrl = url;
+    if(paramStr) {
+        var parts = (url + " ").split(/[?&]/);
+        newUrl += (parts.pop() === " " ?
+            paramStr :
+            parts.length ? "&" + paramStr : "?" + paramStr);
+    }
+    return newUrl;
+};
+
+/**
+ * Property: ImgPath
+ * {String} Default is ''.
+ */
+OpenLayers.ImgPath = '';
+
+/** 
+ * Function: getImagesLocation
+ * 
+ * Returns:
+ * {String} The fully formatted image location string
+ */
+OpenLayers.Util.getImagesLocation = function() {
+    return OpenLayers.ImgPath || (OpenLayers._getScriptLocation() + "img/");
+};
+
+
+/** 
+ * Function: Try
+ * Execute functions until one of them doesn't throw an error. 
+ *     Capitalized because "try" is a reserved word in JavaScript.
+ *     Taken directly from OpenLayers.Util.Try()
+ * 
+ * Parameters:
+ * [*] - {Function} Any number of parameters may be passed to Try()
+ *    It will attempt to execute each of them until one of them 
+ *    successfully executes. 
+ *    If none executes successfully, returns null.
+ * 
+ * Returns:
+ * {*} The value returned by the first successfully executed function.
+ */
+OpenLayers.Util.Try = function() {
+    var returnValue = null;
+
+    for (var i=0, len=arguments.length; i<len; i++) {
+      var lambda = arguments[i];
+      try {
+        returnValue = lambda();
+        break;
+      } catch (e) {}
+    }
+
+    return returnValue;
+};
+
+
+/** 
+ * Function: getNodes
+ * 
+ * These could/should be made namespace aware?
+ * 
+ * Parameters:
+ * p - {}
+ * tagName - {String}
+ * 
+ * Returns:
+ * {Array}
+ */
+OpenLayers.Util.getNodes=function(p, tagName) {
+    var nodes = OpenLayers.Util.Try(
+        function () {
+            return OpenLayers.Util._getNodes(p.documentElement.childNodes,
+                                            tagName);
+        },
+        function () {
+            return OpenLayers.Util._getNodes(p.childNodes, tagName);
+        }
+    );
+    return nodes;
+};
+
+/**
+ * Function: _getNodes
+ * 
+ * Parameters:
+ * nodes - {Array}
+ * tagName - {String}
+ * 
+ * Returns:
+ * {Array}
+ */
+OpenLayers.Util._getNodes=function(nodes, tagName) {
+    var retArray = [];
+    for (var i=0, len=nodes.length; i<len; i++) {
+        if (nodes[i].nodeName==tagName) {
+            retArray.push(nodes[i]);
+        }
+    }
+
+    return retArray;
+};
+
+
+
+/**
+ * Function: getTagText
+ * 
+ * Parameters:
+ * parent - {}
+ * item - {String}
+ * index - {Integer}
+ * 
+ * Returns:
+ * {String}
+ */
+OpenLayers.Util.getTagText = function (parent, item, index) {
+    var result = OpenLayers.Util.getNodes(parent, item);
+    if (result && (result.length > 0))
+    {
+        if (!index) {
+            index=0;
+        }
+        if (result[index].childNodes.length > 1) {
+            return result.childNodes[1].nodeValue; 
+        }
+        else if (result[index].childNodes.length == 1) {
+            return result[index].firstChild.nodeValue; 
+        }
+    } else { 
+        return ""; 
+    }
+};
+
+/**
+ * Function: getXmlNodeValue
+ * 
+ * Parameters:
+ * node - {XMLNode}
+ * 
+ * Returns:
+ * {String} The text value of the given node, without breaking in firefox or IE
+ */
+OpenLayers.Util.getXmlNodeValue = function(node) {
+    var val = null;
+    OpenLayers.Util.Try( 
+        function() {
+            val = node.text;
+            if (!val) {
+                val = node.textContent;
+            }
+            if (!val) {
+                val = node.firstChild.nodeValue;
+            }
+        }, 
+        function() {
+            val = node.textContent;
+        }); 
+    return val;
+};
+
+/** 
+ * Function: mouseLeft
+ * 
+ * Parameters:
+ * evt - {Event}
+ * div - {HTMLDivElement}
+ * 
+ * Returns:
+ * {Boolean}
+ */
+OpenLayers.Util.mouseLeft = function (evt, div) {
+    // start with the element to which the mouse has moved
+    var target = (evt.relatedTarget) ? evt.relatedTarget : evt.toElement;
+    // walk up the DOM tree.
+    while (target != div && target != null) {
+        target = target.parentNode;
+    }
+    // if the target we stop at isn't the div, then we've left the div.
+    return (target != div);
+};
+
+/**
+ * Property: precision
+ * {Number} The number of significant digits to retain to avoid
+ * floating point precision errors.
+ *
+ * We use 14 as a "safe" default because, although IEEE 754 double floats
+ * (standard on most modern operating systems) support up to about 16
+ * significant digits, 14 significant digits are sufficient to represent
+ * sub-millimeter accuracy in any coordinate system that anyone is likely to
+ * use with OpenLayers.
+ *
+ * If DEFAULT_PRECISION is set to 0, the original non-truncating behavior
+ * of OpenLayers <2.8 is preserved. Be aware that this will cause problems
+ * with certain projections, e.g. spherical Mercator.
+ *
+ */
+OpenLayers.Util.DEFAULT_PRECISION = 14;
+
+/**
+ * Function: toFloat
+ * Convenience method to cast an object to a Number, rounded to the
+ * desired floating point precision.
+ *
+ * Parameters:
+ * number    - {Number} The number to cast and round.
+ * precision - {Number} An integer suitable for use with
+ *      Number.toPrecision(). Defaults to OpenLayers.Util.DEFAULT_PRECISION.
+ *      If set to 0, no rounding is performed.
+ *
+ * Returns:
+ * {Number} The cast, rounded number.
+ */
+OpenLayers.Util.toFloat = function (number, precision) {
+    if (precision == null) {
+        precision = OpenLayers.Util.DEFAULT_PRECISION;
+    }
+    var number;
+    if (precision == 0) {
+        number = parseFloat(number);
+    } else {
+        number = parseFloat(parseFloat(number).toPrecision(precision));
+    }
+    return number;
+};
+
+/**
+ * Function: rad
+ * 
+ * Parameters:
+ * x - {Float}
+ * 
+ * Returns:
+ * {Float}
+ */
+OpenLayers.Util.rad = function(x) {return x*Math.PI/180;};
+
+/**
+ * Function: deg
+ *
+ * Parameters:
+ * x - {Float}
+ *
+ * Returns:
+ * {Float}
+ */
+OpenLayers.Util.deg = function(x) {return x*180/Math.PI;};
+
+/**
+ * Property: VincentyConstants
+ * {Object} Constants for Vincenty functions.
+ */
+OpenLayers.Util.VincentyConstants = {
+    a: 6378137,
+    b: 6356752.3142,
+    f: 1/298.257223563
+};
+
+/**
+ * APIFunction: distVincenty
+ * Given two objects representing points with geographic coordinates, this
+ *     calculates the distance between those points on the surface of an
+ *     ellipsoid.
+ *
+ * Parameters:
+ * p1 - {<OpenLayers.LonLat>} (or any object with both .lat, .lon properties)
+ * p2 - {<OpenLayers.LonLat>} (or any object with both .lat, .lon properties)
+ *
+ * Returns:
+ * {Float} The distance (in km) between the two input points as measured on an
+ *     ellipsoid.  Note that the input point objects must be in geographic
+ *     coordinates (decimal degrees) and the return distance is in kilometers.
+ */
+OpenLayers.Util.distVincenty = function(p1, p2) {
+    var ct = OpenLayers.Util.VincentyConstants;
+    var a = ct.a, b = ct.b, f = ct.f;
+
+    var L = OpenLayers.Util.rad(p2.lon - p1.lon);
+    var U1 = Math.atan((1-f) * Math.tan(OpenLayers.Util.rad(p1.lat)));
+    var U2 = Math.atan((1-f) * Math.tan(OpenLayers.Util.rad(p2.lat)));
+    var sinU1 = Math.sin(U1), cosU1 = Math.cos(U1);
+    var sinU2 = Math.sin(U2), cosU2 = Math.cos(U2);
+    var lambda = L, lambdaP = 2*Math.PI;
+    var iterLimit = 20;
+    while (Math.abs(lambda-lambdaP) > 1e-12 && --iterLimit>0) {
+        var sinLambda = Math.sin(lambda), cosLambda = Math.cos(lambda);
+        var sinSigma = Math.sqrt((cosU2*sinLambda) * (cosU2*sinLambda) +
+        (cosU1*sinU2-sinU1*cosU2*cosLambda) * (cosU1*sinU2-sinU1*cosU2*cosLambda));
+        if (sinSigma==0) {
+            return 0;  // co-incident points
+        }
+        var cosSigma = sinU1*sinU2 + cosU1*cosU2*cosLambda;
+        var sigma = Math.atan2(sinSigma, cosSigma);
+        var alpha = Math.asin(cosU1 * cosU2 * sinLambda / sinSigma);
+        var cosSqAlpha = Math.cos(alpha) * Math.cos(alpha);
+        var cos2SigmaM = cosSigma - 2*sinU1*sinU2/cosSqAlpha;
+        var C = f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha));
+        lambdaP = lambda;
+        lambda = L + (1-C) * f * Math.sin(alpha) *
+        (sigma + C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)));
+    }
+    if (iterLimit==0) {
+        return NaN;  // formula failed to converge
+    }
+    var uSq = cosSqAlpha * (a*a - b*b) / (b*b);
+    var A = 1 + uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq)));
+    var B = uSq/1024 * (256+uSq*(-128+uSq*(74-47*uSq)));
+    var deltaSigma = B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)-
+        B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM)));
+    var s = b*A*(sigma-deltaSigma);
+    var d = s.toFixed(3)/1000; // round to 1mm precision
+    return d;
+};
+
+/**
+ * APIFunction: destinationVincenty
+ * Calculate destination point given start point lat/long (numeric degrees),
+ * bearing (numeric degrees) & distance (in m).
+ * Adapted from Chris Veness work, see
+ * http://www.movable-type.co.uk/scripts/latlong-vincenty-direct.html
+ *
+ * Parameters:
+ * lonlat  - {<OpenLayers.LonLat>} (or any object with both .lat, .lon
+ *     properties) The start point.
+ * brng     - {Float} The bearing (degrees).
+ * distance - {Float} The ground distance (meters).
+ *
+ * Returns:
+ * {<OpenLayers.LonLat>} The destination point.
+ */
+OpenLayers.Util.destinationVincenty = function(lonlat, brng, dist) {
+    var u = OpenLayers.Util;
+    var ct = u.VincentyConstants;
+    var a = ct.a, b = ct.b, f = ct.f;
+
+    var lon1 = lonlat.lon;
+    var lat1 = lonlat.lat;
+
+    var s = dist;
+    var alpha1 = u.rad(brng);
+    var sinAlpha1 = Math.sin(alpha1);
+    var cosAlpha1 = Math.cos(alpha1);
+
+    var tanU1 = (1-f) * Math.tan(u.rad(lat1));
+    var cosU1 = 1 / Math.sqrt((1 + tanU1*tanU1)), sinU1 = tanU1*cosU1;
+    var sigma1 = Math.atan2(tanU1, cosAlpha1);
+    var sinAlpha = cosU1 * sinAlpha1;
+    var cosSqAlpha = 1 - sinAlpha*sinAlpha;
+    var uSq = cosSqAlpha * (a*a - b*b) / (b*b);
+    var A = 1 + uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq)));
+    var B = uSq/1024 * (256+uSq*(-128+uSq*(74-47*uSq)));
+
+    var sigma = s / (b*A), sigmaP = 2*Math.PI;
+    while (Math.abs(sigma-sigmaP) > 1e-12) {
+        var cos2SigmaM = Math.cos(2*sigma1 + sigma);
+        var sinSigma = Math.sin(sigma);
+        var cosSigma = Math.cos(sigma);
+        var deltaSigma = B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)-
+            B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM)));
+        sigmaP = sigma;
+        sigma = s / (b*A) + deltaSigma;
+    }
+
+    var tmp = sinU1*sinSigma - cosU1*cosSigma*cosAlpha1;
+    var lat2 = Math.atan2(sinU1*cosSigma + cosU1*sinSigma*cosAlpha1,
+        (1-f)*Math.sqrt(sinAlpha*sinAlpha + tmp*tmp));
+    var lambda = Math.atan2(sinSigma*sinAlpha1, cosU1*cosSigma - sinU1*sinSigma*cosAlpha1);
+    var C = f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha));
+    var L = lambda - (1-C) * f * sinAlpha *
+        (sigma + C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)));
+
+    var revAz = Math.atan2(sinAlpha, -tmp);  // final bearing
+
+    return new OpenLayers.LonLat(lon1+u.deg(L), u.deg(lat2));
+};
+
+/**
+ * Function: getParameters
+ * Parse the parameters from a URL or from the current page itself into a 
+ *     JavaScript Object. Note that parameter values with commas are separated
+ *     out into an Array.
+ * 
+ * Parameters:
+ * url - {String} Optional url used to extract the query string.
+ *                If null, query string is taken from page location.
+ * 
+ * Returns:
+ * {Object} An object of key/value pairs from the query string.
+ */
+OpenLayers.Util.getParameters = function(url) {
+    // if no url specified, take it from the location bar
+    url = url || window.location.href;
+
+    //parse out parameters portion of url string
+    var paramsString = "";
+    if (OpenLayers.String.contains(url, '?')) {
+        var start = url.indexOf('?') + 1;
+        var end = OpenLayers.String.contains(url, "#") ?
+                    url.indexOf('#') : url.length;
+        paramsString = url.substring(start, end);
+    }
+
+    var parameters = {};
+    var pairs = paramsString.split(/[&;]/);
+    for(var i=0, len=pairs.length; i<len; ++i) {
+        var keyValue = pairs[i].split('=');
+        if (keyValue[0]) {
+            var key = decodeURIComponent(keyValue[0]);
+            var value = keyValue[1] || ''; //empty string if no value
+
+            //decode individual values (being liberal by replacing "+" with " ")
+            value = decodeURIComponent(value.replace(/\+/g, " ")).split(",");
+
+            //if there's only one value, do not return as array                    
+            if (value.length == 1) {
+                value = value[0];
+            }                
+            
+            parameters[key] = value;
+         }
+     }
+    return parameters;
+};
+
+/**
+ * Function: getArgs
+ * *Deprecated*.  Will be removed in 3.0.  Please use instead
+ *     <OpenLayers.Util.getParameters>
+ * 
+ * Parameters:
+ * url - {String} Optional url used to extract the query string.
+ *                If null, query string is taken from page location.
+ * 
+ * Returns:
+ * {Object} An object of key/value pairs from the query string.
+ */
+OpenLayers.Util.getArgs = function(url) {
+    OpenLayers.Console.warn(
+        OpenLayers.i18n(
+            "methodDeprecated", {'newMethod': 'OpenLayers.Util.getParameters'}
+        )
+    );
+    return OpenLayers.Util.getParameters(url);
+};
+
+/**
+ * Property: lastSeqID
+ * {Integer} The ever-incrementing count variable.
+ *           Used for generating unique ids.
+ */
+OpenLayers.Util.lastSeqID = 0;
+
+/**
+ * Function: createUniqueID
+ * Create a unique identifier for this session.  Each time this function
+ *     is called, a counter is incremented.  The return will be the optional
+ *     prefix (defaults to "id_") appended with the counter value.
+ * 
+ * Parameters:
+ * prefix {String} Optionsal string to prefix unique id. Default is "id_".
+ * 
+ * Returns:
+ * {String} A unique id string, built on the passed in prefix.
+ */
+OpenLayers.Util.createUniqueID = function(prefix) {
+    if (prefix == null) {
+        prefix = "id_";
+    }
+    OpenLayers.Util.lastSeqID += 1; 
+    return prefix + OpenLayers.Util.lastSeqID;        
+};
+
+/**
+ * Constant: INCHES_PER_UNIT
+ * {Object} Constant inches per unit -- borrowed from MapServer mapscale.c
+ * derivation of nautical miles from http://en.wikipedia.org/wiki/Nautical_mile
+ * Includes the full set of units supported by CS-MAP (http://trac.osgeo.org/csmap/)
+ * and PROJ.4 (http://trac.osgeo.org/proj/)
+ * The hardcoded table is maintain in a CS-MAP source code module named CSdataU.c
+ * The hardcoded table of PROJ.4 units are in pj_units.c.
+ */
+OpenLayers.INCHES_PER_UNIT = { 
+    'inches': 1.0,
+    'ft': 12.0,
+    'mi': 63360.0,
+    'm': 39.3701,
+    'km': 39370.1,
+    'dd': 4374754,
+    'yd': 36
+};
+OpenLayers.INCHES_PER_UNIT["in"]= OpenLayers.INCHES_PER_UNIT.inches;
+OpenLayers.INCHES_PER_UNIT["degrees"] = OpenLayers.INCHES_PER_UNIT.dd;
+OpenLayers.INCHES_PER_UNIT["nmi"] = 1852 * OpenLayers.INCHES_PER_UNIT.m;
+
+// Units from CS-Map
+OpenLayers.METERS_PER_INCH = 0.02540005080010160020;
+OpenLayers.Util.extend(OpenLayers.INCHES_PER_UNIT, {
+    "Inch": OpenLayers.INCHES_PER_UNIT.inches,
+    "Meter": 1.0 / OpenLayers.METERS_PER_INCH,   //EPSG:9001
+    "Foot": 0.30480060960121920243 / OpenLayers.METERS_PER_INCH,   //EPSG:9003
+    "IFoot": 0.30480000000000000000 / OpenLayers.METERS_PER_INCH,   //EPSG:9002
+    "ClarkeFoot": 0.3047972651151 / OpenLayers.METERS_PER_INCH,   //EPSG:9005
+    "SearsFoot": 0.30479947153867624624 / OpenLayers.METERS_PER_INCH,   //EPSG:9041
+    "GoldCoastFoot": 0.30479971018150881758 / OpenLayers.METERS_PER_INCH,   //EPSG:9094
+    "IInch": 0.02540000000000000000 / OpenLayers.METERS_PER_INCH,
+    "MicroInch": 0.00002540000000000000 / OpenLayers.METERS_PER_INCH,
+    "Mil": 0.00000002540000000000 / OpenLayers.METERS_PER_INCH,
+    "Centimeter": 0.01000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "Kilometer": 1000.00000000000000000000 / OpenLayers.METERS_PER_INCH,   //EPSG:9036
+    "Yard": 0.91440182880365760731 / OpenLayers.METERS_PER_INCH,
+    "SearsYard": 0.914398414616029 / OpenLayers.METERS_PER_INCH,   //EPSG:9040
+    "IndianYard": 0.91439853074444079983 / OpenLayers.METERS_PER_INCH,   //EPSG:9084
+    "IndianYd37": 0.91439523 / OpenLayers.METERS_PER_INCH,   //EPSG:9085
+    "IndianYd62": 0.9143988 / OpenLayers.METERS_PER_INCH,   //EPSG:9086
+    "IndianYd75": 0.9143985 / OpenLayers.METERS_PER_INCH,   //EPSG:9087
+    "IndianFoot": 0.30479951 / OpenLayers.METERS_PER_INCH,   //EPSG:9080
+    "IndianFt37": 0.30479841 / OpenLayers.METERS_PER_INCH,   //EPSG:9081
+    "IndianFt62": 0.3047996 / OpenLayers.METERS_PER_INCH,   //EPSG:9082
+    "IndianFt75": 0.3047995 / OpenLayers.METERS_PER_INCH,   //EPSG:9083
+    "Mile": 1609.34721869443738887477 / OpenLayers.METERS_PER_INCH,
+    "IYard": 0.91440000000000000000 / OpenLayers.METERS_PER_INCH,   //EPSG:9096
+    "IMile": 1609.34400000000000000000 / OpenLayers.METERS_PER_INCH,   //EPSG:9093
+    "NautM": 1852.00000000000000000000 / OpenLayers.METERS_PER_INCH,   //EPSG:9030
+    "Lat-66": 110943.316488932731 / OpenLayers.METERS_PER_INCH,
+    "Lat-83": 110946.25736872234125 / OpenLayers.METERS_PER_INCH,
+    "Decimeter": 0.10000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "Millimeter": 0.00100000000000000000 / OpenLayers.METERS_PER_INCH,
+    "Dekameter": 10.00000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "Decameter": 10.00000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "Hectometer": 100.00000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "GermanMeter": 1.0000135965 / OpenLayers.METERS_PER_INCH,   //EPSG:9031
+    "CaGrid": 0.999738 / OpenLayers.METERS_PER_INCH,
+    "ClarkeChain": 20.1166194976 / OpenLayers.METERS_PER_INCH,   //EPSG:9038
+    "GunterChain": 20.11684023368047 / OpenLayers.METERS_PER_INCH,   //EPSG:9033
+    "BenoitChain": 20.116782494375872 / OpenLayers.METERS_PER_INCH,   //EPSG:9062
+    "SearsChain": 20.11676512155 / OpenLayers.METERS_PER_INCH,   //EPSG:9042
+    "ClarkeLink": 0.201166194976 / OpenLayers.METERS_PER_INCH,   //EPSG:9039
+    "GunterLink": 0.2011684023368047 / OpenLayers.METERS_PER_INCH,   //EPSG:9034
+    "BenoitLink": 0.20116782494375872 / OpenLayers.METERS_PER_INCH,   //EPSG:9063
+    "SearsLink": 0.2011676512155 / OpenLayers.METERS_PER_INCH,   //EPSG:9043
+    "Rod": 5.02921005842012 / OpenLayers.METERS_PER_INCH,
+    "IntnlChain": 20.1168 / OpenLayers.METERS_PER_INCH,   //EPSG:9097
+    "IntnlLink": 0.201168 / OpenLayers.METERS_PER_INCH,   //EPSG:9098
+    "Perch": 5.02921005842012 / OpenLayers.METERS_PER_INCH,
+    "Pole": 5.02921005842012 / OpenLayers.METERS_PER_INCH,
+    "Furlong": 201.1684023368046 / OpenLayers.METERS_PER_INCH,
+    "Rood": 3.778266898 / OpenLayers.METERS_PER_INCH,
+    "CapeFoot": 0.3047972615 / OpenLayers.METERS_PER_INCH,
+    "Brealey": 375.00000000000000000000 / OpenLayers.METERS_PER_INCH,
+    "ModAmFt": 0.304812252984505969011938 / OpenLayers.METERS_PER_INCH,
+    "Fathom": 1.8288 / OpenLayers.METERS_PER_INCH,
+    "NautM-UK": 1853.184 / OpenLayers.METERS_PER_INCH,
+    "50kilometers": 50000.0 / OpenLayers.METERS_PER_INCH,
+    "150kilometers": 150000.0 / OpenLayers.METERS_PER_INCH
+});
+
+//unit abbreviations supported by PROJ.4
+OpenLayers.Util.extend(OpenLayers.INCHES_PER_UNIT, {
+    "mm": OpenLayers.INCHES_PER_UNIT["Meter"] / 1000.0,
+    "cm": OpenLayers.INCHES_PER_UNIT["Meter"] / 100.0,
+    "dm": OpenLayers.INCHES_PER_UNIT["Meter"] * 100.0,
+    "km": OpenLayers.INCHES_PER_UNIT["Meter"] * 1000.0,
+    "kmi": OpenLayers.INCHES_PER_UNIT["nmi"],    //International Nautical Mile
+    "fath": OpenLayers.INCHES_PER_UNIT["Fathom"], //International Fathom
+    "ch": OpenLayers.INCHES_PER_UNIT["IntnlChain"],  //International Chain
+    "link": OpenLayers.INCHES_PER_UNIT["IntnlLink"], //International Link
+    "us-in": OpenLayers.INCHES_PER_UNIT["inches"], //U.S. Surveyor's Inch
+    "us-ft": OpenLayers.INCHES_PER_UNIT["Foot"],	//U.S. Surveyor's Foot
+    "us-yd": OpenLayers.INCHES_PER_UNIT["Yard"],	//U.S. Surveyor's Yard
+    "us-ch": OpenLayers.INCHES_PER_UNIT["GunterChain"], //U.S. Surveyor's Chain
+    "us-mi": OpenLayers.INCHES_PER_UNIT["Mile"],   //U.S. Surveyor's Statute Mile
+    "ind-yd": OpenLayers.INCHES_PER_UNIT["IndianYd37"],  //Indian Yard
+    "ind-ft": OpenLayers.INCHES_PER_UNIT["IndianFt37"],  //Indian Foot
+    "ind-ch": 20.11669506 / OpenLayers.METERS_PER_INCH  //Indian Chain
+});
+
+/** 
+ * Constant: DOTS_PER_INCH
+ * {Integer} 72 (A sensible default)
+ */
+OpenLayers.DOTS_PER_INCH = 72;
+
+/**
+ * Function: normalizeScale
+ * 
+ * Parameters:
+ * scale - {float}
+ * 
+ * Returns:
+ * {Float} A normalized scale value, in 1 / X format. 
+ *         This means that if a value less than one ( already 1/x) is passed
+ *         in, it just returns scale directly. Otherwise, it returns 
+ *         1 / scale
+ */
+OpenLayers.Util.normalizeScale = function (scale) {
+    var normScale = (scale > 1.0) ? (1.0 / scale) 
+                                  : scale;
+    return normScale;
+};
+
+/**
+ * Function: getResolutionFromScale
+ * 
+ * Parameters:
+ * scale - {Float}
+ * units - {String} Index into OpenLayers.INCHES_PER_UNIT hashtable.
+ *                  Default is degrees
+ * 
+ * Returns:
+ * {Float} The corresponding resolution given passed-in scale and unit 
+ *     parameters.  If the given scale is falsey, the returned resolution will
+ *     be undefined.
+ */
+OpenLayers.Util.getResolutionFromScale = function (scale, units) {
+    var resolution;
+    if (scale) {
+        if (units == null) {
+            units = "degrees";
+        }
+        var normScale = OpenLayers.Util.normalizeScale(scale);
+        resolution = 1 / (normScale * OpenLayers.INCHES_PER_UNIT[units]
+                                        * OpenLayers.DOTS_PER_INCH);        
+    }
+    return resolution;
+};
+
+/**
+ * Function: getScaleFromResolution
+ * 
+ * Parameters:
+ * resolution - {Float}
+ * units - {String} Index into OpenLayers.INCHES_PER_UNIT hashtable.
+ *                  Default is degrees
+ * 
+ * Returns:
+ * {Float} The corresponding scale given passed-in resolution and unit 
+ *         parameters.
+ */
+OpenLayers.Util.getScaleFromResolution = function (resolution, units) {
+
+    if (units == null) {
+        units = "degrees";
+    }
+
+    var scale = resolution * OpenLayers.INCHES_PER_UNIT[units] *
+                    OpenLayers.DOTS_PER_INCH;
+    return scale;
+};
+
+/**
+ * Function: safeStopPropagation
+ * *Deprecated*. This function has been deprecated. Please use directly 
+ *     <OpenLayers.Event.stop> passing 'true' as the 2nd 
+ *     argument (preventDefault)
+ * 
+ * Safely stop the propagation of an event *without* preventing
+ *   the default browser action from occurring.
+ * 
+ * Parameter:
+ * evt - {Event}
+ */
+OpenLayers.Util.safeStopPropagation = function(evt) {
+    OpenLayers.Event.stop(evt, true);
+};
+
+/**
+ * Function: pagePositon
+ * Calculates the position of an element on the page. 
+ *
+ * Parameters:
+ * forElement - {DOMElement}
+ * 
+ * Returns:
+ * {Array} two item array, L value then T value.
+ */
+OpenLayers.Util.pagePosition = function(forElement) {
+    var valueT = 0, valueL = 0;
+
+    var element = forElement;
+    var child = forElement;
+    while(element) {
+
+        if(element == document.body) {
+            if(OpenLayers.Element.getStyle(child, 'position') == 'absolute') {
+                break;
+            }
+        }
+        
+        valueT += element.offsetTop  || 0;
+        valueL += element.offsetLeft || 0;
+
+        child = element;
+        try {
+            // wrapping this in a try/catch because IE chokes on the offsetParent
+            element = element.offsetParent;
+        } catch(e) {
+            OpenLayers.Console.error(OpenLayers.i18n(
+                                  "pagePositionFailed",{'elemId':element.id}));
+            break;
+        }
+    }
+
+    element = forElement;
+    while(element) {
+        valueT -= element.scrollTop  || 0;
+        valueL -= element.scrollLeft || 0;
+        element = element.parentNode;
+    }
+    
+    return [valueL, valueT];
+};
+
+
+/** 
+ * Function: isEquivalentUrl
+ * Test two URLs for equivalence. 
+ * 
+ * Setting 'ignoreCase' allows for case-independent comparison.
+ * 
+ * Comparison is based on: 
+ *  - Protocol
+ *  - Host (evaluated without the port)
+ *  - Port (set 'ignorePort80' to ignore "80" values)
+ *  - Hash ( set 'ignoreHash' to disable)
+ *  - Pathname (for relative <-> absolute comparison) 
+ *  - Arguments (so they can be out of order)
+ *  
+ * Parameters:
+ * url1 - {String}
+ * url2 - {String}
+ * options - {Object} Allows for customization of comparison:
+ *                    'ignoreCase' - Default is True
+ *                    'ignorePort80' - Default is True
+ *                    'ignoreHash' - Default is True
+ *
+ * Returns:
+ * {Boolean} Whether or not the two URLs are equivalent
+ */
+OpenLayers.Util.isEquivalentUrl = function(url1, url2, options) {
+    options = options || {};
+
+    OpenLayers.Util.applyDefaults(options, {
+        ignoreCase: true,
+        ignorePort80: true,
+        ignoreHash: true
+    });
+
+    var urlObj1 = OpenLayers.Util.createUrlObject(url1, options);
+    var urlObj2 = OpenLayers.Util.createUrlObject(url2, options);
+
+    //compare all keys except for "args" (treated below)
+    for(var key in urlObj1) {
+        if(key !== "args") {
+            if(urlObj1[key] != urlObj2[key]) {
+                return false;
+            }
+        }
+    }
+
+    // compare search args - irrespective of order
+    for(var key in urlObj1.args) {
+        if(urlObj1.args[key] != urlObj2.args[key]) {
+            return false;
+        }
+        delete urlObj2.args[key];
+    }
+    // urlObj2 shouldn't have any args left
+    for(var key in urlObj2.args) {
+        return false;
+    }
+    
+    return true;
+};
+
+/**
+ * Function: createUrlObject
+ * 
+ * Parameters:
+ * url - {String}
+ * options - {Object} A hash of options.  Can be one of:
+ *            ignoreCase: lowercase url,
+ *            ignorePort80: don't include explicit port if port is 80,
+ *            ignoreHash: Don't include part of url after the hash (#).
+ * 
+ * Returns:
+ * {Object} An object with separate url, a, port, host, and args parsed out 
+ *          and ready for comparison
+ */
+OpenLayers.Util.createUrlObject = function(url, options) {
+    options = options || {};
+
+    // deal with relative urls first
+    if(!(/^\w+:\/\//).test(url)) {
+        var loc = window.location;
+        var port = loc.port ? ":" + loc.port : "";
+        var fullUrl = loc.protocol + "//" + loc.host.split(":").shift() + port;
+        if(url.indexOf("/") === 0) {
+            // full pathname
+            url = fullUrl + url;
+        } else {
+            // relative to current path
+            var parts = loc.pathname.split("/");
+            parts.pop();
+            url = fullUrl + parts.join("/") + "/" + url;
+        }
+    }
+  
+    if (options.ignoreCase) {
+        url = url.toLowerCase(); 
+    }
+
+    var a = document.createElement('a');
+    a.href = url;
+    
+    var urlObject = {};
+    
+    //host (without port)
+    urlObject.host = a.host.split(":").shift();
+
+    //protocol
+    urlObject.protocol = a.protocol;  
+
+    //port (get uniform browser behavior with port 80 here)
+    if(options.ignorePort80) {
+        urlObject.port = (a.port == "80" || a.port == "0") ? "" : a.port;
+    } else {
+        urlObject.port = (a.port == "" || a.port == "0") ? "80" : a.port;
+    }
+
+    //hash
+    urlObject.hash = (options.ignoreHash || a.hash === "#") ? "" : a.hash;  
+    
+    //args
+    var queryString = a.search;
+    if (!queryString) {
+        var qMark = url.indexOf("?");
+        queryString = (qMark != -1) ? url.substr(qMark) : "";
+    }
+    urlObject.args = OpenLayers.Util.getParameters(queryString);
+
+    //pathname (uniform browser behavior with leading "/")
+    urlObject.pathname = (a.pathname.charAt(0) == "/") ? a.pathname : "/" + a.pathname;
+    
+    return urlObject; 
+};
+ 
+/**
+ * Function: removeTail
+ * Takes a url and removes everything after the ? and #
+ * 
+ * Parameters:
+ * url - {String} The url to process
+ * 
+ * Returns:
+ * {String} The string with all queryString and Hash removed
+ */
+OpenLayers.Util.removeTail = function(url) {
+    var head = null;
+    
+    var qMark = url.indexOf("?");
+    var hashMark = url.indexOf("#");
+
+    if (qMark == -1) {
+        head = (hashMark != -1) ? url.substr(0,hashMark) : url;
+    } else {
+        head = (hashMark != -1) ? url.substr(0,Math.min(qMark, hashMark)) 
+                                  : url.substr(0, qMark);
+    }
+    return head;
+};
+
+
+/**
+ * Function: getBrowserName
+ * 
+ * Returns:
+ * {String} A string which specifies which is the current 
+ *          browser in which we are running. 
+ * 
+ *          Currently-supported browser detection and codes:
+ *           * 'opera' -- Opera
+ *           * 'msie'  -- Internet Explorer
+ *           * 'safari' -- Safari
+ *           * 'firefox' -- FireFox
+ *           * 'mozilla' -- Mozilla
+ * 
+ *          If we are unable to property identify the browser, we 
+ *           return an empty string.
+ */
+OpenLayers.Util.getBrowserName = function() {
+    var browserName = "";
+    
+    var ua = navigator.userAgent.toLowerCase();
+    if ( ua.indexOf( "opera" ) != -1 ) {
+        browserName = "opera";
+    } else if ( ua.indexOf( "msie" ) != -1 ) {
+        browserName = "msie";
+    } else if ( ua.indexOf( "safari" ) != -1 ) {
+        browserName = "safari";
+    } else if ( ua.indexOf( "mozilla" ) != -1 ) {
+        if ( ua.indexOf( "firefox" ) != -1 ) {
+            browserName = "firefox";
+        } else {
+            browserName = "mozilla";
+        }
+    }
+    
+    return browserName;
+};
+
+
+
+    
+/**
+ * Method: getRenderedDimensions
+ * Renders the contentHTML offscreen to determine actual dimensions for
+ *     popup sizing. As we need layout to determine dimensions the content
+ *     is rendered -9999px to the left and absolute to ensure the 
+ *     scrollbars do not flicker
+ *     
+ * Parameters:
+ * contentHTML
+ * size - {<OpenLayers.Size>} If either the 'w' or 'h' properties is 
+ *     specified, we fix that dimension of the div to be measured. This is 
+ *     useful in the case where we have a limit in one dimension and must 
+ *     therefore meaure the flow in the other dimension.
+ * options - {Object}
+ *     displayClass - {String} Optional parameter.  A CSS class name(s) string
+ *         to provide the CSS context of the rendered content.
+ *     containerElement - {DOMElement} Optional parameter. Insert the HTML to 
+ *         this node instead of the body root when calculating dimensions. 
+ * 
+ * Returns:
+ * {OpenLayers.Size}
+ */
+OpenLayers.Util.getRenderedDimensions = function(contentHTML, size, options) {
+    
+    var w, h;
+    
+    // create temp container div with restricted size
+    var container = document.createElement("div");
+    container.style.visibility = "hidden";
+        
+    var containerElement = (options && options.containerElement) 
+    	? options.containerElement : document.body;
+
+    //fix a dimension, if specified.
+    if (size) {
+        if (size.w) {
+            w = size.w;
+            container.style.width = w + "px";
+        } else if (size.h) {
+            h = size.h;
+            container.style.height = h + "px";
+        }
+    }
+
+    //add css classes, if specified
+    if (options && options.displayClass) {
+        container.className = options.displayClass;
+    }
+    
+    // create temp content div and assign content
+    var content = document.createElement("div");
+    content.innerHTML = contentHTML;
+    
+    // we need overflow visible when calculating the size
+    content.style.overflow = "visible";
+    if (content.childNodes) {
+        for (var i=0, l=content.childNodes.length; i<l; i++) {
+            if (!content.childNodes[i].style) continue;
+            content.childNodes[i].style.overflow = "visible";
+        }
+    }
+    
+    // add content to restricted container 
+    container.appendChild(content);
+    
+    // append container to body for rendering
+    containerElement.appendChild(container);
+    
+    // Opera and IE7 can't handle a node with position:aboslute if it inherits
+    // position:absolute from a parent.
+    var parentHasPositionAbsolute = false;
+    var parent = container.parentNode;
+    while (parent && parent.tagName.toLowerCase()!="body") {
+        var parentPosition = OpenLayers.Element.getStyle(parent, "position");
+        if(parentPosition == "absolute") {
+            parentHasPositionAbsolute = true;
+            break;
+        } else if (parentPosition && parentPosition != "static") {
+            break;
+        }
+        parent = parent.parentNode;
+    }
+
+    if(!parentHasPositionAbsolute) {
+        container.style.position = "absolute";
+    }
+    
+    // calculate scroll width of content and add corners and shadow width
+    if (!w) {
+        w = parseInt(content.scrollWidth);
+    
+        // update container width to allow height to adjust
+        container.style.width = w + "px";
+    }        
+    // capture height and add shadow and corner image widths
+    if (!h) {
+        h = parseInt(content.scrollHeight);
+    }
+
+    // remove elements
+    container.removeChild(content);
+    containerElement.removeChild(container);
+    
+    return new OpenLayers.Size(w, h);
+};
+
+/**
+ * APIFunction: getScrollbarWidth
+ * This function has been modified by the OpenLayers from the original version,
+ *     written by Matthew Eernisse and released under the Apache 2 
+ *     license here:
+ * 
+ *     http://www.fleegix.org/articles/2006/05/30/getting-the-scrollbar-width-in-pixels
+ * 
+ *     It has been modified simply to cache its value, since it is physically 
+ *     impossible that this code could ever run in more than one browser at 
+ *     once. 
+ * 
+ * Returns:
+ * {Integer}
+ */
+OpenLayers.Util.getScrollbarWidth = function() {
+    
+    var scrollbarWidth = OpenLayers.Util._scrollbarWidth;
+    
+    if (scrollbarWidth == null) {
+        var scr = null;
+        var inn = null;
+        var wNoScroll = 0;
+        var wScroll = 0;
+    
+        // Outer scrolling div
+        scr = document.createElement('div');
+        scr.style.position = 'absolute';
+        scr.style.top = '-1000px';
+        scr.style.left = '-1000px';
+        scr.style.width = '100px';
+        scr.style.height = '50px';
+        // Start with no scrollbar
+        scr.style.overflow = 'hidden';
+    
+        // Inner content div
+        inn = document.createElement('div');
+        inn.style.width = '100%';
+        inn.style.height = '200px';
+    
+        // Put the inner div in the scrolling div
+        scr.appendChild(inn);
+        // Append the scrolling div to the doc
+        document.body.appendChild(scr);
+    
+        // Width of the inner div sans scrollbar
+        wNoScroll = inn.offsetWidth;
+    
+        // Add the scrollbar
+        scr.style.overflow = 'scroll';
+        // Width of the inner div width scrollbar
+        wScroll = inn.offsetWidth;
+    
+        // Remove the scrolling div from the doc
+        document.body.removeChild(document.body.lastChild);
+    
+        // Pixel width of the scroller
+        OpenLayers.Util._scrollbarWidth = (wNoScroll - wScroll);
+        scrollbarWidth = OpenLayers.Util._scrollbarWidth;
+    }
+
+    return scrollbarWidth;
+};
+
+/**
+ * APIFunction: getFormattedLonLat
+ * This function will return latitude or longitude value formatted as 
+ *
+ * Parameters:
+ * coordinate - {Float} the coordinate value to be formatted
+ * axis - {String} value of either 'lat' or 'lon' to indicate which axis is to
+ *          to be formatted (default = lat)
+ * dmsOption - {String} specify the precision of the output can be one of:
+ *           'dms' show degrees minutes and seconds
+ *           'dm' show only degrees and minutes
+ *           'd' show only degrees
+ * 
+ * Returns:
+ * {String} the coordinate value formatted as a string
+ */
+OpenLayers.Util.getFormattedLonLat = function(coordinate, axis, dmsOption) {
+    if (!dmsOption) {
+        dmsOption = 'dms';    //default to show degree, minutes, seconds
+    }
+    var abscoordinate = Math.abs(coordinate)
+    var coordinatedegrees = Math.floor(abscoordinate);
+
+    var coordinateminutes = (abscoordinate - coordinatedegrees)/(1/60);
+    var tempcoordinateminutes = coordinateminutes;
+    coordinateminutes = Math.floor(coordinateminutes);
+    var coordinateseconds = (tempcoordinateminutes - coordinateminutes)/(1/60);
+    coordinateseconds =  Math.round(coordinateseconds*10);
+    coordinateseconds /= 10;
+
+    if( coordinatedegrees < 10 ) {
+        coordinatedegrees = "0" + coordinatedegrees;
+    }
+    var str = coordinatedegrees + "\u00B0";
+
+    if (dmsOption.indexOf('dm') >= 0) {
+        if( coordinateminutes < 10 ) {
+            coordinateminutes = "0" + coordinateminutes;
+        }
+        str += coordinateminutes + "'";
+  
+        if (dmsOption.indexOf('dms') >= 0) {
+            if( coordinateseconds < 10 ) {
+                coordinateseconds = "0" + coordinateseconds;
+            }
+            str += coordinateseconds + '"';
+        }
+    }
+    
+    if (axis == "lon") {
+        str += coordinate < 0 ? OpenLayers.i18n("W") : OpenLayers.i18n("E");
+    } else {
+        str += coordinate < 0 ? OpenLayers.i18n("S") : OpenLayers.i18n("N");
+    }
+    return str;
+};
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Curve.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Curve.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Curve.js	(revision 76)
@@ -0,0 +1,93 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/MultiPoint.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.Curve
+ * A Curve is a MultiPoint, whose points are assumed to be connected. To 
+ * this end, we provide a "getLength()" function, which iterates through 
+ * the points, summing the distances between them. 
+ * 
+ * Inherits: 
+ *  - <OpenLayers.Geometry.MultiPoint>
+ */
+OpenLayers.Geometry.Curve = OpenLayers.Class(OpenLayers.Geometry.MultiPoint, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of 
+     *                 components that the collection can include.  A null 
+     *                 value means the component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.Point"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.Curve
+     * 
+     * Parameters:
+     * point - {Array(<OpenLayers.Geometry.Point>)}
+     */
+    initialize: function(points) {
+        OpenLayers.Geometry.MultiPoint.prototype.initialize.apply(this, 
+                                                                  arguments);
+    },
+    
+    /**
+     * APIMethod: getLength
+     * 
+     * Returns:
+     * {Float} The length of the curve
+     */
+    getLength: function() {
+        var length = 0.0;
+        if ( this.components && (this.components.length > 1)) {
+            for(var i=1, len=this.components.length; i<len; i++) {
+                length += this.components[i-1].distanceTo(this.components[i]);
+            }
+        }
+        return length;
+    },
+
+    /**
+     * APIMethod: getGeodesicLength
+     * Calculate the approximate length of the geometry were it projected onto
+     *     the earth.
+     *
+     * projection - {<OpenLayers.Projection>} The spatial reference system
+     *     for the geometry coordinates.  If not provided, Geographic/WGS84 is
+     *     assumed.
+     * 
+     * Returns:
+     * {Float} The appoximate geodesic length of the geometry in meters.
+     */
+    getGeodesicLength: function(projection) {
+        var geom = this;  // so we can work with a clone if needed
+        if(projection) {
+            var gg = new OpenLayers.Projection("EPSG:4326");
+            if(!gg.equals(projection)) {
+                geom = this.clone().transform(projection, gg);
+            }
+        }
+        var length = 0.0;
+        if(geom.components && (geom.components.length > 1)) {
+            var p1, p2;
+            for(var i=1, len=geom.components.length; i<len; i++) {
+                p1 = geom.components[i-1];
+                p2 = geom.components[i];
+                // this returns km and requires lon/lat properties
+                length += OpenLayers.Util.distVincenty(
+                    {lon: p1.x, lat: p1.y}, {lon: p2.x, lat: p2.y}
+                );
+            }
+        }
+        // convert to m
+        return length * 1000;
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.Curve"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPoint.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPoint.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPoint.js	(revision 76)
@@ -0,0 +1,70 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/Collection.js
+ * @requires OpenLayers/Geometry/Point.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.MultiPoint
+ * MultiPoint is a collection of Points.  Create a new instance with the
+ * <OpenLayers.Geometry.MultiPoint> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Geometry.Collection>
+ *  - <OpenLayers.Geometry>
+ */
+OpenLayers.Geometry.MultiPoint = OpenLayers.Class(
+  OpenLayers.Geometry.Collection, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of
+     * components that the collection can include.  A null value means the
+     * component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.Point"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.MultiPoint
+     * Create a new MultiPoint Geometry
+     *
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry.Point>)} 
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.MultiPoint>}
+     */
+    initialize: function(components) {
+        OpenLayers.Geometry.Collection.prototype.initialize.apply(this, 
+                                                                  arguments);
+    },
+
+    /**
+     * APIMethod: addPoint
+     * Wrapper for <OpenLayers.Geometry.Collection.addComponent>
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>} Point to be added
+     * index - {Integer} Optional index
+     */
+    addPoint: function(point, index) {
+        this.addComponent(point, index);
+    },
+    
+    /**
+     * APIMethod: removePoint
+     * Wrapper for <OpenLayers.Geometry.Collection.removeComponent>
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>} Point to be removed
+     */
+    removePoint: function(point){
+        this.removeComponent(point);
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.MultiPoint"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Rectangle.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Rectangle.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Rectangle.js	(revision 76)
@@ -0,0 +1,99 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.Rectangle
+ * This class is *not supported*, and probably isn't what you're looking for.
+ *     Instead, most users probably want something like:
+ *     (code)
+ *     var poly = new OpenLayers.Bounds(0,0,10,10).toGeometry();
+ *     (end)
+ *     This will create a rectangular Polygon geometry. 
+ * 
+ * Inherits:
+ *  - <OpenLayers.Geometry>
+ */
+
+OpenLayers.Geometry.Rectangle = OpenLayers.Class(OpenLayers.Geometry, {
+
+    /** 
+     * Property: x
+     * {Float}
+     */
+    x: null,
+
+    /** 
+     * Property: y
+     * {Float}
+     */
+    y: null,
+
+    /** 
+     * Property: width
+     * {Float}
+     */
+    width: null,
+
+    /** 
+     * Property: height
+     * {Float}
+     */
+    height: null,
+
+    /**
+     * Constructor: OpenLayers.Geometry.Rectangle
+     * 
+     * Parameters:
+     * points - {Array(<OpenLayers.Geometry.Point>}
+     */
+    initialize: function(x, y, width, height) {
+        OpenLayers.Geometry.prototype.initialize.apply(this, arguments);
+        
+        this.x = x;
+        this.y = y;
+
+        this.width = width;
+        this.height = height;
+    },
+    
+    /**
+     * Method: calculateBounds
+     * Recalculate the bounds for the geometry.
+     */
+    calculateBounds: function() {
+        this.bounds = new OpenLayers.Bounds(this.x, this.y,
+                                            this.x + this.width, 
+                                            this.y + this.height);
+    },
+    
+    
+    /**
+     * APIMethod: getLength
+     * 
+     * Returns:
+     * {Float} The length of the geometry
+     */
+    getLength: function() {
+        var length = (2 * this.width) + (2 * this.height);
+        return length;
+    },
+
+    /**
+     * APIMethod: getArea
+     * 
+     * Returns:
+     * {Float} The area of the geometry
+     */
+    getArea: function() {
+        var area = this.width * this.height;
+        return area;
+    },    
+
+    CLASS_NAME: "OpenLayers.Geometry.Rectangle"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Polygon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Polygon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Polygon.js	(revision 76)
@@ -0,0 +1,259 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/Collection.js
+ * @requires OpenLayers/Geometry/LinearRing.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.Polygon 
+ * Polygon is a collection of Geometry.LinearRings. 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Geometry.Collection> 
+ *  - <OpenLayers.Geometry> 
+ */
+OpenLayers.Geometry.Polygon = OpenLayers.Class(
+  OpenLayers.Geometry.Collection, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of
+     * components that the collection can include.  A null value means the
+     * component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.LinearRing"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.Polygon
+     * Constructor for a Polygon geometry. 
+     * The first ring (this.component[0])is the outer bounds of the polygon and 
+     * all subsequent rings (this.component[1-n]) are internal holes.
+     *
+     *
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry.LinearRing>)} 
+     */
+    initialize: function(components) {
+        OpenLayers.Geometry.Collection.prototype.initialize.apply(this, 
+                                                                  arguments);
+    },
+    
+    /** 
+     * APIMethod: getArea
+     * Calculated by subtracting the areas of the internal holes from the 
+     *   area of the outer hole.
+     * 
+     * Returns:
+     * {float} The area of the geometry
+     */
+    getArea: function() {
+        var area = 0.0;
+        if ( this.components && (this.components.length > 0)) {
+            area += Math.abs(this.components[0].getArea());
+            for (var i=1, len=this.components.length; i<len; i++) {
+                area -= Math.abs(this.components[i].getArea());
+            }
+        }
+        return area;
+    },
+
+    /** 
+     * APIMethod: getGeodesicArea
+     * Calculate the approximate area of the polygon were it projected onto
+     *     the earth.
+     *
+     * Parameters:
+     * projection - {<OpenLayers.Projection>} The spatial reference system
+     *     for the geometry coordinates.  If not provided, Geographic/WGS84 is
+     *     assumed.
+     * 
+     * Reference:
+     * Robert. G. Chamberlain and William H. Duquette, "Some Algorithms for
+     *     Polygons on a Sphere", JPL Publication 07-03, Jet Propulsion
+     *     Laboratory, Pasadena, CA, June 2007 http://trs-new.jpl.nasa.gov/dspace/handle/2014/40409
+     *
+     * Returns:
+     * {float} The approximate geodesic area of the polygon in square meters.
+     */
+    getGeodesicArea: function(projection) {
+        var area = 0.0;
+        if(this.components && (this.components.length > 0)) {
+            area += Math.abs(this.components[0].getGeodesicArea(projection));
+            for(var i=1, len=this.components.length; i<len; i++) {
+                area -= Math.abs(this.components[i].getGeodesicArea(projection));
+            }
+        }
+        return area;
+    },
+
+    /**
+     * Method: containsPoint
+     * Test if a point is inside a polygon.  Points on a polygon edge are
+     *     considered inside.
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>}
+     *
+     * Returns:
+     * {Boolean | Number} The point is inside the polygon.  Returns 1 if the
+     *     point is on an edge.  Returns boolean otherwise.
+     */
+    containsPoint: function(point) {
+        var numRings = this.components.length;
+        var contained = false;
+        if(numRings > 0) {
+            // check exterior ring - 1 means on edge, boolean otherwise
+            contained = this.components[0].containsPoint(point);
+            if(contained !== 1) {
+                if(contained && numRings > 1) {
+                    // check interior rings
+                    var hole;
+                    for(var i=1; i<numRings; ++i) {
+                        hole = this.components[i].containsPoint(point);
+                        if(hole) {
+                            if(hole === 1) {
+                                // on edge
+                                contained = 1;
+                            } else {
+                                // in hole
+                                contained = false;
+                            }                            
+                            break;
+                        }
+                    }
+                }
+            }
+        }
+        return contained;
+    },
+
+    /**
+     * APIMethod: intersects
+     * Determine if the input geometry intersects this one.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} Any type of geometry.
+     *
+     * Returns:
+     * {Boolean} The input geometry intersects this one.
+     */
+    intersects: function(geometry) {
+        var intersect = false;
+        var i, len;
+        if(geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+            intersect = this.containsPoint(geometry);
+        } else if(geometry.CLASS_NAME == "OpenLayers.Geometry.LineString" ||
+                  geometry.CLASS_NAME == "OpenLayers.Geometry.LinearRing") {
+            // check if rings/linestrings intersect
+            for(i=0, len=this.components.length; i<len; ++i) {
+                intersect = geometry.intersects(this.components[i]);
+                if(intersect) {
+                    break;
+                }
+            }
+            if(!intersect) {
+                // check if this poly contains points of the ring/linestring
+                for(i=0, len=geometry.components.length; i<len; ++i) {
+                    intersect = this.containsPoint(geometry.components[i]);
+                    if(intersect) {
+                        break;
+                    }
+                }
+            }
+        } else {
+            for(i=0, len=geometry.components.length; i<len; ++ i) {
+                intersect = this.intersects(geometry.components[i]);
+                if(intersect) {
+                    break;
+                }
+            }
+        }
+        // check case where this poly is wholly contained by another
+        if(!intersect && geometry.CLASS_NAME == "OpenLayers.Geometry.Polygon") {
+            // exterior ring points will be contained in the other geometry
+            var ring = this.components[0];
+            for(i=0, len=ring.components.length; i<len; ++i) {
+                intersect = geometry.containsPoint(ring.components[i]);
+                if(intersect) {
+                    break;
+                }
+            }
+        }
+        return intersect;
+    },
+
+    /**
+     * APIMethod: distanceTo
+     * Calculate the closest distance between two geometries (on the x-y plane).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Optional properties for configuring the distance
+     *     calculation.
+     *
+     * Valid options:
+     * details - {Boolean} Return details from the distance calculation.
+     *     Default is false.
+     * edge - {Boolean} Calculate the distance from this geometry to the
+     *     nearest edge of the target geometry.  Default is true.  If true,
+     *     calling distanceTo from a geometry that is wholly contained within
+     *     the target will result in a non-zero distance.  If false, whenever
+     *     geometries intersect, calling distanceTo will return 0.  If false,
+     *     details cannot be returned.
+     *
+     * Returns:
+     * {Number | Object} The distance between this geometry and the target.
+     *     If details is true, the return will be an object with distance,
+     *     x0, y0, x1, and y1 properties.  The x0 and y0 properties represent
+     *     the coordinates of the closest point on this geometry. The x1 and y1
+     *     properties represent the coordinates of the closest point on the
+     *     target geometry.
+     */
+    distanceTo: function(geometry, options) {
+        var edge = !(options && options.edge === false);
+        var result;
+        // this is the case where we might not be looking for distance to edge
+        if(!edge && this.intersects(geometry)) {
+            result = 0;
+        } else {
+            result = OpenLayers.Geometry.Collection.prototype.distanceTo.apply(
+                this, [geometry, options]
+            );
+        }
+        return result;
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.Polygon"
+});
+
+/**
+ * APIMethod: createRegularPolygon
+ * Create a regular polygon around a radius. Useful for creating circles 
+ * and the like.
+ *
+ * Parameters:
+ * origin - {<OpenLayers.Geometry.Point>} center of polygon.
+ * radius - {Float} distance to vertex, in map units.
+ * sides - {Integer} Number of sides. 20 approximates a circle.
+ * rotation - {Float} original angle of rotation, in degrees.
+ */
+OpenLayers.Geometry.Polygon.createRegularPolygon = function(origin, radius, sides, rotation) {  
+    var angle = Math.PI * ((1/sides) - (1/2));
+    if(rotation) {
+        angle += (rotation / 180) * Math.PI;
+    }
+    var rotatedAngle, x, y;
+    var points = [];
+    for(var i=0; i<sides; ++i) {
+        rotatedAngle = angle + (i * 2 * Math.PI / sides);
+        x = origin.x + (radius * Math.cos(rotatedAngle));
+        y = origin.y + (radius * Math.sin(rotatedAngle));
+        points.push(new OpenLayers.Geometry.Point(x, y));
+    }
+    var ring = new OpenLayers.Geometry.LinearRing(points);
+    return new OpenLayers.Geometry.Polygon([ring]);
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Surface.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Surface.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Surface.js	(revision 76)
@@ -0,0 +1,17 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry.js
+ */
+
+OpenLayers.Geometry.Surface = OpenLayers.Class(OpenLayers.Geometry, {
+
+    initialize: function() {
+        OpenLayers.Geometry.prototype.initialize.apply(this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.Surface"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiLineString.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiLineString.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiLineString.js	(revision 76)
@@ -0,0 +1,262 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/Collection.js
+ * @requires OpenLayers/Geometry/LineString.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.MultiLineString
+ * A MultiLineString is a geometry with multiple <OpenLayers.Geometry.LineString>
+ * components.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Geometry.Collection>
+ *  - <OpenLayers.Geometry> 
+ */
+OpenLayers.Geometry.MultiLineString = OpenLayers.Class(
+  OpenLayers.Geometry.Collection, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of
+     * components that the collection can include.  A null value means the
+     * component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.LineString"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.MultiLineString
+     * Constructor for a MultiLineString Geometry.
+     *
+     * Parameters: 
+     * components - {Array(<OpenLayers.Geometry.LineString>)} 
+     *
+     */
+    initialize: function(components) {
+        OpenLayers.Geometry.Collection.prototype.initialize.apply(this, 
+                                                                  arguments);        
+    },
+    
+    /**
+     * Method: split
+     * Use this geometry (the source) to attempt to split a target geometry.
+     * 
+     * Parameters:
+     * target - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Properties of this object will be used to determine
+     *     how the split is conducted.
+     *
+     * Valid options:
+     * mutual - {Boolean} Split the source geometry in addition to the target
+     *     geometry.  Default is false.
+     * edge - {Boolean} Allow splitting when only edges intersect.  Default is
+     *     true.  If false, a vertex on the source must be within the tolerance
+     *     distance of the intersection to be considered a split.
+     * tolerance - {Number} If a non-null value is provided, intersections
+     *     within the tolerance distance of an existing vertex on the source
+     *     will be assumed to occur at the vertex.
+     * 
+     * Returns:
+     * {Array} A list of geometries (of this same type as the target) that
+     *     result from splitting the target with the source geometry.  The
+     *     source and target geometry will remain unmodified.  If no split
+     *     results, null will be returned.  If mutual is true and a split
+     *     results, return will be an array of two arrays - the first will be
+     *     all geometries that result from splitting the source geometry and
+     *     the second will be all geometries that result from splitting the
+     *     target geometry.
+     */
+    split: function(geometry, options) {
+        var results = null;
+        var mutual = options && options.mutual;
+        var splits, sourceLine, sourceLines, sourceSplit, targetSplit;
+        var sourceParts = [];
+        var targetParts = [geometry];
+        for(var i=0, len=this.components.length; i<len; ++i) {
+            sourceLine = this.components[i];
+            sourceSplit = false;
+            for(var j=0; j < targetParts.length; ++j) { 
+                splits = sourceLine.split(targetParts[j], options);
+                if(splits) {
+                    if(mutual) {
+                        sourceLines = splits[0];
+                        for(var k=0, klen=sourceLines.length; k<klen; ++k) {
+                            if(k===0 && sourceParts.length) {
+                                sourceParts[sourceParts.length-1].addComponent(
+                                    sourceLines[k]
+                                );
+                            } else {
+                                sourceParts.push(
+                                    new OpenLayers.Geometry.MultiLineString([
+                                        sourceLines[k]
+                                    ])
+                                );
+                            }
+                        }
+                        sourceSplit = true;
+                        splits = splits[1];
+                    }
+                    if(splits.length) {
+                        // splice in new target parts
+                        splits.unshift(j, 1);
+                        Array.prototype.splice.apply(targetParts, splits);
+                        break;
+                    }
+                }
+            }
+            if(!sourceSplit) {
+                // source line was not hit
+                if(sourceParts.length) {
+                    // add line to existing multi
+                    sourceParts[sourceParts.length-1].addComponent(
+                        sourceLine.clone()
+                    );
+                } else {
+                    // create a fresh multi
+                    sourceParts = [
+                        new OpenLayers.Geometry.MultiLineString(
+                            sourceLine.clone()
+                        )
+                    ];
+                }
+            }
+        }
+        if(sourceParts && sourceParts.length > 1) {
+            sourceSplit = true;
+        } else {
+            sourceParts = [];
+        }
+        if(targetParts && targetParts.length > 1) {
+            targetSplit = true;
+        } else {
+            targetParts = [];
+        }
+        if(sourceSplit || targetSplit) {
+            if(mutual) {
+                results = [sourceParts, targetParts];
+            } else {
+                results = targetParts;
+            }
+        }
+        return results;
+    },
+    
+    /**
+     * Method: splitWith
+     * Split this geometry (the target) with the given geometry (the source).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} A geometry used to split this
+     *     geometry (the source).
+     * options - {Object} Properties of this object will be used to determine
+     *     how the split is conducted.
+     *
+     * Valid options:
+     * mutual - {Boolean} Split the source geometry in addition to the target
+     *     geometry.  Default is false.
+     * edge - {Boolean} Allow splitting when only edges intersect.  Default is
+     *     true.  If false, a vertex on the source must be within the tolerance
+     *     distance of the intersection to be considered a split.
+     * tolerance - {Number} If a non-null value is provided, intersections
+     *     within the tolerance distance of an existing vertex on the source
+     *     will be assumed to occur at the vertex.
+     * 
+     * Returns:
+     * {Array} A list of geometries (of this same type as the target) that
+     *     result from splitting the target with the source geometry.  The
+     *     source and target geometry will remain unmodified.  If no split
+     *     results, null will be returned.  If mutual is true and a split
+     *     results, return will be an array of two arrays - the first will be
+     *     all geometries that result from splitting the source geometry and
+     *     the second will be all geometries that result from splitting the
+     *     target geometry.
+     */
+    splitWith: function(geometry, options) {
+        var results = null;
+        var mutual = options && options.mutual;
+        var splits, targetLine, sourceLines, sourceSplit, targetSplit, sourceParts, targetParts;
+        if(geometry instanceof OpenLayers.Geometry.LineString) {
+            targetParts = [];
+            sourceParts = [geometry];
+            for(var i=0, len=this.components.length; i<len; ++i) {
+                targetSplit = false;
+                targetLine = this.components[i];
+                for(var j=0; j<sourceParts.length; ++j) {
+                    splits = sourceParts[j].split(targetLine, options);
+                    if(splits) {
+                        if(mutual) {
+                            sourceLines = splits[0];
+                            if(sourceLines.length) {
+                                // splice in new source parts
+                                sourceLines.unshift(j, 1);
+                                Array.prototype.splice.apply(sourceParts, sourceLines);
+                                j += sourceLines.length - 2;
+                            }
+                            splits = splits[1];
+                            if(splits.length === 0) {
+                                splits = [targetLine.clone()];
+                            }
+                        }
+                        for(var k=0, klen=splits.length; k<klen; ++k) {
+                            if(k===0 && targetParts.length) {
+                                targetParts[targetParts.length-1].addComponent(
+                                    splits[k]
+                                );
+                            } else {
+                                targetParts.push(
+                                    new OpenLayers.Geometry.MultiLineString([
+                                        splits[k]
+                                    ])
+                                );
+                            }
+                        }
+                        targetSplit = true;                    
+                    }
+                }
+                if(!targetSplit) {
+                    // target component was not hit
+                    if(targetParts.length) {
+                        // add it to any existing multi-line
+                        targetParts[targetParts.length-1].addComponent(
+                            targetLine.clone()
+                        );
+                    } else {
+                        // or start with a fresh multi-line
+                        targetParts = [
+                            new OpenLayers.Geometry.MultiLineString([
+                                targetLine.clone()
+                            ])
+                        ];
+                    }
+                    
+                }
+            }
+        } else {
+            results = geometry.split(this);
+        }
+        if(sourceParts && sourceParts.length > 1) {
+            sourceSplit = true;
+        } else {
+            sourceParts = [];
+        }
+        if(targetParts && targetParts.length > 1) {
+            targetSplit = true;
+        } else {
+            targetParts = [];
+        }
+        if(sourceSplit || targetSplit) {
+            if(mutual) {
+                results = [sourceParts, targetParts];
+            } else {
+                results = targetParts;
+            }
+        }
+        return results;
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.MultiLineString"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Point.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Point.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Point.js	(revision 76)
@@ -0,0 +1,283 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.Point
+ * Point geometry class. 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Geometry> 
+ */
+OpenLayers.Geometry.Point = OpenLayers.Class(OpenLayers.Geometry, {
+
+    /** 
+     * APIProperty: x 
+     * {float} 
+     */
+    x: null,
+
+    /** 
+     * APIProperty: y 
+     * {float} 
+     */
+    y: null,
+
+    /**
+     * Constructor: OpenLayers.Geometry.Point
+     * Construct a point geometry.
+     *
+     * Parameters:
+     * x - {float} 
+     * y - {float}
+     * 
+     */
+    initialize: function(x, y) {
+        OpenLayers.Geometry.prototype.initialize.apply(this, arguments);
+        
+        this.x = parseFloat(x);
+        this.y = parseFloat(y);
+    },
+
+    /**
+     * APIMethod: clone
+     * 
+     * Returns:
+     * {<OpenLayers.Geometry.Point>} An exact clone of this OpenLayers.Geometry.Point
+     */
+    clone: function(obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Geometry.Point(this.x, this.y);
+        }
+
+        // catch any randomly tagged-on properties
+        OpenLayers.Util.applyDefaults(obj, this);
+
+        return obj;
+    },
+
+    /** 
+     * Method: calculateBounds
+     * Create a new Bounds based on the lon/lat
+     */
+    calculateBounds: function () {
+        this.bounds = new OpenLayers.Bounds(this.x, this.y,
+                                            this.x, this.y);
+    },
+
+    /**
+     * APIMethod: distanceTo
+     * Calculate the closest distance between two geometries (on the x-y plane).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Optional properties for configuring the distance
+     *     calculation.
+     *
+     * Valid options:
+     * details - {Boolean} Return details from the distance calculation.
+     *     Default is false.
+     * edge - {Boolean} Calculate the distance from this geometry to the
+     *     nearest edge of the target geometry.  Default is true.  If true,
+     *     calling distanceTo from a geometry that is wholly contained within
+     *     the target will result in a non-zero distance.  If false, whenever
+     *     geometries intersect, calling distanceTo will return 0.  If false,
+     *     details cannot be returned.
+     *
+     * Returns:
+     * {Number | Object} The distance between this geometry and the target.
+     *     If details is true, the return will be an object with distance,
+     *     x0, y0, x1, and x2 properties.  The x0 and y0 properties represent
+     *     the coordinates of the closest point on this geometry. The x1 and y1
+     *     properties represent the coordinates of the closest point on the
+     *     target geometry.
+     */
+    distanceTo: function(geometry, options) {
+        var edge = !(options && options.edge === false);
+        var details = edge && options && options.details;
+        var distance, x0, y0, x1, y1, result;
+        if(geometry instanceof OpenLayers.Geometry.Point) {
+            x0 = this.x;
+            y0 = this.y;
+            x1 = geometry.x;
+            y1 = geometry.y;
+            distance = Math.sqrt(Math.pow(x0 - x1, 2) + Math.pow(y0 - y1, 2));
+            result = !details ?
+                distance : {x0: x0, y0: y0, x1: x1, y1: y1, distance: distance};
+        } else {
+            result = geometry.distanceTo(this, options);
+            if(details) {
+                // switch coord order since this geom is target
+                result = {
+                    x0: result.x1, y0: result.y1,
+                    x1: result.x0, y1: result.y0,
+                    distance: result.distance
+                };
+            }
+        }
+        return result;
+    },
+    
+    /** 
+     * APIMethod: equals
+     * Determine whether another geometry is equivalent to this one.  Geometries
+     *     are considered equivalent if all components have the same coordinates.
+     * 
+     * Parameters:
+     * geom - {<OpenLayers.Geometry.Point>} The geometry to test. 
+     *
+     * Returns:
+     * {Boolean} The supplied geometry is equivalent to this geometry.
+     */
+    equals: function(geom) {
+        var equals = false;
+        if (geom != null) {
+            equals = ((this.x == geom.x && this.y == geom.y) ||
+                      (isNaN(this.x) && isNaN(this.y) && isNaN(geom.x) && isNaN(geom.y)));
+        }
+        return equals;
+    },
+    
+    /**
+     * Method: toShortString
+     *
+     * Returns:
+     * {String} Shortened String representation of Point object. 
+     *         (ex. <i>"5, 42"</i>)
+     */
+    toShortString: function() {
+        return (this.x + ", " + this.y);
+    },
+    
+    /**
+     * APIMethod: move
+     * Moves a geometry by the given displacement along positive x and y axes.
+     *     This modifies the position of the geometry and clears the cached
+     *     bounds.
+     *
+     * Parameters:
+     * x - {Float} Distance to move geometry in positive x direction. 
+     * y - {Float} Distance to move geometry in positive y direction.
+     */
+    move: function(x, y) {
+        this.x = this.x + x;
+        this.y = this.y + y;
+        this.clearBounds();
+    },
+
+    /**
+     * APIMethod: rotate
+     * Rotate a point around another.
+     *
+     * Parameters:
+     * angle - {Float} Rotation angle in degrees (measured counterclockwise
+     *                 from the positive x-axis)
+     * origin - {<OpenLayers.Geometry.Point>} Center point for the rotation
+     */
+    rotate: function(angle, origin) {
+        angle *= Math.PI / 180;
+        var radius = this.distanceTo(origin);
+        var theta = angle + Math.atan2(this.y - origin.y, this.x - origin.x);
+        this.x = origin.x + (radius * Math.cos(theta));
+        this.y = origin.y + (radius * Math.sin(theta));
+        this.clearBounds();
+    },
+    
+    /**
+     * APIMethod: getCentroid
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Point>} The centroid of the collection
+     */
+    getCentroid: function() {
+        return new OpenLayers.Geometry.Point(this.x, this.y);
+    },
+
+    /**
+     * APIMethod: resize
+     * Resize a point relative to some origin.  For points, this has the effect
+     *     of scaling a vector (from the origin to the point).  This method is
+     *     more useful on geometry collection subclasses.
+     *
+     * Parameters:
+     * scale - {Float} Ratio of the new distance from the origin to the old
+     *                 distance from the origin.  A scale of 2 doubles the
+     *                 distance between the point and origin.
+     * origin - {<OpenLayers.Geometry.Point>} Point of origin for resizing
+     * ratio - {Float} Optional x:y ratio for resizing.  Default ratio is 1.
+     * 
+     * Returns:
+     * {OpenLayers.Geometry} - The current geometry. 
+     */
+    resize: function(scale, origin, ratio) {
+        ratio = (ratio == undefined) ? 1 : ratio;
+        this.x = origin.x + (scale * ratio * (this.x - origin.x));
+        this.y = origin.y + (scale * (this.y - origin.y));
+        this.clearBounds();
+        return this;
+    },
+    
+    /**
+     * APIMethod: intersects
+     * Determine if the input geometry intersects this one.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} Any type of geometry.
+     *
+     * Returns:
+     * {Boolean} The input geometry intersects this one.
+     */
+    intersects: function(geometry) {
+        var intersect = false;
+        if(geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+            intersect = this.equals(geometry);
+        } else {
+            intersect = geometry.intersects(this);
+        }
+        return intersect;
+    },
+    
+    /**
+     * APIMethod: transform
+     * Translate the x,y properties of the point from source to dest.
+     * 
+     * Parameters:
+     * source - {<OpenLayers.Projection>} 
+     * dest - {<OpenLayers.Projection>}
+     * 
+     * Returns:
+     * {<OpenLayers.Geometry>} 
+     */
+    transform: function(source, dest) {
+        if ((source && dest)) {
+            OpenLayers.Projection.transform(
+                this, source, dest); 
+            this.bounds = null;
+        }       
+        return this;
+    },
+
+    /**
+     * APIMethod: getVertices
+     * Return a list of all points in this geometry.
+     *
+     * Parameters:
+     * nodes - {Boolean} For lines, only return vertices that are
+     *     endpoints.  If false, for lines, only vertices that are not
+     *     endpoints will be returned.  If not provided, all vertices will
+     *     be returned.
+     *
+     * Returns:
+     * {Array} A list of all vertices in the geometry.
+     */
+    getVertices: function(nodes) {
+        return [this];
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.Point"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LinearRing.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LinearRing.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LinearRing.js	(revision 76)
@@ -0,0 +1,417 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/LineString.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.LinearRing
+ * 
+ * A Linear Ring is a special LineString which is closed. It closes itself 
+ * automatically on every addPoint/removePoint by adding a copy of the first
+ * point as the last point. 
+ * 
+ * Also, as it is the first in the line family to close itself, a getArea()
+ * function is defined to calculate the enclosed area of the linearRing
+ * 
+ * Inherits:
+ *  - <OpenLayers.Geometry.LineString>
+ */
+OpenLayers.Geometry.LinearRing = OpenLayers.Class(
+  OpenLayers.Geometry.LineString, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of 
+     *                 components that the collection can include.  A null 
+     *                 value means the component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.Point"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.LinearRing
+     * Linear rings are constructed with an array of points.  This array
+     *     can represent a closed or open ring.  If the ring is open (the last
+     *     point does not equal the first point), the constructor will close
+     *     the ring.  If the ring is already closed (the last point does equal
+     *     the first point), it will be left closed.
+     * 
+     * Parameters:
+     * points - {Array(<OpenLayers.Geometry.Point>)} points
+     */
+    initialize: function(points) {
+        OpenLayers.Geometry.LineString.prototype.initialize.apply(this, 
+                                                                  arguments);
+    },
+
+    /**
+     * APIMethod: addComponent
+     * Adds a point to geometry components.  If the point is to be added to
+     *     the end of the components array and it is the same as the last point
+     *     already in that array, the duplicate point is not added.  This has 
+     *     the effect of closing the ring if it is not already closed, and 
+     *     doing the right thing if it is already closed.  This behavior can 
+     *     be overridden by calling the method with a non-null index as the 
+     *     second argument.
+     *
+     * Parameter:
+     * point - {<OpenLayers.Geometry.Point>}
+     * index - {Integer} Index into the array to insert the component
+     * 
+     * Returns:
+     * {Boolean} Was the Point successfully added?
+     */
+    addComponent: function(point, index) {
+        var added = false;
+
+        //remove last point
+        var lastPoint = this.components.pop();
+
+        // given an index, add the point
+        // without an index only add non-duplicate points
+        if(index != null || !point.equals(lastPoint)) {
+            added = OpenLayers.Geometry.Collection.prototype.addComponent.apply(this, 
+                                                                    arguments);
+        }
+
+        //append copy of first point
+        var firstPoint = this.components[0];
+        OpenLayers.Geometry.Collection.prototype.addComponent.apply(this, 
+                                                                [firstPoint]);
+        
+        return added;
+    },
+    
+    /**
+     * APIMethod: removeComponent
+     * Removes a point from geometry components.
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>}
+     */
+    removeComponent: function(point) {
+        if (this.components.length > 4) {
+
+            //remove last point
+            this.components.pop();
+            
+            //remove our point
+            OpenLayers.Geometry.Collection.prototype.removeComponent.apply(this, 
+                                                                    arguments);
+            //append copy of first point
+            var firstPoint = this.components[0];
+            OpenLayers.Geometry.Collection.prototype.addComponent.apply(this, 
+                                                                [firstPoint]);
+        }
+    },
+    
+    /**
+     * APIMethod: move
+     * Moves a geometry by the given displacement along positive x and y axes.
+     *     This modifies the position of the geometry and clears the cached
+     *     bounds.
+     *
+     * Parameters:
+     * x - {Float} Distance to move geometry in positive x direction. 
+     * y - {Float} Distance to move geometry in positive y direction.
+     */
+    move: function(x, y) {
+        for(var i = 0, len=this.components.length; i<len - 1; i++) {
+            this.components[i].move(x, y);
+        }
+    },
+
+    /**
+     * APIMethod: rotate
+     * Rotate a geometry around some origin
+     *
+     * Parameters:
+     * angle - {Float} Rotation angle in degrees (measured counterclockwise
+     *                 from the positive x-axis)
+     * origin - {<OpenLayers.Geometry.Point>} Center point for the rotation
+     */
+    rotate: function(angle, origin) {
+        for(var i=0, len=this.components.length; i<len - 1; ++i) {
+            this.components[i].rotate(angle, origin);
+        }
+    },
+
+    /**
+     * APIMethod: resize
+     * Resize a geometry relative to some origin.  Use this method to apply
+     *     a uniform scaling to a geometry.
+     *
+     * Parameters:
+     * scale - {Float} Factor by which to scale the geometry.  A scale of 2
+     *                 doubles the size of the geometry in each dimension
+     *                 (lines, for example, will be twice as long, and polygons
+     *                 will have four times the area).
+     * origin - {<OpenLayers.Geometry.Point>} Point of origin for resizing
+     * ratio - {Float} Optional x:y ratio for resizing.  Default ratio is 1.
+     * 
+     * Returns:
+     * {OpenLayers.Geometry} - The current geometry. 
+     */
+    resize: function(scale, origin, ratio) {
+        for(var i=0, len=this.components.length; i<len - 1; ++i) {
+            this.components[i].resize(scale, origin, ratio);
+        }
+        return this;
+    },
+    
+    /**
+     * APIMethod: transform
+     * Reproject the components geometry from source to dest.
+     *
+     * Parameters:
+     * source - {<OpenLayers.Projection>}
+     * dest - {<OpenLayers.Projection>}
+     * 
+     * Returns:
+     * {<OpenLayers.Geometry>} 
+     */
+    transform: function(source, dest) {
+        if (source && dest) {
+            for (var i=0, len=this.components.length; i<len - 1; i++) {
+                var component = this.components[i];
+                component.transform(source, dest);
+            }
+            this.bounds = null;
+        }
+        return this;
+    },
+    
+    /**
+     * APIMethod: getCentroid
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Point>} The centroid of the collection
+     */
+    getCentroid: function() {
+        if (this.components && (this.components.length > 2)) {
+            var sumX = 0.0;
+            var sumY = 0.0;
+            for (var i = 0; i < this.components.length - 1; i++) {
+                var b = this.components[i];
+                var c = this.components[i+1];
+                sumX += (b.x + c.x) * (b.x * c.y - c.x * b.y);
+                sumY += (b.y + c.y) * (b.x * c.y - c.x * b.y);
+            }
+            var area = -1 * this.getArea();
+            var x = sumX / (6 * area);
+            var y = sumY / (6 * area);
+            return new OpenLayers.Geometry.Point(x, y);
+        } else {
+            return null;
+        }
+    },
+
+    /**
+     * APIMethod: getArea
+     * Note - The area is positive if the ring is oriented CW, otherwise
+     *         it will be negative.
+     * 
+     * Returns:
+     * {Float} The signed area for a ring.
+     */
+    getArea: function() {
+        var area = 0.0;
+        if ( this.components && (this.components.length > 2)) {
+            var sum = 0.0;
+            for (var i=0, len=this.components.length; i<len - 1; i++) {
+                var b = this.components[i];
+                var c = this.components[i+1];
+                sum += (b.x + c.x) * (c.y - b.y);
+            }
+            area = - sum / 2.0;
+        }
+        return area;
+    },
+    
+    /**
+     * APIMethod: getGeodesicArea
+     * Calculate the approximate area of the polygon were it projected onto
+     *     the earth.  Note that this area will be positive if ring is oriented
+     *     clockwise, otherwise it will be negative.
+     *
+     * Parameters:
+     * projection - {<OpenLayers.Projection>} The spatial reference system
+     *     for the geometry coordinates.  If not provided, Geographic/WGS84 is
+     *     assumed.
+     * 
+     * Reference:
+     * Robert. G. Chamberlain and William H. Duquette, "Some Algorithms for
+     *     Polygons on a Sphere", JPL Publication 07-03, Jet Propulsion
+     *     Laboratory, Pasadena, CA, June 2007 http://trs-new.jpl.nasa.gov/dspace/handle/2014/40409
+     *
+     * Returns:
+     * {float} The approximate signed geodesic area of the polygon in square
+     *     meters.
+     */
+    getGeodesicArea: function(projection) {
+        var ring = this;  // so we can work with a clone if needed
+        if(projection) {
+            var gg = new OpenLayers.Projection("EPSG:4326");
+            if(!gg.equals(projection)) {
+                ring = this.clone().transform(projection, gg);
+            }
+        }
+        var area = 0.0;
+        var len = ring.components && ring.components.length;
+        if(len > 2) {
+            var p1, p2;
+            for(var i=0; i<len-1; i++) {
+                p1 = ring.components[i];
+                p2 = ring.components[i+1];
+                area += OpenLayers.Util.rad(p2.x - p1.x) *
+                        (2 + Math.sin(OpenLayers.Util.rad(p1.y)) +
+                        Math.sin(OpenLayers.Util.rad(p2.y)));
+            }
+            area = area * 6378137.0 * 6378137.0 / 2.0;
+        }
+        return area;
+    },
+    
+    /**
+     * Method: containsPoint
+     * Test if a point is inside a linear ring.  For the case where a point
+     *     is coincident with a linear ring edge, returns 1.  Otherwise,
+     *     returns boolean.
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>}
+     *
+     * Returns:
+     * {Boolean | Number} The point is inside the linear ring.  Returns 1 if
+     *     the point is coincident with an edge.  Returns boolean otherwise.
+     */
+    containsPoint: function(point) {
+        var approx = OpenLayers.Number.limitSigDigs;
+        var digs = 14;
+        var px = approx(point.x, digs);
+        var py = approx(point.y, digs);
+        function getX(y, x1, y1, x2, y2) {
+            return (((x1 - x2) * y) + ((x2 * y1) - (x1 * y2))) / (y1 - y2);
+        }
+        var numSeg = this.components.length - 1;
+        var start, end, x1, y1, x2, y2, cx, cy;
+        var crosses = 0;
+        for(var i=0; i<numSeg; ++i) {
+            start = this.components[i];
+            x1 = approx(start.x, digs);
+            y1 = approx(start.y, digs);
+            end = this.components[i + 1];
+            x2 = approx(end.x, digs);
+            y2 = approx(end.y, digs);
+            
+            /**
+             * The following conditions enforce five edge-crossing rules:
+             *    1. points coincident with edges are considered contained;
+             *    2. an upward edge includes its starting endpoint, and
+             *    excludes its final endpoint;
+             *    3. a downward edge excludes its starting endpoint, and
+             *    includes its final endpoint;
+             *    4. horizontal edges are excluded; and
+             *    5. the edge-ray intersection point must be strictly right
+             *    of the point P.
+             */
+            if(y1 == y2) {
+                // horizontal edge
+                if(py == y1) {
+                    // point on horizontal line
+                    if(x1 <= x2 && (px >= x1 && px <= x2) || // right or vert
+                       x1 >= x2 && (px <= x1 && px >= x2)) { // left or vert
+                        // point on edge
+                        crosses = -1;
+                        break;
+                    }
+                }
+                // ignore other horizontal edges
+                continue;
+            }
+            cx = approx(getX(py, x1, y1, x2, y2), digs);
+            if(cx == px) {
+                // point on line
+                if(y1 < y2 && (py >= y1 && py <= y2) || // upward
+                   y1 > y2 && (py <= y1 && py >= y2)) { // downward
+                    // point on edge
+                    crosses = -1;
+                    break;
+                }
+            }
+            if(cx <= px) {
+                // no crossing to the right
+                continue;
+            }
+            if(x1 != x2 && (cx < Math.min(x1, x2) || cx > Math.max(x1, x2))) {
+                // no crossing
+                continue;
+            }
+            if(y1 < y2 && (py >= y1 && py < y2) || // upward
+               y1 > y2 && (py < y1 && py >= y2)) { // downward
+                ++crosses;
+            }
+        }
+        var contained = (crosses == -1) ?
+            // on edge
+            1 :
+            // even (out) or odd (in)
+            !!(crosses & 1);
+
+        return contained;
+    },
+
+    /**
+     * APIMethod: intersects
+     * Determine if the input geometry intersects this one.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} Any type of geometry.
+     *
+     * Returns:
+     * {Boolean} The input geometry intersects this one.
+     */
+    intersects: function(geometry) {
+        var intersect = false;
+        if(geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+            intersect = this.containsPoint(geometry);
+        } else if(geometry.CLASS_NAME == "OpenLayers.Geometry.LineString") {
+            intersect = geometry.intersects(this);
+        } else if(geometry.CLASS_NAME == "OpenLayers.Geometry.LinearRing") {
+            intersect = OpenLayers.Geometry.LineString.prototype.intersects.apply(
+                this, [geometry]
+            );
+        } else {
+            // check for component intersections
+            for(var i=0, len=geometry.components.length; i<len; ++ i) {
+                intersect = geometry.components[i].intersects(this);
+                if(intersect) {
+                    break;
+                }
+            }
+        }
+        return intersect;
+    },
+
+    /**
+     * APIMethod: getVertices
+     * Return a list of all points in this geometry.
+     *
+     * Parameters:
+     * nodes - {Boolean} For lines, only return vertices that are
+     *     endpoints.  If false, for lines, only vertices that are not
+     *     endpoints will be returned.  If not provided, all vertices will
+     *     be returned.
+     *
+     * Returns:
+     * {Array} A list of all vertices in the geometry.
+     */
+    getVertices: function(nodes) {
+        return (nodes === true) ? [] : this.components.slice(0, this.components.length-1);
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.LinearRing"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Collection.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Collection.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/Collection.js	(revision 76)
@@ -0,0 +1,546 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.Collection
+ * A Collection is exactly what it sounds like: A collection of different 
+ * Geometries. These are stored in the local parameter <components> (which
+ * can be passed as a parameter to the constructor). 
+ * 
+ * As new geometries are added to the collection, they are NOT cloned. 
+ * When removing geometries, they need to be specified by reference (ie you 
+ * have to pass in the *exact* geometry to be removed).
+ * 
+ * The <getArea> and <getLength> functions here merely iterate through
+ * the components, summing their respective areas and lengths.
+ *
+ * Create a new instance with the <OpenLayers.Geometry.Collection> constructor.
+ *
+ * Inerhits from:
+ *  - <OpenLayers.Geometry> 
+ */
+OpenLayers.Geometry.Collection = OpenLayers.Class(OpenLayers.Geometry, {
+
+    /**
+     * APIProperty: components
+     * {Array(<OpenLayers.Geometry>)} The component parts of this geometry
+     */
+    components: null,
+    
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of
+     * components that the collection can include.  A null value means the
+     * component types are not restricted.
+     */
+    componentTypes: null,
+
+    /**
+     * Constructor: OpenLayers.Geometry.Collection
+     * Creates a Geometry Collection -- a list of geoms.
+     *
+     * Parameters: 
+     * components - {Array(<OpenLayers.Geometry>)} Optional array of geometries
+     *
+     */
+    initialize: function (components) {
+        OpenLayers.Geometry.prototype.initialize.apply(this, arguments);
+        this.components = [];
+        if (components != null) {
+            this.addComponents(components);
+        }
+    },
+
+    /**
+     * APIMethod: destroy
+     * Destroy this geometry.
+     */
+    destroy: function () {
+        this.components.length = 0;
+        this.components = null;
+        OpenLayers.Geometry.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: clone
+     * Clone this geometry.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Collection>} An exact clone of this collection
+     */
+    clone: function() {
+        var geometry = eval("new " + this.CLASS_NAME + "()");
+        for(var i=0, len=this.components.length; i<len; i++) {
+            geometry.addComponent(this.components[i].clone());
+        }
+        
+        // catch any randomly tagged-on properties
+        OpenLayers.Util.applyDefaults(geometry, this);
+        
+        return geometry;
+    },
+
+    /**
+     * Method: getComponentsString
+     * Get a string representing the components for this collection
+     * 
+     * Returns:
+     * {String} A string representation of the components of this geometry
+     */
+    getComponentsString: function(){
+        var strings = [];
+        for(var i=0, len=this.components.length; i<len; i++) {
+            strings.push(this.components[i].toShortString()); 
+        }
+        return strings.join(",");
+    },
+
+    /**
+     * APIMethod: calculateBounds
+     * Recalculate the bounds by iterating through the components and 
+     * calling calling extendBounds() on each item.
+     */
+    calculateBounds: function() {
+        this.bounds = null;
+        if ( this.components && this.components.length > 0) {
+            this.setBounds(this.components[0].getBounds());
+            for (var i=1, len=this.components.length; i<len; i++) {
+                this.extendBounds(this.components[i].getBounds());
+            }
+        }
+    },
+
+    /**
+     * APIMethod: addComponents
+     * Add components to this geometry.
+     *
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry>)} An array of geometries to add
+     */
+    addComponents: function(components){
+        if(!(components instanceof Array)) {
+            components = [components];
+        }
+        for(var i=0, len=components.length; i<len; i++) {
+            this.addComponent(components[i]);
+        }
+    },
+
+    /**
+     * Method: addComponent
+     * Add a new component (geometry) to the collection.  If this.componentTypes
+     * is set, then the component class name must be in the componentTypes array.
+     *
+     * The bounds cache is reset.
+     * 
+     * Parameters:
+     * component - {<OpenLayers.Geometry>} A geometry to add
+     * index - {int} Optional index into the array to insert the component
+     *
+     * Returns:
+     * {Boolean} The component geometry was successfully added
+     */    
+    addComponent: function(component, index) {
+        var added = false;
+        if(component) {
+            if(this.componentTypes == null ||
+               (OpenLayers.Util.indexOf(this.componentTypes,
+                                        component.CLASS_NAME) > -1)) {
+
+                if(index != null && (index < this.components.length)) {
+                    var components1 = this.components.slice(0, index);
+                    var components2 = this.components.slice(index, 
+                                                           this.components.length);
+                    components1.push(component);
+                    this.components = components1.concat(components2);
+                } else {
+                    this.components.push(component);
+                }
+                component.parent = this;
+                this.clearBounds();
+                added = true;
+            }
+        }
+        return added;
+    },
+    
+    /**
+     * APIMethod: removeComponents
+     * Remove components from this geometry.
+     *
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry>)} The components to be removed
+     */
+    removeComponents: function(components) {
+        if(!(components instanceof Array)) {
+            components = [components];
+        }
+        for(var i=components.length-1; i>=0; --i) {
+            this.removeComponent(components[i]);
+        }
+    },
+    
+    /**
+     * Method: removeComponent
+     * Remove a component from this geometry.
+     *
+     * Parameters:
+     * component - {<OpenLayers.Geometry>} 
+     */
+    removeComponent: function(component) {
+        
+        OpenLayers.Util.removeItem(this.components, component);
+        
+        // clearBounds() so that it gets recalculated on the next call
+        // to this.getBounds();
+        this.clearBounds();
+    },
+
+    /**
+     * APIMethod: getLength
+     * Calculate the length of this geometry
+     *
+     * Returns:
+     * {Float} The length of the geometry
+     */
+    getLength: function() {
+        var length = 0.0;
+        for (var i=0, len=this.components.length; i<len; i++) {
+            length += this.components[i].getLength();
+        }
+        return length;
+    },
+    
+    /**
+     * APIMethod: getArea
+     * Calculate the area of this geometry. Note how this function is overridden
+     * in <OpenLayers.Geometry.Polygon>.
+     *
+     * Returns:
+     * {Float} The area of the collection by summing its parts
+     */
+    getArea: function() {
+        var area = 0.0;
+        for (var i=0, len=this.components.length; i<len; i++) {
+            area += this.components[i].getArea();
+        }
+        return area;
+    },
+
+    /** 
+     * APIMethod: getGeodesicArea
+     * Calculate the approximate area of the polygon were it projected onto
+     *     the earth.
+     *
+     * Parameters:
+     * projection - {<OpenLayers.Projection>} The spatial reference system
+     *     for the geometry coordinates.  If not provided, Geographic/WGS84 is
+     *     assumed.
+     * 
+     * Reference:
+     * Robert. G. Chamberlain and William H. Duquette, "Some Algorithms for
+     *     Polygons on a Sphere", JPL Publication 07-03, Jet Propulsion
+     *     Laboratory, Pasadena, CA, June 2007 http://trs-new.jpl.nasa.gov/dspace/handle/2014/40409
+     *
+     * Returns:
+     * {float} The approximate geodesic area of the geometry in square meters.
+     */
+    getGeodesicArea: function(projection) {
+        var area = 0.0;
+        for(var i=0, len=this.components.length; i<len; i++) {
+            area += this.components[i].getGeodesicArea(projection);
+        }
+        return area;
+    },
+    
+    /**
+     * APIMethod: getCentroid
+     *
+     * Compute the centroid for this geometry collection.
+     *
+     * Parameters:
+     * weighted - {Boolean} Perform the getCentroid computation recursively,
+     * returning an area weighted average of all geometries in this collection.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Point>} The centroid of the collection
+     */
+    getCentroid: function(weighted) {
+        if (!weighted) {
+            return this.components.length && this.components[0].getCentroid();
+        }
+        var len = this.components.length;
+        if (!len) {
+            return false;
+        }
+        
+        var areas = [];
+        var centroids = [];
+        var areaSum = 0;
+        var minArea = Number.MAX_VALUE;
+        var component;
+        for (var i=0; i<len; ++i) {
+            component = this.components[i];
+            var area = component.getArea();
+            var centroid = component.getCentroid(true);
+            if (isNaN(area) || isNaN(centroid.x) || isNaN(centroid.y)) {
+                continue;
+            }
+            areas.push(area);
+            areaSum += area;
+            minArea = (area < minArea && area > 0) ? area : minArea;
+            centroids.push(centroid);
+        }
+        len = areas.length;
+        if (areaSum === 0) {
+            // all the components in this collection have 0 area
+            // probably a collection of points -- weight all the points the same
+            for (var i=0; i<len; ++i) {
+                areas[i] = 1;
+            }
+            areaSum = areas.length;
+        } else {
+            // normalize all the areas where the smallest area will get
+            // a value of 1
+            for (var i=0; i<len; ++i) {
+                areas[i] /= minArea;
+            }
+            areaSum /= minArea;
+        }
+        
+        var xSum = 0, ySum = 0, centroid, area;
+        for (var i=0; i<len; ++i) {
+            centroid = centroids[i];
+            area = areas[i];
+            xSum += centroid.x * area;
+            ySum += centroid.y * area;
+        }
+        
+        return new OpenLayers.Geometry.Point(xSum/areaSum, ySum/areaSum);
+    },
+
+    /**
+     * APIMethod: getGeodesicLength
+     * Calculate the approximate length of the geometry were it projected onto
+     *     the earth.
+     *
+     * projection - {<OpenLayers.Projection>} The spatial reference system
+     *     for the geometry coordinates.  If not provided, Geographic/WGS84 is
+     *     assumed.
+     * 
+     * Returns:
+     * {Float} The appoximate geodesic length of the geometry in meters.
+     */
+    getGeodesicLength: function(projection) {
+        var length = 0.0;
+        for(var i=0, len=this.components.length; i<len; i++) {
+            length += this.components[i].getGeodesicLength(projection);
+        }
+        return length;
+    },
+
+    /**
+     * APIMethod: move
+     * Moves a geometry by the given displacement along positive x and y axes.
+     *     This modifies the position of the geometry and clears the cached
+     *     bounds.
+     *
+     * Parameters:
+     * x - {Float} Distance to move geometry in positive x direction. 
+     * y - {Float} Distance to move geometry in positive y direction.
+     */
+    move: function(x, y) {
+        for(var i=0, len=this.components.length; i<len; i++) {
+            this.components[i].move(x, y);
+        }
+    },
+
+    /**
+     * APIMethod: rotate
+     * Rotate a geometry around some origin
+     *
+     * Parameters:
+     * angle - {Float} Rotation angle in degrees (measured counterclockwise
+     *                 from the positive x-axis)
+     * origin - {<OpenLayers.Geometry.Point>} Center point for the rotation
+     */
+    rotate: function(angle, origin) {
+        for(var i=0, len=this.components.length; i<len; ++i) {
+            this.components[i].rotate(angle, origin);
+        }
+    },
+
+    /**
+     * APIMethod: resize
+     * Resize a geometry relative to some origin.  Use this method to apply
+     *     a uniform scaling to a geometry.
+     *
+     * Parameters:
+     * scale - {Float} Factor by which to scale the geometry.  A scale of 2
+     *                 doubles the size of the geometry in each dimension
+     *                 (lines, for example, will be twice as long, and polygons
+     *                 will have four times the area).
+     * origin - {<OpenLayers.Geometry.Point>} Point of origin for resizing
+     * ratio - {Float} Optional x:y ratio for resizing.  Default ratio is 1.
+     * 
+     * Returns:
+     * {OpenLayers.Geometry} - The current geometry. 
+     */
+    resize: function(scale, origin, ratio) {
+        for(var i=0; i<this.components.length; ++i) {
+            this.components[i].resize(scale, origin, ratio);
+        }
+        return this;
+    },
+
+    /**
+     * APIMethod: distanceTo
+     * Calculate the closest distance between two geometries (on the x-y plane).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Optional properties for configuring the distance
+     *     calculation.
+     *
+     * Valid options:
+     * details - {Boolean} Return details from the distance calculation.
+     *     Default is false.
+     * edge - {Boolean} Calculate the distance from this geometry to the
+     *     nearest edge of the target geometry.  Default is true.  If true,
+     *     calling distanceTo from a geometry that is wholly contained within
+     *     the target will result in a non-zero distance.  If false, whenever
+     *     geometries intersect, calling distanceTo will return 0.  If false,
+     *     details cannot be returned.
+     *
+     * Returns:
+     * {Number | Object} The distance between this geometry and the target.
+     *     If details is true, the return will be an object with distance,
+     *     x0, y0, x1, and y1 properties.  The x0 and y0 properties represent
+     *     the coordinates of the closest point on this geometry. The x1 and y1
+     *     properties represent the coordinates of the closest point on the
+     *     target geometry.
+     */
+    distanceTo: function(geometry, options) {
+        var edge = !(options && options.edge === false);
+        var details = edge && options && options.details;
+        var result, best, distance;
+        var min = Number.POSITIVE_INFINITY;
+        for(var i=0, len=this.components.length; i<len; ++i) {
+            result = this.components[i].distanceTo(geometry, options);
+            distance = details ? result.distance : result;
+            if(distance < min) {
+                min = distance;
+                best = result;
+                if(min == 0) {
+                    break;
+                }
+            }
+        }
+        return best;
+    },
+
+    /** 
+     * APIMethod: equals
+     * Determine whether another geometry is equivalent to this one.  Geometries
+     *     are considered equivalent if all components have the same coordinates.
+     * 
+     * Parameters:
+     * geom - {<OpenLayers.Geometry>} The geometry to test. 
+     *
+     * Returns:
+     * {Boolean} The supplied geometry is equivalent to this geometry.
+     */
+    equals: function(geometry) {
+        var equivalent = true;
+        if(!geometry || !geometry.CLASS_NAME ||
+           (this.CLASS_NAME != geometry.CLASS_NAME)) {
+            equivalent = false;
+        } else if(!(geometry.components instanceof Array) ||
+                  (geometry.components.length != this.components.length)) {
+            equivalent = false;
+        } else {
+            for(var i=0, len=this.components.length; i<len; ++i) {
+                if(!this.components[i].equals(geometry.components[i])) {
+                    equivalent = false;
+                    break;
+                }
+            }
+        }
+        return equivalent;
+    },
+
+    /**
+     * APIMethod: transform
+     * Reproject the components geometry from source to dest.
+     * 
+     * Parameters:
+     * source - {<OpenLayers.Projection>} 
+     * dest - {<OpenLayers.Projection>}
+     * 
+     * Returns:
+     * {<OpenLayers.Geometry>} 
+     */
+    transform: function(source, dest) {
+        if (source && dest) {
+            for (var i=0, len=this.components.length; i<len; i++) {  
+                var component = this.components[i];
+                component.transform(source, dest);
+            }
+            this.bounds = null;
+        }
+        return this;
+    },
+
+    /**
+     * APIMethod: intersects
+     * Determine if the input geometry intersects this one.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} Any type of geometry.
+     *
+     * Returns:
+     * {Boolean} The input geometry intersects this one.
+     */
+    intersects: function(geometry) {
+        var intersect = false;
+        for(var i=0, len=this.components.length; i<len; ++ i) {
+            intersect = geometry.intersects(this.components[i]);
+            if(intersect) {
+                break;
+            }
+        }
+        return intersect;
+    },
+
+    /**
+     * APIMethod: getVertices
+     * Return a list of all points in this geometry.
+     *
+     * Parameters:
+     * nodes - {Boolean} For lines, only return vertices that are
+     *     endpoints.  If false, for lines, only vertices that are not
+     *     endpoints will be returned.  If not provided, all vertices will
+     *     be returned.
+     *
+     * Returns:
+     * {Array} A list of all vertices in the geometry.
+     */
+    getVertices: function(nodes) {
+        var vertices = [];
+        for(var i=0, len=this.components.length; i<len; ++i) {
+            Array.prototype.push.apply(
+                vertices, this.components[i].getVertices(nodes)
+            );
+        }
+        return vertices;
+    },
+
+
+    CLASS_NAME: "OpenLayers.Geometry.Collection"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LineString.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LineString.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/LineString.js	(revision 76)
@@ -0,0 +1,552 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/Curve.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.LineString
+ * A LineString is a Curve which, once two points have been added to it, can 
+ * never be less than two points long.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Geometry.Curve>
+ */
+OpenLayers.Geometry.LineString = OpenLayers.Class(OpenLayers.Geometry.Curve, {
+
+    /**
+     * Constructor: OpenLayers.Geometry.LineString
+     * Create a new LineString geometry
+     *
+     * Parameters:
+     * points - {Array(<OpenLayers.Geometry.Point>)} An array of points used to
+     *          generate the linestring
+     *
+     */
+    initialize: function(points) {
+        OpenLayers.Geometry.Curve.prototype.initialize.apply(this, arguments);        
+    },
+
+    /**
+     * APIMethod: removeComponent
+     * Only allows removal of a point if there are three or more points in 
+     * the linestring. (otherwise the result would be just a single point)
+     *
+     * Parameters: 
+     * point - {<OpenLayers.Geometry.Point>} The point to be removed
+     */
+    removeComponent: function(point) {
+        if ( this.components && (this.components.length > 2)) {
+            OpenLayers.Geometry.Collection.prototype.removeComponent.apply(this, 
+                                                                  arguments);
+        }
+    },
+    
+    /**
+     * APIMethod: intersects
+     * Test for instersection between two geometries.  This is a cheapo
+     *     implementation of the Bently-Ottmann algorigithm.  It doesn't
+     *     really keep track of a sweep line data structure.  It is closer
+     *     to the brute force method, except that segments are sorted and
+     *     potential intersections are only calculated when bounding boxes
+     *     intersect.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     *
+     * Returns:
+     * {Boolean} The input geometry intersects this geometry.
+     */
+    intersects: function(geometry) {
+        var intersect = false;
+        var type = geometry.CLASS_NAME;
+        if(type == "OpenLayers.Geometry.LineString" ||
+           type == "OpenLayers.Geometry.LinearRing" ||
+           type == "OpenLayers.Geometry.Point") {
+            var segs1 = this.getSortedSegments();
+            var segs2;
+            if(type == "OpenLayers.Geometry.Point") {
+                segs2 = [{
+                    x1: geometry.x, y1: geometry.y,
+                    x2: geometry.x, y2: geometry.y
+                }];
+            } else {
+                segs2 = geometry.getSortedSegments();
+            }
+            var seg1, seg1x1, seg1x2, seg1y1, seg1y2,
+                seg2, seg2y1, seg2y2;
+            // sweep right
+            outer: for(var i=0, len=segs1.length; i<len; ++i) {
+                seg1 = segs1[i];
+                seg1x1 = seg1.x1;
+                seg1x2 = seg1.x2;
+                seg1y1 = seg1.y1;
+                seg1y2 = seg1.y2;
+                inner: for(var j=0, jlen=segs2.length; j<jlen; ++j) {
+                    seg2 = segs2[j];
+                    if(seg2.x1 > seg1x2) {
+                        // seg1 still left of seg2
+                        break;
+                    }
+                    if(seg2.x2 < seg1x1) {
+                        // seg2 still left of seg1
+                        continue;
+                    }
+                    seg2y1 = seg2.y1;
+                    seg2y2 = seg2.y2;
+                    if(Math.min(seg2y1, seg2y2) > Math.max(seg1y1, seg1y2)) {
+                        // seg2 above seg1
+                        continue;
+                    }
+                    if(Math.max(seg2y1, seg2y2) < Math.min(seg1y1, seg1y2)) {
+                        // seg2 below seg1
+                        continue;
+                    }
+                    if(OpenLayers.Geometry.segmentsIntersect(seg1, seg2)) {
+                        intersect = true;
+                        break outer;
+                    }
+                }
+            }
+        } else {
+            intersect = geometry.intersects(this);
+        }
+        return intersect;
+    },
+    
+    /**
+     * Method: getSortedSegments
+     *
+     * Returns:
+     * {Array} An array of segment objects.  Segment objects have properties
+     *     x1, y1, x2, and y2.  The start point is represented by x1 and y1.
+     *     The end point is represented by x2 and y2.  Start and end are
+     *     ordered so that x1 < x2.
+     */
+    getSortedSegments: function() {
+        var numSeg = this.components.length - 1;
+        var segments = new Array(numSeg), point1, point2;
+        for(var i=0; i<numSeg; ++i) {
+            point1 = this.components[i];
+            point2 = this.components[i + 1];
+            if(point1.x < point2.x) {
+                segments[i] = {
+                    x1: point1.x,
+                    y1: point1.y,
+                    x2: point2.x,
+                    y2: point2.y
+                };
+            } else {
+                segments[i] = {
+                    x1: point2.x,
+                    y1: point2.y,
+                    x2: point1.x,
+                    y2: point1.y
+                };
+            }
+        }
+        // more efficient to define this somewhere static
+        function byX1(seg1, seg2) {
+            return seg1.x1 - seg2.x1;
+        }
+        return segments.sort(byX1);
+    },
+    
+    /**
+     * Method: splitWithSegment
+     * Split this geometry with the given segment.
+     *
+     * Parameters:
+     * seg - {Object} An object with x1, y1, x2, and y2 properties referencing
+     *     segment endpoint coordinates.
+     * options - {Object} Properties of this object will be used to determine
+     *     how the split is conducted.
+     *
+     * Valid options:
+     * edge - {Boolean} Allow splitting when only edges intersect.  Default is
+     *     true.  If false, a vertex on the source segment must be within the
+     *     tolerance distance of the intersection to be considered a split.
+     * tolerance - {Number} If a non-null value is provided, intersections
+     *     within the tolerance distance of one of the source segment's
+     *     endpoints will be assumed to occur at the endpoint.
+     *
+     * Returns:
+     * {Object} An object with *lines* and *points* properties.  If the given
+     *     segment intersects this linestring, the lines array will reference
+     *     geometries that result from the split.  The points array will contain
+     *     all intersection points.  Intersection points are sorted along the
+     *     segment (in order from x1,y1 to x2,y2).
+     */
+    splitWithSegment: function(seg, options) {
+        var edge = !(options && options.edge === false);
+        var tolerance = options && options.tolerance;
+        var lines = [];
+        var verts = this.getVertices();
+        var points = [];
+        var intersections = [];
+        var split = false;
+        var vert1, vert2, point;
+        var node, vertex, target;
+        var interOptions = {point: true, tolerance: tolerance};
+        var result = null;
+        for(var i=0, stop=verts.length-2; i<=stop; ++i) {
+            vert1 = verts[i];
+            points.push(vert1.clone());
+            vert2 = verts[i+1];
+            target = {x1: vert1.x, y1: vert1.y, x2: vert2.x, y2: vert2.y};
+            point = OpenLayers.Geometry.segmentsIntersect(
+                seg, target, interOptions
+            );
+            if(point instanceof OpenLayers.Geometry.Point) {
+                if((point.x === seg.x1 && point.y === seg.y1) ||
+                   (point.x === seg.x2 && point.y === seg.y2) ||
+                   point.equals(vert1) || point.equals(vert2)) {
+                    vertex = true;
+                } else {
+                    vertex = false;
+                }
+                if(vertex || edge) {
+                    // push intersections different than the previous
+                    if(!point.equals(intersections[intersections.length-1])) {
+                        intersections.push(point.clone());
+                    }
+                    if(i === 0) {
+                        if(point.equals(vert1)) {
+                            continue;
+                        }
+                    }
+                    if(point.equals(vert2)) {
+                        continue;
+                    }
+                    split = true;
+                    if(!point.equals(vert1)) {
+                        points.push(point);
+                    }
+                    lines.push(new OpenLayers.Geometry.LineString(points));
+                    points = [point.clone()];
+                }
+            }
+        }
+        if(split) {
+            points.push(vert2.clone());
+            lines.push(new OpenLayers.Geometry.LineString(points));
+        }
+        if(intersections.length > 0) {
+            // sort intersections along segment
+            var xDir = seg.x1 < seg.x2 ? 1 : -1;
+            var yDir = seg.y1 < seg.y2 ? 1 : -1;
+            result = {
+                lines: lines,
+                points: intersections.sort(function(p1, p2) {
+                    return (xDir * p1.x - xDir * p2.x) || (yDir * p1.y - yDir * p2.y);
+                })
+            };
+        }
+        return result;
+    },
+
+    /**
+     * Method: split
+     * Use this geometry (the source) to attempt to split a target geometry.
+     * 
+     * Parameters:
+     * target - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Properties of this object will be used to determine
+     *     how the split is conducted.
+     *
+     * Valid options:
+     * mutual - {Boolean} Split the source geometry in addition to the target
+     *     geometry.  Default is false.
+     * edge - {Boolean} Allow splitting when only edges intersect.  Default is
+     *     true.  If false, a vertex on the source must be within the tolerance
+     *     distance of the intersection to be considered a split.
+     * tolerance - {Number} If a non-null value is provided, intersections
+     *     within the tolerance distance of an existing vertex on the source
+     *     will be assumed to occur at the vertex.
+     * 
+     * Returns:
+     * {Array} A list of geometries (of this same type as the target) that
+     *     result from splitting the target with the source geometry.  The
+     *     source and target geometry will remain unmodified.  If no split
+     *     results, null will be returned.  If mutual is true and a split
+     *     results, return will be an array of two arrays - the first will be
+     *     all geometries that result from splitting the source geometry and
+     *     the second will be all geometries that result from splitting the
+     *     target geometry.
+     */
+    split: function(target, options) {
+        var results = null;
+        var mutual = options && options.mutual;
+        var sourceSplit, targetSplit, sourceParts, targetParts;
+        if(target instanceof OpenLayers.Geometry.LineString) {
+            var verts = this.getVertices();
+            var vert1, vert2, seg, splits, lines, point;
+            var points = [];
+            sourceParts = [];
+            for(var i=0, stop=verts.length-2; i<=stop; ++i) {
+                vert1 = verts[i];
+                vert2 = verts[i+1];
+                seg = {
+                    x1: vert1.x, y1: vert1.y,
+                    x2: vert2.x, y2: vert2.y
+                };
+                targetParts = targetParts || [target];
+                if(mutual) {
+                    points.push(vert1.clone());
+                }
+                for(var j=0; j<targetParts.length; ++j) {
+                    splits = targetParts[j].splitWithSegment(seg, options);
+                    if(splits) {
+                        // splice in new features
+                        lines = splits.lines;
+                        if(lines.length > 0) {
+                            lines.unshift(j, 1);
+                            Array.prototype.splice.apply(targetParts, lines);
+                            j += lines.length - 2;
+                        }
+                        if(mutual) {
+                            for(var k=0, len=splits.points.length; k<len; ++k) {
+                                point = splits.points[k];
+                                if(!point.equals(vert1)) {
+                                    points.push(point);
+                                    sourceParts.push(new OpenLayers.Geometry.LineString(points));
+                                    if(point.equals(vert2)) {
+                                        points = [];
+                                    } else {
+                                        points = [point.clone()];
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+            if(mutual && sourceParts.length > 0 && points.length > 0) {
+                points.push(vert2.clone());
+                sourceParts.push(new OpenLayers.Geometry.LineString(points));
+            }
+        } else {
+            results = target.splitWith(this, options);
+        }
+        if(targetParts && targetParts.length > 1) {
+            targetSplit = true;
+        } else {
+            targetParts = [];
+        }
+        if(sourceParts && sourceParts.length > 1) {
+            sourceSplit = true;
+        } else {
+            sourceParts = [];
+        }
+        if(targetSplit || sourceSplit) {
+            if(mutual) {
+                results = [sourceParts, targetParts];
+            } else {
+                results = targetParts;
+            }
+        }
+        return results;
+    },
+
+    /**
+     * Method: splitWith
+     * Split this geometry (the target) with the given geometry (the source).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} A geometry used to split this
+     *     geometry (the source).
+     * options - {Object} Properties of this object will be used to determine
+     *     how the split is conducted.
+     *
+     * Valid options:
+     * mutual - {Boolean} Split the source geometry in addition to the target
+     *     geometry.  Default is false.
+     * edge - {Boolean} Allow splitting when only edges intersect.  Default is
+     *     true.  If false, a vertex on the source must be within the tolerance
+     *     distance of the intersection to be considered a split.
+     * tolerance - {Number} If a non-null value is provided, intersections
+     *     within the tolerance distance of an existing vertex on the source
+     *     will be assumed to occur at the vertex.
+     * 
+     * Returns:
+     * {Array} A list of geometries (of this same type as the target) that
+     *     result from splitting the target with the source geometry.  The
+     *     source and target geometry will remain unmodified.  If no split
+     *     results, null will be returned.  If mutual is true and a split
+     *     results, return will be an array of two arrays - the first will be
+     *     all geometries that result from splitting the source geometry and
+     *     the second will be all geometries that result from splitting the
+     *     target geometry.
+     */
+    splitWith: function(geometry, options) {
+        return geometry.split(this, options);
+
+    },
+
+    /**
+     * APIMethod: getVertices
+     * Return a list of all points in this geometry.
+     *
+     * Parameters:
+     * nodes - {Boolean} For lines, only return vertices that are
+     *     endpoints.  If false, for lines, only vertices that are not
+     *     endpoints will be returned.  If not provided, all vertices will
+     *     be returned.
+     *
+     * Returns:
+     * {Array} A list of all vertices in the geometry.
+     */
+    getVertices: function(nodes) {
+        var vertices;
+        if(nodes === true) {
+            vertices = [
+                this.components[0],
+                this.components[this.components.length-1]
+            ];
+        } else if (nodes === false) {
+            vertices = this.components.slice(1, this.components.length-1);
+        } else {
+            vertices = this.components.slice();
+        }
+        return vertices;
+    },
+
+    /**
+     * APIMethod: distanceTo
+     * Calculate the closest distance between two geometries (on the x-y plane).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Optional properties for configuring the distance
+     *     calculation.
+     *
+     * Valid options:
+     * details - {Boolean} Return details from the distance calculation.
+     *     Default is false.
+     * edge - {Boolean} Calculate the distance from this geometry to the
+     *     nearest edge of the target geometry.  Default is true.  If true,
+     *     calling distanceTo from a geometry that is wholly contained within
+     *     the target will result in a non-zero distance.  If false, whenever
+     *     geometries intersect, calling distanceTo will return 0.  If false,
+     *     details cannot be returned.
+     *
+     * Returns:
+     * {Number | Object} The distance between this geometry and the target.
+     *     If details is true, the return will be an object with distance,
+     *     x0, y0, x1, and x2 properties.  The x0 and y0 properties represent
+     *     the coordinates of the closest point on this geometry. The x1 and y1
+     *     properties represent the coordinates of the closest point on the
+     *     target geometry.
+     */
+    distanceTo: function(geometry, options) {
+        var edge = !(options && options.edge === false);
+        var details = edge && options && options.details;
+        var result, best = {};
+        var min = Number.POSITIVE_INFINITY;
+        if(geometry instanceof OpenLayers.Geometry.Point) {
+            var segs = this.getSortedSegments();
+            var x = geometry.x;
+            var y = geometry.y;
+            var seg;
+            for(var i=0, len=segs.length; i<len; ++i) {
+                seg = segs[i];
+                result = OpenLayers.Geometry.distanceToSegment(geometry, seg);
+                if(result.distance < min) {
+                    min = result.distance;
+                    best = result;
+                    if(min === 0) {
+                        break;
+                    }
+                } else {
+                    // if distance increases and we cross y0 to the right of x0, no need to keep looking.
+                    if(seg.x2 > x && ((y > seg.y1 && y < seg.y2) || (y < seg.y1 && y > seg.y2))) {
+                        break;
+                    }
+                }
+            }
+            if(details) {
+                best = {
+                    distance: best.distance,
+                    x0: best.x, y0: best.y,
+                    x1: x, y1: y
+                };
+            } else {
+                best = best.distance;
+            }
+        } else if(geometry instanceof OpenLayers.Geometry.LineString) { 
+            var segs0 = this.getSortedSegments();
+            var segs1 = geometry.getSortedSegments();
+            var seg0, seg1, intersection, x0, y0;
+            var len1 = segs1.length;
+            var interOptions = {point: true};
+            outer: for(var i=0, len=segs0.length; i<len; ++i) {
+                seg0 = segs0[i];
+                x0 = seg0.x1;
+                y0 = seg0.y1;
+                for(var j=0; j<len1; ++j) {
+                    seg1 = segs1[j];
+                    intersection = OpenLayers.Geometry.segmentsIntersect(seg0, seg1, interOptions);
+                    if(intersection) {
+                        min = 0;
+                        best = {
+                            distance: 0,
+                            x0: intersection.x, y0: intersection.y,
+                            x1: intersection.x, y1: intersection.y
+                        };
+                        break outer;
+                    } else {
+                        result = OpenLayers.Geometry.distanceToSegment({x: x0, y: y0}, seg1);
+                        if(result.distance < min) {
+                            min = result.distance;
+                            best = {
+                                distance: min,
+                                x0: x0, y0: y0,
+                                x1: result.x, y1: result.y
+                            };
+                        }
+                    }
+                }
+            }
+            if(!details) {
+                best = best.distance;
+            }
+            if(min !== 0) {
+                // check the final vertex in this line's sorted segments
+                if(seg0) {
+                    result = geometry.distanceTo(
+                        new OpenLayers.Geometry.Point(seg0.x2, seg0.y2),
+                        options
+                    );
+                    var dist = details ? result.distance : result;
+                    if(dist < min) {
+                        if(details) {
+                            best = {
+                                distance: min,
+                                x0: result.x1, y0: result.y1,
+                                x1: result.x0, y1: result.y0
+                            };
+                        } else {
+                            best = dist;
+                        }
+                    }
+                }
+            }
+        } else {
+            best = geometry.distanceTo(this, options);
+            // swap since target comes from this line
+            if(details) {
+                best = {
+                    distance: best.distance,
+                    x0: best.x1, y0: best.y1,
+                    x1: best.x0, y1: best.y0
+                };
+            }
+        }
+        return best;
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.LineString"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPolygon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPolygon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry/MultiPolygon.js	(revision 76)
@@ -0,0 +1,46 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Geometry/Collection.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry.MultiPolygon
+ * MultiPolygon is a geometry with multiple <OpenLayers.Geometry.Polygon>
+ * components.  Create a new instance with the <OpenLayers.Geometry.MultiPolygon>
+ * constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Geometry.Collection>
+ */
+OpenLayers.Geometry.MultiPolygon = OpenLayers.Class(
+  OpenLayers.Geometry.Collection, {
+
+    /**
+     * Property: componentTypes
+     * {Array(String)} An array of class names representing the types of
+     * components that the collection can include.  A null value means the
+     * component types are not restricted.
+     */
+    componentTypes: ["OpenLayers.Geometry.Polygon"],
+
+    /**
+     * Constructor: OpenLayers.Geometry.MultiPolygon
+     * Create a new MultiPolygon geometry
+     *
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry.Polygon>)} An array of polygons
+     *              used to generate the MultiPolygon
+     *
+     */
+    initialize: function(components) {
+        OpenLayers.Geometry.Collection.prototype.initialize.apply(this, 
+                                                                  arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry.MultiPolygon"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/WFS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/WFS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/WFS.js	(revision 76)
@@ -0,0 +1,80 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Feature.js
+ */
+
+/**
+ * Class: OpenLayers.Feature.WFS
+ * WFS handling class, for use as a featureClass on the WFS layer for handling
+ * 'point' WFS types. Good for subclassing when creating a custom WFS like
+ * XML application.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Feature>
+ */
+OpenLayers.Feature.WFS = OpenLayers.Class(OpenLayers.Feature, {
+      
+    /** 
+     * Constructor: OpenLayers.Feature.WFS
+     * Create a WFS feature.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} 
+     * xmlNode - {XMLNode} 
+     */
+    initialize: function(layer, xmlNode) {
+        var newArguments = arguments;
+        var data = this.processXMLNode(xmlNode);
+        newArguments = new Array(layer, data.lonlat, data);
+        OpenLayers.Feature.prototype.initialize.apply(this, newArguments);
+        this.createMarker();
+        this.layer.addMarker(this.marker);
+    },
+    
+    /** 
+     * Method: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        if (this.marker != null) {
+            this.layer.removeMarker(this.marker);  
+        }
+        OpenLayers.Feature.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: processXMLNode
+     * When passed an xmlNode, parses it for a GML point, and passes
+     * back an object describing that point.
+     *
+     * For subclasses of Feature.WFS, this is the feature to change.
+     *
+     * Parameters:
+     * xmlNode - {XMLNode} 
+     * 
+     * Returns:
+     * {Object} Data Object with 'id', 'lonlat', and private properties set
+     */
+    processXMLNode: function(xmlNode) {
+        //this should be overridden by subclasses
+        // must return an Object with 'id' and 'lonlat' values set
+        var point = OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.opengis.net/gml", "gml", "Point");
+        var text  = OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(point[0], "http://www.opengis.net/gml","gml", "coordinates")[0]);
+        var floats = text.split(",");
+        return {lonlat: new OpenLayers.LonLat(parseFloat(floats[0]),
+                                              parseFloat(floats[1])),
+                id: null};
+
+    },
+
+    CLASS_NAME: "OpenLayers.Feature.WFS"
+});
+  
+  
+  
+  
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/Vector.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/Vector.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature/Vector.js	(revision 76)
@@ -0,0 +1,454 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+// TRASH THIS
+OpenLayers.State = {
+    /** states */
+    UNKNOWN: 'Unknown',
+    INSERT: 'Insert',
+    UPDATE: 'Update',
+    DELETE: 'Delete'
+};
+
+/**
+ * @requires OpenLayers/Feature.js
+ * @requires OpenLayers/Util.js
+ */
+
+/**
+ * Class: OpenLayers.Feature.Vector
+ * Vector features use the OpenLayers.Geometry classes as geometry description.
+ * They have an 'attributes' property, which is the data object, and a 'style'
+ * property, the default values of which are defined in the 
+ * <OpenLayers.Feature.Vector.style> objects.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Feature>
+ */
+OpenLayers.Feature.Vector = OpenLayers.Class(OpenLayers.Feature, {
+
+    /** 
+     * Property: fid 
+     * {String} 
+     */
+    fid: null,
+    
+    /** 
+     * APIProperty: geometry 
+     * {<OpenLayers.Geometry>} 
+     */
+    geometry: null,
+
+    /** 
+     * APIProperty: attributes 
+     * {Object} This object holds arbitrary, serializable properties that
+     *     describe the feature.
+     */
+    attributes: null,
+
+    /**
+     * Property: bounds
+     * {<OpenLayers.Bounds>} The box bounding that feature's geometry, that
+     *     property can be set by an <OpenLayers.Format> object when
+     *     deserializing the feature, so in most cases it represents an
+     *     information set by the server. 
+     */
+    bounds: null,
+
+    /** 
+     * Property: state 
+     * {String} 
+     */
+    state: null,
+    
+    /** 
+     * APIProperty: style 
+     * {Object} 
+     */
+    style: null,
+
+    /**
+     * APIProperty: url
+     * {String} If this property is set it will be taken into account by
+     *     {<OpenLayers.HTTP>} when upadting or deleting the feature.
+     */
+    url: null,
+    
+    /**
+     * Property: renderIntent
+     * {String} rendering intent currently being used
+     */
+    renderIntent: "default",
+
+    /** 
+     * Constructor: OpenLayers.Feature.Vector
+     * Create a vector feature. 
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The geometry that this feature
+     *     represents.
+     * attributes - {Object} An optional object that will be mapped to the
+     *     <attributes> property. 
+     * style - {Object} An optional style object.
+     */
+    initialize: function(geometry, attributes, style) {
+        OpenLayers.Feature.prototype.initialize.apply(this,
+                                                      [null, null, attributes]);
+        this.lonlat = null;
+        this.geometry = geometry ? geometry : null;
+        this.state = null;
+        this.attributes = {};
+        if (attributes) {
+            this.attributes = OpenLayers.Util.extend(this.attributes,
+                                                     attributes);
+        }
+        this.style = style ? style : null; 
+    },
+    
+    /** 
+     * Method: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        if (this.layer) {
+            this.layer.removeFeatures(this);
+            this.layer = null;
+        }
+            
+        this.geometry = null;
+        OpenLayers.Feature.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: clone
+     * Create a clone of this vector feature.  Does not set any non-standard
+     *     properties.
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} An exact clone of this vector feature.
+     */
+    clone: function () {
+        return new OpenLayers.Feature.Vector(
+            this.geometry ? this.geometry.clone() : null,
+            this.attributes,
+            this.style);
+    },
+
+    /**
+     * Method: onScreen
+     * Determine whether the feature is within the map viewport.  This method
+     *     tests for an intersection between the geometry and the viewport
+     *     bounds.  If a more effecient but less precise geometry bounds
+     *     intersection is desired, call the method with the boundsOnly
+     *     parameter true.
+     *
+     * Parameters:
+     * boundsOnly - {Boolean} Only test whether a feature's bounds intersects
+     *     the viewport bounds.  Default is false.  If false, the feature's
+     *     geometry must intersect the viewport for onScreen to return true.
+     * 
+     * Returns:
+     * {Boolean} The feature is currently visible on screen (optionally
+     *     based on its bounds if boundsOnly is true).
+     */
+    onScreen:function(boundsOnly) {
+        var onScreen = false;
+        if(this.layer && this.layer.map) {
+            var screenBounds = this.layer.map.getExtent();
+            if(boundsOnly) {
+                var featureBounds = this.geometry.getBounds();
+                onScreen = screenBounds.intersectsBounds(featureBounds);
+            } else {
+                var screenPoly = screenBounds.toGeometry();
+                onScreen = screenPoly.intersects(this.geometry);
+            }
+        }    
+        return onScreen;
+    },
+
+    /**
+     * Method: getVisibility
+     * Determine whether the feature is displayed or not. It may not displayed
+     *     because:
+     *     - its style display property is set to 'none',
+     *     - it doesn't belong to any layer,
+     *     - the styleMap creates a symbolizer with display property set to 'none'
+     *          for it,
+     *     - the layer which it belongs to is not visible.
+     * 
+     * Returns:
+     * {Boolean} The feature is currently displayed.
+     */
+    getVisibility: function() {
+        return !(this.style && this.style.display == 'none' ||
+                 !this.layer ||
+                 this.layer && this.layer.styleMap &&
+                 this.layer.styleMap.createSymbolizer(this, this.renderIntent).display == 'none' ||
+                 this.layer && !this.layer.getVisibility());
+    },
+    
+    /**
+     * Method: createMarker
+     * HACK - we need to decide if all vector features should be able to
+     *     create markers
+     * 
+     * Returns:
+     * {<OpenLayers.Marker>} For now just returns null
+     */
+    createMarker: function() {
+        return null;
+    },
+
+    /**
+     * Method: destroyMarker
+     * HACK - we need to decide if all vector features should be able to
+     *     delete markers
+     * 
+     * If user overrides the createMarker() function, s/he should be able
+     *   to also specify an alternative function for destroying it
+     */
+    destroyMarker: function() {
+        // pass
+    },
+
+    /**
+     * Method: createPopup
+     * HACK - we need to decide if all vector features should be able to
+     *     create popups
+     * 
+     * Returns:
+     * {<OpenLayers.Popup>} For now just returns null
+     */
+    createPopup: function() {
+        return null;
+    },
+
+    /**
+     * Method: atPoint
+     * Determins whether the feature intersects with the specified location.
+     * 
+     * Parameters: 
+     * lonlat - {<OpenLayers.LonLat>} 
+     * toleranceLon - {float} Optional tolerance in Geometric Coords
+     * toleranceLat - {float} Optional tolerance in Geographic Coords
+     * 
+     * Returns:
+     * {Boolean} Whether or not the feature is at the specified location
+     */
+    atPoint: function(lonlat, toleranceLon, toleranceLat) {
+        var atPoint = false;
+        if(this.geometry) {
+            atPoint = this.geometry.atPoint(lonlat, toleranceLon, 
+                                                    toleranceLat);
+        }
+        return atPoint;
+    },
+
+    /**
+     * Method: destroyPopup
+     * HACK - we need to decide if all vector features should be able to
+     * delete popups
+     */
+    destroyPopup: function() {
+        // pass
+    },
+
+    /**
+     * Method: move
+     * Moves the feature and redraws it at its new location
+     *
+     * Parameters:
+     * state - {OpenLayers.LonLat or OpenLayers.Pixel} the
+     *         location to which to move the feature.
+     */
+    move: function(location) {
+
+        if(!this.layer || !this.geometry.move){
+            //do nothing if no layer or immoveable geometry
+            return;
+        }
+
+        var pixel;
+        if (location.CLASS_NAME == "OpenLayers.LonLat") {
+            pixel = this.layer.getViewPortPxFromLonLat(location);
+        } else {
+            pixel = location;
+        }
+        
+        var lastPixel = this.layer.getViewPortPxFromLonLat(this.geometry.getBounds().getCenterLonLat());
+        var res = this.layer.map.getResolution();
+        this.geometry.move(res * (pixel.x - lastPixel.x),
+                           res * (lastPixel.y - pixel.y));
+        this.layer.drawFeature(this);
+        return lastPixel;
+    },
+    
+    /**
+     * Method: toState
+     * Sets the new state
+     *
+     * Parameters:
+     * state - {String} 
+     */
+    toState: function(state) {
+        if (state == OpenLayers.State.UPDATE) {
+            switch (this.state) {
+                case OpenLayers.State.UNKNOWN:
+                case OpenLayers.State.DELETE:
+                    this.state = state;
+                    break;
+                case OpenLayers.State.UPDATE:
+                case OpenLayers.State.INSERT:
+                    break;
+            }
+        } else if (state == OpenLayers.State.INSERT) {
+            switch (this.state) {
+                case OpenLayers.State.UNKNOWN:
+                    break;
+                default:
+                    this.state = state;
+                    break;
+            }
+        } else if (state == OpenLayers.State.DELETE) {
+            switch (this.state) {
+                case OpenLayers.State.INSERT:
+                    // the feature should be destroyed
+                    break;
+                case OpenLayers.State.DELETE:
+                    break;
+                case OpenLayers.State.UNKNOWN:
+                case OpenLayers.State.UPDATE:
+                    this.state = state;
+                    break;
+            }
+        } else if (state == OpenLayers.State.UNKNOWN) {
+            this.state = state;
+        }
+    },
+    
+    CLASS_NAME: "OpenLayers.Feature.Vector"
+});
+
+
+/**
+ * Constant: OpenLayers.Feature.Vector.style
+ * OpenLayers features can have a number of style attributes. The 'default' 
+ *     style will typically be used if no other style is specified. These
+ *     styles correspond for the most part, to the styling properties defined
+ *     by the SVG standard. 
+ *     Information on fill properties: http://www.w3.org/TR/SVG/painting.html#FillProperties
+ *     Information on stroke properties: http://www.w3.org/TR/SVG/painting.html#StrokeProperties
+ *
+ * Symbolizer properties:
+ * fill - {Boolean} Set to false if no fill is desired.
+ * fillColor - {String} Hex fill color.  Default is "#ee9900".
+ * fillOpacity - {Number} Fill opacity (0-1).  Default is 0.4 
+ * stroke - {Boolean} Set to false if no stroke is desired.
+ * strokeColor - {String} Hex stroke color.  Default is "#ee9900".
+ * strokeOpacity - {Number} Stroke opacity (0-1).  Default is 1.
+ * strokeWidth - {Number} Pixel stroke width.  Default is 1.
+ * strokeLinecap - {String} Stroke cap type.  Default is "round".  [butt | round | square]
+ * strokeDashstyle - {String} Stroke dash style.  Default is "solid". [dot | dash | dashdot | longdash | longdashdot | solid]
+ * graphic - {Boolean} Set to false if no graphic is desired.
+ * pointRadius - {Number} Pixel point radius.  Default is 6.
+ * pointerEvents - {String}  Default is "visiblePainted".
+ * cursor - {String} Default is "".
+ * externalGraphic - {String} Url to an external graphic that will be used for rendering points.
+ * graphicWidth - {Number} Pixel width for sizing an external graphic.
+ * graphicHeight - {Number} Pixel height for sizing an external graphic.
+ * graphicOpacity - {Number} Opacity (0-1) for an external graphic.
+ * graphicXOffset - {Number} Pixel offset along the positive x axis for displacing an external graphic.
+ * graphicYOffset - {Number} Pixel offset along the positive y axis for displacing an external graphic.
+ * rotation - {Number} For point symbolizers, this is the rotation of a graphic in the clockwise direction about its center point (or any point off center as specified by graphicXOffset and graphicYOffset).
+ * graphicZIndex - {Number} The integer z-index value to use in rendering.
+ * graphicName - {String} Named graphic to use when rendering points.  Supported values include "circle" (default),
+ *     "square", "star", "x", "cross", "triangle".
+ * graphicTitle - {String} Tooltip for an external graphic. Only supported in Firefox and Internet Explorer.
+ * backgroundGraphic - {String} Url to a graphic to be used as the background under an externalGraphic.
+ * backgroundGraphicZIndex - {Number} The integer z-index value to use in rendering the background graphic.
+ * backgroundXOffset - {Number} The x offset (in pixels) for the background graphic.
+ * backgroundYOffset - {Number} The y offset (in pixels) for the background graphic.
+ * backgroundHeight - {Number} The height of the background graphic.  If not provided, the graphicHeight will be used.
+ * backgroundWidth - {Number} The width of the background width.  If not provided, the graphicWidth will be used.
+ * label - {String} The text for an optional label. For browsers that use the canvas renderer, this requires either
+ *     fillText or mozDrawText to be available.
+ * labelAlign - {String} Label alignment. This specifies the insertion point relative to the text. It is a string
+ *     composed of two characters. The first character is for the horizontal alignment, the second for the vertical
+ *     alignment. Valid values for horizontal alignment: "l"=left, "c"=center, "r"=right. Valid values for vertical
+ *     alignment: "t"=top, "m"=middle, "b"=bottom. Example values: "lt", "cm", "rb". The canvas renderer does not
+ *     support vertical alignment, it will always use "b".
+ * labelXOffset - {Number} Pixel offset along the positive x axis for displacing the label.
+ * labelYOffset - {Number} Pixel offset along the positive y axis for displacing the label.
+ * labelSelect - {Boolean} If set to true, labels will be selectable using SelectFeature or similar controls.
+ *     Default is false.
+ * fontColor - {String} The font color for the label, to be provided like CSS.
+ * fontOpacity - {Number} Opacity (0-1) for the label
+ * fontFamily - {String} The font family for the label, to be provided like in CSS.
+ * fontSize - {String} The font size for the label, to be provided like in CSS.
+ * fontWeight - {String} The font weight for the label, to be provided like in CSS.
+ * display - {String} Symbolizers will have no effect if display is set to "none".  All other values have no effect.
+ */ 
+OpenLayers.Feature.Vector.style = {
+    'default': {
+        fillColor: "#ee9900",
+        fillOpacity: 0.4, 
+        hoverFillColor: "white",
+        hoverFillOpacity: 0.8,
+        strokeColor: "#ee9900",
+        strokeOpacity: 1,
+        strokeWidth: 1,
+        strokeLinecap: "round",
+        strokeDashstyle: "solid",
+        hoverStrokeColor: "red",
+        hoverStrokeOpacity: 1,
+        hoverStrokeWidth: 0.2,
+        pointRadius: 6,
+        hoverPointRadius: 1,
+        hoverPointUnit: "%",
+        pointerEvents: "visiblePainted",
+        cursor: "inherit"
+    },
+    'select': {
+        fillColor: "blue",
+        fillOpacity: 0.4, 
+        hoverFillColor: "white",
+        hoverFillOpacity: 0.8,
+        strokeColor: "blue",
+        strokeOpacity: 1,
+        strokeWidth: 2,
+        strokeLinecap: "round",
+        strokeDashstyle: "solid",
+        hoverStrokeColor: "red",
+        hoverStrokeOpacity: 1,
+        hoverStrokeWidth: 0.2,
+        pointRadius: 6,
+        hoverPointRadius: 1,
+        hoverPointUnit: "%",
+        pointerEvents: "visiblePainted",
+        cursor: "pointer"
+    },
+    'temporary': {
+        fillColor: "#66cccc",
+        fillOpacity: 0.2, 
+        hoverFillColor: "white",
+        hoverFillOpacity: 0.8,
+        strokeColor: "#66cccc",
+        strokeOpacity: 1,
+        strokeLinecap: "round",
+        strokeWidth: 2,
+        strokeDashstyle: "solid",
+        hoverStrokeColor: "red",
+        hoverStrokeOpacity: 1,
+        hoverStrokeWidth: 0.2,
+        pointRadius: 6,
+        hoverPointRadius: 1,
+        hoverPointUnit: "%",
+        pointerEvents: "visiblePainted",
+        cursor: "inherit"
+    },
+    'delete': {
+        display: "none"
+    }
+};    
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Marker.js	(revision 76)
@@ -0,0 +1,242 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Events.js
+ * @requires OpenLayers/Icon.js
+ */
+
+/**
+ * Class: OpenLayers.Marker
+ * Instances of OpenLayers.Marker are a combination of a 
+ * <OpenLayers.LonLat> and an <OpenLayers.Icon>.  
+ *
+ * Markers are generally added to a special layer called
+ * <OpenLayers.Layer.Markers>.
+ *
+ * Example:
+ * (code)
+ * var markers = new OpenLayers.Layer.Markers( "Markers" );
+ * map.addLayer(markers);
+ *
+ * var size = new OpenLayers.Size(21,25);
+ * var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
+ * var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png', size, offset);
+ * markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon));
+ * markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon.clone()));
+ *
+ * (end)
+ *
+ * Note that if you pass an icon into the Marker constructor, it will take
+ * that icon and use it. This means that you should not share icons between
+ * markers -- you use them once, but you should clone() for any additional
+ * markers using that same icon.
+ */
+OpenLayers.Marker = OpenLayers.Class({
+    
+    /** 
+     * Property: icon 
+     * {<OpenLayers.Icon>} The icon used by this marker.
+     */
+    icon: null,
+
+    /** 
+     * Property: lonlat 
+     * {<OpenLayers.LonLat>} location of object
+     */
+    lonlat: null,
+    
+    /** 
+     * Property: events 
+     * {<OpenLayers.Events>} the event handler.
+     */
+    events: null,
+    
+    /** 
+     * Property: map 
+     * {<OpenLayers.Map>} the map this marker is attached to
+     */
+    map: null,
+    
+    /** 
+     * Constructor: OpenLayers.Marker
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>} the position of this marker
+     * icon - {<OpenLayers.Icon>}  the icon for this marker
+     */
+    initialize: function(lonlat, icon) {
+        this.lonlat = lonlat;
+        
+        var newIcon = (icon) ? icon : OpenLayers.Marker.defaultIcon();
+        if (this.icon == null) {
+            this.icon = newIcon;
+        } else {
+            this.icon.url = newIcon.url;
+            this.icon.size = newIcon.size;
+            this.icon.offset = newIcon.offset;
+            this.icon.calculateOffset = newIcon.calculateOffset;
+        }
+        this.events = new OpenLayers.Events(this, this.icon.imageDiv, null);
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Destroy the marker. You must first remove the marker from any 
+     * layer which it has been added to, or you will get buggy behavior.
+     * (This can not be done within the marker since the marker does not
+     * know which layer it is attached to.)
+     */
+    destroy: function() {
+        // erase any drawn features
+        this.erase();
+
+        this.map = null;
+
+        this.events.destroy();
+        this.events = null;
+
+        if (this.icon != null) {
+            this.icon.destroy();
+            this.icon = null;
+        }
+    },
+    
+    /** 
+    * Method: draw
+    * Calls draw on the icon, and returns that output.
+    * 
+    * Parameters:
+    * px - {<OpenLayers.Pixel>}
+    * 
+    * Returns:
+    * {DOMElement} A new DOM Image with this marker's icon set at the 
+    * location passed-in
+    */
+    draw: function(px) {
+        return this.icon.draw(px);
+    }, 
+
+    /** 
+    * Method: erase
+    * Erases any drawn elements for this marker.
+    */
+    erase: function() {
+        if (this.icon != null) {
+            this.icon.erase();
+        }
+    }, 
+
+    /**
+    * Method: moveTo
+    * Move the marker to the new location.
+    *
+    * Parameters:
+    * px - {<OpenLayers.Pixel>} the pixel position to move to
+    */
+    moveTo: function (px) {
+        if ((px != null) && (this.icon != null)) {
+            this.icon.moveTo(px);
+        }           
+        this.lonlat = this.map.getLonLatFromLayerPx(px);
+    },
+
+    /**
+     * APIMethod: isDrawn
+     * 
+     * Returns:
+     * {Boolean} Whether or not the marker is drawn.
+     */
+    isDrawn: function() {
+        var isDrawn = (this.icon && this.icon.isDrawn());
+        return isDrawn;   
+    },
+
+    /**
+     * Method: onScreen
+     *
+     * Returns:
+     * {Boolean} Whether or not the marker is currently visible on screen.
+     */
+    onScreen:function() {
+        
+        var onScreen = false;
+        if (this.map) {
+            var screenBounds = this.map.getExtent();
+            onScreen = screenBounds.containsLonLat(this.lonlat);
+        }    
+        return onScreen;
+    },
+    
+    /**
+     * Method: inflate
+     * Englarges the markers icon by the specified ratio.
+     *
+     * Parameters:
+     * inflate - {float} the ratio to enlarge the marker by (passing 2
+     *                   will double the size).
+     */
+    inflate: function(inflate) {
+        if (this.icon) {
+            var newSize = new OpenLayers.Size(this.icon.size.w * inflate,
+                                              this.icon.size.h * inflate);
+            this.icon.setSize(newSize);
+        }        
+    },
+    
+    /** 
+     * Method: setOpacity
+     * Change the opacity of the marker by changin the opacity of 
+     *   its icon
+     * 
+     * Parameters:
+     * opacity - {float}  Specified as fraction (0.4, etc)
+     */
+    setOpacity: function(opacity) {
+        this.icon.setOpacity(opacity);
+    },
+
+    /**
+     * Method: setUrl
+     * Change URL of the Icon Image.
+     * 
+     * url - {String} 
+     */
+    setUrl: function(url) {
+        this.icon.setUrl(url);
+    },    
+
+    /** 
+     * Method: display
+     * Hide or show the icon
+     * 
+     * display - {Boolean} 
+     */
+    display: function(display) {
+        this.icon.display(display);
+    },
+
+    CLASS_NAME: "OpenLayers.Marker"
+});
+
+
+/**
+ * Function: defaultIcon
+ * Creates a default <OpenLayers.Icon>.
+ * 
+ * Returns:
+ * {<OpenLayers.Icon>} A default OpenLayers.Icon to use for a marker
+ */
+OpenLayers.Marker.defaultIcon = function() {
+    var url = OpenLayers.Util.getImagesLocation() + "marker.png";
+    var size = new OpenLayers.Size(21, 25);
+    var calculateOffset = function(size) {
+                    return new OpenLayers.Pixel(-(size.w/2), -size.h);
+                 };
+
+    return new OpenLayers.Icon(url, size, null, calculateOffset);        
+};
+    
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tween.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tween.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Tween.js	(revision 76)
@@ -0,0 +1,318 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Namespace: OpenLayers.Tween
+ */
+OpenLayers.Tween = OpenLayers.Class({
+    
+    /**
+     * Constant: INTERVAL
+     * {int} Interval in milliseconds between 2 steps
+     */
+    INTERVAL: 10,
+    
+    /**
+     * APIProperty: easing
+     * {<OpenLayers.Easing>(Function)} Easing equation used for the animation
+     *     Defaultly set to OpenLayers.Easing.Expo.easeOut
+     */
+    easing: null,
+    
+    /**
+     * APIProperty: begin
+     * {Object} Values to start the animation with
+     */
+    begin: null,
+    
+    /**
+     * APIProperty: finish
+     * {Object} Values to finish the animation with
+     */
+    finish: null,
+    
+    /**
+     * APIProperty: duration
+     * {int} duration of the tween (number of steps)
+     */
+    duration: null,
+    
+    /**
+     * APIProperty: callbacks
+     * {Object} An object with start, eachStep and done properties whose values
+     *     are functions to be call during the animation. They are passed the
+     *     current computed value as argument.
+     */
+    callbacks: null,
+    
+    /**
+     * Property: time
+     * {int} Step counter
+     */
+    time: null,
+    
+    /**
+     * Property: interval
+     * {int} Interval id returned by window.setInterval
+     */
+    interval: null,
+    
+    /**
+     * Property: playing
+     * {Boolean} Tells if the easing is currently playing
+     */
+    playing: false,
+    
+    /** 
+     * Constructor: OpenLayers.Tween
+     * Creates a Tween.
+     *
+     * Parameters:
+     * easing - {<OpenLayers.Easing>(Function)} easing function method to use
+     */ 
+    initialize: function(easing) {
+        this.easing = (easing) ? easing : OpenLayers.Easing.Expo.easeOut;
+    },
+    
+    /**
+     * APIMethod: start
+     * Plays the Tween, and calls the callback method on each step
+     * 
+     * Parameters:
+     * begin - {Object} values to start the animation with
+     * finish - {Object} values to finish the animation with
+     * duration - {int} duration of the tween (number of steps)
+     * options - {Object} hash of options (for example callbacks (start, eachStep, done))
+     */
+    start: function(begin, finish, duration, options) {
+        this.playing = true;
+        this.begin = begin;
+        this.finish = finish;
+        this.duration = duration;
+        this.callbacks = options.callbacks;
+        this.time = 0;
+        if (this.interval) {
+            window.clearInterval(this.interval);
+            this.interval = null;
+        }
+        if (this.callbacks && this.callbacks.start) {
+            this.callbacks.start.call(this, this.begin);
+        }
+        this.interval = window.setInterval(
+            OpenLayers.Function.bind(this.play, this), this.INTERVAL);
+    },
+    
+    /**
+     * APIMethod: stop
+     * Stops the Tween, and calls the done callback
+     *     Doesn't do anything if animation is already finished
+     */
+    stop: function() {
+        if (!this.playing) {
+            return;
+        }
+        
+        if (this.callbacks && this.callbacks.done) {
+            this.callbacks.done.call(this, this.finish);
+        }
+        window.clearInterval(this.interval);
+        this.interval = null;
+        this.playing = false;
+    },
+    
+    /**
+     * Method: play
+     * Calls the appropriate easing method
+     */
+    play: function() {
+        var value = {};
+        for (var i in this.begin) {
+            var b = this.begin[i];
+            var f = this.finish[i];
+            if (b == null || f == null || isNaN(b) || isNaN(f)) {
+                OpenLayers.Console.error('invalid value for Tween');
+            }
+            
+            var c = f - b;
+            value[i] = this.easing.apply(this, [this.time, b, c, this.duration]);
+        }
+        this.time++;
+        
+        if (this.callbacks && this.callbacks.eachStep) {
+            this.callbacks.eachStep.call(this, value);
+        }
+        
+        if (this.time > this.duration) {
+            this.stop();
+        }
+    },
+    
+    /**
+     * Create empty functions for all easing methods.
+     */
+    CLASS_NAME: "OpenLayers.Tween"
+});
+
+/**
+ * Namespace: OpenLayers.Easing
+ * 
+ * Credits:
+ *      Easing Equations by Robert Penner, <http://www.robertpenner.com/easing/>
+ */
+OpenLayers.Easing = {
+    /**
+     * Create empty functions for all easing methods.
+     */
+    CLASS_NAME: "OpenLayers.Easing"
+};
+
+/**
+ * Namespace: OpenLayers.Easing.Linear
+ */
+OpenLayers.Easing.Linear = {
+    
+    /**
+     * Function: easeIn
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeIn: function(t, b, c, d) {
+        return c*t/d + b;
+    },
+    
+    /**
+     * Function: easeOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeOut: function(t, b, c, d) {
+        return c*t/d + b;
+    },
+    
+    /**
+     * Function: easeInOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeInOut: function(t, b, c, d) {
+        return c*t/d + b;
+    },
+
+    CLASS_NAME: "OpenLayers.Easing.Linear"
+};
+
+/**
+ * Namespace: OpenLayers.Easing.Expo
+ */
+OpenLayers.Easing.Expo = {
+    
+    /**
+     * Function: easeIn
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeIn: function(t, b, c, d) {
+        return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
+    },
+    
+    /**
+     * Function: easeOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeOut: function(t, b, c, d) {
+        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+    },
+    
+    /**
+     * Function: easeInOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeInOut: function(t, b, c, d) {
+        if (t==0) return b;
+        if (t==d) return b+c;
+        if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
+        return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
+    },
+
+    CLASS_NAME: "OpenLayers.Easing.Expo"
+};
+
+/**
+ * Namespace: OpenLayers.Easing.Quad
+ */
+OpenLayers.Easing.Quad = {
+    
+    /**
+     * Function: easeIn
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeIn: function(t, b, c, d) {
+        return c*(t/=d)*t + b;
+    },
+    
+    /**
+     * Function: easeOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeOut: function(t, b, c, d) {
+        return -c *(t/=d)*(t-2) + b;
+    },
+    
+    /**
+     * Function: easeInOut
+     * 
+     * Parameters:
+     * t - {Float} time
+     * b - {Float} beginning position
+     * c - {Float} total change
+     * d - {Float} duration of the transition
+     */
+    easeInOut: function(t, b, c, d) {
+        if ((t/=d/2) < 1) return c/2*t*t + b;
+        return -c/2 * ((--t)*(t-2) - 1) + b;
+    },
+
+    CLASS_NAME: "OpenLayers.Easing.Quad"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS.js	(revision 76)
@@ -0,0 +1,33 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol.js
+ */
+
+/**
+ * Function: OpenLayers.Protocol.SOS
+ * Used to create a versioned SOS protocol.  Default version is 1.0.0.
+ *
+ * Returns:
+ * {<OpenLayers.Protocol>} An SOS protocol for the given version.
+ */
+OpenLayers.Protocol.SOS = function(options) {
+    options = OpenLayers.Util.applyDefaults(
+        options, OpenLayers.Protocol.SOS.DEFAULTS
+    );
+    var cls = OpenLayers.Protocol.SOS["v"+options.version.replace(/\./g, "_")];
+    if(!cls) {
+        throw "Unsupported SOS version: " + options.version;
+    }
+    return new cls(options);
+};
+
+/**
+ * Constant: OpenLayers.Protocol.SOS.DEFAULTS
+ */
+OpenLayers.Protocol.SOS.DEFAULTS = {
+    "version": "1.0.0"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL/Gears.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL/Gears.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL/Gears.js	(revision 76)
@@ -0,0 +1,561 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires Gears/gears_init.js
+ * @requires OpenLayers/Protocol/SQL.js
+ * @requires OpenLayers/Format/JSON.js
+ * @requires OpenLayers/Format/WKT.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.SQL.Gears
+ * This Protocol stores feature in the browser via the Gears Database module 
+ * <http://code.google.com/apis/gears/api_database.html>.
+ *
+ * The main advantage is that all the read, create, update and delete operations 
+ * can be done offline.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol.SQL>
+ */
+OpenLayers.Protocol.SQL.Gears = OpenLayers.Class(OpenLayers.Protocol.SQL, {
+
+    /**
+     * Property: FID_PREFIX
+     * {String}
+     */
+    FID_PREFIX: '__gears_fid__',
+
+    /**
+     * Property: NULL_GEOMETRY
+     * {String}
+     */
+    NULL_GEOMETRY: '__gears_null_geometry__',
+
+    /**
+     * Property: NULL_FEATURE_STATE
+     * {String}
+     */
+    NULL_FEATURE_STATE: '__gears_null_feature_state__',
+
+    /**
+     * Property: jsonParser
+     * {<OpenLayers.Format.JSON>}
+     */
+    jsonParser: null,
+
+    /**
+     * Property: wktParser
+     * {<OpenLayers.Format.WKT>}
+     */
+    wktParser: null,
+
+    /**
+     * Property: fidRegExp
+     * {RegExp} Regular expression to know whether a feature was
+     *      created in offline mode.
+     */
+    fidRegExp: null,
+
+    /**
+     * Property: saveFeatureState
+     * {Boolean} Whether to save the feature state (<OpenLayers.State>)
+     *      into the database, defaults to true.
+     */    
+    saveFeatureState: true,
+
+    /**
+     * Property: typeOfFid
+     * {String} The type of the feature identifier, either "number" or
+     *      "string", defaults to "string".
+     */
+    typeOfFid: "string",
+
+    /**
+     * Property: db
+     * {GearsDatabase}
+     */
+    db: null,
+
+    /**
+     * Constructor: OpenLayers.Protocol.SQL.Gears
+     */
+    initialize: function(options) {
+        if (!this.supported()) {
+            return;
+        }
+        OpenLayers.Protocol.SQL.prototype.initialize.apply(this, [options]);
+        this.jsonParser = new OpenLayers.Format.JSON();
+        this.wktParser = new OpenLayers.Format.WKT();
+
+        this.fidRegExp = new RegExp('^' + this.FID_PREFIX);
+        this.initializeDatabase();
+
+        
+    },
+
+    /**
+     * Method: initializeDatabase
+     */
+    initializeDatabase: function() {
+        this.db = google.gears.factory.create('beta.database');
+        this.db.open(this.databaseName);
+        this.db.execute(
+            "CREATE TABLE IF NOT EXISTS " + this.tableName +
+            " (fid TEXT UNIQUE, geometry TEXT, properties TEXT," +
+            "  state TEXT)");
+   },
+
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        this.db.close();
+        this.db = null;
+
+        this.jsonParser = null;
+        this.wktParser = null;
+
+        OpenLayers.Protocol.SQL.prototype.destroy.apply(this);
+    },
+
+    /**
+     * APIMethod: supported
+     * Determine whether a browser supports Gears
+     *
+     * Returns:
+     * {Boolean} The browser supports Gears
+     */
+    supported: function() {
+        return !!(window.google && google.gears);
+    },
+
+    /**
+     * APIMethod: read
+     * Read all features from the database and return a
+     * <OpenLayers.Protocol.Response> instance. If the options parameter
+     * contains a callback attribute, the function is called with the response
+     * as a parameter.
+     *
+     * Parameters:
+     * options - {Object} Optional object for configuring the request; it
+     *      can have the {Boolean} property "noFeatureStateReset" which
+     *      specifies if the state of features read from the Gears
+     *      database must be reset to null, if "noFeatureStateReset"
+     *      is undefined or false then each feature's state is reset
+     *      to null, if "noFeatureStateReset" is true the feature state
+     *      is preserved.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *      object.
+     */
+    read: function(options) {
+        OpenLayers.Protocol.prototype.read.apply(this, arguments);
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var feature, features = [];
+        var rs = this.db.execute("SELECT * FROM " + this.tableName);
+        while (rs.isValidRow()) {
+            feature = this.unfreezeFeature(rs);
+            if (this.evaluateFilter(feature, options.filter)) {
+                if (!options.noFeatureStateReset) {
+                    feature.state = null;
+                }
+                features.push(feature);
+            }
+            rs.next();
+        }
+        rs.close();
+
+        var resp = new OpenLayers.Protocol.Response({
+            code: OpenLayers.Protocol.Response.SUCCESS,
+            requestType: "read",
+            features: features
+        });
+
+        if (options && options.callback) {
+            options.callback.call(options.scope, resp);
+        }
+
+        return resp;
+    },
+
+    /**
+     * Method: unfreezeFeature
+     *
+     * Parameters:
+     * row - {ResultSet}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>}
+     */
+    unfreezeFeature: function(row) {
+        var feature;
+        var wkt = row.fieldByName('geometry');
+        if (wkt == this.NULL_GEOMETRY) {
+            feature = new OpenLayers.Feature.Vector();
+        } else {
+            feature = this.wktParser.read(wkt);
+        }
+
+        feature.attributes = this.jsonParser.read(
+            row.fieldByName('properties'));
+
+        feature.fid = this.extractFidFromField(row.fieldByName('fid'));
+
+        var state = row.fieldByName('state');
+        if (state == this.NULL_FEATURE_STATE) {
+            state = null;
+        }
+        feature.state = state;
+
+        return feature;
+    },
+
+    /**
+     * Method: extractFidFromField
+     *
+     * Parameters:
+     * field - {String}
+     *
+     * Returns
+     * {String} or {Number} The fid.
+     */
+    extractFidFromField: function(field) {
+        if (!field.match(this.fidRegExp) && this.typeOfFid == "number") {
+            field = parseFloat(field);
+        }
+        return field;
+    },
+
+    /**
+     * APIMethod: create
+     * Create new features into the database.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *            {<OpenLayers.Feature.Vector>} The features to create in
+     *            the database.
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     *  {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *          object.
+     */
+    create: function(features, options) {
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var resp = this.createOrUpdate(features);
+        resp.requestType = "create";
+
+        if (options && options.callback) {
+            options.callback.call(options.scope, resp);
+        }
+
+        return resp;
+    },
+
+    /**
+     * APIMethod: update
+     * Construct a request updating modified feature.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *            {<OpenLayers.Feature.Vector>} The features to update in
+     *            the database.
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     *  {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *          object.
+     */
+    update: function(features, options) {
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var resp = this.createOrUpdate(features);
+        resp.requestType = "update";
+
+        if (options && options.callback) {
+            options.callback.call(options.scope, resp);
+        }
+
+        return resp;
+    },
+
+    /**
+     * Method: createOrUpdate
+     * Construct a request for updating or creating features in the
+     * database.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *      {<OpenLayers.Feature.Vector>} The feature to create or update
+     *      in the database.
+     *
+     * Returns:
+     *  {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *          object.
+     */
+    createOrUpdate: function(features) {
+        if (!(features instanceof Array)) {
+            features = [features];
+        }
+
+        var i, len = features.length, feature;
+        var insertedFeatures = new Array(len);
+ 
+        for (i = 0; i < len; i++) {
+            feature = features[i];
+            var params = this.freezeFeature(feature);
+            this.db.execute(
+                "REPLACE INTO " + this.tableName + 
+                " (fid, geometry, properties, state)" + 
+                " VALUES (?, ?, ?, ?)",
+                params);
+
+            var clone = feature.clone();
+            clone.fid = this.extractFidFromField(params[0]);
+            insertedFeatures[i] = clone;
+        }
+
+        return new OpenLayers.Protocol.Response({
+            code: OpenLayers.Protocol.Response.SUCCESS,
+            features: insertedFeatures,
+            reqFeatures: features
+        });
+    },
+
+    /**
+     * Method: freezeFeature
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * state - {String} The feature state to store in the database.
+     *
+     * Returns:
+     * {Array}
+     */
+    freezeFeature: function(feature) {
+        // 2 notes:
+        // - fid might not be a string
+        // - getFeatureStateForFreeze needs the feature fid to it's stored
+        //   in the feature here
+        feature.fid = feature.fid != null ?
+            "" + feature.fid : OpenLayers.Util.createUniqueID(this.FID_PREFIX);
+
+        var geometry = feature.geometry != null ?
+            feature.geometry.toString() : this.NULL_GEOMETRY;
+
+        var properties = this.jsonParser.write(feature.attributes);
+
+        var state = this.getFeatureStateForFreeze(feature);
+
+        return [feature.fid, geometry, properties, state];
+    },
+
+    /**
+     * Method: getFeatureStateForFreeze
+     * Get the state of the feature to store into the database.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} The feature.
+     *
+     * Returns
+     * {String} The state
+     */
+    getFeatureStateForFreeze: function(feature) {
+        var state;
+        if (!this.saveFeatureState) {
+            state = this.NULL_FEATURE_STATE;
+        } else if (this.createdOffline(feature)) {
+            // if the feature was created in offline mode, its
+            // state must remain INSERT
+            state = OpenLayers.State.INSERT;
+        } else {
+            state = feature.state;
+        }
+        return state;
+    },
+
+    /**
+     * APIMethod: delete
+     * Delete features from the database.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *            {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *       This object is modified and should not be reused.
+     *
+     * Returns:
+     *  {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *          object.
+     */
+    "delete": function(features, options) {
+        if (!(features instanceof Array)) {
+            features = [features];
+        }
+
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var i, len, feature;
+        for (i = 0, len = features.length; i < len; i++) {
+            feature = features[i];
+
+            // if saveFeatureState is set to true and if the feature wasn't created
+            // in offline mode we don't delete it in the database but just update 
+            // it state column
+            if (this.saveFeatureState && !this.createdOffline(feature)) {
+                var toDelete = feature.clone();
+                toDelete.fid = feature.fid;
+                if (toDelete.geometry) {
+                    toDelete.geometry.destroy();
+                    toDelete.geometry = null;
+                }
+                toDelete.state = feature.state;
+                this.createOrUpdate(toDelete);
+            } else {
+                this.db.execute(
+                    "DELETE FROM " + this.tableName +
+                    " WHERE fid = ?", [feature.fid]);
+            }
+        }
+
+        var resp = new OpenLayers.Protocol.Response({
+            code: OpenLayers.Protocol.Response.SUCCESS,
+            requestType: "delete",
+            reqFeatures: features
+        });
+
+        if (options && options.callback) {
+            options.callback.call(options.scope, resp);
+        }
+
+        return resp;
+    },
+
+    /**
+     * Method: createdOffline
+     * Returns true if the feature had a feature id when it was created in
+     *      the Gears database, false otherwise; this is determined by
+     *      checking the form of the feature's fid value.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     *
+     * Returns:
+     * {Boolean}
+     */
+    createdOffline: function(feature) {
+        return (typeof feature.fid == "string" &&
+                !!(feature.fid.match(this.fidRegExp)));
+    },
+
+    /**
+     * APIMethod: commit
+     * Go over the features and for each take action
+     * based on the feature state. Possible actions are create,
+     * update and delete.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})}
+     * options - {Object} Object whose possible keys are "create", "update",
+     *      "delete", "callback" and "scope", the values referenced by the
+     *      first three are objects as passed to the "create", "update", and
+     *      "delete" methods, the value referenced by the "callback" key is
+     *      a function which is called when the commit operation is complete
+     *      using the scope referenced by the "scope" key.
+     *
+     * Returns:
+     * {Array({<OpenLayers.Protocol.Response>})} An array of
+     *       <OpenLayers.Protocol.Response> objects, one per request made
+     *       to the database.
+     */
+    commit: function(features, options) {
+        var opt, resp = [], nRequests = 0, nResponses = 0;
+
+        function callback(resp) {
+            if (++nResponses < nRequests) {
+                resp.last = false;
+            }
+            this.callUserCallback(options, resp);
+        }
+
+        var feature, toCreate = [], toUpdate = [], toDelete = [];
+        for (var i = features.length - 1; i >= 0; i--) {
+            feature = features[i];
+            switch (feature.state) {
+            case OpenLayers.State.INSERT:
+                toCreate.push(feature);
+                break;
+            case OpenLayers.State.UPDATE:
+                toUpdate.push(feature);
+                break;
+            case OpenLayers.State.DELETE:
+                toDelete.push(feature);
+                break;
+            }
+        }
+        if (toCreate.length > 0) {
+            nRequests++;
+            opt = OpenLayers.Util.applyDefaults(
+                {"callback": callback, "scope": this},
+                options.create
+            );
+            resp.push(this.create(toCreate, opt));
+        }
+        if (toUpdate.length > 0) {
+            nRequests++;
+            opt = OpenLayers.Util.applyDefaults(
+                {"callback": callback, "scope": this},
+                options.update
+            );
+            resp.push(this.update(toUpdate, opt));
+        }
+        if (toDelete.length > 0) {
+            nRequests++;
+            opt = OpenLayers.Util.applyDefaults(
+                {"callback": callback, "scope": this},
+                options["delete"]
+            );
+            resp.push(this["delete"](toDelete, opt));
+        }
+
+        return resp;
+    },
+
+    /**
+     * Method: clear
+     * Removes all rows of the table.
+     */
+    clear: function() {
+        this.db.execute("DELETE FROM " + this.tableName);
+    },
+
+    /**
+     * Method: callUserCallback
+     * This method is called from within commit each time a request is made
+     * to the database, it is responsible for calling the user-supplied
+     * callbacks.
+     *
+     * Parameters:
+     * options - {Object} The map of options passed to the commit call.
+     * resp - {<OpenLayers.Protocol.Response>}
+     */
+    callUserCallback: function(options, resp) {
+        var opt = options[resp.requestType];
+        if (opt && opt.callback) {
+            opt.callback.call(opt.scope, resp);
+        }
+        if (resp.last && options.callback) {
+            options.callback.call(options.scope);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Protocol.SQL.Gears"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_0_0.js	(revision 76)
@@ -0,0 +1,44 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol/WFS/v1.js
+ * @requires OpenLayers/Format/WFST/v1_0_0.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.WFS.v1_0_0
+ * A WFS v1.0.0 protocol for vector layers.  Create a new instance with the
+ *     <OpenLayers.Protocol.WFS.v1_0_0> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol.WFS.v1>
+ */
+OpenLayers.Protocol.WFS.v1_0_0 = OpenLayers.Class(OpenLayers.Protocol.WFS.v1, {
+    
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: "1.0.0",
+    
+    /**
+     * Constructor: OpenLayers.Protocol.WFS.v1_0_0
+     * A class for giving layers WFS v1.0.0 protocol.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (optional).
+     * featurePrefix - {String} Feature namespace alias (optional - only used
+     *     if featureNS is provided).  Default is 'feature'.
+     * geometryName - {String} Name of geometry attribute.  Default is 'the_geom'.
+     */
+   
+    CLASS_NAME: "OpenLayers.Protocol.WFS.v1_0_0" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_1_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_1_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1_1_0.js	(revision 76)
@@ -0,0 +1,48 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol/WFS/v1.js
+ * @requires OpenLayers/Format/WFST/v1_1_0.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.WFS.v1_1_0
+ * A WFS v1.1.0 protocol for vector layers.  Create a new instance with the
+ *     <OpenLayers.Protocol.WFS.v1_1_0> constructor.
+ *
+ * Differences from the v1.0.0 protocol:
+ *  - uses Filter Encoding 1.1.0 instead of 1.0.0
+ *  - uses GML 3 instead of 2 if no format is provided
+ *  
+ * Inherits from:
+ *  - <OpenLayers.Protocol.WFS.v1>
+ */
+OpenLayers.Protocol.WFS.v1_1_0 = OpenLayers.Class(OpenLayers.Protocol.WFS.v1, {
+    
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: "1.1.0",
+    
+    /**
+     * Constructor: OpenLayers.Protocol.WFS.v1_1_0
+     * A class for giving layers WFS v1.1.0 protocol.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (optional).
+     * featurePrefix - {String} Feature namespace alias (optional - only used
+     *     if featureNS is provided).  Default is 'feature'.
+     * geometryName - {String} Name of geometry attribute.  Default is 'the_geom'.
+     */
+   
+    CLASS_NAME: "OpenLayers.Protocol.WFS.v1_1_0"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS/v1.js	(revision 76)
@@ -0,0 +1,342 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol/WFS.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.WFS.v1
+ * Abstract class for for v1.0.0 and v1.1.0 protocol.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol>
+ */
+OpenLayers.Protocol.WFS.v1 = OpenLayers.Class(OpenLayers.Protocol, {
+    
+    /**
+     * Property: version
+     * {String} WFS version number.
+     */
+    version: null,
+    
+    /**
+     * Property: srsName
+     * {String} Name of spatial reference system.  Default is "EPSG:4326".
+     */
+    srsName: "EPSG:4326",
+    
+    /**
+     * Property: featureType
+     * {String} Local feature typeName.
+     */
+    featureType: null,
+    
+    /**
+     * Property: featureNS
+     * {String} Feature namespace.
+     */
+    featureNS: null,
+    
+    /**
+     * Property: geometryName
+     * {String} Name of the geometry attribute for features.  Default is
+     *     "the_geom".
+     */
+    geometryName: "the_geom",
+    
+    /**
+     * Property: schema
+     * {String} Optional schema location that will be included in the
+     *     schemaLocation attribute value.  Note that the feature type schema
+     *     is required for a strict XML validator (on transactions with an
+     *     insert for example), but is *not* required by the WFS specification
+     *     (since the server is supposed to know about feature type schemas).
+     */
+    schema: null,
+
+    /**
+     * Property: featurePrefix
+     * {String} Namespace alias for feature type.  Default is "feature".
+     */
+    featurePrefix: "feature",
+    
+    /**
+     * Property: formatOptions
+     * {Object} Optional options for the format.  If a format is not provided,
+     *     this property can be used to extend the default format options.
+     */
+    formatOptions: null,
+
+    /** 
+     * Property: readFormat 
+     * {<OpenLayers.Format>} For WFS requests it is possible to get a  
+     *     different output format than GML. In that case, we cannot parse  
+     *     the response with the default format (WFST) and we need a different 
+     *     format for reading. 
+     */ 
+    readFormat: null,     
+    
+    /**
+     * Constructor: OpenLayers.Protocol.WFS
+     * A class for giving layers WFS protocol.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options properties:
+     * url - {String} URL to send requests to (required).
+     * featureType - {String} Local (without prefix) feature typeName (required).
+     * featureNS - {String} Feature namespace (required, but can be autodetected
+     *     for reading if featurePrefix is provided and identical to the prefix
+     *     in the server response).
+     * featurePrefix - {String} Feature namespace alias (optional - only used
+     *     for writing if featureNS is provided).  Default is 'feature'.
+     * geometryName - {String} Name of geometry attribute.  Default is 'the_geom'.
+     */
+    initialize: function(options) {
+        OpenLayers.Protocol.prototype.initialize.apply(this, [options]);
+        if(!options.format) {
+            this.format = OpenLayers.Format.WFST(OpenLayers.Util.extend({
+                version: this.version,
+                featureType: this.featureType,
+                featureNS: this.featureNS,
+                featurePrefix: this.featurePrefix,
+                geometryName: this.geometryName,
+                srsName: this.srsName,
+                schema: this.schema
+            }, this.formatOptions));
+        }
+        if(!this.featureNS && this.featurePrefix) {
+            // featureNS autodetection
+            var readNode = this.format.readNode;
+            this.format.readNode = function(node, obj) {
+                if(!this.featureNS && node.prefix == this.featurePrefix) {
+                    this.featureNS = node.namespaceURI;
+                    this.setNamespace("feature", this.featureNS);
+                }
+                return readNode.apply(this, arguments);
+            };
+        }
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        if(this.options && !this.options.format) {
+            this.format.destroy();
+        }
+        this.format = null;
+        OpenLayers.Protocol.prototype.destroy.apply(this);
+    },
+
+    /**
+     * Method: read
+     * Construct a request for reading new features.  Since WFS splits the
+     *     basic CRUD operations into GetFeature requests (for read) and
+     *     Transactions (for all others), this method does not make use of the
+     *     format's read method (that is only about reading transaction
+     *     responses).
+     */
+    read: function(options) {
+        OpenLayers.Protocol.prototype.read.apply(this, arguments);
+        options = OpenLayers.Util.extend({}, options);
+        OpenLayers.Util.applyDefaults(options, this.options || {});
+        var response = new OpenLayers.Protocol.Response({requestType: "read"});
+        
+        var data = OpenLayers.Format.XML.prototype.write.apply(
+            this.format, [this.format.writeNode("wfs:GetFeature", options)]
+        );
+
+        response.priv = OpenLayers.Request.POST({
+            url: options.url,
+            callback: this.createCallback(this.handleRead, response, options),
+            params: options.params,
+            headers: options.headers,
+            data: data
+        });        
+
+        return response;
+    },
+    
+    /**
+     * Method: handleRead
+     * Deal with response from the read request.
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>} The response object to pass
+     *     to the user callback.
+     * options - {Object} The user options passed to the read call.
+     */
+    handleRead: function(response, options) {
+        if(options.callback) {
+            var request = response.priv;
+            if(request.status >= 200 && request.status < 300) {
+                // success
+                response.features = this.parseFeatures(request);
+                response.code = OpenLayers.Protocol.Response.SUCCESS;
+            } else {
+                // failure
+                response.code = OpenLayers.Protocol.Response.FAILURE;
+            }
+            options.callback.call(options.scope, response);
+        }
+    },
+
+    /**
+     * Method: parseFeatures
+     * Read HTTP response body and return features
+     *
+     * Parameters:
+     * request - {XMLHttpRequest} The request object
+     *
+     * Returns:
+     * {Array({<OpenLayers.Feature.Vector>})} or
+     *     {<OpenLayers.Feature.Vector>} Array of features or a single feature.
+     */
+    parseFeatures: function(request) {
+        var doc = request.responseXML;
+        if(!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        if(!doc || doc.length <= 0) {
+            return null;
+        }
+        return (this.readFormat !== null) ? this.readFormat.read(doc) : 
+            this.format.read(doc);
+    },
+
+    /**
+     * Method: commit
+     * Given a list of feature, assemble a batch request for update, create,
+     *     and delete transactions.  A commit call on the prototype amounts
+     *     to writing a WFS transaction - so the write method on the format
+     *     is used.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>}
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} A response object with a features
+     *     property containing any insertIds and a priv property referencing
+     *     the XMLHttpRequest object.
+     */
+    commit: function(features, options) {
+
+        options = OpenLayers.Util.extend({}, options);
+        OpenLayers.Util.applyDefaults(options, this.options);
+        
+        var response = new OpenLayers.Protocol.Response({
+            requestType: "commit",
+            reqFeatures: features
+        });
+        response.priv = OpenLayers.Request.POST({
+            url: options.url,
+            data: this.format.write(features, options),
+            callback: this.createCallback(this.handleCommit, response, options)
+        });
+        
+        return response;
+    },
+    
+    /**
+     * Method: handleCommit
+     * Called when the commit request returns.
+     * 
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>} The response object to pass
+     *     to the user callback.
+     * options - {Object} The user options passed to the commit call.
+     */
+    handleCommit: function(response, options) {
+        if(options.callback) {
+            var request = response.priv;
+
+            // ensure that we have an xml doc
+            var data = request.responseXML;
+            if(!data || !data.documentElement) {
+                data = request.responseText;
+            }
+            
+            var obj = this.format.read(data) || {};
+            
+            response.insertIds = obj.insertIds || [];
+            response.code = (obj.success) ?
+                OpenLayers.Protocol.Response.SUCCESS :
+                OpenLayers.Protocol.Response.FAILURE;
+            options.callback.call(options.scope, response);
+        }
+    },
+    
+    /**
+     * Method: filterDelete
+     * Send a request that deletes all features by their filter.
+     * 
+     * Parameters:
+     * filter - {OpenLayers.Filter} filter
+     */
+    filterDelete: function(filter, options) {
+        options = OpenLayers.Util.extend({}, options);
+        OpenLayers.Util.applyDefaults(options, this.options);    
+        
+        var response = new OpenLayers.Protocol.Response({
+            requestType: "commit"
+        });    
+        
+        var root = this.format.createElementNSPlus("wfs:Transaction", {
+            attributes: {
+                service: "WFS",
+                version: this.version
+            }
+        });
+        
+        var deleteNode = this.format.createElementNSPlus("wfs:Delete", {
+            attributes: {
+                typeName: (options.featureNS ? this.featurePrefix + ":" : "") +
+                    options.featureType
+            }
+        });       
+        
+        if(options.featureNS) {
+            deleteNode.setAttribute("xmlns:" + this.featurePrefix, options.featureNS);
+        }
+        var filterNode = this.format.writeNode("ogc:Filter", filter);
+        
+        deleteNode.appendChild(filterNode);
+        
+        root.appendChild(deleteNode);
+        
+        var data = OpenLayers.Format.XML.prototype.write.apply(
+            this.format, [root]
+        );
+        
+        return OpenLayers.Request.POST({
+            url: this.url,
+            callback : options.callback || function(){},
+            data: data
+        });   
+        
+    },
+
+    /**
+     * Method: abort
+     * Abort an ongoing request, the response object passed to
+     * this method must come from this protocol (as a result
+     * of a read, or commit operation).
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>}
+     */
+    abort: function(response) {
+        if (response) {
+            response.priv.abort();
+        }
+    },
+  
+    CLASS_NAME: "OpenLayers.Protocol.WFS.v1" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS/v1_0_0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS/v1_0_0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SOS/v1_0_0.js	(revision 76)
@@ -0,0 +1,132 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol/SOS.js
+ * @requires OpenLayers/Format/SOSGetFeatureOfInterest.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.SOS.v1_0_0
+ * An SOS v1.0.0 Protocol for vector layers.  Create a new instance with the
+ *     <OpenLayers.Protocol.SOS.v1_0_0> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol>
+ */
+ OpenLayers.Protocol.SOS.v1_0_0 = OpenLayers.Class(OpenLayers.Protocol, {
+
+    /**
+     * APIProperty: fois
+     * {Array(String)} Array of features of interest (foi)
+     */
+    fois: null,
+
+    /**
+     * Property: formatOptions
+     * {Object} Optional options for the format.  If a format is not provided,
+     *     this property can be used to extend the default format options.
+     */
+    formatOptions: null,
+   
+    /**
+     * Constructor: OpenLayers.Protocol.SOS
+     * A class for giving layers an SOS protocol.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     * Valid options properties:
+     * url - {String} URL to send requests to (required).
+     * fois - {Array} The features of interest (required).
+     */
+    initialize: function(options) {
+        OpenLayers.Protocol.prototype.initialize.apply(this, [options]);
+        if(!options.format) {
+            this.format = new OpenLayers.Format.SOSGetFeatureOfInterest(
+                this.formatOptions);
+        }
+    },
+   
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        if(this.options && !this.options.format) {
+            this.format.destroy();
+        }
+        this.format = null;
+        OpenLayers.Protocol.prototype.destroy.apply(this);
+    },
+
+    /**
+     * APIMethod: read
+     * Construct a request for reading new sensor positions. This is done by
+     *     issuing one GetFeatureOfInterest request.
+     */
+    read: function(options) {
+        options = OpenLayers.Util.extend({}, options);
+        OpenLayers.Util.applyDefaults(options, this.options || {});
+        var response = new OpenLayers.Protocol.Response({requestType: "read"});
+        var format = this.format;
+        var data = OpenLayers.Format.XML.prototype.write.apply(format,
+            [format.writeNode("sos:GetFeatureOfInterest", {fois: this.fois})]
+        );
+        response.priv = OpenLayers.Request.POST({
+            url: options.url,
+            callback: this.createCallback(this.handleRead, response, options),
+            data: data
+        });
+        return response;
+    },
+   
+    /**
+     * Method: handleRead
+     * Deal with response from the read request.
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>} The response object to pass
+     *     to the user callback.
+     * options - {Object} The user options passed to the read call.
+     */
+    handleRead: function(response, options) {
+        if(options.callback) {
+            var request = response.priv;
+            if(request.status >= 200 && request.status < 300) {
+                // success
+                response.features = this.parseFeatures(request);
+                response.code = OpenLayers.Protocol.Response.SUCCESS;
+            } else {
+                // failure
+                response.code = OpenLayers.Protocol.Response.FAILURE;
+            }
+            options.callback.call(options.scope, response);
+        }
+    },
+
+    /**
+     * Method: parseFeatures
+     * Read HTTP response body and return features
+     *
+     * Parameters:
+     * request - {XMLHttpRequest} The request object
+     *
+     * Returns:
+     * {Array({<OpenLayers.Feature.Vector>})} Array of features
+     */
+    parseFeatures: function(request) {
+        var doc = request.responseXML;
+        if(!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        if(!doc || doc.length <= 0) {
+            return null;
+        }
+        return this.format.read(doc);
+    },
+
+    CLASS_NAME: "OpenLayers.Protocol.SOS.v1_0_0"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/HTTP.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/HTTP.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/HTTP.js	(revision 76)
@@ -0,0 +1,655 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Filter/Spatial.js
+ * @requires OpenLayers/Filter/Comparison.js
+ * @requires OpenLayers/Filter/Logical.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.HTTP
+ * A basic HTTP protocol for vector layers.  Create a new instance with the
+ *     <OpenLayers.Protocol.HTTP> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol>
+ */
+OpenLayers.Protocol.HTTP = OpenLayers.Class(OpenLayers.Protocol, {
+
+    /**
+     * Property: url
+     * {String} Service URL, read-only, set through the options
+     *     passed to constructor.
+     */
+    url: null,
+
+    /**
+     * Property: headers
+     * {Object} HTTP request headers, read-only, set through the options
+     *     passed to the constructor,
+     *     Example: {'Content-Type': 'plain/text'}
+     */
+    headers: null,
+
+    /**
+     * Property: params
+     * {Object} Parameters of GET requests, read-only, set through the options
+     *     passed to the constructor,
+     *     Example: {'bbox': '5,5,5,5'}
+     */
+    params: null,
+    
+    /**
+     * Property: callback
+     * {Object} Function to be called when the <read>, <create>,
+     *     <update>, <delete> or <commit> operation completes, read-only,
+     *     set through the options passed to the constructor.
+     */
+    callback: null,
+
+    /**
+     * Property: scope
+     * {Object} Callback execution scope, read-only, set through the
+     *     options passed to the constructor.
+     */
+    scope: null,
+
+    /**
+     * Property: readWithPOST
+     * {Boolean} true if read operations are done with POST requests
+     *     instead of GET, defaults to false.
+     */
+    readWithPOST: false,
+
+    /**
+     * Property: wildcarded.
+     * {Boolean} If true percent signs are added around values
+     *     read from LIKE filters, for example if the protocol
+     *     read method is passed a LIKE filter whose property
+     *     is "foo" and whose value is "bar" the string
+     *     "foo__ilike=%bar%" will be sent in the query string;
+     *     defaults to false.
+     */
+    wildcarded: false,
+
+    /**
+     * Constructor: OpenLayers.Protocol.HTTP
+     * A class for giving layers generic HTTP protocol.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     *
+     * Valid options include:
+     * url - {String}
+     * headers - {Object} 
+     * params - {Object}
+     * format - {<OpenLayers.Format>}
+     * callback - {Function}
+     * scope - {Object}
+     */
+    initialize: function(options) {
+        options = options || {};
+        this.params = {};
+        this.headers = {};
+        OpenLayers.Protocol.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        this.params = null;
+        this.headers = null;
+        OpenLayers.Protocol.prototype.destroy.apply(this);
+    },
+   
+    /**
+     * APIMethod: read
+     * Construct a request for reading new features.
+     *
+     * Parameters:
+     * options - {Object} Optional object for configuring the request.
+     *     This object is modified and should not be reused.
+     *
+     * Valid options:
+     * url - {String} Url for the request.
+     * params - {Object} Parameters to get serialized as a query string.
+     * headers - {Object} Headers to be set on the request.
+     * filter - {<OpenLayers.Filter>} Filter to get serialized as a
+     *     query string.
+     * readWithPOST - {Boolean} If the request should be done with POST.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} A response object, whose "priv" property
+     *     references the HTTP request, this object is also passed to the
+     *     callback function when the request completes, its "features" property
+     *     is then populated with the the features received from the server.
+     */
+    read: function(options) {
+        OpenLayers.Protocol.prototype.read.apply(this, arguments);
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+        options.params = OpenLayers.Util.applyDefaults(
+            options.params, this.options.params);
+        if(options.filter) {
+            options.params = this.filterToParams(
+                options.filter, options.params);
+        }
+        var readWithPOST = (options.readWithPOST !== undefined) ?
+                           options.readWithPOST : this.readWithPOST;
+        var resp = new OpenLayers.Protocol.Response({requestType: "read"});
+        if(readWithPOST) {
+            resp.priv = OpenLayers.Request.POST({
+                url: options.url,
+                callback: this.createCallback(this.handleRead, resp, options),
+                data: OpenLayers.Util.getParameterString(options.params),
+                headers: {
+                    "Content-Type": "application/x-www-form-urlencoded"
+                }
+            });
+        } else {
+            resp.priv = OpenLayers.Request.GET({
+                url: options.url,
+                callback: this.createCallback(this.handleRead, resp, options),
+                params: options.params,
+                headers: options.headers
+            });
+        }
+        return resp;
+    },
+
+    /**
+     * Method: handleRead
+     * Individual callbacks are created for read, create and update, should
+     *     a subclass need to override each one separately.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object to pass to
+     *     the user callback.
+     * options - {Object} The user options passed to the read call.
+     */
+    handleRead: function(resp, options) {
+        this.handleResponse(resp, options);
+    },
+
+    /**
+     * Method: filterToParams
+     * Convert an <OpenLayers.Filter> object to parameters.
+     *
+     * Parameters:
+     * filter - {OpenLayers.Filter} filter to convert.
+     * params - {Object} The parameters object.
+     *
+     * Returns:
+     * {Object} The resulting parameters object.
+     */
+    filterToParams: function(filter, params) {
+        params = params || {};
+        var className = filter.CLASS_NAME;
+        var filterType = className.substring(className.lastIndexOf(".") + 1);
+        switch(filterType) {
+            case "Spatial":
+                switch(filter.type) {
+                    case OpenLayers.Filter.Spatial.BBOX:
+                        params.bbox = filter.value.toArray();
+                        break;
+                    case OpenLayers.Filter.Spatial.DWITHIN:
+                        params.tolerance = filter.distance;
+                        // no break here
+                    case OpenLayers.Filter.Spatial.WITHIN:
+                        params.lon = filter.value.x;
+                        params.lat = filter.value.y;
+                        break;
+                    default:
+                        OpenLayers.Console.warn(
+                            "Unknown spatial filter type " + filter.type);
+                }
+                break;
+            case "Comparison":
+                var op = OpenLayers.Protocol.HTTP.COMP_TYPE_TO_OP_STR[filter.type];
+                if(op !== undefined) {
+                    var value = filter.value;
+                    if(filter.type == OpenLayers.Filter.Comparison.LIKE) {
+                        value = this.regex2value(value);
+                        if(this.wildcarded) {
+                            value = "%" + value + "%";
+                        }
+                    }
+                    params[filter.property + "__" + op] = value;
+                    params.queryable = params.queryable || [];
+                    params.queryable.push(filter.property);
+                } else {
+                    OpenLayers.Console.warn(
+                        "Unknown comparison filter type " + filter.type);
+                }
+                break;
+            case "Logical":
+                if(filter.type === OpenLayers.Filter.Logical.AND) {
+                    for(var i=0,len=filter.filters.length; i<len; i++) {
+                        params = this.filterToParams(filter.filters[i], params);
+                    }
+                } else {
+                    OpenLayers.Console.warn(
+                        "Unsupported logical filter type " + filter.type);
+                }
+                break;
+            default:
+                OpenLayers.Console.warn("Unknown filter type " + filterType);
+        }
+        return params;
+    },
+
+    /**
+     * Method: regex2value
+     * Convert the value from a regular expression string to a LIKE/ILIKE
+     * string known to the web service.
+     *
+     * Parameters:
+     * value - {String} The regex string.
+     *
+     * Returns:
+     * {String} The converted string.
+     */
+    regex2value: function(value) {
+
+        // highly sensitive!! Do not change this without running the
+        // Protocol/HTTP.html unit tests
+
+        // convert % to \%
+        value = value.replace(/%/g, "\\%");
+
+        // convert \\. to \\_ (\\.* occurences converted later)
+        value = value.replace(/\\\\\.(\*)?/g, function($0, $1) {
+            return $1 ? $0 : "\\\\_";
+        });
+
+        // convert \\.* to \\%
+        value = value.replace(/\\\\\.\*/g, "\\\\%");
+
+        // convert . to _ (\. and .* occurences converted later)
+        value = value.replace(/(\\)?\.(\*)?/g, function($0, $1, $2) {
+            return $1 || $2 ? $0 : "_";
+        });
+
+        // convert .* to % (\.* occurnces converted later)
+        value = value.replace(/(\\)?\.\*/g, function($0, $1) {
+            return $1 ? $0 : "%";
+        });
+
+        // convert \. to .
+        value = value.replace(/\\\./g, ".");
+
+        // replace \* with * (watching out for \\*)
+        value = value.replace(/(\\)?\\\*/g, function($0, $1) {
+            return $1 ? $0 : "*";
+        });
+
+        return value;
+    },
+
+    /**
+     * APIMethod: create
+     * Construct a request for writing newly created features.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *     {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *     This object is modified and should not be reused.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *     object, whose "priv" property references the HTTP request, this 
+     *     object is also passed to the callback function when the request
+     *     completes, its "features" property is then populated with the
+     *     the features received from the server.
+     */
+    create: function(features, options) {
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var resp = new OpenLayers.Protocol.Response({
+            reqFeatures: features,
+            requestType: "create"
+        });
+
+        resp.priv = OpenLayers.Request.POST({
+            url: options.url,
+            callback: this.createCallback(this.handleCreate, resp, options),
+            headers: options.headers,
+            data: this.format.write(features)
+        });
+
+        return resp;
+    },
+
+    /**
+     * Method: handleCreate
+     * Called the the request issued by <create> is complete.  May be overridden
+     *     by subclasses.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object to pass to
+     *     any user callback.
+     * options - {Object} The user options passed to the create call.
+     */
+    handleCreate: function(resp, options) {
+        this.handleResponse(resp, options);
+    },
+
+    /**
+     * APIMethod: update
+     * Construct a request updating modified feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *     This object is modified and should not be reused.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *     object, whose "priv" property references the HTTP request, this 
+     *     object is also passed to the callback function when the request
+     *     completes, its "features" property is then populated with the
+     *     the feature received from the server.
+     */
+    update: function(feature, options) {
+        options = options || {};
+        var url = options.url ||
+                  feature.url ||
+                  this.options.url + "/" + feature.fid;
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var resp = new OpenLayers.Protocol.Response({
+            reqFeatures: feature,
+            requestType: "update"
+        });
+
+        resp.priv = OpenLayers.Request.PUT({
+            url: url,
+            callback: this.createCallback(this.handleUpdate, resp, options),
+            headers: options.headers,
+            data: this.format.write(feature)
+        });
+
+        return resp;
+    },
+
+    /**
+     * Method: handleUpdate
+     * Called the the request issued by <update> is complete.  May be overridden
+     *     by subclasses.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object to pass to
+     *     any user callback.
+     * options - {Object} The user options passed to the update call.
+     */
+    handleUpdate: function(resp, options) {
+        this.handleResponse(resp, options);
+    },
+
+    /**
+     * APIMethod: delete
+     * Construct a request deleting a removed feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *     This object is modified and should not be reused.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     *     object, whose "priv" property references the HTTP request, this 
+     *     object is also passed to the callback function when the request
+     *     completes.
+     */
+    "delete": function(feature, options) {
+        options = options || {};
+        var url = options.url ||
+                  feature.url ||
+                  this.options.url + "/" + feature.fid;
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+
+        var resp = new OpenLayers.Protocol.Response({
+            reqFeatures: feature,
+            requestType: "delete"
+        });
+
+        resp.priv = OpenLayers.Request.DELETE({
+            url: url,
+            callback: this.createCallback(this.handleDelete, resp, options),
+            headers: options.headers
+        });
+
+        return resp;
+    },
+
+    /**
+     * Method: handleDelete
+     * Called the the request issued by <delete> is complete.  May be overridden
+     *     by subclasses.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object to pass to
+     *     any user callback.
+     * options - {Object} The user options passed to the delete call.
+     */
+    handleDelete: function(resp, options) {
+        this.handleResponse(resp, options);
+    },
+
+    /**
+     * Method: handleResponse
+     * Called by CRUD specific handlers.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>} The response object to pass to
+     *     any user callback.
+     * options - {Object} The user options passed to the create, read, update,
+     *     or delete call.
+     */
+    handleResponse: function(resp, options) {
+        var request = resp.priv;
+        if(options.callback) {
+            if(request.status >= 200 && request.status < 300) {
+                // success
+                if(resp.requestType != "delete") {
+                    resp.features = this.parseFeatures(request);
+                }
+                resp.code = OpenLayers.Protocol.Response.SUCCESS;
+            } else {
+                // failure
+                resp.code = OpenLayers.Protocol.Response.FAILURE;
+            }
+            options.callback.call(options.scope, resp);
+        }
+    },
+
+    /**
+     * Method: parseFeatures
+     * Read HTTP response body and return features.
+     *
+     * Parameters:
+     * request - {XMLHttpRequest} The request object
+     *
+     * Returns:
+     * {Array({<OpenLayers.Feature.Vector>})} or
+     *     {<OpenLayers.Feature.Vector>} Array of features or a single feature.
+     */
+    parseFeatures: function(request) {
+        var doc = request.responseXML;
+        if (!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        if (!doc || doc.length <= 0) {
+            return null;
+        }
+        return this.format.read(doc);
+    },
+
+    /**
+     * APIMethod: commit
+     * Iterate over each feature and take action based on the feature state.
+     *     Possible actions are create, update and delete.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})}
+     * options - {Object} Optional object for setting up intermediate commit
+     *     callbacks.
+     *
+     * Valid options:
+     * create - {Object} Optional object to be passed to the <create> method.
+     * update - {Object} Optional object to be passed to the <update> method.
+     * delete - {Object} Optional object to be passed to the <delete> method.
+     * callback - {Function} Optional function to be called when the commit
+     *     is complete.
+     * scope - {Object} Optional object to be set as the scope of the callback.
+     *
+     * Returns:
+     * {Array(<OpenLayers.Protocol.Response>)} An array of response objects,
+     *     one per request made to the server, each object's "priv" property
+     *     references the corresponding HTTP request.
+     */
+    commit: function(features, options) {
+        options = OpenLayers.Util.applyDefaults(options, this.options);
+        var resp = [], nResponses = 0;
+        
+        // Divide up features before issuing any requests.  This properly
+        // counts requests in the event that any responses come in before
+        // all requests have been issued.
+        var types = {};
+        types[OpenLayers.State.INSERT] = [];
+        types[OpenLayers.State.UPDATE] = [];
+        types[OpenLayers.State.DELETE] = [];
+        var feature, list, requestFeatures = [];
+        for(var i=0, len=features.length; i<len; ++i) {
+            feature = features[i];
+            list = types[feature.state];
+            if(list) {
+                list.push(feature);
+                requestFeatures.push(feature); 
+            }
+        }
+        // tally up number of requests
+        var nRequests = (types[OpenLayers.State.INSERT].length > 0 ? 1 : 0) +
+            types[OpenLayers.State.UPDATE].length +
+            types[OpenLayers.State.DELETE].length;
+        
+        // This response will be sent to the final callback after all the others
+        // have been fired.
+        var success = true;
+        var finalResponse = new OpenLayers.Protocol.Response({
+            reqFeatures: requestFeatures        
+        });
+        
+        function insertCallback(response) {
+            var len = response.features ? response.features.length : 0;
+            var fids = new Array(len);
+            for(var i=0; i<len; ++i) {
+                fids[i] = response.features[i].fid;
+            }   
+            finalResponse.insertIds = fids;
+            callback.apply(this, [response]);
+        }
+ 
+        function callback(response) {
+            this.callUserCallback(response, options);
+            success = success && response.success();
+            nResponses++;
+            if (nResponses >= nRequests) {
+                if (options.callback) {
+                    finalResponse.code = success ? 
+                        OpenLayers.Protocol.Response.SUCCESS :
+                        OpenLayers.Protocol.Response.FAILURE;
+                    options.callback.apply(options.scope, [finalResponse]);
+                }    
+            }
+        }
+
+        // start issuing requests
+        var queue = types[OpenLayers.State.INSERT];
+        if(queue.length > 0) {
+            resp.push(this.create(
+                queue, OpenLayers.Util.applyDefaults(
+                    {callback: insertCallback, scope: this}, options.create
+                )
+            ));
+        }
+        queue = types[OpenLayers.State.UPDATE];
+        for(var i=queue.length-1; i>=0; --i) {
+            resp.push(this.update(
+                queue[i], OpenLayers.Util.applyDefaults(
+                    {callback: callback, scope: this}, options.update
+                ))
+            );
+        }
+        queue = types[OpenLayers.State.DELETE];
+        for(var i=queue.length-1; i>=0; --i) {
+            resp.push(this["delete"](
+                queue[i], OpenLayers.Util.applyDefaults(
+                    {callback: callback, scope: this}, options["delete"]
+                ))
+            );
+        }
+        return resp;
+    },
+
+    /**
+     * APIMethod: abort
+     * Abort an ongoing request, the response object passed to
+     * this method must come from this HTTP protocol (as a result
+     * of a create, read, update, delete or commit operation).
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>}
+     */
+    abort: function(response) {
+        if (response) {
+            response.priv.abort();
+        }
+    },
+
+    /**
+     * Method: callUserCallback
+     * This method is used from within the commit method each time an
+     *     an HTTP response is received from the server, it is responsible
+     *     for calling the user-supplied callbacks.
+     *
+     * Parameters:
+     * resp - {<OpenLayers.Protocol.Response>}
+     * options - {Object} The map of options passed to the commit call.
+     */
+    callUserCallback: function(resp, options) {
+        var opt = options[resp.requestType];
+        if(opt && opt.callback) {
+            opt.callback.call(opt.scope, resp);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Protocol.HTTP" 
+});
+
+/**
+ * Property: OpenLayers.Protocol.HTTP.COMP_TYPE_TO_OP_STR
+ * {Object} A private class-level property mapping the
+ *     OpenLayers.Filter.Comparison types to the operation
+ *     strings of the protocol.
+ */
+(function() {
+    var o = OpenLayers.Protocol.HTTP.COMP_TYPE_TO_OP_STR = {};
+    o[OpenLayers.Filter.Comparison.EQUAL_TO]                 = "eq";
+    o[OpenLayers.Filter.Comparison.NOT_EQUAL_TO]             = "ne";
+    o[OpenLayers.Filter.Comparison.LESS_THAN]                = "lt";
+    o[OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO]    = "lte";
+    o[OpenLayers.Filter.Comparison.GREATER_THAN]             = "gt";
+    o[OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO] = "gte";
+    o[OpenLayers.Filter.Comparison.LIKE]                     = "ilike";
+})();
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/SQL.js	(revision 76)
@@ -0,0 +1,88 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol.js
+ */
+
+/**
+ * Class: OpenLayers.Protocol.SQL
+ * Abstract SQL protocol class.  Not to be instantiated directly.  Use
+ *     one of the SQL protocol subclasses instead.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Protocol>
+ */
+OpenLayers.Protocol.SQL = OpenLayers.Class(OpenLayers.Protocol, {
+
+    /**
+     * APIProperty: databaseName
+     * {String}
+     */
+    databaseName: 'ol',
+
+    /**
+     * APIProperty: tableName
+     * Name of the database table into which Features should be saved.
+     */
+    tableName: "ol_vector_features",
+
+    /**
+     * Property: postReadFiltering
+     * {Boolean} Whether the filter (if there's one) must be applied after
+     *      the features have been read from the database; for example the
+     *      BBOX strategy passes the read method a BBOX spatial filter, if
+     *      postReadFiltering is true every feature read from the database
+     *      will go through the BBOX spatial filter, which can be costly;
+     *      defaults to true.
+     */
+    postReadFiltering: true,
+
+    /**
+     * Constructor: OpenLayers.Protocol.SQL
+     */
+    initialize: function(options) {
+        OpenLayers.Protocol.prototype.initialize.apply(this, [options]);
+    },
+
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        OpenLayers.Protocol.prototype.destroy.apply(this);
+    },
+
+    /**
+     * APIMethod: supported
+     * This should be overridden by specific subclasses
+     *
+     * Returns:
+     * {Boolean} Whether or not the browser supports the SQL backend
+     */
+    supported: function() {
+        return false;
+    },
+
+    /**
+     * Method: evaluateFilter
+     * If postReadFiltering is true evaluate the filter against the feature
+     * and return the result of the evaluation, otherwise return true.
+     *
+     * Parameters:
+     * {<OpenLayers.Feature.Vector>} The feature.
+     * {<OpenLayers.Filter>} The filter.
+     *
+     * Returns:
+     * {Boolean} true if postReadFiltering if false, the result of the
+     * filter evaluation otherwise.
+     */
+    evaluateFilter: function(feature, filter) {
+        return filter && this.postReadFiltering ?
+            filter.evaluate(feature) : true;
+    },
+
+    CLASS_NAME: "OpenLayers.Protocol.SQL"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol/WFS.js	(revision 76)
@@ -0,0 +1,71 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Protocol.js
+ */
+
+/**
+ * Function: OpenLayers.Protocol.WFS
+ * Used to create a versioned WFS protocol.  Default version is 1.0.0.
+ *
+ * Returns:
+ * {<OpenLayers.Protocol>} A WFS protocol of the given version.
+ */
+OpenLayers.Protocol.WFS = function(options) {
+    options = OpenLayers.Util.applyDefaults(
+        options, OpenLayers.Protocol.WFS.DEFAULTS
+    );
+    var cls = OpenLayers.Protocol.WFS["v"+options.version.replace(/\./g, "_")];
+    if(!cls) {
+        throw "Unsupported WFS version: " + options.version;
+    }
+    return new cls(options);
+};
+
+/**
+ * Function: OpenLayers.Protocol.WFS.fromWMSLayer
+ * Convenience function to create a WFS protocol from a WMS layer.  This makes
+ *     the assumption that a WFS requests can be issued at the same URL as
+ *     WMS requests and that a WFS featureType exists with the same name as the
+ *     WMS layer.
+ *     
+ * This function is designed to auto-configure <url>, <featureType>,
+ *     <featurePrefix> and <srsName> for WFS <version> 1.1.0. Note that
+ *     srsName matching with the WMS layer will not work with WFS 1.0.0..
+ * 
+ * Parameters:
+ * layer - {<OpenLayers.Layer.WMS>} WMS layer that has a matching WFS
+ *     FeatureType at the same server url with the same typename.
+ * options - {Object} Default properties to be set on the protocol.
+ *
+ */
+OpenLayers.Protocol.WFS.fromWMSLayer = function(layer, options) {
+    var typeName, featurePrefix;
+    var param = layer.params["LAYERS"];
+    var parts = (param instanceof Array ? param[0] : param).split(":");
+    if(parts.length > 1) {
+        featurePrefix = parts[0];
+    }
+    typeName = parts.pop();
+    var protocolOptions = {
+        url: layer.url,
+        featureType: typeName,
+        featurePrefix: featurePrefix,
+        srsName: layer.projection && layer.projection.getCode() ||
+                 layer.map && layer.map.getProjectionObject().getCode(),
+        version: "1.1.0"
+    };
+    return new OpenLayers.Protocol.WFS(OpenLayers.Util.applyDefaults(
+        options, protocolOptions
+    ));
+};
+
+/**
+ * Constant: OpenLayers.Protocol.WFS.DEFAULTS
+ */
+OpenLayers.Protocol.WFS.DEFAULTS = {
+    "version": "1.0.0"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Icon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Icon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Icon.js	(revision 76)
@@ -0,0 +1,227 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Icon
+ * 
+ * The icon represents a graphical icon on the screen.  Typically used in
+ * conjunction with a <OpenLayers.Marker> to represent markers on a screen.
+ *
+ * An icon has a url, size and position.  It also contains an offset which 
+ * allows the center point to be represented correctly.  This can be
+ * provided either as a fixed offset or a function provided to calculate
+ * the desired offset. 
+ * 
+ */
+OpenLayers.Icon = OpenLayers.Class({
+    
+    /** 
+     * Property: url 
+     * {String}  image url
+     */
+    url: null,
+    
+    /** 
+     * Property: size 
+     * {<OpenLayers.Size>} 
+     */
+    size: null,
+
+    /** 
+     * Property: offset 
+     * {<OpenLayers.Pixel>} distance in pixels to offset the image when being rendered
+     */
+    offset: null,    
+    
+    /** 
+     * Property: calculateOffset 
+     * {<OpenLayers.Pixel>} Function to calculate the offset (based on the size) 
+     */
+    calculateOffset: null,    
+    
+    /** 
+     * Property: imageDiv 
+     * {DOMElement} 
+     */
+    imageDiv: null,
+
+    /** 
+     * Property: px 
+     * {<OpenLayers.Pixel>} 
+     */
+    px: null,
+    
+    /** 
+     * Constructor: OpenLayers.Icon
+     * Creates an icon, which is an image tag in a div.  
+     *
+     * url - {String} 
+     * size - {<OpenLayers.Size>} 
+     * offset - {<OpenLayers.Pixel>}
+     * calculateOffset - {Function} 
+     */
+    initialize: function(url, size, offset, calculateOffset) {
+        this.url = url;
+        this.size = (size) ? size : new OpenLayers.Size(20,20);
+        this.offset = offset ? offset : new OpenLayers.Pixel(-(this.size.w/2), -(this.size.h/2));
+        this.calculateOffset = calculateOffset;
+
+        var id = OpenLayers.Util.createUniqueID("OL_Icon_");
+        this.imageDiv = OpenLayers.Util.createAlphaImageDiv(id);
+    },
+    
+    /** 
+     * Method: destroy
+     * Nullify references and remove event listeners to prevent circular 
+     * references and memory leaks
+     */
+    destroy: function() {
+        // erase any drawn elements
+        this.erase();
+
+        OpenLayers.Event.stopObservingElement(this.imageDiv.firstChild); 
+        this.imageDiv.innerHTML = "";
+        this.imageDiv = null;
+    },
+
+    /** 
+     * Method: clone
+     * 
+     * Returns:
+     * {<OpenLayers.Icon>} A fresh copy of the icon.
+     */
+    clone: function() {
+        return new OpenLayers.Icon(this.url, 
+                                   this.size, 
+                                   this.offset, 
+                                   this.calculateOffset);
+    },
+    
+    /**
+     * Method: setSize
+     * 
+     * Parameters:
+     * size - {<OpenLayers.Size>} 
+     */
+    setSize: function(size) {
+        if (size != null) {
+            this.size = size;
+        }
+        this.draw();
+    },
+    
+    /**
+     * Method: setUrl
+     * 
+     * Parameters:
+     * url - {String} 
+     */
+    setUrl: function(url) {
+        if (url != null) {
+            this.url = url;
+        }
+        this.draw();
+    },
+
+    /** 
+     * Method: draw
+     * Move the div to the given pixel.
+     * 
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} 
+     * 
+     * Returns:
+     * {DOMElement} A new DOM Image of this icon set at the location passed-in
+     */
+    draw: function(px) {
+        OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, 
+                                            null, 
+                                            null, 
+                                            this.size, 
+                                            this.url, 
+                                            "absolute");
+        this.moveTo(px);
+        return this.imageDiv;
+    }, 
+
+    /** 
+     * Method: erase
+     * Erase the underlying image element.
+     *
+     */
+    erase: function() {
+        if (this.imageDiv != null && this.imageDiv.parentNode != null) {
+            OpenLayers.Element.remove(this.imageDiv);
+        }
+    }, 
+    
+    /** 
+     * Method: setOpacity
+     * Change the icon's opacity
+     *
+     * Parameters:
+     * opacity - {float} 
+     */
+    setOpacity: function(opacity) {
+        OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, null, null, null, 
+                                            null, null, null, null, opacity);
+
+    },
+    
+    /**
+     * Method: moveTo
+     * move icon to passed in px.
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>} 
+     */
+    moveTo: function (px) {
+        //if no px passed in, use stored location
+        if (px != null) {
+            this.px = px;
+        }
+
+        if (this.imageDiv != null) {
+            if (this.px == null) {
+                this.display(false);
+            } else {
+                if (this.calculateOffset) {
+                    this.offset = this.calculateOffset(this.size);  
+                }
+                var offsetPx = this.px.offset(this.offset);
+                OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, null, offsetPx);
+            }
+        }
+    },
+    
+    /** 
+     * Method: display
+     * Hide or show the icon
+     *
+     * Parameters:
+     * display - {Boolean} 
+     */
+    display: function(display) {
+        this.imageDiv.style.display = (display) ? "" : "none"; 
+    },
+    
+
+    /**
+     * APIMethod: isDrawn
+     * 
+     * Returns:
+     * {Boolean} Whether or not the icon is drawn.
+     */
+    isDrawn: function() {
+        // nodeType 11 for ie, whose nodes *always* have a parentNode
+        // (of type document fragment)
+        var isDrawn = (this.imageDiv && this.imageDiv.parentNode && 
+                       (this.imageDiv.parentNode.nodeType != 11));    
+
+        return isDrawn;   
+    },
+
+    CLASS_NAME: "OpenLayers.Icon"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Format.js	(revision 76)
@@ -0,0 +1,123 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Format
+ * Base class for format reading/writing a variety of formats.  Subclasses
+ *     of OpenLayers.Format are expected to have read and write methods.
+ */
+OpenLayers.Format = OpenLayers.Class({
+    
+    /**
+     * Property: options
+     * {Object} A reference to options passed to the constructor.
+     */
+    options: null,
+    
+    /**
+     * APIProperty: externalProjection
+     * {<OpenLayers.Projection>} When passed a externalProjection and
+     *     internalProjection, the format will reproject the geometries it
+     *     reads or writes. The externalProjection is the projection used by
+     *     the content which is passed into read or which comes out of write.
+     *     In order to reproject, a projection transformation function for the
+     *     specified projections must be available. This support may be 
+     *     provided via proj4js or via a custom transformation function. See
+     *     {<OpenLayers.Projection.addTransform>} for more information on
+     *     custom transformations.
+     */
+    externalProjection: null,
+
+    /**
+     * APIProperty: internalProjection
+     * {<OpenLayers.Projection>} When passed a externalProjection and
+     *     internalProjection, the format will reproject the geometries it
+     *     reads or writes. The internalProjection is the projection used by
+     *     the geometries which are returned by read or which are passed into
+     *     write.  In order to reproject, a projection transformation function
+     *     for the specified projections must be available. This support may be
+     *     provided via proj4js or via a custom transformation function. See
+     *     {<OpenLayers.Projection.addTransform>} for more information on
+     *     custom transformations.
+     */
+    internalProjection: null,
+
+    /**
+     * APIProperty: data
+     * {Object} When <keepData> is true, this is the parsed string sent to
+     *     <read>.
+     */
+    data: null,
+
+    /**
+     * APIProperty: keepData
+     * {Object} Maintain a reference (<data>) to the most recently read data.
+     *     Default is false.
+     */
+    keepData: false,
+
+    /**
+     * Constructor: OpenLayers.Format
+     * Instances of this class are not useful.  See one of the subclasses.
+     *
+     * Parameters:
+     * options - {Object} An optional object with properties to set on the
+     *           format
+     *
+     * Valid options:
+     * keepData - {Boolean} If true, upon <read>, the data property will be
+     *     set to the parsed object (e.g. the json or xml object).
+     *
+     * Returns:
+     * An instance of OpenLayers.Format
+     */
+    initialize: function(options) {
+        OpenLayers.Util.extend(this, options);
+        this.options = options;
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Clean up.
+     */
+    destroy: function() {
+    },
+
+    /**
+     * Method: read
+     * Read data from a string, and return an object whose type depends on the
+     * subclass. 
+     * 
+     * Parameters:
+     * data - {string} Data to read/parse.
+     *
+     * Returns:
+     * Depends on the subclass
+     */
+    read: function(data) {
+        OpenLayers.Console.userError(OpenLayers.i18n("readNotImplemented"));
+    },
+    
+    /**
+     * Method: write
+     * Accept an object, and return a string. 
+     *
+     * Parameters:
+     * object - {Object} Object to be serialized
+     *
+     * Returns:
+     * {String} A string representation of the object.
+     */
+    write: function(object) {
+        OpenLayers.Console.userError(OpenLayers.i18n("writeNotImplemented"));
+    },
+
+    CLASS_NAME: "OpenLayers.Format"
+});     
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Request.js	(revision 76)
@@ -0,0 +1,358 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Events.js
+ */
+
+/**
+ * Namespace: OpenLayers.Request
+ * The OpenLayers.Request namespace contains convenience methods for working
+ *     with XMLHttpRequests.  These methods work with a cross-browser
+ *     W3C compliant <OpenLayers.Request.XMLHttpRequest> class.
+ */
+OpenLayers.Request = {
+    
+    /**
+     * Constant: DEFAULT_CONFIG
+     * {Object} Default configuration for all requests.
+     */
+    DEFAULT_CONFIG: {
+        method: "GET",
+        url: window.location.href,
+        async: true,
+        user: undefined,
+        password: undefined,
+        params: null,
+        proxy: OpenLayers.ProxyHost,
+        headers: {},
+        data: null,
+        callback: function() {},
+        success: null,
+        failure: null,
+        scope: null
+    },
+    
+    /**
+     * APIProperty: events
+     * {<OpenLayers.Events>} An events object that handles all 
+     *     events on the {<OpenLayers.Request>} object.
+     *
+     * All event listeners will receive an event object with three properties:
+     * request - {<OpenLayers.Request.XMLHttpRequest>} The request object.
+     * config - {Object} The config object sent to the specific request method.
+     * requestUrl - {String} The request url.
+     * 
+     * Supported event types:
+     * complete - Triggered when we have a response from the request, if a
+     *     listener returns false, no further response processing will take
+     *     place.
+     * success - Triggered when the HTTP response has a success code (200-299).
+     * failure - Triggered when the HTTP response does not have a success code.
+     */
+    events: new OpenLayers.Events(this, null, ["complete", "success", "failure"]),
+    
+    /**
+     * APIMethod: issue
+     * Create a new XMLHttpRequest object, open it, set any headers, bind
+     *     a callback to done state, and send any data.  It is recommended that
+     *     you use one <GET>, <POST>, <PUT>, <DELETE>, <OPTIONS>, or <HEAD>.
+     *     This method is only documented to provide detail on the configuration
+     *     options available to all request methods.
+     *
+     * Parameters:
+     * config - {Object} Object containing properties for configuring the
+     *     request.  Allowed configuration properties are described below.
+     *     This object is modified and should not be reused.
+     *
+     * Allowed config properties:
+     * method - {String} One of GET, POST, PUT, DELETE, HEAD, or
+     *     OPTIONS.  Default is GET.
+     * url - {String} URL for the request.
+     * async - {Boolean} Open an asynchronous request.  Default is true.
+     * user - {String} User for relevant authentication scheme.  Set
+     *     to null to clear current user.
+     * password - {String} Password for relevant authentication scheme.
+     *     Set to null to clear current password.
+     * proxy - {String} Optional proxy.  Defaults to
+     *     <OpenLayers.ProxyHost>.
+     * params - {Object} Any key:value pairs to be appended to the
+     *     url as a query string.  Assumes url doesn't already include a query
+     *     string or hash.  Typically, this is only appropriate for <GET>
+     *     requests where the query string will be appended to the url.
+     *     Parameter values that are arrays will be
+     *     concatenated with a comma (note that this goes against form-encoding)
+     *     as is done with <OpenLayers.Util.getParameterString>.
+     * headers - {Object} Object with header:value pairs to be set on
+     *     the request.
+     * data - {String | Document} Optional data to send with the request.
+     *     Typically, this is only used with <POST> and <PUT> requests.
+     *     Make sure to provide the appropriate "Content-Type" header for your
+     *     data.  For <POST> and <PUT> requests, the content type defaults to
+     *     "application-xml".  If your data is a different content type, or
+     *     if you are using a different HTTP method, set the "Content-Type"
+     *     header to match your data type.
+     * callback - {Function} Function to call when request is done.
+     *     To determine if the request failed, check request.status (200
+     *     indicates success).
+     * success - {Function} Optional function to call if request status is in
+     *     the 200s.  This will be called in addition to callback above and
+     *     would typically only be used as an alternative.
+     * failure - {Function} Optional function to call if request status is not
+     *     in the 200s.  This will be called in addition to callback above and
+     *     would typically only be used as an alternative.
+     * scope - {Object} If callback is a public method on some object,
+     *     set the scope to that object.
+     *
+     * Returns:
+     * {XMLHttpRequest} Request object.  To abort the request before a response
+     *     is received, call abort() on the request object.
+     */
+    issue: function(config) {        
+        // apply default config - proxy host may have changed
+        var defaultConfig = OpenLayers.Util.extend(
+            this.DEFAULT_CONFIG,
+            {proxy: OpenLayers.ProxyHost}
+        );
+        config = OpenLayers.Util.applyDefaults(config, defaultConfig);
+
+        // create request, open, and set headers
+        var request = new OpenLayers.Request.XMLHttpRequest();
+        var url = config.url;
+        if(config.params) {
+            var paramString = OpenLayers.Util.getParameterString(config.params);
+            if(paramString.length > 0) {
+                var separator = (url.indexOf('?') > -1) ? '&' : '?';
+                url += separator + paramString;
+            }
+        }
+        if(config.proxy && (url.indexOf("http") == 0)) {
+            if(typeof config.proxy == "function") {
+                url = config.proxy(url);
+            } else {
+                url = config.proxy + encodeURIComponent(url);
+            }
+        }
+        request.open(
+            config.method, url, config.async, config.user, config.password
+        );
+        for(var header in config.headers) {
+            request.setRequestHeader(header, config.headers[header]);
+        }
+
+        var events = this.events;
+
+        // we want to execute runCallbacks with "this" as the
+        // execution scope
+        var self = this;
+        
+        request.onreadystatechange = function() {
+            if(request.readyState == OpenLayers.Request.XMLHttpRequest.DONE) {
+                var proceed = events.triggerEvent(
+                    "complete",
+                    {request: request, config: config, requestUrl: url}
+                );
+                if(proceed !== false) {
+                    self.runCallbacks(
+                        {request: request, config: config, requestUrl: url}
+                    );
+                }
+            }
+        };
+        
+        // send request (optionally with data) and return
+        // call in a timeout for asynchronous requests so the return is
+        // available before readyState == 4 for cached docs
+        if(config.async === false) {
+            request.send(config.data);
+        } else {
+            window.setTimeout(function(){
+                if (request._aborted !== true) {
+                    request.send(config.data);
+                }
+            }, 0);
+        }
+        return request;
+    },
+    
+    /**
+     * Method: runCallbacks
+     * Calls the complete, success and failure callbacks. Application
+     *    can listen to the "complete" event, have the listener 
+     *    display a confirm window and always return false, and
+     *    execute OpenLayers.Request.runCallbacks if the user
+     *    hits "yes" in the confirm window.
+     *
+     * Parameters:
+     * options - {Object} Hash containing request, config and requestUrl keys
+     */
+    runCallbacks: function(options) {
+        var request = options.request;
+        var config = options.config;
+        
+        // bind callbacks to readyState 4 (done)
+        var complete = (config.scope) ?
+            OpenLayers.Function.bind(config.callback, config.scope) :
+            config.callback;
+        
+        // optional success callback
+        var success;
+        if(config.success) {
+            success = (config.scope) ?
+                OpenLayers.Function.bind(config.success, config.scope) :
+                config.success;
+        }
+
+        // optional failure callback
+        var failure;
+        if(config.failure) {
+            failure = (config.scope) ?
+                OpenLayers.Function.bind(config.failure, config.scope) :
+                config.failure;
+        }
+
+        complete(request);
+
+        if (!request.status || (request.status >= 200 && request.status < 300)) {
+            this.events.triggerEvent("success", options);
+            if(success) {
+                success(request);
+            }
+        }
+        if(request.status && (request.status < 200 || request.status >= 300)) {                    
+            this.events.triggerEvent("failure", options);
+            if(failure) {
+                failure(request);
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: GET
+     * Send an HTTP GET request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to GET.
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.
+     *     This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    GET: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "GET"});
+        return OpenLayers.Request.issue(config);
+    },
+    
+    /**
+     * APIMethod: POST
+     * Send a POST request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to POST and "Content-Type" header set to "application/xml".
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.  The
+     *     default "Content-Type" header will be set to "application-xml" if
+     *     none is provided.  This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    POST: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "POST"});
+        // set content type to application/xml if it isn't already set
+        config.headers = config.headers ? config.headers : {};
+        if(!("CONTENT-TYPE" in OpenLayers.Util.upperCaseObject(config.headers))) {
+            config.headers["Content-Type"] = "application/xml";
+        }
+        return OpenLayers.Request.issue(config);
+    },
+    
+    /**
+     * APIMethod: PUT
+     * Send an HTTP PUT request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to PUT and "Content-Type" header set to "application/xml".
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.  The
+     *     default "Content-Type" header will be set to "application-xml" if
+     *     none is provided.  This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    PUT: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "PUT"});
+        // set content type to application/xml if it isn't already set
+        config.headers = config.headers ? config.headers : {};
+        if(!("CONTENT-TYPE" in OpenLayers.Util.upperCaseObject(config.headers))) {
+            config.headers["Content-Type"] = "application/xml";
+        }
+        return OpenLayers.Request.issue(config);
+    },
+    
+    /**
+     * APIMethod: DELETE
+     * Send an HTTP DELETE request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to DELETE.
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.
+     *     This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    DELETE: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "DELETE"});
+        return OpenLayers.Request.issue(config);
+    },
+  
+    /**
+     * APIMethod: HEAD
+     * Send an HTTP HEAD request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to HEAD.
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.
+     *     This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    HEAD: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "HEAD"});
+        return OpenLayers.Request.issue(config);
+    },
+    
+    /**
+     * APIMethod: OPTIONS
+     * Send an HTTP OPTIONS request.  Additional configuration properties are
+     *     documented in the <issue> method, with the method property set
+     *     to OPTIONS.
+     *
+     * Parameters:
+     * config - {Object} Object with properties for configuring the request.
+     *     See the <issue> method for documentation of allowed properties.
+     *     This object is modified and should not be reused.
+     * 
+     * Returns:
+     * {XMLHttpRequest} Request object.
+     */
+    OPTIONS: function(config) {
+        config = OpenLayers.Util.extend(config, {method: "OPTIONS"});
+        return OpenLayers.Request.issue(config);
+    }
+
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Canvas.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Canvas.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Canvas.js	(revision 76)
@@ -0,0 +1,494 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Renderer.js
+ */
+
+/**
+ * Class: OpenLayers.Renderer.Canvas 
+ * A renderer based on the 2D 'canvas' drawing element.element
+ * 
+ * Inherits:
+ *  - <OpenLayers.Renderer>
+ */
+OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
+
+    /**
+     * Property: canvas
+     * {Canvas} The canvas context object.
+     */
+    canvas: null, 
+    
+    /**
+     * Property: features
+     * {Object} Internal object of feature/style pairs for use in redrawing the layer.
+     */
+    features: null, 
+   
+    /**
+     * Constructor: OpenLayers.Renderer.Canvas
+     *
+     * Parameters:
+     * containerID - {<String>} 
+     */
+    initialize: function(containerID) {
+        OpenLayers.Renderer.prototype.initialize.apply(this, arguments);
+        this.root = document.createElement("canvas");
+        this.container.appendChild(this.root);
+        this.canvas = this.root.getContext("2d");
+        this.features = {};
+    },
+    
+    /** 
+     * Method: eraseGeometry
+     * Erase a geometry from the renderer. Because the Canvas renderer has
+     *     'memory' of the features that it has drawn, we have to remove the
+     *     feature so it doesn't redraw.   
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * featureId - {String}
+     */
+    eraseGeometry: function(geometry, featureId) {
+        this.eraseFeatures(this.features[featureId][0]);
+    },
+
+    /**
+     * APIMethod: supported
+     * 
+     * Returns:
+     * {Boolean} Whether or not the browser supports the renderer class
+     */
+    supported: function() {
+        var canvas = document.createElement("canvas");
+        return !!canvas.getContext;
+    },    
+    
+    /**
+     * Method: setExtent
+     * Set the visible part of the layer.
+     *
+     * Resolution has probably changed, so we nullify the resolution 
+     * cache (this.resolution), then redraw. 
+     *
+     * Parameters:
+     * extent - {<OpenLayers.Bounds>} 
+     */
+    setExtent: function(extent) {
+        this.extent = extent.clone();
+        this.resolution = null;
+        this.redraw();
+    },
+    
+    /**
+     * Method: setSize
+     * Sets the size of the drawing surface.
+     *
+     * Once the size is updated, redraw the canvas.
+     *
+     * Parameters:
+     * size - {<OpenLayers.Size>} 
+     */
+    setSize: function(size) {
+        this.size = size.clone();
+        this.root.style.width = size.w + "px";
+        this.root.style.height = size.h + "px";
+        this.root.width = size.w;
+        this.root.height = size.h;
+        this.resolution = null;
+    },
+    
+    /**
+     * Method: drawFeature
+     * Draw the feature. Stores the feature in the features list,
+     * then redraws the layer. 
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     * style - {<Object>} 
+     */
+    drawFeature: function(feature, style) {
+        style = style || feature.style;
+        style = this.applyDefaultSymbolizer(style);  
+        
+        this.features[feature.id] = [feature, style]; 
+        this.redraw();
+    },
+
+
+    /** 
+     * Method: drawGeometry
+     * Used when looping (in redraw) over the features; draws
+     * the canvas. 
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} 
+     * style - {Object} 
+     */
+    drawGeometry: function(geometry, style) {
+        var className = geometry.CLASS_NAME;
+        if ((className == "OpenLayers.Geometry.Collection") ||
+            (className == "OpenLayers.Geometry.MultiPoint") ||
+            (className == "OpenLayers.Geometry.MultiLineString") ||
+            (className == "OpenLayers.Geometry.MultiPolygon")) {
+            for (var i = 0; i < geometry.components.length; i++) {
+                this.drawGeometry(geometry.components[i], style);
+            }
+            return;
+        }
+        switch (geometry.CLASS_NAME) {
+            case "OpenLayers.Geometry.Point":
+                this.drawPoint(geometry, style);
+                break;
+            case "OpenLayers.Geometry.LineString":
+                this.drawLineString(geometry, style);
+                break;
+            case "OpenLayers.Geometry.LinearRing":
+                this.drawLinearRing(geometry, style);
+                break;
+            case "OpenLayers.Geometry.Polygon":
+                this.drawPolygon(geometry, style);
+                break;
+            default:
+                break;
+        }
+    },
+
+    /**
+     * Method: drawExternalGraphic
+     * Called to draw External graphics. 
+     * 
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>}
+     * style    - {Object}
+     */ 
+    drawExternalGraphic: function(pt, style) {
+       var img = new Image();
+       
+       if(style.graphicTitle) {
+           img.title=style.graphicTitle;           
+       }
+
+       var width = style.graphicWidth || style.graphicHeight;
+       var height = style.graphicHeight || style.graphicWidth;
+       width = width ? width : style.pointRadius*2;
+       height = height ? height : style.pointRadius*2;
+       var xOffset = (style.graphicXOffset != undefined) ?
+           style.graphicXOffset : -(0.5 * width);
+       var yOffset = (style.graphicYOffset != undefined) ?
+           style.graphicYOffset : -(0.5 * height);
+       
+       var context = { img: img, 
+                       x: (pt[0]+xOffset), 
+                       y: (pt[1]+yOffset), 
+                       width: width, 
+                       height: height, 
+                       opacity: style.graphicOpacity || style.fillOpacity,
+                       canvas: this.canvas };
+
+       img.onload = OpenLayers.Function.bind( function() {
+           this.canvas.globalAlpha = this.opacity;
+           this.canvas.drawImage(this.img, this.x, 
+                                 this.y, this.width, this.height);
+       }, context);
+       img.src = style.externalGraphic;
+    },
+
+    /**
+     * Method: setCanvasStyle
+     * Prepare the canvas for drawing by setting various global settings.
+     *
+     * Parameters:
+     * type - {String} one of 'stroke', 'fill', or 'reset'
+     * style - {Object} Symbolizer hash
+     */
+    setCanvasStyle: function(type, style) {
+        if (type == "fill") {     
+            this.canvas.globalAlpha = style['fillOpacity'];
+            this.canvas.fillStyle = style['fillColor'];
+        } else if (type == "stroke") {  
+            this.canvas.globalAlpha = style['strokeOpacity'];
+            this.canvas.strokeStyle = style['strokeColor'];
+            this.canvas.lineWidth = style['strokeWidth'];
+        } else {
+            this.canvas.globalAlpha = 0;
+            this.canvas.lineWidth = 1;
+        }
+    },
+
+    /**
+     * Method: drawPoint
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>}
+     * style    - {Object}
+     */ 
+    drawPoint: function(geometry, style) {
+        if(style.graphic !== false) {
+            var pt = this.getLocalXY(geometry);
+            
+            if (style.externalGraphic) {
+                this.drawExternalGraphic(pt, style);
+            } else {
+                if(style.fill !== false) {
+                    this.setCanvasStyle("fill", style);
+                    this.canvas.beginPath();
+                    this.canvas.arc(pt[0], pt[1], style.pointRadius, 0, Math.PI*2, true);
+                    this.canvas.fill();
+                }
+                
+                if(style.stroke !== false) {
+                    this.setCanvasStyle("stroke", style);
+                    this.canvas.beginPath();
+                    this.canvas.arc(pt[0], pt[1], style.pointRadius, 0, Math.PI*2, true);
+                    this.canvas.stroke();
+                    this.setCanvasStyle("reset");
+                }
+            }
+        }
+    },
+
+    /**
+     * Method: drawLineString
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>}
+     * style    - {Object}
+     */ 
+    drawLineString: function(geometry, style) {
+        if(style.stroke !== false) {
+            this.setCanvasStyle("stroke", style);
+            this.canvas.beginPath();
+            var start = this.getLocalXY(geometry.components[0]);
+            this.canvas.moveTo(start[0], start[1]);
+            for(var i = 1; i < geometry.components.length; i++) {
+                var pt = this.getLocalXY(geometry.components[i]);
+                this.canvas.lineTo(pt[0], pt[1]);
+            }
+            this.canvas.stroke();
+        }
+        this.setCanvasStyle("reset");
+    },    
+    
+    /**
+     * Method: drawLinearRing
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>}
+     * style    - {Object}
+     */ 
+    drawLinearRing: function(geometry, style) {
+        if(style.fill !== false) {
+            this.setCanvasStyle("fill", style);
+            this.canvas.beginPath();
+            var start = this.getLocalXY(geometry.components[0]);
+            this.canvas.moveTo(start[0], start[1]);
+            for(var i = 1; i < geometry.components.length - 1 ; i++) {
+                var pt = this.getLocalXY(geometry.components[i]);
+                this.canvas.lineTo(pt[0], pt[1]);
+            }
+            this.canvas.fill();
+        }
+        
+        if(style.stroke !== false) {
+            this.setCanvasStyle("stroke", style);
+            this.canvas.beginPath();
+            var start = this.getLocalXY(geometry.components[0]);
+            this.canvas.moveTo(start[0], start[1]);
+            for(var i = 1; i < geometry.components.length; i++) {
+                var pt = this.getLocalXY(geometry.components[i]);
+                this.canvas.lineTo(pt[0], pt[1]);
+            }
+            this.canvas.stroke();
+        }
+        this.setCanvasStyle("reset");
+    },    
+    
+    /**
+     * Method: drawPolygon
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * geometry - {<OpenLayers.Geometry>}
+     * style    - {Object}
+     */ 
+    drawPolygon: function(geometry, style) {
+        this.drawLinearRing(geometry.components[0], style);
+        for (var i = 1; i < geometry.components.length; i++) {
+            this.drawLinearRing(geometry.components[i], {
+                fillOpacity: 0, 
+                strokeWidth: 0, 
+                strokeOpacity: 0, 
+                strokeColor: '#000000', 
+                fillColor: '#000000'}
+            ); // inner rings are 'empty'  
+        }
+    },
+    
+    /**
+     * Method: drawText
+     * This method is only called by the renderer itself.
+     *
+     * Parameters:
+     * location - {<OpenLayers.Point>}
+     * style    - {Object}
+     */
+    drawText: function(location, style) {
+        style = OpenLayers.Util.extend({
+            fontColor: "#000000",
+            labelAlign: "cm"
+        }, style);
+        var pt = this.getLocalXY(location);
+        
+        this.setCanvasStyle("reset");
+        this.canvas.fillStyle = style.fontColor;
+        this.canvas.globalAlpha = style.fontOpacity || 1.0;
+        var fontStyle = style.fontWeight + " " + style.fontSize + " " + style.fontFamily;
+        if (this.canvas.fillText) {
+            // HTML5
+            var labelAlign =
+                OpenLayers.Renderer.Canvas.LABEL_ALIGN[style.labelAlign[0]] ||
+                "center";
+            this.canvas.font = fontStyle;
+            this.canvas.textAlign = labelAlign;
+            this.canvas.fillText(style.label, pt[0], pt[1]);
+        } else if (this.canvas.mozDrawText) {
+            // Mozilla pre-Gecko1.9.1 (<FF3.1)
+            this.canvas.mozTextStyle = fontStyle;
+            // No built-in text alignment, so we measure and adjust the position
+            var len = this.canvas.mozMeasureText(style.label);
+            switch(style.labelAlign[0]) {
+                case "l":
+                    break;
+                case "r":
+                    pt[0] -= len;
+                    break;
+                case "c":
+                default:
+                    pt[0] -= len / 2;
+            }
+            this.canvas.translate(pt[0], pt[1]);
+            
+            this.canvas.mozDrawText(style.label);
+            this.canvas.translate(-1*pt[0], -1*pt[1]);
+        }
+        this.setCanvasStyle("reset");
+    },
+
+    /**
+     * Method: getLocalXY
+     * transform geographic xy into pixel xy
+     *
+     * Parameters: 
+     * point - {<OpenLayers.Geometry.Point>}
+     */
+    getLocalXY: function(point) {
+        var resolution = this.getResolution();
+        var extent = this.extent;
+        var x = (point.x / resolution + (-extent.left / resolution));
+        var y = ((extent.top / resolution) - point.y / resolution);
+        return [x, y];
+    },
+
+    /**
+     * Method: clear
+     * Clear all vectors from the renderer.
+     */    
+    clear: function() {
+        this.canvas.clearRect(0, 0, this.root.width, this.root.height);
+        this.features = {};
+    },
+
+    /**
+     * Method: getFeatureIdFromEvent
+     * Returns a feature id from an event on the renderer.  
+     * 
+     * Parameters:
+     * evt - {<OpenLayers.Event>} 
+     *
+     * Returns:
+     * {String} A feature id or null.
+     */
+    getFeatureIdFromEvent: function(evt) {
+        var loc = this.map.getLonLatFromPixel(evt.xy);
+        var resolution = this.getResolution();
+        var bounds = new OpenLayers.Bounds(loc.lon - resolution * 5, 
+                                           loc.lat - resolution * 5, 
+                                           loc.lon + resolution * 5, 
+                                           loc.lat + resolution * 5);
+        var geom = bounds.toGeometry();
+        for (var feat in this.features) {
+            if (!this.features.hasOwnProperty(feat)) { continue; }
+            if (this.features[feat][0].geometry.intersects(geom)) {
+                return feat;
+            }
+        }   
+        return null;
+    },
+    
+    /**
+     * Method: eraseFeatures 
+     * This is called by the layer to erase features; removes the feature from
+     *     the list, then redraws the layer.
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    eraseFeatures: function(features) {
+        if(!(features instanceof Array)) {
+            features = [features];
+        }
+        for(var i=0; i<features.length; ++i) {
+            delete this.features[features[i].id];
+        }
+        this.redraw();
+    },
+
+    /**
+     * Method: redraw
+     * The real 'meat' of the function: any time things have changed,
+     *     redraw() can be called to loop over all the data and (you guessed
+     *     it) redraw it.  Unlike Elements-based Renderers, we can't interact
+     *     with things once they're drawn, to remove them, for example, so
+     *     instead we have to just clear everything and draw from scratch.
+     */
+    redraw: function() {
+        if (!this.locked) {
+            this.canvas.clearRect(0, 0, this.root.width, this.root.height);
+            var labelMap = [];
+            var feature, style;
+            for (var id in this.features) {
+                if (!this.features.hasOwnProperty(id)) { continue; }
+                feature = this.features[id][0];
+                style = this.features[id][1];
+                if (!feature.geometry) { continue; }
+                this.drawGeometry(feature.geometry, style);
+                if(style.label) {
+                    labelMap.push([feature, style]);
+                }
+            }
+            var item;
+            for (var i=0, len=labelMap.length; i<len; ++i) {
+                item = labelMap[i];
+                this.drawText(item[0].geometry.getCentroid(), item[1]);
+            }
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Renderer.Canvas"
+});
+
+/**
+ * Constant: OpenLayers.Renderer.Canvas.LABEL_ALIGN
+ * {Object}
+ */
+OpenLayers.Renderer.Canvas.LABEL_ALIGN = {
+    "l": "left",
+    "r": "right"
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Elements.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Elements.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/Elements.js	(revision 76)
@@ -0,0 +1,1010 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Renderer.js
+ */
+
+/**
+ * Class: OpenLayers.ElementsIndexer
+ * This class takes care of figuring out which order elements should be
+ *     placed in the DOM based on given indexing methods. 
+ */
+OpenLayers.ElementsIndexer = OpenLayers.Class({
+   
+    /**
+     * Property: maxZIndex
+     * {Integer} This is the largest-most z-index value for a node
+     *     contained within the indexer.
+     */
+    maxZIndex: null,
+    
+    /**
+     * Property: order
+     * {Array<String>} This is an array of node id's stored in the
+     *     order that they should show up on screen. Id's higher up in the
+     *     array (higher array index) represent nodes with higher z-indeces.
+     */
+    order: null, 
+    
+    /**
+     * Property: indices
+     * {Object} This is a hash that maps node ids to their z-index value
+     *     stored in the indexer. This is done to make finding a nodes z-index 
+     *     value O(1).
+     */
+    indices: null,
+    
+    /**
+     * Property: compare
+     * {Function} This is the function used to determine placement of
+     *     of a new node within the indexer. If null, this defaults to to
+     *     the Z_ORDER_DRAWING_ORDER comparison method.
+     */
+    compare: null,
+    
+    /**
+     * APIMethod: initialize
+     * Create a new indexer with 
+     * 
+     * Parameters:
+     * yOrdering - {Boolean} Whether to use y-ordering.
+     */
+    initialize: function(yOrdering) {
+
+        this.compare = yOrdering ? 
+            OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER_Y_ORDER :
+            OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER_DRAWING_ORDER;
+            
+        this.order = [];
+        this.indices = {};
+        this.maxZIndex = 0;
+    },
+    
+    /**
+     * APIMethod: insert
+     * Insert a new node into the indexer. In order to find the correct 
+     *     positioning for the node to be inserted, this method uses a binary 
+     *     search. This makes inserting O(log(n)). 
+     * 
+     * Parameters:
+     * newNode - {DOMElement} The new node to be inserted.
+     * 
+     * Returns
+     * {DOMElement} the node before which we should insert our newNode, or
+     *     null if newNode can just be appended.
+     */
+    insert: function(newNode) {
+        // If the node is known to the indexer, remove it so we can
+        // recalculate where it should go.
+        if (this.exists(newNode)) {
+            this.remove(newNode);
+        }
+        
+        var nodeId = newNode.id;
+        
+        this.determineZIndex(newNode);       
+
+        var leftIndex = -1;
+        var rightIndex = this.order.length;
+        var middle;
+
+        while (rightIndex - leftIndex > 1) {
+            middle = parseInt((leftIndex + rightIndex) / 2);
+            
+            var placement = this.compare(this, newNode,
+                OpenLayers.Util.getElement(this.order[middle]));
+            
+            if (placement > 0) {
+                leftIndex = middle;
+            } else {
+                rightIndex = middle;
+            } 
+        }
+        
+        this.order.splice(rightIndex, 0, nodeId);
+        this.indices[nodeId] = this.getZIndex(newNode);
+        
+        // If the new node should be before another in the index
+        // order, return the node before which we have to insert the new one;
+        // else, return null to indicate that the new node can be appended.
+        return this.getNextElement(rightIndex);
+    },
+    
+    /**
+     * APIMethod: remove
+     * 
+     * Parameters:
+     * node - {DOMElement} The node to be removed.
+     */
+    remove: function(node) {
+        var nodeId = node.id;
+        var arrayIndex = OpenLayers.Util.indexOf(this.order, nodeId);
+        if (arrayIndex >= 0) {
+            // Remove it from the order array, as well as deleting the node
+            // from the indeces hash.
+            this.order.splice(arrayIndex, 1);
+            delete this.indices[nodeId];
+            
+            // Reset the maxium z-index based on the last item in the 
+            // order array.
+            if (this.order.length > 0) {
+                var lastId = this.order[this.order.length - 1];
+                this.maxZIndex = this.indices[lastId];
+            } else {
+                this.maxZIndex = 0;
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: clear
+     */
+    clear: function() {
+        this.order = [];
+        this.indices = {};
+        this.maxZIndex = 0;
+    },
+    
+    /**
+     * APIMethod: exists
+     *
+     * Parameters:
+     * node- {DOMElement} The node to test for existence.
+     *
+     * Returns:
+     * {Boolean} Whether or not the node exists in the indexer?
+     */
+    exists: function(node) {
+        return (this.indices[node.id] != null);
+    },
+
+    /**
+     * APIMethod: getZIndex
+     * Get the z-index value for the current node from the node data itself.
+     * 
+     * Parameters:
+     * node - {DOMElement} The node whose z-index to get.
+     * 
+     * Returns:
+     * {Integer} The z-index value for the specified node (from the node 
+     *     data itself).
+     */
+    getZIndex: function(node) {
+        return node._style.graphicZIndex;  
+    },
+    
+    /**
+     * Method: determineZIndex
+     * Determine the z-index for the current node if there isn't one, 
+     *     and set the maximum value if we've found a new maximum.
+     * 
+     * Parameters:
+     * node - {DOMElement} 
+     */
+    determineZIndex: function(node) {
+        var zIndex = node._style.graphicZIndex;
+        
+        // Everything must have a zIndex. If none is specified,
+        // this means the user *must* (hint: assumption) want this
+        // node to succomb to drawing order. To enforce drawing order
+        // over all indexing methods, we'll create a new z-index that's
+        // greater than any currently in the indexer.
+        if (zIndex == null) {
+            zIndex = this.maxZIndex;
+            node._style.graphicZIndex = zIndex; 
+        } else if (zIndex > this.maxZIndex) {
+            this.maxZIndex = zIndex;
+        }
+    },
+
+    /**
+     * APIMethod: getNextElement
+     * Get the next element in the order stack.
+     * 
+     * Parameters:
+     * index - {Integer} The index of the current node in this.order.
+     * 
+     * Returns:
+     * {DOMElement} the node following the index passed in, or
+     *     null.
+     */
+    getNextElement: function(index) {
+        var nextIndex = index + 1;
+        if (nextIndex < this.order.length) {
+            var nextElement = OpenLayers.Util.getElement(this.order[nextIndex]);
+            if (nextElement == undefined) {
+                nextElement = this.getNextElement(nextIndex);
+            }
+            return nextElement;
+        } else {
+            return null;
+        } 
+    },
+    
+    CLASS_NAME: "OpenLayers.ElementsIndexer"
+});
+
+/**
+ * Namespace: OpenLayers.ElementsIndexer.IndexingMethods
+ * These are the compare methods for figuring out where a new node should be 
+ *     placed within the indexer. These methods are very similar to general 
+ *     sorting methods in that they return -1, 0, and 1 to specify the 
+ *     direction in which new nodes fall in the ordering.
+ */
+OpenLayers.ElementsIndexer.IndexingMethods = {
+    
+    /**
+     * Method: Z_ORDER
+     * This compare method is used by other comparison methods.
+     *     It can be used individually for ordering, but is not recommended,
+     *     because it doesn't subscribe to drawing order.
+     * 
+     * Parameters:
+     * indexer - {<OpenLayers.ElementsIndexer>}
+     * newNode - {DOMElement}
+     * nextNode - {DOMElement}
+     * 
+     * Returns:
+     * {Integer}
+     */
+    Z_ORDER: function(indexer, newNode, nextNode) {
+        var newZIndex = indexer.getZIndex(newNode);
+
+        var returnVal = 0;
+        if (nextNode) {
+            var nextZIndex = indexer.getZIndex(nextNode);
+            returnVal = newZIndex - nextZIndex; 
+        }
+        
+        return returnVal;
+    },
+
+    /**
+     * APIMethod: Z_ORDER_DRAWING_ORDER
+     * This method orders nodes by their z-index, but does so in a way
+     *     that, if there are other nodes with the same z-index, the newest 
+     *     drawn will be the front most within that z-index. This is the 
+     *     default indexing method.
+     * 
+     * Parameters:
+     * indexer - {<OpenLayers.ElementsIndexer>}
+     * newNode - {DOMElement}
+     * nextNode - {DOMElement}
+     * 
+     * Returns:
+     * {Integer}
+     */
+    Z_ORDER_DRAWING_ORDER: function(indexer, newNode, nextNode) {
+        var returnVal = OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER(
+            indexer, 
+            newNode, 
+            nextNode
+        );
+        
+        // Make Z_ORDER subscribe to drawing order by pushing it above
+        // all of the other nodes with the same z-index.
+        if (nextNode && returnVal == 0) {
+            returnVal = 1;
+        }
+        
+        return returnVal;
+    },
+
+    /**
+     * APIMethod: Z_ORDER_Y_ORDER
+     * This one should really be called Z_ORDER_Y_ORDER_DRAWING_ORDER, as it
+     *     best describes which ordering methods have precedence (though, the 
+     *     name would be too long). This method orders nodes by their z-index, 
+     *     but does so in a way that, if there are other nodes with the same 
+     *     z-index, the nodes with the lower y position will be "closer" than 
+     *     those with a higher y position. If two nodes have the exact same y 
+     *     position, however, then this method will revert to using drawing  
+     *     order to decide placement.
+     * 
+     * Parameters:
+     * indexer - {<OpenLayers.ElementsIndexer>}
+     * newNode - {DOMElement}
+     * nextNode - {DOMElement}
+     * 
+     * Returns:
+     * {Integer}
+     */
+    Z_ORDER_Y_ORDER: function(indexer, newNode, nextNode) {
+        var returnVal = OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER(
+            indexer, 
+            newNode, 
+            nextNode
+        );
+        
+        if (nextNode && returnVal === 0) {            
+            var result = nextNode._boundsBottom - newNode._boundsBottom;
+            returnVal = (result === 0) ? 1 : result;
+        }
+        
+        return returnVal;       
+    }
+};
+
+/**
+ * Class: OpenLayers.Renderer.Elements
+ * This is another virtual class in that it should never be instantiated by 
+ *  itself as a Renderer. It exists because there is *tons* of shared 
+ *  functionality between different vector libraries which use nodes/elements
+ *  as a base for rendering vectors. 
+ * 
+ * The highlevel bits of code that are implemented here are the adding and 
+ *  removing of geometries, which is essentially the same for any 
+ *  element-based renderer. The details of creating each node and drawing the
+ *  paths are of course different, but the machinery is the same. 
+ * 
+ * Inherits:
+ *  - <OpenLayers.Renderer>
+ */
+OpenLayers.Renderer.Elements = OpenLayers.Class(OpenLayers.Renderer, {
+
+    /**
+     * Property: rendererRoot
+     * {DOMElement}
+     */
+    rendererRoot: null,
+    
+    /**
+     * Property: root
+     * {DOMElement}
+     */
+    root: null,
+    
+    /**
+     * Property: vectorRoot
+     * {DOMElement}
+     */
+    vectorRoot: null,
+
+    /**
+     * Property: textRoot
+     * {DOMElement}
+     */
+    textRoot: null,
+
+    /**
+     * Property: xmlns
+     * {String}
+     */    
+    xmlns: null,
+    
+    /**
+     * Property: Indexer
+     * {<OpenLayers.ElementIndexer>} An instance of OpenLayers.ElementsIndexer 
+     *     created upon initialization if the zIndexing or yOrdering options
+     *     passed to this renderer's constructor are set to true.
+     */
+    indexer: null, 
+    
+    /**
+     * Constant: BACKGROUND_ID_SUFFIX
+     * {String}
+     */
+    BACKGROUND_ID_SUFFIX: "_background",
+    
+    /**
+     * Constant: BACKGROUND_ID_SUFFIX
+     * {String}
+     */
+    LABEL_ID_SUFFIX: "_label",
+    
+    /**
+     * Constructor: OpenLayers.Renderer.Elements
+     * 
+     * Parameters:
+     * containerID - {String}
+     * options - {Object} options for this renderer. Supported options are:
+     *     * yOrdering - {Boolean} Whether to use y-ordering
+     *     * zIndexing - {Boolean} Whether to use z-indexing. Will be ignored
+     *         if yOrdering is set to true.
+     */
+    initialize: function(containerID, options) {
+        OpenLayers.Renderer.prototype.initialize.apply(this, arguments);
+
+        this.rendererRoot = this.createRenderRoot();
+        this.root = this.createRoot("_root");
+        this.vectorRoot = this.createRoot("_vroot");
+        this.textRoot = this.createRoot("_troot");
+        
+        this.root.appendChild(this.vectorRoot);
+        this.root.appendChild(this.textRoot);
+        
+        this.rendererRoot.appendChild(this.root);
+        this.container.appendChild(this.rendererRoot);
+        
+        if(options && (options.zIndexing || options.yOrdering)) {
+            this.indexer = new OpenLayers.ElementsIndexer(options.yOrdering);
+        }
+    },
+    
+    /**
+     * Method: destroy
+     */
+    destroy: function() {
+
+        this.clear(); 
+
+        this.rendererRoot = null;
+        this.root = null;
+        this.xmlns = null;
+
+        OpenLayers.Renderer.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: clear
+     * Remove all the elements from the root
+     */    
+    clear: function() {
+        var child;
+        var root = this.vectorRoot;
+        if (root) {
+            while (child = root.firstChild) {
+                root.removeChild(child);
+            }
+        }
+        root = this.textRoot;
+        if (root) {
+            while (child = root.firstChild) {
+                root.removeChild(child);
+            }
+        }
+        if (this.indexer) {
+            this.indexer.clear();
+        }
+    },
+
+    /** 
+     * Method: getNodeType
+     * This function is in charge of asking the specific renderer which type
+     *     of node to create for the given geometry and style. All geometries
+     *     in an Elements-based renderer consist of one node and some
+     *     attributes. We have the nodeFactory() function which creates a node
+     *     for us, but it takes a 'type' as input, and that is precisely what
+     *     this function tells us.  
+     *  
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * 
+     * Returns:
+     * {String} The corresponding node type for the specified geometry
+     */
+    getNodeType: function(geometry, style) { },
+
+    /** 
+     * Method: drawGeometry 
+     * Draw the geometry, creating new nodes, setting paths, setting style,
+     *     setting featureId on the node.  This method should only be called
+     *     by the renderer itself.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * featureId - {String}
+     * 
+     * Returns:
+     * {Boolean} true if the geometry has been drawn completely; null if
+     *     incomplete; false otherwise
+     */
+    drawGeometry: function(geometry, style, featureId) {
+        var className = geometry.CLASS_NAME;
+        var rendered = true;
+        if ((className == "OpenLayers.Geometry.Collection") ||
+            (className == "OpenLayers.Geometry.MultiPoint") ||
+            (className == "OpenLayers.Geometry.MultiLineString") ||
+            (className == "OpenLayers.Geometry.MultiPolygon")) {
+            for (var i = 0, len=geometry.components.length; i<len; i++) {
+                rendered = this.drawGeometry(
+                    geometry.components[i], style, featureId) && rendered;
+            }
+            return rendered;
+        };
+
+        rendered = false;
+        if (style.display != "none") {
+            if (style.backgroundGraphic) {
+                this.redrawBackgroundNode(geometry.id, geometry, style,
+                    featureId);
+            }
+            rendered = this.redrawNode(geometry.id, geometry, style,
+                featureId);
+        }
+        if (rendered == false) {
+            var node = document.getElementById(geometry.id);
+            if (node) {
+                if (node._style.backgroundGraphic) {
+                    node.parentNode.removeChild(document.getElementById(
+                        geometry.id + this.BACKGROUND_ID_SUFFIX));
+                }
+                node.parentNode.removeChild(node);
+            }
+        }
+        return rendered;
+    },
+    
+    /**
+     * Method: redrawNode
+     * 
+     * Parameters:
+     * id - {String}
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * featureId - {String}
+     * 
+     * Returns:
+     * {Boolean} true if the complete geometry could be drawn, null if parts of
+     *     the geometry could not be drawn, false otherwise
+     */
+    redrawNode: function(id, geometry, style, featureId) {
+        style = this.applyDefaultSymbolizer(style);
+        // Get the node if it's already on the map.
+        var node = this.nodeFactory(id, this.getNodeType(geometry, style));
+        
+        // Set the data for the node, then draw it.
+        node._featureId = featureId;
+        node._boundsBottom = geometry.getBounds().bottom;
+        node._geometryClass = geometry.CLASS_NAME;
+        node._style = style;
+
+        var drawResult = this.drawGeometryNode(node, geometry, style);
+        if(drawResult === false) {
+            return false;
+        }
+         
+        node = drawResult.node;
+        
+        // Insert the node into the indexer so it can show us where to
+        // place it. Note that this operation is O(log(n)). If there's a
+        // performance problem (when dragging, for instance) this is
+        // likely where it would be.
+        if (this.indexer) {
+            var insert = this.indexer.insert(node);
+            if (insert) {
+                this.vectorRoot.insertBefore(node, insert);
+            } else {
+                this.vectorRoot.appendChild(node);
+            }
+        } else {
+            // if there's no indexer, simply append the node to root,
+            // but only if the node is a new one
+            if (node.parentNode !== this.vectorRoot){ 
+                this.vectorRoot.appendChild(node);
+            }
+        }
+        
+        this.postDraw(node);
+        
+        return drawResult.complete;
+    },
+    
+    /**
+     * Method: redrawBackgroundNode
+     * Redraws the node using special 'background' style properties. Basically
+     *     just calls redrawNode(), but instead of directly using the 
+     *     'externalGraphic', 'graphicXOffset', 'graphicYOffset', and 
+     *     'graphicZIndex' properties directly from the specified 'style' 
+     *     parameter, we create a new style object and set those properties 
+     *     from the corresponding 'background'-prefixed properties from 
+     *     specified 'style' parameter.
+     * 
+     * Parameters:
+     * id - {String}
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * featureId - {String}
+     * 
+     * Returns:
+     * {Boolean} true if the complete geometry could be drawn, null if parts of
+     *     the geometry could not be drawn, false otherwise
+     */
+    redrawBackgroundNode: function(id, geometry, style, featureId) {
+        var backgroundStyle = OpenLayers.Util.extend({}, style);
+        
+        // Set regular style attributes to apply to the background styles.
+        backgroundStyle.externalGraphic = backgroundStyle.backgroundGraphic;
+        backgroundStyle.graphicXOffset = backgroundStyle.backgroundXOffset;
+        backgroundStyle.graphicYOffset = backgroundStyle.backgroundYOffset;
+        backgroundStyle.graphicZIndex = backgroundStyle.backgroundGraphicZIndex;
+        backgroundStyle.graphicWidth = backgroundStyle.backgroundWidth || backgroundStyle.graphicWidth;
+        backgroundStyle.graphicHeight = backgroundStyle.backgroundHeight || backgroundStyle.graphicHeight;
+        
+        // Erase background styles.
+        backgroundStyle.backgroundGraphic = null;
+        backgroundStyle.backgroundXOffset = null;
+        backgroundStyle.backgroundYOffset = null;
+        backgroundStyle.backgroundGraphicZIndex = null;
+        
+        return this.redrawNode(
+            id + this.BACKGROUND_ID_SUFFIX, 
+            geometry, 
+            backgroundStyle, 
+            null
+        );
+    },
+
+    /**
+     * Method: drawGeometryNode
+     * Given a node, draw a geometry on the specified layer.
+     *     node and geometry are required arguments, style is optional.
+     *     This method is only called by the render itself.
+     *
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * 
+     * Returns:
+     * {Object} a hash with properties "node" (the drawn node) and "complete"
+     *     (null if parts of the geometry could not be drawn, false if nothing
+     *     could be drawn)
+     */
+    drawGeometryNode: function(node, geometry, style) {
+        style = style || node._style;
+
+        var options = {
+            'isFilled': style.fill === undefined ?
+                true :
+                style.fill,
+            'isStroked': style.stroke === undefined ?
+                !!style.strokeWidth :
+                style.stroke
+        };
+        var drawn;
+        switch (geometry.CLASS_NAME) {
+            case "OpenLayers.Geometry.Point":
+                if(style.graphic === false) {
+                    options.isFilled = false;
+                    options.isStroked = false;
+                }
+                drawn = this.drawPoint(node, geometry);
+                break;
+            case "OpenLayers.Geometry.LineString":
+                options.isFilled = false;
+                drawn = this.drawLineString(node, geometry);
+                break;
+            case "OpenLayers.Geometry.LinearRing":
+                drawn = this.drawLinearRing(node, geometry);
+                break;
+            case "OpenLayers.Geometry.Polygon":
+                drawn = this.drawPolygon(node, geometry);
+                break;
+            case "OpenLayers.Geometry.Surface":
+                drawn = this.drawSurface(node, geometry);
+                break;
+            case "OpenLayers.Geometry.Rectangle":
+                drawn = this.drawRectangle(node, geometry);
+                break;
+            default:
+                break;
+        }
+
+        node._options = options; 
+
+        //set style
+        //TBD simplify this
+        if (drawn != false) {
+            return {
+                node: this.setStyle(node, style, options, geometry),
+                complete: drawn
+            };
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: postDraw
+     * Things that have do be done after the geometry node is appended
+     *     to its parent node. To be overridden by subclasses.
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     */
+    postDraw: function(node) {},
+    
+    /**
+     * Method: drawPoint
+     * Virtual function for drawing Point Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the point
+     */ 
+    drawPoint: function(node, geometry) {},
+
+    /**
+     * Method: drawLineString
+     * Virtual function for drawing LineString Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components of
+     *     the linestring, or false if nothing could be drawn
+     */ 
+    drawLineString: function(node, geometry) {},
+
+    /**
+     * Method: drawLinearRing
+     * Virtual function for drawing LinearRing Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components
+     *     of the linear ring, or false if nothing could be drawn
+     */ 
+    drawLinearRing: function(node, geometry) {},
+
+    /**
+     * Method: drawPolygon
+     * Virtual function for drawing Polygon Geometry. 
+     *    Should be implemented by subclasses.
+     *    This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components
+     *     of the polygon, or false if nothing could be drawn
+     */ 
+    drawPolygon: function(node, geometry) {},
+
+    /**
+     * Method: drawRectangle
+     * Virtual function for drawing Rectangle Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the rectangle
+     */ 
+    drawRectangle: function(node, geometry) {},
+
+    /**
+     * Method: drawCircle
+     * Virtual function for drawing Circle Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the circle
+     */ 
+    drawCircle: function(node, geometry) {},
+
+    /**
+     * Method: drawSurface
+     * Virtual function for drawing Surface Geometry. 
+     *     Should be implemented by subclasses.
+     *     This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the surface
+     */ 
+    drawSurface: function(node, geometry) {},
+
+    /**
+     * Method: removeText
+     * Removes a label
+     * 
+     * Parameters:
+     * featureId - {String}
+     */
+    removeText: function(featureId) {
+        var label = document.getElementById(featureId + this.LABEL_ID_SUFFIX);
+        if (label) {
+            this.textRoot.removeChild(label);
+        }
+    },
+
+    /**
+     * Method: getFeatureIdFromEvent
+     * 
+     * Parameters:
+     * evt - {Object} An <OpenLayers.Event> object
+     *
+     * Returns:
+     * {<OpenLayers.Geometry>} A geometry from an event that 
+     *     happened on a layer.
+     */
+    getFeatureIdFromEvent: function(evt) {
+        var target = evt.target;
+        var useElement = target && target.correspondingUseElement;
+        var node = useElement ? useElement : (target || evt.srcElement);
+        var featureId = node._featureId;
+        return featureId;
+    },
+
+    /** 
+     * Method: eraseGeometry
+     * Erase a geometry from the renderer. In the case of a multi-geometry, 
+     *     we cycle through and recurse on ourselves. Otherwise, we look for a 
+     *     node with the geometry.id, destroy its geometry, and remove it from
+     *     the DOM.
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * featureId - {String}
+     */
+    eraseGeometry: function(geometry, featureId) {
+        if ((geometry.CLASS_NAME == "OpenLayers.Geometry.MultiPoint") ||
+            (geometry.CLASS_NAME == "OpenLayers.Geometry.MultiLineString") ||
+            (geometry.CLASS_NAME == "OpenLayers.Geometry.MultiPolygon") ||
+            (geometry.CLASS_NAME == "OpenLayers.Geometry.Collection")) {
+            for (var i=0, len=geometry.components.length; i<len; i++) {
+                this.eraseGeometry(geometry.components[i], featureId);
+            }
+        } else {    
+            var element = OpenLayers.Util.getElement(geometry.id);
+            if (element && element.parentNode) {
+                if (element.geometry) {
+                    element.geometry.destroy();
+                    element.geometry = null;
+                }
+                element.parentNode.removeChild(element);
+
+                if (this.indexer) {
+                    this.indexer.remove(element);
+                }
+                
+                if (element._style.backgroundGraphic) {
+                    var backgroundId = geometry.id + this.BACKGROUND_ID_SUFFIX;
+                    var bElem = OpenLayers.Util.getElement(backgroundId);
+                    if (bElem && bElem.parentNode) {
+                        // No need to destroy the geometry since the element and the background
+                        // node share the same geometry.
+                        bElem.parentNode.removeChild(bElem);
+                    }
+                }
+            }
+        }
+    },
+
+    /** 
+     * Method: nodeFactory
+     * Create new node of the specified type, with the (optional) specified id.
+     * 
+     * If node already exists with same ID and a different type, we remove it
+     *     and then call ourselves again to recreate it.
+     * 
+     * Parameters:
+     * id - {String}
+     * type - {String} type Kind of node to draw.
+     * 
+     * Returns:
+     * {DOMElement} A new node of the given type and id.
+     */
+    nodeFactory: function(id, type) {
+        var node = OpenLayers.Util.getElement(id);
+        if (node) {
+            if (!this.nodeTypeCompare(node, type)) {
+                node.parentNode.removeChild(node);
+                node = this.nodeFactory(id, type);
+            }
+        } else {
+            node = this.createNode(type, id);
+        }
+        return node;
+    },
+    
+    /** 
+     * Method: nodeTypeCompare
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * type - {String} Kind of node
+     * 
+     * Returns:
+     * {Boolean} Whether or not the specified node is of the specified type
+     *     This function must be overridden by subclasses.
+     */
+    nodeTypeCompare: function(node, type) {},
+    
+    /** 
+     * Method: createNode
+     * 
+     * Parameters:
+     * type - {String} Kind of node to draw.
+     * id - {String} Id for node.
+     * 
+     * Returns:
+     * {DOMElement} A new node of the given type and id.
+     *     This function must be overridden by subclasses.
+     */
+    createNode: function(type, id) {},
+
+    /**
+     * Method: moveRoot
+     * moves this renderer's root to a different renderer.
+     * 
+     * Parameters:
+     * renderer - {<OpenLayers.Renderer>} target renderer for the moved root
+     */
+    moveRoot: function(renderer) {
+        var root = this.root;
+        if(renderer.root.parentNode == this.rendererRoot) {
+            root = renderer.root;
+        }
+        root.parentNode.removeChild(root);
+        renderer.rendererRoot.appendChild(root);
+    },
+    
+    /**
+     * Method: getRenderLayerId
+     * Gets the layer that this renderer's output appears on. If moveRoot was
+     * used, this will be different from the id of the layer containing the
+     * features rendered by this renderer.
+     * 
+     * Returns:
+     * {String} the id of the output layer.
+     */
+    getRenderLayerId: function() {
+        return this.root.parentNode.parentNode.id;
+    },
+    
+    /**
+     * Method: isComplexSymbol
+     * Determines if a symbol cannot be rendered using drawCircle
+     * 
+     * Parameters:
+     * graphicName - {String}
+     * 
+     * Returns
+     * {Boolean} true if the symbol is complex, false if not
+     */
+    isComplexSymbol: function(graphicName) {
+        return (graphicName != "circle") && !!graphicName;
+    },
+
+    CLASS_NAME: "OpenLayers.Renderer.Elements"
+});
+
+
+/**
+ * Constant: OpenLayers.Renderer.symbol
+ * Coordinate arrays for well known (named) symbols.
+ */
+OpenLayers.Renderer.symbol = {
+    "star": [350,75, 379,161, 469,161, 397,215, 423,301, 350,250, 277,301,
+            303,215, 231,161, 321,161, 350,75],
+    "cross": [4,0, 6,0, 6,4, 10,4, 10,6, 6,6, 6,10, 4,10, 4,6, 0,6, 0,4, 4,4,
+            4,0],
+    "x": [0,0, 25,0, 50,35, 75,0, 100,0, 65,50, 100,100, 75,100, 50,65, 25,100, 0,100, 35,50, 0,0],
+    "square": [0,0, 0,1, 1,1, 1,0, 0,0],
+    "triangle": [0,10, 10,10, 5,0, 0,10]
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/VML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/VML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/VML.js	(revision 76)
@@ -0,0 +1,999 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Renderer/Elements.js
+ */
+
+/**
+ * Class: OpenLayers.Renderer.VML
+ * Render vector features in browsers with VML capability.  Construct a new
+ * VML renderer with the <OpenLayers.Renderer.VML> constructor.
+ * 
+ * Note that for all calculations in this class, we use (num | 0) to truncate a 
+ * float value to an integer. This is done because it seems that VML doesn't 
+ * support float values.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Renderer.Elements>
+ */
+OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
+
+    /**
+     * Property: xmlns
+     * {String} XML Namespace URN
+     */
+    xmlns: "urn:schemas-microsoft-com:vml",
+    
+    /**
+     * Property: symbolCache
+     * {DOMElement} node holding symbols. This hash is keyed by symbol name,
+     *     and each value is a hash with a "path" and an "extent" property.
+     */
+    symbolCache: {},
+
+    /**
+     * Property: offset
+     * {Object} Hash with "x" and "y" properties
+     */
+    offset: null,
+    
+    /**
+     * Constructor: OpenLayers.Renderer.VML
+     * Create a new VML renderer.
+     *
+     * Parameters:
+     * containerID - {String} The id for the element that contains the renderer
+     */
+    initialize: function(containerID) {
+        if (!this.supported()) { 
+            return; 
+        }
+        if (!document.namespaces.olv) {
+            document.namespaces.add("olv", this.xmlns);
+            var style = document.createStyleSheet();
+            var shapes = ['shape','rect', 'oval', 'fill', 'stroke', 'imagedata', 'group','textbox']; 
+            for (var i = 0, len = shapes.length; i < len; i++) {
+
+                style.addRule('olv\\:' + shapes[i], "behavior: url(#default#VML); " +
+                              "position: absolute; display: inline-block;");
+            }                  
+        }
+        
+        OpenLayers.Renderer.Elements.prototype.initialize.apply(this, 
+                                                                arguments);
+    },
+
+    /**
+     * APIMethod: destroy
+     * Deconstruct the renderer.
+     */
+    destroy: function() {
+        OpenLayers.Renderer.Elements.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: supported
+     * Determine whether a browser supports this renderer.
+     *
+     * Returns:
+     * {Boolean} The browser supports the VML renderer
+     */
+    supported: function() {
+        return !!(document.namespaces);
+    },    
+
+    /**
+     * Method: setExtent
+     * Set the renderer's extent
+     *
+     * Parameters:
+     * extent - {<OpenLayers.Bounds>}
+     * resolutionChanged - {Boolean}
+     * 
+     * Returns:
+     * {Boolean} true to notify the layer that the new extent does not exceed
+     *     the coordinate range, and the features will not need to be redrawn.
+     */
+    setExtent: function(extent, resolutionChanged) {
+        OpenLayers.Renderer.Elements.prototype.setExtent.apply(this, 
+                                                               arguments);
+        var resolution = this.getResolution();
+    
+        var left = (extent.left/resolution) | 0;
+        var top = (extent.top/resolution - this.size.h) | 0;
+        if (resolutionChanged || !this.offset) {
+            this.offset = {x: left, y: top};
+            left = 0;
+            top = 0;
+        } else {
+            left = left - this.offset.x;
+            top = top - this.offset.y;
+        }
+
+        
+        var org = left + " " + top;
+        this.root.coordorigin = org;
+        var roots = [this.root, this.vectorRoot, this.textRoot];
+        var root;
+        for(var i=0, len=roots.length; i<len; ++i) {
+            root = roots[i];
+
+            var size = this.size.w + " " + this.size.h;
+            root.coordsize = size;
+            
+        }
+        // flip the VML display Y axis upside down so it 
+        // matches the display Y axis of the map
+        this.root.style.flip = "y";
+        
+        return true;
+    },
+
+
+    /**
+     * Method: setSize
+     * Set the size of the drawing surface
+     *
+     * Parameters:
+     * size - {<OpenLayers.Size>} the size of the drawing surface
+     */
+    setSize: function(size) {
+        OpenLayers.Renderer.prototype.setSize.apply(this, arguments);
+        
+        // setting width and height on all roots to avoid flicker which we
+        // would get with 100% width and height on child roots
+        var roots = [
+            this.rendererRoot,
+            this.root,
+            this.vectorRoot,
+            this.textRoot
+        ];
+        var w = this.size.w + "px";
+        var h = this.size.h + "px";
+        var root;
+        for(var i=0, len=roots.length; i<len; ++i) {
+            root = roots[i];
+            root.style.width = w;
+            root.style.height = h;
+        }
+    },
+
+    /**
+     * Method: getNodeType
+     * Get the node type for a geometry and style
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     *
+     * Returns:
+     * {String} The corresponding node type for the specified geometry
+     */
+    getNodeType: function(geometry, style) {
+        var nodeType = null;
+        switch (geometry.CLASS_NAME) {
+            case "OpenLayers.Geometry.Point":
+                if (style.externalGraphic) {
+                    nodeType = "olv:rect";
+                } else if (this.isComplexSymbol(style.graphicName)) {
+                    nodeType = "olv:shape";
+                } else {
+                    nodeType = "olv:oval";
+                }
+                break;
+            case "OpenLayers.Geometry.Rectangle":
+                nodeType = "olv:rect";
+                break;
+            case "OpenLayers.Geometry.LineString":
+            case "OpenLayers.Geometry.LinearRing":
+            case "OpenLayers.Geometry.Polygon":
+            case "OpenLayers.Geometry.Curve":
+            case "OpenLayers.Geometry.Surface":
+                nodeType = "olv:shape";
+                break;
+            default:
+                break;
+        }
+        return nodeType;
+    },
+
+    /**
+     * Method: setStyle
+     * Use to set all the style attributes to a VML node.
+     *
+     * Parameters:
+     * node - {DOMElement} An VML element to decorate
+     * style - {Object}
+     * options - {Object} Currently supported options include 
+     *                              'isFilled' {Boolean} and
+     *                              'isStroked' {Boolean}
+     * geometry - {<OpenLayers.Geometry>}
+     */
+    setStyle: function(node, style, options, geometry) {
+        style = style  || node._style;
+        options = options || node._options;
+        var fillColor = style.fillColor;
+
+        if (node._geometryClass === "OpenLayers.Geometry.Point") {
+            if (style.externalGraphic) {
+                if (style.graphicTitle) {
+                    node.title=style.graphicTitle;
+                } 
+                var width = style.graphicWidth || style.graphicHeight;
+                var height = style.graphicHeight || style.graphicWidth;
+                width = width ? width : style.pointRadius*2;
+                height = height ? height : style.pointRadius*2;
+
+                var resolution = this.getResolution();
+                var xOffset = (style.graphicXOffset != undefined) ?
+                    style.graphicXOffset : -(0.5 * width);
+                var yOffset = (style.graphicYOffset != undefined) ?
+                    style.graphicYOffset : -(0.5 * height);
+                
+                node.style.left = (((geometry.x/resolution - this.offset.x)+xOffset) | 0) + "px";
+                node.style.top = (((geometry.y/resolution - this.offset.y)-(yOffset+height)) | 0) + "px";
+                node.style.width = width + "px";
+                node.style.height = height + "px";
+                node.style.flip = "y";
+                
+                // modify fillColor and options for stroke styling below
+                fillColor = "none";
+                options.isStroked = false;
+            } else if (this.isComplexSymbol(style.graphicName)) {
+                var cache = this.importSymbol(style.graphicName);
+                node.path = cache.path;
+                node.coordorigin = cache.left + "," + cache.bottom;
+                var size = cache.size;
+                node.coordsize = size + "," + size;        
+                this.drawCircle(node, geometry, style.pointRadius);
+                node.style.flip = "y";
+            } else {
+                this.drawCircle(node, geometry, style.pointRadius);
+            }
+        }
+
+        // fill 
+        if (options.isFilled) { 
+            node.fillcolor = fillColor; 
+        } else { 
+            node.filled = "false"; 
+        }
+        var fills = node.getElementsByTagName("fill");
+        var fill = (fills.length == 0) ? null : fills[0];
+        if (!options.isFilled) {
+            if (fill) {
+                node.removeChild(fill);
+            }
+        } else {
+            if (!fill) {
+                fill = this.createNode('olv:fill', node.id + "_fill");
+            }
+            fill.opacity = style.fillOpacity;
+
+            if (node._geometryClass === "OpenLayers.Geometry.Point" &&
+                    style.externalGraphic) {
+
+                // override fillOpacity
+                if (style.graphicOpacity) {
+                    fill.opacity = style.graphicOpacity;
+                }
+                
+                fill.src = style.externalGraphic;
+                fill.type = "frame";
+                
+                if (!(style.graphicWidth && style.graphicHeight)) {
+                  fill.aspect = "atmost";
+                }                
+            }
+            if (fill.parentNode != node) {
+                node.appendChild(fill);
+            }
+        }
+
+        // additional rendering for rotated graphics or symbols
+        var rotation = style.rotation;
+        if ((rotation !== undefined || node._rotation !== undefined)) {
+            node._rotation = rotation;
+            if (style.externalGraphic) {
+                this.graphicRotate(node, xOffset, yOffset, style);
+                // make the fill fully transparent, because we now have
+                // the graphic as imagedata element. We cannot just remove
+                // the fill, because this is part of the hack described
+                // in graphicRotate
+                fill.opacity = 0;
+            } else if(node._geometryClass === "OpenLayers.Geometry.Point") {
+                node.style.rotation = rotation || 0;
+            }
+        }
+
+        // stroke 
+        var strokes = node.getElementsByTagName("stroke");
+        var stroke = (strokes.length == 0) ? null : strokes[0];
+        if (!options.isStroked) {
+            node.stroked = false;
+            if (stroke) {
+                stroke.on = false;
+            }
+        } else {
+            if (!stroke) {
+                stroke = this.createNode('olv:stroke', node.id + "_stroke");
+                node.appendChild(stroke);
+            }
+            stroke.on = true;
+            stroke.color = style.strokeColor; 
+            stroke.weight = style.strokeWidth + "px"; 
+            stroke.opacity = style.strokeOpacity;
+            stroke.endcap = style.strokeLinecap == 'butt' ? 'flat' :
+                (style.strokeLinecap || 'round');
+            if (style.strokeDashstyle) {
+                stroke.dashstyle = this.dashStyle(style);
+            }
+        }
+        
+        if (style.cursor != "inherit" && style.cursor != null) {
+            node.style.cursor = style.cursor;
+        }
+        return node;
+    },
+
+    /**
+     * Method: graphicRotate
+     * If a point is to be styled with externalGraphic and rotation, VML fills
+     * cannot be used to display the graphic, because rotation of graphic
+     * fills is not supported by the VML implementation of Internet Explorer.
+     * This method creates a olv:imagedata element inside the VML node,
+     * DXImageTransform.Matrix and BasicImage filters for rotation and
+     * opacity, and a 3-step hack to remove rendering artefacts from the
+     * graphic and preserve the ability of graphics to trigger events.
+     * Finally, OpenLayers methods are used to determine the correct
+     * insertion point of the rotated image, because DXImageTransform.Matrix
+     * does the rotation without the ability to specify a rotation center
+     * point.
+     * 
+     * Parameters:
+     * node    - {DOMElement}
+     * xOffset - {Number} rotation center relative to image, x coordinate
+     * yOffset - {Number} rotation center relative to image, y coordinate
+     * style   - {Object}
+     */
+    graphicRotate: function(node, xOffset, yOffset, style) {
+        var style = style || node._style;
+        var rotation = style.rotation || 0;
+        
+        var aspectRatio, size;
+        if (!(style.graphicWidth && style.graphicHeight)) {
+            // load the image to determine its size
+            var img = new Image();
+            img.onreadystatechange = OpenLayers.Function.bind(function() {
+                if(img.readyState == "complete" ||
+                        img.readyState == "interactive") {
+                    aspectRatio = img.width / img.height;
+                    size = Math.max(style.pointRadius * 2, 
+                        style.graphicWidth || 0,
+                        style.graphicHeight || 0);
+                    xOffset = xOffset * aspectRatio;
+                    style.graphicWidth = size * aspectRatio;
+                    style.graphicHeight = size;
+                    this.graphicRotate(node, xOffset, yOffset, style);
+                }
+            }, this);
+            img.src = style.externalGraphic;
+            
+            // will be called again by the onreadystate handler
+            return;
+        } else {
+            size = Math.max(style.graphicWidth, style.graphicHeight);
+            aspectRatio = style.graphicWidth / style.graphicHeight;
+        }
+        
+        var width = Math.round(style.graphicWidth || size * aspectRatio);
+        var height = Math.round(style.graphicHeight || size);
+        node.style.width = width + "px";
+        node.style.height = height + "px";
+        
+        // Three steps are required to remove artefacts for images with
+        // transparent backgrounds (resulting from using DXImageTransform
+        // filters on svg objects), while preserving awareness for browser
+        // events on images:
+        // - Use the fill as usual (like for unrotated images) to handle
+        //   events
+        // - specify an imagedata element with the same src as the fill
+        // - style the imagedata element with an AlphaImageLoader filter
+        //   with empty src
+        var image = document.getElementById(node.id + "_image");
+        if (!image) {
+            image = this.createNode("olv:imagedata", node.id + "_image");
+            node.appendChild(image);
+        }
+        image.style.width = width + "px";
+        image.style.height = height + "px";
+        image.src = style.externalGraphic;
+        image.style.filter =
+            "progid:DXImageTransform.Microsoft.AlphaImageLoader(" + 
+            "src='', sizingMethod='scale')";
+
+        var rot = rotation * Math.PI / 180;
+        var sintheta = Math.sin(rot);
+        var costheta = Math.cos(rot);
+
+        // do the rotation on the image
+        var filter =
+            "progid:DXImageTransform.Microsoft.Matrix(M11=" + costheta +
+            ",M12=" + (-sintheta) + ",M21=" + sintheta + ",M22=" + costheta +
+            ",SizingMethod='auto expand')\n";
+
+        // set the opacity (needed for the imagedata)
+        var opacity = style.graphicOpacity || style.fillOpacity;
+        if (opacity && opacity != 1) {
+            filter += 
+                "progid:DXImageTransform.Microsoft.BasicImage(opacity=" + 
+                opacity+")\n";
+        }
+        node.style.filter = filter;
+
+        // do the rotation again on a box, so we know the insertion point
+        var centerPoint = new OpenLayers.Geometry.Point(-xOffset, -yOffset);
+        var imgBox = new OpenLayers.Bounds(0, 0, width, height).toGeometry();
+        imgBox.rotate(style.rotation, centerPoint);
+        var imgBounds = imgBox.getBounds();
+
+        node.style.left = Math.round(
+            parseInt(node.style.left) + imgBounds.left) + "px";
+        node.style.top = Math.round(
+            parseInt(node.style.top) - imgBounds.bottom) + "px";
+    },
+
+    /**
+     * Method: postDraw
+     * Does some node postprocessing to work around browser issues:
+     * - Some versions of Internet Explorer seem to be unable to set fillcolor
+     *   and strokecolor to "none" correctly before the fill node is appended
+     *   to a visible vml node. This method takes care of that and sets
+     *   fillcolor and strokecolor again if needed.
+     * - In some cases, a node won't become visible after being drawn. Setting
+     *   style.visibility to "visible" works around that.
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     */
+    postDraw: function(node) {
+        node.style.visibility = "visible";
+        var fillColor = node._style.fillColor;
+        var strokeColor = node._style.strokeColor;
+        if (fillColor == "none" &&
+                node.fillcolor != fillColor) {
+            node.fillcolor = fillColor;
+        }
+        if (strokeColor == "none" &&
+                node.strokecolor != strokeColor) {
+            node.strokecolor = strokeColor;
+        }
+    },
+
+
+    /**
+     * Method: setNodeDimension
+     * Get the geometry's bounds, convert it to our vml coordinate system, 
+     * then set the node's position, size, and local coordinate system.
+     *   
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     */
+    setNodeDimension: function(node, geometry) {
+
+        var bbox = geometry.getBounds();
+        if(bbox) {
+            var resolution = this.getResolution();
+        
+            var scaledBox = 
+                new OpenLayers.Bounds((bbox.left/resolution - this.offset.x) | 0,
+                                      (bbox.bottom/resolution - this.offset.y) | 0,
+                                      (bbox.right/resolution - this.offset.x) | 0,
+                                      (bbox.top/resolution - this.offset.y) | 0);
+            
+            // Set the internal coordinate system to draw the path
+            node.style.left = scaledBox.left + "px";
+            node.style.top = scaledBox.top + "px";
+            node.style.width = scaledBox.getWidth() + "px";
+            node.style.height = scaledBox.getHeight() + "px";
+    
+            node.coordorigin = scaledBox.left + " " + scaledBox.top;
+            node.coordsize = scaledBox.getWidth()+ " " + scaledBox.getHeight();
+        }
+    },
+    
+    /** 
+     * Method: dashStyle
+     * 
+     * Parameters:
+     * style - {Object}
+     * 
+     * Returns:
+     * {String} A VML compliant 'stroke-dasharray' value
+     */
+    dashStyle: function(style) {
+        var dash = style.strokeDashstyle;
+        switch (dash) {
+            case 'solid':
+            case 'dot':
+            case 'dash':
+            case 'dashdot':
+            case 'longdash':
+            case 'longdashdot':
+                return dash;
+            default:
+                // very basic guessing of dash style patterns
+                var parts = dash.split(/[ ,]/);
+                if (parts.length == 2) {
+                    if (1*parts[0] >= 2*parts[1]) {
+                        return "longdash";
+                    }
+                    return (parts[0] == 1 || parts[1] == 1) ? "dot" : "dash";
+                } else if (parts.length == 4) {
+                    return (1*parts[0] >= 2*parts[1]) ? "longdashdot" :
+                        "dashdot";
+                }
+                return "solid";
+        }
+    },
+
+    /**
+     * Method: createNode
+     * Create a new node
+     *
+     * Parameters:
+     * type - {String} Kind of node to draw
+     * id - {String} Id for node
+     *
+     * Returns:
+     * {DOMElement} A new node of the given type and id
+     */
+    createNode: function(type, id) {
+        var node = document.createElement(type);
+        if (id) {
+            node.id = id;
+        }
+        
+        // IE hack to make elements unselectable, to prevent 'blue flash'
+        // while dragging vectors; #1410
+        node.unselectable = 'on';
+        node.onselectstart = OpenLayers.Function.False;
+        
+        return node;    
+    },
+    
+    /**
+     * Method: nodeTypeCompare
+     * Determine whether a node is of a given type
+     *
+     * Parameters:
+     * node - {DOMElement} An VML element
+     * type - {String} Kind of node
+     *
+     * Returns:
+     * {Boolean} Whether or not the specified node is of the specified type
+     */
+    nodeTypeCompare: function(node, type) {
+
+        //split type
+        var subType = type;
+        var splitIndex = subType.indexOf(":");
+        if (splitIndex != -1) {
+            subType = subType.substr(splitIndex+1);
+        }
+
+        //split nodeName
+        var nodeName = node.nodeName;
+        splitIndex = nodeName.indexOf(":");
+        if (splitIndex != -1) {
+            nodeName = nodeName.substr(splitIndex+1);
+        }
+
+        return (subType == nodeName);
+    },
+
+    /**
+     * Method: createRenderRoot
+     * Create the renderer root
+     *
+     * Returns:
+     * {DOMElement} The specific render engine's root element
+     */
+    createRenderRoot: function() {
+        return this.nodeFactory(this.container.id + "_vmlRoot", "div");
+    },
+
+    /**
+     * Method: createRoot
+     * Create the main root element
+     * 
+     * Parameters:
+     * suffix - {String} suffix to append to the id
+     *
+     * Returns:
+     * {DOMElement}
+     */
+    createRoot: function(suffix) {
+        return this.nodeFactory(this.container.id + suffix, "olv:group");
+    },
+    
+    /**************************************
+     *                                    *
+     *     GEOMETRY DRAWING FUNCTIONS     *
+     *                                    *
+     **************************************/
+    
+    /**
+     * Method: drawPoint
+     * Render a point
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the point could not be drawn
+     */
+    drawPoint: function(node, geometry) {
+        return this.drawCircle(node, geometry, 1);
+    },
+
+    /**
+     * Method: drawCircle
+     * Render a circle.
+     * Size and Center a circle given geometry (x,y center) and radius
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * radius - {float}
+     * 
+     * Returns:
+     * {DOMElement} or false if the circle could not ne drawn
+     */
+    drawCircle: function(node, geometry, radius) {
+        if(!isNaN(geometry.x)&& !isNaN(geometry.y)) {
+            var resolution = this.getResolution();
+
+            node.style.left = (((geometry.x /resolution - this.offset.x) | 0) - radius) + "px";
+            node.style.top = (((geometry.y /resolution - this.offset.y) | 0) - radius) + "px";
+    
+            var diameter = radius * 2;
+            
+            node.style.width = diameter + "px";
+            node.style.height = diameter + "px";
+            return node;
+        }
+        return false;
+    },
+
+
+    /**
+     * Method: drawLineString
+     * Render a linestring.
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawLineString: function(node, geometry) {
+        return this.drawLine(node, geometry, false);
+    },
+
+    /**
+     * Method: drawLinearRing
+     * Render a linearring
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawLinearRing: function(node, geometry) {
+        return this.drawLine(node, geometry, true);
+    },
+
+    /**
+     * Method: DrawLine
+     * Render a line.
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * closeLine - {Boolean} Close the line? (make it a ring?)
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawLine: function(node, geometry, closeLine) {
+
+        this.setNodeDimension(node, geometry);
+
+        var resolution = this.getResolution();
+        var numComponents = geometry.components.length;
+        var parts = new Array(numComponents);
+
+        var comp, x, y;
+        for (var i = 0; i < numComponents; i++) {
+            comp = geometry.components[i];
+            x = (comp.x/resolution - this.offset.x) | 0;
+            y = (comp.y/resolution - this.offset.y) | 0;
+            parts[i] = " " + x + "," + y + " l ";
+        }
+        var end = (closeLine) ? " x e" : " e";
+        node.path = "m" + parts.join("") + end;
+        return node;
+    },
+
+    /**
+     * Method: drawPolygon
+     * Render a polygon
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawPolygon: function(node, geometry) {
+        this.setNodeDimension(node, geometry);
+
+        var resolution = this.getResolution();
+    
+        var path = [];
+        var linearRing, i, j, len, ilen, comp, x, y;
+        for (j = 0, len=geometry.components.length; j<len; j++) {
+            linearRing = geometry.components[j];
+
+            path.push("m");
+            for (i=0, ilen=linearRing.components.length; i<ilen; i++) {
+                comp = linearRing.components[i];
+                x = (comp.x / resolution - this.offset.x) | 0;
+                y = (comp.y / resolution - this.offset.y) | 0;
+                path.push(" " + x + "," + y);
+                if (i==0) {
+                    path.push(" l");
+                }
+            }
+            path.push(" x ");
+        }
+        path.push("e");
+        node.path = path.join("");
+        return node;
+    },
+
+    /**
+     * Method: drawRectangle
+     * Render a rectangle
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawRectangle: function(node, geometry) {
+        var resolution = this.getResolution();
+    
+        node.style.left = ((geometry.x/resolution - this.offset.x) | 0) + "px";
+        node.style.top = ((geometry.y/resolution - this.offset.y) | 0) + "px";
+        node.style.width = ((geometry.width/resolution) | 0) + "px";
+        node.style.height = ((geometry.height/resolution) | 0) + "px";
+        
+        return node;
+    },
+    
+    /**
+     * Method: drawText
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * featureId - {String}
+     * style -
+     * location - {<OpenLayers.Geometry.Point>}
+     */
+    drawText: function(featureId, style, location) {
+        var label = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX, "olv:rect");
+        var textbox = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX + "_textbox", "olv:textbox");
+        
+        var resolution = this.getResolution();
+        label.style.left = ((location.x/resolution - this.offset.x) | 0) + "px";
+        label.style.top = ((location.y/resolution - this.offset.y) | 0) + "px";
+        label.style.flip = "y";
+
+        textbox.innerText = style.label;
+
+        if (style.fontColor) {
+            textbox.style.color = style.fontColor;
+        }
+        if (style.fontOpacity) {
+            textbox.style.filter = 'alpha(opacity=' + (style.fontOpacity * 100) + ')';
+        }
+        if (style.fontFamily) {
+            textbox.style.fontFamily = style.fontFamily;
+        }
+        if (style.fontSize) {
+            textbox.style.fontSize = style.fontSize;
+        }
+        if (style.fontWeight) {
+            textbox.style.fontWeight = style.fontWeight;
+        }
+        if(style.labelSelect === true) {
+            label._featureId = featureId;
+            textbox._featureId = featureId;
+            textbox._geometry = location;
+            textbox._geometryClass = location.CLASS_NAME;
+        }
+        textbox.style.whiteSpace = "nowrap";
+        // fun with IE: IE7 in standards compliant mode does not display any
+        // text with a left inset of 0. So we set this to 1px and subtract one
+        // pixel later when we set label.style.left
+        textbox.inset = "1px,0px,0px,0px";
+
+        if(!label.parentNode) {
+            label.appendChild(textbox);
+            this.textRoot.appendChild(label);
+        }
+
+        var align = style.labelAlign || "cm";
+        if (align.length == 1) {
+            align += "m";
+        }
+        var xshift = textbox.clientWidth *
+            (OpenLayers.Renderer.VML.LABEL_SHIFT[align.substr(0,1)]);
+        var yshift = textbox.clientHeight *
+            (OpenLayers.Renderer.VML.LABEL_SHIFT[align.substr(1,1)]);
+        label.style.left = parseInt(label.style.left)-xshift-1+"px";
+        label.style.top = parseInt(label.style.top)+yshift+"px";
+        
+    },
+
+    /**
+     * Method: drawSurface
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    drawSurface: function(node, geometry) {
+
+        this.setNodeDimension(node, geometry);
+
+        var resolution = this.getResolution();
+    
+        var path = [];
+        var comp, x, y;
+        for (var i=0, len=geometry.components.length; i<len; i++) {
+            comp = geometry.components[i];
+            x = (comp.x / resolution - this.offset.x) | 0;
+            y = (comp.y / resolution - this.offset.y) | 0;
+            if ((i%3)==0 && (i/3)==0) {
+                path.push("m");
+            } else if ((i%3)==1) {
+                path.push(" c");
+            }
+            path.push(" " + x + "," + y);
+        }
+        path.push(" x e");
+
+        node.path = path.join("");
+        return node;
+    },
+    
+    /**
+     * Method: moveRoot
+     * moves this renderer's root to a different renderer.
+     * 
+     * Parameters:
+     * renderer - {<OpenLayers.Renderer>} target renderer for the moved root
+     * root - {DOMElement} optional root node. To be used when this renderer
+     *     holds roots from multiple layers to tell this method which one to
+     *     detach
+     * 
+     * Returns:
+     * {Boolean} true if successful, false otherwise
+     */
+    moveRoot: function(renderer) {
+        var layer = this.map.getLayer(renderer.container.id);
+        if(layer instanceof OpenLayers.Layer.Vector.RootContainer) {
+            layer = this.map.getLayer(this.container.id);
+        }
+        layer && layer.renderer.clear();
+        OpenLayers.Renderer.Elements.prototype.moveRoot.apply(this, arguments);
+        layer && layer.redraw();
+    },
+    
+    /**
+     * Method: importSymbol
+     * add a new symbol definition from the rendererer's symbol hash
+     * 
+     * Parameters:
+     * graphicName - {String} name of the symbol to import
+     * 
+     * Returns:
+     * {Object} - hash of {DOMElement} "symbol" and {Number} "size"
+     */      
+    importSymbol: function (graphicName)  {
+        var id = this.container.id + "-" + graphicName;
+        
+        // check if symbol already exists in the cache
+        var cache = this.symbolCache[id];
+        if (cache) {
+            return cache;
+        }
+        
+        var symbol = OpenLayers.Renderer.symbol[graphicName];
+        if (!symbol) {
+            throw new Error(graphicName + ' is not a valid symbol name');
+        }
+
+        var symbolExtent = new OpenLayers.Bounds(
+                                    Number.MAX_VALUE, Number.MAX_VALUE, 0, 0);
+        
+        var pathitems = ["m"];
+        for (var i=0; i<symbol.length; i=i+2) {
+            var x = symbol[i];
+            var y = symbol[i+1];
+            symbolExtent.left = Math.min(symbolExtent.left, x);
+            symbolExtent.bottom = Math.min(symbolExtent.bottom, y);
+            symbolExtent.right = Math.max(symbolExtent.right, x);
+            symbolExtent.top = Math.max(symbolExtent.top, y);
+
+            pathitems.push(x);
+            pathitems.push(y);
+            if (i == 0) {
+                pathitems.push("l");
+            }
+        }
+        pathitems.push("x e");
+        var path = pathitems.join(" ");
+
+        var diff = (symbolExtent.getWidth() - symbolExtent.getHeight()) / 2;
+        if(diff > 0) {
+            symbolExtent.bottom = symbolExtent.bottom - diff;
+            symbolExtent.top = symbolExtent.top + diff;
+        } else {
+            symbolExtent.left = symbolExtent.left + diff;
+            symbolExtent.right = symbolExtent.right - diff;
+        }
+        
+        cache = {
+            path: path,
+            size: symbolExtent.getWidth(), // equals getHeight() now
+            left: symbolExtent.left,
+            bottom: symbolExtent.bottom
+        };
+        this.symbolCache[id] = cache;
+        
+        return cache;
+    },
+    
+    CLASS_NAME: "OpenLayers.Renderer.VML"
+});
+
+/**
+ * Constant: OpenLayers.Renderer.VML.LABEL_SHIFT
+ * {Object}
+ */
+OpenLayers.Renderer.VML.LABEL_SHIFT = {
+    "l": 0,
+    "c": .5,
+    "r": 1,
+    "t": 0,
+    "m": .5,
+    "b": 1
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/SVG.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/SVG.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Renderer/SVG.js	(revision 76)
@@ -0,0 +1,995 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Renderer/Elements.js
+ */
+
+/**
+ * Class: OpenLayers.Renderer.SVG
+ * 
+ * Inherits:
+ *  - <OpenLayers.Renderer.Elements>
+ */
+OpenLayers.Renderer.SVG = OpenLayers.Class(OpenLayers.Renderer.Elements, {
+
+    /** 
+     * Property: xmlns
+     * {String}
+     */
+    xmlns: "http://www.w3.org/2000/svg",
+    
+    /**
+     * Property: xlinkns
+     * {String}
+     */
+    xlinkns: "http://www.w3.org/1999/xlink",
+
+    /**
+     * Constant: MAX_PIXEL
+     * {Integer} Firefox has a limitation where values larger or smaller than  
+     *           about 15000 in an SVG document lock the browser up. This 
+     *           works around it.
+     */
+    MAX_PIXEL: 15000,
+
+    /**
+     * Property: translationParameters
+     * {Object} Hash with "x" and "y" properties
+     */
+    translationParameters: null,
+    
+    /**
+     * Property: symbolMetrics
+     * {Object} Cache for symbol metrics according to their svg coordinate
+     *     space. This is an object keyed by the symbol's id, and values are
+     *     an array of [width, centerX, centerY].
+     */
+    symbolMetrics: null,
+    
+    /**
+     * Property: isGecko
+     * {Boolean}
+     */
+    isGecko: null,
+
+    /**
+     * Property: supportUse
+     * {Boolean} true if defs/use is supported - known to not work as expected
+     * at least in some applewebkit/5* builds.
+     * See https://bugs.webkit.org/show_bug.cgi?id=33322
+     */
+    supportUse: null,
+
+    /**
+     * Constructor: OpenLayers.Renderer.SVG
+     * 
+     * Parameters:
+     * containerID - {String}
+     */
+    initialize: function(containerID) {
+        if (!this.supported()) { 
+            return; 
+        }
+        OpenLayers.Renderer.Elements.prototype.initialize.apply(this, 
+                                                                arguments);
+        this.translationParameters = {x: 0, y: 0};
+        this.supportUse = (navigator.userAgent.toLowerCase().indexOf("applewebkit/5") == -1);
+        this.isGecko = (navigator.userAgent.toLowerCase().indexOf("gecko/") != -1);
+        
+        this.symbolMetrics = {};
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        OpenLayers.Renderer.Elements.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * APIMethod: supported
+     * 
+     * Returns:
+     * {Boolean} Whether or not the browser supports the SVG renderer
+     */
+    supported: function() {
+        var svgFeature = "http://www.w3.org/TR/SVG11/feature#";
+        return (document.implementation && 
+           (document.implementation.hasFeature("org.w3c.svg", "1.0") || 
+            document.implementation.hasFeature(svgFeature + "SVG", "1.1") || 
+            document.implementation.hasFeature(svgFeature + "BasicStructure", "1.1") ));
+    },    
+
+    /**
+     * Method: inValidRange
+     * See #669 for more information
+     *
+     * Parameters:
+     * x      - {Integer}
+     * y      - {Integer}
+     * xyOnly - {Boolean} whether or not to just check for x and y, which means
+     *     to not take the current translation parameters into account if true.
+     * 
+     * Returns:
+     * {Boolean} Whether or not the 'x' and 'y' coordinates are in the  
+     *           valid range.
+     */ 
+    inValidRange: function(x, y, xyOnly) {
+        var left = x + (xyOnly ? 0 : this.translationParameters.x);
+        var top = y + (xyOnly ? 0 : this.translationParameters.y);
+        return (left >= -this.MAX_PIXEL && left <= this.MAX_PIXEL &&
+                top >= -this.MAX_PIXEL && top <= this.MAX_PIXEL);
+    },
+
+    /**
+     * Method: setExtent
+     * 
+     * Parameters:
+     * extent - {<OpenLayers.Bounds>}
+     * resolutionChanged - {Boolean}
+     * 
+     * Returns:
+     * {Boolean} true to notify the layer that the new extent does not exceed
+     *     the coordinate range, and the features will not need to be redrawn.
+     *     False otherwise.
+     */
+    setExtent: function(extent, resolutionChanged) {
+        OpenLayers.Renderer.Elements.prototype.setExtent.apply(this, 
+                                                               arguments);
+        
+        var resolution = this.getResolution();
+        var left = -extent.left / resolution;
+        var top = extent.top / resolution;
+
+        // If the resolution has changed, start over changing the corner, because
+        // the features will redraw.
+        if (resolutionChanged) {
+            this.left = left;
+            this.top = top;
+            // Set the viewbox
+            var extentString = "0 0 " + this.size.w + " " + this.size.h;
+
+            this.rendererRoot.setAttributeNS(null, "viewBox", extentString);
+            this.translate(0, 0);
+            return true;
+        } else {
+            var inRange = this.translate(left - this.left, top - this.top);
+            if (!inRange) {
+                // recenter the coordinate system
+                this.setExtent(extent, true);
+            }
+            return inRange;
+        }
+    },
+    
+    /**
+     * Method: translate
+     * Transforms the SVG coordinate system
+     * 
+     * Parameters:
+     * x - {Float}
+     * y - {Float}
+     * 
+     * Returns:
+     * {Boolean} true if the translation parameters are in the valid coordinates
+     *     range, false otherwise.
+     */
+    translate: function(x, y) {
+        if (!this.inValidRange(x, y, true)) {
+            return false;
+        } else {
+            var transformString = "";
+            if (x || y) {
+                transformString = "translate(" + x + "," + y + ")";
+            }
+            this.root.setAttributeNS(null, "transform", transformString);
+            this.translationParameters = {x: x, y: y};
+            return true;
+        }
+    },
+
+    /**
+     * Method: setSize
+     * Sets the size of the drawing surface.
+     * 
+     * Parameters:
+     * size - {<OpenLayers.Size>} The size of the drawing surface
+     */
+    setSize: function(size) {
+        OpenLayers.Renderer.prototype.setSize.apply(this, arguments);
+        
+        this.rendererRoot.setAttributeNS(null, "width", this.size.w);
+        this.rendererRoot.setAttributeNS(null, "height", this.size.h);
+    },
+
+    /** 
+     * Method: getNodeType 
+     * 
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>}
+     * style - {Object}
+     * 
+     * Returns:
+     * {String} The corresponding node type for the specified geometry
+     */
+    getNodeType: function(geometry, style) {
+        var nodeType = null;
+        switch (geometry.CLASS_NAME) {
+            case "OpenLayers.Geometry.Point":
+                if (style.externalGraphic) {
+                    nodeType = "image";
+                } else if (this.isComplexSymbol(style.graphicName)) {
+                    nodeType = this.supportUse === false ? "svg" : "use";
+                } else {
+                    nodeType = "circle";
+                }
+                break;
+            case "OpenLayers.Geometry.Rectangle":
+                nodeType = "rect";
+                break;
+            case "OpenLayers.Geometry.LineString":
+                nodeType = "polyline";
+                break;
+            case "OpenLayers.Geometry.LinearRing":
+                nodeType = "polygon";
+                break;
+            case "OpenLayers.Geometry.Polygon":
+            case "OpenLayers.Geometry.Curve":
+            case "OpenLayers.Geometry.Surface":
+                nodeType = "path";
+                break;
+            default:
+                break;
+        }
+        return nodeType;
+    },
+
+    /** 
+     * Method: setStyle
+     * Use to set all the style attributes to a SVG node.
+     * 
+     * Takes care to adjust stroke width and point radius to be
+     * resolution-relative
+     *
+     * Parameters:
+     * node - {SVGDomElement} An SVG element to decorate
+     * style - {Object}
+     * options - {Object} Currently supported options include 
+     *                              'isFilled' {Boolean} and
+     *                              'isStroked' {Boolean}
+     */
+    setStyle: function(node, style, options) {
+        style = style  || node._style;
+        options = options || node._options;
+        var r = parseFloat(node.getAttributeNS(null, "r"));
+        var widthFactor = 1;
+        var pos;
+        if (node._geometryClass == "OpenLayers.Geometry.Point" && r) {
+            node.style.visibility = "";
+            if (style.graphic === false) {
+                node.style.visibility = "hidden";
+            } else if (style.externalGraphic) {
+                pos = this.getPosition(node);
+                
+                if (style.graphicTitle) {
+                    node.setAttributeNS(null, "title", style.graphicTitle);
+                }
+                if (style.graphicWidth && style.graphicHeight) {
+                  node.setAttributeNS(null, "preserveAspectRatio", "none");
+                }
+                var width = style.graphicWidth || style.graphicHeight;
+                var height = style.graphicHeight || style.graphicWidth;
+                width = width ? width : style.pointRadius*2;
+                height = height ? height : style.pointRadius*2;
+                var xOffset = (style.graphicXOffset != undefined) ?
+                    style.graphicXOffset : -(0.5 * width);
+                var yOffset = (style.graphicYOffset != undefined) ?
+                    style.graphicYOffset : -(0.5 * height);
+
+                var opacity = style.graphicOpacity || style.fillOpacity;
+                
+                node.setAttributeNS(null, "x", (pos.x + xOffset).toFixed());
+                node.setAttributeNS(null, "y", (pos.y + yOffset).toFixed());
+                node.setAttributeNS(null, "width", width);
+                node.setAttributeNS(null, "height", height);
+                node.setAttributeNS(this.xlinkns, "href", style.externalGraphic);
+                node.setAttributeNS(null, "style", "opacity: "+opacity);
+            } else if (this.isComplexSymbol(style.graphicName)) {
+                // the symbol viewBox is three times as large as the symbol
+                var offset = style.pointRadius * 3;
+                var size = offset * 2;
+                var id = this.importSymbol(style.graphicName);
+                pos = this.getPosition(node);
+                widthFactor = this.symbolMetrics[id][0] * 3 / size;
+                
+                // remove the node from the dom before we modify it. This
+                // prevents various rendering issues in Safari and FF
+                var parent = node.parentNode;
+                var nextSibling = node.nextSibling;
+                if(parent) {
+                    parent.removeChild(node);
+                }
+                
+                if(this.supportUse === false) {
+                    // workaround for webkit versions that cannot do defs/use
+                    // (see https://bugs.webkit.org/show_bug.cgi?id=33322):
+                    // copy the symbol instead of referencing it
+                    var src = document.getElementById(id);
+                    node.firstChild && node.removeChild(node.firstChild);
+                    node.appendChild(src.firstChild.cloneNode(true));
+                    node.setAttributeNS(null, "viewBox", src.getAttributeNS(null, "viewBox"));
+                } else {
+                    node.setAttributeNS(this.xlinkns, "href", "#" + id);
+                }
+                node.setAttributeNS(null, "width", size);
+                node.setAttributeNS(null, "height", size);
+                node.setAttributeNS(null, "x", pos.x - offset);
+                node.setAttributeNS(null, "y", pos.y - offset);
+                
+                // now that the node has all its new properties, insert it
+                // back into the dom where it was
+                if(nextSibling) {
+                    parent.insertBefore(node, nextSibling);
+                } else if(parent) {
+                    parent.appendChild(node);
+                }
+            } else {
+                node.setAttributeNS(null, "r", style.pointRadius);
+            }
+
+            var rotation = style.rotation;
+            if ((rotation !== undefined || node._rotation !== undefined) && pos) {
+                node._rotation = rotation;
+                rotation |= 0;
+                if(node.nodeName !== "svg") {
+                    node.setAttributeNS(null, "transform",
+                        "rotate(" + rotation + " " + pos.x + " " +
+                        pos.y + ")");
+                } else {
+                     var metrics = this.symbolMetrics[id];
+                     node.firstChild.setAttributeNS(null, "transform",
+                     "rotate(" + style.rotation + " " + metrics[1] +
+                         " " +  metrics[2] + ")");
+                }
+            }
+        }
+        
+        if (options.isFilled) {
+            node.setAttributeNS(null, "fill", style.fillColor);
+            node.setAttributeNS(null, "fill-opacity", style.fillOpacity);
+        } else {
+            node.setAttributeNS(null, "fill", "none");
+        }
+
+        if (options.isStroked) {
+            node.setAttributeNS(null, "stroke", style.strokeColor);
+            node.setAttributeNS(null, "stroke-opacity", style.strokeOpacity);
+            node.setAttributeNS(null, "stroke-width", style.strokeWidth * widthFactor);
+            node.setAttributeNS(null, "stroke-linecap", style.strokeLinecap || "round");
+            // Hard-coded linejoin for now, to make it look the same as in VML.
+            // There is no strokeLinejoin property yet for symbolizers.
+            node.setAttributeNS(null, "stroke-linejoin", "round");
+            style.strokeDashstyle && node.setAttributeNS(null,
+                "stroke-dasharray", this.dashStyle(style, widthFactor));
+        } else {
+            node.setAttributeNS(null, "stroke", "none");
+        }
+        
+        if (style.pointerEvents) {
+            node.setAttributeNS(null, "pointer-events", style.pointerEvents);
+        }
+                
+        if (style.cursor != null) {
+            node.setAttributeNS(null, "cursor", style.cursor);
+        }
+        
+        return node;
+    },
+
+    /** 
+     * Method: dashStyle
+     * 
+     * Parameters:
+     * style - {Object}
+     * widthFactor - {Number}
+     * 
+     * Returns:
+     * {String} A SVG compliant 'stroke-dasharray' value
+     */
+    dashStyle: function(style, widthFactor) {
+        var w = style.strokeWidth * widthFactor;
+        var str = style.strokeDashstyle;
+        switch (str) {
+            case 'solid':
+                return 'none';
+            case 'dot':
+                return [1, 4 * w].join();
+            case 'dash':
+                return [4 * w, 4 * w].join();
+            case 'dashdot':
+                return [4 * w, 4 * w, 1, 4 * w].join();
+            case 'longdash':
+                return [8 * w, 4 * w].join();
+            case 'longdashdot':
+                return [8 * w, 4 * w, 1, 4 * w].join();
+            default:
+                return OpenLayers.String.trim(str).replace(/\s+/g, ",");
+        }
+    },
+    
+    /** 
+     * Method: createNode
+     * 
+     * Parameters:
+     * type - {String} Kind of node to draw
+     * id - {String} Id for node
+     * 
+     * Returns:
+     * {DOMElement} A new node of the given type and id
+     */
+    createNode: function(type, id) {
+        var node = document.createElementNS(this.xmlns, type);
+        if (id) {
+            node.setAttributeNS(null, "id", id);
+        }
+        return node;    
+    },
+    
+    /** 
+     * Method: nodeTypeCompare
+     * 
+     * Parameters:
+     * node - {SVGDomElement} An SVG element
+     * type - {String} Kind of node
+     * 
+     * Returns:
+     * {Boolean} Whether or not the specified node is of the specified type
+     */
+    nodeTypeCompare: function(node, type) {
+        return (type == node.nodeName);
+    },
+   
+    /**
+     * Method: createRenderRoot
+     * 
+     * Returns:
+     * {DOMElement} The specific render engine's root element
+     */
+    createRenderRoot: function() {
+        return this.nodeFactory(this.container.id + "_svgRoot", "svg");
+    },
+
+    /**
+     * Method: createRoot
+     * 
+     * Parameter:
+     * suffix - {String} suffix to append to the id
+     * 
+     * Returns:
+     * {DOMElement}
+     */
+    createRoot: function(suffix) {
+        return this.nodeFactory(this.container.id + suffix, "g");
+    },
+
+    /**
+     * Method: createDefs
+     *
+     * Returns:
+     * {DOMElement} The element to which we'll add the symbol definitions
+     */
+    createDefs: function() {
+        var defs = this.nodeFactory(this.container.id + "_defs", "defs");
+        this.rendererRoot.appendChild(defs);
+        return defs;
+    },
+
+    /**************************************
+     *                                    *
+     *     GEOMETRY DRAWING FUNCTIONS     *
+     *                                    *
+     **************************************/
+
+    /**
+     * Method: drawPoint
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the point
+     */ 
+    drawPoint: function(node, geometry) {
+        return this.drawCircle(node, geometry, 1);
+    },
+
+    /**
+     * Method: drawCircle
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * radius - {Float}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the circle
+     */
+    drawCircle: function(node, geometry, radius) {
+        var resolution = this.getResolution();
+        var x = (geometry.x / resolution + this.left);
+        var y = (this.top - geometry.y / resolution);
+
+        if (this.inValidRange(x, y)) { 
+            node.setAttributeNS(null, "cx", x);
+            node.setAttributeNS(null, "cy", y);
+            node.setAttributeNS(null, "r", radius);
+            return node;
+        } else {
+            return false;
+        }    
+            
+    },
+    
+    /**
+     * Method: drawLineString
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components of
+     *     the linestring, or false if nothing could be drawn
+     */ 
+    drawLineString: function(node, geometry) {
+        var componentsResult = this.getComponentsString(geometry.components);
+        if (componentsResult.path) {
+            node.setAttributeNS(null, "points", componentsResult.path);
+            return (componentsResult.complete ? node : null);  
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: drawLinearRing
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components
+     *     of the linear ring, or false if nothing could be drawn
+     */ 
+    drawLinearRing: function(node, geometry) {
+        var componentsResult = this.getComponentsString(geometry.components);
+        if (componentsResult.path) {
+            node.setAttributeNS(null, "points", componentsResult.path);
+            return (componentsResult.complete ? node : null);  
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: drawPolygon
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or null if the renderer could not draw all components
+     *     of the polygon, or false if nothing could be drawn
+     */ 
+    drawPolygon: function(node, geometry) {
+        var d = "";
+        var draw = true;
+        var complete = true;
+        var linearRingResult, path;
+        for (var j=0, len=geometry.components.length; j<len; j++) {
+            d += " M";
+            linearRingResult = this.getComponentsString(
+                geometry.components[j].components, " ");
+            path = linearRingResult.path;
+            if (path) {
+                d += " " + path;
+                complete = linearRingResult.complete && complete;
+            } else {
+                draw = false;
+            }
+        }
+        d += " z";
+        if (draw) {
+            node.setAttributeNS(null, "d", d);
+            node.setAttributeNS(null, "fill-rule", "evenodd");
+            return complete ? node : null;
+        } else {
+            return false;
+        }    
+    },
+    
+    /**
+     * Method: drawRectangle
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the rectangle
+     */ 
+    drawRectangle: function(node, geometry) {
+        var resolution = this.getResolution();
+        var x = (geometry.x / resolution + this.left);
+        var y = (this.top - geometry.y / resolution);
+
+        if (this.inValidRange(x, y)) { 
+            node.setAttributeNS(null, "x", x);
+            node.setAttributeNS(null, "y", y);
+            node.setAttributeNS(null, "width", geometry.width / resolution);
+            node.setAttributeNS(null, "height", geometry.height / resolution);
+            return node;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: drawSurface
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * node - {DOMElement}
+     * geometry - {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {DOMElement} or false if the renderer could not draw the surface
+     */ 
+    drawSurface: function(node, geometry) {
+
+        // create the svg path string representation
+        var d = null;
+        var draw = true;
+        for (var i=0, len=geometry.components.length; i<len; i++) {
+            if ((i%3) == 0 && (i/3) == 0) {
+                var component = this.getShortString(geometry.components[i]);
+                if (!component) { draw = false; }
+                d = "M " + component;
+            } else if ((i%3) == 1) {
+                var component = this.getShortString(geometry.components[i]);
+                if (!component) { draw = false; }
+                d += " C " + component;
+            } else {
+                var component = this.getShortString(geometry.components[i]);
+                if (!component) { draw = false; }
+                d += " " + component;
+            }
+        }
+        d += " Z";
+        if (draw) {
+            node.setAttributeNS(null, "d", d);
+            return node;
+        } else {
+            return false;
+        }    
+    },
+    
+    /**
+     * Method: drawText
+     * This method is only called by the renderer itself.
+     * 
+     * Parameters: 
+     * featureId - {String}
+     * style -
+     * location - {<OpenLayers.Geometry.Point>}
+     */
+    drawText: function(featureId, style, location) {
+        var resolution = this.getResolution();
+        
+        var x = (location.x / resolution + this.left);
+        var y = (location.y / resolution - this.top);
+        
+        var label = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX, "text");
+        var tspan = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX + "_tspan", "tspan");
+
+        label.setAttributeNS(null, "x", x);
+        label.setAttributeNS(null, "y", -y);
+        
+        if (style.fontColor) {
+            label.setAttributeNS(null, "fill", style.fontColor);
+        }
+        if (style.fontOpacity) {
+            label.setAttributeNS(null, "opacity", style.fontOpacity);
+        }
+        if (style.fontFamily) {
+            label.setAttributeNS(null, "font-family", style.fontFamily);
+        }
+        if (style.fontSize) {
+            label.setAttributeNS(null, "font-size", style.fontSize);
+        }
+        if (style.fontWeight) {
+            label.setAttributeNS(null, "font-weight", style.fontWeight);
+        }
+        if(style.labelSelect === true) {
+            label.setAttributeNS(null, "pointer-events", "visible");
+            label._featureId = featureId;
+            tspan._featureId = featureId;
+            tspan._geometry = location;
+            tspan._geometryClass = location.CLASS_NAME;
+        } else {
+            label.setAttributeNS(null, "pointer-events", "none");
+        }
+        var align = style.labelAlign || "cm";
+        label.setAttributeNS(null, "text-anchor",
+            OpenLayers.Renderer.SVG.LABEL_ALIGN[align[0]] || "middle");
+
+        if (this.isGecko) {
+            label.setAttributeNS(null, "dominant-baseline",
+                OpenLayers.Renderer.SVG.LABEL_ALIGN[align[1]] || "central");
+        } else {
+            tspan.setAttributeNS(null, "baseline-shift",
+                OpenLayers.Renderer.SVG.LABEL_VSHIFT[align[1]] || "-35%");
+        }
+
+        tspan.textContent = style.label;
+        
+        if(!label.parentNode) {
+            label.appendChild(tspan);
+            this.textRoot.appendChild(label);
+        }   
+    },
+    
+    /** 
+     * Method: getComponentString
+     * 
+     * Parameters:
+     * components - {Array(<OpenLayers.Geometry.Point>)} Array of points
+     * separator - {String} character between coordinate pairs. Defaults to ","
+     * 
+     * Returns:
+     * {Object} hash with properties "path" (the string created from the
+     *     components and "complete" (false if the renderer was unable to
+     *     draw all components)
+     */
+    getComponentsString: function(components, separator) {
+        var renderCmp = [];
+        var complete = true;
+        var len = components.length;
+        var strings = [];
+        var str, component;
+        for(var i=0; i<len; i++) {
+            component = components[i];
+            renderCmp.push(component);
+            str = this.getShortString(component);
+            if (str) {
+                strings.push(str);
+            } else {
+                // The current component is outside the valid range. Let's
+                // see if the previous or next component is inside the range.
+                // If so, add the coordinate of the intersection with the
+                // valid range bounds.
+                if (i > 0) {
+                    if (this.getShortString(components[i - 1])) {
+                        strings.push(this.clipLine(components[i],
+                            components[i-1]));
+                    }
+                }
+                if (i < len - 1) {
+                    if (this.getShortString(components[i + 1])) {
+                        strings.push(this.clipLine(components[i],
+                            components[i+1]));
+                    }
+                }
+                complete = false;
+            }
+        }
+
+        return {
+            path: strings.join(separator || ","),
+            complete: complete
+        };
+    },
+    
+    /**
+     * Method: clipLine
+     * Given two points (one inside the valid range, and one outside),
+     * clips the line betweeen the two points so that the new points are both
+     * inside the valid range.
+     * 
+     * Parameters:
+     * badComponent - {<OpenLayers.Geometry.Point>)} original geometry of the
+     *     invalid point
+     * goodComponent - {<OpenLayers.Geometry.Point>)} original geometry of the
+     *     valid point
+     * Returns
+     * {String} the SVG coordinate pair of the clipped point (like
+     *     getShortString), or an empty string if both passed componets are at
+     *     the same point.
+     */
+    clipLine: function(badComponent, goodComponent) {
+        if (goodComponent.equals(badComponent)) {
+            return "";
+        }
+        var resolution = this.getResolution();
+        var maxX = this.MAX_PIXEL - this.translationParameters.x;
+        var maxY = this.MAX_PIXEL - this.translationParameters.y;
+        var x1 = goodComponent.x / resolution + this.left;
+        var y1 = this.top - goodComponent.y / resolution;
+        var x2 = badComponent.x / resolution + this.left;
+        var y2 = this.top - badComponent.y / resolution;
+        var k;
+        if (x2 < -maxX || x2 > maxX) {
+            k = (y2 - y1) / (x2 - x1);
+            x2 = x2 < 0 ? -maxX : maxX;
+            y2 = y1 + (x2 - x1) * k;
+        }
+        if (y2 < -maxY || y2 > maxY) {
+            k = (x2 - x1) / (y2 - y1);
+            y2 = y2 < 0 ? -maxY : maxY;
+            x2 = x1 + (y2 - y1) * k;
+        }
+        return x2 + "," + y2;
+    },
+
+    /** 
+     * Method: getShortString
+     * 
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>}
+     * 
+     * Returns:
+     * {String} or false if point is outside the valid range
+     */
+    getShortString: function(point) {
+        var resolution = this.getResolution();
+        var x = (point.x / resolution + this.left);
+        var y = (this.top - point.y / resolution);
+
+        if (this.inValidRange(x, y)) { 
+            return x + "," + y;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: getPosition
+     * Finds the position of an svg node.
+     * 
+     * Parameters:
+     * node - {DOMElement}
+     * 
+     * Returns:
+     * {Object} hash with x and y properties, representing the coordinates
+     *     within the svg coordinate system
+     */
+    getPosition: function(node) {
+        return({
+            x: parseFloat(node.getAttributeNS(null, "cx")),
+            y: parseFloat(node.getAttributeNS(null, "cy"))
+        });
+    },
+
+    /**
+     * Method: importSymbol
+     * add a new symbol definition from the rendererer's symbol hash
+     * 
+     * Parameters:
+     * graphicName - {String} name of the symbol to import
+     * 
+     * Returns:
+     * {String} - id of the imported symbol
+     */      
+    importSymbol: function (graphicName)  {
+        if (!this.defs) {
+            // create svg defs tag
+            this.defs = this.createDefs();
+        }
+        var id = this.container.id + "-" + graphicName;
+        
+        // check if symbol already exists in the defs
+        if (document.getElementById(id) != null) {
+            return id;
+        }
+        
+        var symbol = OpenLayers.Renderer.symbol[graphicName];
+        if (!symbol) {
+            throw new Error(graphicName + ' is not a valid symbol name');
+        }
+
+        var symbolNode = this.nodeFactory(id, "symbol");
+        var node = this.nodeFactory(null, "polygon");
+        symbolNode.appendChild(node);
+        var symbolExtent = new OpenLayers.Bounds(
+                                    Number.MAX_VALUE, Number.MAX_VALUE, 0, 0);
+
+        var points = [];
+        var x,y;
+        for (var i=0; i<symbol.length; i=i+2) {
+            x = symbol[i];
+            y = symbol[i+1];
+            symbolExtent.left = Math.min(symbolExtent.left, x);
+            symbolExtent.bottom = Math.min(symbolExtent.bottom, y);
+            symbolExtent.right = Math.max(symbolExtent.right, x);
+            symbolExtent.top = Math.max(symbolExtent.top, y);
+            points.push(x, ",", y);
+        }
+        
+        node.setAttributeNS(null, "points", points.join(" "));
+        
+        var width = symbolExtent.getWidth();
+        var height = symbolExtent.getHeight();
+        // create a viewBox three times as large as the symbol itself,
+        // to allow for strokeWidth being displayed correctly at the corners.
+        var viewBox = [symbolExtent.left - width,
+                        symbolExtent.bottom - height, width * 3, height * 3];
+        symbolNode.setAttributeNS(null, "viewBox", viewBox.join(" "));
+        this.symbolMetrics[id] = [
+            Math.max(width, height),
+            symbolExtent.getCenterLonLat().lon,
+            symbolExtent.getCenterLonLat().lat
+        ];
+        
+        this.defs.appendChild(symbolNode);
+        return symbolNode.id;
+    },
+    
+    /**
+     * Method: getFeatureIdFromEvent
+     * 
+     * Parameters:
+     * evt - {Object} An <OpenLayers.Event> object
+     *
+     * Returns:
+     * {<OpenLayers.Geometry>} A geometry from an event that 
+     *     happened on a layer.
+     */
+    getFeatureIdFromEvent: function(evt) {
+        var featureId = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent.apply(this, arguments);
+        if(this.supportUse === false && !featureId) {
+            var target = evt.target;
+            featureId = target.parentNode && target != this.rendererRoot &&
+                target.parentNode._featureId;
+        }
+        return featureId;
+    },
+
+    CLASS_NAME: "OpenLayers.Renderer.SVG"
+});
+
+/**
+ * Constant: OpenLayers.Renderer.SVG.LABEL_ALIGN
+ * {Object}
+ */
+OpenLayers.Renderer.SVG.LABEL_ALIGN = {
+    "l": "start",
+    "r": "end",
+    "b": "bottom",
+    "t": "hanging"
+};
+
+/**
+ * Constant: OpenLayers.Renderer.SVG.LABEL_VSHIFT
+ * {Object}
+ */
+OpenLayers.Renderer.SVG.LABEL_VSHIFT = {
+    // according to
+    // http://www.w3.org/Graphics/SVG/Test/20061213/htmlObjectHarness/full-text-align-02-b.html
+    // a baseline-shift of -70% shifts the text exactly from the
+    // bottom to the top of the baseline, so -35% moves the text to
+    // the center of the baseline.
+    "t": "-70%",
+    "b": "0"    
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Feature.js	(revision 76)
@@ -0,0 +1,227 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Marker.js
+ * @requires OpenLayers/Popup/AnchoredBubble.js
+ */
+
+/**
+ * Class: OpenLayers.Feature
+ * Features are combinations of geography and attributes. The OpenLayers.Feature
+ *     class specifically combines a marker and a lonlat.
+ */
+OpenLayers.Feature = OpenLayers.Class({
+
+    /** 
+     * Property: layer 
+     * {<OpenLayers.Layer>} 
+     */
+    layer: null,
+
+    /** 
+     * Property: id 
+     * {String} 
+     */
+    id: null,
+    
+    /** 
+     * Property: lonlat 
+     * {<OpenLayers.LonLat>} 
+     */
+    lonlat: null,
+
+    /** 
+     * Property: data 
+     * {Object} 
+     */
+    data: null,
+
+    /** 
+     * Property: marker 
+     * {<OpenLayers.Marker>} 
+     */
+    marker: null,
+
+    /**
+     * APIProperty: popupClass
+     * {<OpenLayers.Class>} The class which will be used to instantiate
+     *     a new Popup. Default is <OpenLayers.Popup.AnchoredBubble>.
+     */
+    popupClass: OpenLayers.Popup.AnchoredBubble,
+
+    /** 
+     * Property: popup 
+     * {<OpenLayers.Popup>} 
+     */
+    popup: null,
+
+    /** 
+     * Constructor: OpenLayers.Feature
+     * Constructor for features.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} 
+     * lonlat - {<OpenLayers.LonLat>} 
+     * data - {Object} 
+     * 
+     * Returns:
+     * {<OpenLayers.Feature>}
+     */
+    initialize: function(layer, lonlat, data) {
+        this.layer = layer;
+        this.lonlat = lonlat;
+        this.data = (data != null) ? data : {};
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_"); 
+    },
+
+    /** 
+     * Method: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+
+        //remove the popup from the map
+        if ((this.layer != null) && (this.layer.map != null)) {
+            if (this.popup != null) {
+                this.layer.map.removePopup(this.popup);
+            }
+        }
+        // remove the marker from the layer
+        if (this.layer != null && this.marker != null) {
+            this.layer.removeMarker(this.marker);
+        }
+
+        this.layer = null;
+        this.id = null;
+        this.lonlat = null;
+        this.data = null;
+        if (this.marker != null) {
+            this.destroyMarker(this.marker);
+            this.marker = null;
+        }
+        if (this.popup != null) {
+            this.destroyPopup(this.popup);
+            this.popup = null;
+        }
+    },
+    
+    /**
+     * Method: onScreen
+     * 
+     * Returns:
+     * {Boolean} Whether or not the feature is currently visible on screen
+     *           (based on its 'lonlat' property)
+     */
+    onScreen:function() {
+        
+        var onScreen = false;
+        if ((this.layer != null) && (this.layer.map != null)) {
+            var screenBounds = this.layer.map.getExtent();
+            onScreen = screenBounds.containsLonLat(this.lonlat);
+        }    
+        return onScreen;
+    },
+    
+
+    /**
+     * Method: createMarker
+     * Based on the data associated with the Feature, create and return a marker object.
+     *
+     * Returns: 
+     * {<OpenLayers.Marker>} A Marker Object created from the 'lonlat' and 'icon' properties
+     *          set in this.data. If no 'lonlat' is set, returns null. If no
+     *          'icon' is set, OpenLayers.Marker() will load the default image.
+     *          
+     *          Note - this.marker is set to return value
+     * 
+     */
+    createMarker: function() {
+
+        if (this.lonlat != null) {
+            this.marker = new OpenLayers.Marker(this.lonlat, this.data.icon);
+        }
+        return this.marker;
+    },
+
+    /**
+     * Method: destroyMarker
+     * Destroys marker.
+     * If user overrides the createMarker() function, s/he should be able
+     *   to also specify an alternative function for destroying it
+     */
+    destroyMarker: function() {
+        this.marker.destroy();  
+    },
+
+    /**
+     * Method: createPopup
+     * Creates a popup object created from the 'lonlat', 'popupSize',
+     *     and 'popupContentHTML' properties set in this.data. It uses
+     *     this.marker.icon as default anchor. 
+     *  
+     *  If no 'lonlat' is set, returns null. 
+     *  If no this.marker has been created, no anchor is sent.
+     *
+     *  Note - the returned popup object is 'owned' by the feature, so you
+     *      cannot use the popup's destroy method to discard the popup.
+     *      Instead, you must use the feature's destroyPopup
+     * 
+     *  Note - this.popup is set to return value
+     * 
+     * Parameters: 
+     * closeBox - {Boolean} create popup with closebox or not
+     * 
+     * Returns:
+     * {<OpenLayers.Popup>} Returns the created popup, which is also set
+     *     as 'popup' property of this feature. Will be of whatever type
+     *     specified by this feature's 'popupClass' property, but must be
+     *     of type <OpenLayers.Popup>.
+     * 
+     */
+    createPopup: function(closeBox) {
+
+        if (this.lonlat != null) {
+            
+            var id = this.id + "_popup";
+            var anchor = (this.marker) ? this.marker.icon : null;
+
+            if (!this.popup) {
+                this.popup = new this.popupClass(id, 
+                                                 this.lonlat,
+                                                 this.data.popupSize,
+                                                 this.data.popupContentHTML,
+                                                 anchor, 
+                                                 closeBox); 
+            }    
+            if (this.data.overflow != null) {
+                this.popup.contentDiv.style.overflow = this.data.overflow;
+            }    
+            
+            this.popup.feature = this;
+        }        
+        return this.popup;
+    },
+
+    
+    /**
+     * Method: destroyPopup
+     * Destroys the popup created via createPopup.
+     *
+     * As with the marker, if user overrides the createPopup() function, s/he 
+     *   should also be able to override the destruction
+     */
+    destroyPopup: function() {
+        if (this.popup) {
+            this.popup.feature = null;
+            this.popup.destroy();
+            this.popup = null;
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Feature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Geometry.js	(revision 76)
@@ -0,0 +1,456 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+ 
+/**
+ * @requires OpenLayers/Format/WKT.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Geometry
+ * A Geometry is a description of a geographic object.  Create an instance of
+ * this class with the <OpenLayers.Geometry> constructor.  This is a base class,
+ * typical geometry types are described by subclasses of this class.
+ */
+OpenLayers.Geometry = OpenLayers.Class({
+
+    /**
+     * Property: id
+     * {String} A unique identifier for this geometry.
+     */
+    id: null,
+
+    /**
+     * Property: parent
+     * {<OpenLayers.Geometry>}This is set when a Geometry is added as component
+     * of another geometry
+     */
+    parent: null,
+
+    /**
+     * Property: bounds 
+     * {<OpenLayers.Bounds>} The bounds of this geometry
+     */
+    bounds: null,
+
+    /**
+     * Constructor: OpenLayers.Geometry
+     * Creates a geometry object.  
+     */
+    initialize: function() {
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME+ "_");
+    },
+    
+    /**
+     * Method: destroy
+     * Destroy this geometry.
+     */
+    destroy: function() {
+        this.id = null;
+        this.bounds = null;
+    },
+    
+    /**
+     * APIMethod: clone
+     * Create a clone of this geometry.  Does not set any non-standard
+     *     properties of the cloned geometry.
+     * 
+     * Returns:
+     * {<OpenLayers.Geometry>} An exact clone of this geometry.
+     */
+    clone: function() {
+        return new OpenLayers.Geometry();
+    },
+    
+    /**
+     * Set the bounds for this Geometry.
+     * 
+     * Parameters:
+     * object - {<OpenLayers.Bounds>} 
+     */
+    setBounds: function(bounds) {
+        if (bounds) {
+            this.bounds = bounds.clone();
+        }
+    },
+    
+    /**
+     * Method: clearBounds
+     * Nullify this components bounds and that of its parent as well.
+     */
+    clearBounds: function() {
+        this.bounds = null;
+        if (this.parent) {
+            this.parent.clearBounds();
+        }    
+    },
+    
+    /**
+     * Method: extendBounds
+     * Extend the existing bounds to include the new bounds. 
+     * If geometry's bounds is not yet set, then set a new Bounds.
+     * 
+     * Parameters:
+     * newBounds - {<OpenLayers.Bounds>} 
+     */
+    extendBounds: function(newBounds){
+        var bounds = this.getBounds();
+        if (!bounds) {
+            this.setBounds(newBounds);
+        } else {
+            this.bounds.extend(newBounds);
+        }
+    },
+    
+    /**
+     * APIMethod: getBounds
+     * Get the bounds for this Geometry. If bounds is not set, it 
+     * is calculated again, this makes queries faster.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getBounds: function() {
+        if (this.bounds == null) {
+            this.calculateBounds();
+        }
+        return this.bounds;
+    },
+    
+    /** 
+     * APIMethod: calculateBounds
+     * Recalculate the bounds for the geometry. 
+     */
+    calculateBounds: function() {
+        //
+        // This should be overridden by subclasses.
+        //
+    },
+    
+    /**
+     * APIMethod: distanceTo
+     * Calculate the closest distance between two geometries (on the x-y plane).
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.Geometry>} The target geometry.
+     * options - {Object} Optional properties for configuring the distance
+     *     calculation.
+     *
+     * Valid options depend on the specific geometry type.
+     * 
+     * Returns:
+     * {Number | Object} The distance between this geometry and the target.
+     *     If details is true, the return will be an object with distance,
+     *     x0, y0, x1, and x2 properties.  The x0 and y0 properties represent
+     *     the coordinates of the closest point on this geometry. The x1 and y1
+     *     properties represent the coordinates of the closest point on the
+     *     target geometry.
+     */
+    distanceTo: function(geometry, options) {
+    },
+    
+    /**
+     * APIMethod: getVertices
+     * Return a list of all points in this geometry.
+     *
+     * Parameters:
+     * nodes - {Boolean} For lines, only return vertices that are
+     *     endpoints.  If false, for lines, only vertices that are not
+     *     endpoints will be returned.  If not provided, all vertices will
+     *     be returned.
+     *
+     * Returns:
+     * {Array} A list of all vertices in the geometry.
+     */
+    getVertices: function(nodes) {
+    },
+
+    /**
+     * Method: atPoint
+     * Note - This is only an approximation based on the bounds of the 
+     * geometry.
+     * 
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>} 
+     * toleranceLon - {float} Optional tolerance in Geometric Coords
+     * toleranceLat - {float} Optional tolerance in Geographic Coords
+     * 
+     * Returns:
+     * {Boolean} Whether or not the geometry is at the specified location
+     */
+    atPoint: function(lonlat, toleranceLon, toleranceLat) {
+        var atPoint = false;
+        var bounds = this.getBounds();
+        if ((bounds != null) && (lonlat != null)) {
+
+            var dX = (toleranceLon != null) ? toleranceLon : 0;
+            var dY = (toleranceLat != null) ? toleranceLat : 0;
+    
+            var toleranceBounds = 
+                new OpenLayers.Bounds(this.bounds.left - dX,
+                                      this.bounds.bottom - dY,
+                                      this.bounds.right + dX,
+                                      this.bounds.top + dY);
+
+            atPoint = toleranceBounds.containsLonLat(lonlat);
+        }
+        return atPoint;
+    },
+    
+    /**
+     * Method: getLength
+     * Calculate the length of this geometry. This method is defined in
+     * subclasses.
+     * 
+     * Returns:
+     * {Float} The length of the collection by summing its parts
+     */
+    getLength: function() {
+        //to be overridden by geometries that actually have a length
+        //
+        return 0.0;
+    },
+
+    /**
+     * Method: getArea
+     * Calculate the area of this geometry. This method is defined in subclasses.
+     * 
+     * Returns:
+     * {Float} The area of the collection by summing its parts
+     */
+    getArea: function() {
+        //to be overridden by geometries that actually have an area
+        //
+        return 0.0;
+    },
+    
+    /**
+     * APIMethod: getCentroid
+     * Calculate the centroid of this geometry. This method is defined in subclasses.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Point>} The centroid of the collection
+     */
+    getCentroid: function() {
+        return null;
+    },
+
+    /**
+     * Method: toString
+     * Returns the Well-Known Text representation of a geometry
+     *
+     * Returns:
+     * {String} Well-Known Text
+     */
+    toString: function() {
+        return OpenLayers.Format.WKT.prototype.write(
+            new OpenLayers.Feature.Vector(this)
+        );
+    },
+
+    CLASS_NAME: "OpenLayers.Geometry"
+});
+
+/**
+ * Function: OpenLayers.Geometry.fromWKT
+ * Generate a geometry given a Well-Known Text string.
+ *
+ * Parameters:
+ * wkt - {String} A string representing the geometry in Well-Known Text.
+ *
+ * Returns:
+ * {<OpenLayers.Geometry>} A geometry of the appropriate class.
+ */
+OpenLayers.Geometry.fromWKT = function(wkt) {
+    var format = arguments.callee.format;
+    if(!format) {
+        format = new OpenLayers.Format.WKT();
+        arguments.callee.format = format;
+    }
+    var geom;
+    var result = format.read(wkt);
+    if(result instanceof OpenLayers.Feature.Vector) {
+        geom = result.geometry;
+    } else if(result instanceof Array) {
+        var len = result.length;
+        var components = new Array(len);
+        for(var i=0; i<len; ++i) {
+            components[i] = result[i].geometry;
+        }
+        geom = new OpenLayers.Geometry.Collection(components);
+    }
+    return geom;
+};
+    
+/**
+ * Method: OpenLayers.Geometry.segmentsIntersect
+ * Determine whether two line segments intersect.  Optionally calculates
+ *     and returns the intersection point.  This function is optimized for
+ *     cases where seg1.x2 >= seg2.x1 || seg2.x2 >= seg1.x1.  In those
+ *     obvious cases where there is no intersection, the function should
+ *     not be called.
+ *
+ * Parameters:
+ * seg1 - {Object} Object representing a segment with properties x1, y1, x2,
+ *     and y2.  The start point is represented by x1 and y1.  The end point
+ *     is represented by x2 and y2.  Start and end are ordered so that x1 < x2.
+ * seg2 - {Object} Object representing a segment with properties x1, y1, x2,
+ *     and y2.  The start point is represented by x1 and y1.  The end point
+ *     is represented by x2 and y2.  Start and end are ordered so that x1 < x2.
+ * options - {Object} Optional properties for calculating the intersection.
+ *
+ * Valid options:
+ * point - {Boolean} Return the intersection point.  If false, the actual
+ *     intersection point will not be calculated.  If true and the segments
+ *     intersect, the intersection point will be returned.  If true and
+ *     the segments do not intersect, false will be returned.  If true and
+ *     the segments are coincident, true will be returned.
+ * tolerance - {Number} If a non-null value is provided, if the segments are
+ *     within the tolerance distance, this will be considered an intersection.
+ *     In addition, if the point option is true and the calculated intersection
+ *     is within the tolerance distance of an end point, the endpoint will be
+ *     returned instead of the calculated intersection.  Further, if the
+ *     intersection is within the tolerance of endpoints on both segments, or
+ *     if two segment endpoints are within the tolerance distance of eachother
+ *     (but no intersection is otherwise calculated), an endpoint on the
+ *     first segment provided will be returned.
+ *
+ * Returns:
+ * {Boolean | <OpenLayers.Geometry.Point>}  The two segments intersect.
+ *     If the point argument is true, the return will be the intersection
+ *     point or false if none exists.  If point is true and the segments
+ *     are coincident, return will be true (and the instersection is equal
+ *     to the shorter segment).
+ */
+OpenLayers.Geometry.segmentsIntersect = function(seg1, seg2, options) {
+    var point = options && options.point;
+    var tolerance = options && options.tolerance;
+    var intersection = false;
+    var x11_21 = seg1.x1 - seg2.x1;
+    var y11_21 = seg1.y1 - seg2.y1;
+    var x12_11 = seg1.x2 - seg1.x1;
+    var y12_11 = seg1.y2 - seg1.y1;
+    var y22_21 = seg2.y2 - seg2.y1;
+    var x22_21 = seg2.x2 - seg2.x1;
+    var d = (y22_21 * x12_11) - (x22_21 * y12_11);
+    var n1 = (x22_21 * y11_21) - (y22_21 * x11_21);
+    var n2 = (x12_11 * y11_21) - (y12_11 * x11_21);
+    if(d == 0) {
+        // parallel
+        if(n1 == 0 && n2 == 0) {
+            // coincident
+            intersection = true;
+        }
+    } else {
+        var along1 = n1 / d;
+        var along2 = n2 / d;
+        if(along1 >= 0 && along1 <= 1 && along2 >=0 && along2 <= 1) {
+            // intersect
+            if(!point) {
+                intersection = true;
+            } else {
+                // calculate the intersection point
+                var x = seg1.x1 + (along1 * x12_11);
+                var y = seg1.y1 + (along1 * y12_11);
+                intersection = new OpenLayers.Geometry.Point(x, y);
+            }
+        }
+    }
+    if(tolerance) {
+        var dist;
+        if(intersection) {
+            if(point) {
+                var segs = [seg1, seg2];
+                var seg, x, y;
+                // check segment endpoints for proximity to intersection
+                // set intersection to first endpoint within the tolerance
+                outer: for(var i=0; i<2; ++i) {
+                    seg = segs[i];
+                    for(var j=1; j<3; ++j) {
+                        x = seg["x" + j];
+                        y = seg["y" + j];
+                        dist = Math.sqrt(
+                            Math.pow(x - intersection.x, 2) +
+                            Math.pow(y - intersection.y, 2)
+                        );
+                        if(dist < tolerance) {
+                            intersection.x = x;
+                            intersection.y = y;
+                            break outer;
+                        }
+                    }
+                }
+                
+            }
+        } else {
+            // no calculated intersection, but segments could be within
+            // the tolerance of one another
+            var segs = [seg1, seg2];
+            var source, target, x, y, p, result;
+            // check segment endpoints for proximity to intersection
+            // set intersection to first endpoint within the tolerance
+            outer: for(var i=0; i<2; ++i) {
+                source = segs[i];
+                target = segs[(i+1)%2];
+                for(var j=1; j<3; ++j) {
+                    p = {x: source["x"+j], y: source["y"+j]};
+                    result = OpenLayers.Geometry.distanceToSegment(p, target);
+                    if(result.distance < tolerance) {
+                        if(point) {
+                            intersection = new OpenLayers.Geometry.Point(p.x, p.y);
+                        } else {
+                            intersection = true;
+                        }
+                        break outer;
+                    }
+                }
+            }
+        }
+    }
+    return intersection;
+};
+
+/**
+ * Function: OpenLayers.Geometry.distanceToSegment
+ *
+ * Parameters:
+ * point - {Object} An object with x and y properties representing the
+ *     point coordinates.
+ * segment - {Object} An object with x1, y1, x2, and y2 properties
+ *     representing endpoint coordinates.
+ *
+ * Returns:
+ * {Object} An object with distance, x, and y properties.  The distance
+ *     will be the shortest distance between the input point and segment.
+ *     The x and y properties represent the coordinates along the segment
+ *     where the shortest distance meets the segment.
+ */
+OpenLayers.Geometry.distanceToSegment = function(point, segment) {
+    var x0 = point.x;
+    var y0 = point.y;
+    var x1 = segment.x1;
+    var y1 = segment.y1;
+    var x2 = segment.x2;
+    var y2 = segment.y2;
+    var dx = x2 - x1;
+    var dy = y2 - y1;
+    var along = ((dx * (x0 - x1)) + (dy * (y0 - y1))) /
+                (Math.pow(dx, 2) + Math.pow(dy, 2));
+    var x, y;
+    if(along <= 0.0) {
+        x = x1;
+        y = y1;
+    } else if(along >= 1.0) {
+        x = x2;
+        y = y2;
+    } else {
+        x = x1 + along * dx;
+        y = y1 + along * dy;
+    }
+    return {
+        distance: Math.sqrt(Math.pow(x - x0, 2) + Math.pow(y - y0, 2)),
+        x: x, y: y
+    };
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Style.js	(revision 76)
@@ -0,0 +1,443 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Util.js
+ * @requires OpenLayers/Feature/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Style
+ * This class represents a UserStyle obtained
+ *     from a SLD, containing styling rules.
+ */
+OpenLayers.Style = OpenLayers.Class({
+
+    /**
+     * Property: id
+     * {String} A unique id for this session.
+     */
+    id: null,
+    
+    /**
+     * APIProperty: name
+     * {String}
+     */
+    name: null,
+    
+    /**
+     * Property: title
+     * {String} Title of this style (set if included in SLD)
+     */
+    title: null,
+    
+    /**
+     * Property: description
+     * {String} Description of this style (set if abstract is included in SLD)
+     */
+    description: null,
+
+    /**
+     * APIProperty: layerName
+     * {<String>} name of the layer that this style belongs to, usually
+     * according to the NamedLayer attribute of an SLD document.
+     */
+    layerName: null,
+    
+    /**
+     * APIProperty: isDefault
+     * {Boolean}
+     */
+    isDefault: false,
+     
+    /** 
+     * Property: rules 
+     * {Array(<OpenLayers.Rule>)}
+     */
+    rules: null,
+    
+    /**
+     * Property: context
+     * {Object} An optional object with properties that symbolizers' property
+     * values should be evaluated against. If no context is specified,
+     * feature.attributes will be used
+     */
+    context: null,
+
+    /**
+     * Property: defaultStyle
+     * {Object} hash of style properties to use as default for merging
+     * rule-based style symbolizers onto. If no rules are defined,
+     * createSymbolizer will return this style. If <defaultsPerSymbolizer> is set to
+     * true, the defaultStyle will only be taken into account if there are
+     * rules defined.
+     */
+    defaultStyle: null,
+    
+    /**
+     * Property: defaultsPerSymbolizer
+     * {Boolean} If set to true, the <defaultStyle> will extend the symbolizer
+     * of every rule. Properties of the <defaultStyle> will also be used to set
+     * missing symbolizer properties if the symbolizer has stroke, fill or
+     * graphic set to true. Default is false.
+     */
+    defaultsPerSymbolizer: false,
+    
+    /**
+     * Property: propertyStyles
+     * {Hash of Boolean} cache of style properties that need to be parsed for
+     * propertyNames. Property names are keys, values won't be used.
+     */
+    propertyStyles: null,
+    
+
+    /** 
+     * Constructor: OpenLayers.Style
+     * Creates a UserStyle.
+     *
+     * Parameters:
+     * style        - {Object} Optional hash of style properties that will be
+     *                used as default style for this style object. This style
+     *                applies if no rules are specified. Symbolizers defined in
+     *                rules will extend this default style.
+     * options - {Object} An optional object with properties to set on the
+     *     style.
+     *
+     * Valid options:
+     * rules - {Array(<OpenLayers.Rule>)} List of rules to be added to the
+     *     style.
+     * 
+     * Return:
+     * {<OpenLayers.Style>}
+     */
+    initialize: function(style, options) {
+
+        OpenLayers.Util.extend(this, options);
+        this.rules = [];
+        if(options && options.rules) {
+            this.addRules(options.rules);
+        }
+
+        // use the default style from OpenLayers.Feature.Vector if no style
+        // was given in the constructor
+        this.setDefaultStyle(style ||
+                             OpenLayers.Feature.Vector.style["default"]);
+
+        this.id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
+    },
+
+    /** 
+     * APIMethod: destroy
+     * nullify references to prevent circular references and memory leaks
+     */
+    destroy: function() {
+        for (var i=0, len=this.rules.length; i<len; i++) {
+            this.rules[i].destroy();
+            this.rules[i] = null;
+        }
+        this.rules = null;
+        this.defaultStyle = null;
+    },
+    
+    /**
+     * Method: createSymbolizer
+     * creates a style by applying all feature-dependent rules to the base
+     * style.
+     * 
+     * Parameters:
+     * feature - {<OpenLayers.Feature>} feature to evaluate rules for
+     * 
+     * Returns:
+     * {Object} symbolizer hash
+     */
+    createSymbolizer: function(feature) {
+        var style = this.defaultsPerSymbolizer ? {} : this.createLiterals(
+            OpenLayers.Util.extend({}, this.defaultStyle), feature);
+        
+        var rules = this.rules;
+
+        var rule, context;
+        var elseRules = [];
+        var appliedRules = false;
+        for(var i=0, len=rules.length; i<len; i++) {
+            rule = rules[i];
+            // does the rule apply?
+            var applies = rule.evaluate(feature);
+            
+            if(applies) {
+                if(rule instanceof OpenLayers.Rule && rule.elseFilter) {
+                    elseRules.push(rule);
+                } else {
+                    appliedRules = true;
+                    this.applySymbolizer(rule, style, feature);
+                }
+            }
+        }
+        
+        // if no other rules apply, apply the rules with else filters
+        if(appliedRules == false && elseRules.length > 0) {
+            appliedRules = true;
+            for(var i=0, len=elseRules.length; i<len; i++) {
+                this.applySymbolizer(elseRules[i], style, feature);
+            }
+        }
+
+        // don't display if there were rules but none applied
+        if(rules.length > 0 && appliedRules == false) {
+            style.display = "none";
+        }
+        
+        return style;
+    },
+    
+    /**
+     * Method: applySymbolizer
+     *
+     * Parameters:
+     * rule - {OpenLayers.Rule}
+     * style - {Object}
+     * feature - {<OpenLayer.Feature.Vector>}
+     *
+     * Returns:
+     * {Object} A style with new symbolizer applied.
+     */
+    applySymbolizer: function(rule, style, feature) {
+        var symbolizerPrefix = feature.geometry ?
+                this.getSymbolizerPrefix(feature.geometry) :
+                OpenLayers.Style.SYMBOLIZER_PREFIXES[0];
+
+        var symbolizer = rule.symbolizer[symbolizerPrefix] || rule.symbolizer;
+        
+        if(this.defaultsPerSymbolizer === true) {
+            var defaults = this.defaultStyle;
+            OpenLayers.Util.applyDefaults(symbolizer, {
+                pointRadius: defaults.pointRadius
+            });
+            if(symbolizer.stroke === true || symbolizer.graphic === true) {
+                OpenLayers.Util.applyDefaults(symbolizer, {
+                    strokeWidth: defaults.strokeWidth,
+                    strokeColor: defaults.strokeColor,
+                    strokeOpacity: defaults.strokeOpacity,
+                    strokeDashstyle: defaults.strokeDashstyle,
+                    strokeLinecap: defaults.strokeLinecap
+                });
+            }
+            if(symbolizer.fill === true || symbolizer.graphic === true) {
+                OpenLayers.Util.applyDefaults(symbolizer, {
+                    fillColor: defaults.fillColor,
+                    fillOpacity: defaults.fillOpacity
+                });
+            }
+            if(symbolizer.graphic === true) {
+                OpenLayers.Util.applyDefaults(symbolizer, {
+                    pointRadius: this.defaultStyle.pointRadius,
+                    externalGraphic: this.defaultStyle.externalGraphic,
+                    graphicName: this.defaultStyle.graphicName,
+                    graphicOpacity: this.defaultStyle.graphicOpacity,
+                    graphicWidth: this.defaultStyle.graphicWidth,
+                    graphicHeight: this.defaultStyle.graphicHeight,
+                    graphicXOffset: this.defaultStyle.graphicXOffset,
+                    graphicYOffset: this.defaultStyle.graphicYOffset
+                });
+            }
+        }
+
+        // merge the style with the current style
+        return this.createLiterals(
+                OpenLayers.Util.extend(style, symbolizer), feature);
+    },
+    
+    /**
+     * Method: createLiterals
+     * creates literals for all style properties that have an entry in
+     * <this.propertyStyles>.
+     * 
+     * Parameters:
+     * style   - {Object} style to create literals for. Will be modified
+     *           inline.
+     * feature - {Object}
+     * 
+     * Returns:
+     * {Object} the modified style
+     */
+    createLiterals: function(style, feature) {
+        var context = OpenLayers.Util.extend({}, feature.attributes || feature.data);
+        OpenLayers.Util.extend(context, this.context);
+        
+        for (var i in this.propertyStyles) {
+            style[i] = OpenLayers.Style.createLiteral(style[i], context, feature, i);
+        }
+        return style;
+    },
+    
+    /**
+     * Method: findPropertyStyles
+     * Looks into all rules for this style and the defaultStyle to collect
+     * all the style hash property names containing ${...} strings that have
+     * to be replaced using the createLiteral method before returning them.
+     * 
+     * Returns:
+     * {Object} hash of property names that need createLiteral parsing. The
+     * name of the property is the key, and the value is true;
+     */
+    findPropertyStyles: function() {
+        var propertyStyles = {};
+
+        // check the default style
+        var style = this.defaultStyle;
+        this.addPropertyStyles(propertyStyles, style);
+
+        // walk through all rules to check for properties in their symbolizer
+        var rules = this.rules;
+        var symbolizer, value;
+        for (var i=0, len=rules.length; i<len; i++) {
+            symbolizer = rules[i].symbolizer;
+            for (var key in symbolizer) {
+                value = symbolizer[key];
+                if (typeof value == "object") {
+                    // symbolizer key is "Point", "Line" or "Polygon"
+                    this.addPropertyStyles(propertyStyles, value);
+                } else {
+                    // symbolizer is a hash of style properties
+                    this.addPropertyStyles(propertyStyles, symbolizer);
+                    break;
+                }
+            }
+        }
+        return propertyStyles;
+    },
+    
+    /**
+     * Method: addPropertyStyles
+     * 
+     * Parameters:
+     * propertyStyles - {Object} hash to add new property styles to. Will be
+     *                  modified inline
+     * symbolizer     - {Object} search this symbolizer for property styles
+     * 
+     * Returns:
+     * {Object} propertyStyles hash
+     */
+    addPropertyStyles: function(propertyStyles, symbolizer) {
+        var property;
+        for (var key in symbolizer) {
+            property = symbolizer[key];
+            if (typeof property == "string" &&
+                    property.match(/\$\{\w+\}/)) {
+                propertyStyles[key] = true;
+            }
+        }
+        return propertyStyles;
+    },
+    
+    /**
+     * APIMethod: addRules
+     * Adds rules to this style.
+     * 
+     * Parameters:
+     * rules - {Array(<OpenLayers.Rule>)}
+     */
+    addRules: function(rules) {
+        Array.prototype.push.apply(this.rules, rules);
+        this.propertyStyles = this.findPropertyStyles();
+    },
+    
+    /**
+     * APIMethod: setDefaultStyle
+     * Sets the default style for this style object.
+     * 
+     * Parameters:
+     * style - {Object} Hash of style properties
+     */
+    setDefaultStyle: function(style) {
+        this.defaultStyle = style; 
+        this.propertyStyles = this.findPropertyStyles();
+    },
+        
+    /**
+     * Method: getSymbolizerPrefix
+     * Returns the correct symbolizer prefix according to the
+     * geometry type of the passed geometry
+     * 
+     * Parameters:
+     * geometry {<OpenLayers.Geometry>}
+     * 
+     * Returns:
+     * {String} key of the according symbolizer
+     */
+    getSymbolizerPrefix: function(geometry) {
+        var prefixes = OpenLayers.Style.SYMBOLIZER_PREFIXES;
+        for (var i=0, len=prefixes.length; i<len; i++) {
+            if (geometry.CLASS_NAME.indexOf(prefixes[i]) != -1) {
+                return prefixes[i];
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: clone
+     * Clones this style.
+     * 
+     * Returns:
+     * {<OpenLayers.Style>} Clone of this style.
+     */
+    clone: function() {
+        var options = OpenLayers.Util.extend({}, this);
+        // clone rules
+        if(this.rules) {
+            options.rules = [];
+            for(var i=0, len=this.rules.length; i<len; ++i) {
+                options.rules.push(this.rules[i].clone());
+            }
+        }
+        // clone context
+        options.context = this.context && OpenLayers.Util.extend({}, this.context);
+        //clone default style
+        var defaultStyle = OpenLayers.Util.extend({}, this.defaultStyle);
+        return new OpenLayers.Style(defaultStyle, options);
+    },
+    
+    CLASS_NAME: "OpenLayers.Style"
+});
+
+
+/**
+ * Function: createLiteral
+ * converts a style value holding a combination of PropertyName and Literal
+ * into a Literal, taking the property values from the passed features.
+ * 
+ * Parameters:
+ * value - {String} value to parse. If this string contains a construct like
+ *         "foo ${bar}", then "foo " will be taken as literal, and "${bar}"
+ *         will be replaced by the value of the "bar" attribute of the passed
+ *         feature.
+ * context - {Object} context to take attribute values from
+ * feature - {<OpenLayers.Feature.Vector>} optional feature to pass to
+ *           <OpenLayers.String.format> for evaluating functions in the
+ *           context.
+ * property - {String} optional, name of the property for which the literal is
+ *            being created for evaluating functions in the context.
+ * 
+ * Returns:
+ * {String} the parsed value. In the example of the value parameter above, the
+ * result would be "foo valueOfBar", assuming that the passed feature has an
+ * attribute named "bar" with the value "valueOfBar".
+ */
+OpenLayers.Style.createLiteral = function(value, context, feature, property) {
+    if (typeof value == "string" && value.indexOf("${") != -1) {
+        value = OpenLayers.String.format(value, context, [feature, property]);
+        value = (isNaN(value) || !value) ? value : parseFloat(value);
+    }
+    return value;
+};
+    
+/**
+ * Constant: OpenLayers.Style.SYMBOLIZER_PREFIXES
+ * {Array} prefixes of the sld symbolizers. These are the
+ * same as the main geometry types
+ */
+OpenLayers.Style.SYMBOLIZER_PREFIXES = ['Point', 'Line', 'Polygon', 'Text',
+    'Raster'];
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Protocol.js	(revision 76)
@@ -0,0 +1,272 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Protocol
+ * Abstract vector layer protocol class.  Not to be instantiated directly.  Use
+ *     one of the protocol subclasses instead.
+ */
+OpenLayers.Protocol = OpenLayers.Class({
+    
+    /**
+     * Property: format
+     * {<OpenLayers.Format>} The format used by this protocol.
+     */
+    format: null,
+    
+    /**
+     * Property: options
+     * {Object} Any options sent to the constructor.
+     */
+    options: null,
+
+    /**
+     * Property: autoDestroy
+     * {Boolean} The creator of the protocol can set autoDestroy to false
+     *      to fully control when the protocol is destroyed. Defaults to
+     *      true.
+     */
+    autoDestroy: true,
+   
+    /**
+     * Property: defaultFilter
+     * {OpenLayers.Filter} Optional default filter to read requests
+     */
+    defaultFilter: null,
+    
+    /**
+     * Constructor: OpenLayers.Protocol
+     * Abstract class for vector protocols.  Create instances of a subclass.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        options = options || {};
+        OpenLayers.Util.extend(this, options);
+        this.options = options;
+    },
+
+    /**
+     * Method: mergeWithDefaultFilter
+     * Merge filter passed to the read method with the default one
+     *
+     * Parameters:
+     * filter - {OpenLayers.Filter}
+     */
+    mergeWithDefaultFilter: function(filter) {
+        var merged;
+        if (filter && this.defaultFilter) {
+            merged = new OpenLayers.Filter.Logical({
+                type: OpenLayers.Filter.Logical.AND,
+                filters: [this.defaultFilter, filter]
+            });
+        } else {
+            merged = filter || this.defaultFilter || undefined;
+        }
+        return merged;
+    },
+
+    /**
+     * APIMethod: destroy
+     * Clean up the protocol.
+     */
+    destroy: function() {
+        this.options = null;
+        this.format = null;
+    },
+    
+    /**
+     * APIMethod: read
+     * Construct a request for reading new features.
+     *
+     * Parameters:
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     * object, the same object will be passed to the callback function passed
+     * if one exists in the options object.
+     */
+    read: function(options) {
+        options = options || {};
+        options.filter = this.mergeWithDefaultFilter(options.filter);
+    },
+    
+    
+    /**
+     * APIMethod: create
+     * Construct a request for writing newly created features.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *            {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     * object, the same object will be passed to the callback function passed
+     * if one exists in the options object.
+     */
+    create: function() {
+    },
+    
+    /**
+     * APIMethod: update
+     * Construct a request updating modified features.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})} or
+     *            {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     * object, the same object will be passed to the callback function passed
+     * if one exists in the options object.
+     */
+    update: function() {
+    },
+    
+    /**
+     * APIMethod: delete
+     * Construct a request deleting a removed feature.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>}
+     * options - {Object} Optional object for configuring the request.
+     *
+     * Returns:
+     * {<OpenLayers.Protocol.Response>} An <OpenLayers.Protocol.Response>
+     * object, the same object will be passed to the callback function passed
+     * if one exists in the options object.
+     */
+    "delete": function() {
+    },
+
+    /**
+     * APIMethod: commit
+     * Go over the features and for each take action
+     * based on the feature state. Possible actions are create,
+     * update and delete.
+     *
+     * Parameters:
+     * features - {Array({<OpenLayers.Feature.Vector>})}
+     * options - {Object} Object whose possible keys are "create", "update",
+     *      "delete", "callback" and "scope", the values referenced by the
+     *      first three are objects as passed to the "create", "update", and
+     *      "delete" methods, the value referenced by the "callback" key is
+     *      a function which is called when the commit operation is complete
+     *      using the scope referenced by the "scope" key.
+     *
+     * Returns:
+     * {Array({<OpenLayers.Protocol.Response>})} An array of
+     * <OpenLayers.Protocol.Response> objects.
+     */
+    commit: function() {
+    },
+
+    /**
+     * Method: abort
+     * Abort an ongoing request.
+     *
+     * Parameters:
+     * response - {<OpenLayers.Protocol.Response>}
+     */
+    abort: function(response) {
+    },
+   
+    /**
+     * Method: createCallback
+     * Returns a function that applies the given public method with resp and
+     *     options arguments.
+     *
+     * Parameters:
+     * method - {Function} The method to be applied by the callback.
+     * response - {<OpenLayers.Protocol.Response>} The protocol response object.
+     * options - {Object} Options sent to the protocol method
+     */
+    createCallback: function(method, response, options) {
+        return OpenLayers.Function.bind(function() {
+            method.apply(this, [response, options]);
+        }, this);
+    },
+   
+    CLASS_NAME: "OpenLayers.Protocol" 
+});
+
+/**
+ * Class: OpenLayers.Protocol.Response
+ * Protocols return Response objects to their users.
+ */
+OpenLayers.Protocol.Response = OpenLayers.Class({
+    /**
+     * Property: code
+     * {Number} - OpenLayers.Protocol.Response.SUCCESS or
+     *            OpenLayers.Protocol.Response.FAILURE
+     */
+    code: null,
+
+    /**
+     * Property: requestType
+     * {String} The type of request this response corresponds to. Either
+     *      "create", "read", "update" or "delete".
+     */
+    requestType: null,
+
+    /**
+     * Property: last
+     * {Boolean} - true if this is the last response expected in a commit,
+     * false otherwise, defaults to true.
+     */
+    last: true,
+
+    /**
+     * Property: features
+     * {Array({<OpenLayers.Feature.Vector>})} or {<OpenLayers.Feature.Vector>}
+     * The features returned in the response by the server.
+     */
+    features: null,
+
+    /**
+     * Property: reqFeatures
+     * {Array({<OpenLayers.Feature.Vector>})} or {<OpenLayers.Feature.Vector>}
+     * The features provided by the user and placed in the request by the
+     *      protocol.
+     */
+    reqFeatures: null,
+
+    /**
+     * Property: priv
+     */
+    priv: null,
+
+    /**
+     * Constructor: OpenLayers.Protocol.Response
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Util.extend(this, options);
+    },
+
+    /**
+     * Method: success
+     *
+     * Returns:
+     * {Boolean} - true on success, false otherwise
+     */
+    success: function() {
+        return this.code > 0;
+    },
+
+    CLASS_NAME: "OpenLayers.Protocol.Response"
+});
+
+OpenLayers.Protocol.Response.SUCCESS = 1;
+OpenLayers.Protocol.Response.FAILURE = 0;
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Markers.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Markers.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Markers.js	(revision 76)
@@ -0,0 +1,187 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Markers
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer> 
+ */
+OpenLayers.Layer.Markers = OpenLayers.Class(OpenLayers.Layer, {
+    
+    /** 
+     * APIProperty: isBaseLayer 
+     * {Boolean} Markers layer is never a base layer.  
+     */
+    isBaseLayer: false,
+    
+    /** 
+     * APIProperty: markers 
+     * {Array(<OpenLayers.Marker>)} internal marker list 
+     */
+    markers: null,
+
+
+    /** 
+     * Property: drawn 
+     * {Boolean} internal state of drawing. This is a workaround for the fact
+     * that the map does not call moveTo with a zoomChanged when the map is
+     * first starting up. This lets us catch the case where we have *never*
+     * drawn the layer, and draw it even if the zoom hasn't changed.
+     */
+    drawn: false,
+    
+    /**
+     * Constructor: OpenLayers.Layer.Markers 
+     * Create a Markers layer.
+     *
+     * Parameters:
+     * name - {String} 
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.prototype.initialize.apply(this, arguments);
+        this.markers = [];
+    },
+    
+    /**
+     * APIMethod: destroy 
+     */
+    destroy: function() {
+        this.clearMarkers();
+        this.markers = null;
+        OpenLayers.Layer.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: setOpacity
+     * Sets the opacity for all the markers.
+     * 
+     * Parameter:
+     * opacity - {Float}
+     */
+    setOpacity: function(opacity) {
+        if (opacity != this.opacity) {
+            this.opacity = opacity;
+            for (var i=0, len=this.markers.length; i<len; i++) {
+                this.markers[i].setOpacity(this.opacity);
+            }
+        }
+    },
+
+    /** 
+     * Method: moveTo
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * zoomChanged - {Boolean} 
+     * dragging - {Boolean} 
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        OpenLayers.Layer.prototype.moveTo.apply(this, arguments);
+
+        if (zoomChanged || !this.drawn) {
+            for(var i=0, len=this.markers.length; i<len; i++) {
+                this.drawMarker(this.markers[i]);
+            }
+            this.drawn = true;
+        }
+    },
+
+    /**
+     * APIMethod: addMarker
+     *
+     * Parameters:
+     * marker - {<OpenLayers.Marker>} 
+     */
+    addMarker: function(marker) {
+        this.markers.push(marker);
+
+        if (this.opacity != null) {
+            marker.setOpacity(this.opacity);
+        }
+
+        if (this.map && this.map.getExtent()) {
+            marker.map = this.map;
+            this.drawMarker(marker);
+        }
+    },
+
+    /**
+     * APIMethod: removeMarker
+     *
+     * Parameters:
+     * marker - {<OpenLayers.Marker>} 
+     */
+    removeMarker: function(marker) {
+        if (this.markers && this.markers.length) {
+            OpenLayers.Util.removeItem(this.markers, marker);
+            marker.erase();
+        }
+    },
+
+    /**
+     * Method: clearMarkers
+     * This method removes all markers from a layer. The markers are not
+     * destroyed by this function, but are removed from the list of markers.
+     */
+    clearMarkers: function() {
+        if (this.markers != null) {
+            while(this.markers.length > 0) {
+                this.removeMarker(this.markers[0]);
+            }
+        }
+    },
+
+    /** 
+     * Method: drawMarker
+     * Calculate the pixel location for the marker, create it, and 
+     *    add it to the layer's div
+     *
+     * Parameters:
+     * marker - {<OpenLayers.Marker>} 
+     */
+    drawMarker: function(marker) {
+        var px = this.map.getLayerPxFromLonLat(marker.lonlat);
+        if (px == null) {
+            marker.display(false);
+        } else {
+            if (!marker.isDrawn()) {
+                var markerImg = marker.draw(px);
+                this.div.appendChild(markerImg);
+            } else if(marker.icon) {
+                marker.icon.moveTo(px);
+            }
+        }
+    },
+    
+    /** 
+     * APIMethod: getDataExtent
+     * Calculates the max extent which includes all of the markers.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getDataExtent: function () {
+        var maxExtent = null;
+        
+        if ( this.markers && (this.markers.length > 0)) {
+            var maxExtent = new OpenLayers.Bounds();
+            for(var i=0, len=this.markers.length; i<len; i++) {
+                var marker = this.markers[i];
+                maxExtent.extend(marker.lonlat);
+            }
+        }
+
+        return maxExtent;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Markers"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS.js	(revision 76)
@@ -0,0 +1,268 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WMS
+ * Instances of OpenLayers.Layer.WMS are used to display data from OGC Web
+ *     Mapping Services. Create a new WMS layer with the <OpenLayers.Layer.WMS>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.WMS = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * Constant: DEFAULT_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs 
+     */
+    DEFAULT_PARAMS: { service: "WMS",
+                      version: "1.1.1",
+                      request: "GetMap",
+                      styles: "",
+                      exceptions: "application/vnd.ogc.se_inimage",
+                      format: "image/jpeg"
+                     },
+    
+    /**
+     * Property: reproject
+     * *Deprecated*. See http://trac.openlayers.org/wiki/SphericalMercator
+     * for information on the replacement for this functionality. 
+     * {Boolean} Try to reproject this layer if its coordinate reference system
+     *           is different than that of the base layer.  Default is true.  
+     *           Set this in the layer options.  Should be set to false in 
+     *           most cases.
+     */
+    reproject: false,
+ 
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} Default is true for WMS layer
+     */
+    isBaseLayer: true,
+    
+    /**
+     * APIProperty: encodeBBOX
+     * {Boolean} Should the BBOX commas be encoded? The WMS spec says 'no', 
+     * but some services want it that way. Default false.
+     */
+    encodeBBOX: false,
+    
+    /** 
+     * APIProperty: noMagic 
+     * {Boolean} If true, the image format will not be automagicaly switched 
+     *     from image/jpeg to image/png or image/gif when using 
+     *     TRANSPARENT=TRUE. Also isBaseLayer will not changed by the  
+     *     constructor. Default false. 
+     */ 
+    noMagic: false,
+    
+    /**
+     * Property: yx
+     * {Object} Keys in this object are EPSG codes for which the axis order
+     *     is to be reversed (yx instead of xy, LatLon instead of LonLat), with
+     *     true as value. This is only relevant for WMS versions >= 1.3.0.
+     */
+    yx: {'EPSG:4326': true},
+    
+    /**
+     * Constructor: OpenLayers.Layer.WMS
+     * Create a new WMS layer object
+     *
+     * Example:
+     * (code)
+     * var wms = new OpenLayers.Layer.WMS("NASA Global Mosaic",
+     *                                    "http://wms.jpl.nasa.gov/wms.cgi", 
+     *                                    {layers: "modis,global_mosaic"});
+     * (end)
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * url - {String} Base url for the WMS
+     *                (e.g. http://wms.jpl.nasa.gov/wms.cgi)
+     * params - {Object} An object with key/value pairs representing the
+     *                   GetMap query string parameters and parameter values.
+     * options - {Ojbect} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = [];
+        //uppercase params
+        params = OpenLayers.Util.upperCaseObject(params);
+        if (parseFloat(params.VERSION) >= 1.3 && !params.EXCEPTIONS) {
+            params.EXCEPTIONS = "INIMAGE";
+        } 
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+        OpenLayers.Util.applyDefaults(
+                       this.params, 
+                       OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS)
+                       );
+
+
+        //layer is transparent        
+        if (!this.noMagic && this.params.TRANSPARENT && 
+            this.params.TRANSPARENT.toString().toLowerCase() == "true") {
+            
+            // unless explicitly set in options, make layer an overlay
+            if ( (options == null) || (!options.isBaseLayer) ) {
+                this.isBaseLayer = false;
+            } 
+            
+            // jpegs can never be transparent, so intelligently switch the 
+            //  format, depending on teh browser's capabilities
+            if (this.params.FORMAT == "image/jpeg") {
+                this.params.FORMAT = OpenLayers.Util.alphaHack() ? "image/gif"
+                                                                 : "image/png";
+            }
+        }
+
+    },    
+
+    /**
+     * Method: destroy
+     * Destroy this layer
+     */
+    destroy: function() {
+        // for now, nothing special to do here. 
+        OpenLayers.Layer.Grid.prototype.destroy.apply(this, arguments);  
+    },
+
+    
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.WMS>} An exact clone of this layer
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.WMS(this.name,
+                                           this.url,
+                                           this.params,
+                                           this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },    
+    
+    /**
+     * APIMethod: reverseAxisOrder
+     * Returns true if the axis order is reversed for the WMS version and
+     * projection of the layer.
+     * 
+     * Returns:
+     * {Boolean} true if the axis order is reversed, false otherwise.
+     */
+    reverseAxisOrder: function() {
+        return (parseFloat(this.params.VERSION) >= 1.3 && 
+            !!this.yx[this.map.getProjectionObject().getCode()]);
+    },
+    
+    /**
+     * Method: getURL
+     * Return a GetMap query string for this layer
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox for the
+     *                                request.
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the
+     *          passed-in bounds and appropriate tile size specified as 
+     *          parameters.
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        
+        var imageSize = this.getImageSize();
+        var newParams = {};
+        // WMS 1.3 introduced axis order
+        var reverseAxisOrder = this.reverseAxisOrder();
+        newParams.BBOX = this.encodeBBOX ?
+            bounds.toBBOX(null, reverseAxisOrder) :
+            bounds.toArray(reverseAxisOrder);
+        newParams.WIDTH = imageSize.w;
+        newParams.HEIGHT = imageSize.h;
+        var requestString = this.getFullRequestString(newParams);
+        return requestString;
+    },
+
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+
+    /**
+     * APIMethod: mergeNewParams
+     * Catch changeParams and uppercase the new params to be merged in
+     *     before calling changeParams on the super class.
+     * 
+     *     Once params have been changed, the tiles will be reloaded with
+     *     the new parameters.
+     * 
+     * Parameters:
+     * newParams - {Object} Hashtable of new params to use
+     */
+    mergeNewParams:function(newParams) {
+        var upperParams = OpenLayers.Util.upperCaseObject(newParams);
+        var newArguments = [upperParams];
+        return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(this, 
+                                                             newArguments);
+    },
+
+    /** 
+     * APIMethod: getFullRequestString
+     * Combine the layer's url with its params and these newParams. 
+     *   
+     *     Add the SRS parameter from projection -- this is probably
+     *     more eloquently done via a setProjection() method, but this 
+     *     works for now and always.
+     *
+     * Parameters:
+     * newParams - {Object}
+     * altUrl - {String} Use this as the url instead of the layer's url
+     * 
+     * Returns:
+     * {String} 
+     */
+    getFullRequestString:function(newParams, altUrl) {
+        var projectionCode = this.map.getProjection();
+        var value = (projectionCode == "none") ? null : projectionCode
+        if (parseFloat(this.params.VERSION) >= 1.3) {
+            this.params.CRS = value;
+        } else {
+            this.params.SRS = value;
+        }
+
+        return OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(
+                                                    this, arguments);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.WMS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/VirtualEarth.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/VirtualEarth.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/VirtualEarth.js	(revision 76)
@@ -0,0 +1,368 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/SphericalMercator.js
+ * @requires OpenLayers/Layer/EventPane.js
+ * @requires OpenLayers/Layer/FixedZoomLevels.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.VirtualEarth
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.EventPane>
+ *  - <OpenLayers.Layer.FixedZoomLevels>
+ */
+OpenLayers.Layer.VirtualEarth = OpenLayers.Class(
+    OpenLayers.Layer.EventPane,
+    OpenLayers.Layer.FixedZoomLevels, {
+    
+    /** 
+     * Constant: MIN_ZOOM_LEVEL
+     * {Integer} 1 
+     */
+    MIN_ZOOM_LEVEL: 1,
+    
+    /** 
+     * Constant: MAX_ZOOM_LEVEL
+     * {Integer} 19
+     */
+    MAX_ZOOM_LEVEL: 19,
+
+    /** 
+     * Constant: RESOLUTIONS
+     * {Array(Float)} Hardcode these resolutions so that they are more closely
+     *                tied with the standard wms projection
+     */
+    RESOLUTIONS: [
+        1.40625, 
+        0.703125, 
+        0.3515625, 
+        0.17578125, 
+        0.087890625, 
+        0.0439453125,
+        0.02197265625, 
+        0.010986328125, 
+        0.0054931640625, 
+        0.00274658203125,
+        0.001373291015625, 
+        0.0006866455078125, 
+        0.00034332275390625, 
+        0.000171661376953125, 
+        0.0000858306884765625, 
+        0.00004291534423828125,
+        0.00002145767211914062, 
+        0.00001072883605957031,
+        0.00000536441802978515
+    ],
+
+    /**
+     * APIProperty: type
+     * {VEMapType}
+     */
+    type: null,
+
+    /**
+     * APIProperty: wrapDateLine
+     * {Boolean} Allow user to pan forever east/west.  Default is true.  
+     *     Setting this to false only restricts panning if 
+     *     <sphericalMercator> is true. 
+     */
+    wrapDateLine: true,
+
+    /**
+     * APIProperty: sphericalMercator
+     * {Boolean} Should the map act as a mercator-projected map? This will
+     *     cause all interactions with the map to be in the actual map
+     *     projection, which allows support for vector drawing, overlaying
+     *     other maps, etc. 
+     */
+    sphericalMercator: false,
+    
+    /**
+     * APIProperty: animationEnabled
+     * {Boolean} If set to true, the transition between zoom levels will be
+     *     animated. Set to false to match the zooming experience of other
+     *     layer types. Default is true.
+     */
+    animationEnabled: true, 
+
+    /** 
+     * Constructor: OpenLayers.Layer.VirtualEarth
+     * 
+     * Parameters:
+     * name - {String}
+     * options - {Object}
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.EventPane.prototype.initialize.apply(this, arguments);
+        OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this, 
+                                                                    arguments);
+        if(this.sphericalMercator) {
+            OpenLayers.Util.extend(this, OpenLayers.Layer.SphericalMercator);
+            this.initMercatorParameters();
+        }
+    },
+    
+    /**
+     * Method: loadMapObject
+     */
+    loadMapObject:function() {
+
+        // create div and set to same size as map
+        var veDiv = OpenLayers.Util.createDiv(this.name);
+        var sz = this.map.getSize();
+        veDiv.style.width = sz.w + "px";
+        veDiv.style.height = sz.h + "px";
+        this.div.appendChild(veDiv);
+
+        try { // crash prevention
+            this.mapObject = new VEMap(this.name);
+        } catch (e) { }
+
+        if (this.mapObject != null) {
+            try { // this is to catch a Mozilla bug without falling apart
+
+                // The fourth argument is whether the map is 'fixed' -- not 
+                // draggable. See: 
+                // http://blogs.msdn.com/virtualearth/archive/2007/09/28/locking-a-virtual-earth-map.aspx
+                //
+                this.mapObject.LoadMap(null, null, this.type, true);
+                this.mapObject.AttachEvent("onmousedown", OpenLayers.Function.True);
+
+            } catch (e) { }
+            this.mapObject.HideDashboard();
+            if(typeof this.mapObject.SetAnimationEnabled == "function") {
+                this.mapObject.SetAnimationEnabled(this.animationEnabled);
+            }
+        }
+
+        //can we do smooth panning? this is an unpublished method, so we need 
+        // to be careful
+        if ( !this.mapObject ||
+             !this.mapObject.vemapcontrol ||
+             !this.mapObject.vemapcontrol.PanMap ||
+             (typeof this.mapObject.vemapcontrol.PanMap != "function")) {
+
+            this.dragPanMapObject = null;
+        }
+
+    },
+
+    /**
+     * Method: onMapResize
+     */
+    onMapResize: function() {
+        this.mapObject.Resize(this.map.size.w, this.map.size.h);
+    },
+
+    /** 
+     * APIMethod: getWarningHTML
+     * 
+     * Returns: 
+     * {String} String with information on why layer is broken, how to get
+     *          it working.
+     */
+    getWarningHTML:function() {
+        return OpenLayers.i18n(
+            "getLayerWarning", {'layerType':'VE', 'layerLib':'VirtualEarth'}
+        );
+    },
+
+
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // Get&Set Center, Zoom
+
+    /** 
+     * APIMethod: setMapObjectCenter
+     * Set the mapObject to the specified center and zoom
+     * 
+     * Parameters:
+     * center - {Object} MapObject LonLat format
+     * zoom - {int} MapObject zoom format
+     */
+    setMapObjectCenter: function(center, zoom) {
+        this.mapObject.SetCenterAndZoom(center, zoom); 
+    },
+   
+    /**
+     * APIMethod: getMapObjectCenter
+     * 
+     * Returns: 
+     * {Object} The mapObject's current center in Map Object format
+     */
+    getMapObjectCenter: function() {
+        return this.mapObject.GetCenter();
+    },
+
+    /**
+     * APIMethod: dragPanMapObject
+     * 
+     * Parameters:
+     * dX - {Integer}
+     * dY - {Integer}
+     */
+    dragPanMapObject: function(dX, dY) {
+        this.mapObject.vemapcontrol.PanMap(dX, -dY);
+    },
+
+    /** 
+     * APIMethod: getMapObjectZoom
+     * 
+     * Returns:
+     * {Integer} The mapObject's current zoom, in Map Object format
+     */
+    getMapObjectZoom: function() {
+        return this.mapObject.GetZoomLevel();
+    },
+
+
+  // LonLat - Pixel Translation
+  
+    /**
+     * APIMethod: getMapObjectLonLatFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Object} MapObject LonLat translated from MapObject Pixel
+     */
+    getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
+        //the conditional here is to test if we are running the v6 of VE
+        return (typeof VEPixel != 'undefined') 
+            ? this.mapObject.PixelToLatLong(moPixel)
+            : this.mapObject.PixelToLatLong(moPixel.x, moPixel.y);
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Object} MapObject Pixel transtlated from MapObject LonLat
+     */
+    getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
+        return this.mapObject.LatLongToPixel(moLonLat);
+    },
+
+
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getLongitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Longitude of the given MapObject LonLat
+     */
+    getLongitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.Longitude, moLonLat.Latitude).lon :
+            moLonLat.Longitude;
+    },
+
+    /**
+     * APIMethod: getLatitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Latitude of the given MapObject LonLat
+     */
+    getLatitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.Longitude, moLonLat.Latitude).lat :
+            moLonLat.Latitude;
+    },
+
+    /**
+     * APIMethod: getMapObjectLonLatFromLonLat
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {Object} MapObject LonLat built from lon and lat params
+     */
+    getMapObjectLonLatFromLonLat: function(lon, lat) {
+        var veLatLong;
+        if(this.sphericalMercator) {
+            var lonlat = this.inverseMercator(lon, lat);
+            veLatLong = new VELatLong(lonlat.lat, lonlat.lon);
+        } else {
+            veLatLong = new VELatLong(lat, lon);
+        }
+        return veLatLong;
+    },
+
+  // Pixel
+    
+    /**
+     * APIMethod: getXFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} X value of the MapObject Pixel
+     */
+    getXFromMapObjectPixel: function(moPixel) {
+        return moPixel.x;
+    },
+
+    /**
+     * APIMethod: getYFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} Y value of the MapObject Pixel
+     */
+    getYFromMapObjectPixel: function(moPixel) {
+        return moPixel.y;
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromXY
+     * 
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     * 
+     * Returns:
+     * {Object} MapObject Pixel from x and y parameters
+     */
+    getMapObjectPixelFromXY: function(x, y) {
+        //the conditional here is to test if we are running the v6 of VE
+        return (typeof VEPixel != 'undefined') ? new VEPixel(x, y)
+                         : new Msn.VE.Pixel(x, y);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.VirtualEarth"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google.js	(revision 76)
@@ -0,0 +1,795 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/SphericalMercator.js
+ * @requires OpenLayers/Layer/EventPane.js
+ * @requires OpenLayers/Layer/FixedZoomLevels.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Google
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.SphericalMercator>
+ *  - <OpenLayers.Layer.EventPane>
+ *  - <OpenLayers.Layer.FixedZoomLevels>
+ */
+OpenLayers.Layer.Google = OpenLayers.Class(
+    OpenLayers.Layer.EventPane, 
+    OpenLayers.Layer.FixedZoomLevels, {
+    
+    /** 
+     * Constant: MIN_ZOOM_LEVEL
+     * {Integer} 0 
+     */
+    MIN_ZOOM_LEVEL: 0,
+    
+    /** 
+     * Constant: MAX_ZOOM_LEVEL
+     * {Integer} 21
+     */
+    MAX_ZOOM_LEVEL: 21,
+
+    /** 
+     * Constant: RESOLUTIONS
+     * {Array(Float)} Hardcode these resolutions so that they are more closely
+     *                tied with the standard wms projection
+     */
+    RESOLUTIONS: [
+        1.40625, 
+        0.703125, 
+        0.3515625, 
+        0.17578125, 
+        0.087890625, 
+        0.0439453125,
+        0.02197265625, 
+        0.010986328125, 
+        0.0054931640625, 
+        0.00274658203125,
+        0.001373291015625, 
+        0.0006866455078125, 
+        0.00034332275390625,
+        0.000171661376953125, 
+        0.0000858306884765625, 
+        0.00004291534423828125,
+        0.00002145767211914062, 
+        0.00001072883605957031,
+        0.00000536441802978515, 
+        0.00000268220901489257,
+        0.0000013411045074462891,
+        0.00000067055225372314453
+    ],
+
+    /**
+     * APIProperty: type
+     * {GMapType}
+     */
+    type: null,
+
+    /**
+     * APIProperty: wrapDateLine
+     * {Boolean} Allow user to pan forever east/west.  Default is true.  
+     *     Setting this to false only restricts panning if 
+     *     <sphericalMercator> is true. 
+     */
+    wrapDateLine: true,
+
+    /**
+     * APIProperty: sphericalMercator
+     * {Boolean} Should the map act as a mercator-projected map? This will
+     *     cause all interactions with the map to be in the actual map 
+     *     projection, which allows support for vector drawing, overlaying 
+     *     other maps, etc. 
+     */
+    sphericalMercator: false, 
+    
+    /**
+     * Property: version
+     * {Number} The version of the Google Maps API
+     */
+    version: null,
+
+    /** 
+     * Constructor: OpenLayers.Layer.Google
+     * 
+     * Parameters:
+     * name - {String} A name for the layer.
+     * options - {Object} An optional object whose properties will be set
+     *     on the layer.
+     */
+    initialize: function(name, options) {
+        options = options || {};
+        if(!options.version) {
+            options.version = typeof GMap2 === "function" ? "2" : "3";
+        }
+        var mixin = OpenLayers.Layer.Google["v" +
+            options.version.replace(/\./g, "_")];
+        if (mixin) {
+            OpenLayers.Util.applyDefaults(options, mixin);
+        } else {
+            throw "Unsupported Google Maps API version: " + options.version;
+        }
+
+        OpenLayers.Util.applyDefaults(options, mixin.DEFAULTS);
+        if (options.maxExtent) {
+            options.maxExtent = options.maxExtent.clone();
+        }
+
+        OpenLayers.Layer.EventPane.prototype.initialize.apply(this,
+            [name, options]);
+        OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this, 
+            [name, options]);
+
+        if (this.sphericalMercator) {
+            OpenLayers.Util.extend(this, OpenLayers.Layer.SphericalMercator);
+            this.initMercatorParameters();
+        }    
+    },
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Google>} An exact clone of this layer
+     */
+    clone: function() {
+        /**
+         * This method isn't intended to be called by a subclass and it
+         * doesn't call the same method on the superclass.  We don't call
+         * the super's clone because we don't want properties that are set
+         * on this layer after initialize (i.e. this.mapObject etc.).
+         */
+        return new OpenLayers.Layer.Google(
+            this.name, this.getOptions()
+        );
+    },
+
+    /**
+     * APIMethod: setVisibility
+     * Set the visibility flag for the layer and hide/show & redraw 
+     *     accordingly. Fire event unless otherwise specified
+     * 
+     * Note that visibility is no longer simply whether or not the layer's
+     *     style.display is set to "block". Now we store a 'visibility' state 
+     *     property on the layer class, this allows us to remember whether or 
+     *     not we *desire* for a layer to be visible. In the case where the 
+     *     map's resolution is out of the layer's range, this desire may be 
+     *     subverted.
+     * 
+     * Parameters:
+     * visible - {Boolean} Display the layer (if in range)
+     */
+    setVisibility: function(visible) {
+        // sharing a map container, opacity has to be set per layer
+        var opacity = this.opacity == null ? 1 : this.opacity;
+        OpenLayers.Layer.EventPane.prototype.setVisibility.apply(this, arguments);
+        this.setOpacity(opacity);
+    },
+    
+    /** 
+     * APIMethod: display
+     * Hide or show the Layer
+     * 
+     * Parameters:
+     * display - {Boolean}
+     */
+    display: function(visible) {
+        if (!this._dragging) {
+            this.setGMapVisibility(visible);
+        }
+        OpenLayers.Layer.EventPane.prototype.display.apply(this, arguments);
+    },
+    
+    /**
+     * Method: moveTo
+     * 
+     * Parameters:
+     * bound - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean} Tells when zoom has changed, as layers have to
+     *     do some init work in that case.
+     * dragging - {Boolean}
+     */
+    moveTo: function(bounds, zoomChanged, dragging) {
+        this._dragging = dragging;
+        OpenLayers.Layer.EventPane.prototype.moveTo.apply(this, arguments);
+        delete this._dragging;
+    },
+    
+    /**
+     * APIMethod: setOpacity
+     * Sets the opacity for the entire layer (all images)
+     * 
+     * Parameter:
+     * opacity - {Float}
+     */
+    setOpacity: function(opacity) {
+        if (opacity !== this.opacity) {
+            if (this.map != null) {
+                this.map.events.triggerEvent("changelayer", {
+                    layer: this,
+                    property: "opacity"
+                });
+            }
+            this.opacity = opacity;
+        }
+        // Though this layer's opacity may not change, we're sharing a container
+        // and need to update the opacity for the entire container.
+        if (this.getVisibility()) {
+            var container = this.getMapContainer();
+            OpenLayers.Util.modifyDOMElement(
+                container, null, null, null, null, null, null, opacity
+            );
+        }
+    },
+
+    /**
+     * APIMethod: destroy
+     * Clean up this layer.
+     */
+    destroy: function() {
+        /**
+         * We have to override this method because the event pane destroy
+         * deletes the mapObject reference before removing this layer from
+         * the map.
+         */
+        if (this.map) {
+            this.setGMapVisibility(false);
+            var cache = OpenLayers.Layer.Google.cache[this.map.id];
+            if (cache && cache.count <= 1) {
+                this.removeGMapElements();
+            }            
+        }
+        OpenLayers.Layer.EventPane.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: removeGMapElements
+     * Remove all elements added to the dom.  This should only be called if
+     * this is the last of the Google layers for the given map.
+     */
+    removeGMapElements: function() {
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        if (cache) {
+            // remove shared elements from dom
+            var container = this.mapObject && this.getMapContainer();                
+            if (container && container.parentNode) {
+                container.parentNode.removeChild(container);
+            }
+            var termsOfUse = cache.termsOfUse;
+            if (termsOfUse && termsOfUse.parentNode) {
+                termsOfUse.parentNode.removeChild(termsOfUse);
+            }
+            var poweredBy = cache.poweredBy;
+            if (poweredBy && poweredBy.parentNode) {
+                poweredBy.parentNode.removeChild(poweredBy);
+            }
+        }
+    },
+
+    /**
+     * APIMethod: removeMap
+     * On being removed from the map, also remove termsOfUse and poweredBy divs
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    removeMap: function(map) {
+        // hide layer before removing
+        if (this.visibility && this.mapObject) {
+            this.setGMapVisibility(false);
+        }
+        // check to see if last Google layer in this map
+        var cache = OpenLayers.Layer.Google.cache[map.id];
+        if (cache) {
+            if (cache.count <= 1) {
+                this.removeGMapElements();
+                delete OpenLayers.Layer.Google.cache[map.id];
+            } else {
+                // decrement the layer count
+                --cache.count;
+            }
+        }
+        // remove references to gmap elements
+        delete this.termsOfUse;
+        delete this.poweredBy;
+        delete this.mapObject;
+        delete this.dragObject;
+        OpenLayers.Layer.EventPane.prototype.removeMap.apply(this, arguments);
+    },
+    
+  //
+  // TRANSLATION: MapObject Bounds <-> OpenLayers.Bounds
+  //
+
+    /**
+     * APIMethod: getOLBoundsFromMapObjectBounds
+     * 
+     * Parameters:
+     * moBounds - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} An <OpenLayers.Bounds>, translated from the 
+     *                       passed-in MapObject Bounds.
+     *                       Returns null if null value is passed in.
+     */
+    getOLBoundsFromMapObjectBounds: function(moBounds) {
+        var olBounds = null;
+        if (moBounds != null) {
+            var sw = moBounds.getSouthWest();
+            var ne = moBounds.getNorthEast();
+            if (this.sphericalMercator) {
+                sw = this.forwardMercator(sw.lng(), sw.lat());
+                ne = this.forwardMercator(ne.lng(), ne.lat());
+            } else {
+                sw = new OpenLayers.LonLat(sw.lng(), sw.lat()); 
+                ne = new OpenLayers.LonLat(ne.lng(), ne.lat()); 
+            }    
+            olBounds = new OpenLayers.Bounds(sw.lon, 
+                                             sw.lat, 
+                                             ne.lon, 
+                                             ne.lat );
+        }
+        return olBounds;
+    },
+
+    /** 
+     * APIMethod: getWarningHTML
+     * 
+     * Returns: 
+     * {String} String with information on why layer is broken, how to get
+     *          it working.
+     */
+    getWarningHTML:function() {
+        return OpenLayers.i18n("googleWarning");
+    },
+
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // Get&Set Center, Zoom
+
+    /**
+     * APIMethod: getMapObjectCenter
+     * 
+     * Returns: 
+     * {Object} The mapObject's current center in Map Object format
+     */
+    getMapObjectCenter: function() {
+        return this.mapObject.getCenter();
+    },
+
+    /** 
+     * APIMethod: getMapObjectZoom
+     * 
+     * Returns:
+     * {Integer} The mapObject's current zoom, in Map Object format
+     */
+    getMapObjectZoom: function() {
+        return this.mapObject.getZoom();
+    },
+
+  
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getLongitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Longitude of the given MapObject LonLat
+     */
+    getLongitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+          this.forwardMercator(moLonLat.lng(), moLonLat.lat()).lon :
+          moLonLat.lng();  
+    },
+
+    /**
+     * APIMethod: getLatitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Latitude of the given MapObject LonLat
+     */
+    getLatitudeFromMapObjectLonLat: function(moLonLat) {
+        var lat = this.sphericalMercator ? 
+          this.forwardMercator(moLonLat.lng(), moLonLat.lat()).lat :
+          moLonLat.lat(); 
+        return lat;  
+    },
+    
+  // Pixel
+    
+    /**
+     * APIMethod: getXFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} X value of the MapObject Pixel
+     */
+    getXFromMapObjectPixel: function(moPixel) {
+        return moPixel.x;
+    },
+
+    /**
+     * APIMethod: getYFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} Y value of the MapObject Pixel
+     */
+    getYFromMapObjectPixel: function(moPixel) {
+        return moPixel.y;
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.Google"
+});
+
+/**
+ * Property: OpenLayers.Layer.Google.cache
+ * {Object} Cache for elements that should only be created once per map.
+ */
+OpenLayers.Layer.Google.cache = {};
+
+
+/**
+ * Constant: OpenLayers.Layer.Google.v2
+ * 
+ * Mixin providing functionality specific to the Google Maps API v2.
+ */
+OpenLayers.Layer.Google.v2 = {
+    
+    /**
+     * Property: termsOfUse
+     * {DOMElement} Div for Google's copyright and terms of use link
+     */
+    termsOfUse: null, 
+
+    /**
+     * Property: poweredBy
+     * {DOMElement} Div for Google's powered by logo and link
+     */
+    poweredBy: null, 
+
+    /**
+     * Property: dragObject
+     * {GDraggableObject} Since 2.93, Google has exposed the ability to get
+     *     the maps GDraggableObject. We can now use this for smooth panning
+     */
+    dragObject: null, 
+    
+    /** 
+     * Method: loadMapObject
+     * Load the GMap and register appropriate event listeners. If we can't 
+     *     load GMap2, then display a warning message.
+     */
+    loadMapObject:function() {
+        if (!this.type) {
+            this.type = G_NORMAL_MAP;
+        }
+        var mapObject, termsOfUse, poweredBy;
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        if (cache) {
+            // there are already Google layers added to this map
+            mapObject = cache.mapObject;
+            termsOfUse = cache.termsOfUse;
+            poweredBy = cache.poweredBy;
+            // increment the layer count
+            ++cache.count;
+        } else {
+            // this is the first Google layer for this map
+
+            var container = this.map.viewPortDiv;
+            var div = document.createElement("div");
+            div.id = this.map.id + "_GMap2Container";
+            div.style.position = "absolute";
+            div.style.width = "100%";
+            div.style.height = "100%";
+            container.appendChild(div);
+
+            // create GMap and shuffle elements
+            try {
+                mapObject = new GMap2(div);
+                
+                // move the ToS and branding stuff up to the container div
+                termsOfUse = div.lastChild;
+                container.appendChild(termsOfUse);
+                termsOfUse.style.zIndex = "1100";
+                termsOfUse.style.right = "";
+                termsOfUse.style.bottom = "";
+                termsOfUse.className = "olLayerGoogleCopyright";
+
+                poweredBy = div.lastChild;
+                container.appendChild(poweredBy);
+                poweredBy.style.zIndex = "1100";
+                poweredBy.style.right = "";
+                poweredBy.style.bottom = "";
+                poweredBy.className = "olLayerGooglePoweredBy gmnoprint";
+                
+            } catch (e) {
+                throw(e);
+            }
+            // cache elements for use by any other google layers added to
+            // this same map
+            OpenLayers.Layer.Google.cache[this.map.id] = {
+                mapObject: mapObject,
+                termsOfUse: termsOfUse,
+                poweredBy: poweredBy,
+                count: 1
+            };
+        }
+
+        this.mapObject = mapObject;
+        this.termsOfUse = termsOfUse;
+        this.poweredBy = poweredBy;
+        
+        // ensure this layer type is one of the mapObject types
+        if (OpenLayers.Util.indexOf(this.mapObject.getMapTypes(),
+                                    this.type) === -1) {
+            this.mapObject.addMapType(this.type);
+        }
+
+        //since v 2.93 getDragObject is now available.
+        if(typeof mapObject.getDragObject == "function") {
+            this.dragObject = mapObject.getDragObject();
+        } else {
+            this.dragPanMapObject = null;
+        }
+        
+        if(this.isBaseLayer === false) {
+            this.setGMapVisibility(this.div.style.display !== "none");
+        }
+
+    },
+
+    /**
+     * APIMethod: onMapResize
+     */
+    onMapResize: function() {
+        // workaround for resizing of invisible or not yet fully loaded layers
+        // where GMap2.checkResize() does not work. We need to load the GMap
+        // for the old div size, then checkResize(), and then call
+        // layer.moveTo() to trigger GMap.setCenter() (which will finish
+        // the GMap initialization).
+        if(this.visibility && this.mapObject.isLoaded()) {
+            this.mapObject.checkResize();
+        } else {
+            if(!this._resized) {
+                var layer = this;
+                var handle = GEvent.addListener(this.mapObject, "load", function() {
+                    GEvent.removeListener(handle);
+                    delete layer._resized;
+                    layer.mapObject.checkResize();
+                    layer.moveTo(layer.map.getCenter(), layer.map.getZoom());
+                });
+            }
+            this._resized = true;
+        }
+    },
+
+    /**
+     * Method: setGMapVisibility
+     * Display the GMap container and associated elements.
+     * 
+     * Parameters:
+     * visible - {Boolean} Display the GMap elements.
+     */
+    setGMapVisibility: function(visible) {
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        if (cache) {
+            var container = this.mapObject.getContainer();
+            if (visible === true) {
+                this.mapObject.setMapType(this.type);
+                container.style.display = "";
+                this.termsOfUse.style.left = "";
+                this.termsOfUse.style.display = "";
+                this.poweredBy.style.display = "";            
+                cache.displayed = this.id;
+            } else {
+                if (cache.displayed === this.id) {
+                    delete cache.displayed;
+                }
+                if (!cache.displayed) {
+                    container.style.display = "none";
+                    this.termsOfUse.style.display = "none";
+                    // move ToU far to the left in addition to setting display
+                    // to "none", because at the end of the GMap2 load
+                    // sequence, display: none will be unset and ToU would be
+                    // visible after loading a map with a google layer that is
+                    // initially hidden. 
+                    this.termsOfUse.style.left = "-9999px";
+                    this.poweredBy.style.display = "none";
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: getMapContainer
+     * 
+     * Returns:
+     * {DOMElement} the GMap container's div
+     */
+    getMapContainer: function() {
+        return this.mapObject.getContainer();
+    },
+
+  //
+  // TRANSLATION: MapObject Bounds <-> OpenLayers.Bounds
+  //
+
+    /**
+     * APIMethod: getMapObjectBoundsFromOLBounds
+     * 
+     * Parameters:
+     * olBounds - {<OpenLayers.Bounds>}
+     * 
+     * Returns:
+     * {Object} A MapObject Bounds, translated from olBounds
+     *          Returns null if null value is passed in
+     */
+    getMapObjectBoundsFromOLBounds: function(olBounds) {
+        var moBounds = null;
+        if (olBounds != null) {
+            var sw = this.sphericalMercator ? 
+              this.inverseMercator(olBounds.bottom, olBounds.left) : 
+              new OpenLayers.LonLat(olBounds.bottom, olBounds.left);
+            var ne = this.sphericalMercator ? 
+              this.inverseMercator(olBounds.top, olBounds.right) : 
+              new OpenLayers.LonLat(olBounds.top, olBounds.right);
+            moBounds = new GLatLngBounds(new GLatLng(sw.lat, sw.lon),
+                                         new GLatLng(ne.lat, ne.lon));
+        }
+        return moBounds;
+    },
+
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // Get&Set Center, Zoom
+
+    /** 
+     * APIMethod: setMapObjectCenter
+     * Set the mapObject to the specified center and zoom
+     * 
+     * Parameters:
+     * center - {Object} MapObject LonLat format
+     * zoom - {int} MapObject zoom format
+     */
+    setMapObjectCenter: function(center, zoom) {
+        this.mapObject.setCenter(center, zoom); 
+    },
+   
+    /**
+     * APIMethod: dragPanMapObject
+     * 
+     * Parameters:
+     * dX - {Integer}
+     * dY - {Integer}
+     */
+    dragPanMapObject: function(dX, dY) {
+        this.dragObject.moveBy(new GSize(-dX, dY));
+    },
+
+
+  // LonLat - Pixel Translation
+  
+    /**
+     * APIMethod: getMapObjectLonLatFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Object} MapObject LonLat translated from MapObject Pixel
+     */
+    getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
+        return this.mapObject.fromContainerPixelToLatLng(moPixel);
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Object} MapObject Pixel transtlated from MapObject LonLat
+     */
+    getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
+        return this.mapObject.fromLatLngToContainerPixel(moLonLat);
+    },
+
+  
+  // Bounds
+  
+    /** 
+     * APIMethod: getMapObjectZoomFromMapObjectBounds
+     * 
+     * Parameters:
+     * moBounds - {Object} MapObject Bounds format
+     * 
+     * Returns:
+     * {Object} MapObject Zoom for specified MapObject Bounds
+     */
+    getMapObjectZoomFromMapObjectBounds: function(moBounds) {
+        return this.mapObject.getBoundsZoomLevel(moBounds);
+    },
+
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getMapObjectLonLatFromLonLat
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {Object} MapObject LonLat built from lon and lat params
+     */
+    getMapObjectLonLatFromLonLat: function(lon, lat) {
+        var gLatLng;
+        if(this.sphericalMercator) {
+            var lonlat = this.inverseMercator(lon, lat);
+            gLatLng = new GLatLng(lonlat.lat, lonlat.lon);
+        } else {
+            gLatLng = new GLatLng(lat, lon);
+        }
+        return gLatLng;
+    },
+
+  // Pixel
+    
+    /**
+     * APIMethod: getMapObjectPixelFromXY
+     * 
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     * 
+     * Returns:
+     * {Object} MapObject Pixel from x and y parameters
+     */
+    getMapObjectPixelFromXY: function(x, y) {
+        return new GPoint(x, y);
+    }
+    
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMapCache.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMapCache.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMapCache.js	(revision 76)
@@ -0,0 +1,148 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Layer/KaMap.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.KaMapCache
+ * 
+ * This class is designed to talk directly to a web-accessible ka-Map
+ * cache generated by the precache2.php script.
+ * 
+ * To create a a new KaMapCache layer, you must indicate also the "i" parameter
+ * (that will be used to calculate the file extension), and another special
+ * parameter, object names "metaTileSize", with "h" (height) and "w" (width)
+ * properties.
+ * 
+ *     // Create a new kaMapCache layer. 
+ *     var kamap_base = new OpenLayers.Layer.KaMapCache(
+ *         "Satellite",
+ *         "http://www.example.org/web/acessible/cache",
+ *         {g: "satellite", map: "world", i: 'png24', metaTileSize: {w: 5, h: 5} }
+ *       );
+ *    
+ *     // Create an kaMapCache overlay layer (using "isBaseLayer: false"). 
+ *     // Forces the output to be a "gif", using the "i" parameter.
+ *     var kamap_overlay = new OpenLayers.Layer.KaMapCache(
+ *         "Streets",
+ *         "http://www.example.org/web/acessible/cache",
+ *         {g: "streets", map: "world", i: "gif", metaTileSize: {w: 5, h: 5} },
+ *         {isBaseLayer: false}
+ *       );
+ *
+ * The cache URLs must look like: 
+ *   var/cache/World/50000/Group_Name/def/t-440320/l20480
+ * 
+ * This means that the cache generated via tile.php will *not* work with
+ *     this class, and should instead use the KaMap layer.
+ *
+ * More information is available in Ticket #1518.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.KaMap>
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.KaMapCache = OpenLayers.Class(OpenLayers.Layer.KaMap, {
+
+    /**
+     * Constant: IMAGE_EXTENSIONS
+     * {Object} Simple hash map to convert format to extension.
+     */
+    IMAGE_EXTENSIONS: {
+        'jpeg': 'jpg',
+        'gif' : 'gif',
+        'png' : 'png',
+        'png8' : 'png',
+        'png24' : 'png',
+        'dithered' : 'png'
+    },
+    
+    /**
+     * Constant: DEFAULT_FORMAT
+     * {Object} Simple hash map to convert format to extension.
+     */
+    DEFAULT_FORMAT: 'jpeg',
+    
+    /**
+     * Constructor: OpenLayers.Layer.KaMapCache
+     * 
+     * Parameters:
+     * name - {String}
+     * url - {String}
+     * params - {Object} Parameters to be sent to the HTTP server in the
+     *    query string for the tile. The format can be set via the 'i'
+     *    parameter (defaults to jpg) , and the map should be set via 
+     *    the 'map' parameter. It has been reported that ka-Map may behave
+     *    inconsistently if your format parameter does not match the format
+     *    parameter configured in your config.php. (See ticket #327 for more
+     *    information.)
+     * options - {Object} Additional options for the layer. Any of the 
+     *     APIProperties listed on this layer, and any layer types it
+     *     extends, can be overridden through the options parameter. 
+     */
+    initialize: function(name, url, params, options) {
+        OpenLayers.Layer.KaMap.prototype.initialize.apply(this, arguments);
+        this.extension = this.IMAGE_EXTENSIONS[this.params.i.toLowerCase() || DEFAULT_FORMAT];
+    },
+
+    /**
+     * Method: getURL
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * 
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the 
+     *          passed-in bounds and appropriate tile size specified as 
+     *          parameters
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        var mapRes = this.map.getResolution();
+        var scale = Math.round((this.map.getScale() * 10000)) / 10000;
+        var pX = Math.round(bounds.left / mapRes);
+        var pY = -Math.round(bounds.top / mapRes);
+
+        var metaX = Math.floor(pX / this.tileSize.w / this.params.metaTileSize.w) * this.tileSize.w * this.params.metaTileSize.w;
+        var metaY = Math.floor(pY / this.tileSize.h / this.params.metaTileSize.h) * this.tileSize.h * this.params.metaTileSize.h;
+
+        // if url is not a string, it should be an array of strings,
+        // in which case we will deterministically select one of them in
+        // order to evenly distribute requests to different urls.
+        //
+        var url = this.url;
+        if (url instanceof Array) {
+            url = this.selectUrl(paramsString, url);
+        }  
+    
+        var components = [
+            url,
+            "/",
+            this.params.map,
+            "/",
+            scale,
+            "/",
+            this.params.g.replace(/\s/g, '_'),
+            "/def/t", 
+            metaY,
+            "/l",
+            metaX,
+            "/t",
+            pY,
+            "l",
+            pX,
+            ".",
+            this.extension
+          ];
+          
+        return components.join("");
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.KaMapCache"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcIMS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcIMS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcIMS.js	(revision 76)
@@ -0,0 +1,466 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ * @requires OpenLayers/Format/ArcXML.js
+ * @requires OpenLayers/Request.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.ArcIMS
+ * Instances of OpenLayers.Layer.ArcIMS are used to display data from ESRI ArcIMS
+ *     Mapping Services. Create a new ArcIMS layer with the <OpenLayers.Layer.ArcIMS>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.ArcIMS = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * Constant: DEFAULT_PARAMS
+     * {Object} Default query string parameters.
+     */
+    DEFAULT_PARAMS: { 
+        ClientVersion: "9.2",
+        ServiceName: ''
+    },
+    
+    /**
+     * APIProperty: tileSize
+     * {<OpenLayers.Size>} Size for tiles.  Default is 512x512.
+     */
+    tileSize: null,
+    
+    /**
+     * APIProperty: featureCoordSys
+     * {String} Code for feature coordinate system.  Default is "4326".
+     */
+    featureCoordSys: "4326",
+    
+    /**
+     * APIProperty: filterCoordSys
+     * {String} Code for filter coordinate system.  Default is "4326".
+     */
+    filterCoordSys: "4326",
+    
+    /**
+     * APIProperty: layers
+     * {Array} An array of objects with layer properties.
+     */
+    layers: null,
+    
+    /**
+     * APIProperty: async
+     * {Boolean} Request images asynchronously.  Default is true.
+     */
+    async: true,
+    
+    /**
+     * APIProperty: name
+     * {String} Layer name.  Default is "ArcIMS".
+     */
+    name: "ArcIMS",
+
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} The layer is a base layer.  Default is true.
+     */
+    isBaseLayer: true,
+
+    /**
+     * Constant: DEFAULT_OPTIONS
+     * {Object} Default layers properties.
+     */
+    DEFAULT_OPTIONS: {
+        tileSize: new OpenLayers.Size(512, 512),
+        featureCoordSys: "4326",
+        filterCoordSys: "4326",
+        layers: null,
+        isBaseLayer: true,
+        async: true,
+        name: "ArcIMS"
+    }, 
+ 
+    /**
+     * Constructor: OpenLayers.Layer.ArcIMS
+     * Create a new ArcIMS layer object.
+     *
+     * Example:
+     * (code)
+     * var arcims = new OpenLayers.Layer.ArcIMS(
+     *     "Global Sample",
+     *     "http://sample.avencia.com/servlet/com.esri.esrimap.Esrimap", 
+     *     {
+     *         service: "OpenLayers_Sample", 
+     *         layers: [
+     *             // layers to manipulate
+     *             {id: "1", visible: true}
+     *         ]
+     *     }
+     * );
+     * (end)
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * url - {String} Base url for the ArcIMS server
+     * options - {Object} Optional object with properties to be set on the
+     *     layer.
+     */
+    initialize: function(name, url, options) {
+        
+        this.tileSize = new OpenLayers.Size(512, 512);
+
+        // parameters
+        this.params = OpenLayers.Util.applyDefaults(
+            {ServiceName: options.serviceName},
+            this.DEFAULT_PARAMS
+        );
+        this.options = OpenLayers.Util.applyDefaults(
+            options, this.DEFAULT_OPTIONS
+        );
+          
+        OpenLayers.Layer.Grid.prototype.initialize.apply(
+            this, [name, url, this.params, options]
+        );
+
+        //layer is transparent        
+        if (this.transparent) {
+            
+            // unless explicitly set in options, make layer an overlay
+            if (!this.isBaseLayer) {
+                this.isBaseLayer = false;
+            } 
+            
+            // jpegs can never be transparent, so intelligently switch the 
+            //  format, depending on the browser's capabilities
+            if (this.format == "image/jpeg") {
+                this.format = OpenLayers.Util.alphaHack() ? "image/gif" : "image/png";
+            }
+        }
+
+        // create an empty layer list if no layers specified in the options
+        if (this.options.layers === null) {
+            this.options.layers = [];
+        }
+    },    
+
+    
+    /**
+     * Method: destroy
+     * Destroy this layer
+     */
+    destroy: function() {
+        // for now, nothing special to do here. 
+        OpenLayers.Layer.Grid.prototype.destroy.apply(this, arguments);  
+    },   
+    
+    
+    /**
+     * Method: getURL
+     * Return an image url this layer.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox for the
+     *     request.
+     *
+     * Returns:
+     * {String} A string with the map image's url.
+     */
+    getURL: function(bounds) {
+        var url = "";
+        bounds = this.adjustBounds(bounds);
+        
+        // create an arcxml request to generate the image
+        var axlReq = new OpenLayers.Format.ArcXML( 
+            OpenLayers.Util.extend(this.options, {
+                requesttype: "image",
+                envelope: bounds.toArray(),
+                tileSize: this.tileSize
+            })
+        );
+        
+        // create a synchronous ajax request to get an arcims image
+        var req = new OpenLayers.Request.POST({
+            url: this.getFullRequestString(),
+            data: axlReq.write(),
+            async: false
+        });
+        
+        // if the response exists
+        if (req != null) {
+            var doc = req.responseXML;
+
+            if (!doc || !doc.documentElement) {            
+                doc = req.responseText;
+            }
+
+            // create a new arcxml format to read the response
+            var axlResp = new OpenLayers.Format.ArcXML();
+            var arcxml = axlResp.read(doc);
+            url = this.getUrlOrImage(arcxml.image.output);
+        }
+        
+        return url;
+    },
+    
+    
+    /**
+     * Method: getURLasync
+     * Get an image url this layer asynchronously, and execute a callback
+     *     when the image url is generated.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox for the
+     *     request.
+     * scope - {Object} The scope of the callback method.
+     * prop - {String} The name of the property in the scoped object to 
+     *     recieve the image url.
+     * callback - {Function} Function to call when image url is retrieved.
+     */
+    getURLasync: function(bounds, scope, prop, callback) {
+        bounds = this.adjustBounds(bounds);
+        
+        // create an arcxml request to generate the image
+        var axlReq = new OpenLayers.Format.ArcXML(  
+            OpenLayers.Util.extend(this.options, { 
+                requesttype: "image",
+                envelope: bounds.toArray(),
+                tileSize: this.tileSize
+            })
+        );
+        
+        // create an asynchronous ajax request to get an arcims image
+        OpenLayers.Request.POST({
+            url: this.getFullRequestString(),
+            async: true,
+            data: axlReq.write(),
+            callback: function(req) {
+                // process the response from ArcIMS, and call the callback function
+                // to set the image URL
+                var doc = req.responseXML;
+                if (!doc || !doc.documentElement) {            
+                    doc = req.responseText;
+                }
+
+                // create a new arcxml format to read the response
+                var axlResp = new OpenLayers.Format.ArcXML();
+                var arcxml = axlResp.read(doc);
+                
+                scope[prop] = this.getUrlOrImage(arcxml.image.output);
+
+                // call the callback function to recieve the updated property on the
+                // scoped object
+                callback.apply(scope);
+            },
+            scope: this
+        });
+    },
+    
+    /**
+     * Method: getUrlOrImage
+     * Extract a url or image from the ArcXML image output.
+     *
+     * Parameters:
+     * output - {Object} The image.output property of the object returned from
+     *     the ArcXML format read method.
+     *
+     * Returns:
+     * {String} A URL for an image (potentially with the data protocol).
+     */
+    getUrlOrImage: function(output) {
+        var ret = "";
+        if(output.url) {
+            // If the image response output url is a string, then the image
+            // data is not inline.
+            ret = output.url;
+        } else if(output.data) {
+            // The image data is inline and base64 encoded, create a data
+            // url for the image.  This will only work for small images,
+            // due to browser url length limits.
+            ret = "data:image/" + output.type + 
+                  ";base64," + output.data;
+        }
+        return ret;
+    },
+    
+    /**
+     * Method: setLayerQuery
+     * Set the query definition on this layer. Query definitions are used to
+     *     render parts of the spatial data in an image, and can be used to
+     *     filter features or layers in the ArcIMS service.
+     *
+     * Parameters:
+     * id - {String} The ArcIMS layer ID.
+     * queryDef - {Object} The query definition to apply to this layer.
+     */
+    setLayerQuery: function(id, querydef) {
+        // find the matching layer, if it exists
+        for (var lyr = 0; lyr < this.options.layers.length; lyr++) {
+            if (id == this.options.layers[lyr].id) {
+                // replace this layer definition
+                this.options.layers[lyr].query = querydef;
+                return;
+            }
+        }
+      
+        // no layer found, create a new definition
+        this.options.layers.push({id: id, visible: true, query: querydef});
+    },
+    
+    /**
+     * Method: getFeatureInfo
+     * Get feature information from ArcIMS.  Using the applied geometry, apply
+     *     the options to the query (buffer, area/envelope intersection), and
+     *     query the ArcIMS service.
+     *
+     * A note about accuracy:
+     * ArcIMS interprets the accuracy attribute in feature requests to be
+     *     something like the 'modulus' operator on feature coordinates,
+     *     applied to the database geometry of the feature.  It doesn't round,
+     *     so your feature coordinates may be up to (1 x accuracy) offset from
+     *     the actual feature coordinates.  If the accuracy of the layer is not
+     *     specified, the accuracy will be computed to be approximately 1
+     *     feature coordinate per screen  pixel.
+     *
+     * Parameters:
+     * geometry - {<OpenLayers.LonLat>} or {<OpenLayers.Geometry.Polygon>} The
+     *     geometry to use when making the query. This should be a closed
+     *     polygon for behavior approximating a free selection.
+     * layer - {Object} The ArcIMS layer definition. This is an anonymous object
+     *     that looks like:
+     * (code)
+     * {
+     *     id: "ArcXML layer ID",  // the ArcXML layer ID
+     *     query: {
+     *         where: "STATE = 'PA'",  // the where clause of the query
+     *         accuracy: 100           // the accuracy of the returned feature
+     *     }
+     * }
+     * (end)
+     * options - {Object} Object with non-default properties to set on the layer.
+     *     Supported properties are buffer, callback, scope, and any other
+     *     properties applicable to the ArcXML format.  Set the 'callback' and
+     *     'scope' for an object and function to recieve the parsed features
+     *     from ArcIMS.
+     */
+    getFeatureInfo: function(geometry, layer, options) {
+        // set the buffer to 1 unit (dd/m/ft?) by default
+        var buffer = options.buffer || 1;
+        // empty callback by default
+        var callback = options.callback || function() {};
+        // default scope is window (global)
+        var scope = options.scope || window;
+
+        // apply these option to the request options
+        var requestOptions = {};
+        OpenLayers.Util.extend(requestOptions, this.options);
+
+        // this is a feature request
+        requestOptions.requesttype = "feature";
+
+        if (geometry instanceof OpenLayers.LonLat) {
+            // create an envelope if the geometry is really a lon/lat
+            requestOptions.polygon = null;
+            requestOptions.envelope = [ 
+                geometry.lon - buffer, 
+                geometry.lat - buffer,
+                geometry.lon + buffer,
+                geometry.lat + buffer
+            ];
+        } else if (geometry instanceof OpenLayers.Geometry.Polygon) {
+            // use the polygon assigned, and empty the envelope
+            requestOptions.envelope = null;
+            requestOptions.polygon = geometry;
+        }
+      
+        // create an arcxml request to get feature requests
+        var arcxml = new OpenLayers.Format.ArcXML(requestOptions);
+
+        // apply any get feature options to the arcxml request
+        OpenLayers.Util.extend(arcxml.request.get_feature, options);
+
+        arcxml.request.get_feature.layer = layer.id;
+        if (typeof layer.query.accuracy == "number") {
+            // set the accuracy if it was specified
+            arcxml.request.get_feature.query.accuracy = layer.query.accuracy;
+        } else {
+            // guess that the accuracy is 1 per screen pixel
+            var mapCenter = this.map.getCenter();
+            var viewPx = this.map.getViewPortPxFromLonLat(mapCenter);
+            viewPx.x++;
+            var mapOffCenter = this.map.getLonLatFromPixel(viewPx);
+            arcxml.request.get_feature.query.accuracy = mapOffCenter.lon - mapCenter.lon;
+        }
+        
+        // set the get_feature query to be the same as the layer passed in
+        arcxml.request.get_feature.query.where = layer.query.where;
+        
+        // use area_intersection
+        arcxml.request.get_feature.query.spatialfilter.relation = "area_intersection";
+      
+        // create a new asynchronous request to get the feature info
+        OpenLayers.Request.POST({
+            url: this.getFullRequestString({'CustomService': 'Query'}),
+            data: arcxml.write(),
+            callback: function(request) {
+                // parse the arcxml response
+                var response = arcxml.parseResponse(request.responseText);
+                
+                if (!arcxml.iserror()) {
+                    // if the arcxml is not an error, call the callback with the features parsed
+                    callback.call(scope, response.features);
+                } else {
+                    // if the arcxml is an error, return null features selected
+                    callback.call(scope, null);
+                }
+            }
+        });
+    },
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.ArcIMS>} An exact clone of this layer
+     */
+    clone: function (obj) {
+
+        if (obj == null) {
+            obj = new OpenLayers.Layer.ArcIMS(this.name,
+                                           this.url,
+                                           this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },
+    
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added image tile.
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(
+            this, position, bounds, null, this.tileSize
+        );
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.ArcIMS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GML.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GML.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GML.js	(revision 76)
@@ -0,0 +1,174 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Vector.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.GML
+ * Create a vector layer by parsing a GML file. The GML file is
+ *     passed in as a parameter.
+ * *Deprecated*.  To be removed in 3.0.  Instead use OpenLayers.Layer.Vector
+ *     with Protocol.HTTP and Strategy.Fixed. Provide the protocol with a 
+ *     format parameter to get the parser you want for your data.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Vector>
+ */
+OpenLayers.Layer.GML = OpenLayers.Class(OpenLayers.Layer.Vector, {
+    
+    /**
+      * Property: loaded
+      * {Boolean} Flag for whether the GML data has been loaded yet.
+      */
+    loaded: false,
+
+    /**
+      * APIProperty: format
+      * {<OpenLayers.Format>} The format you want the data to be parsed with.
+      */
+    format: null,
+
+    /**
+     * APIProperty: formatOptions
+     * {Object} Hash of options which should be passed to the format when it is
+     * created. Must be passed in the constructor.
+     */
+    formatOptions: null, 
+    
+    /**
+     * Constructor: OpenLayers.Layer.GML
+     * Load and parse a single file on the web, according to the format
+     * provided via the 'format' option, defaulting to GML. 
+     *
+     * Parameters:
+     * name - {String} 
+     * url - {String} URL of a GML file.
+     * options - {Object} Hashtable of extra options to tag onto the layer.
+     */
+     initialize: function(name, url, options) {
+        var newArguments = [];
+        newArguments.push(name, options);
+        OpenLayers.Layer.Vector.prototype.initialize.apply(this, newArguments);
+        this.url = url;
+    },
+
+    /**
+     * APIMethod: setVisibility
+     * Set the visibility flag for the layer and hide/show&redraw accordingly. 
+     * Fire event unless otherwise specified
+     * GML will be loaded if the layer is being made visible for the first
+     * time.
+     *  
+     * Parameters:
+     * visible - {Boolean} Whether or not to display the layer 
+     *                          (if in range)
+     * noEvent - {Boolean} 
+     */
+    setVisibility: function(visibility, noEvent) {
+        OpenLayers.Layer.Vector.prototype.setVisibility.apply(this, arguments);
+        if(this.visibility && !this.loaded){
+            // Load the GML
+            this.loadGML();
+        }
+    },
+
+    /**
+     * Method: moveTo
+     * If layer is visible and GML has not been loaded, load GML, then load GML
+     * and call OpenLayers.Layer.Vector.moveTo() to redraw at the new location.
+     * 
+     * Parameters:
+     * bounds - {Object} 
+     * zoomChanged - {Object} 
+     * minor - {Object} 
+     */
+    moveTo:function(bounds, zoomChanged, minor) {
+        OpenLayers.Layer.Vector.prototype.moveTo.apply(this, arguments);
+        // Wait until initialisation is complete before loading GML
+        // otherwise we can get a race condition where the root HTML DOM is
+        // loaded after the GML is paited.
+        // See http://trac.openlayers.org/ticket/404
+        if(this.visibility && !this.loaded){
+            this.loadGML();
+        }
+    },
+
+    /**
+     * Method: loadGML
+     */
+    loadGML: function() {
+        if (!this.loaded) {
+            this.events.triggerEvent("loadstart");
+            OpenLayers.Request.GET({
+                url: this.url,
+                success: this.requestSuccess,
+                failure: this.requestFailure,
+                scope: this
+            });
+            this.loaded = true;
+        }    
+    },    
+    
+    /**
+     * Method: setUrl
+     * Change the URL and reload the GML
+     *
+     * Parameters:
+     * url - {String} URL of a GML file.
+     */
+    setUrl:function(url) {
+        this.url = url;
+        this.destroyFeatures();
+        this.loaded = false;
+        this.loadGML();
+    },
+    
+    /**
+     * Method: requestSuccess
+     * Process GML after it has been loaded.
+     * Called by initialize() and loadUrl() after the GML has been loaded.
+     *
+     * Parameters:
+     * request - {String} 
+     */
+    requestSuccess:function(request) {
+        var doc = request.responseXML;
+        
+        if (!doc || !doc.documentElement) {
+            doc = request.responseText;
+        }
+        
+        var options = {};
+        
+        OpenLayers.Util.extend(options, this.formatOptions);
+        if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+            options.externalProjection = this.projection;
+            options.internalProjection = this.map.getProjectionObject();
+        }    
+        
+        var gml = this.format ? new this.format(options) : new OpenLayers.Format.GML(options);
+        this.addFeatures(gml.read(doc));
+        this.events.triggerEvent("loadend");
+    },
+    
+    /**
+     * Method: requestFailure
+     * Process a failed loading of GML.
+     * Called by initialize() and loadUrl() if there was a problem loading GML.
+     *
+     * Parameters:
+     * request - {String} 
+     */
+    requestFailure: function(request) {
+        OpenLayers.Console.userError(OpenLayers.i18n("errorLoadingGML", {'url':this.url}));
+        this.events.triggerEvent("loadend");
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.GML"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Yahoo.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Yahoo.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Yahoo.js	(revision 76)
@@ -0,0 +1,430 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/SphericalMercator.js
+ * @requires OpenLayers/Layer/EventPane.js
+ * @requires OpenLayers/Layer/FixedZoomLevels.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Yahoo
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.EventPane>
+ *  - <OpenLayers.Layer.FixedZoomLevels>
+ */
+OpenLayers.Layer.Yahoo = OpenLayers.Class(
+  OpenLayers.Layer.EventPane, OpenLayers.Layer.FixedZoomLevels, {
+    
+    /** 
+     * Constant: MIN_ZOOM_LEVEL
+     * {Integer} 0 
+     */
+    MIN_ZOOM_LEVEL: 0,
+    
+    /** 
+     * Constant: MAX_ZOOM_LEVEL
+     * {Integer} 17
+     */
+    MAX_ZOOM_LEVEL: 17,
+
+    /** 
+     * Constant: RESOLUTIONS
+     * {Array(Float)} Hardcode these resolutions so that they are more closely
+     *                tied with the standard wms projection
+     */
+    RESOLUTIONS: [
+        1.40625, 
+        0.703125, 
+        0.3515625, 
+        0.17578125, 
+        0.087890625, 
+        0.0439453125,
+        0.02197265625, 
+        0.010986328125, 
+        0.0054931640625, 
+        0.00274658203125, 
+        0.001373291015625, 
+        0.0006866455078125, 
+        0.00034332275390625, 
+        0.000171661376953125, 
+        0.0000858306884765625, 
+        0.00004291534423828125,
+        0.00002145767211914062,
+        0.00001072883605957031
+    ],
+
+    /**
+     * APIProperty: type
+     * {YahooMapType}
+     */
+    type: null,
+    
+    /**
+     * APIProperty: wrapDateLine
+     * {Boolean} Allow user to pan forever east/west.  Default is true.  
+     *     Setting this to false only restricts panning if 
+     *     <sphericalMercator> is true. 
+     */
+    wrapDateLine: true,
+
+    /**
+     * APIProperty: sphericalMercator
+     * {Boolean} Should the map act as a mercator-projected map? This will
+     * cause all interactions with the map to be in the actual map projection,
+     * which allows support for vector drawing, overlaying other maps, etc. 
+     */
+    sphericalMercator: false, 
+
+    /** 
+     * Constructor: OpenLayers.Layer.Yahoo
+     * 
+     * Parameters:
+     * name - {String}
+     * options - {Object}
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.EventPane.prototype.initialize.apply(this, arguments);
+        OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this, 
+                                                                    arguments);
+        if(this.sphericalMercator) {
+            OpenLayers.Util.extend(this, OpenLayers.Layer.SphericalMercator);
+            this.initMercatorParameters();
+        }
+    },
+    
+    /**
+     * Method: loadMapObject
+     */
+    loadMapObject:function() {
+        try { //do not crash! 
+            var size = this.getMapObjectSizeFromOLSize(this.map.getSize());
+            this.mapObject = new YMap(this.div, this.type, size);
+            this.mapObject.disableKeyControls();
+            this.mapObject.disableDragMap();
+
+            //can we do smooth panning? (moveByXY is not an API function)
+            if ( !this.mapObject.moveByXY || 
+                 (typeof this.mapObject.moveByXY != "function" ) ) {
+
+                this.dragPanMapObject = null;
+            }                
+        } catch(e) {}
+    },
+
+    /**
+     * Method: onMapResize
+     * 
+     */
+    onMapResize: function() {
+        try {
+            var size = this.getMapObjectSizeFromOLSize(this.map.getSize());
+            this.mapObject.resizeTo(size);
+        } catch(e) {}     
+    },    
+    
+    
+    /** 
+     * APIMethod: setMap
+     * Overridden from EventPane because we need to remove this yahoo event
+     *     pane which prohibits our drag and drop, and we can only do this 
+     *     once the map has been loaded and centered.
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.EventPane.prototype.setMap.apply(this, arguments);
+
+        this.map.events.register("moveend", this, this.fixYahooEventPane);
+    },
+
+    /** 
+     * Method: fixYahooEventPane
+     * The map has been centered, so the mysterious yahoo eventpane has been
+     *     added. we remove it so that it doesnt mess with *our* event pane.
+     */
+    fixYahooEventPane: function() {
+        var yahooEventPane = OpenLayers.Util.getElement("ygddfdiv");
+        if (yahooEventPane != null) {
+            if (yahooEventPane.parentNode != null) {
+                yahooEventPane.parentNode.removeChild(yahooEventPane);
+            }
+            this.map.events.unregister("moveend", this, 
+                                       this.fixYahooEventPane);
+        }
+    },
+
+    /** 
+     * APIMethod: getWarningHTML
+     * 
+     * Returns: 
+     * {String} String with information on why layer is broken, how to get
+     *          it working.
+     */
+    getWarningHTML:function() {
+        return OpenLayers.i18n(
+            "getLayerWarning", {'layerType':'Yahoo', 'layerLib':'Yahoo'}
+        );
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*             Translation Functions                    */
+  /*                                                      */
+  /*    The following functions translate GMaps and OL    */ 
+  /*     formats for Pixel, LonLat, Bounds, and Zoom      */
+  /*                                                      */
+  /********************************************************/
+
+
+  //
+  // TRANSLATION: MapObject Zoom <-> OpenLayers Zoom
+  //
+  
+    /**
+     * APIMethod: getOLZoomFromMapObjectZoom
+     * 
+     * Parameters:
+     * gZoom - {Integer}
+     * 
+     * Returns:
+     * {Integer} An OpenLayers Zoom level, translated from the passed in gZoom
+     *           Returns null if null value is passed in.
+     */
+    getOLZoomFromMapObjectZoom: function(moZoom) {
+        var zoom = null;
+        if (moZoom != null) {
+            zoom = OpenLayers.Layer.FixedZoomLevels.prototype.getOLZoomFromMapObjectZoom.apply(this, [moZoom]);
+            zoom = 18 - zoom;
+        }
+        return zoom;
+    },
+    
+    /**
+     * APIMethod: getMapObjectZoomFromOLZoom
+     * 
+     * Parameters:
+     * olZoom - {Integer}
+     * 
+     * Returns:
+     * {Integer} A MapObject level, translated from the passed in olZoom
+     *           Returns null if null value is passed in
+     */
+    getMapObjectZoomFromOLZoom: function(olZoom) {
+        var zoom = null; 
+        if (olZoom != null) {
+            zoom = OpenLayers.Layer.FixedZoomLevels.prototype.getMapObjectZoomFromOLZoom.apply(this, [olZoom]);
+            zoom = 18 - zoom;
+        }
+        return zoom;
+    },
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // Get&Set Center, Zoom
+
+    /** 
+     * APIMethod: setMapObjectCenter
+     * Set the mapObject to the specified center and zoom
+     * 
+     * Parameters:
+     * center - {Object} MapObject LonLat format
+     * zoom - {int} MapObject zoom format
+     */
+    setMapObjectCenter: function(center, zoom) {
+        this.mapObject.drawZoomAndCenter(center, zoom); 
+    },
+   
+    /**
+     * APIMethod: getMapObjectCenter
+     * 
+     * Returns: 
+     * {Object} The mapObject's current center in Map Object format
+     */
+    getMapObjectCenter: function() {
+        return this.mapObject.getCenterLatLon();
+    },
+
+    /**
+     * APIMethod: dragPanMapObject
+     * 
+     * Parameters:
+     * dX - {Integer}
+     * dY - {Integer}
+     */
+    dragPanMapObject: function(dX, dY) {
+        this.mapObject.moveByXY({
+            'x': -dX,
+            'y': dY
+        });
+    },
+    
+    /** 
+     * APIMethod: getMapObjectZoom
+     * 
+     * Returns:
+     * {Integer} The mapObject's current zoom, in Map Object format
+     */
+    getMapObjectZoom: function() {
+        return this.mapObject.getZoomLevel();
+    },
+
+
+  // LonLat - Pixel Translation
+  
+    /**
+     * APIMethod: getMapObjectLonLatFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Object} MapObject LonLat translated from MapObject Pixel
+     */
+    getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
+        return this.mapObject.convertXYLatLon(moPixel);
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Object} MapObject Pixel transtlated from MapObject LonLat
+     */
+    getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
+        return this.mapObject.convertLatLonXY(moLonLat);
+    },
+
+
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getLongitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Longitude of the given MapObject LonLat
+     */
+    getLongitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.Lon, moLonLat.Lat).lon :
+            moLonLat.Lon;
+    },
+
+    /**
+     * APIMethod: getLatitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Latitude of the given MapObject LonLat
+     */
+    getLatitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.Lon, moLonLat.Lat).lat :
+            moLonLat.Lat;
+    },
+
+    /**
+     * APIMethod: getMapObjectLonLatFromLonLat
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {Object} MapObject LonLat built from lon and lat params
+     */
+    getMapObjectLonLatFromLonLat: function(lon, lat) {
+        var yLatLong;
+        if(this.sphericalMercator) {
+            var lonlat = this.inverseMercator(lon, lat);
+            yLatLong = new YGeoPoint(lonlat.lat, lonlat.lon);
+        } else {
+            yLatLong = new YGeoPoint(lat, lon);
+        }
+        return yLatLong;
+    },
+
+  // Pixel
+    
+    /**
+     * APIMethod: getXFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} X value of the MapObject Pixel
+     */
+    getXFromMapObjectPixel: function(moPixel) {
+        return moPixel.x;
+    },
+
+    /**
+     * APIMethod: getYFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} Y value of the MapObject Pixel
+     */
+    getYFromMapObjectPixel: function(moPixel) {
+        return moPixel.y;
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromXY
+     * 
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     * 
+     * Returns:
+     * {Object} MapObject Pixel from x and y parameters
+     */
+    getMapObjectPixelFromXY: function(x, y) {
+        return new YCoordPoint(x, y);
+    },
+    
+  // Size
+  
+    /**
+     * APIMethod: getMapObjectSizeFromOLSize
+     * 
+     * Parameters:
+     * olSize - {<OpenLayers.Size>}
+     * 
+     * Returns:
+     * {Object} MapObject Size from olSize parameter
+     */
+    getMapObjectSizeFromOLSize: function(olSize) {
+        return new YSize(olSize.w, olSize.h);
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.Yahoo"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TileCache.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TileCache.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TileCache.js	(revision 76)
@@ -0,0 +1,165 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.TileCache
+ * A read only TileCache layer.  Used to requests tiles cached by TileCache in
+ *     a web accessible cache.  This means that you have to pre-populate your
+ *     cache before this layer can be used.  It is meant only to read tiles
+ *     created by TileCache, and not to make calls to TileCache for tile
+ *     creation.  Create a new instance with the
+ *     <OpenLayers.Layer.TileCache> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.TileCache = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /** 
+     * APIProperty: isBaseLayer
+     * {Boolean} Treat this layer as a base layer.  Default is true.
+     */
+    isBaseLayer: true,
+    
+    /** 
+     * APIProperty: format
+     * {String} Mime type of the images returned.  Default is image/png.
+     */
+    format: 'image/png',
+
+    /**
+     * APIProperty: serverResolutions
+     * {Array} A list of all resolutions available on the server.  Only set this 
+     *     property if the map resolutions differs from the server.
+     */
+    serverResolutions: null,
+
+    /**
+     * Constructor: OpenLayers.Layer.TileCache
+     * Create a new read only TileCache layer.
+     *
+     * Parameters:
+     * name - {String} Name of the layer displayed in the interface
+     * url - {String} Location of the web accessible cache (not the location of
+     *     your tilecache script!)
+     * layername - {String} Layer name as defined in the TileCache 
+     *     configuration
+     * options - {Object} Optional object with properties to be set on the
+     *     layer.  Note that you should speficy your resolutions to match
+     *     your TileCache configuration.  This can be done by setting
+     *     the resolutions array directly (here or on the map), by setting
+     *     maxResolution and numZoomLevels, or by using scale based properties.
+     */
+    initialize: function(name, url, layername, options) {
+        this.layername = layername;
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this,
+                                                         [name, url, {}, options]);
+        this.extension = this.format.split('/')[1].toLowerCase();
+        this.extension = (this.extension == 'jpg') ? 'jpeg' : this.extension;
+    },    
+
+    /**
+     * APIMethod: clone
+     * obj - {Object} 
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.TileCache>} An exact clone of this 
+     *     <OpenLayers.Layer.TileCache>
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.TileCache(this.name,
+                                                 this.url,
+                                                 this.layername,
+                                                 this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },    
+    
+    /**
+     * Method: getURL
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * 
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the 
+     *     passed-in bounds and appropriate tile size specified as parameters.
+     */
+    getURL: function(bounds) {
+        var res = this.map.getResolution();
+        var bbox = this.maxExtent;
+        var size = this.tileSize;
+        var tileX = Math.round((bounds.left - bbox.left) / (res * size.w));
+        var tileY = Math.round((bounds.bottom - bbox.bottom) / (res * size.h));
+        var tileZ = this.serverResolutions != null ?
+            OpenLayers.Util.indexOf(this.serverResolutions, res) :
+            this.map.getZoom();
+        /**
+         * Zero-pad a positive integer.
+         * number - {Int} 
+         * length - {Int} 
+         *
+         * Returns:
+         * {String} A zero-padded string
+         */
+        function zeroPad(number, length) {
+            number = String(number);
+            var zeros = [];
+            for(var i=0; i<length; ++i) {
+                zeros.push('0');
+            }
+            return zeros.join('').substring(0, length - number.length) + number;
+        }
+        var components = [
+            this.layername,
+            zeroPad(tileZ, 2),
+            zeroPad(parseInt(tileX / 1000000), 3),
+            zeroPad((parseInt(tileX / 1000) % 1000), 3),
+            zeroPad((parseInt(tileX) % 1000), 3),
+            zeroPad(parseInt(tileY / 1000000), 3),
+            zeroPad((parseInt(tileY / 1000) % 1000), 3),
+            zeroPad((parseInt(tileY) % 1000), 3) + '.' + this.extension
+        ];
+        var path = components.join('/'); 
+        var url = this.url;
+        if (url instanceof Array) {
+            url = this.selectUrl(path, url);
+        }
+        url = (url.charAt(url.length - 1) == '/') ? url : url + '/';
+        return url + path;
+    },
+
+    /**
+     * Method: addTile
+     * Create a tile, initialize it, and add it to the layer div. 
+     *
+     * Parameters: 
+     * bounds - {<OpenLayers.Bounds>} 
+     * position - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added <OpenLayers.Tile.Image>
+     */
+    addTile:function(bounds, position) {
+        var url = this.getURL(bounds);
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                             url, this.tileSize);
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.TileCache"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcGIS93Rest.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcGIS93Rest.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/ArcGIS93Rest.js	(revision 76)
@@ -0,0 +1,253 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.ArcGIS93Rest
+ * Instances of OpenLayers.Layer.ArcGIS93Rest are used to display data from
+ *     ESRI ArcGIS Server 9.3 (and up?) Mapping Services using the REST API.
+ *     Create a new ArcGIS93Rest layer with the <OpenLayers.Layer.ArcGIS93Rest>
+ *     constructor.  More detail on the REST API is available at
+ *     http://sampleserver1.arcgisonline.com/ArcGIS/SDK/REST/index.html ;
+ *     specifically, the URL provided to this layer should be an export service
+ *     URL: http://sampleserver1.arcgisonline.com/ArcGIS/SDK/REST/export.html 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.ArcGIS93Rest = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * Constant: DEFAULT_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs 
+     */
+    DEFAULT_PARAMS: { 
+      format: "png"
+    },
+        
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} Default is true for ArcGIS93Rest layer
+     */
+    isBaseLayer: true,
+ 
+ 
+    /**
+     * Constructor: OpenLayers.Layer.ArcGIS93Rest
+     * Create a new ArcGIS93Rest layer object.
+     *
+     * Example:
+     * (code)
+     * var arcims = new OpenLayers.Layer.ArcGIS93Rest("MyName",
+     *                                    "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer/export", 
+     *                                    {
+     *                                      layers: "0,1,2"
+     *                                    });
+     * (end)
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * url - {String} Base url for the ArcGIS server REST service
+     * options - {Object} An object with key/value pairs representing the
+     *                    options and option values.
+     * Valid Options:
+     *        format: {String} MIME type of desired image type.
+     *        layers: {String} Comma-separated list of layers to display.
+     *        srs: {String} Projection ID.
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = [];
+        //uppercase params
+        params = OpenLayers.Util.upperCaseObject(params);
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+        OpenLayers.Util.applyDefaults(
+                       this.params, 
+                       OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS)
+                       );
+                       
+        //layer is transparent        
+        if (this.params.TRANSPARENT && 
+            this.params.TRANSPARENT.toString().toLowerCase() == "true") {
+            
+            // unless explicitly set in options, make layer an overlay
+            if ( (options == null) || (!options.isBaseLayer) ) {
+                this.isBaseLayer = false;
+            } 
+            
+            // jpegs can never be transparent, so intelligently switch the 
+            //  format, depending on the browser's capabilities
+            if (this.params.FORMAT == "jpg") {
+                this.params.FORMAT = OpenLayers.Util.alphaHack() ? "gif"
+                                                                 : "png";
+            }
+        }
+    },    
+
+    
+    /**
+     * Method: destroy
+     * Destroy this layer
+     */
+    destroy: function() {
+        // for now, nothing special to do here. 
+        OpenLayers.Layer.Grid.prototype.destroy.apply(this, arguments);  
+    },   
+    
+    /**
+         * Method: clone
+         * Create a clone of this layer
+         *
+         * Returns:
+         * {<OpenLayers.Layer.ArcGIS93Rest>} An exact clone of this layer
+         */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.ArcGIS93Rest(this.name,
+                                           this.url,
+                                           this.params,
+                                           this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },
+    
+    
+    /**
+     * Method: getURL
+     * Return an image url this layer.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox for the
+     *                                request.
+     *
+     * Returns:
+     * {String} A string with the map image's url.
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+
+        // ArcGIS Server only wants the numeric portion of the projection ID.
+        var projWords = this.projection.getCode().split(":");
+        var srid = projWords[projWords.length - 1];
+
+        var imageSize = this.getImageSize(); 
+        var newParams = {
+            'BBOX': bounds.toBBOX(),
+            'SIZE': imageSize.w + "," + imageSize.h,
+            // We always want image, the other options were json, image with a whole lotta html around it, etc.
+            'F': "image",
+            'BBOXSR': srid,
+            'IMAGESR': srid
+        };
+
+        // Now add the filter parameters.
+        if (this.layerDefs) {
+            var layerDefStrList = [];
+            var layerID;
+            for(layerID in this.layerDefs) {
+                if (this.layerDefs.hasOwnProperty(layerID)) {
+                    if (this.layerDefs[layerID]) {
+                        layerDefStrList.push(layerID);
+                        layerDefStrList.push(":");
+                        layerDefStrList.push(this.layerDefs[layerID]);
+                        layerDefStrList.push(";");
+                    }
+                }
+            }
+            if (layerDefStrList.length > 0) {
+                newParams['LAYERDEFS'] = layerDefStrList.join("");
+            }
+        }
+        var requestString = this.getFullRequestString(newParams);
+        return requestString;
+    },
+    
+    /**
+     * Method: setLayerFilter
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * id - {String} The id of the layer to which the filter applies.
+     * queryDef - {String} A sql-ish query filter, for more detail see the ESRI
+     *                     documentation at http://sampleserver1.arcgisonline.com/ArcGIS/SDK/REST/export.html
+     */
+    setLayerFilter: function ( id, queryDef ) {
+        if (!this.layerDefs) {
+            this.layerDefs = {};
+        }
+        if (queryDef) {
+            this.layerDefs[id] = queryDef;
+        } else {
+            delete this.layerDefs[id];
+        }
+    },
+    
+    /**
+     * Method: clearLayerFilter
+     * Clears layer filters, either from a specific layer,
+     * or all of them.
+     *
+     * Parameters:
+     * id - {String} The id of the layer from which to remove any
+     *               filter.  If unspecified/blank, all filters
+     *               will be removed.
+     */
+    clearLayerFilter: function ( id ) {
+        if (id) {
+            delete this.layerDefs[id];
+        } else {
+            delete this.layerDefs;
+        }
+    },
+    
+    /**
+     * APIMethod: mergeNewParams
+     * Catch changeParams and uppercase the new params to be merged in
+     *     before calling changeParams on the super class.
+     * 
+     *     Once params have been changed, the tiles will be reloaded with
+     *     the new parameters.
+     * 
+     * Parameters:
+     * newParams - {Object} Hashtable of new params to use
+     */
+    mergeNewParams:function(newParams) {
+        var upperParams = OpenLayers.Util.upperCaseObject(newParams);
+        var newArguments = [upperParams];
+        return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(this, 
+                                                             newArguments);
+    },
+
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+
+    
+    CLASS_NAME: "OpenLayers.Layer.ArcGIS93Rest"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Image.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Image.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Image.js	(revision 76)
@@ -0,0 +1,254 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+ 
+/**
+ * @requires OpenLayers/Layer.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Image
+ * Instances of OpenLayers.Layer.Image are used to display data from a web
+ * accessible image as a map layer.  Create a new image layer with the
+ * <OpenLayers.Layer.Image> constructor.  Inherits from <OpenLayers.Layer>.
+ */
+OpenLayers.Layer.Image = OpenLayers.Class(OpenLayers.Layer, {
+
+    /**
+     * Property: isBaseLayer
+     * {Boolean} The layer is a base layer.  Default is true.  Set this property
+     * in the layer options
+     */
+    isBaseLayer: true,
+    
+    /**
+     * Property: url
+     * {String} URL of the image to use
+     */
+    url: null,
+
+    /**
+     * Property: extent
+     * {<OpenLayers.Bounds>} The image bounds in map units.  This extent will
+     *     also be used as the default maxExtent for the layer.  If you wish
+     *     to have a maxExtent that is different than the image extent, set the
+     *     maxExtent property of the options argument (as with any other layer).
+     */
+    extent: null,
+    
+    /**
+     * Property: size
+     * {<OpenLayers.Size>} The image size in pixels
+     */
+    size: null,
+
+    /**
+     * Property: tile
+     * {<OpenLayers.Tile.Image>}
+     */
+    tile: null,
+
+    /**
+     * Property: aspectRatio
+     * {Float} The ratio of height/width represented by a single pixel in the
+     * graphic
+     */
+    aspectRatio: null,
+
+    /**
+     * Constructor: OpenLayers.Layer.Image
+     * Create a new image layer
+     *
+     * Parameters:
+     * name - {String} A name for the layer.
+     * url - {String} Relative or absolute path to the image
+     * extent - {<OpenLayers.Bounds>} The extent represented by the image
+     * size - {<OpenLayers.Size>} The size (in pixels) of the image
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, extent, size, options) {
+        this.url = url;
+        this.extent = extent;
+        this.maxExtent = extent;
+        this.size = size;
+        OpenLayers.Layer.prototype.initialize.apply(this, [name, options]);
+
+        this.aspectRatio = (this.extent.getHeight() / this.size.h) /
+                           (this.extent.getWidth() / this.size.w);
+    },    
+
+    /**
+     * Method: destroy
+     * Destroy this layer
+     */
+    destroy: function() {
+        if (this.tile) {
+            this.removeTileMonitoringHooks(this.tile);
+            this.tile.destroy();
+            this.tile = null;
+        }
+        OpenLayers.Layer.prototype.destroy.apply(this, arguments);
+    },
+    
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Paramters:
+     * obj - {Object} An optional layer (is this ever used?)
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Image>} An exact copy of this layer
+     */
+    clone: function(obj) {
+        
+        if(obj == null) {
+            obj = new OpenLayers.Layer.Image(this.name,
+                                               this.url,
+                                               this.extent,
+                                               this.size,
+                                               this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },    
+    
+    /**
+     * APIMethod: setMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        /**
+         * If nothing to do with resolutions has been set, assume a single
+         * resolution determined by ratio*extent/size - if an image has a
+         * pixel aspect ratio different than one (as calculated above), the
+         * image will be stretched in one dimension only.
+         */
+        if( this.options.maxResolution == null ) {
+            this.options.maxResolution = this.aspectRatio *
+                                         this.extent.getWidth() /
+                                         this.size.w;
+        }
+        OpenLayers.Layer.prototype.setMap.apply(this, arguments);
+    },
+
+    /** 
+     * Method: moveTo
+     * Create the tile for the image or resize it for the new resolution
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean}
+     * dragging - {Boolean}
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        OpenLayers.Layer.prototype.moveTo.apply(this, arguments);
+
+        var firstRendering = (this.tile == null);
+
+        if(zoomChanged || firstRendering) {
+
+            //determine new tile size
+            this.setTileSize();
+
+            //determine new position (upper left corner of new bounds)
+            var ul = new OpenLayers.LonLat(this.extent.left, this.extent.top);
+            var ulPx = this.map.getLayerPxFromLonLat(ul);
+
+            if(firstRendering) {
+                //create the new tile
+                this.tile = new OpenLayers.Tile.Image(this, ulPx, this.extent, 
+                                                      null, this.tileSize);
+                this.addTileMonitoringHooks(this.tile);
+            } else {
+                //just resize the tile and set it's new position
+                this.tile.size = this.tileSize.clone();
+                this.tile.position = ulPx.clone();
+            }
+            this.tile.draw();
+        }
+    }, 
+
+    /**
+     * Set the tile size based on the map size.
+     */
+    setTileSize: function() {
+        var tileWidth = this.extent.getWidth() / this.map.getResolution();
+        var tileHeight = this.extent.getHeight() / this.map.getResolution();
+        this.tileSize = new OpenLayers.Size(tileWidth, tileHeight);
+    },
+
+    /** 
+     * Method: addTileMonitoringHooks
+     * This function takes a tile as input and adds the appropriate hooks to 
+     *     the tile so that the layer can keep track of the loading tiles.
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    addTileMonitoringHooks: function(tile) {
+        tile.onLoadStart = function() {
+            this.events.triggerEvent("loadstart");
+        };
+        tile.events.register("loadstart", this, tile.onLoadStart);
+      
+        tile.onLoadEnd = function() {
+            this.events.triggerEvent("loadend");
+        };
+        tile.events.register("loadend", this, tile.onLoadEnd);
+        tile.events.register("unload", this, tile.onLoadEnd);
+    },
+
+    /** 
+     * Method: removeTileMonitoringHooks
+     * This function takes a tile as input and removes the tile hooks 
+     *     that were added in <addTileMonitoringHooks>.
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    removeTileMonitoringHooks: function(tile) {
+        tile.unload();
+        tile.events.un({
+            "loadstart": tile.onLoadStart,
+            "loadend": tile.onLoadEnd,
+            "unload": tile.onLoadEnd,
+            scope: this
+        });
+    },
+    
+    /**
+     * APIMethod: setUrl
+     * 
+     * Parameters:
+     * newUrl - {String}
+     */
+    setUrl: function(newUrl) {
+        this.url = newUrl;
+        this.tile.draw();
+    },
+
+    /** 
+     * APIMethod: getURL
+     * The url we return is always the same (the image itself never changes)
+     *     so we can ignore the bounds parameter (it will always be the same, 
+     *     anyways) 
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     */
+    getURL: function(bounds) {
+        return this.url;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Image"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Text.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Text.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Text.js	(revision 76)
@@ -0,0 +1,264 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Markers.js
+ * @requires OpenLayers/Format/Text.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Text
+ * This layer creates markers given data in a text file.  The <location>
+ *     property of the layer (specified as a property of the options argument
+ *     in the <OpenLayers.Layer.Text> constructor) points to a tab delimited
+ *     file with data used to create markers.
+ *
+ * The first row of the data file should be a header line with the column names
+ *     of the data. Each column should be delimited by a tab space. The
+ *     possible columns are:
+ *      - *point* lat,lon of the point where a marker is to be placed
+ *      - *lat*  Latitude of the point where a marker is to be placed
+ *      - *lon*  Longitude of the point where a marker is to be placed
+ *      - *icon* or *image* URL of marker icon to use.
+ *      - *iconSize* Size of Icon to use.
+ *      - *iconOffset* Where the top-left corner of the icon is to be placed
+ *            relative to the latitude and longitude of the point.
+ *      - *title* The text of the 'title' is placed inside an 'h2' marker
+ *            inside a popup, which opens when the marker is clicked.
+ *      - *description* The text of the 'description' is placed below the h2
+ *            in the popup. this can be plain text or HTML.
+ *
+ * Example text file:
+ * (code)
+ * lat	lon	title	description	iconSize	iconOffset	icon
+ * 10	20	title	description	21,25		-10,-25		http://www.openlayers.org/dev/img/marker.png
+ * (end)
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Markers>
+ */
+OpenLayers.Layer.Text = OpenLayers.Class(OpenLayers.Layer.Markers, {
+
+    /**
+     * APIProperty: location 
+     * {String} URL of text file.  Must be specified in the "options" argument
+     *   of the constructor. Can not be changed once passed in. 
+     */
+    location:null,
+
+    /** 
+     * Property: features
+     * {Array(<OpenLayers.Feature>)} 
+     */
+    features: null,
+    
+    /**
+     * APIProperty: formatOptions
+     * {Object} Hash of options which should be passed to the format when it is
+     * created. Must be passed in the constructor.
+     */
+    formatOptions: null, 
+
+    /** 
+     * Property: selectedFeature
+     * {<OpenLayers.Feature>}
+     */
+    selectedFeature: null,
+
+    /**
+     * Constructor: OpenLayers.Layer.Text
+     * Create a text layer.
+     * 
+     * Parameters:
+     * name - {String} 
+     * options - {Object} Object with properties to be set on the layer.
+     *     Must include <location> property.
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.Markers.prototype.initialize.apply(this, arguments);
+        this.features = new Array();
+    },
+
+    /**
+     * APIMethod: destroy 
+     */
+    destroy: function() {
+        // Warning: Layer.Markers.destroy() must be called prior to calling
+        // clearFeatures() here, otherwise we leak memory. Indeed, if
+        // Layer.Markers.destroy() is called after clearFeatures(), it won't be
+        // able to remove the marker image elements from the layer's div since
+        // the markers will have been destroyed by clearFeatures().
+        OpenLayers.Layer.Markers.prototype.destroy.apply(this, arguments);
+        this.clearFeatures();
+        this.features = null;
+    },
+    
+    /**
+     * Method: loadText
+     * Start the load of the Text data. Don't do this when we first add the layer,
+     * since we may not be visible at any point, and it would therefore be a waste.
+     */
+    loadText: function() {
+        if (!this.loaded) {
+            if (this.location != null) {
+
+                var onFail = function(e) {
+                    this.events.triggerEvent("loadend");
+                };
+
+                this.events.triggerEvent("loadstart");
+                OpenLayers.Request.GET({
+                    url: this.location,
+                    success: this.parseData,
+                    failure: onFail,
+                    scope: this
+                });
+                this.loaded = true;
+            }
+        }    
+    },    
+    
+    /**
+     * Method: moveTo
+     * If layer is visible and Text has not been loaded, load Text. 
+     * 
+     * Parameters:
+     * bounds - {Object} 
+     * zoomChanged - {Object} 
+     * minor - {Object} 
+     */
+    moveTo:function(bounds, zoomChanged, minor) {
+        OpenLayers.Layer.Markers.prototype.moveTo.apply(this, arguments);
+        if(this.visibility && !this.loaded){
+            this.loadText();
+        }
+    },
+    
+    /**
+     * Method: parseData
+     *
+     * Parameters:
+     * ajaxRequest - {<OpenLayers.Request.XMLHttpRequest>} 
+     */
+    parseData: function(ajaxRequest) {
+        var text = ajaxRequest.responseText;
+        
+        var options = {};
+        
+        OpenLayers.Util.extend(options, this.formatOptions);
+        
+        if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+            options.externalProjection = this.projection;
+            options.internalProjection = this.map.getProjectionObject();
+        }    
+        
+        var parser = new OpenLayers.Format.Text(options);
+        var features = parser.read(text);
+        for (var i=0, len=features.length; i<len; i++) {
+            var data = {};
+            var feature = features[i];
+            var location;
+            var iconSize, iconOffset;
+            
+            location = new OpenLayers.LonLat(feature.geometry.x, 
+                                             feature.geometry.y);
+            
+            if (feature.style.graphicWidth 
+                && feature.style.graphicHeight) {
+                iconSize = new OpenLayers.Size(
+                    feature.style.graphicWidth,
+                    feature.style.graphicHeight);
+            }        
+            
+            // FIXME: At the moment, we only use this if we have an 
+            // externalGraphic, because icon has no setOffset API Method.
+            /**
+             * FIXME FIRST!!
+             * The Text format does all sorts of parseFloating
+             * The result of a parseFloat for a bogus string is NaN.  That
+             * means the three possible values here are undefined, NaN, or a
+             * number.  The previous check was an identity check for null.  This
+             * means it was failing for all undefined or NaN.  A slightly better
+             * check is for undefined.  An even better check is to see if the
+             * value is a number (see #1441).
+             */
+            if (feature.style.graphicXOffset !== undefined
+                && feature.style.graphicYOffset !== undefined) {
+                iconOffset = new OpenLayers.Pixel(
+                    feature.style.graphicXOffset, 
+                    feature.style.graphicYOffset);
+            }
+            
+            if (feature.style.externalGraphic != null) {
+                data.icon = new OpenLayers.Icon(feature.style.externalGraphic, 
+                                                iconSize, 
+                                                iconOffset);
+            } else {
+                data.icon = OpenLayers.Marker.defaultIcon();
+
+                //allows for the case where the image url is not 
+                // specified but the size is. use a default icon
+                // but change the size
+                if (iconSize != null) {
+                    data.icon.setSize(iconSize);
+                }
+            }
+            
+            if ((feature.attributes.title != null) 
+                && (feature.attributes.description != null)) {
+                data['popupContentHTML'] = 
+                    '<h2>'+feature.attributes.title+'</h2>' + 
+                    '<p>'+feature.attributes.description+'</p>';
+            }
+            
+            data['overflow'] = feature.attributes.overflow || "auto"; 
+            
+            var markerFeature = new OpenLayers.Feature(this, location, data);
+            this.features.push(markerFeature);
+            var marker = markerFeature.createMarker();
+            if ((feature.attributes.title != null) 
+                && (feature.attributes.description != null)) {
+              marker.events.register('click', markerFeature, this.markerClick);
+            }
+            this.addMarker(marker);
+        }
+        this.events.triggerEvent("loadend");
+    },
+    
+    /**
+     * Property: markerClick
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    markerClick: function(evt) {
+        var sameMarkerClicked = (this == this.layer.selectedFeature);
+        this.layer.selectedFeature = (!sameMarkerClicked) ? this : null;
+        for(var i=0, len=this.layer.map.popups.length; i<len; i++) {
+            this.layer.map.removePopup(this.layer.map.popups[i]);
+        }
+        if (!sameMarkerClicked) {
+            this.layer.map.addPopup(this.createPopup()); 
+        }
+        OpenLayers.Event.stop(evt);
+    },
+
+    /**
+     * Method: clearFeatures
+     */
+    clearFeatures: function() {
+        if (this.features != null) {
+            while(this.features.length > 0) {
+                var feature = this.features[0];
+                OpenLayers.Util.removeItem(this.features, feature);
+                feature.destroy();
+            }
+        }        
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Text"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/EventPane.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/EventPane.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/EventPane.js	(revision 76)
@@ -0,0 +1,418 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer.js
+ * @requires OpenLayers/Util.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.EventPane
+ * Base class for 3rd party layers.  Create a new event pane layer with the
+ * <OpenLayers.Layer.EventPane> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer>
+ */
+OpenLayers.Layer.EventPane = OpenLayers.Class(OpenLayers.Layer, {
+    
+    /**
+     * APIProperty: smoothDragPan
+     * {Boolean} smoothDragPan determines whether non-public/internal API
+     *     methods are used for better performance while dragging EventPane 
+     *     layers. When not in sphericalMercator mode, the smoother dragging 
+     *     doesn't actually move north/south directly with the number of 
+     *     pixels moved, resulting in a slight offset when you drag your mouse 
+     *     north south with this option on. If this visual disparity bothers 
+     *     you, you should turn this option off, or use spherical mercator. 
+     *     Default is on.
+     */
+    smoothDragPan: true,
+
+    /**
+     * Property: isBaseLayer
+     * {Boolean} EventPaned layers are always base layers, by necessity.
+     */ 
+    isBaseLayer: true,
+
+    /**
+     * APIProperty: isFixed
+     * {Boolean} EventPaned layers are fixed by default.
+     */ 
+    isFixed: true,
+
+    /**
+     * Property: pane
+     * {DOMElement} A reference to the element that controls the events.
+     */
+    pane: null,
+
+
+    /**
+     * Property: mapObject
+     * {Object} This is the object which will be used to load the 3rd party library
+     * in the case of the google layer, this will be of type GMap, 
+     * in the case of the ve layer, this will be of type VEMap
+     */ 
+    mapObject: null,
+
+
+    /**
+     * Constructor: OpenLayers.Layer.EventPane
+     * Create a new event pane layer
+     *
+     * Parameters:
+     * name - {String}
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.prototype.initialize.apply(this, arguments);
+        if (this.pane == null) {
+            this.pane = OpenLayers.Util.createDiv(this.div.id + "_EventPane");
+        }
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Deconstruct this layer.
+     */
+    destroy: function() {
+        this.mapObject = null;
+        this.pane = null;
+        OpenLayers.Layer.prototype.destroy.apply(this, arguments); 
+    },
+
+    
+    /**
+     * Method: setMap
+     * Set the map property for the layer. This is done through an accessor
+     * so that subclasses can override this and take special action once 
+     * they have their map variable set. 
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.prototype.setMap.apply(this, arguments);
+        
+        this.pane.style.zIndex = parseInt(this.div.style.zIndex) + 1;
+        this.pane.style.display = this.div.style.display;
+        this.pane.style.width="100%";
+        this.pane.style.height="100%";
+        if (OpenLayers.Util.getBrowserName() == "msie") {
+            this.pane.style.background = 
+                "url(" + OpenLayers.Util.getImagesLocation() + "blank.gif)";
+        }
+
+        if (this.isFixed) {
+            this.map.viewPortDiv.appendChild(this.pane);
+        } else {
+            this.map.layerContainerDiv.appendChild(this.pane);
+        }
+
+        // once our layer has been added to the map, we can load it
+        this.loadMapObject();
+    
+        // if map didn't load, display warning
+        if (this.mapObject == null) {
+            this.loadWarningMessage();
+        }
+    },
+
+    /**
+     * APIMethod: removeMap
+     * On being removed from the map, we'll like to remove the invisible 'pane'
+     *     div that we added to it on creation. 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    removeMap: function(map) {
+        if (this.pane && this.pane.parentNode) {
+            this.pane.parentNode.removeChild(this.pane);
+        }
+        OpenLayers.Layer.prototype.removeMap.apply(this, arguments);
+    },
+  
+    /**
+     * Method: loadWarningMessage
+     * If we can't load the map lib, then display an error message to the 
+     *     user and tell them where to go for help.
+     * 
+     *     This function sets up the layout for the warning message. Each 3rd
+     *     party layer must implement its own getWarningHTML() function to 
+     *     provide the actual warning message.
+     */
+    loadWarningMessage:function() {
+
+        this.div.style.backgroundColor = "darkblue";
+
+        var viewSize = this.map.getSize();
+        
+        var msgW = Math.min(viewSize.w, 300);
+        var msgH = Math.min(viewSize.h, 200);
+        var size = new OpenLayers.Size(msgW, msgH);
+
+        var centerPx = new OpenLayers.Pixel(viewSize.w/2, viewSize.h/2);
+
+        var topLeft = centerPx.add(-size.w/2, -size.h/2);            
+
+        var div = OpenLayers.Util.createDiv(this.name + "_warning", 
+                                            topLeft, 
+                                            size,
+                                            null,
+                                            null,
+                                            null,
+                                            "auto");
+
+        div.style.padding = "7px";
+        div.style.backgroundColor = "yellow";
+
+        div.innerHTML = this.getWarningHTML();
+        this.div.appendChild(div);
+    },
+  
+    /** 
+     * Method: getWarningHTML
+     * To be implemented by subclasses.
+     * 
+     * Returns:
+     * {String} String with information on why layer is broken, how to get
+     *          it working.
+     */
+    getWarningHTML:function() {
+        //should be implemented by subclasses
+        return "";
+    },
+  
+    /**
+     * Method: display
+     * Set the display on the pane
+     *
+     * Parameters:
+     * display - {Boolean}
+     */
+    display: function(display) {
+        OpenLayers.Layer.prototype.display.apply(this, arguments);
+        this.pane.style.display = this.div.style.display;
+    },
+  
+    /**
+     * Method: setZIndex
+     * Set the z-index order for the pane.
+     * 
+     * Parameters:
+     * zIndex - {int}
+     */
+    setZIndex: function (zIndex) {
+        OpenLayers.Layer.prototype.setZIndex.apply(this, arguments);
+        this.pane.style.zIndex = parseInt(this.div.style.zIndex) + 1;
+    },
+
+    /**
+     * Method: moveTo
+     * Handle calls to move the layer.
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean}
+     * dragging - {Boolean}
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        OpenLayers.Layer.prototype.moveTo.apply(this, arguments);
+
+        if (this.mapObject != null) {
+
+            var newCenter = this.map.getCenter();
+            var newZoom = this.map.getZoom();
+
+            if (newCenter != null) {
+
+                var moOldCenter = this.getMapObjectCenter();
+                var oldCenter = this.getOLLonLatFromMapObjectLonLat(moOldCenter);
+
+                var moOldZoom = this.getMapObjectZoom();
+                var oldZoom= this.getOLZoomFromMapObjectZoom(moOldZoom);
+
+                if ( !(newCenter.equals(oldCenter)) || 
+                     !(newZoom == oldZoom) ) {
+
+                    if (dragging && this.dragPanMapObject && 
+                        this.smoothDragPan) {
+                        var oldPx = this.map.getViewPortPxFromLonLat(oldCenter);
+                        var newPx = this.map.getViewPortPxFromLonLat(newCenter);
+                        this.dragPanMapObject(newPx.x-oldPx.x, oldPx.y-newPx.y);
+                    } else {
+                        var center = this.getMapObjectLonLatFromOLLonLat(newCenter);
+                        var zoom = this.getMapObjectZoomFromOLZoom(newZoom);
+                        this.setMapObjectCenter(center, zoom, dragging);
+                    }
+                }
+            }
+        }
+    },
+
+
+  /********************************************************/
+  /*                                                      */
+  /*                 Baselayer Functions                  */
+  /*                                                      */
+  /********************************************************/
+
+    /**
+     * Method: getLonLatFromViewPortPx
+     * Get a map location from a pixel location
+     * 
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     *  {<OpenLayers.LonLat>} An OpenLayers.LonLat which is the passed-in view
+     *  port OpenLayers.Pixel, translated into lon/lat by map lib
+     *  If the map lib is not loaded or not centered, returns null
+     */
+    getLonLatFromViewPortPx: function (viewPortPx) {
+        var lonlat = null;
+        if ( (this.mapObject != null) && 
+             (this.getMapObjectCenter() != null) ) {
+            var moPixel = this.getMapObjectPixelFromOLPixel(viewPortPx);
+            var moLonLat = this.getMapObjectLonLatFromMapObjectPixel(moPixel);
+            lonlat = this.getOLLonLatFromMapObjectLonLat(moLonLat);
+        }
+        return lonlat;
+    },
+
+ 
+    /**
+     * Method: getViewPortPxFromLonLat
+     * Get a pixel location from a map location
+     *
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel which is the passed-in
+     * OpenLayers.LonLat, translated into view port pixels by map lib
+     * If map lib is not loaded or not centered, returns null
+     */
+    getViewPortPxFromLonLat: function (lonlat) {
+        var viewPortPx = null;
+        if ( (this.mapObject != null) && 
+             (this.getMapObjectCenter() != null) ) {
+
+            var moLonLat = this.getMapObjectLonLatFromOLLonLat(lonlat);
+            var moPixel = this.getMapObjectPixelFromMapObjectLonLat(moLonLat);
+        
+            viewPortPx = this.getOLPixelFromMapObjectPixel(moPixel);
+        }
+        return viewPortPx;
+    },
+
+  /********************************************************/
+  /*                                                      */
+  /*               Translation Functions                  */
+  /*                                                      */
+  /*   The following functions translate Map Object and   */
+  /*            OL formats for Pixel, LonLat              */
+  /*                                                      */
+  /********************************************************/
+
+  //
+  // TRANSLATION: MapObject LatLng <-> OpenLayers.LonLat
+  //
+
+    /**
+     * Method: getOLLonLatFromMapObjectLonLat
+     * Get an OL style map location from a 3rd party style map location
+     *
+     * Parameters
+     * moLonLat - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} An OpenLayers.LonLat, translated from the passed in 
+     *          MapObject LonLat
+     *          Returns null if null value is passed in
+     */
+    getOLLonLatFromMapObjectLonLat: function(moLonLat) {
+        var olLonLat = null;
+        if (moLonLat != null) {
+            var lon = this.getLongitudeFromMapObjectLonLat(moLonLat);
+            var lat = this.getLatitudeFromMapObjectLonLat(moLonLat);
+            olLonLat = new OpenLayers.LonLat(lon, lat);
+        }
+        return olLonLat;
+    },
+
+    /**
+     * Method: getMapObjectLonLatFromOLLonLat
+     * Get a 3rd party map location from an OL map location.
+     *
+     * Parameters:
+     * olLonLat - {<OpenLayers.LonLat>}
+     * 
+     * Returns:
+     * {Object} A MapObject LonLat, translated from the passed in 
+     *          OpenLayers.LonLat
+     *          Returns null if null value is passed in
+     */
+    getMapObjectLonLatFromOLLonLat: function(olLonLat) {
+        var moLatLng = null;
+        if (olLonLat != null) {
+            moLatLng = this.getMapObjectLonLatFromLonLat(olLonLat.lon,
+                                                         olLonLat.lat);
+        }
+        return moLatLng;
+    },
+
+
+  //
+  // TRANSLATION: MapObject Pixel <-> OpenLayers.Pixel
+  //
+
+    /**
+     * Method: getOLPixelFromMapObjectPixel
+     * Get an OL pixel location from a 3rd party pixel location.
+     *
+     * Parameters:
+     * moPixel - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel, translated from the passed in 
+     *          MapObject Pixel
+     *          Returns null if null value is passed in
+     */
+    getOLPixelFromMapObjectPixel: function(moPixel) {
+        var olPixel = null;
+        if (moPixel != null) {
+            var x = this.getXFromMapObjectPixel(moPixel);
+            var y = this.getYFromMapObjectPixel(moPixel);
+            olPixel = new OpenLayers.Pixel(x, y);
+        }
+        return olPixel;
+    },
+
+    /**
+     * Method: getMapObjectPixelFromOLPixel
+     * Get a 3rd party pixel location from an OL pixel location
+     *
+     * Parameters:
+     * olPixel - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {Object} A MapObject Pixel, translated from the passed in 
+     *          OpenLayers.Pixel
+     *          Returns null if null value is passed in
+     */
+    getMapObjectPixelFromOLPixel: function(olPixel) {
+        var moPixel = null;
+        if (olPixel != null) {
+            moPixel = this.getMapObjectPixelFromXY(olPixel.x, olPixel.y);
+        }
+        return moPixel;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.EventPane"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Grid.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Grid.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Grid.js	(revision 76)
@@ -0,0 +1,755 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/HTTPRequest.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Grid
+ * Base class for layers that use a lattice of tiles.  Create a new grid
+ * layer with the <OpenLayers.Layer.Grid> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.HTTPRequest>
+ */
+OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
+    
+    /**
+     * APIProperty: tileSize
+     * {<OpenLayers.Size>}
+     */
+    tileSize: null,
+    
+    /**
+     * Property: grid
+     * {Array(Array(<OpenLayers.Tile>))} This is an array of rows, each row is 
+     *     an array of tiles.
+     */
+    grid: null,
+
+    /**
+     * APIProperty: singleTile
+     * {Boolean} Moves the layer into single-tile mode, meaning that one tile 
+     *     will be loaded. The tile's size will be determined by the 'ratio'
+     *     property. When the tile is dragged such that it does not cover the 
+     *     entire viewport, it is reloaded.
+     */
+    singleTile: false,
+
+    /** APIProperty: ratio
+     *  {Float} Used only when in single-tile mode, this specifies the 
+     *          ratio of the size of the single tile to the size of the map.
+     */
+    ratio: 1.5,
+
+    /**
+     * APIProperty: buffer
+     * {Integer} Used only when in gridded mode, this specifies the number of 
+     *           extra rows and colums of tiles on each side which will
+     *           surround the minimum grid tiles to cover the map.
+     */
+    buffer: 2,
+
+    /**
+     * APIProperty: numLoadingTiles
+     * {Integer} How many tiles are still loading?
+     */
+    numLoadingTiles: 0,
+
+    /**
+     * Constructor: OpenLayers.Layer.Grid
+     * Create a new grid layer
+     *
+     * Parameters:
+     * name - {String}
+     * url - {String}
+     * params - {Object}
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, params, options) {
+        OpenLayers.Layer.HTTPRequest.prototype.initialize.apply(this, 
+                                                                arguments);
+        
+        //grid layers will trigger 'tileloaded' when each new tile is 
+        // loaded, as a means of progress update to listeners.
+        // listeners can access 'numLoadingTiles' if they wish to keep track
+        // of the loading progress
+        //
+        this.events.addEventType("tileloaded");
+
+        this.grid = [];
+    },
+
+    /**
+     * APIMethod: destroy
+     * Deconstruct the layer and clear the grid.
+     */
+    destroy: function() {
+        this.clearGrid();
+        this.grid = null;
+        this.tileSize = null;
+        OpenLayers.Layer.HTTPRequest.prototype.destroy.apply(this, arguments); 
+    },
+
+    /**
+     * Method: clearGrid
+     * Go through and remove all tiles from the grid, calling
+     *    destroy() on each of them to kill circular references
+     */
+    clearGrid:function() {
+        if (this.grid) {
+            for(var iRow=0, len=this.grid.length; iRow<len; iRow++) {
+                var row = this.grid[iRow];
+                for(var iCol=0, clen=row.length; iCol<clen; iCol++) {
+                    var tile = row[iCol];
+                    this.removeTileMonitoringHooks(tile);
+                    tile.destroy();
+                }
+            }
+            this.grid = [];
+        }
+    },
+
+    /**
+     * APIMethod: clone
+     * Create a clone of this layer
+     *
+     * Parameters:
+     * obj - {Object} Is this ever used?
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.Grid>} An exact clone of this OpenLayers.Layer.Grid
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.Grid(this.name,
+                                            this.url,
+                                            this.params,
+                                            this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.HTTPRequest.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+        if (this.tileSize != null) {
+            obj.tileSize = this.tileSize.clone();
+        }
+        
+        // we do not want to copy reference to grid, so we make a new array
+        obj.grid = [];
+
+        return obj;
+    },    
+
+    /**
+     * Method: moveTo
+     * This function is called whenever the map is moved. All the moving
+     * of actual 'tiles' is done by the map, but moveTo's role is to accept
+     * a bounds and make sure the data that that bounds requires is pre-loaded.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean}
+     * dragging - {Boolean}
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        OpenLayers.Layer.HTTPRequest.prototype.moveTo.apply(this, arguments);
+        
+        bounds = bounds || this.map.getExtent();
+
+        if (bounds != null) {
+             
+            // if grid is empty or zoom has changed, we *must* re-tile
+            var forceReTile = !this.grid.length || zoomChanged;
+
+            // total bounds of the tiles
+            var tilesBounds = this.getTilesBounds();            
+      
+            if (this.singleTile) {
+                
+                // We want to redraw whenever even the slightest part of the 
+                //  current bounds is not contained by our tile.
+                //  (thus, we do not specify partial -- its default is false)
+                if ( forceReTile || 
+                     (!dragging && !tilesBounds.containsBounds(bounds))) {
+                    this.initSingleTile(bounds);
+                }
+            } else {
+             
+                // if the bounds have changed such that they are not even 
+                //  *partially* contained by our tiles (IE user has 
+                //  programmatically panned to the other side of the earth) 
+                //  then we want to reTile (thus, partial true).  
+                //
+                if (forceReTile || !tilesBounds.containsBounds(bounds, true)) {
+                    this.initGriddedTiles(bounds);
+                } else {
+                    //we might have to shift our buffer tiles
+                    this.moveGriddedTiles(bounds);
+                }
+            }
+        }
+    },
+    
+    /**
+     * APIMethod: setTileSize
+     * Check if we are in singleTile mode and if so, set the size as a ratio
+     *     of the map size (as specified by the layer's 'ratio' property).
+     * 
+     * Parameters:
+     * size - {<OpenLayers.Size>}
+     */
+    setTileSize: function(size) { 
+        if (this.singleTile) {
+            size = this.map.getSize();
+            size.h = parseInt(size.h * this.ratio);
+            size.w = parseInt(size.w * this.ratio);
+        } 
+        OpenLayers.Layer.HTTPRequest.prototype.setTileSize.apply(this, [size]);
+    },
+        
+    /**
+     * Method: getGridBounds
+     * Deprecated. This function will be removed in 3.0. Please use 
+     *     getTilesBounds() instead.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A Bounds object representing the bounds of all the
+     * currently loaded tiles (including those partially or not at all seen 
+     * onscreen)
+     */
+    getGridBounds: function() {
+        var msg = "The getGridBounds() function is deprecated. It will be " +
+                  "removed in 3.0. Please use getTilesBounds() instead.";
+        OpenLayers.Console.warn(msg);
+        return this.getTilesBounds();
+    },
+
+    /**
+     * APIMethod: getTilesBounds
+     * Return the bounds of the tile grid.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} A Bounds object representing the bounds of all the
+     *     currently loaded tiles (including those partially or not at all seen 
+     *     onscreen).
+     */
+    getTilesBounds: function() {    
+        var bounds = null; 
+        
+        if (this.grid.length) {
+            var bottom = this.grid.length - 1;
+            var bottomLeftTile = this.grid[bottom][0];
+    
+            var right = this.grid[0].length - 1; 
+            var topRightTile = this.grid[0][right];
+    
+            bounds = new OpenLayers.Bounds(bottomLeftTile.bounds.left, 
+                                           bottomLeftTile.bounds.bottom,
+                                           topRightTile.bounds.right, 
+                                           topRightTile.bounds.top);
+            
+        }   
+        return bounds;
+    },
+
+    /**
+     * Method: initSingleTile
+     * 
+     * Parameters: 
+     * bounds - {<OpenLayers.Bounds>}
+     */
+    initSingleTile: function(bounds) {
+
+        //determine new tile bounds
+        var center = bounds.getCenterLonLat();
+        var tileWidth = bounds.getWidth() * this.ratio;
+        var tileHeight = bounds.getHeight() * this.ratio;
+                                       
+        var tileBounds = 
+            new OpenLayers.Bounds(center.lon - (tileWidth/2),
+                                  center.lat - (tileHeight/2),
+                                  center.lon + (tileWidth/2),
+                                  center.lat + (tileHeight/2));
+  
+        var ul = new OpenLayers.LonLat(tileBounds.left, tileBounds.top);
+        var px = this.map.getLayerPxFromLonLat(ul);
+
+        if (!this.grid.length) {
+            this.grid[0] = [];
+        }
+
+        var tile = this.grid[0][0];
+        if (!tile) {
+            tile = this.addTile(tileBounds, px);
+            
+            this.addTileMonitoringHooks(tile);
+            tile.draw();
+            this.grid[0][0] = tile;
+        } else {
+            tile.moveTo(tileBounds, px);
+        }           
+        
+        //remove all but our single tile
+        this.removeExcessTiles(1,1);
+    },
+
+    /** 
+     * Method: calculateGridLayout
+     * Generate parameters for the grid layout. This  
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bound>}
+     * extent - {<OpenLayers.Bounds>}
+     * resolution - {Number}
+     *
+     * Returns:
+     * Object containing properties tilelon, tilelat, tileoffsetlat,
+     * tileoffsetlat, tileoffsetx, tileoffsety
+     */
+    calculateGridLayout: function(bounds, extent, resolution) {
+        var tilelon = resolution * this.tileSize.w;
+        var tilelat = resolution * this.tileSize.h;
+        
+        var offsetlon = bounds.left - extent.left;
+        var tilecol = Math.floor(offsetlon/tilelon) - this.buffer;
+        var tilecolremain = offsetlon/tilelon - tilecol;
+        var tileoffsetx = -tilecolremain * this.tileSize.w;
+        var tileoffsetlon = extent.left + tilecol * tilelon;
+        
+        var offsetlat = bounds.top - (extent.bottom + tilelat);  
+        var tilerow = Math.ceil(offsetlat/tilelat) + this.buffer;
+        var tilerowremain = tilerow - offsetlat/tilelat;
+        var tileoffsety = -tilerowremain * this.tileSize.h;
+        var tileoffsetlat = extent.bottom + tilerow * tilelat;
+        
+        return { 
+          tilelon: tilelon, tilelat: tilelat,
+          tileoffsetlon: tileoffsetlon, tileoffsetlat: tileoffsetlat,
+          tileoffsetx: tileoffsetx, tileoffsety: tileoffsety
+        };
+
+    },
+
+    /**
+     * Method: initGriddedTiles
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     */
+    initGriddedTiles:function(bounds) {
+        
+        // work out mininum number of rows and columns; this is the number of
+        // tiles required to cover the viewport plus at least one for panning
+
+        var viewSize = this.map.getSize();
+        var minRows = Math.ceil(viewSize.h/this.tileSize.h) + 
+                      Math.max(1, 2 * this.buffer);
+        var minCols = Math.ceil(viewSize.w/this.tileSize.w) +
+                      Math.max(1, 2 * this.buffer);
+        
+        var extent = this.getMaxExtent();
+        var resolution = this.map.getResolution();
+        
+        var tileLayout = this.calculateGridLayout(bounds, extent, resolution);
+
+        var tileoffsetx = Math.round(tileLayout.tileoffsetx); // heaven help us
+        var tileoffsety = Math.round(tileLayout.tileoffsety);
+
+        var tileoffsetlon = tileLayout.tileoffsetlon;
+        var tileoffsetlat = tileLayout.tileoffsetlat;
+        
+        var tilelon = tileLayout.tilelon;
+        var tilelat = tileLayout.tilelat;
+
+        this.origin = new OpenLayers.Pixel(tileoffsetx, tileoffsety);
+
+        var startX = tileoffsetx; 
+        var startLon = tileoffsetlon;
+
+        var rowidx = 0;
+        
+        var layerContainerDivLeft = parseInt(this.map.layerContainerDiv.style.left);
+        var layerContainerDivTop = parseInt(this.map.layerContainerDiv.style.top);
+        
+    
+        do {
+            var row = this.grid[rowidx++];
+            if (!row) {
+                row = [];
+                this.grid.push(row);
+            }
+
+            tileoffsetlon = startLon;
+            tileoffsetx = startX;
+            var colidx = 0;
+ 
+            do {
+                var tileBounds = 
+                    new OpenLayers.Bounds(tileoffsetlon, 
+                                          tileoffsetlat, 
+                                          tileoffsetlon + tilelon,
+                                          tileoffsetlat + tilelat);
+
+                var x = tileoffsetx;
+                x -= layerContainerDivLeft;
+
+                var y = tileoffsety;
+                y -= layerContainerDivTop;
+
+                var px = new OpenLayers.Pixel(x, y);
+                var tile = row[colidx++];
+                if (!tile) {
+                    tile = this.addTile(tileBounds, px);
+                    this.addTileMonitoringHooks(tile);
+                    row.push(tile);
+                } else {
+                    tile.moveTo(tileBounds, px, false);
+                }
+     
+                tileoffsetlon += tilelon;       
+                tileoffsetx += this.tileSize.w;
+            } while ((tileoffsetlon <= bounds.right + tilelon * this.buffer)
+                     || colidx < minCols);
+             
+            tileoffsetlat -= tilelat;
+            tileoffsety += this.tileSize.h;
+        } while((tileoffsetlat >= bounds.bottom - tilelat * this.buffer)
+                || rowidx < minRows);
+        
+        //shave off exceess rows and colums
+        this.removeExcessTiles(rowidx, colidx);
+
+        //now actually draw the tiles
+        this.spiralTileLoad();
+    },
+
+    /**
+     * Method: getMaxExtent
+     * Get this layer's maximum extent. (Implemented as a getter for
+     *     potential specific implementations in sub-classes.)
+     *
+     * Returns:
+     * {OpenLayers.Bounds}
+     */
+    getMaxExtent: function() {
+        return this.maxExtent;
+    },
+    
+    /**
+     * Method: spiralTileLoad
+     *   Starts at the top right corner of the grid and proceeds in a spiral 
+     *    towards the center, adding tiles one at a time to the beginning of a 
+     *    queue. 
+     * 
+     *   Once all the grid's tiles have been added to the queue, we go back 
+     *    and iterate through the queue (thus reversing the spiral order from 
+     *    outside-in to inside-out), calling draw() on each tile. 
+     */
+    spiralTileLoad: function() {
+        var tileQueue = [];
+ 
+        var directions = ["right", "down", "left", "up"];
+
+        var iRow = 0;
+        var iCell = -1;
+        var direction = OpenLayers.Util.indexOf(directions, "right");
+        var directionsTried = 0;
+        
+        while( directionsTried < directions.length) {
+
+            var testRow = iRow;
+            var testCell = iCell;
+
+            switch (directions[direction]) {
+                case "right":
+                    testCell++;
+                    break;
+                case "down":
+                    testRow++;
+                    break;
+                case "left":
+                    testCell--;
+                    break;
+                case "up":
+                    testRow--;
+                    break;
+            } 
+    
+            // if the test grid coordinates are within the bounds of the 
+            //  grid, get a reference to the tile.
+            var tile = null;
+            if ((testRow < this.grid.length) && (testRow >= 0) &&
+                (testCell < this.grid[0].length) && (testCell >= 0)) {
+                tile = this.grid[testRow][testCell];
+            }
+            
+            if ((tile != null) && (!tile.queued)) {
+                //add tile to beginning of queue, mark it as queued.
+                tileQueue.unshift(tile);
+                tile.queued = true;
+                
+                //restart the directions counter and take on the new coords
+                directionsTried = 0;
+                iRow = testRow;
+                iCell = testCell;
+            } else {
+                //need to try to load a tile in a different direction
+                direction = (direction + 1) % 4;
+                directionsTried++;
+            }
+        } 
+        
+        // now we go through and draw the tiles in forward order
+        for(var i=0, len=tileQueue.length; i<len; i++) {
+            var tile = tileQueue[i];
+            tile.draw();
+            //mark tile as unqueued for the next time (since tiles are reused)
+            tile.queued = false;       
+        }
+    },
+
+    /**
+     * APIMethod: addTile
+     * Gives subclasses of Grid the opportunity to create an 
+     * OpenLayer.Tile of their choosing. The implementer should initialize 
+     * the new tile and take whatever steps necessary to display it.
+     *
+     * Parameters
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.Tile>} The added OpenLayers.Tile
+     */
+    addTile:function(bounds, position) {
+        // Should be implemented by subclasses
+    },
+    
+    /** 
+     * Method: addTileMonitoringHooks
+     * This function takes a tile as input and adds the appropriate hooks to 
+     *     the tile so that the layer can keep track of the loading tiles.
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    addTileMonitoringHooks: function(tile) {
+        
+        tile.onLoadStart = function() {
+            //if that was first tile then trigger a 'loadstart' on the layer
+            if (this.numLoadingTiles == 0) {
+                this.events.triggerEvent("loadstart");
+            }
+            this.numLoadingTiles++;
+        };
+        tile.events.register("loadstart", this, tile.onLoadStart);
+      
+        tile.onLoadEnd = function() {
+            this.numLoadingTiles--;
+            this.events.triggerEvent("tileloaded");
+            //if that was the last tile, then trigger a 'loadend' on the layer
+            if (this.numLoadingTiles == 0) {
+                this.events.triggerEvent("loadend");
+            }
+        };
+        tile.events.register("loadend", this, tile.onLoadEnd);
+        tile.events.register("unload", this, tile.onLoadEnd);
+    },
+
+    /** 
+     * Method: removeTileMonitoringHooks
+     * This function takes a tile as input and removes the tile hooks 
+     *     that were added in addTileMonitoringHooks()
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    removeTileMonitoringHooks: function(tile) {
+        tile.unload();
+        tile.events.un({
+            "loadstart": tile.onLoadStart,
+            "loadend": tile.onLoadEnd,
+            "unload": tile.onLoadEnd,
+            scope: this
+        });
+    },
+    
+    /**
+     * Method: moveGriddedTiles
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     */
+    moveGriddedTiles: function(bounds) {
+        var buffer = this.buffer || 1;
+        while (true) {
+            var tlLayer = this.grid[0][0].position;
+            var tlViewPort = 
+                this.map.getViewPortPxFromLayerPx(tlLayer);
+            if (tlViewPort.x > -this.tileSize.w * (buffer - 1)) {
+                this.shiftColumn(true);
+            } else if (tlViewPort.x < -this.tileSize.w * buffer) {
+                this.shiftColumn(false);
+            } else if (tlViewPort.y > -this.tileSize.h * (buffer - 1)) {
+                this.shiftRow(true);
+            } else if (tlViewPort.y < -this.tileSize.h * buffer) {
+                this.shiftRow(false);
+            } else {
+                break;
+            }
+        };
+    },
+
+    /**
+     * Method: shiftRow
+     * Shifty grid work
+     *
+     * Parameters:
+     * prepend - {Boolean} if true, prepend to beginning.
+     *                          if false, then append to end
+     */
+    shiftRow:function(prepend) {
+        var modelRowIndex = (prepend) ? 0 : (this.grid.length - 1);
+        var grid = this.grid;
+        var modelRow = grid[modelRowIndex];
+
+        var resolution = this.map.getResolution();
+        var deltaY = (prepend) ? -this.tileSize.h : this.tileSize.h;
+        var deltaLat = resolution * -deltaY;
+
+        var row = (prepend) ? grid.pop() : grid.shift();
+
+        for (var i=0, len=modelRow.length; i<len; i++) {
+            var modelTile = modelRow[i];
+            var bounds = modelTile.bounds.clone();
+            var position = modelTile.position.clone();
+            bounds.bottom = bounds.bottom + deltaLat;
+            bounds.top = bounds.top + deltaLat;
+            position.y = position.y + deltaY;
+            row[i].moveTo(bounds, position);
+        }
+
+        if (prepend) {
+            grid.unshift(row);
+        } else {
+            grid.push(row);
+        }
+    },
+
+    /**
+     * Method: shiftColumn
+     * Shift grid work in the other dimension
+     *
+     * Parameters:
+     * prepend - {Boolean} if true, prepend to beginning.
+     *                          if false, then append to end
+     */
+    shiftColumn: function(prepend) {
+        var deltaX = (prepend) ? -this.tileSize.w : this.tileSize.w;
+        var resolution = this.map.getResolution();
+        var deltaLon = resolution * deltaX;
+
+        for (var i=0, len=this.grid.length; i<len; i++) {
+            var row = this.grid[i];
+            var modelTileIndex = (prepend) ? 0 : (row.length - 1);
+            var modelTile = row[modelTileIndex];
+            
+            var bounds = modelTile.bounds.clone();
+            var position = modelTile.position.clone();
+            bounds.left = bounds.left + deltaLon;
+            bounds.right = bounds.right + deltaLon;
+            position.x = position.x + deltaX;
+
+            var tile = prepend ? this.grid[i].pop() : this.grid[i].shift();
+            tile.moveTo(bounds, position);
+            if (prepend) {
+                row.unshift(tile);
+            } else {
+                row.push(tile);
+            }
+        }
+    },
+    
+    /**
+     * Method: removeExcessTiles
+     * When the size of the map or the buffer changes, we may need to
+     *     remove some excess rows and columns.
+     * 
+     * Parameters:
+     * rows - {Integer} Maximum number of rows we want our grid to have.
+     * colums - {Integer} Maximum number of columns we want our grid to have.
+     */
+    removeExcessTiles: function(rows, columns) {
+        
+        // remove extra rows
+        while (this.grid.length > rows) {
+            var row = this.grid.pop();
+            for (var i=0, l=row.length; i<l; i++) {
+                var tile = row[i];
+                this.removeTileMonitoringHooks(tile);
+                tile.destroy();
+            }
+        }
+        
+        // remove extra columns
+        while (this.grid[0].length > columns) {
+            for (var i=0, l=this.grid.length; i<l; i++) {
+                var row = this.grid[i];
+                var tile = row.pop();
+                this.removeTileMonitoringHooks(tile);
+                tile.destroy();
+            }
+        }
+    },
+
+    /**
+     * Method: onMapResize
+     * For singleTile layers, this will set a new tile size according to the
+     * dimensions of the map pane.
+     */
+    onMapResize: function() {
+        if (this.singleTile) {
+            this.clearGrid();
+            this.setTileSize();
+        }
+    },
+    
+    /**
+     * APIMethod: getTileBounds
+     * Returns The tile bounds for a layer given a pixel location.
+     *
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>} The location in the viewport.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} Bounds of the tile at the given pixel location.
+     */
+    getTileBounds: function(viewPortPx) {
+        var maxExtent = this.maxExtent;
+        var resolution = this.getResolution();
+        var tileMapWidth = resolution * this.tileSize.w;
+        var tileMapHeight = resolution * this.tileSize.h;
+        var mapPoint = this.getLonLatFromViewPortPx(viewPortPx);
+        var tileLeft = maxExtent.left + (tileMapWidth *
+                                         Math.floor((mapPoint.lon -
+                                                     maxExtent.left) /
+                                                    tileMapWidth));
+        var tileBottom = maxExtent.bottom + (tileMapHeight *
+                                             Math.floor((mapPoint.lat -
+                                                         maxExtent.bottom) /
+                                                        tileMapHeight));
+        return new OpenLayers.Bounds(tileLeft, tileBottom,
+                                     tileLeft + tileMapWidth,
+                                     tileBottom + tileMapHeight);
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.Grid"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMap.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMap.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/KaMap.js	(revision 76)
@@ -0,0 +1,206 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.KaMap
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.KaMap = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /** 
+     * APIProperty: isBaseLayer
+     * {Boolean} KaMap Layer is always a base layer 
+     */    
+    isBaseLayer: true,
+
+    /**
+     * APIProperty: units
+     * {?}
+     */    
+    units: null,
+
+    /**
+     * APIProperty: resolution
+     * {Float}
+     */
+    resolution: OpenLayers.DOTS_PER_INCH,
+    
+    /**
+     * Constant: DEFAULT_PARAMS
+     * {Object} parameters set by default. The default parameters set 
+     * the format via the 'i' parameter to 'jpeg'.    
+     */
+    DEFAULT_PARAMS: {
+        i: 'jpeg',
+        map: ''
+    },
+        
+    /**
+     * Constructor: OpenLayers.Layer.KaMap
+     * 
+     * Parameters:
+     * name - {String}
+     * url - {String}
+     * params - {Object} Parameters to be sent to the HTTP server in the
+     *    query string for the tile. The format can be set via the 'i'
+     *    parameter (defaults to jpg) , and the map should be set via 
+     *    the 'map' parameter. It has been reported that ka-Map may behave
+     *    inconsistently if your format parameter does not match the format
+     *    parameter configured in your config.php. (See ticket #327 for more
+     *    information.)
+     * options - {Object} Additional options for the layer. Any of the 
+     *     APIProperties listed on this layer, and any layer types it
+     *     extends, can be overridden through the options parameter. 
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = [];
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+        this.params = OpenLayers.Util.applyDefaults(
+            this.params, this.DEFAULT_PARAMS
+        );
+    },
+
+    /**
+     * Method: getURL
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * 
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the 
+     *          passed-in bounds and appropriate tile size specified as 
+     *          parameters
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        var mapRes = this.map.getResolution();
+        var scale = Math.round((this.map.getScale() * 10000)) / 10000;
+        var pX = Math.round(bounds.left / mapRes);
+        var pY = -Math.round(bounds.top / mapRes);
+        return this.getFullRequestString(
+                      { t: pY, 
+                        l: pX,
+                        s: scale
+                      });
+    },
+
+    /**
+     * Method: addTile
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>}
+     */    
+    addTile:function(bounds,position) {
+        var url = this.getURL(bounds);
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                             url, this.tileSize);
+    },
+
+    /** 
+     * Method: calculateGridLayout
+     * ka-Map uses the center point of the map as an origin for 
+     * its tiles. Override calculateGridLayout to center tiles 
+     * correctly for this case.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bound>}
+     * extent - {<OpenLayers.Bounds>}
+     * resolution - {Number}
+     *
+     * Returns:
+     * Object containing properties tilelon, tilelat, tileoffsetlat,
+     * tileoffsetlat, tileoffsetx, tileoffsety
+     */
+    calculateGridLayout: function(bounds, extent, resolution) {
+        var tilelon = resolution*this.tileSize.w;
+        var tilelat = resolution*this.tileSize.h;
+        
+        var offsetlon = bounds.left;
+        var tilecol = Math.floor(offsetlon/tilelon) - this.buffer;
+        var tilecolremain = offsetlon/tilelon - tilecol;
+        var tileoffsetx = -tilecolremain * this.tileSize.w;
+        var tileoffsetlon = tilecol * tilelon;
+        
+        var offsetlat = bounds.top;  
+        var tilerow = Math.ceil(offsetlat/tilelat) + this.buffer;
+        var tilerowremain = tilerow - offsetlat/tilelat;
+        var tileoffsety = -(tilerowremain+1) * this.tileSize.h;
+        var tileoffsetlat = tilerow * tilelat;
+        
+        return { 
+          tilelon: tilelon, tilelat: tilelat,
+          tileoffsetlon: tileoffsetlon, tileoffsetlat: tileoffsetlat,
+          tileoffsetx: tileoffsetx, tileoffsety: tileoffsety
+        };
+    },    
+
+    /**
+     * APIMethod: clone
+     * 
+     * Parameters: 
+     * obj - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.Kamap>} An exact clone of this OpenLayers.Layer.KaMap
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.KaMap(this.name,
+                                            this.url,
+                                            this.params,
+                                            this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+        if (this.tileSize != null) {
+            obj.tileSize = this.tileSize.clone();
+        }
+        
+        // we do not want to copy reference to grid, so we make a new array
+        obj.grid = [];
+
+        return obj;
+    },    
+    
+    /**
+     * APIMethod: getTileBounds
+     * Returns The tile bounds for a layer given a pixel location.
+     *
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>} The location in the viewport.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} Bounds of the tile at the given pixel location.
+     */
+    getTileBounds: function(viewPortPx) {
+        var resolution = this.getResolution();
+        var tileMapWidth = resolution * this.tileSize.w;
+        var tileMapHeight = resolution * this.tileSize.h;
+        var mapPoint = this.getLonLatFromViewPortPx(viewPortPx);
+        var tileLeft = tileMapWidth * Math.floor(mapPoint.lon / tileMapWidth);
+        var tileBottom = tileMapHeight * Math.floor(mapPoint.lat / tileMapHeight);
+        return new OpenLayers.Bounds(tileLeft, tileBottom,
+                                     tileLeft + tileMapWidth,
+                                     tileBottom + tileMapHeight);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.KaMap"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/XYZ.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/XYZ.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/XYZ.js	(revision 76)
@@ -0,0 +1,196 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/** 
+ * Class: OpenLayers.Layer.XYZ
+ * The XYZ class is designed to make it easier for people who have tiles
+ * arranged by a standard XYZ grid. 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.XYZ = OpenLayers.Class(OpenLayers.Layer.Grid, {
+    
+    /**
+     * APIProperty: isBaseLayer
+     * Default is true, as this is designed to be a base tile source. 
+     */
+    isBaseLayer: true,
+    
+    /**
+     * APIProperty: sphericalMecator
+     * Whether the tile extents should be set to the defaults for 
+     *    spherical mercator. Useful for things like OpenStreetMap.
+     *    Default is false, except for the OSM subclass.
+     */
+    sphericalMercator: false,
+
+    /**
+     * APIProperty: zoomOffset
+     * {Number} If your cache has more zoom levels than you want to provide
+     *     access to with this layer, supply a zoomOffset.  This zoom offset
+     *     is added to the current map zoom level to determine the level
+     *     for a requested tile.  For example, if you supply a zoomOffset
+     *     of 3, when the map is at the zoom 0, tiles will be requested from
+     *     level 3 of your cache.  Default is 0 (assumes cache level and map
+     *     zoom are equivalent).
+     */
+    zoomOffset: 0,
+    
+    /**
+     * Constructor: OpenLayers.Layer.XYZ
+     *
+     * Parameters:
+     * name - {String}
+     * url - {String}
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, options) {
+        if (options && options.sphericalMercator || this.sphericalMercator) {
+            options = OpenLayers.Util.extend({
+                maxExtent: new OpenLayers.Bounds(
+                    -128 * 156543.0339,
+                    -128 * 156543.0339,
+                    128 * 156543.0339,
+                    128 * 156543.0339
+                ),
+                maxResolution: 156543.0339,
+                numZoomLevels: 19,
+                units: "m",
+                projection: "EPSG:900913"
+            }, options);
+        }
+        url = url || this.url;
+        name = name || this.name;
+        var newArguments = [name, url, {}, options];
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+    },
+    
+    /**
+     * APIMethod: clone
+     * Create a clone of this layer
+     *
+     * Parameters:
+     * obj - {Object} Is this ever used?
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.XYZ>} An exact clone of this OpenLayers.Layer.XYZ
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.XYZ(this.name,
+                                            this.url,
+                                            this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        return obj;
+    },    
+
+    /**
+     * Method: getUrl
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the
+     *          passed-in bounds and appropriate tile size specified as
+     *          parameters
+     */
+    getURL: function (bounds) {
+        var res = this.map.getResolution();
+        var x = Math.round((bounds.left - this.maxExtent.left) 
+            / (res * this.tileSize.w));
+        var y = Math.round((this.maxExtent.top - bounds.top) 
+            / (res * this.tileSize.h));
+        var z = this.map.getZoom() + this.zoomOffset;
+
+        var url = this.url;
+        var s = '' + x + y + z;
+        if (url instanceof Array)
+        {
+            url = this.selectUrl(s, url);
+        }
+        
+        var path = OpenLayers.String.format(url, {'x': x, 'y': y, 'z': z});
+
+        return path;
+    },
+    
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+     
+    /* APIMethod: setMap
+     * When the layer is added to a map, then we can fetch our origin 
+     *    (if we don't have one.) 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.Grid.prototype.setMap.apply(this, arguments);
+        if (!this.tileOrigin) { 
+            this.tileOrigin = new OpenLayers.LonLat(this.maxExtent.left,
+                                                this.maxExtent.bottom);
+        }                                       
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.XYZ"
+});
+
+
+/**
+ * Class: OpenLayers.Layer.OSM
+ * A class to access OpenStreetMap tiles. By default, uses the OpenStreetMap
+ *    hosted tile.openstreetmap.org 'Mapnik' tileset. If you wish to use
+ *    tiles@home / osmarender layer instead, you can pass a layer like:
+ * 
+ * (code)
+ *     new OpenLayers.Layer.OSM("t@h", 
+ *       "http://tah.openstreetmap.org/Tiles/tile/${z}/${x}/${y}.png"); 
+ * (end)
+ *
+ * This layer defaults to Spherical Mercator.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.XYZ>
+ */
+OpenLayers.Layer.OSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
+     name: "OpenStreetMap",
+     attribution: "Data CC-By-SA by <a href='http://openstreetmap.org/'>OpenStreetMap</a>",
+     sphericalMercator: true,
+     url: 'http://tile.openstreetmap.org/${z}/${x}/${y}.png',
+     clone: function(obj) {
+         if (obj == null) {
+             obj = new OpenLayers.Layer.OSM(
+                 this.name, this.url, this.getOptions());
+         }
+         obj = OpenLayers.Layer.XYZ.prototype.clone.apply(this, [obj]);
+         return obj;
+     },
+     CLASS_NAME: "OpenLayers.Layer.OSM"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMTS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMTS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMTS.js	(revision 76)
@@ -0,0 +1,476 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WMTS
+ * Instances of the WMTS class allow viewing of tiles from a service that 
+ *     implements the OGC WMTS specification version 1.0.0.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.WMTS = OpenLayers.Class(OpenLayers.Layer.Grid, {
+    
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} The layer will be considered a base layer.  Default is true.
+     */
+    isBaseLayer: true,
+
+    /**
+     * Property: version
+     * {String} WMTS version.  Default is "1.0.0".
+     */
+    version: "1.0.0",
+    
+    /**
+     * APIProperty: requestEncoding
+     * {String} Request encoding.  Can be "REST" or "KVP".  Default is "KVP".
+     */
+    requestEncoding: "KVP",
+    
+    /**
+     * APIProperty: url
+     * {String} The base URL for the WMTS service.  Must be provided.
+     */
+    url: null,
+
+    /**
+     * APIProperty: layer
+     * {String} The layer identifier advertised by the WMTS service.  Must be 
+     *     provided.
+     */
+    layer: null,
+    
+    /** 
+     * APIProperty: matrixSet
+     * {String} One of the advertised matrix set identifiers.  Must be provided.
+     */
+    matrixSet: null,
+
+    /** 
+     * APIProperty: style
+     * {String} One of the advertised layer styles.  Must be provided.
+     */
+    style: null,
+    
+    /** 
+     * APIProperty: format
+     * {String} The image MIME type.  Default is "image/jpeg".
+     */
+    format: "image/jpeg",
+    
+    /**
+     * APIProperty: tileOrigin
+     * {<OpenLayers.LonLat>} The top-left corner of the tile matrix in map 
+     *     units.  If the tile origin for each matrix in a set is different,
+     *     the <matrixIds> should include a topLeftCorner property.  If
+     *     not provided, the tile origin will default to the top left corner
+     *     of the layer <maxExtent>.
+     */
+    tileOrigin: null,
+    
+    /**
+     * APIProperty: tileFullExtent
+     * {<OpenLayers.Bounds>}  The full extent of the tile set.  If not supplied,
+     *     the layer's <maxExtent> property will be used.
+     */
+    tileFullExtent: null,
+
+    /**
+     * APIProperty: formatSuffix
+     * {String} For REST request encoding, an image format suffix must be 
+     *     included in the request.  If not provided, the suffix will be derived
+     *     from the <format> property.
+     */
+    formatSuffix: null,    
+
+    /**
+     * APIProperty: matrixIds
+     * {Array} A list of tile matrix identifiers.  If not provided, the matrix
+     *     identifiers will be assumed to be integers corresponding to the 
+     *     map zoom level.  If a list of strings is provided, each item should
+     *     be the matrix identifier that corresponds to the map zoom level.
+     *     Additionally, a list of objects can be provided.  Each object should
+     *     describe the matrix as presented in the WMTS capabilities.  These
+     *     objects should have the propertes shown below.
+     * 
+     * Matrix properties:
+     * identifier - {String} The matrix identifier (required).
+     * topLeftCorner - {<OpenLayers.LonLat>} The top left corner of the 
+     *     matrix.  Must be provided if different than the layer <tileOrigin>.
+     * tileWidth - {Number} The tile width for the matrix.  Must be provided 
+     *     if different than the width given in the layer <tileSize>.
+     * tileHeight - {Number} The tile height for the matrix.  Must be provided 
+     *     if different than the height given in the layer <tileSize>.
+     */
+    matrixIds: null,
+    
+    /**
+     * APIProperty: dimensions
+     * {Array} For RESTful request encoding, extra dimensions may be specified.
+     *     Items in this list should be property names in the <params> object.
+     *     Values of extra dimensions will be determined from the corresponding
+     *     values in the <params> object.
+     */
+    dimensions: null,
+    
+    /**
+     * APIProperty: params
+     * {Object} Extra parameters to include in tile requests.  For KVP 
+     *     <requestEncoding>, these properties will be encoded in the request 
+     *     query string.  For REST <requestEncoding>, these properties will
+     *     become part of the request path, with order determined by the 
+     *     <dimensions> list.
+     */
+    params: null,
+    
+    /**
+     * APIProperty: zoomOffset
+     * {Number} If your cache has more levels than you want to provide
+     *     access to with this layer, supply a zoomOffset.  This zoom offset
+     *     is added to the current map zoom level to determine the level
+     *     for a requested tile.  For example, if you supply a zoomOffset
+     *     of 3, when the map is at the zoom 0, tiles will be requested from
+     *     level 3 of your cache.  Default is 0 (assumes cache level and map
+     *     zoom are equivalent).  Additionally, if this layer is to be used
+     *     as an overlay and the cache has fewer zoom levels than the base
+     *     layer, you can supply a negative zoomOffset.  For example, if a
+     *     map zoom level of 1 corresponds to your cache level zero, you would
+     *     supply a -1 zoomOffset (and set the maxResolution of the layer
+     *     appropriately).  The zoomOffset value has no effect if complete
+     *     matrix definitions (including scaleDenominator) are supplied in
+     *     the <matrixIds> property.  Defaults to 0 (no zoom offset).
+     */
+    zoomOffset: 0,
+    
+    /**
+     * Property: formatSuffixMap
+     * {Object} a map between WMTS 'format' request parameter and tile image file suffix
+     */
+    formatSuffixMap: {
+        "image/png": "png",
+        "image/png8": "png",
+        "image/png24": "png",
+        "image/png32": "png",
+        "png": "png",
+        "image/jpeg": "jpg",
+        "image/jpg": "jpg",
+        "jpeg": "jpg",
+        "jpg": "jpg"
+    },
+    
+    /**
+     * Property: matrix
+     * {Object} Matrix definition for the current map resolution.  Updated by
+     *     the <updateMatrixProperties> method.
+     */
+    matrix: null,
+    
+    /**
+     * Constructor: OpenLayers.Layer.WMTS
+     * Create a new WMTS layer.
+     *
+     * Example:
+     * (code)
+     * var wmts = new OpenLayers.Layer.WMTS({
+     *     name: "My WMTS Layer",
+     *     url: "http://example.com/wmts", 
+     *     layer: "layer_id",
+     *     style: "default",
+     *     matrixSet: "matrix_id"
+     * });
+     * (end)
+     *
+     * Parameters:
+     * config - {Object} Configuration properties for the layer.
+     *
+     * Required configuration properties:
+     * url - {String} The base url for the service.  See the <url> property.
+     * layer - {String} The layer identifier.  See the <layer> property.
+     * style - {String} The layer style identifier.  See the <style> property.
+     * matrixSet - {String} The tile matrix set identifier.  See the <matrixSet>
+     *     property.
+     *
+     * Any other documented layer properties can be provided in the config object.
+     */
+    initialize: function(config) {
+
+        // confirm required properties are supplied
+        var required = {
+            url: true,
+            layer: true,
+            style: true,
+            matrixSet: true
+        };
+        for (var prop in required) {
+            if (!(prop in config)) {
+                throw new Error("Missing property '" + prop + "' in layer configuration.");
+            }
+        }
+
+        config.params = OpenLayers.Util.upperCaseObject(config.params);
+        var args = [config.name, config.url, config.params, config];
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, args);
+        
+
+        // determine format suffix (for REST)
+        if (!this.formatSuffix) {
+            this.formatSuffix = this.formatSuffixMap[this.format] || this.format.split("/").pop();            
+        }
+
+        // expand matrixIds (may be array of string or array of object)
+        if (this.matrixIds) {
+            var len = this.matrixIds.length;
+            if (len && typeof this.matrixIds[0] === "string") {
+                var ids = this.matrixIds;
+                this.matrixIds = new Array(len);
+                for (var i=0; i<len; ++i) {
+                    this.matrixIds[i] = {identifier: ids[i]};
+                }
+            }
+        }
+
+    },
+    
+    /**
+     * Method: setMap
+     */
+    setMap: function() {
+        OpenLayers.Layer.Grid.prototype.setMap.apply(this, arguments);
+        this.updateMatrixProperties();
+    },
+    
+    /**
+     * Method: updateMatrixProperties
+     * Called when map resolution changes to update matrix related properties.
+     */
+    updateMatrixProperties: function() {
+        this.matrix = this.getMatrix();
+        if (this.matrix) {
+            if (this.matrix.topLeftCorner) {
+                this.tileOrigin = this.matrix.topLeftCorner;
+            }
+            if (this.matrix.tileWidth && this.matrix.tileHeight) {
+                this.tileSize = new OpenLayers.Size(
+                    this.matrix.tileWidth, this.matrix.tileHeight
+                );
+            }
+            if (!this.tileOrigin) { 
+                this.tileOrigin = new OpenLayers.LonLat(
+                    this.maxExtent.left, this.maxExtent.top
+                );
+            }   
+            if (!this.tileFullExtent) { 
+                this.tileFullExtent = this.maxExtent;
+            }
+        }
+    },
+    
+    /**
+     * Method: moveTo
+     * 
+     * Parameters:
+     * bound - {<OpenLayers.Bounds>}
+     * zoomChanged - {Boolean} Tells when zoom has changed, as layers have to
+     *     do some init work in that case.
+     * dragging - {Boolean}
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        if (zoomChanged || !this.matrix) {
+            this.updateMatrixProperties();
+        }
+        return OpenLayers.Layer.Grid.prototype.moveTo.apply(this, arguments);
+    },
+
+    /**
+     * APIMethod: clone
+     * 
+     * Parameters:
+     * obj - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.WMTS>} An exact clone of this <OpenLayers.Layer.WMTS>
+     */
+    clone: function(obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Layer.WMTS(this.options);
+        }
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+        // copy/set any non-init, non-simple values here
+        return obj;
+    },
+    
+    /**
+     * Method: getMatrix
+     * Get the appropriate matrix definition for the current map resolution.
+     */
+    getMatrix: function() {
+        var matrix;
+        if (!this.matrixIds || this.matrixIds.length === 0) {
+            matrix = {identifier: this.map.getZoom() + this.zoomOffset};
+        } else {
+            // get appropriate matrix given the map scale if possible
+            if ("scaleDenominator" in this.matrixIds[0]) {
+                // scale denominator calculation based on WMTS spec
+                var denom = 
+                    OpenLayers.METERS_PER_INCH * 
+                    OpenLayers.INCHES_PER_UNIT[this.units] * 
+                    this.map.getResolution() / 0.28E-3;
+                var diff = Number.POSITIVE_INFINITY;
+                var delta;
+                for (var i=0, ii=this.matrixIds.length; i<ii; ++i) {
+                    delta = Math.abs(1 - (this.matrixIds[i].scaleDenominator / denom));
+                    if (delta < diff) {
+                        diff = delta;
+                        matrix = this.matrixIds[i];
+                    }
+                }
+            } else {
+                // fall back on zoom as index
+                matrix = this.matrixIds[this.map.getZoom() + this.zoomOffset];
+            }
+        }
+        return matrix;
+    },
+    
+    /** 
+     * Method: getTileInfo
+     * Get tile information for a given location at the current map resolution.
+     *
+     * Parameters:
+     * loc - {<OpenLayers.LonLat} A location in map coordinates.
+     *
+     * Returns:
+     * {Object} An object with "col", "row", "i", and "j" properties.  The col
+     *     and row values are zero based tile indexes from the top left.  The
+     *     i and j values are the number of pixels to the left and top 
+     *     (respectively) of the given location within the target tile.
+     */
+    getTileInfo: function(loc) {
+        var res = this.map.getResolution();
+        
+        var fx = (loc.lon - this.tileOrigin.lon) / (res * this.tileSize.w);
+        var fy = (this.tileOrigin.lat - loc.lat) / (res * this.tileSize.h);
+
+        var col = Math.floor(fx);
+        var row = Math.floor(fy);
+        
+        return {
+            col: col, 
+            row: row,
+            i: Math.floor((fx - col) * this.tileSize.w),
+            j: Math.floor((fy - row) * this.tileSize.h)
+        };
+    },
+    
+    /**
+     * Method: getURL
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * 
+     * Returns:
+     * {String} A URL for the tile corresponding to the given bounds.
+     */
+    getURL: function(bounds) {
+        bounds = this.adjustBounds(bounds);
+        var url = "";
+        if (!this.tileFullExtent || this.tileFullExtent.intersectsBounds(bounds)) {            
+
+            var center = bounds.getCenterLonLat();            
+            var info = this.getTileInfo(center);
+            var matrixId = this.matrix.identifier;
+
+            if (this.requestEncoding.toUpperCase() === "REST") {
+
+                // include 'version', 'layer' and 'style' in tile resource url
+                var path = this.version + "/" + this.layer + "/" + this.style + "/";
+
+                // append optional dimension path elements
+                if (this.dimensions) {
+                    for (var i=0; i<this.dimensions.length; i++) {
+                        if (this.params[this.dimensions[i]]) {
+                            path = path + this.params[this.dimensions[i]] + "/";
+                        }
+                    }
+                }
+
+                // append other required path elements
+                path = path + this.matrixSet + "/" + this.matrix.identifier + 
+                    "/" + info.row + "/" + info.col + "." + this.formatSuffix;
+                
+                if (this.url instanceof Array) {
+                    url = this.selectUrl(path, this.url);
+                } else {
+                    url = this.url;
+                }
+                if (!url.match(/\/$/)) {
+                    url = url + "/";
+                }
+                url = url + path;
+
+            } else if (this.requestEncoding.toUpperCase() === "KVP") {
+
+                // assemble all required parameters
+                var params = {
+                    SERVICE: "WMTS",
+                    REQUEST: "GetTile",
+                    VERSION: this.version,
+                    LAYER: this.layer,
+                    STYLE: this.style,
+                    TILEMATRIXSET: this.matrixSet,
+                    TILEMATRIX: this.matrix.identifier,
+                    TILEROW: info.row,
+                    TILECOL: info.col,
+                    FORMAT: this.format
+                };
+                url = OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(this, [params]);
+
+            }
+        }
+        return url;    
+    },
+    
+    /**
+     * APIMethod: mergeNewParams
+     * Extend the existing layer <params> with new properties.  Tiles will be
+     *     reloaded with updated params in the request.
+     * 
+     * Parameters:
+     * newParams - {Object} Properties to extend to existing <params>.
+     */
+    mergeNewParams: function(newParams) {
+        if (this.requestEncoding.toUpperCase() === "KVP") {
+            return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(
+                this, [OpenLayers.Util.upperCaseObject(newParams)]
+            );
+        }
+    },
+
+    /**
+     * Method: addTile
+     * Create a tile, initialize it, and add it to the layer div. 
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile: function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.WMTS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapGuide.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapGuide.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapGuide.js	(revision 76)
@@ -0,0 +1,489 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.MapGuide
+ * Instances of OpenLayers.Layer.MapGuide are used to display
+ * data from a MapGuide OS instance.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.MapGuide = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /** 
+     * APIProperty: isBaseLayer
+     * {Boolean} Treat this layer as a base layer.  Default is true.
+     **/
+    isBaseLayer: true,
+    
+    /**
+     * APIProperty: useHttpTile
+     * {Boolean} use a tile cache exposed directly via a webserver rather than the 
+	   *    via mapguide server. This does require extra configuration on the Mapguide Server,
+	   *    and will only work when singleTile is false. The url for the layer must be set to the
+	   *    webserver path rather than the Mapguide mapagent.	  
+	   *    See http://trac.osgeo.org/mapguide/wiki/CodeSamples/Tiles/ServingTilesViaHttp 
+     **/
+    useHttpTile: false,
+    
+    /** 
+     * APIProperty: singleTile
+     * {Boolean} use tile server or request single tile image. 
+     **/
+    singleTile: false,
+    
+    /** 
+     * APIProperty: useOverlay
+     * {Boolean} flag to indicate if the layer should be retrieved using
+     * GETMAPIMAGE (default) or using GETDYNAMICOVERLAY requests.
+     **/
+    useOverlay: false,
+    
+    /** 
+     * APIProperty: useAsyncOverlay
+     * {Boolean} indicates if the MapGuide site supports the asynchronous 
+     * GETDYNAMICOVERLAY requests which is available in MapGuide Enterprise 2010
+     * and MapGuide Open Source v2.0.3 or higher. The newer versions of MG 
+     * is called asynchronously, allows selections to be drawn separately from 
+     * the map and offers styling options.
+     * 
+     * With older versions of MapGuide, set useAsyncOverlay=false.  Note that in
+     * this case a synchronous AJAX call is issued and the mapname and session
+     * parameters must be used to initialize the layer, not the mapdefinition
+     * parameter. Also note that this will issue a synchronous AJAX request 
+     * before the image request can be issued so the users browser may lock
+     * up if the MG Web tier does not respond in a timely fashion.
+     **/
+    useAsyncOverlay: true,
+    
+    /**
+     * Constant: TILE_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs for tiled layer
+     */
+    TILE_PARAMS: {
+         operation: 'GETTILEIMAGE',
+         version: '1.2.0'
+    },
+
+    /**
+     * Constant: SINGLE_TILE_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs for untiled layer
+     */
+    SINGLE_TILE_PARAMS: {
+        operation: 'GETMAPIMAGE',
+        format: 'PNG',
+        locale: 'en',
+        clip: '1',
+        version: '1.0.0'
+    },
+    
+    /**
+     * Constant: OVERLAY_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs for untiled layer
+     */
+    OVERLAY_PARAMS: {
+        operation: 'GETDYNAMICMAPOVERLAYIMAGE',
+        format: 'PNG',
+        locale: 'en',
+        clip: '1',
+        version: '2.0.0'
+    },
+    
+    /** 
+     * Constant: FOLDER_PARAMS
+     * {Object} Hashtable of parameter key/value pairs which describe 
+     * the folder structure for tiles as configured in the mapguide 
+     * serverconfig.ini section [TileServiceProperties]
+     */
+    FOLDER_PARAMS: {
+        tileColumnsPerFolder: 30,
+        tileRowsPerFolder: 30,
+        format: 'png',
+        querystring: null
+    },	
+
+    /** 
+     * Property: defaultSize
+     * {<OpenLayers.Size>} Tile size as produced by MapGuide server
+     **/
+    defaultSize: new OpenLayers.Size(300,300),
+
+    /**
+     * Constructor: OpenLayers.Layer.MapGuide
+     * Create a new Mapguide layer, either tiled or untiled.  
+     *
+     * For tiled layers, the 'groupName' and 'mapDefinition' values 
+     * must be specified as parameters in the constructor.
+     *
+     * For untiled base layers, specify either combination of 'mapName' and
+     * 'session', or 'mapDefinition' and 'locale'.  
+     *
+     * For older versions of MapGuide and overlay layers, set useAsyncOverlay 
+     * to false and in this case mapName and session are required parameters 
+     * for the constructor.
+     *
+     * NOTE: MapGuide OS uses a DPI value and degrees to meters conversion 
+     * factor that are different than the defaults used in OpenLayers, 
+     * so these must be adjusted accordingly in your application.  
+     * See the MapGuide example for how to set these values for MGOS.
+     *
+     * Parameters:
+     * name - {String} Name of the layer displayed in the interface
+     * url - {String} Location of the MapGuide mapagent executable
+     *            (e.g. http://localhost:8008/mapguide/mapagent/mapagent.fcgi)
+     * params - {Object} hashtable of additional parameters to use. Some
+     *     parameters may require additional code on the server. The ones that
+     *     you may want to use are: 
+     *   - mapDefinition - {String} The MapGuide resource definition
+     *            (e.g. Library://Samples/Gmap/Maps/gmapTiled.MapDefinition)
+     *   - locale - Locale setting 
+     *            (for untiled overlays layers only)
+     *   - mapName - {String} Name of the map as stored in the MapGuide session.
+     *          (for untiled layers with a session parameter only)
+     *   - session - { String} MapGuide session ID 
+     *            (for untiled overlays layers only)
+     *   - basemaplayergroupname - {String} GroupName for tiled MapGuide layers only
+     *   - format - Image format to be returned (for untiled overlay layers only)
+     *   - showLayers - {String} A comma separated list of GUID's for the
+     *       layers to display eg: 'cvc-xcv34,453-345-345sdf'.
+     *   - hideLayers - {String} A comma separated list of GUID's for the
+     *       layers to hide eg: 'cvc-xcv34,453-345-345sdf'.
+     *   - showGroups - {String} A comma separated list of GUID's for the
+     *       groups to display eg: 'cvc-xcv34,453-345-345sdf'.
+     *   - hideGroups - {String} A comma separated list of GUID's for the
+     *       groups to hide eg: 'cvc-xcv34,453-345-345sdf'
+     *   - selectionXml - {String} A selection xml string Some server plumbing
+     *       is required to read such a value.
+     * options - {Ojbect} Hashtable of extra options to tag onto the layer; 
+     *          will vary depending if tiled or untiled maps are being requested
+     */
+    initialize: function(name, url, params, options) {
+        
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, arguments);
+        
+        // unless explicitly set in options, if the layer is transparent, 
+        // it will be an overlay
+        if (options == null || options.isBaseLayer == null) {
+            this.isBaseLayer = ((this.transparent != "true") && 
+                                (this.transparent != true));
+        }
+
+        if (options && options.useOverlay!=null) {
+          this.useOverlay = options.useOverlay;
+        }
+        
+        //initialize for untiled layers
+        if (this.singleTile) {
+          if (this.useOverlay) {
+            OpenLayers.Util.applyDefaults(
+                           this.params,
+                           this.OVERLAY_PARAMS
+                           );
+            if (!this.useAsyncOverlay) {
+              this.params.version = "1.0.0";
+            }
+          } else {
+            OpenLayers.Util.applyDefaults(
+                           this.params,
+                           this.SINGLE_TILE_PARAMS
+                           );
+          }         
+        } else {
+            //initialize for tiled layers
+            if (this.useHttpTile) {
+                OpenLayers.Util.applyDefaults(
+                               this.params,
+                               this.FOLDER_PARAMS
+                               );
+            } else {
+                OpenLayers.Util.applyDefaults(
+                               this.params,
+                               this.TILE_PARAMS
+                               );
+            }
+            this.setTileSize(this.defaultSize); 
+        }
+    },
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.MapGuide>} An exact clone of this layer
+     */
+    clone: function (obj) {
+      if (obj == null) {
+            obj = new OpenLayers.Layer.MapGuide(this.name,
+                                           this.url,
+                                           this.params,
+                                           this.getOptions());
+      }
+      //get all additions from superclasses
+      obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+      return obj;
+    },
+
+    /**
+     * Method: addTile
+     * Creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+
+    /**
+     * Method: getURL
+     * Return a query string for this layer
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox 
+     *                                for the request
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also 
+     *          the passed-in bounds and appropriate tile size specified 
+     *          as parameters.
+     */
+    getURL: function (bounds) {
+        var url;
+        var center = bounds.getCenterLonLat();
+        var mapSize = this.map.getSize();
+
+        if (this.singleTile) {
+          //set up the call for GETMAPIMAGE or GETDYNAMICMAPOVERLAY with
+          //dynamic map parameters
+          var params = {
+            setdisplaydpi: OpenLayers.DOTS_PER_INCH,
+            setdisplayheight: mapSize.h*this.ratio,
+            setdisplaywidth: mapSize.w*this.ratio,
+            setviewcenterx: center.lon,
+            setviewcentery: center.lat,
+            setviewscale: this.map.getScale()
+          };
+          
+          if (this.useOverlay && !this.useAsyncOverlay) {
+            //first we need to call GETVISIBLEMAPEXTENT to set the extent
+            var getVisParams = {};
+            getVisParams = OpenLayers.Util.extend(getVisParams, params);
+            getVisParams.operation = "GETVISIBLEMAPEXTENT";
+            getVisParams.version = "1.0.0";
+            getVisParams.session = this.params.session;
+            getVisParams.mapName = this.params.mapName;
+            getVisParams.format = 'text/xml';
+            url = this.getFullRequestString( getVisParams );
+            
+            OpenLayers.Request.GET({url: url, async: false});
+          }
+          //construct the full URL
+          url = this.getFullRequestString( params );
+        } else {
+
+          //tiled version
+          var currentRes = this.map.getResolution();
+          var colidx = Math.floor((bounds.left-this.maxExtent.left)/currentRes);
+          colidx = Math.round(colidx/this.tileSize.w);
+          var rowidx = Math.floor((this.maxExtent.top-bounds.top)/currentRes);
+          rowidx = Math.round(rowidx/this.tileSize.h);
+
+          if (this.useHttpTile){
+	          url = this.getImageFilePath(
+                   {
+                       tilecol: colidx,
+                       tilerow: rowidx,
+                       scaleindex: this.resolutions.length - this.map.zoom - 1
+                    });
+		  
+          } else {
+            url = this.getFullRequestString(
+                   {
+                       tilecol: colidx,
+                       tilerow: rowidx,
+                       scaleindex: this.resolutions.length - this.map.zoom - 1
+                    });
+          }
+       }
+       return url;
+    },
+
+    /**
+     * Method: getFullRequestString
+     * getFullRequestString on MapGuide layers is special, because we 
+     * do a regular expression replace on ',' in parameters to '+'.
+     * This is why it is subclassed here.
+     *
+     * Parameters:
+     * altUrl - {String} Alternative base URL to use.
+     *
+     * Returns:
+     * {String} A string with the layer's url appropriately encoded for MapGuide
+     */
+    getFullRequestString:function(newParams, altUrl) {
+        // use layer's url unless altUrl passed in
+        var url = (altUrl == null) ? this.url : altUrl;
+        
+        // if url is not a string, it should be an array of strings, 
+        //  in which case we will randomly select one of them in order
+        //  to evenly distribute requests to different urls.
+        if (typeof url == "object") {
+            url = url[Math.floor(Math.random()*url.length)];
+        }   
+        // requestString always starts with url
+        var requestString = url;        
+
+        // create a new params hashtable with all the layer params and the 
+        // new params together. then convert to string
+        var allParams = OpenLayers.Util.extend({}, this.params);
+        allParams = OpenLayers.Util.extend(allParams, newParams);
+        // ignore parameters that are already in the url search string
+        var urlParams = OpenLayers.Util.upperCaseObject(
+                            OpenLayers.Util.getParameters(url));
+        for(var key in allParams) {
+            if(key.toUpperCase() in urlParams) {
+                delete allParams[key];
+            }
+        }
+        var paramsString = OpenLayers.Util.getParameterString(allParams);
+        
+        /* MapGuide needs '+' seperating things like bounds/height/width.
+           Since typically this is URL encoded, we use a slight hack: we
+           depend on the list-like functionality of getParameterString to
+           leave ',' only in the case of list items (since otherwise it is
+           encoded) then do a regular expression replace on the , characters
+           to '+' */
+        paramsString = paramsString.replace(/,/g, "+");
+        
+        if (paramsString != "") {
+            var lastServerChar = url.charAt(url.length - 1);
+            if ((lastServerChar == "&") || (lastServerChar == "?")) {
+                requestString += paramsString;
+            } else {
+                if (url.indexOf('?') == -1) {
+                    //serverPath has no ? -- add one
+                    requestString += '?' + paramsString;
+                } else {
+                    //serverPath contains ?, so must already have paramsString at the end
+                    requestString += '&' + paramsString;
+                }
+            }
+        }
+        return requestString;
+    },
+
+     /** 
+     * Method: getImageFilePath
+     * special handler to request mapguide tiles from an http exposed tilecache 
+     *
+     * Parameters:
+     * altUrl - {String} Alternative base URL to use.
+     *
+     * Returns:
+     * {String} A string with the url for the tile image
+     */
+    getImageFilePath:function(newParams, altUrl) {
+        // use layer's url unless altUrl passed in
+        var url = (altUrl == null) ? this.url : altUrl;
+        
+        // if url is not a string, it should be an array of strings, 
+        //  in which case we will randomly select one of them in order
+        //  to evenly distribute requests to different urls.
+        if (typeof url == "object") {
+            url = url[Math.floor(Math.random()*url.length)];
+        }   
+        // requestString always starts with url
+        var requestString = url;        
+
+        var tileRowGroup = "";
+        var tileColGroup = "";
+        
+        if (newParams.tilerow < 0) {
+          tileRowGroup =  '-';
+        }
+          
+        if (newParams.tilerow == 0 ) {
+          tileRowGroup += '0';
+        } else {
+          tileRowGroup += Math.floor(Math.abs(newParams.tilerow/this.params.tileRowsPerFolder)) * this.params.tileRowsPerFolder;
+        }
+          
+        if (newParams.tilecol < 0) {
+          tileColGroup =  '-';
+        }
+        
+        if (newParams.tilecol == 0) {
+          tileColGroup += '0';
+        } else {
+          tileColGroup += Math.floor(Math.abs(newParams.tilecol/this.params.tileColumnsPerFolder)) * this.params.tileColumnsPerFolder;
+        }					
+        
+        var tilePath = '/S' + Math.floor(newParams.scaleindex)
+                + '/' + this.params.basemaplayergroupname
+                + '/R' + tileRowGroup
+                + '/C' + tileColGroup
+                + '/' + (newParams.tilerow % this.params.tileRowsPerFolder) 
+                + '_' + (newParams.tilecol % this.params.tileColumnsPerFolder) 
+                + '.' + this.params.format;
+    
+        if (this.params.querystring) {
+               tilePath += "?" + this.params.querystring;
+        }
+        
+        requestString += tilePath;
+        return requestString;
+    },
+    
+    /** 
+     * Method: calculateGridLayout
+     * Generate parameters for the grid layout. This  
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bound>}
+     * extent - {<OpenLayers.Bounds>}
+     * resolution - {Number}
+     *
+     * Returns:
+     * Object containing properties tilelon, tilelat, tileoffsetlat,
+     * tileoffsetlat, tileoffsetx, tileoffsety
+     */
+    calculateGridLayout: function(bounds, extent, resolution) {
+        var tilelon = resolution * this.tileSize.w;
+        var tilelat = resolution * this.tileSize.h;
+        
+        var offsetlon = bounds.left - extent.left;
+        var tilecol = Math.floor(offsetlon/tilelon) - this.buffer;
+        var tilecolremain = offsetlon/tilelon - tilecol;
+        var tileoffsetx = -tilecolremain * this.tileSize.w;
+        var tileoffsetlon = extent.left + tilecol * tilelon;
+        
+        var offsetlat = extent.top - bounds.top + tilelat; 
+        var tilerow = Math.floor(offsetlat/tilelat) - this.buffer;
+        var tilerowremain = tilerow - offsetlat/tilelat;
+        var tileoffsety = tilerowremain * this.tileSize.h;
+        var tileoffsetlat = extent.top - tilelat*tilerow;
+        
+        return { 
+          tilelon: tilelon, tilelat: tilelat,
+          tileoffsetlon: tileoffsetlon, tileoffsetlat: tileoffsetlat,
+          tileoffsetx: tileoffsetx, tileoffsety: tileoffsety
+        };
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.MapGuide"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Untiled.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Untiled.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Untiled.js	(revision 76)
@@ -0,0 +1,72 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+ 
+/**
+ * @requires OpenLayers/Layer/WMS.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WMS.Untiled
+ * *Deprecated*.  To be removed in 3.0.  Instead use OpenLayers.Layer.WMS and 
+ *     pass the option 'singleTile' as true.
+ * 
+ * Inherits from: 
+ *  - <OpenLayers.Layer.WMS>
+ */
+OpenLayers.Layer.WMS.Untiled = OpenLayers.Class(OpenLayers.Layer.WMS, {
+
+    /**
+     * APIProperty: singleTile
+     * {singleTile} Always true for untiled.
+     */
+    singleTile: true,
+
+    /**
+     * Constructor: OpenLayers.Layer.WMS.Untiled
+     *
+     * Parameters:
+     * name - {String} 
+     * url - {String} 
+     * params - {Object} 
+     * options - {Object} 
+     */
+    initialize: function(name, url, params, options) {
+        OpenLayers.Layer.WMS.prototype.initialize.apply(this, arguments);
+        
+        var msg = "The OpenLayers.Layer.WMS.Untiled class is deprecated and " +
+                  "will be removed in 3.0. Instead, you should use the " +
+                  "normal OpenLayers.Layer.WMS class, passing it the option " +
+                  "'singleTile' as true.";
+        OpenLayers.Console.warn(msg);
+    },    
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.WMS.Untiled>} An exact clone of this layer
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.WMS.Untiled(this.name,
+                                                   this.url,
+                                                   this.params,
+                                                   this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.WMS.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    }, 
+
+    CLASS_NAME: "OpenLayers.Layer.WMS.Untiled"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Post.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Post.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WMS/Post.js	(revision 76)
@@ -0,0 +1,99 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+ 
+/**
+ * @requires OpenLayers/Layer/WMS.js
+ * @requires OpenLayers/Tile/Image/IFrame.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WMS.Post
+ * Instances of OpenLayers.Layer.WMS.Post are used to retrieve data from OGC
+ * Web Mapping Services via HTTP-POST (application/x-www-form-urlencoded). 
+ * Create a new WMS layer with the <OpenLayers.Layer.WMS.Post> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.WMS>
+ */
+OpenLayers.Layer.WMS.Post = OpenLayers.Class(OpenLayers.Layer.WMS, {
+
+    /**
+     * Property: tileClass
+     * {Object} Class, used to create tiles.
+     */
+    tileClass: null,
+
+    /**
+     * APIProperty: unsupportedBrowsers
+     * {Array} Array with browsers, which should use the HTTP-GET protocol 
+     * instead of HTTP-POST for fetching tiles from a WMS .
+     * Defaults to ["mozilla", "firefox", "opera"], because Opera is not able 
+     * to show transparent images in IFrames and Firefox/Mozilla has some ugly 
+     * effects of viewport-shaking when panning the map. Both browsers, Opera
+     * and Firefox/Mozilla, have no problem with long urls, which is the reason
+     * for using POST instead of GET. The strings to pass to this array are
+     * the ones returned by <OpenLayers.Util.getBrowserName()>.
+     */
+    unsupportedBrowsers: ["mozilla", "firefox", "opera"],
+
+    /**
+     * Property: SUPPORTED_TRANSITIONS
+     * {Array} 
+     * no supported transitions for this type of layer, because it is not
+     * possible to modify the initialized tiles (iframes)
+     */
+    SUPPORTED_TRANSITIONS: [],
+
+    /**
+     * Constructor: OpenLayers.Layer.WMS.Post
+     * Creates a new WMS layer object.
+     *
+     * Example:
+     * (code)
+     * var wms = new OpenLayers.Layer.WMS.Post(
+     *  "NASA Global Mosaic",
+     *  "http://wms.jpl.nasa.gov/wms.cgi",
+     *  {layers: "modis, global_mosaic"});
+     * (end)
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * url - {String} Base url for the WMS
+     *                (e.g. http://wms.jpl.nasa.gov/wms.cgi)
+     * params - {Object} An object with key/value pairs representing the
+     *                   GetMap query string parameters and parameter values.
+     * options - {Object} Hashtable of extra options to tag onto the layer.
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = [];
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.WMS.prototype.initialize.apply(this, newArguments);
+
+        this.tileClass = OpenLayers.Util.indexOf(
+            this.unsupportedBrowsers, OpenLayers.Util.getBrowserName()) != -1
+                ? OpenLayers.Tile.Image
+                : OpenLayers.Tile.Image.IFrame;
+    },
+    
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it and adds it as iframe to the
+     * layer div.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.Tile.Image.IFrame>} The added OpenLayers.Tile.Image.IFrame
+     */
+    addTile: function(bounds,position) {
+        return new this.tileClass(
+            this, position, bounds, null, this.tileSize);
+    },
+
+    CLASS_NAME: 'OpenLayers.Layer.WMS.Post'
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Zoomify.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Zoomify.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Zoomify.js	(revision 76)
@@ -0,0 +1,308 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/*
+ * Development supported by a R&D grant DC08P02OUK006 - Old Maps Online
+ * (www.oldmapsonline.org) from Ministry of Culture of the Czech Republic.
+ */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Zoomify
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.Zoomify = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * Property: url
+     * {String} URL for root directory with TileGroupX subdirectories.
+     */
+    url: null,
+
+    /**
+     * Property: size
+     * {<OpenLayers.Size>} The Zoomify image size in pixels.
+     */
+    size: null,
+
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean}
+     */
+    isBaseLayer: true,
+
+    /**
+     * Property: standardTileSize
+     * {Integer} The size of a standard (non-border) square tile in pixels.
+     */
+    standardTileSize: 256,
+
+    /**
+     * Property: numberOfTiers
+     * {Integer} Depth of the Zoomify pyramid, number of tiers (zoom levels)
+     *                          - filled during Zoomify pyramid initialization.
+     */
+    numberOfTiers: 0,
+
+    /**
+     * Property: tileCountUpToTier
+     * {Array(Integer)} Number of tiles up to the given tier of pyramid.
+     *                          - filled during Zoomify pyramid initialization.
+     */
+    tileCountUpToTier: new Array(),
+
+    /**
+     * Property: tierSizeInTiles
+     * {Array(<OpenLayers.Size>)} Size (in tiles) for each tier of pyramid.
+     *                          - filled during Zoomify pyramid initialization.
+     */
+    tierSizeInTiles: new Array(),
+
+    /**
+     * Property: tierImageSize
+     * {Array(<OpenLayers.Size>)} Image size in pixels for each pyramid tier.
+     *                          - filled during Zoomify pyramid initialization.
+     */
+    tierImageSize: new Array(),
+
+    /**
+     * Constructor: OpenLayers.Layer.Zoomify
+     *
+     * Parameters:
+     * name - {String} A name for the layer.
+     * url - {String} - Relative or absolute path to the image or more
+     *        precisly to the TileGroup[X] directories root.
+     *        Flash plugin use the variable name "zoomifyImagePath" for this.
+     * size - {<OpenLayers.Size>} The size (in pixels) of the image.
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, size, options) {
+
+        // initilize the Zoomify pyramid for given size
+        this.initializeZoomify( size );
+
+        var newArguments = [];
+        newArguments.push(name, url, size, {}, options);
+
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+    },
+
+    /**
+     * Method: initializeZoomify
+     * It generates constants for all tiers of the Zoomify pyramid
+     *
+     * Parameters:
+     * size - {<OpenLayers.Size>} The size of the image in pixels
+     *
+     */
+    initializeZoomify: function( size ) {
+
+        var imageSize = size.clone()
+        var tiles = new OpenLayers.Size(
+            Math.ceil( imageSize.w / this.standardTileSize ),
+            Math.ceil( imageSize.h / this.standardTileSize )
+            );
+
+        this.tierSizeInTiles.push( tiles );
+        this.tierImageSize.push( imageSize );
+
+        while (imageSize.w > this.standardTileSize ||
+               imageSize.h > this.standardTileSize ) {
+
+            imageSize = new OpenLayers.Size(
+                Math.floor( imageSize.w / 2 ),
+                Math.floor( imageSize.h / 2 )
+                );
+            tiles = new OpenLayers.Size(
+                Math.ceil( imageSize.w / this.standardTileSize ),
+                Math.ceil( imageSize.h / this.standardTileSize )
+                );
+            this.tierSizeInTiles.push( tiles );
+            this.tierImageSize.push( imageSize );
+        }
+
+        this.tierSizeInTiles.reverse();
+        this.tierImageSize.reverse();
+
+        this.numberOfTiers = this.tierSizeInTiles.length;
+
+        this.tileCountUpToTier[0] = 0;
+        for (var i = 1; i < this.numberOfTiers; i++) {
+            this.tileCountUpToTier.push(
+                this.tierSizeInTiles[i-1].w * this.tierSizeInTiles[i-1].h +
+                this.tileCountUpToTier[i-1]
+                );
+        }
+    },
+
+    /**
+     * APIMethod:destroy
+     */
+    destroy: function() {
+        // for now, nothing special to do here.
+        OpenLayers.Layer.Grid.prototype.destroy.apply(this, arguments);
+
+        // Remove from memory the Zoomify pyramid - is that enough?
+        this.tileCountUpToTier.length = 0
+        this.tierSizeInTiles.length = 0
+        this.tierImageSize.length = 0
+
+    },
+
+    /**
+     * APIMethod: clone
+     *
+     * Parameters:
+     * obj - {Object}
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Zoomify>} An exact clone of this <OpenLayers.Layer.Zoomify>
+     */
+    clone: function (obj) {
+
+        if (obj == null) {
+            obj = new OpenLayers.Layer.Zoomify(this.name,
+                                           this.url,
+                                           this.size,
+                                           this.options);
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },
+
+    /**
+     * Method: getURL
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the
+     *          passed-in bounds and appropriate tile size specified as
+     *          parameters
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        var res = this.map.getResolution();
+        var x = Math.round((bounds.left - this.tileOrigin.lon) / (res * this.tileSize.w));
+        var y = Math.round((this.tileOrigin.lat - bounds.top) / (res * this.tileSize.h));
+        var z = this.map.getZoom();
+
+        var tileIndex = x + y * this.tierSizeInTiles[z].w + this.tileCountUpToTier[z];
+        var path = "TileGroup" + Math.floor( (tileIndex) / 256 ) +
+            "/" + z + "-" + x + "-" + y + ".jpg";
+        var url = this.url;
+        if (url instanceof Array) {
+            url = this.selectUrl(path, url);
+        }
+        return url + path;
+    },
+
+    /**
+     * Method: getImageSize
+     * getImageSize returns size for a particular tile. If bounds are given as
+     * first argument, size is calculated (bottom-right tiles are non square).
+     *
+     */
+    getImageSize: function() {
+        if (arguments.length > 0) {
+            bounds = this.adjustBounds(arguments[0]);
+            var res = this.map.getResolution();
+            var x = Math.round((bounds.left - this.tileOrigin.lon) / (res * this.tileSize.w));
+            var y = Math.round((this.tileOrigin.lat - bounds.top) / (res * this.tileSize.h));
+            var z = this.map.getZoom();
+            var w = this.standardTileSize;
+            var h = this.standardTileSize;
+            if (x == this.tierSizeInTiles[z].w -1 ) {
+                var w = this.tierImageSize[z].w % this.standardTileSize;
+            };
+            if (y == this.tierSizeInTiles[z].h -1 ) {
+                var h = this.tierImageSize[z].h % this.standardTileSize;
+            };
+            return (new OpenLayers.Size(w, h));
+        } else {
+            return this.tileSize;
+        }
+    },
+
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div.
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds,
+                                         null, this.tileSize);
+    },
+
+    /**
+     * APIMethod: setMap
+     * When the layer is added to a map, then we can fetch our origin
+     *    (if we don't have one.)
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.Grid.prototype.setMap.apply(this, arguments);
+        this.tileOrigin = new OpenLayers.LonLat(this.map.maxExtent.left,
+                                                this.map.maxExtent.top);
+    },
+
+    /**
+     * Method: calculateGridLayout
+     * Generate parameters for the grid layout. This
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bound>}
+     * extent - {<OpenLayers.Bounds>}
+     * resolution - {Number}
+     *
+     * Returns:
+     * Object containing properties tilelon, tilelat, tileoffsetlat,
+     * tileoffsetlat, tileoffsetx, tileoffsety
+     */
+    calculateGridLayout: function(bounds, extent, resolution) {
+        var tilelon = resolution * this.tileSize.w;
+        var tilelat = resolution * this.tileSize.h;
+
+        var offsetlon = bounds.left - extent.left;
+        var tilecol = Math.floor(offsetlon/tilelon) - this.buffer;
+        var tilecolremain = offsetlon/tilelon - tilecol;
+        var tileoffsetx = -tilecolremain * this.tileSize.w;
+        var tileoffsetlon = extent.left + tilecol * tilelon;
+
+        var offsetlat = extent.top - bounds.top + tilelat;
+        var tilerow = Math.floor(offsetlat/tilelat) - this.buffer;
+        var tilerowremain = tilerow - offsetlat/tilelat;
+        var tileoffsety = tilerowremain * this.tileSize.h;
+        var tileoffsetlat = extent.top - tilelat*tilerow;
+
+        return {
+          tilelon: tilelon, tilelat: tilelat,
+          tileoffsetlon: tileoffsetlon, tileoffsetlat: tileoffsetlat,
+          tileoffsetx: tileoffsetx, tileoffsety: tileoffsety
+        };
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Zoomify"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google/v3.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google/v3.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Google/v3.js	(revision 76)
@@ -0,0 +1,419 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Google.js
+ */
+
+/**
+ * Constant: OpenLayers.Layer.Google.v3
+ * 
+ * Mixin providing functionality specific to the Google Maps API v3. Note that
+ * this layer configures the google.maps.map object with the "disableDefaultUI"
+ * option set to true. Using UI controls that the Google Maps API provides is
+ * not supported by the OpenLayers API.
+ */
+OpenLayers.Layer.Google.v3 = {
+    
+    /**
+     * Constant: DEFAULTS
+     * {Object} It is not recommended to change the properties set here. Note
+     * that Google.v3 layers only work when sphericalMercator is set to true.
+     * 
+     * (code)
+     * {
+     *     maxExtent: new OpenLayers.Bounds(
+     *         -128 * 156543.0339,
+     *         -128 * 156543.0339,
+     *         128 * 156543.0339,
+     *         128 * 156543.0339
+     *     ),
+     *     sphericalMercator: true,
+     *     maxResolution: 156543.0339,
+     *     units: "m",
+     *     projection: "EPSG:900913"
+     * }
+     * (end)
+     */
+    DEFAULTS: {
+        maxExtent: new OpenLayers.Bounds(
+            -128 * 156543.0339,
+            -128 * 156543.0339,
+            128 * 156543.0339,
+            128 * 156543.0339
+        ),
+        sphericalMercator: true,
+        maxResolution: 156543.0339,
+        units: "m",
+        projection: "EPSG:900913"
+    },
+
+    /** 
+     * Method: loadMapObject
+     * Load the GMap and register appropriate event listeners. If we can't 
+     *     load GMap2, then display a warning message.
+     */
+    loadMapObject:function() {
+        if (!this.type) {
+            this.type = google.maps.MapTypeId.ROADMAP;
+        }
+        var mapObject;
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        if (cache) {
+            // there are already Google layers added to this map
+            mapObject = cache.mapObject;
+            // increment the layer count
+            ++cache.count;
+        } else {
+            // this is the first Google layer for this map
+
+            var container = this.map.viewPortDiv;
+            var div = document.createElement("div");
+            div.id = this.map.id + "_GMapContainer";
+            div.style.position = "absolute";
+            div.style.width = "100%";
+            div.style.height = "100%";
+            container.appendChild(div);
+
+            // create GMap and shuffle elements
+            var center = this.map.getCenter();
+            mapObject = new google.maps.Map(div, {
+                center: center ?
+                    new google.maps.LatLng(center.lat, center.lon) :
+                    new google.maps.LatLng(0, 0),
+                zoom: this.map.getZoom() || 0,
+                mapTypeId: this.type,
+                disableDefaultUI: true,
+                keyboardShortcuts: false,
+                draggable: false,
+                disableDoubleClickZoom: true,
+                scrollwheel: false
+            });
+            
+            // cache elements for use by any other google layers added to
+            // this same map
+            cache = {
+                mapObject: mapObject,
+                count: 1
+            };
+            OpenLayers.Layer.Google.cache[this.map.id] = cache;
+            this.repositionListener = google.maps.event.addListenerOnce(
+                mapObject, 
+                "center_changed", 
+                OpenLayers.Function.bind(this.repositionMapElements, this)
+            );
+        }
+        this.mapObject = mapObject;
+        this.setGMapVisibility(this.visibility);
+    },
+    
+    /**
+     * Method: repositionMapElements
+     *
+     * Waits until powered by and terms of use elements are available and then
+     * moves them so they are clickable.
+     */
+    repositionMapElements: function() {
+
+        // This is the first time any Google layer in this mapObject has been
+        // made visible.  The mapObject needs to know the container size.
+        google.maps.event.trigger(this.mapObject, "resize");
+        
+        var div = this.mapObject.getDiv().firstChild;
+        if (!div || div.childNodes.length < 3) {
+            this.repositionTimer = window.setTimeout(
+                OpenLayers.Function.bind(this.repositionMapElements, this),
+                250
+            );
+            return false;
+        }
+
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        var container = this.map.viewPortDiv;
+
+        // move the ToS and branding stuff up to the container div
+        var termsOfUse = div.lastChild;
+        container.appendChild(termsOfUse);
+        termsOfUse.style.zIndex = "1100";
+        termsOfUse.style.bottom = "";
+        termsOfUse.className = "olLayerGoogleCopyright olLayerGoogleV3";
+        termsOfUse.style.display = "";
+        cache.termsOfUse = termsOfUse;
+
+        var poweredBy = div.lastChild;
+        container.appendChild(poweredBy);
+        poweredBy.style.zIndex = "1100";
+        poweredBy.style.bottom = "";
+        poweredBy.className = "olLayerGooglePoweredBy olLayerGoogleV3 gmnoprint";
+        poweredBy.style.display = "";
+        cache.poweredBy = poweredBy;
+
+        this.setGMapVisibility(this.visibility);
+
+    },
+
+    /**
+     * APIMethod: onMapResize
+     */
+    onMapResize: function() {
+        if (this.visibility) {
+            google.maps.event.trigger(this.mapObject, "resize");
+        } else {
+            if (!this._resized) {
+                var layer = this;
+                google.maps.event.addListenerOnce(this.mapObject, "tilesloaded", function() {
+                    delete layer._resized;
+                    google.maps.event.trigger(layer.mapObject, "resize");
+                    layer.moveTo(layer.map.getCenter(), layer.map.getZoom());
+                });
+            }
+            this._resized = true;
+        }
+    },
+
+    /**
+     * Method: setGMapVisibility
+     * Display the GMap container and associated elements.
+     * 
+     * Parameters:
+     * visible - {Boolean} Display the GMap elements.
+     */
+    setGMapVisibility: function(visible) {
+        var cache = OpenLayers.Layer.Google.cache[this.map.id];
+        if (cache) {
+            var type = this.type;
+            var layers = this.map.layers;
+            var layer;
+            for (var i=layers.length-1; i>=0; --i) {
+                layer = layers[i];
+                if (layer instanceof OpenLayers.Layer.Google &&
+                            layer.visibility === true && layer.inRange === true) {
+                    type = layer.type;
+                    visible = true;
+                    break;
+                }
+            }
+            var container = this.mapObject.getDiv();
+            if (visible === true) {
+                this.mapObject.setMapTypeId(type);                
+                container.style.left = "";
+                if (cache.termsOfUse && cache.termsOfUse.style) {
+                    cache.termsOfUse.style.left = "";
+                    cache.termsOfUse.style.display = "";
+                    cache.poweredBy.style.display = "";            
+                }
+                cache.displayed = this.id;
+            } else {
+                delete cache.displayed;
+                container.style.left = "-9999px";
+                if (cache.termsOfUse && cache.termsOfUse.style) {
+                    cache.termsOfUse.style.display = "none";
+                    // move ToU far to the left in addition to setting
+                    // display to "none", because at the end of the GMap
+                    // load sequence, display: none will be unset and ToU
+                    // would be visible after loading a map with a google
+                    // layer that is initially hidden. 
+                    cache.termsOfUse.style.left = "-9999px";
+                    cache.poweredBy.style.display = "none";
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: getMapContainer
+     * 
+     * Returns:
+     * {DOMElement} the GMap container's div
+     */
+    getMapContainer: function() {
+        return this.mapObject.getDiv();
+    },
+    
+  //
+  // TRANSLATION: MapObject Bounds <-> OpenLayers.Bounds
+  //
+
+    /**
+     * APIMethod: getMapObjectBoundsFromOLBounds
+     * 
+     * Parameters:
+     * olBounds - {<OpenLayers.Bounds>}
+     * 
+     * Returns:
+     * {Object} A MapObject Bounds, translated from olBounds
+     *          Returns null if null value is passed in
+     */
+    getMapObjectBoundsFromOLBounds: function(olBounds) {
+        var moBounds = null;
+        if (olBounds != null) {
+            var sw = this.sphericalMercator ? 
+              this.inverseMercator(olBounds.bottom, olBounds.left) : 
+              new OpenLayers.LonLat(olBounds.bottom, olBounds.left);
+            var ne = this.sphericalMercator ? 
+              this.inverseMercator(olBounds.top, olBounds.right) : 
+              new OpenLayers.LonLat(olBounds.top, olBounds.right);
+            moBounds = new google.maps.LatLngBounds(
+                new google.maps.LatLng(sw.lat, sw.lon),
+                new google.maps.LatLng(ne.lat, ne.lon)
+            );
+        }
+        return moBounds;
+    },
+
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // LonLat - Pixel Translation
+  
+    /**
+     * APIMethod: getMapObjectLonLatFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Object} MapObject LonLat translated from MapObject Pixel
+     */
+    getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
+        var size = this.map.getSize();
+        var lon = this.getLongitudeFromMapObjectLonLat(this.mapObject.center);
+        var lat = this.getLatitudeFromMapObjectLonLat(this.mapObject.center);
+        var res = this.map.getResolution();
+
+        var delta_x = moPixel.x - (size.w / 2);
+        var delta_y = moPixel.y - (size.h / 2);
+    
+        var lonlat = new OpenLayers.LonLat(
+            lon + delta_x * res,
+            lat - delta_y * res
+        ); 
+
+        if (this.wrapDateLine) {
+            lonlat = lonlat.wrapDateLine(this.maxExtent);
+        }
+        return this.getMapObjectLonLatFromLonLat(lonlat.lon, lonlat.lat);
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Object} MapObject Pixel transtlated from MapObject LonLat
+     */
+    getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
+        var lon = this.getLongitudeFromMapObjectLonLat(moLonLat);
+        var lat = this.getLatitudeFromMapObjectLonLat(moLonLat);
+        var res = this.map.getResolution();
+        var extent = this.map.getExtent();
+        var px = new OpenLayers.Pixel(
+            (1/res * (lon - extent.left)),
+            (1/res * (extent.top - lat))
+        );    
+        return this.getMapObjectPixelFromXY(px.x, px.y);
+    },
+
+  
+    /** 
+     * APIMethod: setMapObjectCenter
+     * Set the mapObject to the specified center and zoom
+     * 
+     * Parameters:
+     * center - {Object} MapObject LonLat format
+     * zoom - {int} MapObject zoom format
+     */
+    setMapObjectCenter: function(center, zoom) {
+        this.mapObject.setOptions({
+            center: center,
+            zoom: zoom
+        });
+    },
+   
+    
+  // Bounds
+  
+    /** 
+     * APIMethod: getMapObjectZoomFromMapObjectBounds
+     * 
+     * Parameters:
+     * moBounds - {Object} MapObject Bounds format
+     * 
+     * Returns:
+     * {Object} MapObject Zoom for specified MapObject Bounds
+     */
+    getMapObjectZoomFromMapObjectBounds: function(moBounds) {
+        return this.mapObject.getBoundsZoomLevel(moBounds);
+    },
+
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getMapObjectLonLatFromLonLat
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {Object} MapObject LonLat built from lon and lat params
+     */
+    getMapObjectLonLatFromLonLat: function(lon, lat) {
+        var gLatLng;
+        if(this.sphericalMercator) {
+            var lonlat = this.inverseMercator(lon, lat);
+            gLatLng = new google.maps.LatLng(lonlat.lat, lonlat.lon);
+        } else {
+            gLatLng = new google.maps.LatLng(lat, lon);
+        }
+        return gLatLng;
+    },
+    
+  // Pixel
+    
+    /**
+     * APIMethod: getMapObjectPixelFromXY
+     * 
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     * 
+     * Returns:
+     * {Object} MapObject Pixel from x and y parameters
+     */
+    getMapObjectPixelFromXY: function(x, y) {
+        return new google.maps.Point(x, y);
+    },
+        
+    /**
+     * APIMethod: destroy
+     * Clean up this layer.
+     */
+    destroy: function() {
+        if (this.repositionListener) {
+            google.maps.event.removeListener(this.repositionListener);
+        }
+        if (this.repositionTimer) {
+            window.clearTimeout(this.repositionTimer);
+        }
+        OpenLayers.Layer.Google.prototype.destroy.apply(this, arguments);
+    }
+    
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GeoRSS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GeoRSS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/GeoRSS.js	(revision 76)
@@ -0,0 +1,266 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Markers.js
+ * @requires OpenLayers/Request/XMLHttpRequest.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.GeoRSS
+ * Add GeoRSS Point features to your map. 
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Markers>
+ *  - <OpenLayers.Layer>
+ */
+OpenLayers.Layer.GeoRSS = OpenLayers.Class(OpenLayers.Layer.Markers, {
+
+    /** 
+     * Property: location 
+     * {String} store url of text file 
+     */
+    location: null,
+
+    /** 
+     * Property: features 
+     * {Array(<OpenLayers.Feature>)} 
+     */
+    features: null,
+    
+    /**
+     * APIProperty: formatOptions
+     * {Object} Hash of options which should be passed to the format when it is
+     * created. Must be passed in the constructor.
+     */
+    formatOptions: null, 
+
+    /** 
+     * Property: selectedFeature 
+     * {<OpenLayers.Feature>} 
+     */
+    selectedFeature: null,
+
+    /** 
+     * APIProperty: icon 
+     * {<OpenLayers.Icon>}. This determines the Icon to be used on the map
+     * for this GeoRSS layer.
+     */
+    icon: null,
+
+    /**
+     * APIProperty: popupSize
+     * {<OpenLayers.Size>} This determines the size of GeoRSS popups. If 
+     * not provided, defaults to 250px by 120px. 
+     */
+    popupSize: null, 
+    
+    /** 
+     * APIProperty: useFeedTitle 
+     * {Boolean} Set layer.name to the first <title> element in the feed. Default is true. 
+     */
+    useFeedTitle: true,
+    
+    /**
+    * Constructor: OpenLayers.Layer.GeoRSS
+    * Create a GeoRSS Layer.
+    *
+    * Parameters:
+    * name - {String} 
+    * location - {String} 
+    * options - {Object}
+    */
+    initialize: function(name, location, options) {
+        OpenLayers.Layer.Markers.prototype.initialize.apply(this, [name, options]);
+        this.location = location;
+        this.features = [];
+    },
+
+    /**
+     * Method: destroy 
+     */
+    destroy: function() {
+        // Warning: Layer.Markers.destroy() must be called prior to calling
+        // clearFeatures() here, otherwise we leak memory. Indeed, if
+        // Layer.Markers.destroy() is called after clearFeatures(), it won't be
+        // able to remove the marker image elements from the layer's div since
+        // the markers will have been destroyed by clearFeatures().
+        OpenLayers.Layer.Markers.prototype.destroy.apply(this, arguments);
+        this.clearFeatures();
+        this.features = null;
+    },
+
+    /**
+     * Method: loadRSS
+     * Start the load of the RSS data. Don't do this when we first add the layer,
+     * since we may not be visible at any point, and it would therefore be a waste.
+     */
+    loadRSS: function() {
+        if (!this.loaded) {
+            this.events.triggerEvent("loadstart");
+            OpenLayers.Request.GET({
+                url: this.location,
+                success: this.parseData,
+                scope: this
+            });
+            this.loaded = true;
+        }    
+    },    
+    
+    /**
+     * Method: moveTo
+     * If layer is visible and RSS has not been loaded, load RSS. 
+     * 
+     * Parameters:
+     * bounds - {Object} 
+     * zoomChanged - {Object} 
+     * minor - {Object} 
+     */
+    moveTo:function(bounds, zoomChanged, minor) {
+        OpenLayers.Layer.Markers.prototype.moveTo.apply(this, arguments);
+        if(this.visibility && !this.loaded){
+            this.loadRSS();
+        }
+    },
+        
+    /**
+     * Method: parseData
+     * Parse the data returned from the Events call.
+     *
+     * Parameters:
+     * ajaxRequest - {<OpenLayers.Request.XMLHttpRequest>} 
+     */
+    parseData: function(ajaxRequest) {
+        var doc = ajaxRequest.responseXML;
+        if (!doc || !doc.documentElement) {
+            doc = OpenLayers.Format.XML.prototype.read(ajaxRequest.responseText);
+        }
+        
+        if (this.useFeedTitle) {
+            var name = null;
+            try {
+                name = doc.getElementsByTagNameNS('*', 'title')[0].firstChild.nodeValue;
+            }
+            catch (e) {
+                name = doc.getElementsByTagName('title')[0].firstChild.nodeValue;
+            }
+            if (name) {
+                this.setName(name);
+            }    
+        }
+       
+        var options = {};
+        
+        OpenLayers.Util.extend(options, this.formatOptions);
+        
+        if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+            options.externalProjection = this.projection;
+            options.internalProjection = this.map.getProjectionObject();
+        }    
+        
+        var format = new OpenLayers.Format.GeoRSS(options);
+        var features = format.read(doc);
+        
+        for (var i=0, len=features.length; i<len; i++) {
+            var data = {};
+            var feature = features[i];
+            
+            // we don't support features with no geometry in the GeoRSS
+            // layer at this time. 
+            if (!feature.geometry) {
+                continue;
+            }    
+            
+            var title = feature.attributes.title ? 
+                         feature.attributes.title : "Untitled";
+            
+            var description = feature.attributes.description ? 
+                         feature.attributes.description : "No description.";
+            
+            var link = feature.attributes.link ? feature.attributes.link : "";
+
+            var location = feature.geometry.getBounds().getCenterLonLat();
+            
+            
+            data.icon = this.icon == null ? 
+                                     OpenLayers.Marker.defaultIcon() : 
+                                     this.icon.clone();
+            
+            data.popupSize = this.popupSize ? 
+                             this.popupSize.clone() :
+                             new OpenLayers.Size(250, 120);
+            
+            if (title || description) {
+                // we have supplemental data, store them.
+                data.title = title;
+                data.description = description;
+            
+                var contentHTML = '<div class="olLayerGeoRSSClose">[x]</div>'; 
+                contentHTML += '<div class="olLayerGeoRSSTitle">';
+                if (link) {
+                    contentHTML += '<a class="link" href="'+link+'" target="_blank">';
+                }
+                contentHTML += title;
+                if (link) {
+                    contentHTML += '</a>';
+                }
+                contentHTML += '</div>';
+                contentHTML += '<div style="" class="olLayerGeoRSSDescription">';
+                contentHTML += description;
+                contentHTML += '</div>';
+                data['popupContentHTML'] = contentHTML;                
+            }
+            var feature = new OpenLayers.Feature(this, location, data);
+            this.features.push(feature);
+            var marker = feature.createMarker();
+            marker.events.register('click', feature, this.markerClick);
+            this.addMarker(marker);
+        }
+        this.events.triggerEvent("loadend");
+    },
+    
+    /**
+     * Method: markerClick
+     *
+     * Parameters:
+     * evt - {Event} 
+     */
+    markerClick: function(evt) {
+        var sameMarkerClicked = (this == this.layer.selectedFeature);
+        this.layer.selectedFeature = (!sameMarkerClicked) ? this : null;
+        for(var i=0, len=this.layer.map.popups.length; i<len; i++) {
+            this.layer.map.removePopup(this.layer.map.popups[i]);
+        }
+        if (!sameMarkerClicked) {
+            var popup = this.createPopup();
+            OpenLayers.Event.observe(popup.div, "click",
+                OpenLayers.Function.bind(function() { 
+                    for(var i=0, len=this.layer.map.popups.length; i<len; i++) { 
+                        this.layer.map.removePopup(this.layer.map.popups[i]); 
+                    }
+                }, this)
+            );
+            this.layer.map.addPopup(popup); 
+        }
+        OpenLayers.Event.stop(evt);
+    },
+
+    /**
+     * Method: clearFeatures
+     * Destroy all features in this layer.
+     */
+    clearFeatures: function() {
+        if (this.features != null) {
+            while(this.features.length > 0) {
+                var feature = this.features[0];
+                OpenLayers.Util.removeItem(this.features, feature);
+                feature.destroy();
+            }
+        }        
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.GeoRSS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector.js	(revision 76)
@@ -0,0 +1,947 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer.js
+ * @requires OpenLayers/Renderer.js
+ * @requires OpenLayers/StyleMap.js
+ * @requires OpenLayers/Feature/Vector.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Vector
+ * Instances of OpenLayers.Layer.Vector are used to render vector data from
+ *     a variety of sources. Create a new vector layer with the
+ *     <OpenLayers.Layer.Vector> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer>
+ */
+OpenLayers.Layer.Vector = OpenLayers.Class(OpenLayers.Layer, {
+
+    /**
+     * Constant: EVENT_TYPES
+     * {Array(String)} Supported application event types.  Register a listener
+     *     for a particular event with the following syntax:
+     * (code)
+     * layer.events.register(type, obj, listener);
+     * (end)
+     *
+     * Listeners will be called with a reference to an event object.  The
+     *     properties of this event depends on exactly what happened.
+     *
+     * All event objects have at least the following properties:
+     * object - {Object} A reference to layer.events.object.
+     * element - {DOMElement} A reference to layer.events.element.
+     *
+     * Supported map event types (in addition to those from <OpenLayers.Layer>):
+     * beforefeatureadded - Triggered before a feature is added.  Listeners
+     *      will receive an object with a *feature* property referencing the
+     *      feature to be added.  To stop the feature from being added, a
+     *      listener should return false.
+     * beforefeaturesadded - Triggered before an array of features is added.
+     *      Listeners will receive an object with a *features* property
+     *      referencing the feature to be added. To stop the features from
+     *      being added, a listener should return false.
+     * featureadded - Triggered after a feature is added.  The event
+     *      object passed to listeners will have a *feature* property with a
+     *      reference to the added feature.
+     * featuresadded - Triggered after features are added.  The event
+     *      object passed to listeners will have a *features* property with a
+     *      reference to an array of added features.
+     * beforefeatureremoved - Triggered before a feature is removed. Listeners
+     *      will receive an object with a *feature* property referencing the
+     *      feature to be removed.
+     * beforefeaturesremoved - Triggered before multiple features are removed. 
+     *      Listeners will receive an object with a *features* property
+     *      referencing the features to be removed.
+     * featureremoved - Triggerd after a feature is removed. The event
+     *      object passed to listeners will have a *feature* property with a
+     *      reference to the removed feature.
+     * featuresremoved - Triggered after features are removed. The event
+     *      object passed to listeners will have a *features* property with a
+     *      reference to an array of removed features.
+     * featureselected - Triggered after a feature is selected.  Listeners
+     *      will receive an object with a *feature* property referencing the
+     *      selected feature.
+     * featureunselected - Triggered after a feature is unselected.
+     *      Listeners will receive an object with a *feature* property
+     *      referencing the unselected feature.
+     * beforefeaturemodified - Triggered when a feature is selected to 
+     *      be modified.  Listeners will receive an object with a *feature* 
+     *      property referencing the selected feature.
+     * featuremodified - Triggered when a feature has been modified.
+     *      Listeners will receive an object with a *feature* property referencing 
+     *      the modified feature.
+     * afterfeaturemodified - Triggered when a feature is finished being modified.
+     *      Listeners will receive an object with a *feature* property referencing 
+     *      the modified feature.
+     * vertexmodified - Triggered when a vertex within any feature geometry
+     *      has been modified.  Listeners will receive an object with a
+     *      *feature* property referencing the modified feature, a *vertex*
+     *      property referencing the vertex modified (always a point geometry),
+     *      and a *pixel* property referencing the pixel location of the
+     *      modification.
+     * sketchstarted - Triggered when a feature sketch bound for this layer
+     *      is started.  Listeners will receive an object with a *feature*
+     *      property referencing the new sketch feature and a *vertex* property
+     *      referencing the creation point.
+     * sketchmodified - Triggered when a feature sketch bound for this layer
+     *      is modified.  Listeners will receive an object with a *vertex*
+     *      property referencing the modified vertex and a *feature* property
+     *      referencing the sketch feature.
+     * sketchcomplete - Triggered when a feature sketch bound for this layer
+     *      is complete.  Listeners will receive an object with a *feature*
+     *      property referencing the sketch feature.  By returning false, a
+     *      listener can stop the sketch feature from being added to the layer.
+     * refresh - Triggered when something wants a strategy to ask the protocol
+     *      for a new set of features.
+     */
+    EVENT_TYPES: ["beforefeatureadded", "beforefeaturesadded",
+                  "featureadded", "featuresadded", "beforefeatureremoved",
+                  "beforefeaturesremoved", "featureremoved", "featuresremoved",
+                  "beforefeatureselected", "featureselected", "featureunselected", 
+                  "beforefeaturemodified", "featuremodified", "afterfeaturemodified",
+                  "vertexmodified", "sketchstarted", "sketchmodified",
+                  "sketchcomplete", "refresh"],
+
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} The layer is a base layer.  Default is false.  Set this property
+     * in the layer options.
+     */
+    isBaseLayer: false,
+
+    /** 
+     * APIProperty: isFixed
+     * {Boolean} Whether the layer remains in one place while dragging the
+     * map.
+     */
+    isFixed: false,
+
+    /** 
+     * APIProperty: isVector
+     * {Boolean} Whether the layer is a vector layer.
+     */
+    isVector: true,
+    
+    /** 
+     * APIProperty: features
+     * {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    features: null,
+    
+    /** 
+     * Property: filter
+     * {<OpenLayers.Filter>} The filter set in this layer,
+     *     a strategy launching read requests can combined
+     *     this filter with its own filter.
+     */
+    filter: null,
+    
+    /** 
+     * Property: selectedFeatures
+     * {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    selectedFeatures: null,
+    
+    /**
+     * Property: unrenderedFeatures
+     * {Object} hash of features, keyed by feature.id, that the renderer
+     *     failed to draw
+     */
+    unrenderedFeatures: null,
+
+    /**
+     * APIProperty: reportError
+     * {Boolean} report friendly error message when loading of renderer
+     * fails.
+     */
+    reportError: true, 
+
+    /** 
+     * APIProperty: style
+     * {Object} Default style for the layer
+     */
+    style: null,
+    
+    /**
+     * Property: styleMap
+     * {<OpenLayers.StyleMap>}
+     */
+    styleMap: null,
+    
+    /**
+     * Property: strategies
+     * {Array(<OpenLayers.Strategy>})} Optional list of strategies for the layer.
+     */
+    strategies: null,
+    
+    /**
+     * Property: protocol
+     * {<OpenLayers.Protocol>} Optional protocol for the layer.
+     */
+    protocol: null,
+    
+    /**
+     * Property: renderers
+     * {Array(String)} List of supported Renderer classes. Add to this list to
+     * add support for additional renderers. This list is ordered:
+     * the first renderer which returns true for the  'supported()'
+     * method will be used, if not defined in the 'renderer' option.
+     */
+    renderers: ['SVG', 'VML', 'Canvas'],
+    
+    /** 
+     * Property: renderer
+     * {<OpenLayers.Renderer>}
+     */
+    renderer: null,
+    
+    /**
+     * APIProperty: rendererOptions
+     * {Object} Options for the renderer. See {<OpenLayers.Renderer>} for
+     *     supported options.
+     */
+    rendererOptions: null,
+    
+    /** 
+     * APIProperty: geometryType
+     * {String} geometryType allows you to limit the types of geometries this
+     * layer supports. This should be set to something like
+     * "OpenLayers.Geometry.Point" to limit types.
+     */
+    geometryType: null,
+
+    /** 
+     * Property: drawn
+     * {Boolean} Whether the Vector Layer features have been drawn yet.
+     */
+    drawn: false,
+
+    /**
+     * Constructor: OpenLayers.Layer.Vector
+     * Create a new vector layer
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * options - {Object} Optional object with non-default properties to set on
+     *           the layer.
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Vector>} A new vector layer
+     */
+    initialize: function(name, options) {
+        
+        // concatenate events specific to vector with those from the base
+        this.EVENT_TYPES =
+            OpenLayers.Layer.Vector.prototype.EVENT_TYPES.concat(
+            OpenLayers.Layer.prototype.EVENT_TYPES
+        );
+
+        OpenLayers.Layer.prototype.initialize.apply(this, arguments);
+
+        // allow user-set renderer, otherwise assign one
+        if (!this.renderer || !this.renderer.supported()) {  
+            this.assignRenderer();
+        }
+
+        // if no valid renderer found, display error
+        if (!this.renderer || !this.renderer.supported()) {
+            this.renderer = null;
+            this.displayError();
+        } 
+
+        if (!this.styleMap) {
+            this.styleMap = new OpenLayers.StyleMap();
+        }
+
+        this.features = [];
+        this.selectedFeatures = [];
+        this.unrenderedFeatures = {};
+        
+        // Allow for custom layer behavior
+        if(this.strategies){
+            for(var i=0, len=this.strategies.length; i<len; i++) {
+                this.strategies[i].setLayer(this);
+            }
+        }
+
+    },
+
+    /**
+     * APIMethod: destroy
+     * Destroy this layer
+     */
+    destroy: function() {
+        if (this.strategies) {
+            var strategy, i, len;
+            for(i=0, len=this.strategies.length; i<len; i++) {
+                strategy = this.strategies[i];
+                if(strategy.autoDestroy) {
+                    strategy.destroy();
+                }
+            }
+            this.strategies = null;
+        }
+        if (this.protocol) {
+            if(this.protocol.autoDestroy) {
+                this.protocol.destroy();
+            }
+            this.protocol = null;
+        }
+        this.destroyFeatures();
+        this.features = null;
+        this.selectedFeatures = null;
+        this.unrenderedFeatures = null;
+        if (this.renderer) {
+            this.renderer.destroy();
+        }
+        this.renderer = null;
+        this.geometryType = null;
+        this.drawn = null;
+        OpenLayers.Layer.prototype.destroy.apply(this, arguments);  
+    },
+
+    /**
+     * Method: clone
+     * Create a clone of this layer.
+     * 
+     * Note: Features of the layer are also cloned.
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Vector>} An exact clone of this layer
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.Vector(this.name, this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+        var features = this.features;
+        var len = features.length;
+        var clonedFeatures = new Array(len);
+        for(var i=0; i<len; ++i) {
+            clonedFeatures[i] = features[i].clone();
+        }
+        obj.features = clonedFeatures;
+
+        return obj;
+    },    
+    
+    /**
+     * Method: refresh
+     * Ask the layer to request features again and redraw them.  Triggers
+     *     the refresh event if the layer is in range and visible.
+     *
+     * Parameters:
+     * obj - {Object} Optional object with properties for any listener of
+     *     the refresh event.
+     */
+    refresh: function(obj) {
+        if(this.calculateInRange() && this.visibility) {
+            this.events.triggerEvent("refresh", obj);
+        }
+    },
+
+    /** 
+     * Method: assignRenderer
+     * Iterates through the available renderer implementations and selects 
+     * and assigns the first one whose "supported()" function returns true.
+     */    
+    assignRenderer: function()  {
+        for (var i=0, len=this.renderers.length; i<len; i++) {
+            var rendererClass = this.renderers[i];
+            var renderer = (typeof rendererClass == "function") ?
+                rendererClass :
+                OpenLayers.Renderer[rendererClass];
+            if (renderer && renderer.prototype.supported()) {
+                this.renderer = new renderer(this.div, this.rendererOptions);
+                break;
+            }  
+        }  
+    },
+
+    /** 
+     * Method: displayError 
+     * Let the user know their browser isn't supported.
+     */
+    displayError: function() {
+        if (this.reportError) {
+            OpenLayers.Console.userError(OpenLayers.i18n("browserNotSupported", 
+                                     {'renderers':this.renderers.join("\n")}));
+        }    
+    },
+
+    /** 
+     * Method: setMap
+     * The layer has been added to the map. 
+     * 
+     * If there is no renderer set, the layer can't be used. Remove it.
+     * Otherwise, give the renderer a reference to the map and set its size.
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {        
+        OpenLayers.Layer.prototype.setMap.apply(this, arguments);
+
+        if (!this.renderer) {
+            this.map.removeLayer(this);
+        } else {
+            this.renderer.map = this.map;
+            this.renderer.setSize(this.map.getSize());
+        }
+    },
+
+    /**
+     * Method: afterAdd
+     * Called at the end of the map.addLayer sequence.  At this point, the map
+     *     will have a base layer.  Any autoActivate strategies will be
+     *     activated here.
+     */
+    afterAdd: function() {
+        if(this.strategies) {
+            var strategy, i, len;
+            for(i=0, len=this.strategies.length; i<len; i++) {
+                strategy = this.strategies[i];
+                if(strategy.autoActivate) {
+                    strategy.activate();
+                }
+            }
+        }
+    },
+
+    /**
+     * Method: removeMap
+     * The layer has been removed from the map.
+     *
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    removeMap: function(map) {
+        this.drawn = false;
+        if(this.strategies) {
+            var strategy, i, len;
+            for(i=0, len=this.strategies.length; i<len; i++) {
+                strategy = this.strategies[i];
+                if(strategy.autoActivate) {
+                    strategy.deactivate();
+                }
+            }
+        }
+    },
+    
+    /**
+     * Method: onMapResize
+     * Notify the renderer of the change in size. 
+     * 
+     */
+    onMapResize: function() {
+        OpenLayers.Layer.prototype.onMapResize.apply(this, arguments);
+        this.renderer.setSize(this.map.getSize());
+    },
+
+    /**
+     * Method: moveTo
+     *  Reset the vector layer's div so that it once again is lined up with 
+     *   the map. Notify the renderer of the change of extent, and in the
+     *   case of a change of zoom level (resolution), have the 
+     *   renderer redraw features.
+     * 
+     *  If the layer has not yet been drawn, cycle through the layer's 
+     *   features and draw each one.
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * zoomChanged - {Boolean} 
+     * dragging - {Boolean} 
+     */
+    moveTo: function(bounds, zoomChanged, dragging) {
+        OpenLayers.Layer.prototype.moveTo.apply(this, arguments);
+        
+        var coordSysUnchanged = true;
+
+        if (!dragging) {
+            this.renderer.root.style.visibility = "hidden";
+            
+            this.div.style.left = -parseInt(this.map.layerContainerDiv.style.left) + "px";
+            this.div.style.top = -parseInt(this.map.layerContainerDiv.style.top) + "px";
+            var extent = this.map.getExtent();
+            coordSysUnchanged = this.renderer.setExtent(extent, zoomChanged);
+            
+            this.renderer.root.style.visibility = "visible";
+
+            // Force a reflow on gecko based browsers to prevent jump/flicker.
+            // This seems to happen on only certain configurations; it was originally
+            // noticed in FF 2.0 and Linux.
+            if (navigator.userAgent.toLowerCase().indexOf("gecko") != -1) {
+                this.div.scrollLeft = this.div.scrollLeft;
+            }
+            
+            if(!zoomChanged && coordSysUnchanged) {
+                for(var i in this.unrenderedFeatures) {
+                    var feature = this.unrenderedFeatures[i];
+                    this.drawFeature(feature);
+                }
+            }
+        }
+        
+        if (!this.drawn || zoomChanged || !coordSysUnchanged) {
+            this.drawn = true;
+            var feature;
+            for(var i=0, len=this.features.length; i<len; i++) {
+                this.renderer.locked = (i !== (len - 1));
+                feature = this.features[i];
+                this.drawFeature(feature);
+            }
+        }    
+    },
+    
+    /** 
+     * APIMethod: display
+     * Hide or show the Layer
+     * 
+     * Parameters:
+     * display - {Boolean}
+     */
+    display: function(display) {
+        OpenLayers.Layer.prototype.display.apply(this, arguments);
+        // we need to set the display style of the root in case it is attached
+        // to a foreign layer
+        var currentDisplay = this.div.style.display;
+        if(currentDisplay != this.renderer.root.style.display) {
+            this.renderer.root.style.display = currentDisplay;
+        }
+    },
+
+    /**
+     * APIMethod: addFeatures
+     * Add Features to the layer.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} 
+     * options - {Object}
+     */
+    addFeatures: function(features, options) {
+        if (!(features instanceof Array)) {
+            features = [features];
+        }
+        
+        var notify = !options || !options.silent;
+        if(notify) {
+            var event = {features: features};
+            var ret = this.events.triggerEvent("beforefeaturesadded", event);
+            if(ret === false) {
+                return;
+            }
+            features = event.features;
+        }
+        
+        // Track successfully added features for featuresadded event, since
+        // beforefeatureadded can veto single features.
+        var featuresAdded = [];
+        for (var i=0, len=features.length; i<len; i++) {
+            if (i != (features.length - 1)) {
+                this.renderer.locked = true;
+            } else {
+                this.renderer.locked = false;
+            }    
+            var feature = features[i];
+            
+            if (this.geometryType &&
+              !(feature.geometry instanceof this.geometryType)) {
+                var throwStr = OpenLayers.i18n('componentShouldBe',
+                          {'geomType':this.geometryType.prototype.CLASS_NAME});
+                throw throwStr;
+              }
+
+            //give feature reference to its layer
+            feature.layer = this;
+
+            if (!feature.style && this.style) {
+                feature.style = OpenLayers.Util.extend({}, this.style);
+            }
+
+            if (notify) {
+                if(this.events.triggerEvent("beforefeatureadded",
+                                            {feature: feature}) === false) {
+                    continue;
+                };
+                this.preFeatureInsert(feature);
+            }
+
+            featuresAdded.push(feature);
+            this.features.push(feature);
+            this.drawFeature(feature);
+            
+            if (notify) {
+                this.events.triggerEvent("featureadded", {
+                    feature: feature
+                });
+                this.onFeatureInsert(feature);
+            }
+        }
+        
+        if(notify) {
+            this.events.triggerEvent("featuresadded", {features: featuresAdded});
+        }
+    },
+
+
+    /**
+     * APIMethod: removeFeatures
+     * Remove features from the layer.  This erases any drawn features and
+     *     removes them from the layer's control.  The beforefeatureremoved
+     *     and featureremoved events will be triggered for each feature.  The
+     *     featuresremoved event will be triggered after all features have
+     *     been removed.  To supress event triggering, use the silent option.
+     * 
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} List of features to be
+     *     removed.
+     * options - {Object} Optional properties for changing behavior of the
+     *     removal.
+     *
+     * Valid options:
+     * silent - {Boolean} Supress event triggering.  Default is false.
+     */
+    removeFeatures: function(features, options) {
+        if(!features || features.length === 0) {
+            return;
+        }
+        if (features === this.features) {
+            return this.removeAllFeatures(options);
+        }
+        if (!(features instanceof Array)) {
+            features = [features];
+        }
+        if (features === this.selectedFeatures) {
+            features = features.slice();
+        }
+
+        var notify = !options || !options.silent;
+        
+        if (notify) {
+            this.events.triggerEvent(
+                "beforefeaturesremoved", {features: features}
+            );
+        }
+
+        for (var i = features.length - 1; i >= 0; i--) {
+            // We remain locked so long as we're not at 0
+            // and the 'next' feature has a geometry. We do the geometry check
+            // because if all the features after the current one are 'null', we
+            // won't call eraseGeometry, so we break the 'renderer functions
+            // will always be called with locked=false *last*' rule. The end result
+            // is a possible gratiutious unlocking to save a loop through the rest 
+            // of the list checking the remaining features every time. So long as
+            // null geoms are rare, this is probably okay.    
+            if (i != 0 && features[i-1].geometry) {
+                this.renderer.locked = true;
+            } else {
+                this.renderer.locked = false;
+            }
+    
+            var feature = features[i];
+            delete this.unrenderedFeatures[feature.id];
+
+            if (notify) {
+                this.events.triggerEvent("beforefeatureremoved", {
+                    feature: feature
+                });
+            }
+
+            this.features = OpenLayers.Util.removeItem(this.features, feature);
+            // feature has no layer at this point
+            feature.layer = null;
+
+            if (feature.geometry) {
+                this.renderer.eraseFeatures(feature);
+            }
+                    
+            //in the case that this feature is one of the selected features, 
+            // remove it from that array as well.
+            if (OpenLayers.Util.indexOf(this.selectedFeatures, feature) != -1){
+                OpenLayers.Util.removeItem(this.selectedFeatures, feature);
+            }
+
+            if (notify) {
+                this.events.triggerEvent("featureremoved", {
+                    feature: feature
+                });
+            }
+        }
+
+        if (notify) {
+            this.events.triggerEvent("featuresremoved", {features: features});
+        }
+    },
+    
+    /** 
+     * APIMethod: removeAllFeatures
+     * Remove all features from the layer.
+     *
+     * Parameters:
+     * options - {Object} Optional properties for changing behavior of the
+     *     removal.
+     *
+     * Valid options:
+     * silent - {Boolean} Supress event triggering.  Default is false.
+     */
+    removeAllFeatures: function(options) {
+        var notify = !options || !options.silent;
+        var features = this.features;
+        if (notify) {
+            this.events.triggerEvent(
+                "beforefeaturesremoved", {features: features}
+            );
+        }
+        var feature;
+        for (var i = features.length-1; i >= 0; i--) {
+            feature = features[i];
+            if (notify) {
+                this.events.triggerEvent("beforefeatureremoved", {
+                    feature: feature
+                });
+            }
+            feature.layer = null;
+            if (notify) {
+                this.events.triggerEvent("featureremoved", {
+                    feature: feature
+                });
+            }
+        }
+        this.renderer.clear();
+        this.features = [];
+        this.unrenderedFeatures = {};
+        this.selectedFeatures = [];
+        if (notify) {
+            this.events.triggerEvent("featuresremoved", {features: features});
+        }
+    },
+
+    /**
+     * APIMethod: destroyFeatures
+     * Erase and destroy features on the layer.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} An optional array of
+     *     features to destroy.  If not supplied, all features on the layer
+     *     will be destroyed.
+     * options - {Object}
+     */
+    destroyFeatures: function(features, options) {
+        var all = (features == undefined); // evaluates to true if
+                                           // features is null
+        if(all) {
+            features = this.features;
+        }
+        if(features) {
+            this.removeFeatures(features, options);
+            for(var i=features.length-1; i>=0; i--) {
+                features[i].destroy();
+            }
+        }
+    },
+
+    /**
+     * APIMethod: drawFeature
+     * Draw (or redraw) a feature on the layer.  If the optional style argument
+     * is included, this style will be used.  If no style is included, the
+     * feature's style will be used.  If the feature doesn't have a style,
+     * the layer's style will be used.
+     * 
+     * This function is not designed to be used when adding features to 
+     * the layer (use addFeatures instead). It is meant to be used when
+     * the style of a feature has changed, or in some other way needs to 
+     * visually updated *after* it has already been added to a layer. You
+     * must add the feature to the layer for most layer-related events to 
+     * happen.
+     *
+     * Parameters: 
+     * feature - {<OpenLayers.Feature.Vector>} 
+     * style - {String | Object} Named render intent or full symbolizer object.
+     */
+    drawFeature: function(feature, style) {
+        // don't try to draw the feature with the renderer if the layer is not 
+        // drawn itself
+        if (!this.drawn) {
+            return
+        }
+        if (typeof style != "object") {
+            if(!style && feature.state === OpenLayers.State.DELETE) {
+                style = "delete";
+            }
+            var renderIntent = style || feature.renderIntent;
+            style = feature.style || this.style;
+            if (!style) {
+                style = this.styleMap.createSymbolizer(feature, renderIntent);
+            }
+        }
+        
+        if (!this.renderer.drawFeature(feature, style)) {
+            this.unrenderedFeatures[feature.id] = feature;
+        } else {
+            delete this.unrenderedFeatures[feature.id];
+        };
+    },
+    
+    /**
+     * Method: eraseFeatures
+     * Erase features from the layer.
+     *
+     * Parameters:
+     * features - {Array(<OpenLayers.Feature.Vector>)} 
+     */
+    eraseFeatures: function(features) {
+        this.renderer.eraseFeatures(features);
+    },
+
+    /**
+     * Method: getFeatureFromEvent
+     * Given an event, return a feature if the event occurred over one.
+     * Otherwise, return null.
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature if one was under the event.
+     */
+    getFeatureFromEvent: function(evt) {
+        if (!this.renderer) {
+            OpenLayers.Console.error(OpenLayers.i18n("getFeatureError")); 
+            return null;
+        }    
+        var featureId = this.renderer.getFeatureIdFromEvent(evt);
+        return this.getFeatureById(featureId);
+    },
+
+    /**
+     * APIMethod: getFeatureBy
+     * Given a property value, return the feature if it exists in the features array
+     *
+     * Parameters:
+     * property - {String}
+     * value - {String}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature corresponding to the given
+     * property value or null if there is no such feature.
+     */
+    getFeatureBy: function(property, value) {
+        //TBD - would it be more efficient to use a hash for this.features?
+        var feature = null;
+        for(var i=0, len=this.features.length; i<len; ++i) {
+            if(this.features[i][property] == value) {
+                feature = this.features[i];
+                break;
+            }
+        }
+        return feature;
+    },
+
+    /**
+     * APIMethod: getFeatureById
+     * Given a feature id, return the feature if it exists in the features array
+     *
+     * Parameters:
+     * featureId - {String}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature corresponding to the given
+     * featureId or null if there is no such feature.
+     */
+    getFeatureById: function(featureId) {
+        return this.getFeatureBy('id', featureId);
+    },
+
+    /**
+     * APIMethod: getFeatureByFid
+     * Given a feature fid, return the feature if it exists in the features array
+     *
+     * Parameters:
+     * featureFid - {String}
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>} A feature corresponding to the given
+     * featureFid or null if there is no such feature.
+     */
+    getFeatureByFid: function(featureFid) {
+        return this.getFeatureBy('fid', featureFid);
+    },
+
+    /**
+     * Unselect the selected features
+     * i.e. clears the featureSelection array
+     * change the style back
+    clearSelection: function() {
+
+       var vectorLayer = this.map.vectorLayer;
+        for (var i = 0; i < this.map.featureSelection.length; i++) {
+            var featureSelection = this.map.featureSelection[i];
+            vectorLayer.drawFeature(featureSelection, vectorLayer.style);
+        }
+        this.map.featureSelection = [];
+    },
+     */
+
+
+    /**
+     * APIMethod: onFeatureInsert
+     * method called after a feature is inserted.
+     * Does nothing by default. Override this if you
+     * need to do something on feature updates.
+     *
+     * Paarameters: 
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    onFeatureInsert: function(feature) {
+    },
+    
+    /**
+     * APIMethod: preFeatureInsert
+     * method called before a feature is inserted.
+     * Does nothing by default. Override this if you
+     * need to do something when features are first added to the
+     * layer, but before they are drawn, such as adjust the style.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Feature.Vector>} 
+     */
+    preFeatureInsert: function(feature) {
+    },
+
+    /** 
+     * APIMethod: getDataExtent
+     * Calculates the max extent which includes all of the features.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getDataExtent: function () {
+        var maxExtent = null;
+        var features = this.features;
+        if(features && (features.length > 0)) {
+            maxExtent = new OpenLayers.Bounds();
+            var geometry = null;
+            for(var i=0, len=features.length; i<len; i++) {
+                geometry = features[i].geometry;
+                if (geometry) {
+                    maxExtent.extend(geometry.getBounds());
+                }
+            }
+        }
+        return maxExtent;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Vector"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TMS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TMS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/TMS.js	(revision 76)
@@ -0,0 +1,167 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ * @requires OpenLayers/Tile/Image.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.TMS
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.TMS = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * APIProperty: serviceVersion
+     * {String}
+     */
+    serviceVersion: "1.0.0",
+
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean}
+     */
+    isBaseLayer: true,
+
+    /**
+     * APIProperty: tileOrigin
+     * {<OpenLayers.Pixel>}
+     */
+    tileOrigin: null,
+
+    /**
+     * APIProperty: serverResolutions
+     * {Array} A list of all resolutions available on the server.  Only set this 
+     *     property if the map resolutions differs from the server.
+     */
+    serverResolutions: null,
+
+    /**
+     * APIProperty: zoomOffset
+     * {Number} If your cache has more zoom levels than you want to provide
+     *     access to with this layer, supply a zoomOffset.  This zoom offset
+     *     is added to the current map zoom level to determine the level
+     *     for a requested tile.  For example, if you supply a zoomOffset
+     *     of 3, when the map is at the zoom 0, tiles will be requested from
+     *     level 3 of your cache.  Default is 0 (assumes cache level and map
+     *     zoom are equivalent).  Using <zoomOffset> is an alternative to
+     *     setting <serverResolutions> if you only want to expose a subset
+     *     of the server resolutions.
+     */
+    zoomOffset: 0,
+    
+    /**
+     * Constructor: OpenLayers.Layer.TMS
+     * 
+     * Parameters:
+     * name - {String}
+     * url - {String}
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, options) {
+        var newArguments = [];
+        newArguments.push(name, url, {}, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+    },    
+
+    /**
+     * APIMethod:destroy
+     */
+    destroy: function() {
+        // for now, nothing special to do here. 
+        OpenLayers.Layer.Grid.prototype.destroy.apply(this, arguments);  
+    },
+
+    
+    /**
+     * APIMethod: clone
+     * 
+     * Parameters:
+     * obj - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.TMS>} An exact clone of this <OpenLayers.Layer.TMS>
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.TMS(this.name,
+                                           this.url,
+                                           this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },    
+    
+    /**
+     * Method: getURL
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * 
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the 
+     *          passed-in bounds and appropriate tile size specified as 
+     *          parameters
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        var res = this.map.getResolution();
+        var x = Math.round((bounds.left - this.tileOrigin.lon) / (res * this.tileSize.w));
+        var y = Math.round((bounds.bottom - this.tileOrigin.lat) / (res * this.tileSize.h));
+        var z = this.serverResolutions != null ?
+            OpenLayers.Util.indexOf(this.serverResolutions, res) :
+            this.map.getZoom() + this.zoomOffset;
+        var path = this.serviceVersion + "/" + this.layername + "/" + z + "/" + x + "/" + y + "." + this.type; 
+        var url = this.url;
+        if (url instanceof Array) {
+            url = this.selectUrl(path, url);
+        }
+        return url + path;
+    },
+
+    /**
+     * Method: addTile
+     * addTile creates a tile, initializes it, and adds it to the layer div. 
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+
+    /** 
+     * APIMethod: setMap
+     * When the layer is added to a map, then we can fetch our origin 
+     *    (if we don't have one.) 
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.Grid.prototype.setMap.apply(this, arguments);
+        if (!this.tileOrigin) { 
+            this.tileOrigin = new OpenLayers.LonLat(this.map.maxExtent.left,
+                                                this.map.maxExtent.bottom);
+        }                                       
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.TMS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer.js	(revision 76)
@@ -0,0 +1,199 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.MapServer
+ * Instances of OpenLayers.Layer.MapServer are used to display
+ * data from a MapServer CGI instance.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.MapServer = OpenLayers.Class(OpenLayers.Layer.Grid, {
+
+    /**
+     * Constant: DEFAULT_PARAMS
+     * {Object} Hashtable of default parameter key/value pairs 
+     */
+    DEFAULT_PARAMS: {
+        mode: "map",
+        map_imagetype: "png"
+    },
+
+    /**
+     * Constructor: OpenLayers.Layer.MapServer
+     * Create a new MapServer layer object
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * url - {String} Base url for the MapServer CGI
+     *       (e.g. http://www2.dmsolutions.ca/cgi-bin/mapserv)
+     * params - {Object} An object with key/value pairs representing the
+     *          GetMap query string parameters and parameter values.
+     * options - {Ojbect} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = [];
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+
+        this.params = OpenLayers.Util.applyDefaults(
+            this.params, this.DEFAULT_PARAMS
+        );
+
+        // unless explicitly set in options, if the layer is transparent, 
+        // it will be an overlay
+        if (options == null || options.isBaseLayer == null) {
+            this.isBaseLayer = ((this.params.transparent != "true") && 
+                                (this.params.transparent != true));
+        }
+    },
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.MapServer>} An exact clone of this layer
+     */
+    clone: function (obj) {
+        if (obj == null) {
+            obj = new OpenLayers.Layer.MapServer(this.name,
+                                           this.url,
+                                           this.params,
+                                           this.getOptions());
+        }
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },
+
+    /**
+     * Method: addTile
+     * Creates a tile, initializes it, and adds it to the layer div. 
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                         null, this.tileSize);
+    },
+    
+    /**
+     * Method: getURL
+     * Return a query string for this layer
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} A bounds representing the bbox 
+     *                                for the request
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also 
+     *          the passed-in bounds and appropriate tile size specified 
+     *          as parameters.
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        // Make a list, so that getFullRequestString uses literal "," 
+        var extent = [bounds.left, bounds. bottom, bounds.right, bounds.top];
+
+        var imageSize = this.getImageSize(); 
+        
+        // make lists, so that literal ','s are used 
+        var url = this.getFullRequestString(
+                     {mapext:   extent,
+                      imgext:   extent,
+                      map_size: [imageSize.w, imageSize.h],
+                      imgx:     imageSize.w / 2,
+                      imgy:     imageSize.h / 2,
+                      imgxy:    [imageSize.w, imageSize.h]
+                      });
+        
+        return url;
+    },
+    
+    /** 
+     * Method: getFullRequestString
+     * combine the layer's url with its params and these newParams. 
+     *   
+     * Parameter:
+     * newParams - {Object} New parameters that should be added to the 
+     *                      request string.
+     * altUrl - {String} (optional) Replace the URL in the full request  
+     *                              string with the provided URL.
+     * 
+     * Returns: 
+     * {String} A string with the layer's url and parameters embedded in it.
+     */
+    getFullRequestString:function(newParams, altUrl) {
+        // use layer's url unless altUrl passed in
+        var url = (altUrl == null) ? this.url : altUrl;
+        
+        // create a new params hashtable with all the layer params and the 
+        // new params together. then convert to string
+        var allParams = OpenLayers.Util.extend({}, this.params);
+        allParams = OpenLayers.Util.extend(allParams, newParams);
+        var paramsString = OpenLayers.Util.getParameterString(allParams);
+        
+        // if url is not a string, it should be an array of strings, 
+        // in which case we will deterministically select one of them in 
+        // order to evenly distribute requests to different urls.
+        if (url instanceof Array) {
+            url = this.selectUrl(paramsString, url);
+        }   
+        
+        // ignore parameters that are already in the url search string
+        var urlParams = OpenLayers.Util.upperCaseObject(
+                            OpenLayers.Util.getParameters(url));
+        for(var key in allParams) {
+            if(key.toUpperCase() in urlParams) {
+                delete allParams[key];
+            }
+        }
+        paramsString = OpenLayers.Util.getParameterString(allParams);
+        
+        // requestString always starts with url
+        var requestString = url;        
+
+        // MapServer needs '+' seperating things like bounds/height/width.
+        //   Since typically this is URL encoded, we use a slight hack: we
+        //  depend on the list-like functionality of getParameterString to
+        //  leave ',' only in the case of list items (since otherwise it is
+        //  encoded) then do a regular expression replace on the , characters
+        //  to '+'
+        //
+        paramsString = paramsString.replace(/,/g, "+");
+        
+        if (paramsString != "") {
+            var lastServerChar = url.charAt(url.length - 1);
+            if ((lastServerChar == "&") || (lastServerChar == "?")) {
+                requestString += paramsString;
+            } else {
+                if (url.indexOf('?') == -1) {
+                    //serverPath has no ? -- add one
+                    requestString += '?' + paramsString;
+                } else {
+                    //serverPath contains ?, so must already have paramsString at the end
+                    requestString += '&' + paramsString;
+                }
+            }
+        }
+        return requestString;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.MapServer"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/SphericalMercator.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/SphericalMercator.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/SphericalMercator.js	(revision 76)
@@ -0,0 +1,196 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer.js
+ * @requires OpenLayers/Projection.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.SphericalMercator
+ * A mixin for layers that wraps up the pieces neccesary to have a coordinate
+ *     conversion for working with commercial APIs which use a spherical
+ *     mercator projection.  Using this layer as a base layer, additional
+ *     layers can be used as overlays if they are in the same projection.
+ *
+ * A layer is given properties of this object by setting the sphericalMercator
+ *     property to true.
+ *
+ * More projection information:
+ *  - http://spatialreference.org/ref/user/google-projection/
+ *
+ * Proj4 Text:
+ *     +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0
+ *     +k=1.0 +units=m +nadgrids=@null +no_defs
+ *
+ * WKT:
+ *     900913=PROJCS["WGS84 / Simple Mercator", GEOGCS["WGS 84",
+ *     DATUM["WGS_1984", SPHEROID["WGS_1984", 6378137.0, 298.257223563]], 
+ *     PRIMEM["Greenwich", 0.0], UNIT["degree", 0.017453292519943295], 
+ *     AXIS["Longitude", EAST], AXIS["Latitude", NORTH]],
+ *     PROJECTION["Mercator_1SP_Google"], 
+ *     PARAMETER["latitude_of_origin", 0.0], PARAMETER["central_meridian", 0.0], 
+ *     PARAMETER["scale_factor", 1.0], PARAMETER["false_easting", 0.0], 
+ *     PARAMETER["false_northing", 0.0], UNIT["m", 1.0], AXIS["x", EAST],
+ *     AXIS["y", NORTH], AUTHORITY["EPSG","900913"]]
+ */
+OpenLayers.Layer.SphericalMercator = {
+
+    /**
+     * Method: getExtent
+     * Get the map's extent.
+     *
+     * Returns:
+     * {<OpenLayers.Bounds>} The map extent.
+     */
+    getExtent: function() {
+        var extent = null;
+        if (this.sphericalMercator) {
+            extent = this.map.calculateBounds();
+        } else {
+            extent = OpenLayers.Layer.FixedZoomLevels.prototype.getExtent.apply(this);
+        }
+        return extent;
+    },
+
+    /**
+     * Method: getLonLatFromViewPortPx
+     * Get a map location from a pixel location
+     * 
+     * Parameters:
+     * viewPortPx - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     *  {<OpenLayers.LonLat>} An OpenLayers.LonLat which is the passed-in view
+     *  port OpenLayers.Pixel, translated into lon/lat by map lib
+     *  If the map lib is not loaded or not centered, returns null
+     */
+    getLonLatFromViewPortPx: function (viewPortPx) {
+        return OpenLayers.Layer.prototype.getLonLatFromViewPortPx.apply(this, arguments);
+    },
+    
+    /**
+     * Method: getViewPortPxFromLonLat
+     * Get a pixel location from a map location
+     *
+     * Parameters:
+     * lonlat - {<OpenLayers.LonLat>}
+     *
+     * Returns:
+     * {<OpenLayers.Pixel>} An OpenLayers.Pixel which is the passed-in
+     * OpenLayers.LonLat, translated into view port pixels by map lib
+     * If map lib is not loaded or not centered, returns null
+     */
+    getViewPortPxFromLonLat: function (lonlat) {
+        return OpenLayers.Layer.prototype.getViewPortPxFromLonLat.apply(this, arguments);
+    },
+
+    /** 
+     * Method: initMercatorParameters 
+     * Set up the mercator parameters on the layer: resolutions,
+     *     projection, units.
+     */
+    initMercatorParameters: function() {
+        // set up properties for Mercator - assume EPSG:900913
+        this.RESOLUTIONS = [];
+        var maxResolution = 156543.0339;
+        for(var zoom=0; zoom<=this.MAX_ZOOM_LEVEL; ++zoom) {
+            this.RESOLUTIONS[zoom] = maxResolution / Math.pow(2, zoom);
+        }
+        this.units = "m";
+        this.projection = this.projection || "EPSG:900913";
+    },
+
+    /**
+     * APIMethod: forwardMercator
+     * Given a lon,lat in EPSG:4326, return a point in Spherical Mercator.
+     *
+     * Parameters:
+     * lon - {float} 
+     * lat - {float}
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} The coordinates transformed to Mercator.
+     */
+    forwardMercator: function(lon, lat) {
+        var x = lon * 20037508.34 / 180;
+        var y = Math.log(Math.tan((90 + lat) * Math.PI / 360)) / (Math.PI / 180);
+
+        y = y * 20037508.34 / 180;
+        
+        return new OpenLayers.LonLat(x, y);
+    },
+
+    /**
+     * APIMethod: inverseMercator
+     * Given a x,y in Spherical Mercator, return a point in EPSG:4326.
+     *
+     * Parameters:
+     * x - {float} A map x in Spherical Mercator.
+     * y - {float} A map y in Spherical Mercator.
+     * 
+     * Returns:
+     * {<OpenLayers.LonLat>} The coordinates transformed to EPSG:4326.
+     */
+    inverseMercator: function(x, y) {
+
+        var lon = (x / 20037508.34) * 180;
+        var lat = (y / 20037508.34) * 180;
+
+        lat = 180/Math.PI * (2 * Math.atan(Math.exp(lat * Math.PI / 180)) - Math.PI / 2);
+        
+        return new OpenLayers.LonLat(lon, lat);
+    },
+
+    /**
+     * Method: projectForward 
+     * Given an object with x and y properties in EPSG:4326, modify the x,y
+     * properties on the object to be the Spherical Mercator projected
+     * coordinates.
+     *
+     * Parameters:
+     * point - {Object} An object with x and y properties. 
+     * 
+     * Returns:
+     * {Object} The point, with the x and y properties transformed to spherical
+     * mercator.
+     */
+    projectForward: function(point) {
+        var lonlat = OpenLayers.Layer.SphericalMercator.forwardMercator(point.x, point.y);
+        point.x = lonlat.lon;
+        point.y = lonlat.lat;
+        return point;
+    },
+    
+    /**
+     * Method: projectInverse
+     * Given an object with x and y properties in Spherical Mercator, modify
+     * the x,y properties on the object to be the unprojected coordinates.
+     *
+     * Parameters:
+     * point - {Object} An object with x and y properties. 
+     * 
+     * Returns:
+     * {Object} The point, with the x and y properties transformed from
+     * spherical mercator to unprojected coordinates..
+     */
+    projectInverse: function(point) {
+        var lonlat = OpenLayers.Layer.SphericalMercator.inverseMercator(point.x, point.y);
+        point.x = lonlat.lon;
+        point.y = lonlat.lat;
+        return point;
+    }
+
+};
+
+/**
+ * Note: Two transforms declared
+ * Transforms from EPSG:4326 to EPSG:900913 and from EPSG:900913 to EPSG:4326
+ *     are set by this class.
+ */
+OpenLayers.Projection.addTransform("EPSG:4326", "EPSG:900913",
+    OpenLayers.Layer.SphericalMercator.projectForward);
+OpenLayers.Projection.addTransform("EPSG:900913", "EPSG:4326",
+    OpenLayers.Layer.SphericalMercator.projectInverse);
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WorldWind.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WorldWind.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WorldWind.js	(revision 76)
@@ -0,0 +1,120 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer/Grid.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WorldWind
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Grid>
+ */
+OpenLayers.Layer.WorldWind = OpenLayers.Class(OpenLayers.Layer.Grid, {
+    
+    DEFAULT_PARAMS: {
+    },
+
+    /**
+     * APIProperty: isBaseLayer
+     * WorldWind layer is a base layer by default.
+     */
+    isBaseLayer: true,    
+
+    
+    /** 
+     * APIProperty: lzd
+     * LevelZeroTileSizeDegrees
+     */
+    lzd: null,
+
+    /**
+     * APIProperty: zoomLevels
+     * Number of zoom levels.
+     */
+    zoomLevels: null,
+    
+    /**
+     * Constructor: OpenLayers.Layer.WorldWind
+     * 
+     * Parameters:
+     * name - {String} Name of Layer
+     * url - {String} Base URL  
+     * lzd - {Float} Level zero tile size degrees 
+     * zoomLevels - {Int} number of zoom levels
+     * params - {Object} additional parameters
+     * options - {Object} additional options
+     */
+    initialize: function(name, url, lzd, zoomLevels, params, options) {
+        this.lzd = lzd;
+        this.zoomLevels = zoomLevels;
+        var newArguments = [];
+        newArguments.push(name, url, params, options);
+        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
+        this.params = OpenLayers.Util.applyDefaults(
+            this.params, this.DEFAULT_PARAMS
+        );
+    },
+    /**
+     * Method: addTile
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>}
+     * position - {<OpenLayers.Pixel>}
+     * 
+     * Returns:
+     * {<OpenLayers.Tile.Image>} The added OpenLayers.Tile.Image
+     */
+    addTile:function(bounds,position) {
+        return new OpenLayers.Tile.Image(this, position, bounds, 
+                                             null, this.tileSize);
+    },
+
+    /**
+     * Method: getZoom
+     * Convert map zoom to WW zoom.
+     */
+    getZoom: function () {
+        var zoom = this.map.getZoom();
+        var extent = this.map.getMaxExtent();
+        zoom = zoom - Math.log(this.maxResolution / (this.lzd/512))/Math.log(2);
+        return zoom;
+    },
+
+    /**
+     * Method: getURL
+     *
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     *
+     * Returns:
+     * {String} A string with the layer's url and parameters and also the 
+     *           passed-in bounds and appropriate tile size specified as 
+     *           parameters
+     */
+    getURL: function (bounds) {
+        bounds = this.adjustBounds(bounds);
+        var zoom = this.getZoom();
+        var extent = this.map.getMaxExtent();
+        var deg = this.lzd/Math.pow(2,this.getZoom());
+        var x = Math.floor((bounds.left - extent.left)/deg);
+        var y = Math.floor((bounds.bottom - extent.bottom)/deg);
+        if (this.map.getResolution() <= (this.lzd/512)
+            && this.getZoom() <= this.zoomLevels) {
+            return this.getFullRequestString(
+              { L: zoom, 
+                X: x,
+                Y: y
+              });
+        } else {
+            return OpenLayers.Util.getImagesLocation() + "blank.gif";
+        }
+
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.WorldWind"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/PointTrack.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/PointTrack.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/PointTrack.js	(revision 76)
@@ -0,0 +1,103 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Vector.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.PointTrack
+ * Vector layer to display ordered point features as a line, creating one
+ * LineString feature for each pair of two points.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Vector> 
+ */
+OpenLayers.Layer.PointTrack = OpenLayers.Class(OpenLayers.Layer.Vector, {
+  
+    /**
+     * APIProperty:
+     * dataFrom  - {<OpenLayers.Layer.PointTrack.dataFrom>} optional. If the
+     *             lines should get the data/attributes from one of the two
+     *             points, creating it, which one should it be?
+     */
+    dataFrom: null,
+    
+    /**
+     * Constructor: OpenLayers.PointTrack
+     * Constructor for a new OpenLayers.PointTrack instance.
+     *
+     * Parameters:
+     * name     - {String} name of the layer
+     * options  - {Object} Optional object with properties to tag onto the
+     *            instance.
+     */    
+    initialize: function(name, options) {
+        OpenLayers.Layer.Vector.prototype.initialize.apply(this, arguments);
+    },
+        
+    /**
+     * APIMethod: addNodes
+     * Adds point features that will be used to create lines from, using point
+     * pairs. The first point of a pair will be the source node, the second
+     * will be the target node.
+     * 
+     * Parameters:
+     * pointFeatures - {Array(<OpenLayers.Feature>)}
+     * 
+     */
+    addNodes: function(pointFeatures) {
+        if (pointFeatures.length < 2) {
+            OpenLayers.Console.error(
+                    "At least two point features have to be added to create" +
+                    "a line from");
+            return;
+        }
+        
+        var lines = new Array(pointFeatures.length-1);
+        
+        var pointFeature, startPoint, endPoint;
+        for(var i=0, len=pointFeatures.length; i<len; i++) {
+            pointFeature = pointFeatures[i];
+            endPoint = pointFeature.geometry;
+            
+            if (!endPoint) {
+              var lonlat = pointFeature.lonlat;
+              endPoint = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
+            } else if(endPoint.CLASS_NAME != "OpenLayers.Geometry.Point") {
+                OpenLayers.Console.error(
+                        "Only features with point geometries are supported.");
+                return;
+            }
+            
+            if(i > 0) {
+                var attributes = (this.dataFrom != null) ?
+                        (pointFeatures[i+this.dataFrom].data ||
+                                pointFeatures[i+this.dataFrom].attributes) :
+                        null;
+                var line = new OpenLayers.Geometry.LineString([startPoint,
+                        endPoint]);
+                        
+                lines[i-1] = new OpenLayers.Feature.Vector(line, attributes);
+            }
+            
+            startPoint = endPoint;
+        }
+
+        this.addFeatures(lines);
+    },
+    
+    CLASS_NAME: "OpenLayers.Layer.PointTrack"
+});
+
+/**
+ * Constant: OpenLayers.Layer.PointTrack.dataFrom
+ * {Object} with the following keys
+ * - SOURCE_NODE: take data/attributes from the source node of the line
+ * - TARGET_NODE: take data/attributes from the target node of the line
+ */
+OpenLayers.Layer.PointTrack.dataFrom = {'SOURCE_NODE': -1, 'TARGET_NODE': 0};
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/FixedZoomLevels.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/FixedZoomLevels.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/FixedZoomLevels.js	(revision 76)
@@ -0,0 +1,315 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.FixedZoomLevels
+ *   Some Layers will already have established zoom levels (like google 
+ *    or ve). Instead of trying to determine them and populate a resolutions[]
+ *    Array with those values, we will hijack the resolution functionality
+ *    here.
+ * 
+ *   When you subclass FixedZoomLevels: 
+ * 
+ *   The initResolutions() call gets nullified, meaning no resolutions[] array 
+ *    is set up. Which would be a big problem getResolution() in Layer, since 
+ *    it merely takes map.zoom and indexes into resolutions[]... but....
+ * 
+ *   The getResolution() call is also overridden. Instead of using the 
+ *    resolutions[] array, we simply calculate the current resolution based
+ *    on the current extent and the current map size. But how will we be able
+ *    to calculate the current extent without knowing the resolution...?
+ *  
+ *   The getExtent() function is also overridden. Instead of calculating extent
+ *    based on the center point and the current resolution, we instead 
+ *    calculate the extent by getting the lonlats at the top-left and 
+ *    bottom-right by using the getLonLatFromViewPortPx() translation function,
+ *    taken from the pixel locations (0,0) and the size of the map. But how 
+ *    will we be able to do lonlat-px translation without resolution....?
+ * 
+ *   The getZoomForResolution() method is overridden. Instead of indexing into
+ *    the resolutions[] array, we call OpenLayers.Layer.getExent(), passing in
+ *    the desired resolution. With this extent, we then call getZoomForExtent() 
+ * 
+ * 
+ *   Whenever you implement a layer using OpenLayers.Layer.FixedZoomLevels, 
+ *    it is your responsibility to provide the following three functions:
+ * 
+ *   - getLonLatFromViewPortPx
+ *   - getViewPortPxFromLonLat
+ *   - getZoomForExtent
+ * 
+ *  ...those three functions should generally be provided by any reasonable 
+ *  API that you might be working from.
+ *
+ */
+OpenLayers.Layer.FixedZoomLevels = OpenLayers.Class({
+      
+  /********************************************************/
+  /*                                                      */
+  /*                 Baselayer Functions                  */
+  /*                                                      */
+  /*    The following functions must all be implemented   */
+  /*                  by all base layers                  */
+  /*                                                      */
+  /********************************************************/
+    
+    /**
+     * Constructor: OpenLayers.Layer.FixedZoomLevels
+     * Create a new fixed zoom levels layer.
+     */
+    initialize: function() {
+        //this class is only just to add the following functions... 
+        // nothing to actually do here... but it is probably a good
+        // idea to have layers that use these functions call this 
+        // inititalize() anyways, in case at some point we decide we 
+        // do want to put some functionality or state in here. 
+    },
+    
+    /**
+     * Method: initResolutions
+     * Populate the resolutions array
+     */
+    initResolutions: function() {
+
+        var props = new Array('minZoomLevel', 'maxZoomLevel', 'numZoomLevels');
+          
+        for(var i=0, len=props.length; i<len; i++) {
+            var property = props[i];
+            this[property] = (this.options[property] != null)  
+                                     ? this.options[property] 
+                                     : this.map[property];
+        }
+
+        if ( (this.minZoomLevel == null) ||
+             (this.minZoomLevel < this.MIN_ZOOM_LEVEL) ){
+            this.minZoomLevel = this.MIN_ZOOM_LEVEL;
+        }        
+
+        //
+        // At this point, we know what the minimum desired zoom level is, and
+        //  we must calculate the total number of zoom levels. 
+        //  
+        //  Because we allow for the setting of either the 'numZoomLevels'
+        //   or the 'maxZoomLevel' properties... on either the layer or the  
+        //   map, we have to define some rules to see which we take into
+        //   account first in this calculation. 
+        //
+        // The following is the precedence list for these properties:
+        // 
+        // (1) numZoomLevels set on layer
+        // (2) maxZoomLevel set on layer
+        // (3) numZoomLevels set on map
+        // (4) maxZoomLevel set on map*
+        // (5) none of the above*
+        //
+        // *Note that options (4) and (5) are only possible if the user 
+        //  _explicitly_ sets the 'numZoomLevels' property on the map to 
+        //  null, since it is set by default to 16. 
+        //
+
+        //
+        // Note to future: In 3.0, I think we should remove the default 
+        // value of 16 for map.numZoomLevels. Rather, I think that value 
+        // should be set as a default on the Layer.WMS class. If someone
+        // creates a 3rd party layer and does not specify any 'minZoomLevel', 
+        // 'maxZoomLevel', or 'numZoomLevels', and has not explicitly 
+        // specified any of those on the map object either.. then I think
+        // it is fair to say that s/he wants all the zoom levels available.
+        // 
+        // By making map.numZoomLevels *null* by default, that will be the 
+        // case. As it is, I don't feel comfortable changing that right now
+        // as it would be a glaring API change and actually would probably
+        // break many peoples' codes. 
+        //
+
+        //the number of zoom levels we'd like to have.
+        var desiredZoomLevels;
+
+        //this is the maximum number of zoom levels the layer will allow, 
+        // given the specified starting minimum zoom level.
+        var limitZoomLevels = this.MAX_ZOOM_LEVEL - this.minZoomLevel + 1;
+
+        if ( ((this.options.numZoomLevels == null) && 
+              (this.options.maxZoomLevel != null)) // (2)
+              ||
+             ((this.numZoomLevels == null) &&
+              (this.maxZoomLevel != null)) // (4)
+           ) {
+            //calculate based on specified maxZoomLevel (on layer or map)
+            desiredZoomLevels = this.maxZoomLevel - this.minZoomLevel + 1;
+        } else {
+            //calculate based on specified numZoomLevels (on layer or map)
+            // this covers cases (1) and (3)
+            desiredZoomLevels = this.numZoomLevels;
+        }
+
+        if (desiredZoomLevels != null) {
+            //Now that we know what we would *like* the number of zoom levels
+            // to be, based on layer or map options, we have to make sure that
+            // it does not conflict with the actual limit, as specified by 
+            // the constants on the layer itself (and calculated into the
+            // 'limitZoomLevels' variable). 
+            this.numZoomLevels = Math.min(desiredZoomLevels, limitZoomLevels);
+        } else {
+            // case (5) -- neither 'numZoomLevels' not 'maxZoomLevel' was 
+            // set on either the layer or the map. So we just use the 
+            // maximum limit as calculated by the layer's constants.
+            this.numZoomLevels = limitZoomLevels;
+        }
+
+        //now that the 'numZoomLevels' is appropriately, safely set, 
+        // we go back and re-calculate the 'maxZoomLevel'.
+        this.maxZoomLevel = this.minZoomLevel + this.numZoomLevels - 1;
+
+        if (this.RESOLUTIONS != null) {
+            var resolutionsIndex = 0;
+            this.resolutions = [];
+            for(var i= this.minZoomLevel; i <= this.maxZoomLevel; i++) {
+                this.resolutions[resolutionsIndex++] = this.RESOLUTIONS[i];            
+            }
+            this.maxResolution = this.resolutions[0];
+            this.minResolution = this.resolutions[this.resolutions.length - 1];
+        }       
+    },
+    
+    /**
+     * APIMethod: getResolution
+     * Get the current map resolution
+     * 
+     * Returns:
+     * {Float} Map units per Pixel
+     */
+    getResolution: function() {
+
+        if (this.resolutions != null) {
+            return OpenLayers.Layer.prototype.getResolution.apply(this, arguments);
+        } else {
+            var resolution = null;
+            
+            var viewSize = this.map.getSize();
+            var extent = this.getExtent();
+            
+            if ((viewSize != null) && (extent != null)) {
+                resolution = Math.max( extent.getWidth()  / viewSize.w,
+                                       extent.getHeight() / viewSize.h );
+            }
+            return resolution;
+        }
+     },
+
+    /**
+     * APIMethod: getExtent
+     * Calculates using px-> lonlat translation functions on tl and br 
+     *     corners of viewport
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>} A Bounds object which represents the lon/lat 
+     *                       bounds of the current viewPort.
+     */
+    getExtent: function () {
+        var extent = null;
+        
+        
+        var size = this.map.getSize();
+        
+        var tlPx = new OpenLayers.Pixel(0,0);
+        var tlLL = this.getLonLatFromViewPortPx(tlPx);
+
+        var brPx = new OpenLayers.Pixel(size.w, size.h);
+        var brLL = this.getLonLatFromViewPortPx(brPx);
+        
+        if ((tlLL != null) && (brLL != null)) {
+            extent = new OpenLayers.Bounds(tlLL.lon, 
+                                       brLL.lat, 
+                                       brLL.lon, 
+                                       tlLL.lat);
+        }
+
+        return extent;
+    },
+
+    /**
+     * Method: getZoomForResolution
+     * Get the zoom level for a given resolution
+     *
+     * Parameters:
+     * resolution - {Float}
+     *
+     * Returns:
+     * {Integer} A suitable zoom level for the specified resolution.
+     *           If no baselayer is set, returns null.
+     */
+    getZoomForResolution: function(resolution) {
+      
+        if (this.resolutions != null) {
+            return OpenLayers.Layer.prototype.getZoomForResolution.apply(this, arguments);
+        } else {
+            var extent = OpenLayers.Layer.prototype.getExtent.apply(this, []);
+            return this.getZoomForExtent(extent);
+        }
+    },
+
+
+
+    
+    /********************************************************/
+    /*                                                      */
+    /*             Translation Functions                    */
+    /*                                                      */
+    /*    The following functions translate GMaps and OL    */ 
+    /*     formats for Pixel, LonLat, Bounds, and Zoom      */
+    /*                                                      */
+    /********************************************************/
+    
+    
+    //
+    // TRANSLATION: MapObject Zoom <-> OpenLayers Zoom
+    //
+  
+    /**
+     * Method: getOLZoomFromMapObjectZoom
+     * Get the OL zoom index from the map object zoom level
+     *
+     * Parameters:
+     * moZoom - {Integer}
+     * 
+     * Returns:
+     * {Integer} An OpenLayers Zoom level, translated from the passed in zoom
+     *           Returns null if null value is passed in
+     */
+    getOLZoomFromMapObjectZoom: function(moZoom) {
+        var zoom = null;
+        if (moZoom != null) {
+            zoom = moZoom - this.minZoomLevel;
+        }
+        return zoom;
+    },
+    
+    /**
+     * Method: getMapObjectZoomFromOLZoom
+     * Get the map object zoom level from the OL zoom level
+     *
+     * Parameters:
+     * olZoom - {Integer}
+     * 
+     * Returns:
+     * {Integer} A MapObject level, translated from the passed in olZoom
+     *           Returns null if null value is passed in
+     */
+    getMapObjectZoomFromOLZoom: function(olZoom) {
+        var zoom = null; 
+        if (olZoom != null) {
+            zoom = olZoom + this.minZoomLevel;
+        }
+        return zoom;
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.FixedZoomLevels"
+});
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Boxes.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Boxes.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Boxes.js	(revision 76)
@@ -0,0 +1,76 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer.js
+ * @requires OpenLayers/Layer/Markers.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Boxes
+ * Draw divs as 'boxes' on the layer. 
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Markers>
+ */
+OpenLayers.Layer.Boxes = OpenLayers.Class(OpenLayers.Layer.Markers, {
+
+    /**
+     * Constructor: OpenLayers.Layer.Boxes
+     *
+     * Parameters:
+     * name - {String} 
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function (name, options) {
+        OpenLayers.Layer.Markers.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * Method: drawMarker 
+     * Calculate the pixel location for the marker, create it, and
+     *    add it to the layer's div
+     *
+     * Parameters: 
+     * marker - {<OpenLayers.Marker.Box>} 
+     */
+    drawMarker: function(marker) {
+        var bounds   = marker.bounds;
+        var topleft  = this.map.getLayerPxFromLonLat(
+                            new OpenLayers.LonLat(bounds.left,  bounds.top));
+        var botright = this.map.getLayerPxFromLonLat(
+                             new OpenLayers.LonLat(bounds.right, bounds.bottom));
+        if (botright == null || topleft == null) {
+            marker.display(false);
+        } else {
+            var sz = new OpenLayers.Size(
+                Math.max(1, botright.x - topleft.x),
+                Math.max(1, botright.y - topleft.y));
+            var markerDiv = marker.draw(topleft, sz);
+            if (!marker.drawn) {
+                this.div.appendChild(markerDiv);
+                marker.drawn = true;
+            }
+        }
+    },
+
+
+    /**
+     * APIMethod: removeMarker 
+     * 
+     * Parameters:
+     * marker - {<OpenLayers.Marker.Box>} 
+     */
+    removeMarker: function(marker) {
+        OpenLayers.Util.removeItem(this.markers, marker);
+        if ((marker.div != null) &&
+            (marker.div.parentNode == this.div) ) {
+            this.div.removeChild(marker.div);    
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Boxes"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector/RootContainer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector/RootContainer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/Vector/RootContainer.js	(revision 76)
@@ -0,0 +1,157 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/Vector.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.Vector.RootContainer
+ * A special layer type to combine multiple vector layers inside a single
+ *     renderer root container. This class is not supposed to be instantiated
+ *     from user space, it is a helper class for controls that require event
+ *     processing for multiple vector layers.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Layer.Vector>
+ */
+OpenLayers.Layer.Vector.RootContainer = OpenLayers.Class(OpenLayers.Layer.Vector, {
+    
+    /**
+     * Property: displayInLayerSwitcher
+     * Set to false for this layer type
+     */
+    displayInLayerSwitcher: false,
+    
+    /**
+     * APIProperty: layers
+     * Layers that are attached to this container. Required config option.
+     */
+    layers: null,
+    
+    /**
+     * Constructor: OpenLayers.Layer.Vector.RootContainer
+     * Create a new root container for multiple vector layer. This constructor
+     * is not supposed to be used from user space, it is only to be used by
+     * controls that need feature selection across multiple vector layers.
+     *
+     * Parameters:
+     * name - {String} A name for the layer
+     * options - {Object} Optional object with non-default properties to set on
+     *           the layer.
+     * 
+     * Required options properties:
+     * layers - {Array(<OpenLayers.Layer.Vector>)} The layers managed by this
+     *     container
+     *
+     * Returns:
+     * {<OpenLayers.Layer.Vector.RootContainer>} A new vector layer root
+     *     container
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.Vector.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * Method: display
+     */
+    display: function() {},
+    
+    /**
+     * Method: getFeatureFromEvent
+     * walk through the layers to find the feature returned by the event
+     * 
+     * Parameters:
+     * evt - {Object} event object with a feature property
+     * 
+     * Returns:
+     * {<OpenLayers.Feature.Vector>}
+     */
+    getFeatureFromEvent: function(evt) {
+        var layers = this.layers;
+        var feature;
+        for(var i=0; i<layers.length; i++) {
+            feature = layers[i].getFeatureFromEvent(evt);
+            if(feature) {
+                return feature;
+            }
+        }
+    },
+    
+    /**
+     * Method: setMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    setMap: function(map) {
+        OpenLayers.Layer.Vector.prototype.setMap.apply(this, arguments);
+        this.collectRoots();
+        map.events.register("changelayer", this, this.handleChangeLayer);
+    },
+    
+    /**
+     * Method: removeMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>}
+     */
+    removeMap: function(map) {
+        map.events.unregister("changelayer", this, this.handleChangeLayer);
+        this.resetRoots();
+        OpenLayers.Layer.Vector.prototype.removeMap.apply(this, arguments);
+    },
+    
+    /**
+     * Method: collectRoots
+     * Collects the root nodes of all layers this control is configured with
+     * and moveswien the nodes to this control's layer
+     */
+    collectRoots: function() {
+        var layer;
+        // walk through all map layers, because we want to keep the order
+        for(var i=0; i<this.map.layers.length; ++i) {
+            layer = this.map.layers[i];
+            if(OpenLayers.Util.indexOf(this.layers, layer) != -1) {
+                layer.renderer.moveRoot(this.renderer);
+            }
+        }
+    },
+    
+    /**
+     * Method: resetRoots
+     * Resets the root nodes back into the layers they belong to.
+     */
+    resetRoots: function() {
+        var layer;
+        for(var i=0; i<this.layers.length; ++i) {
+            layer = this.layers[i];
+            if(this.renderer && layer.renderer.getRenderLayerId() == this.id) {
+                this.renderer.moveRoot(layer.renderer);
+            }
+        }
+    },
+    
+    /**
+     * Method: handleChangeLayer
+     * Event handler for the map's changelayer event. We need to rebuild
+     * this container's layer dom if order of one of its layers changes.
+     * This handler is added with the setMap method, and removed with the
+     * removeMap method.
+     * 
+     * Parameters:
+     * evt - {Object}
+     */
+    handleChangeLayer: function(evt) {
+        var layer = evt.layer;
+        if(evt.property == "order" &&
+                        OpenLayers.Util.indexOf(this.layers, layer) != -1) {
+            this.resetRoots();
+            this.collectRoots();
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.Vector.RootContainer"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MultiMap.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MultiMap.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MultiMap.js	(revision 76)
@@ -0,0 +1,284 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Layer/EventPane.js
+ * @requires OpenLayers/Layer/FixedZoomLevels.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.MultiMap
+ * Note that MultiMap does not fully support the sphericalMercator
+ * option. See Ticket #953 for more details.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.EventPane>
+ *  - <OpenLayers.Layer.FixedZoomLevels>
+ */
+OpenLayers.Layer.MultiMap = OpenLayers.Class(
+  OpenLayers.Layer.EventPane, OpenLayers.Layer.FixedZoomLevels, {
+    
+    /** 
+     * Constant: MIN_ZOOM_LEVEL
+     * {Integer} 1 
+     */
+    MIN_ZOOM_LEVEL: 1,
+    
+    /** 
+     * Constant: MAX_ZOOM_LEVEL
+     * {Integer} 17
+     */
+    MAX_ZOOM_LEVEL: 17,
+
+    /** 
+     * Constant: RESOLUTIONS
+     * {Array(Float)} Hardcode these resolutions so that they are more closely
+     *                tied with the standard wms projection
+     */
+    RESOLUTIONS: [
+        9, 
+        1.40625,
+        0.703125,
+        0.3515625,
+        0.17578125,
+        0.087890625,
+        0.0439453125,
+        0.02197265625,
+        0.010986328125,
+        0.0054931640625,
+        0.00274658203125,
+        0.001373291015625,
+        0.0006866455078125,
+        0.00034332275390625,
+        0.000171661376953125,
+        0.0000858306884765625,
+        0.00004291534423828125
+    ],
+
+    /**
+     * APIProperty: type
+     * {?}
+     */
+    type: null,
+
+    /** 
+     * Constructor: OpenLayers.Layer.MultiMap
+     * 
+     * Parameters:
+     * name - {String}
+     * options - {Object}
+     */
+    initialize: function(name, options) {
+        OpenLayers.Layer.EventPane.prototype.initialize.apply(this, arguments);
+        OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this, 
+                                                                    arguments);
+        if (this.sphericalMercator) {
+            OpenLayers.Util.extend(this, OpenLayers.Layer.SphericalMercator);
+            this.initMercatorParameters();
+            this.RESOLUTIONS.unshift(10); 
+        }    
+    },
+    
+    /**
+     * Method: loadMapObject
+     */
+    loadMapObject:function() {
+        try { //crash proofing
+            this.mapObject = new MultimapViewer(this.div);
+        } catch (e) { }
+    },
+
+    /** 
+     * APIMethod: getWarningHTML
+     * 
+     * Returns: 
+     * {String} String with information on why layer is broken, how to get
+     *          it working.
+     */
+    getWarningHTML:function() {
+        return OpenLayers.i18n(
+            "getLayerWarning", {'layerType':"MM", 'layerLib':"MultiMap"}
+        );
+    },
+
+
+
+    /************************************
+     *                                  *
+     *   MapObject Interface Controls   *
+     *                                  *
+     ************************************/
+
+
+  // Get&Set Center, Zoom
+
+    /** 
+     * APIMethod: setMapObjectCenter
+     * Set the mapObject to the specified center and zoom
+     * 
+     * Parameters:
+     * center - {Object} MapObject LonLat format
+     * zoom - {int} MapObject zoom format
+     */
+    setMapObjectCenter: function(center, zoom) {
+        this.mapObject.goToPosition(center, zoom); 
+    },
+   
+    /**
+     * APIMethod: getMapObjectCenter
+     * 
+     * Returns: 
+     * {Object} The mapObject's current center in Map Object format
+     */
+    getMapObjectCenter: function() {
+        return this.mapObject.getCurrentPosition();
+    },
+
+    /** 
+     * APIMethod: getMapObjectZoom
+     * 
+     * Returns:
+     * {Integer} The mapObject's current zoom, in Map Object format
+     */
+    getMapObjectZoom: function() {
+        return this.mapObject.getZoomFactor();
+    },
+
+
+  // LonLat - Pixel Translation
+  
+    /**
+     * APIMethod: getMapObjectLonLatFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Object} MapObject LonLat translated from MapObject Pixel
+     */
+    getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
+        moPixel.x = moPixel.x - (this.map.getSize().w/2);
+        moPixel.y = moPixel.y - (this.map.getSize().h/2);
+        return this.mapObject.getMapPositionAt(moPixel);
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Object} MapObject Pixel transtlated from MapObject LonLat
+     */
+    getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
+        return this.mapObject.geoPosToContainerPixels(moLonLat);
+    },
+
+
+    /************************************
+     *                                  *
+     *       MapObject Primitives       *
+     *                                  *
+     ************************************/
+
+
+  // LonLat
+    
+    /**
+     * APIMethod: getLongitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Longitude of the given MapObject LonLat
+     */
+    getLongitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.lon, moLonLat.lat).lon :
+            moLonLat.lon;
+    },
+
+    /**
+     * APIMethod: getLatitudeFromMapObjectLonLat
+     * 
+     * Parameters:
+     * moLonLat - {Object} MapObject LonLat format
+     * 
+     * Returns:
+     * {Float} Latitude of the given MapObject LonLat
+     */
+    getLatitudeFromMapObjectLonLat: function(moLonLat) {
+        return this.sphericalMercator ? 
+            this.forwardMercator(moLonLat.lon, moLonLat.lat).lat :
+            moLonLat.lat;
+    },
+
+    /**
+     * APIMethod: getMapObjectLonLatFromLonLat
+     * 
+     * Parameters:
+     * lon - {Float}
+     * lat - {Float}
+     * 
+     * Returns:
+     * {Object} MapObject LonLat built from lon and lat params
+     */
+    getMapObjectLonLatFromLonLat: function(lon, lat) {
+        var mmLatLon;
+        if(this.sphericalMercator) {
+            var lonlat = this.inverseMercator(lon, lat);
+            mmLatLon = new MMLatLon(lonlat.lat, lonlat.lon);
+        } else {
+            mmLatLon = new MMLatLon(lat, lon);
+        }
+        return mmLatLon;
+    },
+
+  // Pixel
+    
+    /**
+     * APIMethod: getXFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} X value of the MapObject Pixel
+     */
+    getXFromMapObjectPixel: function(moPixel) {
+        return moPixel.x;
+    },
+
+    /**
+     * APIMethod: getYFromMapObjectPixel
+     * 
+     * Parameters:
+     * moPixel - {Object} MapObject Pixel format
+     * 
+     * Returns:
+     * {Integer} Y value of the MapObject Pixel
+     */
+    getYFromMapObjectPixel: function(moPixel) {
+        return moPixel.y;
+    },
+
+    /**
+     * APIMethod: getMapObjectPixelFromXY
+     * 
+     * Parameters:
+     * x - {Integer}
+     * y - {Integer}
+     * 
+     * Returns:
+     * {Object} MapObject Pixel from x and y parameters
+     */
+    getMapObjectPixelFromXY: function(x, y) {
+        return new MMPoint(x, y);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.MultiMap"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/HTTPRequest.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/HTTPRequest.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/HTTPRequest.js	(revision 76)
@@ -0,0 +1,230 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Layer.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.HTTPRequest
+ * 
+ * Inherits from: 
+ *  - <OpenLayers.Layer>
+ */
+OpenLayers.Layer.HTTPRequest = OpenLayers.Class(OpenLayers.Layer, {
+
+    /** 
+     * Constant: URL_HASH_FACTOR
+     * {Float} Used to hash URL param strings for multi-WMS server selection.
+     *         Set to the Golden Ratio per Knuth's recommendation.
+     */
+    URL_HASH_FACTOR: (Math.sqrt(5) - 1) / 2,
+
+    /** 
+     * Property: url
+     * {Array(String) or String} This is either an array of url strings or 
+     *                           a single url string. 
+     */
+    url: null,
+
+    /** 
+     * Property: params
+     * {Object} Hashtable of key/value parameters
+     */
+    params: null,
+    
+    /** 
+     * APIProperty: reproject
+     * *Deprecated*. See http://trac.openlayers.org/wiki/SpatialMercator
+     * for information on the replacement for this functionality. 
+     * {Boolean} Whether layer should reproject itself based on base layer 
+     *           locations. This allows reprojection onto commercial layers. 
+     *           Default is false: Most layers can't reproject, but layers 
+     *           which can create non-square geographic pixels can, like WMS.
+     *           
+     */
+    reproject: false,
+
+    /**
+     * Constructor: OpenLayers.Layer.HTTPRequest
+     * 
+     * Parameters:
+     * name - {String}
+     * url - {Array(String) or String}
+     * params - {Object}
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, params, options) {
+        var newArguments = arguments;
+        newArguments = [name, options];
+        OpenLayers.Layer.prototype.initialize.apply(this, newArguments);
+        this.url = url;
+        this.params = OpenLayers.Util.extend( {}, params);
+    },
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        this.url = null;
+        this.params = null;
+        OpenLayers.Layer.prototype.destroy.apply(this, arguments); 
+    },
+    
+    /**
+     * APIMethod: clone
+     * 
+     * Parameters:
+     * obj - {Object}
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.HTTPRequest>} An exact clone of this 
+     *                                  <OpenLayers.Layer.HTTPRequest>
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.HTTPRequest(this.name,
+                                                   this.url,
+                                                   this.params,
+                                                   this.getOptions());
+        }
+        
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+        
+        return obj;
+    },
+
+    /** 
+     * APIMethod: setUrl
+     * 
+     * Parameters:
+     * newUrl - {String}
+     */
+    setUrl: function(newUrl) {
+        this.url = newUrl;
+    },
+
+    /**
+     * APIMethod: mergeNewParams
+     * 
+     * Parameters:
+     * newParams - {Object}
+     *
+     * Returns:
+     * redrawn: {Boolean} whether the layer was actually redrawn.
+     */
+    mergeNewParams:function(newParams) {
+        this.params = OpenLayers.Util.extend(this.params, newParams);
+        var ret = this.redraw();
+        if(this.map != null) {
+            this.map.events.triggerEvent("changelayer", {
+                layer: this,
+                property: "params"
+            });
+        }
+        return ret;
+    },
+
+    /**
+     * APIMethod: redraw
+     * Redraws the layer.  Returns true if the layer was redrawn, false if not.
+     *
+     * Parameters:
+     * force - {Boolean} Force redraw by adding random parameter.
+     *
+     * Returns:
+     * {Boolean} The layer was redrawn.
+     */
+    redraw: function(force) { 
+        if (force) {
+            return this.mergeNewParams({"_olSalt": Math.random()});
+        } else {
+            return OpenLayers.Layer.prototype.redraw.apply(this, []);
+        }
+    },
+    
+    /**
+     * Method: selectUrl
+     * selectUrl() implements the standard floating-point multiplicative
+     *     hash function described by Knuth, and hashes the contents of the 
+     *     given param string into a float between 0 and 1. This float is then
+     *     scaled to the size of the provided urls array, and used to select
+     *     a URL.
+     *
+     * Parameters:
+     * paramString - {String}
+     * urls - {Array(String)}
+     * 
+     * Returns:
+     * {String} An entry from the urls array, deterministically selected based
+     *          on the paramString.
+     */
+    selectUrl: function(paramString, urls) {
+        var product = 1;
+        for (var i=0, len=paramString.length; i<len; i++) { 
+            product *= paramString.charCodeAt(i) * this.URL_HASH_FACTOR; 
+            product -= Math.floor(product); 
+        }
+        return urls[Math.floor(product * urls.length)];
+    },
+
+    /** 
+     * Method: getFullRequestString
+     * Combine url with layer's params and these newParams. 
+     *   
+     *    does checking on the serverPath variable, allowing for cases when it 
+     *     is supplied with trailing ? or &, as well as cases where not. 
+     *
+     *    return in formatted string like this:
+     *        "server?key1=value1&key2=value2&key3=value3"
+     * 
+     * WARNING: The altUrl parameter is deprecated and will be removed in 3.0.
+     *
+     * Parameters:
+     * newParams - {Object}
+     * altUrl - {String} Use this as the url instead of the layer's url
+     *   
+     * Returns: 
+     * {String}
+     */
+    getFullRequestString:function(newParams, altUrl) {
+
+        // if not altUrl passed in, use layer's url
+        var url = altUrl || this.url;
+        
+        // create a new params hashtable with all the layer params and the 
+        // new params together. then convert to string
+        var allParams = OpenLayers.Util.extend({}, this.params);
+        allParams = OpenLayers.Util.extend(allParams, newParams);
+        var paramsString = OpenLayers.Util.getParameterString(allParams);
+        
+        // if url is not a string, it should be an array of strings, 
+        // in which case we will deterministically select one of them in 
+        // order to evenly distribute requests to different urls.
+        //
+        if (url instanceof Array) {
+            url = this.selectUrl(paramsString, url);
+        }   
+ 
+        // ignore parameters that are already in the url search string
+        var urlParams = 
+            OpenLayers.Util.upperCaseObject(OpenLayers.Util.getParameters(url));
+        for(var key in allParams) {
+            if(key.toUpperCase() in urlParams) {
+                delete allParams[key];
+            }
+        }
+        paramsString = OpenLayers.Util.getParameterString(allParams);
+        
+        return OpenLayers.Util.urlAppend(url, paramsString);
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.HTTPRequest"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer/Untiled.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer/Untiled.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/MapServer/Untiled.js	(revision 76)
@@ -0,0 +1,72 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+ 
+/**
+ * @requires OpenLayers/Layer/MapServer.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.MapServer.Untiled
+ * *Deprecated*.  To be removed in 3.0.  Instead use OpenLayers.Layer.MapServer
+ *     and pass the option 'singleTile' as true.
+ * 
+ * Inherits from: 
+ *  - <OpenLayers.Layer.MapServer>
+ */
+OpenLayers.Layer.MapServer.Untiled = OpenLayers.Class(OpenLayers.Layer.MapServer, {
+
+    /**
+     * APIProperty: singleTile
+     * {singleTile} Always true for untiled.
+     */
+    singleTile: true,
+
+    /**
+     * Constructor: OpenLayers.Layer.MapServer.Untiled
+     *
+     * Parameters:
+     * name - {String} 
+     * url - {String} 
+     * params - {Object} 
+     * options - {Object} 
+     */
+    initialize: function(name, url, params, options) {
+        OpenLayers.Layer.MapServer.prototype.initialize.apply(this, arguments);
+        
+        var msg = "The OpenLayers.Layer.MapServer.Untiled class is deprecated and " +
+                  "will be removed in 3.0. Instead, you should use the " +
+                  "normal OpenLayers.Layer.MapServer class, passing it the option " +
+                  "'singleTile' as true.";
+        OpenLayers.Console.warn(msg);
+    },    
+
+    /**
+     * Method: clone
+     * Create a clone of this layer
+     *
+     * Returns:
+     * {<OpenLayers.Layer.MapServer.Untiled>} An exact clone of this layer
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.MapServer.Untiled(this.name,
+                                                         this.url,
+                                                         this.params,
+                                                         this.getOptions());
+        }
+
+        //get all additions from superclasses
+        obj = OpenLayers.Layer.MapServer.prototype.clone.apply(this, [obj]);
+
+        // copy/set any non-init, non-simple values here
+        
+        return obj;
+    }, 
+
+    CLASS_NAME: "OpenLayers.Layer.MapServer.Untiled"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WFS.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WFS.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Layer/WFS.js	(revision 76)
@@ -0,0 +1,609 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Tile/WFS.js
+ * @requires OpenLayers/Layer/Vector.js
+ * @requires OpenLayers/Layer/Markers.js
+ * @requires OpenLayers/Console.js
+ */
+
+/**
+ * Class: OpenLayers.Layer.WFS
+ * *Deprecated*.  To be removed in 3.0.  Instead use OpenLayers.Layer.Vector
+ *     with a Protocol.WFS and one or more Strategies.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Layer.Vector>
+ *  - <OpenLayers.Layer.Markers>
+ */
+OpenLayers.Layer.WFS = OpenLayers.Class(
+  OpenLayers.Layer.Vector, OpenLayers.Layer.Markers, {
+
+    /**
+     * APIProperty: isBaseLayer
+     * {Boolean} WFS layer is not a base layer by default. 
+     */
+    isBaseLayer: false,
+    
+    /**
+     * Property: tile
+     * {<OpenLayers.Tile.WFS>}
+     */
+    tile: null,    
+    
+    /**
+     * APIProperty: ratio
+     * {Float} The ratio property determines the size of the serverside query
+     *    relative to the map viewport size. By default, we load an area twice
+     *    as big as the map, to allow for panning without immediately reload.
+     *    Setting this to 1 will cause the area of the WFS request to match
+     *    the map area exactly. It is recommended to set this to some number
+     *    at least slightly larger than 1, otherwise accidental clicks can
+     *    cause a data reload, by moving the map only 1 pixel.
+     */
+    ratio: 2,
+
+    /**  
+     * Property: DEFAULT_PARAMS
+     * {Object} Hashtable of default key/value parameters
+     */
+    DEFAULT_PARAMS: { service: "WFS",
+                      version: "1.0.0",
+                      request: "GetFeature"
+                    },
+    
+    /** 
+     * APIProperty: featureClass
+     * {<OpenLayers.Feature>} If featureClass is defined, an old-style markers
+     *     based WFS layer is created instead of a new-style vector layer. If
+     *     sent, this should be a subclass of OpenLayers.Feature
+     */
+    featureClass: null,
+    
+    /**
+      * APIProperty: format
+      * {<OpenLayers.Format>} The format you want the data to be parsed with.
+      * Must be passed in the constructor. Should be a class, not an instance.
+      * This option can only be used if no featureClass is passed / vectorMode
+      * is false: if a featureClass is passed, then this parameter is ignored.
+      */
+    format: null,
+
+    /** 
+     * Property: formatObject
+     * {<OpenLayers.Format>} Internally created/managed format object, used by
+     * the Tile to parse data.
+     */
+    formatObject: null,
+
+    /**
+     * APIProperty: formatOptions
+     * {Object} Hash of options which should be passed to the format when it is
+     * created. Must be passed in the constructor.
+     */
+    formatOptions: null, 
+
+    /**
+     * Property: vectorMode
+     * {Boolean} Should be calculated automatically. Determines whether the
+     *     layer is in vector mode or marker mode.
+     */
+    vectorMode: true, 
+    
+    /**
+     * APIProperty: encodeBBOX
+     * {Boolean} Should the BBOX commas be encoded? The WMS spec says 'no', 
+     *     but some services want it that way. Default false.
+     */
+    encodeBBOX: false,
+    
+    /**
+     * APIProperty: extractAttributes 
+     * {Boolean} Should the WFS layer parse attributes from the retrieved
+     *     GML? Defaults to false. If enabled, parsing is slower, but 
+     *     attributes are available in the attributes property of 
+     *     layer features.
+     */
+    extractAttributes: false,
+
+    /**
+     * Constructor: OpenLayers.Layer.WFS
+     *
+     * Parameters:
+     * name - {String} 
+     * url - {String} 
+     * params - {Object} 
+     * options - {Object} Hashtable of extra options to tag onto the layer
+     */
+    initialize: function(name, url, params, options) {
+        if (options == undefined) { options = {}; } 
+        
+        if (options.featureClass || 
+            !OpenLayers.Layer.Vector || 
+            !OpenLayers.Feature.Vector) {
+            this.vectorMode = false;
+        }    
+
+        // Uppercase params
+        params = OpenLayers.Util.upperCaseObject(params);
+        
+        // Turn off error reporting, browsers like Safari may work
+        // depending on the setup, and we don't want an unneccesary alert.
+        OpenLayers.Util.extend(options, {'reportError': false});
+        var newArguments = [];
+        newArguments.push(name, options);
+        OpenLayers.Layer.Vector.prototype.initialize.apply(this, newArguments);
+        if (!this.renderer || !this.vectorMode) {
+            this.vectorMode = false; 
+            if (!options.featureClass) {
+                options.featureClass = OpenLayers.Feature.WFS;
+            }   
+            OpenLayers.Layer.Markers.prototype.initialize.apply(this, 
+                                                                newArguments);
+        }
+        
+        if (this.params && this.params.typename && !this.options.typename) {
+            this.options.typename = this.params.typename;
+        }
+        
+        if (!this.options.geometry_column) {
+            this.options.geometry_column = "the_geom";
+        }    
+        
+        this.params = OpenLayers.Util.applyDefaults(
+            params, 
+            OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS)
+        );
+        this.url = url;
+    },    
+    
+
+    /**
+     * APIMethod: destroy
+     */
+    destroy: function() {
+        if (this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.destroy.apply(this, arguments);
+        } else {    
+            OpenLayers.Layer.Markers.prototype.destroy.apply(this, arguments);
+        }    
+        if (this.tile) {
+            this.tile.destroy();
+        }
+        this.tile = null;
+
+        this.ratio = null;
+        this.featureClass = null;
+        this.format = null;
+
+        if (this.formatObject && this.formatObject.destroy) {
+            this.formatObject.destroy();
+        }
+        this.formatObject = null;
+        
+        this.formatOptions = null;
+        this.vectorMode = null;
+        this.encodeBBOX = null;
+        this.extractAttributes = null;
+    },
+    
+    /**
+     * Method: setMap
+     * 
+     * Parameters:
+     * map - {<OpenLayers.Map>} 
+     */
+    setMap: function(map) {
+        if (this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.setMap.apply(this, arguments);
+            
+            var options = {
+              'extractAttributes': this.extractAttributes
+            };
+            
+            OpenLayers.Util.extend(options, this.formatOptions);
+            if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+                options.externalProjection = this.projection;
+                options.internalProjection = this.map.getProjectionObject();
+            }    
+            
+            this.formatObject = this.format ? new this.format(options) : new OpenLayers.Format.GML(options);
+        } else {    
+            OpenLayers.Layer.Markers.prototype.setMap.apply(this, arguments);
+        }    
+    },
+    
+    /** 
+     * Method: moveTo
+     * 
+     * Parameters:
+     * bounds - {<OpenLayers.Bounds>} 
+     * zoomChanged - {Boolean} 
+     * dragging - {Boolean} 
+     */
+    moveTo:function(bounds, zoomChanged, dragging) {
+        if (this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.moveTo.apply(this, arguments);
+        } else {
+            OpenLayers.Layer.Markers.prototype.moveTo.apply(this, arguments);
+        }    
+
+        // don't load wfs features while dragging, wait for drag end
+        if (dragging) {
+            // TBD try to hide the vector layer while dragging
+            // this.setVisibility(false);
+            // this will probably help for panning performances
+            return false;
+        }
+        
+        if ( zoomChanged ) {
+            if (this.vectorMode) {
+                this.renderer.clear();
+            }
+        }
+        
+    //DEPRECATED - REMOVE IN 3.0
+        // don't load data if current zoom level doesn't match
+        if (this.options.minZoomLevel) {
+            OpenLayers.Console.warn(OpenLayers.i18n('minZoomLevelError'));
+            
+            if (this.map.getZoom() < this.options.minZoomLevel) {
+                return null;
+            }
+        }
+        
+        if (bounds == null) {
+            bounds = this.map.getExtent();
+        }
+
+        var firstRendering = (this.tile == null);
+
+        //does the new bounds to which we need to move fall outside of the 
+        // current tile's bounds?
+        var outOfBounds = (!firstRendering &&
+                           !this.tile.bounds.containsBounds(bounds));
+
+        if (zoomChanged || firstRendering || (!dragging && outOfBounds)) {
+            //determine new tile bounds
+            var center = bounds.getCenterLonLat();
+            var tileWidth = bounds.getWidth() * this.ratio;
+            var tileHeight = bounds.getHeight() * this.ratio;
+            var tileBounds = 
+                new OpenLayers.Bounds(center.lon - (tileWidth / 2),
+                                      center.lat - (tileHeight / 2),
+                                      center.lon + (tileWidth / 2),
+                                      center.lat + (tileHeight / 2));
+
+            //determine new tile size
+            var tileSize = this.map.getSize();
+            tileSize.w = tileSize.w * this.ratio;
+            tileSize.h = tileSize.h * this.ratio;
+
+            //determine new position (upper left corner of new bounds)
+            var ul = new OpenLayers.LonLat(tileBounds.left, tileBounds.top);
+            var pos = this.map.getLayerPxFromLonLat(ul);
+
+            //formulate request url string
+            var url = this.getFullRequestString();
+        
+            var params = null;
+
+            // Cant combine "filter" and "BBOX". This is a cheap hack to help
+            // people out who can't migrate to the WFS protocol immediately.
+            var filter = this.params.filter || this.params.FILTER;
+            if (filter) {
+                params = {FILTER: filter};
+            }
+            else {
+                params = {BBOX: this.encodeBBOX ? tileBounds.toBBOX() 
+                                                    : tileBounds.toArray()};
+            }
+            
+            if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+                var projectedBounds = tileBounds.clone();
+                projectedBounds.transform(this.map.getProjectionObject(), 
+                                          this.projection);
+                if (!filter){
+                    params.BBOX = this.encodeBBOX ? projectedBounds.toBBOX() 
+                                                : projectedBounds.toArray();
+                }
+            }                                  
+
+            url += "&" + OpenLayers.Util.getParameterString(params);
+
+            if (!this.tile) {
+                this.tile = new OpenLayers.Tile.WFS(this, pos, tileBounds, 
+                                                     url, tileSize);
+                this.addTileMonitoringHooks(this.tile);
+                this.tile.draw();
+            } else {
+                if (this.vectorMode) {
+                    this.destroyFeatures();
+                    this.renderer.clear();
+                } else {
+                    this.clearMarkers();
+                }    
+                this.removeTileMonitoringHooks(this.tile);
+                this.tile.destroy();
+                
+                this.tile = null;
+                this.tile = new OpenLayers.Tile.WFS(this, pos, tileBounds, 
+                                                     url, tileSize);
+                this.addTileMonitoringHooks(this.tile);
+                this.tile.draw();
+            } 
+        }
+    },
+
+    /** 
+     * Method: addTileMonitoringHooks
+     * This function takes a tile as input and adds the appropriate hooks to 
+     *     the tile so that the layer can keep track of the loading tile
+     *     (making sure to check that the tile is always the layer's current
+     *     tile before taking any action).
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    addTileMonitoringHooks: function(tile) {
+        tile.onLoadStart = function() {
+            //if this is the the layer's current tile, then trigger 
+            // a 'loadstart'
+            if (this == this.layer.tile) {
+                this.layer.events.triggerEvent("loadstart");
+            }
+        };
+        tile.events.register("loadstart", tile, tile.onLoadStart);
+      
+        tile.onLoadEnd = function() {
+            //if this is the the layer's current tile, then trigger 
+            // a 'tileloaded' and 'loadend'
+            if (this == this.layer.tile) {
+                this.layer.events.triggerEvent("tileloaded");
+                this.layer.events.triggerEvent("loadend");
+            }
+        };
+        tile.events.register("loadend", tile, tile.onLoadEnd);
+        tile.events.register("unload", tile, tile.onLoadEnd);
+    },
+    
+    /** 
+     * Method: removeTileMonitoringHooks
+     * This function takes a tile as input and removes the tile hooks 
+     *     that were added in addTileMonitoringHooks()
+     * 
+     * Parameters: 
+     * tile - {<OpenLayers.Tile>}
+     */
+    removeTileMonitoringHooks: function(tile) {
+        tile.unload();
+        tile.events.un({
+            "loadstart": tile.onLoadStart,
+            "loadend": tile.onLoadEnd,
+            "unload": tile.onLoadEnd,
+            scope: tile
+        });
+    },
+
+    /**
+     * Method: onMapResize
+     * Call the onMapResize method of the appropriate parent class. 
+     */
+    onMapResize: function() {
+        if(this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.onMapResize.apply(this, 
+                                                                arguments);
+        } else {
+            OpenLayers.Layer.Markers.prototype.onMapResize.apply(this, 
+                                                                 arguments);
+        }
+    },
+    
+    /**
+     * Method: display
+     * Call the display method of the appropriate parent class. 
+     */
+    display: function() {
+        if(this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.display.apply(this, 
+                                                                arguments);
+        } else {
+            OpenLayers.Layer.Markers.prototype.display.apply(this, 
+                                                                 arguments);
+        }
+    },
+    
+    /**
+     * APIMethod: mergeNewParams
+     * Modify parameters for the layer and redraw.
+     * 
+     * Parameters:
+     * newParams - {Object}
+     */
+    mergeNewParams:function(newParams) {
+        var upperParams = OpenLayers.Util.upperCaseObject(newParams);
+        var newArguments = [upperParams];
+        return OpenLayers.Layer.HTTPRequest.prototype.mergeNewParams.apply(this, 
+                                                                 newArguments);
+    },
+
+    /**
+     * APIMethod: clone
+     *
+     * Parameters:
+     * obj - {Object} 
+     * 
+     * Returns:
+     * {<OpenLayers.Layer.WFS>} An exact clone of this OpenLayers.Layer.WFS
+     */
+    clone: function (obj) {
+        
+        if (obj == null) {
+            obj = new OpenLayers.Layer.WFS(this.name,
+                                           this.url,
+                                           this.params,
+                                           this.getOptions());
+        }
+
+        //get all additions from superclasses
+        if (this.vectorMode) {
+            obj = OpenLayers.Layer.Vector.prototype.clone.apply(this, [obj]);
+        } else {
+            obj = OpenLayers.Layer.Markers.prototype.clone.apply(this, [obj]);
+        }    
+
+        // copy/set any non-init, non-simple values here
+
+        return obj;
+    },
+
+    /** 
+     * APIMethod: getFullRequestString
+     * combine the layer's url with its params and these newParams. 
+     *   
+     *    Add the SRS parameter from 'projection' -- this is probably
+     *     more eloquently done via a setProjection() method, but this 
+     *     works for now and always.
+     *
+     * Parameters:
+     * newParams - {Object} 
+     * altUrl - {String} Use this as the url instead of the layer's url
+     */
+    getFullRequestString:function(newParams, altUrl) {
+        var projectionCode = this.projection.getCode() || this.map.getProjection();
+        this.params.SRS = (projectionCode == "none") ? null : projectionCode;
+
+        return OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(
+                                                    this, arguments);
+    },
+   
+    /**
+     * APIMethod: commit
+     * Write out the data to a WFS server.
+     */
+    commit: function() {
+        if (!this.writer) {
+            var options = {};
+            if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+                options.externalProjection = this.projection;
+                options.internalProjection = this.map.getProjectionObject();
+            }    
+            
+            this.writer = new OpenLayers.Format.WFS(options,this);
+        }
+
+        var data = this.writer.write(this.features);
+
+        OpenLayers.Request.POST({
+            url: this.url,
+            data: data,
+            success: this.commitSuccess,
+            failure: this.commitFailure,
+            scope: this
+        });
+    },
+
+    /**
+     * Method: commitSuccess
+     * Called when the Ajax request returns a response
+     *
+     * Parameters:
+     * response - {XmlNode} from server
+     */
+    commitSuccess: function(request) {
+        var response = request.responseText;
+        if (response.indexOf('SUCCESS') != -1) {
+            this.commitReport(OpenLayers.i18n("commitSuccess", {'response':response}));
+            
+            for(var i = 0; i < this.features.length; i++) {
+                this.features[i].state = null;
+            }    
+            // TBD redraw the layer or reset the state of features
+            // foreach features: set state to null
+        } else if (response.indexOf('FAILED') != -1 ||
+            response.indexOf('Exception') != -1) {
+            this.commitReport(OpenLayers.i18n("commitFailed", {'response':response}));
+        }
+    },
+    
+    /**
+     * Method: commitFailure
+     * Called when the Ajax request fails
+     *
+     * Parameters:
+     * response - {XmlNode} from server
+     */
+    commitFailure: function(request) {},
+    
+    /**
+     * APIMethod: commitReport 
+     * Called with a 'success' message if the commit succeeded, otherwise
+     *     a failure message, and the full request text as a second parameter.
+     *     Override this function to provide custom transaction reporting.
+     *
+     * string - {String} reporting string
+     * response - {String} full XML response
+     */
+    commitReport: function(string, response) {
+        OpenLayers.Console.userError(string);
+    },
+
+    
+    /**
+     * APIMethod: refresh
+     * Refreshes all the features of the layer
+     */
+    refresh: function() {
+        if (this.tile) {
+            if (this.vectorMode) {
+                this.renderer.clear();
+                this.features.length = 0;
+            } else {   
+                this.clearMarkers();
+                this.markers.length = 0;
+            }    
+            this.tile.draw();
+        }
+    },
+    
+    /** 
+     * APIMethod: getDataExtent
+     * Calculates the max extent which includes all of the layer data.
+     * 
+     * Returns:
+     * {<OpenLayers.Bounds>}
+     */
+    getDataExtent: function () {
+        var extent; 
+        //get all additions from superclasses
+        if (this.vectorMode) {
+            extent = OpenLayers.Layer.Vector.prototype.getDataExtent.apply(this);
+        } else {
+            extent = OpenLayers.Layer.Markers.prototype.getDataExtent.apply(this);
+        }    
+
+        return extent;
+    },
+    
+    /** 
+     * APIMethod: setOpacity 
+     * Call the setOpacity method of the appropriate parent class to set the
+     *     opacity.  
+     * 
+     * Parameter: 
+     * opacity - {Float} 
+     */
+    setOpacity: function (opacity) {
+        if (this.vectorMode) {
+            OpenLayers.Layer.Vector.prototype.setOpacity.apply(this, [opacity]);
+        } else {
+            OpenLayers.Layer.Markers.prototype.setOpacity.apply(this, [opacity]);
+        }    
+    },
+
+    CLASS_NAME: "OpenLayers.Layer.WFS"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Console.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Console.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Console.js	(revision 76)
@@ -0,0 +1,246 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Namespace: OpenLayers.Console
+ * The OpenLayers.Console namespace is used for debugging and error logging.
+ * If the Firebug Lite (../Firebug/firebug.js) is included before this script,
+ * calls to OpenLayers.Console methods will get redirected to window.console.
+ * This makes use of the Firebug extension where available and allows for
+ * cross-browser debugging Firebug style.
+ *
+ * Note:
+ * Note that behavior will differ with the Firebug extention and Firebug Lite.
+ * Most notably, the Firebug Lite console does not currently allow for
+ * hyperlinks to code or for clicking on object to explore their properties.
+ * 
+ */
+OpenLayers.Console = {
+    /**
+     * Create empty functions for all console methods.  The real value of these
+     * properties will be set if Firebug Lite (../Firebug/firebug.js script) is
+     * included.  We explicitly require the Firebug Lite script to trigger
+     * functionality of the OpenLayers.Console methods.
+     */
+    
+    /**
+     * APIFunction: log
+     * Log an object in the console.  The Firebug Lite console logs string
+     * representation of objects.  Given multiple arguments, they will
+     * be cast to strings and logged with a space delimiter.  If the first
+     * argument is a string with printf-like formatting, subsequent arguments
+     * will be used in string substitution.  Any additional arguments (beyond
+     * the number substituted in a format string) will be appended in a space-
+     * delimited line.
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    log: function() {},
+
+    /**
+     * APIFunction: debug
+     * Writes a message to the console, including a hyperlink to the line
+     * where it was called.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    debug: function() {},
+
+    /**
+     * APIFunction: info
+     * Writes a message to the console with the visual "info" icon and color
+     * coding and a hyperlink to the line where it was called.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    info: function() {},
+
+    /**
+     * APIFunction: warn
+     * Writes a message to the console with the visual "warning" icon and
+     * color coding and a hyperlink to the line where it was called.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    warn: function() {},
+
+    /**
+     * APIFunction: error
+     * Writes a message to the console with the visual "error" icon and color
+     * coding and a hyperlink to the line where it was called.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    error: function() {},
+    
+    /**
+     * APIFunction: userError
+     * A single interface for showing error messages to the user. The default
+     * behavior is a Javascript alert, though this can be overridden by
+     * reassigning OpenLayers.Console.userError to a different function.
+     *
+     * Expects a single error message
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    userError: function(error) {
+        alert(error);
+    },
+
+    /**
+     * APIFunction: assert
+     * Tests that an expression is true. If not, it will write a message to
+     * the console and throw an exception.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    assert: function() {},
+
+    /**
+     * APIFunction: dir
+     * Prints an interactive listing of all properties of the object. This
+     * looks identical to the view that you would see in the DOM tab.
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    dir: function() {},
+
+    /**
+     * APIFunction: dirxml
+     * Prints the XML source tree of an HTML or XML element. This looks
+     * identical to the view that you would see in the HTML tab. You can click
+     * on any node to inspect it in the HTML tab.
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    dirxml: function() {},
+
+    /**
+     * APIFunction: trace
+     * Prints an interactive stack trace of JavaScript execution at the point
+     * where it is called.  The stack trace details the functions on the stack,
+     * as well as the values that were passed as arguments to each function.
+     * You can click each function to take you to its source in the Script tab,
+     * and click each argument value to inspect it in the DOM or HTML tabs.
+     * 
+     */
+    trace: function() {},
+
+    /**
+     * APIFunction: group
+     * Writes a message to the console and opens a nested block to indent all
+     * future messages sent to the console. Call OpenLayers.Console.groupEnd()
+     * to close the block.
+     *
+     * May be called with multiple arguments as with OpenLayers.Console.log().
+     * 
+     * Parameters:
+     * object - {Object}
+     */
+    group: function() {},
+
+    /**
+     * APIFunction: groupEnd
+     * Closes the most recently opened block created by a call to
+     * OpenLayers.Console.group
+     */
+    groupEnd: function() {},
+    
+    /**
+     * APIFunction: time
+     * Creates a new timer under the given name. Call
+     * OpenLayers.Console.timeEnd(name)
+     * with the same name to stop the timer and print the time elapsed.
+     *
+     * Parameters:
+     * name - {String}
+     */
+    time: function() {},
+
+    /**
+     * APIFunction: timeEnd
+     * Stops a timer created by a call to OpenLayers.Console.time(name) and
+     * writes the time elapsed.
+     *
+     * Parameters:
+     * name - {String}
+     */
+    timeEnd: function() {},
+
+    /**
+     * APIFunction: profile
+     * Turns on the JavaScript profiler. The optional argument title would
+     * contain the text to be printed in the header of the profile report.
+     *
+     * This function is not currently implemented in Firebug Lite.
+     * 
+     * Parameters:
+     * title - {String} Optional title for the profiler
+     */
+    profile: function() {},
+
+    /**
+     * APIFunction: profileEnd
+     * Turns off the JavaScript profiler and prints its report.
+     * 
+     * This function is not currently implemented in Firebug Lite.
+     */
+    profileEnd: function() {},
+
+    /**
+     * APIFunction: count
+     * Writes the number of times that the line of code where count was called
+     * was executed. The optional argument title will print a message in
+     * addition to the number of the count.
+     *
+     * This function is not currently implemented in Firebug Lite.
+     *
+     * Parameters:
+     * title - {String} Optional title to be printed with count
+     */
+    count: function() {},
+
+    CLASS_NAME: "OpenLayers.Console"
+};
+
+/**
+ * Execute an anonymous function to extend the OpenLayers.Console namespace
+ * if the firebug.js script is included.  This closure is used so that the
+ * "scripts" and "i" variables don't pollute the global namespace.
+ */
+(function() {
+    /**
+     * If Firebug Lite is included (before this script), re-route all
+     * OpenLayers.Console calls to the console object.
+     */
+    var scripts = document.getElementsByTagName("script");
+    for(var i=0, len=scripts.length; i<len; ++i) {
+        if(scripts[i].src.indexOf("firebug.js") != -1) {
+            if(console) {
+                OpenLayers.Util.extend(OpenLayers.Console, console);
+                break;
+            }
+        }
+    }
+})();
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Click.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Click.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Click.js	(revision 76)
@@ -0,0 +1,325 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Click
+ * A handler for mouse clicks.  The intention of this handler is to give
+ *     controls more flexibility with handling clicks.  Browsers trigger
+ *     click events twice for a double-click.  In addition, the mousedown,
+ *     mousemove, mouseup sequence fires a click event.  With this handler,
+ *     controls can decide whether to ignore clicks associated with a double
+ *     click.  By setting a <pixelTolerance>, controls can also ignore clicks
+ *     that include a drag.  Create a new instance with the
+ *     <OpenLayers.Handler.Click> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler> 
+ */
+OpenLayers.Handler.Click = OpenLayers.Class(OpenLayers.Handler, {
+
+    /**
+     * APIProperty: delay
+     * {Number} Number of milliseconds between clicks before the event is
+     *     considered a double-click.
+     */
+    delay: 300,
+    
+    /**
+     * APIProperty: single
+     * {Boolean} Handle single clicks.  Default is true.  If false, clicks
+     * will not be reported.  If true, single-clicks will be reported.
+     */
+    single: true,
+    
+    /**
+     * APIProperty: double
+     * {Boolean} Handle double-clicks.  Default is false.
+     */
+    'double': false,
+    
+    /**
+     * APIProperty: pixelTolerance
+     * {Number} Maximum number of pixels between mouseup and mousedown for an
+     *     event to be considered a click.  Default is 0.  If set to an
+     *     integer value, clicks with a drag greater than the value will be
+     *     ignored.  This property can only be set when the handler is
+     *     constructed.
+     */
+    pixelTolerance: 0,
+    
+    /**
+     * APIProperty: stopSingle
+     * {Boolean} Stop other listeners from being notified of clicks.  Default
+     *     is false.  If true, any click listeners registered before this one
+     *     will not be notified of *any* click event (associated with double
+     *     or single clicks).
+     */
+    stopSingle: false,
+    
+    /**
+     * APIProperty: stopDouble
+     * {Boolean} Stop other listeners from being notified of double-clicks.
+     *     Default is false.  If true, any click listeners registered before
+     *     this one will not be notified of *any* double-click events.
+     * 
+     * The one caveat with stopDouble is that given a map with two click
+     *     handlers, one with stopDouble true and the other with stopSingle
+     *     true, the stopSingle handler should be activated last to get
+     *     uniform cross-browser performance.  Since IE triggers one click
+     *     with a dblclick and FF triggers two, if a stopSingle handler is
+     *     activated first, all it gets in IE is a single click when the
+     *     second handler stops propagation on the dblclick.
+     */
+    stopDouble: false,
+
+    /**
+     * Property: timerId
+     * {Number} The id of the timeout waiting to clear the <delayedCall>.
+     */
+    timerId: null,
+    
+    /**
+     * Property: down
+     * {<OpenLayers.Pixel>} The pixel location of the last mousedown.
+     */
+    down: null,
+    
+    /**
+     * Property: rightclickTimerId
+     * {Number} The id of the right mouse timeout waiting to clear the 
+     *     <delayedEvent>.
+     */
+    rightclickTimerId: null,
+    
+    /**
+     * Constructor: OpenLayers.Handler.Click
+     * Create a new click handler.
+     * 
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that is making use of
+     *     this handler.  If a handler is being used without a control, the
+     *     handler's setMap method must be overridden to deal properly with
+     *     the map.
+     * callbacks - {Object} An object with keys corresponding to callbacks
+     *     that will be called by the handler. The callbacks should
+     *     expect to recieve a single argument, the click event.
+     *     Callbacks for 'click' and 'dblclick' are supported.
+     * options - {Object} Optional object whose properties will be set on the
+     *     handler.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+        // optionally register for mouseup and mousedown
+        if(this.pixelTolerance != null) {
+            this.mousedown = function(evt) {
+                this.down = evt.xy;
+                return true;
+            };
+        }
+    },
+    
+    /**
+     * Method: mousedown
+     * Handle mousedown.  Only registered as a listener if pixelTolerance is
+     *     a non-zero value at construction.
+     *
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    mousedown: null,
+
+    /**
+     * Method: mouseup
+     * Handle mouseup.  Installed to support collection of right mouse events.
+     * 
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    mouseup:  function (evt) {
+        var propagate = true;
+
+        // Collect right mouse clicks from the mouseup
+        //  IE - ignores the second right click in mousedown so using
+        //  mouseup instead
+        if (this.checkModifiers(evt) && 
+            this.control.handleRightClicks && 
+            OpenLayers.Event.isRightClick(evt)) {
+          propagate = this.rightclick(evt);
+        }
+
+        return propagate;
+    },
+    
+    /**
+     * Method: rightclick
+     * Handle rightclick.  For a dblrightclick, we get two clicks so we need 
+     *     to always register for dblrightclick to properly handle single 
+     *     clicks.
+     *     
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    rightclick: function(evt) {
+        if(this.passesTolerance(evt)) {
+           if(this.rightclickTimerId != null) {
+                //Second click received before timeout this must be 
+                // a double click
+                this.clearTimer();      
+                this.callback('dblrightclick', [evt]);
+                return !this.stopDouble;
+            } else { 
+                //Set the rightclickTimerId, send evt only if double is 
+                // true else trigger single
+                var clickEvent = this['double'] ?
+                    OpenLayers.Util.extend({}, evt) : 
+                    this.callback('rightclick', [evt]);
+
+                var delayedRightCall = OpenLayers.Function.bind(
+                    this.delayedRightCall, 
+                    this, 
+                    clickEvent
+                );
+                this.rightclickTimerId = window.setTimeout(
+                    delayedRightCall, this.delay
+                );
+            } 
+        }
+        return !this.stopSingle;
+    },
+    
+    /**
+     * Method: delayedRightCall
+     * Sets <rightclickTimerId> to null.  And optionally triggers the 
+     *     rightclick callback if evt is set.
+     */
+    delayedRightCall: function(evt) {
+        this.rightclickTimerId = null;
+        if (evt) {
+           this.callback('rightclick', [evt]);
+        }
+        return !this.stopSingle;
+    },
+    
+    /**
+     * Method: dblclick
+     * Handle dblclick.  For a dblclick, we get two clicks in some browsers
+     *     (FF) and one in others (IE).  So we need to always register for
+     *     dblclick to properly handle single clicks.
+     *     
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    dblclick: function(evt) {
+        if(this.passesTolerance(evt)) {
+            if(this["double"]) {
+                this.callback('dblclick', [evt]);
+            }
+            this.clearTimer();
+        }
+        return !this.stopDouble;
+    },
+    
+    /**
+     * Method: click
+     * Handle click.
+     *
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    click: function(evt) {
+        if(this.passesTolerance(evt)) {
+            if(this.timerId != null) {
+                // already received a click
+                this.clearTimer();
+            } else {
+                // set the timer, send evt only if single is true
+                //use a clone of the event object because it will no longer 
+                //be a valid event object in IE in the timer callback
+                var clickEvent = this.single ?
+                    OpenLayers.Util.extend({}, evt) : null;
+                this.timerId = window.setTimeout(
+                    OpenLayers.Function.bind(this.delayedCall, this, clickEvent),
+                    this.delay
+                );
+            }
+        }
+        return !this.stopSingle;
+    },
+    
+    /**
+     * Method: passesTolerance
+     * Determine whether the event is within the optional pixel tolerance.  Note
+     *     that the pixel tolerance check only works if mousedown events get to
+     *     the listeners registered here.  If they are stopped by other elements,
+     *     the <pixelTolerance> will have no effect here (this method will always
+     *     return true).
+     *
+     * Returns:
+     * {Boolean} The click is within the pixel tolerance (if specified).
+     */
+    passesTolerance: function(evt) {
+        var passes = true;
+        if(this.pixelTolerance != null && this.down) {
+            var dpx = Math.sqrt(
+                Math.pow(this.down.x - evt.xy.x, 2) +
+                Math.pow(this.down.y - evt.xy.y, 2)
+            );
+            if(dpx > this.pixelTolerance) {
+                passes = false;
+            }
+        }
+        return passes;
+    },
+
+    /**
+     * Method: clearTimer
+     * Clear the timer and set <timerId> to null.
+     */
+    clearTimer: function() {
+        if(this.timerId != null) {
+            window.clearTimeout(this.timerId);
+            this.timerId = null;
+        }
+        if(this.rightclickTimerId != null) {
+            window.clearTimeout(this.rightclickTimerId);
+            this.rightclickTimerId = null;
+        }
+    },
+    
+    /**
+     * Method: delayedCall
+     * Sets <timerId> to null.  And optionally triggers the click callback if
+     *     evt is set.
+     */
+    delayedCall: function(evt) {
+        this.timerId = null;
+        if(evt) {
+            this.callback('click', [evt]);
+        }
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Deactivate the handler.
+     *
+     * Returns:
+     * {Boolean} The handler was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            this.clearTimer();
+            this.down = null;
+            deactivated = true;
+        }
+        return deactivated;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Click"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Polygon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Polygon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Polygon.js	(revision 76)
@@ -0,0 +1,144 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Handler/Path.js
+ * @requires OpenLayers/Geometry/Polygon.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Polygon
+ * Handler to draw a polygon on the map.  Polygon is displayed on mouse down,
+ * moves on mouse move, and is finished on mouse up.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Handler.Path>
+ *  - <OpenLayers.Handler>
+ */
+OpenLayers.Handler.Polygon = OpenLayers.Class(OpenLayers.Handler.Path, {
+    
+    /**
+     * Parameter: polygon
+     * {<OpenLayers.Feature.Vector>}
+     */
+    polygon: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.Polygon
+     * Create a Polygon Handler.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that owns this handler
+     * callbacks - {Object} An object with a properties whose values are
+     *     functions.  Various callbacks described below.
+     * options - {Object} An optional object with properties to be set on the
+     *           handler
+     *
+     * Named callbacks:
+     * create - Called when a sketch is first created.  Callback called with
+     *     the creation point geometry and sketch feature.
+     * modify - Called with each move of a vertex with the vertex (point)
+     *     geometry and the sketch feature.
+     * point - Called as each point is added.  Receives the new point geometry.
+     * done - Called when the point drawing is finished.  The callback will
+     *     recieve a single argument, the polygon geometry.
+     * cancel - Called when the handler is deactivated while drawing.  The
+     *     cancel callback will receive a geometry.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.Path.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * Method: createFeature
+     * Add temporary geometries
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} The initial pixel location for the new
+     *     feature.
+     */
+    createFeature: function(pixel) {
+        var lonlat = this.control.map.getLonLatFromPixel(pixel);
+        this.point = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat)
+        );
+        this.line = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.LinearRing([this.point.geometry])
+        );
+        this.polygon = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Polygon([this.line.geometry])
+        );
+        this.callback("create", [this.point.geometry, this.getSketch()]);
+        this.point.geometry.clearBounds();
+        this.layer.addFeatures([this.polygon, this.point], {silent: true});
+    },
+
+    /**
+     * Method: destroyFeature
+     * Destroy temporary geometries
+     */
+    destroyFeature: function() {
+        OpenLayers.Handler.Path.prototype.destroyFeature.apply(this);
+        this.polygon = null;
+    },
+
+    /**
+     * Method: drawFeature
+     * Render geometries on the temporary layer.
+     */
+    drawFeature: function() {
+        this.layer.drawFeature(this.polygon, this.style);
+        this.layer.drawFeature(this.point, this.style);
+    },
+    
+    /**
+     * Method: getSketch
+     * Return the sketch feature.
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>}
+     */
+    getSketch: function() {
+        return this.polygon;
+    },
+
+    /**
+     * Method: getGeometry
+     * Return the sketch geometry.  If <multi> is true, this will return
+     *     a multi-part geometry.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Polygon>}
+     */
+    getGeometry: function() {
+        var geometry = this.polygon && this.polygon.geometry;
+        if(geometry && this.multi) {
+            geometry = new OpenLayers.Geometry.MultiPolygon([geometry]);
+        }
+        return geometry;
+    },
+
+    /**
+     * Method: dblclick
+     * Handle double-clicks.  Finish the geometry and send it back
+     * to the control.
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    dblclick: function(evt) {
+        if(!this.freehandMode(evt)) {
+            // remove the penultimate point
+            var index = this.line.geometry.components.length - 2;
+            this.line.geometry.removeComponent(this.line.geometry.components[index]);
+            this.removePoint();
+            this.finalize();
+        }
+        return false;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Polygon"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Box.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Box.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Box.js	(revision 76)
@@ -0,0 +1,221 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ * @requires OpenLayers/Handler/Drag.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Box
+ * Handler for dragging a rectangle across the map.  Box is displayed 
+ * on mouse down, moves on mouse move, and is finished on mouse up.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Handler> 
+ */
+OpenLayers.Handler.Box = OpenLayers.Class(OpenLayers.Handler, {
+
+    /** 
+     * Property: dragHandler 
+     * {<OpenLayers.Handler.Drag>} 
+     */
+    dragHandler: null,
+
+    /**
+     * APIProperty: boxDivClassName
+     * {String} The CSS class to use for drawing the box. Default is
+     *     olHandlerBoxZoomBox
+     */
+    boxDivClassName: 'olHandlerBoxZoomBox',
+    
+    /**
+     * Property: boxCharacteristics
+     * {Object} Caches some box characteristics from css. This is used
+     *     by the getBoxCharacteristics method.
+     */
+    boxCharacteristics: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.Box
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} 
+     * callbacks - {Object} An object containing a single function to be
+     *                          called when the drag operation is finished.
+     *                          The callback should expect to recieve a single
+     *                          argument, the point geometry.
+     * options - {Object} 
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+        var callbacks = {
+            "down": this.startBox, 
+            "move": this.moveBox, 
+            "out":  this.removeBox,
+            "up":   this.endBox
+        };
+        this.dragHandler = new OpenLayers.Handler.Drag(
+                                this, callbacks, {keyMask: this.keyMask});
+    },
+
+    /**
+     * Method: destroy
+     */
+    destroy: function() {
+        if (this.dragHandler) {
+            this.dragHandler.destroy();
+            this.dragHandler = null;
+        }            
+        OpenLayers.Handler.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: setMap
+     */
+    setMap: function (map) {
+        OpenLayers.Handler.prototype.setMap.apply(this, arguments);
+        if (this.dragHandler) {
+            this.dragHandler.setMap(map);
+        }
+    },
+
+    /**
+    * Method: startBox
+    *
+    * Parameters:
+    * evt - {Event} 
+    */
+    startBox: function (xy) {
+        this.zoomBox = OpenLayers.Util.createDiv('zoomBox',
+                                                 this.dragHandler.start);
+        this.zoomBox.className = this.boxDivClassName;                                         
+        this.zoomBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+        this.map.viewPortDiv.appendChild(this.zoomBox);
+
+        OpenLayers.Element.addClass(
+            this.map.viewPortDiv, "olDrawBox"
+        );
+    },
+
+    /**
+    * Method: moveBox
+    */
+    moveBox: function (xy) {
+        var startX = this.dragHandler.start.x;
+        var startY = this.dragHandler.start.y;
+        var deltaX = Math.abs(startX - xy.x);
+        var deltaY = Math.abs(startY - xy.y);
+        this.zoomBox.style.width = Math.max(1, deltaX) + "px";
+        this.zoomBox.style.height = Math.max(1, deltaY) + "px";
+        this.zoomBox.style.left = xy.x < startX ? xy.x+"px" : startX+"px";
+        this.zoomBox.style.top = xy.y < startY ? xy.y+"px" : startY+"px";
+
+        // depending on the box model, modify width and height to take borders
+        // of the box into account
+        var box = this.getBoxCharacteristics();
+        if (box.newBoxModel) {
+            if (xy.x > startX) {
+                this.zoomBox.style.width =
+                    Math.max(1, deltaX - box.xOffset) + "px";
+            }
+            if (xy.y > startY) {
+                this.zoomBox.style.height =
+                    Math.max(1, deltaY - box.yOffset) + "px";
+            }
+        }
+    },
+
+    /**
+    * Method: endBox
+    */
+    endBox: function(end) {
+        var result;
+        if (Math.abs(this.dragHandler.start.x - end.x) > 5 ||    
+            Math.abs(this.dragHandler.start.y - end.y) > 5) {   
+            var start = this.dragHandler.start;
+            var top = Math.min(start.y, end.y);
+            var bottom = Math.max(start.y, end.y);
+            var left = Math.min(start.x, end.x);
+            var right = Math.max(start.x, end.x);
+            result = new OpenLayers.Bounds(left, bottom, right, top);
+        } else {
+            result = this.dragHandler.start.clone(); // i.e. OL.Pixel
+        } 
+        this.removeBox();
+
+        this.callback("done", [result]);
+    },
+
+    /**
+     * Method: removeBox
+     * Remove the zoombox from the screen and nullify our reference to it.
+     */
+    removeBox: function() {
+        this.map.viewPortDiv.removeChild(this.zoomBox);
+        this.zoomBox = null;
+        this.boxCharacteristics = null;
+        OpenLayers.Element.removeClass(
+            this.map.viewPortDiv, "olDrawBox"
+        );
+
+    },
+
+    /**
+     * Method: activate
+     */
+    activate: function () {
+        if (OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            this.dragHandler.activate();
+            return true;
+        } else {
+            return false;
+        }
+    },
+
+    /**
+     * Method: deactivate
+     */
+    deactivate: function () {
+        if (OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            this.dragHandler.deactivate();
+            return true;
+        } else {
+            return false;
+        }
+    },
+    
+    /**
+     * Method: getCharacteristics
+     * Determines offset and box model for a box.
+     * 
+     * Returns:
+     * {Object} a hash with the following properties:
+     *     - xOffset - Corner offset in x-direction
+     *     - yOffset - Corner offset in y-direction
+     *     - newBoxModel - true for all browsers except IE in quirks mode
+     */
+    getBoxCharacteristics: function() {
+        if (!this.boxCharacteristics) {
+            var xOffset = parseInt(OpenLayers.Element.getStyle(this.zoomBox,
+                "border-left-width")) + parseInt(OpenLayers.Element.getStyle(
+                this.zoomBox, "border-right-width")) + 1;
+            var yOffset = parseInt(OpenLayers.Element.getStyle(this.zoomBox,
+                "border-top-width")) + parseInt(OpenLayers.Element.getStyle(
+                this.zoomBox, "border-bottom-width")) + 1;
+            // all browsers use the new box model, except IE in quirks mode
+            var newBoxModel = OpenLayers.Util.getBrowserName() == "msie" ?
+                document.compatMode != "BackCompat" : true;
+            this.boxCharacteristics = {
+                xOffset: xOffset,
+                yOffset: yOffset,
+                newBoxModel: newBoxModel
+            };
+        }
+        return this.boxCharacteristics;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Box"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Point.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Point.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Point.js	(revision 76)
@@ -0,0 +1,373 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Handler.js
+ * @requires OpenLayers/Geometry/Point.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Point
+ * Handler to draw a point on the map.  Point is displayed on mouse down,
+ *     moves on mouse move, and is finished on mouse up.  The handler triggers
+ *     callbacks for 'done', 'cancel', and 'modify'.  The modify callback is
+ *     called with each change in the sketch and will receive the latest point
+ *     drawn.  Create a new instance with the <OpenLayers.Handler.Point>
+ *     constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler>
+ */
+OpenLayers.Handler.Point = OpenLayers.Class(OpenLayers.Handler, {
+    
+    /**
+     * Property: point
+     * {<OpenLayers.Feature.Vector>} The currently drawn point
+     */
+    point: null,
+
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>} The temporary drawing layer
+     */
+    layer: null,
+    
+    /**
+     * APIProperty: multi
+     * {Boolean} Cast features to multi-part geometries before passing to the
+     *     layer.  Default is false.
+     */
+    multi: false,
+    
+    /**
+     * Property: drawing 
+     * {Boolean} A point is being drawn
+     */
+    drawing: false,
+    
+    /**
+     * Property: mouseDown
+     * {Boolean} The mouse is down
+     */
+    mouseDown: false,
+
+    /**
+     * Property: lastDown
+     * {<OpenLayers.Pixel>} Location of the last mouse down
+     */
+    lastDown: null,
+
+    /**
+     * Property: lastUp
+     * {<OpenLayers.Pixel>}
+     */
+    lastUp: null,
+
+    /**
+     * APIProperty: persist
+     * {Boolean} Leave the feature rendered until destroyFeature is called.
+     *     Default is false.  If set to true, the feature remains rendered until
+     *     destroyFeature is called, typically by deactivating the handler or
+     *     starting another drawing.
+     */
+    persist: false,
+
+    /**
+     * Property: layerOptions
+     * {Object} Any optional properties to be set on the sketch layer.
+     */
+    layerOptions: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.Point
+     * Create a new point handler.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that owns this handler
+     * callbacks - {Object} An object with a properties whose values are
+     *     functions.  Various callbacks described below.
+     * options - {Object} An optional object with properties to be set on the
+     *           handler
+     *
+     * Named callbacks:
+     * create - Called when a sketch is first created.  Callback called with
+     *     the creation point geometry and sketch feature.
+     * modify - Called with each move of a vertex with the vertex (point)
+     *     geometry and the sketch feature.
+     * done - Called when the point drawing is finished.  The callback will
+     *     recieve a single argument, the point geometry.
+     * cancel - Called when the handler is deactivated while drawing.  The
+     *     cancel callback will receive a geometry.
+     */
+    initialize: function(control, callbacks, options) {
+        if(!(options && options.layerOptions && options.layerOptions.styleMap)) {
+            this.style = OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'], {});
+        }
+
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * APIMethod: activate
+     * turn on the handler
+     */
+    activate: function() {
+        if(!OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            return false;
+        }
+        // create temporary vector layer for rendering geometry sketch
+        // TBD: this could be moved to initialize/destroy - setting visibility here
+        var options = OpenLayers.Util.extend({
+            displayInLayerSwitcher: false,
+            // indicate that the temp vector layer will never be out of range
+            // without this, resolution properties must be specified at the
+            // map-level for this temporary layer to init its resolutions
+            // correctly
+            calculateInRange: OpenLayers.Function.True
+        }, this.layerOptions);
+        this.layer = new OpenLayers.Layer.Vector(this.CLASS_NAME, options);
+        this.map.addLayer(this.layer);
+        return true;
+    },
+    
+    /**
+     * Method: createFeature
+     * Add temporary features
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} A pixel location on the map.
+     */
+    createFeature: function(pixel) {
+        var lonlat = this.map.getLonLatFromPixel(pixel);
+        this.point = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat)
+        );
+        this.callback("create", [this.point.geometry, this.point]);
+        this.point.geometry.clearBounds();
+        this.layer.addFeatures([this.point], {silent: true});
+    },
+
+    /**
+     * APIMethod: deactivate
+     * turn off the handler
+     */
+    deactivate: function() {
+        if(!OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            return false;
+        }
+        // call the cancel callback if mid-drawing
+        if(this.drawing) {
+            this.cancel();
+        }
+        this.destroyFeature();
+        // If a layer's map property is set to null, it means that that layer
+        // isn't added to the map. Since we ourself added the layer to the map
+        // in activate(), we can assume that if this.layer.map is null it means
+        // that the layer has been destroyed (as a result of map.destroy() for
+        // example.
+        if (this.layer.map != null) {
+            this.layer.destroy(false);
+        }
+        this.layer = null;
+        return true;
+    },
+    
+    /**
+     * Method: destroyFeature
+     * Destroy the temporary geometries
+     */
+    destroyFeature: function() {
+        if(this.layer) {
+            this.layer.destroyFeatures();
+        }
+        this.point = null;
+    },
+
+    /**
+     * Method: finalize
+     * Finish the geometry and call the "done" callback.
+     *
+     * Parameters:
+     * cancel - {Boolean} Call cancel instead of done callback.  Default is
+     *     false.
+     */
+    finalize: function(cancel) {
+        var key = cancel ? "cancel" : "done";
+        this.drawing = false;
+        this.mouseDown = false;
+        this.lastDown = null;
+        this.lastUp = null;
+        this.callback(key, [this.geometryClone()]);
+        if(cancel || !this.persist) {
+            this.destroyFeature();
+        }
+    },
+
+    /**
+     * APIMethod: cancel
+     * Finish the geometry and call the "cancel" callback.
+     */
+    cancel: function() {
+        this.finalize(true);
+    },
+
+    /**
+     * Method: click
+     * Handle clicks.  Clicks are stopped from propagating to other listeners
+     *     on map.events or other dom elements.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    click: function(evt) {
+        OpenLayers.Event.stop(evt);
+        return false;
+    },
+
+    /**
+     * Method: dblclick
+     * Handle double-clicks.  Double-clicks are stopped from propagating to other
+     *     listeners on map.events or other dom elements.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    dblclick: function(evt) {
+        OpenLayers.Event.stop(evt);
+        return false;
+    },
+    
+    /**
+     * Method: modifyFeature
+     * Modify the existing geometry given a pixel location.
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} A pixel location on the map.
+     */
+    modifyFeature: function(pixel) {
+        var lonlat = this.map.getLonLatFromPixel(pixel);
+        this.point.geometry.x = lonlat.lon;
+        this.point.geometry.y = lonlat.lat;
+        this.callback("modify", [this.point.geometry, this.point]);
+        this.point.geometry.clearBounds();
+        this.drawFeature();
+    },
+
+    /**
+     * Method: drawFeature
+     * Render features on the temporary layer.
+     */
+    drawFeature: function() {
+        this.layer.drawFeature(this.point, this.style);
+    },
+    
+    /**
+     * Method: getGeometry
+     * Return the sketch geometry.  If <multi> is true, this will return
+     *     a multi-part geometry.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.Point>}
+     */
+    getGeometry: function() {
+        var geometry = this.point && this.point.geometry;
+        if(geometry && this.multi) {
+            geometry = new OpenLayers.Geometry.MultiPoint([geometry]);
+        }
+        return geometry;
+    },
+
+    /**
+     * Method: geometryClone
+     * Return a clone of the relevant geometry.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry>}
+     */
+    geometryClone: function() {
+        var geom = this.getGeometry();
+        return geom && geom.clone();
+    },
+  
+    /**
+     * Method: mousedown
+     * Handle mouse down.  Adjust the geometry and redraw.
+     * Return determines whether to propagate the event on the map.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mousedown: function(evt) {
+        // check keyboard modifiers
+        if(!this.checkModifiers(evt)) {
+            return true;
+        }
+        // ignore double-clicks
+        if(this.lastDown && this.lastDown.equals(evt.xy)) {
+            return true;
+        }
+        this.drawing = true;
+        if(this.lastDown == null) {
+            if(this.persist) {
+                this.destroyFeature();
+            }
+            this.createFeature(evt.xy);
+        } else {
+            this.modifyFeature(evt.xy);
+        }
+        this.lastDown = evt.xy;
+        return false;
+    },
+
+    /**
+     * Method: mousemove
+     * Handle mouse move.  Adjust the geometry and redraw.
+     * Return determines whether to propagate the event on the map.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mousemove: function (evt) {
+        if(this.drawing) {
+            this.modifyFeature(evt.xy);
+        }
+        return true;
+    },
+
+    /**
+     * Method: mouseup
+     * Handle mouse up.  Send the latest point in the geometry to the control.
+     * Return determines whether to propagate the event on the map.
+     *
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mouseup: function (evt) {
+        if(this.drawing) {
+            this.finalize();
+            return false;
+        } else {
+            return true;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Point"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/RegularPolygon.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/RegularPolygon.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/RegularPolygon.js	(revision 76)
@@ -0,0 +1,421 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Handler/Drag.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.RegularPolygon
+ * Handler to draw a regular polygon on the map.  Polygon is displayed on mouse
+ *     down, moves or is modified on mouse move, and is finished on mouse up.
+ *     The handler triggers callbacks for 'done' and 'cancel'.  Create a new
+ *     instance with the <OpenLayers.Handler.RegularPolygon> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler>
+ */
+OpenLayers.Handler.RegularPolygon = OpenLayers.Class(OpenLayers.Handler.Drag, {
+    
+    /**
+     * APIProperty: sides
+     * {Integer} Number of sides for the regular polygon.  Needs to be greater
+     *     than 2.  Defaults to 4.
+     */
+    sides: 4,
+
+    /**
+     * APIProperty: radius
+     * {Float} Optional radius in map units of the regular polygon.  If this is
+     *     set to some non-zero value, a polygon with a fixed radius will be
+     *     drawn and dragged with mose movements.  If this property is not
+     *     set, dragging changes the radius of the polygon.  Set to null by
+     *     default.
+     */
+    radius: null,
+    
+    /**
+     * APIProperty: snapAngle
+     * {Float} If set to a non-zero value, the handler will snap the polygon
+     *     rotation to multiples of the snapAngle.  Value is an angle measured
+     *     in degrees counterclockwise from the positive x-axis.  
+     */
+    snapAngle: null,
+    
+    /**
+     * APIProperty: snapToggle
+     * {String} If set, snapToggle is checked on mouse events and will set
+     *     the snap mode to the opposite of what it currently is.  To disallow
+     *     toggling between snap and non-snap mode, set freehandToggle to
+     *     null.  Acceptable toggle values are 'shiftKey', 'ctrlKey', and
+     *     'altKey'. Snap mode is only possible if this.snapAngle is set to a
+     *     non-zero value.
+     */
+    snapToggle: 'shiftKey',
+    
+    /**
+     * Property: layerOptions
+     * {Object} Any optional properties to be set on the sketch layer.
+     */
+    layerOptions: null,
+
+    /**
+     * APIProperty: persist
+     * {Boolean} Leave the feature rendered until clear is called.  Default
+     *     is false.  If set to true, the feature remains rendered until
+     *     clear is called, typically by deactivating the handler or starting
+     *     another drawing.
+     */
+    persist: false,
+
+    /**
+     * APIProperty: irregular
+     * {Boolean} Draw an irregular polygon instead of a regular polygon.
+     *     Default is false.  If true, the initial mouse down will represent
+     *     one corner of the polygon bounds and with each mouse movement, the
+     *     polygon will be stretched so the opposite corner of its bounds
+     *     follows the mouse position.  This property takes precedence over
+     *     the radius property.  If set to true, the radius property will
+     *     be ignored.
+     */
+    irregular: false,
+
+    /**
+     * Property: angle
+     * {Float} The angle from the origin (mouse down) to the current mouse
+     *     position, in radians.  This is measured counterclockwise from the
+     *     positive x-axis.
+     */
+    angle: null,
+
+    /**
+     * Property: fixedRadius
+     * {Boolean} The polygon has a fixed radius.  True if a radius is set before
+     *     drawing begins.  False otherwise.
+     */
+    fixedRadius: false,
+
+    /**
+     * Property: feature
+     * {<OpenLayers.Feature.Vector>} The currently drawn polygon feature
+     */
+    feature: null,
+
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>} The temporary drawing layer
+     */
+    layer: null,
+
+    /**
+     * Property: origin
+     * {<OpenLayers.Geometry.Point>} Location of the first mouse down
+     */
+    origin: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.RegularPolygon
+     * Create a new regular polygon handler.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that owns this handler
+     * callbacks - {Object} An object with a properties whose values are
+     *     functions.  Various callbacks described below.
+     * options - {Object} An object with properties to be set on the handler.
+     *     If the options.sides property is not specified, the number of sides
+     *     will default to 4.
+     *
+     * Named callbacks:
+     * create - Called when a sketch is first created.  Callback called with
+     *     the creation point geometry and sketch feature.
+     * done - Called when the sketch drawing is finished.  The callback will
+     *     recieve a single argument, the sketch geometry.
+     * cancel - Called when the handler is deactivated while drawing.  The
+     *     cancel callback will receive a geometry.
+     */
+    initialize: function(control, callbacks, options) {
+        if(!(options && options.layerOptions && options.layerOptions.styleMap)) {
+            this.style = OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'], {});
+        }
+
+        OpenLayers.Handler.prototype.initialize.apply(this,
+                                                [control, callbacks, options]);
+        this.options = (options) ? options : {};
+    },
+    
+    /**
+     * APIMethod: setOptions
+     * 
+     * Parameters:
+     * newOptions - {Object} 
+     */
+    setOptions: function (newOptions) {
+        OpenLayers.Util.extend(this.options, newOptions);
+        OpenLayers.Util.extend(this, newOptions);
+    },
+    
+    /**
+     * APIMethod: activate
+     * Turn on the handler.
+     *
+     * Return:
+     * {Boolean} The handler was successfully activated
+     */
+    activate: function() {
+        var activated = false;
+        if(OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            // create temporary vector layer for rendering geometry sketch
+            var options = OpenLayers.Util.extend({
+                displayInLayerSwitcher: false,
+                // indicate that the temp vector layer will never be out of range
+                // without this, resolution properties must be specified at the
+                // map-level for this temporary layer to init its resolutions
+                // correctly
+                calculateInRange: OpenLayers.Function.True
+            }, this.layerOptions);
+            this.layer = new OpenLayers.Layer.Vector(this.CLASS_NAME, options);
+            this.map.addLayer(this.layer);
+            activated = true;
+        }
+        return activated;
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Turn off the handler.
+     *
+     * Return:
+     * {Boolean} The handler was successfully deactivated
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Handler.Drag.prototype.deactivate.apply(this, arguments)) {
+            // call the cancel callback if mid-drawing
+            if(this.dragging) {
+                this.cancel();
+            }
+            // If a layer's map property is set to null, it means that that
+            // layer isn't added to the map. Since we ourself added the layer
+            // to the map in activate(), we can assume that if this.layer.map
+            // is null it means that the layer has been destroyed (as a result
+            // of map.destroy() for example.
+            if (this.layer.map != null) {
+                this.layer.destroy(false);
+                if (this.feature) {
+                    this.feature.destroy();
+                }
+            }
+            this.layer = null;
+            this.feature = null;
+            deactivated = true;
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: down
+     * Start drawing a new feature
+     *
+     * Parameters:
+     * evt - {Event} The drag start event
+     */
+    down: function(evt) {
+        this.fixedRadius = !!(this.radius);
+        var maploc = this.map.getLonLatFromPixel(evt.xy);
+        this.origin = new OpenLayers.Geometry.Point(maploc.lon, maploc.lat);
+        // create the new polygon
+        if(!this.fixedRadius || this.irregular) {
+            // smallest radius should not be less one pixel in map units
+            // VML doesn't behave well with smaller
+            this.radius = this.map.getResolution();
+        }
+        if(this.persist) {
+            this.clear();
+        }
+        this.feature = new OpenLayers.Feature.Vector();
+        this.createGeometry();
+        this.callback("create", [this.origin, this.feature]);
+        this.layer.addFeatures([this.feature], {silent: true});
+        this.layer.drawFeature(this.feature, this.style);
+    },
+    
+    /**
+     * Method: move
+     * Respond to drag move events
+     *
+     * Parameters:
+     * evt - {Evt} The move event
+     */
+    move: function(evt) {
+        var maploc = this.map.getLonLatFromPixel(evt.xy);
+        var point = new OpenLayers.Geometry.Point(maploc.lon, maploc.lat);
+        if(this.irregular) {
+            var ry = Math.sqrt(2) * Math.abs(point.y - this.origin.y) / 2;
+            this.radius = Math.max(this.map.getResolution() / 2, ry);
+        } else if(this.fixedRadius) {
+            this.origin = point;
+        } else {
+            this.calculateAngle(point, evt);
+            this.radius = Math.max(this.map.getResolution() / 2,
+                                   point.distanceTo(this.origin));
+        }
+        this.modifyGeometry();
+        if(this.irregular) {
+            var dx = point.x - this.origin.x;
+            var dy = point.y - this.origin.y;
+            var ratio;
+            if(dy == 0) {
+                ratio = dx / (this.radius * Math.sqrt(2));
+            } else {
+                ratio = dx / dy;
+            }
+            this.feature.geometry.resize(1, this.origin, ratio);
+            this.feature.geometry.move(dx / 2, dy / 2);
+        }
+        this.layer.drawFeature(this.feature, this.style);
+    },
+
+    /**
+     * Method: up
+     * Finish drawing the feature
+     *
+     * Parameters:
+     * evt - {Event} The mouse up event
+     */
+    up: function(evt) {
+        this.finalize();
+        // the mouseup method of superclass doesn't call the
+        // "done" callback if there's been no move between
+        // down and up
+        if (this.start == this.last) {
+            this.callback("done", [evt.xy]);
+        }
+    },
+
+    /**
+     * Method: out
+     * Finish drawing the feature.
+     *
+     * Parameters:
+     * evt - {Event} The mouse out event
+     */
+    out: function(evt) {
+        this.finalize();
+    },
+
+    /**
+     * Method: createGeometry
+     * Create the new polygon geometry.  This is called at the start of the
+     *     drag and at any point during the drag if the number of sides
+     *     changes.
+     */
+    createGeometry: function() {
+        this.angle = Math.PI * ((1/this.sides) - (1/2));
+        if(this.snapAngle) {
+            this.angle += this.snapAngle * (Math.PI / 180);
+        }
+        this.feature.geometry = OpenLayers.Geometry.Polygon.createRegularPolygon(
+            this.origin, this.radius, this.sides, this.snapAngle
+        );
+    },
+    
+    /**
+     * Method: modifyGeometry
+     * Modify the polygon geometry in place.
+     */
+    modifyGeometry: function() {
+        var angle, point;
+        var ring = this.feature.geometry.components[0];
+        // if the number of sides ever changes, create a new geometry
+        if(ring.components.length != (this.sides + 1)) {
+            this.createGeometry();
+            ring = this.feature.geometry.components[0];
+        }
+        for(var i=0; i<this.sides; ++i) {
+            point = ring.components[i];
+            angle = this.angle + (i * 2 * Math.PI / this.sides);
+            point.x = this.origin.x + (this.radius * Math.cos(angle));
+            point.y = this.origin.y + (this.radius * Math.sin(angle));
+            point.clearBounds();
+        }
+    },
+    
+    /**
+     * Method: calculateAngle
+     * Calculate the angle based on settings.
+     *
+     * Parameters:
+     * point - {<OpenLayers.Geometry.Point>}
+     * evt - {Event}
+     */
+    calculateAngle: function(point, evt) {
+        var alpha = Math.atan2(point.y - this.origin.y,
+                               point.x - this.origin.x);
+        if(this.snapAngle && (this.snapToggle && !evt[this.snapToggle])) {
+            var snapAngleRad = (Math.PI / 180) * this.snapAngle;
+            this.angle = Math.round(alpha / snapAngleRad) * snapAngleRad;
+        } else {
+            this.angle = alpha;
+        }
+    },
+
+    /**
+     * APIMethod: cancel
+     * Finish the geometry and call the "cancel" callback.
+     */
+    cancel: function() {
+        // the polygon geometry gets cloned in the callback method
+        this.callback("cancel", null);
+        this.finalize();
+    },
+
+    /**
+     * Method: finalize
+     * Finish the geometry and call the "done" callback.
+     */
+    finalize: function() {
+        this.origin = null;
+        this.radius = this.options.radius;
+    },
+
+    /**
+     * APIMethod: clear
+     * Clear any rendered features on the temporary layer.  This is called
+     *     when the handler is deactivated, canceled, or done (unless persist
+     *     is true).
+     */
+    clear: function() {
+        if (this.layer) {
+            this.layer.renderer.clear();
+            this.layer.destroyFeatures();
+        }
+    },
+    
+    /**
+     * Method: callback
+     * Trigger the control's named callback with the given arguments
+     *
+     * Parameters:
+     * name - {String} The key for the callback that is one of the properties
+     *     of the handler's callbacks object.
+     * args - {Array} An array of arguments with which to call the callback
+     *     (defined by the control).
+     */
+    callback: function (name, args) {
+        // override the callback method to always send the polygon geometry
+        if (this.callbacks[name]) {
+            this.callbacks[name].apply(this.control,
+                                       [this.feature.geometry.clone()]);
+        }
+        // since sketch features are added to the temporary layer
+        // they must be cleared here if done or cancel
+        if(!this.persist && (name == "done" || name == "cancel")) {
+            this.clear();
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.RegularPolygon"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Feature.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Feature.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Feature.js	(revision 76)
@@ -0,0 +1,388 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Handler.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Feature 
+ * Handler to respond to mouse events related to a drawn feature.  Callbacks
+ *     with the following keys will be notified of the following events
+ *     associated with features: click, clickout, over, out, and dblclick.
+ *
+ * This handler stops event propagation for mousedown and mouseup if those
+ *     browser events target features that can be selected.
+ */
+OpenLayers.Handler.Feature = OpenLayers.Class(OpenLayers.Handler, {
+
+    /**
+     * Property: EVENTMAP
+     * {Object} A object mapping the browser events to objects with callback
+     *     keys for in and out.
+     */
+    EVENTMAP: {
+        'click': {'in': 'click', 'out': 'clickout'},
+        'mousemove': {'in': 'over', 'out': 'out'},
+        'dblclick': {'in': 'dblclick', 'out': null},
+        'mousedown': {'in': null, 'out': null},
+        'mouseup': {'in': null, 'out': null}
+    },
+
+    /**
+     * Property: feature
+     * {<OpenLayers.Feature.Vector>} The last feature that was hovered.
+     */
+    feature: null,
+
+    /**
+     * Property: lastFeature
+     * {<OpenLayers.Feature.Vector>} The last feature that was handled.
+     */
+    lastFeature: null,
+
+    /**
+     * Property: down
+     * {<OpenLayers.Pixel>} The location of the last mousedown.
+     */
+    down: null,
+
+    /**
+     * Property: up
+     * {<OpenLayers.Pixel>} The location of the last mouseup.
+     */
+    up: null,
+    
+    /**
+     * Property: clickTolerance
+     * {Number} The number of pixels the mouse can move between mousedown
+     *     and mouseup for the event to still be considered a click.
+     *     Dragging the map should not trigger the click and clickout callbacks
+     *     unless the map is moved by less than this tolerance. Defaults to 4.
+     */
+    clickTolerance: 4,
+
+    /**
+     * Property: geometryTypes
+     * To restrict dragging to a limited set of geometry types, send a list
+     * of strings corresponding to the geometry class names.
+     * 
+     * @type Array(String)
+     */
+    geometryTypes: null,
+
+    /**
+     * Property: stopClick
+     * {Boolean} If stopClick is set to true, handled clicks do not
+     *      propagate to other click listeners. Otherwise, handled clicks
+     *      do propagate. Unhandled clicks always propagate, whatever the
+     *      value of stopClick. Defaults to true.
+     */
+    stopClick: true,
+
+    /**
+     * Property: stopDown
+     * {Boolean} If stopDown is set to true, handled mousedowns do not
+     *      propagate to other mousedown listeners. Otherwise, handled
+     *      mousedowns do propagate. Unhandled mousedowns always propagate,
+     *      whatever the value of stopDown. Defaults to true.
+     */
+    stopDown: true,
+
+    /**
+     * Property: stopUp
+     * {Boolean} If stopUp is set to true, handled mouseups do not
+     *      propagate to other mouseup listeners. Otherwise, handled mouseups
+     *      do propagate. Unhandled mouseups always propagate, whatever the
+     *      value of stopUp. Defaults to false.
+     */
+    stopUp: false,
+    
+    /**
+     * Constructor: OpenLayers.Handler.Feature
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} 
+     * layer - {<OpenLayers.Layer.Vector>}
+     * callbacks - {Object} An object with a 'over' property whos value is
+     *     a function to be called when the mouse is over a feature. The 
+     *     callback should expect to recieve a single argument, the feature.
+     * options - {Object} 
+     */
+    initialize: function(control, layer, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, [control, callbacks, options]);
+        this.layer = layer;
+    },
+
+
+    /**
+     * Method: mousedown
+     * Handle mouse down.  Stop propagation if a feature is targeted by this
+     *     event (stops map dragging during feature selection).
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    mousedown: function(evt) {
+        this.down = evt.xy;
+        return this.handle(evt) ? !this.stopDown : true;
+    },
+    
+    /**
+     * Method: mouseup
+     * Handle mouse up.  Stop propagation if a feature is targeted by this
+     *     event.
+     * 
+     * Parameters:
+     * evt - {Event} 
+     */
+    mouseup: function(evt) {
+        this.up = evt.xy;
+        return this.handle(evt) ? !this.stopUp : true;
+    },
+
+    /**
+     * Method: click
+     * Handle click.  Call the "click" callback if click on a feature,
+     *     or the "clickout" callback if click outside any feature.
+     * 
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean}
+     */
+    click: function(evt) {
+        return this.handle(evt) ? !this.stopClick : true;
+    },
+        
+    /**
+     * Method: mousemove
+     * Handle mouse moves.  Call the "over" callback if moving in to a feature,
+     *     or the "out" callback if moving out of a feature.
+     * 
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean}
+     */
+    mousemove: function(evt) {
+        if (!this.callbacks['over'] && !this.callbacks['out']) {
+            return true;
+        }     
+        this.handle(evt);
+        return true;
+    },
+    
+    /**
+     * Method: dblclick
+     * Handle dblclick.  Call the "dblclick" callback if dblclick on a feature.
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean}
+     */
+    dblclick: function(evt) {
+        return !this.handle(evt);
+    },
+
+    /**
+     * Method: geometryTypeMatches
+     * Return true if the geometry type of the passed feature matches
+     *     one of the geometry types in the geometryTypes array.
+     *
+     * Parameters:
+     * feature - {<OpenLayers.Vector.Feature>}
+     *
+     * Returns:
+     * {Boolean}
+     */
+    geometryTypeMatches: function(feature) {
+        return this.geometryTypes == null ||
+            OpenLayers.Util.indexOf(this.geometryTypes,
+                                    feature.geometry.CLASS_NAME) > -1;
+    },
+
+    /**
+     * Method: handle
+     *
+     * Parameters:
+     * evt - {Event}
+     *
+     * Returns:
+     * {Boolean} The event occurred over a relevant feature.
+     */
+    handle: function(evt) {
+        if(this.feature && !this.feature.layer) {
+            // feature has been destroyed
+            this.feature = null;
+        }
+        var type = evt.type;
+        var handled = false;
+        var previouslyIn = !!(this.feature); // previously in a feature
+        var click = (type == "click" || type == "dblclick");
+        this.feature = this.layer.getFeatureFromEvent(evt);
+        if(this.feature && !this.feature.layer) {
+            // feature has been destroyed
+            this.feature = null;
+        }
+        if(this.lastFeature && !this.lastFeature.layer) {
+            // last feature has been destroyed
+            this.lastFeature = null;
+        }
+        if(this.feature) {
+            var inNew = (this.feature != this.lastFeature);
+            if(this.geometryTypeMatches(this.feature)) {
+                // in to a feature
+                if(previouslyIn && inNew) {
+                    // out of last feature and in to another
+                    if(this.lastFeature) {
+                        this.triggerCallback(type, 'out', [this.lastFeature]);
+                    }
+                    this.triggerCallback(type, 'in', [this.feature]);
+                } else if(!previouslyIn || click) {
+                    // in feature for the first time
+                    this.triggerCallback(type, 'in', [this.feature]);
+                }
+                this.lastFeature = this.feature;
+                handled = true;
+            } else {
+                // not in to a feature
+                if(this.lastFeature && (previouslyIn && inNew || click)) {
+                    // out of last feature for the first time
+                    this.triggerCallback(type, 'out', [this.lastFeature]);
+                }
+                // next time the mouse goes in a feature whose geometry type
+                // doesn't match we don't want to call the 'out' callback
+                // again, so let's set this.feature to null so that
+                // previouslyIn will evaluate to false the next time
+                // we enter handle. Yes, a bit hackish...
+                this.feature = null;
+            }
+        } else {
+            if(this.lastFeature && (previouslyIn || click)) {
+                this.triggerCallback(type, 'out', [this.lastFeature]);
+            }
+        }
+        return handled;
+    },
+    
+    /**
+     * Method: triggerCallback
+     * Call the callback keyed in the event map with the supplied arguments.
+     *     For click and clickout, the <clickTolerance> is checked first.
+     *
+     * Parameters:
+     * type - {String}
+     */
+    triggerCallback: function(type, mode, args) {
+        var key = this.EVENTMAP[type][mode];
+        if(key) {
+            if(type == 'click' && this.up && this.down) {
+                // for click/clickout, only trigger callback if tolerance is met
+                var dpx = Math.sqrt(
+                    Math.pow(this.up.x - this.down.x, 2) +
+                    Math.pow(this.up.y - this.down.y, 2)
+                );
+                if(dpx <= this.clickTolerance) {
+                    this.callback(key, args);
+                }
+            } else {
+                this.callback(key, args);
+            }
+        }
+    },
+
+    /**
+     * Method: activate 
+     * Turn on the handler.  Returns false if the handler was already active.
+     *
+     * Returns:
+     * {Boolean}
+     */
+    activate: function() {
+        var activated = false;
+        if(OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            this.moveLayerToTop();
+            this.map.events.on({
+                "removelayer": this.handleMapEvents,
+                "changelayer": this.handleMapEvents,
+                scope: this
+            });
+            activated = true;
+        }
+        return activated;
+    },
+    
+    /**
+     * Method: deactivate 
+     * Turn off the handler.  Returns false if the handler was already active.
+     *
+     * Returns: 
+     * {Boolean}
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            this.moveLayerBack();
+            this.feature = null;
+            this.lastFeature = null;
+            this.down = null;
+            this.up = null;
+            this.map.events.un({
+                "removelayer": this.handleMapEvents,
+                "changelayer": this.handleMapEvents,
+                scope: this
+            });
+            deactivated = true;
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method handleMapEvents
+     * 
+     * Parameters:
+     * evt - {Object}
+     */
+    handleMapEvents: function(evt) {
+        if (!evt.property || evt.property == "order") {
+            this.moveLayerToTop();
+        }
+    },
+    
+    /**
+     * Method: moveLayerToTop
+     * Moves the layer for this handler to the top, so mouse events can reach
+     * it.
+     */
+    moveLayerToTop: function() {
+        var index = Math.max(this.map.Z_INDEX_BASE['Feature'] - 1,
+            this.layer.getZIndex()) + 1;
+        this.layer.setZIndex(index);
+        
+    },
+    
+    /**
+     * Method: moveLayerBack
+     * Moves the layer back to the position determined by the map's layers
+     * array.
+     */
+    moveLayerBack: function() {
+        var index = this.layer.getZIndex() - 1;
+        if (index >= this.map.Z_INDEX_BASE['Feature']) {
+            this.layer.setZIndex(index);
+        } else {
+            this.map.setLayerZIndex(this.layer,
+                this.map.getLayerIndex(this.layer));
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Feature"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Path.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Path.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Path.js	(revision 76)
@@ -0,0 +1,302 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+
+/**
+ * @requires OpenLayers/Handler/Point.js
+ * @requires OpenLayers/Geometry/Point.js
+ * @requires OpenLayers/Geometry/LineString.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Path
+ * Handler to draw a path on the map.  Path is displayed on mouse down,
+ * moves on mouse move, and is finished on mouse up.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Handler.Point>
+ */
+OpenLayers.Handler.Path = OpenLayers.Class(OpenLayers.Handler.Point, {
+    
+    /**
+     * Property: line
+     * {<OpenLayers.Feature.Vector>}
+     */
+    line: null,
+    
+    /**
+     * Property: freehand
+     * {Boolean} In freehand mode, the handler starts the path on mouse down,
+     * adds a point for every mouse move, and finishes the path on mouse up.
+     * Outside of freehand mode, a point is added to the path on every mouse
+     * click and double-click finishes the path.
+     */
+    freehand: false,
+    
+    /**
+     * Property: freehandToggle
+     * {String} If set, freehandToggle is checked on mouse events and will set
+     * the freehand mode to the opposite of this.freehand.  To disallow
+     * toggling between freehand and non-freehand mode, set freehandToggle to
+     * null.  Acceptable toggle values are 'shiftKey', 'ctrlKey', and 'altKey'.
+     */
+    freehandToggle: 'shiftKey',
+
+    /**
+     * Constructor: OpenLayers.Handler.Path
+     * Create a new path hander
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that owns this handler
+     * callbacks - {Object} An object with a properties whose values are
+     *     functions.  Various callbacks described below.
+     * options - {Object} An optional object with properties to be set on the
+     *           handler
+     *
+     * Named callbacks:
+     * create - Called when a sketch is first created.  Callback called with
+     *     the creation point geometry and sketch feature.
+     * modify - Called with each move of a vertex with the vertex (point)
+     *     geometry and the sketch feature.
+     * point - Called as each point is added.  Receives the new point geometry.
+     * done - Called when the point drawing is finished.  The callback will
+     *     recieve a single argument, the linestring geometry.
+     * cancel - Called when the handler is deactivated while drawing.  The
+     *     cancel callback will receive a geometry.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.Point.prototype.initialize.apply(this, arguments);
+    },
+        
+    /**
+     * Method: createFeature
+     * Add temporary geometries
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} The initial pixel location for the new
+     *     feature.
+     */
+    createFeature: function(pixel) {
+        var lonlat = this.control.map.getLonLatFromPixel(pixel);
+        this.point = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat)
+        );
+        this.line = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.LineString([this.point.geometry])
+        );
+        this.callback("create", [this.point.geometry, this.getSketch()]);
+        this.point.geometry.clearBounds();
+        this.layer.addFeatures([this.line, this.point], {silent: true});
+    },
+        
+    /**
+     * Method: destroyFeature
+     * Destroy temporary geometries
+     */
+    destroyFeature: function() {
+        OpenLayers.Handler.Point.prototype.destroyFeature.apply(this);
+        this.line = null;
+    },
+
+    /**
+     * Method: removePoint
+     * Destroy the temporary point.
+     */
+    removePoint: function() {
+        if(this.point) {
+            this.layer.removeFeatures([this.point]);
+        }
+    },
+    
+    /**
+     * Method: addPoint
+     * Add point to geometry.  Send the point index to override
+     * the behavior of LinearRing that disregards adding duplicate points.
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} The pixel location for the new point.
+     */
+    addPoint: function(pixel) {
+        this.layer.removeFeatures([this.point]);
+        var lonlat = this.control.map.getLonLatFromPixel(pixel);
+        this.point = new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat)
+        );
+        this.line.geometry.addComponent(
+            this.point.geometry, this.line.geometry.components.length
+        );
+        this.callback("point", [this.point.geometry, this.getGeometry()]);
+        this.callback("modify", [this.point.geometry, this.getSketch()]);
+        this.drawFeature();
+    },
+    
+    /**
+     * Method: freehandMode
+     * Determine whether to behave in freehand mode or not.
+     *
+     * Returns:
+     * {Boolean}
+     */
+    freehandMode: function(evt) {
+        return (this.freehandToggle && evt[this.freehandToggle]) ?
+                    !this.freehand : this.freehand;
+    },
+
+    /**
+     * Method: modifyFeature
+     * Modify the existing geometry given the new point
+     *
+     * Parameters:
+     * pixel - {<OpenLayers.Pixel>} The updated pixel location for the latest
+     *     point.
+     */
+    modifyFeature: function(pixel) {
+        var lonlat = this.control.map.getLonLatFromPixel(pixel);
+        this.point.geometry.x = lonlat.lon;
+        this.point.geometry.y = lonlat.lat;
+        this.callback("modify", [this.point.geometry, this.getSketch()]);
+        this.point.geometry.clearBounds();
+        this.drawFeature();
+    },
+
+    /**
+     * Method: drawFeature
+     * Render geometries on the temporary layer.
+     */
+    drawFeature: function() {
+        this.layer.drawFeature(this.line, this.style);
+        this.layer.drawFeature(this.point, this.style);
+    },
+
+    /**
+     * Method: getSketch
+     * Return the sketch feature.
+     *
+     * Returns:
+     * {<OpenLayers.Feature.Vector>}
+     */
+    getSketch: function() {
+        return this.line;
+    },
+
+    /**
+     * Method: getGeometry
+     * Return the sketch geometry.  If <multi> is true, this will return
+     *     a multi-part geometry.
+     *
+     * Returns:
+     * {<OpenLayers.Geometry.LineString>}
+     */
+    getGeometry: function() {
+        var geometry = this.line && this.line.geometry;
+        if(geometry && this.multi) {
+            geometry = new OpenLayers.Geometry.MultiLineString([geometry]);
+        }
+        return geometry;
+    },
+
+    /**
+     * Method: mousedown
+     * Handle mouse down.  Add a new point to the geometry and
+     * render it. Return determines whether to propagate the event on the map.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mousedown: function(evt) {
+        // ignore double-clicks
+        if (this.lastDown && this.lastDown.equals(evt.xy)) {
+            return false;
+        }
+        if(this.lastDown == null) {
+            if(this.persist) {
+                this.destroyFeature();
+            }
+            this.createFeature(evt.xy);
+        } else if((this.lastUp == null) || !this.lastUp.equals(evt.xy)) {
+            this.addPoint(evt.xy);
+        }
+        this.mouseDown = true;
+        this.lastDown = evt.xy;
+        this.drawing = true;
+        return false;
+    },
+
+    /**
+     * Method: mousemove
+     * Handle mouse move.  Adjust the geometry and redraw.
+     * Return determines whether to propagate the event on the map.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mousemove: function (evt) {
+        if(this.drawing) { 
+            if(this.mouseDown && this.freehandMode(evt)) {
+                this.addPoint(evt.xy);
+            } else {
+                this.modifyFeature(evt.xy);
+            }
+        }
+        return true;
+    },
+    
+    /**
+     * Method: mouseup
+     * Handle mouse up.  Send the latest point in the geometry to
+     * the control. Return determines whether to propagate the event on the map.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mouseup: function (evt) {
+        this.mouseDown = false;
+        if(this.drawing) {
+            if(this.freehandMode(evt)) {
+                this.removePoint();
+                this.finalize();
+            } else {
+                if(this.lastUp == null) {
+                   this.addPoint(evt.xy);
+                }
+                this.lastUp = evt.xy;
+            }
+            return false;
+        }
+        return true;
+    },
+  
+    /**
+     * Method: dblclick 
+     * Handle double-clicks.  Finish the geometry and send it back
+     * to the control.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    dblclick: function(evt) {
+        if(!this.freehandMode(evt)) {
+            var index = this.line.geometry.components.length - 1;
+            this.line.geometry.removeComponent(this.line.geometry.components[index]);
+            this.removePoint();
+            this.finalize();
+        }
+        return false;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Path"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Drag.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Drag.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Drag.js	(revision 76)
@@ -0,0 +1,420 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Drag
+ * The drag handler is used to deal with sequences of browser events related
+ *     to dragging.  The handler is used by controls that want to know when
+ *     a drag sequence begins, when a drag is happening, and when it has
+ *     finished.
+ *
+ * Controls that use the drag handler typically construct it with callbacks
+ *     for 'down', 'move', and 'done'.  Callbacks for these keys are called
+ *     when the drag begins, with each move, and when the drag is done.  In
+ *     addition, controls can have callbacks keyed to 'up' and 'out' if they
+ *     care to differentiate between the types of events that correspond with
+ *     the end of a drag sequence.  If no drag actually occurs (no mouse move)
+ *     the 'down' and 'up' callbacks will be called, but not the 'done'
+ *     callback.
+ *
+ * Create a new drag handler with the <OpenLayers.Handler.Drag> constructor.
+ *
+ * Inherits from:
+ *  - <OpenLayers.Handler>
+ */
+OpenLayers.Handler.Drag = OpenLayers.Class(OpenLayers.Handler, {
+  
+    /** 
+     * Property: started
+     * {Boolean} When a mousedown event is received, we want to record it, but
+     *     not set 'dragging' until the mouse moves after starting. 
+     */
+    started: false,
+    
+    /**
+     * Property: stopDown
+     * {Boolean} Stop propagation of mousedown events from getting to listeners
+     *     on the same element.  Default is true.
+     */
+    stopDown: true,
+
+    /** 
+     * Property: dragging 
+     * {Boolean} 
+     */
+    dragging: false,
+
+    /** 
+     * Property: last
+     * {<OpenLayers.Pixel>} The last pixel location of the drag.
+     */
+    last: null,
+
+    /** 
+     * Property: start
+     * {<OpenLayers.Pixel>} The first pixel location of the drag.
+     */
+    start: null,
+
+    /**
+     * Property: oldOnselectstart
+     * {Function}
+     */
+    oldOnselectstart: null,
+    
+    /**
+     * Property: interval
+     * {Integer} In order to increase performance, an interval (in 
+     *     milliseconds) can be set to reduce the number of drag events 
+     *     called. If set, a new drag event will not be set until the 
+     *     interval has passed. 
+     *     Defaults to 0, meaning no interval. 
+     */
+    interval: 0,
+    
+    /**
+     * Property: timeoutId
+     * {String} The id of the timeout used for the mousedown interval.
+     *     This is "private", and should be left alone.
+     */
+    timeoutId: null,
+    
+    /**
+     * APIProperty: documentDrag
+     * {Boolean} If set to true, the handler will also handle mouse moves when
+     *     the cursor has moved out of the map viewport. Default is false.
+     */
+    documentDrag: false,
+    
+    /**
+     * Property: documentEvents
+     * {<OpenLayers.Events>} Event instance for observing document events. Will
+     *     be set on mouseout if documentDrag is set to true.
+     */
+    documentEvents: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.Drag
+     * Returns OpenLayers.Handler.Drag
+     * 
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that is making use of
+     *     this handler.  If a handler is being used without a control, the
+     *     handlers setMap method must be overridden to deal properly with
+     *     the map.
+     * callbacks - {Object} An object containing a single function to be
+     *     called when the drag operation is finished. The callback should
+     *     expect to recieve a single argument, the pixel location of the event.
+     *     Callbacks for 'move' and 'done' are supported. You can also speficy
+     *     callbacks for 'down', 'up', and 'out' to respond to those events.
+     * options - {Object} 
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+    },
+    
+    /**
+     * The four methods below (down, move, up, and out) are used by subclasses
+     *     to do their own processing related to these mouse events.
+     */
+    
+    /**
+     * Method: down
+     * This method is called during the handling of the mouse down event.
+     *     Subclasses can do their own processing here.
+     *
+     * Parameters:
+     * evt - {Event} The mouse down event
+     */
+    down: function(evt) {
+    },
+    
+    /**
+     * Method: move
+     * This method is called during the handling of the mouse move event.
+     *     Subclasses can do their own processing here.
+     *
+     * Parameters:
+     * evt - {Event} The mouse move event
+     *
+     */
+    move: function(evt) {
+    },
+
+    /**
+     * Method: up
+     * This method is called during the handling of the mouse up event.
+     *     Subclasses can do their own processing here.
+     *
+     * Parameters:
+     * evt - {Event} The mouse up event
+     */
+    up: function(evt) {
+    },
+
+    /**
+     * Method: out
+     * This method is called during the handling of the mouse out event.
+     *     Subclasses can do their own processing here.
+     *
+     * Parameters:
+     * evt - {Event} The mouse out event
+     */
+    out: function(evt) {
+    },
+
+    /**
+     * The methods below are part of the magic of event handling.  Because
+     *     they are named like browser events, they are registered as listeners
+     *     for the events they represent.
+     */
+
+    /**
+     * Method: mousedown
+     * Handle mousedown events
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean} Let the event propagate.
+     */
+    mousedown: function (evt) {
+        var propagate = true;
+        this.dragging = false;
+        if (this.checkModifiers(evt) && OpenLayers.Event.isLeftClick(evt)) {
+            this.started = true;
+            this.start = evt.xy;
+            this.last = evt.xy;
+            OpenLayers.Element.addClass(
+                this.map.viewPortDiv, "olDragDown"
+            );
+            this.down(evt);
+            this.callback("down", [evt.xy]);
+            OpenLayers.Event.stop(evt);
+            
+            if(!this.oldOnselectstart) {
+                this.oldOnselectstart = (document.onselectstart) ? document.onselectstart : OpenLayers.Function.True;
+            }
+            document.onselectstart = OpenLayers.Function.False;
+            
+            propagate = !this.stopDown;
+        } else {
+            this.started = false;
+            this.start = null;
+            this.last = null;
+        }
+        return propagate;
+    },
+
+    /**
+     * Method: mousemove
+     * Handle mousemove events
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean} Let the event propagate.
+     */
+    mousemove: function (evt) {
+        if (this.started && !this.timeoutId && (evt.xy.x != this.last.x || evt.xy.y != this.last.y)) {
+            if(this.documentDrag === true && this.documentEvents) {
+                if(evt.element === document) {
+                    this.adjustXY(evt);
+                    // do setEvent manually because the documentEvents are not
+                    // registered with the map
+                    this.setEvent(evt);
+                } else {
+                    this.destroyDocumentEvents();
+                }
+            }
+            if (this.interval > 0) {
+                this.timeoutId = setTimeout(OpenLayers.Function.bind(this.removeTimeout, this), this.interval);
+            }
+            this.dragging = true;
+            this.move(evt);
+            this.callback("move", [evt.xy]);
+            if(!this.oldOnselectstart) {
+                this.oldOnselectstart = document.onselectstart;
+                document.onselectstart = OpenLayers.Function.False;
+            }
+            this.last = this.evt.xy;
+        }
+        return true;
+    },
+    
+    /**
+     * Method: removeTimeout
+     * Private. Called by mousemove() to remove the drag timeout.
+     */
+    removeTimeout: function() {
+        this.timeoutId = null;
+    },
+
+    /**
+     * Method: mouseup
+     * Handle mouseup events
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean} Let the event propagate.
+     */
+    mouseup: function (evt) {
+        if (this.started) {
+            if(this.documentDrag === true && this.documentEvents) {
+                this.adjustXY(evt);
+                this.destroyDocumentEvents();
+            }
+            var dragged = (this.start != this.last);
+            this.started = false;
+            this.dragging = false;
+            OpenLayers.Element.removeClass(
+                this.map.viewPortDiv, "olDragDown"
+            );
+            this.up(evt);
+            this.callback("up", [evt.xy]);
+            if(dragged) {
+                this.callback("done", [evt.xy]);
+            }
+            document.onselectstart = this.oldOnselectstart;
+        }
+        return true;
+    },
+
+    /**
+     * Method: mouseout
+     * Handle mouseout events
+     *
+     * Parameters:
+     * evt - {Event} 
+     *
+     * Returns:
+     * {Boolean} Let the event propagate.
+     */
+    mouseout: function (evt) {
+        if (this.started && OpenLayers.Util.mouseLeft(evt, this.map.div)) {
+            if(this.documentDrag === true) {
+                this.documentEvents = new OpenLayers.Events(this, document,
+                                            null, null, {includeXY: true});
+                this.documentEvents.on({
+                    mousemove: this.mousemove,
+                    mouseup: this.mouseup
+                });
+                OpenLayers.Element.addClass(
+                    document.body, "olDragDown"
+                );
+            } else {
+                var dragged = (this.start != this.last);
+                this.started = false; 
+                this.dragging = false;
+                OpenLayers.Element.removeClass(
+                    this.map.viewPortDiv, "olDragDown"
+                );
+                this.out(evt);
+                this.callback("out", []);
+                if(dragged) {
+                    this.callback("done", [evt.xy]);
+                }
+                if(document.onselectstart) {
+                    document.onselectstart = this.oldOnselectstart;
+                }
+            }
+        }
+        return true;
+    },
+
+    /**
+     * Method: click
+     * The drag handler captures the click event.  If something else registers
+     *     for clicks on the same element, its listener will not be called 
+     *     after a drag.
+     * 
+     * Parameters: 
+     * evt - {Event} 
+     * 
+     * Returns:
+     * {Boolean} Let the event propagate.
+     */
+    click: function (evt) {
+        // let the click event propagate only if the mouse moved
+        return (this.start == this.last);
+    },
+
+    /**
+     * Method: activate
+     * Activate the handler.
+     * 
+     * Returns:
+     * {Boolean} The handler was successfully activated.
+     */
+    activate: function() {
+        var activated = false;
+        if(OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            this.dragging = false;
+            activated = true;
+        }
+        return activated;
+    },
+
+    /**
+     * Method: deactivate 
+     * Deactivate the handler.
+     * 
+     * Returns:
+     * {Boolean} The handler was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            this.started = false;
+            this.dragging = false;
+            this.start = null;
+            this.last = null;
+            deactivated = true;
+            OpenLayers.Element.removeClass(
+                this.map.viewPortDiv, "olDragDown"
+            );
+        }
+        return deactivated;
+    },
+    
+    /**
+     * Method: adjustXY
+     * Converts event coordinates that are relative to the document body to
+     * ones that are relative to the map viewport. The latter is the default in
+     * OpenLayers.
+     * 
+     * Parameters:
+     * evt - {Object}
+     */
+    adjustXY: function(evt) {
+        var pos = OpenLayers.Util.pagePosition(this.map.div);
+        evt.xy.x -= pos[0];
+        evt.xy.y -= pos[1];
+    },
+    
+    /**
+     * Method: destroyDocumentEvents
+     * Destroys the events instance that gets added to the document body when
+     * documentDrag is true and the mouse cursor leaves the map viewport while
+     * dragging.
+     */
+    destroyDocumentEvents: function() {
+        OpenLayers.Element.removeClass(
+            document.body, "olDragDown"
+        );
+        this.documentEvents.destroy();
+        this.documentEvents = null;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Drag"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/MouseWheel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/MouseWheel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/MouseWheel.js	(revision 76)
@@ -0,0 +1,283 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.MouseWheel
+ * Handler for wheel up/down events.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler>
+ */
+OpenLayers.Handler.MouseWheel = OpenLayers.Class(OpenLayers.Handler, {
+    /** 
+     * Property: wheelListener 
+     * {function} 
+     */
+    wheelListener: null,
+
+    /** 
+     * Property: mousePosition
+     * {<OpenLayers.Pixel>} mousePosition is necessary because
+     * evt.clientX/Y is buggy in Moz on wheel events, so we cache and use the
+     * value from the last mousemove.
+     */
+    mousePosition: null,
+
+    /**
+     * Property: interval
+     * {Integer} In order to increase server performance, an interval (in 
+     *     milliseconds) can be set to reduce the number of up/down events 
+     *     called. If set, a new up/down event will not be set until the 
+     *     interval has passed. 
+     *     Defaults to 0, meaning no interval. 
+     */
+    interval: 0,
+    
+    /**
+     * Property: delta
+     * {Integer} When interval is set, delta collects the mousewheel z-deltas
+     *     of the events that occur within the interval.
+     *      See also the cumulative option
+     */
+    delta: 0,
+    
+    /**
+     * Property: cumulative
+     * {Boolean} When interval is set: true to collect all the mousewheel 
+     *     z-deltas, false to only record the delta direction (positive or
+     *     negative)
+     */
+    cumulative: true,
+
+    /**
+     * Constructor: OpenLayers.Handler.MouseWheel
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} 
+     * callbacks - {Object} An object containing a single function to be
+     *                          called when the drag operation is finished.
+     *                          The callback should expect to recieve a single
+     *                          argument, the point geometry.
+     * options - {Object} 
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+        this.wheelListener = OpenLayers.Function.bindAsEventListener(
+            this.onWheelEvent, this
+        );
+    },
+
+    /**
+     * Method: destroy
+     */    
+    destroy: function() {
+        OpenLayers.Handler.prototype.destroy.apply(this, arguments);
+        this.wheelListener = null;
+    },
+
+    /**
+     *  Mouse ScrollWheel code thanks to http://adomas.org/javascript-mouse-wheel/
+     */
+
+    /** 
+     * Method: onWheelEvent
+     * Catch the wheel event and handle it xbrowserly
+     * 
+     * Parameters:
+     * e - {Event} 
+     */
+    onWheelEvent: function(e){
+        
+        // make sure we have a map and check keyboard modifiers
+        if (!this.map || !this.checkModifiers(e)) {
+            return;
+        }
+        
+        // Ride up the element's DOM hierarchy to determine if it or any of 
+        //  its ancestors was: 
+        //   * specifically marked as scrollable
+        //   * one of our layer divs
+        //   * the map div
+        //
+        var overScrollableDiv = false;
+        var overLayerDiv = false;
+        var overMapDiv = false;
+        
+        var elem = OpenLayers.Event.element(e);
+        while((elem != null) && !overMapDiv && !overScrollableDiv) {
+
+            if (!overScrollableDiv) {
+                try {
+                    if (elem.currentStyle) {
+                        overflow = elem.currentStyle["overflow"];
+                    } else {
+                        var style = 
+                            document.defaultView.getComputedStyle(elem, null);
+                        var overflow = style.getPropertyValue("overflow");
+                    }
+                    overScrollableDiv = ( overflow && 
+                        (overflow == "auto") || (overflow == "scroll") );
+                } catch(err) {
+                    //sometimes when scrolling in a popup, this causes 
+                    // obscure browser error
+                }
+            }
+
+            if (!overLayerDiv) {
+                for(var i=0, len=this.map.layers.length; i<len; i++) {
+                    // Are we in the layer div? Note that we have two cases
+                    // here: one is to catch EventPane layers, which have a 
+                    // pane above the layer (layer.pane)
+                    if (elem == this.map.layers[i].div 
+                        || elem == this.map.layers[i].pane) { 
+                        overLayerDiv = true;
+                        break;
+                    }
+                }
+            }
+            overMapDiv = (elem == this.map.div);
+
+            elem = elem.parentNode;
+        }
+        
+        // Logic below is the following:
+        //
+        // If we are over a scrollable div or not over the map div:
+        //  * do nothing (let the browser handle scrolling)
+        //
+        //    otherwise 
+        // 
+        //    If we are over the layer div: 
+        //     * zoom/in out
+        //     then
+        //     * kill event (so as not to also scroll the page after zooming)
+        //
+        //       otherwise
+        //
+        //       Kill the event (dont scroll the page if we wheel over the 
+        //        layerswitcher or the pan/zoom control)
+        //
+        if (!overScrollableDiv && overMapDiv) {
+            if (overLayerDiv) {
+                var delta = 0;
+                if (!e) {
+                    e = window.event;
+                }
+                if (e.wheelDelta) {
+                    delta = e.wheelDelta/120; 
+                    if (window.opera && window.opera.version() < 9.2) {
+                        delta = -delta;
+                    }
+                } else if (e.detail) {
+                    delta = -e.detail / 3;
+                }
+                this.delta = this.delta + delta;
+
+                if(this.interval) {
+                    window.clearTimeout(this._timeoutId);
+                    this._timeoutId = window.setTimeout(
+                        OpenLayers.Function.bind(function(){
+                            this.wheelZoom(e);
+                        }, this),
+                        this.interval
+                    );
+                } else {
+                    this.wheelZoom(e);
+                }
+            }
+            OpenLayers.Event.stop(e);
+        }
+    },
+
+    /**
+     * Method: wheelZoom
+     * Given the wheel event, we carry out the appropriate zooming in or out,
+     *     based on the 'wheelDelta' or 'detail' property of the event.
+     * 
+     * Parameters:
+     * e - {Event}
+     */
+    wheelZoom: function(e) {
+        var delta = this.delta;
+        this.delta = 0;
+        
+        if (delta) {
+            // add the mouse position to the event because mozilla has 
+            // a bug with clientX and clientY (see 
+            // https://bugzilla.mozilla.org/show_bug.cgi?id=352179)
+            // getLonLatFromViewPortPx(e) returns wrong values
+            if (this.mousePosition) {
+                e.xy = this.mousePosition;
+            } 
+            if (!e.xy) {
+                // If the mouse hasn't moved over the map yet, then
+                // we don't have a mouse position (in FF), so we just
+                // act as if the mouse was at the center of the map.
+                // Note that we can tell we are in the map -- and 
+                // this.map is ensured to be true above.
+                e.xy = this.map.getPixelFromLonLat(
+                    this.map.getCenter()
+                );
+            }
+            if (delta < 0) {
+                this.callback("down", [e, this.cumulative ? delta : -1]);
+            } else {
+                this.callback("up", [e, this.cumulative ? delta : 1]);
+            }
+        }
+    },
+    
+    /**
+     * Method: mousemove
+     * Update the stored mousePosition on every move.
+     * 
+     * Parameters:
+     * evt - {Event} The browser event
+     *
+     * Returns: 
+     * {Boolean} Allow event propagation
+     */
+    mousemove: function (evt) {
+        this.mousePosition = evt.xy;
+    },
+
+    /**
+     * Method: activate 
+     */
+    activate: function (evt) {
+        if (OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            //register mousewheel events specifically on the window and document
+            var wheelListener = this.wheelListener;
+            OpenLayers.Event.observe(window, "DOMMouseScroll", wheelListener);
+            OpenLayers.Event.observe(window, "mousewheel", wheelListener);
+            OpenLayers.Event.observe(document, "mousewheel", wheelListener);
+            return true;
+        } else {
+            return false;
+        }
+    },
+
+    /**
+     * Method: deactivate 
+     */
+    deactivate: function (evt) {
+        if (OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            // unregister mousewheel events specifically on the window and document
+            var wheelListener = this.wheelListener;
+            OpenLayers.Event.stopObserving(window, "DOMMouseScroll", wheelListener);
+            OpenLayers.Event.stopObserving(window, "mousewheel", wheelListener);
+            OpenLayers.Event.stopObserving(document, "mousewheel", wheelListener);
+            return true;
+        } else {
+            return false;
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.MouseWheel"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Keyboard.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Keyboard.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Keyboard.js	(revision 76)
@@ -0,0 +1,109 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ * @requires OpenLayers/Events.js
+ */
+
+/**
+ * Class: OpenLayers.handler.Keyboard
+ * A handler for keyboard events.  Create a new instance with the
+ *     <OpenLayers.Handler.Keyboard> constructor.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler> 
+ */
+OpenLayers.Handler.Keyboard = OpenLayers.Class(OpenLayers.Handler, {
+
+    /* http://www.quirksmode.org/js/keys.html explains key x-browser
+        key handling quirks in pretty nice detail */
+
+    /** 
+     * Constant: KEY_EVENTS
+     * keydown, keypress, keyup
+     */
+    KEY_EVENTS: ["keydown", "keyup"],
+
+    /** 
+    * Property: eventListener
+    * {Function}
+    */
+    eventListener: null,
+
+    /**
+     * Constructor: OpenLayers.Handler.Keyboard
+     * Returns a new keyboard handler.
+     * 
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that is making use of
+     *     this handler.  If a handler is being used without a control, the
+     *     handlers setMap method must be overridden to deal properly with
+     *     the map.
+     * callbacks - {Object} An object containing a single function to be
+     *     called when the drag operation is finished. The callback should
+     *     expect to recieve a single argument, the pixel location of the event.
+     *     Callbacks for 'keydown', 'keypress', and 'keyup' are supported.
+     * options - {Object} Optional object whose properties will be set on the
+     *     handler.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+        // cache the bound event listener method so it can be unobserved later
+        this.eventListener = OpenLayers.Function.bindAsEventListener(
+            this.handleKeyEvent, this
+        );
+    },
+    
+    /**
+     * Method: destroy
+     */
+    destroy: function() {
+        this.deactivate();
+        this.eventListener = null;
+        OpenLayers.Handler.prototype.destroy.apply(this, arguments);
+    },
+
+    /**
+     * Method: activate
+     */
+    activate: function() {
+        if (OpenLayers.Handler.prototype.activate.apply(this, arguments)) {
+            for (var i=0, len=this.KEY_EVENTS.length; i<len; i++) {
+                OpenLayers.Event.observe(
+                    document, this.KEY_EVENTS[i], this.eventListener);
+            }
+            return true;
+        } else {
+            return false;
+        }
+    },
+
+    /**
+     * Method: deactivate
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if (OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            for (var i=0, len=this.KEY_EVENTS.length; i<len; i++) {
+                OpenLayers.Event.stopObserving(
+                    document, this.KEY_EVENTS[i], this.eventListener);
+            }
+            deactivated = true;
+        }
+        return deactivated;
+    },
+
+    /**
+     * Method: handleKeyEvent 
+     */
+    handleKeyEvent: function (evt) {
+        if (this.checkModifiers(evt)) {
+            this.callback(evt.type, [evt]);
+        }
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Keyboard"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Hover.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Hover.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Handler/Hover.js	(revision 76)
@@ -0,0 +1,183 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * @requires OpenLayers/Handler.js
+ */
+
+/**
+ * Class: OpenLayers.Handler.Hover
+ * The hover handler is to be used to emulate mouseovers on objects
+ *      on the map that aren't DOM elements. For example one can use
+ *      this handler to send WMS/GetFeatureInfo requests as the user
+ *      moves the mouve over the map.
+ * 
+ * Inherits from:
+ *  - <OpenLayers.Handler> 
+ */
+OpenLayers.Handler.Hover = OpenLayers.Class(OpenLayers.Handler, {
+
+    /**
+     * APIProperty: delay
+     * {Integer} - Number of milliseconds between mousemoves before
+     *      the event is considered a hover. Default is 500.
+     */
+    delay: 500,
+    
+    /**
+     * APIProperty: pixelTolerance
+     * {Integer} - Maximum number of pixels between mousemoves for
+     *      an event to be considered a hover. Default is null.
+     */
+    pixelTolerance: null,
+
+    /**
+     * APIProperty: stopMove
+     * {Boolean} - Stop other listeners from being notified on mousemoves.
+     *      Default is false.
+     */
+    stopMove: false,
+
+    /**
+     * Property: px
+     * {<OpenLayers.Pixel>} - The location of the last mousemove, expressed
+     *      in pixels.
+     */
+    px: null,
+
+    /**
+     * Property: timerId
+     * {Number} - The id of the timer.
+     */
+    timerId: null,
+ 
+    /**
+     * Constructor: OpenLayers.Handler.Hover
+     * Construct a hover handler.
+     *
+     * Parameters:
+     * control - {<OpenLayers.Control>} The control that initialized this
+     *     handler.  The control is assumed to have a valid map property; that
+     *     map is used in the handler's own setMap method.
+     * callbacks - {Object} An object with keys corresponding to callbacks
+     *     that will be called by the handler. The callbacks should
+     *     expect to receive a single argument, the event. Callbacks for
+     *     'move', the mouse is moving, and 'pause', the mouse is pausing,
+     *     are supported.
+     * options - {Object} An optional object whose properties will be set on
+     *     the handler.
+     */
+    initialize: function(control, callbacks, options) {
+        OpenLayers.Handler.prototype.initialize.apply(this, arguments);
+    },
+
+    /**
+     * Method: mousemove
+     * Called when the mouse moves on the map.
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>}
+     *
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    mousemove: function(evt) {
+        if(this.passesTolerance(evt.xy)) {
+            this.clearTimer();
+            this.callback('move', [evt]);
+            this.px = evt.xy;
+            // clone the evt so original properties can be accessed even
+            // if the browser deletes them during the delay
+            evt = OpenLayers.Util.extend({}, evt);
+            this.timerId = window.setTimeout(
+                OpenLayers.Function.bind(this.delayedCall, this, evt),
+                this.delay
+            );
+        }
+        return !this.stopMove;
+    },
+
+    /**
+     * Method: mouseout
+     * Called when the mouse goes out of the map.
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>}
+     *
+     * Returns:
+     * {Boolean} Continue propagating this event.
+     */
+    mouseout: function(evt) {
+        if (OpenLayers.Util.mouseLeft(evt, this.map.div)) {
+            this.clearTimer();
+            this.callback('move', [evt]);
+        }
+        return true;
+    },
+
+    /**
+     * Method: passesTolerance
+     * Determine whether the mouse move is within the optional pixel tolerance.
+     *
+     * Parameters:
+     * px - {<OpenLayers.Pixel>}
+     *
+     * Returns:
+     * {Boolean} The mouse move is within the pixel tolerance.
+     */
+    passesTolerance: function(px) {
+        var passes = true;
+        if(this.pixelTolerance && this.px) {
+            var dpx = Math.sqrt(
+                Math.pow(this.px.x - px.x, 2) +
+                Math.pow(this.px.y - px.y, 2)
+            );
+            if(dpx < this.pixelTolerance) {
+                passes = false;
+            }
+        }
+        return passes;
+    },
+
+    /**
+     * Method: clearTimer
+     * Clear the timer and set <timerId> to null.
+     */
+    clearTimer: function() {
+        if(this.timerId != null) {
+            window.clearTimeout(this.timerId);
+            this.timerId = null;
+        }
+    },
+
+    /**
+     * Method: delayedCall
+     * Triggers pause callback.
+     *
+     * Parameters:
+     * evt - {<OpenLayers.Event>}
+     */
+    delayedCall: function(evt) {
+        this.callback('pause', [evt]);
+    },
+
+    /**
+     * APIMethod: deactivate
+     * Deactivate the handler.
+     *
+     * Returns:
+     * {Boolean} The handler was successfully deactivated.
+     */
+    deactivate: function() {
+        var deactivated = false;
+        if(OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) {
+            this.clearTimer();
+            deactivated = true;
+        }
+        return deactivated;
+    },
+
+    CLASS_NAME: "OpenLayers.Handler.Hover"
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers/Strategy.js	(revision 76)
@@ -0,0 +1,117 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/**
+ * Class: OpenLayers.Strategy
+ * Abstract vector layer strategy class.  Not to be instantiated directly.  Use
+ *     one of the strategy subclasses instead.
+ */
+OpenLayers.Strategy = OpenLayers.Class({
+    
+    /**
+     * Property: layer
+     * {<OpenLayers.Layer.Vector>} The layer this strategy belongs to.
+     */
+    layer: null,
+    
+    /**
+     * Property: options
+     * {Object} Any options sent to the constructor.
+     */
+    options: null,
+
+    /** 
+     * Property: active 
+     * {Boolean} The control is active.
+     */
+    active: null,
+
+    /**
+     * Property: autoActivate
+     * {Boolean} The creator of the strategy can set autoActivate to false
+     *      to fully control when the protocol is activated and deactivated.
+     *      Defaults to true.
+     */
+    autoActivate: true,
+
+    /**
+     * Property: autoDestroy
+     * {Boolean} The creator of the strategy can set autoDestroy to false
+     *      to fully control when the strategy is destroyed. Defaults to
+     *      true.
+     */
+    autoDestroy: true,
+
+    /**
+     * Constructor: OpenLayers.Strategy
+     * Abstract class for vector strategies.  Create instances of a subclass.
+     *
+     * Parameters:
+     * options - {Object} Optional object whose properties will be set on the
+     *     instance.
+     */
+    initialize: function(options) {
+        OpenLayers.Util.extend(this, options);
+        this.options = options;
+        // set the active property here, so that user cannot override it
+        this.active = false;
+    },
+    
+    /**
+     * APIMethod: destroy
+     * Clean up the strategy.
+     */
+    destroy: function() {
+        this.deactivate();
+        this.layer = null;
+        this.options = null;
+    },
+
+    /**
+     * Method: setLayer
+     * Called to set the <layer> property.
+     *
+     * Parameters:
+     * {<OpenLayers.Layer.Vector>}
+     */
+    setLayer: function(layer) {
+        this.layer = layer;
+    },
+    
+    /**
+     * Method: activate
+     * Activate the strategy.  Register any listeners, do appropriate setup.
+     *
+     * Returns:
+     * {Boolean} True if the strategy was successfully activated or false if
+     *      the strategy was already active.
+     */
+    activate: function() {
+        if (!this.active) {
+            this.active = true;
+            return true;
+        }
+        return false;
+    },
+    
+    /**
+     * Method: deactivate
+     * Deactivate the strategy.  Unregister any listeners, do appropriate
+     *     tear-down.
+     *
+     * Returns:
+     * {Boolean} True if the strategy was successfully deactivated or false if
+     *      the strategy was already inactive.
+     */
+    deactivate: function() {
+        if (this.active) {
+            this.active = false;
+            return true;
+        }
+        return false;
+    },
+   
+    CLASS_NAME: "OpenLayers.Strategy" 
+});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/license.txt	(revision 76)
@@ -0,0 +1,30 @@
+Software License Agreement (BSD License)
+
+Copyright (c) 2007, Parakey Inc.
+All rights reserved.
+
+Redistribution and use of this software in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above
+  copyright notice, this list of conditions and the
+  following disclaimer.
+
+* Redistributions in binary form must reproduce the above
+  copyright notice, this list of conditions and the
+  following disclaimer in the documentation and/or other
+  materials provided with the distribution.
+
+* Neither the name of Parakey Inc. nor the names of its
+  contributors may be used to endorse or promote products
+  derived from this software without specific prior
+  written permission of Parakey Inc.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR
+IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
+CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER
+IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT
+OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.html	(revision 76)
@@ -0,0 +1,23 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+
+<head>
+    <title>Firebug</title>
+    <link rel="stylesheet" type="text/css" href="firebug.css">
+</head>
+
+<body>
+    <div id="toolbar" class="toolbar">
+        <a href="#" onclick="parent.console.clear()">Clear</a>
+        <span class="toolbarRight">
+            <a href="#" onclick="parent.console.close()">Close</a>
+        </span>
+    </div>
+    <div id="log"></div>
+    <input type="text" id="commandLine">
+    
+    <script>parent.onFirebugReady(document);</script>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebugx.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebugx.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebugx.js	(revision 76)
@@ -0,0 +1,9 @@
+
+if (!window.console || !console.firebug) {
+    var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
+    "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];
+
+    window.console = {};
+    for (var i = 0; i < names.length; ++i)
+        window.console[names[i]] = function() {}
+}
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.css	(revision 76)
@@ -0,0 +1,209 @@
+
+html, body {
+    margin: 0;
+    background: #FFFFFF;
+    font-family: Lucida Grande, Tahoma, sans-serif;
+    font-size: 11px;
+    overflow: hidden;
+}
+
+a {
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+.toolbar {
+    height: 14px;
+    border-top: 1px solid ThreeDHighlight;
+    border-bottom: 1px solid ThreeDShadow;
+    padding: 2px 6px;
+    background: ThreeDFace;
+}
+
+.toolbarRight {
+    position: absolute;
+    top: 4px;
+    right: 6px;
+}
+
+#log {
+    overflow: auto;
+    position: absolute;
+    left: 0;
+    width: 100%;
+}
+
+#commandLine {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 18px;
+    border: none;
+    border-top: 1px solid ThreeDShadow;
+}
+
+/************************************************************************************************/
+
+.logRow {
+    position: relative;
+    border-bottom: 1px solid #D7D7D7;
+    padding: 2px 4px 1px 6px;
+    background-color: #FFFFFF;
+}
+
+.logRow-command {
+    font-family: Monaco, monospace;
+    color: blue;
+}
+
+.objectBox-null {
+    padding: 0 2px;
+    border: 1px solid #666666;
+    background-color: #888888;
+    color: #FFFFFF;
+}
+
+.objectBox-string {
+    font-family: Monaco, monospace;
+    color: red;
+    white-space: pre;
+}
+
+.objectBox-number {
+    color: #000088;
+}
+
+.objectBox-function {
+    font-family: Monaco, monospace;
+    color: DarkGreen;
+}
+
+.objectBox-object {
+    color: DarkGreen;
+    font-weight: bold;
+}
+
+/************************************************************************************************/
+
+.logRow-info,
+.logRow-error,
+.logRow-warning {
+    background: #FFFFFF no-repeat 2px 2px;
+    padding-left: 20px;
+    padding-bottom: 3px;
+}
+
+.logRow-info {
+    background-image: url(infoIcon.png);
+}
+
+.logRow-warning {
+    background-color: cyan;
+    background-image: url(warningIcon.png);
+}
+
+.logRow-error {
+    background-color: LightYellow;
+    background-image: url(errorIcon.png);
+}
+
+.errorMessage {
+    vertical-align: top;
+    color: #FF0000;
+}
+
+.objectBox-sourceLink {
+    position: absolute;
+    right: 4px;
+    top: 2px;
+    padding-left: 8px;
+    font-family: Lucida Grande, sans-serif;
+    font-weight: bold;
+    color: #0000FF;
+}
+
+/************************************************************************************************/
+
+.logRow-group {
+    background: #EEEEEE;
+    border-bottom: none;
+}
+
+.logGroup {
+    background: #EEEEEE;
+}
+
+.logGroupBox {
+    margin-left: 24px;
+    border-top: 1px solid #D7D7D7;
+    border-left: 1px solid #D7D7D7;
+}
+
+/************************************************************************************************/
+
+.selectorTag,
+.selectorId,
+.selectorClass {
+    font-family: Monaco, monospace;
+    font-weight: normal;
+}
+
+.selectorTag {
+    color: #0000FF;
+}
+
+.selectorId {
+    color: DarkBlue;
+}
+
+.selectorClass {
+    color: red;
+}
+
+/************************************************************************************************/
+
+.objectBox-element {
+    font-family: Monaco, monospace;
+    color: #000088;
+}
+
+.nodeChildren {
+    margin-left: 16px;
+}
+
+.nodeTag {
+    color: blue;
+}
+
+.nodeValue {
+    color: #FF0000;
+    font-weight: normal;
+}
+
+.nodeText,
+.nodeComment {
+    margin: 0 2px;
+    vertical-align: top;
+}
+
+.nodeText {
+    color: #333333;
+}
+
+.nodeComment {
+    color: DarkGreen;
+}
+
+/************************************************************************************************/
+
+.propertyNameCell {
+    vertical-align: top;
+}
+
+.propertyName {
+    font-weight: bold;
+}
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/readme.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/readme.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/readme.txt	(revision 76)
@@ -0,0 +1,13 @@
+This directory contains the source for Firebug Lite
+(http://www.getfirebug.com/lite.html).  This code is distributed with a
+BSD License, Copyright (c) 2007, Parakey Inc.  See the included license.txt
+for the full text of the license.
+
+This is a patched version of the trunk from
+http://fbug.googlecode.com/svn/trunk.
+
+Revision 36 was patched to resolve the issue described here
+http://code.google.com/p/fbug/issues/detail?id=85
+
+When this issue is resolved, Firebug Lite can be used directly - no further
+modifications are needed for OpenLayers.
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Firebug/firebug.js	(revision 76)
@@ -0,0 +1,674 @@
+
+if (!window.console || !console.firebug) { (function()
+{
+    window.console = 
+    {
+        log: function()
+        {
+            logFormatted(arguments, "");
+        },
+        
+        debug: function()
+        {
+            logFormatted(arguments, "debug");
+        },
+        
+        info: function()
+        {
+            logFormatted(arguments, "info");
+        },
+        
+        warn: function()
+        {
+            logFormatted(arguments, "warning");
+        },
+        
+        error: function()
+        {
+            logFormatted(arguments, "error");
+        },
+        
+        assert: function(truth, message)
+        {
+            if (!truth)
+            {
+                var args = [];
+                for (var i = 1; i < arguments.length; ++i)
+                    args.push(arguments[i]);
+                
+                logFormatted(args.length ? args : ["Assertion Failure"], "error");
+                throw message ? message : "Assertion Failure";
+            }
+        },
+        
+        dir: function(object)
+        {
+            var html = [];
+                        
+            var pairs = [];
+            for (var name in object)
+            {
+                try
+                {
+                    pairs.push([name, object[name]]);
+                }
+                catch (exc)
+                {
+                }
+            }
+            
+            pairs.sort(function(a, b) { return a[0] < b[0] ? -1 : 1; });
+            
+            html.push('<table>');
+            for (var i = 0; i < pairs.length; ++i)
+            {
+                var name = pairs[i][0], value = pairs[i][1];
+                
+                html.push('<tr>', 
+                '<td class="propertyNameCell"><span class="propertyName">',
+                    escapeHTML(name), '</span></td>', '<td><span class="propertyValue">');
+                appendObject(value, html);
+                html.push('</span></td></tr>');
+            }
+            html.push('</table>');
+            
+            logRow(html, "dir");
+        },
+        
+        dirxml: function(node)
+        {
+            var html = [];
+            
+            appendNode(node, html);
+            logRow(html, "dirxml");
+        },
+        
+        group: function()
+        {
+            logRow(arguments, "group", pushGroup);
+        },
+        
+        groupEnd: function()
+        {
+            logRow(arguments, "", popGroup);
+        },
+        
+        time: function(name)
+        {
+            timeMap[name] = (new Date()).getTime();
+        },
+        
+        timeEnd: function(name)
+        {
+            if (name in timeMap)
+            {
+                var delta = (new Date()).getTime() - timeMap[name];
+                logFormatted([name+ ":", delta+"ms"]);
+                delete timeMap[name];
+            }
+        },
+        
+        count: function()
+        {
+            this.warn(["count() not supported."]);
+        },
+        
+        trace: function()
+        {
+            this.warn(["trace() not supported."]);
+        },
+        
+        profile: function()
+        {
+            this.warn(["profile() not supported."]);
+        },
+        
+        profileEnd: function()
+        {
+        },
+        
+        clear: function()
+        {
+            consoleBody.innerHTML = "";
+        },
+
+        open: function()
+        {
+            toggleConsole(true);
+        },
+        
+        close: function()
+        {
+            if (frameVisible)
+                toggleConsole();
+        }
+    };
+ 
+    // ********************************************************************************************
+       
+    var consoleFrame = null;
+    var consoleBody = null;
+    var commandLine = null;
+    
+    var frameVisible = false;
+    var messageQueue = [];
+    var groupStack = [];
+    var timeMap = {};
+    
+    var clPrefix = ">>> ";
+    
+    var isFirefox = navigator.userAgent.indexOf("Firefox") != -1;
+    var isIE = navigator.userAgent.indexOf("MSIE") != -1;
+    var isOpera = navigator.userAgent.indexOf("Opera") != -1;
+    var isSafari = navigator.userAgent.indexOf("AppleWebKit") != -1;
+
+    // ********************************************************************************************
+
+    function toggleConsole(forceOpen)
+    {
+        frameVisible = forceOpen || !frameVisible;
+        if (consoleFrame)
+            consoleFrame.style.visibility = frameVisible ? "visible" : "hidden";
+        else
+            waitForBody();
+    }
+
+    function focusCommandLine()
+    {
+        toggleConsole(true);
+        if (commandLine)
+            commandLine.focus();
+    }
+
+    function waitForBody()
+    {
+        if (document.body)
+            createFrame();
+        else
+            setTimeout(waitForBody, 200);
+    }    
+
+    function createFrame()
+    {
+        if (consoleFrame)
+            return;
+        
+        window.onFirebugReady = function(doc)
+        {
+            window.onFirebugReady = null;
+
+            var toolbar = doc.getElementById("toolbar");
+            toolbar.onmousedown = onSplitterMouseDown;
+
+            commandLine = doc.getElementById("commandLine");
+            addEvent(commandLine, "keydown", onCommandLineKeyDown);
+
+            addEvent(doc, isIE || isSafari ? "keydown" : "keypress", onKeyDown);
+            
+            consoleBody = doc.getElementById("log");
+            layout();
+            flush();
+        }
+
+        var baseURL = getFirebugURL();
+
+        consoleFrame = document.createElement("iframe");
+        consoleFrame.setAttribute("src", baseURL+"/firebug.html");
+        consoleFrame.setAttribute("frameBorder", "0");
+        consoleFrame.style.visibility = (frameVisible ? "visible" : "hidden");    
+        consoleFrame.style.zIndex = "2147483583";
+        consoleFrame.style.position = document.all ? "absolute" : "fixed";
+        consoleFrame.style.width = "100%";
+        consoleFrame.style.left = "0";
+        consoleFrame.style.bottom = "0";
+        consoleFrame.style.height = "200px";
+        document.body.appendChild(consoleFrame);
+    }
+    
+    function getFirebugURL()
+    {
+        var scripts = document.getElementsByTagName("script");
+        for (var i = 0; i < scripts.length; ++i)
+        {
+            if (scripts[i].src.indexOf("firebug.js") != -1)
+            {
+                var lastSlash = scripts[i].src.lastIndexOf("/");
+                return scripts[i].src.substr(0, lastSlash);
+            }
+        }
+    }
+    
+    function evalCommandLine()
+    {
+        var text = commandLine.value;
+        commandLine.value = "";
+
+        logRow([clPrefix, text], "command");
+        
+        var value;
+        try
+        {
+            value = eval(text);
+        }
+        catch (exc)
+        {
+        }
+
+        console.log(value);
+    }
+    
+    function layout()
+    {
+        var toolbar = consoleBody.ownerDocument.getElementById("toolbar");
+        var height = consoleFrame.offsetHeight - (toolbar.offsetHeight + commandLine.offsetHeight);
+        height = Math.max(height, 0);
+        consoleBody.style.top = toolbar.offsetHeight + "px";
+        consoleBody.style.height = height + "px";
+        
+        commandLine.style.top = (consoleFrame.offsetHeight - commandLine.offsetHeight) + "px";
+    }
+    
+    function logRow(message, className, handler)
+    {
+        if (consoleBody)
+            writeMessage(message, className, handler);
+        else
+        {
+            messageQueue.push([message, className, handler]);
+            waitForBody();
+        }
+    }
+    
+    function flush()
+    {
+        var queue = messageQueue;
+        messageQueue = [];
+        
+        for (var i = 0; i < queue.length; ++i)
+            writeMessage(queue[i][0], queue[i][1], queue[i][2]);
+    }
+
+    function writeMessage(message, className, handler)
+    {
+        var isScrolledToBottom =
+            consoleBody.scrollTop + consoleBody.offsetHeight >= consoleBody.scrollHeight;
+
+        if (!handler)
+            handler = writeRow;
+        
+        handler(message, className);
+        
+        if (isScrolledToBottom)
+            consoleBody.scrollTop = consoleBody.scrollHeight - consoleBody.offsetHeight;
+    }
+    
+    function appendRow(row)
+    {
+        var container = groupStack.length ? groupStack[groupStack.length-1] : consoleBody;
+        container.appendChild(row);
+    }
+
+    function writeRow(message, className)
+    {
+        var row = consoleBody.ownerDocument.createElement("div");
+        row.className = "logRow" + (className ? " logRow-"+className : "");
+        row.innerHTML = message.join("");
+        appendRow(row);
+    }
+
+    function pushGroup(message, className)
+    {
+        logFormatted(message, className);
+
+        var groupRow = consoleBody.ownerDocument.createElement("div");
+        groupRow.className = "logGroup";
+        var groupRowBox = consoleBody.ownerDocument.createElement("div");
+        groupRowBox.className = "logGroupBox";
+        groupRow.appendChild(groupRowBox);
+        appendRow(groupRowBox);
+        groupStack.push(groupRowBox);
+    }
+
+    function popGroup()
+    {
+        groupStack.pop();
+    }
+    
+    // ********************************************************************************************
+
+    function logFormatted(objects, className)
+    {
+        var html = [];
+
+        var format = objects[0];
+        var objIndex = 0;
+
+        if (typeof(format) != "string")
+        {
+            format = "";
+            objIndex = -1;
+        }
+
+        var parts = parseFormat(format);
+        for (var i = 0; i < parts.length; ++i)
+        {
+            var part = parts[i];
+            if (part && typeof(part) == "object")
+            {
+                var object = objects[++objIndex];
+                part.appender(object, html);
+            }
+            else
+                appendText(part, html);
+        }
+
+        for (var i = objIndex+1; i < objects.length; ++i)
+        {
+            appendText(" ", html);
+            
+            var object = objects[i];
+            if (typeof(object) == "string")
+                appendText(object, html);
+            else
+                appendObject(object, html);
+        }
+        
+        logRow(html, className);
+    }
+
+    function parseFormat(format)
+    {
+        var parts = [];
+
+        var reg = /((^%|[^\\]%)(\d+)?(\.)([a-zA-Z]))|((^%|[^\\]%)([a-zA-Z]))/;    
+        var appenderMap = {s: appendText, d: appendInteger, i: appendInteger, f: appendFloat};
+
+        for (var m = reg.exec(format); m; m = reg.exec(format))
+        {
+            var type = m[8] ? m[8] : m[5];
+            var appender = type in appenderMap ? appenderMap[type] : appendObject;
+            var precision = m[3] ? parseInt(m[3]) : (m[4] == "." ? -1 : 0);
+
+            parts.push(format.substr(0, m[0][0] == "%" ? m.index : m.index+1));
+            parts.push({appender: appender, precision: precision});
+
+            format = format.substr(m.index+m[0].length);
+        }
+
+        parts.push(format);
+
+        return parts;
+    }
+
+    function escapeHTML(value)
+    {
+        function replaceChars(ch)
+        {
+            switch (ch)
+            {
+                case "<":
+                    return "&lt;";
+                case ">":
+                    return "&gt;";
+                case "&":
+                    return "&amp;";
+                case "'":
+                    return "&#39;";
+                case '"':
+                    return "&quot;";
+            }
+            return "?";
+        };
+        return String(value).replace(/[<>&"']/g, replaceChars);
+    }
+
+    function objectToString(object)
+    {
+        try
+        {
+            return object+"";
+        }
+        catch (exc)
+        {
+            return null;
+        }
+    }
+
+    // ********************************************************************************************
+
+    function appendText(object, html)
+    {
+        html.push(escapeHTML(objectToString(object)));
+    }
+
+    function appendNull(object, html)
+    {
+        html.push('<span class="objectBox-null">', escapeHTML(objectToString(object)), '</span>');
+    }
+
+    function appendString(object, html)
+    {
+        html.push('<span class="objectBox-string">&quot;', escapeHTML(objectToString(object)),
+            '&quot;</span>');
+    }
+
+    function appendInteger(object, html)
+    {
+        html.push('<span class="objectBox-number">', escapeHTML(objectToString(object)), '</span>');
+    }
+
+    function appendFloat(object, html)
+    {
+        html.push('<span class="objectBox-number">', escapeHTML(objectToString(object)), '</span>');
+    }
+
+    function appendFunction(object, html)
+    {
+        var reName = /function ?(.*?)\(/;
+        var m = reName.exec(objectToString(object));
+        var name = m ? m[1] : "function";
+        html.push('<span class="objectBox-function">', escapeHTML(name), '()</span>');
+    }
+    
+    function appendObject(object, html)
+    {
+        try
+        {
+            if (object == undefined)
+                appendNull("undefined", html);
+            else if (object == null)
+                appendNull("null", html);
+            else if (typeof object == "string")
+                appendString(object, html);
+            else if (typeof object == "number")
+                appendInteger(object, html);
+            else if (typeof object == "function")
+                appendFunction(object, html);
+            else if (object.nodeType == 1)
+                appendSelector(object, html);
+            else if (typeof object == "object")
+                appendObjectFormatted(object, html);
+            else
+                appendText(object, html);
+        }
+        catch (exc)
+        {
+        }
+    }
+        
+    function appendObjectFormatted(object, html)
+    {
+        var text = objectToString(object);
+        var reObject = /\[object (.*?)\]/;
+
+        var m = reObject.exec(text);
+        html.push('<span class="objectBox-object">', m ? m[1] : text, '</span>')
+    }
+    
+    function appendSelector(object, html)
+    {
+        html.push('<span class="objectBox-selector">');
+
+        html.push('<span class="selectorTag">', escapeHTML(object.nodeName.toLowerCase()), '</span>');
+        if (object.id)
+            html.push('<span class="selectorId">#', escapeHTML(object.id), '</span>');
+        if (object.className)
+            html.push('<span class="selectorClass">.', escapeHTML(object.className), '</span>');
+
+        html.push('</span>');
+    }
+
+    function appendNode(node, html)
+    {
+        if (node.nodeType == 1)
+        {
+            html.push(
+                '<div class="objectBox-element">',
+                    '&lt;<span class="nodeTag">', node.nodeName.toLowerCase(), '</span>');
+
+            for (var i = 0; i < node.attributes.length; ++i)
+            {
+                var attr = node.attributes[i];
+                if (!attr.specified)
+                    continue;
+                
+                html.push('&nbsp;<span class="nodeName">', attr.nodeName.toLowerCase(),
+                    '</span>=&quot;<span class="nodeValue">', escapeHTML(attr.nodeValue),
+                    '</span>&quot;')
+            }
+
+            if (node.firstChild)
+            {
+                html.push('&gt;</div><div class="nodeChildren">');
+
+                for (var child = node.firstChild; child; child = child.nextSibling)
+                    appendNode(child, html);
+                    
+                html.push('</div><div class="objectBox-element">&lt;/<span class="nodeTag">', 
+                    node.nodeName.toLowerCase(), '&gt;</span></div>');
+            }
+            else
+                html.push('/&gt;</div>');
+        }
+        else if (node.nodeType == 3)
+        {
+            html.push('<div class="nodeText">', escapeHTML(node.nodeValue),
+                '</div>');
+        }
+    }
+
+    // ********************************************************************************************
+    
+    function addEvent(object, name, handler)
+    {
+        if (document.all)
+            object.attachEvent("on"+name, handler);
+        else
+            object.addEventListener(name, handler, false);
+    }
+    
+    function removeEvent(object, name, handler)
+    {
+        if (document.all)
+            object.detachEvent("on"+name, handler);
+        else
+            object.removeEventListener(name, handler, false);
+    }
+    
+    function cancelEvent(event)
+    {
+        if (document.all)
+            event.cancelBubble = true;
+        else
+            event.stopPropagation();        
+    }
+
+    function onError(msg, href, lineNo)
+    {
+        var html = [];
+        
+        var lastSlash = href.lastIndexOf("/");
+        var fileName = lastSlash == -1 ? href : href.substr(lastSlash+1);
+        
+        html.push(
+            '<span class="errorMessage">', msg, '</span>', 
+            '<div class="objectBox-sourceLink">', fileName, ' (line ', lineNo, ')</div>'
+        );
+        
+        logRow(html, "error");
+    };
+
+    function onKeyDown(event)
+    {
+        if (event.keyCode == 123)
+            toggleConsole();
+        else if ((event.keyCode == 108 || event.keyCode == 76) && event.shiftKey
+                 && (event.metaKey || event.ctrlKey))
+            focusCommandLine();
+        else
+            return;
+        
+        cancelEvent(event);
+    }
+
+    function onSplitterMouseDown(event)
+    {
+        if (isSafari || isOpera)
+            return;
+        
+        addEvent(document, "mousemove", onSplitterMouseMove);
+        addEvent(document, "mouseup", onSplitterMouseUp);
+
+        for (var i = 0; i < frames.length; ++i)
+        {
+            addEvent(frames[i].document, "mousemove", onSplitterMouseMove);
+            addEvent(frames[i].document, "mouseup", onSplitterMouseUp);
+        }
+    }
+    
+    function onSplitterMouseMove(event)
+    {
+        var win = document.all
+            ? event.srcElement.ownerDocument.parentWindow
+            : event.target.ownerDocument.defaultView;
+
+        var clientY = event.clientY;
+        if (win != win.parent)
+            clientY += win.frameElement ? win.frameElement.offsetTop : 0;
+        
+        var height = consoleFrame.offsetTop + consoleFrame.clientHeight;
+        var toolbar = consoleBody.ownerDocument.getElementById("toolbar");
+        var y = Math.max(height - clientY,
+                         toolbar.offsetHeight + commandLine.offsetHeight);
+        
+        consoleFrame.style.height = y + "px";
+        layout();
+    }
+    
+    function onSplitterMouseUp(event)
+    {
+        removeEvent(document, "mousemove", onSplitterMouseMove);
+        removeEvent(document, "mouseup", onSplitterMouseUp);
+
+        for (var i = 0; i < frames.length; ++i)
+        {
+            removeEvent(frames[i].document, "mousemove", onSplitterMouseMove);
+            removeEvent(frames[i].document, "mouseup", onSplitterMouseUp);
+        }
+    }
+    
+    function onCommandLineKeyDown(event)
+    {
+        if (event.keyCode == 13)
+            evalCommandLine();
+        else if (event.keyCode == 27)
+            commandLine.value = "";
+    }
+    
+    window.onerror = onError;
+    addEvent(document, isIE || isSafari ? "keydown" : "keypress", onKeyDown);
+    
+    if (document.documentElement.getAttribute("debug") == "true")
+        toggleConsole(true);
+})();
+}
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/OpenLayers.js	(revision 76)
@@ -0,0 +1,348 @@
+/* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for 
+ * full list of contributors). Published under the Clear BSD license.  
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license. */
+
+/* 
+ * @requires OpenLayers/BaseTypes.js
+ * @requires OpenLayers/Lang/en.js
+ * @requires OpenLayers/Console.js
+ */ 
+
+(function() {
+    /**
+     * Before creating the OpenLayers namespace, check to see if
+     * OpenLayers.singleFile is true.  This occurs if the
+     * OpenLayers/SingleFile.js script is included before this one - as is the
+     * case with single file builds.
+     */
+    var singleFile = (typeof OpenLayers == "object" && OpenLayers.singleFile);
+    
+    /**
+     * Cache for the script location returned from
+     * OpenLayers._getScriptLocation
+     */
+    var scriptLocation;
+    
+    /**
+     * Namespace: OpenLayers
+     * The OpenLayers object provides a namespace for all things OpenLayers
+     */
+    window.OpenLayers = {
+        
+        /**
+         * Property: _scriptName
+         * {String} Relative path of this script.
+         */
+        _scriptName: (!singleFile) ? "lib/OpenLayers.js" : "OpenLayers.js",
+
+        /**
+         * Function: _getScriptLocation
+         * Return the path to this script.
+         *
+         * Returns:
+         * {String} Path to this script
+         */
+        _getScriptLocation: function () {
+            if (scriptLocation != undefined) {
+                return scriptLocation;
+            }
+            scriptLocation = "";            
+            var isOL = new RegExp("(^|(.*?\\/))(" + OpenLayers._scriptName + ")(\\?|$)");
+         
+            var scripts = document.getElementsByTagName('script');
+            for (var i=0, len=scripts.length; i<len; i++) {
+                var src = scripts[i].getAttribute('src');
+                if (src) {
+                    var match = src.match(isOL);
+                    if(match) {
+                        scriptLocation = match[1];
+                        break;
+                    }
+                }
+            }
+            return scriptLocation;
+        }
+    };
+    /**
+     * OpenLayers.singleFile is a flag indicating this file is being included
+     * in a Single File Library build of the OpenLayers Library.
+     * 
+     * When we are *not* part of a SFL build we dynamically include the
+     * OpenLayers library code.
+     * 
+     * When we *are* part of a SFL build we do not dynamically include the 
+     * OpenLayers library code as it will be appended at the end of this file.
+      */
+    if(!singleFile) {
+        var jsfiles = new Array(
+            "OpenLayers/Util.js",
+            "OpenLayers/BaseTypes.js",
+            "OpenLayers/BaseTypes/Class.js",
+            "OpenLayers/BaseTypes/Bounds.js",
+            "OpenLayers/BaseTypes/Element.js",
+            "OpenLayers/BaseTypes/LonLat.js",
+            "OpenLayers/BaseTypes/Pixel.js",
+            "OpenLayers/BaseTypes/Size.js",
+            "OpenLayers/Console.js",
+            "OpenLayers/Tween.js",
+            "Rico/Corner.js",
+            "Rico/Color.js",
+            "OpenLayers/Ajax.js",
+            "OpenLayers/Events.js",
+            "OpenLayers/Request.js",
+            "OpenLayers/Request/XMLHttpRequest.js",
+            "OpenLayers/Projection.js",
+            "OpenLayers/Map.js",
+            "OpenLayers/Layer.js",
+            "OpenLayers/Icon.js",
+            "OpenLayers/Marker.js",
+            "OpenLayers/Marker/Box.js",
+            "OpenLayers/Popup.js",
+            "OpenLayers/Tile.js",
+            "OpenLayers/Tile/Image.js",
+            "OpenLayers/Tile/Image/IFrame.js",
+            "OpenLayers/Tile/WFS.js",
+            "OpenLayers/Layer/Image.js",
+            "OpenLayers/Layer/SphericalMercator.js",
+            "OpenLayers/Layer/EventPane.js",
+            "OpenLayers/Layer/FixedZoomLevels.js",
+            "OpenLayers/Layer/Google.js",
+            "OpenLayers/Layer/Google/v3.js",
+            "OpenLayers/Layer/VirtualEarth.js",
+            "OpenLayers/Layer/Yahoo.js",
+            "OpenLayers/Layer/HTTPRequest.js",
+            "OpenLayers/Layer/Grid.js",
+            "OpenLayers/Layer/MapGuide.js",
+            "OpenLayers/Layer/MapServer.js",
+            "OpenLayers/Layer/MapServer/Untiled.js",
+            "OpenLayers/Layer/KaMap.js",
+            "OpenLayers/Layer/KaMapCache.js",
+            "OpenLayers/Layer/MultiMap.js",
+            "OpenLayers/Layer/Markers.js",
+            "OpenLayers/Layer/Text.js",
+            "OpenLayers/Layer/WorldWind.js",
+            "OpenLayers/Layer/ArcGIS93Rest.js",
+            "OpenLayers/Layer/WMS.js",
+            "OpenLayers/Layer/WMS/Untiled.js",
+            "OpenLayers/Layer/WMS/Post.js",
+            "OpenLayers/Layer/WMTS.js",
+            "OpenLayers/Layer/ArcIMS.js",
+            "OpenLayers/Layer/GeoRSS.js",
+            "OpenLayers/Layer/Boxes.js",
+            "OpenLayers/Layer/XYZ.js",
+            "OpenLayers/Layer/TMS.js",
+            "OpenLayers/Layer/TileCache.js",
+            "OpenLayers/Layer/Zoomify.js",
+            "OpenLayers/Popup/Anchored.js",
+            "OpenLayers/Popup/AnchoredBubble.js",
+            "OpenLayers/Popup/Framed.js",
+            "OpenLayers/Popup/FramedCloud.js",
+            "OpenLayers/Feature.js",
+            "OpenLayers/Feature/Vector.js",
+            "OpenLayers/Feature/WFS.js",
+            "OpenLayers/Handler.js",
+            "OpenLayers/Handler/Click.js",
+            "OpenLayers/Handler/Hover.js",
+            "OpenLayers/Handler/Point.js",
+            "OpenLayers/Handler/Path.js",
+            "OpenLayers/Handler/Polygon.js",
+            "OpenLayers/Handler/Feature.js",
+            "OpenLayers/Handler/Drag.js",
+            "OpenLayers/Handler/RegularPolygon.js",
+            "OpenLayers/Handler/Box.js",
+            "OpenLayers/Handler/MouseWheel.js",
+            "OpenLayers/Handler/Keyboard.js",
+            "OpenLayers/Control.js",
+            "OpenLayers/Control/Attribution.js",
+            "OpenLayers/Control/Button.js",
+            "OpenLayers/Control/ZoomBox.js",
+            "OpenLayers/Control/ZoomToMaxExtent.js",
+            "OpenLayers/Control/DragPan.js",
+            "OpenLayers/Control/Navigation.js",
+            "OpenLayers/Control/MouseDefaults.js",
+            "OpenLayers/Control/MousePosition.js",
+            "OpenLayers/Control/OverviewMap.js",
+            "OpenLayers/Control/KeyboardDefaults.js",
+            "OpenLayers/Control/PanZoom.js",
+            "OpenLayers/Control/PanZoomBar.js",
+            "OpenLayers/Control/ArgParser.js",
+            "OpenLayers/Control/Permalink.js",
+            "OpenLayers/Control/Scale.js",
+            "OpenLayers/Control/ScaleLine.js",
+            "OpenLayers/Control/Snapping.js",
+            "OpenLayers/Control/Split.js",
+            "OpenLayers/Control/LayerSwitcher.js",
+            "OpenLayers/Control/DrawFeature.js",
+            "OpenLayers/Control/DragFeature.js",
+            "OpenLayers/Control/ModifyFeature.js",
+            "OpenLayers/Control/Panel.js",
+            "OpenLayers/Control/SelectFeature.js",
+            "OpenLayers/Control/NavigationHistory.js",
+            "OpenLayers/Control/Measure.js",
+            "OpenLayers/Control/WMSGetFeatureInfo.js",
+            "OpenLayers/Control/WMTSGetFeatureInfo.js",
+            "OpenLayers/Control/Graticule.js",
+            "OpenLayers/Control/TransformFeature.js",
+            "OpenLayers/Control/SLDSelect.js",
+            "OpenLayers/Geometry.js",
+            "OpenLayers/Geometry/Rectangle.js",
+            "OpenLayers/Geometry/Collection.js",
+            "OpenLayers/Geometry/Point.js",
+            "OpenLayers/Geometry/MultiPoint.js",
+            "OpenLayers/Geometry/Curve.js",
+            "OpenLayers/Geometry/LineString.js",
+            "OpenLayers/Geometry/LinearRing.js",        
+            "OpenLayers/Geometry/Polygon.js",
+            "OpenLayers/Geometry/MultiLineString.js",
+            "OpenLayers/Geometry/MultiPolygon.js",
+            "OpenLayers/Geometry/Surface.js",
+            "OpenLayers/Renderer.js",
+            "OpenLayers/Renderer/Elements.js",
+            "OpenLayers/Renderer/SVG.js",
+            "OpenLayers/Renderer/Canvas.js",
+            "OpenLayers/Renderer/VML.js",
+            "OpenLayers/Layer/Vector.js",
+            "OpenLayers/Layer/Vector/RootContainer.js",
+            "OpenLayers/Strategy.js",
+            "OpenLayers/Strategy/Filter.js",
+            "OpenLayers/Strategy/Fixed.js",
+            "OpenLayers/Strategy/Cluster.js",
+            "OpenLayers/Strategy/Paging.js",
+            "OpenLayers/Strategy/BBOX.js",
+            "OpenLayers/Strategy/Save.js",
+            "OpenLayers/Strategy/Refresh.js",
+            "OpenLayers/Filter.js",
+            "OpenLayers/Filter/FeatureId.js",
+            "OpenLayers/Filter/Logical.js",
+            "OpenLayers/Filter/Comparison.js",
+            "OpenLayers/Filter/Spatial.js",
+            "OpenLayers/Protocol.js",
+            "OpenLayers/Protocol/HTTP.js",
+            "OpenLayers/Protocol/SQL.js",
+            "OpenLayers/Protocol/SQL/Gears.js",
+            "OpenLayers/Protocol/WFS.js",
+            "OpenLayers/Protocol/WFS/v1.js",
+            "OpenLayers/Protocol/WFS/v1_0_0.js",
+            "OpenLayers/Protocol/WFS/v1_1_0.js",
+            "OpenLayers/Protocol/SOS.js",
+            "OpenLayers/Protocol/SOS/v1_0_0.js",
+            "OpenLayers/Layer/PointTrack.js",
+            "OpenLayers/Layer/GML.js",
+            "OpenLayers/Style.js",
+            "OpenLayers/Style2.js",
+            "OpenLayers/StyleMap.js",
+            "OpenLayers/Rule.js",
+            "OpenLayers/Format.js",
+            "OpenLayers/Format/XML.js",
+            "OpenLayers/Format/Context.js",
+            "OpenLayers/Format/ArcXML.js",
+            "OpenLayers/Format/ArcXML/Features.js",
+            "OpenLayers/Format/GML.js",
+            "OpenLayers/Format/GML/Base.js",
+            "OpenLayers/Format/GML/v2.js",
+            "OpenLayers/Format/GML/v3.js",
+            "OpenLayers/Format/Atom.js",
+            "OpenLayers/Format/KML.js",
+            "OpenLayers/Format/GeoRSS.js",
+            "OpenLayers/Format/WFS.js",
+            "OpenLayers/Format/WFSCapabilities.js",
+            "OpenLayers/Format/WFSCapabilities/v1.js",
+            "OpenLayers/Format/WFSCapabilities/v1_0_0.js",
+            "OpenLayers/Format/WFSCapabilities/v1_1_0.js",
+            "OpenLayers/Format/WFSDescribeFeatureType.js",
+            "OpenLayers/Format/WMSDescribeLayer.js",
+            "OpenLayers/Format/WMSDescribeLayer/v1_1.js",
+            "OpenLayers/Format/WKT.js",
+            "OpenLayers/Format/OSM.js",
+            "OpenLayers/Format/GPX.js",
+            "OpenLayers/Format/Filter.js",
+            "OpenLayers/Format/Filter/v1.js",
+            "OpenLayers/Format/Filter/v1_0_0.js",
+            "OpenLayers/Format/Filter/v1_1_0.js",
+            "OpenLayers/Format/SLD.js",
+            "OpenLayers/Format/SLD/v1.js",
+            "OpenLayers/Format/SLD/v1_0_0.js",
+            "OpenLayers/Format/OWSCommon/v1.js",
+            "OpenLayers/Format/OWSCommon/v1_0_0.js",
+            "OpenLayers/Format/OWSCommon/v1_1_0.js",
+            "OpenLayers/Format/CSWGetDomain.js",
+            "OpenLayers/Format/CSWGetDomain/v2_0_2.js",
+            "OpenLayers/Format/CSWGetRecords.js",
+            "OpenLayers/Format/CSWGetRecords/v2_0_2.js",
+            "OpenLayers/Format/WFST.js",
+            "OpenLayers/Format/WFST/v1.js",
+            "OpenLayers/Format/WFST/v1_0_0.js",
+            "OpenLayers/Format/WFST/v1_1_0.js",
+            "OpenLayers/Format/Text.js",
+            "OpenLayers/Format/JSON.js",
+            "OpenLayers/Format/GeoJSON.js",
+            "OpenLayers/Format/WMC.js",
+            "OpenLayers/Format/WMC/v1.js",
+            "OpenLayers/Format/WMC/v1_0_0.js",
+            "OpenLayers/Format/WMC/v1_1_0.js",
+            "OpenLayers/Format/WMSCapabilities.js",
+            "OpenLayers/Format/WMSCapabilities/v1.js",
+            "OpenLayers/Format/WMSCapabilities/v1_1.js",
+            "OpenLayers/Format/WMSCapabilities/v1_1_0.js",
+            "OpenLayers/Format/WMSCapabilities/v1_1_1.js",
+            "OpenLayers/Format/WMSCapabilities/v1_3.js",
+            "OpenLayers/Format/WMSCapabilities/v1_3_0.js",
+            "OpenLayers/Format/WMSGetFeatureInfo.js",
+            "OpenLayers/Format/SOSCapabilities.js",
+            "OpenLayers/Format/SOSCapabilities/v1_0_0.js",
+            "OpenLayers/Format/SOSGetObservation.js",
+            "OpenLayers/Format/SOSGetFeatureOfInterest.js",
+            "OpenLayers/Format/OWSContext.js",
+            "OpenLayers/Format/OWSContext/v0_3_1.js",
+            "OpenLayers/Format/WMTSCapabilities.js",
+            "OpenLayers/Format/WMTSCapabilities/v1_0_0.js",
+            "OpenLayers/Layer/WFS.js",
+            "OpenLayers/Control/GetFeature.js",
+            "OpenLayers/Control/MouseToolbar.js",
+            "OpenLayers/Control/NavToolbar.js",
+            "OpenLayers/Control/PanPanel.js",
+            "OpenLayers/Control/Pan.js",
+            "OpenLayers/Control/ZoomIn.js",
+            "OpenLayers/Control/ZoomOut.js",
+            "OpenLayers/Control/ZoomPanel.js",
+            "OpenLayers/Control/EditingToolbar.js",
+            "OpenLayers/Symbolizer.js",
+            "OpenLayers/Symbolizer/Point.js",
+            "OpenLayers/Symbolizer/Line.js",
+            "OpenLayers/Symbolizer/Polygon.js",
+            "OpenLayers/Symbolizer/Text.js",
+            "OpenLayers/Symbolizer/Raster.js",
+            "OpenLayers/Lang.js",
+            "OpenLayers/Lang/en.js"
+        ); // etc.
+
+        var agent = navigator.userAgent;
+        var docWrite = (agent.match("MSIE") || agent.match("Safari"));
+        if(docWrite) {
+            var allScriptTags = new Array(jsfiles.length);
+        }
+        var host = OpenLayers._getScriptLocation() + "lib/";    
+        for (var i=0, len=jsfiles.length; i<len; i++) {
+            if (docWrite) {
+                allScriptTags[i] = "<script src='" + host + jsfiles[i] +
+                                   "'></script>"; 
+            } else {
+                var s = document.createElement("script");
+                s.src = host + jsfiles[i];
+                var h = document.getElementsByTagName("head").length ? 
+                           document.getElementsByTagName("head")[0] : 
+                           document.body;
+                h.appendChild(s);
+            }
+        }
+        if (docWrite) {
+            document.write(allScriptTags.join(""));
+        }
+    }
+})();
+
+/**
+ * Constant: VERSION_NUMBER
+ */
+OpenLayers.VERSION_NUMBER="OpenLayers 2.10 -- $Revision: 10721 $";
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Corner.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Corner.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Corner.js	(revision 76)
@@ -0,0 +1,330 @@
+/*
+ * This file has been edited substantially from the Rico-released
+ * version by the OpenLayers development team.
+ *  
+ *  Copyright 2005 Sabre Airline Solutions  
+ *  
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the
+ *  License. You may obtain a copy of the License at
+ *  
+ *         http://www.apache.org/licenses/LICENSE-2.0  
+ *  
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the * License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, * either express or
+ * implied. See the License for the specific language governing
+ * permissions * and limitations under the License.
+ *
+ */  
+OpenLayers.Rico = new Object();
+OpenLayers.Rico.Corner = {
+
+    round: function(e, options) {
+        e = OpenLayers.Util.getElement(e);
+        this._setOptions(options);
+
+        var color = this.options.color;
+        if ( this.options.color == "fromElement" ) {
+            color = this._background(e);
+        }
+        var bgColor = this.options.bgColor;
+        if ( this.options.bgColor == "fromParent" ) {
+            bgColor = this._background(e.offsetParent);
+        }
+        this._roundCornersImpl(e, color, bgColor);
+    },
+
+    /**   This is a helper function to change the background
+    *     color of <div> that has had Rico rounded corners added.
+    *
+    *     It seems we cannot just set the background color for the
+    *     outer <div> so each <span> element used to create the
+    *     corners must have its background color set individually.
+    *
+    * @param {DOM} theDiv - A child of the outer <div> that was
+    *                        supplied to the `round` method.
+    *
+    * @param {String} newColor - The new background color to use.
+    */
+    changeColor: function(theDiv, newColor) {
+   
+        theDiv.style.backgroundColor = newColor;
+
+        var spanElements = theDiv.parentNode.getElementsByTagName("span");
+        
+        for (var currIdx = 0; currIdx < spanElements.length; currIdx++) {
+            spanElements[currIdx].style.backgroundColor = newColor;
+        }
+    }, 
+
+
+    /**   This is a helper function to change the background
+    *     opacity of <div> that has had Rico rounded corners added.
+    *
+    *     See changeColor (above) for algorithm explanation
+    *
+    * @param {DOM} theDiv A child of the outer <div> that was
+    *                        supplied to the `round` method.
+    *
+    * @param {int} newOpacity The new opacity to use (0-1).
+    */
+    changeOpacity: function(theDiv, newOpacity) {
+   
+        var mozillaOpacity = newOpacity;
+        var ieOpacity = 'alpha(opacity=' + newOpacity * 100 + ')';
+        
+        theDiv.style.opacity = mozillaOpacity;
+        theDiv.style.filter = ieOpacity;
+
+        var spanElements = theDiv.parentNode.getElementsByTagName("span");
+        
+        for (var currIdx = 0; currIdx < spanElements.length; currIdx++) {
+            spanElements[currIdx].style.opacity = mozillaOpacity;
+            spanElements[currIdx].style.filter = ieOpacity;
+        }
+
+    },
+
+    /** this function takes care of redoing the rico cornering
+    *    
+    *    you can't just call updateRicoCorners() again and pass it a 
+    *    new options string. you have to first remove the divs that 
+    *    rico puts on top and below the content div.
+    *
+    * @param {DOM} theDiv - A child of the outer <div> that was
+    *                        supplied to the `round` method.
+    *
+    * @param {Object} options - list of options
+    */
+    reRound: function(theDiv, options) {
+
+        var topRico = theDiv.parentNode.childNodes[0];
+        //theDiv would be theDiv.parentNode.childNodes[1]
+        var bottomRico = theDiv.parentNode.childNodes[2];
+       
+        theDiv.parentNode.removeChild(topRico);
+        theDiv.parentNode.removeChild(bottomRico); 
+
+        this.round(theDiv.parentNode, options);
+    }, 
+
+   _roundCornersImpl: function(e, color, bgColor) {
+      if(this.options.border) {
+         this._renderBorder(e,bgColor);
+      }
+      if(this._isTopRounded()) {
+         this._roundTopCorners(e,color,bgColor);
+      }
+      if(this._isBottomRounded()) {
+         this._roundBottomCorners(e,color,bgColor);
+      }
+   },
+
+   _renderBorder: function(el,bgColor) {
+      var borderValue = "1px solid " + this._borderColor(bgColor);
+      var borderL = "border-left: "  + borderValue;
+      var borderR = "border-right: " + borderValue;
+      var style   = "style='" + borderL + ";" + borderR +  "'";
+      el.innerHTML = "<div " + style + ">" + el.innerHTML + "</div>";
+   },
+
+   _roundTopCorners: function(el, color, bgColor) {
+      var corner = this._createCorner(bgColor);
+      for(var i=0 ; i < this.options.numSlices ; i++ ) {
+         corner.appendChild(this._createCornerSlice(color,bgColor,i,"top"));
+      }
+      el.style.paddingTop = 0;
+      el.insertBefore(corner,el.firstChild);
+   },
+
+   _roundBottomCorners: function(el, color, bgColor) {
+      var corner = this._createCorner(bgColor);
+      for(var i=(this.options.numSlices-1) ; i >= 0 ; i-- ) {
+         corner.appendChild(this._createCornerSlice(color,bgColor,i,"bottom"));
+      }
+      el.style.paddingBottom = 0;
+      el.appendChild(corner);
+   },
+
+   _createCorner: function(bgColor) {
+      var corner = document.createElement("div");
+      corner.style.backgroundColor = (this._isTransparent() ? "transparent" : bgColor);
+      return corner;
+   },
+
+   _createCornerSlice: function(color,bgColor, n, position) {
+      var slice = document.createElement("span");
+
+      var inStyle = slice.style;
+      inStyle.backgroundColor = color;
+      inStyle.display  = "block";
+      inStyle.height   = "1px";
+      inStyle.overflow = "hidden";
+      inStyle.fontSize = "1px";
+
+      var borderColor = this._borderColor(color,bgColor);
+      if ( this.options.border && n == 0 ) {
+         inStyle.borderTopStyle    = "solid";
+         inStyle.borderTopWidth    = "1px";
+         inStyle.borderLeftWidth   = "0px";
+         inStyle.borderRightWidth  = "0px";
+         inStyle.borderBottomWidth = "0px";
+         inStyle.height            = "0px"; // assumes css compliant box model
+         inStyle.borderColor       = borderColor;
+      }
+      else if(borderColor) {
+         inStyle.borderColor = borderColor;
+         inStyle.borderStyle = "solid";
+         inStyle.borderWidth = "0px 1px";
+      }
+
+      if ( !this.options.compact && (n == (this.options.numSlices-1)) ) {
+         inStyle.height = "2px";
+      }
+      this._setMargin(slice, n, position);
+      this._setBorder(slice, n, position);
+      return slice;
+   },
+
+   _setOptions: function(options) {
+      this.options = {
+         corners : "all",
+         color   : "fromElement",
+         bgColor : "fromParent",
+         blend   : true,
+         border  : false,
+         compact : false
+      };
+      OpenLayers.Util.extend(this.options, options || {});
+
+      this.options.numSlices = this.options.compact ? 2 : 4;
+      if ( this._isTransparent() ) {
+         this.options.blend = false;
+      }
+   },
+
+   _whichSideTop: function() {
+      if ( this._hasString(this.options.corners, "all", "top") ) {
+         return "";
+      }
+      if ( this.options.corners.indexOf("tl") >= 0 && this.options.corners.indexOf("tr") >= 0 ) {
+         return "";
+      }
+      if (this.options.corners.indexOf("tl") >= 0) {
+         return "left";
+      } else if (this.options.corners.indexOf("tr") >= 0) {
+          return "right";
+      }
+      return "";
+   },
+
+   _whichSideBottom: function() {
+      if ( this._hasString(this.options.corners, "all", "bottom") ) {
+         return "";
+      }
+      if ( this.options.corners.indexOf("bl")>=0 && this.options.corners.indexOf("br")>=0 ) {
+         return "";
+      }
+
+      if(this.options.corners.indexOf("bl") >=0) {
+         return "left";
+      } else if(this.options.corners.indexOf("br")>=0) {
+         return "right";
+      }
+      return "";
+   },
+
+   _borderColor : function(color,bgColor) {
+      if ( color == "transparent" ) {
+         return bgColor;
+      } else if ( this.options.border ) {
+         return this.options.border;
+      } else if ( this.options.blend ) {
+         return this._blend( bgColor, color );
+      } else {
+         return "";
+      }
+   },
+
+
+   _setMargin: function(el, n, corners) {
+      var marginSize = this._marginSize(n);
+      var whichSide = corners == "top" ? this._whichSideTop() : this._whichSideBottom();
+
+      if ( whichSide == "left" ) {
+         el.style.marginLeft = marginSize + "px"; el.style.marginRight = "0px";
+      }
+      else if ( whichSide == "right" ) {
+         el.style.marginRight = marginSize + "px"; el.style.marginLeft  = "0px";
+      }
+      else {
+         el.style.marginLeft = marginSize + "px"; el.style.marginRight = marginSize + "px";
+      }
+   },
+
+   _setBorder: function(el,n,corners) {
+      var borderSize = this._borderSize(n);
+      var whichSide = corners == "top" ? this._whichSideTop() : this._whichSideBottom();
+      if ( whichSide == "left" ) {
+         el.style.borderLeftWidth = borderSize + "px"; el.style.borderRightWidth = "0px";
+      }
+      else if ( whichSide == "right" ) {
+         el.style.borderRightWidth = borderSize + "px"; el.style.borderLeftWidth  = "0px";
+      }
+      else {
+         el.style.borderLeftWidth = borderSize + "px"; el.style.borderRightWidth = borderSize + "px";
+      }
+      if (this.options.border != false) {
+        el.style.borderLeftWidth = borderSize + "px"; el.style.borderRightWidth = borderSize + "px";
+      }
+   },
+
+   _marginSize: function(n) {
+      if ( this._isTransparent() ) {
+         return 0;
+      }
+      var marginSizes          = [ 5, 3, 2, 1 ];
+      var blendedMarginSizes   = [ 3, 2, 1, 0 ];
+      var compactMarginSizes   = [ 2, 1 ];
+      var smBlendedMarginSizes = [ 1, 0 ];
+
+      if ( this.options.compact && this.options.blend ) {
+         return smBlendedMarginSizes[n];
+      } else if ( this.options.compact ) {
+         return compactMarginSizes[n];
+      } else if ( this.options.blend ) {
+         return blendedMarginSizes[n];
+      } else {
+         return marginSizes[n];
+      }
+   },
+
+   _borderSize: function(n) {
+      var transparentBorderSizes = [ 5, 3, 2, 1 ];
+      var blendedBorderSizes     = [ 2, 1, 1, 1 ];
+      var compactBorderSizes     = [ 1, 0 ];
+      var actualBorderSizes      = [ 0, 2, 0, 0 ];
+
+      if ( this.options.compact && (this.options.blend || this._isTransparent()) ) {
+         return 1;
+      } else if ( this.options.compact ) {
+         return compactBorderSizes[n];
+      } else if ( this.options.blend ) {
+         return blendedBorderSizes[n];
+      } else if ( this.options.border ) {
+         return actualBorderSizes[n];
+      } else if ( this._isTransparent() ) {
+         return transparentBorderSizes[n];
+      }
+      return 0;
+   },
+
+   _hasString: function(str) { for(var i=1 ; i<arguments.length ; i++) if (str.indexOf(arguments[i]) >= 0) { return true; } return false; },
+   _blend: function(c1, c2) { var cc1 = OpenLayers.Rico.Color.createFromHex(c1); cc1.blend(OpenLayers.Rico.Color.createFromHex(c2)); return cc1; },
+   _background: function(el) { try { return OpenLayers.Rico.Color.createColorFromBackground(el).asHex(); } catch(err) { return "#ffffff"; } },
+   _isTransparent: function() { return this.options.color == "transparent"; },
+   _isTopRounded: function() { return this._hasString(this.options.corners, "all", "top", "tl", "tr"); },
+   _isBottomRounded: function() { return this._hasString(this.options.corners, "all", "bottom", "bl", "br"); },
+   _hasSingleTextChild: function(el) { return el.childNodes.length == 1 && el.childNodes[0].nodeType == 3; }
+};
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Color.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Color.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/lib/Rico/Color.js	(revision 76)
@@ -0,0 +1,244 @@
+/*
+ * This file has been edited substantially from the Rico-released version by
+ * the OpenLayers development team.
+ *
+ * This file is licensed under the Apache License, Version 2.0.
+ */
+OpenLayers.Rico.Color = OpenLayers.Class({
+
+   initialize: function(red, green, blue) {
+      this.rgb = { r: red, g : green, b : blue };
+   },
+
+   setRed: function(r) {
+      this.rgb.r = r;
+   },
+
+   setGreen: function(g) {
+      this.rgb.g = g;
+   },
+
+   setBlue: function(b) {
+      this.rgb.b = b;
+   },
+
+   setHue: function(h) {
+
+      // get an HSB model, and set the new hue...
+      var hsb = this.asHSB();
+      hsb.h = h;
+
+      // convert back to RGB...
+      this.rgb = OpenLayers.Rico.Color.HSBtoRGB(hsb.h, hsb.s, hsb.b);
+   },
+
+   setSaturation: function(s) {
+      // get an HSB model, and set the new hue...
+      var hsb = this.asHSB();
+      hsb.s = s;
+
+      // convert back to RGB and set values...
+      this.rgb = OpenLayers.Rico.Color.HSBtoRGB(hsb.h, hsb.s, hsb.b);
+   },
+
+   setBrightness: function(b) {
+      // get an HSB model, and set the new hue...
+      var hsb = this.asHSB();
+      hsb.b = b;
+
+      // convert back to RGB and set values...
+      this.rgb = OpenLayers.Rico.Color.HSBtoRGB( hsb.h, hsb.s, hsb.b );
+   },
+
+   darken: function(percent) {
+      var hsb  = this.asHSB();
+      this.rgb = OpenLayers.Rico.Color.HSBtoRGB(hsb.h, hsb.s, Math.max(hsb.b - percent,0));
+   },
+
+   brighten: function(percent) {
+      var hsb  = this.asHSB();
+      this.rgb = OpenLayers.Rico.Color.HSBtoRGB(hsb.h, hsb.s, Math.min(hsb.b + percent,1));
+   },
+
+   blend: function(other) {
+      this.rgb.r = Math.floor((this.rgb.r + other.rgb.r)/2);
+      this.rgb.g = Math.floor((this.rgb.g + other.rgb.g)/2);
+      this.rgb.b = Math.floor((this.rgb.b + other.rgb.b)/2);
+   },
+
+   isBright: function() {
+      var hsb = this.asHSB();
+      return this.asHSB().b > 0.5;
+   },
+
+   isDark: function() {
+      return ! this.isBright();
+   },
+
+   asRGB: function() {
+      return "rgb(" + this.rgb.r + "," + this.rgb.g + "," + this.rgb.b + ")";
+   },
+
+   asHex: function() {
+      return "#" + this.rgb.r.toColorPart() + this.rgb.g.toColorPart() + this.rgb.b.toColorPart();
+   },
+
+   asHSB: function() {
+      return OpenLayers.Rico.Color.RGBtoHSB(this.rgb.r, this.rgb.g, this.rgb.b);
+   },
+
+   toString: function() {
+      return this.asHex();
+   }
+
+});
+
+OpenLayers.Rico.Color.createFromHex = function(hexCode) {
+  if(hexCode.length==4) {
+    var shortHexCode = hexCode; 
+    var hexCode = '#';
+    for(var i=1;i<4;i++) { 
+        hexCode += (shortHexCode.charAt(i) + 
+shortHexCode.charAt(i)); 
+    }
+  }
+   if ( hexCode.indexOf('#') == 0 ) {
+       hexCode = hexCode.substring(1);
+   }
+   var red   = hexCode.substring(0,2);
+   var green = hexCode.substring(2,4);
+   var blue  = hexCode.substring(4,6);
+   return new OpenLayers.Rico.Color( parseInt(red,16), parseInt(green,16), parseInt(blue,16) );
+};
+
+/**
+ * Factory method for creating a color from the background of
+ * an HTML element.
+ */
+OpenLayers.Rico.Color.createColorFromBackground = function(elem) {
+
+   var actualColor = 
+      RicoUtil.getElementsComputedStyle(OpenLayers.Util.getElement(elem), 
+                                        "backgroundColor", 
+                                        "background-color");
+
+   if ( actualColor == "transparent" && elem.parentNode ) {
+      return OpenLayers.Rico.Color.createColorFromBackground(elem.parentNode);
+   }
+   if ( actualColor == null ) {
+      return new OpenLayers.Rico.Color(255,255,255);
+   }
+   if ( actualColor.indexOf("rgb(") == 0 ) {
+      var colors = actualColor.substring(4, actualColor.length - 1 );
+      var colorArray = colors.split(",");
+      return new OpenLayers.Rico.Color( parseInt( colorArray[0] ),
+                            parseInt( colorArray[1] ),
+                            parseInt( colorArray[2] )  );
+
+   }
+   else if ( actualColor.indexOf("#") == 0 ) {
+      return OpenLayers.Rico.Color.createFromHex(actualColor);
+   }
+   else {
+      return new OpenLayers.Rico.Color(255,255,255);
+   }
+};
+
+OpenLayers.Rico.Color.HSBtoRGB = function(hue, saturation, brightness) {
+
+   var red   = 0;
+    var green = 0;
+    var blue  = 0;
+
+   if (saturation == 0) {
+      red = parseInt(brightness * 255.0 + 0.5);
+       green = red;
+       blue = red;
+    }
+    else {
+      var h = (hue - Math.floor(hue)) * 6.0;
+      var f = h - Math.floor(h);
+      var p = brightness * (1.0 - saturation);
+      var q = brightness * (1.0 - saturation * f);
+      var t = brightness * (1.0 - (saturation * (1.0 - f)));
+
+      switch (parseInt(h)) {
+         case 0:
+            red   = (brightness * 255.0 + 0.5);
+            green = (t * 255.0 + 0.5);
+            blue  = (p * 255.0 + 0.5);
+            break;
+         case 1:
+            red   = (q * 255.0 + 0.5);
+            green = (brightness * 255.0 + 0.5);
+            blue  = (p * 255.0 + 0.5);
+            break;
+         case 2:
+            red   = (p * 255.0 + 0.5);
+            green = (brightness * 255.0 + 0.5);
+            blue  = (t * 255.0 + 0.5);
+            break;
+         case 3:
+            red   = (p * 255.0 + 0.5);
+            green = (q * 255.0 + 0.5);
+            blue  = (brightness * 255.0 + 0.5);
+            break;
+         case 4:
+            red   = (t * 255.0 + 0.5);
+            green = (p * 255.0 + 0.5);
+            blue  = (brightness * 255.0 + 0.5);
+            break;
+          case 5:
+            red   = (brightness * 255.0 + 0.5);
+            green = (p * 255.0 + 0.5);
+            blue  = (q * 255.0 + 0.5);
+            break;
+        }
+    }
+
+   return { r : parseInt(red), g : parseInt(green) , b : parseInt(blue) };
+};
+
+OpenLayers.Rico.Color.RGBtoHSB = function(r, g, b) {
+
+   var hue;
+   var saturation;
+   var brightness;
+
+   var cmax = (r > g) ? r : g;
+   if (b > cmax) {
+      cmax = b;
+   }
+   var cmin = (r < g) ? r : g;
+   if (b < cmin) {
+      cmin = b;
+   }
+   brightness = cmax / 255.0;
+   if (cmax != 0) {
+      saturation = (cmax - cmin)/cmax;
+   } else {
+      saturation = 0;
+   }
+   if (saturation == 0) {
+      hue = 0;
+   } else {
+      var redc   = (cmax - r)/(cmax - cmin);
+        var greenc = (cmax - g)/(cmax - cmin);
+        var bluec  = (cmax - b)/(cmax - cmin);
+
+        if (r == cmax) {
+           hue = bluec - greenc;
+        } else if (g == cmax) {
+           hue = 2.0 + redc - bluec;
+      } else {
+           hue = 4.0 + greenc - redc;
+      }
+        hue = hue / 6.0;
+        if (hue < 0) {
+           hue = hue + 1.0;
+        }
+   }
+
+   return { h : hue, s : saturation, b : brightness };
+};
+
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/news.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/news.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/news.txt	(revision 76)
@@ -0,0 +1,59 @@
+OpenLayers 2.10
+  r10722
+  Released 09/09/10
+  http://trac.openlayers.org/wiki/Release/2.10/Notes
+
+OpenLayers 2.9:
+ r10251
+ Released 04/22/10
+ http://trac.openlayers.org/wiki/Release/2.9/Notes
+
+OpenLayers 2.8:
+ r9492
+ Released 06/22/09
+ http://trac.openlayers.org/wiki/Release/2.8/Notes
+
+OpenLayers 2.7:
+ r8063
+ Released 09/29/08
+ http://trac.openlayers.org/wiki/Release/2.7/Notes
+
+OpenLayers 2.6:
+ r6945
+ Released 04/15/08
+ http://trac.openlayers.org/wiki/Release/2.6/Notes
+
+OpenLayers 2.5:
+ r4899
+ Released 10/09/07 
+ http://trac.openlayers.org/wiki/Release/2.5/Notes
+
+OpenLayers 2.4:
+ r3198
+ Released 05/29/07 
+ http://trac.openlayers.org/wiki/Release/2.4/Notes
+
+OpenLayers 2.3:
+ r2255
+ Released 02/21/07 
+ http://trac.openlayers.org/wiki/Release/2.3/Notes
+
+OpenLayers 2.2:
+ r1866
+ Released 11/15/06 
+ http://trac.openlayers.org/wiki/Release/2.2/Notes
+
+OpenLayers 2.1:
+ r1521
+ Released 10/02/06
+ http://trac.openlayers.org/wiki/Release/2.1/Notes
+
+OpenLayers 2.0:
+ r1368
+ Released 08/25/06
+ http://trac.openlayers.org/wiki/Release/2.0/Notes
+
+OpenLayers 1.0
+ r787
+ Released 06/27/06
+ Initial release.
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/readme.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/readme.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/readme.txt	(revision 76)
@@ -0,0 +1,72 @@
+OpenLayers
+-=-=-=-=-=-
+Copyright (c) 2005-2010 OpenLayers Contributors. See authors.txt for
+more details.
+
+OpenLayers is a JavaScript library for building map applications
+on the web. OpenLayers is made available under a BSD-license.
+Please see license.txt in this distribution for more details.
+
+------------------
+Getting OpenLayers
+------------------
+
+OpenLayers lives at http://www.openlayers.org/.
+
+You can get OpenLayers from
+    http://trac.openlayers.org/wiki/HowToDownload.
+
+---------------------
+Installing OpenLayers
+---------------------
+
+You can use OpenLayers as-is by copying build/OpenLayers.js and the
+entire theme/ and img/ directories up to your webserver, putting them 
+in the same directory. The files can be in subdirectories on your website, 
+or right in the root of the site, as in these examples. 
+To include the OpenLayers library in your web page from the root of the site, use:
+
+  <script type="text/javascript" src="/OpenLayers.js" />
+
+As an example, using bash (with the release files in ~/openlayers ):
+$ cd /var/www/html
+$ cp ~/openlayers/build/OpenLayers.js ./
+$ cp -R ~/openlayers/theme ./
+$ cp -R ~/openlayers/img ./
+
+If you want to use the multiple-file version of OpenLayers (for, say,
+debugging or development purposes), copy the lib/ directory up to your
+webserver in the same directory you put the img/ folder. Then add
+the following to your web page instead:
+
+  <script type="text/javascript" src="/lib/OpenLayers.js" />
+
+As an example, using bash (with the release files in ~/openlayers ):
+$ cd /var/www/html
+$ cp -R ~/openlayers/lib ./
+$ cp -R ~/openlayers/theme ./
+$ cp -R ~/openlayers/img ./
+
+
+------------------------------------
+Using OpenLayers in Your Own Website
+------------------------------------
+
+The examples/ directory is full of useful examples.
+
+Documentation is available at http://trac.openlayers.org/wiki/Documentation.
+You can generate the API documentation with http://www.naturaldocs.org/:
+As an example, using bash (with the release files in ~/openlayers ):
+$ cd ~/openlayers/
+$ /path/to/NaturalDocs -i lib/ -o HTML doc/ -p doc_config/ -s Default OL
+
+Information on changes in the API is available in news.txt.
+
+--------------------------
+Contributing to OpenLayers
+--------------------------
+
+Please join the email lists at http://openlayers.org/mailman/listinfo
+Patches are welcome!
+
+= 30 =
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/OpenLayers.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/OpenLayers.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/OpenLayers.js	(revision 76)
@@ -0,0 +1,2591 @@
+/*
+
+  OpenLayers.js -- OpenLayers Map Viewer Library
+
+  Copyright 2005-2010 OpenLayers Contributors, released under the Clear BSD
+  license. Please see http://svn.openlayers.org/trunk/openlayers/license.txt
+  for the full text of the license.
+
+  Includes compressed code under the following licenses:
+
+  (For uncompressed versions of the code used please see the
+  OpenLayers SVN repository: <http://openlayers.org/>)
+
+*/
+
+/* Contains portions of Prototype.js:
+ *
+ * Prototype JavaScript framework, version 1.4.0
+ *  (c) 2005 Sam Stephenson <sam@conio.net>
+ *
+ *  Prototype is freely distributable under the terms of an MIT-style license.
+ *  For details, see the Prototype web site: http://prototype.conio.net/
+ *
+ *--------------------------------------------------------------------------*/
+
+/**  
+*  
+*  Contains portions of Rico <http://openrico.org/>
+* 
+*  Copyright 2005 Sabre Airline Solutions  
+*  
+*  Licensed under the Apache License, Version 2.0 (the "License"); you
+*  may not use this file except in compliance with the License. You
+*  may obtain a copy of the License at
+*  
+*         http://www.apache.org/licenses/LICENSE-2.0  
+*  
+*  Unless required by applicable law or agreed to in writing, software
+*  distributed under the License is distributed on an "AS IS" BASIS,
+*  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+*  implied. See the License for the specific language governing
+*  permissions and limitations under the License. 
+*
+**/
+
+/**
+ * Contains XMLHttpRequest.js <http://code.google.com/p/xmlhttprequest/>
+ * Copyright 2007 Sergey Ilinsky (http://www.ilinsky.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+/**
+ * Contains portions of Gears <http://code.google.com/apis/gears/>
+ *
+ * Copyright 2007, Google Inc.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ *  1. Redistributions of source code must retain the above copyright notice,
+ *     this list of conditions and the following disclaimer.
+ *  2. Redistributions in binary form must reproduce the above copyright notice,
+ *     this list of conditions and the following disclaimer in the documentation
+ *     and/or other materials provided with the distribution.
+ *  3. Neither the name of Google Inc. nor the names of its contributors may be
+ *     used to endorse or promote products derived from this software without
+ *     specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS OR IMPLIED
+ * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO
+ * EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
+ * OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
+ * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
+ * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ * Sets up google.gears.*, which is *the only* supported way to access Gears.
+ *
+ * Circumvent this file at your own risk!
+ *
+ * In the future, Gears may automatically define google.gears.* without this
+ * file. Gears may use these objects to transparently fix bugs and compatibility
+ * issues. Applications that use the code below will continue to work seamlessly
+ * when that happens.
+ */
+var OpenLayers={singleFile:true};(function(){var singleFile=(typeof OpenLayers=="object"&&OpenLayers.singleFile);var scriptLocation;window.OpenLayers={_scriptName:(!singleFile)?"lib/OpenLayers.js":"OpenLayers.js",_getScriptLocation:function(){if(scriptLocation!=undefined){return scriptLocation;}
+scriptLocation="";var isOL=new RegExp("(^|(.*?\\/))("+OpenLayers._scriptName+")(\\?|$)");var scripts=document.getElementsByTagName('script');for(var i=0,len=scripts.length;i<len;i++){var src=scripts[i].getAttribute('src');if(src){var match=src.match(isOL);if(match){scriptLocation=match[1];break;}}}
+return scriptLocation;}};if(!singleFile){var jsfiles=new Array("OpenLayers/Util.js","OpenLayers/BaseTypes.js","OpenLayers/BaseTypes/Class.js","OpenLayers/BaseTypes/Bounds.js","OpenLayers/BaseTypes/Element.js","OpenLayers/BaseTypes/LonLat.js","OpenLayers/BaseTypes/Pixel.js","OpenLayers/BaseTypes/Size.js","OpenLayers/Console.js","OpenLayers/Tween.js","Rico/Corner.js","Rico/Color.js","OpenLayers/Ajax.js","OpenLayers/Events.js","OpenLayers/Request.js","OpenLayers/Request/XMLHttpRequest.js","OpenLayers/Projection.js","OpenLayers/Map.js","OpenLayers/Layer.js","OpenLayers/Icon.js","OpenLayers/Marker.js","OpenLayers/Marker/Box.js","OpenLayers/Popup.js","OpenLayers/Tile.js","OpenLayers/Tile/Image.js","OpenLayers/Tile/Image/IFrame.js","OpenLayers/Tile/WFS.js","OpenLayers/Layer/Image.js","OpenLayers/Layer/SphericalMercator.js","OpenLayers/Layer/EventPane.js","OpenLayers/Layer/FixedZoomLevels.js","OpenLayers/Layer/Google.js","OpenLayers/Layer/Google/v3.js","OpenLayers/Layer/VirtualEarth.js","OpenLayers/Layer/Yahoo.js","OpenLayers/Layer/HTTPRequest.js","OpenLayers/Layer/Grid.js","OpenLayers/Layer/MapGuide.js","OpenLayers/Layer/MapServer.js","OpenLayers/Layer/MapServer/Untiled.js","OpenLayers/Layer/KaMap.js","OpenLayers/Layer/KaMapCache.js","OpenLayers/Layer/MultiMap.js","OpenLayers/Layer/Markers.js","OpenLayers/Layer/Text.js","OpenLayers/Layer/WorldWind.js","OpenLayers/Layer/ArcGIS93Rest.js","OpenLayers/Layer/WMS.js","OpenLayers/Layer/WMS/Untiled.js","OpenLayers/Layer/WMS/Post.js","OpenLayers/Layer/WMTS.js","OpenLayers/Layer/ArcIMS.js","OpenLayers/Layer/GeoRSS.js","OpenLayers/Layer/Boxes.js","OpenLayers/Layer/XYZ.js","OpenLayers/Layer/TMS.js","OpenLayers/Layer/TileCache.js","OpenLayers/Layer/Zoomify.js","OpenLayers/Popup/Anchored.js","OpenLayers/Popup/AnchoredBubble.js","OpenLayers/Popup/Framed.js","OpenLayers/Popup/FramedCloud.js","OpenLayers/Feature.js","OpenLayers/Feature/Vector.js","OpenLayers/Feature/WFS.js","OpenLayers/Handler.js","OpenLayers/Handler/Click.js","OpenLayers/Handler/Hover.js","OpenLayers/Handler/Point.js","OpenLayers/Handler/Path.js","OpenLayers/Handler/Polygon.js","OpenLayers/Handler/Feature.js","OpenLayers/Handler/Drag.js","OpenLayers/Handler/RegularPolygon.js","OpenLayers/Handler/Box.js","OpenLayers/Handler/MouseWheel.js","OpenLayers/Handler/Keyboard.js","OpenLayers/Control.js","OpenLayers/Control/Attribution.js","OpenLayers/Control/Button.js","OpenLayers/Control/ZoomBox.js","OpenLayers/Control/ZoomToMaxExtent.js","OpenLayers/Control/DragPan.js","OpenLayers/Control/Navigation.js","OpenLayers/Control/MouseDefaults.js","OpenLayers/Control/MousePosition.js","OpenLayers/Control/OverviewMap.js","OpenLayers/Control/KeyboardDefaults.js","OpenLayers/Control/PanZoom.js","OpenLayers/Control/PanZoomBar.js","OpenLayers/Control/ArgParser.js","OpenLayers/Control/Permalink.js","OpenLayers/Control/Scale.js","OpenLayers/Control/ScaleLine.js","OpenLayers/Control/Snapping.js","OpenLayers/Control/Split.js","OpenLayers/Control/LayerSwitcher.js","OpenLayers/Control/DrawFeature.js","OpenLayers/Control/DragFeature.js","OpenLayers/Control/ModifyFeature.js","OpenLayers/Control/Panel.js","OpenLayers/Control/SelectFeature.js","OpenLayers/Control/NavigationHistory.js","OpenLayers/Control/Measure.js","OpenLayers/Control/WMSGetFeatureInfo.js","OpenLayers/Control/WMTSGetFeatureInfo.js","OpenLayers/Control/Graticule.js","OpenLayers/Control/TransformFeature.js","OpenLayers/Control/SLDSelect.js","OpenLayers/Geometry.js","OpenLayers/Geometry/Rectangle.js","OpenLayers/Geometry/Collection.js","OpenLayers/Geometry/Point.js","OpenLayers/Geometry/MultiPoint.js","OpenLayers/Geometry/Curve.js","OpenLayers/Geometry/LineString.js","OpenLayers/Geometry/LinearRing.js","OpenLayers/Geometry/Polygon.js","OpenLayers/Geometry/MultiLineString.js","OpenLayers/Geometry/MultiPolygon.js","OpenLayers/Geometry/Surface.js","OpenLayers/Renderer.js","OpenLayers/Renderer/Elements.js","OpenLayers/Renderer/SVG.js","OpenLayers/Renderer/Canvas.js","OpenLayers/Renderer/VML.js","OpenLayers/Layer/Vector.js","OpenLayers/Layer/Vector/RootContainer.js","OpenLayers/Strategy.js","OpenLayers/Strategy/Filter.js","OpenLayers/Strategy/Fixed.js","OpenLayers/Strategy/Cluster.js","OpenLayers/Strategy/Paging.js","OpenLayers/Strategy/BBOX.js","OpenLayers/Strategy/Save.js","OpenLayers/Strategy/Refresh.js","OpenLayers/Filter.js","OpenLayers/Filter/FeatureId.js","OpenLayers/Filter/Logical.js","OpenLayers/Filter/Comparison.js","OpenLayers/Filter/Spatial.js","OpenLayers/Protocol.js","OpenLayers/Protocol/HTTP.js","OpenLayers/Protocol/SQL.js","OpenLayers/Protocol/SQL/Gears.js","OpenLayers/Protocol/WFS.js","OpenLayers/Protocol/WFS/v1.js","OpenLayers/Protocol/WFS/v1_0_0.js","OpenLayers/Protocol/WFS/v1_1_0.js","OpenLayers/Protocol/SOS.js","OpenLayers/Protocol/SOS/v1_0_0.js","OpenLayers/Layer/PointTrack.js","OpenLayers/Layer/GML.js","OpenLayers/Style.js","OpenLayers/Style2.js","OpenLayers/StyleMap.js","OpenLayers/Rule.js","OpenLayers/Format.js","OpenLayers/Format/XML.js","OpenLayers/Format/Context.js","OpenLayers/Format/ArcXML.js","OpenLayers/Format/ArcXML/Features.js","OpenLayers/Format/GML.js","OpenLayers/Format/GML/Base.js","OpenLayers/Format/GML/v2.js","OpenLayers/Format/GML/v3.js","OpenLayers/Format/Atom.js","OpenLayers/Format/KML.js","OpenLayers/Format/GeoRSS.js","OpenLayers/Format/WFS.js","OpenLayers/Format/WFSCapabilities.js","OpenLayers/Format/WFSCapabilities/v1.js","OpenLayers/Format/WFSCapabilities/v1_0_0.js","OpenLayers/Format/WFSCapabilities/v1_1_0.js","OpenLayers/Format/WFSDescribeFeatureType.js","OpenLayers/Format/WMSDescribeLayer.js","OpenLayers/Format/WMSDescribeLayer/v1_1.js","OpenLayers/Format/WKT.js","OpenLayers/Format/OSM.js","OpenLayers/Format/GPX.js","OpenLayers/Format/Filter.js","OpenLayers/Format/Filter/v1.js","OpenLayers/Format/Filter/v1_0_0.js","OpenLayers/Format/Filter/v1_1_0.js","OpenLayers/Format/SLD.js","OpenLayers/Format/SLD/v1.js","OpenLayers/Format/SLD/v1_0_0.js","OpenLayers/Format/OWSCommon/v1.js","OpenLayers/Format/OWSCommon/v1_0_0.js","OpenLayers/Format/OWSCommon/v1_1_0.js","OpenLayers/Format/CSWGetDomain.js","OpenLayers/Format/CSWGetDomain/v2_0_2.js","OpenLayers/Format/CSWGetRecords.js","OpenLayers/Format/CSWGetRecords/v2_0_2.js","OpenLayers/Format/WFST.js","OpenLayers/Format/WFST/v1.js","OpenLayers/Format/WFST/v1_0_0.js","OpenLayers/Format/WFST/v1_1_0.js","OpenLayers/Format/Text.js","OpenLayers/Format/JSON.js","OpenLayers/Format/GeoJSON.js","OpenLayers/Format/WMC.js","OpenLayers/Format/WMC/v1.js","OpenLayers/Format/WMC/v1_0_0.js","OpenLayers/Format/WMC/v1_1_0.js","OpenLayers/Format/WMSCapabilities.js","OpenLayers/Format/WMSCapabilities/v1.js","OpenLayers/Format/WMSCapabilities/v1_1.js","OpenLayers/Format/WMSCapabilities/v1_1_0.js","OpenLayers/Format/WMSCapabilities/v1_1_1.js","OpenLayers/Format/WMSCapabilities/v1_3.js","OpenLayers/Format/WMSCapabilities/v1_3_0.js","OpenLayers/Format/WMSGetFeatureInfo.js","OpenLayers/Format/SOSCapabilities.js","OpenLayers/Format/SOSCapabilities/v1_0_0.js","OpenLayers/Format/SOSGetObservation.js","OpenLayers/Format/SOSGetFeatureOfInterest.js","OpenLayers/Format/OWSContext.js","OpenLayers/Format/OWSContext/v0_3_1.js","OpenLayers/Format/WMTSCapabilities.js","OpenLayers/Format/WMTSCapabilities/v1_0_0.js","OpenLayers/Layer/WFS.js","OpenLayers/Control/GetFeature.js","OpenLayers/Control/MouseToolbar.js","OpenLayers/Control/NavToolbar.js","OpenLayers/Control/PanPanel.js","OpenLayers/Control/Pan.js","OpenLayers/Control/ZoomIn.js","OpenLayers/Control/ZoomOut.js","OpenLayers/Control/ZoomPanel.js","OpenLayers/Control/EditingToolbar.js","OpenLayers/Symbolizer.js","OpenLayers/Symbolizer/Point.js","OpenLayers/Symbolizer/Line.js","OpenLayers/Symbolizer/Polygon.js","OpenLayers/Symbolizer/Text.js","OpenLayers/Symbolizer/Raster.js","OpenLayers/Lang.js","OpenLayers/Lang/en.js");var agent=navigator.userAgent;var docWrite=(agent.match("MSIE")||agent.match("Safari"));if(docWrite){var allScriptTags=new Array(jsfiles.length);}
+var host=OpenLayers._getScriptLocation()+"lib/";for(var i=0,len=jsfiles.length;i<len;i++){if(docWrite){allScriptTags[i]="<script src='"+host+jsfiles[i]+"'></script>";}else{var s=document.createElement("script");s.src=host+jsfiles[i];var h=document.getElementsByTagName("head").length?document.getElementsByTagName("head")[0]:document.body;h.appendChild(s);}}
+if(docWrite){document.write(allScriptTags.join(""));}}})();OpenLayers.VERSION_NUMBER="OpenLayers 2.10 -- $Revision: 10721 $";OpenLayers.String={startsWith:function(str,sub){return(str.indexOf(sub)==0);},contains:function(str,sub){return(str.indexOf(sub)!=-1);},trim:function(str){return str.replace(/^\s\s*/,'').replace(/\s\s*$/,'');},camelize:function(str){var oStringList=str.split('-');var camelizedString=oStringList[0];for(var i=1,len=oStringList.length;i<len;i++){var s=oStringList[i];camelizedString+=s.charAt(0).toUpperCase()+s.substring(1);}
+return camelizedString;},format:function(template,context,args){if(!context){context=window;}
+var replacer=function(str,match){var replacement;var subs=match.split(/\.+/);for(var i=0;i<subs.length;i++){if(i==0){replacement=context;}
+replacement=replacement[subs[i]];}
+if(typeof replacement=="function"){replacement=args?replacement.apply(null,args):replacement();}
+if(typeof replacement=='undefined'){return'undefined';}else{return replacement;}};return template.replace(OpenLayers.String.tokenRegEx,replacer);},tokenRegEx:/\$\{([\w.]+?)\}/g,numberRegEx:/^([+-]?)(?=\d|\.\d)\d*(\.\d*)?([Ee]([+-]?\d+))?$/,isNumeric:function(value){return OpenLayers.String.numberRegEx.test(value);},numericIf:function(value){return OpenLayers.String.isNumeric(value)?parseFloat(value):value;}};if(!String.prototype.startsWith){String.prototype.startsWith=function(sStart){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.String.startsWith'}));return OpenLayers.String.startsWith(this,sStart);};}
+if(!String.prototype.contains){String.prototype.contains=function(str){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.String.contains'}));return OpenLayers.String.contains(this,str);};}
+if(!String.prototype.trim){String.prototype.trim=function(){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.String.trim'}));return OpenLayers.String.trim(this);};}
+if(!String.prototype.camelize){String.prototype.camelize=function(){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.String.camelize'}));return OpenLayers.String.camelize(this);};}
+OpenLayers.Number={decimalSeparator:".",thousandsSeparator:",",limitSigDigs:function(num,sig){var fig=0;if(sig>0){fig=parseFloat(num.toPrecision(sig));}
+return fig;},format:function(num,dec,tsep,dsep){dec=(typeof dec!="undefined")?dec:0;tsep=(typeof tsep!="undefined")?tsep:OpenLayers.Number.thousandsSeparator;dsep=(typeof dsep!="undefined")?dsep:OpenLayers.Number.decimalSeparator;if(dec!=null){num=parseFloat(num.toFixed(dec));}
+var parts=num.toString().split(".");if(parts.length==1&&dec==null){dec=0;}
+var integer=parts[0];if(tsep){var thousands=/(-?[0-9]+)([0-9]{3})/;while(thousands.test(integer)){integer=integer.replace(thousands,"$1"+tsep+"$2");}}
+var str;if(dec==0){str=integer;}else{var rem=parts.length>1?parts[1]:"0";if(dec!=null){rem=rem+new Array(dec-rem.length+1).join("0");}
+str=integer+dsep+rem;}
+return str;}};if(!Number.prototype.limitSigDigs){Number.prototype.limitSigDigs=function(sig){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.Number.limitSigDigs'}));return OpenLayers.Number.limitSigDigs(this,sig);};}
+OpenLayers.Function={bind:function(func,object){var args=Array.prototype.slice.apply(arguments,[2]);return function(){var newArgs=args.concat(Array.prototype.slice.apply(arguments,[0]));return func.apply(object,newArgs);};},bindAsEventListener:function(func,object){return function(event){return func.call(object,event||window.event);};},False:function(){return false;},True:function(){return true;}};if(!Function.prototype.bind){Function.prototype.bind=function(){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.Function.bind'}));Array.prototype.unshift.apply(arguments,[this]);return OpenLayers.Function.bind.apply(null,arguments);};}
+if(!Function.prototype.bindAsEventListener){Function.prototype.bindAsEventListener=function(object){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.Function.bindAsEventListener'}));return OpenLayers.Function.bindAsEventListener(this,object);};}
+OpenLayers.Array={filter:function(array,callback,caller){var selected=[];if(Array.prototype.filter){selected=array.filter(callback,caller);}else{var len=array.length;if(typeof callback!="function"){throw new TypeError();}
+for(var i=0;i<len;i++){if(i in array){var val=array[i];if(callback.call(caller,val,i,array)){selected.push(val);}}}}
+return selected;}};OpenLayers.Date={toISOString:(function(){if("toISOString"in Date.prototype){return function(date){return date.toISOString();}}else{function pad(num,len){var str=num+"";while(str.length<len){str="0"+str;}
+return str;}
+return function(date){var str;if(isNaN(date.getTime())){str="Invalid Date";}else{str=date.getUTCFullYear()+"-"+
+pad(date.getUTCMonth()+1,2)+"-"+
+pad(date.getUTCDate(),2)+"T"+
+pad(date.getUTCHours(),2)+":"+
+pad(date.getUTCMinutes(),2)+":"+
+pad(date.getUTCSeconds(),2)+"."+
+pad(date.getUTCMilliseconds(),3)+"Z";}
+return str;}}})(),parse:function(str){var date;var elapsed=Date.parse(str);if(!isNaN(elapsed)){date=new Date(elapsed);}else{var match=str.match(/^(?:(\d{4})(?:-(\d{2})(?:-(\d{2}))?)?)?(?:T(\d{1,2}):(\d{2}):(\d{2}(?:\.\d+)?)(Z|(?:[+-]\d{1,2}(?::(\d{2}))?)))?$/);var date;if(match&&(match[1]||match[7])){var year=parseInt(match[1],10)||0;var month=(parseInt(match[2],10)-1)||0;var day=parseInt(match[3],10)||1;date=new Date(Date.UTC(year,month,day));var type=match[7];if(type){var hours=parseInt(match[4],10);var minutes=parseInt(match[5],10);var secFrac=parseFloat(match[6]);var seconds=secFrac|0;var milliseconds=Math.round(1000*(secFrac-seconds));date.setUTCHours(hours,minutes,seconds,milliseconds);if(type!=="Z"){var hoursOffset=parseInt(type,10);var minutesOffset=parseInt(match[8])||0;var offset=-1000*(60*(hoursOffset*60)+minutesOffset*60);date=new Date(date.getTime()+offset);}}}else{date=new Date("invalid");}}
+return date;}};OpenLayers.Class=function(){var Class=function(){if(arguments&&arguments[0]!=OpenLayers.Class.isPrototype){this.initialize.apply(this,arguments);}};var extended={};var parent,initialize,Type;for(var i=0,len=arguments.length;i<len;++i){Type=arguments[i];if(typeof Type=="function"){if(i==0&&len>1){initialize=Type.prototype.initialize;Type.prototype.initialize=function(){};extended=new Type();if(initialize===undefined){delete Type.prototype.initialize;}else{Type.prototype.initialize=initialize;}}
+parent=Type.prototype;}else{parent=Type;}
+OpenLayers.Util.extend(extended,parent);}
+Class.prototype=extended;return Class;};OpenLayers.Class.isPrototype=function(){};OpenLayers.Class.create=function(){return function(){if(arguments&&arguments[0]!=OpenLayers.Class.isPrototype){this.initialize.apply(this,arguments);}};};OpenLayers.Class.inherit=function(){var superClass=arguments[0];var proto=new superClass(OpenLayers.Class.isPrototype);for(var i=1,len=arguments.length;i<len;i++){if(typeof arguments[i]=="function"){var mixin=arguments[i];arguments[i]=new mixin(OpenLayers.Class.isPrototype);}
+OpenLayers.Util.extend(proto,arguments[i]);}
+return proto;};OpenLayers.Util={};OpenLayers.Util.getElement=function(){var elements=[];for(var i=0,len=arguments.length;i<len;i++){var element=arguments[i];if(typeof element=='string'){element=document.getElementById(element);}
+if(arguments.length==1){return element;}
+elements.push(element);}
+return elements;};OpenLayers.Util.isElement=function(o){return!!(o&&o.nodeType===1);};if(typeof window.$==="undefined"){window.$=OpenLayers.Util.getElement;}
+OpenLayers.Util.extend=function(destination,source){destination=destination||{};if(source){for(var property in source){var value=source[property];if(value!==undefined){destination[property]=value;}}
+var sourceIsEvt=typeof window.Event=="function"&&source instanceof window.Event;if(!sourceIsEvt&&source.hasOwnProperty&&source.hasOwnProperty('toString')){destination.toString=source.toString;}}
+return destination;};OpenLayers.Util.removeItem=function(array,item){for(var i=array.length-1;i>=0;i--){if(array[i]==item){array.splice(i,1);}}
+return array;};OpenLayers.Util.clearArray=function(array){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'array = []'}));array.length=0;};OpenLayers.Util.indexOf=function(array,obj){if(typeof array.indexOf=="function"){return array.indexOf(obj);}else{for(var i=0,len=array.length;i<len;i++){if(array[i]==obj){return i;}}
+return-1;}};OpenLayers.Util.modifyDOMElement=function(element,id,px,sz,position,border,overflow,opacity){if(id){element.id=id;}
+if(px){element.style.left=px.x+"px";element.style.top=px.y+"px";}
+if(sz){element.style.width=sz.w+"px";element.style.height=sz.h+"px";}
+if(position){element.style.position=position;}
+if(border){element.style.border=border;}
+if(overflow){element.style.overflow=overflow;}
+if(parseFloat(opacity)>=0.0&&parseFloat(opacity)<1.0){element.style.filter='alpha(opacity='+(opacity*100)+')';element.style.opacity=opacity;}else if(parseFloat(opacity)==1.0){element.style.filter='';element.style.opacity='';}};OpenLayers.Util.createDiv=function(id,px,sz,imgURL,position,border,overflow,opacity){var dom=document.createElement('div');if(imgURL){dom.style.backgroundImage='url('+imgURL+')';}
+if(!id){id=OpenLayers.Util.createUniqueID("OpenLayersDiv");}
+if(!position){position="absolute";}
+OpenLayers.Util.modifyDOMElement(dom,id,px,sz,position,border,overflow,opacity);return dom;};OpenLayers.Util.createImage=function(id,px,sz,imgURL,position,border,opacity,delayDisplay){var image=document.createElement("img");if(!id){id=OpenLayers.Util.createUniqueID("OpenLayersDiv");}
+if(!position){position="relative";}
+OpenLayers.Util.modifyDOMElement(image,id,px,sz,position,border,null,opacity);if(delayDisplay){image.style.display="none";OpenLayers.Event.observe(image,"load",OpenLayers.Function.bind(OpenLayers.Util.onImageLoad,image));OpenLayers.Event.observe(image,"error",OpenLayers.Function.bind(OpenLayers.Util.onImageLoadError,image));}
+image.style.alt=id;image.galleryImg="no";if(imgURL){image.src=imgURL;}
+return image;};OpenLayers.Util.setOpacity=function(element,opacity){OpenLayers.Util.modifyDOMElement(element,null,null,null,null,null,null,opacity);};OpenLayers.Util.onImageLoad=function(){if(!this.viewRequestID||(this.map&&this.viewRequestID==this.map.viewRequestID)){this.style.display="";}
+OpenLayers.Element.removeClass(this,"olImageLoadError");};OpenLayers.IMAGE_RELOAD_ATTEMPTS=0;OpenLayers.Util.onImageLoadError=function(){this._attempts=(this._attempts)?(this._attempts+1):1;if(this._attempts<=OpenLayers.IMAGE_RELOAD_ATTEMPTS){var urls=this.urls;if(urls&&urls instanceof Array&&urls.length>1){var src=this.src.toString();var current_url,k;for(k=0;current_url=urls[k];k++){if(src.indexOf(current_url)!=-1){break;}}
+var guess=Math.floor(urls.length*Math.random());var new_url=urls[guess];k=0;while(new_url==current_url&&k++<4){guess=Math.floor(urls.length*Math.random());new_url=urls[guess];}
+this.src=src.replace(current_url,new_url);}else{this.src=this.src;}}else{OpenLayers.Element.addClass(this,"olImageLoadError");}
+this.style.display="";};OpenLayers.Util.alphaHackNeeded=null;OpenLayers.Util.alphaHack=function(){if(OpenLayers.Util.alphaHackNeeded==null){var arVersion=navigator.appVersion.split("MSIE");var version=parseFloat(arVersion[1]);var filter=false;try{filter=!!(document.body.filters);}catch(e){}
+OpenLayers.Util.alphaHackNeeded=(filter&&(version>=5.5)&&(version<7));}
+return OpenLayers.Util.alphaHackNeeded;};OpenLayers.Util.modifyAlphaImageDiv=function(div,id,px,sz,imgURL,position,border,sizing,opacity){OpenLayers.Util.modifyDOMElement(div,id,px,sz,position,null,null,opacity);var img=div.childNodes[0];if(imgURL){img.src=imgURL;}
+OpenLayers.Util.modifyDOMElement(img,div.id+"_innerImage",null,sz,"relative",border);if(OpenLayers.Util.alphaHack()){if(div.style.display!="none"){div.style.display="inline-block";}
+if(sizing==null){sizing="scale";}
+div.style.filter="progid:DXImageTransform.Microsoft"+".AlphaImageLoader(src='"+img.src+"', "+"sizingMethod='"+sizing+"')";if(parseFloat(div.style.opacity)>=0.0&&parseFloat(div.style.opacity)<1.0){div.style.filter+=" alpha(opacity="+div.style.opacity*100+")";}
+img.style.filter="alpha(opacity=0)";}};OpenLayers.Util.createAlphaImageDiv=function(id,px,sz,imgURL,position,border,sizing,opacity,delayDisplay){var div=OpenLayers.Util.createDiv();var img=OpenLayers.Util.createImage(null,null,null,null,null,null,null,false);div.appendChild(img);if(delayDisplay){img.style.display="none";OpenLayers.Event.observe(img,"load",OpenLayers.Function.bind(OpenLayers.Util.onImageLoad,div));OpenLayers.Event.observe(img,"error",OpenLayers.Function.bind(OpenLayers.Util.onImageLoadError,div));}
+OpenLayers.Util.modifyAlphaImageDiv(div,id,px,sz,imgURL,position,border,sizing,opacity);return div;};OpenLayers.Util.upperCaseObject=function(object){var uObject={};for(var key in object){uObject[key.toUpperCase()]=object[key];}
+return uObject;};OpenLayers.Util.applyDefaults=function(to,from){to=to||{};var fromIsEvt=typeof window.Event=="function"&&from instanceof window.Event;for(var key in from){if(to[key]===undefined||(!fromIsEvt&&from.hasOwnProperty&&from.hasOwnProperty(key)&&!to.hasOwnProperty(key))){to[key]=from[key];}}
+if(!fromIsEvt&&from&&from.hasOwnProperty&&from.hasOwnProperty('toString')&&!to.hasOwnProperty('toString')){to.toString=from.toString;}
+return to;};OpenLayers.Util.getParameterString=function(params){var paramsArray=[];for(var key in params){var value=params[key];if((value!=null)&&(typeof value!='function')){var encodedValue;if(typeof value=='object'&&value.constructor==Array){var encodedItemArray=[];var item;for(var itemIndex=0,len=value.length;itemIndex<len;itemIndex++){item=value[itemIndex];encodedItemArray.push(encodeURIComponent((item===null||item===undefined)?"":item));}
+encodedValue=encodedItemArray.join(",");}
+else{encodedValue=encodeURIComponent(value);}
+paramsArray.push(encodeURIComponent(key)+"="+encodedValue);}}
+return paramsArray.join("&");};OpenLayers.Util.urlAppend=function(url,paramStr){var newUrl=url;if(paramStr){var parts=(url+" ").split(/[?&]/);newUrl+=(parts.pop()===" "?paramStr:parts.length?"&"+paramStr:"?"+paramStr);}
+return newUrl;};OpenLayers.ImgPath='';OpenLayers.Util.getImagesLocation=function(){return OpenLayers.ImgPath||(OpenLayers._getScriptLocation()+"img/");};OpenLayers.Util.Try=function(){var returnValue=null;for(var i=0,len=arguments.length;i<len;i++){var lambda=arguments[i];try{returnValue=lambda();break;}catch(e){}}
+return returnValue;};OpenLayers.Util.getNodes=function(p,tagName){var nodes=OpenLayers.Util.Try(function(){return OpenLayers.Util._getNodes(p.documentElement.childNodes,tagName);},function(){return OpenLayers.Util._getNodes(p.childNodes,tagName);});return nodes;};OpenLayers.Util._getNodes=function(nodes,tagName){var retArray=[];for(var i=0,len=nodes.length;i<len;i++){if(nodes[i].nodeName==tagName){retArray.push(nodes[i]);}}
+return retArray;};OpenLayers.Util.getTagText=function(parent,item,index){var result=OpenLayers.Util.getNodes(parent,item);if(result&&(result.length>0))
+{if(!index){index=0;}
+if(result[index].childNodes.length>1){return result.childNodes[1].nodeValue;}
+else if(result[index].childNodes.length==1){return result[index].firstChild.nodeValue;}}else{return"";}};OpenLayers.Util.getXmlNodeValue=function(node){var val=null;OpenLayers.Util.Try(function(){val=node.text;if(!val){val=node.textContent;}
+if(!val){val=node.firstChild.nodeValue;}},function(){val=node.textContent;});return val;};OpenLayers.Util.mouseLeft=function(evt,div){var target=(evt.relatedTarget)?evt.relatedTarget:evt.toElement;while(target!=div&&target!=null){target=target.parentNode;}
+return(target!=div);};OpenLayers.Util.DEFAULT_PRECISION=14;OpenLayers.Util.toFloat=function(number,precision){if(precision==null){precision=OpenLayers.Util.DEFAULT_PRECISION;}
+var number;if(precision==0){number=parseFloat(number);}else{number=parseFloat(parseFloat(number).toPrecision(precision));}
+return number;};OpenLayers.Util.rad=function(x){return x*Math.PI/180;};OpenLayers.Util.deg=function(x){return x*180/Math.PI;};OpenLayers.Util.VincentyConstants={a:6378137,b:6356752.3142,f:1/298.257223563};OpenLayers.Util.distVincenty=function(p1,p2){var ct=OpenLayers.Util.VincentyConstants;var a=ct.a,b=ct.b,f=ct.f;var L=OpenLayers.Util.rad(p2.lon-p1.lon);var U1=Math.atan((1-f)*Math.tan(OpenLayers.Util.rad(p1.lat)));var U2=Math.atan((1-f)*Math.tan(OpenLayers.Util.rad(p2.lat)));var sinU1=Math.sin(U1),cosU1=Math.cos(U1);var sinU2=Math.sin(U2),cosU2=Math.cos(U2);var lambda=L,lambdaP=2*Math.PI;var iterLimit=20;while(Math.abs(lambda-lambdaP)>1e-12&&--iterLimit>0){var sinLambda=Math.sin(lambda),cosLambda=Math.cos(lambda);var sinSigma=Math.sqrt((cosU2*sinLambda)*(cosU2*sinLambda)+
+(cosU1*sinU2-sinU1*cosU2*cosLambda)*(cosU1*sinU2-sinU1*cosU2*cosLambda));if(sinSigma==0){return 0;}
+var cosSigma=sinU1*sinU2+cosU1*cosU2*cosLambda;var sigma=Math.atan2(sinSigma,cosSigma);var alpha=Math.asin(cosU1*cosU2*sinLambda/sinSigma);var cosSqAlpha=Math.cos(alpha)*Math.cos(alpha);var cos2SigmaM=cosSigma-2*sinU1*sinU2/cosSqAlpha;var C=f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha));lambdaP=lambda;lambda=L+(1-C)*f*Math.sin(alpha)*(sigma+C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)));}
+if(iterLimit==0){return NaN;}
+var uSq=cosSqAlpha*(a*a-b*b)/(b*b);var A=1+uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq)));var B=uSq/1024*(256+uSq*(-128+uSq*(74-47*uSq)));var deltaSigma=B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)-
+B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM)));var s=b*A*(sigma-deltaSigma);var d=s.toFixed(3)/1000;return d;};OpenLayers.Util.destinationVincenty=function(lonlat,brng,dist){var u=OpenLayers.Util;var ct=u.VincentyConstants;var a=ct.a,b=ct.b,f=ct.f;var lon1=lonlat.lon;var lat1=lonlat.lat;var s=dist;var alpha1=u.rad(brng);var sinAlpha1=Math.sin(alpha1);var cosAlpha1=Math.cos(alpha1);var tanU1=(1-f)*Math.tan(u.rad(lat1));var cosU1=1/Math.sqrt((1+tanU1*tanU1)),sinU1=tanU1*cosU1;var sigma1=Math.atan2(tanU1,cosAlpha1);var sinAlpha=cosU1*sinAlpha1;var cosSqAlpha=1-sinAlpha*sinAlpha;var uSq=cosSqAlpha*(a*a-b*b)/(b*b);var A=1+uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq)));var B=uSq/1024*(256+uSq*(-128+uSq*(74-47*uSq)));var sigma=s/(b*A),sigmaP=2*Math.PI;while(Math.abs(sigma-sigmaP)>1e-12){var cos2SigmaM=Math.cos(2*sigma1+sigma);var sinSigma=Math.sin(sigma);var cosSigma=Math.cos(sigma);var deltaSigma=B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)-
+B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM)));sigmaP=sigma;sigma=s/(b*A)+deltaSigma;}
+var tmp=sinU1*sinSigma-cosU1*cosSigma*cosAlpha1;var lat2=Math.atan2(sinU1*cosSigma+cosU1*sinSigma*cosAlpha1,(1-f)*Math.sqrt(sinAlpha*sinAlpha+tmp*tmp));var lambda=Math.atan2(sinSigma*sinAlpha1,cosU1*cosSigma-sinU1*sinSigma*cosAlpha1);var C=f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha));var L=lambda-(1-C)*f*sinAlpha*(sigma+C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)));var revAz=Math.atan2(sinAlpha,-tmp);return new OpenLayers.LonLat(lon1+u.deg(L),u.deg(lat2));};OpenLayers.Util.getParameters=function(url){url=url||window.location.href;var paramsString="";if(OpenLayers.String.contains(url,'?')){var start=url.indexOf('?')+1;var end=OpenLayers.String.contains(url,"#")?url.indexOf('#'):url.length;paramsString=url.substring(start,end);}
+var parameters={};var pairs=paramsString.split(/[&;]/);for(var i=0,len=pairs.length;i<len;++i){var keyValue=pairs[i].split('=');if(keyValue[0]){var key=decodeURIComponent(keyValue[0]);var value=keyValue[1]||'';value=decodeURIComponent(value.replace(/\+/g," ")).split(",");if(value.length==1){value=value[0];}
+parameters[key]=value;}}
+return parameters;};OpenLayers.Util.getArgs=function(url){OpenLayers.Console.warn(OpenLayers.i18n("methodDeprecated",{'newMethod':'OpenLayers.Util.getParameters'}));return OpenLayers.Util.getParameters(url);};OpenLayers.Util.lastSeqID=0;OpenLayers.Util.createUniqueID=function(prefix){if(prefix==null){prefix="id_";}
+OpenLayers.Util.lastSeqID+=1;return prefix+OpenLayers.Util.lastSeqID;};OpenLayers.INCHES_PER_UNIT={'inches':1.0,'ft':12.0,'mi':63360.0,'m':39.3701,'km':39370.1,'dd':4374754,'yd':36};OpenLayers.INCHES_PER_UNIT["in"]=OpenLayers.INCHES_PER_UNIT.inches;OpenLayers.INCHES_PER_UNIT["degrees"]=OpenLayers.INCHES_PER_UNIT.dd;OpenLayers.INCHES_PER_UNIT["nmi"]=1852*OpenLayers.INCHES_PER_UNIT.m;OpenLayers.METERS_PER_INCH=0.02540005080010160020;OpenLayers.Util.extend(OpenLayers.INCHES_PER_UNIT,{"Inch":OpenLayers.INCHES_PER_UNIT.inches,"Meter":1.0/OpenLayers.METERS_PER_INCH,"Foot":0.30480060960121920243/OpenLayers.METERS_PER_INCH,"IFoot":0.30480000000000000000/OpenLayers.METERS_PER_INCH,"ClarkeFoot":0.3047972651151/OpenLayers.METERS_PER_INCH,"SearsFoot":0.30479947153867624624/OpenLayers.METERS_PER_INCH,"GoldCoastFoot":0.30479971018150881758/OpenLayers.METERS_PER_INCH,"IInch":0.02540000000000000000/OpenLayers.METERS_PER_INCH,"MicroInch":0.00002540000000000000/OpenLayers.METERS_PER_INCH,"Mil":0.00000002540000000000/OpenLayers.METERS_PER_INCH,"Centimeter":0.01000000000000000000/OpenLayers.METERS_PER_INCH,"Kilometer":1000.00000000000000000000/OpenLayers.METERS_PER_INCH,"Yard":0.91440182880365760731/OpenLayers.METERS_PER_INCH,"SearsYard":0.914398414616029/OpenLayers.METERS_PER_INCH,"IndianYard":0.91439853074444079983/OpenLayers.METERS_PER_INCH,"IndianYd37":0.91439523/OpenLayers.METERS_PER_INCH,"IndianYd62":0.9143988/OpenLayers.METERS_PER_INCH,"IndianYd75":0.9143985/OpenLayers.METERS_PER_INCH,"IndianFoot":0.30479951/OpenLayers.METERS_PER_INCH,"IndianFt37":0.30479841/OpenLayers.METERS_PER_INCH,"IndianFt62":0.3047996/OpenLayers.METERS_PER_INCH,"IndianFt75":0.3047995/OpenLayers.METERS_PER_INCH,"Mile":1609.34721869443738887477/OpenLayers.METERS_PER_INCH,"IYard":0.91440000000000000000/OpenLayers.METERS_PER_INCH,"IMile":1609.34400000000000000000/OpenLayers.METERS_PER_INCH,"NautM":1852.00000000000000000000/OpenLayers.METERS_PER_INCH,"Lat-66":110943.316488932731/OpenLayers.METERS_PER_INCH,"Lat-83":110946.25736872234125/OpenLayers.METERS_PER_INCH,"Decimeter":0.10000000000000000000/OpenLayers.METERS_PER_INCH,"Millimeter":0.00100000000000000000/OpenLayers.METERS_PER_INCH,"Dekameter":10.00000000000000000000/OpenLayers.METERS_PER_INCH,"Decameter":10.00000000000000000000/OpenLayers.METERS_PER_INCH,"Hectometer":100.00000000000000000000/OpenLayers.METERS_PER_INCH,"GermanMeter":1.0000135965/OpenLayers.METERS_PER_INCH,"CaGrid":0.999738/OpenLayers.METERS_PER_INCH,"ClarkeChain":20.1166194976/OpenLayers.METERS_PER_INCH,"GunterChain":20.11684023368047/OpenLayers.METERS_PER_INCH,"BenoitChain":20.116782494375872/OpenLayers.METERS_PER_INCH,"SearsChain":20.11676512155/OpenLayers.METERS_PER_INCH,"ClarkeLink":0.201166194976/OpenLayers.METERS_PER_INCH,"GunterLink":0.2011684023368047/OpenLayers.METERS_PER_INCH,"BenoitLink":0.20116782494375872/OpenLayers.METERS_PER_INCH,"SearsLink":0.2011676512155/OpenLayers.METERS_PER_INCH,"Rod":5.02921005842012/OpenLayers.METERS_PER_INCH,"IntnlChain":20.1168/OpenLayers.METERS_PER_INCH,"IntnlLink":0.201168/OpenLayers.METERS_PER_INCH,"Perch":5.02921005842012/OpenLayers.METERS_PER_INCH,"Pole":5.02921005842012/OpenLayers.METERS_PER_INCH,"Furlong":201.1684023368046/OpenLayers.METERS_PER_INCH,"Rood":3.778266898/OpenLayers.METERS_PER_INCH,"CapeFoot":0.3047972615/OpenLayers.METERS_PER_INCH,"Brealey":375.00000000000000000000/OpenLayers.METERS_PER_INCH,"ModAmFt":0.304812252984505969011938/OpenLayers.METERS_PER_INCH,"Fathom":1.8288/OpenLayers.METERS_PER_INCH,"NautM-UK":1853.184/OpenLayers.METERS_PER_INCH,"50kilometers":50000.0/OpenLayers.METERS_PER_INCH,"150kilometers":150000.0/OpenLayers.METERS_PER_INCH});OpenLayers.Util.extend(OpenLayers.INCHES_PER_UNIT,{"mm":OpenLayers.INCHES_PER_UNIT["Meter"]/1000.0,"cm":OpenLayers.INCHES_PER_UNIT["Meter"]/100.0,"dm":OpenLayers.INCHES_PER_UNIT["Meter"]*100.0,"km":OpenLayers.INCHES_PER_UNIT["Meter"]*1000.0,"kmi":OpenLayers.INCHES_PER_UNIT["nmi"],"fath":OpenLayers.INCHES_PER_UNIT["Fathom"],"ch":OpenLayers.INCHES_PER_UNIT["IntnlChain"],"link":OpenLayers.INCHES_PER_UNIT["IntnlLink"],"us-in":OpenLayers.INCHES_PER_UNIT["inches"],"us-ft":OpenLayers.INCHES_PER_UNIT["Foot"],"us-yd":OpenLayers.INCHES_PER_UNIT["Yard"],"us-ch":OpenLayers.INCHES_PER_UNIT["GunterChain"],"us-mi":OpenLayers.INCHES_PER_UNIT["Mile"],"ind-yd":OpenLayers.INCHES_PER_UNIT["IndianYd37"],"ind-ft":OpenLayers.INCHES_PER_UNIT["IndianFt37"],"ind-ch":20.11669506/OpenLayers.METERS_PER_INCH});OpenLayers.DOTS_PER_INCH=72;OpenLayers.Util.normalizeScale=function(scale){var normScale=(scale>1.0)?(1.0/scale):scale;return normScale;};OpenLayers.Util.getResolutionFromScale=function(scale,units){var resolution;if(scale){if(units==null){units="degrees";}
+var normScale=OpenLayers.Util.normalizeScale(scale);resolution=1/(normScale*OpenLayers.INCHES_PER_UNIT[units]*OpenLayers.DOTS_PER_INCH);}
+return resolution;};OpenLayers.Util.getScaleFromResolution=function(resolution,units){if(units==null){units="degrees";}
+var scale=resolution*OpenLayers.INCHES_PER_UNIT[units]*OpenLayers.DOTS_PER_INCH;return scale;};OpenLayers.Util.safeStopPropagation=function(evt){OpenLayers.Event.stop(evt,true);};OpenLayers.Util.pagePosition=function(forElement){var valueT=0,valueL=0;var element=forElement;var child=forElement;while(element){if(element==document.body){if(OpenLayers.Element.getStyle(child,'position')=='absolute'){break;}}
+valueT+=element.offsetTop||0;valueL+=element.offsetLeft||0;child=element;try{element=element.offsetParent;}catch(e){OpenLayers.Console.error(OpenLayers.i18n("pagePositionFailed",{'elemId':element.id}));break;}}
+element=forElement;while(element){valueT-=element.scrollTop||0;valueL-=element.scrollLeft||0;element=element.parentNode;}
+return[valueL,valueT];};OpenLayers.Util.isEquivalentUrl=function(url1,url2,options){options=options||{};OpenLayers.Util.applyDefaults(options,{ignoreCase:true,ignorePort80:true,ignoreHash:true});var urlObj1=OpenLayers.Util.createUrlObject(url1,options);var urlObj2=OpenLayers.Util.createUrlObject(url2,options);for(var key in urlObj1){if(key!=="args"){if(urlObj1[key]!=urlObj2[key]){return false;}}}
+for(var key in urlObj1.args){if(urlObj1.args[key]!=urlObj2.args[key]){return false;}
+delete urlObj2.args[key];}
+for(var key in urlObj2.args){return false;}
+return true;};OpenLayers.Util.createUrlObject=function(url,options){options=options||{};if(!(/^\w+:\/\//).test(url)){var loc=window.location;var port=loc.port?":"+loc.port:"";var fullUrl=loc.protocol+"//"+loc.host.split(":").shift()+port;if(url.indexOf("/")===0){url=fullUrl+url;}else{var parts=loc.pathname.split("/");parts.pop();url=fullUrl+parts.join("/")+"/"+url;}}
+if(options.ignoreCase){url=url.toLowerCase();}
+var a=document.createElement('a');a.href=url;var urlObject={};urlObject.host=a.host.split(":").shift();urlObject.protocol=a.protocol;if(options.ignorePort80){urlObject.port=(a.port=="80"||a.port=="0")?"":a.port;}else{urlObject.port=(a.port==""||a.port=="0")?"80":a.port;}
+urlObject.hash=(options.ignoreHash||a.hash==="#")?"":a.hash;var queryString=a.search;if(!queryString){var qMark=url.indexOf("?");queryString=(qMark!=-1)?url.substr(qMark):"";}
+urlObject.args=OpenLayers.Util.getParameters(queryString);urlObject.pathname=(a.pathname.charAt(0)=="/")?a.pathname:"/"+a.pathname;return urlObject;};OpenLayers.Util.removeTail=function(url){var head=null;var qMark=url.indexOf("?");var hashMark=url.indexOf("#");if(qMark==-1){head=(hashMark!=-1)?url.substr(0,hashMark):url;}else{head=(hashMark!=-1)?url.substr(0,Math.min(qMark,hashMark)):url.substr(0,qMark);}
+return head;};OpenLayers.Util.getBrowserName=function(){var browserName="";var ua=navigator.userAgent.toLowerCase();if(ua.indexOf("opera")!=-1){browserName="opera";}else if(ua.indexOf("msie")!=-1){browserName="msie";}else if(ua.indexOf("safari")!=-1){browserName="safari";}else if(ua.indexOf("mozilla")!=-1){if(ua.indexOf("firefox")!=-1){browserName="firefox";}else{browserName="mozilla";}}
+return browserName;};OpenLayers.Util.getRenderedDimensions=function(contentHTML,size,options){var w,h;var container=document.createElement("div");container.style.visibility="hidden";var containerElement=(options&&options.containerElement)?options.containerElement:document.body;if(size){if(size.w){w=size.w;container.style.width=w+"px";}else if(size.h){h=size.h;container.style.height=h+"px";}}
+if(options&&options.displayClass){container.className=options.displayClass;}
+var content=document.createElement("div");content.innerHTML=contentHTML;content.style.overflow="visible";if(content.childNodes){for(var i=0,l=content.childNodes.length;i<l;i++){if(!content.childNodes[i].style)continue;content.childNodes[i].style.overflow="visible";}}
+container.appendChild(content);containerElement.appendChild(container);var parentHasPositionAbsolute=false;var parent=container.parentNode;while(parent&&parent.tagName.toLowerCase()!="body"){var parentPosition=OpenLayers.Element.getStyle(parent,"position");if(parentPosition=="absolute"){parentHasPositionAbsolute=true;break;}else if(parentPosition&&parentPosition!="static"){break;}
+parent=parent.parentNode;}
+if(!parentHasPositionAbsolute){container.style.position="absolute";}
+if(!w){w=parseInt(content.scrollWidth);container.style.width=w+"px";}
+if(!h){h=parseInt(content.scrollHeight);}
+container.removeChild(content);containerElement.removeChild(container);return new OpenLayers.Size(w,h);};OpenLayers.Util.getScrollbarWidth=function(){var scrollbarWidth=OpenLayers.Util._scrollbarWidth;if(scrollbarWidth==null){var scr=null;var inn=null;var wNoScroll=0;var wScroll=0;scr=document.createElement('div');scr.style.position='absolute';scr.style.top='-1000px';scr.style.left='-1000px';scr.style.width='100px';scr.style.height='50px';scr.style.overflow='hidden';inn=document.createElement('div');inn.style.width='100%';inn.style.height='200px';scr.appendChild(inn);document.body.appendChild(scr);wNoScroll=inn.offsetWidth;scr.style.overflow='scroll';wScroll=inn.offsetWidth;document.body.removeChild(document.body.lastChild);OpenLayers.Util._scrollbarWidth=(wNoScroll-wScroll);scrollbarWidth=OpenLayers.Util._scrollbarWidth;}
+return scrollbarWidth;};OpenLayers.Util.getFormattedLonLat=function(coordinate,axis,dmsOption){if(!dmsOption){dmsOption='dms';}
+var abscoordinate=Math.abs(coordinate)
+var coordinatedegrees=Math.floor(abscoordinate);var coordinateminutes=(abscoordinate-coordinatedegrees)/(1/60);var tempcoordinateminutes=coordinateminutes;coordinateminutes=Math.floor(coordinateminutes);var coordinateseconds=(tempcoordinateminutes-coordinateminutes)/(1/60);coordinateseconds=Math.round(coordinateseconds*10);coordinateseconds/=10;if(coordinatedegrees<10){coordinatedegrees="0"+coordinatedegrees;}
+var str=coordinatedegrees+"\u00B0";if(dmsOption.indexOf('dm')>=0){if(coordinateminutes<10){coordinateminutes="0"+coordinateminutes;}
+str+=coordinateminutes+"'";if(dmsOption.indexOf('dms')>=0){if(coordinateseconds<10){coordinateseconds="0"+coordinateseconds;}
+str+=coordinateseconds+'"';}}
+if(axis=="lon"){str+=coordinate<0?OpenLayers.i18n("W"):OpenLayers.i18n("E");}else{str+=coordinate<0?OpenLayers.i18n("S"):OpenLayers.i18n("N");}
+return str;};OpenLayers.Rico=new Object();OpenLayers.Rico.Corner={round:function(e,options){e=OpenLayers.Util.getElement(e);this._setOptions(options);var color=this.options.color;if(this.options.color=="fromElement"){color=this._background(e);}
+var bgColor=this.options.bgColor;if(this.options.bgColor=="fromParent"){bgColor=this._background(e.offsetParent);}
+this._roundCornersImpl(e,color,bgColor);},changeColor:function(theDiv,newColor){theDiv.style.backgroundColor=newColor;var spanElements=theDiv.parentNode.getElementsByTagName("span");for(var currIdx=0;currIdx<spanElements.length;currIdx++){spanElements[currIdx].style.backgroundColor=newColor;}},changeOpacity:function(theDiv,newOpacity){var mozillaOpacity=newOpacity;var ieOpacity='alpha(opacity='+newOpacity*100+')';theDiv.style.opacity=mozillaOpacity;theDiv.style.filter=ieOpacity;var spanElements=theDiv.parentNode.getElementsByTagName("span");for(var currIdx=0;currIdx<spanElements.length;currIdx++){spanElements[currIdx].style.opacity=mozillaOpacity;spanElements[currIdx].style.filter=ieOpacity;}},reRound:function(theDiv,options){var topRico=theDiv.parentNode.childNodes[0];var bottomRico=theDiv.parentNode.childNodes[2];theDiv.parentNode.removeChild(topRico);theDiv.parentNode.removeChild(bottomRico);this.round(theDiv.parentNode,options);},_roundCornersImpl:function(e,color,bgColor){if(this.options.border){this._renderBorder(e,bgColor);}
+if(this._isTopRounded()){this._roundTopCorners(e,color,bgColor);}
+if(this._isBottomRounded()){this._roundBottomCorners(e,color,bgColor);}},_renderBorder:function(el,bgColor){var borderValue="1px solid "+this._borderColor(bgColor);var borderL="border-left: "+borderValue;var borderR="border-right: "+borderValue;var style="style='"+borderL+";"+borderR+"'";el.innerHTML="<div "+style+">"+el.innerHTML+"</div>";},_roundTopCorners:function(el,color,bgColor){var corner=this._createCorner(bgColor);for(var i=0;i<this.options.numSlices;i++){corner.appendChild(this._createCornerSlice(color,bgColor,i,"top"));}
+el.style.paddingTop=0;el.insertBefore(corner,el.firstChild);},_roundBottomCorners:function(el,color,bgColor){var corner=this._createCorner(bgColor);for(var i=(this.options.numSlices-1);i>=0;i--){corner.appendChild(this._createCornerSlice(color,bgColor,i,"bottom"));}
+el.style.paddingBottom=0;el.appendChild(corner);},_createCorner:function(bgColor){var corner=document.createElement("div");corner.style.backgroundColor=(this._isTransparent()?"transparent":bgColor);return corner;},_createCornerSlice:function(color,bgColor,n,position){var slice=document.createElement("span");var inStyle=slice.style;inStyle.backgroundColor=color;inStyle.display="block";inStyle.height="1px";inStyle.overflow="hidden";inStyle.fontSize="1px";var borderColor=this._borderColor(color,bgColor);if(this.options.border&&n==0){inStyle.borderTopStyle="solid";inStyle.borderTopWidth="1px";inStyle.borderLeftWidth="0px";inStyle.borderRightWidth="0px";inStyle.borderBottomWidth="0px";inStyle.height="0px";inStyle.borderColor=borderColor;}
+else if(borderColor){inStyle.borderColor=borderColor;inStyle.borderStyle="solid";inStyle.borderWidth="0px 1px";}
+if(!this.options.compact&&(n==(this.options.numSlices-1))){inStyle.height="2px";}
+this._setMargin(slice,n,position);this._setBorder(slice,n,position);return slice;},_setOptions:function(options){this.options={corners:"all",color:"fromElement",bgColor:"fromParent",blend:true,border:false,compact:false};OpenLayers.Util.extend(this.options,options||{});this.options.numSlices=this.options.compact?2:4;if(this._isTransparent()){this.options.blend=false;}},_whichSideTop:function(){if(this._hasString(this.options.corners,"all","top")){return"";}
+if(this.options.corners.indexOf("tl")>=0&&this.options.corners.indexOf("tr")>=0){return"";}
+if(this.options.corners.indexOf("tl")>=0){return"left";}else if(this.options.corners.indexOf("tr")>=0){return"right";}
+return"";},_whichSideBottom:function(){if(this._hasString(this.options.corners,"all","bottom")){return"";}
+if(this.options.corners.indexOf("bl")>=0&&this.options.corners.indexOf("br")>=0){return"";}
+if(this.options.corners.indexOf("bl")>=0){return"left";}else if(this.options.corners.indexOf("br")>=0){return"right";}
+return"";},_borderColor:function(color,bgColor){if(color=="transparent"){return bgColor;}else if(this.options.border){return this.options.border;}else if(this.options.blend){return this._blend(bgColor,color);}else{return"";}},_setMargin:function(el,n,corners){var marginSize=this._marginSize(n);var whichSide=corners=="top"?this._whichSideTop():this._whichSideBottom();if(whichSide=="left"){el.style.marginLeft=marginSize+"px";el.style.marginRight="0px";}
+else if(whichSide=="right"){el.style.marginRight=marginSize+"px";el.style.marginLeft="0px";}
+else{el.style.marginLeft=marginSize+"px";el.style.marginRight=marginSize+"px";}},_setBorder:function(el,n,corners){var borderSize=this._borderSize(n);var whichSide=corners=="top"?this._whichSideTop():this._whichSideBottom();if(whichSide=="left"){el.style.borderLeftWidth=borderSize+"px";el.style.borderRightWidth="0px";}
+else if(whichSide=="right"){el.style.borderRightWidth=borderSize+"px";el.style.borderLeftWidth="0px";}
+else{el.style.borderLeftWidth=borderSize+"px";el.style.borderRightWidth=borderSize+"px";}
+if(this.options.border!=false){el.style.borderLeftWidth=borderSize+"px";el.style.borderRightWidth=borderSize+"px";}},_marginSize:function(n){if(this._isTransparent()){return 0;}
+var marginSizes=[5,3,2,1];var blendedMarginSizes=[3,2,1,0];var compactMarginSizes=[2,1];var smBlendedMarginSizes=[1,0];if(this.options.compact&&this.options.blend){return smBlendedMarginSizes[n];}else if(this.options.compact){return compactMarginSizes[n];}else if(this.options.blend){return blendedMarginSizes[n];}else{return marginSizes[n];}},_borderSize:function(n){var transparentBorderSizes=[5,3,2,1];var blendedBorderSizes=[2,1,1,1];var compactBorderSizes=[1,0];var actualBorderSizes=[0,2,0,0];if(this.options.compact&&(this.options.blend||this._isTransparent())){return 1;}else if(this.options.compact){return compactBorderSizes[n];}else if(this.options.blend){return blendedBorderSizes[n];}else if(this.options.border){return actualBorderSizes[n];}else if(this._isTransparent()){return transparentBorderSizes[n];}
+return 0;},_hasString:function(str){for(var i=1;i<arguments.length;i++)if(str.indexOf(arguments[i])>=0){return true;}return false;},_blend:function(c1,c2){var cc1=OpenLayers.Rico.Color.createFromHex(c1);cc1.blend(OpenLayers.Rico.Color.createFromHex(c2));return cc1;},_background:function(el){try{return OpenLayers.Rico.Color.createColorFromBackground(el).asHex();}catch(err){return"#ffffff";}},_isTransparent:function(){return this.options.color=="transparent";},_isTopRounded:function(){return this._hasString(this.options.corners,"all","top","tl","tr");},_isBottomRounded:function(){return this._hasString(this.options.corners,"all","bottom","bl","br");},_hasSingleTextChild:function(el){return el.childNodes.length==1&&el.childNodes[0].nodeType==3;}};(function(){if(window.google&&google.gears){return;}
+var factory=null;if(typeof GearsFactory!='undefined'){factory=new GearsFactory();}else{try{factory=new ActiveXObject('Gears.Factory');if(factory.getBuildInfo().indexOf('ie_mobile')!=-1){factory.privateSetGlobalObject(this);}}catch(e){if((typeof navigator.mimeTypes!='undefined')&&navigator.mimeTypes["application/x-googlegears"]){factory=document.createElement("object");factory.style.display="none";factory.width=0;factory.height=0;factory.type="application/x-googlegears";document.documentElement.appendChild(factory);}}}
+if(!factory){return;}
+if(!window.google){google={};}
+if(!google.gears){google.gears={factory:factory};}})();OpenLayers.Element={visible:function(element){return OpenLayers.Util.getElement(element).style.display!='none';},toggle:function(){for(var i=0,len=arguments.length;i<len;i++){var element=OpenLayers.Util.getElement(arguments[i]);var display=OpenLayers.Element.visible(element)?'hide':'show';OpenLayers.Element[display](element);}},hide:function(){for(var i=0,len=arguments.length;i<len;i++){var element=OpenLayers.Util.getElement(arguments[i]);if(element){element.style.display='none';}}},show:function(){for(var i=0,len=arguments.length;i<len;i++){var element=OpenLayers.Util.getElement(arguments[i]);if(element){element.style.display='';}}},remove:function(element){element=OpenLayers.Util.getElement(element);element.parentNode.removeChild(element);},getHeight:function(element){element=OpenLayers.Util.getElement(element);return element.offsetHeight;},getDimensions:function(element){element=OpenLayers.Util.getElement(element);if(OpenLayers.Element.getStyle(element,'display')!='none'){return{width:element.offsetWidth,height:element.offsetHeight};}
+var els=element.style;var originalVisibility=els.visibility;var originalPosition=els.position;var originalDisplay=els.display;els.visibility='hidden';els.position='absolute';els.display='';var originalWidth=element.clientWidth;var originalHeight=element.clientHeight;els.display=originalDisplay;els.position=originalPosition;els.visibility=originalVisibility;return{width:originalWidth,height:originalHeight};},hasClass:function(element,name){var names=element.className;return(!!names&&new RegExp("(^|\\s)"+name+"(\\s|$)").test(names));},addClass:function(element,name){if(!OpenLayers.Element.hasClass(element,name)){element.className+=(element.className?" ":"")+name;}
+return element;},removeClass:function(element,name){var names=element.className;if(names){element.className=OpenLayers.String.trim(names.replace(new RegExp("(^|\\s+)"+name+"(\\s+|$)")," "));}
+return element;},toggleClass:function(element,name){if(OpenLayers.Element.hasClass(element,name)){OpenLayers.Element.removeClass(element,name);}else{OpenLayers.Element.addClass(element,name);}
+return element;},getStyle:function(element,style){element=OpenLayers.Util.getElement(element);var value=null;if(element&&element.style){value=element.style[OpenLayers.String.camelize(style)];if(!value){if(document.defaultView&&document.defaultView.getComputedStyle){var css=document.defaultView.getComputedStyle(element,null);value=css?css.getPropertyValue(style):null;}else if(element.currentStyle){value=element.currentStyle[OpenLayers.String.camelize(style)];}}
+var positions=['left','top','right','bottom'];if(window.opera&&(OpenLayers.Util.indexOf(positions,style)!=-1)&&(OpenLayers.Element.getStyle(element,'position')=='static')){value='auto';}}
+return value=='auto'?null:value;}};OpenLayers.Size=OpenLayers.Class({w:0.0,h:0.0,initialize:function(w,h){this.w=parseFloat(w);this.h=parseFloat(h);},toString:function(){return("w="+this.w+",h="+this.h);},clone:function(){return new OpenLayers.Size(this.w,this.h);},equals:function(sz){var equals=false;if(sz!=null){equals=((this.w==sz.w&&this.h==sz.h)||(isNaN(this.w)&&isNaN(this.h)&&isNaN(sz.w)&&isNaN(sz.h)));}
+return equals;},CLASS_NAME:"OpenLayers.Size"});OpenLayers.Console={log:function(){},debug:function(){},info:function(){},warn:function(){},error:function(){},userError:function(error){alert(error);},assert:function(){},dir:function(){},dirxml:function(){},trace:function(){},group:function(){},groupEnd:function(){},time:function(){},timeEnd:function(){},profile:function(){},profileEnd:function(){},count:function(){},CLASS_NAME:"OpenLayers.Console"};(function(){var scripts=document.getElementsByTagName("script");for(var i=0,len=scripts.length;i<len;++i){if(scripts[i].src.indexOf("firebug.js")!=-1){if(console){OpenLayers.Util.extend(OpenLayers.Console,console);break;}}}})();OpenLayers.Icon=OpenLayers.Class({url:null,size:null,offset:null,calculateOffset:null,imageDiv:null,px:null,initialize:function(url,size,offset,calculateOffset){this.url=url;this.size=(size)?size:new OpenLayers.Size(20,20);this.offset=offset?offset:new OpenLayers.Pixel(-(this.size.w/2),-(this.size.h/2));this.calculateOffset=calculateOffset;var id=OpenLayers.Util.createUniqueID("OL_Icon_");this.imageDiv=OpenLayers.Util.createAlphaImageDiv(id);},destroy:function(){this.erase();OpenLayers.Event.stopObservingElement(this.imageDiv.firstChild);this.imageDiv.innerHTML="";this.imageDiv=null;},clone:function(){return new OpenLayers.Icon(this.url,this.size,this.offset,this.calculateOffset);},setSize:function(size){if(size!=null){this.size=size;}
+this.draw();},setUrl:function(url){if(url!=null){this.url=url;}
+this.draw();},draw:function(px){OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv,null,null,this.size,this.url,"absolute");this.moveTo(px);return this.imageDiv;},erase:function(){if(this.imageDiv!=null&&this.imageDiv.parentNode!=null){OpenLayers.Element.remove(this.imageDiv);}},setOpacity:function(opacity){OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv,null,null,null,null,null,null,null,opacity);},moveTo:function(px){if(px!=null){this.px=px;}
+if(this.imageDiv!=null){if(this.px==null){this.display(false);}else{if(this.calculateOffset){this.offset=this.calculateOffset(this.size);}
+var offsetPx=this.px.offset(this.offset);OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv,null,offsetPx);}}},display:function(display){this.imageDiv.style.display=(display)?"":"none";},isDrawn:function(){var isDrawn=(this.imageDiv&&this.imageDiv.parentNode&&(this.imageDiv.parentNode.nodeType!=11));return isDrawn;},CLASS_NAME:"OpenLayers.Icon"});OpenLayers.Popup=OpenLayers.Class({events:null,id:"",lonlat:null,div:null,contentSize:null,size:null,contentHTML:null,backgroundColor:"",opacity:"",border:"",contentDiv:null,groupDiv:null,closeDiv:null,autoSize:false,minSize:null,maxSize:null,displayClass:"olPopup",contentDisplayClass:"olPopupContent",padding:0,disableFirefoxOverflowHack:false,fixPadding:function(){if(typeof this.padding=="number"){this.padding=new OpenLayers.Bounds(this.padding,this.padding,this.padding,this.padding);}},panMapIfOutOfView:false,keepInMap:false,closeOnMove:false,map:null,initialize:function(id,lonlat,contentSize,contentHTML,closeBox,closeBoxCallback){if(id==null){id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");}
+this.id=id;this.lonlat=lonlat;this.contentSize=(contentSize!=null)?contentSize:new OpenLayers.Size(OpenLayers.Popup.WIDTH,OpenLayers.Popup.HEIGHT);if(contentHTML!=null){this.contentHTML=contentHTML;}
+this.backgroundColor=OpenLayers.Popup.COLOR;this.opacity=OpenLayers.Popup.OPACITY;this.border=OpenLayers.Popup.BORDER;this.div=OpenLayers.Util.createDiv(this.id,null,null,null,null,null,"hidden");this.div.className=this.displayClass;var groupDivId=this.id+"_GroupDiv";this.groupDiv=OpenLayers.Util.createDiv(groupDivId,null,null,null,"relative",null,"hidden");var id=this.div.id+"_contentDiv";this.contentDiv=OpenLayers.Util.createDiv(id,null,this.contentSize.clone(),null,"relative");this.contentDiv.className=this.contentDisplayClass;this.groupDiv.appendChild(this.contentDiv);this.div.appendChild(this.groupDiv);if(closeBox){this.addCloseBox(closeBoxCallback);}
+this.registerEvents();},destroy:function(){this.id=null;this.lonlat=null;this.size=null;this.contentHTML=null;this.backgroundColor=null;this.opacity=null;this.border=null;if(this.closeOnMove&&this.map){this.map.events.unregister("movestart",this,this.hide);}
+this.events.destroy();this.events=null;if(this.closeDiv){OpenLayers.Event.stopObservingElement(this.closeDiv);this.groupDiv.removeChild(this.closeDiv);}
+this.closeDiv=null;this.div.removeChild(this.groupDiv);this.groupDiv=null;if(this.map!=null){this.map.removePopup(this);}
+this.map=null;this.div=null;this.autoSize=null;this.minSize=null;this.maxSize=null;this.padding=null;this.panMapIfOutOfView=null;},draw:function(px){if(px==null){if((this.lonlat!=null)&&(this.map!=null)){px=this.map.getLayerPxFromLonLat(this.lonlat);}}
+if(this.closeOnMove){this.map.events.register("movestart",this,this.hide);}
+if(!this.disableFirefoxOverflowHack&&OpenLayers.Util.getBrowserName()=='firefox'){this.map.events.register("movestart",this,function(){var style=document.defaultView.getComputedStyle(this.contentDiv,null);var currentOverflow=style.getPropertyValue("overflow");if(currentOverflow!="hidden"){this.contentDiv._oldOverflow=currentOverflow;this.contentDiv.style.overflow="hidden";}});this.map.events.register("moveend",this,function(){var oldOverflow=this.contentDiv._oldOverflow;if(oldOverflow){this.contentDiv.style.overflow=oldOverflow;this.contentDiv._oldOverflow=null;}});}
+this.moveTo(px);if(!this.autoSize&&!this.size){this.setSize(this.contentSize);}
+this.setBackgroundColor();this.setOpacity();this.setBorder();this.setContentHTML();if(this.panMapIfOutOfView){this.panIntoView();}
+return this.div;},updatePosition:function(){if((this.lonlat)&&(this.map)){var px=this.map.getLayerPxFromLonLat(this.lonlat);if(px){this.moveTo(px);}}},moveTo:function(px){if((px!=null)&&(this.div!=null)){this.div.style.left=px.x+"px";this.div.style.top=px.y+"px";}},visible:function(){return OpenLayers.Element.visible(this.div);},toggle:function(){if(this.visible()){this.hide();}else{this.show();}},show:function(){OpenLayers.Element.show(this.div);if(this.panMapIfOutOfView){this.panIntoView();}},hide:function(){OpenLayers.Element.hide(this.div);},setSize:function(contentSize){this.size=contentSize.clone();var contentDivPadding=this.getContentDivPadding();var wPadding=contentDivPadding.left+contentDivPadding.right;var hPadding=contentDivPadding.top+contentDivPadding.bottom;this.fixPadding();wPadding+=this.padding.left+this.padding.right;hPadding+=this.padding.top+this.padding.bottom;if(this.closeDiv){var closeDivWidth=parseInt(this.closeDiv.style.width);wPadding+=closeDivWidth+contentDivPadding.right;}
+this.size.w+=wPadding;this.size.h+=hPadding;if(OpenLayers.Util.getBrowserName()=="msie"){this.contentSize.w+=contentDivPadding.left+contentDivPadding.right;this.contentSize.h+=contentDivPadding.bottom+contentDivPadding.top;}
+if(this.div!=null){this.div.style.width=this.size.w+"px";this.div.style.height=this.size.h+"px";}
+if(this.contentDiv!=null){this.contentDiv.style.width=contentSize.w+"px";this.contentDiv.style.height=contentSize.h+"px";}},updateSize:function(){var preparedHTML="<div class='"+this.contentDisplayClass+"'>"+
+this.contentDiv.innerHTML+"</div>";var containerElement=(this.map)?this.map.layerContainerDiv:document.body;var realSize=OpenLayers.Util.getRenderedDimensions(preparedHTML,null,{displayClass:this.displayClass,containerElement:containerElement});var safeSize=this.getSafeContentSize(realSize);var newSize=null;if(safeSize.equals(realSize)){newSize=realSize;}else{var fixedSize=new OpenLayers.Size();fixedSize.w=(safeSize.w<realSize.w)?safeSize.w:null;fixedSize.h=(safeSize.h<realSize.h)?safeSize.h:null;if(fixedSize.w&&fixedSize.h){newSize=safeSize;}else{var clippedSize=OpenLayers.Util.getRenderedDimensions(preparedHTML,fixedSize,{displayClass:this.contentDisplayClass,containerElement:containerElement});var currentOverflow=OpenLayers.Element.getStyle(this.contentDiv,"overflow");if((currentOverflow!="hidden")&&(clippedSize.equals(safeSize))){var scrollBar=OpenLayers.Util.getScrollbarWidth();if(fixedSize.w){clippedSize.h+=scrollBar;}else{clippedSize.w+=scrollBar;}}
+newSize=this.getSafeContentSize(clippedSize);}}
+this.setSize(newSize);},setBackgroundColor:function(color){if(color!=undefined){this.backgroundColor=color;}
+if(this.div!=null){this.div.style.backgroundColor=this.backgroundColor;}},setOpacity:function(opacity){if(opacity!=undefined){this.opacity=opacity;}
+if(this.div!=null){this.div.style.opacity=this.opacity;this.div.style.filter='alpha(opacity='+this.opacity*100+')';}},setBorder:function(border){if(border!=undefined){this.border=border;}
+if(this.div!=null){this.div.style.border=this.border;}},setContentHTML:function(contentHTML){if(contentHTML!=null){this.contentHTML=contentHTML;}
+if((this.contentDiv!=null)&&(this.contentHTML!=null)&&(this.contentHTML!=this.contentDiv.innerHTML)){this.contentDiv.innerHTML=this.contentHTML;if(this.autoSize){this.registerImageListeners();this.updateSize();}}},registerImageListeners:function(){var onImgLoad=function(){this.popup.updateSize();if(this.popup.visible()&&this.popup.panMapIfOutOfView){this.popup.panIntoView();}
+OpenLayers.Event.stopObserving(this.img,"load",this.img._onImageLoad);};var images=this.contentDiv.getElementsByTagName("img");for(var i=0,len=images.length;i<len;i++){var img=images[i];if(img.width==0||img.height==0){var context={'popup':this,'img':img};img._onImgLoad=OpenLayers.Function.bind(onImgLoad,context);OpenLayers.Event.observe(img,'load',img._onImgLoad);}}},getSafeContentSize:function(size){var safeContentSize=size.clone();var contentDivPadding=this.getContentDivPadding();var wPadding=contentDivPadding.left+contentDivPadding.right;var hPadding=contentDivPadding.top+contentDivPadding.bottom;this.fixPadding();wPadding+=this.padding.left+this.padding.right;hPadding+=this.padding.top+this.padding.bottom;if(this.closeDiv){var closeDivWidth=parseInt(this.closeDiv.style.width);wPadding+=closeDivWidth+contentDivPadding.right;}
+if(this.minSize){safeContentSize.w=Math.max(safeContentSize.w,(this.minSize.w-wPadding));safeContentSize.h=Math.max(safeContentSize.h,(this.minSize.h-hPadding));}
+if(this.maxSize){safeContentSize.w=Math.min(safeContentSize.w,(this.maxSize.w-wPadding));safeContentSize.h=Math.min(safeContentSize.h,(this.maxSize.h-hPadding));}
+if(this.map&&this.map.size){var extraX=0,extraY=0;if(this.keepInMap&&!this.panMapIfOutOfView){var px=this.map.getPixelFromLonLat(this.lonlat);switch(this.relativePosition){case"tr":extraX=px.x;extraY=this.map.size.h-px.y;break;case"tl":extraX=this.map.size.w-px.x;extraY=this.map.size.h-px.y;break;case"bl":extraX=this.map.size.w-px.x;extraY=px.y;break;case"br":extraX=px.x;extraY=px.y;break;default:extraX=px.x;extraY=this.map.size.h-px.y;break;}}
+var maxY=this.map.size.h-
+this.map.paddingForPopups.top-
+this.map.paddingForPopups.bottom-
+hPadding-extraY;var maxX=this.map.size.w-
+this.map.paddingForPopups.left-
+this.map.paddingForPopups.right-
+wPadding-extraX;safeContentSize.w=Math.min(safeContentSize.w,maxX);safeContentSize.h=Math.min(safeContentSize.h,maxY);}
+return safeContentSize;},getContentDivPadding:function(){var contentDivPadding=this._contentDivPadding;if(!contentDivPadding){if(this.div.parentNode==null){this.div.style.display="none";document.body.appendChild(this.div);}
+contentDivPadding=new OpenLayers.Bounds(OpenLayers.Element.getStyle(this.contentDiv,"padding-left"),OpenLayers.Element.getStyle(this.contentDiv,"padding-bottom"),OpenLayers.Element.getStyle(this.contentDiv,"padding-right"),OpenLayers.Element.getStyle(this.contentDiv,"padding-top"));this._contentDivPadding=contentDivPadding;if(this.div.parentNode==document.body){document.body.removeChild(this.div);this.div.style.display="";}}
+return contentDivPadding;},addCloseBox:function(callback){this.closeDiv=OpenLayers.Util.createDiv(this.id+"_close",null,new OpenLayers.Size(17,17));this.closeDiv.className="olPopupCloseBox";var contentDivPadding=this.getContentDivPadding();this.closeDiv.style.right=contentDivPadding.right+"px";this.closeDiv.style.top=contentDivPadding.top+"px";this.groupDiv.appendChild(this.closeDiv);var closePopup=callback||function(e){this.hide();OpenLayers.Event.stop(e);};OpenLayers.Event.observe(this.closeDiv,"click",OpenLayers.Function.bindAsEventListener(closePopup,this));},panIntoView:function(){var mapSize=this.map.getSize();var origTL=this.map.getViewPortPxFromLayerPx(new OpenLayers.Pixel(parseInt(this.div.style.left),parseInt(this.div.style.top)));var newTL=origTL.clone();if(origTL.x<this.map.paddingForPopups.left){newTL.x=this.map.paddingForPopups.left;}else
+if((origTL.x+this.size.w)>(mapSize.w-this.map.paddingForPopups.right)){newTL.x=mapSize.w-this.map.paddingForPopups.right-this.size.w;}
+if(origTL.y<this.map.paddingForPopups.top){newTL.y=this.map.paddingForPopups.top;}else
+if((origTL.y+this.size.h)>(mapSize.h-this.map.paddingForPopups.bottom)){newTL.y=mapSize.h-this.map.paddingForPopups.bottom-this.size.h;}
+var dx=origTL.x-newTL.x;var dy=origTL.y-newTL.y;this.map.pan(dx,dy);},registerEvents:function(){this.events=new OpenLayers.Events(this,this.div,null,true);this.events.on({"mousedown":this.onmousedown,"mousemove":this.onmousemove,"mouseup":this.onmouseup,"click":this.onclick,"mouseout":this.onmouseout,"dblclick":this.ondblclick,scope:this});},onmousedown:function(evt){this.mousedown=true;OpenLayers.Event.stop(evt,true);},onmousemove:function(evt){if(this.mousedown){OpenLayers.Event.stop(evt,true);}},onmouseup:function(evt){if(this.mousedown){this.mousedown=false;OpenLayers.Event.stop(evt,true);}},onclick:function(evt){OpenLayers.Event.stop(evt,true);},onmouseout:function(evt){this.mousedown=false;},ondblclick:function(evt){OpenLayers.Event.stop(evt,true);},CLASS_NAME:"OpenLayers.Popup"});OpenLayers.Popup.WIDTH=200;OpenLayers.Popup.HEIGHT=200;OpenLayers.Popup.COLOR="white";OpenLayers.Popup.OPACITY=1;OpenLayers.Popup.BORDER="0px";OpenLayers.Protocol=OpenLayers.Class({format:null,options:null,autoDestroy:true,defaultFilter:null,initialize:function(options){options=options||{};OpenLayers.Util.extend(this,options);this.options=options;},mergeWithDefaultFilter:function(filter){var merged;if(filter&&this.defaultFilter){merged=new OpenLayers.Filter.Logical({type:OpenLayers.Filter.Logical.AND,filters:[this.defaultFilter,filter]});}else{merged=filter||this.defaultFilter||undefined;}
+return merged;},destroy:function(){this.options=null;this.format=null;},read:function(options){options=options||{};options.filter=this.mergeWithDefaultFilter(options.filter);},create:function(){},update:function(){},"delete":function(){},commit:function(){},abort:function(response){},createCallback:function(method,response,options){return OpenLayers.Function.bind(function(){method.apply(this,[response,options]);},this);},CLASS_NAME:"OpenLayers.Protocol"});OpenLayers.Protocol.Response=OpenLayers.Class({code:null,requestType:null,last:true,features:null,reqFeatures:null,priv:null,initialize:function(options){OpenLayers.Util.extend(this,options);},success:function(){return this.code>0;},CLASS_NAME:"OpenLayers.Protocol.Response"});OpenLayers.Protocol.Response.SUCCESS=1;OpenLayers.Protocol.Response.FAILURE=0;OpenLayers.Renderer=OpenLayers.Class({container:null,root:null,extent:null,locked:false,size:null,resolution:null,map:null,initialize:function(containerID,options){this.container=OpenLayers.Util.getElement(containerID);},destroy:function(){this.container=null;this.extent=null;this.size=null;this.resolution=null;this.map=null;},supported:function(){return false;},setExtent:function(extent,resolutionChanged){this.extent=extent.clone();if(resolutionChanged){this.resolution=null;}},setSize:function(size){this.size=size.clone();this.resolution=null;},getResolution:function(){this.resolution=this.resolution||this.map.getResolution();return this.resolution;},drawFeature:function(feature,style){if(style==null){style=feature.style;}
+if(feature.geometry){var bounds=feature.geometry.getBounds();if(bounds){if(!bounds.intersectsBounds(this.extent)){style={display:"none"};}
+var rendered=this.drawGeometry(feature.geometry,style,feature.id);if(style.display!="none"&&style.label&&rendered!==false){var location=feature.geometry.getCentroid();if(style.labelXOffset||style.labelYOffset){xOffset=isNaN(style.labelXOffset)?0:style.labelXOffset;yOffset=isNaN(style.labelYOffset)?0:style.labelYOffset;var res=this.getResolution();location.move(xOffset*res,yOffset*res);}
+this.drawText(feature.id,style,location);}else{this.removeText(feature.id);}
+return rendered;}}},drawGeometry:function(geometry,style,featureId){},drawText:function(featureId,style,location){},removeText:function(featureId){},clear:function(){},getFeatureIdFromEvent:function(evt){},eraseFeatures:function(features){if(!(features instanceof Array)){features=[features];}
+for(var i=0,len=features.length;i<len;++i){var feature=features[i];this.eraseGeometry(feature.geometry,feature.id);this.removeText(feature.id);}},eraseGeometry:function(geometry,featureId){},moveRoot:function(renderer){},getRenderLayerId:function(){return this.container.id;},applyDefaultSymbolizer:function(symbolizer){var result=OpenLayers.Util.extend({},OpenLayers.Renderer.defaultSymbolizer);if(symbolizer.stroke===false){delete result.strokeWidth;delete result.strokeColor;}
+if(symbolizer.fill===false){delete result.fillColor;}
+OpenLayers.Util.extend(result,symbolizer);return result;},CLASS_NAME:"OpenLayers.Renderer"});OpenLayers.Renderer.defaultSymbolizer={fillColor:"#000000",strokeColor:"#000000",strokeWidth:2,fillOpacity:1,strokeOpacity:1,pointRadius:0};OpenLayers.Strategy=OpenLayers.Class({layer:null,options:null,active:null,autoActivate:true,autoDestroy:true,initialize:function(options){OpenLayers.Util.extend(this,options);this.options=options;this.active=false;},destroy:function(){this.deactivate();this.layer=null;this.options=null;},setLayer:function(layer){this.layer=layer;},activate:function(){if(!this.active){this.active=true;return true;}
+return false;},deactivate:function(){if(this.active){this.active=false;return true;}
+return false;},CLASS_NAME:"OpenLayers.Strategy"});OpenLayers.Symbolizer=OpenLayers.Class({zIndex:0,initialize:function(config){OpenLayers.Util.extend(this,config);},clone:function(){var Type=eval(this.CLASS_NAME);return new Type(OpenLayers.Util.extend({},this));},CLASS_NAME:"OpenLayers.Symbolizer"});OpenLayers.Rico.Color=OpenLayers.Class({initialize:function(red,green,blue){this.rgb={r:red,g:green,b:blue};},setRed:function(r){this.rgb.r=r;},setGreen:function(g){this.rgb.g=g;},setBlue:function(b){this.rgb.b=b;},setHue:function(h){var hsb=this.asHSB();hsb.h=h;this.rgb=OpenLayers.Rico.Color.HSBtoRGB(hsb.h,hsb.s,hsb.b);},setSaturation:function(s){var hsb=this.asHSB();hsb.s=s;this.rgb=OpenLayers.Rico.Color.HSBtoRGB(hsb.h,hsb.s,hsb.b);},setBrightness:function(b){var hsb=this.asHSB();hsb.b=b;this.rgb=OpenLayers.Rico.Color.HSBtoRGB(hsb.h,hsb.s,hsb.b);},darken:function(percent){var hsb=this.asHSB();this.rgb=OpenLayers.Rico.Color.HSBtoRGB(hsb.h,hsb.s,Math.max(hsb.b-percent,0));},brighten:function(percent){var hsb=this.asHSB();this.rgb=OpenLayers.Rico.Color.HSBtoRGB(hsb.h,hsb.s,Math.min(hsb.b+percent,1));},blend:function(other){this.rgb.r=Math.floor((this.rgb.r+other.rgb.r)/2);this.rgb.g=Math.floor((this.rgb.g+other.rgb.g)/2);this.rgb.b=Math.floor((this.rgb.b+other.rgb.b)/2);},isBright:function(){var hsb=this.asHSB();return this.asHSB().b>0.5;},isDark:function(){return!this.isBright();},asRGB:function(){return"rgb("+this.rgb.r+","+this.rgb.g+","+this.rgb.b+")";},asHex:function(){return"#"+this.rgb.r.toColorPart()+this.rgb.g.toColorPart()+this.rgb.b.toColorPart();},asHSB:function(){return OpenLayers.Rico.Color.RGBtoHSB(this.rgb.r,this.rgb.g,this.rgb.b);},toString:function(){return this.asHex();}});OpenLayers.Rico.Color.createFromHex=function(hexCode){if(hexCode.length==4){var shortHexCode=hexCode;var hexCode='#';for(var i=1;i<4;i++){hexCode+=(shortHexCode.charAt(i)+
+shortHexCode.charAt(i));}}
+if(hexCode.indexOf('#')==0){hexCode=hexCode.substring(1);}
+var red=hexCode.substring(0,2);var green=hexCode.substring(2,4);var blue=hexCode.substring(4,6);return new OpenLayers.Rico.Color(parseInt(red,16),parseInt(green,16),parseInt(blue,16));};OpenLayers.Rico.Color.createColorFromBackground=function(elem){var actualColor=RicoUtil.getElementsComputedStyle(OpenLayers.Util.getElement(elem),"backgroundColor","background-color");if(actualColor=="transparent"&&elem.parentNode){return OpenLayers.Rico.Color.createColorFromBackground(elem.parentNode);}
+if(actualColor==null){return new OpenLayers.Rico.Color(255,255,255);}
+if(actualColor.indexOf("rgb(")==0){var colors=actualColor.substring(4,actualColor.length-1);var colorArray=colors.split(",");return new OpenLayers.Rico.Color(parseInt(colorArray[0]),parseInt(colorArray[1]),parseInt(colorArray[2]));}
+else if(actualColor.indexOf("#")==0){return OpenLayers.Rico.Color.createFromHex(actualColor);}
+else{return new OpenLayers.Rico.Color(255,255,255);}};OpenLayers.Rico.Color.HSBtoRGB=function(hue,saturation,brightness){var red=0;var green=0;var blue=0;if(saturation==0){red=parseInt(brightness*255.0+0.5);green=red;blue=red;}
+else{var h=(hue-Math.floor(hue))*6.0;var f=h-Math.floor(h);var p=brightness*(1.0-saturation);var q=brightness*(1.0-saturation*f);var t=brightness*(1.0-(saturation*(1.0-f)));switch(parseInt(h)){case 0:red=(brightness*255.0+0.5);green=(t*255.0+0.5);blue=(p*255.0+0.5);break;case 1:red=(q*255.0+0.5);green=(brightness*255.0+0.5);blue=(p*255.0+0.5);break;case 2:red=(p*255.0+0.5);green=(brightness*255.0+0.5);blue=(t*255.0+0.5);break;case 3:red=(p*255.0+0.5);green=(q*255.0+0.5);blue=(brightness*255.0+0.5);break;case 4:red=(t*255.0+0.5);green=(p*255.0+0.5);blue=(brightness*255.0+0.5);break;case 5:red=(brightness*255.0+0.5);green=(p*255.0+0.5);blue=(q*255.0+0.5);break;}}
+return{r:parseInt(red),g:parseInt(green),b:parseInt(blue)};};OpenLayers.Rico.Color.RGBtoHSB=function(r,g,b){var hue;var saturation;var brightness;var cmax=(r>g)?r:g;if(b>cmax){cmax=b;}
+var cmin=(r<g)?r:g;if(b<cmin){cmin=b;}
+brightness=cmax/255.0;if(cmax!=0){saturation=(cmax-cmin)/cmax;}else{saturation=0;}
+if(saturation==0){hue=0;}else{var redc=(cmax-r)/(cmax-cmin);var greenc=(cmax-g)/(cmax-cmin);var bluec=(cmax-b)/(cmax-cmin);if(r==cmax){hue=bluec-greenc;}else if(g==cmax){hue=2.0+redc-bluec;}else{hue=4.0+greenc-redc;}
+hue=hue/6.0;if(hue<0){hue=hue+1.0;}}
+return{h:hue,s:saturation,b:brightness};};OpenLayers.Bounds=OpenLayers.Class({left:null,bottom:null,right:null,top:null,centerLonLat:null,initialize:function(left,bottom,right,top){if(left!=null){this.left=OpenLayers.Util.toFloat(left);}
+if(bottom!=null){this.bottom=OpenLayers.Util.toFloat(bottom);}
+if(right!=null){this.right=OpenLayers.Util.toFloat(right);}
+if(top!=null){this.top=OpenLayers.Util.toFloat(top);}},clone:function(){return new OpenLayers.Bounds(this.left,this.bottom,this.right,this.top);},equals:function(bounds){var equals=false;if(bounds!=null){equals=((this.left==bounds.left)&&(this.right==bounds.right)&&(this.top==bounds.top)&&(this.bottom==bounds.bottom));}
+return equals;},toString:function(){return("left-bottom=("+this.left+","+this.bottom+")"
++" right-top=("+this.right+","+this.top+")");},toArray:function(reverseAxisOrder){if(reverseAxisOrder===true){return[this.bottom,this.left,this.top,this.right];}else{return[this.left,this.bottom,this.right,this.top];}},toBBOX:function(decimal,reverseAxisOrder){if(decimal==null){decimal=6;}
+var mult=Math.pow(10,decimal);var xmin=Math.round(this.left*mult)/mult;var ymin=Math.round(this.bottom*mult)/mult;var xmax=Math.round(this.right*mult)/mult;var ymax=Math.round(this.top*mult)/mult;if(reverseAxisOrder===true){return ymin+","+xmin+","+ymax+","+xmax;}else{return xmin+","+ymin+","+xmax+","+ymax;}},toGeometry:function(){return new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing([new OpenLayers.Geometry.Point(this.left,this.bottom),new OpenLayers.Geometry.Point(this.right,this.bottom),new OpenLayers.Geometry.Point(this.right,this.top),new OpenLayers.Geometry.Point(this.left,this.top)])]);},getWidth:function(){return(this.right-this.left);},getHeight:function(){return(this.top-this.bottom);},getSize:function(){return new OpenLayers.Size(this.getWidth(),this.getHeight());},getCenterPixel:function(){return new OpenLayers.Pixel((this.left+this.right)/2,(this.bottom+this.top)/2);},getCenterLonLat:function(){if(!this.centerLonLat){this.centerLonLat=new OpenLayers.LonLat((this.left+this.right)/2,(this.bottom+this.top)/2);}
+return this.centerLonLat;},scale:function(ratio,origin){if(origin==null){origin=this.getCenterLonLat();}
+var origx,origy;if(origin.CLASS_NAME=="OpenLayers.LonLat"){origx=origin.lon;origy=origin.lat;}else{origx=origin.x;origy=origin.y;}
+var left=(this.left-origx)*ratio+origx;var bottom=(this.bottom-origy)*ratio+origy;var right=(this.right-origx)*ratio+origx;var top=(this.top-origy)*ratio+origy;return new OpenLayers.Bounds(left,bottom,right,top);},add:function(x,y){if((x==null)||(y==null)){var msg=OpenLayers.i18n("boundsAddError");OpenLayers.Console.error(msg);return null;}
+return new OpenLayers.Bounds(this.left+x,this.bottom+y,this.right+x,this.top+y);},extend:function(object){var bounds=null;if(object){switch(object.CLASS_NAME){case"OpenLayers.LonLat":bounds=new OpenLayers.Bounds(object.lon,object.lat,object.lon,object.lat);break;case"OpenLayers.Geometry.Point":bounds=new OpenLayers.Bounds(object.x,object.y,object.x,object.y);break;case"OpenLayers.Bounds":bounds=object;break;}
+if(bounds){this.centerLonLat=null;if((this.left==null)||(bounds.left<this.left)){this.left=bounds.left;}
+if((this.bottom==null)||(bounds.bottom<this.bottom)){this.bottom=bounds.bottom;}
+if((this.right==null)||(bounds.right>this.right)){this.right=bounds.right;}
+if((this.top==null)||(bounds.top>this.top)){this.top=bounds.top;}}}},containsLonLat:function(ll,inclusive){return this.contains(ll.lon,ll.lat,inclusive);},containsPixel:function(px,inclusive){return this.contains(px.x,px.y,inclusive);},contains:function(x,y,inclusive){if(inclusive==null){inclusive=true;}
+if(x==null||y==null){return false;}
+x=OpenLayers.Util.toFloat(x);y=OpenLayers.Util.toFloat(y);var contains=false;if(inclusive){contains=((x>=this.left)&&(x<=this.right)&&(y>=this.bottom)&&(y<=this.top));}else{contains=((x>this.left)&&(x<this.right)&&(y>this.bottom)&&(y<this.top));}
+return contains;},intersectsBounds:function(bounds,inclusive){if(inclusive==null){inclusive=true;}
+var intersects=false;var mightTouch=(this.left==bounds.right||this.right==bounds.left||this.top==bounds.bottom||this.bottom==bounds.top);if(inclusive||!mightTouch){var inBottom=(((bounds.bottom>=this.bottom)&&(bounds.bottom<=this.top))||((this.bottom>=bounds.bottom)&&(this.bottom<=bounds.top)));var inTop=(((bounds.top>=this.bottom)&&(bounds.top<=this.top))||((this.top>bounds.bottom)&&(this.top<bounds.top)));var inLeft=(((bounds.left>=this.left)&&(bounds.left<=this.right))||((this.left>=bounds.left)&&(this.left<=bounds.right)));var inRight=(((bounds.right>=this.left)&&(bounds.right<=this.right))||((this.right>=bounds.left)&&(this.right<=bounds.right)));intersects=((inBottom||inTop)&&(inLeft||inRight));}
+return intersects;},containsBounds:function(bounds,partial,inclusive){if(partial==null){partial=false;}
+if(inclusive==null){inclusive=true;}
+var bottomLeft=this.contains(bounds.left,bounds.bottom,inclusive);var bottomRight=this.contains(bounds.right,bounds.bottom,inclusive);var topLeft=this.contains(bounds.left,bounds.top,inclusive);var topRight=this.contains(bounds.right,bounds.top,inclusive);return(partial)?(bottomLeft||bottomRight||topLeft||topRight):(bottomLeft&&bottomRight&&topLeft&&topRight);},determineQuadrant:function(lonlat){var quadrant="";var center=this.getCenterLonLat();quadrant+=(lonlat.lat<center.lat)?"b":"t";quadrant+=(lonlat.lon<center.lon)?"l":"r";return quadrant;},transform:function(source,dest){this.centerLonLat=null;var ll=OpenLayers.Projection.transform({'x':this.left,'y':this.bottom},source,dest);var lr=OpenLayers.Projection.transform({'x':this.right,'y':this.bottom},source,dest);var ul=OpenLayers.Projection.transform({'x':this.left,'y':this.top},source,dest);var ur=OpenLayers.Projection.transform({'x':this.right,'y':this.top},source,dest);this.left=Math.min(ll.x,ul.x);this.bottom=Math.min(ll.y,lr.y);this.right=Math.max(lr.x,ur.x);this.top=Math.max(ul.y,ur.y);return this;},wrapDateLine:function(maxExtent,options){options=options||{};var leftTolerance=options.leftTolerance||0;var rightTolerance=options.rightTolerance||0;var newBounds=this.clone();if(maxExtent){while(newBounds.left<maxExtent.left&&(newBounds.right-rightTolerance)<=maxExtent.left){newBounds=newBounds.add(maxExtent.getWidth(),0);}
+while((newBounds.left+leftTolerance)>=maxExtent.right&&newBounds.right>maxExtent.right){newBounds=newBounds.add(-maxExtent.getWidth(),0);}}
+return newBounds;},CLASS_NAME:"OpenLayers.Bounds"});OpenLayers.Bounds.fromString=function(str){var bounds=str.split(",");return OpenLayers.Bounds.fromArray(bounds);};OpenLayers.Bounds.fromArray=function(bbox){return new OpenLayers.Bounds(parseFloat(bbox[0]),parseFloat(bbox[1]),parseFloat(bbox[2]),parseFloat(bbox[3]));};OpenLayers.Bounds.fromSize=function(size){return new OpenLayers.Bounds(0,size.h,size.w,0);};OpenLayers.Bounds.oppositeQuadrant=function(quadrant){var opp="";opp+=(quadrant.charAt(0)=='t')?'b':'t';opp+=(quadrant.charAt(1)=='l')?'r':'l';return opp;};OpenLayers.LonLat=OpenLayers.Class({lon:0.0,lat:0.0,initialize:function(lon,lat){this.lon=OpenLayers.Util.toFloat(lon);this.lat=OpenLayers.Util.toFloat(lat);},toString:function(){return("lon="+this.lon+",lat="+this.lat);},toShortString:function(){return(this.lon+", "+this.lat);},clone:function(){return new OpenLayers.LonLat(this.lon,this.lat);},add:function(lon,lat){if((lon==null)||(lat==null)){var msg=OpenLayers.i18n("lonlatAddError");OpenLayers.Console.error(msg);return null;}
+return new OpenLayers.LonLat(this.lon+OpenLayers.Util.toFloat(lon),this.lat+OpenLayers.Util.toFloat(lat));},equals:function(ll){var equals=false;if(ll!=null){equals=((this.lon==ll.lon&&this.lat==ll.lat)||(isNaN(this.lon)&&isNaN(this.lat)&&isNaN(ll.lon)&&isNaN(ll.lat)));}
+return equals;},transform:function(source,dest){var point=OpenLayers.Projection.transform({'x':this.lon,'y':this.lat},source,dest);this.lon=point.x;this.lat=point.y;return this;},wrapDateLine:function(maxExtent){var newLonLat=this.clone();if(maxExtent){while(newLonLat.lon<maxExtent.left){newLonLat.lon+=maxExtent.getWidth();}
+while(newLonLat.lon>maxExtent.right){newLonLat.lon-=maxExtent.getWidth();}}
+return newLonLat;},CLASS_NAME:"OpenLayers.LonLat"});OpenLayers.LonLat.fromString=function(str){var pair=str.split(",");return new OpenLayers.LonLat(pair[0],pair[1]);};OpenLayers.Pixel=OpenLayers.Class({x:0.0,y:0.0,initialize:function(x,y){this.x=parseFloat(x);this.y=parseFloat(y);},toString:function(){return("x="+this.x+",y="+this.y);},clone:function(){return new OpenLayers.Pixel(this.x,this.y);},equals:function(px){var equals=false;if(px!=null){equals=((this.x==px.x&&this.y==px.y)||(isNaN(this.x)&&isNaN(this.y)&&isNaN(px.x)&&isNaN(px.y)));}
+return equals;},add:function(x,y){if((x==null)||(y==null)){var msg=OpenLayers.i18n("pixelAddError");OpenLayers.Console.error(msg);return null;}
+return new OpenLayers.Pixel(this.x+x,this.y+y);},offset:function(px){var newPx=this.clone();if(px){newPx=this.add(px.x,px.y);}
+return newPx;},CLASS_NAME:"OpenLayers.Pixel"});OpenLayers.Control=OpenLayers.Class({id:null,map:null,div:null,type:null,allowSelection:false,displayClass:"",title:"",autoActivate:false,active:null,handler:null,eventListeners:null,events:null,EVENT_TYPES:["activate","deactivate"],initialize:function(options){this.displayClass=this.CLASS_NAME.replace("OpenLayers.","ol").replace(/\./g,"");OpenLayers.Util.extend(this,options);this.events=new OpenLayers.Events(this,null,this.EVENT_TYPES);if(this.eventListeners instanceof Object){this.events.on(this.eventListeners);}
+if(this.id==null){this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");}},destroy:function(){if(this.events){if(this.eventListeners){this.events.un(this.eventListeners);}
+this.events.destroy();this.events=null;}
+this.eventListeners=null;if(this.handler){this.handler.destroy();this.handler=null;}
+if(this.handlers){for(var key in this.handlers){if(this.handlers.hasOwnProperty(key)&&typeof this.handlers[key].destroy=="function"){this.handlers[key].destroy();}}
+this.handlers=null;}
+if(this.map){this.map.removeControl(this);this.map=null;}},setMap:function(map){this.map=map;if(this.handler){this.handler.setMap(map);}},draw:function(px){if(this.div==null){this.div=OpenLayers.Util.createDiv(this.id);this.div.className=this.displayClass;if(!this.allowSelection){this.div.className+=" olControlNoSelect";this.div.setAttribute("unselectable","on",0);this.div.onselectstart=OpenLayers.Function.False;}
+if(this.title!=""){this.div.title=this.title;}}
+if(px!=null){this.position=px.clone();}
+this.moveTo(this.position);return this.div;},moveTo:function(px){if((px!=null)&&(this.div!=null)){this.div.style.left=px.x+"px";this.div.style.top=px.y+"px";}},activate:function(){if(this.active){return false;}
+if(this.handler){this.handler.activate();}
+this.active=true;if(this.map){OpenLayers.Element.addClass(this.map.viewPortDiv,this.displayClass.replace(/ /g,"")+"Active");}
+this.events.triggerEvent("activate");return true;},deactivate:function(){if(this.active){if(this.handler){this.handler.deactivate();}
+this.active=false;if(this.map){OpenLayers.Element.removeClass(this.map.viewPortDiv,this.displayClass.replace(/ /g,"")+"Active");}
+this.events.triggerEvent("deactivate");return true;}
+return false;},CLASS_NAME:"OpenLayers.Control"});OpenLayers.Control.TYPE_BUTTON=1;OpenLayers.Control.TYPE_TOGGLE=2;OpenLayers.Control.TYPE_TOOL=3;OpenLayers.Lang={code:null,defaultCode:"en",getCode:function(){if(!OpenLayers.Lang.code){OpenLayers.Lang.setCode();}
+return OpenLayers.Lang.code;},setCode:function(code){var lang;if(!code){code=(OpenLayers.Util.getBrowserName()=="msie")?navigator.userLanguage:navigator.language;}
+var parts=code.split('-');parts[0]=parts[0].toLowerCase();if(typeof OpenLayers.Lang[parts[0]]=="object"){lang=parts[0];}
+if(parts[1]){var testLang=parts[0]+'-'+parts[1].toUpperCase();if(typeof OpenLayers.Lang[testLang]=="object"){lang=testLang;}}
+if(!lang){OpenLayers.Console.warn('Failed to find OpenLayers.Lang.'+parts.join("-")+' dictionary, falling back to default language');lang=OpenLayers.Lang.defaultCode;}
+OpenLayers.Lang.code=lang;},translate:function(key,context){var dictionary=OpenLayers.Lang[OpenLayers.Lang.getCode()];var message=dictionary[key];if(!message){message=key;}
+if(context){message=OpenLayers.String.format(message,context);}
+return message;}};OpenLayers.i18n=OpenLayers.Lang.translate;OpenLayers.Popup.Anchored=OpenLayers.Class(OpenLayers.Popup,{relativePosition:null,keepInMap:true,anchor:null,initialize:function(id,lonlat,contentSize,contentHTML,anchor,closeBox,closeBoxCallback){var newArguments=[id,lonlat,contentSize,contentHTML,closeBox,closeBoxCallback];OpenLayers.Popup.prototype.initialize.apply(this,newArguments);this.anchor=(anchor!=null)?anchor:{size:new OpenLayers.Size(0,0),offset:new OpenLayers.Pixel(0,0)};},destroy:function(){this.anchor=null;this.relativePosition=null;OpenLayers.Popup.prototype.destroy.apply(this,arguments);},show:function(){this.updatePosition();OpenLayers.Popup.prototype.show.apply(this,arguments);},moveTo:function(px){var oldRelativePosition=this.relativePosition;this.relativePosition=this.calculateRelativePosition(px);var newPx=this.calculateNewPx(px);var newArguments=new Array(newPx);OpenLayers.Popup.prototype.moveTo.apply(this,newArguments);if(this.relativePosition!=oldRelativePosition){this.updateRelativePosition();}},setSize:function(contentSize){OpenLayers.Popup.prototype.setSize.apply(this,arguments);if((this.lonlat)&&(this.map)){var px=this.map.getLayerPxFromLonLat(this.lonlat);this.moveTo(px);}},calculateRelativePosition:function(px){var lonlat=this.map.getLonLatFromLayerPx(px);var extent=this.map.getExtent();var quadrant=extent.determineQuadrant(lonlat);return OpenLayers.Bounds.oppositeQuadrant(quadrant);},updateRelativePosition:function(){},calculateNewPx:function(px){var newPx=px.offset(this.anchor.offset);var size=this.size||this.contentSize;var top=(this.relativePosition.charAt(0)=='t');newPx.y+=(top)?-(size.h+this.anchor.size.h):this.anchor.size.h;var left=(this.relativePosition.charAt(1)=='l');newPx.x+=(left)?-(size.w+this.anchor.size.w):this.anchor.size.w;return newPx;},CLASS_NAME:"OpenLayers.Popup.Anchored"});OpenLayers.Protocol.SOS=function(options){options=OpenLayers.Util.applyDefaults(options,OpenLayers.Protocol.SOS.DEFAULTS);var cls=OpenLayers.Protocol.SOS["v"+options.version.replace(/\./g,"_")];if(!cls){throw"Unsupported SOS version: "+options.version;}
+return new cls(options);};OpenLayers.Protocol.SOS.DEFAULTS={"version":"1.0.0"};OpenLayers.Protocol.SQL=OpenLayers.Class(OpenLayers.Protocol,{databaseName:'ol',tableName:"ol_vector_features",postReadFiltering:true,initialize:function(options){OpenLayers.Protocol.prototype.initialize.apply(this,[options]);},destroy:function(){OpenLayers.Protocol.prototype.destroy.apply(this);},supported:function(){return false;},evaluateFilter:function(feature,filter){return filter&&this.postReadFiltering?filter.evaluate(feature):true;},CLASS_NAME:"OpenLayers.Protocol.SQL"});OpenLayers.Protocol.WFS=function(options){options=OpenLayers.Util.applyDefaults(options,OpenLayers.Protocol.WFS.DEFAULTS);var cls=OpenLayers.Protocol.WFS["v"+options.version.replace(/\./g,"_")];if(!cls){throw"Unsupported WFS version: "+options.version;}
+return new cls(options);};OpenLayers.Protocol.WFS.fromWMSLayer=function(layer,options){var typeName,featurePrefix;var param=layer.params["LAYERS"];var parts=(param instanceof Array?param[0]:param).split(":");if(parts.length>1){featurePrefix=parts[0];}
+typeName=parts.pop();var protocolOptions={url:layer.url,featureType:typeName,featurePrefix:featurePrefix,srsName:layer.projection&&layer.projection.getCode()||layer.map&&layer.map.getProjectionObject().getCode(),version:"1.1.0"};return new OpenLayers.Protocol.WFS(OpenLayers.Util.applyDefaults(options,protocolOptions));};OpenLayers.Protocol.WFS.DEFAULTS={"version":"1.0.0"};OpenLayers.Renderer.Canvas=OpenLayers.Class(OpenLayers.Renderer,{canvas:null,features:null,initialize:function(containerID){OpenLayers.Renderer.prototype.initialize.apply(this,arguments);this.root=document.createElement("canvas");this.container.appendChild(this.root);this.canvas=this.root.getContext("2d");this.features={};},eraseGeometry:function(geometry,featureId){this.eraseFeatures(this.features[featureId][0]);},supported:function(){var canvas=document.createElement("canvas");return!!canvas.getContext;},setExtent:function(extent){this.extent=extent.clone();this.resolution=null;this.redraw();},setSize:function(size){this.size=size.clone();this.root.style.width=size.w+"px";this.root.style.height=size.h+"px";this.root.width=size.w;this.root.height=size.h;this.resolution=null;},drawFeature:function(feature,style){style=style||feature.style;style=this.applyDefaultSymbolizer(style);this.features[feature.id]=[feature,style];this.redraw();},drawGeometry:function(geometry,style){var className=geometry.CLASS_NAME;if((className=="OpenLayers.Geometry.Collection")||(className=="OpenLayers.Geometry.MultiPoint")||(className=="OpenLayers.Geometry.MultiLineString")||(className=="OpenLayers.Geometry.MultiPolygon")){for(var i=0;i<geometry.components.length;i++){this.drawGeometry(geometry.components[i],style);}
+return;}
+switch(geometry.CLASS_NAME){case"OpenLayers.Geometry.Point":this.drawPoint(geometry,style);break;case"OpenLayers.Geometry.LineString":this.drawLineString(geometry,style);break;case"OpenLayers.Geometry.LinearRing":this.drawLinearRing(geometry,style);break;case"OpenLayers.Geometry.Polygon":this.drawPolygon(geometry,style);break;default:break;}},drawExternalGraphic:function(pt,style){var img=new Image();if(style.graphicTitle){img.title=style.graphicTitle;}
+var width=style.graphicWidth||style.graphicHeight;var height=style.graphicHeight||style.graphicWidth;width=width?width:style.pointRadius*2;height=height?height:style.pointRadius*2;var xOffset=(style.graphicXOffset!=undefined)?style.graphicXOffset:-(0.5*width);var yOffset=(style.graphicYOffset!=undefined)?style.graphicYOffset:-(0.5*height);var context={img:img,x:(pt[0]+xOffset),y:(pt[1]+yOffset),width:width,height:height,opacity:style.graphicOpacity||style.fillOpacity,canvas:this.canvas};img.onload=OpenLayers.Function.bind(function(){this.canvas.globalAlpha=this.opacity;this.canvas.drawImage(this.img,this.x,this.y,this.width,this.height);},context);img.src=style.externalGraphic;},setCanvasStyle:function(type,style){if(type=="fill"){this.canvas.globalAlpha=style['fillOpacity'];this.canvas.fillStyle=style['fillColor'];}else if(type=="stroke"){this.canvas.globalAlpha=style['strokeOpacity'];this.canvas.strokeStyle=style['strokeColor'];this.canvas.lineWidth=style['strokeWidth'];}else{this.canvas.globalAlpha=0;this.canvas.lineWidth=1;}},drawPoint:function(geometry,style){if(style.graphic!==false){var pt=this.getLocalXY(geometry);if(style.externalGraphic){this.drawExternalGraphic(pt,style);}else{if(style.fill!==false){this.setCanvasStyle("fill",style);this.canvas.beginPath();this.canvas.arc(pt[0],pt[1],style.pointRadius,0,Math.PI*2,true);this.canvas.fill();}
+if(style.stroke!==false){this.setCanvasStyle("stroke",style);this.canvas.beginPath();this.canvas.arc(pt[0],pt[1],style.pointRadius,0,Math.PI*2,true);this.canvas.stroke();this.setCanvasStyle("reset");}}}},drawLineString:function(geometry,style){if(style.stroke!==false){this.setCanvasStyle("stroke",style);this.canvas.beginPath();var start=this.getLocalXY(geometry.components[0]);this.canvas.moveTo(start[0],start[1]);for(var i=1;i<geometry.components.length;i++){var pt=this.getLocalXY(geometry.components[i]);this.canvas.lineTo(pt[0],pt[1]);}
+this.canvas.stroke();}
+this.setCanvasStyle("reset");},drawLinearRing:function(geometry,style){if(style.fill!==false){this.setCanvasStyle("fill",style);this.canvas.beginPath();var start=this.getLocalXY(geometry.components[0]);this.canvas.moveTo(start[0],start[1]);for(var i=1;i<geometry.components.length-1;i++){var pt=this.getLocalXY(geometry.components[i]);this.canvas.lineTo(pt[0],pt[1]);}
+this.canvas.fill();}
+if(style.stroke!==false){this.setCanvasStyle("stroke",style);this.canvas.beginPath();var start=this.getLocalXY(geometry.components[0]);this.canvas.moveTo(start[0],start[1]);for(var i=1;i<geometry.components.length;i++){var pt=this.getLocalXY(geometry.components[i]);this.canvas.lineTo(pt[0],pt[1]);}
+this.canvas.stroke();}
+this.setCanvasStyle("reset");},drawPolygon:function(geometry,style){this.drawLinearRing(geometry.components[0],style);for(var i=1;i<geometry.components.length;i++){this.drawLinearRing(geometry.components[i],{fillOpacity:0,strokeWidth:0,strokeOpacity:0,strokeColor:'#000000',fillColor:'#000000'});}},drawText:function(location,style){style=OpenLayers.Util.extend({fontColor:"#000000",labelAlign:"cm"},style);var pt=this.getLocalXY(location);this.setCanvasStyle("reset");this.canvas.fillStyle=style.fontColor;this.canvas.globalAlpha=style.fontOpacity||1.0;var fontStyle=style.fontWeight+" "+style.fontSize+" "+style.fontFamily;if(this.canvas.fillText){var labelAlign=OpenLayers.Renderer.Canvas.LABEL_ALIGN[style.labelAlign[0]]||"center";this.canvas.font=fontStyle;this.canvas.textAlign=labelAlign;this.canvas.fillText(style.label,pt[0],pt[1]);}else if(this.canvas.mozDrawText){this.canvas.mozTextStyle=fontStyle;var len=this.canvas.mozMeasureText(style.label);switch(style.labelAlign[0]){case"l":break;case"r":pt[0]-=len;break;case"c":default:pt[0]-=len/2;}
+this.canvas.translate(pt[0],pt[1]);this.canvas.mozDrawText(style.label);this.canvas.translate(-1*pt[0],-1*pt[1]);}
+this.setCanvasStyle("reset");},getLocalXY:function(point){var resolution=this.getResolution();var extent=this.extent;var x=(point.x/resolution+(-extent.left/resolution));var y=((extent.top/resolution)-point.y/resolution);return[x,y];},clear:function(){this.canvas.clearRect(0,0,this.root.width,this.root.height);this.features={};},getFeatureIdFromEvent:function(evt){var loc=this.map.getLonLatFromPixel(evt.xy);var resolution=this.getResolution();var bounds=new OpenLayers.Bounds(loc.lon-resolution*5,loc.lat-resolution*5,loc.lon+resolution*5,loc.lat+resolution*5);var geom=bounds.toGeometry();for(var feat in this.features){if(!this.features.hasOwnProperty(feat)){continue;}
+if(this.features[feat][0].geometry.intersects(geom)){return feat;}}
+return null;},eraseFeatures:function(features){if(!(features instanceof Array)){features=[features];}
+for(var i=0;i<features.length;++i){delete this.features[features[i].id];}
+this.redraw();},redraw:function(){if(!this.locked){this.canvas.clearRect(0,0,this.root.width,this.root.height);var labelMap=[];var feature,style;for(var id in this.features){if(!this.features.hasOwnProperty(id)){continue;}
+feature=this.features[id][0];style=this.features[id][1];if(!feature.geometry){continue;}
+this.drawGeometry(feature.geometry,style);if(style.label){labelMap.push([feature,style]);}}
+var item;for(var i=0,len=labelMap.length;i<len;++i){item=labelMap[i];this.drawText(item[0].geometry.getCentroid(),item[1]);}}},CLASS_NAME:"OpenLayers.Renderer.Canvas"});OpenLayers.Renderer.Canvas.LABEL_ALIGN={"l":"left","r":"right"};OpenLayers.ElementsIndexer=OpenLayers.Class({maxZIndex:null,order:null,indices:null,compare:null,initialize:function(yOrdering){this.compare=yOrdering?OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER_Y_ORDER:OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER_DRAWING_ORDER;this.order=[];this.indices={};this.maxZIndex=0;},insert:function(newNode){if(this.exists(newNode)){this.remove(newNode);}
+var nodeId=newNode.id;this.determineZIndex(newNode);var leftIndex=-1;var rightIndex=this.order.length;var middle;while(rightIndex-leftIndex>1){middle=parseInt((leftIndex+rightIndex)/2);var placement=this.compare(this,newNode,OpenLayers.Util.getElement(this.order[middle]));if(placement>0){leftIndex=middle;}else{rightIndex=middle;}}
+this.order.splice(rightIndex,0,nodeId);this.indices[nodeId]=this.getZIndex(newNode);return this.getNextElement(rightIndex);},remove:function(node){var nodeId=node.id;var arrayIndex=OpenLayers.Util.indexOf(this.order,nodeId);if(arrayIndex>=0){this.order.splice(arrayIndex,1);delete this.indices[nodeId];if(this.order.length>0){var lastId=this.order[this.order.length-1];this.maxZIndex=this.indices[lastId];}else{this.maxZIndex=0;}}},clear:function(){this.order=[];this.indices={};this.maxZIndex=0;},exists:function(node){return(this.indices[node.id]!=null);},getZIndex:function(node){return node._style.graphicZIndex;},determineZIndex:function(node){var zIndex=node._style.graphicZIndex;if(zIndex==null){zIndex=this.maxZIndex;node._style.graphicZIndex=zIndex;}else if(zIndex>this.maxZIndex){this.maxZIndex=zIndex;}},getNextElement:function(index){var nextIndex=index+1;if(nextIndex<this.order.length){var nextElement=OpenLayers.Util.getElement(this.order[nextIndex]);if(nextElement==undefined){nextElement=this.getNextElement(nextIndex);}
+return nextElement;}else{return null;}},CLASS_NAME:"OpenLayers.ElementsIndexer"});OpenLayers.ElementsIndexer.IndexingMethods={Z_ORDER:function(indexer,newNode,nextNode){var newZIndex=indexer.getZIndex(newNode);var returnVal=0;if(nextNode){var nextZIndex=indexer.getZIndex(nextNode);returnVal=newZIndex-nextZIndex;}
+return returnVal;},Z_ORDER_DRAWING_ORDER:function(indexer,newNode,nextNode){var returnVal=OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER(indexer,newNode,nextNode);if(nextNode&&returnVal==0){returnVal=1;}
+return returnVal;},Z_ORDER_Y_ORDER:function(indexer,newNode,nextNode){var returnVal=OpenLayers.ElementsIndexer.IndexingMethods.Z_ORDER(indexer,newNode,nextNode);if(nextNode&&returnVal===0){var result=nextNode._boundsBottom-newNode._boundsBottom;returnVal=(result===0)?1:result;}
+return returnVal;}};OpenLayers.Renderer.Elements=OpenLayers.Class(OpenLayers.Renderer,{rendererRoot:null,root:null,vectorRoot:null,textRoot:null,xmlns:null,indexer:null,BACKGROUND_ID_SUFFIX:"_background",LABEL_ID_SUFFIX:"_label",initialize:function(containerID,options){OpenLayers.Renderer.prototype.initialize.apply(this,arguments);this.rendererRoot=this.createRenderRoot();this.root=this.createRoot("_root");this.vectorRoot=this.createRoot("_vroot");this.textRoot=this.createRoot("_troot");this.root.appendChild(this.vectorRoot);this.root.appendChild(this.textRoot);this.rendererRoot.appendChild(this.root);this.container.appendChild(this.rendererRoot);if(options&&(options.zIndexing||options.yOrdering)){this.indexer=new OpenLayers.ElementsIndexer(options.yOrdering);}},destroy:function(){this.clear();this.rendererRoot=null;this.root=null;this.xmlns=null;OpenLayers.Renderer.prototype.destroy.apply(this,arguments);},clear:function(){var child;var root=this.vectorRoot;if(root){while(child=root.firstChild){root.removeChild(child);}}
+root=this.textRoot;if(root){while(child=root.firstChild){root.removeChild(child);}}
+if(this.indexer){this.indexer.clear();}},getNodeType:function(geometry,style){},drawGeometry:function(geometry,style,featureId){var className=geometry.CLASS_NAME;var rendered=true;if((className=="OpenLayers.Geometry.Collection")||(className=="OpenLayers.Geometry.MultiPoint")||(className=="OpenLayers.Geometry.MultiLineString")||(className=="OpenLayers.Geometry.MultiPolygon")){for(var i=0,len=geometry.components.length;i<len;i++){rendered=this.drawGeometry(geometry.components[i],style,featureId)&&rendered;}
+return rendered;};rendered=false;if(style.display!="none"){if(style.backgroundGraphic){this.redrawBackgroundNode(geometry.id,geometry,style,featureId);}
+rendered=this.redrawNode(geometry.id,geometry,style,featureId);}
+if(rendered==false){var node=document.getElementById(geometry.id);if(node){if(node._style.backgroundGraphic){node.parentNode.removeChild(document.getElementById(geometry.id+this.BACKGROUND_ID_SUFFIX));}
+node.parentNode.removeChild(node);}}
+return rendered;},redrawNode:function(id,geometry,style,featureId){style=this.applyDefaultSymbolizer(style);var node=this.nodeFactory(id,this.getNodeType(geometry,style));node._featureId=featureId;node._boundsBottom=geometry.getBounds().bottom;node._geometryClass=geometry.CLASS_NAME;node._style=style;var drawResult=this.drawGeometryNode(node,geometry,style);if(drawResult===false){return false;}
+node=drawResult.node;if(this.indexer){var insert=this.indexer.insert(node);if(insert){this.vectorRoot.insertBefore(node,insert);}else{this.vectorRoot.appendChild(node);}}else{if(node.parentNode!==this.vectorRoot){this.vectorRoot.appendChild(node);}}
+this.postDraw(node);return drawResult.complete;},redrawBackgroundNode:function(id,geometry,style,featureId){var backgroundStyle=OpenLayers.Util.extend({},style);backgroundStyle.externalGraphic=backgroundStyle.backgroundGraphic;backgroundStyle.graphicXOffset=backgroundStyle.backgroundXOffset;backgroundStyle.graphicYOffset=backgroundStyle.backgroundYOffset;backgroundStyle.graphicZIndex=backgroundStyle.backgroundGraphicZIndex;backgroundStyle.graphicWidth=backgroundStyle.backgroundWidth||backgroundStyle.graphicWidth;backgroundStyle.graphicHeight=backgroundStyle.backgroundHeight||backgroundStyle.graphicHeight;backgroundStyle.backgroundGraphic=null;backgroundStyle.backgroundXOffset=null;backgroundStyle.backgroundYOffset=null;backgroundStyle.backgroundGraphicZIndex=null;return this.redrawNode(id+this.BACKGROUND_ID_SUFFIX,geometry,backgroundStyle,null);},drawGeometryNode:function(node,geometry,style){style=style||node._style;var options={'isFilled':style.fill===undefined?true:style.fill,'isStroked':style.stroke===undefined?!!style.strokeWidth:style.stroke};var drawn;switch(geometry.CLASS_NAME){case"OpenLayers.Geometry.Point":if(style.graphic===false){options.isFilled=false;options.isStroked=false;}
+drawn=this.drawPoint(node,geometry);break;case"OpenLayers.Geometry.LineString":options.isFilled=false;drawn=this.drawLineString(node,geometry);break;case"OpenLayers.Geometry.LinearRing":drawn=this.drawLinearRing(node,geometry);break;case"OpenLayers.Geometry.Polygon":drawn=this.drawPolygon(node,geometry);break;case"OpenLayers.Geometry.Surface":drawn=this.drawSurface(node,geometry);break;case"OpenLayers.Geometry.Rectangle":drawn=this.drawRectangle(node,geometry);break;default:break;}
+node._options=options;if(drawn!=false){return{node:this.setStyle(node,style,options,geometry),complete:drawn};}else{return false;}},postDraw:function(node){},drawPoint:function(node,geometry){},drawLineString:function(node,geometry){},drawLinearRing:function(node,geometry){},drawPolygon:function(node,geometry){},drawRectangle:function(node,geometry){},drawCircle:function(node,geometry){},drawSurface:function(node,geometry){},removeText:function(featureId){var label=document.getElementById(featureId+this.LABEL_ID_SUFFIX);if(label){this.textRoot.removeChild(label);}},getFeatureIdFromEvent:function(evt){var target=evt.target;var useElement=target&&target.correspondingUseElement;var node=useElement?useElement:(target||evt.srcElement);var featureId=node._featureId;return featureId;},eraseGeometry:function(geometry,featureId){if((geometry.CLASS_NAME=="OpenLayers.Geometry.MultiPoint")||(geometry.CLASS_NAME=="OpenLayers.Geometry.MultiLineString")||(geometry.CLASS_NAME=="OpenLayers.Geometry.MultiPolygon")||(geometry.CLASS_NAME=="OpenLayers.Geometry.Collection")){for(var i=0,len=geometry.components.length;i<len;i++){this.eraseGeometry(geometry.components[i],featureId);}}else{var element=OpenLayers.Util.getElement(geometry.id);if(element&&element.parentNode){if(element.geometry){element.geometry.destroy();element.geometry=null;}
+element.parentNode.removeChild(element);if(this.indexer){this.indexer.remove(element);}
+if(element._style.backgroundGraphic){var backgroundId=geometry.id+this.BACKGROUND_ID_SUFFIX;var bElem=OpenLayers.Util.getElement(backgroundId);if(bElem&&bElem.parentNode){bElem.parentNode.removeChild(bElem);}}}}},nodeFactory:function(id,type){var node=OpenLayers.Util.getElement(id);if(node){if(!this.nodeTypeCompare(node,type)){node.parentNode.removeChild(node);node=this.nodeFactory(id,type);}}else{node=this.createNode(type,id);}
+return node;},nodeTypeCompare:function(node,type){},createNode:function(type,id){},moveRoot:function(renderer){var root=this.root;if(renderer.root.parentNode==this.rendererRoot){root=renderer.root;}
+root.parentNode.removeChild(root);renderer.rendererRoot.appendChild(root);},getRenderLayerId:function(){return this.root.parentNode.parentNode.id;},isComplexSymbol:function(graphicName){return(graphicName!="circle")&&!!graphicName;},CLASS_NAME:"OpenLayers.Renderer.Elements"});OpenLayers.Renderer.symbol={"star":[350,75,379,161,469,161,397,215,423,301,350,250,277,301,303,215,231,161,321,161,350,75],"cross":[4,0,6,0,6,4,10,4,10,6,6,6,6,10,4,10,4,6,0,6,0,4,4,4,4,0],"x":[0,0,25,0,50,35,75,0,100,0,65,50,100,100,75,100,50,65,25,100,0,100,35,50,0,0],"square":[0,0,0,1,1,1,1,0,0,0],"triangle":[0,10,10,10,5,0,0,10]};OpenLayers.Strategy.Cluster=OpenLayers.Class(OpenLayers.Strategy,{distance:20,threshold:null,features:null,clusters:null,clustering:false,resolution:null,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.call(this);if(activated){this.layer.events.on({"beforefeaturesadded":this.cacheFeatures,"moveend":this.cluster,scope:this});}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){this.clearCache();this.layer.events.un({"beforefeaturesadded":this.cacheFeatures,"moveend":this.cluster,scope:this});}
+return deactivated;},cacheFeatures:function(event){var propagate=true;if(!this.clustering){this.clearCache();this.features=event.features;this.cluster();propagate=false;}
+return propagate;},clearCache:function(){this.features=null;},cluster:function(event){if((!event||event.zoomChanged)&&this.features){var resolution=this.layer.map.getResolution();if(resolution!=this.resolution||!this.clustersExist()){this.resolution=resolution;var clusters=[];var feature,clustered,cluster;for(var i=0;i<this.features.length;++i){feature=this.features[i];if(feature.geometry){clustered=false;for(var j=clusters.length-1;j>=0;--j){cluster=clusters[j];if(this.shouldCluster(cluster,feature)){this.addToCluster(cluster,feature);clustered=true;break;}}
+if(!clustered){clusters.push(this.createCluster(this.features[i]));}}}
+this.layer.removeAllFeatures();if(clusters.length>0){if(this.threshold>1){var clone=clusters.slice();clusters=[];var candidate;for(var i=0,len=clone.length;i<len;++i){candidate=clone[i];if(candidate.attributes.count<this.threshold){Array.prototype.push.apply(clusters,candidate.cluster);}else{clusters.push(candidate);}}}
+this.clustering=true;this.layer.addFeatures(clusters);this.clustering=false;}
+this.clusters=clusters;}}},clustersExist:function(){var exist=false;if(this.clusters&&this.clusters.length>0&&this.clusters.length==this.layer.features.length){exist=true;for(var i=0;i<this.clusters.length;++i){if(this.clusters[i]!=this.layer.features[i]){exist=false;break;}}}
+return exist;},shouldCluster:function(cluster,feature){var cc=cluster.geometry.getBounds().getCenterLonLat();var fc=feature.geometry.getBounds().getCenterLonLat();var distance=(Math.sqrt(Math.pow((cc.lon-fc.lon),2)+Math.pow((cc.lat-fc.lat),2))/this.resolution);return(distance<=this.distance);},addToCluster:function(cluster,feature){cluster.cluster.push(feature);cluster.attributes.count+=1;},createCluster:function(feature){var center=feature.geometry.getBounds().getCenterLonLat();var cluster=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(center.lon,center.lat),{count:1});cluster.cluster=[feature];return cluster;},CLASS_NAME:"OpenLayers.Strategy.Cluster"});OpenLayers.Strategy.Fixed=OpenLayers.Class(OpenLayers.Strategy,{preload:false,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);},destroy:function(){OpenLayers.Strategy.prototype.destroy.apply(this,arguments);},activate:function(){if(OpenLayers.Strategy.prototype.activate.apply(this,arguments)){this.layer.events.on({"refresh":this.load,scope:this});if(this.layer.visibility==true||this.preload){this.load();}else{this.layer.events.on({"visibilitychanged":this.load,scope:this});}
+return true;}
+return false;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){this.layer.events.un({"refresh":this.load,"visibilitychanged":this.load,scope:this});}
+return deactivated;},load:function(options){this.layer.events.triggerEvent("loadstart");this.layer.protocol.read(OpenLayers.Util.applyDefaults({callback:this.merge,filter:this.layer.filter,scope:this},options));this.layer.events.un({"visibilitychanged":this.load,scope:this});},merge:function(resp){this.layer.destroyFeatures();var features=resp.features;if(features&&features.length>0){var remote=this.layer.projection;var local=this.layer.map.getProjectionObject();if(!local.equals(remote)){var geom;for(var i=0,len=features.length;i<len;++i){geom=features[i].geometry;if(geom){geom.transform(remote,local);}}}
+this.layer.addFeatures(features);}
+this.layer.events.triggerEvent("loadend");},CLASS_NAME:"OpenLayers.Strategy.Fixed"});OpenLayers.Strategy.Paging=OpenLayers.Class(OpenLayers.Strategy,{features:null,length:10,num:null,paging:false,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.call(this);if(activated){this.layer.events.on({"beforefeaturesadded":this.cacheFeatures,scope:this});}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){this.clearCache();this.layer.events.un({"beforefeaturesadded":this.cacheFeatures,scope:this});}
+return deactivated;},cacheFeatures:function(event){if(!this.paging){this.clearCache();this.features=event.features;this.pageNext(event);}},clearCache:function(){if(this.features){for(var i=0;i<this.features.length;++i){this.features[i].destroy();}}
+this.features=null;this.num=null;},pageCount:function(){var numFeatures=this.features?this.features.length:0;return Math.ceil(numFeatures/this.length);},pageNum:function(){return this.num;},pageLength:function(newLength){if(newLength&&newLength>0){this.length=newLength;}
+return this.length;},pageNext:function(event){var changed=false;if(this.features){if(this.num===null){this.num=-1;}
+var start=(this.num+1)*this.length;changed=this.page(start,event);}
+return changed;},pagePrevious:function(){var changed=false;if(this.features){if(this.num===null){this.num=this.pageCount();}
+var start=(this.num-1)*this.length;changed=this.page(start);}
+return changed;},page:function(start,event){var changed=false;if(this.features){if(start>=0&&start<this.features.length){var num=Math.floor(start/this.length);if(num!=this.num){this.paging=true;var features=this.features.slice(start,start+this.length);this.layer.removeFeatures(this.layer.features);this.num=num;if(event&&event.features){event.features=features;}else{this.layer.addFeatures(features);}
+this.paging=false;changed=true;}}}
+return changed;},CLASS_NAME:"OpenLayers.Strategy.Paging"});OpenLayers.Strategy.Refresh=OpenLayers.Class(OpenLayers.Strategy,{force:false,interval:0,timer:null,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.call(this);if(activated){if(this.layer.visibility===true){this.start();}
+this.layer.events.on({"visibilitychanged":this.reset,scope:this});}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){this.stop();}
+return deactivated;},reset:function(){if(this.layer.visibility===true){this.start();}else{this.stop();}},start:function(){if(this.interval&&typeof this.interval==="number"&&this.interval>0){this.timer=window.setInterval(OpenLayers.Function.bind(this.refresh,this),this.interval);}},refresh:function(){if(this.layer&&this.layer.refresh&&typeof this.layer.refresh=="function"){this.layer.refresh({force:this.force});}},stop:function(){if(this.timer!==null){window.clearInterval(this.timer);this.timer=null;}},CLASS_NAME:"OpenLayers.Strategy.Refresh"});OpenLayers.Strategy.Save=OpenLayers.Class(OpenLayers.Strategy,{EVENT_TYPES:["start","success","fail"],events:null,auto:false,timer:null,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);this.events=new OpenLayers.Events(this,null,this.EVENT_TYPES);},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.call(this);if(activated){if(this.auto){if(typeof this.auto==="number"){this.timer=window.setInterval(OpenLayers.Function.bind(this.save,this),this.auto*1000);}else{this.layer.events.on({"featureadded":this.triggerSave,"afterfeaturemodified":this.triggerSave,scope:this});}}}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){if(this.auto){if(typeof this.auto==="number"){window.clearInterval(this.timer);}else{this.layer.events.un({"featureadded":this.triggerSave,"afterfeaturemodified":this.triggerSave,scope:this});}}}
+return deactivated;},triggerSave:function(event){var feature=event.feature;if(feature.state===OpenLayers.State.INSERT||feature.state===OpenLayers.State.UPDATE||feature.state===OpenLayers.State.DELETE){this.save([event.feature]);}},save:function(features){if(!features){features=this.layer.features;}
+this.events.triggerEvent("start",{features:features});var remote=this.layer.projection;var local=this.layer.map.getProjectionObject();if(!local.equals(remote)){var len=features.length;var clones=new Array(len);var orig,clone;for(var i=0;i<len;++i){orig=features[i];clone=orig.clone();clone.fid=orig.fid;clone.state=orig.state;if(orig.url){clone.url=orig.url;}
+clone._original=orig;clone.geometry.transform(local,remote);clones[i]=clone;}
+features=clones;}
+this.layer.protocol.commit(features,{callback:this.onCommit,scope:this});},onCommit:function(response){var evt={"response":response};if(response.success()){var features=response.reqFeatures;var state,feature;var destroys=[];var insertIds=response.insertIds||[];var j=0;for(var i=0,len=features.length;i<len;++i){feature=features[i];feature=feature._original||feature;state=feature.state;if(state){if(state==OpenLayers.State.DELETE){destroys.push(feature);}else if(state==OpenLayers.State.INSERT){feature.fid=insertIds[j];++j;}
+feature.state=null;}}
+if(destroys.length>0){this.layer.destroyFeatures(destroys);}
+this.events.triggerEvent("success",evt);}else{this.events.triggerEvent("fail",evt);}},CLASS_NAME:"OpenLayers.Strategy.Save"});OpenLayers.Symbolizer.Line=OpenLayers.Class(OpenLayers.Symbolizer,{strokeColor:null,strokeOpacity:null,strokeWidth:null,strokeLinecap:null,strokeDashstyle:null,initialize:function(config){OpenLayers.Symbolizer.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Symbolizer.Line"});OpenLayers.Symbolizer.Point=OpenLayers.Class(OpenLayers.Symbolizer,{strokeColor:null,strokeOpacity:null,strokeWidth:null,strokeLinecap:null,strokeDashstyle:null,fillColor:null,fillOpacity:null,pointRadius:null,externalGraphic:null,graphicWidth:null,graphicHeight:null,graphicOpacity:null,graphicXOffset:null,graphicYOffset:null,rotation:null,graphicName:null,initialize:function(config){OpenLayers.Symbolizer.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Symbolizer.Point"});OpenLayers.Symbolizer.Polygon=OpenLayers.Class(OpenLayers.Symbolizer,{strokeColor:null,strokeOpacity:null,strokeWidth:null,strokeLinecap:null,strokeDashstyle:null,fillColor:null,fillOpacity:null,initialize:function(config){OpenLayers.Symbolizer.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Symbolizer.Polygon"});OpenLayers.Symbolizer.Raster=OpenLayers.Class(OpenLayers.Symbolizer,{initialize:function(config){OpenLayers.Symbolizer.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Symbolizer.Raster"});OpenLayers.Symbolizer.Text=OpenLayers.Class(OpenLayers.Symbolizer,{label:null,fontFamily:null,fontSize:null,fontWeight:null,fontStyle:null,initialize:function(config){OpenLayers.Symbolizer.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Symbolizer.Text"});OpenLayers.Tween=OpenLayers.Class({INTERVAL:10,easing:null,begin:null,finish:null,duration:null,callbacks:null,time:null,interval:null,playing:false,initialize:function(easing){this.easing=(easing)?easing:OpenLayers.Easing.Expo.easeOut;},start:function(begin,finish,duration,options){this.playing=true;this.begin=begin;this.finish=finish;this.duration=duration;this.callbacks=options.callbacks;this.time=0;if(this.interval){window.clearInterval(this.interval);this.interval=null;}
+if(this.callbacks&&this.callbacks.start){this.callbacks.start.call(this,this.begin);}
+this.interval=window.setInterval(OpenLayers.Function.bind(this.play,this),this.INTERVAL);},stop:function(){if(!this.playing){return;}
+if(this.callbacks&&this.callbacks.done){this.callbacks.done.call(this,this.finish);}
+window.clearInterval(this.interval);this.interval=null;this.playing=false;},play:function(){var value={};for(var i in this.begin){var b=this.begin[i];var f=this.finish[i];if(b==null||f==null||isNaN(b)||isNaN(f)){OpenLayers.Console.error('invalid value for Tween');}
+var c=f-b;value[i]=this.easing.apply(this,[this.time,b,c,this.duration]);}
+this.time++;if(this.callbacks&&this.callbacks.eachStep){this.callbacks.eachStep.call(this,value);}
+if(this.time>this.duration){this.stop();}},CLASS_NAME:"OpenLayers.Tween"});OpenLayers.Easing={CLASS_NAME:"OpenLayers.Easing"};OpenLayers.Easing.Linear={easeIn:function(t,b,c,d){return c*t/d+b;},easeOut:function(t,b,c,d){return c*t/d+b;},easeInOut:function(t,b,c,d){return c*t/d+b;},CLASS_NAME:"OpenLayers.Easing.Linear"};OpenLayers.Easing.Expo={easeIn:function(t,b,c,d){return(t==0)?b:c*Math.pow(2,10*(t/d-1))+b;},easeOut:function(t,b,c,d){return(t==d)?b+c:c*(-Math.pow(2,-10*t/d)+1)+b;},easeInOut:function(t,b,c,d){if(t==0)return b;if(t==d)return b+c;if((t/=d/2)<1)return c/2*Math.pow(2,10*(t-1))+b;return c/2*(-Math.pow(2,-10*--t)+2)+b;},CLASS_NAME:"OpenLayers.Easing.Expo"};OpenLayers.Easing.Quad={easeIn:function(t,b,c,d){return c*(t/=d)*t+b;},easeOut:function(t,b,c,d){return-c*(t/=d)*(t-2)+b;},easeInOut:function(t,b,c,d){if((t/=d/2)<1)return c/2*t*t+b;return-c/2*((--t)*(t-2)-1)+b;},CLASS_NAME:"OpenLayers.Easing.Quad"};OpenLayers.Control.ArgParser=OpenLayers.Class(OpenLayers.Control,{center:null,zoom:null,layers:null,displayProjection:null,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,arguments);},setMap:function(map){OpenLayers.Control.prototype.setMap.apply(this,arguments);for(var i=0,len=this.map.controls.length;i<len;i++){var control=this.map.controls[i];if((control!=this)&&(control.CLASS_NAME=="OpenLayers.Control.ArgParser")){if(control.displayProjection!=this.displayProjection){this.displayProjection=control.displayProjection;}
+break;}}
+if(i==this.map.controls.length){var args=OpenLayers.Util.getParameters();if(args.layers){this.layers=args.layers;this.map.events.register('addlayer',this,this.configureLayers);this.configureLayers();}
+if(args.lat&&args.lon){this.center=new OpenLayers.LonLat(parseFloat(args.lon),parseFloat(args.lat));if(args.zoom){this.zoom=parseInt(args.zoom);}
+this.map.events.register('changebaselayer',this,this.setCenter);this.setCenter();}}},setCenter:function(){if(this.map.baseLayer){this.map.events.unregister('changebaselayer',this,this.setCenter);if(this.displayProjection){this.center.transform(this.displayProjection,this.map.getProjectionObject());}
+this.map.setCenter(this.center,this.zoom);}},configureLayers:function(){if(this.layers.length==this.map.layers.length){this.map.events.unregister('addlayer',this,this.configureLayers);for(var i=0,len=this.layers.length;i<len;i++){var layer=this.map.layers[i];var c=this.layers.charAt(i);if(c=="B"){this.map.setBaseLayer(layer);}else if((c=="T")||(c=="F")){layer.setVisibility(c=="T");}}}},CLASS_NAME:"OpenLayers.Control.ArgParser"});OpenLayers.Control.Attribution=OpenLayers.Class(OpenLayers.Control,{separator:", ",initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){this.map.events.un({"removelayer":this.updateAttribution,"addlayer":this.updateAttribution,"changelayer":this.updateAttribution,"changebaselayer":this.updateAttribution,scope:this});OpenLayers.Control.prototype.destroy.apply(this,arguments);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);this.map.events.on({'changebaselayer':this.updateAttribution,'changelayer':this.updateAttribution,'addlayer':this.updateAttribution,'removelayer':this.updateAttribution,scope:this});this.updateAttribution();return this.div;},updateAttribution:function(){var attributions=[];if(this.map&&this.map.layers){for(var i=0,len=this.map.layers.length;i<len;i++){var layer=this.map.layers[i];if(layer.attribution&&layer.getVisibility()){if(OpenLayers.Util.indexOf(attributions,layer.attribution)===-1){attributions.push(layer.attribution);}}}
+this.div.innerHTML=attributions.join(this.separator);}},CLASS_NAME:"OpenLayers.Control.Attribution"});OpenLayers.Control.Button=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_BUTTON,trigger:function(){},CLASS_NAME:"OpenLayers.Control.Button"});OpenLayers.Control.Graticule=OpenLayers.Class(OpenLayers.Control,{autoActivate:true,intervals:[45,30,20,10,5,2,1,0.5,0.2,0.1,0.05,0.01,0.005,0.002,0.001],displayInLayerSwitcher:true,visible:true,numPoints:50,targetSize:200,layerName:null,labelled:true,labelFormat:'dm',lineSymbolizer:{strokeColor:"#333",strokeWidth:1,strokeOpacity:0.5},labelSymbolizer:{},gratLayer:null,initialize:function(options){options=options||{};options.layerName=options.layerName||OpenLayers.i18n("graticule");OpenLayers.Control.prototype.initialize.apply(this,[options]);this.labelSymbolizer.stroke=false;this.labelSymbolizer.fill=false;this.labelSymbolizer.label="${label}";this.labelSymbolizer.labelAlign="${labelAlign}";this.labelSymbolizer.labelXOffset="${xOffset}";this.labelSymbolizer.labelYOffset="${yOffset}";},destroy:function(){this.deactivate();OpenLayers.Control.prototype.destroy.apply(this,arguments);if(this.gratLayer){this.gratLayer.destroy();this.gratLayer=null;}},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!this.gratLayer){var gratStyle=new OpenLayers.Style({},{rules:[new OpenLayers.Rule({'symbolizer':{"Point":this.labelSymbolizer,"Line":this.lineSymbolizer}})]});this.gratLayer=new OpenLayers.Layer.Vector(this.layerName,{styleMap:new OpenLayers.StyleMap({'default':gratStyle}),visibility:this.visible,displayInLayerSwitcher:this.displayInLayerSwitcher});}
+return this.div;},activate:function(){if(OpenLayers.Control.prototype.activate.apply(this,arguments)){this.map.addLayer(this.gratLayer);this.map.events.register('moveend',this,this.update);this.update();return true;}else{return false;}},deactivate:function(){if(OpenLayers.Control.prototype.deactivate.apply(this,arguments)){this.map.events.unregister('moveend',this,this.update);this.map.removeLayer(this.gratLayer);return true;}else{return false;}},update:function(){var mapBounds=this.map.getExtent();if(!mapBounds){return;}
+this.gratLayer.destroyFeatures();var llProj=new OpenLayers.Projection("EPSG:4326");var mapProj=this.map.getProjectionObject();var mapRes=this.map.getResolution();if(mapProj.proj&&mapProj.proj.projName=="longlat"){this.numPoints=1;}
+var mapCenter=this.map.getCenter();var mapCenterLL=new OpenLayers.Pixel(mapCenter.lon,mapCenter.lat);OpenLayers.Projection.transform(mapCenterLL,mapProj,llProj);var testSq=this.targetSize*mapRes;testSq*=testSq;var llInterval;for(var i=0;i<this.intervals.length;++i){llInterval=this.intervals[i];var delta=llInterval/2;var p1=mapCenterLL.offset(new OpenLayers.Pixel(-delta,-delta));var p2=mapCenterLL.offset(new OpenLayers.Pixel(delta,delta));OpenLayers.Projection.transform(p1,llProj,mapProj);OpenLayers.Projection.transform(p2,llProj,mapProj);var distSq=(p1.x-p2.x)*(p1.x-p2.x)+(p1.y-p2.y)*(p1.y-p2.y);if(distSq<=testSq){break;}}
+mapCenterLL.x=Math.floor(mapCenterLL.x/llInterval)*llInterval;mapCenterLL.y=Math.floor(mapCenterLL.y/llInterval)*llInterval;var iter=0;var centerLonPoints=[mapCenterLL.clone()];var newPoint=mapCenterLL.clone();var mapXY;do{newPoint=newPoint.offset(new OpenLayers.Pixel(0,llInterval));mapXY=OpenLayers.Projection.transform(newPoint.clone(),llProj,mapProj);centerLonPoints.unshift(newPoint);}while(mapBounds.containsPixel(mapXY)&&++iter<1000);newPoint=mapCenterLL.clone();do{newPoint=newPoint.offset(new OpenLayers.Pixel(0,-llInterval));mapXY=OpenLayers.Projection.transform(newPoint.clone(),llProj,mapProj);centerLonPoints.push(newPoint);}while(mapBounds.containsPixel(mapXY)&&++iter<1000);iter=0;var centerLatPoints=[mapCenterLL.clone()];newPoint=mapCenterLL.clone();do{newPoint=newPoint.offset(new OpenLayers.Pixel(-llInterval,0));mapXY=OpenLayers.Projection.transform(newPoint.clone(),llProj,mapProj);centerLatPoints.unshift(newPoint);}while(mapBounds.containsPixel(mapXY)&&++iter<1000);newPoint=mapCenterLL.clone();do{newPoint=newPoint.offset(new OpenLayers.Pixel(llInterval,0));mapXY=OpenLayers.Projection.transform(newPoint.clone(),llProj,mapProj);centerLatPoints.push(newPoint);}while(mapBounds.containsPixel(mapXY)&&++iter<1000);var lines=[];for(var i=0;i<centerLatPoints.length;++i){var lon=centerLatPoints[i].x;var pointList=[];var labelPoint=null;var latEnd=Math.min(centerLonPoints[0].y,90);var latStart=Math.max(centerLonPoints[centerLonPoints.length-1].y,-90);var latDelta=(latEnd-latStart)/this.numPoints;var lat=latStart;for(var j=0;j<=this.numPoints;++j){var gridPoint=new OpenLayers.Geometry.Point(lon,lat);gridPoint.transform(llProj,mapProj);pointList.push(gridPoint);lat+=latDelta;if(gridPoint.y>=mapBounds.bottom&&!labelPoint){labelPoint=gridPoint;}}
+if(this.labelled){var labelPos=new OpenLayers.Geometry.Point(labelPoint.x,mapBounds.bottom);var labelAttrs={value:lon,label:this.labelled?OpenLayers.Util.getFormattedLonLat(lon,"lon",this.labelFormat):"",labelAlign:"cb",xOffset:0,yOffset:2};this.gratLayer.addFeatures(new OpenLayers.Feature.Vector(labelPos,labelAttrs));}
+var geom=new OpenLayers.Geometry.LineString(pointList);lines.push(new OpenLayers.Feature.Vector(geom));}
+for(var j=0;j<centerLonPoints.length;++j){lat=centerLonPoints[j].y;if(lat<-90||lat>90){continue;}
+var pointList=[];var lonStart=centerLatPoints[0].x;var lonEnd=centerLatPoints[centerLatPoints.length-1].x;var lonDelta=(lonEnd-lonStart)/this.numPoints;var lon=lonStart;var labelPoint=null;for(var i=0;i<=this.numPoints;++i){var gridPoint=new OpenLayers.Geometry.Point(lon,lat);gridPoint.transform(llProj,mapProj);pointList.push(gridPoint);lon+=lonDelta;if(gridPoint.x<mapBounds.right){labelPoint=gridPoint;}}
+if(this.labelled){var labelPos=new OpenLayers.Geometry.Point(mapBounds.right,labelPoint.y);var labelAttrs={value:lat,label:this.labelled?OpenLayers.Util.getFormattedLonLat(lat,"lat",this.labelFormat):"",labelAlign:"rb",xOffset:-2,yOffset:2};this.gratLayer.addFeatures(new OpenLayers.Feature.Vector(labelPos,labelAttrs));}
+var geom=new OpenLayers.Geometry.LineString(pointList);lines.push(new OpenLayers.Feature.Vector(geom));}
+this.gratLayer.addFeatures(lines);},CLASS_NAME:"OpenLayers.Control.Graticule"});OpenLayers.Control.LayerSwitcher=OpenLayers.Class(OpenLayers.Control,{roundedCorner:true,roundedCornerColor:"darkblue",layerStates:null,layersDiv:null,baseLayersDiv:null,baseLayers:null,dataLbl:null,dataLayersDiv:null,dataLayers:null,minimizeDiv:null,maximizeDiv:null,ascending:true,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,arguments);this.layerStates=[];},destroy:function(){OpenLayers.Event.stopObservingElement(this.div);OpenLayers.Event.stopObservingElement(this.minimizeDiv);OpenLayers.Event.stopObservingElement(this.maximizeDiv);this.clearLayersArray("base");this.clearLayersArray("data");this.map.events.un({"addlayer":this.redraw,"changelayer":this.redraw,"removelayer":this.redraw,"changebaselayer":this.redraw,scope:this});OpenLayers.Control.prototype.destroy.apply(this,arguments);},setMap:function(map){OpenLayers.Control.prototype.setMap.apply(this,arguments);this.map.events.on({"addlayer":this.redraw,"changelayer":this.redraw,"removelayer":this.redraw,"changebaselayer":this.redraw,scope:this});},draw:function(){OpenLayers.Control.prototype.draw.apply(this);this.loadContents();if(!this.outsideViewport){this.minimizeControl();}
+this.redraw();return this.div;},clearLayersArray:function(layersType){var layers=this[layersType+"Layers"];if(layers){for(var i=0,len=layers.length;i<len;i++){var layer=layers[i];OpenLayers.Event.stopObservingElement(layer.inputElem);OpenLayers.Event.stopObservingElement(layer.labelSpan);}}
+this[layersType+"LayersDiv"].innerHTML="";this[layersType+"Layers"]=[];},checkRedraw:function(){var redraw=false;if(!this.layerStates.length||(this.map.layers.length!=this.layerStates.length)){redraw=true;}else{for(var i=0,len=this.layerStates.length;i<len;i++){var layerState=this.layerStates[i];var layer=this.map.layers[i];if((layerState.name!=layer.name)||(layerState.inRange!=layer.inRange)||(layerState.id!=layer.id)||(layerState.visibility!=layer.visibility)){redraw=true;break;}}}
+return redraw;},redraw:function(){if(!this.checkRedraw()){return this.div;}
+this.clearLayersArray("base");this.clearLayersArray("data");var containsOverlays=false;var containsBaseLayers=false;var len=this.map.layers.length;this.layerStates=new Array(len);for(var i=0;i<len;i++){var layer=this.map.layers[i];this.layerStates[i]={'name':layer.name,'visibility':layer.visibility,'inRange':layer.inRange,'id':layer.id};}
+var layers=this.map.layers.slice();if(!this.ascending){layers.reverse();}
+for(var i=0,len=layers.length;i<len;i++){var layer=layers[i];var baseLayer=layer.isBaseLayer;if(layer.displayInLayerSwitcher){if(baseLayer){containsBaseLayers=true;}else{containsOverlays=true;}
+var checked=(baseLayer)?(layer==this.map.baseLayer):layer.getVisibility();var inputElem=document.createElement("input");inputElem.id=this.id+"_input_"+layer.name;inputElem.name=(baseLayer)?this.id+"_baseLayers":layer.name;inputElem.type=(baseLayer)?"radio":"checkbox";inputElem.value=layer.name;inputElem.checked=checked;inputElem.defaultChecked=checked;if(!baseLayer&&!layer.inRange){inputElem.disabled=true;}
+var context={'inputElem':inputElem,'layer':layer,'layerSwitcher':this};OpenLayers.Event.observe(inputElem,"mouseup",OpenLayers.Function.bindAsEventListener(this.onInputClick,context));var labelSpan=document.createElement("span");OpenLayers.Element.addClass(labelSpan,"labelSpan")
+if(!baseLayer&&!layer.inRange){labelSpan.style.color="gray";}
+labelSpan.innerHTML=layer.name;labelSpan.style.verticalAlign=(baseLayer)?"bottom":"baseline";OpenLayers.Event.observe(labelSpan,"click",OpenLayers.Function.bindAsEventListener(this.onInputClick,context));var br=document.createElement("br");var groupArray=(baseLayer)?this.baseLayers:this.dataLayers;groupArray.push({'layer':layer,'inputElem':inputElem,'labelSpan':labelSpan});var groupDiv=(baseLayer)?this.baseLayersDiv:this.dataLayersDiv;groupDiv.appendChild(inputElem);groupDiv.appendChild(labelSpan);groupDiv.appendChild(br);}}
+this.dataLbl.style.display=(containsOverlays)?"":"none";this.baseLbl.style.display=(containsBaseLayers)?"":"none";return this.div;},onInputClick:function(e){if(!this.inputElem.disabled){if(this.inputElem.type=="radio"){this.inputElem.checked=true;this.layer.map.setBaseLayer(this.layer);}else{this.inputElem.checked=!this.inputElem.checked;this.layerSwitcher.updateMap();}}
+OpenLayers.Event.stop(e);},onLayerClick:function(e){this.updateMap();},updateMap:function(){for(var i=0,len=this.baseLayers.length;i<len;i++){var layerEntry=this.baseLayers[i];if(layerEntry.inputElem.checked){this.map.setBaseLayer(layerEntry.layer,false);}}
+for(var i=0,len=this.dataLayers.length;i<len;i++){var layerEntry=this.dataLayers[i];layerEntry.layer.setVisibility(layerEntry.inputElem.checked);}},maximizeControl:function(e){this.div.style.width="";this.div.style.height="";this.showControls(false);if(e!=null){OpenLayers.Event.stop(e);}},minimizeControl:function(e){this.div.style.width="0px";this.div.style.height="0px";this.showControls(true);if(e!=null){OpenLayers.Event.stop(e);}},showControls:function(minimize){this.maximizeDiv.style.display=minimize?"":"none";this.minimizeDiv.style.display=minimize?"none":"";this.layersDiv.style.display=minimize?"none":"";},loadContents:function(){OpenLayers.Event.observe(this.div,"mouseup",OpenLayers.Function.bindAsEventListener(this.mouseUp,this));OpenLayers.Event.observe(this.div,"click",this.ignoreEvent);OpenLayers.Event.observe(this.div,"mousedown",OpenLayers.Function.bindAsEventListener(this.mouseDown,this));OpenLayers.Event.observe(this.div,"dblclick",this.ignoreEvent);this.layersDiv=document.createElement("div");this.layersDiv.id=this.id+"_layersDiv";OpenLayers.Element.addClass(this.layersDiv,"layersDiv");this.baseLbl=document.createElement("div");this.baseLbl.innerHTML=OpenLayers.i18n("baseLayer");OpenLayers.Element.addClass(this.baseLbl,"baseLbl");this.baseLayersDiv=document.createElement("div");OpenLayers.Element.addClass(this.baseLayersDiv,"baseLayersDiv");this.dataLbl=document.createElement("div");this.dataLbl.innerHTML=OpenLayers.i18n("overlays");OpenLayers.Element.addClass(this.dataLbl,"dataLbl");this.dataLayersDiv=document.createElement("div");OpenLayers.Element.addClass(this.dataLayersDiv,"dataLayersDiv");if(this.ascending){this.layersDiv.appendChild(this.baseLbl);this.layersDiv.appendChild(this.baseLayersDiv);this.layersDiv.appendChild(this.dataLbl);this.layersDiv.appendChild(this.dataLayersDiv);}else{this.layersDiv.appendChild(this.dataLbl);this.layersDiv.appendChild(this.dataLayersDiv);this.layersDiv.appendChild(this.baseLbl);this.layersDiv.appendChild(this.baseLayersDiv);}
+this.div.appendChild(this.layersDiv);if(this.roundedCorner){OpenLayers.Rico.Corner.round(this.div,{corners:"tl bl",bgColor:"transparent",color:this.roundedCornerColor,blend:false});OpenLayers.Rico.Corner.changeOpacity(this.layersDiv,0.75);}
+var imgLocation=OpenLayers.Util.getImagesLocation();var sz=new OpenLayers.Size(18,18);var img=imgLocation+'layer-switcher-maximize.png';this.maximizeDiv=OpenLayers.Util.createAlphaImageDiv("OpenLayers_Control_MaximizeDiv",null,sz,img,"absolute");OpenLayers.Element.addClass(this.maximizeDiv,"maximizeDiv");this.maximizeDiv.style.display="none";OpenLayers.Event.observe(this.maximizeDiv,"click",OpenLayers.Function.bindAsEventListener(this.maximizeControl,this));this.div.appendChild(this.maximizeDiv);var img=imgLocation+'layer-switcher-minimize.png';var sz=new OpenLayers.Size(18,18);this.minimizeDiv=OpenLayers.Util.createAlphaImageDiv("OpenLayers_Control_MinimizeDiv",null,sz,img,"absolute");OpenLayers.Element.addClass(this.minimizeDiv,"minimizeDiv");this.minimizeDiv.style.display="none";OpenLayers.Event.observe(this.minimizeDiv,"click",OpenLayers.Function.bindAsEventListener(this.minimizeControl,this));this.div.appendChild(this.minimizeDiv);},ignoreEvent:function(evt){OpenLayers.Event.stop(evt);},mouseDown:function(evt){this.isMouseDown=true;this.ignoreEvent(evt);},mouseUp:function(evt){if(this.isMouseDown){this.isMouseDown=false;this.ignoreEvent(evt);}},CLASS_NAME:"OpenLayers.Control.LayerSwitcher"});OpenLayers.Control.MouseDefaults=OpenLayers.Class(OpenLayers.Control,{performedDrag:false,wheelObserver:null,initialize:function(){OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){if(this.handler){this.handler.destroy();}
+this.handler=null;this.map.events.un({"click":this.defaultClick,"dblclick":this.defaultDblClick,"mousedown":this.defaultMouseDown,"mouseup":this.defaultMouseUp,"mousemove":this.defaultMouseMove,"mouseout":this.defaultMouseOut,scope:this});OpenLayers.Event.stopObserving(window,"DOMMouseScroll",this.wheelObserver);OpenLayers.Event.stopObserving(window,"mousewheel",this.wheelObserver);OpenLayers.Event.stopObserving(document,"mousewheel",this.wheelObserver);this.wheelObserver=null;OpenLayers.Control.prototype.destroy.apply(this,arguments);},draw:function(){this.map.events.on({"click":this.defaultClick,"dblclick":this.defaultDblClick,"mousedown":this.defaultMouseDown,"mouseup":this.defaultMouseUp,"mousemove":this.defaultMouseMove,"mouseout":this.defaultMouseOut,scope:this});this.registerWheelEvents();},registerWheelEvents:function(){this.wheelObserver=OpenLayers.Function.bindAsEventListener(this.onWheelEvent,this);OpenLayers.Event.observe(window,"DOMMouseScroll",this.wheelObserver);OpenLayers.Event.observe(window,"mousewheel",this.wheelObserver);OpenLayers.Event.observe(document,"mousewheel",this.wheelObserver);},defaultClick:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+var notAfterDrag=!this.performedDrag;this.performedDrag=false;return notAfterDrag;},defaultDblClick:function(evt){var newCenter=this.map.getLonLatFromViewPortPx(evt.xy);this.map.setCenter(newCenter,this.map.zoom+1);OpenLayers.Event.stop(evt);return false;},defaultMouseDown:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+this.mouseDragStart=evt.xy.clone();this.performedDrag=false;if(evt.shiftKey){this.map.div.style.cursor="crosshair";this.zoomBox=OpenLayers.Util.createDiv('zoomBox',this.mouseDragStart,null,null,"absolute","2px solid red");this.zoomBox.style.backgroundColor="white";this.zoomBox.style.filter="alpha(opacity=50)";this.zoomBox.style.opacity="0.50";this.zoomBox.style.fontSize="1px";this.zoomBox.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.viewPortDiv.appendChild(this.zoomBox);}
+document.onselectstart=OpenLayers.Function.False;OpenLayers.Event.stop(evt);},defaultMouseMove:function(evt){this.mousePosition=evt.xy.clone();if(this.mouseDragStart!=null){if(this.zoomBox){var deltaX=Math.abs(this.mouseDragStart.x-evt.xy.x);var deltaY=Math.abs(this.mouseDragStart.y-evt.xy.y);this.zoomBox.style.width=Math.max(1,deltaX)+"px";this.zoomBox.style.height=Math.max(1,deltaY)+"px";if(evt.xy.x<this.mouseDragStart.x){this.zoomBox.style.left=evt.xy.x+"px";}
+if(evt.xy.y<this.mouseDragStart.y){this.zoomBox.style.top=evt.xy.y+"px";}}else{var deltaX=this.mouseDragStart.x-evt.xy.x;var deltaY=this.mouseDragStart.y-evt.xy.y;var size=this.map.getSize();var newXY=new OpenLayers.Pixel(size.w/2+deltaX,size.h/2+deltaY);var newCenter=this.map.getLonLatFromViewPortPx(newXY);this.map.setCenter(newCenter,null,true);this.mouseDragStart=evt.xy.clone();this.map.div.style.cursor="move";}
+this.performedDrag=true;}},defaultMouseUp:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+if(this.zoomBox){this.zoomBoxEnd(evt);}else{if(this.performedDrag){this.map.setCenter(this.map.center);}}
+document.onselectstart=null;this.mouseDragStart=null;this.map.div.style.cursor="";},defaultMouseOut:function(evt){if(this.mouseDragStart!=null&&OpenLayers.Util.mouseLeft(evt,this.map.div)){if(this.zoomBox){this.removeZoomBox();}
+this.mouseDragStart=null;}},defaultWheelUp:function(evt){if(this.map.getZoom()<=this.map.getNumZoomLevels()){this.map.setCenter(this.map.getLonLatFromPixel(evt.xy),this.map.getZoom()+1);}},defaultWheelDown:function(evt){if(this.map.getZoom()>0){this.map.setCenter(this.map.getLonLatFromPixel(evt.xy),this.map.getZoom()-1);}},zoomBoxEnd:function(evt){if(this.mouseDragStart!=null){if(Math.abs(this.mouseDragStart.x-evt.xy.x)>5||Math.abs(this.mouseDragStart.y-evt.xy.y)>5){var start=this.map.getLonLatFromViewPortPx(this.mouseDragStart);var end=this.map.getLonLatFromViewPortPx(evt.xy);var top=Math.max(start.lat,end.lat);var bottom=Math.min(start.lat,end.lat);var left=Math.min(start.lon,end.lon);var right=Math.max(start.lon,end.lon);var bounds=new OpenLayers.Bounds(left,bottom,right,top);this.map.zoomToExtent(bounds);}else{var end=this.map.getLonLatFromViewPortPx(evt.xy);this.map.setCenter(new OpenLayers.LonLat((end.lon),(end.lat)),this.map.getZoom()+1);}
+this.removeZoomBox();}},removeZoomBox:function(){this.map.viewPortDiv.removeChild(this.zoomBox);this.zoomBox=null;},onWheelEvent:function(e){var inMap=false;var elem=OpenLayers.Event.element(e);while(elem!=null){if(this.map&&elem==this.map.div){inMap=true;break;}
+elem=elem.parentNode;}
+if(inMap){var delta=0;if(!e){e=window.event;}
+if(e.wheelDelta){delta=e.wheelDelta/120;if(window.opera&&window.opera.version()<9.2){delta=-delta;}}else if(e.detail){delta=-e.detail/3;}
+if(delta){e.xy=this.mousePosition;if(delta<0){this.defaultWheelDown(e);}else{this.defaultWheelUp(e);}}
+OpenLayers.Event.stop(e);}},CLASS_NAME:"OpenLayers.Control.MouseDefaults"});OpenLayers.Control.MousePosition=OpenLayers.Class(OpenLayers.Control,{autoActivate:true,element:null,prefix:'',separator:', ',suffix:'',numDigits:5,granularity:10,emptyString:null,lastXy:null,displayProjection:null,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){this.deactivate();OpenLayers.Control.prototype.destroy.apply(this,arguments);},activate:function(){if(OpenLayers.Control.prototype.activate.apply(this,arguments)){this.map.events.register('mousemove',this,this.redraw);this.map.events.register('mouseout',this,this.reset);this.redraw();return true;}else{return false;}},deactivate:function(){if(OpenLayers.Control.prototype.deactivate.apply(this,arguments)){this.map.events.unregister('mousemove',this,this.redraw);this.map.events.unregister('mouseout',this,this.reset);this.element.innerHTML="";return true;}else{return false;}},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!this.element){this.div.left="";this.div.top="";this.element=this.div;}
+return this.div;},redraw:function(evt){var lonLat;if(evt==null){this.reset();return;}else{if(this.lastXy==null||Math.abs(evt.xy.x-this.lastXy.x)>this.granularity||Math.abs(evt.xy.y-this.lastXy.y)>this.granularity)
+{this.lastXy=evt.xy;return;}
+lonLat=this.map.getLonLatFromPixel(evt.xy);if(!lonLat){return;}
+if(this.displayProjection){lonLat.transform(this.map.getProjectionObject(),this.displayProjection);}
+this.lastXy=evt.xy;}
+var newHtml=this.formatOutput(lonLat);if(newHtml!=this.element.innerHTML){this.element.innerHTML=newHtml;}},reset:function(evt){if(this.emptyString!=null){this.element.innerHTML=this.emptyString;}},formatOutput:function(lonLat){var digits=parseInt(this.numDigits);var newHtml=this.prefix+
+lonLat.lon.toFixed(digits)+
+this.separator+
+lonLat.lat.toFixed(digits)+
+this.suffix;return newHtml;},CLASS_NAME:"OpenLayers.Control.MousePosition"});OpenLayers.Control.Pan=OpenLayers.Class(OpenLayers.Control,{slideFactor:50,direction:null,type:OpenLayers.Control.TYPE_BUTTON,initialize:function(direction,options){this.direction=direction;this.CLASS_NAME+=this.direction;OpenLayers.Control.prototype.initialize.apply(this,[options]);},trigger:function(){switch(this.direction){case OpenLayers.Control.Pan.NORTH:this.map.pan(0,-this.slideFactor);break;case OpenLayers.Control.Pan.SOUTH:this.map.pan(0,this.slideFactor);break;case OpenLayers.Control.Pan.WEST:this.map.pan(-this.slideFactor,0);break;case OpenLayers.Control.Pan.EAST:this.map.pan(this.slideFactor,0);break;}},CLASS_NAME:"OpenLayers.Control.Pan"});OpenLayers.Control.Pan.NORTH="North";OpenLayers.Control.Pan.SOUTH="South";OpenLayers.Control.Pan.EAST="East";OpenLayers.Control.Pan.WEST="West";OpenLayers.Control.PanZoom=OpenLayers.Class(OpenLayers.Control,{slideFactor:50,slideRatio:null,buttons:null,position:null,initialize:function(options){this.position=new OpenLayers.Pixel(OpenLayers.Control.PanZoom.X,OpenLayers.Control.PanZoom.Y);OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){OpenLayers.Control.prototype.destroy.apply(this,arguments);this.removeButtons();this.buttons=null;this.position=null;},draw:function(px){OpenLayers.Control.prototype.draw.apply(this,arguments);px=this.position;this.buttons=[];var sz=new OpenLayers.Size(18,18);var centered=new OpenLayers.Pixel(px.x+sz.w/2,px.y);this._addButton("panup","north-mini.png",centered,sz);px.y=centered.y+sz.h;this._addButton("panleft","west-mini.png",px,sz);this._addButton("panright","east-mini.png",px.add(sz.w,0),sz);this._addButton("pandown","south-mini.png",centered.add(0,sz.h*2),sz);this._addButton("zoomin","zoom-plus-mini.png",centered.add(0,sz.h*3+5),sz);this._addButton("zoomworld","zoom-world-mini.png",centered.add(0,sz.h*4+5),sz);this._addButton("zoomout","zoom-minus-mini.png",centered.add(0,sz.h*5+5),sz);return this.div;},_addButton:function(id,img,xy,sz){var imgLocation=OpenLayers.Util.getImagesLocation()+img;var btn=OpenLayers.Util.createAlphaImageDiv(this.id+"_"+id,xy,sz,imgLocation,"absolute");this.div.appendChild(btn);OpenLayers.Event.observe(btn,"mousedown",OpenLayers.Function.bindAsEventListener(this.buttonDown,btn));OpenLayers.Event.observe(btn,"dblclick",OpenLayers.Function.bindAsEventListener(this.doubleClick,btn));OpenLayers.Event.observe(btn,"click",OpenLayers.Function.bindAsEventListener(this.doubleClick,btn));btn.action=id;btn.map=this.map;if(!this.slideRatio){var slideFactorPixels=this.slideFactor;var getSlideFactor=function(){return slideFactorPixels;};}else{var slideRatio=this.slideRatio;var getSlideFactor=function(dim){return this.map.getSize()[dim]*slideRatio;};}
+btn.getSlideFactor=getSlideFactor;this.buttons.push(btn);return btn;},_removeButton:function(btn){OpenLayers.Event.stopObservingElement(btn);btn.map=null;btn.getSlideFactor=null;this.div.removeChild(btn);OpenLayers.Util.removeItem(this.buttons,btn);},removeButtons:function(){for(var i=this.buttons.length-1;i>=0;--i){this._removeButton(this.buttons[i]);}},doubleClick:function(evt){OpenLayers.Event.stop(evt);return false;},buttonDown:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+switch(this.action){case"panup":this.map.pan(0,-this.getSlideFactor("h"));break;case"pandown":this.map.pan(0,this.getSlideFactor("h"));break;case"panleft":this.map.pan(-this.getSlideFactor("w"),0);break;case"panright":this.map.pan(this.getSlideFactor("w"),0);break;case"zoomin":this.map.zoomIn();break;case"zoomout":this.map.zoomOut();break;case"zoomworld":this.map.zoomToMaxExtent();break;}
+OpenLayers.Event.stop(evt);},CLASS_NAME:"OpenLayers.Control.PanZoom"});OpenLayers.Control.PanZoom.X=4;OpenLayers.Control.PanZoom.Y=4;OpenLayers.Control.Panel=OpenLayers.Class(OpenLayers.Control,{controls:null,autoActivate:true,defaultControl:null,saveState:false,activeState:null,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,[options]);this.controls=[];this.activeState={};},destroy:function(){OpenLayers.Control.prototype.destroy.apply(this,arguments);for(var i=this.controls.length-1;i>=0;i--){if(this.controls[i].events){this.controls[i].events.un({"activate":this.redraw,"deactivate":this.redraw,scope:this});}
+OpenLayers.Event.stopObservingElement(this.controls[i].panel_div);this.controls[i].panel_div=null;}
+this.activeState=null;},activate:function(){if(OpenLayers.Control.prototype.activate.apply(this,arguments)){var control;for(var i=0,len=this.controls.length;i<len;i++){control=this.controls[i];if(control===this.defaultControl||(this.saveState&&this.activeState[control.id])){control.activate();}}
+if(this.saveState===true){this.defaultControl=null;}
+this.redraw();return true;}else{return false;}},deactivate:function(){if(OpenLayers.Control.prototype.deactivate.apply(this,arguments)){var control;for(var i=0,len=this.controls.length;i<len;i++){control=this.controls[i];this.activeState[control.id]=control.deactivate();}
+return true;}else{return false;}},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);this.addControlsToMap(this.controls);return this.div;},redraw:function(){if(this.div.children.length>0){for(var l=this.div.children.length,i=l-1;i>=0;i--){this.div.removeChild(this.div.children[i]);}}
+this.div.innerHTML="";if(this.active){for(var i=0,len=this.controls.length;i<len;i++){var element=this.controls[i].panel_div;if(this.controls[i].active){element.className=this.controls[i].displayClass+"ItemActive";}else{element.className=this.controls[i].displayClass+"ItemInactive";}
+this.div.appendChild(element);}}},activateControl:function(control){if(!this.active){return false;}
+if(control.type==OpenLayers.Control.TYPE_BUTTON){control.trigger();this.redraw();return;}
+if(control.type==OpenLayers.Control.TYPE_TOGGLE){if(control.active){control.deactivate();}else{control.activate();}
+this.redraw();return;}
+var c;for(var i=0,len=this.controls.length;i<len;i++){c=this.controls[i];if(c!=control&&(c.type===OpenLayers.Control.TYPE_TOOL||c.type==null)){c.deactivate();}}
+control.activate();},addControls:function(controls){if(!(controls instanceof Array)){controls=[controls];}
+this.controls=this.controls.concat(controls);for(var i=0,len=controls.length;i<len;i++){var element=document.createElement("div");controls[i].panel_div=element;if(controls[i].title!=""){controls[i].panel_div.title=controls[i].title;}
+OpenLayers.Event.observe(controls[i].panel_div,"click",OpenLayers.Function.bind(this.onClick,this,controls[i]));OpenLayers.Event.observe(controls[i].panel_div,"dblclick",OpenLayers.Function.bind(this.onDoubleClick,this,controls[i]));OpenLayers.Event.observe(controls[i].panel_div,"mousedown",OpenLayers.Function.bindAsEventListener(OpenLayers.Event.stop));}
+if(this.map){this.addControlsToMap(controls);this.redraw();}},addControlsToMap:function(controls){var control;for(var i=0,len=controls.length;i<len;i++){control=controls[i];if(control.autoActivate===true){control.autoActivate=false;this.map.addControl(control);control.autoActivate=true;}else{this.map.addControl(control);control.deactivate();}
+control.events.on({"activate":this.redraw,"deactivate":this.redraw,scope:this});}},onClick:function(ctrl,evt){OpenLayers.Event.stop(evt?evt:window.event);this.activateControl(ctrl);},onDoubleClick:function(ctrl,evt){OpenLayers.Event.stop(evt?evt:window.event);},getControlsBy:function(property,match){var test=(typeof match.test=="function");var found=OpenLayers.Array.filter(this.controls,function(item){return item[property]==match||(test&&match.test(item[property]));});return found;},getControlsByName:function(match){return this.getControlsBy("name",match);},getControlsByClass:function(match){return this.getControlsBy("CLASS_NAME",match);},CLASS_NAME:"OpenLayers.Control.Panel"});OpenLayers.Control.Scale=OpenLayers.Class(OpenLayers.Control,{element:null,geodesic:false,initialize:function(element,options){OpenLayers.Control.prototype.initialize.apply(this,[options]);this.element=OpenLayers.Util.getElement(element);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!this.element){this.element=document.createElement("div");this.div.appendChild(this.element);}
+this.map.events.register('moveend',this,this.updateScale);this.updateScale();return this.div;},updateScale:function(){var scale;if(this.geodesic===true){var units=this.map.getUnits();if(!units){return;}
+var inches=OpenLayers.INCHES_PER_UNIT;scale=(this.map.getGeodesicPixelSize().w||0.000001)*inches["km"]*OpenLayers.DOTS_PER_INCH;}else{scale=this.map.getScale();}
+if(!scale){return;}
+if(scale>=9500&&scale<=950000){scale=Math.round(scale/1000)+"K";}else if(scale>=950000){scale=Math.round(scale/1000000)+"M";}else{scale=Math.round(scale);}
+this.element.innerHTML=OpenLayers.i18n("scale",{'scaleDenom':scale});},CLASS_NAME:"OpenLayers.Control.Scale"});OpenLayers.Control.ScaleLine=OpenLayers.Class(OpenLayers.Control,{maxWidth:100,topOutUnits:"km",topInUnits:"m",bottomOutUnits:"mi",bottomInUnits:"ft",eTop:null,eBottom:null,geodesic:false,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,[options]);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!this.eTop){this.eTop=document.createElement("div");this.eTop.className=this.displayClass+"Top";var theLen=this.topInUnits.length;this.div.appendChild(this.eTop);if((this.topOutUnits=="")||(this.topInUnits=="")){this.eTop.style.visibility="hidden";}else{this.eTop.style.visibility="visible";}
+this.eBottom=document.createElement("div");this.eBottom.className=this.displayClass+"Bottom";this.div.appendChild(this.eBottom);if((this.bottomOutUnits=="")||(this.bottomInUnits=="")){this.eBottom.style.visibility="hidden";}else{this.eBottom.style.visibility="visible";}}
+this.map.events.register('moveend',this,this.update);this.update();return this.div;},getBarLen:function(maxLen){var digits=parseInt(Math.log(maxLen)/Math.log(10));var pow10=Math.pow(10,digits);var firstChar=parseInt(maxLen/pow10);var barLen;if(firstChar>5){barLen=5;}else if(firstChar>2){barLen=2;}else{barLen=1;}
+return barLen*pow10;},update:function(){var res=this.map.getResolution();if(!res){return;}
+var curMapUnits=this.map.getUnits();var inches=OpenLayers.INCHES_PER_UNIT;var maxSizeData=this.maxWidth*res*inches[curMapUnits];var geodesicRatio=1;if(this.geodesic===true){var maxSizeGeodesic=(this.map.getGeodesicPixelSize().w||0.000001)*this.maxWidth;var maxSizeKilometers=maxSizeData/inches["km"];geodesicRatio=maxSizeGeodesic/maxSizeKilometers;maxSizeData*=geodesicRatio;}
+var topUnits;var bottomUnits;if(maxSizeData>100000){topUnits=this.topOutUnits;bottomUnits=this.bottomOutUnits;}else{topUnits=this.topInUnits;bottomUnits=this.bottomInUnits;}
+var topMax=maxSizeData/inches[topUnits];var bottomMax=maxSizeData/inches[bottomUnits];var topRounded=this.getBarLen(topMax);var bottomRounded=this.getBarLen(bottomMax);topMax=topRounded/inches[curMapUnits]*inches[topUnits];bottomMax=bottomRounded/inches[curMapUnits]*inches[bottomUnits];var topPx=topMax/res/geodesicRatio;var bottomPx=bottomMax/res/geodesicRatio;if(this.eBottom.style.visibility=="visible"){this.eBottom.style.width=Math.round(bottomPx)+"px";this.eBottom.innerHTML=bottomRounded+" "+bottomUnits;}
+if(this.eTop.style.visibility=="visible"){this.eTop.style.width=Math.round(topPx)+"px";this.eTop.innerHTML=topRounded+" "+topUnits;}},CLASS_NAME:"OpenLayers.Control.ScaleLine"});OpenLayers.Control.ZoomIn=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_BUTTON,trigger:function(){this.map.zoomIn();},CLASS_NAME:"OpenLayers.Control.ZoomIn"});OpenLayers.Control.ZoomOut=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_BUTTON,trigger:function(){this.map.zoomOut();},CLASS_NAME:"OpenLayers.Control.ZoomOut"});OpenLayers.Control.ZoomToMaxExtent=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_BUTTON,trigger:function(){if(this.map){this.map.zoomToMaxExtent();}},CLASS_NAME:"OpenLayers.Control.ZoomToMaxExtent"});OpenLayers.Event={observers:false,KEY_BACKSPACE:8,KEY_TAB:9,KEY_RETURN:13,KEY_ESC:27,KEY_LEFT:37,KEY_UP:38,KEY_RIGHT:39,KEY_DOWN:40,KEY_DELETE:46,element:function(event){return event.target||event.srcElement;},isLeftClick:function(event){return(((event.which)&&(event.which==1))||((event.button)&&(event.button==1)));},isRightClick:function(event){return(((event.which)&&(event.which==3))||((event.button)&&(event.button==2)));},stop:function(event,allowDefault){if(!allowDefault){if(event.preventDefault){event.preventDefault();}else{event.returnValue=false;}}
+if(event.stopPropagation){event.stopPropagation();}else{event.cancelBubble=true;}},findElement:function(event,tagName){var element=OpenLayers.Event.element(event);while(element.parentNode&&(!element.tagName||(element.tagName.toUpperCase()!=tagName.toUpperCase()))){element=element.parentNode;}
+return element;},observe:function(elementParam,name,observer,useCapture){var element=OpenLayers.Util.getElement(elementParam);useCapture=useCapture||false;if(name=='keypress'&&(navigator.appVersion.match(/Konqueror|Safari|KHTML/)||element.attachEvent)){name='keydown';}
+if(!this.observers){this.observers={};}
+if(!element._eventCacheID){var idPrefix="eventCacheID_";if(element.id){idPrefix=element.id+"_"+idPrefix;}
+element._eventCacheID=OpenLayers.Util.createUniqueID(idPrefix);}
+var cacheID=element._eventCacheID;if(!this.observers[cacheID]){this.observers[cacheID]=[];}
+this.observers[cacheID].push({'element':element,'name':name,'observer':observer,'useCapture':useCapture});if(element.addEventListener){element.addEventListener(name,observer,useCapture);}else if(element.attachEvent){element.attachEvent('on'+name,observer);}},stopObservingElement:function(elementParam){var element=OpenLayers.Util.getElement(elementParam);var cacheID=element._eventCacheID;this._removeElementObservers(OpenLayers.Event.observers[cacheID]);},_removeElementObservers:function(elementObservers){if(elementObservers){for(var i=elementObservers.length-1;i>=0;i--){var entry=elementObservers[i];var args=new Array(entry.element,entry.name,entry.observer,entry.useCapture);var removed=OpenLayers.Event.stopObserving.apply(this,args);}}},stopObserving:function(elementParam,name,observer,useCapture){useCapture=useCapture||false;var element=OpenLayers.Util.getElement(elementParam);var cacheID=element._eventCacheID;if(name=='keypress'){if(navigator.appVersion.match(/Konqueror|Safari|KHTML/)||element.detachEvent){name='keydown';}}
+var foundEntry=false;var elementObservers=OpenLayers.Event.observers[cacheID];if(elementObservers){var i=0;while(!foundEntry&&i<elementObservers.length){var cacheEntry=elementObservers[i];if((cacheEntry.name==name)&&(cacheEntry.observer==observer)&&(cacheEntry.useCapture==useCapture)){elementObservers.splice(i,1);if(elementObservers.length==0){delete OpenLayers.Event.observers[cacheID];}
+foundEntry=true;break;}
+i++;}}
+if(foundEntry){if(element.removeEventListener){element.removeEventListener(name,observer,useCapture);}else if(element&&element.detachEvent){element.detachEvent('on'+name,observer);}}
+return foundEntry;},unloadCache:function(){if(OpenLayers.Event&&OpenLayers.Event.observers){for(var cacheID in OpenLayers.Event.observers){var elementObservers=OpenLayers.Event.observers[cacheID];OpenLayers.Event._removeElementObservers.apply(this,[elementObservers]);}
+OpenLayers.Event.observers=false;}},CLASS_NAME:"OpenLayers.Event"};OpenLayers.Event.observe(window,'unload',OpenLayers.Event.unloadCache,false);if(window.Event){OpenLayers.Util.applyDefaults(window.Event,OpenLayers.Event);}else{var Event=OpenLayers.Event;}
+OpenLayers.Events=OpenLayers.Class({BROWSER_EVENTS:["mouseover","mouseout","mousedown","mouseup","mousemove","click","dblclick","rightclick","dblrightclick","resize","focus","blur"],listeners:null,object:null,element:null,eventTypes:null,eventHandler:null,fallThrough:null,includeXY:false,clearMouseListener:null,initialize:function(object,element,eventTypes,fallThrough,options){OpenLayers.Util.extend(this,options);this.object=object;this.fallThrough=fallThrough;this.listeners={};this.eventHandler=OpenLayers.Function.bindAsEventListener(this.handleBrowserEvent,this);this.clearMouseListener=OpenLayers.Function.bind(this.clearMouseCache,this);this.eventTypes=[];if(eventTypes!=null){for(var i=0,len=eventTypes.length;i<len;i++){this.addEventType(eventTypes[i]);}}
+if(element!=null){this.attachToElement(element);}},destroy:function(){if(this.element){OpenLayers.Event.stopObservingElement(this.element);if(this.element.hasScrollEvent){OpenLayers.Event.stopObserving(window,"scroll",this.clearMouseListener);}}
+this.element=null;this.listeners=null;this.object=null;this.eventTypes=null;this.fallThrough=null;this.eventHandler=null;},addEventType:function(eventName){if(!this.listeners[eventName]){this.eventTypes.push(eventName);this.listeners[eventName]=[];}},attachToElement:function(element){if(this.element){OpenLayers.Event.stopObservingElement(this.element);}
+this.element=element;for(var i=0,len=this.BROWSER_EVENTS.length;i<len;i++){var eventType=this.BROWSER_EVENTS[i];this.addEventType(eventType);OpenLayers.Event.observe(element,eventType,this.eventHandler);}
+OpenLayers.Event.observe(element,"dragstart",OpenLayers.Event.stop);},on:function(object){for(var type in object){if(type!="scope"){this.register(type,object.scope,object[type]);}}},register:function(type,obj,func){if((func!=null)&&(OpenLayers.Util.indexOf(this.eventTypes,type)!=-1)){if(obj==null){obj=this.object;}
+var listeners=this.listeners[type];listeners.push({obj:obj,func:func});}},registerPriority:function(type,obj,func){if(func!=null){if(obj==null){obj=this.object;}
+var listeners=this.listeners[type];if(listeners!=null){listeners.unshift({obj:obj,func:func});}}},un:function(object){for(var type in object){if(type!="scope"){this.unregister(type,object.scope,object[type]);}}},unregister:function(type,obj,func){if(obj==null){obj=this.object;}
+var listeners=this.listeners[type];if(listeners!=null){for(var i=0,len=listeners.length;i<len;i++){if(listeners[i].obj==obj&&listeners[i].func==func){listeners.splice(i,1);break;}}}},remove:function(type){if(this.listeners[type]!=null){this.listeners[type]=[];}},triggerEvent:function(type,evt){var listeners=this.listeners[type];if(!listeners||listeners.length==0){return;}
+if(evt==null){evt={};}
+evt.object=this.object;evt.element=this.element;if(!evt.type){evt.type=type;}
+var listeners=listeners.slice(),continueChain;for(var i=0,len=listeners.length;i<len;i++){var callback=listeners[i];continueChain=callback.func.apply(callback.obj,[evt]);if((continueChain!=undefined)&&(continueChain==false)){break;}}
+if(!this.fallThrough){OpenLayers.Event.stop(evt,true);}
+return continueChain;},handleBrowserEvent:function(evt){if(this.includeXY){evt.xy=this.getMousePosition(evt);}
+this.triggerEvent(evt.type,evt);},clearMouseCache:function(){this.element.scrolls=null;this.element.lefttop=null;this.element.offsets=null;},getMousePosition:function(evt){if(!this.includeXY){this.clearMouseCache();}else if(!this.element.hasScrollEvent){OpenLayers.Event.observe(window,"scroll",this.clearMouseListener);this.element.hasScrollEvent=true;}
+if(!this.element.scrolls){this.element.scrolls=[(document.documentElement.scrollLeft||document.body.scrollLeft),(document.documentElement.scrollTop||document.body.scrollTop)];}
+if(!this.element.lefttop){this.element.lefttop=[(document.documentElement.clientLeft||0),(document.documentElement.clientTop||0)];}
+if(!this.element.offsets){this.element.offsets=OpenLayers.Util.pagePosition(this.element);this.element.offsets[0]+=this.element.scrolls[0];this.element.offsets[1]+=this.element.scrolls[1];}
+return new OpenLayers.Pixel((evt.clientX+this.element.scrolls[0])-this.element.offsets[0]
+-this.element.lefttop[0],(evt.clientY+this.element.scrolls[1])-this.element.offsets[1]
+-this.element.lefttop[1]);},CLASS_NAME:"OpenLayers.Events"});OpenLayers.Format=OpenLayers.Class({options:null,externalProjection:null,internalProjection:null,data:null,keepData:false,initialize:function(options){OpenLayers.Util.extend(this,options);this.options=options;},destroy:function(){},read:function(data){OpenLayers.Console.userError(OpenLayers.i18n("readNotImplemented"));},write:function(object){OpenLayers.Console.userError(OpenLayers.i18n("writeNotImplemented"));},CLASS_NAME:"OpenLayers.Format"});OpenLayers.Lang["ar"]=OpenLayers.Util.applyDefaults({'permalink':"ÙØµÙØ© Ø¯Ø§ØŠÙ
+Ø©",'baseLayer':"Ø§ÙØ·ØšÙØ© Ø§ÙØ§Ø³Ø§Ø³ÙØ©",'readNotImplemented':"Ø§ÙÙØ±Ø§Ø¡Ø© ØºÙØ± Ù
+Ø­ÙÙØ©.",'writeNotImplemented':"Ø§ÙÙØªØ§ØšØ© ØºÙØ± Ù
+Ø­ÙÙØ©",'errorLoadingGML':"Ø®Ø·Ø£ Ø¹ÙØ¯ ØªØ­Ù
+ÙÙ Ø§ÙÙ
+ÙÙ Ø¬Ù Ø§Ù
+ Ø§Ù ${url}",'scale':"Ø§ÙÙØ³ØšØ© = 1 : ${scaleDenom}",'W':"Øº",'E':"ØŽØ±",'N':"ØŽÙ
+",'S':"Ø¬"});OpenLayers.Lang["be-tarask"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"ÐÐµÐ°Ð¿ÑÐ°ÑÐ°Ð²Ð°ÐœÑ Ð²ÑÐœÑÐº Ð·Ð°Ð¿ÑÑÑ ${statusText}",'permalink':"Ð¡ÑÐ°Ð»Ð°Ñ ÑÐ¿Ð°ÑÑÐ»ÐºÐ°",'overlays':"Ð¡Ð»Ð°Ñ",'baseLayer':"ÐÐ°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹",'sameProjection':"ÐÐ³Ð»ÑÐŽÐœÐ°Ñ ÐŒÐ°Ð¿Ð° Ð¿ÑÐ°ÑÑÐµ ÑÐŸÐ»ÑÐºÑ ÐºÐ°Ð»Ñ ÑÐœÐ° ÐŒÐ°Ðµ ÑÑÑ Ð¶ Ð¿ÑÐ°ÐµÐºÑÑÑ, ÑÑÐŸ Ñ Ð°ÑÐœÐŸÑÐœÐ°Ñ ÐŒÐ°Ð¿Ð°",'readNotImplemented':"Ð€ÑÐœÐºÑÑÑÐœÐ°Ð»ÑÐœÐ°ÑÑÑÑ ÑÑÑÐ°ÐœÑÐœÑ ÐœÑ ÑÑÐ²ÐŸÑÐ°ÐœÐ°Ñ.",'writeNotImplemented':"Ð€ÑÐœÐºÑÑÑÐœÐ°Ð»ÑÐœÐ°ÑÑÑÑ Ð·Ð°Ð¿ÑÑÑ ÐœÑ ÑÑÐ²ÐŸÑÐ°ÐœÐ°Ñ.",'noFID':"ÐÐµÐŒÐ°Ð³ÑÑÐŒÐ° Ð°Ð±ÐœÐ°Ð²ÑÑÑ ÐŒÐ°Ð³ÑÑÐŒÐ°ÑÑÑÑ, ÐŽÐ»Ñ ÑÐºÐŸÐ³Ð° ÐœÐµ ÑÑÐœÑÐµ FID.",'errorLoadingGML':"ÐÐ°ÐŒÑÐ»ÐºÐ° Ð·Ð°Ð³ÑÑÐ·ÐºÑ ÑÐ°Ð¹Ð»Ð° GML ${url}",'browserNotSupported':"ÐÐ°Ñ Ð±ÑÐ°ÑÐ·ÑÑ ÐœÐµ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°Ðµ Ð²ÑÐºÑÐ°ÑÐœÑÑ Ð³ÑÐ°ÑÑÐºÑ. Ð£ ÑÑÐ¿ÐµÑÐ°ÑÐœÑ ÐŒÐŸÐŒÐ°ÐœÑ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°ÑÑÑÐ°: ${renderers}",'componentShouldBe':"addFeatures : ÐºÐ°ÐŒÐ¿Ð°ÐœÑÐœÑ Ð¿Ð°Ð²ÑÐœÐµÐœ Ð±ÑÑÑ ${geomType}",'getFeatureError':"getFeatureFromEvent Ð²ÑÐºÐ»ÑÐºÐ°ÐœÑ ÐŽÐ»Ñ ÑÐ»ÐŸÑ Ð±ÑÐ· ÑÑÐœÐŽÑÑÑ. ÐÐ²ÑÑÐ°Ð¹ÐœÐ° Ð³ÑÑÐ° Ð°Ð·ÐœÐ°ÑÐ°Ðµ, ÑÑÐŸ ÐÑ Ð·ÑÐœÑÑÑÑÐ»Ñ ÑÐ»ÐŸÐ¹, Ð°Ð»Ðµ Ð¿Ð°ÐºÑÐœÑÐ»Ñ Ð·ÑÐ²ÑÐ·Ð°ÐœÑ Ð·Ñ ÑÐŒ Ð°Ð¿ÑÐ°ÑÐŸÑÑÑÑÐº.",'minZoomLevelError':"Ð£Ð»Ð°ÑÑÑÑÐ²Ð°ÑÑÑÑ minZoomLevel Ð¿ÑÑÐ·ÐœÐ°ÑÐ°ÐœÐ° ÑÐŸÐ»ÑÐºÑ ÐŽÐ»Ñ Ð²ÑÐºÐ°ÑÑÑÑÐ°ÐœÑÐœÑ ÑÐ° ÑÐ»Ð°ÑÐŒÑ Ð²ÑÑÐ²ÐŸÑÐœÑÐŒÑ Ð°ÐŽ FixedZoomLevels. Ð¢ÐŸÐµ, ÑÑÐŸ  Ð³ÑÑÑ wfs-ÑÐ»ÐŸÐ¹ Ð¿ÑÐ°Ð²ÑÑÐ°ÐµÑÑÐ° ÐœÐ° minZoomLevel â ÑÑÑ
+Ð° Ð¿ÑÐŸÑÐ»Ð°Ð³Ð°. ÐÐ»Ðµ ÐŒÑ ÐœÑ ÐŒÐŸÐ¶Ð°ÐŒ Ð²ÑÐŽÐ°Ð»ÑÑÑ Ð³ÑÑÑÑ ÐŒÐ°Ð³ÑÑÐŒÐ°ÑÑÑÑ, ÑÐ°ÐŒÑ ÑÑÐŸ Ð°ÐŽ ÑÐµ Ð·Ð°Ð»ÐµÐ¶Ð°ÑÑ ÐœÐµÐºÐ°ÑÐŸÑÑÑ Ð·Ð°ÑÐœÐ°Ð²Ð°ÐœÑÑ ÐœÐ° OL ÐŽÐ°ÑÑÐ°ÑÐ°Ð²Ð°ÐœÑÐœÑ. Ð¢ÑÐŒ ÐœÑ ÐŒÐµÐœÑ, Ð¿ÑÐ°Ð²ÐµÑÐºÐ° minZoomLevel Ð±ÑÐŽÐ·Ðµ Ð²ÑÐŽÐ°Ð»ÐµÐœÐ°Ñ Ñ Ð²ÑÑÑÑÑ 3.0. ÐÐ°Ð»Ñ Ð»Ð°ÑÐºÐ°, Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°ÐµÑÐµ Ð·Ð°ÐŒÐµÑÑ ÑÐµ ÑÑÑÐ°ÐœÐŸÑÐºÑ ÐŒÑÐœÑÐŒÐ°Ð»ÑÐœÐ°Ð³Ð°/ÐŒÐ°ÐºÑÑÐŒÐ°Ð»ÑÐœÐ°Ð³Ð° Ð¿Ð°ÐŒÐµÑÐ°Ñ, ÑÐº Ð°Ð¿ÑÑÐ°ÐœÐ° ÑÑÑ: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS-ÑÑÐ°ÐœÐ·Ð°ÐºÑÑÑ: ÐÐÐ¡Ð¬ÐÐÐ¥ ${response}",'commitFailed':"WFS-ÑÑÐ°ÐœÐ·Ð°ÐºÑÑÑ: ÐÐÐÐ«ÐÐÐ ${response}",'googleWarning':"ÐÐµ Ð°ÑÑÑÐŒÐ°Ð»Ð°ÑÑ Ð·Ð°Ð³ÑÑÐ·ÑÑÑ ÑÐ»ÐŸÐ¹ Google. \x3cbr\x3e\x3cbr\x3eÐÐ°Ð± Ð¿Ð°Ð·Ð±Ð°Ð²ÑÑÑÐ° Ð³ÑÑÐ°Ð³Ð° Ð¿Ð°Ð²ÐµÐŽÐ°ÐŒÐ»ÐµÐœÑÐœÑ, Ð²ÑÐ±ÐµÑÑÑÐµ ÐœÐŸÐ²Ñ Ð±Ð°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹ Ñ ÑÑÐ¿ÑÑÐµ Ñ Ð²ÐµÑÑ
+ÐœÑÐŒ Ð¿ÑÐ°Ð²ÑÐŒ ÐºÑÑÐµ.\x3cbr\x3e\x3cbr\x3e Ð¥ÑÑÑÑÐ¹ Ð·Ð° ÑÑÑ, Ð¿ÑÑÑÑÐœÐ° Ñ ÑÑÐŒ, ÑÑÐŸ ÑÐºÑÑÐ¿Ñ Ð±ÑÐ±Ð»ÑÑÑÑÐºÑ Google Maps ÐœÑ Ð±ÑÑ ÑÐºÐ»ÑÑÐ°ÐœÑÑ Ð°Ð»ÑÐ±ÐŸ ÐœÐµ ÑÑÑÑÐŒÐ»ÑÐ²Ð°Ðµ ÑÐ»ÑÑÐœÑ API-ÐºÐ»ÑÑ ÐŽÐ»Ñ ÐÐ°ÑÐ°Ð³Ð° ÑÐ°Ð¹ÑÐ°.\x3cbr\x3e\x3cbr\x3eÐ Ð°ÑÐ¿ÑÐ°ÑÐŸÑÑÑÑÐºÐ°ÐŒ: ÐÐ»Ñ ÑÐ°Ð³ÐŸ, ÐºÐ°Ð± ÐŽÐ°Ð²ÐµÐŽÐ°ÑÑÐ° ÑÐº Ð·ÑÐ°Ð±ÑÑÑ ÑÐ°Ðº, ÐºÐ°Ð± ÑÑÑ Ð¿ÑÐ°ÑÐ°Ð²Ð°Ð»Ð°, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eÐœÐ°ÑÑÑÑÐœÑÑÐµ ÑÑÑ\x3c/a\x3e",'getLayerWarning':"ÐÐµÐŒÐ°Ð³ÑÑÐŒÐ° Ð·Ð°Ð³ÑÑÐ·ÑÑÑ ÑÐ»ÐŸÐ¹ ${layerType}.\x3cbr\x3e\x3cbr\x3eÐÐ°Ð± Ð¿Ð°Ð·Ð±Ð°Ð²ÑÑÑÐ° Ð³ÑÑÐ°Ð³Ð° Ð¿Ð°Ð²ÐµÐŽÐ°ÐŒÐ»ÐµÐœÑÐœÑ, Ð²ÑÐ±ÐµÑÑÑÐµ ÐœÐŸÐ²Ñ Ð±Ð°Ð·Ð°Ð²Ñ ÑÐ»ÐŸÐ¹ Ñ ÑÑÐ¿ÑÑÐµ Ñ Ð²ÐµÑÑ
+ÐœÑÐŒ Ð¿ÑÐ°Ð²ÑÐŒ ÐºÑÑÐµ.\x3cbr\x3e\x3cbr\x3eÐ¥ÑÑÑÑÐ¹ Ð·Ð° ÑÑÑ, Ð¿ÑÑÑÑÐœÐ° Ñ ÑÑÐŒ, ÑÑÐŸ ÑÐºÑÑÐ¿Ñ Ð±ÑÐ±Ð»ÑÑÑÑÐºÑ ${layerLib} ÐœÑ Ð±ÑÑ ÑÐ»ÑÑÐœÐ° ÑÐºÐ»ÑÑÐ°ÐœÑ.\x3cbr\x3e\x3cbr\x3eÐ Ð°ÑÐ¿ÑÐ°ÑÐŸÑÑÑÑÐºÐ°ÐŒ: ÐÐ»Ñ ÑÐ°Ð³ÐŸ, ÐºÐ°Ð± ÐŽÐ°Ð²ÐµÐŽÐ°ÑÑÐ° ÑÐº Ð·ÑÐ°Ð±ÑÑÑ ÑÐ°Ðº, ÐºÐ°Ð± ÑÑÑ Ð¿ÑÐ°ÑÐ°Ð²Ð°Ð»Ð°, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eÐœÐ°ÑÑÑÑÐœÑÑÐµ ÑÑÑ\x3c/a\x3e",'scale':"ÐÐ°ÑÑÐ°Ð± = 1 : ${scaleDenom}",'W':"Ð",'E':"Ð£",'N':"ÐÐœ",'S':"ÐÐŽ",'layerAlreadyAdded':"ÐÑ Ð¿Ð°ÑÐ¿ÑÐ°Ð±Ð°Ð²Ð°Ð»Ñ ÐŽÐ°ÐŽÐ°ÑÑ ÑÐ»ÐŸÐ¹ ${layerName} ÐœÐ° ÐŒÐ°Ð¿Ñ, Ð°Ð»Ðµ ÑÐœ ÑÐ¶ÐŸ ÐŽÐ°ÐŽÐ°ÐŽÐ·ÐµÐœÑ",'reprojectDeprecated':"ÐÑ Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°ÐµÑÐµ ÑÑÑÐ°ÐœÐŸÑÐºÑ \'reproject\' ÐŽÐ»Ñ ÑÐ»ÐŸÑ ${layerName}. ÐÑÑÐ°Ñ ÑÑÑÐ°ÐœÐŸÑÐºÐ° Ð·ÑÑÑÐ»ÑÐµÑÑÐ° ÑÐ°ÑÑÐ°ÑÑÐ»Ð°Ð¹: ÑÐœÐ° Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°Ð»Ð°ÑÑ ÐŽÐ»Ñ Ð¿Ð°ÐŽÑÑÑÐŒÐºÑ Ð¿Ð°ÐºÐ°Ð·Ñ Ð·ÑÐ²ÐµÑÑÐ°Ðº ÐœÐ° ÐºÐ°ÐŒÑÑÑÑÐ¹ÐœÑÑ
+ Ð±Ð°Ð·Ð°Ð²ÑÑ
+ ÐŒÐ°Ð¿Ð°Ñ
+, Ð°Ð»Ðµ Ð³ÑÑÐ° ÑÑÐœÐºÑÑÑ ÑÑÐ¿ÐµÑ ÑÑÐ°Ð»ÑÐ·Ð°Ð²Ð°ÐœÐ°Ñ Ñ ÑÐ±ÑÐŽÐ°Ð²Ð°ÐœÐ°Ð¹ Ð¿Ð°ÐŽÑÑÑÐŒÑÑ ÑÑÑÑÑÑÐœÐ°Ð¹ Ð¿ÑÐ°ÐµÐºÑÑÑ ÐÑÑÐºÐ°ÑÐ°ÑÐ°. ÐÐ°ÐŽÐ°ÑÐºÐŸÐ²Ð°Ñ ÑÐœÑÐ°ÑÐŒÐ°ÑÑÑ ÑÑÑÑÑ ÐœÐ° http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"ÐÑÑÑ ÐŒÑÑÐ°ÐŽ ÑÐ°ÑÑÐ°ÑÑÐ»Ñ Ñ Ð±ÑÐŽÐ·Ðµ Ð²ÑÐŽÐ°Ð»ÐµÐœÑ Ñ Ð²ÑÑÑÑÑ 3.0. ÐÐ°Ð»Ñ Ð»Ð°ÑÐºÐ°, Ð·Ð°ÐŒÐµÑÑ ÑÐ³ÐŸ Ð²ÑÐºÐ°ÑÑÑÑÐŸÑÐ²Ð°Ð¹ÑÐµ ${newMethod}.",'boundsAddError':"ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ x Ñ y ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",'lonlatAddError':"ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ lon Ñ lat ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",'pixelAddError':"ÐÐ°ÐŒ ÐœÐµÐ°Ð±Ñ
+ÐŸÐŽÐœÐ° Ð¿Ð°ÐŽÐ°ÑÑ Ð°Ð±ÐŸÐŽÐ²Ð° Ð·ÐœÐ°ÑÑÐœÑÐœÑ x Ñ y ÐŽÐ»Ñ ÑÑÐœÐºÑÑÑ ÑÐºÐ»Ð°ÐŽÐ°ÐœÑÐœÑ.",'unsupportedGeometryType':"Ð¢ÑÐ¿ Ð³ÐµÐ°ÐŒÑÑÑÑÑ ÐœÐµ Ð¿Ð°ÐŽÑÑÑÐŒÐ»ÑÐ²Ð°ÐµÑÑÐ°: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition failed: Ð²ÐµÑÐ°Ð³ÐŸÐŽÐœÐ° ÑÐ»ÐµÐŒÑÐœÑ Ð· ÑÐŽÑÐœÑÑÑÑÐºÐ°ÑÐ°ÑÐ°ÐŒ ${elemId} Ð·Ð°Ð¹ÐŒÐ°Ðµ ÐœÑÑÐ»ÑÑÐœÐ°Ðµ ÐŒÐµÑÑÐ°.",'filterEvaluateNotImplemented':"evaluate ÐœÐµ ÑÑÐ°Ð»ÑÐ·Ð°Ð²Ð°ÐœÑ ÐŽÐ»Ñ Ð³ÑÑÐ°Ð³Ð° ÑÑÐ¿Ñ ÑÑÐ»ÑÑÑÑ."});OpenLayers.Lang["bg"]=OpenLayers.Util.applyDefaults({'permalink':"ÐÐŸÑÑÐŸÑÐœÐœÐ° Ð¿ÑÐµÐ¿ÑÐ°ÑÐºÐ°",'baseLayer':"ÐÑÐœÐŸÐ²ÐµÐœ ÑÐ»ÐŸÐ¹",'errorLoadingGML':"ÐÑÐµÑÐºÐ° Ð¿ÑÐž Ð·Ð°ÑÐµÐ¶ÐŽÐ°ÐœÐµ ÐœÐ° GML ÑÐ°Ð¹Ð» ${url}",'scale':"ÐÐ°ÑÐ°Ð± = 1 : ${scaleDenom}",'layerAlreadyAdded':"ÐÐ¿ÐžÑÐ°Ñ
+ÑÐµ ÐŽÐ° ÐŽÐŸÐ±Ð°Ð²ÐžÑÐµ ÑÐ»ÐŸÐ¹ ${layerName} Ð² ÐºÐ°ÑÑÐ°ÑÐ°, ÐœÐŸ ÑÐŸÐ¹ Ð²ÐµÑÐµ Ðµ ÐŽÐŸÐ±Ð°Ð²ÐµÐœ",'methodDeprecated':"Ð¢ÐŸÐ·Ðž ÐŒÐµÑÐŸÐŽ Ðµ ÐŸÑÑÐ°ÑÑÐ» Ðž ÑÐµ Ð±ÑÐŽÐµ Ð¿ÑÐµÐŒÐ°Ñ
+Ð²Ð°Ñ Ð² 3.0. ÐÐŒÐµÑÑÐŸ ÐœÐµÐ³ÐŸ ÐžÐ·Ð¿ÐŸÐ»Ð·Ð²Ð°Ð¹ÑÐµ ${newMethod}."});OpenLayers.Lang["br"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Distro evel reked anveret ${statusText}",'permalink':"Peurliamm",'overlays':"GwiskadoÃ¹",'baseLayer':"Gwiskad diazez",'sameProjection':"Ne\'z ar gartenn lec\'hiaÃ± en-dro nemet pa vez heÃ±vel ar banndres anezhi ha hini ar gartenn bennaÃ±",'readNotImplemented':"N\'eo ket emplementet al lenn.",'writeNotImplemented':"N\'eo ket emplementet ar skrivaÃ±.",'noFID':"N\'haller ket hizivaat un elfenn ma n\'eus ket a niverenn-anaout (FID) eviti.",'errorLoadingGML':"Fazi e-ser kargaÃ± ar restr GML ${url}",'browserNotSupported':"N\'eo ket skoret an daskor vektorel gant ho merdeer. Setu aze an daskorerioÃ¹ skoret evit ar poent :\n${renderers}",'componentShouldBe':"addFeatures : bez\' e tlefe ar parzh besaÃ± eus ar seurt ${geomType}",'getFeatureError':"Galvet eo bet getFeatureFromEvent called war ur gwiskad hep daskorer. Kement-se a dalvez ez eus bet freuzet ur gwiskad hag hoc\'h eus miret un embreger bennak stag outaÃ±.",'minZoomLevelError':"Ne zleer implijout ar perzh minZoomLevel nemet evit gwiskadoÃ¹ FixedZoomLevels-descendent. Ar fed ma wiria ar gwiskad WHS-se hag-eÃ± ez eus eus minZoomLevel zo un aspadenn gozh. Koulskoude n\'omp ket evit e ziverkaÃ± kuit da derriÃ± arloadoÃ¹ diazezet war OL a c\'hallfe bezaÃ± stag outaÃ±. Setu perak eo dispredet -- Lamet kuit e vo ar gwiriaÃ± minZoomLevel a-is er stumm 3.0. Ober gant an arventennoÃ¹ bihanaÃ±/brasaÃ± evel deskrivet amaÃ± e plas : http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Treuzgread WFS : MAT EO ${response}",'commitFailed':"Treuzgread WFS Transaction: C\'HWITET ${response}",'googleWarning':"N\'eus ket bet gallet kargaÃ± ar gwiskad Google ent reizh.\x3cbr\x3e\x3cbr\x3eEvit en em zizober eus ar c\'hemenn-maÃ±, dibabit ur BaseLayer nevez en diuzer gwiskadoÃ¹ er c\'horn dehoÃ¹ el laez.\x3cbr\x3e\x3cbr\x3eSur a-walc\'h eo peogwir n\'eo ket bet ensoc\'het levraoueg Google Maps pe neuze ne glot ket an alc\'hwez API gant ho lec\'hienn.\x3cbr\x3e\x3cbr\x3eDiorroerien : Evit reizhaÃ± an dra-se, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclick here\x3c/a\x3e",'getLayerWarning':"N\'haller ket kargaÃ± ar gwiskad ${layerType} ent reizh.\x3cbr\x3e\x3cbr\x3eEvit en em zizober eus ar c\'hemenn-maÃ±, dibabit ur BaseLayer nevez en diuzer gwiskadoÃ¹ er c\'horn dehoÃ¹ el laez.\x3cbr\x3e\x3cbr\x3eSur a-walc\'h eo peogwir n\'eo ket bet ensoc\'het mat al levraoueg ${layerLib}.\x3cbr\x3e\x3cbr\x3eDiorroerien : Evit gouzout penaos reizhaÃ± an dra-se, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclick here\x3c/a\x3e",'scale':"Skeul = 1 : ${scaleDenom}",'W':"K",'E':"R",'N':"N",'S':"S",'layerAlreadyAdded':"Klasket hoc\'h eus ouzhpennaÃ± ar gwiskad : ${layerName} d\'ar gartenn, met ouzhpennet e oa bet c\'hoazh",'reprojectDeprecated':"Emaoc\'h oc\'h implijout an dibarzh \'reproject\' war ar gwiskad ${layerName}. Dispredet eo an dibarzh-maÃ± : bet eo hag e talveze da ziskwel roadennoÃ¹ war-c\'horre kartennoÃ¹ diazez kenwerzhel, un dra hag a c\'haller ober bremaÃ± gant an arc\'hwel dre skor banndres boullek Mercator. Muioc\'h a ditouroÃ¹ a c\'haller da gaout war http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Dispredet eo an daore-se ha tennet e vo kuit eus ar stumm 3.0. Grit gant ${newMethod} e plas.",'boundsAddError':"Rekis eo tremen an div dalvoudenn x ha y d\'an arc\'hwel add.",'lonlatAddError':"Rekis eo tremen an div dalvoudenn hedred ha ledred d\'an arc\'hwel add.",'pixelAddError':"Rekis eo tremen an div dalvoudenn x ha y d\'an arc\'hwel add.",'unsupportedGeometryType':"Seurt mentoniezh anskoret : ${geomType}",'pagePositionFailed':"C\'hwitet eo OpenLayers.Util.pagePosition : marteze emaÃ± lec\'hiet fall an elfenn id ${elemId}.",'filterEvaluateNotImplemented':"N\'eo ket bet emplementet ar priziaÃ± evit seurt siloÃ¹ c\'hoazh."});OpenLayers.Lang["el"]=OpenLayers.Util.applyDefaults({'scale':"ÎÎ»Î¯ÎŒÎ±ÎºÎ± ~ 1 : ${scaleDenom}"});OpenLayers.Lang.en={'unhandledRequest':"Unhandled request return ${statusText}",'permalink':"Permalink",'overlays':"Overlays",'baseLayer':"Base Layer",'sameProjection':"The overview map only works when it is in the same projection as the main map",'readNotImplemented':"Read not implemented.",'writeNotImplemented':"Write not implemented.",'noFID':"Can't update a feature for which there is no FID.",'errorLoadingGML':"Error in loading GML file ${url}",'browserNotSupported':"Your browser does not support vector rendering. Currently supported renderers are:\n${renderers}",'componentShouldBe':"addFeatures : component should be an ${geomType}",'getFeatureError':"getFeatureFromEvent called on layer with no renderer. This usually means you "+"destroyed a layer, but not some handler which is associated with it.",'minZoomLevelError':"The minZoomLevel property is only intended for use "+"with the FixedZoomLevels-descendent layers. That this "+"wfs layer checks for minZoomLevel is a relic of the"+"past. We cannot, however, remove it without possibly "+"breaking OL based applications that may depend on it."+" Therefore we are deprecating it -- the minZoomLevel "+"check below will be removed at 3.0. Please instead "+"use min/max resolution setting as described here: "+"http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS Transaction: SUCCESS ${response}",'commitFailed':"WFS Transaction: FAILED ${response}",'googleWarning':"The Google Layer was unable to load correctly.<br><br>"+"To get rid of this message, select a new BaseLayer "+"in the layer switcher in the upper-right corner.<br><br>"+"Most likely, this is because the Google Maps library "+"script was either not included, or does not contain the "+"correct API key for your site.<br><br>"+"Developers: For help getting this working correctly, "+"<a href='http://trac.openlayers.org/wiki/Google' "+"target='_blank'>click here</a>",'getLayerWarning':"The ${layerType} Layer was unable to load correctly.<br><br>"+"To get rid of this message, select a new BaseLayer "+"in the layer switcher in the upper-right corner.<br><br>"+"Most likely, this is because the ${layerLib} library "+"script was not correctly included.<br><br>"+"Developers: For help getting this working correctly, "+"<a href='http://trac.openlayers.org/wiki/${layerLib}' "+"target='_blank'>click here</a>",'scale':"Scale = 1 : ${scaleDenom}",'W':'W','E':'E','N':'N','S':'S','graticule':'Graticule','layerAlreadyAdded':"You tried to add the layer: ${layerName} to the map, but it has already been added",'reprojectDeprecated':"You are using the 'reproject' option "+"on the ${layerName} layer. This option is deprecated: "+"its use was designed to support displaying data over commercial "+"basemaps, but that functionality should now be achieved by using "+"Spherical Mercator support. More information is available from "+"http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"This method has been deprecated and will be removed in 3.0. "+"Please use ${newMethod} instead.",'boundsAddError':"You must pass both x and y values to the add function.",'lonlatAddError':"You must pass both lon and lat values to the add function.",'pixelAddError':"You must pass both x and y values to the add function.",'unsupportedGeometryType':"Unsupported geometry type: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition failed: element with id ${elemId} may be misplaced.",'filterEvaluateNotImplemented':"evaluate is not implemented for this filter type.",'end':''};OpenLayers.Lang["fi"]=OpenLayers.Util.applyDefaults({'permalink':"Ikilinkki",'overlays':"Kerrokset",'baseLayer':"Peruskerros",'sameProjection':"Yleiskuvakarttaa voi kÃ€yttÃ€Ã€ vain, kun sillÃ€ on sama projektio kuin pÃ€Ã€kartalla.",'W':"L",'E':"I",'N':"P",'S':"E"});OpenLayers.Lang["fur"]=OpenLayers.Util.applyDefaults({'permalink':"Leam Permanent",'overlays':"Livei parsore",'baseLayer':"Livel di base",'browserNotSupported':"Il to sgarfadÃŽr nol supuarte la renderizazion vetoriÃ¢l. Al moment a son supuartÃ¢ts:\n${renderers}",'scale':"Scjale = 1 : ${scaleDenom}",'W':"O",'E':"E",'N':"N",'S':"S"});OpenLayers.Lang["gl"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Solicitude non xerada; a resposta foi: ${statusText}",'permalink':"LigazÃ³n permanente",'overlays':"Capas superpostas",'baseLayer':"Capa base",'sameProjection':"A vista xeral do mapa sÃ³ funciona cando estÃ¡ na mesma proxecciÃ³n cÃ³ mapa principal",'readNotImplemented':"Lectura non implementada.",'writeNotImplemented':"Escritura non implementada.",'noFID':"Non se pode actualizar a funcionalidade para a que non hai FID.",'errorLoadingGML':"Erro ao cargar o ficheiro GML ${url}",'browserNotSupported':"O seu navegador non soporta a renderizaciÃ³n de vectores. Os renderizadores soportados actualmente son:\n${renderers}",'componentShouldBe':"addFeatures: o compoÃ±ente debera ser de tipo ${geomType}",'getFeatureError':"getFeatureFromEvent ten sido chamado a unha capa sen renderizador. Isto normalmente significa que destruÃ­u unha capa, mais non o executador que estÃ¡ asociado con ela.",'minZoomLevelError':"A propiedade minZoomLevel Ã© sÃ³ para uso conxuntamente coas capas FixedZoomLevels-descendent. O feito de que esa capa wfs verifique o minZoomLevel Ã© unha reliquia do pasado. Non podemos, con todo, eliminala sen a posibilidade de non romper as aplicaciÃ³ns baseadas en OL que poidan depender dela. Por iso a estamos deixando obsoleta (a comprobaciÃ³n minZoomLevel de embaixo serÃ¡ eliminada na versiÃ³n 3.0). Por favor, no canto diso use o axuste de resoluciÃ³n mÃ­n/mÃ¡x tal e como estÃ¡ descrito aquÃ­: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"TransacciÃ³n WFS: ÃXITO ${response}",'commitFailed':"TransacciÃ³n WFS: FALLIDA ${response}",'googleWarning':"A capa do Google non puido cargarse correctamente.\x3cbr\x3e\x3cbr\x3ePara evitar esta mensaxe, escolla unha nova capa base no seleccionador de capas na marxe superior dereita.\x3cbr\x3e\x3cbr\x3eProbablemente, isto acontece porque a escritura da librarÃ­a do Google Maps ou ben non foi incluÃ­da ou ben non contÃ©n a clave API correcta para o seu sitio.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: para axudar a facer funcionar isto correctamente, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3epremede aquÃ­\x3c/a\x3e",'getLayerWarning':"A capa ${layerType} foi incapaz de cargarse correctamente.\x3cbr\x3e\x3cbr\x3ePara evitar esta mensaxe, escolla unha nova capa base no seleccionador de capas na marxe superior dereita.\x3cbr\x3e\x3cbr\x3eProbablemente, isto acontece porque a escritura da librarÃ­a ${layerLib} non foi ben incluÃ­da.\x3cbr\x3e\x3cbr\x3eDesenvolvedores: para axudar a facer funcionar isto correctamente, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3epremede aquÃ­\x3c/a\x3e",'scale':"Escala = 1 : ${scaleDenom}",'W':"O",'E':"L",'N':"N",'S':"S",'layerAlreadyAdded':"Intentou engadir a capa: ${layerName} ao mapa, pero xa fora engadida",'reprojectDeprecated':"EstÃ¡ usando a opciÃ³n \"reproject\" na capa ${layerName}. Esta opciÃ³n estÃ¡ obsoleta: o seu uso foi deseÃ±ado para a visualizaciÃ³n de datos sobre mapas base comerciais, pero esta funcionalidade debera agora ser obtida utilizando a proxecciÃ³n Spherical Mercator. Hai dispoÃ±ible mÃ¡is informaciÃ³n en http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Este mÃ©todo estÃ¡ obsoleto e serÃ¡ eliminado na versiÃ³n 3.0. Por favor, no canto deste use ${newMethod}.",'boundsAddError':"Debe achegar os valores x e y Ã¡ funciÃ³n add.",'lonlatAddError':"Debe achegar tanto o valor lon coma o lat Ã¡ funciÃ³n add.",'pixelAddError':"Debe achegar os valores x e y Ã¡ funciÃ³n add.",'unsupportedGeometryType':"Tipo xeomÃ©trico non soportado: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition fallou: o elemento con id ${elemId} pode non estar na sÃºa posiciÃ³n.",'filterEvaluateNotImplemented':"avaliar non estÃ¡ implementado para este tipo de filtro."});OpenLayers.Lang["gsw"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Nit behandleti AafrogsruckmÃ€ldig ${statusText}",'permalink':"Permalink",'overlays':"Iberlagerige",'baseLayer':"Grundcharte",'sameProjection':"D Ibersichts-Charte funktioniert nume, wÃ€nn si di glych ProjÃ€ktion brucht wie d Hauptcharte",'readNotImplemented':"LÃ€se nit implementiert.",'writeNotImplemented':"Schrybe nit implementiert.",'noFID':"E Feature, wu s kei FID derfir git, cha nit aktualisiert wÃ€re.",'errorLoadingGML':"FÃ€hler bim Lade vu dr GML-Datei ${url}",'browserNotSupported':"Dyy Browser unterstitzt kei Vektordarstellig. AktuÃ€ll unterstitzti Renderer:\n${renderers}",'componentShouldBe':"addFeatures : KomponÃ€nt sott dr Typ ${geomType} syy",'getFeatureError':"getFeatureFromEvent isch uf eme Layer ohni Renderer ufgruefe wore. Des heisst normalerwys, ass Du e Layer kaputt gmacht hesch, aber nit dr Handler, wu derzue ghert.",'minZoomLevelError':"D minZoomLevel-Eigeschaft isch nume dÃ€nk fir d Layer, wu vu dr FixedZoomLevels abstamme. Ass dÃ€Ã€ wfs-Layer minZoomLevel prieft, scih e Relikt us dr Vergangeheit. Mir chenne s aber nit Ã€ndere ohni OL_basierti AawÃ€ndige villicht kaputt gehn, wu dervu abhÃ€nge.  Us dÃ€m Grund het die Funktion d Eigeschaft \'deprecated\' iberchuu. D minZoomLevel-Priefig unte wird in dr Version 3.0 usegnuu. Bitte verwÃ€nd statt dÃ€m e min/max-Uflesig wie s do bschriben isch: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS-Transaktion: ERFOLGRYCH ${response}",'commitFailed':"WFS-Transaktion: FÃHLGSCHLAA ${response}",'googleWarning':"Dr Google-Layer het nit korrÃ€kt chenne glade wÃ€re.\x3cbr\x3e\x3cbr\x3eGo die MÃ€ldig nimi z kriege, wehl e andere Hintergrundlayer us em LayerSwitcher im rÃ€chte obere Ecke.\x3cbr\x3e\x3cbr\x3eDÃ€Ã€ FÃ€hler git s seli hyfig, wel s Skript vu dr Google-Maps-Bibliothek nit yybunde woren isch oder wel s kei giltige API-Schlissel fir Dyy URL din het.\x3cbr\x3e\x3cbr\x3eEntwickler: Fir Hilf zum korrÃ€kte Yybinde vum Google-Layer \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3edoo drucke\x3c/a\x3e",'getLayerWarning':"Dr ${layerType}-Layer het nit korrÃ€kt chenne glade wÃ€re.\x3cbr\x3e\x3cbr\x3eGo die MÃ€ldig nimi z kriege, wehl e andere Hintergrundlayer us em LayerSwitcher im rÃ€chte obere Ecke.\x3cbr\x3e\x3cbr\x3eDÃ€Ã€ FÃ€hler git s seli hyfig, wel s Skript vu dr \'${layerLib}\'-Bibliothek nit yybunde woren isch oder wel s kei giltige API-Schlissel fir Dyy URL din het.\x3cbr\x3e\x3cbr\x3eEntwickler: Fir Hilf zum korrÃ€kte Yybinde vu Layer \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3edoo drucke\x3c/a\x3e",'scale':"MaÃstab = 1 : ${scaleDenom}",'W':"W",'E':"O",'N':"N",'S':"S",'layerAlreadyAdded':"Du hesch versuecht dÃ€Ã€ Layer in d Charte yyzfiege: ${layerName}, aber Ã€r isch schoi yygfiegt",'reprojectDeprecated':"Du bruchsch d \'reproject\'-Option bim ${layerName}-Layer. Die Option isch nimi giltig: si isch aagleit wore go   Date iber kommerziÃ€lli Grundcharte lege, aber des sott mer jetz mache mit dr Unterstitzig vu Spherical Mercator. Meh Informatione git s uf http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Die Methode isch veraltet un wird us dr Version 3.0 usegnuu. Bitte verwÃ€bnd statt dÃ€m ${newMethod}.",'boundsAddError':"Du muesch e x-WÃ€rt un e y-WÃ€rt yygee bi dr Zuefieg-Funktion",'lonlatAddError':"Du meusch e Lengi- un e Breiti-Grad yygee bi dr Zuefieg-Funktion.",'pixelAddError':"Du muesch x- un y-WÃ€rt aagee bi dr Zuefieg-Funktion.",'unsupportedGeometryType':"Nit unterstitze Geometrii-Typ: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition fÃ€hlgschlaa: ElemÃ€nt mit ID ${elemId} isch villicht falsch gsetzt.",'filterEvaluateNotImplemented':"evaluiere isch nit implemÃ€ntiert in dÃ€m Filtertyp."});OpenLayers.Lang["hr"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"NepodrÅŸani zahtjev ${statusText}",'permalink':"Permalink",'overlays':"Overlays",'baseLayer':"Osnovna karta",'sameProjection':"Pregledna karta radi jedino kao je u istoj projekciji kao i glava karta",'readNotImplemented':"Äitanje nije implementirano.",'writeNotImplemented':"Pisanje nije implementirano.",'noFID':"Ne mogu aÅŸurirati znaÄajku za koju ne postoji FID.",'errorLoadingGML':"GreÅ¡ka u uÄitavanju GML datoteke ${url}",'browserNotSupported':"VaÅ¡ preglednik ne podrÅŸava vektorsko renderiranje. Trenutno podrÅŸani rendereri su: ${renderers}",'componentShouldBe':"addFeatures : komponenta bi trebala biti ${geomType}",'getFeatureError':"getFeatureFromEvent je pozvao Layer bez renderera. Ovo obiÄno znaÄi da ste uniÅ¡tiili Layer, a ne neki Handler koji je povezan s njim.",'commitSuccess':"WFS Transakcija: USPJEÅ NA ${response}",'commitFailed':"WFS Transakcija: NEUSPJEÅ NA ${response}",'scale':"Mjerilo = 1 : ${scaleDenom}",'layerAlreadyAdded':"PokuÅ¡ali ste dodati layer:  ${layerName} na kartu, ali je veÄ dodan",'methodDeprecated':"Ova metoda nije odobrena i biti Äe maknuta u 3.0. Koristite ${newMethod}.",'boundsAddError':"Morate dati obje vrijednosti ,  x i y  da bi dodali funkciju.",'lonlatAddError':"Morate dati obje vrijednosti , (lon i lat) da bi dodali funkciju.",'pixelAddError':"Morate dati obje vrijednosti ,  x i y  da bi dodali funkciju.",'unsupportedGeometryType':"NepodrÅŸani tip geometrije: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition nije uspjelo: element sa id ${elemId} moÅŸe biti krivo smjeÅ¡ten."});OpenLayers.Lang["hsb"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"WotmoÅwa njewobdÅºÄÅaneho napraÅ¡owanja ${statusText}",'permalink':"Trajny wotkaz",'overlays':"NaworÅ¡towanja",'baseLayer':"ZakÅadna runina",'sameProjection':"PÅehladowa karta jenoÅŸ funguje, hdyÅŸ je w samsnej projekciji kaÅŸ hÅowna karta",'readNotImplemented':"Äitanje njeimplementowane.",'writeNotImplemented':"Pisanje njeimplementowane.",'noFID':"Funkcija, za kotruÅŸ FID njeje, njeda so aktualizowaÄ.",'errorLoadingGML':"Zmylk pÅi zaÄitowanju dataje ${url}",'browserNotSupported':"TwÃ³j wobhladowak wektorowe rysowanje njepodpÄruje. Tuchwilu podpÄrowane rysowaki su:\n${renderers}",'componentShouldBe':"addFeatures: komponenta mÄÅa ${geomType} byÄ",'getFeatureError':"getFeatureFromEvent bu na worÅ¡Äe bjez rysowak zawoÅany. To zwjetÅ¡a woznamjenja, zo sy worÅ¡tu zniÄiÅ, ale nic wobdÅºÄÅak, kotryÅŸ je z njej zwjazany.",'minZoomLevelError':"KajkosÄ minZoomLevel je jenoÅŸ za wuÅŸiwanje z worÅ¡tami myslena, kotreÅŸ wot FixedZoomLevels pochadÅºeja. Zo tuta worÅ¡ta wfs za minZoomLevel pÅepruwuje, je relikt zaÅdÅºenosÄe. NjemÃ³ÅŸemy wÅ¡ak ju wotstroniÄ, bjeztoho zo aplikacije, kotreÅŸ na OpenLayers bazÄruja a snano tutu kajkosÄ wuÅŸiwaja, hiÅŸo njefunguja. Tohodla smy ju jako zestarjenu woznamjenili -- pÅepruwowanje za minZoomLevel budu so we wersiji 3.0 wotstronjeÄ. ProÅ¡u wuÅŸij mÄsto toho nastajenje min/max, kaÅŸ je tu wopisane: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS-Transakcija: WUSPÄÅ NA ${response}",'commitFailed':"WFS-Transakcija: NJEPORADÅ¹ENA ${response}",'googleWarning':"WorÅ¡ta Google njemÃ³ÅŸeÅ¡e so korektnje zaÄitaÄ.\x3cbr\x3e\x3cbr\x3eZo by tutu zdÅºÄlenku wotbyÅ, wubjer nowy BaseLayer z wubÄra worÅ¡tow horjeka naprawo.\x3cbr\x3e\x3cbr\x3eNajskerje so to stawa, dokelÅŸ skript biblioteki Google Maps pak njebu zapÅijaty pak njewobsahuje korektny kluÄ API za twoje sydÅo.\x3cbr\x3e\x3cbr\x3eWuwiwarjo: Za pomoc ke korektnemu fungowanju worÅ¡tow\n\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3etu kliknyÄ\x3c/a\x3e",'getLayerWarning':"WorÅ¡ta ${layerType} njemÃ³ÅŸeÅ¡e so korektnje zaÄitaÄ.\x3cbr\x3e\x3cbr\x3eZo by tutu zdÅºÄlenku wotbyÅ, wubjer nowy BaseLayer z wubÄra worÅ¡tow horjeka naprawo.\x3cbr\x3e\x3cbr\x3eNajskerje so to stawa, dokelÅŸ skript biblioteki ${layerLib} njebu korektnje zapÅijaty.\x3cbr\x3e\x3cbr\x3eWuwiwarjo: Za pomoc ke korektnemu fungowanju worÅ¡tow\n\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3etu kliknyÄ\x3c/a\x3e",'scale':"MÄritko = 1 : ${scaleDenom}",'W':"Z",'E':"W",'N':"S",'S':"J",'layerAlreadyAdded':"Sy spytaÅ runinu ${layerName} karÄe dodaÄ, ale je so hiÅŸo dodaÅa",'reprojectDeprecated':"WuÅŸiwaÅ¡ opciju \"reproject\" woÅÅ¡ty ${layerName}. Tuta opcija je zestarjena: jeje wuÅŸiwanje bÄ myslene, zo by zwobraznjenje datow nad komercielnymi bazowymi kartami podpÄraÅo, ale funkcionalnosÄ mÄÅa so nÄtko z pomocu Sperical Mercator docpÄÄ. DalÅ¡e informacije steja na http://trac.openlayers.org/wiki/SphericalMercator k dispoziciji.",'methodDeprecated':"Tuta metoda je so njeschwaliÅa a budÅºe so w 3.0 wotstronjeÄ. ProÅ¡u wuÅŸij ${newMethod} mÄsto toho.",'boundsAddError':"DyrbiÅ¡ hÃ³dnotu x kaÅŸ teÅŸ y funkciji \"add\" pÅepodaÄ.",'lonlatAddError':"DyrbiÅ¡ hÃ³dnotu lon kaÅŸ teÅŸ lat funkciji \"add\" pÅepodaÄ.",'pixelAddError':"DyrbiÅ¡ hÃ³dnotu x kaÅŸ teÅŸ y funkciji \"add\" pÅepodaÄ.",'unsupportedGeometryType':"NjepodpÄrowany geometrijowy typ: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition je so njeporadÅºiÅ: element z id ${elemId} bu snano wopak zamÄstnjeny.",'filterEvaluateNotImplemented':"wuhÃ³dnoÄenje njeje za tutÃ³n filtrowy typ implementowany."});OpenLayers.Lang["hu"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Nem kezelt kÃ©rÃ©s visszatÃ©rÃ©se ${statusText}",'permalink':"Permalink",'overlays':"RÃ¡vetÃ­tÃ©sek",'baseLayer':"AlaprÃ©teg",'sameProjection':"Az Ã¡ttekintÅ tÃ©rkÃ©p csak abban az esetben mÅ±kÃ¶dik, ha ugyanazon a vetÃŒleten van, mint a fÅ tÃ©rkÃ©p.",'readNotImplemented':"OlvasÃ¡s nincs vÃ©grehajtva.",'writeNotImplemented':"ÃrÃ¡s nincs vÃ©grehajtva.",'noFID':"Nem frissÃ­thetÅ olyan jellemzÅ, amely nem rendelkezik FID-del.",'errorLoadingGML':"Hiba GML-fÃ¡jl betÃ¶ltÃ©sekor ${url}",'browserNotSupported':"A bÃ¶ngÃ©szÅje nem tÃ¡mogatja a vektoros renderelÃ©st. A jelenleg tÃ¡mogatott renderelÅk:\n${renderers}",'componentShouldBe':"addFeatures : az Ã¶sszetevÅnek ilyen tÃ­pusÃºnak kell lennie: ${geomType}",'getFeatureError':"getFeatureFromEvent rÃ©teget hÃ­vott meg renderelÅ nÃ©lkÃŒl. Ez rendszerint azt jelenti, hogy megsemmisÃ­tett egy fÃ³liÃ¡t, de nÃ©hÃ¡ny ahhoz tÃ¡rsÃ­tott kezelÅt nem.",'minZoomLevelError':"A minZoomLevel tulajdonsÃ¡got csak a kÃ¶vetkezÅvel valÃ³ hasznÃ¡latra szÃ¡ntÃ¡k: FixedZoomLevels-leszÃ¡rmazott fÃ³liÃ¡k. Ez azt jelenti, hogy a minZoomLevel wfs fÃ³lia jelÃ¶lÅnÃ©gyzetei mÃ¡r a mÃºltÃ©. Mi azonban nem tÃ¡volÃ­thatjuk el annak a veszÃ©lye nÃ©lkÃŒl, hogy az esetlegesen ettÅl fÃŒggÅ OL alapÃº alkalmazÃ¡sokat tÃ¶nkretennÃ©nk. EzÃ©rt ezt Ã©rvÃ©nytelenÃ­tjÃŒk -- a minZoomLevel az alul levÅ jelÃ¶lÅnÃ©gyzet a 3.0-s verziÃ³bÃ³l el lesz tÃ¡volÃ­tva. KÃ©rjÃŒk, helyette hasznÃ¡lja a  min/max felbontÃ¡s beÃ¡llÃ­tÃ¡st, amelyrÅl az alÃ¡bbi helyen talÃ¡l leÃ­rÃ¡st: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS tranzakciÃ³: SIKERES ${response}",'commitFailed':"WFS tranzakciÃ³: SIKERTELEN ${response}",'googleWarning':"A Google fÃ³lia betÃ¶ltÃ©se sikertelen.\x3cbr\x3e\x3cbr\x3eAhhoz, hogy ez az ÃŒzenet eltÅ±njÃ¶n, vÃ¡lasszon egy Ãºj BaseLayer fÃ³liÃ¡t a jobb felsÅ sarokban talÃ¡lhatÃ³ fÃ³liakapcsolÃ³ segÃ­tsÃ©gÃ©vel.\x3cbr\x3e\x3cbr\x3eNagy valÃ³szÃ­nÅ±sÃ©ggel ez azÃ©rt van, mert a Google Maps kÃ¶nyvtÃ¡r parancsfÃ¡jlja nem talÃ¡lhatÃ³, vagy nem tartalmazza az Ãn oldalÃ¡hoz tartozÃ³ megfelelÅ API-kulcsot.\x3cbr\x3e\x3cbr\x3eFejlesztÅknek: A helyes mÅ±kÃ¶dtetÃ©sre vonatkozÃ³ segÃ­tsÃ©g az alÃ¡bbi helyen Ã©rhetÅ el, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3ekattintson ide\x3c/a\x3e",'getLayerWarning':"A(z) ${layerType} fÃ³lia nem tÃ¶ltÅdÃ¶tt be helyesen.\x3cbr\x3e\x3cbr\x3eAhhoz, hogy ez az ÃŒzenet eltÅ±njÃ¶n, vÃ¡lasszon egy Ãºj BaseLayer fÃ³liÃ¡t a jobb felsÅ sarokban talÃ¡lhatÃ³ fÃ³liakapcsolÃ³ segÃ­tsÃ©gÃ©vel.\x3cbr\x3e\x3cbr\x3eNagy valÃ³szÃ­nÅ±sÃ©ggel ez azÃ©rt van, mert a(z) ${layerLib} kÃ¶nyvtÃ¡r parancsfÃ¡jlja helytelen.\x3cbr\x3e\x3cbr\x3eFejlesztÅknek: A helyes mÅ±kÃ¶dtetÃ©sre vonatkozÃ³ segÃ­tsÃ©g az alÃ¡bbi helyen Ã©rhetÅ el, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3ekattintson ide\x3c/a\x3e",'scale':"LÃ©ptÃ©k = 1 : ${scaleDenom}",'W':"Ny",'E':"K",'N':"Ã",'S':"D",'layerAlreadyAdded':"MegprÃ³bÃ¡lta hozzÃ¡adni a(z) ${layerName} fÃ³liÃ¡t a tÃ©rkÃ©phez, de az mÃ¡r hozzÃ¡ van adva",'reprojectDeprecated':"Ãn a \'reproject\' beÃ¡llÃ­tÃ¡st hasznÃ¡lja a(z) ${layerName} fÃ³liÃ¡n. Ez a beÃ¡llÃ­tÃ¡s Ã©rvÃ©nytelen: hasznÃ¡lata az ÃŒzleti alaptÃ©rkÃ©pek fÃ¶lÃ¶tti adatok megjelenÃ­tÃ©sÃ©nek tÃ¡mogatÃ¡sÃ¡ra szolgÃ¡lt, de ezt a funkciÃ³ ezentÃºl a GÃ¶mbi Mercator hasznÃ¡latÃ¡val Ã©rhetÅ el. TovÃ¡bbi informÃ¡ciÃ³ az alÃ¡bbi helyen Ã©rhetÅ el: http://trac.openlayers.org/wiki/SphericalMercator",'methodDeprecated':"Ez a mÃ³dszer Ã©rvÃ©nytelenÃ­tve lett Ã©s a 3.0-s verziÃ³bÃ³l el lesz tÃ¡volÃ­tva. HasznÃ¡lja a(z) ${newMethod} mÃ³dszert helyette.",'boundsAddError':"Az x Ã©s y Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",'lonlatAddError':"A hossz. Ã©s szÃ©l. Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",'pixelAddError':"Az x Ã©s y Ã©rtÃ©keknek egyarÃ¡nt meg kell felelnie, hogy a funkciÃ³t hozzÃ¡adhassa.",'unsupportedGeometryType':"Nem tÃ¡mogatott geometriatÃ­pus: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition sikertelen: lehetsÃ©ges, hogy a(z) ${elemId} azonosÃ­tÃ³jÃº elem tÃ©ves helyre kerÃŒlt.",'filterEvaluateNotImplemented':"ennÃ©l a szÅ±rÅtÃ­pusnÃ¡l kiÃ©rtÃ©kelÃ©s nem hajtÃ³dik vÃ©gre."});OpenLayers.Lang["ia"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Le responsa a un requesta non esseva maneate: ${statusText}",'permalink':"Permaligamine",'overlays':"Superpositiones",'baseLayer':"Strato de base",'sameProjection':"Le mini-carta functiona solmente si illo es in le mesme projection que le carta principal",'readNotImplemented':"Lectura non implementate.",'writeNotImplemented':"Scriptura non implementate.",'noFID':"Non pote actualisar un elemento sin FID.",'errorLoadingGML':"Error al cargamento del file GML ${url}",'browserNotSupported':"Tu navigator non supporta le rendition de vectores. Le renditores actualmente supportate es:\n${renderers}",'componentShouldBe':"addFeatures: le componente debe esser del typo ${geomType}",'getFeatureError':"getFeatureFromEvent ha essite appellate in un strato sin renditor. Isto significa generalmente que tu ha destruite un strato, ma lassava un gestor associate con illo.",'minZoomLevelError':"Le proprietate minZoomLevel es solmente pro uso con le stratos descendente de FixedZoomLevels. Le facto que iste strato WFS verifica minZoomLevel es un reliquia del passato. Nonobstante, si nos lo remove immediatemente, nos pote rumper applicationes a base de OL que depende de illo. Ergo nos lo declara obsolete; le verification de minZoomLevel in basso essera removite in version 3.0. Per favor usa in su loco le configuration de resolutiones min/max como describite a: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Transaction WFS: SUCCESSO ${response}",'commitFailed':"Transaction WFS: FALLEVA ${response}",'googleWarning':"Le strato Google non poteva esser cargate correctemente.\x3cbr\x3e\x3cbr\x3ePro disfacer te de iste message, selige un nove BaseLayer in le selector de strato in alto a dextra.\x3cbr\x3e\x3cbr\x3eMulto probabilemente, isto es proque le script del libreria de Google Maps non esseva includite o non contine le clave API correcte pro tu sito.\x3cbr\x3e\x3cbr\x3eDisveloppatores: Pro adjuta de corriger isto, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclicca hic\x3c/a",'getLayerWarning':"Le strato ${layerType} non poteva esser cargate correctemente.\x3cbr\x3e\x3cbr\x3ePro disfacer te de iste message, selige un nove BaseLayer in le selector de strato in alto a dextra.\x3cbr\x3e\x3cbr\x3eMulto probabilemente, isto es proque le script del libreria de ${layerLib} non esseva correctemente includite.\x3cbr\x3e\x3cbr\x3eDisveloppatores: Pro adjuta de corriger isto, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclicca hic\x3c/a\x3e",'scale':"Scala = 1 : ${scaleDenom}",'W':"W",'E':"E",'N':"N",'S':"S",'layerAlreadyAdded':"Tu tentava adder le strato: ${layerName} al carta, ma illo es ja presente",'reprojectDeprecated':"Tu usa le option \'reproject\' in le strato ${layerName} layer. Iste option es obsolescente: illo esseva pro poter monstrar datos super cartas de base commercial, ma iste functionalitate pote ora esser attingite con le uso de Spherical Mercator. Ulterior information es disponibile a http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Iste methodo ha essite declarate obsolescente e essera removite in version 3.0. Per favor usa ${newMethod} in su loco.",'boundsAddError':"Tu debe passar le duo valores x e y al function add.",'lonlatAddError':"Tu debe passar le duo valores lon e lat al function add.",'pixelAddError':"Tu debe passar le duo valores x e y al function add.",'unsupportedGeometryType':"Typo de geometria non supportate: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition falleva: le elemento con id ${elemId} pote esser mal placiate.",'filterEvaluateNotImplemented':"\"evaluate\" non es implementate pro iste typo de filtro."});OpenLayers.Lang["id"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Permintaan yang tak tertangani menghasilkan ${statusText}",'permalink':"Pranala permanen",'overlays':"Hamparan",'baseLayer':"Lapisan Dasar",'sameProjection':"Peta tinjauan hanya bekerja bila dalam proyeksi yang sama dengan peta utama",'readNotImplemented':"Membaca tidak diterapkan.",'writeNotImplemented':"Menyimpan tidak diterapkan.",'noFID':"Tidak dapat memperbarui fitur yang tidak memiliki FID.",'errorLoadingGML':"Kesalahan dalam memuat berkas GML ${url}",'browserNotSupported':"Peramban Anda tidak mendukung penggambaran vektor. Penggambar yang didukung saat ini adalah:\n${renderers}",'componentShouldBe':"addFeatures : komponen harus berupa ${geomType}",'getFeatureError':"getFeatureFromEvent diterapkan pada lapisan tanpa penggambar. Ini biasanya berarti Anda menghapus sebuah lapisan, tetapi tidak menghapus penangan yang terkait dengannya.",'minZoomLevelError':"Properti minZoomLevel hanya ditujukan bekerja dengan lapisan FixedZoomLevels-descendent. Pengecekan minZoomLevel oleh lapisan wfs adalah peninggalan masa lalu. Kami tidak dapat menghapusnya tanpa kemungkinan merusak aplikasi berbasis OL yang mungkin bergantung padanya. Karenanya, kami menganggapnya tidak berlaku -- Cek minZoomLevel di bawah ini akan dihapus pada 3.0. Silakan gunakan penyetelan resolusi min/maks seperti dijabarkan di sini: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"WFS Transaksi: BERHASIL ${respon}",'commitFailed':"WFS Transaksi: GAGAL ${respon}",'googleWarning':"Lapisan Google tidak dapat dimuat dengan benar.\x3cbr\x3e\x3cbr\x3eUntuk menghilangkan pesan ini, pilih suatu BaseLayer baru melalui penukar lapisan (layer switcher) di ujung kanan atas.\x3cbr\x3e\x3cbr\x3eKemungkinan besar ini karena pustaka skrip Google Maps tidak disertakan atau tidak mengandung kunci API yang tepat untuk situs Anda.\x3cbr\x3e\x3cbr\x3ePengembang: Untuk bantuan mengatasi masalah ini, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eklik di sini\x3c/a\x3e",'getLayerWarning':"Lapisan ${layerType} tidak dapat dimuat dengan benar.\x3cbr\x3e\x3cbr\x3eUntuk menghilangkan pesan ini, pilih suatu BaseLayer baru melalui penukar lapisan (layer switcher) di ujung kanan atas.\x3cbr\x3e\x3cbr\x3eKemungkinan besar ini karena pustaka skrip Google Maps tidak disertakan dengan benar.\x3cbr\x3e\x3cbr\x3ePengembang: Untuk bantuan mengatasi masalah ini, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eklik di sini\x3c/a\x3e",'scale':"Sekala = 1 : ${scaleDenom}",'W':"B",'E':"T",'N':"U",'S':"S",'layerAlreadyAdded':"Anda mencoba menambahkan lapisan: ${layerName} ke dalam peta, tapi lapisan itu telah ditambahkan",'reprojectDeprecated':"Anda menggunakan opsi \'reproject\' pada lapisan ${layerName}. Opsi ini telah ditinggalkan: penggunaannya dirancang untuk mendukung tampilan data melalui peta dasar komersial, tapi fungsionalitas tersebut saat ini harus dilakukan dengan menggunakan dukungan Spherical Mercator. Informasi lebih lanjut tersedia di http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Metode ini telah usang dan akan dihapus di 3.0. Sebaliknya, harap gunakan ${newMethod}.",'boundsAddError':"Anda harus memberikan kedua nilai x dan y ke fungsi penambah.",'lonlatAddError':"Anda harus memberikan kedua nilai lon dan lat ke fungsi penambah.",'pixelAddError':"Anda harus memberikan kedua nilai x dan y ke fungsi penambah.",'unsupportedGeometryType':"Tipe geometri tak didukung: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition gagal: elemen dengan id ${elemId} mungkin salah tempat.",'filterEvaluateNotImplemented':"evaluasi tidak tersedia untuk tipe filter ini."});OpenLayers.Lang["io"]=OpenLayers.Util.applyDefaults({'scale':"Skalo = 1 : ${scaleDenom}"});OpenLayers.Lang["is"]=OpenLayers.Util.applyDefaults({'permalink':"Varanlegur tengill",'overlays':"Ãekjur",'baseLayer':"Grunnlag",'sameProjection':"YfirlitskortiÃ° virkar aÃ°eins ef ÃŸaÃ° er Ã­ sÃ¶mu vÃ¶rpun og aÃ°alkortiÃ°",'readNotImplemented':"Skrifun er Ã³ÃºtfÃŠrÃ°.",'writeNotImplemented':"Lestur er Ã³ÃºtfÃŠrÃ°ur.",'errorLoadingGML':"Villa kom upp viÃ° aÃ° hlaÃ°a inn GML skrÃ¡nni ${url}",'scale':"Skali = 1 : ${scaleDenom}",'layerAlreadyAdded':"ÃÃº reyndir aÃ° bÃŠta laginu ${layerName} Ã¡ kortiÃ° en ÃŸaÃ° er ÃŸegar bÃºiÃ° aÃ° bÃŠta ÃŸvÃ­ viÃ°",'methodDeprecated':"Ãetta fall hefur veriÃ° Ãºrelt og verÃ°ur fjarlÃŠgt Ã­ 3.0. NotaÃ°u ${newMethod} Ã­ staÃ°in."});OpenLayers.Lang["ja"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"æªåŠçã®èŠæ±ã¯ ${statusText} ãè¿ããŸã",'permalink':"ããŒããªã³ã¯",'overlays':"ãªãŒããŒã¬ã€",'baseLayer':"åºåºã¬ã€ã€ãŒ",'sameProjection':"æŠèŠ³å°å³ã¯ã¡ã€ã³ã®å°å³ãšåãæåœ±æ³ããšãå Žåã®ã¿æ©èœããŸã",'readNotImplemented':"èª­ã¿èŸŒã¿ã¯å®è£
+ãããŠããŸããã",'writeNotImplemented':"æžãèŸŒã¿ã¯å®è£
+ãããŠããŸããã",'noFID':"FID ã®ãªãå°ç©ã¯æŽæ°ã§ããŸããã",'errorLoadingGML':"GML ãã¡ã€ã« ${url} ã®èª­ã¿èŸŒã¿ãšã©ãŒ",'browserNotSupported':"ããªãã®ãã©ãŠã¶ã¯ãã¯ã¿ãŒã°ã©ãã£ãã¯ã¹ã®æåã«å¯Ÿå¿ããŠããŸãããçŸæç¹ã§å¯Ÿå¿ããŠãããœãããŠã§ã¢ã¯ä»¥äžã®ãã®ã§ãã\n${renderers}",'componentShouldBe':"addFeatures: èŠçŽ ã¯ ${geomType} ã§ããã¹ãã§ã",'getFeatureError':"getFeatureFromEvent ãã¬ã³ãã©ãŒã®ãªãã¬ã€ã€ãŒããåŒã°ããŸãããéåžžãããã¯ããªããã¬ã€ã€ãŒããããã«é¢é£ã¥ããããããã€ãã®ãã³ãã©ãé€ããŠãç Žå£ããŠããŸã£ãããšãæå³ããŸãã",'minZoomLevelError':"minZoomLevel ãã­ããã£ã¯ FixedZoomLevels ãç¶æ¿ããã¬ã€ã€ãŒã§ã®äœ¿çšã®ã¿ãæ³å®ããŠããŸãããã® minZoomLevel ã«å¯Ÿãã WFS ã¬ã€ã€ãŒã®æ€æ»ã¯æ­Žå²çãªãã®ã§ããããããªããããã®æ€æ»ãé€å»ãããšããã«äŸå­ãã OpenLayers ããŒã¹ã®ã¢ããªã±ãŒã·ã§ã³ãç Žå£ããŠããŸãå¯èœæ§ããããŸãããã£ãŠå»æ­¢ãäºå®ãããŠããããã® minZoomLevel æ€æ»ã¯ããŒãžã§ã³3.0ã§é€å»ãããŸããä»£ããã«ãhttp://trac.openlayers.org/wiki/SettingZoomLevels ã§è§£èª¬ãããŠãããæå°ããã³æå€§è§£ååºŠèš­å®ãäœ¿çšããŠãã ããã",'commitSuccess':"WFS ãã©ã³ã¶ã¯ã·ã§ã³: æå ${response}",'commitFailed':"WFS ãã©ã³ã¶ã¯ã·ã§ã³: å€±æ ${response}",'googleWarning':"Google ã¬ã€ã€ãŒãæ­£ããèª­ã¿èŸŒã¿ãè¡ããŸããã§ããã\x3cbr\x3e\x3cbr\x3eãã®ã¡ãã»ãŒãžãæ¶ãã«ã¯ãå³äžã®é
+ã«ããã¬ã€ã€ãŒåãæ¿ãéšåã§æ°ããåºåºã¬ã€ã€ãŒãéžãã§ãã ããã\x3cbr\x3e\x3cbr\x3eãããããããã¯ Google ãããçšã©ã€ãã©ãªã®ã¹ã¯ãªãããçµã¿èŸŒãŸããŠããªãããããªãã®ãµã€ãã«å¯Ÿå¿ããæ­£ãã API ã­ãŒãèš­å®ãããŠããªãããã§ãã\x3cbr\x3e\x3cbr\x3eéçºè
+ã®æ¹ãž: æ­£ããåäœããããããã«\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eãã¡ãã®ãŠã£ã­\x3c/a\x3eãåç
+§ããŠãã ããã",'getLayerWarning':"${layerType} ã¬ã€ã€ãŒãæ­£ããèª­ã¿èŸŒã¿ãè¡ããŸããã§ããã\x3cbr\x3e\x3cbr\x3eãã®ã¡ãã»ãŒãžãæ¶ãã«ã¯ãå³äžã®é
+ã«ããã¬ã€ã€ãŒåãæ¿ãéšåã§æ°ããåºåºã¬ã€ã€ãŒãéžãã§ãã ããã\x3cbr\x3e\x3cbr\x3eãããããããã¯ ${layerLib} ã©ã€ãã©ãªã®ã¹ã¯ãªãããæ­£ããçµã¿èŸŒãŸããŠããªãããã§ãã\x3cbr\x3e\x3cbr\x3eéçºè
+ã®æ¹ãž: æ­£ããåäœããããããã«\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eãã¡ãã®ãŠã£ã­\x3c/a\x3eãåç
+§ããŠãã ããã",'scale':"çž®å°º = 1 : ${scaleDenom}",'W':"è¥¿",'E':"æ±",'N':"å",'S':"å",'layerAlreadyAdded':"ããªãã¯ã${layerName}ããå°å³ã«è¿œå ããããšè©Šã¿ãŸãããããã®ã¬ã€ã€ãŒã¯æ¢ã«è¿œå ãããŠããŸã",'reprojectDeprecated':"ããªãã¯ã${layerName}ãã¬ã€ã€ãŒã§ reproject ãªãã·ã§ã³ãäœ¿ã£ãŠããŸãããã®ãªãã·ã§ã³ã¯åçšã®åºåºå°å³äžã«æ
+å ±ãè¡šç€ºããç®çã§èš­èšãããŸããããçŸåšã§ã¯ãã®æ©èœã¯ Spherical Mercator ãµããŒããå©çšããŠå®çŸãããŠããããã®ãªãã·ã§ã³ã®äœ¿çšã¯éæšå¥šã§ããè¿œå ã®æ
+å ±ã¯ http://trac.openlayers.org/wiki/SphericalMercator ã§å
+¥æã§ããŸãã",'methodDeprecated':"ãã®ã¡ãœããã¯å»æ­¢ãäºå®ãããŠãããããŒãžã§ã³3.0ã§é€å»ãããŸããä»£ããã« ${newMethod} ãäœ¿çšããŠãã ããã",'boundsAddError':"x ãš y äž¡æ¹ã®å€ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",'lonlatAddError':"lon ãš lat äž¡æ¹ã®å€ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",'pixelAddError':"x ãš y ã®å€äž¡æ¹ã add é¢æ°ã«æž¡ããªããã°ãªããŸããã",'unsupportedGeometryType':"æªå¯Ÿå¿ã®åœ¢ç¶å: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition ãå€±æããŸãã: id ${elemId} ããã€èŠçŽ ãèª€ã£ãäœçœ®ã«ããå¯èœæ§ããããŸãã",'filterEvaluateNotImplemented':"ãã®ãã£ã«ã¿ãŒåã«ã€ããŠ evaluate ã¯å®è£
+ãããŠããŸããã"});OpenLayers.Lang["km"]=OpenLayers.Util.applyDefaults({'permalink':"ááááááá¶ááá¢á
+á·áááááááá",'baseLayer':"ááááá¶áááá¶áâ",'errorLoadingGML':"ááá á»áááá¡á»áááááááá»áá¯ááá¶á GML ${url}",'scale':"áá¶ááááááá¶á = á¡ á ${scaleDenom}"});OpenLayers.Lang["ksh"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Met dÃ€ Antwoot op en Aanfrooch ham_mer nix aanjefange: ${statusText}",'permalink':"Lengk op Duuer",'overlays':"DrÃ¶vver jelaat",'baseLayer':"Jrund-Nivoh",'sameProjection':"De Ãvverseeschs_Kaat deiht et bloÃ, wann se de sÃ€lve ProjÃ€xjuhn bruche deiht, wi de Houp_Kaat",'readNotImplemented':"â\x3ccode lang=\"en\"\x3eread\x3c/code\x3eâ is em Projramm nit fÃŒrjesinn.",'writeNotImplemented':"â\x3ccode lang=\"en\"\x3ewrite\x3c/code\x3eâ is em Projramm nit fÃŒrjesinn.",'noFID':"En Saach, woh kein \x3ci lang=\"en\"\x3eFID\x3c/i\x3e fÃ¶r doh es, lÃ¶ht sesch nit Ã€ndere.",'errorLoadingGML':"FÃ€hler beim \x3ci lang=\"en\"\x3eGML\x3c/i\x3e-Datei-Laade vun \x3ccode\x3e${url}\x3c/code\x3e",'browserNotSupported':"Dinge Brauser kann kein VÃ€ktore uÃjÃ€vve. De Zoote UÃjaabe, di em Momang jon, sen:\n${renderers}",'componentShouldBe':"\x3ccode lang=\"en\"\x3eaddFeatures\x3c/code\x3e: dÃ€ Aandeil sullt vun dÃ€ Zoot â\x3ccode lang=\"en\"\x3e${geomType}\x3c/code\x3eâ sin.",'getFeatureError':"\x3ccode lang=\"en\"\x3egetFeatureFromEvent\x3c/code\x3e es vun enem Nivoh opjeroofe woode, woh et kei Projramm zom UÃjÃ€vve jit. Dat bedÃŒgg fÃ¶r jewÃ¶hnlesch, dat De e Nivoh kapott jemaat hÃ€s, Ã€vver nit e Projramm fÃ¶r domet Ã¶mzejonn, wat domet verbonge es.",'minZoomLevelError':"De Eijeschaff â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ es bloÃ dofÃ¶r jedaach, dat mer se met dÃ€ NivvohÃ bruch, di vun \x3ccode lang=\"en\"\x3eFixedZoomLevels\x3c/code\x3e affhange don. Dat dat \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-Nivvoh Ã¶vverhoup de Eijeschaff â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ prÃ¶hfe deiht, es noch Ã¶vveresch vun frÃ¶hjer. Mer kÃŒnne dat Ã€vver jez nit fott lohÃe, oohne dat mer Jevaa loufe, dat Aanwendunge vun OpenLayers nit mieh loufe, di sesch doh velleijsch noch drop am verlohÃe sin. DrÃ¶m sare mer, dat mer et nit mieh han welle, un de â\x3ccode lang=\"en\"\x3eminZoomLevel\x3c/code\x3eâ-Eijeschaff weed hee vun de Version 3.0 af nit mieh jeprÃ¶Ã¶f wÃ€de. Nemm dofÃ¶r de Enstellung fÃ¶r de hÃŒhÃte un de kleinÃte OplÃ¶hsung, esu wi et en http://trac.openlayers.org/wiki/SettingZoomLevels opjeschrevve es.",'commitSuccess':"DÃ€ \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-VÃ¶rjang es joot jeloufe: ${response}",'commitFailed':"DÃ€ \x3ci lang=\"en\"\x3eWFS\x3c/i\x3e-VÃ¶rjang es scheif jejange: ${response}",'googleWarning':"Dat Nivvoh \x3ccode lang=\"en\"\x3eGoogle\x3c/code\x3e kunnt nit reschtesch jelaade wÃ€Ã€de.\x3cbr /\x3e\x3cbr /\x3eÃm hee di Nohreesch loÃ ze krijje, donn en ander Jrund-Nivvoh uÃsÃ¶hke, rÃ€hÃ bovve en de Ãk.\x3cbr /\x3e\x3cbr /\x3eWascheinlesch es dat wiel dat \x3ci lang=\"en\"\x3eGoogle-Maps\x3c/i\x3e-Skrepp entweeder nit reschtesch enjebonge wood, udder nit dÃ€ reschtejje \x3ci lang=\"en\"\x3eAPI\x3c/i\x3e-SchlÃ¶Ãel fÃ¶r Ding Web-Ãait scheke deiht.\x3cbr /\x3e\x3cbr /\x3eFÃ¶r Projrammierer jidd_et HÃ¶lp do_drÃ¶vver, \x3ca href=\"http://trac.openlayers.org/wiki/Google\" target=\"_blank\"\x3ewi mer dat aan et Loufe brengk\x3c/a\x3e.",'getLayerWarning':"Dat Nivvoh \x3ccode\x3e${layerType}\x3c/code\x3e kunnt nit reschtesch jelaade wÃ€Ã€de.\x3cbr /\x3e\x3cbr /\x3eÃm hee di Nohreesch loÃ ze krijje, donn en ander Jrund-Nivvoh uÃsÃ¶hkre, rÃ€hÃ bovve en de Ãk.\x3cbr /\x3e\x3cbr /\x3eWascheinlesch es dat, wiel dat Skrepp \x3ccode\x3e${layerLib}\x3c/code\x3e nit reschtesch enjebonge wood.\x3cbr /\x3e\x3cbr /\x3eFÃ¶r Projrammierer jidd_Et HÃ¶lp do_drÃ¶vver, \x3ca href=\"http://trac.openlayers.org/wiki/${layerLib}\" target=\"_blank\"\x3ewi mer dat aan et Loufe brengk\x3c/a\x3e.",'scale':"MohÃshtaab = 1 : ${scaleDenom}",'W':"W",'E':"O",'N':"N",'S':"S",'layerAlreadyAdded':"Do hÃ€Ã versÃ¶hk, dat Nivvoh \x3ccode\x3e${layerName}\x3c/code\x3e en di Kaat eren ze brÃ€nge, et wohr Ã€vver ald do dren.",'reprojectDeprecated':"Do bruchs de UÃwahl \x3ccode\x3ereproject\x3c/code\x3e op dÃ€m Nivvoh \x3ccode\x3e${layerName}\x3c/code\x3e. Di UÃwahl es nit mieh jÃ€hn jesinn. Se wohr dofÃ¶r jedaach, Ã¶m Date op jeschÃ€Ã€fsmÃ€Ãesch eruÃ jejovve Kaate bovve drop ze moole, wat Ã€vver enzwesche besser met dÃ€ ÃngershtÃ¶zung fÃ¶r de ÃfÃ€Ã€resche MÃ€kaator Beldscher jeiht. Doh kanns De mieh drÃ¶vver fenge op dÃ€ Sigg: http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Hee di Metood es nim_mih aktoÃ€ll un et weed se en dÃ€ Version 3.0 nit mieh jÃ€vve. Nemm \x3ccode\x3e${newMethod}\x3c/code\x3e dofÃ¶Ã¶r.",'boundsAddError':"Do moÃ beeds vun de \x3ccode\x3ex\x3c/code\x3e un \x3ccode\x3ey\x3c/code\x3e WÃ€Ã€te aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",'lonlatAddError':"Do moÃ beeds \x3ccode\x3elon\x3c/code\x3e un \x3ccode\x3elat\x3c/code\x3e aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",'pixelAddError':"Do moÃ beeds \x3ccode\x3ex\x3c/code\x3e un \x3ccode\x3ey\x3c/code\x3e aan de FungkÃjohn \x3ccode\x3eadd\x3c/code\x3e jÃ€vve.",'unsupportedGeometryType':"De Zoot Jommetrii dom_mer nit ongershtÃ¶ze: \x3ccode\x3e${geomType}\x3c/code\x3e",'pagePositionFailed':"\x3ccode lang=\"en\"\x3eOpenLayers.Util.pagePosition\x3c/code\x3e es donevve jejange: dat Denge met dÃ€ KÃ€nnong \x3ccode\x3e${elemId}\x3c/code\x3e kÃŒnnt am verkeehte Plaz sin.",'filterEvaluateNotImplemented':"â\x3ccode lang=\"en\"\x3eevaluate\x3c/code\x3eâ es fÃ¶r di Zoot Fellter nit enjereschdt."});OpenLayers.Lang["nds"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Unbehannelt TrÃŒchmellels fÃ¶r de Anfraag ${statusText}",'permalink':"Permalink",'overlays':"Overlays",'baseLayer':"Achtergrundkoort",'sameProjection':"De Ãversichtskoort geiht blot, wenn de sÃŒlve Projekschoon as bi de HÃ¶Ã¶ftkoort bruukt warrt",'readNotImplemented':"Lesen is nich inricht.",'writeNotImplemented':"Schrieven is nich inricht.",'noFID':"En Feature, dat keen FID hett, kann nich aktuell maakt warrn.",'errorLoadingGML':"Fehler biât Laden vun de GML-Datei ${url}",'browserNotSupported':"Dien Browser ÃŒnnerstÃŒtt keen Vektorbiller. ÃnnerstÃŒtt Renderers:\n${renderers}",'componentShouldBe':"addFeatures : Kumponent schull man den Typ ${geomType} hebben",'getFeatureError':"getFeatureFromEvent is von en Laag ahn Render opropen worrn. Dat bedÃŒÃŒdt normalerwies, dat en Laag wegmaakt worrn is, aver nich de Handler, de dor op verwiest.",'commitSuccess':"WFS-Transakschoon: hett klappt ${response}",'commitFailed':"WFS-Transakschoon: hett nich klappt ${response}",'scale':"Skaal = 1 : ${scaleDenom}",'layerAlreadyAdded':"Du versÃ¶chst de Laag â${layerName}â to de Koort totofÃ¶gen, man de is al tofÃ¶Ã¶gt",'methodDeprecated':"Disse Methood is oold un schall dat in 3.0 nich mehr geven. Bruuk dor man beter ${newMethod} fÃ¶r.",'boundsAddError':"De Weert x un y, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",'lonlatAddError':"De Weert lon un lat, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",'pixelAddError':"De Weert x un y, de mÃ¶Ã¶t all beid an de add-Funkschoon Ã¶vergeven warrn.",'unsupportedGeometryType':"Nich ÃŒnnerstÃŒtt Geometrie-Typ: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition gÃŒng nich: Element mit de Id ${elemId} is villicht anân verkehrten Platz."});OpenLayers.Lang["nn"]=OpenLayers.Util.applyDefaults({'scale':"Skala = 1 : ${scaleDenom}",'layerAlreadyAdded':"Du freista Ã¥ leggja til laget Â«${layerName}Â» pÃ¥ kartet, men det har alt vorte lagt til.",'boundsAddError':"Du er nÃžydd til Ã¥ gje bÃ¥de ein x- og ein y-verdi til Â«addÂ»-funksjonen.",'lonlatAddError':"Du er nÃžydd til Ã¥ gje bÃ¥de lon- og lat-verdiar til Â«addÂ»-funksjonen.",'pixelAddError':"Du er nÃžydd til Ã¥ gje bÃ¥de ein x- og ein y-verdi til Â«addÂ»-funksjonen."});OpenLayers.Lang["oc"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"RequÃšsta pas gerida, retorna ${statusText}",'permalink':"Permaligam",'overlays':"Calques",'baseLayer':"Calc de basa",'sameProjection':"La carta de situacion fonciona pas que quora sa projeccion es la meteissa que la de la carta principala",'readNotImplemented':"Lectura pas implementada.",'writeNotImplemented':"Escritura pas implementada.",'noFID':"Impossible de metre a jorn un objÃšcte sens identificant (fid).",'errorLoadingGML':"Error al cargament del fichiÃšr GML ${url}",'browserNotSupported':"VÃ²stre navegidor supÃ²rta pas lo rendut vectorial. Los renderers actualament suportats son : \n${renderers}",'componentShouldBe':"addFeatures : lo compausant deuriÃ¡ Ãšsser de tipe ${geomType}",'getFeatureError':"getFeatureFromEvent es estat apelat sus un calc sens renderer. AquÃ² significa generalament qu\'avÃštz destruch aqueste jaÃ§, mas qu\'avÃštz conservat un handler que li Ãšra associat.",'minZoomLevelError':"La proprietat minZoomLevel deu Ãšsser utilizada solament per de jaces FixedZoomLevels-descendent. Lo fach qu\'aqueste jaÃ§ WFS verifique la presÃ©ncia de minZoomLevel es una relica del passat. ÃaquelÃ , la podÃšm suprimir sens copar d\'aplicacions que ne poiriÃ¡n dependre. Es per aquÃ² que la depreciam -- la verificacion del minZoomLevel serÃ  suprimida en version 3.0. A la plaÃ§a, mercÃ©s d\'utilizar los paramÃštres de resolucions min/max tal coma descrich sus : http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Transaccion WFS : SUCCES ${response}",'commitFailed':"Transaccion WFS : FRACAS ${response}",'googleWarning':"Lo jaÃ§ Google es pas estat en mesura de se cargar corrÃšctament.\x3cbr\x3e\x3cbr\x3ePer suprimir aqueste messatge, causissÃštz una BaseLayer novÃšla dins lo selector de jaÃ§ en naut a drecha.\x3cbr\x3e\x3cbr\x3eAquÃ² es possiblament causat par la non-inclusion de la librariÃ¡ Google Maps, o alara perque que la clau de l\'API correspond pas a vÃ²stre site.\x3cbr\x3e\x3cbr\x3eDesvolopaires : per saber cossÃ­ corregir aquÃ², \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclicatz aicÃ­\x3c/a\x3e",'getLayerWarning':"Lo jaÃ§ ${layerType} es pas en mesura de se cargar corrÃšctament.\x3cbr\x3e\x3cbr\x3ePer suprimir aqueste messatge, causissÃštz una  BaseLayer novÃšla dins lo selector de jaÃ§ en naut a drecha.\x3cbr\x3e\x3cbr\x3eAquÃ² es possiblament causat per la non-inclusion de la librariÃ¡ ${layerLib}.\x3cbr\x3e\x3cbr\x3eDesvolopaires : per saber cossÃ­ corregir aquÃ­, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclicatz aicÃ­\x3c/a\x3e",'scale':"Escala ~ 1 : ${scaleDenom}",'W':"O",'E':"Ã",'N':"N",'S':"S",'layerAlreadyAdded':"AvÃštz ensajat d\'apondre a la carta lo calc : ${layerName}, mas ja es present",'reprojectDeprecated':"Utilizatz l\'opcion \'reproject\' sul jaÃ§ ${layerName}. Aquesta opcion es despreciada : Son usatge permetiÃ¡ d\'afichar de donadas al dessÃºs de jaces raster comercials. Aquesta foncionalitat ara es suportada en utilizant lo supÃ²rt de la projeccion Mercator Esferica. Mai d\'informacion es disponibla sus http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Aqueste metÃ²de es despreciada, e serÃ  suprimida a la version 3.0. MercÃ©s d\'utilizar ${newMethod} a la plaÃ§a.",'boundsAddError':"Vos cal passar las doas valors x e y a la foncion add.",'lonlatAddError':"Vos cal passar las doas valors lon e lat a la foncion add.",'pixelAddError':"Vos cal passar las doas valors x e y a la foncion add.",'unsupportedGeometryType':"Tipe de geometria pas suportat : ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition a fracassat : l\'element d\'id ${elemId} poiriÃ¡ Ãšsser mal posicionat.",'filterEvaluateNotImplemented':"evaluar es pas encara estat implementat per aqueste tipe de filtre."});OpenLayers.Lang["pt"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"Servidor devolveu erro nÃ£o contemplado ${statusText}",'permalink':"LigaÃ§Ã£o permanente",'overlays':"SobreposiÃ§Ãµes",'baseLayer':"Camada Base",'sameProjection':"O mapa panorÃ¢mico sÃ³ funciona quando estÃ¡ na mesma projeÃ§Ã£o que o mapa principal",'readNotImplemented':"Leitura nÃ£o implementada.",'writeNotImplemented':"Escrita nÃ£o implementada.",'noFID':"NÃ£o Ã© possÃ­vel atualizar um elemento para a qual nÃ£o hÃ¡ FID.",'errorLoadingGML':"Erro ao carregar ficheiro GML ${url}",'browserNotSupported':"O seu navegador nÃ£o suporta renderizaÃ§Ã£o vetorial. Actualmente os renderizadores suportados sÃ£o:\n${renderers}",'componentShouldBe':"addFeatures: componente deve ser um(a) ${geomType}",'getFeatureError':"getFeatureFromEvent foi chamado numa camada sem renderizador. Isto normalmente significa que destruiu uma camada, mas nÃ£o um manipulador \'\'(handler)\'\' que lhe estÃ¡ associado.",'minZoomLevelError':"A propriedade minZoomLevel sÃ³ deve ser usada com as camadas descendentes da FixedZoomLevels. A verificaÃ§Ã£o da propriedade por esta camada wfs Ã© uma relÃ­quia do passado. No entanto, nÃ£o podemos removÃª-la sem correr o risco de afectar aplicaÃ§Ãµes OL que dependam dela. Portanto, estamos a tornÃ¡-la obsoleta -- a verificaÃ§Ã£o minZoomLevel serÃ¡ removida na versÃ£o 3.0. Em vez dela, por favor, use as opÃ§Ãµes de resoluÃ§Ã£o min/max descritas aqui: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"TransacÃ§Ã£o WFS: SUCESSO ${response}",'commitFailed':"TransacÃ§Ã£o WFS: FALHOU ${response}",'googleWarning':"A Camada Google nÃ£o foi correctamente carregada.\x3cbr\x3e\x3cbr\x3ePara deixar de receber esta mensagem, seleccione uma nova Camada-Base no \'\'switcher\'\' de camadas no canto superior direito.\x3cbr\x3e\x3cbr\x3eProvavelmente, isto acontece porque o \'\'script\'\' da biblioteca do Google Maps nÃ£o foi incluÃ­do ou nÃ£o contÃ©m a chave API correcta para o seu sÃ­tio.\x3cbr\x3e\x3cbr\x3eProgramadores: Para ajuda sobre como solucionar o problema \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eclique aqui\x3c/a\x3e .",'getLayerWarning':"A camada ${layerType} nÃ£o foi correctamente carregada.\x3cbr\x3e\x3cbr\x3ePara desactivar esta mensagem, seleccione uma nova Camada-Base no \'\'switcher\'\' de camadas no canto superior direito.\x3cbr\x3e\x3cbr\x3eProvavelmente, isto acontece porque o \'\'script\'\' da biblioteca ${layerLib} nÃ£o foi incluÃ­do correctamente.\x3cbr\x3e\x3cbr\x3eProgramadores: Para ajuda sobre como solucionar o problema \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eclique aqui\x3c/a\x3e .",'scale':"Escala = 1 : ${scaleDenom}",'W':"O",'E':"E",'N':"N",'S':"S",'layerAlreadyAdded':"VocÃª tentou adicionar a camada: ${layerName} ao mapa, mas ela jÃ¡ tinha sido adicionada antes",'reprojectDeprecated':"EstÃ¡ usando a opÃ§Ã£o \'reproject\' na camada ${layerName}. Esta opÃ§Ã£o Ã© obsoleta: foi concebida para permitir a apresentaÃ§Ã£o de dados sobre mapas-base comerciais, mas esta funcionalidade Ã© agora suportada pelo Mercator EsfÃ©rico. Mais informaÃ§Ã£o estÃ¡ disponÃ­vel em http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Este mÃ©todo foi declarado obsoleto e serÃ¡ removido na versÃ£o 3.0. Por favor, use ${newMethod} em vez disso.",'boundsAddError':"VocÃª deve passar tanto o valor x como o y Ã  funÃ§Ã£o de adiÃ§Ã£o.",'lonlatAddError':"VocÃª deve passar tanto o valor lon como o lat Ã  funÃ§Ã£o de adiÃ§Ã£o.",'pixelAddError':"VocÃª deve passar tanto o valor x como o y Ã  funÃ§Ã£o de adiÃ§Ã£o.",'unsupportedGeometryType':"Tipo de geometria nÃ£o suportado: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition falhou: o elemento com o id ${elemId} poderÃ¡ estar mal-posicionado.",'filterEvaluateNotImplemented':"avaliar nÃ£o estÃ¡ implementado para este tipo de filtro."});OpenLayers.Lang["ru"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"ÐÐµÐŸÐ±ÑÐ°Ð±ÐŸÑÐ°ÐœÐœÑÐ¹ Ð·Ð°Ð¿ÑÐŸÑ Ð²ÐµÑÐœÑÐ» ${statusText}",'permalink':"ÐÐŸÑÑÐŸÑÐœÐœÐ°Ñ ÑÑÑÐ»ÐºÐ°",'overlays':"Ð¡Ð»ÐŸÐž",'baseLayer':"ÐÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹",'sameProjection':"ÐÐ±Ð·ÐŸÑÐœÐ°Ñ ÐºÐ°ÑÑÐ° ÑÐ°Ð±ÐŸÑÐ°ÐµÑ ÑÐŸÐ»ÑÐºÐŸ ÑÐŸÐ³ÐŽÐ°, ÐºÐŸÐ³ÐŽÐ° ÐžÐŒÐµÐµÑ ÑÑ Ð¶Ðµ Ð¿ÑÐŸÐµÐºÑÐžÑ, ÑÑÐŸ Ðž ÐŸÑÐœÐŸÐ²ÐœÐ°Ñ",'readNotImplemented':"Ð§ÑÐµÐœÐžÐµ ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐŸ.",'writeNotImplemented':"ÐÐ°Ð¿ÐžÑÑ ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐ°.",'noFID':"ÐÐµÐ²ÐŸÐ·ÐŒÐŸÐ¶ÐœÐŸ ÐŸÐ±ÐœÐŸÐ²ÐžÑÑ ÐŸÐ±ÑÐµÐºÑ, ÐŽÐ»Ñ ÐºÐŸÑÐŸÑÐŸÐ³ÐŸ ÐœÐµÑ FID.",'errorLoadingGML':"ÐÑÐžÐ±ÐºÐ° Ð¿ÑÐž Ð·Ð°Ð³ÑÑÐ·ÐºÐµ ÑÐ°Ð¹Ð»Ð° GML ${url}",'browserNotSupported':"ÐÐ°Ñ Ð±ÑÐ°ÑÐ·ÐµÑ ÐœÐµ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÐµÑ Ð²ÐµÐºÑÐŸÑÐœÑÑ Ð³ÑÐ°ÑÐžÐºÑ. ÐÐ° ÐŽÐ°ÐœÐœÑÐ¹ ÐŒÐŸÐŒÐµÐœÑ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÑÑÑÑ:\n${renderers}",'componentShouldBe':"addFeatures: ÐºÐŸÐŒÐ¿ÐŸÐœÐµÐœÑ ÐŽÐŸÐ»Ð¶ÐµÐœ Ð±ÑÑÑ ${geomType}",'getFeatureError':"getFeatureFromEvent Ð²ÑÐ·Ð²Ð°Ðœ ÐŽÐ»Ñ ÑÐ»ÐŸÑ Ð±ÐµÐ· ÑÐµÐœÐŽÐµÑÐµÑÐ°. ÐÐ±ÑÑÐœÐŸ ÑÑÐŸ Ð³ÐŸÐ²ÐŸÑÐžÑ ÐŸ ÑÐŸÐŒ, ÑÑÐŸ Ð²Ñ ÑÐœÐžÑÑÐŸÐ¶ÐžÐ»Ðž ÑÐ»ÐŸÐ¹, ÐœÐŸ ÐŸÑÑÐ°Ð²ÐžÐ»Ðž ÑÐ²ÑÐ·Ð°ÐœÐœÑÐ¹ Ñ ÐœÐžÐŒ ÐŸÐ±ÑÐ°Ð±ÐŸÑÑÐžÐº.",'minZoomLevelError':"Ð¡Ð²ÐŸÐ¹ÑÑÐ²ÐŸ minZoomLevel Ð¿ÑÐµÐŽÐœÐ°Ð·ÐœÐ°ÑÐµÐœÐŸ ÑÐŸÐ»ÑÐºÐŸ ÐŽÐ»Ñ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÐŸÐ²Ð°ÐœÐžÑ ÑÐŸ ÑÐ»ÐŸÑÐŒÐž, ÑÐ²Ð»ÑÑÑÐžÐŒÐžÑÑ Ð¿ÐŸÑÐŸÐŒÐºÐ°ÐŒÐž FixedZoomLevels. Ð¢ÐŸ, ÑÑÐŸ ÑÑÐŸÑ WFS-ÑÐ»ÐŸÐ¹ Ð¿ÑÐŸÐ²ÐµÑÑÐµÑÑÑ ÐœÐ° minZoomLevel â ÑÐµÐ»ÐžÐºÑ Ð¿ÑÐŸÑÐ»ÐŸÐ³ÐŸ. ÐÐŽÐœÐ°ÐºÐŸ ÐŒÑ ÐœÐµ ÐŒÐŸÐ¶ÐµÐŒ ÑÐŽÐ°Ð»ÐžÑÑ ÑÑÑ ÑÑÐœÐºÑÐžÑ, ÑÐ°Ðº ÐºÐ°Ðº, Ð²ÐŸÐ·ÐŒÐŸÐ¶ÐœÐŸ, ÐŸÑ ÐœÐµÑ Ð·Ð°Ð²ÐžÑÑÑ ÐœÐµÐºÐŸÑÐŸÑÑÐµ ÐŸÑÐœÐŸÐ²Ð°ÐœÐœÑÐµ ÐœÐ° OpenLayers Ð¿ÑÐžÐ»ÐŸÐ¶ÐµÐœÐžÑ. Ð€ÑÐœÐºÑÐžÑ ÐŸÐ±ÑÑÐ²Ð»ÐµÐœÐ° ÑÑÑÐ°ÑÐµÐ²ÑÐµÐ¹ â Ð¿ÑÐŸÐ²ÐµÑÐºÐ° minZoomLevel Ð±ÑÐŽÐµÑ ÑÐŽÐ°Ð»ÐµÐœÐ° Ð² 3.0. ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ°, ÐžÑÐ¿ÐŸÐ»ÑÐ·ÑÐ¹ÑÐµ Ð²ÐŒÐµÑÑÐŸ ÐœÐµÑ ÐœÐ°ÑÑÑÐŸÐ¹ÐºÑ ÐŒÐžÐœ/ÐŒÐ°ÐºÑ ÑÐ°Ð·ÑÐµÑÐµÐœÐžÑ, ÐŸÐ¿ÐžÑÐ°ÐœÐœÑÑ Ð·ÐŽÐµÑÑ: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Ð¢ÑÐ°ÐœÐ·Ð°ÐºÑÐžÑ WFS: Ð£Ð¡ÐÐÐšÐÐ ${response}",'commitFailed':"Ð¢ÑÐ°ÐœÐ·Ð°ÐºÑÐžÑ WFS: ÐÐšÐÐÐÐ ${response}",'googleWarning':"Ð¡Ð»ÐŸÐ¹ Google ÐœÐµ ÑÐŽÐ°Ð»ÐŸÑÑ ÐœÐŸÑÐŒÐ°Ð»ÑÐœÐŸ Ð·Ð°Ð³ÑÑÐ·ÐžÑÑ.\x3cbr\x3e\x3cbr\x3eÐ§ÑÐŸÐ±Ñ ÐžÐ·Ð±Ð°Ð²ÐžÑÑÑÑ ÐŸÑ ÑÑÐŸÐ³ÐŸ ÑÐŸÐŸÐ±ÑÐµÐœÐžÑ, Ð²ÑÐ±ÐžÑÐµ ÐŽÑÑÐ³ÐŸÐ¹ ÐŸÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹ Ð² Ð¿ÐµÑÐµÐºÐ»ÑÑÐ°ÑÐµÐ»Ðµ Ð² Ð¿ÑÐ°Ð²ÐŸÐŒ Ð²ÐµÑÑ
+ÐœÐµÐŒ ÑÐ³Ð»Ñ.\x3cbr\x3e\x3cbr\x3eÐ¡ÐºÐŸÑÐµÐµ Ð²ÑÐµÐ³ÐŸ, Ð¿ÑÐžÑÐžÐœÐ° Ð² ÑÐŸÐŒ, ÑÑÐŸ Ð±ÐžÐ±Ð»ÐžÐŸÑÐµÐºÐ° Google Maps ÐœÐµ Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐžÐ»Ðž ÐœÐµ ÑÐŸÐŽÐµÑÐ¶ÐžÑ ÐºÐŸÑÑÐµÐºÑÐœÐŸÐ³ÐŸ API-ÐºÐ»ÑÑÐ° ÐŽÐ»Ñ Ð²Ð°ÑÐµÐ³ÐŸ ÑÐ°Ð¹ÑÐ°.\x3cbr\x3e\x3cbr\x3eÐ Ð°Ð·ÑÐ°Ð±ÐŸÑÑÐžÐºÐ°ÐŒ: ÑÑÐŸÐ±Ñ ÑÐ·ÐœÐ°ÑÑ, ÐºÐ°Ðº ÑÐŽÐµÐ»Ð°ÑÑ, ÑÑÐŸÐ±Ñ Ð²ÑÑ Ð·Ð°ÑÐ°Ð±ÐŸÑÐ°Ð»ÐŸ, \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eÑÑÐ»ÐºÐœÐžÑÐµ ÑÑÑ\x3c/a\x3e",'getLayerWarning':"Ð¡Ð»ÐŸÐ¹ ${layerType} ÐœÐµ ÑÐŽÐ°Ð»ÐŸÑÑ ÐœÐŸÑÐŒÐ°Ð»ÑÐœÐŸ Ð·Ð°Ð³ÑÑÐ·ÐžÑÑ. \x3cbr\x3e\x3cbr\x3eÐ§ÑÐŸÐ±Ñ ÐžÐ·Ð±Ð°Ð²ÐžÑÑÑÑ ÐŸÑ ÑÑÐŸÐ³ÐŸ ÑÐŸÐŸÐ±ÑÐµÐœÐžÑ, Ð²ÑÐ±ÐžÑÐµ ÐŽÑÑÐ³ÐŸÐ¹ ÐŸÑÐœÐŸÐ²ÐœÐŸÐ¹ ÑÐ»ÐŸÐ¹ Ð² Ð¿ÐµÑÐµÐºÐ»ÑÑÐ°ÑÐµÐ»Ðµ Ð² Ð¿ÑÐ°Ð²ÐŸÐŒ Ð²ÐµÑÑ
+ÐœÐµÐŒ ÑÐ³Ð»Ñ.\x3cbr\x3e\x3cbr\x3eÐ¡ÐºÐŸÑÐµÐµ Ð²ÑÐµÐ³ÐŸ, Ð¿ÑÐžÑÐžÐœÐ° Ð² ÑÐŸÐŒ, ÑÑÐŸ Ð±ÐžÐ±Ð»ÐžÐŸÑÐµÐºÐ° ${layerLib} ÐœÐµ Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐžÐ»Ðž Ð±ÑÐ»Ð° Ð²ÐºÐ»ÑÑÐµÐœÐ° ÐœÐµÐºÐŸÑÑÐµÐºÑÐœÐŸ.\x3cbr\x3e\x3cbr\x3eÐ Ð°Ð·ÑÐ°Ð±ÐŸÑÑÐžÐºÐ°ÐŒ: ÑÑÐŸÐ±Ñ ÑÐ·ÐœÐ°ÑÑ, ÐºÐ°Ðº ÑÐŽÐµÐ»Ð°ÑÑ, ÑÑÐŸÐ±Ñ Ð²ÑÑ Ð·Ð°ÑÐ°Ð±ÐŸÑÐ°Ð»ÐŸ, \x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eÑÑÐ»ÐºÐœÐžÑÐµ ÑÑÑ\x3c/a\x3e",'scale':"ÐÐ°ÑÑÑÐ°Ð± = 1 : ${scaleDenom}",'W':"Ð",'E':"Ð",'N':"Ð¡",'S':"Ð®",'layerAlreadyAdded':"ÐÑ Ð¿ÐŸÐ¿ÑÑÐ°Ð»ÐžÑÑ ÐŽÐŸÐ±Ð°Ð²ÐžÑÑ ÑÐ»ÐŸÐ¹ Â«${layerName}Â» ÐœÐ° ÐºÐ°ÑÑÑ, ÐœÐŸ ÐŸÐœ ÑÐ¶Ðµ Ð±ÑÐ» ÐŽÐŸÐ±Ð°Ð²Ð»ÐµÐœ",'reprojectDeprecated':"ÐÑ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÑÐµÑÐµ ÐŸÐ¿ÑÐžÑ \'reproject\' ÐŽÐ»Ñ ÑÐ»ÐŸÑ ${layerName}. Ð­ÑÐ° ÐŸÐ¿ÑÐžÑ ÑÐ²Ð»ÑÐµÑÑÑ ÑÑÑÐ°ÑÐµÐ²ÑÐµÐ¹: ÐµÐµ ÐžÑÐ¿ÐŸÐ»ÑÐ·ÐŸÐ²Ð°ÐœÐžÐµ Ð¿ÑÐµÐŽÐ¿ÐŸÐ»Ð°Ð³Ð°Ð»ÐŸÑÑ ÐŽÐ»Ñ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐºÐž Ð¿ÐŸÐºÐ°Ð·Ð° ÐŽÐ°ÐœÐœÑÑ
+ Ð¿ÐŸÐ²ÐµÑÑ
+ ÐºÐŸÐŒÐŒÐµÑÑÐµÑÐºÐžÑ
+ Ð±Ð°Ð·ÐŸÐ²ÑÑ
+ ÐºÐ°ÑÑ, ÐœÐŸ ÑÐµÐ¿ÐµÑÑ ÑÑÐŸÑ ÑÑÐœÐºÑÐžÐŸÐœÐ°Ð» ÐœÐµÑÑÑ Ð²ÑÑÑÐŸÐµÐœÐœÐ°Ñ Ð¿ÐŸÐŽÐŽÐµÑÐ¶ÐºÐ° ÑÑÐµÑÐžÑÐµÑÐºÐŸÐ¹ Ð¿ÑÐŸÐµÐºÑÐžÐž ÐÐµÑÐºÐ°ÑÐŸÑÐ°. ÐÐŸÐ»ÑÑÐµ ÑÐ²ÐµÐŽÐµÐœÐžÐ¹ ÐŽÐŸÑÑÑÐ¿ÐœÐŸ ÐœÐ° http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"Ð­ÑÐŸÑ ÐŒÐµÑÐŸÐŽ ÑÑÐžÑÐ°ÐµÑÑÑ ÑÑÑÐ°ÑÐµÐ²ÑÐžÐŒ Ðž Ð±ÑÐŽÐµÑ ÑÐŽÐ°Ð»ÑÐœ Ð² Ð²ÐµÑÑÐžÐž 3.0. ÐÐŸÐ¶Ð°Ð»ÑÐ¹ÑÑÐ°, Ð¿ÐŸÐ»ÑÐ·ÑÐ¹ÑÐµÑÑ ${newMethod}.",'boundsAddError':"Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, x Ðž y.",'lonlatAddError':"Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, lon Ðž lat.",'pixelAddError':"Ð€ÑÐœÐºÑÐžÐž add ÐœÐ°ÐŽÐŸ Ð¿ÐµÑÐµÐŽÐ°Ð²Ð°ÑÑ ÐŸÐ±Ð° Ð·ÐœÐ°ÑÐµÐœÐžÑ, x Ðž y.",'unsupportedGeometryType':"ÐÐµÐ¿ÐŸÐŽÐŽÐµÑÐ¶ÐžÐ²Ð°ÐµÐŒÑÐ¹ ÑÐžÐ¿ Ð³ÐµÐŸÐŒÐµÑÑÐžÐž: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition failed: ÑÐ»ÐµÐŒÐµÐœÑ Ñ id ${elemId} ÐŒÐŸÐ¶ÐµÑ ÐœÐ°Ñ
+ÐŸÐŽÐžÑÑÑÑ ÐœÐµ Ð² ÐœÑÐ¶ÐœÐŸÐŒ ÐŒÐµÑÑÐµ.",'filterEvaluateNotImplemented':"evaluate ÐœÐµ ÑÐµÐ°Ð»ÐžÐ·ÐŸÐ²Ð°ÐœÐŸ ÐŽÐ»Ñ ÑÐžÐ»ÑÑÑÐ° ÐŽÐ°ÐœÐœÐŸÐ³ÐŸ ÑÐžÐ¿Ð°."});OpenLayers.Lang["sk"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"NeobslÃºÅŸenÃ© poÅŸiadavky vracajÃº ${statusText}",'permalink':"TrvalÃœ odkaz",'overlays':"Prekrytia",'baseLayer':"ZÃ¡kladnÃ¡ vrstva",'sameProjection':"PrehÄŸadovÃ¡ mapka funguje iba vtedy, keÄ je v rovnakej projekcii ako hlavnÃ¡ mapa",'readNotImplemented':"ÄÃ­tanie nie je implementovanÃ©.",'writeNotImplemented':"ZÃ¡pis nie je implementovanÃœ.",'noFID':"Nie je moÅŸnÃ© aktualizovaÅ¥ vlastnosÅ¥, pre ktorÃº neexistuje FID.",'errorLoadingGML':"Chyba pri naÄÃ­tanÃ­ sÃºboru GML ${url}",'browserNotSupported':"VÃ¡Å¡ prehliadaÄ nepodporuje vykresÄŸovanie vektorov. MomentÃ¡lne podporovanÃ© vykresÄŸovaÄe sÃº:\n${renderers}",'componentShouldBe':"addFeatures: komponent by mal byÅ¥ ${geomType}",'getFeatureError':"getFeatureFromEvent bola zavolanÃ¡ na vrstve bez vykresÄŸovaÄa. To zvyÄajne znamenÃ¡, ÅŸe ste odstrÃ¡nili vrstvu, ale nie niektorÃº z obslÃºh, ktorÃ¡ je s Åou asociovanÃ¡.",'minZoomLevelError':"VlastnosÅ¥ minZoomLevel je urÄenÃœ iba na pouÅŸitie s vrstvami odvodenÃœmi od FixedZoomLevels. To, ÅŸe tÃ¡to wfs vrstva kontroluje minZoomLevel je pozostatok z minulosti. NemÃŽÅŸeme ho vÅ¡ak odstrÃ¡niÅ¥, aby sme sa vyhli moÅŸnÃ©mu poruÅ¡eniu aplikÃ¡ciÃ­ zaloÅŸenÃœch na Open Layers, ktorÃ© na tomto mÃŽÅŸe zÃ¡visieÅ¥. Preto ho oznaÄujeme ako zavrhovanÃœ - dolu uvedenÃ¡ kontrola minZoomLevel bude odstrÃ¡nenÃ¡ vo verzii 3.0. PouÅŸite prosÃ­m namiesto toho kontrolu min./max. rozlÃ­Å¡enia podÄŸa tu uvedenÃ©ho popisu: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Transakcia WFS: ÃSPEÅ NÃ ${response}",'commitFailed':"Transakcia WFS: ZLYHALA ${response}",'googleWarning':"Vrstvu Google nebolo moÅŸnÃ© sprÃ¡vne naÄÃ­taÅ¥.\x3cbr\x3e\x3cbr\x3eAby ste sa tejto sprÃ¡vy zbavili vyberte novÃº BaseLayer v prepÃ­naÄi vrstiev v pravom hornom rohu.\x3cbr\x3e\x3cbr\x3eToto sa stalo pravdepodobne preto, ÅŸe skript kniÅŸnice Google Maps buÄ nebol naÄÃ­tanÃœ alebo neobsahuje sprÃ¡vny kÄŸÃºÄ API pre vaÅ¡u lokalitu.\x3cbr\x3e\x3cbr\x3eVÃœvojÃ¡ri: Tu mÃŽÅŸete zÃ­skaÅ¥ \x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3epomoc so sfunkÄnenÃ­m\x3c/a\x3e",'getLayerWarning':"Vrstvu ${layerType} nebolo moÅŸnÃ© sprÃ¡vne naÄÃ­taÅ¥.\x3cbr\x3e\x3cbr\x3eAby ste sa tejto sprÃ¡vy zbavili vyberte novÃº BaseLayer v prepÃ­naÄi vrstiev v pravom hornom rohu.\x3cbr\x3e\x3cbr\x3eToto sa stalo pravdepodobne preto, ÅŸe skript kniÅŸnice ${layerType} buÄ nebol naÄÃ­tanÃœ alebo neobsahuje sprÃ¡vny kÄŸÃºÄ API pre vaÅ¡u lokalitu.\x3cbr\x3e\x3cbr\x3eVÃœvojÃ¡ri: Tu mÃŽÅŸete zÃ­skaÅ¥ \x3ca href=\'http://trac.openlayers.org/wiki/${layerType}\' target=\'_blank\'\x3epomoc so sfunkÄnenÃ­m\x3c/a\x3e",'scale':"Mierka = 1 : ${scaleDenom}",'layerAlreadyAdded':"PokÃºsili ste sa do mapy pridaÅ¥ vrstvu ${layerName}, ale tÃ¡ uÅŸ bola pridanÃ¡",'reprojectDeprecated':"PouÅŸÃ­vate voÄŸby âreprojectâ vrstvy ${layerType}. TÃ¡to voÄŸba je zzavrhovanÃ¡: jej pouÅŸitie bolo navrhnutÃ© na podporu zobrazovania Ãºdajov nad komerÄnÃœmi zÃ¡kladovÃœmi mapami, ale tÃºto funkcionalitu je teraz moÅŸnÃ© dosiahnuÅ¥ pomocou Spherical Mercator. ÄalÅ¡ie informÃ¡cie zÃ­skate na strÃ¡nke http://trac.openlayers.org/wiki/SphericalMercator.",'methodDeprecated':"TÃ¡to metÃ³da je zavrhovanÃ¡ a bude odstrÃ¡nenÃ¡ vo verzii 3.0. PouÅŸite prosÃ­m namiesto nej metÃ³du ${newMethod}.",'boundsAddError':"SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty x aj y.",'lonlatAddError':"SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty lon (zem. dÄºÅŸka) aj lat (zem. Å¡Ã­rka).",'pixelAddError':"SÄÃ­tacej funkcii musÃ­te daÅ¥ hodnoty x aj y.",'unsupportedGeometryType':"NepodporovanÃœ typ geometrie: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition zlyhalo: prvok s id ${elemId} mÃŽÅŸe byÅ¥ zle umiestnenÃœ.",'filterEvaluateNotImplemented':"evaluate nie je implementovanÃœ pre tento typ filtra"});OpenLayers.Lang["te"]=OpenLayers.Util.applyDefaults({'permalink':"à°žà±à°¥à°¿à°°à°²à°¿à°à°à±",'W':"à°ª",'E':"à°€à±",'N':"à°",'S':"à°Š"});OpenLayers.Lang["vi"]=OpenLayers.Util.applyDefaults({'unhandledRequest':"KhÃŽng xá»­ lÃœ ÄÆ°á»£c pháº£n há»i ${statusText} cho yÃªu cáº§u",'permalink':"LiÃªn káº¿t thÆ°á»ng trá»±c",'overlays':"Láº¥p báº£n Äá»",'baseLayer':"Lá»p ná»n",'sameProjection':"Báº£n Äá» toÃ n cáº£nh chá» hoáº¡t Äá»ng khi cÃ¹ng phÃ©p chiáº¿u vá»i báº£n Äá» chÃ­nh",'readNotImplemented':"ChÆ°a há» trá»£ chá»©c nÄng Äá»c.",'writeNotImplemented':"ChÆ°a há» trá»£ chá»©c nÄng viáº¿t.",'noFID':"KhÃŽng thá» cáº­p nháº­t tÃ­nh nÄng thiáº¿u FID.",'errorLoadingGML':"Lá»i táº£i táº­p tin GML táº¡i ${url}",'browserNotSupported':"TrÃ¬nh duyá»t cá»§a báº¡n khÃŽng há» trá»£ chá»©c nÄng váºœ báº±ng vectÆ¡. Hiá»n há» trá»£ cÃ¡c bá» káº¿t xuáº¥t:\n${renderers}",'componentShouldBe':"addFeatures: bá» pháº­n cáº§n pháº£i lÃ  ${geomType}",'getFeatureError':"getFeatureFromEvent ÄÆ°á»£c gá»i tá»« lá»p khÃŽng cÃ³ bá» káº¿t xuáº¥t. ThÆ°á»ng thÃ¬ cÃ³ láºœ lá»p bá» xÃ³a nhÆ°ng má»t pháº§n xá»­ lÃœ cá»§a nÃ³ váº«n cÃ²n.",'minZoomLevelError':"Chá» nÃªn sá»­ dá»¥ng thuá»c tÃ­nh minZoomLevel vá»i cÃ¡c lá»p FixedZoomLevels-descendent. Viá»c lá»p wfs nÃ y tÃ¬m cho minZoomLevel lÃ  di tÃ­ch cÃ²n láº¡i tá»« xÆ°a. Tuy nhiÃªn, náº¿u chÃºng tÃŽi dá»i nÃ³ thÃ¬ sáºœ vá»¡ cÃ¡c chÆ°Æ¡ng trÃ¬nh OpenLayers mÃ  dá»±a trÃªn nÃ³. Bá»i váº­y chÃºng tÃŽi pháº£n Äá»i sá»­ dá»¥ng nÃ³\x26nbsp;â bÆ°á»c tÃ¬m cho minZoomLevel sáºœ ÄÆ°á»£c dá»i vÃ o phiÃªn báº£n 3.0. Xin sá»­ dá»¥ng thiáº¿t láº­p Äá» phÃ¢n tÃ­ch tá»i thiá»u / tá»i Äa thay tháº¿, theo hÆ°á»ng dáº«n nÃ y: http://trac.openlayers.org/wiki/SettingZoomLevels",'commitSuccess':"Giao dá»ch WFS: THÃNH CÃNG ${response}",'commitFailed':"Giao dá»ch WFS: THáº€T Báº I ${response}",'googleWarning':"KhÃŽng thá» táº£i lá»p Google ÄÃºng Äáº¯n.\x3cbr\x3e\x3cbr\x3eÄá» trÃ¡nh thÃŽng bÃ¡o nÃ y láº§n sau, hÃ£y chá»n BaseLayer má»i dÃ¹ng Äiá»u khiá»n chá»n lá»p á» gÃ³c trÃªn pháº£i.\x3cbr\x3e\x3cbr\x3eCháº¯c script thÆ° viá»n Google Maps hoáº·c khÃŽng ÄÆ°á»£c bao gá»m hoáº·c khÃŽng chá»©a khÃ³a API há»£p vá»i website cá»§a báº¡n.\x3cbr\x3e\x3cbr\x3e\x3ca href=\'http://trac.openlayers.org/wiki/Google\' target=\'_blank\'\x3eTrá»£ giÃºp vá» tÃ­nh nÄng nÃ y\x3c/a\x3e cho ngÆ°á»i phÃ¡t triá»n.",'getLayerWarning':"KhÃŽng thá» táº£i lá»p ${layerType} ÄÃºng Äáº¯n.\x3cbr\x3e\x3cbr\x3eÄá» trÃ¡nh thÃŽng bÃ¡o nÃ y láº§n sau, hÃ£y chá»n BaseLayer má»i dÃ¹ng Äiá»u khiá»n chá»n lá»p á» gÃ³c trÃªn pháº£i.\x3cbr\x3e\x3cbr\x3eCháº¯c script thÆ° viá»n ${layerLib} khÃŽng ÄÆ°á»£c bao gá»m ÄÃºng kiá»u.\x3cbr\x3e\x3cbr\x3e\x3ca href=\'http://trac.openlayers.org/wiki/${layerLib}\' target=\'_blank\'\x3eTrá»£ giÃºp vá» tÃ­nh nÄng nÃ y\x3c/a\x3e cho ngÆ°á»i phÃ¡t triá»n.",'scale':"Tá»· lá» = 1 : ${scaleDenom}",'W':"T",'E':"Ä",'N':"B",'S':"N",'layerAlreadyAdded':"Báº¡n muá»n thÃªm lá»p ${layerName} vÃ o báº£n Äá», nhÆ°ng lá»p nÃ y ÄÃ£ ÄÆ°á»£c thÃªm",'reprojectDeprecated':"Báº¡n Äang Ã¡p dá»¥ng cháº¿ Äá» âreprojectâ vÃ o lá»p ${layerName}. Cháº¿ Äá» nÃ y ÄÃ£ bá» pháº£n Äá»i: nÃ³ cÃ³ má»¥c ÄÃ­ch há» trá»£ láº¥p dá»¯ liá»u trÃªn cÃ¡c ná»n báº£n Äá» thÆ°Æ¡ng máº¡i; nÃªn thá»±c hiá»n hiá»u á»©ng ÄÃ³ dÃ¹ng tÃ­nh nÄng Mercator HÃ¬nh cáº§u. CÃ³ sáºµn thÃªm chi tiáº¿t táº¡i http://trac.openlayers.org/wiki/SphericalMercator .",'methodDeprecated':"PhÆ°Æ¡ng thá»©c nÃ y ÄÃ£ bá» pháº£n Äá»i vÃ  sáºœ bá» dá»i vÃ o phiÃªn báº£n 3.0. Xin hÃ£y sá»­ dá»¥ng ${newMethod} thay tháº¿.",'boundsAddError':"Cáº§n pháº£i cho cáº£ giÃ¡ trá» x vÃ  y vÃ o hÃ m add.",'lonlatAddError':"Cáº§n pháº£i cho cáº£ giÃ¡ trá» lon vÃ  lat vÃ o hÃ m add.",'pixelAddError':"Cáº§n pháº£i cho cáº£ giÃ¡ trá» x vÃ  y vÃ o hÃ m add.",'unsupportedGeometryType':"KhÃŽng há» trá»£ kiá»u Äá»a lÃœ: ${geomType}",'pagePositionFailed':"OpenLayers.Util.pagePosition bá» tháº¥t báº¡i: nguyÃªn tá» vá»i ID ${elemId} cÃ³ thá» á» chá» sai.",'filterEvaluateNotImplemented':"chÆ°a há» trá»£ evaluate cho loáº¡i bá» lá»c nÃ y."});OpenLayers.Popup.AnchoredBubble=OpenLayers.Class(OpenLayers.Popup.Anchored,{rounded:false,initialize:function(id,lonlat,contentSize,contentHTML,anchor,closeBox,closeBoxCallback){this.padding=new OpenLayers.Bounds(0,OpenLayers.Popup.AnchoredBubble.CORNER_SIZE,0,OpenLayers.Popup.AnchoredBubble.CORNER_SIZE);OpenLayers.Popup.Anchored.prototype.initialize.apply(this,arguments);},draw:function(px){OpenLayers.Popup.Anchored.prototype.draw.apply(this,arguments);this.setContentHTML();this.setBackgroundColor();this.setOpacity();return this.div;},updateRelativePosition:function(){this.setRicoCorners();},setSize:function(contentSize){OpenLayers.Popup.Anchored.prototype.setSize.apply(this,arguments);this.setRicoCorners();},setBackgroundColor:function(color){if(color!=undefined){this.backgroundColor=color;}
+if(this.div!=null){if(this.contentDiv!=null){this.div.style.background="transparent";OpenLayers.Rico.Corner.changeColor(this.groupDiv,this.backgroundColor);}}},setOpacity:function(opacity){OpenLayers.Popup.Anchored.prototype.setOpacity.call(this,opacity);if(this.div!=null){if(this.groupDiv!=null){OpenLayers.Rico.Corner.changeOpacity(this.groupDiv,this.opacity);}}},setBorder:function(border){this.border=0;},setRicoCorners:function(){var corners=this.getCornersToRound(this.relativePosition);var options={corners:corners,color:this.backgroundColor,bgColor:"transparent",blend:false};if(!this.rounded){OpenLayers.Rico.Corner.round(this.div,options);this.rounded=true;}else{OpenLayers.Rico.Corner.reRound(this.groupDiv,options);this.setBackgroundColor();this.setOpacity();}},getCornersToRound:function(){var corners=['tl','tr','bl','br'];var corner=OpenLayers.Bounds.oppositeQuadrant(this.relativePosition);OpenLayers.Util.removeItem(corners,corner);return corners.join(" ");},CLASS_NAME:"OpenLayers.Popup.AnchoredBubble"});OpenLayers.Popup.AnchoredBubble.CORNER_SIZE=5;OpenLayers.Popup.Framed=OpenLayers.Class(OpenLayers.Popup.Anchored,{imageSrc:null,imageSize:null,isAlphaImage:false,positionBlocks:null,blocks:null,fixedRelativePosition:false,initialize:function(id,lonlat,contentSize,contentHTML,anchor,closeBox,closeBoxCallback){OpenLayers.Popup.Anchored.prototype.initialize.apply(this,arguments);if(this.fixedRelativePosition){this.updateRelativePosition();this.calculateRelativePosition=function(px){return this.relativePosition;};}
+this.contentDiv.style.position="absolute";this.contentDiv.style.zIndex=1;if(closeBox){this.closeDiv.style.zIndex=1;}
+this.groupDiv.style.position="absolute";this.groupDiv.style.top="0px";this.groupDiv.style.left="0px";this.groupDiv.style.height="100%";this.groupDiv.style.width="100%";},destroy:function(){this.imageSrc=null;this.imageSize=null;this.isAlphaImage=null;this.fixedRelativePosition=false;this.positionBlocks=null;for(var i=0;i<this.blocks.length;i++){var block=this.blocks[i];if(block.image){block.div.removeChild(block.image);}
+block.image=null;if(block.div){this.groupDiv.removeChild(block.div);}
+block.div=null;}
+this.blocks=null;OpenLayers.Popup.Anchored.prototype.destroy.apply(this,arguments);},setBackgroundColor:function(color){},setBorder:function(){},setOpacity:function(opacity){},setSize:function(contentSize){OpenLayers.Popup.Anchored.prototype.setSize.apply(this,arguments);this.updateBlocks();},updateRelativePosition:function(){this.padding=this.positionBlocks[this.relativePosition].padding;if(this.closeDiv){var contentDivPadding=this.getContentDivPadding();this.closeDiv.style.right=contentDivPadding.right+
+this.padding.right+"px";this.closeDiv.style.top=contentDivPadding.top+
+this.padding.top+"px";}
+this.updateBlocks();},calculateNewPx:function(px){var newPx=OpenLayers.Popup.Anchored.prototype.calculateNewPx.apply(this,arguments);newPx=newPx.offset(this.positionBlocks[this.relativePosition].offset);return newPx;},createBlocks:function(){this.blocks=[];var firstPosition=null;for(var key in this.positionBlocks){firstPosition=key;break;}
+var position=this.positionBlocks[firstPosition];for(var i=0;i<position.blocks.length;i++){var block={};this.blocks.push(block);var divId=this.id+'_FrameDecorationDiv_'+i;block.div=OpenLayers.Util.createDiv(divId,null,null,null,"absolute",null,"hidden",null);var imgId=this.id+'_FrameDecorationImg_'+i;var imageCreator=(this.isAlphaImage)?OpenLayers.Util.createAlphaImageDiv:OpenLayers.Util.createImage;block.image=imageCreator(imgId,null,this.imageSize,this.imageSrc,"absolute",null,null,null);block.div.appendChild(block.image);this.groupDiv.appendChild(block.div);}},updateBlocks:function(){if(!this.blocks){this.createBlocks();}
+if(this.size&&this.relativePosition){var position=this.positionBlocks[this.relativePosition];for(var i=0;i<position.blocks.length;i++){var positionBlock=position.blocks[i];var block=this.blocks[i];var l=positionBlock.anchor.left;var b=positionBlock.anchor.bottom;var r=positionBlock.anchor.right;var t=positionBlock.anchor.top;var w=(isNaN(positionBlock.size.w))?this.size.w-(r+l):positionBlock.size.w;var h=(isNaN(positionBlock.size.h))?this.size.h-(b+t):positionBlock.size.h;block.div.style.width=(w<0?0:w)+'px';block.div.style.height=(h<0?0:h)+'px';block.div.style.left=(l!=null)?l+'px':'';block.div.style.bottom=(b!=null)?b+'px':'';block.div.style.right=(r!=null)?r+'px':'';block.div.style.top=(t!=null)?t+'px':'';block.image.style.left=positionBlock.position.x+'px';block.image.style.top=positionBlock.position.y+'px';}
+this.contentDiv.style.left=this.padding.left+"px";this.contentDiv.style.top=this.padding.top+"px";}},CLASS_NAME:"OpenLayers.Popup.Framed"});OpenLayers.Projection=OpenLayers.Class({proj:null,projCode:null,initialize:function(projCode,options){OpenLayers.Util.extend(this,options);this.projCode=projCode;if(window.Proj4js){this.proj=new Proj4js.Proj(projCode);}},getCode:function(){return this.proj?this.proj.srsCode:this.projCode;},getUnits:function(){return this.proj?this.proj.units:null;},toString:function(){return this.getCode();},equals:function(projection){if(projection&&projection.getCode){return this.getCode()==projection.getCode();}else{return false;}},destroy:function(){delete this.proj;delete this.projCode;},CLASS_NAME:"OpenLayers.Projection"});OpenLayers.Projection.transforms={};OpenLayers.Projection.addTransform=function(from,to,method){if(!OpenLayers.Projection.transforms[from]){OpenLayers.Projection.transforms[from]={};}
+OpenLayers.Projection.transforms[from][to]=method;};OpenLayers.Projection.transform=function(point,source,dest){if(source.proj&&dest.proj){point=Proj4js.transform(source.proj,dest.proj,point);}else if(source&&dest&&OpenLayers.Projection.transforms[source.getCode()]&&OpenLayers.Projection.transforms[source.getCode()][dest.getCode()]){OpenLayers.Projection.transforms[source.getCode()][dest.getCode()](point);}
+return point;};OpenLayers.Protocol.WFS.v1=OpenLayers.Class(OpenLayers.Protocol,{version:null,srsName:"EPSG:4326",featureType:null,featureNS:null,geometryName:"the_geom",schema:null,featurePrefix:"feature",formatOptions:null,readFormat:null,initialize:function(options){OpenLayers.Protocol.prototype.initialize.apply(this,[options]);if(!options.format){this.format=OpenLayers.Format.WFST(OpenLayers.Util.extend({version:this.version,featureType:this.featureType,featureNS:this.featureNS,featurePrefix:this.featurePrefix,geometryName:this.geometryName,srsName:this.srsName,schema:this.schema},this.formatOptions));}
+if(!this.featureNS&&this.featurePrefix){var readNode=this.format.readNode;this.format.readNode=function(node,obj){if(!this.featureNS&&node.prefix==this.featurePrefix){this.featureNS=node.namespaceURI;this.setNamespace("feature",this.featureNS);}
+return readNode.apply(this,arguments);};}},destroy:function(){if(this.options&&!this.options.format){this.format.destroy();}
+this.format=null;OpenLayers.Protocol.prototype.destroy.apply(this);},read:function(options){OpenLayers.Protocol.prototype.read.apply(this,arguments);options=OpenLayers.Util.extend({},options);OpenLayers.Util.applyDefaults(options,this.options||{});var response=new OpenLayers.Protocol.Response({requestType:"read"});var data=OpenLayers.Format.XML.prototype.write.apply(this.format,[this.format.writeNode("wfs:GetFeature",options)]);response.priv=OpenLayers.Request.POST({url:options.url,callback:this.createCallback(this.handleRead,response,options),params:options.params,headers:options.headers,data:data});return response;},handleRead:function(response,options){if(options.callback){var request=response.priv;if(request.status>=200&&request.status<300){response.features=this.parseFeatures(request);response.code=OpenLayers.Protocol.Response.SUCCESS;}else{response.code=OpenLayers.Protocol.Response.FAILURE;}
+options.callback.call(options.scope,response);}},parseFeatures:function(request){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+if(!doc||doc.length<=0){return null;}
+return(this.readFormat!==null)?this.readFormat.read(doc):this.format.read(doc);},commit:function(features,options){options=OpenLayers.Util.extend({},options);OpenLayers.Util.applyDefaults(options,this.options);var response=new OpenLayers.Protocol.Response({requestType:"commit",reqFeatures:features});response.priv=OpenLayers.Request.POST({url:options.url,data:this.format.write(features,options),callback:this.createCallback(this.handleCommit,response,options)});return response;},handleCommit:function(response,options){if(options.callback){var request=response.priv;var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+var obj=this.format.read(data)||{};response.insertIds=obj.insertIds||[];response.code=(obj.success)?OpenLayers.Protocol.Response.SUCCESS:OpenLayers.Protocol.Response.FAILURE;options.callback.call(options.scope,response);}},filterDelete:function(filter,options){options=OpenLayers.Util.extend({},options);OpenLayers.Util.applyDefaults(options,this.options);var response=new OpenLayers.Protocol.Response({requestType:"commit"});var root=this.format.createElementNSPlus("wfs:Transaction",{attributes:{service:"WFS",version:this.version}});var deleteNode=this.format.createElementNSPlus("wfs:Delete",{attributes:{typeName:(options.featureNS?this.featurePrefix+":":"")+
+options.featureType}});if(options.featureNS){deleteNode.setAttribute("xmlns:"+this.featurePrefix,options.featureNS);}
+var filterNode=this.format.writeNode("ogc:Filter",filter);deleteNode.appendChild(filterNode);root.appendChild(deleteNode);var data=OpenLayers.Format.XML.prototype.write.apply(this.format,[root]);return OpenLayers.Request.POST({url:this.url,callback:options.callback||function(){},data:data});},abort:function(response){if(response){response.priv.abort();}},CLASS_NAME:"OpenLayers.Protocol.WFS.v1"});OpenLayers.Renderer.SVG=OpenLayers.Class(OpenLayers.Renderer.Elements,{xmlns:"http://www.w3.org/2000/svg",xlinkns:"http://www.w3.org/1999/xlink",MAX_PIXEL:15000,translationParameters:null,symbolMetrics:null,isGecko:null,supportUse:null,initialize:function(containerID){if(!this.supported()){return;}
+OpenLayers.Renderer.Elements.prototype.initialize.apply(this,arguments);this.translationParameters={x:0,y:0};this.supportUse=(navigator.userAgent.toLowerCase().indexOf("applewebkit/5")==-1);this.isGecko=(navigator.userAgent.toLowerCase().indexOf("gecko/")!=-1);this.symbolMetrics={};},destroy:function(){OpenLayers.Renderer.Elements.prototype.destroy.apply(this,arguments);},supported:function(){var svgFeature="http://www.w3.org/TR/SVG11/feature#";return(document.implementation&&(document.implementation.hasFeature("org.w3c.svg","1.0")||document.implementation.hasFeature(svgFeature+"SVG","1.1")||document.implementation.hasFeature(svgFeature+"BasicStructure","1.1")));},inValidRange:function(x,y,xyOnly){var left=x+(xyOnly?0:this.translationParameters.x);var top=y+(xyOnly?0:this.translationParameters.y);return(left>=-this.MAX_PIXEL&&left<=this.MAX_PIXEL&&top>=-this.MAX_PIXEL&&top<=this.MAX_PIXEL);},setExtent:function(extent,resolutionChanged){OpenLayers.Renderer.Elements.prototype.setExtent.apply(this,arguments);var resolution=this.getResolution();var left=-extent.left/resolution;var top=extent.top/resolution;if(resolutionChanged){this.left=left;this.top=top;var extentString="0 0 "+this.size.w+" "+this.size.h;this.rendererRoot.setAttributeNS(null,"viewBox",extentString);this.translate(0,0);return true;}else{var inRange=this.translate(left-this.left,top-this.top);if(!inRange){this.setExtent(extent,true);}
+return inRange;}},translate:function(x,y){if(!this.inValidRange(x,y,true)){return false;}else{var transformString="";if(x||y){transformString="translate("+x+","+y+")";}
+this.root.setAttributeNS(null,"transform",transformString);this.translationParameters={x:x,y:y};return true;}},setSize:function(size){OpenLayers.Renderer.prototype.setSize.apply(this,arguments);this.rendererRoot.setAttributeNS(null,"width",this.size.w);this.rendererRoot.setAttributeNS(null,"height",this.size.h);},getNodeType:function(geometry,style){var nodeType=null;switch(geometry.CLASS_NAME){case"OpenLayers.Geometry.Point":if(style.externalGraphic){nodeType="image";}else if(this.isComplexSymbol(style.graphicName)){nodeType=this.supportUse===false?"svg":"use";}else{nodeType="circle";}
+break;case"OpenLayers.Geometry.Rectangle":nodeType="rect";break;case"OpenLayers.Geometry.LineString":nodeType="polyline";break;case"OpenLayers.Geometry.LinearRing":nodeType="polygon";break;case"OpenLayers.Geometry.Polygon":case"OpenLayers.Geometry.Curve":case"OpenLayers.Geometry.Surface":nodeType="path";break;default:break;}
+return nodeType;},setStyle:function(node,style,options){style=style||node._style;options=options||node._options;var r=parseFloat(node.getAttributeNS(null,"r"));var widthFactor=1;var pos;if(node._geometryClass=="OpenLayers.Geometry.Point"&&r){node.style.visibility="";if(style.graphic===false){node.style.visibility="hidden";}else if(style.externalGraphic){pos=this.getPosition(node);if(style.graphicTitle){node.setAttributeNS(null,"title",style.graphicTitle);}
+if(style.graphicWidth&&style.graphicHeight){node.setAttributeNS(null,"preserveAspectRatio","none");}
+var width=style.graphicWidth||style.graphicHeight;var height=style.graphicHeight||style.graphicWidth;width=width?width:style.pointRadius*2;height=height?height:style.pointRadius*2;var xOffset=(style.graphicXOffset!=undefined)?style.graphicXOffset:-(0.5*width);var yOffset=(style.graphicYOffset!=undefined)?style.graphicYOffset:-(0.5*height);var opacity=style.graphicOpacity||style.fillOpacity;node.setAttributeNS(null,"x",(pos.x+xOffset).toFixed());node.setAttributeNS(null,"y",(pos.y+yOffset).toFixed());node.setAttributeNS(null,"width",width);node.setAttributeNS(null,"height",height);node.setAttributeNS(this.xlinkns,"href",style.externalGraphic);node.setAttributeNS(null,"style","opacity: "+opacity);}else if(this.isComplexSymbol(style.graphicName)){var offset=style.pointRadius*3;var size=offset*2;var id=this.importSymbol(style.graphicName);pos=this.getPosition(node);widthFactor=this.symbolMetrics[id][0]*3/size;var parent=node.parentNode;var nextSibling=node.nextSibling;if(parent){parent.removeChild(node);}
+if(this.supportUse===false){var src=document.getElementById(id);node.firstChild&&node.removeChild(node.firstChild);node.appendChild(src.firstChild.cloneNode(true));node.setAttributeNS(null,"viewBox",src.getAttributeNS(null,"viewBox"));}else{node.setAttributeNS(this.xlinkns,"href","#"+id);}
+node.setAttributeNS(null,"width",size);node.setAttributeNS(null,"height",size);node.setAttributeNS(null,"x",pos.x-offset);node.setAttributeNS(null,"y",pos.y-offset);if(nextSibling){parent.insertBefore(node,nextSibling);}else if(parent){parent.appendChild(node);}}else{node.setAttributeNS(null,"r",style.pointRadius);}
+var rotation=style.rotation;if((rotation!==undefined||node._rotation!==undefined)&&pos){node._rotation=rotation;rotation|=0;if(node.nodeName!=="svg"){node.setAttributeNS(null,"transform","rotate("+rotation+" "+pos.x+" "+
+pos.y+")");}else{var metrics=this.symbolMetrics[id];node.firstChild.setAttributeNS(null,"transform","rotate("+style.rotation+" "+metrics[1]+" "+metrics[2]+")");}}}
+if(options.isFilled){node.setAttributeNS(null,"fill",style.fillColor);node.setAttributeNS(null,"fill-opacity",style.fillOpacity);}else{node.setAttributeNS(null,"fill","none");}
+if(options.isStroked){node.setAttributeNS(null,"stroke",style.strokeColor);node.setAttributeNS(null,"stroke-opacity",style.strokeOpacity);node.setAttributeNS(null,"stroke-width",style.strokeWidth*widthFactor);node.setAttributeNS(null,"stroke-linecap",style.strokeLinecap||"round");node.setAttributeNS(null,"stroke-linejoin","round");style.strokeDashstyle&&node.setAttributeNS(null,"stroke-dasharray",this.dashStyle(style,widthFactor));}else{node.setAttributeNS(null,"stroke","none");}
+if(style.pointerEvents){node.setAttributeNS(null,"pointer-events",style.pointerEvents);}
+if(style.cursor!=null){node.setAttributeNS(null,"cursor",style.cursor);}
+return node;},dashStyle:function(style,widthFactor){var w=style.strokeWidth*widthFactor;var str=style.strokeDashstyle;switch(str){case'solid':return'none';case'dot':return[1,4*w].join();case'dash':return[4*w,4*w].join();case'dashdot':return[4*w,4*w,1,4*w].join();case'longdash':return[8*w,4*w].join();case'longdashdot':return[8*w,4*w,1,4*w].join();default:return OpenLayers.String.trim(str).replace(/\s+/g,",");}},createNode:function(type,id){var node=document.createElementNS(this.xmlns,type);if(id){node.setAttributeNS(null,"id",id);}
+return node;},nodeTypeCompare:function(node,type){return(type==node.nodeName);},createRenderRoot:function(){return this.nodeFactory(this.container.id+"_svgRoot","svg");},createRoot:function(suffix){return this.nodeFactory(this.container.id+suffix,"g");},createDefs:function(){var defs=this.nodeFactory(this.container.id+"_defs","defs");this.rendererRoot.appendChild(defs);return defs;},drawPoint:function(node,geometry){return this.drawCircle(node,geometry,1);},drawCircle:function(node,geometry,radius){var resolution=this.getResolution();var x=(geometry.x/resolution+this.left);var y=(this.top-geometry.y/resolution);if(this.inValidRange(x,y)){node.setAttributeNS(null,"cx",x);node.setAttributeNS(null,"cy",y);node.setAttributeNS(null,"r",radius);return node;}else{return false;}},drawLineString:function(node,geometry){var componentsResult=this.getComponentsString(geometry.components);if(componentsResult.path){node.setAttributeNS(null,"points",componentsResult.path);return(componentsResult.complete?node:null);}else{return false;}},drawLinearRing:function(node,geometry){var componentsResult=this.getComponentsString(geometry.components);if(componentsResult.path){node.setAttributeNS(null,"points",componentsResult.path);return(componentsResult.complete?node:null);}else{return false;}},drawPolygon:function(node,geometry){var d="";var draw=true;var complete=true;var linearRingResult,path;for(var j=0,len=geometry.components.length;j<len;j++){d+=" M";linearRingResult=this.getComponentsString(geometry.components[j].components," ");path=linearRingResult.path;if(path){d+=" "+path;complete=linearRingResult.complete&&complete;}else{draw=false;}}
+d+=" z";if(draw){node.setAttributeNS(null,"d",d);node.setAttributeNS(null,"fill-rule","evenodd");return complete?node:null;}else{return false;}},drawRectangle:function(node,geometry){var resolution=this.getResolution();var x=(geometry.x/resolution+this.left);var y=(this.top-geometry.y/resolution);if(this.inValidRange(x,y)){node.setAttributeNS(null,"x",x);node.setAttributeNS(null,"y",y);node.setAttributeNS(null,"width",geometry.width/resolution);node.setAttributeNS(null,"height",geometry.height/resolution);return node;}else{return false;}},drawSurface:function(node,geometry){var d=null;var draw=true;for(var i=0,len=geometry.components.length;i<len;i++){if((i%3)==0&&(i/3)==0){var component=this.getShortString(geometry.components[i]);if(!component){draw=false;}
+d="M "+component;}else if((i%3)==1){var component=this.getShortString(geometry.components[i]);if(!component){draw=false;}
+d+=" C "+component;}else{var component=this.getShortString(geometry.components[i]);if(!component){draw=false;}
+d+=" "+component;}}
+d+=" Z";if(draw){node.setAttributeNS(null,"d",d);return node;}else{return false;}},drawText:function(featureId,style,location){var resolution=this.getResolution();var x=(location.x/resolution+this.left);var y=(location.y/resolution-this.top);var label=this.nodeFactory(featureId+this.LABEL_ID_SUFFIX,"text");var tspan=this.nodeFactory(featureId+this.LABEL_ID_SUFFIX+"_tspan","tspan");label.setAttributeNS(null,"x",x);label.setAttributeNS(null,"y",-y);if(style.fontColor){label.setAttributeNS(null,"fill",style.fontColor);}
+if(style.fontOpacity){label.setAttributeNS(null,"opacity",style.fontOpacity);}
+if(style.fontFamily){label.setAttributeNS(null,"font-family",style.fontFamily);}
+if(style.fontSize){label.setAttributeNS(null,"font-size",style.fontSize);}
+if(style.fontWeight){label.setAttributeNS(null,"font-weight",style.fontWeight);}
+if(style.labelSelect===true){label.setAttributeNS(null,"pointer-events","visible");label._featureId=featureId;tspan._featureId=featureId;tspan._geometry=location;tspan._geometryClass=location.CLASS_NAME;}else{label.setAttributeNS(null,"pointer-events","none");}
+var align=style.labelAlign||"cm";label.setAttributeNS(null,"text-anchor",OpenLayers.Renderer.SVG.LABEL_ALIGN[align[0]]||"middle");if(this.isGecko){label.setAttributeNS(null,"dominant-baseline",OpenLayers.Renderer.SVG.LABEL_ALIGN[align[1]]||"central");}else{tspan.setAttributeNS(null,"baseline-shift",OpenLayers.Renderer.SVG.LABEL_VSHIFT[align[1]]||"-35%");}
+tspan.textContent=style.label;if(!label.parentNode){label.appendChild(tspan);this.textRoot.appendChild(label);}},getComponentsString:function(components,separator){var renderCmp=[];var complete=true;var len=components.length;var strings=[];var str,component;for(var i=0;i<len;i++){component=components[i];renderCmp.push(component);str=this.getShortString(component);if(str){strings.push(str);}else{if(i>0){if(this.getShortString(components[i-1])){strings.push(this.clipLine(components[i],components[i-1]));}}
+if(i<len-1){if(this.getShortString(components[i+1])){strings.push(this.clipLine(components[i],components[i+1]));}}
+complete=false;}}
+return{path:strings.join(separator||","),complete:complete};},clipLine:function(badComponent,goodComponent){if(goodComponent.equals(badComponent)){return"";}
+var resolution=this.getResolution();var maxX=this.MAX_PIXEL-this.translationParameters.x;var maxY=this.MAX_PIXEL-this.translationParameters.y;var x1=goodComponent.x/resolution+this.left;var y1=this.top-goodComponent.y/resolution;var x2=badComponent.x/resolution+this.left;var y2=this.top-badComponent.y/resolution;var k;if(x2<-maxX||x2>maxX){k=(y2-y1)/(x2-x1);x2=x2<0?-maxX:maxX;y2=y1+(x2-x1)*k;}
+if(y2<-maxY||y2>maxY){k=(x2-x1)/(y2-y1);y2=y2<0?-maxY:maxY;x2=x1+(y2-y1)*k;}
+return x2+","+y2;},getShortString:function(point){var resolution=this.getResolution();var x=(point.x/resolution+this.left);var y=(this.top-point.y/resolution);if(this.inValidRange(x,y)){return x+","+y;}else{return false;}},getPosition:function(node){return({x:parseFloat(node.getAttributeNS(null,"cx")),y:parseFloat(node.getAttributeNS(null,"cy"))});},importSymbol:function(graphicName){if(!this.defs){this.defs=this.createDefs();}
+var id=this.container.id+"-"+graphicName;if(document.getElementById(id)!=null){return id;}
+var symbol=OpenLayers.Renderer.symbol[graphicName];if(!symbol){throw new Error(graphicName+' is not a valid symbol name');}
+var symbolNode=this.nodeFactory(id,"symbol");var node=this.nodeFactory(null,"polygon");symbolNode.appendChild(node);var symbolExtent=new OpenLayers.Bounds(Number.MAX_VALUE,Number.MAX_VALUE,0,0);var points=[];var x,y;for(var i=0;i<symbol.length;i=i+2){x=symbol[i];y=symbol[i+1];symbolExtent.left=Math.min(symbolExtent.left,x);symbolExtent.bottom=Math.min(symbolExtent.bottom,y);symbolExtent.right=Math.max(symbolExtent.right,x);symbolExtent.top=Math.max(symbolExtent.top,y);points.push(x,",",y);}
+node.setAttributeNS(null,"points",points.join(" "));var width=symbolExtent.getWidth();var height=symbolExtent.getHeight();var viewBox=[symbolExtent.left-width,symbolExtent.bottom-height,width*3,height*3];symbolNode.setAttributeNS(null,"viewBox",viewBox.join(" "));this.symbolMetrics[id]=[Math.max(width,height),symbolExtent.getCenterLonLat().lon,symbolExtent.getCenterLonLat().lat];this.defs.appendChild(symbolNode);return symbolNode.id;},getFeatureIdFromEvent:function(evt){var featureId=OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent.apply(this,arguments);if(this.supportUse===false&&!featureId){var target=evt.target;featureId=target.parentNode&&target!=this.rendererRoot&&target.parentNode._featureId;}
+return featureId;},CLASS_NAME:"OpenLayers.Renderer.SVG"});OpenLayers.Renderer.SVG.LABEL_ALIGN={"l":"start","r":"end","b":"bottom","t":"hanging"};OpenLayers.Renderer.SVG.LABEL_VSHIFT={"t":"-70%","b":"0"};OpenLayers.Renderer.VML=OpenLayers.Class(OpenLayers.Renderer.Elements,{xmlns:"urn:schemas-microsoft-com:vml",symbolCache:{},offset:null,initialize:function(containerID){if(!this.supported()){return;}
+if(!document.namespaces.olv){document.namespaces.add("olv",this.xmlns);var style=document.createStyleSheet();var shapes=['shape','rect','oval','fill','stroke','imagedata','group','textbox'];for(var i=0,len=shapes.length;i<len;i++){style.addRule('olv\\:'+shapes[i],"behavior: url(#default#VML); "+"position: absolute; display: inline-block;");}}
+OpenLayers.Renderer.Elements.prototype.initialize.apply(this,arguments);},destroy:function(){OpenLayers.Renderer.Elements.prototype.destroy.apply(this,arguments);},supported:function(){return!!(document.namespaces);},setExtent:function(extent,resolutionChanged){OpenLayers.Renderer.Elements.prototype.setExtent.apply(this,arguments);var resolution=this.getResolution();var left=(extent.left/resolution)|0;var top=(extent.top/resolution-this.size.h)|0;if(resolutionChanged||!this.offset){this.offset={x:left,y:top};left=0;top=0;}else{left=left-this.offset.x;top=top-this.offset.y;}
+var org=left+" "+top;this.root.coordorigin=org;var roots=[this.root,this.vectorRoot,this.textRoot];var root;for(var i=0,len=roots.length;i<len;++i){root=roots[i];var size=this.size.w+" "+this.size.h;root.coordsize=size;}
+this.root.style.flip="y";return true;},setSize:function(size){OpenLayers.Renderer.prototype.setSize.apply(this,arguments);var roots=[this.rendererRoot,this.root,this.vectorRoot,this.textRoot];var w=this.size.w+"px";var h=this.size.h+"px";var root;for(var i=0,len=roots.length;i<len;++i){root=roots[i];root.style.width=w;root.style.height=h;}},getNodeType:function(geometry,style){var nodeType=null;switch(geometry.CLASS_NAME){case"OpenLayers.Geometry.Point":if(style.externalGraphic){nodeType="olv:rect";}else if(this.isComplexSymbol(style.graphicName)){nodeType="olv:shape";}else{nodeType="olv:oval";}
+break;case"OpenLayers.Geometry.Rectangle":nodeType="olv:rect";break;case"OpenLayers.Geometry.LineString":case"OpenLayers.Geometry.LinearRing":case"OpenLayers.Geometry.Polygon":case"OpenLayers.Geometry.Curve":case"OpenLayers.Geometry.Surface":nodeType="olv:shape";break;default:break;}
+return nodeType;},setStyle:function(node,style,options,geometry){style=style||node._style;options=options||node._options;var fillColor=style.fillColor;if(node._geometryClass==="OpenLayers.Geometry.Point"){if(style.externalGraphic){if(style.graphicTitle){node.title=style.graphicTitle;}
+var width=style.graphicWidth||style.graphicHeight;var height=style.graphicHeight||style.graphicWidth;width=width?width:style.pointRadius*2;height=height?height:style.pointRadius*2;var resolution=this.getResolution();var xOffset=(style.graphicXOffset!=undefined)?style.graphicXOffset:-(0.5*width);var yOffset=(style.graphicYOffset!=undefined)?style.graphicYOffset:-(0.5*height);node.style.left=(((geometry.x/resolution-this.offset.x)+xOffset)|0)+"px";node.style.top=(((geometry.y/resolution-this.offset.y)-(yOffset+height))|0)+"px";node.style.width=width+"px";node.style.height=height+"px";node.style.flip="y";fillColor="none";options.isStroked=false;}else if(this.isComplexSymbol(style.graphicName)){var cache=this.importSymbol(style.graphicName);node.path=cache.path;node.coordorigin=cache.left+","+cache.bottom;var size=cache.size;node.coordsize=size+","+size;this.drawCircle(node,geometry,style.pointRadius);node.style.flip="y";}else{this.drawCircle(node,geometry,style.pointRadius);}}
+if(options.isFilled){node.fillcolor=fillColor;}else{node.filled="false";}
+var fills=node.getElementsByTagName("fill");var fill=(fills.length==0)?null:fills[0];if(!options.isFilled){if(fill){node.removeChild(fill);}}else{if(!fill){fill=this.createNode('olv:fill',node.id+"_fill");}
+fill.opacity=style.fillOpacity;if(node._geometryClass==="OpenLayers.Geometry.Point"&&style.externalGraphic){if(style.graphicOpacity){fill.opacity=style.graphicOpacity;}
+fill.src=style.externalGraphic;fill.type="frame";if(!(style.graphicWidth&&style.graphicHeight)){fill.aspect="atmost";}}
+if(fill.parentNode!=node){node.appendChild(fill);}}
+var rotation=style.rotation;if((rotation!==undefined||node._rotation!==undefined)){node._rotation=rotation;if(style.externalGraphic){this.graphicRotate(node,xOffset,yOffset,style);fill.opacity=0;}else if(node._geometryClass==="OpenLayers.Geometry.Point"){node.style.rotation=rotation||0;}}
+var strokes=node.getElementsByTagName("stroke");var stroke=(strokes.length==0)?null:strokes[0];if(!options.isStroked){node.stroked=false;if(stroke){stroke.on=false;}}else{if(!stroke){stroke=this.createNode('olv:stroke',node.id+"_stroke");node.appendChild(stroke);}
+stroke.on=true;stroke.color=style.strokeColor;stroke.weight=style.strokeWidth+"px";stroke.opacity=style.strokeOpacity;stroke.endcap=style.strokeLinecap=='butt'?'flat':(style.strokeLinecap||'round');if(style.strokeDashstyle){stroke.dashstyle=this.dashStyle(style);}}
+if(style.cursor!="inherit"&&style.cursor!=null){node.style.cursor=style.cursor;}
+return node;},graphicRotate:function(node,xOffset,yOffset,style){var style=style||node._style;var rotation=style.rotation||0;var aspectRatio,size;if(!(style.graphicWidth&&style.graphicHeight)){var img=new Image();img.onreadystatechange=OpenLayers.Function.bind(function(){if(img.readyState=="complete"||img.readyState=="interactive"){aspectRatio=img.width/img.height;size=Math.max(style.pointRadius*2,style.graphicWidth||0,style.graphicHeight||0);xOffset=xOffset*aspectRatio;style.graphicWidth=size*aspectRatio;style.graphicHeight=size;this.graphicRotate(node,xOffset,yOffset,style);}},this);img.src=style.externalGraphic;return;}else{size=Math.max(style.graphicWidth,style.graphicHeight);aspectRatio=style.graphicWidth/style.graphicHeight;}
+var width=Math.round(style.graphicWidth||size*aspectRatio);var height=Math.round(style.graphicHeight||size);node.style.width=width+"px";node.style.height=height+"px";var image=document.getElementById(node.id+"_image");if(!image){image=this.createNode("olv:imagedata",node.id+"_image");node.appendChild(image);}
+image.style.width=width+"px";image.style.height=height+"px";image.src=style.externalGraphic;image.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader("+"src='', sizingMethod='scale')";var rot=rotation*Math.PI/180;var sintheta=Math.sin(rot);var costheta=Math.cos(rot);var filter="progid:DXImageTransform.Microsoft.Matrix(M11="+costheta+",M12="+(-sintheta)+",M21="+sintheta+",M22="+costheta+",SizingMethod='auto expand')\n";var opacity=style.graphicOpacity||style.fillOpacity;if(opacity&&opacity!=1){filter+="progid:DXImageTransform.Microsoft.BasicImage(opacity="+
+opacity+")\n";}
+node.style.filter=filter;var centerPoint=new OpenLayers.Geometry.Point(-xOffset,-yOffset);var imgBox=new OpenLayers.Bounds(0,0,width,height).toGeometry();imgBox.rotate(style.rotation,centerPoint);var imgBounds=imgBox.getBounds();node.style.left=Math.round(parseInt(node.style.left)+imgBounds.left)+"px";node.style.top=Math.round(parseInt(node.style.top)-imgBounds.bottom)+"px";},postDraw:function(node){node.style.visibility="visible";var fillColor=node._style.fillColor;var strokeColor=node._style.strokeColor;if(fillColor=="none"&&node.fillcolor!=fillColor){node.fillcolor=fillColor;}
+if(strokeColor=="none"&&node.strokecolor!=strokeColor){node.strokecolor=strokeColor;}},setNodeDimension:function(node,geometry){var bbox=geometry.getBounds();if(bbox){var resolution=this.getResolution();var scaledBox=new OpenLayers.Bounds((bbox.left/resolution-this.offset.x)|0,(bbox.bottom/resolution-this.offset.y)|0,(bbox.right/resolution-this.offset.x)|0,(bbox.top/resolution-this.offset.y)|0);node.style.left=scaledBox.left+"px";node.style.top=scaledBox.top+"px";node.style.width=scaledBox.getWidth()+"px";node.style.height=scaledBox.getHeight()+"px";node.coordorigin=scaledBox.left+" "+scaledBox.top;node.coordsize=scaledBox.getWidth()+" "+scaledBox.getHeight();}},dashStyle:function(style){var dash=style.strokeDashstyle;switch(dash){case'solid':case'dot':case'dash':case'dashdot':case'longdash':case'longdashdot':return dash;default:var parts=dash.split(/[ ,]/);if(parts.length==2){if(1*parts[0]>=2*parts[1]){return"longdash";}
+return(parts[0]==1||parts[1]==1)?"dot":"dash";}else if(parts.length==4){return(1*parts[0]>=2*parts[1])?"longdashdot":"dashdot";}
+return"solid";}},createNode:function(type,id){var node=document.createElement(type);if(id){node.id=id;}
+node.unselectable='on';node.onselectstart=OpenLayers.Function.False;return node;},nodeTypeCompare:function(node,type){var subType=type;var splitIndex=subType.indexOf(":");if(splitIndex!=-1){subType=subType.substr(splitIndex+1);}
+var nodeName=node.nodeName;splitIndex=nodeName.indexOf(":");if(splitIndex!=-1){nodeName=nodeName.substr(splitIndex+1);}
+return(subType==nodeName);},createRenderRoot:function(){return this.nodeFactory(this.container.id+"_vmlRoot","div");},createRoot:function(suffix){return this.nodeFactory(this.container.id+suffix,"olv:group");},drawPoint:function(node,geometry){return this.drawCircle(node,geometry,1);},drawCircle:function(node,geometry,radius){if(!isNaN(geometry.x)&&!isNaN(geometry.y)){var resolution=this.getResolution();node.style.left=(((geometry.x/resolution-this.offset.x)|0)-radius)+"px";node.style.top=(((geometry.y/resolution-this.offset.y)|0)-radius)+"px";var diameter=radius*2;node.style.width=diameter+"px";node.style.height=diameter+"px";return node;}
+return false;},drawLineString:function(node,geometry){return this.drawLine(node,geometry,false);},drawLinearRing:function(node,geometry){return this.drawLine(node,geometry,true);},drawLine:function(node,geometry,closeLine){this.setNodeDimension(node,geometry);var resolution=this.getResolution();var numComponents=geometry.components.length;var parts=new Array(numComponents);var comp,x,y;for(var i=0;i<numComponents;i++){comp=geometry.components[i];x=(comp.x/resolution-this.offset.x)|0;y=(comp.y/resolution-this.offset.y)|0;parts[i]=" "+x+","+y+" l ";}
+var end=(closeLine)?" x e":" e";node.path="m"+parts.join("")+end;return node;},drawPolygon:function(node,geometry){this.setNodeDimension(node,geometry);var resolution=this.getResolution();var path=[];var linearRing,i,j,len,ilen,comp,x,y;for(j=0,len=geometry.components.length;j<len;j++){linearRing=geometry.components[j];path.push("m");for(i=0,ilen=linearRing.components.length;i<ilen;i++){comp=linearRing.components[i];x=(comp.x/resolution-this.offset.x)|0;y=(comp.y/resolution-this.offset.y)|0;path.push(" "+x+","+y);if(i==0){path.push(" l");}}
+path.push(" x ");}
+path.push("e");node.path=path.join("");return node;},drawRectangle:function(node,geometry){var resolution=this.getResolution();node.style.left=((geometry.x/resolution-this.offset.x)|0)+"px";node.style.top=((geometry.y/resolution-this.offset.y)|0)+"px";node.style.width=((geometry.width/resolution)|0)+"px";node.style.height=((geometry.height/resolution)|0)+"px";return node;},drawText:function(featureId,style,location){var label=this.nodeFactory(featureId+this.LABEL_ID_SUFFIX,"olv:rect");var textbox=this.nodeFactory(featureId+this.LABEL_ID_SUFFIX+"_textbox","olv:textbox");var resolution=this.getResolution();label.style.left=((location.x/resolution-this.offset.x)|0)+"px";label.style.top=((location.y/resolution-this.offset.y)|0)+"px";label.style.flip="y";textbox.innerText=style.label;if(style.fontColor){textbox.style.color=style.fontColor;}
+if(style.fontOpacity){textbox.style.filter='alpha(opacity='+(style.fontOpacity*100)+')';}
+if(style.fontFamily){textbox.style.fontFamily=style.fontFamily;}
+if(style.fontSize){textbox.style.fontSize=style.fontSize;}
+if(style.fontWeight){textbox.style.fontWeight=style.fontWeight;}
+if(style.labelSelect===true){label._featureId=featureId;textbox._featureId=featureId;textbox._geometry=location;textbox._geometryClass=location.CLASS_NAME;}
+textbox.style.whiteSpace="nowrap";textbox.inset="1px,0px,0px,0px";if(!label.parentNode){label.appendChild(textbox);this.textRoot.appendChild(label);}
+var align=style.labelAlign||"cm";if(align.length==1){align+="m";}
+var xshift=textbox.clientWidth*(OpenLayers.Renderer.VML.LABEL_SHIFT[align.substr(0,1)]);var yshift=textbox.clientHeight*(OpenLayers.Renderer.VML.LABEL_SHIFT[align.substr(1,1)]);label.style.left=parseInt(label.style.left)-xshift-1+"px";label.style.top=parseInt(label.style.top)+yshift+"px";},drawSurface:function(node,geometry){this.setNodeDimension(node,geometry);var resolution=this.getResolution();var path=[];var comp,x,y;for(var i=0,len=geometry.components.length;i<len;i++){comp=geometry.components[i];x=(comp.x/resolution-this.offset.x)|0;y=(comp.y/resolution-this.offset.y)|0;if((i%3)==0&&(i/3)==0){path.push("m");}else if((i%3)==1){path.push(" c");}
+path.push(" "+x+","+y);}
+path.push(" x e");node.path=path.join("");return node;},moveRoot:function(renderer){var layer=this.map.getLayer(renderer.container.id);if(layer instanceof OpenLayers.Layer.Vector.RootContainer){layer=this.map.getLayer(this.container.id);}
+layer&&layer.renderer.clear();OpenLayers.Renderer.Elements.prototype.moveRoot.apply(this,arguments);layer&&layer.redraw();},importSymbol:function(graphicName){var id=this.container.id+"-"+graphicName;var cache=this.symbolCache[id];if(cache){return cache;}
+var symbol=OpenLayers.Renderer.symbol[graphicName];if(!symbol){throw new Error(graphicName+' is not a valid symbol name');}
+var symbolExtent=new OpenLayers.Bounds(Number.MAX_VALUE,Number.MAX_VALUE,0,0);var pathitems=["m"];for(var i=0;i<symbol.length;i=i+2){var x=symbol[i];var y=symbol[i+1];symbolExtent.left=Math.min(symbolExtent.left,x);symbolExtent.bottom=Math.min(symbolExtent.bottom,y);symbolExtent.right=Math.max(symbolExtent.right,x);symbolExtent.top=Math.max(symbolExtent.top,y);pathitems.push(x);pathitems.push(y);if(i==0){pathitems.push("l");}}
+pathitems.push("x e");var path=pathitems.join(" ");var diff=(symbolExtent.getWidth()-symbolExtent.getHeight())/2;if(diff>0){symbolExtent.bottom=symbolExtent.bottom-diff;symbolExtent.top=symbolExtent.top+diff;}else{symbolExtent.left=symbolExtent.left+diff;symbolExtent.right=symbolExtent.right-diff;}
+cache={path:path,size:symbolExtent.getWidth(),left:symbolExtent.left,bottom:symbolExtent.bottom};this.symbolCache[id]=cache;return cache;},CLASS_NAME:"OpenLayers.Renderer.VML"});OpenLayers.Renderer.VML.LABEL_SHIFT={"l":0,"c":.5,"r":1,"t":0,"m":.5,"b":1};OpenLayers.Tile=OpenLayers.Class({EVENT_TYPES:["loadstart","loadend","reload","unload"],events:null,id:null,layer:null,url:null,bounds:null,size:null,position:null,isLoading:false,initialize:function(layer,position,bounds,url,size){this.layer=layer;this.position=position.clone();this.bounds=bounds.clone();this.url=url;this.size=size.clone();this.id=OpenLayers.Util.createUniqueID("Tile_");this.events=new OpenLayers.Events(this,null,this.EVENT_TYPES);},unload:function(){if(this.isLoading){this.isLoading=false;this.events.triggerEvent("unload");}},destroy:function(){this.layer=null;this.bounds=null;this.size=null;this.position=null;this.events.destroy();this.events=null;},clone:function(obj){if(obj==null){obj=new OpenLayers.Tile(this.layer,this.position,this.bounds,this.url,this.size);}
+OpenLayers.Util.applyDefaults(obj,this);return obj;},draw:function(){var maxExtent=this.layer.maxExtent;var withinMaxExtent=(maxExtent&&this.bounds.intersectsBounds(maxExtent,false));this.shouldDraw=(withinMaxExtent||this.layer.displayOutsideMaxExtent);this.clear();return this.shouldDraw;},moveTo:function(bounds,position,redraw){if(redraw==null){redraw=true;}
+this.bounds=bounds.clone();this.position=position.clone();if(redraw){this.draw();}},clear:function(){},getBoundsFromBaseLayer:function(position){var msg=OpenLayers.i18n('reprojectDeprecated',{'layerName':this.layer.name});OpenLayers.Console.warn(msg);var topLeft=this.layer.map.getLonLatFromLayerPx(position);var bottomRightPx=position.clone();bottomRightPx.x+=this.size.w;bottomRightPx.y+=this.size.h;var bottomRight=this.layer.map.getLonLatFromLayerPx(bottomRightPx);if(topLeft.lon>bottomRight.lon){if(topLeft.lon<0){topLeft.lon=-180-(topLeft.lon+180);}else{bottomRight.lon=180+bottomRight.lon+180;}}
+var bounds=new OpenLayers.Bounds(topLeft.lon,bottomRight.lat,bottomRight.lon,topLeft.lat);return bounds;},showTile:function(){if(this.shouldDraw){this.show();}},show:function(){},hide:function(){},CLASS_NAME:"OpenLayers.Tile"});OpenLayers.Control.MouseToolbar=OpenLayers.Class(OpenLayers.Control.MouseDefaults,{mode:null,buttons:null,direction:"vertical",buttonClicked:null,initialize:function(position,direction){OpenLayers.Control.prototype.initialize.apply(this,arguments);this.position=new OpenLayers.Pixel(OpenLayers.Control.MouseToolbar.X,OpenLayers.Control.MouseToolbar.Y);if(position){this.position=position;}
+if(direction){this.direction=direction;}
+this.measureDivs=[];},destroy:function(){for(var btnId in this.buttons){var btn=this.buttons[btnId];btn.map=null;btn.events.destroy();}
+OpenLayers.Control.MouseDefaults.prototype.destroy.apply(this,arguments);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);OpenLayers.Control.MouseDefaults.prototype.draw.apply(this,arguments);this.buttons={};var sz=new OpenLayers.Size(28,28);var centered=new OpenLayers.Pixel(OpenLayers.Control.MouseToolbar.X,0);this._addButton("zoombox","drag-rectangle-off.png","drag-rectangle-on.png",centered,sz,"Shift->Drag to zoom to area");centered=centered.add((this.direction=="vertical"?0:sz.w),(this.direction=="vertical"?sz.h:0));this._addButton("pan","panning-hand-off.png","panning-hand-on.png",centered,sz,"Drag the map to pan.");centered=centered.add((this.direction=="vertical"?0:sz.w),(this.direction=="vertical"?sz.h:0));this.switchModeTo("pan");return this.div;},_addButton:function(id,img,activeImg,xy,sz,title){var imgLocation=OpenLayers.Util.getImagesLocation()+img;var activeImgLocation=OpenLayers.Util.getImagesLocation()+activeImg;var btn=OpenLayers.Util.createAlphaImageDiv("OpenLayers_Control_MouseToolbar_"+id,xy,sz,imgLocation,"absolute");this.div.appendChild(btn);btn.imgLocation=imgLocation;btn.activeImgLocation=activeImgLocation;btn.events=new OpenLayers.Events(this,btn,null,true);btn.events.on({"mousedown":this.buttonDown,"mouseup":this.buttonUp,"dblclick":OpenLayers.Event.stop,scope:this});btn.action=id;btn.title=title;btn.alt=title;btn.map=this.map;this.buttons[id]=btn;return btn;},buttonDown:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+this.buttonClicked=evt.element.action;OpenLayers.Event.stop(evt);},buttonUp:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+if(this.buttonClicked!=null){if(this.buttonClicked==evt.element.action){this.switchModeTo(evt.element.action);}
+OpenLayers.Event.stop(evt);this.buttonClicked=null;}},defaultDblClick:function(evt){this.switchModeTo("pan");this.performedDrag=false;var newCenter=this.map.getLonLatFromViewPortPx(evt.xy);this.map.setCenter(newCenter,this.map.zoom+1);OpenLayers.Event.stop(evt);return false;},defaultMouseDown:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+this.mouseDragStart=evt.xy.clone();this.performedDrag=false;this.startViaKeyboard=false;if(evt.shiftKey&&this.mode!="zoombox"){this.switchModeTo("zoombox");this.startViaKeyboard=true;}else if(evt.altKey&&this.mode!="measure"){this.switchModeTo("measure");}else if(!this.mode){this.switchModeTo("pan");}
+switch(this.mode){case"zoombox":this.map.div.style.cursor="crosshair";this.zoomBox=OpenLayers.Util.createDiv('zoomBox',this.mouseDragStart,null,null,"absolute","2px solid red");this.zoomBox.style.backgroundColor="white";this.zoomBox.style.filter="alpha(opacity=50)";this.zoomBox.style.opacity="0.50";this.zoomBox.style.fontSize="1px";this.zoomBox.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.viewPortDiv.appendChild(this.zoomBox);this.performedDrag=true;break;case"measure":var distance="";if(this.measureStart){var measureEnd=this.map.getLonLatFromViewPortPx(this.mouseDragStart);distance=OpenLayers.Util.distVincenty(this.measureStart,measureEnd);distance=Math.round(distance*100)/100;distance=distance+"km";this.measureStartBox=this.measureBox;}
+this.measureStart=this.map.getLonLatFromViewPortPx(this.mouseDragStart);;this.measureBox=OpenLayers.Util.createDiv(null,this.mouseDragStart.add(-2-parseInt(this.map.layerContainerDiv.style.left),-2-parseInt(this.map.layerContainerDiv.style.top)),null,null,"absolute");this.measureBox.style.width="4px";this.measureBox.style.height="4px";this.measureBox.style.fontSize="1px";this.measureBox.style.backgroundColor="red";this.measureBox.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.layerContainerDiv.appendChild(this.measureBox);if(distance){this.measureBoxDistance=OpenLayers.Util.createDiv(null,this.mouseDragStart.add(-2-parseInt(this.map.layerContainerDiv.style.left),2-parseInt(this.map.layerContainerDiv.style.top)),null,null,"absolute");this.measureBoxDistance.innerHTML=distance;this.measureBoxDistance.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.layerContainerDiv.appendChild(this.measureBoxDistance);this.measureDivs.push(this.measureBoxDistance);}
+this.measureBox.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.layerContainerDiv.appendChild(this.measureBox);this.measureDivs.push(this.measureBox);break;default:this.map.div.style.cursor="move";break;}
+document.onselectstart=OpenLayers.Function.False;OpenLayers.Event.stop(evt);},switchModeTo:function(mode){if(mode!=this.mode){if(this.mode&&this.buttons[this.mode]){OpenLayers.Util.modifyAlphaImageDiv(this.buttons[this.mode],null,null,null,this.buttons[this.mode].imgLocation);}
+if(this.mode=="measure"&&mode!="measure"){for(var i=0,len=this.measureDivs.length;i<len;i++){if(this.measureDivs[i]){this.map.layerContainerDiv.removeChild(this.measureDivs[i]);}}
+this.measureDivs=[];this.measureStart=null;}
+this.mode=mode;if(this.buttons[mode]){OpenLayers.Util.modifyAlphaImageDiv(this.buttons[mode],null,null,null,this.buttons[mode].activeImgLocation);}
+switch(this.mode){case"zoombox":this.map.div.style.cursor="crosshair";break;default:this.map.div.style.cursor="";break;}}},leaveMode:function(){this.switchModeTo("pan");},defaultMouseMove:function(evt){if(this.mouseDragStart!=null){switch(this.mode){case"zoombox":var deltaX=Math.abs(this.mouseDragStart.x-evt.xy.x);var deltaY=Math.abs(this.mouseDragStart.y-evt.xy.y);this.zoomBox.style.width=Math.max(1,deltaX)+"px";this.zoomBox.style.height=Math.max(1,deltaY)+"px";if(evt.xy.x<this.mouseDragStart.x){this.zoomBox.style.left=evt.xy.x+"px";}
+if(evt.xy.y<this.mouseDragStart.y){this.zoomBox.style.top=evt.xy.y+"px";}
+break;default:var deltaX=this.mouseDragStart.x-evt.xy.x;var deltaY=this.mouseDragStart.y-evt.xy.y;var size=this.map.getSize();var newXY=new OpenLayers.Pixel(size.w/2+deltaX,size.h/2+deltaY);var newCenter=this.map.getLonLatFromViewPortPx(newXY);this.map.setCenter(newCenter,null,true);this.mouseDragStart=evt.xy.clone();}
+this.performedDrag=true;}},defaultMouseUp:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+switch(this.mode){case"zoombox":this.zoomBoxEnd(evt);if(this.startViaKeyboard){this.leaveMode();}
+break;case"pan":if(this.performedDrag){this.map.setCenter(this.map.center);}}
+document.onselectstart=null;this.mouseDragStart=null;this.map.div.style.cursor="default";},defaultMouseOut:function(evt){if(this.mouseDragStart!=null&&OpenLayers.Util.mouseLeft(evt,this.map.div)){if(this.zoomBox){this.removeZoomBox();if(this.startViaKeyboard){this.leaveMode();}}
+this.mouseDragStart=null;this.map.div.style.cursor="default";}},defaultClick:function(evt){if(this.performedDrag){this.performedDrag=false;return false;}},CLASS_NAME:"OpenLayers.Control.MouseToolbar"});OpenLayers.Control.MouseToolbar.X=6;OpenLayers.Control.MouseToolbar.Y=300;OpenLayers.Control.NavigationHistory=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_TOGGLE,previous:null,previousOptions:null,next:null,nextOptions:null,limit:50,autoActivate:true,clearOnDeactivate:false,registry:null,nextStack:null,previousStack:null,listeners:null,restoring:false,initialize:function(options){OpenLayers.Control.prototype.initialize.apply(this,[options]);this.registry=OpenLayers.Util.extend({"moveend":this.getState},this.registry);var previousOptions={trigger:OpenLayers.Function.bind(this.previousTrigger,this),displayClass:this.displayClass+" "+this.displayClass+"Previous"};OpenLayers.Util.extend(previousOptions,this.previousOptions);this.previous=new OpenLayers.Control.Button(previousOptions);var nextOptions={trigger:OpenLayers.Function.bind(this.nextTrigger,this),displayClass:this.displayClass+" "+this.displayClass+"Next"};OpenLayers.Util.extend(nextOptions,this.nextOptions);this.next=new OpenLayers.Control.Button(nextOptions);this.clear();},onPreviousChange:function(state,length){if(state&&!this.previous.active){this.previous.activate();}else if(!state&&this.previous.active){this.previous.deactivate();}},onNextChange:function(state,length){if(state&&!this.next.active){this.next.activate();}else if(!state&&this.next.active){this.next.deactivate();}},destroy:function(){OpenLayers.Control.prototype.destroy.apply(this);this.previous.destroy();this.next.destroy();this.deactivate();for(var prop in this){this[prop]=null;}},setMap:function(map){this.map=map;this.next.setMap(map);this.previous.setMap(map);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);this.next.draw();this.previous.draw();},previousTrigger:function(){var current=this.previousStack.shift();var state=this.previousStack.shift();if(state!=undefined){this.nextStack.unshift(current);this.previousStack.unshift(state);this.restoring=true;this.restore(state);this.restoring=false;this.onNextChange(this.nextStack[0],this.nextStack.length);this.onPreviousChange(this.previousStack[1],this.previousStack.length-1);}else{this.previousStack.unshift(current);}
+return state;},nextTrigger:function(){var state=this.nextStack.shift();if(state!=undefined){this.previousStack.unshift(state);this.restoring=true;this.restore(state);this.restoring=false;this.onNextChange(this.nextStack[0],this.nextStack.length);this.onPreviousChange(this.previousStack[1],this.previousStack.length-1);}
+return state;},clear:function(){this.previousStack=[];this.previous.deactivate();this.nextStack=[];this.next.deactivate();},getState:function(){return{center:this.map.getCenter(),resolution:this.map.getResolution(),projection:this.map.getProjectionObject(),units:this.map.getProjectionObject().getUnits()||this.map.units||this.map.baseLayer.units};},restore:function(state){var center,zoom;if(this.map.getProjectionObject()==state.projection){zoom=this.map.getZoomForResolution(state.resolution);center=state.center;}else{center=state.center.clone();center.transform(state.projection,this.map.getProjectionObject());var sourceUnits=state.units;var targetUnits=this.map.getProjectionObject().getUnits()||this.map.units||this.map.baseLayer.units;var resolutionFactor=sourceUnits&&targetUnits?OpenLayers.INCHES_PER_UNIT[sourceUnits]/OpenLayers.INCHES_PER_UNIT[targetUnits]:1;zoom=this.map.getZoomForResolution(resolutionFactor*state.resolution);}
+this.map.setCenter(center,zoom);},setListeners:function(){this.listeners={};for(var type in this.registry){this.listeners[type]=OpenLayers.Function.bind(function(){if(!this.restoring){var state=this.registry[type].apply(this,arguments);this.previousStack.unshift(state);if(this.previousStack.length>1){this.onPreviousChange(this.previousStack[1],this.previousStack.length-1);}
+if(this.previousStack.length>(this.limit+1)){this.previousStack.pop();}
+if(this.nextStack.length>0){this.nextStack=[];this.onNextChange(null,0);}}
+return true;},this);}},activate:function(){var activated=false;if(this.map){if(OpenLayers.Control.prototype.activate.apply(this)){if(this.listeners==null){this.setListeners();}
+for(var type in this.listeners){this.map.events.register(type,this,this.listeners[type]);}
+activated=true;if(this.previousStack.length==0){this.initStack();}}}
+return activated;},initStack:function(){if(this.map.getCenter()){this.listeners.moveend();}},deactivate:function(){var deactivated=false;if(this.map){if(OpenLayers.Control.prototype.deactivate.apply(this)){for(var type in this.listeners){this.map.events.unregister(type,this,this.listeners[type]);}
+if(this.clearOnDeactivate){this.clear();}
+deactivated=true;}}
+return deactivated;},CLASS_NAME:"OpenLayers.Control.NavigationHistory"});OpenLayers.Control.PanPanel=OpenLayers.Class(OpenLayers.Control.Panel,{slideFactor:50,initialize:function(options){OpenLayers.Control.Panel.prototype.initialize.apply(this,[options]);this.addControls([new OpenLayers.Control.Pan(OpenLayers.Control.Pan.NORTH,{slideFactor:this.slideFactor}),new OpenLayers.Control.Pan(OpenLayers.Control.Pan.SOUTH,{slideFactor:this.slideFactor}),new OpenLayers.Control.Pan(OpenLayers.Control.Pan.EAST,{slideFactor:this.slideFactor}),new OpenLayers.Control.Pan(OpenLayers.Control.Pan.WEST,{slideFactor:this.slideFactor})]);},CLASS_NAME:"OpenLayers.Control.PanPanel"});OpenLayers.Control.PanZoomBar=OpenLayers.Class(OpenLayers.Control.PanZoom,{zoomStopWidth:18,zoomStopHeight:11,slider:null,sliderEvents:null,zoombarDiv:null,divEvents:null,zoomWorldIcon:false,forceFixedZoomLevel:false,mouseDragStart:null,zoomStart:null,initialize:function(){OpenLayers.Control.PanZoom.prototype.initialize.apply(this,arguments);},destroy:function(){this._removeZoomBar();this.map.events.un({"changebaselayer":this.redraw,scope:this});OpenLayers.Control.PanZoom.prototype.destroy.apply(this,arguments);delete this.mouseDragStart;delete this.zoomStart;},setMap:function(map){OpenLayers.Control.PanZoom.prototype.setMap.apply(this,arguments);this.map.events.register("changebaselayer",this,this.redraw);},redraw:function(){if(this.div!=null){this.removeButtons();this._removeZoomBar();}
+this.draw();},draw:function(px){OpenLayers.Control.prototype.draw.apply(this,arguments);px=this.position.clone();this.buttons=[];var sz=new OpenLayers.Size(18,18);var centered=new OpenLayers.Pixel(px.x+sz.w/2,px.y);var wposition=sz.w;if(this.zoomWorldIcon){centered=new OpenLayers.Pixel(px.x+sz.w,px.y);}
+this._addButton("panup","north-mini.png",centered,sz);px.y=centered.y+sz.h;this._addButton("panleft","west-mini.png",px,sz);if(this.zoomWorldIcon){this._addButton("zoomworld","zoom-world-mini.png",px.add(sz.w,0),sz);wposition*=2;}
+this._addButton("panright","east-mini.png",px.add(wposition,0),sz);this._addButton("pandown","south-mini.png",centered.add(0,sz.h*2),sz);this._addButton("zoomin","zoom-plus-mini.png",centered.add(0,sz.h*3+5),sz);centered=this._addZoomBar(centered.add(0,sz.h*4+5));this._addButton("zoomout","zoom-minus-mini.png",centered,sz);return this.div;},_addZoomBar:function(centered){var imgLocation=OpenLayers.Util.getImagesLocation();var id=this.id+"_"+this.map.id;var zoomsToEnd=this.map.getNumZoomLevels()-1-this.map.getZoom();var slider=OpenLayers.Util.createAlphaImageDiv(id,centered.add(-1,zoomsToEnd*this.zoomStopHeight),new OpenLayers.Size(20,9),imgLocation+"slider.png","absolute");this.slider=slider;this.sliderEvents=new OpenLayers.Events(this,slider,null,true,{includeXY:true});this.sliderEvents.on({"mousedown":this.zoomBarDown,"mousemove":this.zoomBarDrag,"mouseup":this.zoomBarUp,"dblclick":this.doubleClick,"click":this.doubleClick});var sz=new OpenLayers.Size();sz.h=this.zoomStopHeight*this.map.getNumZoomLevels();sz.w=this.zoomStopWidth;var div=null;if(OpenLayers.Util.alphaHack()){var id=this.id+"_"+this.map.id;div=OpenLayers.Util.createAlphaImageDiv(id,centered,new OpenLayers.Size(sz.w,this.zoomStopHeight),imgLocation+"zoombar.png","absolute",null,"crop");div.style.height=sz.h+"px";}else{div=OpenLayers.Util.createDiv('OpenLayers_Control_PanZoomBar_Zoombar'+this.map.id,centered,sz,imgLocation+"zoombar.png");}
+this.zoombarDiv=div;this.divEvents=new OpenLayers.Events(this,div,null,true,{includeXY:true});this.divEvents.on({"mousedown":this.divClick,"mousemove":this.passEventToSlider,"dblclick":this.doubleClick,"click":this.doubleClick});this.div.appendChild(div);this.startTop=parseInt(div.style.top);this.div.appendChild(slider);this.map.events.register("zoomend",this,this.moveZoomBar);centered=centered.add(0,this.zoomStopHeight*this.map.getNumZoomLevels());return centered;},_removeZoomBar:function(){this.sliderEvents.un({"mousedown":this.zoomBarDown,"mousemove":this.zoomBarDrag,"mouseup":this.zoomBarUp,"dblclick":this.doubleClick,"click":this.doubleClick});this.sliderEvents.destroy();this.divEvents.un({"mousedown":this.divClick,"mousemove":this.passEventToSlider,"dblclick":this.doubleClick,"click":this.doubleClick});this.divEvents.destroy();this.div.removeChild(this.zoombarDiv);this.zoombarDiv=null;this.div.removeChild(this.slider);this.slider=null;this.map.events.unregister("zoomend",this,this.moveZoomBar);},passEventToSlider:function(evt){this.sliderEvents.handleBrowserEvent(evt);},divClick:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+var y=evt.xy.y;var top=OpenLayers.Util.pagePosition(evt.object)[1];var levels=(y-top)/this.zoomStopHeight;if(this.forceFixedZoomLevel||!this.map.fractionalZoom){levels=Math.floor(levels);}
+var zoom=(this.map.getNumZoomLevels()-1)-levels;zoom=Math.min(Math.max(zoom,0),this.map.getNumZoomLevels()-1);this.map.zoomTo(zoom);OpenLayers.Event.stop(evt);},zoomBarDown:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+this.map.events.on({"mousemove":this.passEventToSlider,"mouseup":this.passEventToSlider,scope:this});this.mouseDragStart=evt.xy.clone();this.zoomStart=evt.xy.clone();this.div.style.cursor="move";this.zoombarDiv.offsets=null;OpenLayers.Event.stop(evt);},zoomBarDrag:function(evt){if(this.mouseDragStart!=null){var deltaY=this.mouseDragStart.y-evt.xy.y;var offsets=OpenLayers.Util.pagePosition(this.zoombarDiv);if((evt.clientY-offsets[1])>0&&(evt.clientY-offsets[1])<parseInt(this.zoombarDiv.style.height)-2){var newTop=parseInt(this.slider.style.top)-deltaY;this.slider.style.top=newTop+"px";this.mouseDragStart=evt.xy.clone();}
+OpenLayers.Event.stop(evt);}},zoomBarUp:function(evt){if(!OpenLayers.Event.isLeftClick(evt)){return;}
+if(this.mouseDragStart){this.div.style.cursor="";this.map.events.un({"mouseup":this.passEventToSlider,"mousemove":this.passEventToSlider,scope:this});var deltaY=this.zoomStart.y-evt.xy.y;var zoomLevel=this.map.zoom;if(!this.forceFixedZoomLevel&&this.map.fractionalZoom){zoomLevel+=deltaY/this.zoomStopHeight;zoomLevel=Math.min(Math.max(zoomLevel,0),this.map.getNumZoomLevels()-1);}else{zoomLevel+=Math.round(deltaY/this.zoomStopHeight);}
+this.map.zoomTo(zoomLevel);this.mouseDragStart=null;this.zoomStart=null;OpenLayers.Event.stop(evt);}},moveZoomBar:function(){var newTop=((this.map.getNumZoomLevels()-1)-this.map.getZoom())*this.zoomStopHeight+this.startTop+1;this.slider.style.top=newTop+"px";},CLASS_NAME:"OpenLayers.Control.PanZoomBar"});OpenLayers.Control.Permalink=OpenLayers.Class(OpenLayers.Control,{argParserClass:OpenLayers.Control.ArgParser,element:null,base:'',displayProjection:null,initialize:function(element,base,options){OpenLayers.Control.prototype.initialize.apply(this,[options]);this.element=OpenLayers.Util.getElement(element);this.base=base||document.location.href;},destroy:function(){if(this.element.parentNode==this.div){this.div.removeChild(this.element);}
+this.element=null;this.map.events.unregister('moveend',this,this.updateLink);OpenLayers.Control.prototype.destroy.apply(this,arguments);},setMap:function(map){OpenLayers.Control.prototype.setMap.apply(this,arguments);for(var i=0,len=this.map.controls.length;i<len;i++){var control=this.map.controls[i];if(control.CLASS_NAME==this.argParserClass.CLASS_NAME){if(control.displayProjection!=this.displayProjection){this.displayProjection=control.displayProjection;}
+break;}}
+if(i==this.map.controls.length){this.map.addControl(new this.argParserClass({'displayProjection':this.displayProjection}));}},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!this.element){this.div.className=this.displayClass;this.element=document.createElement("a");this.element.innerHTML=OpenLayers.i18n("permalink");this.element.href="";this.div.appendChild(this.element);}
+this.map.events.on({'moveend':this.updateLink,'changelayer':this.updateLink,'changebaselayer':this.updateLink,scope:this});this.updateLink();return this.div;},updateLink:function(){var href=this.base;if(href.indexOf('?')!=-1){href=href.substring(0,href.indexOf('?'));}
+href+='?'+OpenLayers.Util.getParameterString(this.createParams());this.element.href=href;},createParams:function(center,zoom,layers){center=center||this.map.getCenter();var params=OpenLayers.Util.getParameters(this.base);if(center){params.zoom=zoom||this.map.getZoom();var lat=center.lat;var lon=center.lon;if(this.displayProjection){var mapPosition=OpenLayers.Projection.transform({x:lon,y:lat},this.map.getProjectionObject(),this.displayProjection);lon=mapPosition.x;lat=mapPosition.y;}
+params.lat=Math.round(lat*100000)/100000;params.lon=Math.round(lon*100000)/100000;layers=layers||this.map.layers;params.layers='';for(var i=0,len=layers.length;i<len;i++){var layer=layers[i];if(layer.isBaseLayer){params.layers+=(layer==this.map.baseLayer)?"B":"0";}else{params.layers+=(layer.getVisibility())?"T":"F";}}}
+return params;},CLASS_NAME:"OpenLayers.Control.Permalink"});OpenLayers.Control.ZoomPanel=OpenLayers.Class(OpenLayers.Control.Panel,{initialize:function(options){OpenLayers.Control.Panel.prototype.initialize.apply(this,[options]);this.addControls([new OpenLayers.Control.ZoomIn(),new OpenLayers.Control.ZoomToMaxExtent(),new OpenLayers.Control.ZoomOut()]);},CLASS_NAME:"OpenLayers.Control.ZoomPanel"});OpenLayers.Format.CSWGetDomain=function(options){options=OpenLayers.Util.applyDefaults(options,OpenLayers.Format.CSWGetDomain.DEFAULTS);var cls=OpenLayers.Format.CSWGetDomain["v"+options.version.replace(/\./g,"_")];if(!cls){throw"Unsupported CSWGetDomain version: "+options.version;}
+return new cls(options);};OpenLayers.Format.CSWGetDomain.DEFAULTS={"version":"2.0.2"};OpenLayers.Format.CSWGetRecords=function(options){options=OpenLayers.Util.applyDefaults(options,OpenLayers.Format.CSWGetRecords.DEFAULTS);var cls=OpenLayers.Format.CSWGetRecords["v"+options.version.replace(/\./g,"_")];if(!cls){throw"Unsupported CSWGetRecords version: "+options.version;}
+return new cls(options);};OpenLayers.Format.CSWGetRecords.DEFAULTS={"version":"2.0.2"};OpenLayers.Format.JSON=OpenLayers.Class(OpenLayers.Format,{indent:"    ",space:" ",newline:"\n",level:0,pretty:false,initialize:function(options){OpenLayers.Format.prototype.initialize.apply(this,[options]);},read:function(json,filter){try{if(/^[\],:{}\s]*$/.test(json.replace(/\\["\\\/bfnrtu]/g,'@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,']').replace(/(?:^|:|,)(?:\s*\[)+/g,''))){var object=eval('('+json+')');if(typeof filter==='function'){function walk(k,v){if(v&&typeof v==='object'){for(var i in v){if(v.hasOwnProperty(i)){v[i]=walk(i,v[i]);}}}
+return filter(k,v);}
+object=walk('',object);}
+if(this.keepData){this.data=object;}
+return object;}}catch(e){}
+return null;},write:function(value,pretty){this.pretty=!!pretty;var json=null;var type=typeof value;if(this.serialize[type]){try{json=this.serialize[type].apply(this,[value]);}catch(err){OpenLayers.Console.error("Trouble serializing: "+err);}}
+return json;},writeIndent:function(){var pieces=[];if(this.pretty){for(var i=0;i<this.level;++i){pieces.push(this.indent);}}
+return pieces.join('');},writeNewline:function(){return(this.pretty)?this.newline:'';},writeSpace:function(){return(this.pretty)?this.space:'';},serialize:{'object':function(object){if(object==null){return"null";}
+if(object.constructor==Date){return this.serialize.date.apply(this,[object]);}
+if(object.constructor==Array){return this.serialize.array.apply(this,[object]);}
+var pieces=['{'];this.level+=1;var key,keyJSON,valueJSON;var addComma=false;for(key in object){if(object.hasOwnProperty(key)){keyJSON=OpenLayers.Format.JSON.prototype.write.apply(this,[key,this.pretty]);valueJSON=OpenLayers.Format.JSON.prototype.write.apply(this,[object[key],this.pretty]);if(keyJSON!=null&&valueJSON!=null){if(addComma){pieces.push(',');}
+pieces.push(this.writeNewline(),this.writeIndent(),keyJSON,':',this.writeSpace(),valueJSON);addComma=true;}}}
+this.level-=1;pieces.push(this.writeNewline(),this.writeIndent(),'}');return pieces.join('');},'array':function(array){var json;var pieces=['['];this.level+=1;for(var i=0,len=array.length;i<len;++i){json=OpenLayers.Format.JSON.prototype.write.apply(this,[array[i],this.pretty]);if(json!=null){if(i>0){pieces.push(',');}
+pieces.push(this.writeNewline(),this.writeIndent(),json);}}
+this.level-=1;pieces.push(this.writeNewline(),this.writeIndent(),']');return pieces.join('');},'string':function(string){var m={'\b':'\\b','\t':'\\t','\n':'\\n','\f':'\\f','\r':'\\r','"':'\\"','\\':'\\\\'};if(/["\\\x00-\x1f]/.test(string)){return'"'+string.replace(/([\x00-\x1f\\"])/g,function(a,b){var c=m[b];if(c){return c;}
+c=b.charCodeAt();return'\\u00'+
+Math.floor(c/16).toString(16)+
+(c%16).toString(16);})+'"';}
+return'"'+string+'"';},'number':function(number){return isFinite(number)?String(number):"null";},'boolean':function(bool){return String(bool);},'date':function(date){function format(number){return(number<10)?'0'+number:number;}
+return'"'+date.getFullYear()+'-'+
+format(date.getMonth()+1)+'-'+
+format(date.getDate())+'T'+
+format(date.getHours())+':'+
+format(date.getMinutes())+':'+
+format(date.getSeconds())+'"';}},CLASS_NAME:"OpenLayers.Format.JSON"});OpenLayers.Format.WFST=function(options){options=OpenLayers.Util.applyDefaults(options,OpenLayers.Format.WFST.DEFAULTS);var cls=OpenLayers.Format.WFST["v"+options.version.replace(/\./g,"_")];if(!cls){throw"Unsupported WFST version: "+options.version;}
+return new cls(options);};OpenLayers.Format.WFST.DEFAULTS={"version":"1.0.0"};OpenLayers.Format.XML=OpenLayers.Class(OpenLayers.Format,{namespaces:null,namespaceAlias:null,defaultPrefix:null,readers:{},writers:{},xmldom:null,initialize:function(options){if(window.ActiveXObject){this.xmldom=new ActiveXObject("Microsoft.XMLDOM");}
+OpenLayers.Format.prototype.initialize.apply(this,[options]);this.namespaces=OpenLayers.Util.extend({},this.namespaces);this.namespaceAlias={};for(var alias in this.namespaces){this.namespaceAlias[this.namespaces[alias]]=alias;}},destroy:function(){this.xmldom=null;OpenLayers.Format.prototype.destroy.apply(this,arguments);},setNamespace:function(alias,uri){this.namespaces[alias]=uri;this.namespaceAlias[uri]=alias;},read:function(text){var index=text.indexOf('<');if(index>0){text=text.substring(index);}
+var node=OpenLayers.Util.Try(OpenLayers.Function.bind((function(){var xmldom;if(window.ActiveXObject&&!this.xmldom){xmldom=new ActiveXObject("Microsoft.XMLDOM");}else{xmldom=this.xmldom;}
+xmldom.loadXML(text);return xmldom;}),this),function(){return new DOMParser().parseFromString(text,'text/xml');},function(){var req=new XMLHttpRequest();req.open("GET","data:"+"text/xml"+";charset=utf-8,"+encodeURIComponent(text),false);if(req.overrideMimeType){req.overrideMimeType("text/xml");}
+req.send(null);return req.responseXML;});if(this.keepData){this.data=node;}
+return node;},write:function(node){var data;if(this.xmldom){data=node.xml;}else{var serializer=new XMLSerializer();if(node.nodeType==1){var doc=document.implementation.createDocument("","",null);if(doc.importNode){node=doc.importNode(node,true);}
+doc.appendChild(node);data=serializer.serializeToString(doc);}else{data=serializer.serializeToString(node);}}
+return data;},createElementNS:function(uri,name){var element;if(this.xmldom){if(typeof uri=="string"){element=this.xmldom.createNode(1,name,uri);}else{element=this.xmldom.createNode(1,name,"");}}else{element=document.createElementNS(uri,name);}
+return element;},createTextNode:function(text){var node;if(typeof text!=="string"){text=String(text);}
+if(this.xmldom){node=this.xmldom.createTextNode(text);}else{node=document.createTextNode(text);}
+return node;},getElementsByTagNameNS:function(node,uri,name){var elements=[];if(node.getElementsByTagNameNS){elements=node.getElementsByTagNameNS(uri,name);}else{var allNodes=node.getElementsByTagName("*");var potentialNode,fullName;for(var i=0,len=allNodes.length;i<len;++i){potentialNode=allNodes[i];fullName=(potentialNode.prefix)?(potentialNode.prefix+":"+name):name;if((name=="*")||(fullName==potentialNode.nodeName)){if((uri=="*")||(uri==potentialNode.namespaceURI)){elements.push(potentialNode);}}}}
+return elements;},getAttributeNodeNS:function(node,uri,name){var attributeNode=null;if(node.getAttributeNodeNS){attributeNode=node.getAttributeNodeNS(uri,name);}else{var attributes=node.attributes;var potentialNode,fullName;for(var i=0,len=attributes.length;i<len;++i){potentialNode=attributes[i];if(potentialNode.namespaceURI==uri){fullName=(potentialNode.prefix)?(potentialNode.prefix+":"+name):name;if(fullName==potentialNode.nodeName){attributeNode=potentialNode;break;}}}}
+return attributeNode;},getAttributeNS:function(node,uri,name){var attributeValue="";if(node.getAttributeNS){attributeValue=node.getAttributeNS(uri,name)||"";}else{var attributeNode=this.getAttributeNodeNS(node,uri,name);if(attributeNode){attributeValue=attributeNode.nodeValue;}}
+return attributeValue;},getChildValue:function(node,def){var value=def||"";if(node){for(var child=node.firstChild;child;child=child.nextSibling){switch(child.nodeType){case 3:case 4:value+=child.nodeValue;}}}
+return value;},concatChildValues:function(node,def){var value="";var child=node.firstChild;var childValue;while(child){childValue=child.nodeValue;if(childValue){value+=childValue;}
+child=child.nextSibling;}
+if(value==""&&def!=undefined){value=def;}
+return value;},isSimpleContent:function(node){var simple=true;for(var child=node.firstChild;child;child=child.nextSibling){if(child.nodeType===1){simple=false;break;}}
+return simple;},contentType:function(node){var simple=false,complex=false;var type=OpenLayers.Format.XML.CONTENT_TYPE.EMPTY;for(var child=node.firstChild;child;child=child.nextSibling){switch(child.nodeType){case 1:complex=true;break;case 8:break;default:simple=true;}
+if(complex&&simple){break;}}
+if(complex&&simple){type=OpenLayers.Format.XML.CONTENT_TYPE.MIXED;}else if(complex){return OpenLayers.Format.XML.CONTENT_TYPE.COMPLEX;}else if(simple){return OpenLayers.Format.XML.CONTENT_TYPE.SIMPLE;}
+return type;},hasAttributeNS:function(node,uri,name){var found=false;if(node.hasAttributeNS){found=node.hasAttributeNS(uri,name);}else{found=!!this.getAttributeNodeNS(node,uri,name);}
+return found;},setAttributeNS:function(node,uri,name,value){if(node.setAttributeNS){node.setAttributeNS(uri,name,value);}else{if(this.xmldom){if(uri){var attribute=node.ownerDocument.createNode(2,name,uri);attribute.nodeValue=value;node.setAttributeNode(attribute);}else{node.setAttribute(name,value);}}else{throw"setAttributeNS not implemented";}}},createElementNSPlus:function(name,options){options=options||{};var uri=options.uri||this.namespaces[options.prefix];if(!uri){var loc=name.indexOf(":");uri=this.namespaces[name.substring(0,loc)];}
+if(!uri){uri=this.namespaces[this.defaultPrefix];}
+var node=this.createElementNS(uri,name);if(options.attributes){this.setAttributes(node,options.attributes);}
+var value=options.value;if(value!=null){node.appendChild(this.createTextNode(value));}
+return node;},setAttributes:function(node,obj){var value,uri;for(var name in obj){if(obj[name]!=null&&obj[name].toString){value=obj[name].toString();uri=this.namespaces[name.substring(0,name.indexOf(":"))]||null;this.setAttributeNS(node,uri,name,value);}}},readNode:function(node,obj){if(!obj){obj={};}
+var group=this.readers[node.namespaceURI?this.namespaceAlias[node.namespaceURI]:this.defaultPrefix];if(group){var local=node.localName||node.nodeName.split(":").pop();var reader=group[local]||group["*"];if(reader){reader.apply(this,[node,obj]);}}
+return obj;},readChildNodes:function(node,obj){if(!obj){obj={};}
+var children=node.childNodes;var child;for(var i=0,len=children.length;i<len;++i){child=children[i];if(child.nodeType==1){this.readNode(child,obj);}}
+return obj;},writeNode:function(name,obj,parent){var prefix,local;var split=name.indexOf(":");if(split>0){prefix=name.substring(0,split);local=name.substring(split+1);}else{if(parent){prefix=this.namespaceAlias[parent.namespaceURI];}else{prefix=this.defaultPrefix;}
+local=name;}
+var child=this.writers[prefix][local].apply(this,[obj]);if(parent){parent.appendChild(child);}
+return child;},getChildEl:function(node,name,uri){return node&&this.getThisOrNextEl(node.firstChild,name,uri);},getNextEl:function(node,name,uri){return node&&this.getThisOrNextEl(node.nextSibling,name,uri);},getThisOrNextEl:function(node,name,uri){outer:for(var sibling=node;sibling;sibling=sibling.nextSibling){switch(sibling.nodeType){case 1:if((!name||name===(sibling.localName||sibling.nodeName.split(":").pop()))&&(!uri||uri===sibling.namespaceURI)){break outer;}
+sibling=null;break outer;case 3:if(/^\s*$/.test(sibling.nodeValue)){break;}
+case 4:case 6:case 12:case 10:case 11:sibling=null;break outer;}}
+return sibling||null;},lookupNamespaceURI:function(node,prefix){var uri=null;if(node){if(node.lookupNamespaceURI){uri=node.lookupNamespaceURI(prefix);}else{outer:switch(node.nodeType){case 1:if(node.namespaceURI!==null&&node.prefix===prefix){uri=node.namespaceURI;break outer;}
+var len=node.attributes.length;if(len){var attr;for(var i=0;i<len;++i){attr=node.attributes[i];if(attr.prefix==="xmlns"&&attr.name==="xmlns:"+prefix){uri=attr.value||null;break outer;}else if(attr.name==="xmlns"&&prefix===null){uri=attr.value||null;break outer;}}}
+uri=this.lookupNamespaceURI(node.parentNode,prefix);break outer;case 2:uri=this.lookupNamespaceURI(node.ownerElement,prefix);break outer;case 9:uri=this.lookupNamespaceURI(node.documentElement,prefix);break outer;case 6:case 12:case 10:case 11:break outer;default:uri=this.lookupNamespaceURI(node.parentNode,prefix);break outer;}}}
+return uri;},CLASS_NAME:"OpenLayers.Format.XML"});OpenLayers.Format.XML.CONTENT_TYPE={EMPTY:0,SIMPLE:1,COMPLEX:2,MIXED:3};OpenLayers.Format.XML.lookupNamespaceURI=OpenLayers.Function.bind(OpenLayers.Format.XML.prototype.lookupNamespaceURI,OpenLayers.Format.XML.prototype);OpenLayers.Handler=OpenLayers.Class({id:null,control:null,map:null,keyMask:null,active:false,evt:null,initialize:function(control,callbacks,options){OpenLayers.Util.extend(this,options);this.control=control;this.callbacks=callbacks;var map=this.map||control.map;if(map){this.setMap(map);}
+this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},setMap:function(map){this.map=map;},checkModifiers:function(evt){if(this.keyMask==null){return true;}
+var keyModifiers=(evt.shiftKey?OpenLayers.Handler.MOD_SHIFT:0)|(evt.ctrlKey?OpenLayers.Handler.MOD_CTRL:0)|(evt.altKey?OpenLayers.Handler.MOD_ALT:0);return(keyModifiers==this.keyMask);},activate:function(){if(this.active){return false;}
+var events=OpenLayers.Events.prototype.BROWSER_EVENTS;for(var i=0,len=events.length;i<len;i++){if(this[events[i]]){this.register(events[i],this[events[i]]);}}
+this.active=true;return true;},deactivate:function(){if(!this.active){return false;}
+var events=OpenLayers.Events.prototype.BROWSER_EVENTS;for(var i=0,len=events.length;i<len;i++){if(this[events[i]]){this.unregister(events[i],this[events[i]]);}}
+this.active=false;return true;},callback:function(name,args){if(name&&this.callbacks[name]){this.callbacks[name].apply(this.control,args);}},register:function(name,method){this.map.events.registerPriority(name,this,method);this.map.events.registerPriority(name,this,this.setEvent);},unregister:function(name,method){this.map.events.unregister(name,this,method);this.map.events.unregister(name,this,this.setEvent);},setEvent:function(evt){this.evt=evt;return true;},destroy:function(){this.deactivate();this.control=this.map=null;},CLASS_NAME:"OpenLayers.Handler"});OpenLayers.Handler.MOD_NONE=0;OpenLayers.Handler.MOD_SHIFT=1;OpenLayers.Handler.MOD_CTRL=2;OpenLayers.Handler.MOD_ALT=4;OpenLayers.Map=OpenLayers.Class({Z_INDEX_BASE:{BaseLayer:100,Overlay:325,Feature:725,Popup:750,Control:1000},EVENT_TYPES:["preaddlayer","addlayer","removelayer","changelayer","movestart","move","moveend","zoomend","popupopen","popupclose","addmarker","removemarker","clearmarkers","mouseover","mouseout","mousemove","dragstart","drag","dragend","changebaselayer"],id:null,fractionalZoom:false,events:null,allOverlays:false,div:null,dragging:false,size:null,viewPortDiv:null,layerContainerOrigin:null,layerContainerDiv:null,layers:null,controls:null,popups:null,baseLayer:null,center:null,resolution:null,zoom:0,panRatio:1.5,viewRequestID:0,tileSize:null,projection:"EPSG:4326",units:'degrees',resolutions:null,maxResolution:1.40625,minResolution:null,maxScale:null,minScale:null,maxExtent:null,minExtent:null,restrictedExtent:null,numZoomLevels:16,theme:null,displayProjection:null,fallThrough:true,panTween:null,eventListeners:null,panMethod:OpenLayers.Easing.Expo.easeOut,panDuration:50,paddingForPopups:null,initialize:function(div,options){if(arguments.length===1&&typeof div==="object"){options=div;div=options&&options.div;}
+this.tileSize=new OpenLayers.Size(OpenLayers.Map.TILE_WIDTH,OpenLayers.Map.TILE_HEIGHT);this.maxExtent=new OpenLayers.Bounds(-180,-90,180,90);this.paddingForPopups=new OpenLayers.Bounds(15,15,15,15);this.theme=OpenLayers._getScriptLocation()+'theme/default/style.css';OpenLayers.Util.extend(this,options);this.layers=[];this.id=OpenLayers.Util.createUniqueID("OpenLayers.Map_");this.div=OpenLayers.Util.getElement(div);if(!this.div){this.div=document.createElement("div");this.div.style.height="1px";this.div.style.width="1px";}
+OpenLayers.Element.addClass(this.div,'olMap');var id=this.id+"_OpenLayers_ViewPort";this.viewPortDiv=OpenLayers.Util.createDiv(id,null,null,null,"relative",null,"hidden");this.viewPortDiv.style.width="100%";this.viewPortDiv.style.height="100%";this.viewPortDiv.className="olMapViewport";this.div.appendChild(this.viewPortDiv);id=this.id+"_OpenLayers_Container";this.layerContainerDiv=OpenLayers.Util.createDiv(id);this.layerContainerDiv.style.zIndex=this.Z_INDEX_BASE['Popup']-1;this.viewPortDiv.appendChild(this.layerContainerDiv);this.events=new OpenLayers.Events(this,this.div,this.EVENT_TYPES,this.fallThrough,{includeXY:true});this.updateSize();if(this.eventListeners instanceof Object){this.events.on(this.eventListeners);}
+this.events.register("movestart",this,this.updateSize);if(OpenLayers.String.contains(navigator.appName,"Microsoft")){this.events.register("resize",this,this.updateSize);}else{this.updateSizeDestroy=OpenLayers.Function.bind(this.updateSize,this);OpenLayers.Event.observe(window,'resize',this.updateSizeDestroy);}
+if(this.theme){var addNode=true;var nodes=document.getElementsByTagName('link');for(var i=0,len=nodes.length;i<len;++i){if(OpenLayers.Util.isEquivalentUrl(nodes.item(i).href,this.theme)){addNode=false;break;}}
+if(addNode){var cssNode=document.createElement('link');cssNode.setAttribute('rel','stylesheet');cssNode.setAttribute('type','text/css');cssNode.setAttribute('href',this.theme);document.getElementsByTagName('head')[0].appendChild(cssNode);}}
+if(this.controls==null){if(OpenLayers.Control!=null){this.controls=[new OpenLayers.Control.Navigation(),new OpenLayers.Control.PanZoom(),new OpenLayers.Control.ArgParser(),new OpenLayers.Control.Attribution()];}else{this.controls=[];}}
+for(var i=0,len=this.controls.length;i<len;i++){this.addControlToMap(this.controls[i]);}
+this.popups=[];this.unloadDestroy=OpenLayers.Function.bind(this.destroy,this);OpenLayers.Event.observe(window,'unload',this.unloadDestroy);if(options&&options.layers){this.addLayers(options.layers);if(options.center){this.setCenter(options.center,options.zoom);}}},render:function(div){this.div=OpenLayers.Util.getElement(div);OpenLayers.Element.addClass(this.div,'olMap');this.events.attachToElement(this.div);this.viewPortDiv.parentNode.removeChild(this.viewPortDiv);this.div.appendChild(this.viewPortDiv);this.updateSize();},unloadDestroy:null,updateSizeDestroy:null,destroy:function(){if(!this.unloadDestroy){return false;}
+if(this.panTween){this.panTween.stop();this.panTween=null;}
+OpenLayers.Event.stopObserving(window,'unload',this.unloadDestroy);this.unloadDestroy=null;if(this.updateSizeDestroy){OpenLayers.Event.stopObserving(window,'resize',this.updateSizeDestroy);}else{this.events.unregister("resize",this,this.updateSize);}
+this.paddingForPopups=null;if(this.controls!=null){for(var i=this.controls.length-1;i>=0;--i){this.controls[i].destroy();}
+this.controls=null;}
+if(this.layers!=null){for(var i=this.layers.length-1;i>=0;--i){this.layers[i].destroy(false);}
+this.layers=null;}
+if(this.viewPortDiv){this.div.removeChild(this.viewPortDiv);}
+this.viewPortDiv=null;if(this.eventListeners){this.events.un(this.eventListeners);this.eventListeners=null;}
+this.events.destroy();this.events=null;},setOptions:function(options){OpenLayers.Util.extend(this,options);},getTileSize:function(){return this.tileSize;},getBy:function(array,property,match){var test=(typeof match.test=="function");var found=OpenLayers.Array.filter(this[array],function(item){return item[property]==match||(test&&match.test(item[property]));});return found;},getLayersBy:function(property,match){return this.getBy("layers",property,match);},getLayersByName:function(match){return this.getLayersBy("name",match);},getLayersByClass:function(match){return this.getLayersBy("CLASS_NAME",match);},getControlsBy:function(property,match){return this.getBy("controls",property,match);},getControlsByClass:function(match){return this.getControlsBy("CLASS_NAME",match);},getLayer:function(id){var foundLayer=null;for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];if(layer.id==id){foundLayer=layer;break;}}
+return foundLayer;},setLayerZIndex:function(layer,zIdx){layer.setZIndex(this.Z_INDEX_BASE[layer.isBaseLayer?'BaseLayer':'Overlay']
++zIdx*5);},resetLayersZIndex:function(){for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];this.setLayerZIndex(layer,i);}},addLayer:function(layer){for(var i=0,len=this.layers.length;i<len;i++){if(this.layers[i]==layer){var msg=OpenLayers.i18n('layerAlreadyAdded',{'layerName':layer.name});OpenLayers.Console.warn(msg);return false;}}
+if(this.allOverlays){layer.isBaseLayer=false;}
+if(this.events.triggerEvent("preaddlayer",{layer:layer})===false){return;}
+layer.div.className="olLayerDiv";layer.div.style.overflow="";this.setLayerZIndex(layer,this.layers.length);if(layer.isFixed){this.viewPortDiv.appendChild(layer.div);}else{this.layerContainerDiv.appendChild(layer.div);}
+this.layers.push(layer);layer.setMap(this);if(layer.isBaseLayer||(this.allOverlays&&!this.baseLayer)){if(this.baseLayer==null){this.setBaseLayer(layer);}else{layer.setVisibility(false);}}else{layer.redraw();}
+this.events.triggerEvent("addlayer",{layer:layer});layer.afterAdd();},addLayers:function(layers){for(var i=0,len=layers.length;i<len;i++){this.addLayer(layers[i]);}},removeLayer:function(layer,setNewBaseLayer){if(setNewBaseLayer==null){setNewBaseLayer=true;}
+if(layer.isFixed){this.viewPortDiv.removeChild(layer.div);}else{this.layerContainerDiv.removeChild(layer.div);}
+OpenLayers.Util.removeItem(this.layers,layer);layer.removeMap(this);layer.map=null;if(this.baseLayer==layer){this.baseLayer=null;if(setNewBaseLayer){for(var i=0,len=this.layers.length;i<len;i++){var iLayer=this.layers[i];if(iLayer.isBaseLayer||this.allOverlays){this.setBaseLayer(iLayer);break;}}}}
+this.resetLayersZIndex();this.events.triggerEvent("removelayer",{layer:layer});},getNumLayers:function(){return this.layers.length;},getLayerIndex:function(layer){return OpenLayers.Util.indexOf(this.layers,layer);},setLayerIndex:function(layer,idx){var base=this.getLayerIndex(layer);if(idx<0){idx=0;}else if(idx>this.layers.length){idx=this.layers.length;}
+if(base!=idx){this.layers.splice(base,1);this.layers.splice(idx,0,layer);for(var i=0,len=this.layers.length;i<len;i++){this.setLayerZIndex(this.layers[i],i);}
+this.events.triggerEvent("changelayer",{layer:layer,property:"order"});if(this.allOverlays){if(idx===0){this.setBaseLayer(layer);}else if(this.baseLayer!==this.layers[0]){this.setBaseLayer(this.layers[0]);}}}},raiseLayer:function(layer,delta){var idx=this.getLayerIndex(layer)+delta;this.setLayerIndex(layer,idx);},setBaseLayer:function(newBaseLayer){if(newBaseLayer!=this.baseLayer){if(OpenLayers.Util.indexOf(this.layers,newBaseLayer)!=-1){var center=this.getCenter();var newResolution=OpenLayers.Util.getResolutionFromScale(this.getScale(),newBaseLayer.units);if(this.baseLayer!=null&&!this.allOverlays){this.baseLayer.setVisibility(false);}
+this.baseLayer=newBaseLayer;this.viewRequestID++;if(!this.allOverlays||this.baseLayer.visibility){this.baseLayer.setVisibility(true);}
+if(center!=null){var newZoom=this.getZoomForResolution(newResolution||this.resolution,true);this.setCenter(center,newZoom,false,true);}
+this.events.triggerEvent("changebaselayer",{layer:this.baseLayer});}}},addControl:function(control,px){this.controls.push(control);this.addControlToMap(control,px);},addControls:function(controls,pixels){var pxs=(arguments.length===1)?[]:pixels;for(var i=0,len=controls.length;i<len;i++){var ctrl=controls[i];var px=(pxs[i])?pxs[i]:null;this.addControl(ctrl,px);}},addControlToMap:function(control,px){control.outsideViewport=(control.div!=null);if(this.displayProjection&&!control.displayProjection){control.displayProjection=this.displayProjection;}
+control.setMap(this);var div=control.draw(px);if(div){if(!control.outsideViewport){div.style.zIndex=this.Z_INDEX_BASE['Control']+
+this.controls.length;this.viewPortDiv.appendChild(div);}}
+if(control.autoActivate){control.activate();}},getControl:function(id){var returnControl=null;for(var i=0,len=this.controls.length;i<len;i++){var control=this.controls[i];if(control.id==id){returnControl=control;break;}}
+return returnControl;},removeControl:function(control){if((control)&&(control==this.getControl(control.id))){if(control.div&&(control.div.parentNode==this.viewPortDiv)){this.viewPortDiv.removeChild(control.div);}
+OpenLayers.Util.removeItem(this.controls,control);}},addPopup:function(popup,exclusive){if(exclusive){for(var i=this.popups.length-1;i>=0;--i){this.removePopup(this.popups[i]);}}
+popup.map=this;this.popups.push(popup);var popupDiv=popup.draw();if(popupDiv){popupDiv.style.zIndex=this.Z_INDEX_BASE['Popup']+
+this.popups.length;this.layerContainerDiv.appendChild(popupDiv);}},removePopup:function(popup){OpenLayers.Util.removeItem(this.popups,popup);if(popup.div){try{this.layerContainerDiv.removeChild(popup.div);}
+catch(e){}}
+popup.map=null;},getSize:function(){var size=null;if(this.size!=null){size=this.size.clone();}
+return size;},updateSize:function(){var newSize=this.getCurrentSize();if(newSize&&!isNaN(newSize.h)&&!isNaN(newSize.w)){this.events.clearMouseCache();var oldSize=this.getSize();if(oldSize==null){this.size=oldSize=newSize;}
+if(!newSize.equals(oldSize)){this.size=newSize;for(var i=0,len=this.layers.length;i<len;i++){this.layers[i].onMapResize();}
+var center=this.getCenter();if(this.baseLayer!=null&&center!=null){var zoom=this.getZoom();this.zoom=null;this.setCenter(center,zoom);}}}},getCurrentSize:function(){var size=new OpenLayers.Size(this.div.clientWidth,this.div.clientHeight);if(size.w==0&&size.h==0||isNaN(size.w)&&isNaN(size.h)){size.w=this.div.offsetWidth;size.h=this.div.offsetHeight;}
+if(size.w==0&&size.h==0||isNaN(size.w)&&isNaN(size.h)){size.w=parseInt(this.div.style.width);size.h=parseInt(this.div.style.height);}
+return size;},calculateBounds:function(center,resolution){var extent=null;if(center==null){center=this.getCenter();}
+if(resolution==null){resolution=this.getResolution();}
+if((center!=null)&&(resolution!=null)){var size=this.getSize();var w_deg=size.w*resolution;var h_deg=size.h*resolution;extent=new OpenLayers.Bounds(center.lon-w_deg/2,center.lat-h_deg/2,center.lon+w_deg/2,center.lat+h_deg/2);}
+return extent;},getCenter:function(){var center=null;if(this.center){center=this.center.clone();}
+return center;},getZoom:function(){return this.zoom;},pan:function(dx,dy,options){options=OpenLayers.Util.applyDefaults(options,{animate:true,dragging:false});var centerPx=this.getViewPortPxFromLonLat(this.getCenter());var newCenterPx=centerPx.add(dx,dy);if(!options.dragging||!newCenterPx.equals(centerPx)){var newCenterLonLat=this.getLonLatFromViewPortPx(newCenterPx);if(options.animate){this.panTo(newCenterLonLat);}else{this.setCenter(newCenterLonLat,null,options.dragging);}}},panTo:function(lonlat){if(this.panMethod&&this.getExtent().scale(this.panRatio).containsLonLat(lonlat)){if(!this.panTween){this.panTween=new OpenLayers.Tween(this.panMethod);}
+var center=this.getCenter();if(lonlat.lon==center.lon&&lonlat.lat==center.lat){return;}
+var from={lon:center.lon,lat:center.lat};var to={lon:lonlat.lon,lat:lonlat.lat};this.panTween.start(from,to,this.panDuration,{callbacks:{start:OpenLayers.Function.bind(function(lonlat){this.events.triggerEvent("movestart");},this),eachStep:OpenLayers.Function.bind(function(lonlat){lonlat=new OpenLayers.LonLat(lonlat.lon,lonlat.lat);this.moveTo(lonlat,this.zoom,{'dragging':true,'noEvent':true});},this),done:OpenLayers.Function.bind(function(lonlat){lonlat=new OpenLayers.LonLat(lonlat.lon,lonlat.lat);this.moveTo(lonlat,this.zoom,{'noEvent':true});this.events.triggerEvent("moveend");},this)}});}else{this.setCenter(lonlat);}},setCenter:function(lonlat,zoom,dragging,forceZoomChange){this.moveTo(lonlat,zoom,{'dragging':dragging,'forceZoomChange':forceZoomChange,'caller':'setCenter'});},moveTo:function(lonlat,zoom,options){if(!options){options={};}
+if(zoom!=null){zoom=parseFloat(zoom);if(!this.fractionalZoom){zoom=Math.round(zoom);}}
+var dragging=options.dragging;var forceZoomChange=options.forceZoomChange;var noEvent=options.noEvent;if(this.panTween&&options.caller=="setCenter"){this.panTween.stop();}
+if(!this.center&&!this.isValidLonLat(lonlat)){lonlat=this.maxExtent.getCenterLonLat();}
+if(this.restrictedExtent!=null){if(lonlat==null){lonlat=this.getCenter();}
+if(zoom==null){zoom=this.getZoom();}
+var resolution=this.getResolutionForZoom(zoom);var extent=this.calculateBounds(lonlat,resolution);if(!this.restrictedExtent.containsBounds(extent)){var maxCenter=this.restrictedExtent.getCenterLonLat();if(extent.getWidth()>this.restrictedExtent.getWidth()){lonlat=new OpenLayers.LonLat(maxCenter.lon,lonlat.lat);}else if(extent.left<this.restrictedExtent.left){lonlat=lonlat.add(this.restrictedExtent.left-
+extent.left,0);}else if(extent.right>this.restrictedExtent.right){lonlat=lonlat.add(this.restrictedExtent.right-
+extent.right,0);}
+if(extent.getHeight()>this.restrictedExtent.getHeight()){lonlat=new OpenLayers.LonLat(lonlat.lon,maxCenter.lat);}else if(extent.bottom<this.restrictedExtent.bottom){lonlat=lonlat.add(0,this.restrictedExtent.bottom-
+extent.bottom);}
+else if(extent.top>this.restrictedExtent.top){lonlat=lonlat.add(0,this.restrictedExtent.top-
+extent.top);}}}
+var zoomChanged=forceZoomChange||((this.isValidZoomLevel(zoom))&&(zoom!=this.getZoom()));var centerChanged=(this.isValidLonLat(lonlat))&&(!lonlat.equals(this.center));if(zoomChanged||centerChanged||!dragging){if(!this.dragging&&!noEvent){this.events.triggerEvent("movestart");}
+if(centerChanged){if((!zoomChanged)&&(this.center)){this.centerLayerContainer(lonlat);}
+this.center=lonlat.clone();}
+if((zoomChanged)||(this.layerContainerOrigin==null)){this.layerContainerOrigin=this.center.clone();this.layerContainerDiv.style.left="0px";this.layerContainerDiv.style.top="0px";}
+if(zoomChanged){this.zoom=zoom;this.resolution=this.getResolutionForZoom(zoom);this.viewRequestID++;}
+var bounds=this.getExtent();if(this.baseLayer.visibility){this.baseLayer.moveTo(bounds,zoomChanged,dragging);if(dragging){this.baseLayer.events.triggerEvent("move");}else{this.baseLayer.events.triggerEvent("moveend",{"zoomChanged":zoomChanged});}}
+bounds=this.baseLayer.getExtent();for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];if(layer!==this.baseLayer&&!layer.isBaseLayer){var inRange=layer.calculateInRange();if(layer.inRange!=inRange){layer.inRange=inRange;if(!inRange){layer.display(false);}
+this.events.triggerEvent("changelayer",{layer:layer,property:"visibility"});}
+if(inRange&&layer.visibility){layer.moveTo(bounds,zoomChanged,dragging);if(dragging){layer.events.triggerEvent("move");}else{layer.events.triggerEvent("moveend",{"zoomChanged":zoomChanged});}}}}
+if(zoomChanged){for(var i=0,len=this.popups.length;i<len;i++){this.popups[i].updatePosition();}}
+this.events.triggerEvent("move");if(zoomChanged){this.events.triggerEvent("zoomend");}}
+if(!dragging&&!noEvent){this.events.triggerEvent("moveend");}
+this.dragging=!!dragging;},centerLayerContainer:function(lonlat){var originPx=this.getViewPortPxFromLonLat(this.layerContainerOrigin);var newPx=this.getViewPortPxFromLonLat(lonlat);if((originPx!=null)&&(newPx!=null)){this.layerContainerDiv.style.left=Math.round(originPx.x-newPx.x)+"px";this.layerContainerDiv.style.top=Math.round(originPx.y-newPx.y)+"px";}},isValidZoomLevel:function(zoomLevel){return((zoomLevel!=null)&&(zoomLevel>=0)&&(zoomLevel<this.getNumZoomLevels()));},isValidLonLat:function(lonlat){var valid=false;if(lonlat!=null){var maxExtent=this.getMaxExtent();valid=maxExtent.containsLonLat(lonlat);}
+return valid;},getProjection:function(){var projection=this.getProjectionObject();return projection?projection.getCode():null;},getProjectionObject:function(){var projection=null;if(this.baseLayer!=null){projection=this.baseLayer.projection;}
+return projection;},getMaxResolution:function(){var maxResolution=null;if(this.baseLayer!=null){maxResolution=this.baseLayer.maxResolution;}
+return maxResolution;},getMaxExtent:function(options){var maxExtent=null;if(options&&options.restricted&&this.restrictedExtent){maxExtent=this.restrictedExtent;}else if(this.baseLayer!=null){maxExtent=this.baseLayer.maxExtent;}
+return maxExtent;},getNumZoomLevels:function(){var numZoomLevels=null;if(this.baseLayer!=null){numZoomLevels=this.baseLayer.numZoomLevels;}
+return numZoomLevels;},getExtent:function(){var extent=null;if(this.baseLayer!=null){extent=this.baseLayer.getExtent();}
+return extent;},getResolution:function(){var resolution=null;if(this.baseLayer!=null){resolution=this.baseLayer.getResolution();}else if(this.allOverlays===true&&this.layers.length>0){resolution=this.layers[0].getResolution();}
+return resolution;},getUnits:function(){var units=null;if(this.baseLayer!=null){units=this.baseLayer.units;}
+return units;},getScale:function(){var scale=null;if(this.baseLayer!=null){var res=this.getResolution();var units=this.baseLayer.units;scale=OpenLayers.Util.getScaleFromResolution(res,units);}
+return scale;},getZoomForExtent:function(bounds,closest){var zoom=null;if(this.baseLayer!=null){zoom=this.baseLayer.getZoomForExtent(bounds,closest);}
+return zoom;},getResolutionForZoom:function(zoom){var resolution=null;if(this.baseLayer){resolution=this.baseLayer.getResolutionForZoom(zoom);}
+return resolution;},getZoomForResolution:function(resolution,closest){var zoom=null;if(this.baseLayer!=null){zoom=this.baseLayer.getZoomForResolution(resolution,closest);}
+return zoom;},zoomTo:function(zoom){if(this.isValidZoomLevel(zoom)){this.setCenter(null,zoom);}},zoomIn:function(){this.zoomTo(this.getZoom()+1);},zoomOut:function(){this.zoomTo(this.getZoom()-1);},zoomToExtent:function(bounds,closest){var center=bounds.getCenterLonLat();if(this.baseLayer.wrapDateLine){var maxExtent=this.getMaxExtent();bounds=bounds.clone();while(bounds.right<bounds.left){bounds.right+=maxExtent.getWidth();}
+center=bounds.getCenterLonLat().wrapDateLine(maxExtent);}
+this.setCenter(center,this.getZoomForExtent(bounds,closest));},zoomToMaxExtent:function(options){var restricted=(options)?options.restricted:true;var maxExtent=this.getMaxExtent({'restricted':restricted});this.zoomToExtent(maxExtent);},zoomToScale:function(scale,closest){var res=OpenLayers.Util.getResolutionFromScale(scale,this.baseLayer.units);var size=this.getSize();var w_deg=size.w*res;var h_deg=size.h*res;var center=this.getCenter();var extent=new OpenLayers.Bounds(center.lon-w_deg/2,center.lat-h_deg/2,center.lon+w_deg/2,center.lat+h_deg/2);this.zoomToExtent(extent,closest);},getLonLatFromViewPortPx:function(viewPortPx){var lonlat=null;if(this.baseLayer!=null){lonlat=this.baseLayer.getLonLatFromViewPortPx(viewPortPx);}
+return lonlat;},getViewPortPxFromLonLat:function(lonlat){var px=null;if(this.baseLayer!=null){px=this.baseLayer.getViewPortPxFromLonLat(lonlat);}
+return px;},getLonLatFromPixel:function(px){return this.getLonLatFromViewPortPx(px);},getPixelFromLonLat:function(lonlat){var px=this.getViewPortPxFromLonLat(lonlat);px.x=Math.round(px.x);px.y=Math.round(px.y);return px;},getGeodesicPixelSize:function(px){var lonlat=px?this.getLonLatFromPixel(px):(this.getCenter()||new OpenLayers.LonLat(0,0));var res=this.getResolution();var left=lonlat.add(-res/2,0);var right=lonlat.add(res/2,0);var bottom=lonlat.add(0,-res/2);var top=lonlat.add(0,res/2);var dest=new OpenLayers.Projection("EPSG:4326");var source=this.getProjectionObject()||dest;if(!source.equals(dest)){left.transform(source,dest);right.transform(source,dest);bottom.transform(source,dest);top.transform(source,dest);}
+return new OpenLayers.Size(OpenLayers.Util.distVincenty(left,right),OpenLayers.Util.distVincenty(bottom,top));},getViewPortPxFromLayerPx:function(layerPx){var viewPortPx=null;if(layerPx!=null){var dX=parseInt(this.layerContainerDiv.style.left);var dY=parseInt(this.layerContainerDiv.style.top);viewPortPx=layerPx.add(dX,dY);}
+return viewPortPx;},getLayerPxFromViewPortPx:function(viewPortPx){var layerPx=null;if(viewPortPx!=null){var dX=-parseInt(this.layerContainerDiv.style.left);var dY=-parseInt(this.layerContainerDiv.style.top);layerPx=viewPortPx.add(dX,dY);if(isNaN(layerPx.x)||isNaN(layerPx.y)){layerPx=null;}}
+return layerPx;},getLonLatFromLayerPx:function(px){px=this.getViewPortPxFromLayerPx(px);return this.getLonLatFromViewPortPx(px);},getLayerPxFromLonLat:function(lonlat){var px=this.getPixelFromLonLat(lonlat);return this.getLayerPxFromViewPortPx(px);},CLASS_NAME:"OpenLayers.Map"});OpenLayers.Map.TILE_WIDTH=256;OpenLayers.Map.TILE_HEIGHT=256;OpenLayers.Marker=OpenLayers.Class({icon:null,lonlat:null,events:null,map:null,initialize:function(lonlat,icon){this.lonlat=lonlat;var newIcon=(icon)?icon:OpenLayers.Marker.defaultIcon();if(this.icon==null){this.icon=newIcon;}else{this.icon.url=newIcon.url;this.icon.size=newIcon.size;this.icon.offset=newIcon.offset;this.icon.calculateOffset=newIcon.calculateOffset;}
+this.events=new OpenLayers.Events(this,this.icon.imageDiv,null);},destroy:function(){this.erase();this.map=null;this.events.destroy();this.events=null;if(this.icon!=null){this.icon.destroy();this.icon=null;}},draw:function(px){return this.icon.draw(px);},erase:function(){if(this.icon!=null){this.icon.erase();}},moveTo:function(px){if((px!=null)&&(this.icon!=null)){this.icon.moveTo(px);}
+this.lonlat=this.map.getLonLatFromLayerPx(px);},isDrawn:function(){var isDrawn=(this.icon&&this.icon.isDrawn());return isDrawn;},onScreen:function(){var onScreen=false;if(this.map){var screenBounds=this.map.getExtent();onScreen=screenBounds.containsLonLat(this.lonlat);}
+return onScreen;},inflate:function(inflate){if(this.icon){var newSize=new OpenLayers.Size(this.icon.size.w*inflate,this.icon.size.h*inflate);this.icon.setSize(newSize);}},setOpacity:function(opacity){this.icon.setOpacity(opacity);},setUrl:function(url){this.icon.setUrl(url);},display:function(display){this.icon.display(display);},CLASS_NAME:"OpenLayers.Marker"});OpenLayers.Marker.defaultIcon=function(){var url=OpenLayers.Util.getImagesLocation()+"marker.png";var size=new OpenLayers.Size(21,25);var calculateOffset=function(size){return new OpenLayers.Pixel(-(size.w/2),-size.h);};return new OpenLayers.Icon(url,size,null,calculateOffset);};OpenLayers.Popup.FramedCloud=OpenLayers.Class(OpenLayers.Popup.Framed,{contentDisplayClass:"olFramedCloudPopupContent",autoSize:true,panMapIfOutOfView:true,imageSize:new OpenLayers.Size(1276,736),isAlphaImage:false,fixedRelativePosition:false,positionBlocks:{"tl":{'offset':new OpenLayers.Pixel(44,0),'padding':new OpenLayers.Bounds(8,40,8,9),'blocks':[{size:new OpenLayers.Size('auto','auto'),anchor:new OpenLayers.Bounds(0,51,22,0),position:new OpenLayers.Pixel(0,0)},{size:new OpenLayers.Size(22,'auto'),anchor:new OpenLayers.Bounds(null,50,0,0),position:new OpenLayers.Pixel(-1238,0)},{size:new OpenLayers.Size('auto',19),anchor:new OpenLayers.Bounds(0,32,22,null),position:new OpenLayers.Pixel(0,-631)},{size:new OpenLayers.Size(22,18),anchor:new OpenLayers.Bounds(null,32,0,null),position:new OpenLayers.Pixel(-1238,-632)},{size:new OpenLayers.Size(81,35),anchor:new OpenLayers.Bounds(null,0,0,null),position:new OpenLayers.Pixel(0,-688)}]},"tr":{'offset':new OpenLayers.Pixel(-45,0),'padding':new OpenLayers.Bounds(8,40,8,9),'blocks':[{size:new OpenLayers.Size('auto','auto'),anchor:new OpenLayers.Bounds(0,51,22,0),position:new OpenLayers.Pixel(0,0)},{size:new OpenLayers.Size(22,'auto'),anchor:new OpenLayers.Bounds(null,50,0,0),position:new OpenLayers.Pixel(-1238,0)},{size:new OpenLayers.Size('auto',19),anchor:new OpenLayers.Bounds(0,32,22,null),position:new OpenLayers.Pixel(0,-631)},{size:new OpenLayers.Size(22,19),anchor:new OpenLayers.Bounds(null,32,0,null),position:new OpenLayers.Pixel(-1238,-631)},{size:new OpenLayers.Size(81,35),anchor:new OpenLayers.Bounds(0,0,null,null),position:new OpenLayers.Pixel(-215,-687)}]},"bl":{'offset':new OpenLayers.Pixel(45,0),'padding':new OpenLayers.Bounds(8,9,8,40),'blocks':[{size:new OpenLayers.Size('auto','auto'),anchor:new OpenLayers.Bounds(0,21,22,32),position:new OpenLayers.Pixel(0,0)},{size:new OpenLayers.Size(22,'auto'),anchor:new OpenLayers.Bounds(null,21,0,32),position:new OpenLayers.Pixel(-1238,0)},{size:new OpenLayers.Size('auto',21),anchor:new OpenLayers.Bounds(0,0,22,null),position:new OpenLayers.Pixel(0,-629)},{size:new OpenLayers.Size(22,21),anchor:new OpenLayers.Bounds(null,0,0,null),position:new OpenLayers.Pixel(-1238,-629)},{size:new OpenLayers.Size(81,33),anchor:new OpenLayers.Bounds(null,null,0,0),position:new OpenLayers.Pixel(-101,-674)}]},"br":{'offset':new OpenLayers.Pixel(-44,0),'padding':new OpenLayers.Bounds(8,9,8,40),'blocks':[{size:new OpenLayers.Size('auto','auto'),anchor:new OpenLayers.Bounds(0,21,22,32),position:new OpenLayers.Pixel(0,0)},{size:new OpenLayers.Size(22,'auto'),anchor:new OpenLayers.Bounds(null,21,0,32),position:new OpenLayers.Pixel(-1238,0)},{size:new OpenLayers.Size('auto',21),anchor:new OpenLayers.Bounds(0,0,22,null),position:new OpenLayers.Pixel(0,-629)},{size:new OpenLayers.Size(22,21),anchor:new OpenLayers.Bounds(null,0,0,null),position:new OpenLayers.Pixel(-1238,-629)},{size:new OpenLayers.Size(81,33),anchor:new OpenLayers.Bounds(0,null,null,0),position:new OpenLayers.Pixel(-311,-674)}]}},minSize:new OpenLayers.Size(105,10),maxSize:new OpenLayers.Size(1200,660),initialize:function(id,lonlat,contentSize,contentHTML,anchor,closeBox,closeBoxCallback){this.imageSrc=OpenLayers.Util.getImagesLocation()+'cloud-popup-relative.png';OpenLayers.Popup.Framed.prototype.initialize.apply(this,arguments);this.contentDiv.className=this.contentDisplayClass;},destroy:function(){OpenLayers.Popup.Framed.prototype.destroy.apply(this,arguments);},CLASS_NAME:"OpenLayers.Popup.FramedCloud"});OpenLayers.Request={DEFAULT_CONFIG:{method:"GET",url:window.location.href,async:true,user:undefined,password:undefined,params:null,proxy:OpenLayers.ProxyHost,headers:{},data:null,callback:function(){},success:null,failure:null,scope:null},events:new OpenLayers.Events(this,null,["complete","success","failure"]),issue:function(config){var defaultConfig=OpenLayers.Util.extend(this.DEFAULT_CONFIG,{proxy:OpenLayers.ProxyHost});config=OpenLayers.Util.applyDefaults(config,defaultConfig);var request=new OpenLayers.Request.XMLHttpRequest();var url=config.url;if(config.params){var paramString=OpenLayers.Util.getParameterString(config.params);if(paramString.length>0){var separator=(url.indexOf('?')>-1)?'&':'?';url+=separator+paramString;}}
+if(config.proxy&&(url.indexOf("http")==0)){if(typeof config.proxy=="function"){url=config.proxy(url);}else{url=config.proxy+encodeURIComponent(url);}}
+request.open(config.method,url,config.async,config.user,config.password);for(var header in config.headers){request.setRequestHeader(header,config.headers[header]);}
+var events=this.events;var self=this;request.onreadystatechange=function(){if(request.readyState==OpenLayers.Request.XMLHttpRequest.DONE){var proceed=events.triggerEvent("complete",{request:request,config:config,requestUrl:url});if(proceed!==false){self.runCallbacks({request:request,config:config,requestUrl:url});}}};if(config.async===false){request.send(config.data);}else{window.setTimeout(function(){if(request._aborted!==true){request.send(config.data);}},0);}
+return request;},runCallbacks:function(options){var request=options.request;var config=options.config;var complete=(config.scope)?OpenLayers.Function.bind(config.callback,config.scope):config.callback;var success;if(config.success){success=(config.scope)?OpenLayers.Function.bind(config.success,config.scope):config.success;}
+var failure;if(config.failure){failure=(config.scope)?OpenLayers.Function.bind(config.failure,config.scope):config.failure;}
+complete(request);if(!request.status||(request.status>=200&&request.status<300)){this.events.triggerEvent("success",options);if(success){success(request);}}
+if(request.status&&(request.status<200||request.status>=300)){this.events.triggerEvent("failure",options);if(failure){failure(request);}}},GET:function(config){config=OpenLayers.Util.extend(config,{method:"GET"});return OpenLayers.Request.issue(config);},POST:function(config){config=OpenLayers.Util.extend(config,{method:"POST"});config.headers=config.headers?config.headers:{};if(!("CONTENT-TYPE"in OpenLayers.Util.upperCaseObject(config.headers))){config.headers["Content-Type"]="application/xml";}
+return OpenLayers.Request.issue(config);},PUT:function(config){config=OpenLayers.Util.extend(config,{method:"PUT"});config.headers=config.headers?config.headers:{};if(!("CONTENT-TYPE"in OpenLayers.Util.upperCaseObject(config.headers))){config.headers["Content-Type"]="application/xml";}
+return OpenLayers.Request.issue(config);},DELETE:function(config){config=OpenLayers.Util.extend(config,{method:"DELETE"});return OpenLayers.Request.issue(config);},HEAD:function(config){config=OpenLayers.Util.extend(config,{method:"HEAD"});return OpenLayers.Request.issue(config);},OPTIONS:function(config){config=OpenLayers.Util.extend(config,{method:"OPTIONS"});return OpenLayers.Request.issue(config);}};OpenLayers.Tile.Image=OpenLayers.Class(OpenLayers.Tile,{url:null,imgDiv:null,frame:null,layerAlphaHack:null,isBackBuffer:false,lastRatio:1,isFirstDraw:true,backBufferTile:null,initialize:function(layer,position,bounds,url,size){OpenLayers.Tile.prototype.initialize.apply(this,arguments);this.url=url;this.frame=document.createElement('div');this.frame.style.overflow='hidden';this.frame.style.position='absolute';this.layerAlphaHack=this.layer.alpha&&OpenLayers.Util.alphaHack();},destroy:function(){if(this.imgDiv!=null){if(this.layerAlphaHack){OpenLayers.Event.stopObservingElement(this.imgDiv.childNodes[0]);}
+OpenLayers.Event.stopObservingElement(this.imgDiv);if(this.imgDiv.parentNode==this.frame){this.frame.removeChild(this.imgDiv);this.imgDiv.map=null;}
+this.imgDiv.urls=null;this.imgDiv.src=OpenLayers.Util.getImagesLocation()+"blank.gif";}
+this.imgDiv=null;if((this.frame!=null)&&(this.frame.parentNode==this.layer.div)){this.layer.div.removeChild(this.frame);}
+this.frame=null;if(this.backBufferTile){this.backBufferTile.destroy();this.backBufferTile=null;}
+this.layer.events.unregister("loadend",this,this.resetBackBuffer);OpenLayers.Tile.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Tile.Image(this.layer,this.position,this.bounds,this.url,this.size);}
+obj=OpenLayers.Tile.prototype.clone.apply(this,[obj]);obj.imgDiv=null;return obj;},draw:function(){if(this.layer!=this.layer.map.baseLayer&&this.layer.reproject){this.bounds=this.getBoundsFromBaseLayer(this.position);}
+var drawTile=OpenLayers.Tile.prototype.draw.apply(this,arguments);if((OpenLayers.Util.indexOf(this.layer.SUPPORTED_TRANSITIONS,this.layer.transitionEffect)!=-1)||this.layer.singleTile){if(drawTile){if(!this.backBufferTile){this.backBufferTile=this.clone();this.backBufferTile.hide();this.backBufferTile.isBackBuffer=true;this.events.register('loadend',this,this.resetBackBuffer);this.layer.events.register("loadend",this,this.resetBackBuffer);}
+this.startTransition();}else{if(this.backBufferTile){this.backBufferTile.clear();}}}else{if(drawTile&&this.isFirstDraw){this.events.register('loadend',this,this.showTile);this.isFirstDraw=false;}}
+if(!drawTile){return false;}
+if(this.isLoading){this.events.triggerEvent("reload");}else{this.isLoading=true;this.events.triggerEvent("loadstart");}
+return this.renderTile();},resetBackBuffer:function(){this.showTile();if(this.backBufferTile&&(this.isFirstDraw||!this.layer.numLoadingTiles)){this.isFirstDraw=false;var maxExtent=this.layer.maxExtent;var withinMaxExtent=(maxExtent&&this.bounds.intersectsBounds(maxExtent,false));if(withinMaxExtent){this.backBufferTile.position=this.position;this.backBufferTile.bounds=this.bounds;this.backBufferTile.size=this.size;this.backBufferTile.imageSize=this.layer.getImageSize(this.bounds)||this.size;this.backBufferTile.imageOffset=this.layer.imageOffset;this.backBufferTile.resolution=this.layer.getResolution();this.backBufferTile.renderTile();}
+this.backBufferTile.hide();}},renderTile:function(){if(this.imgDiv==null){this.initImgDiv();}
+this.imgDiv.viewRequestID=this.layer.map.viewRequestID;if(this.layer.async){this.layer.getURLasync(this.bounds,this,"url",this.positionImage);}else{if(this.layer.url instanceof Array){this.imgDiv.urls=this.layer.url.slice();}
+this.url=this.layer.getURL(this.bounds);this.positionImage();}
+return true;},positionImage:function(){if(this.layer===null){return;}
+OpenLayers.Util.modifyDOMElement(this.frame,null,this.position,this.size);var imageSize=this.layer.getImageSize(this.bounds);if(this.layerAlphaHack){OpenLayers.Util.modifyAlphaImageDiv(this.imgDiv,null,null,imageSize,this.url);}else{OpenLayers.Util.modifyDOMElement(this.imgDiv,null,null,imageSize);this.imgDiv.src=this.url;}},clear:function(){if(this.imgDiv){this.hide();if(OpenLayers.Tile.Image.useBlankTile){this.imgDiv.src=OpenLayers.Util.getImagesLocation()+"blank.gif";}}},initImgDiv:function(){var offset=this.layer.imageOffset;var size=this.layer.getImageSize(this.bounds);if(this.layerAlphaHack){this.imgDiv=OpenLayers.Util.createAlphaImageDiv(null,offset,size,null,"relative",null,null,null,true);}else{this.imgDiv=OpenLayers.Util.createImage(null,offset,size,null,"relative",null,null,true);}
+this.imgDiv.className='olTileImage';this.frame.style.zIndex=this.isBackBuffer?0:1;this.frame.appendChild(this.imgDiv);this.layer.div.appendChild(this.frame);if(this.layer.opacity!=null){OpenLayers.Util.modifyDOMElement(this.imgDiv,null,null,null,null,null,null,this.layer.opacity);}
+this.imgDiv.map=this.layer.map;var onload=function(){if(this.isLoading){this.isLoading=false;this.events.triggerEvent("loadend");}};if(this.layerAlphaHack){OpenLayers.Event.observe(this.imgDiv.childNodes[0],'load',OpenLayers.Function.bind(onload,this));}else{OpenLayers.Event.observe(this.imgDiv,'load',OpenLayers.Function.bind(onload,this));}
+var onerror=function(){if(this.imgDiv._attempts>OpenLayers.IMAGE_RELOAD_ATTEMPTS){onload.call(this);}};OpenLayers.Event.observe(this.imgDiv,"error",OpenLayers.Function.bind(onerror,this));},checkImgURL:function(){if(this.layer){var loaded=this.layerAlphaHack?this.imgDiv.firstChild.src:this.imgDiv.src;if(!OpenLayers.Util.isEquivalentUrl(loaded,this.url)){this.hide();}}},startTransition:function(){if(!this.backBufferTile||!this.backBufferTile.imgDiv){return;}
+var ratio=1;if(this.backBufferTile.resolution){ratio=this.backBufferTile.resolution/this.layer.getResolution();}
+if(ratio!=this.lastRatio){if(this.layer.transitionEffect=='resize'){var upperLeft=new OpenLayers.LonLat(this.backBufferTile.bounds.left,this.backBufferTile.bounds.top);var size=new OpenLayers.Size(this.backBufferTile.size.w*ratio,this.backBufferTile.size.h*ratio);var px=this.layer.map.getLayerPxFromLonLat(upperLeft);OpenLayers.Util.modifyDOMElement(this.backBufferTile.frame,null,px,size);var imageSize=this.backBufferTile.imageSize;imageSize=new OpenLayers.Size(imageSize.w*ratio,imageSize.h*ratio);var imageOffset=this.backBufferTile.imageOffset;if(imageOffset){imageOffset=new OpenLayers.Pixel(imageOffset.x*ratio,imageOffset.y*ratio);}
+OpenLayers.Util.modifyDOMElement(this.backBufferTile.imgDiv,null,imageOffset,imageSize);this.backBufferTile.show();}}else{if(this.layer.singleTile){this.backBufferTile.show();}else{this.backBufferTile.hide();}}
+this.lastRatio=ratio;},show:function(){this.frame.style.display='';if(OpenLayers.Util.indexOf(this.layer.SUPPORTED_TRANSITIONS,this.layer.transitionEffect)!=-1){if(navigator.userAgent.toLowerCase().indexOf("gecko")!=-1){this.frame.scrollLeft=this.frame.scrollLeft;}}},hide:function(){this.frame.style.display='none';},CLASS_NAME:"OpenLayers.Tile.Image"});OpenLayers.Tile.Image.useBlankTile=(OpenLayers.Util.getBrowserName()=="safari"||OpenLayers.Util.getBrowserName()=="opera");OpenLayers.Control.OverviewMap=OpenLayers.Class(OpenLayers.Control,{element:null,ovmap:null,size:new OpenLayers.Size(180,90),layers:null,minRectSize:15,minRectDisplayClass:"RectReplacement",minRatio:8,maxRatio:32,mapOptions:null,autoPan:false,handlers:null,resolutionFactor:1,maximized:false,initialize:function(options){this.layers=[];this.handlers={};OpenLayers.Control.prototype.initialize.apply(this,[options]);},destroy:function(){if(!this.mapDiv){return;}
+if(this.handlers.click){this.handlers.click.destroy();}
+if(this.handlers.drag){this.handlers.drag.destroy();}
+this.mapDiv.removeChild(this.extentRectangle);this.extentRectangle=null;if(this.rectEvents){this.rectEvents.destroy();this.rectEvents=null;}
+if(this.ovmap){this.ovmap.destroy();this.ovmap=null;}
+this.element.removeChild(this.mapDiv);this.mapDiv=null;this.div.removeChild(this.element);this.element=null;if(this.maximizeDiv){OpenLayers.Event.stopObservingElement(this.maximizeDiv);this.div.removeChild(this.maximizeDiv);this.maximizeDiv=null;}
+if(this.minimizeDiv){OpenLayers.Event.stopObservingElement(this.minimizeDiv);this.div.removeChild(this.minimizeDiv);this.minimizeDiv=null;}
+this.map.events.un({"moveend":this.update,"changebaselayer":this.baseLayerDraw,scope:this});OpenLayers.Control.prototype.destroy.apply(this,arguments);},draw:function(){OpenLayers.Control.prototype.draw.apply(this,arguments);if(!(this.layers.length>0)){if(this.map.baseLayer){var layer=this.map.baseLayer.clone();this.layers=[layer];}else{this.map.events.register("changebaselayer",this,this.baseLayerDraw);return this.div;}}
+this.element=document.createElement('div');this.element.className=this.displayClass+'Element';this.element.style.display='none';this.mapDiv=document.createElement('div');this.mapDiv.style.width=this.size.w+'px';this.mapDiv.style.height=this.size.h+'px';this.mapDiv.style.position='relative';this.mapDiv.style.overflow='hidden';this.mapDiv.id=OpenLayers.Util.createUniqueID('overviewMap');this.extentRectangle=document.createElement('div');this.extentRectangle.style.position='absolute';this.extentRectangle.style.zIndex=1000;this.extentRectangle.className=this.displayClass+'ExtentRectangle';this.mapDiv.appendChild(this.extentRectangle);this.element.appendChild(this.mapDiv);this.div.appendChild(this.element);if(!this.outsideViewport){this.div.className+=" "+this.displayClass+'Container';var imgLocation=OpenLayers.Util.getImagesLocation();var img=imgLocation+'layer-switcher-maximize.png';this.maximizeDiv=OpenLayers.Util.createAlphaImageDiv(this.displayClass+'MaximizeButton',null,new OpenLayers.Size(18,18),img,'absolute');this.maximizeDiv.style.display='none';this.maximizeDiv.className=this.displayClass+'MaximizeButton';OpenLayers.Event.observe(this.maximizeDiv,'click',OpenLayers.Function.bindAsEventListener(this.maximizeControl,this));this.div.appendChild(this.maximizeDiv);var img=imgLocation+'layer-switcher-minimize.png';this.minimizeDiv=OpenLayers.Util.createAlphaImageDiv('OpenLayers_Control_minimizeDiv',null,new OpenLayers.Size(18,18),img,'absolute');this.minimizeDiv.style.display='none';this.minimizeDiv.className=this.displayClass+'MinimizeButton';OpenLayers.Event.observe(this.minimizeDiv,'click',OpenLayers.Function.bindAsEventListener(this.minimizeControl,this));this.div.appendChild(this.minimizeDiv);var eventsToStop=['dblclick','mousedown'];for(var i=0,len=eventsToStop.length;i<len;i++){OpenLayers.Event.observe(this.maximizeDiv,eventsToStop[i],OpenLayers.Event.stop);OpenLayers.Event.observe(this.minimizeDiv,eventsToStop[i],OpenLayers.Event.stop);}
+this.minimizeControl();}else{this.element.style.display='';}
+if(this.map.getExtent()){this.update();}
+this.map.events.register('moveend',this,this.update);if(this.maximized){this.maximizeControl();}
+return this.div;},baseLayerDraw:function(){this.draw();this.map.events.unregister("changebaselayer",this,this.baseLayerDraw);},rectDrag:function(px){var deltaX=this.handlers.drag.last.x-px.x;var deltaY=this.handlers.drag.last.y-px.y;if(deltaX!=0||deltaY!=0){var rectTop=this.rectPxBounds.top;var rectLeft=this.rectPxBounds.left;var rectHeight=Math.abs(this.rectPxBounds.getHeight());var rectWidth=this.rectPxBounds.getWidth();var newTop=Math.max(0,(rectTop-deltaY));newTop=Math.min(newTop,this.ovmap.size.h-this.hComp-rectHeight);var newLeft=Math.max(0,(rectLeft-deltaX));newLeft=Math.min(newLeft,this.ovmap.size.w-this.wComp-rectWidth);this.setRectPxBounds(new OpenLayers.Bounds(newLeft,newTop+rectHeight,newLeft+rectWidth,newTop));}},mapDivClick:function(evt){var pxCenter=this.rectPxBounds.getCenterPixel();var deltaX=evt.xy.x-pxCenter.x;var deltaY=evt.xy.y-pxCenter.y;var top=this.rectPxBounds.top;var left=this.rectPxBounds.left;var height=Math.abs(this.rectPxBounds.getHeight());var width=this.rectPxBounds.getWidth();var newTop=Math.max(0,(top+deltaY));newTop=Math.min(newTop,this.ovmap.size.h-height);var newLeft=Math.max(0,(left+deltaX));newLeft=Math.min(newLeft,this.ovmap.size.w-width);this.setRectPxBounds(new OpenLayers.Bounds(newLeft,newTop+height,newLeft+width,newTop));this.updateMapToRect();},maximizeControl:function(e){this.element.style.display='';this.showToggle(false);if(e!=null){OpenLayers.Event.stop(e);}},minimizeControl:function(e){this.element.style.display='none';this.showToggle(true);if(e!=null){OpenLayers.Event.stop(e);}},showToggle:function(minimize){this.maximizeDiv.style.display=minimize?'':'none';this.minimizeDiv.style.display=minimize?'none':'';},update:function(){if(this.ovmap==null){this.createMap();}
+if(this.autoPan||!this.isSuitableOverview()){this.updateOverview();}
+this.updateRectToMap();},isSuitableOverview:function(){var mapExtent=this.map.getExtent();var maxExtent=this.map.maxExtent;var testExtent=new OpenLayers.Bounds(Math.max(mapExtent.left,maxExtent.left),Math.max(mapExtent.bottom,maxExtent.bottom),Math.min(mapExtent.right,maxExtent.right),Math.min(mapExtent.top,maxExtent.top));if(this.ovmap.getProjection()!=this.map.getProjection()){testExtent=testExtent.transform(this.map.getProjectionObject(),this.ovmap.getProjectionObject());}
+var resRatio=this.ovmap.getResolution()/this.map.getResolution();return((resRatio>this.minRatio)&&(resRatio<=this.maxRatio)&&(this.ovmap.getExtent().containsBounds(testExtent)));},updateOverview:function(){var mapRes=this.map.getResolution();var targetRes=this.ovmap.getResolution();var resRatio=targetRes/mapRes;if(resRatio>this.maxRatio){targetRes=this.minRatio*mapRes;}else if(resRatio<=this.minRatio){targetRes=this.maxRatio*mapRes;}
+var center;if(this.ovmap.getProjection()!=this.map.getProjection()){center=this.map.center.clone();center.transform(this.map.getProjectionObject(),this.ovmap.getProjectionObject());}else{center=this.map.center;}
+this.ovmap.setCenter(center,this.ovmap.getZoomForResolution(targetRes*this.resolutionFactor));this.updateRectToMap();},createMap:function(){var options=OpenLayers.Util.extend({controls:[],maxResolution:'auto',fallThrough:false},this.mapOptions);this.ovmap=new OpenLayers.Map(this.mapDiv,options);OpenLayers.Event.stopObserving(window,'unload',this.ovmap.unloadDestroy);this.ovmap.addLayers(this.layers);this.ovmap.zoomToMaxExtent();this.wComp=parseInt(OpenLayers.Element.getStyle(this.extentRectangle,'border-left-width'))+
+parseInt(OpenLayers.Element.getStyle(this.extentRectangle,'border-right-width'));this.wComp=(this.wComp)?this.wComp:2;this.hComp=parseInt(OpenLayers.Element.getStyle(this.extentRectangle,'border-top-width'))+
+parseInt(OpenLayers.Element.getStyle(this.extentRectangle,'border-bottom-width'));this.hComp=(this.hComp)?this.hComp:2;this.handlers.drag=new OpenLayers.Handler.Drag(this,{move:this.rectDrag,done:this.updateMapToRect},{map:this.ovmap});this.handlers.click=new OpenLayers.Handler.Click(this,{"click":this.mapDivClick},{"single":true,"double":false,"stopSingle":true,"stopDouble":true,"pixelTolerance":1,map:this.ovmap});this.handlers.click.activate();this.rectEvents=new OpenLayers.Events(this,this.extentRectangle,null,true);this.rectEvents.register("mouseover",this,function(e){if(!this.handlers.drag.active&&!this.map.dragging){this.handlers.drag.activate();}});this.rectEvents.register("mouseout",this,function(e){if(!this.handlers.drag.dragging){this.handlers.drag.deactivate();}});if(this.ovmap.getProjection()!=this.map.getProjection()){var sourceUnits=this.map.getProjectionObject().getUnits()||this.map.units||this.map.baseLayer.units;var targetUnits=this.ovmap.getProjectionObject().getUnits()||this.ovmap.units||this.ovmap.baseLayer.units;this.resolutionFactor=sourceUnits&&targetUnits?OpenLayers.INCHES_PER_UNIT[sourceUnits]/OpenLayers.INCHES_PER_UNIT[targetUnits]:1;}},updateRectToMap:function(){var bounds;if(this.ovmap.getProjection()!=this.map.getProjection()){bounds=this.map.getExtent().transform(this.map.getProjectionObject(),this.ovmap.getProjectionObject());}else{bounds=this.map.getExtent();}
+var pxBounds=this.getRectBoundsFromMapBounds(bounds);if(pxBounds){this.setRectPxBounds(pxBounds);}},updateMapToRect:function(){var lonLatBounds=this.getMapBoundsFromRectBounds(this.rectPxBounds);if(this.ovmap.getProjection()!=this.map.getProjection()){lonLatBounds=lonLatBounds.transform(this.ovmap.getProjectionObject(),this.map.getProjectionObject());}
+this.map.panTo(lonLatBounds.getCenterLonLat());},setRectPxBounds:function(pxBounds){var top=Math.max(pxBounds.top,0);var left=Math.max(pxBounds.left,0);var bottom=Math.min(pxBounds.top+Math.abs(pxBounds.getHeight()),this.ovmap.size.h-this.hComp);var right=Math.min(pxBounds.left+pxBounds.getWidth(),this.ovmap.size.w-this.wComp);var width=Math.max(right-left,0);var height=Math.max(bottom-top,0);if(width<this.minRectSize||height<this.minRectSize){this.extentRectangle.className=this.displayClass+
+this.minRectDisplayClass;var rLeft=left+(width/2)-(this.minRectSize/2);var rTop=top+(height/2)-(this.minRectSize/2);this.extentRectangle.style.top=Math.round(rTop)+'px';this.extentRectangle.style.left=Math.round(rLeft)+'px';this.extentRectangle.style.height=this.minRectSize+'px';this.extentRectangle.style.width=this.minRectSize+'px';}else{this.extentRectangle.className=this.displayClass+'ExtentRectangle';this.extentRectangle.style.top=Math.round(top)+'px';this.extentRectangle.style.left=Math.round(left)+'px';this.extentRectangle.style.height=Math.round(height)+'px';this.extentRectangle.style.width=Math.round(width)+'px';}
+this.rectPxBounds=new OpenLayers.Bounds(Math.round(left),Math.round(bottom),Math.round(right),Math.round(top));},getRectBoundsFromMapBounds:function(lonLatBounds){var leftBottomLonLat=new OpenLayers.LonLat(lonLatBounds.left,lonLatBounds.bottom);var rightTopLonLat=new OpenLayers.LonLat(lonLatBounds.right,lonLatBounds.top);var leftBottomPx=this.getOverviewPxFromLonLat(leftBottomLonLat);var rightTopPx=this.getOverviewPxFromLonLat(rightTopLonLat);var bounds=null;if(leftBottomPx&&rightTopPx){bounds=new OpenLayers.Bounds(leftBottomPx.x,leftBottomPx.y,rightTopPx.x,rightTopPx.y);}
+return bounds;},getMapBoundsFromRectBounds:function(pxBounds){var leftBottomPx=new OpenLayers.Pixel(pxBounds.left,pxBounds.bottom);var rightTopPx=new OpenLayers.Pixel(pxBounds.right,pxBounds.top);var leftBottomLonLat=this.getLonLatFromOverviewPx(leftBottomPx);var rightTopLonLat=this.getLonLatFromOverviewPx(rightTopPx);return new OpenLayers.Bounds(leftBottomLonLat.lon,leftBottomLonLat.lat,rightTopLonLat.lon,rightTopLonLat.lat);},getLonLatFromOverviewPx:function(overviewMapPx){var size=this.ovmap.size;var res=this.ovmap.getResolution();var center=this.ovmap.getExtent().getCenterLonLat();var delta_x=overviewMapPx.x-(size.w/2);var delta_y=overviewMapPx.y-(size.h/2);return new OpenLayers.LonLat(center.lon+delta_x*res,center.lat-delta_y*res);},getOverviewPxFromLonLat:function(lonlat){var res=this.ovmap.getResolution();var extent=this.ovmap.getExtent();var px=null;if(extent){px=new OpenLayers.Pixel(Math.round(1/res*(lonlat.lon-extent.left)),Math.round(1/res*(extent.top-lonlat.lat)));}
+return px;},CLASS_NAME:'OpenLayers.Control.OverviewMap'});OpenLayers.Feature=OpenLayers.Class({layer:null,id:null,lonlat:null,data:null,marker:null,popupClass:OpenLayers.Popup.AnchoredBubble,popup:null,initialize:function(layer,lonlat,data){this.layer=layer;this.lonlat=lonlat;this.data=(data!=null)?data:{};this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},destroy:function(){if((this.layer!=null)&&(this.layer.map!=null)){if(this.popup!=null){this.layer.map.removePopup(this.popup);}}
+if(this.layer!=null&&this.marker!=null){this.layer.removeMarker(this.marker);}
+this.layer=null;this.id=null;this.lonlat=null;this.data=null;if(this.marker!=null){this.destroyMarker(this.marker);this.marker=null;}
+if(this.popup!=null){this.destroyPopup(this.popup);this.popup=null;}},onScreen:function(){var onScreen=false;if((this.layer!=null)&&(this.layer.map!=null)){var screenBounds=this.layer.map.getExtent();onScreen=screenBounds.containsLonLat(this.lonlat);}
+return onScreen;},createMarker:function(){if(this.lonlat!=null){this.marker=new OpenLayers.Marker(this.lonlat,this.data.icon);}
+return this.marker;},destroyMarker:function(){this.marker.destroy();},createPopup:function(closeBox){if(this.lonlat!=null){var id=this.id+"_popup";var anchor=(this.marker)?this.marker.icon:null;if(!this.popup){this.popup=new this.popupClass(id,this.lonlat,this.data.popupSize,this.data.popupContentHTML,anchor,closeBox);}
+if(this.data.overflow!=null){this.popup.contentDiv.style.overflow=this.data.overflow;}
+this.popup.feature=this;}
+return this.popup;},destroyPopup:function(){if(this.popup){this.popup.feature=null;this.popup.destroy();this.popup=null;}},CLASS_NAME:"OpenLayers.Feature"});OpenLayers.Format.CSWGetDomain.v2_0_2=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance",csw:"http://www.opengis.net/cat/csw/2.0.2"},defaultPrefix:"csw",version:"2.0.2",schemaLocation:"http://www.opengis.net/cat/csw/2.0.2 http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd",PropertyName:null,ParameterName:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var obj={};this.readNode(data,obj);return obj;},readers:{"csw":{"GetDomainResponse":function(node,obj){this.readChildNodes(node,obj);},"DomainValues":function(node,obj){if(!(obj.DomainValues instanceof Array)){obj.DomainValues=[];}
+var attrs=node.attributes;var domainValue={};for(var i=0,len=attrs.length;i<len;++i){domainValue[attrs[i].name]=attrs[i].nodeValue;}
+this.readChildNodes(node,domainValue);obj.DomainValues.push(domainValue);},"PropertyName":function(node,obj){obj.PropertyName=this.getChildValue(node);},"ParameterName":function(node,obj){obj.ParameterName=this.getChildValue(node);},"ListOfValues":function(node,obj){if(!(obj.ListOfValues instanceof Array)){obj.ListOfValues=[];}
+this.readChildNodes(node,obj.ListOfValues);},"Value":function(node,obj){var attrs=node.attributes;var value={}
+for(var i=0,len=attrs.length;i<len;++i){value[attrs[i].name]=attrs[i].nodeValue;}
+value.value=this.getChildValue(node);obj.push({Value:value});},"ConceptualScheme":function(node,obj){obj.ConceptualScheme={};this.readChildNodes(node,obj.ConceptualScheme);},"Name":function(node,obj){obj.Name=this.getChildValue(node);},"Document":function(node,obj){obj.Document=this.getChildValue(node);},"Authority":function(node,obj){obj.Authority=this.getChildValue(node);},"RangeOfValues":function(node,obj){obj.RangeOfValues={};this.readChildNodes(node,obj.RangeOfValues);},"MinValue":function(node,obj){var attrs=node.attributes;var value={}
+for(var i=0,len=attrs.length;i<len;++i){value[attrs[i].name]=attrs[i].nodeValue;}
+value.value=this.getChildValue(node);obj.MinValue=value;},"MaxValue":function(node,obj){var attrs=node.attributes;var value={}
+for(var i=0,len=attrs.length;i<len;++i){value[attrs[i].name]=attrs[i].nodeValue;}
+value.value=this.getChildValue(node);obj.MaxValue=value;}}},write:function(options){var node=this.writeNode("csw:GetDomain",options);return OpenLayers.Format.XML.prototype.write.apply(this,[node]);},writers:{"csw":{"GetDomain":function(options){var node=this.createElementNSPlus("csw:GetDomain",{attributes:{service:"CSW",version:this.version}});if(options.PropertyName||this.PropertyName){this.writeNode("csw:PropertyName",options.PropertyName||this.PropertyName,node);}else if(options.ParameterName||this.ParameterName){this.writeNode("csw:ParameterName",options.ParameterName||this.ParameterName,node);}
+this.readChildNodes(node,options);return node;},"PropertyName":function(value){var node=this.createElementNSPlus("csw:PropertyName",{value:value});return node;},"ParameterName":function(value){var node=this.createElementNSPlus("csw:ParameterName",{value:value});return node;}}},CLASS_NAME:"OpenLayers.Format.CSWGetDomain.v2_0_2"});OpenLayers.Format.Context=OpenLayers.Class({version:null,layerOptions:null,layerParams:null,parser:null,initialize:function(options){OpenLayers.Util.extend(this,options);this.options=options;},read:function(data,options){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version;if(!version){version=root.getAttribute("version");}
+var parser=this.getParser(version);var context=parser.read(data,options);var map;if(options&&options.map){this.context=context;if(options.map instanceof OpenLayers.Map){map=this.mergeContextToMap(context,options.map);}else{var mapOptions=options.map;if(OpenLayers.Util.isElement(mapOptions)||typeof mapOptions=="string"){mapOptions={div:mapOptions};}
+map=this.contextToMap(context,mapOptions);}}else{map=context;}
+return map;},getLayerFromContext:function(layerContext){var i,len;var options={queryable:layerContext.queryable,visibility:layerContext.visibility,maxExtent:layerContext.maxExtent,metadata:OpenLayers.Util.applyDefaults(layerContext.metadata,{styles:layerContext.styles}),numZoomLevels:layerContext.numZoomLevels,units:layerContext.units,isBaseLayer:layerContext.isBaseLayer,opacity:layerContext.opacity,displayInLayerSwitcher:layerContext.displayInLayerSwitcher,singleTile:layerContext.singleTile,tileSize:(layerContext.tileSize)?new OpenLayers.Size(layerContext.tileSize.width,layerContext.tileSize.height):undefined,minScale:layerContext.minScale||layerContext.maxScaleDenominator,maxScale:layerContext.maxScale||layerContext.minScaleDenominator};if(this.layerOptions){OpenLayers.Util.applyDefaults(options,this.layerOptions);}
+var params={layers:layerContext.name,transparent:layerContext.transparent,version:layerContext.version};if(layerContext.formats&&layerContext.formats.length>0){params.format=layerContext.formats[0].value;for(i=0,len=layerContext.formats.length;i<len;i++){var format=layerContext.formats[i];if(format.current==true){params.format=format.value;break;}}}
+if(layerContext.styles&&layerContext.styles.length>0){for(i=0,len=layerContext.styles.length;i<len;i++){var style=layerContext.styles[i];if(style.current==true){if(style.href){params.sld=style.href;}else if(style.body){params.sld_body=style.body;}else{params.styles=style.name;}
+break;}}}
+if(this.layerParams){OpenLayers.Util.applyDefaults(params,this.layerParams);}
+var layer=null;var service=layerContext.service;if(service==OpenLayers.Format.Context.serviceTypes.WFS){options.strategies=[new OpenLayers.Strategy.BBOX()];options.protocol=new OpenLayers.Protocol.WFS({url:layerContext.url,featurePrefix:layerContext.name.split(":")[0],featureType:layerContext.name.split(":").pop()});layer=new OpenLayers.Layer.Vector(layerContext.title||layerContext.name,options);}else if(service==OpenLayers.Format.Context.serviceTypes.KML){options.strategies=[new OpenLayers.Strategy.Fixed()];options.protocol=new OpenLayers.Protocol.HTTP({url:layerContext.url,format:new OpenLayers.Format.KML()});layer=new OpenLayers.Layer.Vector(layerContext.title||layerContext.name,options);}else if(service==OpenLayers.Format.Context.serviceTypes.GML){options.strategies=[new OpenLayers.Strategy.Fixed()];options.protocol=new OpenLayers.Protocol.HTTP({url:layerContext.url,format:new OpenLayers.Format.GML()});layer=new OpenLayers.Layer.Vector(layerContext.title||layerContext.name,options);}else if(layerContext.features){layer=new OpenLayers.Layer.Vector(layerContext.title||layerContext.name,options);layer.addFeatures(layerContext.features);}else if(layerContext.categoryLayer!==true){layer=new OpenLayers.Layer.WMS(layerContext.title||layerContext.name,layerContext.url,params,options);}
+return layer;},getLayersFromContext:function(layersContext){var layers=[];for(var i=0,len=layersContext.length;i<len;i++){var layer=this.getLayerFromContext(layersContext[i]);if(layer!==null){layers.push(layer);}}
+return layers;},contextToMap:function(context,options){options=OpenLayers.Util.applyDefaults({maxExtent:context.maxExtent,projection:context.projection},options);var map=new OpenLayers.Map(options);map.addLayers(this.getLayersFromContext(context.layersContext));map.setCenter(context.bounds.getCenterLonLat(),map.getZoomForExtent(context.bounds,true));return map;},mergeContextToMap:function(context,map){map.addLayers(this.getLayersFromContext(context.layersContext));return map;},write:function(obj,options){obj=this.toContext(obj);var version=options&&options.version;var parser=this.getParser(version);var context=parser.write(obj,options);return context;},CLASS_NAME:"OpenLayers.Format.Context"});OpenLayers.Format.Context.serviceTypes={"WMS":"urn:ogc:serviceType:WMS","WFS":"urn:ogc:serviceType:WFS","WCS":"urn:ogc:serviceType:WCS","GML":"urn:ogc:serviceType:GML","SLD":"urn:ogc:serviceType:SLD","FES":"urn:ogc:serviceType:FES","KML":"urn:ogc:serviceType:KML"};if(!OpenLayers.Format.OWSCommon){OpenLayers.Format.OWSCommon={};}
+OpenLayers.Format.OWSCommon.v1=OpenLayers.Class(OpenLayers.Format.XML,{regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},readers:{"ows":{"ServiceIdentification":function(node,obj){obj.serviceIdentification={};this.readChildNodes(node,obj.serviceIdentification);},"Title":function(node,obj){obj.title=this.getChildValue(node);},"Abstract":function(node,serviceIdentification){serviceIdentification["abstract"]=this.getChildValue(node);},"Keywords":function(node,serviceIdentification){serviceIdentification.keywords={};this.readChildNodes(node,serviceIdentification.keywords);},"Keyword":function(node,keywords){keywords[this.getChildValue(node)]=true;},"ServiceType":function(node,serviceIdentification){serviceIdentification.serviceType={codeSpace:node.getAttribute('codeSpace'),value:this.getChildValue(node)};},"ServiceTypeVersion":function(node,serviceIdentification){serviceIdentification.serviceTypeVersion=this.getChildValue(node);},"Fees":function(node,serviceIdentification){serviceIdentification.fees=this.getChildValue(node);},"AccessConstraints":function(node,serviceIdentification){serviceIdentification.accessConstraints=this.getChildValue(node);},"ServiceProvider":function(node,obj){obj.serviceProvider={};this.readChildNodes(node,obj.serviceProvider);},"ProviderName":function(node,serviceProvider){serviceProvider.providerName=this.getChildValue(node);},"ProviderSite":function(node,serviceProvider){serviceProvider.providerSite=this.getAttributeNS(node,this.namespaces.xlink,"href");},"ServiceContact":function(node,serviceProvider){serviceProvider.serviceContact={};this.readChildNodes(node,serviceProvider.serviceContact);},"IndividualName":function(node,serviceContact){serviceContact.individualName=this.getChildValue(node);},"PositionName":function(node,serviceContact){serviceContact.positionName=this.getChildValue(node);},"ContactInfo":function(node,serviceContact){serviceContact.contactInfo={};this.readChildNodes(node,serviceContact.contactInfo);},"Phone":function(node,contactInfo){contactInfo.phone={};this.readChildNodes(node,contactInfo.phone);},"Voice":function(node,phone){phone.voice=this.getChildValue(node);},"Address":function(node,contactInfo){contactInfo.address={};this.readChildNodes(node,contactInfo.address);},"DeliveryPoint":function(node,address){address.deliveryPoint=this.getChildValue(node);},"City":function(node,address){address.city=this.getChildValue(node);},"AdministrativeArea":function(node,address){address.administrativeArea=this.getChildValue(node);},"PostalCode":function(node,address){address.postalCode=this.getChildValue(node);},"Country":function(node,address){address.country=this.getChildValue(node);},"ElectronicMailAddress":function(node,address){address.electronicMailAddress=this.getChildValue(node);},"Role":function(node,serviceContact){serviceContact.role=this.getChildValue(node);},"OperationsMetadata":function(node,obj){obj.operationsMetadata={};this.readChildNodes(node,obj.operationsMetadata);},"Operation":function(node,operationsMetadata){var name=node.getAttribute("name");operationsMetadata[name]={};this.readChildNodes(node,operationsMetadata[name]);},"DCP":function(node,operation){operation.dcp={};this.readChildNodes(node,operation.dcp);},"HTTP":function(node,dcp){dcp.http={};this.readChildNodes(node,dcp.http);},"Get":function(node,http){http.get=this.getAttributeNS(node,this.namespaces.xlink,"href");},"Post":function(node,http){http.post=this.getAttributeNS(node,this.namespaces.xlink,"href");},"Parameter":function(node,operation){if(!operation.parameters){operation.parameters={};}
+var name=node.getAttribute("name");operation.parameters[name]={};this.readChildNodes(node,operation.parameters[name]);},"Value":function(node,allowedValues){allowedValues[this.getChildValue(node)]=true;},"OutputFormat":function(node,obj){obj.formats.push({value:this.getChildValue(node)});this.readChildNodes(node,obj);},"WGS84BoundingBox":function(node,obj){var boundingBox={};boundingBox.crs=node.getAttribute("crs");if(obj.BoundingBox){obj.BoundingBox.push(boundingBox);}else{obj.projection=boundingBox.crs;boundingBox=obj;}
+this.readChildNodes(node,boundingBox);},"BoundingBox":function(node,obj){this.readers['ows']['WGS84BoundingBox'].apply(this,[node,obj]);},"LowerCorner":function(node,obj){var str=this.getChildValue(node).replace(this.regExes.trimSpace,"");str=str.replace(this.regExes.trimComma,",");var pointList=str.split(this.regExes.splitSpace);obj.left=pointList[0];obj.bottom=pointList[1];},"UpperCorner":function(node,obj){var str=this.getChildValue(node).replace(this.regExes.trimSpace,"");str=str.replace(this.regExes.trimComma,",");var pointList=str.split(this.regExes.splitSpace);obj.right=pointList[0];obj.top=pointList[1];obj.bounds=new OpenLayers.Bounds(obj.left,obj.bottom,obj.right,obj.top);delete obj.left;delete obj.bottom;delete obj.right;delete obj.top;}}},writers:{"ows":{"BoundingBox":function(options){var node=this.createElementNSPlus("ows:BoundingBox",{attributes:{crs:options.projection}});this.writeNode("ows:LowerCorner",options,node);this.writeNode("ows:UpperCorner",options,node);return node;},"LowerCorner":function(options){var node=this.createElementNSPlus("ows:LowerCorner",{value:options.bounds.left+" "+options.bounds.bottom});return node;},"UpperCorner":function(options){var node=this.createElementNSPlus("ows:UpperCorner",{value:options.bounds.right+" "+options.bounds.top});return node;},"Title":function(title){var node=this.createElementNSPlus("ows:Title",{value:title});return node;},"OutputFormat":function(format){var node=this.createElementNSPlus("ows:OutputFormat",{value:format});return node;}}},CLASS_NAME:"OpenLayers.Format.OWSCommon.v1"});OpenLayers.Format.SOSCapabilities=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.0.0",version:null,parser:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version||root.getAttribute("version")||this.defaultVersion;if(!this.parser||this.parser.version!==version){var constr=OpenLayers.Format.SOSCapabilities["v"+version.replace(/\./g,"_")];if(!constr){throw"Can't find a SOS capabilities parser for version "+version;}
+var parser=new constr(this.options);}
+var capabilities=parser.read(data);capabilities.version=version;return capabilities;},CLASS_NAME:"OpenLayers.Format.SOSCapabilities"});OpenLayers.Format.WFSCapabilities=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.1.0",version:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version;if(!version){version=root.getAttribute("version");if(!version){version=this.defaultVersion;}}
+var constr=OpenLayers.Format.WFSCapabilities["v"+version.replace(/\./g,"_")];if(!constr){throw"Can't find a WFS capabilities parser for version "+version;}
+var parser=new constr(this.options);var capabilities=parser.read(data);capabilities.version=version;return capabilities;},CLASS_NAME:"OpenLayers.Format.WFSCapabilities"});OpenLayers.Format.WFSDescribeFeatureType=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{xsd:"http://www.w3.org/2001/XMLSchema"},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},readers:{"xsd":{"schema":function(node,obj){var complexTypes=[];var customTypes={};var schema={complexTypes:complexTypes,customTypes:customTypes};this.readChildNodes(node,schema);var attributes=node.attributes;var attr,name;for(var i=0,len=attributes.length;i<len;++i){attr=attributes[i];name=attr.name;if(name.indexOf("xmlns")==0){this.setNamespace(name.split(":")[1]||"",attr.value);}else{obj[name]=attr.value;}}
+obj.featureTypes=complexTypes;obj.targetPrefix=this.namespaceAlias[obj.targetNamespace];var complexType,customType;for(var i=0,len=complexTypes.length;i<len;++i){complexType=complexTypes[i];customType=customTypes[complexType.typeName];if(customTypes[complexType.typeName]){complexType.typeName=customType.name;}}},"complexType":function(node,obj){var complexType={"typeName":node.getAttribute("name")};this.readChildNodes(node,complexType);obj.complexTypes.push(complexType);},"complexContent":function(node,obj){this.readChildNodes(node,obj);},"extension":function(node,obj){this.readChildNodes(node,obj);},"sequence":function(node,obj){var sequence={elements:[]};this.readChildNodes(node,sequence);obj.properties=sequence.elements;},"element":function(node,obj){if(obj.elements){var element={};var attributes=node.attributes;var attr;for(var i=0,len=attributes.length;i<len;++i){attr=attributes[i];element[attr.name]=attr.value;}
+var type=element.type;if(!type){type={};this.readChildNodes(node,type);element.restriction=type;element.type=type.base;}
+var fullType=type.base||type;element.localType=fullType.split(":").pop();obj.elements.push(element);}
+if(obj.complexTypes){var type=node.getAttribute("type");var localType=type.split(":").pop();obj.customTypes[localType]={"name":node.getAttribute("name"),"type":type};}},"simpleType":function(node,obj){this.readChildNodes(node,obj);},"restriction":function(node,obj){obj.base=node.getAttribute("base");this.readRestriction(node,obj);}}},readRestriction:function(node,obj){var children=node.childNodes;var child,nodeName,value;for(var i=0,len=children.length;i<len;++i){child=children[i];if(child.nodeType==1){nodeName=child.nodeName.split(":").pop();value=child.getAttribute("value");if(!obj[nodeName]){obj[nodeName]=value;}else{if(typeof obj[nodeName]=="string"){obj[nodeName]=[obj[nodeName]];}
+obj[nodeName].push(value);}}}},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var schema={};this.readNode(data,schema);return schema;},CLASS_NAME:"OpenLayers.Format.WFSDescribeFeatureType"});OpenLayers.Format.WFST.v1=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance",wfs:"http://www.opengis.net/wfs",gml:"http://www.opengis.net/gml",ogc:"http://www.opengis.net/ogc"},defaultPrefix:"wfs",version:null,schemaLocations:null,srsName:null,extractAttributes:true,xy:true,stateName:null,initialize:function(options){this.stateName={};this.stateName[OpenLayers.State.INSERT]="wfs:Insert";this.stateName[OpenLayers.State.UPDATE]="wfs:Update";this.stateName[OpenLayers.State.DELETE]="wfs:Delete";OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},getSrsName:function(feature,options){var srsName=options&&options.srsName;if(!srsName){if(feature&&feature.layer){srsName=feature.layer.projection.getCode();}else{srsName=this.srsName;}}
+return srsName;},read:function(data,options){options=options||{};OpenLayers.Util.applyDefaults(options,{output:"features"});if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var obj={};if(data){this.readNode(data,obj);}
+if(obj.features&&options.output==="features"){obj=obj.features;}
+return obj;},readers:{"wfs":{"FeatureCollection":function(node,obj){obj.features=[];this.readChildNodes(node,obj);}}},write:function(features){var node=this.writeNode("wfs:Transaction",features);var value=this.schemaLocationAttr();if(value){this.setAttributeNS(node,this.namespaces["xsi"],"xsi:schemaLocation",value)}
+return OpenLayers.Format.XML.prototype.write.apply(this,[node]);},writers:{"wfs":{"GetFeature":function(options){var node=this.createElementNSPlus("wfs:GetFeature",{attributes:{service:"WFS",version:this.version,outputFormat:options&&options.outputFormat,maxFeatures:options&&options.maxFeatures,"xsi:schemaLocation":this.schemaLocationAttr(options)}});if(typeof this.featureType=="string"){this.writeNode("Query",options,node);}else{for(var i=0,len=this.featureType.length;i<len;i++){options.featureType=this.featureType[i];this.writeNode("Query",options,node);}}
+return node;},"Transaction":function(features){var node=this.createElementNSPlus("wfs:Transaction",{attributes:{service:"WFS",version:this.version}});if(features){var name,feature;for(var i=0,len=features.length;i<len;++i){feature=features[i];name=this.stateName[feature.state];if(name){this.writeNode(name,feature,node);}}}
+return node;},"Insert":function(feature){var node=this.createElementNSPlus("wfs:Insert");this.srsName=this.getSrsName(feature);this.writeNode("feature:_typeName",feature,node);return node;},"Update":function(feature){var node=this.createElementNSPlus("wfs:Update",{attributes:{typeName:(this.featureNS?this.featurePrefix+":":"")+
+this.featureType}});if(this.featureNS){node.setAttribute("xmlns:"+this.featurePrefix,this.featureNS);}
+if(this.geometryName!==null){this.writeNode("Property",{name:this.geometryName,value:feature},node);}
+for(var key in feature.attributes){if(feature.attributes[key]!==undefined){this.writeNode("Property",{name:key,value:feature.attributes[key]},node);}}
+this.writeNode("ogc:Filter",new OpenLayers.Filter.FeatureId({fids:[feature.fid]}),node);return node;},"Property":function(obj){var node=this.createElementNSPlus("wfs:Property");this.writeNode("Name",obj.name,node);if(obj.value!==null){this.writeNode("Value",obj.value,node);}
+return node;},"Name":function(name){return this.createElementNSPlus("wfs:Name",{value:name});},"Value":function(obj){var node;if(obj instanceof OpenLayers.Feature.Vector){node=this.createElementNSPlus("wfs:Value");this.srsName=this.getSrsName(obj);var geom=this.writeNode("feature:_geometry",obj.geometry).firstChild;node.appendChild(geom);}else{node=this.createElementNSPlus("wfs:Value",{value:obj});}
+return node;},"Delete":function(feature){var node=this.createElementNSPlus("wfs:Delete",{attributes:{typeName:(this.featureNS?this.featurePrefix+":":"")+
+this.featureType}});if(this.featureNS){node.setAttribute("xmlns:"+this.featurePrefix,this.featureNS);}
+this.writeNode("ogc:Filter",new OpenLayers.Filter.FeatureId({fids:[feature.fid]}),node);return node;}}},schemaLocationAttr:function(options){options=OpenLayers.Util.extend({featurePrefix:this.featurePrefix,schema:this.schema},options);var schemaLocations=OpenLayers.Util.extend({},this.schemaLocations);if(options.schema){schemaLocations[options.featurePrefix]=options.schema;}
+var parts=[];var uri;for(var key in schemaLocations){uri=this.namespaces[key];if(uri){parts.push(uri+" "+schemaLocations[key]);}}
+var value=parts.join(" ")||undefined;return value;},setFilterProperty:function(filter){if(filter.filters){for(var i=0,len=filter.filters.length;i<len;++i){this.setFilterProperty(filter.filters[i]);}}else{if(filter instanceof OpenLayers.Filter.Spatial){filter.property=this.geometryName;}}},CLASS_NAME:"OpenLayers.Format.WFST.v1"});OpenLayers.Format.WMSCapabilities=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.1.1",version:null,parser:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version||root.getAttribute("version")||this.defaultVersion;if(!this.parser||this.parser.version!==version){var constr=OpenLayers.Format.WMSCapabilities["v"+version.replace(/\./g,"_")];if(!constr){throw"Can't find a WMS capabilities parser for version "+version;}
+this.parser=new constr(this.options);}
+var capabilities=this.parser.read(data);capabilities.version=version;return capabilities;},CLASS_NAME:"OpenLayers.Format.WMSCapabilities"});OpenLayers.Format.WMSDescribeLayer=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.1.1",version:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version;if(!version){version=root.getAttribute("version");if(!version){version=this.defaultVersion;}}
+if(version=="1.1.1"||version=="1.1.0"){version="1.1";}
+var constructor=OpenLayers.Format.WMSDescribeLayer["v"+version.replace(/\./g,"_")];if(!constructor){throw"Can't find a WMS DescribeLayer parser for version "+
+version;}
+var parser=new constructor(this.options);var describelayer=parser.read(data);describelayer.version=version;return describelayer;},CLASS_NAME:"OpenLayers.Format.WMSDescribeLayer"});OpenLayers.Format.WMSGetFeatureInfo=OpenLayers.Class(OpenLayers.Format.XML,{layerIdentifier:'_layer',featureIdentifier:'_feature',regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},gmlFormat:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,arguments);OpenLayers.Util.extend(this,options);this.options=options;},read:function(data){var result;if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;if(root){var scope=this;var read=this["read_"+root.nodeName];if(read){result=read.call(this,root);}else{result=new OpenLayers.Format.GML((this.options?this.options:{})).read(data);}}else{result=data;}
+return result;},read_msGMLOutput:function(data){var response=[];var layerNodes=this.getSiblingNodesByTagCriteria(data,this.layerIdentifier);if(layerNodes){for(var i=0,len=layerNodes.length;i<len;++i){var node=layerNodes[i];var layerName=node.nodeName;if(node.prefix){layerName=layerName.split(':')[1];}
+var layerName=layerName.replace(this.layerIdentifier,'');var featureNodes=this.getSiblingNodesByTagCriteria(node,this.featureIdentifier);if(featureNodes){for(var j=0;j<featureNodes.length;j++){var featureNode=featureNodes[j];var geomInfo=this.parseGeometry(featureNode);var attributes=this.parseAttributes(featureNode);var feature=new OpenLayers.Feature.Vector(geomInfo.geometry,attributes,null);feature.bounds=geomInfo.bounds;feature.type=layerName;response.push(feature);}}}}
+return response;},read_FeatureInfoResponse:function(data){var response=[];var featureNodes=this.getElementsByTagNameNS(data,'*','FIELDS');for(var i=0,len=featureNodes.length;i<len;i++){var featureNode=featureNodes[i];var geom=null;var attributes={};for(var j=0,jlen=featureNode.attributes.length;j<jlen;j++){var attribute=featureNode.attributes[j];attributes[attribute.nodeName]=attribute.nodeValue;}
+response.push(new OpenLayers.Feature.Vector(geom,attributes,null));}
+return response;},getSiblingNodesByTagCriteria:function(node,criteria){var nodes=[];var children,tagName,n,matchNodes,child;if(node&&node.hasChildNodes()){children=node.childNodes;n=children.length;for(var k=0;k<n;k++){child=children[k];while(child&&child.nodeType!=1){child=child.nextSibling;k++;}
+tagName=(child?child.nodeName:'');if(tagName.length>0&&tagName.indexOf(criteria)>-1){nodes.push(child);}else{matchNodes=this.getSiblingNodesByTagCriteria(child,criteria);if(matchNodes.length>0){(nodes.length==0)?nodes=matchNodes:nodes.push(matchNodes);}}}}
+return nodes;},parseAttributes:function(node){var attributes={};if(node.nodeType==1){var children=node.childNodes;var n=children.length;for(var i=0;i<n;++i){var child=children[i];if(child.nodeType==1){var grandchildren=child.childNodes;if(grandchildren.length==1){var grandchild=grandchildren[0];if(grandchild.nodeType==3||grandchild.nodeType==4){var name=(child.prefix)?child.nodeName.split(":")[1]:child.nodeName;var value=grandchild.nodeValue.replace(this.regExes.trimSpace,"");attributes[name]=value;}}}}}
+return attributes;},parseGeometry:function(node){if(!this.gmlFormat){this.gmlFormat=new OpenLayers.Format.GML();}
+var feature=this.gmlFormat.parseFeature(node);var geometry,bounds=null;if(feature){geometry=feature.geometry&&feature.geometry.clone();bounds=feature.bounds&&feature.bounds.clone();feature.destroy();}
+return{geometry:geometry,bounds:bounds};},CLASS_NAME:"OpenLayers.Format.WMSGetFeatureInfo"});OpenLayers.Format.WMTSCapabilities=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.0.0",version:null,parser:null,yx:{"urn:ogc:def:crs:EPSG::4326":true},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version||root.getAttribute("version")||this.defaultVersion;if(!this.parser||this.parser.version!==version){var constr=OpenLayers.Format.WMTSCapabilities["v"+version.replace(/\./g,"_")];if(!constr){throw new Error("Can't find a WMTS capabilities parser for version "+version);}
+this.parser=new constr(this.options);}
+return this.parser.read(data);},createLayer:function(capabilities,config){var layer;var required={layer:true,matrixSet:true};for(var prop in required){if(!(prop in config)){throw new Error("Missing property '"+prop+"' in layer configuration.");}}
+var contents=capabilities.contents;var matrixSet=contents.tileMatrixSets[config.matrixSet];var layers=contents.layers;var layerDef;for(var i=0,ii=contents.layers.length;i<ii;++i){if(contents.layers[i].identifier===config.layer){layerDef=contents.layers[i];break;}}
+if(layerDef&&matrixSet){var style;for(var i=0,ii=layerDef.styles.length;i<ii;++i){style=layerDef.styles[i];if(style.isDefault){break;}}
+layer=new OpenLayers.Layer.WMTS(OpenLayers.Util.applyDefaults(config,{url:capabilities.operationsMetadata.GetTile.dcp.http.get,name:layerDef.title,style:style,matrixIds:matrixSet.matrixIds}));}
+return layer;},CLASS_NAME:"OpenLayers.Format.WMTSCapabilities"});OpenLayers.Handler.Click=OpenLayers.Class(OpenLayers.Handler,{delay:300,single:true,'double':false,pixelTolerance:0,stopSingle:false,stopDouble:false,timerId:null,down:null,rightclickTimerId:null,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);if(this.pixelTolerance!=null){this.mousedown=function(evt){this.down=evt.xy;return true;};}},mousedown:null,mouseup:function(evt){var propagate=true;if(this.checkModifiers(evt)&&this.control.handleRightClicks&&OpenLayers.Event.isRightClick(evt)){propagate=this.rightclick(evt);}
+return propagate;},rightclick:function(evt){if(this.passesTolerance(evt)){if(this.rightclickTimerId!=null){this.clearTimer();this.callback('dblrightclick',[evt]);return!this.stopDouble;}else{var clickEvent=this['double']?OpenLayers.Util.extend({},evt):this.callback('rightclick',[evt]);var delayedRightCall=OpenLayers.Function.bind(this.delayedRightCall,this,clickEvent);this.rightclickTimerId=window.setTimeout(delayedRightCall,this.delay);}}
+return!this.stopSingle;},delayedRightCall:function(evt){this.rightclickTimerId=null;if(evt){this.callback('rightclick',[evt]);}
+return!this.stopSingle;},dblclick:function(evt){if(this.passesTolerance(evt)){if(this["double"]){this.callback('dblclick',[evt]);}
+this.clearTimer();}
+return!this.stopDouble;},click:function(evt){if(this.passesTolerance(evt)){if(this.timerId!=null){this.clearTimer();}else{var clickEvent=this.single?OpenLayers.Util.extend({},evt):null;this.timerId=window.setTimeout(OpenLayers.Function.bind(this.delayedCall,this,clickEvent),this.delay);}}
+return!this.stopSingle;},passesTolerance:function(evt){var passes=true;if(this.pixelTolerance!=null&&this.down){var dpx=Math.sqrt(Math.pow(this.down.x-evt.xy.x,2)+
+Math.pow(this.down.y-evt.xy.y,2));if(dpx>this.pixelTolerance){passes=false;}}
+return passes;},clearTimer:function(){if(this.timerId!=null){window.clearTimeout(this.timerId);this.timerId=null;}
+if(this.rightclickTimerId!=null){window.clearTimeout(this.rightclickTimerId);this.rightclickTimerId=null;}},delayedCall:function(evt){this.timerId=null;if(evt){this.callback('click',[evt]);}},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){this.clearTimer();this.down=null;deactivated=true;}
+return deactivated;},CLASS_NAME:"OpenLayers.Handler.Click"});OpenLayers.Handler.Drag=OpenLayers.Class(OpenLayers.Handler,{started:false,stopDown:true,dragging:false,last:null,start:null,oldOnselectstart:null,interval:0,timeoutId:null,documentDrag:false,documentEvents:null,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);},down:function(evt){},move:function(evt){},up:function(evt){},out:function(evt){},mousedown:function(evt){var propagate=true;this.dragging=false;if(this.checkModifiers(evt)&&OpenLayers.Event.isLeftClick(evt)){this.started=true;this.start=evt.xy;this.last=evt.xy;OpenLayers.Element.addClass(this.map.viewPortDiv,"olDragDown");this.down(evt);this.callback("down",[evt.xy]);OpenLayers.Event.stop(evt);if(!this.oldOnselectstart){this.oldOnselectstart=(document.onselectstart)?document.onselectstart:OpenLayers.Function.True;}
+document.onselectstart=OpenLayers.Function.False;propagate=!this.stopDown;}else{this.started=false;this.start=null;this.last=null;}
+return propagate;},mousemove:function(evt){if(this.started&&!this.timeoutId&&(evt.xy.x!=this.last.x||evt.xy.y!=this.last.y)){if(this.documentDrag===true&&this.documentEvents){if(evt.element===document){this.adjustXY(evt);this.setEvent(evt);}else{this.destroyDocumentEvents();}}
+if(this.interval>0){this.timeoutId=setTimeout(OpenLayers.Function.bind(this.removeTimeout,this),this.interval);}
+this.dragging=true;this.move(evt);this.callback("move",[evt.xy]);if(!this.oldOnselectstart){this.oldOnselectstart=document.onselectstart;document.onselectstart=OpenLayers.Function.False;}
+this.last=this.evt.xy;}
+return true;},removeTimeout:function(){this.timeoutId=null;},mouseup:function(evt){if(this.started){if(this.documentDrag===true&&this.documentEvents){this.adjustXY(evt);this.destroyDocumentEvents();}
+var dragged=(this.start!=this.last);this.started=false;this.dragging=false;OpenLayers.Element.removeClass(this.map.viewPortDiv,"olDragDown");this.up(evt);this.callback("up",[evt.xy]);if(dragged){this.callback("done",[evt.xy]);}
+document.onselectstart=this.oldOnselectstart;}
+return true;},mouseout:function(evt){if(this.started&&OpenLayers.Util.mouseLeft(evt,this.map.div)){if(this.documentDrag===true){this.documentEvents=new OpenLayers.Events(this,document,null,null,{includeXY:true});this.documentEvents.on({mousemove:this.mousemove,mouseup:this.mouseup});OpenLayers.Element.addClass(document.body,"olDragDown");}else{var dragged=(this.start!=this.last);this.started=false;this.dragging=false;OpenLayers.Element.removeClass(this.map.viewPortDiv,"olDragDown");this.out(evt);this.callback("out",[]);if(dragged){this.callback("done",[evt.xy]);}
+if(document.onselectstart){document.onselectstart=this.oldOnselectstart;}}}
+return true;},click:function(evt){return(this.start==this.last);},activate:function(){var activated=false;if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){this.dragging=false;activated=true;}
+return activated;},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){this.started=false;this.dragging=false;this.start=null;this.last=null;deactivated=true;OpenLayers.Element.removeClass(this.map.viewPortDiv,"olDragDown");}
+return deactivated;},adjustXY:function(evt){var pos=OpenLayers.Util.pagePosition(this.map.div);evt.xy.x-=pos[0];evt.xy.y-=pos[1];},destroyDocumentEvents:function(){OpenLayers.Element.removeClass(document.body,"olDragDown");this.documentEvents.destroy();this.documentEvents=null;},CLASS_NAME:"OpenLayers.Handler.Drag"});OpenLayers.Handler.Feature=OpenLayers.Class(OpenLayers.Handler,{EVENTMAP:{'click':{'in':'click','out':'clickout'},'mousemove':{'in':'over','out':'out'},'dblclick':{'in':'dblclick','out':null},'mousedown':{'in':null,'out':null},'mouseup':{'in':null,'out':null}},feature:null,lastFeature:null,down:null,up:null,clickTolerance:4,geometryTypes:null,stopClick:true,stopDown:true,stopUp:false,initialize:function(control,layer,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,[control,callbacks,options]);this.layer=layer;},mousedown:function(evt){this.down=evt.xy;return this.handle(evt)?!this.stopDown:true;},mouseup:function(evt){this.up=evt.xy;return this.handle(evt)?!this.stopUp:true;},click:function(evt){return this.handle(evt)?!this.stopClick:true;},mousemove:function(evt){if(!this.callbacks['over']&&!this.callbacks['out']){return true;}
+this.handle(evt);return true;},dblclick:function(evt){return!this.handle(evt);},geometryTypeMatches:function(feature){return this.geometryTypes==null||OpenLayers.Util.indexOf(this.geometryTypes,feature.geometry.CLASS_NAME)>-1;},handle:function(evt){if(this.feature&&!this.feature.layer){this.feature=null;}
+var type=evt.type;var handled=false;var previouslyIn=!!(this.feature);var click=(type=="click"||type=="dblclick");this.feature=this.layer.getFeatureFromEvent(evt);if(this.feature&&!this.feature.layer){this.feature=null;}
+if(this.lastFeature&&!this.lastFeature.layer){this.lastFeature=null;}
+if(this.feature){var inNew=(this.feature!=this.lastFeature);if(this.geometryTypeMatches(this.feature)){if(previouslyIn&&inNew){if(this.lastFeature){this.triggerCallback(type,'out',[this.lastFeature]);}
+this.triggerCallback(type,'in',[this.feature]);}else if(!previouslyIn||click){this.triggerCallback(type,'in',[this.feature]);}
+this.lastFeature=this.feature;handled=true;}else{if(this.lastFeature&&(previouslyIn&&inNew||click)){this.triggerCallback(type,'out',[this.lastFeature]);}
+this.feature=null;}}else{if(this.lastFeature&&(previouslyIn||click)){this.triggerCallback(type,'out',[this.lastFeature]);}}
+return handled;},triggerCallback:function(type,mode,args){var key=this.EVENTMAP[type][mode];if(key){if(type=='click'&&this.up&&this.down){var dpx=Math.sqrt(Math.pow(this.up.x-this.down.x,2)+
+Math.pow(this.up.y-this.down.y,2));if(dpx<=this.clickTolerance){this.callback(key,args);}}else{this.callback(key,args);}}},activate:function(){var activated=false;if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){this.moveLayerToTop();this.map.events.on({"removelayer":this.handleMapEvents,"changelayer":this.handleMapEvents,scope:this});activated=true;}
+return activated;},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){this.moveLayerBack();this.feature=null;this.lastFeature=null;this.down=null;this.up=null;this.map.events.un({"removelayer":this.handleMapEvents,"changelayer":this.handleMapEvents,scope:this});deactivated=true;}
+return deactivated;},handleMapEvents:function(evt){if(!evt.property||evt.property=="order"){this.moveLayerToTop();}},moveLayerToTop:function(){var index=Math.max(this.map.Z_INDEX_BASE['Feature']-1,this.layer.getZIndex())+1;this.layer.setZIndex(index);},moveLayerBack:function(){var index=this.layer.getZIndex()-1;if(index>=this.map.Z_INDEX_BASE['Feature']){this.layer.setZIndex(index);}else{this.map.setLayerZIndex(this.layer,this.map.getLayerIndex(this.layer));}},CLASS_NAME:"OpenLayers.Handler.Feature"});OpenLayers.Handler.Hover=OpenLayers.Class(OpenLayers.Handler,{delay:500,pixelTolerance:null,stopMove:false,px:null,timerId:null,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);},mousemove:function(evt){if(this.passesTolerance(evt.xy)){this.clearTimer();this.callback('move',[evt]);this.px=evt.xy;evt=OpenLayers.Util.extend({},evt);this.timerId=window.setTimeout(OpenLayers.Function.bind(this.delayedCall,this,evt),this.delay);}
+return!this.stopMove;},mouseout:function(evt){if(OpenLayers.Util.mouseLeft(evt,this.map.div)){this.clearTimer();this.callback('move',[evt]);}
+return true;},passesTolerance:function(px){var passes=true;if(this.pixelTolerance&&this.px){var dpx=Math.sqrt(Math.pow(this.px.x-px.x,2)+
+Math.pow(this.px.y-px.y,2));if(dpx<this.pixelTolerance){passes=false;}}
+return passes;},clearTimer:function(){if(this.timerId!=null){window.clearTimeout(this.timerId);this.timerId=null;}},delayedCall:function(evt){this.callback('pause',[evt]);},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){this.clearTimer();deactivated=true;}
+return deactivated;},CLASS_NAME:"OpenLayers.Handler.Hover"});OpenLayers.Handler.Keyboard=OpenLayers.Class(OpenLayers.Handler,{KEY_EVENTS:["keydown","keyup"],eventListener:null,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);this.eventListener=OpenLayers.Function.bindAsEventListener(this.handleKeyEvent,this);},destroy:function(){this.deactivate();this.eventListener=null;OpenLayers.Handler.prototype.destroy.apply(this,arguments);},activate:function(){if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){for(var i=0,len=this.KEY_EVENTS.length;i<len;i++){OpenLayers.Event.observe(document,this.KEY_EVENTS[i],this.eventListener);}
+return true;}else{return false;}},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){for(var i=0,len=this.KEY_EVENTS.length;i<len;i++){OpenLayers.Event.stopObserving(document,this.KEY_EVENTS[i],this.eventListener);}
+deactivated=true;}
+return deactivated;},handleKeyEvent:function(evt){if(this.checkModifiers(evt)){this.callback(evt.type,[evt]);}},CLASS_NAME:"OpenLayers.Handler.Keyboard"});OpenLayers.Handler.MouseWheel=OpenLayers.Class(OpenLayers.Handler,{wheelListener:null,mousePosition:null,interval:0,delta:0,cumulative:true,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);this.wheelListener=OpenLayers.Function.bindAsEventListener(this.onWheelEvent,this);},destroy:function(){OpenLayers.Handler.prototype.destroy.apply(this,arguments);this.wheelListener=null;},onWheelEvent:function(e){if(!this.map||!this.checkModifiers(e)){return;}
+var overScrollableDiv=false;var overLayerDiv=false;var overMapDiv=false;var elem=OpenLayers.Event.element(e);while((elem!=null)&&!overMapDiv&&!overScrollableDiv){if(!overScrollableDiv){try{if(elem.currentStyle){overflow=elem.currentStyle["overflow"];}else{var style=document.defaultView.getComputedStyle(elem,null);var overflow=style.getPropertyValue("overflow");}
+overScrollableDiv=(overflow&&(overflow=="auto")||(overflow=="scroll"));}catch(err){}}
+if(!overLayerDiv){for(var i=0,len=this.map.layers.length;i<len;i++){if(elem==this.map.layers[i].div||elem==this.map.layers[i].pane){overLayerDiv=true;break;}}}
+overMapDiv=(elem==this.map.div);elem=elem.parentNode;}
+if(!overScrollableDiv&&overMapDiv){if(overLayerDiv){var delta=0;if(!e){e=window.event;}
+if(e.wheelDelta){delta=e.wheelDelta/120;if(window.opera&&window.opera.version()<9.2){delta=-delta;}}else if(e.detail){delta=-e.detail/3;}
+this.delta=this.delta+delta;if(this.interval){window.clearTimeout(this._timeoutId);this._timeoutId=window.setTimeout(OpenLayers.Function.bind(function(){this.wheelZoom(e);},this),this.interval);}else{this.wheelZoom(e);}}
+OpenLayers.Event.stop(e);}},wheelZoom:function(e){var delta=this.delta;this.delta=0;if(delta){if(this.mousePosition){e.xy=this.mousePosition;}
+if(!e.xy){e.xy=this.map.getPixelFromLonLat(this.map.getCenter());}
+if(delta<0){this.callback("down",[e,this.cumulative?delta:-1]);}else{this.callback("up",[e,this.cumulative?delta:1]);}}},mousemove:function(evt){this.mousePosition=evt.xy;},activate:function(evt){if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){var wheelListener=this.wheelListener;OpenLayers.Event.observe(window,"DOMMouseScroll",wheelListener);OpenLayers.Event.observe(window,"mousewheel",wheelListener);OpenLayers.Event.observe(document,"mousewheel",wheelListener);return true;}else{return false;}},deactivate:function(evt){if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){var wheelListener=this.wheelListener;OpenLayers.Event.stopObserving(window,"DOMMouseScroll",wheelListener);OpenLayers.Event.stopObserving(window,"mousewheel",wheelListener);OpenLayers.Event.stopObserving(document,"mousewheel",wheelListener);return true;}else{return false;}},CLASS_NAME:"OpenLayers.Handler.MouseWheel"});OpenLayers.Layer=OpenLayers.Class({id:null,name:null,div:null,opacity:null,alwaysInRange:null,EVENT_TYPES:["loadstart","loadend","loadcancel","visibilitychanged","move","moveend"],RESOLUTION_PROPERTIES:['scales','resolutions','maxScale','minScale','maxResolution','minResolution','numZoomLevels','maxZoomLevel'],events:null,map:null,isBaseLayer:false,alpha:false,displayInLayerSwitcher:true,visibility:true,attribution:null,inRange:false,imageSize:null,imageOffset:null,options:null,eventListeners:null,gutter:0,projection:null,units:null,scales:null,resolutions:null,maxExtent:null,minExtent:null,maxResolution:null,minResolution:null,numZoomLevels:null,minScale:null,maxScale:null,displayOutsideMaxExtent:false,wrapDateLine:false,transitionEffect:null,SUPPORTED_TRANSITIONS:['resize'],metadata:{},initialize:function(name,options){this.addOptions(options);this.name=name;if(this.id==null){this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");this.div=OpenLayers.Util.createDiv(this.id);this.div.style.width="100%";this.div.style.height="100%";this.div.dir="ltr";this.events=new OpenLayers.Events(this,this.div,this.EVENT_TYPES);if(this.eventListeners instanceof Object){this.events.on(this.eventListeners);}}
+if(this.wrapDateLine){this.displayOutsideMaxExtent=true;}},destroy:function(setNewBaseLayer){if(setNewBaseLayer==null){setNewBaseLayer=true;}
+if(this.map!=null){this.map.removeLayer(this,setNewBaseLayer);}
+this.projection=null;this.map=null;this.name=null;this.div=null;this.options=null;if(this.events){if(this.eventListeners){this.events.un(this.eventListeners);}
+this.events.destroy();}
+this.eventListeners=null;this.events=null;},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer(this.name,this.getOptions());}
+OpenLayers.Util.applyDefaults(obj,this);obj.map=null;return obj;},getOptions:function(){var options={};for(var o in this.options){options[o]=this[o];}
+return options;},setName:function(newName){if(newName!=this.name){this.name=newName;if(this.map!=null){this.map.events.triggerEvent("changelayer",{layer:this,property:"name"});}}},addOptions:function(newOptions){if(this.options==null){this.options={};}
+OpenLayers.Util.extend(this.options,newOptions);OpenLayers.Util.extend(this,newOptions);if(typeof this.projection=="string"){this.projection=new OpenLayers.Projection(this.projection);}
+if(this.projection&&this.projection.getUnits()){this.units=this.projection.getUnits();}
+if(this.map){var properties=this.RESOLUTION_PROPERTIES.concat(["projection","units","minExtent","maxExtent"]);for(var o in newOptions){if(newOptions.hasOwnProperty(o)&&OpenLayers.Util.indexOf(properties,o)>=0){this.initResolutions();break;}}}},onMapResize:function(){},redraw:function(){var redrawn=false;if(this.map){this.inRange=this.calculateInRange();var extent=this.getExtent();if(extent&&this.inRange&&this.visibility){var zoomChanged=true;this.moveTo(extent,zoomChanged,false);this.events.triggerEvent("moveend",{"zoomChanged":zoomChanged});redrawn=true;}}
+return redrawn;},moveTo:function(bounds,zoomChanged,dragging){var display=this.visibility;if(!this.isBaseLayer){display=display&&this.inRange;}
+this.display(display);},setMap:function(map){if(this.map==null){this.map=map;this.maxExtent=this.maxExtent||this.map.maxExtent;this.minExtent=this.minExtent||this.map.minExtent;this.projection=this.projection||this.map.projection;if(typeof this.projection=="string"){this.projection=new OpenLayers.Projection(this.projection);}
+this.units=this.projection.getUnits()||this.units||this.map.units;this.initResolutions();if(!this.isBaseLayer){this.inRange=this.calculateInRange();var show=((this.visibility)&&(this.inRange));this.div.style.display=show?"":"none";}
+this.setTileSize();}},afterAdd:function(){},removeMap:function(map){},getImageSize:function(bounds){return(this.imageSize||this.tileSize);},setTileSize:function(size){var tileSize=(size)?size:((this.tileSize)?this.tileSize:this.map.getTileSize());this.tileSize=tileSize;if(this.gutter){this.imageOffset=new OpenLayers.Pixel(-this.gutter,-this.gutter);this.imageSize=new OpenLayers.Size(tileSize.w+(2*this.gutter),tileSize.h+(2*this.gutter));}},getVisibility:function(){return this.visibility;},setVisibility:function(visibility){if(visibility!=this.visibility){this.visibility=visibility;this.display(visibility);this.redraw();if(this.map!=null){this.map.events.triggerEvent("changelayer",{layer:this,property:"visibility"});}
+this.events.triggerEvent("visibilitychanged");}},display:function(display){if(display!=(this.div.style.display!="none")){this.div.style.display=(display&&this.calculateInRange())?"block":"none";}},calculateInRange:function(){var inRange=false;if(this.alwaysInRange){inRange=true;}else{if(this.map){var resolution=this.map.getResolution();inRange=((resolution>=this.minResolution)&&(resolution<=this.maxResolution));}}
+return inRange;},setIsBaseLayer:function(isBaseLayer){if(isBaseLayer!=this.isBaseLayer){this.isBaseLayer=isBaseLayer;if(this.map!=null){this.map.events.triggerEvent("changebaselayer",{layer:this});}}},initResolutions:function(){var i,len;var props={},alwaysInRange=true;for(i=0,len=this.RESOLUTION_PROPERTIES.length;i<len;i++){var p=this.RESOLUTION_PROPERTIES[i];props[p]=this.options[p];if(alwaysInRange&&this.options[p]){alwaysInRange=false;}}
+if(this.alwaysInRange==null){this.alwaysInRange=alwaysInRange;}
+if(props.resolutions==null){props.resolutions=this.resolutionsFromScales(props.scales);}
+if(props.resolutions==null){props.resolutions=this.calculateResolutions(props);}
+if(props.resolutions==null){for(i=0,len=this.RESOLUTION_PROPERTIES.length;i<len;i++){var p=this.RESOLUTION_PROPERTIES[i];props[p]=this.options[p]!=null?this.options[p]:this.map[p];}
+if(props.resolutions==null){props.resolutions=this.resolutionsFromScales(props.scales);}
+if(props.resolutions==null){props.resolutions=this.calculateResolutions(props);}}
+var maxResolution;if(this.options.maxResolution&&this.options.maxResolution!=="auto"){maxResolution=this.options.maxResolution;}
+if(this.options.minScale){maxResolution=OpenLayers.Util.getResolutionFromScale(this.options.minScale,this.units);}
+var minResolution;if(this.options.minResolution&&this.options.minResolution!=="auto"){minResolution=this.options.minResolution;}
+if(this.options.maxScale){minResolution=OpenLayers.Util.getResolutionFromScale(this.options.maxScale,this.units);}
+if(props.resolutions){props.resolutions.sort(function(a,b){return(b-a);});if(!maxResolution){maxResolution=props.resolutions[0];}
+if(!minResolution){var lastIdx=props.resolutions.length-1;minResolution=props.resolutions[lastIdx];}}
+this.resolutions=props.resolutions;if(this.resolutions){len=this.resolutions.length;this.scales=new Array(len);for(i=0;i<len;i++){this.scales[i]=OpenLayers.Util.getScaleFromResolution(this.resolutions[i],this.units);}
+this.numZoomLevels=len;}
+this.minResolution=minResolution;if(minResolution){this.maxScale=OpenLayers.Util.getScaleFromResolution(minResolution,this.units);}
+this.maxResolution=maxResolution;if(maxResolution){this.minScale=OpenLayers.Util.getScaleFromResolution(maxResolution,this.units);}},resolutionsFromScales:function(scales){if(scales==null){return;}
+var resolutions,i,len;len=scales.length;resolutions=new Array(len);for(i=0;i<len;i++){resolutions[i]=OpenLayers.Util.getResolutionFromScale(scales[i],this.units);}
+return resolutions;},calculateResolutions:function(props){var maxResolution=props.maxResolution;if(props.minScale!=null){maxResolution=OpenLayers.Util.getResolutionFromScale(props.minScale,this.units);}else if(maxResolution=="auto"&&this.maxExtent!=null){var viewSize=this.map.getSize();var wRes=this.maxExtent.getWidth()/viewSize.w;var hRes=this.maxExtent.getHeight()/viewSize.h;maxResolution=Math.max(wRes,hRes);}
+var minResolution=props.minResolution;if(props.maxScale!=null){minResolution=OpenLayers.Util.getResolutionFromScale(props.maxScale,this.units);}else if(props.minResolution=="auto"&&this.minExtent!=null){var viewSize=this.map.getSize();var wRes=this.minExtent.getWidth()/viewSize.w;var hRes=this.minExtent.getHeight()/viewSize.h;minResolution=Math.max(wRes,hRes);}
+var maxZoomLevel=props.maxZoomLevel;var numZoomLevels=props.numZoomLevels;if(typeof minResolution==="number"&&typeof maxResolution==="number"&&numZoomLevels===undefined){var ratio=maxResolution/minResolution;numZoomLevels=Math.floor(Math.log(ratio)/Math.log(2))+1;}else if(numZoomLevels===undefined&&maxZoomLevel!=null){numZoomLevels=maxZoomLevel+1;}
+if(typeof numZoomLevels!=="number"||numZoomLevels<=0||(typeof maxResolution!=="number"&&typeof minResolution!=="number")){return;}
+var resolutions=new Array(numZoomLevels);var base=2;if(typeof minResolution=="number"&&typeof maxResolution=="number"){base=Math.pow((maxResolution/minResolution),(1/(numZoomLevels-1)));}
+var i;if(typeof maxResolution==="number"){for(i=0;i<numZoomLevels;i++){resolutions[i]=maxResolution/Math.pow(base,i);}}else{for(i=0;i<numZoomLevels;i++){resolutions[numZoomLevels-1-i]=minResolution*Math.pow(base,i);}}
+return resolutions;},getResolution:function(){var zoom=this.map.getZoom();return this.getResolutionForZoom(zoom);},getExtent:function(){return this.map.calculateBounds();},getZoomForExtent:function(extent,closest){var viewSize=this.map.getSize();var idealResolution=Math.max(extent.getWidth()/viewSize.w,extent.getHeight()/viewSize.h);return this.getZoomForResolution(idealResolution,closest);},getDataExtent:function(){},getResolutionForZoom:function(zoom){zoom=Math.max(0,Math.min(zoom,this.resolutions.length-1));var resolution;if(this.map.fractionalZoom){var low=Math.floor(zoom);var high=Math.ceil(zoom);resolution=this.resolutions[low]-
+((zoom-low)*(this.resolutions[low]-this.resolutions[high]));}else{resolution=this.resolutions[Math.round(zoom)];}
+return resolution;},getZoomForResolution:function(resolution,closest){var zoom;if(this.map.fractionalZoom){var lowZoom=0;var highZoom=this.resolutions.length-1;var highRes=this.resolutions[lowZoom];var lowRes=this.resolutions[highZoom];var res;for(var i=0,len=this.resolutions.length;i<len;++i){res=this.resolutions[i];if(res>=resolution){highRes=res;lowZoom=i;}
+if(res<=resolution){lowRes=res;highZoom=i;break;}}
+var dRes=highRes-lowRes;if(dRes>0){zoom=lowZoom+((highRes-resolution)/dRes);}else{zoom=lowZoom;}}else{var diff;var minDiff=Number.POSITIVE_INFINITY;for(var i=0,len=this.resolutions.length;i<len;i++){if(closest){diff=Math.abs(this.resolutions[i]-resolution);if(diff>minDiff){break;}
+minDiff=diff;}else{if(this.resolutions[i]<resolution){break;}}}
+zoom=Math.max(0,i-1);}
+return zoom;},getLonLatFromViewPortPx:function(viewPortPx){var lonlat=null;if(viewPortPx!=null){var size=this.map.getSize();var center=this.map.getCenter();if(center){var res=this.map.getResolution();var delta_x=viewPortPx.x-(size.w/2);var delta_y=viewPortPx.y-(size.h/2);lonlat=new OpenLayers.LonLat(center.lon+delta_x*res,center.lat-delta_y*res);if(this.wrapDateLine){lonlat=lonlat.wrapDateLine(this.maxExtent);}}}
+return lonlat;},getViewPortPxFromLonLat:function(lonlat){var px=null;if(lonlat!=null){var resolution=this.map.getResolution();var extent=this.map.getExtent();px=new OpenLayers.Pixel((1/resolution*(lonlat.lon-extent.left)),(1/resolution*(extent.top-lonlat.lat)));}
+return px;},setOpacity:function(opacity){if(opacity!=this.opacity){this.opacity=opacity;for(var i=0,len=this.div.childNodes.length;i<len;++i){var element=this.div.childNodes[i].firstChild;OpenLayers.Util.modifyDOMElement(element,null,null,null,null,null,null,opacity);}
+if(this.map!=null){this.map.events.triggerEvent("changelayer",{layer:this,property:"opacity"});}}},getZIndex:function(){return this.div.style.zIndex;},setZIndex:function(zIndex){this.div.style.zIndex=zIndex;},adjustBounds:function(bounds){if(this.gutter){var mapGutter=this.gutter*this.map.getResolution();bounds=new OpenLayers.Bounds(bounds.left-mapGutter,bounds.bottom-mapGutter,bounds.right+mapGutter,bounds.top+mapGutter);}
+if(this.wrapDateLine){var wrappingOptions={'rightTolerance':this.getResolution()};bounds=bounds.wrapDateLine(this.maxExtent,wrappingOptions);}
+return bounds;},CLASS_NAME:"OpenLayers.Layer"});OpenLayers.Marker.Box=OpenLayers.Class(OpenLayers.Marker,{bounds:null,div:null,initialize:function(bounds,borderColor,borderWidth){this.bounds=bounds;this.div=OpenLayers.Util.createDiv();this.div.style.overflow='hidden';this.events=new OpenLayers.Events(this,this.div,null);this.setBorder(borderColor,borderWidth);},destroy:function(){this.bounds=null;this.div=null;OpenLayers.Marker.prototype.destroy.apply(this,arguments);},setBorder:function(color,width){if(!color){color="red";}
+if(!width){width=2;}
+this.div.style.border=width+"px solid "+color;},draw:function(px,sz){OpenLayers.Util.modifyDOMElement(this.div,null,px,sz);return this.div;},onScreen:function(){var onScreen=false;if(this.map){var screenBounds=this.map.getExtent();onScreen=screenBounds.containsBounds(this.bounds,true,true);}
+return onScreen;},display:function(display){this.div.style.display=(display)?"":"none";},CLASS_NAME:"OpenLayers.Marker.Box"});(function(){var oXMLHttpRequest=window.XMLHttpRequest;var bGecko=!!window.controllers,bIE=window.document.all&&!window.opera,bIE7=bIE&&window.navigator.userAgent.match(/MSIE ([\.0-9]+)/)&&RegExp.$1==7;function cXMLHttpRequest(){this._object=oXMLHttpRequest&&!bIE7?new oXMLHttpRequest:new window.ActiveXObject("Microsoft.XMLHTTP");this._listeners=[];};if(bGecko&&oXMLHttpRequest.wrapped)
+cXMLHttpRequest.wrapped=oXMLHttpRequest.wrapped;cXMLHttpRequest.UNSENT=0;cXMLHttpRequest.OPENED=1;cXMLHttpRequest.HEADERS_RECEIVED=2;cXMLHttpRequest.LOADING=3;cXMLHttpRequest.DONE=4;cXMLHttpRequest.prototype.readyState=cXMLHttpRequest.UNSENT;cXMLHttpRequest.prototype.responseText='';cXMLHttpRequest.prototype.responseXML=null;cXMLHttpRequest.prototype.status=0;cXMLHttpRequest.prototype.statusText='';cXMLHttpRequest.prototype.onreadystatechange=null;cXMLHttpRequest.onreadystatechange=null;cXMLHttpRequest.onopen=null;cXMLHttpRequest.onsend=null;cXMLHttpRequest.onabort=null;cXMLHttpRequest.prototype.open=function(sMethod,sUrl,bAsync,sUser,sPassword){delete this._headers;if(arguments.length<3)
+bAsync=true;this._async=bAsync;var oRequest=this,nState=this.readyState,fOnUnload;if(bIE&&bAsync){fOnUnload=function(){if(nState!=cXMLHttpRequest.DONE){fCleanTransport(oRequest);oRequest.abort();}};window.attachEvent("onunload",fOnUnload);}
+if(cXMLHttpRequest.onopen)
+cXMLHttpRequest.onopen.apply(this,arguments);if(arguments.length>4)
+this._object.open(sMethod,sUrl,bAsync,sUser,sPassword);else
+if(arguments.length>3)
+this._object.open(sMethod,sUrl,bAsync,sUser);else
+this._object.open(sMethod,sUrl,bAsync);if(!bGecko&&!bIE){this.readyState=cXMLHttpRequest.OPENED;fReadyStateChange(this);}
+this._object.onreadystatechange=function(){if(bGecko&&!bAsync)
+return;oRequest.readyState=oRequest._object.readyState;fSynchronizeValues(oRequest);if(oRequest._aborted){oRequest.readyState=cXMLHttpRequest.UNSENT;return;}
+if(oRequest.readyState==cXMLHttpRequest.DONE){fCleanTransport(oRequest);if(bIE&&bAsync)
+window.detachEvent("onunload",fOnUnload);}
+if(nState!=oRequest.readyState)
+fReadyStateChange(oRequest);nState=oRequest.readyState;}};cXMLHttpRequest.prototype.send=function(vData){if(cXMLHttpRequest.onsend)
+cXMLHttpRequest.onsend.apply(this,arguments);if(vData&&vData.nodeType){vData=window.XMLSerializer?new window.XMLSerializer().serializeToString(vData):vData.xml;if(!this._headers["Content-Type"])
+this._object.setRequestHeader("Content-Type","application/xml");}
+this._object.send(vData);if(bGecko&&!this._async){this.readyState=cXMLHttpRequest.OPENED;fSynchronizeValues(this);while(this.readyState<cXMLHttpRequest.DONE){this.readyState++;fReadyStateChange(this);if(this._aborted)
+return;}}};cXMLHttpRequest.prototype.abort=function(){if(cXMLHttpRequest.onabort)
+cXMLHttpRequest.onabort.apply(this,arguments);if(this.readyState>cXMLHttpRequest.UNSENT)
+this._aborted=true;this._object.abort();fCleanTransport(this);};cXMLHttpRequest.prototype.getAllResponseHeaders=function(){return this._object.getAllResponseHeaders();};cXMLHttpRequest.prototype.getResponseHeader=function(sName){return this._object.getResponseHeader(sName);};cXMLHttpRequest.prototype.setRequestHeader=function(sName,sValue){if(!this._headers)
+this._headers={};this._headers[sName]=sValue;return this._object.setRequestHeader(sName,sValue);};cXMLHttpRequest.prototype.addEventListener=function(sName,fHandler,bUseCapture){for(var nIndex=0,oListener;oListener=this._listeners[nIndex];nIndex++)
+if(oListener[0]==sName&&oListener[1]==fHandler&&oListener[2]==bUseCapture)
+return;this._listeners.push([sName,fHandler,bUseCapture]);};cXMLHttpRequest.prototype.removeEventListener=function(sName,fHandler,bUseCapture){for(var nIndex=0,oListener;oListener=this._listeners[nIndex];nIndex++)
+if(oListener[0]==sName&&oListener[1]==fHandler&&oListener[2]==bUseCapture)
+break;if(oListener)
+this._listeners.splice(nIndex,1);};cXMLHttpRequest.prototype.dispatchEvent=function(oEvent){var oEventPseudo={'type':oEvent.type,'target':this,'currentTarget':this,'eventPhase':2,'bubbles':oEvent.bubbles,'cancelable':oEvent.cancelable,'timeStamp':oEvent.timeStamp,'stopPropagation':function(){},'preventDefault':function(){},'initEvent':function(){}};if(oEventPseudo.type=="readystatechange"&&this.onreadystatechange)
+(this.onreadystatechange.handleEvent||this.onreadystatechange).apply(this,[oEventPseudo]);for(var nIndex=0,oListener;oListener=this._listeners[nIndex];nIndex++)
+if(oListener[0]==oEventPseudo.type&&!oListener[2])
+(oListener[1].handleEvent||oListener[1]).apply(this,[oEventPseudo]);};cXMLHttpRequest.prototype.toString=function(){return'['+"object"+' '+"XMLHttpRequest"+']';};cXMLHttpRequest.toString=function(){return'['+"XMLHttpRequest"+']';};function fReadyStateChange(oRequest){if(cXMLHttpRequest.onreadystatechange)
+cXMLHttpRequest.onreadystatechange.apply(oRequest);oRequest.dispatchEvent({'type':"readystatechange",'bubbles':false,'cancelable':false,'timeStamp':new Date+0});};function fGetDocument(oRequest){var oDocument=oRequest.responseXML,sResponse=oRequest.responseText;if(bIE&&sResponse&&oDocument&&!oDocument.documentElement&&oRequest.getResponseHeader("Content-Type").match(/[^\/]+\/[^\+]+\+xml/)){oDocument=new window.ActiveXObject("Microsoft.XMLDOM");oDocument.async=false;oDocument.validateOnParse=false;oDocument.loadXML(sResponse);}
+if(oDocument)
+if((bIE&&oDocument.parseError!=0)||!oDocument.documentElement||(oDocument.documentElement&&oDocument.documentElement.tagName=="parsererror"))
+return null;return oDocument;};function fSynchronizeValues(oRequest){try{oRequest.responseText=oRequest._object.responseText;}catch(e){}
+try{oRequest.responseXML=fGetDocument(oRequest._object);}catch(e){}
+try{oRequest.status=oRequest._object.status;}catch(e){}
+try{oRequest.statusText=oRequest._object.statusText;}catch(e){}};function fCleanTransport(oRequest){oRequest._object.onreadystatechange=new window.Function;};if(!window.Function.prototype.apply){window.Function.prototype.apply=function(oRequest,oArguments){if(!oArguments)
+oArguments=[];oRequest.__func=this;oRequest.__func(oArguments[0],oArguments[1],oArguments[2],oArguments[3],oArguments[4]);delete oRequest.__func;};};OpenLayers.Request.XMLHttpRequest=cXMLHttpRequest;})();OpenLayers.Tile.Image.IFrame=OpenLayers.Class(OpenLayers.Tile.Image,{initialize:function(layer,position,bounds,url,size){OpenLayers.Tile.Image.prototype.initialize.apply(this,arguments);this.layerAlphaHack=false;},destroy:function(){if(this.imgDiv!=null){OpenLayers.Event.stopObservingElement(this.imgDiv.firstChild);}
+OpenLayers.Tile.Image.prototype.destroy.apply(this,arguments);},clear:function(){if(this.imgDiv){var iFrame=this.imgDiv.firstChild;OpenLayers.Event.stopObservingElement(iFrame);this.imgDiv.removeChild(iFrame);}},clone:function(obj){if(obj==null){obj=new OpenLayers.Tile.Image.IFrame(this.layer,this.position,this.bounds,this.url,this.size);}
+obj=OpenLayers.Tile.Image.prototype.clone.apply(this,[obj]);return obj;},renderTile:function(){if(OpenLayers.Tile.Image.prototype.renderTile.apply(this,arguments)){var form=this.createRequestForm();this.imgDiv.appendChild(form);form.submit();this.imgDiv.removeChild(form);}},initImgDiv:function(){this.imgDiv=this.createImgDiv();OpenLayers.Util.modifyDOMElement(this.imgDiv,this.id,null,this.layer.getImageSize(),"relative");this.imgDiv.className='olTileImage';this.frame.appendChild(this.imgDiv);this.layer.div.appendChild(this.frame);if(this.layer.opacity!=null){OpenLayers.Util.modifyDOMElement(this.imgDiv,null,null,null,null,null,null,this.layer.opacity);}
+this.imgDiv.map=this.layer.map;},createImgDiv:function(){var eventPane=document.createElement("div");if(OpenLayers.Util.getBrowserName()=="msie"){eventPane.style.backgroundColor='#FFFFFF';eventPane.style.filter='chroma(color=#FFFFFF)';}
+OpenLayers.Util.modifyDOMElement(eventPane,null,new OpenLayers.Pixel(0,0),this.layer.getImageSize(),"absolute");var imgDiv=document.createElement("div");imgDiv.appendChild(eventPane);return imgDiv;},createIFrame:function(){var id=this.id+'_iFrame';var iframe;if(OpenLayers.Util.getBrowserName()=="msie"){iframe=document.createElement('<iframe name="'+id+'">');iframe.style.backgroundColor='#FFFFFF';iframe.style.filter='chroma(color=#FFFFFF)';}
+else{iframe=document.createElement('iframe');iframe.style.backgroundColor='transparent';iframe.name=id;}
+iframe.id=id;iframe.scrolling='no';iframe.marginWidth='0px';iframe.marginHeight='0px';iframe.frameBorder='0';OpenLayers.Util.modifyDOMElement(iframe,id,new OpenLayers.Pixel(0,0),this.layer.getImageSize(),"absolute");var onload=function(){this.show();if(this.isLoading){this.isLoading=false;this.events.triggerEvent("loadend");}};OpenLayers.Event.observe(iframe,'load',OpenLayers.Function.bind(onload,this));return iframe;},createRequestForm:function(){var form=document.createElement('form');form.method='POST';var cacheId=this.layer.params["_OLSALT"];cacheId=(cacheId?cacheId+"_":"")+this.bounds.toBBOX();form.action=OpenLayers.Util.urlAppend(this.layer.url,cacheId);this.imgDiv.insertBefore(this.createIFrame(),this.imgDiv.firstChild);form.target=this.id+'_iFrame';var imageSize=this.layer.getImageSize();var params=OpenLayers.Util.extend({"BBOX":this.encodeBBOX?this.bounds.toBBOX():this.bounds.toArray(),"WIDTH":imageSize.w,"HEIGHT":imageSize.h},this.layer.params);for(var par in params){var field=document.createElement('input');field.type='hidden';field.name=par;field.value=params[par];form.appendChild(field);}
+return form;},CLASS_NAME:"OpenLayers.Tile.Image.IFrame"});OpenLayers.ProxyHost="";OpenLayers.nullHandler=function(request){OpenLayers.Console.userError(OpenLayers.i18n("unhandledRequest",{'statusText':request.statusText}));};OpenLayers.loadURL=function(uri,params,caller,onComplete,onFailure){if(typeof params=='string'){params=OpenLayers.Util.getParameters(params);}
+var success=(onComplete)?onComplete:OpenLayers.nullHandler;var failure=(onFailure)?onFailure:OpenLayers.nullHandler;return OpenLayers.Request.GET({url:uri,params:params,success:success,failure:failure,scope:caller});};OpenLayers.parseXMLString=function(text){var index=text.indexOf('<');if(index>0){text=text.substring(index);}
+var ajaxResponse=OpenLayers.Util.Try(function(){var xmldom=new ActiveXObject('Microsoft.XMLDOM');xmldom.loadXML(text);return xmldom;},function(){return new DOMParser().parseFromString(text,'text/xml');},function(){var req=new XMLHttpRequest();req.open("GET","data:"+"text/xml"+";charset=utf-8,"+encodeURIComponent(text),false);if(req.overrideMimeType){req.overrideMimeType("text/xml");}
+req.send(null);return req.responseXML;});return ajaxResponse;};OpenLayers.Ajax={emptyFunction:function(){},getTransport:function(){return OpenLayers.Util.Try(function(){return new XMLHttpRequest();},function(){return new ActiveXObject('Msxml2.XMLHTTP');},function(){return new ActiveXObject('Microsoft.XMLHTTP');})||false;},activeRequestCount:0};OpenLayers.Ajax.Responders={responders:[],register:function(responderToAdd){for(var i=0;i<this.responders.length;i++){if(responderToAdd==this.responders[i]){return;}}
+this.responders.push(responderToAdd);},unregister:function(responderToRemove){OpenLayers.Util.removeItem(this.reponders,responderToRemove);},dispatch:function(callback,request,transport){var responder;for(var i=0;i<this.responders.length;i++){responder=this.responders[i];if(responder[callback]&&typeof responder[callback]=='function'){try{responder[callback].apply(responder,[request,transport]);}catch(e){}}}}};OpenLayers.Ajax.Responders.register({onCreate:function(){OpenLayers.Ajax.activeRequestCount++;},onComplete:function(){OpenLayers.Ajax.activeRequestCount--;}});OpenLayers.Ajax.Base=OpenLayers.Class({initialize:function(options){this.options={method:'post',asynchronous:true,contentType:'application/xml',parameters:''};OpenLayers.Util.extend(this.options,options||{});this.options.method=this.options.method.toLowerCase();if(typeof this.options.parameters=='string'){this.options.parameters=OpenLayers.Util.getParameters(this.options.parameters);}}});OpenLayers.Ajax.Request=OpenLayers.Class(OpenLayers.Ajax.Base,{_complete:false,initialize:function(url,options){OpenLayers.Ajax.Base.prototype.initialize.apply(this,[options]);if(OpenLayers.ProxyHost&&OpenLayers.String.startsWith(url,"http")){url=OpenLayers.ProxyHost+encodeURIComponent(url);}
+this.transport=OpenLayers.Ajax.getTransport();this.request(url);},request:function(url){this.url=url;this.method=this.options.method;var params=OpenLayers.Util.extend({},this.options.parameters);if(this.method!='get'&&this.method!='post'){params['_method']=this.method;this.method='post';}
+this.parameters=params;if(params=OpenLayers.Util.getParameterString(params)){if(this.method=='get'){this.url+=((this.url.indexOf('?')>-1)?'&':'?')+params;}else if(/Konqueror|Safari|KHTML/.test(navigator.userAgent)){params+='&_=';}}
+try{var response=new OpenLayers.Ajax.Response(this);if(this.options.onCreate){this.options.onCreate(response);}
+OpenLayers.Ajax.Responders.dispatch('onCreate',this,response);this.transport.open(this.method.toUpperCase(),this.url,this.options.asynchronous);if(this.options.asynchronous){window.setTimeout(OpenLayers.Function.bind(this.respondToReadyState,this,1),10);}
+this.transport.onreadystatechange=OpenLayers.Function.bind(this.onStateChange,this);this.setRequestHeaders();this.body=this.method=='post'?(this.options.postBody||params):null;this.transport.send(this.body);if(!this.options.asynchronous&&this.transport.overrideMimeType){this.onStateChange();}}catch(e){this.dispatchException(e);}},onStateChange:function(){var readyState=this.transport.readyState;if(readyState>1&&!((readyState==4)&&this._complete)){this.respondToReadyState(this.transport.readyState);}},setRequestHeaders:function(){var headers={'X-Requested-With':'XMLHttpRequest','Accept':'text/javascript, text/html, application/xml, text/xml, */*','OpenLayers':true};if(this.method=='post'){headers['Content-type']=this.options.contentType+
+(this.options.encoding?'; charset='+this.options.encoding:'');if(this.transport.overrideMimeType&&(navigator.userAgent.match(/Gecko\/(\d{4})/)||[0,2005])[1]<2005){headers['Connection']='close';}}
+if(typeof this.options.requestHeaders=='object'){var extras=this.options.requestHeaders;if(typeof extras.push=='function'){for(var i=0,length=extras.length;i<length;i+=2){headers[extras[i]]=extras[i+1];}}else{for(var i in extras){headers[i]=extras[i];}}}
+for(var name in headers){this.transport.setRequestHeader(name,headers[name]);}},success:function(){var status=this.getStatus();return!status||(status>=200&&status<300);},getStatus:function(){try{return this.transport.status||0;}catch(e){return 0;}},respondToReadyState:function(readyState){var state=OpenLayers.Ajax.Request.Events[readyState];var response=new OpenLayers.Ajax.Response(this);if(state=='Complete'){try{this._complete=true;(this.options['on'+response.status]||this.options['on'+(this.success()?'Success':'Failure')]||OpenLayers.Ajax.emptyFunction)(response);}catch(e){this.dispatchException(e);}
+var contentType=response.getHeader('Content-type');}
+try{(this.options['on'+state]||OpenLayers.Ajax.emptyFunction)(response);OpenLayers.Ajax.Responders.dispatch('on'+state,this,response);}catch(e){this.dispatchException(e);}
+if(state=='Complete'){this.transport.onreadystatechange=OpenLayers.Ajax.emptyFunction;}},getHeader:function(name){try{return this.transport.getResponseHeader(name);}catch(e){return null;}},dispatchException:function(exception){var handler=this.options.onException;if(handler){handler(this,exception);OpenLayers.Ajax.Responders.dispatch('onException',this,exception);}else{var listener=false;var responders=OpenLayers.Ajax.Responders.responders;for(var i=0;i<responders.length;i++){if(responders[i].onException){listener=true;break;}}
+if(listener){OpenLayers.Ajax.Responders.dispatch('onException',this,exception);}else{throw exception;}}}});OpenLayers.Ajax.Request.Events=['Uninitialized','Loading','Loaded','Interactive','Complete'];OpenLayers.Ajax.Response=OpenLayers.Class({status:0,statusText:'',initialize:function(request){this.request=request;var transport=this.transport=request.transport,readyState=this.readyState=transport.readyState;if((readyState>2&&!(!!(window.attachEvent&&!window.opera)))||readyState==4){this.status=this.getStatus();this.statusText=this.getStatusText();this.responseText=transport.responseText==null?'':String(transport.responseText);}
+if(readyState==4){var xml=transport.responseXML;this.responseXML=xml===undefined?null:xml;}},getStatus:OpenLayers.Ajax.Request.prototype.getStatus,getStatusText:function(){try{return this.transport.statusText||'';}catch(e){return'';}},getHeader:OpenLayers.Ajax.Request.prototype.getHeader,getResponseHeader:function(name){return this.transport.getResponseHeader(name);}});OpenLayers.Ajax.getElementsByTagNameNS=function(parentnode,nsuri,nsprefix,tagname){var elem=null;if(parentnode.getElementsByTagNameNS){elem=parentnode.getElementsByTagNameNS(nsuri,tagname);}else{elem=parentnode.getElementsByTagName(nsprefix+':'+tagname);}
+return elem;};OpenLayers.Ajax.serializeXMLToString=function(xmldom){var serializer=new XMLSerializer();var data=serializer.serializeToString(xmldom);return data;};OpenLayers.Control.DragFeature=OpenLayers.Class(OpenLayers.Control,{geometryTypes:null,onStart:function(feature,pixel){},onDrag:function(feature,pixel){},onComplete:function(feature,pixel){},documentDrag:false,layer:null,feature:null,dragCallbacks:{},featureCallbacks:{},lastPixel:null,initialize:function(layer,options){OpenLayers.Control.prototype.initialize.apply(this,[options]);this.layer=layer;this.handlers={drag:new OpenLayers.Handler.Drag(this,OpenLayers.Util.extend({down:this.downFeature,move:this.moveFeature,up:this.upFeature,out:this.cancel,done:this.doneDragging},this.dragCallbacks),{documentDrag:this.documentDrag}),feature:new OpenLayers.Handler.Feature(this,this.layer,OpenLayers.Util.extend({over:this.overFeature,out:this.outFeature},this.featureCallbacks),{geometryTypes:this.geometryTypes})};},destroy:function(){this.layer=null;OpenLayers.Control.prototype.destroy.apply(this,[]);},activate:function(){return(this.handlers.feature.activate()&&OpenLayers.Control.prototype.activate.apply(this,arguments));},deactivate:function(){this.handlers.drag.deactivate();this.handlers.feature.deactivate();this.feature=null;this.dragging=false;this.lastPixel=null;OpenLayers.Element.removeClass(this.map.viewPortDiv,this.displayClass+"Over");return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},overFeature:function(feature){if(!this.handlers.drag.dragging){this.feature=feature;this.handlers.drag.activate();this.over=true;OpenLayers.Element.addClass(this.map.viewPortDiv,this.displayClass+"Over");}else{if(this.feature.id==feature.id){this.over=true;}else{this.over=false;}}},downFeature:function(pixel){this.lastPixel=pixel;this.onStart(this.feature,pixel);},moveFeature:function(pixel){var res=this.map.getResolution();this.feature.geometry.move(res*(pixel.x-this.lastPixel.x),res*(this.lastPixel.y-pixel.y));this.layer.drawFeature(this.feature);this.lastPixel=pixel;this.onDrag(this.feature,pixel);},upFeature:function(pixel){if(!this.over){this.handlers.drag.deactivate();}},doneDragging:function(pixel){this.onComplete(this.feature,pixel);},outFeature:function(feature){if(!this.handlers.drag.dragging){this.over=false;this.handlers.drag.deactivate();OpenLayers.Element.removeClass(this.map.viewPortDiv,this.displayClass+"Over");this.feature=null;}else{if(this.feature.id==feature.id){this.over=false;}}},cancel:function(){this.handlers.drag.deactivate();this.over=false;},setMap:function(map){this.handlers.drag.setMap(map);this.handlers.feature.setMap(map);OpenLayers.Control.prototype.setMap.apply(this,arguments);},CLASS_NAME:"OpenLayers.Control.DragFeature"});OpenLayers.Control.DragPan=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_TOOL,panned:false,interval:25,documentDrag:false,draw:function(){this.handler=new OpenLayers.Handler.Drag(this,{"move":this.panMap,"done":this.panMapDone},{interval:this.interval,documentDrag:this.documentDrag});},panMap:function(xy){this.panned=true;this.map.pan(this.handler.last.x-xy.x,this.handler.last.y-xy.y,{dragging:this.handler.dragging,animate:false});},panMapDone:function(xy){if(this.panned){this.panMap(xy);this.panned=false;}},CLASS_NAME:"OpenLayers.Control.DragPan"});OpenLayers.Control.KeyboardDefaults=OpenLayers.Class(OpenLayers.Control,{autoActivate:true,slideFactor:75,initialize:function(){OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){if(this.handler){this.handler.destroy();}
+this.handler=null;OpenLayers.Control.prototype.destroy.apply(this,arguments);},draw:function(){this.handler=new OpenLayers.Handler.Keyboard(this,{"keydown":this.defaultKeyPress});},defaultKeyPress:function(evt){switch(evt.keyCode){case OpenLayers.Event.KEY_LEFT:this.map.pan(-this.slideFactor,0);break;case OpenLayers.Event.KEY_RIGHT:this.map.pan(this.slideFactor,0);break;case OpenLayers.Event.KEY_UP:this.map.pan(0,-this.slideFactor);break;case OpenLayers.Event.KEY_DOWN:this.map.pan(0,this.slideFactor);break;case 33:var size=this.map.getSize();this.map.pan(0,-0.75*size.h);break;case 34:var size=this.map.getSize();this.map.pan(0,0.75*size.h);break;case 35:var size=this.map.getSize();this.map.pan(0.75*size.w,0);break;case 36:var size=this.map.getSize();this.map.pan(-0.75*size.w,0);break;case 43:case 61:case 187:case 107:this.map.zoomIn();break;case 45:case 109:case 189:case 95:this.map.zoomOut();break;}},CLASS_NAME:"OpenLayers.Control.KeyboardDefaults"});OpenLayers.Control.WMSGetFeatureInfo=OpenLayers.Class(OpenLayers.Control,{hover:false,drillDown:false,maxFeatures:10,clickCallback:"click",layers:null,queryVisible:false,url:null,layerUrls:null,infoFormat:'text/html',vendorParams:{},format:null,formatOptions:null,handlerOptions:null,handler:null,hoverRequest:null,EVENT_TYPES:["beforegetfeatureinfo","nogetfeatureinfo","getfeatureinfo"],initialize:function(options){this.EVENT_TYPES=OpenLayers.Control.WMSGetFeatureInfo.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);options=options||{};options.handlerOptions=options.handlerOptions||{};OpenLayers.Control.prototype.initialize.apply(this,[options]);if(!this.format){this.format=new OpenLayers.Format.WMSGetFeatureInfo(options.formatOptions);}
+if(this.drillDown===true){this.hover=false;}
+if(this.hover){this.handler=new OpenLayers.Handler.Hover(this,{'move':this.cancelHover,'pause':this.getInfoForHover},OpenLayers.Util.extend(this.handlerOptions.hover||{},{'delay':250}));}else{var callbacks={};callbacks[this.clickCallback]=this.getInfoForClick;this.handler=new OpenLayers.Handler.Click(this,callbacks,this.handlerOptions.click||{});}},activate:function(){if(!this.active){this.handler.activate();}
+return OpenLayers.Control.prototype.activate.apply(this,arguments);},deactivate:function(){return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},getInfoForClick:function(evt){this.events.triggerEvent("beforegetfeatureinfo",{xy:evt.xy});OpenLayers.Element.addClass(this.map.viewPortDiv,"olCursorWait");this.request(evt.xy,{});},getInfoForHover:function(evt){this.events.triggerEvent("beforegetfeatureinfo",{xy:evt.xy});this.request(evt.xy,{hover:true});},cancelHover:function(){if(this.hoverRequest){this.hoverRequest.abort();this.hoverRequest=null;}},findLayers:function(){var candidates=this.layers||this.map.layers;var layers=[];var layer,url;for(var i=0,len=candidates.length;i<len;++i){layer=candidates[i];if(layer instanceof OpenLayers.Layer.WMS&&(!this.queryVisible||layer.getVisibility())){url=layer.url instanceof Array?layer.url[0]:layer.url;if(this.drillDown===false&&!this.url){this.url=url;}
+if(this.drillDown===true||this.urlMatches(url)){layers.push(layer);}}}
+return layers;},urlMatches:function(url){var matches=OpenLayers.Util.isEquivalentUrl(this.url,url);if(!matches&&this.layerUrls){for(var i=0,len=this.layerUrls.length;i<len;++i){if(OpenLayers.Util.isEquivalentUrl(this.layerUrls[i],url)){matches=true;break;}}}
+return matches;},buildWMSOptions:function(url,layers,clickPosition,format){var layerNames=[],styleNames=[];for(var i=0,len=layers.length;i<len;i++){layerNames=layerNames.concat(layers[i].params.LAYERS);styleNames=styleNames.concat(this.getStyleNames(layers[i]));}
+var params=OpenLayers.Util.extend({service:"WMS",version:layers[0].params.VERSION,request:"GetFeatureInfo",layers:layerNames,query_layers:layerNames,styles:styleNames,bbox:this.map.getExtent().toBBOX(null,layers[0].reverseAxisOrder()),feature_count:this.maxFeatures,height:this.map.getSize().h,width:this.map.getSize().w,format:format,info_format:this.infoFormat},(parseFloat(layers[0].params.VERSION)>=1.3)?{crs:this.map.getProjection(),i:clickPosition.x,j:clickPosition.y}:{srs:this.map.getProjection(),x:clickPosition.x,y:clickPosition.y});OpenLayers.Util.applyDefaults(params,this.vendorParams);return{url:url,params:OpenLayers.Util.upperCaseObject(params),callback:function(request){this.handleResponse(clickPosition,request);},scope:this};},getStyleNames:function(layer){var styleNames;if(layer.params.STYLES){styleNames=layer.params.STYLES;}else{if(layer.params.LAYERS instanceof Array){styleNames=new Array(layer.params.LAYERS.length);}else{styleNames=layer.params.LAYERS.replace(/[^,]/g,"");}}
+return styleNames;},request:function(clickPosition,options){var layers=this.findLayers();if(layers.length==0){this.events.triggerEvent("nogetfeatureinfo");OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");return;}
+options=options||{};if(this.drillDown===false){var wmsOptions=this.buildWMSOptions(this.url,layers,clickPosition,layers[0].params.FORMAT);var request=OpenLayers.Request.GET(wmsOptions);if(options.hover===true){this.hoverRequest=request;}}else{this._requestCount=0;this._numRequests=0;this.features=[];var services={},url;for(var i=0,len=layers.length;i<len;i++){var layer=layers[i];var service,found=false;url=layer.url instanceof Array?layer.url[0]:layer.url;if(url in services){services[url].push(layer);}else{this._numRequests++;services[url]=[layer];}}
+var layers;for(var url in services){layers=services[url];var wmsOptions=this.buildWMSOptions(url,layers,clickPosition,layers[0].params.FORMAT);OpenLayers.Request.GET(wmsOptions);}}},triggerGetFeatureInfo:function(request,xy,features){this.events.triggerEvent("getfeatureinfo",{text:request.responseText,features:features,request:request,xy:xy});OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");},handleResponse:function(xy,request){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+var features=this.format.read(doc);if(this.drillDown===false){this.triggerGetFeatureInfo(request,xy,features);}else{this._requestCount++;this._features=(this._features||[]).concat(features);if(this._requestCount===this._numRequests){this.triggerGetFeatureInfo(request,xy,this._features.concat());delete this._features;delete this._requestCount;delete this._numRequests;}}},CLASS_NAME:"OpenLayers.Control.WMSGetFeatureInfo"});OpenLayers.Control.WMTSGetFeatureInfo=OpenLayers.Class(OpenLayers.Control,{hover:false,requestEncoding:"KVP",drillDown:false,maxFeatures:10,clickCallback:"click",layers:null,queryVisible:true,infoFormat:'text/html',vendorParams:{},format:null,formatOptions:null,handlerOptions:null,handler:null,hoverRequest:null,EVENT_TYPES:["beforegetfeatureinfo","getfeatureinfo","exception"],pending:0,initialize:function(options){this.EVENT_TYPES=OpenLayers.Control.WMTSGetFeatureInfo.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);options=options||{};options.handlerOptions=options.handlerOptions||{};OpenLayers.Control.prototype.initialize.apply(this,[options]);if(!this.format){this.format=new OpenLayers.Format.WMSGetFeatureInfo(options.formatOptions);}
+if(this.drillDown===true){this.hover=false;}
+if(this.hover){this.handler=new OpenLayers.Handler.Hover(this,{move:this.cancelHover,pause:this.getInfoForHover},OpenLayers.Util.extend(this.handlerOptions.hover||{},{delay:250}));}else{var callbacks={};callbacks[this.clickCallback]=this.getInfoForClick;this.handler=new OpenLayers.Handler.Click(this,callbacks,this.handlerOptions.click||{});}},activate:function(){if(!this.active){this.handler.activate();}
+return OpenLayers.Control.prototype.activate.apply(this,arguments);},deactivate:function(){return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},getInfoForClick:function(evt){this.request(evt.xy,{});},getInfoForHover:function(evt){this.request(evt.xy,{hover:true});},cancelHover:function(){if(this.hoverRequest){--this.pending;if(this.pending<=0){OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");this.pending=0;}
+this.hoverRequest.abort();this.hoverRequest=null;}},findLayers:function(){var candidates=this.layers||this.map.layers;var layers=[];var layer;for(var i=candidates.length-1;i>=0;--i){layer=candidates[i];if(layer instanceof OpenLayers.Layer.WMTS&&layer.requestEncoding===this.requestEncoding&&(!this.queryVisible||layer.getVisibility())){layers.push(layer);if(!this.drillDown||this.hover){break;}}}
+return layers;},buildRequestOptions:function(layer,xy){var loc=this.map.getLonLatFromPixel(xy);var getTileUrl=layer.getURL(new OpenLayers.Bounds(loc.lon,loc.lat,loc.lon,loc.lat));var params=OpenLayers.Util.getParameters(getTileUrl);var tileInfo=layer.getTileInfo(loc);OpenLayers.Util.extend(params,{service:"WMTS",version:layer.version,request:"GetFeatureInfo",infoFormat:this.infoFormat,i:tileInfo.i,j:tileInfo.j});OpenLayers.Util.applyDefaults(params,this.vendorParams);return{url:layer.url instanceof Array?layer.url[0]:layer.url,params:OpenLayers.Util.upperCaseObject(params),callback:function(request){this.handleResponse(xy,request,layer);},scope:this};},request:function(xy,options){options=options||{};var layers=this.findLayers();if(layers.length>0){var issue,layer;for(var i=0,len=layers.length;i<len;i++){layer=layers[i];issue=this.events.triggerEvent("beforegetfeatureinfo",{xy:xy,layer:layer});if(issue!==false){++this.pending;var requestOptions=this.buildRequestOptions(layer,xy);var request=OpenLayers.Request.GET(requestOptions);if(options.hover===true){this.hoverRequest=request;}}}
+if(this.pending>0){OpenLayers.Element.addClass(this.map.viewPortDiv,"olCursorWait");}}},handleResponse:function(xy,request,layer){--this.pending;if(this.pending<=0){OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");this.pending=0;}
+if(request.status&&(request.status<200||request.status>=300)){this.events.triggerEvent("exception",{xy:xy,request:request,layer:layer});}else{var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+var features,except;try{features=this.format.read(doc);}catch(error){except=true;this.events.triggerEvent("exception",{xy:xy,request:request,error:error,layer:layer});}
+if(!except){this.events.triggerEvent("getfeatureinfo",{text:request.responseText,features:features,request:request,xy:xy,layer:layer});}}},setMap:function(map){this.handler.setMap(map);OpenLayers.Control.prototype.setMap.apply(this,arguments);},CLASS_NAME:"OpenLayers.Control.WMTSGetFeatureInfo"});OpenLayers.State={UNKNOWN:'Unknown',INSERT:'Insert',UPDATE:'Update',DELETE:'Delete'};OpenLayers.Feature.Vector=OpenLayers.Class(OpenLayers.Feature,{fid:null,geometry:null,attributes:null,bounds:null,state:null,style:null,url:null,renderIntent:"default",initialize:function(geometry,attributes,style){OpenLayers.Feature.prototype.initialize.apply(this,[null,null,attributes]);this.lonlat=null;this.geometry=geometry?geometry:null;this.state=null;this.attributes={};if(attributes){this.attributes=OpenLayers.Util.extend(this.attributes,attributes);}
+this.style=style?style:null;},destroy:function(){if(this.layer){this.layer.removeFeatures(this);this.layer=null;}
+this.geometry=null;OpenLayers.Feature.prototype.destroy.apply(this,arguments);},clone:function(){return new OpenLayers.Feature.Vector(this.geometry?this.geometry.clone():null,this.attributes,this.style);},onScreen:function(boundsOnly){var onScreen=false;if(this.layer&&this.layer.map){var screenBounds=this.layer.map.getExtent();if(boundsOnly){var featureBounds=this.geometry.getBounds();onScreen=screenBounds.intersectsBounds(featureBounds);}else{var screenPoly=screenBounds.toGeometry();onScreen=screenPoly.intersects(this.geometry);}}
+return onScreen;},getVisibility:function(){return!(this.style&&this.style.display=='none'||!this.layer||this.layer&&this.layer.styleMap&&this.layer.styleMap.createSymbolizer(this,this.renderIntent).display=='none'||this.layer&&!this.layer.getVisibility());},createMarker:function(){return null;},destroyMarker:function(){},createPopup:function(){return null;},atPoint:function(lonlat,toleranceLon,toleranceLat){var atPoint=false;if(this.geometry){atPoint=this.geometry.atPoint(lonlat,toleranceLon,toleranceLat);}
+return atPoint;},destroyPopup:function(){},move:function(location){if(!this.layer||!this.geometry.move){return;}
+var pixel;if(location.CLASS_NAME=="OpenLayers.LonLat"){pixel=this.layer.getViewPortPxFromLonLat(location);}else{pixel=location;}
+var lastPixel=this.layer.getViewPortPxFromLonLat(this.geometry.getBounds().getCenterLonLat());var res=this.layer.map.getResolution();this.geometry.move(res*(pixel.x-lastPixel.x),res*(lastPixel.y-pixel.y));this.layer.drawFeature(this);return lastPixel;},toState:function(state){if(state==OpenLayers.State.UPDATE){switch(this.state){case OpenLayers.State.UNKNOWN:case OpenLayers.State.DELETE:this.state=state;break;case OpenLayers.State.UPDATE:case OpenLayers.State.INSERT:break;}}else if(state==OpenLayers.State.INSERT){switch(this.state){case OpenLayers.State.UNKNOWN:break;default:this.state=state;break;}}else if(state==OpenLayers.State.DELETE){switch(this.state){case OpenLayers.State.INSERT:break;case OpenLayers.State.DELETE:break;case OpenLayers.State.UNKNOWN:case OpenLayers.State.UPDATE:this.state=state;break;}}else if(state==OpenLayers.State.UNKNOWN){this.state=state;}},CLASS_NAME:"OpenLayers.Feature.Vector"});OpenLayers.Feature.Vector.style={'default':{fillColor:"#ee9900",fillOpacity:0.4,hoverFillColor:"white",hoverFillOpacity:0.8,strokeColor:"#ee9900",strokeOpacity:1,strokeWidth:1,strokeLinecap:"round",strokeDashstyle:"solid",hoverStrokeColor:"red",hoverStrokeOpacity:1,hoverStrokeWidth:0.2,pointRadius:6,hoverPointRadius:1,hoverPointUnit:"%",pointerEvents:"visiblePainted",cursor:"inherit"},'select':{fillColor:"blue",fillOpacity:0.4,hoverFillColor:"white",hoverFillOpacity:0.8,strokeColor:"blue",strokeOpacity:1,strokeWidth:2,strokeLinecap:"round",strokeDashstyle:"solid",hoverStrokeColor:"red",hoverStrokeOpacity:1,hoverStrokeWidth:0.2,pointRadius:6,hoverPointRadius:1,hoverPointUnit:"%",pointerEvents:"visiblePainted",cursor:"pointer"},'temporary':{fillColor:"#66cccc",fillOpacity:0.2,hoverFillColor:"white",hoverFillOpacity:0.8,strokeColor:"#66cccc",strokeOpacity:1,strokeLinecap:"round",strokeWidth:2,strokeDashstyle:"solid",hoverStrokeColor:"red",hoverStrokeOpacity:1,hoverStrokeWidth:0.2,pointRadius:6,hoverPointRadius:1,hoverPointUnit:"%",pointerEvents:"visiblePainted",cursor:"inherit"},'delete':{display:"none"}};OpenLayers.Feature.WFS=OpenLayers.Class(OpenLayers.Feature,{initialize:function(layer,xmlNode){var newArguments=arguments;var data=this.processXMLNode(xmlNode);newArguments=new Array(layer,data.lonlat,data);OpenLayers.Feature.prototype.initialize.apply(this,newArguments);this.createMarker();this.layer.addMarker(this.marker);},destroy:function(){if(this.marker!=null){this.layer.removeMarker(this.marker);}
+OpenLayers.Feature.prototype.destroy.apply(this,arguments);},processXMLNode:function(xmlNode){var point=OpenLayers.Ajax.getElementsByTagNameNS(xmlNode,"http://www.opengis.net/gml","gml","Point");var text=OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(point[0],"http://www.opengis.net/gml","gml","coordinates")[0]);var floats=text.split(",");return{lonlat:new OpenLayers.LonLat(parseFloat(floats[0]),parseFloat(floats[1])),id:null};},CLASS_NAME:"OpenLayers.Feature.WFS"});OpenLayers.Format.OWSCommon.v1_0_0=OpenLayers.Class(OpenLayers.Format.OWSCommon.v1,{namespaces:{ows:"http://www.opengis.net/ows/1.0",xlink:"http://www.w3.org/1999/xlink"},readers:{"ows":OpenLayers.Format.OWSCommon.v1.prototype.readers["ows"]},writers:{"ows":OpenLayers.Format.OWSCommon.v1.prototype.writers["ows"]},CLASS_NAME:"OpenLayers.Format.OWSCommon.v1_1_0"});OpenLayers.Format.OWSCommon.v1_1_0=OpenLayers.Class(OpenLayers.Format.OWSCommon.v1,{namespaces:{ows:"http://www.opengis.net/ows/1.1",xlink:"http://www.w3.org/1999/xlink"},readers:{"ows":OpenLayers.Util.applyDefaults({"AllowedValues":function(node,parameter){parameter.allowedValues={};this.readChildNodes(node,parameter.allowedValues);},"AnyValue":function(node,parameter){parameter.anyValue=true;},"Range":function(node,allowedValues){allowedValues.range={};this.readChildNodes(node,allowedValues.range);},"MinimumValue":function(node,range){range.minValue=this.getChildValue(node);},"MaximumValue":function(node,range){range.maxValue=this.getChildValue(node);},"Identifier":function(node,obj){obj.identifier=this.getChildValue(node);},"SupportedCRS":function(node,obj){obj.supportedCRS=this.getChildValue(node);}},OpenLayers.Format.OWSCommon.v1.prototype.readers["ows"])},CLASS_NAME:"OpenLayers.Format.OWSCommon.v1_1_0"});OpenLayers.Format.OWSContext=OpenLayers.Class(OpenLayers.Format.Context,{defaultVersion:"0.3.1",getParser:function(version){var v=version||this.version||this.defaultVersion;if(v==="0.3.0"){v=this.defaultVersion;}
+if(!this.parser||this.parser.VERSION!=v){var format=OpenLayers.Format.OWSContext["v"+v.replace(/\./g,"_")];if(!format){throw"Can't find a OWSContext parser for version "+v;}
+this.parser=new format(this.options);}
+return this.parser;},toContext:function(obj){var context={};if(obj.CLASS_NAME=="OpenLayers.Map"){context.bounds=obj.getExtent();context.maxExtent=obj.maxExtent;context.projection=obj.projection;context.size=obj.getSize();context.layers=obj.layers;}
+return context;},CLASS_NAME:"OpenLayers.Format.OWSContext"});OpenLayers.Format.WFSCapabilities.v1=OpenLayers.Class(OpenLayers.Format.WFSCapabilities,{initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var capabilities={};var root=data.documentElement;this.runChildNodes(capabilities,root);return capabilities;},runChildNodes:function(obj,node){var children=node.childNodes;var childNode,processor;for(var i=0;i<children.length;++i){childNode=children[i];if(childNode.nodeType==1){processor=this["read_cap_"+childNode.nodeName];if(processor){processor.apply(this,[obj,childNode]);}}}},read_cap_FeatureTypeList:function(request,node){var featureTypeList={featureTypes:[]};this.runChildNodes(featureTypeList,node);request.featureTypeList=featureTypeList;},read_cap_FeatureType:function(featureTypeList,node,parentLayer){var featureType={};this.runChildNodes(featureType,node);featureTypeList.featureTypes.push(featureType);},read_cap_Name:function(obj,node){var name=this.getChildValue(node);if(name){var parts=name.split(":");obj.name=parts.pop();if(parts.length>0){obj.featureNS=this.lookupNamespaceURI(node,parts[0]);}}},read_cap_Title:function(obj,node){var title=this.getChildValue(node);if(title){obj.title=title;}},read_cap_Abstract:function(obj,node){var abst=this.getChildValue(node);if(abst){obj["abstract"]=abst;}},CLASS_NAME:"OpenLayers.Format.WFSCapabilities.v1"});OpenLayers.Format.WMC=OpenLayers.Class(OpenLayers.Format.Context,{defaultVersion:"1.1.0",getParser:function(version){var v=version||this.version||this.defaultVersion;if(!this.parser||this.parser.VERSION!=v){var format=OpenLayers.Format.WMC["v"+v.replace(/\./g,"_")];if(!format){throw"Can't find a WMC parser for version "+v;}
+this.parser=new format(this.options);}
+return this.parser;},layerToContext:function(layer){var parser=this.getParser();var layerContext={queryable:layer.queryable,visibility:layer.visibility,name:layer.params["LAYERS"],title:layer.name,metadataURL:layer.metadataURL,version:layer.params["VERSION"],url:layer.url,maxExtent:layer.maxExtent,transparent:layer.params["TRANSPARENT"],numZoomLevels:layer.numZoomLevels,units:layer.units,isBaseLayer:layer.isBaseLayer,opacity:layer.opacity,displayInLayerSwitcher:layer.displayInLayerSwitcher,singleTile:layer.singleTile,tileSize:(layer.singleTile||!layer.tileSize)?undefined:{width:layer.tileSize.w,height:layer.tileSize.h},minScale:(layer.options.resolutions||layer.options.scales||layer.options.maxResolution||layer.options.minScale)?layer.minScale:undefined,maxScale:(layer.options.resolutions||layer.options.scales||layer.options.minResolution||layer.options.maxScale)?layer.maxScale:undefined,formats:[{value:layer.params["FORMAT"],current:true}],styles:[{href:layer.params["SLD"],body:layer.params["SLD_BODY"],name:layer.params["STYLES"]||parser.defaultStyleName,title:parser.defaultStyleTitle,current:true}]};return layerContext;},toContext:function(obj){var context={};var layers=obj.layers;if(obj.CLASS_NAME=="OpenLayers.Map"){context.bounds=obj.getExtent();context.maxExtent=obj.maxExtent;context.projection=obj.projection;context.size=obj.getSize();}
+else{OpenLayers.Util.applyDefaults(context,obj);if(context.layers!=undefined){delete(context.layers);}}
+if(context.layersContext==undefined){context.layersContext=[];}
+if(layers!=undefined&&layers instanceof Array){for(var i=0,len=layers.length;i<len;i++){var layer=layers[i];if(layer instanceof OpenLayers.Layer.WMS){context.layersContext.push(this.layerToContext(layer));}}}
+return context;},CLASS_NAME:"OpenLayers.Format.WMC"});OpenLayers.Format.WMSCapabilities.v1=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{wms:"http://www.opengis.net/wms",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},defaultPrefix:"wms",initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var capabilities={};this.readNode(data,capabilities);this.postProcessLayers(capabilities);return capabilities;},postProcessLayers:function(capabilities){if(capabilities.capability){capabilities.capability.layers=[];var layers=capabilities.capability.nestedLayers;for(var i=0,len=layers.length;i<len;++i){var layer=layers[i];this.processLayer(capabilities.capability,layer);}}},processLayer:function(capability,layer,parentLayer){if(layer.formats===undefined){layer.formats=capability.request.getmap.formats;}
+if(parentLayer){layer.styles=layer.styles.concat(parentLayer.styles);var attributes=["queryable","cascaded","fixedWidth","fixedHeight","opaque","noSubsets","llbbox","minScale","maxScale","attribution"];var complexAttr=["srs","bbox","dimensions","authorityURLs"];var key;for(var j=0;j<attributes.length;j++){key=attributes[j];if(key in parentLayer){if(layer[key]==null){layer[key]=parentLayer[key];}
+if(layer[key]==null){var intAttr=["cascaded","fixedWidth","fixedHeight"];var boolAttr=["queryable","opaque","noSubsets"];if(OpenLayers.Util.indexOf(intAttr,key)!=-1){layer[key]=0;}
+if(OpenLayers.Util.indexOf(boolAttr,key)!=-1){layer[key]=false;}}}}
+for(var j=0;j<complexAttr.length;j++){key=complexAttr[j];layer[key]=OpenLayers.Util.extend(layer[key],parentLayer[key]);}}
+for(var i=0,len=layer.nestedLayers.length;i<len;i++){var childLayer=layer.nestedLayers[i];this.processLayer(capability,childLayer,layer);}
+if(layer.name){capability.layers.push(layer);}},readers:{"wms":{"Service":function(node,obj){obj.service={};this.readChildNodes(node,obj.service);},"Name":function(node,obj){obj.name=this.getChildValue(node);},"Title":function(node,obj){obj.title=this.getChildValue(node);},"Abstract":function(node,obj){obj["abstract"]=this.getChildValue(node);},"BoundingBox":function(node,obj){var bbox={};bbox.bbox=[parseFloat(node.getAttribute("minx")),parseFloat(node.getAttribute("miny")),parseFloat(node.getAttribute("maxx")),parseFloat(node.getAttribute("maxy"))];var res={x:parseFloat(node.getAttribute("resx")),y:parseFloat(node.getAttribute("resy"))};if(!(isNaN(res.x)&&isNaN(res.y))){bbox.res=res;}
+return bbox;},"OnlineResource":function(node,obj){obj.href=this.getAttributeNS(node,this.namespaces.xlink,"href");},"ContactInformation":function(node,obj){obj.contactInformation={};this.readChildNodes(node,obj.contactInformation);},"ContactPersonPrimary":function(node,obj){obj.personPrimary={};this.readChildNodes(node,obj.personPrimary);},"ContactPerson":function(node,obj){obj.person=this.getChildValue(node);},"ContactOrganization":function(node,obj){obj.organization=this.getChildValue(node);},"ContactPosition":function(node,obj){obj.position=this.getChildValue(node);},"ContactAddress":function(node,obj){obj.contactAddress={};this.readChildNodes(node,obj.contactAddress);},"AddressType":function(node,obj){obj.type=this.getChildValue(node);},"Address":function(node,obj){obj.address=this.getChildValue(node);},"City":function(node,obj){obj.city=this.getChildValue(node);},"StateOrProvince":function(node,obj){obj.stateOrProvince=this.getChildValue(node);},"PostCode":function(node,obj){obj.postcode=this.getChildValue(node);},"Country":function(node,obj){obj.country=this.getChildValue(node);},"ContactVoiceTelephone":function(node,obj){obj.phone=this.getChildValue(node);},"ContactFacsimileTelephone":function(node,obj){obj.fax=this.getChildValue(node);},"ContactElectronicMailAddress":function(node,obj){obj.email=this.getChildValue(node);},"Fees":function(node,obj){var fees=this.getChildValue(node);if(fees&&fees.toLowerCase()!="none"){obj.fees=fees;}},"AccessConstraints":function(node,obj){var constraints=this.getChildValue(node);if(constraints&&constraints.toLowerCase()!="none"){obj.accessConstraints=constraints;}},"Capability":function(node,obj){obj.capability={nestedLayers:[]};this.readChildNodes(node,obj.capability);},"Request":function(node,obj){obj.request={};this.readChildNodes(node,obj.request);},"GetCapabilities":function(node,obj){obj.getcapabilities={formats:[]};this.readChildNodes(node,obj.getcapabilities);},"Format":function(node,obj){if(obj.formats instanceof Array){obj.formats.push(this.getChildValue(node));}else{obj.format=this.getChildValue(node);}},"DCPType":function(node,obj){this.readChildNodes(node,obj);},"HTTP":function(node,obj){this.readChildNodes(node,obj);},"Get":function(node,obj){this.readChildNodes(node,obj);},"Post":function(node,obj){this.readChildNodes(node,obj);},"GetMap":function(node,obj){obj.getmap={formats:[]};this.readChildNodes(node,obj.getmap);},"GetFeatureInfo":function(node,obj){obj.getfeatureinfo={formats:[]};this.readChildNodes(node,obj.getfeatureinfo);},"Exception":function(node,obj){obj.exception={formats:[]};this.readChildNodes(node,obj.exception);},"Layer":function(node,obj){var attrNode=node.getAttributeNode("queryable");var queryable=(attrNode&&attrNode.specified)?node.getAttribute("queryable"):null;attrNode=node.getAttributeNode("cascaded");var cascaded=(attrNode&&attrNode.specified)?node.getAttribute("cascaded"):null;attrNode=node.getAttributeNode("opaque");var opaque=(attrNode&&attrNode.specified)?node.getAttribute('opaque'):null;var noSubsets=node.getAttribute('noSubsets');var fixedWidth=node.getAttribute('fixedWidth');var fixedHeight=node.getAttribute('fixedHeight');var layer={nestedLayers:[],styles:[],srs:{},metadataURLs:[],bbox:{},dimensions:{},authorityURLs:{},identifiers:{},keywords:[],queryable:(queryable&&queryable!=="")?(queryable==="1"||queryable==="true"):null,cascaded:(cascaded!==null)?parseInt(cascaded):null,opaque:opaque?(opaque==="1"||opaque==="true"):null,noSubsets:(noSubsets!==null)?(noSubsets==="1"||noSubsets==="true"):null,fixedWidth:(fixedWidth!=null)?parseInt(fixedWidth):null,fixedHeight:(fixedHeight!=null)?parseInt(fixedHeight):null};obj.nestedLayers.push(layer);this.readChildNodes(node,layer);if(layer.name){var parts=layer.name.split(":");if(parts.length>0){layer.prefix=parts[0];}}},"Attribution":function(node,obj){obj.attribution={};this.readChildNodes(node,obj.attribution);},"LogoURL":function(node,obj){obj.logo={width:node.getAttribute("width"),height:node.getAttribute("height")};this.readChildNodes(node,obj.logo);},"Style":function(node,obj){var style={};obj.styles.push(style);this.readChildNodes(node,style);},"LegendURL":function(node,obj){var legend={width:node.getAttribute("width"),height:node.getAttribute("height")};obj.legend=legend;this.readChildNodes(node,legend);},"MetadataURL":function(node,obj){var metadataURL={type:node.getAttribute("type")};obj.metadataURLs.push(metadataURL);this.readChildNodes(node,metadataURL);},"DataURL":function(node,obj){obj.dataURL={};this.readChildNodes(node,obj.dataURL);},"FeatureListURL":function(node,obj){obj.featureListURL={};this.readChildNodes(node,obj.featureListURL);},"AuthorityURL":function(node,obj){var name=node.getAttribute("name");var authority={};this.readChildNodes(node,authority);obj.authorityURLs[name]=authority.href;},"Identifier":function(node,obj){var authority=node.getAttribute("authority");obj.identifiers[authority]=this.getChildValue(node);},"KeywordList":function(node,obj){this.readChildNodes(node,obj);},"SRS":function(node,obj){obj.srs[this.getChildValue(node)]=true;}}},CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1"});OpenLayers.Format.WMSDescribeLayer.v1_1=OpenLayers.Class(OpenLayers.Format.WMSDescribeLayer,{initialize:function(options){OpenLayers.Format.WMSDescribeLayer.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var children=root.childNodes;var describelayer=[];var childNode,nodeName;for(var i=0;i<children.length;++i){childNode=children[i];nodeName=childNode.nodeName;if(nodeName=='LayerDescription'){var layerName=childNode.getAttribute('name');var owsType='';var owsURL='';var typeName='';if(childNode.getAttribute('owsType')){owsType=childNode.getAttribute('owsType');owsURL=childNode.getAttribute('owsURL');}else{if(childNode.getAttribute('wfs')!=''){owsType='WFS';owsURL=childNode.getAttribute('wfs');}else if(childNode.getAttribute('wcs')!=''){owsType='WCS';owsURL=childNode.getAttribute('wcs');}}
+var query=childNode.getElementsByTagName('Query');if(query.length>0){typeName=query[0].getAttribute('typeName');if(!typeName){typeName=query[0].getAttribute('typename');}}
+describelayer.push({layerName:layerName,owsType:owsType,owsURL:owsURL,typeName:typeName});}}
+return describelayer;},CLASS_NAME:"OpenLayers.Format.WMSDescribeLayer.v1_1"});OpenLayers.Handler.Box=OpenLayers.Class(OpenLayers.Handler,{dragHandler:null,boxDivClassName:'olHandlerBoxZoomBox',boxCharacteristics:null,initialize:function(control,callbacks,options){OpenLayers.Handler.prototype.initialize.apply(this,arguments);var callbacks={"down":this.startBox,"move":this.moveBox,"out":this.removeBox,"up":this.endBox};this.dragHandler=new OpenLayers.Handler.Drag(this,callbacks,{keyMask:this.keyMask});},destroy:function(){if(this.dragHandler){this.dragHandler.destroy();this.dragHandler=null;}
+OpenLayers.Handler.prototype.destroy.apply(this,arguments);},setMap:function(map){OpenLayers.Handler.prototype.setMap.apply(this,arguments);if(this.dragHandler){this.dragHandler.setMap(map);}},startBox:function(xy){this.zoomBox=OpenLayers.Util.createDiv('zoomBox',this.dragHandler.start);this.zoomBox.className=this.boxDivClassName;this.zoomBox.style.zIndex=this.map.Z_INDEX_BASE["Popup"]-1;this.map.viewPortDiv.appendChild(this.zoomBox);OpenLayers.Element.addClass(this.map.viewPortDiv,"olDrawBox");},moveBox:function(xy){var startX=this.dragHandler.start.x;var startY=this.dragHandler.start.y;var deltaX=Math.abs(startX-xy.x);var deltaY=Math.abs(startY-xy.y);this.zoomBox.style.width=Math.max(1,deltaX)+"px";this.zoomBox.style.height=Math.max(1,deltaY)+"px";this.zoomBox.style.left=xy.x<startX?xy.x+"px":startX+"px";this.zoomBox.style.top=xy.y<startY?xy.y+"px":startY+"px";var box=this.getBoxCharacteristics();if(box.newBoxModel){if(xy.x>startX){this.zoomBox.style.width=Math.max(1,deltaX-box.xOffset)+"px";}
+if(xy.y>startY){this.zoomBox.style.height=Math.max(1,deltaY-box.yOffset)+"px";}}},endBox:function(end){var result;if(Math.abs(this.dragHandler.start.x-end.x)>5||Math.abs(this.dragHandler.start.y-end.y)>5){var start=this.dragHandler.start;var top=Math.min(start.y,end.y);var bottom=Math.max(start.y,end.y);var left=Math.min(start.x,end.x);var right=Math.max(start.x,end.x);result=new OpenLayers.Bounds(left,bottom,right,top);}else{result=this.dragHandler.start.clone();}
+this.removeBox();this.callback("done",[result]);},removeBox:function(){this.map.viewPortDiv.removeChild(this.zoomBox);this.zoomBox=null;this.boxCharacteristics=null;OpenLayers.Element.removeClass(this.map.viewPortDiv,"olDrawBox");},activate:function(){if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){this.dragHandler.activate();return true;}else{return false;}},deactivate:function(){if(OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){this.dragHandler.deactivate();return true;}else{return false;}},getBoxCharacteristics:function(){if(!this.boxCharacteristics){var xOffset=parseInt(OpenLayers.Element.getStyle(this.zoomBox,"border-left-width"))+parseInt(OpenLayers.Element.getStyle(this.zoomBox,"border-right-width"))+1;var yOffset=parseInt(OpenLayers.Element.getStyle(this.zoomBox,"border-top-width"))+parseInt(OpenLayers.Element.getStyle(this.zoomBox,"border-bottom-width"))+1;var newBoxModel=OpenLayers.Util.getBrowserName()=="msie"?document.compatMode!="BackCompat":true;this.boxCharacteristics={xOffset:xOffset,yOffset:yOffset,newBoxModel:newBoxModel};}
+return this.boxCharacteristics;},CLASS_NAME:"OpenLayers.Handler.Box"});OpenLayers.Handler.RegularPolygon=OpenLayers.Class(OpenLayers.Handler.Drag,{sides:4,radius:null,snapAngle:null,snapToggle:'shiftKey',layerOptions:null,persist:false,irregular:false,angle:null,fixedRadius:false,feature:null,layer:null,origin:null,initialize:function(control,callbacks,options){if(!(options&&options.layerOptions&&options.layerOptions.styleMap)){this.style=OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'],{});}
+OpenLayers.Handler.prototype.initialize.apply(this,[control,callbacks,options]);this.options=(options)?options:{};},setOptions:function(newOptions){OpenLayers.Util.extend(this.options,newOptions);OpenLayers.Util.extend(this,newOptions);},activate:function(){var activated=false;if(OpenLayers.Handler.prototype.activate.apply(this,arguments)){var options=OpenLayers.Util.extend({displayInLayerSwitcher:false,calculateInRange:OpenLayers.Function.True},this.layerOptions);this.layer=new OpenLayers.Layer.Vector(this.CLASS_NAME,options);this.map.addLayer(this.layer);activated=true;}
+return activated;},deactivate:function(){var deactivated=false;if(OpenLayers.Handler.Drag.prototype.deactivate.apply(this,arguments)){if(this.dragging){this.cancel();}
+if(this.layer.map!=null){this.layer.destroy(false);if(this.feature){this.feature.destroy();}}
+this.layer=null;this.feature=null;deactivated=true;}
+return deactivated;},down:function(evt){this.fixedRadius=!!(this.radius);var maploc=this.map.getLonLatFromPixel(evt.xy);this.origin=new OpenLayers.Geometry.Point(maploc.lon,maploc.lat);if(!this.fixedRadius||this.irregular){this.radius=this.map.getResolution();}
+if(this.persist){this.clear();}
+this.feature=new OpenLayers.Feature.Vector();this.createGeometry();this.callback("create",[this.origin,this.feature]);this.layer.addFeatures([this.feature],{silent:true});this.layer.drawFeature(this.feature,this.style);},move:function(evt){var maploc=this.map.getLonLatFromPixel(evt.xy);var point=new OpenLayers.Geometry.Point(maploc.lon,maploc.lat);if(this.irregular){var ry=Math.sqrt(2)*Math.abs(point.y-this.origin.y)/2;this.radius=Math.max(this.map.getResolution()/2,ry);}else if(this.fixedRadius){this.origin=point;}else{this.calculateAngle(point,evt);this.radius=Math.max(this.map.getResolution()/2,point.distanceTo(this.origin));}
+this.modifyGeometry();if(this.irregular){var dx=point.x-this.origin.x;var dy=point.y-this.origin.y;var ratio;if(dy==0){ratio=dx/(this.radius*Math.sqrt(2));}else{ratio=dx/dy;}
+this.feature.geometry.resize(1,this.origin,ratio);this.feature.geometry.move(dx/2,dy/2);}
+this.layer.drawFeature(this.feature,this.style);},up:function(evt){this.finalize();if(this.start==this.last){this.callback("done",[evt.xy]);}},out:function(evt){this.finalize();},createGeometry:function(){this.angle=Math.PI*((1/this.sides)-(1/2));if(this.snapAngle){this.angle+=this.snapAngle*(Math.PI/180);}
+this.feature.geometry=OpenLayers.Geometry.Polygon.createRegularPolygon(this.origin,this.radius,this.sides,this.snapAngle);},modifyGeometry:function(){var angle,point;var ring=this.feature.geometry.components[0];if(ring.components.length!=(this.sides+1)){this.createGeometry();ring=this.feature.geometry.components[0];}
+for(var i=0;i<this.sides;++i){point=ring.components[i];angle=this.angle+(i*2*Math.PI/this.sides);point.x=this.origin.x+(this.radius*Math.cos(angle));point.y=this.origin.y+(this.radius*Math.sin(angle));point.clearBounds();}},calculateAngle:function(point,evt){var alpha=Math.atan2(point.y-this.origin.y,point.x-this.origin.x);if(this.snapAngle&&(this.snapToggle&&!evt[this.snapToggle])){var snapAngleRad=(Math.PI/180)*this.snapAngle;this.angle=Math.round(alpha/snapAngleRad)*snapAngleRad;}else{this.angle=alpha;}},cancel:function(){this.callback("cancel",null);this.finalize();},finalize:function(){this.origin=null;this.radius=this.options.radius;},clear:function(){if(this.layer){this.layer.renderer.clear();this.layer.destroyFeatures();}},callback:function(name,args){if(this.callbacks[name]){this.callbacks[name].apply(this.control,[this.feature.geometry.clone()]);}
+if(!this.persist&&(name=="done"||name=="cancel")){this.clear();}},CLASS_NAME:"OpenLayers.Handler.RegularPolygon"});OpenLayers.Layer.EventPane=OpenLayers.Class(OpenLayers.Layer,{smoothDragPan:true,isBaseLayer:true,isFixed:true,pane:null,mapObject:null,initialize:function(name,options){OpenLayers.Layer.prototype.initialize.apply(this,arguments);if(this.pane==null){this.pane=OpenLayers.Util.createDiv(this.div.id+"_EventPane");}},destroy:function(){this.mapObject=null;this.pane=null;OpenLayers.Layer.prototype.destroy.apply(this,arguments);},setMap:function(map){OpenLayers.Layer.prototype.setMap.apply(this,arguments);this.pane.style.zIndex=parseInt(this.div.style.zIndex)+1;this.pane.style.display=this.div.style.display;this.pane.style.width="100%";this.pane.style.height="100%";if(OpenLayers.Util.getBrowserName()=="msie"){this.pane.style.background="url("+OpenLayers.Util.getImagesLocation()+"blank.gif)";}
+if(this.isFixed){this.map.viewPortDiv.appendChild(this.pane);}else{this.map.layerContainerDiv.appendChild(this.pane);}
+this.loadMapObject();if(this.mapObject==null){this.loadWarningMessage();}},removeMap:function(map){if(this.pane&&this.pane.parentNode){this.pane.parentNode.removeChild(this.pane);}
+OpenLayers.Layer.prototype.removeMap.apply(this,arguments);},loadWarningMessage:function(){this.div.style.backgroundColor="darkblue";var viewSize=this.map.getSize();var msgW=Math.min(viewSize.w,300);var msgH=Math.min(viewSize.h,200);var size=new OpenLayers.Size(msgW,msgH);var centerPx=new OpenLayers.Pixel(viewSize.w/2,viewSize.h/2);var topLeft=centerPx.add(-size.w/2,-size.h/2);var div=OpenLayers.Util.createDiv(this.name+"_warning",topLeft,size,null,null,null,"auto");div.style.padding="7px";div.style.backgroundColor="yellow";div.innerHTML=this.getWarningHTML();this.div.appendChild(div);},getWarningHTML:function(){return"";},display:function(display){OpenLayers.Layer.prototype.display.apply(this,arguments);this.pane.style.display=this.div.style.display;},setZIndex:function(zIndex){OpenLayers.Layer.prototype.setZIndex.apply(this,arguments);this.pane.style.zIndex=parseInt(this.div.style.zIndex)+1;},moveTo:function(bounds,zoomChanged,dragging){OpenLayers.Layer.prototype.moveTo.apply(this,arguments);if(this.mapObject!=null){var newCenter=this.map.getCenter();var newZoom=this.map.getZoom();if(newCenter!=null){var moOldCenter=this.getMapObjectCenter();var oldCenter=this.getOLLonLatFromMapObjectLonLat(moOldCenter);var moOldZoom=this.getMapObjectZoom();var oldZoom=this.getOLZoomFromMapObjectZoom(moOldZoom);if(!(newCenter.equals(oldCenter))||!(newZoom==oldZoom)){if(dragging&&this.dragPanMapObject&&this.smoothDragPan){var oldPx=this.map.getViewPortPxFromLonLat(oldCenter);var newPx=this.map.getViewPortPxFromLonLat(newCenter);this.dragPanMapObject(newPx.x-oldPx.x,oldPx.y-newPx.y);}else{var center=this.getMapObjectLonLatFromOLLonLat(newCenter);var zoom=this.getMapObjectZoomFromOLZoom(newZoom);this.setMapObjectCenter(center,zoom,dragging);}}}}},getLonLatFromViewPortPx:function(viewPortPx){var lonlat=null;if((this.mapObject!=null)&&(this.getMapObjectCenter()!=null)){var moPixel=this.getMapObjectPixelFromOLPixel(viewPortPx);var moLonLat=this.getMapObjectLonLatFromMapObjectPixel(moPixel);lonlat=this.getOLLonLatFromMapObjectLonLat(moLonLat);}
+return lonlat;},getViewPortPxFromLonLat:function(lonlat){var viewPortPx=null;if((this.mapObject!=null)&&(this.getMapObjectCenter()!=null)){var moLonLat=this.getMapObjectLonLatFromOLLonLat(lonlat);var moPixel=this.getMapObjectPixelFromMapObjectLonLat(moLonLat);viewPortPx=this.getOLPixelFromMapObjectPixel(moPixel);}
+return viewPortPx;},getOLLonLatFromMapObjectLonLat:function(moLonLat){var olLonLat=null;if(moLonLat!=null){var lon=this.getLongitudeFromMapObjectLonLat(moLonLat);var lat=this.getLatitudeFromMapObjectLonLat(moLonLat);olLonLat=new OpenLayers.LonLat(lon,lat);}
+return olLonLat;},getMapObjectLonLatFromOLLonLat:function(olLonLat){var moLatLng=null;if(olLonLat!=null){moLatLng=this.getMapObjectLonLatFromLonLat(olLonLat.lon,olLonLat.lat);}
+return moLatLng;},getOLPixelFromMapObjectPixel:function(moPixel){var olPixel=null;if(moPixel!=null){var x=this.getXFromMapObjectPixel(moPixel);var y=this.getYFromMapObjectPixel(moPixel);olPixel=new OpenLayers.Pixel(x,y);}
+return olPixel;},getMapObjectPixelFromOLPixel:function(olPixel){var moPixel=null;if(olPixel!=null){moPixel=this.getMapObjectPixelFromXY(olPixel.x,olPixel.y);}
+return moPixel;},CLASS_NAME:"OpenLayers.Layer.EventPane"});OpenLayers.Layer.FixedZoomLevels=OpenLayers.Class({initialize:function(){},initResolutions:function(){var props=new Array('minZoomLevel','maxZoomLevel','numZoomLevels');for(var i=0,len=props.length;i<len;i++){var property=props[i];this[property]=(this.options[property]!=null)?this.options[property]:this.map[property];}
+if((this.minZoomLevel==null)||(this.minZoomLevel<this.MIN_ZOOM_LEVEL)){this.minZoomLevel=this.MIN_ZOOM_LEVEL;}
+var desiredZoomLevels;var limitZoomLevels=this.MAX_ZOOM_LEVEL-this.minZoomLevel+1;if(((this.options.numZoomLevels==null)&&(this.options.maxZoomLevel!=null))||((this.numZoomLevels==null)&&(this.maxZoomLevel!=null))){desiredZoomLevels=this.maxZoomLevel-this.minZoomLevel+1;}else{desiredZoomLevels=this.numZoomLevels;}
+if(desiredZoomLevels!=null){this.numZoomLevels=Math.min(desiredZoomLevels,limitZoomLevels);}else{this.numZoomLevels=limitZoomLevels;}
+this.maxZoomLevel=this.minZoomLevel+this.numZoomLevels-1;if(this.RESOLUTIONS!=null){var resolutionsIndex=0;this.resolutions=[];for(var i=this.minZoomLevel;i<=this.maxZoomLevel;i++){this.resolutions[resolutionsIndex++]=this.RESOLUTIONS[i];}
+this.maxResolution=this.resolutions[0];this.minResolution=this.resolutions[this.resolutions.length-1];}},getResolution:function(){if(this.resolutions!=null){return OpenLayers.Layer.prototype.getResolution.apply(this,arguments);}else{var resolution=null;var viewSize=this.map.getSize();var extent=this.getExtent();if((viewSize!=null)&&(extent!=null)){resolution=Math.max(extent.getWidth()/viewSize.w,extent.getHeight()/viewSize.h);}
+return resolution;}},getExtent:function(){var extent=null;var size=this.map.getSize();var tlPx=new OpenLayers.Pixel(0,0);var tlLL=this.getLonLatFromViewPortPx(tlPx);var brPx=new OpenLayers.Pixel(size.w,size.h);var brLL=this.getLonLatFromViewPortPx(brPx);if((tlLL!=null)&&(brLL!=null)){extent=new OpenLayers.Bounds(tlLL.lon,brLL.lat,brLL.lon,tlLL.lat);}
+return extent;},getZoomForResolution:function(resolution){if(this.resolutions!=null){return OpenLayers.Layer.prototype.getZoomForResolution.apply(this,arguments);}else{var extent=OpenLayers.Layer.prototype.getExtent.apply(this,[]);return this.getZoomForExtent(extent);}},getOLZoomFromMapObjectZoom:function(moZoom){var zoom=null;if(moZoom!=null){zoom=moZoom-this.minZoomLevel;}
+return zoom;},getMapObjectZoomFromOLZoom:function(olZoom){var zoom=null;if(olZoom!=null){zoom=olZoom+this.minZoomLevel;}
+return zoom;},CLASS_NAME:"OpenLayers.Layer.FixedZoomLevels"});OpenLayers.Layer.HTTPRequest=OpenLayers.Class(OpenLayers.Layer,{URL_HASH_FACTOR:(Math.sqrt(5)-1)/2,url:null,params:null,reproject:false,initialize:function(name,url,params,options){var newArguments=arguments;newArguments=[name,options];OpenLayers.Layer.prototype.initialize.apply(this,newArguments);this.url=url;this.params=OpenLayers.Util.extend({},params);},destroy:function(){this.url=null;this.params=null;OpenLayers.Layer.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.HTTPRequest(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.prototype.clone.apply(this,[obj]);return obj;},setUrl:function(newUrl){this.url=newUrl;},mergeNewParams:function(newParams){this.params=OpenLayers.Util.extend(this.params,newParams);var ret=this.redraw();if(this.map!=null){this.map.events.triggerEvent("changelayer",{layer:this,property:"params"});}
+return ret;},redraw:function(force){if(force){return this.mergeNewParams({"_olSalt":Math.random()});}else{return OpenLayers.Layer.prototype.redraw.apply(this,[]);}},selectUrl:function(paramString,urls){var product=1;for(var i=0,len=paramString.length;i<len;i++){product*=paramString.charCodeAt(i)*this.URL_HASH_FACTOR;product-=Math.floor(product);}
+return urls[Math.floor(product*urls.length)];},getFullRequestString:function(newParams,altUrl){var url=altUrl||this.url;var allParams=OpenLayers.Util.extend({},this.params);allParams=OpenLayers.Util.extend(allParams,newParams);var paramsString=OpenLayers.Util.getParameterString(allParams);if(url instanceof Array){url=this.selectUrl(paramsString,url);}
+var urlParams=OpenLayers.Util.upperCaseObject(OpenLayers.Util.getParameters(url));for(var key in allParams){if(key.toUpperCase()in urlParams){delete allParams[key];}}
+paramsString=OpenLayers.Util.getParameterString(allParams);return OpenLayers.Util.urlAppend(url,paramsString);},CLASS_NAME:"OpenLayers.Layer.HTTPRequest"});OpenLayers.Layer.Image=OpenLayers.Class(OpenLayers.Layer,{isBaseLayer:true,url:null,extent:null,size:null,tile:null,aspectRatio:null,initialize:function(name,url,extent,size,options){this.url=url;this.extent=extent;this.maxExtent=extent;this.size=size;OpenLayers.Layer.prototype.initialize.apply(this,[name,options]);this.aspectRatio=(this.extent.getHeight()/this.size.h)/(this.extent.getWidth()/this.size.w);},destroy:function(){if(this.tile){this.removeTileMonitoringHooks(this.tile);this.tile.destroy();this.tile=null;}
+OpenLayers.Layer.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.Image(this.name,this.url,this.extent,this.size,this.getOptions());}
+obj=OpenLayers.Layer.prototype.clone.apply(this,[obj]);return obj;},setMap:function(map){if(this.options.maxResolution==null){this.options.maxResolution=this.aspectRatio*this.extent.getWidth()/this.size.w;}
+OpenLayers.Layer.prototype.setMap.apply(this,arguments);},moveTo:function(bounds,zoomChanged,dragging){OpenLayers.Layer.prototype.moveTo.apply(this,arguments);var firstRendering=(this.tile==null);if(zoomChanged||firstRendering){this.setTileSize();var ul=new OpenLayers.LonLat(this.extent.left,this.extent.top);var ulPx=this.map.getLayerPxFromLonLat(ul);if(firstRendering){this.tile=new OpenLayers.Tile.Image(this,ulPx,this.extent,null,this.tileSize);this.addTileMonitoringHooks(this.tile);}else{this.tile.size=this.tileSize.clone();this.tile.position=ulPx.clone();}
+this.tile.draw();}},setTileSize:function(){var tileWidth=this.extent.getWidth()/this.map.getResolution();var tileHeight=this.extent.getHeight()/this.map.getResolution();this.tileSize=new OpenLayers.Size(tileWidth,tileHeight);},addTileMonitoringHooks:function(tile){tile.onLoadStart=function(){this.events.triggerEvent("loadstart");};tile.events.register("loadstart",this,tile.onLoadStart);tile.onLoadEnd=function(){this.events.triggerEvent("loadend");};tile.events.register("loadend",this,tile.onLoadEnd);tile.events.register("unload",this,tile.onLoadEnd);},removeTileMonitoringHooks:function(tile){tile.unload();tile.events.un({"loadstart":tile.onLoadStart,"loadend":tile.onLoadEnd,"unload":tile.onLoadEnd,scope:this});},setUrl:function(newUrl){this.url=newUrl;this.tile.draw();},getURL:function(bounds){return this.url;},CLASS_NAME:"OpenLayers.Layer.Image"});OpenLayers.Layer.Markers=OpenLayers.Class(OpenLayers.Layer,{isBaseLayer:false,markers:null,drawn:false,initialize:function(name,options){OpenLayers.Layer.prototype.initialize.apply(this,arguments);this.markers=[];},destroy:function(){this.clearMarkers();this.markers=null;OpenLayers.Layer.prototype.destroy.apply(this,arguments);},setOpacity:function(opacity){if(opacity!=this.opacity){this.opacity=opacity;for(var i=0,len=this.markers.length;i<len;i++){this.markers[i].setOpacity(this.opacity);}}},moveTo:function(bounds,zoomChanged,dragging){OpenLayers.Layer.prototype.moveTo.apply(this,arguments);if(zoomChanged||!this.drawn){for(var i=0,len=this.markers.length;i<len;i++){this.drawMarker(this.markers[i]);}
+this.drawn=true;}},addMarker:function(marker){this.markers.push(marker);if(this.opacity!=null){marker.setOpacity(this.opacity);}
+if(this.map&&this.map.getExtent()){marker.map=this.map;this.drawMarker(marker);}},removeMarker:function(marker){if(this.markers&&this.markers.length){OpenLayers.Util.removeItem(this.markers,marker);marker.erase();}},clearMarkers:function(){if(this.markers!=null){while(this.markers.length>0){this.removeMarker(this.markers[0]);}}},drawMarker:function(marker){var px=this.map.getLayerPxFromLonLat(marker.lonlat);if(px==null){marker.display(false);}else{if(!marker.isDrawn()){var markerImg=marker.draw(px);this.div.appendChild(markerImg);}else if(marker.icon){marker.icon.moveTo(px);}}},getDataExtent:function(){var maxExtent=null;if(this.markers&&(this.markers.length>0)){var maxExtent=new OpenLayers.Bounds();for(var i=0,len=this.markers.length;i<len;i++){var marker=this.markers[i];maxExtent.extend(marker.lonlat);}}
+return maxExtent;},CLASS_NAME:"OpenLayers.Layer.Markers"});OpenLayers.Layer.SphericalMercator={getExtent:function(){var extent=null;if(this.sphericalMercator){extent=this.map.calculateBounds();}else{extent=OpenLayers.Layer.FixedZoomLevels.prototype.getExtent.apply(this);}
+return extent;},getLonLatFromViewPortPx:function(viewPortPx){return OpenLayers.Layer.prototype.getLonLatFromViewPortPx.apply(this,arguments);},getViewPortPxFromLonLat:function(lonlat){return OpenLayers.Layer.prototype.getViewPortPxFromLonLat.apply(this,arguments);},initMercatorParameters:function(){this.RESOLUTIONS=[];var maxResolution=156543.0339;for(var zoom=0;zoom<=this.MAX_ZOOM_LEVEL;++zoom){this.RESOLUTIONS[zoom]=maxResolution/Math.pow(2,zoom);}
+this.units="m";this.projection=this.projection||"EPSG:900913";},forwardMercator:function(lon,lat){var x=lon*20037508.34/180;var y=Math.log(Math.tan((90+lat)*Math.PI/360))/(Math.PI/180);y=y*20037508.34/180;return new OpenLayers.LonLat(x,y);},inverseMercator:function(x,y){var lon=(x/20037508.34)*180;var lat=(y/20037508.34)*180;lat=180/Math.PI*(2*Math.atan(Math.exp(lat*Math.PI/180))-Math.PI/2);return new OpenLayers.LonLat(lon,lat);},projectForward:function(point){var lonlat=OpenLayers.Layer.SphericalMercator.forwardMercator(point.x,point.y);point.x=lonlat.lon;point.y=lonlat.lat;return point;},projectInverse:function(point){var lonlat=OpenLayers.Layer.SphericalMercator.inverseMercator(point.x,point.y);point.x=lonlat.lon;point.y=lonlat.lat;return point;}};OpenLayers.Projection.addTransform("EPSG:4326","EPSG:900913",OpenLayers.Layer.SphericalMercator.projectForward);OpenLayers.Projection.addTransform("EPSG:900913","EPSG:4326",OpenLayers.Layer.SphericalMercator.projectInverse);OpenLayers.Tile.WFS=OpenLayers.Class(OpenLayers.Tile,{features:null,url:null,request:null,initialize:function(layer,position,bounds,url,size){OpenLayers.Tile.prototype.initialize.apply(this,arguments);this.url=url;this.features=[];},destroy:function(){OpenLayers.Tile.prototype.destroy.apply(this,arguments);this.destroyAllFeatures();this.features=null;this.url=null;if(this.request){this.request.abort();this.request=null;}},clear:function(){this.destroyAllFeatures();},draw:function(){if(OpenLayers.Tile.prototype.draw.apply(this,arguments)){if(this.isLoading){this.events.triggerEvent("reload");}else{this.isLoading=true;this.events.triggerEvent("loadstart");}
+this.loadFeaturesForRegion(this.requestSuccess);}},loadFeaturesForRegion:function(success,failure){if(this.request){this.request.abort();}
+this.request=OpenLayers.Request.GET({url:this.url,success:success,failure:failure,scope:this});},requestSuccess:function(request){if(this.features){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+if(this.layer.vectorMode){this.layer.addFeatures(this.layer.formatObject.read(doc));}else{var xml=new OpenLayers.Format.XML();if(typeof doc=="string"){doc=xml.read(doc);}
+var resultFeatures=xml.getElementsByTagNameNS(doc,"http://www.opengis.net/gml","featureMember");this.addResults(resultFeatures);}}
+if(this.events){this.events.triggerEvent("loadend");}
+this.request=null;},addResults:function(results){for(var i=0;i<results.length;i++){var feature=new this.layer.featureClass(this.layer,results[i]);this.features.push(feature);}},destroyAllFeatures:function(){while(this.features.length>0){var feature=this.features.shift();feature.destroy();}},CLASS_NAME:"OpenLayers.Tile.WFS"});OpenLayers.Control.DrawFeature=OpenLayers.Class(OpenLayers.Control,{layer:null,callbacks:null,EVENT_TYPES:["featureadded"],multi:false,featureAdded:function(){},handlerOptions:null,initialize:function(layer,handler,options){this.EVENT_TYPES=OpenLayers.Control.DrawFeature.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.callbacks=OpenLayers.Util.extend({done:this.drawFeature,modify:function(vertex,feature){this.layer.events.triggerEvent("sketchmodified",{vertex:vertex,feature:feature});},create:function(vertex,feature){this.layer.events.triggerEvent("sketchstarted",{vertex:vertex,feature:feature});}},this.callbacks);this.layer=layer;this.handlerOptions=this.handlerOptions||{};if(!("multi"in this.handlerOptions)){this.handlerOptions.multi=this.multi;}
+var sketchStyle=this.layer.styleMap&&this.layer.styleMap.styles.temporary;if(sketchStyle){this.handlerOptions.layerOptions=OpenLayers.Util.applyDefaults(this.handlerOptions.layerOptions,{styleMap:new OpenLayers.StyleMap({"default":sketchStyle})});}
+this.handler=new handler(this,this.callbacks,this.handlerOptions);},drawFeature:function(geometry){var feature=new OpenLayers.Feature.Vector(geometry);var proceed=this.layer.events.triggerEvent("sketchcomplete",{feature:feature});if(proceed!==false){feature.state=OpenLayers.State.INSERT;this.layer.addFeatures([feature]);this.featureAdded(feature);this.events.triggerEvent("featureadded",{feature:feature});}},CLASS_NAME:"OpenLayers.Control.DrawFeature"});OpenLayers.Control.Measure=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:['measure','measurepartial'],handlerOptions:null,callbacks:null,displaySystem:'metric',geodesic:false,displaySystemUnits:{geographic:['dd'],english:['mi','ft','in'],metric:['km','m']},partialDelay:300,delayedTrigger:null,persist:false,initialize:function(handler,options){this.EVENT_TYPES=OpenLayers.Control.Measure.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.callbacks=OpenLayers.Util.extend({done:this.measureComplete,point:this.measurePartial},this.callbacks);this.handlerOptions=OpenLayers.Util.extend({persist:this.persist},this.handlerOptions);this.handler=new handler(this,this.callbacks,this.handlerOptions);},cancel:function(){this.handler.cancel();},updateHandler:function(handler,options){var active=this.active;if(active){this.deactivate();}
+this.handler=new handler(this,this.callbacks,options);if(active){this.activate();}},measureComplete:function(geometry){if(this.delayedTrigger){window.clearTimeout(this.delayedTrigger);}
+this.measure(geometry,"measure");},measurePartial:function(point,geometry){if(geometry.getLength()>0){geometry=geometry.clone();this.delayedTrigger=window.setTimeout(OpenLayers.Function.bind(function(){this.measure(geometry,"measurepartial");},this),this.partialDelay);}},measure:function(geometry,eventType){var stat,order;if(geometry.CLASS_NAME.indexOf('LineString')>-1){stat=this.getBestLength(geometry);order=1;}else{stat=this.getBestArea(geometry);order=2;}
+this.events.triggerEvent(eventType,{measure:stat[0],units:stat[1],order:order,geometry:geometry});},getBestArea:function(geometry){var units=this.displaySystemUnits[this.displaySystem];var unit,area;for(var i=0,len=units.length;i<len;++i){unit=units[i];area=this.getArea(geometry,unit);if(area>1){break;}}
+return[area,unit];},getArea:function(geometry,units){var area,geomUnits;if(this.geodesic){area=geometry.getGeodesicArea(this.map.getProjectionObject());geomUnits="m";}else{area=geometry.getArea();geomUnits=this.map.getUnits();}
+var inPerDisplayUnit=OpenLayers.INCHES_PER_UNIT[units];if(inPerDisplayUnit){var inPerMapUnit=OpenLayers.INCHES_PER_UNIT[geomUnits];area*=Math.pow((inPerMapUnit/inPerDisplayUnit),2);}
+return area;},getBestLength:function(geometry){var units=this.displaySystemUnits[this.displaySystem];var unit,length;for(var i=0,len=units.length;i<len;++i){unit=units[i];length=this.getLength(geometry,unit);if(length>1){break;}}
+return[length,unit];},getLength:function(geometry,units){var length,geomUnits;if(this.geodesic){length=geometry.getGeodesicLength(this.map.getProjectionObject());geomUnits="m";}else{length=geometry.getLength();geomUnits=this.map.getUnits();}
+var inPerDisplayUnit=OpenLayers.INCHES_PER_UNIT[units];if(inPerDisplayUnit){var inPerMapUnit=OpenLayers.INCHES_PER_UNIT[geomUnits];length*=(inPerMapUnit/inPerDisplayUnit);}
+return length;},CLASS_NAME:"OpenLayers.Control.Measure"});OpenLayers.Control.ZoomBox=OpenLayers.Class(OpenLayers.Control,{type:OpenLayers.Control.TYPE_TOOL,out:false,alwaysZoom:false,draw:function(){this.handler=new OpenLayers.Handler.Box(this,{done:this.zoomBox},{keyMask:this.keyMask});},zoomBox:function(position){if(position instanceof OpenLayers.Bounds){var bounds;if(!this.out){var minXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.left,position.bottom));var maxXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.right,position.top));bounds=new OpenLayers.Bounds(minXY.lon,minXY.lat,maxXY.lon,maxXY.lat);}else{var pixWidth=Math.abs(position.right-position.left);var pixHeight=Math.abs(position.top-position.bottom);var zoomFactor=Math.min((this.map.size.h/pixHeight),(this.map.size.w/pixWidth));var extent=this.map.getExtent();var center=this.map.getLonLatFromPixel(position.getCenterPixel());var xmin=center.lon-(extent.getWidth()/2)*zoomFactor;var xmax=center.lon+(extent.getWidth()/2)*zoomFactor;var ymin=center.lat-(extent.getHeight()/2)*zoomFactor;var ymax=center.lat+(extent.getHeight()/2)*zoomFactor;bounds=new OpenLayers.Bounds(xmin,ymin,xmax,ymax);}
+var lastZoom=this.map.getZoom();this.map.zoomToExtent(bounds);if(lastZoom==this.map.getZoom()&&this.alwaysZoom==true){this.map.zoomTo(lastZoom+(this.out?-1:1));}}else{if(!this.out){this.map.setCenter(this.map.getLonLatFromPixel(position),this.map.getZoom()+1);}else{this.map.setCenter(this.map.getLonLatFromPixel(position),this.map.getZoom()-1);}}},CLASS_NAME:"OpenLayers.Control.ZoomBox"});OpenLayers.Format.WFSCapabilities.v1_0_0=OpenLayers.Class(OpenLayers.Format.WFSCapabilities.v1,{initialize:function(options){OpenLayers.Format.WFSCapabilities.v1.prototype.initialize.apply(this,[options]);},read_cap_Service:function(capabilities,node){var service={};this.runChildNodes(service,node);capabilities.service=service;},read_cap_Fees:function(service,node){var fees=this.getChildValue(node);if(fees&&fees.toLowerCase()!="none"){service.fees=fees;}},read_cap_AccessConstraints:function(service,node){var constraints=this.getChildValue(node);if(constraints&&constraints.toLowerCase()!="none"){service.accessConstraints=constraints;}},read_cap_OnlineResource:function(service,node){var onlineResource=this.getChildValue(node);if(onlineResource&&onlineResource.toLowerCase()!="none"){service.onlineResource=onlineResource;}},read_cap_Keywords:function(service,node){var keywords=this.getChildValue(node);if(keywords&&keywords.toLowerCase()!="none"){service.keywords=keywords.split(', ');}},read_cap_Capability:function(capabilities,node){var capability={};this.runChildNodes(capability,node);capabilities.capability=capability;},read_cap_Request:function(obj,node){var request={};this.runChildNodes(request,node);obj.request=request;},read_cap_GetFeature:function(request,node){var getfeature={href:{},formats:[]};this.runChildNodes(getfeature,node);request.getfeature=getfeature;},read_cap_ResultFormat:function(obj,node){var children=node.childNodes;var childNode;for(var i=0;i<children.length;i++){childNode=children[i];if(childNode.nodeType==1){obj.formats.push(childNode.nodeName);}}},read_cap_DCPType:function(obj,node){this.runChildNodes(obj,node);},read_cap_HTTP:function(obj,node){this.runChildNodes(obj.href,node);},read_cap_Get:function(obj,node){obj.get=node.getAttribute("onlineResource");},read_cap_Post:function(obj,node){obj.post=node.getAttribute("onlineResource");},CLASS_NAME:"OpenLayers.Format.WFSCapabilities.v1_0_0"});OpenLayers.Format.WFSCapabilities.v1_1_0=OpenLayers.Class(OpenLayers.Format.WFSCapabilities.v1,{initialize:function(options){OpenLayers.Format.WFSCapabilities.v1.prototype.initialize.apply(this,[options]);},CLASS_NAME:"OpenLayers.Format.WFSCapabilities.v1_1_0"});OpenLayers.Format.WKT=OpenLayers.Class(OpenLayers.Format,{initialize:function(options){this.regExes={'typeStr':/^\s*(\w+)\s*\(\s*(.*)\s*\)\s*$/,'spaces':/\s+/,'parenComma':/\)\s*,\s*\(/,'doubleParenComma':/\)\s*\)\s*,\s*\(\s*\(/,'trimParens':/^\s*\(?(.*?)\)?\s*$/};OpenLayers.Format.prototype.initialize.apply(this,[options]);},read:function(wkt){var features,type,str;var matches=this.regExes.typeStr.exec(wkt);if(matches){type=matches[1].toLowerCase();str=matches[2];if(this.parse[type]){features=this.parse[type].apply(this,[str]);}
+if(this.internalProjection&&this.externalProjection){if(features&&features.CLASS_NAME=="OpenLayers.Feature.Vector"){features.geometry.transform(this.externalProjection,this.internalProjection);}else if(features&&type!="geometrycollection"&&typeof features=="object"){for(var i=0,len=features.length;i<len;i++){var component=features[i];component.geometry.transform(this.externalProjection,this.internalProjection);}}}}
+return features;},write:function(features){var collection,geometry,type,data,isCollection;if(features.constructor==Array){collection=features;isCollection=true;}else{collection=[features];isCollection=false;}
+var pieces=[];if(isCollection){pieces.push('GEOMETRYCOLLECTION(');}
+for(var i=0,len=collection.length;i<len;++i){if(isCollection&&i>0){pieces.push(',');}
+geometry=collection[i].geometry;type=geometry.CLASS_NAME.split('.')[2].toLowerCase();if(!this.extract[type]){return null;}
+if(this.internalProjection&&this.externalProjection){geometry=geometry.clone();geometry.transform(this.internalProjection,this.externalProjection);}
+data=this.extract[type].apply(this,[geometry]);pieces.push(type.toUpperCase()+'('+data+')');}
+if(isCollection){pieces.push(')');}
+return pieces.join('');},extract:{'point':function(point){return point.x+' '+point.y;},'multipoint':function(multipoint){var array=[];for(var i=0,len=multipoint.components.length;i<len;++i){array.push('('+
+this.extract.point.apply(this,[multipoint.components[i]])+')');}
+return array.join(',');},'linestring':function(linestring){var array=[];for(var i=0,len=linestring.components.length;i<len;++i){array.push(this.extract.point.apply(this,[linestring.components[i]]));}
+return array.join(',');},'multilinestring':function(multilinestring){var array=[];for(var i=0,len=multilinestring.components.length;i<len;++i){array.push('('+
+this.extract.linestring.apply(this,[multilinestring.components[i]])+')');}
+return array.join(',');},'polygon':function(polygon){var array=[];for(var i=0,len=polygon.components.length;i<len;++i){array.push('('+
+this.extract.linestring.apply(this,[polygon.components[i]])+')');}
+return array.join(',');},'multipolygon':function(multipolygon){var array=[];for(var i=0,len=multipolygon.components.length;i<len;++i){array.push('('+
+this.extract.polygon.apply(this,[multipolygon.components[i]])+')');}
+return array.join(',');}},parse:{'point':function(str){var coords=OpenLayers.String.trim(str).split(this.regExes.spaces);return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(coords[0],coords[1]));},'multipoint':function(str){var point;var points=OpenLayers.String.trim(str).split(this.regExes.parenComma);var components=[];for(var i=0,len=points.length;i<len;++i){point=points[i].replace(this.regExes.trimParens,'$1');components.push(this.parse.point.apply(this,[point]).geometry);}
+return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.MultiPoint(components));},'linestring':function(str){var points=OpenLayers.String.trim(str).split(',');var components=[];for(var i=0,len=points.length;i<len;++i){components.push(this.parse.point.apply(this,[points[i]]).geometry);}
+return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(components));},'multilinestring':function(str){var line;var lines=OpenLayers.String.trim(str).split(this.regExes.parenComma);var components=[];for(var i=0,len=lines.length;i<len;++i){line=lines[i].replace(this.regExes.trimParens,'$1');components.push(this.parse.linestring.apply(this,[line]).geometry);}
+return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.MultiLineString(components));},'polygon':function(str){var ring,linestring,linearring;var rings=OpenLayers.String.trim(str).split(this.regExes.parenComma);var components=[];for(var i=0,len=rings.length;i<len;++i){ring=rings[i].replace(this.regExes.trimParens,'$1');linestring=this.parse.linestring.apply(this,[ring]).geometry;linearring=new OpenLayers.Geometry.LinearRing(linestring.components);components.push(linearring);}
+return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon(components));},'multipolygon':function(str){var polygon;var polygons=OpenLayers.String.trim(str).split(this.regExes.doubleParenComma);var components=[];for(var i=0,len=polygons.length;i<len;++i){polygon=polygons[i].replace(this.regExes.trimParens,'$1');components.push(this.parse.polygon.apply(this,[polygon]).geometry);}
+return new OpenLayers.Feature.Vector(new OpenLayers.Geometry.MultiPolygon(components));},'geometrycollection':function(str){str=str.replace(/,\s*([A-Za-z])/g,'|$1');var wktArray=OpenLayers.String.trim(str).split('|');var components=[];for(var i=0,len=wktArray.length;i<len;++i){components.push(OpenLayers.Format.WKT.prototype.read.apply(this,[wktArray[i]]));}
+return components;}},CLASS_NAME:"OpenLayers.Format.WKT"});OpenLayers.Format.WMC.v1=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{ol:"http://openlayers.org/context",wmc:"http://www.opengis.net/context",sld:"http://www.opengis.net/sld",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},schemaLocation:"",getNamespacePrefix:function(uri){var prefix=null;if(uri==null){prefix=this.namespaces[this.defaultPrefix];}else{for(prefix in this.namespaces){if(this.namespaces[prefix]==uri){break;}}}
+return prefix;},defaultPrefix:"wmc",rootPrefix:null,defaultStyleName:"",defaultStyleTitle:"Default",initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;this.rootPrefix=root.prefix;var context={version:root.getAttribute("version")};this.runChildNodes(context,root);return context;},runChildNodes:function(obj,node){var children=node.childNodes;var childNode,processor,prefix,local;for(var i=0,len=children.length;i<len;++i){childNode=children[i];if(childNode.nodeType==1){prefix=this.getNamespacePrefix(childNode.namespaceURI);local=childNode.nodeName.split(":").pop();processor=this["read_"+prefix+"_"+local];if(processor){processor.apply(this,[obj,childNode]);}}}},read_wmc_General:function(context,node){this.runChildNodes(context,node);},read_wmc_BoundingBox:function(context,node){context.projection=node.getAttribute("SRS");context.bounds=new OpenLayers.Bounds(parseFloat(node.getAttribute("minx")),parseFloat(node.getAttribute("miny")),parseFloat(node.getAttribute("maxx")),parseFloat(node.getAttribute("maxy")));},read_wmc_LayerList:function(context,node){context.layersContext=[];this.runChildNodes(context,node);},read_wmc_Layer:function(context,node){var layerContext={visibility:(node.getAttribute("hidden")!="1"),queryable:(node.getAttribute("queryable")=="1"),formats:[],styles:[]};this.runChildNodes(layerContext,node);context.layersContext.push(layerContext);},read_wmc_Extension:function(obj,node){this.runChildNodes(obj,node);},read_ol_units:function(layerContext,node){layerContext.units=this.getChildValue(node);},read_ol_maxExtent:function(obj,node){var bounds=new OpenLayers.Bounds(node.getAttribute("minx"),node.getAttribute("miny"),node.getAttribute("maxx"),node.getAttribute("maxy"));obj.maxExtent=bounds;},read_ol_transparent:function(layerContext,node){layerContext.transparent=this.getChildValue(node);},read_ol_numZoomLevels:function(layerContext,node){layerContext.numZoomLevels=parseInt(this.getChildValue(node));},read_ol_opacity:function(layerContext,node){layerContext.opacity=parseFloat(this.getChildValue(node));},read_ol_singleTile:function(layerContext,node){layerContext.singleTile=(this.getChildValue(node)=="true");},read_ol_tileSize:function(layerContext,node){var obj={"width":node.getAttribute("width"),"height":node.getAttribute("height")};layerContext.tileSize=obj;},read_ol_isBaseLayer:function(layerContext,node){layerContext.isBaseLayer=(this.getChildValue(node)=="true");},read_ol_displayInLayerSwitcher:function(layerContext,node){layerContext.displayInLayerSwitcher=(this.getChildValue(node)=="true");},read_wmc_Server:function(layerContext,node){layerContext.version=node.getAttribute("version");var server={};var links=node.getElementsByTagName("OnlineResource");if(links.length>0){this.read_wmc_OnlineResource(server,links[0]);}
+layerContext.url=server.href;},read_wmc_FormatList:function(layerContext,node){this.runChildNodes(layerContext,node);},read_wmc_Format:function(layerContext,node){var format={value:this.getChildValue(node)};if(node.getAttribute("current")=="1"){format.current=true;}
+layerContext.formats.push(format);},read_wmc_StyleList:function(layerContext,node){this.runChildNodes(layerContext,node);},read_wmc_Style:function(layerContext,node){var style={};this.runChildNodes(style,node);if(node.getAttribute("current")=="1"){style.current=true;}
+layerContext.styles.push(style);},read_wmc_SLD:function(style,node){this.runChildNodes(style,node);},read_sld_StyledLayerDescriptor:function(sld,node){var xml=OpenLayers.Format.XML.prototype.write.apply(this,[node]);sld.body=xml;},read_wmc_OnlineResource:function(obj,node){obj.href=this.getAttributeNS(node,this.namespaces.xlink,"href");},read_wmc_Name:function(obj,node){var name=this.getChildValue(node);if(name){obj.name=name;}},read_wmc_Title:function(obj,node){var title=this.getChildValue(node);if(title){obj.title=title;}},read_wmc_MetadataURL:function(layerContext,node){var metadataURL={};var links=node.getElementsByTagName("OnlineResource");if(links.length>0){this.read_wmc_OnlineResource(metadataURL,links[0]);}
+layerContext.metadataURL=metadataURL.href;},read_wmc_Abstract:function(obj,node){var abst=this.getChildValue(node);if(abst){obj["abstract"]=abst;}},read_wmc_LegendURL:function(style,node){var legend={width:node.getAttribute('width'),height:node.getAttribute('height')};var links=node.getElementsByTagName("OnlineResource");if(links.length>0){this.read_wmc_OnlineResource(legend,links[0]);}
+style.legend=legend;},write:function(context,options){var root=this.createElementDefaultNS("ViewContext");this.setAttributes(root,{version:this.VERSION,id:(options&&typeof options.id=="string")?options.id:OpenLayers.Util.createUniqueID("OpenLayers_Context_")});this.setAttributeNS(root,this.namespaces.xsi,"xsi:schemaLocation",this.schemaLocation);root.appendChild(this.write_wmc_General(context));root.appendChild(this.write_wmc_LayerList(context));return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},createElementDefaultNS:function(name,childValue,attributes){var node=this.createElementNS(this.namespaces[this.defaultPrefix],name);if(childValue){node.appendChild(this.createTextNode(childValue));}
+if(attributes){this.setAttributes(node,attributes);}
+return node;},setAttributes:function(node,obj){var value;for(var name in obj){value=obj[name].toString();if(value.match(/[A-Z]/)){this.setAttributeNS(node,null,name,value);}else{node.setAttribute(name,value);}}},write_wmc_General:function(context){var node=this.createElementDefaultNS("General");if(context.size){node.appendChild(this.createElementDefaultNS("Window",null,{width:context.size.w,height:context.size.h}));}
+var bounds=context.bounds;node.appendChild(this.createElementDefaultNS("BoundingBox",null,{minx:bounds.left.toPrecision(18),miny:bounds.bottom.toPrecision(18),maxx:bounds.right.toPrecision(18),maxy:bounds.top.toPrecision(18),SRS:context.projection}));node.appendChild(this.createElementDefaultNS("Title",context.title));node.appendChild(this.write_ol_MapExtension(context));return node;},write_ol_MapExtension:function(context){var node=this.createElementDefaultNS("Extension");var bounds=context.maxExtent;if(bounds){var maxExtent=this.createElementNS(this.namespaces.ol,"ol:maxExtent");this.setAttributes(maxExtent,{minx:bounds.left.toPrecision(18),miny:bounds.bottom.toPrecision(18),maxx:bounds.right.toPrecision(18),maxy:bounds.top.toPrecision(18)});node.appendChild(maxExtent);}
+return node;},write_wmc_LayerList:function(context){var list=this.createElementDefaultNS("LayerList");for(var i=0,len=context.layersContext.length;i<len;++i){list.appendChild(this.write_wmc_Layer(context.layersContext[i]));}
+return list;},write_wmc_Layer:function(context){var node=this.createElementDefaultNS("Layer",null,{queryable:context.queryable?"1":"0",hidden:context.visibility?"0":"1"});node.appendChild(this.write_wmc_Server(context));node.appendChild(this.createElementDefaultNS("Name",context.name));node.appendChild(this.createElementDefaultNS("Title",context.title));if(context.metadataURL){node.appendChild(this.write_wmc_MetadataURL(context.metadataURL));}
+return node;},write_wmc_LayerExtension:function(context){var node=this.createElementDefaultNS("Extension");var bounds=context.maxExtent;var maxExtent=this.createElementNS(this.namespaces.ol,"ol:maxExtent");this.setAttributes(maxExtent,{minx:bounds.left.toPrecision(18),miny:bounds.bottom.toPrecision(18),maxx:bounds.right.toPrecision(18),maxy:bounds.top.toPrecision(18)});node.appendChild(maxExtent);if(context.tileSize&&!context.singleTile){var size=this.createElementNS(this.namespaces.ol,"ol:tileSize");this.setAttributes(size,context.tileSize);node.appendChild(size);}
+var properties=["transparent","numZoomLevels","units","isBaseLayer","opacity","displayInLayerSwitcher","singleTile"];var child;for(var i=0,len=properties.length;i<len;++i){child=this.createOLPropertyNode(context,properties[i]);if(child){node.appendChild(child);}}
+return node;},createOLPropertyNode:function(obj,prop){var node=null;if(obj[prop]!=null){node=this.createElementNS(this.namespaces.ol,"ol:"+prop);node.appendChild(this.createTextNode(obj[prop].toString()));}
+return node;},write_wmc_Server:function(context){var node=this.createElementDefaultNS("Server");this.setAttributes(node,{service:"OGC:WMS",version:context.version});node.appendChild(this.write_wmc_OnlineResource(context.url));return node;},write_wmc_MetadataURL:function(metadataURL){var node=this.createElementDefaultNS("MetadataURL");node.appendChild(this.write_wmc_OnlineResource(metadataURL));return node;},write_wmc_FormatList:function(context){var node=this.createElementDefaultNS("FormatList");for(var i=0,len=context.formats.length;i<len;i++){var format=context.formats[i];node.appendChild(this.createElementDefaultNS("Format",format.value,(format.current&&format.current==true)?{current:"1"}:null));}
+return node;},write_wmc_StyleList:function(layer){var node=this.createElementDefaultNS("StyleList");var styles=layer.styles;if(styles&&styles instanceof Array){var sld;for(var i=0,len=styles.length;i<len;i++){var s=styles[i];var style=this.createElementDefaultNS("Style",null,(s.current&&s.current==true)?{current:"1"}:null);if(s.href){sld=this.createElementDefaultNS("SLD");var link=this.write_wmc_OnlineResource(s.href);sld.appendChild(link);sld.appendChild(this.createElementDefaultNS("Name",s.name));if(s.title){sld.appendChild(this.createElementDefaultNS("Title",s.title));}
+style.appendChild(sld);}else if(s.body){sld=this.createElementDefaultNS("SLD");var doc=OpenLayers.Format.XML.prototype.read.apply(this,[s.body]);var imported=doc.documentElement;if(sld.ownerDocument&&sld.ownerDocument.importNode){imported=sld.ownerDocument.importNode(imported,true);}
+sld.appendChild(imported);sld.appendChild(this.createElementDefaultNS("Name",s.name));if(s.title){sld.appendChild(this.createElementDefaultNS("Title",s.title));}
+style.appendChild(sld);}else{style.appendChild(this.createElementDefaultNS("Name",s.name));style.appendChild(this.createElementDefaultNS("Title",s.title));if(s['abstract']){style.appendChild(this.createElementDefaultNS("Abstract",s['abstract']));}}
+node.appendChild(style);}}
+return node;},write_wmc_OnlineResource:function(href){var node=this.createElementDefaultNS("OnlineResource");this.setAttributeNS(node,this.namespaces.xlink,"xlink:type","simple");this.setAttributeNS(node,this.namespaces.xlink,"xlink:href",href);return node;},CLASS_NAME:"OpenLayers.Format.WMC.v1"});OpenLayers.Format.WMSCapabilities.v1_1=OpenLayers.Class(OpenLayers.Format.WMSCapabilities.v1,{readers:{"wms":OpenLayers.Util.applyDefaults({"WMT_MS_Capabilities":function(node,obj){this.readChildNodes(node,obj);},"Keyword":function(node,obj){if(obj.keywords){obj.keywords.push(this.getChildValue(node));}},"DescribeLayer":function(node,obj){obj.describelayer={formats:[]};this.readChildNodes(node,obj.describelayer);},"GetLegendGraphic":function(node,obj){obj.getlegendgraphic={formats:[]};this.readChildNodes(node,obj.getlegendgraphic);},"GetStyles":function(node,obj){obj.getstyles={formats:[]};this.readChildNodes(node,obj.getstyles);},"PutStyles":function(node,obj){obj.putstyles={formats:[]};this.readChildNodes(node,obj.putstyles);},"UserDefinedSymbolization":function(node,obj){var userSymbols={supportSLD:parseInt(node.getAttribute("SupportSLD"))==1,userLayer:parseInt(node.getAttribute("UserLayer"))==1,userStyle:parseInt(node.getAttribute("UserStyle"))==1,remoteWFS:parseInt(node.getAttribute("RemoteWFS"))==1};obj.userSymbols=userSymbols;},"LatLonBoundingBox":function(node,obj){obj.llbbox=[parseFloat(node.getAttribute("minx")),parseFloat(node.getAttribute("miny")),parseFloat(node.getAttribute("maxx")),parseFloat(node.getAttribute("maxy"))];},"BoundingBox":function(node,obj){var bbox=OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"].BoundingBox.apply(this,[node,obj]);bbox.srs=node.getAttribute("SRS");obj.bbox[bbox.srs]=bbox;},"ScaleHint":function(node,obj){var min=node.getAttribute("min");var max=node.getAttribute("max");var rad2=Math.pow(2,0.5);var ipm=OpenLayers.INCHES_PER_UNIT["m"];obj.maxScale=parseFloat(((min/rad2)*ipm*OpenLayers.DOTS_PER_INCH).toPrecision(13));obj.minScale=parseFloat(((max/rad2)*ipm*OpenLayers.DOTS_PER_INCH).toPrecision(13));},"Dimension":function(node,obj){var name=node.getAttribute("name").toLowerCase();var dim={name:name,units:node.getAttribute("units"),unitsymbol:node.getAttribute("unitSymbol")};obj.dimensions[dim.name]=dim;},"Extent":function(node,obj){var name=node.getAttribute("name").toLowerCase();if(name in obj["dimensions"]){var extent=obj.dimensions[name];extent.nearestVal=node.getAttribute("nearestValue")==="1";extent.multipleVal=node.getAttribute("multipleValues")==="1";extent.current=node.getAttribute("current")==="1";extent["default"]=node.getAttribute("default")||"";var values=this.getChildValue(node);extent.values=values.split(",");}}},OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"])},CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1_1"});OpenLayers.Format.WMSCapabilities.v1_3=OpenLayers.Class(OpenLayers.Format.WMSCapabilities.v1,{readers:{"wms":OpenLayers.Util.applyDefaults({"WMS_Capabilities":function(node,obj){this.readChildNodes(node,obj);},"LayerLimit":function(node,obj){obj.layerLimit=parseInt(this.getChildValue(node));},"MaxWidth":function(node,obj){obj.maxWidth=parseInt(this.getChildValue(node));},"MaxHeight":function(node,obj){obj.maxHeight=parseInt(this.getChildValue(node));},"BoundingBox":function(node,obj){var bbox=OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"].BoundingBox.apply(this,[node,obj]);bbox.srs=node.getAttribute("CRS");obj.bbox[bbox.srs]=bbox;},"CRS":function(node,obj){this.readers.wms.SRS.apply(this,[node,obj]);},"EX_GeographicBoundingBox":function(node,obj){obj.llbbox=[];this.readChildNodes(node,obj.llbbox);},"westBoundLongitude":function(node,obj){obj[0]=this.getChildValue(node);},"eastBoundLongitude":function(node,obj){obj[2]=this.getChildValue(node);},"southBoundLatitude":function(node,obj){obj[1]=this.getChildValue(node);},"northBoundLatitude":function(node,obj){obj[3]=this.getChildValue(node);},"MinScaleDenominator":function(node,obj){obj.maxScale=parseFloat(this.getChildValue(node)).toPrecision(16);},"MaxScaleDenominator":function(node,obj){obj.minScale=parseFloat(this.getChildValue(node)).toPrecision(16);},"Dimension":function(node,obj){var name=node.getAttribute("name").toLowerCase();var dim={name:name,units:node.getAttribute("units"),unitsymbol:node.getAttribute("unitSymbol"),nearestVal:node.getAttribute("nearestValue")==="1",multipleVal:node.getAttribute("multipleValues")==="1","default":node.getAttribute("default")||"",current:node.getAttribute("current")==="1",values:this.getChildValue(node).split(",")};obj.dimensions[dim.name]=dim;},"Keyword":function(node,obj){var keyword={value:this.getChildValue(node),vocabulary:node.getAttribute("vocabulary")};if(obj.keywords){obj.keywords.push(keyword);}}},OpenLayers.Format.WMSCapabilities.v1.prototype.readers["wms"]),"sld":{"UserDefinedSymbolization":function(node,obj){this.readers.wms.UserDefinedSymbolization.apply(this,[node,obj]);obj.userSymbols.inlineFeature=parseInt(node.getAttribute("InlineFeature"))==1;obj.userSymbols.remoteWCS=parseInt(node.getAttribute("RemoteWCS"))==1;},"DescribeLayer":function(node,obj){this.readers.wms.DescribeLayer.apply(this,[node,obj]);},"GetLegendGraphic":function(node,obj){this.readers.wms.GetLegendGraphic.apply(this,[node,obj]);}}},CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1_3"});OpenLayers.Format.WMTSCapabilities.v1_0_0=OpenLayers.Class(OpenLayers.Format.OWSCommon.v1_1_0,{version:"1.0.0",namespaces:{ows:"http://www.opengis.net/ows/1.1",wmts:"http://www.opengis.net/wmts/1.0",xlink:"http://www.w3.org/1999/xlink"},yx:null,defaultPrefix:"wmts",initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;var yx=OpenLayers.Util.extend({},OpenLayers.Format.WMTSCapabilities.prototype.yx);this.yx=OpenLayers.Util.extend(yx,this.yx);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var capabilities={};this.readNode(data,capabilities);capabilities.version=this.version;return capabilities;},readers:{"wmts":{"Capabilities":function(node,obj){this.readChildNodes(node,obj);},"Contents":function(node,obj){obj.contents={};obj.contents.layers=[];obj.contents.tileMatrixSets={};this.readChildNodes(node,obj.contents);},"Layer":function(node,obj){var layer={styles:[],formats:[],tileMatrixSetLinks:[]};layer.layers=[];this.readChildNodes(node,layer);obj.layers.push(layer);},"Style":function(node,obj){var style={};style.isDefault=(node.getAttribute("isDefault")==="true");this.readChildNodes(node,style);obj.styles.push(style);},"Format":function(node,obj){obj.formats.push(this.getChildValue(node));},"TileMatrixSetLink":function(node,obj){var tileMatrixSetLink={};this.readChildNodes(node,tileMatrixSetLink);obj.tileMatrixSetLinks.push(tileMatrixSetLink);},"TileMatrixSet":function(node,obj){if(obj.layers){var tileMatrixSet={matrixIds:[]};this.readChildNodes(node,tileMatrixSet);obj.tileMatrixSets[tileMatrixSet.identifier]=tileMatrixSet;}else{obj.tileMatrixSet=this.getChildValue(node);}},"TileMatrix":function(node,obj){var tileMatrix={supportedCRS:obj.supportedCRS};this.readChildNodes(node,tileMatrix);obj.matrixIds.push(tileMatrix);},"ScaleDenominator":function(node,obj){obj.scaleDenominator=parseFloat(this.getChildValue(node));},"TopLeftCorner":function(node,obj){var topLeftCorner=this.getChildValue(node);var coords=topLeftCorner.split(" ");var yx;if(obj.supportedCRS){var crs=obj.supportedCRS.replace(/urn:ogc:def:crs:(\w+):.+:(\w+)$/,"urn:ogc:def:crs:$1::$2");yx=!!this.yx[crs];}
+if(yx){obj.topLeftCorner=new OpenLayers.LonLat(coords[1],coords[0]);}else{obj.topLeftCorner=new OpenLayers.LonLat(coords[0],coords[1]);}},"TileWidth":function(node,obj){obj.tileWidth=parseInt(this.getChildValue(node));},"TileHeight":function(node,obj){obj.tileHeight=parseInt(this.getChildValue(node));},"MatrixWidth":function(node,obj){obj.matrixWidth=parseInt(this.getChildValue(node));},"MatrixHeight":function(node,obj){obj.matrixHeight=parseInt(this.getChildValue(node));},"WSDL":function(node,obj){obj.wsdl={};obj.wsdl.href=node.getAttribute("xlink:href");},"ServiceMetadataURL":function(node,obj){obj.serviceMetadataUrl={};obj.serviceMetadataUrl.href=node.getAttribute("xlink:href");}},"ows":OpenLayers.Format.OWSCommon.v1_1_0.prototype.readers["ows"]},CLASS_NAME:"OpenLayers.Format.WMTSCapabilities.v1_0_0"});OpenLayers.Layer.Boxes=OpenLayers.Class(OpenLayers.Layer.Markers,{initialize:function(name,options){OpenLayers.Layer.Markers.prototype.initialize.apply(this,arguments);},drawMarker:function(marker){var bounds=marker.bounds;var topleft=this.map.getLayerPxFromLonLat(new OpenLayers.LonLat(bounds.left,bounds.top));var botright=this.map.getLayerPxFromLonLat(new OpenLayers.LonLat(bounds.right,bounds.bottom));if(botright==null||topleft==null){marker.display(false);}else{var sz=new OpenLayers.Size(Math.max(1,botright.x-topleft.x),Math.max(1,botright.y-topleft.y));var markerDiv=marker.draw(topleft,sz);if(!marker.drawn){this.div.appendChild(markerDiv);marker.drawn=true;}}},removeMarker:function(marker){OpenLayers.Util.removeItem(this.markers,marker);if((marker.div!=null)&&(marker.div.parentNode==this.div)){this.div.removeChild(marker.div);}},CLASS_NAME:"OpenLayers.Layer.Boxes"});OpenLayers.Layer.GeoRSS=OpenLayers.Class(OpenLayers.Layer.Markers,{location:null,features:null,formatOptions:null,selectedFeature:null,icon:null,popupSize:null,useFeedTitle:true,initialize:function(name,location,options){OpenLayers.Layer.Markers.prototype.initialize.apply(this,[name,options]);this.location=location;this.features=[];},destroy:function(){OpenLayers.Layer.Markers.prototype.destroy.apply(this,arguments);this.clearFeatures();this.features=null;},loadRSS:function(){if(!this.loaded){this.events.triggerEvent("loadstart");OpenLayers.Request.GET({url:this.location,success:this.parseData,scope:this});this.loaded=true;}},moveTo:function(bounds,zoomChanged,minor){OpenLayers.Layer.Markers.prototype.moveTo.apply(this,arguments);if(this.visibility&&!this.loaded){this.loadRSS();}},parseData:function(ajaxRequest){var doc=ajaxRequest.responseXML;if(!doc||!doc.documentElement){doc=OpenLayers.Format.XML.prototype.read(ajaxRequest.responseText);}
+if(this.useFeedTitle){var name=null;try{name=doc.getElementsByTagNameNS('*','title')[0].firstChild.nodeValue;}
+catch(e){name=doc.getElementsByTagName('title')[0].firstChild.nodeValue;}
+if(name){this.setName(name);}}
+var options={};OpenLayers.Util.extend(options,this.formatOptions);if(this.map&&!this.projection.equals(this.map.getProjectionObject())){options.externalProjection=this.projection;options.internalProjection=this.map.getProjectionObject();}
+var format=new OpenLayers.Format.GeoRSS(options);var features=format.read(doc);for(var i=0,len=features.length;i<len;i++){var data={};var feature=features[i];if(!feature.geometry){continue;}
+var title=feature.attributes.title?feature.attributes.title:"Untitled";var description=feature.attributes.description?feature.attributes.description:"No description.";var link=feature.attributes.link?feature.attributes.link:"";var location=feature.geometry.getBounds().getCenterLonLat();data.icon=this.icon==null?OpenLayers.Marker.defaultIcon():this.icon.clone();data.popupSize=this.popupSize?this.popupSize.clone():new OpenLayers.Size(250,120);if(title||description){data.title=title;data.description=description;var contentHTML='<div class="olLayerGeoRSSClose">[x]</div>';contentHTML+='<div class="olLayerGeoRSSTitle">';if(link){contentHTML+='<a class="link" href="'+link+'" target="_blank">';}
+contentHTML+=title;if(link){contentHTML+='</a>';}
+contentHTML+='</div>';contentHTML+='<div style="" class="olLayerGeoRSSDescription">';contentHTML+=description;contentHTML+='</div>';data['popupContentHTML']=contentHTML;}
+var feature=new OpenLayers.Feature(this,location,data);this.features.push(feature);var marker=feature.createMarker();marker.events.register('click',feature,this.markerClick);this.addMarker(marker);}
+this.events.triggerEvent("loadend");},markerClick:function(evt){var sameMarkerClicked=(this==this.layer.selectedFeature);this.layer.selectedFeature=(!sameMarkerClicked)?this:null;for(var i=0,len=this.layer.map.popups.length;i<len;i++){this.layer.map.removePopup(this.layer.map.popups[i]);}
+if(!sameMarkerClicked){var popup=this.createPopup();OpenLayers.Event.observe(popup.div,"click",OpenLayers.Function.bind(function(){for(var i=0,len=this.layer.map.popups.length;i<len;i++){this.layer.map.removePopup(this.layer.map.popups[i]);}},this));this.layer.map.addPopup(popup);}
+OpenLayers.Event.stop(evt);},clearFeatures:function(){if(this.features!=null){while(this.features.length>0){var feature=this.features[0];OpenLayers.Util.removeItem(this.features,feature);feature.destroy();}}},CLASS_NAME:"OpenLayers.Layer.GeoRSS"});OpenLayers.Layer.Google=OpenLayers.Class(OpenLayers.Layer.EventPane,OpenLayers.Layer.FixedZoomLevels,{MIN_ZOOM_LEVEL:0,MAX_ZOOM_LEVEL:21,RESOLUTIONS:[1.40625,0.703125,0.3515625,0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.001373291015625,0.0006866455078125,0.00034332275390625,0.000171661376953125,0.0000858306884765625,0.00004291534423828125,0.00002145767211914062,0.00001072883605957031,0.00000536441802978515,0.00000268220901489257,0.0000013411045074462891,0.00000067055225372314453],type:null,wrapDateLine:true,sphericalMercator:false,version:null,initialize:function(name,options){options=options||{};if(!options.version){options.version=typeof GMap2==="function"?"2":"3";}
+var mixin=OpenLayers.Layer.Google["v"+
+options.version.replace(/\./g,"_")];if(mixin){OpenLayers.Util.applyDefaults(options,mixin);}else{throw"Unsupported Google Maps API version: "+options.version;}
+OpenLayers.Util.applyDefaults(options,mixin.DEFAULTS);if(options.maxExtent){options.maxExtent=options.maxExtent.clone();}
+OpenLayers.Layer.EventPane.prototype.initialize.apply(this,[name,options]);OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this,[name,options]);if(this.sphericalMercator){OpenLayers.Util.extend(this,OpenLayers.Layer.SphericalMercator);this.initMercatorParameters();}},clone:function(){return new OpenLayers.Layer.Google(this.name,this.getOptions());},setVisibility:function(visible){var opacity=this.opacity==null?1:this.opacity;OpenLayers.Layer.EventPane.prototype.setVisibility.apply(this,arguments);this.setOpacity(opacity);},display:function(visible){if(!this._dragging){this.setGMapVisibility(visible);}
+OpenLayers.Layer.EventPane.prototype.display.apply(this,arguments);},moveTo:function(bounds,zoomChanged,dragging){this._dragging=dragging;OpenLayers.Layer.EventPane.prototype.moveTo.apply(this,arguments);delete this._dragging;},setOpacity:function(opacity){if(opacity!==this.opacity){if(this.map!=null){this.map.events.triggerEvent("changelayer",{layer:this,property:"opacity"});}
+this.opacity=opacity;}
+if(this.getVisibility()){var container=this.getMapContainer();OpenLayers.Util.modifyDOMElement(container,null,null,null,null,null,null,opacity);}},destroy:function(){if(this.map){this.setGMapVisibility(false);var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache&&cache.count<=1){this.removeGMapElements();}}
+OpenLayers.Layer.EventPane.prototype.destroy.apply(this,arguments);},removeGMapElements:function(){var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache){var container=this.mapObject&&this.getMapContainer();if(container&&container.parentNode){container.parentNode.removeChild(container);}
+var termsOfUse=cache.termsOfUse;if(termsOfUse&&termsOfUse.parentNode){termsOfUse.parentNode.removeChild(termsOfUse);}
+var poweredBy=cache.poweredBy;if(poweredBy&&poweredBy.parentNode){poweredBy.parentNode.removeChild(poweredBy);}}},removeMap:function(map){if(this.visibility&&this.mapObject){this.setGMapVisibility(false);}
+var cache=OpenLayers.Layer.Google.cache[map.id];if(cache){if(cache.count<=1){this.removeGMapElements();delete OpenLayers.Layer.Google.cache[map.id];}else{--cache.count;}}
+delete this.termsOfUse;delete this.poweredBy;delete this.mapObject;delete this.dragObject;OpenLayers.Layer.EventPane.prototype.removeMap.apply(this,arguments);},getOLBoundsFromMapObjectBounds:function(moBounds){var olBounds=null;if(moBounds!=null){var sw=moBounds.getSouthWest();var ne=moBounds.getNorthEast();if(this.sphericalMercator){sw=this.forwardMercator(sw.lng(),sw.lat());ne=this.forwardMercator(ne.lng(),ne.lat());}else{sw=new OpenLayers.LonLat(sw.lng(),sw.lat());ne=new OpenLayers.LonLat(ne.lng(),ne.lat());}
+olBounds=new OpenLayers.Bounds(sw.lon,sw.lat,ne.lon,ne.lat);}
+return olBounds;},getWarningHTML:function(){return OpenLayers.i18n("googleWarning");},getMapObjectCenter:function(){return this.mapObject.getCenter();},getMapObjectZoom:function(){return this.mapObject.getZoom();},getLongitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.lng(),moLonLat.lat()).lon:moLonLat.lng();},getLatitudeFromMapObjectLonLat:function(moLonLat){var lat=this.sphericalMercator?this.forwardMercator(moLonLat.lng(),moLonLat.lat()).lat:moLonLat.lat();return lat;},getXFromMapObjectPixel:function(moPixel){return moPixel.x;},getYFromMapObjectPixel:function(moPixel){return moPixel.y;},CLASS_NAME:"OpenLayers.Layer.Google"});OpenLayers.Layer.Google.cache={};OpenLayers.Layer.Google.v2={termsOfUse:null,poweredBy:null,dragObject:null,loadMapObject:function(){if(!this.type){this.type=G_NORMAL_MAP;}
+var mapObject,termsOfUse,poweredBy;var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache){mapObject=cache.mapObject;termsOfUse=cache.termsOfUse;poweredBy=cache.poweredBy;++cache.count;}else{var container=this.map.viewPortDiv;var div=document.createElement("div");div.id=this.map.id+"_GMap2Container";div.style.position="absolute";div.style.width="100%";div.style.height="100%";container.appendChild(div);try{mapObject=new GMap2(div);termsOfUse=div.lastChild;container.appendChild(termsOfUse);termsOfUse.style.zIndex="1100";termsOfUse.style.right="";termsOfUse.style.bottom="";termsOfUse.className="olLayerGoogleCopyright";poweredBy=div.lastChild;container.appendChild(poweredBy);poweredBy.style.zIndex="1100";poweredBy.style.right="";poweredBy.style.bottom="";poweredBy.className="olLayerGooglePoweredBy gmnoprint";}catch(e){throw(e);}
+OpenLayers.Layer.Google.cache[this.map.id]={mapObject:mapObject,termsOfUse:termsOfUse,poweredBy:poweredBy,count:1};}
+this.mapObject=mapObject;this.termsOfUse=termsOfUse;this.poweredBy=poweredBy;if(OpenLayers.Util.indexOf(this.mapObject.getMapTypes(),this.type)===-1){this.mapObject.addMapType(this.type);}
+if(typeof mapObject.getDragObject=="function"){this.dragObject=mapObject.getDragObject();}else{this.dragPanMapObject=null;}
+if(this.isBaseLayer===false){this.setGMapVisibility(this.div.style.display!=="none");}},onMapResize:function(){if(this.visibility&&this.mapObject.isLoaded()){this.mapObject.checkResize();}else{if(!this._resized){var layer=this;var handle=GEvent.addListener(this.mapObject,"load",function(){GEvent.removeListener(handle);delete layer._resized;layer.mapObject.checkResize();layer.moveTo(layer.map.getCenter(),layer.map.getZoom());});}
+this._resized=true;}},setGMapVisibility:function(visible){var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache){var container=this.mapObject.getContainer();if(visible===true){this.mapObject.setMapType(this.type);container.style.display="";this.termsOfUse.style.left="";this.termsOfUse.style.display="";this.poweredBy.style.display="";cache.displayed=this.id;}else{if(cache.displayed===this.id){delete cache.displayed;}
+if(!cache.displayed){container.style.display="none";this.termsOfUse.style.display="none";this.termsOfUse.style.left="-9999px";this.poweredBy.style.display="none";}}}},getMapContainer:function(){return this.mapObject.getContainer();},getMapObjectBoundsFromOLBounds:function(olBounds){var moBounds=null;if(olBounds!=null){var sw=this.sphericalMercator?this.inverseMercator(olBounds.bottom,olBounds.left):new OpenLayers.LonLat(olBounds.bottom,olBounds.left);var ne=this.sphericalMercator?this.inverseMercator(olBounds.top,olBounds.right):new OpenLayers.LonLat(olBounds.top,olBounds.right);moBounds=new GLatLngBounds(new GLatLng(sw.lat,sw.lon),new GLatLng(ne.lat,ne.lon));}
+return moBounds;},setMapObjectCenter:function(center,zoom){this.mapObject.setCenter(center,zoom);},dragPanMapObject:function(dX,dY){this.dragObject.moveBy(new GSize(-dX,dY));},getMapObjectLonLatFromMapObjectPixel:function(moPixel){return this.mapObject.fromContainerPixelToLatLng(moPixel);},getMapObjectPixelFromMapObjectLonLat:function(moLonLat){return this.mapObject.fromLatLngToContainerPixel(moLonLat);},getMapObjectZoomFromMapObjectBounds:function(moBounds){return this.mapObject.getBoundsZoomLevel(moBounds);},getMapObjectLonLatFromLonLat:function(lon,lat){var gLatLng;if(this.sphericalMercator){var lonlat=this.inverseMercator(lon,lat);gLatLng=new GLatLng(lonlat.lat,lonlat.lon);}else{gLatLng=new GLatLng(lat,lon);}
+return gLatLng;},getMapObjectPixelFromXY:function(x,y){return new GPoint(x,y);}};OpenLayers.Layer.Grid=OpenLayers.Class(OpenLayers.Layer.HTTPRequest,{tileSize:null,grid:null,singleTile:false,ratio:1.5,buffer:2,numLoadingTiles:0,initialize:function(name,url,params,options){OpenLayers.Layer.HTTPRequest.prototype.initialize.apply(this,arguments);this.events.addEventType("tileloaded");this.grid=[];},destroy:function(){this.clearGrid();this.grid=null;this.tileSize=null;OpenLayers.Layer.HTTPRequest.prototype.destroy.apply(this,arguments);},clearGrid:function(){if(this.grid){for(var iRow=0,len=this.grid.length;iRow<len;iRow++){var row=this.grid[iRow];for(var iCol=0,clen=row.length;iCol<clen;iCol++){var tile=row[iCol];this.removeTileMonitoringHooks(tile);tile.destroy();}}
+this.grid=[];}},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.Grid(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.HTTPRequest.prototype.clone.apply(this,[obj]);if(this.tileSize!=null){obj.tileSize=this.tileSize.clone();}
+obj.grid=[];return obj;},moveTo:function(bounds,zoomChanged,dragging){OpenLayers.Layer.HTTPRequest.prototype.moveTo.apply(this,arguments);bounds=bounds||this.map.getExtent();if(bounds!=null){var forceReTile=!this.grid.length||zoomChanged;var tilesBounds=this.getTilesBounds();if(this.singleTile){if(forceReTile||(!dragging&&!tilesBounds.containsBounds(bounds))){this.initSingleTile(bounds);}}else{if(forceReTile||!tilesBounds.containsBounds(bounds,true)){this.initGriddedTiles(bounds);}else{this.moveGriddedTiles(bounds);}}}},setTileSize:function(size){if(this.singleTile){size=this.map.getSize();size.h=parseInt(size.h*this.ratio);size.w=parseInt(size.w*this.ratio);}
+OpenLayers.Layer.HTTPRequest.prototype.setTileSize.apply(this,[size]);},getGridBounds:function(){var msg="The getGridBounds() function is deprecated. It will be "+"removed in 3.0. Please use getTilesBounds() instead.";OpenLayers.Console.warn(msg);return this.getTilesBounds();},getTilesBounds:function(){var bounds=null;if(this.grid.length){var bottom=this.grid.length-1;var bottomLeftTile=this.grid[bottom][0];var right=this.grid[0].length-1;var topRightTile=this.grid[0][right];bounds=new OpenLayers.Bounds(bottomLeftTile.bounds.left,bottomLeftTile.bounds.bottom,topRightTile.bounds.right,topRightTile.bounds.top);}
+return bounds;},initSingleTile:function(bounds){var center=bounds.getCenterLonLat();var tileWidth=bounds.getWidth()*this.ratio;var tileHeight=bounds.getHeight()*this.ratio;var tileBounds=new OpenLayers.Bounds(center.lon-(tileWidth/2),center.lat-(tileHeight/2),center.lon+(tileWidth/2),center.lat+(tileHeight/2));var ul=new OpenLayers.LonLat(tileBounds.left,tileBounds.top);var px=this.map.getLayerPxFromLonLat(ul);if(!this.grid.length){this.grid[0]=[];}
+var tile=this.grid[0][0];if(!tile){tile=this.addTile(tileBounds,px);this.addTileMonitoringHooks(tile);tile.draw();this.grid[0][0]=tile;}else{tile.moveTo(tileBounds,px);}
+this.removeExcessTiles(1,1);},calculateGridLayout:function(bounds,extent,resolution){var tilelon=resolution*this.tileSize.w;var tilelat=resolution*this.tileSize.h;var offsetlon=bounds.left-extent.left;var tilecol=Math.floor(offsetlon/tilelon)-this.buffer;var tilecolremain=offsetlon/tilelon-tilecol;var tileoffsetx=-tilecolremain*this.tileSize.w;var tileoffsetlon=extent.left+tilecol*tilelon;var offsetlat=bounds.top-(extent.bottom+tilelat);var tilerow=Math.ceil(offsetlat/tilelat)+this.buffer;var tilerowremain=tilerow-offsetlat/tilelat;var tileoffsety=-tilerowremain*this.tileSize.h;var tileoffsetlat=extent.bottom+tilerow*tilelat;return{tilelon:tilelon,tilelat:tilelat,tileoffsetlon:tileoffsetlon,tileoffsetlat:tileoffsetlat,tileoffsetx:tileoffsetx,tileoffsety:tileoffsety};},initGriddedTiles:function(bounds){var viewSize=this.map.getSize();var minRows=Math.ceil(viewSize.h/this.tileSize.h)+
+Math.max(1,2*this.buffer);var minCols=Math.ceil(viewSize.w/this.tileSize.w)+
+Math.max(1,2*this.buffer);var extent=this.getMaxExtent();var resolution=this.map.getResolution();var tileLayout=this.calculateGridLayout(bounds,extent,resolution);var tileoffsetx=Math.round(tileLayout.tileoffsetx);var tileoffsety=Math.round(tileLayout.tileoffsety);var tileoffsetlon=tileLayout.tileoffsetlon;var tileoffsetlat=tileLayout.tileoffsetlat;var tilelon=tileLayout.tilelon;var tilelat=tileLayout.tilelat;this.origin=new OpenLayers.Pixel(tileoffsetx,tileoffsety);var startX=tileoffsetx;var startLon=tileoffsetlon;var rowidx=0;var layerContainerDivLeft=parseInt(this.map.layerContainerDiv.style.left);var layerContainerDivTop=parseInt(this.map.layerContainerDiv.style.top);do{var row=this.grid[rowidx++];if(!row){row=[];this.grid.push(row);}
+tileoffsetlon=startLon;tileoffsetx=startX;var colidx=0;do{var tileBounds=new OpenLayers.Bounds(tileoffsetlon,tileoffsetlat,tileoffsetlon+tilelon,tileoffsetlat+tilelat);var x=tileoffsetx;x-=layerContainerDivLeft;var y=tileoffsety;y-=layerContainerDivTop;var px=new OpenLayers.Pixel(x,y);var tile=row[colidx++];if(!tile){tile=this.addTile(tileBounds,px);this.addTileMonitoringHooks(tile);row.push(tile);}else{tile.moveTo(tileBounds,px,false);}
+tileoffsetlon+=tilelon;tileoffsetx+=this.tileSize.w;}while((tileoffsetlon<=bounds.right+tilelon*this.buffer)||colidx<minCols);tileoffsetlat-=tilelat;tileoffsety+=this.tileSize.h;}while((tileoffsetlat>=bounds.bottom-tilelat*this.buffer)||rowidx<minRows);this.removeExcessTiles(rowidx,colidx);this.spiralTileLoad();},getMaxExtent:function(){return this.maxExtent;},spiralTileLoad:function(){var tileQueue=[];var directions=["right","down","left","up"];var iRow=0;var iCell=-1;var direction=OpenLayers.Util.indexOf(directions,"right");var directionsTried=0;while(directionsTried<directions.length){var testRow=iRow;var testCell=iCell;switch(directions[direction]){case"right":testCell++;break;case"down":testRow++;break;case"left":testCell--;break;case"up":testRow--;break;}
+var tile=null;if((testRow<this.grid.length)&&(testRow>=0)&&(testCell<this.grid[0].length)&&(testCell>=0)){tile=this.grid[testRow][testCell];}
+if((tile!=null)&&(!tile.queued)){tileQueue.unshift(tile);tile.queued=true;directionsTried=0;iRow=testRow;iCell=testCell;}else{direction=(direction+1)%4;directionsTried++;}}
+for(var i=0,len=tileQueue.length;i<len;i++){var tile=tileQueue[i];tile.draw();tile.queued=false;}},addTile:function(bounds,position){},addTileMonitoringHooks:function(tile){tile.onLoadStart=function(){if(this.numLoadingTiles==0){this.events.triggerEvent("loadstart");}
+this.numLoadingTiles++;};tile.events.register("loadstart",this,tile.onLoadStart);tile.onLoadEnd=function(){this.numLoadingTiles--;this.events.triggerEvent("tileloaded");if(this.numLoadingTiles==0){this.events.triggerEvent("loadend");}};tile.events.register("loadend",this,tile.onLoadEnd);tile.events.register("unload",this,tile.onLoadEnd);},removeTileMonitoringHooks:function(tile){tile.unload();tile.events.un({"loadstart":tile.onLoadStart,"loadend":tile.onLoadEnd,"unload":tile.onLoadEnd,scope:this});},moveGriddedTiles:function(bounds){var buffer=this.buffer||1;while(true){var tlLayer=this.grid[0][0].position;var tlViewPort=this.map.getViewPortPxFromLayerPx(tlLayer);if(tlViewPort.x>-this.tileSize.w*(buffer-1)){this.shiftColumn(true);}else if(tlViewPort.x<-this.tileSize.w*buffer){this.shiftColumn(false);}else if(tlViewPort.y>-this.tileSize.h*(buffer-1)){this.shiftRow(true);}else if(tlViewPort.y<-this.tileSize.h*buffer){this.shiftRow(false);}else{break;}};},shiftRow:function(prepend){var modelRowIndex=(prepend)?0:(this.grid.length-1);var grid=this.grid;var modelRow=grid[modelRowIndex];var resolution=this.map.getResolution();var deltaY=(prepend)?-this.tileSize.h:this.tileSize.h;var deltaLat=resolution*-deltaY;var row=(prepend)?grid.pop():grid.shift();for(var i=0,len=modelRow.length;i<len;i++){var modelTile=modelRow[i];var bounds=modelTile.bounds.clone();var position=modelTile.position.clone();bounds.bottom=bounds.bottom+deltaLat;bounds.top=bounds.top+deltaLat;position.y=position.y+deltaY;row[i].moveTo(bounds,position);}
+if(prepend){grid.unshift(row);}else{grid.push(row);}},shiftColumn:function(prepend){var deltaX=(prepend)?-this.tileSize.w:this.tileSize.w;var resolution=this.map.getResolution();var deltaLon=resolution*deltaX;for(var i=0,len=this.grid.length;i<len;i++){var row=this.grid[i];var modelTileIndex=(prepend)?0:(row.length-1);var modelTile=row[modelTileIndex];var bounds=modelTile.bounds.clone();var position=modelTile.position.clone();bounds.left=bounds.left+deltaLon;bounds.right=bounds.right+deltaLon;position.x=position.x+deltaX;var tile=prepend?this.grid[i].pop():this.grid[i].shift();tile.moveTo(bounds,position);if(prepend){row.unshift(tile);}else{row.push(tile);}}},removeExcessTiles:function(rows,columns){while(this.grid.length>rows){var row=this.grid.pop();for(var i=0,l=row.length;i<l;i++){var tile=row[i];this.removeTileMonitoringHooks(tile);tile.destroy();}}
+while(this.grid[0].length>columns){for(var i=0,l=this.grid.length;i<l;i++){var row=this.grid[i];var tile=row.pop();this.removeTileMonitoringHooks(tile);tile.destroy();}}},onMapResize:function(){if(this.singleTile){this.clearGrid();this.setTileSize();}},getTileBounds:function(viewPortPx){var maxExtent=this.maxExtent;var resolution=this.getResolution();var tileMapWidth=resolution*this.tileSize.w;var tileMapHeight=resolution*this.tileSize.h;var mapPoint=this.getLonLatFromViewPortPx(viewPortPx);var tileLeft=maxExtent.left+(tileMapWidth*Math.floor((mapPoint.lon-
+maxExtent.left)/tileMapWidth));var tileBottom=maxExtent.bottom+(tileMapHeight*Math.floor((mapPoint.lat-
+maxExtent.bottom)/tileMapHeight));return new OpenLayers.Bounds(tileLeft,tileBottom,tileLeft+tileMapWidth,tileBottom+tileMapHeight);},CLASS_NAME:"OpenLayers.Layer.Grid"});OpenLayers.Layer.MultiMap=OpenLayers.Class(OpenLayers.Layer.EventPane,OpenLayers.Layer.FixedZoomLevels,{MIN_ZOOM_LEVEL:1,MAX_ZOOM_LEVEL:17,RESOLUTIONS:[9,1.40625,0.703125,0.3515625,0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.001373291015625,0.0006866455078125,0.00034332275390625,0.000171661376953125,0.0000858306884765625,0.00004291534423828125],type:null,initialize:function(name,options){OpenLayers.Layer.EventPane.prototype.initialize.apply(this,arguments);OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this,arguments);if(this.sphericalMercator){OpenLayers.Util.extend(this,OpenLayers.Layer.SphericalMercator);this.initMercatorParameters();this.RESOLUTIONS.unshift(10);}},loadMapObject:function(){try{this.mapObject=new MultimapViewer(this.div);}catch(e){}},getWarningHTML:function(){return OpenLayers.i18n("getLayerWarning",{'layerType':"MM",'layerLib':"MultiMap"});},setMapObjectCenter:function(center,zoom){this.mapObject.goToPosition(center,zoom);},getMapObjectCenter:function(){return this.mapObject.getCurrentPosition();},getMapObjectZoom:function(){return this.mapObject.getZoomFactor();},getMapObjectLonLatFromMapObjectPixel:function(moPixel){moPixel.x=moPixel.x-(this.map.getSize().w/2);moPixel.y=moPixel.y-(this.map.getSize().h/2);return this.mapObject.getMapPositionAt(moPixel);},getMapObjectPixelFromMapObjectLonLat:function(moLonLat){return this.mapObject.geoPosToContainerPixels(moLonLat);},getLongitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.lon,moLonLat.lat).lon:moLonLat.lon;},getLatitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.lon,moLonLat.lat).lat:moLonLat.lat;},getMapObjectLonLatFromLonLat:function(lon,lat){var mmLatLon;if(this.sphericalMercator){var lonlat=this.inverseMercator(lon,lat);mmLatLon=new MMLatLon(lonlat.lat,lonlat.lon);}else{mmLatLon=new MMLatLon(lat,lon);}
+return mmLatLon;},getXFromMapObjectPixel:function(moPixel){return moPixel.x;},getYFromMapObjectPixel:function(moPixel){return moPixel.y;},getMapObjectPixelFromXY:function(x,y){return new MMPoint(x,y);},CLASS_NAME:"OpenLayers.Layer.MultiMap"});OpenLayers.Layer.VirtualEarth=OpenLayers.Class(OpenLayers.Layer.EventPane,OpenLayers.Layer.FixedZoomLevels,{MIN_ZOOM_LEVEL:1,MAX_ZOOM_LEVEL:19,RESOLUTIONS:[1.40625,0.703125,0.3515625,0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.001373291015625,0.0006866455078125,0.00034332275390625,0.000171661376953125,0.0000858306884765625,0.00004291534423828125,0.00002145767211914062,0.00001072883605957031,0.00000536441802978515],type:null,wrapDateLine:true,sphericalMercator:false,animationEnabled:true,initialize:function(name,options){OpenLayers.Layer.EventPane.prototype.initialize.apply(this,arguments);OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this,arguments);if(this.sphericalMercator){OpenLayers.Util.extend(this,OpenLayers.Layer.SphericalMercator);this.initMercatorParameters();}},loadMapObject:function(){var veDiv=OpenLayers.Util.createDiv(this.name);var sz=this.map.getSize();veDiv.style.width=sz.w+"px";veDiv.style.height=sz.h+"px";this.div.appendChild(veDiv);try{this.mapObject=new VEMap(this.name);}catch(e){}
+if(this.mapObject!=null){try{this.mapObject.LoadMap(null,null,this.type,true);this.mapObject.AttachEvent("onmousedown",OpenLayers.Function.True);}catch(e){}
+this.mapObject.HideDashboard();if(typeof this.mapObject.SetAnimationEnabled=="function"){this.mapObject.SetAnimationEnabled(this.animationEnabled);}}
+if(!this.mapObject||!this.mapObject.vemapcontrol||!this.mapObject.vemapcontrol.PanMap||(typeof this.mapObject.vemapcontrol.PanMap!="function")){this.dragPanMapObject=null;}},onMapResize:function(){this.mapObject.Resize(this.map.size.w,this.map.size.h);},getWarningHTML:function(){return OpenLayers.i18n("getLayerWarning",{'layerType':'VE','layerLib':'VirtualEarth'});},setMapObjectCenter:function(center,zoom){this.mapObject.SetCenterAndZoom(center,zoom);},getMapObjectCenter:function(){return this.mapObject.GetCenter();},dragPanMapObject:function(dX,dY){this.mapObject.vemapcontrol.PanMap(dX,-dY);},getMapObjectZoom:function(){return this.mapObject.GetZoomLevel();},getMapObjectLonLatFromMapObjectPixel:function(moPixel){return(typeof VEPixel!='undefined')?this.mapObject.PixelToLatLong(moPixel):this.mapObject.PixelToLatLong(moPixel.x,moPixel.y);},getMapObjectPixelFromMapObjectLonLat:function(moLonLat){return this.mapObject.LatLongToPixel(moLonLat);},getLongitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.Longitude,moLonLat.Latitude).lon:moLonLat.Longitude;},getLatitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.Longitude,moLonLat.Latitude).lat:moLonLat.Latitude;},getMapObjectLonLatFromLonLat:function(lon,lat){var veLatLong;if(this.sphericalMercator){var lonlat=this.inverseMercator(lon,lat);veLatLong=new VELatLong(lonlat.lat,lonlat.lon);}else{veLatLong=new VELatLong(lat,lon);}
+return veLatLong;},getXFromMapObjectPixel:function(moPixel){return moPixel.x;},getYFromMapObjectPixel:function(moPixel){return moPixel.y;},getMapObjectPixelFromXY:function(x,y){return(typeof VEPixel!='undefined')?new VEPixel(x,y):new Msn.VE.Pixel(x,y);},CLASS_NAME:"OpenLayers.Layer.VirtualEarth"});OpenLayers.Layer.Yahoo=OpenLayers.Class(OpenLayers.Layer.EventPane,OpenLayers.Layer.FixedZoomLevels,{MIN_ZOOM_LEVEL:0,MAX_ZOOM_LEVEL:17,RESOLUTIONS:[1.40625,0.703125,0.3515625,0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.001373291015625,0.0006866455078125,0.00034332275390625,0.000171661376953125,0.0000858306884765625,0.00004291534423828125,0.00002145767211914062,0.00001072883605957031],type:null,wrapDateLine:true,sphericalMercator:false,initialize:function(name,options){OpenLayers.Layer.EventPane.prototype.initialize.apply(this,arguments);OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this,arguments);if(this.sphericalMercator){OpenLayers.Util.extend(this,OpenLayers.Layer.SphericalMercator);this.initMercatorParameters();}},loadMapObject:function(){try{var size=this.getMapObjectSizeFromOLSize(this.map.getSize());this.mapObject=new YMap(this.div,this.type,size);this.mapObject.disableKeyControls();this.mapObject.disableDragMap();if(!this.mapObject.moveByXY||(typeof this.mapObject.moveByXY!="function")){this.dragPanMapObject=null;}}catch(e){}},onMapResize:function(){try{var size=this.getMapObjectSizeFromOLSize(this.map.getSize());this.mapObject.resizeTo(size);}catch(e){}},setMap:function(map){OpenLayers.Layer.EventPane.prototype.setMap.apply(this,arguments);this.map.events.register("moveend",this,this.fixYahooEventPane);},fixYahooEventPane:function(){var yahooEventPane=OpenLayers.Util.getElement("ygddfdiv");if(yahooEventPane!=null){if(yahooEventPane.parentNode!=null){yahooEventPane.parentNode.removeChild(yahooEventPane);}
+this.map.events.unregister("moveend",this,this.fixYahooEventPane);}},getWarningHTML:function(){return OpenLayers.i18n("getLayerWarning",{'layerType':'Yahoo','layerLib':'Yahoo'});},getOLZoomFromMapObjectZoom:function(moZoom){var zoom=null;if(moZoom!=null){zoom=OpenLayers.Layer.FixedZoomLevels.prototype.getOLZoomFromMapObjectZoom.apply(this,[moZoom]);zoom=18-zoom;}
+return zoom;},getMapObjectZoomFromOLZoom:function(olZoom){var zoom=null;if(olZoom!=null){zoom=OpenLayers.Layer.FixedZoomLevels.prototype.getMapObjectZoomFromOLZoom.apply(this,[olZoom]);zoom=18-zoom;}
+return zoom;},setMapObjectCenter:function(center,zoom){this.mapObject.drawZoomAndCenter(center,zoom);},getMapObjectCenter:function(){return this.mapObject.getCenterLatLon();},dragPanMapObject:function(dX,dY){this.mapObject.moveByXY({'x':-dX,'y':dY});},getMapObjectZoom:function(){return this.mapObject.getZoomLevel();},getMapObjectLonLatFromMapObjectPixel:function(moPixel){return this.mapObject.convertXYLatLon(moPixel);},getMapObjectPixelFromMapObjectLonLat:function(moLonLat){return this.mapObject.convertLatLonXY(moLonLat);},getLongitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.Lon,moLonLat.Lat).lon:moLonLat.Lon;},getLatitudeFromMapObjectLonLat:function(moLonLat){return this.sphericalMercator?this.forwardMercator(moLonLat.Lon,moLonLat.Lat).lat:moLonLat.Lat;},getMapObjectLonLatFromLonLat:function(lon,lat){var yLatLong;if(this.sphericalMercator){var lonlat=this.inverseMercator(lon,lat);yLatLong=new YGeoPoint(lonlat.lat,lonlat.lon);}else{yLatLong=new YGeoPoint(lat,lon);}
+return yLatLong;},getXFromMapObjectPixel:function(moPixel){return moPixel.x;},getYFromMapObjectPixel:function(moPixel){return moPixel.y;},getMapObjectPixelFromXY:function(x,y){return new YCoordPoint(x,y);},getMapObjectSizeFromOLSize:function(olSize){return new YSize(olSize.w,olSize.h);},CLASS_NAME:"OpenLayers.Layer.Yahoo"});OpenLayers.Style=OpenLayers.Class({id:null,name:null,title:null,description:null,layerName:null,isDefault:false,rules:null,context:null,defaultStyle:null,defaultsPerSymbolizer:false,propertyStyles:null,initialize:function(style,options){OpenLayers.Util.extend(this,options);this.rules=[];if(options&&options.rules){this.addRules(options.rules);}
+this.setDefaultStyle(style||OpenLayers.Feature.Vector.style["default"]);this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},destroy:function(){for(var i=0,len=this.rules.length;i<len;i++){this.rules[i].destroy();this.rules[i]=null;}
+this.rules=null;this.defaultStyle=null;},createSymbolizer:function(feature){var style=this.defaultsPerSymbolizer?{}:this.createLiterals(OpenLayers.Util.extend({},this.defaultStyle),feature);var rules=this.rules;var rule,context;var elseRules=[];var appliedRules=false;for(var i=0,len=rules.length;i<len;i++){rule=rules[i];var applies=rule.evaluate(feature);if(applies){if(rule instanceof OpenLayers.Rule&&rule.elseFilter){elseRules.push(rule);}else{appliedRules=true;this.applySymbolizer(rule,style,feature);}}}
+if(appliedRules==false&&elseRules.length>0){appliedRules=true;for(var i=0,len=elseRules.length;i<len;i++){this.applySymbolizer(elseRules[i],style,feature);}}
+if(rules.length>0&&appliedRules==false){style.display="none";}
+return style;},applySymbolizer:function(rule,style,feature){var symbolizerPrefix=feature.geometry?this.getSymbolizerPrefix(feature.geometry):OpenLayers.Style.SYMBOLIZER_PREFIXES[0];var symbolizer=rule.symbolizer[symbolizerPrefix]||rule.symbolizer;if(this.defaultsPerSymbolizer===true){var defaults=this.defaultStyle;OpenLayers.Util.applyDefaults(symbolizer,{pointRadius:defaults.pointRadius});if(symbolizer.stroke===true||symbolizer.graphic===true){OpenLayers.Util.applyDefaults(symbolizer,{strokeWidth:defaults.strokeWidth,strokeColor:defaults.strokeColor,strokeOpacity:defaults.strokeOpacity,strokeDashstyle:defaults.strokeDashstyle,strokeLinecap:defaults.strokeLinecap});}
+if(symbolizer.fill===true||symbolizer.graphic===true){OpenLayers.Util.applyDefaults(symbolizer,{fillColor:defaults.fillColor,fillOpacity:defaults.fillOpacity});}
+if(symbolizer.graphic===true){OpenLayers.Util.applyDefaults(symbolizer,{pointRadius:this.defaultStyle.pointRadius,externalGraphic:this.defaultStyle.externalGraphic,graphicName:this.defaultStyle.graphicName,graphicOpacity:this.defaultStyle.graphicOpacity,graphicWidth:this.defaultStyle.graphicWidth,graphicHeight:this.defaultStyle.graphicHeight,graphicXOffset:this.defaultStyle.graphicXOffset,graphicYOffset:this.defaultStyle.graphicYOffset});}}
+return this.createLiterals(OpenLayers.Util.extend(style,symbolizer),feature);},createLiterals:function(style,feature){var context=OpenLayers.Util.extend({},feature.attributes||feature.data);OpenLayers.Util.extend(context,this.context);for(var i in this.propertyStyles){style[i]=OpenLayers.Style.createLiteral(style[i],context,feature,i);}
+return style;},findPropertyStyles:function(){var propertyStyles={};var style=this.defaultStyle;this.addPropertyStyles(propertyStyles,style);var rules=this.rules;var symbolizer,value;for(var i=0,len=rules.length;i<len;i++){symbolizer=rules[i].symbolizer;for(var key in symbolizer){value=symbolizer[key];if(typeof value=="object"){this.addPropertyStyles(propertyStyles,value);}else{this.addPropertyStyles(propertyStyles,symbolizer);break;}}}
+return propertyStyles;},addPropertyStyles:function(propertyStyles,symbolizer){var property;for(var key in symbolizer){property=symbolizer[key];if(typeof property=="string"&&property.match(/\$\{\w+\}/)){propertyStyles[key]=true;}}
+return propertyStyles;},addRules:function(rules){Array.prototype.push.apply(this.rules,rules);this.propertyStyles=this.findPropertyStyles();},setDefaultStyle:function(style){this.defaultStyle=style;this.propertyStyles=this.findPropertyStyles();},getSymbolizerPrefix:function(geometry){var prefixes=OpenLayers.Style.SYMBOLIZER_PREFIXES;for(var i=0,len=prefixes.length;i<len;i++){if(geometry.CLASS_NAME.indexOf(prefixes[i])!=-1){return prefixes[i];}}},clone:function(){var options=OpenLayers.Util.extend({},this);if(this.rules){options.rules=[];for(var i=0,len=this.rules.length;i<len;++i){options.rules.push(this.rules[i].clone());}}
+options.context=this.context&&OpenLayers.Util.extend({},this.context);var defaultStyle=OpenLayers.Util.extend({},this.defaultStyle);return new OpenLayers.Style(defaultStyle,options);},CLASS_NAME:"OpenLayers.Style"});OpenLayers.Style.createLiteral=function(value,context,feature,property){if(typeof value=="string"&&value.indexOf("${")!=-1){value=OpenLayers.String.format(value,context,[feature,property]);value=(isNaN(value)||!value)?value:parseFloat(value);}
+return value;};OpenLayers.Style.SYMBOLIZER_PREFIXES=['Point','Line','Polygon','Text','Raster'];OpenLayers.Control.Navigation=OpenLayers.Class(OpenLayers.Control,{dragPan:null,dragPanOptions:null,documentDrag:false,zoomBox:null,zoomBoxEnabled:true,zoomWheelEnabled:true,mouseWheelOptions:null,handleRightClicks:false,zoomBoxKeyMask:OpenLayers.Handler.MOD_SHIFT,autoActivate:true,initialize:function(options){this.handlers={};OpenLayers.Control.prototype.initialize.apply(this,arguments);},destroy:function(){this.deactivate();if(this.dragPan){this.dragPan.destroy();}
+this.dragPan=null;if(this.zoomBox){this.zoomBox.destroy();}
+this.zoomBox=null;OpenLayers.Control.prototype.destroy.apply(this,arguments);},activate:function(){this.dragPan.activate();if(this.zoomWheelEnabled){this.handlers.wheel.activate();}
+this.handlers.click.activate();if(this.zoomBoxEnabled){this.zoomBox.activate();}
+return OpenLayers.Control.prototype.activate.apply(this,arguments);},deactivate:function(){this.zoomBox.deactivate();this.dragPan.deactivate();this.handlers.click.deactivate();this.handlers.wheel.deactivate();return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},draw:function(){if(this.handleRightClicks){this.map.viewPortDiv.oncontextmenu=OpenLayers.Function.False;}
+var clickCallbacks={'dblclick':this.defaultDblClick,'dblrightclick':this.defaultDblRightClick};var clickOptions={'double':true,'stopDouble':true};this.handlers.click=new OpenLayers.Handler.Click(this,clickCallbacks,clickOptions);this.dragPan=new OpenLayers.Control.DragPan(OpenLayers.Util.extend({map:this.map,documentDrag:this.documentDrag},this.dragPanOptions));this.zoomBox=new OpenLayers.Control.ZoomBox({map:this.map,keyMask:this.zoomBoxKeyMask});this.dragPan.draw();this.zoomBox.draw();this.handlers.wheel=new OpenLayers.Handler.MouseWheel(this,{"up":this.wheelUp,"down":this.wheelDown},this.mouseWheelOptions);},defaultDblClick:function(evt){var newCenter=this.map.getLonLatFromViewPortPx(evt.xy);this.map.setCenter(newCenter,this.map.zoom+1);},defaultDblRightClick:function(evt){var newCenter=this.map.getLonLatFromViewPortPx(evt.xy);this.map.setCenter(newCenter,this.map.zoom-1);},wheelChange:function(evt,deltaZ){var currentZoom=this.map.getZoom();var newZoom=this.map.getZoom()+Math.round(deltaZ);newZoom=Math.max(newZoom,0);newZoom=Math.min(newZoom,this.map.getNumZoomLevels());if(newZoom===currentZoom){return;}
+var size=this.map.getSize();var deltaX=size.w/2-evt.xy.x;var deltaY=evt.xy.y-size.h/2;var newRes=this.map.baseLayer.getResolutionForZoom(newZoom);var zoomPoint=this.map.getLonLatFromPixel(evt.xy);var newCenter=new OpenLayers.LonLat(zoomPoint.lon+deltaX*newRes,zoomPoint.lat+deltaY*newRes);this.map.setCenter(newCenter,newZoom);},wheelUp:function(evt,delta){this.wheelChange(evt,delta||1);},wheelDown:function(evt,delta){this.wheelChange(evt,delta||-1);},disableZoomBox:function(){this.zoomBoxEnabled=false;this.zoomBox.deactivate();},enableZoomBox:function(){this.zoomBoxEnabled=true;if(this.active){this.zoomBox.activate();}},disableZoomWheel:function(){this.zoomWheelEnabled=false;this.handlers.wheel.deactivate();},enableZoomWheel:function(){this.zoomWheelEnabled=true;if(this.active){this.handlers.wheel.activate();}},CLASS_NAME:"OpenLayers.Control.Navigation"});OpenLayers.Filter=OpenLayers.Class({initialize:function(options){OpenLayers.Util.extend(this,options);},destroy:function(){},evaluate:function(context){return true;},clone:function(){return null;},CLASS_NAME:"OpenLayers.Filter"});OpenLayers.Format.WMC.v1_0_0=OpenLayers.Class(OpenLayers.Format.WMC.v1,{VERSION:"1.0.0",schemaLocation:"http://www.opengis.net/context http://schemas.opengis.net/context/1.0.0/context.xsd",initialize:function(options){OpenLayers.Format.WMC.v1.prototype.initialize.apply(this,[options]);},write_wmc_Layer:function(context){var node=OpenLayers.Format.WMC.v1.prototype.write_wmc_Layer.apply(this,[context]);node.appendChild(this.write_wmc_FormatList(context));node.appendChild(this.write_wmc_StyleList(context));node.appendChild(this.write_wmc_LayerExtension(context));},CLASS_NAME:"OpenLayers.Format.WMC.v1_0_0"});OpenLayers.Format.WMC.v1_1_0=OpenLayers.Class(OpenLayers.Format.WMC.v1,{VERSION:"1.1.0",schemaLocation:"http://www.opengis.net/context http://schemas.opengis.net/context/1.1.0/context.xsd",initialize:function(options){OpenLayers.Format.WMC.v1.prototype.initialize.apply(this,[options]);},read_sld_MinScaleDenominator:function(layerContext,node){var minScaleDenominator=parseFloat(this.getChildValue(node));if(minScaleDenominator>0){layerContext.maxScale=minScaleDenominator;}},read_sld_MaxScaleDenominator:function(layerContext,node){layerContext.minScale=parseFloat(this.getChildValue(node));},write_wmc_Layer:function(context){var node=OpenLayers.Format.WMC.v1.prototype.write_wmc_Layer.apply(this,[context]);if(context.maxScale){var minSD=this.createElementNS(this.namespaces.sld,"sld:MinScaleDenominator");minSD.appendChild(this.createTextNode(context.maxScale.toPrecision(16)));node.appendChild(minSD);}
+if(context.minScale){var maxSD=this.createElementNS(this.namespaces.sld,"sld:MaxScaleDenominator");maxSD.appendChild(this.createTextNode(context.minScale.toPrecision(16)));node.appendChild(maxSD);}
+node.appendChild(this.write_wmc_FormatList(context));node.appendChild(this.write_wmc_StyleList(context));node.appendChild(this.write_wmc_LayerExtension(context));return node;},CLASS_NAME:"OpenLayers.Format.WMC.v1_1_0"});OpenLayers.Format.WMSCapabilities.v1_1_0=OpenLayers.Class(OpenLayers.Format.WMSCapabilities.v1_1,{version:"1.1.0",initialize:function(options){OpenLayers.Format.WMSCapabilities.v1_1.prototype.initialize.apply(this,[options]);},readers:{"wms":OpenLayers.Util.applyDefaults({"SRS":function(node,obj){var srs=this.getChildValue(node);var values=srs.split(/ +/);for(var i=0,len=values.length;i<len;i++){obj.srs[values[i]]=true;}}},OpenLayers.Format.WMSCapabilities.v1_1.prototype.readers["wms"])},CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1_1_0"});OpenLayers.Format.WMSCapabilities.v1_1_1=OpenLayers.Class(OpenLayers.Format.WMSCapabilities.v1_1,{version:"1.1.1",initialize:function(options){OpenLayers.Format.WMSCapabilities.v1_1.prototype.initialize.apply(this,[options]);},readers:{"wms":OpenLayers.Util.applyDefaults({"SRS":function(node,obj){obj.srs[this.getChildValue(node)]=true;}},OpenLayers.Format.WMSCapabilities.v1_1.prototype.readers["wms"])},CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1_1_1"});OpenLayers.Format.WMSCapabilities.v1_3_0=OpenLayers.Class(OpenLayers.Format.WMSCapabilities.v1_3,{version:"1.3.0",CLASS_NAME:"OpenLayers.Format.WMSCapabilities.v1_3_0"});OpenLayers.Geometry=OpenLayers.Class({id:null,parent:null,bounds:null,initialize:function(){this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},destroy:function(){this.id=null;this.bounds=null;},clone:function(){return new OpenLayers.Geometry();},setBounds:function(bounds){if(bounds){this.bounds=bounds.clone();}},clearBounds:function(){this.bounds=null;if(this.parent){this.parent.clearBounds();}},extendBounds:function(newBounds){var bounds=this.getBounds();if(!bounds){this.setBounds(newBounds);}else{this.bounds.extend(newBounds);}},getBounds:function(){if(this.bounds==null){this.calculateBounds();}
+return this.bounds;},calculateBounds:function(){},distanceTo:function(geometry,options){},getVertices:function(nodes){},atPoint:function(lonlat,toleranceLon,toleranceLat){var atPoint=false;var bounds=this.getBounds();if((bounds!=null)&&(lonlat!=null)){var dX=(toleranceLon!=null)?toleranceLon:0;var dY=(toleranceLat!=null)?toleranceLat:0;var toleranceBounds=new OpenLayers.Bounds(this.bounds.left-dX,this.bounds.bottom-dY,this.bounds.right+dX,this.bounds.top+dY);atPoint=toleranceBounds.containsLonLat(lonlat);}
+return atPoint;},getLength:function(){return 0.0;},getArea:function(){return 0.0;},getCentroid:function(){return null;},toString:function(){return OpenLayers.Format.WKT.prototype.write(new OpenLayers.Feature.Vector(this));},CLASS_NAME:"OpenLayers.Geometry"});OpenLayers.Geometry.fromWKT=function(wkt){var format=arguments.callee.format;if(!format){format=new OpenLayers.Format.WKT();arguments.callee.format=format;}
+var geom;var result=format.read(wkt);if(result instanceof OpenLayers.Feature.Vector){geom=result.geometry;}else if(result instanceof Array){var len=result.length;var components=new Array(len);for(var i=0;i<len;++i){components[i]=result[i].geometry;}
+geom=new OpenLayers.Geometry.Collection(components);}
+return geom;};OpenLayers.Geometry.segmentsIntersect=function(seg1,seg2,options){var point=options&&options.point;var tolerance=options&&options.tolerance;var intersection=false;var x11_21=seg1.x1-seg2.x1;var y11_21=seg1.y1-seg2.y1;var x12_11=seg1.x2-seg1.x1;var y12_11=seg1.y2-seg1.y1;var y22_21=seg2.y2-seg2.y1;var x22_21=seg2.x2-seg2.x1;var d=(y22_21*x12_11)-(x22_21*y12_11);var n1=(x22_21*y11_21)-(y22_21*x11_21);var n2=(x12_11*y11_21)-(y12_11*x11_21);if(d==0){if(n1==0&&n2==0){intersection=true;}}else{var along1=n1/d;var along2=n2/d;if(along1>=0&&along1<=1&&along2>=0&&along2<=1){if(!point){intersection=true;}else{var x=seg1.x1+(along1*x12_11);var y=seg1.y1+(along1*y12_11);intersection=new OpenLayers.Geometry.Point(x,y);}}}
+if(tolerance){var dist;if(intersection){if(point){var segs=[seg1,seg2];var seg,x,y;outer:for(var i=0;i<2;++i){seg=segs[i];for(var j=1;j<3;++j){x=seg["x"+j];y=seg["y"+j];dist=Math.sqrt(Math.pow(x-intersection.x,2)+
+Math.pow(y-intersection.y,2));if(dist<tolerance){intersection.x=x;intersection.y=y;break outer;}}}}}else{var segs=[seg1,seg2];var source,target,x,y,p,result;outer:for(var i=0;i<2;++i){source=segs[i];target=segs[(i+1)%2];for(var j=1;j<3;++j){p={x:source["x"+j],y:source["y"+j]};result=OpenLayers.Geometry.distanceToSegment(p,target);if(result.distance<tolerance){if(point){intersection=new OpenLayers.Geometry.Point(p.x,p.y);}else{intersection=true;}
+break outer;}}}}}
+return intersection;};OpenLayers.Geometry.distanceToSegment=function(point,segment){var x0=point.x;var y0=point.y;var x1=segment.x1;var y1=segment.y1;var x2=segment.x2;var y2=segment.y2;var dx=x2-x1;var dy=y2-y1;var along=((dx*(x0-x1))+(dy*(y0-y1)))/(Math.pow(dx,2)+Math.pow(dy,2));var x,y;if(along<=0.0){x=x1;y=y1;}else if(along>=1.0){x=x2;y=y2;}else{x=x1+along*dx;y=y1+along*dy;}
+return{distance:Math.sqrt(Math.pow(x-x0,2)+Math.pow(y-y0,2)),x:x,y:y};};OpenLayers.Layer.ArcGIS93Rest=OpenLayers.Class(OpenLayers.Layer.Grid,{DEFAULT_PARAMS:{format:"png"},isBaseLayer:true,initialize:function(name,url,params,options){var newArguments=[];params=OpenLayers.Util.upperCaseObject(params);newArguments.push(name,url,params,options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);OpenLayers.Util.applyDefaults(this.params,OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS));if(this.params.TRANSPARENT&&this.params.TRANSPARENT.toString().toLowerCase()=="true"){if((options==null)||(!options.isBaseLayer)){this.isBaseLayer=false;}
+if(this.params.FORMAT=="jpg"){this.params.FORMAT=OpenLayers.Util.alphaHack()?"gif":"png";}}},destroy:function(){OpenLayers.Layer.Grid.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.ArcGIS93Rest(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getURL:function(bounds){bounds=this.adjustBounds(bounds);var projWords=this.projection.getCode().split(":");var srid=projWords[projWords.length-1];var imageSize=this.getImageSize();var newParams={'BBOX':bounds.toBBOX(),'SIZE':imageSize.w+","+imageSize.h,'F':"image",'BBOXSR':srid,'IMAGESR':srid};if(this.layerDefs){var layerDefStrList=[];var layerID;for(layerID in this.layerDefs){if(this.layerDefs.hasOwnProperty(layerID)){if(this.layerDefs[layerID]){layerDefStrList.push(layerID);layerDefStrList.push(":");layerDefStrList.push(this.layerDefs[layerID]);layerDefStrList.push(";");}}}
+if(layerDefStrList.length>0){newParams['LAYERDEFS']=layerDefStrList.join("");}}
+var requestString=this.getFullRequestString(newParams);return requestString;},setLayerFilter:function(id,queryDef){if(!this.layerDefs){this.layerDefs={};}
+if(queryDef){this.layerDefs[id]=queryDef;}else{delete this.layerDefs[id];}},clearLayerFilter:function(id){if(id){delete this.layerDefs[id];}else{delete this.layerDefs;}},mergeNewParams:function(newParams){var upperParams=OpenLayers.Util.upperCaseObject(newParams);var newArguments=[upperParams];return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(this,newArguments);},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},CLASS_NAME:"OpenLayers.Layer.ArcGIS93Rest"});OpenLayers.Layer.Google.v3={DEFAULTS:{maxExtent:new OpenLayers.Bounds(-128*156543.0339,-128*156543.0339,128*156543.0339,128*156543.0339),sphericalMercator:true,maxResolution:156543.0339,units:"m",projection:"EPSG:900913"},loadMapObject:function(){if(!this.type){this.type=google.maps.MapTypeId.ROADMAP;}
+var mapObject;var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache){mapObject=cache.mapObject;++cache.count;}else{var container=this.map.viewPortDiv;var div=document.createElement("div");div.id=this.map.id+"_GMapContainer";div.style.position="absolute";div.style.width="100%";div.style.height="100%";container.appendChild(div);var center=this.map.getCenter();mapObject=new google.maps.Map(div,{center:center?new google.maps.LatLng(center.lat,center.lon):new google.maps.LatLng(0,0),zoom:this.map.getZoom()||0,mapTypeId:this.type,disableDefaultUI:true,keyboardShortcuts:false,draggable:false,disableDoubleClickZoom:true,scrollwheel:false});cache={mapObject:mapObject,count:1};OpenLayers.Layer.Google.cache[this.map.id]=cache;this.repositionListener=google.maps.event.addListenerOnce(mapObject,"center_changed",OpenLayers.Function.bind(this.repositionMapElements,this));}
+this.mapObject=mapObject;this.setGMapVisibility(this.visibility);},repositionMapElements:function(){google.maps.event.trigger(this.mapObject,"resize");var div=this.mapObject.getDiv().firstChild;if(!div||div.childNodes.length<3){this.repositionTimer=window.setTimeout(OpenLayers.Function.bind(this.repositionMapElements,this),250);return false;}
+var cache=OpenLayers.Layer.Google.cache[this.map.id];var container=this.map.viewPortDiv;var termsOfUse=div.lastChild;container.appendChild(termsOfUse);termsOfUse.style.zIndex="1100";termsOfUse.style.bottom="";termsOfUse.className="olLayerGoogleCopyright olLayerGoogleV3";termsOfUse.style.display="";cache.termsOfUse=termsOfUse;var poweredBy=div.lastChild;container.appendChild(poweredBy);poweredBy.style.zIndex="1100";poweredBy.style.bottom="";poweredBy.className="olLayerGooglePoweredBy olLayerGoogleV3 gmnoprint";poweredBy.style.display="";cache.poweredBy=poweredBy;this.setGMapVisibility(this.visibility);},onMapResize:function(){if(this.visibility){google.maps.event.trigger(this.mapObject,"resize");}else{if(!this._resized){var layer=this;google.maps.event.addListenerOnce(this.mapObject,"tilesloaded",function(){delete layer._resized;google.maps.event.trigger(layer.mapObject,"resize");layer.moveTo(layer.map.getCenter(),layer.map.getZoom());});}
+this._resized=true;}},setGMapVisibility:function(visible){var cache=OpenLayers.Layer.Google.cache[this.map.id];if(cache){var type=this.type;var layers=this.map.layers;var layer;for(var i=layers.length-1;i>=0;--i){layer=layers[i];if(layer instanceof OpenLayers.Layer.Google&&layer.visibility===true&&layer.inRange===true){type=layer.type;visible=true;break;}}
+var container=this.mapObject.getDiv();if(visible===true){this.mapObject.setMapTypeId(type);container.style.left="";if(cache.termsOfUse&&cache.termsOfUse.style){cache.termsOfUse.style.left="";cache.termsOfUse.style.display="";cache.poweredBy.style.display="";}
+cache.displayed=this.id;}else{delete cache.displayed;container.style.left="-9999px";if(cache.termsOfUse&&cache.termsOfUse.style){cache.termsOfUse.style.display="none";cache.termsOfUse.style.left="-9999px";cache.poweredBy.style.display="none";}}}},getMapContainer:function(){return this.mapObject.getDiv();},getMapObjectBoundsFromOLBounds:function(olBounds){var moBounds=null;if(olBounds!=null){var sw=this.sphericalMercator?this.inverseMercator(olBounds.bottom,olBounds.left):new OpenLayers.LonLat(olBounds.bottom,olBounds.left);var ne=this.sphericalMercator?this.inverseMercator(olBounds.top,olBounds.right):new OpenLayers.LonLat(olBounds.top,olBounds.right);moBounds=new google.maps.LatLngBounds(new google.maps.LatLng(sw.lat,sw.lon),new google.maps.LatLng(ne.lat,ne.lon));}
+return moBounds;},getMapObjectLonLatFromMapObjectPixel:function(moPixel){var size=this.map.getSize();var lon=this.getLongitudeFromMapObjectLonLat(this.mapObject.center);var lat=this.getLatitudeFromMapObjectLonLat(this.mapObject.center);var res=this.map.getResolution();var delta_x=moPixel.x-(size.w/2);var delta_y=moPixel.y-(size.h/2);var lonlat=new OpenLayers.LonLat(lon+delta_x*res,lat-delta_y*res);if(this.wrapDateLine){lonlat=lonlat.wrapDateLine(this.maxExtent);}
+return this.getMapObjectLonLatFromLonLat(lonlat.lon,lonlat.lat);},getMapObjectPixelFromMapObjectLonLat:function(moLonLat){var lon=this.getLongitudeFromMapObjectLonLat(moLonLat);var lat=this.getLatitudeFromMapObjectLonLat(moLonLat);var res=this.map.getResolution();var extent=this.map.getExtent();var px=new OpenLayers.Pixel((1/res*(lon-extent.left)),(1/res*(extent.top-lat)));return this.getMapObjectPixelFromXY(px.x,px.y);},setMapObjectCenter:function(center,zoom){this.mapObject.setOptions({center:center,zoom:zoom});},getMapObjectZoomFromMapObjectBounds:function(moBounds){return this.mapObject.getBoundsZoomLevel(moBounds);},getMapObjectLonLatFromLonLat:function(lon,lat){var gLatLng;if(this.sphericalMercator){var lonlat=this.inverseMercator(lon,lat);gLatLng=new google.maps.LatLng(lonlat.lat,lonlat.lon);}else{gLatLng=new google.maps.LatLng(lat,lon);}
+return gLatLng;},getMapObjectPixelFromXY:function(x,y){return new google.maps.Point(x,y);},destroy:function(){if(this.repositionListener){google.maps.event.removeListener(this.repositionListener);}
+if(this.repositionTimer){window.clearTimeout(this.repositionTimer);}
+OpenLayers.Layer.Google.prototype.destroy.apply(this,arguments);}};OpenLayers.Layer.KaMap=OpenLayers.Class(OpenLayers.Layer.Grid,{isBaseLayer:true,units:null,resolution:OpenLayers.DOTS_PER_INCH,DEFAULT_PARAMS:{i:'jpeg',map:''},initialize:function(name,url,params,options){var newArguments=[];newArguments.push(name,url,params,options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);this.params=OpenLayers.Util.applyDefaults(this.params,this.DEFAULT_PARAMS);},getURL:function(bounds){bounds=this.adjustBounds(bounds);var mapRes=this.map.getResolution();var scale=Math.round((this.map.getScale()*10000))/10000;var pX=Math.round(bounds.left/mapRes);var pY=-Math.round(bounds.top/mapRes);return this.getFullRequestString({t:pY,l:pX,s:scale});},addTile:function(bounds,position){var url=this.getURL(bounds);return new OpenLayers.Tile.Image(this,position,bounds,url,this.tileSize);},calculateGridLayout:function(bounds,extent,resolution){var tilelon=resolution*this.tileSize.w;var tilelat=resolution*this.tileSize.h;var offsetlon=bounds.left;var tilecol=Math.floor(offsetlon/tilelon)-this.buffer;var tilecolremain=offsetlon/tilelon-tilecol;var tileoffsetx=-tilecolremain*this.tileSize.w;var tileoffsetlon=tilecol*tilelon;var offsetlat=bounds.top;var tilerow=Math.ceil(offsetlat/tilelat)+this.buffer;var tilerowremain=tilerow-offsetlat/tilelat;var tileoffsety=-(tilerowremain+1)*this.tileSize.h;var tileoffsetlat=tilerow*tilelat;return{tilelon:tilelon,tilelat:tilelat,tileoffsetlon:tileoffsetlon,tileoffsetlat:tileoffsetlat,tileoffsetx:tileoffsetx,tileoffsety:tileoffsety};},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.KaMap(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);if(this.tileSize!=null){obj.tileSize=this.tileSize.clone();}
+obj.grid=[];return obj;},getTileBounds:function(viewPortPx){var resolution=this.getResolution();var tileMapWidth=resolution*this.tileSize.w;var tileMapHeight=resolution*this.tileSize.h;var mapPoint=this.getLonLatFromViewPortPx(viewPortPx);var tileLeft=tileMapWidth*Math.floor(mapPoint.lon/tileMapWidth);var tileBottom=tileMapHeight*Math.floor(mapPoint.lat/tileMapHeight);return new OpenLayers.Bounds(tileLeft,tileBottom,tileLeft+tileMapWidth,tileBottom+tileMapHeight);},CLASS_NAME:"OpenLayers.Layer.KaMap"});OpenLayers.Layer.MapGuide=OpenLayers.Class(OpenLayers.Layer.Grid,{isBaseLayer:true,useHttpTile:false,singleTile:false,useOverlay:false,useAsyncOverlay:true,TILE_PARAMS:{operation:'GETTILEIMAGE',version:'1.2.0'},SINGLE_TILE_PARAMS:{operation:'GETMAPIMAGE',format:'PNG',locale:'en',clip:'1',version:'1.0.0'},OVERLAY_PARAMS:{operation:'GETDYNAMICMAPOVERLAYIMAGE',format:'PNG',locale:'en',clip:'1',version:'2.0.0'},FOLDER_PARAMS:{tileColumnsPerFolder:30,tileRowsPerFolder:30,format:'png',querystring:null},defaultSize:new OpenLayers.Size(300,300),initialize:function(name,url,params,options){OpenLayers.Layer.Grid.prototype.initialize.apply(this,arguments);if(options==null||options.isBaseLayer==null){this.isBaseLayer=((this.transparent!="true")&&(this.transparent!=true));}
+if(options&&options.useOverlay!=null){this.useOverlay=options.useOverlay;}
+if(this.singleTile){if(this.useOverlay){OpenLayers.Util.applyDefaults(this.params,this.OVERLAY_PARAMS);if(!this.useAsyncOverlay){this.params.version="1.0.0";}}else{OpenLayers.Util.applyDefaults(this.params,this.SINGLE_TILE_PARAMS);}}else{if(this.useHttpTile){OpenLayers.Util.applyDefaults(this.params,this.FOLDER_PARAMS);}else{OpenLayers.Util.applyDefaults(this.params,this.TILE_PARAMS);}
+this.setTileSize(this.defaultSize);}},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.MapGuide(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},getURL:function(bounds){var url;var center=bounds.getCenterLonLat();var mapSize=this.map.getSize();if(this.singleTile){var params={setdisplaydpi:OpenLayers.DOTS_PER_INCH,setdisplayheight:mapSize.h*this.ratio,setdisplaywidth:mapSize.w*this.ratio,setviewcenterx:center.lon,setviewcentery:center.lat,setviewscale:this.map.getScale()};if(this.useOverlay&&!this.useAsyncOverlay){var getVisParams={};getVisParams=OpenLayers.Util.extend(getVisParams,params);getVisParams.operation="GETVISIBLEMAPEXTENT";getVisParams.version="1.0.0";getVisParams.session=this.params.session;getVisParams.mapName=this.params.mapName;getVisParams.format='text/xml';url=this.getFullRequestString(getVisParams);OpenLayers.Request.GET({url:url,async:false});}
+url=this.getFullRequestString(params);}else{var currentRes=this.map.getResolution();var colidx=Math.floor((bounds.left-this.maxExtent.left)/currentRes);colidx=Math.round(colidx/this.tileSize.w);var rowidx=Math.floor((this.maxExtent.top-bounds.top)/currentRes);rowidx=Math.round(rowidx/this.tileSize.h);if(this.useHttpTile){url=this.getImageFilePath({tilecol:colidx,tilerow:rowidx,scaleindex:this.resolutions.length-this.map.zoom-1});}else{url=this.getFullRequestString({tilecol:colidx,tilerow:rowidx,scaleindex:this.resolutions.length-this.map.zoom-1});}}
+return url;},getFullRequestString:function(newParams,altUrl){var url=(altUrl==null)?this.url:altUrl;if(typeof url=="object"){url=url[Math.floor(Math.random()*url.length)];}
+var requestString=url;var allParams=OpenLayers.Util.extend({},this.params);allParams=OpenLayers.Util.extend(allParams,newParams);var urlParams=OpenLayers.Util.upperCaseObject(OpenLayers.Util.getParameters(url));for(var key in allParams){if(key.toUpperCase()in urlParams){delete allParams[key];}}
+var paramsString=OpenLayers.Util.getParameterString(allParams);paramsString=paramsString.replace(/,/g,"+");if(paramsString!=""){var lastServerChar=url.charAt(url.length-1);if((lastServerChar=="&")||(lastServerChar=="?")){requestString+=paramsString;}else{if(url.indexOf('?')==-1){requestString+='?'+paramsString;}else{requestString+='&'+paramsString;}}}
+return requestString;},getImageFilePath:function(newParams,altUrl){var url=(altUrl==null)?this.url:altUrl;if(typeof url=="object"){url=url[Math.floor(Math.random()*url.length)];}
+var requestString=url;var tileRowGroup="";var tileColGroup="";if(newParams.tilerow<0){tileRowGroup='-';}
+if(newParams.tilerow==0){tileRowGroup+='0';}else{tileRowGroup+=Math.floor(Math.abs(newParams.tilerow/this.params.tileRowsPerFolder))*this.params.tileRowsPerFolder;}
+if(newParams.tilecol<0){tileColGroup='-';}
+if(newParams.tilecol==0){tileColGroup+='0';}else{tileColGroup+=Math.floor(Math.abs(newParams.tilecol/this.params.tileColumnsPerFolder))*this.params.tileColumnsPerFolder;}
+var tilePath='/S'+Math.floor(newParams.scaleindex)
++'/'+this.params.basemaplayergroupname
++'/R'+tileRowGroup
++'/C'+tileColGroup
++'/'+(newParams.tilerow%this.params.tileRowsPerFolder)
++'_'+(newParams.tilecol%this.params.tileColumnsPerFolder)
++'.'+this.params.format;if(this.params.querystring){tilePath+="?"+this.params.querystring;}
+requestString+=tilePath;return requestString;},calculateGridLayout:function(bounds,extent,resolution){var tilelon=resolution*this.tileSize.w;var tilelat=resolution*this.tileSize.h;var offsetlon=bounds.left-extent.left;var tilecol=Math.floor(offsetlon/tilelon)-this.buffer;var tilecolremain=offsetlon/tilelon-tilecol;var tileoffsetx=-tilecolremain*this.tileSize.w;var tileoffsetlon=extent.left+tilecol*tilelon;var offsetlat=extent.top-bounds.top+tilelat;var tilerow=Math.floor(offsetlat/tilelat)-this.buffer;var tilerowremain=tilerow-offsetlat/tilelat;var tileoffsety=tilerowremain*this.tileSize.h;var tileoffsetlat=extent.top-tilelat*tilerow;return{tilelon:tilelon,tilelat:tilelat,tileoffsetlon:tileoffsetlon,tileoffsetlat:tileoffsetlat,tileoffsetx:tileoffsetx,tileoffsety:tileoffsety};},CLASS_NAME:"OpenLayers.Layer.MapGuide"});OpenLayers.Layer.MapServer=OpenLayers.Class(OpenLayers.Layer.Grid,{DEFAULT_PARAMS:{mode:"map",map_imagetype:"png"},initialize:function(name,url,params,options){var newArguments=[];newArguments.push(name,url,params,options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);this.params=OpenLayers.Util.applyDefaults(this.params,this.DEFAULT_PARAMS);if(options==null||options.isBaseLayer==null){this.isBaseLayer=((this.params.transparent!="true")&&(this.params.transparent!=true));}},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.MapServer(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},getURL:function(bounds){bounds=this.adjustBounds(bounds);var extent=[bounds.left,bounds.bottom,bounds.right,bounds.top];var imageSize=this.getImageSize();var url=this.getFullRequestString({mapext:extent,imgext:extent,map_size:[imageSize.w,imageSize.h],imgx:imageSize.w/2,imgy:imageSize.h/2,imgxy:[imageSize.w,imageSize.h]});return url;},getFullRequestString:function(newParams,altUrl){var url=(altUrl==null)?this.url:altUrl;var allParams=OpenLayers.Util.extend({},this.params);allParams=OpenLayers.Util.extend(allParams,newParams);var paramsString=OpenLayers.Util.getParameterString(allParams);if(url instanceof Array){url=this.selectUrl(paramsString,url);}
+var urlParams=OpenLayers.Util.upperCaseObject(OpenLayers.Util.getParameters(url));for(var key in allParams){if(key.toUpperCase()in urlParams){delete allParams[key];}}
+paramsString=OpenLayers.Util.getParameterString(allParams);var requestString=url;paramsString=paramsString.replace(/,/g,"+");if(paramsString!=""){var lastServerChar=url.charAt(url.length-1);if((lastServerChar=="&")||(lastServerChar=="?")){requestString+=paramsString;}else{if(url.indexOf('?')==-1){requestString+='?'+paramsString;}else{requestString+='&'+paramsString;}}}
+return requestString;},CLASS_NAME:"OpenLayers.Layer.MapServer"});OpenLayers.Layer.TMS=OpenLayers.Class(OpenLayers.Layer.Grid,{serviceVersion:"1.0.0",isBaseLayer:true,tileOrigin:null,serverResolutions:null,zoomOffset:0,initialize:function(name,url,options){var newArguments=[];newArguments.push(name,url,{},options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);},destroy:function(){OpenLayers.Layer.Grid.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.TMS(this.name,this.url,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getURL:function(bounds){bounds=this.adjustBounds(bounds);var res=this.map.getResolution();var x=Math.round((bounds.left-this.tileOrigin.lon)/(res*this.tileSize.w));var y=Math.round((bounds.bottom-this.tileOrigin.lat)/(res*this.tileSize.h));var z=this.serverResolutions!=null?OpenLayers.Util.indexOf(this.serverResolutions,res):this.map.getZoom()+this.zoomOffset;var path=this.serviceVersion+"/"+this.layername+"/"+z+"/"+x+"/"+y+"."+this.type;var url=this.url;if(url instanceof Array){url=this.selectUrl(path,url);}
+return url+path;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},setMap:function(map){OpenLayers.Layer.Grid.prototype.setMap.apply(this,arguments);if(!this.tileOrigin){this.tileOrigin=new OpenLayers.LonLat(this.map.maxExtent.left,this.map.maxExtent.bottom);}},CLASS_NAME:"OpenLayers.Layer.TMS"});OpenLayers.Layer.TileCache=OpenLayers.Class(OpenLayers.Layer.Grid,{isBaseLayer:true,format:'image/png',serverResolutions:null,initialize:function(name,url,layername,options){this.layername=layername;OpenLayers.Layer.Grid.prototype.initialize.apply(this,[name,url,{},options]);this.extension=this.format.split('/')[1].toLowerCase();this.extension=(this.extension=='jpg')?'jpeg':this.extension;},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.TileCache(this.name,this.url,this.layername,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getURL:function(bounds){var res=this.map.getResolution();var bbox=this.maxExtent;var size=this.tileSize;var tileX=Math.round((bounds.left-bbox.left)/(res*size.w));var tileY=Math.round((bounds.bottom-bbox.bottom)/(res*size.h));var tileZ=this.serverResolutions!=null?OpenLayers.Util.indexOf(this.serverResolutions,res):this.map.getZoom();function zeroPad(number,length){number=String(number);var zeros=[];for(var i=0;i<length;++i){zeros.push('0');}
+return zeros.join('').substring(0,length-number.length)+number;}
+var components=[this.layername,zeroPad(tileZ,2),zeroPad(parseInt(tileX/1000000),3),zeroPad((parseInt(tileX/1000)%1000),3),zeroPad((parseInt(tileX)%1000),3),zeroPad(parseInt(tileY/1000000),3),zeroPad((parseInt(tileY/1000)%1000),3),zeroPad((parseInt(tileY)%1000),3)+'.'+this.extension];var path=components.join('/');var url=this.url;if(url instanceof Array){url=this.selectUrl(path,url);}
+url=(url.charAt(url.length-1)=='/')?url:url+'/';return url+path;},addTile:function(bounds,position){var url=this.getURL(bounds);return new OpenLayers.Tile.Image(this,position,bounds,url,this.tileSize);},CLASS_NAME:"OpenLayers.Layer.TileCache"});OpenLayers.Layer.WMS=OpenLayers.Class(OpenLayers.Layer.Grid,{DEFAULT_PARAMS:{service:"WMS",version:"1.1.1",request:"GetMap",styles:"",exceptions:"application/vnd.ogc.se_inimage",format:"image/jpeg"},reproject:false,isBaseLayer:true,encodeBBOX:false,noMagic:false,yx:{'EPSG:4326':true},initialize:function(name,url,params,options){var newArguments=[];params=OpenLayers.Util.upperCaseObject(params);if(parseFloat(params.VERSION)>=1.3&&!params.EXCEPTIONS){params.EXCEPTIONS="INIMAGE";}
+newArguments.push(name,url,params,options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);OpenLayers.Util.applyDefaults(this.params,OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS));if(!this.noMagic&&this.params.TRANSPARENT&&this.params.TRANSPARENT.toString().toLowerCase()=="true"){if((options==null)||(!options.isBaseLayer)){this.isBaseLayer=false;}
+if(this.params.FORMAT=="image/jpeg"){this.params.FORMAT=OpenLayers.Util.alphaHack()?"image/gif":"image/png";}}},destroy:function(){OpenLayers.Layer.Grid.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.WMS(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},reverseAxisOrder:function(){return(parseFloat(this.params.VERSION)>=1.3&&!!this.yx[this.map.getProjectionObject().getCode()]);},getURL:function(bounds){bounds=this.adjustBounds(bounds);var imageSize=this.getImageSize();var newParams={};var reverseAxisOrder=this.reverseAxisOrder();newParams.BBOX=this.encodeBBOX?bounds.toBBOX(null,reverseAxisOrder):bounds.toArray(reverseAxisOrder);newParams.WIDTH=imageSize.w;newParams.HEIGHT=imageSize.h;var requestString=this.getFullRequestString(newParams);return requestString;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},mergeNewParams:function(newParams){var upperParams=OpenLayers.Util.upperCaseObject(newParams);var newArguments=[upperParams];return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(this,newArguments);},getFullRequestString:function(newParams,altUrl){var projectionCode=this.map.getProjection();var value=(projectionCode=="none")?null:projectionCode
+if(parseFloat(this.params.VERSION)>=1.3){this.params.CRS=value;}else{this.params.SRS=value;}
+return OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(this,arguments);},CLASS_NAME:"OpenLayers.Layer.WMS"});OpenLayers.Layer.WMTS=OpenLayers.Class(OpenLayers.Layer.Grid,{isBaseLayer:true,version:"1.0.0",requestEncoding:"KVP",url:null,layer:null,matrixSet:null,style:null,format:"image/jpeg",tileOrigin:null,tileFullExtent:null,formatSuffix:null,matrixIds:null,dimensions:null,params:null,zoomOffset:0,formatSuffixMap:{"image/png":"png","image/png8":"png","image/png24":"png","image/png32":"png","png":"png","image/jpeg":"jpg","image/jpg":"jpg","jpeg":"jpg","jpg":"jpg"},matrix:null,initialize:function(config){var required={url:true,layer:true,style:true,matrixSet:true};for(var prop in required){if(!(prop in config)){throw new Error("Missing property '"+prop+"' in layer configuration.");}}
+config.params=OpenLayers.Util.upperCaseObject(config.params);var args=[config.name,config.url,config.params,config];OpenLayers.Layer.Grid.prototype.initialize.apply(this,args);if(!this.formatSuffix){this.formatSuffix=this.formatSuffixMap[this.format]||this.format.split("/").pop();}
+if(this.matrixIds){var len=this.matrixIds.length;if(len&&typeof this.matrixIds[0]==="string"){var ids=this.matrixIds;this.matrixIds=new Array(len);for(var i=0;i<len;++i){this.matrixIds[i]={identifier:ids[i]};}}}},setMap:function(){OpenLayers.Layer.Grid.prototype.setMap.apply(this,arguments);this.updateMatrixProperties();},updateMatrixProperties:function(){this.matrix=this.getMatrix();if(this.matrix){if(this.matrix.topLeftCorner){this.tileOrigin=this.matrix.topLeftCorner;}
+if(this.matrix.tileWidth&&this.matrix.tileHeight){this.tileSize=new OpenLayers.Size(this.matrix.tileWidth,this.matrix.tileHeight);}
+if(!this.tileOrigin){this.tileOrigin=new OpenLayers.LonLat(this.maxExtent.left,this.maxExtent.top);}
+if(!this.tileFullExtent){this.tileFullExtent=this.maxExtent;}}},moveTo:function(bounds,zoomChanged,dragging){if(zoomChanged||!this.matrix){this.updateMatrixProperties();}
+return OpenLayers.Layer.Grid.prototype.moveTo.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.WMTS(this.options);}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getMatrix:function(){var matrix;if(!this.matrixIds||this.matrixIds.length===0){matrix={identifier:this.map.getZoom()+this.zoomOffset};}else{if("scaleDenominator"in this.matrixIds[0]){var denom=OpenLayers.METERS_PER_INCH*OpenLayers.INCHES_PER_UNIT[this.units]*this.map.getResolution()/0.28E-3;var diff=Number.POSITIVE_INFINITY;var delta;for(var i=0,ii=this.matrixIds.length;i<ii;++i){delta=Math.abs(1-(this.matrixIds[i].scaleDenominator/denom));if(delta<diff){diff=delta;matrix=this.matrixIds[i];}}}else{matrix=this.matrixIds[this.map.getZoom()+this.zoomOffset];}}
+return matrix;},getTileInfo:function(loc){var res=this.map.getResolution();var fx=(loc.lon-this.tileOrigin.lon)/(res*this.tileSize.w);var fy=(this.tileOrigin.lat-loc.lat)/(res*this.tileSize.h);var col=Math.floor(fx);var row=Math.floor(fy);return{col:col,row:row,i:Math.floor((fx-col)*this.tileSize.w),j:Math.floor((fy-row)*this.tileSize.h)};},getURL:function(bounds){bounds=this.adjustBounds(bounds);var url="";if(!this.tileFullExtent||this.tileFullExtent.intersectsBounds(bounds)){var center=bounds.getCenterLonLat();var info=this.getTileInfo(center);var matrixId=this.matrix.identifier;if(this.requestEncoding.toUpperCase()==="REST"){var path=this.version+"/"+this.layer+"/"+this.style+"/";if(this.dimensions){for(var i=0;i<this.dimensions.length;i++){if(this.params[this.dimensions[i]]){path=path+this.params[this.dimensions[i]]+"/";}}}
+path=path+this.matrixSet+"/"+this.matrix.identifier+"/"+info.row+"/"+info.col+"."+this.formatSuffix;if(this.url instanceof Array){url=this.selectUrl(path,this.url);}else{url=this.url;}
+if(!url.match(/\/$/)){url=url+"/";}
+url=url+path;}else if(this.requestEncoding.toUpperCase()==="KVP"){var params={SERVICE:"WMTS",REQUEST:"GetTile",VERSION:this.version,LAYER:this.layer,STYLE:this.style,TILEMATRIXSET:this.matrixSet,TILEMATRIX:this.matrix.identifier,TILEROW:info.row,TILECOL:info.col,FORMAT:this.format};url=OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(this,[params]);}}
+return url;},mergeNewParams:function(newParams){if(this.requestEncoding.toUpperCase()==="KVP"){return OpenLayers.Layer.Grid.prototype.mergeNewParams.apply(this,[OpenLayers.Util.upperCaseObject(newParams)]);}},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},CLASS_NAME:"OpenLayers.Layer.WMTS"});OpenLayers.Layer.WorldWind=OpenLayers.Class(OpenLayers.Layer.Grid,{DEFAULT_PARAMS:{},isBaseLayer:true,lzd:null,zoomLevels:null,initialize:function(name,url,lzd,zoomLevels,params,options){this.lzd=lzd;this.zoomLevels=zoomLevels;var newArguments=[];newArguments.push(name,url,params,options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);this.params=OpenLayers.Util.applyDefaults(this.params,this.DEFAULT_PARAMS);},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},getZoom:function(){var zoom=this.map.getZoom();var extent=this.map.getMaxExtent();zoom=zoom-Math.log(this.maxResolution/(this.lzd/512))/Math.log(2);return zoom;},getURL:function(bounds){bounds=this.adjustBounds(bounds);var zoom=this.getZoom();var extent=this.map.getMaxExtent();var deg=this.lzd/Math.pow(2,this.getZoom());var x=Math.floor((bounds.left-extent.left)/deg);var y=Math.floor((bounds.bottom-extent.bottom)/deg);if(this.map.getResolution()<=(this.lzd/512)&&this.getZoom()<=this.zoomLevels){return this.getFullRequestString({L:zoom,X:x,Y:y});}else{return OpenLayers.Util.getImagesLocation()+"blank.gif";}},CLASS_NAME:"OpenLayers.Layer.WorldWind"});OpenLayers.Layer.XYZ=OpenLayers.Class(OpenLayers.Layer.Grid,{isBaseLayer:true,sphericalMercator:false,zoomOffset:0,initialize:function(name,url,options){if(options&&options.sphericalMercator||this.sphericalMercator){options=OpenLayers.Util.extend({maxExtent:new OpenLayers.Bounds(-128*156543.0339,-128*156543.0339,128*156543.0339,128*156543.0339),maxResolution:156543.0339,numZoomLevels:19,units:"m",projection:"EPSG:900913"},options);}
+url=url||this.url;name=name||this.name;var newArguments=[name,url,{},options];OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.XYZ(this.name,this.url,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getURL:function(bounds){var res=this.map.getResolution();var x=Math.round((bounds.left-this.maxExtent.left)/(res*this.tileSize.w));var y=Math.round((this.maxExtent.top-bounds.top)/(res*this.tileSize.h));var z=this.map.getZoom()+this.zoomOffset;var url=this.url;var s=''+x+y+z;if(url instanceof Array)
+{url=this.selectUrl(s,url);}
+var path=OpenLayers.String.format(url,{'x':x,'y':y,'z':z});return path;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},setMap:function(map){OpenLayers.Layer.Grid.prototype.setMap.apply(this,arguments);if(!this.tileOrigin){this.tileOrigin=new OpenLayers.LonLat(this.maxExtent.left,this.maxExtent.bottom);}},CLASS_NAME:"OpenLayers.Layer.XYZ"});OpenLayers.Layer.OSM=OpenLayers.Class(OpenLayers.Layer.XYZ,{name:"OpenStreetMap",attribution:"Data CC-By-SA by <a href='http://openstreetmap.org/'>OpenStreetMap</a>",sphericalMercator:true,url:'http://tile.openstreetmap.org/${z}/${x}/${y}.png',clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.OSM(this.name,this.url,this.getOptions());}
+obj=OpenLayers.Layer.XYZ.prototype.clone.apply(this,[obj]);return obj;},CLASS_NAME:"OpenLayers.Layer.OSM"});OpenLayers.Layer.Zoomify=OpenLayers.Class(OpenLayers.Layer.Grid,{url:null,size:null,isBaseLayer:true,standardTileSize:256,numberOfTiers:0,tileCountUpToTier:new Array(),tierSizeInTiles:new Array(),tierImageSize:new Array(),initialize:function(name,url,size,options){this.initializeZoomify(size);var newArguments=[];newArguments.push(name,url,size,{},options);OpenLayers.Layer.Grid.prototype.initialize.apply(this,newArguments);},initializeZoomify:function(size){var imageSize=size.clone()
+var tiles=new OpenLayers.Size(Math.ceil(imageSize.w/this.standardTileSize),Math.ceil(imageSize.h/this.standardTileSize));this.tierSizeInTiles.push(tiles);this.tierImageSize.push(imageSize);while(imageSize.w>this.standardTileSize||imageSize.h>this.standardTileSize){imageSize=new OpenLayers.Size(Math.floor(imageSize.w/2),Math.floor(imageSize.h/2));tiles=new OpenLayers.Size(Math.ceil(imageSize.w/this.standardTileSize),Math.ceil(imageSize.h/this.standardTileSize));this.tierSizeInTiles.push(tiles);this.tierImageSize.push(imageSize);}
+this.tierSizeInTiles.reverse();this.tierImageSize.reverse();this.numberOfTiers=this.tierSizeInTiles.length;this.tileCountUpToTier[0]=0;for(var i=1;i<this.numberOfTiers;i++){this.tileCountUpToTier.push(this.tierSizeInTiles[i-1].w*this.tierSizeInTiles[i-1].h+
+this.tileCountUpToTier[i-1]);}},destroy:function(){OpenLayers.Layer.Grid.prototype.destroy.apply(this,arguments);this.tileCountUpToTier.length=0
+this.tierSizeInTiles.length=0
+this.tierImageSize.length=0},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.Zoomify(this.name,this.url,this.size,this.options);}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},getURL:function(bounds){bounds=this.adjustBounds(bounds);var res=this.map.getResolution();var x=Math.round((bounds.left-this.tileOrigin.lon)/(res*this.tileSize.w));var y=Math.round((this.tileOrigin.lat-bounds.top)/(res*this.tileSize.h));var z=this.map.getZoom();var tileIndex=x+y*this.tierSizeInTiles[z].w+this.tileCountUpToTier[z];var path="TileGroup"+Math.floor((tileIndex)/256)+"/"+z+"-"+x+"-"+y+".jpg";var url=this.url;if(url instanceof Array){url=this.selectUrl(path,url);}
+return url+path;},getImageSize:function(){if(arguments.length>0){bounds=this.adjustBounds(arguments[0]);var res=this.map.getResolution();var x=Math.round((bounds.left-this.tileOrigin.lon)/(res*this.tileSize.w));var y=Math.round((this.tileOrigin.lat-bounds.top)/(res*this.tileSize.h));var z=this.map.getZoom();var w=this.standardTileSize;var h=this.standardTileSize;if(x==this.tierSizeInTiles[z].w-1){var w=this.tierImageSize[z].w%this.standardTileSize;};if(y==this.tierSizeInTiles[z].h-1){var h=this.tierImageSize[z].h%this.standardTileSize;};return(new OpenLayers.Size(w,h));}else{return this.tileSize;}},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},setMap:function(map){OpenLayers.Layer.Grid.prototype.setMap.apply(this,arguments);this.tileOrigin=new OpenLayers.LonLat(this.map.maxExtent.left,this.map.maxExtent.top);},calculateGridLayout:function(bounds,extent,resolution){var tilelon=resolution*this.tileSize.w;var tilelat=resolution*this.tileSize.h;var offsetlon=bounds.left-extent.left;var tilecol=Math.floor(offsetlon/tilelon)-this.buffer;var tilecolremain=offsetlon/tilelon-tilecol;var tileoffsetx=-tilecolremain*this.tileSize.w;var tileoffsetlon=extent.left+tilecol*tilelon;var offsetlat=extent.top-bounds.top+tilelat;var tilerow=Math.floor(offsetlat/tilelat)-this.buffer;var tilerowremain=tilerow-offsetlat/tilelat;var tileoffsety=tilerowremain*this.tileSize.h;var tileoffsetlat=extent.top-tilelat*tilerow;return{tilelon:tilelon,tilelat:tilelat,tileoffsetlon:tileoffsetlon,tileoffsetlat:tileoffsetlat,tileoffsetx:tileoffsetx,tileoffsety:tileoffsety};},CLASS_NAME:"OpenLayers.Layer.Zoomify"});OpenLayers.Protocol.SQL.Gears=OpenLayers.Class(OpenLayers.Protocol.SQL,{FID_PREFIX:'__gears_fid__',NULL_GEOMETRY:'__gears_null_geometry__',NULL_FEATURE_STATE:'__gears_null_feature_state__',jsonParser:null,wktParser:null,fidRegExp:null,saveFeatureState:true,typeOfFid:"string",db:null,initialize:function(options){if(!this.supported()){return;}
+OpenLayers.Protocol.SQL.prototype.initialize.apply(this,[options]);this.jsonParser=new OpenLayers.Format.JSON();this.wktParser=new OpenLayers.Format.WKT();this.fidRegExp=new RegExp('^'+this.FID_PREFIX);this.initializeDatabase();},initializeDatabase:function(){this.db=google.gears.factory.create('beta.database');this.db.open(this.databaseName);this.db.execute("CREATE TABLE IF NOT EXISTS "+this.tableName+" (fid TEXT UNIQUE, geometry TEXT, properties TEXT,"+"  state TEXT)");},destroy:function(){this.db.close();this.db=null;this.jsonParser=null;this.wktParser=null;OpenLayers.Protocol.SQL.prototype.destroy.apply(this);},supported:function(){return!!(window.google&&google.gears);},read:function(options){OpenLayers.Protocol.prototype.read.apply(this,arguments);options=OpenLayers.Util.applyDefaults(options,this.options);var feature,features=[];var rs=this.db.execute("SELECT * FROM "+this.tableName);while(rs.isValidRow()){feature=this.unfreezeFeature(rs);if(this.evaluateFilter(feature,options.filter)){if(!options.noFeatureStateReset){feature.state=null;}
+features.push(feature);}
+rs.next();}
+rs.close();var resp=new OpenLayers.Protocol.Response({code:OpenLayers.Protocol.Response.SUCCESS,requestType:"read",features:features});if(options&&options.callback){options.callback.call(options.scope,resp);}
+return resp;},unfreezeFeature:function(row){var feature;var wkt=row.fieldByName('geometry');if(wkt==this.NULL_GEOMETRY){feature=new OpenLayers.Feature.Vector();}else{feature=this.wktParser.read(wkt);}
+feature.attributes=this.jsonParser.read(row.fieldByName('properties'));feature.fid=this.extractFidFromField(row.fieldByName('fid'));var state=row.fieldByName('state');if(state==this.NULL_FEATURE_STATE){state=null;}
+feature.state=state;return feature;},extractFidFromField:function(field){if(!field.match(this.fidRegExp)&&this.typeOfFid=="number"){field=parseFloat(field);}
+return field;},create:function(features,options){options=OpenLayers.Util.applyDefaults(options,this.options);var resp=this.createOrUpdate(features);resp.requestType="create";if(options&&options.callback){options.callback.call(options.scope,resp);}
+return resp;},update:function(features,options){options=OpenLayers.Util.applyDefaults(options,this.options);var resp=this.createOrUpdate(features);resp.requestType="update";if(options&&options.callback){options.callback.call(options.scope,resp);}
+return resp;},createOrUpdate:function(features){if(!(features instanceof Array)){features=[features];}
+var i,len=features.length,feature;var insertedFeatures=new Array(len);for(i=0;i<len;i++){feature=features[i];var params=this.freezeFeature(feature);this.db.execute("REPLACE INTO "+this.tableName+" (fid, geometry, properties, state)"+" VALUES (?, ?, ?, ?)",params);var clone=feature.clone();clone.fid=this.extractFidFromField(params[0]);insertedFeatures[i]=clone;}
+return new OpenLayers.Protocol.Response({code:OpenLayers.Protocol.Response.SUCCESS,features:insertedFeatures,reqFeatures:features});},freezeFeature:function(feature){feature.fid=feature.fid!=null?""+feature.fid:OpenLayers.Util.createUniqueID(this.FID_PREFIX);var geometry=feature.geometry!=null?feature.geometry.toString():this.NULL_GEOMETRY;var properties=this.jsonParser.write(feature.attributes);var state=this.getFeatureStateForFreeze(feature);return[feature.fid,geometry,properties,state];},getFeatureStateForFreeze:function(feature){var state;if(!this.saveFeatureState){state=this.NULL_FEATURE_STATE;}else if(this.createdOffline(feature)){state=OpenLayers.State.INSERT;}else{state=feature.state;}
+return state;},"delete":function(features,options){if(!(features instanceof Array)){features=[features];}
+options=OpenLayers.Util.applyDefaults(options,this.options);var i,len,feature;for(i=0,len=features.length;i<len;i++){feature=features[i];if(this.saveFeatureState&&!this.createdOffline(feature)){var toDelete=feature.clone();toDelete.fid=feature.fid;if(toDelete.geometry){toDelete.geometry.destroy();toDelete.geometry=null;}
+toDelete.state=feature.state;this.createOrUpdate(toDelete);}else{this.db.execute("DELETE FROM "+this.tableName+" WHERE fid = ?",[feature.fid]);}}
+var resp=new OpenLayers.Protocol.Response({code:OpenLayers.Protocol.Response.SUCCESS,requestType:"delete",reqFeatures:features});if(options&&options.callback){options.callback.call(options.scope,resp);}
+return resp;},createdOffline:function(feature){return(typeof feature.fid=="string"&&!!(feature.fid.match(this.fidRegExp)));},commit:function(features,options){var opt,resp=[],nRequests=0,nResponses=0;function callback(resp){if(++nResponses<nRequests){resp.last=false;}
+this.callUserCallback(options,resp);}
+var feature,toCreate=[],toUpdate=[],toDelete=[];for(var i=features.length-1;i>=0;i--){feature=features[i];switch(feature.state){case OpenLayers.State.INSERT:toCreate.push(feature);break;case OpenLayers.State.UPDATE:toUpdate.push(feature);break;case OpenLayers.State.DELETE:toDelete.push(feature);break;}}
+if(toCreate.length>0){nRequests++;opt=OpenLayers.Util.applyDefaults({"callback":callback,"scope":this},options.create);resp.push(this.create(toCreate,opt));}
+if(toUpdate.length>0){nRequests++;opt=OpenLayers.Util.applyDefaults({"callback":callback,"scope":this},options.update);resp.push(this.update(toUpdate,opt));}
+if(toDelete.length>0){nRequests++;opt=OpenLayers.Util.applyDefaults({"callback":callback,"scope":this},options["delete"]);resp.push(this["delete"](toDelete,opt));}
+return resp;},clear:function(){this.db.execute("DELETE FROM "+this.tableName);},callUserCallback:function(options,resp){var opt=options[resp.requestType];if(opt&&opt.callback){opt.callback.call(opt.scope,resp);}
+if(resp.last&&options.callback){options.callback.call(options.scope);}},CLASS_NAME:"OpenLayers.Protocol.SQL.Gears"});OpenLayers.Rule=OpenLayers.Class({id:null,name:null,title:null,description:null,context:null,filter:null,elseFilter:false,symbolizer:null,symbolizers:null,minScaleDenominator:null,maxScaleDenominator:null,initialize:function(options){this.symbolizer={};OpenLayers.Util.extend(this,options);if(this.symbolizers){delete this.symbolizer;}
+this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},destroy:function(){for(var i in this.symbolizer){this.symbolizer[i]=null;}
+this.symbolizer=null;delete this.symbolizers;},evaluate:function(feature){var context=this.getContext(feature);var applies=true;if(this.minScaleDenominator||this.maxScaleDenominator){var scale=feature.layer.map.getScale();}
+if(this.minScaleDenominator){applies=scale>=OpenLayers.Style.createLiteral(this.minScaleDenominator,context);}
+if(applies&&this.maxScaleDenominator){applies=scale<OpenLayers.Style.createLiteral(this.maxScaleDenominator,context);}
+if(applies&&this.filter){if(this.filter.CLASS_NAME=="OpenLayers.Filter.FeatureId"){applies=this.filter.evaluate(feature);}else{applies=this.filter.evaluate(context);}}
+return applies;},getContext:function(feature){var context=this.context;if(!context){context=feature.attributes||feature.data;}
+if(typeof this.context=="function"){context=this.context(feature);}
+return context;},clone:function(){var options=OpenLayers.Util.extend({},this);if(this.symbolizers){var len=this.symbolizers.length;options.symbolizers=new Array(len);for(var i=0;i<len;++i){options.symbolizers[i]=this.symbolizers[i].clone();}}else{options.symbolizer={};var value,type;for(var key in this.symbolizer){value=this.symbolizer[key];type=typeof value;if(type==="object"){options.symbolizer[key]=OpenLayers.Util.extend({},value);}else if(type==="string"){options.symbolizer[key]=value;}}}
+options.filter=this.filter&&this.filter.clone();options.context=this.context&&OpenLayers.Util.extend({},this.context);return new OpenLayers.Rule(options);},CLASS_NAME:"OpenLayers.Rule"});OpenLayers.StyleMap=OpenLayers.Class({styles:null,extendDefault:true,initialize:function(style,options){this.styles={"default":new OpenLayers.Style(OpenLayers.Feature.Vector.style["default"]),"select":new OpenLayers.Style(OpenLayers.Feature.Vector.style["select"]),"temporary":new OpenLayers.Style(OpenLayers.Feature.Vector.style["temporary"]),"delete":new OpenLayers.Style(OpenLayers.Feature.Vector.style["delete"])};if(style instanceof OpenLayers.Style){this.styles["default"]=style;this.styles["select"]=style;this.styles["temporary"]=style;this.styles["delete"]=style;}else if(typeof style=="object"){for(var key in style){if(style[key]instanceof OpenLayers.Style){this.styles[key]=style[key];}else if(typeof style[key]=="object"){this.styles[key]=new OpenLayers.Style(style[key]);}else{this.styles["default"]=new OpenLayers.Style(style);this.styles["select"]=new OpenLayers.Style(style);this.styles["temporary"]=new OpenLayers.Style(style);this.styles["delete"]=new OpenLayers.Style(style);break;}}}
+OpenLayers.Util.extend(this,options);},destroy:function(){for(var key in this.styles){this.styles[key].destroy();}
+this.styles=null;},createSymbolizer:function(feature,intent){if(!feature){feature=new OpenLayers.Feature.Vector();}
+if(!this.styles[intent]){intent="default";}
+feature.renderIntent=intent;var defaultSymbolizer={};if(this.extendDefault&&intent!="default"){defaultSymbolizer=this.styles["default"].createSymbolizer(feature);}
+return OpenLayers.Util.extend(defaultSymbolizer,this.styles[intent].createSymbolizer(feature));},addUniqueValueRules:function(renderIntent,property,symbolizers,context){var rules=[];for(var value in symbolizers){rules.push(new OpenLayers.Rule({symbolizer:symbolizers[value],context:context,filter:new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.EQUAL_TO,property:property,value:value})}));}
+this.styles[renderIntent].addRules(rules);},CLASS_NAME:"OpenLayers.StyleMap"});OpenLayers.Control.NavToolbar=OpenLayers.Class(OpenLayers.Control.Panel,{initialize:function(options){OpenLayers.Control.Panel.prototype.initialize.apply(this,[options]);this.addControls([new OpenLayers.Control.Navigation(),new OpenLayers.Control.ZoomBox()]);},draw:function(){var div=OpenLayers.Control.Panel.prototype.draw.apply(this,arguments);this.activateControl(this.controls[0]);return div;},CLASS_NAME:"OpenLayers.Control.NavToolbar"});OpenLayers.Filter.Comparison=OpenLayers.Class(OpenLayers.Filter,{type:null,property:null,value:null,matchCase:true,lowerBoundary:null,upperBoundary:null,initialize:function(options){OpenLayers.Filter.prototype.initialize.apply(this,[options]);},evaluate:function(context){if(context instanceof OpenLayers.Feature.Vector){context=context.attributes;}
+var result=false;var got=context[this.property];switch(this.type){case OpenLayers.Filter.Comparison.EQUAL_TO:var exp=this.value;if(!this.matchCase&&typeof got=="string"&&typeof exp=="string"){result=(got.toUpperCase()==exp.toUpperCase());}else{result=(got==exp);}
+break;case OpenLayers.Filter.Comparison.NOT_EQUAL_TO:var exp=this.value;if(!this.matchCase&&typeof got=="string"&&typeof exp=="string"){result=(got.toUpperCase()!=exp.toUpperCase());}else{result=(got!=exp);}
+break;case OpenLayers.Filter.Comparison.LESS_THAN:result=got<this.value;break;case OpenLayers.Filter.Comparison.GREATER_THAN:result=got>this.value;break;case OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO:result=got<=this.value;break;case OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO:result=got>=this.value;break;case OpenLayers.Filter.Comparison.BETWEEN:result=(got>=this.lowerBoundary)&&(got<=this.upperBoundary);break;case OpenLayers.Filter.Comparison.LIKE:var regexp=new RegExp(this.value,"gi");result=regexp.test(got);break;}
+return result;},value2regex:function(wildCard,singleChar,escapeChar){if(wildCard=="."){var msg="'.' is an unsupported wildCard character for "+"OpenLayers.Filter.Comparison";OpenLayers.Console.error(msg);return null;}
+wildCard=wildCard?wildCard:"*";singleChar=singleChar?singleChar:".";escapeChar=escapeChar?escapeChar:"!";this.value=this.value.replace(new RegExp("\\"+escapeChar+"(.|$)","g"),"\\$1");this.value=this.value.replace(new RegExp("\\"+singleChar,"g"),".");this.value=this.value.replace(new RegExp("\\"+wildCard,"g"),".*");this.value=this.value.replace(new RegExp("\\\\.\\*","g"),"\\"+wildCard);this.value=this.value.replace(new RegExp("\\\\\\.","g"),"\\"+singleChar);return this.value;},regex2value:function(){var value=this.value;value=value.replace(/!/g,"!!");value=value.replace(/(\\)?\\\./g,function($0,$1){return $1?$0:"!.";});value=value.replace(/(\\)?\\\*/g,function($0,$1){return $1?$0:"!*";});value=value.replace(/\\\\/g,"\\");value=value.replace(/\.\*/g,"*");return value;},clone:function(){return OpenLayers.Util.extend(new OpenLayers.Filter.Comparison(),this);},CLASS_NAME:"OpenLayers.Filter.Comparison"});OpenLayers.Filter.Comparison.EQUAL_TO="==";OpenLayers.Filter.Comparison.NOT_EQUAL_TO="!=";OpenLayers.Filter.Comparison.LESS_THAN="<";OpenLayers.Filter.Comparison.GREATER_THAN=">";OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO="<=";OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO=">=";OpenLayers.Filter.Comparison.BETWEEN="..";OpenLayers.Filter.Comparison.LIKE="~";OpenLayers.Filter.FeatureId=OpenLayers.Class(OpenLayers.Filter,{fids:null,initialize:function(options){this.fids=[];OpenLayers.Filter.prototype.initialize.apply(this,[options]);},evaluate:function(feature){for(var i=0,len=this.fids.length;i<len;i++){var fid=feature.fid||feature.id;if(fid==this.fids[i]){return true;}}
+return false;},clone:function(){var filter=new OpenLayers.Filter.FeatureId();OpenLayers.Util.extend(filter,this);filter.fids=this.fids.slice();return filter;},CLASS_NAME:"OpenLayers.Filter.FeatureId"});OpenLayers.Filter.Logical=OpenLayers.Class(OpenLayers.Filter,{filters:null,type:null,initialize:function(options){this.filters=[];OpenLayers.Filter.prototype.initialize.apply(this,[options]);},destroy:function(){this.filters=null;OpenLayers.Filter.prototype.destroy.apply(this);},evaluate:function(context){switch(this.type){case OpenLayers.Filter.Logical.AND:for(var i=0,len=this.filters.length;i<len;i++){if(this.filters[i].evaluate(context)==false){return false;}}
+return true;case OpenLayers.Filter.Logical.OR:for(var i=0,len=this.filters.length;i<len;i++){if(this.filters[i].evaluate(context)==true){return true;}}
+return false;case OpenLayers.Filter.Logical.NOT:return(!this.filters[0].evaluate(context));}},clone:function(){var filters=[];for(var i=0,len=this.filters.length;i<len;++i){filters.push(this.filters[i].clone());}
+return new OpenLayers.Filter.Logical({type:this.type,filters:filters});},CLASS_NAME:"OpenLayers.Filter.Logical"});OpenLayers.Filter.Logical.AND="&&";OpenLayers.Filter.Logical.OR="||";OpenLayers.Filter.Logical.NOT="!";OpenLayers.Filter.Spatial=OpenLayers.Class(OpenLayers.Filter,{type:null,property:null,value:null,distance:null,distanceUnits:null,initialize:function(options){OpenLayers.Filter.prototype.initialize.apply(this,[options]);},evaluate:function(feature){var intersect=false;switch(this.type){case OpenLayers.Filter.Spatial.BBOX:case OpenLayers.Filter.Spatial.INTERSECTS:if(feature.geometry){var geom=this.value;if(this.value.CLASS_NAME=="OpenLayers.Bounds"){geom=this.value.toGeometry();}
+if(feature.geometry.intersects(geom)){intersect=true;}}
+break;default:OpenLayers.Console.error(OpenLayers.i18n("filterEvaluateNotImplemented"));break;}
+return intersect;},clone:function(){var options=OpenLayers.Util.applyDefaults({value:this.value&&this.value.clone&&this.value.clone()},this);return new OpenLayers.Filter.Spatial(options);},CLASS_NAME:"OpenLayers.Filter.Spatial"});OpenLayers.Filter.Spatial.BBOX="BBOX";OpenLayers.Filter.Spatial.INTERSECTS="INTERSECTS";OpenLayers.Filter.Spatial.DWITHIN="DWITHIN";OpenLayers.Filter.Spatial.WITHIN="WITHIN";OpenLayers.Filter.Spatial.CONTAINS="CONTAINS";OpenLayers.Geometry.Collection=OpenLayers.Class(OpenLayers.Geometry,{components:null,componentTypes:null,initialize:function(components){OpenLayers.Geometry.prototype.initialize.apply(this,arguments);this.components=[];if(components!=null){this.addComponents(components);}},destroy:function(){this.components.length=0;this.components=null;OpenLayers.Geometry.prototype.destroy.apply(this,arguments);},clone:function(){var geometry=eval("new "+this.CLASS_NAME+"()");for(var i=0,len=this.components.length;i<len;i++){geometry.addComponent(this.components[i].clone());}
+OpenLayers.Util.applyDefaults(geometry,this);return geometry;},getComponentsString:function(){var strings=[];for(var i=0,len=this.components.length;i<len;i++){strings.push(this.components[i].toShortString());}
+return strings.join(",");},calculateBounds:function(){this.bounds=null;if(this.components&&this.components.length>0){this.setBounds(this.components[0].getBounds());for(var i=1,len=this.components.length;i<len;i++){this.extendBounds(this.components[i].getBounds());}}},addComponents:function(components){if(!(components instanceof Array)){components=[components];}
+for(var i=0,len=components.length;i<len;i++){this.addComponent(components[i]);}},addComponent:function(component,index){var added=false;if(component){if(this.componentTypes==null||(OpenLayers.Util.indexOf(this.componentTypes,component.CLASS_NAME)>-1)){if(index!=null&&(index<this.components.length)){var components1=this.components.slice(0,index);var components2=this.components.slice(index,this.components.length);components1.push(component);this.components=components1.concat(components2);}else{this.components.push(component);}
+component.parent=this;this.clearBounds();added=true;}}
+return added;},removeComponents:function(components){if(!(components instanceof Array)){components=[components];}
+for(var i=components.length-1;i>=0;--i){this.removeComponent(components[i]);}},removeComponent:function(component){OpenLayers.Util.removeItem(this.components,component);this.clearBounds();},getLength:function(){var length=0.0;for(var i=0,len=this.components.length;i<len;i++){length+=this.components[i].getLength();}
+return length;},getArea:function(){var area=0.0;for(var i=0,len=this.components.length;i<len;i++){area+=this.components[i].getArea();}
+return area;},getGeodesicArea:function(projection){var area=0.0;for(var i=0,len=this.components.length;i<len;i++){area+=this.components[i].getGeodesicArea(projection);}
+return area;},getCentroid:function(weighted){if(!weighted){return this.components.length&&this.components[0].getCentroid();}
+var len=this.components.length;if(!len){return false;}
+var areas=[];var centroids=[];var areaSum=0;var minArea=Number.MAX_VALUE;var component;for(var i=0;i<len;++i){component=this.components[i];var area=component.getArea();var centroid=component.getCentroid(true);if(isNaN(area)||isNaN(centroid.x)||isNaN(centroid.y)){continue;}
+areas.push(area);areaSum+=area;minArea=(area<minArea&&area>0)?area:minArea;centroids.push(centroid);}
+len=areas.length;if(areaSum===0){for(var i=0;i<len;++i){areas[i]=1;}
+areaSum=areas.length;}else{for(var i=0;i<len;++i){areas[i]/=minArea;}
+areaSum/=minArea;}
+var xSum=0,ySum=0,centroid,area;for(var i=0;i<len;++i){centroid=centroids[i];area=areas[i];xSum+=centroid.x*area;ySum+=centroid.y*area;}
+return new OpenLayers.Geometry.Point(xSum/areaSum,ySum/areaSum);},getGeodesicLength:function(projection){var length=0.0;for(var i=0,len=this.components.length;i<len;i++){length+=this.components[i].getGeodesicLength(projection);}
+return length;},move:function(x,y){for(var i=0,len=this.components.length;i<len;i++){this.components[i].move(x,y);}},rotate:function(angle,origin){for(var i=0,len=this.components.length;i<len;++i){this.components[i].rotate(angle,origin);}},resize:function(scale,origin,ratio){for(var i=0;i<this.components.length;++i){this.components[i].resize(scale,origin,ratio);}
+return this;},distanceTo:function(geometry,options){var edge=!(options&&options.edge===false);var details=edge&&options&&options.details;var result,best,distance;var min=Number.POSITIVE_INFINITY;for(var i=0,len=this.components.length;i<len;++i){result=this.components[i].distanceTo(geometry,options);distance=details?result.distance:result;if(distance<min){min=distance;best=result;if(min==0){break;}}}
+return best;},equals:function(geometry){var equivalent=true;if(!geometry||!geometry.CLASS_NAME||(this.CLASS_NAME!=geometry.CLASS_NAME)){equivalent=false;}else if(!(geometry.components instanceof Array)||(geometry.components.length!=this.components.length)){equivalent=false;}else{for(var i=0,len=this.components.length;i<len;++i){if(!this.components[i].equals(geometry.components[i])){equivalent=false;break;}}}
+return equivalent;},transform:function(source,dest){if(source&&dest){for(var i=0,len=this.components.length;i<len;i++){var component=this.components[i];component.transform(source,dest);}
+this.bounds=null;}
+return this;},intersects:function(geometry){var intersect=false;for(var i=0,len=this.components.length;i<len;++i){intersect=geometry.intersects(this.components[i]);if(intersect){break;}}
+return intersect;},getVertices:function(nodes){var vertices=[];for(var i=0,len=this.components.length;i<len;++i){Array.prototype.push.apply(vertices,this.components[i].getVertices(nodes));}
+return vertices;},CLASS_NAME:"OpenLayers.Geometry.Collection"});OpenLayers.Geometry.Point=OpenLayers.Class(OpenLayers.Geometry,{x:null,y:null,initialize:function(x,y){OpenLayers.Geometry.prototype.initialize.apply(this,arguments);this.x=parseFloat(x);this.y=parseFloat(y);},clone:function(obj){if(obj==null){obj=new OpenLayers.Geometry.Point(this.x,this.y);}
+OpenLayers.Util.applyDefaults(obj,this);return obj;},calculateBounds:function(){this.bounds=new OpenLayers.Bounds(this.x,this.y,this.x,this.y);},distanceTo:function(geometry,options){var edge=!(options&&options.edge===false);var details=edge&&options&&options.details;var distance,x0,y0,x1,y1,result;if(geometry instanceof OpenLayers.Geometry.Point){x0=this.x;y0=this.y;x1=geometry.x;y1=geometry.y;distance=Math.sqrt(Math.pow(x0-x1,2)+Math.pow(y0-y1,2));result=!details?distance:{x0:x0,y0:y0,x1:x1,y1:y1,distance:distance};}else{result=geometry.distanceTo(this,options);if(details){result={x0:result.x1,y0:result.y1,x1:result.x0,y1:result.y0,distance:result.distance};}}
+return result;},equals:function(geom){var equals=false;if(geom!=null){equals=((this.x==geom.x&&this.y==geom.y)||(isNaN(this.x)&&isNaN(this.y)&&isNaN(geom.x)&&isNaN(geom.y)));}
+return equals;},toShortString:function(){return(this.x+", "+this.y);},move:function(x,y){this.x=this.x+x;this.y=this.y+y;this.clearBounds();},rotate:function(angle,origin){angle*=Math.PI/180;var radius=this.distanceTo(origin);var theta=angle+Math.atan2(this.y-origin.y,this.x-origin.x);this.x=origin.x+(radius*Math.cos(theta));this.y=origin.y+(radius*Math.sin(theta));this.clearBounds();},getCentroid:function(){return new OpenLayers.Geometry.Point(this.x,this.y);},resize:function(scale,origin,ratio){ratio=(ratio==undefined)?1:ratio;this.x=origin.x+(scale*ratio*(this.x-origin.x));this.y=origin.y+(scale*(this.y-origin.y));this.clearBounds();return this;},intersects:function(geometry){var intersect=false;if(geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){intersect=this.equals(geometry);}else{intersect=geometry.intersects(this);}
+return intersect;},transform:function(source,dest){if((source&&dest)){OpenLayers.Projection.transform(this,source,dest);this.bounds=null;}
+return this;},getVertices:function(nodes){return[this];},CLASS_NAME:"OpenLayers.Geometry.Point"});OpenLayers.Geometry.Rectangle=OpenLayers.Class(OpenLayers.Geometry,{x:null,y:null,width:null,height:null,initialize:function(x,y,width,height){OpenLayers.Geometry.prototype.initialize.apply(this,arguments);this.x=x;this.y=y;this.width=width;this.height=height;},calculateBounds:function(){this.bounds=new OpenLayers.Bounds(this.x,this.y,this.x+this.width,this.y+this.height);},getLength:function(){var length=(2*this.width)+(2*this.height);return length;},getArea:function(){var area=this.width*this.height;return area;},CLASS_NAME:"OpenLayers.Geometry.Rectangle"});OpenLayers.Geometry.Surface=OpenLayers.Class(OpenLayers.Geometry,{initialize:function(){OpenLayers.Geometry.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Geometry.Surface"});OpenLayers.Layer.KaMapCache=OpenLayers.Class(OpenLayers.Layer.KaMap,{IMAGE_EXTENSIONS:{'jpeg':'jpg','gif':'gif','png':'png','png8':'png','png24':'png','dithered':'png'},DEFAULT_FORMAT:'jpeg',initialize:function(name,url,params,options){OpenLayers.Layer.KaMap.prototype.initialize.apply(this,arguments);this.extension=this.IMAGE_EXTENSIONS[this.params.i.toLowerCase()||DEFAULT_FORMAT];},getURL:function(bounds){bounds=this.adjustBounds(bounds);var mapRes=this.map.getResolution();var scale=Math.round((this.map.getScale()*10000))/10000;var pX=Math.round(bounds.left/mapRes);var pY=-Math.round(bounds.top/mapRes);var metaX=Math.floor(pX/this.tileSize.w/this.params.metaTileSize.w)*this.tileSize.w*this.params.metaTileSize.w;var metaY=Math.floor(pY/this.tileSize.h/this.params.metaTileSize.h)*this.tileSize.h*this.params.metaTileSize.h;var url=this.url;if(url instanceof Array){url=this.selectUrl(paramsString,url);}
+var components=[url,"/",this.params.map,"/",scale,"/",this.params.g.replace(/\s/g,'_'),"/def/t",metaY,"/l",metaX,"/t",pY,"l",pX,".",this.extension];return components.join("");},CLASS_NAME:"OpenLayers.Layer.KaMapCache"});OpenLayers.Layer.MapServer.Untiled=OpenLayers.Class(OpenLayers.Layer.MapServer,{singleTile:true,initialize:function(name,url,params,options){OpenLayers.Layer.MapServer.prototype.initialize.apply(this,arguments);var msg="The OpenLayers.Layer.MapServer.Untiled class is deprecated and "+"will be removed in 3.0. Instead, you should use the "+"normal OpenLayers.Layer.MapServer class, passing it the option "+"'singleTile' as true.";OpenLayers.Console.warn(msg);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.MapServer.Untiled(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.MapServer.prototype.clone.apply(this,[obj]);return obj;},CLASS_NAME:"OpenLayers.Layer.MapServer.Untiled"});OpenLayers.Layer.Vector=OpenLayers.Class(OpenLayers.Layer,{EVENT_TYPES:["beforefeatureadded","beforefeaturesadded","featureadded","featuresadded","beforefeatureremoved","beforefeaturesremoved","featureremoved","featuresremoved","beforefeatureselected","featureselected","featureunselected","beforefeaturemodified","featuremodified","afterfeaturemodified","vertexmodified","sketchstarted","sketchmodified","sketchcomplete","refresh"],isBaseLayer:false,isFixed:false,isVector:true,features:null,filter:null,selectedFeatures:null,unrenderedFeatures:null,reportError:true,style:null,styleMap:null,strategies:null,protocol:null,renderers:['SVG','VML','Canvas'],renderer:null,rendererOptions:null,geometryType:null,drawn:false,initialize:function(name,options){this.EVENT_TYPES=OpenLayers.Layer.Vector.prototype.EVENT_TYPES.concat(OpenLayers.Layer.prototype.EVENT_TYPES);OpenLayers.Layer.prototype.initialize.apply(this,arguments);if(!this.renderer||!this.renderer.supported()){this.assignRenderer();}
+if(!this.renderer||!this.renderer.supported()){this.renderer=null;this.displayError();}
+if(!this.styleMap){this.styleMap=new OpenLayers.StyleMap();}
+this.features=[];this.selectedFeatures=[];this.unrenderedFeatures={};if(this.strategies){for(var i=0,len=this.strategies.length;i<len;i++){this.strategies[i].setLayer(this);}}},destroy:function(){if(this.strategies){var strategy,i,len;for(i=0,len=this.strategies.length;i<len;i++){strategy=this.strategies[i];if(strategy.autoDestroy){strategy.destroy();}}
+this.strategies=null;}
+if(this.protocol){if(this.protocol.autoDestroy){this.protocol.destroy();}
+this.protocol=null;}
+this.destroyFeatures();this.features=null;this.selectedFeatures=null;this.unrenderedFeatures=null;if(this.renderer){this.renderer.destroy();}
+this.renderer=null;this.geometryType=null;this.drawn=null;OpenLayers.Layer.prototype.destroy.apply(this,arguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.Vector(this.name,this.getOptions());}
+obj=OpenLayers.Layer.prototype.clone.apply(this,[obj]);var features=this.features;var len=features.length;var clonedFeatures=new Array(len);for(var i=0;i<len;++i){clonedFeatures[i]=features[i].clone();}
+obj.features=clonedFeatures;return obj;},refresh:function(obj){if(this.calculateInRange()&&this.visibility){this.events.triggerEvent("refresh",obj);}},assignRenderer:function(){for(var i=0,len=this.renderers.length;i<len;i++){var rendererClass=this.renderers[i];var renderer=(typeof rendererClass=="function")?rendererClass:OpenLayers.Renderer[rendererClass];if(renderer&&renderer.prototype.supported()){this.renderer=new renderer(this.div,this.rendererOptions);break;}}},displayError:function(){if(this.reportError){OpenLayers.Console.userError(OpenLayers.i18n("browserNotSupported",{'renderers':this.renderers.join("\n")}));}},setMap:function(map){OpenLayers.Layer.prototype.setMap.apply(this,arguments);if(!this.renderer){this.map.removeLayer(this);}else{this.renderer.map=this.map;this.renderer.setSize(this.map.getSize());}},afterAdd:function(){if(this.strategies){var strategy,i,len;for(i=0,len=this.strategies.length;i<len;i++){strategy=this.strategies[i];if(strategy.autoActivate){strategy.activate();}}}},removeMap:function(map){this.drawn=false;if(this.strategies){var strategy,i,len;for(i=0,len=this.strategies.length;i<len;i++){strategy=this.strategies[i];if(strategy.autoActivate){strategy.deactivate();}}}},onMapResize:function(){OpenLayers.Layer.prototype.onMapResize.apply(this,arguments);this.renderer.setSize(this.map.getSize());},moveTo:function(bounds,zoomChanged,dragging){OpenLayers.Layer.prototype.moveTo.apply(this,arguments);var coordSysUnchanged=true;if(!dragging){this.renderer.root.style.visibility="hidden";this.div.style.left=-parseInt(this.map.layerContainerDiv.style.left)+"px";this.div.style.top=-parseInt(this.map.layerContainerDiv.style.top)+"px";var extent=this.map.getExtent();coordSysUnchanged=this.renderer.setExtent(extent,zoomChanged);this.renderer.root.style.visibility="visible";if(navigator.userAgent.toLowerCase().indexOf("gecko")!=-1){this.div.scrollLeft=this.div.scrollLeft;}
+if(!zoomChanged&&coordSysUnchanged){for(var i in this.unrenderedFeatures){var feature=this.unrenderedFeatures[i];this.drawFeature(feature);}}}
+if(!this.drawn||zoomChanged||!coordSysUnchanged){this.drawn=true;var feature;for(var i=0,len=this.features.length;i<len;i++){this.renderer.locked=(i!==(len-1));feature=this.features[i];this.drawFeature(feature);}}},display:function(display){OpenLayers.Layer.prototype.display.apply(this,arguments);var currentDisplay=this.div.style.display;if(currentDisplay!=this.renderer.root.style.display){this.renderer.root.style.display=currentDisplay;}},addFeatures:function(features,options){if(!(features instanceof Array)){features=[features];}
+var notify=!options||!options.silent;if(notify){var event={features:features};var ret=this.events.triggerEvent("beforefeaturesadded",event);if(ret===false){return;}
+features=event.features;}
+var featuresAdded=[];for(var i=0,len=features.length;i<len;i++){if(i!=(features.length-1)){this.renderer.locked=true;}else{this.renderer.locked=false;}
+var feature=features[i];if(this.geometryType&&!(feature.geometry instanceof this.geometryType)){var throwStr=OpenLayers.i18n('componentShouldBe',{'geomType':this.geometryType.prototype.CLASS_NAME});throw throwStr;}
+feature.layer=this;if(!feature.style&&this.style){feature.style=OpenLayers.Util.extend({},this.style);}
+if(notify){if(this.events.triggerEvent("beforefeatureadded",{feature:feature})===false){continue;};this.preFeatureInsert(feature);}
+featuresAdded.push(feature);this.features.push(feature);this.drawFeature(feature);if(notify){this.events.triggerEvent("featureadded",{feature:feature});this.onFeatureInsert(feature);}}
+if(notify){this.events.triggerEvent("featuresadded",{features:featuresAdded});}},removeFeatures:function(features,options){if(!features||features.length===0){return;}
+if(features===this.features){return this.removeAllFeatures(options);}
+if(!(features instanceof Array)){features=[features];}
+if(features===this.selectedFeatures){features=features.slice();}
+var notify=!options||!options.silent;if(notify){this.events.triggerEvent("beforefeaturesremoved",{features:features});}
+for(var i=features.length-1;i>=0;i--){if(i!=0&&features[i-1].geometry){this.renderer.locked=true;}else{this.renderer.locked=false;}
+var feature=features[i];delete this.unrenderedFeatures[feature.id];if(notify){this.events.triggerEvent("beforefeatureremoved",{feature:feature});}
+this.features=OpenLayers.Util.removeItem(this.features,feature);feature.layer=null;if(feature.geometry){this.renderer.eraseFeatures(feature);}
+if(OpenLayers.Util.indexOf(this.selectedFeatures,feature)!=-1){OpenLayers.Util.removeItem(this.selectedFeatures,feature);}
+if(notify){this.events.triggerEvent("featureremoved",{feature:feature});}}
+if(notify){this.events.triggerEvent("featuresremoved",{features:features});}},removeAllFeatures:function(options){var notify=!options||!options.silent;var features=this.features;if(notify){this.events.triggerEvent("beforefeaturesremoved",{features:features});}
+var feature;for(var i=features.length-1;i>=0;i--){feature=features[i];if(notify){this.events.triggerEvent("beforefeatureremoved",{feature:feature});}
+feature.layer=null;if(notify){this.events.triggerEvent("featureremoved",{feature:feature});}}
+this.renderer.clear();this.features=[];this.unrenderedFeatures={};this.selectedFeatures=[];if(notify){this.events.triggerEvent("featuresremoved",{features:features});}},destroyFeatures:function(features,options){var all=(features==undefined);if(all){features=this.features;}
+if(features){this.removeFeatures(features,options);for(var i=features.length-1;i>=0;i--){features[i].destroy();}}},drawFeature:function(feature,style){if(!this.drawn){return}
+if(typeof style!="object"){if(!style&&feature.state===OpenLayers.State.DELETE){style="delete";}
+var renderIntent=style||feature.renderIntent;style=feature.style||this.style;if(!style){style=this.styleMap.createSymbolizer(feature,renderIntent);}}
+if(!this.renderer.drawFeature(feature,style)){this.unrenderedFeatures[feature.id]=feature;}else{delete this.unrenderedFeatures[feature.id];};},eraseFeatures:function(features){this.renderer.eraseFeatures(features);},getFeatureFromEvent:function(evt){if(!this.renderer){OpenLayers.Console.error(OpenLayers.i18n("getFeatureError"));return null;}
+var featureId=this.renderer.getFeatureIdFromEvent(evt);return this.getFeatureById(featureId);},getFeatureBy:function(property,value){var feature=null;for(var i=0,len=this.features.length;i<len;++i){if(this.features[i][property]==value){feature=this.features[i];break;}}
+return feature;},getFeatureById:function(featureId){return this.getFeatureBy('id',featureId);},getFeatureByFid:function(featureFid){return this.getFeatureBy('fid',featureFid);},onFeatureInsert:function(feature){},preFeatureInsert:function(feature){},getDataExtent:function(){var maxExtent=null;var features=this.features;if(features&&(features.length>0)){maxExtent=new OpenLayers.Bounds();var geometry=null;for(var i=0,len=features.length;i<len;i++){geometry=features[i].geometry;if(geometry){maxExtent.extend(geometry.getBounds());}}}
+return maxExtent;},CLASS_NAME:"OpenLayers.Layer.Vector"});OpenLayers.Layer.WMS.Post=OpenLayers.Class(OpenLayers.Layer.WMS,{tileClass:null,unsupportedBrowsers:["mozilla","firefox","opera"],SUPPORTED_TRANSITIONS:[],initialize:function(name,url,params,options){var newArguments=[];newArguments.push(name,url,params,options);OpenLayers.Layer.WMS.prototype.initialize.apply(this,newArguments);this.tileClass=OpenLayers.Util.indexOf(this.unsupportedBrowsers,OpenLayers.Util.getBrowserName())!=-1?OpenLayers.Tile.Image:OpenLayers.Tile.Image.IFrame;},addTile:function(bounds,position){return new this.tileClass(this,position,bounds,null,this.tileSize);},CLASS_NAME:'OpenLayers.Layer.WMS.Post'});OpenLayers.Layer.WMS.Untiled=OpenLayers.Class(OpenLayers.Layer.WMS,{singleTile:true,initialize:function(name,url,params,options){OpenLayers.Layer.WMS.prototype.initialize.apply(this,arguments);var msg="The OpenLayers.Layer.WMS.Untiled class is deprecated and "+"will be removed in 3.0. Instead, you should use the "+"normal OpenLayers.Layer.WMS class, passing it the option "+"'singleTile' as true.";OpenLayers.Console.warn(msg);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.WMS.Untiled(this.name,this.url,this.params,this.getOptions());}
+obj=OpenLayers.Layer.WMS.prototype.clone.apply(this,[obj]);return obj;},CLASS_NAME:"OpenLayers.Layer.WMS.Untiled"});OpenLayers.Strategy.Filter=OpenLayers.Class(OpenLayers.Strategy,{filter:null,cache:null,caching:false,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);if(!this.filter||!(this.filter instanceof OpenLayers.Filter)){throw new Error("Filter strategy must be constructed with a filter");}},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.apply(this,arguments);if(activated){this.cache=[];this.layer.events.on({"beforefeaturesadded":this.handleAdd,"beforefeaturesremoved":this.handleRemove,scope:this});}
+return activated;},deactivate:function(){this.cache=null;if(this.layer&&this.layer.events){this.layer.events.un({"beforefeaturesadded":this.handleAdd,"beforefeaturesremoved":this.handleRemove,scope:this});}
+return OpenLayers.Strategy.prototype.deactivate.apply(this,arguments);},handleAdd:function(event){if(!this.caching){var features=event.features;event.features=[];var feature;for(var i=0,ii=features.length;i<ii;++i){feature=features[i];if(this.filter.evaluate(feature)){event.features.push(feature);}else{this.cache.push(feature);}}}},handleRemove:function(event){if(!this.caching){this.cache=[];}},setFilter:function(filter){this.filter=filter;var previousCache=this.cache;this.cache=[];this.handleAdd({features:this.layer.features});if(this.cache.length>0){this.caching=true;this.layer.removeFeatures(this.cache.slice(),{silent:true});this.caching=false;}
+if(previousCache.length>0){var event={features:previousCache};this.handleAdd(event);this.caching=true;this.layer.addFeatures(event.features,{silent:true});this.caching=false;}},CLASS_NAME:"OpenLayers.Strategy.Filter"});OpenLayers.Style2=OpenLayers.Class({id:null,name:null,title:null,description:null,layerName:null,isDefault:false,rules:null,initialize:function(config){OpenLayers.Util.extend(this,config);this.id=OpenLayers.Util.createUniqueID(this.CLASS_NAME+"_");},destroy:function(){for(var i=0,len=this.rules.length;i<len;i++){this.rules[i].destroy();}
+delete this.rules;},clone:function(){var config=OpenLayers.Util.extend({},this);if(this.rules){config.rules=[];for(var i=0,len=this.rules.length;i<len;++i){config.rules.push(this.rules[i].clone());}}
+return new OpenLayers.Style2(config);},CLASS_NAME:"OpenLayers.Style2"});OpenLayers.Control.GetFeature=OpenLayers.Class(OpenLayers.Control,{protocol:null,multipleKey:null,toggleKey:null,modifiers:null,multiple:false,click:true,single:true,clickout:true,toggle:false,clickTolerance:5,hover:false,box:false,maxFeatures:10,features:null,hoverFeature:null,handlerOptions:null,handlers:null,hoverResponse:null,filterType:OpenLayers.Filter.Spatial.BBOX,EVENT_TYPES:["featureselected","featuresselected","featureunselected","clickout","beforefeatureselected","beforefeaturesselected","hoverfeature","outfeature"],initialize:function(options){this.EVENT_TYPES=OpenLayers.Control.GetFeature.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);options.handlerOptions=options.handlerOptions||{};OpenLayers.Control.prototype.initialize.apply(this,[options]);this.features={};this.handlers={};if(this.click){this.handlers.click=new OpenLayers.Handler.Click(this,{click:this.selectClick},this.handlerOptions.click||{});}
+if(this.box){this.handlers.box=new OpenLayers.Handler.Box(this,{done:this.selectBox},OpenLayers.Util.extend(this.handlerOptions.box,{boxDivClassName:"olHandlerBoxSelectFeature"}));}
+if(this.hover){this.handlers.hover=new OpenLayers.Handler.Hover(this,{'move':this.cancelHover,'pause':this.selectHover},OpenLayers.Util.extend(this.handlerOptions.hover,{'delay':250}));}},activate:function(){if(!this.active){for(var i in this.handlers){this.handlers[i].activate();}}
+return OpenLayers.Control.prototype.activate.apply(this,arguments);},deactivate:function(){if(this.active){for(var i in this.handlers){this.handlers[i].deactivate();}}
+return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},selectClick:function(evt){var bounds=this.pixelToBounds(evt.xy);this.setModifiers(evt);this.request(bounds,{single:this.single});},selectBox:function(position){var bounds;if(position instanceof OpenLayers.Bounds){var minXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.left,position.bottom));var maxXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.right,position.top));bounds=new OpenLayers.Bounds(minXY.lon,minXY.lat,maxXY.lon,maxXY.lat);}else{if(this.click){return;}
+bounds=this.pixelToBounds(position);}
+this.setModifiers(this.handlers.box.dragHandler.evt);this.request(bounds);},selectHover:function(evt){var bounds=this.pixelToBounds(evt.xy);this.request(bounds,{single:true,hover:true});},cancelHover:function(){if(this.hoverResponse){this.protocol.abort(this.hoverResponse);this.hoverResponse=null;OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");}},request:function(bounds,options){options=options||{};var filter=new OpenLayers.Filter.Spatial({type:this.filterType,value:bounds});OpenLayers.Element.addClass(this.map.viewPortDiv,"olCursorWait");var response=this.protocol.read({maxFeatures:options.single==true?this.maxFeatures:undefined,filter:filter,callback:function(result){if(result.success()){if(result.features.length){if(options.single==true){this.selectBestFeature(result.features,bounds.getCenterLonLat(),options);}else{this.select(result.features);}}else if(options.hover){this.hoverSelect();}else{this.events.triggerEvent("clickout");if(this.clickout){this.unselectAll();}}}
+OpenLayers.Element.removeClass(this.map.viewPortDiv,"olCursorWait");},scope:this});if(options.hover==true){this.hoverResponse=response;}},selectBestFeature:function(features,clickPosition,options){options=options||{};if(features.length){var point=new OpenLayers.Geometry.Point(clickPosition.lon,clickPosition.lat);var feature,resultFeature,dist;var minDist=Number.MAX_VALUE;for(var i=0;i<features.length;++i){feature=features[i];if(feature.geometry){dist=point.distanceTo(feature.geometry,{edge:false});if(dist<minDist){minDist=dist;resultFeature=feature;if(minDist==0){break;}}}}
+if(options.hover==true){this.hoverSelect(resultFeature);}else{this.select(resultFeature||features);}}},setModifiers:function(evt){this.modifiers={multiple:this.multiple||(this.multipleKey&&evt[this.multipleKey]),toggle:this.toggle||(this.toggleKey&&evt[this.toggleKey])};},select:function(features){if(!this.modifiers.multiple&&!this.modifiers.toggle){this.unselectAll();}
+if(!(features instanceof Array)){features=[features];}
+var cont=this.events.triggerEvent("beforefeaturesselected",{features:features});if(cont!==false){var selectedFeatures=[];var feature;for(var i=0,len=features.length;i<len;++i){feature=features[i];if(this.features[feature.fid||feature.id]){if(this.modifiers.toggle){this.unselect(this.features[feature.fid||feature.id]);}}else{cont=this.events.triggerEvent("beforefeatureselected",{feature:feature});if(cont!==false){this.features[feature.fid||feature.id]=feature;selectedFeatures.push(feature);this.events.triggerEvent("featureselected",{feature:feature});}}}
+this.events.triggerEvent("featuresselected",{features:selectedFeatures});}},hoverSelect:function(feature){var fid=feature?feature.fid||feature.id:null;var hfid=this.hoverFeature?this.hoverFeature.fid||this.hoverFeature.id:null;if(hfid&&hfid!=fid){this.events.triggerEvent("outfeature",{feature:this.hoverFeature});this.hoverFeature=null;}
+if(fid&&fid!=hfid){this.events.triggerEvent("hoverfeature",{feature:feature});this.hoverFeature=feature;}},unselect:function(feature){delete this.features[feature.fid||feature.id];this.events.triggerEvent("featureunselected",{feature:feature});},unselectAll:function(){for(var fid in this.features){this.unselect(this.features[fid]);}},setMap:function(map){for(var i in this.handlers){this.handlers[i].setMap(map);}
+OpenLayers.Control.prototype.setMap.apply(this,arguments);},pixelToBounds:function(pixel){var llPx=pixel.add(-this.clickTolerance/2,this.clickTolerance/2);var urPx=pixel.add(this.clickTolerance/2,-this.clickTolerance/2);var ll=this.map.getLonLatFromPixel(llPx);var ur=this.map.getLonLatFromPixel(urPx);return new OpenLayers.Bounds(ll.lon,ll.lat,ur.lon,ur.lat);},CLASS_NAME:"OpenLayers.Control.GetFeature"});OpenLayers.Control.Snapping=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:["beforesnap","snap","unsnap"],DEFAULTS:{tolerance:10,node:true,edge:true,vertex:true},greedy:true,precedence:["node","vertex","edge"],resolution:null,geoToleranceCache:null,layer:null,feature:null,point:null,initialize:function(options){Array.prototype.push.apply(this.EVENT_TYPES,OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.options=options||{};if(this.options.layer){this.setLayer(this.options.layer);}
+var defaults=OpenLayers.Util.extend({},this.options.defaults);this.defaults=OpenLayers.Util.applyDefaults(defaults,this.DEFAULTS);this.setTargets(this.options.targets);if(this.targets.length===0&&this.layer){this.addTargetLayer(this.layer);}
+this.geoToleranceCache={};},setLayer:function(layer){if(this.active){this.deactivate();this.layer=layer;this.activate();}else{this.layer=layer;}},setTargets:function(targets){this.targets=[];if(targets&&targets.length){var target;for(var i=0,len=targets.length;i<len;++i){target=targets[i];if(target instanceof OpenLayers.Layer.Vector){this.addTargetLayer(target);}else{this.addTarget(target);}}}},addTargetLayer:function(layer){this.addTarget({layer:layer});},addTarget:function(target){target=OpenLayers.Util.applyDefaults(target,this.defaults);target.nodeTolerance=target.nodeTolerance||target.tolerance;target.vertexTolerance=target.vertexTolerance||target.tolerance;target.edgeTolerance=target.edgeTolerance||target.tolerance;this.targets.push(target);},removeTargetLayer:function(layer){var target;for(var i=this.targets.length-1;i>=0;--i){target=this.targets[i];if(target.layer===layer){this.removeTarget(target);}}},removeTarget:function(target){return OpenLayers.Util.removeItem(this.targets,target);},activate:function(){var activated=OpenLayers.Control.prototype.activate.call(this);if(activated){if(this.layer&&this.layer.events){this.layer.events.on({sketchstarted:this.onSketchModified,sketchmodified:this.onSketchModified,vertexmodified:this.onVertexModified,scope:this});}}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Control.prototype.deactivate.call(this);if(deactivated){if(this.layer&&this.layer.events){this.layer.events.un({sketchstarted:this.onSketchModified,sketchmodified:this.onSketchModified,vertexmodified:this.onVertexModified,scope:this});}}
+this.feature=null;this.point=null;return deactivated;},onSketchModified:function(event){this.feature=event.feature;this.considerSnapping(event.vertex,event.vertex);},onVertexModified:function(event){this.feature=event.feature;var loc=this.layer.map.getLonLatFromViewPortPx(event.pixel);this.considerSnapping(event.vertex,new OpenLayers.Geometry.Point(loc.lon,loc.lat));},considerSnapping:function(point,loc){var best={rank:Number.POSITIVE_INFINITY,dist:Number.POSITIVE_INFINITY,x:null,y:null};var snapped=false;var result,target;for(var i=0,len=this.targets.length;i<len;++i){target=this.targets[i];result=this.testTarget(target,loc);if(result){if(this.greedy){best=result;best.target=target;snapped=true;break;}else{if((result.rank<best.rank)||(result.rank===best.rank&&result.dist<best.dist)){best=result;best.target=target;snapped=true;}}}}
+if(snapped){var proceed=this.events.triggerEvent("beforesnap",{point:point,x:best.x,y:best.y,distance:best.dist,layer:best.target.layer,snapType:this.precedence[best.rank]});if(proceed!==false){point.x=best.x;point.y=best.y;this.point=point;this.events.triggerEvent("snap",{point:point,snapType:this.precedence[best.rank],layer:best.target.layer,distance:best.dist});}else{snapped=false;}}
+if(this.point&&!snapped){point.x=loc.x;point.y=loc.y;this.point=null;this.events.triggerEvent("unsnap",{point:point});}},testTarget:function(target,loc){var tolerance={node:this.getGeoTolerance(target.nodeTolerance),vertex:this.getGeoTolerance(target.vertexTolerance),edge:this.getGeoTolerance(target.edgeTolerance)};var maxTolerance=Math.max(tolerance.node,tolerance.vertex,tolerance.edge);var result={rank:Number.POSITIVE_INFINITY,dist:Number.POSITIVE_INFINITY};var eligible=false;var features=target.layer.features;var feature,type,vertices,vertex,closest,dist,found;var numTypes=this.precedence.length;var ll=new OpenLayers.LonLat(loc.x,loc.y);for(var i=0,len=features.length;i<len;++i){feature=features[i];if(feature!==this.feature&&!feature._sketch&&feature.state!==OpenLayers.State.DELETE&&(!target.filter||target.filter.evaluate(feature.attributes))){if(feature.atPoint(ll,maxTolerance,maxTolerance)){for(var j=0,stop=Math.min(result.rank+1,numTypes);j<stop;++j){type=this.precedence[j];if(target[type]){if(type==="edge"){closest=feature.geometry.distanceTo(loc,{details:true});dist=closest.distance;if(dist<=tolerance[type]&&dist<result.dist){result={rank:j,dist:dist,x:closest.x0,y:closest.y0};eligible=true;break;}}else{vertices=feature.geometry.getVertices(type==="node");found=false;for(var k=0,klen=vertices.length;k<klen;++k){vertex=vertices[k];dist=vertex.distanceTo(loc);if(dist<=tolerance[type]&&(j<result.rank||(j===result.rank&&dist<result.dist))){result={rank:j,dist:dist,x:vertex.x,y:vertex.y};eligible=true;found=true;}}
+if(found){break;}}}}}}}
+return eligible?result:null;},getGeoTolerance:function(tolerance){var resolution=this.layer.map.getResolution();if(resolution!==this.resolution){this.resolution=resolution;this.geoToleranceCache={};}
+var geoTolerance=this.geoToleranceCache[tolerance];if(geoTolerance===undefined){geoTolerance=tolerance*resolution;this.geoToleranceCache[tolerance]=geoTolerance;}
+return geoTolerance;},destroy:function(){if(this.active){this.deactivate();}
+delete this.layer;delete this.targets;OpenLayers.Control.prototype.destroy.call(this);},CLASS_NAME:"OpenLayers.Control.Snapping"});OpenLayers.Format.Filter=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.0.0",version:null,parser:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},write:function(filter,options){var version=(options&&options.version)||this.version||this.defaultVersion;if(!this.parser||this.parser.VERSION!=version){var format=OpenLayers.Format.Filter["v"+version.replace(/\./g,"_")];if(!format){throw"Can't find a Filter parser for version "+
+version;}
+this.parser=new format(this.options);}
+return this.parser.write(filter);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var version=this.version;if(!version){version=this.defaultVersion;}
+if(!this.parser||this.parser.VERSION!=version){var format=OpenLayers.Format.Filter["v"+version.replace(/\./g,"_")];if(!format){throw"Can't find a Filter parser for version "+
+version;}
+this.parser=new format(this.options);}
+var filter=this.parser.read(data);return filter;},CLASS_NAME:"OpenLayers.Format.Filter"});OpenLayers.Format.SLD=OpenLayers.Class(OpenLayers.Format.XML,{defaultVersion:"1.0.0",version:null,namedLayersAsArray:false,parser:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},write:function(sld,options){var version=(options&&options.version)||this.version||this.defaultVersion;if(!this.parser||this.parser.VERSION!=version){var format=OpenLayers.Format.SLD["v"+version.replace(/\./g,"_")];if(!format){throw"Can't find a SLD parser for version "+
+version;}
+this.parser=new format(this.options);}
+var root=this.parser.write(sld);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},read:function(data,options){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var root=data.documentElement;var version=this.version;if(!version){version=root.getAttribute("version");if(!version){version=this.defaultVersion;}}
+if(!this.parser||this.parser.VERSION!=version){var format=OpenLayers.Format.SLD["v"+version.replace(/\./g,"_")];if(!format){throw"Can't find a SLD parser for version "+
+version;}
+this.parser=new format(this.options);}
+var sld=this.parser.read(data,options);return sld;},CLASS_NAME:"OpenLayers.Format.SLD"});OpenLayers.Format.Text=OpenLayers.Class(OpenLayers.Format,{defaultStyle:null,extractStyles:true,initialize:function(options){options=options||{};if(options.extractStyles!==false){options.defaultStyle={'externalGraphic':OpenLayers.Util.getImagesLocation()+"marker.png",'graphicWidth':21,'graphicHeight':25,'graphicXOffset':-10.5,'graphicYOffset':-12.5};}
+OpenLayers.Format.prototype.initialize.apply(this,[options]);},read:function(text){var lines=text.split('\n');var columns;var features=[];for(var lcv=0;lcv<(lines.length-1);lcv++){var currLine=lines[lcv].replace(/^\s*/,'').replace(/\s*$/,'');if(currLine.charAt(0)!='#'){if(!columns){columns=currLine.split('\t');}else{var vals=currLine.split('\t');var geometry=new OpenLayers.Geometry.Point(0,0);var attributes={};var style=this.defaultStyle?OpenLayers.Util.applyDefaults({},this.defaultStyle):null;var icon,iconSize,iconOffset,overflow;var set=false;for(var valIndex=0;valIndex<vals.length;valIndex++){if(vals[valIndex]){if(columns[valIndex]=='point'){var coords=vals[valIndex].split(',');geometry.y=parseFloat(coords[0]);geometry.x=parseFloat(coords[1]);set=true;}else if(columns[valIndex]=='lat'){geometry.y=parseFloat(vals[valIndex]);set=true;}else if(columns[valIndex]=='lon'){geometry.x=parseFloat(vals[valIndex]);set=true;}else if(columns[valIndex]=='title')
+attributes['title']=vals[valIndex];else if(columns[valIndex]=='image'||columns[valIndex]=='icon'&&style){style['externalGraphic']=vals[valIndex];}else if(columns[valIndex]=='iconSize'&&style){var size=vals[valIndex].split(',');style['graphicWidth']=parseFloat(size[0]);style['graphicHeight']=parseFloat(size[1]);}else if(columns[valIndex]=='iconOffset'&&style){var offset=vals[valIndex].split(',');style['graphicXOffset']=parseFloat(offset[0]);style['graphicYOffset']=parseFloat(offset[1]);}else if(columns[valIndex]=='description'){attributes['description']=vals[valIndex];}else if(columns[valIndex]=='overflow'){attributes['overflow']=vals[valIndex];}else{attributes[columns[valIndex]]=vals[valIndex];}}}
+if(set){if(this.internalProjection&&this.externalProjection){geometry.transform(this.externalProjection,this.internalProjection);}
+var feature=new OpenLayers.Feature.Vector(geometry,attributes,style);features.push(feature);}}}}
+return features;},CLASS_NAME:"OpenLayers.Format.Text"});OpenLayers.Geometry.MultiPoint=OpenLayers.Class(OpenLayers.Geometry.Collection,{componentTypes:["OpenLayers.Geometry.Point"],initialize:function(components){OpenLayers.Geometry.Collection.prototype.initialize.apply(this,arguments);},addPoint:function(point,index){this.addComponent(point,index);},removePoint:function(point){this.removeComponent(point);},CLASS_NAME:"OpenLayers.Geometry.MultiPoint"});OpenLayers.Handler.Point=OpenLayers.Class(OpenLayers.Handler,{point:null,layer:null,multi:false,drawing:false,mouseDown:false,lastDown:null,lastUp:null,persist:false,layerOptions:null,initialize:function(control,callbacks,options){if(!(options&&options.layerOptions&&options.layerOptions.styleMap)){this.style=OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'],{});}
+OpenLayers.Handler.prototype.initialize.apply(this,arguments);},activate:function(){if(!OpenLayers.Handler.prototype.activate.apply(this,arguments)){return false;}
+var options=OpenLayers.Util.extend({displayInLayerSwitcher:false,calculateInRange:OpenLayers.Function.True},this.layerOptions);this.layer=new OpenLayers.Layer.Vector(this.CLASS_NAME,options);this.map.addLayer(this.layer);return true;},createFeature:function(pixel){var lonlat=this.map.getLonLatFromPixel(pixel);this.point=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat));this.callback("create",[this.point.geometry,this.point]);this.point.geometry.clearBounds();this.layer.addFeatures([this.point],{silent:true});},deactivate:function(){if(!OpenLayers.Handler.prototype.deactivate.apply(this,arguments)){return false;}
+if(this.drawing){this.cancel();}
+this.destroyFeature();if(this.layer.map!=null){this.layer.destroy(false);}
+this.layer=null;return true;},destroyFeature:function(){if(this.layer){this.layer.destroyFeatures();}
+this.point=null;},finalize:function(cancel){var key=cancel?"cancel":"done";this.drawing=false;this.mouseDown=false;this.lastDown=null;this.lastUp=null;this.callback(key,[this.geometryClone()]);if(cancel||!this.persist){this.destroyFeature();}},cancel:function(){this.finalize(true);},click:function(evt){OpenLayers.Event.stop(evt);return false;},dblclick:function(evt){OpenLayers.Event.stop(evt);return false;},modifyFeature:function(pixel){var lonlat=this.map.getLonLatFromPixel(pixel);this.point.geometry.x=lonlat.lon;this.point.geometry.y=lonlat.lat;this.callback("modify",[this.point.geometry,this.point]);this.point.geometry.clearBounds();this.drawFeature();},drawFeature:function(){this.layer.drawFeature(this.point,this.style);},getGeometry:function(){var geometry=this.point&&this.point.geometry;if(geometry&&this.multi){geometry=new OpenLayers.Geometry.MultiPoint([geometry]);}
+return geometry;},geometryClone:function(){var geom=this.getGeometry();return geom&&geom.clone();},mousedown:function(evt){if(!this.checkModifiers(evt)){return true;}
+if(this.lastDown&&this.lastDown.equals(evt.xy)){return true;}
+this.drawing=true;if(this.lastDown==null){if(this.persist){this.destroyFeature();}
+this.createFeature(evt.xy);}else{this.modifyFeature(evt.xy);}
+this.lastDown=evt.xy;return false;},mousemove:function(evt){if(this.drawing){this.modifyFeature(evt.xy);}
+return true;},mouseup:function(evt){if(this.drawing){this.finalize();return false;}else{return true;}},CLASS_NAME:"OpenLayers.Handler.Point"});OpenLayers.Layer.GML=OpenLayers.Class(OpenLayers.Layer.Vector,{loaded:false,format:null,formatOptions:null,initialize:function(name,url,options){var newArguments=[];newArguments.push(name,options);OpenLayers.Layer.Vector.prototype.initialize.apply(this,newArguments);this.url=url;},setVisibility:function(visibility,noEvent){OpenLayers.Layer.Vector.prototype.setVisibility.apply(this,arguments);if(this.visibility&&!this.loaded){this.loadGML();}},moveTo:function(bounds,zoomChanged,minor){OpenLayers.Layer.Vector.prototype.moveTo.apply(this,arguments);if(this.visibility&&!this.loaded){this.loadGML();}},loadGML:function(){if(!this.loaded){this.events.triggerEvent("loadstart");OpenLayers.Request.GET({url:this.url,success:this.requestSuccess,failure:this.requestFailure,scope:this});this.loaded=true;}},setUrl:function(url){this.url=url;this.destroyFeatures();this.loaded=false;this.loadGML();},requestSuccess:function(request){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+var options={};OpenLayers.Util.extend(options,this.formatOptions);if(this.map&&!this.projection.equals(this.map.getProjectionObject())){options.externalProjection=this.projection;options.internalProjection=this.map.getProjectionObject();}
+var gml=this.format?new this.format(options):new OpenLayers.Format.GML(options);this.addFeatures(gml.read(doc));this.events.triggerEvent("loadend");},requestFailure:function(request){OpenLayers.Console.userError(OpenLayers.i18n("errorLoadingGML",{'url':this.url}));this.events.triggerEvent("loadend");},CLASS_NAME:"OpenLayers.Layer.GML"});OpenLayers.Layer.PointTrack=OpenLayers.Class(OpenLayers.Layer.Vector,{dataFrom:null,initialize:function(name,options){OpenLayers.Layer.Vector.prototype.initialize.apply(this,arguments);},addNodes:function(pointFeatures){if(pointFeatures.length<2){OpenLayers.Console.error("At least two point features have to be added to create"+"a line from");return;}
+var lines=new Array(pointFeatures.length-1);var pointFeature,startPoint,endPoint;for(var i=0,len=pointFeatures.length;i<len;i++){pointFeature=pointFeatures[i];endPoint=pointFeature.geometry;if(!endPoint){var lonlat=pointFeature.lonlat;endPoint=new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat);}else if(endPoint.CLASS_NAME!="OpenLayers.Geometry.Point"){OpenLayers.Console.error("Only features with point geometries are supported.");return;}
+if(i>0){var attributes=(this.dataFrom!=null)?(pointFeatures[i+this.dataFrom].data||pointFeatures[i+this.dataFrom].attributes):null;var line=new OpenLayers.Geometry.LineString([startPoint,endPoint]);lines[i-1]=new OpenLayers.Feature.Vector(line,attributes);}
+startPoint=endPoint;}
+this.addFeatures(lines);},CLASS_NAME:"OpenLayers.Layer.PointTrack"});OpenLayers.Layer.PointTrack.dataFrom={'SOURCE_NODE':-1,'TARGET_NODE':0};OpenLayers.Layer.Vector.RootContainer=OpenLayers.Class(OpenLayers.Layer.Vector,{displayInLayerSwitcher:false,layers:null,initialize:function(name,options){OpenLayers.Layer.Vector.prototype.initialize.apply(this,arguments);},display:function(){},getFeatureFromEvent:function(evt){var layers=this.layers;var feature;for(var i=0;i<layers.length;i++){feature=layers[i].getFeatureFromEvent(evt);if(feature){return feature;}}},setMap:function(map){OpenLayers.Layer.Vector.prototype.setMap.apply(this,arguments);this.collectRoots();map.events.register("changelayer",this,this.handleChangeLayer);},removeMap:function(map){map.events.unregister("changelayer",this,this.handleChangeLayer);this.resetRoots();OpenLayers.Layer.Vector.prototype.removeMap.apply(this,arguments);},collectRoots:function(){var layer;for(var i=0;i<this.map.layers.length;++i){layer=this.map.layers[i];if(OpenLayers.Util.indexOf(this.layers,layer)!=-1){layer.renderer.moveRoot(this.renderer);}}},resetRoots:function(){var layer;for(var i=0;i<this.layers.length;++i){layer=this.layers[i];if(this.renderer&&layer.renderer.getRenderLayerId()==this.id){this.renderer.moveRoot(layer.renderer);}}},handleChangeLayer:function(evt){var layer=evt.layer;if(evt.property=="order"&&OpenLayers.Util.indexOf(this.layers,layer)!=-1){this.resetRoots();this.collectRoots();}},CLASS_NAME:"OpenLayers.Layer.Vector.RootContainer"});OpenLayers.Layer.WFS=OpenLayers.Class(OpenLayers.Layer.Vector,OpenLayers.Layer.Markers,{isBaseLayer:false,tile:null,ratio:2,DEFAULT_PARAMS:{service:"WFS",version:"1.0.0",request:"GetFeature"},featureClass:null,format:null,formatObject:null,formatOptions:null,vectorMode:true,encodeBBOX:false,extractAttributes:false,initialize:function(name,url,params,options){if(options==undefined){options={};}
+if(options.featureClass||!OpenLayers.Layer.Vector||!OpenLayers.Feature.Vector){this.vectorMode=false;}
+params=OpenLayers.Util.upperCaseObject(params);OpenLayers.Util.extend(options,{'reportError':false});var newArguments=[];newArguments.push(name,options);OpenLayers.Layer.Vector.prototype.initialize.apply(this,newArguments);if(!this.renderer||!this.vectorMode){this.vectorMode=false;if(!options.featureClass){options.featureClass=OpenLayers.Feature.WFS;}
+OpenLayers.Layer.Markers.prototype.initialize.apply(this,newArguments);}
+if(this.params&&this.params.typename&&!this.options.typename){this.options.typename=this.params.typename;}
+if(!this.options.geometry_column){this.options.geometry_column="the_geom";}
+this.params=OpenLayers.Util.applyDefaults(params,OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS));this.url=url;},destroy:function(){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.destroy.apply(this,arguments);}else{OpenLayers.Layer.Markers.prototype.destroy.apply(this,arguments);}
+if(this.tile){this.tile.destroy();}
+this.tile=null;this.ratio=null;this.featureClass=null;this.format=null;if(this.formatObject&&this.formatObject.destroy){this.formatObject.destroy();}
+this.formatObject=null;this.formatOptions=null;this.vectorMode=null;this.encodeBBOX=null;this.extractAttributes=null;},setMap:function(map){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.setMap.apply(this,arguments);var options={'extractAttributes':this.extractAttributes};OpenLayers.Util.extend(options,this.formatOptions);if(this.map&&!this.projection.equals(this.map.getProjectionObject())){options.externalProjection=this.projection;options.internalProjection=this.map.getProjectionObject();}
+this.formatObject=this.format?new this.format(options):new OpenLayers.Format.GML(options);}else{OpenLayers.Layer.Markers.prototype.setMap.apply(this,arguments);}},moveTo:function(bounds,zoomChanged,dragging){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.moveTo.apply(this,arguments);}else{OpenLayers.Layer.Markers.prototype.moveTo.apply(this,arguments);}
+if(dragging){return false;}
+if(zoomChanged){if(this.vectorMode){this.renderer.clear();}}
+if(this.options.minZoomLevel){OpenLayers.Console.warn(OpenLayers.i18n('minZoomLevelError'));if(this.map.getZoom()<this.options.minZoomLevel){return null;}}
+if(bounds==null){bounds=this.map.getExtent();}
+var firstRendering=(this.tile==null);var outOfBounds=(!firstRendering&&!this.tile.bounds.containsBounds(bounds));if(zoomChanged||firstRendering||(!dragging&&outOfBounds)){var center=bounds.getCenterLonLat();var tileWidth=bounds.getWidth()*this.ratio;var tileHeight=bounds.getHeight()*this.ratio;var tileBounds=new OpenLayers.Bounds(center.lon-(tileWidth/2),center.lat-(tileHeight/2),center.lon+(tileWidth/2),center.lat+(tileHeight/2));var tileSize=this.map.getSize();tileSize.w=tileSize.w*this.ratio;tileSize.h=tileSize.h*this.ratio;var ul=new OpenLayers.LonLat(tileBounds.left,tileBounds.top);var pos=this.map.getLayerPxFromLonLat(ul);var url=this.getFullRequestString();var params=null;var filter=this.params.filter||this.params.FILTER;if(filter){params={FILTER:filter};}
+else{params={BBOX:this.encodeBBOX?tileBounds.toBBOX():tileBounds.toArray()};}
+if(this.map&&!this.projection.equals(this.map.getProjectionObject())){var projectedBounds=tileBounds.clone();projectedBounds.transform(this.map.getProjectionObject(),this.projection);if(!filter){params.BBOX=this.encodeBBOX?projectedBounds.toBBOX():projectedBounds.toArray();}}
+url+="&"+OpenLayers.Util.getParameterString(params);if(!this.tile){this.tile=new OpenLayers.Tile.WFS(this,pos,tileBounds,url,tileSize);this.addTileMonitoringHooks(this.tile);this.tile.draw();}else{if(this.vectorMode){this.destroyFeatures();this.renderer.clear();}else{this.clearMarkers();}
+this.removeTileMonitoringHooks(this.tile);this.tile.destroy();this.tile=null;this.tile=new OpenLayers.Tile.WFS(this,pos,tileBounds,url,tileSize);this.addTileMonitoringHooks(this.tile);this.tile.draw();}}},addTileMonitoringHooks:function(tile){tile.onLoadStart=function(){if(this==this.layer.tile){this.layer.events.triggerEvent("loadstart");}};tile.events.register("loadstart",tile,tile.onLoadStart);tile.onLoadEnd=function(){if(this==this.layer.tile){this.layer.events.triggerEvent("tileloaded");this.layer.events.triggerEvent("loadend");}};tile.events.register("loadend",tile,tile.onLoadEnd);tile.events.register("unload",tile,tile.onLoadEnd);},removeTileMonitoringHooks:function(tile){tile.unload();tile.events.un({"loadstart":tile.onLoadStart,"loadend":tile.onLoadEnd,"unload":tile.onLoadEnd,scope:tile});},onMapResize:function(){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.onMapResize.apply(this,arguments);}else{OpenLayers.Layer.Markers.prototype.onMapResize.apply(this,arguments);}},display:function(){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.display.apply(this,arguments);}else{OpenLayers.Layer.Markers.prototype.display.apply(this,arguments);}},mergeNewParams:function(newParams){var upperParams=OpenLayers.Util.upperCaseObject(newParams);var newArguments=[upperParams];return OpenLayers.Layer.HTTPRequest.prototype.mergeNewParams.apply(this,newArguments);},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.WFS(this.name,this.url,this.params,this.getOptions());}
+if(this.vectorMode){obj=OpenLayers.Layer.Vector.prototype.clone.apply(this,[obj]);}else{obj=OpenLayers.Layer.Markers.prototype.clone.apply(this,[obj]);}
+return obj;},getFullRequestString:function(newParams,altUrl){var projectionCode=this.projection.getCode()||this.map.getProjection();this.params.SRS=(projectionCode=="none")?null:projectionCode;return OpenLayers.Layer.Grid.prototype.getFullRequestString.apply(this,arguments);},commit:function(){if(!this.writer){var options={};if(this.map&&!this.projection.equals(this.map.getProjectionObject())){options.externalProjection=this.projection;options.internalProjection=this.map.getProjectionObject();}
+this.writer=new OpenLayers.Format.WFS(options,this);}
+var data=this.writer.write(this.features);OpenLayers.Request.POST({url:this.url,data:data,success:this.commitSuccess,failure:this.commitFailure,scope:this});},commitSuccess:function(request){var response=request.responseText;if(response.indexOf('SUCCESS')!=-1){this.commitReport(OpenLayers.i18n("commitSuccess",{'response':response}));for(var i=0;i<this.features.length;i++){this.features[i].state=null;}}else if(response.indexOf('FAILED')!=-1||response.indexOf('Exception')!=-1){this.commitReport(OpenLayers.i18n("commitFailed",{'response':response}));}},commitFailure:function(request){},commitReport:function(string,response){OpenLayers.Console.userError(string);},refresh:function(){if(this.tile){if(this.vectorMode){this.renderer.clear();this.features.length=0;}else{this.clearMarkers();this.markers.length=0;}
+this.tile.draw();}},getDataExtent:function(){var extent;if(this.vectorMode){extent=OpenLayers.Layer.Vector.prototype.getDataExtent.apply(this);}else{extent=OpenLayers.Layer.Markers.prototype.getDataExtent.apply(this);}
+return extent;},setOpacity:function(opacity){if(this.vectorMode){OpenLayers.Layer.Vector.prototype.setOpacity.apply(this,[opacity]);}else{OpenLayers.Layer.Markers.prototype.setOpacity.apply(this,[opacity]);}},CLASS_NAME:"OpenLayers.Layer.WFS"});OpenLayers.Protocol.HTTP=OpenLayers.Class(OpenLayers.Protocol,{url:null,headers:null,params:null,callback:null,scope:null,readWithPOST:false,wildcarded:false,initialize:function(options){options=options||{};this.params={};this.headers={};OpenLayers.Protocol.prototype.initialize.apply(this,arguments);},destroy:function(){this.params=null;this.headers=null;OpenLayers.Protocol.prototype.destroy.apply(this);},read:function(options){OpenLayers.Protocol.prototype.read.apply(this,arguments);options=OpenLayers.Util.applyDefaults(options,this.options);options.params=OpenLayers.Util.applyDefaults(options.params,this.options.params);if(options.filter){options.params=this.filterToParams(options.filter,options.params);}
+var readWithPOST=(options.readWithPOST!==undefined)?options.readWithPOST:this.readWithPOST;var resp=new OpenLayers.Protocol.Response({requestType:"read"});if(readWithPOST){resp.priv=OpenLayers.Request.POST({url:options.url,callback:this.createCallback(this.handleRead,resp,options),data:OpenLayers.Util.getParameterString(options.params),headers:{"Content-Type":"application/x-www-form-urlencoded"}});}else{resp.priv=OpenLayers.Request.GET({url:options.url,callback:this.createCallback(this.handleRead,resp,options),params:options.params,headers:options.headers});}
+return resp;},handleRead:function(resp,options){this.handleResponse(resp,options);},filterToParams:function(filter,params){params=params||{};var className=filter.CLASS_NAME;var filterType=className.substring(className.lastIndexOf(".")+1);switch(filterType){case"Spatial":switch(filter.type){case OpenLayers.Filter.Spatial.BBOX:params.bbox=filter.value.toArray();break;case OpenLayers.Filter.Spatial.DWITHIN:params.tolerance=filter.distance;case OpenLayers.Filter.Spatial.WITHIN:params.lon=filter.value.x;params.lat=filter.value.y;break;default:OpenLayers.Console.warn("Unknown spatial filter type "+filter.type);}
+break;case"Comparison":var op=OpenLayers.Protocol.HTTP.COMP_TYPE_TO_OP_STR[filter.type];if(op!==undefined){var value=filter.value;if(filter.type==OpenLayers.Filter.Comparison.LIKE){value=this.regex2value(value);if(this.wildcarded){value="%"+value+"%";}}
+params[filter.property+"__"+op]=value;params.queryable=params.queryable||[];params.queryable.push(filter.property);}else{OpenLayers.Console.warn("Unknown comparison filter type "+filter.type);}
+break;case"Logical":if(filter.type===OpenLayers.Filter.Logical.AND){for(var i=0,len=filter.filters.length;i<len;i++){params=this.filterToParams(filter.filters[i],params);}}else{OpenLayers.Console.warn("Unsupported logical filter type "+filter.type);}
+break;default:OpenLayers.Console.warn("Unknown filter type "+filterType);}
+return params;},regex2value:function(value){value=value.replace(/%/g,"\\%");value=value.replace(/\\\\\.(\*)?/g,function($0,$1){return $1?$0:"\\\\_";});value=value.replace(/\\\\\.\*/g,"\\\\%");value=value.replace(/(\\)?\.(\*)?/g,function($0,$1,$2){return $1||$2?$0:"_";});value=value.replace(/(\\)?\.\*/g,function($0,$1){return $1?$0:"%";});value=value.replace(/\\\./g,".");value=value.replace(/(\\)?\\\*/g,function($0,$1){return $1?$0:"*";});return value;},create:function(features,options){options=OpenLayers.Util.applyDefaults(options,this.options);var resp=new OpenLayers.Protocol.Response({reqFeatures:features,requestType:"create"});resp.priv=OpenLayers.Request.POST({url:options.url,callback:this.createCallback(this.handleCreate,resp,options),headers:options.headers,data:this.format.write(features)});return resp;},handleCreate:function(resp,options){this.handleResponse(resp,options);},update:function(feature,options){options=options||{};var url=options.url||feature.url||this.options.url+"/"+feature.fid;options=OpenLayers.Util.applyDefaults(options,this.options);var resp=new OpenLayers.Protocol.Response({reqFeatures:feature,requestType:"update"});resp.priv=OpenLayers.Request.PUT({url:url,callback:this.createCallback(this.handleUpdate,resp,options),headers:options.headers,data:this.format.write(feature)});return resp;},handleUpdate:function(resp,options){this.handleResponse(resp,options);},"delete":function(feature,options){options=options||{};var url=options.url||feature.url||this.options.url+"/"+feature.fid;options=OpenLayers.Util.applyDefaults(options,this.options);var resp=new OpenLayers.Protocol.Response({reqFeatures:feature,requestType:"delete"});resp.priv=OpenLayers.Request.DELETE({url:url,callback:this.createCallback(this.handleDelete,resp,options),headers:options.headers});return resp;},handleDelete:function(resp,options){this.handleResponse(resp,options);},handleResponse:function(resp,options){var request=resp.priv;if(options.callback){if(request.status>=200&&request.status<300){if(resp.requestType!="delete"){resp.features=this.parseFeatures(request);}
+resp.code=OpenLayers.Protocol.Response.SUCCESS;}else{resp.code=OpenLayers.Protocol.Response.FAILURE;}
+options.callback.call(options.scope,resp);}},parseFeatures:function(request){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+if(!doc||doc.length<=0){return null;}
+return this.format.read(doc);},commit:function(features,options){options=OpenLayers.Util.applyDefaults(options,this.options);var resp=[],nResponses=0;var types={};types[OpenLayers.State.INSERT]=[];types[OpenLayers.State.UPDATE]=[];types[OpenLayers.State.DELETE]=[];var feature,list,requestFeatures=[];for(var i=0,len=features.length;i<len;++i){feature=features[i];list=types[feature.state];if(list){list.push(feature);requestFeatures.push(feature);}}
+var nRequests=(types[OpenLayers.State.INSERT].length>0?1:0)+
+types[OpenLayers.State.UPDATE].length+
+types[OpenLayers.State.DELETE].length;var success=true;var finalResponse=new OpenLayers.Protocol.Response({reqFeatures:requestFeatures});function insertCallback(response){var len=response.features?response.features.length:0;var fids=new Array(len);for(var i=0;i<len;++i){fids[i]=response.features[i].fid;}
+finalResponse.insertIds=fids;callback.apply(this,[response]);}
+function callback(response){this.callUserCallback(response,options);success=success&&response.success();nResponses++;if(nResponses>=nRequests){if(options.callback){finalResponse.code=success?OpenLayers.Protocol.Response.SUCCESS:OpenLayers.Protocol.Response.FAILURE;options.callback.apply(options.scope,[finalResponse]);}}}
+var queue=types[OpenLayers.State.INSERT];if(queue.length>0){resp.push(this.create(queue,OpenLayers.Util.applyDefaults({callback:insertCallback,scope:this},options.create)));}
+queue=types[OpenLayers.State.UPDATE];for(var i=queue.length-1;i>=0;--i){resp.push(this.update(queue[i],OpenLayers.Util.applyDefaults({callback:callback,scope:this},options.update)));}
+queue=types[OpenLayers.State.DELETE];for(var i=queue.length-1;i>=0;--i){resp.push(this["delete"](queue[i],OpenLayers.Util.applyDefaults({callback:callback,scope:this},options["delete"])));}
+return resp;},abort:function(response){if(response){response.priv.abort();}},callUserCallback:function(resp,options){var opt=options[resp.requestType];if(opt&&opt.callback){opt.callback.call(opt.scope,resp);}},CLASS_NAME:"OpenLayers.Protocol.HTTP"});(function(){var o=OpenLayers.Protocol.HTTP.COMP_TYPE_TO_OP_STR={};o[OpenLayers.Filter.Comparison.EQUAL_TO]="eq";o[OpenLayers.Filter.Comparison.NOT_EQUAL_TO]="ne";o[OpenLayers.Filter.Comparison.LESS_THAN]="lt";o[OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO]="lte";o[OpenLayers.Filter.Comparison.GREATER_THAN]="gt";o[OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO]="gte";o[OpenLayers.Filter.Comparison.LIKE]="ilike";})();OpenLayers.Strategy.BBOX=OpenLayers.Class(OpenLayers.Strategy,{bounds:null,resolution:null,ratio:2,resFactor:null,response:null,initialize:function(options){OpenLayers.Strategy.prototype.initialize.apply(this,[options]);},activate:function(){var activated=OpenLayers.Strategy.prototype.activate.call(this);if(activated){this.layer.events.on({"moveend":this.update,scope:this});this.layer.events.on({"refresh":this.update,scope:this});}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Strategy.prototype.deactivate.call(this);if(deactivated){this.layer.events.un({"moveend":this.update,scope:this});this.layer.events.un({"refresh":this.update,scope:this});}
+return deactivated;},update:function(options){var mapBounds=this.getMapBounds();if((options&&options.force)||this.invalidBounds(mapBounds)){this.calculateBounds(mapBounds);this.resolution=this.layer.map.getResolution();this.triggerRead();}},getMapBounds:function(){var bounds=this.layer.map.getExtent();if(!this.layer.projection.equals(this.layer.map.getProjectionObject())){bounds=bounds.clone().transform(this.layer.map.getProjectionObject(),this.layer.projection);}
+return bounds;},invalidBounds:function(mapBounds){if(!mapBounds){mapBounds=this.getMapBounds();}
+var invalid=!this.bounds||!this.bounds.containsBounds(mapBounds);if(!invalid&&this.resFactor){var ratio=this.resolution/this.layer.map.getResolution();invalid=(ratio>=this.resFactor||ratio<=(1/this.resFactor));}
+return invalid;},calculateBounds:function(mapBounds){if(!mapBounds){mapBounds=this.getMapBounds();}
+var center=mapBounds.getCenterLonLat();var dataWidth=mapBounds.getWidth()*this.ratio;var dataHeight=mapBounds.getHeight()*this.ratio;this.bounds=new OpenLayers.Bounds(center.lon-(dataWidth/2),center.lat-(dataHeight/2),center.lon+(dataWidth/2),center.lat+(dataHeight/2));},triggerRead:function(){if(this.response){this.layer.protocol.abort(this.response);this.layer.events.triggerEvent("loadend");}
+this.layer.events.triggerEvent("loadstart");this.response=this.layer.protocol.read({filter:this.createFilter(),callback:this.merge,scope:this});},createFilter:function(){var filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.BBOX,value:this.bounds,projection:this.layer.projection});if(this.layer.filter){filter=new OpenLayers.Filter.Logical({type:OpenLayers.Filter.Logical.AND,filters:[this.layer.filter,filter]});}
+return filter;},merge:function(resp){this.layer.destroyFeatures();var features=resp.features;if(features&&features.length>0){var remote=this.layer.projection;var local=this.layer.map.getProjectionObject();if(!local.equals(remote)){var geom;for(var i=0,len=features.length;i<len;++i){geom=features[i].geometry;if(geom){geom.transform(remote,local);}}}
+this.layer.addFeatures(features);}
+this.response=null;this.layer.events.triggerEvent("loadend");},CLASS_NAME:"OpenLayers.Strategy.BBOX"});OpenLayers.Control.SelectFeature=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:["beforefeaturehighlighted","featurehighlighted","featureunhighlighted"],multipleKey:null,toggleKey:null,multiple:false,clickout:true,toggle:false,hover:false,highlightOnly:false,box:false,onBeforeSelect:function(){},onSelect:function(){},onUnselect:function(){},scope:null,geometryTypes:null,layer:null,layers:null,callbacks:null,selectStyle:null,renderIntent:"select",handlers:null,initialize:function(layers,options){this.EVENT_TYPES=OpenLayers.Control.SelectFeature.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);if(this.scope===null){this.scope=this;}
+this.initLayer(layers);var callbacks={click:this.clickFeature,clickout:this.clickoutFeature};if(this.hover){callbacks.over=this.overFeature;callbacks.out=this.outFeature;}
+this.callbacks=OpenLayers.Util.extend(callbacks,this.callbacks);this.handlers={feature:new OpenLayers.Handler.Feature(this,this.layer,this.callbacks,{geometryTypes:this.geometryTypes})};if(this.box){this.handlers.box=new OpenLayers.Handler.Box(this,{done:this.selectBox},{boxDivClassName:"olHandlerBoxSelectFeature"});}},initLayer:function(layers){if(layers instanceof Array){this.layers=layers;this.layer=new OpenLayers.Layer.Vector.RootContainer(this.id+"_container",{layers:layers});}else{this.layer=layers;}},destroy:function(){if(this.active&&this.layers){this.map.removeLayer(this.layer);}
+OpenLayers.Control.prototype.destroy.apply(this,arguments);if(this.layers){this.layer.destroy();}},activate:function(){if(!this.active){if(this.layers){this.map.addLayer(this.layer);}
+this.handlers.feature.activate();if(this.box&&this.handlers.box){this.handlers.box.activate();}}
+return OpenLayers.Control.prototype.activate.apply(this,arguments);},deactivate:function(){if(this.active){this.handlers.feature.deactivate();if(this.handlers.box){this.handlers.box.deactivate();}
+if(this.layers){this.map.removeLayer(this.layer);}}
+return OpenLayers.Control.prototype.deactivate.apply(this,arguments);},unselectAll:function(options){var layers=this.layers||[this.layer];var layer,feature;for(var l=0;l<layers.length;++l){layer=layers[l];for(var i=layer.selectedFeatures.length-1;i>=0;--i){feature=layer.selectedFeatures[i];if(!options||options.except!=feature){this.unselect(feature);}}}},clickFeature:function(feature){if(!this.hover){var selected=(OpenLayers.Util.indexOf(feature.layer.selectedFeatures,feature)>-1);if(selected){if(this.toggleSelect()){this.unselect(feature);}else if(!this.multipleSelect()){this.unselectAll({except:feature});}}else{if(!this.multipleSelect()){this.unselectAll({except:feature});}
+this.select(feature);}}},multipleSelect:function(){return this.multiple||(this.handlers.feature.evt&&this.handlers.feature.evt[this.multipleKey]);},toggleSelect:function(){return this.toggle||(this.handlers.feature.evt&&this.handlers.feature.evt[this.toggleKey]);},clickoutFeature:function(feature){if(!this.hover&&this.clickout){this.unselectAll();}},overFeature:function(feature){var layer=feature.layer;if(this.hover){if(this.highlightOnly){this.highlight(feature);}else if(OpenLayers.Util.indexOf(layer.selectedFeatures,feature)==-1){this.select(feature);}}},outFeature:function(feature){if(this.hover){if(this.highlightOnly){if(feature._lastHighlighter==this.id){if(feature._prevHighlighter&&feature._prevHighlighter!=this.id){delete feature._lastHighlighter;var control=this.map.getControl(feature._prevHighlighter);if(control){control.highlight(feature);}}else{this.unhighlight(feature);}}}else{this.unselect(feature);}}},highlight:function(feature){var layer=feature.layer;var cont=this.events.triggerEvent("beforefeaturehighlighted",{feature:feature});if(cont!==false){feature._prevHighlighter=feature._lastHighlighter;feature._lastHighlighter=this.id;var style=this.selectStyle||this.renderIntent;layer.drawFeature(feature,style);this.events.triggerEvent("featurehighlighted",{feature:feature});}},unhighlight:function(feature){var layer=feature.layer;feature._lastHighlighter=feature._prevHighlighter;delete feature._prevHighlighter;layer.drawFeature(feature,feature.style||feature.layer.style||"default");this.events.triggerEvent("featureunhighlighted",{feature:feature});},select:function(feature){var cont=this.onBeforeSelect.call(this.scope,feature);var layer=feature.layer;if(cont!==false){cont=layer.events.triggerEvent("beforefeatureselected",{feature:feature});if(cont!==false){layer.selectedFeatures.push(feature);this.highlight(feature);if(!this.handlers.feature.lastFeature){this.handlers.feature.lastFeature=layer.selectedFeatures[0];}
+layer.events.triggerEvent("featureselected",{feature:feature});this.onSelect.call(this.scope,feature);}}},unselect:function(feature){var layer=feature.layer;this.unhighlight(feature);OpenLayers.Util.removeItem(layer.selectedFeatures,feature);layer.events.triggerEvent("featureunselected",{feature:feature});this.onUnselect.call(this.scope,feature);},selectBox:function(position){if(position instanceof OpenLayers.Bounds){var minXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.left,position.bottom));var maxXY=this.map.getLonLatFromPixel(new OpenLayers.Pixel(position.right,position.top));var bounds=new OpenLayers.Bounds(minXY.lon,minXY.lat,maxXY.lon,maxXY.lat);if(!this.multipleSelect()){this.unselectAll();}
+var prevMultiple=this.multiple;this.multiple=true;var layers=this.layers||[this.layer];var layer;for(var l=0;l<layers.length;++l){layer=layers[l];for(var i=0,len=layer.features.length;i<len;++i){var feature=layer.features[i];if(!feature.getVisibility()){continue;}
+if(this.geometryTypes==null||OpenLayers.Util.indexOf(this.geometryTypes,feature.geometry.CLASS_NAME)>-1){if(bounds.toGeometry().intersects(feature.geometry)){if(OpenLayers.Util.indexOf(layer.selectedFeatures,feature)==-1){this.select(feature);}}}}}
+this.multiple=prevMultiple;}},setMap:function(map){this.handlers.feature.setMap(map);if(this.box){this.handlers.box.setMap(map);}
+OpenLayers.Control.prototype.setMap.apply(this,arguments);},setLayer:function(layers){var isActive=this.active;this.unselectAll();this.deactivate();if(this.layers){this.layer.destroy();this.layers=null;}
+this.initLayer(layers);this.handlers.feature.layer=this.layer;if(isActive){this.activate();}},CLASS_NAME:"OpenLayers.Control.SelectFeature"});OpenLayers.Format.Filter.v1=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{ogc:"http://www.opengis.net/ogc",gml:"http://www.opengis.net/gml",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},defaultPrefix:"ogc",schemaLocation:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){var obj={};this.readers.ogc["Filter"].apply(this,[data,obj]);return obj.filter;},readers:{"ogc":{"Filter":function(node,parent){var obj={fids:[],filters:[]};this.readChildNodes(node,obj);if(obj.fids.length>0){parent.filter=new OpenLayers.Filter.FeatureId({fids:obj.fids});}else if(obj.filters.length>0){parent.filter=obj.filters[0];}},"FeatureId":function(node,obj){var fid=node.getAttribute("fid");if(fid){obj.fids.push(fid);}},"And":function(node,obj){var filter=new OpenLayers.Filter.Logical({type:OpenLayers.Filter.Logical.AND});this.readChildNodes(node,filter);obj.filters.push(filter);},"Or":function(node,obj){var filter=new OpenLayers.Filter.Logical({type:OpenLayers.Filter.Logical.OR});this.readChildNodes(node,filter);obj.filters.push(filter);},"Not":function(node,obj){var filter=new OpenLayers.Filter.Logical({type:OpenLayers.Filter.Logical.NOT});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsLessThan":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.LESS_THAN});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsGreaterThan":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.GREATER_THAN});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsLessThanOrEqualTo":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsGreaterThanOrEqualTo":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsBetween":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.BETWEEN});this.readChildNodes(node,filter);obj.filters.push(filter);},"Literal":function(node,obj){obj.value=OpenLayers.String.numericIf(this.getChildValue(node));},"PropertyName":function(node,filter){filter.property=this.getChildValue(node);},"LowerBoundary":function(node,filter){filter.lowerBoundary=OpenLayers.String.numericIf(this.readOgcExpression(node));},"UpperBoundary":function(node,filter){filter.upperBoundary=OpenLayers.String.numericIf(this.readOgcExpression(node));},"Intersects":function(node,obj){this.readSpatial(node,obj,OpenLayers.Filter.Spatial.INTERSECTS);},"Within":function(node,obj){this.readSpatial(node,obj,OpenLayers.Filter.Spatial.WITHIN);},"Contains":function(node,obj){this.readSpatial(node,obj,OpenLayers.Filter.Spatial.CONTAINS);},"DWithin":function(node,obj){this.readSpatial(node,obj,OpenLayers.Filter.Spatial.DWITHIN);},"Distance":function(node,obj){obj.distance=parseInt(this.getChildValue(node));obj.distanceUnits=node.getAttribute("units");}}},readSpatial:function(node,obj,type){var filter=new OpenLayers.Filter.Spatial({type:type});this.readChildNodes(node,filter);filter.value=filter.components[0];delete filter.components;obj.filters.push(filter);},readOgcExpression:function(node){var obj={};this.readChildNodes(node,obj);var value=obj.value;if(value===undefined){value=this.getChildValue(node);}
+return value;},write:function(filter){return this.writers.ogc["Filter"].apply(this,[filter]);},writers:{"ogc":{"Filter":function(filter){var node=this.createElementNSPlus("ogc:Filter");var sub=filter.CLASS_NAME.split(".").pop();if(sub=="FeatureId"){for(var i=0;i<filter.fids.length;++i){this.writeNode("FeatureId",filter.fids[i],node);}}else{this.writeNode(this.getFilterType(filter),filter,node);}
+return node;},"FeatureId":function(fid){return this.createElementNSPlus("ogc:FeatureId",{attributes:{fid:fid}});},"And":function(filter){var node=this.createElementNSPlus("ogc:And");var childFilter;for(var i=0;i<filter.filters.length;++i){childFilter=filter.filters[i];this.writeNode(this.getFilterType(childFilter),childFilter,node);}
+return node;},"Or":function(filter){var node=this.createElementNSPlus("ogc:Or");var childFilter;for(var i=0;i<filter.filters.length;++i){childFilter=filter.filters[i];this.writeNode(this.getFilterType(childFilter),childFilter,node);}
+return node;},"Not":function(filter){var node=this.createElementNSPlus("ogc:Not");var childFilter=filter.filters[0];this.writeNode(this.getFilterType(childFilter),childFilter,node);return node;},"PropertyIsLessThan":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsLessThan");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsGreaterThan":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsGreaterThan");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsLessThanOrEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsLessThanOrEqualTo");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsGreaterThanOrEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsGreaterThanOrEqualTo");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsBetween":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsBetween");this.writeNode("PropertyName",filter,node);this.writeNode("LowerBoundary",filter,node);this.writeNode("UpperBoundary",filter,node);return node;},"PropertyName":function(filter){return this.createElementNSPlus("ogc:PropertyName",{value:filter.property});},"Literal":function(value){return this.createElementNSPlus("ogc:Literal",{value:value});},"LowerBoundary":function(filter){var node=this.createElementNSPlus("ogc:LowerBoundary");this.writeNode("Literal",filter.lowerBoundary,node);return node;},"UpperBoundary":function(filter){var node=this.createElementNSPlus("ogc:UpperBoundary");this.writeNode("Literal",filter.upperBoundary,node);return node;},"INTERSECTS":function(filter){return this.writeSpatial(filter,"Intersects");},"WITHIN":function(filter){return this.writeSpatial(filter,"Within");},"CONTAINS":function(filter){return this.writeSpatial(filter,"Contains");},"DWITHIN":function(filter){var node=this.writeSpatial(filter,"DWithin");this.writeNode("Distance",filter,node);return node;},"Distance":function(filter){return this.createElementNSPlus("ogc:Distance",{attributes:{units:filter.distanceUnits},value:filter.distance});}}},getFilterType:function(filter){var filterType=this.filterMap[filter.type];if(!filterType){throw"Filter writing not supported for rule type: "+filter.type;}
+return filterType;},filterMap:{"&&":"And","||":"Or","!":"Not","==":"PropertyIsEqualTo","!=":"PropertyIsNotEqualTo","<":"PropertyIsLessThan",">":"PropertyIsGreaterThan","<=":"PropertyIsLessThanOrEqualTo",">=":"PropertyIsGreaterThanOrEqualTo","..":"PropertyIsBetween","~":"PropertyIsLike","BBOX":"BBOX","DWITHIN":"DWITHIN","WITHIN":"WITHIN","CONTAINS":"CONTAINS","INTERSECTS":"INTERSECTS"},CLASS_NAME:"OpenLayers.Format.Filter.v1"});OpenLayers.Geometry.Curve=OpenLayers.Class(OpenLayers.Geometry.MultiPoint,{componentTypes:["OpenLayers.Geometry.Point"],initialize:function(points){OpenLayers.Geometry.MultiPoint.prototype.initialize.apply(this,arguments);},getLength:function(){var length=0.0;if(this.components&&(this.components.length>1)){for(var i=1,len=this.components.length;i<len;i++){length+=this.components[i-1].distanceTo(this.components[i]);}}
+return length;},getGeodesicLength:function(projection){var geom=this;if(projection){var gg=new OpenLayers.Projection("EPSG:4326");if(!gg.equals(projection)){geom=this.clone().transform(projection,gg);}}
+var length=0.0;if(geom.components&&(geom.components.length>1)){var p1,p2;for(var i=1,len=geom.components.length;i<len;i++){p1=geom.components[i-1];p2=geom.components[i];length+=OpenLayers.Util.distVincenty({lon:p1.x,lat:p1.y},{lon:p2.x,lat:p2.y});}}
+return length*1000;},CLASS_NAME:"OpenLayers.Geometry.Curve"});OpenLayers.Layer.Text=OpenLayers.Class(OpenLayers.Layer.Markers,{location:null,features:null,formatOptions:null,selectedFeature:null,initialize:function(name,options){OpenLayers.Layer.Markers.prototype.initialize.apply(this,arguments);this.features=new Array();},destroy:function(){OpenLayers.Layer.Markers.prototype.destroy.apply(this,arguments);this.clearFeatures();this.features=null;},loadText:function(){if(!this.loaded){if(this.location!=null){var onFail=function(e){this.events.triggerEvent("loadend");};this.events.triggerEvent("loadstart");OpenLayers.Request.GET({url:this.location,success:this.parseData,failure:onFail,scope:this});this.loaded=true;}}},moveTo:function(bounds,zoomChanged,minor){OpenLayers.Layer.Markers.prototype.moveTo.apply(this,arguments);if(this.visibility&&!this.loaded){this.loadText();}},parseData:function(ajaxRequest){var text=ajaxRequest.responseText;var options={};OpenLayers.Util.extend(options,this.formatOptions);if(this.map&&!this.projection.equals(this.map.getProjectionObject())){options.externalProjection=this.projection;options.internalProjection=this.map.getProjectionObject();}
+var parser=new OpenLayers.Format.Text(options);var features=parser.read(text);for(var i=0,len=features.length;i<len;i++){var data={};var feature=features[i];var location;var iconSize,iconOffset;location=new OpenLayers.LonLat(feature.geometry.x,feature.geometry.y);if(feature.style.graphicWidth&&feature.style.graphicHeight){iconSize=new OpenLayers.Size(feature.style.graphicWidth,feature.style.graphicHeight);}
+if(feature.style.graphicXOffset!==undefined&&feature.style.graphicYOffset!==undefined){iconOffset=new OpenLayers.Pixel(feature.style.graphicXOffset,feature.style.graphicYOffset);}
+if(feature.style.externalGraphic!=null){data.icon=new OpenLayers.Icon(feature.style.externalGraphic,iconSize,iconOffset);}else{data.icon=OpenLayers.Marker.defaultIcon();if(iconSize!=null){data.icon.setSize(iconSize);}}
+if((feature.attributes.title!=null)&&(feature.attributes.description!=null)){data['popupContentHTML']='<h2>'+feature.attributes.title+'</h2>'+'<p>'+feature.attributes.description+'</p>';}
+data['overflow']=feature.attributes.overflow||"auto";var markerFeature=new OpenLayers.Feature(this,location,data);this.features.push(markerFeature);var marker=markerFeature.createMarker();if((feature.attributes.title!=null)&&(feature.attributes.description!=null)){marker.events.register('click',markerFeature,this.markerClick);}
+this.addMarker(marker);}
+this.events.triggerEvent("loadend");},markerClick:function(evt){var sameMarkerClicked=(this==this.layer.selectedFeature);this.layer.selectedFeature=(!sameMarkerClicked)?this:null;for(var i=0,len=this.layer.map.popups.length;i<len;i++){this.layer.map.removePopup(this.layer.map.popups[i]);}
+if(!sameMarkerClicked){this.layer.map.addPopup(this.createPopup());}
+OpenLayers.Event.stop(evt);},clearFeatures:function(){if(this.features!=null){while(this.features.length>0){var feature=this.features[0];OpenLayers.Util.removeItem(this.features,feature);feature.destroy();}}},CLASS_NAME:"OpenLayers.Layer.Text"});OpenLayers.Control.ModifyFeature=OpenLayers.Class(OpenLayers.Control,{geometryTypes:null,clickout:true,toggle:true,standalone:false,layer:null,feature:null,vertices:null,virtualVertices:null,selectControl:null,dragControl:null,handlers:null,deleteCodes:null,virtualStyle:null,mode:null,modified:false,radiusHandle:null,dragHandle:null,onModificationStart:function(){},onModification:function(){},onModificationEnd:function(){},initialize:function(layer,options){this.layer=layer;this.vertices=[];this.virtualVertices=[];this.virtualStyle=OpenLayers.Util.extend({},this.layer.style||this.layer.styleMap.createSymbolizer());this.virtualStyle.fillOpacity=0.3;this.virtualStyle.strokeOpacity=0.3;this.deleteCodes=[46,68];this.mode=OpenLayers.Control.ModifyFeature.RESHAPE;OpenLayers.Control.prototype.initialize.apply(this,[options]);if(!(this.deleteCodes instanceof Array)){this.deleteCodes=[this.deleteCodes];}
+var control=this;var selectOptions={geometryTypes:this.geometryTypes,clickout:this.clickout,toggle:this.toggle,onBeforeSelect:this.beforeSelectFeature,onSelect:this.selectFeature,onUnselect:this.unselectFeature,scope:this};if(this.standalone===false){this.selectControl=new OpenLayers.Control.SelectFeature(layer,selectOptions);}
+var dragOptions={geometryTypes:["OpenLayers.Geometry.Point"],snappingOptions:this.snappingOptions,onStart:function(feature,pixel){control.dragStart.apply(control,[feature,pixel]);},onDrag:function(feature,pixel){control.dragVertex.apply(control,[feature,pixel]);},onComplete:function(feature){control.dragComplete.apply(control,[feature]);},featureCallbacks:{over:function(feature){if(control.standalone!==true||feature._sketch||control.feature===feature){control.dragControl.overFeature.apply(control.dragControl,[feature]);}}}};this.dragControl=new OpenLayers.Control.DragFeature(layer,dragOptions);var keyboardOptions={keydown:this.handleKeypress};this.handlers={keyboard:new OpenLayers.Handler.Keyboard(this,keyboardOptions)};},destroy:function(){this.layer=null;this.standalone||this.selectControl.destroy();this.dragControl.destroy();OpenLayers.Control.prototype.destroy.apply(this,[]);},activate:function(){return((this.standalone||this.selectControl.activate())&&this.handlers.keyboard.activate()&&OpenLayers.Control.prototype.activate.apply(this,arguments));},deactivate:function(){var deactivated=false;if(OpenLayers.Control.prototype.deactivate.apply(this,arguments)){this.layer.removeFeatures(this.vertices,{silent:true});this.layer.removeFeatures(this.virtualVertices,{silent:true});this.vertices=[];this.dragControl.deactivate();var feature=this.feature;var valid=feature&&feature.geometry&&feature.layer;if(this.standalone===false){if(valid){this.selectControl.unselect.apply(this.selectControl,[feature]);}
+this.selectControl.deactivate();}else{if(valid){this.unselectFeature(feature);}}
+this.handlers.keyboard.deactivate();deactivated=true;}
+return deactivated;},beforeSelectFeature:function(feature){return this.layer.events.triggerEvent("beforefeaturemodified",{feature:feature});},selectFeature:function(feature){this.feature=feature;this.modified=false;this.resetVertices();this.dragControl.activate();this.onModificationStart(this.feature);},unselectFeature:function(feature){this.layer.removeFeatures(this.vertices,{silent:true});this.vertices=[];this.layer.destroyFeatures(this.virtualVertices,{silent:true});this.virtualVertices=[];if(this.dragHandle){this.layer.destroyFeatures([this.dragHandle],{silent:true});delete this.dragHandle;}
+if(this.radiusHandle){this.layer.destroyFeatures([this.radiusHandle],{silent:true});delete this.radiusHandle;}
+this.feature=null;this.dragControl.deactivate();this.onModificationEnd(feature);this.layer.events.triggerEvent("afterfeaturemodified",{feature:feature,modified:this.modified});this.modified=false;},dragStart:function(feature,pixel){if(feature!=this.feature&&!feature.geometry.parent&&feature!=this.dragHandle&&feature!=this.radiusHandle){if(this.standalone===false&&this.feature){this.selectControl.clickFeature.apply(this.selectControl,[this.feature]);}
+if(this.geometryTypes==null||OpenLayers.Util.indexOf(this.geometryTypes,feature.geometry.CLASS_NAME)!=-1){this.standalone||this.selectControl.clickFeature.apply(this.selectControl,[feature]);this.dragControl.overFeature.apply(this.dragControl,[feature]);this.dragControl.lastPixel=pixel;this.dragControl.handlers.drag.started=true;this.dragControl.handlers.drag.start=pixel;this.dragControl.handlers.drag.last=pixel;}}},dragVertex:function(vertex,pixel){this.modified=true;if(this.feature.geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){if(this.feature!=vertex){this.feature=vertex;}
+this.layer.events.triggerEvent("vertexmodified",{vertex:vertex.geometry,feature:this.feature,pixel:pixel});}else{if(vertex._index){vertex.geometry.parent.addComponent(vertex.geometry,vertex._index);delete vertex._index;OpenLayers.Util.removeItem(this.virtualVertices,vertex);this.vertices.push(vertex);}else if(vertex==this.dragHandle){this.layer.removeFeatures(this.vertices,{silent:true});this.vertices=[];if(this.radiusHandle){this.layer.destroyFeatures([this.radiusHandle],{silent:true});this.radiusHandle=null;}}else if(vertex!==this.radiusHandle){this.layer.events.triggerEvent("vertexmodified",{vertex:vertex.geometry,feature:this.feature,pixel:pixel});}
+if(this.virtualVertices.length>0){this.layer.destroyFeatures(this.virtualVertices,{silent:true});this.virtualVertices=[];}
+this.layer.drawFeature(this.feature,this.standalone?undefined:this.selectControl.renderIntent);}
+this.layer.drawFeature(vertex);},dragComplete:function(vertex){this.resetVertices();this.setFeatureState();this.onModification(this.feature);this.layer.events.triggerEvent("featuremodified",{feature:this.feature});},setFeatureState:function(){if(this.feature.state!=OpenLayers.State.INSERT&&this.feature.state!=OpenLayers.State.DELETE){this.feature.state=OpenLayers.State.UPDATE;}},resetVertices:function(){if(this.dragControl.feature){this.dragControl.outFeature(this.dragControl.feature);}
+if(this.vertices.length>0){this.layer.removeFeatures(this.vertices,{silent:true});this.vertices=[];}
+if(this.virtualVertices.length>0){this.layer.removeFeatures(this.virtualVertices,{silent:true});this.virtualVertices=[];}
+if(this.dragHandle){this.layer.destroyFeatures([this.dragHandle],{silent:true});this.dragHandle=null;}
+if(this.radiusHandle){this.layer.destroyFeatures([this.radiusHandle],{silent:true});this.radiusHandle=null;}
+if(this.feature&&this.feature.geometry.CLASS_NAME!="OpenLayers.Geometry.Point"){if((this.mode&OpenLayers.Control.ModifyFeature.DRAG)){this.collectDragHandle();}
+if((this.mode&(OpenLayers.Control.ModifyFeature.ROTATE|OpenLayers.Control.ModifyFeature.RESIZE))){this.collectRadiusHandle();}
+if(this.mode&OpenLayers.Control.ModifyFeature.RESHAPE){if(!(this.mode&OpenLayers.Control.ModifyFeature.RESIZE)){this.collectVertices();}}}},handleKeypress:function(evt){var code=evt.keyCode;if(this.feature&&OpenLayers.Util.indexOf(this.deleteCodes,code)!=-1){var vertex=this.dragControl.feature;if(vertex&&OpenLayers.Util.indexOf(this.vertices,vertex)!=-1&&!this.dragControl.handlers.drag.dragging&&vertex.geometry.parent){vertex.geometry.parent.removeComponent(vertex.geometry);this.layer.drawFeature(this.feature,this.standalone?undefined:this.selectControl.renderIntent);this.resetVertices();this.setFeatureState();this.onModification(this.feature);this.layer.events.triggerEvent("featuremodified",{feature:this.feature});}}},collectVertices:function(){this.vertices=[];this.virtualVertices=[];var control=this;function collectComponentVertices(geometry){var i,vertex,component,len;if(geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){vertex=new OpenLayers.Feature.Vector(geometry);vertex._sketch=true;control.vertices.push(vertex);}else{var numVert=geometry.components.length;if(geometry.CLASS_NAME=="OpenLayers.Geometry.LinearRing"){numVert-=1;}
+for(i=0;i<numVert;++i){component=geometry.components[i];if(component.CLASS_NAME=="OpenLayers.Geometry.Point"){vertex=new OpenLayers.Feature.Vector(component);vertex._sketch=true;control.vertices.push(vertex);}else{collectComponentVertices(component);}}
+if(geometry.CLASS_NAME!="OpenLayers.Geometry.MultiPoint"){for(i=0,len=geometry.components.length;i<len-1;++i){var prevVertex=geometry.components[i];var nextVertex=geometry.components[i+1];if(prevVertex.CLASS_NAME=="OpenLayers.Geometry.Point"&&nextVertex.CLASS_NAME=="OpenLayers.Geometry.Point"){var x=(prevVertex.x+nextVertex.x)/2;var y=(prevVertex.y+nextVertex.y)/2;var point=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(x,y),null,control.virtualStyle);point.geometry.parent=geometry;point._index=i+1;point._sketch=true;control.virtualVertices.push(point);}}}}}
+collectComponentVertices.call(this,this.feature.geometry);this.layer.addFeatures(this.virtualVertices,{silent:true});this.layer.addFeatures(this.vertices,{silent:true});},collectDragHandle:function(){var geometry=this.feature.geometry;var center=geometry.getBounds().getCenterLonLat();var originGeometry=new OpenLayers.Geometry.Point(center.lon,center.lat);var origin=new OpenLayers.Feature.Vector(originGeometry);originGeometry.move=function(x,y){OpenLayers.Geometry.Point.prototype.move.call(this,x,y);geometry.move(x,y);};origin._sketch=true;this.dragHandle=origin;this.layer.addFeatures([this.dragHandle],{silent:true});},collectRadiusHandle:function(){var geometry=this.feature.geometry;var bounds=geometry.getBounds();var center=bounds.getCenterLonLat();var originGeometry=new OpenLayers.Geometry.Point(center.lon,center.lat);var radiusGeometry=new OpenLayers.Geometry.Point(bounds.right,bounds.bottom);var radius=new OpenLayers.Feature.Vector(radiusGeometry);var resize=(this.mode&OpenLayers.Control.ModifyFeature.RESIZE);var reshape=(this.mode&OpenLayers.Control.ModifyFeature.RESHAPE);var rotate=(this.mode&OpenLayers.Control.ModifyFeature.ROTATE);radiusGeometry.move=function(x,y){OpenLayers.Geometry.Point.prototype.move.call(this,x,y);var dx1=this.x-originGeometry.x;var dy1=this.y-originGeometry.y;var dx0=dx1-x;var dy0=dy1-y;if(rotate){var a0=Math.atan2(dy0,dx0);var a1=Math.atan2(dy1,dx1);var angle=a1-a0;angle*=180/Math.PI;geometry.rotate(angle,originGeometry);}
+if(resize){var scale,ratio;if(reshape){scale=dy1/dy0;ratio=(dx1/dx0)/scale;}else{var l0=Math.sqrt((dx0*dx0)+(dy0*dy0));var l1=Math.sqrt((dx1*dx1)+(dy1*dy1));scale=l1/l0;}
+geometry.resize(scale,originGeometry,ratio);}};radius._sketch=true;this.radiusHandle=radius;this.layer.addFeatures([this.radiusHandle],{silent:true});},setMap:function(map){this.standalone||this.selectControl.setMap(map);this.dragControl.setMap(map);OpenLayers.Control.prototype.setMap.apply(this,arguments);},CLASS_NAME:"OpenLayers.Control.ModifyFeature"});OpenLayers.Control.ModifyFeature.RESHAPE=1;OpenLayers.Control.ModifyFeature.RESIZE=2;OpenLayers.Control.ModifyFeature.ROTATE=4;OpenLayers.Control.ModifyFeature.DRAG=8;OpenLayers.Geometry.LineString=OpenLayers.Class(OpenLayers.Geometry.Curve,{initialize:function(points){OpenLayers.Geometry.Curve.prototype.initialize.apply(this,arguments);},removeComponent:function(point){if(this.components&&(this.components.length>2)){OpenLayers.Geometry.Collection.prototype.removeComponent.apply(this,arguments);}},intersects:function(geometry){var intersect=false;var type=geometry.CLASS_NAME;if(type=="OpenLayers.Geometry.LineString"||type=="OpenLayers.Geometry.LinearRing"||type=="OpenLayers.Geometry.Point"){var segs1=this.getSortedSegments();var segs2;if(type=="OpenLayers.Geometry.Point"){segs2=[{x1:geometry.x,y1:geometry.y,x2:geometry.x,y2:geometry.y}];}else{segs2=geometry.getSortedSegments();}
+var seg1,seg1x1,seg1x2,seg1y1,seg1y2,seg2,seg2y1,seg2y2;outer:for(var i=0,len=segs1.length;i<len;++i){seg1=segs1[i];seg1x1=seg1.x1;seg1x2=seg1.x2;seg1y1=seg1.y1;seg1y2=seg1.y2;inner:for(var j=0,jlen=segs2.length;j<jlen;++j){seg2=segs2[j];if(seg2.x1>seg1x2){break;}
+if(seg2.x2<seg1x1){continue;}
+seg2y1=seg2.y1;seg2y2=seg2.y2;if(Math.min(seg2y1,seg2y2)>Math.max(seg1y1,seg1y2)){continue;}
+if(Math.max(seg2y1,seg2y2)<Math.min(seg1y1,seg1y2)){continue;}
+if(OpenLayers.Geometry.segmentsIntersect(seg1,seg2)){intersect=true;break outer;}}}}else{intersect=geometry.intersects(this);}
+return intersect;},getSortedSegments:function(){var numSeg=this.components.length-1;var segments=new Array(numSeg),point1,point2;for(var i=0;i<numSeg;++i){point1=this.components[i];point2=this.components[i+1];if(point1.x<point2.x){segments[i]={x1:point1.x,y1:point1.y,x2:point2.x,y2:point2.y};}else{segments[i]={x1:point2.x,y1:point2.y,x2:point1.x,y2:point1.y};}}
+function byX1(seg1,seg2){return seg1.x1-seg2.x1;}
+return segments.sort(byX1);},splitWithSegment:function(seg,options){var edge=!(options&&options.edge===false);var tolerance=options&&options.tolerance;var lines=[];var verts=this.getVertices();var points=[];var intersections=[];var split=false;var vert1,vert2,point;var node,vertex,target;var interOptions={point:true,tolerance:tolerance};var result=null;for(var i=0,stop=verts.length-2;i<=stop;++i){vert1=verts[i];points.push(vert1.clone());vert2=verts[i+1];target={x1:vert1.x,y1:vert1.y,x2:vert2.x,y2:vert2.y};point=OpenLayers.Geometry.segmentsIntersect(seg,target,interOptions);if(point instanceof OpenLayers.Geometry.Point){if((point.x===seg.x1&&point.y===seg.y1)||(point.x===seg.x2&&point.y===seg.y2)||point.equals(vert1)||point.equals(vert2)){vertex=true;}else{vertex=false;}
+if(vertex||edge){if(!point.equals(intersections[intersections.length-1])){intersections.push(point.clone());}
+if(i===0){if(point.equals(vert1)){continue;}}
+if(point.equals(vert2)){continue;}
+split=true;if(!point.equals(vert1)){points.push(point);}
+lines.push(new OpenLayers.Geometry.LineString(points));points=[point.clone()];}}}
+if(split){points.push(vert2.clone());lines.push(new OpenLayers.Geometry.LineString(points));}
+if(intersections.length>0){var xDir=seg.x1<seg.x2?1:-1;var yDir=seg.y1<seg.y2?1:-1;result={lines:lines,points:intersections.sort(function(p1,p2){return(xDir*p1.x-xDir*p2.x)||(yDir*p1.y-yDir*p2.y);})};}
+return result;},split:function(target,options){var results=null;var mutual=options&&options.mutual;var sourceSplit,targetSplit,sourceParts,targetParts;if(target instanceof OpenLayers.Geometry.LineString){var verts=this.getVertices();var vert1,vert2,seg,splits,lines,point;var points=[];sourceParts=[];for(var i=0,stop=verts.length-2;i<=stop;++i){vert1=verts[i];vert2=verts[i+1];seg={x1:vert1.x,y1:vert1.y,x2:vert2.x,y2:vert2.y};targetParts=targetParts||[target];if(mutual){points.push(vert1.clone());}
+for(var j=0;j<targetParts.length;++j){splits=targetParts[j].splitWithSegment(seg,options);if(splits){lines=splits.lines;if(lines.length>0){lines.unshift(j,1);Array.prototype.splice.apply(targetParts,lines);j+=lines.length-2;}
+if(mutual){for(var k=0,len=splits.points.length;k<len;++k){point=splits.points[k];if(!point.equals(vert1)){points.push(point);sourceParts.push(new OpenLayers.Geometry.LineString(points));if(point.equals(vert2)){points=[];}else{points=[point.clone()];}}}}}}}
+if(mutual&&sourceParts.length>0&&points.length>0){points.push(vert2.clone());sourceParts.push(new OpenLayers.Geometry.LineString(points));}}else{results=target.splitWith(this,options);}
+if(targetParts&&targetParts.length>1){targetSplit=true;}else{targetParts=[];}
+if(sourceParts&&sourceParts.length>1){sourceSplit=true;}else{sourceParts=[];}
+if(targetSplit||sourceSplit){if(mutual){results=[sourceParts,targetParts];}else{results=targetParts;}}
+return results;},splitWith:function(geometry,options){return geometry.split(this,options);},getVertices:function(nodes){var vertices;if(nodes===true){vertices=[this.components[0],this.components[this.components.length-1]];}else if(nodes===false){vertices=this.components.slice(1,this.components.length-1);}else{vertices=this.components.slice();}
+return vertices;},distanceTo:function(geometry,options){var edge=!(options&&options.edge===false);var details=edge&&options&&options.details;var result,best={};var min=Number.POSITIVE_INFINITY;if(geometry instanceof OpenLayers.Geometry.Point){var segs=this.getSortedSegments();var x=geometry.x;var y=geometry.y;var seg;for(var i=0,len=segs.length;i<len;++i){seg=segs[i];result=OpenLayers.Geometry.distanceToSegment(geometry,seg);if(result.distance<min){min=result.distance;best=result;if(min===0){break;}}else{if(seg.x2>x&&((y>seg.y1&&y<seg.y2)||(y<seg.y1&&y>seg.y2))){break;}}}
+if(details){best={distance:best.distance,x0:best.x,y0:best.y,x1:x,y1:y};}else{best=best.distance;}}else if(geometry instanceof OpenLayers.Geometry.LineString){var segs0=this.getSortedSegments();var segs1=geometry.getSortedSegments();var seg0,seg1,intersection,x0,y0;var len1=segs1.length;var interOptions={point:true};outer:for(var i=0,len=segs0.length;i<len;++i){seg0=segs0[i];x0=seg0.x1;y0=seg0.y1;for(var j=0;j<len1;++j){seg1=segs1[j];intersection=OpenLayers.Geometry.segmentsIntersect(seg0,seg1,interOptions);if(intersection){min=0;best={distance:0,x0:intersection.x,y0:intersection.y,x1:intersection.x,y1:intersection.y};break outer;}else{result=OpenLayers.Geometry.distanceToSegment({x:x0,y:y0},seg1);if(result.distance<min){min=result.distance;best={distance:min,x0:x0,y0:y0,x1:result.x,y1:result.y};}}}}
+if(!details){best=best.distance;}
+if(min!==0){if(seg0){result=geometry.distanceTo(new OpenLayers.Geometry.Point(seg0.x2,seg0.y2),options);var dist=details?result.distance:result;if(dist<min){if(details){best={distance:min,x0:result.x1,y0:result.y1,x1:result.x0,y1:result.y0};}else{best=dist;}}}}}else{best=geometry.distanceTo(this,options);if(details){best={distance:best.distance,x0:best.x1,y0:best.y1,x1:best.x0,y1:best.y0};}}
+return best;},CLASS_NAME:"OpenLayers.Geometry.LineString"});OpenLayers.Control.TransformFeature=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:["beforesetfeature","setfeature","beforetransform","transform","transformcomplete"],geometryTypes:null,layer:null,preserveAspectRatio:false,rotate:true,feature:null,renderIntent:"temporary",rotationHandleSymbolizer:null,box:null,center:null,scale:1,ratio:1,rotation:0,handles:null,rotationHandles:null,dragControl:null,initialize:function(layer,options){this.EVENT_TYPES=OpenLayers.Control.TransformFeature.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.layer=layer;if(!this.rotationHandleSymbolizer){this.rotationHandleSymbolizer={stroke:false,pointRadius:10,fillOpacity:0,cursor:"pointer"};}
+this.createBox();this.createControl();},activate:function(){var activated=false;if(OpenLayers.Control.prototype.activate.apply(this,arguments)){this.dragControl.activate();this.layer.addFeatures([this.box]);this.rotate&&this.layer.addFeatures(this.rotationHandles);this.layer.addFeatures(this.handles);activated=true;}
+return activated;},deactivate:function(){var deactivated=false;if(OpenLayers.Control.prototype.deactivate.apply(this,arguments)){this.layer.removeFeatures(this.handles);this.rotate&&this.layer.removeFeatures(this.rotationHandles);this.layer.removeFeatures([this.box]);this.dragControl.deactivate();deactivated=true;}
+return deactivated;},setMap:function(map){this.dragControl.setMap(map);OpenLayers.Control.prototype.setMap.apply(this,arguments);},setFeature:function(feature,initialParams){initialParams=OpenLayers.Util.applyDefaults(initialParams,{rotation:0,scale:1,ratio:1});var evt={feature:feature};var oldRotation=this.rotation;var oldCenter=this.center;OpenLayers.Util.extend(this,initialParams);if(this.events.triggerEvent("beforesetfeature",evt)===false){return;}
+this.feature=feature;this.activate();this._setfeature=true;var featureBounds=this.feature.geometry.getBounds();this.box.move(featureBounds.getCenterLonLat());this.box.geometry.rotate(-oldRotation,oldCenter);this._angle=0;var ll;if(this.rotation){var geom=feature.geometry.clone();geom.rotate(-this.rotation,this.center);var box=new OpenLayers.Feature.Vector(geom.getBounds().toGeometry());box.geometry.rotate(this.rotation,this.center);this.box.geometry.rotate(this.rotation,this.center);this.box.move(box.geometry.getBounds().getCenterLonLat());var llGeom=box.geometry.components[0].components[0];ll=llGeom.getBounds().getCenterLonLat();}else{ll=new OpenLayers.LonLat(featureBounds.left,featureBounds.bottom);}
+this.handles[0].move(ll);delete this._setfeature;this.events.triggerEvent("setfeature",evt);},createBox:function(){var control=this;this.center=new OpenLayers.Geometry.Point(0,0);var box=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString([new OpenLayers.Geometry.Point(-1,-1),new OpenLayers.Geometry.Point(0,-1),new OpenLayers.Geometry.Point(1,-1),new OpenLayers.Geometry.Point(1,0),new OpenLayers.Geometry.Point(1,1),new OpenLayers.Geometry.Point(0,1),new OpenLayers.Geometry.Point(-1,1),new OpenLayers.Geometry.Point(-1,0),new OpenLayers.Geometry.Point(-1,-1)]),null,typeof this.renderIntent=="string"?null:this.renderIntent);box.geometry.move=function(x,y){control._moving=true;OpenLayers.Geometry.LineString.prototype.move.apply(this,arguments);control.center.move(x,y);delete control._moving;};var vertexMoveFn=function(x,y){OpenLayers.Geometry.Point.prototype.move.apply(this,arguments);this._rotationHandle&&this._rotationHandle.geometry.move(x,y);this._handle.geometry.move(x,y);};var vertexResizeFn=function(scale,center,ratio){OpenLayers.Geometry.Point.prototype.resize.apply(this,arguments);this._rotationHandle&&this._rotationHandle.geometry.resize(scale,center,ratio);this._handle.geometry.resize(scale,center,ratio);};var vertexRotateFn=function(angle,center){OpenLayers.Geometry.Point.prototype.rotate.apply(this,arguments);this._rotationHandle&&this._rotationHandle.geometry.rotate(angle,center);this._handle.geometry.rotate(angle,center);};var handleMoveFn=function(x,y){var oldX=this.x,oldY=this.y;OpenLayers.Geometry.Point.prototype.move.call(this,x,y);if(control._moving){return;}
+var evt=control.dragControl.handlers.drag.evt;var preserveAspectRatio=!control._setfeature&&control.preserveAspectRatio;var reshape=!preserveAspectRatio&&!(evt&&evt.shiftKey);var oldGeom=new OpenLayers.Geometry.Point(oldX,oldY);var centerGeometry=control.center;this.rotate(-control.rotation,centerGeometry);oldGeom.rotate(-control.rotation,centerGeometry);var dx1=this.x-centerGeometry.x;var dy1=this.y-centerGeometry.y;var dx0=dx1-(this.x-oldGeom.x);var dy0=dy1-(this.y-oldGeom.y);this.x=oldX;this.y=oldY;var scale,ratio=1;if(reshape){scale=Math.abs(dy0)<0.00001?1:dy1/dy0;ratio=(Math.abs(dx0)<0.00001?1:(dx1/dx0))/scale;}else{var l0=Math.sqrt((dx0*dx0)+(dy0*dy0));var l1=Math.sqrt((dx1*dx1)+(dy1*dy1));scale=l1/l0;}
+control._moving=true;control.box.geometry.rotate(-control.rotation,centerGeometry);delete control._moving;control.box.geometry.resize(scale,centerGeometry,ratio);control.box.geometry.rotate(control.rotation,centerGeometry);control.transformFeature({scale:scale,ratio:ratio});};var rotationHandleMoveFn=function(x,y){var oldX=this.x,oldY=this.y;OpenLayers.Geometry.Point.prototype.move.call(this,x,y);if(control._moving){return;}
+var evt=control.dragControl.handlers.drag.evt;var constrain=(evt&&evt.shiftKey)?45:1;var centerGeometry=control.center;var dx1=this.x-centerGeometry.x;var dy1=this.y-centerGeometry.y;var dx0=dx1-x;var dy0=dy1-y;this.x=oldX;this.y=oldY;var a0=Math.atan2(dy0,dx0);var a1=Math.atan2(dy1,dx1);var angle=a1-a0;angle*=180/Math.PI;control._angle=(control._angle+angle)%360;var diff=control.rotation%constrain;if(Math.abs(control._angle)>=constrain||diff!==0){angle=Math.round(control._angle/constrain)*constrain-
+diff;control._angle=0;control.box.geometry.rotate(angle,centerGeometry);control.transformFeature({rotation:angle});}};var handles=new Array(8);var rotationHandles=new Array(4);var geom,handle,rotationHandle;for(var i=0;i<8;++i){geom=box.geometry.components[i];handle=new OpenLayers.Feature.Vector(geom.clone(),null,typeof this.renderIntent=="string"?null:this.renderIntent);if(i%2==0){rotationHandle=new OpenLayers.Feature.Vector(geom.clone(),null,typeof this.rotationHandleSymbolizer=="string"?null:this.rotationHandleSymbolizer);rotationHandle.geometry.move=rotationHandleMoveFn;geom._rotationHandle=rotationHandle;rotationHandles[i/2]=rotationHandle;}
+geom.move=vertexMoveFn;geom.resize=vertexResizeFn;geom.rotate=vertexRotateFn;handle.geometry.move=handleMoveFn;geom._handle=handle;handles[i]=handle;}
+this.box=box;this.rotationHandles=rotationHandles;this.handles=handles;},createControl:function(){var control=this;this.dragControl=new OpenLayers.Control.DragFeature(this.layer,{documentDrag:true,moveFeature:function(pixel){if(this.feature===control.feature){this.feature=control.box;}
+OpenLayers.Control.DragFeature.prototype.moveFeature.apply(this,arguments);},onDrag:function(feature,pixel){if(feature===control.box){control.transformFeature({center:control.center});control.drawHandles();}},onStart:function(feature,pixel){var eligible=!control.geometryTypes||OpenLayers.Util.indexOf(control.geometryTypes,feature.geometry.CLASS_NAME)!==-1;var i=OpenLayers.Util.indexOf(control.handles,feature);i+=OpenLayers.Util.indexOf(control.rotationHandles,feature);if(feature!==control.feature&&feature!==control.box&&i==-2&&eligible){control.setFeature(feature);}},onComplete:function(feature,pixel){control.events.triggerEvent("transformcomplete",{feature:control.feature});}});},drawHandles:function(){var layer=this.layer;for(var i=0;i<8;++i){if(this.rotate&&i%2===0){layer.drawFeature(this.rotationHandles[i/2],this.rotationHandleSymbolizer);}
+layer.drawFeature(this.handles[i],this.renderIntent);}},transformFeature:function(mods){if(!this._setfeature){this.scale*=(mods.scale||1);this.ratio*=(mods.ratio||1);var oldRotation=this.rotation;this.rotation=(this.rotation+(mods.rotation||0))%360;if(this.events.triggerEvent("beforetransform",mods)!==false){var feature=this.feature;var geom=feature.geometry;var center=this.center;geom.rotate(-oldRotation,center);if(mods.scale||mods.ratio){geom.resize(mods.scale,center,mods.ratio);}else if(mods.center){feature.move(mods.center.getBounds().getCenterLonLat());}
+geom.rotate(this.rotation,center);this.layer.drawFeature(feature);feature.toState(OpenLayers.State.UPDATE);this.events.triggerEvent("transform",mods);}}
+this.layer.drawFeature(this.box,this.renderIntent);this.drawHandles();},destroy:function(){var geom;for(var i=0;i<8;++i){geom=this.box.geometry.components[i];geom._handle.destroy();geom._handle=null;geom._rotationHandle&&geom._rotationHandle.destroy();geom._rotationHandle=null;}
+this.box.destroy();this.box=null;this.layer=null;this.dragControl.destroy();OpenLayers.Control.prototype.destroy.apply(this,arguments);},CLASS_NAME:"OpenLayers.Control.TransformFeature"});OpenLayers.Format.GPX=OpenLayers.Class(OpenLayers.Format.XML,{extractWaypoints:true,extractTracks:true,extractRoutes:true,extractAttributes:true,initialize:function(options){this.externalProjection=new OpenLayers.Projection("EPSG:4326");OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(doc){if(typeof doc=="string"){doc=OpenLayers.Format.XML.prototype.read.apply(this,[doc]);}
+var features=[];if(this.extractTracks){var tracks=doc.getElementsByTagName("trk");for(var i=0,len=tracks.length;i<len;i++){var attrs={};if(this.extractAttributes){attrs=this.parseAttributes(tracks[i]);}
+var segs=this.getElementsByTagNameNS(tracks[i],tracks[i].namespaceURI,"trkseg");for(var j=0,seglen=segs.length;j<seglen;j++){var track=this.extractSegment(segs[j],"trkpt");features.push(new OpenLayers.Feature.Vector(track,attrs));}}}
+if(this.extractRoutes){var routes=doc.getElementsByTagName("rte");for(var k=0,klen=routes.length;k<klen;k++){var attrs={};if(this.extractAttributes){attrs=this.parseAttributes(routes[k]);}
+var route=this.extractSegment(routes[k],"rtept");features.push(new OpenLayers.Feature.Vector(route,attrs));}}
+if(this.extractWaypoints){var waypoints=doc.getElementsByTagName("wpt");for(var l=0,len=waypoints.length;l<len;l++){var attrs={};if(this.extractAttributes){attrs=this.parseAttributes(waypoints[l]);}
+var wpt=new OpenLayers.Geometry.Point(waypoints[l].getAttribute("lon"),waypoints[l].getAttribute("lat"));features.push(new OpenLayers.Feature.Vector(wpt,attrs));}}
+if(this.internalProjection&&this.externalProjection){for(var g=0,featLength=features.length;g<featLength;g++){features[g].geometry.transform(this.externalProjection,this.internalProjection);}}
+return features;},extractSegment:function(segment,segmentType){var points=this.getElementsByTagNameNS(segment,segment.namespaceURI,segmentType);var point_features=[];for(var i=0,len=points.length;i<len;i++){point_features.push(new OpenLayers.Geometry.Point(points[i].getAttribute("lon"),points[i].getAttribute("lat")));}
+return new OpenLayers.Geometry.LineString(point_features);},parseAttributes:function(node){var attributes={};var attrNode=node.firstChild;while(attrNode){if(attrNode.nodeType==1){var value=attrNode.firstChild;if(value.nodeType==3||value.nodeType==4){name=(attrNode.prefix)?attrNode.nodeName.split(":")[1]:attrNode.nodeName;if(name!="trkseg"&&name!="rtept"){attributes[name]=value.nodeValue;}}}
+attrNode=attrNode.nextSibling;}
+return attributes;},CLASS_NAME:"OpenLayers.Format.GPX"});OpenLayers.Geometry.LinearRing=OpenLayers.Class(OpenLayers.Geometry.LineString,{componentTypes:["OpenLayers.Geometry.Point"],initialize:function(points){OpenLayers.Geometry.LineString.prototype.initialize.apply(this,arguments);},addComponent:function(point,index){var added=false;var lastPoint=this.components.pop();if(index!=null||!point.equals(lastPoint)){added=OpenLayers.Geometry.Collection.prototype.addComponent.apply(this,arguments);}
+var firstPoint=this.components[0];OpenLayers.Geometry.Collection.prototype.addComponent.apply(this,[firstPoint]);return added;},removeComponent:function(point){if(this.components.length>4){this.components.pop();OpenLayers.Geometry.Collection.prototype.removeComponent.apply(this,arguments);var firstPoint=this.components[0];OpenLayers.Geometry.Collection.prototype.addComponent.apply(this,[firstPoint]);}},move:function(x,y){for(var i=0,len=this.components.length;i<len-1;i++){this.components[i].move(x,y);}},rotate:function(angle,origin){for(var i=0,len=this.components.length;i<len-1;++i){this.components[i].rotate(angle,origin);}},resize:function(scale,origin,ratio){for(var i=0,len=this.components.length;i<len-1;++i){this.components[i].resize(scale,origin,ratio);}
+return this;},transform:function(source,dest){if(source&&dest){for(var i=0,len=this.components.length;i<len-1;i++){var component=this.components[i];component.transform(source,dest);}
+this.bounds=null;}
+return this;},getCentroid:function(){if(this.components&&(this.components.length>2)){var sumX=0.0;var sumY=0.0;for(var i=0;i<this.components.length-1;i++){var b=this.components[i];var c=this.components[i+1];sumX+=(b.x+c.x)*(b.x*c.y-c.x*b.y);sumY+=(b.y+c.y)*(b.x*c.y-c.x*b.y);}
+var area=-1*this.getArea();var x=sumX/(6*area);var y=sumY/(6*area);return new OpenLayers.Geometry.Point(x,y);}else{return null;}},getArea:function(){var area=0.0;if(this.components&&(this.components.length>2)){var sum=0.0;for(var i=0,len=this.components.length;i<len-1;i++){var b=this.components[i];var c=this.components[i+1];sum+=(b.x+c.x)*(c.y-b.y);}
+area=-sum/2.0;}
+return area;},getGeodesicArea:function(projection){var ring=this;if(projection){var gg=new OpenLayers.Projection("EPSG:4326");if(!gg.equals(projection)){ring=this.clone().transform(projection,gg);}}
+var area=0.0;var len=ring.components&&ring.components.length;if(len>2){var p1,p2;for(var i=0;i<len-1;i++){p1=ring.components[i];p2=ring.components[i+1];area+=OpenLayers.Util.rad(p2.x-p1.x)*(2+Math.sin(OpenLayers.Util.rad(p1.y))+
+Math.sin(OpenLayers.Util.rad(p2.y)));}
+area=area*6378137.0*6378137.0/2.0;}
+return area;},containsPoint:function(point){var approx=OpenLayers.Number.limitSigDigs;var digs=14;var px=approx(point.x,digs);var py=approx(point.y,digs);function getX(y,x1,y1,x2,y2){return(((x1-x2)*y)+((x2*y1)-(x1*y2)))/(y1-y2);}
+var numSeg=this.components.length-1;var start,end,x1,y1,x2,y2,cx,cy;var crosses=0;for(var i=0;i<numSeg;++i){start=this.components[i];x1=approx(start.x,digs);y1=approx(start.y,digs);end=this.components[i+1];x2=approx(end.x,digs);y2=approx(end.y,digs);if(y1==y2){if(py==y1){if(x1<=x2&&(px>=x1&&px<=x2)||x1>=x2&&(px<=x1&&px>=x2)){crosses=-1;break;}}
+continue;}
+cx=approx(getX(py,x1,y1,x2,y2),digs);if(cx==px){if(y1<y2&&(py>=y1&&py<=y2)||y1>y2&&(py<=y1&&py>=y2)){crosses=-1;break;}}
+if(cx<=px){continue;}
+if(x1!=x2&&(cx<Math.min(x1,x2)||cx>Math.max(x1,x2))){continue;}
+if(y1<y2&&(py>=y1&&py<y2)||y1>y2&&(py<y1&&py>=y2)){++crosses;}}
+var contained=(crosses==-1)?1:!!(crosses&1);return contained;},intersects:function(geometry){var intersect=false;if(geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){intersect=this.containsPoint(geometry);}else if(geometry.CLASS_NAME=="OpenLayers.Geometry.LineString"){intersect=geometry.intersects(this);}else if(geometry.CLASS_NAME=="OpenLayers.Geometry.LinearRing"){intersect=OpenLayers.Geometry.LineString.prototype.intersects.apply(this,[geometry]);}else{for(var i=0,len=geometry.components.length;i<len;++i){intersect=geometry.components[i].intersects(this);if(intersect){break;}}}
+return intersect;},getVertices:function(nodes){return(nodes===true)?[]:this.components.slice(0,this.components.length-1);},CLASS_NAME:"OpenLayers.Geometry.LinearRing"});OpenLayers.Geometry.MultiLineString=OpenLayers.Class(OpenLayers.Geometry.Collection,{componentTypes:["OpenLayers.Geometry.LineString"],initialize:function(components){OpenLayers.Geometry.Collection.prototype.initialize.apply(this,arguments);},split:function(geometry,options){var results=null;var mutual=options&&options.mutual;var splits,sourceLine,sourceLines,sourceSplit,targetSplit;var sourceParts=[];var targetParts=[geometry];for(var i=0,len=this.components.length;i<len;++i){sourceLine=this.components[i];sourceSplit=false;for(var j=0;j<targetParts.length;++j){splits=sourceLine.split(targetParts[j],options);if(splits){if(mutual){sourceLines=splits[0];for(var k=0,klen=sourceLines.length;k<klen;++k){if(k===0&&sourceParts.length){sourceParts[sourceParts.length-1].addComponent(sourceLines[k]);}else{sourceParts.push(new OpenLayers.Geometry.MultiLineString([sourceLines[k]]));}}
+sourceSplit=true;splits=splits[1];}
+if(splits.length){splits.unshift(j,1);Array.prototype.splice.apply(targetParts,splits);break;}}}
+if(!sourceSplit){if(sourceParts.length){sourceParts[sourceParts.length-1].addComponent(sourceLine.clone());}else{sourceParts=[new OpenLayers.Geometry.MultiLineString(sourceLine.clone())];}}}
+if(sourceParts&&sourceParts.length>1){sourceSplit=true;}else{sourceParts=[];}
+if(targetParts&&targetParts.length>1){targetSplit=true;}else{targetParts=[];}
+if(sourceSplit||targetSplit){if(mutual){results=[sourceParts,targetParts];}else{results=targetParts;}}
+return results;},splitWith:function(geometry,options){var results=null;var mutual=options&&options.mutual;var splits,targetLine,sourceLines,sourceSplit,targetSplit,sourceParts,targetParts;if(geometry instanceof OpenLayers.Geometry.LineString){targetParts=[];sourceParts=[geometry];for(var i=0,len=this.components.length;i<len;++i){targetSplit=false;targetLine=this.components[i];for(var j=0;j<sourceParts.length;++j){splits=sourceParts[j].split(targetLine,options);if(splits){if(mutual){sourceLines=splits[0];if(sourceLines.length){sourceLines.unshift(j,1);Array.prototype.splice.apply(sourceParts,sourceLines);j+=sourceLines.length-2;}
+splits=splits[1];if(splits.length===0){splits=[targetLine.clone()];}}
+for(var k=0,klen=splits.length;k<klen;++k){if(k===0&&targetParts.length){targetParts[targetParts.length-1].addComponent(splits[k]);}else{targetParts.push(new OpenLayers.Geometry.MultiLineString([splits[k]]));}}
+targetSplit=true;}}
+if(!targetSplit){if(targetParts.length){targetParts[targetParts.length-1].addComponent(targetLine.clone());}else{targetParts=[new OpenLayers.Geometry.MultiLineString([targetLine.clone()])];}}}}else{results=geometry.split(this);}
+if(sourceParts&&sourceParts.length>1){sourceSplit=true;}else{sourceParts=[];}
+if(targetParts&&targetParts.length>1){targetSplit=true;}else{targetParts=[];}
+if(sourceSplit||targetSplit){if(mutual){results=[sourceParts,targetParts];}else{results=targetParts;}}
+return results;},CLASS_NAME:"OpenLayers.Geometry.MultiLineString"});OpenLayers.Handler.Path=OpenLayers.Class(OpenLayers.Handler.Point,{line:null,freehand:false,freehandToggle:'shiftKey',initialize:function(control,callbacks,options){OpenLayers.Handler.Point.prototype.initialize.apply(this,arguments);},createFeature:function(pixel){var lonlat=this.control.map.getLonLatFromPixel(pixel);this.point=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat));this.line=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString([this.point.geometry]));this.callback("create",[this.point.geometry,this.getSketch()]);this.point.geometry.clearBounds();this.layer.addFeatures([this.line,this.point],{silent:true});},destroyFeature:function(){OpenLayers.Handler.Point.prototype.destroyFeature.apply(this);this.line=null;},removePoint:function(){if(this.point){this.layer.removeFeatures([this.point]);}},addPoint:function(pixel){this.layer.removeFeatures([this.point]);var lonlat=this.control.map.getLonLatFromPixel(pixel);this.point=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat));this.line.geometry.addComponent(this.point.geometry,this.line.geometry.components.length);this.callback("point",[this.point.geometry,this.getGeometry()]);this.callback("modify",[this.point.geometry,this.getSketch()]);this.drawFeature();},freehandMode:function(evt){return(this.freehandToggle&&evt[this.freehandToggle])?!this.freehand:this.freehand;},modifyFeature:function(pixel){var lonlat=this.control.map.getLonLatFromPixel(pixel);this.point.geometry.x=lonlat.lon;this.point.geometry.y=lonlat.lat;this.callback("modify",[this.point.geometry,this.getSketch()]);this.point.geometry.clearBounds();this.drawFeature();},drawFeature:function(){this.layer.drawFeature(this.line,this.style);this.layer.drawFeature(this.point,this.style);},getSketch:function(){return this.line;},getGeometry:function(){var geometry=this.line&&this.line.geometry;if(geometry&&this.multi){geometry=new OpenLayers.Geometry.MultiLineString([geometry]);}
+return geometry;},mousedown:function(evt){if(this.lastDown&&this.lastDown.equals(evt.xy)){return false;}
+if(this.lastDown==null){if(this.persist){this.destroyFeature();}
+this.createFeature(evt.xy);}else if((this.lastUp==null)||!this.lastUp.equals(evt.xy)){this.addPoint(evt.xy);}
+this.mouseDown=true;this.lastDown=evt.xy;this.drawing=true;return false;},mousemove:function(evt){if(this.drawing){if(this.mouseDown&&this.freehandMode(evt)){this.addPoint(evt.xy);}else{this.modifyFeature(evt.xy);}}
+return true;},mouseup:function(evt){this.mouseDown=false;if(this.drawing){if(this.freehandMode(evt)){this.removePoint();this.finalize();}else{if(this.lastUp==null){this.addPoint(evt.xy);}
+this.lastUp=evt.xy;}
+return false;}
+return true;},dblclick:function(evt){if(!this.freehandMode(evt)){var index=this.line.geometry.components.length-1;this.line.geometry.removeComponent(this.line.geometry.components[index]);this.removePoint();this.finalize();}
+return false;},CLASS_NAME:"OpenLayers.Handler.Path"});OpenLayers.Control.Split=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:["beforesplit","split","aftersplit"],layer:null,source:null,sourceOptions:null,tolerance:null,edge:true,deferDelete:false,mutual:true,targetFilter:null,sourceFilter:null,handler:null,initialize:function(options){Array.prototype.push.apply(this.EVENT_TYPES,OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.options=options||{};if(this.options.source){this.setSource(this.options.source);}},setSource:function(layer){if(this.active){this.deactivate();if(this.handler){this.handler.destroy();delete this.handler;}
+this.source=layer;this.activate();}else{this.source=layer;}},activate:function(){var activated=OpenLayers.Control.prototype.activate.call(this);if(activated){if(!this.source){if(!this.handler){this.handler=new OpenLayers.Handler.Path(this,{done:function(geometry){this.onSketchComplete({feature:new OpenLayers.Feature.Vector(geometry)});}},{layerOptions:this.sourceOptions});}
+this.handler.activate();}else if(this.source.events){this.source.events.on({sketchcomplete:this.onSketchComplete,afterfeaturemodified:this.afterFeatureModified,scope:this});}}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Control.prototype.deactivate.call(this);if(deactivated){if(this.source&&this.source.events){this.layer.events.un({sketchcomplete:this.onSketchComplete,afterfeaturemodified:this.afterFeatureModified,scope:this});}}
+return deactivated;},onSketchComplete:function(event){this.feature=null;return!this.considerSplit(event.feature);},afterFeatureModified:function(event){if(event.modified){var feature=event.feature;if(feature.geometry instanceof OpenLayers.Geometry.LineString||feature.geometry instanceof OpenLayers.Geometry.MultiLineString){this.feature=event.feature;this.considerSplit(event.feature);}}},removeByGeometry:function(features,geometry){for(var i=0,len=features.length;i<len;++i){if(features[i].geometry===geometry){features.splice(i,1);break;}}},isEligible:function(target){return(target.state!==OpenLayers.State.DELETE)&&(target.geometry instanceof OpenLayers.Geometry.LineString||target.geometry instanceof OpenLayers.Geometry.MultiLineString)&&(this.feature!==target)&&(!this.targetFilter||this.targetFilter.evaluate(target.attributes));},considerSplit:function(feature){var sourceSplit=false;var targetSplit=false;if(!this.sourceFilter||this.sourceFilter.evaluate(feature.attributes)){var features=this.layer&&this.layer.features||[];var target,results,proceed;var additions=[],removals=[];var mutual=(this.layer===this.source)&&this.mutual;var options={edge:this.edge,tolerance:this.tolerance,mutual:mutual};var sourceParts=[feature.geometry];var targetFeature,targetParts;var source,parts;for(var i=0,len=features.length;i<len;++i){targetFeature=features[i];if(this.isEligible(targetFeature)){targetParts=[targetFeature.geometry];for(var j=0;j<sourceParts.length;++j){source=sourceParts[j];for(var k=0;k<targetParts.length;++k){target=targetParts[k];if(source.getBounds().intersectsBounds(target.getBounds())){results=source.split(target,options);if(results){proceed=this.events.triggerEvent("beforesplit",{source:feature,target:targetFeature});if(proceed!==false){if(mutual){parts=results[0];if(parts.length>1){parts.unshift(j,1);Array.prototype.splice.apply(sourceParts,parts);j+=parts.length-3;}
+results=results[1];}
+if(results.length>1){results.unshift(k,1);Array.prototype.splice.apply(targetParts,results);k+=results.length-3;}}}}}}
+if(targetParts&&targetParts.length>1){this.geomsToFeatures(targetFeature,targetParts);this.events.triggerEvent("split",{original:targetFeature,features:targetParts});Array.prototype.push.apply(additions,targetParts);removals.push(targetFeature);targetSplit=true;}}}
+if(sourceParts&&sourceParts.length>1){this.geomsToFeatures(feature,sourceParts);this.events.triggerEvent("split",{original:feature,features:sourceParts});Array.prototype.push.apply(additions,sourceParts);removals.push(feature);sourceSplit=true;}
+if(sourceSplit||targetSplit){if(this.deferDelete){var feat,destroys=[];for(var i=0,len=removals.length;i<len;++i){feat=removals[i];if(feat.state===OpenLayers.State.INSERT){destroys.push(feat);}else{feat.state=OpenLayers.State.DELETE;this.layer.drawFeature(feat);}}
+this.layer.destroyFeatures(destroys,{silent:true});for(var i=0,len=additions.length;i<len;++i){additions[i].state=OpenLayers.State.INSERT;}}else{this.layer.destroyFeatures(removals,{silent:true});}
+this.layer.addFeatures(additions,{silent:true});this.events.triggerEvent("aftersplit",{source:feature,features:additions});}}
+return sourceSplit;},geomsToFeatures:function(feature,geoms){var clone=feature.clone();delete clone.geometry;var newFeature;for(var i=0,len=geoms.length;i<len;++i){newFeature=clone.clone();newFeature.geometry=geoms[i];newFeature.state=OpenLayers.State.INSERT;geoms[i]=newFeature;}},destroy:function(){if(this.active){this.deactivate();}
+OpenLayers.Control.prototype.destroy.call(this);},CLASS_NAME:"OpenLayers.Control.Split"});OpenLayers.Geometry.Polygon=OpenLayers.Class(OpenLayers.Geometry.Collection,{componentTypes:["OpenLayers.Geometry.LinearRing"],initialize:function(components){OpenLayers.Geometry.Collection.prototype.initialize.apply(this,arguments);},getArea:function(){var area=0.0;if(this.components&&(this.components.length>0)){area+=Math.abs(this.components[0].getArea());for(var i=1,len=this.components.length;i<len;i++){area-=Math.abs(this.components[i].getArea());}}
+return area;},getGeodesicArea:function(projection){var area=0.0;if(this.components&&(this.components.length>0)){area+=Math.abs(this.components[0].getGeodesicArea(projection));for(var i=1,len=this.components.length;i<len;i++){area-=Math.abs(this.components[i].getGeodesicArea(projection));}}
+return area;},containsPoint:function(point){var numRings=this.components.length;var contained=false;if(numRings>0){contained=this.components[0].containsPoint(point);if(contained!==1){if(contained&&numRings>1){var hole;for(var i=1;i<numRings;++i){hole=this.components[i].containsPoint(point);if(hole){if(hole===1){contained=1;}else{contained=false;}
+break;}}}}}
+return contained;},intersects:function(geometry){var intersect=false;var i,len;if(geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){intersect=this.containsPoint(geometry);}else if(geometry.CLASS_NAME=="OpenLayers.Geometry.LineString"||geometry.CLASS_NAME=="OpenLayers.Geometry.LinearRing"){for(i=0,len=this.components.length;i<len;++i){intersect=geometry.intersects(this.components[i]);if(intersect){break;}}
+if(!intersect){for(i=0,len=geometry.components.length;i<len;++i){intersect=this.containsPoint(geometry.components[i]);if(intersect){break;}}}}else{for(i=0,len=geometry.components.length;i<len;++i){intersect=this.intersects(geometry.components[i]);if(intersect){break;}}}
+if(!intersect&&geometry.CLASS_NAME=="OpenLayers.Geometry.Polygon"){var ring=this.components[0];for(i=0,len=ring.components.length;i<len;++i){intersect=geometry.containsPoint(ring.components[i]);if(intersect){break;}}}
+return intersect;},distanceTo:function(geometry,options){var edge=!(options&&options.edge===false);var result;if(!edge&&this.intersects(geometry)){result=0;}else{result=OpenLayers.Geometry.Collection.prototype.distanceTo.apply(this,[geometry,options]);}
+return result;},CLASS_NAME:"OpenLayers.Geometry.Polygon"});OpenLayers.Geometry.Polygon.createRegularPolygon=function(origin,radius,sides,rotation){var angle=Math.PI*((1/sides)-(1/2));if(rotation){angle+=(rotation/180)*Math.PI;}
+var rotatedAngle,x,y;var points=[];for(var i=0;i<sides;++i){rotatedAngle=angle+(i*2*Math.PI/sides);x=origin.x+(radius*Math.cos(rotatedAngle));y=origin.y+(radius*Math.sin(rotatedAngle));points.push(new OpenLayers.Geometry.Point(x,y));}
+var ring=new OpenLayers.Geometry.LinearRing(points);return new OpenLayers.Geometry.Polygon([ring]);};OpenLayers.Format.GeoRSS=OpenLayers.Class(OpenLayers.Format.XML,{rssns:"http://backend.userland.com/rss2",featureNS:"http://mapserver.gis.umn.edu/mapserver",georssns:"http://www.georss.org/georss",geons:"http://www.w3.org/2003/01/geo/wgs84_pos#",featureTitle:"Untitled",featureDescription:"No Description",gmlParser:null,xy:false,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},createGeometryFromItem:function(item){var point=this.getElementsByTagNameNS(item,this.georssns,"point");var lat=this.getElementsByTagNameNS(item,this.geons,'lat');var lon=this.getElementsByTagNameNS(item,this.geons,'long');var line=this.getElementsByTagNameNS(item,this.georssns,"line");var polygon=this.getElementsByTagNameNS(item,this.georssns,"polygon");var where=this.getElementsByTagNameNS(item,this.georssns,"where");var box=this.getElementsByTagNameNS(item,this.georssns,"box");if(point.length>0||(lat.length>0&&lon.length>0)){var location;if(point.length>0){location=OpenLayers.String.trim(point[0].firstChild.nodeValue).split(/\s+/);if(location.length!=2){location=OpenLayers.String.trim(point[0].firstChild.nodeValue).split(/\s*,\s*/);}}else{location=[parseFloat(lat[0].firstChild.nodeValue),parseFloat(lon[0].firstChild.nodeValue)];}
+var geometry=new OpenLayers.Geometry.Point(parseFloat(location[1]),parseFloat(location[0]));}else if(line.length>0){var coords=OpenLayers.String.trim(this.concatChildValues(line[0])).split(/\s+/);var components=[];var point;for(var i=0,len=coords.length;i<len;i+=2){point=new OpenLayers.Geometry.Point(parseFloat(coords[i+1]),parseFloat(coords[i]));components.push(point);}
+geometry=new OpenLayers.Geometry.LineString(components);}else if(polygon.length>0){var coords=OpenLayers.String.trim(this.concatChildValues(polygon[0])).split(/\s+/);var components=[];var point;for(var i=0,len=coords.length;i<len;i+=2){point=new OpenLayers.Geometry.Point(parseFloat(coords[i+1]),parseFloat(coords[i]));components.push(point);}
+geometry=new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(components)]);}else if(where.length>0){if(!this.gmlParser){this.gmlParser=new OpenLayers.Format.GML({'xy':this.xy});}
+var feature=this.gmlParser.parseFeature(where[0]);geometry=feature.geometry;}else if(box.length>0){var coords=OpenLayers.String.trim(box[0].firstChild.nodeValue).split(/\s+/);var components=[];var point;if(coords.length>3){point=new OpenLayers.Geometry.Point(parseFloat(coords[1]),parseFloat(coords[0]));components.push(point);point=new OpenLayers.Geometry.Point(parseFloat(coords[1]),parseFloat(coords[2]));components.push(point);point=new OpenLayers.Geometry.Point(parseFloat(coords[3]),parseFloat(coords[2]));components.push(point);point=new OpenLayers.Geometry.Point(parseFloat(coords[3]),parseFloat(coords[0]));components.push(point);point=new OpenLayers.Geometry.Point(parseFloat(coords[1]),parseFloat(coords[0]));components.push(point);}
+geometry=new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(components)]);}
+if(geometry&&this.internalProjection&&this.externalProjection){geometry.transform(this.externalProjection,this.internalProjection);}
+return geometry;},createFeatureFromItem:function(item){var geometry=this.createGeometryFromItem(item);var title=this.getChildValue(item,"*","title",this.featureTitle);var description=this.getChildValue(item,"*","description",this.getChildValue(item,"*","content",this.getChildValue(item,"*","summary",this.featureDescription)));var link=this.getChildValue(item,"*","link");if(!link){try{link=this.getElementsByTagNameNS(item,"*","link")[0].getAttribute("href");}catch(e){link=null;}}
+var id=this.getChildValue(item,"*","id",null);var data={"title":title,"description":description,"link":link};var feature=new OpenLayers.Feature.Vector(geometry,data);feature.fid=id;return feature;},getChildValue:function(node,nsuri,name,def){var value;var eles=this.getElementsByTagNameNS(node,nsuri,name);if(eles&&eles[0]&&eles[0].firstChild&&eles[0].firstChild.nodeValue){value=eles[0].firstChild.nodeValue;}else{value=(def==undefined)?"":def;}
+return value;},read:function(doc){if(typeof doc=="string"){doc=OpenLayers.Format.XML.prototype.read.apply(this,[doc]);}
+var itemlist=null;itemlist=this.getElementsByTagNameNS(doc,'*','item');if(itemlist.length==0){itemlist=this.getElementsByTagNameNS(doc,'*','entry');}
+var numItems=itemlist.length;var features=new Array(numItems);for(var i=0;i<numItems;i++){features[i]=this.createFeatureFromItem(itemlist[i]);}
+return features;},write:function(features){var georss;if(features instanceof Array){georss=this.createElementNS(this.rssns,"rss");for(var i=0,len=features.length;i<len;i++){georss.appendChild(this.createFeatureXML(features[i]));}}else{georss=this.createFeatureXML(features);}
+return OpenLayers.Format.XML.prototype.write.apply(this,[georss]);},createFeatureXML:function(feature){var geometryNode=this.buildGeometryNode(feature.geometry);var featureNode=this.createElementNS(this.rssns,"item");var titleNode=this.createElementNS(this.rssns,"title");titleNode.appendChild(this.createTextNode(feature.attributes.title?feature.attributes.title:""));var descNode=this.createElementNS(this.rssns,"description");descNode.appendChild(this.createTextNode(feature.attributes.description?feature.attributes.description:""));featureNode.appendChild(titleNode);featureNode.appendChild(descNode);if(feature.attributes.link){var linkNode=this.createElementNS(this.rssns,"link");linkNode.appendChild(this.createTextNode(feature.attributes.link));featureNode.appendChild(linkNode);}
+for(var attr in feature.attributes){if(attr=="link"||attr=="title"||attr=="description"){continue;}
+var attrText=this.createTextNode(feature.attributes[attr]);var nodename=attr;if(attr.search(":")!=-1){nodename=attr.split(":")[1];}
+var attrContainer=this.createElementNS(this.featureNS,"feature:"+nodename);attrContainer.appendChild(attrText);featureNode.appendChild(attrContainer);}
+featureNode.appendChild(geometryNode);return featureNode;},buildGeometryNode:function(geometry){if(this.internalProjection&&this.externalProjection){geometry=geometry.clone();geometry.transform(this.internalProjection,this.externalProjection);}
+var node;if(geometry.CLASS_NAME=="OpenLayers.Geometry.Polygon"){node=this.createElementNS(this.georssns,'georss:polygon');node.appendChild(this.buildCoordinatesNode(geometry.components[0]));}
+else if(geometry.CLASS_NAME=="OpenLayers.Geometry.LineString"){node=this.createElementNS(this.georssns,'georss:line');node.appendChild(this.buildCoordinatesNode(geometry));}
+else if(geometry.CLASS_NAME=="OpenLayers.Geometry.Point"){node=this.createElementNS(this.georssns,'georss:point');node.appendChild(this.buildCoordinatesNode(geometry));}else{throw"Couldn't parse "+geometry.CLASS_NAME;}
+return node;},buildCoordinatesNode:function(geometry){var points=null;if(geometry.components){points=geometry.components;}
+var path;if(points){var numPoints=points.length;var parts=new Array(numPoints);for(var i=0;i<numPoints;i++){parts[i]=points[i].y+" "+points[i].x;}
+path=parts.join(" ");}else{path=geometry.y+" "+geometry.x;}
+return this.createTextNode(path);},CLASS_NAME:"OpenLayers.Format.GeoRSS"});OpenLayers.Format.KML=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{kml:"http://www.opengis.net/kml/2.2",gx:"http://www.google.com/kml/ext/2.2"},kmlns:"http://earth.google.com/kml/2.0",placemarksDesc:"No description available",foldersName:"OpenLayers export",foldersDesc:"Exported on "+new Date(),extractAttributes:true,extractStyles:false,extractTracks:false,trackAttributes:null,internalns:null,features:null,styles:null,styleBaseUrl:"",fetched:null,maxDepth:0,initialize:function(options){this.regExes={trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g),kmlColor:(/(\w{2})(\w{2})(\w{2})(\w{2})/),kmlIconPalette:(/root:\/\/icons\/palette-(\d+)(\.\w+)/),straightBracket:(/\$\[(.*?)\]/g)};this.externalProjection=new OpenLayers.Projection("EPSG:4326");OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){this.features=[];this.styles={};this.fetched={};var options={depth:0,styleBaseUrl:this.styleBaseUrl};return this.parseData(data,options);},parseData:function(data,options){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var types=["Link","NetworkLink","Style","StyleMap","Placemark"];for(var i=0,len=types.length;i<len;++i){var type=types[i];var nodes=this.getElementsByTagNameNS(data,"*",type);if(nodes.length==0){continue;}
+switch(type.toLowerCase()){case"link":case"networklink":this.parseLinks(nodes,options);break;case"style":if(this.extractStyles){this.parseStyles(nodes,options);}
+break;case"stylemap":if(this.extractStyles){this.parseStyleMaps(nodes,options);}
+break;case"placemark":this.parseFeatures(nodes,options);break;}}
+return this.features;},parseLinks:function(nodes,options){if(options.depth>=this.maxDepth){return false;}
+var newOptions=OpenLayers.Util.extend({},options);newOptions.depth++;for(var i=0,len=nodes.length;i<len;i++){var href=this.parseProperty(nodes[i],"*","href");if(href&&!this.fetched[href]){this.fetched[href]=true;var data=this.fetchLink(href);if(data){this.parseData(data,newOptions);}}}},fetchLink:function(href){var request=OpenLayers.Request.GET({url:href,async:false});if(request){return request.responseText;}},parseStyles:function(nodes,options){for(var i=0,len=nodes.length;i<len;i++){var style=this.parseStyle(nodes[i]);if(style){var styleName=(options.styleBaseUrl||"")+"#"+style.id;this.styles[styleName]=style;}}},parseKmlColor:function(kmlColor){var color=null;if(kmlColor){var matches=kmlColor.match(this.regExes.kmlColor);if(matches){color={color:'#'+matches[4]+matches[3]+matches[2],opacity:parseInt(matches[1],16)/255};}}
+return color;},parseStyle:function(node){var style={};var types=["LineStyle","PolyStyle","IconStyle","BalloonStyle","LabelStyle"];var type,nodeList,geometry,parser;for(var i=0,len=types.length;i<len;++i){type=types[i];styleTypeNode=this.getElementsByTagNameNS(node,"*",type)[0];if(!styleTypeNode){continue;}
+switch(type.toLowerCase()){case"linestyle":var kmlColor=this.parseProperty(styleTypeNode,"*","color");var color=this.parseKmlColor(kmlColor);if(color){style["strokeColor"]=color.color;style["strokeOpacity"]=color.opacity;}
+var width=this.parseProperty(styleTypeNode,"*","width");if(width){style["strokeWidth"]=width;}
+break;case"polystyle":var kmlColor=this.parseProperty(styleTypeNode,"*","color");var color=this.parseKmlColor(kmlColor);if(color){style["fillOpacity"]=color.opacity;style["fillColor"]=color.color;}
+var fill=this.parseProperty(styleTypeNode,"*","fill");if(fill=="0"){style["fillColor"]="none";}
+var outline=this.parseProperty(styleTypeNode,"*","outline");if(outline=="0"){style["strokeWidth"]="0";}
+break;case"iconstyle":var scale=parseFloat(this.parseProperty(styleTypeNode,"*","scale")||1);var width=32*scale;var height=32*scale;var iconNode=this.getElementsByTagNameNS(styleTypeNode,"*","Icon")[0];if(iconNode){var href=this.parseProperty(iconNode,"*","href");if(href){var w=this.parseProperty(iconNode,"*","w");var h=this.parseProperty(iconNode,"*","h");var google="http://maps.google.com/mapfiles/kml";if(OpenLayers.String.startsWith(href,google)&&!w&&!h){w=64;h=64;scale=scale/2;}
+w=w||h;h=h||w;if(w){width=parseInt(w)*scale;}
+if(h){height=parseInt(h)*scale;}
+var matches=href.match(this.regExes.kmlIconPalette);if(matches){var palette=matches[1];var file_extension=matches[2];var x=this.parseProperty(iconNode,"*","x");var y=this.parseProperty(iconNode,"*","y");var posX=x?x/32:0;var posY=y?(7-y/32):7;var pos=posY*8+posX;href="http://maps.google.com/mapfiles/kml/pal"
++palette+"/icon"+pos+file_extension;}
+style["graphicOpacity"]=1;style["externalGraphic"]=href;}}
+var hotSpotNode=this.getElementsByTagNameNS(styleTypeNode,"*","hotSpot")[0];if(hotSpotNode){var x=parseFloat(hotSpotNode.getAttribute("x"));var y=parseFloat(hotSpotNode.getAttribute("y"));var xUnits=hotSpotNode.getAttribute("xunits");if(xUnits=="pixels"){style["graphicXOffset"]=-x*scale;}
+else if(xUnits=="insetPixels"){style["graphicXOffset"]=-width+(x*scale);}
+else if(xUnits=="fraction"){style["graphicXOffset"]=-width*x;}
+var yUnits=hotSpotNode.getAttribute("yunits");if(yUnits=="pixels"){style["graphicYOffset"]=-height+(y*scale)+1;}
+else if(yUnits=="insetPixels"){style["graphicYOffset"]=-(y*scale)+1;}
+else if(yUnits=="fraction"){style["graphicYOffset"]=-height*(1-y)+1;}}
+style["graphicWidth"]=width;style["graphicHeight"]=height;break;case"balloonstyle":var balloonStyle=OpenLayers.Util.getXmlNodeValue(styleTypeNode);if(balloonStyle){style["balloonStyle"]=balloonStyle.replace(this.regExes.straightBracket,"${$1}");}
+break;case"labelstyle":var kmlColor=this.parseProperty(styleTypeNode,"*","color");var color=this.parseKmlColor(kmlColor);if(color){style["fontColor"]=color.color;style["fontOpacity"]=color.opacity;}
+break;default:}}
+if(!style["strokeColor"]&&style["fillColor"]){style["strokeColor"]=style["fillColor"];}
+var id=node.getAttribute("id");if(id&&style){style.id=id;}
+return style;},parseStyleMaps:function(nodes,options){for(var i=0,len=nodes.length;i<len;i++){var node=nodes[i];var pairs=this.getElementsByTagNameNS(node,"*","Pair");var id=node.getAttribute("id");for(var j=0,jlen=pairs.length;j<jlen;j++){var pair=pairs[j];var key=this.parseProperty(pair,"*","key");var styleUrl=this.parseProperty(pair,"*","styleUrl");if(styleUrl&&key=="normal"){this.styles[(options.styleBaseUrl||"")+"#"+id]=this.styles[(options.styleBaseUrl||"")+styleUrl];}
+if(styleUrl&&key=="highlight"){}}}},parseFeatures:function(nodes,options){var features=[];for(var i=0,len=nodes.length;i<len;i++){var featureNode=nodes[i];var feature=this.parseFeature.apply(this,[featureNode]);if(feature){if(this.extractStyles&&feature.attributes&&feature.attributes.styleUrl){feature.style=this.getStyle(feature.attributes.styleUrl,options);}
+if(this.extractStyles){var inlineStyleNode=this.getElementsByTagNameNS(featureNode,"*","Style")[0];if(inlineStyleNode){var inlineStyle=this.parseStyle(inlineStyleNode);if(inlineStyle){feature.style=OpenLayers.Util.extend(feature.style,inlineStyle);}}}
+if(this.extractTracks){var tracks=this.getElementsByTagNameNS(featureNode,this.namespaces.gx,"Track");if(tracks&&tracks.length>0){var track=tracks[0];var container={features:[],feature:feature};this.readNode(track,container);if(container.features.length>0){features.push.apply(features,container.features);}}}else{features.push(feature);}}else{throw"Bad Placemark: "+i;}}
+this.features=this.features.concat(features);},readers:{"kml":{"when":function(node,container){container.whens.push(OpenLayers.Date.parse(this.getChildValue(node)));},"_trackPointAttribute":function(node,container){var name=node.nodeName.split(":").pop();container.attributes[name].push(this.getChildValue(node));}},"gx":{"Track":function(node,container){var obj={whens:[],points:[],angles:[]};if(this.trackAttributes){var name;obj.attributes={};for(var i=0,ii=this.trackAttributes.length;i<ii;++i){name=this.trackAttributes[i];obj.attributes[name]=[];if(!(name in this.readers.kml)){this.readers.kml[name]=this.readers.kml._trackPointAttribute;}}}
+this.readChildNodes(node,obj);if(obj.whens.length!==obj.points.length){throw new Error("gx:Track with unequal number of when ("+obj.whens.length+") and gx:coord ("+obj.points.length+") elements.");}
+var hasAngles=obj.angles.length>0;if(hasAngles&&obj.whens.length!==obj.angles.length){throw new Error("gx:Track with unequal number of when ("+obj.whens.length+") and gx:angles ("+obj.angles.length+") elements.");}
+var feature,point,angles;for(var i=0,ii=obj.whens.length;i<ii;++i){feature=container.feature.clone();feature.fid=container.feature.fid||container.feature.id;point=obj.points[i];feature.geometry=point;if("z"in point){feature.attributes.altitude=point.z;}
+if(this.internalProjection&&this.externalProjection){feature.geometry.transform(this.externalProjection,this.internalProjection);}
+if(this.trackAttributes){for(var j=0,jj=this.trackAttributes.length;j<jj;++j){feature.attributes[name]=obj.attributes[this.trackAttributes[j]][i];}}
+feature.attributes.when=obj.whens[i];feature.attributes.trackId=container.feature.id;if(hasAngles){angles=obj.angles[i];feature.attributes.heading=parseFloat(angles[0]);feature.attributes.tilt=parseFloat(angles[1]);feature.attributes.roll=parseFloat(angles[2]);}
+container.features.push(feature);}},"coord":function(node,container){var str=this.getChildValue(node);var coords=str.replace(this.regExes.trimSpace,"").split(/\s+/);var point=new OpenLayers.Geometry.Point(coords[0],coords[1]);if(coords.length>2){point.z=parseFloat(coords[2]);}
+container.points.push(point);},"angles":function(node,container){var str=this.getChildValue(node);var parts=str.replace(this.regExes.trimSpace,"").split(/\s+/);container.angles.push(parts);}}},parseFeature:function(node){var order=["MultiGeometry","Polygon","LineString","Point"];var type,nodeList,geometry,parser;for(var i=0,len=order.length;i<len;++i){type=order[i];this.internalns=node.namespaceURI?node.namespaceURI:this.kmlns;nodeList=this.getElementsByTagNameNS(node,this.internalns,type);if(nodeList.length>0){var parser=this.parseGeometry[type.toLowerCase()];if(parser){geometry=parser.apply(this,[nodeList[0]]);if(this.internalProjection&&this.externalProjection){geometry.transform(this.externalProjection,this.internalProjection);}}else{OpenLayers.Console.error(OpenLayers.i18n("unsupportedGeometryType",{'geomType':type}));}
+break;}}
+var attributes;if(this.extractAttributes){attributes=this.parseAttributes(node);}
+var feature=new OpenLayers.Feature.Vector(geometry,attributes);var fid=node.getAttribute("id")||node.getAttribute("name");if(fid!=null){feature.fid=fid;}
+return feature;},getStyle:function(styleUrl,options){var styleBaseUrl=OpenLayers.Util.removeTail(styleUrl);var newOptions=OpenLayers.Util.extend({},options);newOptions.depth++;newOptions.styleBaseUrl=styleBaseUrl;if(!this.styles[styleUrl]&&!OpenLayers.String.startsWith(styleUrl,"#")&&newOptions.depth<=this.maxDepth&&!this.fetched[styleBaseUrl]){var data=this.fetchLink(styleBaseUrl);if(data){this.parseData(data,newOptions);}}
+var style=OpenLayers.Util.extend({},this.styles[styleUrl]);return style;},parseGeometry:{point:function(node){var nodeList=this.getElementsByTagNameNS(node,this.internalns,"coordinates");var coords=[];if(nodeList.length>0){var coordString=nodeList[0].firstChild.nodeValue;coordString=coordString.replace(this.regExes.removeSpace,"");coords=coordString.split(",");}
+var point=null;if(coords.length>1){if(coords.length==2){coords[2]=null;}
+point=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{throw"Bad coordinate string: "+coordString;}
+return point;},linestring:function(node,ring){var nodeList=this.getElementsByTagNameNS(node,this.internalns,"coordinates");var line=null;if(nodeList.length>0){var coordString=this.getChildValue(nodeList[0]);coordString=coordString.replace(this.regExes.trimSpace,"");coordString=coordString.replace(this.regExes.trimComma,",");var pointList=coordString.split(this.regExes.splitSpace);var numPoints=pointList.length;var points=new Array(numPoints);var coords,numCoords;for(var i=0;i<numPoints;++i){coords=pointList[i].split(",");numCoords=coords.length;if(numCoords>1){if(coords.length==2){coords[2]=null;}
+points[i]=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{throw"Bad LineString point coordinates: "+
+pointList[i];}}
+if(numPoints){if(ring){line=new OpenLayers.Geometry.LinearRing(points);}else{line=new OpenLayers.Geometry.LineString(points);}}else{throw"Bad LineString coordinates: "+coordString;}}
+return line;},polygon:function(node){var nodeList=this.getElementsByTagNameNS(node,this.internalns,"LinearRing");var numRings=nodeList.length;var components=new Array(numRings);if(numRings>0){var ring;for(var i=0,len=nodeList.length;i<len;++i){ring=this.parseGeometry.linestring.apply(this,[nodeList[i],true]);if(ring){components[i]=ring;}else{throw"Bad LinearRing geometry: "+i;}}}
+return new OpenLayers.Geometry.Polygon(components);},multigeometry:function(node){var child,parser;var parts=[];var children=node.childNodes;for(var i=0,len=children.length;i<len;++i){child=children[i];if(child.nodeType==1){var type=(child.prefix)?child.nodeName.split(":")[1]:child.nodeName;var parser=this.parseGeometry[type.toLowerCase()];if(parser){parts.push(parser.apply(this,[child]));}}}
+return new OpenLayers.Geometry.Collection(parts);}},parseAttributes:function(node){var attributes={};var edNodes=node.getElementsByTagName("ExtendedData");if(edNodes.length){attributes=this.parseExtendedData(edNodes[0]);}
+var child,grandchildren,grandchild;var children=node.childNodes;for(var i=0,len=children.length;i<len;++i){child=children[i];if(child.nodeType==1){grandchildren=child.childNodes;if(grandchildren.length>=1&&grandchildren.length<=3){var grandchild;switch(grandchildren.length){case 1:grandchild=grandchildren[0];break;case 2:var c1=grandchildren[0];var c2=grandchildren[1];grandchild=(c1.nodeType==3||c1.nodeType==4)?c1:c2;break;case 3:default:grandchild=grandchildren[1];break;}
+if(grandchild.nodeType==3||grandchild.nodeType==4){var name=(child.prefix)?child.nodeName.split(":")[1]:child.nodeName;var value=OpenLayers.Util.getXmlNodeValue(grandchild);if(value){value=value.replace(this.regExes.trimSpace,"");attributes[name]=value;}}}}}
+return attributes;},parseExtendedData:function(node){var attributes={};var i,len,data,key;var dataNodes=node.getElementsByTagName("Data");for(i=0,len=dataNodes.length;i<len;i++){data=dataNodes[i];key=data.getAttribute("name");var ed={};var valueNode=data.getElementsByTagName("value");if(valueNode.length){ed['value']=this.getChildValue(valueNode[0]);}
+var nameNode=data.getElementsByTagName("displayName");if(nameNode.length){ed['displayName']=this.getChildValue(nameNode[0]);}
+attributes[key]=ed;}
+var simpleDataNodes=node.getElementsByTagName("SimpleData");for(i=0,len=simpleDataNodes.length;i<len;i++){var ed={};data=simpleDataNodes[i];key=data.getAttribute("name");ed['value']=this.getChildValue(data);ed['displayName']=key;attributes[key]=ed;}
+return attributes;},parseProperty:function(xmlNode,namespace,tagName){var value;var nodeList=this.getElementsByTagNameNS(xmlNode,namespace,tagName);try{value=OpenLayers.Util.getXmlNodeValue(nodeList[0]);}catch(e){value=null;}
+return value;},write:function(features){if(!(features instanceof Array)){features=[features];}
+var kml=this.createElementNS(this.kmlns,"kml");var folder=this.createFolderXML();for(var i=0,len=features.length;i<len;++i){folder.appendChild(this.createPlacemarkXML(features[i]));}
+kml.appendChild(folder);return OpenLayers.Format.XML.prototype.write.apply(this,[kml]);},createFolderXML:function(){var folder=this.createElementNS(this.kmlns,"Folder");if(this.foldersName){var folderName=this.createElementNS(this.kmlns,"name");var folderNameText=this.createTextNode(this.foldersName);folderName.appendChild(folderNameText);folder.appendChild(folderName);}
+if(this.foldersDesc){var folderDesc=this.createElementNS(this.kmlns,"description");var folderDescText=this.createTextNode(this.foldersDesc);folderDesc.appendChild(folderDescText);folder.appendChild(folderDesc);}
+return folder;},createPlacemarkXML:function(feature){var placemarkName=this.createElementNS(this.kmlns,"name");var name=feature.style&&feature.style.label?feature.style.label:feature.attributes.name||feature.id;placemarkName.appendChild(this.createTextNode(name));var placemarkDesc=this.createElementNS(this.kmlns,"description");var desc=feature.attributes.description||this.placemarksDesc;placemarkDesc.appendChild(this.createTextNode(desc));var placemarkNode=this.createElementNS(this.kmlns,"Placemark");if(feature.fid!=null){placemarkNode.setAttribute("id",feature.fid);}
+placemarkNode.appendChild(placemarkName);placemarkNode.appendChild(placemarkDesc);var geometryNode=this.buildGeometryNode(feature.geometry);placemarkNode.appendChild(geometryNode);return placemarkNode;},buildGeometryNode:function(geometry){if(this.internalProjection&&this.externalProjection){geometry=geometry.clone();geometry.transform(this.internalProjection,this.externalProjection);}
+var className=geometry.CLASS_NAME;var type=className.substring(className.lastIndexOf(".")+1);var builder=this.buildGeometry[type.toLowerCase()];var node=null;if(builder){node=builder.apply(this,[geometry]);}
+return node;},buildGeometry:{point:function(geometry){var kml=this.createElementNS(this.kmlns,"Point");kml.appendChild(this.buildCoordinatesNode(geometry));return kml;},multipoint:function(geometry){return this.buildGeometry.collection.apply(this,[geometry]);},linestring:function(geometry){var kml=this.createElementNS(this.kmlns,"LineString");kml.appendChild(this.buildCoordinatesNode(geometry));return kml;},multilinestring:function(geometry){return this.buildGeometry.collection.apply(this,[geometry]);},linearring:function(geometry){var kml=this.createElementNS(this.kmlns,"LinearRing");kml.appendChild(this.buildCoordinatesNode(geometry));return kml;},polygon:function(geometry){var kml=this.createElementNS(this.kmlns,"Polygon");var rings=geometry.components;var ringMember,ringGeom,type;for(var i=0,len=rings.length;i<len;++i){type=(i==0)?"outerBoundaryIs":"innerBoundaryIs";ringMember=this.createElementNS(this.kmlns,type);ringGeom=this.buildGeometry.linearring.apply(this,[rings[i]]);ringMember.appendChild(ringGeom);kml.appendChild(ringMember);}
+return kml;},multipolygon:function(geometry){return this.buildGeometry.collection.apply(this,[geometry]);},collection:function(geometry){var kml=this.createElementNS(this.kmlns,"MultiGeometry");var child;for(var i=0,len=geometry.components.length;i<len;++i){child=this.buildGeometryNode.apply(this,[geometry.components[i]]);if(child){kml.appendChild(child);}}
+return kml;}},buildCoordinatesNode:function(geometry){var coordinatesNode=this.createElementNS(this.kmlns,"coordinates");var path;var points=geometry.components;if(points){var point;var numPoints=points.length;var parts=new Array(numPoints);for(var i=0;i<numPoints;++i){point=points[i];parts[i]=point.x+","+point.y;}
+path=parts.join(" ");}else{path=geometry.x+","+geometry.y;}
+var txtNode=this.createTextNode(path);coordinatesNode.appendChild(txtNode);return coordinatesNode;},CLASS_NAME:"OpenLayers.Format.KML"});OpenLayers.Format.OSM=OpenLayers.Class(OpenLayers.Format.XML,{checkTags:false,interestingTagsExclude:null,areaTags:null,initialize:function(options){var layer_defaults={'interestingTagsExclude':['source','source_ref','source:ref','history','attribution','created_by'],'areaTags':['area','building','leisure','tourism','ruins','historic','landuse','military','natural','sport']};layer_defaults=OpenLayers.Util.extend(layer_defaults,options);var interesting={};for(var i=0;i<layer_defaults.interestingTagsExclude.length;i++){interesting[layer_defaults.interestingTagsExclude[i]]=true;}
+layer_defaults.interestingTagsExclude=interesting;var area={};for(var i=0;i<layer_defaults.areaTags.length;i++){area[layer_defaults.areaTags[i]]=true;}
+layer_defaults.areaTags=area;this.externalProjection=new OpenLayers.Projection("EPSG:4326");OpenLayers.Format.XML.prototype.initialize.apply(this,[layer_defaults]);},read:function(doc){if(typeof doc=="string"){doc=OpenLayers.Format.XML.prototype.read.apply(this,[doc]);}
+var nodes=this.getNodes(doc);var ways=this.getWays(doc);var feat_list=new Array(ways.length);for(var i=0;i<ways.length;i++){var point_list=new Array(ways[i].nodes.length);var poly=this.isWayArea(ways[i])?1:0;for(var j=0;j<ways[i].nodes.length;j++){var node=nodes[ways[i].nodes[j]];var point=new OpenLayers.Geometry.Point(node.lon,node.lat);point.osm_id=parseInt(ways[i].nodes[j]);point_list[j]=point;node.used=true;}
+var geometry=null;if(poly){geometry=new OpenLayers.Geometry.Polygon(new OpenLayers.Geometry.LinearRing(point_list));}else{geometry=new OpenLayers.Geometry.LineString(point_list);}
+if(this.internalProjection&&this.externalProjection){geometry.transform(this.externalProjection,this.internalProjection);}
+var feat=new OpenLayers.Feature.Vector(geometry,ways[i].tags);feat.osm_id=parseInt(ways[i].id);feat.fid="way."+feat.osm_id;feat_list[i]=feat;}
+for(var node_id in nodes){var node=nodes[node_id];if(!node.used||this.checkTags){var tags=null;if(this.checkTags){var result=this.getTags(node.node,true);if(node.used&&!result[1]){continue;}
+tags=result[0];}else{tags=this.getTags(node.node);}
+var feat=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(node['lon'],node['lat']),tags);if(this.internalProjection&&this.externalProjection){feat.geometry.transform(this.externalProjection,this.internalProjection);}
+feat.osm_id=parseInt(node_id);feat.fid="node."+feat.osm_id;feat_list.push(feat);}
+node.node=null;}
+return feat_list;},getNodes:function(doc){var node_list=doc.getElementsByTagName("node");var nodes={};for(var i=0;i<node_list.length;i++){var node=node_list[i];var id=node.getAttribute("id");nodes[id]={'lat':node.getAttribute("lat"),'lon':node.getAttribute("lon"),'node':node};}
+return nodes;},getWays:function(doc){var way_list=doc.getElementsByTagName("way");var return_ways=[];for(var i=0;i<way_list.length;i++){var way=way_list[i];var way_object={id:way.getAttribute("id")};way_object.tags=this.getTags(way);var node_list=way.getElementsByTagName("nd");way_object.nodes=new Array(node_list.length);for(var j=0;j<node_list.length;j++){way_object.nodes[j]=node_list[j].getAttribute("ref");}
+return_ways.push(way_object);}
+return return_ways;},getTags:function(dom_node,interesting_tags){var tag_list=dom_node.getElementsByTagName("tag");var tags={};var interesting=false;for(var j=0;j<tag_list.length;j++){var key=tag_list[j].getAttribute("k");tags[key]=tag_list[j].getAttribute("v");if(interesting_tags){if(!this.interestingTagsExclude[key]){interesting=true;}}}
+return interesting_tags?[tags,interesting]:tags;},isWayArea:function(way){var poly_shaped=false;var poly_tags=false;if(way.nodes[0]==way.nodes[way.nodes.length-1]){poly_shaped=true;}
+if(this.checkTags){for(var key in way.tags){if(this.areaTags[key]){poly_tags=true;break;}}}
+return poly_shaped&&(this.checkTags?poly_tags:true);},write:function(features){if(!(features instanceof Array)){features=[features];}
+this.osm_id=1;this.created_nodes={};var root_node=this.createElementNS(null,"osm");root_node.setAttribute("version","0.5");root_node.setAttribute("generator","OpenLayers "+OpenLayers.VERSION_NUMBER);for(var i=features.length-1;i>=0;i--){var nodes=this.createFeatureNodes(features[i]);for(var j=0;j<nodes.length;j++){root_node.appendChild(nodes[j]);}}
+return OpenLayers.Format.XML.prototype.write.apply(this,[root_node]);},createFeatureNodes:function(feature){var nodes=[];var className=feature.geometry.CLASS_NAME;var type=className.substring(className.lastIndexOf(".")+1);type=type.toLowerCase();var builder=this.createXML[type];if(builder){nodes=builder.apply(this,[feature]);}
+return nodes;},createXML:{'point':function(point){var id=null;var geometry=point.geometry?point.geometry:point;var already_exists=false;if(point.osm_id){id=point.osm_id;if(this.created_nodes[id]){already_exists=true;}}else{id=-this.osm_id;this.osm_id++;}
+if(already_exists){node=this.created_nodes[id];}else{var node=this.createElementNS(null,"node");}
+this.created_nodes[id]=node;node.setAttribute("id",id);node.setAttribute("lon",geometry.x);node.setAttribute("lat",geometry.y);if(point.attributes){this.serializeTags(point,node);}
+this.setState(point,node);return already_exists?[]:[node];},linestring:function(feature){var nodes=[];var geometry=feature.geometry;if(feature.osm_id){id=feature.osm_id;}else{id=-this.osm_id;this.osm_id++;}
+var way=this.createElementNS(null,"way");way.setAttribute("id",id);for(var i=0;i<geometry.components.length;i++){var node=this.createXML['point'].apply(this,[geometry.components[i]]);if(node.length){node=node[0];var node_ref=node.getAttribute("id");nodes.push(node);}else{node_ref=geometry.components[i].osm_id;node=this.created_nodes[node_ref];}
+this.setState(feature,node);var nd_dom=this.createElementNS(null,"nd");nd_dom.setAttribute("ref",node_ref);way.appendChild(nd_dom);}
+this.serializeTags(feature,way);nodes.push(way);return nodes;},polygon:function(feature){var attrs=OpenLayers.Util.extend({'area':'yes'},feature.attributes);var feat=new OpenLayers.Feature.Vector(feature.geometry.components[0],attrs);feat.osm_id=feature.osm_id;return this.createXML['linestring'].apply(this,[feat]);}},serializeTags:function(feature,node){for(var key in feature.attributes){var tag=this.createElementNS(null,"tag");tag.setAttribute("k",key);tag.setAttribute("v",feature.attributes[key]);node.appendChild(tag);}},setState:function(feature,node){if(feature.state){var state=null;switch(feature.state){case OpenLayers.State.UPDATE:state="modify";case OpenLayers.State.DELETE:state="delete";}
+if(state){node.setAttribute("action",state);}}},CLASS_NAME:"OpenLayers.Format.OSM"});OpenLayers.Geometry.MultiPolygon=OpenLayers.Class(OpenLayers.Geometry.Collection,{componentTypes:["OpenLayers.Geometry.Polygon"],initialize:function(components){OpenLayers.Geometry.Collection.prototype.initialize.apply(this,arguments);},CLASS_NAME:"OpenLayers.Geometry.MultiPolygon"});OpenLayers.Handler.Polygon=OpenLayers.Class(OpenLayers.Handler.Path,{polygon:null,initialize:function(control,callbacks,options){OpenLayers.Handler.Path.prototype.initialize.apply(this,arguments);},createFeature:function(pixel){var lonlat=this.control.map.getLonLatFromPixel(pixel);this.point=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat));this.line=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LinearRing([this.point.geometry]));this.polygon=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([this.line.geometry]));this.callback("create",[this.point.geometry,this.getSketch()]);this.point.geometry.clearBounds();this.layer.addFeatures([this.polygon,this.point],{silent:true});},destroyFeature:function(){OpenLayers.Handler.Path.prototype.destroyFeature.apply(this);this.polygon=null;},drawFeature:function(){this.layer.drawFeature(this.polygon,this.style);this.layer.drawFeature(this.point,this.style);},getSketch:function(){return this.polygon;},getGeometry:function(){var geometry=this.polygon&&this.polygon.geometry;if(geometry&&this.multi){geometry=new OpenLayers.Geometry.MultiPolygon([geometry]);}
+return geometry;},dblclick:function(evt){if(!this.freehandMode(evt)){var index=this.line.geometry.components.length-2;this.line.geometry.removeComponent(this.line.geometry.components[index]);this.removePoint();this.finalize();}
+return false;},CLASS_NAME:"OpenLayers.Handler.Polygon"});OpenLayers.Control.EditingToolbar=OpenLayers.Class(OpenLayers.Control.Panel,{initialize:function(layer,options){OpenLayers.Control.Panel.prototype.initialize.apply(this,[options]);this.addControls([new OpenLayers.Control.Navigation()]);var controls=[new OpenLayers.Control.DrawFeature(layer,OpenLayers.Handler.Point,{'displayClass':'olControlDrawFeaturePoint'}),new OpenLayers.Control.DrawFeature(layer,OpenLayers.Handler.Path,{'displayClass':'olControlDrawFeaturePath'}),new OpenLayers.Control.DrawFeature(layer,OpenLayers.Handler.Polygon,{'displayClass':'olControlDrawFeaturePolygon'})];this.addControls(controls);},draw:function(){var div=OpenLayers.Control.Panel.prototype.draw.apply(this,arguments);this.activateControl(this.controls[0]);return div;},CLASS_NAME:"OpenLayers.Control.EditingToolbar"});OpenLayers.Control.SLDSelect=OpenLayers.Class(OpenLayers.Control,{EVENT_TYPES:["selected"],clearOnDeactivate:false,layers:null,callbacks:null,selectionSymbolizer:{'Polygon':{fillColor:'#FF0000',stroke:false},'Line':{strokeColor:'#FF0000',strokeWidth:2},'Point':{graphicName:'square',fillColor:'#FF0000',pointRadius:5}},layerOptions:null,handlerOptions:null,sketchStyle:null,wfsCache:{},layerCache:{},initialize:function(handler,options){this.EVENT_TYPES=OpenLayers.Control.SLDSelect.prototype.EVENT_TYPES.concat(OpenLayers.Control.prototype.EVENT_TYPES);OpenLayers.Control.prototype.initialize.apply(this,[options]);this.callbacks=OpenLayers.Util.extend({done:this.select,click:this.select},this.callbacks);this.handlerOptions=this.handlerOptions||{};this.layerOptions=OpenLayers.Util.applyDefaults(this.layerOptions,{displayInLayerSwitcher:false});if(this.sketchStyle){this.handlerOptions.layerOptions=OpenLayers.Util.applyDefaults(this.handlerOptions.layerOptions,{styleMap:new OpenLayers.StyleMap({"default":this.sketchStyle})});}
+this.handler=new handler(this,this.callbacks,this.handlerOptions);},destroy:function(){for(var key in this.layerCache){delete this.layerCache[key];}
+for(var key in this.wfsCache){delete this.wfsCache[key];}
+OpenLayers.Control.prototype.destroy.apply(this,arguments);},coupleLayerVisiblity:function(evt){this.setVisibility(evt.object.getVisibility());},createSelectionLayer:function(source){var selectionLayer;if(!this.layerCache[source.id]){selectionLayer=new OpenLayers.Layer.WMS.Post(source.name,source.url,source.params,OpenLayers.Util.applyDefaults(this.layerOptions,source.getOptions()));this.layerCache[source.id]=selectionLayer;if(this.layerOptions.displayInLayerSwitcher===false){source.events.on({"visibilitychanged":this.coupleLayerVisiblity,scope:selectionLayer});}
+this.map.addLayer(selectionLayer);}else{selectionLayer=this.layerCache[source.id];}
+return selectionLayer;},createSLD:function(layer,filters,geometryAttributes){var sld={version:"1.0.0",namedLayers:{}};var layerNames=[layer.params.LAYERS].join(",").split(",");for(var i=0,len=layerNames.length;i<len;i++){var name=layerNames[i];sld.namedLayers[name]={name:name,userStyles:[]};var symbolizer=this.selectionSymbolizer;var geometryAttribute=geometryAttributes[i];if(geometryAttribute.type.indexOf('Polygon')>=0){symbolizer={Polygon:this.selectionSymbolizer['Polygon']};}else if(geometryAttribute.type.indexOf('LineString')>=0){symbolizer={Line:this.selectionSymbolizer['Line']};}else if(geometryAttribute.type.indexOf('Point')>=0){symbolizer={Point:this.selectionSymbolizer['Point']};}
+var filter=filters[i];sld.namedLayers[name].userStyles.push({name:'default',rules:[new OpenLayers.Rule({symbolizer:symbolizer,filter:filter,maxScaleDenominator:layer.options.minScale})]});}
+return new OpenLayers.Format.SLD().write(sld);},parseDescribeLayer:function(request){var format=new OpenLayers.Format.WMSDescribeLayer();var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+var describeLayer=format.read(doc);var typeNames=[];var url=null;for(var i=0,len=describeLayer.length;i<len;i++){if(describeLayer[i].owsType=="WFS"){typeNames.push(describeLayer[i].typeName);url=describeLayer[i].owsURL;}}
+var options={url:url,params:{SERVICE:"WFS",TYPENAME:typeNames.toString(),REQUEST:"DescribeFeatureType",VERSION:"1.0.0"},callback:function(request){var format=new OpenLayers.Format.WFSDescribeFeatureType();var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+var describeFeatureType=format.read(doc);this.control.wfsCache[this.layer.id]=describeFeatureType;this.control._queue&&this.control.applySelection();},scope:this};OpenLayers.Request.GET(options);},getGeometryAttributes:function(layer){var result=[];var cache=this.wfsCache[layer.id];for(var i=0,len=cache.featureTypes.length;i<len;i++){var typeName=cache.featureTypes[i];var properties=typeName.properties;for(var j=0,lenj=properties.length;j<lenj;j++){var property=properties[j];var type=property.type;if((type.indexOf('LineString')>=0)||(type.indexOf('GeometryAssociationType')>=0)||(type.indexOf('GeometryPropertyType')>=0)||(type.indexOf('Point')>=0)||(type.indexOf('Polygon')>=0)){result.push(property);}}}
+return result;},activate:function(){var activated=OpenLayers.Control.prototype.activate.call(this);if(activated){for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];if(layer&&!this.wfsCache[layer.id]){var options={url:layer.url,params:{SERVICE:"WMS",VERSION:layer.params.VERSION,LAYERS:layer.params.LAYERS,REQUEST:"DescribeLayer"},callback:this.parseDescribeLayer,scope:{layer:layer,control:this}};OpenLayers.Request.GET(options);}}}
+return activated;},deactivate:function(){var deactivated=OpenLayers.Control.prototype.deactivate.call(this);if(deactivated){for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];if(layer&&this.clearOnDeactivate===true){var layerCache=this.layerCache;var selectionLayer=layerCache[layer.id];if(selectionLayer){layer.events.un({"visibilitychanged":this.coupleLayerVisiblity,scope:selectionLayer});selectionLayer.destroy();delete layerCache[layer.id];}}}}
+return deactivated;},setLayers:function(layers){if(this.active){this.deactivate();this.layers=layers;this.activate();}else{this.layers=layers;}},createFilter:function(geometryAttribute,geometry){var filter=null;if(this.handler instanceof OpenLayers.Handler.RegularPolygon){if(this.handler.irregular===true){filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.BBOX,property:geometryAttribute.name,value:geometry.getBounds()});}else{filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.INTERSECTS,property:geometryAttribute.name,value:geometry});}}else if(this.handler instanceof OpenLayers.Handler.Polygon){filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.INTERSECTS,property:geometryAttribute.name,value:geometry});}else if(this.handler instanceof OpenLayers.Handler.Path){if(geometryAttribute.type.indexOf('Point')>=0){filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.DWITHIN,property:geometryAttribute.name,distance:this.map.getExtent().getWidth()*0.01,distanceUnits:this.map.getUnits(),value:geometry});}else{filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.INTERSECTS,property:geometryAttribute.name,value:geometry});}}else if(this.handler instanceof OpenLayers.Handler.Click){if(geometryAttribute.type.indexOf('Polygon')>=0){filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.INTERSECTS,property:geometryAttribute.name,value:geometry});}else{filter=new OpenLayers.Filter.Spatial({type:OpenLayers.Filter.Spatial.DWITHIN,property:geometryAttribute.name,distance:this.map.getExtent().getWidth()*0.01,distanceUnits:this.map.getUnits(),value:geometry});}}
+return filter;},select:function(geometry){this._queue=function(){for(var i=0,len=this.layers.length;i<len;i++){var layer=this.layers[i];var geometryAttributes=this.getGeometryAttributes(layer);var filters=[];for(var j=0,lenj=geometryAttributes.length;j<lenj;j++){var geometryAttribute=geometryAttributes[j];if(geometryAttribute!==null){if(!(geometry instanceof OpenLayers.Geometry)){var point=this.map.getLonLatFromPixel(geometry.xy);geometry=new OpenLayers.Geometry.Point(point.lon,point.lat);}
+var filter=this.createFilter(geometryAttribute,geometry);if(filter!==null){filters.push(filter);}}}
+var selectionLayer=this.createSelectionLayer(layer);var sld=this.createSLD(layer,filters,geometryAttributes);this.events.triggerEvent("selected",{layer:layer,filters:filters});selectionLayer.mergeNewParams({SLD_BODY:sld});delete this._queue;}};this.applySelection();},applySelection:function(){var canApply=true;for(var i=0,len=this.layers.length;i<len;i++){if(!this.wfsCache[this.layers[i].id]){canApply=false;break;}}
+canApply&&this._queue.call(this);},CLASS_NAME:"OpenLayers.Control.SLDSelect"});OpenLayers.Format.ArcXML=OpenLayers.Class(OpenLayers.Format.XML,{fontStyleKeys:['antialiasing','blockout','font','fontcolor','fontsize','fontstyle','glowing','interval','outline','printmode','shadow','transparency'],request:null,response:null,initialize:function(options){this.request=new OpenLayers.Format.ArcXML.Request();this.response=new OpenLayers.Format.ArcXML.Response();if(options){if(options.requesttype=="feature"){this.request.get_image=null;var qry=this.request.get_feature.query;this.addCoordSys(qry.featurecoordsys,options.featureCoordSys);this.addCoordSys(qry.filtercoordsys,options.filterCoordSys);if(options.polygon){qry.isspatial=true;qry.spatialfilter.polygon=options.polygon;}else if(options.envelope){qry.isspatial=true;qry.spatialfilter.envelope={minx:0,miny:0,maxx:0,maxy:0};this.parseEnvelope(qry.spatialfilter.envelope,options.envelope);}}else if(options.requesttype=="image"){this.request.get_feature=null;var props=this.request.get_image.properties;this.parseEnvelope(props.envelope,options.envelope);this.addLayers(props.layerlist,options.layers);this.addImageSize(props.imagesize,options.tileSize);this.addCoordSys(props.featurecoordsys,options.featureCoordSys);this.addCoordSys(props.filtercoordsys,options.filterCoordSys);}else{this.request=null;}}
+OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},parseEnvelope:function(env,arr){if(arr&&arr.length==4){env.minx=arr[0];env.miny=arr[1];env.maxx=arr[2];env.maxy=arr[3];}},addLayers:function(ll,lyrs){for(var lind=0,len=lyrs.length;lind<len;lind++){ll.push(lyrs[lind]);}},addImageSize:function(imsize,olsize){if(olsize!==null){imsize.width=olsize.w;imsize.height=olsize.h;imsize.printwidth=olsize.w;imsize.printheight=olsize.h;}},addCoordSys:function(featOrFilt,fsys){if(typeof fsys=="string"){featOrFilt.id=parseInt(fsys);featOrFilt.string=fsys;}
+else if(typeof fsys=="object"&&fsys.proj!==null){featOrFilt.id=fsys.proj.srsProjNumber;featOrFilt.string=fsys.proj.srsCode;}else{featOrFilt=fsys;}},iserror:function(data){var ret=null;if(!data){ret=(this.response.error!=='');}else{data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);var errorNodes=data.documentElement.getElementsByTagName("ERROR");ret=(errorNodes!==null&&errorNodes.length>0);}
+return ret;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var arcNode=null;if(data&&data.documentElement){if(data.documentElement.nodeName=="ARCXML"){arcNode=data.documentElement;}else{arcNode=data.documentElement.getElementsByTagName("ARCXML")[0];}}
+if(!arcNode||arcNode.firstChild.nodeName==='parsererror'){var error,source;try{error=data.firstChild.nodeValue;source=data.firstChild.childNodes[1].firstChild.nodeValue;}catch(err){}
+throw{message:"Error parsing the ArcXML request",error:error,source:source};}
+var response=this.parseResponse(arcNode);return response;},write:function(request){if(!request){request=this.request;}
+var root=this.createElementNS("","ARCXML");root.setAttribute("version","1.1");var reqElem=this.createElementNS("","REQUEST");if(request.get_image!=null){var getElem=this.createElementNS("","GET_IMAGE");reqElem.appendChild(getElem);var propElem=this.createElementNS("","PROPERTIES");getElem.appendChild(propElem);var props=request.get_image.properties;if(props.featurecoordsys!=null){var feat=this.createElementNS("","FEATURECOORDSYS");propElem.appendChild(feat);if(props.featurecoordsys.id===0){feat.setAttribute("string",props.featurecoordsys['string']);}
+else{feat.setAttribute("id",props.featurecoordsys.id);}}
+if(props.filtercoordsys!=null){var filt=this.createElementNS("","FILTERCOORDSYS");propElem.appendChild(filt);if(props.filtercoordsys.id===0){filt.setAttribute("string",props.filtercoordsys.string);}
+else{filt.setAttribute("id",props.filtercoordsys.id);}}
+if(props.envelope!=null){var env=this.createElementNS("","ENVELOPE");propElem.appendChild(env);env.setAttribute("minx",props.envelope.minx);env.setAttribute("miny",props.envelope.miny);env.setAttribute("maxx",props.envelope.maxx);env.setAttribute("maxy",props.envelope.maxy);}
+var imagesz=this.createElementNS("","IMAGESIZE");propElem.appendChild(imagesz);imagesz.setAttribute("height",props.imagesize.height);imagesz.setAttribute("width",props.imagesize.width);if(props.imagesize.height!=props.imagesize.printheight||props.imagesize.width!=props.imagesize.printwidth){imagesz.setAttribute("printheight",props.imagesize.printheight);imagesz.setArrtibute("printwidth",props.imagesize.printwidth);}
+if(props.background!=null){var backgrnd=this.createElementNS("","BACKGROUND");propElem.appendChild(backgrnd);backgrnd.setAttribute("color",props.background.color.r+","+
+props.background.color.g+","+
+props.background.color.b);if(props.background.transcolor!==null){backgrnd.setAttribute("transcolor",props.background.transcolor.r+","+
+props.background.transcolor.g+","+
+props.background.transcolor.b);}}
+if(props.layerlist!=null&&props.layerlist.length>0){var layerlst=this.createElementNS("","LAYERLIST");propElem.appendChild(layerlst);for(var ld=0;ld<props.layerlist.length;ld++){var ldef=this.createElementNS("","LAYERDEF");layerlst.appendChild(ldef);ldef.setAttribute("id",props.layerlist[ld].id);ldef.setAttribute("visible",props.layerlist[ld].visible);if(typeof props.layerlist[ld].query=="object"){var query=props.layerlist[ld].query;if(query.where.length<0){continue;}
+var queryElem=null;if(typeof query.spatialfilter=="boolean"&&query.spatialfilter){queryElem=this.createElementNS("","SPATIALQUERY");}
+else{queryElem=this.createElementNS("","QUERY");}
+queryElem.setAttribute("where",query.where);if(typeof query.accuracy=="number"&&query.accuracy>0){queryElem.setAttribute("accuracy",query.accuracy);}
+if(typeof query.featurelimit=="number"&&query.featurelimit<2000){queryElem.setAttribute("featurelimit",query.featurelimit);}
+if(typeof query.subfields=="string"&&query.subfields!="#ALL#"){queryElem.setAttribute("subfields",query.subfields);}
+if(typeof query.joinexpression=="string"&&query.joinexpression.length>0){queryElem.setAttribute("joinexpression",query.joinexpression);}
+if(typeof query.jointables=="string"&&query.jointables.length>0){queryElem.setAttribute("jointables",query.jointables);}
+ldef.appendChild(queryElem);}
+if(typeof props.layerlist[ld].renderer=="object"){this.addRenderer(ldef,props.layerlist[ld].renderer);}}}}else if(request.get_feature!=null){var getElem=this.createElementNS("","GET_FEATURES");getElem.setAttribute("outputmode","newxml");getElem.setAttribute("checkesc","true");if(request.get_feature.geometry){getElem.setAttribute("geometry",request.get_feature.geometry);}
+else{getElem.setAttribute("geometry","false");}
+if(request.get_feature.compact){getElem.setAttribute("compact",request.get_feature.compact);}
+if(request.get_feature.featurelimit=="number"){getElem.setAttribute("featurelimit",request.get_feature.featurelimit);}
+getElem.setAttribute("globalenvelope","true");reqElem.appendChild(getElem);if(request.get_feature.layer!=null&&request.get_feature.layer.length>0){var lyrElem=this.createElementNS("","LAYER");lyrElem.setAttribute("id",request.get_feature.layer);getElem.appendChild(lyrElem);}
+var fquery=request.get_feature.query;if(fquery!=null){var qElem=null;if(fquery.isspatial){qElem=this.createElementNS("","SPATIALQUERY");}else{qElem=this.createElementNS("","QUERY");}
+getElem.appendChild(qElem);if(typeof fquery.accuracy=="number"){qElem.setAttribute("accuracy",fquery.accuracy);}
+if(fquery.featurecoordsys!=null){var fcsElem1=this.createElementNS("","FEATURECOORDSYS");if(fquery.featurecoordsys.id==0){fcsElem1.setAttribute("string",fquery.featurecoordsys.string);}else{fcsElem1.setAttribute("id",fquery.featurecoordsys.id);}
+qElem.appendChild(fcsElem1);}
+if(fquery.filtercoordsys!=null){var fcsElem2=this.createElementNS("","FILTERCOORDSYS");if(fquery.filtercoordsys.id===0){fcsElem2.setAttribute("string",fquery.filtercoordsys.string);}else{fcsElem2.setAttribute("id",fquery.filtercoordsys.id);}
+qElem.appendChild(fcsElem2);}
+if(fquery.buffer>0){var bufElem=this.createElementNS("","BUFFER");bufElem.setAttribute("distance",fquery.buffer);qElem.appendChild(bufElem);}
+if(fquery.isspatial){var spfElem=this.createElementNS("","SPATIALFILTER");spfElem.setAttribute("relation",fquery.spatialfilter.relation);qElem.appendChild(spfElem);if(fquery.spatialfilter.envelope){var envElem=this.createElementNS("","ENVELOPE");envElem.setAttribute("minx",fquery.spatialfilter.envelope.minx);envElem.setAttribute("miny",fquery.spatialfilter.envelope.miny);envElem.setAttribute("maxx",fquery.spatialfilter.envelope.maxx);envElem.setAttribute("maxy",fquery.spatialfilter.envelope.maxy);spfElem.appendChild(envElem);}else if(typeof fquery.spatialfilter.polygon=="object"){spfElem.appendChild(this.writePolygonGeometry(fquery.spatialfilter.polygon));}}
+if(fquery.where!=null&&fquery.where.length>0){qElem.setAttribute("where",fquery.where);}}}
+root.appendChild(reqElem);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},addGroupRenderer:function(ldef,toprenderer){var topRelem=this.createElementNS("","GROUPRENDERER");ldef.appendChild(topRelem);for(var rind=0;rind<toprenderer.length;rind++){var renderer=toprenderer[rind];this.addRenderer(topRelem,renderer);}},addRenderer:function(topRelem,renderer){if(renderer instanceof Array){this.addGroupRenderer(topRelem,renderer);}else{var renderElem=this.createElementNS("",renderer.type.toUpperCase()+"RENDERER");topRelem.appendChild(renderElem);if(renderElem.tagName=="VALUEMAPRENDERER"){this.addValueMapRenderer(renderElem,renderer);}else if(renderElem.tagName=="VALUEMAPLABELRENDERER"){this.addValueMapLabelRenderer(renderElem,renderer);}else if(renderElem.tagName=="SIMPLELABELRENDERER"){this.addSimpleLabelRenderer(renderElem,renderer);}else if(renderElem.tagName=="SCALEDEPENDENTRENDERER"){this.addScaleDependentRenderer(renderElem,renderer);}}},addScaleDependentRenderer:function(renderElem,renderer){if(typeof renderer.lower=="string"||typeof renderer.lower=="number"){renderElem.setAttribute("lower",renderer.lower);}
+if(typeof renderer.upper=="string"||typeof renderer.upper=="number"){renderElem.setAttribute("upper",renderer.upper);}
+this.addRenderer(renderElem,renderer.renderer);},addValueMapLabelRenderer:function(renderElem,renderer){renderElem.setAttribute("lookupfield",renderer.lookupfield);renderElem.setAttribute("labelfield",renderer.labelfield);if(typeof renderer.exacts=="object"){for(var ext=0,extlen=renderer.exacts.length;ext<extlen;ext++){var exact=renderer.exacts[ext];var eelem=this.createElementNS("","EXACT");if(typeof exact.value=="string"){eelem.setAttribute("value",exact.value);}
+if(typeof exact.label=="string"){eelem.setAttribute("label",exact.label);}
+if(typeof exact.method=="string"){eelem.setAttribute("method",exact.method);}
+renderElem.appendChild(eelem);if(typeof exact.symbol=="object"){var selem=null;if(exact.symbol.type=="text"){selem=this.createElementNS("","TEXTSYMBOL");}
+if(selem!=null){var keys=this.fontStyleKeys;for(var i=0,len=keys.length;i<len;i++){var key=keys[i];if(exact.symbol[key]){selem.setAttribute(key,exact.symbol[key]);}}
+eelem.appendChild(selem);}}}}},addValueMapRenderer:function(renderElem,renderer){renderElem.setAttribute("lookupfield",renderer.lookupfield);if(typeof renderer.ranges=="object"){for(var rng=0,rnglen=renderer.ranges.length;rng<rnglen;rng++){var range=renderer.ranges[rng];var relem=this.createElementNS("","RANGE");relem.setAttribute("lower",range.lower);relem.setAttribute("upper",range.upper);renderElem.appendChild(relem);if(typeof range.symbol=="object"){var selem=null;if(range.symbol.type=="simplepolygon"){selem=this.createElementNS("","SIMPLEPOLYGONSYMBOL");}
+if(selem!=null){if(typeof range.symbol.boundarycolor=="string"){selem.setAttribute("boundarycolor",range.symbol.boundarycolor);}
+if(typeof range.symbol.fillcolor=="string"){selem.setAttribute("fillcolor",range.symbol.fillcolor);}
+if(typeof range.symbol.filltransparency=="number"){selem.setAttribute("filltransparency",range.symbol.filltransparency);}
+relem.appendChild(selem);}}}}else if(typeof renderer.exacts=="object"){for(var ext=0,extlen=renderer.exacts.length;ext<extlen;ext++){var exact=renderer.exacts[ext];var eelem=this.createElementNS("","EXACT");if(typeof exact.value=="string"){eelem.setAttribute("value",exact.value);}
+if(typeof exact.label=="string"){eelem.setAttribute("label",exact.label);}
+if(typeof exact.method=="string"){eelem.setAttribute("method",exact.method);}
+renderElem.appendChild(eelem);if(typeof exact.symbol=="object"){var selem=null;if(exact.symbol.type=="simplemarker"){selem=this.createElementNS("","SIMPLEMARKERSYMBOL");}
+if(selem!=null){if(typeof exact.symbol.antialiasing=="string"){selem.setAttribute("antialiasing",exact.symbol.antialiasing);}
+if(typeof exact.symbol.color=="string"){selem.setAttribute("color",exact.symbol.color);}
+if(typeof exact.symbol.outline=="string"){selem.setAttribute("outline",exact.symbol.outline);}
+if(typeof exact.symbol.overlap=="string"){selem.setAttribute("overlap",exact.symbol.overlap);}
+if(typeof exact.symbol.shadow=="string"){selem.setAttribute("shadow",exact.symbol.shadow);}
+if(typeof exact.symbol.transparency=="number"){selem.setAttribute("transparency",exact.symbol.transparency);}
+if(typeof exact.symbol.usecentroid=="string"){selem.setAttribute("usecentroid",exact.symbol.usecentroid);}
+if(typeof exact.symbol.width=="number"){selem.setAttribute("width",exact.symbol.width);}
+eelem.appendChild(selem);}}}}},addSimpleLabelRenderer:function(renderElem,renderer){renderElem.setAttribute("field",renderer.field);var keys=['featureweight','howmanylabels','labelbufferratio','labelpriorities','labelweight','linelabelposition','rotationalangles'];for(var i=0,len=keys.length;i<len;i++){var key=keys[i];if(renderer[key]){renderElem.setAttribute(key,renderer[key]);}}
+if(renderer.symbol.type=="text"){var symbol=renderer.symbol;var selem=this.createElementNS("","TEXTSYMBOL");renderElem.appendChild(selem);var keys=this.fontStyleKeys;for(var i=0,len=keys.length;i<len;i++){var key=keys[i];if(symbol[key]){selem.setAttribute(key,renderer[key]);}}}},writePolygonGeometry:function(polygon){if(!(polygon instanceof OpenLayers.Geometry.Polygon)){throw{message:'Cannot write polygon geometry to ArcXML with an '+
+polygon.CLASS_NAME+' object.',geometry:polygon};}
+var polyElem=this.createElementNS("","POLYGON");for(var ln=0,lnlen=polygon.components.length;ln<lnlen;ln++){var ring=polygon.components[ln];var ringElem=this.createElementNS("","RING");for(var rn=0,rnlen=ring.components.length;rn<rnlen;rn++){var point=ring.components[rn];var pointElem=this.createElementNS("","POINT");pointElem.setAttribute("x",point.x);pointElem.setAttribute("y",point.y);ringElem.appendChild(pointElem);}
+polyElem.appendChild(ringElem);}
+return polyElem;},parseResponse:function(data){if(typeof data=="string"){var newData=new OpenLayers.Format.XML();data=newData.read(data);}
+var response=new OpenLayers.Format.ArcXML.Response();var errorNode=data.getElementsByTagName("ERROR");if(errorNode!=null&&errorNode.length>0){response.error=this.getChildValue(errorNode,"Unknown error.");}else{var responseNode=data.getElementsByTagName("RESPONSE");if(responseNode==null||responseNode.length==0){response.error="No RESPONSE tag found in ArcXML response.";return response;}
+var rtype=responseNode[0].firstChild.nodeName;if(rtype=="#text"){rtype=responseNode[0].firstChild.nextSibling.nodeName;}
+if(rtype=="IMAGE"){var envelopeNode=data.getElementsByTagName("ENVELOPE");var outputNode=data.getElementsByTagName("OUTPUT");if(envelopeNode==null||envelopeNode.length==0){response.error="No ENVELOPE tag found in ArcXML response.";}else if(outputNode==null||outputNode.length==0){response.error="No OUTPUT tag found in ArcXML response.";}else{var envAttr=this.parseAttributes(envelopeNode[0]);var outputAttr=this.parseAttributes(outputNode[0]);if(typeof outputAttr.type=="string"){response.image={envelope:envAttr,output:{type:outputAttr.type,data:this.getChildValue(outputNode[0])}};}else{response.image={envelope:envAttr,output:outputAttr};}}}else if(rtype=="FEATURES"){var features=responseNode[0].getElementsByTagName("FEATURES");var featureCount=features[0].getElementsByTagName("FEATURECOUNT");response.features.featurecount=featureCount[0].getAttribute("count");if(response.features.featurecount>0){var envelope=features[0].getElementsByTagName("ENVELOPE");response.features.envelope=this.parseAttributes(envelope[0],typeof(0));var featureList=features[0].getElementsByTagName("FEATURE");for(var fn=0;fn<featureList.length;fn++){var feature=new OpenLayers.Feature.Vector();var fields=featureList[fn].getElementsByTagName("FIELD");for(var fdn=0;fdn<fields.length;fdn++){var fieldName=fields[fdn].getAttribute("name");var fieldValue=fields[fdn].getAttribute("value");feature.attributes[fieldName]=fieldValue;}
+var geom=featureList[fn].getElementsByTagName("POLYGON");if(geom.length>0){var ring=geom[0].getElementsByTagName("RING");var polys=[];for(var rn=0;rn<ring.length;rn++){var linearRings=[];linearRings.push(this.parsePointGeometry(ring[rn]));var holes=ring[rn].getElementsByTagName("HOLE");for(var hn=0;hn<holes.length;hn++){linearRings.push(this.parsePointGeometry(holes[hn]));}
+holes=null;polys.push(new OpenLayers.Geometry.Polygon(linearRings));linearRings=null;}
+ring=null;if(polys.length==1){feature.geometry=polys[0];}else
+{feature.geometry=new OpenLayers.Geometry.MultiPolygon(polys);}}
+response.features.feature.push(feature);}}}else{response.error="Unidentified response type.";}}
+return response;},parseAttributes:function(node,type){var attributes={};for(var attr=0;attr<node.attributes.length;attr++){if(type=="number"){attributes[node.attributes[attr].nodeName]=parseFloat(node.attributes[attr].nodeValue);}else{attributes[node.attributes[attr].nodeName]=node.attributes[attr].nodeValue;}}
+return attributes;},parsePointGeometry:function(node){var ringPoints=[];var coords=node.getElementsByTagName("COORDS");if(coords.length>0){var coordArr=this.getChildValue(coords[0]);coordArr=coordArr.split(/;/);for(var cn=0;cn<coordArr.length;cn++){var coordItems=coordArr[cn].split(/ /);ringPoints.push(new OpenLayers.Geometry.Point(parseFloat(coordItems[0]),parseFloat(coordItems[1])));}
+coords=null;}else{var point=node.getElementsByTagName("POINT");if(point.length>0){for(var pn=0;pn<point.length;pn++){ringPoints.push(new OpenLayers.Geometry.Point(parseFloat(point[pn].getAttribute("x")),parseFloat(point[pn].getAttribute("y"))));}}
+point=null;}
+return new OpenLayers.Geometry.LinearRing(ringPoints);},CLASS_NAME:"OpenLayers.Format.ArcXML"});OpenLayers.Format.ArcXML.Request=OpenLayers.Class({initialize:function(params){var defaults={get_image:{properties:{background:null,draw:true,envelope:{minx:0,miny:0,maxx:0,maxy:0},featurecoordsys:{id:0,string:"",datumtransformid:0,datumtransformstring:""},filtercoordsys:{id:0,string:"",datumtransformid:0,datumtransformstring:""},imagesize:{height:0,width:0,dpi:96,printheight:0,printwidth:0,scalesymbols:false},layerlist:[],output:{baseurl:"",legendbaseurl:"",legendname:"",legendpath:"",legendurl:"",name:"",path:"",type:"jpg",url:""}}},get_feature:{layer:"",query:{isspatial:false,featurecoordsys:{id:0,string:"",datumtransformid:0,datumtransformstring:""},filtercoordsys:{id:0,string:"",datumtransformid:0,datumtransformstring:""},buffer:0,where:"",spatialfilter:{relation:"envelope_intersection",envelope:null}}},environment:{separators:{cs:" ",ts:";"}},layer:[],workspaces:[]};return OpenLayers.Util.extend(this,defaults);},CLASS_NAME:"OpenLayers.Format.ArcXML.Request"});OpenLayers.Format.ArcXML.Response=OpenLayers.Class({initialize:function(params){var defaults={image:{envelope:null,output:''},features:{featurecount:0,envelope:null,feature:[]},error:''};return OpenLayers.Util.extend(this,defaults);},CLASS_NAME:"OpenLayers.Format.ArcXML.Response"});OpenLayers.Format.GML=OpenLayers.Class(OpenLayers.Format.XML,{featureNS:"http://mapserver.gis.umn.edu/mapserver",featurePrefix:"feature",featureName:"featureMember",layerName:"features",geometryName:"geometry",collectionName:"FeatureCollection",gmlns:"http://www.opengis.net/gml",extractAttributes:true,xy:true,initialize:function(options){this.regExes={trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)};OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+var featureNodes=this.getElementsByTagNameNS(data.documentElement,this.gmlns,this.featureName);var features=[];for(var i=0;i<featureNodes.length;i++){var feature=this.parseFeature(featureNodes[i]);if(feature){features.push(feature);}}
+return features;},parseFeature:function(node){var order=["MultiPolygon","Polygon","MultiLineString","LineString","MultiPoint","Point","Envelope"];var type,nodeList,geometry,parser;for(var i=0;i<order.length;++i){type=order[i];nodeList=this.getElementsByTagNameNS(node,this.gmlns,type);if(nodeList.length>0){parser=this.parseGeometry[type.toLowerCase()];if(parser){geometry=parser.apply(this,[nodeList[0]]);if(this.internalProjection&&this.externalProjection){geometry.transform(this.externalProjection,this.internalProjection);}}else{OpenLayers.Console.error(OpenLayers.i18n("unsupportedGeometryType",{'geomType':type}));}
+break;}}
+var bounds;var boxNodes=this.getElementsByTagNameNS(node,this.gmlns,"Box");for(i=0;i<boxNodes.length;++i){var boxNode=boxNodes[i];var box=this.parseGeometry["box"].apply(this,[boxNode]);var parentNode=boxNode.parentNode;var parentName=parentNode.localName||parentNode.nodeName.split(":").pop();if(parentName==="boundedBy"){bounds=box;}else{geometry=box.toGeometry();}}
+var attributes;if(this.extractAttributes){attributes=this.parseAttributes(node);}
+var feature=new OpenLayers.Feature.Vector(geometry,attributes);feature.bounds=bounds;feature.gml={featureType:node.firstChild.nodeName.split(":")[1],featureNS:node.firstChild.namespaceURI,featureNSPrefix:node.firstChild.prefix};var childNode=node.firstChild;var fid;while(childNode){if(childNode.nodeType==1){fid=childNode.getAttribute("fid")||childNode.getAttribute("id");if(fid){break;}}
+childNode=childNode.nextSibling;}
+feature.fid=fid;return feature;},parseGeometry:{point:function(node){var nodeList,coordString;var coords=[];var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"pos");if(nodeList.length>0){coordString=nodeList[0].firstChild.nodeValue;coordString=coordString.replace(this.regExes.trimSpace,"");coords=coordString.split(this.regExes.splitSpace);}
+if(coords.length==0){nodeList=this.getElementsByTagNameNS(node,this.gmlns,"coordinates");if(nodeList.length>0){coordString=nodeList[0].firstChild.nodeValue;coordString=coordString.replace(this.regExes.removeSpace,"");coords=coordString.split(",");}}
+if(coords.length==0){nodeList=this.getElementsByTagNameNS(node,this.gmlns,"coord");if(nodeList.length>0){var xList=this.getElementsByTagNameNS(nodeList[0],this.gmlns,"X");var yList=this.getElementsByTagNameNS(nodeList[0],this.gmlns,"Y");if(xList.length>0&&yList.length>0){coords=[xList[0].firstChild.nodeValue,yList[0].firstChild.nodeValue];}}}
+if(coords.length==2){coords[2]=null;}
+if(this.xy){return new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}
+else{return new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]);}},multipoint:function(node){var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"Point");var components=[];if(nodeList.length>0){var point;for(var i=0;i<nodeList.length;++i){point=this.parseGeometry.point.apply(this,[nodeList[i]]);if(point){components.push(point);}}}
+return new OpenLayers.Geometry.MultiPoint(components);},linestring:function(node,ring){var nodeList,coordString;var coords=[];var points=[];nodeList=this.getElementsByTagNameNS(node,this.gmlns,"posList");if(nodeList.length>0){coordString=this.getChildValue(nodeList[0]);coordString=coordString.replace(this.regExes.trimSpace,"");coords=coordString.split(this.regExes.splitSpace);var dim=parseInt(nodeList[0].getAttribute("dimension"));var j,x,y,z;for(var i=0;i<coords.length/dim;++i){j=i*dim;x=coords[j];y=coords[j+1];z=(dim==2)?null:coords[j+2];if(this.xy){points.push(new OpenLayers.Geometry.Point(x,y,z));}else{points.push(new OpenLayers.Geometry.Point(y,x,z));}}}
+if(coords.length==0){nodeList=this.getElementsByTagNameNS(node,this.gmlns,"coordinates");if(nodeList.length>0){coordString=this.getChildValue(nodeList[0]);coordString=coordString.replace(this.regExes.trimSpace,"");coordString=coordString.replace(this.regExes.trimComma,",");var pointList=coordString.split(this.regExes.splitSpace);for(var i=0;i<pointList.length;++i){coords=pointList[i].split(",");if(coords.length==2){coords[2]=null;}
+if(this.xy){points.push(new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]));}else{points.push(new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]));}}}}
+var line=null;if(points.length!=0){if(ring){line=new OpenLayers.Geometry.LinearRing(points);}else{line=new OpenLayers.Geometry.LineString(points);}}
+return line;},multilinestring:function(node){var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"LineString");var components=[];if(nodeList.length>0){var line;for(var i=0;i<nodeList.length;++i){line=this.parseGeometry.linestring.apply(this,[nodeList[i]]);if(line){components.push(line);}}}
+return new OpenLayers.Geometry.MultiLineString(components);},polygon:function(node){var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"LinearRing");var components=[];if(nodeList.length>0){var ring;for(var i=0;i<nodeList.length;++i){ring=this.parseGeometry.linestring.apply(this,[nodeList[i],true]);if(ring){components.push(ring);}}}
+return new OpenLayers.Geometry.Polygon(components);},multipolygon:function(node){var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"Polygon");var components=[];if(nodeList.length>0){var polygon;for(var i=0;i<nodeList.length;++i){polygon=this.parseGeometry.polygon.apply(this,[nodeList[i]]);if(polygon){components.push(polygon);}}}
+return new OpenLayers.Geometry.MultiPolygon(components);},envelope:function(node){var components=[];var coordString;var envelope;var lpoint=this.getElementsByTagNameNS(node,this.gmlns,"lowerCorner");if(lpoint.length>0){var coords=[];if(lpoint.length>0){coordString=lpoint[0].firstChild.nodeValue;coordString=coordString.replace(this.regExes.trimSpace,"");coords=coordString.split(this.regExes.splitSpace);}
+if(coords.length==2){coords[2]=null;}
+if(this.xy){var lowerPoint=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{var lowerPoint=new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]);}}
+var upoint=this.getElementsByTagNameNS(node,this.gmlns,"upperCorner");if(upoint.length>0){var coords=[];if(upoint.length>0){coordString=upoint[0].firstChild.nodeValue;coordString=coordString.replace(this.regExes.trimSpace,"");coords=coordString.split(this.regExes.splitSpace);}
+if(coords.length==2){coords[2]=null;}
+if(this.xy){var upperPoint=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{var upperPoint=new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]);}}
+if(lowerPoint&&upperPoint){components.push(new OpenLayers.Geometry.Point(lowerPoint.x,lowerPoint.y));components.push(new OpenLayers.Geometry.Point(upperPoint.x,lowerPoint.y));components.push(new OpenLayers.Geometry.Point(upperPoint.x,upperPoint.y));components.push(new OpenLayers.Geometry.Point(lowerPoint.x,upperPoint.y));components.push(new OpenLayers.Geometry.Point(lowerPoint.x,lowerPoint.y));var ring=new OpenLayers.Geometry.LinearRing(components);envelope=new OpenLayers.Geometry.Polygon([ring]);}
+return envelope;},box:function(node){var nodeList=this.getElementsByTagNameNS(node,this.gmlns,"coordinates");var coordString;var coords,beginPoint=null,endPoint=null;if(nodeList.length>0){coordString=nodeList[0].firstChild.nodeValue;coords=coordString.split(" ");if(coords.length==2){beginPoint=coords[0].split(",");endPoint=coords[1].split(",");}}
+if(beginPoint!==null&&endPoint!==null){return new OpenLayers.Bounds(parseFloat(beginPoint[0]),parseFloat(beginPoint[1]),parseFloat(endPoint[0]),parseFloat(endPoint[1]));}}},parseAttributes:function(node){var attributes={};var childNode=node.firstChild;var children,i,child,grandchildren,grandchild,name,value;while(childNode){if(childNode.nodeType==1){children=childNode.childNodes;for(i=0;i<children.length;++i){child=children[i];if(child.nodeType==1){grandchildren=child.childNodes;if(grandchildren.length==1){grandchild=grandchildren[0];if(grandchild.nodeType==3||grandchild.nodeType==4){name=(child.prefix)?child.nodeName.split(":")[1]:child.nodeName;value=grandchild.nodeValue.replace(this.regExes.trimSpace,"");attributes[name]=value;}}else{attributes[child.nodeName.split(":").pop()]=null;}}}
+break;}
+childNode=childNode.nextSibling;}
+return attributes;},write:function(features){if(!(features instanceof Array)){features=[features];}
+var gml=this.createElementNS("http://www.opengis.net/wfs","wfs:"+this.collectionName);for(var i=0;i<features.length;i++){gml.appendChild(this.createFeatureXML(features[i]));}
+return OpenLayers.Format.XML.prototype.write.apply(this,[gml]);},createFeatureXML:function(feature){var geometry=feature.geometry;var geometryNode=this.buildGeometryNode(geometry);var geomContainer=this.createElementNS(this.featureNS,this.featurePrefix+":"+
+this.geometryName);geomContainer.appendChild(geometryNode);var featureNode=this.createElementNS(this.gmlns,"gml:"+this.featureName);var featureContainer=this.createElementNS(this.featureNS,this.featurePrefix+":"+
+this.layerName);var fid=feature.fid||feature.id;featureContainer.setAttribute("fid",fid);featureContainer.appendChild(geomContainer);for(var attr in feature.attributes){var attrText=this.createTextNode(feature.attributes[attr]);var nodename=attr.substring(attr.lastIndexOf(":")+1);var attrContainer=this.createElementNS(this.featureNS,this.featurePrefix+":"+
+nodename);attrContainer.appendChild(attrText);featureContainer.appendChild(attrContainer);}
+featureNode.appendChild(featureContainer);return featureNode;},buildGeometryNode:function(geometry){if(this.externalProjection&&this.internalProjection){geometry=geometry.clone();geometry.transform(this.internalProjection,this.externalProjection);}
+var className=geometry.CLASS_NAME;var type=className.substring(className.lastIndexOf(".")+1);var builder=this.buildGeometry[type.toLowerCase()];return builder.apply(this,[geometry]);},buildGeometry:{point:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:Point");gml.appendChild(this.buildCoordinatesNode(geometry));return gml;},multipoint:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:MultiPoint");var points=geometry.components;var pointMember,pointGeom;for(var i=0;i<points.length;i++){pointMember=this.createElementNS(this.gmlns,"gml:pointMember");pointGeom=this.buildGeometry.point.apply(this,[points[i]]);pointMember.appendChild(pointGeom);gml.appendChild(pointMember);}
+return gml;},linestring:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:LineString");gml.appendChild(this.buildCoordinatesNode(geometry));return gml;},multilinestring:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:MultiLineString");var lines=geometry.components;var lineMember,lineGeom;for(var i=0;i<lines.length;++i){lineMember=this.createElementNS(this.gmlns,"gml:lineStringMember");lineGeom=this.buildGeometry.linestring.apply(this,[lines[i]]);lineMember.appendChild(lineGeom);gml.appendChild(lineMember);}
+return gml;},linearring:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:LinearRing");gml.appendChild(this.buildCoordinatesNode(geometry));return gml;},polygon:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:Polygon");var rings=geometry.components;var ringMember,ringGeom,type;for(var i=0;i<rings.length;++i){type=(i==0)?"outerBoundaryIs":"innerBoundaryIs";ringMember=this.createElementNS(this.gmlns,"gml:"+type);ringGeom=this.buildGeometry.linearring.apply(this,[rings[i]]);ringMember.appendChild(ringGeom);gml.appendChild(ringMember);}
+return gml;},multipolygon:function(geometry){var gml=this.createElementNS(this.gmlns,"gml:MultiPolygon");var polys=geometry.components;var polyMember,polyGeom;for(var i=0;i<polys.length;++i){polyMember=this.createElementNS(this.gmlns,"gml:polygonMember");polyGeom=this.buildGeometry.polygon.apply(this,[polys[i]]);polyMember.appendChild(polyGeom);gml.appendChild(polyMember);}
+return gml;},bounds:function(bounds){var gml=this.createElementNS(this.gmlns,"gml:Box");gml.appendChild(this.buildCoordinatesNode(bounds));return gml;}},buildCoordinatesNode:function(geometry){var coordinatesNode=this.createElementNS(this.gmlns,"gml:coordinates");coordinatesNode.setAttribute("decimal",".");coordinatesNode.setAttribute("cs",",");coordinatesNode.setAttribute("ts"," ");var parts=[];if(geometry instanceof OpenLayers.Bounds){parts.push(geometry.left+","+geometry.bottom);parts.push(geometry.right+","+geometry.top);}else{var points=(geometry.components)?geometry.components:[geometry];for(var i=0;i<points.length;i++){parts.push(points[i].x+","+points[i].y);}}
+var txtNode=this.createTextNode(parts.join(" "));coordinatesNode.appendChild(txtNode);return coordinatesNode;},CLASS_NAME:"OpenLayers.Format.GML"});OpenLayers.Format.GeoJSON=OpenLayers.Class(OpenLayers.Format.JSON,{ignoreExtraDims:false,initialize:function(options){OpenLayers.Format.JSON.prototype.initialize.apply(this,[options]);},read:function(json,type,filter){type=(type)?type:"FeatureCollection";var results=null;var obj=null;if(typeof json=="string"){obj=OpenLayers.Format.JSON.prototype.read.apply(this,[json,filter]);}else{obj=json;}
+if(!obj){OpenLayers.Console.error("Bad JSON: "+json);}else if(typeof(obj.type)!="string"){OpenLayers.Console.error("Bad GeoJSON - no type: "+json);}else if(this.isValidType(obj,type)){switch(type){case"Geometry":try{results=this.parseGeometry(obj);}catch(err){OpenLayers.Console.error(err);}
+break;case"Feature":try{results=this.parseFeature(obj);results.type="Feature";}catch(err){OpenLayers.Console.error(err);}
+break;case"FeatureCollection":results=[];switch(obj.type){case"Feature":try{results.push(this.parseFeature(obj));}catch(err){results=null;OpenLayers.Console.error(err);}
+break;case"FeatureCollection":for(var i=0,len=obj.features.length;i<len;++i){try{results.push(this.parseFeature(obj.features[i]));}catch(err){results=null;OpenLayers.Console.error(err);}}
+break;default:try{var geom=this.parseGeometry(obj);results.push(new OpenLayers.Feature.Vector(geom));}catch(err){results=null;OpenLayers.Console.error(err);}}
+break;}}
+return results;},isValidType:function(obj,type){var valid=false;switch(type){case"Geometry":if(OpenLayers.Util.indexOf(["Point","MultiPoint","LineString","MultiLineString","Polygon","MultiPolygon","Box","GeometryCollection"],obj.type)==-1){OpenLayers.Console.error("Unsupported geometry type: "+
+obj.type);}else{valid=true;}
+break;case"FeatureCollection":valid=true;break;default:if(obj.type==type){valid=true;}else{OpenLayers.Console.error("Cannot convert types from "+
+obj.type+" to "+type);}}
+return valid;},parseFeature:function(obj){var feature,geometry,attributes,bbox;attributes=(obj.properties)?obj.properties:{};bbox=(obj.geometry&&obj.geometry.bbox)||obj.bbox;try{geometry=this.parseGeometry(obj.geometry);}catch(err){throw err;}
+feature=new OpenLayers.Feature.Vector(geometry,attributes);if(bbox){feature.bounds=OpenLayers.Bounds.fromArray(bbox);}
+if(obj.id){feature.fid=obj.id;}
+return feature;},parseGeometry:function(obj){if(obj==null){return null;}
+var geometry,collection=false;if(obj.type=="GeometryCollection"){if(!(obj.geometries instanceof Array)){throw"GeometryCollection must have geometries array: "+obj;}
+var numGeom=obj.geometries.length;var components=new Array(numGeom);for(var i=0;i<numGeom;++i){components[i]=this.parseGeometry.apply(this,[obj.geometries[i]]);}
+geometry=new OpenLayers.Geometry.Collection(components);collection=true;}else{if(!(obj.coordinates instanceof Array)){throw"Geometry must have coordinates array: "+obj;}
+if(!this.parseCoords[obj.type.toLowerCase()]){throw"Unsupported geometry type: "+obj.type;}
+try{geometry=this.parseCoords[obj.type.toLowerCase()].apply(this,[obj.coordinates]);}catch(err){throw err;}}
+if(this.internalProjection&&this.externalProjection&&!collection){geometry.transform(this.externalProjection,this.internalProjection);}
+return geometry;},parseCoords:{"point":function(array){if(this.ignoreExtraDims==false&&array.length!=2){throw"Only 2D points are supported: "+array;}
+return new OpenLayers.Geometry.Point(array[0],array[1]);},"multipoint":function(array){var points=[];var p=null;for(var i=0,len=array.length;i<len;++i){try{p=this.parseCoords["point"].apply(this,[array[i]]);}catch(err){throw err;}
+points.push(p);}
+return new OpenLayers.Geometry.MultiPoint(points);},"linestring":function(array){var points=[];var p=null;for(var i=0,len=array.length;i<len;++i){try{p=this.parseCoords["point"].apply(this,[array[i]]);}catch(err){throw err;}
+points.push(p);}
+return new OpenLayers.Geometry.LineString(points);},"multilinestring":function(array){var lines=[];var l=null;for(var i=0,len=array.length;i<len;++i){try{l=this.parseCoords["linestring"].apply(this,[array[i]]);}catch(err){throw err;}
+lines.push(l);}
+return new OpenLayers.Geometry.MultiLineString(lines);},"polygon":function(array){var rings=[];var r,l;for(var i=0,len=array.length;i<len;++i){try{l=this.parseCoords["linestring"].apply(this,[array[i]]);}catch(err){throw err;}
+r=new OpenLayers.Geometry.LinearRing(l.components);rings.push(r);}
+return new OpenLayers.Geometry.Polygon(rings);},"multipolygon":function(array){var polys=[];var p=null;for(var i=0,len=array.length;i<len;++i){try{p=this.parseCoords["polygon"].apply(this,[array[i]]);}catch(err){throw err;}
+polys.push(p);}
+return new OpenLayers.Geometry.MultiPolygon(polys);},"box":function(array){if(array.length!=2){throw"GeoJSON box coordinates must have 2 elements";}
+return new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing([new OpenLayers.Geometry.Point(array[0][0],array[0][1]),new OpenLayers.Geometry.Point(array[1][0],array[0][1]),new OpenLayers.Geometry.Point(array[1][0],array[1][1]),new OpenLayers.Geometry.Point(array[0][0],array[1][1]),new OpenLayers.Geometry.Point(array[0][0],array[0][1])])]);}},write:function(obj,pretty){var geojson={"type":null};if(obj instanceof Array){geojson.type="FeatureCollection";var numFeatures=obj.length;geojson.features=new Array(numFeatures);for(var i=0;i<numFeatures;++i){var element=obj[i];if(!element instanceof OpenLayers.Feature.Vector){var msg="FeatureCollection only supports collections "+"of features: "+element;throw msg;}
+geojson.features[i]=this.extract.feature.apply(this,[element]);}}else if(obj.CLASS_NAME.indexOf("OpenLayers.Geometry")==0){geojson=this.extract.geometry.apply(this,[obj]);}else if(obj instanceof OpenLayers.Feature.Vector){geojson=this.extract.feature.apply(this,[obj]);if(obj.layer&&obj.layer.projection){geojson.crs=this.createCRSObject(obj);}}
+return OpenLayers.Format.JSON.prototype.write.apply(this,[geojson,pretty]);},createCRSObject:function(object){var proj=object.layer.projection.toString();var crs={};if(proj.match(/epsg:/i)){var code=parseInt(proj.substring(proj.indexOf(":")+1));if(code==4326){crs={"type":"OGC","properties":{"urn":"urn:ogc:def:crs:OGC:1.3:CRS84"}};}else{crs={"type":"EPSG","properties":{"code":code}};}}
+return crs;},extract:{'feature':function(feature){var geom=this.extract.geometry.apply(this,[feature.geometry]);return{"type":"Feature","id":feature.fid==null?feature.id:feature.fid,"properties":feature.attributes,"geometry":geom};},'geometry':function(geometry){if(geometry==null){return null;}
+if(this.internalProjection&&this.externalProjection){geometry=geometry.clone();geometry.transform(this.internalProjection,this.externalProjection);}
+var geometryType=geometry.CLASS_NAME.split('.')[2];var data=this.extract[geometryType.toLowerCase()].apply(this,[geometry]);var json;if(geometryType=="Collection"){json={"type":"GeometryCollection","geometries":data};}else{json={"type":geometryType,"coordinates":data};}
+return json;},'point':function(point){return[point.x,point.y];},'multipoint':function(multipoint){var array=[];for(var i=0,len=multipoint.components.length;i<len;++i){array.push(this.extract.point.apply(this,[multipoint.components[i]]));}
+return array;},'linestring':function(linestring){var array=[];for(var i=0,len=linestring.components.length;i<len;++i){array.push(this.extract.point.apply(this,[linestring.components[i]]));}
+return array;},'multilinestring':function(multilinestring){var array=[];for(var i=0,len=multilinestring.components.length;i<len;++i){array.push(this.extract.linestring.apply(this,[multilinestring.components[i]]));}
+return array;},'polygon':function(polygon){var array=[];for(var i=0,len=polygon.components.length;i<len;++i){array.push(this.extract.linestring.apply(this,[polygon.components[i]]));}
+return array;},'multipolygon':function(multipolygon){var array=[];for(var i=0,len=multipolygon.components.length;i<len;++i){array.push(this.extract.polygon.apply(this,[multipolygon.components[i]]));}
+return array;},'collection':function(collection){var len=collection.components.length;var array=new Array(len);for(var i=0;i<len;++i){array[i]=this.extract.geometry.apply(this,[collection.components[i]]);}
+return array;}},CLASS_NAME:"OpenLayers.Format.GeoJSON"});OpenLayers.Format.ArcXML.Features=OpenLayers.Class(OpenLayers.Format.XML,{initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){var axl=new OpenLayers.Format.ArcXML();var parsed=axl.read(data);return parsed.features.feature;}});if(!OpenLayers.Format.GML){OpenLayers.Format.GML={};}
+OpenLayers.Format.GML.Base=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{gml:"http://www.opengis.net/gml",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance",wfs:"http://www.opengis.net/wfs"},defaultPrefix:"gml",schemaLocation:null,featureType:null,featureNS:null,geometryName:"geometry",extractAttributes:true,srsName:null,xy:true,geometryTypes:null,singleFeatureType:null,regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.setGeometryTypes();if(options&&options.featureNS){this.setNamespace("feature",options.featureNS);}
+this.singleFeatureType=!options||(typeof options.featureType==="string");},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var features=[];this.readNode(data,{features:features});if(features.length==0){var elements=this.getElementsByTagNameNS(data,this.namespaces.gml,"featureMember");if(elements.length){for(var i=0,len=elements.length;i<len;++i){this.readNode(elements[i],{features:features});}}else{var elements=this.getElementsByTagNameNS(data,this.namespaces.gml,"featureMembers");if(elements.length){this.readNode(elements[0],{features:features});}}}
+return features;},readers:{"gml":{"featureMember":function(node,obj){this.readChildNodes(node,obj);},"featureMembers":function(node,obj){this.readChildNodes(node,obj);},"name":function(node,obj){obj.name=this.getChildValue(node);},"boundedBy":function(node,obj){var container={};this.readChildNodes(node,container);if(container.components&&container.components.length>0){obj.bounds=container.components[0];}},"Point":function(node,container){var obj={points:[]};this.readChildNodes(node,obj);if(!container.components){container.components=[];}
+container.components.push(obj.points[0]);},"coordinates":function(node,obj){var str=this.getChildValue(node).replace(this.regExes.trimSpace,"");str=str.replace(this.regExes.trimComma,",");var pointList=str.split(this.regExes.splitSpace);var coords;var numPoints=pointList.length;var points=new Array(numPoints);for(var i=0;i<numPoints;++i){coords=pointList[i].split(",");if(this.xy){points[i]=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{points[i]=new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]);}}
+obj.points=points;},"coord":function(node,obj){var coord={};this.readChildNodes(node,coord);if(!obj.points){obj.points=[];}
+obj.points.push(new OpenLayers.Geometry.Point(coord.x,coord.y,coord.z));},"X":function(node,coord){coord.x=this.getChildValue(node);},"Y":function(node,coord){coord.y=this.getChildValue(node);},"Z":function(node,coord){coord.z=this.getChildValue(node);},"MultiPoint":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);container.components=[new OpenLayers.Geometry.MultiPoint(obj.components)];},"pointMember":function(node,obj){this.readChildNodes(node,obj);},"LineString":function(node,container){var obj={};this.readChildNodes(node,obj);if(!container.components){container.components=[];}
+container.components.push(new OpenLayers.Geometry.LineString(obj.points));},"MultiLineString":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);container.components=[new OpenLayers.Geometry.MultiLineString(obj.components)];},"lineStringMember":function(node,obj){this.readChildNodes(node,obj);},"Polygon":function(node,container){var obj={outer:null,inner:[]};this.readChildNodes(node,obj);obj.inner.unshift(obj.outer);if(!container.components){container.components=[];}
+container.components.push(new OpenLayers.Geometry.Polygon(obj.inner));},"LinearRing":function(node,obj){var container={};this.readChildNodes(node,container);obj.components=[new OpenLayers.Geometry.LinearRing(container.points)];},"MultiPolygon":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);container.components=[new OpenLayers.Geometry.MultiPolygon(obj.components)];},"polygonMember":function(node,obj){this.readChildNodes(node,obj);},"GeometryCollection":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);container.components=[new OpenLayers.Geometry.Collection(obj.components)];},"geometryMember":function(node,obj){this.readChildNodes(node,obj);}},"feature":{"*":function(node,obj){var name;var local=node.localName||node.nodeName.split(":").pop();if(obj.features){if(!this.singleFeatureType&&(OpenLayers.Util.indexOf(this.featureType,local)!==-1)){name="_typeName";}else if(local===this.featureType){name="_typeName";}}else{if(node.childNodes.length==0||(node.childNodes.length==1&&node.firstChild.nodeType==3)){if(this.extractAttributes){name="_attribute";}}else{name="_geometry";}}
+if(name){this.readers.feature[name].apply(this,[node,obj]);}},"_typeName":function(node,obj){var container={components:[],attributes:{}};this.readChildNodes(node,container);if(container.name){container.attributes.name=container.name;}
+var feature=new OpenLayers.Feature.Vector(container.components[0],container.attributes);if(!this.singleFeatureType){feature.type=node.nodeName.split(":").pop();feature.namespace=node.namespaceURI;}
+var fid=node.getAttribute("fid")||this.getAttributeNS(node,this.namespaces["gml"],"id");if(fid){feature.fid=fid;}
+if(this.internalProjection&&this.externalProjection&&feature.geometry){feature.geometry.transform(this.externalProjection,this.internalProjection);}
+if(container.bounds){feature.bounds=container.bounds;}
+obj.features.push(feature);},"_geometry":function(node,obj){this.readChildNodes(node,obj);},"_attribute":function(node,obj){var local=node.localName||node.nodeName.split(":").pop();var value=this.getChildValue(node);obj.attributes[local]=value;}},"wfs":{"FeatureCollection":function(node,obj){this.readChildNodes(node,obj);}}},write:function(features){var name;if(features instanceof Array){name="featureMembers";}else{name="featureMember";}
+var root=this.writeNode("gml:"+name,features);this.setAttributeNS(root,this.namespaces["xsi"],"xsi:schemaLocation",this.schemaLocation);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},writers:{"gml":{"featureMember":function(feature){var node=this.createElementNSPlus("gml:featureMember");this.writeNode("feature:_typeName",feature,node);return node;},"MultiPoint":function(geometry){var node=this.createElementNSPlus("gml:MultiPoint");for(var i=0;i<geometry.components.length;++i){this.writeNode("pointMember",geometry.components[i],node);}
+return node;},"pointMember":function(geometry){var node=this.createElementNSPlus("gml:pointMember");this.writeNode("Point",geometry,node);return node;},"MultiLineString":function(geometry){var node=this.createElementNSPlus("gml:MultiLineString");for(var i=0;i<geometry.components.length;++i){this.writeNode("lineStringMember",geometry.components[i],node);}
+return node;},"lineStringMember":function(geometry){var node=this.createElementNSPlus("gml:lineStringMember");this.writeNode("LineString",geometry,node);return node;},"MultiPolygon":function(geometry){var node=this.createElementNSPlus("gml:MultiPolygon");for(var i=0;i<geometry.components.length;++i){this.writeNode("polygonMember",geometry.components[i],node);}
+return node;},"polygonMember":function(geometry){var node=this.createElementNSPlus("gml:polygonMember");this.writeNode("Polygon",geometry,node);return node;},"GeometryCollection":function(geometry){var node=this.createElementNSPlus("gml:GeometryCollection");for(var i=0,len=geometry.components.length;i<len;++i){this.writeNode("geometryMember",geometry.components[i],node);}
+return node;},"geometryMember":function(geometry){var node=this.createElementNSPlus("gml:geometryMember");var child=this.writeNode("feature:_geometry",geometry);node.appendChild(child.firstChild);return node;}},"feature":{"_typeName":function(feature){var node=this.createElementNSPlus("feature:"+this.featureType,{attributes:{fid:feature.fid}});if(feature.geometry){this.writeNode("feature:_geometry",feature.geometry,node);}
+for(var name in feature.attributes){var value=feature.attributes[name];if(value!=null){this.writeNode("feature:_attribute",{name:name,value:value},node);}}
+return node;},"_geometry":function(geometry){if(this.externalProjection&&this.internalProjection){geometry=geometry.clone().transform(this.internalProjection,this.externalProjection);}
+var node=this.createElementNSPlus("feature:"+this.geometryName);var type=this.geometryTypes[geometry.CLASS_NAME];var child=this.writeNode("gml:"+type,geometry,node);if(this.srsName){child.setAttribute("srsName",this.srsName);}
+return node;},"_attribute":function(obj){return this.createElementNSPlus("feature:"+obj.name,{value:obj.value});}},"wfs":{"FeatureCollection":function(features){var node=this.createElementNSPlus("wfs:FeatureCollection");for(var i=0,len=features.length;i<len;++i){this.writeNode("gml:featureMember",features[i],node);}
+return node;}}},setGeometryTypes:function(){this.geometryTypes={"OpenLayers.Geometry.Point":"Point","OpenLayers.Geometry.MultiPoint":"MultiPoint","OpenLayers.Geometry.LineString":"LineString","OpenLayers.Geometry.MultiLineString":"MultiLineString","OpenLayers.Geometry.Polygon":"Polygon","OpenLayers.Geometry.MultiPolygon":"MultiPolygon","OpenLayers.Geometry.Collection":"GeometryCollection"};},CLASS_NAME:"OpenLayers.Format.GML.Base"});OpenLayers.Format.WFS=OpenLayers.Class(OpenLayers.Format.GML,{layer:null,wfsns:"http://www.opengis.net/wfs",ogcns:"http://www.opengis.net/ogc",initialize:function(options,layer){OpenLayers.Format.GML.prototype.initialize.apply(this,[options]);this.layer=layer;if(this.layer.featureNS){this.featureNS=this.layer.featureNS;}
+if(this.layer.options.geometry_column){this.geometryName=this.layer.options.geometry_column;}
+if(this.layer.options.typename){this.featureName=this.layer.options.typename;}},write:function(features){var transaction=this.createElementNS(this.wfsns,'wfs:Transaction');transaction.setAttribute("version","1.0.0");transaction.setAttribute("service","WFS");for(var i=0;i<features.length;i++){switch(features[i].state){case OpenLayers.State.INSERT:transaction.appendChild(this.insert(features[i]));break;case OpenLayers.State.UPDATE:transaction.appendChild(this.update(features[i]));break;case OpenLayers.State.DELETE:transaction.appendChild(this.remove(features[i]));break;}}
+return OpenLayers.Format.XML.prototype.write.apply(this,[transaction]);},createFeatureXML:function(feature){var geometryNode=this.buildGeometryNode(feature.geometry);var geomContainer=this.createElementNS(this.featureNS,"feature:"+this.geometryName);geomContainer.appendChild(geometryNode);var featureContainer=this.createElementNS(this.featureNS,"feature:"+this.featureName);featureContainer.appendChild(geomContainer);for(var attr in feature.attributes){var attrText=this.createTextNode(feature.attributes[attr]);var nodename=attr;if(attr.search(":")!=-1){nodename=attr.split(":")[1];}
+var attrContainer=this.createElementNS(this.featureNS,"feature:"+nodename);attrContainer.appendChild(attrText);featureContainer.appendChild(attrContainer);}
+return featureContainer;},insert:function(feature){var insertNode=this.createElementNS(this.wfsns,'wfs:Insert');insertNode.appendChild(this.createFeatureXML(feature));return insertNode;},update:function(feature){if(!feature.fid){OpenLayers.Console.userError(OpenLayers.i18n("noFID"));}
+var updateNode=this.createElementNS(this.wfsns,'wfs:Update');updateNode.setAttribute("typeName",this.featurePrefix+':'+this.featureName);updateNode.setAttribute("xmlns:"+this.featurePrefix,this.featureNS);var propertyNode=this.createElementNS(this.wfsns,'wfs:Property');var nameNode=this.createElementNS(this.wfsns,'wfs:Name');var txtNode=this.createTextNode(this.geometryName);nameNode.appendChild(txtNode);propertyNode.appendChild(nameNode);var valueNode=this.createElementNS(this.wfsns,'wfs:Value');var geometryNode=this.buildGeometryNode(feature.geometry);if(feature.layer){geometryNode.setAttribute("srsName",feature.layer.projection.getCode());}
+valueNode.appendChild(geometryNode);propertyNode.appendChild(valueNode);updateNode.appendChild(propertyNode);for(var propName in feature.attributes){propertyNode=this.createElementNS(this.wfsns,'wfs:Property');nameNode=this.createElementNS(this.wfsns,'wfs:Name');nameNode.appendChild(this.createTextNode(propName));propertyNode.appendChild(nameNode);valueNode=this.createElementNS(this.wfsns,'wfs:Value');valueNode.appendChild(this.createTextNode(feature.attributes[propName]));propertyNode.appendChild(valueNode);updateNode.appendChild(propertyNode);}
+var filterNode=this.createElementNS(this.ogcns,'ogc:Filter');var filterIdNode=this.createElementNS(this.ogcns,'ogc:FeatureId');filterIdNode.setAttribute("fid",feature.fid);filterNode.appendChild(filterIdNode);updateNode.appendChild(filterNode);return updateNode;},remove:function(feature){if(!feature.fid){OpenLayers.Console.userError(OpenLayers.i18n("noFID"));return false;}
+var deleteNode=this.createElementNS(this.wfsns,'wfs:Delete');deleteNode.setAttribute("typeName",this.featurePrefix+':'+this.featureName);deleteNode.setAttribute("xmlns:"+this.featurePrefix,this.featureNS);var filterNode=this.createElementNS(this.ogcns,'ogc:Filter');var filterIdNode=this.createElementNS(this.ogcns,'ogc:FeatureId');filterIdNode.setAttribute("fid",feature.fid);filterNode.appendChild(filterIdNode);deleteNode.appendChild(filterNode);return deleteNode;},destroy:function(){this.layer=null;},CLASS_NAME:"OpenLayers.Format.WFS"});OpenLayers.Layer.ArcIMS=OpenLayers.Class(OpenLayers.Layer.Grid,{DEFAULT_PARAMS:{ClientVersion:"9.2",ServiceName:''},tileSize:null,featureCoordSys:"4326",filterCoordSys:"4326",layers:null,async:true,name:"ArcIMS",isBaseLayer:true,DEFAULT_OPTIONS:{tileSize:new OpenLayers.Size(512,512),featureCoordSys:"4326",filterCoordSys:"4326",layers:null,isBaseLayer:true,async:true,name:"ArcIMS"},initialize:function(name,url,options){this.tileSize=new OpenLayers.Size(512,512);this.params=OpenLayers.Util.applyDefaults({ServiceName:options.serviceName},this.DEFAULT_PARAMS);this.options=OpenLayers.Util.applyDefaults(options,this.DEFAULT_OPTIONS);OpenLayers.Layer.Grid.prototype.initialize.apply(this,[name,url,this.params,options]);if(this.transparent){if(!this.isBaseLayer){this.isBaseLayer=false;}
+if(this.format=="image/jpeg"){this.format=OpenLayers.Util.alphaHack()?"image/gif":"image/png";}}
+if(this.options.layers===null){this.options.layers=[];}},destroy:function(){OpenLayers.Layer.Grid.prototype.destroy.apply(this,arguments);},getURL:function(bounds){var url="";bounds=this.adjustBounds(bounds);var axlReq=new OpenLayers.Format.ArcXML(OpenLayers.Util.extend(this.options,{requesttype:"image",envelope:bounds.toArray(),tileSize:this.tileSize}));var req=new OpenLayers.Request.POST({url:this.getFullRequestString(),data:axlReq.write(),async:false});if(req!=null){var doc=req.responseXML;if(!doc||!doc.documentElement){doc=req.responseText;}
+var axlResp=new OpenLayers.Format.ArcXML();var arcxml=axlResp.read(doc);url=this.getUrlOrImage(arcxml.image.output);}
+return url;},getURLasync:function(bounds,scope,prop,callback){bounds=this.adjustBounds(bounds);var axlReq=new OpenLayers.Format.ArcXML(OpenLayers.Util.extend(this.options,{requesttype:"image",envelope:bounds.toArray(),tileSize:this.tileSize}));OpenLayers.Request.POST({url:this.getFullRequestString(),async:true,data:axlReq.write(),callback:function(req){var doc=req.responseXML;if(!doc||!doc.documentElement){doc=req.responseText;}
+var axlResp=new OpenLayers.Format.ArcXML();var arcxml=axlResp.read(doc);scope[prop]=this.getUrlOrImage(arcxml.image.output);callback.apply(scope);},scope:this});},getUrlOrImage:function(output){var ret="";if(output.url){ret=output.url;}else if(output.data){ret="data:image/"+output.type+";base64,"+output.data;}
+return ret;},setLayerQuery:function(id,querydef){for(var lyr=0;lyr<this.options.layers.length;lyr++){if(id==this.options.layers[lyr].id){this.options.layers[lyr].query=querydef;return;}}
+this.options.layers.push({id:id,visible:true,query:querydef});},getFeatureInfo:function(geometry,layer,options){var buffer=options.buffer||1;var callback=options.callback||function(){};var scope=options.scope||window;var requestOptions={};OpenLayers.Util.extend(requestOptions,this.options);requestOptions.requesttype="feature";if(geometry instanceof OpenLayers.LonLat){requestOptions.polygon=null;requestOptions.envelope=[geometry.lon-buffer,geometry.lat-buffer,geometry.lon+buffer,geometry.lat+buffer];}else if(geometry instanceof OpenLayers.Geometry.Polygon){requestOptions.envelope=null;requestOptions.polygon=geometry;}
+var arcxml=new OpenLayers.Format.ArcXML(requestOptions);OpenLayers.Util.extend(arcxml.request.get_feature,options);arcxml.request.get_feature.layer=layer.id;if(typeof layer.query.accuracy=="number"){arcxml.request.get_feature.query.accuracy=layer.query.accuracy;}else{var mapCenter=this.map.getCenter();var viewPx=this.map.getViewPortPxFromLonLat(mapCenter);viewPx.x++;var mapOffCenter=this.map.getLonLatFromPixel(viewPx);arcxml.request.get_feature.query.accuracy=mapOffCenter.lon-mapCenter.lon;}
+arcxml.request.get_feature.query.where=layer.query.where;arcxml.request.get_feature.query.spatialfilter.relation="area_intersection";OpenLayers.Request.POST({url:this.getFullRequestString({'CustomService':'Query'}),data:arcxml.write(),callback:function(request){var response=arcxml.parseResponse(request.responseText);if(!arcxml.iserror()){callback.call(scope,response.features);}else{callback.call(scope,null);}}});},clone:function(obj){if(obj==null){obj=new OpenLayers.Layer.ArcIMS(this.name,this.url,this.getOptions());}
+obj=OpenLayers.Layer.Grid.prototype.clone.apply(this,[obj]);return obj;},addTile:function(bounds,position){return new OpenLayers.Tile.Image(this,position,bounds,null,this.tileSize);},CLASS_NAME:"OpenLayers.Layer.ArcIMS"});OpenLayers.Format.GML.v2=OpenLayers.Class(OpenLayers.Format.GML.Base,{schemaLocation:"http://www.opengis.net/gml http://schemas.opengis.net/gml/2.1.2/feature.xsd",initialize:function(options){OpenLayers.Format.GML.Base.prototype.initialize.apply(this,[options]);},readers:{"gml":OpenLayers.Util.applyDefaults({"outerBoundaryIs":function(node,container){var obj={};this.readChildNodes(node,obj);container.outer=obj.components[0];},"innerBoundaryIs":function(node,container){var obj={};this.readChildNodes(node,obj);container.inner.push(obj.components[0]);},"Box":function(node,container){var obj={};this.readChildNodes(node,obj);if(!container.components){container.components=[];}
+var min=obj.points[0];var max=obj.points[1];container.components.push(new OpenLayers.Bounds(min.x,min.y,max.x,max.y));}},OpenLayers.Format.GML.Base.prototype.readers["gml"]),"feature":OpenLayers.Format.GML.Base.prototype.readers["feature"],"wfs":OpenLayers.Format.GML.Base.prototype.readers["wfs"]},write:function(features){var name;if(features instanceof Array){name="wfs:FeatureCollection";}else{name="gml:featureMember";}
+var root=this.writeNode(name,features);this.setAttributeNS(root,this.namespaces["xsi"],"xsi:schemaLocation",this.schemaLocation);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},writers:{"gml":OpenLayers.Util.applyDefaults({"Point":function(geometry){var node=this.createElementNSPlus("gml:Point");this.writeNode("coordinates",[geometry],node);return node;},"coordinates":function(points){var numPoints=points.length;var parts=new Array(numPoints);var point;for(var i=0;i<numPoints;++i){point=points[i];if(this.xy){parts[i]=point.x+","+point.y;}else{parts[i]=point.y+","+point.x;}
+if(point.z!=undefined){parts[i]+=","+point.z;}}
+return this.createElementNSPlus("gml:coordinates",{attributes:{decimal:".",cs:",",ts:" "},value:(numPoints==1)?parts[0]:parts.join(" ")});},"LineString":function(geometry){var node=this.createElementNSPlus("gml:LineString");this.writeNode("coordinates",geometry.components,node);return node;},"Polygon":function(geometry){var node=this.createElementNSPlus("gml:Polygon");this.writeNode("outerBoundaryIs",geometry.components[0],node);for(var i=1;i<geometry.components.length;++i){this.writeNode("innerBoundaryIs",geometry.components[i],node);}
+return node;},"outerBoundaryIs":function(ring){var node=this.createElementNSPlus("gml:outerBoundaryIs");this.writeNode("LinearRing",ring,node);return node;},"innerBoundaryIs":function(ring){var node=this.createElementNSPlus("gml:innerBoundaryIs");this.writeNode("LinearRing",ring,node);return node;},"LinearRing":function(ring){var node=this.createElementNSPlus("gml:LinearRing");this.writeNode("coordinates",ring.components,node);return node;},"Box":function(bounds){var node=this.createElementNSPlus("gml:Box");this.writeNode("coordinates",[{x:bounds.left,y:bounds.bottom},{x:bounds.right,y:bounds.top}],node);if(this.srsName){node.setAttribute("srsName",this.srsName);}
+return node;}},OpenLayers.Format.GML.Base.prototype.writers["gml"]),"feature":OpenLayers.Format.GML.Base.prototype.writers["feature"],"wfs":OpenLayers.Format.GML.Base.prototype.writers["wfs"]},CLASS_NAME:"OpenLayers.Format.GML.v2"});OpenLayers.Format.GML.v3=OpenLayers.Class(OpenLayers.Format.GML.Base,{schemaLocation:"http://www.opengis.net/gml http://schemas.opengis.net/gml/3.1.1/profiles/gmlsfProfile/1.0.0/gmlsf.xsd",curve:false,multiCurve:true,surface:false,multiSurface:true,initialize:function(options){OpenLayers.Format.GML.Base.prototype.initialize.apply(this,[options]);},readers:{"gml":OpenLayers.Util.applyDefaults({"featureMembers":function(node,obj){this.readChildNodes(node,obj);},"Curve":function(node,container){var obj={points:[]};this.readChildNodes(node,obj);if(!container.components){container.components=[];}
+container.components.push(new OpenLayers.Geometry.LineString(obj.points));},"segments":function(node,obj){this.readChildNodes(node,obj);},"LineStringSegment":function(node,container){var obj={};this.readChildNodes(node,obj);if(obj.points){Array.prototype.push.apply(container.points,obj.points);}},"pos":function(node,obj){var str=this.getChildValue(node).replace(this.regExes.trimSpace,"");var coords=str.split(this.regExes.splitSpace);var point;if(this.xy){point=new OpenLayers.Geometry.Point(coords[0],coords[1],coords[2]);}else{point=new OpenLayers.Geometry.Point(coords[1],coords[0],coords[2]);}
+obj.points=[point];},"posList":function(node,obj){var str=this.getChildValue(node).replace(this.regExes.trimSpace,"");var coords=str.split(this.regExes.splitSpace);var dim=parseInt(node.getAttribute("dimension"))||2;var j,x,y,z;var numPoints=coords.length/dim;var points=new Array(numPoints);for(var i=0,len=coords.length;i<len;i+=dim){x=coords[i];y=coords[i+1];z=(dim==2)?undefined:coords[i+2];if(this.xy){points[i/dim]=new OpenLayers.Geometry.Point(x,y,z);}else{points[i/dim]=new OpenLayers.Geometry.Point(y,x,z);}}
+obj.points=points;},"Surface":function(node,obj){this.readChildNodes(node,obj);},"patches":function(node,obj){this.readChildNodes(node,obj);},"PolygonPatch":function(node,obj){this.readers.gml.Polygon.apply(this,[node,obj]);},"exterior":function(node,container){var obj={};this.readChildNodes(node,obj);container.outer=obj.components[0];},"interior":function(node,container){var obj={};this.readChildNodes(node,obj);container.inner.push(obj.components[0]);},"MultiCurve":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);if(obj.components.length>0){container.components=[new OpenLayers.Geometry.MultiLineString(obj.components)];}},"curveMember":function(node,obj){this.readChildNodes(node,obj);},"MultiSurface":function(node,container){var obj={components:[]};this.readChildNodes(node,obj);if(obj.components.length>0){container.components=[new OpenLayers.Geometry.MultiPolygon(obj.components)];}},"surfaceMember":function(node,obj){this.readChildNodes(node,obj);},"surfaceMembers":function(node,obj){this.readChildNodes(node,obj);},"pointMembers":function(node,obj){this.readChildNodes(node,obj);},"lineStringMembers":function(node,obj){this.readChildNodes(node,obj);},"polygonMembers":function(node,obj){this.readChildNodes(node,obj);},"geometryMembers":function(node,obj){this.readChildNodes(node,obj);},"Envelope":function(node,container){var obj={points:new Array(2)};this.readChildNodes(node,obj);if(!container.components){container.components=[];}
+var min=obj.points[0];var max=obj.points[1];container.components.push(new OpenLayers.Bounds(min.x,min.y,max.x,max.y));},"lowerCorner":function(node,container){var obj={};this.readers.gml.pos.apply(this,[node,obj]);container.points[0]=obj.points[0];},"upperCorner":function(node,container){var obj={};this.readers.gml.pos.apply(this,[node,obj]);container.points[1]=obj.points[0];}},OpenLayers.Format.GML.Base.prototype.readers["gml"]),"feature":OpenLayers.Format.GML.Base.prototype.readers["feature"],"wfs":OpenLayers.Format.GML.Base.prototype.readers["wfs"]},write:function(features){var name;if(features instanceof Array){name="featureMembers";}else{name="featureMember";}
+var root=this.writeNode("gml:"+name,features);this.setAttributeNS(root,this.namespaces["xsi"],"xsi:schemaLocation",this.schemaLocation);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},writers:{"gml":OpenLayers.Util.applyDefaults({"featureMembers":function(features){var node=this.createElementNSPlus("gml:featureMembers");for(var i=0,len=features.length;i<len;++i){this.writeNode("feature:_typeName",features[i],node);}
+return node;},"Point":function(geometry){var node=this.createElementNSPlus("gml:Point");this.writeNode("pos",geometry,node);return node;},"pos":function(point){var pos=(this.xy)?(point.x+" "+point.y):(point.y+" "+point.x);return this.createElementNSPlus("gml:pos",{value:pos});},"LineString":function(geometry){var node=this.createElementNSPlus("gml:LineString");this.writeNode("posList",geometry.components,node);return node;},"Curve":function(geometry){var node=this.createElementNSPlus("gml:Curve");this.writeNode("segments",geometry,node);return node;},"segments":function(geometry){var node=this.createElementNSPlus("gml:segments");this.writeNode("LineStringSegment",geometry,node);return node;},"LineStringSegment":function(geometry){var node=this.createElementNSPlus("gml:LineStringSegment");this.writeNode("posList",geometry.components,node);return node;},"posList":function(points){var len=points.length;var parts=new Array(len);var point;for(var i=0;i<len;++i){point=points[i];if(this.xy){parts[i]=point.x+" "+point.y;}else{parts[i]=point.y+" "+point.x;}}
+return this.createElementNSPlus("gml:posList",{value:parts.join(" ")});},"Surface":function(geometry){var node=this.createElementNSPlus("gml:Surface");this.writeNode("patches",geometry,node);return node;},"patches":function(geometry){var node=this.createElementNSPlus("gml:patches");this.writeNode("PolygonPatch",geometry,node);return node;},"PolygonPatch":function(geometry){var node=this.createElementNSPlus("gml:PolygonPatch",{attributes:{interpolation:"planar"}});this.writeNode("exterior",geometry.components[0],node);for(var i=1,len=geometry.components.length;i<len;++i){this.writeNode("interior",geometry.components[i],node);}
+return node;},"Polygon":function(geometry){var node=this.createElementNSPlus("gml:Polygon");this.writeNode("exterior",geometry.components[0],node);for(var i=1,len=geometry.components.length;i<len;++i){this.writeNode("interior",geometry.components[i],node);}
+return node;},"exterior":function(ring){var node=this.createElementNSPlus("gml:exterior");this.writeNode("LinearRing",ring,node);return node;},"interior":function(ring){var node=this.createElementNSPlus("gml:interior");this.writeNode("LinearRing",ring,node);return node;},"LinearRing":function(ring){var node=this.createElementNSPlus("gml:LinearRing");this.writeNode("posList",ring.components,node);return node;},"MultiCurve":function(geometry){var node=this.createElementNSPlus("gml:MultiCurve");for(var i=0,len=geometry.components.length;i<len;++i){this.writeNode("curveMember",geometry.components[i],node);}
+return node;},"curveMember":function(geometry){var node=this.createElementNSPlus("gml:curveMember");if(this.curve){this.writeNode("Curve",geometry,node);}else{this.writeNode("LineString",geometry,node);}
+return node;},"MultiSurface":function(geometry){var node=this.createElementNSPlus("gml:MultiSurface");for(var i=0,len=geometry.components.length;i<len;++i){this.writeNode("surfaceMember",geometry.components[i],node);}
+return node;},"surfaceMember":function(polygon){var node=this.createElementNSPlus("gml:surfaceMember");if(this.surface){this.writeNode("Surface",polygon,node);}else{this.writeNode("Polygon",polygon,node);}
+return node;},"Envelope":function(bounds){var node=this.createElementNSPlus("gml:Envelope");this.writeNode("lowerCorner",bounds,node);this.writeNode("upperCorner",bounds,node);if(this.srsName){node.setAttribute("srsName",this.srsName);}
+return node;},"lowerCorner":function(bounds){var pos=(this.xy)?(bounds.left+" "+bounds.bottom):(bounds.bottom+" "+bounds.left);return this.createElementNSPlus("gml:lowerCorner",{value:pos});},"upperCorner":function(bounds){var pos=(this.xy)?(bounds.right+" "+bounds.top):(bounds.top+" "+bounds.right);return this.createElementNSPlus("gml:upperCorner",{value:pos});}},OpenLayers.Format.GML.Base.prototype.writers["gml"]),"feature":OpenLayers.Format.GML.Base.prototype.writers["feature"],"wfs":OpenLayers.Format.GML.Base.prototype.writers["wfs"]},setGeometryTypes:function(){this.geometryTypes={"OpenLayers.Geometry.Point":"Point","OpenLayers.Geometry.MultiPoint":"MultiPoint","OpenLayers.Geometry.LineString":(this.curve===true)?"Curve":"LineString","OpenLayers.Geometry.MultiLineString":(this.multiCurve===false)?"MultiLineString":"MultiCurve","OpenLayers.Geometry.Polygon":(this.surface===true)?"Surface":"Polygon","OpenLayers.Geometry.MultiPolygon":(this.multiSurface===false)?"MultiPolygon":"MultiSurface","OpenLayers.Geometry.Collection":"GeometryCollection"};},CLASS_NAME:"OpenLayers.Format.GML.v3"});OpenLayers.Format.Atom=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{atom:"http://www.w3.org/2005/Atom",georss:"http://www.georss.org/georss"},feedTitle:"untitled",defaultEntryTitle:"untitled",gmlParser:null,xy:false,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(doc){if(typeof doc=="string"){doc=OpenLayers.Format.XML.prototype.read.apply(this,[doc]);}
+return this.parseFeatures(doc);},write:function(features){var doc;if(features instanceof Array){doc=this.createElementNSPlus("atom:feed");doc.appendChild(this.createElementNSPlus("atom:title",{value:this.feedTitle}));for(var i=0,ii=features.length;i<ii;i++){doc.appendChild(this.buildEntryNode(features[i]));}}
+else{doc=this.buildEntryNode(features);}
+return OpenLayers.Format.XML.prototype.write.apply(this,[doc]);},buildContentNode:function(content){var node=this.createElementNSPlus("atom:content",{attributes:{type:content.type||null}});if(content.src){node.setAttribute("src",content.src);}else{if(content.type=="text"||content.type==null){node.appendChild(this.createTextNode(content.value));}else if(content.type=="html"){if(typeof content.value!="string"){throw"HTML content must be in form of an escaped string";}
+node.appendChild(this.createTextNode(content.value));}else if(content.type=="xhtml"){node.appendChild(content.value);}else if(content.type=="xhtml"||content.type.match(/(\+|\/)xml$/)){node.appendChild(content.value);}
+else{node.appendChild(this.createTextNode(content.value));}}
+return node;},buildEntryNode:function(feature){var attrib=feature.attributes;var atomAttrib=attrib.atom||{};var entryNode=this.createElementNSPlus("atom:entry");if(atomAttrib.authors){var authors=atomAttrib.authors instanceof Array?atomAttrib.authors:[atomAttrib.authors];for(var i=0,ii=authors.length;i<ii;i++){entryNode.appendChild(this.buildPersonConstructNode("author",authors[i]));}}
+if(atomAttrib.categories){var categories=atomAttrib.categories instanceof Array?atomAttrib.categories:[atomAttrib.categories];var category;for(var i=0,ii=categories.length;i<ii;i++){category=categories[i];entryNode.appendChild(this.createElementNSPlus("atom:category",{attributes:{term:category.term,scheme:category.scheme||null,label:category.label||null}}));}}
+if(atomAttrib.content){entryNode.appendChild(this.buildContentNode(atomAttrib.content));}
+if(atomAttrib.contributors){var contributors=atomAttrib.contributors instanceof Array?atomAttrib.contributors:[atomAttrib.contributors];for(var i=0,ii=contributors.length;i<ii;i++){entryNode.appendChild(this.buildPersonConstructNode("contributor",contributors[i]));}}
+if(feature.fid){entryNode.appendChild(this.createElementNSPlus("atom:id",{value:feature.fid}));}
+if(atomAttrib.links){var links=atomAttrib.links instanceof Array?atomAttrib.links:[atomAttrib.links];var link;for(var i=0,ii=links.length;i<ii;i++){link=links[i];entryNode.appendChild(this.createElementNSPlus("atom:link",{attributes:{href:link.href,rel:link.rel||null,type:link.type||null,hreflang:link.hreflang||null,title:link.title||null,length:link.length||null}}));}}
+if(atomAttrib.published){entryNode.appendChild(this.createElementNSPlus("atom:published",{value:atomAttrib.published}));}
+if(atomAttrib.rights){entryNode.appendChild(this.createElementNSPlus("atom:rights",{value:atomAttrib.rights}));}
+if(atomAttrib.summary||attrib.description){entryNode.appendChild(this.createElementNSPlus("atom:summary",{value:atomAttrib.summary||attrib.description}));}
+entryNode.appendChild(this.createElementNSPlus("atom:title",{value:atomAttrib.title||attrib.title||this.defaultEntryTitle}));if(atomAttrib.updated){entryNode.appendChild(this.createElementNSPlus("atom:updated",{value:atomAttrib.updated}));}
+if(feature.geometry){var whereNode=this.createElementNSPlus("georss:where");whereNode.appendChild(this.buildGeometryNode(feature.geometry));entryNode.appendChild(whereNode);}
+return entryNode;},initGmlParser:function(){this.gmlParser=new OpenLayers.Format.GML.v3({xy:this.xy,featureNS:"http://example.com#feature",internalProjection:this.internalProjection,externalProjection:this.externalProjection});},buildGeometryNode:function(geometry){if(!this.gmlParser){this.initGmlParser();}
+var node=this.gmlParser.writeNode("feature:_geometry",geometry);return node.firstChild;},buildPersonConstructNode:function(name,value){var oNames=["uri","email"];var personNode=this.createElementNSPlus("atom:"+name);personNode.appendChild(this.createElementNSPlus("atom:name",{value:value.name}));for(var i=0,ii=oNames.length;i<ii;i++){if(value[oNames[i]]){personNode.appendChild(this.createElementNSPlus("atom:"+oNames[i],{value:value[oNames[i]]}));}}
+return personNode;},getFirstChildValue:function(node,nsuri,name,def){var value;var nodes=this.getElementsByTagNameNS(node,nsuri,name);if(nodes&&nodes.length>0){value=this.getChildValue(nodes[0],def);}else{value=def;}
+return value;},parseFeature:function(node){var atomAttrib={};var value=null;var nodes=null;var attval=null;var atomns=this.namespaces.atom;this.parsePersonConstructs(node,"author",atomAttrib);nodes=this.getElementsByTagNameNS(node,atomns,"category");if(nodes.length>0){atomAttrib.categories=[];}
+for(var i=0,ii=nodes.length;i<ii;i++){value={};value.term=nodes[i].getAttribute("term");attval=nodes[i].getAttribute("scheme");if(attval){value.scheme=attval;}
+attval=nodes[i].getAttribute("label");if(attval){value.label=attval;}
+atomAttrib.categories.push(value);}
+nodes=this.getElementsByTagNameNS(node,atomns,"content");if(nodes.length>0){value={};attval=nodes[0].getAttribute("type");if(attval){value.type=attval;}
+attval=nodes[0].getAttribute("src");if(attval){value.src=attval;}else{if(value.type=="text"||value.type=="html"||value.type==null){value.value=this.getFirstChildValue(node,atomns,"content",null);}else if(value.type=="xhtml"||value.type.match(/(\+|\/)xml$/)){value.value=this.getChildEl(nodes[0]);}else{value.value=this.getFirstChildValue(node,atomns,"content",null);}
+atomAttrib.content=value;}}
+this.parsePersonConstructs(node,"contributor",atomAttrib);atomAttrib.id=this.getFirstChildValue(node,atomns,"id",null);nodes=this.getElementsByTagNameNS(node,atomns,"link");if(nodes.length>0){atomAttrib.links=new Array(nodes.length);}
+var oAtts=["rel","type","hreflang","title","length"];for(var i=0,ii=nodes.length;i<ii;i++){value={};value.href=nodes[i].getAttribute("href");for(var j=0,jj=oAtts.length;j<jj;j++){attval=nodes[i].getAttribute(oAtts[j]);if(attval){value[oAtts[j]]=attval;}}
+atomAttrib.links[i]=value;}
+value=this.getFirstChildValue(node,atomns,"published",null);if(value){atomAttrib.published=value;}
+value=this.getFirstChildValue(node,atomns,"rights",null);if(value){atomAttrib.rights=value;}
+value=this.getFirstChildValue(node,atomns,"summary",null);if(value){atomAttrib.summary=value;}
+atomAttrib.title=this.getFirstChildValue(node,atomns,"title",null);atomAttrib.updated=this.getFirstChildValue(node,atomns,"updated",null);var featureAttrib={title:atomAttrib.title,description:atomAttrib.summary,atom:atomAttrib};var geometry=this.parseLocations(node)[0];var feature=new OpenLayers.Feature.Vector(geometry,featureAttrib);feature.fid=atomAttrib.id;return feature;},parseFeatures:function(node){var features=[];var entries=this.getElementsByTagNameNS(node,this.namespaces.atom,"entry");if(entries.length==0){entries=[node];}
+for(var i=0,ii=entries.length;i<ii;i++){features.push(this.parseFeature(entries[i]));}
+return features;},parseLocations:function(node){var georssns=this.namespaces.georss;var locations={components:[]};var where=this.getElementsByTagNameNS(node,georssns,"where");if(where&&where.length>0){if(!this.gmlParser){this.initGmlParser();}
+for(var i=0,ii=where.length;i<ii;i++){this.gmlParser.readChildNodes(where[i],locations);}}
+var components=locations.components;var point=this.getElementsByTagNameNS(node,georssns,"point");if(point&&point.length>0){for(var i=0,ii=point.length;i<ii;i++){var xy=OpenLayers.String.trim(point[i].firstChild.nodeValue).split(/\s+/);if(xy.length!=2){xy=OpenLayers.String.trim(point[i].firstChild.nodeValue).split(/\s*,\s*/);}
+components.push(new OpenLayers.Geometry.Point(parseFloat(xy[1]),parseFloat(xy[0])));}}
+var line=this.getElementsByTagNameNS(node,georssns,"line");if(line&&line.length>0){var coords;var p;var points;for(var i=0,ii=line.length;i<ii;i++){coords=OpenLayers.String.trim(line[i].firstChild.nodeValue).split(/\s+/);points=[];for(var j=0,jj=coords.length;j<jj;j+=2){p=new OpenLayers.Geometry.Point(parseFloat(coords[j+1]),parseFloat(coords[j]));points.push(p);}
+components.push(new OpenLayers.Geometry.LineString(points));}}
+var polygon=this.getElementsByTagNameNS(node,georssns,"polygon");if(polygon&&polygon.length>0){var coords;var p;var points;for(var i=0,ii=polygon.length;i<ii;i++){coords=OpenLayers.String.trim(polygon[i].firstChild.nodeValue).split(/\s+/);points=[];for(var j=0,jj=coords.length;j<jj;j+=2){p=new OpenLayers.Geometry.Point(parseFloat(coords[j+1]),parseFloat(coords[j]));points.push(p);}
+components.push(new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing(components)]));}}
+if(this.internalProjection&&this.externalProjection){for(var i=0,ii=components.length;i<ii;i++){if(components[i]){components[i].transform(this.externalProjection,this.internalProjection);}}}
+return components;},parsePersonConstructs:function(node,name,data){var persons=[];var atomns=this.namespaces.atom;var nodes=this.getElementsByTagNameNS(node,atomns,name);var oAtts=["uri","email"];for(var i=0,ii=nodes.length;i<ii;i++){var value={};value.name=this.getFirstChildValue(nodes[i],atomns,"name",null);for(var j=0,jj=oAtts.length;j<jj;j++){var attval=this.getFirstChildValue(nodes[i],atomns,oAtts[j],null);if(attval){value[oAtts[j]]=attval;}}
+persons.push(value);}
+if(persons.length>0){data[name+"s"]=persons;}},CLASS_NAME:"OpenLayers.Format.Atom"});OpenLayers.Format.Filter.v1_0_0=OpenLayers.Class(OpenLayers.Format.GML.v2,OpenLayers.Format.Filter.v1,{VERSION:"1.0.0",schemaLocation:"http://www.opengis.net/ogc/filter/1.0.0/filter.xsd",initialize:function(options){OpenLayers.Format.GML.v2.prototype.initialize.apply(this,[options]);},readers:{"ogc":OpenLayers.Util.applyDefaults({"PropertyIsEqualTo":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.EQUAL_TO});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsNotEqualTo":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.NOT_EQUAL_TO});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsLike":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.LIKE});this.readChildNodes(node,filter);var wildCard=node.getAttribute("wildCard");var singleChar=node.getAttribute("singleChar");var esc=node.getAttribute("escape");filter.value2regex(wildCard,singleChar,esc);obj.filters.push(filter);}},OpenLayers.Format.Filter.v1.prototype.readers["ogc"]),"gml":OpenLayers.Format.GML.v2.prototype.readers["gml"],"feature":OpenLayers.Format.GML.v2.prototype.readers["feature"]},writers:{"ogc":OpenLayers.Util.applyDefaults({"PropertyIsEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsEqualTo");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsNotEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsNotEqualTo");this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsLike":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsLike",{attributes:{wildCard:"*",singleChar:".",escape:"!"}});this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.regex2value(),node);return node;},"BBOX":function(filter){var node=this.createElementNSPlus("ogc:BBOX");this.writeNode("PropertyName",filter,node);var box=this.writeNode("gml:Box",filter.value,node);if(filter.projection){box.setAttribute("srsName",filter.projection);}
+return node;}},OpenLayers.Format.Filter.v1.prototype.writers["ogc"]),"gml":OpenLayers.Format.GML.v2.prototype.writers["gml"],"feature":OpenLayers.Format.GML.v2.prototype.writers["feature"]},writeSpatial:function(filter,name){var node=this.createElementNSPlus("ogc:"+name);this.writeNode("PropertyName",filter,node);var child;if(filter.value instanceof OpenLayers.Geometry){child=this.writeNode("feature:_geometry",filter.value).firstChild;}else{child=this.writeNode("gml:Box",filter.value);}
+if(filter.projection){child.setAttribute("srsName",filter.projection);}
+node.appendChild(child);return node;},CLASS_NAME:"OpenLayers.Format.Filter.v1_0_0"});OpenLayers.Format.Filter.v1_1_0=OpenLayers.Class(OpenLayers.Format.GML.v3,OpenLayers.Format.Filter.v1,{VERSION:"1.1.0",schemaLocation:"http://www.opengis.net/ogc/filter/1.1.0/filter.xsd",initialize:function(options){OpenLayers.Format.GML.v3.prototype.initialize.apply(this,[options]);},readers:{"ogc":OpenLayers.Util.applyDefaults({"PropertyIsEqualTo":function(node,obj){var matchCase=node.getAttribute("matchCase");var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.EQUAL_TO,matchCase:!(matchCase==="false"||matchCase==="0")});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsNotEqualTo":function(node,obj){var matchCase=node.getAttribute("matchCase");var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.NOT_EQUAL_TO,matchCase:!(matchCase==="false"||matchCase==="0")});this.readChildNodes(node,filter);obj.filters.push(filter);},"PropertyIsLike":function(node,obj){var filter=new OpenLayers.Filter.Comparison({type:OpenLayers.Filter.Comparison.LIKE});this.readChildNodes(node,filter);var wildCard=node.getAttribute("wildCard");var singleChar=node.getAttribute("singleChar");var esc=node.getAttribute("escapeChar");filter.value2regex(wildCard,singleChar,esc);obj.filters.push(filter);}},OpenLayers.Format.Filter.v1.prototype.readers["ogc"]),"gml":OpenLayers.Format.GML.v3.prototype.readers["gml"],"feature":OpenLayers.Format.GML.v3.prototype.readers["feature"]},writers:{"ogc":OpenLayers.Util.applyDefaults({"PropertyIsEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsEqualTo",{attributes:{matchCase:filter.matchCase}});this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsNotEqualTo":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsNotEqualTo",{attributes:{matchCase:filter.matchCase}});this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.value,node);return node;},"PropertyIsLike":function(filter){var node=this.createElementNSPlus("ogc:PropertyIsLike",{attributes:{wildCard:"*",singleChar:".",escapeChar:"!"}});this.writeNode("PropertyName",filter,node);this.writeNode("Literal",filter.regex2value(),node);return node;},"BBOX":function(filter){var node=this.createElementNSPlus("ogc:BBOX");this.writeNode("PropertyName",filter,node);var box=this.writeNode("gml:Envelope",filter.value);if(filter.projection){box.setAttribute("srsName",filter.projection);}
+node.appendChild(box);return node;}},OpenLayers.Format.Filter.v1.prototype.writers["ogc"]),"gml":OpenLayers.Format.GML.v3.prototype.writers["gml"],"feature":OpenLayers.Format.GML.v3.prototype.writers["feature"]},writeSpatial:function(filter,name){var node=this.createElementNSPlus("ogc:"+name);this.writeNode("PropertyName",filter,node);var child;if(filter.value instanceof OpenLayers.Geometry){child=this.writeNode("feature:_geometry",filter.value).firstChild;}else{child=this.writeNode("gml:Envelope",filter.value);}
+if(filter.projection){child.setAttribute("srsName",filter.projection);}
+node.appendChild(child);return node;},CLASS_NAME:"OpenLayers.Format.Filter.v1_1_0"});OpenLayers.Format.SOSCapabilities.v1_0_0=OpenLayers.Class(OpenLayers.Format.SOSCapabilities,{namespaces:{ows:"http://www.opengis.net/ows/1.1",sos:"http://www.opengis.net/sos/1.0",gml:"http://www.opengis.net/gml",xlink:"http://www.w3.org/1999/xlink"},regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);this.options=options;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var capabilities={};this.readNode(data,capabilities);return capabilities;},readers:{"gml":OpenLayers.Util.applyDefaults({"name":function(node,obj){obj.name=this.getChildValue(node);},"TimePeriod":function(node,obj){obj.timePeriod={};this.readChildNodes(node,obj.timePeriod);},"beginPosition":function(node,timePeriod){timePeriod.beginPosition=this.getChildValue(node);},"endPosition":function(node,timePeriod){timePeriod.endPosition=this.getChildValue(node);}},OpenLayers.Format.GML.v3.prototype.readers["gml"]),"sos":{"Capabilities":function(node,obj){this.readChildNodes(node,obj);},"Contents":function(node,obj){obj.contents={};this.readChildNodes(node,obj.contents);},"ObservationOfferingList":function(node,contents){contents.offeringList={};this.readChildNodes(node,contents.offeringList);},"ObservationOffering":function(node,offeringList){var id=this.getAttributeNS(node,this.namespaces.gml,"id");offeringList[id]={procedures:[],observedProperties:[],featureOfInterestIds:[],responseFormats:[],resultModels:[],responseModes:[]};this.readChildNodes(node,offeringList[id]);},"time":function(node,offering){offering.time={};this.readChildNodes(node,offering.time);},"procedure":function(node,offering){offering.procedures.push(this.getAttributeNS(node,this.namespaces.xlink,"href"));},"observedProperty":function(node,offering){offering.observedProperties.push(this.getAttributeNS(node,this.namespaces.xlink,"href"));},"featureOfInterest":function(node,offering){offering.featureOfInterestIds.push(this.getAttributeNS(node,this.namespaces.xlink,"href"));},"responseFormat":function(node,offering){offering.responseFormats.push(this.getChildValue(node));},"resultModel":function(node,offering){offering.resultModels.push(this.getChildValue(node));},"responseMode":function(node,offering){offering.responseModes.push(this.getChildValue(node));;}},"ows":OpenLayers.Format.OWSCommon.v1_1_0.prototype.readers["ows"]},CLASS_NAME:"OpenLayers.Format.SOSCapabilities.v1_0_0"});OpenLayers.Format.SOSGetFeatureOfInterest=OpenLayers.Class(OpenLayers.Format.XML,{VERSION:"1.0.0",namespaces:{sos:"http://www.opengis.net/sos/1.0",gml:"http://www.opengis.net/gml",sa:"http://www.opengis.net/sampling/1.0",xsi:"http://www.w3.org/2001/XMLSchema-instance"},schemaLocation:"http://www.opengis.net/sos/1.0 http://schemas.opengis.net/sos/1.0.0/sosAll.xsd",defaultPrefix:"sos",regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var info={features:[]};this.readNode(data,info);var features=[];for(var i=0,len=info.features.length;i<len;i++){var container=info.features[i];if(this.internalProjection&&this.externalProjection&&container.components[0]){container.components[0].transform(this.externalProjection,this.internalProjection);}
+var feature=new OpenLayers.Feature.Vector(container.components[0],container.attributes);features.push(feature);}
+return features;},readers:{"sa":{"SamplingPoint":function(node,obj){if(!obj.attributes){var feature={attributes:{}};obj.features.push(feature);obj=feature;}
+obj.attributes.id=this.getAttributeNS(node,this.namespaces.gml,"id");this.readChildNodes(node,obj);},"position":function(node,obj){this.readChildNodes(node,obj);}},"gml":OpenLayers.Util.applyDefaults({"FeatureCollection":function(node,obj){this.readChildNodes(node,obj);},"featureMember":function(node,obj){var feature={attributes:{}};obj.features.push(feature);this.readChildNodes(node,feature);},"name":function(node,obj){obj.attributes.name=this.getChildValue(node);},"pos":function(node,obj){if(!this.externalProjection){this.externalProjection=new OpenLayers.Projection(node.getAttribute("srsName"));}
+OpenLayers.Format.GML.v3.prototype.readers.gml.pos.apply(this,[node,obj]);}},OpenLayers.Format.GML.v3.prototype.readers.gml)},writers:{"sos":{"GetFeatureOfInterest":function(options){var node=this.createElementNSPlus("GetFeatureOfInterest",{attributes:{version:this.VERSION,service:'SOS',"xsi:schemaLocation":this.schemaLocation}});for(var i=0,len=options.fois.length;i<len;i++){this.writeNode("FeatureOfInterestId",{foi:options.fois[i]},node);}
+return node;},"FeatureOfInterestId":function(options){var node=this.createElementNSPlus("FeatureOfInterestId",{value:options.foi});return node;}}},CLASS_NAME:"OpenLayers.Format.SOSGetFeatureOfInterest"});OpenLayers.Format.SOSGetObservation=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{ows:"http://www.opengis.net/ows",gml:"http://www.opengis.net/gml",sos:"http://www.opengis.net/sos/1.0",ogc:"http://www.opengis.net/ogc",om:"http://www.opengis.net/om/1.0",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},VERSION:"1.0.0",schemaLocation:"http://www.opengis.net/sos/1.0 http://schemas.opengis.net/sos/1.0.0/sosGetObservation.xsd",defaultPrefix:"sos",initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var info={measurements:[]};this.readNode(data,info);return info;},write:function(options){var node=this.writeNode("sos:GetObservation",options);node.setAttribute("xmlns:om",this.namespaces.om);this.setAttributeNS(node,this.namespaces.xsi,"xsi:schemaLocation",this.schemaLocation);return OpenLayers.Format.XML.prototype.write.apply(this,[node]);},readers:{"om":{"ObservationCollection":function(node,obj){obj.id=this.getAttributeNS(node,this.namespaces.gml,"id");this.readChildNodes(node,obj);},"member":function(node,observationCollection){this.readChildNodes(node,observationCollection);},"Measurement":function(node,observationCollection){var measurement={};observationCollection.measurements.push(measurement);this.readChildNodes(node,measurement);},"samplingTime":function(node,measurement){var samplingTime={};measurement.samplingTime=samplingTime;this.readChildNodes(node,samplingTime);},"observedProperty":function(node,measurement){measurement.observedProperty=this.getAttributeNS(node,this.namespaces.xlink,"href");this.readChildNodes(node,measurement);},"procedure":function(node,measurement){measurement.procedure=this.getAttributeNS(node,this.namespaces.xlink,"href");this.readChildNodes(node,measurement);},"result":function(node,measurement){var result={};measurement.result=result;if(this.getChildValue(node)!==''){result.value=this.getChildValue(node);result.uom=node.getAttribute("uom");}else{this.readChildNodes(node,result);}}},"gml":OpenLayers.Util.applyDefaults({"TimeInstant":function(node,samplingTime){var timeInstant={};samplingTime.timeInstant=timeInstant;this.readChildNodes(node,timeInstant);},"timePosition":function(node,timeInstant){timeInstant.timePosition=this.getChildValue(node);}},OpenLayers.Format.GML.v3.prototype.readers.gml)},writers:{"sos":{"GetObservation":function(options){var node=this.createElementNSPlus("GetObservation",{attributes:{version:this.VERSION,service:'SOS'}});this.writeNode("offering",options,node);this.writeNode("eventTime",options,node);this.writeNode("procedure",options,node);this.writeNode("observedProperty",options,node);this.writeNode("responseFormat",options,node);this.writeNode("resultModel",options,node);this.writeNode("responseMode",options,node);return node;},"responseFormat":function(options){return this.createElementNSPlus("responseFormat",{value:options.responseFormat});},"procedure":function(options){return this.createElementNSPlus("procedure",{value:options.procedure});},"offering":function(options){return this.createElementNSPlus("offering",{value:options.offering});},"observedProperty":function(options){return this.createElementNSPlus("observedProperty",{value:options.observedProperty});},"eventTime":function(options){var node=this.createElementNSPlus("eventTime");if(options.eventTime==='latest'){this.writeNode("ogc:TM_Equals",options,node);}
+return node;},"resultModel":function(options){return this.createElementNSPlus("resultModel",{value:options.resultModel});},"responseMode":function(options){return this.createElementNSPlus("responseMode",{value:options.responseMode});}},"ogc":{"TM_Equals":function(options){var node=this.createElementNSPlus("ogc:TM_Equals");this.writeNode("ogc:PropertyName",{property:"urn:ogc:data:time:iso8601"},node);if(options.eventTime==='latest'){this.writeNode("gml:TimeInstant",{value:'latest'},node);}
+return node;},"PropertyName":function(options){return this.createElementNSPlus("ogc:PropertyName",{value:options.property});}},"gml":{"TimeInstant":function(options){var node=this.createElementNSPlus("gml:TimeInstant");this.writeNode("gml:timePosition",options,node);return node;},"timePosition":function(options){var node=this.createElementNSPlus("gml:timePosition",{value:options.value});return node;}}},CLASS_NAME:"OpenLayers.Format.SOSGetObservation"});OpenLayers.Format.CSWGetRecords.v2_0_2=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance",csw:"http://www.opengis.net/cat/csw/2.0.2",dc:"http://purl.org/dc/elements/1.1/",dct:"http://purl.org/dc/terms/",ows:"http://www.opengis.net/ows"},defaultPrefix:"csw",version:"2.0.2",schemaLocation:"http://www.opengis.net/cat/csw/2.0.2 http://schemas.opengis.net/csw/2.0.2/CSW-discovery.xsd",requestId:null,resultType:null,outputFormat:null,outputSchema:null,startPosition:null,maxRecords:null,DistributedSearch:null,ResponseHandler:null,Query:null,regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var obj={};this.readNode(data,obj);return obj;},readers:{"csw":{"GetRecordsResponse":function(node,obj){obj.records=[];this.readChildNodes(node,obj);var version=this.getAttributeNS(node,"",'version');if(version!=""){obj.version=version;}},"RequestId":function(node,obj){obj.RequestId=this.getChildValue(node);},"SearchStatus":function(node,obj){obj.SearchStatus={};var timestamp=this.getAttributeNS(node,"",'timestamp');if(timestamp!=""){obj.SearchStatus.timestamp=timestamp;}},"SearchResults":function(node,obj){this.readChildNodes(node,obj);var attrs=node.attributes;var SearchResults={};for(var i=0,len=attrs.length;i<len;++i){if((attrs[i].name=="numberOfRecordsMatched")||(attrs[i].name=="numberOfRecordsReturned")||(attrs[i].name=="nextRecord")){SearchResults[attrs[i].name]=parseInt(attrs[i].nodeValue);}else{SearchResults[attrs[i].name]=attrs[i].nodeValue;}}
+obj.SearchResults=SearchResults;},"SummaryRecord":function(node,obj){var record={type:"SummaryRecord"};this.readChildNodes(node,record);obj.records.push(record);},"BriefRecord":function(node,obj){var record={type:"BriefRecord"};this.readChildNodes(node,record);obj.records.push(record);},"DCMIRecord":function(node,obj){var record={type:"DCMIRecord"};this.readChildNodes(node,record);obj.records.push(record);},"Record":function(node,obj){var record={type:"Record"};this.readChildNodes(node,record);obj.records.push(record);}},"dc":{"*":function(node,obj){var name=node.localName||node.nodeName.split(":").pop();if(!(obj[name]instanceof Array)){obj[name]=new Array();}
+var dc_element={};var attrs=node.attributes;for(var i=0,len=attrs.length;i<len;++i){dc_element[attrs[i].name]=attrs[i].nodeValue;}
+dc_element.value=this.getChildValue(node);obj[name].push(dc_element);}},"dct":{"*":function(node,obj){var name=node.localName||node.nodeName.split(":").pop();if(!(obj[name]instanceof Array)){obj[name]=new Array();}
+obj[name].push(this.getChildValue(node));}},"ows":OpenLayers.Util.applyDefaults({"BoundingBox":function(node,obj){if(obj.bounds){obj.BoundingBox=[{crs:obj.projection,value:[obj.bounds.left,obj.bounds.bottom,obj.bounds.right,obj.bounds.top]}];delete obj.projection;delete obj.bounds;}
+OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers["ows"]["BoundingBox"].apply(this,arguments);}},OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers["ows"])},write:function(options){var node=this.writeNode("csw:GetRecords",options);return OpenLayers.Format.XML.prototype.write.apply(this,[node]);},writers:{"csw":{"GetRecords":function(options){if(!options){options={};}
+var node=this.createElementNSPlus("csw:GetRecords",{attributes:{service:"CSW",version:this.version,requestId:options.requestId||this.requestId,resultType:options.resultType||this.resultType,outputFormat:options.outputFormat||this.outputFormat,outputSchema:options.outputSchema||this.outputSchema,startPosition:options.startPosition||this.startPosition,maxRecords:options.maxRecords||this.maxRecords}});if(options.DistributedSearch||this.DistributedSearch){this.writeNode("csw:DistributedSearch",options.DistributedSearch||this.DistributedSearch,node);}
+var ResponseHandler=options.ResponseHandler||this.ResponseHandler;if(ResponseHandler instanceof Array&&ResponseHandler.length>0){for(var i=0,len=ResponseHandler.length;i<len;i++){this.writeNode("csw:ResponseHandler",ResponseHandler[i],node);}}
+this.writeNode("Query",options.Query||this.Query,node);return node;},"DistributedSearch":function(options){var node=this.createElementNSPlus("csw:DistributedSearch",{attributes:{hopCount:options.hopCount}});return node;},"ResponseHandler":function(options){var node=this.createElementNSPlus("csw:ResponseHandler",{value:options.value});return node;},"Query":function(options){if(!options){options={};}
+var node=this.createElementNSPlus("csw:Query",{attributes:{typeNames:options.typeNames||"csw:Record"}});var ElementName=options.ElementName;if(ElementName instanceof Array&&ElementName.length>0){for(var i=0,len=ElementName.length;i<len;i++){this.writeNode("csw:ElementName",ElementName[i],node);}}else{this.writeNode("csw:ElementSetName",options.ElementSetName||{value:'summary'},node);}
+if(options.Constraint){this.writeNode("csw:Constraint",options.Constraint,node);}
+return node;},"ElementName":function(options){var node=this.createElementNSPlus("csw:ElementName",{value:options.value});return node;},"ElementSetName":function(options){var node=this.createElementNSPlus("csw:ElementSetName",{attributes:{typeNames:options.typeNames},value:options.value});return node;},"Constraint":function(options){var node=this.createElementNSPlus("csw:Constraint",{attributes:{version:options.version}});if(options.Filter){var format=new OpenLayers.Format.Filter({version:options.version});node.appendChild(format.write(options.Filter));}else if(options.CqlText){var child=this.createElementNSPlus("CqlText",{value:options.CqlText.value});node.appendChild(child);}
+return node;}}},CLASS_NAME:"OpenLayers.Format.CSWGetRecords.v2_0_2"});OpenLayers.Format.SLD.v1=OpenLayers.Class(OpenLayers.Format.Filter.v1_0_0,{namespaces:{sld:"http://www.opengis.net/sld",ogc:"http://www.opengis.net/ogc",gml:"http://www.opengis.net/gml",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},defaultPrefix:"sld",schemaLocation:null,multipleSymbolizers:false,featureTypeCounter:null,defaultSymbolizer:{fillColor:"#808080",fillOpacity:1,strokeColor:"#000000",strokeOpacity:1,strokeWidth:1,strokeDashstyle:"solid",pointRadius:3,graphicName:"square"},initialize:function(options){OpenLayers.Format.Filter.v1_0_0.prototype.initialize.apply(this,[options]);},read:function(data,options){options=OpenLayers.Util.applyDefaults(options,this.options);var sld={namedLayers:options.namedLayersAsArray===true?[]:{}};this.readChildNodes(data,sld);return sld;},readers:OpenLayers.Util.applyDefaults({"sld":{"StyledLayerDescriptor":function(node,sld){sld.version=node.getAttribute("version");this.readChildNodes(node,sld);},"Name":function(node,obj){obj.name=this.getChildValue(node);},"Title":function(node,obj){obj.title=this.getChildValue(node);},"Abstract":function(node,obj){obj.description=this.getChildValue(node);},"NamedLayer":function(node,sld){var layer={userStyles:[],namedStyles:[]};this.readChildNodes(node,layer);for(var i=0,len=layer.userStyles.length;i<len;++i){layer.userStyles[i].layerName=layer.name;}
+if(sld.namedLayers instanceof Array){sld.namedLayers.push(layer);}else{sld.namedLayers[layer.name]=layer;}},"NamedStyle":function(node,layer){layer.namedStyles.push(this.getChildName(node.firstChild));},"UserStyle":function(node,layer){var obj={defaultsPerSymbolizer:true,rules:[]};this.featureTypeCounter=-1;this.readChildNodes(node,obj);var style;if(this.multipleSymbolizers){delete obj.defaultsPerSymbolizer;style=new OpenLayers.Style2(obj);}else{style=new OpenLayers.Style(this.defaultSymbolizer,obj);}
+layer.userStyles.push(style);},"IsDefault":function(node,style){if(this.getChildValue(node)=="1"){style.isDefault=true;}},"FeatureTypeStyle":function(node,style){++this.featureTypeCounter;var obj={rules:this.multipleSymbolizers?style.rules:[]};this.readChildNodes(node,obj);if(!this.multipleSymbolizers){style.rules=obj.rules;}},"Rule":function(node,obj){var config;if(this.multipleSymbolizers){config={symbolizers:[]};}
+var rule=new OpenLayers.Rule(config);this.readChildNodes(node,rule);obj.rules.push(rule);},"ElseFilter":function(node,rule){rule.elseFilter=true;},"MinScaleDenominator":function(node,rule){rule.minScaleDenominator=parseFloat(this.getChildValue(node));},"MaxScaleDenominator":function(node,rule){rule.maxScaleDenominator=parseFloat(this.getChildValue(node));},"TextSymbolizer":function(node,rule){var config={};this.readChildNodes(node,config);if(this.multipleSymbolizers){config.zIndex=this.featureTypeCounter;rule.symbolizers.push(new OpenLayers.Symbolizer.Text(config));}else{rule.symbolizer["Text"]=OpenLayers.Util.applyDefaults(config,rule.symbolizer["Text"]);}},"Label":function(node,symbolizer){var obj={};this.readChildNodes(node,obj);if(obj.property){symbolizer.label="${"+obj.property+"}";}else{var value=this.readOgcExpression(node);if(value){symbolizer.label=value;}}},"Font":function(node,symbolizer){this.readChildNodes(node,symbolizer);},"Halo":function(node,symbolizer){var obj={};this.readChildNodes(node,obj);symbolizer.haloRadius=obj.haloRadius;symbolizer.haloColor=obj.fillColor;symbolizer.haloOpacity=obj.fillOpacity;},"Radius":function(node,symbolizer){var radius=this.readOgcExpression(node);if(radius!=null){symbolizer.haloRadius=radius;}},"RasterSymbolizer":function(node,rule){var config={};this.readChildNodes(node,config);if(this.multipleSymbolizers){config.zIndex=this.featureTypeCounter;rule.symbolizers.push(new OpenLayers.Symbolizer.Raster(config));}else{rule.symbolizer["Raster"]=OpenLayers.Util.applyDefaults(config,rule.symbolizer["Raster"]);}},"Geometry":function(node,obj){obj.geometry={};this.readChildNodes(node,obj.geometry);},"ColorMap":function(node,symbolizer){symbolizer.colorMap=[];this.readChildNodes(node,symbolizer.colorMap);},"ColorMapEntry":function(node,colorMap){var q=node.getAttribute("quantity");var o=node.getAttribute("opacity");colorMap.push({color:node.getAttribute("color"),quantity:q!==null?parseFloat(q):undefined,label:node.getAttribute("label")||undefined,opacity:o!==null?parseFloat(o):undefined});},"LineSymbolizer":function(node,rule){var config={};this.readChildNodes(node,config);if(this.multipleSymbolizers){config.zIndex=this.featureTypeCounter;rule.symbolizers.push(new OpenLayers.Symbolizer.Line(config));}else{rule.symbolizer["Line"]=OpenLayers.Util.applyDefaults(config,rule.symbolizer["Line"]);}},"PolygonSymbolizer":function(node,rule){var config={fill:false,stroke:false};if(!this.multipleSymbolizers){config=rule.symbolizer["Polygon"]||config;}
+this.readChildNodes(node,config);if(this.multipleSymbolizers){config.zIndex=this.featureTypeCounter;rule.symbolizers.push(new OpenLayers.Symbolizer.Polygon(config));}else{rule.symbolizer["Polygon"]=config;}},"PointSymbolizer":function(node,rule){var config={fill:false,stroke:false,graphic:false};if(!this.multipleSymbolizers){config=rule.symbolizer["Point"]||config;}
+this.readChildNodes(node,config);if(this.multipleSymbolizers){config.zIndex=this.featureTypeCounter;rule.symbolizers.push(new OpenLayers.Symbolizer.Point(config));}else{rule.symbolizer["Point"]=config;}},"Stroke":function(node,symbolizer){symbolizer.stroke=true;this.readChildNodes(node,symbolizer);},"Fill":function(node,symbolizer){symbolizer.fill=true;this.readChildNodes(node,symbolizer);},"CssParameter":function(node,symbolizer){var cssProperty=node.getAttribute("name");var symProperty=this.cssMap[cssProperty];if(symProperty){var value=this.readOgcExpression(node);if(value){symbolizer[symProperty]=value;}}},"Graphic":function(node,symbolizer){symbolizer.graphic=true;var graphic={};this.readChildNodes(node,graphic);var properties=["stroke","strokeColor","strokeWidth","strokeOpacity","strokeLinecap","fill","fillColor","fillOpacity","graphicName","rotation","graphicFormat"];var prop,value;for(var i=0,len=properties.length;i<len;++i){prop=properties[i];value=graphic[prop];if(value!=undefined){symbolizer[prop]=value;}}
+if(graphic.opacity!=undefined){symbolizer.graphicOpacity=graphic.opacity;}
+if(graphic.size!=undefined){symbolizer.pointRadius=graphic.size/2;}
+if(graphic.href!=undefined){symbolizer.externalGraphic=graphic.href;}
+if(graphic.rotation!=undefined){symbolizer.rotation=graphic.rotation;}},"ExternalGraphic":function(node,graphic){this.readChildNodes(node,graphic);},"Mark":function(node,graphic){this.readChildNodes(node,graphic);},"WellKnownName":function(node,graphic){graphic.graphicName=this.getChildValue(node);},"Opacity":function(node,obj){var opacity=this.readOgcExpression(node);if(opacity){obj.opacity=opacity;}},"Size":function(node,obj){var size=this.readOgcExpression(node);if(size){obj.size=size;}},"Rotation":function(node,obj){var rotation=this.readOgcExpression(node);if(rotation){obj.rotation=rotation;}},"OnlineResource":function(node,obj){obj.href=this.getAttributeNS(node,this.namespaces.xlink,"href");},"Format":function(node,graphic){graphic.graphicFormat=this.getChildValue(node);}}},OpenLayers.Format.Filter.v1_0_0.prototype.readers),cssMap:{"stroke":"strokeColor","stroke-opacity":"strokeOpacity","stroke-width":"strokeWidth","stroke-linecap":"strokeLinecap","stroke-dasharray":"strokeDashstyle","fill":"fillColor","fill-opacity":"fillOpacity","font-family":"fontFamily","font-size":"fontSize","font-weight":"fontWeight","font-style":"fontStyle"},getCssProperty:function(sym){var css=null;for(var prop in this.cssMap){if(this.cssMap[prop]==sym){css=prop;break;}}
+return css;},getGraphicFormat:function(href){var format,regex;for(var key in this.graphicFormats){if(this.graphicFormats[key].test(href)){format=key;break;}}
+return format||this.defautlGraphicFormat;},defaultGraphicFormat:"image/png",graphicFormats:{"image/jpeg":/\.jpe?g$/i,"image/gif":/\.gif$/i,"image/png":/\.png$/i},write:function(sld){return this.writers.sld.StyledLayerDescriptor.apply(this,[sld]);},writers:OpenLayers.Util.applyDefaults({"sld":{"StyledLayerDescriptor":function(sld){var root=this.createElementNSPlus("sld:StyledLayerDescriptor",{attributes:{"version":this.VERSION,"xsi:schemaLocation":this.schemaLocation}});root.setAttribute("xmlns:ogc",this.namespaces.ogc);root.setAttribute("xmlns:gml",this.namespaces.gml);if(sld.name){this.writeNode("Name",sld.name,root);}
+if(sld.title){this.writeNode("Title",sld.title,root);}
+if(sld.description){this.writeNode("Abstract",sld.description,root);}
+if(sld.namedLayers instanceof Array){for(var i=0,len=sld.namedLayers.length;i<len;++i){this.writeNode("NamedLayer",sld.namedLayers[i],root);}}else{for(var name in sld.namedLayers){this.writeNode("NamedLayer",sld.namedLayers[name],root);}}
+return root;},"Name":function(name){return this.createElementNSPlus("sld:Name",{value:name});},"Title":function(title){return this.createElementNSPlus("sld:Title",{value:title});},"Abstract":function(description){return this.createElementNSPlus("sld:Abstract",{value:description});},"NamedLayer":function(layer){var node=this.createElementNSPlus("sld:NamedLayer");this.writeNode("Name",layer.name,node);if(layer.namedStyles){for(var i=0,len=layer.namedStyles.length;i<len;++i){this.writeNode("NamedStyle",layer.namedStyles[i],node);}}
+if(layer.userStyles){for(var i=0,len=layer.userStyles.length;i<len;++i){this.writeNode("UserStyle",layer.userStyles[i],node);}}
+return node;},"NamedStyle":function(name){var node=this.createElementNSPlus("sld:NamedStyle");this.writeNode("Name",name,node);return node;},"UserStyle":function(style){var node=this.createElementNSPlus("sld:UserStyle");if(style.name){this.writeNode("Name",style.name,node);}
+if(style.title){this.writeNode("Title",style.title,node);}
+if(style.description){this.writeNode("Abstract",style.description,node);}
+if(style.isDefault){this.writeNode("IsDefault",style.isDefault,node);}
+if(this.multipleSymbolizers&&style.rules){var rulesByZ={0:[]};var zValues=[0];var rule,ruleMap,symbolizer,zIndex,clone;for(var i=0,ii=style.rules.length;i<ii;++i){rule=style.rules[i];if(rule.symbolizers){ruleMap={};for(var j=0,jj=rule.symbolizers.length;j<jj;++j){symbolizer=rule.symbolizers[j];zIndex=symbolizer.zIndex;if(!(zIndex in ruleMap)){clone=rule.clone();clone.symbolizers=[];ruleMap[zIndex]=clone;}
+ruleMap[zIndex].symbolizers.push(symbolizer.clone());}
+for(zIndex in ruleMap){if(!(zIndex in rulesByZ)){zValues.push(zIndex);rulesByZ[zIndex]=[];}
+rulesByZ[zIndex].push(ruleMap[zIndex]);}}else{rulesByZ[0].push(rule.clone());}}
+zValues.sort();var rules;for(var i=0,ii=zValues.length;i<ii;++i){rules=rulesByZ[zValues[i]];if(rules.length>0){clone=style.clone();clone.rules=rulesByZ[zValues[i]];this.writeNode("FeatureTypeStyle",clone,node);}}}else{this.writeNode("FeatureTypeStyle",style,node);}
+return node;},"IsDefault":function(bool){return this.createElementNSPlus("sld:IsDefault",{value:(bool)?"1":"0"});},"FeatureTypeStyle":function(style){var node=this.createElementNSPlus("sld:FeatureTypeStyle");for(var i=0,len=style.rules.length;i<len;++i){this.writeNode("Rule",style.rules[i],node);}
+return node;},"Rule":function(rule){var node=this.createElementNSPlus("sld:Rule");if(rule.name){this.writeNode("Name",rule.name,node);}
+if(rule.title){this.writeNode("Title",rule.title,node);}
+if(rule.description){this.writeNode("Abstract",rule.description,node);}
+if(rule.elseFilter){this.writeNode("ElseFilter",null,node);}else if(rule.filter){this.writeNode("ogc:Filter",rule.filter,node);}
+if(rule.minScaleDenominator!=undefined){this.writeNode("MinScaleDenominator",rule.minScaleDenominator,node);}
+if(rule.maxScaleDenominator!=undefined){this.writeNode("MaxScaleDenominator",rule.maxScaleDenominator,node);}
+var type,symbolizer;if(this.multipleSymbolizers&&rule.symbolizers){var symbolizer;for(var i=0,ii=rule.symbolizers.length;i<ii;++i){symbolizer=rule.symbolizers[i];type=symbolizer.CLASS_NAME.split(".").pop();this.writeNode(type+"Symbolizer",symbolizer,node);}}else{var types=OpenLayers.Style.SYMBOLIZER_PREFIXES;for(var i=0,len=types.length;i<len;++i){type=types[i];symbolizer=rule.symbolizer[type];if(symbolizer){this.writeNode(type+"Symbolizer",symbolizer,node);}}}
+return node;},"ElseFilter":function(){return this.createElementNSPlus("sld:ElseFilter");},"MinScaleDenominator":function(scale){return this.createElementNSPlus("sld:MinScaleDenominator",{value:scale});},"MaxScaleDenominator":function(scale){return this.createElementNSPlus("sld:MaxScaleDenominator",{value:scale});},"LineSymbolizer":function(symbolizer){var node=this.createElementNSPlus("sld:LineSymbolizer");this.writeNode("Stroke",symbolizer,node);return node;},"Stroke":function(symbolizer){var node=this.createElementNSPlus("sld:Stroke");if(symbolizer.strokeColor!=undefined){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"strokeColor"},node);}
+if(symbolizer.strokeOpacity!=undefined){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"strokeOpacity"},node);}
+if(symbolizer.strokeWidth!=undefined){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"strokeWidth"},node);}
+if(symbolizer.strokeDashstyle!=undefined&&symbolizer.strokeDashstyle!=="solid"){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"strokeDashstyle"},node);}
+if(symbolizer.strokeLinecap!=undefined){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"strokeLinecap"},node);}
+return node;},"CssParameter":function(obj){return this.createElementNSPlus("sld:CssParameter",{attributes:{name:this.getCssProperty(obj.key)},value:obj.symbolizer[obj.key]});},"TextSymbolizer":function(symbolizer){var node=this.createElementNSPlus("sld:TextSymbolizer");if(symbolizer.label!=null){this.writeNode("Label",symbolizer.label,node);}
+if(symbolizer.fontFamily!=null||symbolizer.fontSize!=null||symbolizer.fontWeight!=null||symbolizer.fontStyle!=null){this.writeNode("Font",symbolizer,node);}
+if(symbolizer.haloRadius!=null||symbolizer.haloColor!=null||symbolizer.haloOpacity!=null){this.writeNode("Halo",symbolizer,node);}
+if(symbolizer.fillColor!=null||symbolizer.fillOpacity!=null){this.writeNode("Fill",symbolizer,node);}
+return node;},"Font":function(symbolizer){var node=this.createElementNSPlus("sld:Font");if(symbolizer.fontFamily){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fontFamily"},node);}
+if(symbolizer.fontSize){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fontSize"},node);}
+if(symbolizer.fontWeight){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fontWeight"},node);}
+if(symbolizer.fontStyle){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fontStyle"},node);}
+return node;},"Label":function(label){var node=this.createElementNSPlus("sld:Label");var tokens=label.split("${");node.appendChild(this.createTextNode(tokens[0]));var item,last;for(var i=1,len=tokens.length;i<len;i++){item=tokens[i];last=item.indexOf("}");if(last>0){this.writeNode("ogc:PropertyName",{property:item.substring(0,last)},node);node.appendChild(this.createTextNode(item.substring(++last)));}else{node.appendChild(this.createTextNode("${"+item));}}
+return node;},"Halo":function(symbolizer){var node=this.createElementNSPlus("sld:Halo");if(symbolizer.haloRadius){this.writeNode("Radius",symbolizer.haloRadius,node);}
+if(symbolizer.haloColor||symbolizer.haloOpacity){this.writeNode("Fill",{fillColor:symbolizer.haloColor,fillOpacity:symbolizer.haloOpacity},node);}
+return node;},"Radius":function(value){return this.createElementNSPlus("sld:Radius",{value:value});},"RasterSymbolizer":function(symbolizer){var node=this.createElementNSPlus("sld:RasterSymbolizer");if(symbolizer.geometry){this.writeNode("Geometry",symbolizer.geometry,node);}
+if(symbolizer.opacity){this.writeNode("Opacity",symbolizer.opacity,node);}
+if(symbolizer.colorMap){this.writeNode("ColorMap",symbolizer.colorMap,node);}
+return node;},"Geometry":function(geometry){var node=this.createElementNSPlus("sld:Geometry");if(geometry.property){this.writeNode("ogc:PropertyName",geometry,node);}
+return node;},"ColorMap":function(colorMap){var node=this.createElementNSPlus("sld:ColorMap");for(var i=0,len=colorMap.length;i<len;++i){this.writeNode("ColorMapEntry",colorMap[i],node);}
+return node;},"ColorMapEntry":function(colorMapEntry){var node=this.createElementNSPlus("sld:ColorMapEntry");var a=colorMapEntry;node.setAttribute("color",a.color);a.opacity!==undefined&&node.setAttribute("opacity",parseFloat(a.opacity));a.quantity!==undefined&&node.setAttribute("quantity",parseFloat(a.quantity));a.label!==undefined&&node.setAttribute("label",a.label);return node;},"PolygonSymbolizer":function(symbolizer){var node=this.createElementNSPlus("sld:PolygonSymbolizer");if(symbolizer.fill!==false){this.writeNode("Fill",symbolizer,node);}
+if(symbolizer.stroke!==false){this.writeNode("Stroke",symbolizer,node);}
+return node;},"Fill":function(symbolizer){var node=this.createElementNSPlus("sld:Fill");if(symbolizer.fillColor){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fillColor"},node);}
+if(symbolizer.fillOpacity!=null){this.writeNode("CssParameter",{symbolizer:symbolizer,key:"fillOpacity"},node);}
+return node;},"PointSymbolizer":function(symbolizer){var node=this.createElementNSPlus("sld:PointSymbolizer");this.writeNode("Graphic",symbolizer,node);return node;},"Graphic":function(symbolizer){var node=this.createElementNSPlus("sld:Graphic");if(symbolizer.externalGraphic!=undefined){this.writeNode("ExternalGraphic",symbolizer,node);}else{this.writeNode("Mark",symbolizer,node);}
+if(symbolizer.graphicOpacity!=undefined){this.writeNode("Opacity",symbolizer.graphicOpacity,node);}
+if(symbolizer.pointRadius!=undefined){this.writeNode("Size",symbolizer.pointRadius*2,node);}
+if(symbolizer.rotation!=undefined){this.writeNode("Rotation",symbolizer.rotation,node);}
+return node;},"ExternalGraphic":function(symbolizer){var node=this.createElementNSPlus("sld:ExternalGraphic");this.writeNode("OnlineResource",symbolizer.externalGraphic,node);var format=symbolizer.graphicFormat||this.getGraphicFormat(symbolizer.externalGraphic);this.writeNode("Format",format,node);return node;},"Mark":function(symbolizer){var node=this.createElementNSPlus("sld:Mark");if(symbolizer.graphicName){this.writeNode("WellKnownName",symbolizer.graphicName,node);}
+if(symbolizer.fill!==false){this.writeNode("Fill",symbolizer,node);}
+if(symbolizer.stroke!==false){this.writeNode("Stroke",symbolizer,node);}
+return node;},"WellKnownName":function(name){return this.createElementNSPlus("sld:WellKnownName",{value:name});},"Opacity":function(value){return this.createElementNSPlus("sld:Opacity",{value:value});},"Size":function(value){return this.createElementNSPlus("sld:Size",{value:value});},"Rotation":function(value){return this.createElementNSPlus("sld:Rotation",{value:value});},"OnlineResource":function(href){return this.createElementNSPlus("sld:OnlineResource",{attributes:{"xlink:type":"simple","xlink:href":href}});},"Format":function(format){return this.createElementNSPlus("sld:Format",{value:format});}}},OpenLayers.Format.Filter.v1_0_0.prototype.writers),CLASS_NAME:"OpenLayers.Format.SLD.v1"});OpenLayers.Format.WFST.v1_0_0=OpenLayers.Class(OpenLayers.Format.Filter.v1_0_0,OpenLayers.Format.WFST.v1,{version:"1.0.0",srsNameInQuery:false,schemaLocations:{"wfs":"http://schemas.opengis.net/wfs/1.0.0/WFS-transaction.xsd"},initialize:function(options){OpenLayers.Format.Filter.v1_0_0.prototype.initialize.apply(this,[options]);OpenLayers.Format.WFST.v1.prototype.initialize.apply(this,[options]);},readers:{"wfs":OpenLayers.Util.applyDefaults({"WFS_TransactionResponse":function(node,obj){obj.insertIds=[];obj.success=false;this.readChildNodes(node,obj);},"InsertResult":function(node,container){var obj={fids:[]};this.readChildNodes(node,obj);container.insertIds.push(obj.fids[0]);},"TransactionResult":function(node,obj){this.readChildNodes(node,obj);},"Status":function(node,obj){this.readChildNodes(node,obj);},"SUCCESS":function(node,obj){obj.success=true;}},OpenLayers.Format.WFST.v1.prototype.readers["wfs"]),"gml":OpenLayers.Format.GML.v2.prototype.readers["gml"],"feature":OpenLayers.Format.GML.v2.prototype.readers["feature"],"ogc":OpenLayers.Format.Filter.v1_0_0.prototype.readers["ogc"]},writers:{"wfs":OpenLayers.Util.applyDefaults({"Query":function(options){options=OpenLayers.Util.extend({featureNS:this.featureNS,featurePrefix:this.featurePrefix,featureType:this.featureType,srsName:this.srsName,srsNameInQuery:this.srsNameInQuery},options);var node=this.createElementNSPlus("wfs:Query",{attributes:{typeName:(options.featureNS?options.featurePrefix+":":"")+
+options.featureType}});if(options.srsNameInQuery&&options.srsName){node.setAttribute("srsName",options.srsName);}
+if(options.featureNS){node.setAttribute("xmlns:"+options.featurePrefix,options.featureNS);}
+if(options.propertyNames){for(var i=0,len=options.propertyNames.length;i<len;i++){this.writeNode("ogc:PropertyName",{property:options.propertyNames[i]},node);}}
+if(options.filter){this.setFilterProperty(options.filter);this.writeNode("ogc:Filter",options.filter,node);}
+return node;}},OpenLayers.Format.WFST.v1.prototype.writers["wfs"]),"gml":OpenLayers.Format.GML.v2.prototype.writers["gml"],"feature":OpenLayers.Format.GML.v2.prototype.writers["feature"],"ogc":OpenLayers.Format.Filter.v1_0_0.prototype.writers["ogc"]},CLASS_NAME:"OpenLayers.Format.WFST.v1_0_0"});OpenLayers.Format.WFST.v1_1_0=OpenLayers.Class(OpenLayers.Format.Filter.v1_1_0,OpenLayers.Format.WFST.v1,{version:"1.1.0",schemaLocations:{"wfs":"http://schemas.opengis.net/wfs/1.1.0/wfs.xsd"},initialize:function(options){OpenLayers.Format.Filter.v1_1_0.prototype.initialize.apply(this,[options]);OpenLayers.Format.WFST.v1.prototype.initialize.apply(this,[options]);},readers:{"wfs":OpenLayers.Util.applyDefaults({"FeatureCollection":function(node,obj){obj.numberOfFeatures=parseInt(node.getAttribute("numberOfFeatures"));OpenLayers.Format.WFST.v1.prototype.readers["wfs"]["FeatureCollection"].apply(this,arguments);},"TransactionResponse":function(node,obj){obj.insertIds=[];obj.success=false;this.readChildNodes(node,obj);},"TransactionSummary":function(node,obj){obj.success=true;},"InsertResults":function(node,obj){this.readChildNodes(node,obj);},"Feature":function(node,container){var obj={fids:[]};this.readChildNodes(node,obj);container.insertIds.push(obj.fids[0]);}},OpenLayers.Format.WFST.v1.prototype.readers["wfs"]),"gml":OpenLayers.Format.GML.v3.prototype.readers["gml"],"feature":OpenLayers.Format.GML.v3.prototype.readers["feature"],"ogc":OpenLayers.Format.Filter.v1_1_0.prototype.readers["ogc"]},writers:{"wfs":OpenLayers.Util.applyDefaults({"GetFeature":function(options){var node=OpenLayers.Format.WFST.v1.prototype.writers["wfs"]["GetFeature"].apply(this,arguments);options&&options.resultType&&this.setAttributes(node,{resultType:options.resultType});return node;},"Query":function(options){options=OpenLayers.Util.extend({featureNS:this.featureNS,featurePrefix:this.featurePrefix,featureType:this.featureType,srsName:this.srsName},options);var node=this.createElementNSPlus("wfs:Query",{attributes:{typeName:(options.featureNS?options.featurePrefix+":":"")+
+options.featureType,srsName:options.srsName}});if(options.featureNS){node.setAttribute("xmlns:"+options.featurePrefix,options.featureNS);}
+if(options.propertyNames){for(var i=0,len=options.propertyNames.length;i<len;i++){this.writeNode("wfs:PropertyName",{property:options.propertyNames[i]},node);}}
+if(options.filter){this.setFilterProperty(options.filter);this.writeNode("ogc:Filter",options.filter,node);}
+return node;},"PropertyName":function(obj){return this.createElementNSPlus("wfs:PropertyName",{value:obj.property});}},OpenLayers.Format.WFST.v1.prototype.writers["wfs"]),"gml":OpenLayers.Format.GML.v3.prototype.writers["gml"],"feature":OpenLayers.Format.GML.v3.prototype.writers["feature"],"ogc":OpenLayers.Format.Filter.v1_1_0.prototype.writers["ogc"]},CLASS_NAME:"OpenLayers.Format.WFST.v1_1_0"});OpenLayers.Protocol.SOS.v1_0_0=OpenLayers.Class(OpenLayers.Protocol,{fois:null,formatOptions:null,initialize:function(options){OpenLayers.Protocol.prototype.initialize.apply(this,[options]);if(!options.format){this.format=new OpenLayers.Format.SOSGetFeatureOfInterest(this.formatOptions);}},destroy:function(){if(this.options&&!this.options.format){this.format.destroy();}
+this.format=null;OpenLayers.Protocol.prototype.destroy.apply(this);},read:function(options){options=OpenLayers.Util.extend({},options);OpenLayers.Util.applyDefaults(options,this.options||{});var response=new OpenLayers.Protocol.Response({requestType:"read"});var format=this.format;var data=OpenLayers.Format.XML.prototype.write.apply(format,[format.writeNode("sos:GetFeatureOfInterest",{fois:this.fois})]);response.priv=OpenLayers.Request.POST({url:options.url,callback:this.createCallback(this.handleRead,response,options),data:data});return response;},handleRead:function(response,options){if(options.callback){var request=response.priv;if(request.status>=200&&request.status<300){response.features=this.parseFeatures(request);response.code=OpenLayers.Protocol.Response.SUCCESS;}else{response.code=OpenLayers.Protocol.Response.FAILURE;}
+options.callback.call(options.scope,response);}},parseFeatures:function(request){var doc=request.responseXML;if(!doc||!doc.documentElement){doc=request.responseText;}
+if(!doc||doc.length<=0){return null;}
+return this.format.read(doc);},CLASS_NAME:"OpenLayers.Protocol.SOS.v1_0_0"});OpenLayers.Format.SLD.v1_0_0=OpenLayers.Class(OpenLayers.Format.SLD.v1,{VERSION:"1.0.0",schemaLocation:"http://www.opengis.net/sld http://schemas.opengis.net/sld/1.0.0/StyledLayerDescriptor.xsd",initialize:function(options){OpenLayers.Format.SLD.v1.prototype.initialize.apply(this,[options]);},CLASS_NAME:"OpenLayers.Format.SLD.v1_0_0"});OpenLayers.Protocol.WFS.v1_0_0=OpenLayers.Class(OpenLayers.Protocol.WFS.v1,{version:"1.0.0",CLASS_NAME:"OpenLayers.Protocol.WFS.v1_0_0"});OpenLayers.Protocol.WFS.v1_1_0=OpenLayers.Class(OpenLayers.Protocol.WFS.v1,{version:"1.1.0",CLASS_NAME:"OpenLayers.Protocol.WFS.v1_1_0"});OpenLayers.Format.OWSContext.v0_3_1=OpenLayers.Class(OpenLayers.Format.XML,{namespaces:{owc:"http://www.opengis.net/ows-context",gml:"http://www.opengis.net/gml",kml:"http://www.opengis.net/kml/2.2",ogc:"http://www.opengis.net/ogc",ows:"http://www.opengis.net/ows",sld:"http://www.opengis.net/sld",xlink:"http://www.w3.org/1999/xlink",xsi:"http://www.w3.org/2001/XMLSchema-instance"},VERSION:"0.3.1",schemaLocation:"http://www.opengis.net/ows-context http://www.ogcnetwork.net/schemas/owc/0.3.1/owsContext.xsd",defaultPrefix:"owc",extractAttributes:true,xy:true,regExes:{trimSpace:(/^\s*|\s*$/g),removeSpace:(/\s*/g),splitSpace:(/\s+/),trimComma:(/\s*,\s*/g)},featureNS:"http://mapserver.gis.umn.edu/mapserver",featureType:'vector',geometryName:'geometry',nestingLayerLookup:null,initialize:function(options){OpenLayers.Format.XML.prototype.initialize.apply(this,[options]);OpenLayers.Format.GML.v2.prototype.setGeometryTypes.call(this);},setNestingPath:function(l){if(l.layersContext){for(var i=0,len=l.layersContext.length;i<len;i++){var layerContext=l.layersContext[i];var nPath=[];var nTitle=l.title||"";if(l.metadata&&l.metadata.nestingPath){nPath=l.metadata.nestingPath.slice();}
+if(nTitle!=""){nPath.push(nTitle);}
+layerContext.metadata.nestingPath=nPath;if(layerContext.layersContext){this.setNestingPath(layerContext);}}}},decomposeNestingPath:function(nPath){var a=[];if(nPath instanceof Array){while(nPath.length>0){a.push(nPath.slice());nPath.pop();}
+a.reverse();}
+return a;},read:function(data){if(typeof data=="string"){data=OpenLayers.Format.XML.prototype.read.apply(this,[data]);}
+if(data&&data.nodeType==9){data=data.documentElement;}
+var context={};this.readNode(data,context);this.setNestingPath({layersContext:context.layersContext});var layers=[];this.processLayer(layers,context);delete context.layersContext;context.layersContext=layers;return context;},processLayer:function(layerArray,layer){if(layer.layersContext){for(var i=0,len=layer.layersContext.length;i<len;i++){var l=layer.layersContext[i];layerArray.push(l);if(l.layersContext){this.processLayer(layerArray,l);}}}},write:function(context,options){var name="OWSContext";this.nestingLayerLookup={};options=options||{};OpenLayers.Util.applyDefaults(options,context);var root=this.writeNode(name,options);this.nestingLayerLookup=null;this.setAttributeNS(root,this.namespaces["xsi"],"xsi:schemaLocation",this.schemaLocation);return OpenLayers.Format.XML.prototype.write.apply(this,[root]);},readers:{"kml":{"Document":function(node,obj){obj.features=new OpenLayers.Format.KML({kmlns:this.namespaces.kml,extractStyles:true}).read(node);}},"owc":{"OWSContext":function(node,obj){this.readChildNodes(node,obj);},"General":function(node,obj){this.readChildNodes(node,obj);},"ResourceList":function(node,obj){this.readChildNodes(node,obj);},"Layer":function(node,obj){var layerContext={metadata:{},visibility:(node.getAttribute("hidden")!="1"),queryable:(node.getAttribute("queryable")=="1"),opacity:((node.getAttribute("opacity")!=null)?parseFloat(node.getAttribute("opacity")):null),name:node.getAttribute("name"),categoryLayer:(node.getAttribute("name")==null),formats:[],styles:[]};if(!obj.layersContext){obj.layersContext=[];}
+obj.layersContext.push(layerContext);this.readChildNodes(node,layerContext);},"InlineGeometry":function(node,obj){obj.features=[];var elements=this.getElementsByTagNameNS(node,this.namespaces.gml,"featureMember");var el;if(elements.length>=1){el=elements[0];}
+if(el&&el.firstChild){var featurenode=(el.firstChild.nextSibling)?el.firstChild.nextSibling:el.firstChild;this.setNamespace("feature",featurenode.namespaceURI);this.featureType=featurenode.localName||featurenode.nodeName.split(":").pop();this.readChildNodes(node,obj);}},"Server":function(node,obj){if((!obj.service&&!obj.version)||(obj.service!=OpenLayers.Format.Context.serviceTypes.WMS)){obj.service=node.getAttribute("service");obj.version=node.getAttribute("version");this.readChildNodes(node,obj);}},"Name":function(node,obj){obj.name=this.getChildValue(node);this.readChildNodes(node,obj);},"Title":function(node,obj){obj.title=this.getChildValue(node);this.readChildNodes(node,obj);},"StyleList":function(node,obj){this.readChildNodes(node,obj.styles);},"Style":function(node,obj){var style={};obj.push(style);this.readChildNodes(node,style);},"LegendURL":function(node,obj){var legend={};obj.legend=legend;this.readChildNodes(node,legend);},"OnlineResource":function(node,obj){obj.url=this.getAttributeNS(node,this.namespaces.xlink,"href");this.readChildNodes(node,obj);}},"ows":OpenLayers.Format.OWSCommon.v1_0_0.prototype.readers.ows,"gml":OpenLayers.Format.GML.v2.prototype.readers.gml,"sld":OpenLayers.Format.SLD.v1_0_0.prototype.readers.sld,"feature":OpenLayers.Format.GML.v2.prototype.readers.feature},writers:{"owc":{"OWSContext":function(options){var node=this.createElementNSPlus("OWSContext",{attributes:{version:this.VERSION,id:options.id||OpenLayers.Util.createUniqueID("OpenLayers_OWSContext_")}});this.writeNode("General",options,node);this.writeNode("ResourceList",options,node);return node;},"General":function(options){var node=this.createElementNSPlus("General");this.writeNode("ows:BoundingBox",options,node);this.writeNode("ows:Title",options.title||'OpenLayers OWSContext',node);return node;},"ResourceList":function(options){var node=this.createElementNSPlus("ResourceList");for(var i=0,len=options.layers.length;i<len;i++){var layer=options.layers[i];var decomposedPath=this.decomposeNestingPath(layer.metadata.nestingPath);this.writeNode("_Layer",{layer:layer,subPaths:decomposedPath},node);}
+return node;},"Server":function(options){var node=this.createElementNSPlus("Server",{attributes:{version:options.version,service:options.service}});this.writeNode("OnlineResource",options,node);return node;},"OnlineResource":function(options){var node=this.createElementNSPlus("OnlineResource",{attributes:{"xlink:href":options.url}});return node;},"InlineGeometry":function(layer){var node=this.createElementNSPlus("InlineGeometry");this.writeNode("gml:boundedBy",layer.getDataExtent(),node);for(var i=0,len=layer.features.length;i<len;i++){this.writeNode("gml:featureMember",layer.features[i],node);}
+return node;},"StyleList":function(styles){var node=this.createElementNSPlus("StyleList");for(var i=0,len=styles.length;i<len;i++){this.writeNode("Style",styles[i],node);}
+return node;},"Style":function(style){var node=this.createElementNSPlus("Style");this.writeNode("Name",style,node);this.writeNode("Title",style,node);this.writeNode("LegendURL",style,node);return node;},"Name":function(obj){var node=this.createElementNSPlus("Name",{value:obj.name});return node;},"Title":function(obj){var node=this.createElementNSPlus("Title",{value:obj.title});return node;},"LegendURL":function(style){var node=this.createElementNSPlus("LegendURL");this.writeNode("OnlineResource",style.legend,node);return node;},"_WMS":function(layer){var node=this.createElementNSPlus("Layer",{attributes:{name:layer.params.LAYERS,queryable:layer.queryable?"1":"0",hidden:layer.visibility?"0":"1",opacity:layer.opacity?layer.opacity:null}});this.writeNode("ows:Title",layer.name,node);this.writeNode("ows:OutputFormat",layer.params.FORMAT,node);this.writeNode("Server",{service:OpenLayers.Format.Context.serviceTypes.WMS,version:layer.params.VERSION,url:layer.url},node);if(layer.metadata.styles&&layer.metadata.styles.length>0){this.writeNode("StyleList",layer.metadata.styles,node);}
+return node;},"_Layer":function(options){var layer,subPaths,node,title;layer=options.layer;subPaths=options.subPaths;node=null;title=null;if(subPaths.length>0){var path=subPaths[0].join("/");var index=path.lastIndexOf("/");node=this.nestingLayerLookup[path];title=(index>0)?path.substring(index+1,path.length):path;if(!node){node=this.createElementNSPlus("Layer");this.writeNode("ows:Title",title,node);this.nestingLayerLookup[path]=node;}
+options.subPaths.shift();this.writeNode("_Layer",options,node);return node;}else{if(layer instanceof OpenLayers.Layer.WMS){node=this.writeNode("_WMS",layer);}else if(layer instanceof OpenLayers.Layer.Vector){if(layer.protocol instanceof OpenLayers.Protocol.WFS.v1){node=this.writeNode("_WFS",layer);}else if(layer.protocol instanceof OpenLayers.Protocol.HTTP){if(layer.protocol.format instanceof OpenLayers.Format.GML){layer.protocol.format.version="2.1.2";node=this.writeNode("_GML",layer);}else if(layer.protocol.format instanceof OpenLayers.Format.KML){layer.protocol.format.version="2.2";node=this.writeNode("_KML",layer);}}else{this.setNamespace("feature",this.featureNS);node=this.writeNode("_InlineGeometry",layer);}}
+if(layer.options.maxScale){this.writeNode("sld:MinScaleDenominator",layer.options.maxScale,node);}
+if(layer.options.minScale){this.writeNode("sld:MaxScaleDenominator",layer.options.minScale,node);}
+this.nestingLayerLookup[layer.name]=node;return node;}},"_WFS":function(layer){var node=this.createElementNSPlus("Layer",{attributes:{name:layer.protocol.featurePrefix+":"+layer.protocol.featureType,hidden:layer.visibility?"0":"1"}});this.writeNode("ows:Title",layer.name,node);this.writeNode("Server",{service:OpenLayers.Format.Context.serviceTypes.WFS,version:layer.protocol.version,url:layer.protocol.url},node);return node;},"_InlineGeometry":function(layer){var node=this.createElementNSPlus("Layer",{attributes:{name:this.featureType,hidden:layer.visibility?"0":"1"}});this.writeNode("ows:Title",layer.name,node);this.writeNode("InlineGeometry",layer,node);return node;},"_GML":function(layer){var node=this.createElementNSPlus("Layer");this.writeNode("ows:Title",layer.name,node);this.writeNode("Server",{service:OpenLayers.Format.Context.serviceTypes.GML,url:layer.protocol.url,version:layer.protocol.format.version},node);return node;},"_KML":function(layer){var node=this.createElementNSPlus("Layer");this.writeNode("ows:Title",layer.name,node);this.writeNode("Server",{service:OpenLayers.Format.Context.serviceTypes.KML,version:layer.protocol.format.version,url:layer.protocol.url},node);return node;}},"gml":OpenLayers.Util.applyDefaults({"boundedBy":function(bounds){var node=this.createElementNSPlus("gml:boundedBy");this.writeNode("gml:Box",bounds,node);return node;}},OpenLayers.Format.GML.v2.prototype.writers.gml),"ows":OpenLayers.Format.OWSCommon.v1_0_0.prototype.writers.ows,"sld":OpenLayers.Format.SLD.v1_0_0.prototype.writers.sld,"feature":OpenLayers.Format.GML.v2.prototype.writers.feature},CLASS_NAME:"OpenLayers.Format.OWSContext.v0_3_1"});
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/repository-license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/repository-license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/repository-license.txt	(revision 76)
@@ -0,0 +1,3 @@
+This license information is now available at:
+
+http://svn.openlayers.org/trunk/openlayers/license.txt
Index: /trunk/workshop-routing-foss4g/web/OpenLayers/release-license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/OpenLayers/release-license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/OpenLayers/release-license.txt	(revision 76)
@@ -0,0 +1,3 @@
+This license information is now available at:
+
+http://svn.openlayers.org/trunk/openlayers/license.txt
Index: /trunk/workshop-routing-foss4g/web/routing-final.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/routing-final.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/routing-final.html	(revision 76)
@@ -0,0 +1,140 @@
+<html>
+<head>
+
+<title>A Basic GeoExt Page</title>
+<script src="ext/adapter/ext/ext-base.js" type="text/javascript"></script>
+<script src="ext/ext-all.js"  type="text/javascript"></script>
+<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
+<script src="OpenLayers/OpenLayers.js" type="text/javascript"></script>
+<script src="GeoExt/script/GeoExt.js" type="text/javascript"></script>
+<link rel="stylesheet" type="text/css"
+      href="GeoExt/resources/css/geoext-all.css" />
+
+<script src="DrawPoints.js" type="text/javascript"></script>
+
+<script src="proj4js/lib/proj4js.js" type="text/javascript"></script>
+
+<script type="text/javascript">
+
+     // global projection objects (uses the proj4js lib)
+     var epsg_4326 = new OpenLayers.Projection("EPSG:4326"),
+         epsg_900913 = new OpenLayers.Projection("EPSG:900913");
+
+     function pgrouting(store, layer, method) {
+         if (layer.features.length == 2) {
+             // erase the previous route
+             store.removeAll();
+
+             // transform the two geometries from EPSG:900913 to EPSG:4326
+             var startpoint = layer.features[0].geometry.clone();
+             startpoint.transform(epsg_900913, epsg_4326);
+             var finalpoint = layer.features[1].geometry.clone();
+             finalpoint.transform(epsg_900913, epsg_4326);
+
+             // load to route
+             store.load({
+                 params: {
+                     startpoint: startpoint.x + " " + startpoint.y,
+                     finalpoint: finalpoint.x + " " + finalpoint.y,
+                     method: method
+                 }
+             });
+         }
+    }
+
+    Ext.onReady(function() {
+        // create the map panel
+        var panel = new GeoExt.MapPanel({
+            renderTo: "gxmap",
+            map: {
+                layers: [new OpenLayers.Layer.OSM("Simple OSM Map")]
+            },
+            center: [-11685000, 4827000],
+            zoom: 12,
+            height: 400,
+            width: 600,
+            title: "A Simple GeoExt Map"
+        });
+        var map = panel.map;
+
+        // create the layer where the route will be drawn
+        var route_layer = new OpenLayers.Layer.Vector("route", {
+            styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({
+                strokeColor: "#ff9933",
+                strokeWidth: 3
+            }))
+        });
+
+        // create the layer where the start and final points will be drawn
+        var points_layer = new OpenLayers.Layer.Vector("points");
+
+        // when a new point is added to the layer, call the pgrouting function
+        points_layer.events.on({
+            featureadded: function() {
+                pgrouting(store, points_layer, method.getValue());
+            }
+        });
+
+        // add the layers to the map
+        map.addLayers([points_layer, route_layer]);
+
+        // create the control to draw the points (see the DrawPoints.js file)
+        var draw_points = new DrawPoints(points_layer);
+
+        // create the control to move the points
+        var drag_points = new OpenLayers.Control.DragFeature(points_layer, {
+            autoActivate: true
+        });
+
+        // when a point is moved, call the pgrouting function
+        drag_points.onComplete = function() {
+              pgrouting(store, points_layer, method.getValue());
+        };
+
+        // add the controls to the map
+        map.addControls([draw_points, drag_points]);
+
+        // create the store to query the web service
+        var store = new GeoExt.data.FeatureStore({
+            layer: route_layer,
+            fields: [
+                {name: "length"}
+            ],
+            proxy: new GeoExt.data.ProtocolProxy({
+                protocol: new OpenLayers.Protocol.HTTP({
+                    url: "./php/pgrouting.php",
+                    format: new OpenLayers.Format.GeoJSON({
+                        internalProjection: epsg_900913,
+                        externalProjection: epsg_4326
+                    })
+                })
+            })
+        });
+
+        // create the method combo box
+        var method = new Ext.form.ComboBox({
+            renderTo: "method",
+            triggerAction: "all",
+            editable: false,
+            forceSelection: true,
+            store: [
+                ["SPD", "Shortest Path Dijkstra"],
+                ["SPA", "Shortest Path A*"],
+                ["SPS", "Shortest Path Shooting*"]
+            ],
+            listeners: {
+                select: function() {
+                    pgrouting(store, points_layer, method.getValue());
+                }
+            }
+        });
+        // default method is Shortest Path Dijkstra
+        method.setValue("SPD");
+    });
+</script>
+</head>
+<body>
+<div id="gxmap"></div>
+<div id="method"></div>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/DrawPoints.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/DrawPoints.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/DrawPoints.js	(revision 76)
@@ -0,0 +1,31 @@
+DrawPoints = OpenLayers.Class(OpenLayers.Control.DrawFeature, {
+
+    // this control is active by default
+    autoActivate: true,
+
+    initialize: function(layer, options) {
+        // only points can be drawn
+        var handler = OpenLayers.Handler.Point;
+        OpenLayers.Control.DrawFeature.prototype.initialize.apply(
+				this, [layer, handler, options]
+			);
+    },
+
+    drawFeature: function(geometry) {
+        OpenLayers.Control.DrawFeature.prototype.drawFeature.apply(
+				this, arguments	
+			);
+        if (this.layer.features.length == 1) {
+            // we just draw the startpoint
+            // note: if we want to apply a special style to the 
+            //       start point we should do this here
+        } else if (this.layer.features.length == 2) {
+            // we just draw the finalpoint
+            // note: if we want to apply a special style to the 
+            //       final point we should do this here
+
+            // we have all what we need; we can deactivate ourself.
+            this.deactivate();            
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/php/info.php
===================================================================
--- /trunk/workshop-routing-foss4g/web/php/info.php	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/php/info.php	(revision 76)
@@ -0,0 +1,6 @@
+<?php
+
+// Outputs information about PHP's configuration
+phpinfo();
+
+?>
Index: /trunk/workshop-routing-foss4g/web/php/pgrouting.php
===================================================================
--- /trunk/workshop-routing-foss4g/web/php/pgrouting.php	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/php/pgrouting.php	(revision 76)
@@ -0,0 +1,155 @@
+<?php
+
+   // Database connection settings
+   define("PG_DB"  , "routing");
+   define("PG_HOST", "localhost"); 
+   define("PG_USER", "postgres");
+   define("PG_PORT", "5432"); 
+   define("TABLE",   "ways");
+
+   // Retrieve start point
+   $start = split(' ',$_REQUEST['startpoint']);
+   $startPoint = array($start[0], $start[1]);
+
+   // Retrieve end point
+   $end = split(' ',$_REQUEST['finalpoint']);
+   $endPoint = array($end[0], $end[1]);
+   
+?>
+
+<?php
+
+   // Find the nearest edge
+   $startEdge = findNearestEdge($startPoint);
+   $endEdge   = findNearestEdge($endPoint);
+
+   // FUNCTION findNearestEdge
+   function findNearestEdge($lonlat) {
+
+      // Connect to database
+      $con = pg_connect("dbname=".PG_DB." host=".PG_HOST." user=".PG_USER);
+
+      $sql = "SELECT gid, source, target, the_geom, 
+		          distance(the_geom, GeometryFromText(
+	                   'POINT(".$lonlat[0]." ".$lonlat[1].")', 4326)) AS dist 
+	             FROM ".TABLE."  
+	             WHERE the_geom && setsrid(
+	                   'BOX3D(".($lonlat[0]-0.1)." 
+	                          ".($lonlat[1]-0.1).", 
+	                          ".($lonlat[0]+0.1)." 
+	                          ".($lonlat[1]+0.1).")'::box3d, 4326) 
+	             ORDER BY dist LIMIT 1";
+
+      $query = pg_query($con,$sql);  
+
+      $edge['gid']      = pg_fetch_result($query, 0, 0);  
+      $edge['source']   = pg_fetch_result($query, 0, 1);  
+      $edge['target']   = pg_fetch_result($query, 0, 2);  
+      $edge['the_geom'] = pg_fetch_result($query, 0, 3);  
+
+      // Close database connection
+      pg_close($con);
+
+      return $edge;
+   }
+   
+?>
+
+<?php
+
+   // Select the routing algorithm
+   switch($_REQUEST['method']) {
+
+      case 'SPD' : // Shortest Path Dijkstra 
+
+        $sql = "SELECT rt.gid, ST_AsGeoJSON(rt.the_geom) AS geojson, 
+	                 length(rt.the_geom) AS length, ".TABLE.".gid 
+	              FROM ".TABLE.", 
+	                  (SELECT gid, the_geom 
+	                      FROM dijkstra_sp_delta(
+	                          '".TABLE."',
+	                          ".$startEdge['source'].",
+	                          ".$endEdge['target'].",
+	                          0.1)
+	                   ) as rt 
+	              WHERE ".TABLE.".gid=rt.gid;";
+        break;
+        
+      case 'SPA' : // Shortest Path A* 
+
+        $sql = "SELECT rt.gid, ST_AsGeoJSON(rt.the_geom) AS geojson, 
+	                   length(rt.the_geom) AS length, ".TABLE.".gid 
+	                FROM ".TABLE.", 
+	                    (SELECT gid, the_geom 
+	                        FROM astar_sp_delta(
+	                            '".TABLE."',
+	                            ".$startEdge['source'].",
+	                            ".$endEdge['target'].",
+	                            0.1)
+	                     ) as rt 
+	                WHERE ".TABLE.".gid=rt.gid;";  
+        break;
+
+      case 'SPS' : // Shortest Path Shooting*
+
+        $sql = "SELECT rt.gid, ST_AsGeoJSON(rt.the_geom) AS geojson, 
+	                   length(rt.the_geom) AS length, ".TABLE.".gid 
+	                FROM ".TABLE.", 
+	                    (SELECT gid, the_geom 
+	                        FROM shootingstar_sp(
+	                            '".TABLE."',
+	                            ".$startEdge['gid'].",
+	                            ".$endEdge['gid'].",
+	                            0.1, 'length', true, true)
+	                     ) as rt 
+	                WHERE ".TABLE.".gid=rt.gid;";
+        break;   
+
+   } // close switch
+
+   // Connect to database
+   $dbcon = pg_connect("dbname=".PG_DB." host=".PG_HOST." user=".PG_USER);
+
+   // Perform database query
+   $query = pg_query($dbcon,$sql); 
+   
+?>
+
+<?php
+
+   // Return route as GeoJSON
+   $geojson = array(
+      'type'      => 'FeatureCollection',
+      'features'  => array()
+   ); 
+  
+   // Add edges to GeoJSON array
+   while($edge=pg_fetch_assoc($query)) {  
+
+      $feature = array(
+         'type' => 'Feature',
+         'geometry' => json_decode($edge['geojson'], true),
+         'crs' => array(
+            'type' => 'EPSG',
+            'properties' => array('code' => '4326')
+         ),
+         'properties' => array(
+            'id' => $edge['id'],
+            'length' => $edge['length']
+         )
+      );
+      
+      // Add feature array to feature collection array
+      array_push($geojson['features'], $feature);
+   }
+
+	
+   // Close database connection
+   pg_close($dbcon);
+
+   // Return routing result
+   header('Content-type: application/json',true);
+   echo json_encode($geojson);
+   
+?>
+
Index: /trunk/workshop-routing-foss4g/web/routing-0.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/routing-0.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/routing-0.html	(revision 76)
@@ -0,0 +1,32 @@
+<html>
+<head>
+
+<title>A Basic GeoExt Page</title>
+<script src="ext/adapter/ext/ext-base.js" type="text/javascript"></script>
+<script src="ext/ext-all.js"  type="text/javascript"></script>
+<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
+<script src="OpenLayers/OpenLayers.js" type="text/javascript"></script>
+<script src="GeoExt/script/GeoExt.js" type="text/javascript"></script>
+<link rel="stylesheet" type="text/css"
+      href="GeoExt/resources/css/geoext-all.css" />
+
+<script type="text/javascript">
+    Ext.onReady(function() {
+        var panel = new GeoExt.MapPanel({
+            renderTo: 'gxmap',
+            map: {
+                layers: [new OpenLayers.Layer.OSM("Simple OSM Map")]
+            },
+            center: [-11685000, 4827000],
+            zoom: 12,
+            height: 400,
+            width: 600,
+            title: 'A Simple GeoExt Map'
+        });
+    });
+</script>
+</head>
+<body>
+<div id="gxmap"></div>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/license.txt	(revision 76)
@@ -0,0 +1,44 @@
+This license applies to all code and content hosted in the "core" directory of
+this repository (http://svn.geoext.org/core/) - including the "trunk",
+"branches", and "tags" subdirectories. This license does not apply to external
+code and content which may be checked out in working copies (due to
+svn:externals properties on subdirectories).
+
+License
+=======
+
+Copyright (c) 2008-2010, The Open Source Geospatial Foundation
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright notice,
+      this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright
+      notice, this list of conditions and the following disclaimer in the
+      documentation and/or other materials provided with the distribution.
+    * Neither the name of the Open Source Geospatial Foundation nor the names
+      of its contributors may be used to endorse or promote products derived
+      from this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGE.
+
+
+
+Notice about ExtJS
+==================
+
+The GeoExt library is for use with the ExtJS library.  ExtJS is distributed
+under the terms of the GPL v3.  See http://www.sencha.com/products/license.php
+for details on ExtJS licensing.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/script/GeoExt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/script/GeoExt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/script/GeoExt.js	(revision 76)
@@ -0,0 +1,331 @@
+/*
+
+Copyright (c) 2008-2010, The Open Source Geospatial Foundation
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright notice,
+      this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright
+      notice, this list of conditions and the following disclaimer in the
+      documentation and/or other materials provided with the distribution.
+    * Neither the name of the Open Source Geospatial Foundation nor the names
+      of its contributors may be used to endorse or promote products derived
+      from this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGE.
+
+*/
+
+Ext.namespace('GeoExt');GeoExt.LayerLegend=Ext.extend(Ext.Container,{layerRecord:null,showTitle:true,legendTitle:null,labelCls:null,layerStore:null,initComponent:function(){GeoExt.LayerLegend.superclass.initComponent.call(this);this.autoEl={};this.add({xtype:"label",text:this.getLayerTitle(this.layerRecord),cls:'x-form-item x-form-item-label'+
+(this.labelCls?' '+this.labelCls:'')});if(this.layerRecord&&this.layerRecord.store){this.layerStore=this.layerRecord.store;this.layerStore.on("update",this.onStoreUpdate,this);}},onStoreUpdate:function(store,record,operation){if(record===this.layerRecord&&this.items.getCount()>0){var layer=record.getLayer();this.setVisible(layer.getVisibility()&&layer.calculateInRange()&&layer.displayInLayerSwitcher&&!record.get('hideInLegend'));this.update();}},update:function(){var title=this.getLayerTitle(this.layerRecord);if(this.items.get(0).text!==title){this.items.get(0).setText(title);}},getLayerTitle:function(record){var title=this.legendTitle||"";if(this.showTitle&&!title){if(record&&!record.get("hideTitle")){title=record.get("title")||record.get("name")||record.getLayer().name||"";}}
+return title;},beforeDestroy:function(){this.layerStore&&this.layerStore.un("update",this.onStoreUpdate,this);GeoExt.LayerLegend.superclass.beforeDestroy.apply(this,arguments);}});GeoExt.LayerLegend.getTypes=function(layerRecord,preferredTypes){var types=(preferredTypes||[]).concat();var goodTypes=[];for(var type in GeoExt.LayerLegend.types){if(GeoExt.LayerLegend.types[type].supports(layerRecord)){types.indexOf(type)==-1&&goodTypes.push(type);}else{types.remove(type);}}
+return types.concat(goodTypes);};GeoExt.LayerLegend.supports=function(layerRecord){};GeoExt.LayerLegend.types={};Ext.namespace('GeoExt');GeoExt.VectorLegend=Ext.extend(GeoExt.LayerLegend,{layerRecord:null,layer:null,rules:null,symbolType:null,untitledPrefix:"Untitled ",clickableSymbol:false,clickableTitle:false,selectOnClick:false,enableDD:false,bodyBorder:false,feature:null,selectedRule:null,currentScaleDenominator:null,initComponent:function(){GeoExt.VectorLegend.superclass.initComponent.call(this);if(this.layerRecord){this.layer=this.layerRecord.getLayer();if(this.layer.map){this.currentScaleDenominator=this.layer.map.getScale();this.layer.map.events.on({"zoomend":this.onMapZoom,scope:this});}}
+if(!this.symbolType){if(this.feature){this.symbolType=this.symbolTypeFromFeature(this.feature);}else if(this.layer){if(this.layer.features.length>0){var feature=this.layer.features[0].clone();feature.attributes={};this.feature=feature;this.symbolType=this.symbolTypeFromFeature(this.feature);}else{this.layer.events.on({featuresadded:this.onFeaturesAdded,scope:this});}}}
+if(this.layer&&this.feature&&!this.rules){this.setRules();}
+this.rulesContainer=new Ext.Container({autoEl:{}});this.add(this.rulesContainer);this.addEvents("titleclick","symbolclick","ruleclick","ruleselected","ruleunselected","rulemoved");this.update();},onMapZoom:function(){this.setCurrentScaleDenominator(this.layer.map.getScale());},symbolTypeFromFeature:function(feature){var match=feature.geometry.CLASS_NAME.match(/Point|Line|Polygon/);return(match&&match[0])||"Point";},onFeaturesAdded:function(){this.layer.events.un({featuresadded:this.onFeaturesAdded,scope:this});var feature=this.layer.features[0].clone();feature.attributes={};this.feature=feature;this.symbolType=this.symbolTypeFromFeature(this.feature);if(!this.rules){this.setRules();}
+this.update();},setRules:function(){var style=this.layer.styleMap&&this.layer.styleMap.styles["default"];if(!style){style=new OpenLayers.Style();}
+if(style.rules.length===0){this.rules=[new OpenLayers.Rule({symbolizer:style.createSymbolizer(this.feature)})];}else{this.rules=style.rules;}},setCurrentScaleDenominator:function(scale){if(scale!==this.currentScaleDenominator){this.currentScaleDenominator=scale;this.update();}},getRuleEntry:function(rule){return this.rulesContainer.items.get(this.rules.indexOf(rule));},addRuleEntry:function(rule,noDoLayout){this.rulesContainer.add(this.createRuleEntry(rule));if(!noDoLayout){this.doLayout();}},removeRuleEntry:function(rule,noDoLayout){var ruleEntry=this.getRuleEntry(rule);if(ruleEntry){this.rulesContainer.remove(ruleEntry);if(!noDoLayout){this.doLayout();}}},selectRuleEntry:function(rule){var newSelection=rule!=this.selectedRule;if(this.selectedRule){this.unselect();}
+if(newSelection){var ruleEntry=this.getRuleEntry(rule);ruleEntry.body.addClass("x-grid3-row-selected");this.selectedRule=rule;this.fireEvent("ruleselected",this,rule);}},unselect:function(){this.rulesContainer.items.each(function(item,i){if(this.rules[i]==this.selectedRule){item.body.removeClass("x-grid3-row-selected");this.selectedRule=null;this.fireEvent("ruleunselected",this,this.rules[i]);}},this);},createRuleEntry:function(rule){var applies=true;if(this.currentScaleDenominator!=null){if(rule.minScaleDenominator){applies=applies&&(this.currentScaleDenominator>=rule.minScaleDenominator);}
+if(rule.maxScaleDenominator){applies=applies&&(this.currentScaleDenominator<rule.maxScaleDenominator);}}
+return{xtype:"panel",layout:"column",border:false,hidden:!applies,bodyStyle:this.selectOnClick?{cursor:"pointer"}:undefined,defaults:{border:false},items:[this.createRuleRenderer(rule),this.createRuleTitle(rule)],listeners:{render:function(comp){this.selectOnClick&&comp.getEl().on({click:function(comp){this.selectRuleEntry(rule);},scope:this});if(this.enableDD==true){this.addDD(comp);}},scope:this}};},createRuleRenderer:function(rule){var types=[this.symbolType,"Point","Line","Polygon"];var type,haveType;var symbolizers=rule.symbolizers;if(!symbolizers){var symbolizer=rule.symbolizer;for(var i=0,len=types.length;i<len;++i){type=types[i];if(symbolizer[type]){symbolizer=symbolizer[type];haveType=true;break;}}
+symbolizers=[symbolizer];}else{var Type;outer:for(var i=0,ii=types.length;i<ii;++i){type=types[i];Type=OpenLayers.Symbolizer[type];if(Type){for(var j=0,jj=symbolizers.length;j<jj;++j){if(symbolizers[j]instanceof Type){haveType=true;break outer;}}}}}
+return{xtype:"gx_renderer",symbolType:haveType?type:this.symbolType,symbolizers:symbolizers,style:this.clickableSymbol?{cursor:"pointer"}:undefined,listeners:{click:function(){if(this.clickableSymbol){this.fireEvent("symbolclick",this,rule);this.fireEvent("ruleclick",this,rule);}},scope:this}};},createRuleTitle:function(rule){return{cls:"x-form-item",style:"padding: 0.2em 0.5em 0;",bodyStyle:Ext.applyIf({background:"transparent"},this.clickableTitle?{cursor:"pointer"}:undefined),html:this.getRuleTitle(rule),listeners:{render:function(comp){this.clickableTitle&&comp.getEl().on({click:function(){this.fireEvent("titleclick",this,rule);this.fireEvent("ruleclick",this,rule);},scope:this});},scope:this}};},addDD:function(component){var ct=component.ownerCt;var panel=this;new Ext.dd.DragSource(component.getEl(),{ddGroup:ct.id,onDragOut:function(e,targetId){var target=Ext.getCmp(targetId);target.removeClass("gx-ruledrag-insert-above");target.removeClass("gx-ruledrag-insert-below");return Ext.dd.DragZone.prototype.onDragOut.apply(this,arguments);},onDragEnter:function(e,targetId){var target=Ext.getCmp(targetId);var cls;var sourcePos=ct.items.indexOf(component);var targetPos=ct.items.indexOf(target);if(sourcePos>targetPos){cls="gx-ruledrag-insert-above";}else if(sourcePos<targetPos){cls="gx-ruledrag-insert-below";}
+cls&&target.addClass(cls);return Ext.dd.DragZone.prototype.onDragEnter.apply(this,arguments);},onDragDrop:function(e,targetId){panel.moveRule(ct.items.indexOf(component),ct.items.indexOf(Ext.getCmp(targetId)));return Ext.dd.DragZone.prototype.onDragDrop.apply(this,arguments);},getDragData:function(e){var sourceEl=e.getTarget(".x-column-inner");if(sourceEl){var d=sourceEl.cloneNode(true);d.id=Ext.id();return{sourceEl:sourceEl,repairXY:Ext.fly(sourceEl).getXY(),ddel:d}}}});new Ext.dd.DropTarget(component.getEl(),{ddGroup:ct.id,notifyDrop:function(){return true;}});},update:function(){GeoExt.VectorLegend.superclass.update.apply(this,arguments);if(this.symbolType&&this.rules){if(this.rulesContainer.items){var comp;for(var i=this.rulesContainer.items.length-1;i>=0;--i){comp=this.rulesContainer.getComponent(i);this.rulesContainer.remove(comp,true);}}
+for(var i=0,ii=this.rules.length;i<ii;++i){this.addRuleEntry(this.rules[i],true);}
+this.doLayout();if(this.selectedRule){this.getRuleEntry(this.selectedRule).body.addClass("x-grid3-row-selected");}}},updateRuleEntry:function(rule){var ruleEntry=this.getRuleEntry(rule);if(ruleEntry){ruleEntry.removeAll();ruleEntry.add(this.createRuleRenderer(rule));ruleEntry.add(this.createRuleTitle(rule));ruleEntry.doLayout();}},moveRule:function(sourcePos,targetPos){var srcRule=this.rules[sourcePos];this.rules.splice(sourcePos,1);this.rules.splice(targetPos,0,srcRule);this.update();this.fireEvent("rulemoved",this,srcRule);},getRuleTitle:function(rule){var title=rule.title||rule.name||"";if(!title&&this.untitledPrefix){title=this.untitledPrefix+(this.rules.indexOf(rule)+1);}
+return title;},beforeDestroy:function(){if(this.layer){if(this.layer.events){this.layer.events.un({featuresadded:this.onFeaturesAdded,scope:this});}
+if(this.layer.map&&this.layer.map.events){this.layer.map.events.un({"zoomend":this.onMapZoom,scope:this});}}
+delete this.layer;delete this.rules;GeoExt.VectorLegend.superclass.beforeDestroy.apply(this,arguments);}});GeoExt.VectorLegend.supports=function(layerRecord){return layerRecord.getLayer()instanceof OpenLayers.Layer.Vector;};GeoExt.LayerLegend.types["gx_vectorlegend"]=GeoExt.VectorLegend;Ext.reg("gx_vectorlegend",GeoExt.VectorLegend);Ext.namespace("GeoExt.tree");GeoExt.tree.LayerContainer=Ext.extend(Ext.tree.AsyncTreeNode,{constructor:function(config){config=Ext.applyIf(config||{},{text:"Layers"});this.loader=config.loader instanceof GeoExt.tree.LayerLoader?config.loader:new GeoExt.tree.LayerLoader(Ext.applyIf(config.loader||{},{store:config.layerStore}));GeoExt.tree.LayerContainer.superclass.constructor.call(this,config);},recordIndexToNodeIndex:function(index){var store=this.loader.store;var count=store.getCount();var nodeCount=this.childNodes.length;var nodeIndex=-1;for(var i=count-1;i>=0;--i){if(this.loader.filter(store.getAt(i))===true){++nodeIndex;if(index===i||nodeIndex>nodeCount-1){break;}}}
+return nodeIndex;},destroy:function(){delete this.layerStore;GeoExt.tree.LayerContainer.superclass.destroy.apply(this,arguments);}});Ext.tree.TreePanel.nodeTypes.gx_layercontainer=GeoExt.tree.LayerContainer;Ext.namespace("GeoExt.tree");GeoExt.tree.BaseLayerContainer=Ext.extend(GeoExt.tree.LayerContainer,{constructor:function(config){config=Ext.applyIf(config||{},{text:"Base Layer",loader:{}});config.loader=Ext.applyIf(config.loader,{baseAttrs:Ext.applyIf(config.loader.baseAttrs||{},{iconCls:'gx-tree-baselayer-icon',checkedGroup:'baselayer'}),filter:function(record){var layer=record.getLayer();return layer.displayInLayerSwitcher===true&&layer.isBaseLayer===true;}});GeoExt.tree.BaseLayerContainer.superclass.constructor.call(this,config);}});Ext.tree.TreePanel.nodeTypes.gx_baselayercontainer=GeoExt.tree.BaseLayerContainer;Ext.namespace("GeoExt.plugins");GeoExt.plugins.PrintExtent=Ext.extend(Ext.util.Observable,{initialConfig:null,printProvider:null,map:null,layer:null,control:null,pages:null,page:null,constructor:function(config){config=config||{};Ext.apply(this,config);this.initialConfig=config;if(!this.printProvider){this.printProvider=this.pages[0].printProvider;}
+if(!this.pages){this.pages=[];}
+this.addEvents("selectpage");GeoExt.plugins.PrintExtent.superclass.constructor.apply(this,arguments);},print:function(options){this.printProvider.print(this.map,this.pages,options);},init:function(mapPanel){this.map=mapPanel.map;mapPanel.on("destroy",this.onMapPanelDestroy,this);if(!this.layer){this.layer=new OpenLayers.Layer.Vector(null,{displayInLayerSwitcher:false});}
+this.createControl();for(var i=0,len=this.pages.length;i<len;++i){this.addPage(this.pages[i]);}
+this.show();},addPage:function(page){page=page||new GeoExt.data.PrintPage({printProvider:this.printProvider});if(this.pages.indexOf(page)===-1){this.pages.push(page);}
+this.layer.addFeatures([page.feature]);page.on("change",this.onPageChange,this);this.page=page;var map=this.map;if(map.getCenter()){this.fitPage();}else{map.events.register("moveend",this,function(){map.events.unregister("moveend",this,arguments.callee);this.fitPage();});}
+return page;},removePage:function(page){this.pages.remove(page);if(page.feature.layer){this.layer.removeFeatures([page.feature]);}
+page.un("change",this.onPageChange,this);},selectPage:function(page){this.control.active&&this.control.setFeature(page.feature);},show:function(){this.map.addLayer(this.layer);this.map.addControl(this.control);this.control.activate();if(this.page&&this.map.getCenter()){this.updateBox();}},hide:function(){var map=this.map;var control=this.control;if(control&&control.events){control.deactivate();if(map&&map.events&&control.map){map.removeControl(control);}}
+var layer=this.layer;if(!this.initialConfig.layer&&map&&map.events&&layer&&layer.map){map.removeLayer(layer);}},onMapPanelDestroy:function(){var map=this.map;for(var len=this.pages.length-1,i=len;i>=0;i--){this.removePage(this.pages[i]);}
+this.hide();var control=this.control;if(map&&map.events&&control&&control.events){control.destroy();}
+var layer=this.layer;if(!this.initialConfig.layer&&map&&map.events&&layer&&layer.events){layer.destroy();}
+delete this.layer;delete this.control;delete this.page;this.map=null;},createControl:function(){this.control=new OpenLayers.Control.TransformFeature(this.layer,{preserveAspectRatio:true,eventListeners:{"beforesetfeature":function(e){for(var i=0,len=this.pages.length;i<len;++i){if(this.pages[i].feature===e.feature){this.page=this.pages[i];e.object.rotation=-this.pages[i].rotation;break;}}},"setfeature":function(e){for(var i=0,len=this.pages.length;i<len;++i){if(this.pages[i].feature===e.feature){this.fireEvent("selectpage",this.pages[i]);break;}}},"beforetransform":function(e){this._updating=true;var page=this.page;if(e.rotation){if(this.printProvider.layout.get("rotation")){page.setRotation(-e.object.rotation);}else{e.object.setFeature(page.feature);}}else if(e.center){page.setCenter(OpenLayers.LonLat.fromString(e.center.toShortString()));}else{page.fit(e.object.box,{mode:"closest"});var minScale=this.printProvider.scales.getAt(0);var maxScale=this.printProvider.scales.getAt(this.printProvider.scales.getCount()-1);var boxBounds=e.object.box.geometry.getBounds();var pageBounds=page.feature.geometry.getBounds();var tooLarge=page.scale===minScale&&boxBounds.containsBounds(pageBounds);var tooSmall=page.scale===maxScale&&pageBounds.containsBounds(boxBounds);if(tooLarge===true||tooSmall===true){this.updateBox();}}
+delete this._updating;return false;},"transformcomplete":this.updateBox,scope:this}});},fitPage:function(){if(this.page){this.page.fit(this.map,{mode:"screen"});}},updateBox:function(){var page=this.page;this.control.active&&this.control.setFeature(page.feature,{rotation:-page.rotation});},onPageChange:function(page,mods){if(!this._updating){this.control.active&&this.control.setFeature(page.feature,{rotation:-page.rotation});}}});Ext.preg("gx_printextent",GeoExt.plugins.PrintExtent);Ext.namespace("GeoExt");GeoExt.SliderTip=Ext.extend(Ext.slider.Tip,{hover:true,minWidth:10,offsets:[0,-10],dragging:false,init:function(slider){GeoExt.SliderTip.superclass.init.apply(this,arguments);if(this.hover){slider.on("render",this.registerThumbListeners,this);}
+this.slider=slider;},registerThumbListeners:function(){var thumb,el;for(var i=0,ii=this.slider.thumbs.length;i<ii;++i){thumb=this.slider.thumbs[i];el=thumb.tracker.el;(function(thumb,el){el.on({mouseover:function(e){this.onSlide(this.slider,e,thumb);this.dragging=false;},mouseout:function(){if(!this.dragging){this.hide.apply(this,arguments);}},scope:this})}).apply(this,[thumb,el]);}},onSlide:function(slider,e,thumb){this.dragging=true;return GeoExt.SliderTip.superclass.onSlide.apply(this,arguments);}});Ext.namespace("GeoExt");GeoExt.ZoomSlider=Ext.extend(Ext.Slider,{map:null,baseCls:"gx-zoomslider",aggressive:false,updating:false,initComponent:function(){GeoExt.ZoomSlider.superclass.initComponent.call(this);if(this.map){if(this.map instanceof GeoExt.MapPanel){this.map=this.map.map;}
+this.bind(this.map);}
+if(this.aggressive===true){this.on('change',this.changeHandler,this);}else{this.on('changecomplete',this.changeHandler,this);}
+this.on("beforedestroy",this.unbind,this);},onRender:function(){GeoExt.ZoomSlider.superclass.onRender.apply(this,arguments);this.el.addClass(this.baseCls);},afterRender:function(){Ext.Slider.superclass.afterRender.apply(this,arguments);this.update();},addToMapPanel:function(panel){this.on({render:function(){var el=this.getEl();el.setStyle({position:"absolute",zIndex:panel.map.Z_INDEX_BASE.Control});el.on({mousedown:this.stopMouseEvents,click:this.stopMouseEvents});},afterrender:function(){this.bind(panel.map);},scope:this});},stopMouseEvents:function(e){e.stopEvent();},removeFromMapPanel:function(panel){var el=this.getEl();el.un("mousedown",this.stopMouseEvents,this);el.un("click",this.stopMouseEvents,this);this.unbind();},bind:function(map){this.map=map;this.map.events.on({zoomend:this.update,changebaselayer:this.initZoomValues,scope:this});if(this.map.baseLayer){this.initZoomValues();this.update();}},unbind:function(){if(this.map){this.map.events.un({zoomend:this.update,changebaselayer:this.initZoomValues,scope:this});}},initZoomValues:function(){var layer=this.map.baseLayer;if(this.initialConfig.minValue===undefined){this.minValue=layer.minZoomLevel||0;}
+if(this.initialConfig.maxValue===undefined){this.maxValue=layer.minZoomLevel==null?layer.numZoomLevels-1:layer.maxZoomLevel;}},getZoom:function(){return this.getValue();},getScale:function(){return OpenLayers.Util.getScaleFromResolution(this.map.getResolutionForZoom(this.getValue()),this.map.getUnits());},getResolution:function(){return this.map.getResolutionForZoom(this.getValue());},changeHandler:function(){if(this.map&&!this.updating){this.map.zoomTo(this.getValue());}},update:function(){if(this.rendered&&this.map){this.updating=true;this.setValue(this.map.getZoom());this.updating=false;}}});Ext.reg('gx_zoomslider',GeoExt.ZoomSlider);Ext.namespace("GeoExt.tree");GeoExt.tree.WMSCapabilitiesLoader=function(config){Ext.apply(this,config);GeoExt.tree.WMSCapabilitiesLoader.superclass.constructor.call(this);};Ext.extend(GeoExt.tree.WMSCapabilitiesLoader,Ext.tree.TreeLoader,{url:null,layerOptions:null,layerParams:null,requestMethod:'GET',getParams:function(node){return{'service':'WMS','request':'GetCapabilities'};},processResponse:function(response,node,callback,scope){var capabilities=new OpenLayers.Format.WMSCapabilities().read(response.responseXML||response.responseText);this.processLayer(capabilities.capability,capabilities.capability.request.getmap.href,node);if(typeof callback=="function"){callback.apply(scope||node,[node]);}},createWMSLayer:function(layer,url){if(layer.name){return new OpenLayers.Layer.WMS(layer.title,url,OpenLayers.Util.extend({formats:layer.formats[0],layers:layer.name},this.layerParams),OpenLayers.Util.extend({minScale:layer.minScale,queryable:layer.queryable,maxScale:layer.maxScale,metadata:layer},this.layerOptions));}else{return null;}},processLayer:function(layer,url,node){Ext.each(layer.nestedLayers,function(el){var n=this.createNode({text:el.title||el.name,nodeType:'node',layer:this.createWMSLayer(el,url),leaf:(el.nestedLayers.length===0)});if(n){node.appendChild(n);}
+if(el.nestedLayers){this.processLayer(el,url,n);}},this);}});Ext.namespace("GeoExt.data");GeoExt.data.WMSCapabilitiesReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WMSCapabilities();}
+if(typeof recordType!=="function"){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||[{name:"name",type:"string"},{name:"title",type:"string"},{name:"abstract",type:"string"},{name:"queryable",type:"boolean"},{name:"opaque",type:"boolean"},{name:"noSubsets",type:"boolean"},{name:"cascaded",type:"int"},{name:"fixedWidth",type:"int"},{name:"fixedHeight",type:"int"},{name:"minScale",type:"float"},{name:"maxScale",type:"float"},{name:"prefix",type:"string"},{name:"formats"},{name:"styles"},{name:"srs"},{name:"dimensions"},{name:"bbox"},{name:"llbbox"},{name:"attribution"},{name:"keywords"},{name:"identifiers"},{name:"authorityURLs"},{name:"metadataURLs"}]);}
+GeoExt.data.WMSCapabilitiesReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.WMSCapabilitiesReader,Ext.data.DataReader,{attributionCls:"gx-attribution",read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},serviceExceptionFormat:function(formats){if(OpenLayers.Util.indexOf(formats,"application/vnd.ogc.se_inimage")>-1){return"application/vnd.ogc.se_inimage";}
+if(OpenLayers.Util.indexOf(formats,"application/vnd.ogc.se_xml")>-1){return"application/vnd.ogc.se_xml";}
+return formats[0];},imageFormat:function(layer){var formats=layer.formats;if(layer.opaque&&OpenLayers.Util.indexOf(formats,"image/jpeg")>-1){return"image/jpeg";}
+if(OpenLayers.Util.indexOf(formats,"image/png")>-1){return"image/png";}
+if(OpenLayers.Util.indexOf(formats,"image/png; mode=24bit")>-1){return"image/png; mode=24bit";}
+if(OpenLayers.Util.indexOf(formats,"image/gif")>-1){return"image/gif";}
+return formats[0];},imageTransparent:function(layer){return layer.opaque==undefined||!layer.opaque;},readRecords:function(data){if(typeof data==="string"||data.nodeType){data=this.meta.format.read(data);}
+var version=data.version;var capability=data.capability||{};var url=capability.request&&capability.request.getmap&&capability.request.getmap.href;var layers=capability.layers;var formats=capability.exception?capability.exception.formats:[];var exceptions=this.serviceExceptionFormat(formats);var records=[];if(url&&layers){var fields=this.recordType.prototype.fields;var layer,values,options,params,field,v;for(var i=0,lenI=layers.length;i<lenI;i++){layer=layers[i];if(layer.name){values={};for(var j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];v=layer[field.mapping||field.name]||field.defaultValue;v=field.convert(v);values[field.name]=v;}
+options={attribution:layer.attribution?this.attributionMarkup(layer.attribution):undefined,minScale:layer.minScale,maxScale:layer.maxScale};if(this.meta.layerOptions){Ext.apply(options,this.meta.layerOptions);}
+params={layers:layer.name,exceptions:exceptions,format:this.imageFormat(layer),transparent:this.imageTransparent(layer),version:version};if(this.meta.layerParams){Ext.apply(params,this.meta.layerParams);}
+values.layer=new OpenLayers.Layer.WMS(layer.title||layer.name,url,params,options);records.push(new this.recordType(values,values.layer.id));}}}
+return{totalRecords:records.length,success:true,records:records};},attributionMarkup:function(attribution){var markup=[];if(attribution.logo){markup.push("<img class='"+this.attributionCls+"-image' "
++"src='"+attribution.logo.href+"' />");}
+if(attribution.title){markup.push("<span class='"+this.attributionCls+"-title'>"
++attribution.title
++"</span>");}
+if(attribution.href){for(var i=0;i<markup.length;i++){markup[i]="<a class='"
++this.attributionCls+"-link' "
++"href="
++attribution.href
++">"
++markup[i]
++"</a>";}}
+return markup.join(" ");}});Ext.namespace("GeoExt.data");GeoExt.data.LayerStoreMixin=function(){return{map:null,reader:null,constructor:function(config){config=config||{};config.reader=config.reader||new GeoExt.data.LayerReader({},config.fields);delete config.fields;var map=config.map instanceof GeoExt.MapPanel?config.map.map:config.map;delete config.map;if(config.layers){config.data=config.layers;}
+delete config.layers;var options={initDir:config.initDir};delete config.initDir;arguments.callee.superclass.constructor.call(this,config);if(map){this.bind(map,options);}},bind:function(map,options){if(this.map){return;}
+this.map=map;options=options||{};var initDir=options.initDir;if(options.initDir==undefined){initDir=GeoExt.data.LayerStore.MAP_TO_STORE|GeoExt.data.LayerStore.STORE_TO_MAP;}
+var layers=map.layers.slice(0);if(initDir&GeoExt.data.LayerStore.STORE_TO_MAP){this.each(function(record){this.map.addLayer(record.getLayer());},this);}
+if(initDir&GeoExt.data.LayerStore.MAP_TO_STORE){this.loadData(layers,true);}
+map.events.on({"changelayer":this.onChangeLayer,"addlayer":this.onAddLayer,"removelayer":this.onRemoveLayer,scope:this});this.on({"load":this.onLoad,"clear":this.onClear,"add":this.onAdd,"remove":this.onRemove,"update":this.onUpdate,scope:this});this.data.on({"replace":this.onReplace,scope:this});},unbind:function(){if(this.map){this.map.events.un({"changelayer":this.onChangeLayer,"addlayer":this.onAddLayer,"removelayer":this.onRemoveLayer,scope:this});this.un("load",this.onLoad,this);this.un("clear",this.onClear,this);this.un("add",this.onAdd,this);this.un("remove",this.onRemove,this);this.data.un("replace",this.onReplace,this);this.map=null;}},onChangeLayer:function(evt){var layer=evt.layer;var recordIndex=this.findBy(function(rec,id){return rec.getLayer()===layer;});if(recordIndex>-1){var record=this.getAt(recordIndex);if(evt.property==="order"){if(!this._adding&&!this._removing){var layerIndex=this.map.getLayerIndex(layer);if(layerIndex!==recordIndex){this._removing=true;this.remove(record);delete this._removing;this._adding=true;this.insert(layerIndex,[record]);delete this._adding;}}}else if(evt.property==="name"){record.set("title",layer.name);}else{this.fireEvent("update",this,record,Ext.data.Record.EDIT);}}},onAddLayer:function(evt){if(!this._adding){var layer=evt.layer;this._adding=true;this.loadData([layer],true);delete this._adding;}},onRemoveLayer:function(evt){if(this.map.unloadDestroy){if(!this._removing){var layer=evt.layer;this._removing=true;this.remove(this.getById(layer.id));delete this._removing;}}else{this.unbind();}},onLoad:function(store,records,options){if(!Ext.isArray(records)){records=[records];}
+if(options&&!options.add){this._removing=true;for(var i=this.map.layers.length-1;i>=0;i--){this.map.removeLayer(this.map.layers[i]);}
+delete this._removing;var len=records.length;if(len>0){var layers=new Array(len);for(var j=0;j<len;j++){layers[j]=records[j].getLayer();}
+this._adding=true;this.map.addLayers(layers);delete this._adding;}}},onClear:function(store){this._removing=true;for(var i=this.map.layers.length-1;i>=0;i--){this.map.removeLayer(this.map.layers[i]);}
+delete this._removing;},onAdd:function(store,records,index){if(!this._adding){this._adding=true;var layer;for(var i=records.length-1;i>=0;--i){layer=records[i].getLayer();this.map.addLayer(layer);if(index!==this.map.layers.length-1){this.map.setLayerIndex(layer,index);}}
+delete this._adding;}},onRemove:function(store,record,index){if(!this._removing){var layer=record.getLayer();if(this.map.getLayer(layer.id)!=null){this._removing=true;this.removeMapLayer(record);delete this._removing;}}},onUpdate:function(store,record,operation){if(operation===Ext.data.Record.EDIT){if(record.modified&&record.modified.title){var layer=record.getLayer();var title=record.get("title");if(title!==layer.name){layer.setName(title);}}}},removeMapLayer:function(record){this.map.removeLayer(record.getLayer());},onReplace:function(key,oldRecord,newRecord){this.removeMapLayer(oldRecord);},getByLayer:function(layer){var index=this.findBy(function(r){return r.getLayer()===layer;});if(index>-1){return this.getAt(index);}},destroy:function(){this.unbind();GeoExt.data.LayerStore.superclass.destroy.call(this);}};};GeoExt.data.LayerStore=Ext.extend(Ext.data.Store,new GeoExt.data.LayerStoreMixin);GeoExt.data.LayerStore.MAP_TO_STORE=1;GeoExt.data.LayerStore.STORE_TO_MAP=2;Ext.namespace("GeoExt.tree");GeoExt.tree.LayerLoader=function(config){Ext.apply(this,config);this.addEvents("beforeload","load");GeoExt.tree.LayerLoader.superclass.constructor.call(this);};Ext.extend(GeoExt.tree.LayerLoader,Ext.util.Observable,{store:null,filter:function(record){return record.getLayer().displayInLayerSwitcher==true;},baseAttrs:null,uiProviders:null,load:function(node,callback){if(this.fireEvent("beforeload",this,node)){this.removeStoreHandlers();while(node.firstChild){node.removeChild(node.firstChild);}
+if(!this.uiProviders){this.uiProviders=node.getOwnerTree().getLoader().uiProviders;}
+if(!this.store){this.store=GeoExt.MapPanel.guess().layers;}
+this.store.each(function(record){this.addLayerNode(node,record);},this);this.addStoreHandlers(node);if(typeof callback=="function"){callback();}
+this.fireEvent("load",this,node);}},onStoreAdd:function(store,records,index,node){if(!this._reordering){var nodeIndex=node.recordIndexToNodeIndex(index+records.length-1);for(var i=0;i<records.length;++i){this.addLayerNode(node,records[i],nodeIndex);}}},onStoreRemove:function(store,record,index,node){if(!this._reordering){this.removeLayerNode(node,record);}},addLayerNode:function(node,layerRecord,index){index=index||0;if(this.filter(layerRecord)===true){var child=this.createNode({nodeType:'gx_layer',layer:layerRecord.getLayer(),layerStore:this.store});var sibling=node.item(index);if(sibling){node.insertBefore(child,sibling);}else{node.appendChild(child);}
+child.on("move",this.onChildMove,this);}},removeLayerNode:function(node,layerRecord){if(this.filter(layerRecord)===true){var child=node.findChildBy(function(node){return node.layer==layerRecord.getLayer();});if(child){child.un("move",this.onChildMove,this);child.remove();node.reload();}}},onChildMove:function(tree,node,oldParent,newParent,index){this._reordering=true;var record=this.store.getByLayer(node.layer);if(newParent instanceof GeoExt.tree.LayerContainer&&this.store===newParent.loader.store){newParent.loader._reordering=true;this.store.remove(record);var newRecordIndex;if(newParent.childNodes.length>1){var searchIndex=(index===0)?index+1:index-1;newRecordIndex=this.store.findBy(function(r){return newParent.childNodes[searchIndex].layer===r.getLayer();});index===0&&newRecordIndex++;}else if(oldParent.parentNode===newParent.parentNode){var prev=newParent;do{prev=prev.previousSibling;}while(prev&&!(prev instanceof GeoExt.tree.LayerContainer&&prev.lastChild));if(prev){newRecordIndex=this.store.findBy(function(r){return prev.lastChild.layer===r.getLayer();});}else{var next=newParent;do{next=next.nextSibling;}while(next&&!(next instanceof GeoExt.tree.LayerContainer&&next.firstChild));if(next){newRecordIndex=this.store.findBy(function(r){return next.firstChild.layer===r.getLayer();});}
+newRecordIndex++;}}
+if(newRecordIndex!==undefined){this.store.insert(newRecordIndex,[record]);window.setTimeout(function(){newParent.reload();oldParent.reload();});}else{this.store.insert(oldRecordIndex,[record]);}
+delete newParent.loader._reordering;}
+delete this._reordering;},addStoreHandlers:function(node){if(!this._storeHandlers){this._storeHandlers={"add":this.onStoreAdd.createDelegate(this,[node],true),"remove":this.onStoreRemove.createDelegate(this,[node],true)};for(var evt in this._storeHandlers){this.store.on(evt,this._storeHandlers[evt],this);}}},removeStoreHandlers:function(){if(this._storeHandlers){for(var evt in this._storeHandlers){this.store.un(evt,this._storeHandlers[evt],this);}
+delete this._storeHandlers;}},createNode:function(attr){if(this.baseAttrs){Ext.apply(attr,this.baseAttrs);}
+if(typeof attr.uiProvider=='string'){attr.uiProvider=this.uiProviders[attr.uiProvider]||eval(attr.uiProvider);}
+attr.nodeType=attr.nodeType||"gx_layer";return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);},destroy:function(){this.removeStoreHandlers();}});Ext.namespace("GeoExt.plugins");GeoExt.plugins.PrintProviderField=Ext.extend(Ext.util.Observable,{target:null,constructor:function(config){this.initialConfig=config;Ext.apply(this,config);GeoExt.plugins.PrintProviderField.superclass.constructor.apply(this,arguments);},init:function(target){this.target=target;var onCfg={scope:this,"render":this.onRender,"beforedestroy":this.onBeforeDestroy};onCfg[target instanceof Ext.form.ComboBox?"select":"valid"]=this.onFieldChange;target.on(onCfg);},onRender:function(field){var printProvider=this.printProvider||field.ownerCt.printProvider;if(field.store===printProvider.layouts){field.setValue(printProvider.layout.get(field.displayField));printProvider.on({"layoutchange":this.onProviderChange,scope:this});}else if(field.store===printProvider.dpis){field.setValue(printProvider.dpi.get(field.displayField));printProvider.on({"dpichange":this.onProviderChange,scope:this});}else if(field.initialConfig.value===undefined){field.setValue(printProvider.customParams[field.name]);}},onFieldChange:function(field,record){var printProvider=this.printProvider||field.ownerCt.printProvider;var value=field.getValue();this._updating=true;if(record){switch(field.store){case printProvider.layouts:printProvider.setLayout(record);break;case printProvider.dpis:printProvider.setDpi(record);}}else{printProvider.customParams[field.name]=value;}
+delete this._updating;},onProviderChange:function(printProvider,rec){if(!this._updating){this.target.setValue(rec.get(this.target.displayField));}},onBeforeDestroy:function(){this.target.un("beforedestroy",this.onBeforeDestroy,this);this.target.un("render",this.onRender,this);this.target.un("select",this.onFieldChange,this);this.target.un("valid",this.onFieldChange,this);this.printProvider.un("layoutchange",this.onProviderChange,this);this.printProvider.un("dpichange",this.onProviderChange,this);}});Ext.preg("gx_printproviderfield",GeoExt.plugins.PrintProviderField);Ext.namespace("GeoExt","GeoExt.data");GeoExt.data.LayerReader=function(meta,recordType){meta=meta||{};if(!(recordType instanceof Function)){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||{});}
+GeoExt.data.LayerReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.LayerReader,Ext.data.DataReader,{totalRecords:null,readRecords:function(layers){var records=[];if(layers){var recordType=this.recordType,fields=recordType.prototype.fields;var i,lenI,j,lenJ,layer,values,field,v;for(i=0,lenI=layers.length;i<lenI;i++){layer=layers[i];values={};for(j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];v=layer[field.mapping||field.name]||field.defaultValue;v=field.convert(v);values[field.name]=v;}
+values.layer=layer;records[records.length]=new recordType(values,layer.id);}}
+return{records:records,totalRecords:this.totalRecords!=null?this.totalRecords:records.length};}});Ext.namespace("GeoExt.data");GeoExt.data.WMSDescribeLayerStore=function(c){c=c||{};GeoExt.data.WMSDescribeLayerStore.superclass.constructor.call(this,Ext.apply(c,{proxy:c.proxy||(!c.data?new Ext.data.HttpProxy({url:c.url,disableCaching:false,method:"GET"}):undefined),reader:new GeoExt.data.WMSDescribeLayerReader(c,c.fields)}));};Ext.extend(GeoExt.data.WMSDescribeLayerStore,Ext.data.Store);Ext.namespace("GeoExt.form");GeoExt.form.BasicForm=Ext.extend(Ext.form.BasicForm,{protocol:null,prevResponse:null,autoAbort:true,doAction:function(action,options){if(action=="search"){options=Ext.applyIf(options||{},{protocol:this.protocol,abortPrevious:this.autoAbort});action=new GeoExt.form.SearchAction(this,options);}
+return GeoExt.form.BasicForm.superclass.doAction.call(this,action,options);},search:function(options){return this.doAction("search",options);}});Ext.namespace("GeoExt.tree");GeoExt.tree.LayerParamLoader=function(config){Ext.apply(this,config);this.addEvents("beforeload","load");GeoExt.tree.LayerParamLoader.superclass.constructor.call(this);};Ext.extend(GeoExt.tree.LayerParamLoader,Ext.util.Observable,{param:null,delimiter:",",load:function(node,callback){if(this.fireEvent("beforeload",this,node)){while(node.firstChild){node.removeChild(node.firstChild);}
+var paramValue=(node.layer instanceof OpenLayers.Layer.HTTPRequest)&&node.layer.params[this.param];if(paramValue){var items=(paramValue instanceof Array)?paramValue.slice():paramValue.split(this.delimiter);Ext.each(items,function(item,index,allItems){this.addParamNode(item,allItems,node);},this);}
+if(typeof callback=="function"){callback();}
+this.fireEvent("load",this,node);}},addParamNode:function(paramItem,allParamItems,node){var child=this.createNode({layer:node.layer,param:this.param,item:paramItem,allItems:allParamItems,delimiter:this.delimiter});var sibling=node.item(0);if(sibling){node.insertBefore(child,sibling);}else{node.appendChild(child);}},createNode:function(attr){if(this.baseAttrs){Ext.apply(attr,this.baseAttrs);}
+if(typeof attr.uiProvider=='string'){attr.uiProvider=this.uiProviders[attr.uiProvider]||eval(attr.uiProvider);}
+attr.nodeType=attr.nodeType||"gx_layerparam";return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);}});Ext.namespace('GeoExt.grid');GeoExt.grid.FeatureSelectionModelMixin=function(){return{autoActivateControl:true,layerFromStore:true,selectControl:null,bound:false,superclass:null,constructor:function(config){config=config||{};if(config.selectControl instanceof OpenLayers.Control.SelectFeature){if(!config.singleSelect){var ctrl=config.selectControl;config.singleSelect=!(ctrl.multiple||!!ctrl.multipleKey);}}else if(config.layer instanceof OpenLayers.Layer.Vector){this.selectControl=this.createSelectControl(config.layer,config.selectControl);delete config.layer;delete config.selectControl;}
+this.superclass=arguments.callee.superclass;this.superclass.constructor.call(this,config);},initEvents:function(){this.superclass.initEvents.call(this);if(this.layerFromStore){var layer=this.grid.getStore()&&this.grid.getStore().layer;if(layer&&!(this.selectControl instanceof OpenLayers.Control.SelectFeature)){this.selectControl=this.createSelectControl(layer,this.selectControl);}}
+if(this.selectControl){this.bind(this.selectControl);}},createSelectControl:function(layer,config){config=config||{};var singleSelect=config.singleSelect!==undefined?config.singleSelect:this.singleSelect;config=OpenLayers.Util.extend({toggle:true,multipleKey:singleSelect?null:(Ext.isMac?"metaKey":"ctrlKey")},config);var selectControl=new OpenLayers.Control.SelectFeature(layer,config);layer.map.addControl(selectControl);return selectControl;},bind:function(obj,options){if(!this.bound){options=options||{};this.selectControl=obj;if(obj instanceof OpenLayers.Layer.Vector){this.selectControl=this.createSelectControl(obj,options.controlConfig);}
+if(this.autoActivateControl){this.selectControl.activate();}
+var layers=this.getLayers();for(var i=0,len=layers.length;i<len;i++){layers[i].events.on({featureselected:this.featureSelected,featureunselected:this.featureUnselected,scope:this});}
+this.on("rowselect",this.rowSelected,this);this.on("rowdeselect",this.rowDeselected,this);this.bound=true;}
+return this.selectControl;},unbind:function(){var selectControl=this.selectControl;if(this.bound){var layers=this.getLayers();for(var i=0,len=layers.length;i<len;i++){layers[i].events.un({featureselected:this.featureSelected,featureunselected:this.featureUnselected,scope:this});}
+this.un("rowselect",this.rowSelected,this);this.un("rowdeselect",this.rowDeselected,this);if(this.autoActivateControl){selectControl.deactivate();}
+this.selectControl=null;this.bound=false;}
+return selectControl;},featureSelected:function(evt){if(!this._selecting){var store=this.grid.store;var row=store.findBy(function(record,id){return record.getFeature()==evt.feature;});if(row!=-1&&!this.isSelected(row)){this._selecting=true;this.selectRow(row,!this.singleSelect);this._selecting=false;this.grid.getView().focusRow(row);}}},featureUnselected:function(evt){if(!this._selecting){var store=this.grid.store;var row=store.findBy(function(record,id){return record.getFeature()==evt.feature;});if(row!=-1&&this.isSelected(row)){this._selecting=true;this.deselectRow(row);this._selecting=false;this.grid.getView().focusRow(row);}}},rowSelected:function(model,row,record){var feature=record.getFeature();if(!this._selecting&&feature){var layers=this.getLayers();for(var i=0,len=layers.length;i<len;i++){if(layers[i].selectedFeatures.indexOf(feature)==-1){this._selecting=true;this.selectControl.select(feature);this._selecting=false;break;}}}},rowDeselected:function(model,row,record){var feature=record.getFeature();if(!this._selecting&&feature){var layers=this.getLayers();for(var i=0,len=layers.length;i<len;i++){if(layers[i].selectedFeatures.indexOf(feature)!=-1){this._selecting=true;this.selectControl.unselect(feature);this._selecting=false;break;}}}},getLayers:function(){return this.selectControl.layers||[this.selectControl.layer];}};};GeoExt.grid.FeatureSelectionModel=Ext.extend(Ext.grid.RowSelectionModel,new GeoExt.grid.FeatureSelectionModelMixin);Ext.namespace('GeoExt','GeoExt.data');GeoExt.data.FeatureReader=function(meta,recordType){meta=meta||{};if(!(recordType instanceof Function)){recordType=GeoExt.data.FeatureRecord.create(recordType||meta.fields||{});}
+GeoExt.data.FeatureReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.FeatureReader,Ext.data.DataReader,{totalRecords:null,read:function(response){return this.readRecords(response.features);},readRecords:function(features){var records=[];if(features){var recordType=this.recordType,fields=recordType.prototype.fields;var i,lenI,j,lenJ,feature,values,field,v;for(i=0,lenI=features.length;i<lenI;i++){feature=features[i];values={};if(feature.attributes){for(j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];if(/[\[\.]/.test(field.mapping)){try{v=new Function("obj","return obj."+field.mapping)(feature.attributes);}catch(e){v=field.defaultValue;}}
+else{v=feature.attributes[field.mapping||field.name]||field.defaultValue;}
+if(field.convert){v=field.convert(v);}
+values[field.name]=v;}}
+values.feature=feature;values.state=feature.state;values.fid=feature.fid;var id=(feature.state===OpenLayers.State.INSERT)?undefined:feature.id;records[records.length]=new recordType(values,id);}}
+return{records:records,totalRecords:this.totalRecords!=null?this.totalRecords:records.length};}});Ext.namespace('GeoExt');GeoExt.WMSLegend=Ext.extend(GeoExt.LayerLegend,{defaultStyleIsFirst:true,useScaleParameter:true,baseParams:null,initComponent:function(){GeoExt.WMSLegend.superclass.initComponent.call(this);var layer=this.layerRecord.getLayer();this._noMap=!layer.map;layer.events.register("moveend",this,this.onLayerMoveend);this.update();},onLayerMoveend:function(e){if((e.zoomChanged===true&&this.useScaleParameter===true)||this._noMap){delete this._noMap;this.update();}},getLegendUrl:function(layerName,layerNames){var rec=this.layerRecord;var url;var styles=rec&&rec.get("styles");var layer=rec.getLayer();layerNames=layerNames||[layer.params.LAYERS].join(",").split(",");var styleNames=layer.params.STYLES&&[layer.params.STYLES].join(",").split(",");var idx=layerNames.indexOf(layerName);var styleName=styleNames&&styleNames[idx];if(styles&&styles.length>0){if(styleName){Ext.each(styles,function(s){url=(s.name==styleName&&s.legend)&&s.legend.href;return!url;});}else if(this.defaultStyleIsFirst===true&&!styleNames&&!layer.params.SLD&&!layer.params.SLD_BODY){url=styles[0].legend&&styles[0].legend.href;}}
+if(!url){url=layer.getFullRequestString({REQUEST:"GetLegendGraphic",WIDTH:null,HEIGHT:null,EXCEPTIONS:"application/vnd.ogc.se_xml",LAYER:layerName,LAYERS:null,STYLE:(styleName!=='')?styleName:null,STYLES:null,SRS:null,FORMAT:null});}
+if(this.useScaleParameter===true&&url.toLowerCase().indexOf("request=getlegendgraphic")!=-1){var scale=layer.map.getScale();url=Ext.urlAppend(url,"SCALE="+scale);}
+var params=this.baseParams||{};Ext.applyIf(params,{FORMAT:'image/gif'});if(url.indexOf('?')>0){url=Ext.urlEncode(params,url);}
+return url;},update:function(){var layer=this.layerRecord.getLayer();if(!(layer&&layer.map)){return;}
+GeoExt.WMSLegend.superclass.update.apply(this,arguments);var layerNames,layerName,i,len;layerNames=[layer.params.LAYERS].join(",").split(",");var destroyList=[];var textCmp=this.items.get(0);this.items.each(function(cmp){i=layerNames.indexOf(cmp.itemId);if(i<0&&cmp!=textCmp){destroyList.push(cmp);}else if(cmp!==textCmp){layerName=layerNames[i];var newUrl=this.getLegendUrl(layerName,layerNames);if(!OpenLayers.Util.isEquivalentUrl(newUrl,cmp.url)){cmp.setUrl(newUrl);}}},this);for(i=0,len=destroyList.length;i<len;i++){var cmp=destroyList[i];this.remove(cmp);cmp.destroy();}
+for(i=0,len=layerNames.length;i<len;i++){layerName=layerNames[i];if(!this.items||!this.getComponent(layerName)){this.add({xtype:"gx_legendimage",url:this.getLegendUrl(layerName,layerNames),itemId:layerName});}}
+this.doLayout();},beforeDestroy:function(){if(this.useScaleParameter===true){var layer=this.layerRecord.getLayer()
+layer&&layer.events&&layer.events.unregister("moveend",this,this.onLayerMoveend);}
+GeoExt.WMSLegend.superclass.beforeDestroy.apply(this,arguments);}});GeoExt.WMSLegend.supports=function(layerRecord){return layerRecord.getLayer()instanceof OpenLayers.Layer.WMS;};GeoExt.LayerLegend.types["gx_wmslegend"]=GeoExt.WMSLegend;Ext.reg('gx_wmslegend',GeoExt.WMSLegend);Ext.namespace("GeoExt.data");GeoExt.data.WMSDescribeLayerReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WMSDescribeLayer();}
+if(!(typeof recordType==="function")){recordType=Ext.data.Record.create(recordType||meta.fields||[{name:"owsType",type:"string"},{name:"owsURL",type:"string"},{name:"typeName",type:"string"}]);}
+GeoExt.data.WMSDescribeLayerReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.WMSDescribeLayerReader,Ext.data.DataReader,{read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},readRecords:function(data){if(typeof data==="string"||data.nodeType){data=this.meta.format.read(data);}
+var records=[],description;for(var i=0,len=data.length;i<len;i++){description=data[i];if(description){records.push(new this.recordType(description));}}
+return{totalRecords:records.length,success:true,records:records};}});Ext.namespace("GeoExt.form");GeoExt.form.SearchAction=Ext.extend(Ext.form.Action,{type:"search",response:null,constructor:function(form,options){GeoExt.form.SearchAction.superclass.constructor.call(this,form,options);},run:function(){var o=this.options;var f=GeoExt.form.toFilter(this.form,o.logicalOp,o.wildcard);if(o.clientValidation===false||this.form.isValid()){if(o.abortPrevious&&this.form.prevResponse){o.protocol.abort(this.form.prevResponse);}
+this.form.prevResponse=o.protocol.read(Ext.applyIf({filter:f,callback:this.handleResponse,scope:this},o));}else if(o.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false);}},handleResponse:function(response){this.form.prevResponse=null;this.response=response;if(response.success()){this.form.afterAction(this,true);}else{this.form.afterAction(this,false);}
+var o=this.options;if(o.callback){o.callback.call(o.scope,response);}}});Ext.namespace("GeoExt.data");GeoExt.data.FeatureRecord=Ext.data.Record.create([{name:"feature"},{name:"state"},{name:"fid"}]);GeoExt.data.FeatureRecord.prototype.getFeature=function(){return this.get("feature");};GeoExt.data.FeatureRecord.prototype.setFeature=function(feature){if(feature!==this.data.feature){this.dirty=true;if(!this.modified){this.modified={};}
+if(this.modified.feature===undefined){this.modified.feature=this.data.feature;}
+this.data.feature=feature;if(!this.editing){this.afterEdit();}}};GeoExt.data.FeatureRecord.create=function(o){var f=Ext.extend(GeoExt.data.FeatureRecord,{});var p=f.prototype;p.fields=new Ext.util.MixedCollection(false,function(field){return field.name;});GeoExt.data.FeatureRecord.prototype.fields.each(function(f){p.fields.add(f);});if(o){for(var i=0,len=o.length;i<len;i++){p.fields.add(new Ext.data.Field(o[i]));}}
+f.getField=function(name){return p.fields.get(name);};return f;};Ext.namespace("GeoExt.data");GeoExt.data.PrintPage=Ext.extend(Ext.util.Observable,{printProvider:null,feature:null,center:null,scale:null,rotation:0,customParams:null,constructor:function(config){this.initialConfig=config;Ext.apply(this,config);if(!this.customParams){this.customParams={};}
+this.addEvents("change");GeoExt.data.PrintPage.superclass.constructor.apply(this,arguments);this.feature=new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POLYGON((-1 -1,1 -1,1 1,-1 1,-1 -1))"));if(this.printProvider.capabilities){this.setScale(this.printProvider.scales.getAt(0));}else{this.printProvider.on({"loadcapabilities":function(){this.setScale(this.printProvider.scales.getAt(0));},scope:this,single:true});}
+this.printProvider.on({"layoutchange":this.onLayoutChange,scope:this});},getPrintExtent:function(map){map=map instanceof GeoExt.MapPanel?map.map:map;return this.calculatePageBounds(this.scale,map.getUnits());},setScale:function(scale,units){var bounds=this.calculatePageBounds(scale,units);var geom=bounds.toGeometry();var rotation=this.rotation;if(rotation!=0){geom.rotate(-rotation,geom.getCentroid());}
+this.updateFeature(geom,{scale:scale});},setCenter:function(center){var geom=this.feature.geometry;var oldCenter=geom.getBounds().getCenterLonLat();var dx=center.lon-oldCenter.lon;var dy=center.lat-oldCenter.lat;geom.move(dx,dy);this.updateFeature(geom,{center:center});},setRotation:function(rotation,force){if(force||this.printProvider.layout.get("rotation")===true){var geom=this.feature.geometry;geom.rotate(this.rotation-rotation,geom.getCentroid());this.updateFeature(geom,{rotation:rotation});}},fit:function(fitTo,options){options=options||{};var map=fitTo,extent;if(fitTo instanceof GeoExt.MapPanel){map=fitTo.map;}else if(fitTo instanceof OpenLayers.Feature.Vector){map=fitTo.layer.map;extent=fitTo.geometry.getBounds();}
+if(!extent){extent=map.getExtent();if(!extent){return;}}
+this._updating=true;var center=extent.getCenterLonLat();this.setCenter(center);var units=map.getUnits();var scale=this.printProvider.scales.getAt(0);var closest=Number.POSITIVE_INFINITY;var mapWidth=extent.getWidth();var mapHeight=extent.getHeight();this.printProvider.scales.each(function(rec){var bounds=this.calculatePageBounds(rec,units);if(options.mode=="closest"){var diff=Math.abs(bounds.getWidth()-mapWidth)+
+Math.abs(bounds.getHeight()-mapHeight);if(diff<closest){closest=diff;scale=rec;}}else{var contains=options.mode=="screen"?!extent.containsBounds(bounds):bounds.containsBounds(extent);if(contains||(options.mode=="screen"&&!contains)){scale=rec;}
+return contains;}},this);this.setScale(scale,units);delete this._updating;this.updateFeature(this.feature.geometry,{center:center,scale:scale});},updateFeature:function(geometry,mods){var f=this.feature;var modified=f.geometry!==geometry;geometry.id=f.geometry.id;f.geometry=geometry;if(!this._updating){for(var property in mods){if(mods[property]===this[property]){delete mods[property];}else{this[property]=mods[property];modified=true;}}
+Ext.apply(this,mods);f.layer&&f.layer.drawFeature(f);modified&&this.fireEvent("change",this,mods);}},calculatePageBounds:function(scale,units){var s=scale.get("value");var f=this.feature;var geom=this.feature.geometry;var center=geom.getBounds().getCenterLonLat();var size=this.printProvider.layout.get("size");var units=units||(f.layer&&f.layer.map&&f.layer.map.getUnits())||"dd";var unitsRatio=OpenLayers.INCHES_PER_UNIT[units];var w=size.width/72/unitsRatio*s/2;var h=size.height/72/unitsRatio*s/2;return new OpenLayers.Bounds(center.lon-w,center.lat-h,center.lon+w,center.lat+h);},onLayoutChange:function(){if(this.printProvider.layout.get("rotation")===false){this.setRotation(0,true);}
+this.scale&&this.setScale(this.scale);},destroy:function(){this.printProvider.un("layoutchange",this.onLayoutChange,this);}});Ext.namespace("GeoExt.data");GeoExt.data.LayerRecord=Ext.data.Record.create([{name:"layer"},{name:"title",type:"string",mapping:"name"}]);GeoExt.data.LayerRecord.prototype.getLayer=function(){return this.get("layer");};GeoExt.data.LayerRecord.prototype.setLayer=function(layer){if(layer!==this.data.layer){this.dirty=true;if(!this.modified){this.modified={};}
+if(this.modified.layer===undefined){this.modified.layer=this.data.layer;}
+this.data.layer=layer;if(!this.editing){this.afterEdit();}}};GeoExt.data.LayerRecord.prototype.clone=function(id){var layer=this.getLayer()&&this.getLayer().clone();return new this.constructor(Ext.applyIf({layer:layer},this.data),id||layer.id);};GeoExt.data.LayerRecord.create=function(o){var f=Ext.extend(GeoExt.data.LayerRecord,{});var p=f.prototype;p.fields=new Ext.util.MixedCollection(false,function(field){return field.name;});GeoExt.data.LayerRecord.prototype.fields.each(function(f){p.fields.add(f);});if(o){for(var i=0,len=o.length;i<len;i++){p.fields.add(new Ext.data.Field(o[i]));}}
+f.getField=function(name){return p.fields.get(name);};return f;};Ext.namespace('GeoExt');GeoExt.FeatureRenderer=Ext.extend(Ext.BoxComponent,{feature:undefined,symbolizers:[OpenLayers.Feature.Vector.style["default"]],symbolType:"Polygon",resolution:1,minWidth:20,minHeight:20,renderers:["SVG","VML","Canvas"],rendererOptions:null,pointFeature:undefined,lineFeature:undefined,polygonFeature:undefined,renderer:null,initComponent:function(){GeoExt.FeatureRenderer.superclass.initComponent.apply(this,arguments);Ext.applyIf(this,{pointFeature:new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(0,0)),lineFeature:new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString([new OpenLayers.Geometry.Point(-8,-3),new OpenLayers.Geometry.Point(-3,3),new OpenLayers.Geometry.Point(3,-3),new OpenLayers.Geometry.Point(8,3)])),polygonFeature:new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([new OpenLayers.Geometry.LinearRing([new OpenLayers.Geometry.Point(-8,-4),new OpenLayers.Geometry.Point(-6,-6),new OpenLayers.Geometry.Point(6,-6),new OpenLayers.Geometry.Point(8,-4),new OpenLayers.Geometry.Point(8,4),new OpenLayers.Geometry.Point(6,6),new OpenLayers.Geometry.Point(-6,6),new OpenLayers.Geometry.Point(-8,4)])]))});if(!this.feature){this.setFeature(null,{draw:false});}
+this.addEvents("click");},initCustomEvents:function(){this.clearCustomEvents();this.el.on("click",this.onClick,this);},clearCustomEvents:function(){if(this.el&&this.el.removeAllListeners){this.el.removeAllListeners();}},onClick:function(){this.fireEvent("click",this);},onRender:function(ct,position){if(!this.el){this.el=document.createElement("div");this.el.id=this.getId();}
+if(!this.renderer||!this.renderer.supported()){this.assignRenderer();}
+this.renderer.map={getResolution:(function(){return this.resolution;}).createDelegate(this)};GeoExt.FeatureRenderer.superclass.onRender.apply(this,arguments);this.drawFeature();},afterRender:function(){GeoExt.FeatureRenderer.superclass.afterRender.apply(this,arguments);this.initCustomEvents();},onResize:function(w,h){this.setRendererDimensions();GeoExt.FeatureRenderer.superclass.onResize.apply(this,arguments);},setRendererDimensions:function(){var gb=this.feature.geometry.getBounds();var gw=gb.getWidth();var gh=gb.getHeight();var resolution=this.initialConfig.resolution;if(!resolution){resolution=Math.max(gw/this.width||0,gh/this.height||0)||1;}
+this.resolution=resolution;var width=Math.max(this.width||this.minWidth,gw/resolution);var height=Math.max(this.height||this.minHeight,gh/resolution);var center=gb.getCenterPixel();var bhalfw=width*resolution/2;var bhalfh=height*resolution/2;var bounds=new OpenLayers.Bounds(center.x-bhalfw,center.y-bhalfh,center.x+bhalfw,center.y+bhalfh);this.renderer.setSize(new OpenLayers.Size(Math.round(width),Math.round(height)));this.renderer.setExtent(bounds,true);},assignRenderer:function(){for(var i=0,len=this.renderers.length;i<len;++i){var Renderer=OpenLayers.Renderer[this.renderers[i]];if(Renderer&&Renderer.prototype.supported()){this.renderer=new Renderer(this.el,this.rendererOptions);break;}}},setSymbolizers:function(symbolizers,options){this.symbolizers=symbolizers;if(!options||options.draw){this.drawFeature();}},setSymbolType:function(type,options){this.symbolType=type;this.setFeature(null,options);},setFeature:function(feature,options){this.feature=feature||this[this.symbolType.toLowerCase()+"Feature"];if(!options||options.draw){this.drawFeature();}},drawFeature:function(){this.renderer.clear();this.setRendererDimensions();var Symbolizer=OpenLayers.Symbolizer;var Text=Symbolizer&&Symbolizer.Text;var symbolizer,feature,geomType;for(var i=0,len=this.symbolizers.length;i<len;++i){symbolizer=this.symbolizers[i];feature=this.feature;if(!Text||!(symbolizer instanceof Text)){if(Symbolizer&&(symbolizer instanceof Symbolizer)){symbolizer=symbolizer.clone();if(!this.initialConfig.feature){geomType=symbolizer.CLASS_NAME.split(".").pop().toLowerCase();feature=this[geomType+"Feature"];}}else{symbolizer=Ext.apply({},symbolizer);}
+this.renderer.drawFeature(feature.clone(),symbolizer);}}},update:function(options){options=options||{};if(options.feature){this.setFeature(options.feature,{draw:false});}else if(options.symbolType){this.setSymbolType(options.symbolType,{draw:false});}
+if(options.symbolizers){this.setSymbolizers(options.symbolizers,{draw:false});}
+this.drawFeature();},beforeDestroy:function(){this.clearCustomEvents();if(this.renderer){this.renderer.destroy();}}});Ext.reg('gx_renderer',GeoExt.FeatureRenderer);Ext.namespace("GeoExt");GeoExt.Popup=Ext.extend(Ext.Window,{anchored:true,map:null,panIn:true,unpinnable:true,location:null,animCollapse:false,draggable:false,shadow:false,popupCls:"gx-popup",ancCls:null,initComponent:function(){if(this.map instanceof GeoExt.MapPanel){this.map=this.map.map;}
+if(!this.map&&this.location instanceof OpenLayers.Feature.Vector&&this.location.layer){this.map=this.location.layer.map;}
+if(this.location instanceof OpenLayers.Feature.Vector){this.location=this.location.geometry;}
+if(this.location instanceof OpenLayers.Geometry){if(typeof this.location.getCentroid=="function"){this.location=this.location.getCentroid();}
+this.location=this.location.getBounds().getCenterLonLat();}else if(this.location instanceof OpenLayers.Pixel){this.location=this.map.getLonLatFromViewPortPx(this.location);}
+if(this.anchored){this.addAnchorEvents();}
+this.baseCls=this.popupCls+" "+this.baseCls;this.elements+=',anc';GeoExt.Popup.superclass.initComponent.call(this);},onRender:function(ct,position){GeoExt.Popup.superclass.onRender.call(this,ct,position);this.ancCls=this.popupCls+"-anc";this.createElement("anc",this.el.dom);},initTools:function(){if(this.unpinnable){this.addTool({id:'unpin',handler:this.unanchorPopup.createDelegate(this,[])});}
+GeoExt.Popup.superclass.initTools.call(this);},show:function(){GeoExt.Popup.superclass.show.apply(this,arguments);if(this.anchored){this.position();if(this.panIn&&!this._mapMove){this.panIntoView();}}},maximize:function(){if(!this.maximized&&this.anc){this.unanchorPopup();}
+GeoExt.Popup.superclass.maximize.apply(this,arguments);},setSize:function(w,h){if(this.anc){var ancSize=this.anc.getSize();if(typeof w=='object'){h=w.height-ancSize.height;w=w.width;}else if(!isNaN(h)){h=h-ancSize.height;}}
+GeoExt.Popup.superclass.setSize.call(this,w,h);},position:function(){if(this._mapMove===true){var visible=this.map.getExtent().containsLonLat(this.location);if(visible!==this.isVisible()){this.setVisible(visible);}}
+if(this.isVisible()){var centerPx=this.map.getViewPortPxFromLonLat(this.location);var mapBox=Ext.fly(this.map.div).getBox();var anc=this.anc;var dx=anc.getLeft(true)+anc.getWidth()/2;var dy=this.el.getHeight();this.setPosition(centerPx.x+mapBox.x-dx,centerPx.y+mapBox.y-dy);}},unanchorPopup:function(){this.removeAnchorEvents();this.draggable=true;this.header.addClass("x-window-draggable");this.dd=new Ext.Window.DD(this);this.anc.remove();this.anc=null;this.tools.unpin.hide();},panIntoView:function(){var mapBox=Ext.fly(this.map.div).getBox();var popupPos=this.getPosition(true);popupPos[0]-=mapBox.x;popupPos[1]-=mapBox.y;var panelSize=[mapBox.width,mapBox.height];var popupSize=this.getSize();var newPos=[popupPos[0],popupPos[1]];var padding=this.map.paddingForPopups;if(popupPos[0]<padding.left){newPos[0]=padding.left;}else if(popupPos[0]+popupSize.width>panelSize[0]-padding.right){newPos[0]=panelSize[0]-padding.right-popupSize.width;}
+if(popupPos[1]<padding.top){newPos[1]=padding.top;}else if(popupPos[1]+popupSize.height>panelSize[1]-padding.bottom){newPos[1]=panelSize[1]-padding.bottom-popupSize.height;}
+var dx=popupPos[0]-newPos[0];var dy=popupPos[1]-newPos[1];this.map.pan(dx,dy);},onMapMove:function(){this._mapMove=true;this.position();delete this._mapMove;},addAnchorEvents:function(){this.map.events.on({"move":this.onMapMove,scope:this});this.on({"resize":this.position,"collapse":this.position,"expand":this.position,scope:this});},removeAnchorEvents:function(){this.map.events.un({"move":this.onMapMove,scope:this});this.un("resize",this.position,this);this.un("collapse",this.position,this);this.un("expand",this.position,this);},beforeDestroy:function(){if(this.anchored){this.removeAnchorEvents();}
+GeoExt.Popup.superclass.beforeDestroy.call(this);}});Ext.reg('gx_popup',GeoExt.Popup);Ext.namespace("GeoExt.data");GeoExt.data.AttributeStoreMixin=function(){return{constructor:function(c){c=c||{};arguments.callee.superclass.constructor.call(this,Ext.apply(c,{proxy:c.proxy||(!c.data?new Ext.data.HttpProxy({url:c.url,disableCaching:false,method:"GET"}):undefined),reader:new GeoExt.data.AttributeReader(c,c.fields||["name","type","restriction"])}));if(this.feature){this.bind();}},bind:function(){this.on({"update":this.onUpdate,"load":this.onLoad,"add":this.onAdd,scope:this});var records=[];this.each(function(record){records.push(record);});this.updateFeature(records);},onUpdate:function(store,record,operation){this.updateFeature([record]);},onLoad:function(store,records,options){if(!options||options.add!==true){this.updateFeature(records);}},onAdd:function(store,records,index){this.updateFeature(records);},updateFeature:function(records){var feature=this.feature,layer=feature.layer;var i,len,record,name,value,oldValue,dirty;for(i=0,len=records.length;i<len;i++){record=records[i];name=record.get("name");value=record.get("value");oldValue=feature.attributes[name];if(oldValue!==value){dirty=true;}}
+if(dirty&&layer&&layer.events&&layer.events.triggerEvent("beforefeaturemodified",{feature:feature})!==false){for(i=0,len=records.length;i<len;i++){record=records[i];name=record.get("name");value=record.get("value");feature.attributes[name]=value;}
+layer.events.triggerEvent("featuremodified",{feature:feature});layer.drawFeature(feature);}}};};GeoExt.data.AttributeStore=Ext.extend(Ext.data.Store,GeoExt.data.AttributeStoreMixin());Ext.namespace("GeoExt.form");GeoExt.form.FormPanel=Ext.extend(Ext.form.FormPanel,{protocol:null,createForm:function(){delete this.initialConfig.listeners;return new GeoExt.form.BasicForm(null,this.initialConfig);},search:function(options){this.getForm().search(options);}});Ext.reg("gx_formpanel",GeoExt.form.FormPanel);Ext.namespace("GeoExt.data");GeoExt.data.WMCReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WMC();}
+if(!(typeof recordType==="function")){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||[{name:"abstract",type:"string"},{name:"metadataURL",type:"string"},{name:"queryable",type:"boolean"},{name:"formats"},{name:"styles"}]);}
+GeoExt.data.WMCReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.WMCReader,Ext.data.DataReader,{read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},readRecords:function(data){var format=this.meta.format;if(typeof data==="string"||data.nodeType){data=format.read(data);}
+var layersContext=data?data.layersContext:undefined;var records=[];if(layersContext){var recordType=this.recordType,fields=recordType.prototype.fields;var i,lenI,j,lenJ,layerContext,values,field,v;for(i=0,lenI=layersContext.length;i<lenI;i++){layerContext=layersContext[i];values={};for(j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];v=layerContext[field.mapping||field.name]||field.defaultValue;v=field.convert(v);values[field.name]=v;}
+values.layer=format.getLayerFromContext(layerContext);records.push(new this.recordType(values,values.layer.id));}}
+return{totalRecords:records.length,success:true,records:records};}});Ext.namespace("GeoExt.tree");GeoExt.tree.OverlayLayerContainer=Ext.extend(GeoExt.tree.LayerContainer,{constructor:function(config){config=Ext.applyIf(config||{},{text:"Overlays"});config.loader=Ext.applyIf(config.loader||{},{filter:function(record){var layer=record.getLayer();return layer.displayInLayerSwitcher===true&&layer.isBaseLayer===false;}});GeoExt.tree.OverlayLayerContainer.superclass.constructor.call(this,config);}});Ext.tree.TreePanel.nodeTypes.gx_overlaylayercontainer=GeoExt.tree.OverlayLayerContainer;Ext.namespace("GeoExt.data");GeoExt.data.WFSCapabilitiesReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WFSCapabilities();}
+if(!(typeof recordType==="function")){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||[{name:"name",type:"string"},{name:"title",type:"string"},{name:"namespace",type:"string",mapping:"featureNS"},{name:"abstract",type:"string"}]);}
+GeoExt.data.WFSCapabilitiesReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.WFSCapabilitiesReader,Ext.data.DataReader,{read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},readRecords:function(data){if(typeof data==="string"||data.nodeType){data=this.meta.format.read(data);}
+var featureTypes=data.featureTypeList.featureTypes;var fields=this.recordType.prototype.fields;var featureType,values,field,v,parts,layer,values;var layerOptions,protocolOptions;var protocolDefaults={url:data.capability.request.getfeature.href.post};var records=[];for(var i=0,lenI=featureTypes.length;i<lenI;i++){featureType=featureTypes[i];if(featureType.name){values={};for(var j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];v=featureType[field.mapping||field.name]||field.defaultValue;v=field.convert(v);values[field.name]=v;}
+protocolOptions={featureType:featureType.name,featureNS:featureType.featureNS};if(this.meta.protocolOptions){Ext.apply(protocolOptions,this.meta.protocolOptions,protocolDefaults);}else{Ext.apply(protocolOptions,{},protocolDefaults);}
+layerOptions={protocol:new OpenLayers.Protocol.WFS(protocolOptions),strategies:[new OpenLayers.Strategy.Fixed()]};if(this.meta.layerOptions){Ext.apply(layerOptions,this.meta.layerOptions);}
+values.layer=new OpenLayers.Layer.Vector(featureType.title||featureType.name,layerOptions);records.push(new this.recordType(values,values.layer.id));}}
+return{totalRecords:records.length,success:true,records:records};}});Ext.namespace('GeoExt');GeoExt.LegendPanel=Ext.extend(Ext.Panel,{dynamic:true,layerStore:null,preferredTypes:null,filter:function(record){return true;},initComponent:function(){GeoExt.LegendPanel.superclass.initComponent.call(this);},onRender:function(){GeoExt.LegendPanel.superclass.onRender.apply(this,arguments);if(!this.layerStore){this.layerStore=GeoExt.MapPanel.guess().layers;}
+this.layerStore.each(function(record){this.addLegend(record);},this);if(this.dynamic){this.layerStore.on({"add":this.onStoreAdd,"remove":this.onStoreRemove,"clear":this.onStoreClear,scope:this});}},recordIndexToPanelIndex:function(index){var store=this.layerStore;var count=store.getCount();var panelIndex=-1;var legendCount=this.items?this.items.length:0;var record,layer;for(var i=count-1;i>=0;--i){record=store.getAt(i);layer=record.getLayer();var types=GeoExt.LayerLegend.getTypes(record);if(layer.displayInLayerSwitcher&&types.length>0&&(store.getAt(i).get("hideInLegend")!==true)){++panelIndex;if(index===i||panelIndex>legendCount-1){break;}}}
+return panelIndex;},getIdForLayer:function(layer){return this.id+"-"+layer.id;},onStoreAdd:function(store,records,index){var panelIndex=this.recordIndexToPanelIndex(index+records.length-1);for(var i=0,len=records.length;i<len;i++){this.addLegend(records[i],panelIndex);}
+this.doLayout();},onStoreRemove:function(store,record,index){this.removeLegend(record);},removeLegend:function(record){if(this.items){var legend=this.getComponent(this.getIdForLayer(record.getLayer()));if(legend){this.remove(legend,true);this.doLayout();}}},onStoreClear:function(store){this.removeAllLegends();},removeAllLegends:function(){this.removeAll(true);this.doLayout();},addLegend:function(record,index){if(this.filter(record)===true){var layer=record.getLayer();index=index||0;var legend;var types=GeoExt.LayerLegend.getTypes(record,this.preferredTypes);if(layer.displayInLayerSwitcher&&!record.get('hideInLegend')&&types.length>0){this.insert(index,{xtype:types[0],id:this.getIdForLayer(layer),layerRecord:record,hidden:!((!layer.map&&layer.visibility)||(layer.getVisibility()&&layer.calculateInRange()))});}}},onDestroy:function(){if(this.layerStore){this.layerStore.un("add",this.onStoreAdd,this);this.layerStore.un("remove",this.onStoreRemove,this);this.layerStore.un("clear",this.onStoreClear,this);}
+GeoExt.LegendPanel.superclass.onDestroy.apply(this,arguments);}});Ext.reg('gx_legendpanel',GeoExt.LegendPanel);Ext.namespace("GeoExt.form");GeoExt.form.toFilter=function(form,logicalOp,wildcard){if(form instanceof Ext.form.FormPanel){form=form.getForm();}
+var filters=[],values=form.getValues(false);for(var prop in values){var s=prop.split("__");var value=values[prop],type;if(s.length>1&&(type=GeoExt.form.toFilter.FILTER_MAP[s[1]])!==undefined){prop=s[0];}else{type=OpenLayers.Filter.Comparison.EQUAL_TO;}
+if(type===OpenLayers.Filter.Comparison.LIKE){switch(wildcard){case GeoExt.form.ENDS_WITH:value='.*'+value;break;case GeoExt.form.STARTS_WITH:value+='.*';break;case GeoExt.form.CONTAINS:value='.*'+value+'.*';break;default:break;}}
+filters.push(new OpenLayers.Filter.Comparison({type:type,value:value,property:prop}));}
+return new OpenLayers.Filter.Logical({type:logicalOp||OpenLayers.Filter.Logical.AND,filters:filters});};GeoExt.form.toFilter.FILTER_MAP={"eq":OpenLayers.Filter.Comparison.EQUAL_TO,"ne":OpenLayers.Filter.Comparison.NOT_EQUAL_TO,"lt":OpenLayers.Filter.Comparison.LESS_THAN,"le":OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO,"gt":OpenLayers.Filter.Comparison.GREATER_THAN,"ge":OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO,"like":OpenLayers.Filter.Comparison.LIKE};GeoExt.form.ENDS_WITH=1;GeoExt.form.STARTS_WITH=2;GeoExt.form.CONTAINS=3;GeoExt.form.recordToField=function(record){var type=record.get("type");if(typeof type==="object"&&type.xtype){return type;}
+var field;var name=record.get("name");var label=record.get("label");var restriction=record.get("restriction")||{};if(label==null){label=name;}
+type=type.split(":").pop();var r=GeoExt.form.recordToField.REGEXES;if(type.match(r["text"])){var maxLength=restriction["maxLength"]!==undefined?parseFloat(restriction["maxLength"]):undefined;var minLength=restriction["minLength"]!==undefined?parseFloat(restriction["minLength"]):undefined;field={xtype:"textfield",name:name,fieldLabel:label,maxLength:maxLength,minLength:minLength};}else if(type.match(r["number"])){var maxValue=restriction["maxInclusive"]!==undefined?parseFloat(restriction["maxInclusive"]):undefined;var minValue=restriction["minInclusive"]!==undefined?parseFloat(restriction["minInclusive"]):undefined;field={xtype:"numberfield",name:name,fieldLabel:label,maxValue:maxValue,minValue:minValue};}else if(type.match(r["boolean"])){field={xtype:"checkbox",name:name,boxLabel:label};}else if(type.match(r["date"])){field={xtype:"datefield",fieldLabel:label,name:name};}
+return field;}
+GeoExt.form.recordToField.REGEXES={"text":new RegExp("^(text|string)$","i"),"number":new RegExp("^(number|float|decimal|double|int|long|integer|short)$","i"),"boolean":new RegExp("^(boolean)$","i"),"date":new RegExp("^(dateTime)$","i")};Ext.namespace("GeoExt.plugins");GeoExt.plugins.PrintPageField=Ext.extend(Ext.util.Observable,{printPage:null,target:null,constructor:function(config){this.initialConfig=config;Ext.apply(this,config);GeoExt.plugins.PrintPageField.superclass.constructor.apply(this,arguments);},init:function(target){this.target=target;var onCfg={"beforedestroy":this.onBeforeDestroy,scope:this};var eventName=target instanceof Ext.form.ComboBox?"select":target instanceof Ext.form.Checkbox?"check":"valid";onCfg[eventName]=this.onFieldChange;target.on(onCfg);this.printPage.on({"change":this.onPageChange,scope:this});this.printPage.printProvider.on({"layoutchange":this.onLayoutChange,scope:this});this.setValue(this.printPage);},onFieldChange:function(field,record){var printProvider=this.printPage.printProvider;var value=field.getValue();this._updating=true;if(field.store===printProvider.scales||field.name==="scale"){this.printPage.setScale(record);}else if(field.name=="rotation"){!isNaN(value)&&this.printPage.setRotation(value);}else{this.printPage.customParams[field.name]=value;}
+delete this._updating;},onPageChange:function(printPage){if(!this._updating){this.setValue(printPage);}},onLayoutChange:function(printProvider,layout){var t=this.target;t.name=="rotation"&&t.setDisabled(!layout.get("rotation"));},setValue:function(printPage){var t=this.target;t.suspendEvents();if(t.store===printPage.printProvider.scales||t.name==="scale"){if(printPage.scale){t.setValue(printPage.scale.get(t.displayField));}}else if(t.name=="rotation"){t.setValue(printPage.rotation);}
+t.resumeEvents();},onBeforeDestroy:function(){this.target.un("beforedestroy",this.onBeforeDestroy,this);this.target.un("select",this.onFieldChange,this);this.target.un("valid",this.onFieldChange,this);this.printPage.un("change",this.onPageChange,this);this.printPage.printProvider.un("layoutchange",this.onLayoutChange,this);}});Ext.preg("gx_printpagefield",GeoExt.plugins.PrintPageField);Ext.namespace("GeoExt.tree");GeoExt.tree.LayerNodeUI=Ext.extend(Ext.tree.TreeNodeUI,{constructor:function(config){GeoExt.tree.LayerNodeUI.superclass.constructor.apply(this,arguments);},render:function(bulkRender){var a=this.node.attributes;if(a.checked===undefined){a.checked=this.node.layer.getVisibility();}
+GeoExt.tree.LayerNodeUI.superclass.render.apply(this,arguments);var cb=this.checkbox;if(a.checkedGroup){var radio=Ext.DomHelper.insertAfter(cb,['<input type="radio" name="',a.checkedGroup,'_checkbox" class="',cb.className,cb.checked?'" checked="checked"':'','"></input>'].join(""));radio.defaultChecked=cb.defaultChecked;Ext.get(cb).remove();this.checkbox=radio;}
+this.enforceOneVisible();},onClick:function(e){if(e.getTarget('.x-tree-node-cb',1)){this.toggleCheck(this.isChecked());}else{GeoExt.tree.LayerNodeUI.superclass.onClick.apply(this,arguments);}},toggleCheck:function(value){value=(value===undefined?!this.isChecked():value);GeoExt.tree.LayerNodeUI.superclass.toggleCheck.call(this,value);this.enforceOneVisible();},enforceOneVisible:function(){var attributes=this.node.attributes;var group=attributes.checkedGroup;if(group&&group!=="gx_baselayer"){var layer=this.node.layer;var checkedNodes=this.node.getOwnerTree().getChecked();var checkedCount=0;Ext.each(checkedNodes,function(n){var l=n.layer
+if(!n.hidden&&n.attributes.checkedGroup===group){checkedCount++;if(l!=layer&&attributes.checked){l.setVisibility(false);}}});if(checkedCount===0&&attributes.checked==false){layer.setVisibility(true);}}},appendDDGhost:function(ghostNode){var n=this.elNode.cloneNode(true);var radio=Ext.DomQuery.select("input[type='radio']",n);Ext.each(radio,function(r){r.name=r.name+"_clone";});ghostNode.appendChild(n);}});GeoExt.tree.LayerNode=Ext.extend(Ext.tree.AsyncTreeNode,{layer:null,layerStore:null,constructor:function(config){config.leaf=config.leaf||!(config.children||config.loader);if(!config.iconCls&&!config.children){config.iconCls="gx-tree-layer-icon";}
+if(config.loader&&!(config.loader instanceof Ext.tree.TreeLoader)){config.loader=new GeoExt.tree.LayerParamLoader(config.loader);}
+this.defaultUI=this.defaultUI||GeoExt.tree.LayerNodeUI;Ext.apply(this,{layer:config.layer,layerStore:config.layerStore});if(config.text){this.fixedText=true;}
+GeoExt.tree.LayerNode.superclass.constructor.apply(this,arguments);},render:function(bulkRender){var layer=this.layer instanceof OpenLayers.Layer&&this.layer;if(!layer){if(!this.layerStore||this.layerStore=="auto"){this.layerStore=GeoExt.MapPanel.guess().layers;}
+var i=this.layerStore.findBy(function(o){return o.get("title")==this.layer;},this);if(i!=-1){layer=this.layerStore.getAt(i).getLayer();}}
+if(!this.rendered||!layer){var ui=this.getUI();if(layer){this.layer=layer;if(layer.isBaseLayer){this.draggable=false;Ext.applyIf(this.attributes,{checkedGroup:"gx_baselayer"});}
+if(!this.text){this.text=layer.name;}
+ui.show();this.addVisibilityEventHandlers();}else{ui.hide();}
+if(this.layerStore instanceof GeoExt.data.LayerStore){this.addStoreEventHandlers(layer);}}
+GeoExt.tree.LayerNode.superclass.render.apply(this,arguments);},addVisibilityEventHandlers:function(){this.layer.events.on({"visibilitychanged":this.onLayerVisibilityChanged,scope:this});this.on({"checkchange":this.onCheckChange,scope:this});},onLayerVisibilityChanged:function(){if(!this._visibilityChanging){this.getUI().toggleCheck(this.layer.getVisibility());}},onCheckChange:function(node,checked){if(checked!=this.layer.getVisibility()){this._visibilityChanging=true;var layer=this.layer;if(checked&&layer.isBaseLayer&&layer.map){layer.map.setBaseLayer(layer);}else{layer.setVisibility(checked);}
+delete this._visibilityChanging;}},addStoreEventHandlers:function(){this.layerStore.on({"add":this.onStoreAdd,"remove":this.onStoreRemove,"update":this.onStoreUpdate,scope:this});},onStoreAdd:function(store,records,index){var l;for(var i=0;i<records.length;++i){l=records[i].getLayer();if(this.layer==l){this.getUI().show();break;}else if(this.layer==l.name){this.render();break;}}},onStoreRemove:function(store,record,index){if(this.layer==record.getLayer()){this.getUI().hide();}},onStoreUpdate:function(store,record,operation){var layer=record.getLayer();if(!this.fixedText&&(this.layer==layer&&this.text!==layer.name)){this.setText(layer.name);}},destroy:function(){var layer=this.layer;if(layer instanceof OpenLayers.Layer){layer.events.un({"visibilitychanged":this.onLayerVisibilityChanged,scope:this});}
+delete this.layer;var layerStore=this.layerStore;if(layerStore){layerStore.un("add",this.onStoreAdd,this);layerStore.un("remove",this.onStoreRemove,this);layerStore.un("update",this.onStoreUpdate,this);}
+delete this.layerStore;this.un("checkchange",this.onCheckChange,this);GeoExt.tree.LayerNode.superclass.destroy.apply(this,arguments);}});Ext.tree.TreePanel.nodeTypes.gx_layer=GeoExt.tree.LayerNode;Ext.namespace("GeoExt.tree");GeoExt.tree.LayerParamNode=Ext.extend(Ext.tree.TreeNode,{layer:null,param:null,item:null,delimiter:null,allItems:null,constructor:function(attributes){var config=attributes||{};config.iconCls=config.iconCls||"gx-tree-layerparam-icon";config.text=config.text||config.item;this.param=config.param;this.item=config.item;this.delimiter=config.delimiter||",";this.allItems=config.allItems;GeoExt.tree.LayerParamNode.superclass.constructor.apply(this,arguments);this.getLayer();if(this.layer){if(!this.allItems){this.allItems=this.getItemsFromLayer();}
+if(this.attributes.checked==null){this.attributes.checked=this.layer.getVisibility()&&this.getItemsFromLayer().indexOf(this.item)>=0;}else{this.onCheckChange(this,this.attributes.checked);}
+this.layer.events.on({"visibilitychanged":this.onLayerVisibilityChanged,scope:this});this.on({"checkchange":this.onCheckChange,scope:this});}},getLayer:function(){if(!this.layer){var layer=this.attributes.layer;if(typeof layer=="string"){var store=this.attributes.layerStore||GeoExt.MapPanel.guess().layers;var i=store.findBy(function(o){return o.get("title")==layer;});layer=i!=-1?store.getAt(i).getLayer():null;}
+this.layer=layer;}
+return this.layer;},getItemsFromLayer:function(){var paramValue=this.layer.params[this.param];return paramValue instanceof Array?paramValue:(paramValue?paramValue.split(this.delimiter):[]);},createParams:function(items){var params={};params[this.param]=this.layer.params[this.param]instanceof Array?items:items.join(this.delimiter);return params;},onLayerVisibilityChanged:function(){if(this.getItemsFromLayer().length===0){this.layer.mergeNewParams(this.createParams(this.allItems));}
+var visible=this.layer.getVisibility();if(visible&&this.getItemsFromLayer().indexOf(this.item)!==-1){this.getUI().toggleCheck(true);}
+if(!visible){this.layer.mergeNewParams(this.createParams([]));this.getUI().toggleCheck(false);}},onCheckChange:function(node,checked){var layer=this.layer;var newItems=[];var curItems=this.getItemsFromLayer();if(checked===true&&layer.getVisibility()===false&&curItems.length===this.allItems.length){curItems=[];}
+Ext.each(this.allItems,function(item){if((item!==this.item&&curItems.indexOf(item)!==-1)||(checked===true&&item===this.item)){newItems.push(item);}},this);var visible=(newItems.length>0);visible&&layer.mergeNewParams(this.createParams(newItems));if(visible!==layer.getVisibility()){layer.setVisibility(visible);}
+(!visible)&&layer.mergeNewParams(this.createParams([]));},destroy:function(){var layer=this.layer;if(layer instanceof OpenLayers.Layer){layer.events.un({"visibilitychanged":this.onLayerVisibilityChanged,scope:this});}
+delete this.layer;this.un("checkchange",this.onCheckChange,this);GeoExt.tree.LayerParamNode.superclass.destroy.apply(this,arguments);}});Ext.tree.TreePanel.nodeTypes.gx_layerparam=GeoExt.tree.LayerParamNode;Ext.namespace('GeoExt');GeoExt.UrlLegend=Ext.extend(GeoExt.LayerLegend,{initComponent:function(){GeoExt.UrlLegend.superclass.initComponent.call(this);this.add(new GeoExt.LegendImage({url:this.layerRecord.get("legendURL")}));},update:function(){GeoExt.UrlLegend.superclass.update.apply(this,arguments);this.items.get(1).setUrl(this.layerRecord.get("legendURL"));}});GeoExt.UrlLegend.supports=function(layerRecord){return layerRecord.get("legendURL")!=null;};GeoExt.LayerLegend.types["gx_urllegend"]=GeoExt.UrlLegend;Ext.reg('gx_urllegend',GeoExt.UrlLegend);Ext.namespace("GeoExt.state");GeoExt.state.PermalinkProvider=function(config){GeoExt.state.PermalinkProvider.superclass.constructor.apply(this,arguments);config=config||{};var url=config.url;delete config.url;Ext.apply(this,config);this.state=this.readURL(url);};Ext.extend(GeoExt.state.PermalinkProvider,Ext.state.Provider,{encodeType:true,readURL:function(url){var state={};var params=OpenLayers.Util.getParameters(url);var k,split,stateId;for(k in params){if(params.hasOwnProperty(k)){split=k.split("_");if(split.length>1){stateId=split[0];state[stateId]=state[stateId]||{};state[stateId][split.slice(1).join("_")]=this.encodeType?this.decodeValue(params[k]):params[k];}}}
+return state;},getLink:function(base){base=base||document.location.href;var params={};var id,k,state=this.state;for(id in state){if(state.hasOwnProperty(id)){for(k in state[id]){params[id+"_"+k]=this.encodeType?unescape(this.encodeValue(state[id][k])):state[id][k];}}}
+OpenLayers.Util.applyDefaults(params,OpenLayers.Util.getParameters(base));var paramsStr=OpenLayers.Util.getParameterString(params);var qMark=base.indexOf("?");if(qMark>0){base=base.substring(0,qMark);}
+return Ext.urlAppend(base,paramsStr);}});Ext.namespace('GeoExt');GeoExt.LegendImage=Ext.extend(Ext.BoxComponent,{url:null,defaultImgSrc:null,imgCls:null,initComponent:function(){GeoExt.LegendImage.superclass.initComponent.call(this);if(this.defaultImgSrc===null){this.defaultImgSrc=Ext.BLANK_IMAGE_URL;}
+this.autoEl={tag:"img","class":(this.imgCls?this.imgCls:""),src:this.defaultImgSrc};},setUrl:function(url){this.url=url;var el=this.getEl();if(el){el.un("error",this.onImageLoadError,this);el.on("error",this.onImageLoadError,this,{single:true});el.dom.src=url;}},onRender:function(ct,position){GeoExt.LegendImage.superclass.onRender.call(this,ct,position);if(this.url){this.setUrl(this.url);}},onDestroy:function(){var el=this.getEl();if(el){el.un("error",this.onImageLoadError,this);}
+GeoExt.LegendImage.superclass.onDestroy.apply(this,arguments);},onImageLoadError:function(){this.getEl().dom.src=this.defaultImgSrc;}});Ext.reg('gx_legendimage',GeoExt.LegendImage);Ext.namespace("GeoExt");GeoExt.LayerOpacitySlider=Ext.extend(Ext.Slider,{layer:null,complementaryLayer:null,delay:5,changeVisibilityDelay:5,aggressive:false,changeVisibility:false,value:null,inverse:false,constructor:function(config){if(config.layer){this.layer=this.getLayer(config.layer);this.bind();this.complementaryLayer=this.getLayer(config.complementaryLayer);if(config.inverse!==undefined){this.inverse=config.inverse;}
+config.value=(config.value!==undefined)?config.value:this.getOpacityValue(this.layer);delete config.layer;delete config.complementaryLayer;}
+GeoExt.LayerOpacitySlider.superclass.constructor.call(this,config);},bind:function(){if(this.layer&&this.layer.map){this.layer.map.events.on({changelayer:this.update,scope:this});}},unbind:function(){if(this.layer&&this.layer.map){this.layer.map.events.un({changelayer:this.update,scope:this});}},update:function(evt){if(evt.property==="opacity"&&evt.layer==this.layer){this.setValue(this.getOpacityValue(this.layer));}},setLayer:function(layer){this.unbind();this.layer=this.getLayer(layer);this.setValue(this.getOpacityValue(layer));this.bind();},getOpacityValue:function(layer){var value;if(layer&&layer.opacity!==null){value=parseInt(layer.opacity*(this.maxValue-this.minValue));}else{value=this.maxValue;}
+if(this.inverse===true){value=(this.maxValue-this.minValue)-value;}
+return value;},getLayer:function(layer){if(layer instanceof OpenLayers.Layer){return layer;}else if(layer instanceof GeoExt.data.LayerRecord){return layer.getLayer();}},initComponent:function(){GeoExt.LayerOpacitySlider.superclass.initComponent.call(this);if(this.changeVisibility&&this.layer&&(this.layer.opacity==0||(this.inverse===false&&this.value==this.minValue)||(this.inverse===true&&this.value==this.maxValue))){this.layer.setVisibility(false);}
+if(this.complementaryLayer&&((this.layer&&this.layer.opacity==1)||(this.inverse===false&&this.value==this.maxValue)||(this.inverse===true&&this.value==this.minValue))){this.complementaryLayer.setVisibility(false);}
+if(this.aggressive===true){this.on('change',this.changeLayerOpacity,this,{buffer:this.delay});}else{this.on('changecomplete',this.changeLayerOpacity,this);}
+if(this.changeVisibility===true){this.on('change',this.changeLayerVisibility,this,{buffer:this.changeVisibilityDelay});}
+if(this.complementaryLayer){this.on('change',this.changeComplementaryLayerVisibility,this,{buffer:this.changeVisibilityDelay});}
+this.on("beforedestroy",this.unbind,this);},changeLayerOpacity:function(slider,value){if(this.layer){value=value/(this.maxValue-this.minValue);if(this.inverse===true){value=1-value;}
+this.layer.setOpacity(value);}},changeLayerVisibility:function(slider,value){var currentVisibility=this.layer.getVisibility();if((this.inverse===false&&value==this.minValue)||(this.inverse===true&&value==this.maxValue)&&currentVisibility===true){this.layer.setVisibility(false);}else if((this.inverse===false&&value>this.minValue)||(this.inverse===true&&value<this.maxValue)&&currentVisibility==false){this.layer.setVisibility(true);}},changeComplementaryLayerVisibility:function(slider,value){var currentVisibility=this.complementaryLayer.getVisibility();if((this.inverse===false&&value==this.maxValue)||(this.inverse===true&&value==this.minValue)&&currentVisibility===true){this.complementaryLayer.setVisibility(false);}else if((this.inverse===false&&value<this.maxValue)||(this.inverse===true&&value>this.minValue)&&currentVisibility==false){this.complementaryLayer.setVisibility(true);}},addToMapPanel:function(panel){this.on({render:function(){var el=this.getEl();el.setStyle({position:"absolute",zIndex:panel.map.Z_INDEX_BASE.Control});el.on({mousedown:this.stopMouseEvents,click:this.stopMouseEvents});},scope:this});},removeFromMapPanel:function(panel){var el=this.getEl();el.un({mousedown:this.stopMouseEvents,click:this.stopMouseEvents,scope:this});this.unbind();},stopMouseEvents:function(e){e.stopEvent();}});Ext.reg('gx_opacityslider',GeoExt.LayerOpacitySlider);Ext.namespace("GeoExt.data");GeoExt.data.AttributeReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WFSDescribeFeatureType();}
+GeoExt.data.AttributeReader.superclass.constructor.call(this,meta,recordType||meta.fields);if(meta.feature){this.recordType.prototype.fields.add(new Ext.data.Field("value"));}};Ext.extend(GeoExt.data.AttributeReader,Ext.data.DataReader,{read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},readRecords:function(data){var attributes;if(data instanceof Array){attributes=data;}else{attributes=this.meta.format.read(data).featureTypes[0].properties;}
+var feature=this.meta.feature;var recordType=this.recordType;var fields=recordType.prototype.fields;var numFields=fields.length;var attr,values,name,record,ignore,value,records=[];for(var i=0,len=attributes.length;i<len;++i){ignore=false;attr=attributes[i];values={};for(var j=0;j<numFields;++j){name=fields.items[j].name;value=attr[name];if(this.ignoreAttribute(name,value)){ignore=true;break;}
+values[name]=value;}
+if(feature){value=feature.attributes[values["name"]];if(value!==undefined){if(this.ignoreAttribute("value",value)){ignore=true;}else{values["value"]=value;}}}
+if(!ignore){records[records.length]=new recordType(values);}}
+return{success:true,records:records,totalRecords:records.length};},ignoreAttribute:function(name,value){var ignore=false;if(this.meta.ignore&&this.meta.ignore[name]){var matches=this.meta.ignore[name];if(typeof matches=="string"){ignore=(matches===value);}else if(matches instanceof Array){ignore=(matches.indexOf(value)>-1);}else if(matches instanceof RegExp){ignore=(matches.test(value));}}
+return ignore;}});Ext.namespace("GeoExt.plugins");GeoExt.plugins.TreeNodeComponent=Ext.extend(Ext.util.Observable,{constructor:function(config){Ext.apply(this.initialConfig,Ext.apply({},config));Ext.apply(this,config);GeoExt.plugins.TreeNodeComponent.superclass.constructor.apply(this,arguments);},init:function(tree){tree.on({"rendernode":this.onRenderNode,scope:this});},onRenderNode:function(node){var rendered=node.rendered;var attr=node.attributes;var component=attr.component||this.component;if(!rendered&&component){var elt=Ext.DomHelper.append(node.ui.elNode,[{"tag":"div"}]);if(typeof component=="function"){component=component(node,elt);}else if(typeof component=="object"&&typeof component.fn=="function"){component=component.fn.apply(component.scope,[node,elt]);}
+if(typeof component=="object"&&typeof component.xtype=="string"){component=Ext.ComponentMgr.create(component);}
+if(component instanceof Ext.Component){component.render(elt);node.component=component;}}},destroy:function(){tree.un("rendernode",this.onRenderNode,this);}});Ext.preg&&Ext.preg("gx_treenodecomponent",GeoExt.plugins.TreeNodeComponent);Ext.namespace("GeoExt");GeoExt.ZoomSliderTip=Ext.extend(GeoExt.SliderTip,{template:'<div>Zoom Level: {zoom}</div>'+'<div>Resolution: {resolution}</div>'+'<div>Scale: 1 : {scale}</div>',compiledTemplate:null,init:function(slider){this.compiledTemplate=new Ext.Template(this.template);GeoExt.ZoomSliderTip.superclass.init.call(this,slider);},getText:function(thumb){var data={zoom:thumb.value,resolution:this.slider.getResolution(),scale:Math.round(this.slider.getScale())};return this.compiledTemplate.apply(data);}});Ext.namespace("GeoExt.data");GeoExt.data.PrintProvider=Ext.extend(Ext.util.Observable,{url:null,capabilities:null,method:"POST",customParams:null,scales:null,dpis:null,layouts:null,dpi:null,layout:null,constructor:function(config){this.initialConfig=config;Ext.apply(this,config);if(!this.customParams){this.customParams={};}
+this.addEvents("loadcapabilities","layoutchange","dpichange","beforeprint","print","printexception","beforeencodelayer","encodelayer");GeoExt.data.PrintProvider.superclass.constructor.apply(this,arguments);this.scales=new Ext.data.JsonStore({root:"scales",sortInfo:{field:"value",direction:"DESC"},fields:["name",{name:"value",type:"float"}]});this.dpis=new Ext.data.JsonStore({root:"dpis",fields:["name",{name:"value",type:"float"}]});this.layouts=new Ext.data.JsonStore({root:"layouts",fields:["name",{name:"size",mapping:"map"},{name:"rotation",type:"boolean"}]});if(config.capabilities){this.loadStores();}else{if(this.url.split("/").pop()){this.url+="/";}
+this.initialConfig.autoLoad&&this.loadCapabilities();}},setLayout:function(layout){this.layout=layout;this.fireEvent("layoutchange",this,layout);},setDpi:function(dpi){this.dpi=dpi;this.fireEvent("dpichange",this,dpi);},print:function(map,pages,options){if(map instanceof GeoExt.MapPanel){map=map.map;}
+pages=pages instanceof Array?pages:[pages];options=options||{};if(this.fireEvent("beforeprint",this,map,pages,options)===false){return;}
+var jsonData=Ext.apply({units:map.getUnits(),srs:map.baseLayer.projection.getCode(),layout:this.layout.get("name"),dpi:this.dpi.get("value")},this.customParams);var pagesLayer=pages[0].feature.layer;var encodedLayers=[];Ext.each(map.layers,function(layer){if(layer!==pagesLayer&&layer.getVisibility()===true){var enc=this.encodeLayer(layer);enc&&encodedLayers.push(enc);}},this);jsonData.layers=encodedLayers;var encodedPages=[];Ext.each(pages,function(page){encodedPages.push(Ext.apply({center:[page.center.lon,page.center.lat],scale:page.scale.get("value"),rotation:page.rotation},page.customParams));},this);jsonData.pages=encodedPages;if(options.overview){var encodedOverviewLayers=[];Ext.each(options.overview.layers,function(layer){var enc=this.encodeLayer(layer);enc&&encodedOverviewLayers.push(enc);},this);jsonData.overviewLayers=encodedOverviewLayers;}
+if(options.legend){var legend=options.legend;var rendered=legend.rendered;if(!rendered){legend=legend.cloneConfig({renderTo:document.body,hidden:true});}
+var encodedLegends=[];legend.items.each(function(cmp){if(!cmp.hidden){var encFn=this.encoders.legends[cmp.getXType()];encodedLegends=encodedLegends.concat(encFn.call(this,cmp));}},this);if(!rendered){legend.destroy();}
+jsonData.legends=encodedLegends;}
+if(this.method==="GET"){var url=Ext.urlAppend(this.capabilities.printURL,"spec="+encodeURIComponent(Ext.encode(jsonData)));window.open(url);this.fireEvent("print",this,url);}else{Ext.Ajax.request({url:this.capabilities.createURL,jsonData:jsonData,success:function(response){var url=Ext.decode(response.responseText).getURL+
+(Ext.isIE?"?inline=true":"");if(Ext.isOpera||Ext.isIE){window.open(url);}else{window.location.href=url;}
+this.fireEvent("print",this,url);},failure:function(response){this.fireEvent("printexception",this,response);},params:this.initialConfig.baseParams,scope:this});}},loadCapabilities:function(){if(!this.url){return;}
+var url=this.url+"info.json";Ext.Ajax.request({url:url,method:"GET",disableCaching:false,success:function(response){this.capabilities=Ext.decode(response.responseText);this.loadStores();},params:this.initialConfig.baseParams,scope:this});},loadStores:function(){this.scales.loadData(this.capabilities);this.dpis.loadData(this.capabilities);this.layouts.loadData(this.capabilities);this.setLayout(this.layouts.getAt(0));this.setDpi(this.dpis.getAt(0));this.fireEvent("loadcapabilities",this,this.capabilities);},encodeLayer:function(layer){var encLayer;for(var c in this.encoders.layers){if(OpenLayers.Layer[c]&&layer instanceof OpenLayers.Layer[c]){if(this.fireEvent("beforeencodelayer",this,layer)===false){return;}
+encLayer=this.encoders.layers[c].call(this,layer);this.fireEvent("encodelayer",this,layer,encLayer);break;}}
+return(encLayer&&encLayer.type)?encLayer:null;},getAbsoluteUrl:function(url){var a;if(Ext.isIE){a=document.createElement("<a href='"+url+"'/>");a.style.display="none";document.body.appendChild(a);a.href=a.href;document.body.removeChild(a);}else{a=document.createElement("a");a.href=url;}
+return a.href;},encoders:{"layers":{"WMS":function(layer){var enc=this.encoders.layers.HTTPRequest.call(this,layer);Ext.apply(enc,{type:'WMS',layers:[layer.params.LAYERS].join(",").split(","),format:layer.params.FORMAT,styles:[layer.params.STYLES].join(",").split(",")});var param;for(var p in layer.params){param=p.toLowerCase();if(!layer.DEFAULT_PARAMS[param]&&"layers,styles,width,height,srs".indexOf(param)==-1){if(!enc.customParams){enc.customParams={};}
+enc.customParams[p]=layer.params[p];}}
+return enc;},"OSM":function(layer){var enc=this.encoders.layers.TileCache.call(this,layer);return Ext.apply(enc,{type:'OSM',baseURL:enc.baseURL.substr(0,enc.baseURL.indexOf("$")),extension:"png"});},"TMS":function(layer){var enc=this.encoders.layers.TileCache.call(this,layer);return Ext.apply(enc,{type:'TMS',format:layer.type});},"TileCache":function(layer){var enc=this.encoders.layers.HTTPRequest.call(this,layer);return Ext.apply(enc,{type:'TileCache',layer:layer.layername,maxExtent:layer.maxExtent.toArray(),tileSize:[layer.tileSize.w,layer.tileSize.h],extension:layer.extension,resolutions:layer.serverResolutions||layer.resolutions});},"KaMapCache":function(layer){var enc=this.encoders.layers.KaMap.call(this,layer);return Ext.apply(enc,{type:'KaMapCache',group:layer.params['g'],metaTileWidth:layer.params['metaTileSize']['w'],metaTileHeight:layer.params['metaTileSize']['h']});},"KaMap":function(layer){var enc=this.encoders.layers.HTTPRequest.call(this,layer);return Ext.apply(enc,{type:'KaMap',map:layer.params['map'],extension:layer.params['i'],group:layer.params['g']||"",maxExtent:layer.maxExtent.toArray(),tileSize:[layer.tileSize.w,layer.tileSize.h],resolutions:layer.serverResolutions||layer.resolutions});},"HTTPRequest":function(layer){return{baseURL:this.getAbsoluteUrl(layer.url instanceof Array?layer.url[0]:layer.url),opacity:(layer.opacity!=null)?layer.opacity:1.0,singleTile:layer.singleTile};},"Image":function(layer){return{type:'Image',baseURL:this.getAbsoluteUrl(layer.getURL(layer.extent)),opacity:(layer.opacity!=null)?layer.opacity:1.0,extent:layer.extent.toArray(),pixelSize:[layer.size.w,layer.size.h],name:layer.name};},"Vector":function(layer){if(!layer.features.length){return;}
+var encFeatures=[];var encStyles={};var features=layer.features;var featureFormat=new OpenLayers.Format.GeoJSON();var styleFormat=new OpenLayers.Format.JSON();var nextId=1;var styleDict={};var feature,style,dictKey,dictItem,styleName;for(var i=0,len=features.length;i<len;++i){feature=features[i];style=feature.style||layer.style||layer.styleMap.createSymbolizer(feature,feature.renderIntent);dictKey=styleFormat.write(style);dictItem=styleDict[dictKey];if(dictItem){styleName=dictItem;}else{styleDict[dictKey]=styleName=nextId++;if(style.externalGraphic){encStyles[styleName]=Ext.applyIf({externalGraphic:this.getAbsoluteUrl(style.externalGraphic)},style);}else{encStyles[styleName]=style;}}
+var featureGeoJson=featureFormat.extract.feature.call(featureFormat,feature);featureGeoJson.properties=OpenLayers.Util.extend({_gx_style:styleName},featureGeoJson.properties);encFeatures.push(featureGeoJson);}
+return{type:'Vector',styles:encStyles,styleProperty:'_gx_style',geoJson:{type:"FeatureCollection",features:encFeatures},name:layer.name,opacity:(layer.opacity!=null)?layer.opacity:1.0};}},"legends":{"gx_wmslegend":function(legend){var enc=this.encoders.legends.base.call(this,legend);var icons=[];for(var i=1,len=legend.items.getCount();i<len;++i){icons.push(this.getAbsoluteUrl(legend.items.get(i).url));}
+enc[0].classes[0]={name:"",icons:icons};return enc;},"gx_urllegend":function(legend){var enc=this.encoders.legends.base.call(this,legend);enc[0].classes.push({name:"",icon:this.getAbsoluteUrl(legend.items.get(1).url)});return enc;},"base":function(legend){return[{name:legend.items.get(0).text,classes:[]}];}}}});Ext.namespace("GeoExt");GeoExt.MapPanel=Ext.extend(Ext.Panel,{map:null,layers:null,center:null,zoom:null,prettyStateKeys:false,extent:null,stateEvents:["aftermapmove","afterlayervisibilitychange","afterlayeropacitychange"],initComponent:function(){if(!(this.map instanceof OpenLayers.Map)){this.map=new OpenLayers.Map(Ext.applyIf(this.map||{},{allOverlays:true}));}
+var layers=this.layers;if(!layers||layers instanceof Array){this.layers=new GeoExt.data.LayerStore({layers:layers,map:this.map.layers.length>0?this.map:null});}
+if(typeof this.center=="string"){this.center=OpenLayers.LonLat.fromString(this.center);}else if(this.center instanceof Array){this.center=new OpenLayers.LonLat(this.center[0],this.center[1]);}
+if(typeof this.extent=="string"){this.extent=OpenLayers.Bounds.fromString(this.extent);}else if(this.extent instanceof Array){this.extent=OpenLayers.Bounds.fromArray(this.extent);}
+GeoExt.MapPanel.superclass.initComponent.call(this);this.addEvents("aftermapmove","afterlayervisibilitychange","afterlayeropacitychange");this.map.events.on({"moveend":this.onMoveend,"changelayer":this.onLayerchange,scope:this});},onMoveend:function(){this.fireEvent("aftermapmove");},onLayerchange:function(e){if(e.property){if(e.property==="visibility"){this.fireEvent("afterlayervisibilitychange");}else if(e.property==="opacity"){this.fireEvent("afterlayeropacitychange");}}},applyState:function(state){this.center=new OpenLayers.LonLat(state.x,state.y);this.zoom=state.zoom;var i,l,layer,layerId,visibility,opacity;var layers=this.map.layers;for(i=0,l=layers.length;i<l;i++){layer=layers[i];layerId=this.prettyStateKeys?layer.name:layer.id;visibility=state["visibility_"+layerId];if(visibility!==undefined){visibility=(/^true$/i).test(visibility);if(layer.isBaseLayer){if(visibility){this.map.setBaseLayer(layer);}}else{layer.setVisibility(visibility);}}
+opacity=state["opacity_"+layerId];if(opacity!==undefined){layer.setOpacity(opacity);}}},getState:function(){var state;if(!this.map){return;}
+var center=this.map.getCenter();state={x:center.lon,y:center.lat,zoom:this.map.getZoom()};var i,l,layer,layerId,layers=this.map.layers;for(i=0,l=layers.length;i<l;i++){layer=layers[i];layerId=this.prettyStateKeys?layer.name:layer.id;state["visibility_"+layerId]=layer.getVisibility();state["opacity_"+layerId]=layer.opacity==null?1:layer.opacity;}
+return state;},updateMapSize:function(){if(this.map){this.map.updateSize();}},renderMap:function(){var map=this.map;map.render(this.body.dom);this.layers.bind(map);if(map.layers.length>0){if(this.center||this.zoom!=null){map.setCenter(this.center,this.zoom);}else if(this.extent){map.zoomToExtent(this.extent);}else{map.zoomToMaxExtent();}}},afterRender:function(){GeoExt.MapPanel.superclass.afterRender.apply(this,arguments);if(!this.ownerCt){this.renderMap();}else{this.ownerCt.on("move",this.updateMapSize,this);this.ownerCt.on({"afterlayout":{fn:this.renderMap,scope:this,single:true}});}},onResize:function(){GeoExt.MapPanel.superclass.onResize.apply(this,arguments);this.updateMapSize();},onBeforeAdd:function(item){if(typeof item.addToMapPanel==="function"){item.addToMapPanel(this);}
+GeoExt.MapPanel.superclass.onBeforeAdd.apply(this,arguments);},remove:function(item,autoDestroy){if(typeof item.removeFromMapPanel==="function"){item.removeFromMapPanel(this);}
+GeoExt.MapPanel.superclass.remove.apply(this,arguments);},beforeDestroy:function(){if(this.ownerCt){this.ownerCt.un("move",this.updateMapSize,this);}
+if(this.map&&this.map.events){this.map.events.un({"moveend":this.onMoveend,"changelayer":this.onLayerchange,scope:this});}
+if(!this.initialConfig.map||!(this.initialConfig.map instanceof OpenLayers.Map)){if(this.map&&this.map.destroy){this.map.destroy();}}
+delete this.map;GeoExt.MapPanel.superclass.beforeDestroy.apply(this,arguments);}});GeoExt.MapPanel.guess=function(){return Ext.ComponentMgr.all.find(function(o){return o instanceof GeoExt.MapPanel;});};Ext.reg('gx_mappanel',GeoExt.MapPanel);Ext.namespace("GeoExt");GeoExt.PrintMapPanel=Ext.extend(GeoExt.MapPanel,{sourceMap:null,printProvider:null,printPage:null,previewScales:null,center:null,zoom:null,extent:null,currentZoom:null,initComponent:function(){if(this.sourceMap instanceof GeoExt.MapPanel){this.sourceMap=this.sourceMap.map;}
+if(!this.map){this.map={};}
+Ext.applyIf(this.map,{projection:this.sourceMap.getProjection(),maxExtent:this.sourceMap.getMaxExtent(),maxResolution:this.sourceMap.getMaxResolution(),units:this.sourceMap.getUnits()});if(!(this.printProvider instanceof GeoExt.data.PrintProvider)){this.printProvider=new GeoExt.data.PrintProvider(this.printProvider);}
+this.printPage=new GeoExt.data.PrintPage({printProvider:this.printProvider});this.previewScales=new Ext.data.Store();this.previewScales.add(this.printProvider.scales.getRange());this.layers=[];var layer;Ext.each(this.sourceMap.layers,function(layer){var clone=layer.clone();layer.getVisibility()===true&&this.layers.push(clone);},this);this.extent=this.sourceMap.getExtent();GeoExt.PrintMapPanel.superclass.initComponent.call(this);this.printProvider.on("layoutchange",this.syncSize,this);this.printPage.on("change",this.fitZoom,this);this.map.events.register("moveend",this,this.updatePage);},afterRender:function(){GeoExt.PrintMapPanel.superclass.afterRender.apply(this,arguments);this.syncSize();if(this.initialConfig.limitScales===true){if(!this.ownerCt){this.calculatePreviewScales();}else{this.ownerCt.on({"afterlayout":{fn:this.calculatePreviewScales,scope:this,single:true}});}
+this.on("resize",this.calculatePreviewScales,this);}},adjustSize:function(width,height){var printSize=this.printProvider.layout.get("size");var ratio=printSize.width/printSize.height;var ownerCt=this.ownerCt;var targetWidth=(ownerCt&&ownerCt.autoWidth)?0:(width||this.initialConfig.width);var targetHeight=(ownerCt&&ownerCt.autoHeight)?0:(height||this.initialConfig.height);if(targetWidth){height=targetWidth/ratio;if(targetHeight&&height>targetHeight){height=targetHeight;width=height*ratio;}else{width=targetWidth;}}else if(targetHeight){width=targetHeight*ratio;height=targetHeight;}
+return{width:width,height:height};},fitZoom:function(){if(!this._updating&&this.printPage.scale){this._updating=true;var printBounds=this.printPage.getPrintExtent(this.map);this.currentZoom=this.map.getZoomForExtent(printBounds);this.map.zoomToExtent(printBounds);delete this._updating;}},updatePage:function(){if(!this._updating){var zoom=this.map.getZoom();this._updating=true;if(zoom===this.currentZoom){this.printPage.setCenter(this.map.getCenter());}else{this.printPage.fit(this.map);}
+delete this._updating;this.currentZoom=zoom;}},calculatePreviewScales:function(){this.previewScales.removeAll();this.printPage.suspendEvents();var scale=this.printPage.scale;var viewSize=this.map.getSize();var scalesByZoom={};var zooms=[];this.printProvider.scales.each(function(rec){this.printPage.setScale(rec);var extent=this.printPage.getPrintExtent(this.map);var zoom=this.map.getZoomForExtent(extent);var idealResolution=Math.max(extent.getWidth()/viewSize.w,extent.getHeight()/viewSize.h);var resolution=this.map.getResolutionForZoom(zoom);var diff=Math.abs(idealResolution-resolution);if(!(zoom in scalesByZoom)||scalesByZoom[zoom].diff>diff){scalesByZoom[zoom]={rec:rec,diff:diff};zooms.indexOf(zoom)==-1&&zooms.push(zoom);}},this);for(var i=0,ii=zooms.length;i<ii;++i){this.previewScales.add(scalesByZoom[zooms[i]].rec);}
+scale&&this.printPage.setScale(scale);this.printPage.resumeEvents();if(scale&&this.previewScales.getCount()>0){var maxScale=this.previewScales.getAt(0);var minScale=this.previewScales.getAt(this.previewScales.getCount()-1);if(scale.get("value")<minScale.get("value")){this.printPage.setScale(minScale);}else if(scale.get("value")>maxScale.get("value")){this.printPage.setScale(maxScale);}}
+this.fitZoom();},print:function(options){this.printProvider.print(this.map,[this.printPage],options);},beforeDestroy:function(){this.map.events.unregister("moveend",this,this.updatePage);this.printPage.un("change",this.fitZoom,this);this.printProvider.un("layoutchange",this.syncSize,this);GeoExt.PrintMapPanel.superclass.beforeDestroy.apply(this,arguments);}});Ext.reg('gx_printmappanel',GeoExt.PrintMapPanel);Ext.namespace("GeoExt.data");GeoExt.data.ScaleStore=Ext.extend(Ext.data.Store,{map:null,constructor:function(config){var map=(config.map instanceof GeoExt.MapPanel?config.map.map:config.map);delete config.map;config=Ext.applyIf(config,{reader:new Ext.data.JsonReader({},["level","resolution","scale"])});GeoExt.data.ScaleStore.superclass.constructor.call(this,config);if(map){this.bind(map);}},bind:function(map,options){this.map=(map instanceof GeoExt.MapPanel?map.map:map);this.map.events.register('changebaselayer',this,this.populateFromMap);if(this.map.baseLayer){this.populateFromMap();}else{this.map.events.register('addlayer',this,this.populateOnAdd);}},unbind:function(){if(this.map){this.map.events.unregister('addlayer',this,this.populateOnAdd);this.map.events.unregister('changebaselayer',this,this.populateFromMap);delete this.map;}},populateOnAdd:function(evt){if(evt.layer.isBaseLayer){this.populateFromMap();this.map.events.unregister('addlayer',this,this.populateOnAdd);}},populateFromMap:function(){var zooms=[];var resolutions=this.map.baseLayer.resolutions;var units=this.map.baseLayer.units;for(var i=resolutions.length-1;i>=0;i--){var res=resolutions[i];zooms.push({level:i,resolution:res,scale:OpenLayers.Util.getScaleFromResolution(res,units)});}
+this.loadData(zooms);},destroy:function(){this.unbind();GeoExt.data.ScaleStore.superclass.destroy.apply(this,arguments);}});Ext.namespace("GeoExt.data");GeoExt.data.FeatureStoreMixin=function(){return{layer:null,reader:null,featureFilter:null,constructor:function(config){config=config||{};config.reader=config.reader||new GeoExt.data.FeatureReader({},config.fields);var layer=config.layer;delete config.layer;if(config.features){config.data=config.features;}
+delete config.features;var options={initDir:config.initDir};delete config.initDir;arguments.callee.superclass.constructor.call(this,config);if(layer){this.bind(layer,options);}},bind:function(layer,options){if(this.layer){return;}
+this.layer=layer;options=options||{};var initDir=options.initDir;if(options.initDir==undefined){initDir=GeoExt.data.FeatureStore.LAYER_TO_STORE|GeoExt.data.FeatureStore.STORE_TO_LAYER;}
+var features=layer.features.slice(0);if(initDir&GeoExt.data.FeatureStore.STORE_TO_LAYER){var records=this.getRange();for(var i=records.length-1;i>=0;i--){this.layer.addFeatures([records[i].getFeature()]);}}
+if(initDir&GeoExt.data.FeatureStore.LAYER_TO_STORE){this.loadData(features,true);}
+layer.events.on({"featuresadded":this.onFeaturesAdded,"featuresremoved":this.onFeaturesRemoved,"featuremodified":this.onFeatureModified,scope:this});this.on({"load":this.onLoad,"clear":this.onClear,"add":this.onAdd,"remove":this.onRemove,"update":this.onUpdate,scope:this});},unbind:function(){if(this.layer){this.layer.events.un({"featuresadded":this.onFeaturesAdded,"featuresremoved":this.onFeaturesRemoved,"featuremodified":this.onFeatureModified,scope:this});this.un("load",this.onLoad,this);this.un("clear",this.onClear,this);this.un("add",this.onAdd,this);this.un("remove",this.onRemove,this);this.un("update",this.onUpdate,this);this.layer=null;}},getRecordFromFeature:function(feature){var record=null;if(feature.state!==OpenLayers.State.INSERT){record=this.getById(feature.id);}else{var index=this.findBy(function(r){return r.getFeature()===feature;});if(index>-1){record=this.getAt(index);}}
+return record;},onFeaturesAdded:function(evt){if(!this._adding){var features=evt.features,toAdd=features;if(this.featureFilter){toAdd=[];var i,len,feature;for(var i=0,len=features.length;i<len;i++){feature=features[i];if(this.featureFilter.evaluate(feature)!==false){toAdd.push(feature);}}}
+this._adding=true;this.loadData(toAdd,true);delete this._adding;}},onFeaturesRemoved:function(evt){if(!this._removing){var features=evt.features,feature,record,i;for(i=features.length-1;i>=0;i--){feature=features[i];record=this.getRecordFromFeature(feature);if(record!==undefined){this._removing=true;this.remove(record);delete this._removing;}}}},onFeatureModified:function(evt){if(!this._updating){var feature=evt.feature;var record=this.getRecordFromFeature(feature);if(record!==undefined){record.beginEdit();var attributes=feature.attributes;if(attributes){var fields=this.recordType.prototype.fields;for(var i=0,len=fields.length;i<len;i++){var field=fields.items[i];var key=field.mapping||field.name;if(key in attributes){record.set(field.name,field.convert(attributes[key]));}}}
+record.set("state",feature.state);record.set("fid",feature.fid);record.setFeature(feature);this._updating=true;record.endEdit();delete this._updating;}}},addFeaturesToLayer:function(records){var i,len,features;features=new Array((len=records.length));for(i=0;i<len;i++){features[i]=records[i].getFeature();}
+if(features.length>0){this._adding=true;this.layer.addFeatures(features);delete this._adding;}},onLoad:function(store,records,options){if(!options||options.add!==true){this._removing=true;this.layer.removeFeatures(this.layer.features);delete this._removing;this.addFeaturesToLayer(records);}},onClear:function(store){this._removing=true;this.layer.removeFeatures(this.layer.features);delete this._removing;},onAdd:function(store,records,index){if(!this._adding){this.addFeaturesToLayer(records);}},onRemove:function(store,record,index){if(!this._removing){var feature=record.getFeature();if(this.layer.getFeatureById(feature.id)!=null){this._removing=true;this.layer.removeFeatures([record.getFeature()]);delete this._removing;}}},onUpdate:function(store,record,operation){if(!this._updating){var defaultFields=new GeoExt.data.FeatureRecord().fields;var feature=record.getFeature();if(record.fields){var cont=this.layer.events.triggerEvent("beforefeaturemodified",{feature:feature});if(cont!==false){var attributes=feature.attributes;record.fields.each(function(field){var key=field.mapping||field.name;if(!defaultFields.containsKey(key)){attributes[key]=record.get(field.name);}});this._updating=true;this.layer.events.triggerEvent("featuremodified",{feature:feature});delete this._updating;if(this.layer.getFeatureById(feature.id)!=null){this.layer.drawFeature(feature);}}}}}};};GeoExt.data.FeatureStore=Ext.extend(Ext.data.Store,new GeoExt.data.FeatureStoreMixin);GeoExt.data.FeatureStore.LAYER_TO_STORE=1;GeoExt.data.FeatureStore.STORE_TO_LAYER=2;Ext.namespace("GeoExt.data");GeoExt.data.WFSCapabilitiesStore=function(c){c=c||{};GeoExt.data.WFSCapabilitiesStore.superclass.constructor.call(this,Ext.apply(c,{proxy:c.proxy||(!c.data?new Ext.data.HttpProxy({url:c.url,disableCaching:false,method:"GET"}):undefined),reader:new GeoExt.data.WFSCapabilitiesReader(c,c.fields)}));};Ext.extend(GeoExt.data.WFSCapabilitiesStore,Ext.data.Store);Ext.namespace("GeoExt.plugins");GeoExt.plugins.AttributeForm=function(config){Ext.apply(this,config);};GeoExt.plugins.AttributeForm.prototype={attributeStore:null,formPanel:null,init:function(formPanel){this.formPanel=formPanel;if(this.attributeStore instanceof Ext.data.Store){this.fillForm();this.bind(this.attributeStore);}
+formPanel.on("destroy",this.onFormDestroy,this);},bind:function(store){this.unbind();store.on({"load":this.onLoad,scope:this});this.attributeStore=store;},unbind:function(){if(this.attributeStore){this.attributeStore.un("load",this.onLoad,this);}},onLoad:function(){if(this.formPanel.items){this.formPanel.removeAll();}
+this.fillForm();},fillForm:function(){this.attributeStore.each(function(record){var field=GeoExt.form.recordToField(record);if(field){this.formPanel.add(field);}},this);this.formPanel.doLayout();},onFormDestroy:function(){this.unbind();}};Ext.preg("gx_attributeform",GeoExt.plugins.AttributeForm);Ext.namespace('GeoExt','GeoExt.data');GeoExt.data.ProtocolProxy=function(config){Ext.apply(this,config);GeoExt.data.ProtocolProxy.superclass.constructor.apply(this,arguments);};Ext.extend(GeoExt.data.ProtocolProxy,Ext.data.DataProxy,{protocol:null,abortPrevious:true,setParamsAsOptions:false,response:null,load:function(params,reader,callback,scope,arg){if(this.fireEvent("beforeload",this,params)!==false){var o={params:params||{},request:{callback:callback,scope:scope,arg:arg},reader:reader};var cb=OpenLayers.Function.bind(this.loadResponse,this,o);if(this.abortPrevious){this.abortRequest();}
+var options={params:params,callback:cb,scope:this};Ext.applyIf(options,arg);if(this.setParamsAsOptions===true){Ext.applyIf(options,options.params);delete options.params;}
+this.response=this.protocol.read(options);}else{callback.call(scope||this,null,arg,false);}},abortRequest:function(){if(this.response){this.protocol.abort(this.response);this.response=null;}},loadResponse:function(o,response){if(response.success()){var result=o.reader.read(response);this.fireEvent("load",this,o,o.request.arg);o.request.callback.call(o.request.scope,result,o.request.arg,true);}else{this.fireEvent("loadexception",this,o,response);o.request.callback.call(o.request.scope,null,o.request.arg,false);}}});Ext.namespace("GeoExt");GeoExt.Action=Ext.extend(Ext.Action,{control:null,map:null,uScope:null,uHandler:null,uToggleHandler:null,uCheckHandler:null,constructor:function(config){this.uScope=config.scope;this.uHandler=config.handler;this.uToggleHandler=config.toggleHandler;this.uCheckHandler=config.checkHandler;config.scope=this;config.handler=this.pHandler;config.toggleHandler=this.pToggleHandler;config.checkHandler=this.pCheckHandler;var ctrl=this.control=config.control;delete config.control;if(ctrl){if(config.map){config.map.addControl(ctrl);delete config.map;}
+if((config.pressed||config.checked)&&ctrl.map){ctrl.activate();}
+ctrl.events.on({activate:this.onCtrlActivate,deactivate:this.onCtrlDeactivate,scope:this});}
+arguments.callee.superclass.constructor.call(this,config);},pHandler:function(cmp){var ctrl=this.control;if(ctrl&&ctrl.type==OpenLayers.Control.TYPE_BUTTON){ctrl.trigger();}
+if(this.uHandler){this.uHandler.apply(this.uScope,arguments);}},pToggleHandler:function(cmp,state){this.changeControlState(state);if(this.uToggleHandler){this.uToggleHandler.apply(this.uScope,arguments);}},pCheckHandler:function(cmp,state){this.changeControlState(state);if(this.uCheckHandler){this.uCheckHandler.apply(this.uScope,arguments);}},changeControlState:function(state){if(state){if(!this._activating){this._activating=true;this.control.activate();this._activating=false;}}else{if(!this._deactivating){this._deactivating=true;this.control.deactivate();this._deactivating=false;}}},onCtrlActivate:function(){var ctrl=this.control;if(ctrl.type==OpenLayers.Control.TYPE_BUTTON){this.enable();}else{this.safeCallEach("toggle",[true]);this.safeCallEach("setChecked",[true]);}},onCtrlDeactivate:function(){var ctrl=this.control;if(ctrl.type==OpenLayers.Control.TYPE_BUTTON){this.disable();}else{this.safeCallEach("toggle",[false]);this.safeCallEach("setChecked",[false]);}},safeCallEach:function(fnName,args){var cs=this.items;for(var i=0,len=cs.length;i<len;i++){if(cs[i][fnName]){cs[i].rendered?cs[i][fnName].apply(cs[i],args):cs[i].on({"render":cs[i][fnName].createDelegate(cs[i],args),single:true});}}}});Ext.namespace("GeoExt.tree");GeoExt.tree.TreeNodeUIEventMixin=function(){return{constructor:function(node){node.addEvents("rendernode","rawclicknode");this.superclass=arguments.callee.superclass;this.superclass.constructor.apply(this,arguments);},render:function(bulkRender){if(!this.rendered){this.superclass.render.apply(this,arguments);this.fireEvent("rendernode",this.node);}},onClick:function(e){if(this.fireEvent("rawclicknode",this.node,e)!==false){this.superclass.onClick.apply(this,arguments);}}}};Ext.namespace("GeoExt.plugins");GeoExt.plugins.TreeNodeRadioButton=Ext.extend(Ext.util.Observable,{constructor:function(config){Ext.apply(this.initialConfig,Ext.apply({},config));Ext.apply(this,config);this.addEvents("radiochange");GeoExt.plugins.TreeNodeRadioButton.superclass.constructor.apply(this,arguments);},init:function(tree){tree.on({"rendernode":this.onRenderNode,"rawclicknode":this.onRawClickNode,"beforedestroy":this.onBeforeDestroy,scope:this});},onRenderNode:function(node){var a=node.attributes;if(a.radioGroup&&!a.radio){a.radio=Ext.DomHelper.insertBefore(node.ui.anchor,['<input type="radio" class="gx-tree-radio" name="',a.radioGroup,'_radio"></input>'].join(""));}},onRawClickNode:function(node,e){var el=e.getTarget('.gx-tree-radio',1);if(el){el.defaultChecked=el.checked;this.fireEvent("radiochange",node);return false;}},onBeforeDestroy:function(tree){tree.un("rendernode",this.onRenderNode,this);tree.un("rawclicknode",this.onRenderNode,this);tree.un("beforedestroy",this.onBeforeDestroy,this);}});Ext.preg("gx_treenoderadiobutton",GeoExt.plugins.TreeNodeRadioButton);Ext.namespace("GeoExt.data");GeoExt.data.WMSCapabilitiesStore=function(c){c=c||{};GeoExt.data.WMSCapabilitiesStore.superclass.constructor.call(this,Ext.apply(c,{proxy:c.proxy||(!c.data?new Ext.data.HttpProxy({url:c.url,disableCaching:false,method:"GET"}):undefined),reader:new GeoExt.data.WMSCapabilitiesReader(c,c.fields)}));};Ext.extend(GeoExt.data.WMSCapabilitiesStore,Ext.data.Store);Ext.namespace("GeoExt");GeoExt.LayerOpacitySliderTip=Ext.extend(GeoExt.SliderTip,{template:'<div>{opacity}%</div>',compiledTemplate:null,init:function(slider){this.compiledTemplate=new Ext.Template(this.template);GeoExt.LayerOpacitySliderTip.superclass.init.call(this,slider);},getText:function(thumb){var data={opacity:thumb.value};return this.compiledTemplate.apply(data);}});GeoExt.version='1.0';
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.js	(revision 76)
@@ -0,0 +1,83 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: override = Ext.Ajax */
+(function() {
+
+    /** private: function[createComplete]
+     *  ``Function``
+     */
+    var createComplete = function(fn, cb) {
+        return function(request) {
+            if(cb && cb[fn]) {
+                cb[fn].call(cb.scope || window, {
+                    responseText: request.responseText,
+                    responseXML: request.responseXML,
+                    argument: cb.argument
+                });
+            }
+        };
+    };
+
+    Ext.apply(Ext.lib.Ajax, {
+        /** private: method[request]
+         */
+        request: function(method, uri, cb, data, options) {
+            options = options || {};
+            method = method || options.method;
+            var hs = options.headers;
+            if(options.xmlData) {
+                if(!hs || !hs["Content-Type"]) {
+                    hs = hs || {};
+                    hs["Content-Type"] = "text/xml";
+                }
+                method = method || "POST";
+                data = options.xmlData;
+            } else if(options.jsonData) {
+                if(!hs || !hs["Content-Type"]) {
+                    hs = hs || {};
+                    hs["Content-Type"] = "application/json";
+                }
+                method = method || "POST";
+                data = typeof options.jsonData == "object" ?
+                       Ext.encode(options.jsonData) : options.jsonData;
+            }
+            // if POST method, options.form or options.params means
+            // form-encoded data, so change content-type
+            if ((method && method.toLowerCase() == "post") &&
+               (options.form || options.params) &&
+               (!hs || !hs["Content-Type"])) {
+                hs = hs || {};
+                hs["Content-Type"] = "application/x-www-form-urlencoded";
+            }
+            return OpenLayers.Request.issue({
+                success: createComplete("success", cb),
+                failure: createComplete("failure", cb),
+                method: method,
+                headers: hs,
+                data: data,
+                url: uri
+            });
+        },
+
+        /** private: method[isCallInProgress]
+         *  :params request: ``Object`` The XHR object.
+         */
+        isCallInProgress: function(request) {
+            // do not prevent our caller from calling abort()
+            return true;
+        },
+
+        /** private: method[abort]
+         *  :params request: ``Object`` The XHR object.
+         */
+        abort: function(request) {
+            request.abort();
+        }
+    });
+})();
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.jst
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.jst	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/overrides/override-ext-ajax.jst	(revision 76)
@@ -0,0 +1,64 @@
+.. _overrides.ext.ajax:
+
+Ext.Ajax Overrides
+==================
+
+GeoExt provides an override for the functionality in
+`Ext.Ajax <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Ajax>`_.  If you include
+the :file:`override-ext-ajax.js` file in your build, any calls to ``Ext.Ajax``
+methods will be routed through ``OpenLayers.Request`` methods.  The practical
+implication of this is that you can set the ``OpenLayers.ProxyHost`` property
+in your application and have this proxy used by Ext components that call
+``Ext.Ajax`` methods.
+
+To include :file:`override-ext-ajax.js` in your build, the GeoExt section in
+your build config should look like one of the following:
+
+.. code-block:: ini
+
+    # include everything (including override-ext-ajax.js)
+    [GeoExt.js]
+    root = ../lib
+    license = geoext-license.js
+    exclude =
+        GeoExt.js
+        GeoExt/SingleFile.js
+
+
+or
+
+.. code-block:: ini
+
+    # custom build
+    [GeoExt.js]
+    root = ../lib
+    license = geoext-license.js
+    include =
+        overrides/override-ext-ajax.js
+        # other files listed here ...
+
+
+Workaround for Existing Builds
+------------------------------
+
+If you are using a build of GeoExt that includes the Ajax overrides (e.g. the
+0.6 release or earlier), you can work around any issues you may have using this
+override in your appliction by protecting the ``Ext.lib.Ajax`` object before
+loading file:`GeoExt.js`.
+
+The example markup below will remove the effect of the override on Ajax methods.
+
+.. code-block:: html
+
+    <script src="path/to/ext.js"></script>
+    <script>
+        Ext.lib._Ajax = Ext.lib.Ajax; // protect the original
+        Ext.lib.Ajax = {};  // create dummy for override
+    </script>
+    <script src="path/to/GeoExt.js"></script>
+    <script>
+        Ext.lib.Ajax = Ext.lib._Ajax; // restore the original
+    </script>
+
+Note that issues with the Ajax override present in 0.6 will be fixed in
+subsequent releases.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt.js	(revision 76)
@@ -0,0 +1,148 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/*
+ * The code in this file is based on code taken from OpenLayers.
+ *
+ * Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD
+ * license.  See http://svn.openlayers.org/trunk/openlayers/license.txt for the
+ * full text of the license.
+ */
+ 
+(function() {
+
+    /**
+     * Check to see if GeoExt.singleFile is true. It is true if the
+     * GeoExt/SingleFile.js is included before this one, as it is
+     * the case in single file builds.
+     */
+    var singleFile = (typeof GeoExt == "object" && GeoExt.singleFile);
+
+    /**
+     * The relative path of this script.
+     */
+    var scriptName = singleFile ? "GeoExt.js" : "lib/GeoExt.js";
+
+    /**
+     * Function returning the path of this script.
+     */
+    var getScriptLocation = function() {
+        var scriptLocation = "";
+        // If we load other scripts right before GeoExt using the same
+        // mechanism to add script resources dynamically (e.g. OpenLayers), 
+        // document.getElementsByTagName will not find the GeoExt script tag
+        // in FF2. Using document.documentElement.getElementsByTagName instead
+        // works around this issue.
+        var scripts = document.documentElement.getElementsByTagName('script');
+        for(var i=0, len=scripts.length; i<len; i++) {
+            var src = scripts[i].getAttribute('src');
+            if(src) {
+                var index = src.lastIndexOf(scriptName); 
+                // set path length for src up to a query string
+                var pathLength = src.lastIndexOf('?');
+                if(pathLength < 0) {
+                    pathLength = src.length;
+                }
+                // is it found, at the end of the URL?
+                if((index > -1) && (index + scriptName.length == pathLength)) {
+                    scriptLocation = src.slice(0, pathLength - scriptName.length);
+                    break;
+                }
+            }
+        }
+        return scriptLocation;
+    };
+
+    /**
+     * If GeoExt.singleFile is false then the JavaScript files in the jsfiles
+     * array are autoloaded.
+     */
+    if(!singleFile) {
+        var jsfiles = new Array(
+            "GeoExt/data/AttributeReader.js",
+            "GeoExt/data/AttributeStore.js",
+            "GeoExt/data/FeatureRecord.js",
+            "GeoExt/data/FeatureReader.js",
+            "GeoExt/data/FeatureStore.js",
+            "GeoExt/data/LayerRecord.js",
+            "GeoExt/data/LayerReader.js",
+            "GeoExt/data/LayerStore.js",
+            "GeoExt/data/ScaleStore.js",
+            "GeoExt/data/WMSCapabilitiesReader.js",
+            "GeoExt/data/WMSCapabilitiesStore.js",
+            "GeoExt/data/WFSCapabilitiesReader.js",
+            "GeoExt/data/WFSCapabilitiesStore.js",
+            "GeoExt/data/WMSDescribeLayerReader.js",
+            "GeoExt/data/WMSDescribeLayerStore.js",
+            "GeoExt/data/WMCReader.js",
+            "GeoExt/widgets/Action.js",
+            "GeoExt/data/ProtocolProxy.js",
+            "GeoExt/widgets/FeatureRenderer.js",
+            "GeoExt/widgets/MapPanel.js",
+            "GeoExt/widgets/Popup.js",
+            "GeoExt/widgets/form.js",
+            "GeoExt/widgets/form/SearchAction.js",
+            "GeoExt/widgets/form/BasicForm.js",
+            "GeoExt/widgets/form/FormPanel.js",
+            "GeoExt/widgets/tips/SliderTip.js",
+            "GeoExt/widgets/tips/LayerOpacitySliderTip.js",
+            "GeoExt/widgets/tips/ZoomSliderTip.js",
+            "GeoExt/widgets/tree/LayerNode.js",
+            "GeoExt/widgets/tree/TreeNodeUIEventMixin.js",
+            "GeoExt/plugins/TreeNodeComponent.js",
+            "GeoExt/plugins/TreeNodeRadioButton.js",
+            "GeoExt/widgets/tree/LayerLoader.js",
+            "GeoExt/widgets/tree/LayerContainer.js",
+            "GeoExt/widgets/tree/BaseLayerContainer.js",
+            "GeoExt/widgets/tree/OverlayLayerContainer.js",
+            "GeoExt/widgets/tree/LayerParamNode.js",
+            "GeoExt/widgets/tree/LayerParamLoader.js",
+            "GeoExt/widgets/tree/WMSCapabilitiesLoader.js",
+            "GeoExt/widgets/LayerOpacitySlider.js",
+            "GeoExt/widgets/LayerLegend.js",
+            "GeoExt/widgets/LegendImage.js",
+            "GeoExt/widgets/UrlLegend.js",
+            "GeoExt/widgets/WMSLegend.js",
+            "GeoExt/widgets/VectorLegend.js",
+            "GeoExt/widgets/LegendPanel.js",
+            "GeoExt/widgets/ZoomSlider.js",
+            "GeoExt/widgets/grid/FeatureSelectionModel.js",
+            "GeoExt/data/PrintPage.js",
+            "GeoExt/data/PrintProvider.js",
+            "GeoExt/plugins/PrintPageField.js",
+            "GeoExt/plugins/PrintProviderField.js",
+            "GeoExt/plugins/PrintExtent.js",
+            "GeoExt/plugins/AttributeForm.js",
+            "GeoExt/widgets/PrintMapPanel.js",
+            "GeoExt/state/PermalinkProvider.js"
+        );
+
+        var agent = navigator.userAgent;
+        var docWrite = (agent.match("MSIE") || agent.match("Safari"));
+        if(docWrite) {
+            var allScriptTags = new Array(jsfiles.length);
+        }
+        var host = getScriptLocation() + "lib/";    
+        for (var i=0, len=jsfiles.length; i<len; i++) {
+            if (docWrite) {
+                allScriptTags[i] = "<script src='" + host + jsfiles[i] +
+                                   "'></script>"; 
+            } else {
+                var s = document.createElement("script");
+                s.src = host + jsfiles[i];
+                var h = document.getElementsByTagName("head").length ? 
+                           document.getElementsByTagName("head")[0] : 
+                           document.body;
+                h.appendChild(s);
+            }
+        }
+        if (docWrite) {
+            document.write(allScriptTags.join(""));
+        }
+    }
+})();
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/state/PermalinkProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/state/PermalinkProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/state/PermalinkProvider.js	(revision 76)
@@ -0,0 +1,138 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.state
+ *  class = PermalinkProvider
+ *  base_link = `Ext.state.Provider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider>`_
+ */
+Ext.namespace("GeoExt.state");
+
+/** api: example
+ *  Sample code displaying a new permalink each time the map is moved.
+ *
+ *  .. code-block:: javascript
+ *
+ *      // create permalink provider
+ *      var permalinkProvider = new GeoExt.state.PermalinkProvider();
+ *
+ *      // set it in the state manager
+ *      Ext.state.Manager.setProvider(permalinkProvider);
+ *
+ *      // create a map panel, and make it stateful
+ *      var mapPanel = new GeoExt.MapPanel({
+ *          renderTo: "map",
+ *          layers: [
+ *              new OpenLayers.Layer.WMS(
+ *                  "Global Imagery",
+ *                  "http://maps.opengeo.org/geowebcache/service/wms",
+ *                  {layers: "bluemarble"}
+ *              )
+ *          ],
+ *          stateId: "map",
+ *          prettyStateKeys: true // for pretty permalinks
+ *      });
+ *
+ *      // display permalink each time state is changed
+ *      permalinkProvider.on({
+ *          statechanged: function(provider, name, value) {
+ *              alert(provider.getLink());
+ *          }
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: PermalinkProvider(config)
+ *
+ *      Create a permalink provider.
+ *
+ */
+GeoExt.state.PermalinkProvider = function(config) {
+    GeoExt.state.PermalinkProvider.superclass.constructor.apply(this, arguments);
+
+    config = config || {};
+
+    var url = config.url;
+    delete config.url;
+
+    Ext.apply(this, config);
+
+    this.state = this.readURL(url);
+};
+
+Ext.extend(GeoExt.state.PermalinkProvider, Ext.state.Provider, {
+
+    /** api: config[encodeType]
+     *  ``Boolean`` Specifies whether type of state values should be encoded
+     *  and decoded. Set it to false if you work with components that don't
+     *  require encoding types, and want pretty permalinks. Defaults to true.
+     */
+    /** private: property[encodeType]
+     *  ``Boolean``
+     */
+    encodeType: true,
+
+    /** private: method[readURL]
+     *  :param url: ``String`` The URL to get the state from.
+     *  :return: ``Object`` The state object.
+     *
+     *  Create a state object from a URL.
+     */
+    readURL: function(url) {
+        var state = {};
+        var params = OpenLayers.Util.getParameters(url);
+        var k, split, stateId;
+        for(k in params) {
+            if(params.hasOwnProperty(k)) {
+                split = k.split("_");
+                if(split.length > 1) {
+                    stateId = split[0];
+                    state[stateId] = state[stateId] || {};
+                    state[stateId][split.slice(1).join("_")] = this.encodeType ?
+                        this.decodeValue(params[k]) : params[k];
+                }
+            }
+        }
+        return state;
+    },
+
+    /** api: method[getLink]
+     *  :param base: ``String`` The base URL, optional.
+     *  :return: ``String`` The permalink.
+     *
+     *  Return the permalink corresponding to the current state.
+     */
+    getLink: function(base) {
+        base = base || document.location.href;
+
+        var params = {};
+
+        var id, k, state = this.state;
+        for(id in state) {
+            if(state.hasOwnProperty(id)) {
+                for(k in state[id]) {
+                    params[id + "_" + k] = this.encodeType ?
+                        unescape(this.encodeValue(state[id][k])) : state[id][k];
+                }
+            }
+        }
+
+        // merge params in the URL into the state params
+        OpenLayers.Util.applyDefaults(
+            params, OpenLayers.Util.getParameters(base));
+
+        var paramsStr = OpenLayers.Util.getParameterString(params);
+
+        var qMark = base.indexOf("?");
+        if(qMark > 0) {
+            base = base.substring(0, qMark);
+        }
+
+        return Ext.urlAppend(base, paramsStr);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintExtent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintExtent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintExtent.js	(revision 76)
@@ -0,0 +1,400 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = PrintExtent
+ */
+
+/** api: example
+ *  Sample code to create a MapPanel with a PrintExtent, and print it
+ *  immediately:
+ * 
+ *  .. code-block:: javascript
+ *
+ *      var printExtent = new GeoExt.plugins.PrintExtent({
+ *          printProvider: new GeoExt.data.PrintProvider({
+ *              capabilities: printCapabilities
+ *          })
+ *      });
+ *     
+ *      var mapPanel = new GeoExt.MapPanel({
+ *          border: false,
+ *          renderTo: "div-id",
+ *          layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+ *              {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+ *          center: [146.56, -41.56],
+ *          zoom: 6,
+ *          plugins: printExtent
+ *      });
+ *
+ *      printExtent.addPage();
+ *
+ *      // print the map
+ *      printExtent.print();
+ */
+
+/** api: constructor
+ *  .. class:: PrintExtent
+ * 
+ *  Provides a way to show and modify the extents of print pages on the map. It
+ *  uses a layer to render the page extent and handle features of print pages,
+ *  and provides a control to modify them. Must be set as a plugin to a
+ *  :class:`GeoExt.MapPanel`.
+ */
+GeoExt.plugins.PrintExtent = Ext.extend(Ext.util.Observable, {
+
+    /** private: initialConfig
+     *  ``Object`` Holds the initial config object passed to the
+     *  constructor.
+     */
+    initialConfig: null,
+
+    /** api: config[printProvider]
+     *  :class:`GeoExt.data.PrintProvider` The print provider this form
+     *  is connected to. Optional if pages are provided.
+     */
+    /** api: property[printProvider]
+     *  :class:`GeoExt.data.PrintProvider` The print provider this form
+     *  is connected to. Read-only.
+     */
+    printProvider: null,
+    
+    /** private: property[map]
+     *  ``OpenLayers.Map`` The map the layer and control are added to.
+     */
+    map: null,
+    
+    /** api: config[layer]
+     *  ``OpenLayers.Layer.Vector`` The layer used to render extent and handle
+     *  features to. Optional, will be created if not provided.
+     */
+    /** private: property[layer]
+     *  ``OpenLayers.Layer.Vector`` The layer used to render extent and handle
+     *  features to.
+     */
+    layer: null,
+    
+    /** private: property[control]
+     *  ``OpenLayers.Control.TransformFeature`` The control used to change
+     *      extent, center, rotation and scale.
+     */
+    control: null,
+    
+    /** api: config[pages]
+     *  Array of :class:`GeoExt.data.PrintPage` The pages that this plugin
+     *  controls. Optional. If not provided, it will be created with one page
+     *  that is completely contained within the visible map extent.
+     *  
+     *  .. note:: All pages must use the same PrintProvider.
+     */
+    /** api: property[pages]
+     *  Array of :class:`GeoExt.data.PrintPage` The pages that this component
+     *  controls. Read-only.
+     */
+    pages: null,
+
+    /** api: property[page]
+     *  :class:`GeoExt.data.PrintPage` The page currently set for
+     *  transformation.
+     */
+    page: null,
+
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        config = config || {};
+
+        Ext.apply(this, config);
+        this.initialConfig = config;
+
+        if(!this.printProvider) {
+            this.printProvider = this.pages[0].printProvider;
+        }
+
+        if(!this.pages) {
+            this.pages = [];
+        }
+        
+        this.addEvents(
+            /** api: event[selectpage]
+             *  Triggered when a page has been selected using the control
+             *  
+             *  Listener arguments:
+             *  * printPage - :class:`GeoExt.data.PrintPage` this printPage
+             */
+            "selectpage"
+        );
+
+        GeoExt.plugins.PrintExtent.superclass.constructor.apply(this, arguments);
+    },
+
+    /** api: method[print]
+     *  :param options: ``Object`` Options to send to the PrintProvider's
+     *      print method. See :class:`GeoExt.data.PrintProvider` :: ``print``.
+     *  
+     *  Prints all pages as shown on the map.
+     */
+    print: function(options) {
+        this.printProvider.print(this.map, this.pages, options);
+    },
+
+    /** private: method[init]
+     *  :param mapPanel: class:`GeoExt.MapPanel`
+     *  
+     *  Initializes the plugin.
+     */
+    init: function(mapPanel) {
+        this.map = mapPanel.map;
+        mapPanel.on("destroy", this.onMapPanelDestroy, this);
+
+        if (!this.layer) {
+            this.layer = new OpenLayers.Layer.Vector(null, {
+                displayInLayerSwitcher: false
+            });
+        }
+        this.createControl();
+
+        for(var i=0, len=this.pages.length; i<len; ++i) {
+            this.addPage(this.pages[i]);
+        }
+        this.show();
+    },
+
+    /** api: method[addPage]
+     *  :param page: :class:`GeoExt.data.PrintPage` The page to add
+     *       to this plugin. If not provided, a page that fits the current
+     *       extent is created.
+     *  :return: page :class:``GeoExt.data.PrintPage``
+     *  
+     *  Adds a page to the list of pages that this plugin controls.
+     */
+    addPage: function(page) {
+        page = page || new GeoExt.data.PrintPage({
+            printProvider: this.printProvider
+        });
+        if(this.pages.indexOf(page) === -1) {
+            this.pages.push(page);
+        }
+        this.layer.addFeatures([page.feature]);
+        page.on("change", this.onPageChange, this);
+
+        this.page = page;
+        var map = this.map;
+        if(map.getCenter()) {
+            this.fitPage();
+        } else {
+            map.events.register("moveend", this, function() {
+                map.events.unregister("moveend", this, arguments.callee);
+                this.fitPage();
+            });
+        }
+        return page;
+    },
+
+    /** api: method[removePage]
+     *  :param page: :class:`GeoExt.data.PrintPage` The page to remove
+     *       from this plugin.
+     *       
+     *  Removes a page from the list of pages that this plugin controls.
+     */
+    removePage: function(page) {
+        this.pages.remove(page);
+        if (page.feature.layer) {
+            this.layer.removeFeatures([page.feature]);
+        }
+        page.un("change", this.onPageChange, this);
+    },
+    
+    /** api: method[selectPage]
+     *  :param page: :class:`GeoExt.data.PrintPage` The page to select
+     *  
+     *  Selects the given page (ie. calls the setFeature on the modify feature
+     *  control)
+     */
+    selectPage: function(page) {
+        this.control.active && this.control.setFeature(page.feature);
+        // FIXME raise the feature up so that it is on top
+    },
+
+    /** api: method[show]
+     * 
+     *  Sets up the plugin, initializing the ``OpenLayers.Layer.Vector``
+     *  layer and ``OpenLayers.Control.TransformFeature``, and centering
+     *  the first page if no pages were specified in the configuration.
+     */
+    show: function() {
+        this.map.addLayer(this.layer);
+        this.map.addControl(this.control);
+        this.control.activate();
+
+        // if we have a page and if the map has a center then update the
+        // transform box for that page, in case the transform control
+        // was deactivated when fitPage (and therefore onPageChange)
+        // was called.
+        if (this.page && this.map.getCenter()) {
+            this.updateBox();
+        }
+    },
+
+    /** api: method[hide]
+     * 
+     *  Tear downs the plugin, removing the
+     *  ``OpenLayers.Control.TransformFeature`` control and
+     *  the ``OpenLayers.Layer.Vector`` layer.
+     */
+    hide: function() {
+        // note: we need to be extra cautious when destroying OpenLayers
+        // objects here (the tests will fail if we're not cautious anyway).
+        // We use obj.events to test whether an OpenLayers object is
+        // destroyed or not.
+
+        var map = this.map;
+
+        var control = this.control;
+        if(control && control.events) {
+            control.deactivate();
+            if(map && map.events && control.map) {
+                map.removeControl(control);
+            }
+        }
+
+        var layer = this.layer;
+
+        if(!this.initialConfig.layer &&
+           map && map.events &&
+           layer && layer.map) {
+            map.removeLayer(layer);
+        }
+    },
+
+    /** private: method[onMapPanelDestroy]
+     */
+    onMapPanelDestroy: function() {
+
+        var map = this.map;
+
+        for(var len = this.pages.length - 1, i = len; i>=0; i--) {
+            this.removePage(this.pages[i]);
+        }
+
+        this.hide();
+
+        var control = this.control;
+        if(map && map.events &&
+           control && control.events) {
+            control.destroy();
+        }
+
+        var layer = this.layer;
+        if(!this.initialConfig.layer &&
+           map && map.events &&
+           layer && layer.events) {
+            layer.destroy();
+        }
+
+        delete this.layer;
+        delete this.control;
+        delete this.page;
+        this.map = null;
+    },
+    
+    /** private: method[createControl]
+     */
+    createControl: function() {
+        this.control = new OpenLayers.Control.TransformFeature(this.layer, {
+            preserveAspectRatio: true,
+            eventListeners: {
+                "beforesetfeature": function(e) {
+                    for(var i=0, len=this.pages.length; i<len; ++i) {
+                        if(this.pages[i].feature === e.feature) {
+                            this.page = this.pages[i];
+                            e.object.rotation = -this.pages[i].rotation;
+                            break;
+                        }
+                    }
+                },
+                "setfeature": function(e) {
+                    for(var i=0, len=this.pages.length; i<len; ++i) {
+                        if(this.pages[i].feature === e.feature) {
+                            this.fireEvent("selectpage", this.pages[i]);
+                            break;
+                        }
+                    }
+                },
+                "beforetransform": function(e) {
+                    this._updating = true;
+                    var page = this.page;
+                    if(e.rotation) {
+                        if(this.printProvider.layout.get("rotation")) {
+                            page.setRotation(-e.object.rotation);
+                        } else {
+                            e.object.setFeature(page.feature);
+                        }
+                    } else if(e.center) {
+                        page.setCenter(OpenLayers.LonLat.fromString(
+                            e.center.toShortString()
+                        ));
+                    } else {
+                        page.fit(e.object.box, {mode: "closest"});
+                        var minScale = this.printProvider.scales.getAt(0);
+                        var maxScale = this.printProvider.scales.getAt(
+                            this.printProvider.scales.getCount() - 1);
+                        var boxBounds = e.object.box.geometry.getBounds();
+                        var pageBounds = page.feature.geometry.getBounds();
+                        var tooLarge = page.scale === minScale &&
+                            boxBounds.containsBounds(pageBounds);
+                        var tooSmall = page.scale === maxScale &&
+                            pageBounds.containsBounds(boxBounds);
+                        if(tooLarge === true || tooSmall === true) {
+                            this.updateBox();
+                        }
+                    }
+                    delete this._updating;
+                    return false;
+                },
+                "transformcomplete": this.updateBox,
+                scope: this
+            }
+        });
+    },
+
+    /** private: method[fitPage]
+     *  Fits the current print page to the map.
+     */
+    fitPage: function() {
+        if(this.page) {
+            this.page.fit(this.map, {mode: "screen"});
+        }
+    },
+
+    /** private: method[updateBox]
+     *  Updates the transformation box after setting a new scale or
+     *  layout, or to fit the box to the extent feature after a tranform.
+     */
+    updateBox: function() {
+        var page = this.page;
+        this.control.active &&
+            this.control.setFeature(page.feature, {rotation: -page.rotation});
+    },
+
+    /** private: method[onPageChange]
+     *  Handler for a page's change event.
+     */
+    onPageChange: function(page, mods) {
+        if(!this._updating) {
+            this.control.active &&
+                this.control.setFeature(page.feature, {rotation: -page.rotation});
+        }
+    }
+});
+
+/** api: ptype = gx_printextent */
+Ext.preg("gx_printextent", GeoExt.plugins.PrintExtent);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/AttributeForm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/AttributeForm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/AttributeForm.js	(revision 76)
@@ -0,0 +1,154 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/*
+ * @include GeoExt/widgets/form.js
+ */
+
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = AttributeForm
+ */
+
+/** api: example
+ *  Sample code showing how to use an Ext form panel as a feature
+ *  attribute form (for editing features for example).
+ *
+ *  .. code-block:: javascript
+ *
+ *      var formPanel = new Ext.form.FormPanel({
+ *          autoScroll: true,
+ *          height: 300,
+ *          width: 350,
+ *          defaults: {
+ *              maxLengthText: "too long",
+ *              minLengthText: "too short"
+ *          }
+ *          plugins: [
+ *              new GeoExt.plugins.AttributeForm({
+ *                  attributeStore: new GeoExt.data.AttributeStore({
+ *                      url: "http://some.wfs",
+ *                      baseParams: {
+ *                          "SERVICE": "WFS",
+ *                          "VERSION": "1.1.0",
+ *                          "REQUEST": "DescribeFeatureType",
+ *                          "TYPENAME": "the_typename"
+ *                      }
+ *                  })
+ *              })
+ *          ]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: AttributeForm
+ *
+ *  This plugin allows creating form items from attribute records
+ *  and fill a form panel with these items.
+ */
+
+GeoExt.plugins.AttributeForm = function(config) {
+    Ext.apply(this, config);
+};
+
+GeoExt.plugins.AttributeForm.prototype = {
+
+    /** api: config[attributeStore]
+     *  ``Ext.data.Store`` The attribute store to bind to this plugin.
+     *  It can be any Ext store configured with a
+     *  :class:`GeoExt.data.AttributeReader`. If set form items
+     *  will be created from the attribute records in the form. In
+     *  most cases this store will be a :class:`GeoExt.data.AttributeStore`.
+     */
+    /** private: property[attributeStore]
+     *  ``Ext.data.Store`` The attribute store.
+     */
+    attributeStore: null,
+
+    /** private: property[formPanel]
+     *  ``Ext.form.FormPanel`` This form panel.
+     */
+    formPanel: null,
+
+    /** private: method[init]
+     *  :param formPanel: class:`Ext.form.FormPanel`
+     *
+     *  Initializes the plugin.
+     */
+    init: function(formPanel) {
+        this.formPanel = formPanel;
+        if(this.attributeStore instanceof Ext.data.Store) {
+            this.fillForm();
+            this.bind(this.attributeStore);
+        }
+        formPanel.on("destroy", this.onFormDestroy, this);
+    },
+
+    /** private: method[bind]
+     *  :param store: ``Ext.data.Store`` The attribute store this form panel
+     *  is to be bound to.
+     *
+     *  Bind the panel to the attribute store passed as a parameter.
+     */
+    bind: function(store) {
+        this.unbind();
+        store.on({
+            "load": this.onLoad,
+            scope: this
+        });
+        this.attributeStore = store;
+    },
+
+    /** private: method[unbind]
+     *
+     *  Unbind the panel from the attribute store it is currently bound
+     *  to, if any.
+     */
+    unbind: function() {
+        if(this.attributeStore) {
+            this.attributeStore.un("load", this.onLoad, this);
+        }
+    },
+
+    /** private: method[onLoad]
+     *
+     *  Callback called when the store is loaded.
+     */
+    onLoad: function() {
+        if(this.formPanel.items) {
+            this.formPanel.removeAll();
+        }
+        this.fillForm();
+    },
+
+    /** private: method[fillForm]
+     *
+     *  For each attribute record in the attribute store create
+     *  a form field and add it to the form.
+     */
+    fillForm: function() {
+        this.attributeStore.each(function(record) {
+            var field = GeoExt.form.recordToField(record);
+            if(field) {
+                this.formPanel.add(field);
+            }
+        }, this);
+        this.formPanel.doLayout();
+    },
+
+    /** private: method[onFormDestroy]
+     */
+    onFormDestroy: function() {
+        this.unbind();
+    }
+};
+
+/** api: ptype = gx_attributeform */
+Ext.preg("gx_attributeform", GeoExt.plugins.AttributeForm);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeComponent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeComponent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeComponent.js	(revision 76)
@@ -0,0 +1,130 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = TreeNodeComponent
+ */
+
+/** api: constructor
+ *  A plugin to create tree node UIs that can have an Ext.Component below the
+ *  node's title. Can be plugged into any ``Ext.tree.TreePanel`` and will be
+ *  applied to nodes that are extended with the
+ *  :class:`GeoExt.Tree.TreeNodeUIEventMixin`.
+ *
+ *  If a node is configured with a ``component`` attribute, it will be rendered
+ *  with the component in addition to icon and title.
+ */
+
+/** api: example
+ *  Sample code to create a tree with a node that has a component:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var uiClass = Ext.extend(
+ *          Ext.tree.TreeNodeUI,
+ *          GeoExt.tree.TreeNodeUIEventMixin
+ *      );
+ *      var tree = new Ext.tree.TreePanel({
+ *          plugins: [
+ *              new GeoExt.plugins.TreeNodeRadioButton({
+ *                  listeners: {
+ *                      "radiochange": function(node) {
+ *                          alert(node.text + "'s radio button was clicked.");
+ *                      }
+ *                  }
+ *              })
+ *          ],
+ *          root: {
+ *              nodeType: "node",
+ *              uiProvider: uiClass,
+ *              text: "My Node",
+ *              component: {
+ *                  xtype: "box",
+ *                  autoEl: {
+ *                      tag: "img",
+ *                      src: "/images/my-image.jpg"
+ *                  }
+ *              }
+ *          }
+ *      }
+ *
+ *  Sample code to create a layer node UI with a radio button:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var uiClass = Ext.extend(
+ *          GeoExt.tree.LayerNodeUI,
+ *          new GeoExt.tree.TreeNodeUIEventMixin
+ *      );
+ */
+
+GeoExt.plugins.TreeNodeComponent = Ext.extend(Ext.util.Observable, {
+    
+    /** private: method[constructor]
+     *  :param config: ``Object``
+     */
+    constructor: function(config) {
+        Ext.apply(this.initialConfig, Ext.apply({}, config));
+        Ext.apply(this, config);
+
+        GeoExt.plugins.TreeNodeComponent.superclass.constructor.apply(this, arguments);
+    },
+
+    /** private: method[init]
+     *  :param tree: ``Ext.tree.TreePanel`` The tree.
+     */
+    init: function(tree) {
+        tree.on({
+            "rendernode": this.onRenderNode,
+            scope: this
+        });
+    },
+    
+    /** private: method[onRenderNode]
+     *  :param node: ``Ext.tree.TreeNode``
+     */
+    onRenderNode: function(node) {
+        var rendered = node.rendered;
+        var attr = node.attributes;
+        var component = attr.component || this.component;
+        if(!rendered && component) {
+            var elt = Ext.DomHelper.append(node.ui.elNode, [
+                {"tag": "div"}
+            ]);
+            if(typeof component == "function") {
+                component = component(node, elt);
+            } else if (typeof component == "object" &&
+                       typeof component.fn == "function") {
+                component = component.fn.apply(
+                    component.scope, [node, elt]
+                );
+            }
+            if(typeof component == "object" &&
+               typeof component.xtype == "string") {
+                component = Ext.ComponentMgr.create(component);
+            }
+            if(component instanceof Ext.Component) {
+                component.render(elt);
+                node.component = component;
+            }
+        }
+    },
+    
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        tree.un("rendernode", this.onRenderNode, this);
+    }
+
+});
+
+/** api: ptype = gx_TreeNodeComponent */
+Ext.preg && Ext.preg("gx_treenodecomponent", GeoExt.plugins.TreeNodeComponent);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintProviderField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintProviderField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintProviderField.js	(revision 76)
@@ -0,0 +1,187 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = PrintProviderField
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: example
+ *  A form with combo boxes for layout and resolution, and a text field for a
+ *  map title. The latter is a custom parameter to the print module, which is
+ *  a default for all print pages. For setting custom parameters on the page
+ *  level, use :class:`GeoExt.plugins.PrintPageField`):
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var printProvider = new GeoExt.data.PrintProvider({
+ *          capabilities: printCapabilities
+ *      });
+ *      new Ext.form.FormPanel({
+ *          renderTo: "form",
+ *          width: 200,
+ *          height: 300,
+ *          items: [{
+ *              xtype: "combo",
+ *              displayField: "name",
+ *              store: printProvider.layouts, // printProvider.layout
+ *              fieldLabel: "Layout",
+ *              typeAhead: true,
+ *              mode: "local",
+ *              forceSelection: true,
+ *              triggerAction: "all",
+ *              selectOnFocus: true,
+ *              plugins: new GeoExt.plugins.PrintProviderField({
+ *                  printProvider: printProvider
+ *              })
+ *          }, {
+ *              xtype: "combo",
+ *              displayField: "name",
+ *              store: printProvider.dpis, // printProvider.dpi
+ *              fieldLabel: "Resolution",
+ *              typeAhead: true,
+ *              mode: "local",
+ *              forceSelection: true,
+ *              triggerAction: "all",
+ *              selectOnFocus: true,
+ *              plugins: new GeoExt.plugins.PrintProviderField({
+ *                  printProvider: printProvider
+ *              })
+ *          }, {
+ *              xtype: "textfield",
+ *              name: "mapTitle", // printProvider.customParams.mapTitle
+ *              fieldLabel: "Map Title",
+ *              plugins: new GeoExt.plugins.PrintProviderField({
+ *                  printProvider: printProvider
+ *              })
+ *          }]
+ *      }):
+ */
+
+/** api: constructor
+ *  .. class:: PrintProviderField
+ * 
+ *  A plugin for ``Ext.form.Field`` components which provides synchronization
+ *  with a :class:`GeoExt.data.PrintProvider`.
+ */
+GeoExt.plugins.PrintProviderField = Ext.extend(Ext.util.Observable, {
+    
+    /** api: config[printProvider]
+     *  ``GeoExt.data.PrintProvider`` The print provider to use with this
+     *  plugin's field. Not required if set on the owner container of the
+     *  field.
+     */
+    
+    /** private: property[target]
+     *  ``Ext.form.Field`` This plugin's target field.
+     */
+    target: null,
+    
+    /** private: method[constructor]
+     */
+    constructor: function(config) {
+        this.initialConfig = config;
+        Ext.apply(this, config);
+        
+        GeoExt.plugins.PrintProviderField.superclass.constructor.apply(this, arguments);
+    },
+    
+    /** private: method[init]
+     *  :param target: ``Ext.form.Field`` The component that this plugin
+     *      extends.
+     */
+    init: function(target) {
+        this.target = target;
+        var onCfg = {
+            scope: this,
+            "render": this.onRender,
+            "beforedestroy": this.onBeforeDestroy
+        };
+        onCfg[target instanceof Ext.form.ComboBox ? "select" : "valid"] =
+            this.onFieldChange;
+        target.on(onCfg);
+    },
+    
+    /** private: method[onRender]
+     *  :param field: ``Ext.Form.Field``
+     *  
+     *  Handler for the target field's "render" event.
+     */
+    onRender: function(field) {
+        var printProvider = this.printProvider || field.ownerCt.printProvider;
+        if(field.store === printProvider.layouts) {
+            field.setValue(printProvider.layout.get(field.displayField));
+            printProvider.on({
+                "layoutchange": this.onProviderChange,
+                scope: this
+            });
+        } else if(field.store === printProvider.dpis) {
+            field.setValue(printProvider.dpi.get(field.displayField));
+            printProvider.on({
+                "dpichange": this.onProviderChange,
+                scope: this
+            });
+        } else if(field.initialConfig.value === undefined) {
+            field.setValue(printProvider.customParams[field.name]);
+        }
+    },
+    
+    /** private: method[onFieldChange]
+     *  :param field: ``Ext.form.Field``
+     *  :param record: ``Ext.data.Record`` Optional.
+     *  
+     *  Handler for the target field's "valid" or "select" event.
+     */
+    onFieldChange: function(field, record) {
+        var printProvider = this.printProvider || field.ownerCt.printProvider;
+        var value = field.getValue();
+        this._updating = true;
+        if(record) {
+            switch(field.store) {
+                case printProvider.layouts:
+                    printProvider.setLayout(record);
+                    break;
+                case printProvider.dpis:
+                    printProvider.setDpi(record);
+            }
+        } else {
+            printProvider.customParams[field.name] = value;
+        }
+        delete this._updating;
+    },
+    
+    /** private: method[onProviderChange]
+     *  :param printProvider: :class:`GeoExt.data.PrintProvider`
+     *  :param rec: ``Ext.data.Record``
+     *  
+     *  Handler for the printProvider's dpichange and layoutchange event
+     */
+    onProviderChange: function(printProvider, rec) {
+        if(!this._updating) {
+            this.target.setValue(rec.get(this.target.displayField));
+        }
+    },
+    
+    /** private: method[onBeforeDestroy]
+     */
+    onBeforeDestroy: function() {
+        this.target.un("beforedestroy", this.onBeforeDestroy, this);
+        this.target.un("render", this.onRender, this);
+        this.target.un("select", this.onFieldChange, this);
+        this.target.un("valid", this.onFieldChange, this);
+        this.printProvider.un("layoutchange", this.onProviderChange, this);
+        this.printProvider.un("dpichange", this.onProviderChange,
+            this);
+    }
+
+});
+
+/** api: ptype = gx_printproviderfield */
+Ext.preg("gx_printproviderfield", GeoExt.plugins.PrintProviderField);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintPageField.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintPageField.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/PrintPageField.js	(revision 76)
@@ -0,0 +1,199 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = PrintPageField
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: example
+ *  A form with a combo box for the scale and text fields for rotation and a
+ *  page title. The page title is a custom parameter of the print module's
+ *  page configuration:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var printPage = new GeoExt.data.PrintPage({
+ *          printProvider: new GeoExt.data.PrintProvider({
+ *              capabilities: printCapabilities
+ *          })
+ *      });
+ *      new Ext.form.FormPanel({
+ *          renderTo: "form",
+ *          width: 200,
+ *          height: 300,
+ *          items: [{
+ *              xtype: "combo",
+ *              displayField: "name",
+ *              store: printPage.scales, // printPage.scale
+ *              name: "scale",
+ *              fieldLabel: "Scale",
+ *              typeAhead: true,
+ *              mode: "local",
+ *              forceSelection: true,
+ *              triggerAction: "all",
+ *              selectOnFocus: true,
+ *              plugins: new GeoExt.plugins.PrintPageField({
+ *                  printPage: printPage
+ *              })
+ *          }, {
+ *              xtype: "textfield",
+ *              name: "rotation", // printPage.rotation
+ *              fieldLabel: "Rotation",
+ *              plugins: new GeoExt.plugins.PrintPageField({
+ *                  printPage: printPage
+ *              })
+ *          }, {
+ *              xtype: "textfield",
+ *              name: "mapTitle", // printPage.customParams["mapTitle"]
+ *              fieldLabel: "Map Title",
+ *              plugins: new GeoExt.plugins.PrintPageField({
+ *                  printPage: printPage
+ *              })
+ *          }]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: PrintPageField
+ * 
+ *  A plugin for ``Ext.form.Field`` components which provides synchronization
+ *  with a :class:`GeoExt.data.PrintPage`. The field name has to match the
+ *  respective property of the printPage (e.g. ``scale``, ``rotation``).
+ */
+GeoExt.plugins.PrintPageField = Ext.extend(Ext.util.Observable, {
+    
+    /** api: config[printPage]
+     *  ``GeoExt.data.PrintPage`` The print page to synchronize with.
+     */
+
+    /** private: property[printPage]
+     *  ``GeoExt.data.PrintPage`` The print page to synchronize with.
+     *  Read-only.
+     */
+    printPage: null,
+    
+    /** private: property[target]
+     *  ``Ext.form.Field`` This plugin's target field.
+     */
+    target: null,
+    
+    /** private: method[constructor]
+     */
+    constructor: function(config) {
+        this.initialConfig = config;
+        Ext.apply(this, config);
+        
+        GeoExt.plugins.PrintPageField.superclass.constructor.apply(this, arguments);
+    },
+    
+    /** private: method[init]
+     *  :param target: ``Ext.form.Field`` The component that this plugin
+     *      extends.
+     * @param {Object} target
+     */
+    init: function(target) {
+        this.target = target;
+        var onCfg = {
+            "beforedestroy": this.onBeforeDestroy,
+            scope: this
+        };
+        var eventName = target instanceof Ext.form.ComboBox ?
+                            "select" : target instanceof Ext.form.Checkbox ?
+                                "check" : "valid";
+        onCfg[eventName] = this.onFieldChange;
+        target.on(onCfg);
+        this.printPage.on({
+            "change": this.onPageChange,
+            scope: this
+        });
+        this.printPage.printProvider.on({
+            "layoutchange": this.onLayoutChange,
+            scope: this
+        });
+        this.setValue(this.printPage);
+    },
+
+    /** private: method[onFieldChange]
+     *  :param field: ``Ext.form.Field``
+     *  :param record: ``Ext.data.Record`` Optional.
+     *  
+     *  Handler for the target field's "valid" or "select" event.
+     */
+    onFieldChange: function(field, record) {
+        var printProvider = this.printPage.printProvider;
+        var value = field.getValue();
+        this._updating = true;
+        if(field.store === printProvider.scales || field.name === "scale") {
+            this.printPage.setScale(record);
+        } else if(field.name == "rotation") {
+            !isNaN(value) && this.printPage.setRotation(value);
+        } else {
+            this.printPage.customParams[field.name] = value;
+        }
+        delete this._updating;
+    },
+
+    /** private: method[onPageChange]
+     *  :param printPage: :class:`GeoExt.data.PrintPage`
+     *  
+     *  Handler for the "change" event for the page this plugin is configured
+     *  with.
+     */
+    onPageChange: function(printPage) {
+        if(!this._updating) {
+            this.setValue(printPage);
+        }
+    },
+    
+    /** private: method[onPageChange]
+     *  :param printProvider: :class:`GeoExt.data.PrintProvider`
+     *  :param layout: ``Ext.Record``
+     *  
+     *  Handler for the "layoutchange" event of the printProvider.
+     */
+    onLayoutChange: function(printProvider, layout) {
+        var t = this.target;
+        t.name == "rotation" && t.setDisabled(!layout.get("rotation"));
+    },
+
+    /** private: method[setValue]
+     *  :param printPage: :class:`GeoExt.data.PrintPage`
+     *
+     *  Sets the value in the target field.
+     */
+    setValue: function(printPage) {
+        var t = this.target;
+        t.suspendEvents();
+        if(t.store === printPage.printProvider.scales || t.name === "scale") {
+            if(printPage.scale) {
+                t.setValue(printPage.scale.get(t.displayField));
+            }
+        } else if(t.name == "rotation") {
+            t.setValue(printPage.rotation);
+        }
+        t.resumeEvents();
+    },
+
+    /** private: method[onBeforeDestroy]
+     */
+    onBeforeDestroy: function() {
+        this.target.un("beforedestroy", this.onBeforeDestroy, this);
+        this.target.un("select", this.onFieldChange, this);
+        this.target.un("valid", this.onFieldChange, this);
+        this.printPage.un("change", this.onPageChange, this);
+        this.printPage.printProvider.un("layoutchange", this.onLayoutChange,
+            this);
+    }
+
+});
+
+/** api: ptype = gx_printpagefield */
+Ext.preg("gx_printpagefield", GeoExt.plugins.PrintPageField);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeRadioButton.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeRadioButton.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/plugins/TreeNodeRadioButton.js	(revision 76)
@@ -0,0 +1,135 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+ /**
+  * @include GeoExt/widgets/tree/TreeNodeUIEventMixin.js
+  */
+Ext.namespace("GeoExt.plugins");
+
+/** api: (define)
+ *  module = GeoExt.plugins
+ *  class = TreeNodeRadioButton
+ */
+
+/** api: constructor
+ *  A plugin to create tree node UIs with radio buttons. Can be plugged into
+ *  any ``Ext.tree.TreePanel`` and will be applied to nodes that are extended
+ *  with the :class:`GeoExt.Tree.TreeNodeUIEventMixin`, in particular
+ *  :class:`GeoExt.tree.LayerNodeUI` nodes.
+ *
+ *  A tree with a ``GeoExt.plugins.TreeNodeRadioButton`` fires the additional
+ *  ``radiochange`` event when a node's radio button is clicked.
+ *
+ *  Only if a node is configured ``radioGroup`` attribute, it will be rendered
+ *  with a radio button next to its icon. The ``radioGroup`` works like a
+ *  HTML checkbox with its ``name`` attribute, and ``radioGroup`` is a string
+ *  that identifies the options group.
+ * 
+ */
+
+/** api: example
+ *  Sample code to create a tree with a node that has a radio button:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var UIClass = Ext.extend(
+ *          Ext.tree.TreeNodeUI,
+ *          GeoExt.tree.TreeNodeUIEventMixin
+ *      );
+ *      var tree = new Ext.tree.TreePanel({
+ *          plugins: [
+ *              new GeoExt.plugins.TreeNodeRadioButton({
+ *                  listeners: {
+ *                      "radiochange": function(node) {
+ *                          alert(node.text + "'s radio button was clicked.");
+ *                      }
+ *                  }
+ *              })
+ *          ],
+ *          root: {
+ *              nodeType: "node",
+ *              uiProvider: UIClass,
+ *              text: "My Node",
+ *              radioGroup: "myGroupId"
+ *          }
+ *      }
+ */
+
+GeoExt.plugins.TreeNodeRadioButton = Ext.extend(Ext.util.Observable, {
+    
+    /** private: method[constructor]
+     *  :param config: ``Object``
+     */
+    constructor: function(config) {
+        Ext.apply(this.initialConfig, Ext.apply({}, config));
+        Ext.apply(this, config);
+
+        this.addEvents(
+
+            /** api: event[radiochange]
+             *  Fires when a radio button is clicked.
+             *
+             *  Listener arguments:
+             *  
+             *  * node - ``Ext.TreeNode`` The node of the clicked radio button.
+             */
+            "radiochange"
+        );
+
+        GeoExt.plugins.TreeNodeRadioButton.superclass.constructor.apply(this, arguments);
+    },
+
+    /** private: method[init]
+     *  :param tree: ``Ext.tree.TreePanel`` The tree.
+     */
+    init: function(tree) {
+        tree.on({
+            "rendernode": this.onRenderNode,
+            "rawclicknode": this.onRawClickNode,
+            "beforedestroy": this.onBeforeDestroy,
+            scope: this
+        });
+    },
+    
+    /** private: method[onRenderNode]
+     *  :param node: ``Ext.tree.TreeNode``
+     */
+    onRenderNode: function(node) {
+        var a = node.attributes;
+        if(a.radioGroup && !a.radio) {
+            a.radio = Ext.DomHelper.insertBefore(node.ui.anchor,
+                ['<input type="radio" class="gx-tree-radio" name="',
+                a.radioGroup, '_radio"></input>'].join(""));
+        }
+    },
+    
+    /** private: method[onRawClickNode]
+     *  :param node: ``Ext.tree.TreeNode``
+     *  :param e: ``Ext.EventObject``
+     */
+    onRawClickNode: function(node, e) {
+        var el = e.getTarget('.gx-tree-radio', 1); 
+        if(el) {
+            el.defaultChecked = el.checked;
+            this.fireEvent("radiochange", node);
+            return false;
+        }
+    },
+    
+    /** private: method[onBeforeDestroy]
+     */
+    onBeforeDestroy: function(tree) {
+        tree.un("rendernode", this.onRenderNode, this);
+        tree.un("rawclicknode", this.onRenderNode, this);
+        tree.un("beforedestroy", this.onBeforeDestroy, this);
+    }
+
+});
+
+/** api: ptype = gx_treenoderadiobutton */
+Ext.preg("gx_treenoderadiobutton", GeoExt.plugins.TreeNodeRadioButton);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/ZoomSliderTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/ZoomSliderTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/ZoomSliderTip.js	(revision 76)
@@ -0,0 +1,84 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @requires GeoExt/widgets/tips/SliderTip.js
+ */
+
+/** api: (extends)
+ *  GeoExt/widgets/tips/SliderTip.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = ZoomSliderTip
+ *  base_link = `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a slider tip to display scale and resolution:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var slider = new GeoExt.ZoomSlider({
+ *          renderTo: document.body,
+ *          width: 200,
+ *          map: map,
+ *          plugins: new GeoExt.ZoomSliderTip({
+ *              template: "Scale: 1 : {scale}<br>Resolution: {resolution}"
+ *          })
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: ZoomSliderTip(config)
+ *   
+ *      Create a slider tip displaying :class:`GeoExt.ZoomSlider` values.
+ */
+GeoExt.ZoomSliderTip = Ext.extend(GeoExt.SliderTip, {
+    
+    /** api: config[template]
+     *  ``String``
+     *  Template for the tip. Can be customized using the following keywords in
+     *  curly braces:
+     *  
+     *  * ``zoom`` - the zoom level
+     *  * ``resolution`` - the resolution
+     *  * ``scale`` - the scale denominator
+     */
+    template: '<div>Zoom Level: {zoom}</div>' +
+        '<div>Resolution: {resolution}</div>' +
+        '<div>Scale: 1 : {scale}</div>',
+    
+    /** private: property[compiledTemplate]
+     *  ``Ext.Template``
+     *  The template compiled from the ``template`` string on init.
+     */
+    compiledTemplate: null,
+    
+    /** private: method[init]
+     *  Called to initialize the plugin.
+     */
+    init: function(slider) {
+        this.compiledTemplate = new Ext.Template(this.template);
+        GeoExt.ZoomSliderTip.superclass.init.call(this, slider);
+    },
+    
+    /** private: method[getText]
+     *  :param slider: ``Ext.Slider`` The slider this tip is attached to.
+     */
+    getText: function(thumb) {
+        var data = {
+            zoom: thumb.value,
+            resolution: this.slider.getResolution(),
+            scale: Math.round(this.slider.getScale()) 
+        };
+        return this.compiledTemplate.apply(data);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.js	(revision 76)
@@ -0,0 +1,78 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @requires GeoExt/widgets/tips/SliderTip.js
+ */
+
+/** api: (extends)
+ *  GeoExt/widgets/tips/SliderTip.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = LayerOpacitySliderTip
+ *  base_link = `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a slider tip to display scale and resolution:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var slider = new GeoExt.LayerOpacitySlider({
+ *          renderTo: document.body,
+ *          width: 200,
+ *          layer: layer,
+ *          plugins: new GeoExt.LayerOpacitySliderTip({
+ *              template: "Opacity: {opacity}%"
+ *          })
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: LayerOpacitySliderTip(config)
+ *
+ *      Create a slider tip displaying :class:`GeoExt.LayerOpacitySlider` values.
+ */
+GeoExt.LayerOpacitySliderTip = Ext.extend(GeoExt.SliderTip, {
+
+    /** api: config[template]
+     *  ``String``
+     *  Template for the tip. Can be customized using the following keywords in
+     *  curly braces:
+     *
+     *  * ``opacity`` - the opacity value in percent.
+     */
+    template: '<div>{opacity}%</div>',
+
+    /** private: property[compiledTemplate]
+     *  ``Ext.Template``
+     *  The template compiled from the ``template`` string on init.
+     */
+    compiledTemplate: null,
+
+    /** private: method[init]
+     *  Called to initialize the plugin.
+     */
+    init: function(slider) {
+        this.compiledTemplate = new Ext.Template(this.template);
+        GeoExt.LayerOpacitySliderTip.superclass.init.call(this, slider);
+    },
+
+    /** private: method[getText]
+     *  :param slider: ``Ext.Slider`` The slider this tip is attached to.
+     */
+    getText: function(thumb) {
+        var data = {
+            opacity: thumb.value
+        };
+        return this.compiledTemplate.apply(data);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/SliderTip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/SliderTip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tips/SliderTip.js	(revision 76)
@@ -0,0 +1,109 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = SliderTip
+ *  base_link = `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.slider.Tip>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a slider tip to display slider value on hover:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var slider = new Ext.Slider({
+ *          renderTo: document.body,
+ *          width: 200,
+ *          plugins: new GeoExt.SliderTip()
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: SliderTip(config)
+ *   
+ *      Create a slider tip displaying ``Ext.Slider`` values over slider thumbs.
+ */
+GeoExt.SliderTip = Ext.extend(Ext.slider.Tip, {
+
+    /** api: config[hover]
+     *  ``Boolean``
+     *  Display the tip when hovering over the thumb.  If ``false``, tip will
+     *  only be displayed while dragging.  Default is ``true``.
+     */
+    hover: true,
+    
+    /** api: config[minWidth]
+     *  ``Number``
+     *  Minimum width of the tip.  Default is 10.
+     */
+    minWidth: 10,
+
+    /** api: config[offsets]
+     *  ``Array(Number)``
+     *  A two item list that provides x, y offsets for the tip.  Default is
+     *  [0, -10].
+     */
+    offsets : [0, -10],
+    
+    /** private: property[dragging]
+     *  ``Boolean``
+     *  The thumb is currently being dragged.
+     */
+    dragging: false,
+
+    /** private: method[init]
+     *  :param slider: ``Ext.Slider``
+     *  
+     *  Called when the plugin is initialized.
+     */
+    init: function(slider) {
+        GeoExt.SliderTip.superclass.init.apply(this, arguments);
+        if (this.hover) {
+            slider.on("render", this.registerThumbListeners, this);
+        }
+        this.slider = slider;
+    },
+
+    /** private: method[registerThumbListeners]
+     *  Set as a listener for 'render' if hover is true.
+     */
+    registerThumbListeners: function() {
+        var thumb, el;
+        for (var i=0, ii=this.slider.thumbs.length; i<ii; ++i) {
+            thumb = this.slider.thumbs[i];
+            el = thumb.tracker.el;
+            (function(thumb, el) {
+                el.on({
+                    mouseover: function(e) {
+                        this.onSlide(this.slider, e, thumb);
+                        this.dragging = false;
+                    },
+                    mouseout: function() {
+                        if (!this.dragging) {
+                            this.hide.apply(this, arguments);
+                        }
+                    },
+                    scope: this
+                })
+            }).apply(this, [thumb, el]);
+        }
+    },
+
+    /** private: method[onSlide]
+     *  :param slider: ``Ext.Slider``
+     *
+     *  Listener for dragstart and drag.
+     */
+    onSlide: function(slider, e, thumb) {
+        this.dragging = true;
+        return GeoExt.SliderTip.superclass.onSlide.apply(this, arguments);
+    }
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerOpacitySlider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerOpacitySlider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerOpacitySlider.js	(revision 76)
@@ -0,0 +1,381 @@
+/* Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * Published under the BSD license.
+ * See http://geoext.org/svn/geoext/core/trunk/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/tips/LayerOpacitySliderTip.js
+ * @include GeoExt/data/LayerRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = LayerOpacitySlider
+ *  base_link = `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to render a slider outside the map viewport:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var slider = new GeoExt.LayerOpacitySlider({
+ *          renderTo: document.body,
+ *          width: 200,
+ *          layer: layer
+ *      });
+ *
+ *  Sample code to add a slider to a map panel:
+ *
+ *  .. code-block:: javascript
+ *
+ *      var layer = new OpenLayers.Layer.WMS(
+ *          "Global Imagery",
+ *          "http://maps.opengeo.org/geowebcache/service/wms",
+ *          {layers: "bluemarble"}
+ *      );
+ *      var panel = new GeoExt.MapPanel({
+ *          renderTo: document.body,
+ *          height: 300,
+ *          width: 400,
+ *          map: {
+ *              controls: [new OpenLayers.Control.Navigation()]
+ *          },
+ *          layers: [layer],
+ *          extent: [-5, 35, 15, 55],
+ *          items: [{
+ *              xtype: "gx_opacityslider",
+ *              layer: layer,
+ *              aggressive: true,
+ *              vertical: true,
+ *              height: 100,
+ *              x: 10,
+ *              y: 20
+ *          }]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: LayerOpacitySlider(config)
+ *
+ *      Create a slider for controlling a layer's opacity.
+ */
+GeoExt.LayerOpacitySlider = Ext.extend(Ext.Slider, {
+
+    /** api: config[layer]
+     *  ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+     *  The layer this slider changes the opacity of. (required)
+     */
+    /** private: property[layer]
+     *  ``OpenLayers.Layer``
+     */
+    layer: null,
+
+    /** api: config[complementaryLayer]
+     *  ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord` 
+     *  If provided, a layer that will be made invisible (its visibility is
+     *  set to false) when the slider value is set to its max value. If this
+     *  slider is used to fade visibility between to layers, setting
+     *  ``complementaryLayer`` and ``changeVisibility`` will make sure that
+     *  only visible tiles are loaded when the slider is set to its min or max
+     *  value. (optional)
+     */
+    complementaryLayer: null,
+
+    /** api: config[delay]
+     *  ``Number`` Time in milliseconds before setting the opacity value to the
+     *  layer. If the value change again within that time, the original value
+     *  is not set. Only applicable if aggressive is true.
+     */
+    delay: 5,
+
+    /** api: config[changeVisibilityDelay]
+     *  ``Number`` Time in milliseconds before changing the layer's visibility.
+     *  If the value changes again within that time, the layer's visibility
+     *  change does not occur. Only applicable if changeVisibility is true.
+     *  Defaults to 5.
+     */
+    changeVisibilityDelay: 5,
+
+    /** api: config[aggressive]
+     *  ``Boolean``
+     *  If set to true, the opacity is changed as soon as the thumb is moved.
+     *  Otherwise when the thumb is released (default).
+     */
+    aggressive: false,
+
+    /** api: config[changeVisibility]
+     *  ``Boolean``
+     *  If set to true, the layer's visibility is handled by the
+     *  slider, the slider makes the layer invisible when its
+     *  value is changed to the min value, and makes the layer
+     *  visible again when its value goes from the min value
+     *  to some other value. The layer passed to the constructor
+     *  must be visible, as its visibility is fully handled by
+     *  the slider. Defaults to false.
+     */
+    changeVisibility: false,
+
+    /** api: config[value]
+     *  ``Number``
+     *  The value to initialize the slider with. This value is
+     *  taken into account only if the layer's opacity is null.
+     *  If the layer's opacity is null and this value is not
+     *  defined in the config object then the slider initializes
+     *  it to the max value.
+     */
+    value: null,
+
+    /** api: config[inverse]
+     *  ``Boolean``
+     *  If true, we will work with transparency instead of with opacity.
+     *  Defaults to false.
+     */
+    /** private: property[inverse]
+     *  ``Boolean``
+     */
+    inverse: false,
+
+    /** private: method[constructor]
+     *  Construct the component.
+     */
+    constructor: function(config) {
+        if (config.layer) {
+            this.layer = this.getLayer(config.layer);
+            this.bind();
+            this.complementaryLayer = this.getLayer(config.complementaryLayer);
+            // before we call getOpacityValue inverse should be set
+            if (config.inverse !== undefined) {
+                this.inverse = config.inverse;
+            }
+            config.value = (config.value !== undefined) ? 
+                config.value : this.getOpacityValue(this.layer);
+            delete config.layer;
+            delete config.complementaryLayer;
+        }
+        GeoExt.LayerOpacitySlider.superclass.constructor.call(this, config);
+    },
+
+    /** private: method[bind]
+     */
+    bind: function() {
+        if (this.layer && this.layer.map) {
+            this.layer.map.events.on({
+                changelayer: this.update,
+                scope: this
+            });
+        }
+    },
+
+    /** private: method[unbind]
+     */
+    unbind: function() {
+        if (this.layer && this.layer.map) {
+            this.layer.map.events.un({
+                changelayer: this.update,
+                scope: this
+            });
+        }
+    },
+
+    /** private: method[update]
+     *  Registered as a listener for opacity change.  Updates the value of the slider.
+     */
+    update: function(evt) {
+        if (evt.property === "opacity" && evt.layer == this.layer) {
+            this.setValue(this.getOpacityValue(this.layer));
+        }
+    },
+
+    /** api: method[setLayer]
+     *  :param layer: ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+     *
+     *  Bind a new layer to the opacity slider.
+     */
+    setLayer: function(layer) {
+        this.unbind();
+        this.layer = this.getLayer(layer);
+        this.setValue(this.getOpacityValue(layer));
+        this.bind();
+    },
+
+    /** private: method[getOpacityValue]
+     *  :param layer: ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+     *  :return:  ``Integer`` The opacity for the layer.
+     *
+     *  Returns the opacity value for the layer.
+     */
+    getOpacityValue: function(layer) {
+        var value;
+        if (layer && layer.opacity !== null) {
+            value = parseInt(layer.opacity * (this.maxValue - this.minValue));
+        } else {
+            value = this.maxValue;
+        }
+        if (this.inverse === true) {
+            value = (this.maxValue - this.minValue) - value;
+        }
+        return value;
+    },
+
+    /** private: method[getLayer]
+     *  :param layer: ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+     *  :return:  ``OpenLayers.Layer`` The OpenLayers layer object
+     *
+     *  Returns the OpenLayers layer object for a layer record or a plain layer 
+     *  object.
+     */
+    getLayer: function(layer) {
+        if (layer instanceof OpenLayers.Layer) {
+            return layer;
+        } else if (layer instanceof GeoExt.data.LayerRecord) {
+            return layer.getLayer();
+        }
+    },
+
+    /** private: method[initComponent]
+     *  Initialize the component.
+     */
+    initComponent: function() {
+
+        GeoExt.LayerOpacitySlider.superclass.initComponent.call(this);
+
+        if (this.changeVisibility && this.layer &&
+            (this.layer.opacity == 0 || 
+            (this.inverse === false && this.value == this.minValue) || 
+            (this.inverse === true && this.value == this.maxValue))) {
+            this.layer.setVisibility(false);
+        }
+
+        if (this.complementaryLayer &&
+            ((this.layer && this.layer.opacity == 1) ||
+             (this.inverse === false && this.value == this.maxValue) ||
+             (this.inverse === true && this.value == this.minValue))) {
+            this.complementaryLayer.setVisibility(false);
+        }
+
+        if (this.aggressive === true) {
+            this.on('change', this.changeLayerOpacity, this, {
+                buffer: this.delay
+            });
+        } else {
+            this.on('changecomplete', this.changeLayerOpacity, this);
+        }
+
+        if (this.changeVisibility === true) {
+            this.on('change', this.changeLayerVisibility, this, {
+                buffer: this.changeVisibilityDelay
+            });
+        }
+
+        if (this.complementaryLayer) {
+            this.on('change', this.changeComplementaryLayerVisibility, this, {
+                buffer: this.changeVisibilityDelay
+            });
+        }
+        this.on("beforedestroy", this.unbind, this);
+    },
+
+    /** private: method[changeLayerOpacity]
+     *  :param slider: :class:`GeoExt.LayerOpacitySlider`
+     *  :param value: ``Number`` The slider value
+     *
+     *  Updates the ``OpenLayers.Layer`` opacity value.
+     */
+    changeLayerOpacity: function(slider, value) {
+        if (this.layer) {
+            value = value / (this.maxValue - this.minValue);
+            if (this.inverse === true) {
+                value = 1 - value;
+            }
+            this.layer.setOpacity(value);
+        }
+    },
+
+    /** private: method[changeLayerVisibility]
+     *  :param slider: :class:`GeoExt.LayerOpacitySlider`
+     *  :param value: ``Number`` The slider value
+     *
+     *  Updates the ``OpenLayers.Layer`` visibility.
+     */
+    changeLayerVisibility: function(slider, value) {
+        var currentVisibility = this.layer.getVisibility();
+        if ((this.inverse === false && value == this.minValue) ||
+            (this.inverse === true && value == this.maxValue) &&
+            currentVisibility === true) {
+            this.layer.setVisibility(false);
+        } else if ((this.inverse === false && value > this.minValue) ||
+            (this.inverse === true && value < this.maxValue) &&
+                   currentVisibility == false) {
+            this.layer.setVisibility(true);
+        }
+    },
+
+    /** private: method[changeComplementaryLayerVisibility]
+     *  :param slider: :class:`GeoExt.LayerOpacitySlider`
+     *  :param value: ``Number`` The slider value
+     *
+     *  Updates the complementary ``OpenLayers.Layer`` visibility.
+     */
+    changeComplementaryLayerVisibility: function(slider, value) {
+        var currentVisibility = this.complementaryLayer.getVisibility();
+        if ((this.inverse === false && value == this.maxValue) ||
+            (this.inverse === true && value == this.minValue) &&
+            currentVisibility === true) {
+            this.complementaryLayer.setVisibility(false);
+        } else if ((this.inverse === false && value < this.maxValue) ||
+            (this.inverse === true && value > this.minValue) &&
+                   currentVisibility == false) {
+            this.complementaryLayer.setVisibility(true);
+        }
+    },
+
+    /** private: method[addToMapPanel]
+     *  :param panel: :class:`GeoExt.MapPanel`
+     *
+     *  Called by a MapPanel if this component is one of the items in the panel.
+     */
+    addToMapPanel: function(panel) {
+        this.on({
+            render: function() {
+                var el = this.getEl();
+                el.setStyle({
+                    position: "absolute",
+                    zIndex: panel.map.Z_INDEX_BASE.Control
+                });
+                el.on({
+                    mousedown: this.stopMouseEvents,
+                    click: this.stopMouseEvents
+                });
+            },
+            scope: this
+        });
+    },
+
+    /** private: method[removeFromMapPanel]
+     *  :param panel: :class:`GeoExt.MapPanel`
+     *
+     *  Called by a MapPanel if this component is one of the items in the panel.
+     */
+    removeFromMapPanel: function(panel) {
+        var el = this.getEl();
+        el.un({
+            mousedown: this.stopMouseEvents,
+            click: this.stopMouseEvents,
+            scope: this
+        });
+        this.unbind();
+    },
+
+    /** private: method[stopMouseEvents]
+     *  :param e: ``Object``
+     */
+    stopMouseEvents: function(e) {
+        e.stopEvent();
+    }
+});
+
+/** api: xtype = gx_opacityslider */
+Ext.reg('gx_opacityslider', GeoExt.LayerOpacitySlider);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/PrintMapPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/PrintMapPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/PrintMapPanel.js	(revision 76)
@@ -0,0 +1,373 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @requires GeoExt/widgets/MapPanel.js
+ * @include GeoExt/data/PrintProvider.js
+ * @include GeoExt/data/PrintPage.js
+ */
+Ext.namespace("GeoExt");
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = PrintMapPanel
+ */
+
+/** api: (extends)
+ * GeoExt/widgets/MapPanel.js
+ */
+
+/** api: example
+ *  A map with a "Print..." button. If clicked, a dialog containing a
+ *  PrintMapPanel will open, with a "Create PDF" button.
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var mapPanel = new GeoExt.MapPanel({
+ *          renderTo: "map",
+ *          layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+ *              "http://demo.opengeo.org/geoserver/wms",
+ *              {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+ *          center: [146.56, -41.56],
+ *          zoom: 6,
+ *          bbar: [{
+ *              text: "Print...",
+ *              handler: function() {
+ *                  var printDialog = new Ext.Window({
+ *                      autoHeight: true,
+ *                      width: 350,
+ *                      items: [new GeoExt.PrintMapPanel({
+ *                          sourceMap: mapPanel,
+ *                          printProvider: {
+ *                              capabilities: printCapabilities
+ *                          }
+ *                      })],
+ *                      bbar: [{
+ *                          text: "Create PDF",
+ *                          handler: function() {
+ *                              printDialog.items.get(0).print();
+ *                          }
+ *                      }]
+ *                  });
+ *                  printDialog.show();
+ *              }
+ *          }]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: PrintMapPanel
+ * 
+ *  A map panel that controls scale and center of a print page. Based on the
+ *  current view (i.e. layers and extent) of a source map, this panel will be
+ *  sized according to the aspect ratio of the print page. As the user zooms
+ *  and pans in the :class:`GeoExt.PrintMapPanel`, the print page will update
+ *  its scale and center accordingly. If the scale on the print page changes
+ *  (e.g. by setting it using a combo box with a
+ *  :class:`GeoExt.plugins.PrintPageField`), the extent of the
+ *  :class:`GeoExt.PrintMapPanel` will be updated to match the page bounds.
+ *  
+ *  .. note:: The ``zoom``, ``center`` and ``extent`` config options will have
+ *      no affect, as they will be determined by the ``sourceMap``.
+ */
+GeoExt.PrintMapPanel = Ext.extend(GeoExt.MapPanel, {
+    
+    /** api: config[map]
+     *  ``Object`` Optional configuration for the ``OpenLayers.Map`` object
+     *  that this PrintMapPanel creates. Useful e.g. to configure a map with a
+     *  custom set of controls, or to add a ``preaddlayer`` listener for
+     *  filtering out layer types that cannot be printed.
+     */
+    
+    /** api: config[sourceMap]
+     *  :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` The map that is to be
+     *  printed.
+     */
+    
+    /** private: property[sourceMap]
+     *  ``OpenLayers.Map``
+     */
+    sourceMap: null,
+    
+    /** api: config[printProvider]
+     *  :class:`GeoExt.data.PrintProvider` or ``Object`` PrintProvider to use
+     *  for printing. If an ``Object`` is provided, a new PrintProvider will
+     *  be created and configured with the object.
+     *  
+     *  .. note:: The PrintMapPanel requires the printProvider's capabilities
+     *    to be available upon initialization. This means that a PrintMapPanel
+     *    configured with an ``Object`` as ``printProvider`` will only work
+     *    when ``capabilities`` is provided in the printProvider's
+     *    configuration object. If ``printProvider`` is provided as an instance
+     *    of :class:`GeoExt.data.PrintProvider`, the capabilities must be
+     *    loaded before PrintMapPanel initialization.
+     */
+    
+    /** api: property[printProvider]
+     *  :class:`GeoExt.data.PrintProvider` PrintProvider for this
+     *  PrintMapPanel.
+     */
+    printProvider: null,
+    
+    /** api: property[printPage]
+     *  :class:`GeoExt.data.PrintPage` PrintPage for this PrintMapPanel.
+     *  Read-only.
+     */
+    printPage: null,
+    
+    /** api: config[limitScales]
+     *  ``Boolean`` If set to true, the printPage cannot be set to scales that
+     *  would generate a preview in this :class:`GeoExt.PrintMapPanel` with a
+     *  completely different extent than the one that would appear on the
+     *  printed map. Default is false.
+     */
+     
+    /** api: property[previewScales]
+     *  ``Ext.data.Store`` A data store with a subset of the printProvider's
+     *  scales. By default, this contains all the scales of the printProvider.
+     *  If ``limitScales`` is set to true, it will only contain print scales
+     *  that can properly be previewed with this :class:`GeoExt.PrintMapPanel`.
+     */
+    previewScales: null,
+    
+    /** api: config[center]
+     *  ``OpenLayers.LonLat`` or ``Array(Number)``  A location for the map
+     *  center. Do not set, as this will be overridden with the ``sourceMap``
+     *  center.
+     */
+    center: null,
+
+    /** api: config[zoom]
+     *  ``Number``  An initial zoom level for the map. Do not set, because the
+     *  initial extent will be determined by the ``sourceMap``.
+     */
+    zoom: null,
+
+    /** api: config[extent]
+     *  ``OpenLayers.Bounds or Array(Number)``  An initial extent for the map.
+     *  Do not set, because the initial extent will be determined by the
+     *  ``sourceMap``.
+     */
+    extent: null,
+    
+    /** private: property[currentZoom]
+     *  ``Number``
+     */
+    currentZoom: null,
+    
+    /**
+     * private: method[initComponent]
+     * private override
+     */
+    initComponent: function() {
+        if(this.sourceMap instanceof GeoExt.MapPanel) {
+            this.sourceMap = this.sourceMap.map;
+        }
+
+        if (!this.map) {
+            this.map = {};
+        }
+        Ext.applyIf(this.map, {
+            projection: this.sourceMap.getProjection(),
+            maxExtent: this.sourceMap.getMaxExtent(),
+            maxResolution: this.sourceMap.getMaxResolution(),
+            units: this.sourceMap.getUnits()
+        });
+        
+        if(!(this.printProvider instanceof GeoExt.data.PrintProvider)) {
+            this.printProvider = new GeoExt.data.PrintProvider(
+                this.printProvider);
+        }
+        this.printPage = new GeoExt.data.PrintPage({
+            printProvider: this.printProvider
+        });
+        
+        this.previewScales = new Ext.data.Store();
+        this.previewScales.add(this.printProvider.scales.getRange());
+
+        this.layers = [];
+        var layer;
+        Ext.each(this.sourceMap.layers, function(layer) {
+            var clone = layer.clone();
+            layer.getVisibility() === true && this.layers.push(clone);
+        }, this);
+
+        this.extent = this.sourceMap.getExtent();
+        
+        GeoExt.PrintMapPanel.superclass.initComponent.call(this);
+
+        this.printProvider.on("layoutchange", this.syncSize, this);
+        this.printPage.on("change", this.fitZoom, this);
+        this.map.events.register("moveend", this, this.updatePage);
+    },
+    
+    /** private: method[afterRender]
+     *  Private method called after the panel has been rendered.
+     */
+    afterRender: function() {
+        GeoExt.PrintMapPanel.superclass.afterRender.apply(this, arguments);
+        this.syncSize();
+        if (this.initialConfig.limitScales === true) {
+            if (!this.ownerCt) {
+                this.calculatePreviewScales();
+            } else {
+                this.ownerCt.on({
+                    "afterlayout": {
+                        fn: this.calculatePreviewScales,
+                        scope: this,
+                        single: true
+                    }
+                });
+            }
+            this.on("resize", this.calculatePreviewScales, this);
+        }
+    },
+    
+    /** private: method[adjustSize]
+     *  :param width: ``Number`` If not provided or 0, initialConfig.width will
+     *      be used.
+     *  :param height: ``Number`` If not provided or 0, initialConfig.height
+     *      will be used.
+     *  Private override - sizing this component always takes the aspect ratio
+     *  of the print page into account.
+     */
+    adjustSize: function(width, height) {        
+        var printSize = this.printProvider.layout.get("size");
+        var ratio = printSize.width / printSize.height;
+        // respect width & height when sizing according to the print page's
+        // aspect ratio - do not exceed either, but don't take values for
+        // granted if container is configured with autoWidth or autoHeight.
+        var ownerCt = this.ownerCt;
+        var targetWidth = (ownerCt && ownerCt.autoWidth) ? 0 :
+            (width || this.initialConfig.width);
+        var targetHeight = (ownerCt && ownerCt.autoHeight) ? 0 :
+            (height || this.initialConfig.height);
+        if (targetWidth) {
+            height = targetWidth / ratio;
+            if (targetHeight && height > targetHeight) {
+                height = targetHeight;
+                width = height * ratio;
+            } else {
+                width = targetWidth;
+            }
+        } else if (targetHeight) {
+            width = targetHeight * ratio;
+            height = targetHeight;
+        }
+
+        return {width: width, height: height};
+    },
+    
+    /** private: method[fitZoom]
+     *  Fits this PrintMapPanel's zoom to the print scale.
+     */
+    fitZoom: function() {
+        if (!this._updating && this.printPage.scale) {
+            this._updating = true;
+            var printBounds = this.printPage.getPrintExtent(this.map);
+            this.currentZoom = this.map.getZoomForExtent(printBounds);
+            this.map.zoomToExtent(printBounds);
+            delete this._updating;
+        }
+    },
+
+    /** private: method[updatePage]
+     *  updates the print page to match this PrintMapPanel's center and scale.
+     */
+    updatePage: function() {
+        if (!this._updating) {
+            var zoom = this.map.getZoom();
+            this._updating = true;
+            if (zoom === this.currentZoom) {
+                this.printPage.setCenter(this.map.getCenter());
+            } else {
+                this.printPage.fit(this.map);
+            }
+            delete this._updating;
+            this.currentZoom = zoom;
+        }
+    },
+    
+    /** private: method[calculatePreviewScales]
+     */
+    calculatePreviewScales: function() {
+        this.previewScales.removeAll();
+
+        this.printPage.suspendEvents();
+        var scale = this.printPage.scale;
+
+        // group print scales by the zoom level they would be previewed at
+        var viewSize = this.map.getSize();
+        var scalesByZoom = {};
+        var zooms = [];
+        this.printProvider.scales.each(function(rec) {
+            this.printPage.setScale(rec);
+            var extent = this.printPage.getPrintExtent(this.map);
+            var zoom = this.map.getZoomForExtent(extent);
+
+            var idealResolution = Math.max(
+                extent.getWidth() / viewSize.w,
+                extent.getHeight() / viewSize.h
+            );
+            var resolution = this.map.getResolutionForZoom(zoom);
+            // the closer to the ideal resolution, the better the fit
+            var diff = Math.abs(idealResolution - resolution);
+            if (!(zoom in scalesByZoom) || scalesByZoom[zoom].diff > diff) {
+                scalesByZoom[zoom] = {
+                    rec: rec,
+                    diff: diff
+                };
+                zooms.indexOf(zoom) == -1 && zooms.push(zoom);
+            }
+        }, this);
+        
+        // add only the preview scales that closely fit print extents
+        for (var i=0, ii=zooms.length; i<ii; ++i) {
+            this.previewScales.add(scalesByZoom[zooms[i]].rec);
+        }
+
+        scale && this.printPage.setScale(scale);
+        this.printPage.resumeEvents();
+
+        if (scale && this.previewScales.getCount() > 0) {
+            var maxScale = this.previewScales.getAt(0);
+            var minScale = this.previewScales.getAt(this.previewScales.getCount()-1);
+            if (scale.get("value") < minScale.get("value")) {
+                this.printPage.setScale(minScale);
+            } else if (scale.get("value") > maxScale.get("value")) {
+                this.printPage.setScale(maxScale);
+            }
+        }
+
+        this.fitZoom();
+    },
+    
+    /** api: method[print]
+     *  :param options: ``Object`` options for
+     *      the :class:`GeoExt.data.PrintProvider` :: ``print``  method.
+     *  
+     *  Convenience method for printing the map, without the need to
+     *  interact with the printProvider and printPage.
+     */
+    print: function(options) {
+        this.printProvider.print(this.map, [this.printPage], options);
+    },
+    
+    /** private: method[beforeDestroy]
+     */
+    beforeDestroy: function() {
+        this.map.events.unregister("moveend", this, this.updatePage);
+        this.printPage.un("change", this.fitZoom, this);
+        this.printProvider.un("layoutchange", this.syncSize, this);
+        GeoExt.PrintMapPanel.superclass.beforeDestroy.apply(this, arguments);
+    }
+});
+
+/** api: xtype = gx_printmappanel */
+Ext.reg('gx_printmappanel', GeoExt.PrintMapPanel); 
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/grid/FeatureSelectionModel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/grid/FeatureSelectionModel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/grid/FeatureSelectionModel.js	(revision 76)
@@ -0,0 +1,317 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.grid
+ *  class = FeatureSelectionModel
+ *  base_link = `Ext.grid.RowSelectionModel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel>`_
+ */
+
+Ext.namespace('GeoExt.grid');
+
+/** api: constructor
+ *  .. class:: FeatureSelectionModel
+ *
+ *      A row selection model which enables automatic selection of features
+ *      in the map when rows are selected in the grid and vice-versa.
+ */
+
+/** api: example
+ *  Sample code to create a feature grid with a feature selection model:
+ *  
+ *  .. code-block:: javascript
+ *
+ *       var gridPanel = new Ext.grid.GridPanel({
+ *          title: "Feature Grid",
+ *          region: "east",
+ *          store: store,
+ *          width: 320,
+ *          columns: [{
+ *              header: "Name",
+ *              width: 200,
+ *              dataIndex: "name"
+ *          }, {
+ *              header: "Elevation",
+ *              width: 100,
+ *              dataIndex: "elevation"
+ *          }],
+ *          sm: new GeoExt.grid.FeatureSelectionModel() 
+ *      });
+ */
+
+GeoExt.grid.FeatureSelectionModelMixin = function() {
+    return {
+        /** api: config[autoActivateControl]
+         *  ``Boolean`` If true the select feature control is activated and
+         *  deactivated when binding and unbinding. Defaults to true.
+         */
+        autoActivateControl: true,
+
+        /** api: config[layerFromStore]
+         *  ``Boolean`` If true, and if the constructor is passed neither a
+         *  layer nor a select feature control, a select feature control is
+         *  created using the layer found in the grid's store. Set it to
+         *  false if you want to manually bind the selection model to a
+         *  layer. Defaults to true.
+         */
+        layerFromStore: true,
+
+        /** api: config[selectControl]
+         *
+         *  ``OpenLayers.Control.SelectFeature`` A select feature control. If not
+         *  provided one will be created.  If provided any "layer" config option
+         *  will be ignored, and its "multiple" option will be used to configure
+         *  the selectionModel.  If an ``Object`` is provided here, it will be
+         *  passed as config to the SelectFeature constructor, and the "layer"
+         *  config option will be used for the layer.
+         */
+
+        /** private: property[selectControl] 
+         *  ``OpenLayers.Control.SelectFeature`` The select feature control 
+         *  instance. 
+         */ 
+        selectControl: null, 
+        
+        /** api: config[layer]
+         *  ``OpenLayers.Layer.Vector`` The vector layer used for the creation of
+         *  the select feature control, it must already be added to the map. If not
+         *  provided, the layer bound to the grid's store, if any, will be used.
+         */
+
+        /** private: property[bound]
+         *  ``Boolean`` Flag indicating if the selection model is bound.
+         */
+        bound: false,
+        
+        /** private: property[superclass]
+         *  ``Ext.grid.AbstractSelectionModel`` Our superclass.
+         */
+        superclass: null,
+
+        /** private */
+        constructor: function(config) {
+            config = config || {};
+            if(config.selectControl instanceof OpenLayers.Control.SelectFeature) { 
+                if(!config.singleSelect) {
+                    var ctrl = config.selectControl;
+                    config.singleSelect = !(ctrl.multiple || !!ctrl.multipleKey);
+                }
+            } else if(config.layer instanceof OpenLayers.Layer.Vector) {
+                this.selectControl = this.createSelectControl(
+                    config.layer, config.selectControl
+                );
+                delete config.layer;
+                delete config.selectControl;
+            }
+            this.superclass = arguments.callee.superclass;
+            this.superclass.constructor.call(this, config);
+        },
+        
+        /** private: method[initEvents]
+         *
+         *  Called after this.grid is defined
+         */
+        initEvents: function() {
+            this.superclass.initEvents.call(this);
+            if(this.layerFromStore) {
+                var layer = this.grid.getStore() && this.grid.getStore().layer;
+                if(layer &&
+                   !(this.selectControl instanceof OpenLayers.Control.SelectFeature)) {
+                    this.selectControl = this.createSelectControl(
+                        layer, this.selectControl
+                    );
+                }
+            }
+            if(this.selectControl) {
+                this.bind(this.selectControl);
+            }
+        },
+
+        /** private: createSelectControl
+         *  :param layer: ``OpenLayers.Layer.Vector`` The vector layer.
+         *  :param config: ``Object`` The select feature control config.
+         *
+         *  Create the select feature control.
+         */
+        createSelectControl: function(layer, config) {
+            config = config || {};
+            var singleSelect = config.singleSelect !== undefined ?
+                               config.singleSelect : this.singleSelect;
+            config = OpenLayers.Util.extend({
+                toggle: true,
+                multipleKey: singleSelect ? null :
+                    (Ext.isMac ? "metaKey" : "ctrlKey")
+            }, config);
+            var selectControl = new OpenLayers.Control.SelectFeature(
+                layer, config
+            );
+            layer.map.addControl(selectControl);
+            return selectControl;
+        },
+        
+        /** api: method[bind]
+         *
+         *  :param obj: ``OpenLayers.Layer.Vector`` or
+         *      ``OpenLayers.Control.SelectFeature`` The object this selection model
+         *      should be bound to, either a vector layer or a select feature
+         *      control.
+         *  :param options: ``Object`` An object with a "controlConfig"
+         *      property referencing the configuration object to pass to the
+         *      ``OpenLayers.Control.SelectFeature`` constructor.
+         *  :return: ``OpenLayers.Control.SelectFeature`` The select feature
+         *      control this selection model uses.
+         *
+         *  Bind the selection model to a layer or a SelectFeature control.
+         */
+        bind: function(obj, options) {
+            if(!this.bound) {
+                options = options || {};
+                this.selectControl = obj;
+                if(obj instanceof OpenLayers.Layer.Vector) {
+                    this.selectControl = this.createSelectControl(
+                        obj, options.controlConfig
+                    );
+                }
+                if(this.autoActivateControl) {
+                    this.selectControl.activate();
+                }
+                var layers = this.getLayers();
+                for(var i = 0, len = layers.length; i < len; i++) {
+                    layers[i].events.on({
+                        featureselected: this.featureSelected,
+                        featureunselected: this.featureUnselected,
+                        scope: this
+                    });
+                }
+                this.on("rowselect", this.rowSelected, this);
+                this.on("rowdeselect", this.rowDeselected, this);
+                this.bound = true;
+            }
+            return this.selectControl;
+        },
+        
+        /** api: method[unbind]
+         *  :return: ``OpenLayers.Control.SelectFeature`` The select feature
+         *      control this selection model used.
+         *
+         *  Unbind the selection model from the layer or SelectFeature control.
+         */
+        unbind: function() {
+            var selectControl = this.selectControl;
+            if(this.bound) {
+                var layers = this.getLayers();
+                for(var i = 0, len = layers.length; i < len; i++) {
+                    layers[i].events.un({
+                        featureselected: this.featureSelected,
+                        featureunselected: this.featureUnselected,
+                        scope: this
+                    });
+                }
+                this.un("rowselect", this.rowSelected, this);
+                this.un("rowdeselect", this.rowDeselected, this);
+                if(this.autoActivateControl) {
+                    selectControl.deactivate();
+                }
+                this.selectControl = null;
+                this.bound = false;
+            }
+            return selectControl;
+        },
+        
+        /** private: method[featureSelected]
+         *  :param evt: ``Object`` An object with a feature property referencing
+         *                         the selected feature.
+         */
+        featureSelected: function(evt) {
+            if(!this._selecting) {
+                var store = this.grid.store;
+                var row = store.findBy(function(record, id) {
+                    return record.getFeature() == evt.feature;
+                });
+                if(row != -1 && !this.isSelected(row)) {
+                    this._selecting = true;
+                    this.selectRow(row, !this.singleSelect);
+                    this._selecting = false;
+                    // focus the row in the grid to ensure it is visible
+                    this.grid.getView().focusRow(row);
+                }
+            }
+        },
+        
+        /** private: method[featureUnselected]
+         *  :param evt: ``Object`` An object with a feature property referencing
+         *                         the unselected feature.
+         */
+        featureUnselected: function(evt) {
+            if(!this._selecting) {
+                var store = this.grid.store;
+                var row = store.findBy(function(record, id) {
+                    return record.getFeature() == evt.feature;
+                });
+                if(row != -1 && this.isSelected(row)) {
+                    this._selecting = true;
+                    this.deselectRow(row); 
+                    this._selecting = false;
+                    this.grid.getView().focusRow(row);
+                }
+            }
+        },
+        
+        /** private: method[rowSelected]
+         *  :param model: ``Ext.grid.RowSelectModel`` The row select model.
+         *  :param row: ``Integer`` The row index.
+         *  :param record: ``Ext.data.Record`` The record.
+         */
+        rowSelected: function(model, row, record) {
+            var feature = record.getFeature();
+            if(!this._selecting && feature) {
+                var layers = this.getLayers();
+                for(var i = 0, len = layers.length; i < len; i++) {
+                    if(layers[i].selectedFeatures.indexOf(feature) == -1) {
+                        this._selecting = true;
+                        this.selectControl.select(feature);
+                        this._selecting = false;
+                        break;
+                    }
+                }
+             }
+        },
+        
+        /** private: method[rowDeselected]
+         *  :param model: ``Ext.grid.RowSelectModel`` The row select model.
+         *  :param row: ``Integer`` The row index.
+         *  :param record: ``Ext.data.Record`` The record.
+         */
+        rowDeselected: function(model, row, record) {
+            var feature = record.getFeature();
+            if(!this._selecting && feature) {
+                var layers = this.getLayers();
+                for(var i = 0, len = layers.length; i < len; i++) {
+                    if(layers[i].selectedFeatures.indexOf(feature) != -1) {
+                        this._selecting = true;
+                        this.selectControl.unselect(feature);
+                        this._selecting = false;
+                        break;
+                    }
+                }
+            }
+        },
+
+        /** private: method[getLayers]
+         *  Return the layers attached to the select feature control.
+         */
+        getLayers: function() {
+            return this.selectControl.layers || [this.selectControl.layer];
+        }
+    };
+};
+
+GeoExt.grid.FeatureSelectionModel = Ext.extend(
+    Ext.grid.RowSelectionModel,
+    new GeoExt.grid.FeatureSelectionModelMixin
+);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Action.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Action.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Action.js	(revision 76)
@@ -0,0 +1,227 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = Action
+ *  base_link = `Ext.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Action>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a toolbar with an OpenLayers control into it.
+ * 
+ *  .. code-block:: javascript
+ *  
+ *      var action = new GeoExt.Action({
+ *          text: "max extent",
+ *          control: new OpenLayers.Control.ZoomToMaxExtent(),
+ *          map: map
+ *      });
+ *      var toolbar = new Ext.Toolbar([action]);
+ */
+
+/** api: constructor
+ *  .. class:: Action(config)
+ *  
+ *      Create a GeoExt.Action instance. A GeoExt.Action is created
+ *      to insert an OpenLayers control in a toolbar as a button or
+ *      in a menu as a menu item. A GeoExt.Action instance can be
+ *      used like a regular Ext.Action, look at the Ext.Action API
+ *      doc for more detail.
+ */
+GeoExt.Action = Ext.extend(Ext.Action, {
+
+    /** api: config[control]
+     *  ``OpenLayers.Control`` The OpenLayers control wrapped in this action.
+     */
+    control: null,
+
+    /** api: config[map]
+     *  ``OpenLayers.Map`` The OpenLayers map that the control should be added
+     *  to.  For controls that don't need to be added to a map or have already
+     *  been added to one, this config property may be omitted.
+     */
+    map: null,
+
+    /** private: property[uScope]
+     *  ``Object`` The user-provided scope, used when calling uHandler,
+     *  uToggleHandler, and uCheckHandler.
+     */
+    uScope: null,
+
+    /** private: property[uHandler]
+     *  ``Function`` References the function the user passes through
+     *  the "handler" property.
+     */
+    uHandler: null,
+
+    /** private: property[uToggleHandler]
+     *  ``Function`` References the function the user passes through
+     *  the "toggleHandler" property.
+     */
+    uToggleHandler: null,
+
+    /** private: property[uCheckHandler]
+     *  ``Function`` References the function the user passes through
+     *  the "checkHandler" property.
+     */
+    uCheckHandler: null,
+
+    /** private */
+    constructor: function(config) {
+        
+        // store the user scope and handlers
+        this.uScope = config.scope;
+        this.uHandler = config.handler;
+        this.uToggleHandler = config.toggleHandler;
+        this.uCheckHandler = config.checkHandler;
+
+        config.scope = this;
+        config.handler = this.pHandler;
+        config.toggleHandler = this.pToggleHandler;
+        config.checkHandler = this.pCheckHandler;
+
+        // set control in the instance, the Ext.Action
+        // constructor won't do it for us
+        var ctrl = this.control = config.control;
+        delete config.control;
+
+        // register "activate" and "deactivate" listeners
+        // on the control
+        if(ctrl) {
+            // If map is provided in config, add control to map.
+            if(config.map) {
+                config.map.addControl(ctrl);
+                delete config.map;
+            }
+            if((config.pressed || config.checked) && ctrl.map) {
+                ctrl.activate();
+            }
+            ctrl.events.on({
+                activate: this.onCtrlActivate,
+                deactivate: this.onCtrlDeactivate,
+                scope: this
+            });
+        }
+
+        arguments.callee.superclass.constructor.call(this, config);
+    },
+
+    /** private: method[pHandler]
+     *  :param cmp: ``Ext.Component`` The component that triggers the handler.
+     *
+     *  The private handler.
+     */
+    pHandler: function(cmp) {
+        var ctrl = this.control;
+        if(ctrl &&
+           ctrl.type == OpenLayers.Control.TYPE_BUTTON) {
+            ctrl.trigger();
+        }
+        if(this.uHandler) {
+            this.uHandler.apply(this.uScope, arguments);
+        }
+    },
+
+    /** private: method[pTogleHandler]
+     *  :param cmp: ``Ext.Component`` The component that triggers the toggle handler.
+     *  :param state: ``Boolean`` The state of the toggle.
+     *
+     *  The private toggle handler.
+     */
+    pToggleHandler: function(cmp, state) {
+        this.changeControlState(state);
+        if(this.uToggleHandler) {
+            this.uToggleHandler.apply(this.uScope, arguments);
+        }
+    },
+
+    /** private: method[pCheckHandler]
+     *  :param cmp: ``Ext.Component`` The component that triggers the check handler.
+     *  :param state: ``Boolean`` The state of the toggle.
+     *
+     *  The private check handler.
+     */
+    pCheckHandler: function(cmp, state) {
+        this.changeControlState(state);
+        if(this.uCheckHandler) {
+            this.uCheckHandler.apply(this.uScope, arguments);
+        }
+    },
+
+    /** private: method[changeControlState]
+     *  :param state: ``Boolean`` The state of the toggle.
+     *
+     *  Change the control state depending on the state boolean.
+     */
+    changeControlState: function(state) {
+        if(state) {
+            if(!this._activating) {
+                this._activating = true;
+                this.control.activate();
+                this._activating = false;
+            }
+        } else {
+            if(!this._deactivating) {
+                this._deactivating = true;
+                this.control.deactivate();
+                this._deactivating = false;
+            }
+        }
+    },
+
+    /** private: method[onCtrlActivate]
+     *  
+     *  Called when this action's control is activated.
+     */
+    onCtrlActivate: function() {
+        var ctrl = this.control;
+        if(ctrl.type == OpenLayers.Control.TYPE_BUTTON) {
+            this.enable();
+        } else {
+            // deal with buttons
+            this.safeCallEach("toggle", [true]);
+            // deal with check items
+            this.safeCallEach("setChecked", [true]);
+        }
+    },
+
+    /** private: method[onCtrlDeactivate]
+     *  
+     *  Called when this action's control is deactivated.
+     */
+    onCtrlDeactivate: function() {
+        var ctrl = this.control;
+        if(ctrl.type == OpenLayers.Control.TYPE_BUTTON) {
+            this.disable();
+        } else {
+            // deal with buttons
+            this.safeCallEach("toggle", [false]);
+            // deal with check items
+            this.safeCallEach("setChecked", [false]);
+        }
+    },
+
+    /** private: method[safeCallEach]
+     *
+     */
+    safeCallEach: function(fnName, args) {
+        var cs = this.items;
+        for(var i = 0, len = cs.length; i < len; i++){
+            if(cs[i][fnName]) {
+                cs[i].rendered ?
+                    cs[i][fnName].apply(cs[i], args) :
+                    cs[i].on({
+                        "render": cs[i][fnName].createDelegate(cs[i], args),
+                        single: true
+                    });
+            }
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendPanel.js	(revision 76)
@@ -0,0 +1,234 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = LegendPanel
+ *  base_link = `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_
+ */
+
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: LegendPanel(config)
+ *
+ *  A panel showing legends of all layers in a layer store.
+ *  Depending on the layer type, a legend renderer will be chosen.
+ */
+GeoExt.LegendPanel = Ext.extend(Ext.Panel, {
+
+    /** api: config[dynamic]
+     *  ``Boolean``
+     *  If false the LegendPanel will not listen to the add, remove and change 
+     *  events of the LayerStore. So it will load with the initial state of
+     *  the LayerStore and not change anymore. 
+     */
+    dynamic: true,
+    
+    /** api: config[layerStore]
+     *  ``GeoExt.data.LayerStore``
+     *  The layer store containing layers to be displayed in the legend 
+     *  container. If not provided it will be taken from the MapPanel.
+     */
+    layerStore: null,
+    
+    /** api: config[preferredTypes]
+     *  ``Array(String)`` An array of preferred legend types.
+     */
+    
+    /** private: property[preferredTypes]
+     */
+    preferredTypes: null,
+
+    /** api: config[filter]
+     *  ``Function``
+     *  A function, called in the scope of the legend panel, with a layer record
+     *  as argument. Is expected to return true for layers to be displayed, false
+     *  otherwise. By default, all layers will be displayed.
+     *
+     *  .. code-block:: javascript
+     *
+     *      filter: function(record) {
+     *          return record.getLayer().isBaseLayer;
+     *      }
+     */
+    filter: function(record) {
+        return true;
+    },
+
+    /** private: method[initComponent]
+     *  Initializes the legend panel.
+     */
+    initComponent: function() {
+        GeoExt.LegendPanel.superclass.initComponent.call(this);
+    },
+    
+    /** private: method[onRender]
+     *  Private method called when the legend panel is being rendered.
+     */
+    onRender: function() {
+        GeoExt.LegendPanel.superclass.onRender.apply(this, arguments);
+        if(!this.layerStore) {
+            this.layerStore = GeoExt.MapPanel.guess().layers;
+        }
+        this.layerStore.each(function(record) {
+                this.addLegend(record);
+            }, this);
+        if (this.dynamic) {
+            this.layerStore.on({
+                "add": this.onStoreAdd,
+                "remove": this.onStoreRemove,
+                "clear": this.onStoreClear,
+                scope: this
+            });
+        }
+    },
+
+    /** private: method[recordIndexToPanelIndex]
+     *  Private method to get the panel index for a layer represented by a
+     *  record.
+     *
+     *  :param index ``Integer`` The index of the record in the store.
+     *
+     *  :return: ``Integer`` The index of the sub panel in this panel.
+     */
+    recordIndexToPanelIndex: function(index) {
+        var store = this.layerStore;
+        var count = store.getCount();
+        var panelIndex = -1;
+        var legendCount = this.items ? this.items.length : 0;
+        var record, layer;
+        for(var i=count-1; i>=0; --i) {
+            record = store.getAt(i);
+            layer = record.getLayer();
+            var types = GeoExt.LayerLegend.getTypes(record);
+            if(layer.displayInLayerSwitcher && types.length > 0 &&
+                (store.getAt(i).get("hideInLegend") !== true)) {
+                    ++panelIndex;
+                    if(index === i || panelIndex > legendCount-1) {
+                        break;
+                    }
+            }
+        }
+        return panelIndex;
+    },
+    
+    /** private: method[getIdForLayer]
+     *  :arg layer: ``OpenLayers.Layer``
+     *  :returns: ``String``
+     *
+     *  Generate an element id that is unique to this panel/layer combo.
+     */
+    getIdForLayer: function(layer) {
+        return this.id + "-" + layer.id;
+    },
+
+    /** private: method[onStoreAdd]
+     *  Private method called when a layer is added to the store.
+     *
+     *  :param store: ``Ext.data.Store`` The store to which the record(s) was 
+     *      added.
+     *  :param record: ``Ext.data.Record`` The record object(s) corresponding
+     *      to the added layers.
+     *  :param index: ``Integer`` The index of the inserted record.
+     */
+    onStoreAdd: function(store, records, index) {
+        var panelIndex = this.recordIndexToPanelIndex(index+records.length-1);
+        for (var i=0, len=records.length; i<len; i++) {
+            this.addLegend(records[i], panelIndex);
+        }
+        this.doLayout();
+    },
+
+    /** private: method[onStoreRemove]
+     *  Private method called when a layer is removed from the store.
+     *
+     *  :param store: ``Ext.data.Store`` The store from which the record(s) was
+     *      removed.
+     *  :param record: ``Ext.data.Record`` The record object(s) corresponding
+     *      to the removed layers.
+     *  :param index: ``Integer`` The index of the removed record.
+     */
+    onStoreRemove: function(store, record, index) {
+        this.removeLegend(record);            
+    },
+
+    /** private: method[removeLegend]
+     *  Remove the legend of a layer.
+     *  :param record: ``Ext.data.Record`` The record object from the layer 
+     *      store to remove.
+     */
+    removeLegend: function(record) {
+        if (this.items) {
+            var legend = this.getComponent(this.getIdForLayer(record.getLayer()));
+            if (legend) {
+                this.remove(legend, true);
+                this.doLayout();
+            }
+        }
+    },
+
+    /** private: method[onStoreClear]
+     *  Private method called when a layer store is cleared.
+     *
+     *  :param store: ``Ext.data.Store`` The store from which was cleared.
+     */
+    onStoreClear: function(store) {
+        this.removeAllLegends();
+    },
+
+    /** private: method[removeAllLegends]
+     *  Remove all legends from this legend panel.
+     */
+    removeAllLegends: function() {
+        this.removeAll(true);
+        this.doLayout();
+    },
+
+    /** private: method[addLegend]
+     *  Add a legend for the layer.
+     *
+     *  :param record: ``Ext.data.Record`` The record object from the layer 
+     *      store.
+     *  :param index: ``Integer`` The position at which to add the legend.
+     */
+    addLegend: function(record, index) {
+        if (this.filter(record) === true) {
+            var layer = record.getLayer();
+            index = index || 0;
+            var legend;
+            var types = GeoExt.LayerLegend.getTypes(record,
+                this.preferredTypes);
+            if(layer.displayInLayerSwitcher && !record.get('hideInLegend') &&
+                types.length > 0) {
+                this.insert(index, {
+                    xtype: types[0],
+                    id: this.getIdForLayer(layer),
+                    layerRecord: record,
+                    hidden: !((!layer.map && layer.visibility) ||
+                        (layer.getVisibility() && layer.calculateInRange()))
+                });
+            }
+        }
+    },
+
+    /** private: method[onDestroy]
+     *  Private method called during the destroy sequence.
+     */
+    onDestroy: function() {
+        if(this.layerStore) {
+            this.layerStore.un("add", this.onStoreAdd, this);
+            this.layerStore.un("remove", this.onStoreRemove, this);
+            this.layerStore.un("clear", this.onStoreClear, this);
+        }
+        GeoExt.LegendPanel.superclass.onDestroy.apply(this, arguments);
+    }
+});
+
+/** api: xtype = gx_legendpanel */
+Ext.reg('gx_legendpanel', GeoExt.LegendPanel);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/UrlLegend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/UrlLegend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/UrlLegend.js	(revision 76)
@@ -0,0 +1,64 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/LegendImage.js
+ * @requires GeoExt/widgets/LayerLegend.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = UrlLegend
+ */
+
+/** api: (extends)
+ * GeoExt/widgets/LayerLegend.js
+ */
+
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: UrlLegend(config)
+ *
+ *      Show a legend image in a BoxComponent and make sure load errors are 
+ *      dealt with.
+ */
+GeoExt.UrlLegend = Ext.extend(GeoExt.LayerLegend, {
+
+    /** private: method[initComponent]
+     *  Initializes the legend image component. 
+     */
+    initComponent: function() {
+        GeoExt.UrlLegend.superclass.initComponent.call(this);
+        this.add(new GeoExt.LegendImage({
+            url: this.layerRecord.get("legendURL")
+        }));
+    },
+    
+    /** private: method[update]
+     *  Private override
+     */
+    update: function() {
+        GeoExt.UrlLegend.superclass.update.apply(this, arguments);
+        this.items.get(1).setUrl(this.layerRecord.get("legendURL"));
+    }
+
+});
+
+/** private: method[supports]
+ *  Private override
+ */
+GeoExt.UrlLegend.supports = function(layerRecord) {
+    return layerRecord.get("legendURL") != null;
+};
+
+/** api: legendtype = gx_urllegend */
+GeoExt.LayerLegend.types["gx_urllegend"] = GeoExt.UrlLegend;
+
+/** api: xtype = gx_urllegend */
+Ext.reg('gx_urllegend', GeoExt.UrlLegend);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/VectorLegend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/VectorLegend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/VectorLegend.js	(revision 76)
@@ -0,0 +1,671 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/FeatureRenderer.js
+ * @requires GeoExt/widgets/LayerLegend.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = VectorLegend
+ */
+
+/** api: (extends)
+ * GeoExt/widgets/LayerLegend.js
+ */
+
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: VectorLegend(config)
+ *
+ *      Create a vector legend.
+ */
+GeoExt.VectorLegend = Ext.extend(GeoExt.LayerLegend, {
+
+    /** api: config[layerRecord]
+     *  :class:`GeoExt.data.LayerRecord`
+     *  The record containing a vector layer that this legend will be based on.  
+     *  One of ``layerRecord``, ``layer``,  or ``rules`` must be specified in 
+     *  the config.
+     */
+    layerRecord: null,
+    
+    /** api: config[layer]
+     *  ``OpenLayers.Layer.Vector``
+     *  The layer that this legend will be based on.  One of ``layer``, 
+     *  ``rules``, or ``layerRecord`` must be specified in the config.
+     */
+    layer: null,
+
+    /** api: config[rules]
+     * ``Array(OpenLayers.Rule)``
+     *  List of rules.  One of ``rules``, ``layer``, or ``layerRecord`` must be 
+     *  specified in the config.  The ``symbolType`` property must also be
+     *  provided if only ``rules`` are given in the config.
+     */
+    rules: null,
+    
+    /** api: config[symbolType]
+     *  ``String``
+     *  The symbol type for legend swatches.  Must be one of ``"Point"``, 
+     *  ``"Line"``, or ``"Polygon"``.  If not provided, the ``layer`` or
+     *  ``layerRecord`` config property must be specified, and the geometry type
+     *  of the first feature found on the layer will be used. If a rule does
+     *  not have a symbolizer for ``symbolType``, we look at the symbolizers
+     *  for the rule, and see if it has a ``"Point"``, ``"Line"`` or
+     *  ``"Polygon"`` symbolizer, which we use for rendering a swatch of the
+     *  respective geometry type. 
+     */
+    symbolType: null,
+
+    /** api: config[untitledPrefix]
+     *  ``String``
+     *  The prefix to use as a title for rules with no title or
+     *  name.  Default is ``"Untitled "``.  Prefix will be appended with a
+     *  number that corresponds to the index of the rule (1 for first rule).
+     */
+    untitledPrefix: "Untitled ",
+    
+    /** api: config[clickableSymbol]
+     *  ``Boolean``
+     *  Set cursor style to "pointer" for symbolizers.  Register for
+     *  the ``symbolclick`` event to handle clicks.  Note that click events
+     *  are fired regardless of this value.  If ``false``, no cursor style will
+     *  be set.  Default is ``false``.
+     */
+    clickableSymbol: false,
+    
+    /** api: config[clickableTitle]
+     *  ``Boolean``
+     *  Set cursor style to "pointer" for rule titles.  Register for
+     *  the ``titleclick`` event to handle clicks.  Note that click events
+     *  are fired regardless of this value.  If ``false``, no cursor style will
+     *  be set.  Default is ``false``.
+     */
+    clickableTitle: false,
+    
+    /** api: config[selectOnClick]
+     *  ``Boolean``
+     *  Set to true if a rule should be selected by clicking on the
+     *  symbol or title. Selection will trigger the ruleselected event, and
+     *  a click on a selected rule will unselect it and trigger the
+     *  ``ruleunselected`` event. Default is ``false``.
+     */
+    selectOnClick: false,
+    
+    /** api: config[enableDD]
+     *  ``Boolean``
+     *  Allow drag and drop of rules. Default is ``false``.
+     */
+    enableDD: false,
+    
+    /** api: config[bodyBorder]
+     *  ``Boolean``
+     *  Show a border around the legend panel. Default is ``false``.
+     */
+    bodyBorder: false,
+
+    /** private: property[feature]
+     *  ``OpenLayers.Feature.Vector``
+     *  Cached feature for rendering.
+     */
+    feature: null,
+    
+    /** private: property[selectedRule]
+     *  ``OpenLayers.Rule``
+     *  The rule that is currently selected.
+     */
+    selectedRule: null,
+
+    /** private: property[currentScaleDenominator]
+     *  ``Number`` 
+     *  The current scale denominator of any map associated with this
+     *  legend.  Use :meth`setCurrentScaleDenominator` to change this.  If not
+     *  set an entry for each rule will be rendered.  If set, only rules that
+     *  apply for the given scale will be rendered.
+     */
+    currentScaleDenominator: null,
+    
+    /** private: method[initComponent]
+     *  Initializes the Vector legend.
+     */
+    initComponent: function() {
+        GeoExt.VectorLegend.superclass.initComponent.call(this);
+        if (this.layerRecord) {
+            this.layer = this.layerRecord.getLayer();
+            if (this.layer.map) {
+                this.currentScaleDenominator = this.layer.map.getScale();
+                this.layer.map.events.on({
+                    "zoomend": this.onMapZoom,
+                    scope: this
+                });
+            }
+        }
+        
+        // determine symbol type
+        if (!this.symbolType) {
+            if (this.feature) {
+                this.symbolType = this.symbolTypeFromFeature(this.feature);
+            } else if (this.layer) {
+                if (this.layer.features.length > 0) {
+                    var feature = this.layer.features[0].clone();
+                    feature.attributes = {};
+                    this.feature = feature;
+                    this.symbolType = this.symbolTypeFromFeature(this.feature);
+                } else {
+                    this.layer.events.on({
+                        featuresadded: this.onFeaturesAdded,
+                        scope: this
+                    });
+                }
+            }
+        }
+        
+        // set rules if not provided
+        if (this.layer && this.feature && !this.rules) {
+            this.setRules();
+        }
+
+        this.rulesContainer = new Ext.Container({
+            autoEl: {}
+        });
+        
+        this.add(this.rulesContainer);
+        
+        this.addEvents(
+            /** api: event[titleclick]
+             *  Fires when a rule title is clicked.
+             *
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule whose title was clicked.
+             */
+            "titleclick", 
+
+            /** api: event[symbolclick]
+             *  Fires when a rule symbolizer is clicked.
+             *
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule whose symbol was clicked.
+             */
+            "symbolclick",
+
+            /** api: event[ruleclick]
+             *  Fires when a rule entry is clicked (fired with symbolizer or
+             *  title click).
+             *
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule that was clicked.
+             */
+            "ruleclick",
+            
+            /** api: event[ruleselected]
+             *  Fires when a rule is clicked and ``selectOnClick`` is set to 
+             *  ``true``.
+             * 
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule that was selected.
+             */
+            "ruleselected",
+            
+            /** api: event[ruleunselected]
+             *  Fires when the selected rule is clicked and ``selectOnClick`` 
+             *  is set to ``true``, or when a rule is unselected by selecting a
+             *  different one.
+             * 
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule that was unselected.
+             */
+            "ruleunselected",
+            
+            /** api: event[rulemoved]
+             *  Fires when a rule is moved.
+             * 
+             *  Listener arguments:
+             *  
+             *  * comp - :class:`GeoExt.VectorLegend`` This component.
+             *  * rule - ``OpenLayers.Rule`` The rule that was moved.
+             */
+            "rulemoved"
+        ); 
+        
+        this.update();
+    },
+    
+    /** private: method[onMapZoom]
+     *  Listener for map zoomend.
+     */
+    onMapZoom: function() {
+        this.setCurrentScaleDenominator(
+            this.layer.map.getScale()
+        );
+    },
+    
+    /** private: method[symbolTypeFromFeature]
+     *  :arg feature:  ``OpenLayers.Feature.Vector``
+     *
+     *  Determine the symbol type given a feature.
+     */
+    symbolTypeFromFeature: function(feature) {
+        var match = feature.geometry.CLASS_NAME.match(/Point|Line|Polygon/);
+        return (match && match[0]) || "Point";
+    },
+    
+    /** private: method[onFeaturesAdded]
+     *  Set as a one time listener for the ``featuresadded`` event on the layer
+     *  if it was provided with no features originally.
+     */
+    onFeaturesAdded: function() {
+        this.layer.events.un({
+            featuresadded: this.onFeaturesAdded,
+            scope: this
+        });
+        var feature = this.layer.features[0].clone();
+        feature.attributes = {};
+        this.feature = feature;
+        this.symbolType = this.symbolTypeFromFeature(this.feature);
+        if (!this.rules) {
+            this.setRules();
+        }
+        this.update();
+    },
+    
+    /** private: method[setRules]
+     *  Sets the ``rules`` property for this.  This is called when the component
+     *  is constructed without rules.  Rules will be derived from the layer's 
+     *  style map if it has one.
+     */
+    setRules: function() {
+        var style = this.layer.styleMap && this.layer.styleMap.styles["default"];
+        if (!style) {
+            style = new OpenLayers.Style();
+        }
+        if (style.rules.length === 0) {
+            this.rules = [
+                new OpenLayers.Rule({
+                    symbolizer: style.createSymbolizer(this.feature)
+                })
+            ];
+        } else {
+            this.rules = style.rules;                
+        }
+    },
+    
+    /** api: method[setCurrentScaleDenominator]
+     *  :arg scale: ``Number`` The scale denominator.
+     *
+     *  Set the current scale denominator.  This will hide entries for any
+     *  rules that don't apply at the current scale.
+     */
+    setCurrentScaleDenominator: function(scale) {
+        if (scale !== this.currentScaleDenominator) {
+            this.currentScaleDenominator = scale;
+            this.update();
+        }
+    },
+
+    /** private: method[getRuleEntry]
+     *  :arg rule: ``OpenLayers.Rule``
+     *  :returns: ``Ext.Container``
+     *
+     *  Get the item corresponding to the rule.
+     */
+    getRuleEntry: function(rule) {
+        return this.rulesContainer.items.get(this.rules.indexOf(rule));
+    },
+
+    /** private: method[addRuleEntry]
+     *  :arg rule: ``OpenLayers.Rule``
+     *  :arg noDoLayout: ``Boolean``  Don't call doLayout after adding rule.
+     *      Default is ``false``.
+     *
+     *  Add a new rule entry in the rules container. This
+     *  method does not add the rule to the rules array.
+     */
+    addRuleEntry: function(rule, noDoLayout) {
+        this.rulesContainer.add(this.createRuleEntry(rule));
+        if (!noDoLayout) {
+            this.doLayout();
+        }
+    },
+
+    /** private: method[removeRuleEntry]
+     *  :arg rule: ``OpenLayers.Rule``
+     *  :arg noDoLayout: ``Boolean``  Don't call doLayout after removing rule.
+     *      Default is ``false``.
+     *
+     *  Remove a rule entry from the rules container, this
+     *  method assumes the rule is in the rules array, and
+     *  it does not remove the rule from the rules array.
+     */
+    removeRuleEntry: function(rule, noDoLayout) {
+        var ruleEntry = this.getRuleEntry(rule);
+        if (ruleEntry) {
+            this.rulesContainer.remove(ruleEntry);
+            if (!noDoLayout) {
+                this.doLayout();
+            }
+        }
+    },
+    
+    /** private: method[selectRuleEntry]
+     */
+    selectRuleEntry: function(rule) {
+        var newSelection = rule != this.selectedRule;
+        if (this.selectedRule) {
+            this.unselect();
+        }
+        if (newSelection) {
+            var ruleEntry = this.getRuleEntry(rule);
+            ruleEntry.body.addClass("x-grid3-row-selected");
+            this.selectedRule = rule;
+            this.fireEvent("ruleselected", this, rule);
+        }
+    },
+    
+    /** private: method[unselect]
+     */
+    unselect: function() {
+        this.rulesContainer.items.each(function(item, i) {
+            if (this.rules[i] == this.selectedRule) {
+                item.body.removeClass("x-grid3-row-selected");
+                this.selectedRule = null;
+                this.fireEvent("ruleunselected", this, this.rules[i]);
+            }
+        }, this);
+    },
+
+    /** private: method[createRuleEntry]
+     */
+    createRuleEntry: function(rule) {
+        var applies = true;
+        if (this.currentScaleDenominator != null) {
+            if (rule.minScaleDenominator) {
+                applies = applies && (this.currentScaleDenominator >= rule.minScaleDenominator);
+            }
+            if (rule.maxScaleDenominator) {
+                applies = applies && (this.currentScaleDenominator < rule.maxScaleDenominator);
+            }
+        }
+        return {
+            xtype: "panel",
+            layout: "column",
+            border: false,
+            hidden: !applies,
+            bodyStyle: this.selectOnClick ? {cursor: "pointer"} : undefined,
+            defaults: {
+                border: false
+            },
+            items: [
+                this.createRuleRenderer(rule),
+                this.createRuleTitle(rule)
+            ],
+            listeners: {
+                render: function(comp){
+                    this.selectOnClick && comp.getEl().on({
+                        click: function(comp){
+                            this.selectRuleEntry(rule);
+                        },
+                        scope: this
+                    });
+                    if (this.enableDD == true) {
+                        this.addDD(comp);
+                    }
+                },
+                scope: this
+            }
+        };
+    },
+
+    /** private: method[createRuleRenderer]
+     *  :arg rule: ``OpenLayers.Rule``
+     *  :returns: ``GeoExt.FeatureRenderer``
+     *
+     *  Create a renderer for the rule.
+     */
+    createRuleRenderer: function(rule) {
+        var types = [this.symbolType, "Point", "Line", "Polygon"];
+        var type, haveType;
+        var symbolizers = rule.symbolizers;
+        if (!symbolizers) {
+            // TODO: remove this when OpenLayers.Symbolizer is used everywhere
+            var symbolizer = rule.symbolizer;
+            for (var i=0, len=types.length; i<len; ++i) {
+                type = types[i];
+                if (symbolizer[type]) {
+                    symbolizer = symbolizer[type];
+                    haveType = true;
+                    break;
+                }
+            }
+            symbolizers = [symbolizer];
+        } else {
+            var Type;
+            outer: for (var i=0, ii=types.length; i<ii; ++i) {
+                type = types[i];
+                Type = OpenLayers.Symbolizer[type];
+                if (Type) {
+                    for (var j=0, jj=symbolizers.length; j<jj; ++j) {
+                        if (symbolizers[j] instanceof Type) {
+                            haveType = true;
+                            break outer;
+                        }
+                    }
+                }
+            }
+        }
+        return {
+            xtype: "gx_renderer",
+            symbolType: haveType ? type : this.symbolType,
+            symbolizers: symbolizers,
+            style: this.clickableSymbol ? {cursor: "pointer"} : undefined,
+            listeners: {
+                click: function() {
+                    if (this.clickableSymbol) {
+                        this.fireEvent("symbolclick", this, rule);
+                        this.fireEvent("ruleclick", this, rule);
+                    }
+                },
+                scope: this
+            }
+        };
+    },
+
+    /** private: method[createRuleTitle]
+     *  :arg rule: ``OpenLayers.Rule``
+     *  :returns: ``Ext.Component``
+     *
+     *  Create a title component for the rule.
+     */
+    createRuleTitle: function(rule) {
+        return {
+            cls: "x-form-item",
+            style: "padding: 0.2em 0.5em 0;", // TODO: css
+            bodyStyle: Ext.applyIf({background: "transparent"}, 
+                this.clickableTitle ? {cursor: "pointer"} : undefined),
+            html: this.getRuleTitle(rule),
+            listeners: {
+                render: function(comp) {
+                    this.clickableTitle && comp.getEl().on({
+                        click: function() {
+                            this.fireEvent("titleclick", this, rule);
+                            this.fireEvent("ruleclick", this, rule);
+                        },
+                        scope: this
+                    });
+                },
+                scope: this
+            }
+        };
+    },
+    
+    /** private: method[addDD]
+     *  :arg component: ``Ext.Component``
+     *
+     *  Adds drag & drop functionality to a rule entry.
+     */
+    addDD: function(component) {
+        var ct = component.ownerCt;
+        var panel = this;
+        new Ext.dd.DragSource(component.getEl(), {
+            ddGroup: ct.id,
+            onDragOut: function(e, targetId) {
+                var target = Ext.getCmp(targetId);
+                target.removeClass("gx-ruledrag-insert-above");
+                target.removeClass("gx-ruledrag-insert-below");
+                return Ext.dd.DragZone.prototype.onDragOut.apply(this, arguments);
+            },
+            onDragEnter: function(e, targetId) {
+                var target = Ext.getCmp(targetId);
+                var cls;
+                var sourcePos = ct.items.indexOf(component);
+                var targetPos = ct.items.indexOf(target);
+                if (sourcePos > targetPos) {
+                    cls = "gx-ruledrag-insert-above";
+                } else if (sourcePos < targetPos) {
+                    cls = "gx-ruledrag-insert-below";
+                }                
+                cls && target.addClass(cls);
+                return Ext.dd.DragZone.prototype.onDragEnter.apply(this, arguments);
+            },
+            onDragDrop: function(e, targetId) {
+                panel.moveRule(ct.items.indexOf(component),
+                    ct.items.indexOf(Ext.getCmp(targetId)));
+                return Ext.dd.DragZone.prototype.onDragDrop.apply(this, arguments);
+            },
+            getDragData: function(e) {
+                var sourceEl = e.getTarget(".x-column-inner");
+                if(sourceEl) {
+                    var d = sourceEl.cloneNode(true);
+                    d.id = Ext.id();
+                    return {
+                        sourceEl: sourceEl,
+                        repairXY: Ext.fly(sourceEl).getXY(),
+                        ddel: d
+                    }
+                }
+            }
+        });
+        new Ext.dd.DropTarget(component.getEl(), {
+            ddGroup: ct.id,
+            notifyDrop: function() {
+                return true;
+            }
+        });
+    },
+    
+    /** api: method[update]
+     *  Update rule titles and symbolizers.
+     */
+    update: function() {
+        GeoExt.VectorLegend.superclass.update.apply(this, arguments);
+        if (this.symbolType && this.rules) {
+            if (this.rulesContainer.items) {
+                var comp;
+                for (var i=this.rulesContainer.items.length-1; i>=0; --i) {
+                    comp = this.rulesContainer.getComponent(i);
+                    this.rulesContainer.remove(comp, true);
+                }
+            }
+            for (var i=0, ii=this.rules.length; i<ii; ++i) {
+                this.addRuleEntry(this.rules[i], true);
+            }
+            this.doLayout();
+            // make sure that the selected rule is still selected after update
+            if (this.selectedRule) {
+                this.getRuleEntry(this.selectedRule).body.addClass("x-grid3-row-selected");
+            }
+        }
+    },
+
+    /** private: method[updateRuleEntry]
+     *  :arg rule: ``OpenLayers.Rule``
+     *
+     *  Update the renderer and the title of a rule.
+     */
+    updateRuleEntry: function(rule) {
+        var ruleEntry = this.getRuleEntry(rule);
+        if (ruleEntry) {
+            ruleEntry.removeAll();
+            ruleEntry.add(this.createRuleRenderer(rule));
+            ruleEntry.add(this.createRuleTitle(rule));
+            ruleEntry.doLayout();
+        }
+    },
+    
+    /** private: method[moveRule]
+     */
+    moveRule: function(sourcePos, targetPos) {
+        var srcRule = this.rules[sourcePos];
+        this.rules.splice(sourcePos, 1);
+        this.rules.splice(targetPos, 0, srcRule);
+        this.update();
+        this.fireEvent("rulemoved", this, srcRule);
+    },
+    
+    /** private: method[getRuleTitle]
+     *  :returns: ``String``
+     *
+     *  Get a rule title given a rule.
+     */
+    getRuleTitle: function(rule) {
+        var title = rule.title || rule.name || "";
+        if (!title && this.untitledPrefix) {
+            title = this.untitledPrefix + (this.rules.indexOf(rule) + 1);
+        }
+        return title;
+    },
+
+    /** private: method[beforeDestroy]
+     *  Override.
+     */
+    beforeDestroy: function() {
+        if (this.layer) {
+            if (this.layer.events) {
+                this.layer.events.un({
+                    featuresadded: this.onFeaturesAdded,
+                    scope: this
+                });
+            }
+            if (this.layer.map && this.layer.map.events) {
+                this.layer.map.events.un({
+                    "zoomend": this.onMapZoom,
+                    scope: this
+                });
+            }
+        }
+        delete this.layer;
+        delete this.rules;
+        GeoExt.VectorLegend.superclass.beforeDestroy.apply(this, arguments);
+    }
+
+});
+
+/** private: method[supports]
+ *  Private override
+ */
+GeoExt.VectorLegend.supports = function(layerRecord) {
+    return layerRecord.getLayer() instanceof OpenLayers.Layer.Vector;
+};
+
+/** api: legendtype = gx_vectorlegend */
+GeoExt.LayerLegend.types["gx_vectorlegend"] = GeoExt.VectorLegend;
+
+/** api: xtype = gx_vectorlegend */
+Ext.reg("gx_vectorlegend", GeoExt.VectorLegend); 
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/FeatureRenderer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/FeatureRenderer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/FeatureRenderer.js	(revision 76)
@@ -0,0 +1,377 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = FeatureRenderer
+ *  base_link = `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_
+ */
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: FeatureRenderer(config)
+ *   
+ *      Create a box component for rendering a vector feature.
+ */
+GeoExt.FeatureRenderer = Ext.extend(Ext.BoxComponent, {
+
+    /** api: config[feature]
+     *  ``OpenLayers.Feature.Vector``
+     *  Optional vector to be drawn.  If not provided, and if ``symbolizers``
+     *  is configured with an array of plain symbolizer objects, ``symbolType``
+     *  should be configured.
+     */
+    feature: undefined,
+    
+    /** api: config[symbolizers]
+     *  ``Array(Object)``
+     *  An array of ``OpenLayers.Symbolizer`` instances or plain symbolizer
+     *  objects (in painters order) for rendering a  feature.  If no
+     *  symbolizers are provided, the OpenLayers default will be used. If a
+     *  symbolizer is an instance of ``OpenLayers.Symbolizer``, its type will
+     *  override the symbolType for rendering.
+     */
+    symbolizers: [OpenLayers.Feature.Vector.style["default"]],
+
+    /** api: config[symbolType]
+     *  ``String``
+     *  One of ``"Point"``, ``"Line"``, or ``"Polygon"``.  Only pertinent if 
+     *  OpenLayers.Symbolizer objects are not used.  If ``feature``
+     *  is provided, it will be preferred.  The default is "Polygon".
+     */
+    symbolType: "Polygon",
+    
+    /** private: property[resolution]
+     *  ``Number``
+     *  The resolution for the renderer.
+     */
+    resolution: 1,
+    
+    /** private: property[minWidth]
+     *  ``Number``
+     */
+    minWidth: 20,
+
+    /** private: property[minHeight]
+     *  ``Number``
+     */
+    minHeight: 20,
+
+    /** private: property[renderers]
+     * ``Array(String)`` 
+     *  List of supported Renderer classes. Add to this list to add support for 
+     *  additional renderers. The first renderer in the list that returns 
+     *  ``true`` for the ``supported`` method will be used, if not defined in 
+     *  the ``renderer`` config property.
+     */
+    renderers: ["SVG", "VML", "Canvas"],
+
+    /** private: property[rendererOptions]
+     *  ``Object``
+     *  Options for the renderer. See ``OpenLayers.Renderer`` for supported 
+     *  options.
+     */
+    rendererOptions: null,
+    
+    /** private: property[pointFeature]
+     *  ``OpenLayers.Feature.Vector``
+     *  Feature with point geometry.
+     */
+    pointFeature: undefined,
+    
+    /** private: property[lineFeature]
+     *  ``OpenLayers.Feature.Vector`` 
+     *  Feature with LineString geometry.  Default zig-zag is provided.
+     */
+    lineFeature: undefined,
+
+    /** private: property[polygonFeature]
+     *  ``OpenLayers.Feature.Vector``
+     *   Feature with Polygon geometry.  Default is a soft cornered rectangle.
+     */
+    polygonFeature: undefined,
+    
+    /** private: property[renderer]
+     *  ``OpenLayers.Renderer``
+     */
+    renderer: null,
+
+    /** private: method[initComponent]
+     */
+    initComponent: function() {
+        GeoExt.FeatureRenderer.superclass.initComponent.apply(this, arguments);
+        Ext.applyIf(this, {
+            pointFeature: new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Point(0, 0)
+            ),
+            lineFeature: new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.LineString([
+                    new OpenLayers.Geometry.Point(-8, -3),
+                    new OpenLayers.Geometry.Point(-3, 3),
+                    new OpenLayers.Geometry.Point(3, -3),
+                    new OpenLayers.Geometry.Point(8, 3)
+                ])
+            ),
+            polygonFeature: new OpenLayers.Feature.Vector(
+                new OpenLayers.Geometry.Polygon([
+                    new OpenLayers.Geometry.LinearRing([
+                        new OpenLayers.Geometry.Point(-8, -4),
+                        new OpenLayers.Geometry.Point(-6, -6),
+                        new OpenLayers.Geometry.Point(6, -6),
+                        new OpenLayers.Geometry.Point(8, -4),
+                        new OpenLayers.Geometry.Point(8, 4),
+                        new OpenLayers.Geometry.Point(6, 6),
+                        new OpenLayers.Geometry.Point(-6, 6),
+                        new OpenLayers.Geometry.Point(-8, 4)
+                    ])
+                ])
+            )
+        });
+        if(!this.feature) {
+            this.setFeature(null, {draw: false});
+        }
+        this.addEvents(
+            /** api: event[click]
+             *  Fires when the feature is clicked on.
+             *
+             *  Listener arguments:
+             *  
+             *  * renderer - :class:`GeoExt.FeatureRenderer` This feature renderer.
+             */
+            "click"
+        );
+    },
+
+    /** private: method[initCustomEvents]
+     */
+    initCustomEvents: function() {
+        this.clearCustomEvents();
+        this.el.on("click", this.onClick, this);
+    },
+    
+    /** private: method[clearCustomEvents]
+     */
+    clearCustomEvents: function() {
+        if (this.el && this.el.removeAllListeners) {
+            this.el.removeAllListeners();            
+        }
+    },
+    
+    /** private: method[onClick]
+     */
+    onClick: function() {
+        this.fireEvent("click", this);
+    },
+
+    /** private: method[onRender]
+     */
+    onRender: function(ct, position) {
+        if(!this.el) {
+            this.el = document.createElement("div");
+            this.el.id = this.getId();
+        }
+        if(!this.renderer || !this.renderer.supported()) {  
+            this.assignRenderer();
+        }
+        // monkey-patch renderer so we always get a resolution
+        this.renderer.map = {
+            getResolution: (function() {
+                return this.resolution;
+            }).createDelegate(this)
+        };
+        
+        GeoExt.FeatureRenderer.superclass.onRender.apply(this, arguments);
+
+        this.drawFeature();
+    },
+
+    /** private: method[afterRender]
+     */
+    afterRender: function() {
+        GeoExt.FeatureRenderer.superclass.afterRender.apply(this, arguments);
+        this.initCustomEvents();
+    },
+
+    /** private: method[onResize]
+     */
+    onResize: function(w, h) {
+        this.setRendererDimensions();
+        GeoExt.FeatureRenderer.superclass.onResize.apply(this, arguments);
+    },
+    
+    /** private: method[setRendererDimensions]
+     */
+    setRendererDimensions: function() {
+        var gb = this.feature.geometry.getBounds();
+        var gw = gb.getWidth();
+        var gh = gb.getHeight();
+        /**
+         * Determine resolution based on the following rules:
+         * 1) always use value specified in config
+         * 2) if not specified, use max res based on width or height of element
+         * 3) if no width or height, assume a resolution of 1
+         */
+        var resolution = this.initialConfig.resolution;
+        if(!resolution) {
+            resolution = Math.max(gw / this.width || 0, gh / this.height || 0) || 1;
+        }
+        this.resolution = resolution;
+        // determine height and width of element
+        var width = Math.max(this.width || this.minWidth, gw / resolution);
+        var height = Math.max(this.height || this.minHeight, gh / resolution);
+        // determine bounds of renderer
+        var center = gb.getCenterPixel();
+        var bhalfw = width * resolution / 2;
+        var bhalfh = height * resolution / 2;
+        var bounds = new OpenLayers.Bounds(
+            center.x - bhalfw, center.y - bhalfh,
+            center.x + bhalfw, center.y + bhalfh
+        );
+        this.renderer.setSize(new OpenLayers.Size(Math.round(width), Math.round(height)));
+        this.renderer.setExtent(bounds, true);
+    },
+
+    /** private: method[assignRenderer]
+     *  Iterate through the available renderer implementations and selects 
+     *  and assign the first one whose ``supported`` method returns ``true``.
+     */
+    assignRenderer: function()  {
+        for(var i=0, len=this.renderers.length; i<len; ++i) {
+            var Renderer = OpenLayers.Renderer[this.renderers[i]];
+            if(Renderer && Renderer.prototype.supported()) {
+                this.renderer = new Renderer(
+                    this.el, this.rendererOptions
+                );
+                break;
+            }  
+        }  
+    },
+    
+    /** api: method[setSymbolizers]
+     *  :arg symbolizers: ``Array(Object)`` An array of symbolizers
+     *  :arg options: ``Object``
+     *
+     *  Update the symbolizers used to render the feature.
+     *
+     *  Valid options:
+     *  
+     *  * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+     */
+    setSymbolizers: function(symbolizers, options) {
+        this.symbolizers = symbolizers;
+        if(!options || options.draw) {
+            this.drawFeature();
+        }
+    },
+    
+    /** api: method[setSymbolType]
+     *  :arg type: ``String`` One of the ``symbolType`` strings.
+     *  :arg options: ``Object``
+     * 
+     *  Create a new feature based on the geometry type and render it.
+     *
+     *  Valid options:
+     *  
+     *  * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+     */
+    setSymbolType: function(type, options) {
+        this.symbolType = type;
+        this.setFeature(null, options);
+    },
+    
+    /** api: method[setFeature]
+     *  :arg feature: ``OpenLayers.Feature.Vector`` The feature to be rendered.  
+     *      If none is provided, one will be created based on ``symbolType``.
+     *  :arg options: ``Object``
+     *
+     *  Update the feature and redraw.
+     *
+     *  Valid options:
+     *  
+     *  * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+     */
+    setFeature: function(feature, options) {
+        this.feature = feature || this[this.symbolType.toLowerCase() + "Feature"];
+        if(!options || options.draw) {
+            this.drawFeature();
+        }
+    },
+
+    /** private: method[drawFeature]
+     *  Render the feature with the symbolizers.
+     */
+    drawFeature: function() {
+        this.renderer.clear();
+        this.setRendererDimensions();
+        // TODO: remove this when OpenLayers.Symbolizer is required
+        var Symbolizer = OpenLayers.Symbolizer;
+        var Text = Symbolizer && Symbolizer.Text;
+        var symbolizer, feature, geomType;
+        for (var i=0, len=this.symbolizers.length; i<len; ++i) {
+            symbolizer = this.symbolizers[i];
+            feature = this.feature;
+            // don't render text symbolizers
+            if (!Text || !(symbolizer instanceof Text)) {
+                if (Symbolizer && (symbolizer instanceof Symbolizer)) {
+                    symbolizer = symbolizer.clone();
+                    if (!this.initialConfig.feature) {
+                        geomType = symbolizer.CLASS_NAME.split(".").pop().toLowerCase();
+                        feature = this[geomType + "Feature"];
+                    }
+                } else {
+                    // TODO: remove this when OpenLayers.Symbolizer is used everywhere
+                    symbolizer = Ext.apply({}, symbolizer);
+                }
+                this.renderer.drawFeature(
+                    feature.clone(),
+                    symbolizer
+                );
+            }
+        }
+    },
+    
+    /** api: method[update]
+     *  :arg options: ``Object`` Object with properties to be updated.
+     * 
+     *  Update the ``symbolType`` or ``feature`` and ``symbolizer`` and redraw
+     *  the feature.
+     *
+     *  Valid options:
+     *  
+     *  * feature - ``OpenLayers.Feature.Vector`` The new or updated feature.  
+     *      If provided, the feature gets precedence over ``symbolType``.
+     *  * symbolType - ``String`` One of the allowed ``symbolType`` values.
+     *  * symbolizers - ``Array(Object)`` An array of symbolizer objects.
+     */
+    update: function(options) {
+        options = options || {};
+        if(options.feature) {
+            this.setFeature(options.feature, {draw: false});
+        } else if(options.symbolType) {
+            this.setSymbolType(options.symbolType, {draw: false});
+        }
+        if(options.symbolizers) {
+            this.setSymbolizers(options.symbolizers, {draw: false});
+        }
+        this.drawFeature();
+    },
+
+    /** private: method[beforeDestroy]
+     *  Private method called during the destroy sequence.
+     */
+    beforeDestroy: function() {
+        this.clearCustomEvents();
+        if (this.renderer) {
+            this.renderer.destroy();
+        }
+    }
+    
+});
+
+/** api: xtype = gx_renderer */
+Ext.reg('gx_renderer', GeoExt.FeatureRenderer);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamLoader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamLoader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamLoader.js	(revision 76)
@@ -0,0 +1,152 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = LayerParamLoader
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: constructor
+ *  .. class:: LayerParamLoader
+ * 
+ *      A loader that creates children from its node's layer
+ *      (``OpenLayers.Layer.HTTPRequest``) by items in one of the values in
+ *      the layer's params object.
+ */
+GeoExt.tree.LayerParamLoader = function(config) {
+    Ext.apply(this, config);
+    this.addEvents(
+    
+        /** api: event[beforeload]
+         *  Triggered before loading children. Return false to avoid
+         *  loading children.
+         *  
+         *  Listener arguments:
+         *  
+         *  * loader - :class:`GeoExt.tree.LayerLoader` this loader
+         *  * node - ``Ex.tree.TreeNode`` the node that this loader is
+         *      configured with
+         */
+        "beforeload",
+        
+        /** api: event[load]
+         *  Triggered after children were loaded.
+         *  
+         *  Listener arguments:
+         *  
+         *  * loader - :class:`GeoExt.tree.LayerLoader` this loader
+         *  * node - ``Ex.tree.TreeNode`` the node that this loader is
+         *      configured with
+         */
+        "load"
+    );
+
+    GeoExt.tree.LayerParamLoader.superclass.constructor.call(this);
+};
+
+Ext.extend(GeoExt.tree.LayerParamLoader, Ext.util.Observable, {
+    
+    /** api: config[param]
+     *  ``String`` Key for a param (key-value pair in the params object of the
+     *  layer) that this loader uses to create childnodes from its items. The
+     *  value can either be an ``Array`` or a ``String``, delimited by the
+     *  character (or string) provided as ``delimiter`` config option.
+     */
+    
+    /** private: property[param]
+     *  ``String``
+     */
+    param: null,
+    
+    /** api: config[delimiter]
+     *  ``String`` Delimiter of the ``param``'s value's items. Default is
+     *  ``,`` (comma). If the ``param``'s value is an array, this property has
+     *  no effect.
+     */
+    
+    /** private: property[delimiter]
+     *  ``String``
+     */
+    delimiter: ",",
+
+    /** private: method[load]
+     *  :param node: ``Ext.tree.TreeNode`` The node to add children to.
+     *  :param callback: ``Function``
+     */
+    load: function(node, callback) {
+        if(this.fireEvent("beforeload", this, node)) {
+            while (node.firstChild) {
+                node.removeChild(node.firstChild);
+            }
+            
+            var paramValue =
+                (node.layer instanceof OpenLayers.Layer.HTTPRequest) &&
+                node.layer.params[this.param];
+            if(paramValue) {
+                var items = (paramValue instanceof Array) ?
+                    paramValue.slice() :
+                    paramValue.split(this.delimiter);
+
+                Ext.each(items, function(item, index, allItems) {
+                    this.addParamNode(item, allItems, node);
+                }, this);
+            }
+    
+            if(typeof callback == "function"){
+                callback();
+            }
+            
+            this.fireEvent("load", this, node);
+        }
+    },
+    
+    /** private: method[addParamNode]
+     *  :param paramItem: ``String`` The param item that the child node will
+     *      represent.
+     *  :param allParamItems: ``Array`` The full list of param items.
+     *  :param node: :class:`GeoExt.tree.LayerNode`` The node that the param
+     *      node will be added to as child.
+     *  
+     *  Adds a child node representing a param value of the layer
+     */
+    addParamNode: function(paramItem, allParamItems, node) {
+        var child = this.createNode({
+            layer: node.layer,
+            param: this.param,
+            item: paramItem,
+            allItems: allParamItems,
+            delimiter: this.delimiter
+        });
+        var sibling = node.item(0);
+        if(sibling) {
+            node.insertBefore(child, sibling);
+        } else {
+            node.appendChild(child);
+        }
+    },
+
+    /** api: method[createNode]
+     *  :param attr: ``Object`` attributes for the new node
+     *
+     *  Override this function for custom TreeNode node implementation, or to
+     *  modify the attributes at creation time.
+     */
+    createNode: function(attr){
+        if(this.baseAttrs){
+            Ext.apply(attr, this.baseAttrs);
+        }
+        if(typeof attr.uiProvider == 'string'){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        attr.nodeType = attr.nodeType || "gx_layerparam";
+
+        return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.js	(revision 76)
@@ -0,0 +1,132 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = WMSCapabilitiesLoader
+ *  base_link = `Ext.tree.TreeLoader <http://www.dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeLoader>`_
+ */
+
+/** api: constructor
+ *  .. class:: WMSCapabilitiesLoader
+ *
+ *      A loader that will load create a tree of all layers of a Web Map
+ *      Service (WMS), maintaining its tree structure. Nodes created by this
+ *      loader are instances of ``Ext.tree.TreeNode``. If the WMS Capabilities
+ *      advertise a name for a layer, an OpenLayers.Layer.WMS instance will
+ *      be set on the node in its ``layer`` attribute.
+ */
+GeoExt.tree.WMSCapabilitiesLoader = function(config) {
+    Ext.apply(this, config);
+    GeoExt.tree.WMSCapabilitiesLoader.superclass.constructor.call(this);
+};
+
+Ext.extend(GeoExt.tree.WMSCapabilitiesLoader, Ext.tree.TreeLoader, {
+
+    /** api: config[url]
+     *  ``String``
+     *  The online resource of the Web Map Service.
+     */
+    url: null,
+
+    /** api: config[layerOptions]
+     *  ``Object``
+     *  Optional options to set on the WMS layers which will be created by
+     *  this loader.
+     */
+    layerOptions: null,
+
+    /** api: config[layerParams]
+     *  ``Object``
+     *  Optional parameters to set on the WMS layers which will be created by
+     *  this loader.
+     */
+    layerParams: null,
+
+    /** private: property[requestMethod]
+     *  ``String`` WMS GetCapabilities request needs to be done using HTTP GET
+     */
+    requestMethod: 'GET',
+
+    /** private: method[getParams]
+     *  Private getParams override.
+     */
+    getParams: function(node) {
+        return {'service': 'WMS', 'request': 'GetCapabilities'};
+    },
+
+    /** private: method[processResponse]
+     *  :param response: ``Object`` The XHR object
+     *  :param node: ``Ext.tree.TreeNode``
+     *  :param callback: ``Function``
+     *  :param scope: ``Object``
+     *
+     *  Private processResponse override.
+     */
+    processResponse : function(response, node, callback, scope){
+        var capabilities = new OpenLayers.Format.WMSCapabilities().read(
+            response.responseXML || response.responseText);
+        this.processLayer(capabilities.capability,
+            capabilities.capability.request.getmap.href, node);
+        if (typeof callback == "function") {
+            callback.apply(scope || node, [node]);
+        }
+    },
+
+    /** private: method[createWMSLayer]
+     *  :param layer: ``Object`` The layer object from the WMS GetCapabilities
+     *  parser
+     *  :param url: ``String`` The online resource of the WMS
+     *  :return: ``OpenLayers.Layer.WMS`` or ``null`` The WMS layer created or
+     *  null.
+     *
+     *  Create a WMS layer which will be attached as an attribute to the
+     *  node.
+     */
+    createWMSLayer: function(layer, url) {
+        if (layer.name) {
+            return new OpenLayers.Layer.WMS( layer.title, url,
+                OpenLayers.Util.extend({formats: layer.formats[0], 
+                    layers: layer.name}, this.layerParams),
+                OpenLayers.Util.extend({minScale: layer.minScale,
+                    queryable: layer.queryable, maxScale: layer.maxScale,
+                    metadata: layer
+                }, this.layerOptions));
+        } else {
+            return null;
+        }
+    },
+
+    /** private: method[processLayer]
+     *  :param layer: ``Object`` The layer object from the WMS GetCapabilities
+     *  parser
+     *  :param url: ``String`` The online resource of the WMS
+     *  :param node: ``Ext.tree.TreeNode``
+     *
+     *  Recursive function to create the tree nodes for the layer structure
+     *  of a WMS GetCapabilities response.
+     */
+    processLayer: function(layer, url, node) {
+        Ext.each(layer.nestedLayers, function(el) {
+            var n = this.createNode({text: el.title || el.name, 
+                // use nodeType 'node' so no AsyncTreeNodes are created
+                nodeType: 'node',
+                layer: this.createWMSLayer(el, url),
+                leaf: (el.nestedLayers.length === 0)});
+            if(n){
+                node.appendChild(n);
+            }
+            if (el.nestedLayers) {
+                this.processLayer(el, url, n);
+            }
+        }, this);
+    }
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/BaseLayerContainer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/BaseLayerContainer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/BaseLayerContainer.js	(revision 76)
@@ -0,0 +1,66 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @requires GeoExt/widgets/tree/LayerContainer.js
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = BaseLayerContainer
+ */
+
+/** api: (extends)
+ * GeoExt/widgets/tree/LayerContainer.js
+ */
+
+/** api: constructor
+ *  .. class:: BaseLayerContainer
+ * 
+ *     A layer container that will collect all base layers of an OpenLayers
+ *     map. Only layers that have displayInLayerSwitcher set to true will be
+ *     included. The childrens' iconCls defaults to "gx-tree-baselayer-icon".
+ *     
+ *     Children will be rendered with a radio button instead of a checkbox,
+ *     showing the user that only one base layer can be active at a time.
+ * 
+ *     To use this node type in ``TreePanel`` config, set nodeType to
+ *     "gx_baselayercontainer".
+ */
+GeoExt.tree.BaseLayerContainer = Ext.extend(GeoExt.tree.LayerContainer, {
+
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        config = Ext.applyIf(config || {}, {
+            text: "Base Layer",
+            loader: {}
+        });
+        config.loader = Ext.applyIf(config.loader, {
+            baseAttrs: Ext.applyIf(config.loader.baseAttrs || {}, {
+                iconCls: 'gx-tree-baselayer-icon',
+                checkedGroup: 'baselayer'
+            }),
+            filter: function(record) {
+                var layer = record.getLayer();
+                return layer.displayInLayerSwitcher === true &&
+                    layer.isBaseLayer === true;
+            }
+        });
+
+        GeoExt.tree.BaseLayerContainer.superclass.constructor.call(this,
+            config);
+    }
+});
+
+/**
+ * NodeType: gx_baselayercontainer
+ */
+Ext.tree.TreePanel.nodeTypes.gx_baselayercontainer = GeoExt.tree.BaseLayerContainer;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.js	(revision 76)
@@ -0,0 +1,91 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = TreeNodeUIEventMixin
+ */
+
+/** api: constructor
+ *  A mixin that adds events to TreeNodeUIs. With these events, tree plugins
+ *  can modify the node ui's DOM when it is rendered, and react to raw click
+ *  events on tree nodes.
+ */
+
+ /** api: example
+  *  Sample code to create a tree with a node that uses the
+  *  :class:`GeoExt.tree.TreeNodeUIEventMixin`:
+  *
+  *  .. code-block:: javascript
+  *
+  *      var UIClass = Ext.extend(
+  *          Ext.tree.TreeNodeUI,
+  *          GeoExt.tree.TreeNodeUIEventMixin
+  *      );
+  *      var tree = new Ext.tree.TreePanel({
+  *          root: {
+  *              nodeType: "node",
+  *              uiProvider: UIClass,
+  *              text: "My Node"
+  *          }
+  *      }
+  */
+
+GeoExt.tree.TreeNodeUIEventMixin = function(){
+    return {
+        
+        constructor: function(node) {
+            
+            node.addEvents(
+
+                /** api: event[rendernode]
+                 *  Fires on the tree when a node is rendered.
+                 *
+                 *  Listener arguments:
+                 *  
+                 *  * node - ``Ext.TreeNode`` The rendered node.
+                 */
+                "rendernode",
+
+                /** api: event[rawclicknode]
+                 *  Fires on the tree when a node is clicked.
+                 *
+                 *  Listener arguments:
+                 *  
+                 *  * node - ``Ext.TreeNode`` The clicked node.
+                 *  * event - ``Ext.EventObject`` The click event.
+                 */
+                "rawclicknode"
+            );
+            this.superclass = arguments.callee.superclass;
+            this.superclass.constructor.apply(this, arguments);
+            
+        },
+        
+        /** private: method[render]
+         *  :param bulkRender: ``Boolean``
+         */
+        render: function(bulkRender) {
+            if(!this.rendered) {
+                this.superclass.render.apply(this, arguments);
+                this.fireEvent("rendernode", this.node);
+            }
+        },
+        
+        /** private: method[onClick]
+         *  :param e: ``Ext.EventObject``
+         */
+        onClick: function(e) {
+            if(this.fireEvent("rawclicknode", this.node, e) !== false) {
+                this.superclass.onClick.apply(this, arguments);
+            }
+        }
+    }
+};
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerContainer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerContainer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerContainer.js	(revision 76)
@@ -0,0 +1,100 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/tree/LayerLoader.js
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = LayerContainer
+ *  base_link = `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_
+ */
+
+/** api: constructor
+ *  .. class:: LayerContainer
+ * 
+ *      A subclass of ``Ext.tree.AsyncTreeNode`` that will collect all layers of an
+ *      OpenLayers map. Only layers that have displayInLayerSwitcher set to true
+ *      will be included. The childrens' iconCls defaults to
+ *      "gx-tree-layer-icon".
+ *      
+ *      Note: if this container is loaded by an ``Ext.tree.TreeLoader``, the
+ *      ``applyLoader`` config option of that loader needs to be set to
+ *      "false". Also note that the list of available uiProviders will be
+ *      taken from the ownerTree if this container's loader is configured
+ *      without one.
+ * 
+ *      To use this node type in ``TreePanel`` config, set nodeType to
+ *      "gx_layercontainer".
+ */
+GeoExt.tree.LayerContainer = Ext.extend(Ext.tree.AsyncTreeNode, {
+    
+    /** api: config[loader]
+     *  :class:`GeoExt.tree.LayerLoader` or ``Object`` The loader to use with
+     *  this container. If an ``Object`` is provided, a
+     *  :class:`GeoExt.tree.LayerLoader`, configured with the the properties
+     *  from the provided object, will be created. 
+     */
+    
+    /** api: config[layerStore]
+     *  :class:`GeoExt.data.LayerStore` The layer store containing layers to be
+     *  displayed in the container. If loader is not provided or provided as
+     *  ``Object``, this property will be set as the store option of the
+     *  loader. Otherwise it will be ignored.
+     */
+    
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        config = Ext.applyIf(config || {}, {
+            text: "Layers"
+        });
+        this.loader = config.loader instanceof GeoExt.tree.LayerLoader ?
+            config.loader :
+            new GeoExt.tree.LayerLoader(Ext.applyIf(config.loader || {}, {
+                store: config.layerStore
+            }));
+        
+        GeoExt.tree.LayerContainer.superclass.constructor.call(this, config);
+    },
+    
+    /** private: method[recordIndexToNodeIndex]
+     *  :param index: ``Number`` The record index in the layer store.
+     *  :return: ``Number`` The appropriate child node index for the record.
+     */
+    recordIndexToNodeIndex: function(index) {
+        var store = this.loader.store;
+        var count = store.getCount();
+        var nodeCount = this.childNodes.length;
+        var nodeIndex = -1;
+        for(var i=count-1; i>=0; --i) {
+            if(this.loader.filter(store.getAt(i)) === true) {
+                ++nodeIndex;
+                if(index === i || nodeIndex > nodeCount-1) {
+                    break;
+                }
+            }
+        }
+        return nodeIndex;
+    },
+    
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        delete this.layerStore;
+        GeoExt.tree.LayerContainer.superclass.destroy.apply(this, arguments);
+    }
+});
+    
+/**
+ * NodeType: gx_layercontainer
+ */
+Ext.tree.TreePanel.nodeTypes.gx_layercontainer = GeoExt.tree.LayerContainer;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/OverlayLayerContainer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/OverlayLayerContainer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/OverlayLayerContainer.js	(revision 76)
@@ -0,0 +1,58 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @requires GeoExt/widgets/tree/LayerContainer.js
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = OverlayLayerContainer
+ */
+
+/** api: (extends)
+ * GeoExt/widgets/tree/LayerContainer.js
+ */
+
+/** api: constructor
+ * .. class:: OverlayLayerContainer
+ * 
+ *     A layer container that will collect all overlay layers of an OpenLayers
+ *     map. Only layers that have displayInLayerSwitcher set to true will be
+ *     included.
+ * 
+ *     To use this node type in ``TreePanel`` config, set nodeType to
+ *     "gx_overlaylayercontainer".
+ */
+GeoExt.tree.OverlayLayerContainer = Ext.extend(GeoExt.tree.LayerContainer, {
+
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        config = Ext.applyIf(config || {}, {
+            text: "Overlays"
+        });
+        config.loader = Ext.applyIf(config.loader || {}, {
+            filter: function(record){
+                var layer = record.getLayer();
+                return layer.displayInLayerSwitcher === true &&
+                layer.isBaseLayer === false;
+            }
+        });
+        
+        GeoExt.tree.OverlayLayerContainer.superclass.constructor.call(this,
+            config);
+    }
+});
+
+/**
+ * NodeType: gx_overlaylayercontainer
+ */
+Ext.tree.TreePanel.nodeTypes.gx_overlaylayercontainer = GeoExt.tree.OverlayLayerContainer;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerNode.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerNode.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerNode.js	(revision 76)
@@ -0,0 +1,389 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt.tree");
+
+/** private: constructor
+ *  .. class:: LayerNodeUI
+ *
+ *      Place in a separate file if this should be documented.
+ */
+GeoExt.tree.LayerNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
+    
+    /** private: method[constructor]
+     */
+    constructor: function(config) {
+        GeoExt.tree.LayerNodeUI.superclass.constructor.apply(this, arguments);
+    },
+    
+    /** private: method[render]
+     *  :param bulkRender: ``Boolean``
+     */
+    render: function(bulkRender) {
+        var a = this.node.attributes;
+        if (a.checked === undefined) {
+            a.checked = this.node.layer.getVisibility();
+        }
+        GeoExt.tree.LayerNodeUI.superclass.render.apply(this, arguments);
+        var cb = this.checkbox;
+        if(a.checkedGroup) {
+            // replace the checkbox with a radio button
+            var radio = Ext.DomHelper.insertAfter(cb,
+                ['<input type="radio" name="', a.checkedGroup,
+                '_checkbox" class="', cb.className,
+                cb.checked ? '" checked="checked"' : '',
+                '"></input>'].join(""));
+            radio.defaultChecked = cb.defaultChecked;
+            Ext.get(cb).remove();
+            this.checkbox = radio;
+        }
+        this.enforceOneVisible();
+    },
+    
+    /** private: method[onClick]
+     *  :param e: ``Object``
+     */
+    onClick: function(e) {
+        if(e.getTarget('.x-tree-node-cb', 1)) {
+            this.toggleCheck(this.isChecked());
+        } else {
+            GeoExt.tree.LayerNodeUI.superclass.onClick.apply(this, arguments);
+        }
+    },
+    
+    /** private: method[toggleCheck]
+     * :param value: ``Boolean``
+     */
+    toggleCheck: function(value) {
+        value = (value === undefined ? !this.isChecked() : value);
+        GeoExt.tree.LayerNodeUI.superclass.toggleCheck.call(this, value);
+        
+        this.enforceOneVisible();
+    },
+    
+    /** private: method[enforceOneVisible]
+     * 
+     *  Makes sure that only one layer is visible if checkedGroup is set.
+     */
+    enforceOneVisible: function() {
+        var attributes = this.node.attributes;
+        var group = attributes.checkedGroup;
+        // If we are in the baselayer group, the map will take care of
+        // enforcing visibility.
+        if(group && group !== "gx_baselayer") {
+            var layer = this.node.layer;
+            var checkedNodes = this.node.getOwnerTree().getChecked();
+            var checkedCount = 0;
+            // enforce "not more than one visible"
+            Ext.each(checkedNodes, function(n){
+                var l = n.layer
+                if(!n.hidden && n.attributes.checkedGroup === group) {
+                    checkedCount++;
+                    if(l != layer && attributes.checked) {
+                        l.setVisibility(false);
+                    }
+                }
+            });
+            // enforce "at least one visible"
+            if(checkedCount === 0 && attributes.checked == false) {
+                layer.setVisibility(true);
+            }
+        }
+    },
+    
+    /** private: method[appendDDGhost]
+     *  :param ghostNode ``DOMElement``
+     *  
+     *  For radio buttons, makes sure that we do not use the option group of
+     *  the original, otherwise only the original or the clone can be checked 
+     */
+    appendDDGhost : function(ghostNode){
+        var n = this.elNode.cloneNode(true);
+        var radio = Ext.DomQuery.select("input[type='radio']", n);
+        Ext.each(radio, function(r) {
+            r.name = r.name + "_clone";
+        });
+        ghostNode.appendChild(n);
+    }
+});
+
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = LayerNode
+ *  base_link = `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_
+ */
+
+/** api: constructor
+ *  .. class:: LayerNode(config)
+ * 
+ *      A subclass of ``Ext.tree.TreeNode`` that is connected to an
+ *      ``OpenLayers.Layer`` by setting the node's layer property. Checking or
+ *      unchecking the checkbox of this node will directly affect the layer and
+ *      vice versa. The default iconCls for this node's icon is
+ *      "gx-tree-layer-icon", unless it has children.
+ * 
+ *      Setting the node's layer property to a layer name instead of an object
+ *      will also work. As soon as a layer is found, it will be stored as layer
+ *      property in the attributes hash.
+ * 
+ *      The node's text property defaults to the layer name.
+ *      
+ *      If the node has a checkedGroup attribute configured, it will be
+ *      rendered with a radio button instead of the checkbox. The value of
+ *      the checkedGroup attribute is a string, identifying the options group
+ *      for the node.
+ * 
+ *      To use this node type in a ``TreePanel`` config, set ``nodeType`` to
+ *      "gx_layer".
+ */
+GeoExt.tree.LayerNode = Ext.extend(Ext.tree.AsyncTreeNode, {
+    
+    /** api: config[layer]
+     *  ``OpenLayers.Layer or String``
+     *  The layer that this layer node will
+     *  be bound to, or the name of the layer (has to match the layer's
+     *  name property). If a layer name is provided, ``layerStore`` also has
+     *  to be provided.
+     */
+
+    /** api: property[layer]
+     *  ``OpenLayers.Layer``
+     *  The layer this node is bound to.
+     */
+    layer: null,
+    
+    /** api: config[layerStore]
+     *  :class:`GeoExt.data.LayerStore` ``or "auto"``
+     *  The layer store containing the layer that this node represents.  If set
+     *  to "auto", the node will query the ComponentManager for a
+     *  :class:`GeoExt.MapPanel`, take the first one it finds and take its layer
+     *  store. This property is only required if ``layer`` is provided as a
+     *  string.
+     */
+    layerStore: null,
+    
+    /** api: config[loader]
+     *  ``Ext.tree.TreeLoader|Object`` If provided, subnodes will be added to
+     *  this LayerNode. Obviously, only loaders that process an
+     *  ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord` (like
+     *  :class:`GeoExt.tree.LayerParamsLoader`) will actually generate child
+     *  nodes here. If provided as ``Object``, a
+     *  :class:`GeoExt.tree.LayerParamLoader` instance will be created, with
+     *  the provided object as configuration.
+     */
+    
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        config.leaf = config.leaf || !(config.children || config.loader);
+        
+        if(!config.iconCls && !config.children) {
+            config.iconCls = "gx-tree-layer-icon";
+        }
+        if(config.loader && !(config.loader instanceof Ext.tree.TreeLoader)) {
+            config.loader = new GeoExt.tree.LayerParamLoader(config.loader);
+        }
+        
+        this.defaultUI = this.defaultUI || GeoExt.tree.LayerNodeUI;
+        
+        Ext.apply(this, {
+            layer: config.layer,
+            layerStore: config.layerStore
+        });
+        if (config.text) {
+            this.fixedText = true;
+        }
+        GeoExt.tree.LayerNode.superclass.constructor.apply(this, arguments);
+    },
+
+    /** private: method[render]
+     *  :param bulkRender: ``Boolean``
+     */
+    render: function(bulkRender) {
+        var layer = this.layer instanceof OpenLayers.Layer && this.layer;
+        if(!layer) {
+            // guess the store if not provided
+            if(!this.layerStore || this.layerStore == "auto") {
+                this.layerStore = GeoExt.MapPanel.guess().layers;
+            }
+            // now we try to find the layer by its name in the layer store
+            var i = this.layerStore.findBy(function(o) {
+                return o.get("title") == this.layer;
+            }, this);
+            if(i != -1) {
+                // if we found the layer, we can assign it and everything
+                // will be fine
+                layer = this.layerStore.getAt(i).getLayer();
+            }
+        }
+        if (!this.rendered || !layer) {
+            var ui = this.getUI();
+            
+            if(layer) {
+                this.layer = layer;
+                // no DD and radio buttons for base layers
+                if(layer.isBaseLayer) {
+                    this.draggable = false;
+                    Ext.applyIf(this.attributes, {
+                        checkedGroup: "gx_baselayer"
+                    });
+                }
+                if(!this.text) {
+                    this.text = layer.name;
+                }
+                
+                ui.show();
+                this.addVisibilityEventHandlers();
+            } else {
+                ui.hide();
+            }
+            
+            if(this.layerStore instanceof GeoExt.data.LayerStore) {
+                this.addStoreEventHandlers(layer);
+            }            
+        }
+        GeoExt.tree.LayerNode.superclass.render.apply(this, arguments);
+    },
+    
+    /** private: method[addVisibilityHandlers]
+     *  Adds handlers that sync the checkbox state with the layer's visibility
+     *  state
+     */
+    addVisibilityEventHandlers: function() {
+        this.layer.events.on({
+            "visibilitychanged": this.onLayerVisibilityChanged,
+            scope: this
+        }); 
+        this.on({
+            "checkchange": this.onCheckChange,
+            scope: this
+        });
+    },
+    
+    /** private: method[onLayerVisiilityChanged
+     *  handler for visibilitychanged events on the layer
+     */
+    onLayerVisibilityChanged: function() {
+        if(!this._visibilityChanging) {
+            this.getUI().toggleCheck(this.layer.getVisibility());
+        }
+    },
+    
+    /** private: method[onCheckChange]
+     *  :param node: ``GeoExt.tree.LayerNode``
+     *  :param checked: ``Boolean``
+     *
+     *  handler for checkchange events 
+     */
+    onCheckChange: function(node, checked) {
+        if(checked != this.layer.getVisibility()) {
+            this._visibilityChanging = true;
+            var layer = this.layer;
+            if(checked && layer.isBaseLayer && layer.map) {
+                layer.map.setBaseLayer(layer);
+            } else {
+                layer.setVisibility(checked);
+            }
+            delete this._visibilityChanging;
+        }
+    },
+    
+    /** private: method[addStoreEventHandlers]
+     *  Adds handlers that make sure the node disappeares when the layer is
+     *  removed from the store, and appears when it is re-added.
+     */
+    addStoreEventHandlers: function() {
+        this.layerStore.on({
+            "add": this.onStoreAdd,
+            "remove": this.onStoreRemove,
+            "update": this.onStoreUpdate,
+            scope: this
+        });
+    },
+    
+    /** private: method[onStoreAdd]
+     *  :param store: ``Ext.data.Store``
+     *  :param records: ``Array(Ext.data.Record)``
+     *  :param index: ``Number``
+     *
+     *  handler for add events on the store 
+     */
+    onStoreAdd: function(store, records, index) {
+        var l;
+        for(var i=0; i<records.length; ++i) {
+            l = records[i].getLayer();
+            if(this.layer == l) {
+                this.getUI().show();
+                break;
+            } else if (this.layer == l.name) {
+                // layer is a string, which means the node has not yet
+                // been rendered because the layer was not found. But
+                // now we have the layer and can render.
+                this.render();
+                break;
+            }
+        }
+    },
+    
+    /** private: method[onStoreRemove]
+     *  :param store: ``Ext.data.Store``
+     *  :param record: ``Ext.data.Record``
+     *  :param index: ``Number``
+     *
+     *  handler for remove events on the store 
+     */
+    onStoreRemove: function(store, record, index) {
+        if(this.layer == record.getLayer()) {
+            this.getUI().hide();
+        }
+    },
+
+    /** private: method[onStoreUpdate]
+     *  :param store: ``Ext.data.Store``
+     *  :param record: ``Ext.data.Record``
+     *  :param operation: ``String``
+     *  
+     *  Listener for the store's update event.
+     */
+    onStoreUpdate: function(store, record, operation) {
+        var layer = record.getLayer();
+        if(!this.fixedText && (this.layer == layer && this.text !== layer.name)) {
+            this.setText(layer.name);
+        }
+    },
+
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        var layer = this.layer;
+        if (layer instanceof OpenLayers.Layer) {
+            layer.events.un({
+                "visibilitychanged": this.onLayerVisibilityChanged,
+                scope: this
+            });
+        }
+        delete this.layer;
+        var layerStore = this.layerStore;
+        if(layerStore) {
+            layerStore.un("add", this.onStoreAdd, this);
+            layerStore.un("remove", this.onStoreRemove, this);
+            layerStore.un("update", this.onStoreUpdate, this);
+        }
+        delete this.layerStore;
+        this.un("checkchange", this.onCheckChange, this);
+
+        GeoExt.tree.LayerNode.superclass.destroy.apply(this, arguments);
+    }
+});
+
+/**
+ * NodeType: gx_layer
+ */
+Ext.tree.TreePanel.nodeTypes.gx_layer = GeoExt.tree.LayerNode;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerLoader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerLoader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerLoader.js	(revision 76)
@@ -0,0 +1,326 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/tree/LayerNode.js
+ * @include GeoExt/widgets/tree/LayerContainer.js
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = LayerLoader
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: constructor
+ *  .. class:: LayerLoader
+ * 
+ *      A loader that will load all layers of a :class:`GeoExt.data.LayerStore`
+ *      By default, only layers that have displayInLayerSwitcher set to true
+ *      will be included. The childrens' iconCls defaults to
+ *      "gx-tree-layer-icon".
+ */
+GeoExt.tree.LayerLoader = function(config) {
+    Ext.apply(this, config);
+    this.addEvents(
+    
+        /** api: event[beforeload]
+         *  Triggered before loading children. Return false to avoid
+         *  loading children.
+         *  
+         *  Listener arguments:
+         *  
+         *  * loader - :class:`GeoExt.tree.LayerLoader` this loader
+         *  * node - ``Ex.tree.TreeNode`` the node that this loader is
+         *      configured with
+         */
+        "beforeload",
+        
+        /** api: event[load]
+         *  Triggered after children wer loaded.
+         *  
+         *  Listener arguments:
+         *  
+         *  * loader - :class:`GeoExt.tree.LayerLoader` this loader
+         *  * node - ``Ex.tree.TreeNode`` the node that this loader is
+         *      configured with
+         */
+        "load"
+    );
+
+    GeoExt.tree.LayerLoader.superclass.constructor.call(this);
+};
+
+Ext.extend(GeoExt.tree.LayerLoader, Ext.util.Observable, {
+
+    /** api: config[store]
+     *  :class:`GeoExt.data.LayerStore`
+     *  The layer store containing layers to be added by this loader.
+     */
+    store: null,
+    
+    /** api: config[filter]
+     *  ``Function``
+     *  A function, called in the scope of this loader, with a layer record
+     *  as argument. Is expected to return true for layers to be loaded, false
+     *  otherwise. By default, the filter checks for displayInLayerSwitcher:
+     *  
+     *  .. code-block:: javascript
+     *  
+     *      filter: function(record) {
+     *          return record.getLayer().displayInLayerSwitcher == true
+     *      }
+     */
+    filter: function(record) {
+        return record.getLayer().displayInLayerSwitcher == true;
+    },
+    
+    /** api: config[baseAttrs]
+     *  An object containing attributes to be added to all nodes created by
+     *  this loader.
+     */
+    baseAttrs: null,
+    
+    /** api: config[uiProviders]
+     *  ``Object``
+     *  An optional object containing properties which specify custom
+     *  GeoExt.tree.LayerNodeUI implementations. If the optional uiProvider
+     *  attribute for child nodes is a string rather than a reference to a
+     *  TreeNodeUI implementation, then that string value is used as a
+     *  property name in the uiProviders object. If not provided, the
+     *  uiProviders object will be taken from the ownerTree's loader.
+     */
+    uiProviders: null,
+    
+    /** private: method[load]
+     *  :param node: ``Ext.tree.TreeNode`` The node to add children to.
+     *  :param callback: ``Function``
+     */
+    load: function(node, callback) {
+        if(this.fireEvent("beforeload", this, node)) {
+            this.removeStoreHandlers();
+            while (node.firstChild) {
+                node.removeChild(node.firstChild);
+            }
+            
+            if(!this.uiProviders) {
+                this.uiProviders = node.getOwnerTree().getLoader().uiProviders;
+            }
+    
+            if(!this.store) {
+                this.store = GeoExt.MapPanel.guess().layers;
+            }
+            this.store.each(function(record) {
+                this.addLayerNode(node, record);
+            }, this);
+            this.addStoreHandlers(node);
+    
+            if(typeof callback == "function"){
+                callback();
+            }
+            
+            this.fireEvent("load", this, node);
+        }
+    },
+    
+    /** private: method[onStoreAdd]
+     *  :param store: ``Ext.data.Store``
+     *  :param records: ``Array(Ext.data.Record)``
+     *  :param index: ``Number``
+     *  :param node: ``Ext.tree.TreeNode``
+     *  
+     *  Listener for the store's add event.
+     */
+    onStoreAdd: function(store, records, index, node) {
+        if(!this._reordering) {
+            var nodeIndex = node.recordIndexToNodeIndex(index+records.length-1);
+            for(var i=0; i<records.length; ++i) {
+                this.addLayerNode(node, records[i], nodeIndex);
+            }
+        }
+    },
+    
+    /** private: method[onStoreRemove]
+     *  :param store: ``Ext.data.Store``
+     *  :param record: ``Ext.data.Record``
+     *  :param index: ``Number``
+     *  :param node: ``Ext.tree.TreeNode``
+     *  
+     *  Listener for the store's remove event.
+     */
+    onStoreRemove: function(store, record, index, node) {
+        if(!this._reordering) {
+            this.removeLayerNode(node, record);
+        }
+    },
+
+    /** private: method[addLayerNode]
+     *  :param node: ``Ext.tree.TreeNode`` The node that the layer node will
+     *      be added to as child.
+     *  :param layerRecord: ``Ext.data.Record`` The layer record containing the
+     *      layer to be added.
+     *  :param index: ``Number`` Optional index for the new layer.  Default is 0.
+     *  
+     *  Adds a child node representing a layer of the map
+     */
+    addLayerNode: function(node, layerRecord, index) {
+        index = index || 0;
+        if (this.filter(layerRecord) === true) {
+            var child = this.createNode({
+                nodeType: 'gx_layer',
+                layer: layerRecord.getLayer(),
+                layerStore: this.store
+            });
+            var sibling = node.item(index);
+            if(sibling) {
+                node.insertBefore(child, sibling);
+            } else {
+                node.appendChild(child);
+            }
+            child.on("move", this.onChildMove, this);
+        }
+    },
+
+    /** private: method[removeLayerNode]
+     *  :param node: ``Ext.tree.TreeNode`` The node that the layer node will
+     *      be removed from as child.
+     *  :param layerRecord: ``Ext.data.Record`` The layer record containing the
+     *      layer to be removed.
+     * 
+     *  Removes a child node representing a layer of the map
+     */
+    removeLayerNode: function(node, layerRecord) {
+        if (this.filter(layerRecord) === true) {
+            var child = node.findChildBy(function(node) {
+                return node.layer == layerRecord.getLayer();
+            });
+            if(child) {
+                child.un("move", this.onChildMove, this);
+                child.remove();
+                node.reload();
+            }
+    	}
+    },
+    
+    /** private: method[onChildMove]
+     *  :param tree: ``Ext.data.Tree``
+     *  :param node: ``Ext.tree.TreeNode``
+     *  :param oldParent: ``Ext.tree.TreeNode``
+     *  :param newParent: ``Ext.tree.TreeNode``
+     *  :param index: ``Number``
+     *  
+     *  Listener for child node "move" events.  This updates the order of
+     *  records in the store based on new node order if the node has not
+     *  changed parents.
+     */
+    onChildMove: function(tree, node, oldParent, newParent, index) {
+        this._reordering = true;
+        // remove the record and re-insert it at the correct index
+        var record = this.store.getByLayer(node.layer);
+
+        if(newParent instanceof GeoExt.tree.LayerContainer && 
+                                    this.store === newParent.loader.store) {
+            newParent.loader._reordering = true;
+            this.store.remove(record);
+            var newRecordIndex;
+            if(newParent.childNodes.length > 1) {
+                // find index by neighboring node in the same container
+                var searchIndex = (index === 0) ? index + 1 : index - 1;
+                newRecordIndex = this.store.findBy(function(r) {
+                    return newParent.childNodes[searchIndex].layer === r.getLayer();
+                });
+                index === 0 && newRecordIndex++;
+            } else if(oldParent.parentNode === newParent.parentNode){
+                // find index by last node of a container above
+                var prev = newParent;
+                do {
+                    prev = prev.previousSibling;
+                } while (prev && !(prev instanceof GeoExt.tree.LayerContainer && prev.lastChild));
+                if(prev) {
+                    newRecordIndex = this.store.findBy(function(r) {
+                        return prev.lastChild.layer === r.getLayer();
+                    });
+                } else {
+                    // find indext by first node of a container below
+                    var next = newParent;
+                    do {
+                        next = next.nextSibling;
+                    } while (next && !(next instanceof GeoExt.tree.LayerContainer && next.firstChild));
+                    if(next) {
+                        newRecordIndex = this.store.findBy(function(r) {
+                            return next.firstChild.layer === r.getLayer();
+                        });
+                    }
+                    newRecordIndex++;
+                }
+            }
+            if(newRecordIndex !== undefined) {
+                this.store.insert(newRecordIndex, [record]);
+                window.setTimeout(function() {
+                    newParent.reload();
+                    oldParent.reload();
+                });
+            } else {
+                this.store.insert(oldRecordIndex, [record]);
+            }
+            delete newParent.loader._reordering;
+        }
+        delete this._reordering;
+    },
+    
+    /** private: method[addStoreHandlers]
+     *  :param node: :class:`GeoExt.tree.LayerNode`
+     */
+    addStoreHandlers: function(node) {
+        if(!this._storeHandlers) {
+            this._storeHandlers = {
+                "add": this.onStoreAdd.createDelegate(this, [node], true),
+                "remove": this.onStoreRemove.createDelegate(this, [node], true)
+            };
+            for(var evt in this._storeHandlers) {
+                this.store.on(evt, this._storeHandlers[evt], this);
+            }
+        }
+    },
+    
+    /** private: method[removeStoreHandlers]
+     */
+    removeStoreHandlers: function() {
+        if(this._storeHandlers) {
+            for(var evt in this._storeHandlers) {
+                this.store.un(evt, this._storeHandlers[evt], this);
+            }
+            delete this._storeHandlers;
+        }
+    },
+
+    /** api: method[createNode]
+     *  :param attr: ``Object`` attributes for the new node
+     *
+     *  Override this function for custom TreeNode node implementation, or to
+     *  modify the attributes at creation time.
+     */
+    createNode: function(attr) {
+        if(this.baseAttrs){
+            Ext.apply(attr, this.baseAttrs);
+        }
+        if(typeof attr.uiProvider == 'string'){
+           attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);
+        }
+        attr.nodeType = attr.nodeType || "gx_layer";
+
+        return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
+    },
+
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        this.removeStoreHandlers();
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamNode.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamNode.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/tree/LayerParamNode.js	(revision 76)
@@ -0,0 +1,250 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.tree");
+
+/** api: (define)
+ *  module = GeoExt.tree
+ *  class = LayerParamNode
+ *  base_link = `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_
+ */
+
+/** api: constructor
+ *  .. class:: LayerParamNode
+ * 
+ *  A subclass of ``Ext.tree.TreeNode`` that represents a value of a list of
+ *  values provided as one of an ``OpenLayers.Layer.HTTPRequest``'s params.
+ *  The default iconCls for this node's icon is "gx-tree-layerparam-icon".
+ *  
+ *  To use this node type in a ``TreePanel`` config, set ``nodeType`` to
+ *  "gx_layerparam".
+ */
+GeoExt.tree.LayerParamNode = Ext.extend(Ext.tree.TreeNode, {
+    
+    /** api: config[layer]
+     *  ``OpenLayers.Layer.HTTPRequest|String`` The layer that this node
+     *  represents a subnode of. If provided as string, the string has to
+     *  match the title of one of the records in the ``layerStore``.
+     */
+    
+    /** private: property[layer]
+     *  ``OpenLayers.Layer.HTTPRequest``
+     */
+    layer: null,
+    
+    /** api: config[layerStore]
+     *  :class:`GeoExt.data.LayerStore` Only used if layer is provided as
+     *  string. The store where we can find the layer. If not provided, the
+     *  store of a map panel found by ``GeoExt.MapPanel::guess`` will be used.
+     */
+    
+    /** api: config[param]
+     *  ``String`` Key for a param (key-value pair in the params object of the
+     *  layer) that this node represents an item of. The value can either be an
+     *  ``Array`` or a ``String``, delimited by the character (or string)
+     *  provided as ``delimiter`` config option.
+     */
+    
+    /** private: property[param]
+     *  ``String``
+     */
+    param: null,
+    
+    /** api: config[item]
+     *  ``String`` The param's value's item that this node represents.
+     */
+    
+    /** private: property[item]
+     *  ``String``
+     */
+    item: null,
+    
+    /** api: config[delimiter]
+     *  ``String`` Delimiter of the ``param``'s value's items. Default is
+     *  ``,`` (comma). If the ``param``'s value is an array, this property
+     *  has no effect.
+     */
+    
+    /** private: property[delimiter]
+     *  ``String``
+     */
+    delimiter: null,
+    
+    /** private: property[allItems]
+     *  ``Array`` All items in the param value.
+     */
+    allItems: null,
+    
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(attributes) {
+        var config = attributes || {};
+        config.iconCls = config.iconCls || "gx-tree-layerparam-icon";
+        config.text = config.text || config.item;
+        
+        this.param = config.param;
+        this.item = config.item;
+        this.delimiter = config.delimiter || ",";
+        this.allItems = config.allItems;
+                
+        GeoExt.tree.LayerParamNode.superclass.constructor.apply(this, arguments);
+
+        this.getLayer();
+
+        if(this.layer) {
+
+            // read items from layer if allItems isn't set
+            // in the attributes
+            if(!this.allItems) {
+                this.allItems = this.getItemsFromLayer();
+            }
+
+            // if the "checked" attribute isn't set we derive
+            // it from what we have in the layer. Else, we need
+            // to update the layer param based on the value of
+            // the "checked" attribute
+            if(this.attributes.checked == null) {
+                this.attributes.checked =
+                    this.layer.getVisibility() &&
+                    this.getItemsFromLayer().indexOf(this.item) >= 0;
+            } else {
+                this.onCheckChange(this, this.attributes.checked);
+            }
+
+            this.layer.events.on({
+                "visibilitychanged": this.onLayerVisibilityChanged,
+                scope: this
+            });
+
+            this.on({
+                "checkchange": this.onCheckChange,
+                scope: this
+            });
+        }
+    },
+    
+    /** private: method[getLayer]
+     *  :return: ``OpenLayers.Layer.HTTPRequest`` the layer
+     *  
+     *  Sets this.layer and returns the layer.
+     */
+    getLayer: function() {
+        if(!this.layer) {
+            var layer = this.attributes.layer;
+            if(typeof layer == "string") {
+                var store = this.attributes.layerStore ||
+                    GeoExt.MapPanel.guess().layers;
+                var i = store.findBy(function(o) {
+                    return o.get("title") == layer;
+                });
+                layer = i != -1 ? store.getAt(i).getLayer() : null;
+            }
+            this.layer = layer;
+        }
+        return this.layer;
+    },
+    
+    /** private: method[getItemsFromLayer]
+     *  :return: ``Array`` the items of this node's layer's param
+     */
+    getItemsFromLayer: function() {
+        var paramValue = this.layer.params[this.param];
+        return paramValue instanceof Array ?
+            paramValue :
+            (paramValue ? paramValue.split(this.delimiter) : []);
+    },
+    
+    /** private: method[createParams]
+     *  :param items: ``Array``
+     *  :return: ``Object`` The params object to pass to mergeNewParams
+     */
+    createParams: function(items) {
+        var params = {};
+        params[this.param] = this.layer.params[this.param] instanceof Array ?
+            items :
+            items.join(this.delimiter);
+        return params;
+    },
+
+    /** private: method[onLayerVisibilityChanged]
+     *  Handler for visibilitychanged events on the layer.
+     */
+    onLayerVisibilityChanged: function() {
+        if(this.getItemsFromLayer().length === 0) {
+            this.layer.mergeNewParams(this.createParams(this.allItems));
+        }
+        var visible = this.layer.getVisibility();
+        if(visible && this.getItemsFromLayer().indexOf(this.item) !== -1) {
+            this.getUI().toggleCheck(true);
+        }
+        if(!visible) {
+            this.layer.mergeNewParams(this.createParams([]));
+            this.getUI().toggleCheck(false);
+        }
+    },
+    
+    /** private: method[onCheckChange]
+     *  :param node: :class:`GeoExt.tree.LayerParamNode``
+     *  :param checked: ``Boolean``
+     *
+     *  Handler for checkchange events.
+     */
+    onCheckChange: function(node, checked) {
+        var layer = this.layer;
+
+        var newItems = [];
+        var curItems = this.getItemsFromLayer();
+        // if the layer is invisible, and a subnode is checked for the first
+        // time, we need to pretend that no subnode param items are set.
+        if(checked === true && layer.getVisibility() === false &&
+                                curItems.length === this.allItems.length) {
+            curItems = [];
+            
+        }
+        Ext.each(this.allItems, function(item) {
+            if((item !== this.item && curItems.indexOf(item) !== -1) ||
+                            (checked === true && item === this.item)) {
+                newItems.push(item);
+            }
+        }, this);
+        
+        var visible = (newItems.length > 0);
+        // if there is something to display, we want to update the params
+        // before the layer is turned on
+        visible && layer.mergeNewParams(this.createParams(newItems));
+        if(visible !== layer.getVisibility()) {
+            layer.setVisibility(visible);
+        }
+        // if there is nothing to display, we want to update the params
+        // when the layer is turned off, so we don't fire illegal requests
+        // (i.e. param value being empty)
+        (!visible) && layer.mergeNewParams(this.createParams([]));
+    },
+    
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        var layer = this.layer;
+        if (layer instanceof OpenLayers.Layer) {
+            layer.events.un({
+                "visibilitychanged": this.onLayerVisibilityChanged,
+                scope: this
+            });
+        }
+        delete this.layer;
+        
+        this.un("checkchange", this.onCheckChange, this);
+
+        GeoExt.tree.LayerParamNode.superclass.destroy.apply(this, arguments);
+    }
+});
+
+/**
+ * NodeType: gx_layerparam
+ */
+Ext.tree.TreePanel.nodeTypes.gx_layerparam = GeoExt.tree.LayerParamNode;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/WMSLegend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/WMSLegend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/WMSLegend.js	(revision 76)
@@ -0,0 +1,237 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/LegendImage.js
+ * @requires GeoExt/widgets/LayerLegend.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = WMSLegend
+ */
+
+/** api: (extends)
+ *  GeoExt/widgets/LayerLegend.js
+ */
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: WMSLegend(config)
+ *
+ *  Show a legend image for a WMS layer. The image can be read from the styles
+ *  field of a layer record (if the record comes e.g. from a
+ *  :class:`GeoExt.data.WMSCapabilitiesReader`). If not provided, a
+ *  GetLegendGraphic request will be issued to retrieve the image.
+ */
+GeoExt.WMSLegend = Ext.extend(GeoExt.LayerLegend, {
+
+    /** api: config[defaultStyleIsFirst]
+     *  ``Boolean``
+     *  The WMS spec does not say if the first style advertised for a layer in
+     *  a Capabilities document is the default style that the layer is
+     *  rendered with. We make this assumption by default. To be strictly WMS
+     *  compliant, set this to false, but make sure to configure a STYLES
+     *  param with your WMS layers, otherwise LegendURLs advertised in the
+     *  GetCapabilities document cannot be used.
+     */
+    defaultStyleIsFirst: true,
+
+    /** api: config[useScaleParameter]
+     *  ``Boolean``
+     *  Should we use the optional SCALE parameter in the SLD WMS
+     *  GetLegendGraphic request? Defaults to true.
+     */
+    useScaleParameter: true,
+
+    /** api: config[baseParams]
+     * ``Object``
+     *  Optional parameters to add to the legend url, this can e.g. be used to
+     *  support vendor-specific parameters in a SLD WMS GetLegendGraphic
+     *  request. To override the default MIME type of image/gif use the
+     *  FORMAT parameter in baseParams.
+     *     
+     *  .. code-block:: javascript
+     *     
+     *      var legendPanel = new GeoExt.LegendPanel({
+     *          map: map,
+     *          title: 'Legend Panel',
+     *          defaults: {
+     *              style: 'padding:5px',
+     *              baseParams: {
+     *                  FORMAT: 'image/png',
+     *                  LEGEND_OPTIONS: 'forceLabels:on'
+     *              }
+     *          }
+     *      });   
+     */
+    baseParams: null,
+    
+    /** private: method[initComponent]
+     *  Initializes the WMS legend. For group layers it will create multiple
+     *  image box components.
+     */
+    initComponent: function() {
+        GeoExt.WMSLegend.superclass.initComponent.call(this);
+        var layer = this.layerRecord.getLayer();
+        this._noMap = !layer.map;
+        layer.events.register("moveend", this, this.onLayerMoveend);
+        this.update();
+    },
+    
+    /** private: method[onLayerMoveend]
+     *  :param e: ``Object``
+     */
+    onLayerMoveend: function(e) {
+        if ((e.zoomChanged === true && this.useScaleParameter === true) ||
+                                                                this._noMap) {
+            delete this._noMap;
+            this.update();
+        }
+    },
+
+    /** private: method[getLegendUrl]
+     *  :param layerName: ``String`` A sublayer.
+     *  :param layerNames: ``Array(String)`` The array of sublayers,
+     *      read from this.layerRecord if not provided.
+     *  :return: ``String`` The legend URL.
+     *
+     *  Get the legend URL of a sublayer.
+     */
+    getLegendUrl: function(layerName, layerNames) {
+        var rec = this.layerRecord;
+        var url;
+        var styles = rec && rec.get("styles");
+        var layer = rec.getLayer();
+        layerNames = layerNames || [layer.params.LAYERS].join(",").split(",");
+
+        var styleNames = layer.params.STYLES &&
+                             [layer.params.STYLES].join(",").split(",");
+        var idx = layerNames.indexOf(layerName);
+        var styleName = styleNames && styleNames[idx];
+        // check if we have a legend URL in the record's
+        // "styles" data field
+        if(styles && styles.length > 0) {
+            if(styleName) {
+                Ext.each(styles, function(s) {
+                    url = (s.name == styleName && s.legend) && s.legend.href;
+                    return !url;
+                });
+            } else if(this.defaultStyleIsFirst === true && !styleNames &&
+                      !layer.params.SLD && !layer.params.SLD_BODY) {
+                url = styles[0].legend && styles[0].legend.href;
+            }
+        }
+        if(!url) {
+            url = layer.getFullRequestString({
+                REQUEST: "GetLegendGraphic",
+                WIDTH: null,
+                HEIGHT: null,
+                EXCEPTIONS: "application/vnd.ogc.se_xml",
+                LAYER: layerName,
+                LAYERS: null,
+                STYLE: (styleName !== '') ? styleName: null,
+                STYLES: null,
+                SRS: null,
+                FORMAT: null
+            });
+        }
+        // add scale parameter - also if we have the url from the record's
+        // styles data field and it is actually a GetLegendGraphic request.
+        if(this.useScaleParameter === true &&
+                url.toLowerCase().indexOf("request=getlegendgraphic") != -1) {
+            var scale = layer.map.getScale();
+            url = Ext.urlAppend(url, "SCALE=" + scale);
+        }
+        var params = this.baseParams || {};
+        Ext.applyIf(params, {FORMAT: 'image/gif'});
+        if(url.indexOf('?') > 0) {
+            url = Ext.urlEncode(params, url);
+        }
+        
+        return url;
+    },
+
+    /** private: method[update]
+     *  Update the legend, adding, removing or updating
+     *  the per-sublayer box component.
+     */
+    update: function() {
+        var layer = this.layerRecord.getLayer();
+        // In some cases, this update function is called on a layer
+        // that has just been removed, see ticket #238.
+        // The following check bypass the update if map is not set.
+        if(!(layer && layer.map)) {
+            return;
+        }
+        GeoExt.WMSLegend.superclass.update.apply(this, arguments);
+        
+        var layerNames, layerName, i, len;
+
+        layerNames = [layer.params.LAYERS].join(",").split(",");
+
+        var destroyList = [];
+        var textCmp = this.items.get(0);
+        this.items.each(function(cmp) {
+            i = layerNames.indexOf(cmp.itemId);
+            if(i < 0 && cmp != textCmp) {
+                destroyList.push(cmp);
+            } else if(cmp !== textCmp){
+                layerName = layerNames[i];
+                var newUrl = this.getLegendUrl(layerName, layerNames);
+                if(!OpenLayers.Util.isEquivalentUrl(newUrl, cmp.url)) {
+                    cmp.setUrl(newUrl);
+                }
+            }
+        }, this);
+        for(i = 0, len = destroyList.length; i<len; i++) {
+            var cmp = destroyList[i];
+            // cmp.destroy() does not remove the cmp from
+            // its parent container!
+            this.remove(cmp);
+            cmp.destroy();
+        }
+
+        for(i = 0, len = layerNames.length; i<len; i++) {
+            layerName = layerNames[i];
+            if(!this.items || !this.getComponent(layerName)) {
+                this.add({
+                    xtype: "gx_legendimage",
+                    url: this.getLegendUrl(layerName, layerNames),
+                    itemId: layerName
+                });
+            }
+        }
+        this.doLayout();
+    },
+
+    /** private: method[beforeDestroy]
+     */
+    beforeDestroy: function() {
+        if (this.useScaleParameter === true) {
+            var layer = this.layerRecord.getLayer()
+            layer && layer.events &&
+                layer.events.unregister("moveend", this, this.onLayerMoveend);
+        }
+        GeoExt.WMSLegend.superclass.beforeDestroy.apply(this, arguments);
+    }
+
+});
+
+/** private: method[supports]
+ *  Private override
+ */
+GeoExt.WMSLegend.supports = function(layerRecord) {
+    return layerRecord.getLayer() instanceof OpenLayers.Layer.WMS;
+};
+
+/** api: legendtype = gx_wmslegend */
+GeoExt.LayerLegend.types["gx_wmslegend"] = GeoExt.WMSLegend;
+
+/** api: xtype = gx_wmslegend */
+Ext.reg('gx_wmslegend', GeoExt.WMSLegend);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/ZoomSlider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/ZoomSlider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/ZoomSlider.js	(revision 76)
@@ -0,0 +1,268 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/tips/ZoomSliderTip.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = ZoomSlider
+ *  base_link = `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to render a slider outside the map viewport:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var slider = new GeoExt.ZoomSlider({
+ *          renderTo: document.body,
+ *          width: 200,
+ *          map: map
+ *      });
+ *     
+ *  Sample code to add a slider to a map panel:
+ * 
+ *  .. code-block:: javascript
+ * 
+ *      var panel = new GeoExt.MapPanel({
+ *          renderTo: document.body,
+ *          height: 300,
+ *          width: 400,
+ *          map: {
+ *              controls: [new OpenLayers.Control.Navigation()]
+ *          },
+ *          layers: [new OpenLayers.Layer.WMS(
+ *              "Global Imagery",
+ *              "http://maps.opengeo.org/geowebcache/service/wms",
+ *              {layers: "bluemarble"}
+ *          )],
+ *          extent: [-5, 35, 15, 55],
+ *          items: [{
+ *              xtype: "gx_zoomslider",
+ *              aggressive: true,
+ *              vertical: true,
+ *              height: 100,
+ *              x: 10,
+ *              y: 20
+ *          }]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: ZoomSlider(config)
+ *   
+ *      Create a slider for controlling a map's zoom level.
+ */
+GeoExt.ZoomSlider = Ext.extend(Ext.Slider, {
+    
+    /** api: config[map]
+     *  ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+     *  The map that the slider controls.
+     */
+    map: null,
+    
+    /** api: config[baseCls]
+     *  ``String``
+     *  The CSS class name for the slider elements.  Default is "gx-zoomslider".
+     */
+    baseCls: "gx-zoomslider",
+
+    /** api: config[aggressive]
+     *  ``Boolean``
+     *  If set to true, the map is zoomed as soon as the thumb is moved. Otherwise 
+     *  the map is zoomed when the thumb is released (default).
+     */
+    aggressive: false,
+    
+    /** private: property[updating]
+     *  ``Boolean``
+     *  The slider position is being updated by itself (based on map zoomend).
+     */
+    updating: false,
+    
+    /** private: method[initComponent]
+     *  Initialize the component.
+     */
+    initComponent: function() {
+        GeoExt.ZoomSlider.superclass.initComponent.call(this);
+        
+        if(this.map) {
+            if(this.map instanceof GeoExt.MapPanel) {
+                this.map = this.map.map;
+            }
+            this.bind(this.map);
+        }
+
+        if (this.aggressive === true) {
+            this.on('change', this.changeHandler, this);
+        } else {
+            this.on('changecomplete', this.changeHandler, this);
+        }
+        this.on("beforedestroy", this.unbind, this);        
+    },
+    
+    /** private: method[onRender]
+     *  Override onRender to set base css class.
+     */
+    onRender: function() {
+        GeoExt.ZoomSlider.superclass.onRender.apply(this, arguments);
+        this.el.addClass(this.baseCls);
+    },
+
+    /** private: method[afterRender]
+     *  Override afterRender because the render event is fired too early
+     *  to call update.
+     */
+    afterRender : function(){
+        Ext.Slider.superclass.afterRender.apply(this, arguments);
+        this.update();
+    },
+    
+    /** private: method[addToMapPanel]
+     *  :param panel: :class:`GeoExt.MapPanel`
+     *  
+     *  Called by a MapPanel if this component is one of the items in the panel.
+     */
+    addToMapPanel: function(panel) {
+        this.on({
+            render: function() {
+                var el = this.getEl();
+                el.setStyle({
+                    position: "absolute",
+                    zIndex: panel.map.Z_INDEX_BASE.Control
+                });
+                el.on({
+                    mousedown: this.stopMouseEvents,
+                    click: this.stopMouseEvents
+                });
+            },
+            afterrender: function() {
+                this.bind(panel.map);
+            },
+            scope: this
+        });
+    },
+    
+    /** private: method[stopMouseEvents]
+     *  :param e: ``Object``
+     */
+    stopMouseEvents: function(e) {
+        e.stopEvent();
+    },
+    
+    /** private: method[removeFromMapPanel]
+     *  :param panel: :class:`GeoExt.MapPanel`
+     *  
+     *  Called by a MapPanel if this component is one of the items in the panel.
+     */
+    removeFromMapPanel: function(panel) {
+        var el = this.getEl();
+        el.un("mousedown", this.stopMouseEvents, this);
+        el.un("click", this.stopMouseEvents, this);
+        this.unbind();
+    },
+    
+    /** private: method[bind]
+     *  :param map: ``OpenLayers.Map``
+     */
+    bind: function(map) {
+        this.map = map;
+        this.map.events.on({
+            zoomend: this.update,
+            changebaselayer: this.initZoomValues,
+            scope: this
+        });
+        if(this.map.baseLayer) {
+            this.initZoomValues();
+            this.update();
+        }
+    },
+    
+    /** private: method[unbind]
+     */
+    unbind: function() {
+        if(this.map) {
+            this.map.events.un({
+                zoomend: this.update,
+                changebaselayer: this.initZoomValues,
+                scope: this
+            });
+        }
+    },
+    
+    /** private: method[initZoomValues]
+     *  Set the min/max values for the slider if not set in the config.
+     */
+    initZoomValues: function() {
+        var layer = this.map.baseLayer;
+        if(this.initialConfig.minValue === undefined) {
+            this.minValue = layer.minZoomLevel || 0;
+        }
+        if(this.initialConfig.maxValue === undefined) {
+            this.maxValue = layer.minZoomLevel == null ?
+                layer.numZoomLevels - 1 : layer.maxZoomLevel;
+        }
+    },
+    
+    /** api: method[getZoom]
+     *  :return: ``Number`` The map zoom level.
+     *  
+     *  Get the zoom level for the associated map based on the slider value.
+     */
+    getZoom: function() {
+        return this.getValue();
+    },
+    
+    /** api: method[getScale]
+     *  :return: ``Number`` The map scale denominator.
+     *  
+     *  Get the scale denominator for the associated map based on the slider value.
+     */
+    getScale: function() {
+        return OpenLayers.Util.getScaleFromResolution(
+            this.map.getResolutionForZoom(this.getValue()),
+            this.map.getUnits()
+        );
+    },
+    
+    /** api: method[getResolution]
+     *  :return: ``Number`` The map resolution.
+     *  
+     *  Get the resolution for the associated map based on the slider value.
+     */
+    getResolution: function() {
+        return this.map.getResolutionForZoom(this.getValue());
+    },
+    
+    /** private: method[changeHandler]
+     *  Registered as a listener for slider changecomplete.  Zooms the map.
+     */
+    changeHandler: function() {
+        if(this.map && !this.updating) {
+            this.map.zoomTo(this.getValue());
+        }
+    },
+    
+    /** private: method[update]
+     *  Registered as a listener for map zoomend.  Updates the value of the slider.
+     */
+    update: function() {
+        if(this.rendered && this.map) {
+            this.updating = true;
+            this.setValue(this.map.getZoom());
+            this.updating = false;
+        }
+    }
+
+});
+
+/** api: xtype = gx_zoomslider */
+Ext.reg('gx_zoomslider', GeoExt.ZoomSlider);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/BasicForm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/BasicForm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/BasicForm.js	(revision 76)
@@ -0,0 +1,85 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/form/SearchAction.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.form
+ *  class = BasicForm
+ *  base_link = `Ext.form.BasicForm <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm>`_
+ */
+
+Ext.namespace("GeoExt.form");
+
+/** api: constructor
+ *  .. class:: BasicForm(config)
+ *
+ *      A specific ``Ext.form.BasicForm`` whose doAction method creates
+ *      a :class:`GeoExt.form.SearchAction` if it is passed the string
+ *      "search" as its first argument.
+ *
+ *      In most cases one would not use this class directly, but
+ *      :class:`GeoExt.form.FormPanel` instead.
+ */
+GeoExt.form.BasicForm = Ext.extend(Ext.form.BasicForm, {
+    /** private: property[protocol]
+     *  ``OpenLayers.Protocol`` The protocol configured in this
+     *  instance.
+     */
+    protocol: null,
+
+    /**
+     * private: property[prevResponse]
+     * ``OpenLayers.Protocol.Response`` The response return by a call to
+     *  protocol.read method.
+     */
+    prevResponse: null,
+
+    /**
+     * api: config[autoAbort]
+     * ``Boolean`` Tells if pending requests should be aborted
+     *      when a new action is performed.
+     */
+    autoAbort: true,
+
+    /** api: method[doAction]
+     *  :param action: ``String or Ext.form.Action`` Either the name
+     *      of the action or a ``Ext.form.Action`` instance.
+     *  :param options: ``Object`` The options passed to the Action
+     *      constructor.
+     *  :return: :class:`GeoExt.form.BasicForm` This form.
+     *
+     *  Performs the action, if the string "search" is passed as the
+     *  first argument then a :class:`GeoExt.form.SearchAction` is created.
+     */
+    doAction: function(action, options) {
+        if(action == "search") {
+            options = Ext.applyIf(options || {}, {
+                protocol: this.protocol,
+                abortPrevious: this.autoAbort
+            });
+            action = new GeoExt.form.SearchAction(this, options);
+        }
+        return GeoExt.form.BasicForm.superclass.doAction.call(
+            this, action, options
+        );
+    },
+
+    /** api: method[search]
+     *  :param options: ``Object`` The options passed to the Action
+     *      constructor.
+     *  :return: :class:`GeoExt.form.BasicForm` This form.
+     *  
+     *  Shortcut to do a search action.
+     */
+    search: function(options) {
+        return this.doAction("search", options);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/FormPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/FormPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/FormPanel.js	(revision 76)
@@ -0,0 +1,102 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.form
+ *  class = FormPanel
+ *  base_link = `Ext.form.FormPanel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel>`_
+ */
+
+/**
+ * @include GeoExt/widgets/form/BasicForm.js
+ */
+
+Ext.namespace("GeoExt.form");
+
+/** api: example
+ *  Sample code showing how to use a GeoExt form panel.
+ *
+ *  .. code-block:: javascript
+ *
+ *      var formPanel = new GeoExt.form.FormPanel({
+ *          renderTo: "formpanel",
+ *          protocol: new OpenLayers.Protocol.WFS({
+ *              url: "http://publicus.opengeo.org/geoserver/wfs",
+ *              featureType: "tasmania_roads",
+ *              featureNS: "http://www.openplans.org/topp"
+ *          }),
+ *          items: [{
+ *              xtype: "textfield",
+ *              name: "name__ilike",
+ *              value: "mont"
+ *          }, {
+ *              xtype: "textfield",
+ *              name: "elevation__ge",
+ *              value: "2000"
+ *          }],
+ *          listeners: {
+ *              actioncomplete: function(form, action) {
+ *                  // this listener triggers when the search request
+ *                  // is complete, the OpenLayers.Protocol.Response
+ *                  // resulting from the request is available
+ *                  // in "action.response"
+ *              }
+ *          }
+ *      });
+ *
+ *      formPanel.addButton({
+ *          text: "search",
+ *          handler: function() {
+ *              this.search();
+ *          },
+ *          scope: formPanel
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: FormPanel(config)
+ *
+ *      A specific ``Ext.form.FormPanel`` whose internal form is a
+ *      :class:`GeoExt.form.BasicForm` instead of ``Ext.form.BasicForm``.
+ *      One would use this form to do search requests through
+ *      an ``OpenLayers.Protocol`` object (``OpenLayers.Protocol.WFS``
+ *      for example).
+ *
+ *      Look at :class:`GeoExt.form.SearchAction` to understand how
+ *      form fields must be named for appropriate filters to be
+ *      passed to the protocol.
+ */
+GeoExt.form.FormPanel = Ext.extend(Ext.form.FormPanel, {
+    /** api: config[protocol]
+     *  ``OpenLayers.Protocol`` The protocol instance this form panel
+     *  is configured with, actions resulting from this form
+     *  will be performed through the protocol.
+     */
+    protocol: null,
+
+    /** private: method[createForm]
+     *  Create the internal :class:`GeoExt.form.BasicForm` instance.
+     */
+    createForm: function() {
+        delete this.initialConfig.listeners;
+        return new GeoExt.form.BasicForm(null, this.initialConfig);
+    },
+
+    /** api: method[search]
+     *  :param options: ``Object`` The options passed to the
+     *      :class:`GeoExt.form.SearchAction` constructor.
+     *
+     *  Shortcut to the internal form's search method.
+     */
+    search: function(options) {
+        this.getForm().search(options);
+    }
+});
+
+/** api: xtype = gx_formpanel */
+Ext.reg("gx_formpanel", GeoExt.form.FormPanel);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/SearchAction.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/SearchAction.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form/SearchAction.js	(revision 76)
@@ -0,0 +1,156 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.form
+ *  class = SearchAction
+ *  base_link = `Ext.form.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.Action>`_
+ */
+
+/**
+ * @include GeoExt/widgets/form.js
+ */
+
+Ext.namespace("GeoExt.form");
+ 
+/** api: example
+ *  Sample code showing how to use a GeoExt SearchAction with an Ext form panel:
+ *  
+ *  .. code-block:: javascript
+ *
+ *      var formPanel = new Ext.form.Panel({
+ *          renderTo: "formpanel",
+ *          items: [{
+ *              xtype: "textfield",
+ *              name: "name__like",
+ *              value: "mont"
+ *          }, {
+ *              xtype: "textfield",
+ *              name: "elevation__ge",
+ *              value: "2000"
+ *          }]
+ *      });
+ *
+ *      var searchAction = new GeoExt.form.SearchAction(formPanel.getForm(), {
+ *          protocol: new OpenLayers.Protocol.WFS({
+ *              url: "http://publicus.opengeo.org/geoserver/wfs",
+ *              featureType: "tasmania_roads",
+ *              featureNS: "http://www.openplans.org/topp"
+ *          }),
+ *          abortPrevious: true
+ *      });
+ *
+ *      formPanel.getForm().doAction(searchAction, {
+ *          callback: function(response) {
+ *              // response.features includes the features read
+ *              // from the server through the protocol
+ *          }
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: SearchAction(form, options)
+ *
+ *      A specific ``Ext.form.Action`` to be used when using a form to do
+ *      trigger search requests througn an ``OpenLayers.Protocol``.
+ *
+ *      Arguments:
+ *
+ *      * form ``Ext.form.BasicForm`` A basic form instance.
+ *      * options ``Object`` Options passed to the protocol'read method
+ *            One can add an abortPrevious property to these options, if set
+ *            to true, the abort method will be called on the protocol if
+ *            there's a pending request.
+ *
+ *      When run this action builds an ``OpenLayers.Filter`` from the form
+ *      and passes this filter to its protocol's read method. The form fields
+ *      must be named after a specific convention, so that an appropriate 
+ *      ``OpenLayers.Filter.Comparison`` filter is created for each
+ *      field.
+ *
+ *      For example a field with the name ``foo__like`` would result in an
+ *      ``OpenLayers.Filter.Comparison`` of type
+ *      ``OpenLayers.Filter.Comparison.LIKE`` being created.
+ *
+ *      Here is the convention:
+ *
+ *      * ``<name>__eq: OpenLayers.Filter.Comparison.EQUAL_TO``
+ *      * ``<name>__ne: OpenLayers.Filter.Comparison.NOT_EQUAL_TO``
+ *      * ``<name>__lt: OpenLayers.Filter.Comparison.LESS_THAN``
+ *      * ``<name>__le: OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO``
+ *      * ``<name>__gt: OpenLayers.Filter.Comparison.GREATER_THAN``
+ *      * ``<name>__ge: OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO``
+ *      * ``<name>__like: OpenLayers.Filter.Comparison.LIKE``
+ *
+ *      In most cases your would not directly create ``GeoExt.form.SearchAction``
+ *      objects, but use :class:`GeoExt.form.FormPanel` instead.
+ */
+GeoExt.form.SearchAction = Ext.extend(Ext.form.Action, {
+    /** private: property[type]
+     *  ``String`` The action type string.
+     */
+    type: "search",
+
+    /** api: property[response]
+     *  ``OpenLayers.Protocol.Response`` A reference to the response
+     *  resulting from the search request. Read-only.
+     */
+    response: null,
+
+    /** private */
+    constructor: function(form, options) {
+        GeoExt.form.SearchAction.superclass.constructor.call(this, form, options);
+    },
+
+    /** private: method[run]
+     *  Run the action.
+     */
+    run: function() {
+        var o = this.options;
+        var f = GeoExt.form.toFilter(this.form, o.logicalOp, o.wildcard);
+        if(o.clientValidation === false || this.form.isValid()){
+
+            if (o.abortPrevious && this.form.prevResponse) {
+                o.protocol.abort(this.form.prevResponse);
+            }
+
+            this.form.prevResponse = o.protocol.read(
+                Ext.applyIf({
+                    filter: f,
+                    callback: this.handleResponse,
+                    scope: this
+                }, o)
+            );
+
+        } else if(o.clientValidation !== false){
+            // client validation failed
+            this.failureType = Ext.form.Action.CLIENT_INVALID;
+            this.form.afterAction(this, false);
+        }
+    },
+
+    /** private: method[handleResponse]
+     *  :param response: ``OpenLayers.Protocol.Response`` The response
+     *  object.
+     *
+     *  Handle the response to the search query.
+     */
+    handleResponse: function(response) {
+        this.form.prevResponse = null;
+        this.response = response;
+        if(response.success()) {
+            this.form.afterAction(this, true);
+        } else {
+            this.form.afterAction(this, false);
+        }
+        var o = this.options;
+        if(o.callback) {
+            o.callback.call(o.scope, response);
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerLegend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerLegend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LayerLegend.js	(revision 76)
@@ -0,0 +1,188 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = LayerLegend
+ *  base_link = `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_
+ */
+
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: LayerLegend(config)
+ *
+ *      Base class for components of :class:`GeoExt.LegendPanel`.
+ */
+GeoExt.LayerLegend = Ext.extend(Ext.Container, {
+
+    /** api: config[layerRecord]
+     *  :class:`GeoExt.data.LayerRecord`  The layer record for the legend
+     */
+    layerRecord: null,
+
+    /** api: config[showTitle]
+     *  ``Boolean``
+     *  Whether or not to show the title of a layer. This can be overridden
+     *  on the LayerStore record using the hideTitle property.
+     */
+    showTitle: true,
+    
+    /** api: config[legendTitle]
+     *  ``String``
+     *  Optional title to be displayed instead of the layer title.  If this is
+     *  set, the value of ``showTitle`` will be ignored (assumed to be true).
+     */
+    legendTitle: null,
+
+    /** api: config[labelCls]
+     *  ``String``
+     *  Optional css class to use for the layer title labels.
+     */
+    labelCls: null,
+    
+    /** private: property[layerStore]
+     *  :class:`GeoExt.data.LayerStore`
+     */
+    layerStore: null,
+
+    /** private: method[initComponent]
+     */
+    initComponent: function() {
+        GeoExt.LayerLegend.superclass.initComponent.call(this);
+        this.autoEl = {};
+        this.add({
+            xtype: "label",
+            text: this.getLayerTitle(this.layerRecord),
+            cls: 'x-form-item x-form-item-label' +
+                (this.labelCls ? ' ' + this.labelCls : '')
+        });
+        if (this.layerRecord && this.layerRecord.store) {
+            this.layerStore = this.layerRecord.store;
+            this.layerStore.on("update", this.onStoreUpdate, this);
+        }
+    },
+
+    /** private: method[onStoreUpdate]
+     *  Update a the legend. Gets called when the store fires the update event.
+     *  This usually means the visibility of the layer, its style or title
+     *  has changed.
+     *
+     *  :param store: ``Ext.data.Store`` The store in which the record was
+     *      changed.
+     *  :param record: ``Ext.data.Record`` The record object corresponding
+     *      to the updated layer.
+     *  :param operation: ``String`` The type of operation.
+     */
+    onStoreUpdate: function(store, record, operation) {
+        // if we don't have items, we are already awaiting garbage
+        // collection after being removed by LegendPanel::removeLegend, and
+        // updating will cause errors
+        if (record === this.layerRecord && this.items.getCount() > 0) {
+            var layer = record.getLayer();
+            this.setVisible(layer.getVisibility() &&
+                layer.calculateInRange() && layer.displayInLayerSwitcher &&
+                !record.get('hideInLegend'));
+            this.update();
+        }
+    },
+
+    /** private: method[update]
+     *  Updates the legend.
+     */
+    update: function() {
+        var title = this.getLayerTitle(this.layerRecord);
+        if (this.items.get(0).text !== title) {
+            // we need to update the title
+            this.items.get(0).setText(title);
+        }
+    },
+    
+    /** private: method[getLayerTitle]
+     *  :arg record: :class:GeoExt.data.LayerRecord
+     *  :returns: ``String``
+     *
+     *  Get a title for the layer.  If the record doesn't have a title, use the 
+     *  name.
+     */
+    getLayerTitle: function(record) {
+        var title = this.legendTitle || "";
+        if (this.showTitle && !title) {
+            if (record && !record.get("hideTitle")) {
+                title = record.get("title") || 
+                    record.get("name") || 
+                    record.getLayer().name || "";
+            }
+        }
+        return title;
+    },
+    
+    /** private: method[beforeDestroy]
+     */
+    beforeDestroy: function() {
+        this.layerStore &&
+            this.layerStore.un("update", this.onStoreUpdate, this);
+        GeoExt.LayerLegend.superclass.beforeDestroy.apply(this, arguments);
+    }
+
+});
+
+/** class: method[getTypes]
+ *  :param layerRecord: class:`GeoExt.data.LayerRecord` A layer record to get
+ *      legend types for. If not provided, all registered types will be
+ *      returned.
+ *  :param preferredTypes: ``Array(String)`` Types that should be considered.
+ *      first. If not provided, all legend types will be returned in the order
+ *      they were registered.
+ *  :return: ``Array(String)`` xtypes of legend types that can be used with
+ *      the provided ``layerRecord``.
+ *  
+ *  Gets an array of legend xtypes that support the provided layer record,
+ *  with optionally provided preferred types listed first.
+ */
+GeoExt.LayerLegend.getTypes = function(layerRecord, preferredTypes) {
+    var types = (preferredTypes || []).concat();
+    var goodTypes = [];
+    for(var type in GeoExt.LayerLegend.types) {
+        if(GeoExt.LayerLegend.types[type].supports(layerRecord)) {
+            // add to goodTypes if not preferred
+            types.indexOf(type) == -1 && goodTypes.push(type);
+        } else {
+            // preferred, but not supported
+            types.remove(type);
+        }
+    }
+    // take the remaining preferred types, and add other good types 
+    return types.concat(goodTypes);
+};
+    
+/** private: method[supports]
+ *  :param layerRecord: :class:`GeoExt.data.LayerRecord` The layer record
+ *      to check support for.
+ *  :return: ``Boolean`` true if this legend type supports the layer
+ *      record.
+ *  
+ *  Checks whether this legend type supports the provided layerRecord.
+ */
+GeoExt.LayerLegend.supports = function(layerRecord) {
+    // to be implemented by subclasses
+};
+
+/** class: constant[GeoExt.LayerLegend.types]
+ *  An object containing a name-class mapping of LayerLegend subclasses.
+ *  To register as LayerLegend, a subclass should add itself to this object:
+ *  
+ *  .. code-block:: javascript
+ *  
+ *      GeoExt.GetLegendGraphicLegend = Ext.extend(GeoExt.LayerLegend, {
+ *      });
+ *      
+ *      GeoExt.LayerLegend.types["getlegendgraphic"] =
+ *          GeoExt.GetLegendGraphicLegend;
+ */
+GeoExt.LayerLegend.types = {};
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/MapPanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/MapPanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/MapPanel.js	(revision 76)
@@ -0,0 +1,387 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerStore.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = MapPanel
+ *  base_link = `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a panel with a new map:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var mapPanel = new GeoExt.MapPanel({
+ *          border: false,
+ *          renderTo: "div-id",
+ *          map: {
+ *              maxExtent: new OpenLayers.Bounds(-90, -45, 90, 45)
+ *          }
+ *      });
+ *     
+ *  Sample code to create a map panel with a bottom toolbar in a Window:
+ * 
+ *  .. code-block:: javascript
+ * 
+ *      var win = new Ext.Window({
+ *          title: "My Map",
+ *          items: [{
+ *              xtype: "gx_mappanel",
+ *              bbar: new Ext.Toolbar()
+ *          }]
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: MapPanel(config)
+ *   
+ *      Create a panel container for a map.
+ */
+GeoExt.MapPanel = Ext.extend(Ext.Panel, {
+
+    /** api: config[map]
+     *  ``OpenLayers.Map or Object``  A configured map or a configuration object
+     *  for the map constructor.  A configured map will be available after
+     *  construction through the :attr:`map` property.
+     */
+
+    /** api: property[map]
+     *  ``OpenLayers.Map`` or ``Object``  A map or map configuration.
+     */
+    map: null,
+    
+    /** api: config[layers]
+     *  ``GeoExt.data.LayerStore or GeoExt.data.GroupingStore or Array(OpenLayers.Layer)``
+     *  A store holding records. The layers provided here will be added to this
+     *  MapPanel's map when it is rendered.
+     */
+    
+    /** api: property[layers]
+     *  :class:`GeoExt.data.LayerStore`  A store containing
+     *  :class:`GeoExt.data.LayerRecord` objects.
+     */
+    layers: null,
+
+    
+    /** api: config[center]
+     *  ``OpenLayers.LonLat or Array(Number)``  A location for the map center.  If
+     *  an array is provided, the first two items should represent x & y coordinates.
+     */
+    center: null,
+
+    /** api: config[zoom]
+     *  ``Number``  An initial zoom level for the map.
+     */
+    zoom: null,
+
+    /** api: config[prettyStateKeys]
+     *  ``Boolean`` Set this to true if you want pretty strings in the MapPanel's
+     *  state keys. More specifically, layer.name instead of layer.id will be used
+     *  in the state keys if this option is set to true. But in that case you have
+     *  to make sure you don't have two layers with the same name. Defaults to 
+     *  false.
+     */
+    prettyStateKeys: false,
+
+    /** api: config[extent]
+     *  ``OpenLayers.Bounds or Array(Number)``  An initial extent for the map (used
+     *  if center and zoom are not provided.  If an array, the first four items
+     *  should be minx, miny, maxx, maxy.
+     */
+    extent: null,
+
+    /** private: property[stateEvents]
+     *  ``Array(String)`` Array of state events
+     */
+    stateEvents: ["aftermapmove",
+                  "afterlayervisibilitychange",
+                  "afterlayeropacitychange"],
+
+    /** private: method[initComponent]
+     *  Initializes the map panel. Creates an OpenLayers map if
+     *  none was provided in the config options passed to the
+     *  constructor.
+     */
+    initComponent: function(){
+        if(!(this.map instanceof OpenLayers.Map)) {
+            this.map = new OpenLayers.Map(
+                Ext.applyIf(this.map || {}, {allOverlays: true})
+            );
+        }
+        var layers = this.layers;
+        if(!layers || layers instanceof Array) {
+            this.layers = new GeoExt.data.LayerStore({
+                layers: layers,
+                map: this.map.layers.length > 0 ? this.map : null
+            });
+        }
+        
+        if(typeof this.center == "string") {
+            this.center = OpenLayers.LonLat.fromString(this.center);
+        } else if(this.center instanceof Array) {
+            this.center = new OpenLayers.LonLat(this.center[0], this.center[1]);
+        }
+        if(typeof this.extent == "string") {
+            this.extent = OpenLayers.Bounds.fromString(this.extent);
+        } else if(this.extent instanceof Array) {
+            this.extent = OpenLayers.Bounds.fromArray(this.extent);
+        }
+        
+        GeoExt.MapPanel.superclass.initComponent.call(this);
+
+        this.addEvents(
+            /** private: event[aftermapmove]
+             *  Fires after the map is moved.
+             */
+            "aftermapmove",
+
+            /** private: event[afterlayervisibilitychange]
+             *  Fires after a layer changed visibility.
+             */
+            "afterlayervisibilitychange",
+
+            /** private: event[afterlayeropacitychange]
+             *  Fires after a layer changed opacity.
+             */
+            "afterlayeropacitychange"
+        );
+        this.map.events.on({
+            "moveend": this.onMoveend,
+            "changelayer": this.onLayerchange,
+            scope: this
+        });
+    },
+
+    /** private: method[onMoveend]
+     *
+     *  The "moveend" listener.
+     */
+    onMoveend: function() {
+        this.fireEvent("aftermapmove");
+    },
+
+    /** private: method[onLayerchange]
+     *  :param e: ``Object``
+     *
+     * The "changelayer" listener.
+     */
+    onLayerchange: function(e) {
+        if(e.property) {
+            if(e.property === "visibility") {
+                this.fireEvent("afterlayervisibilitychange");
+            } else if(e.property === "opacity") {
+                this.fireEvent("afterlayeropacitychange");
+            }
+        }
+    },
+
+    /** private: method[applyState]
+     *  :param state: ``Object`` The state to apply.
+     *
+     *  Apply the state provided as an argument.
+     */
+    applyState: function(state) {
+
+        // if we get strings for state.x, state.y or state.zoom
+        // OpenLayers will take care of converting them to the
+        // appropriate types so we don't bother with that
+        this.center = new OpenLayers.LonLat(state.x, state.y);
+        this.zoom = state.zoom;
+
+        // set layer visibility and opacity
+        var i, l, layer, layerId, visibility, opacity;
+        var layers = this.map.layers;
+        for(i=0, l=layers.length; i<l; i++) {
+            layer = layers[i];
+            layerId = this.prettyStateKeys ? layer.name : layer.id;
+            visibility = state["visibility_" + layerId];
+            if(visibility !== undefined) {
+                // convert to boolean
+                visibility = (/^true$/i).test(visibility);
+                if(layer.isBaseLayer) {
+                    if(visibility) {
+                        this.map.setBaseLayer(layer);
+                    }
+                } else {
+                    layer.setVisibility(visibility);
+                }
+            }
+            opacity = state["opacity_" + layerId];
+            if(opacity !== undefined) {
+                layer.setOpacity(opacity);
+            }
+        }
+    },
+
+    /** private: method[getState]
+     *  :return:  ``Object`` The state.
+     *
+     *  Returns the current state for the map panel.
+     */
+    getState: function() {
+        var state;
+
+        // Ext delays the call to getState when a state event
+        // occurs, so the MapPanel may have been destroyed
+        // between the time the event occurred and the time
+        // getState is called
+        if(!this.map) {
+            return;
+        }
+
+        // record location and zoom level
+        var center = this.map.getCenter();
+        state = {
+            x: center.lon,
+            y: center.lat,
+            zoom: this.map.getZoom()
+        };
+
+        // record layer visibility and opacity
+        var i, l, layer, layerId, layers = this.map.layers;
+        for(i=0, l=layers.length; i<l; i++) {
+            layer = layers[i];
+            layerId = this.prettyStateKeys ? layer.name : layer.id;
+            state["visibility_" + layerId] = layer.getVisibility();
+            state["opacity_" + layerId] = layer.opacity == null ?
+                1 : layer.opacity;
+        }
+
+        return state;
+    },
+
+    /** private: method[updateMapSize]
+     *  Tell the map that it needs to recalculate its size and position.
+     */
+    updateMapSize: function() {
+        if(this.map) {
+            this.map.updateSize();
+        }
+    },
+
+    /** private: method[renderMap]
+     *  Private method called after the panel has been rendered or after it
+     *  has been laid out by its parent's layout.
+     */
+    renderMap: function() {
+        var map = this.map;
+        map.render(this.body.dom);
+
+        this.layers.bind(map);
+
+        if(map.layers.length > 0) {
+            if(this.center || this.zoom != null) {
+                // both do not have to be defined
+                map.setCenter(this.center, this.zoom);
+            } else if(this.extent) {
+                map.zoomToExtent(this.extent);
+            } else {
+                map.zoomToMaxExtent();
+            }
+        }
+    },
+    
+    /** private: method[afterRender]
+     *  Private method called after the panel has been rendered.
+     */
+    afterRender: function() {
+        GeoExt.MapPanel.superclass.afterRender.apply(this, arguments);
+        if(!this.ownerCt) {
+            this.renderMap();
+        } else {
+            this.ownerCt.on("move", this.updateMapSize, this);
+            this.ownerCt.on({
+                "afterlayout": {
+                    fn: this.renderMap,
+                    scope: this,
+                    single: true
+                }
+            });
+        }
+    },
+
+    /** private: method[onResize]
+     *  Private method called after the panel has been resized.
+     */
+    onResize: function() {
+        GeoExt.MapPanel.superclass.onResize.apply(this, arguments);
+        this.updateMapSize();
+    },
+    
+    /** private: method[onBeforeAdd]
+     *  Private method called before a component is added to the panel.
+     */
+    onBeforeAdd: function(item) {
+        if(typeof item.addToMapPanel === "function") {
+            item.addToMapPanel(this);
+        }
+        GeoExt.MapPanel.superclass.onBeforeAdd.apply(this, arguments);
+    },
+    
+    /** private: method[remove]
+     *  Private method called when a component is removed from the panel.
+     */
+    remove: function(item, autoDestroy) {
+        if(typeof item.removeFromMapPanel === "function") {
+            item.removeFromMapPanel(this);
+        }
+        GeoExt.MapPanel.superclass.remove.apply(this, arguments);
+    },
+
+    /** private: method[beforeDestroy]
+     *  Private method called during the destroy sequence.
+     */
+    beforeDestroy: function() {
+        if(this.ownerCt) {
+            this.ownerCt.un("move", this.updateMapSize, this);
+        }
+        if(this.map && this.map.events) {
+            this.map.events.un({
+                "moveend": this.onMoveend,
+                "changelayer": this.onLayerchange,
+                scope: this
+            });
+        }
+        // if the map panel was passed a map instance, this map instance
+        // is under the user's responsibility
+        if(!this.initialConfig.map ||
+           !(this.initialConfig.map instanceof OpenLayers.Map)) {
+            // we created the map, we destroy it
+            if(this.map && this.map.destroy) {
+                this.map.destroy();
+            }
+        }
+        delete this.map;
+        GeoExt.MapPanel.superclass.beforeDestroy.apply(this, arguments);
+    }
+    
+});
+
+/** api: function[guess]
+ *  :return: ``GeoExt.MapPanel`` The first map panel found by the Ext
+ *      component manager.
+ *  
+ *  Convenience function for guessing the map panel of an application. This
+ *     can reliably be used for all applications that just have one map panel
+ *     in the viewport.
+ */
+GeoExt.MapPanel.guess = function() {
+    return Ext.ComponentMgr.all.find(function(o) { 
+        return o instanceof GeoExt.MapPanel; 
+    }); 
+};
+
+
+/** api: xtype = gx_mappanel */
+Ext.reg('gx_mappanel', GeoExt.MapPanel); 
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendImage.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendImage.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/LegendImage.js	(revision 76)
@@ -0,0 +1,103 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = LegendImage
+ *  base_link = `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_
+ */
+
+Ext.namespace('GeoExt');
+
+/** api: constructor
+ *  .. class:: LegendImage(config)
+ *
+ *      Show a legend image in a BoxComponent and make sure load errors are 
+ *      dealt with.
+ */
+GeoExt.LegendImage = Ext.extend(Ext.BoxComponent, {
+
+    /** api: config[url]
+     *  ``String``  The url of the image to load
+     */
+    url: null,
+    
+    /** api: config[defaultImgSrc]
+     *  ``String`` Path to image that will be used if the legend image fails
+     *  to load.  Default is Ext.BLANK_IMAGE_URL.
+     */
+    defaultImgSrc: null,
+
+    /** api: config[imgCls]
+     *  ``String``  Optional css class to apply to img tag
+     */
+    imgCls: null,
+    
+    /** private: method[initComponent]
+     *  Initializes the legend image component. 
+     */
+    initComponent: function() {
+        GeoExt.LegendImage.superclass.initComponent.call(this);
+        if(this.defaultImgSrc === null) {
+            this.defaultImgSrc = Ext.BLANK_IMAGE_URL;
+        }
+        this.autoEl = {
+            tag: "img",
+            "class": (this.imgCls ? this.imgCls : ""),
+            src: this.defaultImgSrc
+        };
+    },
+
+    /** api: method[setUrl]
+     *  :param url: ``String`` The new URL.
+     *  
+     *  Sets the url of the legend image.
+     */
+    setUrl: function(url) {
+        this.url = url;
+        var el = this.getEl();
+        if (el) {
+            el.un("error", this.onImageLoadError, this);
+            el.on("error", this.onImageLoadError, this, {single: true});
+            el.dom.src = url;
+        }
+    },
+
+    /** private: method[onRender]
+     *  Private method called when the legend image component is being
+     *  rendered.
+     */
+    onRender: function(ct, position) {
+        GeoExt.LegendImage.superclass.onRender.call(this, ct, position);
+        if(this.url) {
+            this.setUrl(this.url);
+        }
+    },
+
+    /** private: method[onDestroy]
+     *  Private method called during the destroy sequence.
+     */
+    onDestroy: function() {
+        var el = this.getEl();
+        if(el) {
+            el.un("error", this.onImageLoadError, this);
+        }
+        GeoExt.LegendImage.superclass.onDestroy.apply(this, arguments);
+    },
+    
+    /** private: method[onImageLoadError]
+     *  Private method called if the legend image fails loading.
+     */
+    onImageLoadError: function() {
+        this.getEl().dom.src = this.defaultImgSrc;
+    }
+
+});
+
+/** api: xtype = gx_legendimage */
+Ext.reg('gx_legendimage', GeoExt.LegendImage);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/form.js	(revision 76)
@@ -0,0 +1,184 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt.form");
+
+/** private: function[toFilter]
+ *  :param form: ``Ext.form.BasicForm|Ext.form.FormPanel``
+ *  :param logicalOp: ``String`` Either ``OpenLayers.Filter.Logical.AND`` or
+ *      ``OpenLayers.Filter.Logical.OR``, set to
+ *      ``OpenLayers.Filter.Logical.AND`` if null or undefined
+ *  :param wildcard: ``Integer`` Determines the wildcard behaviour of like
+ *      queries. This behaviour can either be: none, prepend, append or both.
+ *
+ *  :return: ``OpenLayers.Filter``
+ *
+ *  Create an {OpenLayers.Filter} object from a {Ext.form.BasicForm}
+ *      or a {Ext.form.FormPanel} instance.
+ */
+GeoExt.form.toFilter = function(form, logicalOp, wildcard) {
+    if(form instanceof Ext.form.FormPanel) {
+        form = form.getForm();
+    }
+    var filters = [], values = form.getValues(false);
+    for(var prop in values) {
+        var s = prop.split("__");
+
+        var value = values[prop], type;
+
+        if(s.length > 1 && 
+           (type = GeoExt.form.toFilter.FILTER_MAP[s[1]]) !== undefined) {
+            prop = s[0];
+        } else {
+            type = OpenLayers.Filter.Comparison.EQUAL_TO;
+        }
+
+        if (type === OpenLayers.Filter.Comparison.LIKE) {
+            switch(wildcard) {
+                case GeoExt.form.ENDS_WITH:
+                    value = '.*' + value;
+                    break;
+                case GeoExt.form.STARTS_WITH:
+                    value += '.*';
+                    break;
+                case GeoExt.form.CONTAINS:
+                    value = '.*' + value + '.*';
+                    break;
+                default:
+                    // do nothing, just take the value
+                    break;
+            }
+        }
+
+        filters.push(
+            new OpenLayers.Filter.Comparison({
+                type: type,
+                value: value,
+                property: prop
+            })
+        );
+    }
+
+    return new OpenLayers.Filter.Logical({
+        type: logicalOp || OpenLayers.Filter.Logical.AND,
+        filters: filters
+    });
+};
+
+/** private: constant[FILTER_MAP]
+ *  An object mapping operator strings as found in field names to
+ *      ``OpenLayers.Filter.Comparison`` types.
+ */
+GeoExt.form.toFilter.FILTER_MAP = {
+    "eq": OpenLayers.Filter.Comparison.EQUAL_TO,
+    "ne": OpenLayers.Filter.Comparison.NOT_EQUAL_TO,
+    "lt": OpenLayers.Filter.Comparison.LESS_THAN,
+    "le": OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO,
+    "gt": OpenLayers.Filter.Comparison.GREATER_THAN,
+    "ge": OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO,
+    "like": OpenLayers.Filter.Comparison.LIKE
+};
+
+GeoExt.form.ENDS_WITH = 1;
+GeoExt.form.STARTS_WITH = 2;
+GeoExt.form.CONTAINS = 3;
+
+/** private: function[recordToField]
+ *  :param record: ``Ext.data.Record``, typically from an attributeStore
+ *
+ *  :return: ``Object`` An object literal with a xtype property, use
+ *  ``Ext.ComponentMgr.create`` (or ``Ext.create`` in Ext 3) to create
+ *  an ``Ext.form.Field`` from this object.
+ *
+ *  This function can be used to create an ``Ext.form.Field`` from
+ *  an ``Ext.data.Record`` containing name, type, restriction and
+ *  label fields.
+ */
+GeoExt.form.recordToField = function(record) {
+    var type = record.get("type");
+
+    if(typeof type === "object" && type.xtype) {
+        // we have an xtype'd object literal in the type
+        // field, just return it
+        return type;
+    }
+
+    var field;
+
+    var name = record.get("name");
+    var label = record.get("label");
+    var restriction = record.get("restriction") || {};
+
+    // use name for label if label isn't defined in the record
+    if(label == null) {
+        label = name;
+    }
+
+    type = type.split(":").pop(); // remove ns prefix
+
+    var r = GeoExt.form.recordToField.REGEXES;
+
+    if(type.match(r["text"])) {
+        var maxLength = restriction["maxLength"] !== undefined ?
+            parseFloat(restriction["maxLength"]) : undefined;
+        var minLength = restriction["minLength"] !== undefined ?
+            parseFloat(restriction["minLength"]) : undefined;
+        field = {
+            xtype: "textfield",
+            name: name,
+            fieldLabel: label,
+            maxLength: maxLength,
+            minLength: minLength
+        };
+    } else if(type.match(r["number"])) {
+        var maxValue = restriction["maxInclusive"] !== undefined ?
+            parseFloat(restriction["maxInclusive"]) : undefined;
+        var minValue = restriction["minInclusive"] !== undefined ?
+            parseFloat(restriction["minInclusive"]) : undefined;
+        field = {
+            xtype: "numberfield",
+            name: name,
+            fieldLabel: label,
+            maxValue: maxValue,
+            minValue: minValue
+        };
+    } else if(type.match(r["boolean"])) {
+        field = {
+            xtype: "checkbox",
+            name: name,
+            boxLabel: label
+        };
+    } else if(type.match(r["date"])) {
+        field = {
+            xtype: "datefield",
+            fieldLabel: label,
+            name: name
+        };
+    }
+
+    return field;
+}
+
+/** private: constant[REGEXES]
+  *  ``Object`` Regular expressions for determining what type
+  *  of field to create from an attribute record.
+  */
+GeoExt.form.recordToField.REGEXES = {
+    "text": new RegExp(
+        "^(text|string)$", "i"
+    ),
+    "number": new RegExp(
+        "^(number|float|decimal|double|int|long|integer|short)$", "i"
+    ),
+    "boolean": new RegExp(
+        "^(boolean)$", "i"
+    ),
+    "date": new RegExp(
+        "^(dateTime)$", "i"
+    )
+};
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Popup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Popup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/widgets/Popup.js	(revision 76)
@@ -0,0 +1,361 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/widgets/MapPanel.js
+ */
+
+/** api: (define)
+ *  module = GeoExt
+ *  class = Popup
+ *  base_link = `Ext.Window <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window>`_
+ */
+Ext.namespace("GeoExt");
+
+/** api: example
+ *  Sample code to create a popup anchored to a feature:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var popup = new GeoExt.Popup({
+ *          title: "My Popup",
+ *          location: feature,
+ *          width: 200,
+ *          html: "<div>Popup content</div>",
+ *          collapsible: true
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: Popup(config)
+ *   
+ *      Popups are a specialized Window that supports anchoring
+ *      to a particular location in a MapPanel.  When a popup
+ *      is anchored to a location, that means that the popup
+ *      will visibly point to the location on the map, and move
+ *      accordingly when the map is panned or zoomed.
+ */
+GeoExt.Popup = Ext.extend(Ext.Window, {
+
+    /** api: config[anchored]
+     *  ``Boolean``  The popup begins anchored to its location.  Default is
+     *  ``true``.
+     */
+    anchored: true,
+
+    /** api: config[map]
+     *  ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+     *  The map this popup will be anchored to (only required if ``anchored``
+     *  is set to true and the map cannot be derived from the ``location``'s
+     *  layer.
+     */
+    map: null,
+
+    /** api: config[panIn]
+     *  ``Boolean`` The popup should pan the map so that the popup is
+     *  fully in view when it is rendered.  Default is ``true``.
+     */
+    panIn: true,
+
+    /** api: config[unpinnable]
+     *  ``Boolean`` The popup should have a "unpin" tool that unanchors it from
+     *  its location.  Default is ``true``.
+     */
+    unpinnable: true,
+
+    /** api: config[location]
+     *  ``OpenLayers.Feature.Vector`` or ``OpenLayers.LonLat`` or
+     *  ``OpenLayers.Pixel`` or ``OpenLayers.Geometry`` A location for this 
+     *  popup's anchor.
+     */
+    
+    /** private: property[location]
+     *  ``OpenLayers.LonLat``
+     */
+    location: null,
+
+    /**
+     * Some Ext.Window defaults need to be overriden here
+     * because some Ext.Window behavior is not currently supported.
+     */    
+
+    /** private: config[animCollapse]
+     *  ``Boolean`` Animate the transition when the panel is collapsed.
+     *  Default is ``false``.  Collapsing animation is not supported yet for
+     *  popups.
+     */
+    animCollapse: false,
+
+    /** private: config[draggable]
+     *  ``Boolean`` Enable dragging of this Panel.  Defaults to ``false``
+     *  because the popup defaults to being anchored, and anchored popups
+     *  should not be draggable.
+     */
+    draggable: false,
+
+    /** private: config[shadow]
+     *  ``Boolean`` Give the popup window a shadow.  Defaults to ``false``
+     *  because shadows are not supported yet for popups (the shadow does
+     *  not look good with the anchor).
+     */
+    shadow: false,
+
+    /** api: config[popupCls]
+     *  ``String`` CSS class name for the popup DOM elements.  Default is
+     *  "gx-popup".
+     */
+    popupCls: "gx-popup",
+
+    /** api: config[ancCls]
+     *  ``String``  CSS class name for the popup's anchor.
+     */
+    ancCls: null,
+
+    /** private: method[initComponent]
+     *  Initializes the popup.
+     */
+    initComponent: function() {
+        if(this.map instanceof GeoExt.MapPanel) {
+            this.map = this.map.map;
+        }
+        if(!this.map && this.location instanceof OpenLayers.Feature.Vector &&
+                                                        this.location.layer) {
+            this.map = this.location.layer.map;
+        }
+        if (this.location instanceof OpenLayers.Feature.Vector) {
+            this.location = this.location.geometry;
+        }
+        if (this.location instanceof OpenLayers.Geometry) {
+            if (typeof this.location.getCentroid == "function") {
+                this.location = this.location.getCentroid();
+            }
+            this.location = this.location.getBounds().getCenterLonLat();
+        } else if (this.location instanceof OpenLayers.Pixel) {
+            this.location = this.map.getLonLatFromViewPortPx(this.location);
+        }
+
+        if(this.anchored) {
+            this.addAnchorEvents();
+        }
+
+        this.baseCls = this.popupCls + " " + this.baseCls;
+
+        this.elements += ',anc';
+
+        GeoExt.Popup.superclass.initComponent.call(this);
+    },
+
+    /** private: method[onRender]
+     *  Executes when the popup is rendered.
+     */
+    onRender: function(ct, position) {
+        GeoExt.Popup.superclass.onRender.call(this, ct, position);
+        this.ancCls = this.popupCls + "-anc";
+
+        //create anchor dom element.
+        this.createElement("anc", this.el.dom);
+    },
+
+    /** private: method[initTools]
+     *  Initializes the tools on the popup.  In particular,
+     *  it adds the 'unpin' tool if the popup is unpinnable.
+     */
+    initTools : function() {
+        if(this.unpinnable) {
+            this.addTool({
+                id: 'unpin',
+                handler: this.unanchorPopup.createDelegate(this, [])
+            });
+        }
+
+        GeoExt.Popup.superclass.initTools.call(this);
+    },
+
+    /** private: method[show]
+     *  Override.
+     */
+    show: function() {
+        GeoExt.Popup.superclass.show.apply(this, arguments);
+        if(this.anchored) {
+            this.position();
+            if(this.panIn && !this._mapMove) {
+                this.panIntoView();
+            }
+        }
+    },
+    
+    /** private: method[maximize]
+     *  Override.
+     */
+    maximize: function() {
+        if(!this.maximized && this.anc) {
+            this.unanchorPopup();
+        }
+        GeoExt.Popup.superclass.maximize.apply(this, arguments);
+    },
+    
+    /** api: method[setSize]
+     *  :param w: ``Integer``
+     *  :param h: ``Integer``
+     *  
+     *  Sets the size of the popup, taking into account the size of the anchor.
+     */
+    setSize: function(w, h) {
+        if(this.anc) {
+            var ancSize = this.anc.getSize();
+            if(typeof w == 'object') {
+                h = w.height - ancSize.height;
+                w = w.width;
+            } else if(!isNaN(h)){
+                h = h - ancSize.height;
+            }
+        }
+        GeoExt.Popup.superclass.setSize.call(this, w, h);
+    },
+
+    /** private: method[position]
+     *  Positions the popup relative to its location
+     */
+    position: function() {
+        if(this._mapMove === true) {
+            var visible = this.map.getExtent().containsLonLat(this.location);
+            if(visible !== this.isVisible()) {
+                this.setVisible(visible);
+            }
+        }
+
+        if(this.isVisible()) {
+            var centerPx = this.map.getViewPortPxFromLonLat(this.location);
+            var mapBox = Ext.fly(this.map.div).getBox(); 
+    
+            //This works for positioning with the anchor on the bottom.
+            
+            var anc = this.anc;
+            var dx = anc.getLeft(true) + anc.getWidth() / 2;
+            var dy = this.el.getHeight();
+    
+            //Assuming for now that the map viewport takes up
+            //the entire area of the MapPanel
+            this.setPosition(centerPx.x + mapBox.x - dx, centerPx.y + mapBox.y - dy);
+        }
+    },
+
+    /** private: method[unanchorPopup]
+     *  Unanchors a popup from its location.  This removes the popup from its
+     *  MapPanel and adds it to the page body.
+     */
+    unanchorPopup: function() {
+        this.removeAnchorEvents();
+        
+        //make the window draggable
+        this.draggable = true;
+        this.header.addClass("x-window-draggable");
+        this.dd = new Ext.Window.DD(this);
+
+        //remove anchor
+        this.anc.remove();
+        this.anc = null;
+
+        //hide unpin tool
+        this.tools.unpin.hide();
+    },
+
+    /** private: method[panIntoView]
+     *  Pans the MapPanel's map so that an anchored popup can come entirely
+     *  into view, with padding specified as per normal OpenLayers.Map popup
+     *  padding.
+     */ 
+    panIntoView: function() {
+        var mapBox = Ext.fly(this.map.div).getBox(); 
+
+        //assumed viewport takes up whole body element of map panel
+        var popupPos =  this.getPosition(true);
+        popupPos[0] -= mapBox.x;
+        popupPos[1] -= mapBox.y;
+       
+        var panelSize = [mapBox.width, mapBox.height]; // [X,Y]
+
+        var popupSize = this.getSize();
+
+        var newPos = [popupPos[0], popupPos[1]];
+
+        //For now, using native OpenLayers popup padding.  This may not be ideal.
+        var padding = this.map.paddingForPopups;
+
+        // X
+        if(popupPos[0] < padding.left) {
+            newPos[0] = padding.left;
+        } else if(popupPos[0] + popupSize.width > panelSize[0] - padding.right) {
+            newPos[0] = panelSize[0] - padding.right - popupSize.width;
+        }
+
+        // Y
+        if(popupPos[1] < padding.top) {
+            newPos[1] = padding.top;
+        } else if(popupPos[1] + popupSize.height > panelSize[1] - padding.bottom) {
+            newPos[1] = panelSize[1] - padding.bottom - popupSize.height;
+        }
+
+        var dx = popupPos[0] - newPos[0];
+        var dy = popupPos[1] - newPos[1];
+
+        this.map.pan(dx, dy);
+    },
+    
+    /** private: method[onMapMove]
+     */
+    onMapMove: function() {
+        this._mapMove = true;
+        this.position();
+        delete this._mapMove;
+    },
+    
+    /** private: method[addAnchorEvents]
+     */
+    addAnchorEvents: function() {
+        this.map.events.on({
+            "move" : this.onMapMove,
+            scope : this            
+        });
+        
+        this.on({
+            "resize": this.position,
+            "collapse": this.position,
+            "expand": this.position,
+            scope: this
+        });
+    },
+    
+    /** private: method[removeAnchorEvents]
+     */
+    removeAnchorEvents: function() {
+        //stop position with location
+        this.map.events.un({
+            "move" : this.onMapMove,
+            scope : this
+        });
+
+        this.un("resize", this.position, this);
+        this.un("collapse", this.position, this);
+        this.un("expand", this.position, this);
+
+    },
+
+    /** private: method[beforeDestroy]
+     *  Cleanup events before destroying the popup.
+     */
+    beforeDestroy: function() {
+        if(this.anchored) {
+            this.removeAnchorEvents();
+        }
+        GeoExt.Popup.superclass.beforeDestroy.call(this);
+    }
+});
+
+/** api: xtype = gx_popup */
+Ext.reg('gx_popup', GeoExt.Popup); 
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ScaleStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ScaleStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ScaleStore.js	(revision 76)
@@ -0,0 +1,130 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = ScaleStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: ScaleStore
+ *
+ *      A store that contains a cache of available zoom levels.  The store can
+ *      optionally be kept synchronized with an ``OpenLayers.Map`` or
+ *      :class:`GeoExt.MapPanel` object.
+ *
+ *      Records have the following fields:
+ *
+ *      * level - ``Number``  The zoom level.
+ *      * scale - ``Number`` The scale denominator.
+ *      * resolution - ``Number`` The map units per pixel.
+ */
+GeoExt.data.ScaleStore = Ext.extend(Ext.data.Store, {
+
+    /** api: config[map]
+     *  ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+     *  Optional map or map panel from which to derive scale values.
+     */
+    map: null,
+
+    /** private: method[constructor]
+     *  Construct a ScaleStore from a configuration.  The ScaleStore accepts
+     *  some custom parameters addition to the fields accepted by Ext.Store.
+     */
+    constructor: function(config) {
+        var map = (config.map instanceof GeoExt.MapPanel ? config.map.map : config.map);
+        delete config.map;
+        config = Ext.applyIf(config, {reader: new Ext.data.JsonReader({}, [
+            "level",
+            "resolution",
+            "scale"
+        ])});
+
+        GeoExt.data.ScaleStore.superclass.constructor.call(this, config);
+
+        if (map) {
+            this.bind(map);
+        }
+    },
+
+    /** api: method[bind]
+     *  :param map: :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` Panel or map
+     *      to which we should bind.
+     *  
+     *  Bind this store to a map; that is, maintain the zoom list in sync with
+     *  the map's current configuration.  If the map does not currently have a
+     *  set scale list, then the store will remain empty until the map is
+     *  configured with one.
+     */
+    bind: function(map, options) {
+        this.map = (map instanceof GeoExt.MapPanel ? map.map : map);
+        this.map.events.register('changebaselayer', this, this.populateFromMap);
+        if (this.map.baseLayer) {
+            this.populateFromMap();
+        } else {
+            this.map.events.register('addlayer', this, this.populateOnAdd);
+        }
+    },
+
+    /** api: method[unbind]
+     *  Un-bind this store from the map to which it is currently bound.  The
+     *  currently stored zoom levels will remain, but no further changes from
+     *  the map will affect it.
+     */
+    unbind: function() {
+        if (this.map) {
+            this.map.events.unregister('addlayer', this, this.populateOnAdd);
+            this.map.events.unregister('changebaselayer', this, this.populateFromMap);
+            delete this.map;
+        }
+    },
+
+    /** private: method[populateOnAdd]
+     *  :param evt: ``Object``
+     *  
+     *  This method handles the case where we have bind() called on a
+     *  not-fully-configured map so that the zoom levels can be detected when a
+     *  baselayer is finally added.
+     */
+    populateOnAdd: function(evt) {
+        if (evt.layer.isBaseLayer) {
+            this.populateFromMap();
+            this.map.events.unregister('addlayer', this, this.populateOnAdd);
+        }
+    },
+
+    /** private: method[populateFromMap]
+     *  This method actually loads the zoom level information from the
+     *  OpenLayers.Map and converts it to Ext Records.
+     */
+    populateFromMap: function() {
+        var zooms = [];
+        var resolutions = this.map.baseLayer.resolutions;
+        var units = this.map.baseLayer.units;
+
+        for (var i=resolutions.length-1; i >= 0; i--) {
+            var res = resolutions[i];
+            zooms.push({
+                level: i,
+                resolution: res,
+                scale: OpenLayers.Util.getScaleFromResolution(res, units)
+            });
+        }
+
+        this.loadData(zooms);
+    },
+
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        this.unbind();
+        GeoExt.data.ScaleStore.superclass.destroy.apply(this, arguments);
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintProvider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintProvider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintProvider.js	(revision 76)
@@ -0,0 +1,736 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = PrintProvider
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: example
+ *  Minimal code to print as much of the current map extent as possible as
+ *  soon as the print service capabilities are loaded, using the first layout
+ *  reported by the print service:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var mapPanel = new GeoExt.MapPanel({
+ *          renderTo: "mappanel",
+ *          layers: [new OpenLayers.Layer.WMS("wms", "/geoserver/wms",
+ *              {layers: "topp:tasmania_state_boundaries"})],
+ *          center: [146.56, -41.56],
+ *          zoom: 7
+ *      });
+ *      var printProvider = new GeoExt.data.PrintProvider({
+ *          url: "/geoserver/pdf",
+ *          listeners: {
+ *              "loadcapabilities": function() {
+ *                  var printPage = new GeoExt.data.PrintPage({
+ *                      printProvider: printProvider
+ *                  });
+ *                  printPage.fit(mapPanel, true);
+ *                  printProvider.print(mapPanel, printPage);
+ *              }
+ *          }
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: PrintProvider
+ * 
+ *  Provides an interface to a Mapfish or GeoServer print module. For printing,
+ *  one or more instances of :class:`GeoExt.data.PrintPage` are also required
+ *  to tell the PrintProvider about the scale and extent (and optionally
+ *  rotation) of the page(s) we want to print. 
+ */
+GeoExt.data.PrintProvider = Ext.extend(Ext.util.Observable, {
+    
+    /** api: config[url]
+     *  ``String`` Base url of the print service. Only required if
+     *  ``capabilities`` is not provided. This
+     *  is usually something like http://path/to/mapfish/print for Mapfish,
+     *  and http://path/to/geoserver/pdf for GeoServer with the printing
+     *  extension installed. This property requires that the print service is
+     *  at the same origin as the application (or accessible via proxy).
+     */
+    
+    /** private:  property[url]
+     *  ``String`` Base url of the print service. Will always have a trailing
+     *  "/".
+     */
+    url: null,
+    
+    /** api: config[autoLoad]
+     *  ``Boolean`` If set to true, the capabilities will be loaded upon
+     *  instance creation, and ``loadCapabilities`` does not need to be called
+     *  manually. Setting this when ``capabilities`` and no ``url`` is provided
+     *  has no effect. Default is false.
+     */
+
+    /** api: config[capabilities]
+     *  ``Object`` Capabilities of the print service. Only required if ``url``
+     *  is not provided. This is the object returned by the ``info.json``
+     *  endpoint of the print service, and is usually obtained by including a
+     *  script tag pointing to
+     *  http://path/to/printservice/info.json?var=myvar in the head of the
+     *  html document, making the capabilities accessible as ``window.myvar``.
+     *  This property should be used when no local print service or proxy is
+     *  available, or when you do not listen for the ``loadcapabilities``
+     *  events before creating components that require the PrintProvider's
+     *  capabilities to be available.
+     */
+    
+    /** private: property[capabilities]
+     *  ``Object`` Capabilities as returned from the print service.
+     */
+    capabilities: null,
+    
+    /** api: config[method]
+     *  ``String`` Either ``POST`` or ``GET`` (case-sensitive). Method to use
+     *  when sending print requests to the servlet. If the print service is at
+     *  the same origin as the application (or accessible via proxy), then
+     *  ``POST`` is recommended. Use ``GET`` when accessing a remote print
+     *  service with no proxy available, but expect issues with character
+     *  encoding and URLs exceeding the maximum length. Default is ``POST``.
+     */
+    
+    /** private: property[method]
+     *  ``String`` Either ``POST`` or ``GET`` (case-sensitive). Method to use
+     *  when sending print requests to the servlet.
+     */
+    method: "POST",
+
+    /** api: config[customParams]
+     *  ``Object`` Key-value pairs of custom data to be sent to the print
+     *  service. Optional. This is e.g. useful for complex layout definitions
+     *  on the server side that require additional parameters.
+     */
+    
+    /** api: property[customParams]
+     *  ``Object`` Key-value pairs of custom data to be sent to the print
+     *  service. Optional. This is e.g. useful for complex layout definitions
+     *  on the server side that require additional parameters.
+     */
+    customParams: null,
+    
+    /** api: config[baseParams]
+     *  ``Object`` Key-value pairs of base params to be add to every 
+     *  request to the service. Optional. 
+     */
+    
+    /** api: property[scales]
+     *  ``Ext.data.JsonStore`` read-only. A store representing the scales
+     *  available.
+     *  
+     *  Fields of records in this store:
+     *  
+     *  * name - ``String`` the name of the scale
+     *  * value - ``Float`` the scale denominator
+     */
+    scales: null,
+    
+    /** api: property[dpis]
+     *  ``Ext.data.JsonStore`` read-only. A store representing the dpis
+     *  available.
+     *  
+     *  Fields of records in this store:
+     *  
+     *  * name - ``String`` the name of the dpi
+     *  * value - ``Float`` the dots per inch
+     */
+    dpis: null,
+        
+    /** api: property[layouts]
+     *  ``Ext.data.JsonStore`` read-only. A store representing the layouts
+     *  available.
+     *  
+     *  Fields of records in this store:
+     *  
+     *  * name - ``String`` the name of the layout
+     *  * size - ``Object`` width and height of the map in points
+     *  * rotation - ``Boolean`` indicates if rotation is supported
+     */
+    layouts: null,
+    
+    /** api: property[dpi]
+     *  ``Ext.data.Record`` the record for the currently used resolution.
+     *  Read-only, use ``setDpi`` to set the value.
+     */
+    dpi: null,
+
+    /** api: property[layout]
+     *  ``Ext.data.Record`` the record of the currently used layout. Read-only,
+     *  use ``setLayout`` to set the value.
+     */
+    layout: null,
+
+    /** private:  method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        this.initialConfig = config;
+        Ext.apply(this, config);
+        
+        if(!this.customParams) {
+            this.customParams = {};
+        }
+
+        this.addEvents(
+            /** api: event[loadcapabilities]
+             *  Triggered when the capabilities have finished loading. This
+             *  event will only fire when ``capabilities`` is not  configured.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * capabilities - ``Object`` the capabilities
+             */
+            "loadcapabilities",
+            
+            /** api: event[layoutchange]
+             *  Triggered when the layout is changed.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * layout - ``Ext.data.Record`` the new layout
+             */
+            "layoutchange",
+
+            /** api: event[dpichange]
+             *  Triggered when the dpi value is changed.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * dpi - ``Ext.data.Record`` the new dpi record
+             */
+            "dpichange",
+            
+            /** api: event[beforeprint]
+             *  Triggered when the print method is called.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * map - ``OpenLayers.Map`` the map being printed
+             *  * pages - Array of :class:`GeoExt.data.PrintPage` the print
+             *    pages being printed
+             *  * options - ``Object`` the options to the print command
+             */
+            "beforeprint",
+            
+            /** api: event[print]
+             *  Triggered when the print document is opened.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * url - ``String`` the url of the print document
+             */
+            "print",
+
+            /** api: event[printexception]
+             *  Triggered when using the ``POST`` method, when the print
+             *  backend returns an exception.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * response - ``Object`` the response object of the XHR
+             */
+            "printexception",
+
+            /** api: event[beforeencodelayer]
+             *  Triggered before a layer is encoded. This can be used to
+             *  exclude layers from the printing, by having the listener
+             *  return false.
+             *
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * layer - ``OpenLayers.Layer`` the layer which is about to be 
+             *    encoded.
+             */
+            "beforeencodelayer",
+            
+            /** api: event[encodelayer]
+             *  Triggered when a layer is encoded. This can be used to modify
+             *  the encoded low-level layer object that will be sent to the
+             *  print service.
+             *  
+             *  Listener arguments:
+             *
+             *  * printProvider - :class:`GeoExt.data.PrintProvider` this
+             *    PrintProvider
+             *  * layer - ``OpenLayers.Layer`` the layer which is about to be 
+             *    encoded.
+             *  * encodedLayer - ``Object`` the encoded layer that will be
+             *    sent to the print service.
+             */
+            "encodelayer"
+
+        );
+        
+        GeoExt.data.PrintProvider.superclass.constructor.apply(this, arguments);
+
+        this.scales = new Ext.data.JsonStore({
+            root: "scales",
+            sortInfo: {field: "value", direction: "DESC"},
+            fields: ["name", {name: "value", type: "float"}]
+        });
+        
+        this.dpis = new Ext.data.JsonStore({
+            root: "dpis",
+            fields: ["name", {name: "value", type: "float"}]
+        });
+        
+        this.layouts = new Ext.data.JsonStore({
+            root: "layouts",
+            fields: [
+                "name",
+                {name: "size", mapping: "map"},
+                {name: "rotation", type: "boolean"}
+            ]
+        });
+        
+        if(config.capabilities) {
+            this.loadStores();
+        } else {
+            if(this.url.split("/").pop()) {
+                this.url += "/";            
+            }
+            this.initialConfig.autoLoad && this.loadCapabilities();
+        }
+    },
+    
+    /** api: method[setLayout]
+     *  :param layout: ``Ext.data.Record`` the record of the layout.
+     *  
+     *  Sets the layout for this printProvider.
+     */
+    setLayout: function(layout) {
+        this.layout = layout;
+        this.fireEvent("layoutchange", this, layout);
+    },
+    
+    /** api: method[setDpi]
+     *  :param dpi: ``Ext.data.Record`` the dpi record.
+     *  
+     *  Sets the dpi for this printProvider.
+     */
+    setDpi: function(dpi) {
+        this.dpi = dpi;
+        this.fireEvent("dpichange", this, dpi);
+    },
+
+    /** api: method[print]
+     *  :param map: ``GeoExt.MapPanel`` or ``OpenLayers.Map`` The map to print.
+     *  :param pages: ``Array`` of :class:`GeoExt.data.PrintPage` or
+     *      :class:`GeoExt.data.PrintPage` page(s) to print.
+     *  :param options: ``Object`` of additional options, see below.
+     *  
+     *  Sends the print command to the print service and opens a new window
+     *  with the resulting PDF.
+     *  
+     *  Valid properties for the ``options`` argument:
+     *
+     *      * ``legend`` - :class:`GeoExt.LegendPanel` If provided, the legend
+     *        will be added to the print document. For the printed result to
+     *        look like the LegendPanel, the following ``!legends`` block
+     *        should be included in the ``items`` of your page layout in the
+     *        print module's configuration file:
+     *        
+     *        .. code-block:: none
+     *        
+     *          - !legends
+     *              maxIconWidth: 0
+     *              maxIconHeight: 0
+     *              classIndentation: 0
+     *              layerSpace: 5
+     *              layerFontSize: 10
+     *
+     *      * ``overview`` - :class:`OpenLayers.Control.OverviewMap` If provided,
+     *        the layers for the overview map in the printout will be taken from
+     *        the OverviewMap control. If not provided, the print service will
+     *        use the main map's layers for the overview map. Applies only for
+     *        layouts configured to print an overview map.
+     */
+    print: function(map, pages, options) {
+        if(map instanceof GeoExt.MapPanel) {
+            map = map.map;
+        }
+        pages = pages instanceof Array ? pages : [pages];
+        options = options || {};
+        if(this.fireEvent("beforeprint", this, map, pages, options) === false) {
+            return;
+        }
+
+        var jsonData = Ext.apply({
+            units: map.getUnits(),
+            srs: map.baseLayer.projection.getCode(),
+            layout: this.layout.get("name"),
+            dpi: this.dpi.get("value")
+        }, this.customParams);
+
+        var pagesLayer = pages[0].feature.layer;
+        var encodedLayers = [];
+        Ext.each(map.layers, function(layer){
+            if(layer !== pagesLayer && layer.getVisibility() === true) {
+                var enc = this.encodeLayer(layer);
+                enc && encodedLayers.push(enc);
+            }
+        }, this);
+        jsonData.layers = encodedLayers;
+        
+        var encodedPages = [];
+        Ext.each(pages, function(page) {
+            encodedPages.push(Ext.apply({
+                center: [page.center.lon, page.center.lat],
+                scale: page.scale.get("value"),
+                rotation: page.rotation
+            }, page.customParams));
+        }, this);
+        jsonData.pages = encodedPages;
+        
+        if (options.overview) {
+            var encodedOverviewLayers = [];
+            Ext.each(options.overview.layers, function(layer) {
+                var enc = this.encodeLayer(layer);
+                enc && encodedOverviewLayers.push(enc);
+            }, this);
+            jsonData.overviewLayers = encodedOverviewLayers;
+        }
+
+        if(options.legend) {
+            var legend = options.legend;
+            var rendered = legend.rendered;
+            if (!rendered) {
+                legend = legend.cloneConfig({
+                    renderTo: document.body,
+                    hidden: true
+                });
+            }
+            var encodedLegends = [];
+            legend.items.each(function(cmp) {
+                if(!cmp.hidden) {
+                    var encFn = this.encoders.legends[cmp.getXType()];
+                    encodedLegends = encodedLegends.concat(
+                        encFn.call(this, cmp));
+                }
+            }, this);
+            if (!rendered) {
+                legend.destroy();
+            }
+            jsonData.legends = encodedLegends;
+        }
+
+        if(this.method === "GET") {
+            var url = Ext.urlAppend(this.capabilities.printURL,
+                "spec=" + encodeURIComponent(Ext.encode(jsonData)));
+            window.open(url);
+            this.fireEvent("print", this, url);
+        } else {
+            Ext.Ajax.request({
+                url: this.capabilities.createURL,
+                jsonData: jsonData,
+                success: function(response) {
+                    // In IE, using a Content-disposition: attachment header
+                    // may make it hard or impossible to download the pdf due
+                    // to security settings. So we'll display the pdf inline.
+                    var url = Ext.decode(response.responseText).getURL +
+                        (Ext.isIE ? "?inline=true" : "");
+                    if(Ext.isOpera || Ext.isIE) {
+                        // Make sure that Opera and IE don't replace the
+                        // content tab with the pdf
+                        window.open(url);
+                    } else {
+                        // This avoids popup blockers for all other browsers
+                        window.location.href = url;                        
+                    } 
+                    this.fireEvent("print", this, url);
+                },
+                failure: function(response) {
+                    this.fireEvent("printexception", this, response);
+                },
+                params: this.initialConfig.baseParams,
+                scope: this
+            });
+        }
+    },
+    
+    /** api: method[loadCapabilities]
+     *
+     *  Loads the capabilities from the print service. If this instance is
+     *  configured with either ``capabilities`` or a ``url`` and ``autoLoad``
+     *  set to true, then this method does not need to be called from the
+     *  application.
+     */
+    loadCapabilities: function() {
+        if (!this.url) {
+            return;
+        }
+        var url = this.url + "info.json";
+        Ext.Ajax.request({
+            url: url,
+            method: "GET",
+            disableCaching: false,
+            success: function(response) {
+                this.capabilities = Ext.decode(response.responseText);
+                this.loadStores();
+            },
+            params: this.initialConfig.baseParams,
+            scope: this
+        });
+    },
+    
+    /** private: method[loadStores]
+     */
+    loadStores: function() {
+        this.scales.loadData(this.capabilities);
+        this.dpis.loadData(this.capabilities);
+        this.layouts.loadData(this.capabilities);
+        
+        this.setLayout(this.layouts.getAt(0));
+        this.setDpi(this.dpis.getAt(0));
+        this.fireEvent("loadcapabilities", this, this.capabilities);
+    },
+        
+    /** private: method[encodeLayer]
+     *  :param layer: ``OpenLayers.Layer``
+     *  :return: ``Object``
+     * 
+     *  Encodes a layer for the print service.
+     */
+    encodeLayer: function(layer) {
+        var encLayer;
+        for(var c in this.encoders.layers) {
+            if(OpenLayers.Layer[c] && layer instanceof OpenLayers.Layer[c]) {
+                if(this.fireEvent("beforeencodelayer", this, layer) === false) {
+                    return;
+                }
+                encLayer = this.encoders.layers[c].call(this, layer);
+                this.fireEvent("encodelayer", this, layer, encLayer);
+                break;
+            }
+        }
+        // only return the encLayer object when we have a type. Prevents a
+        // fallback on base encoders like HTTPRequest.
+        return (encLayer && encLayer.type) ? encLayer : null;
+    },
+
+    /** private: method[getAbsoluteUrl]
+     *  :param url: ``String``
+     *  :return: ``String``
+     *  
+     *  Converts the provided url to an absolute url.
+     */
+    getAbsoluteUrl: function(url) {
+        var a;
+        if(Ext.isIE) {
+            a = document.createElement("<a href='" + url + "'/>");
+            a.style.display = "none";
+            document.body.appendChild(a);
+            a.href = a.href;
+            document.body.removeChild(a);
+        } else {
+            a = document.createElement("a");
+            a.href = url;
+        }
+        return a.href;
+    },
+    
+    /** private: property[encoders]
+     *  ``Object`` Encoders for all print content
+     */
+    encoders: {
+        "layers": {
+            "WMS": function(layer) {
+                var enc = this.encoders.layers.HTTPRequest.call(this, layer);
+                Ext.apply(enc, {
+                    type: 'WMS',
+                    layers: [layer.params.LAYERS].join(",").split(","),
+                    format: layer.params.FORMAT,
+                    styles: [layer.params.STYLES].join(",").split(",")
+                });
+                var param;
+                for(var p in layer.params) {
+                    param = p.toLowerCase();
+                    if(!layer.DEFAULT_PARAMS[param] &&
+                    "layers,styles,width,height,srs".indexOf(param) == -1) {
+                        if(!enc.customParams) {
+                            enc.customParams = {};
+                        }
+                        enc.customParams[p] = layer.params[p];
+                    }
+                }
+                return enc;
+            },
+            "OSM": function(layer) {
+                var enc = this.encoders.layers.TileCache.call(this, layer);
+                return Ext.apply(enc, {
+                    type: 'OSM',
+                    baseURL: enc.baseURL.substr(0, enc.baseURL.indexOf("$")),
+                    extension: "png"
+                });
+            },
+            "TMS": function(layer) {
+                var enc = this.encoders.layers.TileCache.call(this, layer);
+                return Ext.apply(enc, {
+                    type: 'TMS',
+                    format: layer.type
+                });
+            },
+            "TileCache": function(layer) {
+                var enc = this.encoders.layers.HTTPRequest.call(this, layer);
+                return Ext.apply(enc, {
+                    type: 'TileCache',
+                    layer: layer.layername,
+                    maxExtent: layer.maxExtent.toArray(),
+                    tileSize: [layer.tileSize.w, layer.tileSize.h],
+                    extension: layer.extension,
+                    resolutions: layer.serverResolutions || layer.resolutions
+                });
+            },
+            "KaMapCache": function(layer) {
+                var enc = this.encoders.layers.KaMap.call(this, layer);
+                return Ext.apply(enc, {
+                    type: 'KaMapCache',
+                    // group param is mandatory when using KaMapCache
+                    group: layer.params['g'],
+                    metaTileWidth: layer.params['metaTileSize']['w'],
+                    metaTileHeight: layer.params['metaTileSize']['h']
+                });
+            },
+            "KaMap": function(layer) {
+                var enc = this.encoders.layers.HTTPRequest.call(this, layer);
+                return Ext.apply(enc, {
+                    type: 'KaMap',
+                    map: layer.params['map'],
+                    extension: layer.params['i'],
+                    // group param is optional when using KaMap
+                    group: layer.params['g'] || "",
+                    maxExtent: layer.maxExtent.toArray(),
+                    tileSize: [layer.tileSize.w, layer.tileSize.h],
+                    resolutions: layer.serverResolutions || layer.resolutions
+                });
+            },
+            "HTTPRequest": function(layer) {
+                return {
+                    baseURL: this.getAbsoluteUrl(layer.url instanceof Array ?
+                        layer.url[0] : layer.url),
+                    opacity: (layer.opacity != null) ? layer.opacity : 1.0,
+                    singleTile: layer.singleTile
+                };
+            },
+            "Image": function(layer) {
+                return {
+                    type: 'Image',
+                    baseURL: this.getAbsoluteUrl(layer.getURL(layer.extent)),
+                    opacity: (layer.opacity != null) ? layer.opacity : 1.0,
+                    extent: layer.extent.toArray(),
+                    pixelSize: [layer.size.w, layer.size.h],
+                    name: layer.name
+                };
+            },
+            "Vector": function(layer) {
+                if(!layer.features.length) {
+                    return;
+                }
+                
+                var encFeatures = [];
+                var encStyles = {};
+                var features = layer.features;
+                var featureFormat = new OpenLayers.Format.GeoJSON();
+                var styleFormat = new OpenLayers.Format.JSON();
+                var nextId = 1;
+                var styleDict = {};
+                var feature, style, dictKey, dictItem, styleName;
+                for(var i=0, len=features.length; i<len; ++i) {
+                    feature = features[i];
+                    style = feature.style || layer.style ||
+                    layer.styleMap.createSymbolizer(feature,
+                        feature.renderIntent);
+                    dictKey = styleFormat.write(style);
+                    dictItem = styleDict[dictKey];
+                    if(dictItem) {
+                        //this style is already known
+                        styleName = dictItem;
+                    } else {
+                        //new style
+                        styleDict[dictKey] = styleName = nextId++;
+                        if(style.externalGraphic) {
+                            encStyles[styleName] = Ext.applyIf({
+                                externalGraphic: this.getAbsoluteUrl(
+                                    style.externalGraphic)}, style);
+                        } else {
+                            encStyles[styleName] = style;
+                        }
+                    }
+                    var featureGeoJson = featureFormat.extract.feature.call(
+                        featureFormat, feature);
+                    
+                    featureGeoJson.properties = OpenLayers.Util.extend({
+                        _gx_style: styleName
+                    }, featureGeoJson.properties);
+                    
+                    encFeatures.push(featureGeoJson);
+                }
+                
+                return {
+                    type: 'Vector',
+                    styles: encStyles,
+                    styleProperty: '_gx_style',
+                    geoJson: {
+                        type: "FeatureCollection",
+                        features: encFeatures
+                    },
+                    name: layer.name,
+                    opacity: (layer.opacity != null) ? layer.opacity : 1.0
+                };
+            }
+        },
+        "legends": {
+            "gx_wmslegend": function(legend) {
+                var enc = this.encoders.legends.base.call(this, legend);
+                var icons = [];
+                for(var i=1, len=legend.items.getCount(); i<len; ++i) {
+                    icons.push(this.getAbsoluteUrl(legend.items.get(i).url));
+                }
+                enc[0].classes[0] = {
+                    name: "",
+                    icons: icons
+                };
+                return enc;
+            },
+            "gx_urllegend": function(legend) {
+                var enc = this.encoders.legends.base.call(this, legend);
+                enc[0].classes.push({
+                    name: "",
+                    icon: this.getAbsoluteUrl(legend.items.get(1).url)
+                });
+                return enc;
+            },
+            "base": function(legend){
+                return [{
+                    name: legend.items.get(0).text,
+                    classes: []
+                }];
+            }
+        }
+    }
+    
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureStore.js	(revision 76)
@@ -0,0 +1,428 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/FeatureReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = FeatureStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: FeatureStore
+ *
+ *      A store containing :class:`GeoExt.data.FeatureRecord` entries that
+ *      optionally synchronizes with an ``OpenLayers.Layer.Vector``.
+ */
+
+/** api: example
+ *  Sample code to create a store with features from a vector layer:
+ *  
+ *  .. code-block:: javascript
+ *
+ *      var store = new GeoExt.data.FeatureStore({
+ *          layer: myLayer,
+ *          features: myFeatures
+ *      });
+ */
+
+/**
+ * Class: GeoExt.data.FeatureStoreMixin
+ * A store that synchronizes a features array of an {OpenLayers.Layer.Vector} with a
+ * feature store holding {<GeoExt.data.FeatureRecord>} entries.
+ * 
+ * This class can not be instantiated directly. Instead, it is meant to extend
+ * {Ext.data.Store} or a subclass of it:
+ * (start code)
+ * var store = new (Ext.extend(Ext.data.Store, new GeoExt.data.FeatureStoreMixin))({
+ *     layer: myLayer,
+ *     features: myFeatures
+ * });
+ * (end)
+ * 
+ * For convenience, a {<GeoExt.data.FeatureStore>} class is available as a
+ * shortcut to the Ext.extend sequence in the above code snippet. The above
+ * is equivalent to:
+ * (start code)
+ * var store = new GeoExt.data.FeatureStore({
+ *     layer: myLayer,
+ *     features: myFeatures
+ * });
+ * (end)
+ */
+GeoExt.data.FeatureStoreMixin = function() {
+    return {
+        /** api: config[layer]
+         *  ``OpenLayers.Layer.Vector``  Layer to synchronize the store with.
+         */
+        layer: null,
+        
+        /** api: config[features]
+         *  ``Array(OpenLayers.Feature.Vector)``  Features that will be added to the
+         *  store (and the layer if provided).
+         */
+
+        /** api: config[reader]
+         *  ``Ext.data.DataReader`` The reader used to produce records from objects
+         *  features.  Default is :class:`GeoExt.data.FeatureReader`.
+         */
+        reader: null,
+
+        /** api: config[featureFilter]
+         *  ``OpenLayers.Filter`` This filter is evaluated before a feature
+         *  record is added to the store.
+         */
+        featureFilter: null,
+        
+        /** api: config[initDir]
+         *  ``Number``  Bitfields specifying the direction to use for the
+         *  initial sync between the layer and the store, if set to 0 then no
+         *  initial sync is done. Default is
+         *  ``GeoExt.data.FeatureStore.LAYER_TO_STORE|GeoExt.data.FeatureStore.STORE_TO_LAYER``.
+         */
+
+        /** private */
+        constructor: function(config) {
+            config = config || {};
+            config.reader = config.reader ||
+                            new GeoExt.data.FeatureReader({}, config.fields);
+            var layer = config.layer;
+            delete config.layer;
+            // 'features' option - is an alias 'data' option
+            if (config.features) {
+                config.data = config.features;
+            }
+            delete config.features;
+            // "initDir" option
+            var options = {initDir: config.initDir};
+            delete config.initDir;
+            arguments.callee.superclass.constructor.call(this, config);
+            if(layer) {
+                this.bind(layer, options);
+            }
+        },
+
+        /** api: method[bind]
+         *  :param layer: ``OpenLayers.Layer`` Layer that the store should be
+         *      synchronized with.
+         *  
+         *  Bind this store to a layer instance, once bound the store
+         *  is synchronized with the layer and vice-versa.
+         */ 
+        bind: function(layer, options) {
+            if(this.layer) {
+                // already bound
+                return;
+            }
+            this.layer = layer;
+            options = options || {};
+
+            var initDir = options.initDir;
+            if(options.initDir == undefined) {
+                initDir = GeoExt.data.FeatureStore.LAYER_TO_STORE |
+                          GeoExt.data.FeatureStore.STORE_TO_LAYER;
+            }
+
+            // create a snapshot of the layer's features
+            var features = layer.features.slice(0);
+
+            if(initDir & GeoExt.data.FeatureStore.STORE_TO_LAYER) {
+                var records = this.getRange();
+                for(var i=records.length - 1; i>=0; i--) {
+                    this.layer.addFeatures([records[i].getFeature()]);
+                }
+            }
+
+            if(initDir & GeoExt.data.FeatureStore.LAYER_TO_STORE) {
+                this.loadData(features, true /* append */);
+            }
+
+            layer.events.on({
+                "featuresadded": this.onFeaturesAdded,
+                "featuresremoved": this.onFeaturesRemoved,
+                "featuremodified": this.onFeatureModified,
+                scope: this
+            });
+            this.on({
+                "load": this.onLoad,
+                "clear": this.onClear,
+                "add": this.onAdd,
+                "remove": this.onRemove,
+                "update": this.onUpdate,
+                scope: this
+            });
+        },
+
+        /** api: method[unbind]
+         *  Unbind this store from the layer it is currently bound.
+         */
+        unbind: function() {
+            if(this.layer) {
+                this.layer.events.un({
+                    "featuresadded": this.onFeaturesAdded,
+                    "featuresremoved": this.onFeaturesRemoved,
+                    "featuremodified": this.onFeatureModified,
+                    scope: this
+                });
+                this.un("load", this.onLoad, this);
+                this.un("clear", this.onClear, this);
+                this.un("add", this.onAdd, this);
+                this.un("remove", this.onRemove, this);
+                this.un("update", this.onUpdate, this);
+
+                this.layer = null;
+            }
+        },
+       
+        /** api: method[getRecordFromFeature]
+         *  :arg feature: ``OpenLayers.Vector.Feature``
+         *  :returns: :class:`GeoExt.data.FeatureRecord` The record corresponding
+         *      to the given feature.  Returns null if no record matches.
+         *
+         *  Get the record corresponding to a feature.
+         */
+        getRecordFromFeature: function(feature) {
+            var record = null;
+            if(feature.state !== OpenLayers.State.INSERT) {
+                record = this.getById(feature.id);
+            } else {
+                var index = this.findBy(function(r) {
+                    return r.getFeature() === feature;
+                });
+                if(index > -1) {
+                    record = this.getAt(index);
+                }
+            }
+            return record;
+        },
+       
+        /** private: method[onFeaturesAdded]
+         *  Handler for layer featuresadded event
+         */
+        onFeaturesAdded: function(evt) {
+            if(!this._adding) {
+                var features = evt.features, toAdd = features;
+                if(this.featureFilter) {
+                    toAdd = [];
+                    var i, len, feature;
+                    for(var i=0, len=features.length; i<len; i++) {
+                        feature = features[i];
+                        if (this.featureFilter.evaluate(feature) !== false) {
+                            toAdd.push(feature);
+                        }
+                    }
+                }
+                // add feature records to the store, when called with
+                // append true loadData triggers an "add" event and
+                // then a "load" event
+                this._adding = true;
+                this.loadData(toAdd, true /* append */);
+                delete this._adding;
+            }
+        },
+        
+        /** private: method[onFeaturesRemoved]
+         *  Handler for layer featuresremoved event
+         */
+        onFeaturesRemoved: function(evt){
+            if(!this._removing) {
+                var features = evt.features, feature, record, i;
+                for(i=features.length - 1; i>=0; i--) {
+                    feature = features[i];
+                    record = this.getRecordFromFeature(feature);
+                    if(record !== undefined) {
+                        this._removing = true;
+                        this.remove(record);
+                        delete this._removing;
+                    }
+                }
+            }
+        },
+        
+        /** private: method[onFeatureModified]
+         *  Handler for layer featuremodified event
+         */
+        onFeatureModified: function(evt) {
+            if(!this._updating) {
+                var feature = evt.feature;
+                var record = this.getRecordFromFeature(feature);
+                if(record !== undefined) {
+                    record.beginEdit();
+                    var attributes = feature.attributes;
+                    if(attributes) {
+                        var fields = this.recordType.prototype.fields;
+                        for(var i=0, len=fields.length; i<len; i++) {
+                            var field = fields.items[i];
+                            var key = field.mapping || field.name;
+                            if(key in attributes) {
+                                record.set(field.name, field.convert(attributes[key]));
+                            }
+                        }
+                    }
+                    // the calls to set below won't trigger "update"
+                    // events because we called beginEdit to start a
+                    // "transaction", "update" will be triggered by
+                    // endEdit
+                    record.set("state", feature.state);
+                    record.set("fid", feature.fid);
+                    record.setFeature(feature);
+                    this._updating = true;
+                    record.endEdit();
+                    delete this._updating;
+                }
+            }
+        },
+
+        /** private: method[addFeaturesToLayer]
+         *  Given an array of records add features to the layer. This
+         *  function is used by the onLoad and onAdd handlers.
+         */
+        addFeaturesToLayer: function(records) {
+            var i, len, features;
+            features = new Array((len=records.length));
+            for(i=0; i<len; i++) {
+                features[i] = records[i].getFeature();
+            }
+            if(features.length > 0) {
+                this._adding = true;
+                this.layer.addFeatures(features);
+                delete this._adding;
+            }
+        },
+       
+        /** private: method[onLoad]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param options: ``Object``
+         * 
+         *  Handler for store load event
+         */
+        onLoad: function(store, records, options) {
+            // if options.add is true an "add" event was already
+            // triggered, and onAdd already did the work of 
+            // adding the features to the layer.
+            if(!options || options.add !== true) {
+                this._removing = true;
+                this.layer.removeFeatures(this.layer.features);
+                delete this._removing;
+
+                this.addFeaturesToLayer(records);
+            }
+        },
+        
+        /** private: method[onClear]
+         *  :param store: ``Ext.data.Store``
+         *      
+         *  Handler for store clear event
+         */
+        onClear: function(store) {
+            this._removing = true;
+            this.layer.removeFeatures(this.layer.features);
+            delete this._removing;
+        },
+        
+        /** private: method[onAdd]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param index: ``Number``
+         * 
+         *  Handler for store add event
+         */
+        onAdd: function(store, records, index) {
+            if(!this._adding) {
+                // addFeaturesToLayer takes care of setting
+                // this._adding to true and deleting it
+                this.addFeaturesToLayer(records);
+            }
+        },
+        
+        /** private: method[onRemove]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param index: ``Number``
+         *      
+         *  Handler for store remove event
+         */
+        onRemove: function(store, record, index){
+            if(!this._removing) {
+                var feature = record.getFeature();
+                if (this.layer.getFeatureById(feature.id) != null) {
+                    this._removing = true;
+                    this.layer.removeFeatures([record.getFeature()]);
+                    delete this._removing;
+                }
+            }
+        },
+
+        /** private: method[onUpdate]
+         *  :param store: ``Ext.data.Store``
+         *  :param record: ``Ext.data.Record``
+         *  :param operation: ``String``
+         *
+         *  Handler for update.
+         */
+        onUpdate: function(store, record, operation) {
+            if(!this._updating) {
+                /**
+                  * TODO: remove this if the FeatureReader adds attributes
+                  * for all fields that map to feature.attributes.
+                  * In that case, it would be sufficient to check (key in feature.attributes). 
+                  */
+                var defaultFields = new GeoExt.data.FeatureRecord().fields;
+                var feature = record.getFeature();
+                if(record.fields) {
+                    var cont = this.layer.events.triggerEvent(
+                        "beforefeaturemodified", {feature: feature}
+                    );
+                    if(cont !== false) {
+                        var attributes = feature.attributes;
+                        record.fields.each(
+                            function(field) {
+                                var key = field.mapping || field.name;
+                                if (!defaultFields.containsKey(key)) {
+                                    attributes[key] = record.get(field.name);
+                                }
+                            }
+                        );
+                        this._updating = true;
+                        this.layer.events.triggerEvent(
+                            "featuremodified", {feature: feature}
+                        );
+                        delete this._updating;
+                        if (this.layer.getFeatureById(feature.id) != null) {
+                            this.layer.drawFeature(feature);
+                        }
+                    }
+                }
+            }
+        }
+    };
+};
+
+GeoExt.data.FeatureStore = Ext.extend(
+    Ext.data.Store,
+    new GeoExt.data.FeatureStoreMixin
+);
+
+/**
+ * Constant: GeoExt.data.FeatureStore.LAYER_TO_STORE
+ * {Integer} Constant used to make the store be automatically updated
+ * when changes occur in the layer.
+ */
+GeoExt.data.FeatureStore.LAYER_TO_STORE = 1;
+
+/**
+ * Constant: GeoExt.data.FeatureStore.STORE_TO_LAYER
+ * {Integer} Constant used to make the layer be automatically updated
+ * when changes occur in the store.
+ */
+GeoExt.data.FeatureStore.STORE_TO_LAYER = 2;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMCReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMCReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMCReader.js	(revision 76)
@@ -0,0 +1,116 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WMCReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WMCReader(meta, recordType)
+ *  
+ *      :param meta: ``Object`` Reader configuration.
+ *      :param recordType: ``Array | Ext.data.Record`` An array of field
+ *          configuration objects or a record object.  Default is
+ *          :class:`GeoExt.data.LayerRecord`.
+ *   
+ *      Data reader class to create an array of
+ *      :class:`GeoExt.data.LayerRecord` objects from a WMS GetCapabilities
+ *      response.
+ */
+GeoExt.data.WMCReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!meta.format) {
+        meta.format = new OpenLayers.Format.WMC();
+    }
+    if(!(typeof recordType === "function")) {
+        recordType = GeoExt.data.LayerRecord.create(
+            recordType || meta.fields || [
+                // give only non-OpenLayers fields as default recordType
+                {name: "abstract", type: "string"},
+                {name: "metadataURL", type: "string"},
+                {name: "queryable", type: "boolean"},
+                {name: "formats"}, // array
+                {name: "styles"} // array
+            ]
+        );
+    }
+    GeoExt.data.WMCReader.superclass.constructor.call(
+        this, meta, recordType
+    );
+};
+
+Ext.extend(GeoExt.data.WMCReader, Ext.data.DataReader, {
+
+    /** private: method[read]
+     *  :param request: ``Object`` The XHR object which contains the parsed XML
+     *      document.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     */
+    read: function(request) {
+        var data = request.responseXML;
+        if(!data || !data.documentElement) {
+            data = request.responseText;
+        }
+        return this.readRecords(data);
+    },
+
+    /** private: method[readRecords]
+     *  :param data: ``DOMElement | String | Object`` A document element or XHR
+     *      response string.  As an alternative to fetching capabilities data
+     *      from a remote source, an object representing the capabilities can
+     *      be provided given that the structure mirrors that returned from the
+     *      capabilities parser.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     *  
+     *  Create a data block containing Ext.data.Records from an XML document.
+     */
+    readRecords: function(data) {
+        var format = this.meta.format;
+        if(typeof data === "string" || data.nodeType) {
+            data = format.read(data);
+        }
+        var layersContext = data ? data.layersContext : undefined;
+        var records = [];        
+
+        if(layersContext) {
+            var recordType = this.recordType, fields = recordType.prototype.fields;
+            var i, lenI, j, lenJ, layerContext, values, field, v;
+            for (i = 0, lenI = layersContext.length; i < lenI; i++) {
+                layerContext = layersContext[i];
+                values = {};
+                for(j = 0, lenJ = fields.length; j < lenJ; j++){
+                    field = fields.items[j];
+                    v = layerContext[field.mapping || field.name] ||
+                        field.defaultValue;
+                    v = field.convert(v);
+                    values[field.name] = v;
+                }
+                values.layer = format.getLayerFromContext(layerContext);
+                records.push(new this.recordType(values, values.layer.id));
+            }
+        }
+        
+        return {
+            totalRecords: records.length,
+            success: true,
+            records: records
+        };
+
+    }
+
+});
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerRecord.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerRecord.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerRecord.js	(revision 76)
@@ -0,0 +1,105 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = LayerRecord
+ *  base_link = `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: LayerRecord
+ *  
+ *      A record that represents an ``OpenLayers.Layer``. This record
+ *      will always have at least the following fields:
+ *
+ *      * title ``String``
+ */
+GeoExt.data.LayerRecord = Ext.data.Record.create([
+    {name: "layer"},
+    {name: "title", type: "string", mapping: "name"}
+]);
+
+/** api: method[getLayer]
+ *  :return: ``OpenLayers.Layer``
+ *
+ *  Gets the layer for this record.
+ */
+GeoExt.data.LayerRecord.prototype.getLayer = function() {
+    return this.get("layer");
+};
+
+/** api: method[setLayer]
+ *  :param layer: ``OpenLayers.Layer``
+ *
+ *  Sets the layer for this record.
+ */
+GeoExt.data.LayerRecord.prototype.setLayer = function(layer) {
+    if (layer !== this.data.layer) {
+        this.dirty = true;
+        if(!this.modified) {
+            this.modified = {};
+        }
+        if(this.modified.layer === undefined) {
+            this.modified.layer = this.data.layer;
+        }
+        this.data.layer = layer;
+        if(!this.editing) {
+            this.afterEdit();
+        }
+    }
+};
+
+/** api: method[clone]
+ *  :param id: ``String`` (optional) A new Record id.
+ *  :return: class:`GeoExt.data.LayerRecord` A new layer record.
+ *  
+ *  Creates a clone of this LayerRecord. 
+ */
+GeoExt.data.LayerRecord.prototype.clone = function(id) { 
+    var layer = this.getLayer() && this.getLayer().clone(); 
+    return new this.constructor( 
+        Ext.applyIf({layer: layer}, this.data), 
+        id || layer.id
+    );
+}; 
+
+/** api: classmethod[create]
+ *  :param o: ``Array`` Field definition as in ``Ext.data.Record.create``. Can
+ *      be omitted if no additional fields are required.
+ *  :return: ``Function`` A specialized :class:`GeoExt.data.LayerRecord`
+ *      constructor.
+ *  
+ *  Creates a constructor for a :class:`GeoExt.data.LayerRecord`, optionally
+ *  with additional fields.
+ */
+GeoExt.data.LayerRecord.create = function(o) {
+    var f = Ext.extend(GeoExt.data.LayerRecord, {});
+    var p = f.prototype;
+
+    p.fields = new Ext.util.MixedCollection(false, function(field) {
+        return field.name;
+    });
+
+    GeoExt.data.LayerRecord.prototype.fields.each(function(f) {
+        p.fields.add(f);
+    });
+
+    if(o) {
+        for(var i = 0, len = o.length; i < len; i++){
+            p.fields.add(new Ext.data.Field(o[i]));
+        }
+    }
+
+    f.getField = function(name) {
+        return p.fields.get(name);
+    };
+
+    return f;
+};
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureReader.js	(revision 76)
@@ -0,0 +1,125 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/FeatureRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = FeatureReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace('GeoExt', 'GeoExt.data');
+
+/** api: example
+ *  Typical usage in a store:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var store = new Ext.data.Store({
+ *          reader: new GeoExt.data.FeatureReader({}, [
+ *              {name: 'name', type: 'string'},
+ *              {name: 'elevation', type: 'float'}
+ *          ])
+ *      });
+ *      
+ */
+
+/** api: constructor
+ *  .. class:: FeatureReader(meta, recordType)
+ *   
+ *      Data reader class to create an array of
+ *      :class:`GeoExt.data.FeatureRecord` objects from an
+ *      ``OpenLayers.Protocol.Response`` object for use in a
+ *      :class:`GeoExt.data.FeatureStore` object.
+ */
+GeoExt.data.FeatureReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!(recordType instanceof Function)) {
+        recordType = GeoExt.data.FeatureRecord.create(
+            recordType || meta.fields || {});
+    }
+    GeoExt.data.FeatureReader.superclass.constructor.call(
+        this, meta, recordType);
+};
+
+Ext.extend(GeoExt.data.FeatureReader, Ext.data.DataReader, {
+
+    /**
+     * APIProperty: totalRecords
+     * {Integer}
+     */
+    totalRecords: null,
+
+    /** private: method[read]
+     *  :param response: ``OpenLayers.Protocol.Response``
+     *  :return: ``Object`` An object with two properties. The value of the
+     *      ``records`` property is the array of records corresponding to
+     *      the features. The value of the ``totalRecords" property is the
+     *      number of records in the array.
+     *      
+     *  This method is only used by a DataProxy which has retrieved data.
+     */
+    read: function(response) {
+        return this.readRecords(response.features);
+    },
+
+    /** api: method[readRecords]
+     *  :param features: ``Array(OpenLayers.Feature.Vector)`` List of
+     *      features for creating records
+     *  :return: ``Object``  An object with ``records`` and ``totalRecords``
+     *      properties.
+     *  
+     *  Create a data block containing :class:`GeoExt.data.FeatureRecord`
+     *  objects from an array of features.
+     */
+    readRecords : function(features) {
+        var records = [];
+
+        if (features) {
+            var recordType = this.recordType, fields = recordType.prototype.fields;
+            var i, lenI, j, lenJ, feature, values, field, v;
+            for (i = 0, lenI = features.length; i < lenI; i++) {
+                feature = features[i];
+                values = {};
+                if (feature.attributes) {
+                    for (j = 0, lenJ = fields.length; j < lenJ; j++){
+                        field = fields.items[j];
+                        if (/[\[\.]/.test(field.mapping)) {
+                            try {
+                                v = new Function("obj", "return obj." + field.mapping)(feature.attributes);
+                            } catch(e){
+                                v = field.defaultValue;
+                            }
+                        }
+                        else {
+                            v = feature.attributes[field.mapping || field.name] || field.defaultValue;
+                        }
+                        if (field.convert) {
+                            v = field.convert(v);
+                        }
+                        values[field.name] = v;
+                    }
+                }
+                values.feature = feature;
+                values.state = feature.state;
+                values.fid = feature.fid;
+
+                // newly inserted features need to be made into phantom records
+                var id = (feature.state === OpenLayers.State.INSERT) ? undefined : feature.id;
+                records[records.length] = new recordType(values, id);
+            }
+        }
+
+        return {
+            records: records,
+            totalRecords: this.totalRecords != null ? this.totalRecords : records.length
+        };
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeStore.js	(revision 76)
@@ -0,0 +1,187 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/AttributeReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = AttributeStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/**
+ * Function: GeoExt.data.AttributeStoreMixin
+ *
+ * This function generates a mixin object to be used when extending an Ext.data.Store
+ * to create an attribute store.
+ *
+ * (start code)
+ * var AttrStore = Ext.extend(Ext.data.Store, GeoExt.data.AttributeStoreMixin);
+ * var store = new AttrStore();
+ * (end)
+ *
+ * For convenience, a GeoExt.data.AttributeStore class is available as a
+ * shortcut to the Ext.extend sequence in the above code snippet. The above
+ * is equivalent to:
+ * (start code)
+ * var store = new GeoExt.data.AttributeStore();
+ * (end)
+ */
+GeoExt.data.AttributeStoreMixin = function() {
+    return {
+        /** private */
+        constructor: function(c) {
+            c = c || {};
+            arguments.callee.superclass.constructor.call(
+                this,
+                Ext.apply(c, {
+                    proxy: c.proxy || (!c.data ?
+                        new Ext.data.HttpProxy({url: c.url, disableCaching: false, method: "GET"}) :
+                        undefined
+                    ),
+                    reader: new GeoExt.data.AttributeReader(
+                        c, c.fields || ["name", "type", "restriction"]
+                    )
+                })
+            );
+            if(this.feature) {
+                this.bind();
+            }
+        },
+
+        /** private: method[bind]
+         */
+        bind: function() {
+            this.on({
+                "update": this.onUpdate,
+                "load": this.onLoad,
+                "add": this.onAdd,
+                scope: this
+            });
+            var records = [];
+            this.each(function(record) {
+                records.push(record);
+            });
+            this.updateFeature(records);
+        },
+
+        /** private: method[onUpdate]
+         *  :param store: ``Ext.data.Store``
+         *  :param record: ``Ext.data.Record``
+         *  :param operation: ``String``
+         *
+         *  Handler for store update event.
+         */
+        onUpdate: function(store, record, operation) {
+            this.updateFeature([record]);
+        },
+
+        /** private: method[onLoad]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param options: ``Object``
+         *
+         *  Handler for store load event
+         */
+        onLoad: function(store, records, options) {
+            // if options.add is true an "add" event was already
+            // triggered, and onAdd already did the work of
+            // adding the features to the layer.
+            if(!options || options.add !== true) {
+                this.updateFeature(records);
+            }
+        },
+
+        /** private: method[onAdd]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param index: ``Number``
+         *
+         *  Handler for store add event
+         */
+        onAdd: function(store, records, index) {
+            this.updateFeature(records);
+        },
+
+        /** private: method[updateFeature]
+         *  :param records: ``Array(Ext.data.Record)``
+         *
+         *  Update feature from records.
+         */
+        updateFeature: function(records) {
+            var feature = this.feature, layer = feature.layer;
+            var i, len, record, name, value, oldValue, dirty;
+            for(i=0,len=records.length; i<len; i++) {
+                record = records[i];
+                name = record.get("name");
+                value = record.get("value");
+                oldValue = feature.attributes[name];
+                if(oldValue !== value) {
+                    dirty = true;
+                }
+            }
+            if(dirty && layer && layer.events &&
+                        layer.events.triggerEvent("beforefeaturemodified",
+                            {feature: feature}) !== false) {
+                for(i=0,len=records.length; i<len; i++) {
+                    record = records[i];
+                    name = record.get("name");
+                    value = record.get("value");
+                    feature.attributes[name] = value;
+                }
+                layer.events.triggerEvent(
+                    "featuremodified", {feature: feature});
+                layer.drawFeature(feature);
+            }
+        }
+
+    };
+};
+
+/** api: constructor
+ *  .. class:: AttributeStore(config)
+ *
+ *      Small helper class to make creating stores for remotely-loaded attributes
+ *      data easier. AttributeStore is pre-configured with a built-in
+ *      ``Ext.data.HttpProxy`` and :class:`GeoExt.data.AttributeReader`.  The
+ *      HttpProxy is configured to allow caching (disableCaching: false) and
+ *      uses GET. If you require some other proxy/reader combination then you'll
+ *      have to configure this with your own proxy or create a basic
+ *      ``Ext.data.Store`` and configure as needed.
+ */
+
+/** api: config[format]
+ *  ``OpenLayers.Format``
+ *  A parser for transforming the XHR response into an array of objects
+ *  representing attributes.  Defaults to an
+ *  ``OpenLayers.Format.WFSDescribeFeatureType`` parser.
+ */
+
+/** api: config[fields]
+ *  ``Array or Function``
+ *  Either an array of field definition objects as passed to
+ *  ``Ext.data.Record.create``, or a record constructor created using
+ *  ``Ext.data.Record.create``.  Defaults to ``["name", "type", "restriction"]``.
+ */
+
+/** api: config[feature]
+ *  ``OpenLayers.Feature.Vector``
+ *  A vector feature. If provided, and if the reader is a
+ *  :class:`GeoExt.data.AttributeReader` (the default), then records
+ *  of this store will include a field named "value" referencing the
+ *  corresponding attribute value in the feature. And if the "value"
+ *  field of a record is updated the update will propagate to the
+ *  corresponding feature attribute. Optional.
+ */
+GeoExt.data.AttributeStore = Ext.extend(
+    Ext.data.Store,
+    GeoExt.data.AttributeStoreMixin()
+);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerStore.js	(revision 76)
@@ -0,0 +1,61 @@
+/**x
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/WMSDescribeLayerReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WMSDescribeLayerStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WMSDescribeLayerStore
+ *  
+ *      Small helper class to make creating stores for remote WMS layer description
+ *      easier.  The store is pre-configured with a built-in
+ *      ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WMSDescribeLayerReader`.
+ *      The proxy is configured to allow caching and issues requests via GET.
+ *      If you require some other proxy/reader combination then you'll have to
+ *      configure this with your own proxy or create a basic
+ *      store and configure as needed.
+ */
+
+/** api: config[format]
+ *  ``OpenLayers.Format``
+ *  A parser for transforming the XHR response into an array of objects
+ *  representing attributes.  Defaults to an ``OpenLayers.Format.WMSDescribeLayer``
+ *  parser.
+ */
+
+/** api: config[fields]
+ *  ``Array | Function``
+ *  Either an Array of field definition objects as passed to
+ *  ``Ext.data.Record.create``, or a record constructor created using
+ *  ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``. 
+ */
+
+GeoExt.data.WMSDescribeLayerStore = function(c) {
+    c = c || {};
+    GeoExt.data.WMSDescribeLayerStore.superclass.constructor.call(
+        this,
+        Ext.apply(c, {
+            proxy: c.proxy || (!c.data ?
+                new Ext.data.HttpProxy({url: c.url, disableCaching: false, method: "GET"}) :
+                undefined
+            ),
+            reader: new GeoExt.data.WMSDescribeLayerReader(
+                c, c.fields
+            )
+        })
+    );
+};
+Ext.extend(GeoExt.data.WMSDescribeLayerStore, Ext.data.Store);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/AttributeReader.js	(revision 76)
@@ -0,0 +1,146 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = AttributeReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: AttributeReader(meta, recordType)
+ *  
+ *      :arg meta: ``Object`` Reader configuration.
+ *      :arg recordType: ``Array or Ext.data.Record`` An array of field
+ *          configuration objects or a record object.
+ *
+ *      Create a new attributes reader object.
+ *      
+ *      Valid meta properties:
+ *      
+ *      * format - ``OpenLayers.Format`` A parser for transforming the XHR response
+ *        into an array of objects representing attributes.  Defaults to
+ *        an ``OpenLayers.Format.WFSDescribeFeatureType`` parser.
+ *      * ignore - ``Object`` Properties of the ignore object should be field names.
+ *        Values are either arrays or regular expressions.
+ *      * feature - ``OpenLayers.Feature.Vector`` A vector feature. If provided
+ *        records created by the reader will include a field named "value"
+ *        referencing the attribute value as set in the feature.
+ */
+GeoExt.data.AttributeReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!meta.format) {
+        meta.format = new OpenLayers.Format.WFSDescribeFeatureType();
+    }
+    GeoExt.data.AttributeReader.superclass.constructor.call(
+        this, meta, recordType || meta.fields
+    );
+    if(meta.feature) {
+        this.recordType.prototype.fields.add(new Ext.data.Field("value"));
+    }
+};
+
+Ext.extend(GeoExt.data.AttributeReader, Ext.data.DataReader, {
+
+    /** private: method[read]
+     *  :arg request: ``Object`` The XHR object that contains the parsed doc.
+     *  :return: ``Object``  A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Records``.
+     *  
+     *  This method is only used by a DataProxy which has retrieved data from a
+     *  remote server.
+     */
+    read: function(request) {
+        var data = request.responseXML;
+        if(!data || !data.documentElement) {
+            data = request.responseText;
+        }
+        return this.readRecords(data);
+    },
+
+    /** private: method[readRecords]
+     *  :arg data: ``DOMElement or String or Array`` A document element or XHR
+     *      response string.  As an alternative to fetching attributes data from
+     *      a remote source, an array of attribute objects can be provided given
+     *      that the properties of each attribute object map to a provided field
+     *      name.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Records``.
+     *  
+     *  Create a data block containing Ext.data.Records from an XML document.
+     */
+    readRecords: function(data) {
+        var attributes;
+        if(data instanceof Array) {
+            attributes = data;
+        } else {
+            // only works with one featureType in the doc
+            attributes = this.meta.format.read(data).featureTypes[0].properties;
+        }
+        var feature = this.meta.feature;
+        var recordType = this.recordType;
+        var fields = recordType.prototype.fields;
+        var numFields = fields.length;
+        var attr, values, name, record, ignore, value, records = [];
+        for(var i=0, len=attributes.length; i<len; ++i) {
+            ignore = false;
+            attr = attributes[i];
+            values = {};
+            for(var j=0; j<numFields; ++j) {
+                name = fields.items[j].name;
+                value = attr[name];
+                if(this.ignoreAttribute(name, value)) {
+                    ignore = true;
+                    break;
+                }
+                values[name] = value;
+            }
+            if(feature) {
+                value = feature.attributes[values["name"]];
+                if(value !== undefined) {
+                    if(this.ignoreAttribute("value", value)) {
+                        ignore = true;
+                    } else {
+                        values["value"] = value;
+                    }
+                }
+            }
+            if(!ignore) {
+                records[records.length] = new recordType(values);
+            }
+        }
+
+        return {
+            success: true,
+            records: records,
+            totalRecords: records.length
+        };
+    },
+
+    /** private: method[ignoreAttribute]
+     *  :arg name: ``String`` The field name.
+     *  :arg value: ``String`` The field value.
+     *
+     *  :return: ``Boolean`` true if the attribute should be ignored.
+     */
+    ignoreAttribute: function(name, value) {
+        var ignore = false;
+        if(this.meta.ignore && this.meta.ignore[name]) {
+            var matches = this.meta.ignore[name];
+            if(typeof matches == "string") {
+                ignore = (matches === value);
+            } else if(matches instanceof Array) {
+                ignore = (matches.indexOf(value) > -1);
+            } else if(matches instanceof RegExp) {
+                ignore = (matches.test(value));
+            }
+        }
+        return ignore;
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesStore.js	(revision 76)
@@ -0,0 +1,61 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/*
+ * @include GeoExt/data/WFSCapabilitiesReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WFSCapabilitiesStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WFSCapabilitiesStore
+ *  
+ *      Small helper class to make creating stores for remote WFS layer data
+ *      easier.  The store is pre-configured with a built-in
+ *      ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WFSCapabilitiesReader`.
+ *      The proxy is configured to allow caching and issues requests via GET.
+ *      If you require some other proxy/reader combination then you'll have to
+ *      configure this with your own proxy or create a basic
+ *      :class:`GeoExt.data.LayerStore` and configure as needed.
+ */
+
+/** api: config[format]
+ *  ``OpenLayers.Format``
+ *  A parser for transforming the XHR response into an array of objects
+ *  representing attributes.  Defaults to an ``OpenLayers.Format.WFSCapabilities``
+ *  parser.
+ */
+
+/** api: config[fields]
+ *  ``Array | Function``
+ *  Either an Array of field definition objects as passed to
+ *  ``Ext.data.Record.create``, or a record constructor created using
+ *  ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``. 
+ */
+
+GeoExt.data.WFSCapabilitiesStore = function(c) {
+    c = c || {};
+    GeoExt.data.WFSCapabilitiesStore.superclass.constructor.call(
+        this,
+        Ext.apply(c, {
+            proxy: c.proxy || (!c.data ?
+                new Ext.data.HttpProxy({url: c.url, disableCaching: false, method: "GET"}) :
+                undefined
+            ),
+            reader: new GeoExt.data.WFSCapabilitiesReader(
+                c, c.fields
+            )
+        })
+    );
+};
+Ext.extend(GeoExt.data.WFSCapabilitiesStore, Ext.data.Store);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSDescribeLayerReader.js	(revision 76)
@@ -0,0 +1,94 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WMSDescribeLayerReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WMSDescribeLayerReader(meta, recordType)
+ *  
+ *      :param meta: ``Object`` Reader configuration.
+ *      :param recordType: ``Array | Ext.data.Record`` An array of field
+ *          configuration objects or a record object.  Default has
+ *          fields for owsType, owsURL, and typeName.
+ *   
+ *      Data reader class to create an array of
+ *      layer description objects from a WMS DescribeLayer
+ *      response.
+ */
+GeoExt.data.WMSDescribeLayerReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!meta.format) {
+        meta.format = new OpenLayers.Format.WMSDescribeLayer();
+    }
+    if(!(typeof recordType === "function")) {
+        recordType = Ext.data.Record.create(
+            recordType || meta.fields || [
+                {name: "owsType", type: "string"},
+                {name: "owsURL", type: "string"},
+                {name: "typeName", type: "string"}
+            ]
+        );
+    }
+    GeoExt.data.WMSDescribeLayerReader.superclass.constructor.call(
+        this, meta, recordType
+    );
+};
+
+Ext.extend(GeoExt.data.WMSDescribeLayerReader, Ext.data.DataReader, {
+
+    /** private: method[read]
+     *  :param request: ``Object`` The XHR object which contains the parsed XML
+     *      document.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     */
+    read: function(request) {
+        var data = request.responseXML;
+        if(!data || !data.documentElement) {
+            data = request.responseText;
+        }
+        return this.readRecords(data);
+    },
+
+    /** private: method[readRecords]
+     *  :param data: ``DOMElement | Strint | Object`` A document element or XHR
+     *      response string.  As an alternative to fetching layer description data
+     *      from a remote source, an object representing the layer descriptions can
+     *      be provided given that the structure mirrors that returned from the
+     *      layer description parser.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     *  
+     *  Create a data block containing Ext.data.Records from an XML document.
+     */
+    readRecords: function(data) {
+        
+        if(typeof data === "string" || data.nodeType) {
+            data = this.meta.format.read(data);
+        }
+        var records = [], description;        
+        for(var i=0, len=data.length; i<len; i++){
+            description = data[i];
+            if(description) {
+                records.push(new this.recordType(description));
+            }
+        }
+
+        return {
+            totalRecords: records.length,
+            success: true,
+            records: records
+        };
+
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerStore.js	(revision 76)
@@ -0,0 +1,442 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = LayerStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** private: constructor
+ *  .. class:: LayerStoreMixin
+ *      A store that synchronizes a layers array of an {OpenLayers.Map} with a
+ *      layer store holding {<GeoExt.data.LayerRecord>} entries.
+ * 
+ *      This class can not be instantiated directly. Instead, it is meant to
+ *      extend ``Ext.data.Store`` or a subclass of it.
+ */
+
+/** private: example
+ *  Sample code to extend a store with the LayerStoreMixin.
+ *
+ *  .. code-block:: javascript
+ *  
+ *      var store = new (Ext.extend(Ext.data.Store, new GeoExt.data.LayerStoreMixin))({
+ *          map: myMap,
+ *          layers: myLayers
+ *      });
+ * 
+ *  For convenience, a :class:`GeoExt.data.LayerStore` class is available as a
+ *  shortcut to the ``Ext.extend`` sequence in the above code snippet.
+ */
+
+GeoExt.data.LayerStoreMixin = function() {
+    return {
+        /** api: config[map]
+         *  ``OpenLayers.Map``
+         *  Map that this store will be in sync with. If not provided, the
+         *  store will not be bound to a map.
+         */
+        
+        /** api: property[map]
+         *  ``OpenLayers.Map``
+         *  Map that the store is synchronized with, if any.
+         */
+        map: null,
+        
+        /** api: config[layers]
+         *  ``Array(OpenLayers.Layer)``
+         *  Layers that will be added to the store (and the map, depending on the
+         *  value of the ``initDir`` option.
+         */
+        
+        /** api: config[initDir]
+         *  ``Number``
+         *  Bitfields specifying the direction to use for the initial sync between
+         *  the map and the store, if set to 0 then no initial sync is done.
+         *  Defaults to ``GeoExt.data.LayerStore.MAP_TO_STORE|GeoExt.data.LayerStore.STORE_TO_MAP``
+         */
+
+        /** api: config[fields]
+         *  ``Array``
+         *  If provided a custom layer record type with additional fields will be
+         *  used. Default fields for every layer record are `layer`
+         *  (``OpenLayers.Layer``) `title` (``String``). The value of this option is
+         *  either a field definition objects as passed to the
+         *  :meth:`GeoExt.data.LayerRecord.create` function or a
+         *  :class:`GeoExt.data.LayerRecord` constructor created using
+         *  :meth:`GeoExt.data.LayerRecord.create`.
+         */
+
+        /** api: config[reader]
+         *  ``Ext.data.DataReader`` The reader used to produce
+         *  :class:`GeoExt.data.LayerRecord` objects from ``OpenLayers.Layer``
+         *  objects.  If not provided, a :class:`GeoExt.data.LayerReader` will be
+         *  used.
+         */
+        reader: null,
+
+        /** private: method[constructor]
+         */
+        constructor: function(config) {
+            config = config || {};
+            config.reader = config.reader ||
+                            new GeoExt.data.LayerReader({}, config.fields);
+            delete config.fields;
+            // "map" option
+            var map = config.map instanceof GeoExt.MapPanel ?
+                      config.map.map : config.map;
+            delete config.map;
+            // "layers" option - is an alias to "data" option
+            if(config.layers) {
+                config.data = config.layers;
+            }
+            delete config.layers;
+            // "initDir" option
+            var options = {initDir: config.initDir};
+            delete config.initDir;
+            arguments.callee.superclass.constructor.call(this, config);
+            if(map) {
+                this.bind(map, options);
+            }
+        },
+
+        /** private: method[bind]
+         *  :param map: ``OpenLayers.Map`` The map instance.
+         *  :param options: ``Object``
+         *  
+         *  Bind this store to a map instance, once bound the store
+         *  is synchronized with the map and vice-versa.
+         */
+        bind: function(map, options) {
+            if(this.map) {
+                // already bound
+                return;
+            }
+            this.map = map;
+            options = options || {};
+
+            var initDir = options.initDir;
+            if(options.initDir == undefined) {
+                initDir = GeoExt.data.LayerStore.MAP_TO_STORE |
+                          GeoExt.data.LayerStore.STORE_TO_MAP;
+            }
+
+            // create a snapshot of the map's layers
+            var layers = map.layers.slice(0);
+
+            if(initDir & GeoExt.data.LayerStore.STORE_TO_MAP) {
+                this.each(function(record) {
+                    this.map.addLayer(record.getLayer());
+                }, this);
+            }
+            if(initDir & GeoExt.data.LayerStore.MAP_TO_STORE) {
+                this.loadData(layers, true);
+            }
+
+            map.events.on({
+                "changelayer": this.onChangeLayer,
+                "addlayer": this.onAddLayer,
+                "removelayer": this.onRemoveLayer,
+                scope: this
+            });
+            this.on({
+                "load": this.onLoad,
+                "clear": this.onClear,
+                "add": this.onAdd,
+                "remove": this.onRemove,
+                "update": this.onUpdate,
+                scope: this
+            });
+            this.data.on({
+                "replace" : this.onReplace,
+                scope: this
+            });
+        },
+
+        /** private: method[unbind]
+         *  Unbind this store from the map it is currently bound.
+         */
+        unbind: function() {
+            if(this.map) {
+                this.map.events.un({
+                    "changelayer": this.onChangeLayer,
+                    "addlayer": this.onAddLayer,
+                    "removelayer": this.onRemoveLayer,
+                    scope: this
+                });
+                this.un("load", this.onLoad, this);
+                this.un("clear", this.onClear, this);
+                this.un("add", this.onAdd, this);
+                this.un("remove", this.onRemove, this);
+
+                this.data.un("replace", this.onReplace, this);
+
+                this.map = null;
+            }
+        },
+        
+        /** private: method[onChangeLayer]
+         *  :param evt: ``Object``
+         * 
+         *  Handler for layer changes.  When layer order changes, this moves the
+         *  appropriate record within the store.
+         */
+        onChangeLayer: function(evt) {
+            var layer = evt.layer;
+            var recordIndex = this.findBy(function(rec, id) {
+                return rec.getLayer() === layer;
+            });
+            if(recordIndex > -1) {
+                var record = this.getAt(recordIndex);
+                if(evt.property === "order") {
+                    if(!this._adding && !this._removing) {
+                        var layerIndex = this.map.getLayerIndex(layer);
+                        if(layerIndex !== recordIndex) {
+                            this._removing = true;
+                            this.remove(record);
+                            delete this._removing;
+                            this._adding = true;
+                            this.insert(layerIndex, [record]);
+                            delete this._adding;
+                        }
+                    }
+                } else if(evt.property === "name") {
+                    record.set("title", layer.name);
+                } else {
+                    this.fireEvent("update", this, record, Ext.data.Record.EDIT);
+                }
+            }
+        },
+       
+        /** private: method[onAddLayer]
+         *  :param evt: ``Object``
+         *  
+         *  Handler for a map's addlayer event
+         */
+        onAddLayer: function(evt) {
+            if(!this._adding) {
+                var layer = evt.layer;
+                this._adding = true;
+                this.loadData([layer], true);
+                delete this._adding;
+            }
+        },
+        
+        /** private: method[onRemoveLayer]
+         *  :param evt: ``Object``
+         * 
+         *  Handler for a map's removelayer event
+         */
+        onRemoveLayer: function(evt){
+            //TODO replace the check for undloadDestroy with a listener for the
+            // map's beforedestroy event, doing unbind(). This can be done as soon
+            // as http://trac.openlayers.org/ticket/2136 is fixed.
+            if(this.map.unloadDestroy) {
+                if(!this._removing) {
+                    var layer = evt.layer;
+                    this._removing = true;
+                    this.remove(this.getById(layer.id));
+                    delete this._removing;
+                }
+            } else {
+                this.unbind();
+            }
+        },
+        
+        /** private: method[onLoad]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param options: ``Object``
+         * 
+         *  Handler for a store's load event
+         */
+        onLoad: function(store, records, options) {
+            if (!Ext.isArray(records)) {
+                records = [records];
+            }
+            if (options && !options.add) {
+                this._removing = true;
+                for (var i = this.map.layers.length - 1; i >= 0; i--) {
+                    this.map.removeLayer(this.map.layers[i]);
+                }
+                delete this._removing;
+
+                // layers has already been added to map on "add" event
+                var len = records.length;
+                if (len > 0) {
+                    var layers = new Array(len);
+                    for (var j = 0; j < len; j++) {
+                        layers[j] = records[j].getLayer();
+                    }
+                    this._adding = true;
+                    this.map.addLayers(layers);
+                    delete this._adding;
+                }
+            }
+        },
+        
+        /** private: method[onClear]
+         *  :param store: ``Ext.data.Store``
+         * 
+         *  Handler for a store's clear event
+         */
+        onClear: function(store) {
+            this._removing = true;
+            for (var i = this.map.layers.length - 1; i >= 0; i--) {
+                this.map.removeLayer(this.map.layers[i]);
+            }
+            delete this._removing;
+        },
+        
+        /** private: method[onAdd]
+         *  :param store: ``Ext.data.Store``
+         *  :param records: ``Array(Ext.data.Record)``
+         *  :param index: ``Number``
+         * 
+         *  Handler for a store's add event
+         */
+        onAdd: function(store, records, index) {
+            if(!this._adding) {
+                this._adding = true;
+                var layer;
+                for(var i=records.length-1; i>=0; --i) {
+                    layer = records[i].getLayer();
+                    this.map.addLayer(layer);
+                    if(index !== this.map.layers.length-1) {
+                        this.map.setLayerIndex(layer, index);
+                    }
+                }
+                delete this._adding;
+            }
+        },
+        
+        /** private: method[onRemove]
+         *  :param store: ``Ext.data.Store``
+         *  :param record: ``Ext.data.Record``
+         *  :param index: ``Number``
+         * 
+         *  Handler for a store's remove event
+         */
+        onRemove: function(store, record, index){
+            if(!this._removing) {
+                var layer = record.getLayer();
+                if (this.map.getLayer(layer.id) != null) {
+                    this._removing = true;
+                    this.removeMapLayer(record);
+                    delete this._removing;
+                }
+            }
+        },
+        
+        /** private: method[onUpdate]
+         *  :param store: ``Ext.data.Store``
+         *  :param record: ``Ext.data.Record``
+         *  :param operation: ``Number``
+         * 
+         *  Handler for a store's update event
+         */
+        onUpdate: function(store, record, operation) {
+            if(operation === Ext.data.Record.EDIT) {
+                if (record.modified && record.modified.title) {
+                    var layer = record.getLayer();
+                    var title = record.get("title");
+                    if(title !== layer.name) {
+                        layer.setName(title);
+                    }
+                }
+            }
+        },
+
+        /** private: method[removeMapLayer]
+         *  :param record: ``Ext.data.Record``
+         *  
+         *  Removes a record's layer from the bound map.
+         */
+        removeMapLayer: function(record){
+            this.map.removeLayer(record.getLayer());
+        },
+
+        /** private: method[onReplace]
+         *  :param key: ``String``
+         *  :param oldRecord: ``Object`` In this case, a record that has been
+         *      replaced.
+         *  :param newRecord: ``Object`` In this case, a record that is replacing
+         *      oldRecord.
+
+         *  Handler for a store's data collections' replace event
+         */
+        onReplace: function(key, oldRecord, newRecord){
+            this.removeMapLayer(oldRecord);
+        },
+        
+        /** public: method[getByLayer]
+         *  :param layer: ``OpenLayers.Layer``
+         *  :return: :class:`GeoExt.data.LayerRecord` or undefined if not found
+         *  
+         *  Get the record for the specified layer
+         */
+        getByLayer: function(layer) {
+            var index = this.findBy(function(r) {
+                return r.getLayer() === layer;
+            });
+            if(index > -1) {
+                return this.getAt(index);
+            }
+        },
+        
+        /** private: method[destroy]
+         */
+        destroy: function() {
+            this.unbind();
+            GeoExt.data.LayerStore.superclass.destroy.call(this);
+        }
+    };
+};
+
+/** api: example
+ *  Sample to create a new store containing a cache of
+ *  :class:`GeoExt.data.LayerRecord` instances derived from map layers.
+ *
+ *  .. code-block:: javascript
+ *  
+ *      var store = new GeoExt.data.LayerStore({
+ *          map: myMap,
+ *          layers: myLayers
+ *      });
+ */
+
+/** api: constructor
+ *  .. class:: LayerStore
+ *
+ *      A store that contains a cache of :class:`GeoExt.data.LayerRecord`
+ *      objects.
+ */
+GeoExt.data.LayerStore = Ext.extend(
+    Ext.data.Store,
+    new GeoExt.data.LayerStoreMixin
+);
+
+/**
+ * Constant: GeoExt.data.LayerStore.MAP_TO_STORE
+ * {Integer} Constant used to make the store be automatically updated
+ * when changes occur in the map.
+ */
+GeoExt.data.LayerStore.MAP_TO_STORE = 1;
+
+/**
+ * Constant: GeoExt.data.LayerStore.STORE_TO_MAP
+ * {Integer} Constant used to make the map be automatically updated
+ * when changes occur in the store.
+ */
+GeoExt.data.LayerStore.STORE_TO_MAP = 2;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintPage.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintPage.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/PrintPage.js	(revision 76)
@@ -0,0 +1,328 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = PrintPage
+ *  base_link = `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+ */
+
+/** api: constructor
+ *  .. class:: PrintPage
+ * 
+ *  Provides a representation of a print page for
+ *  :class:`GeoExt.data.PrintProvider`. The extent of the page is stored as
+ *  ``OpenLayers.Feature.Vector``. Widgets can use this to display the print
+ *  extent on the map.
+ */
+GeoExt.data.PrintPage = Ext.extend(Ext.util.Observable, {
+    
+    /** api:config[printProvider]
+     * :class:`GeoExt.data.PrintProvider` The print provider to use with
+     * this page.
+     */
+    
+    /** private: property[printProvider]
+     *  :class:`GeoExt.data.PrintProvider`
+     */
+    printProvider: null,
+    
+    /** api: property[feature]
+     *  ``OpenLayers.Feature.Vector`` Feature representing the page extent. To
+     *  get the extent of the print page for a specific map, use
+     *  ``getPrintExtent``.
+     *  Read-only.
+     */
+    feature: null,
+    
+    /** api: property[center]
+     *  ``OpenLayers.LonLat`` The current center of the page. Read-only.
+     */
+    center: null,
+    
+    /** api: property[scale]
+     *  ``Ext.data.Record`` The current scale record of the page. Read-only.
+     */
+    scale: null,
+    
+    /** api: property[rotation]
+     *  ``Float`` The current rotation of the page. Read-only.
+     */
+    rotation: 0,
+    
+    /** api:config[customParams]
+     *  ``Object`` Key-value pairs of additional parameters that the
+     *  printProvider will send to the print service for this page.
+     */
+
+    /** api: property[customParams]
+     *  ``Object`` Key-value pairs of additional parameters that the
+     *  printProvider will send to the print service for this page.
+     */
+    customParams: null,
+    
+    /** private: method[constructor]
+     *  Private constructor override.
+     */
+    constructor: function(config) {
+        this.initialConfig = config;
+        Ext.apply(this, config);
+        
+        if(!this.customParams) {
+            this.customParams = {};
+        }
+        
+        this.addEvents(
+            /** api: event[change]
+             *  Triggered when any of the page properties have changed
+             *  
+             *  Listener arguments:
+             *
+             *  * printPage - :class:`GeoExt.data.PrintPage` this printPage
+             *  * modifications - ``Object`` Object with one or more of
+             *      ``scale``, ``center`` and ``rotation``, notifying
+             *      listeners of the changed properties.
+             */
+            "change"
+        );
+
+        GeoExt.data.PrintPage.superclass.constructor.apply(this, arguments);
+
+        this.feature = new OpenLayers.Feature.Vector(
+            OpenLayers.Geometry.fromWKT("POLYGON((-1 -1,1 -1,1 1,-1 1,-1 -1))"));
+
+        if(this.printProvider.capabilities) {
+            this.setScale(this.printProvider.scales.getAt(0));
+        } else {
+            this.printProvider.on({
+                "loadcapabilities": function() {
+                    this.setScale(this.printProvider.scales.getAt(0));
+                },
+                scope: this,
+                single: true
+            });
+        }
+
+        this.printProvider.on({
+            "layoutchange": this.onLayoutChange,
+            scope: this
+        });
+    },
+    
+    /** api: method[getPrintExtent]
+     *  :param map: ``OpenLayers.Map`` or :class:`GeoExt.MapPanel` the map to
+     *      get the print extent for. 
+     *  :returns: ``OpenLayers.Bounds``
+     *
+     *  Gets this page's print extent for the provided map.
+     */
+    getPrintExtent: function(map) {
+        map = map instanceof GeoExt.MapPanel ? map.map : map;
+        return this.calculatePageBounds(this.scale, map.getUnits());
+    },
+
+    /** api: method[setScale]
+     *  :param scale: ``Ext.data.Record`` The new scale record.
+     *  :param units: ``String`` map units to use for the scale calculation.
+     *      Optional if the ``feature`` is on a layer which is added to a map.
+     *      If not found, "dd" will be assumed.
+     * 
+     *  Updates the page geometry to match a given scale. Since this takes the
+     *  current layout of the printProvider into account, this can be used to
+     *  update the page geometry feature when the layout has changed.
+     */
+    setScale: function(scale, units) {
+        var bounds = this.calculatePageBounds(scale, units);
+        var geom = bounds.toGeometry();
+        var rotation = this.rotation;
+        if(rotation != 0) {
+            geom.rotate(-rotation, geom.getCentroid());
+        }
+        this.updateFeature(geom, {scale: scale});
+    },
+    
+    /** api: method[setCenter]
+     *  :param center: ``OpenLayers.LonLat`` The new center.
+     * 
+     *  Moves the page extent to a new center.
+     */
+    setCenter: function(center) {
+        var geom = this.feature.geometry;
+        var oldCenter = geom.getBounds().getCenterLonLat();
+        var dx = center.lon - oldCenter.lon;
+        var dy = center.lat - oldCenter.lat;
+        geom.move(dx, dy);
+        this.updateFeature(geom, {center: center});
+    },
+    
+    /** api: method[setRotation]
+     *  :param rotation: ``Float`` The new rotation.
+     *  :param force: ``Boolean`` If set to true, the rotation will also be
+     *      set when the layout does not support it. Default is false.
+     *  
+     *  Sets a new rotation for the page geometry.
+     */
+    setRotation: function(rotation, force) {
+        if(force || this.printProvider.layout.get("rotation") === true) {
+            var geom = this.feature.geometry;
+            geom.rotate(this.rotation - rotation, geom.getCentroid());
+            this.updateFeature(geom, {rotation: rotation});
+        }
+    },
+    
+    /** api: method[fit]
+     *  :param fitTo: :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` or ``OpenLayers.Feature.Vector``
+     *      The map or feature to fit the page to.
+     *  :param options: ``Object`` Additional options to determine how to fit
+     *
+     *  Fits the page layout to a map or feature extent. If the map extent has
+     *  not been centered yet, this will do nothing.
+     * 
+     *  Available options:
+     *
+     *  * mode - ``String`` How to calculate the print extent? If "closest",
+     *    the closest matching print extent will be chosen. If "printer", the
+     *    chosen print extent will be the closest one that can show the entire
+     *    ``fitTo`` extent on the printer. If "screen", it will be the closest
+     *    one that is entirely visible inside the ``fitTo`` extent. Default is
+     *    "printer".
+     * 
+     */
+    fit: function(fitTo, options) {
+        options = options || {};
+        var map = fitTo, extent;
+        if(fitTo instanceof GeoExt.MapPanel) {
+            map = fitTo.map;
+        } else if(fitTo instanceof OpenLayers.Feature.Vector) {
+            map = fitTo.layer.map;
+            extent = fitTo.geometry.getBounds();
+        }
+        if(!extent) {
+            extent = map.getExtent();
+            if(!extent) {
+                return;
+            }
+        }
+        this._updating = true;
+        var center = extent.getCenterLonLat();
+        this.setCenter(center);
+        var units = map.getUnits();
+        var scale = this.printProvider.scales.getAt(0);
+        var closest = Number.POSITIVE_INFINITY;
+        var mapWidth = extent.getWidth();
+        var mapHeight = extent.getHeight();
+        this.printProvider.scales.each(function(rec) {
+            var bounds = this.calculatePageBounds(rec, units);
+            if (options.mode == "closest") {
+                var diff = 
+                    Math.abs(bounds.getWidth() - mapWidth) +
+                    Math.abs(bounds.getHeight() - mapHeight);
+                if (diff < closest) {
+                    closest = diff;
+                    scale = rec;
+                }
+            } else {
+                var contains = options.mode == "screen" ?
+                    !extent.containsBounds(bounds) :
+                    bounds.containsBounds(extent);
+                if (contains || (options.mode == "screen" && !contains)) {
+                    scale = rec;
+                }
+                return contains;
+            }
+        }, this);
+        this.setScale(scale, units);
+        delete this._updating;
+        this.updateFeature(this.feature.geometry, {
+            center: center,
+            scale: scale
+        });
+    },
+
+    /** private: method[updateFeature]
+     *  :param geometry: ``OpenLayers.Geometry`` New geometry for the feature.
+     *      If not provided, the existing geometry will be left unchanged.
+     *  :param mods: ``Object`` An object with one or more of ``scale``,
+     *      ``center`` and ``rotation``, reflecting the page properties to
+     *      update.
+     *      
+     *  Updates the page feature with a new geometry and notifies listeners
+     *  of changed page properties.
+     */
+    updateFeature: function(geometry, mods) {
+        var f = this.feature;
+        var modified = f.geometry !== geometry;
+        geometry.id = f.geometry.id;
+        f.geometry = geometry;
+        
+        if(!this._updating) {
+            for(var property in mods) {
+                if(mods[property] === this[property]) {
+                    delete mods[property];
+                } else {
+                    this[property] = mods[property];
+                    modified = true;
+                }
+            }
+            Ext.apply(this, mods);
+            
+            f.layer && f.layer.drawFeature(f);
+            modified && this.fireEvent("change", this, mods);
+        }
+    },    
+    
+    /** private: method[calculatePageBounds]
+     *  :param scale: ``Ext.data.Record`` Scale record to calculate the page
+     *      bounds for.
+     *  :param units: ``String`` Map units to use for the scale calculation.
+     *      Optional if ``feature`` is added to a layer which is added to a
+     *      map. If not provided, "dd" will be assumed.
+     *  :return: ``OpenLayers.Bounds``
+     *  
+     *  Calculates the page bounds for a given scale.
+     */
+    calculatePageBounds: function(scale, units) {
+        var s = scale.get("value");
+        var f = this.feature;
+        var geom = this.feature.geometry;
+        var center = geom.getBounds().getCenterLonLat();
+
+        var size = this.printProvider.layout.get("size");
+        var units = units ||
+            (f.layer && f.layer.map && f.layer.map.getUnits()) ||
+            "dd";
+        var unitsRatio = OpenLayers.INCHES_PER_UNIT[units];
+        var w = size.width / 72 / unitsRatio * s / 2;
+        var h = size.height / 72 / unitsRatio * s / 2;
+        
+        return new OpenLayers.Bounds(center.lon - w, center.lat - h,
+            center.lon + w, center.lat + h);
+    },
+    
+    /** private: method[onLayoutChange]
+     *  Handler for the printProvider's layoutchange event.
+     */
+    onLayoutChange: function() {
+        if(this.printProvider.layout.get("rotation") === false) {
+            this.setRotation(0, true);
+        }
+        // at init time the print provider triggers layoutchange
+        // before loadcapabilities, i.e. before we set this.scale
+        // to the first scale in the scales store, we need to
+        // guard against that
+        this.scale && this.setScale(this.scale);
+    },
+    
+    /** private: method[destroy]
+     */
+    destroy: function() {
+        this.printProvider.un("layoutchange", this.onLayoutChange, this);
+    }
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureRecord.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureRecord.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/FeatureRecord.js	(revision 76)
@@ -0,0 +1,92 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = FeatureRecord
+ *  base_link = `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: FeatureRecord
+ *  
+ *      A record that represents an ``OpenLayers.Feature.Vector``. This record
+ *      will always have at least the following fields:
+ *
+ *      * state ``String``
+ *      * fid ``String``
+ *
+ */
+GeoExt.data.FeatureRecord = Ext.data.Record.create([
+    {name: "feature"}, {name: "state"}, {name: "fid"}
+]);
+
+/** api: method[getFeature]
+ *  :return: ``OpenLayers.Feature.Vector``
+ *
+ *  Gets the feature for this record.
+ */
+GeoExt.data.FeatureRecord.prototype.getFeature = function() {
+    return this.get("feature");
+};
+
+/** api: method[setLayer]
+ *  :param layer: ``OpenLayers.Feature.Vector``
+ *
+ *  Sets the feature for this record.
+ */
+GeoExt.data.FeatureRecord.prototype.setFeature = function(feature) {
+    if (feature !== this.data.feature) {
+        this.dirty = true;
+        if (!this.modified) {
+            this.modified = {};
+        }
+        if (this.modified.feature === undefined) {
+            this.modified.feature = this.data.feature;
+        }
+        this.data.feature = feature;
+        if (!this.editing){
+            this.afterEdit();
+        }
+    }
+};
+
+/** api: classmethod[create]
+ *  :param o: ``Array`` Field definition as in ``Ext.data.Record.create``. Can
+ *      be omitted if no additional fields are required.
+ *  :return: ``Function`` A specialized :class:`GeoExt.data.FeatureRecord`
+ *      constructor.
+ *  
+ *  Creates a constructor for a :class:`GeoExt.data.FeatureRecord`, optionally
+ *  with additional fields.
+ */
+GeoExt.data.FeatureRecord.create = function(o) {
+    var f = Ext.extend(GeoExt.data.FeatureRecord, {});
+    var p = f.prototype;
+
+    p.fields = new Ext.util.MixedCollection(false, function(field) {
+        return field.name;
+    });
+
+    GeoExt.data.FeatureRecord.prototype.fields.each(function(f) {
+        p.fields.add(f);
+    });
+
+    if(o) {
+        for(var i = 0, len = o.length; i < len; i++){
+            p.fields.add(new Ext.data.Field(o[i]));
+        }
+    }
+
+    f.getField = function(name) {
+        return p.fields.get(name);
+    };
+
+    return f;
+};
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WFSCapabilitiesReader.js	(revision 76)
@@ -0,0 +1,142 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WFSCapabilitiesReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WFSCapabilitiesReader(meta, recordType)
+ *  
+ *      :param meta: ``Object`` Reader configuration.
+ *      :param recordType: ``Array | Ext.data.Record`` An array of field
+ *          configuration objects or a record object.  Default is
+ *          :class:`GeoExt.data.LayerRecord`.
+ *   
+ *      Data reader class to create an array of
+ *      :class:`GeoExt.data.LayerRecord` objects from a WFS GetCapabilities
+ *      response.
+ */
+GeoExt.data.WFSCapabilitiesReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!meta.format) {
+        meta.format = new OpenLayers.Format.WFSCapabilities();
+    }
+    if(!(typeof recordType === "function")) {
+        recordType = GeoExt.data.LayerRecord.create(
+            recordType || meta.fields || [
+                {name: "name", type: "string"},
+                {name: "title", type: "string"},
+                {name: "namespace", type: "string", mapping: "featureNS"},
+                {name: "abstract", type: "string"}
+            ]
+        );
+    }
+    GeoExt.data.WFSCapabilitiesReader.superclass.constructor.call(
+        this, meta, recordType
+    );
+};
+
+Ext.extend(GeoExt.data.WFSCapabilitiesReader, Ext.data.DataReader, {
+
+    /** private: method[read]
+     *  :param request: ``Object`` The XHR object which contains the parsed XML
+     *      document.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     */
+    read: function(request) {
+        var data = request.responseXML;
+        if(!data || !data.documentElement) {
+            data = request.responseText;
+        }
+        return this.readRecords(data);
+    },
+
+    /** private: method[readRecords]
+     *  :param data: ``DOMElement | String | Object`` A document element or XHR
+     *      response string.  As an alternative to fetching capabilities data
+     *      from a remote source, an object representing the capabilities can
+     *      be provided given that the structure mirrors that returned from the
+     *      capabilities parser.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     *  
+     *  Create a data block containing Ext.data.Records from an XML document.
+     */
+    readRecords: function(data) {
+        if(typeof data === "string" || data.nodeType) {
+            data = this.meta.format.read(data);
+        }
+
+        var featureTypes = data.featureTypeList.featureTypes;
+        var fields = this.recordType.prototype.fields;
+
+        var featureType, values, field, v, parts, layer, values;
+        var layerOptions, protocolOptions;
+
+        var protocolDefaults = {
+            url: data.capability.request.getfeature.href.post
+        };
+
+        var records = [];
+
+        for(var i=0, lenI=featureTypes.length; i<lenI; i++) {
+            featureType = featureTypes[i];
+            if(featureType.name) {
+                values = {};
+
+                for(var j=0, lenJ=fields.length; j<lenJ; j++) {
+                    field = fields.items[j];
+                    v = featureType[field.mapping || field.name] ||
+                        field.defaultValue;
+                    v = field.convert(v);
+                    values[field.name] = v;
+                }
+
+                protocolOptions = {
+                    featureType: featureType.name,
+                    featureNS: featureType.featureNS
+                };
+                if(this.meta.protocolOptions) {
+                    Ext.apply(protocolOptions, this.meta.protocolOptions, 
+                        protocolDefaults);
+                } else {
+                    Ext.apply(protocolOptions, {}, protocolDefaults);
+                }
+
+                layerOptions = {
+                    protocol: new OpenLayers.Protocol.WFS(protocolOptions),
+                    strategies: [new OpenLayers.Strategy.Fixed()]
+                };
+                if(this.meta.layerOptions) {
+                    Ext.apply(layerOptions, this.meta.layerOptions);
+                }
+
+                values.layer = new OpenLayers.Layer.Vector(
+                    featureType.title || featureType.name,
+                    layerOptions
+                );
+
+                records.push(new this.recordType(values, values.layer.id));
+            }
+        }
+        return {
+            totalRecords: records.length,
+            success: true,
+            records: records
+        };
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesStore.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesStore.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesStore.js	(revision 76)
@@ -0,0 +1,61 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/WMSCapabilitiesReader.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WMSCapabilitiesStore
+ *  base_link = `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WMSCapabilitiesStore
+ *  
+ *      Small helper class to make creating stores for remote WMS layer data
+ *      easier.  The store is pre-configured with a built-in
+ *      ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WMSCapabilitiesReader`.
+ *      The proxy is configured to allow caching and issues requests via GET.
+ *      If you require some other proxy/reader combination then you'll have to
+ *      configure this with your own proxy or create a basic
+ *      :class:`GeoExt.data.LayerStore` and configure as needed.
+ */
+
+/** api: config[format]
+ *  ``OpenLayers.Format``
+ *  A parser for transforming the XHR response into an array of objects
+ *  representing attributes.  Defaults to an ``OpenLayers.Format.WMSCapabilities``
+ *  parser.
+ */
+
+/** api: config[fields]
+ *  ``Array | Function``
+ *  Either an Array of field definition objects as passed to
+ *  ``Ext.data.Record.create``, or a record constructor created using
+ *  ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``. 
+ */
+
+GeoExt.data.WMSCapabilitiesStore = function(c) {
+    c = c || {};
+    GeoExt.data.WMSCapabilitiesStore.superclass.constructor.call(
+        this,
+        Ext.apply(c, {
+            proxy: c.proxy || (!c.data ?
+                new Ext.data.HttpProxy({url: c.url, disableCaching: false, method: "GET"}) :
+                undefined
+            ),
+            reader: new GeoExt.data.WMSCapabilitiesReader(
+                c, c.fields
+            )
+        })
+    );
+};
+Ext.extend(GeoExt.data.WMSCapabilitiesStore, Ext.data.Store);
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/LayerReader.js	(revision 76)
@@ -0,0 +1,89 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = LayerReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt", "GeoExt.data");
+
+/** api: example
+ *  Sample using a reader to create records from an array of layers:
+ * 
+ *  .. code-block:: javascript
+ *     
+ *      var reader = new GeoExt.data.LayerReader();
+ *      var layerData = reader.readRecords(map.layers);
+ *      var numRecords = layerData.totalRecords;
+ *      var layerRecords = layerData.records;
+ */
+
+/** api: constructor
+ *  .. class:: LayerReader(meta, recordType)
+ *  
+ *      Data reader class to create an array of
+ *      :class:`GeoExt.data.LayerRecord` objects from an array of 
+ *      ``OpenLayers.Layer`` objects for use in a
+ *      :class:`GeoExt.data.LayerStore` object.
+ */
+GeoExt.data.LayerReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!(recordType instanceof Function)) {
+        recordType = GeoExt.data.LayerRecord.create(
+            recordType || meta.fields || {});
+    }
+    GeoExt.data.LayerReader.superclass.constructor.call(
+        this, meta, recordType);
+};
+
+Ext.extend(GeoExt.data.LayerReader, Ext.data.DataReader, {
+
+    /** private: property[totalRecords]
+     *  ``Integer``
+     */
+    totalRecords: null,
+
+    /** api: method[readRecords]
+     *  :param layers: ``Array(OpenLayers.Layer)`` List of layers for creating
+     *      records.
+     *  :return: ``Object``  An object with ``records`` and ``totalRecords``
+     *      properties.
+     *  
+     *  From an array of ``OpenLayers.Layer`` objects create a data block
+     *  containing :class:`GeoExt.data.LayerRecord` objects.
+     */
+    readRecords : function(layers) {
+        var records = [];
+        if(layers) {
+            var recordType = this.recordType, fields = recordType.prototype.fields;
+            var i, lenI, j, lenJ, layer, values, field, v;
+            for(i = 0, lenI = layers.length; i < lenI; i++) {
+                layer = layers[i];
+                values = {};
+                for(j = 0, lenJ = fields.length; j < lenJ; j++){
+                    field = fields.items[j];
+                    v = layer[field.mapping || field.name] ||
+                        field.defaultValue;
+                    v = field.convert(v);
+                    values[field.name] = v;
+                }
+                values.layer = layer;
+                records[records.length] = new recordType(values, layer.id);
+            }
+        }
+        return {
+            records: records,
+            totalRecords: this.totalRecords != null ? this.totalRecords : records.length
+        };
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesReader.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesReader.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/WMSCapabilitiesReader.js	(revision 76)
@@ -0,0 +1,265 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include GeoExt/data/LayerRecord.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = WMSCapabilitiesReader
+ *  base_link = `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+ */
+Ext.namespace("GeoExt.data");
+
+/** api: constructor
+ *  .. class:: WMSCapabilitiesReader(meta, recordType)
+ *  
+ *      :param meta: ``Object`` Reader configuration from which:
+ *          ``layerOptions`` is an optional object passed as default options
+ *          to the ``OpenLayers.Layer.WMS`` constructor.
+ *          ``layerParams`` is an optional set of parameters to pass into the
+ *          ``OpenLayers.Layer.WMS`` constructor.
+ *      :param recordType: ``Array | Ext.data.Record`` An array of field
+ *          configuration objects or a record object.  Default is
+ *          :class:`GeoExt.data.LayerRecord` with the following fields:
+ *          name, title, abstract, queryable, opaque, noSubsets, cascaded,
+ *          fixedWidth, fixedHeight, minScale, maxScale, prefix, formats,
+ *          styles, srs, dimensions, bbox, llbbox, attribution, keywords,
+ *          identifiers, authorityURLs, metadataURLs.
+ *          The type of these fields is the same as for the matching fields in
+ *          the object returned from
+ *          ``OpenLayers.Format.WMSCapabilities::read()``.
+ *   
+ *      Data reader class to create an array of
+ *      :class:`GeoExt.data.LayerRecord` objects from a WMS GetCapabilities
+ *      response.
+ */
+GeoExt.data.WMSCapabilitiesReader = function(meta, recordType) {
+    meta = meta || {};
+    if(!meta.format) {
+        meta.format = new OpenLayers.Format.WMSCapabilities();
+    }
+    if(typeof recordType !== "function") {
+        recordType = GeoExt.data.LayerRecord.create(
+            recordType || meta.fields || [
+                {name: "name", type: "string"},
+                {name: "title", type: "string"},
+                {name: "abstract", type: "string"},
+                {name: "queryable", type: "boolean"},
+                {name: "opaque", type: "boolean"},
+                {name: "noSubsets", type: "boolean"},
+                {name: "cascaded", type: "int"},
+                {name: "fixedWidth", type: "int"},
+                {name: "fixedHeight", type: "int"},
+                {name: "minScale", type: "float"},
+                {name: "maxScale", type: "float"},
+                {name: "prefix", type: "string"},
+                {name: "formats"}, // array
+                {name: "styles"}, // array
+                {name: "srs"}, // object
+                {name: "dimensions"}, // object
+                {name: "bbox"}, // object
+                {name: "llbbox"}, // array
+                {name: "attribution"}, // object
+                {name: "keywords"}, // array
+                {name: "identifiers"}, // object
+                {name: "authorityURLs"}, // object
+                {name: "metadataURLs"} // array
+            ]
+        );
+    }
+    GeoExt.data.WMSCapabilitiesReader.superclass.constructor.call(
+        this, meta, recordType
+    );
+};
+
+Ext.extend(GeoExt.data.WMSCapabilitiesReader, Ext.data.DataReader, {
+
+
+    /** api: config[attributionCls]
+     *  ``String`` CSS class name for the attribution DOM elements.
+     *  Element class names append "-link", "-image", and "-title" as
+     *  appropriate.  Default is "gx-attribution".
+     */
+    attributionCls: "gx-attribution",
+
+    /** private: method[read]
+     *  :param request: ``Object`` The XHR object which contains the parsed XML
+     *      document.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     */
+    read: function(request) {
+        var data = request.responseXML;
+        if(!data || !data.documentElement) {
+            data = request.responseText;
+        }
+        return this.readRecords(data);
+    },
+    
+    /** private: method[serviceExceptionFormat]
+     *  :param formats: ``Array`` An array of service exception format strings.
+     *  :return: ``String`` The (supposedly) best service exception format.
+     */
+    serviceExceptionFormat: function(formats) {
+        if (OpenLayers.Util.indexOf(formats, 
+            "application/vnd.ogc.se_inimage")>-1) {
+            return "application/vnd.ogc.se_inimage";
+        }
+        if (OpenLayers.Util.indexOf(formats, 
+            "application/vnd.ogc.se_xml")>-1) {
+            return "application/vnd.ogc.se_xml";
+        }
+        return formats[0];
+    },
+    
+    /** private: method[imageFormat]
+     *  :param layer: ``Object`` The layer's capabilities object.
+     *  :return: ``String`` The (supposedly) best mime type for requesting 
+     *      tiles.
+     */
+    imageFormat: function(layer) {
+        var formats = layer.formats;
+        if (layer.opaque && 
+            OpenLayers.Util.indexOf(formats, "image/jpeg")>-1) {
+            return "image/jpeg";
+        }
+        if (OpenLayers.Util.indexOf(formats, "image/png")>-1) {
+            return "image/png";
+        }
+        if (OpenLayers.Util.indexOf(formats, "image/png; mode=24bit")>-1) {
+            return "image/png; mode=24bit";
+        }
+        if (OpenLayers.Util.indexOf(formats, "image/gif")>-1) {
+            return "image/gif";
+        }
+        return formats[0];
+    },
+
+    /** private: method[imageTransparent]
+     *  :param layer: ``Object`` The layer's capabilities object.
+     *  :return: ``Boolean`` The TRANSPARENT param.
+     */
+    imageTransparent: function(layer) {
+        return layer.opaque == undefined || !layer.opaque;
+    },
+
+    /** private: method[readRecords]
+     *  :param data: ``DOMElement | String | Object`` A document element or XHR
+     *      response string.  As an alternative to fetching capabilities data
+     *      from a remote source, an object representing the capabilities can
+     *      be provided given that the structure mirrors that returned from the
+     *      capabilities parser.
+     *  :return: ``Object`` A data block which is used by an ``Ext.data.Store``
+     *      as a cache of ``Ext.data.Record`` objects.
+     *  
+     *  Create a data block containing Ext.data.Records from an XML document.
+     */
+    readRecords: function(data) {
+        if(typeof data === "string" || data.nodeType) {
+            data = this.meta.format.read(data);
+        }
+        var version = data.version;
+        var capability = data.capability || {};
+        var url = capability.request && capability.request.getmap &&
+            capability.request.getmap.href; 
+        var layers = capability.layers; 
+        var formats = capability.exception ? capability.exception.formats : [];
+        var exceptions = this.serviceExceptionFormat(formats);
+        var records = [];
+        
+        if(url && layers) {
+            var fields = this.recordType.prototype.fields; 
+            var layer, values, options, params, field, v;
+
+            for(var i=0, lenI=layers.length; i<lenI; i++){
+                layer = layers[i];
+                if(layer.name) {
+                    values = {};
+                    for(var j=0, lenJ=fields.length; j<lenJ; j++) {
+                        field = fields.items[j];
+                        v = layer[field.mapping || field.name] ||
+                        field.defaultValue;
+                        v = field.convert(v);
+                        values[field.name] = v;
+                    }
+                    options = {
+                        attribution: layer.attribution ?
+                            this.attributionMarkup(layer.attribution) :
+                            undefined,
+                        minScale: layer.minScale,
+                        maxScale: layer.maxScale
+                    };
+                    if(this.meta.layerOptions) {
+                        Ext.apply(options, this.meta.layerOptions);
+                    }
+                    params = {
+                            layers: layer.name,
+                            exceptions: exceptions,
+                            format: this.imageFormat(layer),
+                            transparent: this.imageTransparent(layer),
+                            version: version
+                    };
+                    if (this.meta.layerParams) {
+                        Ext.apply(params, this.meta.layerParams);
+                    }
+                    values.layer = new OpenLayers.Layer.WMS(
+                        layer.title || layer.name, url, params, options
+                    );
+                    records.push(new this.recordType(values, values.layer.id));
+                }
+            }
+        }
+        
+        return {
+            totalRecords: records.length,
+            success: true,
+            records: records
+        };
+
+    },
+
+    /** private: method[attributionMarkup]
+     *  :param attribution: ``Object`` The attribution property of the layer
+     *      object as parsed from a WMS Capabilities document
+     *  :return: ``String`` HTML markup to display attribution
+     *      information.
+     *  
+     *  Generates attribution markup using the Attribution metadata
+     *      from WMS Capabilities
+     */
+    attributionMarkup : function(attribution){
+        var markup = [];
+        
+        if (attribution.logo){
+            markup.push("<img class='"+this.attributionCls+"-image' "
+                        + "src='" + attribution.logo.href + "' />");
+        }
+        
+        if (attribution.title) {
+            markup.push("<span class='"+ this.attributionCls + "-title'>"
+                        + attribution.title
+                        + "</span>");
+        }
+        
+        if(attribution.href){
+            for(var i = 0; i < markup.length; i++){
+                markup[i] = "<a class='"
+              + this.attributionCls + "-link' "
+                    + "href="
+                    + attribution.href
+                    + ">"
+                    + markup[i]
+                    + "</a>";
+            }
+        }
+
+        return markup.join(" ");
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ProtocolProxy.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ProtocolProxy.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/data/ProtocolProxy.js	(revision 76)
@@ -0,0 +1,127 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ *  module = GeoExt.data
+ *  class = ProtocolProxy
+ *  base_link = `Ext.data.DataProxy <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy>`_
+ */
+Ext.namespace('GeoExt', 'GeoExt.data');
+
+GeoExt.data.ProtocolProxy = function(config) {
+    Ext.apply(this, config);
+    GeoExt.data.ProtocolProxy.superclass.constructor.apply(this, arguments);
+};
+
+/** api: constructor
+ *  .. class:: ProtocolProxy
+ *   
+ *      A data proxy for use with ``OpenLayers.Protocol`` objects.
+ */
+Ext.extend(GeoExt.data.ProtocolProxy, Ext.data.DataProxy, {
+
+    /** api: config[protocol]
+     *  ``OpenLayers.Protocol``
+     *  The protocol used to fetch features.
+     */
+    protocol: null,
+
+    /** api: config[abortPrevious]
+     *  ``Boolean``
+     *  Abort any previous request before issuing another.  Default is ``true``.
+     */
+    abortPrevious: true,
+
+    /** api: config[setParamsAsOptions]
+     *  ``Boolean``
+     *  Should options.params be set directly on options before passing it into
+     *  the protocol's read method? Default is ``false``.
+     */
+    setParamsAsOptions: false,
+
+    /** private: property[response]
+     *  ``OpenLayers.Protocol.Response``
+     *  The response returned by the read call on the protocol.
+     */
+    response: null,
+
+    /** private: method[load]
+     *  :param params: ``Object`` An object containing properties which are to
+     *      be used as HTTP parameters for the request to the remote server.
+     *  :param reader: ``Ext.data.DataReader`` The Reader object which converts
+     *      the data object into a block of ``Ext.data.Records``.
+     *  :param callback: ``Function`` The function into which to pass the block
+     *      of ``Ext.data.Records``. The function is passed the Record block
+     *      object, the ``args`` argument passed to the load function, and a
+     *      boolean success indicator.
+     *  :param scope: ``Object`` The scope in which to call the callback.
+     *  :param arg: ``Object`` An optional argument which is passed to the
+     *      callback as its second parameter.
+     *
+     *  Calls ``read`` on the protocol.
+     */
+    load: function(params, reader, callback, scope, arg) {
+        if (this.fireEvent("beforeload", this, params) !== false) {
+            var o = {
+                params: params || {},
+                request: {
+                    callback: callback,
+                    scope: scope,
+                    arg: arg
+                },
+                reader: reader
+            };
+            var cb = OpenLayers.Function.bind(this.loadResponse, this, o);
+            if (this.abortPrevious) {
+                this.abortRequest();
+            }
+            var options = {
+                params: params,
+                callback: cb,
+                scope: this
+            };
+            Ext.applyIf(options, arg);
+            if (this.setParamsAsOptions === true) {
+                Ext.applyIf(options, options.params);
+                delete options.params;
+            }
+            this.response = this.protocol.read(options);
+        } else {
+           callback.call(scope || this, null, arg, false);
+        }
+    },
+
+    /** private: method[abortRequest]
+     *  Called to abort any ongoing request.
+     */
+    abortRequest: function() {
+        if (this.response) {
+            this.protocol.abort(this.response);
+            this.response = null;
+        }
+    },
+
+    /** private: method[loadResponse]
+     *  :param o: ``Object``
+     *  :param response: ``OpenLayers.Protocol.Response``
+     *  
+     *  Handle response from the protocol
+     */
+    loadResponse: function(o, response) {
+        if (response.success()) {
+            var result = o.reader.read(response);
+            this.fireEvent("load", this, o, o.request.arg);
+            o.request.callback.call(
+               o.request.scope, result, o.request.arg, true);
+        } else {
+            this.fireEvent("loadexception", this, o, response);
+            o.request.callback.call(
+                o.request.scope, null, o.request.arg, false);
+        }
+    }
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/SingleFile.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/SingleFile.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/lib/GeoExt/SingleFile.js	(revision 76)
@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.namespace("GeoExt");
+
+GeoExt.singleFile = true;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/examples.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/examples.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/examples.html	(revision 76)
@@ -0,0 +1,263 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Examples &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+    <link rel="next" title="GeoExt Community Involvement" href="developer/index.html" />
+    <link rel="prev" title="Primer: OpenLayers" href="primers/openlayers-primer.html" />
+    
+    
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <script src="_static/examples.js"></script>
+    <script>
+        var docversion = "1.0";
+    </script>
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="#">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Examples</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Examples</a><ul>
+<li><a class="reference external" href="#attribute-form">Attribute Form</a></li>
+<li><a class="reference external" href="#attribute-store-reader">Attribute Store &amp; Reader</a></li>
+<li><a class="reference external" href="#grid-with-features">Grid with Features</a></li>
+<li><a class="reference external" href="#layer-tree">Layer Tree</a></li>
+<li><a class="reference external" href="#layer-opacity-slider">Layer Opacity Slider</a></li>
+<li><a class="reference external" href="#legend-panel">Legend Panel</a></li>
+<li><a class="reference external" href="#map-panel">Map Panel</a></li>
+<li><a class="reference external" href="#map-panel-in-a-viewport">Map Panel (in a Viewport)</a></li>
+<li><a class="reference external" href="#map-panel-in-a-window">Map Panel (in a Window)</a></li>
+<li><a class="reference external" href="#permalink">Permalink</a></li>
+<li><a class="reference external" href="#feature-popup">Feature Popup</a></li>
+<li><a class="reference external" href="#modifying-popups">Modifying Popups</a></li>
+<li><a class="reference external" href="#interactive-print-extent">Interactive Print Extent</a></li>
+<li><a class="reference external" href="#print-configuration-with-a-form">Print Configuration with a Form</a></li>
+<li><a class="reference external" href="#print-your-map">Print Your Map</a></li>
+<li><a class="reference external" href="#print-preview-window">Print Preview Window</a></li>
+<li><a class="reference external" href="#printing-openstreetmap">Printing OpenStreetMap</a></li>
+<li><a class="reference external" href="#feature-renderer">Feature Renderer</a></li>
+<li><a class="reference external" href="#filter-form-panel">Filter Form Panel</a></li>
+<li><a class="reference external" href="#toolbar-with-actions">Toolbar with Actions</a></li>
+<li><a class="reference external" href="#tree-nodes">Tree Nodes</a></li>
+<li><a class="reference external" href="#tree-legend">Tree Legend</a></li>
+<li><a class="reference external" href="#vector-legend">Vector Legend</a></li>
+<li><a class="reference external" href="#wms-capabilities-store">WMS Capabilities Store</a></li>
+<li><a class="reference external" href="#wms-capabilities-tree">WMS Capabilities Tree</a></li>
+<li><a class="reference external" href="#scale-chooser">Scale Chooser</a></li>
+<li><a class="reference external" href="#zoom-slider">Zoom Slider</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="primers/openlayers-primer.html"
+                                  title="previous chapter">Primer: OpenLayers</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="developer/index.html"
+                                  title="next chapter">GeoExt Community Involvement</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="examples">
+<span id="id1"></span><h1>Examples<a class="headerlink" href="#examples" title="Permalink to this headline">Â¶</a></h1>
+<div class="exampleblock example-attribute-form section" id="attribute-form">
+<span id="example-attribute-form"></span><h2>Attribute Form<a class="headerlink" href="#attribute-form" title="Permalink to this headline">Â¶</a></h2>
+<p>Create a form with fields from attributes read from a WFS
+DescribeFeatureType response</p>
+</div>
+<div class="exampleblock example-attributes section" id="attribute-store-reader">
+<span id="example-attributes"></span><h2>Attribute Store &amp; Reader<a class="headerlink" href="#attribute-store-reader" title="Permalink to this headline">Â¶</a></h2>
+<p>Create records with attribute types and values with an AttributeStore.</p>
+</div>
+<div class="exampleblock example-feature-grid section" id="grid-with-features">
+<span id="example-feature-grid"></span><h2>Grid with Features<a class="headerlink" href="#grid-with-features" title="Permalink to this headline">Â¶</a></h2>
+<p>Synchronize selection of features between a grid and a layer.</p>
+</div>
+<div class="exampleblock example-layercontainer section" id="layer-tree">
+<span id="example-layercontainer"></span><h2>Layer Tree<a class="headerlink" href="#layer-tree" title="Permalink to this headline">Â¶</a></h2>
+<p>Create a layer tree with a LayerContainer.</p>
+</div>
+<div class="exampleblock example-layeropacityslider section" id="layer-opacity-slider">
+<span id="example-layeropacityslider"></span><h2>Layer Opacity Slider<a class="headerlink" href="#layer-opacity-slider" title="Permalink to this headline">Â¶</a></h2>
+<p>Use a slider to control layer opacity.</p>
+</div>
+<div class="exampleblock example-legendpanel section" id="legend-panel">
+<span id="example-legendpanel"></span><h2>Legend Panel<a class="headerlink" href="#legend-panel" title="Permalink to this headline">Â¶</a></h2>
+<p>Display a layer legend in a panel.</p>
+</div>
+<div class="exampleblock example-mappanel-div section" id="map-panel">
+<span id="example-mappanel-div"></span><h2>Map Panel<a class="headerlink" href="#map-panel" title="Permalink to this headline">Â¶</a></h2>
+<p>Render a map panel in any block level page element.</p>
+</div>
+<div class="exampleblock example-mappanel-viewport section" id="map-panel-in-a-viewport">
+<span id="example-mappanel-viewport"></span><h2>Map Panel (in a Viewport)<a class="headerlink" href="#map-panel-in-a-viewport" title="Permalink to this headline">Â¶</a></h2>
+<p>Render a map panel in a viewport.</p>
+</div>
+<div class="exampleblock example-mappanel-window section" id="map-panel-in-a-window">
+<span id="example-mappanel-window"></span><h2>Map Panel (in a Window)<a class="headerlink" href="#map-panel-in-a-window" title="Permalink to this headline">Â¶</a></h2>
+<p>Render a map panel in a Window.</p>
+</div>
+<div class="exampleblock example-permalink section" id="permalink">
+<span id="example-permalink"></span><h2>Permalink<a class="headerlink" href="#permalink" title="Permalink to this headline">Â¶</a></h2>
+<p>Display a permalink each time the map changes position.</p>
+</div>
+<div class="exampleblock example-popup section" id="feature-popup">
+<span id="example-popup"></span><h2>Feature Popup<a class="headerlink" href="#feature-popup" title="Permalink to this headline">Â¶</a></h2>
+<p>Display a popup with feature information.</p>
+</div>
+<div class="exampleblock example-popup-more section" id="modifying-popups">
+<span id="example-popup-more"></span><h2>Modifying Popups<a class="headerlink" href="#modifying-popups" title="Permalink to this headline">Â¶</a></h2>
+<p>Update a popup with information from multiple locations.</p>
+</div>
+<div class="exampleblock example-print-extent section" id="interactive-print-extent">
+<span id="example-print-extent"></span><h2>Interactive Print Extent<a class="headerlink" href="#interactive-print-extent" title="Permalink to this headline">Â¶</a></h2>
+<p>Change print scale, center and rotation with the PrintExtent plugin.</p>
+</div>
+<div class="exampleblock example-print-form section" id="print-configuration-with-a-form">
+<span id="example-print-form"></span><h2>Print Configuration with a Form<a class="headerlink" href="#print-configuration-with-a-form" title="Permalink to this headline">Â¶</a></h2>
+<p>Use form field plugins to control print output.</p>
+</div>
+<div class="exampleblock example-print-page section" id="print-your-map">
+<span id="example-print-page"></span><h2>Print Your Map<a class="headerlink" href="#print-your-map" title="Permalink to this headline">Â¶</a></h2>
+<p>Print the visible extent of a MapPanel with PrintPage and PrintProvider.</p>
+</div>
+<div class="exampleblock example-print-preview section" id="print-preview-window">
+<span id="example-print-preview"></span><h2>Print Preview Window<a class="headerlink" href="#print-preview-window" title="Permalink to this headline">Â¶</a></h2>
+<p>Use the PrintMapPanel for interactive print previews.</p>
+</div>
+<div class="exampleblock example-print-preview-osm section" id="printing-openstreetmap">
+<span id="example-print-preview-osm"></span><h2>Printing OpenStreetMap<a class="headerlink" href="#printing-openstreetmap" title="Permalink to this headline">Â¶</a></h2>
+<p>PrintMapPanel with an OSM map.</p>
+</div>
+<div class="exampleblock example-renderer section" id="feature-renderer">
+<span id="example-renderer"></span><h2>Feature Renderer<a class="headerlink" href="#feature-renderer" title="Permalink to this headline">Â¶</a></h2>
+<p>Render a vector feature with multiple symbolizers in a box component.</p>
+</div>
+<div class="exampleblock example-search-form section" id="filter-form-panel">
+<span id="example-search-form"></span><h2>Filter Form Panel<a class="headerlink" href="#filter-form-panel" title="Permalink to this headline">Â¶</a></h2>
+<p>Use a form to build an OpenLayers filter.</p>
+</div>
+<div class="exampleblock example-toolbar section" id="toolbar-with-actions">
+<span id="example-toolbar"></span><h2>Toolbar with Actions<a class="headerlink" href="#toolbar-with-actions" title="Permalink to this headline">Â¶</a></h2>
+<p>Create a toolbar with GeoExt Actions.</p>
+</div>
+<div class="exampleblock example-tree section" id="tree-nodes">
+<span id="example-tree"></span><h2>Tree Nodes<a class="headerlink" href="#tree-nodes" title="Permalink to this headline">Â¶</a></h2>
+<p>Create all kinds of tree nodes.</p>
+</div>
+<div class="exampleblock example-tree-legend section" id="tree-legend">
+<span id="example-tree-legend"></span><h2>Tree Legend<a class="headerlink" href="#tree-legend" title="Permalink to this headline">Â¶</a></h2>
+<p>Render layer nodes with legends.</p>
+</div>
+<div class="exampleblock example-vector-legend section" id="vector-legend">
+<span id="example-vector-legend"></span><h2>Vector Legend<a class="headerlink" href="#vector-legend" title="Permalink to this headline">Â¶</a></h2>
+<p>Render a legend for a vector layer.</p>
+</div>
+<div class="exampleblock example-wms-capabilities section" id="wms-capabilities-store">
+<span id="example-wms-capabilities"></span><h2>WMS Capabilities Store<a class="headerlink" href="#wms-capabilities-store" title="Permalink to this headline">Â¶</a></h2>
+<p>Create layer records from WMS capabilities documents.</p>
+</div>
+<div class="exampleblock example-wms-tree section" id="wms-capabilities-tree">
+<span id="example-wms-tree"></span><h2>WMS Capabilities Tree<a class="headerlink" href="#wms-capabilities-tree" title="Permalink to this headline">Â¶</a></h2>
+<p>Create a tree loader from WMS capabilities documents.</p>
+</div>
+<div class="exampleblock example-zoom-chooser section" id="scale-chooser">
+<span id="example-zoom-chooser"></span><h2>Scale Chooser<a class="headerlink" href="#scale-chooser" title="Permalink to this headline">Â¶</a></h2>
+<p>Use a ComboBox to display available map scales.</p>
+</div>
+<div class="exampleblock example-zoomslider section" id="zoom-slider">
+<span id="example-zoomslider"></span><h2>Zoom Slider<a class="headerlink" href="#zoom-slider" title="Permalink to this headline">Â¶</a></h2>
+<p>Use a slider to control map scale.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="developer/index.html" title="GeoExt Community Involvement"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="primers/openlayers-primer.html" title="Primer: OpenLayers"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Examples</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/ext-primer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/ext-primer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/ext-primer.html	(revision 76)
@@ -0,0 +1,231 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Primer: Ext &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Core Concepts" href="index.html" />
+    <link rel="next" title="Primer: OpenLayers" href="openlayers-primer.html" />
+    <link rel="prev" title="Core Concepts" href="index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Core Concepts</a> &raquo;</li>
+        <li><a href="#">Primer: Ext</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Primer: Ext</a><ul>
+<li><a class="reference external" href="#getting-started">Getting Started</a></li>
+<li><a class="reference external" href="#basic-layout">Basic Layout</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="index.html"
+                                  title="previous chapter">Core Concepts</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="openlayers-primer.html"
+                                  title="next chapter">Primer: OpenLayers</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="primer-ext">
+<span id="ext-primer"></span><h1>Primer: Ext<a class="headerlink" href="#primer-ext" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt extends <a class="reference external" href="http://www.sencha.com/products/js/">Ext JS</a>, a rich library of web UI
+widgets and helper classes.  Using GeoExt requires a working knowledge
+of Ext&#8217;s idioms.  This tutorial provides a quick overview of core Ext concepts.</p>
+<div class="section" id="getting-started">
+<span id="ext-getting-started"></span><h2>Getting Started<a class="headerlink" href="#getting-started" title="Permalink to this headline">Â¶</a></h2>
+<p>To start using Ext, you will first have to <a class="reference external" href="http://www.sencha.com/products/js/download.php">download</a> it.
+For more complete instructions about how configure a web page to use
+Ext, you can check the <a class="reference external" href="../tutorials/quickstart.html"><em>GeoExt QuickStart</em></a> tutorial.</p>
+<p>When you download Ext, you also get their excellent
+<a class="reference external" href="http://dev.sencha.com/deploy/dev/examples/">Examples</a> and
+<a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/">API Documentation</a>, which you can also
+look at on-line for education and reference.</p>
+<p>In order to get Ext running on a page you will need to have something
+like the following in the <tt class="docutils literal"><span class="pre">&lt;head&gt;</span></tt> of an HTML page in a directory
+that is published by your web server.</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/adapter/ext/ext-base.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/ext-all.js&quot;</span>  <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span> <span class="na">href=</span><span class="s">&quot;ext-3.2.1/resources/css/ext-all.css&quot;</span><span class="nt">&gt;&lt;/link&gt;</span>
+</pre></div>
+</div>
+<p>This will load the code and styles for Ext.  Change the paths
+according to where you have put the Ext files.</p>
+<p>When writing Ext code, most of what you will be doing is instantiating
+classes with constructors that takes a single object&#8211;its
+configuration object&#8211;as an argument.  This snippet demonstrates this
+coding pattern:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">Ext</span><span class="p">.</span><span class="nx">onReady</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
+    <span class="kd">var</span> <span class="nx">myPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Panel</span><span class="p">({</span>
+        <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Hello World!&#39;</span><span class="p">,</span>
+        <span class="nx">html</span><span class="o">:</span> <span class="s1">&#39;&lt;i&gt;Hello World!&lt;/i&gt; Please enjoy this primer on Ext!&#39;</span><span class="p">,</span>
+        <span class="nx">collapsible</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">width</span><span class="o">:</span><span class="mi">300</span><span class="p">,</span>
+        <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;panelDiv&#39;</span>
+    <span class="p">});</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>There are a few things to note about this example:</p>
+<ul class="simple">
+<li>This code uses Ext&#8217;s <tt class="docutils literal"><span class="pre">onReady</span></tt> method to trigger the method when the
+document&#8217;s body is ready. (This is cleaner than using body&#8217;s <tt class="docutils literal"><span class="pre">onready</span></tt>
+event, and with <tt class="docutils literal"><span class="pre">Ext.onReady</span></tt> several functions can be queued for execution
+before the page loads.)</li>
+<li>When the page is ready, the <tt class="docutils literal"><span class="pre">Ext.Panel</span></tt> constructor is called with a
+single configuration object as argument.  The Panel&#8217;s structure should
+be familiar from your desktop experience.  It has a <tt class="docutils literal"><span class="pre">title</span></tt> which
+runs across the top, and some content which in this case is <tt class="docutils literal"><span class="pre">html</span></tt>
+provided in the configuration.</li>
+<li>Many configuration options (best explored in the Ext examples and API
+documention) are available.  Here, they are represented by the
+<tt class="docutils literal"><span class="pre">collapsible</span></tt> property, which allows the user to collapse the panel
+much like you can minimize your browser&#8217;s window, and the <tt class="docutils literal"><span class="pre">width</span></tt> of
+the panel specified in pixels.</li>
+<li>Lastly, this code assumes that somewhere in the DOM of the page is a
+<tt class="docutils literal"><span class="pre">div</span></tt> with the id <tt class="docutils literal"><span class="pre">panelDiv</span></tt>.  When the Panel is constructed, it
+will be automatically rendered in this div because of the <tt class="docutils literal"><span class="pre">renderTo</span></tt>
+option. (This option can be left out and panels rendered manually, if
+desired.)</li>
+</ul>
+</div>
+<div class="section" id="basic-layout">
+<span id="ext-basic-layout"></span><h2>Basic Layout<a class="headerlink" href="#basic-layout" title="Permalink to this headline">Â¶</a></h2>
+<p>Ext makes it easy to separate out your UI into logical blocks.
+Most often you will be using one or more nested <em>Containers</em>.  The
+<tt class="docutils literal"><span class="pre">Ext.Panel</span></tt> built above is the most common kind of container.  You
+can nest panels using the <tt class="docutils literal"><span class="pre">items</span></tt> property.  For example:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">Ext</span><span class="p">.</span><span class="nx">onReady</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
+    <span class="kd">var</span> <span class="nx">myPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Panel</span><span class="p">({</span>
+        <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Top level&#39;</span><span class="p">,</span>
+        <span class="nx">layout</span><span class="o">:</span> <span class="s1">&#39;border&#39;</span><span class="p">,</span>
+        <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+            <span class="nx">xtype</span><span class="o">:</span><span class="s1">&#39;panel&#39;</span><span class="p">,</span>
+            <span class="nx">title</span><span class="o">:</span><span class="s1">&#39;Sub1&#39;</span><span class="p">,</span>
+            <span class="nx">html</span><span class="o">:</span><span class="s1">&#39;Contents of sub panel 1&#39;</span><span class="p">,</span>
+            <span class="nx">region</span><span class="o">:</span> <span class="s1">&#39;east&#39;</span>
+        <span class="p">},{</span>
+            <span class="nx">xtype</span><span class="o">:</span><span class="s1">&#39;panel&#39;</span><span class="p">,</span>
+            <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Sub2&#39;</span><span class="p">,</span>
+            <span class="nx">html</span><span class="o">:</span><span class="s1">&#39;Contents of sub panel 2&#39;</span><span class="p">,</span>
+            <span class="nx">region</span><span class="o">:</span> <span class="s1">&#39;center&#39;</span>
+        <span class="p">}],</span>
+        <span class="nx">width</span><span class="o">:</span><span class="mi">300</span><span class="p">,</span>
+        <span class="nx">height</span><span class="o">:</span><span class="mi">200</span><span class="p">,</span>
+        <span class="nx">renderTo</span><span class="o">:</span><span class="s1">&#39;panelDiv&#39;</span>
+    <span class="p">});</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>This code introduces some new concepts:</p>
+<ul class="simple">
+<li>Each of the objects in the <tt class="docutils literal"><span class="pre">items</span></tt> array is a configuration
+object for a panel like the one in the earlier example.</li>
+<li>The <tt class="docutils literal"><span class="pre">Ext.Panel</span></tt> constructor is never called, however.  Instead,
+the <tt class="docutils literal"><span class="pre">xtype</span></tt> option is used.  By setting the xtype, you tell Ext
+what class the configuration is for, and Ext instantiates that class
+when appropriate.</li>
+<li>The <tt class="docutils literal"><span class="pre">layout</span></tt> property on the outer container determines the
+position of the items within it.  Here, we have set the layout to be
+a <em>border</em> layout, which requires that items be given a <tt class="docutils literal"><span class="pre">region</span></tt>
+property like &#8220;center&#8221;, &#8220;north&#8221;, &#8220;south&#8221;, &#8220;east&#8221;, or &#8220;west&#8221;.</li>
+</ul>
+<p>Ext provides a variety of other layouts, including a Tab layout and a
+Wizard layout.  The best way to explore these layouts is using the <a class="reference external" href="http://dev.sencha.com/deploy/dev/examples/layout-browser/layout-browser.html">Ext
+Layout Browser</a>
+, which demonstrates each layout and provides sample code.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="openlayers-primer.html" title="Primer: OpenLayers"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="index.html" title="Core Concepts"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Core Concepts</a> &raquo;</li>
+        <li><a href="#">Primer: Ext</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/openlayers-primer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/openlayers-primer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/openlayers-primer.html	(revision 76)
@@ -0,0 +1,481 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Primer: OpenLayers &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Core Concepts" href="index.html" />
+    <link rel="next" title="Examples" href="../examples.html" />
+    <link rel="prev" title="Primer: Ext" href="ext-primer.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Core Concepts</a> &raquo;</li>
+        <li><a href="#">Primer: OpenLayers</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Primer: OpenLayers</a><ul>
+<li><a class="reference external" href="#layers">Layers</a><ul>
+<li><a class="reference external" href="#the-wms-layer">The WMS Layer</a></li>
+<li><a class="reference external" href="#the-vector-layer">The Vector Layer</a></li>
+<li><a class="reference external" href="#other-layers">Other Layers</a></li>
+</ul>
+</li>
+<li><a class="reference external" href="#controls">Controls</a><ul>
+<li><a class="reference external" href="#navigationhistory-control">NavigationHistory Control</a></li>
+<li><a class="reference external" href="#initialization-w-controls">Initialization w/ Controls</a></li>
+<li><a class="reference external" href="#more-controls">More Controls</a></li>
+</ul>
+</li>
+<li><a class="reference external" href="#events">Events</a><ul>
+<li><a class="reference external" href="#geoext-events">GeoExt Events</a></li>
+<li><a class="reference external" href="#openlayers-events">OpenLayers Events</a></li>
+<li><a class="reference external" href="#more-information">More Information</a></li>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="ext-primer.html"
+                                  title="previous chapter">Primer: Ext</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../examples.html"
+                                  title="next chapter">Examples</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="primer-openlayers">
+<h1>Primer: OpenLayers<a class="headerlink" href="#primer-openlayers" title="Permalink to this headline">Â¶</a></h1>
+<p>The OpenLayers mapping library is the key component of GeoExt, performing the
+core map-related functions of every GeoExt-based application. To get up to speed
+with GeoExt, let&#8217;s discover some OpenLayers basics.</p>
+<div class="section" id="layers">
+<h2>Layers<a class="headerlink" href="#layers" title="Permalink to this headline">Â¶</a></h2>
+<p>As its name suggests, OpenLayers manages a list of layers that together form a
+web-based mapping client. Each layer represents a different set of data. For
+instance, one layer might be responsible for displaying the boundary of a
+country. Another layer responsible for that country&#8217;s roads.</p>
+<p>OpenLayers contains many types of layers (you can see them all at the
+<a class="reference external" href="http://trac.openlayers.org/browser/trunk/openlayers/lib/OpenLayers/Layer">OpenLayers website</a>).
+For this primer, we&#8217;ll focus on two different layer types: <tt class="docutils literal"><span class="pre">WMS</span></tt> and
+<tt class="docutils literal"><span class="pre">Vector</span></tt>.</p>
+<div class="section" id="the-wms-layer">
+<h3>The WMS Layer<a class="headerlink" href="#the-wms-layer" title="Permalink to this headline">Â¶</a></h3>
+<p>This is the canonical layer type found in almost all GeoExt applications, where
+one or more images are used to display map-related information to the user. This
+type is named &#8216;WMS&#8217; because it implements the <a class="reference external" href="http://www.opengeospatial.org/standards/wms">Web Map Service</a> standard set by the <a class="reference external" href="http://www.opengeospatial.org/">Open
+Geospatial Consortium.</a></p>
+<p>If you followed the <a class="reference external" href="../tutorials/quickstart.html"><em>GeoExt QuickStart</em></a> guide, you will have already
+encountered a <tt class="docutils literal"><span class="pre">MapPanel</span></tt> and created your very own WMS layer. Let&#8217;s dissect
+what you did:</p>
+<blockquote>
+<div class="highlight-javascript"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre>1
+2
+3
+4
+5
+6</pre></div></td><td class="code"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">layer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+    <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+    <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+    <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+<span class="p">);</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">layer</span><span class="p">);</span>
+</pre></div>
+</td></tr></table></div>
+</blockquote>
+<p>This tells OpenLayers that you&#8217;d like to create a new WMS layer referenced by
+the <tt class="docutils literal"><span class="pre">layer</span></tt> variable, and that you&#8217;d like to add that layer to the map. In
+this case, we&#8217;re adding the <a class="reference external" href="http://earthobservatory.nasa.gov/Features/BlueMarble/">Blue Marble data set</a> provided by NASA.</p>
+<p>In <strong>line 2</strong> we provide &#8220;Global Imagery&#8221; as the name of the layer. This can be
+anything, and is only used to reference the layer on screen.</p>
+<p>In <strong>line 3</strong> we provide the location of the WMS server tasked with providing
+the images. Here, we use a GeoWebCache instance located at
+<tt class="docutils literal"><span class="pre">maps.opengeo.org</span></tt>.</p>
+<p>In <strong>line 4</strong> we provide extra parameters for the WMS server. Since many servers
+host different data sets, we need to specify which set we&#8217;d like. We do this by
+creating a new object and setting the <tt class="docutils literal"><span class="pre">layers</span></tt> property to <tt class="docutils literal"><span class="pre">&quot;bluemarble&quot;</span></tt>,
+the identifier for the Blue Marble data set.</p>
+<p>Note that <tt class="docutils literal"><span class="pre">layers</span></tt> isn&#8217;t the only WMS parameter we can provide. You can find
+out more in the <a class="reference external" href="http://dev.openlayers.org/apidocs">OpenLayers API Documentation</a>, by selecting &#8216;Layer&#8217; and then
+&#8216;WMS&#8217; in the navigation.</p>
+<p>And that&#8217;s it! Now let&#8217;s move on to the vector layer.</p>
+</div>
+<div class="section" id="the-vector-layer">
+<h3>The Vector Layer<a class="headerlink" href="#the-vector-layer" title="Permalink to this headline">Â¶</a></h3>
+<p>The WMS Layer, and many of the layer types provided by OpenLayers, use raster
+files (images like JPG, GIF, and PNG) to display maps. However, OpenLayers can
+also render map features directly in the browser, simply by adding an
+<tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> to the map. This is useful when displaying data from
+an OGC <cite>Web Feature Service &lt;http://www.opengeospatial.org/standards/wfs&gt;</cite>, a
+KML document, or even sketched in by the user. Here&#8217;s an example that generates
+some random data and displays it in a vector layer:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">vectorLayer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">Vector</span><span class="p">();</span>
+<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="mi">10</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
+    <span class="kd">var</span> <span class="nx">x</span> <span class="o">=</span> <span class="o">-</span><span class="mi">180</span> <span class="o">+</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">()</span> <span class="o">*</span> <span class="mi">360</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">y</span> <span class="o">=</span> <span class="o">-</span><span class="mi">90</span> <span class="o">+</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">()</span> <span class="o">*</span> <span class="mi">180</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">numSides</span> <span class="o">=</span> <span class="mi">3</span> <span class="o">+</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">round</span><span class="p">(</span><span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">()</span> <span class="o">*</span> <span class="mi">6</span><span class="p">);</span>
+    <span class="nx">vectorLayer</span><span class="p">.</span><span class="nx">addFeature</span><span class="p">(</span>
+        <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Feature</span><span class="p">.</span><span class="nx">Vector</span><span class="p">(</span>
+            <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Geometry</span><span class="p">.</span><span class="nx">Polygon</span><span class="p">.</span><span class="nx">createRegularPolygon</span><span class="p">(</span>
+                <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Geometry</span><span class="p">.</span><span class="nx">Point</span><span class="p">(</span><span class="nx">x</span><span class="p">,</span> <span class="nx">y</span><span class="p">),</span>
+                <span class="nx">numSides</span><span class="p">)));</span>
+<span class="p">}</span>
+
+<span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">();</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">vectorLayer</span><span class="p">);</span>
+</pre></div>
+</div>
+<p>While OpenLayers provides customized vector layers for loading data from
+existing sources, the GeoExt team recommends that you use the generic vector
+layer and populate it using <a title="GeoExt.data.FeatureStore" class="reference external" href="../lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a>. For more
+information on doing this, see <a class="reference external" href="../tutorials/remote-features-tutorial.html"><em>Vector Data Tutorial</em></a>.</p>
+</div>
+<div class="section" id="other-layers">
+<h3>Other Layers<a class="headerlink" href="#other-layers" title="Permalink to this headline">Â¶</a></h3>
+<p>WMS and Vector are not the only layer types in OpenLayers. There are plenty more
+available, including Google Maps, Virtual Earth, and many more. Browse the
+<a class="reference external" href="http://dev.openlayers.org/apidocs">OpenLayers API documentation</a> for more
+information.</p>
+</div>
+</div>
+<div class="section" id="controls">
+<h2>Controls<a class="headerlink" href="#controls" title="Permalink to this headline">Â¶</a></h2>
+<p>Although OpenLayers is great at managing layers, it also provides a way to
+interact with those layers, primarily through the use of controls.</p>
+<p>Controls are primary user interface elements and/or API hooks that control and
+manage interaction with an OpenLayers map. For instance, panning and navigating
+a map is handled by the <tt class="docutils literal"><span class="pre">OpenLayers.Control.Navigation</span></tt> control. If you want a
+zoom bar in addition to zoom buttons, you&#8217;d add a <tt class="docutils literal"><span class="pre">PanZoomBar</span></tt> control. If you
+then want to see where you&#8217;ve navigated, you&#8217;d use the <tt class="docutils literal"><span class="pre">NavigationHistory</span></tt>
+control.</p>
+<p>Each control provides different and unique functionality. For this primer, we&#8217;ll
+focus only on the <tt class="docutils literal"><span class="pre">NavigationHistory</span></tt> control.</p>
+<div class="section" id="navigationhistory-control">
+<h3>NavigationHistory Control<a class="headerlink" href="#navigationhistory-control" title="Permalink to this headline">Â¶</a></h3>
+<p>Take a look at the OpenLayers <a class="reference external" href="http://openlayers.org/dev/examples/navigation-history.html">NavigationHistory control example</a>. If you view the
+source, you&#8217;ll come across code like this:</p>
+<blockquote>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">(</span><span class="s1">&#39;map&#39;</span><span class="p">);</span>
+<span class="kd">var</span> <span class="nx">nav</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">NavigationHistory</span><span class="p">();</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addControl</span><span class="p">(</span><span class="nx">nav</span><span class="p">);</span>
+</pre></div>
+</div>
+</blockquote>
+<p>The above code is fairly straightforward. First create a map, then a
+<tt class="docutils literal"><span class="pre">NavigationHistory</span></tt> control, and then finally add that control to the map. If
+you were to then look at your map in a web browser, you would only see the
+layers that you had added &#8211; no special user interface elements for exploring
+the navigation history.</p>
+<p>This is because without more intervention, the NavigationHistory control only
+provides an API allowing you to scroll through the history using a programmable
+interface.</p>
+<p>But the <tt class="docutils literal"><span class="pre">NavigationHistory</span></tt> control also provides a user interface. Let&#8217;s
+continue on through the example:</p>
+<blockquote>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">panel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Panel</span><span class="p">({</span>
+    <span class="nx">div</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s2">&quot;panel&quot;</span><span class="p">)</span>
+<span class="p">});</span>
+<span class="nx">panel</span><span class="p">.</span><span class="nx">addControls</span><span class="p">([</span><span class="nx">nav</span><span class="p">.</span><span class="nx">next</span><span class="p">,</span> <span class="nx">nav</span><span class="p">.</span><span class="nx">previous</span><span class="p">]);</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addControl</span><span class="p">(</span><span class="nx">panel</span><span class="p">);</span>
+</pre></div>
+</div>
+</blockquote>
+<p>To expose this interface, we first create a <tt class="docutils literal"><span class="pre">Panel</span></tt> control, and then add the
+<tt class="docutils literal"><span class="pre">next</span></tt> and <tt class="docutils literal"><span class="pre">previous</span></tt> buttons to the panel giving the user something to
+click on. We finally add the panel to the map.</p>
+<p>Now try the example again in your browser. <em>Beautiful ain&#8217;t it?</em></p>
+</div>
+<div class="section" id="initialization-w-controls">
+<h3>Initialization w/ Controls<a class="headerlink" href="#initialization-w-controls" title="Permalink to this headline">Â¶</a></h3>
+<p>In the above examples, we only added controls to the map using the
+<tt class="docutils literal"><span class="pre">map.addControl()</span></tt> method. Often, controls are added when the map is
+initialized bypassing the <tt class="docutils literal"><span class="pre">map.addControl()</span></tt> method. This is done simply by
+using the <tt class="docutils literal"><span class="pre">controls</span></tt> key and passing an array of controls, as seen below.</p>
+<blockquote>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">({</span>
+    <span class="nx">controls</span><span class="o">:</span> <span class="p">[</span>
+        <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Navigation</span><span class="p">(),</span>
+        <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Measure</span><span class="p">()</span>
+    <span class="p">]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</blockquote>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">If you use the <tt class="docutils literal"><span class="pre">controls</span></tt> key, <strong>you will not be given the default
+controls</strong> when initializing the map. You will have to add those controls
+yourself instead. <a class="reference external" href="http://docs.openlayers.org/library/controls.html">Find out more.</a></p>
+</div>
+</div>
+<div class="section" id="more-controls">
+<h3>More Controls<a class="headerlink" href="#more-controls" title="Permalink to this headline">Â¶</a></h3>
+<p>You can find more controls by
+<a class="reference external" href="http://trac.openlayers.org/browser/trunk/openlayers/lib/OpenLayers/Control">browsing the OpenLayers source code</a>
+or by reading <a class="reference external" href="http://docs.openlayers.org/library/controls.html">OpenLayers&#8217; Control documentation</a>.</p>
+</div>
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events are the main mechanism for notifying multiple objects that something has
+happened. For instance, the <tt class="docutils literal"><span class="pre">NavigationHistory</span></tt> control listens to the map&#8217;s
+<tt class="docutils literal"><span class="pre">zoomend</span></tt> event to save the user&#8217;s zoom history for a later date; similarly,
+other objects may listen to the same event without interfering or knowing about
+the <tt class="docutils literal"><span class="pre">NavigationHistory</span></tt> control. This makes events very powerful, allowing
+objects to perform their desired function while decreasing coupling within
+OpenLayers and Ext applications.</p>
+<p>Both GeoExt and OpenLayers make extensive use of events. However, the OpenLayers
+events are slightly different from those in GeoExt, though they provide the same
+functionality. Let&#8217;s explore those differences.</p>
+<div class="section" id="geoext-events">
+<h3>GeoExt Events<a class="headerlink" href="#geoext-events" title="Permalink to this headline">Â¶</a></h3>
+<p>GeoExt uses the event library that comes standard with Ext. GeoExt events are
+synonymous with Ext events.</p>
+<p>Ext events can be used in any Ext or GeoExt components that extend the
+<tt class="docutils literal"><span class="pre">Ext.util.Observable</span></tt> class. <a class="reference external" href="http://www.slideshare.net/sdhjl2000/ext-j-s-observable">More here.</a></p>
+<p>To throw an event in any component that extends <tt class="docutils literal"><span class="pre">Ext.util.Observable</span></tt>, you
+must first tell the component that the event may be thrown. For instance, in a
+custom <tt class="docutils literal"><span class="pre">Ext.Panel</span></tt> class, this is done using the <tt class="docutils literal"><span class="pre">addEvents()</span></tt> method below.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">MyPanel</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">Ext</span><span class="p">.</span><span class="nx">Panel</span><span class="p">,</span> <span class="p">{</span>
+    <span class="nx">initComponent</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="c1">// ...</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">addEvents</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span> <span class="cm">/*, &quot;event2&quot;, ... etc.*/</span> <span class="p">);</span>
+
+        <span class="nx">MyPanel</span><span class="p">.</span><span class="nx">superclass</span><span class="p">.</span><span class="nx">initComponent</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>Finally triggering the event is easy:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">MyPanel</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">Ext</span><span class="p">.</span><span class="nx">Panel</span><span class="p">,</span> <span class="p">{</span>
+
+    <span class="c1">// ...</span>
+
+    <span class="nx">myFunction</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">arg1</span> <span class="o">=</span> <span class="s2">&quot;somevalue&quot;</span><span class="p">;</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">fireEvent</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="nx">arg1</span> <span class="cm">/*, arg2, ... etc. */</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>Great! Now in order for the event to be useful, we have to listen to it. Below
+is an example of adding two listeners to an instance of <tt class="docutils literal"><span class="pre">MyPanel</span></tt> using the
+<tt class="docutils literal"><span class="pre">on()</span></tt> function, and then finally triggering the event by calling
+<tt class="docutils literal"><span class="pre">myFunction()</span></tt>.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">panel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">MyPanel</span><span class="p">(</span><span class="cm">/* ... */</span><span class="p">);</span>
+
+<span class="c1">// First listener.</span>
+<span class="nx">panel</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">arg1</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;First listener responded. Got &quot;</span> <span class="o">+</span> <span class="nx">arg1</span> <span class="o">+</span> <span class="s2">&quot;!&quot;</span><span class="p">);</span>
+<span class="p">});</span>
+
+<span class="c1">// Second listener.</span>
+<span class="nx">panel</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">arg1</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;Second listener responded. Got &quot;</span> <span class="o">+</span> <span class="nx">arg1</span> <span class="o">+</span> <span class="s2">&quot;!&quot;</span><span class="p">);</span>
+<span class="p">});</span>
+
+<span class="nx">panel</span><span class="p">.</span><span class="nx">myFunction</span><span class="p">();</span>
+</pre></div>
+</div>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">The <tt class="docutils literal"><span class="pre">on()</span></tt> function takes an optional third parameter that specifies
+the scope of the listening function. If given, the <tt class="docutils literal"><span class="pre">this</span></tt> identifier
+within the listening function will refer to the object passed.</p>
+</div>
+<p>And that&#8217;s it! Now let&#8217;s see how to do the same thing in OpenLayers.</p>
+</div>
+<div class="section" id="openlayers-events">
+<h3>OpenLayers Events<a class="headerlink" href="#openlayers-events" title="Permalink to this headline">Â¶</a></h3>
+<p>OpenLayers provides similar functionality as the <tt class="docutils literal"><span class="pre">Ext.util.Observable</span></tt> class,
+but it does so using the <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> class. Unlike
+<tt class="docutils literal"><span class="pre">Ext.util.Observable</span></tt>, OpenLayers classes do not extend <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt>.</p>
+<p>Instead, it is customary for OpenLayers classes to create an attribute called
+<tt class="docutils literal"><span class="pre">events</span></tt> that is an instance of <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt>, as per the code below.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">MyControl</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Class</span><span class="p">(</span><span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">,</span> <span class="p">{</span>
+
+    <span class="nx">events</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
+
+    <span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">events</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Events</span><span class="p">(</span>
+            <span class="k">this</span><span class="p">,</span>
+            <span class="kc">null</span><span class="p">,</span>
+            <span class="p">[</span><span class="s2">&quot;event1&quot;</span> <span class="cm">/*, &quot;event2&quot;, ... etc. */</span><span class="p">]</span>
+            <span class="kc">false</span>
+        <span class="p">);</span>
+
+        <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">initialize</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>The first parameter to the <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> constructor is the object that
+will &#8216;own&#8217; these events &#8211; in other words, the caller that triggers the event.
+In situations like the example above, it is usually <tt class="docutils literal"><span class="pre">this</span></tt>.</p>
+<p>The second parameter specifies a <tt class="docutils literal"><span class="pre">div</span></tt> that will listen to events thrown by
+the browser. Here, this functionality is ignored; see the note below.</p>
+<p>The third parameter is an array specifying the events that this
+<tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> object can throw. This is analogous to
+<tt class="docutils literal"><span class="pre">Ext.util.Observable</span></tt>&#8216;s <tt class="docutils literal"><span class="pre">addEvents()</span></tt> method, and can accept any number of
+events.</p>
+<p>The fourth parameter is the <tt class="docutils literal"><span class="pre">fallthrough</span></tt>, a boolean that is related to the
+second parameter above. For our purposes, we&#8217;ll leave it as <tt class="docutils literal"><span class="pre">false</span></tt>.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">The <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> class handles both browser events like when
+the window resizes, as well as handling developer-created events like
+<tt class="docutils literal"><span class="pre">event1</span></tt> above. This makes initializing an <tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> object
+fairly mucky, though using it like we did above is nearly the same. See more
+below.</p>
+</div>
+<p>Triggering an event is just as easy as Ext&#8217;s <tt class="docutils literal"><span class="pre">fireEvent()</span></tt>, except here we use
+<tt class="docutils literal"><span class="pre">triggerEvent()</span></tt>:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">MyControl</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Class</span><span class="p">(</span><span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">,</span> <span class="p">{</span>
+
+    <span class="c1">// ...</span>
+
+    <span class="nx">myFunction</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">evt</span> <span class="o">=</span> <span class="p">{</span>
+            <span class="nx">arg1</span><span class="o">:</span> <span class="s2">&quot;somevalue&quot;</span> <span class="cm">/*, arg2: ..., ... etc.*/</span>
+        <span class="p">}</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">events</span><span class="p">.</span><span class="nx">triggerEvent</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="nx">evt</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last"><tt class="docutils literal"><span class="pre">OpenLayers.Events</span></tt> passes data to listeners using a single object
+with properties &#8211; otherwise called &#8216;the event object&#8217; &#8211; instead of passing
+function arguments like Ext. All listener functions, then, should only
+expect one named argument. See example below.</p>
+</div>
+<p>Finally, let&#8217;s add two listeners and call <tt class="docutils literal"><span class="pre">myFunction()</span></tt>:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">control</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">MyControl</span><span class="p">(</span><span class="cm">/* ... */</span><span class="p">);</span>
+
+<span class="c1">// First listener.</span>
+<span class="nx">control</span><span class="p">.</span><span class="nx">events</span><span class="p">.</span><span class="nx">register</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">evt</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;First listener responded. Got &quot;</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">arg1</span> <span class="o">+</span> <span class="s2">&quot;!&quot;</span><span class="p">);</span>
+<span class="p">});</span>
+
+<span class="c1">// Second listener.</span>
+<span class="nx">control</span><span class="p">.</span><span class="nx">events</span><span class="p">.</span><span class="nx">register</span><span class="p">(</span><span class="s2">&quot;event1&quot;</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">evt</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;Second listener responded. Got &quot;</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">arg1</span> <span class="o">+</span> <span class="s2">&quot;!&quot;</span><span class="p">);</span>
+<span class="p">});</span>
+
+<span class="nx">control</span><span class="p">.</span><span class="nx">myFunction</span><span class="p">();</span>
+</pre></div>
+</div>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">Like Ext&#8217;s <tt class="docutils literal"><span class="pre">on()</span></tt> function, OpenLayer&#8217;s <tt class="docutils literal"><span class="pre">register()</span></tt> function also
+takes an optional <tt class="docutils literal"><span class="pre">scope</span></tt> value in order to specify the scope of the
+listening function, but it expects this value as the second parameter passed
+to the function. We don&#8217;t have a scope for our listeners in this example,
+hence the <tt class="docutils literal"><span class="pre">null</span></tt> parameters.</p>
+</div>
+<p>And that&#8217;s it! Events in GeoExt should now be old hat. Fire away!</p>
+</div>
+<div class="section" id="more-information">
+<h3>More Information<a class="headerlink" href="#more-information" title="Permalink to this headline">Â¶</a></h3>
+<p>More information about both event types can be found at the links below:</p>
+<ul class="simple">
+<li><a class="reference external" href="http://dev.openlayers.org/docs/files/OpenLayers/Events-js.html">OpenLayers Events Class Documentation</a></li>
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable Class Documentation</a></li>
+<li><a class="reference external" href="http://www.slideshare.net/sdhjl2000/ext-j-s-observable">Ext.util.Observable SlideShare</a></li>
+</ul>
+</div>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../examples.html" title="Examples"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="ext-primer.html" title="Primer: Ext"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Core Concepts</a> &raquo;</li>
+        <li><a href="#">Primer: OpenLayers</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/primers/index.html	(revision 76)
@@ -0,0 +1,149 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Core Concepts &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="next" title="Primer: Ext" href="ext-primer.html" />
+    <link rel="prev" title="Vector Data Tutorial" href="../tutorials/remote-features-tutorial.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Core Concepts</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Core Concepts</a><ul>
+<li><a class="reference external" href="#ext-primer">Ext Primer</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#openlayers-primer">OpenLayers Primer</a><ul>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../tutorials/remote-features-tutorial.html"
+                                  title="previous chapter">Vector Data Tutorial</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="ext-primer.html"
+                                  title="next chapter">Primer: Ext</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="core-concepts">
+<h1>Core Concepts<a class="headerlink" href="#core-concepts" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="ext-primer">
+<h2>Ext Primer<a class="headerlink" href="#ext-primer" title="Permalink to this headline">Â¶</a></h2>
+<p>Pointers on getting started with ExtJS with an emphasis on important concepts in GeoExt derived from ExtJS.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="ext-primer.html">Primer: Ext</a><ul>
+<li class="toctree-l2"><a class="reference external" href="ext-primer.html#getting-started">Getting Started</a></li>
+<li class="toctree-l2"><a class="reference external" href="ext-primer.html#basic-layout">Basic Layout</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="openlayers-primer">
+<h2>OpenLayers Primer<a class="headerlink" href="#openlayers-primer" title="Permalink to this headline">Â¶</a></h2>
+<p>Essential OpenLayers concepts for working with GeoExt.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="openlayers-primer.html">Primer: OpenLayers</a><ul>
+<li class="toctree-l2"><a class="reference external" href="openlayers-primer.html#layers">Layers</a></li>
+<li class="toctree-l2"><a class="reference external" href="openlayers-primer.html#controls">Controls</a></li>
+<li class="toctree-l2"><a class="reference external" href="openlayers-primer.html#events">Events</a></li>
+</ul>
+</li>
+</ul>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="ext-primer.html" title="Primer: Ext"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../tutorials/remote-features-tutorial.html" title="Vector Data Tutorial"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Core Concepts</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/index.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/index.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/index.txt	(revision 76)
@@ -0,0 +1,26 @@
+=============
+Core Concepts
+=============
+
+Ext Primer
+==========
+
+Pointers on getting started with ExtJS with an emphasis on important concepts in GeoExt derived from ExtJS. 
+
+.. toctree::
+   :maxdepth: 2
+
+   ext-primer
+
+
+OpenLayers Primer
+=================
+
+Essential OpenLayers concepts for working with GeoExt.
+
+.. toctree::
+   :maxdepth: 2
+   
+   openlayers-primer
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/ext-primer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/ext-primer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/ext-primer.txt	(revision 76)
@@ -0,0 +1,134 @@
+.. _ext-primer: 
+
+=============
+ Primer: Ext
+=============
+
+GeoExt extends `Ext JS <http://www.sencha.com/products/js/>`_, a rich library of web UI
+widgets and helper classes.  Using GeoExt requires a working knowledge
+of Ext's idioms.  This tutorial provides a quick overview of core Ext concepts.
+
+.. _ext-getting-started:
+
+Getting Started
+===============
+
+To start using Ext, you will first have to `download
+<http://www.sencha.com/products/js/download.php>`_ it.
+For more complete instructions about how configure a web page to use
+Ext, you can check the :doc:`../tutorials/quickstart` tutorial.
+
+When you download Ext, you also get their excellent
+`Examples <http://dev.sencha.com/deploy/dev/examples/>`_ and
+`API Documentation <http://dev.sencha.com/deploy/dev/docs/>`_, which you can also
+look at on-line for education and reference.
+
+In order to get Ext running on a page you will need to have something
+like the following in the ``<head>`` of an HTML page in a directory
+that is published by your web server.
+
+.. code-block:: html
+
+    <script src="ext-3.2.1/adapter/ext/ext-base.js" type="text/javascript"></script>
+    <script src="ext-3.2.1/ext-all.js"  type="text/javascript"></script>
+    <link rel="stylesheet" type="text/css" href="ext-3.2.1/resources/css/ext-all.css"></link>
+
+This will load the code and styles for Ext.  Change the paths
+according to where you have put the Ext files.
+
+When writing Ext code, most of what you will be doing is instantiating
+classes with constructors that takes a single object--its
+configuration object--as an argument.  This snippet demonstrates this
+coding pattern:
+
+.. code-block:: javascript
+
+    Ext.onReady(function(){
+        var myPanel = new Ext.Panel({
+            title: 'Hello World!',
+            html: '<i>Hello World!</i> Please enjoy this primer on Ext!',
+            collapsible: true,
+            width:300,
+            renderTo: 'panelDiv'
+        });        
+    });
+
+There are a few things to note about this example:
+
+* This code uses Ext's ``onReady`` method to trigger the method when the
+  document's body is ready. (This is cleaner than using body's ``onready``
+  event, and with ``Ext.onReady`` several functions can be queued for execution
+  before the page loads.)
+
+* When the page is ready, the ``Ext.Panel`` constructor is called with a
+  single configuration object as argument.  The Panel's structure should
+  be familiar from your desktop experience.  It has a ``title`` which
+  runs across the top, and some content which in this case is ``html``
+  provided in the configuration.
+
+* Many configuration options (best explored in the Ext examples and API
+  documention) are available.  Here, they are represented by the
+  ``collapsible`` property, which allows the user to collapse the panel
+  much like you can minimize your browser's window, and the ``width`` of
+  the panel specified in pixels.
+
+* Lastly, this code assumes that somewhere in the DOM of the page is a
+  ``div`` with the id ``panelDiv``.  When the Panel is constructed, it
+  will be automatically rendered in this div because of the ``renderTo``
+  option. (This option can be left out and panels rendered manually, if
+  desired.)
+
+.. _ext-basic-layout:
+
+Basic Layout
+============
+
+Ext makes it easy to separate out your UI into logical blocks.
+Most often you will be using one or more nested *Containers*.  The
+``Ext.Panel`` built above is the most common kind of container.  You
+can nest panels using the ``items`` property.  For example:
+
+.. code-block:: javascript
+
+    Ext.onReady(function(){
+        var myPanel = new Ext.Panel({
+            title: 'Top level',
+            layout: 'border',
+            items: [{
+                xtype:'panel',
+                title:'Sub1',
+                html:'Contents of sub panel 1',
+                region: 'east'
+            },{
+                xtype:'panel',
+                title: 'Sub2',
+                html:'Contents of sub panel 2',
+                region: 'center'
+            }],
+            width:300,
+            height:200,
+            renderTo:'panelDiv'
+        });        
+    });
+
+This code introduces some new concepts:
+
+* Each of the objects in the ``items`` array is a configuration
+  object for a panel like the one in the earlier example. 
+
+* The ``Ext.Panel`` constructor is never called, however.  Instead,
+  the ``xtype`` option is used.  By setting the xtype, you tell Ext
+  what class the configuration is for, and Ext instantiates that class
+  when appropriate.
+
+* The ``layout`` property on the outer container determines the
+  position of the items within it.  Here, we have set the layout to be
+  a *border* layout, which requires that items be given a ``region``
+  property like "center", "north", "south", "east", or "west".
+
+Ext provides a variety of other layouts, including a Tab layout and a
+Wizard layout.  The best way to explore these layouts is using the `Ext
+Layout Browser
+<http://dev.sencha.com/deploy/dev/examples/layout-browser/layout-browser.html>`_
+, which demonstrates each layout and provides sample code.
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/openlayers-primer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/openlayers-primer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/primers/openlayers-primer.txt	(revision 76)
@@ -0,0 +1,385 @@
+.. highlight:: javascript
+
+====================
+ Primer: OpenLayers
+====================
+
+The OpenLayers mapping library is the key component of GeoExt, performing the
+core map-related functions of every GeoExt-based application. To get up to speed
+with GeoExt, let's discover some OpenLayers basics.
+
+Layers
+======
+
+As its name suggests, OpenLayers manages a list of layers that together form a
+web-based mapping client. Each layer represents a different set of data. For
+instance, one layer might be responsible for displaying the boundary of a
+country. Another layer responsible for that country's roads.
+
+OpenLayers contains many types of layers (you can see them all at the
+`OpenLayers website
+<http://trac.openlayers.org/browser/trunk/openlayers/lib/OpenLayers/Layer>`_).
+For this primer, we'll focus on two different layer types: ``WMS`` and
+``Vector``.
+
+The WMS Layer
+-------------
+
+This is the canonical layer type found in almost all GeoExt applications, where
+one or more images are used to display map-related information to the user. This
+type is named 'WMS' because it implements the `Web Map Service
+<http://www.opengeospatial.org/standards/wms>`_ standard set by the `Open
+Geospatial Consortium. <http://www.opengeospatial.org/>`_
+
+If you followed the :doc:`/tutorials/quickstart` guide, you will have already
+encountered a ``MapPanel`` and created your very own WMS layer. Let's dissect
+what you did:
+
+    .. code-block:: javascript
+        :linenos:
+    
+        var layer = new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        );
+        map.addLayer(layer);
+    
+This tells OpenLayers that you'd like to create a new WMS layer referenced by
+the ``layer`` variable, and that you'd like to add that layer to the map. In
+this case, we're adding the `Blue Marble data set
+<http://earthobservatory.nasa.gov/Features/BlueMarble/>`_ provided by NASA.
+
+In **line 2** we provide "Global Imagery" as the name of the layer. This can be
+anything, and is only used to reference the layer on screen.
+
+In **line 3** we provide the location of the WMS server tasked with providing
+the images. Here, we use a GeoWebCache instance located at
+``maps.opengeo.org``\ .
+
+In **line 4** we provide extra parameters for the WMS server. Since many servers
+host different data sets, we need to specify which set we'd like. We do this by
+creating a new object and setting the ``layers`` property to ``"bluemarble"``\ ,
+the identifier for the Blue Marble data set.
+
+Note that ``layers`` isn't the only WMS parameter we can provide. You can find
+out more in the `OpenLayers API Documentation`_, by selecting 'Layer' and then
+'WMS' in the navigation.
+
+And that's it! Now let's move on to the vector layer.
+
+The Vector Layer
+----------------
+
+The WMS Layer, and many of the layer types provided by OpenLayers, use raster
+files (images like JPG, GIF, and PNG) to display maps. However, OpenLayers can
+also render map features directly in the browser, simply by adding an
+``OpenLayers.Layer.Vector`` to the map. This is useful when displaying data from
+an OGC `Web Feature Service <http://www.opengeospatial.org/standards/wfs>`, a
+KML document, or even sketched in by the user. Here's an example that generates
+some random data and displays it in a vector layer::
+
+    var vectorLayer = new OpenLayers.Layer.Vector();
+    for (var i = 0; i < 10; i++){
+        var x = -180 + Math.random() * 360;
+        var y = -90 + Math.random() * 180;
+        var numSides = 3 + Math.round(Math.random() * 6);
+        vectorLayer.addFeature(
+            new OpenLayers.Feature.Vector(
+                OpenLayers.Geometry.Polygon.createRegularPolygon(
+                    new OpenLayers.Geometry.Point(x, y),
+                    numSides)));
+    }
+
+    var map = new OpenLayers.Map();
+    map.addLayer(vectorLayer);
+
+While OpenLayers provides customized vector layers for loading data from
+existing sources, the GeoExt team recommends that you use the generic vector
+layer and populate it using :class:`GeoExt.data.FeatureStore`\ . For more
+information on doing this, see :doc:`/tutorials/remote-features-tutorial`\ .
+
+Other Layers
+------------
+
+WMS and Vector are not the only layer types in OpenLayers. There are plenty more
+available, including Google Maps, Virtual Earth, and many more. Browse the
+`OpenLayers API documentation <http://dev.openlayers.org/apidocs>`_ for more
+information. 
+
+Controls
+========
+
+Although OpenLayers is great at managing layers, it also provides a way to
+interact with those layers, primarily through the use of controls.
+
+Controls are primary user interface elements and/or API hooks that control and
+manage interaction with an OpenLayers map. For instance, panning and navigating
+a map is handled by the ``OpenLayers.Control.Navigation`` control. If you want a
+zoom bar in addition to zoom buttons, you'd add a ``PanZoomBar`` control. If you
+then want to see where you've navigated, you'd use the ``NavigationHistory``
+control.
+
+Each control provides different and unique functionality. For this primer, we'll
+focus only on the ``NavigationHistory`` control.
+
+
+NavigationHistory Control
+-------------------------
+
+Take a look at the OpenLayers `NavigationHistory control example
+<http://openlayers.org/dev/examples/navigation-history.html>`_. If you view the
+source, you'll come across code like this:
+
+    .. code-block:: javascript
+       
+        var map = new OpenLayers.Map('map');
+        var nav = new OpenLayers.Control.NavigationHistory();
+        map.addControl(nav);
+       
+The above code is fairly straightforward. First create a map, then a
+``NavigationHistory`` control, and then finally add that control to the map. If
+you were to then look at your map in a web browser, you would only see the
+layers that you had added -- no special user interface elements for exploring
+the navigation history.
+
+This is because without more intervention, the NavigationHistory control only
+provides an API allowing you to scroll through the history using a programmable
+interface.
+
+But the ``NavigationHistory`` control also provides a user interface. Let's
+continue on through the example:
+
+    .. code-block:: javascript
+       
+        panel = new OpenLayers.Control.Panel({
+            div: document.getElementById("panel")
+        });
+        panel.addControls([nav.next, nav.previous]);
+        map.addControl(panel);
+       
+To expose this interface, we first create a ``Panel`` control, and then add the
+``next`` and ``previous`` buttons to the panel giving the user something to
+click on. We finally add the panel to the map.
+
+Now try the example again in your browser. *Beautiful ain't it?*
+
+Initialization w/ Controls
+--------------------------
+
+In the above examples, we only added controls to the map using the
+``map.addControl()`` method. Often, controls are added when the map is
+initialized bypassing the ``map.addControl()`` method. This is done simply by
+using the ``controls`` key and passing an array of controls, as seen below.
+
+    .. code-block:: javascript
+       
+        var map = new OpenLayers.Map({
+            controls: [
+                new OpenLayers.Control.Navigation(),
+                new OpenLayers.Control.Measure()
+            ]
+        });
+       
+.. note:: If you use the ``controls`` key, **you will not be given the default
+    controls** when initializing the map. You will have to add those controls
+    yourself instead. `Find out more.
+    <http://docs.openlayers.org/library/controls.html>`_
+
+More Controls
+--------------
+
+You can find more controls by 
+`browsing the OpenLayers source code
+<http://trac.openlayers.org/browser/trunk/openlayers/lib/OpenLayers/Control>`_
+or by reading `OpenLayers' Control documentation
+<http://docs.openlayers.org/library/controls.html>`_.
+
+
+
+Events
+======
+
+Events are the main mechanism for notifying multiple objects that something has
+happened. For instance, the ``NavigationHistory`` control listens to the map's
+``zoomend`` event to save the user's zoom history for a later date; similarly,
+other objects may listen to the same event without interfering or knowing about
+the ``NavigationHistory`` control. This makes events very powerful, allowing
+objects to perform their desired function while decreasing coupling within
+OpenLayers and Ext applications.
+
+Both GeoExt and OpenLayers make extensive use of events. However, the OpenLayers
+events are slightly different from those in GeoExt, though they provide the same
+functionality. Let's explore those differences.
+
+GeoExt Events
+-------------
+
+GeoExt uses the event library that comes standard with Ext. GeoExt events are
+synonymous with Ext events.
+
+Ext events can be used in any Ext or GeoExt components that extend the
+``Ext.util.Observable`` class. `More here.
+<http://www.slideshare.net/sdhjl2000/ext-j-s-observable>`_
+
+To throw an event in any component that extends ``Ext.util.Observable``, you
+must first tell the component that the event may be thrown. For instance, in a
+custom ``Ext.Panel`` class, this is done using the ``addEvents()`` method below.
+
+.. code-block:: javascript
+   
+    var MyPanel = Ext.extend(Ext.Panel, {
+        initComponent: function() {
+            // ...
+            this.addEvents("event1" /*, "event2", ... etc.*/ ); 
+            
+            MyPanel.superclass.initComponent.call(this);
+        }
+    });
+
+Finally triggering the event is easy: 
+
+.. code-block:: javascript
+   
+    var MyPanel = Ext.extend(Ext.Panel, {
+         
+        // ...
+         
+        myFunction: function() {
+            var arg1 = "somevalue";
+            this.fireEvent("event1", arg1 /*, arg2, ... etc. */);
+        }
+    });
+
+Great! Now in order for the event to be useful, we have to listen to it. Below
+is an example of adding two listeners to an instance of ``MyPanel`` using the
+``on()`` function, and then finally triggering the event by calling
+``myFunction()``. 
+
+.. code-block:: javascript
+   
+    var panel = new MyPanel(/* ... */);
+    
+    // First listener.
+    panel.on("event1", function(arg1) {
+        alert("First listener responded. Got " + arg1 + "!");
+    });
+    
+    // Second listener.
+    panel.on("event1", function(arg1) {
+        alert("Second listener responded. Got " + arg1 + "!");
+    });
+
+    panel.myFunction();
+       
+.. note:: The ``on()`` function takes an optional third parameter that specifies
+    the scope of the listening function. If given, the ``this`` identifier
+    within the listening function will refer to the object passed.
+   
+And that's it! Now let's see how to do the same thing in OpenLayers.
+
+OpenLayers Events
+-----------------
+
+OpenLayers provides similar functionality as the ``Ext.util.Observable`` class,
+but it does so using the ``OpenLayers.Events`` class. Unlike
+``Ext.util.Observable``, OpenLayers classes do not extend ``OpenLayers.Events``.
+
+Instead, it is customary for OpenLayers classes to create an attribute called
+``events`` that is an instance of ``OpenLayers.Events``, as per the code below.
+
+.. code-block:: javascript
+   
+    var MyControl = new OpenLayers.Class(OpenLayers.Control, {
+
+        events: null,
+        
+        initialize: function() {
+            this.events = new OpenLayers.Events(
+                this,
+                null,
+                ["event1" /*, "event2", ... etc. */]
+                false
+            );
+            
+            OpenLayers.Control.prototype.initialize.call(this);
+        }
+    });
+       
+The first parameter to the ``OpenLayers.Events`` constructor is the object that
+will 'own' these events -- in other words, the caller that triggers the event.
+In situations like the example above, it is usually ``this``.
+
+The second parameter specifies a ``div`` that will listen to events thrown by
+the browser. Here, this functionality is ignored; see the note below.
+
+The third parameter is an array specifying the events that this
+``OpenLayers.Events`` object can throw. This is analogous to
+``Ext.util.Observable``'s ``addEvents()`` method, and can accept any number of
+events.
+
+The fourth parameter is the ``fallthrough``, a boolean that is related to the
+second parameter above. For our purposes, we'll leave it as ``false``.
+
+.. note:: The ``OpenLayers.Events`` class handles both browser events like when
+    the window resizes, as well as handling developer-created events like
+    ``event1`` above. This makes initializing an ``OpenLayers.Events`` object
+    fairly mucky, though using it like we did above is nearly the same. See more
+    below. 
+
+Triggering an event is just as easy as Ext's ``fireEvent()``, except here we use
+``triggerEvent()``:
+
+.. code-block:: javascript
+   
+    var MyControl = new OpenLayers.Class(OpenLayers.Control, {
+
+        // ...
+        
+        myFunction: function() {
+            var evt = {
+                arg1: "somevalue" /*, arg2: ..., ... etc.*/
+            }
+            this.events.triggerEvent("event1", evt);
+        }
+    });
+       
+.. note:: ``OpenLayers.Events`` passes data to listeners using a single object
+    with properties -- otherwise called 'the event object' -- instead of passing
+    function arguments like Ext. All listener functions, then, should only
+    expect one named argument. See example below.
+
+Finally, let's add two listeners and call ``myFunction()``:
+
+.. code-block:: javascript
+   
+    var control = new MyControl(/* ... */);
+    
+    // First listener.
+    control.events.register("event1", null, function(evt) {
+        alert("First listener responded. Got " + evt.arg1 + "!");
+    });
+   
+    // Second listener.
+    control.events.register("event1", null, function(evt) {
+        alert("Second listener responded. Got " + evt.arg1 + "!");
+    });
+
+    control.myFunction();
+       
+.. note:: Like Ext's ``on()`` function, OpenLayer's ``register()`` function also
+    takes an optional ``scope`` value in order to specify the scope of the
+    listening function, but it expects this value as the second parameter passed
+    to the function. We don't have a scope for our listeners in this example,
+    hence the ``null`` parameters.
+   
+And that's it! Events in GeoExt should now be old hat. Fire away!
+
+More Information
+----------------
+
+More information about both event types can be found at the links below:
+
+* `OpenLayers Events Class Documentation <http://dev.openlayers.org/docs/files/OpenLayers/Events-js.html>`_
+* `Ext.util.Observable Class Documentation <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+* `Ext.util.Observable SlideShare <http://www.slideshare.net/sdhjl2000/ext-j-s-observable>`_
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/developer/index.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/developer/index.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/developer/index.txt	(revision 76)
@@ -0,0 +1,41 @@
+============================
+GeoExt Community Involvement
+============================
+
+You can get involved with the GeoExt by signing up for a mailing list or finding
+us on IRC.
+
+Mailing list
+------------
+
+The GeoExt mailing lists provide a place for ongoing discussion about GeoExt
+development.  Users are invited to submit questions to the users mailing list.
+We look forward to hearing how you are using GeoExt!
+
+Find instructions on signing up for the users or developers lists on the pages
+below:
+
+* GeoExt Users List: http://www.geoext.org/cgi-bin/mailman/listinfo/users
+* GeoExt Developers List: http://www.geoext.org/cgi-bin/mailman/listinfo/dev
+
+.. warning::
+   Make sure you are subscribed to the mailing list prior to posting, posts
+   from unsubscribed people are rejected with no notification sent to the
+   mailing list administrator.
+
+IRC
+---
+
+GeoExt has a an IRC channel hosted on `Freenode <http://freenode.net/>`_. You
+can use the following information to connect.
+
+* Server: irc.freenode.net
+* Channel: `#geoext <irc://irc.freenode.net/#geoext>`_
+
+For a history of previous activity on the channel, search the `archives
+<http://atlas.openplans.org/~georj/cgi-bin/log.cgi/geoext/>`_.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/index.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/index.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/index.txt	(revision 76)
@@ -0,0 +1,60 @@
+.. Sphinx 0.6.2 will support the 'title' directive.  See
+    http://bitbucket.org/birkenfeld/sphinx/changeset/036f2d008240/
+
+
+JavaScript Toolkit for Rich Web Mapping Applications
+====================================================
+
+GeoExt brings together the geospatial know how of
+`OpenLayers <http://openlayers.org>`_ with the user interface savvy of `Ext JS
+<http://www.sencha.com/products/js/>`_ to help you build powerful desktop style GIS apps on
+the web with JavaScript.
+
+`Documentation <./docs.html>`_ | 
+:ref:`Examples <examples>` | 
+`Download <./downloads.html>`_ | 
+`Development <http://trac.geoext.org/>`_
+
+Using GeoExt
+------------
+
+See GeoExt in action.
+
+.. cssclass:: execute
+
+.. code-block:: javascript
+
+    new Ext.Window({
+        title: "GeoExt in Action",
+        height: 280, width: 450, layout: "fit",
+        items: [{
+            xtype: "gx_mappanel",
+            layers: [new OpenLayers.Layer.WMS(
+                "Global Imagery", "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )],
+            zoom: 1
+        }]
+    }).show();
+
+Learn more about using GeoExt in your application by reading the
+:doc:`documentation <docs>`.
+
+
+GeoExt is Open Source
+---------------------
+
+GeoExt is available under the BSD license and is supported by a growing
+community of individuals, businesses and organizations.
+
+
+.. toctree::
+    :hidden:
+
+    docs
+    tutorials/index
+    primers/index
+    examples
+    developer/index
+    lib/index
+    downloads
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v1.0.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v1.0.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v1.0.txt	(revision 76)
@@ -0,0 +1,21 @@
+GeoExt 1.0 Builder
+==================
+
+Customize Your Build
+--------------------
+
+.. cssclass:: builder-form-text
+
+Choose the components used by your application from the form below.
+
+Download
+--------
+
+.. cssclass:: download-button-text
+
+When you are finished, click the "download" link to build a customized version
+of the library for your application.
+
+.. cssclass:: credit
+
+Custom build tool hosted by `OpenGeo <http://opengeo.org>`__.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.6.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.6.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.6.txt	(revision 76)
@@ -0,0 +1,21 @@
+GeoExt 0.6 Builder
+==================
+
+Customize Your Build
+--------------------
+
+.. cssclass:: builder-form-text
+
+Choose the components used by your application from the form below.
+
+Download
+--------
+
+.. cssclass:: download-button-text
+
+When you are finished, click the "download" link to build a customized version
+of the library for your application.
+
+.. cssclass:: credit
+
+Custom build tool hosted by `OpenGeo <http://opengeo.org>`__.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.7.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.7.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/builder/v0.7.txt	(revision 76)
@@ -0,0 +1,21 @@
+GeoExt 0.7 Builder
+==================
+
+Customize Your Build
+--------------------
+
+.. cssclass:: builder-form-text
+
+Choose the components used by your application from the form below.
+
+Download
+--------
+
+.. cssclass:: download-button-text
+
+When you are finished, click the "download" link to build a customized version
+of the library for your application.
+
+.. cssclass:: credit
+
+Custom build tool hosted by `OpenGeo <http://opengeo.org>`__.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/docs.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/docs.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/docs.txt	(revision 76)
@@ -0,0 +1,34 @@
+===============
+ Documentation
+===============
+
+Getting Started
+---------------
+
+* **Jump in** with :doc:`tutorials/index` to get you up and running
+* **Ramp up** with :doc:`primers/index` to learn the core concepts behind GeoExt
+
+
+Examples
+--------
+
+Learn by :ref:`example <examples>`! Most of the GeoExt widgets and data components
+have simple examples that demonstrate their use. By looking through the sources
+for the examples, you can learn how to use GeoExt components in your
+application.
+
+Library Reference
+-----------------
+
+The :doc:`lib/index` covers details on developing with GeoExt.  Generated
+from the comments in the code.
+
+
+Participating in the GeoExt Community
+-------------------------------------
+
+For information about getting involved in the GeoExt community, :doc:`keep reading! <developer/index>`
+
+   
+
+ 
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides.txt	(revision 76)
@@ -0,0 +1,14 @@
+.. _overrides:
+
+Ext Overrides
+=============
+
+The GeoExt library provides some specific overrides for Ext objects and methods.
+These can be optionally included in your GeoExt build.
+
+See below for a list of available overrides.
+
+.. toctree::
+   :maxdepth: 1
+   
+   overrides/override-ext-ajax
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides/override-ext-ajax.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides/override-ext-ajax.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/overrides/override-ext-ajax.txt	(revision 76)
@@ -0,0 +1,64 @@
+.. _overrides.ext.ajax:
+
+Ext.Ajax Overrides
+==================
+
+GeoExt provides an override for the functionality in
+`Ext.Ajax <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Ajax>`_.  If you include
+the :file:`override-ext-ajax.js` file in your build, any calls to ``Ext.Ajax``
+methods will be routed through ``OpenLayers.Request`` methods.  The practical
+implication of this is that you can set the ``OpenLayers.ProxyHost`` property
+in your application and have this proxy used by Ext components that call
+``Ext.Ajax`` methods.
+
+To include :file:`override-ext-ajax.js` in your build, the GeoExt section in
+your build config should look like one of the following:
+
+.. code-block:: ini
+
+    # include everything (including override-ext-ajax.js)
+    [GeoExt.js]
+    root = ../lib
+    license = geoext-license.js
+    exclude =
+        GeoExt.js
+        GeoExt/SingleFile.js
+
+
+or
+
+.. code-block:: ini
+
+    # custom build
+    [GeoExt.js]
+    root = ../lib
+    license = geoext-license.js
+    include =
+        overrides/override-ext-ajax.js
+        # other files listed here ...
+
+
+Workaround for Existing Builds
+------------------------------
+
+If you are using a build of GeoExt that includes the Ajax overrides (e.g. the
+0.6 release or earlier), you can work around any issues you may have using this
+override in your appliction by protecting the ``Ext.lib.Ajax`` object before
+loading file:`GeoExt.js`.
+
+The example markup below will remove the effect of the override on Ajax methods.
+
+.. code-block:: html
+
+    <script src="path/to/ext.js"></script>
+    <script>
+        Ext.lib._Ajax = Ext.lib.Ajax; // protect the original
+        Ext.lib.Ajax = {};  // create dummy for override
+    </script>
+    <script src="path/to/GeoExt.js"></script>
+    <script>
+        Ext.lib.Ajax = Ext.lib._Ajax; // restore the original
+    </script>
+
+Note that issues with the Ajax override present in 0.6 will be fixed in
+subsequent releases.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/index.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/index.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/index.txt	(revision 76)
@@ -0,0 +1,53 @@
+.. _api-reference:
+
+API Reference
+=============
+
+GeoExt components and data utility classes extend map related functionality to
+equivalent classes in Ext.  The API reference here documents the properties,
+methods, and events that are extensions or modifications to the Ext parent
+classes.  Documentation for each class contains links to the Ext parent class,
+and for a full picture of the API, it is essential to have a copy of the
+`Ext API Documentation`_ at hand.
+
+GeoExt classes are typically configured with OpenLayers objects.  For detail on
+methods and properties provided by these objects, see the
+`OpenLayers API Documentation`_.
+
+.. _`Ext API Documentation`: http://dev.sencha.com/deploy/dev/docs/
+.. _`OpenLayers API Documentation`: http://dev.openlayers.org/apidocs
+
+.. module:: GeoExt
+    :synopsis: Extending mapping functionality to Ext classes.
+
+:mod:`GeoExt`
+-------------
+
+.. toctree::
+    :maxdepth: 2
+    
+    GeoExt/widgets
+
+.. toctree::
+    :maxdepth: 2
+
+    GeoExt/data
+
+.. toctree::
+    :maxdepth: 2
+    
+    GeoExt/plugins
+
+.. toctree::
+    :maxdepth: 2
+    
+    GeoExt/state
+
+Overrides
+---------
+
+.. toctree::
+    :maxdepth: 2
+
+    overrides
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins.txt	(revision 76)
@@ -0,0 +1,15 @@
+.. module:: GeoExt.plugins
+    :synopsis: Plugins add functionality to components like maps or forms.
+
+:mod:`GeoExt.plugins`
+=====================
+
+The :mod:`GeoExt.plugins` module contains classes that add functionality to
+GeoExt components like :class:`GeoExt.MapPanel`, or connect form fields to
+:mod:`GeoExt.data` classes.
+
+.. toctree::
+   :maxdepth: 1
+   :glob:
+   
+   plugins/*
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state/PermalinkProvider.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state/PermalinkProvider.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state/PermalinkProvider.txt	(revision 76)
@@ -0,0 +1,99 @@
+
+.. currentmodule:: GeoExt.state
+
+:class:`GeoExt.state.PermalinkProvider`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.state.Provider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider>`_
+    
+
+
+
+
+
+
+.. class:: PermalinkProvider(config)
+
+    Create a permalink provider.
+
+
+
+
+Example Use
+-----------
+
+Sample code displaying a new permalink each time the map is moved.
+
+.. code-block:: javascript
+
+    // create permalink provider
+    var permalinkProvider = new GeoExt.state.PermalinkProvider();
+
+    // set it in the state manager
+    Ext.state.Manager.setProvider(permalinkProvider);
+
+    // create a map panel, and make it stateful
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: "map",
+        layers: [
+            new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )
+        ],
+        stateId: "map",
+        prettyStateKeys: true // for pretty permalinks
+    });
+
+    // display permalink each time state is changed
+    permalinkProvider.on({
+        statechanged: function(provider, name, value) {
+            alert(provider.getLink());
+        }
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.state.Provider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider>`_.
+
+
+.. describe:: encodeType
+
+    ``Boolean`` Specifies whether type of state values should be encoded
+    and decoded. Set it to false if you work with components that don't
+    require encoding types, and want pretty permalinks. Defaults to true.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.state.Provider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider>`_.
+
+
+.. method:: PermalinkProvider.getLink
+
+    :param base: ``String`` The base URL, optional.
+    :return: ``String`` The permalink.
+    
+    Return the permalink corresponding to the current state.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintExtent.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintExtent.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintExtent.txt	(revision 76)
@@ -0,0 +1,176 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.PrintExtent`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+
+
+
+ptype
+    ``gx_printextent``
+
+
+
+.. class:: PrintExtent
+
+Provides a way to show and modify the extents of print pages on the map. It
+uses a layer to render the page extent and handle features of print pages,
+and provides a control to modify them. Must be set as a plugin to a
+:class:`GeoExt.MapPanel`.
+
+
+
+Example Use
+-----------
+
+Sample code to create a MapPanel with a PrintExtent, and print it
+immediately:
+
+.. code-block:: javascript
+
+    var printExtent = new GeoExt.plugins.PrintExtent({
+        printProvider: new GeoExt.data.PrintProvider({
+            capabilities: printCapabilities
+        })
+    });
+
+    var mapPanel = new GeoExt.MapPanel({
+        border: false,
+        renderTo: "div-id",
+        layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 6,
+        plugins: printExtent
+    });
+
+    printExtent.addPage();
+
+    // print the map
+    printExtent.print();
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties.
+
+
+.. describe:: layer
+
+    ``OpenLayers.Layer.Vector`` The layer used to render extent and handle
+    features to. Optional, will be created if not provided.
+
+.. describe:: pages
+
+    Array of :class:`GeoExt.data.PrintPage` The pages that this plugin
+    controls. Optional. If not provided, it will be created with one page
+    that is completely contained within the visible map extent.
+    
+    .. note:: All pages must use the same PrintProvider.
+
+.. describe:: printProvider
+
+    :class:`GeoExt.data.PrintProvider` The print provider this form
+    is connected to. Optional if pages are provided.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties.
+
+
+.. attribute:: PrintExtent.page
+
+    :class:`GeoExt.data.PrintPage` The page currently set for
+    transformation.
+
+.. attribute:: PrintExtent.pages
+
+    Array of :class:`GeoExt.data.PrintPage` The pages that this component
+    controls. Read-only.
+
+.. attribute:: PrintExtent.printProvider
+
+    :class:`GeoExt.data.PrintProvider` The print provider this form
+    is connected to. Read-only.
+
+
+
+
+Public Methods
+--------------
+
+Public methods.
+
+
+.. method:: PrintExtent.addPage
+
+    :param page: :class:`GeoExt.data.PrintPage` The page to add
+         to this plugin. If not provided, a page that fits the current
+         extent is created.
+    :return: page :class:``GeoExt.data.PrintPage``
+    
+    Adds a page to the list of pages that this plugin controls.
+
+.. method:: PrintExtent.hide
+
+    Tear downs the plugin, removing the
+    ``OpenLayers.Control.TransformFeature`` control and
+    the ``OpenLayers.Layer.Vector`` layer.
+
+.. method:: PrintExtent.print
+
+    :param options: ``Object`` Options to send to the PrintProvider's
+        print method. See :class:`GeoExt.data.PrintProvider` :: ``print``.
+    
+    Prints all pages as shown on the map.
+
+.. method:: PrintExtent.removePage
+
+    :param page: :class:`GeoExt.data.PrintPage` The page to remove
+         from this plugin.
+    
+    Removes a page from the list of pages that this plugin controls.
+
+.. method:: PrintExtent.selectPage
+
+    :param page: :class:`GeoExt.data.PrintPage` The page to select
+    
+    Selects the given page (ie. calls the setFeature on the modify feature
+    control)
+
+.. method:: PrintExtent.show
+
+    Sets up the plugin, initializing the ``OpenLayers.Layer.Vector``
+    layer and ``OpenLayers.Control.TransformFeature``, and centering
+    the first page if no pages were specified in the configuration.
+
+
+
+
+Events
+------
+
+Events.
+
+
+.. describe:: selectpage
+
+    Triggered when a page has been selected using the control
+    
+    Listener arguments:
+    * printPage - :class:`GeoExt.data.PrintPage` this printPage
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/AttributeForm.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/AttributeForm.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/AttributeForm.txt	(revision 76)
@@ -0,0 +1,81 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.AttributeForm`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+
+
+
+ptype
+    ``gx_attributeform``
+
+
+
+.. class:: AttributeForm
+
+This plugin allows creating form items from attribute records
+and fill a form panel with these items.
+
+
+
+Example Use
+-----------
+
+Sample code showing how to use an Ext form panel as a feature
+attribute form (for editing features for example).
+
+.. code-block:: javascript
+
+    var formPanel = new Ext.form.FormPanel({
+        autoScroll: true,
+        height: 300,
+        width: 350,
+        defaults: {
+            maxLengthText: "too long",
+            minLengthText: "too short"
+        }
+        plugins: [
+            new GeoExt.plugins.AttributeForm({
+                attributeStore: new GeoExt.data.AttributeStore({
+                    url: "http://some.wfs",
+                    baseParams: {
+                        "SERVICE": "WFS",
+                        "VERSION": "1.1.0",
+                        "REQUEST": "DescribeFeatureType",
+                        "TYPENAME": "the_typename"
+                    }
+                })
+            })
+        ]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties.
+
+
+.. describe:: attributeStore
+
+    ``Ext.data.Store`` The attribute store to bind to this plugin.
+    It can be any Ext store configured with a
+    :class:`GeoExt.data.AttributeReader`. If set form items
+    will be created from the attribute records in the form. In
+    most cases this store will be a :class:`GeoExt.data.AttributeStore`.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeComponent.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeComponent.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeComponent.txt	(revision 76)
@@ -0,0 +1,82 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.TreeNodeComponent`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+
+
+
+ptype
+    ``gx_TreeNodeComponent``
+
+
+
+A plugin to create tree node UIs that can have an Ext.Component below the
+node's title. Can be plugged into any ``Ext.tree.TreePanel`` and will be
+applied to nodes that are extended with the
+:class:`GeoExt.Tree.TreeNodeUIEventMixin`.
+
+If a node is configured with a ``component`` attribute, it will be rendered
+with the component in addition to icon and title.
+
+
+
+Example Use
+-----------
+
+Sample code to create a tree with a node that has a component:
+
+.. code-block:: javascript
+
+    var uiClass = Ext.extend(
+        Ext.tree.TreeNodeUI,
+        GeoExt.tree.TreeNodeUIEventMixin
+    );
+    var tree = new Ext.tree.TreePanel({
+        plugins: [
+            new GeoExt.plugins.TreeNodeRadioButton({
+                listeners: {
+                    "radiochange": function(node) {
+                        alert(node.text + "'s radio button was clicked.");
+                    }
+                }
+            })
+        ],
+        root: {
+            nodeType: "node",
+            uiProvider: uiClass,
+            text: "My Node",
+            component: {
+                xtype: "box",
+                autoEl: {
+                    tag: "img",
+                    src: "/images/my-image.jpg"
+                }
+            }
+        }
+    }
+
+Sample code to create a layer node UI with a radio button:
+
+.. code-block:: javascript
+
+    var uiClass = Ext.extend(
+        GeoExt.tree.LayerNodeUI,
+        new GeoExt.tree.TreeNodeUIEventMixin
+    );
+
+    
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintProviderField.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintProviderField.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintProviderField.txt	(revision 76)
@@ -0,0 +1,106 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.PrintProviderField`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+ptype
+    ``gx_printproviderfield``
+
+
+
+.. class:: PrintProviderField
+
+A plugin for ``Ext.form.Field`` components which provides synchronization
+with a :class:`GeoExt.data.PrintProvider`.
+
+
+
+Example Use
+-----------
+
+A form with combo boxes for layout and resolution, and a text field for a
+map title. The latter is a custom parameter to the print module, which is
+a default for all print pages. For setting custom parameters on the page
+level, use :class:`GeoExt.plugins.PrintPageField`):
+
+.. code-block:: javascript
+
+    var printProvider = new GeoExt.data.PrintProvider({
+        capabilities: printCapabilities
+    });
+    new Ext.form.FormPanel({
+        renderTo: "form",
+        width: 200,
+        height: 300,
+        items: [{
+            xtype: "combo",
+            displayField: "name",
+            store: printProvider.layouts, // printProvider.layout
+            fieldLabel: "Layout",
+            typeAhead: true,
+            mode: "local",
+            forceSelection: true,
+            triggerAction: "all",
+            selectOnFocus: true,
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            })
+        }, {
+            xtype: "combo",
+            displayField: "name",
+            store: printProvider.dpis, // printProvider.dpi
+            fieldLabel: "Resolution",
+            typeAhead: true,
+            mode: "local",
+            forceSelection: true,
+            triggerAction: "all",
+            selectOnFocus: true,
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            })
+        }, {
+            xtype: "textfield",
+            name: "mapTitle", // printProvider.customParams.mapTitle
+            fieldLabel: "Map Title",
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            })
+        }]
+    }):
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: printProvider
+
+    ``GeoExt.data.PrintProvider`` The print provider to use with this
+    plugin's field. Not required if set on the owner container of the
+    field.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintPageField.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintPageField.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/PrintPageField.txt	(revision 76)
@@ -0,0 +1,101 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.PrintPageField`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+ptype
+    ``gx_printpagefield``
+
+
+
+.. class:: PrintPageField
+
+A plugin for ``Ext.form.Field`` components which provides synchronization
+with a :class:`GeoExt.data.PrintPage`. The field name has to match the
+respective property of the printPage (e.g. ``scale``, ``rotation``).
+
+
+
+Example Use
+-----------
+
+A form with a combo box for the scale and text fields for rotation and a
+page title. The page title is a custom parameter of the print module's
+page configuration:
+
+.. code-block:: javascript
+
+    var printPage = new GeoExt.data.PrintPage({
+        printProvider: new GeoExt.data.PrintProvider({
+            capabilities: printCapabilities
+        })
+    });
+    new Ext.form.FormPanel({
+        renderTo: "form",
+        width: 200,
+        height: 300,
+        items: [{
+            xtype: "combo",
+            displayField: "name",
+            store: printPage.scales, // printPage.scale
+            name: "scale",
+            fieldLabel: "Scale",
+            typeAhead: true,
+            mode: "local",
+            forceSelection: true,
+            triggerAction: "all",
+            selectOnFocus: true,
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "textfield",
+            name: "rotation", // printPage.rotation
+            fieldLabel: "Rotation",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "textfield",
+            name: "mapTitle", // printPage.customParams["mapTitle"]
+            fieldLabel: "Map Title",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: printPage
+
+    ``GeoExt.data.PrintPage`` The print page to synchronize with.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeRadioButton.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeRadioButton.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/plugins/TreeNodeRadioButton.txt	(revision 76)
@@ -0,0 +1,88 @@
+
+.. currentmodule:: GeoExt.plugins
+
+:class:`GeoExt.plugins.TreeNodeRadioButton`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+
+
+
+ptype
+    ``gx_treenoderadiobutton``
+
+
+
+A plugin to create tree node UIs with radio buttons. Can be plugged into
+any ``Ext.tree.TreePanel`` and will be applied to nodes that are extended
+with the :class:`GeoExt.Tree.TreeNodeUIEventMixin`, in particular
+:class:`GeoExt.tree.LayerNodeUI` nodes.
+
+A tree with a ``GeoExt.plugins.TreeNodeRadioButton`` fires the additional
+``radiochange`` event when a node's radio button is clicked.
+
+Only if a node is configured ``radioGroup`` attribute, it will be rendered
+with a radio button next to its icon. The ``radioGroup`` works like a
+HTML checkbox with its ``name`` attribute, and ``radioGroup`` is a string
+that identifies the options group.
+
+
+
+
+Example Use
+-----------
+
+Sample code to create a tree with a node that has a radio button:
+
+.. code-block:: javascript
+
+    var UIClass = Ext.extend(
+        Ext.tree.TreeNodeUI,
+        GeoExt.tree.TreeNodeUIEventMixin
+    );
+    var tree = new Ext.tree.TreePanel({
+        plugins: [
+            new GeoExt.plugins.TreeNodeRadioButton({
+                listeners: {
+                    "radiochange": function(node) {
+                        alert(node.text + "'s radio button was clicked.");
+                    }
+                }
+            })
+        ],
+        root: {
+            nodeType: "node",
+            uiProvider: UIClass,
+            text: "My Node",
+            radioGroup: "myGroupId"
+        }
+    }
+
+    
+
+
+
+
+
+
+
+
+Events
+------
+
+Events.
+
+
+.. describe:: radiochange
+
+    Fires when a radio button is clicked.
+    
+    Listener arguments:
+    
+    * node - ``Ext.TreeNode`` The node of the clicked radio button.
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets.txt	(revision 76)
@@ -0,0 +1,60 @@
+Widgets
+=======
+
+GeoExt widgets are a collection of specialized map related components.
+
+.. toctree::
+    :maxdepth: 1
+    :glob:
+    
+    widgets/*
+    widgets/tips/*
+
+
+.. module:: GeoExt.form
+    :synopsis: A collection of form related classes.
+
+:mod:`GeoExt.form`
+==================
+
+The :mod:`GeoExt.form` module contains classes that extend map related
+functionality to ``Ext.form`` classes.
+
+.. toctree::
+    :maxdepth: 1
+    :glob:
+    
+    widgets/form/*
+
+
+.. module:: GeoExt.grid
+    :synopsis: A collection of grid related classes.
+
+:mod:`GeoExt.grid`
+==================
+
+The :mod:`GeoExt.grid` module contains classes that extend map related
+functionality to ``Ext.grid`` classes.
+
+.. toctree::
+    :maxdepth: 1
+    :glob:
+    
+    widgets/grid/*
+
+
+.. module:: GeoExt.tree
+    :synopsis: A collection of tree related classes.
+
+:mod:`GeoExt.tree`
+==================
+
+The :mod:`GeoExt.tree` module contains classes that extend map related
+functionality to ``Ext.tree`` classes.
+
+.. toctree::
+    :maxdepth: 1
+    :glob:
+    
+    widgets/tree/*
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendImage.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendImage.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendImage.txt	(revision 76)
@@ -0,0 +1,73 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.LegendImage`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_
+    
+
+
+
+xtype
+    ``gx_legendimage``
+
+
+
+
+.. class:: LegendImage(config)
+
+    Show a legend image in a BoxComponent and make sure load errors are
+    dealt with.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_.
+
+
+.. describe:: defaultImgSrc
+
+    ``String`` Path to image that will be used if the legend image fails
+    to load.  Default is Ext.BLANK_IMAGE_URL.
+
+.. describe:: imgCls
+
+    ``String``  Optional css class to apply to img tag
+
+.. describe:: url
+
+    ``String``  The url of the image to load
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_.
+
+
+.. method:: LegendImage.setUrl
+
+    :param url: ``String`` The new URL.
+    
+    Sets the url of the legend image.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/ZoomSliderTip.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/ZoomSliderTip.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/ZoomSliderTip.txt	(revision 76)
@@ -0,0 +1,86 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.ZoomSliderTip`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_
+    * :class:`GeoExt.SliderTip`
+
+
+
+
+
+
+.. class:: ZoomSliderTip(config)
+
+    Create a slider tip displaying :class:`GeoExt.ZoomSlider` values.
+
+
+
+Example Use
+-----------
+
+Sample code to create a slider tip to display scale and resolution:
+
+.. code-block:: javascript
+
+    var slider = new GeoExt.ZoomSlider({
+        renderTo: document.body,
+        width: 200,
+        map: map,
+        plugins: new GeoExt.ZoomSliderTip({
+            template: "Scale: 1 : {scale}<br>Resolution: {resolution}"
+        })
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_.
+
+
+.. describe:: hover
+
+    ``Boolean``
+    Display the tip when hovering over the thumb.  If ``false``, tip will
+    only be displayed while dragging.  Default is ``true``.
+
+.. describe:: minWidth
+
+    ``Number``
+    Minimum width of the tip.  Default is 10.
+
+.. describe:: offsets
+
+    ``Array(Number)``
+    A two item list that provides x, y offsets for the tip.  Default is
+    [0, -10].
+
+.. describe:: template
+
+    ``String``
+    Template for the tip. Can be customized using the following keywords in
+    curly braces:
+    
+    * ``zoom`` - the zoom level
+    * ``resolution`` - the resolution
+    * ``scale`` - the scale denominator
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.txt	(revision 76)
@@ -0,0 +1,84 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.LayerOpacitySliderTip`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_
+    * :class:`GeoExt.SliderTip`
+
+
+
+
+
+
+.. class:: LayerOpacitySliderTip(config)
+
+    Create a slider tip displaying :class:`GeoExt.LayerOpacitySlider` values.
+
+
+
+Example Use
+-----------
+
+Sample code to create a slider tip to display scale and resolution:
+
+.. code-block:: javascript
+
+    var slider = new GeoExt.LayerOpacitySlider({
+        renderTo: document.body,
+        width: 200,
+        layer: layer,
+        plugins: new GeoExt.LayerOpacitySliderTip({
+            template: "Opacity: {opacity}%"
+        })
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip>`_.
+
+
+.. describe:: hover
+
+    ``Boolean``
+    Display the tip when hovering over the thumb.  If ``false``, tip will
+    only be displayed while dragging.  Default is ``true``.
+
+.. describe:: minWidth
+
+    ``Number``
+    Minimum width of the tip.  Default is 10.
+
+.. describe:: offsets
+
+    ``Array(Number)``
+    A two item list that provides x, y offsets for the tip.  Default is
+    [0, -10].
+
+.. describe:: template
+
+    ``String``
+    Template for the tip. Can be customized using the following keywords in
+    curly braces:
+    
+    * ``opacity`` - the opacity value in percent.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/SliderTip.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/SliderTip.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tips/SliderTip.txt	(revision 76)
@@ -0,0 +1,73 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.SliderTip`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.slider.Tip>`_
+    
+
+
+
+
+
+
+.. class:: SliderTip(config)
+
+    Create a slider tip displaying ``Ext.Slider`` values over slider thumbs.
+
+
+
+Example Use
+-----------
+
+Sample code to create a slider tip to display slider value on hover:
+
+.. code-block:: javascript
+
+    var slider = new Ext.Slider({
+        renderTo: document.body,
+        width: 200,
+        plugins: new GeoExt.SliderTip()
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Tip <http://dev.sencha.com/deploy/dev/docs/?class=Ext.slider.Tip>`_.
+
+
+.. describe:: hover
+
+    ``Boolean``
+    Display the tip when hovering over the thumb.  If ``false``, tip will
+    only be displayed while dragging.  Default is ``true``.
+
+.. describe:: minWidth
+
+    ``Number``
+    Minimum width of the tip.  Default is 10.
+
+.. describe:: offsets
+
+    ``Array(Number)``
+    A two item list that provides x, y offsets for the tip.  Default is
+    [0, -10].
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Popup.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Popup.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Popup.txt	(revision 76)
@@ -0,0 +1,117 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.Popup`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Window <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window>`_
+    
+
+
+
+xtype
+    ``gx_popup``
+
+
+
+
+.. class:: Popup(config)
+
+    Popups are a specialized Window that supports anchoring
+    to a particular location in a MapPanel.  When a popup
+    is anchored to a location, that means that the popup
+    will visibly point to the location on the map, and move
+    accordingly when the map is panned or zoomed.
+
+
+
+Example Use
+-----------
+
+Sample code to create a popup anchored to a feature:
+
+.. code-block:: javascript
+
+    var popup = new GeoExt.Popup({
+        title: "My Popup",
+        location: feature,
+        width: 200,
+        html: "<div>Popup content</div>",
+        collapsible: true
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Window <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window>`_.
+
+
+.. describe:: ancCls
+
+    ``String``  CSS class name for the popup's anchor.
+
+.. describe:: anchored
+
+    ``Boolean``  The popup begins anchored to its location.  Default is
+    ``true``.
+
+.. describe:: location
+
+    ``OpenLayers.Feature.Vector`` or ``OpenLayers.LonLat`` or
+    ``OpenLayers.Pixel`` or ``OpenLayers.Geometry`` A location for this
+    popup's anchor.
+
+.. describe:: map
+
+    ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+    The map this popup will be anchored to (only required if ``anchored``
+    is set to true and the map cannot be derived from the ``location``'s
+    layer.
+
+.. describe:: panIn
+
+    ``Boolean`` The popup should pan the map so that the popup is
+    fully in view when it is rendered.  Default is ``true``.
+
+.. describe:: popupCls
+
+    ``String`` CSS class name for the popup DOM elements.  Default is
+    "gx-popup".
+
+.. describe:: unpinnable
+
+    ``Boolean`` The popup should have a "unpin" tool that unanchors it from
+    its location.  Default is ``true``.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.Window <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window>`_.
+
+
+.. method:: Popup.setSize
+
+    :param w: ``Integer``
+    :param h: ``Integer``
+    
+    Sets the size of the popup, taking into account the size of the anchor.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/grid/FeatureSelectionModel.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/grid/FeatureSelectionModel.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/grid/FeatureSelectionModel.txt	(revision 76)
@@ -0,0 +1,125 @@
+
+.. currentmodule:: GeoExt.grid
+
+:class:`GeoExt.grid.FeatureSelectionModel`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.grid.RowSelectionModel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel>`_
+    
+
+
+
+
+
+
+.. class:: FeatureSelectionModel
+
+    A row selection model which enables automatic selection of features
+    in the map when rows are selected in the grid and vice-versa.
+
+
+
+Example Use
+-----------
+
+Sample code to create a feature grid with a feature selection model:
+
+.. code-block:: javascript
+
+     var gridPanel = new Ext.grid.GridPanel({
+        title: "Feature Grid",
+        region: "east",
+        store: store,
+        width: 320,
+        columns: [{
+            header: "Name",
+            width: 200,
+            dataIndex: "name"
+        }, {
+            header: "Elevation",
+            width: 100,
+            dataIndex: "elevation"
+        }],
+        sm: new GeoExt.grid.FeatureSelectionModel()
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.grid.RowSelectionModel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel>`_.
+
+
+.. describe:: autoActivateControl
+
+    ``Boolean`` If true the select feature control is activated and
+    deactivated when binding and unbinding. Defaults to true.
+
+.. describe:: layer
+
+    ``OpenLayers.Layer.Vector`` The vector layer used for the creation of
+    the select feature control, it must already be added to the map. If not
+    provided, the layer bound to the grid's store, if any, will be used.
+
+.. describe:: layerFromStore
+
+    ``Boolean`` If true, and if the constructor is passed neither a
+    layer nor a select feature control, a select feature control is
+    created using the layer found in the grid's store. Set it to
+    false if you want to manually bind the selection model to a
+    layer. Defaults to true.
+
+.. describe:: selectControl
+
+    ``OpenLayers.Control.SelectFeature`` A select feature control. If not
+    provided one will be created.  If provided any "layer" config option
+    will be ignored, and its "multiple" option will be used to configure
+    the selectionModel.  If an ``Object`` is provided here, it will be
+    passed as config to the SelectFeature constructor, and the "layer"
+    config option will be used for the layer.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.grid.RowSelectionModel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel>`_.
+
+
+.. method:: FeatureSelectionModel.bind
+
+    :param obj: ``OpenLayers.Layer.Vector`` or
+        ``OpenLayers.Control.SelectFeature`` The object this selection model
+        should be bound to, either a vector layer or a select feature
+        control.
+    :param options: ``Object`` An object with a "controlConfig"
+        property referencing the configuration object to pass to the
+        ``OpenLayers.Control.SelectFeature`` constructor.
+    :return: ``OpenLayers.Control.SelectFeature`` The select feature
+        control this selection model uses.
+    
+    Bind the selection model to a layer or a SelectFeature control.
+
+.. method:: FeatureSelectionModel.unbind
+
+    :return: ``OpenLayers.Control.SelectFeature`` The select feature
+        control this selection model used.
+    
+    Unbind the selection model from the layer or SelectFeature control.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerOpacitySlider.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerOpacitySlider.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerOpacitySlider.txt	(revision 76)
@@ -0,0 +1,162 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.LayerOpacitySlider`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_
+    
+
+
+
+xtype
+    ``gx_opacityslider``
+
+
+
+
+.. class:: LayerOpacitySlider(config)
+
+    Create a slider for controlling a layer's opacity.
+
+
+
+Example Use
+-----------
+
+Sample code to render a slider outside the map viewport:
+
+.. code-block:: javascript
+
+    var slider = new GeoExt.LayerOpacitySlider({
+        renderTo: document.body,
+        width: 200,
+        layer: layer
+    });
+
+Sample code to add a slider to a map panel:
+
+.. code-block:: javascript
+
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    var panel = new GeoExt.MapPanel({
+        renderTo: document.body,
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [layer],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_opacityslider",
+            layer: layer,
+            aggressive: true,
+            vertical: true,
+            height: 100,
+            x: 10,
+            y: 20
+        }]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_.
+
+
+.. describe:: aggressive
+
+    ``Boolean``
+    If set to true, the opacity is changed as soon as the thumb is moved.
+    Otherwise when the thumb is released (default).
+
+.. describe:: changeVisibility
+
+    ``Boolean``
+    If set to true, the layer's visibility is handled by the
+    slider, the slider makes the layer invisible when its
+    value is changed to the min value, and makes the layer
+    visible again when its value goes from the min value
+    to some other value. The layer passed to the constructor
+    must be visible, as its visibility is fully handled by
+    the slider. Defaults to false.
+
+.. describe:: changeVisibilityDelay
+
+    ``Number`` Time in milliseconds before changing the layer's visibility.
+    If the value changes again within that time, the layer's visibility
+    change does not occur. Only applicable if changeVisibility is true.
+    Defaults to 5.
+
+.. describe:: complementaryLayer
+
+    ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+    If provided, a layer that will be made invisible (its visibility is
+    set to false) when the slider value is set to its max value. If this
+    slider is used to fade visibility between to layers, setting
+    ``complementaryLayer`` and ``changeVisibility`` will make sure that
+    only visible tiles are loaded when the slider is set to its min or max
+    value. (optional)
+
+.. describe:: delay
+
+    ``Number`` Time in milliseconds before setting the opacity value to the
+    layer. If the value change again within that time, the original value
+    is not set. Only applicable if aggressive is true.
+
+.. describe:: inverse
+
+    ``Boolean``
+    If true, we will work with transparency instead of with opacity.
+    Defaults to false.
+
+.. describe:: layer
+
+    ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+    The layer this slider changes the opacity of. (required)
+
+.. describe:: value
+
+    ``Number``
+    The value to initialize the slider with. This value is
+    taken into account only if the layer's opacity is null.
+    If the layer's opacity is null and this value is not
+    defined in the config object then the slider initializes
+    it to the max value.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_.
+
+
+.. method:: LayerOpacitySlider.setLayer
+
+    :param layer: ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord`
+    
+    Bind a new layer to the opacity slider.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/PrintMapPanel.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/PrintMapPanel.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/PrintMapPanel.txt	(revision 76)
@@ -0,0 +1,209 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.PrintMapPanel`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_
+    * :class:`GeoExt.MapPanel`
+
+
+
+xtype
+    ``gx_printmappanel``
+
+
+
+
+.. class:: PrintMapPanel
+
+A map panel that controls scale and center of a print page. Based on the
+current view (i.e. layers and extent) of a source map, this panel will be
+sized according to the aspect ratio of the print page. As the user zooms
+and pans in the :class:`GeoExt.PrintMapPanel`, the print page will update
+its scale and center accordingly. If the scale on the print page changes
+(e.g. by setting it using a combo box with a
+:class:`GeoExt.plugins.PrintPageField`), the extent of the
+:class:`GeoExt.PrintMapPanel` will be updated to match the page bounds.
+
+.. note:: The ``zoom``, ``center`` and ``extent`` config options will have
+    no affect, as they will be determined by the ``sourceMap``.
+
+
+
+Example Use
+-----------
+
+A map with a "Print..." button. If clicked, a dialog containing a
+PrintMapPanel will open, with a "Create PDF" button.
+
+.. code-block:: javascript
+
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: "map",
+        layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 6,
+        bbar: [{
+            text: "Print...",
+            handler: function() {
+                var printDialog = new Ext.Window({
+                    autoHeight: true,
+                    width: 350,
+                    items: [new GeoExt.PrintMapPanel({
+                        sourceMap: mapPanel,
+                        printProvider: {
+                            capabilities: printCapabilities
+                        }
+                    })],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function() {
+                            printDialog.items.get(0).print();
+                        }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. describe:: center
+
+    ``OpenLayers.LonLat`` or ``Array(Number)``  A location for the map
+    center. Do not set, as this will be overridden with the ``sourceMap``
+    center.
+
+.. describe:: extent
+
+    ``OpenLayers.Bounds or Array(Number)``  An initial extent for the map.
+    Do not set, because the initial extent will be determined by the
+    ``sourceMap``.
+
+.. describe:: layers
+
+    ``GeoExt.data.LayerStore or GeoExt.data.GroupingStore or Array(OpenLayers.Layer)``
+    A store holding records. The layers provided here will be added to this
+    MapPanel's map when it is rendered.
+
+.. describe:: limitScales
+
+    ``Boolean`` If set to true, the printPage cannot be set to scales that
+    would generate a preview in this :class:`GeoExt.PrintMapPanel` with a
+    completely different extent than the one that would appear on the
+    printed map. Default is false.
+
+.. describe:: map
+
+    ``Object`` Optional configuration for the ``OpenLayers.Map`` object
+    that this PrintMapPanel creates. Useful e.g. to configure a map with a
+    custom set of controls, or to add a ``preaddlayer`` listener for
+    filtering out layer types that cannot be printed.
+
+.. describe:: prettyStateKeys
+
+    ``Boolean`` Set this to true if you want pretty strings in the MapPanel's
+    state keys. More specifically, layer.name instead of layer.id will be used
+    in the state keys if this option is set to true. But in that case you have
+    to make sure you don't have two layers with the same name. Defaults to
+    false.
+
+.. describe:: printProvider
+
+    :class:`GeoExt.data.PrintProvider` or ``Object`` PrintProvider to use
+    for printing. If an ``Object`` is provided, a new PrintProvider will
+    be created and configured with the object.
+    
+    .. note:: The PrintMapPanel requires the printProvider's capabilities
+      to be available upon initialization. This means that a PrintMapPanel
+      configured with an ``Object`` as ``printProvider`` will only work
+      when ``capabilities`` is provided in the printProvider's
+      configuration object. If ``printProvider`` is provided as an instance
+      of :class:`GeoExt.data.PrintProvider`, the capabilities must be
+      loaded before PrintMapPanel initialization.
+
+.. describe:: sourceMap
+
+    :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` The map that is to be
+    printed.
+
+.. describe:: zoom
+
+    ``Number``  An initial zoom level for the map. Do not set, because the
+    initial extent will be determined by the ``sourceMap``.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. attribute:: PrintMapPanel.layers
+
+    :class:`GeoExt.data.LayerStore`  A store containing
+    :class:`GeoExt.data.LayerRecord` objects.
+
+.. attribute:: PrintMapPanel.map
+
+    ``OpenLayers.Map`` or ``Object``  A map or map configuration.
+
+.. attribute:: PrintMapPanel.previewScales
+
+    ``Ext.data.Store`` A data store with a subset of the printProvider's
+    scales. By default, this contains all the scales of the printProvider.
+    If ``limitScales`` is set to true, it will only contain print scales
+    that can properly be previewed with this :class:`GeoExt.PrintMapPanel`.
+
+.. attribute:: PrintMapPanel.printPage
+
+    :class:`GeoExt.data.PrintPage` PrintPage for this PrintMapPanel.
+    Read-only.
+
+.. attribute:: PrintMapPanel.printProvider
+
+    :class:`GeoExt.data.PrintProvider` PrintProvider for this
+    PrintMapPanel.
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. method:: PrintMapPanel.print
+
+    :param options: ``Object`` options for
+        the :class:`GeoExt.data.PrintProvider` :: ``print``  method.
+    
+    Convenience method for printing the map, without the need to
+    interact with the printProvider and printPage.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Action.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Action.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/Action.txt	(revision 76)
@@ -0,0 +1,71 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.Action`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Action>`_
+    
+
+
+
+
+
+
+.. class:: Action(config)
+
+    Create a GeoExt.Action instance. A GeoExt.Action is created
+    to insert an OpenLayers control in a toolbar as a button or
+    in a menu as a menu item. A GeoExt.Action instance can be
+    used like a regular Ext.Action, look at the Ext.Action API
+    doc for more detail.
+
+
+
+Example Use
+-----------
+
+Sample code to create a toolbar with an OpenLayers control into it.
+
+.. code-block:: javascript
+
+    var action = new GeoExt.Action({
+        text: "max extent",
+        control: new OpenLayers.Control.ZoomToMaxExtent(),
+        map: map
+    });
+    var toolbar = new Ext.Toolbar([action]);
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Action>`_.
+
+
+.. describe:: control
+
+    ``OpenLayers.Control`` The OpenLayers control wrapped in this action.
+
+.. describe:: map
+
+    ``OpenLayers.Map`` The OpenLayers map that the control should be added
+    to.  For controls that don't need to be added to a map or have already
+    been added to one, this config property may be omitted.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendPanel.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendPanel.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LegendPanel.txt	(revision 76)
@@ -0,0 +1,76 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.LegendPanel`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_
+    
+
+
+
+xtype
+    ``gx_legendpanel``
+
+
+
+
+.. class:: LegendPanel(config)
+
+A panel showing legends of all layers in a layer store.
+Depending on the layer type, a legend renderer will be chosen.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. describe:: dynamic
+
+    ``Boolean``
+    If false the LegendPanel will not listen to the add, remove and change
+    events of the LayerStore. So it will load with the initial state of
+    the LayerStore and not change anymore.
+
+.. describe:: filter
+
+    ``Function``
+    A function, called in the scope of the legend panel, with a layer record
+    as argument. Is expected to return true for layers to be displayed, false
+    otherwise. By default, all layers will be displayed.
+    
+    .. code-block:: javascript
+    
+        filter: function(record) {
+            return record.getLayer().isBaseLayer;
+        }
+
+.. describe:: layerStore
+
+    ``GeoExt.data.LayerStore``
+    The layer store containing layers to be displayed in the legend
+    container. If not provided it will be taken from the MapPanel.
+
+.. describe:: preferredTypes
+
+    ``Array(String)`` An array of preferred legend types.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/OverlayLayerContainer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/OverlayLayerContainer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/OverlayLayerContainer.txt	(revision 76)
@@ -0,0 +1,61 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.OverlayLayerContainer`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_
+    * :class:`GeoExt.tree.LayerContainer`
+
+
+
+
+
+
+.. class:: OverlayLayerContainer
+
+    A layer container that will collect all overlay layers of an OpenLayers
+    map. Only layers that have displayInLayerSwitcher set to true will be
+    included.
+
+    To use this node type in ``TreePanel`` config, set nodeType to
+    "gx_overlaylayercontainer".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_.
+
+
+.. describe:: layerStore
+
+    :class:`GeoExt.data.LayerStore` The layer store containing layers to be
+    displayed in the container. If loader is not provided or provided as
+    ``Object``, this property will be set as the store option of the
+    loader. Otherwise it will be ignored.
+
+.. describe:: loader
+
+    :class:`GeoExt.tree.LayerLoader` or ``Object`` The loader to use with
+    this container. If an ``Object`` is provided, a
+    :class:`GeoExt.tree.LayerLoader`, configured with the the properties
+    from the provided object, will be created.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerNode.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerNode.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerNode.txt	(revision 76)
@@ -0,0 +1,100 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.LayerNode`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_
+    
+
+
+
+
+
+
+.. class:: LayerNode(config)
+
+    A subclass of ``Ext.tree.TreeNode`` that is connected to an
+    ``OpenLayers.Layer`` by setting the node's layer property. Checking or
+    unchecking the checkbox of this node will directly affect the layer and
+    vice versa. The default iconCls for this node's icon is
+    "gx-tree-layer-icon", unless it has children.
+
+    Setting the node's layer property to a layer name instead of an object
+    will also work. As soon as a layer is found, it will be stored as layer
+    property in the attributes hash.
+
+    The node's text property defaults to the layer name.
+
+    If the node has a checkedGroup attribute configured, it will be
+    rendered with a radio button instead of the checkbox. The value of
+    the checkedGroup attribute is a string, identifying the options group
+    for the node.
+
+    To use this node type in a ``TreePanel`` config, set ``nodeType`` to
+    "gx_layer".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_.
+
+
+.. describe:: layer
+
+    ``OpenLayers.Layer or String``
+    The layer that this layer node will
+    be bound to, or the name of the layer (has to match the layer's
+    name property). If a layer name is provided, ``layerStore`` also has
+    to be provided.
+
+.. describe:: layerStore
+
+    :class:`GeoExt.data.LayerStore` ``or "auto"``
+    The layer store containing the layer that this node represents.  If set
+    to "auto", the node will query the ComponentManager for a
+    :class:`GeoExt.MapPanel`, take the first one it finds and take its layer
+    store. This property is only required if ``layer`` is provided as a
+    string.
+
+.. describe:: loader
+
+    ``Ext.tree.TreeLoader|Object`` If provided, subnodes will be added to
+    this LayerNode. Obviously, only loaders that process an
+    ``OpenLayers.Layer`` or :class:`GeoExt.data.LayerRecord` (like
+    :class:`GeoExt.tree.LayerParamsLoader`) will actually generate child
+    nodes here. If provided as ``Object``, a
+    :class:`GeoExt.tree.LayerParamLoader` instance will be created, with
+    the provided object as configuration.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_.
+
+
+.. attribute:: LayerNode.layer
+
+    ``OpenLayers.Layer``
+    The layer this node is bound to.
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerLoader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerLoader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerLoader.txt	(revision 76)
@@ -0,0 +1,122 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.LayerLoader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+
+
+.. class:: LayerLoader
+
+    A loader that will load all layers of a :class:`GeoExt.data.LayerStore`
+    By default, only layers that have displayInLayerSwitcher set to true
+    will be included. The childrens' iconCls defaults to
+    "gx-tree-layer-icon".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: baseAttrs
+
+    An object containing attributes to be added to all nodes created by
+    this loader.
+
+.. describe:: filter
+
+    ``Function``
+    A function, called in the scope of this loader, with a layer record
+    as argument. Is expected to return true for layers to be loaded, false
+    otherwise. By default, the filter checks for displayInLayerSwitcher:
+    
+    .. code-block:: javascript
+    
+        filter: function(record) {
+            return record.getLayer().displayInLayerSwitcher == true
+        }
+
+.. describe:: store
+
+    :class:`GeoExt.data.LayerStore`
+    The layer store containing layers to be added by this loader.
+
+.. describe:: uiProviders
+
+    ``Object``
+    An optional object containing properties which specify custom
+    GeoExt.tree.LayerNodeUI implementations. If the optional uiProvider
+    attribute for child nodes is a string rather than a reference to a
+    TreeNodeUI implementation, then that string value is used as a
+    property name in the uiProviders object. If not provided, the
+    uiProviders object will be taken from the ownerTree's loader.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. method:: LayerLoader.createNode
+
+    :param attr: ``Object`` attributes for the new node
+    
+    Override this function for custom TreeNode node implementation, or to
+    modify the attributes at creation time.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: beforeload
+
+    Triggered before loading children. Return false to avoid
+    loading children.
+    
+    Listener arguments:
+    
+    * loader - :class:`GeoExt.tree.LayerLoader` this loader
+    * node - ``Ex.tree.TreeNode`` the node that this loader is
+        configured with
+
+.. describe:: load
+
+    Triggered after children wer loaded.
+    
+    Listener arguments:
+    
+    * loader - :class:`GeoExt.tree.LayerLoader` this loader
+    * node - ``Ex.tree.TreeNode`` the node that this loader is
+        configured with
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamNode.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamNode.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamNode.txt	(revision 76)
@@ -0,0 +1,76 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.LayerParamNode`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_
+    
+
+
+
+
+
+
+.. class:: LayerParamNode
+
+A subclass of ``Ext.tree.TreeNode`` that represents a value of a list of
+values provided as one of an ``OpenLayers.Layer.HTTPRequest``'s params.
+The default iconCls for this node's icon is "gx-tree-layerparam-icon".
+
+To use this node type in a ``TreePanel`` config, set ``nodeType`` to
+"gx_layerparam".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.TreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode>`_.
+
+
+.. describe:: delimiter
+
+    ``String`` Delimiter of the ``param``'s value's items. Default is
+    ``,`` (comma). If the ``param``'s value is an array, this property
+    has no effect.
+
+.. describe:: item
+
+    ``String`` The param's value's item that this node represents.
+
+.. describe:: layer
+
+    ``OpenLayers.Layer.HTTPRequest|String`` The layer that this node
+    represents a subnode of. If provided as string, the string has to
+    match the title of one of the records in the ``layerStore``.
+
+.. describe:: layerStore
+
+    :class:`GeoExt.data.LayerStore` Only used if layer is provided as
+    string. The store where we can find the layer. If not provided, the
+    store of a map panel found by ``GeoExt.MapPanel::guess`` will be used.
+
+.. describe:: param
+
+    ``String`` Key for a param (key-value pair in the params object of the
+    layer) that this node represents an item of. The value can either be an
+    ``Array`` or a ``String``, delimited by the character (or string)
+    provided as ``delimiter`` config option.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamLoader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamLoader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerParamLoader.txt	(revision 76)
@@ -0,0 +1,101 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.LayerParamLoader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+
+
+.. class:: LayerParamLoader
+
+    A loader that creates children from its node's layer
+    (``OpenLayers.Layer.HTTPRequest``) by items in one of the values in
+    the layer's params object.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: delimiter
+
+    ``String`` Delimiter of the ``param``'s value's items. Default is
+    ``,`` (comma). If the ``param``'s value is an array, this property has
+    no effect.
+
+.. describe:: param
+
+    ``String`` Key for a param (key-value pair in the params object of the
+    layer) that this loader uses to create childnodes from its items. The
+    value can either be an ``Array`` or a ``String``, delimited by the
+    character (or string) provided as ``delimiter`` config option.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. method:: LayerParamLoader.createNode
+
+    :param attr: ``Object`` attributes for the new node
+    
+    Override this function for custom TreeNode node implementation, or to
+    modify the attributes at creation time.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: beforeload
+
+    Triggered before loading children. Return false to avoid
+    loading children.
+    
+    Listener arguments:
+    
+    * loader - :class:`GeoExt.tree.LayerLoader` this loader
+    * node - ``Ex.tree.TreeNode`` the node that this loader is
+        configured with
+
+.. describe:: load
+
+    Triggered after children were loaded.
+    
+    Listener arguments:
+    
+    * loader - :class:`GeoExt.tree.LayerLoader` this loader
+    * node - ``Ex.tree.TreeNode`` the node that this loader is
+        configured with
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.txt	(revision 76)
@@ -0,0 +1,63 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.WMSCapabilitiesLoader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.TreeLoader <http://www.dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeLoader>`_
+    
+
+
+
+
+
+
+.. class:: WMSCapabilitiesLoader
+
+    A loader that will load create a tree of all layers of a Web Map
+    Service (WMS), maintaining its tree structure. Nodes created by this
+    loader are instances of ``Ext.tree.TreeNode``. If the WMS Capabilities
+    advertise a name for a layer, an OpenLayers.Layer.WMS instance will
+    be set on the node in its ``layer`` attribute.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.TreeLoader <http://www.dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeLoader>`_.
+
+
+.. describe:: layerOptions
+
+    ``Object``
+    Optional options to set on the WMS layers which will be created by
+    this loader.
+
+.. describe:: layerParams
+
+    ``Object``
+    Optional parameters to set on the WMS layers which will be created by
+    this loader.
+
+.. describe:: url
+
+    ``String``
+    The online resource of the Web Map Service.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/BaseLayerContainer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/BaseLayerContainer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/BaseLayerContainer.txt	(revision 76)
@@ -0,0 +1,64 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.BaseLayerContainer`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_
+    * :class:`GeoExt.tree.LayerContainer`
+
+
+
+
+
+
+.. class:: BaseLayerContainer
+
+   A layer container that will collect all base layers of an OpenLayers
+   map. Only layers that have displayInLayerSwitcher set to true will be
+   included. The childrens' iconCls defaults to "gx-tree-baselayer-icon".
+
+   Children will be rendered with a radio button instead of a checkbox,
+   showing the user that only one base layer can be active at a time.
+
+   To use this node type in ``TreePanel`` config, set nodeType to
+   "gx_baselayercontainer".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_.
+
+
+.. describe:: layerStore
+
+    :class:`GeoExt.data.LayerStore` The layer store containing layers to be
+    displayed in the container. If loader is not provided or provided as
+    ``Object``, this property will be set as the store option of the
+    loader. Otherwise it will be ignored.
+
+.. describe:: loader
+
+    :class:`GeoExt.tree.LayerLoader` or ``Object`` The loader to use with
+    this container. If an ``Object`` is provided, a
+    :class:`GeoExt.tree.LayerLoader`, configured with the the properties
+    from the provided object, will be created.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.txt	(revision 76)
@@ -0,0 +1,68 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.TreeNodeUIEventMixin`
+================================================================================
+
+
+
+A mixin that adds events to TreeNodeUIs. With these events, tree plugins
+can modify the node ui's DOM when it is rendered, and react to raw click
+events on tree nodes.
+
+
+
+Example Use
+-----------
+
+Sample code to create a tree with a node that uses the
+:class:`GeoExt.tree.TreeNodeUIEventMixin`:
+
+.. code-block:: javascript
+
+    var UIClass = Ext.extend(
+        Ext.tree.TreeNodeUI,
+        GeoExt.tree.TreeNodeUIEventMixin
+    );
+    var tree = new Ext.tree.TreePanel({
+        root: {
+            nodeType: "node",
+            uiProvider: UIClass,
+            text: "My Node"
+        }
+    }
+
+    
+
+
+
+
+
+
+
+
+Events
+------
+
+Events.
+
+
+.. describe:: rawclicknode
+
+    Fires on the tree when a node is clicked.
+    
+    Listener arguments:
+    
+    * node - ``Ext.TreeNode`` The clicked node.
+    * event - ``Ext.EventObject`` The click event.
+
+.. describe:: rendernode
+
+    Fires on the tree when a node is rendered.
+    
+    Listener arguments:
+    
+    * node - ``Ext.TreeNode`` The rendered node.
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerContainer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerContainer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/tree/LayerContainer.txt	(revision 76)
@@ -0,0 +1,68 @@
+
+.. currentmodule:: GeoExt.tree
+
+:class:`GeoExt.tree.LayerContainer`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_
+    
+
+
+
+
+
+
+.. class:: LayerContainer
+
+    A subclass of ``Ext.tree.AsyncTreeNode`` that will collect all layers of an
+    OpenLayers map. Only layers that have displayInLayerSwitcher set to true
+    will be included. The childrens' iconCls defaults to
+    "gx-tree-layer-icon".
+
+    Note: if this container is loaded by an ``Ext.tree.TreeLoader``, the
+    ``applyLoader`` config option of that loader needs to be set to
+    "false". Also note that the list of available uiProviders will be
+    taken from the ownerTree if this container's loader is configured
+    without one.
+
+    To use this node type in ``TreePanel`` config, set nodeType to
+    "gx_layercontainer".
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.tree.AsyncTreeNode <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode>`_.
+
+
+.. describe:: layerStore
+
+    :class:`GeoExt.data.LayerStore` The layer store containing layers to be
+    displayed in the container. If loader is not provided or provided as
+    ``Object``, this property will be set as the store option of the
+    loader. Otherwise it will be ignored.
+
+.. describe:: loader
+
+    :class:`GeoExt.tree.LayerLoader` or ``Object`` The loader to use with
+    this container. If an ``Object`` is provided, a
+    :class:`GeoExt.tree.LayerLoader`, configured with the the properties
+    from the provided object, will be created.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/UrlLegend.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/UrlLegend.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/UrlLegend.txt	(revision 76)
@@ -0,0 +1,67 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.UrlLegend`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_
+    * :class:`GeoExt.LayerLegend`
+
+
+
+xtype
+    ``gx_urllegend``
+
+
+
+
+.. class:: UrlLegend(config)
+
+    Show a legend image in a BoxComponent and make sure load errors are
+    dealt with.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. describe:: labelCls
+
+    ``String``
+    Optional css class to use for the layer title labels.
+
+.. describe:: layerRecord
+
+    :class:`GeoExt.data.LayerRecord`  The layer record for the legend
+
+.. describe:: legendTitle
+
+    ``String``
+    Optional title to be displayed instead of the layer title.  If this is
+    set, the value of ``showTitle`` will be ignored (assumed to be true).
+
+.. describe:: showTitle
+
+    ``Boolean``
+    Whether or not to show the title of a layer. This can be overridden
+    on the LayerStore record using the hideTitle property.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/VectorLegend.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/VectorLegend.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/VectorLegend.txt	(revision 76)
@@ -0,0 +1,220 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.VectorLegend`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_
+    * :class:`GeoExt.LayerLegend`
+
+
+
+xtype
+    ``gx_vectorlegend``
+
+
+
+
+.. class:: VectorLegend(config)
+
+    Create a vector legend.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. describe:: bodyBorder
+
+    ``Boolean``
+    Show a border around the legend panel. Default is ``false``.
+
+.. describe:: clickableSymbol
+
+    ``Boolean``
+    Set cursor style to "pointer" for symbolizers.  Register for
+    the ``symbolclick`` event to handle clicks.  Note that click events
+    are fired regardless of this value.  If ``false``, no cursor style will
+    be set.  Default is ``false``.
+
+.. describe:: clickableTitle
+
+    ``Boolean``
+    Set cursor style to "pointer" for rule titles.  Register for
+    the ``titleclick`` event to handle clicks.  Note that click events
+    are fired regardless of this value.  If ``false``, no cursor style will
+    be set.  Default is ``false``.
+
+.. describe:: enableDD
+
+    ``Boolean``
+    Allow drag and drop of rules. Default is ``false``.
+
+.. describe:: labelCls
+
+    ``String``
+    Optional css class to use for the layer title labels.
+
+.. describe:: layer
+
+    ``OpenLayers.Layer.Vector``
+    The layer that this legend will be based on.  One of ``layer``,
+    ``rules``, or ``layerRecord`` must be specified in the config.
+
+.. describe:: layerRecord
+
+    :class:`GeoExt.data.LayerRecord`
+    The record containing a vector layer that this legend will be based on.
+    One of ``layerRecord``, ``layer``,  or ``rules`` must be specified in
+    the config.
+
+.. describe:: legendTitle
+
+    ``String``
+    Optional title to be displayed instead of the layer title.  If this is
+    set, the value of ``showTitle`` will be ignored (assumed to be true).
+
+.. describe:: rules
+
+    ``Array(OpenLayers.Rule)``
+     List of rules.  One of ``rules``, ``layer``, or ``layerRecord`` must be
+     specified in the config.  The ``symbolType`` property must also be
+     provided if only ``rules`` are given in the config.
+
+.. describe:: selectOnClick
+
+    ``Boolean``
+    Set to true if a rule should be selected by clicking on the
+    symbol or title. Selection will trigger the ruleselected event, and
+    a click on a selected rule will unselect it and trigger the
+    ``ruleunselected`` event. Default is ``false``.
+
+.. describe:: showTitle
+
+    ``Boolean``
+    Whether or not to show the title of a layer. This can be overridden
+    on the LayerStore record using the hideTitle property.
+
+.. describe:: symbolType
+
+    ``String``
+    The symbol type for legend swatches.  Must be one of ``"Point"``,
+    ``"Line"``, or ``"Polygon"``.  If not provided, the ``layer`` or
+    ``layerRecord`` config property must be specified, and the geometry type
+    of the first feature found on the layer will be used. If a rule does
+    not have a symbolizer for ``symbolType``, we look at the symbolizers
+    for the rule, and see if it has a ``"Point"``, ``"Line"`` or
+    ``"Polygon"`` symbolizer, which we use for rendering a swatch of the
+    respective geometry type.
+
+.. describe:: untitledPrefix
+
+    ``String``
+    The prefix to use as a title for rules with no title or
+    name.  Default is ``"Untitled "``.  Prefix will be appended with a
+    number that corresponds to the index of the rule (1 for first rule).
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. method:: VectorLegend.setCurrentScaleDenominator
+
+    :arg scale: ``Number`` The scale denominator.
+    
+    Set the current scale denominator.  This will hide entries for any
+    rules that don't apply at the current scale.
+
+.. method:: VectorLegend.update
+
+    Update rule titles and symbolizers.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. describe:: ruleclick
+
+    Fires when a rule entry is clicked (fired with symbolizer or
+    title click).
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule that was clicked.
+
+.. describe:: rulemoved
+
+    Fires when a rule is moved.
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule that was moved.
+
+.. describe:: ruleselected
+
+    Fires when a rule is clicked and ``selectOnClick`` is set to
+    ``true``.
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule that was selected.
+
+.. describe:: ruleunselected
+
+    Fires when the selected rule is clicked and ``selectOnClick``
+    is set to ``true``, or when a rule is unselected by selecting a
+    different one.
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule that was unselected.
+
+.. describe:: symbolclick
+
+    Fires when a rule symbolizer is clicked.
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule whose symbol was clicked.
+
+.. describe:: titleclick
+
+    Fires when a rule title is clicked.
+    
+    Listener arguments:
+    
+    * comp - :class:`GeoExt.VectorLegend`` This component.
+    * rule - ``OpenLayers.Rule`` The rule whose title was clicked.
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/FeatureRenderer.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/FeatureRenderer.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/FeatureRenderer.txt	(revision 76)
@@ -0,0 +1,140 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.FeatureRenderer`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_
+    
+
+
+
+xtype
+    ``gx_renderer``
+
+
+
+
+.. class:: FeatureRenderer(config)
+
+    Create a box component for rendering a vector feature.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_.
+
+
+.. describe:: feature
+
+    ``OpenLayers.Feature.Vector``
+    Optional vector to be drawn.  If not provided, and if ``symbolizers``
+    is configured with an array of plain symbolizer objects, ``symbolType``
+    should be configured.
+
+.. describe:: symbolizers
+
+    ``Array(Object)``
+    An array of ``OpenLayers.Symbolizer`` instances or plain symbolizer
+    objects (in painters order) for rendering a  feature.  If no
+    symbolizers are provided, the OpenLayers default will be used. If a
+    symbolizer is an instance of ``OpenLayers.Symbolizer``, its type will
+    override the symbolType for rendering.
+
+.. describe:: symbolType
+
+    ``String``
+    One of ``"Point"``, ``"Line"``, or ``"Polygon"``.  Only pertinent if
+    OpenLayers.Symbolizer objects are not used.  If ``feature``
+    is provided, it will be preferred.  The default is "Polygon".
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_.
+
+
+.. method:: FeatureRenderer.setFeature
+
+    :arg feature: ``OpenLayers.Feature.Vector`` The feature to be rendered.
+        If none is provided, one will be created based on ``symbolType``.
+    :arg options: ``Object``
+    
+    Update the feature and redraw.
+    
+    Valid options:
+    
+    * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+
+.. method:: FeatureRenderer.setSymbolizers
+
+    :arg symbolizers: ``Array(Object)`` An array of symbolizers
+    :arg options: ``Object``
+    
+    Update the symbolizers used to render the feature.
+    
+    Valid options:
+    
+    * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+
+.. method:: FeatureRenderer.setSymbolType
+
+    :arg type: ``String`` One of the ``symbolType`` strings.
+    :arg options: ``Object``
+    
+    Create a new feature based on the geometry type and render it.
+    
+    Valid options:
+    
+    * draw - ``Boolean`` Draw the feature after setting it.  Default is ``true``.
+
+.. method:: FeatureRenderer.update
+
+    :arg options: ``Object`` Object with properties to be updated.
+    
+    Update the ``symbolType`` or ``feature`` and ``symbolizer`` and redraw
+    the feature.
+    
+    Valid options:
+    
+    * feature - ``OpenLayers.Feature.Vector`` The new or updated feature.
+        If provided, the feature gets precedence over ``symbolType``.
+    * symbolType - ``String`` One of the allowed ``symbolType`` values.
+    * symbolizers - ``Array(Object)`` An array of symbolizer objects.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.BoxComponent <http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent>`_.
+
+
+.. describe:: click
+
+    Fires when the feature is clicked on.
+    
+    Listener arguments:
+    
+    * renderer - :class:`GeoExt.FeatureRenderer` This feature renderer.
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/WMSLegend.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/WMSLegend.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/WMSLegend.txt	(revision 76)
@@ -0,0 +1,107 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.WMSLegend`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_
+    * :class:`GeoExt.LayerLegend`
+
+
+
+xtype
+    ``gx_wmslegend``
+
+
+
+
+.. class:: WMSLegend(config)
+
+Show a legend image for a WMS layer. The image can be read from the styles
+field of a layer record (if the record comes e.g. from a
+:class:`GeoExt.data.WMSCapabilitiesReader`). If not provided, a
+GetLegendGraphic request will be issued to retrieve the image.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. describe:: baseParams
+
+    ``Object``
+     Optional parameters to add to the legend url, this can e.g. be used to
+     support vendor-specific parameters in a SLD WMS GetLegendGraphic
+     request. To override the default MIME type of image/gif use the
+     FORMAT parameter in baseParams.
+    
+     .. code-block:: javascript
+    
+         var legendPanel = new GeoExt.LegendPanel({
+             map: map,
+             title: 'Legend Panel',
+             defaults: {
+                 style: 'padding:5px',
+                 baseParams: {
+                     FORMAT: 'image/png',
+                     LEGEND_OPTIONS: 'forceLabels:on'
+                 }
+             }
+         });
+
+.. describe:: defaultStyleIsFirst
+
+    ``Boolean``
+    The WMS spec does not say if the first style advertised for a layer in
+    a Capabilities document is the default style that the layer is
+    rendered with. We make this assumption by default. To be strictly WMS
+    compliant, set this to false, but make sure to configure a STYLES
+    param with your WMS layers, otherwise LegendURLs advertised in the
+    GetCapabilities document cannot be used.
+
+.. describe:: labelCls
+
+    ``String``
+    Optional css class to use for the layer title labels.
+
+.. describe:: layerRecord
+
+    :class:`GeoExt.data.LayerRecord`  The layer record for the legend
+
+.. describe:: legendTitle
+
+    ``String``
+    Optional title to be displayed instead of the layer title.  If this is
+    set, the value of ``showTitle`` will be ignored (assumed to be true).
+
+.. describe:: showTitle
+
+    ``Boolean``
+    Whether or not to show the title of a layer. This can be overridden
+    on the LayerStore record using the hideTitle property.
+
+.. describe:: useScaleParameter
+
+    ``Boolean``
+    Should we use the optional SCALE parameter in the SLD WMS
+    GetLegendGraphic request? Defaults to true.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/FormPanel.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/FormPanel.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/FormPanel.txt	(revision 76)
@@ -0,0 +1,116 @@
+
+.. currentmodule:: GeoExt.form
+
+:class:`GeoExt.form.FormPanel`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.form.FormPanel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel>`_
+    
+
+
+
+xtype
+    ``gx_formpanel``
+
+
+
+
+.. class:: FormPanel(config)
+
+    A specific ``Ext.form.FormPanel`` whose internal form is a
+    :class:`GeoExt.form.BasicForm` instead of ``Ext.form.BasicForm``.
+    One would use this form to do search requests through
+    an ``OpenLayers.Protocol`` object (``OpenLayers.Protocol.WFS``
+    for example).
+
+    Look at :class:`GeoExt.form.SearchAction` to understand how
+    form fields must be named for appropriate filters to be
+    passed to the protocol.
+
+
+
+Example Use
+-----------
+
+Sample code showing how to use a GeoExt form panel.
+
+.. code-block:: javascript
+
+    var formPanel = new GeoExt.form.FormPanel({
+        renderTo: "formpanel",
+        protocol: new OpenLayers.Protocol.WFS({
+            url: "http://publicus.opengeo.org/geoserver/wfs",
+            featureType: "tasmania_roads",
+            featureNS: "http://www.openplans.org/topp"
+        }),
+        items: [{
+            xtype: "textfield",
+            name: "name__ilike",
+            value: "mont"
+        }, {
+            xtype: "textfield",
+            name: "elevation__ge",
+            value: "2000"
+        }],
+        listeners: {
+            actioncomplete: function(form, action) {
+                // this listener triggers when the search request
+                // is complete, the OpenLayers.Protocol.Response
+                // resulting from the request is available
+                // in "action.response"
+            }
+        }
+    });
+
+    formPanel.addButton({
+        text: "search",
+        handler: function() {
+            this.search();
+        },
+        scope: formPanel
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.form.FormPanel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel>`_.
+
+
+.. describe:: protocol
+
+    ``OpenLayers.Protocol`` The protocol instance this form panel
+    is configured with, actions resulting from this form
+    will be performed through the protocol.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.form.FormPanel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel>`_.
+
+
+.. method:: FormPanel.search
+
+    :param options: ``Object`` The options passed to the
+        :class:`GeoExt.form.SearchAction` constructor.
+    
+    Shortcut to the internal form's search method.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/SearchAction.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/SearchAction.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/SearchAction.txt	(revision 76)
@@ -0,0 +1,116 @@
+
+.. currentmodule:: GeoExt.form
+
+:class:`GeoExt.form.SearchAction`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.form.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.Action>`_
+    
+
+
+
+
+
+
+.. class:: SearchAction(form, options)
+
+    A specific ``Ext.form.Action`` to be used when using a form to do
+    trigger search requests througn an ``OpenLayers.Protocol``.
+
+    Arguments:
+
+    * form ``Ext.form.BasicForm`` A basic form instance.
+    * options ``Object`` Options passed to the protocol'read method
+          One can add an abortPrevious property to these options, if set
+          to true, the abort method will be called on the protocol if
+          there's a pending request.
+
+    When run this action builds an ``OpenLayers.Filter`` from the form
+    and passes this filter to its protocol's read method. The form fields
+    must be named after a specific convention, so that an appropriate
+    ``OpenLayers.Filter.Comparison`` filter is created for each
+    field.
+
+    For example a field with the name ``foo__like`` would result in an
+    ``OpenLayers.Filter.Comparison`` of type
+    ``OpenLayers.Filter.Comparison.LIKE`` being created.
+
+    Here is the convention:
+
+    * ``<name>__eq: OpenLayers.Filter.Comparison.EQUAL_TO``
+    * ``<name>__ne: OpenLayers.Filter.Comparison.NOT_EQUAL_TO``
+    * ``<name>__lt: OpenLayers.Filter.Comparison.LESS_THAN``
+    * ``<name>__le: OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO``
+    * ``<name>__gt: OpenLayers.Filter.Comparison.GREATER_THAN``
+    * ``<name>__ge: OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO``
+    * ``<name>__like: OpenLayers.Filter.Comparison.LIKE``
+
+    In most cases your would not directly create ``GeoExt.form.SearchAction``
+    objects, but use :class:`GeoExt.form.FormPanel` instead.
+
+
+
+Example Use
+-----------
+
+Sample code showing how to use a GeoExt SearchAction with an Ext form panel:
+
+.. code-block:: javascript
+
+    var formPanel = new Ext.form.Panel({
+        renderTo: "formpanel",
+        items: [{
+            xtype: "textfield",
+            name: "name__like",
+            value: "mont"
+        }, {
+            xtype: "textfield",
+            name: "elevation__ge",
+            value: "2000"
+        }]
+    });
+
+    var searchAction = new GeoExt.form.SearchAction(formPanel.getForm(), {
+        protocol: new OpenLayers.Protocol.WFS({
+            url: "http://publicus.opengeo.org/geoserver/wfs",
+            featureType: "tasmania_roads",
+            featureNS: "http://www.openplans.org/topp"
+        }),
+        abortPrevious: true
+    });
+
+    formPanel.getForm().doAction(searchAction, {
+        callback: function(response) {
+            // response.features includes the features read
+            // from the server through the protocol
+        }
+    });
+
+    
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.form.Action <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.Action>`_.
+
+
+.. attribute:: SearchAction.response
+
+    ``OpenLayers.Protocol.Response`` A reference to the response
+    resulting from the search request. Read-only.
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/BasicForm.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/BasicForm.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/form/BasicForm.txt	(revision 76)
@@ -0,0 +1,66 @@
+
+.. currentmodule:: GeoExt.form
+
+:class:`GeoExt.form.BasicForm`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.form.BasicForm <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm>`_
+    
+
+
+
+
+
+
+.. class:: BasicForm(config)
+
+    A specific ``Ext.form.BasicForm`` whose doAction method creates
+    a :class:`GeoExt.form.SearchAction` if it is passed the string
+    "search" as its first argument.
+
+    In most cases one would not use this class directly, but
+    :class:`GeoExt.form.FormPanel` instead.
+
+
+    
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.form.BasicForm <http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm>`_.
+
+
+.. method:: BasicForm.doAction
+
+    :param action: ``String or Ext.form.Action`` Either the name
+        of the action or a ``Ext.form.Action`` instance.
+    :param options: ``Object`` The options passed to the Action
+        constructor.
+    :return: :class:`GeoExt.form.BasicForm` This form.
+    
+    Performs the action, if the string "search" is passed as the
+    first argument then a :class:`GeoExt.form.SearchAction` is created.
+
+.. method:: BasicForm.search
+
+    :param options: ``Object`` The options passed to the Action
+        constructor.
+    :return: :class:`GeoExt.form.BasicForm` This form.
+    
+    Shortcut to do a search action.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/ZoomSlider.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/ZoomSlider.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/ZoomSlider.txt	(revision 76)
@@ -0,0 +1,128 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.ZoomSlider`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_
+    
+
+
+
+xtype
+    ``gx_zoomslider``
+
+
+
+
+.. class:: ZoomSlider(config)
+
+    Create a slider for controlling a map's zoom level.
+
+
+
+Example Use
+-----------
+
+Sample code to render a slider outside the map viewport:
+
+.. code-block:: javascript
+
+    var slider = new GeoExt.ZoomSlider({
+        renderTo: document.body,
+        width: 200,
+        map: map
+    });
+
+Sample code to add a slider to a map panel:
+
+.. code-block:: javascript
+
+    var panel = new GeoExt.MapPanel({
+        renderTo: document.body,
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        )],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_zoomslider",
+            aggressive: true,
+            vertical: true,
+            height: 100,
+            x: 10,
+            y: 20
+        }]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_.
+
+
+.. describe:: aggressive
+
+    ``Boolean``
+    If set to true, the map is zoomed as soon as the thumb is moved. Otherwise
+    the map is zoomed when the thumb is released (default).
+
+.. describe:: baseCls
+
+    ``String``
+    The CSS class name for the slider elements.  Default is "gx-zoomslider".
+
+.. describe:: map
+
+    ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+    The map that the slider controls.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.Slider <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider>`_.
+
+
+.. method:: ZoomSlider.getResolution
+
+    :return: ``Number`` The map resolution.
+    
+    Get the resolution for the associated map based on the slider value.
+
+.. method:: ZoomSlider.getScale
+
+    :return: ``Number`` The map scale denominator.
+    
+    Get the scale denominator for the associated map based on the slider value.
+
+.. method:: ZoomSlider.getZoom
+
+    :return: ``Number`` The map zoom level.
+    
+    Get the zoom level for the associated map based on the slider value.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerLegend.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerLegend.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/LayerLegend.txt	(revision 76)
@@ -0,0 +1,63 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.LayerLegend`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_
+    
+
+
+
+
+
+
+.. class:: LayerLegend(config)
+
+    Base class for components of :class:`GeoExt.LegendPanel`.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Container <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container>`_.
+
+
+.. describe:: labelCls
+
+    ``String``
+    Optional css class to use for the layer title labels.
+
+.. describe:: layerRecord
+
+    :class:`GeoExt.data.LayerRecord`  The layer record for the legend
+
+.. describe:: legendTitle
+
+    ``String``
+    Optional title to be displayed instead of the layer title.  If this is
+    set, the value of ``showTitle`` will be ignored (assumed to be true).
+
+.. describe:: showTitle
+
+    ``Boolean``
+    Whether or not to show the title of a layer. This can be overridden
+    on the LayerStore record using the hideTitle property.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/MapPanel.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/MapPanel.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/widgets/MapPanel.txt	(revision 76)
@@ -0,0 +1,125 @@
+
+.. currentmodule:: GeoExt
+
+:class:`GeoExt.MapPanel`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_
+    
+
+
+
+xtype
+    ``gx_mappanel``
+
+
+
+
+.. class:: MapPanel(config)
+
+    Create a panel container for a map.
+
+
+
+Example Use
+-----------
+
+Sample code to create a panel with a new map:
+
+.. code-block:: javascript
+
+    var mapPanel = new GeoExt.MapPanel({
+        border: false,
+        renderTo: "div-id",
+        map: {
+            maxExtent: new OpenLayers.Bounds(-90, -45, 90, 45)
+        }
+    });
+
+Sample code to create a map panel with a bottom toolbar in a Window:
+
+.. code-block:: javascript
+
+    var win = new Ext.Window({
+        title: "My Map",
+        items: [{
+            xtype: "gx_mappanel",
+            bbar: new Ext.Toolbar()
+        }]
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. describe:: center
+
+    ``OpenLayers.LonLat or Array(Number)``  A location for the map center.  If
+    an array is provided, the first two items should represent x & y coordinates.
+
+.. describe:: extent
+
+    ``OpenLayers.Bounds or Array(Number)``  An initial extent for the map (used
+    if center and zoom are not provided.  If an array, the first four items
+    should be minx, miny, maxx, maxy.
+
+.. describe:: layers
+
+    ``GeoExt.data.LayerStore or GeoExt.data.GroupingStore or Array(OpenLayers.Layer)``
+    A store holding records. The layers provided here will be added to this
+    MapPanel's map when it is rendered.
+
+.. describe:: map
+
+    ``OpenLayers.Map or Object``  A configured map or a configuration object
+    for the map constructor.  A configured map will be available after
+    construction through the :attr:`map` property.
+
+.. describe:: prettyStateKeys
+
+    ``Boolean`` Set this to true if you want pretty strings in the MapPanel's
+    state keys. More specifically, layer.name instead of layer.id will be used
+    in the state keys if this option is set to true. But in that case you have
+    to make sure you don't have two layers with the same name. Defaults to
+    false.
+
+.. describe:: zoom
+
+    ``Number``  An initial zoom level for the map.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.Panel <http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel>`_.
+
+
+.. attribute:: MapPanel.layers
+
+    :class:`GeoExt.data.LayerStore`  A store containing
+    :class:`GeoExt.data.LayerRecord` objects.
+
+.. attribute:: MapPanel.map
+
+    ``OpenLayers.Map`` or ``Object``  A map or map configuration.
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data.txt	(revision 76)
@@ -0,0 +1,14 @@
+.. module:: GeoExt.data
+    :synopsis: A collection of map data related classes.
+
+:mod:`GeoExt.data`
+==================
+
+The :mod:`GeoExt.data` module contains classes that extend map related
+functionality to ``Ext.data`` classes.
+
+.. toctree::
+   :maxdepth: 1
+   :glob:
+   
+   data/*
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ProtocolProxy.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ProtocolProxy.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ProtocolProxy.txt	(revision 76)
@@ -0,0 +1,58 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.ProtocolProxy`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataProxy <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy>`_
+    
+
+
+
+
+
+
+.. class:: ProtocolProxy
+
+    A data proxy for use with ``OpenLayers.Protocol`` objects.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.DataProxy <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy>`_.
+
+
+.. describe:: abortPrevious
+
+    ``Boolean``
+    Abort any previous request before issuing another.  Default is ``true``.
+
+.. describe:: protocol
+
+    ``OpenLayers.Protocol``
+    The protocol used to fetch features.
+
+.. describe:: setParamsAsOptions
+
+    ``Boolean``
+    Should options.params be set directly on options before passing it into
+    the protocol's read method? Default is ``false``.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesReader.txt	(revision 76)
@@ -0,0 +1,66 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WMSCapabilitiesReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: WMSCapabilitiesReader(meta, recordType)
+
+    :param meta: ``Object`` Reader configuration from which:
+        ``layerOptions`` is an optional object passed as default options
+        to the ``OpenLayers.Layer.WMS`` constructor.
+        ``layerParams`` is an optional set of parameters to pass into the
+        ``OpenLayers.Layer.WMS`` constructor.
+    :param recordType: ``Array | Ext.data.Record`` An array of field
+        configuration objects or a record object.  Default is
+        :class:`GeoExt.data.LayerRecord` with the following fields:
+        name, title, abstract, queryable, opaque, noSubsets, cascaded,
+        fixedWidth, fixedHeight, minScale, maxScale, prefix, formats,
+        styles, srs, dimensions, bbox, llbbox, attribution, keywords,
+        identifiers, authorityURLs, metadataURLs.
+        The type of these fields is the same as for the matching fields in
+        the object returned from
+        ``OpenLayers.Format.WMSCapabilities::read()``.
+
+    Data reader class to create an array of
+    :class:`GeoExt.data.LayerRecord` objects from a WMS GetCapabilities
+    response.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_.
+
+
+.. describe:: attributionCls
+
+    ``String`` CSS class name for the attribution DOM elements.
+    Element class names append "-link", "-image", and "-title" as
+    appropriate.  Default is "gx-attribution".
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ScaleStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ScaleStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/ScaleStore.txt	(revision 76)
@@ -0,0 +1,79 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.ScaleStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: ScaleStore
+
+    A store that contains a cache of available zoom levels.  The store can
+    optionally be kept synchronized with an ``OpenLayers.Map`` or
+    :class:`GeoExt.MapPanel` object.
+
+    Records have the following fields:
+
+    * level - ``Number``  The zoom level.
+    * scale - ``Number`` The scale denominator.
+    * resolution - ``Number`` The map units per pixel.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: map
+
+    ``OpenLayers.Map`` or :class:`GeoExt.MapPanel`
+    Optional map or map panel from which to derive scale values.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. method:: ScaleStore.bind
+
+    :param map: :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` Panel or map
+        to which we should bind.
+    
+    Bind this store to a map; that is, maintain the zoom list in sync with
+    the map's current configuration.  If the map does not currently have a
+    set scale list, then the store will remain empty until the map is
+    configured with one.
+
+.. method:: ScaleStore.unbind
+
+    Un-bind this store from the map to which it is currently bound.  The
+    currently stored zoom levels will remain, but no further changes from
+    the map will affect it.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintProvider.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintProvider.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintProvider.txt	(revision 76)
@@ -0,0 +1,340 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.PrintProvider`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+
+
+.. class:: PrintProvider
+
+Provides an interface to a Mapfish or GeoServer print module. For printing,
+one or more instances of :class:`GeoExt.data.PrintPage` are also required
+to tell the PrintProvider about the scale and extent (and optionally
+rotation) of the page(s) we want to print.
+
+
+
+Example Use
+-----------
+
+Minimal code to print as much of the current map extent as possible as
+soon as the print service capabilities are loaded, using the first layout
+reported by the print service:
+
+.. code-block:: javascript
+
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        layers: [new OpenLayers.Layer.WMS("wms", "/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"})],
+        center: [146.56, -41.56],
+        zoom: 7
+    });
+    var printProvider = new GeoExt.data.PrintProvider({
+        url: "/geoserver/pdf",
+        listeners: {
+            "loadcapabilities": function() {
+                var printPage = new GeoExt.data.PrintPage({
+                    printProvider: printProvider
+                });
+                printPage.fit(mapPanel, true);
+                printProvider.print(mapPanel, printPage);
+            }
+        }
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: autoLoad
+
+    ``Boolean`` If set to true, the capabilities will be loaded upon
+    instance creation, and ``loadCapabilities`` does not need to be called
+    manually. Setting this when ``capabilities`` and no ``url`` is provided
+    has no effect. Default is false.
+
+.. describe:: baseParams
+
+    ``Object`` Key-value pairs of base params to be add to every
+    request to the service. Optional.
+
+.. describe:: capabilities
+
+    ``Object`` Capabilities of the print service. Only required if ``url``
+    is not provided. This is the object returned by the ``info.json``
+    endpoint of the print service, and is usually obtained by including a
+    script tag pointing to
+    http://path/to/printservice/info.json?var=myvar in the head of the
+    html document, making the capabilities accessible as ``window.myvar``.
+    This property should be used when no local print service or proxy is
+    available, or when you do not listen for the ``loadcapabilities``
+    events before creating components that require the PrintProvider's
+    capabilities to be available.
+
+.. describe:: customParams
+
+    ``Object`` Key-value pairs of custom data to be sent to the print
+    service. Optional. This is e.g. useful for complex layout definitions
+    on the server side that require additional parameters.
+
+.. describe:: method
+
+    ``String`` Either ``POST`` or ``GET`` (case-sensitive). Method to use
+    when sending print requests to the servlet. If the print service is at
+    the same origin as the application (or accessible via proxy), then
+    ``POST`` is recommended. Use ``GET`` when accessing a remote print
+    service with no proxy available, but expect issues with character
+    encoding and URLs exceeding the maximum length. Default is ``POST``.
+
+.. describe:: url
+
+    ``String`` Base url of the print service. Only required if
+    ``capabilities`` is not provided. This
+    is usually something like http://path/to/mapfish/print for Mapfish,
+    and http://path/to/geoserver/pdf for GeoServer with the printing
+    extension installed. This property requires that the print service is
+    at the same origin as the application (or accessible via proxy).
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. attribute:: PrintProvider.customParams
+
+    ``Object`` Key-value pairs of custom data to be sent to the print
+    service. Optional. This is e.g. useful for complex layout definitions
+    on the server side that require additional parameters.
+
+.. attribute:: PrintProvider.dpi
+
+    ``Ext.data.Record`` the record for the currently used resolution.
+    Read-only, use ``setDpi`` to set the value.
+
+.. attribute:: PrintProvider.dpis
+
+    ``Ext.data.JsonStore`` read-only. A store representing the dpis
+    available.
+    
+    Fields of records in this store:
+    
+    * name - ``String`` the name of the dpi
+    * value - ``Float`` the dots per inch
+
+.. attribute:: PrintProvider.layout
+
+    ``Ext.data.Record`` the record of the currently used layout. Read-only,
+    use ``setLayout`` to set the value.
+
+.. attribute:: PrintProvider.layouts
+
+    ``Ext.data.JsonStore`` read-only. A store representing the layouts
+    available.
+    
+    Fields of records in this store:
+    
+    * name - ``String`` the name of the layout
+    * size - ``Object`` width and height of the map in points
+    * rotation - ``Boolean`` indicates if rotation is supported
+
+.. attribute:: PrintProvider.scales
+
+    ``Ext.data.JsonStore`` read-only. A store representing the scales
+    available.
+    
+    Fields of records in this store:
+    
+    * name - ``String`` the name of the scale
+    * value - ``Float`` the scale denominator
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. method:: PrintProvider.loadCapabilities
+
+    Loads the capabilities from the print service. If this instance is
+    configured with either ``capabilities`` or a ``url`` and ``autoLoad``
+    set to true, then this method does not need to be called from the
+    application.
+
+.. method:: PrintProvider.print
+
+    :param map: ``GeoExt.MapPanel`` or ``OpenLayers.Map`` The map to print.
+    :param pages: ``Array`` of :class:`GeoExt.data.PrintPage` or
+        :class:`GeoExt.data.PrintPage` page(s) to print.
+    :param options: ``Object`` of additional options, see below.
+    
+    Sends the print command to the print service and opens a new window
+    with the resulting PDF.
+    
+    Valid properties for the ``options`` argument:
+    
+        * ``legend`` - :class:`GeoExt.LegendPanel` If provided, the legend
+          will be added to the print document. For the printed result to
+          look like the LegendPanel, the following ``!legends`` block
+          should be included in the ``items`` of your page layout in the
+          print module's configuration file:
+    
+          .. code-block:: none
+    
+            - !legends
+                maxIconWidth: 0
+                maxIconHeight: 0
+                classIndentation: 0
+                layerSpace: 5
+                layerFontSize: 10
+    
+        * ``overview`` - :class:`OpenLayers.Control.OverviewMap` If provided,
+          the layers for the overview map in the printout will be taken from
+          the OverviewMap control. If not provided, the print service will
+          use the main map's layers for the overview map. Applies only for
+          layouts configured to print an overview map.
+
+.. method:: PrintProvider.setDpi
+
+    :param dpi: ``Ext.data.Record`` the dpi record.
+    
+    Sets the dpi for this printProvider.
+
+.. method:: PrintProvider.setLayout
+
+    :param layout: ``Ext.data.Record`` the record of the layout.
+    
+    Sets the layout for this printProvider.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: beforeencodelayer
+
+    Triggered before a layer is encoded. This can be used to
+    exclude layers from the printing, by having the listener
+    return false.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * layer - ``OpenLayers.Layer`` the layer which is about to be
+      encoded.
+
+.. describe:: beforeprint
+
+    Triggered when the print method is called.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * map - ``OpenLayers.Map`` the map being printed
+    * pages - Array of :class:`GeoExt.data.PrintPage` the print
+      pages being printed
+    * options - ``Object`` the options to the print command
+
+.. describe:: dpichange
+
+    Triggered when the dpi value is changed.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * dpi - ``Ext.data.Record`` the new dpi record
+
+.. describe:: encodelayer
+
+    Triggered when a layer is encoded. This can be used to modify
+    the encoded low-level layer object that will be sent to the
+    print service.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * layer - ``OpenLayers.Layer`` the layer which is about to be
+      encoded.
+    * encodedLayer - ``Object`` the encoded layer that will be
+      sent to the print service.
+
+.. describe:: layoutchange
+
+    Triggered when the layout is changed.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * layout - ``Ext.data.Record`` the new layout
+
+.. describe:: loadcapabilities
+
+    Triggered when the capabilities have finished loading. This
+    event will only fire when ``capabilities`` is not  configured.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * capabilities - ``Object`` the capabilities
+
+.. describe:: print
+
+    Triggered when the print document is opened.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * url - ``String`` the url of the print document
+
+.. describe:: printexception
+
+    Triggered when using the ``POST`` method, when the print
+    backend returns an exception.
+    
+    Listener arguments:
+    
+    * printProvider - :class:`GeoExt.data.PrintProvider` this
+      PrintProvider
+    * response - ``Object`` the response object of the XHR
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureStore.txt	(revision 76)
@@ -0,0 +1,110 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.FeatureStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: FeatureStore
+
+    A store containing :class:`GeoExt.data.FeatureRecord` entries that
+    optionally synchronizes with an ``OpenLayers.Layer.Vector``.
+
+
+
+Example Use
+-----------
+
+Sample code to create a store with features from a vector layer:
+
+.. code-block:: javascript
+
+    var store = new GeoExt.data.FeatureStore({
+        layer: myLayer,
+        features: myFeatures
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: featureFilter
+
+    ``OpenLayers.Filter`` This filter is evaluated before a feature
+    record is added to the store.
+
+.. describe:: features
+
+    ``Array(OpenLayers.Feature.Vector)``  Features that will be added to the
+    store (and the layer if provided).
+
+.. describe:: initDir
+
+    ``Number``  Bitfields specifying the direction to use for the
+    initial sync between the layer and the store, if set to 0 then no
+    initial sync is done. Default is
+    ``GeoExt.data.FeatureStore.LAYER_TO_STORE|GeoExt.data.FeatureStore.STORE_TO_LAYER``.
+
+.. describe:: layer
+
+    ``OpenLayers.Layer.Vector``  Layer to synchronize the store with.
+
+.. describe:: reader
+
+    ``Ext.data.DataReader`` The reader used to produce records from objects
+    features.  Default is :class:`GeoExt.data.FeatureReader`.
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. method:: FeatureStore.bind
+
+    :param layer: ``OpenLayers.Layer`` Layer that the store should be
+        synchronized with.
+    
+    Bind this store to a layer instance, once bound the store
+    is synchronized with the layer and vice-versa.
+
+.. method:: FeatureStore.getRecordFromFeature
+
+    :arg feature: ``OpenLayers.Vector.Feature``
+    :returns: :class:`GeoExt.data.FeatureRecord` The record corresponding
+        to the given feature.  Returns null if no record matches.
+    
+    Get the record corresponding to a feature.
+
+.. method:: FeatureStore.unbind
+
+    Unbind this store from the layer it is currently bound.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMCReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMCReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMCReader.txt	(revision 76)
@@ -0,0 +1,41 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WMCReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: WMCReader(meta, recordType)
+
+    :param meta: ``Object`` Reader configuration.
+    :param recordType: ``Array | Ext.data.Record`` An array of field
+        configuration objects or a record object.  Default is
+        :class:`GeoExt.data.LayerRecord`.
+
+    Data reader class to create an array of
+    :class:`GeoExt.data.LayerRecord` objects from a WMS GetCapabilities
+    response.
+
+
+    
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerRecord.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerRecord.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerRecord.txt	(revision 76)
@@ -0,0 +1,82 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.LayerRecord`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_
+    
+
+
+
+
+
+
+.. class:: LayerRecord
+
+    A record that represents an ``OpenLayers.Layer``. This record
+    will always have at least the following fields:
+
+    * title ``String``
+
+
+    
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_.
+
+
+.. method:: LayerRecord.clone
+
+    :param id: ``String`` (optional) A new Record id.
+    :return: class:`GeoExt.data.LayerRecord` A new layer record.
+    
+    Creates a clone of this LayerRecord.
+
+.. method:: LayerRecord.getLayer
+
+    :return: ``OpenLayers.Layer``
+    
+    Gets the layer for this record.
+
+.. method:: LayerRecord.setLayer
+
+    :param layer: ``OpenLayers.Layer``
+    
+    Sets the layer for this record.
+
+
+
+
+
+
+Class Methods
+-------------
+
+Class methods in addition to static methods
+listed for `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_.
+
+
+.. classmethod:: LayerRecord.create
+
+    :param o: ``Array`` Field definition as in ``Ext.data.Record.create``. Can
+        be omitted if no additional fields are required.
+    :return: ``Function`` A specialized :class:`GeoExt.data.LayerRecord`
+        constructor.
+    
+    Creates a constructor for a :class:`GeoExt.data.LayerRecord`, optionally
+    with additional fields.
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureReader.txt	(revision 76)
@@ -0,0 +1,71 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.FeatureReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: FeatureReader(meta, recordType)
+
+    Data reader class to create an array of
+    :class:`GeoExt.data.FeatureRecord` objects from an
+    ``OpenLayers.Protocol.Response`` object for use in a
+    :class:`GeoExt.data.FeatureStore` object.
+
+
+
+Example Use
+-----------
+
+Typical usage in a store:
+
+.. code-block:: javascript
+
+    var store = new Ext.data.Store({
+        reader: new GeoExt.data.FeatureReader({}, [
+            {name: 'name', type: 'string'},
+            {name: 'elevation', type: 'float'}
+        ])
+    });
+
+
+    
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_.
+
+
+.. method:: FeatureReader.readRecords
+
+    :param features: ``Array(OpenLayers.Feature.Vector)`` List of
+        features for creating records
+    :return: ``Object``  An object with ``records`` and ``totalRecords``
+        properties.
+    
+    Create a data block containing :class:`GeoExt.data.FeatureRecord`
+    objects from an array of features.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeStore.txt	(revision 76)
@@ -0,0 +1,72 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.AttributeStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: AttributeStore(config)
+
+    Small helper class to make creating stores for remotely-loaded attributes
+    data easier. AttributeStore is pre-configured with a built-in
+    ``Ext.data.HttpProxy`` and :class:`GeoExt.data.AttributeReader`.  The
+    HttpProxy is configured to allow caching (disableCaching: false) and
+    uses GET. If you require some other proxy/reader combination then you'll
+    have to configure this with your own proxy or create a basic
+    ``Ext.data.Store`` and configure as needed.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: feature
+
+    ``OpenLayers.Feature.Vector``
+    A vector feature. If provided, and if the reader is a
+    :class:`GeoExt.data.AttributeReader` (the default), then records
+    of this store will include a field named "value" referencing the
+    corresponding attribute value in the feature. And if the "value"
+    field of a record is updated the update will propagate to the
+    corresponding feature attribute. Optional.
+
+.. describe:: fields
+
+    ``Array or Function``
+    Either an array of field definition objects as passed to
+    ``Ext.data.Record.create``, or a record constructor created using
+    ``Ext.data.Record.create``.  Defaults to ``["name", "type", "restriction"]``.
+
+.. describe:: format
+
+    ``OpenLayers.Format``
+    A parser for transforming the XHR response into an array of objects
+    representing attributes.  Defaults to an
+    ``OpenLayers.Format.WFSDescribeFeatureType`` parser.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerStore.txt	(revision 76)
@@ -0,0 +1,62 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WMSDescribeLayerStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: WMSDescribeLayerStore
+
+    Small helper class to make creating stores for remote WMS layer description
+    easier.  The store is pre-configured with a built-in
+    ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WMSDescribeLayerReader`.
+    The proxy is configured to allow caching and issues requests via GET.
+    If you require some other proxy/reader combination then you'll have to
+    configure this with your own proxy or create a basic
+    store and configure as needed.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: fields
+
+    ``Array | Function``
+    Either an Array of field definition objects as passed to
+    ``Ext.data.Record.create``, or a record constructor created using
+    ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``.
+
+.. describe:: format
+
+    ``OpenLayers.Format``
+    A parser for transforming the XHR response into an array of objects
+    representing attributes.  Defaults to an ``OpenLayers.Format.WMSDescribeLayer``
+    parser.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/AttributeReader.txt	(revision 76)
@@ -0,0 +1,49 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.AttributeReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: AttributeReader(meta, recordType)
+
+    :arg meta: ``Object`` Reader configuration.
+    :arg recordType: ``Array or Ext.data.Record`` An array of field
+        configuration objects or a record object.
+
+    Create a new attributes reader object.
+
+    Valid meta properties:
+
+    * format - ``OpenLayers.Format`` A parser for transforming the XHR response
+      into an array of objects representing attributes.  Defaults to
+      an ``OpenLayers.Format.WFSDescribeFeatureType`` parser.
+    * ignore - ``Object`` Properties of the ignore object should be field names.
+      Values are either arrays or regular expressions.
+    * feature - ``OpenLayers.Feature.Vector`` A vector feature. If provided
+      records created by the reader will include a field named "value"
+      referencing the attribute value as set in the feature.
+
+
+    
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesStore.txt	(revision 76)
@@ -0,0 +1,62 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WFSCapabilitiesStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: WFSCapabilitiesStore
+
+    Small helper class to make creating stores for remote WFS layer data
+    easier.  The store is pre-configured with a built-in
+    ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WFSCapabilitiesReader`.
+    The proxy is configured to allow caching and issues requests via GET.
+    If you require some other proxy/reader combination then you'll have to
+    configure this with your own proxy or create a basic
+    :class:`GeoExt.data.LayerStore` and configure as needed.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: fields
+
+    ``Array | Function``
+    Either an Array of field definition objects as passed to
+    ``Ext.data.Record.create``, or a record constructor created using
+    ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``.
+
+.. describe:: format
+
+    ``OpenLayers.Format``
+    A parser for transforming the XHR response into an array of objects
+    representing attributes.  Defaults to an ``OpenLayers.Format.WFSCapabilities``
+    parser.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSDescribeLayerReader.txt	(revision 76)
@@ -0,0 +1,41 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WMSDescribeLayerReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: WMSDescribeLayerReader(meta, recordType)
+
+    :param meta: ``Object`` Reader configuration.
+    :param recordType: ``Array | Ext.data.Record`` An array of field
+        configuration objects or a record object.  Default has
+        fields for owsType, owsURL, and typeName.
+
+    Data reader class to create an array of
+    layer description objects from a WMS DescribeLayer
+    response.
+
+
+    
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerStore.txt	(revision 76)
@@ -0,0 +1,107 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.LayerStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: LayerStore
+
+    A store that contains a cache of :class:`GeoExt.data.LayerRecord`
+    objects.
+
+
+
+Example Use
+-----------
+
+Sample to create a new store containing a cache of
+:class:`GeoExt.data.LayerRecord` instances derived from map layers.
+
+.. code-block:: javascript
+
+    var store = new GeoExt.data.LayerStore({
+        map: myMap,
+        layers: myLayers
+    });
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: fields
+
+    ``Array``
+    If provided a custom layer record type with additional fields will be
+    used. Default fields for every layer record are `layer`
+    (``OpenLayers.Layer``) `title` (``String``). The value of this option is
+    either a field definition objects as passed to the
+    :meth:`GeoExt.data.LayerRecord.create` function or a
+    :class:`GeoExt.data.LayerRecord` constructor created using
+    :meth:`GeoExt.data.LayerRecord.create`.
+
+.. describe:: initDir
+
+    ``Number``
+    Bitfields specifying the direction to use for the initial sync between
+    the map and the store, if set to 0 then no initial sync is done.
+    Defaults to ``GeoExt.data.LayerStore.MAP_TO_STORE|GeoExt.data.LayerStore.STORE_TO_MAP``
+
+.. describe:: layers
+
+    ``Array(OpenLayers.Layer)``
+    Layers that will be added to the store (and the map, depending on the
+    value of the ``initDir`` option.
+
+.. describe:: map
+
+    ``OpenLayers.Map``
+    Map that this store will be in sync with. If not provided, the
+    store will not be bound to a map.
+
+.. describe:: reader
+
+    ``Ext.data.DataReader`` The reader used to produce
+    :class:`GeoExt.data.LayerRecord` objects from ``OpenLayers.Layer``
+    objects.  If not provided, a :class:`GeoExt.data.LayerReader` will be
+    used.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. attribute:: LayerStore.map
+
+    ``OpenLayers.Map``
+    Map that the store is synchronized with, if any.
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintPage.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintPage.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/PrintPage.txt	(revision 76)
@@ -0,0 +1,166 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.PrintPage`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_
+    
+
+
+
+
+
+
+.. class:: PrintPage
+
+Provides a representation of a print page for
+:class:`GeoExt.data.PrintProvider`. The extent of the page is stored as
+``OpenLayers.Feature.Vector``. Widgets can use this to display the print
+extent on the map.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: customParams
+
+    ``Object`` Key-value pairs of additional parameters that the
+    printProvider will send to the print service for this page.
+
+.. describe:: printProvider
+
+    :class:`GeoExt.data.PrintProvider` The print provider to use with
+    this page.
+
+
+
+
+Public Properties
+-----------------
+
+Public properties in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. attribute:: PrintPage.center
+
+    ``OpenLayers.LonLat`` The current center of the page. Read-only.
+
+.. attribute:: PrintPage.customParams
+
+    ``Object`` Key-value pairs of additional parameters that the
+    printProvider will send to the print service for this page.
+
+.. attribute:: PrintPage.feature
+
+    ``OpenLayers.Feature.Vector`` Feature representing the page extent. To
+    get the extent of the print page for a specific map, use
+    ``getPrintExtent``.
+    Read-only.
+
+.. attribute:: PrintPage.rotation
+
+    ``Float`` The current rotation of the page. Read-only.
+
+.. attribute:: PrintPage.scale
+
+    ``Ext.data.Record`` The current scale record of the page. Read-only.
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. method:: PrintPage.fit
+
+    :param fitTo: :class:`GeoExt.MapPanel` or ``OpenLayers.Map`` or ``OpenLayers.Feature.Vector``
+        The map or feature to fit the page to.
+    :param options: ``Object`` Additional options to determine how to fit
+    
+    Fits the page layout to a map or feature extent. If the map extent has
+    not been centered yet, this will do nothing.
+    
+    Available options:
+    
+    * mode - ``String`` How to calculate the print extent? If "closest",
+      the closest matching print extent will be chosen. If "printer", the
+      chosen print extent will be the closest one that can show the entire
+      ``fitTo`` extent on the printer. If "screen", it will be the closest
+      one that is entirely visible inside the ``fitTo`` extent. Default is
+      "printer".
+    
+
+.. method:: PrintPage.getPrintExtent
+
+    :param map: ``OpenLayers.Map`` or :class:`GeoExt.MapPanel` the map to
+        get the print extent for.
+    :returns: ``OpenLayers.Bounds``
+    
+    Gets this page's print extent for the provided map.
+
+.. method:: PrintPage.setCenter
+
+    :param center: ``OpenLayers.LonLat`` The new center.
+    
+    Moves the page extent to a new center.
+
+.. method:: PrintPage.setRotation
+
+    :param rotation: ``Float`` The new rotation.
+    :param force: ``Boolean`` If set to true, the rotation will also be
+        set when the layout does not support it. Default is false.
+    
+    Sets a new rotation for the page geometry.
+
+.. method:: PrintPage.setScale
+
+    :param scale: ``Ext.data.Record`` The new scale record.
+    :param units: ``String`` map units to use for the scale calculation.
+        Optional if the ``feature`` is on a layer which is added to a map.
+        If not found, "dd" will be assumed.
+    
+    Updates the page geometry to match a given scale. Since this takes the
+    current layout of the printProvider into account, this can be used to
+    update the page geometry feature when the layout has changed.
+
+
+
+
+Events
+------
+
+Events in addition to those
+listed for `Ext.util.Observable <http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable>`_.
+
+
+.. describe:: change
+
+    Triggered when any of the page properties have changed
+    
+    Listener arguments:
+    
+    * printPage - :class:`GeoExt.data.PrintPage` this printPage
+    * modifications - ``Object`` Object with one or more of
+        ``scale``, ``center`` and ``rotation``, notifying
+        listeners of the changed properties.
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureRecord.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureRecord.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/FeatureRecord.txt	(revision 76)
@@ -0,0 +1,77 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.FeatureRecord`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_
+    
+
+
+
+
+
+
+.. class:: FeatureRecord
+
+    A record that represents an ``OpenLayers.Feature.Vector``. This record
+    will always have at least the following fields:
+
+    * state ``String``
+    * fid ``String``
+
+
+
+    
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_.
+
+
+.. method:: FeatureRecord.getFeature
+
+    :return: ``OpenLayers.Feature.Vector``
+    
+    Gets the feature for this record.
+
+.. method:: FeatureRecord.setLayer
+
+    :param layer: ``OpenLayers.Feature.Vector``
+    
+    Sets the feature for this record.
+
+
+
+
+
+
+Class Methods
+-------------
+
+Class methods in addition to static methods
+listed for `Ext.data.Record <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record>`_.
+
+
+.. classmethod:: FeatureRecord.create
+
+    :param o: ``Array`` Field definition as in ``Ext.data.Record.create``. Can
+        be omitted if no additional fields are required.
+    :return: ``Function`` A specialized :class:`GeoExt.data.FeatureRecord`
+        constructor.
+    
+    Creates a constructor for a :class:`GeoExt.data.FeatureRecord`, optionally
+    with additional fields.
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WFSCapabilitiesReader.txt	(revision 76)
@@ -0,0 +1,41 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WFSCapabilitiesReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: WFSCapabilitiesReader(meta, recordType)
+
+    :param meta: ``Object`` Reader configuration.
+    :param recordType: ``Array | Ext.data.Record`` An array of field
+        configuration objects or a record object.  Default is
+        :class:`GeoExt.data.LayerRecord`.
+
+    Data reader class to create an array of
+    :class:`GeoExt.data.LayerRecord` objects from a WFS GetCapabilities
+    response.
+
+
+    
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesStore.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesStore.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/WMSCapabilitiesStore.txt	(revision 76)
@@ -0,0 +1,62 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.WMSCapabilitiesStore`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_
+    
+
+
+
+
+
+
+.. class:: WMSCapabilitiesStore
+
+    Small helper class to make creating stores for remote WMS layer data
+    easier.  The store is pre-configured with a built-in
+    ``Ext.data.HttpProxy`` and :class:`GeoExt.data.WMSCapabilitiesReader`.
+    The proxy is configured to allow caching and issues requests via GET.
+    If you require some other proxy/reader combination then you'll have to
+    configure this with your own proxy or create a basic
+    :class:`GeoExt.data.LayerStore` and configure as needed.
+
+
+    
+
+
+Config Options
+--------------
+
+Configuration properties in addition to
+those listed for `Ext.data.Store <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store>`_.
+
+
+.. describe:: fields
+
+    ``Array | Function``
+    Either an Array of field definition objects as passed to
+    ``Ext.data.Record.create``, or a record constructor created using
+    ``Ext.data.Record.create``.  Defaults to ``["name", "type"]``.
+
+.. describe:: format
+
+    ``OpenLayers.Format``
+    A parser for transforming the XHR response into an array of objects
+    representing attributes.  Defaults to an ``OpenLayers.Format.WMSCapabilities``
+    parser.
+
+
+
+
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerReader.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerReader.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/data/LayerReader.txt	(revision 76)
@@ -0,0 +1,68 @@
+
+.. currentmodule:: GeoExt.data
+
+:class:`GeoExt.data.LayerReader`
+================================================================================
+
+
+.. cssclass:: meta
+
+
+Extends
+    * `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_
+    
+
+
+
+
+
+
+.. class:: LayerReader(meta, recordType)
+
+    Data reader class to create an array of
+    :class:`GeoExt.data.LayerRecord` objects from an array of
+    ``OpenLayers.Layer`` objects for use in a
+    :class:`GeoExt.data.LayerStore` object.
+
+
+
+Example Use
+-----------
+
+Sample using a reader to create records from an array of layers:
+
+.. code-block:: javascript
+
+    var reader = new GeoExt.data.LayerReader();
+    var layerData = reader.readRecords(map.layers);
+    var numRecords = layerData.totalRecords;
+    var layerRecords = layerData.records;
+
+    
+
+
+
+
+
+
+Public Methods
+--------------
+
+Public methods in addition to those
+listed for `Ext.data.DataReader <http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader>`_.
+
+
+.. method:: LayerReader.readRecords
+
+    :param layers: ``Array(OpenLayers.Layer)`` List of layers for creating
+        records.
+    :return: ``Object``  An object with ``records`` and ``totalRecords``
+        properties.
+    
+    From an array of ``OpenLayers.Layer`` objects create a data block
+    containing :class:`GeoExt.data.LayerRecord` objects.
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/lib/GeoExt/state.txt	(revision 76)
@@ -0,0 +1,14 @@
+.. module:: GeoExt.state
+    :synopsis: State-related functionality.
+
+:mod:`GeoExt.state`
+===================
+
+The :mod:`GeoExt.state` module provides functionality relating to ``Ext.state``, i.e.
+for saving and restoring component states to and from a state provider.
+
+.. toctree::
+   :maxdepth: 1
+   :glob:
+   
+   state/*
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/index.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/index.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/index.txt	(revision 76)
@@ -0,0 +1,61 @@
+===========
+ Tutorials
+===========
+GeoExt tutorials show the library in action.  Basic tutorials help new developers get up and running quickly, while the advanced section includes how-to's on more sophisticated setups.
+
+QuickStart
+==========
+From zero to rich mapping application in 5 minutes!
+
+.. toctree::
+
+    quickstart
+
+Map in a Panel
+==============
+
+GeoExt.MapPanel, dissected.
+
+.. toctree::
+   :maxdepth: 2
+
+   mappanel-tutorial
+
+
+Layer Tree and Map Panel
+========================
+
+Working with OpenLayers layers and the Ext TreePanel
+
+.. toctree::
+   :maxdepth: 2
+
+   layertree-tutorial
+
+
+Configuring map tools
+=====================
+
+Working with OpenLayers Controls and Ext Button to create elements for
+user interaction.
+
+.. toctree::
+   :maxdepth: 2
+
+   control-button-tutorial
+
+Remote features
+===============
+
+Fetching features and displaying in grid. Covers working OpenLayers
+Vector Feature with Ext Store and Grid
+
+.. toctree::
+   :maxdepth: 2
+
+   remote-features-tutorial
+
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/remote-features-tutorial.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/remote-features-tutorial.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/remote-features-tutorial.txt	(revision 76)
@@ -0,0 +1,113 @@
+.. highlight:: javascript
+   :linenothreshold: 4
+
+====================
+Vector Data Tutorial
+====================
+
+Base layers such as OpenStreetMap and Google Maps are generally distributed in
+pre-rendered tiles using file formats such as PNG or JPG. While these are great
+for **displaying** maps, they are not very useful for getting at the data behind
+a map. They don't allow you to provide functionality such as informational
+popups, selection and highlighting of individual features, and editing of data.
+For these, you need to use **vector data**, provided through file formats such
+as KML, GeoJSON, or GML which provide information about each feature on the map,
+rather than just the pixels to put on the screen.
+
+.. note:: Web browsers impose a same origin policy on JavaScript code to protect
+    users from cross-site scripting attacks. This means that if your GeoExt
+    application is hosted on a different host or port from your vector data, you
+    will need to configure a proxy service.
+
+Reading KML
+===========
+
+As an introduction to using vector data in GeoExt, let's create a simple map
+that displays data from a KML. Copy :download:`this sample KML file
+<sundials.kml>` to the same directory with your GeoExt and Ext libraries. Then
+we can load it with some JavaScript::
+
+    var map = new Openlayers.Map();
+    var bluemarble = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    var sundials = new OpenLayers.Layer.Vector("Sundials");
+    map.addLayer(bluemarble);
+    map.addLayer(sundials);
+
+    var store = new GeoExt.data.FeatureStore({
+        layer: sundials,
+        proxy: new GeoExt.data.ProtocolProxy({
+            protocol: new OpenLayers.Protocol.HTTP({
+                url: "sundials.kml",
+                format: new OpenLayers.Format.KML()
+            })
+        }),
+        fields: [
+            {name: 'title', type: 'string'},
+            {name: 'description', type: 'string'}
+        ],
+        autoLoad: true
+    });
+
+    var mapPanel = new GeoExt.MapPanel({
+        title: "Sundials",
+        map: map,
+        renderTo: 'mapPanel',
+        height: 400,
+        width: 600
+    });
+
+Here, we set up a map with two layers. ``bluemarble`` is a WMS layer, which you
+should have seen before in other tutorials. ``sundials`` is a vector layer,
+which handles client-side rendering of vector data.
+
+In **line 10** we initialize a :class:`GeoExt.data.FeatureStore`\ . This class
+functions as a normal ``Ext.data.Store`` to interoperate with ExtJS classes, as
+well as providing the ability to **bind** to an ``OpenLayers.Layer.Vector`` in
+order to display features on a map. In this example, we set up the store
+completely through constructor parameters:
+    
+    ``layer: sundials``
+        tells the store to render features using the ``sundials`` layer. This is
+        equivalent to calling ``store.bind(sundials)`` after initializing the
+        store.
+
+    ``proxy: new GeoExt.data.ProtocolProxy(``
+        tells the store to use a ``ProtocolProxy`` for fetching features.
+        ``ProtocolProxy`` wraps OpenLayers Protocol objects. Here we use an
+        ``OpenLayers.Protocol.HTTP`` to fetch data over the web. The ``HTTP``
+        protocol works with a variety of ``OpenLayers.Format`` types; here we
+        use ``KML`` to match our dataset. You can see all the available
+        ``Protocol``\ s and ``Format``\ s in the `OpenLayers API documentation
+        <http://openlayers.org>`_.
+
+    ``fields: [...]``
+        tells the store which extra properties (aside from just the geometry) to
+        look for. Here, we know that KML includes a ``title`` and a
+        ``description`` for each point, and that both are string values.
+
+    ``autoLoad: true``
+        tells the store to go ahead and fetch the feature data as soon as the
+        constructor finishes. This is equivalent to calling ``store.load()``
+        after the store is initialized.
+
+Now we have a map with a background and some data hosted on our server. It looks
+like any other map; we can pan and zoom normally to navigate around.
+
+However, since GeoExt has access to the data *behind* the map, we now have some
+options that weren't available to us before. For example, we can add a control
+that allows us to view the features in a tabular format::
+    
+    new Ext.grid.GridPanel({
+        title: 'Sundials',
+        store: store
+        columns: [{heading: 'Title', dataIndex: 'title'},
+                  {heading: 'Description', dataIndex: 'description'}],
+        renderTo: "grid",
+        width: 200,
+        height: 600
+    });
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/control-button-tutorial.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/control-button-tutorial.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/control-button-tutorial.txt	(revision 76)
@@ -0,0 +1,129 @@
+.. highlight:: javascript
+
+============================
+Map Tool Tutorial
+============================
+
+Okay, so now you know how to :doc:`add a map to a web page <mappanel-tutorial>`
+and load some data into it. Your users can drag and zoom to their hearts'
+content. You even followed the :doc:`layertree-tutorial` so they could switch
+between different datasets. (You did follow that tutorial, right?) But now you
+want to do more than just view some pretty pictures. You want to let your users
+analyze data, or get more info about particular features on your map, or just
+draw things. Basically, you want to give them some **tools**\ .
+
+.. note:: This tutorial makes heavy use of the OpenLayers mapping library.  If
+    you're not familiar with it, you might want to take a look at the
+    :doc:`/primers/openlayers-primer` before moving forward.
+
+OpenLayers Controls
+===================
+
+In `OpenLayers <http://openlayers.org/>`_\ , these tools for interacting with a
+map are called ``Controls``\ . For the purposes of this tutorial, we'll just
+stick to the ``Measure`` control, a handy little tool that lets you draw a line
+on the map and tells you its length in real-world units.
+
+.. seealso:: The OpenLayer API documentation for a comprehensive listing of standard controls.
+
+ExtJS Buttons
+=============
+
+While OpenLayers ``Control``\ s provide a number of excellent ways of
+interacting with maps, they have only limited support for actually manipulating
+the controls; ie, choosing which tool to use and providing user feedback about
+which tool is active. ExtJS provides a richer array of options for managing
+tools. Here is the idiomatic way to create an ``Ext.Button`` which activates and
+deactivates an OpenLayers ``Control``\ , and stays depressed while the control
+is active::
+    
+    var control = new OpenLayers.Control.Measure(OpenLayers.Handler.Path, {
+        eventListeners: {
+            measure: function(evt) {
+                alert("The measurement was " + evt.measure + evt.units);
+            }
+        }
+    });
+
+    mapPanel.map.addControl(control);
+    var button = new Ext.Button({
+        text: 'Measure Things',
+        enableToggle: true,
+        handler: function(toggled){
+            if (toggled) {
+                control.activate();
+            } else {
+                control.deactivate();
+            }
+        }
+    });
+
+The ``Button`` can be added to an ExtJS toolbar or to a panel, in whatever
+layout we choose. For example, you could add the button to a ``MapPanel``\ 's
+top toolbar::
+
+    mapPanel.getTopToolbar().addButton(button);
+   
+
+There Can Be Only One
+=====================
+
+In general, when you have multiple tools associated with a map, you want to
+avoid having more than one tool active at the same time. It would be somewhat
+confusing if the user starts deleting data while he or she is trying to find the
+distance from one end of town to the other! Fortunately, ExtJS makes it very
+simple to ensure that only one toggle button from a group is toggled at a time,
+through the ``toggleGroup`` property of the ``Button`` object. This is a string
+identifying a group of buttons, only one of which can be pressed at a time.
+Let's extend our example from before, this time adding the option to measure
+area instead of length::
+    
+    var length = new OpenLayers.Control.Measure(OpenLayers.Handler.Path, {
+        eventListeners: {
+            measure: function(evt) {
+                alert("The length was " + evt.measure + evt.units);
+            }
+        }
+    });
+
+    var area = new OpenLayers.Control.Measure(OpenLayers.Handler.Polygon, {
+        eventListeners: {
+            measure: function(evt) {
+                alert("The area was " + evt.measure + evt.units);
+            }
+        }
+    });
+
+    mapPanel.map.addControl(length);
+    mapPanel.map.addControl(area);
+
+    var toggleGroup = "measure controls";
+
+    var lengthButton = new Ext.Button({
+        text: 'Measure Length',
+        enableToggle: true,
+        toggleGroup: toggleGroup,
+        handler: function(toggled){
+            if (toggled) {
+                length.activate();
+            } else {
+                length.deactivate();
+            }
+        }
+    });
+
+    var area = new Ext.Button({
+        text: 'Measure Area',
+        enableToggle: true,
+        toggleGroup: toggleGroup,
+        handler: function(toggled){
+            if (toggled) {
+                area.activate();
+            } else {
+                area.deactivate();
+            }
+        }
+    });
+
+All right, you've got all you need to add and activate tools to help users get
+the most out of your maps.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/quickstart.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/quickstart.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/quickstart.txt	(revision 76)
@@ -0,0 +1,140 @@
+===================
+ GeoExt QuickStart
+===================
+
+Welcome to GeoExt!  This document is intended to help you get started
+with GeoExt.  With GeoExt, you can start from nothing and have a rich
+mapping application in seconds.
+
+
+Getting GeoExt
+==============
+
+GeoExt is built on top of the robust OpenLayers JavaScript mapping
+library and the rich graphical components of ExtJS.  For licensing
+reasons, ExtJS cannot be included in the GeoExt download, so preparing
+GeoExt for use on your own web pages is a multi-step process:
+
+#.  Download GeoExt from the :doc:`downloads page </downloads>`. For the purposes
+    of this quickstart, the development version will be fine.
+
+#.  Download OpenLayers 2.10 or later from http://openlayers.org/. 
+
+#.  Download ExtJS 3.2 from `the ExtJS website <http://www.sencha.com/products/js/download.php>`_.
+
+#.  Place both unpacked libraries in a directory that is published by your web
+    server. For this tutorial, I will assume that this is the root of your web
+    server, so that GeoExt.js is at http://localhost/GeoExt/lib/GeoExt.js and
+    ext-all.js is at http://localhost/ext-3.2.1/ext-all.js
+
+#.  Now you're ready to use GeoExt in your application!
+
+.. note:: For production environments, the GeoExt team recommends that
+    you use compressed and minified builds of GeoExt and ExtJS to
+    optimize the download size of your page.  A generic minified build
+    containing all of GeoExt is available from the
+    :doc:`downloads page </downloads>`, but advanced users can build their
+    own.
+
+
+
+Basic Example
+=============
+
+Let's build a simple web page that just embeds a map with interactive
+navigation.
+
+#.  Include the ExtJS libraries in your web page.
+
+    .. code-block:: html
+    
+        <script src="ext-3.2.1/adapter/ext/ext-base.js" type="text/javascript"></script>
+        <script src="ext-3.2.1/ext-all.js"  type="text/javascript"></script>
+        <link rel="stylesheet" type="text/css" href="ext-3.2.1/resources/ext-all.css"></link>
+        <script src="OpenLayers/OpenLayers.js" type="text/javascript"></script>
+        <script src="GeoExt/lib/GeoExt.js" type="text/javascript"></script>
+        <link rel="stylesheet" type="text/css" href="GeoExt/resources/geoext-all-debug.css"></link>
+
+#.  Create a ``<div>`` element in your web page with its ``id``
+    attribute set to ``gxmap``.  We will use the ``id`` to attach a
+    GeoExt component to the ``div``.
+
+#.  Attach a ``MapPanel`` object to the ``div`` with some JavaScript code:
+
+    .. code-block:: html 
+    
+        <script type="text/javascript">
+            Ext.onReady(function() {
+                var map = new OpenLayers.Map();
+                var layer = new OpenLayers.Layer.WMS(
+                    "Global Imagery",
+                    "http://maps.opengeo.org/geowebcache/service/wms",
+                    {layers: "bluemarble"}
+                );
+                map.addLayer(layer);
+    
+                new GeoExt.MapPanel({
+                    renderTo: 'gxmap',
+                    height: 400,
+                    width: 600,
+                    map: map,
+                    title: 'A Simple GeoExt Map'
+                });
+            });
+        </script>
+
+The entire source of your page should look something like:
+
+.. code-block:: html
+
+    <html>
+    <head>
+
+    <title> A Basic GeoExt Page </title>
+    <script src="ext-3.2.1/adapter/ext/ext-base.js" type="text/javascript"></script>
+    <script src="ext-3.2.1/ext-all.js"  type="text/javascript"></script>
+    <link rel="stylesheet" type="text/css" href="ext-3.2.1/resources/ext-all.css"></link>
+    <script src="OpenLayers/OpenLayers.js" type="text/javascript"></script>
+    <script src="GeoExt/lib/GeoExt.js" type="text/javascript"></script>
+    <link rel="stylesheet" type="text/css" href="GeoExt/resources/geoext-all-debug.css"></link>
+
+    <script type="text/javascript">
+        Ext.onReady(function() {
+            var map = new OpenLayers.Map();
+            var layer = new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            );
+            map.addLayer(layer);
+
+            new GeoExt.MapPanel({
+                renderTo: 'gxmap',
+                height: 400,
+                width: 600,
+                map: map,
+                title: 'A Simple GeoExt Map'
+            });
+        });
+    </script>
+    </head>
+    <body>
+    <div id="gxmap"></div>
+    </body>
+    </html>
+
+And that's it! You now have all of GeoExt, ready to bring your geospatial data
+to life. Go forth and prosper!
+
+Going Further
+=============
+
+From here, there are a wide variety of options available for making
+customized, highly interactive mapping applications with GeoExt.  To
+learn more take a look at :doc:`index`, :ref:`examples <examples>` and
+:doc:`/lib/index`.
+
+We also recommend reading :doc:`../primers/ext-primer` and
+:doc:`../primers/openlayers-primer` to become acquainted with the libraries that
+form the foundation of GeoExt.
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/layertree-tutorial.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/layertree-tutorial.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/layertree-tutorial.txt	(revision 76)
@@ -0,0 +1,198 @@
+============================
+Layer Tree Tutorial
+============================
+
+Often when presenting users with an interactive map, it is useful to allow them
+to control the visible layers. In this tutorial, we examine the use of
+:class:`GeoExt.tree.LayerContainer` with the stock ``Ext.tree.TreePanel`` class
+to accommodate toggling visibility of layers and rearranging their drawing
+order.
+
+.. note:: Before starting this tutorial, you should have a working
+    :class:`GeoExt.MapPanel` in your page. The :doc:`mappanel-tutorial` will
+    help you set one up if you don't already have one.
+
+Start With a Map
+================
+
+Let's assume you already have a :class:`GeoExt.MapPanel` on your page with some
+layers. In the :doc:`mappanel-tutorial`\ , we discussed how you can use the
+``layers`` property of the ``MapPanel`` to add, remove, and modify the layers of
+the map as well as monitor the layer list for changes. This is more than
+sufficient to display a 'live' list of layers in an ``Ext.grid.GridPanel``\ .
+The :class:`GeoExt.tree.LayerContainer` is another component that can listen to
+changes to the map's layer list. However, rather than an independent panel, the
+``LayerContainer`` is a node that must be contained in an ``Ext.tree.TreePanel``
+to be displayed. Here's an example rendering a layer tree to a ``div``:
+
+.. code-block:: javascript
+       
+    var mapPanel = new GeoExt.MapPanel({
+        /* Your configuration here */
+    });
+
+    var layerList = new GeoExt.tree.LayerContainer({
+        text: 'All Layers',
+        layerStore: mapPanel.layers,
+        leaf: false, 
+        expanded: true
+    });
+
+    var layerTree = new Ext.tree.TreePanel({
+        title: 'Map Layers',
+        renderTo: 'layerTree',
+        root: layerList
+    });
+
+``LayerContainer``\ s automatically add checkboxes (radio buttons for base
+layers) that can be used to toggle the visibility of layers. You can also enable
+drag-n-drop layer reordering by simply setting the ``enableDD`` property of the
+``TreePanel``.
+
+Filtering
+=========
+By default, the ``LayerContainer``'s ``LayerLoader`` automatically pulls in all layers from the store and displays those with the ``displayInLayerSwitcher``
+property set to true. You can provide your own filter function to the loader:
+
+.. code-block:: javascript
+
+    var layerList = new GeoExt.tree.LayerContainer({
+        text: 'Tasmania Layers',
+        layerStore: mapPanel.layers,
+        leaf: false, 
+        expanded: true,
+        loader: {
+            filter: function(record) {
+                return record.get("layer").name.indexOf("Tasmania") !== -1
+            }
+        }
+    });
+
+The above will only load layers with "Tasmania" in their name. By adding
+multiple named and filtered ``LayerContainer``\ s to a ``TreePanel`` you are
+able to provide logical organization to your layer trees. When ``enableDD`` is
+set to true on the tree, drag-n-drop will also work between filtered layer
+containers, as long as they have the same parent node. You can also directly
+instantiate :class:`GeoExt.tree.LayerNode` to create tree nodes that can be
+added anywhere in a tree. Keep in mind, however, that this approach does not
+allow for automatic drag-n-drop support.
+
+.. note::
+
+    There are two LayerContainer types with a preconfigured filter:
+    
+    * :class:`GeoExt.tree.BaseLayerContainer` will be populated only with layers
+      that have isBaseLayer set to true,
+    * :class:`GeoExt.tree.OverlayLayerContainer` will be populated only with
+      layers that have  isBaseLayer set to false.
+
+Visibility Grouping
+===================
+
+The concept of a base layer in OpenLayers is just a gruop of layers that are on
+the bottom of the layer stack, and only one can be visible at a time. In maps
+without base layers (when ``allOverlays`` is set to true, the latter can be
+enforced by configuring a ``checkedGroup`` on a LayerNode. Such a layer node
+will be rendered with a radio button instead of a check box. Of all layers
+configured with the same ``checkedGroup``, only one will be visible at a time:
+
+.. code-block:: javascript
+
+    var layerList = new GeoExt.tree.LayerContainer({
+        text: 'Tasmania Layers',
+        layerStore: mapPanel.layers,
+        leaf: false, 
+        expanded: true,
+        loader: {
+            filter: function(record) {
+                return record.get("layer").name.indexOf("Tasmania") !== -1
+            },
+            baseAttrs: {
+                checkedGroup: "tasmania"
+            }
+        }
+    });
+
+Layer Nodes with Additional Radio Buttons
+=========================================
+
+It is possible to render layer nodes with an additional radio button. This can
+be useful if an application uses the concept of an "active layer". The active
+layer can then be set by clicking its radio button:
+
+.. code-block:: javascript
+
+    var layerList = new GeoExt.tree.LayerContainer({
+        text: 'All Layers',
+        layerStore: mapPanel.layers,
+        leaf: false, 
+        expanded: true,
+        loader: {
+            baseAttrs: {
+                radioGroup: "active"
+            }
+        }
+    });
+    var registerRadio = function(node)
+        if(!node.hasListener("radiochange")) {
+            node.on("radiochange", function(node){
+                /* set your active layer here */
+            });
+        }
+    }
+    var layerTree = new Ext.tree.TreePanel({
+        title: 'Map Layers',
+        renderTo: 'layerTree',
+        root: layerList,
+        listeners: {
+            append: registerRadio,
+            insert: registerRadio
+        }
+    });
+
+The layer node fires the "radiochange" event when the radio button is clicked.
+The above snippet configures a listener for this event when a node is added to
+or inserted in the tree.
+
+Sub-Layers
+==========
+
+Layers that have a ``params`` property (like ``OpenLayers.Layer.WMS``) can be
+used to create sub-layers based on one of the ``params`` properties. This is
+useful to e.g. create sub-nodes from the layer object's "LAYERS" or "CQL_FILTER"
+param:
+
+.. code-block:: javascript
+
+    var groupLayer = new OpenLayers.Layer.WMS("Tasmania (Group Layer)",
+        "http://demo.opengeo.org/geoserver/wms", {
+            layers: [
+                "topp:tasmania_state_boundaries",
+                "topp:tasmania_water_bodies",
+                "topp:tasmania_cities",
+                "topp:tasmania_roads"
+            ],
+            transparent: true,
+            format: "image/gif"
+        }
+    );
+    var groupLayerNode = new GeoExt.tree.LayerNode({
+        layer: groupLayer,
+        leaf: false, 
+        expanded: true,
+        loader: {
+            param: "LAYERS"
+        }
+    });
+    
+.. note::
+    The :class:`GeoExt.tree.LayerParamLoader` does not add drag-n-drop support
+    to the sub-nodes it creates, so ``allowDrag`` and ``allowDrag`` should be
+    set to false for a :class:`GeoExt.tree.LayerNode` configured with a
+    :class:`GeoExt.class.LayerParamLoader`, unless you provide custom "move"
+    handlers.
+
+.. seealso:: The ExtJS TreePanel `documentation
+    <http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreePanel>`_ and `examples
+    <http://dev.sencha.com/deploy/dev/examples/#sample-7>`_ for more
+    information about customizing tree panels.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/mappanel-tutorial.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/mappanel-tutorial.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/tutorials/mappanel-tutorial.txt	(revision 76)
@@ -0,0 +1,108 @@
+.. highlight:: javascript
+
+============================
+``MapPanel`` Tutorial
+============================
+
+The :class:`GeoExt.MapPanel` is the heart of most GeoExt applications,
+displaying rendered data. Leveraging the OpenLayers JavaScript mapping library,
+it can display rendered tiles from OWS services, perform client-side rendering
+in the browser, and use tiles from popular mapping services such as Google Maps
+or Virtual Earth. In this tutorial, we explore ways that developers can
+customize the MapPanel.
+
+.. note:: 
+  It is recommended that you follow the :doc:`quickstart` tutorial
+  before moving on to this one. It really is quick; we'll wait for you.
+
+A Basic MapPanel
+================
+
+Taking a look at the example code from the quickstart tutorial, we can see a
+very basic map configuration:
+       
+.. code-block:: javascript
+    :linenos:
+
+    var map = new OpenLayers.Map();
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    map.addLayer(layer);
+     
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: 'gxmap',
+        height: 400,
+        width: 600,
+        map: map,
+        title: 'A Simple GeoExt Map'
+    });
+
+Looking at this code we can see a few things going on:
+
+In **line 1** we instantiate an :class:`OpenLayers.Map`. This isn't required by
+the MapPanel (it will create a Map for you if none is provided) but we want to
+customize our map a bit.
+
+In **lines 2-6** we create a new :class:`OpenLayers.Layer`. This particular
+layer is a WMS layer, which uses tiles from the Blue Marble layer at
+http://maps.opengeo.org/. 
+
+In **line 7** we add our new layer to the map.
+
+In **lines 9-15** we create a new map panel with several options:
+
+    ``renderTo``
+       This works the same as ``renderTo`` in a normal :class:`Ext.Panel`; it
+       can be an id string, DOM node, or :class:`Ext.Element` telling the
+       MapPanel where on the page it should insert itself.
+
+    ``height``, ``width``
+       These tell the map panel how much large it should draw itself.
+
+    ``map``
+       This is an :class:`OpenLayers.Map` which will be used as the actual map
+       inside the panel. 
+
+    ``title``
+       This is the normal ``title`` property for ExtJS components. It will be
+       rendered nicely across the top of the panel.
+
+Working with the MapPanel
+=========================
+While using ``OpenLayers.Map.addLayer()`` to add layers is a convenient way to
+customize the map, a hand-coded, static list of map layers is not always what we
+want. In order to make manipulating the layer list more accessible to ExtJS
+widgets, the MapPanel exposes a `layers` property which is an
+:class:`Ext.data.Store` that will automatically be updated when layers are
+added, removed, changed, or reordered, with all of the Ext events that go with
+it. We can use this to, for example, populate an :class:`Ext.grid.GridPanel`
+with a live list of layers in the map::
+    
+    new Ext.grid.GridPanel({
+        renderTo: 'layerlist',
+        height: 200, width: 200,
+        autoScroll: true,
+        store: mapPanel.layers,
+        columns: [{name: 'name', heading: 'Name'}]
+    });
+
+
+In the HTML, you'll need to add a ``div`` for the grid panel to render itself in:
+
+.. code-block:: html
+
+    <div id='layerlist'></div>
+
+More information on the :class:`Ext.grid.GridPanel` is available from the `ExtJS
+API documentation
+<http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.GridPanel>`_.
+
+.. note:: 
+  This code is only meant as an example to demonstrate the map panel's
+  integration with Ext. An :class:`Ext.tree.TreePanel` with
+  :class:`GeoExt.tree.LayerNode`\ s is a a much nicer way to display the layers in
+  a map, with optional support for hiding/showing layers and reordering. The
+  TreePanel approach is discussed in the :doc:`layertree-tutorial`.
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/downloads.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/downloads.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/downloads.txt	(revision 76)
@@ -0,0 +1,16 @@
+=================
+ Download GeoExt
+=================
+
+Current Release
+---------------
+
+ * GeoExt 1.0 (`Source <http://trac.geoext.org/attachment/wiki/Download/GeoExt-1.0.zip?format=raw>`__ | `Release Notes <http://trac.geoext.org/wiki/Release/1.0/Notes>`__)
+ * :doc:`Build your own download <./builder/v1.0>` (with just the components you need).
+
+Previous Releases
+-----------------
+
+ * GeoExt 0.7 (:doc:`Custom Build <./builder/v0.7>` | `Source <http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.7.zip?format=raw>`__ | `Release Notes <http://trac.geoext.org/wiki/Release/0.7/Notes>`__)
+ * GeoExt 0.6 (:doc:`Custom Build <./builder/v0.6>` | `Source <http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.6.zip?format=raw>`__ | `Release Notes <http://trac.geoext.org/wiki/Release/0.6/Notes>`__)
+ * GeoExt 0.5 (`Source <http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.5.zip?format=raw>`__ | `Release Notes <http://trac.geoext.org/wiki/Release/0.5/Notes>`__)
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/examples.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/examples.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_sources/examples.txt	(revision 76)
@@ -0,0 +1,277 @@
+
+.. _examples:
+
+Examples
+========
+
+
+.. _example.attribute-form:
+
+.. cssclass:: exampleblock example-attribute-form
+
+Attribute Form
+--------------
+Create a form with fields from attributes read from a WFS
+DescribeFeatureType response
+
+
+
+.. _example.attributes:
+
+.. cssclass:: exampleblock example-attributes
+
+Attribute Store & Reader
+------------------------
+Create records with attribute types and values with an AttributeStore.
+
+
+
+.. _example.feature-grid:
+
+.. cssclass:: exampleblock example-feature-grid
+
+Grid with Features
+------------------
+Synchronize selection of features between a grid and a layer.
+
+
+
+.. _example.layercontainer:
+
+.. cssclass:: exampleblock example-layercontainer
+
+Layer Tree
+----------
+Create a layer tree with a LayerContainer.
+
+
+
+.. _example.layeropacityslider:
+
+.. cssclass:: exampleblock example-layeropacityslider
+
+Layer Opacity Slider
+--------------------
+Use a slider to control layer opacity.
+
+
+
+.. _example.legendpanel:
+
+.. cssclass:: exampleblock example-legendpanel
+
+Legend Panel
+------------
+Display a layer legend in a panel.
+
+
+
+.. _example.mappanel-div:
+
+.. cssclass:: exampleblock example-mappanel-div
+
+Map Panel
+---------
+Render a map panel in any block level page element.
+
+
+
+.. _example.mappanel-viewport:
+
+.. cssclass:: exampleblock example-mappanel-viewport
+
+Map Panel (in a Viewport)
+-------------------------
+Render a map panel in a viewport.
+
+
+
+.. _example.mappanel-window:
+
+.. cssclass:: exampleblock example-mappanel-window
+
+Map Panel (in a Window)
+-------------------------
+Render a map panel in a Window.
+
+
+
+.. _example.permalink:
+
+.. cssclass:: exampleblock example-permalink
+
+Permalink
+---------
+Display a permalink each time the map changes position.
+
+
+
+.. _example.popup:
+
+.. cssclass:: exampleblock example-popup
+
+Feature Popup
+-------------
+Display a popup with feature information.
+
+
+
+.. _example.popup-more:
+
+.. cssclass:: exampleblock example-popup-more
+
+Modifying Popups
+----------------
+Update a popup with information from multiple locations.
+
+
+
+.. _example.print-extent:
+
+.. cssclass:: exampleblock example-print-extent
+
+Interactive Print Extent
+------------------------
+Change print scale, center and rotation with the PrintExtent plugin.
+
+
+
+.. _example.print-form:
+
+.. cssclass:: exampleblock example-print-form
+
+Print Configuration with a Form
+-------------------------------
+Use form field plugins to control print output.
+
+
+
+.. _example.print-page:
+
+.. cssclass:: exampleblock example-print-page
+
+Print Your Map
+--------------
+Print the visible extent of a MapPanel with PrintPage and PrintProvider.
+
+
+
+.. _example.print-preview:
+
+.. cssclass:: exampleblock example-print-preview
+
+Print Preview Window
+--------------------
+Use the PrintMapPanel for interactive print previews.
+
+
+
+.. _example.print-preview-osm:
+
+.. cssclass:: exampleblock example-print-preview-osm
+
+Printing OpenStreetMap
+----------------------------------------
+PrintMapPanel with an OSM map.
+
+
+
+.. _example.renderer:
+
+.. cssclass:: exampleblock example-renderer
+
+Feature Renderer
+----------------
+Render a vector feature with multiple symbolizers in a box component.
+
+
+
+.. _example.search-form:
+
+.. cssclass:: exampleblock example-search-form
+
+Filter Form Panel
+-----------------
+Use a form to build an OpenLayers filter.
+
+
+
+.. _example.toolbar:
+
+.. cssclass:: exampleblock example-toolbar
+
+Toolbar with Actions
+--------------------
+Create a toolbar with GeoExt Actions.
+
+
+
+.. _example.tree:
+
+.. cssclass:: exampleblock example-tree
+
+Tree Nodes
+----------
+Create all kinds of tree nodes.
+
+
+
+.. _example.tree-legend:
+
+.. cssclass:: exampleblock example-tree-legend
+
+Tree Legend
+-----------
+Render layer nodes with legends.
+
+
+
+.. _example.vector-legend:
+
+.. cssclass:: exampleblock example-vector-legend
+
+Vector Legend
+-------------------------
+Render a legend for a vector layer.
+
+
+
+.. _example.wms-capabilities:
+
+.. cssclass:: exampleblock example-wms-capabilities
+
+WMS Capabilities Store
+----------------------
+Create layer records from WMS capabilities documents.
+
+
+
+.. _example.wms-tree:
+
+.. cssclass:: exampleblock example-wms-tree
+
+WMS Capabilities Tree
+---------------------
+Create a tree loader from WMS capabilities documents.
+
+
+
+.. _example.zoom-chooser:
+
+.. cssclass:: exampleblock example-zoom-chooser
+
+Scale Chooser
+-------------
+Use a ComboBox to display available map scales.
+
+
+
+.. _example.zoomslider:
+
+.. cssclass:: exampleblock example-zoomslider
+
+Zoom Slider
+-----------
+Use a slider to control map scale.
+
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/objects.inv
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/objects.inv	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/objects.inv	(revision 76)
@@ -0,0 +1,136 @@
+# Sphinx inventory version 1
+# Project: GeoExt
+# Version: 1.0
+GeoExt.grid mod lib/GeoExt/widgets.html
+GeoExt mod lib/index.html
+GeoExt.data mod lib/GeoExt/data.html
+GeoExt.plugins mod lib/GeoExt/plugins.html
+GeoExt.state mod lib/GeoExt/state.html
+GeoExt.form mod lib/GeoExt/widgets.html
+GeoExt.tree mod lib/GeoExt/widgets.html
+GeoExt.data.ScaleStore.unbind method lib/GeoExt/data/ScaleStore.html
+GeoExt.data.PrintProvider.layout attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.LegendImage.setUrl method lib/GeoExt/widgets/LegendImage.html
+GeoExt.tree.LayerParamLoader.createNode method lib/GeoExt/widgets/tree/LayerParamLoader.html
+GeoExt.plugins.PrintExtent.pages attribute lib/GeoExt/plugins/PrintExtent.html
+GeoExt.form.SearchAction.response attribute lib/GeoExt/widgets/form/SearchAction.html
+GeoExt.data.FeatureStore.unbind method lib/GeoExt/data/FeatureStore.html
+GeoExt.plugins.PrintExtent.print method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.FeatureRecord class lib/GeoExt/data/FeatureRecord.html
+GeoExt.PrintMapPanel.printProvider attribute lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.LayerOpacitySlider class lib/GeoExt/widgets/LayerOpacitySlider.html
+GeoExt.data.LayerRecord.create classmethod lib/GeoExt/data/LayerRecord.html
+GeoExt.data.PrintPage.center attribute lib/GeoExt/data/PrintPage.html
+GeoExt.plugins.PrintExtent class lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.PrintProvider.dpi attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.FeatureRenderer.setSymbolType method lib/GeoExt/widgets/FeatureRenderer.html
+GeoExt.plugins.PrintPageField class lib/GeoExt/plugins/PrintPageField.html
+GeoExt.FeatureRenderer.update method lib/GeoExt/widgets/FeatureRenderer.html
+GeoExt.WMSLegend class lib/GeoExt/widgets/WMSLegend.html
+GeoExt.Popup.setSize method lib/GeoExt/widgets/Popup.html
+GeoExt.tree.LayerParamLoader class lib/GeoExt/widgets/tree/LayerParamLoader.html
+GeoExt.FeatureRenderer.setSymbolizers method lib/GeoExt/widgets/FeatureRenderer.html
+GeoExt.data.ProtocolProxy class lib/GeoExt/data/ProtocolProxy.html
+GeoExt.MapPanel.layers attribute lib/GeoExt/widgets/MapPanel.html
+GeoExt.form.FormPanel class lib/GeoExt/widgets/form/FormPanel.html
+GeoExt.data.PrintPage.setCenter method lib/GeoExt/data/PrintPage.html
+GeoExt.grid.FeatureSelectionModel.bind method lib/GeoExt/widgets/grid/FeatureSelectionModel.html
+GeoExt.data.LayerRecord.setLayer method lib/GeoExt/data/LayerRecord.html
+GeoExt.data.PrintProvider.customParams attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.ZoomSliderTip class lib/GeoExt/widgets/tips/ZoomSliderTip.html
+GeoExt.data.PrintPage class lib/GeoExt/data/PrintPage.html
+GeoExt.data.FeatureStore.getRecordFromFeature method lib/GeoExt/data/FeatureStore.html
+GeoExt.form.FormPanel.search method lib/GeoExt/widgets/form/FormPanel.html
+GeoExt.data.PrintProvider.setDpi method lib/GeoExt/data/PrintProvider.html
+GeoExt.grid.FeatureSelectionModel.unbind method lib/GeoExt/widgets/grid/FeatureSelectionModel.html
+GeoExt.PrintMapPanel.print method lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.LayerLegend class lib/GeoExt/widgets/LayerLegend.html
+GeoExt.VectorLegend.update method lib/GeoExt/widgets/VectorLegend.html
+GeoExt.data.WFSCapabilitiesStore class lib/GeoExt/data/WFSCapabilitiesStore.html
+GeoExt.data.PrintProvider.print method lib/GeoExt/data/PrintProvider.html
+GeoExt.tree.LayerLoader.createNode method lib/GeoExt/widgets/tree/LayerLoader.html
+GeoExt.data.LayerRecord class lib/GeoExt/data/LayerRecord.html
+GeoExt.data.PrintProvider.layouts attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.PrintMapPanel class lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.plugins.PrintExtent.show method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.PrintPage.scale attribute lib/GeoExt/data/PrintPage.html
+GeoExt.LayerOpacitySliderTip class lib/GeoExt/widgets/tips/LayerOpacitySliderTip.html
+GeoExt.form.SearchAction class lib/GeoExt/widgets/form/SearchAction.html
+GeoExt.Action class lib/GeoExt/widgets/Action.html
+GeoExt.data.WMSCapabilitiesStore class lib/GeoExt/data/WMSCapabilitiesStore.html
+GeoExt.tree.OverlayLayerContainer class lib/GeoExt/widgets/tree/OverlayLayerContainer.html
+GeoExt.grid.FeatureSelectionModel class lib/GeoExt/widgets/grid/FeatureSelectionModel.html
+GeoExt.plugins.PrintExtent.page attribute lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.AttributeStore class lib/GeoExt/data/AttributeStore.html
+GeoExt.data.PrintProvider.dpis attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.tree.LayerParamNode class lib/GeoExt/widgets/tree/LayerParamNode.html
+GeoExt.data.LayerRecord.getLayer method lib/GeoExt/data/LayerRecord.html
+GeoExt.data.PrintProvider.setLayout method lib/GeoExt/data/PrintProvider.html
+GeoExt.PrintMapPanel.previewScales attribute lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.Popup class lib/GeoExt/widgets/Popup.html
+GeoExt.data.WMSCapabilitiesReader class lib/GeoExt/data/WMSCapabilitiesReader.html
+GeoExt.FeatureRenderer.setFeature method lib/GeoExt/widgets/FeatureRenderer.html
+GeoExt.PrintMapPanel.layers attribute lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.SliderTip class lib/GeoExt/widgets/tips/SliderTip.html
+GeoExt.data.PrintPage.getPrintExtent method lib/GeoExt/data/PrintPage.html
+GeoExt.data.ScaleStore.bind method lib/GeoExt/data/ScaleStore.html
+GeoExt.data.PrintPage.setRotation method lib/GeoExt/data/PrintPage.html
+GeoExt.plugins.PrintExtent.removePage method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.FeatureReader.readRecords method lib/GeoExt/data/FeatureReader.html
+GeoExt.tree.LayerNode.layer attribute lib/GeoExt/widgets/tree/LayerNode.html
+GeoExt.data.WMCReader class lib/GeoExt/data/WMCReader.html
+GeoExt.LayerOpacitySlider.setLayer method lib/GeoExt/widgets/LayerOpacitySlider.html
+GeoExt.plugins.PrintExtent.selectPage method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.data.FeatureStore.bind method lib/GeoExt/data/FeatureStore.html
+GeoExt.data.PrintProvider class lib/GeoExt/data/PrintProvider.html
+GeoExt.data.PrintProvider.loadCapabilities method lib/GeoExt/data/PrintProvider.html
+GeoExt.tree.BaseLayerContainer class lib/GeoExt/widgets/tree/BaseLayerContainer.html
+GeoExt.form.BasicForm.doAction method lib/GeoExt/widgets/form/BasicForm.html
+GeoExt.data.PrintPage.customParams attribute lib/GeoExt/data/PrintPage.html
+GeoExt.data.FeatureStore class lib/GeoExt/data/FeatureStore.html
+GeoExt.VectorLegend.setCurrentScaleDenominator method lib/GeoExt/widgets/VectorLegend.html
+GeoExt.ZoomSlider.getZoom method lib/GeoExt/widgets/ZoomSlider.html
+GeoExt.state.PermalinkProvider.getLink method lib/GeoExt/state/PermalinkProvider.html
+GeoExt.tree.LayerContainer class lib/GeoExt/widgets/tree/LayerContainer.html
+GeoExt.VectorLegend class lib/GeoExt/widgets/VectorLegend.html
+GeoExt.plugins.PrintExtent.addPage method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.plugins.PrintProviderField class lib/GeoExt/plugins/PrintProviderField.html
+GeoExt.data.LayerStore class lib/GeoExt/data/LayerStore.html
+GeoExt.tree.LayerLoader class lib/GeoExt/widgets/tree/LayerLoader.html
+GeoExt.ZoomSlider.getResolution method lib/GeoExt/widgets/ZoomSlider.html
+GeoExt.data.WMSDescribeLayerStore class lib/GeoExt/data/WMSDescribeLayerStore.html
+GeoExt.data.PrintPage.rotation attribute lib/GeoExt/data/PrintPage.html
+GeoExt.data.FeatureRecord.create classmethod lib/GeoExt/data/FeatureRecord.html
+GeoExt.data.FeatureRecord.getFeature method lib/GeoExt/data/FeatureRecord.html
+GeoExt.data.WMSDescribeLayerReader class lib/GeoExt/data/WMSDescribeLayerReader.html
+GeoExt.data.PrintPage.feature attribute lib/GeoExt/data/PrintPage.html
+GeoExt.tree.LayerNode class lib/GeoExt/widgets/tree/LayerNode.html
+GeoExt.data.PrintPage.fit method lib/GeoExt/data/PrintPage.html
+GeoExt.tree.WMSCapabilitiesLoader class lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.html
+GeoExt.plugins.AttributeForm class lib/GeoExt/plugins/AttributeForm.html
+GeoExt.data.LayerReader class lib/GeoExt/data/LayerReader.html
+GeoExt.MapPanel.map attribute lib/GeoExt/widgets/MapPanel.html
+GeoExt.form.BasicForm class lib/GeoExt/widgets/form/BasicForm.html
+GeoExt.data.WFSCapabilitiesReader class lib/GeoExt/data/WFSCapabilitiesReader.html
+GeoExt.state.PermalinkProvider class lib/GeoExt/state/PermalinkProvider.html
+GeoExt.data.PrintPage.setScale method lib/GeoExt/data/PrintPage.html
+GeoExt.plugins.PrintExtent.hide method lib/GeoExt/plugins/PrintExtent.html
+GeoExt.LegendPanel class lib/GeoExt/widgets/LegendPanel.html
+GeoExt.form.BasicForm.search method lib/GeoExt/widgets/form/BasicForm.html
+GeoExt.UrlLegend class lib/GeoExt/widgets/UrlLegend.html
+GeoExt.LegendImage class lib/GeoExt/widgets/LegendImage.html
+GeoExt.data.AttributeReader class lib/GeoExt/data/AttributeReader.html
+GeoExt.MapPanel class lib/GeoExt/widgets/MapPanel.html
+GeoExt.data.PrintProvider.scales attribute lib/GeoExt/data/PrintProvider.html
+GeoExt.data.FeatureRecord.setLayer method lib/GeoExt/data/FeatureRecord.html
+GeoExt.PrintMapPanel.printPage attribute lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.data.LayerReader.readRecords method lib/GeoExt/data/LayerReader.html
+GeoExt.FeatureRenderer class lib/GeoExt/widgets/FeatureRenderer.html
+GeoExt.plugins.PrintExtent.printProvider attribute lib/GeoExt/plugins/PrintExtent.html
+GeoExt.ZoomSlider.getScale method lib/GeoExt/widgets/ZoomSlider.html
+GeoExt.ZoomSlider class lib/GeoExt/widgets/ZoomSlider.html
+GeoExt.data.FeatureReader class lib/GeoExt/data/FeatureReader.html
+GeoExt.PrintMapPanel.map attribute lib/GeoExt/widgets/PrintMapPanel.html
+GeoExt.data.LayerStore.map attribute lib/GeoExt/data/LayerStore.html
+GeoExt.data.LayerRecord.clone method lib/GeoExt/data/LayerRecord.html
+GeoExt.data.ScaleStore class lib/GeoExt/data/ScaleStore.html
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/developer/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/developer/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/developer/index.html	(revision 76)
@@ -0,0 +1,152 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt Community Involvement &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="next" title="API Reference" href="../lib/index.html" />
+    <link rel="prev" title="Examples" href="../examples.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt Community Involvement</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">GeoExt Community Involvement</a><ul>
+<li><a class="reference external" href="#mailing-list">Mailing list</a></li>
+<li><a class="reference external" href="#irc">IRC</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../examples.html"
+                                  title="previous chapter">Examples</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../lib/index.html"
+                                  title="next chapter">API Reference</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-community-involvement">
+<h1>GeoExt Community Involvement<a class="headerlink" href="#geoext-community-involvement" title="Permalink to this headline">Â¶</a></h1>
+<p>You can get involved with the GeoExt by signing up for a mailing list or finding
+us on IRC.</p>
+<div class="section" id="mailing-list">
+<h2>Mailing list<a class="headerlink" href="#mailing-list" title="Permalink to this headline">Â¶</a></h2>
+<p>The GeoExt mailing lists provide a place for ongoing discussion about GeoExt
+development.  Users are invited to submit questions to the users mailing list.
+We look forward to hearing how you are using GeoExt!</p>
+<p>Find instructions on signing up for the users or developers lists on the pages
+below:</p>
+<ul class="simple">
+<li>GeoExt Users List: <a class="reference external" href="http://www.geoext.org/cgi-bin/mailman/listinfo/users">http://www.geoext.org/cgi-bin/mailman/listinfo/users</a></li>
+<li>GeoExt Developers List: <a class="reference external" href="http://www.geoext.org/cgi-bin/mailman/listinfo/dev">http://www.geoext.org/cgi-bin/mailman/listinfo/dev</a></li>
+</ul>
+<div class="admonition warning">
+<p class="first admonition-title">Warning</p>
+<p class="last">Make sure you are subscribed to the mailing list prior to posting, posts
+from unsubscribed people are rejected with no notification sent to the
+mailing list administrator.</p>
+</div>
+</div>
+<div class="section" id="irc">
+<h2>IRC<a class="headerlink" href="#irc" title="Permalink to this headline">Â¶</a></h2>
+<p>GeoExt has a an IRC channel hosted on <a class="reference external" href="http://freenode.net/">Freenode</a>. You
+can use the following information to connect.</p>
+<ul class="simple">
+<li>Server: irc.freenode.net</li>
+<li>Channel: <a class="reference external" href="irc://irc.freenode.net/#geoext">#geoext</a></li>
+</ul>
+<p>For a history of previous activity on the channel, search the <a class="reference external" href="http://atlas.openplans.org/~georj/cgi-bin/log.cgi/geoext/">archives</a>.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../lib/index.html" title="API Reference"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../examples.html" title="Examples"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt Community Involvement</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/layertree-tutorial.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/layertree-tutorial.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/layertree-tutorial.html	(revision 76)
@@ -0,0 +1,314 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Layer Tree Tutorial &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Tutorials" href="index.html" />
+    <link rel="next" title="Map Tool Tutorial" href="control-button-tutorial.html" />
+    <link rel="prev" title="MapPanel Tutorial" href="mappanel-tutorial.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Tutorials</a> &raquo;</li>
+        <li><a href="#">Layer Tree Tutorial</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Layer Tree Tutorial</a><ul>
+<li><a class="reference external" href="#start-with-a-map">Start With a Map</a></li>
+<li><a class="reference external" href="#filtering">Filtering</a></li>
+<li><a class="reference external" href="#visibility-grouping">Visibility Grouping</a></li>
+<li><a class="reference external" href="#layer-nodes-with-additional-radio-buttons">Layer Nodes with Additional Radio Buttons</a></li>
+<li><a class="reference external" href="#sub-layers">Sub-Layers</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="mappanel-tutorial.html"
+                                  title="previous chapter"><tt class="docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="control-button-tutorial.html"
+                                  title="next chapter">Map Tool Tutorial</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="layer-tree-tutorial">
+<h1>Layer Tree Tutorial<a class="headerlink" href="#layer-tree-tutorial" title="Permalink to this headline">Â¶</a></h1>
+<p>Often when presenting users with an interactive map, it is useful to allow them
+to control the visible layers. In this tutorial, we examine the use of
+<a title="GeoExt.tree.LayerContainer" class="reference external" href="../lib/GeoExt/widgets/tree/LayerContainer.html#GeoExt.tree.LayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a> with the stock <tt class="docutils literal"><span class="pre">Ext.tree.TreePanel</span></tt> class
+to accommodate toggling visibility of layers and rearranging their drawing
+order.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">Before starting this tutorial, you should have a working
+<a title="GeoExt.MapPanel" class="reference external" href="../lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> in your page. The <a class="reference external" href="mappanel-tutorial.html"><em>MapPanel Tutorial</em></a> will
+help you set one up if you don&#8217;t already have one.</p>
+</div>
+<div class="section" id="start-with-a-map">
+<h2>Start With a Map<a class="headerlink" href="#start-with-a-map" title="Permalink to this headline">Â¶</a></h2>
+<p>Let&#8217;s assume you already have a <a title="GeoExt.MapPanel" class="reference external" href="../lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> on your page with some
+layers. In the <a class="reference external" href="mappanel-tutorial.html"><em>MapPanel Tutorial</em></a>, we discussed how you can use the
+<tt class="docutils literal"><span class="pre">layers</span></tt> property of the <tt class="docutils literal"><span class="pre">MapPanel</span></tt> to add, remove, and modify the layers of
+the map as well as monitor the layer list for changes. This is more than
+sufficient to display a &#8216;live&#8217; list of layers in an <tt class="docutils literal"><span class="pre">Ext.grid.GridPanel</span></tt>.
+The <a title="GeoExt.tree.LayerContainer" class="reference external" href="../lib/GeoExt/widgets/tree/LayerContainer.html#GeoExt.tree.LayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a> is another component that can listen to
+changes to the map&#8217;s layer list. However, rather than an independent panel, the
+<tt class="docutils literal"><span class="pre">LayerContainer</span></tt> is a node that must be contained in an <tt class="docutils literal"><span class="pre">Ext.tree.TreePanel</span></tt>
+to be displayed. Here&#8217;s an example rendering a layer tree to a <tt class="docutils literal"><span class="pre">div</span></tt>:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="cm">/* Your configuration here */</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">layerList</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerContainer</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;All Layers&#39;</span><span class="p">,</span>
+    <span class="nx">layerStore</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">.</span><span class="nx">layers</span><span class="p">,</span>
+    <span class="nx">leaf</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">expanded</span><span class="o">:</span> <span class="kc">true</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">layerTree</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreePanel</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Map Layers&#39;</span><span class="p">,</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;layerTree&#39;</span><span class="p">,</span>
+    <span class="nx">root</span><span class="o">:</span> <span class="nx">layerList</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p><tt class="docutils literal"><span class="pre">LayerContainer</span></tt>s automatically add checkboxes (radio buttons for base
+layers) that can be used to toggle the visibility of layers. You can also enable
+drag-n-drop layer reordering by simply setting the <tt class="docutils literal"><span class="pre">enableDD</span></tt> property of the
+<tt class="docutils literal"><span class="pre">TreePanel</span></tt>.</p>
+</div>
+<div class="section" id="filtering">
+<h2>Filtering<a class="headerlink" href="#filtering" title="Permalink to this headline">Â¶</a></h2>
+<p>By default, the <tt class="docutils literal"><span class="pre">LayerContainer</span></tt>&#8216;s <tt class="docutils literal"><span class="pre">LayerLoader</span></tt> automatically pulls in all layers from the store and displays those with the <tt class="docutils literal"><span class="pre">displayInLayerSwitcher</span></tt>
+property set to true. You can provide your own filter function to the loader:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">layerList</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerContainer</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;Tasmania Layers&#39;</span><span class="p">,</span>
+    <span class="nx">layerStore</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">.</span><span class="nx">layers</span><span class="p">,</span>
+    <span class="nx">leaf</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">expanded</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">loader</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">filter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">return</span> <span class="nx">record</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s2">&quot;layer&quot;</span><span class="p">).</span><span class="nx">name</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s2">&quot;Tasmania&quot;</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>The above will only load layers with &#8220;Tasmania&#8221; in their name. By adding
+multiple named and filtered <tt class="docutils literal"><span class="pre">LayerContainer</span></tt>s to a <tt class="docutils literal"><span class="pre">TreePanel</span></tt> you are
+able to provide logical organization to your layer trees. When <tt class="docutils literal"><span class="pre">enableDD</span></tt> is
+set to true on the tree, drag-n-drop will also work between filtered layer
+containers, as long as they have the same parent node. You can also directly
+instantiate <a title="GeoExt.tree.LayerNode" class="reference external" href="../lib/GeoExt/widgets/tree/LayerNode.html#GeoExt.tree.LayerNode"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a> to create tree nodes that can be
+added anywhere in a tree. Keep in mind, however, that this approach does not
+allow for automatic drag-n-drop support.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p>There are two LayerContainer types with a preconfigured filter:</p>
+<ul class="last simple">
+<li><a title="GeoExt.tree.BaseLayerContainer" class="reference external" href="../lib/GeoExt/widgets/tree/BaseLayerContainer.html#GeoExt.tree.BaseLayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a> will be populated only with layers
+that have isBaseLayer set to true,</li>
+<li><a title="GeoExt.tree.OverlayLayerContainer" class="reference external" href="../lib/GeoExt/widgets/tree/OverlayLayerContainer.html#GeoExt.tree.OverlayLayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a> will be populated only with
+layers that have  isBaseLayer set to false.</li>
+</ul>
+</div>
+</div>
+<div class="section" id="visibility-grouping">
+<h2>Visibility Grouping<a class="headerlink" href="#visibility-grouping" title="Permalink to this headline">Â¶</a></h2>
+<p>The concept of a base layer in OpenLayers is just a gruop of layers that are on
+the bottom of the layer stack, and only one can be visible at a time. In maps
+without base layers (when <tt class="docutils literal"><span class="pre">allOverlays</span></tt> is set to true, the latter can be
+enforced by configuring a <tt class="docutils literal"><span class="pre">checkedGroup</span></tt> on a LayerNode. Such a layer node
+will be rendered with a radio button instead of a check box. Of all layers
+configured with the same <tt class="docutils literal"><span class="pre">checkedGroup</span></tt>, only one will be visible at a time:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">layerList</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerContainer</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;Tasmania Layers&#39;</span><span class="p">,</span>
+    <span class="nx">layerStore</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">.</span><span class="nx">layers</span><span class="p">,</span>
+    <span class="nx">leaf</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">expanded</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">loader</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">filter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">return</span> <span class="nx">record</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s2">&quot;layer&quot;</span><span class="p">).</span><span class="nx">name</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s2">&quot;Tasmania&quot;</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span>
+        <span class="p">},</span>
+        <span class="nx">baseAttrs</span><span class="o">:</span> <span class="p">{</span>
+            <span class="nx">checkedGroup</span><span class="o">:</span> <span class="s2">&quot;tasmania&quot;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="layer-nodes-with-additional-radio-buttons">
+<h2>Layer Nodes with Additional Radio Buttons<a class="headerlink" href="#layer-nodes-with-additional-radio-buttons" title="Permalink to this headline">Â¶</a></h2>
+<p>It is possible to render layer nodes with an additional radio button. This can
+be useful if an application uses the concept of an &#8220;active layer&#8221;. The active
+layer can then be set by clicking its radio button:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">layerList</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerContainer</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;All Layers&#39;</span><span class="p">,</span>
+    <span class="nx">layerStore</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">.</span><span class="nx">layers</span><span class="p">,</span>
+    <span class="nx">leaf</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">expanded</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">loader</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">baseAttrs</span><span class="o">:</span> <span class="p">{</span>
+            <span class="nx">radioGroup</span><span class="o">:</span> <span class="s2">&quot;active&quot;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+<span class="kd">var</span> <span class="nx">registerRadio</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">node</span><span class="p">)</span>
+    <span class="k">if</span><span class="p">(</span><span class="o">!</span><span class="nx">node</span><span class="p">.</span><span class="nx">hasListener</span><span class="p">(</span><span class="s2">&quot;radiochange&quot;</span><span class="p">))</span> <span class="p">{</span>
+        <span class="nx">node</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s2">&quot;radiochange&quot;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">node</span><span class="p">){</span>
+            <span class="cm">/* set your active layer here */</span>
+        <span class="p">});</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+<span class="kd">var</span> <span class="nx">layerTree</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreePanel</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Map Layers&#39;</span><span class="p">,</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;layerTree&#39;</span><span class="p">,</span>
+    <span class="nx">root</span><span class="o">:</span> <span class="nx">layerList</span><span class="p">,</span>
+    <span class="nx">listeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">append</span><span class="o">:</span> <span class="nx">registerRadio</span><span class="p">,</span>
+        <span class="nx">insert</span><span class="o">:</span> <span class="nx">registerRadio</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>The layer node fires the &#8220;radiochange&#8221; event when the radio button is clicked.
+The above snippet configures a listener for this event when a node is added to
+or inserted in the tree.</p>
+</div>
+<div class="section" id="sub-layers">
+<h2>Sub-Layers<a class="headerlink" href="#sub-layers" title="Permalink to this headline">Â¶</a></h2>
+<p>Layers that have a <tt class="docutils literal"><span class="pre">params</span></tt> property (like <tt class="docutils literal"><span class="pre">OpenLayers.Layer.WMS</span></tt>) can be
+used to create sub-layers based on one of the <tt class="docutils literal"><span class="pre">params</span></tt> properties. This is
+useful to e.g. create sub-nodes from the layer object&#8217;s &#8220;LAYERS&#8221; or &#8220;CQL_FILTER&#8221;
+param:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">groupLayer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span><span class="s2">&quot;Tasmania (Group Layer)&quot;</span><span class="p">,</span>
+    <span class="s2">&quot;http://demo.opengeo.org/geoserver/wms&quot;</span><span class="p">,</span> <span class="p">{</span>
+        <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span>
+            <span class="s2">&quot;topp:tasmania_state_boundaries&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;topp:tasmania_water_bodies&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;topp:tasmania_cities&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;topp:tasmania_roads&quot;</span>
+        <span class="p">],</span>
+        <span class="nx">transparent</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">format</span><span class="o">:</span> <span class="s2">&quot;image/gif&quot;</span>
+    <span class="p">}</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">groupLayerNode</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerNode</span><span class="p">({</span>
+    <span class="nx">layer</span><span class="o">:</span> <span class="nx">groupLayer</span><span class="p">,</span>
+    <span class="nx">leaf</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">expanded</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">loader</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">param</span><span class="o">:</span> <span class="s2">&quot;LAYERS&quot;</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">The <a title="GeoExt.tree.LayerParamLoader" class="reference external" href="../lib/GeoExt/widgets/tree/LayerParamLoader.html#GeoExt.tree.LayerParamLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a> does not add drag-n-drop support
+to the sub-nodes it creates, so <tt class="docutils literal"><span class="pre">allowDrag</span></tt> and <tt class="docutils literal"><span class="pre">allowDrag</span></tt> should be
+set to false for a <a title="GeoExt.tree.LayerNode" class="reference external" href="../lib/GeoExt/widgets/tree/LayerNode.html#GeoExt.tree.LayerNode"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a> configured with a
+<tt class="xref docutils literal"><span class="pre">GeoExt.class.LayerParamLoader</span></tt>, unless you provide custom &#8220;move&#8221;
+handlers.</p>
+</div>
+<div class="admonition-see-also admonition seealso">
+<p class="first admonition-title">See also</p>
+<p class="last">The ExtJS TreePanel <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreePanel">documentation</a> and <a class="reference external" href="http://dev.sencha.com/deploy/dev/examples/#sample-7">examples</a> for more
+information about customizing tree panels.</p>
+</div>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="control-button-tutorial.html" title="Map Tool Tutorial"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="mappanel-tutorial.html" title="MapPanel Tutorial"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Tutorials</a> &raquo;</li>
+        <li><a href="#">Layer Tree Tutorial</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/mappanel-tutorial.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/mappanel-tutorial.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/mappanel-tutorial.html	(revision 76)
@@ -0,0 +1,231 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>MapPanel Tutorial &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Tutorials" href="index.html" />
+    <link rel="next" title="Layer Tree Tutorial" href="layertree-tutorial.html" />
+    <link rel="prev" title="GeoExt QuickStart" href="quickstart.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Tutorials</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a><ul>
+<li><a class="reference external" href="#a-basic-mappanel">A Basic MapPanel</a></li>
+<li><a class="reference external" href="#working-with-the-mappanel">Working with the MapPanel</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="quickstart.html"
+                                  title="previous chapter">GeoExt QuickStart</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="layertree-tutorial.html"
+                                  title="next chapter">Layer Tree Tutorial</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="mappanel-tutorial">
+<h1><tt class="docutils literal"><span class="pre">MapPanel</span></tt> Tutorial<a class="headerlink" href="#mappanel-tutorial" title="Permalink to this headline">Â¶</a></h1>
+<p>The <a title="GeoExt.MapPanel" class="reference external" href="../lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> is the heart of most GeoExt applications,
+displaying rendered data. Leveraging the OpenLayers JavaScript mapping library,
+it can display rendered tiles from OWS services, perform client-side rendering
+in the browser, and use tiles from popular mapping services such as Google Maps
+or Virtual Earth. In this tutorial, we explore ways that developers can
+customize the MapPanel.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">It is recommended that you follow the <a class="reference external" href="quickstart.html"><em>GeoExt QuickStart</em></a> tutorial
+before moving on to this one. It really is quick; we&#8217;ll wait for you.</p>
+</div>
+<div class="section" id="a-basic-mappanel">
+<h2>A Basic MapPanel<a class="headerlink" href="#a-basic-mappanel" title="Permalink to this headline">Â¶</a></h2>
+<p>Taking a look at the example code from the quickstart tutorial, we can see a
+very basic map configuration:</p>
+<div class="highlight-javascript"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1
+ 2
+ 3
+ 4
+ 5
+ 6
+ 7
+ 8
+ 9
+10
+11
+12
+13
+14
+15</pre></div></td><td class="code"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">();</span>
+<span class="kd">var</span> <span class="nx">layer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+    <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+    <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+    <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+<span class="p">);</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">layer</span><span class="p">);</span>
+
+<span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;gxmap&#39;</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">600</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;A Simple GeoExt Map&#39;</span>
+<span class="p">});</span>
+</pre></div>
+</td></tr></table></div>
+<p>Looking at this code we can see a few things going on:</p>
+<p>In <strong>line 1</strong> we instantiate an <tt class="xref docutils literal"><span class="pre">OpenLayers.Map</span></tt>. This isn&#8217;t required by
+the MapPanel (it will create a Map for you if none is provided) but we want to
+customize our map a bit.</p>
+<p>In <strong>lines 2-6</strong> we create a new <tt class="xref docutils literal"><span class="pre">OpenLayers.Layer</span></tt>. This particular
+layer is a WMS layer, which uses tiles from the Blue Marble layer at
+<a class="reference external" href="http://maps.opengeo.org/">http://maps.opengeo.org/</a>.</p>
+<p>In <strong>line 7</strong> we add our new layer to the map.</p>
+<p>In <strong>lines 9-15</strong> we create a new map panel with several options:</p>
+<blockquote>
+<dl class="docutils">
+<dt><tt class="docutils literal"><span class="pre">renderTo</span></tt></dt>
+<dd>This works the same as <tt class="docutils literal"><span class="pre">renderTo</span></tt> in a normal <tt class="xref docutils literal"><span class="pre">Ext.Panel</span></tt>; it
+can be an id string, DOM node, or <tt class="xref docutils literal"><span class="pre">Ext.Element</span></tt> telling the
+MapPanel where on the page it should insert itself.</dd>
+<dt><tt class="docutils literal"><span class="pre">height</span></tt>, <tt class="docutils literal"><span class="pre">width</span></tt></dt>
+<dd>These tell the map panel how much large it should draw itself.</dd>
+<dt><tt class="docutils literal"><span class="pre">map</span></tt></dt>
+<dd>This is an <tt class="xref docutils literal"><span class="pre">OpenLayers.Map</span></tt> which will be used as the actual map
+inside the panel.</dd>
+<dt><tt class="docutils literal"><span class="pre">title</span></tt></dt>
+<dd>This is the normal <tt class="docutils literal"><span class="pre">title</span></tt> property for ExtJS components. It will be
+rendered nicely across the top of the panel.</dd>
+</dl>
+</blockquote>
+</div>
+<div class="section" id="working-with-the-mappanel">
+<h2>Working with the MapPanel<a class="headerlink" href="#working-with-the-mappanel" title="Permalink to this headline">Â¶</a></h2>
+<p>While using <tt class="docutils literal"><span class="pre">OpenLayers.Map.addLayer()</span></tt> to add layers is a convenient way to
+customize the map, a hand-coded, static list of map layers is not always what we
+want. In order to make manipulating the layer list more accessible to ExtJS
+widgets, the MapPanel exposes a <cite>layers</cite> property which is an
+<tt class="xref docutils literal"><span class="pre">Ext.data.Store</span></tt> that will automatically be updated when layers are
+added, removed, changed, or reordered, with all of the Ext events that go with
+it. We can use this to, for example, populate an <tt class="xref docutils literal"><span class="pre">Ext.grid.GridPanel</span></tt>
+with a live list of layers in the map:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">grid</span><span class="p">.</span><span class="nx">GridPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;layerlist&#39;</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span> <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">autoScroll</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">store</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">.</span><span class="nx">layers</span><span class="p">,</span>
+    <span class="nx">columns</span><span class="o">:</span> <span class="p">[{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;name&#39;</span><span class="p">,</span> <span class="nx">heading</span><span class="o">:</span> <span class="s1">&#39;Name&#39;</span><span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>In the HTML, you&#8217;ll need to add a <tt class="docutils literal"><span class="pre">div</span></tt> for the grid panel to render itself in:</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;div</span> <span class="na">id=</span><span class="s">&#39;layerlist&#39;</span><span class="nt">&gt;&lt;/div&gt;</span>
+</pre></div>
+</div>
+<p>More information on the <tt class="xref docutils literal"><span class="pre">Ext.grid.GridPanel</span></tt> is available from the <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.GridPanel">ExtJS
+API documentation</a>.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">This code is only meant as an example to demonstrate the map panel&#8217;s
+integration with Ext. An <tt class="xref docutils literal"><span class="pre">Ext.tree.TreePanel</span></tt> with
+<a title="GeoExt.tree.LayerNode" class="reference external" href="../lib/GeoExt/widgets/tree/LayerNode.html#GeoExt.tree.LayerNode"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a>s is a a much nicer way to display the layers in
+a map, with optional support for hiding/showing layers and reordering. The
+TreePanel approach is discussed in the <a class="reference external" href="layertree-tutorial.html"><em>Layer Tree Tutorial</em></a>.</p>
+</div>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="layertree-tutorial.html" title="Layer Tree Tutorial"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="quickstart.html" title="GeoExt QuickStart"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Tutorials</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/index.html	(revision 76)
@@ -0,0 +1,197 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Tutorials &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="next" title="GeoExt QuickStart" href="quickstart.html" />
+    <link rel="prev" title="Documentation" href="../docs.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Tutorials</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Tutorials</a><ul>
+<li><a class="reference external" href="#quickstart">QuickStart</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#map-in-a-panel">Map in a Panel</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#layer-tree-and-map-panel">Layer Tree and Map Panel</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#configuring-map-tools">Configuring map tools</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#remote-features">Remote features</a><ul>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../docs.html"
+                                  title="previous chapter">Documentation</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="quickstart.html"
+                                  title="next chapter">GeoExt QuickStart</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="tutorials">
+<h1>Tutorials<a class="headerlink" href="#tutorials" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt tutorials show the library in action.  Basic tutorials help new developers get up and running quickly, while the advanced section includes how-to&#8217;s on more sophisticated setups.</p>
+<div class="section" id="quickstart">
+<h2>QuickStart<a class="headerlink" href="#quickstart" title="Permalink to this headline">Â¶</a></h2>
+<p>From zero to rich mapping application in 5 minutes!</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="quickstart.html">GeoExt QuickStart</a><ul>
+<li class="toctree-l2"><a class="reference external" href="quickstart.html#getting-geoext">Getting GeoExt</a></li>
+<li class="toctree-l2"><a class="reference external" href="quickstart.html#basic-example">Basic Example</a></li>
+<li class="toctree-l2"><a class="reference external" href="quickstart.html#going-further">Going Further</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="map-in-a-panel">
+<h2>Map in a Panel<a class="headerlink" href="#map-in-a-panel" title="Permalink to this headline">Â¶</a></h2>
+<p>GeoExt.MapPanel, dissected.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="mappanel-tutorial.html"><tt class="docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a><ul>
+<li class="toctree-l2"><a class="reference external" href="mappanel-tutorial.html#a-basic-mappanel">A Basic MapPanel</a></li>
+<li class="toctree-l2"><a class="reference external" href="mappanel-tutorial.html#working-with-the-mappanel">Working with the MapPanel</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="layer-tree-and-map-panel">
+<h2>Layer Tree and Map Panel<a class="headerlink" href="#layer-tree-and-map-panel" title="Permalink to this headline">Â¶</a></h2>
+<p>Working with OpenLayers layers and the Ext TreePanel</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="layertree-tutorial.html">Layer Tree Tutorial</a><ul>
+<li class="toctree-l2"><a class="reference external" href="layertree-tutorial.html#start-with-a-map">Start With a Map</a></li>
+<li class="toctree-l2"><a class="reference external" href="layertree-tutorial.html#filtering">Filtering</a></li>
+<li class="toctree-l2"><a class="reference external" href="layertree-tutorial.html#visibility-grouping">Visibility Grouping</a></li>
+<li class="toctree-l2"><a class="reference external" href="layertree-tutorial.html#layer-nodes-with-additional-radio-buttons">Layer Nodes with Additional Radio Buttons</a></li>
+<li class="toctree-l2"><a class="reference external" href="layertree-tutorial.html#sub-layers">Sub-Layers</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="configuring-map-tools">
+<h2>Configuring map tools<a class="headerlink" href="#configuring-map-tools" title="Permalink to this headline">Â¶</a></h2>
+<p>Working with OpenLayers Controls and Ext Button to create elements for
+user interaction.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="control-button-tutorial.html">Map Tool Tutorial</a><ul>
+<li class="toctree-l2"><a class="reference external" href="control-button-tutorial.html#openlayers-controls">OpenLayers Controls</a></li>
+<li class="toctree-l2"><a class="reference external" href="control-button-tutorial.html#extjs-buttons">ExtJS Buttons</a></li>
+<li class="toctree-l2"><a class="reference external" href="control-button-tutorial.html#there-can-be-only-one">There Can Be Only One</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="remote-features">
+<h2>Remote features<a class="headerlink" href="#remote-features" title="Permalink to this headline">Â¶</a></h2>
+<p>Fetching features and displaying in grid. Covers working OpenLayers
+Vector Feature with Ext Store and Grid</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="remote-features-tutorial.html">Vector Data Tutorial</a><ul>
+<li class="toctree-l2"><a class="reference external" href="remote-features-tutorial.html#reading-kml">Reading KML</a></li>
+</ul>
+</li>
+</ul>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="quickstart.html" title="GeoExt QuickStart"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../docs.html" title="Documentation"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Tutorials</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/remote-features-tutorial.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/remote-features-tutorial.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/remote-features-tutorial.html	(revision 76)
@@ -0,0 +1,265 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Vector Data Tutorial &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Tutorials" href="index.html" />
+    <link rel="next" title="Core Concepts" href="../primers/index.html" />
+    <link rel="prev" title="Map Tool Tutorial" href="control-button-tutorial.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Tutorials</a> &raquo;</li>
+        <li><a href="#">Vector Data Tutorial</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Vector Data Tutorial</a><ul>
+<li><a class="reference external" href="#reading-kml">Reading KML</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="control-button-tutorial.html"
+                                  title="previous chapter">Map Tool Tutorial</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../primers/index.html"
+                                  title="next chapter">Core Concepts</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="vector-data-tutorial">
+<h1>Vector Data Tutorial<a class="headerlink" href="#vector-data-tutorial" title="Permalink to this headline">Â¶</a></h1>
+<p>Base layers such as OpenStreetMap and Google Maps are generally distributed in
+pre-rendered tiles using file formats such as PNG or JPG. While these are great
+for <strong>displaying</strong> maps, they are not very useful for getting at the data behind
+a map. They don&#8217;t allow you to provide functionality such as informational
+popups, selection and highlighting of individual features, and editing of data.
+For these, you need to use <strong>vector data</strong>, provided through file formats such
+as KML, GeoJSON, or GML which provide information about each feature on the map,
+rather than just the pixels to put on the screen.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">Web browsers impose a same origin policy on JavaScript code to protect
+users from cross-site scripting attacks. This means that if your GeoExt
+application is hosted on a different host or port from your vector data, you
+will need to configure a proxy service.</p>
+</div>
+<div class="section" id="reading-kml">
+<h2>Reading KML<a class="headerlink" href="#reading-kml" title="Permalink to this headline">Â¶</a></h2>
+<p>As an introduction to using vector data in GeoExt, let&#8217;s create a simple map
+that displays data from a KML. Copy <a href="../_downloads/sundials.kml"><strong class="xref">this sample KML file</strong></a> to the same directory with your GeoExt and Ext libraries. Then
+we can load it with some JavaScript:</p>
+<div class="highlight-javascript"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre> 1
+ 2
+ 3
+ 4
+ 5
+ 6
+ 7
+ 8
+ 9
+10
+11
+12
+13
+14
+15
+16
+17
+18
+19
+20
+21
+22
+23
+24
+25
+26
+27
+28
+29
+30
+31
+32</pre></div></td><td class="code"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Openlayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">();</span>
+<span class="kd">var</span> <span class="nx">bluemarble</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+    <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+    <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+    <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">sundials</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">Vector</span><span class="p">(</span><span class="s2">&quot;Sundials&quot;</span><span class="p">);</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">bluemarble</span><span class="p">);</span>
+<span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">sundials</span><span class="p">);</span>
+
+<span class="kd">var</span> <span class="nx">store</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">FeatureStore</span><span class="p">({</span>
+    <span class="nx">layer</span><span class="o">:</span> <span class="nx">sundials</span><span class="p">,</span>
+    <span class="nx">proxy</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">ProtocolProxy</span><span class="p">({</span>
+        <span class="nx">protocol</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Protocol</span><span class="p">.</span><span class="nx">HTTP</span><span class="p">({</span>
+            <span class="nx">url</span><span class="o">:</span> <span class="s2">&quot;sundials.kml&quot;</span><span class="p">,</span>
+            <span class="nx">format</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Format</span><span class="p">.</span><span class="nx">KML</span><span class="p">()</span>
+        <span class="p">})</span>
+    <span class="p">}),</span>
+    <span class="nx">fields</span><span class="o">:</span> <span class="p">[</span>
+        <span class="p">{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;title&#39;</span><span class="p">,</span> <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;string&#39;</span><span class="p">},</span>
+        <span class="p">{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;description&#39;</span><span class="p">,</span> <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;string&#39;</span><span class="p">}</span>
+    <span class="p">],</span>
+    <span class="nx">autoLoad</span><span class="o">:</span> <span class="kc">true</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Sundials&quot;</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;mapPanel&#39;</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">600</span>
+<span class="p">});</span>
+</pre></div>
+</td></tr></table></div>
+<p>Here, we set up a map with two layers. <tt class="docutils literal"><span class="pre">bluemarble</span></tt> is a WMS layer, which you
+should have seen before in other tutorials. <tt class="docutils literal"><span class="pre">sundials</span></tt> is a vector layer,
+which handles client-side rendering of vector data.</p>
+<p>In <strong>line 10</strong> we initialize a <a title="GeoExt.data.FeatureStore" class="reference external" href="../lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a>. This class
+functions as a normal <tt class="docutils literal"><span class="pre">Ext.data.Store</span></tt> to interoperate with ExtJS classes, as
+well as providing the ability to <strong>bind</strong> to an <tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> in
+order to display features on a map. In this example, we set up the store
+completely through constructor parameters:</p>
+<blockquote>
+<dl class="docutils">
+<dt><tt class="docutils literal"><span class="pre">layer:</span> <span class="pre">sundials</span></tt></dt>
+<dd>tells the store to render features using the <tt class="docutils literal"><span class="pre">sundials</span></tt> layer. This is
+equivalent to calling <tt class="docutils literal"><span class="pre">store.bind(sundials)</span></tt> after initializing the
+store.</dd>
+<dt><tt class="docutils literal"><span class="pre">proxy:</span> <span class="pre">new</span> <span class="pre">GeoExt.data.ProtocolProxy(</span></tt></dt>
+<dd>tells the store to use a <tt class="docutils literal"><span class="pre">ProtocolProxy</span></tt> for fetching features.
+<tt class="docutils literal"><span class="pre">ProtocolProxy</span></tt> wraps OpenLayers Protocol objects. Here we use an
+<tt class="docutils literal"><span class="pre">OpenLayers.Protocol.HTTP</span></tt> to fetch data over the web. The <tt class="docutils literal"><span class="pre">HTTP</span></tt>
+protocol works with a variety of <tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt> types; here we
+use <tt class="docutils literal"><span class="pre">KML</span></tt> to match our dataset. You can see all the available
+<tt class="docutils literal"><span class="pre">Protocol</span></tt>s and <tt class="docutils literal"><span class="pre">Format</span></tt>s in the <a class="reference external" href="http://openlayers.org">OpenLayers API documentation</a>.</dd>
+<dt><tt class="docutils literal"><span class="pre">fields:</span> <span class="pre">[...]</span></tt></dt>
+<dd>tells the store which extra properties (aside from just the geometry) to
+look for. Here, we know that KML includes a <tt class="docutils literal"><span class="pre">title</span></tt> and a
+<tt class="docutils literal"><span class="pre">description</span></tt> for each point, and that both are string values.</dd>
+<dt><tt class="docutils literal"><span class="pre">autoLoad:</span> <span class="pre">true</span></tt></dt>
+<dd>tells the store to go ahead and fetch the feature data as soon as the
+constructor finishes. This is equivalent to calling <tt class="docutils literal"><span class="pre">store.load()</span></tt>
+after the store is initialized.</dd>
+</dl>
+</blockquote>
+<p>Now we have a map with a background and some data hosted on our server. It looks
+like any other map; we can pan and zoom normally to navigate around.</p>
+<p>However, since GeoExt has access to the data <em>behind</em> the map, we now have some
+options that weren&#8217;t available to us before. For example, we can add a control
+that allows us to view the features in a tabular format:</p>
+<div class="highlight-javascript"><table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre>1
+2
+3
+4
+5
+6
+7
+8
+9</pre></div></td><td class="code"><div class="highlight"><pre><span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">grid</span><span class="p">.</span><span class="nx">GridPanel</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Sundials&#39;</span><span class="p">,</span>
+    <span class="nx">store</span><span class="o">:</span> <span class="nx">store</span>
+    <span class="nx">columns</span><span class="o">:</span> <span class="p">[{</span><span class="nx">heading</span><span class="o">:</span> <span class="s1">&#39;Title&#39;</span><span class="p">,</span> <span class="nx">dataIndex</span><span class="o">:</span> <span class="s1">&#39;title&#39;</span><span class="p">},</span>
+              <span class="p">{</span><span class="nx">heading</span><span class="o">:</span> <span class="s1">&#39;Description&#39;</span><span class="p">,</span> <span class="nx">dataIndex</span><span class="o">:</span> <span class="s1">&#39;description&#39;</span><span class="p">}],</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;grid&quot;</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">600</span>
+<span class="p">});</span>
+</pre></div>
+</td></tr></table></div>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../primers/index.html" title="Core Concepts"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="control-button-tutorial.html" title="Map Tool Tutorial"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Tutorials</a> &raquo;</li>
+        <li><a href="#">Vector Data Tutorial</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/control-button-tutorial.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/control-button-tutorial.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/control-button-tutorial.html	(revision 76)
@@ -0,0 +1,250 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Map Tool Tutorial &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Tutorials" href="index.html" />
+    <link rel="next" title="Vector Data Tutorial" href="remote-features-tutorial.html" />
+    <link rel="prev" title="Layer Tree Tutorial" href="layertree-tutorial.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Tutorials</a> &raquo;</li>
+        <li><a href="#">Map Tool Tutorial</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Map Tool Tutorial</a><ul>
+<li><a class="reference external" href="#openlayers-controls">OpenLayers Controls</a></li>
+<li><a class="reference external" href="#extjs-buttons">ExtJS Buttons</a></li>
+<li><a class="reference external" href="#there-can-be-only-one">There Can Be Only One</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="layertree-tutorial.html"
+                                  title="previous chapter">Layer Tree Tutorial</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="remote-features-tutorial.html"
+                                  title="next chapter">Vector Data Tutorial</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="map-tool-tutorial">
+<h1>Map Tool Tutorial<a class="headerlink" href="#map-tool-tutorial" title="Permalink to this headline">Â¶</a></h1>
+<p>Okay, so now you know how to <a class="reference external" href="mappanel-tutorial.html"><em>add a map to a web page</em></a>
+and load some data into it. Your users can drag and zoom to their hearts&#8217;
+content. You even followed the <a class="reference external" href="layertree-tutorial.html"><em>Layer Tree Tutorial</em></a> so they could switch
+between different datasets. (You did follow that tutorial, right?) But now you
+want to do more than just view some pretty pictures. You want to let your users
+analyze data, or get more info about particular features on your map, or just
+draw things. Basically, you want to give them some <strong>tools</strong>.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">This tutorial makes heavy use of the OpenLayers mapping library.  If
+you&#8217;re not familiar with it, you might want to take a look at the
+<a class="reference external" href="../primers/openlayers-primer.html"><em>Primer: OpenLayers</em></a> before moving forward.</p>
+</div>
+<div class="section" id="openlayers-controls">
+<h2>OpenLayers Controls<a class="headerlink" href="#openlayers-controls" title="Permalink to this headline">Â¶</a></h2>
+<p>In <a class="reference external" href="http://openlayers.org/">OpenLayers</a>, these tools for interacting with a
+map are called <tt class="docutils literal"><span class="pre">Controls</span></tt>. For the purposes of this tutorial, we&#8217;ll just
+stick to the <tt class="docutils literal"><span class="pre">Measure</span></tt> control, a handy little tool that lets you draw a line
+on the map and tells you its length in real-world units.</p>
+<div class="admonition-see-also admonition seealso">
+<p class="first admonition-title">See also</p>
+<p class="last">The OpenLayer API documentation for a comprehensive listing of standard controls.</p>
+</div>
+</div>
+<div class="section" id="extjs-buttons">
+<h2>ExtJS Buttons<a class="headerlink" href="#extjs-buttons" title="Permalink to this headline">Â¶</a></h2>
+<p>While OpenLayers <tt class="docutils literal"><span class="pre">Control</span></tt>s provide a number of excellent ways of
+interacting with maps, they have only limited support for actually manipulating
+the controls; ie, choosing which tool to use and providing user feedback about
+which tool is active. ExtJS provides a richer array of options for managing
+tools. Here is the idiomatic way to create an <tt class="docutils literal"><span class="pre">Ext.Button</span></tt> which activates and
+deactivates an OpenLayers <tt class="docutils literal"><span class="pre">Control</span></tt>, and stays depressed while the control
+is active:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">control</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Measure</span><span class="p">(</span><span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Handler</span><span class="p">.</span><span class="nx">Path</span><span class="p">,</span> <span class="p">{</span>
+    <span class="nx">eventListeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">measure</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">evt</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;The measurement was &quot;</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">measure</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">units</span><span class="p">);</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+
+<span class="nx">mapPanel</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addControl</span><span class="p">(</span><span class="nx">control</span><span class="p">);</span>
+<span class="kd">var</span> <span class="nx">button</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Button</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;Measure Things&#39;</span><span class="p">,</span>
+    <span class="nx">enableToggle</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">toggled</span><span class="p">){</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">toggled</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">control</span><span class="p">.</span><span class="nx">activate</span><span class="p">();</span>
+        <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+            <span class="nx">control</span><span class="p">.</span><span class="nx">deactivate</span><span class="p">();</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>The <tt class="docutils literal"><span class="pre">Button</span></tt> can be added to an ExtJS toolbar or to a panel, in whatever
+layout we choose. For example, you could add the button to a <tt class="docutils literal"><span class="pre">MapPanel</span></tt>&#8216;s
+top toolbar:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">mapPanel</span><span class="p">.</span><span class="nx">getTopToolbar</span><span class="p">().</span><span class="nx">addButton</span><span class="p">(</span><span class="nx">button</span><span class="p">);</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="there-can-be-only-one">
+<h2>There Can Be Only One<a class="headerlink" href="#there-can-be-only-one" title="Permalink to this headline">Â¶</a></h2>
+<p>In general, when you have multiple tools associated with a map, you want to
+avoid having more than one tool active at the same time. It would be somewhat
+confusing if the user starts deleting data while he or she is trying to find the
+distance from one end of town to the other! Fortunately, ExtJS makes it very
+simple to ensure that only one toggle button from a group is toggled at a time,
+through the <tt class="docutils literal"><span class="pre">toggleGroup</span></tt> property of the <tt class="docutils literal"><span class="pre">Button</span></tt> object. This is a string
+identifying a group of buttons, only one of which can be pressed at a time.
+Let&#8217;s extend our example from before, this time adding the option to measure
+area instead of length:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">length</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Measure</span><span class="p">(</span><span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Handler</span><span class="p">.</span><span class="nx">Path</span><span class="p">,</span> <span class="p">{</span>
+    <span class="nx">eventListeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">measure</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">evt</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;The length was &quot;</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">measure</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">units</span><span class="p">);</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">area</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Measure</span><span class="p">(</span><span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Handler</span><span class="p">.</span><span class="nx">Polygon</span><span class="p">,</span> <span class="p">{</span>
+    <span class="nx">eventListeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">measure</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">evt</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;The area was &quot;</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">measure</span> <span class="o">+</span> <span class="nx">evt</span><span class="p">.</span><span class="nx">units</span><span class="p">);</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+
+<span class="nx">mapPanel</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addControl</span><span class="p">(</span><span class="nx">length</span><span class="p">);</span>
+<span class="nx">mapPanel</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addControl</span><span class="p">(</span><span class="nx">area</span><span class="p">);</span>
+
+<span class="kd">var</span> <span class="nx">toggleGroup</span> <span class="o">=</span> <span class="s2">&quot;measure controls&quot;</span><span class="p">;</span>
+
+<span class="kd">var</span> <span class="nx">lengthButton</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Button</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;Measure Length&#39;</span><span class="p">,</span>
+    <span class="nx">enableToggle</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">toggleGroup</span><span class="o">:</span> <span class="nx">toggleGroup</span><span class="p">,</span>
+    <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">toggled</span><span class="p">){</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">toggled</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">length</span><span class="p">.</span><span class="nx">activate</span><span class="p">();</span>
+        <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+            <span class="nx">length</span><span class="p">.</span><span class="nx">deactivate</span><span class="p">();</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">area</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Button</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s1">&#39;Measure Area&#39;</span><span class="p">,</span>
+    <span class="nx">enableToggle</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">toggleGroup</span><span class="o">:</span> <span class="nx">toggleGroup</span><span class="p">,</span>
+    <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">toggled</span><span class="p">){</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">toggled</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">area</span><span class="p">.</span><span class="nx">activate</span><span class="p">();</span>
+        <span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
+            <span class="nx">area</span><span class="p">.</span><span class="nx">deactivate</span><span class="p">();</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>All right, you&#8217;ve got all you need to add and activate tools to help users get
+the most out of your maps.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="remote-features-tutorial.html" title="Vector Data Tutorial"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="layertree-tutorial.html" title="Layer Tree Tutorial"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Tutorials</a> &raquo;</li>
+        <li><a href="#">Map Tool Tutorial</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/quickstart.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/quickstart.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/tutorials/quickstart.html	(revision 76)
@@ -0,0 +1,250 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt QuickStart &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="Tutorials" href="index.html" />
+    <link rel="next" title="MapPanel Tutorial" href="mappanel-tutorial.html" />
+    <link rel="prev" title="Tutorials" href="index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">Tutorials</a> &raquo;</li>
+        <li><a href="#">GeoExt QuickStart</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">GeoExt QuickStart</a><ul>
+<li><a class="reference external" href="#getting-geoext">Getting GeoExt</a></li>
+<li><a class="reference external" href="#basic-example">Basic Example</a></li>
+<li><a class="reference external" href="#going-further">Going Further</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="index.html"
+                                  title="previous chapter">Tutorials</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="mappanel-tutorial.html"
+                                  title="next chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">MapPanel</span></tt> Tutorial</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-quickstart">
+<h1>GeoExt QuickStart<a class="headerlink" href="#geoext-quickstart" title="Permalink to this headline">Â¶</a></h1>
+<p>Welcome to GeoExt!  This document is intended to help you get started
+with GeoExt.  With GeoExt, you can start from nothing and have a rich
+mapping application in seconds.</p>
+<div class="section" id="getting-geoext">
+<h2>Getting GeoExt<a class="headerlink" href="#getting-geoext" title="Permalink to this headline">Â¶</a></h2>
+<p>GeoExt is built on top of the robust OpenLayers JavaScript mapping
+library and the rich graphical components of ExtJS.  For licensing
+reasons, ExtJS cannot be included in the GeoExt download, so preparing
+GeoExt for use on your own web pages is a multi-step process:</p>
+<ol class="arabic simple">
+<li>Download GeoExt from the <a class="reference external" href="../downloads.html"><em>downloads page</em></a>. For the purposes
+of this quickstart, the development version will be fine.</li>
+<li>Download OpenLayers 2.10 or later from <a class="reference external" href="http://openlayers.org/">http://openlayers.org/</a>.</li>
+<li>Download ExtJS 3.2 from <a class="reference external" href="http://www.sencha.com/products/js/download.php">the ExtJS website</a>.</li>
+<li>Place both unpacked libraries in a directory that is published by your web
+server. For this tutorial, I will assume that this is the root of your web
+server, so that GeoExt.js is at <a class="reference external" href="http://localhost/GeoExt/lib/GeoExt.js">http://localhost/GeoExt/lib/GeoExt.js</a> and
+ext-all.js is at <a class="reference external" href="http://localhost/ext-3.2.1/ext-all.js">http://localhost/ext-3.2.1/ext-all.js</a></li>
+<li>Now you&#8217;re ready to use GeoExt in your application!</li>
+</ol>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">For production environments, the GeoExt team recommends that
+you use compressed and minified builds of GeoExt and ExtJS to
+optimize the download size of your page.  A generic minified build
+containing all of GeoExt is available from the
+<a class="reference external" href="../downloads.html"><em>downloads page</em></a>, but advanced users can build their
+own.</p>
+</div>
+</div>
+<div class="section" id="basic-example">
+<h2>Basic Example<a class="headerlink" href="#basic-example" title="Permalink to this headline">Â¶</a></h2>
+<p>Let&#8217;s build a simple web page that just embeds a map with interactive
+navigation.</p>
+<ol class="arabic">
+<li><p class="first">Include the ExtJS libraries in your web page.</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/adapter/ext/ext-base.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/ext-all.js&quot;</span>  <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span> <span class="na">href=</span><span class="s">&quot;ext-3.2.1/resources/ext-all.css&quot;</span><span class="nt">&gt;&lt;/link&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;OpenLayers/OpenLayers.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;GeoExt/lib/GeoExt.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span> <span class="na">href=</span><span class="s">&quot;GeoExt/resources/geoext-all-debug.css&quot;</span><span class="nt">&gt;&lt;/link&gt;</span>
+</pre></div>
+</div>
+</li>
+<li><p class="first">Create a <tt class="docutils literal"><span class="pre">&lt;div&gt;</span></tt> element in your web page with its <tt class="docutils literal"><span class="pre">id</span></tt>
+attribute set to <tt class="docutils literal"><span class="pre">gxmap</span></tt>.  We will use the <tt class="docutils literal"><span class="pre">id</span></tt> to attach a
+GeoExt component to the <tt class="docutils literal"><span class="pre">div</span></tt>.</p>
+</li>
+<li><p class="first">Attach a <tt class="docutils literal"><span class="pre">MapPanel</span></tt> object to the <tt class="docutils literal"><span class="pre">div</span></tt> with some JavaScript code:</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">onReady</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">();</span>
+        <span class="kd">var</span> <span class="nx">layer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+            <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+            <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+        <span class="p">);</span>
+        <span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">layer</span><span class="p">);</span>
+
+        <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+            <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;gxmap&#39;</span><span class="p">,</span>
+            <span class="nx">height</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+            <span class="nx">width</span><span class="o">:</span> <span class="mi">600</span><span class="p">,</span>
+            <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+            <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;A Simple GeoExt Map&#39;</span>
+        <span class="p">});</span>
+    <span class="p">});</span>
+<span class="nt">&lt;/script&gt;</span>
+</pre></div>
+</div>
+</li>
+</ol>
+<p>The entire source of your page should look something like:</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;html&gt;</span>
+<span class="nt">&lt;head&gt;</span>
+
+<span class="nt">&lt;title&gt;</span> A Basic GeoExt Page <span class="nt">&lt;/title&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/adapter/ext/ext-base.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;ext-3.2.1/ext-all.js&quot;</span>  <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span> <span class="na">href=</span><span class="s">&quot;ext-3.2.1/resources/ext-all.css&quot;</span><span class="nt">&gt;&lt;/link&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;OpenLayers/OpenLayers.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;GeoExt/lib/GeoExt.js&quot;</span> <span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span> <span class="na">href=</span><span class="s">&quot;GeoExt/resources/geoext-all-debug.css&quot;</span><span class="nt">&gt;&lt;/link&gt;</span>
+
+<span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">onReady</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Map</span><span class="p">();</span>
+        <span class="kd">var</span> <span class="nx">layer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+            <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+            <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+        <span class="p">);</span>
+        <span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">layer</span><span class="p">);</span>
+
+        <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+            <span class="nx">renderTo</span><span class="o">:</span> <span class="s1">&#39;gxmap&#39;</span><span class="p">,</span>
+            <span class="nx">height</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+            <span class="nx">width</span><span class="o">:</span> <span class="mi">600</span><span class="p">,</span>
+            <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+            <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;A Simple GeoExt Map&#39;</span>
+        <span class="p">});</span>
+    <span class="p">});</span>
+<span class="nt">&lt;/script&gt;</span>
+<span class="nt">&lt;/head&gt;</span>
+<span class="nt">&lt;body&gt;</span>
+<span class="nt">&lt;div</span> <span class="na">id=</span><span class="s">&quot;gxmap&quot;</span><span class="nt">&gt;&lt;/div&gt;</span>
+<span class="nt">&lt;/body&gt;</span>
+<span class="nt">&lt;/html&gt;</span>
+</pre></div>
+</div>
+<p>And that&#8217;s it! You now have all of GeoExt, ready to bring your geospatial data
+to life. Go forth and prosper!</p>
+</div>
+<div class="section" id="going-further">
+<h2>Going Further<a class="headerlink" href="#going-further" title="Permalink to this headline">Â¶</a></h2>
+<p>From here, there are a wide variety of options available for making
+customized, highly interactive mapping applications with GeoExt.  To
+learn more take a look at <a class="reference external" href="index.html"><em>Tutorials</em></a>, <a class="reference external" href="../examples.html#examples"><em>examples</em></a> and
+<a class="reference external" href="../lib/index.html"><em>API Reference</em></a>.</p>
+<p>We also recommend reading <a class="reference external" href="../primers/ext-primer.html"><em>Primer: Ext</em></a> and
+<a class="reference external" href="../primers/openlayers-primer.html"><em>Primer: OpenLayers</em></a> to become acquainted with the libraries that
+form the foundation of GeoExt.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="mappanel-tutorial.html" title="MapPanel Tutorial"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="index.html" title="Tutorials"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >Tutorials</a> &raquo;</li>
+        <li><a href="#">GeoExt QuickStart</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/geoext.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/geoext.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/geoext.css	(revision 76)
@@ -0,0 +1,252 @@
+@import url(http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css);
+
+@import url(sphinxdoc.css);
+
+/* override some of ext-all.css */
+ul, ol {
+    margin: 14px 0;
+    padding-left: 40px;
+}
+ul {
+    list-style: disc;
+}
+ol {
+    list-style-type:decimal;
+}
+strong {
+    font-weight: bolder;
+}
+
+/* override some of sphinxdoc.css */
+html {
+    margin: 0;
+    padding: 0;
+}
+body {
+    border: none;
+    background-color: white;
+    margin: 0;
+    padding: 0;
+    min-width: 900px;
+}
+h1, h2, h3, h4, h5, h6 {
+    color: #385F95;
+}
+table td, table th {
+    padding: 0;
+}
+div.related {
+    margin: 0 80px;
+    width: auto;
+}
+div.related ul {
+    border: 1px solid #EEEEEE;
+}
+div.bodywrapper {
+    border-right: 0;
+}
+a.reference em {
+    font-style: normal;
+}
+div.sphinxsidebar {
+    padding-right: 95px;
+}
+div.sphinxsidebar h3, div.sphinxsidebar h4 {
+    background: inherit;
+    border: none;
+    color: #385F95;
+    padding: 0;
+}
+div.sphinxsidebar h3 a {
+    color: inherit;
+}
+div.document {
+    margin: 0 80px;
+}
+div.documentwrapper {
+    width: auto;
+    border-left: 1px solid #EEEEEE;
+    border-right: 1px solid #EEEEEE;
+}
+div.footer {
+    background: #4E7AB2 url(img/footer-bg.png) repeat-x;
+    color: #d9d9d9;
+    padding: 60px 0 35px;
+    text-align: center;
+}
+
+/* custom header */
+div.header {
+    position: relative;
+    overflow: hidden;
+    height: 120px;
+    background: #97b7e1 url(img/header-bg.png) 0 0 repeat-x;
+}
+div.header div.wrap {
+    margin: 0 80px;
+}
+#logo {
+    padding: 0;
+}
+#logo a {
+    float: left;
+    width: 300px;
+    height: 120px;
+    overflow: hidden;
+    text-indent: -9999em;
+    background: url(img/geoext-logo.png) no-repeat;
+}
+#top-nav {
+    position: absolute;
+    bottom: 22px;
+    right: 90px;
+    list-style: none;
+    margin: 0;
+}
+
+#top-nav li {
+    display: inline;
+    margin: 0;
+    padding: 0 8px;
+    border-left: 1px solid #fff;
+}
+
+#top-nav li:first-child, #top-nav li.first {
+    border-left: 0;
+}
+
+#top-nav li a {
+    color: #fff;
+    font-weight: bold;
+    text-decoration: none;
+    font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
+}
+
+#top-nav li a:hover {
+    color: #e0e0e0;
+}
+
+/* search box style */
+#searchbox {
+    position: absolute;
+    bottom: 70px;
+    right: 95px;
+    background: transparent url(img/search-box.png) top left no-repeat;
+    height: 28px;
+    width: 190px;
+}
+#searchbox-query {
+    color: #72a629;
+    font-size: 0.92em;
+    border: 0;
+    background: transparent;
+    width: 175px;
+    margin: 5px 0 0 8px;
+}
+#searchbox-submit {
+    position: absolute;
+    top: 6px;
+    right: 5px;
+}
+a.headerlink {
+    display: none;
+}
+
+/* meta-info about a class/module get pulled out */
+.meta {
+    float: right;
+    padding: 0 2em;
+    background-color: white;
+}
+.meta ul {
+    list-style-type: none;
+    padding: 0;
+}
+
+/* overriding clear: both on dl */
+dl.class {
+    clear: left;
+}
+
+/* don't display class names for attributes or methods*/
+.attribute .descclassname {
+    display: none;
+}
+.method .descclassname {
+    display: none;
+}
+.classmethod .descclassname, .classmethod .property {
+    display: none;
+}
+
+/* headers with bottom border get some padding */
+h2, h3, h4 {
+    padding-bottom: 4px;
+}
+
+/* making code samples less gigantic */
+pre {
+    font-size: 0.8em;
+}
+
+/* blog entry style */
+ul.rss_items li.rss_item {
+    padding-bottom: 0.5em;
+}
+
+/* execute button style */
+.x-btn.execute {
+    margin: 1em;
+}
+
+.exampleblock {
+    width: 225px;
+    margin: 5px;
+    height: 110px;
+    overflow: auto;
+}
+.exampleblock h2 {
+    margin-top: 0;
+    font-size: 1em;
+}
+a.examplelink {
+    margin: 5px;
+    text-decoration: none !important;
+    float: left;
+    display: block;
+    border: 1px solid #FFFFFF;
+}
+a.examplelink:hover {
+    border: 1px solid #E5EDD3;
+    background-color: #F5FDE3
+}
+
+
+/* builder page style */
+div.builder-form {
+    margin-top: 1em;
+}
+.module-desc {
+    padding: 0 0 5px;
+    font-size: 12px;
+}
+.component label {
+    font-family: "Lucida Console", "Courier New", Courier, monospace;
+    font-size: 11px;
+}
+
+div.download-button {
+    margin: 0 1em 2em;
+}
+div.download-button>table {
+    float: right;
+}
+
+.x-btn .download {
+    background-image: url(img/disk.png);
+}
+
+p.credit {
+    font-size: smaller;
+    color: #666666;
+}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v1.0.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v1.0.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v1.0.js	(revision 76)
@@ -0,0 +1,47 @@
+builder.modules = {
+    "GeoExt/widgets": {
+        title: "General",
+        description: "General widget components.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/form": {
+        title: "Form",
+        description: "Components for assembling forms.",
+        prefix: "GeoExt.form"
+    },
+    "GeoExt/widgets/grid": {
+        title: "Grid",
+        description: "Components related to grid widgets.",
+        prefix: "GeoExt.grid"
+    },
+    "GeoExt/widgets/tips": {
+        title: "Tips",
+        description: "Custom tool tips.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/tree": {
+        title: "Tree",
+        description: "Components related to tree nodes.",
+        prefix: "GeoExt.tree"
+    },
+    "GeoExt/data": {
+        title: "Data",
+        description: "Utilities for working with records and stores.",
+        prefix: "GeoExt.data"
+    },
+    "GeoExt/plugins": {
+        title: "Plugins",
+        description: "Plugins to enhance functionality of other components.",
+        prefix: "GeoExt.plugins"
+    },
+    "GeoExt/state": {
+        title: "State",
+        description: "Utilities for encoding and decoding state representations.",
+        prefix: "GeoExt.state"
+    },
+    "overrides": {
+        title: "Overrides",
+        description: "Independent overrides of Ext provided functionality.",
+        prefix: ""
+    }
+};  
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/sphinxdoc.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/sphinxdoc.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/sphinxdoc.css	(revision 76)
@@ -0,0 +1,327 @@
+/**
+ * Sphinx stylesheet -- sphinxdoc theme
+ * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ *
+ * Originally created by Armin Ronacher for Werkzeug, adapted by Georg Brandl.
+ */
+
+@import url("basic.css");
+
+/* -- page layout ----------------------------------------------------------- */
+
+body {
+    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva',
+                 'Verdana', sans-serif;
+    font-size: 14px;
+    letter-spacing: -0.01em;
+    line-height: 150%;
+    text-align: center;
+    background-color: #BFD1D4;
+    color: black;
+    padding: 0;
+    border: 1px solid #aaa;
+
+    margin: 0px 80px 0px 80px;
+    min-width: 740px;
+}
+
+div.documentwrapper {
+    float: none;
+}
+
+div.document {
+    background-color: white;
+    text-align: left;
+    background-image: url(contents.png);
+    background-repeat: repeat-x;
+}
+
+div.bodywrapper {
+    margin: 0 240px 0 0;
+    border-right: 1px solid #ccc;
+}
+
+div.body {
+    margin: 0;
+    padding: 0.5em 20px 20px 20px;
+}
+
+div.related {
+    font-size: 1em;
+}
+
+div.related ul {
+    background-image: url(navigation.png);
+    height: 2em;
+    border-top: 1px solid #ddd;
+    border-bottom: 1px solid #ddd;
+}
+
+div.related ul li {
+    margin: 0;
+    padding: 0;
+    height: 2em;
+    float: left;
+}
+
+div.related ul li.right {
+    float: right;
+    margin-right: 5px;
+}
+
+div.related ul li a {
+    margin: 0;
+    padding: 0 5px 0 5px;
+    line-height: 1.75em;
+    color: #EE9816;
+}
+
+div.related ul li a:hover {
+    color: #3CA8E7;
+}
+
+div.sphinxsidebarwrapper {
+    padding: 0;
+}
+
+div.sphinxsidebar {
+    margin: 0;
+    padding: 0.5em 15px 15px 0;
+    width: 210px;
+    float: right;
+    font-size: 1em;
+    text-align: left;
+}
+
+div.sphinxsidebar h3, div.sphinxsidebar h4 {
+    margin: 1em 0 0.5em 0;
+    font-size: 1em;
+    padding: 0.1em 0 0.1em 0.5em;
+    color: white;
+    border: 1px solid #86989B;
+    background-color: #AFC1C4;
+}
+
+div.sphinxsidebar h3 a {
+    color: white;
+}
+
+div.sphinxsidebar ul {
+    padding-left: 1.5em;
+    margin-top: 7px;
+    padding: 0;
+    line-height: 130%;
+}
+
+div.sphinxsidebar ul ul {
+    margin-left: 20px;
+}
+
+div.footer {
+    background-color: #E3EFF1;
+    color: #86989B;
+    padding: 3px 8px 3px 0;
+    clear: both;
+    font-size: 0.8em;
+    text-align: right;
+}
+
+div.footer a {
+    color: #86989B;
+    text-decoration: underline;
+}
+
+/* -- body styles ----------------------------------------------------------- */
+
+p {    
+    margin: 0.8em 0 0.5em 0;
+}
+
+a {
+    color: #CA7900;
+    text-decoration: none;
+}
+
+a:hover {
+    color: #2491CF;
+}
+
+div.body a {
+    text-decoration: underline;
+}
+
+h1 {
+    margin: 0;
+    padding: 0.7em 0 0.3em 0;
+    font-size: 1.5em;
+    color: #11557C;
+}
+
+h2 {
+    margin: 1.3em 0 0.2em 0;
+    font-size: 1.35em;
+    padding: 0;
+}
+
+h3 {
+    margin: 1em 0 -0.3em 0;
+    font-size: 1.2em;
+}
+
+div.body h1 a, div.body h2 a, div.body h3 a, div.body h4 a, div.body h5 a, div.body h6 a {
+    color: black!important;
+}
+
+h1 a.anchor, h2 a.anchor, h3 a.anchor, h4 a.anchor, h5 a.anchor, h6 a.anchor {
+    display: none;
+    margin: 0 0 0 0.3em;
+    padding: 0 0.2em 0 0.2em;
+    color: #aaa!important;
+}
+
+h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor,
+h5:hover a.anchor, h6:hover a.anchor {
+    display: inline;
+}
+
+h1 a.anchor:hover, h2 a.anchor:hover, h3 a.anchor:hover, h4 a.anchor:hover,
+h5 a.anchor:hover, h6 a.anchor:hover {
+    color: #777;
+    background-color: #eee;
+}
+
+a.headerlink {
+    color: #c60f0f!important;
+    font-size: 1em;
+    margin-left: 6px;
+    padding: 0 4px 0 4px;
+    text-decoration: none!important;
+}
+
+a.headerlink:hover {
+    background-color: #ccc;
+    color: white!important;
+}
+
+cite, code, tt {
+    font-family: 'Consolas', 'Deja Vu Sans Mono',
+                 'Bitstream Vera Sans Mono', monospace;
+    font-size: 0.95em;
+    letter-spacing: 0.01em;
+}
+
+tt {
+    background-color: #f2f2f2;
+    border-bottom: 1px solid #ddd;
+    color: #333;
+}
+
+tt.descname, tt.descclassname, tt.xref {
+    border: 0;
+}
+
+hr {
+    border: 1px solid #abc;
+    margin: 2em;
+}
+
+a tt {
+    border: 0;
+    color: #CA7900;
+}
+
+a tt:hover {
+    color: #2491CF;
+}
+
+pre {
+    font-family: 'Consolas', 'Deja Vu Sans Mono',
+                 'Bitstream Vera Sans Mono', monospace;
+    font-size: 0.95em;
+    letter-spacing: 0.015em;
+    line-height: 120%;
+    padding: 0.5em;
+    border: 1px solid #ccc;
+    background-color: #f8f8f8;
+}
+
+pre a {
+    color: inherit;
+    text-decoration: underline;
+}
+
+td.linenos pre {
+    padding: 0.5em 0;
+}
+
+div.quotebar {
+    background-color: #f8f8f8;
+    max-width: 250px;
+    float: right;
+    padding: 2px 7px;
+    border: 1px solid #ccc;
+}
+
+div.topic {
+    background-color: #f8f8f8;
+}
+
+table {
+    border-collapse: collapse;
+    margin: 0 -0.5em 0 -0.5em;
+}
+
+table td, table th {
+    padding: 0.2em 0.5em 0.2em 0.5em;
+}
+
+div.admonition, div.warning {
+    font-size: 0.9em;
+    margin: 1em 0 1em 0;
+    border: 1px solid #86989B;
+    background-color: #f7f7f7;
+    padding: 0;
+}
+
+div.admonition p, div.warning p {
+    margin: 0.5em 1em 0.5em 1em;
+    padding: 0;
+}
+
+div.admonition pre, div.warning pre {
+    margin: 0.4em 1em 0.4em 1em;
+}
+
+div.admonition p.admonition-title,
+div.warning p.admonition-title {
+    margin: 0;
+    padding: 0.1em 0 0.1em 0.5em;
+    color: white;
+    border-bottom: 1px solid #86989B;
+    font-weight: bold;
+    background-color: #AFC1C4;
+}
+
+div.warning {
+    border: 1px solid #940000;
+}
+
+div.warning p.admonition-title {
+    background-color: #CF0000;
+    border-bottom-color: #940000;
+}
+
+div.admonition ul, div.admonition ol,
+div.warning ul, div.warning ol {
+    margin: 0.1em 0.5em 0.5em 3em;
+    padding: 0;
+}
+
+div.versioninfo {
+    margin: 1em 0 0 0;
+    border: 1px solid #ccc;
+    background-color: #DDEAF0;
+    padding: 8px;
+    line-height: 1.3em;
+    font-size: 0.9em;
+}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.6.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.6.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.6.js	(revision 76)
@@ -0,0 +1,37 @@
+builder.modules = {
+    "GeoExt/widgets": {
+        title: "General",
+        description: "General widget components.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/form": {
+        title: "Form",
+        description: "Components for assembling forms.",
+        prefix: "GeoExt.form"
+    },
+    "GeoExt/widgets/grid": {
+        title: "Grid",
+        description: "Components related to grid widgets.",
+        prefix: "GeoExt.grid"
+    },
+    "GeoExt/widgets/tips": {
+        title: "Tips",
+        description: "Custom tool tips.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/tree": {
+        title: "Tree",
+        description: "Components related to tree nodes.",
+        prefix: "GeoExt.tree"
+    },
+    "GeoExt/data": {
+        title: "Data",
+        description: "Utilities for working with records and stores.",
+        prefix: "GeoExt.data"
+    },
+    "overrides": {
+        title: "Overrides",
+        description: "Independent overrides of Ext provided functionality.",
+        prefix: ""
+    }
+};  
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.7.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.7.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder-v0.7.js	(revision 76)
@@ -0,0 +1,47 @@
+builder.modules = {
+    "GeoExt/widgets": {
+        title: "General",
+        description: "General widget components.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/form": {
+        title: "Form",
+        description: "Components for assembling forms.",
+        prefix: "GeoExt.form"
+    },
+    "GeoExt/widgets/grid": {
+        title: "Grid",
+        description: "Components related to grid widgets.",
+        prefix: "GeoExt.grid"
+    },
+    "GeoExt/widgets/tips": {
+        title: "Tips",
+        description: "Custom tool tips.",
+        prefix: "GeoExt"
+    },
+    "GeoExt/widgets/tree": {
+        title: "Tree",
+        description: "Components related to tree nodes.",
+        prefix: "GeoExt.tree"
+    },
+    "GeoExt/data": {
+        title: "Data",
+        description: "Utilities for working with records and stores.",
+        prefix: "GeoExt.data"
+    },
+    "GeoExt/plugins": {
+        title: "Plugins",
+        description: "Plugins to enhance functionality of other components.",
+        prefix: "GeoExt.plugins"
+    },
+    "GeoExt/state": {
+        title: "State",
+        description: "Utilities for encoding and decoding state representations.",
+        prefix: "GeoExt.state"
+    },
+    "overrides": {
+        title: "Overrides",
+        description: "Independent overrides of Ext provided functionality.",
+        prefix: ""
+    }
+};  
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/examples.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/examples.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/examples.js	(revision 76)
@@ -0,0 +1,21 @@
+Ext.onReady(function() {
+    var blocks = Ext.select("div.exampleblock");
+    var loc = window.location.href;
+    var exbase = "../examples/"
+    if (/^http:\/\/(www\.)?geoext.org\/examples.html/.test(loc)) {
+        exbase = "http://api.geoext.org/" + docversion + "/examples/";
+    } else if (/^http:\/\/dev.geoext.org\/docs\/examples.html/.test(loc)) {
+        exbase = "http://dev.geoext.org/trunk/geoext/examples/";
+    }
+    blocks.each(function(el) {
+        el.wrap({
+            tag: "a", 
+            href: el.first().id.replace(
+                /^example-(.*)/, 
+                exbase + "$1.html"
+            ),
+            cls: "examplelink",
+            target: "_blank"
+        });
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/jquery.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/jquery.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/jquery.js	(revision 76)
@@ -0,0 +1,32 @@
+/*
+ * jQuery 1.2.6 - New Wave Javascript
+ *
+ * Copyright (c) 2008 John Resig (jquery.com)
+ * Dual licensed under the MIT (MIT-LICENSE.txt)
+ * and GPL (GPL-LICENSE.txt) licenses.
+ *
+ * $Date: 2008-05-24 14:22:17 -0400 (Sat, 24 May 2008) $
+ * $Rev: 5685 $
+ */
+(function(){var _jQuery=window.jQuery,_$=window.$;var jQuery=window.jQuery=window.$=function(selector,context){return new jQuery.fn.init(selector,context);};var quickExpr=/^[^<]*(<(.|\s)+>)[^>]*$|^#(\w+)$/,isSimple=/^.[^:#\[\.]*$/,undefined;jQuery.fn=jQuery.prototype={init:function(selector,context){selector=selector||document;if(selector.nodeType){this[0]=selector;this.length=1;return this;}if(typeof selector=="string"){var match=quickExpr.exec(selector);if(match&&(match[1]||!context)){if(match[1])selector=jQuery.clean([match[1]],context);else{var elem=document.getElementById(match[3]);if(elem){if(elem.id!=match[3])return jQuery().find(selector);return jQuery(elem);}selector=[];}}else
+return jQuery(context).find(selector);}else if(jQuery.isFunction(selector))return jQuery(document)[jQuery.fn.ready?"ready":"load"](selector);return this.setArray(jQuery.makeArray(selector));},jquery:"1.2.6",size:function(){return this.length;},length:0,get:function(num){return num==undefined?jQuery.makeArray(this):this[num];},pushStack:function(elems){var ret=jQuery(elems);ret.prevObject=this;return ret;},setArray:function(elems){this.length=0;Array.prototype.push.apply(this,elems);return this;},each:function(callback,args){return jQuery.each(this,callback,args);},index:function(elem){var ret=-1;return jQuery.inArray(elem&&elem.jquery?elem[0]:elem,this);},attr:function(name,value,type){var options=name;if(name.constructor==String)if(value===undefined)return this[0]&&jQuery[type||"attr"](this[0],name);else{options={};options[name]=value;}return this.each(function(i){for(name in options)jQuery.attr(type?this.style:this,name,jQuery.prop(this,options[name],type,i,name));});},css:function(key,value){if((key=='width'||key=='height')&&parseFloat(value)<0)value=undefined;return this.attr(key,value,"curCSS");},text:function(text){if(typeof text!="object"&&text!=null)return this.empty().append((this[0]&&this[0].ownerDocument||document).createTextNode(text));var ret="";jQuery.each(text||this,function(){jQuery.each(this.childNodes,function(){if(this.nodeType!=8)ret+=this.nodeType!=1?this.nodeValue:jQuery.fn.text([this]);});});return ret;},wrapAll:function(html){if(this[0])jQuery(html,this[0].ownerDocument).clone().insertBefore(this[0]).map(function(){var elem=this;while(elem.firstChild)elem=elem.firstChild;return elem;}).append(this);return this;},wrapInner:function(html){return this.each(function(){jQuery(this).contents().wrapAll(html);});},wrap:function(html){return this.each(function(){jQuery(this).wrapAll(html);});},append:function(){return this.domManip(arguments,true,false,function(elem){if(this.nodeType==1)this.appendChild(elem);});},prepend:function(){return this.domManip(arguments,true,true,function(elem){if(this.nodeType==1)this.insertBefore(elem,this.firstChild);});},before:function(){return this.domManip(arguments,false,false,function(elem){this.parentNode.insertBefore(elem,this);});},after:function(){return this.domManip(arguments,false,true,function(elem){this.parentNode.insertBefore(elem,this.nextSibling);});},end:function(){return this.prevObject||jQuery([]);},find:function(selector){var elems=jQuery.map(this,function(elem){return jQuery.find(selector,elem);});return this.pushStack(/[^+>] [^+>]/.test(selector)||selector.indexOf("..")>-1?jQuery.unique(elems):elems);},clone:function(events){var ret=this.map(function(){if(jQuery.browser.msie&&!jQuery.isXMLDoc(this)){var clone=this.cloneNode(true),container=document.createElement("div");container.appendChild(clone);return jQuery.clean([container.innerHTML])[0];}else
+return this.cloneNode(true);});var clone=ret.find("*").andSelf().each(function(){if(this[expando]!=undefined)this[expando]=null;});if(events===true)this.find("*").andSelf().each(function(i){if(this.nodeType==3)return;var events=jQuery.data(this,"events");for(var type in events)for(var handler in events[type])jQuery.event.add(clone[i],type,events[type][handler],events[type][handler].data);});return ret;},filter:function(selector){return this.pushStack(jQuery.isFunction(selector)&&jQuery.grep(this,function(elem,i){return selector.call(elem,i);})||jQuery.multiFilter(selector,this));},not:function(selector){if(selector.constructor==String)if(isSimple.test(selector))return this.pushStack(jQuery.multiFilter(selector,this,true));else
+selector=jQuery.multiFilter(selector,this);var isArrayLike=selector.length&&selector[selector.length-1]!==undefined&&!selector.nodeType;return this.filter(function(){return isArrayLike?jQuery.inArray(this,selector)<0:this!=selector;});},add:function(selector){return this.pushStack(jQuery.unique(jQuery.merge(this.get(),typeof selector=='string'?jQuery(selector):jQuery.makeArray(selector))));},is:function(selector){return!!selector&&jQuery.multiFilter(selector,this).length>0;},hasClass:function(selector){return this.is("."+selector);},val:function(value){if(value==undefined){if(this.length){var elem=this[0];if(jQuery.nodeName(elem,"select")){var index=elem.selectedIndex,values=[],options=elem.options,one=elem.type=="select-one";if(index<0)return null;for(var i=one?index:0,max=one?index+1:options.length;i<max;i++){var option=options[i];if(option.selected){value=jQuery.browser.msie&&!option.attributes.value.specified?option.text:option.value;if(one)return value;values.push(value);}}return values;}else
+return(this[0].value||"").replace(/\r/g,"");}return undefined;}if(value.constructor==Number)value+='';return this.each(function(){if(this.nodeType!=1)return;if(value.constructor==Array&&/radio|checkbox/.test(this.type))this.checked=(jQuery.inArray(this.value,value)>=0||jQuery.inArray(this.name,value)>=0);else if(jQuery.nodeName(this,"select")){var values=jQuery.makeArray(value);jQuery("option",this).each(function(){this.selected=(jQuery.inArray(this.value,values)>=0||jQuery.inArray(this.text,values)>=0);});if(!values.length)this.selectedIndex=-1;}else
+this.value=value;});},html:function(value){return value==undefined?(this[0]?this[0].innerHTML:null):this.empty().append(value);},replaceWith:function(value){return this.after(value).remove();},eq:function(i){return this.slice(i,i+1);},slice:function(){return this.pushStack(Array.prototype.slice.apply(this,arguments));},map:function(callback){return this.pushStack(jQuery.map(this,function(elem,i){return callback.call(elem,i,elem);}));},andSelf:function(){return this.add(this.prevObject);},data:function(key,value){var parts=key.split(".");parts[1]=parts[1]?"."+parts[1]:"";if(value===undefined){var data=this.triggerHandler("getData"+parts[1]+"!",[parts[0]]);if(data===undefined&&this.length)data=jQuery.data(this[0],key);return data===undefined&&parts[1]?this.data(parts[0]):data;}else
+return this.trigger("setData"+parts[1]+"!",[parts[0],value]).each(function(){jQuery.data(this,key,value);});},removeData:function(key){return this.each(function(){jQuery.removeData(this,key);});},domManip:function(args,table,reverse,callback){var clone=this.length>1,elems;return this.each(function(){if(!elems){elems=jQuery.clean(args,this.ownerDocument);if(reverse)elems.reverse();}var obj=this;if(table&&jQuery.nodeName(this,"table")&&jQuery.nodeName(elems[0],"tr"))obj=this.getElementsByTagName("tbody")[0]||this.appendChild(this.ownerDocument.createElement("tbody"));var scripts=jQuery([]);jQuery.each(elems,function(){var elem=clone?jQuery(this).clone(true)[0]:this;if(jQuery.nodeName(elem,"script"))scripts=scripts.add(elem);else{if(elem.nodeType==1)scripts=scripts.add(jQuery("script",elem).remove());callback.call(obj,elem);}});scripts.each(evalScript);});}};jQuery.fn.init.prototype=jQuery.fn;function evalScript(i,elem){if(elem.src)jQuery.ajax({url:elem.src,async:false,dataType:"script"});else
+jQuery.globalEval(elem.text||elem.textContent||elem.innerHTML||"");if(elem.parentNode)elem.parentNode.removeChild(elem);}function now(){return+new Date;}jQuery.extend=jQuery.fn.extend=function(){var target=arguments[0]||{},i=1,length=arguments.length,deep=false,options;if(target.constructor==Boolean){deep=target;target=arguments[1]||{};i=2;}if(typeof target!="object"&&typeof target!="function")target={};if(length==i){target=this;--i;}for(;i<length;i++)if((options=arguments[i])!=null)for(var name in options){var src=target[name],copy=options[name];if(target===copy)continue;if(deep&&copy&&typeof copy=="object"&&!copy.nodeType)target[name]=jQuery.extend(deep,src||(copy.length!=null?[]:{}),copy);else if(copy!==undefined)target[name]=copy;}return target;};var expando="jQuery"+now(),uuid=0,windowData={},exclude=/z-?index|font-?weight|opacity|zoom|line-?height/i,defaultView=document.defaultView||{};jQuery.extend({noConflict:function(deep){window.$=_$;if(deep)window.jQuery=_jQuery;return jQuery;},isFunction:function(fn){return!!fn&&typeof fn!="string"&&!fn.nodeName&&fn.constructor!=Array&&/^[\s[]?function/.test(fn+"");},isXMLDoc:function(elem){return elem.documentElement&&!elem.body||elem.tagName&&elem.ownerDocument&&!elem.ownerDocument.body;},globalEval:function(data){data=jQuery.trim(data);if(data){var head=document.getElementsByTagName("head")[0]||document.documentElement,script=document.createElement("script");script.type="text/javascript";if(jQuery.browser.msie)script.text=data;else
+script.appendChild(document.createTextNode(data));head.insertBefore(script,head.firstChild);head.removeChild(script);}},nodeName:function(elem,name){return elem.nodeName&&elem.nodeName.toUpperCase()==name.toUpperCase();},cache:{},data:function(elem,name,data){elem=elem==window?windowData:elem;var id=elem[expando];if(!id)id=elem[expando]=++uuid;if(name&&!jQuery.cache[id])jQuery.cache[id]={};if(data!==undefined)jQuery.cache[id][name]=data;return name?jQuery.cache[id][name]:id;},removeData:function(elem,name){elem=elem==window?windowData:elem;var id=elem[expando];if(name){if(jQuery.cache[id]){delete jQuery.cache[id][name];name="";for(name in jQuery.cache[id])break;if(!name)jQuery.removeData(elem);}}else{try{delete elem[expando];}catch(e){if(elem.removeAttribute)elem.removeAttribute(expando);}delete jQuery.cache[id];}},each:function(object,callback,args){var name,i=0,length=object.length;if(args){if(length==undefined){for(name in object)if(callback.apply(object[name],args)===false)break;}else
+for(;i<length;)if(callback.apply(object[i++],args)===false)break;}else{if(length==undefined){for(name in object)if(callback.call(object[name],name,object[name])===false)break;}else
+for(var value=object[0];i<length&&callback.call(value,i,value)!==false;value=object[++i]){}}return object;},prop:function(elem,value,type,i,name){if(jQuery.isFunction(value))value=value.call(elem,i);return value&&value.constructor==Number&&type=="curCSS"&&!exclude.test(name)?value+"px":value;},className:{add:function(elem,classNames){jQuery.each((classNames||"").split(/\s+/),function(i,className){if(elem.nodeType==1&&!jQuery.className.has(elem.className,className))elem.className+=(elem.className?" ":"")+className;});},remove:function(elem,classNames){if(elem.nodeType==1)elem.className=classNames!=undefined?jQuery.grep(elem.className.split(/\s+/),function(className){return!jQuery.className.has(classNames,className);}).join(" "):"";},has:function(elem,className){return jQuery.inArray(className,(elem.className||elem).toString().split(/\s+/))>-1;}},swap:function(elem,options,callback){var old={};for(var name in options){old[name]=elem.style[name];elem.style[name]=options[name];}callback.call(elem);for(var name in options)elem.style[name]=old[name];},css:function(elem,name,force){if(name=="width"||name=="height"){var val,props={position:"absolute",visibility:"hidden",display:"block"},which=name=="width"?["Left","Right"]:["Top","Bottom"];function getWH(){val=name=="width"?elem.offsetWidth:elem.offsetHeight;var padding=0,border=0;jQuery.each(which,function(){padding+=parseFloat(jQuery.curCSS(elem,"padding"+this,true))||0;border+=parseFloat(jQuery.curCSS(elem,"border"+this+"Width",true))||0;});val-=Math.round(padding+border);}if(jQuery(elem).is(":visible"))getWH();else
+jQuery.swap(elem,props,getWH);return Math.max(0,val);}return jQuery.curCSS(elem,name,force);},curCSS:function(elem,name,force){var ret,style=elem.style;function color(elem){if(!jQuery.browser.safari)return false;var ret=defaultView.getComputedStyle(elem,null);return!ret||ret.getPropertyValue("color")=="";}if(name=="opacity"&&jQuery.browser.msie){ret=jQuery.attr(style,"opacity");return ret==""?"1":ret;}if(jQuery.browser.opera&&name=="display"){var save=style.outline;style.outline="0 solid black";style.outline=save;}if(name.match(/float/i))name=styleFloat;if(!force&&style&&style[name])ret=style[name];else if(defaultView.getComputedStyle){if(name.match(/float/i))name="float";name=name.replace(/([A-Z])/g,"-$1").toLowerCase();var computedStyle=defaultView.getComputedStyle(elem,null);if(computedStyle&&!color(elem))ret=computedStyle.getPropertyValue(name);else{var swap=[],stack=[],a=elem,i=0;for(;a&&color(a);a=a.parentNode)stack.unshift(a);for(;i<stack.length;i++)if(color(stack[i])){swap[i]=stack[i].style.display;stack[i].style.display="block";}ret=name=="display"&&swap[stack.length-1]!=null?"none":(computedStyle&&computedStyle.getPropertyValue(name))||"";for(i=0;i<swap.length;i++)if(swap[i]!=null)stack[i].style.display=swap[i];}if(name=="opacity"&&ret=="")ret="1";}else if(elem.currentStyle){var camelCase=name.replace(/\-(\w)/g,function(all,letter){return letter.toUpperCase();});ret=elem.currentStyle[name]||elem.currentStyle[camelCase];if(!/^\d+(px)?$/i.test(ret)&&/^\d/.test(ret)){var left=style.left,rsLeft=elem.runtimeStyle.left;elem.runtimeStyle.left=elem.currentStyle.left;style.left=ret||0;ret=style.pixelLeft+"px";style.left=left;elem.runtimeStyle.left=rsLeft;}}return ret;},clean:function(elems,context){var ret=[];context=context||document;if(typeof context.createElement=='undefined')context=context.ownerDocument||context[0]&&context[0].ownerDocument||document;jQuery.each(elems,function(i,elem){if(!elem)return;if(elem.constructor==Number)elem+='';if(typeof elem=="string"){elem=elem.replace(/(<(\w+)[^>]*?)\/>/g,function(all,front,tag){return tag.match(/^(abbr|br|col|img|input|link|meta|param|hr|area|embed)$/i)?all:front+"></"+tag+">";});var tags=jQuery.trim(elem).toLowerCase(),div=context.createElement("div");var wrap=!tags.indexOf("<opt")&&[1,"<select multiple='multiple'>","</select>"]||!tags.indexOf("<leg")&&[1,"<fieldset>","</fieldset>"]||tags.match(/^<(thead|tbody|tfoot|colg|cap)/)&&[1,"<table>","</table>"]||!tags.indexOf("<tr")&&[2,"<table><tbody>","</tbody></table>"]||(!tags.indexOf("<td")||!tags.indexOf("<th"))&&[3,"<table><tbody><tr>","</tr></tbody></table>"]||!tags.indexOf("<col")&&[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"]||jQuery.browser.msie&&[1,"div<div>","</div>"]||[0,"",""];div.innerHTML=wrap[1]+elem+wrap[2];while(wrap[0]--)div=div.lastChild;if(jQuery.browser.msie){var tbody=!tags.indexOf("<table")&&tags.indexOf("<tbody")<0?div.firstChild&&div.firstChild.childNodes:wrap[1]=="<table>"&&tags.indexOf("<tbody")<0?div.childNodes:[];for(var j=tbody.length-1;j>=0;--j)if(jQuery.nodeName(tbody[j],"tbody")&&!tbody[j].childNodes.length)tbody[j].parentNode.removeChild(tbody[j]);if(/^\s/.test(elem))div.insertBefore(context.createTextNode(elem.match(/^\s*/)[0]),div.firstChild);}elem=jQuery.makeArray(div.childNodes);}if(elem.length===0&&(!jQuery.nodeName(elem,"form")&&!jQuery.nodeName(elem,"select")))return;if(elem[0]==undefined||jQuery.nodeName(elem,"form")||elem.options)ret.push(elem);else
+ret=jQuery.merge(ret,elem);});return ret;},attr:function(elem,name,value){if(!elem||elem.nodeType==3||elem.nodeType==8)return undefined;var notxml=!jQuery.isXMLDoc(elem),set=value!==undefined,msie=jQuery.browser.msie;name=notxml&&jQuery.props[name]||name;if(elem.tagName){var special=/href|src|style/.test(name);if(name=="selected"&&jQuery.browser.safari)elem.parentNode.selectedIndex;if(name in elem&&notxml&&!special){if(set){if(name=="type"&&jQuery.nodeName(elem,"input")&&elem.parentNode)throw"type property can't be changed";elem[name]=value;}if(jQuery.nodeName(elem,"form")&&elem.getAttributeNode(name))return elem.getAttributeNode(name).nodeValue;return elem[name];}if(msie&&notxml&&name=="style")return jQuery.attr(elem.style,"cssText",value);if(set)elem.setAttribute(name,""+value);var attr=msie&&notxml&&special?elem.getAttribute(name,2):elem.getAttribute(name);return attr===null?undefined:attr;}if(msie&&name=="opacity"){if(set){elem.zoom=1;elem.filter=(elem.filter||"").replace(/alpha\([^)]*\)/,"")+(parseInt(value)+''=="NaN"?"":"alpha(opacity="+value*100+")");}return elem.filter&&elem.filter.indexOf("opacity=")>=0?(parseFloat(elem.filter.match(/opacity=([^)]*)/)[1])/100)+'':"";}name=name.replace(/-([a-z])/ig,function(all,letter){return letter.toUpperCase();});if(set)elem[name]=value;return elem[name];},trim:function(text){return(text||"").replace(/^\s+|\s+$/g,"");},makeArray:function(array){var ret=[];if(array!=null){var i=array.length;if(i==null||array.split||array.setInterval||array.call)ret[0]=array;else
+while(i)ret[--i]=array[i];}return ret;},inArray:function(elem,array){for(var i=0,length=array.length;i<length;i++)if(array[i]===elem)return i;return-1;},merge:function(first,second){var i=0,elem,pos=first.length;if(jQuery.browser.msie){while(elem=second[i++])if(elem.nodeType!=8)first[pos++]=elem;}else
+while(elem=second[i++])first[pos++]=elem;return first;},unique:function(array){var ret=[],done={};try{for(var i=0,length=array.length;i<length;i++){var id=jQuery.data(array[i]);if(!done[id]){done[id]=true;ret.push(array[i]);}}}catch(e){ret=array;}return ret;},grep:function(elems,callback,inv){var ret=[];for(var i=0,length=elems.length;i<length;i++)if(!inv!=!callback(elems[i],i))ret.push(elems[i]);return ret;},map:function(elems,callback){var ret=[];for(var i=0,length=elems.length;i<length;i++){var value=callback(elems[i],i);if(value!=null)ret[ret.length]=value;}return ret.concat.apply([],ret);}});var userAgent=navigator.userAgent.toLowerCase();jQuery.browser={version:(userAgent.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/)||[])[1],safari:/webkit/.test(userAgent),opera:/opera/.test(userAgent),msie:/msie/.test(userAgent)&&!/opera/.test(userAgent),mozilla:/mozilla/.test(userAgent)&&!/(compatible|webkit)/.test(userAgent)};var styleFloat=jQuery.browser.msie?"styleFloat":"cssFloat";jQuery.extend({boxModel:!jQuery.browser.msie||document.compatMode=="CSS1Compat",props:{"for":"htmlFor","class":"className","float":styleFloat,cssFloat:styleFloat,styleFloat:styleFloat,readonly:"readOnly",maxlength:"maxLength",cellspacing:"cellSpacing"}});jQuery.each({parent:function(elem){return elem.parentNode;},parents:function(elem){return jQuery.dir(elem,"parentNode");},next:function(elem){return jQuery.nth(elem,2,"nextSibling");},prev:function(elem){return jQuery.nth(elem,2,"previousSibling");},nextAll:function(elem){return jQuery.dir(elem,"nextSibling");},prevAll:function(elem){return jQuery.dir(elem,"previousSibling");},siblings:function(elem){return jQuery.sibling(elem.parentNode.firstChild,elem);},children:function(elem){return jQuery.sibling(elem.firstChild);},contents:function(elem){return jQuery.nodeName(elem,"iframe")?elem.contentDocument||elem.contentWindow.document:jQuery.makeArray(elem.childNodes);}},function(name,fn){jQuery.fn[name]=function(selector){var ret=jQuery.map(this,fn);if(selector&&typeof selector=="string")ret=jQuery.multiFilter(selector,ret);return this.pushStack(jQuery.unique(ret));};});jQuery.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(name,original){jQuery.fn[name]=function(){var args=arguments;return this.each(function(){for(var i=0,length=args.length;i<length;i++)jQuery(args[i])[original](this);});};});jQuery.each({removeAttr:function(name){jQuery.attr(this,name,"");if(this.nodeType==1)this.removeAttribute(name);},addClass:function(classNames){jQuery.className.add(this,classNames);},removeClass:function(classNames){jQuery.className.remove(this,classNames);},toggleClass:function(classNames){jQuery.className[jQuery.className.has(this,classNames)?"remove":"add"](this,classNames);},remove:function(selector){if(!selector||jQuery.filter(selector,[this]).r.length){jQuery("*",this).add(this).each(function(){jQuery.event.remove(this);jQuery.removeData(this);});if(this.parentNode)this.parentNode.removeChild(this);}},empty:function(){jQuery(">*",this).remove();while(this.firstChild)this.removeChild(this.firstChild);}},function(name,fn){jQuery.fn[name]=function(){return this.each(fn,arguments);};});jQuery.each(["Height","Width"],function(i,name){var type=name.toLowerCase();jQuery.fn[type]=function(size){return this[0]==window?jQuery.browser.opera&&document.body["client"+name]||jQuery.browser.safari&&window["inner"+name]||document.compatMode=="CSS1Compat"&&document.documentElement["client"+name]||document.body["client"+name]:this[0]==document?Math.max(Math.max(document.body["scroll"+name],document.documentElement["scroll"+name]),Math.max(document.body["offset"+name],document.documentElement["offset"+name])):size==undefined?(this.length?jQuery.css(this[0],type):null):this.css(type,size.constructor==String?size:size+"px");};});function num(elem,prop){return elem[0]&&parseInt(jQuery.curCSS(elem[0],prop,true),10)||0;}var chars=jQuery.browser.safari&&parseInt(jQuery.browser.version)<417?"(?:[\\w*_-]|\\\\.)":"(?:[\\w\u0128-\uFFFF*_-]|\\\\.)",quickChild=new RegExp("^>\\s*("+chars+"+)"),quickID=new RegExp("^("+chars+"+)(#)("+chars+"+)"),quickClass=new RegExp("^([#.]?)("+chars+"*)");jQuery.extend({expr:{"":function(a,i,m){return m[2]=="*"||jQuery.nodeName(a,m[2]);},"#":function(a,i,m){return a.getAttribute("id")==m[2];},":":{lt:function(a,i,m){return i<m[3]-0;},gt:function(a,i,m){return i>m[3]-0;},nth:function(a,i,m){return m[3]-0==i;},eq:function(a,i,m){return m[3]-0==i;},first:function(a,i){return i==0;},last:function(a,i,m,r){return i==r.length-1;},even:function(a,i){return i%2==0;},odd:function(a,i){return i%2;},"first-child":function(a){return a.parentNode.getElementsByTagName("*")[0]==a;},"last-child":function(a){return jQuery.nth(a.parentNode.lastChild,1,"previousSibling")==a;},"only-child":function(a){return!jQuery.nth(a.parentNode.lastChild,2,"previousSibling");},parent:function(a){return a.firstChild;},empty:function(a){return!a.firstChild;},contains:function(a,i,m){return(a.textContent||a.innerText||jQuery(a).text()||"").indexOf(m[3])>=0;},visible:function(a){return"hidden"!=a.type&&jQuery.css(a,"display")!="none"&&jQuery.css(a,"visibility")!="hidden";},hidden:function(a){return"hidden"==a.type||jQuery.css(a,"display")=="none"||jQuery.css(a,"visibility")=="hidden";},enabled:function(a){return!a.disabled;},disabled:function(a){return a.disabled;},checked:function(a){return a.checked;},selected:function(a){return a.selected||jQuery.attr(a,"selected");},text:function(a){return"text"==a.type;},radio:function(a){return"radio"==a.type;},checkbox:function(a){return"checkbox"==a.type;},file:function(a){return"file"==a.type;},password:function(a){return"password"==a.type;},submit:function(a){return"submit"==a.type;},image:function(a){return"image"==a.type;},reset:function(a){return"reset"==a.type;},button:function(a){return"button"==a.type||jQuery.nodeName(a,"button");},input:function(a){return/input|select|textarea|button/i.test(a.nodeName);},has:function(a,i,m){return jQuery.find(m[3],a).length;},header:function(a){return/h\d/i.test(a.nodeName);},animated:function(a){return jQuery.grep(jQuery.timers,function(fn){return a==fn.elem;}).length;}}},parse:[/^(\[) *@?([\w-]+) *([!*$^~=]*) *('?"?)(.*?)\4 *\]/,/^(:)([\w-]+)\("?'?(.*?(\(.*?\))?[^(]*?)"?'?\)/,new RegExp("^([:.#]*)("+chars+"+)")],multiFilter:function(expr,elems,not){var old,cur=[];while(expr&&expr!=old){old=expr;var f=jQuery.filter(expr,elems,not);expr=f.t.replace(/^\s*,\s*/,"");cur=not?elems=f.r:jQuery.merge(cur,f.r);}return cur;},find:function(t,context){if(typeof t!="string")return[t];if(context&&context.nodeType!=1&&context.nodeType!=9)return[];context=context||document;var ret=[context],done=[],last,nodeName;while(t&&last!=t){var r=[];last=t;t=jQuery.trim(t);var foundToken=false,re=quickChild,m=re.exec(t);if(m){nodeName=m[1].toUpperCase();for(var i=0;ret[i];i++)for(var c=ret[i].firstChild;c;c=c.nextSibling)if(c.nodeType==1&&(nodeName=="*"||c.nodeName.toUpperCase()==nodeName))r.push(c);ret=r;t=t.replace(re,"");if(t.indexOf(" ")==0)continue;foundToken=true;}else{re=/^([>+~])\s*(\w*)/i;if((m=re.exec(t))!=null){r=[];var merge={};nodeName=m[2].toUpperCase();m=m[1];for(var j=0,rl=ret.length;j<rl;j++){var n=m=="~"||m=="+"?ret[j].nextSibling:ret[j].firstChild;for(;n;n=n.nextSibling)if(n.nodeType==1){var id=jQuery.data(n);if(m=="~"&&merge[id])break;if(!nodeName||n.nodeName.toUpperCase()==nodeName){if(m=="~")merge[id]=true;r.push(n);}if(m=="+")break;}}ret=r;t=jQuery.trim(t.replace(re,""));foundToken=true;}}if(t&&!foundToken){if(!t.indexOf(",")){if(context==ret[0])ret.shift();done=jQuery.merge(done,ret);r=ret=[context];t=" "+t.substr(1,t.length);}else{var re2=quickID;var m=re2.exec(t);if(m){m=[0,m[2],m[3],m[1]];}else{re2=quickClass;m=re2.exec(t);}m[2]=m[2].replace(/\\/g,"");var elem=ret[ret.length-1];if(m[1]=="#"&&elem&&elem.getElementById&&!jQuery.isXMLDoc(elem)){var oid=elem.getElementById(m[2]);if((jQuery.browser.msie||jQuery.browser.opera)&&oid&&typeof oid.id=="string"&&oid.id!=m[2])oid=jQuery('[@id="'+m[2]+'"]',elem)[0];ret=r=oid&&(!m[3]||jQuery.nodeName(oid,m[3]))?[oid]:[];}else{for(var i=0;ret[i];i++){var tag=m[1]=="#"&&m[3]?m[3]:m[1]!=""||m[0]==""?"*":m[2];if(tag=="*"&&ret[i].nodeName.toLowerCase()=="object")tag="param";r=jQuery.merge(r,ret[i].getElementsByTagName(tag));}if(m[1]==".")r=jQuery.classFilter(r,m[2]);if(m[1]=="#"){var tmp=[];for(var i=0;r[i];i++)if(r[i].getAttribute("id")==m[2]){tmp=[r[i]];break;}r=tmp;}ret=r;}t=t.replace(re2,"");}}if(t){var val=jQuery.filter(t,r);ret=r=val.r;t=jQuery.trim(val.t);}}if(t)ret=[];if(ret&&context==ret[0])ret.shift();done=jQuery.merge(done,ret);return done;},classFilter:function(r,m,not){m=" "+m+" ";var tmp=[];for(var i=0;r[i];i++){var pass=(" "+r[i].className+" ").indexOf(m)>=0;if(!not&&pass||not&&!pass)tmp.push(r[i]);}return tmp;},filter:function(t,r,not){var last;while(t&&t!=last){last=t;var p=jQuery.parse,m;for(var i=0;p[i];i++){m=p[i].exec(t);if(m){t=t.substring(m[0].length);m[2]=m[2].replace(/\\/g,"");break;}}if(!m)break;if(m[1]==":"&&m[2]=="not")r=isSimple.test(m[3])?jQuery.filter(m[3],r,true).r:jQuery(r).not(m[3]);else if(m[1]==".")r=jQuery.classFilter(r,m[2],not);else if(m[1]=="["){var tmp=[],type=m[3];for(var i=0,rl=r.length;i<rl;i++){var a=r[i],z=a[jQuery.props[m[2]]||m[2]];if(z==null||/href|src|selected/.test(m[2]))z=jQuery.attr(a,m[2])||'';if((type==""&&!!z||type=="="&&z==m[5]||type=="!="&&z!=m[5]||type=="^="&&z&&!z.indexOf(m[5])||type=="$="&&z.substr(z.length-m[5].length)==m[5]||(type=="*="||type=="~=")&&z.indexOf(m[5])>=0)^not)tmp.push(a);}r=tmp;}else if(m[1]==":"&&m[2]=="nth-child"){var merge={},tmp=[],test=/(-?)(\d*)n((?:\+|-)?\d*)/.exec(m[3]=="even"&&"2n"||m[3]=="odd"&&"2n+1"||!/\D/.test(m[3])&&"0n+"+m[3]||m[3]),first=(test[1]+(test[2]||1))-0,last=test[3]-0;for(var i=0,rl=r.length;i<rl;i++){var node=r[i],parentNode=node.parentNode,id=jQuery.data(parentNode);if(!merge[id]){var c=1;for(var n=parentNode.firstChild;n;n=n.nextSibling)if(n.nodeType==1)n.nodeIndex=c++;merge[id]=true;}var add=false;if(first==0){if(node.nodeIndex==last)add=true;}else if((node.nodeIndex-last)%first==0&&(node.nodeIndex-last)/first>=0)add=true;if(add^not)tmp.push(node);}r=tmp;}else{var fn=jQuery.expr[m[1]];if(typeof fn=="object")fn=fn[m[2]];if(typeof fn=="string")fn=eval("false||function(a,i){return "+fn+";}");r=jQuery.grep(r,function(elem,i){return fn(elem,i,m,r);},not);}}return{r:r,t:t};},dir:function(elem,dir){var matched=[],cur=elem[dir];while(cur&&cur!=document){if(cur.nodeType==1)matched.push(cur);cur=cur[dir];}return matched;},nth:function(cur,result,dir,elem){result=result||1;var num=0;for(;cur;cur=cur[dir])if(cur.nodeType==1&&++num==result)break;return cur;},sibling:function(n,elem){var r=[];for(;n;n=n.nextSibling){if(n.nodeType==1&&n!=elem)r.push(n);}return r;}});jQuery.event={add:function(elem,types,handler,data){if(elem.nodeType==3||elem.nodeType==8)return;if(jQuery.browser.msie&&elem.setInterval)elem=window;if(!handler.guid)handler.guid=this.guid++;if(data!=undefined){var fn=handler;handler=this.proxy(fn,function(){return fn.apply(this,arguments);});handler.data=data;}var events=jQuery.data(elem,"events")||jQuery.data(elem,"events",{}),handle=jQuery.data(elem,"handle")||jQuery.data(elem,"handle",function(){if(typeof jQuery!="undefined"&&!jQuery.event.triggered)return jQuery.event.handle.apply(arguments.callee.elem,arguments);});handle.elem=elem;jQuery.each(types.split(/\s+/),function(index,type){var parts=type.split(".");type=parts[0];handler.type=parts[1];var handlers=events[type];if(!handlers){handlers=events[type]={};if(!jQuery.event.special[type]||jQuery.event.special[type].setup.call(elem)===false){if(elem.addEventListener)elem.addEventListener(type,handle,false);else if(elem.attachEvent)elem.attachEvent("on"+type,handle);}}handlers[handler.guid]=handler;jQuery.event.global[type]=true;});elem=null;},guid:1,global:{},remove:function(elem,types,handler){if(elem.nodeType==3||elem.nodeType==8)return;var events=jQuery.data(elem,"events"),ret,index;if(events){if(types==undefined||(typeof types=="string"&&types.charAt(0)=="."))for(var type in events)this.remove(elem,type+(types||""));else{if(types.type){handler=types.handler;types=types.type;}jQuery.each(types.split(/\s+/),function(index,type){var parts=type.split(".");type=parts[0];if(events[type]){if(handler)delete events[type][handler.guid];else
+for(handler in events[type])if(!parts[1]||events[type][handler].type==parts[1])delete events[type][handler];for(ret in events[type])break;if(!ret){if(!jQuery.event.special[type]||jQuery.event.special[type].teardown.call(elem)===false){if(elem.removeEventListener)elem.removeEventListener(type,jQuery.data(elem,"handle"),false);else if(elem.detachEvent)elem.detachEvent("on"+type,jQuery.data(elem,"handle"));}ret=null;delete events[type];}}});}for(ret in events)break;if(!ret){var handle=jQuery.data(elem,"handle");if(handle)handle.elem=null;jQuery.removeData(elem,"events");jQuery.removeData(elem,"handle");}}},trigger:function(type,data,elem,donative,extra){data=jQuery.makeArray(data);if(type.indexOf("!")>=0){type=type.slice(0,-1);var exclusive=true;}if(!elem){if(this.global[type])jQuery("*").add([window,document]).trigger(type,data);}else{if(elem.nodeType==3||elem.nodeType==8)return undefined;var val,ret,fn=jQuery.isFunction(elem[type]||null),event=!data[0]||!data[0].preventDefault;if(event){data.unshift({type:type,target:elem,preventDefault:function(){},stopPropagation:function(){},timeStamp:now()});data[0][expando]=true;}data[0].type=type;if(exclusive)data[0].exclusive=true;var handle=jQuery.data(elem,"handle");if(handle)val=handle.apply(elem,data);if((!fn||(jQuery.nodeName(elem,'a')&&type=="click"))&&elem["on"+type]&&elem["on"+type].apply(elem,data)===false)val=false;if(event)data.shift();if(extra&&jQuery.isFunction(extra)){ret=extra.apply(elem,val==null?data:data.concat(val));if(ret!==undefined)val=ret;}if(fn&&donative!==false&&val!==false&&!(jQuery.nodeName(elem,'a')&&type=="click")){this.triggered=true;try{elem[type]();}catch(e){}}this.triggered=false;}return val;},handle:function(event){var val,ret,namespace,all,handlers;event=arguments[0]=jQuery.event.fix(event||window.event);namespace=event.type.split(".");event.type=namespace[0];namespace=namespace[1];all=!namespace&&!event.exclusive;handlers=(jQuery.data(this,"events")||{})[event.type];for(var j in handlers){var handler=handlers[j];if(all||handler.type==namespace){event.handler=handler;event.data=handler.data;ret=handler.apply(this,arguments);if(val!==false)val=ret;if(ret===false){event.preventDefault();event.stopPropagation();}}}return val;},fix:function(event){if(event[expando]==true)return event;var originalEvent=event;event={originalEvent:originalEvent};var props="altKey attrChange attrName bubbles button cancelable charCode clientX clientY ctrlKey currentTarget data detail eventPhase fromElement handler keyCode metaKey newValue originalTarget pageX pageY prevValue relatedNode relatedTarget screenX screenY shiftKey srcElement target timeStamp toElement type view wheelDelta which".split(" ");for(var i=props.length;i;i--)event[props[i]]=originalEvent[props[i]];event[expando]=true;event.preventDefault=function(){if(originalEvent.preventDefault)originalEvent.preventDefault();originalEvent.returnValue=false;};event.stopPropagation=function(){if(originalEvent.stopPropagation)originalEvent.stopPropagation();originalEvent.cancelBubble=true;};event.timeStamp=event.timeStamp||now();if(!event.target)event.target=event.srcElement||document;if(event.target.nodeType==3)event.target=event.target.parentNode;if(!event.relatedTarget&&event.fromElement)event.relatedTarget=event.fromElement==event.target?event.toElement:event.fromElement;if(event.pageX==null&&event.clientX!=null){var doc=document.documentElement,body=document.body;event.pageX=event.clientX+(doc&&doc.scrollLeft||body&&body.scrollLeft||0)-(doc.clientLeft||0);event.pageY=event.clientY+(doc&&doc.scrollTop||body&&body.scrollTop||0)-(doc.clientTop||0);}if(!event.which&&((event.charCode||event.charCode===0)?event.charCode:event.keyCode))event.which=event.charCode||event.keyCode;if(!event.metaKey&&event.ctrlKey)event.metaKey=event.ctrlKey;if(!event.which&&event.button)event.which=(event.button&1?1:(event.button&2?3:(event.button&4?2:0)));return event;},proxy:function(fn,proxy){proxy.guid=fn.guid=fn.guid||proxy.guid||this.guid++;return proxy;},special:{ready:{setup:function(){bindReady();return;},teardown:function(){return;}},mouseenter:{setup:function(){if(jQuery.browser.msie)return false;jQuery(this).bind("mouseover",jQuery.event.special.mouseenter.handler);return true;},teardown:function(){if(jQuery.browser.msie)return false;jQuery(this).unbind("mouseover",jQuery.event.special.mouseenter.handler);return true;},handler:function(event){if(withinElement(event,this))return true;event.type="mouseenter";return jQuery.event.handle.apply(this,arguments);}},mouseleave:{setup:function(){if(jQuery.browser.msie)return false;jQuery(this).bind("mouseout",jQuery.event.special.mouseleave.handler);return true;},teardown:function(){if(jQuery.browser.msie)return false;jQuery(this).unbind("mouseout",jQuery.event.special.mouseleave.handler);return true;},handler:function(event){if(withinElement(event,this))return true;event.type="mouseleave";return jQuery.event.handle.apply(this,arguments);}}}};jQuery.fn.extend({bind:function(type,data,fn){return type=="unload"?this.one(type,data,fn):this.each(function(){jQuery.event.add(this,type,fn||data,fn&&data);});},one:function(type,data,fn){var one=jQuery.event.proxy(fn||data,function(event){jQuery(this).unbind(event,one);return(fn||data).apply(this,arguments);});return this.each(function(){jQuery.event.add(this,type,one,fn&&data);});},unbind:function(type,fn){return this.each(function(){jQuery.event.remove(this,type,fn);});},trigger:function(type,data,fn){return this.each(function(){jQuery.event.trigger(type,data,this,true,fn);});},triggerHandler:function(type,data,fn){return this[0]&&jQuery.event.trigger(type,data,this[0],false,fn);},toggle:function(fn){var args=arguments,i=1;while(i<args.length)jQuery.event.proxy(fn,args[i++]);return this.click(jQuery.event.proxy(fn,function(event){this.lastToggle=(this.lastToggle||0)%i;event.preventDefault();return args[this.lastToggle++].apply(this,arguments)||false;}));},hover:function(fnOver,fnOut){return this.bind('mouseenter',fnOver).bind('mouseleave',fnOut);},ready:function(fn){bindReady();if(jQuery.isReady)fn.call(document,jQuery);else
+jQuery.readyList.push(function(){return fn.call(this,jQuery);});return this;}});jQuery.extend({isReady:false,readyList:[],ready:function(){if(!jQuery.isReady){jQuery.isReady=true;if(jQuery.readyList){jQuery.each(jQuery.readyList,function(){this.call(document);});jQuery.readyList=null;}jQuery(document).triggerHandler("ready");}}});var readyBound=false;function bindReady(){if(readyBound)return;readyBound=true;if(document.addEventListener&&!jQuery.browser.opera)document.addEventListener("DOMContentLoaded",jQuery.ready,false);if(jQuery.browser.msie&&window==top)(function(){if(jQuery.isReady)return;try{document.documentElement.doScroll("left");}catch(error){setTimeout(arguments.callee,0);return;}jQuery.ready();})();if(jQuery.browser.opera)document.addEventListener("DOMContentLoaded",function(){if(jQuery.isReady)return;for(var i=0;i<document.styleSheets.length;i++)if(document.styleSheets[i].disabled){setTimeout(arguments.callee,0);return;}jQuery.ready();},false);if(jQuery.browser.safari){var numStyles;(function(){if(jQuery.isReady)return;if(document.readyState!="loaded"&&document.readyState!="complete"){setTimeout(arguments.callee,0);return;}if(numStyles===undefined)numStyles=jQuery("style, link[rel=stylesheet]").length;if(document.styleSheets.length!=numStyles){setTimeout(arguments.callee,0);return;}jQuery.ready();})();}jQuery.event.add(window,"load",jQuery.ready);}jQuery.each(("blur,focus,load,resize,scroll,unload,click,dblclick,"+"mousedown,mouseup,mousemove,mouseover,mouseout,change,select,"+"submit,keydown,keypress,keyup,error").split(","),function(i,name){jQuery.fn[name]=function(fn){return fn?this.bind(name,fn):this.trigger(name);};});var withinElement=function(event,elem){var parent=event.relatedTarget;while(parent&&parent!=elem)try{parent=parent.parentNode;}catch(error){parent=elem;}return parent==elem;};jQuery(window).bind("unload",function(){jQuery("*").add(document).unbind();});jQuery.fn.extend({_load:jQuery.fn.load,load:function(url,params,callback){if(typeof url!='string')return this._load(url);var off=url.indexOf(" ");if(off>=0){var selector=url.slice(off,url.length);url=url.slice(0,off);}callback=callback||function(){};var type="GET";if(params)if(jQuery.isFunction(params)){callback=params;params=null;}else{params=jQuery.param(params);type="POST";}var self=this;jQuery.ajax({url:url,type:type,dataType:"html",data:params,complete:function(res,status){if(status=="success"||status=="notmodified")self.html(selector?jQuery("<div/>").append(res.responseText.replace(/<script(.|\s)*?\/script>/g,"")).find(selector):res.responseText);self.each(callback,[res.responseText,status,res]);}});return this;},serialize:function(){return jQuery.param(this.serializeArray());},serializeArray:function(){return this.map(function(){return jQuery.nodeName(this,"form")?jQuery.makeArray(this.elements):this;}).filter(function(){return this.name&&!this.disabled&&(this.checked||/select|textarea/i.test(this.nodeName)||/text|hidden|password/i.test(this.type));}).map(function(i,elem){var val=jQuery(this).val();return val==null?null:val.constructor==Array?jQuery.map(val,function(val,i){return{name:elem.name,value:val};}):{name:elem.name,value:val};}).get();}});jQuery.each("ajaxStart,ajaxStop,ajaxComplete,ajaxError,ajaxSuccess,ajaxSend".split(","),function(i,o){jQuery.fn[o]=function(f){return this.bind(o,f);};});var jsc=now();jQuery.extend({get:function(url,data,callback,type){if(jQuery.isFunction(data)){callback=data;data=null;}return jQuery.ajax({type:"GET",url:url,data:data,success:callback,dataType:type});},getScript:function(url,callback){return jQuery.get(url,null,callback,"script");},getJSON:function(url,data,callback){return jQuery.get(url,data,callback,"json");},post:function(url,data,callback,type){if(jQuery.isFunction(data)){callback=data;data={};}return jQuery.ajax({type:"POST",url:url,data:data,success:callback,dataType:type});},ajaxSetup:function(settings){jQuery.extend(jQuery.ajaxSettings,settings);},ajaxSettings:{url:location.href,global:true,type:"GET",timeout:0,contentType:"application/x-www-form-urlencoded",processData:true,async:true,data:null,username:null,password:null,accepts:{xml:"application/xml, text/xml",html:"text/html",script:"text/javascript, application/javascript",json:"application/json, text/javascript",text:"text/plain",_default:"*/*"}},lastModified:{},ajax:function(s){s=jQuery.extend(true,s,jQuery.extend(true,{},jQuery.ajaxSettings,s));var jsonp,jsre=/=\?(&|$)/g,status,data,type=s.type.toUpperCase();if(s.data&&s.processData&&typeof s.data!="string")s.data=jQuery.param(s.data);if(s.dataType=="jsonp"){if(type=="GET"){if(!s.url.match(jsre))s.url+=(s.url.match(/\?/)?"&":"?")+(s.jsonp||"callback")+"=?";}else if(!s.data||!s.data.match(jsre))s.data=(s.data?s.data+"&":"")+(s.jsonp||"callback")+"=?";s.dataType="json";}if(s.dataType=="json"&&(s.data&&s.data.match(jsre)||s.url.match(jsre))){jsonp="jsonp"+jsc++;if(s.data)s.data=(s.data+"").replace(jsre,"="+jsonp+"$1");s.url=s.url.replace(jsre,"="+jsonp+"$1");s.dataType="script";window[jsonp]=function(tmp){data=tmp;success();complete();window[jsonp]=undefined;try{delete window[jsonp];}catch(e){}if(head)head.removeChild(script);};}if(s.dataType=="script"&&s.cache==null)s.cache=false;if(s.cache===false&&type=="GET"){var ts=now();var ret=s.url.replace(/(\?|&)_=.*?(&|$)/,"$1_="+ts+"$2");s.url=ret+((ret==s.url)?(s.url.match(/\?/)?"&":"?")+"_="+ts:"");}if(s.data&&type=="GET"){s.url+=(s.url.match(/\?/)?"&":"?")+s.data;s.data=null;}if(s.global&&!jQuery.active++)jQuery.event.trigger("ajaxStart");var remote=/^(?:\w+:)?\/\/([^\/?#]+)/;if(s.dataType=="script"&&type=="GET"&&remote.test(s.url)&&remote.exec(s.url)[1]!=location.host){var head=document.getElementsByTagName("head")[0];var script=document.createElement("script");script.src=s.url;if(s.scriptCharset)script.charset=s.scriptCharset;if(!jsonp){var done=false;script.onload=script.onreadystatechange=function(){if(!done&&(!this.readyState||this.readyState=="loaded"||this.readyState=="complete")){done=true;success();complete();head.removeChild(script);}};}head.appendChild(script);return undefined;}var requestDone=false;var xhr=window.ActiveXObject?new ActiveXObject("Microsoft.XMLHTTP"):new XMLHttpRequest();if(s.username)xhr.open(type,s.url,s.async,s.username,s.password);else
+xhr.open(type,s.url,s.async);try{if(s.data)xhr.setRequestHeader("Content-Type",s.contentType);if(s.ifModified)xhr.setRequestHeader("If-Modified-Since",jQuery.lastModified[s.url]||"Thu, 01 Jan 1970 00:00:00 GMT");xhr.setRequestHeader("X-Requested-With","XMLHttpRequest");xhr.setRequestHeader("Accept",s.dataType&&s.accepts[s.dataType]?s.accepts[s.dataType]+", */*":s.accepts._default);}catch(e){}if(s.beforeSend&&s.beforeSend(xhr,s)===false){s.global&&jQuery.active--;xhr.abort();return false;}if(s.global)jQuery.event.trigger("ajaxSend",[xhr,s]);var onreadystatechange=function(isTimeout){if(!requestDone&&xhr&&(xhr.readyState==4||isTimeout=="timeout")){requestDone=true;if(ival){clearInterval(ival);ival=null;}status=isTimeout=="timeout"&&"timeout"||!jQuery.httpSuccess(xhr)&&"error"||s.ifModified&&jQuery.httpNotModified(xhr,s.url)&&"notmodified"||"success";if(status=="success"){try{data=jQuery.httpData(xhr,s.dataType,s.dataFilter);}catch(e){status="parsererror";}}if(status=="success"){var modRes;try{modRes=xhr.getResponseHeader("Last-Modified");}catch(e){}if(s.ifModified&&modRes)jQuery.lastModified[s.url]=modRes;if(!jsonp)success();}else
+jQuery.handleError(s,xhr,status);complete();if(s.async)xhr=null;}};if(s.async){var ival=setInterval(onreadystatechange,13);if(s.timeout>0)setTimeout(function(){if(xhr){xhr.abort();if(!requestDone)onreadystatechange("timeout");}},s.timeout);}try{xhr.send(s.data);}catch(e){jQuery.handleError(s,xhr,null,e);}if(!s.async)onreadystatechange();function success(){if(s.success)s.success(data,status);if(s.global)jQuery.event.trigger("ajaxSuccess",[xhr,s]);}function complete(){if(s.complete)s.complete(xhr,status);if(s.global)jQuery.event.trigger("ajaxComplete",[xhr,s]);if(s.global&&!--jQuery.active)jQuery.event.trigger("ajaxStop");}return xhr;},handleError:function(s,xhr,status,e){if(s.error)s.error(xhr,status,e);if(s.global)jQuery.event.trigger("ajaxError",[xhr,s,e]);},active:0,httpSuccess:function(xhr){try{return!xhr.status&&location.protocol=="file:"||(xhr.status>=200&&xhr.status<300)||xhr.status==304||xhr.status==1223||jQuery.browser.safari&&xhr.status==undefined;}catch(e){}return false;},httpNotModified:function(xhr,url){try{var xhrRes=xhr.getResponseHeader("Last-Modified");return xhr.status==304||xhrRes==jQuery.lastModified[url]||jQuery.browser.safari&&xhr.status==undefined;}catch(e){}return false;},httpData:function(xhr,type,filter){var ct=xhr.getResponseHeader("content-type"),xml=type=="xml"||!type&&ct&&ct.indexOf("xml")>=0,data=xml?xhr.responseXML:xhr.responseText;if(xml&&data.documentElement.tagName=="parsererror")throw"parsererror";if(filter)data=filter(data,type);if(type=="script")jQuery.globalEval(data);if(type=="json")data=eval("("+data+")");return data;},param:function(a){var s=[];if(a.constructor==Array||a.jquery)jQuery.each(a,function(){s.push(encodeURIComponent(this.name)+"="+encodeURIComponent(this.value));});else
+for(var j in a)if(a[j]&&a[j].constructor==Array)jQuery.each(a[j],function(){s.push(encodeURIComponent(j)+"="+encodeURIComponent(this));});else
+s.push(encodeURIComponent(j)+"="+encodeURIComponent(jQuery.isFunction(a[j])?a[j]():a[j]));return s.join("&").replace(/%20/g,"+");}});jQuery.fn.extend({show:function(speed,callback){return speed?this.animate({height:"show",width:"show",opacity:"show"},speed,callback):this.filter(":hidden").each(function(){this.style.display=this.oldblock||"";if(jQuery.css(this,"display")=="none"){var elem=jQuery("<"+this.tagName+" />").appendTo("body");this.style.display=elem.css("display");if(this.style.display=="none")this.style.display="block";elem.remove();}}).end();},hide:function(speed,callback){return speed?this.animate({height:"hide",width:"hide",opacity:"hide"},speed,callback):this.filter(":visible").each(function(){this.oldblock=this.oldblock||jQuery.css(this,"display");this.style.display="none";}).end();},_toggle:jQuery.fn.toggle,toggle:function(fn,fn2){return jQuery.isFunction(fn)&&jQuery.isFunction(fn2)?this._toggle.apply(this,arguments):fn?this.animate({height:"toggle",width:"toggle",opacity:"toggle"},fn,fn2):this.each(function(){jQuery(this)[jQuery(this).is(":hidden")?"show":"hide"]();});},slideDown:function(speed,callback){return this.animate({height:"show"},speed,callback);},slideUp:function(speed,callback){return this.animate({height:"hide"},speed,callback);},slideToggle:function(speed,callback){return this.animate({height:"toggle"},speed,callback);},fadeIn:function(speed,callback){return this.animate({opacity:"show"},speed,callback);},fadeOut:function(speed,callback){return this.animate({opacity:"hide"},speed,callback);},fadeTo:function(speed,to,callback){return this.animate({opacity:to},speed,callback);},animate:function(prop,speed,easing,callback){var optall=jQuery.speed(speed,easing,callback);return this[optall.queue===false?"each":"queue"](function(){if(this.nodeType!=1)return false;var opt=jQuery.extend({},optall),p,hidden=jQuery(this).is(":hidden"),self=this;for(p in prop){if(prop[p]=="hide"&&hidden||prop[p]=="show"&&!hidden)return opt.complete.call(this);if(p=="height"||p=="width"){opt.display=jQuery.css(this,"display");opt.overflow=this.style.overflow;}}if(opt.overflow!=null)this.style.overflow="hidden";opt.curAnim=jQuery.extend({},prop);jQuery.each(prop,function(name,val){var e=new jQuery.fx(self,opt,name);if(/toggle|show|hide/.test(val))e[val=="toggle"?hidden?"show":"hide":val](prop);else{var parts=val.toString().match(/^([+-]=)?([\d+-.]+)(.*)$/),start=e.cur(true)||0;if(parts){var end=parseFloat(parts[2]),unit=parts[3]||"px";if(unit!="px"){self.style[name]=(end||1)+unit;start=((end||1)/e.cur(true))*start;self.style[name]=start+unit;}if(parts[1])end=((parts[1]=="-="?-1:1)*end)+start;e.custom(start,end,unit);}else
+e.custom(start,val,"");}});return true;});},queue:function(type,fn){if(jQuery.isFunction(type)||(type&&type.constructor==Array)){fn=type;type="fx";}if(!type||(typeof type=="string"&&!fn))return queue(this[0],type);return this.each(function(){if(fn.constructor==Array)queue(this,type,fn);else{queue(this,type).push(fn);if(queue(this,type).length==1)fn.call(this);}});},stop:function(clearQueue,gotoEnd){var timers=jQuery.timers;if(clearQueue)this.queue([]);this.each(function(){for(var i=timers.length-1;i>=0;i--)if(timers[i].elem==this){if(gotoEnd)timers[i](true);timers.splice(i,1);}});if(!gotoEnd)this.dequeue();return this;}});var queue=function(elem,type,array){if(elem){type=type||"fx";var q=jQuery.data(elem,type+"queue");if(!q||array)q=jQuery.data(elem,type+"queue",jQuery.makeArray(array));}return q;};jQuery.fn.dequeue=function(type){type=type||"fx";return this.each(function(){var q=queue(this,type);q.shift();if(q.length)q[0].call(this);});};jQuery.extend({speed:function(speed,easing,fn){var opt=speed&&speed.constructor==Object?speed:{complete:fn||!fn&&easing||jQuery.isFunction(speed)&&speed,duration:speed,easing:fn&&easing||easing&&easing.constructor!=Function&&easing};opt.duration=(opt.duration&&opt.duration.constructor==Number?opt.duration:jQuery.fx.speeds[opt.duration])||jQuery.fx.speeds.def;opt.old=opt.complete;opt.complete=function(){if(opt.queue!==false)jQuery(this).dequeue();if(jQuery.isFunction(opt.old))opt.old.call(this);};return opt;},easing:{linear:function(p,n,firstNum,diff){return firstNum+diff*p;},swing:function(p,n,firstNum,diff){return((-Math.cos(p*Math.PI)/2)+0.5)*diff+firstNum;}},timers:[],timerId:null,fx:function(elem,options,prop){this.options=options;this.elem=elem;this.prop=prop;if(!options.orig)options.orig={};}});jQuery.fx.prototype={update:function(){if(this.options.step)this.options.step.call(this.elem,this.now,this);(jQuery.fx.step[this.prop]||jQuery.fx.step._default)(this);if(this.prop=="height"||this.prop=="width")this.elem.style.display="block";},cur:function(force){if(this.elem[this.prop]!=null&&this.elem.style[this.prop]==null)return this.elem[this.prop];var r=parseFloat(jQuery.css(this.elem,this.prop,force));return r&&r>-10000?r:parseFloat(jQuery.curCSS(this.elem,this.prop))||0;},custom:function(from,to,unit){this.startTime=now();this.start=from;this.end=to;this.unit=unit||this.unit||"px";this.now=this.start;this.pos=this.state=0;this.update();var self=this;function t(gotoEnd){return self.step(gotoEnd);}t.elem=this.elem;jQuery.timers.push(t);if(jQuery.timerId==null){jQuery.timerId=setInterval(function(){var timers=jQuery.timers;for(var i=0;i<timers.length;i++)if(!timers[i]())timers.splice(i--,1);if(!timers.length){clearInterval(jQuery.timerId);jQuery.timerId=null;}},13);}},show:function(){this.options.orig[this.prop]=jQuery.attr(this.elem.style,this.prop);this.options.show=true;this.custom(0,this.cur());if(this.prop=="width"||this.prop=="height")this.elem.style[this.prop]="1px";jQuery(this.elem).show();},hide:function(){this.options.orig[this.prop]=jQuery.attr(this.elem.style,this.prop);this.options.hide=true;this.custom(this.cur(),0);},step:function(gotoEnd){var t=now();if(gotoEnd||t>this.options.duration+this.startTime){this.now=this.end;this.pos=this.state=1;this.update();this.options.curAnim[this.prop]=true;var done=true;for(var i in this.options.curAnim)if(this.options.curAnim[i]!==true)done=false;if(done){if(this.options.display!=null){this.elem.style.overflow=this.options.overflow;this.elem.style.display=this.options.display;if(jQuery.css(this.elem,"display")=="none")this.elem.style.display="block";}if(this.options.hide)this.elem.style.display="none";if(this.options.hide||this.options.show)for(var p in this.options.curAnim)jQuery.attr(this.elem.style,p,this.options.orig[p]);}if(done)this.options.complete.call(this.elem);return false;}else{var n=t-this.startTime;this.state=n/this.options.duration;this.pos=jQuery.easing[this.options.easing||(jQuery.easing.swing?"swing":"linear")](this.state,n,0,1,this.options.duration);this.now=this.start+((this.end-this.start)*this.pos);this.update();}return true;}};jQuery.extend(jQuery.fx,{speeds:{slow:600,fast:200,def:400},step:{scrollLeft:function(fx){fx.elem.scrollLeft=fx.now;},scrollTop:function(fx){fx.elem.scrollTop=fx.now;},opacity:function(fx){jQuery.attr(fx.elem.style,"opacity",fx.now);},_default:function(fx){fx.elem.style[fx.prop]=fx.now+fx.unit;}}});jQuery.fn.offset=function(){var left=0,top=0,elem=this[0],results;if(elem)with(jQuery.browser){var parent=elem.parentNode,offsetChild=elem,offsetParent=elem.offsetParent,doc=elem.ownerDocument,safari2=safari&&parseInt(version)<522&&!/adobeair/i.test(userAgent),css=jQuery.curCSS,fixed=css(elem,"position")=="fixed";if(elem.getBoundingClientRect){var box=elem.getBoundingClientRect();add(box.left+Math.max(doc.documentElement.scrollLeft,doc.body.scrollLeft),box.top+Math.max(doc.documentElement.scrollTop,doc.body.scrollTop));add(-doc.documentElement.clientLeft,-doc.documentElement.clientTop);}else{add(elem.offsetLeft,elem.offsetTop);while(offsetParent){add(offsetParent.offsetLeft,offsetParent.offsetTop);if(mozilla&&!/^t(able|d|h)$/i.test(offsetParent.tagName)||safari&&!safari2)border(offsetParent);if(!fixed&&css(offsetParent,"position")=="fixed")fixed=true;offsetChild=/^body$/i.test(offsetParent.tagName)?offsetChild:offsetParent;offsetParent=offsetParent.offsetParent;}while(parent&&parent.tagName&&!/^body|html$/i.test(parent.tagName)){if(!/^inline|table.*$/i.test(css(parent,"display")))add(-parent.scrollLeft,-parent.scrollTop);if(mozilla&&css(parent,"overflow")!="visible")border(parent);parent=parent.parentNode;}if((safari2&&(fixed||css(offsetChild,"position")=="absolute"))||(mozilla&&css(offsetChild,"position")!="absolute"))add(-doc.body.offsetLeft,-doc.body.offsetTop);if(fixed)add(Math.max(doc.documentElement.scrollLeft,doc.body.scrollLeft),Math.max(doc.documentElement.scrollTop,doc.body.scrollTop));}results={top:top,left:left};}function border(elem){add(jQuery.curCSS(elem,"borderLeftWidth",true),jQuery.curCSS(elem,"borderTopWidth",true));}function add(l,t){left+=parseInt(l,10)||0;top+=parseInt(t,10)||0;}return results;};jQuery.fn.extend({position:function(){var left=0,top=0,results;if(this[0]){var offsetParent=this.offsetParent(),offset=this.offset(),parentOffset=/^body|html$/i.test(offsetParent[0].tagName)?{top:0,left:0}:offsetParent.offset();offset.top-=num(this,'marginTop');offset.left-=num(this,'marginLeft');parentOffset.top+=num(offsetParent,'borderTopWidth');parentOffset.left+=num(offsetParent,'borderLeftWidth');results={top:offset.top-parentOffset.top,left:offset.left-parentOffset.left};}return results;},offsetParent:function(){var offsetParent=this[0].offsetParent;while(offsetParent&&(!/^body|html$/i.test(offsetParent.tagName)&&jQuery.css(offsetParent,'position')=='static'))offsetParent=offsetParent.offsetParent;return jQuery(offsetParent);}});jQuery.each(['Left','Top'],function(i,name){var method='scroll'+name;jQuery.fn[method]=function(val){if(!this[0])return;return val!=undefined?this.each(function(){this==window||this==document?window.scrollTo(!i?val:jQuery(window).scrollLeft(),i?val:jQuery(window).scrollTop()):this[method]=val;}):this[0]==window||this[0]==document?self[i?'pageYOffset':'pageXOffset']||jQuery.boxModel&&document.documentElement[method]||document.body[method]:this[0][method];};});jQuery.each(["Height","Width"],function(i,name){var tl=i?"Left":"Top",br=i?"Right":"Bottom";jQuery.fn["inner"+name]=function(){return this[name.toLowerCase()]()+num(this,"padding"+tl)+num(this,"padding"+br);};jQuery.fn["outer"+name]=function(margin){return this["inner"+name]()+num(this,"border"+tl+"Width")+num(this,"border"+br+"Width")+(margin?num(this,"margin"+tl)+num(this,"margin"+br):0);};});})();
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/pygments.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/pygments.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/pygments.css	(revision 76)
@@ -0,0 +1,61 @@
+.hll { background-color: #ffffcc }
+.c { color: #408090; font-style: italic } /* Comment */
+.err { border: 1px solid #FF0000 } /* Error */
+.k { color: #007020; font-weight: bold } /* Keyword */
+.o { color: #666666 } /* Operator */
+.cm { color: #408090; font-style: italic } /* Comment.Multiline */
+.cp { color: #007020 } /* Comment.Preproc */
+.c1 { color: #408090; font-style: italic } /* Comment.Single */
+.cs { color: #408090; background-color: #fff0f0 } /* Comment.Special */
+.gd { color: #A00000 } /* Generic.Deleted */
+.ge { font-style: italic } /* Generic.Emph */
+.gr { color: #FF0000 } /* Generic.Error */
+.gh { color: #000080; font-weight: bold } /* Generic.Heading */
+.gi { color: #00A000 } /* Generic.Inserted */
+.go { color: #303030 } /* Generic.Output */
+.gp { color: #c65d09; font-weight: bold } /* Generic.Prompt */
+.gs { font-weight: bold } /* Generic.Strong */
+.gu { color: #800080; font-weight: bold } /* Generic.Subheading */
+.gt { color: #0040D0 } /* Generic.Traceback */
+.kc { color: #007020; font-weight: bold } /* Keyword.Constant */
+.kd { color: #007020; font-weight: bold } /* Keyword.Declaration */
+.kn { color: #007020; font-weight: bold } /* Keyword.Namespace */
+.kp { color: #007020 } /* Keyword.Pseudo */
+.kr { color: #007020; font-weight: bold } /* Keyword.Reserved */
+.kt { color: #902000 } /* Keyword.Type */
+.m { color: #208050 } /* Literal.Number */
+.s { color: #4070a0 } /* Literal.String */
+.na { color: #4070a0 } /* Name.Attribute */
+.nb { color: #007020 } /* Name.Builtin */
+.nc { color: #0e84b5; font-weight: bold } /* Name.Class */
+.no { color: #60add5 } /* Name.Constant */
+.nd { color: #555555; font-weight: bold } /* Name.Decorator */
+.ni { color: #d55537; font-weight: bold } /* Name.Entity */
+.ne { color: #007020 } /* Name.Exception */
+.nf { color: #06287e } /* Name.Function */
+.nl { color: #002070; font-weight: bold } /* Name.Label */
+.nn { color: #0e84b5; font-weight: bold } /* Name.Namespace */
+.nt { color: #062873; font-weight: bold } /* Name.Tag */
+.nv { color: #bb60d5 } /* Name.Variable */
+.ow { color: #007020; font-weight: bold } /* Operator.Word */
+.w { color: #bbbbbb } /* Text.Whitespace */
+.mf { color: #208050 } /* Literal.Number.Float */
+.mh { color: #208050 } /* Literal.Number.Hex */
+.mi { color: #208050 } /* Literal.Number.Integer */
+.mo { color: #208050 } /* Literal.Number.Oct */
+.sb { color: #4070a0 } /* Literal.String.Backtick */
+.sc { color: #4070a0 } /* Literal.String.Char */
+.sd { color: #4070a0; font-style: italic } /* Literal.String.Doc */
+.s2 { color: #4070a0 } /* Literal.String.Double */
+.se { color: #4070a0; font-weight: bold } /* Literal.String.Escape */
+.sh { color: #4070a0 } /* Literal.String.Heredoc */
+.si { color: #70a0d0; font-style: italic } /* Literal.String.Interpol */
+.sx { color: #c65d09 } /* Literal.String.Other */
+.sr { color: #235388 } /* Literal.String.Regex */
+.s1 { color: #4070a0 } /* Literal.String.Single */
+.ss { color: #517918 } /* Literal.String.Symbol */
+.bp { color: #007020 } /* Name.Builtin.Pseudo */
+.vc { color: #bb60d5 } /* Name.Variable.Class */
+.vg { color: #bb60d5 } /* Name.Variable.Global */
+.vi { color: #bb60d5 } /* Name.Variable.Instance */
+.il { color: #208050 } /* Literal.Number.Integer.Long */
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/searchtools.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/searchtools.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/searchtools.js	(revision 76)
@@ -0,0 +1,467 @@
+/**
+ * helper function to return a node containing the
+ * search summary for a given text. keywords is a list
+ * of stemmed words, hlwords is the list of normal, unstemmed
+ * words. the first one is used to find the occurance, the
+ * latter for highlighting it.
+ */
+
+jQuery.makeSearchSummary = function(text, keywords, hlwords) {
+  var textLower = text.toLowerCase();
+  var start = 0;
+  $.each(keywords, function() {
+    var i = textLower.indexOf(this.toLowerCase());
+    if (i > -1)
+      start = i;
+  });
+  start = Math.max(start - 120, 0);
+  var excerpt = ((start > 0) ? '...' : '') +
+  $.trim(text.substr(start, 240)) +
+  ((start + 240 - text.length) ? '...' : '');
+  var rv = $('<div class="context"></div>').text(excerpt);
+  $.each(hlwords, function() {
+    rv = rv.highlightText(this, 'highlight');
+  });
+  return rv;
+}
+
+/**
+ * Porter Stemmer
+ */
+var PorterStemmer = function() {
+
+  var step2list = {
+    ational: 'ate',
+    tional: 'tion',
+    enci: 'ence',
+    anci: 'ance',
+    izer: 'ize',
+    bli: 'ble',
+    alli: 'al',
+    entli: 'ent',
+    eli: 'e',
+    ousli: 'ous',
+    ization: 'ize',
+    ation: 'ate',
+    ator: 'ate',
+    alism: 'al',
+    iveness: 'ive',
+    fulness: 'ful',
+    ousness: 'ous',
+    aliti: 'al',
+    iviti: 'ive',
+    biliti: 'ble',
+    logi: 'log'
+  };
+
+  var step3list = {
+    icate: 'ic',
+    ative: '',
+    alize: 'al',
+    iciti: 'ic',
+    ical: 'ic',
+    ful: '',
+    ness: ''
+  };
+
+  var c = "[^aeiou]";          // consonant
+  var v = "[aeiouy]";          // vowel
+  var C = c + "[^aeiouy]*";    // consonant sequence
+  var V = v + "[aeiou]*";      // vowel sequence
+
+  var mgr0 = "^(" + C + ")?" + V + C;                      // [C]VC... is m>0
+  var meq1 = "^(" + C + ")?" + V + C + "(" + V + ")?$";    // [C]VC[V] is m=1
+  var mgr1 = "^(" + C + ")?" + V + C + V + C;              // [C]VCVC... is m>1
+  var s_v   = "^(" + C + ")?" + v;                         // vowel in stem
+
+  this.stemWord = function (w) {
+    var stem;
+    var suffix;
+    var firstch;
+    var origword = w;
+
+    if (w.length < 3)
+      return w;
+
+    var re;
+    var re2;
+    var re3;
+    var re4;
+
+    firstch = w.substr(0,1);
+    if (firstch == "y")
+      w = firstch.toUpperCase() + w.substr(1);
+
+    // Step 1a
+    re = /^(.+?)(ss|i)es$/;
+    re2 = /^(.+?)([^s])s$/;
+
+    if (re.test(w))
+      w = w.replace(re,"$1$2");
+    else if (re2.test(w))
+      w = w.replace(re2,"$1$2");
+
+    // Step 1b
+    re = /^(.+?)eed$/;
+    re2 = /^(.+?)(ed|ing)$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      re = new RegExp(mgr0);
+      if (re.test(fp[1])) {
+        re = /.$/;
+        w = w.replace(re,"");
+      }
+    }
+    else if (re2.test(w)) {
+      var fp = re2.exec(w);
+      stem = fp[1];
+      re2 = new RegExp(s_v);
+      if (re2.test(stem)) {
+        w = stem;
+        re2 = /(at|bl|iz)$/;
+        re3 = new RegExp("([^aeiouylsz])\\1$");
+        re4 = new RegExp("^" + C + v + "[^aeiouwxy]$");
+        if (re2.test(w))
+          w = w + "e";
+        else if (re3.test(w)) {
+          re = /.$/;
+          w = w.replace(re,"");
+        }
+        else if (re4.test(w))
+          w = w + "e";
+      }
+    }
+
+    // Step 1c
+    re = /^(.+?)y$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      re = new RegExp(s_v);
+      if (re.test(stem))
+        w = stem + "i";
+    }
+
+    // Step 2
+    re = /^(.+?)(ational|tional|enci|anci|izer|bli|alli|entli|eli|ousli|ization|ation|ator|alism|iveness|fulness|ousness|aliti|iviti|biliti|logi)$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      suffix = fp[2];
+      re = new RegExp(mgr0);
+      if (re.test(stem))
+        w = stem + step2list[suffix];
+    }
+
+    // Step 3
+    re = /^(.+?)(icate|ative|alize|iciti|ical|ful|ness)$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      suffix = fp[2];
+      re = new RegExp(mgr0);
+      if (re.test(stem))
+        w = stem + step3list[suffix];
+    }
+
+    // Step 4
+    re = /^(.+?)(al|ance|ence|er|ic|able|ible|ant|ement|ment|ent|ou|ism|ate|iti|ous|ive|ize)$/;
+    re2 = /^(.+?)(s|t)(ion)$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      re = new RegExp(mgr1);
+      if (re.test(stem))
+        w = stem;
+    }
+    else if (re2.test(w)) {
+      var fp = re2.exec(w);
+      stem = fp[1] + fp[2];
+      re2 = new RegExp(mgr1);
+      if (re2.test(stem))
+        w = stem;
+    }
+
+    // Step 5
+    re = /^(.+?)e$/;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      re = new RegExp(mgr1);
+      re2 = new RegExp(meq1);
+      re3 = new RegExp("^" + C + v + "[^aeiouwxy]$");
+      if (re.test(stem) || (re2.test(stem) && !(re3.test(stem))))
+        w = stem;
+    }
+    re = /ll$/;
+    re2 = new RegExp(mgr1);
+    if (re.test(w) && re2.test(w)) {
+      re = /.$/;
+      w = w.replace(re,"");
+    }
+
+    // and turn initial Y back to y
+    if (firstch == "y")
+      w = firstch.toLowerCase() + w.substr(1);
+    return w;
+  }
+}
+
+
+/**
+ * Search Module
+ */
+var Search = {
+
+  _index : null,
+  _queued_query : null,
+  _pulse_status : -1,
+
+  init : function() {
+      var params = $.getQueryParameters();
+      if (params.q) {
+          var query = params.q[0];
+          $('input[name="q"]')[0].value = query;
+          this.performSearch(query);
+      }
+  },
+
+  /**
+   * Sets the index
+   */
+  setIndex : function(index) {
+    var q;
+    this._index = index;
+    if ((q = this._queued_query) !== null) {
+      this._queued_query = null;
+      Search.query(q);
+    }
+  },
+
+  hasIndex : function() {
+      return this._index !== null;
+  },
+
+  deferQuery : function(query) {
+      this._queued_query = query;
+  },
+
+  stopPulse : function() {
+      this._pulse_status = 0;
+  },
+
+  startPulse : function() {
+    if (this._pulse_status >= 0)
+        return;
+    function pulse() {
+      Search._pulse_status = (Search._pulse_status + 1) % 4;
+      var dotString = '';
+      for (var i = 0; i < Search._pulse_status; i++)
+        dotString += '.';
+      Search.dots.text(dotString);
+      if (Search._pulse_status > -1)
+        window.setTimeout(pulse, 500);
+    };
+    pulse();
+  },
+
+  /**
+   * perform a search for something
+   */
+  performSearch : function(query) {
+    // create the required interface elements
+    this.out = $('#search-results');
+    this.title = $('<h2>' + _('Searching') + '</h2>').appendTo(this.out);
+    this.dots = $('<span></span>').appendTo(this.title);
+    this.status = $('<p style="display: none"></p>').appendTo(this.out);
+    this.output = $('<ul class="search"/>').appendTo(this.out);
+
+    $('#search-progress').text(_('Preparing search...'));
+    this.startPulse();
+
+    // index already loaded, the browser was quick!
+    if (this.hasIndex())
+      this.query(query);
+    else
+      this.deferQuery(query);
+  },
+
+  query : function(query) {
+    // stem the searchterms and add them to the
+    // correct list
+    var stemmer = new PorterStemmer();
+    var searchterms = [];
+    var excluded = [];
+    var hlterms = [];
+    var tmp = query.split(/\s+/);
+    var object = (tmp.length == 1) ? tmp[0].toLowerCase() : null;
+    for (var i = 0; i < tmp.length; i++) {
+      // stem the word
+      var word = stemmer.stemWord(tmp[i]).toLowerCase();
+      // select the correct list
+      if (word[0] == '-') {
+        var toAppend = excluded;
+        word = word.substr(1);
+      }
+      else {
+        var toAppend = searchterms;
+        hlterms.push(tmp[i].toLowerCase());
+      }
+      // only add if not already in the list
+      if (!$.contains(toAppend, word))
+        toAppend.push(word);
+    };
+    var highlightstring = '?highlight=' + $.urlencode(hlterms.join(" "));
+
+    console.debug('SEARCH: searching for:');
+    console.info('required: ', searchterms);
+    console.info('excluded: ', excluded);
+
+    // prepare search
+    var filenames = this._index.filenames;
+    var titles = this._index.titles;
+    var terms = this._index.terms;
+    var descrefs = this._index.descrefs;
+    var modules = this._index.modules;
+    var desctypes = this._index.desctypes;
+    var fileMap = {};
+    var files = null;
+    var objectResults = [];
+    var regularResults = [];
+    $('#search-progress').empty();
+
+    // lookup as object
+    if (object != null) {
+      for (var module in modules) {
+        if (module.indexOf(object) > -1) {
+          fn = modules[module];
+          descr = _('module, in ') + titles[fn];
+          objectResults.push([filenames[fn], module, '#module-'+module, descr]);
+        }
+      }
+      for (var prefix in descrefs) {
+        for (var name in descrefs[prefix]) {
+          var fullname = (prefix ? prefix + '.' : '') + name;
+          if (fullname.toLowerCase().indexOf(object) > -1) {
+            match = descrefs[prefix][name];
+            descr = desctypes[match[1]] + _(', in ') + titles[match[0]];
+            objectResults.push([filenames[match[0]], fullname, '#'+fullname, descr]);
+          }
+        }
+      }
+    }
+
+    // sort results descending
+    objectResults.sort(function(a, b) {
+      return (a[1] > b[1]) ? -1 : ((a[1] < b[1]) ? 1 : 0);
+    });
+
+
+    // perform the search on the required terms
+    for (var i = 0; i < searchterms.length; i++) {
+      var word = searchterms[i];
+      // no match but word was a required one
+      if ((files = terms[word]) == null)
+        break;
+      if (files.length == undefined) {
+        files = [files];
+      }
+      // create the mapping
+      for (var j = 0; j < files.length; j++) {
+        var file = files[j];
+        if (file in fileMap)
+          fileMap[file].push(word);
+        else
+          fileMap[file] = [word];
+      }
+    }
+
+    // now check if the files don't contain excluded terms
+    for (var file in fileMap) {
+      var valid = true;
+
+      // check if all requirements are matched
+      if (fileMap[file].length != searchterms.length)
+        continue;
+
+      // ensure that none of the excluded terms is in the
+      // search result.
+      for (var i = 0; i < excluded.length; i++) {
+        if (terms[excluded[i]] == file ||
+            $.contains(terms[excluded[i]] || [], file)) {
+          valid = false;
+          break;
+        }
+      }
+
+      // if we have still a valid result we can add it
+      // to the result list
+      if (valid)
+        regularResults.push([filenames[file], titles[file], '', null]);
+    }
+
+    // delete unused variables in order to not waste
+    // memory until list is retrieved completely
+    delete filenames, titles, terms;
+
+    // now sort the regular results descending by title
+    regularResults.sort(function(a, b) {
+      var left = a[1].toLowerCase();
+      var right = b[1].toLowerCase();
+      return (left > right) ? -1 : ((left < right) ? 1 : 0);
+    });
+
+    // combine both
+    var results = regularResults.concat(objectResults);
+
+    // print the results
+    var resultCount = results.length;
+    function displayNextItem() {
+      // results left, load the summary and display it
+      if (results.length) {
+        var item = results.pop();
+        var listItem = $('<li style="display:none"></li>');
+        listItem.append($('<a/>').attr(
+          'href',
+          item[0] + DOCUMENTATION_OPTIONS.FILE_SUFFIX +
+          highlightstring + item[2]).html(item[1]));
+        if (item[3]) {
+          listItem.append($('<span> (' + item[3] + ')</span>'));
+          Search.output.append(listItem);
+          listItem.slideDown(5, function() {
+            displayNextItem();
+          });
+        } else if (DOCUMENTATION_OPTIONS.HAS_SOURCE) {
+          $.get('_sources/' + item[0] + '.txt', function(data) {
+            listItem.append($.makeSearchSummary(data, searchterms, hlterms));
+            Search.output.append(listItem);
+            listItem.slideDown(5, function() {
+              displayNextItem();
+            });
+          });
+        } else {
+          // no source available, just display title
+          Search.output.append(listItem);
+          listItem.slideDown(5, function() {
+            displayNextItem();
+          });
+        }
+      }
+      // search finished, update title and status message
+      else {
+        Search.stopPulse();
+        Search.title.text(_('Search Results'));
+        if (!resultCount)
+          Search.status.text(_('Your search did not match any documents. Please make sure that all words are spelled correctly and that you\'ve selected enough categories.'));
+        else
+            Search.status.text(_('Search finished, found %s page(s) matching the search query.').replace('%s', resultCount));
+        Search.status.fadeIn(500);
+      }
+    }
+    displayNextItem();
+  }
+}
+
+$(document).ready(function() {
+  Search.init();
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/builder.js	(revision 76)
@@ -0,0 +1,171 @@
+var builder = {
+    url: null, // to be set layout.html
+    modules: null, // to be set in builder-vX.Y.js
+    assets: null, // to be set by callback
+    setAssets: function(assets) {
+        this.assets = assets;
+    }
+};
+
+Ext.onReady(function() {
+    
+    var assets = builder.assets;
+    var modules = builder.modules;
+
+    var checks = {};
+    var prefs = {};
+    
+    // uncheck components that have not been specifically checked by the user
+    var updateDeps = function() {
+        for (var path in assets) {
+            var check = checks[path];
+            if (check) {
+                var checked = check.getValue();
+                if (checked && !prefs[path]) {
+                    // keep checked if required or included
+                    var depended = false;
+                    for (var p in assets) {
+                        var c = checks[p];
+                        if (c && c.getValue() && ((path in assets[p].require) || (path in assets[p].include))) {
+                            depended = true;
+                            break;
+                        }
+                    }
+                    if (!depended) {
+                        check.setValue(false);
+                        check.enable();
+                    }
+                }
+            }
+        }
+    };
+    
+    // check additional requires and includes
+    var checkDeps = function(path) {
+        var check, asset = assets[path];
+        for (var include in asset.include) {
+            check = checks[include];
+            if (check && !check.getValue()) {
+                checks[include].setValue(true);
+            }
+        }
+        for (var require in asset.require) {
+            check = checks[require];
+            if (check && !check.getValue()) {
+                checks[require].setValue(true);
+                checks[require].disable();
+            }
+        }
+    };
+    
+    // check form data before submitting
+    var validate = function() {
+        // for now, we just want to make sure something is checked
+        var valid = false;
+        for (var path in checks) {
+            if (checks[path].getValue()) {
+                valid = true;
+                break;
+            }
+        }
+        if (!valid) {
+            Ext.Msg.show({
+                msg: "You must select at least one component for your build.",
+                icon: Ext.MessageBox.WARNING
+            });
+        }
+        return valid;
+    };
+
+
+    var items = [];
+    var module, set, sets = {};
+    for (var path in modules) {
+        module = modules[path];
+        set = new Ext.form.FieldSet({
+            title: module.title,
+            autoHeight: true,
+            collapsible: true,
+            layout: "column",
+            autoWidth: true,
+            html: "<div class='module-desc'>" + module.description + "</div>",
+            defaults: {width: 300}
+        });
+        sets[path] = set;
+        items.push(set);
+    }
+    
+    var checkbox, parts, prefix, base, name;
+    var updating = false;
+    for (var path in assets) {
+        parts = path.split("/");
+        name = parts.pop().replace(".js", "");
+        var base = parts.join("/");
+        var set = sets[base];
+        if (set) {
+            prefix = modules[base].prefix;
+            checkbox = new Ext.form.Checkbox({
+                boxLabel: prefix ? (prefix + "." + name) : name,
+                name: "include[]",
+                inputValue: path,
+                ctCls: "component",
+                handler: function(box, checked) {
+                    var path = box.getRawValue();
+                    var old = updating;
+                    if (checked) {
+                        updating = true;
+                        checkDeps(path);
+                        updating = old;
+                    } else {
+                        updating = true;
+                        updateDeps();
+                        updating = old;
+                    }
+                    if (!updating) {
+                        // check represents user preferene
+                        prefs[path] = checked;
+                    }
+                }
+            });
+            checks[path] = checkbox;
+            set.add(checkbox);
+        }
+    }
+    
+    var dh = Ext.DomHelper;
+    
+    var formContainer = dh.insertAfter(
+        Ext.get(Ext.select(".builder-form-text").first()),
+        {tag: "div", cls: "builder-form"}
+    );
+
+    var form = new Ext.FormPanel({
+        method: "POST",
+        standardSubmit: true,
+        border: false,
+        bodyStyle: {padding: 10},
+        renderTo: formContainer,
+        labelWidth: 100,
+        autoWidth: true,
+        items: items
+    });
+    
+    var buttonContainer = dh.insertAfter(
+        Ext.get(Ext.select(".download-button-text").first()),
+        {tag: "div", cls: "download-button"}
+    );
+    
+    var download = new Ext.Button({
+        renderTo: buttonContainer,
+        text: "download",
+        iconCls: "download",
+        handler: function() {
+            if (validate()) {
+                var el = form.getForm().getEl().dom;
+                el.action = builder.url,
+                el.submit();
+            }
+        }
+    });
+    
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/doctools.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/doctools.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/doctools.js	(revision 76)
@@ -0,0 +1,232 @@
+/// XXX: make it cross browser
+
+/**
+ * make the code below compatible with browsers without
+ * an installed firebug like debugger
+ */
+if (!window.console || !console.firebug) {
+  var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
+      "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];
+  window.console = {};
+  for (var i = 0; i < names.length; ++i)
+    window.console[names[i]] = function() {}
+}
+
+/**
+ * small helper function to urldecode strings
+ */
+jQuery.urldecode = function(x) {
+  return decodeURIComponent(x).replace(/\+/g, ' ');
+}
+
+/**
+ * small helper function to urlencode strings
+ */
+jQuery.urlencode = encodeURIComponent;
+
+/**
+ * This function returns the parsed url parameters of the
+ * current request. Multiple values per key are supported,
+ * it will always return arrays of strings for the value parts.
+ */
+jQuery.getQueryParameters = function(s) {
+  if (typeof s == 'undefined')
+    s = document.location.search;
+  var parts = s.substr(s.indexOf('?') + 1).split('&');
+  var result = {};
+  for (var i = 0; i < parts.length; i++) {
+    var tmp = parts[i].split('=', 2);
+    var key = jQuery.urldecode(tmp[0]);
+    var value = jQuery.urldecode(tmp[1]);
+    if (key in result)
+      result[key].push(value);
+    else
+      result[key] = [value];
+  }
+  return result;
+}
+
+/**
+ * small function to check if an array contains
+ * a given item.
+ */
+jQuery.contains = function(arr, item) {
+  for (var i = 0; i < arr.length; i++) {
+    if (arr[i] == item)
+      return true;
+  }
+  return false;
+}
+
+/**
+ * highlight a given string on a jquery object by wrapping it in
+ * span elements with the given class name.
+ */
+jQuery.fn.highlightText = function(text, className) {
+  function highlight(node) {
+    if (node.nodeType == 3) {
+      var val = node.nodeValue;
+      var pos = val.toLowerCase().indexOf(text);
+      if (pos >= 0 && !jQuery.className.has(node.parentNode, className)) {
+        var span = document.createElement("span");
+        span.className = className;
+        span.appendChild(document.createTextNode(val.substr(pos, text.length)));
+        node.parentNode.insertBefore(span, node.parentNode.insertBefore(
+          document.createTextNode(val.substr(pos + text.length)),
+          node.nextSibling));
+        node.nodeValue = val.substr(0, pos);
+      }
+    }
+    else if (!jQuery(node).is("button, select, textarea")) {
+      jQuery.each(node.childNodes, function() {
+        highlight(this)
+      });
+    }
+  }
+  return this.each(function() {
+    highlight(this);
+  });
+}
+
+/**
+ * Small JavaScript module for the documentation.
+ */
+var Documentation = {
+
+  init : function() {
+    this.fixFirefoxAnchorBug();
+    this.highlightSearchWords();
+    this.initModIndex();
+  },
+
+  /**
+   * i18n support
+   */
+  TRANSLATIONS : {},
+  PLURAL_EXPR : function(n) { return n == 1 ? 0 : 1; },
+  LOCALE : 'unknown',
+
+  // gettext and ngettext don't access this so that the functions
+  // can savely bound to a different name (_ = Documentation.gettext)
+  gettext : function(string) {
+    var translated = Documentation.TRANSLATIONS[string];
+    if (typeof translated == 'undefined')
+      return string;
+    return (typeof translated == 'string') ? translated : translated[0];
+  },
+
+  ngettext : function(singular, plural, n) {
+    var translated = Documentation.TRANSLATIONS[singular];
+    if (typeof translated == 'undefined')
+      return (n == 1) ? singular : plural;
+    return translated[Documentation.PLURALEXPR(n)];
+  },
+
+  addTranslations : function(catalog) {
+    for (var key in catalog.messages)
+      this.TRANSLATIONS[key] = catalog.messages[key];
+    this.PLURAL_EXPR = new Function('n', 'return +(' + catalog.plural_expr + ')');
+    this.LOCALE = catalog.locale;
+  },
+
+  /**
+   * add context elements like header anchor links
+   */
+  addContextElements : function() {
+    $('div[id] > :header:first').each(function() {
+      $('<a class="headerlink">\u00B6</a>').
+      attr('href', '#' + this.id).
+      attr('title', _('Permalink to this headline')).
+      appendTo(this);
+    });
+    $('dt[id]').each(function() {
+      $('<a class="headerlink">\u00B6</a>').
+      attr('href', '#' + this.id).
+      attr('title', _('Permalink to this definition')).
+      appendTo(this);
+    });
+  },
+
+  /**
+   * workaround a firefox stupidity
+   */
+  fixFirefoxAnchorBug : function() {
+    if (document.location.hash && $.browser.mozilla)
+      window.setTimeout(function() {
+        document.location.href += '';
+      }, 10);
+  },
+
+  /**
+   * highlight the search words provided in the url in the text
+   */
+  highlightSearchWords : function() {
+    var params = $.getQueryParameters();
+    var terms = (params.highlight) ? params.highlight[0].split(/\s+/) : [];
+    if (terms.length) {
+      var body = $('div.body');
+      window.setTimeout(function() {
+        $.each(terms, function() {
+          body.highlightText(this.toLowerCase(), 'highlight');
+        });
+      }, 10);
+      $('<li class="highlight-link"><a href="javascript:Documentation.' +
+        'hideSearchWords()">' + _('Hide Search Matches') + '</a></li>')
+          .appendTo($('.sidebar .this-page-menu'));
+    }
+  },
+
+  /**
+   * init the modindex toggle buttons
+   */
+  initModIndex : function() {
+    var togglers = $('img.toggler').click(function() {
+      var src = $(this).attr('src');
+      var idnum = $(this).attr('id').substr(7);
+      console.log($('tr.cg-' + idnum).toggle());
+      if (src.substr(-9) == 'minus.png')
+        $(this).attr('src', src.substr(0, src.length-9) + 'plus.png');
+      else
+        $(this).attr('src', src.substr(0, src.length-8) + 'minus.png');
+    }).css('display', '');
+    if (DOCUMENTATION_OPTIONS.COLLAPSE_MODINDEX) {
+        togglers.click();
+    }
+  },
+
+  /**
+   * helper function to hide the search marks again
+   */
+  hideSearchWords : function() {
+    $('.sidebar .this-page-menu li.highlight-link').fadeOut(300);
+    $('span.highlight').removeClass('highlight');
+  },
+
+  /**
+   * make the url absolute
+   */
+  makeURL : function(relativeURL) {
+    return DOCUMENTATION_OPTIONS.URL_ROOT + '/' + relativeURL;
+  },
+
+  /**
+   * get the current relative url
+   */
+  getCurrentURL : function() {
+    var path = document.location.pathname;
+    var parts = path.split(/\//);
+    $.each(DOCUMENTATION_OPTIONS.URL_ROOT.split(/\//), function() {
+      if (this == '..')
+        parts.pop();
+    });
+    var url = parts.join('/');
+    return path.substring(url.lastIndexOf('/') + 1, path.length - 1);
+  }
+};
+
+// quick alias for translations
+_ = Documentation.gettext;
+
+$(document).ready(function() {
+  Documentation.init();
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/GeoExt.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/GeoExt.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/GeoExt.js	(revision 76)
@@ -0,0 +1,68 @@
+Ext.namespace("GeoExt.tree");GeoExt.tree.LayerNodeUI=Ext.extend(Ext.tree.TreeNodeUI,{radio:null,constructor:function(config){GeoExt.tree.LayerNodeUI.superclass.constructor.apply(this,arguments);},render:function(bulkRender){GeoExt.tree.LayerNodeUI.superclass.render.call(this,bulkRender);var a=this.node.attributes;if(a.radioGroup&&this.radio!==undefined){this.radio=Ext.DomHelper.insertAfter(this.checkbox,['<input type="radio" class="x-tree-node-radio" name="',a.radioGroup,'_radio"></input>'].join(""));}},onClick:function(e){if(e.getTarget('input[type=radio]',1)){this.fireEvent("radiochange",this.node);}else{GeoExt.tree.LayerNodeUI.superclass.onClick.call(this,e);}},toggleCheck:function(value){GeoExt.tree.LayerNodeUI.superclass.toggleCheck.call(this,value);var node=this.node;var layer=this.node.layer;node.visibilityChanging=true;if(this.checkbox&&(layer.getVisibility()!=this.isChecked())){layer.setVisibility(this.isChecked());}
+node.visibilityChanging=false;},onDestroy:function(){delete this.radio;GeoExt.tree.LayerNodeUI.superclass.onDestroy.call(this);}});GeoExt.tree.LayerNode=Ext.extend(Ext.tree.TreeNode,{layer:null,layerStore:null,childNodeType:null,visibilityChanging:false,constructor:function(config){config.leaf=config.leaf||!config.children;config.iconCls=typeof config.iconCls=="undefined"&&!config.children?"layer-icon":config.iconCls;config.checked=false;this.defaultUI=this.defaultUI||GeoExt.tree.LayerNodeUI;this.addEvents("radiochange");Ext.apply(this,{layer:config.layer,layerStore:config.layerStore,childNodeType:config.childNodeType});GeoExt.tree.LayerNode.superclass.constructor.apply(this,arguments);},render:function(bulkRender){var layer=this.layer instanceof OpenLayers.Layer&&this.layer;if(!layer){if(!this.layerStore||this.layerStore=="auto"){this.layerStore=GeoExt.MapPanel.guess().layers;}
+var i=this.layerStore.findBy(function(o){return o.get("title")==this.layer;},this);if(i!=-1){layer=this.layerStore.getAt(i).get("layer");}}
+if(!this.rendered||!layer){var ui=this.getUI();if(layer){this.layer=layer;if(!this.text){this.text=layer.name;}
+if(this.childNodeType){this.addChildNodes();}
+ui.show();ui.toggleCheck(layer.getVisibility());this.addVisibilityEventHandlers();this.attributes.checked=layer.getVisibility();}else{ui.hide();}
+if(this.layerStore instanceof GeoExt.data.LayerStore){this.addStoreEventHandlers(layer);}}
+GeoExt.tree.LayerNode.superclass.render.call(this,bulkRender);},addVisibilityEventHandlers:function(){this.layer.events.register("visibilitychanged",this,function(){if(!this.visibilityChanging&&this.attributes.checked!=this.layer.getVisibility()){this.getUI().toggleCheck(this.layer.getVisibility());}});this.on({"checkchange":function(node,checked){if(checked&&this.layer.isBaseLayer&&this.layer.map){this.layer.map.setBaseLayer(this.layer);}
+this.layer.setVisibility(checked);},scope:this});},addStoreEventHandlers:function(){this.layerStore.on({"add":function(store,records,index){var l;for(var i=0;i<records.length;++i){l=records[i].get("layer");if(this.layer==l){this.getUI().show();}else if(this.layer==l.name){this.render(bulkRender);return;}}},"remove":function(store,record,index){if(this.layer==record.get("layer")){this.getUI().hide();}},scope:this});},addChildNodes:function(){if(typeof this.childNodeType=="string"){Ext.tree.TreePanel.nodeTypes[this.childNodeType].add(this);}else if(typeof this.childNodeType.add==="function"){this.childNodeType.add(this);}}});Ext.tree.TreePanel.nodeTypes.gx_layer=GeoExt.tree.LayerNode;Ext.namespace("GeoExt.tree");GeoExt.tree.LayerContainer=Ext.extend(Ext.tree.TreeNode,{layerStore:null,defaults:null,constructor:function(config){this.layerStore=config.layerStore;this.defaults=config.defaults;GeoExt.tree.LayerContainer.superclass.constructor.apply(this,arguments);},render:function(bulkRender){if(!this.rendered){if(!this.layerStore){this.layerStore=GeoExt.MapPanel.guess().layers;}
+this.layerStore.each(function(record){this.addLayerNode(record);},this);this.layerStore.on({"add":this.onStoreAdd,"remove":this.onStoreRemove,scope:this});}
+GeoExt.tree.LayerContainer.superclass.render.call(this,bulkRender);},onStoreAdd:function(store,records,index){if(!this._reordering){var nodeIndex=this.recordIndexToNodeIndex(index);for(var i=0;i<records.length;++i){this.addLayerNode(records[i],nodeIndex);}}},onStoreRemove:function(store,record,index){if(!this._reordering){this.removeLayerNode(record);}},onDestroy:function(){if(this.layerStore){this.layerStore.un("add",this.onStoreAdd,this);this.layerStore.un("remove",this.onStoreRemove,this);}
+GeoExt.tree.LayerContainer.superclass.onDestroy.apply(this,arguments);},recordIndexToNodeIndex:function(index){var store=this.layerStore;var count=store.getCount();var nodeIndex=-1;for(var i=count-1;i>=0;--i){if(store.getAt(i).get("layer").displayInLayerSwitcher){++nodeIndex;if(index===i){break;}}};return nodeIndex;},nodeIndexToRecordIndex:function(index){var store=this.layerStore;var count=store.getCount();var nodeIndex=-1;for(var i=count-1;i>=0;--i){if(store.getAt(i).get("layer").displayInLayerSwitcher){++nodeIndex;if(index===nodeIndex){break;}}}
+return i;},addLayerNode:function(layerRecord,index){index=index||0;var layer=layerRecord.get("layer");if(layer.displayInLayerSwitcher===true){var node=new GeoExt.tree.LayerNode(Ext.applyIf({iconCls:layer.isBayeLayer?'baselayer-icon':'layer-icon',layer:layer,layerStore:this.layerStore},this.defaults));var sibling=this.item(index);if(sibling){this.insertBefore(node,sibling);}else{this.appendChild(node);}
+node.on("move",this.onChildMove,this);}},removeLayerNode:function(layerRecord){var layer=layerRecord.get("layer");if(layer.displayInLayerSwitcher==true){var node=this.findChildBy(function(node){return node.layer==layer;});if(node){node.un("move",this.onChildMove,this);node.remove();}}},onChildMove:function(tree,node,oldParent,newParent,index){if(oldParent===newParent){var newRecordIndex=this.nodeIndexToRecordIndex(index);var oldRecordIndex=this.layerStore.findBy(function(record){return record.get("layer")===node.layer;});var record=this.layerStore.getAt(oldRecordIndex);this._reordering=true;this.layerStore.remove(record);this.layerStore.insert(newRecordIndex,[record]);delete this._reordering;}}});Ext.tree.TreePanel.nodeTypes.gx_layercontainer=GeoExt.tree.LayerContainer;Ext.namespace("GeoExt.tree");GeoExt.tree.BaseLayerContainer=Ext.extend(GeoExt.tree.LayerContainer,{constructor:function(config){config.text=config.text||"Base Layer";GeoExt.tree.BaseLayerContainer.superclass.constructor.apply(this,arguments);},addLayerNode:function(layerRecord){var layer=layerRecord.get("layer");if(layer.isBaseLayer==true){GeoExt.tree.BaseLayerContainer.superclass.addLayerNode.call(this,layerRecord);}},removeLayerNode:function(layerRecord){var layer=layerRecord.get("layer");if(layer.isBaseLayer==true){GeoExt.tree.BaseLayerContainer.superclass.removeLayerNode.call(this,layerRecord);}}});Ext.tree.TreePanel.nodeTypes.gx_baselayercontainer=GeoExt.tree.BaseLayerContainer;Ext.namespace('GeoExt','GeoExt.data');GeoExt.data.FeatureReader=function(meta,recordType){meta=meta||{};if(!(recordType instanceof Function)){recordType=GeoExt.data.FeatureRecord.create(recordType||meta.fields||{});}
+GeoExt.data.FeatureReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.FeatureReader,Ext.data.DataReader,{totalRecords:null,read:function(response){return this.readRecords(response.features);},readRecords:function(features){var records=[];if(features){var recordType=this.recordType,fields=recordType.prototype.fields;var i,lenI,j,lenJ,feature,values,field,v;for(i=0,lenI=features.length;i<lenI;i++){feature=features[i];values={};if(feature.attributes){for(j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];if(/[\[\.]/.test(field.mapping)){try{v=new Function("obj","return obj."+field.mapping)(feature.attributes);}catch(e){v=field.defaultValue;}}
+else{v=feature.attributes[field.mapping||field.name]||field.defaultValue;}
+v=field.convert(v);values[field.name]=v;}}
+values.feature=feature;values.state=feature.state;values.fid=feature.fid;records[records.length]=new recordType(values,feature.id);}}
+return{records:records,totalRecords:this.totalRecords!=null?this.totalRecords:records.length};}});Ext.namespace("GeoExt.data");GeoExt.data.ScaleStore=Ext.extend(Ext.data.Store,{map:null,constructor:function(config){var map=(config.map instanceof GeoExt.MapPanel?config.map.map:config.map);delete config.map;config=Ext.applyIf(config,{reader:new Ext.data.JsonReader({},["level","resolution","scale"])});GeoExt.data.ScaleStore.superclass.constructor.call(this,config);if(map)this.bind(map);},bind:function(map,options){this.map=(map instanceof GeoExt.MapPanel?map.map:map);this.map.events.register('changebaselayer',this,this.populateFromMap);if(this.map.baseLayer){this.populateFromMap();}else{this.map.events.register('addlayer',this,this.populateOnAdd);}},unbind:function(){if(this.map){this.map.events.unregister('addlayer',this,this.populateOnAdd);this.map.events.unregister('changebaselayer',this,this.populateFromMap);delete this.map;}},populateOnAdd:function(evt){if(evt.layer.isBaseLayer){this.populateFromMap();this.map.events.unregister('addlayer',this,this.populateOnAdd);}},populateFromMap:function(){var zooms=[];for(var i=this.map.numZoomLevels-1;i>0;i--){var res=this.map.getResolutionForZoom(i);var units=this.map.baseLayer.units;var scale=OpenLayers.Util.getScaleFromResolution(res,units);zooms.push({level:i,resolution:res,scale:scale});}
+this.loadData(zooms);}});Ext.namespace("GeoExt.form");GeoExt.form.filterFromForm=function(form,logicalOp){if(form instanceof Ext.form.FormPanel){form=form.getForm();}
+var filters=[],values=form.getValues(false);for(var prop in values){var s=prop.split("__");var value=values[prop],type;if(s.length>1&&(type=GeoExt.form.filterFromForm.FILTER_MAP[s[1]])!==undefined){prop=s[0];}else{type=OpenLayers.Filter.Comparison.EQUAL_TO;}
+filters.push(new OpenLayers.Filter.Comparison({type:type,value:value,property:prop}));}
+return new OpenLayers.Filter.Logical({type:logicalOp||OpenLayers.Filter.Logical.AND,filters:filters});};GeoExt.form.filterFromForm.FILTER_MAP={"eq":OpenLayers.Filter.Comparison.EQUAL_TO,"ne":OpenLayers.Filter.Comparison.NOT_EQUAL_TO,"lt":OpenLayers.Filter.Comparison.LESS_THAN,"le":OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO,"gt":OpenLayers.Filter.Comparison.GREATER_THAN,"ge":OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO,"like":OpenLayers.Filter.Comparison.LIKE};GeoExt.form.SearchAction=Ext.extend(Ext.form.Action,{type:"search",response:null,constructor:function(form,options){GeoExt.form.SearchAction.superclass.constructor.call(this,form,options);},run:function(){var o=this.options;var f=GeoExt.form.filterFromForm(this.form);if(o.clientValidation===false||this.form.isValid()){this.response=o.protocol.read(Ext.applyIf({filter:f,callback:this.handleResponse,scope:this},o));}else if(o.clientValidation!==false){this.failureType=Ext.form.Action.CLIENT_INVALID;this.form.afterAction(this,false);}},handleResponse:function(response){this.response=response;if(response.success()){this.form.afterAction(this,true);}else{this.form.afterAction(this,false);}
+var o=this.options;if(o.callback){o.callback.call(o.scope,response);}}});Ext.namespace("GeoExt.data");GeoExt.data.FeatureStoreMixin={layer:null,reader:null,addFeatureFilter:null,addRecordFilter:null,constructor:function(config){config=config||{};config.reader=config.reader||new GeoExt.data.FeatureReader({},config.fields);var layer=config.layer;delete config.layer;if(config.features){config.data=config.features;}
+delete config.features;var options={initDir:config.initDir};delete config.initDir;arguments.callee.superclass.constructor.call(this,config);if(layer){this.bind(layer,options);}},bind:function(layer,options){if(this.layer){return;}
+this.layer=layer;options=options||{};var initDir=options.initDir;if(options.initDir==undefined){initDir=GeoExt.data.FeatureStore.LAYER_TO_STORE|GeoExt.data.FeatureStore.STORE_TO_LAYER;}
+var features=layer.features.slice(0);if(initDir&GeoExt.data.FeatureStore.STORE_TO_LAYER){var records=this.getRange();for(var i=records.length-1;i>=0;i--){this.layer.addFeatures([records[i].get("feature")]);}}
+if(initDir&GeoExt.data.FeatureStore.LAYER_TO_STORE){this.loadData(features,true);}
+layer.events.on({"featuresadded":this.onFeaturesAdded,"featuresremoved":this.onFeaturesRemoved,"featuremodified":this.onFeatureModified,scope:this});this.on({"load":this.onLoad,"clear":this.onClear,"add":this.onAdd,"remove":this.onRemove,"update":this.onUpdate,scope:this});},unbind:function(){if(this.layer){this.layer.events.un({"featuresadded":this.onFeaturesAdded,"featuresremoved":this.onFeaturesRemoved,"featuremodified":this.onFeatureModified,scope:this});this.un("load",this.onLoad,this);this.un("clear",this.onClear,this);this.un("add",this.onAdd,this);this.un("remove",this.onRemove,this);this.un("update",this.onUpdate,this);this.layer=null;}},onFeaturesAdded:function(evt){if(!this._adding){var features=evt.features,toAdd=features;if(typeof this.addFeatureFilter=="function"){toAdd=[];var i,len,feature;for(var i=0,len=features.length;i<len;i++){feature=features[i];if(this.addFeatureFilter(feature)!==false){toAdd.push(feature);}}}
+this._adding=true;this.loadData(toAdd,true);delete this._adding;}},onFeaturesRemoved:function(evt){if(!this._removing){var features=evt.features,feature,record,i;for(i=features.length-1;i>=0;i--){feature=features[i];record=this.getById(feature.id);if(record!==undefined){this._removing=true;this.remove(record);delete this._removing;}}}},onFeatureModified:function(evt){if(!this._updating){var feature=evt.feature;var record=this.getById(feature.id);if(record!==undefined){record.beginEdit();attributes=feature.attributes;if(attributes){var fields=this.recordType.prototype.fields;for(var i=0,len=fields.length;i<len;i++){var field=fields.items[i];var v=attributes[field.mapping||field.name]||field.defaultValue;v=field.convert(v);record.set(field.name,v);}}
+record.set("state",feature.state);record.set("fid",feature.fid);record.set("feature",feature);this._updating=true;record.endEdit();delete this._updating;}}},addFeaturesToLayer:function(records){var i,len,features,record;if(typeof this.addRecordFilter=="function"){features=[]
+for(i=0,len=records.length;i<len;i++){record=records[i];if(this.addRecordFilter(record)!==false){features.push(record.get("feature"));}}}else{features=new Array((len=records.length));for(i=0;i<len;i++){features[i]=records[i].get("feature");}}
+if(features.length>0){this._adding=true;this.layer.addFeatures(features);delete this._adding;}},onLoad:function(store,records,options){if(!options||options.add!==true){this._removing=true;this.layer.removeFeatures(this.layer.features);delete this._removing;this.addFeaturesToLayer(records);}},onClear:function(store){this._removing=true;this.layer.removeFeatures(this.layer.features);delete this._removing;},onAdd:function(store,records,index){if(!this._adding){this.addFeaturesToLayer(records);}},onRemove:function(store,record,index){if(!this._removing){var feature=record.get("feature");if(this.layer.getFeatureById(feature.id)!=null){this._removing=true;this.layer.removeFeatures([record.get("feature")]);delete this._removing;}}},onUpdate:function(store,record,operation){if(!this._updating){var feature=record.get("feature");if(record.fields){var cont=this.layer.events.triggerEvent("beforefeaturemodified",{feature:feature});if(cont!==false){record.fields.each(function(field){feature.attributes[field.mapping||field.name]=record.get(field.name);});this._updating=true;this.layer.events.triggerEvent("featuremodified",{feature:feature});delete this._updating;if(this.layer.getFeatureById(feature.id)!=null){this.layer.drawFeature(feature);}}}}}};GeoExt.data.FeatureStore=Ext.extend(Ext.data.Store,GeoExt.data.FeatureStoreMixin);GeoExt.data.FeatureStore.LAYER_TO_STORE=1;GeoExt.data.FeatureStore.STORE_TO_LAYER=2;Ext.namespace("GeoExt.data");GeoExt.data.FeatureRecord=Ext.data.Record.create([{name:"feature"},{name:"state"},{name:"fid"}]);GeoExt.data.FeatureRecord.create=function(o){var f=Ext.extend(GeoExt.data.FeatureRecord,{});var p=f.prototype;p.fields=new Ext.util.MixedCollection(false,function(field){return field.name;});GeoExt.data.FeatureRecord.prototype.fields.each(function(f){p.fields.add(f);});if(o){for(var i=0,len=o.length;i<len;i++){p.fields.add(new Ext.data.Field(o[i]));}}
+f.getField=function(name){return p.fields.get(name);};return f;};Ext.namespace("GeoExt");GeoExt.MapPanel=Ext.extend(Ext.Panel,{map:null,layers:null,center:null,zoom:null,extent:null,initComponent:function(){if(!(this.map instanceof OpenLayers.Map)){this.map=new OpenLayers.Map(Ext.applyIf(this.map||{},{allOverlays:true}));}
+if(typeof this.center=="string"){this.center=OpenLayers.LonLat.fromString(this.center);}else if(this.center instanceof Array){this.center=new OpenLayers.LonLat(this.center[0],this.center[1]);}
+if(typeof this.extent=="string"){this.extent=OpenLayers.Bounds.fromString(this.extent);}else if(this.extent instanceof Array){this.extent=OpenLayers.Bounds.fromArray(this.extent);}
+GeoExt.MapPanel.superclass.initComponent.call(this);},updateMapSize:function(){if(this.map){this.map.updateSize();}},initMap:function(){this.map.render(this.body.dom);var layers=this.layers;if(!layers||layers instanceof Array){this.layers=new GeoExt.data.LayerStore({layers:layers,map:this.map});}
+if(this.map.layers.length>0){if(this.center||this.zoom!=null){this.map.setCenter(this.center,this.zoom);}else if(this.extent){this.map.zoomToExtent(this.extent);}else{this.map.zoomToMaxExtent();}}},afterRender:function(){GeoExt.MapPanel.superclass.afterRender.apply(this,arguments);if(!this.ownerCt){this.initMap();}else{this.ownerCt.on("move",this.updateMapSize,this);this.ownerCt.on({"afterlayout":{fn:this.initMap,scope:this,single:true}});}},onResize:function(){GeoExt.MapPanel.superclass.onResize.apply(this,arguments);this.updateMapSize();},onDestroy:function(){if(this.ownerCt){this.ownerCt.un("move",this.updateMapSize,this);}
+GeoExt.MapPanel.superclass.onDestroy.apply(this,arguments);}});GeoExt.MapPanel.guess=function(){return Ext.ComponentMgr.all.find(function(o){return o instanceof GeoExt.MapPanel;});};Ext.reg('gx_mappanel',GeoExt.MapPanel);Ext.namespace("GeoExt.data");GeoExt.data.LayerRecord=Ext.data.Record.create([{name:"layer"},{name:"title",type:"string",mapping:"name"}]);GeoExt.data.LayerRecord.create=function(o){var f=Ext.extend(GeoExt.data.LayerRecord,{});var p=f.prototype;p.fields=new Ext.util.MixedCollection(false,function(field){return field.name;});GeoExt.data.LayerRecord.prototype.fields.each(function(f){p.fields.add(f);});if(o){for(var i=0,len=o.length;i<len;i++){p.fields.add(new Ext.data.Field(o[i]));}}
+f.getField=function(name){return p.fields.get(name);};return f;};Ext.namespace("GeoExt.data");GeoExt.data.WMSCapabilitiesReader=function(meta,recordType){meta=meta||{};if(!meta.format){meta.format=new OpenLayers.Format.WMSCapabilities();}
+if(!(typeof recordType==="function")){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||[{name:"name",type:"string"},{name:"abstract",type:"string"},{name:"queryable",type:"boolean"},{name:"formats"},{name:"styles"},{name:"llbbox"},{name:"minScale"},{name:"maxScale"},{name:"prefix"}]);}
+GeoExt.data.WMSCapabilitiesReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.WMSCapabilitiesReader,Ext.data.DataReader,{read:function(request){var data=request.responseXML;if(!data||!data.documentElement){data=request.responseText;}
+return this.readRecords(data);},readRecords:function(data){if(typeof data==="string"||data.nodeType){data=this.meta.format.read(data);}
+var url=data.capability.request.getmap.href;var records=[],layer;for(var i=0,len=data.capability.layers.length;i<len;i++){layer=data.capability.layers[i];if(layer.name){records.push(new this.recordType(Ext.apply(layer,{layer:new OpenLayers.Layer.WMS(layer.title||layer.name,url,{layers:layer.name})})));}}
+return{totalRecords:records.length,success:true,records:records};}});Ext.namespace("GeoExt.data");GeoExt.data.LayerStoreMixin={map:null,reader:null,constructor:function(config){config=config||{};config.reader=config.reader||new GeoExt.data.LayerReader({},config.fields);delete config.fields;var map=config.map instanceof GeoExt.MapPanel?config.map.map:config.map;delete config.map;if(config.layers){config.data=config.layers;}
+delete config.layers;var options={initDir:config.initDir};delete config.initDir;arguments.callee.superclass.constructor.call(this,config);if(map){this.bind(map,options);}},bind:function(map,options){if(this.map){return;}
+this.map=map;options=options||{};var initDir=options.initDir;if(options.initDir==undefined){initDir=GeoExt.data.LayerStore.MAP_TO_STORE|GeoExt.data.LayerStore.STORE_TO_MAP;}
+var layers=map.layers.slice(0);if(initDir&GeoExt.data.LayerStore.STORE_TO_MAP){var records=this.getRange();for(var i=records.length-1;i>=0;i--){this.map.addLayer(records[i].get("layer"));}}
+if(initDir&GeoExt.data.LayerStore.MAP_TO_STORE){this.loadData(layers,true);}
+map.events.on({"changelayer":this.onChangeLayer,"addlayer":this.onAddLayer,"removelayer":this.onRemoveLayer,scope:this});this.on({"load":this.onLoad,"clear":this.onClear,"add":this.onAdd,"remove":this.onRemove,scope:this});this.data.on({"replace":this.onReplace,scope:this});},unbind:function(){if(this.map){this.map.events.un({"changelayer":this.onChangeLayer,"addlayer":this.onAddLayer,"removelayer":this.onRemoveLayer,scope:this});this.un("load",this.onLoad,this);this.un("clear",this.onClear,this);this.un("add",this.onAdd,this);this.un("remove",this.onRemove,this);this.data.un("replace",this.onReplace,this);this.map=null;}},onChangeLayer:function(evt){var layer=evt.layer;if(evt.property==="order"){if(!this._adding&&!this._removing){var layerIndex=this.map.getLayerIndex(layer);var recordIndex=this.findBy(function(rec,id){return rec.get("layer")===layer;});if(recordIndex>-1){if(layerIndex!==recordIndex){var record=this.getAt(recordIndex);this._removing=true;this.remove(record);delete this._removing;this._adding=true;this.insert(layerIndex,[record]);delete this._adding;}}}}},onAddLayer:function(evt){if(!this._adding){var layer=evt.layer;this._adding=true;this.loadData([layer],true);delete this._adding;}},onRemoveLayer:function(evt){if(!this._removing){var layer=evt.layer;this._removing=true;this.remove(this.getById(layer.id));delete this._removing;}},onLoad:function(store,records,options){if(!Ext.isArray(records)){records=[records];}
+if(options&&!options.add){this._removing=true;for(var i=this.map.layers.length-1;i>=0;i--){this.map.removeLayer(this.map.layers[i]);}
+delete this._removing;var len=records.length;if(len>0){var layers=new Array(len);for(var j=0;j<len;j++){layers[j]=records[j].get("layer");}
+this._adding=true;this.map.addLayers(layers);delete this._adding;}}},onClear:function(store){this._removing=true;for(var i=this.map.layers.length-1;i>=0;i--){this.map.removeLayer(this.map.layers[i]);}
+delete this._removing;},onAdd:function(store,records,index){if(!this._adding){this._adding=true;var layer;for(var i=records.length-1;i>=0;--i){layer=records[i].get("layer");this.map.addLayer(layer);if(index!==this.map.layers.length-1){this.map.setLayerIndex(layer,index);}}
+delete this._adding;}},onRemove:function(store,record,index){if(!this._removing){var layer=record.get("layer");if(this.map.getLayer(layer.id)!=null){this._removing=true;this.removeMapLayer(record);delete this._removing;}}},removeMapLayer:function(record){this.map.removeLayer(record.get("layer"));},onReplace:function(key,oldRecord,newRecord){this.removeMapLayer(oldRecord);}};GeoExt.data.LayerStore=Ext.extend(Ext.data.Store,GeoExt.data.LayerStoreMixin);GeoExt.data.LayerStore.MAP_TO_STORE=1;GeoExt.data.LayerStore.STORE_TO_MAP=2;Ext.namespace("GeoExt");GeoExt.Popup=Ext.extend(Ext.Window,{anchored:true,panIn:true,unpinnable:true,feature:null,lonlat:null,animCollapse:false,draggable:false,shadow:false,popupCls:"gx-popup",ancCls:null,initComponent:function(){if(!this.feature&&this.lonlat){this.feature=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(this.lonlat.lon,this.lonlat.lat));}
+this.baseCls=this.popupCls+" "+this.baseCls;this.elements+=',anc';GeoExt.Popup.superclass.initComponent.call(this);},onRender:function(ct,position){GeoExt.Popup.superclass.onRender.call(this,ct,position);this.ancCls=this.popupCls+"-anc";this.createElement("anc",this.el);},initTools:function(){if(this.unpinnable){this.addTool({id:'unpin',handler:this.unanchorPopup.createDelegate(this,[])});}
+GeoExt.Popup.superclass.initTools.call(this);},addToMapPanel:function(mapPanel){this.mapPanel=mapPanel;this.map=this.mapPanel.map;mapPanel.add(this);mapPanel.doLayout();this.position();if(this.anchored){this.anchorPopup();}
+this.show();if(this.panIn){this.panIntoView();}},setSize:function(w,h){if(this.anc){var ancSize=this.getAnchorElement().getSize();if(typeof w=='object'){h=w.height-ancSize.height;w=w.width;}else if(!isNaN(h)){h=h-ancSize.height;}}
+GeoExt.Popup.superclass.setSize.call(this,w,h);},position:function(){var centerLonLat=this.feature.geometry.getBounds().getCenterLonLat();var centerPx=this.map.getViewPortPxFromLonLat(centerLonLat);var anchorSelector="div."+this.ancCls;var dx=this.anc.down(anchorSelector).getLeft(true)+
+this.anc.down(anchorSelector).getWidth()/2;var dy=this.el.getHeight();this.setPosition(centerPx.x-dx,centerPx.y-dy);},getAnchorElement:function(){var anchorSelector="div."+this.ancCls;var anc=Ext.get(this.el.child(anchorSelector));return anc;},anchorPopup:function(){this.map.events.on({"move":this.position,scope:this});this.on({"resize":this.position,"collapse":this.position,"expand":this.position,scope:this});},unanchorPopup:function(){this.unbindFromMapPanel();this.draggable=true;this.header.addClass("x-window-draggable");this.dd=new Ext.Window.DD(this);this.getAnchorElement().remove();this.anc=null;this.tools.unpin.hide();var collapsed=this.collapsed;this.mapPanel.remove(this,false);this.container=Ext.getBody();var xy=this.getPosition();this.hide();this.el.appendTo(Ext.getBody());this.setPagePosition(xy[0],xy[1]);this.show();if(collapsed){this.collapse();}},unbindFromMapPanel:function(){this.map.events.un({"move":this.position,scope:this});this.un("resize",this.position);this.un("collapse",this.position);this.un("expand",this.position);},panIntoView:function(){if(!this.anchored){return;}
+this.position();var centerLonLat=this.feature.geometry.getBounds().getCenterLonLat();var centerPx=this.map.getViewPortPxFromLonLat(centerLonLat);var popupPos=this.getPosition(true);var panelSize=[this.mapPanel.getInnerWidth(),this.mapPanel.getInnerHeight()];var popupSize=this.getSize();var newPos=[popupPos[0],popupPos[1]];var padding=this.map.paddingForPopups;if(popupPos[0]<padding.left){newPos[0]=padding.left;}else if(popupPos[0]+popupSize.width>panelSize[0]-padding.right){newPos[0]=panelSize[0]-padding.right-popupSize.width;}
+if(popupPos[1]<padding.top){newPos[1]=padding.top;}else if(popupPos[1]+popupSize.height>panelSize[1]-padding.bottom){newPos[1]=panelSize[1]-padding.bottom-popupSize.height;}
+var dx=popupPos[0]-newPos[0];var dy=popupPos[1]-newPos[1];this.map.pan(dx,dy);},beforeDestroy:function(){this.unbindFromMapPanel();GeoExt.Popup.superclass.beforeDestroy.call(this);}});Ext.reg('gx_popup',GeoExt.Popup);Ext.namespace("GeoExt.form");GeoExt.form.FormPanel=Ext.extend(Ext.form.FormPanel,{protocol:null,createForm:function(){delete this.initialConfig.listeners;return new GeoExt.form.BasicForm(null,this.initialConfig);},search:function(options){this.getForm().search(options);}});Ext.reg("gx_formpanel",GeoExt.form.FormPanel);Ext.namespace("GeoExt","GeoExt.data");GeoExt.data.LayerReader=function(meta,recordType){meta=meta||{};if(!(recordType instanceof Function)){recordType=GeoExt.data.LayerRecord.create(recordType||meta.fields||{});}
+GeoExt.data.LayerReader.superclass.constructor.call(this,meta,recordType);};Ext.extend(GeoExt.data.LayerReader,Ext.data.DataReader,{totalRecords:null,readRecords:function(layers){var records=[];if(layers){var recordType=this.recordType,fields=recordType.prototype.fields;var i,lenI,j,lenJ,layer,values,field,v;for(i=0,lenI=layers.length;i<lenI;i++){layer=layers[i];values={};for(j=0,lenJ=fields.length;j<lenJ;j++){field=fields.items[j];v=layer[field.mapping||field.name]||field.defaultValue;v=field.convert(v);values[field.name]=v;}
+values.layer=layer;records[records.length]=new recordType(values,layer.id);}}
+return{records:records,totalRecords:this.totalRecords!=null?this.totalRecords:records.length};}});Ext.namespace('GeoExt','GeoExt.data');GeoExt.data.ProtocolProxy=function(config){GeoExt.data.ProtocolProxy.superclass.constructor.call(this);Ext.apply(this,config);};Ext.extend(GeoExt.data.ProtocolProxy,Ext.data.DataProxy,{protocol:null,abortPrevious:true,response:null,load:function(params,reader,callback,scope,arg){if(this.fireEvent("beforeload",this,params)!==false){var o={params:params||{},request:{callback:callback,scope:scope,arg:arg},reader:reader};var cb=OpenLayers.Function.bind(this.loadResponse,this,o);if(this.abortPrevious){this.abortRequest();}
+var options={params:params,callback:cb,scope:this};Ext.applyIf(options,arg);this.response=this.protocol.read(options);}else{callback.call(scope||this,null,arg,false);}},abortRequest:function(){if(this.response){var response=this.response;if(response.priv&&typeof response.priv.abort=="function"){response.priv.abort();this.response=null;}}},loadResponse:function(o,response){if(response.success()){var result=o.reader.read(response);this.fireEvent("load",this,o,o.request.arg);o.request.callback.call(o.request.scope,result,o.request.arg,true);}else{this.fireEvent("loadexception",this,o,response);o.request.callback.call(o.request.scope,null,o.request.arg,false);}}});Ext.namespace("GeoExt.form");GeoExt.form.BasicForm=Ext.extend(Ext.form.BasicForm,{protocol:null,doAction:function(action,options){if(action=="search"){options=Ext.applyIf(options||{},{protocol:this.protocol});action=new GeoExt.form.SearchAction(this,options);}
+return GeoExt.form.BasicForm.superclass.doAction.call(this,action,options);},search:function(options){return this.doAction("search",options);}});Ext.namespace("GeoExt.data");GeoExt.data.WMSCapabilitiesStore=function(c){GeoExt.data.WMSCapabilitiesStore.superclass.constructor.call(this,Ext.apply(c,{proxy:c.proxy||(!c.data?new Ext.data.HttpProxy({url:c.url,disableCaching:false,method:"GET"}):undefined),reader:new GeoExt.data.WMSCapabilitiesReader(c,c.fields)}));};Ext.extend(GeoExt.data.WMSCapabilitiesStore,Ext.data.Store);Ext.namespace("GeoExt.tree");GeoExt.tree.OverlayLayerContainer=Ext.extend(GeoExt.tree.LayerContainer,{constructor:function(config){config.text=config.text||"Overlays";GeoExt.tree.OverlayLayerContainer.superclass.constructor.apply(this,arguments);},addLayerNode:function(layerRecord){var layer=layerRecord.get("layer");if(layer.isBaseLayer==false){GeoExt.tree.OverlayLayerContainer.superclass.addLayerNode.call(this,layerRecord);}},removeLayerNode:function(layerRecord){var layer=layerRecord.get("layer");if(layer.isBaseLayer==false){GeoExt.tree.OverlayLayerContainer.superclass.removeLayerNode.call(this,layerRecord);}}});Ext.tree.TreePanel.nodeTypes.gx_overlaylayercontainer=GeoExt.tree.OverlayLayerContainer;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/basic.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/basic.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/basic.css	(revision 76)
@@ -0,0 +1,417 @@
+/**
+ * Sphinx stylesheet -- basic theme
+ * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ */
+
+/* -- main layout ----------------------------------------------------------- */
+
+div.clearer {
+    clear: both;
+}
+
+/* -- relbar ---------------------------------------------------------------- */
+
+div.related {
+    width: 100%;
+    font-size: 90%;
+}
+
+div.related h3 {
+    display: none;
+}
+
+div.related ul {
+    margin: 0;
+    padding: 0 0 0 10px;
+    list-style: none;
+}
+
+div.related li {
+    display: inline;
+}
+
+div.related li.right {
+    float: right;
+    margin-right: 5px;
+}
+
+/* -- sidebar --------------------------------------------------------------- */
+
+div.sphinxsidebarwrapper {
+    padding: 10px 5px 0 10px;
+}
+
+div.sphinxsidebar {
+    float: left;
+    width: 230px;
+    margin-left: -100%;
+    font-size: 90%;
+}
+
+div.sphinxsidebar ul {
+    list-style: none;
+}
+
+div.sphinxsidebar ul ul,
+div.sphinxsidebar ul.want-points {
+    margin-left: 20px;
+    list-style: square;
+}
+
+div.sphinxsidebar ul ul {
+    margin-top: 0;
+    margin-bottom: 0;
+}
+
+div.sphinxsidebar form {
+    margin-top: 10px;
+}
+
+div.sphinxsidebar input {
+    border: 1px solid #98dbcc;
+    font-family: sans-serif;
+    font-size: 1em;
+}
+
+img {
+    border: 0;
+}
+
+/* -- search page ----------------------------------------------------------- */
+
+ul.search {
+    margin: 10px 0 0 20px;
+    padding: 0;
+}
+
+ul.search li {
+    padding: 5px 0 5px 20px;
+    background-image: url(file.png);
+    background-repeat: no-repeat;
+    background-position: 0 7px;
+}
+
+ul.search li a {
+    font-weight: bold;
+}
+
+ul.search li div.context {
+    color: #888;
+    margin: 2px 0 0 30px;
+    text-align: left;
+}
+
+ul.keywordmatches li.goodmatch a {
+    font-weight: bold;
+}
+
+/* -- index page ------------------------------------------------------------ */
+
+table.contentstable {
+    width: 90%;
+}
+
+table.contentstable p.biglink {
+    line-height: 150%;
+}
+
+a.biglink {
+    font-size: 1.3em;
+}
+
+span.linkdescr {
+    font-style: italic;
+    padding-top: 5px;
+    font-size: 90%;
+}
+
+/* -- general index --------------------------------------------------------- */
+
+table.indextable td {
+    text-align: left;
+    vertical-align: top;
+}
+
+table.indextable dl, table.indextable dd {
+    margin-top: 0;
+    margin-bottom: 0;
+}
+
+table.indextable tr.pcap {
+    height: 10px;
+}
+
+table.indextable tr.cap {
+    margin-top: 10px;
+    background-color: #f2f2f2;
+}
+
+img.toggler {
+    margin-right: 3px;
+    margin-top: 3px;
+    cursor: pointer;
+}
+
+/* -- general body styles --------------------------------------------------- */
+
+a.headerlink {
+    visibility: hidden;
+}
+
+h1:hover > a.headerlink,
+h2:hover > a.headerlink,
+h3:hover > a.headerlink,
+h4:hover > a.headerlink,
+h5:hover > a.headerlink,
+h6:hover > a.headerlink,
+dt:hover > a.headerlink {
+    visibility: visible;
+}
+
+div.body p.caption {
+    text-align: inherit;
+}
+
+div.body td {
+    text-align: left;
+}
+
+.field-list ul {
+    padding-left: 1em;
+}
+
+.first {
+    margin-top: 0 !important;
+}
+
+p.rubric {
+    margin-top: 30px;
+    font-weight: bold;
+}
+
+/* -- sidebars -------------------------------------------------------------- */
+
+div.sidebar {
+    margin: 0 0 0.5em 1em;
+    border: 1px solid #ddb;
+    padding: 7px 7px 0 7px;
+    background-color: #ffe;
+    width: 40%;
+    float: right;
+}
+
+p.sidebar-title {
+    font-weight: bold;
+}
+
+/* -- topics ---------------------------------------------------------------- */
+
+div.topic {
+    border: 1px solid #ccc;
+    padding: 7px 7px 0 7px;
+    margin: 10px 0 10px 0;
+}
+
+p.topic-title {
+    font-size: 1.1em;
+    font-weight: bold;
+    margin-top: 10px;
+}
+
+/* -- admonitions ----------------------------------------------------------- */
+
+div.admonition {
+    margin-top: 10px;
+    margin-bottom: 10px;
+    padding: 7px;
+}
+
+div.admonition dt {
+    font-weight: bold;
+}
+
+div.admonition dl {
+    margin-bottom: 0;
+}
+
+p.admonition-title {
+    margin: 0px 10px 5px 0px;
+    font-weight: bold;
+}
+
+div.body p.centered {
+    text-align: center;
+    margin-top: 25px;
+}
+
+/* -- tables ---------------------------------------------------------------- */
+
+table.docutils {
+    border: 0;
+    border-collapse: collapse;
+}
+
+table.docutils td, table.docutils th {
+    padding: 1px 8px 1px 0;
+    border-top: 0;
+    border-left: 0;
+    border-right: 0;
+    border-bottom: 1px solid #aaa;
+}
+
+table.field-list td, table.field-list th {
+    border: 0 !important;
+}
+
+table.footnote td, table.footnote th {
+    border: 0 !important;
+}
+
+th {
+    text-align: left;
+    padding-right: 5px;
+}
+
+/* -- other body styles ----------------------------------------------------- */
+
+dl {
+    margin-bottom: 15px;
+}
+
+dd p {
+    margin-top: 0px;
+}
+
+dd ul, dd table {
+    margin-bottom: 10px;
+}
+
+dd {
+    margin-top: 3px;
+    margin-bottom: 10px;
+    margin-left: 30px;
+}
+
+dt:target, .highlight {
+    background-color: #fbe54e;
+}
+
+dl.glossary dt {
+    font-weight: bold;
+    font-size: 1.1em;
+}
+
+.field-list ul {
+    margin: 0;
+    padding-left: 1em;
+}
+
+.field-list p {
+    margin: 0;
+}
+
+.refcount {
+    color: #060;
+}
+
+.optional {
+    font-size: 1.3em;
+}
+
+.versionmodified {
+    font-style: italic;
+}
+
+.system-message {
+    background-color: #fda;
+    padding: 5px;
+    border: 3px solid red;
+}
+
+.footnote:target  {
+    background-color: #ffa
+}
+
+.line-block {
+    display: block;
+    margin-top: 1em;
+    margin-bottom: 1em;
+}
+
+.line-block .line-block {
+    margin-top: 0;
+    margin-bottom: 0;
+    margin-left: 1.5em;
+}
+
+/* -- code displays --------------------------------------------------------- */
+
+pre {
+    overflow: auto;
+}
+
+td.linenos pre {
+    padding: 5px 0px;
+    border: 0;
+    background-color: transparent;
+    color: #aaa;
+}
+
+table.highlighttable {
+    margin-left: 0.5em;
+}
+
+table.highlighttable td {
+    padding: 0 0.5em 0 0.5em;
+}
+
+tt.descname {
+    background-color: transparent;
+    font-weight: bold;
+    font-size: 1.2em;
+}
+
+tt.descclassname {
+    background-color: transparent;
+}
+
+tt.xref, a tt {
+    background-color: transparent;
+    font-weight: bold;
+}
+
+h1 tt, h2 tt, h3 tt, h4 tt, h5 tt, h6 tt {
+    background-color: transparent;
+}
+
+/* -- math display ---------------------------------------------------------- */
+
+img.math {
+    vertical-align: middle;
+}
+
+div.body div.math p {
+    text-align: center;
+}
+
+span.eqno {
+    float: right;
+}
+
+/* -- printout stylesheet --------------------------------------------------- */
+
+@media print {
+    div.document,
+    div.documentwrapper,
+    div.bodywrapper {
+        margin: 0 !important;
+        width: 100%;
+    }
+
+    div.sphinxsidebar,
+    div.related,
+    div.footer,
+    #top-link {
+        display: none;
+    }
+}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/front-page.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/front-page.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_static/front-page.js	(revision 76)
@@ -0,0 +1,28 @@
+Ext.onReady(function() {
+    var win, block = Ext.Element.get(Ext.DomQuery.select("div.execute")[0]);
+    var button = new Ext.Button({
+        text: "Run it!",
+        cls: "execute",
+        handler: function() {
+            if(!win) {
+                win = new Ext.Window({
+                    title: "GeoExt in Action",
+                    height: 280, width: 450,
+                    layout: "fit",
+                    closeAction: "hide",
+                    items: [{
+                        xtype: "gx_mappanel",
+                        layers: [new OpenLayers.Layer.WMS(
+                            "Global Imagery", "http://maps.opengeo.org/geowebcache/service/wms",
+                            {layers: "bluemarble"}
+                        )],
+                        zoom: 1
+                    }]
+                });
+            }
+            win.show(container);
+        }
+    });
+    var container = Ext.Element.get(Ext.DomHelper.append(block, {tag: "div"}));
+    container.setHeight(35, {callback: function() {button.render(container)}});
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v1.0.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v1.0.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v1.0.html	(revision 76)
@@ -0,0 +1,128 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt 1.0 Builder &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    
+    
+    
+    
+    
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <script src="../_static/builder.js"></script>
+    <script src="../_static/builder-v1.0.js"></script>
+    <script>
+        Ext.BLANK_IMAGE_URL = "../_static/img/blank.gif";
+        builder.url = "http://buildjs.opengeo.org/builder/geoext/1.0";
+    </script>
+    <script src="http://buildjs.opengeo.org/assets/geoext/1.0?callback=builder.setAssets"></script>
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 1.0 Builder</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">GeoExt 1.0 Builder</a><ul>
+<li><a class="reference external" href="#customize-your-build">Customize Your Build</a></li>
+<li><a class="reference external" href="#download">Download</a></li>
+</ul>
+</li>
+</ul>
+
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-1-0-builder">
+<h1>GeoExt 1.0 Builder<a class="headerlink" href="#geoext-1-0-builder" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="customize-your-build">
+<h2>Customize Your Build<a class="headerlink" href="#customize-your-build" title="Permalink to this headline">Â¶</a></h2>
+<p class="builder-form-text">Choose the components used by your application from the form below.</p>
+</div>
+<div class="section" id="download">
+<h2>Download<a class="headerlink" href="#download" title="Permalink to this headline">Â¶</a></h2>
+<p class="download-button-text">When you are finished, click the &#8220;download&#8221; link to build a customized version
+of the library for your application.</p>
+<p class="credit">Custom build tool hosted by <a class="reference external" href="http://opengeo.org">OpenGeo</a>.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 1.0 Builder</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.6.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.6.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.6.html	(revision 76)
@@ -0,0 +1,128 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt 0.6 Builder &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    
+    
+    
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <script src="../_static/builder.js"></script>
+    <script src="../_static/builder-v0.6.js"></script>
+    <script>
+        Ext.BLANK_IMAGE_URL = "../_static/img/blank.gif";
+        builder.url = "http://buildjs.opengeo.org/builder/geoext/0.6";
+    </script>
+    <script src="http://buildjs.opengeo.org/assets/geoext/0.6?callback=builder.setAssets"></script>
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 0.6 Builder</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">GeoExt 0.6 Builder</a><ul>
+<li><a class="reference external" href="#customize-your-build">Customize Your Build</a></li>
+<li><a class="reference external" href="#download">Download</a></li>
+</ul>
+</li>
+</ul>
+
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-0-6-builder">
+<h1>GeoExt 0.6 Builder<a class="headerlink" href="#geoext-0-6-builder" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="customize-your-build">
+<h2>Customize Your Build<a class="headerlink" href="#customize-your-build" title="Permalink to this headline">Â¶</a></h2>
+<p class="builder-form-text">Choose the components used by your application from the form below.</p>
+</div>
+<div class="section" id="download">
+<h2>Download<a class="headerlink" href="#download" title="Permalink to this headline">Â¶</a></h2>
+<p class="download-button-text">When you are finished, click the &#8220;download&#8221; link to build a customized version
+of the library for your application.</p>
+<p class="credit">Custom build tool hosted by <a class="reference external" href="http://opengeo.org">OpenGeo</a>.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 0.6 Builder</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.7.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.7.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/builder/v0.7.html	(revision 76)
@@ -0,0 +1,128 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt 0.7 Builder &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    
+    
+    
+    
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <script src="../_static/builder.js"></script>
+    <script src="../_static/builder-v0.7.js"></script>
+    <script>
+        Ext.BLANK_IMAGE_URL = "../_static/img/blank.gif";
+        builder.url = "http://buildjs.opengeo.org/builder/geoext/0.7";
+    </script>
+    <script src="http://buildjs.opengeo.org/assets/geoext/0.7?callback=builder.setAssets"></script>
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 0.7 Builder</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">GeoExt 0.7 Builder</a><ul>
+<li><a class="reference external" href="#customize-your-build">Customize Your Build</a></li>
+<li><a class="reference external" href="#download">Download</a></li>
+</ul>
+</li>
+</ul>
+
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-0-7-builder">
+<h1>GeoExt 0.7 Builder<a class="headerlink" href="#geoext-0-7-builder" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="customize-your-build">
+<h2>Customize Your Build<a class="headerlink" href="#customize-your-build" title="Permalink to this headline">Â¶</a></h2>
+<p class="builder-form-text">Choose the components used by your application from the form below.</p>
+</div>
+<div class="section" id="download">
+<h2>Download<a class="headerlink" href="#download" title="Permalink to this headline">Â¶</a></h2>
+<p class="download-button-text">When you are finished, click the &#8220;download&#8221; link to build a customized version
+of the library for your application.</p>
+<p class="credit">Custom build tool hosted by <a class="reference external" href="http://opengeo.org">OpenGeo</a>.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">GeoExt 0.7 Builder</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/_downloads/sundials.kml
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/_downloads/sundials.kml	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/_downloads/sundials.kml	(revision 76)
@@ -0,0 +1,2273 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<kml xmlns="http://earth.google.com/kml/2.2">
+<Document>
+	<name>Sundial Collection.kmz</name>
+	<StyleMap id="msn_sunny_copy70">
+		<Pair>
+			<key>normal</key>
+			<styleUrl>#sn_sunny_copy69</styleUrl>
+		</Pair>
+		<Pair>
+			<key>highlight</key>
+			<styleUrl>#sh_sunny_copy70</styleUrl>
+		</Pair>
+	</StyleMap>
+	<Style id="sh_sunny_copy69">
+		<IconStyle>
+			<scale>1.4</scale>
+			<Icon>
+				<href>http://maps.google.com/mapfiles/kml/shapes/sunny.png</href>
+			</Icon>
+			<hotSpot x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
+		</IconStyle>
+		<LabelStyle>
+			<color>ff00aaff</color>
+		</LabelStyle>
+	</Style>
+	<Style id="sn_sunny_copy68">
+		<IconStyle>
+			<scale>1.2</scale>
+			<Icon>
+				<href>http://maps.google.com/mapfiles/kml/shapes/sunny.png</href>
+			</Icon>
+			<hotSpot x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
+		</IconStyle>
+		<LabelStyle>
+			<color>ff00aaff</color>
+		</LabelStyle>
+	</Style>
+	<Style id="sn_sunny_copy69">
+		<IconStyle>
+			<scale>1.2</scale>
+			<Icon>
+				<href>http://maps.google.com/mapfiles/kml/shapes/sunny.png</href>
+			</Icon>
+			<hotSpot x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
+		</IconStyle>
+		<LabelStyle>
+			<color>ff00aaff</color>
+		</LabelStyle>
+	</Style>
+	<Style id="sh_sunny_copy70">
+		<IconStyle>
+			<scale>1.4</scale>
+			<Icon>
+				<href>http://maps.google.com/mapfiles/kml/shapes/sunny.png</href>
+			</Icon>
+			<hotSpot x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
+		</IconStyle>
+		<LabelStyle>
+			<color>ff00aaff</color>
+		</LabelStyle>
+	</Style>
+	<StyleMap id="msn_sunny_copy69">
+		<Pair>
+			<key>normal</key>
+			<styleUrl>#sn_sunny_copy68</styleUrl>
+		</Pair>
+		<Pair>
+			<key>highlight</key>
+			<styleUrl>#sh_sunny_copy69</styleUrl>
+		</Pair>
+	</StyleMap>
+	<Folder>
+		<name>Sundial Collection</name>
+		<open>1</open>
+		<LookAt>
+			<longitude>-56.6884384968692</longitude>
+			<latitude>47.91963617483238</latitude>
+			<altitude>0</altitude>
+			<range>9958750.824018393</range>
+			<tilt>1.303827428939919e-015</tilt>
+			<heading>-16.31426621668193</heading>
+		</LookAt>
+		<Style>
+			<ListStyle>
+				<listItemType>check</listItemType>
+				<bgColor>00ffffff</bgColor>
+			</ListStyle>
+		</Style>
+		<Folder>
+			<name>High Resolution</name>
+			<Placemark>
+				<name>Sundial, Madestein, Den Haag</name>
+				<description><![CDATA[Horizontal sundial on the campus of the âParnassiaâ psychomedic centre in The Hague. The numbers on the left, 6,7 and 8, are wrong spelled.
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-07-05-02.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>4.213227700645635</longitude>
+					<latitude>52.04260288332888</latitude>
+					<altitude>0</altitude>
+					<range>24.63686803544318</range>
+					<tilt>0</tilt>
+					<heading>1.387289180270979e-005</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>4.213209970684247,52.04268354765237,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Den Haag - Loosduinen</name>
+				<description><![CDATA[<p>Thanks to <b>A30</b></p>
+
+A sundial made of wooden blocks.
+The highest block in the middle is the style and casts its shadow each hour on one of the other blocks.
+
+<p><img src="http://www.dse.nl/~zonnewijzer/loosduin.jpg"></p>
+Image source:<a href="http://www.dse.nl/~zonnewijzer/loosduin.jpg">www.dse.nl</a>]]></description>
+				<LookAt>
+					<longitude>4.236038669148795</longitude>
+					<latitude>52.0499434967447</latitude>
+					<altitude>0</altitude>
+					<range>18.37312193280116</range>
+					<tilt>2.202011190893535e-011</tilt>
+					<heading>-0.3988978466888938</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>4.236026636181407,52.049986562365,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial with light conductors - Paris, Les Halles</name>
+				<description><![CDATA[<p><img src="http://www.home.uni-osnabrueck.de/ahaenel/sonnuhr/paris1.jpg"></p>
+
+The sunlight falls on one of the three windows in the column (east, south, west) and over light conductors on the wall is indicated.
+
+<p><img src="http://www.home.uni-osnabrueck.de/ahaenel/sonnuhr/paris4.jpg"></p>
+
+The clock shows  16,40 o'clock.
+
+<p><img src="http://www.home.uni-osnabrueck.de/ahaenel/sonnuhr/paris5.jpg"></p>
+
+<a>Quelle:http://www.home.uni-osnabrueck.de/ahaenel/sonnuhr/paris_halles.htm</a>
+
+http://perso.orange.fr/cadrans.solaires/cadrans/cadran-halles-paris.html]]></description>
+				<LookAt>
+					<longitude>2.344185113917775</longitude>
+					<latitude>48.86294270160059</latitude>
+					<altitude>0</altitude>
+					<range>39.52787486507292</range>
+					<tilt>0</tilt>
+					<heading>-0.003533584730563007</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>2.344143312335305,48.86302323987447,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Plymouth, Devon, UK</name>
+				<description><![CDATA[<p>The gnonom is 27 foot high, the pool has 21 feet diameter.  It was designed by architect Carole Vincent from Boscastle in Cornwall and was unvieled by Her Majesty the Queen on Friday July 22nd 1988 for a cost of  cost Â£70,000 . The sundial runs one hour and seventeen minutes behind local clocks.</p>
+<p><img src="http://www.photoready.co.uk/people-life/images/sundial-fountain.jpg"></p>
+<p>Image source:<a href="www.photoready.co.uk</a></p>]]></description>
+				<LookAt>
+					<longitude>-4.142398271107962</longitude>
+					<latitude>50.37145390235462</latitude>
+					<altitude>0</altitude>
+					<range>63.33410419881957</range>
+					<tilt>0</tilt>
+					<heading>-0.0001034131369701296</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-4.142446411782089,50.37160252809223,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial Millennium Timespace at Gosport, UK</name>
+				<description><![CDATA[<p><img src="http://www.sundials.co.uk/pix/gosport.jpg"></p>
+Image source:<a href="http://www.sundials.co.uk/pix/gosport.jpg">www.sundials.co.uk</a>]]></description>
+				<LookAt>
+					<longitude>-1.117890647596098</longitude>
+					<latitude>50.79319978711329</latitude>
+					<altitude>0</altitude>
+					<range>79.08348690288113</range>
+					<tilt>0</tilt>
+					<heading>0.02100880488328328</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-1.117887915142518,50.79336425684474,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Britzer Garten, Berlin</name>
+				<description>See photos on this page:
+http://home.arcor.de/ruth.kirsch/sonnenuhr/berlin_1xxxx/berlin_1xxxx.htm</description>
+				<LookAt>
+					<longitude>13.42078373972489</longitude>
+					<latitude>52.4366841172644</latitude>
+					<altitude>0</altitude>
+					<range>102.2086892967038</range>
+					<tilt>0</tilt>
+					<heading>-0.004885703167479627</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>13.4207448482471,52.43682055829985,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Falkenplatz, Berlin</name>
+				<description><![CDATA[<p>The original reasoning event for the construction of the sundial was the UNO climate conference 1995 in Berlin. The base stone of the wall spiral was layed at a festivity at the equinox of March 1995. Until June 1995 the main construction was completed, and at another festivity at the summer solstice the gnonom and the totem ("Lebensbaum") was installed by Berlin fire fighters.</p>
+<p><img src="http://www.surveyor.in-berlin.de/sundials/imgs/Mauerpark-SD01.5.jpg"></p>
+<p>The nearly spiral sundial was planned as a "living sundial" and initiated by the groups of the "Netzwerk Klimagipfel 95", mainly by the journalist T. RÃ¶mer with the "Verein zur Rettung des Regenwaldes und Naturschutzgebietes La Macarena", and the "Netzwerk Spiel/Kultur" at the Prenzlauer Berg. 
+
+
+The covering clay stones were made out of three metric tons of white and brown clay, formed by children of about 50 institutions like school classes and kindergardens of the closer region. The stones were burned and installed in the summer of 1995. Partly they are constructed out of different materials, partly especially formed or ornamented. Six detail images are showing some examples: (White near Red - MC?, Smiley with Heart Eyes, Sun-Moon-Star, Red Broken and Patterned, Rain pits and Stone Hearts in Clay, Red near White - Clay Fish and Sunshine over the Sea). 
+
+In September 1995 the sundial was completed. It was called "living sundial" because it was planned to replace the clay stones regulary when they are destroyed and to add some green to the outside wall of the clock. In December 1995 the clock got a special price of the local environmental administration.</p>
+<p><img src="http://www.surveyor.in-berlin.de/sundials/imgs/Mauerpark-Detail02.jpg">.<img src="http://www.surveyor.in-berlin.de/sundials/imgs/Mauerpark-Detail06.jpg"></p>
+
+
+<p>In September 1995 the sundial was completed. It was called "living sundial" because it was planned to replace the clay stones regulary when they are destroyed and to add some green to the outside wall of the clock. In December 1995 the clock got a special price of the local environmental administration.</p>
+<p><img src="http://www.surveyor.in-berlin.de/sundials/imgs/Mauerpark-SD02.5.jpg"></p>
+
+<p>This sundial was deconstructed at the end of 2002 or at the beginning of 2003:</p>
+<p><img src="http://www.surveyor.in-berlin.de/sundials/imgs/Mauerpark-SD03.5.jpg"></p>
+
+<p>Image source and infos:<a href="http://www.surveyor.in-berlin.de/sundials/Falkplatz-e.html">www.surveyor.in-berlin.de</a></p>]]></description>
+				<LookAt>
+					<longitude>13.40239121468946</longitude>
+					<latitude>52.54640622802566</latitude>
+					<altitude>0</altitude>
+					<range>55.75497205265645</range>
+					<tilt>1.489511345854323e-009</tilt>
+					<heading>2.6367660621925e-005</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>13.40233774797299,52.54645010247089,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Halde Schwerin, Castrop-Rauxel, Germany</name>
+				<description><![CDATA[<p>Thanks to <b>htd42</b></p>
+<p><img src="http://www.ruhrgebiet.de/cgi-bin/imp?freizeit/sehenswuerdigkeiten/bindata/castrop-rauxel_halde_schwerin_RVR.jpg&articleID=5824&padding=no&thumbnailtype=jpg&width=250"></p>
+
+http://www.ruhrgebiet.de/freizeit/sehenswuerdigkeiten/cr_halde_schwerin.shtml?print]]></description>
+				<LookAt>
+					<longitude>7.337404407947669</longitude>
+					<latitude>51.54597716006042</latitude>
+					<altitude>0</altitude>
+					<range>51.28632275218226</range>
+					<tilt>2.512805793870883e-009</tilt>
+					<heading>-6.529566789930303e-005</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>7.337359256982781,51.54610609965799,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Lloydminster, Canada</name>
+				<description><![CDATA[This sundial has not the longest gnomon but I think it has the biggest clock face in the world.
+
+<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/Canada/Lloydminster/BMASP.jpg"></p>
+<p>Image source and infos:<a href="http://www.mts.net/~sabanski/sundial/sotw_canada_lloydminster.htm">www.mts.net</a></p>]]></description>
+				<LookAt>
+					<longitude>-110.0353754682919</longitude>
+					<latitude>53.26386357821667</latitude>
+					<altitude>0</altitude>
+					<range>155.9861269181855</range>
+					<tilt>0</tilt>
+					<heading>-0.01432903343453666</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-110.0355256583979,53.26413794825379,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Giant Lady&apos;s Leg Sundial, Roselawn, Indiana, USA</name>
+				<description><![CDATA[<p>The Sun Aura Nudist Resort opened in 1933. Back then it was called Club Zoro and its founder was Alois Knapp, a Chicago lawyer, German Nacktkulturist, editor of Sunshine and Health magazine, and "the father of nudism in America." </p>
+
+<p><img src="http://www.roadsideamerica.com/attract/images/in/INLAKsundialleg4_0716.jpg"></p>
+
+<p>The club eventually passed into the hands of Dale and Mary Drost. Their son, Dick, had big ideas: he renamed the place Naked City, made it the home of the Ms. Nude Teeny Bopper Contest and the "Erin Go Bra-less" Dance on St. Patrick's Day, and had built the giant lady's leg sundial, 63 feet long and properly positioned to tell time -- a useful feature for wristwatchless nudists. </p>
+
+<p>Naked City closed in 1986 when Dick was run out of Indiana on child molestation charges, but the leg remains and so does the resort, now under new management. The circular main building with the mirror gold windows is a combination office-sauna-restaurant. </p>
+
+<p>The guy who paints the leg told us that Sun Aura is a "clothing optional" camp -- in other words, you don't have to get nude to take a picture of the big lady's leg. But for those who do choose to get into the spirit of things, a helpful sign on the exit road reads, "Stop. You Must Be Dressed Beyond This Point."</p>
+
+<p><a href="http://www.roadsideamerica.com/sights/sightstory.php?tip_AttrId=%3D11825">Roadside America</a></p>]]></description>
+				<LookAt>
+					<longitude>-87.32599841452155</longitude>
+					<latitude>41.14248697221019</latitude>
+					<altitude>0</altitude>
+					<range>40.06529731982877</range>
+					<tilt>0</tilt>
+					<heading>-108.7495178792767</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-87.32608203713804,41.14242622349031,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Ingleside, San Francisco, USA</name>
+				<description><![CDATA[<p>Thanks to <b>CostaPacific</b></p>
+
+Most people in San Francsco have no idea that their city is host to the world's second largest sundial. It was built in 1913 as a gimic to attract people to a new housing development that was built arround the configuration of the old Ingleside Race Track.
+
+<p><img src="http://p.vtourist.com/2174717-Architecture-San_Francisco.jpg"></p>
+<p>Image source:<a href="www.virtualtourist.com"></a>]]></description>
+				<LookAt>
+					<longitude>-122.4687521474299</longitude>
+					<latitude>37.72475779376939</latitude>
+					<altitude>0</altitude>
+					<range>104.1096478961583</range>
+					<tilt>0</tilt>
+					<heading>-6.694029629862418e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-122.4687727980979,37.72497790751523,59.97947112427937</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial Bridge</name>
+				<description>Located in Redding, CA.  Opened in 2004 this bridge actually acts as a sundial.  The time can be read in a garden on the North side of the bridge.
+
+http://www.turtlebay.org/sundial/sundial.shtml</description>
+				<LookAt>
+					<longitude>-122.3775376532067</longitude>
+					<latitude>40.59329504591046</latitude>
+					<altitude>0</altitude>
+					<range>160.1654912126178</range>
+					<tilt>7.884938307004504e-010</tilt>
+					<heading>0.008470312235033726</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-122.3777030796087,40.59376952663914,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Jaipur,India</name>
+				<description><![CDATA[Thanks to <b>Villaman</b>
+
+<p align="center"><table width=400><tr><td><b><br>Jaipur Observatory Sundial</b><br><br>
+</td>
+</tr>
+<tr>
+<td>
+<p align="justify"> Walk through these doors and up the stairs to begin your journey along a line from Jaipur, India toward the North Celestial Pole. Such cosmic alignments abound in marvelous Indian observatories where the architecture itself allows astronomical measurements. The structures were built in Jaipur and other cities in the eighteenth century by the Maharaja Jai Singh II (1686-1743). Rising about 90 feet high, this stairway actually forms a shadow caster or gnomon, part of what is still perhaps the largest sundial on planet Earth. Testaments to Jai Singh II's passion for astronomy, the design and large scale of his observatories' structures still provide impressively accurate measurements of shadows and sightings of celestial angles. 
+<p align="justify"><center><b>Jaipur Observatory Sundial<br><img src="http://apod.nasa.gov/apod/image/0312/02mantar_feresten.jpg" width=300></b></center></p>
+<p align="justify">More <a href="http://apod.nasa.gov/apod/ap031206.html">here.</a>
+
+</td>
+</tr>
+</table>
+<font color="white">]]></description>
+				<LookAt>
+					<longitude>75.82482649881683</longitude>
+					<latitude>26.924766672173</latitude>
+					<altitude>0</altitude>
+					<range>164.397137416247</range>
+					<tilt>0</tilt>
+					<heading>-0.02454798212483729</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>75.82474437483685,26.92504292845888,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Schothorstpark, Amersfoort, Netherlands</name>
+				<description><![CDATA[<p>A large sundial in the Schothorstpark in Amersfoort.
+Thanks to <b>Acadvice</b>]]></description>
+				<LookAt>
+					<longitude>5.385083481782106</longitude>
+					<latitude>52.17868238866643</latitude>
+					<altitude>0</altitude>
+					<range>49.70911801163624</range>
+					<tilt>5.249316070079438e-010</tilt>
+					<heading>6.699999294207586e-006</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>5.385063337537176,52.17873082332495,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Jardin de Reuilly, Paris</name>
+				<description><![CDATA[A huge horizontal sundial in Paris.
+<p><img src="http://perso.orange.fr/cadrans.solaires/cadrans/images/reuilly1-500.jpg" width="400"  hight="250"></p>
+
+<p><img src="http://perso.orange.fr/cadrans.solaires/cadrans/images/reuilly2-500.jpg" width="360"  hight="250"></p>
+Image source:<a href="http://perso.orange.fr/cadrans.solaires/cadrans/originaux-paris.html">http://perso.orange.fr</a></p>]]></description>
+				<LookAt>
+					<longitude>2.387204592843604</longitude>
+					<latitude>48.84242901629369</latitude>
+					<altitude>0</altitude>
+					<range>50.11592463998582</range>
+					<tilt>8.113900329668256e-010</tilt>
+					<heading>-0.001210217218456717</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>2.38716774037826,48.84252766103683,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Stockgrove, Soulbury, Buckinghamshire, UK</name>
+				<description><![CDATA[<p>thanks to <b>houdinia</b></p>
+Sundial with analemmatic clock face.
+<p><img src="http://www.greensandtrust.org/images/newImages/stockStrip1.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-0.666503881371199</longitude>
+					<latitude>51.95548351688392</latitude>
+					<altitude>0</altitude>
+					<range>55.27920580004575</range>
+					<tilt>6.264058771241075e-010</tilt>
+					<heading>0.06911766261471311</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-0.6665014664411046,51.95551857959676,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Halde Hoheward, Germany</name>
+				<description><![CDATA[<p>The Obelisk â The Sundial</p>
+
+<p>The seeming movement of the sun in the sky, resulting in the discrimination between day and night, was one of the earliest observations of nature performed by men. It enables us to experience the phenomenon âtimeâ with our own senses. The first examples for telling the time with the help of the sun or its shadow date back to the Ancient World. The are numerous archetypes for sundials built inmany different styles, using different techniques.</p>
+
+<p>The archetype for the horizontal sundial on top of the slagheap Hoheward is the sundial of the Roman Emperor Augustus on the Campus Martius in Rome.</p>
+(It is unknown, whether this ancient obelisk was part of a complete sun dial with hour and declination lines on the morning and afternoon side or whether only a meridian line existed to measure the elevation of the sun in upper culmination. The today's scientific knowledge indicates the existence of a meridian.) The observation of the Obelisk's shadow on the sundial enables the observer to easily determine date and time. Apart from âtimeâ one can also experience the laws of celestial mechanics. Men encounter themselves in relation to the cosmos.</p>
+
+<p>Representing the first step in the realisation of the Astronomical Theme Park the Obelisk was opened on May 17th, 2005. It is located on the already completed south-eastern plateau of the slagheap at a height of 140 m above sea level. The shadowed area is 62 m in diameter.</p>
+
+
+
+<p><img src="http://www.horizontastronomie.de/bilder/ansicht-obelisk2.jpg"></p>
+This picture shows the Obelisk after the end of the assembly on the day of the opening. Shortly before it was put on top of the readily prepared pedestal by a helicopter and then bolted. 
+
+<p><img src="http://www.horizontastronomie.de/bilder/o2.jpg" width="300" hight="360"></p>
+
+<p><a href="http://www.horizontastronomie.de/eindex.htm">http://www.horizontastronomie.de</a></p>
+
+
+
+<p>http://de.wikipedia.org/wiki/Halde_Hoheward#Sonnenuhr_mit_Obelisk</p>
+
+<p>http://www.horizontastronomie.de/animationen.htm</p>]]></description>
+				<LookAt>
+					<longitude>7.170033145228383</longitude>
+					<latitude>51.56646738931531</latitude>
+					<altitude>0</altitude>
+					<range>96.7791497847863</range>
+					<tilt>4.155528307086707e-010</tilt>
+					<heading>0.006376147752644328</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>7.169892708740022,51.56683509795316,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Fachhochschule (FH) Bielefeld</name>
+				<description><![CDATA[A sundial with analemmatic layout. 
+<p><img src="http://www.fh-bielefeld.de/ezimagecatalogue/catalogue/variations/4651-400x500.jpg"></p>
+http://www.fh-bielefeld.de/article/fh/4412/1/505?NavItemID=0&NavCatID=162]]></description>
+				<LookAt>
+					<longitude>8.555263115842216</longitude>
+					<latitude>52.02672953436973</latitude>
+					<altitude>0</altitude>
+					<range>50.10364671714684</range>
+					<tilt>0</tilt>
+					<heading>0.001255164290936946</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>8.555215193531964,52.02681111856448,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Sun City, Arizona</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/008_az_suncity.jpg"></p>
+
+<p><img src="http://www.sundials.org/registry/regphotos/008_az_suncity_2.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-112.2739996808105</longitude>
+					<latitude>33.61902729376313</latitude>
+					<altitude>0</altitude>
+					<range>44.66059102278575</range>
+					<tilt>0</tilt>
+					<heading>0.0001994953180518285</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-112.2740228273864,33.61913038777643,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Georgina Blach Intermediate School, Los Altos, CA</name>
+				<description><![CDATA[A corner of a roof used as sundial.
+<p><img src="http://www.sundials.org/registry/regphotos/498_ca_losaltos_blach.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-122.083063541274</longitude>
+					<latitude>37.36394994353518</latitude>
+					<altitude>0</altitude>
+					<range>99.46493929648614</range>
+					<tilt>0</tilt>
+					<heading>-6.524992683547596e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-122.0831077334675,37.3641379192763,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Hilltop Park, San Francisco</name>
+				<description><![CDATA[A giant sundial 70 feet in diameter with a bright yellow painted steel gnomon 78 feet long. The dial has a cement base and was designed to be used as the stage for a surrounding amphitheater.
+<p><img src="http://www.sundials.org/registry/regphotos/419_ca_sanf_hunters_ridge.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-122.3837414260284</longitude>
+					<latitude>37.73308769461563</latitude>
+					<altitude>0</altitude>
+					<range>76.96447255875415</range>
+					<tilt>0</tilt>
+					<heading>-0.0001251047167258125</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-122.3837885185873,37.73313852750733,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Berlin-WeiÃensee</name>
+				<description><![CDATA[A nice sundial made of flowers.
+<p><img src="http://www.be.schule.de/schulen/wfs/pages/sundials/Blumenuhr,Weissensee.gif"></p>
+
+http://www.be.schule.de/schulen/wfs/pages/sundials/Weissensee.html]]></description>
+				<LookAt>
+					<longitude>13.46637059089964</longitude>
+					<latitude>52.55408525446345</latitude>
+					<altitude>0</altitude>
+					<range>35.24186259647233</range>
+					<tilt>0</tilt>
+					<heading>-0.002133411261797274</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>13.46637589519183,52.55412143657096,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Olbers-Planetarium, Bremen</name>
+				<description><![CDATA[This is an armillary sphere sundial. 
+
+<p><img src="http://planetarium.hs-bremen.de/bremen/pics/suhs.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>8.806980778676786</longitude>
+					<latitude>53.06988134466393</latitude>
+					<altitude>0</altitude>
+					<range>24.09705977000565</range>
+					<tilt>0</tilt>
+					<heading>-0.001876272046377585</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>8.806963468445417,53.0698959991562,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Westbroekpark, Denn Haag</name>
+				<description><![CDATA[This sundial is located at the Rosarium in the Westbroekpark, Denn Haag.
+<p><img src="http://www.denhaag.nl/Pics/dsb/Ststr/westbroekpark/rozenconcours45/rozenbedden-met-zonnewijzer.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>4.290891177932192</longitude>
+					<latitude>52.10450647693549</latitude>
+					<altitude>0</altitude>
+					<range>20.57779559985518</range>
+					<tilt>0</tilt>
+					<heading>-0.8669355345663358</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>4.290865552422943,52.10453275113748,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Amersfoort, Netherlands</name>
+				<description><![CDATA[In the arrow are 2 digital displays, one for civil time and one for local suntime.
+<p><img src="http://sundials.org/links/local/sunpointer/sunpointer.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>5.374167244217593</longitude>
+					<latitude>52.15310253836927</latitude>
+					<altitude>0</altitude>
+					<range>31.45592479376158</range>
+					<tilt>1.426589610824431e-009</tilt>
+					<heading>-0.01164696084898205</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>5.374145665653813,52.15310809583514,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Botanical Gardens, Sydney, Australia</name>
+				<description><![CDATA[This is an armillary sphere sundial.
+
+<p><img src="http://www.sundials.co.uk/PC090189.jpg"></p>
+
+<p><img src="http://www.sundials.co.uk/PC090193.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>151.2154952669206</longitude>
+					<latitude>-33.86399908828604</latitude>
+					<altitude>0</altitude>
+					<range>16.43666728184123</range>
+					<tilt>8.675342058213797e-007</tilt>
+					<heading>-0.002067228419448193</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>151.2154882763944,-33.86398565287625,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Team Disney Sundial, Walt Disney World, Florida</name>
+				<description><![CDATA[Thanks to <b>Oftencold</b>
+
+<p><img src="http://www.sunpath-designs.com/disdial2b.gif"></p>
+
+http://www.de-zonnewijzerkring.nl/zw-arch/eng-home-zw-07-02.htm]]></description>
+				<LookAt>
+					<longitude>-81.52113085122878</longitude>
+					<latitude>28.36541360352638</latitude>
+					<altitude>0</altitude>
+					<range>167.7307771712135</range>
+					<tilt>1.015026730473625e-011</tilt>
+					<heading>-0.006287852151169638</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-81.52134276012195,28.36559634883421,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Janskerkhof, Utrecht,  Netherlands</name>
+				<description><![CDATA[A sundial with analemmatic layout.
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-06-06-01.jpg"></p>
+
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-06-06-02.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>5.121095723583527</longitude>
+					<latitude>52.09338586502101</latitude>
+					<altitude>0</altitude>
+					<range>24.25734051739648</range>
+					<tilt>5.490226183683639e-010</tilt>
+					<heading>-0.0007122606404517594</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>5.121088800707085,52.09341776135472,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, San Jose Rep Theater, San Jose, CA</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/f96acd0f-6ad7-4b0a-a4a0-e52d14dd0015.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM247Q">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-121.8860266085782</longitude>
+					<latitude>37.33361545835343</latitude>
+					<altitude>0</altitude>
+					<range>32.31958319185324</range>
+					<tilt>0</tilt>
+					<heading>1.418565866412994e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-121.886064353331,37.33364018615777,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Millennium Sundial, Greenwich Park, London</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/7cdcd20c-806c-4cbd-8a9c-5de27ffb115d.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM273J">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-0.001522539653513039</longitude>
+					<latitude>51.48136176862654</latitude>
+					<altitude>0</altitude>
+					<range>61.96314954770909</range>
+					<tilt>2.850197260451716e-009</tilt>
+					<heading>-0.002911073287638733</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-0.00156808979284051,51.48142700407306,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Veterans Park, Waukesha, WI</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/0e6202ea-2b62-4491-9029-0983445e7cde.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM2DTR">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-88.2367572684424</longitude>
+					<latitude>43.00995357504599</latitude>
+					<altitude>0</altitude>
+					<range>49.0879478099675</range>
+					<tilt>0</tilt>
+					<heading>-2.769547716555237e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-88.23678272979073,43.01004377682637,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Underground Sundial, Munich, Germany</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/6f0381f1-4c18-4d9d-95e5-2f9a79842dbe.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM12X2">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>11.70480163926041</longitude>
+					<latitude>48.13338615699044</latitude>
+					<altitude>0</altitude>
+					<range>49.09160069235252</range>
+					<tilt>7.359413992305611e-011</tilt>
+					<heading>1.363313751616389e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>11.70474103166116,48.13350333174798,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Crown Hill cemetery, Indianapolis, Indiana, USA</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/d62d27fc-f175-4ac8-aab3-7ba9748d6b82.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1310">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-86.17300915391851</longitude>
+					<latitude>39.82668935299838</latitude>
+					<altitude>0</altitude>
+					<range>35.63730089613371</range>
+					<tilt>0</tilt>
+					<heading>2.616180723282867e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-86.17304253331795,39.82668119645058,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Coppell, TX</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/2bb0da85-d5db-44ed-ae70-d89f290ad7fd.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1WJG">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-97.02194975520763</longitude>
+					<latitude>32.95633568822581</latitude>
+					<altitude>0</altitude>
+					<range>61.19896168864369</range>
+					<tilt>0</tilt>
+					<heading>1.826645706530163e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-97.02199840401494,32.95643533824669,0</coordinates>
+				</Point>
+			</Placemark>
+		</Folder>
+		<Folder>
+			<name>Low Resolution</name>
+			<Placemark>
+				<name>Sundial, Kota Baru Parahyangan</name>
+				<description><![CDATA[Thanks to <b>voorburger</b>.
+<p><img src="http://www.thebiggestsundial.com/php/thebiggestsundial/images/Exhibits/13/03052007134130.gif"></p>]]></description>
+				<LookAt>
+					<longitude>107.4940550739811</longitude>
+					<latitude>-6.852038750176605</latitude>
+					<altitude>0</altitude>
+					<range>296.7282563680993</range>
+					<tilt>2.08633946131246e-011</tilt>
+					<heading>0.5509822616366601</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>107.4939718861608,-6.851748821808833,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Pajala, Sweden</name>
+				<description><![CDATA[<p>The world's biggest sundial today is in the Torne Valley, north of the Arctic Circle. The Guinness Book of Records has put Pajala, northern Sweden, on the map, and its sundial - formed as a "round square". </p>
+<p><img src="http://www.pajala.se/mun/pajala/www.nsf/($all)/A43859111165E6F2C1256EE40021DDF3/$file/soltorg23.JPG"></p>
+<p>The sundial in Pajala, 38.33 m. in diameter, holds the world record, according to the Guinness Book of Records. The previous record was held by Disney World in Orlando, Florida, with 37.18 m. </p>
+
+<p>The sundial was inaugurated by the Swedish Minister of Labour Margareta Winberg in July 1996. Pajala is situated at 23.28 Â° East, 67.21 Â° North, which is 70 km north of the Arctic Circle, making a circular sundial possible. This is due to the fact that the Midnight Sun describes a complete circle over the horizon. 
+
+<p>Its masts of dried fir form a unique spatiality around a circular "square". The site is especially used for local functions such as Pajala Fair, Romp Week and the Northern Lights Festival. </p>
+
+<p>The central square in Pajala, through its size and latitude, offered conditions for a sundial dedicated to the Midnight Sun. Architect Mats Winsa took his inspiration from the square in Siena, and for the sculptures in the park - astronomical instruments in India dating back to the 18th century. Naturally, it was a challenge to compete with the previous record from 1991 by the world-famous Japanese architect, Arata Isozaki. </p>
+
+<p>The sundial captures the sun's movement by allowing the shadow of the central gnomon to fall across the hour divisions of the surrounding posts. The gnomon, like the Earth's axis, points toward the Pole Star, which according to Finnish-Ugrian mythology (the region has Finnish roots) holds up the firmament. The "sun wheel" embedded in the ground here (forming a cross in the circle) is in fact a calendar. Water bubbles up from four sources corresponding to the four principal points of the compass. The water gathers in the central pond, which was designed with children in mind. </p>
+
+<p>For their survival, humans have followed the rhythm of the sun. The need to observe the changing seasons and days led to the early development of the sundial. Our lives today are characterised by obedience to mechanical and national time - inventions separate from true solar time. The sundial displays true solar time, which in Pajala is half-an-hour ahead of national time. </p>
+
+<p>The sundial in Pajala celebrates light, and acts as a reminder of its significance for all life by functioning as a biological clock in a world fettered by artificial time. The hormone rush in spring reminds us of our direct dependence on sunlight as living beings.</p>
+
+<p>Info and image source:<a href="http://www.pajala.se/mun/pajala/www.nsf/english/$first?open&mname=Menu%C2%A4menuID=2CAE%C2%A4start=1">www.pajala.se</a></p>
+
+<p><img src="http://holmers.com/Pajala/Pajala1_050709.jpg"></p>
+<p>Image source:<a href="http://holmers.com/Pajala/Pajala1_050709.jpg">http://holmers.com</a></p>]]></description>
+				<LookAt>
+					<longitude>23.36723004664742</longitude>
+					<latitude>67.21282676944374</latitude>
+					<altitude>0</altitude>
+					<range>124.9604027877409</range>
+					<tilt>3.010594647959025e-010</tilt>
+					<heading>-1.130925335798896</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>23.36716252896882,67.21299216873888,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Tenerife, Spain</name>
+				<description><![CDATA[Reloj del sol
+
+<p><img src="http://members.aon.at/mbrandn6/media/fotos/landart/watchteneriffa/tentotal1.jpg"></p>
+
+<p><img src="http://members.aon.at/mbrandn6/media/fotos/landart/watchteneriffa/tennah.jpg"></p>
+
+<p><img src="http://members.aon.at/mbrandn6/media/fotos/landart/watchteneriffa/tentotal3.jpg"></p>
+
+<p><img src="http://members.aon.at/mbrandn6/media/fotos/landart/watchteneriffa/draft.jpg"></p>
+<p>Image source:<a href="http://members.aon.at/mbrandn6/pagesgerman/framesetg/framelandart.html">http://members.aon.at</a></p>
+
+<p><a href="http://www.teneriffa.panoshot.de/de/panorama-interaktiv/gernot-huber-stiftung-reloj-del-sol-223.html
+">Interactice picture</a></p>]]></description>
+				<LookAt>
+					<longitude>-16.56926659562192</longitude>
+					<latitude>28.08256590461729</latitude>
+					<altitude>0</altitude>
+					<range>88.29371157400612</range>
+					<tilt>0</tilt>
+					<heading>8.633540737161729e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-16.5693071701084,28.08261960124695,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Perranporth, UK</name>
+				<description><![CDATA[The Millennium Sundial was designed by Stuart Thorn. It tells Cornish time which is 20 minutes ahead of GMT.
+<p><img src="http://www.cornwalls.co.uk/photos/data/media/2/perranporth_sundial.jpg" width="421" hight="280"></p>]]></description>
+				<LookAt>
+					<longitude>-5.157517535037663</longitude>
+					<latitude>50.34723421976403</latitude>
+					<altitude>0</altitude>
+					<range>65.69642310338585</range>
+					<tilt>0</tilt>
+					<heading>-0.01795551609583625</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-5.157537433789316,50.34733238709538,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Council Bluffs, Iowa, USA</name>
+				<description><![CDATA[Large sundial at Council Bluffs Public Library
+
+<p><img src="http://www.sunpath-designs.com/librarydial1b.jpg" width="400" hight="300"></p>
+<p><img src="http://www.sunpath-designs.com/librarydial2b.jpg" width="400" hight="300"></p>
+<p><img src="http://www.sunpath-designs.com/librarydial3b.jpg" width="400" hight="300"></p>]]></description>
+				<LookAt>
+					<longitude>-95.84953495410247</longitude>
+					<latitude>41.25887711431908</latitude>
+					<altitude>0</altitude>
+					<range>196.5752069699831</range>
+					<tilt>2.583166383376495e-010</tilt>
+					<heading>0.0002124063872384501</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-95.84981881431206,41.25888611306795,294.4878429401121</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial. Meckhofen, Leverkusen, Germany</name>
+				<description><![CDATA[<p><img src="http://www.leverkusen.de/stadtportrait/partnerstaedte/400pxPartnerstaedteSonnenuhr01.jpg"></p>
+<p>Image source:<a href="v">www.leverkusen.de</a></p>
+
+<p><img src="http://www.lev2000.de/guide/Archiv1.jpg/39/Sonnenuhr01.jpg"></p>
+
+<p><img src="http://www.lev2000.de/guide/Archiv1.jpg/39/Sonnenuhr02.jpg"></p>
+<p>Image source:<a href="http://www.lev2000.de/guide/Archiv1.jpg/39/Sonnenuhr02.jpg">www.lev2000.de</a></p>]]></description>
+				<LookAt>
+					<longitude>7.083354426150351</longitude>
+					<latitude>51.04845387008112</latitude>
+					<altitude>0</altitude>
+					<range>66.17616066250443</range>
+					<tilt>9.735256695418331e-010</tilt>
+					<heading>0.0006924896867520876</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>7.083321386023442,51.04852440832129,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial,  Adler Planetarium, Chicago, USA</name>
+				<description><![CDATA[<p><img src="http://www.wherry.com/photos/2001-04-29-chicago/DSCN1221-m.jpg" width="500" hight="375"></p>]]></description>
+				<LookAt>
+					<longitude>-87.60711153340705</longitude>
+					<latitude>41.86674796371171</latitude>
+					<altitude>0</altitude>
+					<range>27.37440941953917</range>
+					<tilt>0</tilt>
+					<heading>0.008419825260544345</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-87.60710764637246,41.86681374132155,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Rose Garden Sundial, Christchurch, New Zealand</name>
+				<description><![CDATA[<p>Thanks to <b>NormB</b></p>
+<a href="http://www.ccc.govt.nz/Parks/BotanicGardens/tour_gardens_central_rose_garden.asp">Rose Garden History</a>
+
+<p>
+<b>Photo - NormB 11th April 2006<br>
+<img src="http://img527.imageshack.us/img527/509/sundialig8.jpg" alt="Image Hosted by ImageShack.us" /><p>
+<b>Photo - NormB 11th April 2006<br>
+<img src="http://img527.imageshack.us/img527/786/sundialplaquefn9.jpg" alt="Image Hosted by ImageShack.us" />]]></description>
+				<LookAt>
+					<longitude>172.621331272394</longitude>
+					<latitude>-43.53038034442864</latitude>
+					<altitude>0</altitude>
+					<range>86.04933199573917</range>
+					<tilt>0</tilt>
+					<heading>1.801092527765711</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>172.6213650004974,-43.53035465311722,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Natchez Park</name>
+				<description><![CDATA[<p>Thanks to <b>caroling</b></p>
+
+In Seaside, NW FL, USA on the Emerald Coast. Panoramic images and movies of a sundial and visions of Xtals (energy crystals) on the March equinox, 2006. See http://www.wholeo.net/Trips/Art/Web/TripsArt/Travel/Florida/borders/flBorders.htm]]></description>
+				<LookAt>
+					<longitude>-86.14177717779702</longitude>
+					<latitude>30.32184243688109</latitude>
+					<altitude>0</altitude>
+					<range>46.50596341362312</range>
+					<tilt>9.523139707563741e-010</tilt>
+					<heading>0.0925379903960088</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<altitudeMode>relativeToGround</altitudeMode>
+					<coordinates>-86.14183223138707,30.32193188899003,3</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Charlotte, North Carolina, USA</name>
+				<description><![CDATA[<p>Thanks to <b>BrettHo</b></p>
+On the roof of the International Trade Center is this gigantic sundial.]]></description>
+				<LookAt>
+					<longitude>-80.84002590296151</longitude>
+					<latitude>35.22682691631484</latitude>
+					<altitude>0</altitude>
+					<range>73.21919569418378</range>
+					<tilt>0</tilt>
+					<heading>12.34188537748346</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-80.84002447413604,35.22696160522812,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>KTPalmerSundial, Carefree, Arizona, USA</name>
+				<description><![CDATA[Thanks to <b>seer</b>.
+<p><img src="http://www.sundials.org/registry/regphotos/001_az_carefree_2.jpg"></p>
+http://www.bigwaste.com/photos/az/sundial/]]></description>
+				<LookAt>
+					<longitude>-111.9217799027029</longitude>
+					<latitude>33.8245907883639</latitude>
+					<altitude>0</altitude>
+					<range>119.8165563905356</range>
+					<tilt>2.774426682549449e-010</tilt>
+					<heading>-1.574999619300427e-005</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-111.9218327194278,33.82468559440962,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, University of Science and Technology, Hong Kong</name>
+				<description><![CDATA[<p><img src="http://perso.orange.fr/cadrans.solaires/cadrans/images/Maes-hongkong.jpg" width="295" height="370"></p>
+
+<p>Image source:<a href="http://perso.orange.fr/cadrans.solaires/cadrans/originaux-monde.html">http://perso.orange.fr</a></p>]]></description>
+				<LookAt>
+					<longitude>114.2630116779084</longitude>
+					<latitude>22.33749401387006</latitude>
+					<altitude>0</altitude>
+					<range>111.6162130745504</range>
+					<tilt>0</tilt>
+					<heading>0.0003913059632004609</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>114.2629690669868,22.33764072332584,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial,  Pekin, Illinois</name>
+				<description><![CDATA[<p><img src="http://www.pekin.net/sundial/sundial.jpg"></p>
+<p>Image source:<a href="http://www.pekin.net/sundial/index.html">www.pekin.net</a></p>
+
+<p><img src="http://www.sundials.org/registry/regphotos/233_il_perkin_parkdial.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-89.63076522889526</longitude>
+					<latitude>40.56267466732153</latitude>
+					<altitude>0</altitude>
+					<range>161.1716772997438</range>
+					<tilt>0</tilt>
+					<heading>0.009112399365723663</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-89.63089561079578,40.56281064339486,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Edinburg, Hidalgo, USA</name>
+				<description><![CDATA[<p><img src="http://www.sunpath-designs.com/utdial2b.GIF" width="300" hight="400"></p>
+
+<p><img src="http://www.sunpath-designs.com/utdial1b.gif"width="400" hight="300"><7p>]]></description>
+				<LookAt>
+					<longitude>-98.17095602857175</longitude>
+					<latitude>26.30618568257091</latitude>
+					<altitude>0</altitude>
+					<range>122.1950947751469</range>
+					<tilt>0</tilt>
+					<heading>-0.005400653570135644</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-98.17104492887813,26.30639237212602,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Keppel Henge,</name>
+				<description><![CDATA[<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/Canada/Keppel%20Henge/sundial1.jpg"></p>
+<p>http://www.steveirvine.com/sundial.html</p>
+
+
+http://www.mts.net/~sabanski/sundial/sotw_canada_keppel.htm]]></description>
+				<LookAt>
+					<longitude>-80.94374423682251</longitude>
+					<latitude>44.79038599160477</latitude>
+					<altitude>0</altitude>
+					<range>164.0454159373261</range>
+					<tilt>0</tilt>
+					<heading>-0.007334046679263517</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-80.94383190841853,44.79038705635566,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial at Science North, Sudbury, Ontario</name>
+				<description><![CDATA[<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/Canada/Science%20North/celeste1.jpg"></p>
+
+<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/Canada/Science%20North/celeste2.jpg"></p>
+
+<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/Canada/Science%20North/celeste3.jpg"></p>
+
+http://www.mts.net/~sabanski/sundial/sotw_canada_sn.htm]]></description>
+				<LookAt>
+					<longitude>-80.99582033913947</longitude>
+					<latitude>46.46976830028441</latitude>
+					<altitude>0</altitude>
+					<range>85.82915438648354</range>
+					<tilt>0</tilt>
+					<heading>0.0003317215281456315</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-80.99588716181201,46.46988111501548,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Amble, UK</name>
+				<description><![CDATA[<p><img src="http://ourworld.compuserve.com/homepages/Patrick_Powers/Amble.jpg"></p>
+http://ourworld.compuserve.com/homepages/Patrick_Powers/amble.htm]]></description>
+				<LookAt>
+					<longitude>-1.581634687429885</longitude>
+					<latitude>55.33514811404725</latitude>
+					<altitude>0</altitude>
+					<range>62.55005662709024</range>
+					<tilt>8.224100904372228e-010</tilt>
+					<heading>-0.008198736253532122</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-1.581720999552488,55.3352025087941,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, University of Maryland, College Park</name>
+				<description><![CDATA[<p><img src="http://www.mts.net/~sabanski/sundial/images/sundials%20of%20the%20world/USA/Maryland/Univ%20of%20Maryland%20.jpg"></p>
+http://www.mts.net/~sabanski/sundial/sotw_usa_mland.htm]]></description>
+				<LookAt>
+					<longitude>-76.94256839624576</longitude>
+					<latitude>38.98603731470438</latitude>
+					<altitude>0</altitude>
+					<range>69.47353847793947</range>
+					<tilt>0</tilt>
+					<heading>-0.00947513273561203</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-76.94253686137193,38.98616316295006,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Fort San Felipe del Morro, Puerto Rico</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/564_cuba_habana_1.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-66.11899284422442</longitude>
+					<latitude>18.46786530709565</latitude>
+					<altitude>0</altitude>
+					<range>122.9114928009769</range>
+					<tilt>0</tilt>
+					<heading>0.001639161983653822</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-66.11900470518663,18.4679529172629,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Rose Garden, Phoenix</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/007_az_phoenix.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-112.0911976535298</longitude>
+					<latitude>33.47007786030556</latitude>
+					<altitude>0</altitude>
+					<range>26.72933602203598</range>
+					<tilt>4.053298886062559e-011</tilt>
+					<heading>0.0001093808645832187</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-112.0912131593616,33.4701136927338,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Tucson, Arizona</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/012_az_tucson_la_pilita.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-110.9748374101104</longitude>
+					<latitude>32.21591986778585</latitude>
+					<altitude>0</altitude>
+					<range>42.12321141209996</range>
+					<tilt>0</tilt>
+					<heading>-0.0002919115031976927</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-110.9748562940359,32.21593667064053,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Flandrau Planetarium, Tucson</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/013_az_tuscon_flandrau_planetarium.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-110.9477979774635</longitude>
+					<latitude>32.23224398378896</latitude>
+					<altitude>0</altitude>
+					<range>33.29181342845133</range>
+					<tilt>3.6608792363658e-017</tilt>
+					<heading>0.0001605580448802178</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-110.9478231994691,32.23228861367718,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Vietnam Veterans Memorial, Kentucky</name>
+				<description><![CDATA[<p><img src="http://www.vietvet.org/images/vn/billm/rags9.gif"></p>
+
+http://www.vietvet.org/kymem.htm]]></description>
+				<LookAt>
+					<longitude>-84.8640348419774</longitude>
+					<latitude>38.17725413584271</latitude>
+					<altitude>0</altitude>
+					<range>136.9757698325458</range>
+					<tilt>1.322889725758878e-010</tilt>
+					<heading>-0.0003615314930558497</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-84.86405079639164,38.17749508752453,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Claremont, California</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/505_ca_claremont_1.jpg"></p>
+
+<p><img src="http://www.sundials.org/registry/regphotos/505_ca_claremont_2.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-117.7288129576152</longitude>
+					<latitude>34.0992297660836</latitude>
+					<altitude>0</altitude>
+					<range>60.73786036422235</range>
+					<tilt>1.321942869740197e-009</tilt>
+					<heading>-0.002677989156069468</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-117.7288254316814,34.09928418001653,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Hoogezand, Netherlands</name>
+				<description><![CDATA[The sundial in the Gorechtpark  was built in 1994 by the artist  Chris Verbeek.
+<p><img src="http://www.hoogezand-sappemeer.nl/plaat.php?fileid=3054"></p>
+
+http://www.hoogezand-sappemeer.nl/index.php?simaction=content&mediumid=10&pagid=335&fontsize=10&stukid=2597]]></description>
+				<LookAt>
+					<longitude>6.73589462010654</longitude>
+					<latitude>53.15594584104552</latitude>
+					<altitude>0</altitude>
+					<range>139.6528910743265</range>
+					<tilt>1.45482979338997e-010</tilt>
+					<heading>0.002950231733866508</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>6.73578802230557,53.15607461082266,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Hoogeveen, Netherlands</name>
+				<description><![CDATA[Sundial at Unigarant, Hoogeveen.
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/werk-07-05-01.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>6.469908327982116</longitude>
+					<latitude>52.72012840714818</latitude>
+					<altitude>0</altitude>
+					<range>73.67703044709106</range>
+					<tilt>4.200981642085038e-012</tilt>
+					<heading>-0.0001367978398152192</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>6.469803362243752,52.72017851542101,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Bicentennial Park, Homebush, Australia</name>
+				<description><![CDATA[This 'walkthrough' sundial with a gnomon 8m long is well worth a visit and is near to the Olympic Park site of the 2000 Olympics. Hour lines and declination lines are set as brass strips in a concrete base dialface.
+<p><img src="http://www.rnzih.org.nz/images/sun13.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>151.0785472180646</longitude>
+					<latitude>-33.84641177017981</latitude>
+					<altitude>0</altitude>
+					<range>163.2808310648841</range>
+					<tilt>1.201655085829064e-011</tilt>
+					<heading>4.265000695512084e-006</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>151.0784520824468,-33.84631674048389,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Heerenveen, Netherlands</name>
+				<description><![CDATA[A sundial in a roundabout.
+<p><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/0/02/Zonnewijzer_Heerenveen_16.JPG/300px-Zonnewijzer_Heerenveen_16.JPG"></p>]]></description>
+				<LookAt>
+					<longitude>5.948360581453846</longitude>
+					<latitude>52.95021342348947</latitude>
+					<altitude>0</altitude>
+					<range>125.5263208537314</range>
+					<tilt>3.779142327674902e-010</tilt>
+					<heading>2.174750871196e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>5.94828156186523,52.95041125062435,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Zoetermeer, Netherlands</name>
+				<description><![CDATA[A triangle shaped sundial.
+<p><img src="http://www.chabot.demon.nl/images/Zoetermeer03.jpg"></p>
+
+http://www.chabot.demon.nl/sundials/index3.htm]]></description>
+				<LookAt>
+					<longitude>4.48801136665803</longitude>
+					<latitude>52.03630549285332</latitude>
+					<altitude>0</altitude>
+					<range>64.63218166015471</range>
+					<tilt>0</tilt>
+					<heading>-0.0001443420778625332</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>4.48796065586356,52.03633054351467,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Lancaster, Lancashire, UK</name>
+				<description><![CDATA[A very nice analemmanic sundial made of stone.
+<p><img src="http://static2.bareka.com/photos/medium/2472257/lancaster-sundial.jpg"></p>
+
+<p><img src="http://static4.bareka.com/photos/medium/2472163/becoming-gnomon.jpg"></p>
+
+<p><img src="http://static2.bareka.com/photos/medium/2472201/telling-time.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-2.781711751106886</longitude>
+					<latitude>54.04618182827939</latitude>
+					<altitude>0</altitude>
+					<range>59.27999100628823</range>
+					<tilt>0</tilt>
+					<heading>2.19677695423205e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-2.781728090880108,54.0462693701831,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial,  Nida, Lithuania</name>
+				<description><![CDATA[A large horizontal sundial.
+<p><img src="http://static1.bareka.com/photos/medium/47224/nida.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>20.99037235133227</longitude>
+					<latitude>55.29501544197078</latitude>
+					<altitude>0</altitude>
+					<range>177.9373429950499</range>
+					<tilt>4.620370977113893e-011</tilt>
+					<heading>0.0005344762650417512</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>20.99033020665709,55.29525661423606,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Tavel, France</name>
+				<description><![CDATA[A very large sundial, sadly in low res.
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-07-03-01.jpg" width="360" hight="270"></p>
+
+http://www.de-zonnewijzerkring.nl/zw-arch/eng-home-zw-07-03.htm]]></description>
+				<LookAt>
+					<longitude>4.700355808916944</longitude>
+					<latitude>44.00154771856498</latitude>
+					<altitude>0</altitude>
+					<range>254.0752666918187</range>
+					<tilt>2.46623000787332e-010</tilt>
+					<heading>-0.0002391009248289202</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>4.700351044280055,44.00172761202828,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, St. Michielsgestel, Netherlands</name>
+				<description><![CDATA[A large sundial in the gardens of the Institute for the Deaf in Sint Michielsgestel.
+
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-06-10-01.jpg"></p>
+
+<p><img src="http://www.de-zonnewijzerkring.nl/imgs-arch/zw-06-10-02.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>5.346086124850936</longitude>
+					<latitude>51.64327189620946</latitude>
+					<altitude>0</altitude>
+					<range>111.9437734662239</range>
+					<tilt>6.47253437341193e-010</tilt>
+					<heading>0.002375287388397793</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>5.346049636943462,51.64334209867396,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial,  Halle Saale, Germany</name>
+				<description><![CDATA[Analemmatic sundial at the Planetarium
+"Sigmund JÃ€hn" planetarium, Halle.
+<p><img src="http://home.arcor.de/peter.lindner/sonnenuhr/h/halle_saale_061xx/5973_peissnitzinsel_planetarium_200707163002.jpg"></p>
+
+More photos:http://home.arcor.de/peter.lindner/sonnenuhr/h/halle_saale_061xx/halle_saale_061xx.htm]]></description>
+				<LookAt>
+					<longitude>11.94846541701928</longitude>
+					<latitude>51.49449346439673</latitude>
+					<altitude>0</altitude>
+					<range>51.14591828296211</range>
+					<tilt>0</tilt>
+					<heading>0.0003207363265956715</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>11.9484244247504,51.49452140024068,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Abano Terme, Italy</name>
+				<description><![CDATA[<p><img src="http://members.aon.at/sundials/images/italia/i_07207.jpg"></p>
+
+http://members.aon.at/sundials/bild43_d.htm]]></description>
+				<LookAt>
+					<longitude>11.7902588657866</longitude>
+					<latitude>45.36024293920432</latitude>
+					<altitude>0</altitude>
+					<range>88.27261765894279</range>
+					<tilt>5.645767845941023e-011</tilt>
+					<heading>0.0006214879519801648</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>11.79017178556217,45.36037512888652,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Gasworks Park, Seattle, USA</name>
+				<description><![CDATA[The sundial at Gas Works Park
+<p><img src="http://www.magnusonpark.org/images/sundial.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-122.3362979085422</longitude>
+					<latitude>47.64532276753428</latitude>
+					<altitude>0</altitude>
+					<range>144.9142629968483</range>
+					<tilt>1.398328526418574e-010</tilt>
+					<heading>-0.002257590778485548</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-122.3363617333393,47.64542146106401,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Biarritz, France</name>
+				<description><![CDATA[<p><img src="http://www.santiago-compostela.net/pix/biar2.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-1.554172472866423</longitude>
+					<latitude>43.49326953476108</latitude>
+					<altitude>0</altitude>
+					<range>25.2767811064234</range>
+					<tilt>1.050991544755056e-009</tilt>
+					<heading>0.004580769709390601</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-1.554180928484328,43.49329288628002,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Biarritz, France</name>
+				<description><![CDATA[This is a small analemmatic sundial painted on the ground.
+<p><img src="http://www.santiago-compostela.net/pix/biar1.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-1.566562523529829</longitude>
+					<latitude>43.48379630381277</latitude>
+					<altitude>0</altitude>
+					<range>21.65084680450158</range>
+					<tilt>3.134801309486055e-010</tilt>
+					<heading>-0.003938809314781338</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-1.566563732160418,43.48381046528652,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Gardens of Easton Lodge, UK</name>
+				<description><![CDATA[Easton Lodge, Little Easton, Dunmow, Essex, UK
+
+<p><img src="http://www.sundials.co.uk/pix/easton1.jpg"></p>
+
+<p><img src="http://www.sundials.co.uk/pix/easton2.jpg"></p>
+
+http://www.sundials.co.uk/newdials.htm]]></description>
+				<LookAt>
+					<longitude>0.3149818536825662</longitude>
+					<latitude>51.89078052542742</latitude>
+					<altitude>0</altitude>
+					<range>55.96449646091584</range>
+					<tilt>4.648925194094304e-010</tilt>
+					<heading>0.00100690081475908</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>0.3149732952370528,51.89085713320831,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Drake University, Des Moines, Iowa, USA</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/483_io_desmoines_drake_univ.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-93.65212284615454</longitude>
+					<latitude>41.60195541103381</latitude>
+					<altitude>0</altitude>
+					<range>78.72982107342352</range>
+					<tilt>1.765081595632672e-010</tilt>
+					<heading>0.001286572559733559</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-93.65218647671061,41.60204463077999,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, River State Park, Indianapolis, USA</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/276_in_indi_wrsp.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-86.17152524772823</longitude>
+					<latitude>39.76773209074677</latitude>
+					<altitude>0</altitude>
+					<range>54.39844455317644</range>
+					<tilt>0</tilt>
+					<heading>0.002275213067656348</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-86.17158357583082,39.76772499391254,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Lawrence Hall of Science, Berkeley, CA, USA</name>
+				<description><![CDATA[<p><img src="http://sundials.org/conference/2000/image176.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-122.2467934369336</longitude>
+					<latitude>37.87843955912407</latitude>
+					<altitude>0</altitude>
+					<range>75.73772829567238</range>
+					<tilt>0</tilt>
+					<heading>-0.0005027058674008065</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-122.2468395686324,37.87850249930867,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Riverwalk, Augusta, Georgia, USA</name>
+				<description><![CDATA[<p><img src="http://www.coe.uga.edu/sdpl/3hgh_res/sundial1.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-81.96495913544699</longitude>
+					<latitude>33.47855115889769</latitude>
+					<altitude>0</altitude>
+					<range>24.10683016246917</range>
+					<tilt>0</tilt>
+					<heading>-0.004039593559848222</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-81.96497422223469,33.47856125757188,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Reggio nell&apos;Emilia, Italy</name>
+				<description><![CDATA[<p><img src="http://perso.orange.fr/cadrans.solaires/cadrans/images/cadran_righi_araign%E9e.jpg"></p>
+<p>Image source:<a href="http://perso.orange.fr/cadrans.solaires/cadrans/Cadran-brescia.html">http://perso.orange.fr</a></p>]]></description>
+				<LookAt>
+					<longitude>10.64303919389926</longitude>
+					<latitude>44.71779646338597</latitude>
+					<altitude>0</altitude>
+					<range>189.7095730357674</range>
+					<tilt>0</tilt>
+					<heading>0.0003188808607201916</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>10.64294491831197,44.71794161105381,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Rennes, France</name>
+				<description><![CDATA[<p><img src="http://perso.orange.fr/cadrans.solaires/cadrans/images/cadran_beauregard_300.jpg"></p>
+
+<p>Image source:<a href="http://perso.orange.fr/cadrans.solaires/cadrans/images/cadran_beauregard_300.jpg">http://perso.orange.fr</a></p>]]></description>
+				<LookAt>
+					<longitude>-1.701676278457902</longitude>
+					<latitude>48.13126501865703</latitude>
+					<altitude>0</altitude>
+					<range>61.61200771227915</range>
+					<tilt>0</tilt>
+					<heading>-7.297875936612596e-006</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-1.701699217745187,48.13129604209563,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Schneverdingen, Germany</name>
+				<description><![CDATA[<p><img src="http://www.schneverdingen-touristik.de/Rest/Sonnenuhr%20quer.jpg" width="320" hight ="240"></p>]]></description>
+				<LookAt>
+					<longitude>9.790867938787324</longitude>
+					<latitude>53.12943797238091</latitude>
+					<altitude>0</altitude>
+					<range>106.7617213575405</range>
+					<tilt>4.722006958129564e-010</tilt>
+					<heading>0.00116683463628678</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>9.790707601654233,53.12958381093443,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial Obelisk, Charleston, South Carolina</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/10a1f88a-71e0-4341-96f3-e8e687af05c9.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM9J1">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-79.93166502066842</longitude>
+					<latitude>32.76970334074068</latitude>
+					<altitude>0</altitude>
+					<range>75.62015855417492</range>
+					<tilt>4.052617221081382e-011</tilt>
+					<heading>1.8933011389851e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-79.93172500691688,32.76973746165206,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Morehead Planetarium, Chapel Hill, North Carolina</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/log/display/a71ce131-2875-4856-958f-2ca5e57a1df9.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WMCBZ">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-79.050938325099</longitude>
+					<latitude>35.91448691988588</latitude>
+					<altitude>0</altitude>
+					<range>64.77863580575449</range>
+					<tilt>0</tilt>
+					<heading>1.662447442472179e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-79.05097493816135,35.91457037097104,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Berkeley,
+California</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/log/display/9c455a92-2816-4071-950e-91f17b6fa4bd.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM988">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-122.3174670551103</longitude>
+					<latitude>37.86291969151575</latitude>
+					<altitude>0</altitude>
+					<range>46.45520126730318</range>
+					<tilt>1.288314315217904e-009</tilt>
+					<heading>2.022127862982459e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-122.317517078111,37.86295037394118,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Forest Lawn Cemetery Sundial, Buffalo, NY</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/c6aef5f9-367d-45f2-8f8c-d01bf5d233ae.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WMJQ8">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-78.85654999999994</longitude>
+					<latitude>42.92531666666667</latitude>
+					<altitude>0</altitude>
+					<range>76.25216432595194</range>
+					<tilt>0</tilt>
+					<heading>1.305178628551349e-014</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-78.85660856395873,42.92539096384056,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Ruston Way Sundial ,Tacoma, Washington</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/dd5439e7-0312-443d-9557-d4986582ef59.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WMXQB">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-122.4622812282256</longitude>
+					<latitude>47.27566486193976</latitude>
+					<altitude>0</altitude>
+					<range>62.22457114364932</range>
+					<tilt>0</tilt>
+					<heading>0.0001239840172672445</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-122.4623519976878,47.27567991760397,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial ,Science Central, Fort Wayne, Indiana</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/e78d7f23-8999-47be-b678-e7140aa82ca7.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WMYG1">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-85.1392719076301</longitude>
+					<latitude>41.09135262868964</latitude>
+					<altitude>0</altitude>
+					<range>39.45104173043256</range>
+					<tilt>0</tilt>
+					<heading>-1.439899387224993e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-85.13931366905783,41.09136114213859,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Berkswich Millennium Sundial, Broc Hill, Staffordshire, UK</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/3351745c-c573-4970-98ef-8ba7740c9bca.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WMR8X">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-2.038136129920761</longitude>
+					<latitude>52.77711389120437</latitude>
+					<altitude>0</altitude>
+					<range>29.50351061813827</range>
+					<tilt>0</tilt>
+					<heading>3.758749562499077e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-2.038162283146562,52.77714418176907,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Tazacorte Beach ,La Palma island</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/10cced19-2b34-482d-86c5-ee72fca9ab87.jpg" width="400" height="300"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM173Y">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-17.9461489138289</longitude>
+					<latitude>28.65121498294262</latitude>
+					<altitude>0</altitude>
+					<range>64.36805201552387</range>
+					<tilt>0</tilt>
+					<heading>4.047704004228316e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-17.94620263531645,28.65124065936443,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Rochester, NY</name>
+				<description><![CDATA[Residence Hall Quad Sundial
+<p><img src="http://img.groundspeak.com/waymarking/display/86272fd4-17ae-4b5d-a120-35ba49574a1d.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM13N7">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-77.66915367541856</longitude>
+					<latitude>43.0844306339545</latitude>
+					<altitude>0</altitude>
+					<range>61.69080872372956</range>
+					<tilt>0</tilt>
+					<heading>9.994948692290747e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-77.66917908415978,43.08440844604031,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Center of the World, Felicity, CA</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/log/691c99be-50f7-4916-88e7-9e103d994b22.jpg"></p>
+
+<p>
+The 15 foot Sundial at Felicity is a three-dimensional bronze of Michelangelo's Arm of God painted on the Sistine Chapel ceiling. The arm was sculpted and cast in bronze in New England. The rock is local but the installation required the assistance of a mining engineer and a special drill. The bronze Roman numerals give the time. A sundial is precisely accurate once a year and this was set at noon on Christmas Day. The arm points to the Hill of Prayer, site of the Church on the Hill at Felicity.
+At the entrance to The Center of the World campus is a 25 ft. high section of the original stairway of the Eiffel Tower. In 1983, the Government of France removed approximately 500 ft. of the original stairway. Built with the technology of the 1860's, the weight of approximately 54,000 lbs. was causing sway at the top of the then 94 year old tower. The 6,600 lb. section serves no practical purpose, but is part of the spirit of Felicity.
+The idea of making Felicity the Center of the World came to Jacques-AndrÃ© when he'd been mayor only a few months. Somehow he convinced Imperial County, CA, to recognize his claim. Soon he had convinced the Institut Geographique National of France, General Dynamics Corporation, and The People's Republic of China to recognize it as well. "I knew I had to build something, but I didn't know what. My wife said, 'It's a desert; why not a pyramid?' So Jacques-AndrÃ© had built a 21-foot-tall pink marble pyramid, its interior lined with mirrors, a plaque embedded in the floor, marking the exact spot. For a dollar, tourists can now stand on the official Center Of The World and take a picture themselves at the official "Center Of The World".
+The Felicity Post Office was dedicated on 5 December 1987 at a time when thousands of small post offices were being eliminated as an economy measure. The town, whose population numbered two, saw over 2,300 letters mailed that day. The dedication ceremony was highlighted by a speech in Chinese by Consul Zhou of the Peopleâs Republic of China who traveled 600 miles for the occasion. It is operated by the town at a cost to the Federal Government of one dollar per year. Twenty uncashed one dollar checks are on file.</p>
+
+<p>Image and info credit:<a href="http://www.waymarking.com/waymarks/WM19WB">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-114.7654750861393</longitude>
+					<latitude>32.74988921016088</latitude>
+					<altitude>0</altitude>
+					<range>72.95555856498569</range>
+					<tilt>0</tilt>
+					<heading>3.146266385893141e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-114.7655284077745,32.74992976207647,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>University of SÃ£o Paulo Sundial, Sao Paulo, Brazi</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/a5362062-9509-4022-9693-fc2a064301d8.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1DJT">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-46.7204986760494</longitude>
+					<latitude>-23.56120553413547</latitude>
+					<altitude>0</altitude>
+					<range>122.7188487961642</range>
+					<tilt>0</tilt>
+					<heading>2.610051397350573e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-46.7205459522717,-23.56115337159118,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Slate bowl Sundial, Holker, UK</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/c6aca7e1-9221-4d8f-a0f4-e062e06346f9.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1DRW">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-2.987191130383048</longitude>
+					<latitude>54.188865359179</latitude>
+					<altitude>0</altitude>
+					<range>98.16442365143851</range>
+					<tilt>2.595660029656298e-010</tilt>
+					<heading>0.000142350860720713</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-2.987342530279506,54.18895843924356,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Jardin des Doms, Avignon</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/46383080-d099-4450-98a9-6d15c1c16441.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1M8Z">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>4.807697613943427</longitude>
+					<latitude>43.95301885165002</latitude>
+					<altitude>0</altitude>
+					<range>32.75914708134153</range>
+					<tilt>1.205283678723288e-009</tilt>
+					<heading>2.147953504845766e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>4.807672022945837,43.95303620373285,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Rillito Riverpark Sundial, Tucson, AZ</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/6c0bf495-b4fe-4549-a1c1-af8fb4328eae.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1TC7">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-111.0075277787534</longitude>
+					<latitude>32.30113621710221</latitude>
+					<altitude>0</altitude>
+					<range>94.15682746212195</range>
+					<tilt>0</tilt>
+					<heading>2.968664599173171e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-111.0075933392788,32.30113929573149,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Helium Monument Sundial, Amarillo, TX</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/a0b45c91-a572-4ca1-8a9d-b5ebb84c028b.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1WJY">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-101.9132978901728</longitude>
+					<latitude>35.19956726276647</latitude>
+					<altitude>0</altitude>
+					<range>60.53404995378031</range>
+					<tilt>5.162016480480558e-011</tilt>
+					<heading>3.00374135059527e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-101.9133182362553,35.19966266329223,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Hershey, Pennsylvania</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/fbb33ffa-3867-4f28-b12c-77bf647e1d13.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM1XC1">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-76.62980321024054</longitude>
+					<latitude>40.27170452963257</latitude>
+					<altitude>0</altitude>
+					<range>72.41553799015709</range>
+					<tilt>2.798231534250927e-010</tilt>
+					<heading>6.256605840320539e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-76.6298565862236,40.2718754812139,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>King Neptune Sundial, Hilton Head Island, South Carolina</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/e48230f9-b1fd-4cf6-bc81-7f0719cc13a5.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM2EY7">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-80.72801698168738</longitude>
+					<latitude>32.18076491029077</latitude>
+					<altitude>0</altitude>
+					<range>86.36647046692004</range>
+					<tilt>2.346233297172379e-010</tilt>
+					<heading>8.72178085589082e-006</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-80.72806102317654,32.18084680335104,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Jane Larue Memorial Sundial - Ann Arbor, Michigan</name>
+				<description><![CDATA[<p><img src="http://img.groundspeak.com/waymarking/display/936cd562-a97c-44bd-8ed5-fcdf2495076d.jpg"></p>
+
+<p>Image credit:<a href="http://www.waymarking.com/waymarks/WM290J">www.groundspeak.com</a></p>]]></description>
+				<LookAt>
+					<longitude>-83.66222470201295</longitude>
+					<latitude>42.30114702626376</latitude>
+					<altitude>0</altitude>
+					<range>26.29476256996721</range>
+					<tilt>0</tilt>
+					<heading>0.0001291940559531826</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy70</styleUrl>
+				<Point>
+					<coordinates>-83.66224748552365,42.30117333470928,0</coordinates>
+				</Point>
+			</Placemark>
+		</Folder>
+		<Folder>
+			<name>Schoolyard Sundials</name>
+			<Placemark>
+				<name>Sundial, Julius-Brecht-Allee, Bremen</name>
+				<LookAt>
+					<longitude>8.8674012861685</longitude>
+					<latitude>53.07651505713779</latitude>
+					<altitude>0</altitude>
+					<range>20.6687721420542</range>
+					<tilt>9.001122528249614e-011</tilt>
+					<heading>-0.00437506724289509</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>8.867391721405184,53.07654483342672,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, DrebberstraÃe, Bremen</name>
+				<description><![CDATA[<p><img src="http://planetarium.hs-bremen.de/planetarium/pics/drebber.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>8.898052233187912</longitude>
+					<latitude>53.0400952944841</latitude>
+					<altitude>0</altitude>
+					<range>14.44345748598086</range>
+					<tilt>0</tilt>
+					<heading>-0.001637659480767247</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>8.898047664850367,53.04011230005033,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Butjadingersrasse, Bremen</name>
+				<description><![CDATA[<p><img src="http://planetarium.hs-bremen.de/planetarium/astroinfo/sonnenuhren/sonstige/butjadinger.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>8.759747956980032</longitude>
+					<latitude>53.08143879125452</latitude>
+					<altitude>0</altitude>
+					<range>37.83897098076405</range>
+					<tilt>0</tilt>
+					<heading>-0.002629545926081431</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>8.759712018733111,53.08151322706201,0</coordinates>
+				</Point>
+			</Placemark>
+		</Folder>
+		<Folder>
+			<name>In Progress</name>
+			<Placemark>
+				<name>Sundial, Greenwich, USA</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/345_ct_greenwich.jpg"></p>]]></description>
+				<LookAt>
+					<longitude>-73.61498302559443</longitude>
+					<latitude>41.02226092221508</latitude>
+					<altitude>0</altitude>
+					<range>149.2259168633856</range>
+					<tilt>1.357926888487057e-010</tilt>
+					<heading>-0.001539166856947675</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-73.61504279924034,41.022311140554,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sonnenuhr?</name>
+				<LookAt>
+					<longitude>11.05508326700377</longitude>
+					<latitude>49.45922489288633</latitude>
+					<altitude>0</altitude>
+					<range>50.88443884213967</range>
+					<tilt>8.335955203191607e-009</tilt>
+					<heading>0.0196675278275586</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>11.0551380716084,49.45927364486676,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Edgewood Park, New Haven, USA</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/279_ct_newha_eng.jpg"><p>
+
+<p><img src="http://www.sundials.org/registry/regphotos/279_ct_newha_eng2.jpg"><p>]]></description>
+				<LookAt>
+					<longitude>-72.95215163561284</longitude>
+					<latitude>41.31399188322968</latitude>
+					<altitude>0</altitude>
+					<range>154.2904142456261</range>
+					<tilt>0</tilt>
+					<heading>0.002187256502984029</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-72.95224192688632,41.31401837758977,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial, Pearl City, Oahu, USA</name>
+				<description><![CDATA[<p><img src="http://www.sundials.org/registry/regphotos/535_hi_pearlcity_uofhi_1.jpg" height="300px" width="450px"></p>]]></description>
+				<LookAt>
+					<longitude>-157.975920511215</longitude>
+					<latitude>21.39370171784438</latitude>
+					<altitude>0</altitude>
+					<range>93.82906502148613</range>
+					<tilt>0</tilt>
+					<heading>-0.001426474135915891</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-157.9759385077734,21.39376422631041,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial</name>
+				<description>http://maget.maget.free.fr/SiteMont/index.html</description>
+				<LookAt>
+					<longitude>-1.511135684750573</longitude>
+					<latitude>48.63640399624012</latitude>
+					<altitude>0</altitude>
+					<range>623.6899626138724</range>
+					<tilt>0</tilt>
+					<heading>-1.851737885201182e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-1.511518347366319,48.63786003229999,0</coordinates>
+				</Point>
+			</Placemark>
+			<GroundOverlay>
+				<name>Mont-Saint-Michel</name>
+				<description>http://maget.maget.free.fr/SiteMont/MSpage4.htm</description>
+				<Icon>
+					<href>http://maget.maget.free.fr/SiteMont/images/le_Mont_Solaire-Land%20Art.jpg</href>
+					<viewBoundScale>0.75</viewBoundScale>
+				</Icon>
+				<LatLonBox>
+					<north>48.63770978435333</north>
+					<south>48.6344604605756</south>
+					<east>-1.5070705975067</east>
+					<west>-1.514375149320612</west>
+					<rotation>-11.46597601725745</rotation>
+				</LatLonBox>
+			</GroundOverlay>
+			<Placemark>
+				<name>Sundial Park, Ludiver park</name>
+				<description>http://perso.orange.fr/cadrans.solaires/cadrans/cadran-parc-ludiver.html</description>
+				<LookAt>
+					<longitude>-1.727863357864637</longitude>
+					<latitude>49.63119498354116</latitude>
+					<altitude>0</altitude>
+					<range>473.1060190443535</range>
+					<tilt>3.883358970183465e-011</tilt>
+					<heading>0.0005701632901766135</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-1.728331456927833,49.63191584214422,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sonnenuhr?</name>
+				<LookAt>
+					<longitude>7.68545763101957</longitude>
+					<latitude>51.53642499090419</latitude>
+					<altitude>0</altitude>
+					<range>23.70363190324798</range>
+					<tilt>4.475657800962137e-010</tilt>
+					<heading>-0.1674345977313924</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>7.685416995069303,51.53648149450991,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>Sundial at Tower of London</name>
+				<description><![CDATA[<img src="http://gallery.ontopof-theworld.com/albums/photohunt/IMG_1031_t.jpg">]]></description>
+				<LookAt>
+					<longitude>-0.07656780337525181</longitude>
+					<latitude>51.50981727675416</latitude>
+					<altitude>0</altitude>
+					<range>61.73369699893549</range>
+					<tilt>9.251491983355112e-010</tilt>
+					<heading>0.009688876514144714</heading>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-0.07656780337525181,51.50981727675417,0</coordinates>
+				</Point>
+			</Placemark>
+			<Placemark>
+				<name>War Veterans&apos; Memorial Park Sundial, Florida, United States</name>
+				<LookAt>
+					<longitude>-82.77333790901622</longitude>
+					<latitude>27.8036881517592</latitude>
+					<altitude>0</altitude>
+					<range>96.43655563554265</range>
+					<tilt>4.405141995417006e-010</tilt>
+					<heading>9.892674215924156e-005</heading>
+					<altitudeMode>relativeToGround</altitudeMode>
+				</LookAt>
+				<styleUrl>#msn_sunny_copy69</styleUrl>
+				<Point>
+					<coordinates>-82.77341348054247,27.80374932310448,0</coordinates>
+				</Point>
+			</Placemark>
+		</Folder>
+	</Folder>
+</Document>
+</kml>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/docs.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/docs.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/docs.html	(revision 76)
@@ -0,0 +1,147 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Documentation &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+    <link rel="next" title="Tutorials" href="tutorials/index.html" />
+    <link rel="prev" title="JavaScript Toolkit for Rich Web Mapping Applications" href="index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="#">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Documentation</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Documentation</a><ul>
+<li><a class="reference external" href="#getting-started">Getting Started</a></li>
+<li><a class="reference external" href="#examples">Examples</a></li>
+<li><a class="reference external" href="#library-reference">Library Reference</a></li>
+<li><a class="reference external" href="#participating-in-the-geoext-community">Participating in the GeoExt Community</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="index.html"
+                                  title="previous chapter">JavaScript Toolkit for Rich Web Mapping Applications</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="tutorials/index.html"
+                                  title="next chapter">Tutorials</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="documentation">
+<h1>Documentation<a class="headerlink" href="#documentation" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="getting-started">
+<h2>Getting Started<a class="headerlink" href="#getting-started" title="Permalink to this headline">Â¶</a></h2>
+<ul class="simple">
+<li><strong>Jump in</strong> with <a class="reference external" href="tutorials/index.html"><em>Tutorials</em></a> to get you up and running</li>
+<li><strong>Ramp up</strong> with <a class="reference external" href="primers/index.html"><em>Core Concepts</em></a> to learn the core concepts behind GeoExt</li>
+</ul>
+</div>
+<div class="section" id="examples">
+<h2>Examples<a class="headerlink" href="#examples" title="Permalink to this headline">Â¶</a></h2>
+<p>Learn by <a class="reference external" href="examples.html#examples"><em>example</em></a>! Most of the GeoExt widgets and data components
+have simple examples that demonstrate their use. By looking through the sources
+for the examples, you can learn how to use GeoExt components in your
+application.</p>
+</div>
+<div class="section" id="library-reference">
+<h2>Library Reference<a class="headerlink" href="#library-reference" title="Permalink to this headline">Â¶</a></h2>
+<p>The <a class="reference external" href="lib/index.html"><em>API Reference</em></a> covers details on developing with GeoExt.  Generated
+from the comments in the code.</p>
+</div>
+<div class="section" id="participating-in-the-geoext-community">
+<h2>Participating in the GeoExt Community<a class="headerlink" href="#participating-in-the-geoext-community" title="Permalink to this headline">Â¶</a></h2>
+<p>For information about getting involved in the GeoExt community, <a class="reference external" href="developer/index.html"><em>keep reading!</em></a></p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="tutorials/index.html" title="Tutorials"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="index.html" title="JavaScript Toolkit for Rich Web Mapping Applications"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Documentation</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/downloads.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/downloads.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/downloads.html	(revision 76)
@@ -0,0 +1,134 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Download GeoExt &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+    <link rel="prev" title="Ext.Ajax Overrides" href="lib/overrides/override-ext-ajax.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="#">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Download GeoExt</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Download GeoExt</a><ul>
+<li><a class="reference external" href="#current-release">Current Release</a></li>
+<li><a class="reference external" href="#previous-releases">Previous Releases</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="lib/overrides/override-ext-ajax.html"
+                                  title="previous chapter">Ext.Ajax Overrides</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="download-geoext">
+<h1>Download GeoExt<a class="headerlink" href="#download-geoext" title="Permalink to this headline">Â¶</a></h1>
+<div class="section" id="current-release">
+<h2>Current Release<a class="headerlink" href="#current-release" title="Permalink to this headline">Â¶</a></h2>
+<blockquote>
+<ul class="simple">
+<li>GeoExt 1.0 (<a class="reference external" href="http://trac.geoext.org/attachment/wiki/Download/GeoExt-1.0.zip?format=raw">Source</a> | <a class="reference external" href="http://trac.geoext.org/wiki/Release/1.0/Notes">Release Notes</a>)</li>
+<li><a class="reference external" href="builder/v1.0.html"><em>Build your own download</em></a> (with just the components you need).</li>
+</ul>
+</blockquote>
+</div>
+<div class="section" id="previous-releases">
+<h2>Previous Releases<a class="headerlink" href="#previous-releases" title="Permalink to this headline">Â¶</a></h2>
+<blockquote>
+<ul class="simple">
+<li>GeoExt 0.7 (<a class="reference external" href="builder/v0.7.html"><em>Custom Build</em></a> | <a class="reference external" href="http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.7.zip?format=raw">Source</a> | <a class="reference external" href="http://trac.geoext.org/wiki/Release/0.7/Notes">Release Notes</a>)</li>
+<li>GeoExt 0.6 (<a class="reference external" href="builder/v0.6.html"><em>Custom Build</em></a> | <a class="reference external" href="http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.6.zip?format=raw">Source</a> | <a class="reference external" href="http://trac.geoext.org/wiki/Release/0.6/Notes">Release Notes</a>)</li>
+<li>GeoExt 0.5 (<a class="reference external" href="http://trac.geoext.org/attachment/wiki/Download/GeoExt-release-0.5.zip?format=raw">Source</a> | <a class="reference external" href="http://trac.geoext.org/wiki/Release/0.5/Notes">Release Notes</a>)</li>
+</ul>
+</blockquote>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="lib/overrides/override-ext-ajax.html" title="Ext.Ajax Overrides"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Download GeoExt</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/genindex.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/genindex.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/genindex.html	(revision 76)
@@ -0,0 +1,368 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Index &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Index</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+
+   
+
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+
+   <h1 id="index">Index</h1>
+
+   <a href="#A"><strong>A</strong></a> | <a href="#B"><strong>B</strong></a> | <a href="#C"><strong>C</strong></a> | <a href="#D"><strong>D</strong></a> | <a href="#F"><strong>F</strong></a> | <a href="#G"><strong>G</strong></a> | <a href="#H"><strong>H</strong></a> | <a href="#L"><strong>L</strong></a> | <a href="#M"><strong>M</strong></a> | <a href="#O"><strong>O</strong></a> | <a href="#P"><strong>P</strong></a> | <a href="#R"><strong>R</strong></a> | <a href="#S"><strong>S</strong></a> | <a href="#U"><strong>U</strong></a> | <a href="#V"><strong>V</strong></a> | <a href="#W"><strong>W</strong></a> | <a href="#Z"><strong>Z</strong></a> 
+
+   <hr />
+
+   
+<h2 id="A">A</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/Action.html#GeoExt.Action">Action (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.addPage">addPage() (GeoExt.plugins.PrintExtent method)</a></dt>
+<dt><a href="lib/GeoExt/plugins/AttributeForm.html#GeoExt.plugins.AttributeForm">AttributeForm (class in GeoExt.plugins)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/AttributeReader.html#GeoExt.data.AttributeReader">AttributeReader (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/AttributeStore.html#GeoExt.data.AttributeStore">AttributeStore (class in GeoExt.data)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="B">B</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/tree/BaseLayerContainer.html#GeoExt.tree.BaseLayerContainer">BaseLayerContainer (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/widgets/form/BasicForm.html#GeoExt.form.BasicForm">BasicForm (class in GeoExt.form)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore.bind">bind() (GeoExt.data.FeatureStore method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/data/ScaleStore.html#GeoExt.data.ScaleStore.bind">(GeoExt.data.ScaleStore method)</a></dt>
+    <dt><a href="lib/GeoExt/widgets/grid/FeatureSelectionModel.html#GeoExt.grid.FeatureSelectionModel.bind">(GeoExt.grid.FeatureSelectionModel method)</a></dt>
+  </dl></dd></dl></td><td width="33%" valign="top"><dl>
+</dl></td></tr></table>
+
+<h2 id="C">C</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.center">center (GeoExt.data.PrintPage attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/LayerRecord.html#GeoExt.data.LayerRecord.clone">clone() (GeoExt.data.LayerRecord method)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureRecord.html#GeoExt.data.FeatureRecord.create">create() (GeoExt.data.FeatureRecord class method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/data/LayerRecord.html#GeoExt.data.LayerRecord.create">(GeoExt.data.LayerRecord class method)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/widgets/tree/LayerLoader.html#GeoExt.tree.LayerLoader.createNode">createNode() (GeoExt.tree.LayerLoader method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/tree/LayerParamLoader.html#GeoExt.tree.LayerParamLoader.createNode">(GeoExt.tree.LayerParamLoader method)</a></dt>
+  </dl></dd></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.customParams">customParams (GeoExt.data.PrintPage attribute)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.customParams">(GeoExt.data.PrintProvider attribute)</a></dt>
+  </dl></dd>
+</dl></td></tr></table>
+
+<h2 id="D">D</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/form/BasicForm.html#GeoExt.form.BasicForm.doAction">doAction() (GeoExt.form.BasicForm method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.dpi">dpi (GeoExt.data.PrintProvider attribute)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.dpis">dpis (GeoExt.data.PrintProvider attribute)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="F">F</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.feature">feature (GeoExt.data.PrintPage attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureReader.html#GeoExt.data.FeatureReader">FeatureReader (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureRecord.html#GeoExt.data.FeatureRecord">FeatureRecord (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/FeatureRenderer.html#GeoExt.FeatureRenderer">FeatureRenderer (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/grid/FeatureSelectionModel.html#GeoExt.grid.FeatureSelectionModel">FeatureSelectionModel (class in GeoExt.grid)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore">FeatureStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.fit">fit() (GeoExt.data.PrintPage method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/form/FormPanel.html#GeoExt.form.FormPanel">FormPanel (class in GeoExt.form)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="G">G</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/index.html#module-GeoExt">GeoExt (module)</a></dt>
+<dt><a href="lib/GeoExt/data.html#module-GeoExt.data">GeoExt.data (module)</a></dt>
+<dt><a href="lib/GeoExt/widgets.html#module-GeoExt.form">GeoExt.form (module)</a></dt>
+<dt><a href="lib/GeoExt/widgets.html#module-GeoExt.grid">GeoExt.grid (module)</a></dt>
+<dt><a href="lib/GeoExt/plugins.html#module-GeoExt.plugins">GeoExt.plugins (module)</a></dt>
+<dt><a href="lib/GeoExt/state.html#module-GeoExt.state">GeoExt.state (module)</a></dt>
+<dt><a href="lib/GeoExt/widgets.html#module-GeoExt.tree">GeoExt.tree (module)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureRecord.html#GeoExt.data.FeatureRecord.getFeature">getFeature() (GeoExt.data.FeatureRecord method)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/LayerRecord.html#GeoExt.data.LayerRecord.getLayer">getLayer() (GeoExt.data.LayerRecord method)</a></dt>
+<dt><a href="lib/GeoExt/state/PermalinkProvider.html#GeoExt.state.PermalinkProvider.getLink">getLink() (GeoExt.state.PermalinkProvider method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.getPrintExtent">getPrintExtent() (GeoExt.data.PrintPage method)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore.getRecordFromFeature">getRecordFromFeature() (GeoExt.data.FeatureStore method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/ZoomSlider.html#GeoExt.ZoomSlider.getResolution">getResolution() (GeoExt.ZoomSlider method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/ZoomSlider.html#GeoExt.ZoomSlider.getScale">getScale() (GeoExt.ZoomSlider method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/ZoomSlider.html#GeoExt.ZoomSlider.getZoom">getZoom() (GeoExt.ZoomSlider method)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="H">H</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.hide">hide() (GeoExt.plugins.PrintExtent method)</a></dt></dl></td><td width="33%" valign="top"><dl>
+</dl></td></tr></table>
+
+<h2 id="L">L</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/tree/LayerNode.html#GeoExt.tree.LayerNode.layer">layer (GeoExt.tree.LayerNode attribute)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/LayerContainer.html#GeoExt.tree.LayerContainer">LayerContainer (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/widgets/LayerLegend.html#GeoExt.LayerLegend">LayerLegend (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/LayerLoader.html#GeoExt.tree.LayerLoader">LayerLoader (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/LayerNode.html#GeoExt.tree.LayerNode">LayerNode (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/widgets/LayerOpacitySlider.html#GeoExt.LayerOpacitySlider">LayerOpacitySlider (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tips/LayerOpacitySliderTip.html#GeoExt.LayerOpacitySliderTip">LayerOpacitySliderTip (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/LayerParamLoader.html#GeoExt.tree.LayerParamLoader">LayerParamLoader (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/LayerParamNode.html#GeoExt.tree.LayerParamNode">LayerParamNode (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/data/LayerReader.html#GeoExt.data.LayerReader">LayerReader (class in GeoExt.data)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/LayerRecord.html#GeoExt.data.LayerRecord">LayerRecord (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel.layers">layers (GeoExt.MapPanel attribute)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.layers">(GeoExt.PrintMapPanel attribute)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/data/LayerStore.html#GeoExt.data.LayerStore">LayerStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.layout">layout (GeoExt.data.PrintProvider attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.layouts">layouts (GeoExt.data.PrintProvider attribute)</a></dt>
+<dt><a href="lib/GeoExt/widgets/LegendImage.html#GeoExt.LegendImage">LegendImage (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/LegendPanel.html#GeoExt.LegendPanel">LegendPanel (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.loadCapabilities">loadCapabilities() (GeoExt.data.PrintProvider method)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="M">M</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/LayerStore.html#GeoExt.data.LayerStore.map">map (GeoExt.data.LayerStore attribute)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel.map">(GeoExt.MapPanel attribute)</a></dt>
+    <dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.map">(GeoExt.PrintMapPanel attribute)</a></dt>
+  </dl></dd></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/widgets/MapPanel.html#GeoExt.MapPanel">MapPanel (class in GeoExt)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="O">O</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/tree/OverlayLayerContainer.html#GeoExt.tree.OverlayLayerContainer">OverlayLayerContainer (class in GeoExt.tree)</a></dt></dl></td><td width="33%" valign="top"><dl>
+</dl></td></tr></table>
+
+<h2 id="P">P</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.page">page (GeoExt.plugins.PrintExtent attribute)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.pages">pages (GeoExt.plugins.PrintExtent attribute)</a></dt>
+<dt><a href="lib/GeoExt/state/PermalinkProvider.html#GeoExt.state.PermalinkProvider">PermalinkProvider (class in GeoExt.state)</a></dt>
+<dt><a href="lib/GeoExt/widgets/Popup.html#GeoExt.Popup">Popup (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.previewScales">previewScales (GeoExt.PrintMapPanel attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.print">print() (GeoExt.data.PrintProvider method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.print">(GeoExt.PrintMapPanel method)</a></dt>
+    <dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.print">(GeoExt.plugins.PrintExtent method)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent">PrintExtent (class in GeoExt.plugins)</a></dt>
+<dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel">PrintMapPanel (class in GeoExt)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage">PrintPage (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.printPage">printPage (GeoExt.PrintMapPanel attribute)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintPageField.html#GeoExt.plugins.PrintPageField">PrintPageField (class in GeoExt.plugins)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider">PrintProvider (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.printProvider">printProvider (GeoExt.plugins.PrintExtent attribute)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/PrintMapPanel.html#GeoExt.PrintMapPanel.printProvider">(GeoExt.PrintMapPanel attribute)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/plugins/PrintProviderField.html#GeoExt.plugins.PrintProviderField">PrintProviderField (class in GeoExt.plugins)</a></dt>
+<dt><a href="lib/GeoExt/data/ProtocolProxy.html#GeoExt.data.ProtocolProxy">ProtocolProxy (class in GeoExt.data)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="R">R</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/FeatureReader.html#GeoExt.data.FeatureReader.readRecords">readRecords() (GeoExt.data.FeatureReader method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/data/LayerReader.html#GeoExt.data.LayerReader.readRecords">(GeoExt.data.LayerReader method)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.removePage">removePage() (GeoExt.plugins.PrintExtent method)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/widgets/form/SearchAction.html#GeoExt.form.SearchAction.response">response (GeoExt.form.SearchAction attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.rotation">rotation (GeoExt.data.PrintPage attribute)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="S">S</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.scale">scale (GeoExt.data.PrintPage attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.scales">scales (GeoExt.data.PrintProvider attribute)</a></dt>
+<dt><a href="lib/GeoExt/data/ScaleStore.html#GeoExt.data.ScaleStore">ScaleStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/form/BasicForm.html#GeoExt.form.BasicForm.search">search() (GeoExt.form.BasicForm method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/form/FormPanel.html#GeoExt.form.FormPanel.search">(GeoExt.form.FormPanel method)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/widgets/form/SearchAction.html#GeoExt.form.SearchAction">SearchAction (class in GeoExt.form)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.selectPage">selectPage() (GeoExt.plugins.PrintExtent method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.setCenter">setCenter() (GeoExt.data.PrintPage method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/VectorLegend.html#GeoExt.VectorLegend.setCurrentScaleDenominator">setCurrentScaleDenominator() (GeoExt.VectorLegend method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.setDpi">setDpi() (GeoExt.data.PrintProvider method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/FeatureRenderer.html#GeoExt.FeatureRenderer.setFeature">setFeature() (GeoExt.FeatureRenderer method)</a></dt>
+<dt><a href="lib/GeoExt/data/FeatureRecord.html#GeoExt.data.FeatureRecord.setLayer">setLayer() (GeoExt.data.FeatureRecord method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/LayerOpacitySlider.html#GeoExt.LayerOpacitySlider.setLayer">(GeoExt.LayerOpacitySlider method)</a></dt>
+    <dt><a href="lib/GeoExt/data/LayerRecord.html#GeoExt.data.LayerRecord.setLayer">(GeoExt.data.LayerRecord method)</a></dt>
+  </dl></dd></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/PrintProvider.html#GeoExt.data.PrintProvider.setLayout">setLayout() (GeoExt.data.PrintProvider method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.setRotation">setRotation() (GeoExt.data.PrintPage method)</a></dt>
+<dt><a href="lib/GeoExt/data/PrintPage.html#GeoExt.data.PrintPage.setScale">setScale() (GeoExt.data.PrintPage method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/Popup.html#GeoExt.Popup.setSize">setSize() (GeoExt.Popup method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/FeatureRenderer.html#GeoExt.FeatureRenderer.setSymbolizers">setSymbolizers() (GeoExt.FeatureRenderer method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/FeatureRenderer.html#GeoExt.FeatureRenderer.setSymbolType">setSymbolType() (GeoExt.FeatureRenderer method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/LegendImage.html#GeoExt.LegendImage.setUrl">setUrl() (GeoExt.LegendImage method)</a></dt>
+<dt><a href="lib/GeoExt/plugins/PrintExtent.html#GeoExt.plugins.PrintExtent.show">show() (GeoExt.plugins.PrintExtent method)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tips/SliderTip.html#GeoExt.SliderTip">SliderTip (class in GeoExt)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="U">U</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/FeatureStore.html#GeoExt.data.FeatureStore.unbind">unbind() (GeoExt.data.FeatureStore method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/data/ScaleStore.html#GeoExt.data.ScaleStore.unbind">(GeoExt.data.ScaleStore method)</a></dt>
+    <dt><a href="lib/GeoExt/widgets/grid/FeatureSelectionModel.html#GeoExt.grid.FeatureSelectionModel.unbind">(GeoExt.grid.FeatureSelectionModel method)</a></dt>
+  </dl></dd>
+<dt><a href="lib/GeoExt/widgets/FeatureRenderer.html#GeoExt.FeatureRenderer.update">update() (GeoExt.FeatureRenderer method)</a></dt>
+  <dd><dl>
+    <dt><a href="lib/GeoExt/widgets/VectorLegend.html#GeoExt.VectorLegend.update">(GeoExt.VectorLegend method)</a></dt>
+  </dl></dd></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/widgets/UrlLegend.html#GeoExt.UrlLegend">UrlLegend (class in GeoExt)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="V">V</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/VectorLegend.html#GeoExt.VectorLegend">VectorLegend (class in GeoExt)</a></dt></dl></td><td width="33%" valign="top"><dl>
+</dl></td></tr></table>
+
+<h2 id="W">W</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/data/WFSCapabilitiesReader.html#GeoExt.data.WFSCapabilitiesReader">WFSCapabilitiesReader (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/WFSCapabilitiesStore.html#GeoExt.data.WFSCapabilitiesStore">WFSCapabilitiesStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/WMCReader.html#GeoExt.data.WMCReader">WMCReader (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.html#GeoExt.tree.WMSCapabilitiesLoader">WMSCapabilitiesLoader (class in GeoExt.tree)</a></dt>
+<dt><a href="lib/GeoExt/data/WMSCapabilitiesReader.html#GeoExt.data.WMSCapabilitiesReader">WMSCapabilitiesReader (class in GeoExt.data)</a></dt></dl></td><td width="33%" valign="top"><dl>
+<dt><a href="lib/GeoExt/data/WMSCapabilitiesStore.html#GeoExt.data.WMSCapabilitiesStore">WMSCapabilitiesStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/WMSDescribeLayerReader.html#GeoExt.data.WMSDescribeLayerReader">WMSDescribeLayerReader (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/data/WMSDescribeLayerStore.html#GeoExt.data.WMSDescribeLayerStore">WMSDescribeLayerStore (class in GeoExt.data)</a></dt>
+<dt><a href="lib/GeoExt/widgets/WMSLegend.html#GeoExt.WMSLegend">WMSLegend (class in GeoExt)</a></dt>
+</dl></td></tr></table>
+
+<h2 id="Z">Z</h2>
+<table width="100%" class="indextable"><tr><td width="33%" valign="top">
+<dl>
+
+<dt><a href="lib/GeoExt/widgets/ZoomSlider.html#GeoExt.ZoomSlider">ZoomSlider (class in GeoExt)</a></dt>
+<dt><a href="lib/GeoExt/widgets/tips/ZoomSliderTip.html#GeoExt.ZoomSliderTip">ZoomSliderTip (class in GeoExt)</a></dt></dl></td><td width="33%" valign="top"><dl>
+</dl></td></tr></table>
+
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="#" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Index</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides/override-ext-ajax.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides/override-ext-ajax.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides/override-ext-ajax.html	(revision 76)
@@ -0,0 +1,173 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Ext.Ajax Overrides &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../index.html" />
+    <link rel="up" title="Ext Overrides" href="../overrides.html" />
+    <link rel="next" title="Download GeoExt" href="../../downloads.html" />
+    <link rel="prev" title="Ext Overrides" href="../overrides.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../docs.html">Documentation</a></li>
+                <li><a href="../../examples.html">Examples</a></li>
+                <li><a href="../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../overrides.html" accesskey="U">Ext Overrides</a> &raquo;</li>
+        <li><a href="#">Ext.Ajax Overrides</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Ext.Ajax Overrides</a><ul>
+<li><a class="reference external" href="#workaround-for-existing-builds">Workaround for Existing Builds</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../overrides.html"
+                                  title="previous chapter">Ext Overrides</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../../downloads.html"
+                                  title="next chapter">Download GeoExt</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="ext-ajax-overrides">
+<span id="overrides-ext-ajax"></span><h1>Ext.Ajax Overrides<a class="headerlink" href="#ext-ajax-overrides" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt provides an override for the functionality in
+<a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Ajax">Ext.Ajax</a>.  If you include
+the <tt class="docutils literal"><span class="pre">override-ext-ajax.js</span></tt> file in your build, any calls to <tt class="docutils literal"><span class="pre">Ext.Ajax</span></tt>
+methods will be routed through <tt class="docutils literal"><span class="pre">OpenLayers.Request</span></tt> methods.  The practical
+implication of this is that you can set the <tt class="docutils literal"><span class="pre">OpenLayers.ProxyHost</span></tt> property
+in your application and have this proxy used by Ext components that call
+<tt class="docutils literal"><span class="pre">Ext.Ajax</span></tt> methods.</p>
+<p>To include <tt class="docutils literal"><span class="pre">override-ext-ajax.js</span></tt> in your build, the GeoExt section in
+your build config should look like one of the following:</p>
+<div class="highlight-ini"><pre># include everything (including override-ext-ajax.js)
+[GeoExt.js]
+root = ../lib
+license = geoext-license.js
+exclude =
+    GeoExt.js
+    GeoExt/SingleFile.js</pre>
+</div>
+<p>or</p>
+<div class="highlight-ini"><pre># custom build
+[GeoExt.js]
+root = ../lib
+license = geoext-license.js
+include =
+    overrides/override-ext-ajax.js
+    # other files listed here ...</pre>
+</div>
+<div class="section" id="workaround-for-existing-builds">
+<h2>Workaround for Existing Builds<a class="headerlink" href="#workaround-for-existing-builds" title="Permalink to this headline">Â¶</a></h2>
+<p>If you are using a build of GeoExt that includes the Ajax overrides (e.g. the
+0.6 release or earlier), you can work around any issues you may have using this
+override in your appliction by protecting the <tt class="docutils literal"><span class="pre">Ext.lib.Ajax</span></tt> object before
+loading file:<cite>GeoExt.js</cite>.</p>
+<p>The example markup below will remove the effect of the override on Ajax methods.</p>
+<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;path/to/ext.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script&gt;</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">lib</span><span class="p">.</span><span class="nx">_Ajax</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">lib</span><span class="p">.</span><span class="nx">Ajax</span><span class="p">;</span> <span class="c1">// protect the original</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">lib</span><span class="p">.</span><span class="nx">Ajax</span> <span class="o">=</span> <span class="p">{};</span>  <span class="c1">// create dummy for override</span>
+<span class="nt">&lt;/script&gt;</span>
+<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">&quot;path/to/GeoExt.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
+<span class="nt">&lt;script&gt;</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">lib</span><span class="p">.</span><span class="nx">Ajax</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">lib</span><span class="p">.</span><span class="nx">_Ajax</span><span class="p">;</span> <span class="c1">// restore the original</span>
+<span class="nt">&lt;/script&gt;</span>
+</pre></div>
+</div>
+<p>Note that issues with the Ajax override present in 0.6 will be fixed in
+subsequent releases.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../../downloads.html" title="Download GeoExt"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../overrides.html" title="Ext Overrides"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../overrides.html" >Ext Overrides</a> &raquo;</li>
+        <li><a href="#">Ext.Ajax Overrides</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/overrides.html	(revision 76)
@@ -0,0 +1,122 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Ext Overrides &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="up" title="API Reference" href="index.html" />
+    <link rel="next" title="Ext.Ajax Overrides" href="overrides/override-ext-ajax.html" />
+    <link rel="prev" title="GeoExt.state.PermalinkProvider" href="GeoExt/state/PermalinkProvider.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" accesskey="U">API Reference</a> &raquo;</li>
+        <li><a href="#">Ext Overrides</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="GeoExt/state/PermalinkProvider.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="overrides/override-ext-ajax.html"
+                                  title="next chapter">Ext.Ajax Overrides</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="ext-overrides">
+<span id="overrides"></span><h1>Ext Overrides<a class="headerlink" href="#ext-overrides" title="Permalink to this headline">Â¶</a></h1>
+<p>The GeoExt library provides some specific overrides for Ext objects and methods.
+These can be optionally included in your GeoExt build.</p>
+<p>See below for a list of available overrides.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="overrides/override-ext-ajax.html">Ext.Ajax Overrides</a></li>
+</ul>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="overrides/override-ext-ajax.html" title="Ext.Ajax Overrides"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="GeoExt/state/PermalinkProvider.html" title="GeoExt.state.PermalinkProvider"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="index.html" >API Reference</a> &raquo;</li>
+        <li><a href="#">Ext Overrides</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/index.html	(revision 76)
@@ -0,0 +1,231 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>API Reference &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../_static/jquery.js"></script>
+    <script type="text/javascript" src="../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../index.html" />
+    <link rel="next" title="Widgets" href="GeoExt/widgets.html" />
+    <link rel="prev" title="GeoExt Community Involvement" href="../developer/index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../docs.html">Documentation</a></li>
+                <li><a href="../examples.html">Examples</a></li>
+                <li><a href="../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">API Reference</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">API Reference</a><ul>
+<li><a class="reference external" href="#geoext"><tt class="docutils literal"><span class="pre">GeoExt</span></tt></a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#overrides">Overrides</a><ul>
+</ul>
+</li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../developer/index.html"
+                                  title="previous chapter">GeoExt Community Involvement</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="GeoExt/widgets.html"
+                                  title="next chapter">Widgets</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="module-GeoExt">
+<span id="api-reference"></span><h1>API Reference<a class="headerlink" href="#module-GeoExt" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt components and data utility classes extend map related functionality to
+equivalent classes in Ext.  The API reference here documents the properties,
+methods, and events that are extensions or modifications to the Ext parent
+classes.  Documentation for each class contains links to the Ext parent class,
+and for a full picture of the API, it is essential to have a copy of the
+<a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/">Ext API Documentation</a> at hand.</p>
+<p>GeoExt classes are typically configured with OpenLayers objects.  For detail on
+methods and properties provided by these objects, see the
+<a class="reference external" href="http://dev.openlayers.org/apidocs">OpenLayers API Documentation</a>.</p>
+<div class="section" id="geoext">
+<h2><tt class="xref docutils literal"><span class="pre">GeoExt</span></tt><a class="headerlink" href="#geoext" title="Permalink to this headline">Â¶</a></h2>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/widgets.html">Widgets</a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/Action.html"><tt class="docutils literal"><span class="pre">GeoExt.Action</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/FeatureRenderer.html"><tt class="docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/LayerLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/LayerOpacitySlider.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/LegendImage.html"><tt class="docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/LegendPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/MapPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/Popup.html"><tt class="docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/PrintMapPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/UrlLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/VectorLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/WMSLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/ZoomSlider.html"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tips/LayerOpacitySliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tips/SliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tips/ZoomSliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></li>
+</ul>
+</li>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/widgets.html#module-GeoExt.grid"><tt class="docutils literal"><span class="pre">GeoExt.form</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/form/BasicForm.html"><tt class="docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/form/FormPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/form/SearchAction.html"><tt class="docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></li>
+</ul>
+</li>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/widgets.html#module-GeoExt.tree"><tt class="docutils literal"><span class="pre">GeoExt.grid</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/grid/FeatureSelectionModel.html"><tt class="docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></li>
+</ul>
+</li>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/widgets.html#geoext-tree"><tt class="docutils literal"><span class="pre">GeoExt.tree</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/BaseLayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/LayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/LayerLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/LayerNode.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/LayerParamLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/LayerParamNode.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/OverlayLayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/TreeNodeUIEventMixin.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/widgets/tree/WMSCapabilitiesLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></li>
+</ul>
+</li>
+</ul>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/data.html"><tt class="docutils literal"><span class="pre">GeoExt.data</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/AttributeReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/AttributeStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/FeatureReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/FeatureRecord.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/FeatureStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/LayerReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/LayerRecord.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/LayerStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/PrintPage.html"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/PrintProvider.html"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/ProtocolProxy.html"><tt class="docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/ScaleStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WFSCapabilitiesReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WFSCapabilitiesStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WMCReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WMSCapabilitiesReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WMSCapabilitiesStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WMSDescribeLayerReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/data/WMSDescribeLayerStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></li>
+</ul>
+</li>
+</ul>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/plugins.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/AttributeForm.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/PrintExtent.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/PrintPageField.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/PrintProviderField.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/TreeNodeComponent.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></li>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/plugins/TreeNodeRadioButton.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></li>
+</ul>
+</li>
+</ul>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="GeoExt/state.html"><tt class="docutils literal"><span class="pre">GeoExt.state</span></tt></a><ul>
+<li class="toctree-l2"><a class="reference external" href="GeoExt/state/PermalinkProvider.html"><tt class="docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="section" id="overrides">
+<h2>Overrides<a class="headerlink" href="#overrides" title="Permalink to this headline">Â¶</a></h2>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="overrides.html">Ext Overrides</a><ul>
+<li class="toctree-l2"><a class="reference external" href="overrides/override-ext-ajax.html">Ext.Ajax Overrides</a></li>
+</ul>
+</li>
+</ul>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="GeoExt/widgets.html" title="Widgets"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../developer/index.html" title="GeoExt Community Involvement"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">API Reference</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state/PermalinkProvider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state/PermalinkProvider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state/PermalinkProvider.html	(revision 76)
@@ -0,0 +1,205 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.state.PermalinkProvider &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.state" href="../state.html" />
+    <link rel="next" title="Ext Overrides" href="../../overrides.html" />
+    <link rel="prev" title="GeoExt.state" href="../state.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../state.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.state</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../state.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.state</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../../overrides.html"
+                                  title="next chapter">Ext Overrides</a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-state-permalinkprovider">
+<h1><a title="GeoExt.state.PermalinkProvider" class="reference internal" href="#GeoExt.state.PermalinkProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a><a class="headerlink" href="#geoext-state-permalinkprovider" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider">Ext.state.Provider</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.state.PermalinkProvider">
+<em class="property">class </em><tt class="descclassname">GeoExt.state.</tt><tt class="descname">PermalinkProvider</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.state.PermalinkProvider" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a permalink provider.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code displaying a new permalink each time the map is moved.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="c1">// create permalink provider</span>
+<span class="kd">var</span> <span class="nx">permalinkProvider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">PermalinkProvider</span><span class="p">();</span>
+
+<span class="c1">// set it in the state manager</span>
+<span class="nx">Ext</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">Manager</span><span class="p">.</span><span class="nx">setProvider</span><span class="p">(</span><span class="nx">permalinkProvider</span><span class="p">);</span>
+
+<span class="c1">// create a map panel, and make it stateful</span>
+<span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;map&quot;</span><span class="p">,</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span>
+        <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+            <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+            <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+        <span class="p">)</span>
+    <span class="p">],</span>
+    <span class="nx">stateId</span><span class="o">:</span> <span class="s2">&quot;map&quot;</span><span class="p">,</span>
+    <span class="nx">prettyStateKeys</span><span class="o">:</span> <span class="kc">true</span> <span class="c1">// for pretty permalinks</span>
+<span class="p">});</span>
+
+<span class="c1">// display permalink each time state is changed</span>
+<span class="nx">permalinkProvider</span><span class="p">.</span><span class="nx">on</span><span class="p">({</span>
+    <span class="nx">statechanged</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">provider</span><span class="p">,</span> <span class="nx">name</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">alert</span><span class="p">(</span><span class="nx">provider</span><span class="p">.</span><span class="nx">getLink</span><span class="p">());</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider">Ext.state.Provider</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">encodeType</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> Specifies whether type of state values should be encoded
+and decoded. Set it to false if you work with components that don&#8217;t
+require encoding types, and want pretty permalinks. Defaults to true.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.state.Provider">Ext.state.Provider</a>.</p>
+<dl class="method">
+<dt id="GeoExt.state.PermalinkProvider.getLink">
+<tt class="descclassname">PermalinkProvider.</tt><tt class="descname">getLink</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.state.PermalinkProvider.getLink" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>base</em> &#8211; <tt class="docutils literal"><span class="pre">String</span></tt> The base URL, optional.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">String</span></tt> The permalink.</td>
+</tr>
+</tbody>
+</table>
+<p>Return the permalink corresponding to the current state.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../../overrides.html" title="Ext Overrides"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../state.html" title="GeoExt.state"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../state.html" ><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.state</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintPageField.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintPageField.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintPageField.html	(revision 76)
@@ -0,0 +1,201 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.PrintPageField &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.plugins.PrintProviderField" href="PrintProviderField.html" />
+    <link rel="prev" title="GeoExt.plugins.PrintExtent" href="PrintExtent.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintExtent.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintProviderField.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-printpagefield">
+<h1><a title="GeoExt.plugins.PrintPageField" class="reference internal" href="#GeoExt.plugins.PrintPageField"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a><a class="headerlink" href="#geoext-plugins-printpagefield" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_printpagefield</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.plugins.PrintPageField">
+<em class="property">class </em><tt class="descclassname">GeoExt.plugins.</tt><tt class="descname">PrintPageField</tt><a class="headerlink" href="#GeoExt.plugins.PrintPageField" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>A plugin for <tt class="docutils literal"><span class="pre">Ext.form.Field</span></tt> components which provides synchronization
+with a <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a>. The field name has to match the
+respective property of the printPage (e.g. <tt class="docutils literal"><span class="pre">scale</span></tt>, <tt class="docutils literal"><span class="pre">rotation</span></tt>).</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>A form with a combo box for the scale and text fields for rotation and a
+page title. The page title is a custom parameter of the print module&#8217;s
+page configuration:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">printPage</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintPage</span><span class="p">({</span>
+    <span class="nx">printProvider</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintProvider</span><span class="p">({</span>
+        <span class="nx">capabilities</span><span class="o">:</span> <span class="nx">printCapabilities</span>
+    <span class="p">})</span>
+<span class="p">});</span>
+<span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">FormPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;form&quot;</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;combo&quot;</span><span class="p">,</span>
+        <span class="nx">displayField</span><span class="o">:</span> <span class="s2">&quot;name&quot;</span><span class="p">,</span>
+        <span class="nx">store</span><span class="o">:</span> <span class="nx">printPage</span><span class="p">.</span><span class="nx">scales</span><span class="p">,</span> <span class="c1">// printPage.scale</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;scale&quot;</span><span class="p">,</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Scale&quot;</span><span class="p">,</span>
+        <span class="nx">typeAhead</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">mode</span><span class="o">:</span> <span class="s2">&quot;local&quot;</span><span class="p">,</span>
+        <span class="nx">forceSelection</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">triggerAction</span><span class="o">:</span> <span class="s2">&quot;all&quot;</span><span class="p">,</span>
+        <span class="nx">selectOnFocus</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintPageField</span><span class="p">({</span>
+            <span class="nx">printPage</span><span class="o">:</span> <span class="nx">printPage</span>
+        <span class="p">})</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;rotation&quot;</span><span class="p">,</span> <span class="c1">// printPage.rotation</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Rotation&quot;</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintPageField</span><span class="p">({</span>
+            <span class="nx">printPage</span><span class="o">:</span> <span class="nx">printPage</span>
+        <span class="p">})</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;mapTitle&quot;</span><span class="p">,</span> <span class="c1">// printPage.customParams[&quot;mapTitle&quot;]</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Map Title&quot;</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintPageField</span><span class="p">({</span>
+            <span class="nx">printPage</span><span class="o">:</span> <span class="nx">printPage</span>
+        <span class="p">})</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">printPage</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt> The print page to synchronize with.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintProviderField.html" title="GeoExt.plugins.PrintProviderField"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintExtent.html" title="GeoExt.plugins.PrintExtent"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeRadioButton.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeRadioButton.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeRadioButton.html	(revision 76)
@@ -0,0 +1,182 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.TreeNodeRadioButton &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.state" href="../state.html" />
+    <link rel="prev" title="GeoExt.plugins.TreeNodeComponent" href="TreeNodeComponent.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="TreeNodeComponent.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../state.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.state</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-treenoderadiobutton">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt><a class="headerlink" href="#geoext-plugins-treenoderadiobutton" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_treenoderadiobutton</span></tt></dd>
+</dl>
+<p>A plugin to create tree node UIs with radio buttons. Can be plugged into
+any <tt class="docutils literal"><span class="pre">Ext.tree.TreePanel</span></tt> and will be applied to nodes that are extended
+with the <tt class="xref docutils literal"><span class="pre">GeoExt.Tree.TreeNodeUIEventMixin</span></tt>, in particular
+<tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerNodeUI</span></tt> nodes.</p>
+<p>A tree with a <tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt> fires the additional
+<tt class="docutils literal"><span class="pre">radiochange</span></tt> event when a node&#8217;s radio button is clicked.</p>
+<p>Only if a node is configured <tt class="docutils literal"><span class="pre">radioGroup</span></tt> attribute, it will be rendered
+with a radio button next to its icon. The <tt class="docutils literal"><span class="pre">radioGroup</span></tt> works like a
+HTML checkbox with its <tt class="docutils literal"><span class="pre">name</span></tt> attribute, and <tt class="docutils literal"><span class="pre">radioGroup</span></tt> is a string
+that identifies the options group.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a tree with a node that has a radio button:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">UIClass</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUI</span><span class="p">,</span>
+    <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUIEventMixin</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">tree</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreePanel</span><span class="p">({</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="p">[</span>
+        <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">TreeNodeRadioButton</span><span class="p">({</span>
+            <span class="nx">listeners</span><span class="o">:</span> <span class="p">{</span>
+                <span class="s2">&quot;radiochange&quot;</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">node</span><span class="p">)</span> <span class="p">{</span>
+                    <span class="nx">alert</span><span class="p">(</span><span class="nx">node</span><span class="p">.</span><span class="nx">text</span> <span class="o">+</span> <span class="s2">&quot;&#39;s radio button was clicked.&quot;</span><span class="p">);</span>
+                <span class="p">}</span>
+            <span class="p">}</span>
+        <span class="p">})</span>
+    <span class="p">],</span>
+    <span class="nx">root</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">nodeType</span><span class="o">:</span> <span class="s2">&quot;node&quot;</span><span class="p">,</span>
+        <span class="nx">uiProvider</span><span class="o">:</span> <span class="nx">UIClass</span><span class="p">,</span>
+        <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;My Node&quot;</span><span class="p">,</span>
+        <span class="nx">radioGroup</span><span class="o">:</span> <span class="s2">&quot;myGroupId&quot;</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">radiochange</tt></dt>
+<dd><p>Fires when a radio button is clicked.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>node - <tt class="docutils literal"><span class="pre">Ext.TreeNode</span></tt> The node of the clicked radio button.</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../state.html" title="GeoExt.state"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="TreeNodeComponent.html" title="GeoExt.plugins.TreeNodeComponent"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintExtent.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintExtent.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintExtent.html	(revision 76)
@@ -0,0 +1,313 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.PrintExtent &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.plugins.PrintPageField" href="PrintPageField.html" />
+    <link rel="prev" title="GeoExt.plugins.AttributeForm" href="AttributeForm.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="AttributeForm.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintPageField.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-printextent">
+<h1><a title="GeoExt.plugins.PrintExtent" class="reference internal" href="#GeoExt.plugins.PrintExtent"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a><a class="headerlink" href="#geoext-plugins-printextent" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_printextent</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.plugins.PrintExtent">
+<em class="property">class </em><tt class="descclassname">GeoExt.plugins.</tt><tt class="descname">PrintExtent</tt><a class="headerlink" href="#GeoExt.plugins.PrintExtent" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>Provides a way to show and modify the extents of print pages on the map. It
+uses a layer to render the page extent and handle features of print pages,
+and provides a control to modify them. Must be set as a plugin to a
+<a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a MapPanel with a PrintExtent, and print it
+immediately:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">printExtent</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintExtent</span><span class="p">({</span>
+    <span class="nx">printProvider</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintProvider</span><span class="p">({</span>
+        <span class="nx">capabilities</span><span class="o">:</span> <span class="nx">printCapabilities</span>
+    <span class="p">})</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">border</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;div-id&quot;</span><span class="p">,</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span><span class="s2">&quot;Tasmania&quot;</span><span class="p">,</span> <span class="s2">&quot;http://demo.opengeo.org/geoserver/wms&quot;</span><span class="p">,</span>
+        <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;topp:tasmania_state_boundaries&quot;</span><span class="p">},</span> <span class="p">{</span><span class="nx">singleTile</span><span class="o">:</span> <span class="kc">true</span><span class="p">})],</span>
+    <span class="nx">center</span><span class="o">:</span> <span class="p">[</span><span class="mf">146.56</span><span class="p">,</span> <span class="o">-</span><span class="mf">41.56</span><span class="p">],</span>
+    <span class="nx">zoom</span><span class="o">:</span> <span class="mi">6</span><span class="p">,</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="nx">printExtent</span>
+<span class="p">});</span>
+
+<span class="nx">printExtent</span><span class="p">.</span><span class="nx">addPage</span><span class="p">();</span>
+
+<span class="c1">// print the map</span>
+<span class="nx">printExtent</span><span class="p">.</span><span class="nx">print</span><span class="p">();</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> The layer used to render extent and handle
+features to. Optional, will be created if not provided.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">pages</tt></dt>
+<dd><p>Array of <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The pages that this plugin
+controls. Optional. If not provided, it will be created with one page
+that is completely contained within the visible map extent.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">All pages must use the same PrintProvider.</p>
+</div>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">printProvider</tt></dt>
+<dd><a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> The print provider this form
+is connected to. Optional if pages are provided.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties.</p>
+<dl class="attribute">
+<dt id="GeoExt.plugins.PrintExtent.page">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">page</tt><a class="headerlink" href="#GeoExt.plugins.PrintExtent.page" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The page currently set for
+transformation.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.plugins.PrintExtent.pages">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">pages</tt><a class="headerlink" href="#GeoExt.plugins.PrintExtent.pages" title="Permalink to this definition">Â¶</a></dt>
+<dd>Array of <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The pages that this component
+controls. Read-only.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.plugins.PrintExtent.printProvider">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">printProvider</tt><a class="headerlink" href="#GeoExt.plugins.PrintExtent.printProvider" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> The print provider this form
+is connected to. Read-only.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods.</p>
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.addPage">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">addPage</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.addPage" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>page</em> &#8211; <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The page to add
+to this plugin. If not provided, a page that fits the current
+extent is created.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body">page :class:<tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Adds a page to the list of pages that this plugin controls.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.hide">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">hide</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.hide" title="Permalink to this definition">Â¶</a></dt>
+<dd>Tear downs the plugin, removing the
+<tt class="docutils literal"><span class="pre">OpenLayers.Control.TransformFeature</span></tt> control and
+the <tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> layer.</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.print">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">print</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.print" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Options to send to the PrintProvider&#8217;s
+print method. See <a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> :: <tt class="docutils literal"><span class="pre">print</span></tt>.</td>
+</tr>
+</tbody>
+</table>
+<p>Prints all pages as shown on the map.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.removePage">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">removePage</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.removePage" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>page</em> &#8211; <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The page to remove
+from this plugin.</td>
+</tr>
+</tbody>
+</table>
+<p>Removes a page from the list of pages that this plugin controls.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.selectPage">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">selectPage</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.selectPage" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>page</em> &#8211; <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> The page to select</td>
+</tr>
+</tbody>
+</table>
+<p>Selects the given page (ie. calls the setFeature on the modify feature
+control)</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.plugins.PrintExtent.show">
+<tt class="descclassname">PrintExtent.</tt><tt class="descname">show</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.plugins.PrintExtent.show" title="Permalink to this definition">Â¶</a></dt>
+<dd>Sets up the plugin, initializing the <tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt>
+layer and <tt class="docutils literal"><span class="pre">OpenLayers.Control.TransformFeature</span></tt>, and centering
+the first page if no pages were specified in the configuration.</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">selectpage</tt></dt>
+<dd><p>Triggered when a page has been selected using the control</p>
+<p>Listener arguments:
+* printPage - <a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> this printPage</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintPageField.html" title="GeoExt.plugins.PrintPageField"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="AttributeForm.html" title="GeoExt.plugins.AttributeForm"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/AttributeForm.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/AttributeForm.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/AttributeForm.html	(revision 76)
@@ -0,0 +1,180 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.AttributeForm &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.plugins.PrintExtent" href="PrintExtent.html" />
+    <link rel="prev" title="GeoExt.plugins" href="../plugins.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../plugins.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintExtent.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-attributeform">
+<h1><a title="GeoExt.plugins.AttributeForm" class="reference internal" href="#GeoExt.plugins.AttributeForm"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a><a class="headerlink" href="#geoext-plugins-attributeform" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_attributeform</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.plugins.AttributeForm">
+<em class="property">class </em><tt class="descclassname">GeoExt.plugins.</tt><tt class="descname">AttributeForm</tt><a class="headerlink" href="#GeoExt.plugins.AttributeForm" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>This plugin allows creating form items from attribute records
+and fill a form panel with these items.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code showing how to use an Ext form panel as a feature
+attribute form (for editing features for example).</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">formPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">FormPanel</span><span class="p">({</span>
+    <span class="nx">autoScroll</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">350</span><span class="p">,</span>
+    <span class="nx">defaults</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">maxLengthText</span><span class="o">:</span> <span class="s2">&quot;too long&quot;</span><span class="p">,</span>
+        <span class="nx">minLengthText</span><span class="o">:</span> <span class="s2">&quot;too short&quot;</span>
+    <span class="p">}</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="p">[</span>
+        <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">AttributeForm</span><span class="p">({</span>
+            <span class="nx">attributeStore</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">AttributeStore</span><span class="p">({</span>
+                <span class="nx">url</span><span class="o">:</span> <span class="s2">&quot;http://some.wfs&quot;</span><span class="p">,</span>
+                <span class="nx">baseParams</span><span class="o">:</span> <span class="p">{</span>
+                    <span class="s2">&quot;SERVICE&quot;</span><span class="o">:</span> <span class="s2">&quot;WFS&quot;</span><span class="p">,</span>
+                    <span class="s2">&quot;VERSION&quot;</span><span class="o">:</span> <span class="s2">&quot;1.1.0&quot;</span><span class="p">,</span>
+                    <span class="s2">&quot;REQUEST&quot;</span><span class="o">:</span> <span class="s2">&quot;DescribeFeatureType&quot;</span><span class="p">,</span>
+                    <span class="s2">&quot;TYPENAME&quot;</span><span class="o">:</span> <span class="s2">&quot;the_typename&quot;</span>
+                <span class="p">}</span>
+            <span class="p">})</span>
+        <span class="p">})</span>
+    <span class="p">]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">attributeStore</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.Store</span></tt> The attribute store to bind to this plugin.
+It can be any Ext store configured with a
+<a title="GeoExt.data.AttributeReader" class="reference external" href="../data/AttributeReader.html#GeoExt.data.AttributeReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a>. If set form items
+will be created from the attribute records in the form. In
+most cases this store will be a <a title="GeoExt.data.AttributeStore" class="reference external" href="../data/AttributeStore.html#GeoExt.data.AttributeStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a>.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintExtent.html" title="GeoExt.plugins.PrintExtent"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../plugins.html" title="GeoExt.plugins"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeComponent.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeComponent.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/TreeNodeComponent.html	(revision 76)
@@ -0,0 +1,176 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.TreeNodeComponent &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.plugins.TreeNodeRadioButton" href="TreeNodeRadioButton.html" />
+    <link rel="prev" title="GeoExt.plugins.PrintProviderField" href="PrintProviderField.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintProviderField.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="TreeNodeRadioButton.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-treenodecomponent">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt><a class="headerlink" href="#geoext-plugins-treenodecomponent" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_TreeNodeComponent</span></tt></dd>
+</dl>
+<p>A plugin to create tree node UIs that can have an Ext.Component below the
+node&#8217;s title. Can be plugged into any <tt class="docutils literal"><span class="pre">Ext.tree.TreePanel</span></tt> and will be
+applied to nodes that are extended with the
+<tt class="xref docutils literal"><span class="pre">GeoExt.Tree.TreeNodeUIEventMixin</span></tt>.</p>
+<p>If a node is configured with a <tt class="docutils literal"><span class="pre">component</span></tt> attribute, it will be rendered
+with the component in addition to icon and title.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a tree with a node that has a component:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">uiClass</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUI</span><span class="p">,</span>
+    <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUIEventMixin</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">tree</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreePanel</span><span class="p">({</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="p">[</span>
+        <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">TreeNodeRadioButton</span><span class="p">({</span>
+            <span class="nx">listeners</span><span class="o">:</span> <span class="p">{</span>
+                <span class="s2">&quot;radiochange&quot;</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">node</span><span class="p">)</span> <span class="p">{</span>
+                    <span class="nx">alert</span><span class="p">(</span><span class="nx">node</span><span class="p">.</span><span class="nx">text</span> <span class="o">+</span> <span class="s2">&quot;&#39;s radio button was clicked.&quot;</span><span class="p">);</span>
+                <span class="p">}</span>
+            <span class="p">}</span>
+        <span class="p">})</span>
+    <span class="p">],</span>
+    <span class="nx">root</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">nodeType</span><span class="o">:</span> <span class="s2">&quot;node&quot;</span><span class="p">,</span>
+        <span class="nx">uiProvider</span><span class="o">:</span> <span class="nx">uiClass</span><span class="p">,</span>
+        <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;My Node&quot;</span><span class="p">,</span>
+        <span class="nx">component</span><span class="o">:</span> <span class="p">{</span>
+            <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;box&quot;</span><span class="p">,</span>
+            <span class="nx">autoEl</span><span class="o">:</span> <span class="p">{</span>
+                <span class="nx">tag</span><span class="o">:</span> <span class="s2">&quot;img&quot;</span><span class="p">,</span>
+                <span class="nx">src</span><span class="o">:</span> <span class="s2">&quot;/images/my-image.jpg&quot;</span>
+            <span class="p">}</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+</pre></div>
+</div>
+<p>Sample code to create a layer node UI with a radio button:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">uiClass</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span>
+    <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">LayerNodeUI</span><span class="p">,</span>
+    <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUIEventMixin</span>
+<span class="p">);</span>
+</pre></div>
+</div>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="TreeNodeRadioButton.html" title="GeoExt.plugins.TreeNodeRadioButton"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintProviderField.html" title="GeoExt.plugins.PrintProviderField"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintProviderField.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintProviderField.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins/PrintProviderField.html	(revision 76)
@@ -0,0 +1,206 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins.PrintProviderField &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="next" title="GeoExt.plugins.TreeNodeComponent" href="TreeNodeComponent.html" />
+    <link rel="prev" title="GeoExt.plugins.PrintPageField" href="PrintPageField.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintPageField.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="TreeNodeComponent.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins-printproviderfield">
+<h1><a title="GeoExt.plugins.PrintProviderField" class="reference internal" href="#GeoExt.plugins.PrintProviderField"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a><a class="headerlink" href="#geoext-plugins-printproviderfield" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+<dt>ptype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_printproviderfield</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.plugins.PrintProviderField">
+<em class="property">class </em><tt class="descclassname">GeoExt.plugins.</tt><tt class="descname">PrintProviderField</tt><a class="headerlink" href="#GeoExt.plugins.PrintProviderField" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>A plugin for <tt class="docutils literal"><span class="pre">Ext.form.Field</span></tt> components which provides synchronization
+with a <a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a>.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>A form with combo boxes for layout and resolution, and a text field for a
+map title. The latter is a custom parameter to the print module, which is
+a default for all print pages. For setting custom parameters on the page
+level, use <a title="GeoExt.plugins.PrintPageField" class="reference external" href="PrintPageField.html#GeoExt.plugins.PrintPageField"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a>):</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">printProvider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintProvider</span><span class="p">({</span>
+    <span class="nx">capabilities</span><span class="o">:</span> <span class="nx">printCapabilities</span>
+<span class="p">});</span>
+<span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">FormPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;form&quot;</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;combo&quot;</span><span class="p">,</span>
+        <span class="nx">displayField</span><span class="o">:</span> <span class="s2">&quot;name&quot;</span><span class="p">,</span>
+        <span class="nx">store</span><span class="o">:</span> <span class="nx">printProvider</span><span class="p">.</span><span class="nx">layouts</span><span class="p">,</span> <span class="c1">// printProvider.layout</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Layout&quot;</span><span class="p">,</span>
+        <span class="nx">typeAhead</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">mode</span><span class="o">:</span> <span class="s2">&quot;local&quot;</span><span class="p">,</span>
+        <span class="nx">forceSelection</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">triggerAction</span><span class="o">:</span> <span class="s2">&quot;all&quot;</span><span class="p">,</span>
+        <span class="nx">selectOnFocus</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintProviderField</span><span class="p">({</span>
+            <span class="nx">printProvider</span><span class="o">:</span> <span class="nx">printProvider</span>
+        <span class="p">})</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;combo&quot;</span><span class="p">,</span>
+        <span class="nx">displayField</span><span class="o">:</span> <span class="s2">&quot;name&quot;</span><span class="p">,</span>
+        <span class="nx">store</span><span class="o">:</span> <span class="nx">printProvider</span><span class="p">.</span><span class="nx">dpis</span><span class="p">,</span> <span class="c1">// printProvider.dpi</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Resolution&quot;</span><span class="p">,</span>
+        <span class="nx">typeAhead</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">mode</span><span class="o">:</span> <span class="s2">&quot;local&quot;</span><span class="p">,</span>
+        <span class="nx">forceSelection</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">triggerAction</span><span class="o">:</span> <span class="s2">&quot;all&quot;</span><span class="p">,</span>
+        <span class="nx">selectOnFocus</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintProviderField</span><span class="p">({</span>
+            <span class="nx">printProvider</span><span class="o">:</span> <span class="nx">printProvider</span>
+        <span class="p">})</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;mapTitle&quot;</span><span class="p">,</span> <span class="c1">// printProvider.customParams.mapTitle</span>
+        <span class="nx">fieldLabel</span><span class="o">:</span> <span class="s2">&quot;Map Title&quot;</span><span class="p">,</span>
+        <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">plugins</span><span class="p">.</span><span class="nx">PrintProviderField</span><span class="p">({</span>
+            <span class="nx">printProvider</span><span class="o">:</span> <span class="nx">printProvider</span>
+        <span class="p">})</span>
+    <span class="p">}]</span>
+<span class="p">})</span><span class="o">:</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">printProvider</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt> The print provider to use with this
+plugin&#8217;s field. Not required if set on the owner container of the
+field.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="TreeNodeComponent.html" title="GeoExt.plugins.TreeNodeComponent"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintPageField.html" title="GeoExt.plugins.PrintPageField"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../plugins.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/state.html	(revision 76)
@@ -0,0 +1,121 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.state &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../index.html" />
+    <link rel="up" title="API Reference" href="../index.html" />
+    <link rel="next" title="GeoExt.state.PermalinkProvider" href="state/PermalinkProvider.html" />
+    <link rel="prev" title="GeoExt.plugins.TreeNodeRadioButton" href="plugins/TreeNodeRadioButton.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../docs.html">Documentation</a></li>
+                <li><a href="../../examples.html">Examples</a></li>
+                <li><a href="../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" accesskey="U">API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.state</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="plugins/TreeNodeRadioButton.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="state/PermalinkProvider.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-state">
+<span id="module-GeoExt.state"></span><h1><tt class="xref docutils literal"><span class="pre">GeoExt.state</span></tt><a class="headerlink" href="#geoext-state" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.state</span></tt> module provides functionality relating to <tt class="docutils literal"><span class="pre">Ext.state</span></tt>, i.e.
+for saving and restoring component states to and from a state provider.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="state/PermalinkProvider.html"><tt class="docutils literal"><span class="pre">GeoExt.state.PermalinkProvider</span></tt></a></li>
+</ul>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="state/PermalinkProvider.html" title="GeoExt.state.PermalinkProvider"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="plugins/TreeNodeRadioButton.html" title="GeoExt.plugins.TreeNodeRadioButton"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.state</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/plugins.html	(revision 76)
@@ -0,0 +1,127 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.plugins &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../index.html" />
+    <link rel="up" title="API Reference" href="../index.html" />
+    <link rel="next" title="GeoExt.plugins.AttributeForm" href="plugins/AttributeForm.html" />
+    <link rel="prev" title="GeoExt.data.WMSDescribeLayerStore" href="data/WMSDescribeLayerStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../docs.html">Documentation</a></li>
+                <li><a href="../../examples.html">Examples</a></li>
+                <li><a href="../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" accesskey="U">API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="data/WMSDescribeLayerStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="plugins/AttributeForm.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-plugins">
+<span id="module-GeoExt.plugins"></span><h1><tt class="xref docutils literal"><span class="pre">GeoExt.plugins</span></tt><a class="headerlink" href="#geoext-plugins" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.plugins</span></tt> module contains classes that add functionality to
+GeoExt components like <a title="GeoExt.MapPanel" class="reference external" href="widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>, or connect form fields to
+<a title="A collection of map data related classes." class="reference external" href="data.html#module-GeoExt.data"><tt class="xref docutils literal"><span class="pre">GeoExt.data</span></tt></a> classes.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="plugins/AttributeForm.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.AttributeForm</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="plugins/PrintExtent.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintExtent</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="plugins/PrintPageField.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="plugins/PrintProviderField.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.PrintProviderField</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="plugins/TreeNodeComponent.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeComponent</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="plugins/TreeNodeRadioButton.html"><tt class="docutils literal"><span class="pre">GeoExt.plugins.TreeNodeRadioButton</span></tt></a></li>
+</ul>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="plugins/AttributeForm.html" title="GeoExt.plugins.AttributeForm"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="data/WMSDescribeLayerStore.html" title="GeoExt.data.WMSDescribeLayerStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.plugins</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/SliderTip.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/SliderTip.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/SliderTip.html	(revision 76)
@@ -0,0 +1,175 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.SliderTip &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.ZoomSliderTip" href="ZoomSliderTip.html" />
+    <link rel="prev" title="GeoExt.LayerOpacitySliderTip" href="LayerOpacitySliderTip.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerOpacitySliderTip.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="ZoomSliderTip.html"
+                                  title="next chapter"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-slidertip">
+<h1><a title="GeoExt.SliderTip" class="reference internal" href="#GeoExt.SliderTip"><tt class="xref docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a><a class="headerlink" href="#geoext-slidertip" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.slider.Tip">Ext.Tip</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.SliderTip">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">SliderTip</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.SliderTip" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a slider tip displaying <tt class="docutils literal"><span class="pre">Ext.Slider</span></tt> values over slider thumbs.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a slider tip to display slider value on hover:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">slider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Slider</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">SliderTip</span><span class="p">()</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.slider.Tip">Ext.Tip</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">hover</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Display the tip when hovering over the thumb.  If <tt class="docutils literal"><span class="pre">false</span></tt>, tip will
+only be displayed while dragging.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">minWidth</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>
+Minimum width of the tip.  Default is 10.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">offsets</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(Number)</span></tt>
+A two item list that provides x, y offsets for the tip.  Default is
+[0, -10].</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="ZoomSliderTip.html" title="GeoExt.ZoomSliderTip"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerOpacitySliderTip.html" title="GeoExt.LayerOpacitySliderTip"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/ZoomSliderTip.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/ZoomSliderTip.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/ZoomSliderTip.html	(revision 76)
@@ -0,0 +1,192 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.ZoomSliderTip &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.form.BasicForm" href="../form/BasicForm.html" />
+    <link rel="prev" title="GeoExt.SliderTip" href="SliderTip.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="SliderTip.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../form/BasicForm.html"
+                                  title="next chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-zoomslidertip">
+<h1><a title="GeoExt.ZoomSliderTip" class="reference internal" href="#GeoExt.ZoomSliderTip"><tt class="xref docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a><a class="headerlink" href="#geoext-zoomslidertip" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip">Ext.Tip</a></li>
+<li><a title="GeoExt.SliderTip" class="reference external" href="SliderTip.html#GeoExt.SliderTip"><tt class="xref docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.ZoomSliderTip">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">ZoomSliderTip</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.ZoomSliderTip" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a slider tip displaying <a title="GeoExt.ZoomSlider" class="reference external" href="../ZoomSlider.html#GeoExt.ZoomSlider"><tt class="xref docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a> values.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a slider tip to display scale and resolution:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">slider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">ZoomSlider</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">ZoomSliderTip</span><span class="p">({</span>
+        <span class="nx">template</span><span class="o">:</span> <span class="s2">&quot;Scale: 1 : {scale}&lt;br&gt;Resolution: {resolution}&quot;</span>
+    <span class="p">})</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip">Ext.Tip</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">hover</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Display the tip when hovering over the thumb.  If <tt class="docutils literal"><span class="pre">false</span></tt>, tip will
+only be displayed while dragging.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">minWidth</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>
+Minimum width of the tip.  Default is 10.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">offsets</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(Number)</span></tt>
+A two item list that provides x, y offsets for the tip.  Default is
+[0, -10].</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">template</tt></dt>
+<dd><p><tt class="docutils literal"><span class="pre">String</span></tt>
+Template for the tip. Can be customized using the following keywords in
+curly braces:</p>
+<ul class="simple">
+<li><tt class="docutils literal"><span class="pre">zoom</span></tt> - the zoom level</li>
+<li><tt class="docutils literal"><span class="pre">resolution</span></tt> - the resolution</li>
+<li><tt class="docutils literal"><span class="pre">scale</span></tt> - the scale denominator</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../form/BasicForm.html" title="GeoExt.form.BasicForm"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="SliderTip.html" title="GeoExt.SliderTip"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tips/LayerOpacitySliderTip.html	(revision 76)
@@ -0,0 +1,190 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.LayerOpacitySliderTip &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.SliderTip" href="SliderTip.html" />
+    <link rel="prev" title="GeoExt.ZoomSlider" href="../ZoomSlider.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../ZoomSlider.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="SliderTip.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-layeropacityslidertip">
+<h1><a title="GeoExt.LayerOpacitySliderTip" class="reference internal" href="#GeoExt.LayerOpacitySliderTip"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a><a class="headerlink" href="#geoext-layeropacityslidertip" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip">Ext.Tip</a></li>
+<li><a title="GeoExt.SliderTip" class="reference external" href="SliderTip.html#GeoExt.SliderTip"><tt class="xref docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.LayerOpacitySliderTip">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">LayerOpacitySliderTip</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.LayerOpacitySliderTip" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a slider tip displaying <a title="GeoExt.LayerOpacitySlider" class="reference external" href="../LayerOpacitySlider.html#GeoExt.LayerOpacitySlider"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a> values.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a slider tip to display scale and resolution:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">slider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">LayerOpacitySlider</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">layer</span><span class="o">:</span> <span class="nx">layer</span><span class="p">,</span>
+    <span class="nx">plugins</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">LayerOpacitySliderTip</span><span class="p">({</span>
+        <span class="nx">template</span><span class="o">:</span> <span class="s2">&quot;Opacity: {opacity}%&quot;</span>
+    <span class="p">})</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Tip">Ext.Tip</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">hover</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Display the tip when hovering over the thumb.  If <tt class="docutils literal"><span class="pre">false</span></tt>, tip will
+only be displayed while dragging.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">minWidth</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>
+Minimum width of the tip.  Default is 10.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">offsets</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(Number)</span></tt>
+A two item list that provides x, y offsets for the tip.  Default is
+[0, -10].</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">template</tt></dt>
+<dd><p><tt class="docutils literal"><span class="pre">String</span></tt>
+Template for the tip. Can be customized using the following keywords in
+curly braces:</p>
+<ul class="simple">
+<li><tt class="docutils literal"><span class="pre">opacity</span></tt> - the opacity value in percent.</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="SliderTip.html" title="GeoExt.SliderTip"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../ZoomSlider.html" title="GeoExt.ZoomSlider"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Action.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Action.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Action.html	(revision 76)
@@ -0,0 +1,172 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.Action &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.FeatureRenderer" href="FeatureRenderer.html" />
+    <link rel="prev" title="Widgets" href="../widgets.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.Action</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.Action</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../widgets.html"
+                                  title="previous chapter">Widgets</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="FeatureRenderer.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-action">
+<h1><a title="GeoExt.Action" class="reference internal" href="#GeoExt.Action"><tt class="xref docutils literal"><span class="pre">GeoExt.Action</span></tt></a><a class="headerlink" href="#geoext-action" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Action">Ext.Action</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.Action">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">Action</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.Action" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a GeoExt.Action instance. A GeoExt.Action is created
+to insert an OpenLayers control in a toolbar as a button or
+in a menu as a menu item. A GeoExt.Action instance can be
+used like a regular Ext.Action, look at the Ext.Action API
+doc for more detail.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a toolbar with an OpenLayers control into it.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">action</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">Action</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;max extent&quot;</span><span class="p">,</span>
+    <span class="nx">control</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">ZoomToMaxExtent</span><span class="p">(),</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span>
+<span class="p">});</span>
+<span class="kd">var</span> <span class="nx">toolbar</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Toolbar</span><span class="p">([</span><span class="nx">action</span><span class="p">]);</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Action">Ext.Action</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">control</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Control</span></tt> The OpenLayers control wrapped in this action.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> The OpenLayers map that the control should be added
+to.  For controls that don&#8217;t need to be added to a map or have already
+been added to one, this config property may be omitted.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="FeatureRenderer.html" title="GeoExt.FeatureRenderer"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../widgets.html" title="Widgets"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.Action</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendPanel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendPanel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendPanel.html	(revision 76)
@@ -0,0 +1,181 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.LegendPanel &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.MapPanel" href="MapPanel.html" />
+    <link rel="prev" title="GeoExt.LegendImage" href="LegendImage.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LegendImage.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="MapPanel.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-legendpanel">
+<h1><a title="GeoExt.LegendPanel" class="reference internal" href="#GeoExt.LegendPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a><a class="headerlink" href="#geoext-legendpanel" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_legendpanel</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.LegendPanel">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">LegendPanel</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.LegendPanel" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>A panel showing legends of all layers in a layer store.
+Depending on the layer type, a legend renderer will be chosen.</p>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">dynamic</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+If false the LegendPanel will not listen to the add, remove and change
+events of the LayerStore. So it will load with the initial state of
+the LayerStore and not change anymore.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">filter</tt></dt>
+<dd><p><tt class="docutils literal"><span class="pre">Function</span></tt>
+A function, called in the scope of the legend panel, with a layer record
+as argument. Is expected to return true for layers to be displayed, false
+otherwise. By default, all layers will be displayed.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">filter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">record</span><span class="p">.</span><span class="nx">getLayer</span><span class="p">().</span><span class="nx">isBaseLayer</span><span class="p">;</span>
+<span class="p">}</span>
+</pre></div>
+</div>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt>
+The layer store containing layers to be displayed in the legend
+container. If not provided it will be taken from the MapPanel.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">preferredTypes</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(String)</span></tt> An array of preferred legend types.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="MapPanel.html" title="GeoExt.MapPanel"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LegendImage.html" title="GeoExt.LegendImage"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/UrlLegend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/UrlLegend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/UrlLegend.html	(revision 76)
@@ -0,0 +1,172 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.UrlLegend &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.VectorLegend" href="VectorLegend.html" />
+    <link rel="prev" title="GeoExt.PrintMapPanel" href="PrintMapPanel.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintMapPanel.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="VectorLegend.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-urllegend">
+<h1><a title="GeoExt.UrlLegend" class="reference internal" href="#GeoExt.UrlLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a><a class="headerlink" href="#geoext-urllegend" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a></li>
+<li><a title="GeoExt.LayerLegend" class="reference external" href="LayerLegend.html#GeoExt.LayerLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_urllegend</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.UrlLegend">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">UrlLegend</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.UrlLegend" title="Permalink to this definition">Â¶</a></dt>
+<dd>Show a legend image in a BoxComponent and make sure load errors are
+dealt with.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">labelCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional css class to use for the layer title labels.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerRecord</tt></dt>
+<dd><a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>  The layer record for the legend</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">legendTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional title to be displayed instead of the layer title.  If this is
+set, the value of <tt class="docutils literal"><span class="pre">showTitle</span></tt> will be ignored (assumed to be true).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">showTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Whether or not to show the title of a layer. This can be overridden
+on the LayerStore record using the hideTitle property.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="VectorLegend.html" title="GeoExt.VectorLegend"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintMapPanel.html" title="GeoExt.PrintMapPanel"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/VectorLegend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/VectorLegend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/VectorLegend.html	(revision 76)
@@ -0,0 +1,354 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.VectorLegend &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.WMSLegend" href="WMSLegend.html" />
+    <link rel="prev" title="GeoExt.UrlLegend" href="UrlLegend.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="UrlLegend.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSLegend.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-vectorlegend">
+<h1><a title="GeoExt.VectorLegend" class="reference internal" href="#GeoExt.VectorLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a><a class="headerlink" href="#geoext-vectorlegend" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a></li>
+<li><a title="GeoExt.LayerLegend" class="reference external" href="LayerLegend.html#GeoExt.LayerLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_vectorlegend</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.VectorLegend">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">VectorLegend</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.VectorLegend" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a vector legend.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">bodyBorder</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Show a border around the legend panel. Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">clickableSymbol</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Set cursor style to &#8220;pointer&#8221; for symbolizers.  Register for
+the <tt class="docutils literal"><span class="pre">symbolclick</span></tt> event to handle clicks.  Note that click events
+are fired regardless of this value.  If <tt class="docutils literal"><span class="pre">false</span></tt>, no cursor style will
+be set.  Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">clickableTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Set cursor style to &#8220;pointer&#8221; for rule titles.  Register for
+the <tt class="docutils literal"><span class="pre">titleclick</span></tt> event to handle clicks.  Note that click events
+are fired regardless of this value.  If <tt class="docutils literal"><span class="pre">false</span></tt>, no cursor style will
+be set.  Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">enableDD</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Allow drag and drop of rules. Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">labelCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional css class to use for the layer title labels.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt>
+The layer that this legend will be based on.  One of <tt class="docutils literal"><span class="pre">layer</span></tt>,
+<tt class="docutils literal"><span class="pre">rules</span></tt>, or <tt class="docutils literal"><span class="pre">layerRecord</span></tt> must be specified in the config.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerRecord</tt></dt>
+<dd><a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>
+The record containing a vector layer that this legend will be based on.
+One of <tt class="docutils literal"><span class="pre">layerRecord</span></tt>, <tt class="docutils literal"><span class="pre">layer</span></tt>,  or <tt class="docutils literal"><span class="pre">rules</span></tt> must be specified in
+the config.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">legendTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional title to be displayed instead of the layer title.  If this is
+set, the value of <tt class="docutils literal"><span class="pre">showTitle</span></tt> will be ignored (assumed to be true).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">rules</tt></dt>
+<dd><dl class="docutils">
+<dt><tt class="docutils literal"><span class="pre">Array(OpenLayers.Rule)</span></tt></dt>
+<dd>List of rules.  One of <tt class="docutils literal"><span class="pre">rules</span></tt>, <tt class="docutils literal"><span class="pre">layer</span></tt>, or <tt class="docutils literal"><span class="pre">layerRecord</span></tt> must be
+specified in the config.  The <tt class="docutils literal"><span class="pre">symbolType</span></tt> property must also be
+provided if only <tt class="docutils literal"><span class="pre">rules</span></tt> are given in the config.</dd>
+</dl>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">selectOnClick</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Set to true if a rule should be selected by clicking on the
+symbol or title. Selection will trigger the ruleselected event, and
+a click on a selected rule will unselect it and trigger the
+<tt class="docutils literal"><span class="pre">ruleunselected</span></tt> event. Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">showTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Whether or not to show the title of a layer. This can be overridden
+on the LayerStore record using the hideTitle property.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">symbolType</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+The symbol type for legend swatches.  Must be one of <tt class="docutils literal"><span class="pre">&quot;Point&quot;</span></tt>,
+<tt class="docutils literal"><span class="pre">&quot;Line&quot;</span></tt>, or <tt class="docutils literal"><span class="pre">&quot;Polygon&quot;</span></tt>.  If not provided, the <tt class="docutils literal"><span class="pre">layer</span></tt> or
+<tt class="docutils literal"><span class="pre">layerRecord</span></tt> config property must be specified, and the geometry type
+of the first feature found on the layer will be used. If a rule does
+not have a symbolizer for <tt class="docutils literal"><span class="pre">symbolType</span></tt>, we look at the symbolizers
+for the rule, and see if it has a <tt class="docutils literal"><span class="pre">&quot;Point&quot;</span></tt>, <tt class="docutils literal"><span class="pre">&quot;Line&quot;</span></tt> or
+<tt class="docutils literal"><span class="pre">&quot;Polygon&quot;</span></tt> symbolizer, which we use for rendering a swatch of the
+respective geometry type.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">untitledPrefix</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+The prefix to use as a title for rules with no title or
+name.  Default is <tt class="docutils literal"><span class="pre">&quot;Untitled</span> <span class="pre">&quot;</span></tt>.  Prefix will be appended with a
+number that corresponds to the index of the rule (1 for first rule).</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="method">
+<dt id="GeoExt.VectorLegend.setCurrentScaleDenominator">
+<tt class="descclassname">VectorLegend.</tt><tt class="descname">setCurrentScaleDenominator</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.VectorLegend.setCurrentScaleDenominator" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>scale</em> &#8211; <tt class="docutils literal"><span class="pre">Number</span></tt> The scale denominator.</td>
+</tr>
+</tbody>
+</table>
+<p>Set the current scale denominator.  This will hide entries for any
+rules that don&#8217;t apply at the current scale.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.VectorLegend.update">
+<tt class="descclassname">VectorLegend.</tt><tt class="descname">update</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.VectorLegend.update" title="Permalink to this definition">Â¶</a></dt>
+<dd>Update rule titles and symbolizers.</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">ruleclick</tt></dt>
+<dd><p>Fires when a rule entry is clicked (fired with symbolizer or
+title click).</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule that was clicked.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">rulemoved</tt></dt>
+<dd><p>Fires when a rule is moved.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule that was moved.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">ruleselected</tt></dt>
+<dd><p>Fires when a rule is clicked and <tt class="docutils literal"><span class="pre">selectOnClick</span></tt> is set to
+<tt class="docutils literal"><span class="pre">true</span></tt>.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule that was selected.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">ruleunselected</tt></dt>
+<dd><p>Fires when the selected rule is clicked and <tt class="docutils literal"><span class="pre">selectOnClick</span></tt>
+is set to <tt class="docutils literal"><span class="pre">true</span></tt>, or when a rule is unselected by selecting a
+different one.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule that was unselected.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">symbolclick</tt></dt>
+<dd><p>Fires when a rule symbolizer is clicked.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule whose symbol was clicked.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">titleclick</tt></dt>
+<dd><p>Fires when a rule title is clicked.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>comp - <tt class="xref docutils literal"><span class="pre">GeoExt.VectorLegend`</span></tt> This component.</li>
+<li>rule - <tt class="docutils literal"><span class="pre">OpenLayers.Rule</span></tt> The rule whose title was clicked.</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSLegend.html" title="GeoExt.WMSLegend"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="UrlLegend.html" title="GeoExt.UrlLegend"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/FeatureRenderer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/FeatureRenderer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/FeatureRenderer.html	(revision 76)
@@ -0,0 +1,288 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.FeatureRenderer &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.LayerLegend" href="LayerLegend.html" />
+    <link rel="prev" title="GeoExt.Action" href="Action.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="Action.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.Action</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerLegend.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-featurerenderer">
+<h1><a title="GeoExt.FeatureRenderer" class="reference internal" href="#GeoExt.FeatureRenderer"><tt class="xref docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a><a class="headerlink" href="#geoext-featurerenderer" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_renderer</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.FeatureRenderer">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">FeatureRenderer</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.FeatureRenderer" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a box component for rendering a vector feature.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">feature</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt>
+Optional vector to be drawn.  If not provided, and if <tt class="docutils literal"><span class="pre">symbolizers</span></tt>
+is configured with an array of plain symbolizer objects, <tt class="docutils literal"><span class="pre">symbolType</span></tt>
+should be configured.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">symbolizers</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(Object)</span></tt>
+An array of <tt class="docutils literal"><span class="pre">OpenLayers.Symbolizer</span></tt> instances or plain symbolizer
+objects (in painters order) for rendering a  feature.  If no
+symbolizers are provided, the OpenLayers default will be used. If a
+symbolizer is an instance of <tt class="docutils literal"><span class="pre">OpenLayers.Symbolizer</span></tt>, its type will
+override the symbolType for rendering.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">symbolType</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+One of <tt class="docutils literal"><span class="pre">&quot;Point&quot;</span></tt>, <tt class="docutils literal"><span class="pre">&quot;Line&quot;</span></tt>, or <tt class="docutils literal"><span class="pre">&quot;Polygon&quot;</span></tt>.  Only pertinent if
+OpenLayers.Symbolizer objects are not used.  If <tt class="docutils literal"><span class="pre">feature</span></tt>
+is provided, it will be preferred.  The default is &#8220;Polygon&#8221;.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a>.</p>
+<dl class="method">
+<dt id="GeoExt.FeatureRenderer.setFeature">
+<tt class="descclassname">FeatureRenderer.</tt><tt class="descname">setFeature</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.FeatureRenderer.setFeature" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>feature</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt> The feature to be rendered.
+If none is provided, one will be created based on <tt class="docutils literal"><span class="pre">symbolType</span></tt>.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt></li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Update the feature and redraw.</p>
+<p>Valid options:</p>
+<ul class="simple">
+<li>draw - <tt class="docutils literal"><span class="pre">Boolean</span></tt> Draw the feature after setting it.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</li>
+</ul>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.FeatureRenderer.setSymbolizers">
+<tt class="descclassname">FeatureRenderer.</tt><tt class="descname">setSymbolizers</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.FeatureRenderer.setSymbolizers" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>symbolizers</em> &#8211; <tt class="docutils literal"><span class="pre">Array(Object)</span></tt> An array of symbolizers</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt></li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Update the symbolizers used to render the feature.</p>
+<p>Valid options:</p>
+<ul class="simple">
+<li>draw - <tt class="docutils literal"><span class="pre">Boolean</span></tt> Draw the feature after setting it.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</li>
+</ul>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.FeatureRenderer.setSymbolType">
+<tt class="descclassname">FeatureRenderer.</tt><tt class="descname">setSymbolType</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.FeatureRenderer.setSymbolType" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>type</em> &#8211; <tt class="docutils literal"><span class="pre">String</span></tt> One of the <tt class="docutils literal"><span class="pre">symbolType</span></tt> strings.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt></li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Create a new feature based on the geometry type and render it.</p>
+<p>Valid options:</p>
+<ul class="simple">
+<li>draw - <tt class="docutils literal"><span class="pre">Boolean</span></tt> Draw the feature after setting it.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</li>
+</ul>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.FeatureRenderer.update">
+<tt class="descclassname">FeatureRenderer.</tt><tt class="descname">update</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.FeatureRenderer.update" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Object with properties to be updated.</td>
+</tr>
+</tbody>
+</table>
+<p>Update the <tt class="docutils literal"><span class="pre">symbolType</span></tt> or <tt class="docutils literal"><span class="pre">feature</span></tt> and <tt class="docutils literal"><span class="pre">symbolizer</span></tt> and redraw
+the feature.</p>
+<p>Valid options:</p>
+<ul>
+<li><dl class="first docutils">
+<dt>feature - <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt> The new or updated feature.</dt>
+<dd><p class="first last">If provided, the feature gets precedence over <tt class="docutils literal"><span class="pre">symbolType</span></tt>.</p>
+</dd>
+</dl>
+</li>
+<li><p class="first">symbolType - <tt class="docutils literal"><span class="pre">String</span></tt> One of the allowed <tt class="docutils literal"><span class="pre">symbolType</span></tt> values.</p>
+</li>
+<li><p class="first">symbolizers - <tt class="docutils literal"><span class="pre">Array(Object)</span></tt> An array of symbolizer objects.</p>
+</li>
+</ul>
+</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">click</tt></dt>
+<dd><p>Fires when the feature is clicked on.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>renderer - <a title="GeoExt.FeatureRenderer" class="reference internal" href="#GeoExt.FeatureRenderer"><tt class="xref docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a> This feature renderer.</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerLegend.html" title="GeoExt.LayerLegend"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="Action.html" title="GeoExt.Action"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/grid/FeatureSelectionModel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/grid/FeatureSelectionModel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/grid/FeatureSelectionModel.html	(revision 76)
@@ -0,0 +1,247 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.grid.FeatureSelectionModel &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.BaseLayerContainer" href="../tree/BaseLayerContainer.html" />
+    <link rel="prev" title="GeoExt.form.SearchAction" href="../form/SearchAction.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../form/SearchAction.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../tree/BaseLayerContainer.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-grid-featureselectionmodel">
+<h1><a title="GeoExt.grid.FeatureSelectionModel" class="reference internal" href="#GeoExt.grid.FeatureSelectionModel"><tt class="xref docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a><a class="headerlink" href="#geoext-grid-featureselectionmodel" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel">Ext.grid.RowSelectionModel</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.grid.FeatureSelectionModel">
+<em class="property">class </em><tt class="descclassname">GeoExt.grid.</tt><tt class="descname">FeatureSelectionModel</tt><a class="headerlink" href="#GeoExt.grid.FeatureSelectionModel" title="Permalink to this definition">Â¶</a></dt>
+<dd>A row selection model which enables automatic selection of features
+in the map when rows are selected in the grid and vice-versa.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a feature grid with a feature selection model:</p>
+<div class="highlight-javascript"><div class="highlight"><pre> <span class="kd">var</span> <span class="nx">gridPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">grid</span><span class="p">.</span><span class="nx">GridPanel</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Feature Grid&quot;</span><span class="p">,</span>
+    <span class="nx">region</span><span class="o">:</span> <span class="s2">&quot;east&quot;</span><span class="p">,</span>
+    <span class="nx">store</span><span class="o">:</span> <span class="nx">store</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">320</span><span class="p">,</span>
+    <span class="nx">columns</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">header</span><span class="o">:</span> <span class="s2">&quot;Name&quot;</span><span class="p">,</span>
+        <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+        <span class="nx">dataIndex</span><span class="o">:</span> <span class="s2">&quot;name&quot;</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">header</span><span class="o">:</span> <span class="s2">&quot;Elevation&quot;</span><span class="p">,</span>
+        <span class="nx">width</span><span class="o">:</span> <span class="mi">100</span><span class="p">,</span>
+        <span class="nx">dataIndex</span><span class="o">:</span> <span class="s2">&quot;elevation&quot;</span>
+    <span class="p">}],</span>
+    <span class="nx">sm</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">grid</span><span class="p">.</span><span class="nx">FeatureSelectionModel</span><span class="p">()</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel">Ext.grid.RowSelectionModel</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">autoActivateControl</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> If true the select feature control is activated and
+deactivated when binding and unbinding. Defaults to true.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> The vector layer used for the creation of
+the select feature control, it must already be added to the map. If not
+provided, the layer bound to the grid&#8217;s store, if any, will be used.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerFromStore</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> If true, and if the constructor is passed neither a
+layer nor a select feature control, a select feature control is
+created using the layer found in the grid&#8217;s store. Set it to
+false if you want to manually bind the selection model to a
+layer. Defaults to true.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">selectControl</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Control.SelectFeature</span></tt> A select feature control. If not
+provided one will be created.  If provided any &#8220;layer&#8221; config option
+will be ignored, and its &#8220;multiple&#8221; option will be used to configure
+the selectionModel.  If an <tt class="docutils literal"><span class="pre">Object</span></tt> is provided here, it will be
+passed as config to the SelectFeature constructor, and the &#8220;layer&#8221;
+config option will be used for the layer.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.RowSelectionModel">Ext.grid.RowSelectionModel</a>.</p>
+<dl class="method">
+<dt id="GeoExt.grid.FeatureSelectionModel.bind">
+<tt class="descclassname">FeatureSelectionModel.</tt><tt class="descname">bind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.grid.FeatureSelectionModel.bind" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first simple">
+<li><em>obj</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt> or
+<tt class="docutils literal"><span class="pre">OpenLayers.Control.SelectFeature</span></tt> The object this selection model
+should be bound to, either a vector layer or a select feature
+control.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> An object with a &#8220;controlConfig&#8221;
+property referencing the configuration object to pass to the
+<tt class="docutils literal"><span class="pre">OpenLayers.Control.SelectFeature</span></tt> constructor.</li>
+</ul>
+</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><p class="first last"><tt class="docutils literal"><span class="pre">OpenLayers.Control.SelectFeature</span></tt> The select feature
+control this selection model uses.</p>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Bind the selection model to a layer or a SelectFeature control.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.grid.FeatureSelectionModel.unbind">
+<tt class="descclassname">FeatureSelectionModel.</tt><tt class="descname">unbind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.grid.FeatureSelectionModel.unbind" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">OpenLayers.Control.SelectFeature</span></tt> The select feature
+control this selection model used.</td>
+</tr>
+</tbody>
+</table>
+<p>Unbind the selection model from the layer or SelectFeature control.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../tree/BaseLayerContainer.html" title="GeoExt.tree.BaseLayerContainer"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../form/SearchAction.html" title="GeoExt.form.SearchAction"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/WMSLegend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/WMSLegend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/WMSLegend.html	(revision 76)
@@ -0,0 +1,219 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.WMSLegend &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.ZoomSlider" href="ZoomSlider.html" />
+    <link rel="prev" title="GeoExt.VectorLegend" href="VectorLegend.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="VectorLegend.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="ZoomSlider.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-wmslegend">
+<h1><a title="GeoExt.WMSLegend" class="reference internal" href="#GeoExt.WMSLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a><a class="headerlink" href="#geoext-wmslegend" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a></li>
+<li><a title="GeoExt.LayerLegend" class="reference external" href="LayerLegend.html#GeoExt.LayerLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_wmslegend</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.WMSLegend">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">WMSLegend</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.WMSLegend" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>Show a legend image for a WMS layer. The image can be read from the styles
+field of a layer record (if the record comes e.g. from a
+<a title="GeoExt.data.WMSCapabilitiesReader" class="reference external" href="../data/WMSCapabilitiesReader.html#GeoExt.data.WMSCapabilitiesReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a>). If not provided, a
+GetLegendGraphic request will be issued to retrieve the image.</p>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">baseParams</tt></dt>
+<dd><dl class="docutils">
+<dt><tt class="docutils literal"><span class="pre">Object</span></tt></dt>
+<dd><p class="first">Optional parameters to add to the legend url, this can e.g. be used to
+support vendor-specific parameters in a SLD WMS GetLegendGraphic
+request. To override the default MIME type of image/gif use the
+FORMAT parameter in baseParams.</p>
+<div class="last highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">legendPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">LegendPanel</span><span class="p">({</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span><span class="p">,</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s1">&#39;Legend Panel&#39;</span><span class="p">,</span>
+    <span class="nx">defaults</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">style</span><span class="o">:</span> <span class="s1">&#39;padding:5px&#39;</span><span class="p">,</span>
+        <span class="nx">baseParams</span><span class="o">:</span> <span class="p">{</span>
+            <span class="nx">FORMAT</span><span class="o">:</span> <span class="s1">&#39;image/png&#39;</span><span class="p">,</span>
+            <span class="nx">LEGEND_OPTIONS</span><span class="o">:</span> <span class="s1">&#39;forceLabels:on&#39;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</dd>
+</dl>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">defaultStyleIsFirst</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+The WMS spec does not say if the first style advertised for a layer in
+a Capabilities document is the default style that the layer is
+rendered with. We make this assumption by default. To be strictly WMS
+compliant, set this to false, but make sure to configure a STYLES
+param with your WMS layers, otherwise LegendURLs advertised in the
+GetCapabilities document cannot be used.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">labelCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional css class to use for the layer title labels.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerRecord</tt></dt>
+<dd><a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>  The layer record for the legend</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">legendTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional title to be displayed instead of the layer title.  If this is
+set, the value of <tt class="docutils literal"><span class="pre">showTitle</span></tt> will be ignored (assumed to be true).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">showTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Whether or not to show the title of a layer. This can be overridden
+on the LayerStore record using the hideTitle property.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">useScaleParameter</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Should we use the optional SCALE parameter in the SLD WMS
+GetLegendGraphic request? Defaults to true.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="ZoomSlider.html" title="GeoExt.ZoomSlider"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="VectorLegend.html" title="GeoExt.VectorLegend"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/ZoomSlider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/ZoomSlider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/ZoomSlider.html	(revision 76)
@@ -0,0 +1,249 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.ZoomSlider &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.LayerOpacitySliderTip" href="tips/LayerOpacitySliderTip.html" />
+    <link rel="prev" title="GeoExt.WMSLegend" href="WMSLegend.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WMSLegend.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="tips/LayerOpacitySliderTip.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-zoomslider">
+<h1><a title="GeoExt.ZoomSlider" class="reference internal" href="#GeoExt.ZoomSlider"><tt class="xref docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a><a class="headerlink" href="#geoext-zoomslider" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_zoomslider</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.ZoomSlider">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">ZoomSlider</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.ZoomSlider" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a slider for controlling a map&#8217;s zoom level.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to render a slider outside the map viewport:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">slider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">ZoomSlider</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">map</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>Sample code to add a slider to a map panel:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">panel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">controls</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Navigation</span><span class="p">()]</span>
+    <span class="p">},</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+        <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+        <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+        <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+    <span class="p">)],</span>
+    <span class="nx">extent</span><span class="o">:</span> <span class="p">[</span><span class="o">-</span><span class="mi">5</span><span class="p">,</span> <span class="mi">35</span><span class="p">,</span> <span class="mi">15</span><span class="p">,</span> <span class="mi">55</span><span class="p">],</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;gx_zoomslider&quot;</span><span class="p">,</span>
+        <span class="nx">aggressive</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">vertical</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">height</span><span class="o">:</span> <span class="mi">100</span><span class="p">,</span>
+        <span class="nx">x</span><span class="o">:</span> <span class="mi">10</span><span class="p">,</span>
+        <span class="nx">y</span><span class="o">:</span> <span class="mi">20</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">aggressive</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+If set to true, the map is zoomed as soon as the thumb is moved. Otherwise
+the map is zoomed when the thumb is released (default).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">baseCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+The CSS class name for the slider elements.  Default is &#8220;gx-zoomslider&#8221;.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <a title="GeoExt.MapPanel" class="reference external" href="MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>
+The map that the slider controls.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a>.</p>
+<dl class="method">
+<dt id="GeoExt.ZoomSlider.getResolution">
+<tt class="descclassname">ZoomSlider.</tt><tt class="descname">getResolution</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.ZoomSlider.getResolution" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Number</span></tt> The map resolution.</td>
+</tr>
+</tbody>
+</table>
+<p>Get the resolution for the associated map based on the slider value.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.ZoomSlider.getScale">
+<tt class="descclassname">ZoomSlider.</tt><tt class="descname">getScale</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.ZoomSlider.getScale" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Number</span></tt> The map scale denominator.</td>
+</tr>
+</tbody>
+</table>
+<p>Get the scale denominator for the associated map based on the slider value.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.ZoomSlider.getZoom">
+<tt class="descclassname">ZoomSlider.</tt><tt class="descname">getZoom</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.ZoomSlider.getZoom" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Number</span></tt> The map zoom level.</td>
+</tr>
+</tbody>
+</table>
+<p>Get the zoom level for the associated map based on the slider value.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="tips/LayerOpacitySliderTip.html" title="GeoExt.LayerOpacitySliderTip"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WMSLegend.html" title="GeoExt.WMSLegend"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerLegend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerLegend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerLegend.html	(revision 76)
@@ -0,0 +1,168 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.LayerLegend &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.LayerOpacitySlider" href="LayerOpacitySlider.html" />
+    <link rel="prev" title="GeoExt.FeatureRenderer" href="FeatureRenderer.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="FeatureRenderer.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerOpacitySlider.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-layerlegend">
+<h1><a title="GeoExt.LayerLegend" class="reference internal" href="#GeoExt.LayerLegend"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a><a class="headerlink" href="#geoext-layerlegend" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.LayerLegend">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">LayerLegend</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.LayerLegend" title="Permalink to this definition">Â¶</a></dt>
+<dd>Base class for components of <a title="GeoExt.LegendPanel" class="reference external" href="LegendPanel.html#GeoExt.LegendPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a>.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Container">Ext.Container</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">labelCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional css class to use for the layer title labels.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerRecord</tt></dt>
+<dd><a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>  The layer record for the legend</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">legendTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+Optional title to be displayed instead of the layer title.  If this is
+set, the value of <tt class="docutils literal"><span class="pre">showTitle</span></tt> will be ignored (assumed to be true).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">showTitle</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Whether or not to show the title of a layer. This can be overridden
+on the LayerStore record using the hideTitle property.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerOpacitySlider.html" title="GeoExt.LayerOpacitySlider"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="FeatureRenderer.html" title="GeoExt.FeatureRenderer"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerContainer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerContainer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerContainer.html	(revision 76)
@@ -0,0 +1,170 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.LayerContainer &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.LayerLoader" href="LayerLoader.html" />
+    <link rel="prev" title="GeoExt.tree.BaseLayerContainer" href="BaseLayerContainer.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="BaseLayerContainer.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerLoader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-layercontainer">
+<h1><a title="GeoExt.tree.LayerContainer" class="reference internal" href="#GeoExt.tree.LayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a><a class="headerlink" href="#geoext-tree-layercontainer" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.LayerContainer">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">LayerContainer</tt><a class="headerlink" href="#GeoExt.tree.LayerContainer" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A subclass of <tt class="docutils literal"><span class="pre">Ext.tree.AsyncTreeNode</span></tt> that will collect all layers of an
+OpenLayers map. Only layers that have displayInLayerSwitcher set to true
+will be included. The childrens&#8217; iconCls defaults to
+&#8220;gx-tree-layer-icon&#8221;.</p>
+<p>Note: if this container is loaded by an <tt class="docutils literal"><span class="pre">Ext.tree.TreeLoader</span></tt>, the
+<tt class="docutils literal"><span class="pre">applyLoader</span></tt> config option of that loader needs to be set to
+&#8220;false&#8221;. Also note that the list of available uiProviders will be
+taken from the ownerTree if this container&#8217;s loader is configured
+without one.</p>
+<p>To use this node type in <tt class="docutils literal"><span class="pre">TreePanel</span></tt> config, set nodeType to
+&#8220;gx_layercontainer&#8221;.</p>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> The layer store containing layers to be
+displayed in the container. If loader is not provided or provided as
+<tt class="docutils literal"><span class="pre">Object</span></tt>, this property will be set as the store option of the
+loader. Otherwise it will be ignored.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">loader</tt></dt>
+<dd><a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> or <tt class="docutils literal"><span class="pre">Object</span></tt> The loader to use with
+this container. If an <tt class="docutils literal"><span class="pre">Object</span></tt> is provided, a
+<a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a>, configured with the the properties
+from the provided object, will be created.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerLoader.html" title="GeoExt.tree.LayerLoader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="BaseLayerContainer.html" title="GeoExt.tree.BaseLayerContainer"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/OverlayLayerContainer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/OverlayLayerContainer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/OverlayLayerContainer.html	(revision 76)
@@ -0,0 +1,165 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.OverlayLayerContainer &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.TreeNodeUIEventMixin" href="TreeNodeUIEventMixin.html" />
+    <link rel="prev" title="GeoExt.tree.LayerParamNode" href="LayerParamNode.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerParamNode.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="TreeNodeUIEventMixin.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-overlaylayercontainer">
+<h1><a title="GeoExt.tree.OverlayLayerContainer" class="reference internal" href="#GeoExt.tree.OverlayLayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a><a class="headerlink" href="#geoext-tree-overlaylayercontainer" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a></li>
+<li><a title="GeoExt.tree.LayerContainer" class="reference external" href="LayerContainer.html#GeoExt.tree.LayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.OverlayLayerContainer">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">OverlayLayerContainer</tt><a class="headerlink" href="#GeoExt.tree.OverlayLayerContainer" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A layer container that will collect all overlay layers of an OpenLayers
+map. Only layers that have displayInLayerSwitcher set to true will be
+included.</p>
+<p>To use this node type in <tt class="docutils literal"><span class="pre">TreePanel</span></tt> config, set nodeType to
+&#8220;gx_overlaylayercontainer&#8221;.</p>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> The layer store containing layers to be
+displayed in the container. If loader is not provided or provided as
+<tt class="docutils literal"><span class="pre">Object</span></tt>, this property will be set as the store option of the
+loader. Otherwise it will be ignored.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">loader</tt></dt>
+<dd><a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> or <tt class="docutils literal"><span class="pre">Object</span></tt> The loader to use with
+this container. If an <tt class="docutils literal"><span class="pre">Object</span></tt> is provided, a
+<a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a>, configured with the the properties
+from the provided object, will be created.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="TreeNodeUIEventMixin.html" title="GeoExt.tree.TreeNodeUIEventMixin"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerParamNode.html" title="GeoExt.tree.LayerParamNode"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerNode.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerNode.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerNode.html	(revision 76)
@@ -0,0 +1,200 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.LayerNode &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.LayerParamLoader" href="LayerParamLoader.html" />
+    <link rel="prev" title="GeoExt.tree.LayerLoader" href="LayerLoader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerLoader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerParamLoader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-layernode">
+<h1><a title="GeoExt.tree.LayerNode" class="reference internal" href="#GeoExt.tree.LayerNode"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a><a class="headerlink" href="#geoext-tree-layernode" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode">Ext.tree.TreeNode</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.LayerNode">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">LayerNode</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.tree.LayerNode" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A subclass of <tt class="docutils literal"><span class="pre">Ext.tree.TreeNode</span></tt> that is connected to an
+<tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> by setting the node&#8217;s layer property. Checking or
+unchecking the checkbox of this node will directly affect the layer and
+vice versa. The default iconCls for this node&#8217;s icon is
+&#8220;gx-tree-layer-icon&#8221;, unless it has children.</p>
+<p>Setting the node&#8217;s layer property to a layer name instead of an object
+will also work. As soon as a layer is found, it will be stored as layer
+property in the attributes hash.</p>
+<p>The node&#8217;s text property defaults to the layer name.</p>
+<p>If the node has a checkedGroup attribute configured, it will be
+rendered with a radio button instead of the checkbox. The value of
+the checkedGroup attribute is a string, identifying the options group
+for the node.</p>
+<p>To use this node type in a <tt class="docutils literal"><span class="pre">TreePanel</span></tt> config, set <tt class="docutils literal"><span class="pre">nodeType</span></tt> to
+&#8220;gx_layer&#8221;.</p>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode">Ext.tree.TreeNode</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer</span> <span class="pre">or</span> <span class="pre">String</span></tt>
+The layer that this layer node will
+be bound to, or the name of the layer (has to match the layer&#8217;s
+name property). If a layer name is provided, <tt class="docutils literal"><span class="pre">layerStore</span></tt> also has
+to be provided.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> <tt class="docutils literal"><span class="pre">or</span> <span class="pre">&quot;auto&quot;</span></tt>
+The layer store containing the layer that this node represents.  If set
+to &#8220;auto&#8221;, the node will query the ComponentManager for a
+<a title="GeoExt.MapPanel" class="reference external" href="../MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>, take the first one it finds and take its layer
+store. This property is only required if <tt class="docutils literal"><span class="pre">layer</span></tt> is provided as a
+string.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">loader</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.tree.TreeLoader|Object</span></tt> If provided, subnodes will be added to
+this LayerNode. Obviously, only loaders that process an
+<tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> or <a title="GeoExt.data.LayerRecord" class="reference external" href="../../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> (like
+<tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerParamsLoader</span></tt>) will actually generate child
+nodes here. If provided as <tt class="docutils literal"><span class="pre">Object</span></tt>, a
+<a title="GeoExt.tree.LayerParamLoader" class="reference external" href="LayerParamLoader.html#GeoExt.tree.LayerParamLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a> instance will be created, with
+the provided object as configuration.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode">Ext.tree.TreeNode</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.tree.LayerNode.layer">
+<tt class="descclassname">LayerNode.</tt><tt class="descname">layer</tt><a class="headerlink" href="#GeoExt.tree.LayerNode.layer" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt>
+The layer this node is bound to.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerParamLoader.html" title="GeoExt.tree.LayerParamLoader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerLoader.html" title="GeoExt.tree.LayerLoader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerLoader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerLoader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerLoader.html	(revision 76)
@@ -0,0 +1,245 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.LayerLoader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.LayerNode" href="LayerNode.html" />
+    <link rel="prev" title="GeoExt.tree.LayerContainer" href="LayerContainer.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerContainer.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerNode.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-layerloader">
+<h1><a title="GeoExt.tree.LayerLoader" class="reference internal" href="#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a><a class="headerlink" href="#geoext-tree-layerloader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.LayerLoader">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">LayerLoader</tt><a class="headerlink" href="#GeoExt.tree.LayerLoader" title="Permalink to this definition">Â¶</a></dt>
+<dd>A loader that will load all layers of a <a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a>
+By default, only layers that have displayInLayerSwitcher set to true
+will be included. The childrens&#8217; iconCls defaults to
+&#8220;gx-tree-layer-icon&#8221;.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">baseAttrs</tt></dt>
+<dd>An object containing attributes to be added to all nodes created by
+this loader.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">filter</tt></dt>
+<dd><p><tt class="docutils literal"><span class="pre">Function</span></tt>
+A function, called in the scope of this loader, with a layer record
+as argument. Is expected to return true for layers to be loaded, false
+otherwise. By default, the filter checks for displayInLayerSwitcher:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">filter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">record</span><span class="p">.</span><span class="nx">getLayer</span><span class="p">().</span><span class="nx">displayInLayerSwitcher</span> <span class="o">==</span> <span class="kc">true</span>
+<span class="p">}</span>
+</pre></div>
+</div>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">store</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a>
+The layer store containing layers to be added by this loader.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">uiProviders</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt>
+An optional object containing properties which specify custom
+GeoExt.tree.LayerNodeUI implementations. If the optional uiProvider
+attribute for child nodes is a string rather than a reference to a
+TreeNodeUI implementation, then that string value is used as a
+property name in the uiProviders object. If not provided, the
+uiProviders object will be taken from the ownerTree&#8217;s loader.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="method">
+<dt id="GeoExt.tree.LayerLoader.createNode">
+<tt class="descclassname">LayerLoader.</tt><tt class="descname">createNode</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.tree.LayerLoader.createNode" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>attr</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> attributes for the new node</td>
+</tr>
+</tbody>
+</table>
+<p>Override this function for custom TreeNode node implementation, or to
+modify the attributes at creation time.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">beforeload</tt></dt>
+<dd><p>Triggered before loading children. Return false to avoid
+loading children.</p>
+<p>Listener arguments:</p>
+<ul>
+<li><p class="first">loader - <a title="GeoExt.tree.LayerLoader" class="reference internal" href="#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> this loader</p>
+</li>
+<li><dl class="first docutils">
+<dt>node - <tt class="docutils literal"><span class="pre">Ex.tree.TreeNode</span></tt> the node that this loader is</dt>
+<dd><p class="first last">configured with</p>
+</dd>
+</dl>
+</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">load</tt></dt>
+<dd><p>Triggered after children wer loaded.</p>
+<p>Listener arguments:</p>
+<ul>
+<li><p class="first">loader - <a title="GeoExt.tree.LayerLoader" class="reference internal" href="#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> this loader</p>
+</li>
+<li><dl class="first docutils">
+<dt>node - <tt class="docutils literal"><span class="pre">Ex.tree.TreeNode</span></tt> the node that this loader is</dt>
+<dd><p class="first last">configured with</p>
+</dd>
+</dl>
+</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerNode.html" title="GeoExt.tree.LayerNode"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerContainer.html" title="GeoExt.tree.LayerContainer"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamNode.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamNode.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamNode.html	(revision 76)
@@ -0,0 +1,182 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.LayerParamNode &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.OverlayLayerContainer" href="OverlayLayerContainer.html" />
+    <link rel="prev" title="GeoExt.tree.LayerParamLoader" href="LayerParamLoader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerParamLoader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="OverlayLayerContainer.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-layerparamnode">
+<h1><a title="GeoExt.tree.LayerParamNode" class="reference internal" href="#GeoExt.tree.LayerParamNode"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a><a class="headerlink" href="#geoext-tree-layerparamnode" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode">Ext.tree.TreeNode</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.LayerParamNode">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">LayerParamNode</tt><a class="headerlink" href="#GeoExt.tree.LayerParamNode" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>A subclass of <tt class="docutils literal"><span class="pre">Ext.tree.TreeNode</span></tt> that represents a value of a list of
+values provided as one of an <tt class="docutils literal"><span class="pre">OpenLayers.Layer.HTTPRequest</span></tt>&#8216;s params.
+The default iconCls for this node&#8217;s icon is &#8220;gx-tree-layerparam-icon&#8221;.</p>
+<p>To use this node type in a <tt class="docutils literal"><span class="pre">TreePanel</span></tt> config, set <tt class="docutils literal"><span class="pre">nodeType</span></tt> to
+&#8220;gx_layerparam&#8221;.</p>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeNode">Ext.tree.TreeNode</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">delimiter</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Delimiter of the <tt class="docutils literal"><span class="pre">param</span></tt>&#8216;s value&#8217;s items. Default is
+<tt class="docutils literal"><span class="pre">,</span></tt> (comma). If the <tt class="docutils literal"><span class="pre">param</span></tt>&#8216;s value is an array, this property
+has no effect.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">item</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> The param&#8217;s value&#8217;s item that this node represents.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer.HTTPRequest|String</span></tt> The layer that this node
+represents a subnode of. If provided as string, the string has to
+match the title of one of the records in the <tt class="docutils literal"><span class="pre">layerStore</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> Only used if layer is provided as
+string. The store where we can find the layer. If not provided, the
+store of a map panel found by <tt class="docutils literal"><span class="pre">GeoExt.MapPanel::guess</span></tt> will be used.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">param</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Key for a param (key-value pair in the params object of the
+layer) that this node represents an item of. The value can either be an
+<tt class="docutils literal"><span class="pre">Array</span></tt> or a <tt class="docutils literal"><span class="pre">String</span></tt>, delimited by the character (or string)
+provided as <tt class="docutils literal"><span class="pre">delimiter</span></tt> config option.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="OverlayLayerContainer.html" title="GeoExt.tree.OverlayLayerContainer"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerParamLoader.html" title="GeoExt.tree.LayerParamLoader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamLoader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamLoader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/LayerParamLoader.html	(revision 76)
@@ -0,0 +1,222 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.LayerParamLoader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.LayerParamNode" href="LayerParamNode.html" />
+    <link rel="prev" title="GeoExt.tree.LayerNode" href="LayerNode.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerNode.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerParamNode.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-layerparamloader">
+<h1><a title="GeoExt.tree.LayerParamLoader" class="reference internal" href="#GeoExt.tree.LayerParamLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a><a class="headerlink" href="#geoext-tree-layerparamloader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.LayerParamLoader">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">LayerParamLoader</tt><a class="headerlink" href="#GeoExt.tree.LayerParamLoader" title="Permalink to this definition">Â¶</a></dt>
+<dd>A loader that creates children from its node&#8217;s layer
+(<tt class="docutils literal"><span class="pre">OpenLayers.Layer.HTTPRequest</span></tt>) by items in one of the values in
+the layer&#8217;s params object.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">delimiter</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Delimiter of the <tt class="docutils literal"><span class="pre">param</span></tt>&#8216;s value&#8217;s items. Default is
+<tt class="docutils literal"><span class="pre">,</span></tt> (comma). If the <tt class="docutils literal"><span class="pre">param</span></tt>&#8216;s value is an array, this property has
+no effect.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">param</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Key for a param (key-value pair in the params object of the
+layer) that this loader uses to create childnodes from its items. The
+value can either be an <tt class="docutils literal"><span class="pre">Array</span></tt> or a <tt class="docutils literal"><span class="pre">String</span></tt>, delimited by the
+character (or string) provided as <tt class="docutils literal"><span class="pre">delimiter</span></tt> config option.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="method">
+<dt id="GeoExt.tree.LayerParamLoader.createNode">
+<tt class="descclassname">LayerParamLoader.</tt><tt class="descname">createNode</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.tree.LayerParamLoader.createNode" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>attr</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> attributes for the new node</td>
+</tr>
+</tbody>
+</table>
+<p>Override this function for custom TreeNode node implementation, or to
+modify the attributes at creation time.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">beforeload</tt></dt>
+<dd><p>Triggered before loading children. Return false to avoid
+loading children.</p>
+<p>Listener arguments:</p>
+<ul>
+<li><p class="first">loader - <a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> this loader</p>
+</li>
+<li><dl class="first docutils">
+<dt>node - <tt class="docutils literal"><span class="pre">Ex.tree.TreeNode</span></tt> the node that this loader is</dt>
+<dd><p class="first last">configured with</p>
+</dd>
+</dl>
+</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">load</tt></dt>
+<dd><p>Triggered after children were loaded.</p>
+<p>Listener arguments:</p>
+<ul>
+<li><p class="first">loader - <a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> this loader</p>
+</li>
+<li><dl class="first docutils">
+<dt>node - <tt class="docutils literal"><span class="pre">Ex.tree.TreeNode</span></tt> the node that this loader is</dt>
+<dd><p class="first last">configured with</p>
+</dd>
+</dl>
+</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerParamNode.html" title="GeoExt.tree.LayerParamNode"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerNode.html" title="GeoExt.tree.LayerNode"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/WMSCapabilitiesLoader.html	(revision 76)
@@ -0,0 +1,167 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.WMSCapabilitiesLoader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.data" href="../../data.html" />
+    <link rel="prev" title="GeoExt.tree.TreeNodeUIEventMixin" href="TreeNodeUIEventMixin.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="TreeNodeUIEventMixin.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../../data.html"
+                                  title="next chapter"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-wmscapabilitiesloader">
+<h1><a title="GeoExt.tree.WMSCapabilitiesLoader" class="reference internal" href="#GeoExt.tree.WMSCapabilitiesLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a><a class="headerlink" href="#geoext-tree-wmscapabilitiesloader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://www.dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeLoader">Ext.tree.TreeLoader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.WMSCapabilitiesLoader">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">WMSCapabilitiesLoader</tt><a class="headerlink" href="#GeoExt.tree.WMSCapabilitiesLoader" title="Permalink to this definition">Â¶</a></dt>
+<dd>A loader that will load create a tree of all layers of a Web Map
+Service (WMS), maintaining its tree structure. Nodes created by this
+loader are instances of <tt class="docutils literal"><span class="pre">Ext.tree.TreeNode</span></tt>. If the WMS Capabilities
+advertise a name for a layer, an OpenLayers.Layer.WMS instance will
+be set on the node in its <tt class="docutils literal"><span class="pre">layer</span></tt> attribute.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://www.dev.sencha.com/deploy/dev/docs/?class=Ext.tree.TreeLoader">Ext.tree.TreeLoader</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layerOptions</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt>
+Optional options to set on the WMS layers which will be created by
+this loader.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layerParams</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt>
+Optional parameters to set on the WMS layers which will be created by
+this loader.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">url</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>
+The online resource of the Web Map Service.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../../data.html" title="GeoExt.data"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="TreeNodeUIEventMixin.html" title="GeoExt.tree.TreeNodeUIEventMixin"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/BaseLayerContainer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/BaseLayerContainer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/BaseLayerContainer.html	(revision 76)
@@ -0,0 +1,167 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.BaseLayerContainer &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.LayerContainer" href="LayerContainer.html" />
+    <link rel="prev" title="GeoExt.grid.FeatureSelectionModel" href="../grid/FeatureSelectionModel.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../grid/FeatureSelectionModel.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerContainer.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-baselayercontainer">
+<h1><a title="GeoExt.tree.BaseLayerContainer" class="reference internal" href="#GeoExt.tree.BaseLayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a><a class="headerlink" href="#geoext-tree-baselayercontainer" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a></li>
+<li><a title="GeoExt.tree.LayerContainer" class="reference external" href="LayerContainer.html#GeoExt.tree.LayerContainer"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.tree.BaseLayerContainer">
+<em class="property">class </em><tt class="descclassname">GeoExt.tree.</tt><tt class="descname">BaseLayerContainer</tt><a class="headerlink" href="#GeoExt.tree.BaseLayerContainer" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A layer container that will collect all base layers of an OpenLayers
+map. Only layers that have displayInLayerSwitcher set to true will be
+included. The childrens&#8217; iconCls defaults to &#8220;gx-tree-baselayer-icon&#8221;.</p>
+<p>Children will be rendered with a radio button instead of a checkbox,
+showing the user that only one base layer can be active at a time.</p>
+<p>To use this node type in <tt class="docutils literal"><span class="pre">TreePanel</span></tt> config, set nodeType to
+&#8220;gx_baselayercontainer&#8221;.</p>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.tree.AsyncTreeNode">Ext.tree.AsyncTreeNode</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">layerStore</tt></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> The layer store containing layers to be
+displayed in the container. If loader is not provided or provided as
+<tt class="docutils literal"><span class="pre">Object</span></tt>, this property will be set as the store option of the
+loader. Otherwise it will be ignored.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">loader</tt></dt>
+<dd><a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a> or <tt class="docutils literal"><span class="pre">Object</span></tt> The loader to use with
+this container. If an <tt class="docutils literal"><span class="pre">Object</span></tt> is provided, a
+<a title="GeoExt.tree.LayerLoader" class="reference external" href="LayerLoader.html#GeoExt.tree.LayerLoader"><tt class="xref docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a>, configured with the the properties
+from the provided object, will be created.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerContainer.html" title="GeoExt.tree.LayerContainer"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../grid/FeatureSelectionModel.html" title="GeoExt.grid.FeatureSelectionModel"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/tree/TreeNodeUIEventMixin.html	(revision 76)
@@ -0,0 +1,173 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.tree.TreeNodeUIEventMixin &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.tree.WMSCapabilitiesLoader" href="WMSCapabilitiesLoader.html" />
+    <link rel="prev" title="GeoExt.tree.OverlayLayerContainer" href="OverlayLayerContainer.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="OverlayLayerContainer.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSCapabilitiesLoader.html"
+                                  title="next chapter"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-tree-treenodeuieventmixin">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt><a class="headerlink" href="#geoext-tree-treenodeuieventmixin" title="Permalink to this headline">Â¶</a></h1>
+<p>A mixin that adds events to TreeNodeUIs. With these events, tree plugins
+can modify the node ui&#8217;s DOM when it is rendered, and react to raw click
+events on tree nodes.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a tree with a node that uses the
+<tt class="xref docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt>:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">UIClass</span> <span class="o">=</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span>
+    <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUI</span><span class="p">,</span>
+    <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreeNodeUIEventMixin</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">tree</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">tree</span><span class="p">.</span><span class="nx">TreePanel</span><span class="p">({</span>
+    <span class="nx">root</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">nodeType</span><span class="o">:</span> <span class="s2">&quot;node&quot;</span><span class="p">,</span>
+        <span class="nx">uiProvider</span><span class="o">:</span> <span class="nx">UIClass</span><span class="p">,</span>
+        <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;My Node&quot;</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">rawclicknode</tt></dt>
+<dd><p>Fires on the tree when a node is clicked.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>node - <tt class="docutils literal"><span class="pre">Ext.TreeNode</span></tt> The clicked node.</li>
+<li>event - <tt class="docutils literal"><span class="pre">Ext.EventObject</span></tt> The click event.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">rendernode</tt></dt>
+<dd><p>Fires on the tree when a node is rendered.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>node - <tt class="docutils literal"><span class="pre">Ext.TreeNode</span></tt> The rendered node.</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSCapabilitiesLoader.html" title="GeoExt.tree.WMSCapabilitiesLoader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="OverlayLayerContainer.html" title="GeoExt.tree.OverlayLayerContainer"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/MapPanel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/MapPanel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/MapPanel.html	(revision 76)
@@ -0,0 +1,227 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.MapPanel &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.Popup" href="Popup.html" />
+    <link rel="prev" title="GeoExt.LegendPanel" href="LegendPanel.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LegendPanel.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="Popup.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-mappanel">
+<h1><a title="GeoExt.MapPanel" class="reference internal" href="#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a><a class="headerlink" href="#geoext-mappanel" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_mappanel</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.MapPanel">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">MapPanel</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.MapPanel" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a panel container for a map.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a panel with a new map:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">border</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;div-id&quot;</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">maxExtent</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Bounds</span><span class="p">(</span><span class="o">-</span><span class="mi">90</span><span class="p">,</span> <span class="o">-</span><span class="mi">45</span><span class="p">,</span> <span class="mi">90</span><span class="p">,</span> <span class="mi">45</span><span class="p">)</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>Sample code to create a map panel with a bottom toolbar in a Window:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">win</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Window</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;My Map&quot;</span><span class="p">,</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;gx_mappanel&quot;</span><span class="p">,</span>
+        <span class="nx">bbar</span><span class="o">:</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Toolbar</span><span class="p">()</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">center</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.LonLat</span> <span class="pre">or</span> <span class="pre">Array(Number)</span></tt>  A location for the map center.  If
+an array is provided, the first two items should represent x &amp; y coordinates.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">extent</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Bounds</span> <span class="pre">or</span> <span class="pre">Array(Number)</span></tt>  An initial extent for the map (used
+if center and zoom are not provided.  If an array, the first four items
+should be minx, miny, maxx, maxy.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layers</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span> <span class="pre">or</span> <span class="pre">GeoExt.data.GroupingStore</span> <span class="pre">or</span> <span class="pre">Array(OpenLayers.Layer)</span></tt>
+A store holding records. The layers provided here will be added to this
+MapPanel&#8217;s map when it is rendered.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span> <span class="pre">or</span> <span class="pre">Object</span></tt>  A configured map or a configuration object
+for the map constructor.  A configured map will be available after
+construction through the <tt class="xref docutils literal"><span class="pre">map</span></tt> property.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">prettyStateKeys</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> Set this to true if you want pretty strings in the MapPanel&#8217;s
+state keys. More specifically, layer.name instead of layer.id will be used
+in the state keys if this option is set to true. But in that case you have
+to make sure you don&#8217;t have two layers with the same name. Defaults to
+false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">zoom</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>  An initial zoom level for the map.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.MapPanel.layers">
+<tt class="descclassname">MapPanel.</tt><tt class="descname">layers</tt><a class="headerlink" href="#GeoExt.MapPanel.layers" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a>  A store containing
+<a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.MapPanel.map">
+<tt class="descclassname">MapPanel.</tt><tt class="descname">map</tt><a class="headerlink" href="#GeoExt.MapPanel.map" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <tt class="docutils literal"><span class="pre">Object</span></tt>  A map or map configuration.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="Popup.html" title="GeoExt.Popup"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LegendPanel.html" title="GeoExt.LegendPanel"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/FormPanel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/FormPanel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/FormPanel.html	(revision 76)
@@ -0,0 +1,221 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.form.FormPanel &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.form.SearchAction" href="SearchAction.html" />
+    <link rel="prev" title="GeoExt.form.BasicForm" href="BasicForm.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="BasicForm.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="SearchAction.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-form-formpanel">
+<h1><a title="GeoExt.form.FormPanel" class="reference internal" href="#GeoExt.form.FormPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a><a class="headerlink" href="#geoext-form-formpanel" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel">Ext.form.FormPanel</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_formpanel</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.form.FormPanel">
+<em class="property">class </em><tt class="descclassname">GeoExt.form.</tt><tt class="descname">FormPanel</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.form.FormPanel" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A specific <tt class="docutils literal"><span class="pre">Ext.form.FormPanel</span></tt> whose internal form is a
+<a title="GeoExt.form.BasicForm" class="reference external" href="BasicForm.html#GeoExt.form.BasicForm"><tt class="xref docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a> instead of <tt class="docutils literal"><span class="pre">Ext.form.BasicForm</span></tt>.
+One would use this form to do search requests through
+an <tt class="docutils literal"><span class="pre">OpenLayers.Protocol</span></tt> object (<tt class="docutils literal"><span class="pre">OpenLayers.Protocol.WFS</span></tt>
+for example).</p>
+<p>Look at <a title="GeoExt.form.SearchAction" class="reference external" href="SearchAction.html#GeoExt.form.SearchAction"><tt class="xref docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a> to understand how
+form fields must be named for appropriate filters to be
+passed to the protocol.</p>
+</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code showing how to use a GeoExt form panel.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">formPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">FormPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;formpanel&quot;</span><span class="p">,</span>
+    <span class="nx">protocol</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Protocol</span><span class="p">.</span><span class="nx">WFS</span><span class="p">({</span>
+        <span class="nx">url</span><span class="o">:</span> <span class="s2">&quot;http://publicus.opengeo.org/geoserver/wfs&quot;</span><span class="p">,</span>
+        <span class="nx">featureType</span><span class="o">:</span> <span class="s2">&quot;tasmania_roads&quot;</span><span class="p">,</span>
+        <span class="nx">featureNS</span><span class="o">:</span> <span class="s2">&quot;http://www.openplans.org/topp&quot;</span>
+    <span class="p">}),</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;name__ilike&quot;</span><span class="p">,</span>
+        <span class="nx">value</span><span class="o">:</span> <span class="s2">&quot;mont&quot;</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;elevation__ge&quot;</span><span class="p">,</span>
+        <span class="nx">value</span><span class="o">:</span> <span class="s2">&quot;2000&quot;</span>
+    <span class="p">}],</span>
+    <span class="nx">listeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">actioncomplete</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">form</span><span class="p">,</span> <span class="nx">action</span><span class="p">)</span> <span class="p">{</span>
+            <span class="c1">// this listener triggers when the search request</span>
+            <span class="c1">// is complete, the OpenLayers.Protocol.Response</span>
+            <span class="c1">// resulting from the request is available</span>
+            <span class="c1">// in &quot;action.response&quot;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+
+<span class="nx">formPanel</span><span class="p">.</span><span class="nx">addButton</span><span class="p">({</span>
+    <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;search&quot;</span><span class="p">,</span>
+    <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">search</span><span class="p">();</span>
+    <span class="p">},</span>
+    <span class="nx">scope</span><span class="o">:</span> <span class="nx">formPanel</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel">Ext.form.FormPanel</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">protocol</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Protocol</span></tt> The protocol instance this form panel
+is configured with, actions resulting from this form
+will be performed through the protocol.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel">Ext.form.FormPanel</a>.</p>
+<dl class="method">
+<dt id="GeoExt.form.FormPanel.search">
+<tt class="descclassname">FormPanel.</tt><tt class="descname">search</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.form.FormPanel.search" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> The options passed to the
+<a title="GeoExt.form.SearchAction" class="reference external" href="SearchAction.html#GeoExt.form.SearchAction"><tt class="xref docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a> constructor.</td>
+</tr>
+</tbody>
+</table>
+<p>Shortcut to the internal form&#8217;s search method.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="SearchAction.html" title="GeoExt.form.SearchAction"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="BasicForm.html" title="GeoExt.form.BasicForm"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/SearchAction.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/SearchAction.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/SearchAction.html	(revision 76)
@@ -0,0 +1,219 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.form.SearchAction &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.grid.FeatureSelectionModel" href="../grid/FeatureSelectionModel.html" />
+    <link rel="prev" title="GeoExt.form.FormPanel" href="FormPanel.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="FormPanel.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../grid/FeatureSelectionModel.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-form-searchaction">
+<h1><a title="GeoExt.form.SearchAction" class="reference internal" href="#GeoExt.form.SearchAction"><tt class="xref docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a><a class="headerlink" href="#geoext-form-searchaction" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.Action">Ext.form.Action</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.form.SearchAction">
+<em class="property">class </em><tt class="descclassname">GeoExt.form.</tt><tt class="descname">SearchAction</tt><big>(</big><em>form</em>, <em>options</em><big>)</big><a class="headerlink" href="#GeoExt.form.SearchAction" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A specific <tt class="docutils literal"><span class="pre">Ext.form.Action</span></tt> to be used when using a form to do
+trigger search requests througn an <tt class="docutils literal"><span class="pre">OpenLayers.Protocol</span></tt>.</p>
+<p>Arguments:</p>
+<ul>
+<li><p class="first">form <tt class="docutils literal"><span class="pre">Ext.form.BasicForm</span></tt> A basic form instance.</p>
+</li>
+<li><dl class="first docutils">
+<dt>options <tt class="docutils literal"><span class="pre">Object</span></tt> Options passed to the protocol&#8217;read method</dt>
+<dd><p class="first last">One can add an abortPrevious property to these options, if set
+to true, the abort method will be called on the protocol if
+there&#8217;s a pending request.</p>
+</dd>
+</dl>
+</li>
+</ul>
+<p>When run this action builds an <tt class="docutils literal"><span class="pre">OpenLayers.Filter</span></tt> from the form
+and passes this filter to its protocol&#8217;s read method. The form fields
+must be named after a specific convention, so that an appropriate
+<tt class="docutils literal"><span class="pre">OpenLayers.Filter.Comparison</span></tt> filter is created for each
+field.</p>
+<p>For example a field with the name <tt class="docutils literal"><span class="pre">foo__like</span></tt> would result in an
+<tt class="docutils literal"><span class="pre">OpenLayers.Filter.Comparison</span></tt> of type
+<tt class="docutils literal"><span class="pre">OpenLayers.Filter.Comparison.LIKE</span></tt> being created.</p>
+<p>Here is the convention:</p>
+<ul class="simple">
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__eq:</span> <span class="pre">OpenLayers.Filter.Comparison.EQUAL_TO</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__ne:</span> <span class="pre">OpenLayers.Filter.Comparison.NOT_EQUAL_TO</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__lt:</span> <span class="pre">OpenLayers.Filter.Comparison.LESS_THAN</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__le:</span> <span class="pre">OpenLayers.Filter.Comparison.LESS_THAN_OR_EQUAL_TO</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__gt:</span> <span class="pre">OpenLayers.Filter.Comparison.GREATER_THAN</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__ge:</span> <span class="pre">OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO</span></tt></li>
+<li><tt class="docutils literal"><span class="pre">&lt;name&gt;__like:</span> <span class="pre">OpenLayers.Filter.Comparison.LIKE</span></tt></li>
+</ul>
+<p>In most cases your would not directly create <tt class="docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt>
+objects, but use <a title="GeoExt.form.FormPanel" class="reference external" href="FormPanel.html#GeoExt.form.FormPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a> instead.</p>
+</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code showing how to use a GeoExt SearchAction with an Ext form panel:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">formPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">Panel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;formpanel&quot;</span><span class="p">,</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;name__like&quot;</span><span class="p">,</span>
+        <span class="nx">value</span><span class="o">:</span> <span class="s2">&quot;mont&quot;</span>
+    <span class="p">},</span> <span class="p">{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;textfield&quot;</span><span class="p">,</span>
+        <span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;elevation__ge&quot;</span><span class="p">,</span>
+        <span class="nx">value</span><span class="o">:</span> <span class="s2">&quot;2000&quot;</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+
+<span class="kd">var</span> <span class="nx">searchAction</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">form</span><span class="p">.</span><span class="nx">SearchAction</span><span class="p">(</span><span class="nx">formPanel</span><span class="p">.</span><span class="nx">getForm</span><span class="p">(),</span> <span class="p">{</span>
+    <span class="nx">protocol</span><span class="o">:</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Protocol</span><span class="p">.</span><span class="nx">WFS</span><span class="p">({</span>
+        <span class="nx">url</span><span class="o">:</span> <span class="s2">&quot;http://publicus.opengeo.org/geoserver/wfs&quot;</span><span class="p">,</span>
+        <span class="nx">featureType</span><span class="o">:</span> <span class="s2">&quot;tasmania_roads&quot;</span><span class="p">,</span>
+        <span class="nx">featureNS</span><span class="o">:</span> <span class="s2">&quot;http://www.openplans.org/topp&quot;</span>
+    <span class="p">}),</span>
+    <span class="nx">abortPrevious</span><span class="o">:</span> <span class="kc">true</span>
+<span class="p">});</span>
+
+<span class="nx">formPanel</span><span class="p">.</span><span class="nx">getForm</span><span class="p">().</span><span class="nx">doAction</span><span class="p">(</span><span class="nx">searchAction</span><span class="p">,</span> <span class="p">{</span>
+    <span class="nx">callback</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span> <span class="p">{</span>
+        <span class="c1">// response.features includes the features read</span>
+        <span class="c1">// from the server through the protocol</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.Action">Ext.form.Action</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.form.SearchAction.response">
+<tt class="descclassname">SearchAction.</tt><tt class="descname">response</tt><a class="headerlink" href="#GeoExt.form.SearchAction.response" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Protocol.Response</span></tt> A reference to the response
+resulting from the search request. Read-only.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../grid/FeatureSelectionModel.html" title="GeoExt.grid.FeatureSelectionModel"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="FormPanel.html" title="GeoExt.form.FormPanel"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/BasicForm.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/BasicForm.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/form/BasicForm.html	(revision 76)
@@ -0,0 +1,189 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.form.BasicForm &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../../index.html" />
+    <link rel="up" title="Widgets" href="../../widgets.html" />
+    <link rel="next" title="GeoExt.form.FormPanel" href="FormPanel.html" />
+    <link rel="prev" title="GeoExt.ZoomSliderTip" href="../tips/ZoomSliderTip.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../../docs.html">Documentation</a></li>
+                <li><a href="../../../../examples.html">Examples</a></li>
+                <li><a href="../../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a><ul>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../tips/ZoomSliderTip.html"
+                                  title="previous chapter"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="FormPanel.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-form-basicform">
+<h1><a title="GeoExt.form.BasicForm" class="reference internal" href="#GeoExt.form.BasicForm"><tt class="xref docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a><a class="headerlink" href="#geoext-form-basicform" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm">Ext.form.BasicForm</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.form.BasicForm">
+<em class="property">class </em><tt class="descclassname">GeoExt.form.</tt><tt class="descname">BasicForm</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.form.BasicForm" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A specific <tt class="docutils literal"><span class="pre">Ext.form.BasicForm</span></tt> whose doAction method creates
+a <a title="GeoExt.form.SearchAction" class="reference external" href="SearchAction.html#GeoExt.form.SearchAction"><tt class="xref docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a> if it is passed the string
+&#8220;search&#8221; as its first argument.</p>
+<p>In most cases one would not use this class directly, but
+<a title="GeoExt.form.FormPanel" class="reference external" href="FormPanel.html#GeoExt.form.FormPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a> instead.</p>
+</dd></dl>
+
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm">Ext.form.BasicForm</a>.</p>
+<dl class="method">
+<dt id="GeoExt.form.BasicForm.doAction">
+<tt class="descclassname">BasicForm.</tt><tt class="descname">doAction</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.form.BasicForm.doAction" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first simple">
+<li><em>action</em> &#8211; <tt class="docutils literal"><span class="pre">String</span> <span class="pre">or</span> <span class="pre">Ext.form.Action</span></tt> Either the name
+of the action or a <tt class="docutils literal"><span class="pre">Ext.form.Action</span></tt> instance.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> The options passed to the Action
+constructor.</li>
+</ul>
+</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><p class="first last"><a title="GeoExt.form.BasicForm" class="reference internal" href="#GeoExt.form.BasicForm"><tt class="xref docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a> This form.</p>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Performs the action, if the string &#8220;search&#8221; is passed as the
+first argument then a <a title="GeoExt.form.SearchAction" class="reference external" href="SearchAction.html#GeoExt.form.SearchAction"><tt class="xref docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a> is created.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.form.BasicForm.search">
+<tt class="descclassname">BasicForm.</tt><tt class="descname">search</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.form.BasicForm.search" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> The options passed to the Action
+constructor.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><a title="GeoExt.form.BasicForm" class="reference internal" href="#GeoExt.form.BasicForm"><tt class="xref docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a> This form.</td>
+</tr>
+</tbody>
+</table>
+<p>Shortcut to do a search action.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="FormPanel.html" title="GeoExt.form.FormPanel"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../tips/ZoomSliderTip.html" title="GeoExt.ZoomSliderTip"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendImage.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendImage.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LegendImage.html	(revision 76)
@@ -0,0 +1,182 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.LegendImage &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.LegendPanel" href="LegendPanel.html" />
+    <link rel="prev" title="GeoExt.LayerOpacitySlider" href="LayerOpacitySlider.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerOpacitySlider.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LegendPanel.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-legendimage">
+<h1><a title="GeoExt.LegendImage" class="reference internal" href="#GeoExt.LegendImage"><tt class="xref docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a><a class="headerlink" href="#geoext-legendimage" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_legendimage</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.LegendImage">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">LegendImage</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.LegendImage" title="Permalink to this definition">Â¶</a></dt>
+<dd>Show a legend image in a BoxComponent and make sure load errors are
+dealt with.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">defaultImgSrc</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Path to image that will be used if the legend image fails
+to load.  Default is Ext.BLANK_IMAGE_URL.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">imgCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>  Optional css class to apply to img tag</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">url</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>  The url of the image to load</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent">Ext.BoxComponent</a>.</p>
+<dl class="method">
+<dt id="GeoExt.LegendImage.setUrl">
+<tt class="descclassname">LegendImage.</tt><tt class="descname">setUrl</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.LegendImage.setUrl" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>url</em> &#8211; <tt class="docutils literal"><span class="pre">String</span></tt> The new URL.</td>
+</tr>
+</tbody>
+</table>
+<p>Sets the url of the legend image.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LegendPanel.html" title="GeoExt.LegendPanel"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerOpacitySlider.html" title="GeoExt.LayerOpacitySlider"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Popup.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Popup.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/Popup.html	(revision 76)
@@ -0,0 +1,231 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.Popup &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.PrintMapPanel" href="PrintMapPanel.html" />
+    <link rel="prev" title="GeoExt.MapPanel" href="MapPanel.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.Popup</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="MapPanel.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintMapPanel.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-popup">
+<h1><a title="GeoExt.Popup" class="reference internal" href="#GeoExt.Popup"><tt class="xref docutils literal"><span class="pre">GeoExt.Popup</span></tt></a><a class="headerlink" href="#geoext-popup" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window">Ext.Window</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_popup</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.Popup">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">Popup</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.Popup" title="Permalink to this definition">Â¶</a></dt>
+<dd>Popups are a specialized Window that supports anchoring
+to a particular location in a MapPanel.  When a popup
+is anchored to a location, that means that the popup
+will visibly point to the location on the map, and move
+accordingly when the map is panned or zoomed.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a popup anchored to a feature:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">popup</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">Popup</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;My Popup&quot;</span><span class="p">,</span>
+    <span class="nx">location</span><span class="o">:</span> <span class="nx">feature</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">html</span><span class="o">:</span> <span class="s2">&quot;&lt;div&gt;Popup content&lt;/div&gt;&quot;</span><span class="p">,</span>
+    <span class="nx">collapsible</span><span class="o">:</span> <span class="kc">true</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window">Ext.Window</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">ancCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt>  CSS class name for the popup&#8217;s anchor.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">anchored</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>  The popup begins anchored to its location.  Default is
+<tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">location</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt> or <tt class="docutils literal"><span class="pre">OpenLayers.LonLat</span></tt> or
+<tt class="docutils literal"><span class="pre">OpenLayers.Pixel</span></tt> or <tt class="docutils literal"><span class="pre">OpenLayers.Geometry</span></tt> A location for this
+popup&#8217;s anchor.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <a title="GeoExt.MapPanel" class="reference external" href="MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>
+The map this popup will be anchored to (only required if <tt class="docutils literal"><span class="pre">anchored</span></tt>
+is set to true and the map cannot be derived from the <tt class="docutils literal"><span class="pre">location</span></tt>&#8216;s
+layer.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">panIn</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> The popup should pan the map so that the popup is
+fully in view when it is rendered.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">popupCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> CSS class name for the popup DOM elements.  Default is
+&#8220;gx-popup&#8221;.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">unpinnable</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> The popup should have a &#8220;unpin&#8221; tool that unanchors it from
+its location.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Window">Ext.Window</a>.</p>
+<dl class="method">
+<dt id="GeoExt.Popup.setSize">
+<tt class="descclassname">Popup.</tt><tt class="descname">setSize</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.Popup.setSize" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>w</em> &#8211; <tt class="docutils literal"><span class="pre">Integer</span></tt></li>
+<li><em>h</em> &#8211; <tt class="docutils literal"><span class="pre">Integer</span></tt></li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Sets the size of the popup, taking into account the size of the anchor.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintMapPanel.html" title="GeoExt.PrintMapPanel"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="MapPanel.html" title="GeoExt.MapPanel"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerOpacitySlider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerOpacitySlider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/LayerOpacitySlider.html	(revision 76)
@@ -0,0 +1,272 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.LayerOpacitySlider &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.LegendImage" href="LegendImage.html" />
+    <link rel="prev" title="GeoExt.LayerLegend" href="LayerLegend.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerLegend.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LegendImage.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-layeropacityslider">
+<h1><a title="GeoExt.LayerOpacitySlider" class="reference internal" href="#GeoExt.LayerOpacitySlider"><tt class="xref docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a><a class="headerlink" href="#geoext-layeropacityslider" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_opacityslider</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.LayerOpacitySlider">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">LayerOpacitySlider</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.LayerOpacitySlider" title="Permalink to this definition">Â¶</a></dt>
+<dd>Create a slider for controlling a layer&#8217;s opacity.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to render a slider outside the map viewport:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">slider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">LayerOpacitySlider</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">200</span><span class="p">,</span>
+    <span class="nx">layer</span><span class="o">:</span> <span class="nx">layer</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+<p>Sample code to add a slider to a map panel:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">layer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+    <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span>
+    <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+    <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+<span class="p">);</span>
+<span class="kd">var</span> <span class="nx">panel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
+    <span class="nx">width</span><span class="o">:</span> <span class="mi">400</span><span class="p">,</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="p">{</span>
+        <span class="nx">controls</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Control</span><span class="p">.</span><span class="nx">Navigation</span><span class="p">()]</span>
+    <span class="p">},</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="nx">layer</span><span class="p">],</span>
+    <span class="nx">extent</span><span class="o">:</span> <span class="p">[</span><span class="o">-</span><span class="mi">5</span><span class="p">,</span> <span class="mi">35</span><span class="p">,</span> <span class="mi">15</span><span class="p">,</span> <span class="mi">55</span><span class="p">],</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;gx_opacityslider&quot;</span><span class="p">,</span>
+        <span class="nx">layer</span><span class="o">:</span> <span class="nx">layer</span><span class="p">,</span>
+        <span class="nx">aggressive</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">vertical</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+        <span class="nx">height</span><span class="o">:</span> <span class="mi">100</span><span class="p">,</span>
+        <span class="nx">x</span><span class="o">:</span> <span class="mi">10</span><span class="p">,</span>
+        <span class="nx">y</span><span class="o">:</span> <span class="mi">20</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">aggressive</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+If set to true, the opacity is changed as soon as the thumb is moved.
+Otherwise when the thumb is released (default).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">changeVisibility</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+If set to true, the layer&#8217;s visibility is handled by the
+slider, the slider makes the layer invisible when its
+value is changed to the min value, and makes the layer
+visible again when its value goes from the min value
+to some other value. The layer passed to the constructor
+must be visible, as its visibility is fully handled by
+the slider. Defaults to false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">changeVisibilityDelay</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt> Time in milliseconds before changing the layer&#8217;s visibility.
+If the value changes again within that time, the layer&#8217;s visibility
+change does not occur. Only applicable if changeVisibility is true.
+Defaults to 5.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">complementaryLayer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> or <a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>
+If provided, a layer that will be made invisible (its visibility is
+set to false) when the slider value is set to its max value. If this
+slider is used to fade visibility between to layers, setting
+<tt class="docutils literal"><span class="pre">complementaryLayer</span></tt> and <tt class="docutils literal"><span class="pre">changeVisibility</span></tt> will make sure that
+only visible tiles are loaded when the slider is set to its min or max
+value. (optional)</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">delay</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt> Time in milliseconds before setting the opacity value to the
+layer. If the value change again within that time, the original value
+is not set. Only applicable if aggressive is true.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">inverse</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+If true, we will work with transparency instead of with opacity.
+Defaults to false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> or <a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>
+The layer this slider changes the opacity of. (required)</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">value</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>
+The value to initialize the slider with. This value is
+taken into account only if the layer&#8217;s opacity is null.
+If the layer&#8217;s opacity is null and this value is not
+defined in the config object then the slider initializes
+it to the max value.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Slider">Ext.Slider</a>.</p>
+<dl class="method">
+<dt id="GeoExt.LayerOpacitySlider.setLayer">
+<tt class="descclassname">LayerOpacitySlider.</tt><tt class="descname">setLayer</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.LayerOpacitySlider.setLayer" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layer</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> or <a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></td>
+</tr>
+</tbody>
+</table>
+<p>Bind a new layer to the opacity slider.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LegendImage.html" title="GeoExt.LegendImage"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerLegend.html" title="GeoExt.LayerLegend"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/PrintMapPanel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/PrintMapPanel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets/PrintMapPanel.html	(revision 76)
@@ -0,0 +1,332 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.PrintMapPanel &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="Widgets" href="../widgets.html" />
+    <link rel="next" title="GeoExt.UrlLegend" href="UrlLegend.html" />
+    <link rel="prev" title="GeoExt.Popup" href="Popup.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" accesskey="U">Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="Popup.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="UrlLegend.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-printmappanel">
+<h1><a title="GeoExt.PrintMapPanel" class="reference internal" href="#GeoExt.PrintMapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a><a class="headerlink" href="#geoext-printmappanel" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a></li>
+<li><a title="GeoExt.MapPanel" class="reference external" href="MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></li>
+</ul>
+</dd>
+<dt>xtype</dt>
+<dd><tt class="docutils literal"><span class="pre">gx_printmappanel</span></tt></dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.PrintMapPanel">
+<em class="property">class </em><tt class="descclassname">GeoExt.</tt><tt class="descname">PrintMapPanel</tt><a class="headerlink" href="#GeoExt.PrintMapPanel" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>A map panel that controls scale and center of a print page. Based on the
+current view (i.e. layers and extent) of a source map, this panel will be
+sized according to the aspect ratio of the print page. As the user zooms
+and pans in the <a title="GeoExt.PrintMapPanel" class="reference internal" href="#GeoExt.PrintMapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a>, the print page will update
+its scale and center accordingly. If the scale on the print page changes
+(e.g. by setting it using a combo box with a
+<a title="GeoExt.plugins.PrintPageField" class="reference external" href="../plugins/PrintPageField.html#GeoExt.plugins.PrintPageField"><tt class="xref docutils literal"><span class="pre">GeoExt.plugins.PrintPageField</span></tt></a>), the extent of the
+<a title="GeoExt.PrintMapPanel" class="reference internal" href="#GeoExt.PrintMapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a> will be updated to match the page bounds.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">The <tt class="docutils literal"><span class="pre">zoom</span></tt>, <tt class="docutils literal"><span class="pre">center</span></tt> and <tt class="docutils literal"><span class="pre">extent</span></tt> config options will have
+no affect, as they will be determined by the <tt class="docutils literal"><span class="pre">sourceMap</span></tt>.</p>
+</div>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>A map with a &#8220;Print...&#8221; button. If clicked, a dialog containing a
+PrintMapPanel will open, with a &#8220;Create PDF&#8221; button.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;map&quot;</span><span class="p">,</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span><span class="s2">&quot;Tasmania State Boundaries&quot;</span><span class="p">,</span>
+        <span class="s2">&quot;http://demo.opengeo.org/geoserver/wms&quot;</span><span class="p">,</span>
+        <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;topp:tasmania_state_boundaries&quot;</span><span class="p">},</span> <span class="p">{</span><span class="nx">singleTile</span><span class="o">:</span> <span class="kc">true</span><span class="p">})],</span>
+    <span class="nx">center</span><span class="o">:</span> <span class="p">[</span><span class="mf">146.56</span><span class="p">,</span> <span class="o">-</span><span class="mf">41.56</span><span class="p">],</span>
+    <span class="nx">zoom</span><span class="o">:</span> <span class="mi">6</span><span class="p">,</span>
+    <span class="nx">bbar</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;Print...&quot;</span><span class="p">,</span>
+        <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+            <span class="kd">var</span> <span class="nx">printDialog</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Window</span><span class="p">({</span>
+                <span class="nx">autoHeight</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span>
+                <span class="nx">width</span><span class="o">:</span> <span class="mi">350</span><span class="p">,</span>
+                <span class="nx">items</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">PrintMapPanel</span><span class="p">({</span>
+                    <span class="nx">sourceMap</span><span class="o">:</span> <span class="nx">mapPanel</span><span class="p">,</span>
+                    <span class="nx">printProvider</span><span class="o">:</span> <span class="p">{</span>
+                        <span class="nx">capabilities</span><span class="o">:</span> <span class="nx">printCapabilities</span>
+                    <span class="p">}</span>
+                <span class="p">})],</span>
+                <span class="nx">bbar</span><span class="o">:</span> <span class="p">[{</span>
+                    <span class="nx">text</span><span class="o">:</span> <span class="s2">&quot;Create PDF&quot;</span><span class="p">,</span>
+                    <span class="nx">handler</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+                        <span class="nx">printDialog</span><span class="p">.</span><span class="nx">items</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="mi">0</span><span class="p">).</span><span class="nx">print</span><span class="p">();</span>
+                    <span class="p">}</span>
+                <span class="p">}]</span>
+            <span class="p">});</span>
+            <span class="nx">printDialog</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
+        <span class="p">}</span>
+    <span class="p">}]</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">center</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.LonLat</span></tt> or <tt class="docutils literal"><span class="pre">Array(Number)</span></tt>  A location for the map
+center. Do not set, as this will be overridden with the <tt class="docutils literal"><span class="pre">sourceMap</span></tt>
+center.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">extent</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Bounds</span> <span class="pre">or</span> <span class="pre">Array(Number)</span></tt>  An initial extent for the map.
+Do not set, because the initial extent will be determined by the
+<tt class="docutils literal"><span class="pre">sourceMap</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layers</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span> <span class="pre">or</span> <span class="pre">GeoExt.data.GroupingStore</span> <span class="pre">or</span> <span class="pre">Array(OpenLayers.Layer)</span></tt>
+A store holding records. The layers provided here will be added to this
+MapPanel&#8217;s map when it is rendered.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">limitScales</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> If set to true, the printPage cannot be set to scales that
+would generate a preview in this <a title="GeoExt.PrintMapPanel" class="reference internal" href="#GeoExt.PrintMapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a> with a
+completely different extent than the one that would appear on the
+printed map. Default is false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Optional configuration for the <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> object
+that this PrintMapPanel creates. Useful e.g. to configure a map with a
+custom set of controls, or to add a <tt class="docutils literal"><span class="pre">preaddlayer</span></tt> listener for
+filtering out layer types that cannot be printed.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">prettyStateKeys</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> Set this to true if you want pretty strings in the MapPanel&#8217;s
+state keys. More specifically, layer.name instead of layer.id will be used
+in the state keys if this option is set to true. But in that case you have
+to make sure you don&#8217;t have two layers with the same name. Defaults to
+false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">printProvider</tt></dt>
+<dd><p><a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> or <tt class="docutils literal"><span class="pre">Object</span></tt> PrintProvider to use
+for printing. If an <tt class="docutils literal"><span class="pre">Object</span></tt> is provided, a new PrintProvider will
+be created and configured with the object.</p>
+<div class="admonition note">
+<p class="first admonition-title">Note</p>
+<p class="last">The PrintMapPanel requires the printProvider&#8217;s capabilities
+to be available upon initialization. This means that a PrintMapPanel
+configured with an <tt class="docutils literal"><span class="pre">Object</span></tt> as <tt class="docutils literal"><span class="pre">printProvider</span></tt> will only work
+when <tt class="docutils literal"><span class="pre">capabilities</span></tt> is provided in the printProvider&#8217;s
+configuration object. If <tt class="docutils literal"><span class="pre">printProvider</span></tt> is provided as an instance
+of <a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a>, the capabilities must be
+loaded before PrintMapPanel initialization.</p>
+</div>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">sourceMap</tt></dt>
+<dd><a title="GeoExt.MapPanel" class="reference external" href="MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> or <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> The map that is to be
+printed.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">zoom</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>  An initial zoom level for the map. Do not set, because the
+initial extent will be determined by the <tt class="docutils literal"><span class="pre">sourceMap</span></tt>.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.PrintMapPanel.layers">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">layers</tt><a class="headerlink" href="#GeoExt.PrintMapPanel.layers" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.LayerStore" class="reference external" href="../data/LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a>  A store containing
+<a title="GeoExt.data.LayerRecord" class="reference external" href="../data/LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.PrintMapPanel.map">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">map</tt><a class="headerlink" href="#GeoExt.PrintMapPanel.map" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <tt class="docutils literal"><span class="pre">Object</span></tt>  A map or map configuration.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.PrintMapPanel.previewScales">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">previewScales</tt><a class="headerlink" href="#GeoExt.PrintMapPanel.previewScales" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.Store</span></tt> A data store with a subset of the printProvider&#8217;s
+scales. By default, this contains all the scales of the printProvider.
+If <tt class="docutils literal"><span class="pre">limitScales</span></tt> is set to true, it will only contain print scales
+that can properly be previewed with this <a title="GeoExt.PrintMapPanel" class="reference internal" href="#GeoExt.PrintMapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a>.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.PrintMapPanel.printPage">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">printPage</tt><a class="headerlink" href="#GeoExt.PrintMapPanel.printPage" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.PrintPage" class="reference external" href="../data/PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> PrintPage for this PrintMapPanel.
+Read-only.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.PrintMapPanel.printProvider">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">printProvider</tt><a class="headerlink" href="#GeoExt.PrintMapPanel.printProvider" title="Permalink to this definition">Â¶</a></dt>
+<dd><a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> PrintProvider for this
+PrintMapPanel.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.Panel">Ext.Panel</a>.</p>
+<dl class="method">
+<dt id="GeoExt.PrintMapPanel.print">
+<tt class="descclassname">PrintMapPanel.</tt><tt class="descname">print</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.PrintMapPanel.print" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> options for
+the <a title="GeoExt.data.PrintProvider" class="reference external" href="../data/PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> :: <tt class="docutils literal"><span class="pre">print</span></tt>  method.</td>
+</tr>
+</tbody>
+</table>
+<p>Convenience method for printing the map, without the need to
+interact with the printProvider and printPage.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="UrlLegend.html" title="GeoExt.UrlLegend"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="Popup.html" title="GeoExt.Popup"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../widgets.html" >Widgets</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureReader.html	(revision 76)
@@ -0,0 +1,178 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.FeatureReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.FeatureRecord" href="FeatureRecord.html" />
+    <link rel="prev" title="GeoExt.data.AttributeStore" href="AttributeStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="AttributeStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="FeatureRecord.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-featurereader">
+<h1><a title="GeoExt.data.FeatureReader" class="reference internal" href="#GeoExt.data.FeatureReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a><a class="headerlink" href="#geoext-data-featurereader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.FeatureReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">FeatureReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureReader" title="Permalink to this definition">Â¶</a></dt>
+<dd>Data reader class to create an array of
+<a title="GeoExt.data.FeatureRecord" class="reference external" href="FeatureRecord.html#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a> objects from an
+<tt class="docutils literal"><span class="pre">OpenLayers.Protocol.Response</span></tt> object for use in a
+<a title="GeoExt.data.FeatureStore" class="reference external" href="FeatureStore.html#GeoExt.data.FeatureStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a> object.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Typical usage in a store:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">store</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">Store</span><span class="p">({</span>
+    <span class="nx">reader</span><span class="o">:</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">FeatureReader</span><span class="p">({},</span> <span class="p">[</span>
+        <span class="p">{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;name&#39;</span><span class="p">,</span> <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;string&#39;</span><span class="p">},</span>
+        <span class="p">{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;elevation&#39;</span><span class="p">,</span> <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;float&#39;</span><span class="p">}</span>
+    <span class="p">])</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.FeatureReader.readRecords">
+<tt class="descclassname">FeatureReader.</tt><tt class="descname">readRecords</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureReader.readRecords" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>features</em> &#8211; <tt class="docutils literal"><span class="pre">Array(OpenLayers.Feature.Vector)</span></tt> List of
+features for creating records</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Object</span></tt>  An object with <tt class="docutils literal"><span class="pre">records</span></tt> and <tt class="docutils literal"><span class="pre">totalRecords</span></tt>
+properties.</td>
+</tr>
+</tbody>
+</table>
+<p>Create a data block containing <a title="GeoExt.data.FeatureRecord" class="reference external" href="FeatureRecord.html#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a>
+objects from an array of features.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="FeatureRecord.html" title="GeoExt.data.FeatureRecord"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="AttributeStore.html" title="GeoExt.data.AttributeStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeStore.html	(revision 76)
@@ -0,0 +1,176 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.AttributeStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.FeatureReader" href="FeatureReader.html" />
+    <link rel="prev" title="GeoExt.data.AttributeReader" href="AttributeReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="AttributeReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="FeatureReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-attributestore">
+<h1><a title="GeoExt.data.AttributeStore" class="reference internal" href="#GeoExt.data.AttributeStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a><a class="headerlink" href="#geoext-data-attributestore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.AttributeStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">AttributeStore</tt><big>(</big><em>config</em><big>)</big><a class="headerlink" href="#GeoExt.data.AttributeStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>Small helper class to make creating stores for remotely-loaded attributes
+data easier. AttributeStore is pre-configured with a built-in
+<tt class="docutils literal"><span class="pre">Ext.data.HttpProxy</span></tt> and <a title="GeoExt.data.AttributeReader" class="reference external" href="AttributeReader.html#GeoExt.data.AttributeReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a>.  The
+HttpProxy is configured to allow caching (disableCaching: false) and
+uses GET. If you require some other proxy/reader combination then you&#8217;ll
+have to configure this with your own proxy or create a basic
+<tt class="docutils literal"><span class="pre">Ext.data.Store</span></tt> and configure as needed.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">feature</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt>
+A vector feature. If provided, and if the reader is a
+<a title="GeoExt.data.AttributeReader" class="reference external" href="AttributeReader.html#GeoExt.data.AttributeReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a> (the default), then records
+of this store will include a field named &#8220;value&#8221; referencing the
+corresponding attribute value in the feature. And if the &#8220;value&#8221;
+field of a record is updated the update will propagate to the
+corresponding feature attribute. Optional.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">fields</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array</span> <span class="pre">or</span> <span class="pre">Function</span></tt>
+Either an array of field definition objects as passed to
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>, or a record constructor created using
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>.  Defaults to <tt class="docutils literal"><span class="pre">[&quot;name&quot;,</span> <span class="pre">&quot;type&quot;,</span> <span class="pre">&quot;restriction&quot;]</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">format</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt>
+A parser for transforming the XHR response into an array of objects
+representing attributes.  Defaults to an
+<tt class="docutils literal"><span class="pre">OpenLayers.Format.WFSDescribeFeatureType</span></tt> parser.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="FeatureReader.html" title="GeoExt.data.FeatureReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="AttributeReader.html" title="GeoExt.data.AttributeReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerStore.html	(revision 76)
@@ -0,0 +1,165 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WMSDescribeLayerStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.plugins" href="../plugins.html" />
+    <link rel="prev" title="GeoExt.data.WMSDescribeLayerReader" href="WMSDescribeLayerReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WMSDescribeLayerReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="../plugins.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.plugins</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wmsdescribelayerstore">
+<h1><a title="GeoExt.data.WMSDescribeLayerStore" class="reference internal" href="#GeoExt.data.WMSDescribeLayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a><a class="headerlink" href="#geoext-data-wmsdescribelayerstore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WMSDescribeLayerStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WMSDescribeLayerStore</tt><a class="headerlink" href="#GeoExt.data.WMSDescribeLayerStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>Small helper class to make creating stores for remote WMS layer description
+easier.  The store is pre-configured with a built-in
+<tt class="docutils literal"><span class="pre">Ext.data.HttpProxy</span></tt> and <a title="GeoExt.data.WMSDescribeLayerReader" class="reference external" href="WMSDescribeLayerReader.html#GeoExt.data.WMSDescribeLayerReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a>.
+The proxy is configured to allow caching and issues requests via GET.
+If you require some other proxy/reader combination then you&#8217;ll have to
+configure this with your own proxy or create a basic
+store and configure as needed.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">fields</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Function</span></tt>
+Either an Array of field definition objects as passed to
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>, or a record constructor created using
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>.  Defaults to <tt class="docutils literal"><span class="pre">[&quot;name&quot;,</span> <span class="pre">&quot;type&quot;]</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">format</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt>
+A parser for transforming the XHR response into an array of objects
+representing attributes.  Defaults to an <tt class="docutils literal"><span class="pre">OpenLayers.Format.WMSDescribeLayer</span></tt>
+parser.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="../plugins.html" title="GeoExt.plugins"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WMSDescribeLayerReader.html" title="GeoExt.data.WMSDescribeLayerReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/AttributeReader.html	(revision 76)
@@ -0,0 +1,155 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.AttributeReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.AttributeStore" href="AttributeStore.html" />
+    <link rel="prev" title="GeoExt.data" href="../data.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../data.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="AttributeStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-attributereader">
+<h1><a title="GeoExt.data.AttributeReader" class="reference internal" href="#GeoExt.data.AttributeReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a><a class="headerlink" href="#geoext-data-attributereader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.AttributeReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">AttributeReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.AttributeReader" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>meta</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Reader configuration.</li>
+<li><em>recordType</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span> <span class="pre">or</span> <span class="pre">Ext.data.Record</span></tt> An array of field
+configuration objects or a record object.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Create a new attributes reader object.</p>
+<p>Valid meta properties:</p>
+<ul class="simple">
+<li>format - <tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt> A parser for transforming the XHR response
+into an array of objects representing attributes.  Defaults to
+an <tt class="docutils literal"><span class="pre">OpenLayers.Format.WFSDescribeFeatureType</span></tt> parser.</li>
+<li>ignore - <tt class="docutils literal"><span class="pre">Object</span></tt> Properties of the ignore object should be field names.
+Values are either arrays or regular expressions.</li>
+<li>feature - <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt> A vector feature. If provided
+records created by the reader will include a field named &#8220;value&#8221;
+referencing the attribute value as set in the feature.</li>
+</ul>
+</dd></dl>
+
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="AttributeStore.html" title="GeoExt.data.AttributeStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../data.html" title="GeoExt.data"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesStore.html	(revision 76)
@@ -0,0 +1,165 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WFSCapabilitiesStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WMCReader" href="WMCReader.html" />
+    <link rel="prev" title="GeoExt.data.WFSCapabilitiesReader" href="WFSCapabilitiesReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WFSCapabilitiesReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMCReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wfscapabilitiesstore">
+<h1><a title="GeoExt.data.WFSCapabilitiesStore" class="reference internal" href="#GeoExt.data.WFSCapabilitiesStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a><a class="headerlink" href="#geoext-data-wfscapabilitiesstore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WFSCapabilitiesStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WFSCapabilitiesStore</tt><a class="headerlink" href="#GeoExt.data.WFSCapabilitiesStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>Small helper class to make creating stores for remote WFS layer data
+easier.  The store is pre-configured with a built-in
+<tt class="docutils literal"><span class="pre">Ext.data.HttpProxy</span></tt> and <a title="GeoExt.data.WFSCapabilitiesReader" class="reference external" href="WFSCapabilitiesReader.html#GeoExt.data.WFSCapabilitiesReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a>.
+The proxy is configured to allow caching and issues requests via GET.
+If you require some other proxy/reader combination then you&#8217;ll have to
+configure this with your own proxy or create a basic
+<a title="GeoExt.data.LayerStore" class="reference external" href="LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> and configure as needed.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">fields</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Function</span></tt>
+Either an Array of field definition objects as passed to
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>, or a record constructor created using
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>.  Defaults to <tt class="docutils literal"><span class="pre">[&quot;name&quot;,</span> <span class="pre">&quot;type&quot;]</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">format</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt>
+A parser for transforming the XHR response into an array of objects
+representing attributes.  Defaults to an <tt class="docutils literal"><span class="pre">OpenLayers.Format.WFSCapabilities</span></tt>
+parser.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMCReader.html" title="GeoExt.data.WMCReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WFSCapabilitiesReader.html" title="GeoExt.data.WFSCapabilitiesReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSDescribeLayerReader.html	(revision 76)
@@ -0,0 +1,147 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WMSDescribeLayerReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WMSDescribeLayerStore" href="WMSDescribeLayerStore.html" />
+    <link rel="prev" title="GeoExt.data.WMSCapabilitiesStore" href="WMSCapabilitiesStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WMSCapabilitiesStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSDescribeLayerStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wmsdescribelayerreader">
+<h1><a title="GeoExt.data.WMSDescribeLayerReader" class="reference internal" href="#GeoExt.data.WMSDescribeLayerReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a><a class="headerlink" href="#geoext-data-wmsdescribelayerreader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WMSDescribeLayerReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WMSDescribeLayerReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.WMSDescribeLayerReader" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>meta</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Reader configuration.</li>
+<li><em>recordType</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Ext.data.Record</span></tt> An array of field
+configuration objects or a record object.  Default has
+fields for owsType, owsURL, and typeName.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Data reader class to create an array of
+layer description objects from a WMS DescribeLayer
+response.</p>
+</dd></dl>
+
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSDescribeLayerStore.html" title="GeoExt.data.WMSDescribeLayerStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WMSCapabilitiesStore.html" title="GeoExt.data.WMSCapabilitiesStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerStore.html	(revision 76)
@@ -0,0 +1,210 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.LayerStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.PrintPage" href="PrintPage.html" />
+    <link rel="prev" title="GeoExt.data.LayerRecord" href="LayerRecord.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerRecord.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintPage.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-layerstore">
+<h1><a title="GeoExt.data.LayerStore" class="reference internal" href="#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a><a class="headerlink" href="#geoext-data-layerstore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.LayerStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">LayerStore</tt><a class="headerlink" href="#GeoExt.data.LayerStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>A store that contains a cache of <a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>
+objects.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample to create a new store containing a cache of
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> instances derived from map layers.</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">store</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">LayerStore</span><span class="p">({</span>
+    <span class="nx">map</span><span class="o">:</span> <span class="nx">myMap</span><span class="p">,</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="nx">myLayers</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">fields</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array</span></tt>
+If provided a custom layer record type with additional fields will be
+used. Default fields for every layer record are <cite>layer</cite>
+(<tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt>) <cite>title</cite> (<tt class="docutils literal"><span class="pre">String</span></tt>). The value of this option is
+either a field definition objects as passed to the
+<a title="GeoExt.data.LayerRecord.create" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord.create"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord.create()</span></tt></a> function or a
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> constructor created using
+<a title="GeoExt.data.LayerRecord.create" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord.create"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord.create()</span></tt></a>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">initDir</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>
+Bitfields specifying the direction to use for the initial sync between
+the map and the store, if set to 0 then no initial sync is done.
+Defaults to <tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore.MAP_TO_STORE|GeoExt.data.LayerStore.STORE_TO_MAP</span></tt></dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layers</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(OpenLayers.Layer)</span></tt>
+Layers that will be added to the store (and the map, depending on the
+value of the <tt class="docutils literal"><span class="pre">initDir</span></tt> option.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt>
+Map that this store will be in sync with. If not provided, the
+store will not be bound to a map.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">reader</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.DataReader</span></tt> The reader used to produce
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects from <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt>
+objects.  If not provided, a <a title="GeoExt.data.LayerReader" class="reference external" href="LayerReader.html#GeoExt.data.LayerReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a> will be
+used.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.data.LayerStore.map">
+<tt class="descclassname">LayerStore.</tt><tt class="descname">map</tt><a class="headerlink" href="#GeoExt.data.LayerStore.map" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt>
+Map that the store is synchronized with, if any.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintPage.html" title="GeoExt.data.PrintPage"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerRecord.html" title="GeoExt.data.LayerRecord"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintPage.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintPage.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintPage.html	(revision 76)
@@ -0,0 +1,325 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.PrintPage &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.PrintProvider" href="PrintProvider.html" />
+    <link rel="prev" title="GeoExt.data.LayerStore" href="LayerStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="PrintProvider.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-printpage">
+<h1><a title="GeoExt.data.PrintPage" class="reference internal" href="#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a><a class="headerlink" href="#geoext-data-printpage" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.PrintPage">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">PrintPage</tt><a class="headerlink" href="#GeoExt.data.PrintPage" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>Provides a representation of a print page for
+<a title="GeoExt.data.PrintProvider" class="reference external" href="PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a>. The extent of the page is stored as
+<tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt>. Widgets can use this to display the print
+extent on the map.</p>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">customParams</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Key-value pairs of additional parameters that the
+printProvider will send to the print service for this page.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">printProvider</tt></dt>
+<dd><a title="GeoExt.data.PrintProvider" class="reference external" href="PrintProvider.html#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> The print provider to use with
+this page.</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.data.PrintPage.center">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">center</tt><a class="headerlink" href="#GeoExt.data.PrintPage.center" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.LonLat</span></tt> The current center of the page. Read-only.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintPage.customParams">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">customParams</tt><a class="headerlink" href="#GeoExt.data.PrintPage.customParams" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Key-value pairs of additional parameters that the
+printProvider will send to the print service for this page.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintPage.feature">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">feature</tt><a class="headerlink" href="#GeoExt.data.PrintPage.feature" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt> Feature representing the page extent. To
+get the extent of the print page for a specific map, use
+<tt class="docutils literal"><span class="pre">getPrintExtent</span></tt>.
+Read-only.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintPage.rotation">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">rotation</tt><a class="headerlink" href="#GeoExt.data.PrintPage.rotation" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Float</span></tt> The current rotation of the page. Read-only.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintPage.scale">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">scale</tt><a class="headerlink" href="#GeoExt.data.PrintPage.scale" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> The current scale record of the page. Read-only.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.PrintPage.fit">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">fit</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintPage.fit" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>fitTo</em> &#8211; <a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> or <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt>
+The map or feature to fit the page to.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Additional options to determine how to fit</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Fits the page layout to a map or feature extent. If the map extent has
+not been centered yet, this will do nothing.</p>
+<p>Available options:</p>
+<ul class="simple">
+<li>mode - <tt class="docutils literal"><span class="pre">String</span></tt> How to calculate the print extent? If &#8220;closest&#8221;,
+the closest matching print extent will be chosen. If &#8220;printer&#8221;, the
+chosen print extent will be the closest one that can show the entire
+<tt class="docutils literal"><span class="pre">fitTo</span></tt> extent on the printer. If &#8220;screen&#8221;, it will be the closest
+one that is entirely visible inside the <tt class="docutils literal"><span class="pre">fitTo</span></tt> extent. Default is
+&#8220;printer&#8221;.</li>
+</ul>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintPage.getPrintExtent">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">getPrintExtent</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintPage.getPrintExtent" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>map</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> the map to
+get the print extent for.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">OpenLayers.Bounds</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Gets this page&#8217;s print extent for the provided map.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintPage.setCenter">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">setCenter</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintPage.setCenter" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>center</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.LonLat</span></tt> The new center.</td>
+</tr>
+</tbody>
+</table>
+<p>Moves the page extent to a new center.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintPage.setRotation">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">setRotation</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintPage.setRotation" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>rotation</em> &#8211; <tt class="docutils literal"><span class="pre">Float</span></tt> The new rotation.</li>
+<li><em>force</em> &#8211; <tt class="docutils literal"><span class="pre">Boolean</span></tt> If set to true, the rotation will also be
+set when the layout does not support it. Default is false.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Sets a new rotation for the page geometry.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintPage.setScale">
+<tt class="descclassname">PrintPage.</tt><tt class="descname">setScale</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintPage.setScale" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>scale</em> &#8211; <tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> The new scale record.</li>
+<li><em>units</em> &#8211; <tt class="docutils literal"><span class="pre">String</span></tt> map units to use for the scale calculation.
+Optional if the <tt class="docutils literal"><span class="pre">feature</span></tt> is on a layer which is added to a map.
+If not found, &#8220;dd&#8221; will be assumed.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Updates the page geometry to match a given scale. Since this takes the
+current layout of the printProvider into account, this can be used to
+update the page geometry feature when the layout has changed.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">change</tt></dt>
+<dd><p>Triggered when any of the page properties have changed</p>
+<p>Listener arguments:</p>
+<ul>
+<li><p class="first">printPage - <a title="GeoExt.data.PrintPage" class="reference internal" href="#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> this printPage</p>
+</li>
+<li><dl class="first docutils">
+<dt>modifications - <tt class="docutils literal"><span class="pre">Object</span></tt> Object with one or more of</dt>
+<dd><p class="first last"><tt class="docutils literal"><span class="pre">scale</span></tt>, <tt class="docutils literal"><span class="pre">center</span></tt> and <tt class="docutils literal"><span class="pre">rotation</span></tt>, notifying
+listeners of the changed properties.</p>
+</dd>
+</dl>
+</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="PrintProvider.html" title="GeoExt.data.PrintProvider"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerStore.html" title="GeoExt.data.LayerStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureRecord.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureRecord.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureRecord.html	(revision 76)
@@ -0,0 +1,202 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.FeatureRecord &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.FeatureStore" href="FeatureStore.html" />
+    <link rel="prev" title="GeoExt.data.FeatureReader" href="FeatureReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a><ul>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#class-methods">Class Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="FeatureReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="FeatureStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-featurerecord">
+<h1><a title="GeoExt.data.FeatureRecord" class="reference internal" href="#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a><a class="headerlink" href="#geoext-data-featurerecord" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.FeatureRecord">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">FeatureRecord</tt><a class="headerlink" href="#GeoExt.data.FeatureRecord" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A record that represents an <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt>. This record
+will always have at least the following fields:</p>
+<ul class="simple">
+<li>state <tt class="docutils literal"><span class="pre">String</span></tt></li>
+<li>fid <tt class="docutils literal"><span class="pre">String</span></tt></li>
+</ul>
+</dd></dl>
+
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.FeatureRecord.getFeature">
+<tt class="descclassname">FeatureRecord.</tt><tt class="descname">getFeature</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureRecord.getFeature" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Gets the feature for this record.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.FeatureRecord.setLayer">
+<tt class="descclassname">FeatureRecord.</tt><tt class="descname">setLayer</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureRecord.setLayer" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layer</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Feature.Vector</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Sets the feature for this record.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="class-methods">
+<h2>Class Methods<a class="headerlink" href="#class-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Class methods in addition to static methods
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a>.</p>
+<dl class="classmethod">
+<dt id="GeoExt.data.FeatureRecord.create">
+<em class="property">classmethod </em><tt class="descclassname">FeatureRecord.</tt><tt class="descname">create</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureRecord.create" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>o</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span></tt> Field definition as in <tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>. Can
+be omitted if no additional fields are required.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Function</span></tt> A specialized <a title="GeoExt.data.FeatureRecord" class="reference internal" href="#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a>
+constructor.</td>
+</tr>
+</tbody>
+</table>
+<p>Creates a constructor for a <a title="GeoExt.data.FeatureRecord" class="reference internal" href="#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a>, optionally
+with additional fields.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="FeatureStore.html" title="GeoExt.data.FeatureStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="FeatureReader.html" title="GeoExt.data.FeatureReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WFSCapabilitiesReader.html	(revision 76)
@@ -0,0 +1,147 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WFSCapabilitiesReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WFSCapabilitiesStore" href="WFSCapabilitiesStore.html" />
+    <link rel="prev" title="GeoExt.data.ScaleStore" href="ScaleStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="ScaleStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WFSCapabilitiesStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wfscapabilitiesreader">
+<h1><a title="GeoExt.data.WFSCapabilitiesReader" class="reference internal" href="#GeoExt.data.WFSCapabilitiesReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a><a class="headerlink" href="#geoext-data-wfscapabilitiesreader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WFSCapabilitiesReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WFSCapabilitiesReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.WFSCapabilitiesReader" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>meta</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Reader configuration.</li>
+<li><em>recordType</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Ext.data.Record</span></tt> An array of field
+configuration objects or a record object.  Default is
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Data reader class to create an array of
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects from a WFS GetCapabilities
+response.</p>
+</dd></dl>
+
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WFSCapabilitiesStore.html" title="GeoExt.data.WFSCapabilitiesStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="ScaleStore.html" title="GeoExt.data.ScaleStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesStore.html	(revision 76)
@@ -0,0 +1,165 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WMSCapabilitiesStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WMSDescribeLayerReader" href="WMSDescribeLayerReader.html" />
+    <link rel="prev" title="GeoExt.data.WMSCapabilitiesReader" href="WMSCapabilitiesReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WMSCapabilitiesReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSDescribeLayerReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wmscapabilitiesstore">
+<h1><a title="GeoExt.data.WMSCapabilitiesStore" class="reference internal" href="#GeoExt.data.WMSCapabilitiesStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a><a class="headerlink" href="#geoext-data-wmscapabilitiesstore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WMSCapabilitiesStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WMSCapabilitiesStore</tt><a class="headerlink" href="#GeoExt.data.WMSCapabilitiesStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>Small helper class to make creating stores for remote WMS layer data
+easier.  The store is pre-configured with a built-in
+<tt class="docutils literal"><span class="pre">Ext.data.HttpProxy</span></tt> and <a title="GeoExt.data.WMSCapabilitiesReader" class="reference external" href="WMSCapabilitiesReader.html#GeoExt.data.WMSCapabilitiesReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a>.
+The proxy is configured to allow caching and issues requests via GET.
+If you require some other proxy/reader combination then you&#8217;ll have to
+configure this with your own proxy or create a basic
+<a title="GeoExt.data.LayerStore" class="reference external" href="LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> and configure as needed.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">fields</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Function</span></tt>
+Either an Array of field definition objects as passed to
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>, or a record constructor created using
+<tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>.  Defaults to <tt class="docutils literal"><span class="pre">[&quot;name&quot;,</span> <span class="pre">&quot;type&quot;]</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">format</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Format</span></tt>
+A parser for transforming the XHR response into an array of objects
+representing attributes.  Defaults to an <tt class="docutils literal"><span class="pre">OpenLayers.Format.WMSCapabilities</span></tt>
+parser.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSDescribeLayerReader.html" title="GeoExt.data.WMSDescribeLayerReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WMSCapabilitiesReader.html" title="GeoExt.data.WMSCapabilitiesReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerReader.html	(revision 76)
@@ -0,0 +1,176 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.LayerReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.LayerRecord" href="LayerRecord.html" />
+    <link rel="prev" title="GeoExt.data.FeatureStore" href="FeatureStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="FeatureStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerRecord.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-layerreader">
+<h1><a title="GeoExt.data.LayerReader" class="reference internal" href="#GeoExt.data.LayerReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a><a class="headerlink" href="#geoext-data-layerreader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.LayerReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">LayerReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.LayerReader" title="Permalink to this definition">Â¶</a></dt>
+<dd>Data reader class to create an array of
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects from an array of
+<tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> objects for use in a
+<a title="GeoExt.data.LayerStore" class="reference external" href="LayerStore.html#GeoExt.data.LayerStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a> object.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample using a reader to create records from an array of layers:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">reader</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">LayerReader</span><span class="p">();</span>
+<span class="kd">var</span> <span class="nx">layerData</span> <span class="o">=</span> <span class="nx">reader</span><span class="p">.</span><span class="nx">readRecords</span><span class="p">(</span><span class="nx">map</span><span class="p">.</span><span class="nx">layers</span><span class="p">);</span>
+<span class="kd">var</span> <span class="nx">numRecords</span> <span class="o">=</span> <span class="nx">layerData</span><span class="p">.</span><span class="nx">totalRecords</span><span class="p">;</span>
+<span class="kd">var</span> <span class="nx">layerRecords</span> <span class="o">=</span> <span class="nx">layerData</span><span class="p">.</span><span class="nx">records</span><span class="p">;</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.LayerReader.readRecords">
+<tt class="descclassname">LayerReader.</tt><tt class="descname">readRecords</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.LayerReader.readRecords" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layers</em> &#8211; <tt class="docutils literal"><span class="pre">Array(OpenLayers.Layer)</span></tt> List of layers for creating
+records.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Object</span></tt>  An object with <tt class="docutils literal"><span class="pre">records</span></tt> and <tt class="docutils literal"><span class="pre">totalRecords</span></tt>
+properties.</td>
+</tr>
+</tbody>
+</table>
+<p>From an array of <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> objects create a data block
+containing <a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerRecord.html" title="GeoExt.data.LayerRecord"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="FeatureStore.html" title="GeoExt.data.FeatureStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ProtocolProxy.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ProtocolProxy.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ProtocolProxy.html	(revision 76)
@@ -0,0 +1,162 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.ProtocolProxy &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.ScaleStore" href="ScaleStore.html" />
+    <link rel="prev" title="GeoExt.data.PrintProvider" href="PrintProvider.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintProvider.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="ScaleStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-protocolproxy">
+<h1><a title="GeoExt.data.ProtocolProxy" class="reference internal" href="#GeoExt.data.ProtocolProxy"><tt class="xref docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a><a class="headerlink" href="#geoext-data-protocolproxy" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy">Ext.data.DataProxy</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.ProtocolProxy">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">ProtocolProxy</tt><a class="headerlink" href="#GeoExt.data.ProtocolProxy" title="Permalink to this definition">Â¶</a></dt>
+<dd>A data proxy for use with <tt class="docutils literal"><span class="pre">OpenLayers.Protocol</span></tt> objects.</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataProxy">Ext.data.DataProxy</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">abortPrevious</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Abort any previous request before issuing another.  Default is <tt class="docutils literal"><span class="pre">true</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">protocol</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Protocol</span></tt>
+The protocol used to fetch features.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">setParamsAsOptions</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt>
+Should options.params be set directly on options before passing it into
+the protocol&#8217;s read method? Default is <tt class="docutils literal"><span class="pre">false</span></tt>.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="ScaleStore.html" title="GeoExt.data.ScaleStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintProvider.html" title="GeoExt.data.PrintProvider"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMSCapabilitiesReader.html	(revision 76)
@@ -0,0 +1,178 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WMSCapabilitiesReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WMSCapabilitiesStore" href="WMSCapabilitiesStore.html" />
+    <link rel="prev" title="GeoExt.data.WMCReader" href="WMCReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WMCReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSCapabilitiesStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wmscapabilitiesreader">
+<h1><a title="GeoExt.data.WMSCapabilitiesReader" class="reference internal" href="#GeoExt.data.WMSCapabilitiesReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a><a class="headerlink" href="#geoext-data-wmscapabilitiesreader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WMSCapabilitiesReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WMSCapabilitiesReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.WMSCapabilitiesReader" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>meta</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Reader configuration from which:
+<tt class="docutils literal"><span class="pre">layerOptions</span></tt> is an optional object passed as default options
+to the <tt class="docutils literal"><span class="pre">OpenLayers.Layer.WMS</span></tt> constructor.
+<tt class="docutils literal"><span class="pre">layerParams</span></tt> is an optional set of parameters to pass into the
+<tt class="docutils literal"><span class="pre">OpenLayers.Layer.WMS</span></tt> constructor.</li>
+<li><em>recordType</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Ext.data.Record</span></tt> An array of field
+configuration objects or a record object.  Default is
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> with the following fields:
+name, title, abstract, queryable, opaque, noSubsets, cascaded,
+fixedWidth, fixedHeight, minScale, maxScale, prefix, formats,
+styles, srs, dimensions, bbox, llbbox, attribution, keywords,
+identifiers, authorityURLs, metadataURLs.
+The type of these fields is the same as for the matching fields in
+the object returned from
+<tt class="docutils literal"><span class="pre">OpenLayers.Format.WMSCapabilities::read()</span></tt>.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Data reader class to create an array of
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects from a WMS GetCapabilities
+response.</p>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">attributionCls</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> CSS class name for the attribution DOM elements.
+Element class names append &#8220;-link&#8221;, &#8220;-image&#8221;, and &#8220;-title&#8221; as
+appropriate.  Default is &#8220;gx-attribution&#8221;.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSCapabilitiesStore.html" title="GeoExt.data.WMSCapabilitiesStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WMCReader.html" title="GeoExt.data.WMCReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ScaleStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ScaleStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/ScaleStore.html	(revision 76)
@@ -0,0 +1,189 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.ScaleStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WFSCapabilitiesReader" href="WFSCapabilitiesReader.html" />
+    <link rel="prev" title="GeoExt.data.ProtocolProxy" href="ProtocolProxy.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a><ul>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="ProtocolProxy.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WFSCapabilitiesReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-scalestore">
+<h1><a title="GeoExt.data.ScaleStore" class="reference internal" href="#GeoExt.data.ScaleStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a><a class="headerlink" href="#geoext-data-scalestore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.ScaleStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">ScaleStore</tt><a class="headerlink" href="#GeoExt.data.ScaleStore" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A store that contains a cache of available zoom levels.  The store can
+optionally be kept synchronized with an <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or
+<a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> object.</p>
+<p>Records have the following fields:</p>
+<ul class="simple">
+<li>level - <tt class="docutils literal"><span class="pre">Number</span></tt>  The zoom level.</li>
+<li>scale - <tt class="docutils literal"><span class="pre">Number</span></tt> The scale denominator.</li>
+<li>resolution - <tt class="docutils literal"><span class="pre">Number</span></tt> The map units per pixel.</li>
+</ul>
+</dd></dl>
+
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">map</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> or <a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a>
+Optional map or map panel from which to derive scale values.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.ScaleStore.bind">
+<tt class="descclassname">ScaleStore.</tt><tt class="descname">bind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.ScaleStore.bind" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>map</em> &#8211; <a title="GeoExt.MapPanel" class="reference external" href="../widgets/MapPanel.html#GeoExt.MapPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a> or <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> Panel or map
+to which we should bind.</td>
+</tr>
+</tbody>
+</table>
+<p>Bind this store to a map; that is, maintain the zoom list in sync with
+the map&#8217;s current configuration.  If the map does not currently have a
+set scale list, then the store will remain empty until the map is
+configured with one.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.ScaleStore.unbind">
+<tt class="descclassname">ScaleStore.</tt><tt class="descname">unbind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.ScaleStore.unbind" title="Permalink to this definition">Â¶</a></dt>
+<dd>Un-bind this store from the map to which it is currently bound.  The
+currently stored zoom levels will remain, but no further changes from
+the map will affect it.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WFSCapabilitiesReader.html" title="GeoExt.data.WFSCapabilitiesReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="ProtocolProxy.html" title="GeoExt.data.ProtocolProxy"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintProvider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintProvider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/PrintProvider.html	(revision 76)
@@ -0,0 +1,495 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.PrintProvider &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.ProtocolProxy" href="ProtocolProxy.html" />
+    <link rel="prev" title="GeoExt.data.PrintPage" href="PrintPage.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-properties">Public Properties</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#events">Events</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="PrintPage.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="ProtocolProxy.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-printprovider">
+<h1><a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a><a class="headerlink" href="#geoext-data-printprovider" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.PrintProvider">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">PrintProvider</tt><a class="headerlink" href="#GeoExt.data.PrintProvider" title="Permalink to this definition">Â¶</a></dt>
+<dd></dd></dl>
+
+<p>Provides an interface to a Mapfish or GeoServer print module. For printing,
+one or more instances of <a title="GeoExt.data.PrintPage" class="reference external" href="PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> are also required
+to tell the PrintProvider about the scale and extent (and optionally
+rotation) of the page(s) we want to print.</p>
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Minimal code to print as much of the current map extent as possible as
+soon as the print service capabilities are loaded, using the first layout
+reported by the print service:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">mapPanel</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">MapPanel</span><span class="p">({</span>
+    <span class="nx">renderTo</span><span class="o">:</span> <span class="s2">&quot;mappanel&quot;</span><span class="p">,</span>
+    <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span><span class="s2">&quot;wms&quot;</span><span class="p">,</span> <span class="s2">&quot;/geoserver/wms&quot;</span><span class="p">,</span>
+        <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;topp:tasmania_state_boundaries&quot;</span><span class="p">})],</span>
+    <span class="nx">center</span><span class="o">:</span> <span class="p">[</span><span class="mf">146.56</span><span class="p">,</span> <span class="o">-</span><span class="mf">41.56</span><span class="p">],</span>
+    <span class="nx">zoom</span><span class="o">:</span> <span class="mi">7</span>
+<span class="p">});</span>
+<span class="kd">var</span> <span class="nx">printProvider</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintProvider</span><span class="p">({</span>
+    <span class="nx">url</span><span class="o">:</span> <span class="s2">&quot;/geoserver/pdf&quot;</span><span class="p">,</span>
+    <span class="nx">listeners</span><span class="o">:</span> <span class="p">{</span>
+        <span class="s2">&quot;loadcapabilities&quot;</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+            <span class="kd">var</span> <span class="nx">printPage</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">PrintPage</span><span class="p">({</span>
+                <span class="nx">printProvider</span><span class="o">:</span> <span class="nx">printProvider</span>
+            <span class="p">});</span>
+            <span class="nx">printPage</span><span class="p">.</span><span class="nx">fit</span><span class="p">(</span><span class="nx">mapPanel</span><span class="p">,</span> <span class="kc">true</span><span class="p">);</span>
+            <span class="nx">printProvider</span><span class="p">.</span><span class="nx">print</span><span class="p">(</span><span class="nx">mapPanel</span><span class="p">,</span> <span class="nx">printPage</span><span class="p">);</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">autoLoad</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Boolean</span></tt> If set to true, the capabilities will be loaded upon
+instance creation, and <tt class="docutils literal"><span class="pre">loadCapabilities</span></tt> does not need to be called
+manually. Setting this when <tt class="docutils literal"><span class="pre">capabilities</span></tt> and no <tt class="docutils literal"><span class="pre">url</span></tt> is provided
+has no effect. Default is false.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">baseParams</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Key-value pairs of base params to be add to every
+request to the service. Optional.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">capabilities</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Capabilities of the print service. Only required if <tt class="docutils literal"><span class="pre">url</span></tt>
+is not provided. This is the object returned by the <tt class="docutils literal"><span class="pre">info.json</span></tt>
+endpoint of the print service, and is usually obtained by including a
+script tag pointing to
+<a class="reference external" href="http://path/to/printservice/info.json?var=myvar">http://path/to/printservice/info.json?var=myvar</a> in the head of the
+html document, making the capabilities accessible as <tt class="docutils literal"><span class="pre">window.myvar</span></tt>.
+This property should be used when no local print service or proxy is
+available, or when you do not listen for the <tt class="docutils literal"><span class="pre">loadcapabilities</span></tt>
+events before creating components that require the PrintProvider&#8217;s
+capabilities to be available.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">customParams</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Key-value pairs of custom data to be sent to the print
+service. Optional. This is e.g. useful for complex layout definitions
+on the server side that require additional parameters.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">method</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Either <tt class="docutils literal"><span class="pre">POST</span></tt> or <tt class="docutils literal"><span class="pre">GET</span></tt> (case-sensitive). Method to use
+when sending print requests to the servlet. If the print service is at
+the same origin as the application (or accessible via proxy), then
+<tt class="docutils literal"><span class="pre">POST</span></tt> is recommended. Use <tt class="docutils literal"><span class="pre">GET</span></tt> when accessing a remote print
+service with no proxy available, but expect issues with character
+encoding and URLs exceeding the maximum length. Default is <tt class="docutils literal"><span class="pre">POST</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">url</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">String</span></tt> Base url of the print service. Only required if
+<tt class="docutils literal"><span class="pre">capabilities</span></tt> is not provided. This
+is usually something like <a class="reference external" href="http://path/to/mapfish/print">http://path/to/mapfish/print</a> for Mapfish,
+and <a class="reference external" href="http://path/to/geoserver/pdf">http://path/to/geoserver/pdf</a> for GeoServer with the printing
+extension installed. This property requires that the print service is
+at the same origin as the application (or accessible via proxy).</dd></dl>
+
+</div>
+<div class="section" id="public-properties">
+<h2>Public Properties<a class="headerlink" href="#public-properties" title="Permalink to this headline">Â¶</a></h2>
+<p>Public properties in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.customParams">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">customParams</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.customParams" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Object</span></tt> Key-value pairs of custom data to be sent to the print
+service. Optional. This is e.g. useful for complex layout definitions
+on the server side that require additional parameters.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.dpi">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">dpi</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.dpi" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the record for the currently used resolution.
+Read-only, use <tt class="docutils literal"><span class="pre">setDpi</span></tt> to set the value.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.dpis">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">dpis</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.dpis" title="Permalink to this definition">Â¶</a></dt>
+<dd><p><tt class="docutils literal"><span class="pre">Ext.data.JsonStore</span></tt> read-only. A store representing the dpis
+available.</p>
+<p>Fields of records in this store:</p>
+<ul class="simple">
+<li>name - <tt class="docutils literal"><span class="pre">String</span></tt> the name of the dpi</li>
+<li>value - <tt class="docutils literal"><span class="pre">Float</span></tt> the dots per inch</li>
+</ul>
+</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.layout">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">layout</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.layout" title="Permalink to this definition">Â¶</a></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the record of the currently used layout. Read-only,
+use <tt class="docutils literal"><span class="pre">setLayout</span></tt> to set the value.</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.layouts">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">layouts</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.layouts" title="Permalink to this definition">Â¶</a></dt>
+<dd><p><tt class="docutils literal"><span class="pre">Ext.data.JsonStore</span></tt> read-only. A store representing the layouts
+available.</p>
+<p>Fields of records in this store:</p>
+<ul class="simple">
+<li>name - <tt class="docutils literal"><span class="pre">String</span></tt> the name of the layout</li>
+<li>size - <tt class="docutils literal"><span class="pre">Object</span></tt> width and height of the map in points</li>
+<li>rotation - <tt class="docutils literal"><span class="pre">Boolean</span></tt> indicates if rotation is supported</li>
+</ul>
+</dd></dl>
+
+<dl class="attribute">
+<dt id="GeoExt.data.PrintProvider.scales">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">scales</tt><a class="headerlink" href="#GeoExt.data.PrintProvider.scales" title="Permalink to this definition">Â¶</a></dt>
+<dd><p><tt class="docutils literal"><span class="pre">Ext.data.JsonStore</span></tt> read-only. A store representing the scales
+available.</p>
+<p>Fields of records in this store:</p>
+<ul class="simple">
+<li>name - <tt class="docutils literal"><span class="pre">String</span></tt> the name of the scale</li>
+<li>value - <tt class="docutils literal"><span class="pre">Float</span></tt> the scale denominator</li>
+</ul>
+</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.PrintProvider.loadCapabilities">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">loadCapabilities</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintProvider.loadCapabilities" title="Permalink to this definition">Â¶</a></dt>
+<dd>Loads the capabilities from the print service. If this instance is
+configured with either <tt class="docutils literal"><span class="pre">capabilities</span></tt> or a <tt class="docutils literal"><span class="pre">url</span></tt> and <tt class="docutils literal"><span class="pre">autoLoad</span></tt>
+set to true, then this method does not need to be called from the
+application.</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintProvider.print">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">print</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintProvider.print" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>map</em> &#8211; <tt class="docutils literal"><span class="pre">GeoExt.MapPanel</span></tt> or <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> The map to print.</li>
+<li><em>pages</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span></tt> of <a title="GeoExt.data.PrintPage" class="reference external" href="PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> or
+<a title="GeoExt.data.PrintPage" class="reference external" href="PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> page(s) to print.</li>
+<li><em>options</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> of additional options, see below.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Sends the print command to the print service and opens a new window
+with the resulting PDF.</p>
+<p>Valid properties for the <tt class="docutils literal"><span class="pre">options</span></tt> argument:</p>
+<blockquote>
+<ul>
+<li><p class="first"><tt class="docutils literal"><span class="pre">legend</span></tt> - <a title="GeoExt.LegendPanel" class="reference external" href="../widgets/LegendPanel.html#GeoExt.LegendPanel"><tt class="xref docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a> If provided, the legend
+will be added to the print document. For the printed result to
+look like the LegendPanel, the following <tt class="docutils literal"><span class="pre">!legends</span></tt> block
+should be included in the <tt class="docutils literal"><span class="pre">items</span></tt> of your page layout in the
+print module&#8217;s configuration file:</p>
+<div class="highlight-none"><div class="highlight"><pre>- !legends
+    maxIconWidth: 0
+    maxIconHeight: 0
+    classIndentation: 0
+    layerSpace: 5
+    layerFontSize: 10
+</pre></div>
+</div>
+</li>
+<li><p class="first"><tt class="docutils literal"><span class="pre">overview</span></tt> - <tt class="xref docutils literal"><span class="pre">OpenLayers.Control.OverviewMap</span></tt> If provided,
+the layers for the overview map in the printout will be taken from
+the OverviewMap control. If not provided, the print service will
+use the main map&#8217;s layers for the overview map. Applies only for
+layouts configured to print an overview map.</p>
+</li>
+</ul>
+</blockquote>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintProvider.setDpi">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">setDpi</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintProvider.setDpi" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>dpi</em> &#8211; <tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the dpi record.</td>
+</tr>
+</tbody>
+</table>
+<p>Sets the dpi for this printProvider.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.PrintProvider.setLayout">
+<tt class="descclassname">PrintProvider.</tt><tt class="descname">setLayout</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.PrintProvider.setLayout" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layout</em> &#8211; <tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the record of the layout.</td>
+</tr>
+</tbody>
+</table>
+<p>Sets the layout for this printProvider.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="events">
+<h2>Events<a class="headerlink" href="#events" title="Permalink to this headline">Â¶</a></h2>
+<p>Events in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Observable">Ext.util.Observable</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">beforeencodelayer</tt></dt>
+<dd><p>Triggered before a layer is encoded. This can be used to
+exclude layers from the printing, by having the listener
+return false.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>layer - <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> the layer which is about to be
+encoded.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">beforeprint</tt></dt>
+<dd><p>Triggered when the print method is called.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>map - <tt class="docutils literal"><span class="pre">OpenLayers.Map</span></tt> the map being printed</li>
+<li>pages - Array of <a title="GeoExt.data.PrintPage" class="reference external" href="PrintPage.html#GeoExt.data.PrintPage"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a> the print
+pages being printed</li>
+<li>options - <tt class="docutils literal"><span class="pre">Object</span></tt> the options to the print command</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">dpichange</tt></dt>
+<dd><p>Triggered when the dpi value is changed.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>dpi - <tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the new dpi record</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">encodelayer</tt></dt>
+<dd><p>Triggered when a layer is encoded. This can be used to modify
+the encoded low-level layer object that will be sent to the
+print service.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>layer - <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> the layer which is about to be
+encoded.</li>
+<li>encodedLayer - <tt class="docutils literal"><span class="pre">Object</span></tt> the encoded layer that will be
+sent to the print service.</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layoutchange</tt></dt>
+<dd><p>Triggered when the layout is changed.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>layout - <tt class="docutils literal"><span class="pre">Ext.data.Record</span></tt> the new layout</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">loadcapabilities</tt></dt>
+<dd><p>Triggered when the capabilities have finished loading. This
+event will only fire when <tt class="docutils literal"><span class="pre">capabilities</span></tt> is not  configured.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>capabilities - <tt class="docutils literal"><span class="pre">Object</span></tt> the capabilities</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">print</tt></dt>
+<dd><p>Triggered when the print document is opened.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>url - <tt class="docutils literal"><span class="pre">String</span></tt> the url of the print document</li>
+</ul>
+</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">printexception</tt></dt>
+<dd><p>Triggered when using the <tt class="docutils literal"><span class="pre">POST</span></tt> method, when the print
+backend returns an exception.</p>
+<p>Listener arguments:</p>
+<ul class="simple">
+<li>printProvider - <a title="GeoExt.data.PrintProvider" class="reference internal" href="#GeoExt.data.PrintProvider"><tt class="xref docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a> this
+PrintProvider</li>
+<li>response - <tt class="docutils literal"><span class="pre">Object</span></tt> the response object of the XHR</li>
+</ul>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="ProtocolProxy.html" title="GeoExt.data.ProtocolProxy"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="PrintPage.html" title="GeoExt.data.PrintPage"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureStore.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureStore.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/FeatureStore.html	(revision 76)
@@ -0,0 +1,230 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.FeatureStore &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.LayerReader" href="LayerReader.html" />
+    <link rel="prev" title="GeoExt.data.FeatureRecord" href="FeatureRecord.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a><ul>
+<li><a class="reference external" href="#example-use">Example Use</a></li>
+<li><a class="reference external" href="#config-options">Config Options</a></li>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="FeatureRecord.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-featurestore">
+<h1><a title="GeoExt.data.FeatureStore" class="reference internal" href="#GeoExt.data.FeatureStore"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a><a class="headerlink" href="#geoext-data-featurestore" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.FeatureStore">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">FeatureStore</tt><a class="headerlink" href="#GeoExt.data.FeatureStore" title="Permalink to this definition">Â¶</a></dt>
+<dd>A store containing <a title="GeoExt.data.FeatureRecord" class="reference external" href="FeatureRecord.html#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a> entries that
+optionally synchronizes with an <tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt>.</dd></dl>
+
+<div class="section" id="example-use">
+<h2>Example Use<a class="headerlink" href="#example-use" title="Permalink to this headline">Â¶</a></h2>
+<p>Sample code to create a store with features from a vector layer:</p>
+<div class="highlight-javascript"><div class="highlight"><pre><span class="kd">var</span> <span class="nx">store</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">GeoExt</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">FeatureStore</span><span class="p">({</span>
+    <span class="nx">layer</span><span class="o">:</span> <span class="nx">myLayer</span><span class="p">,</span>
+    <span class="nx">features</span><span class="o">:</span> <span class="nx">myFeatures</span>
+<span class="p">});</span>
+</pre></div>
+</div>
+</div>
+<div class="section" id="config-options">
+<h2>Config Options<a class="headerlink" href="#config-options" title="Permalink to this headline">Â¶</a></h2>
+<p>Configuration properties in addition to
+those listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="describe">
+<dt>
+<tt class="descname">featureFilter</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Filter</span></tt> This filter is evaluated before a feature
+record is added to the store.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">features</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Array(OpenLayers.Feature.Vector)</span></tt>  Features that will be added to the
+store (and the layer if provided).</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">initDir</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Number</span></tt>  Bitfields specifying the direction to use for the
+initial sync between the layer and the store, if set to 0 then no
+initial sync is done. Default is
+<tt class="docutils literal"><span class="pre">GeoExt.data.FeatureStore.LAYER_TO_STORE|GeoExt.data.FeatureStore.STORE_TO_LAYER</span></tt>.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">layer</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">OpenLayers.Layer.Vector</span></tt>  Layer to synchronize the store with.</dd></dl>
+
+<dl class="describe">
+<dt>
+<tt class="descname">reader</tt></dt>
+<dd><tt class="docutils literal"><span class="pre">Ext.data.DataReader</span></tt> The reader used to produce records from objects
+features.  Default is <a title="GeoExt.data.FeatureReader" class="reference external" href="FeatureReader.html#GeoExt.data.FeatureReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a>.</dd></dl>
+
+</div>
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Store">Ext.data.Store</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.FeatureStore.bind">
+<tt class="descclassname">FeatureStore.</tt><tt class="descname">bind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureStore.bind" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layer</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt> Layer that the store should be
+synchronized with.</td>
+</tr>
+</tbody>
+</table>
+<p>Bind this store to a layer instance, once bound the store
+is synchronized with the layer and vice-versa.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.FeatureStore.getRecordFromFeature">
+<tt class="descclassname">FeatureStore.</tt><tt class="descname">getRecordFromFeature</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureStore.getRecordFromFeature" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>feature</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Vector.Feature</span></tt></td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><a title="GeoExt.data.FeatureRecord" class="reference external" href="FeatureRecord.html#GeoExt.data.FeatureRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a> The record corresponding
+to the given feature.  Returns null if no record matches.</td>
+</tr>
+</tbody>
+</table>
+<p>Get the record corresponding to a feature.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.FeatureStore.unbind">
+<tt class="descclassname">FeatureStore.</tt><tt class="descname">unbind</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.FeatureStore.unbind" title="Permalink to this definition">Â¶</a></dt>
+<dd>Unbind this store from the layer it is currently bound.</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerReader.html" title="GeoExt.data.LayerReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="FeatureRecord.html" title="GeoExt.data.FeatureRecord"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMCReader.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMCReader.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/WMCReader.html	(revision 76)
@@ -0,0 +1,147 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.WMCReader &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.WMSCapabilitiesReader" href="WMSCapabilitiesReader.html" />
+    <link rel="prev" title="GeoExt.data.WFSCapabilitiesStore" href="WFSCapabilitiesStore.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="WFSCapabilitiesStore.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="WMSCapabilitiesReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-wmcreader">
+<h1><a title="GeoExt.data.WMCReader" class="reference internal" href="#GeoExt.data.WMCReader"><tt class="xref docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a><a class="headerlink" href="#geoext-data-wmcreader" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.DataReader">Ext.data.DataReader</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.WMCReader">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">WMCReader</tt><big>(</big><em>meta</em>, <em>recordType</em><big>)</big><a class="headerlink" href="#GeoExt.data.WMCReader" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameters:</th><td class="field-body"><ul class="first last simple">
+<li><em>meta</em> &#8211; <tt class="docutils literal"><span class="pre">Object</span></tt> Reader configuration.</li>
+<li><em>recordType</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span> <span class="pre">|</span> <span class="pre">Ext.data.Record</span></tt> An array of field
+configuration objects or a record object.  Default is
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>.</li>
+</ul>
+</td>
+</tr>
+</tbody>
+</table>
+<p>Data reader class to create an array of
+<a title="GeoExt.data.LayerRecord" class="reference external" href="LayerRecord.html#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a> objects from a WMS GetCapabilities
+response.</p>
+</dd></dl>
+
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="WMSCapabilitiesReader.html" title="GeoExt.data.WMSCapabilitiesReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="WFSCapabilitiesStore.html" title="GeoExt.data.WFSCapabilitiesStore"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerRecord.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerRecord.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data/LayerRecord.html	(revision 76)
@@ -0,0 +1,217 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data.LayerRecord &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../../index.html" />
+    <link rel="up" title="GeoExt.data" href="../data.html" />
+    <link rel="next" title="GeoExt.data.LayerStore" href="LayerStore.html" />
+    <link rel="prev" title="GeoExt.data.LayerReader" href="LayerReader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../../docs.html">Documentation</a></li>
+                <li><a href="../../../examples.html">Examples</a></li>
+                <li><a href="../../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" accesskey="U"><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a><ul>
+<li><a class="reference external" href="#public-methods">Public Methods</a></li>
+<li><a class="reference external" href="#class-methods">Class Methods</a></li>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="LayerReader.html"
+                                  title="previous chapter"><tt class="docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="LayerStore.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data-layerrecord">
+<h1><a title="GeoExt.data.LayerRecord" class="reference internal" href="#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a><a class="headerlink" href="#geoext-data-layerrecord" title="Permalink to this headline">Â¶</a></h1>
+<dl class="meta docutils">
+<dt>Extends</dt>
+<dd><ul class="first last simple">
+<li><a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a></li>
+</ul>
+</dd>
+</dl>
+<dl class="class">
+<dt id="GeoExt.data.LayerRecord">
+<em class="property">class </em><tt class="descclassname">GeoExt.data.</tt><tt class="descname">LayerRecord</tt><a class="headerlink" href="#GeoExt.data.LayerRecord" title="Permalink to this definition">Â¶</a></dt>
+<dd><p>A record that represents an <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt>. This record
+will always have at least the following fields:</p>
+<ul class="simple">
+<li>title <tt class="docutils literal"><span class="pre">String</span></tt></li>
+</ul>
+</dd></dl>
+
+<div class="section" id="public-methods">
+<h2>Public Methods<a class="headerlink" href="#public-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Public methods in addition to those
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a>.</p>
+<dl class="method">
+<dt id="GeoExt.data.LayerRecord.clone">
+<tt class="descclassname">LayerRecord.</tt><tt class="descname">clone</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.LayerRecord.clone" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>id</em> &#8211; <tt class="docutils literal"><span class="pre">String</span></tt> (optional) A new Record id.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body">class:<cite>GeoExt.data.LayerRecord</cite> A new layer record.</td>
+</tr>
+</tbody>
+</table>
+<p>Creates a clone of this LayerRecord.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.LayerRecord.getLayer">
+<tt class="descclassname">LayerRecord.</tt><tt class="descname">getLayer</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.LayerRecord.getLayer" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Gets the layer for this record.</p>
+</dd></dl>
+
+<dl class="method">
+<dt id="GeoExt.data.LayerRecord.setLayer">
+<tt class="descclassname">LayerRecord.</tt><tt class="descname">setLayer</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.LayerRecord.setLayer" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>layer</em> &#8211; <tt class="docutils literal"><span class="pre">OpenLayers.Layer</span></tt></td>
+</tr>
+</tbody>
+</table>
+<p>Sets the layer for this record.</p>
+</dd></dl>
+
+</div>
+<div class="section" id="class-methods">
+<h2>Class Methods<a class="headerlink" href="#class-methods" title="Permalink to this headline">Â¶</a></h2>
+<p>Class methods in addition to static methods
+listed for <a class="reference external" href="http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.Record">Ext.data.Record</a>.</p>
+<dl class="classmethod">
+<dt id="GeoExt.data.LayerRecord.create">
+<em class="property">classmethod </em><tt class="descclassname">LayerRecord.</tt><tt class="descname">create</tt><big>(</big><big>)</big><a class="headerlink" href="#GeoExt.data.LayerRecord.create" title="Permalink to this definition">Â¶</a></dt>
+<dd><table class="docutils field-list" frame="void" rules="none">
+<col class="field-name" />
+<col class="field-body" />
+<tbody valign="top">
+<tr class="field"><th class="field-name">Parameter:</th><td class="field-body"><em>o</em> &#8211; <tt class="docutils literal"><span class="pre">Array</span></tt> Field definition as in <tt class="docutils literal"><span class="pre">Ext.data.Record.create</span></tt>. Can
+be omitted if no additional fields are required.</td>
+</tr>
+<tr class="field"><th class="field-name">Returns:</th><td class="field-body"><tt class="docutils literal"><span class="pre">Function</span></tt> A specialized <a title="GeoExt.data.LayerRecord" class="reference internal" href="#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>
+constructor.</td>
+</tr>
+</tbody>
+</table>
+<p>Creates a constructor for a <a title="GeoExt.data.LayerRecord" class="reference internal" href="#GeoExt.data.LayerRecord"><tt class="xref docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a>, optionally
+with additional fields.</p>
+</dd></dl>
+
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="LayerStore.html" title="GeoExt.data.LayerStore"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="LayerReader.html" title="GeoExt.data.LayerReader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../../index.html" >API Reference</a> &raquo;</li>
+          <li><a href="../data.html" ><tt class="docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal docutils literal"><span class="pre">GeoExt.data</span></tt></a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/widgets.html	(revision 76)
@@ -0,0 +1,185 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Widgets &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../index.html" />
+    <link rel="up" title="API Reference" href="../index.html" />
+    <link rel="next" title="GeoExt.Action" href="widgets/Action.html" />
+    <link rel="prev" title="API Reference" href="../index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../docs.html">Documentation</a></li>
+                <li><a href="../../examples.html">Examples</a></li>
+                <li><a href="../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" accesskey="U">API Reference</a> &raquo;</li>
+        <li><a href="#">Widgets</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h3><a href="../../index.html">Table Of Contents</a></h3>
+            <ul>
+<li><a class="reference external" href="#">Widgets</a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#module-GeoExt.grid"><tt class="docutils literal"><span class="pre">GeoExt.form</span></tt></a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#module-GeoExt.tree"><tt class="docutils literal"><span class="pre">GeoExt.grid</span></tt></a><ul>
+</ul>
+</li>
+<li><a class="reference external" href="#geoext-tree"><tt class="docutils literal"><span class="pre">GeoExt.tree</span></tt></a><ul>
+</ul>
+</li>
+</ul>
+
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="../index.html"
+                                  title="previous chapter">API Reference</a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="widgets/Action.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.Action</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="module-GeoExt.form">
+<h1>Widgets<a class="headerlink" href="#module-GeoExt.form" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt widgets are a collection of specialized map related components.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="widgets/Action.html"><tt class="docutils literal"><span class="pre">GeoExt.Action</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/FeatureRenderer.html"><tt class="docutils literal"><span class="pre">GeoExt.FeatureRenderer</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/LayerLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerLegend</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/LayerOpacitySlider.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySlider</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/LegendImage.html"><tt class="docutils literal"><span class="pre">GeoExt.LegendImage</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/LegendPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.LegendPanel</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/MapPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.MapPanel</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/Popup.html"><tt class="docutils literal"><span class="pre">GeoExt.Popup</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/PrintMapPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.PrintMapPanel</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/UrlLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.UrlLegend</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/VectorLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.VectorLegend</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/WMSLegend.html"><tt class="docutils literal"><span class="pre">GeoExt.WMSLegend</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/ZoomSlider.html"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSlider</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tips/LayerOpacitySliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.LayerOpacitySliderTip</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tips/SliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.SliderTip</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tips/ZoomSliderTip.html"><tt class="docutils literal"><span class="pre">GeoExt.ZoomSliderTip</span></tt></a></li>
+</ul>
+</div>
+<div class="section" id="module-GeoExt.grid">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.form</span></tt><a class="headerlink" href="#module-GeoExt.grid" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.form</span></tt> module contains classes that extend map related
+functionality to <tt class="docutils literal"><span class="pre">Ext.form</span></tt> classes.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="widgets/form/BasicForm.html"><tt class="docutils literal"><span class="pre">GeoExt.form.BasicForm</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/form/FormPanel.html"><tt class="docutils literal"><span class="pre">GeoExt.form.FormPanel</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/form/SearchAction.html"><tt class="docutils literal"><span class="pre">GeoExt.form.SearchAction</span></tt></a></li>
+</ul>
+</div>
+<div class="section" id="module-GeoExt.tree">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.grid</span></tt><a class="headerlink" href="#module-GeoExt.tree" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.grid</span></tt> module contains classes that extend map related
+functionality to <tt class="docutils literal"><span class="pre">Ext.grid</span></tt> classes.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="widgets/grid/FeatureSelectionModel.html"><tt class="docutils literal"><span class="pre">GeoExt.grid.FeatureSelectionModel</span></tt></a></li>
+</ul>
+</div>
+<div class="section" id="geoext-tree">
+<h1><tt class="xref docutils literal"><span class="pre">GeoExt.tree</span></tt><a class="headerlink" href="#geoext-tree" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.tree</span></tt> module contains classes that extend map related
+functionality to <tt class="docutils literal"><span class="pre">Ext.tree</span></tt> classes.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/BaseLayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.BaseLayerContainer</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/LayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerContainer</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/LayerLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerLoader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/LayerNode.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerNode</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/LayerParamLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamLoader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/LayerParamNode.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.LayerParamNode</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/OverlayLayerContainer.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.OverlayLayerContainer</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/TreeNodeUIEventMixin.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.TreeNodeUIEventMixin</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="widgets/tree/WMSCapabilitiesLoader.html"><tt class="docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></li>
+</ul>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="widgets/Action.html" title="GeoExt.Action"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="../index.html" title="API Reference"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+        <li><a href="#">Widgets</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/lib/GeoExt/data.html	(revision 76)
@@ -0,0 +1,139 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>GeoExt.data &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="../../_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '../../',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="../../_static/jquery.js"></script>
+    <script type="text/javascript" src="../../_static/doctools.js"></script>
+    <link rel="shortcut icon" href="../../_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="../../index.html" />
+    <link rel="up" title="API Reference" href="../index.html" />
+    <link rel="next" title="GeoExt.data.AttributeReader" href="data/AttributeReader.html" />
+    <link rel="prev" title="GeoExt.tree.WMSCapabilitiesLoader" href="widgets/tree/WMSCapabilitiesLoader.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="../../index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="../../docs.html">Documentation</a></li>
+                <li><a href="../../examples.html">Examples</a></li>
+                <li><a href="../../downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="../../search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="../../_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" accesskey="U">API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal"><span class="pre">GeoExt.data</span></tt></a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h4>Previous topic</h4>
+            <p class="topless"><a href="widgets/tree/WMSCapabilitiesLoader.html"
+                                  title="previous chapter"><tt class="docutils literal"><span class="pre">GeoExt.tree.WMSCapabilitiesLoader</span></tt></a></p>
+            <h4>Next topic</h4>
+            <p class="topless"><a href="data/AttributeReader.html"
+                                  title="next chapter"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></p>
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="geoext-data">
+<span id="module-GeoExt.data"></span><h1><tt class="xref docutils literal"><span class="pre">GeoExt.data</span></tt><a class="headerlink" href="#geoext-data" title="Permalink to this headline">Â¶</a></h1>
+<p>The <tt class="xref docutils literal"><span class="pre">GeoExt.data</span></tt> module contains classes that extend map related
+functionality to <tt class="docutils literal"><span class="pre">Ext.data</span></tt> classes.</p>
+<ul>
+<li class="toctree-l1"><a class="reference external" href="data/AttributeReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/AttributeStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.AttributeStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/FeatureReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/FeatureRecord.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureRecord</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/FeatureStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.FeatureStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/LayerReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/LayerRecord.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerRecord</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/LayerStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.LayerStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/PrintPage.html"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintPage</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/PrintProvider.html"><tt class="docutils literal"><span class="pre">GeoExt.data.PrintProvider</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/ProtocolProxy.html"><tt class="docutils literal"><span class="pre">GeoExt.data.ProtocolProxy</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/ScaleStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.ScaleStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WFSCapabilitiesReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WFSCapabilitiesStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WFSCapabilitiesStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WMCReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMCReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WMSCapabilitiesReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WMSCapabilitiesStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSCapabilitiesStore</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WMSDescribeLayerReader.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerReader</span></tt></a></li>
+<li class="toctree-l1"><a class="reference external" href="data/WMSDescribeLayerStore.html"><tt class="docutils literal"><span class="pre">GeoExt.data.WMSDescribeLayerStore</span></tt></a></li>
+</ul>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="../../genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="../../modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+            <li class="right" >
+              <a href="data/AttributeReader.html" title="GeoExt.data.AttributeReader"
+                 accesskey="N">next</a> |</li>
+            <li class="right" >
+              <a href="widgets/tree/WMSCapabilitiesLoader.html" title="GeoExt.tree.WMSCapabilitiesLoader"
+                 accesskey="P">previous</a> |</li>
+        <li><a href="../../index.html">GeoExt</a> &raquo;</li>
+          <li><a href="../index.html" >API Reference</a> &raquo;</li>
+        <li><a href="#"><tt class="docutils literal"><span class="pre">GeoExt.data</span></tt></a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/search.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/search.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/search.html	(revision 76)
@@ -0,0 +1,114 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Search &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <script type="text/javascript" src="_static/searchtools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Search</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <h1 id="search-documentation">Search</h1>
+  <div id="fallback" class="admonition warning">
+  <script type="text/javascript">$('#fallback').hide();</script>
+  <p>
+    Please activate JavaScript to enable the search
+    functionality.
+  </p>
+  </div>
+  <p>
+    From here you can search these documents. Enter your search
+    words into the box below and click "search". Note that the search
+    function will automatically search for all of the words. Pages
+    containing fewer words won't appear in the result list.
+  </p>
+  <form action="" method="get">
+    <input type="text" name="q" value="" />
+    <input type="submit" value="search" />
+    <span id="search-progress" style="padding-left: 10px"></span>
+  </form>
+  
+  <div id="search-results">
+  
+  </div>
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="modindex.html" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Search</a></li>
+      </ul>
+    </div>
+
+  
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  <script type="text/javascript" src="searchindex.js"></script>
+
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/searchindex.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/searchindex.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/searchindex.js	(revision 76)
@@ -0,0 +1,1 @@
+Search.setIndex({desctypes:{"0":"method","1":"attribute","2":"class","3":"classmethod"},terms:{demo:[76,71,66],represent:2,all:[53,40,62,76,65,66,39,50,11,71,54,73,74,38,75,56,57,29],concept:[14,60,74,66],geoext:[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78],maximum:30,radiogroup:[63,66],queri:4,global:[20,3,23,39,35,54,73,57],maxscal:13,imgcl:33,tasmania_state_boundari:[30,76,71,66],four:68,prefix:[64,13],code:[76,3,7,9,61,68,19,23,72,39,60,32,59,34,35,30,45,46,48,54,57,63,70,73,74],osm:11,per:[30,57,6],abil:39,follow:[36,78,22,24,6,13,48,50,30,73,74,59,57],primer:[14,50,74,57,54],children:[56,29,40,4,28],tasmania_road:[46,66,61],row:7,millisecond:3,whose:[8,64,61],hold:[68,71],depend:[67,53],sensit:30,wizard:74,setcent:2,send:[76,30,2],proxyhost:78,applyload:40,getlink:35,present:[78,66],under:20,leav:57,spec:55,sent:[36,30],deactiv:[7,50],sourc:[20,60,44,71,54,57],everi:[30,67,57],string:[4,5,8,55,13,68,39,51,23,24,2,28,75,31,59,22,30,48,50,52,53,56,58,33,63,64,67,35,71,72,73],straightforward:57,fals:[59,3,40,41,53,30,7,2,48,64,66,28,55,70,71,76,68,21,56,57,35],queu:74,reader:[1,45,5,43,25,49,27,67,69,11,12,13,15,21],none:[73,58],util:[30,2,26,28,62,38,56,57],endpoint:30,mechan:57,slidertip:[0,59,26,48,70],veri:[73,50,57,39],affect:[6,71,4],servlet:30,implement:[56,57,28],tasmania:[76,71,66],look:[36,78,60,30,61,64,39,50,54,73,19,74,57],percent:59,administr:36,level:[23,30,48,11,71,6,68,38,74],tear:76,mapfish:30,button:[4,63,66,42,50,29,71,19,34,57],restor:[78,77],list:[61,1,2,3,4,5,7,8,55,47,31,13,15,19,21,68,51,22,23,24,25,28,29,6,33,35,36,40,41,30,45,46,49,48,50,52,53,38,56,57,58,59,62,76,64,65,66,67,78,70,71,72,73,75],dataread:[45,5,43,25,27,67,69,12,13],previou:[36,44,57,41],unpinn:72,"try":[50,57],item:[20,74,59,3,23,62,30,46,68,48,28,52,70,71,61,19,38,32],vector:[58,45,39,22,5,72,7,2,64,42,69,11,76,21,57],permalinkprovid:[26,77,35],team:[57,54],small:[1,21,49,15],customari:57,div:[72,76,66,54,73,68,74,57],refer:[60,46,26,54,74,56,57],evt:[50,57],round:57,dimens:13,delimit:[52,28],fortun:50,core:[14,60,74,57],basicform:[0,8,46,26,61],direct:[67,45],uniqu:57,jump:60,second:[57,54],foo__lik:46,owsurl:12,pass:[61,1,3,41,7,8,46,49,15,67,13,21,57],download:[20,37,44,54,16,17,74],further:[6,54,42],submit:36,click:[37,58,63,64,9,66,71,16,17,34,57],append:[64,66,13],proxi:[78,1,41,30,49,15,39,21],blue:[73,57],index:64,what:[73,74,57],hide:[73,76,64],sub:[74,66,42],wide:54,section:[78,42],selectionmodel:7,abl:66,"while":[39,48,42,50,70,73,59,57],current:[2,30,44,45,64,35,71,6,76],delet:50,version:[37,16,17,32,54],myvar:30,featureread:[5,45,18,26],"new":[25,3,5,7,9,55,61,76,19,42,68,20,23,24,2,28,32,33,34,35,39,30,45,46,48,50,54,38,56,57,58,59,62,63,66,67,69,70,71,72,73,74],net:36,method:[2,3,5,7,8,61,23,24,25,26,28,6,33,78,22,41,30,45,46,56,57,58,76,64,47,35,71,72,74],pictur:[50,26],can:[78,9,55,47,31,19,42,51,24,2,28,29,30,32,59,34,36,39,22,60,46,48,50,52,54,57,6,63,64,66,71,73,74],ongo:36,widget:[0,60,2,26,73,74],full:26,hash:4,deriv:[14,6,67,72],displai:[51,35,39,40,64,2,48,29,66,42,59,70,53,65,73,31,55,57,11],leaf:66,gener:[4,60,39,50,71,54,57],never:74,complementarylay:3,sophist:42,here:[78,4,7,46,26,66,39,50,71,54,68,74,57],bodi:[3,23,48,70,54,74,59],were:[76,57,28],mappanel:[0,3,4,10,11,68,39,23,72,2,26,42,6,30,50,52,53,54,57,76,66,35,71,73],ratio:71,vertic:[3,23],modifi:[30,76,9,66,28,11,56],legend:[51,30,64,55,11,53,31,33],valu:[3,4,55,11,61,21,51,23,2,28,31,59,35,39,30,46,48,52,56,57,58,6,64,67,69,70],wait:73,box:[58,62,66,11,71,38,34],search:[36,8,46,61],produc:[67,45],abortprevi:[46,41],ahead:39,invit:36,haslisten:66,iconcl:[56,52,40,4,29],anymor:53,printpag:[76,30,2,26,11,71,62,18],gx_printext:76,registerradio:66,host:[36,37,39,16,17,57],prior:36,dataindex:[7,39],exceed:30,action:[0,20,8,46,26,42,11,61,19],chang:[3,53,30,2,66,11,71,6,73,74,35],gx_printmappanel:71,mypanel:[74,57],overrid:[78,58,26,47,55,28,56],via:[1,49,15,30],initdir:[67,45],extra:[57,39],appli:[30,63,64,33,34],modul:[0,30,10,62,38,18,77],prefer:[58,53],layer:[1,25,3,4,7,55,11,12,13,14,15,68,28,20,51,40,23,24,2,42,29,31,59,34,75,39,22,30,45,49,50,52,53,54,56,57,76,64,65,66,67,35,71,72,73],elevation__g:[46,61],expect:[57,30,56,53],releas:[78,44,3,23],api:[60,26,39,50,54,73,19,74,57],canon:57,visibl:[2,3,72,76,66,42,11],instal:30,earlier:[78,74],select:[7,76,64,39,11,57],highli:54,aggress:[3,23],forcelabel:55,from:[3,5,6,7,61,55,11,12,13,14,16,28,17,72,25,27,42,29,30,32,36,37,39,40,43,45,46,50,53,54,56,57,60,76,65,66,67,73,74,77],unanchor:72,commun:[36,20,60],layer_to_stor:45,chooser:11,two:[48,39,70,71,66,68,59,57],next:[63,57],implic:78,few:[73,74],live:[73,66],handler:[50,71,66,61],call:[78,30,76,46,39,50,53,74,56,57],until:6,recommend:[73,30,57,54],taken:[53,30,3,40,56],featurerecord:[5,45,18,26,22],preview:[11,71],type:[1,4,5,55,11,13,15,21,39,29,40,46,49,52,53,54,57,58,64,65,66,67,35,71,74],gx_vectorlegend:64,toggl:[50,66],more:[20,30,2,66,42,50,74,71,54,73,19,68,57],wfscapabl:1,main:[30,57],displayfield:[62,38],desir:[74,57],rich:[20,74,54,42],maxlengthtext:32,src:[78,74,34,54],titleclick:64,peopl:36,relat:[0,77,18,26,57],toolkit:20,warn:36,introduc:74,featurefilt:45,formpanel:[0,62,8,46,26,61,32,38],examin:66,particular:[73,72,50,63],regist:[64,57],obj:7,featurerender:[0,58,26],unpack:54,cach:[1,6,49,15,67,21],must:[3,64,7,76,46,66,71,61,57],town:50,account:[72,2,3],graphic:54,retriev:55,wmsdescribelayerread:[18,26,12,49],setup:42,work:[78,3,4,63,66,42,73,35,71,14,74,39],focu:57,dev:36,histori:[36,57],controlconfig:7,xhr:[1,30,49,15,69,21],remain:6,minimum:[59,70,48],obvious:4,whatev:50,www:[36,46,57,61],learn:[20,54,60],field:[1,13,10,11,12,61,21,30,24,27,39,55,6,22,43,46,49,38,62,15,67,69],purpos:[50,57,54],root:[78,63,9,66,54,34],fetch:[42,39,41],layerrecord:[51,3,4,24,43,25,64,26,27,55,67,71,13,31,68,18],control:[3,23,30,7,76,66,42,50,11,71,14,19,39,57],heart:[73,50],viewport:[3,23,11],quickstart:[73,74,54,57,42],give:[50,57],process:[4,54],treenodecompon:[34,26,10],calcul:2,indic:30,preaddlay:71,tabular:39,selectfeatur:7,tag:[30,33,34],want:[30,7,50,35,71,73,68,57],enabletoggl:50,basecl:23,onlin:75,legendurl:55,gx_treenoderadiobutton:63,occur:3,delai:3,alwai:[73,24,22],end:50,name__lik:46,anoth:[57,66,41],get:[1,15,14,39,21,23,24,2,42,30,36,22,60,45,49,50,54,57,58,66,71,74],alert:[50,63,34,57,35],length:[30,50],geojson:39,gx_baselayercontain:29,write:74,how:[36,20,60,2,46,66,42,50,61,73,32,74,57],run:[60,74,46,42],fireev:57,clickablesymbol:64,fourth:57,reject:36,tile:[73,3,39],instead:[51,3,4,64,8,46,31,66,55,50,29,71,61,68,74,57],somevalu:57,config:[61,1,3,4,7,8,55,31,13,19,21,68,51,23,72,2,28,29,6,32,33,35,78,40,41,30,45,49,48,52,53,38,56,58,59,62,76,64,65,15,67,70,71,75],css:[51,23,31,13,64,55,54,74,33,72],updat:[58,2,64,11,71,73,21],map:[0,25,3,7,55,11,19,39,18,68,20,23,72,2,26,42,29,6,75,40,30,48,50,52,54,38,57,62,76,65,66,67,35,71,73],product:54,resourc:[74,75,54],referenc:[7,21,69,57],openplan:[46,61],layerfonts:30,clone:24,gx_treenodecompon:34,tool:[37,72,42,50,16,17],them:[50,76,57,66],selectonfocu:[62,38],treenodeui:[56,63,9,34],befor:[78,3,41,30,45,66,28,50,71,73,74,39,56],beforeload:[56,28],okai:50,mixin:9,mai:[78,19,57],mymap:67,pdf:[30,71],data:[1,25,3,4,5,6,10,12,13,68,21,18,51,40,24,2,26,27,42,29,30,31,32,38,39,22,41,43,45,49,50,52,53,54,55,56,57,60,62,76,64,65,15,67,69,71,73],grow:20,demonstr:[73,60,74],setparamsasopt:41,permalink:[11,35],"short":32,essenti:[14,26],practic:78,not_equal_to:46,object:[61,1,2,3,4,5,7,8,55,47,12,13,15,68,21,25,26,27,28,29,30,75,78,39,40,41,43,45,46,49,50,52,54,56,57,58,6,76,65,66,67,69,71,74],classmethod:[24,22],bind:[3,6,7,45,39,32],valid:[30,58,69],minim:[30,74],correspond:[45,21,64,35],element:[23,72,13,42,11,54,73,57],issu:[78,1,41,30,49,15,55],inform:[36,60,66,39,11,73,57],"switch":50,imageri:[20,3,23,39,35,54,73,57],combin:[1,21,49,15],selectpag:76,allow:[1,58,64,49,66,39,15,32,21,74,57],region:[7,74],featuretyp:[46,61],order:[58,66,39,73,74,57],tasmania_water_bodi:66,unbind:[6,7,45],checkbox:[63,66,4,29],feedback:50,east:[7,74],over:[58,59,70,48,39],move:[3,23,72,2,64,66,50,35,73,57],rowselectionmodel:7,soon:[30,39,3,4,23],initcompon:57,fulli:[72,3],lastli:74,bin:36,througn:46,comma:[52,28],addcontrol:[50,57],layerlegend:[0,51,31,64,26,55],getscal:23,ruleunselect:64,pointer:[14,64],dynam:53,paramet:[61,2,3,5,7,8,55,12,13,39,24,25,27,28,75,30,33,22,43,45,38,56,57,58,6,62,76,64,69,35,71,72],busi:20,style:[20,74,55,64,13],group:[50,63,66,4,42],render:[58,76,3,23,53,72,63,64,9,66,55,4,74,11,71,73,68,39,34,57,29],fit:[76,20,2,30],panin:72,chosen:[2,53],combobox:11,fix:78,interoper:39,printcap:[76,62,38,71],window:[20,30,11,71,72,68,74,57],pend:46,requir:[1,38,3,4,30,49,15,73,35,71,24,22,74,21,72],bypass:57,comprehens:50,mail:36,fitto:2,might:[50,57],easier:[1,21,49,15],maxiconheight:30,displayinlayerswitch:[56,65,40,66,29],myfeatur:45,"return":[8,22,23,5,24,7,25,2,66,28,45,35,53,13,56,76,30],thei:[66,39,50,71,74,57],handl:[76,64,3,57,39],auto:4,guess:52,handi:50,initi:[45,3,76,39,67,53,68,71,57],getelementbyid:57,automat:[73,7,74,66],childnod:28,now:[50,39,57,54],discuss:[36,73,66],nor:7,introduct:39,minwidth:[59,70,48],document:[20,3,23,30,54,48,26,66,55,39,50,11,60,73,74,59,57,70],treenod:[4,63,9,28,52,75,56],name:[1,4,5,7,8,13,15,61,68,21,23,72,39,75,30,46,49,38,56,57,62,63,64,66,69,35,71,73],anyth:57,edit:[32,39],simpl:[73,60,50,39,54],drop:[64,66],usescaleparamet:55,instruct:[36,74],layerparamsload:4,separ:74,did:[50,57],exampl:[76,3,5,7,9,11,61,19,39,68,20,23,72,25,42,60,32,59,34,35,78,30,45,46,48,50,54,38,57,62,63,66,67,70,71,73,74],heavi:50,mode:[62,2,38],topp:[30,76,46,66,71,61],each:[46,26,39,35,74,57,11],debug:54,found:[4,7,2,64,52,57],intervent:57,stock:66,ownertre:[56,40],side:[73,30,39],mean:[72,71,39],subset:71,paneldiv:74,"__ge":46,transform:[1,76,49,15,69,21],gx_legendimag:33,httpproxi:[1,21,49,15],individu:[20,39],multipl:[57,7,50,11,66],continu:57,createregularpolygon:57,realli:73,singlefil:78,owner:38,"__gt":46,"static":[73,24,22],connect:[36,76,4,10],printext:[76,26,11,10],openlay:[1,25,3,4,5,7,61,11,13,14,15,19,21,68,20,22,23,24,2,26,28,29,6,75,78,39,40,41,30,45,46,42,49,50,52,54,57,58,76,64,65,66,67,69,35,71,72,73],our:[73,50,57,39],happen:57,event:[58,63,30,2,64,9,66,28,73,26,53,14,74,76,56,57],special:[0,24,57,22,72],out:[50,74,57,71],variabl:57,depress:50,shown:76,defaultimgsrc:33,setlayout:30,overridden:[31,51,64,71,55],layerparamnod:[0,52,26],maxext:68,setsiz:72,treenodeuieventmixin:[0,34,63,9,26],publish:[74,54],content:[72,50,74],typenam:[32,12],adapt:[74,54],layernod:[0,73,66,4,26],max:[19,3],print:[76,30,2,11,71,62,38],got:[50,57],brows:57,forth:54,math:57,common:74,wai:[73,50,76,74,57],model:7,after:[58,46,39,68,28,56],nodetyp:[4,40,63,9,65,52,29,34],wmsdescribelayerstor:[18,26,49],navig:[57,39,3,23,54],advanc:[54,42],isbaselay:[53,66],fallthrough:57,manipul:[73,50],situat:57,autoheight:71,togglegroup:50,standard:[50,57],quick:[73,74],ajax:[78,26,47],base:[58,23,30,64,31,66,39,29,71,54,74,57,35],mime:55,gx_printpagefield:62,put:[74,39],org:[36,20,76,3,23,61,46,66,39,35,71,54,73,57],layoutchang:30,hand:[73,26],thrown:57,raster:57,layerlist:[73,66],workaround:78,applict:78,preced:58,argument:[58,8,30,2,46,9,28,53,76,64,74,63,56,57],could:50,omit:[24,19,22],synchron:[6,45,67,11,62,38],capabl:[30,76,55,11,71,62,38,75],keep:[60,66],filter:[53,45,46,66,42,11,71,61,56],thing:[73,50,74,57],featureselectionmodel:[0,7,26],enforc:66,place:[36,54],isn:[73,57],outsid:[3,23],wmcreader:[43,18,26],geometri:[58,72,2,64,39,57],renderto:[59,3,23,62,30,61,46,66,39,48,73,70,71,54,76,68,38,74,35],confus:50,interact:[66,42,50,11,71,54,57],south:74,first:[8,4,30,76,64,55,68,74,57],origin:[78,30,3,39],pleas:74,notifi:[2,57],directli:[4,41,8,46,66,57],onc:45,arrai:[1,5,12,13,68,21,24,25,27,28,30,59,22,43,45,49,48,50,52,53,57,58,76,64,15,67,69,70,71,74],gx_printproviderfield:38,parser:[1,21,69,49,15],number:[3,23,6,45,64,67,48,50,70,71,68,59,57],beforeprint:30,yourself:57,restrict:21,hook:57,radiochang:[63,34,66],alreadi:[57,7,19,66],done:[67,45,57],construct:[68,74],layeropacityslidertip:[0,59,26],featuren:[46,61],open:[20,57,71,30],primari:57,name__ilik:61,size:[30,72,71,54],take:[4,72,2,50,54,73,74,57],differ:[50,64,57,71,39],zoomslidertip:[0,26,48],prototyp:57,acquaint:54,width:[20,74,59,3,23,62,30,7,48,39,70,71,54,73,32,38,72],beauti:57,beforeencodelay:30,top:[73,50,74,54],getzoom:23,least:[24,22],searchact:[0,8,46,26,61],attack:39,too:32,accept:57,similarli:57,protocol:[5,61,46,39,41],conveni:[73,71],"final":57,store:[1,4,5,7,11,15,68,21,2,42,29,6,32,39,40,30,45,49,52,53,38,56,62,65,66,67,71,73],listen:[58,63,53,30,2,64,9,66,28,71,61,56,76,34,57],classindent:30,printout:30,fieldlabel:[62,38],option:[61,1,76,3,4,7,8,55,15,31,13,19,21,68,51,40,23,24,2,28,29,6,32,33,35,39,22,41,30,45,46,49,48,50,52,53,54,38,56,57,58,59,62,63,64,65,47,67,70,71,72,73,74,75],getresolut:23,copi:[26,39],specifi:[45,76,64,67,35,74,56,57],sync:[6,67,45],slider:[3,23,48,70,59,11],appropri:[74,61,46,13],somewhat:50,kept:6,textfield:[62,38,46,61],sign:36,than:[66,39,50,71,74,56],ogc:57,center:[2,30,76,11,71,68,74],enjoi:74,liter:[61,1,2,3,4,5,6,7,8,9,10,12,13,76,19,21,18,68,51,22,23,24,25,27,28,29,30,31,32,33,34,35,40,41,43,45,46,49,48,52,53,55,56,58,59,38,62,63,64,65,15,67,69,70,71,72,73,75,77],third:57,keyword:[59,48,13],instanc:[58,8,4,30,45,46,67,75,71,61,19,57],remot:[1,30,49,15,42,21],remov:[73,78,76,53,66],tree:[0,4,40,42,75,63,9,66,26,50,52,11,65,73,56,28,34,29],richer:50,structur:[74,75],charact:[30,52,28],getcap:[43,55,27,13],rulemov:64,collaps:[72,74],opaqu:13,posit:[74,11],wfsdescribefeaturetyp:[21,69],overviewmap:30,setsymboltyp:58,typic:[5,26],builder:[37,16,17],llbbox:13,pre:[61,1,2,3,4,5,6,7,8,9,10,12,13,76,19,21,18,68,51,22,23,24,25,27,28,29,30,31,32,33,34,35,39,40,41,43,45,46,49,48,52,53,55,56,58,59,38,62,63,64,65,15,67,69,70,71,72,73,75,77],cleaner:74,sai:55,abov:[74,57,66],nicer:73,untitl:64,respons:[1,5,43,61,46,49,27,69,11,12,13,15,21,30,57],mind:66,ani:[78,63,41,7,2,64,39,67,11,32,34,57],wmscapabilitiesread:[55,18,26,15,13],bitfield:[67,45],minx:68,raw:9,typeahead:[62,38],have:[1,15,19,21,30,40,24,2,26,39,29,6,34,78,22,60,49,50,54,56,57,64,65,66,68,71,72,74],actioncomplet:61,need:[1,40,30,44,49,15,39,50,71,73,19,21,74,57],seen:[57,39],"null":[45,3,57],border:[68,76,64,74],layerread:[67,25,18,26],clickabletitl:64,maxx:68,date:57,built:[1,49,15,54,74,21],zero:42,callback:46,latter:[38,66],consortium:57,port:39,note:[78,40,44,76,64,66,39,50,71,54,73,74,57],also:[4,40,30,2,64,66,50,54,74,57],maxi:68,lonlat:[72,68,2,71],build:[78,20,37,44,46,47,11,54,16,17],which:[6,62,30,7,2,64,39,50,75,13,73,74,38,56,57],wmscapabilitiesstor:[18,26,15],wmslegend:[0,26,55],encodedlay:30,getlay:[24,56,53],eventlisten:50,channel:36,mygroupid:63,begin:72,legend_opt:55,unless:[66,4],distribut:39,plenti:57,though:57,licens:[78,20,54],compress:54,layerspac:30,numrecord:25,react:9,most:[60,8,46,50,73,32,74],encodetyp:35,regular:[19,69],lengthbutton:50,autoactivatecontrol:7,authorityurl:13,thi:[1,3,4,7,8,55,15,31,61,19,21,68,51,40,24,2,28,29,6,32,75,78,39,22,30,45,46,49,50,52,54,38,56,57,58,76,64,65,66,67,71,72,73,74],bsd:20,statechang:35,getprintext:2,"class":[0,1,2,3,4,5,6,7,8,9,10,15,12,13,76,19,21,18,68,51,22,23,24,25,26,27,28,29,30,31,32,33,34,35,39,40,41,43,45,46,49,48,52,53,55,56,57,58,59,38,61,62,63,64,65,66,67,69,70,71,72,73,74,75,77],icon:[4,40,63,56,52,29,34],synonym:57,uiclass:[63,9,34],url:[39,30,46,55,35,61,32,33,75],doc:19,later:[57,54],cover:[60,42],showtitl:[31,51,64,55],doe:[3,30,2,64,66,55,6,57],maptitl:[62,38],dummi:78,ext:[0,1,2,3,4,5,7,8,9,55,47,12,13,14,15,19,21,18,68,20,51,22,23,24,25,26,27,28,29,30,31,32,33,34,35,78,39,40,41,43,45,46,42,48,49,50,52,53,54,38,56,57,58,59,6,61,62,63,64,65,66,67,69,70,71,72,73,74,75,77],getfeatur:22,determin:[74,2,71],printprovid:[76,30,2,26,11,71,62,38,18],fixedheight:13,triggerev:57,event1:57,wmscapabl:[15,13],dot:30,mylay:[67,45],opengeo:[20,76,3,23,37,61,46,66,39,35,71,54,73,16,17,57],asid:39,set:[3,4,7,55,31,13,68,51,22,23,24,2,39,29,6,32,33,75,78,40,41,30,45,46,52,54,38,56,57,58,76,64,65,66,67,69,35,71,72,74],gx_popup:72,show:[20,51,53,64,2,46,31,42,73,55,29,71,61,76,32,33],text:[61,4,62,63,9,66,50,74,71,54,19,38,34],random:57,encodelay:30,bring:[20,54],grouplayernod:66,legendtitl:[31,51,64,55],sundial:39,earth:[73,57],environ:54,fine:54,find:[36,50,52,57,4],addit:[61,1,2,3,4,5,7,8,55,15,31,13,19,21,68,51,22,23,24,25,28,29,6,33,34,35,40,41,30,45,46,42,48,49,52,53,38,56,57,58,59,62,63,64,65,66,67,70,71,72,75],rotat:[30,2,11,62],involv:[36,60],access:[73,30,39],onli:[76,3,4,72,2,42,29,59,40,30,46,48,50,52,56,57,58,63,64,65,66,70,71,73],ruleclick:64,layout:[20,30,2,50,14,74,38],just:[44,66,39,50,54,57],pretti:[68,50,35,71],legendimag:[0,33,26],allowdrag:66,menu:19,configur:[1,76,3,4,7,61,55,11,12,13,15,19,21,68,51,23,72,2,26,27,28,29,30,31,32,33,34,35,39,40,41,43,45,42,48,49,52,53,38,56,58,59,6,62,63,64,65,66,67,69,70,71,73,74,75],activ:[36,7,50,29,66],state:[53,22,26,35,71,68,77],should:[72,78,58,74,6,41,30,7,45,64,66,55,69,35,54,73,19,39,68,57],goe:3,dataproxi:41,preferredtyp:53,zoomslid:[0,48,26,23],printproviderfield:[38,26,10],png:[39,57,55],"5px":55,combo:[62,38,71],sub2:74,addpag:76,local:[30,38,62],meant:73,nearli:57,vectorlegend:[0,64,26],attributestor:[32,21,18,11,26],familiar:[50,74],express:69,kind:[74,11],autoload:[30,39],nosubset:13,panzoombar:57,drawn:58,report:30,overlaylayercontain:[0,26,66,65],totalrecord:[5,25],limitscal:71,createnod:[56,28],script:[78,30,74,39,54],setcurrentscaledenomin:64,bar:57,enabl:[7,66],organ:[20,66],emb:54,store_to_map:67,"public":[2,3,4,5,7,8,61,68,23,24,25,28,6,33,22,30,45,46,56,58,76,64,67,35,71,72],provid:[78,3,4,7,55,47,68,21,2,26,28,29,59,35,36,39,40,30,45,48,50,52,53,38,56,57,58,62,76,64,65,66,67,69,70,71,73,74,77],maintain:[6,75],she:50,contain:[0,4,5,10,68,18,51,25,26,55,29,31,40,6,45,53,54,38,56,57,76,64,65,66,67,71,74],greater_than:46,through:[78,60,46,39,50,61,68,57],where:[73,74,52,57],analog:57,dpi:[30,38],view:[72,50,57,71,39],respond:57,changevis:3,xtype:[20,58,51,38,3,23,53,62,72,46,64,55,74,71,61,68,33,34],setscal:2,navigationhistori:57,"float":[5,30,2],gx_attributeform:32,knowledg:74,abort:[46,41],accord:[74,71],enabledd:[64,66],see:[20,30,76,64,26,66,39,50,47,73,57],prosper:54,result:[30,46,61],gx_overlaylayercontain:65,fail:33,becaus:[74,57,71],servic:[20,3,23,30,2,39,35,54,73,32,57,75],best:74,minlengthtext:32,appear:71,maxiconwidth:30,extend:[0,1,2,3,4,5,7,8,9,55,12,13,19,21,18,68,51,22,23,24,25,26,27,28,29,30,31,33,34,35,40,41,43,45,46,49,48,50,52,53,38,56,57,58,59,6,61,62,63,64,65,15,67,69,70,71,72,74,75],slideshar:57,record:[1,25,5,55,11,12,13,15,68,21,51,24,2,27,30,32,22,43,45,49,52,53,56,6,64,31,66,67,69,71],pattern:74,someth:[30,74,57,54],easi:[74,57],particip:60,label:[31,51,64,55],bbar:[68,71],behind:[60,39],gx_layerparam:52,listinfo:36,had:57,between:[3,45,67,66,50,11],printmappanel:[0,11,71,26],"import":14,neither:7,experi:74,approach:[73,66],across:[73,74,57],printpagefield:[62,38,26,71,10],attribut:[1,54,4,63,49,15,28,56,11,13,69,32,21,34,57,75],assumpt:55,popup:[0,72,39,11,26],kei:[30,2,28,52,71,68,57],comp:64,screen:[2,57,39],javascript:[73,20,74,39,54],layerstor:[1,51,4,40,53,31,25,64,26,66,55,67,52,29,71,65,15,68,18,56],popul:[73,57,66],extens:[30,26,57],entir:[2,54],extent:[76,3,23,30,2,11,71,19,68],highlight:39,outer:74,advertis:[75,55],come:[57,55],minut:42,thumb:[59,48,3,23,70],both:[39,57,54],protect:[78,39],img:[33,34],plugin:[38,62,63,26,48,9,59,11,71,76,32,10,34,70],"__like":46,howev:[74,57,66,39],gx_layer:4,mycontrol:57,mucki:57,polici:39,mont:[46,61],tutori:[60,66,42,50,54,73,74,39,57],monitor:66,logic:[74,66],let:[50,39,57,66,54],forceselect:[62,38],defaultstyleisfirst:55,boundari:[57,71],bluemarbl:[20,3,23,39,35,54,73,57],load:[78,33,3,40,53,30,66,28,39,50,51,75,71,74,21,56,57],"var":[76,3,5,7,9,55,61,19,68,23,72,25,39,32,59,34,35,30,45,46,48,50,54,38,57,62,63,66,67,70,71,73,74],simpli:[57,66],setdpi:30,mini:68,instanti:[73,74,66],overview:[30,74],format:[1,39,49,66,55,69,15,13,21],setfeatur:[58,76],gx_layercontain:40,height:[20,3,23,62,30,39,54,73,32,38,74],doaction:[8,46],wmscapabilitiesload:[0,26,75],param:[41,30,66,55,52,28],path:[78,30,50,33,74],gruop:66,respect:[62,64],layernodeui:[63,34,56],guid:57,assum:[51,31,2,64,66,55,54,74],backend:30,describefeaturetyp:[32,11],save:[77,57],becom:54,mailman:36,creat:[1,76,3,4,5,7,8,9,11,12,13,15,19,21,68,22,23,24,25,27,28,29,30,32,59,34,35,78,39,40,43,45,46,42,48,49,50,54,56,57,58,63,64,65,66,67,69,70,71,72,73,75],coupl:57,locat:[57,72,68,11,71],west:74,invers:3,empti:6,sinc:[2,57,39],compon:[0,10,11,16,17,26,31,34,78,37,30,44,54,38,57,58,60,62,76,64,66,35,73,77],json:30,trigger:[76,30,2,46,64,28,61,74,56,57],unsubscrib:36,toolbar:[19,50,11,68],opengeospati:57,modif:[2,26],metadataurl:13,templat:[59,48],quickli:42,invis:3,numsid:57,rather:[56,66,39],fid:22,owstyp:12,fire:[58,30,63,64,9,66,57],given:[45,76,64,2,74,57],imag:[51,66,55,13,33,34,57],resolut:[38,23,30,48,6,59],"_ajax":78,great:[57,39],anywher:66,fade:3,coordin:68,greater_than_or_equal_to:46,minifi:54,togeth:[20,57],child:[56,4],prettystatekei:[68,35,71],educ:74,layerparam:[52,75,13],painter:58,opac:[59,3,11],"case":[30,8,46,74,71,32,68,57],multi:54,gridpanel:[73,7,66,39],baselayercontain:[0,26,66,29],plain:58,dissect:[57,42],properti:[1,25,3,4,5,7,61,55,15,31,13,19,21,68,51,23,72,2,26,28,29,6,32,33,35,78,39,40,41,30,45,46,49,48,50,52,53,38,56,57,58,59,62,76,64,65,66,67,69,70,71,73,74,75],pixel:[6,74,39,72],cursor:64,defin:3,weren:39,ain:57,cannot:[72,54,71,55],error:[33,51],sld:55,exist:[78,57],printdialog:71,anchor:72,radio:[4,63,66,42,29,34],openstreetmap:[11,39],propag:21,triggeract:[62,38],gx_wmslegend:55,file:[78,30,74,57,39],helper:[1,74,21,49,15],applic:[78,20,3,37,30,54,66,42,39,60,73,16,17,57],wrap:[19,39],ramp:60,asynctreenod:[29,40,65],henc:57,site:39,jpg:[34,57,39],describelay:12,"default":[1,3,4,7,55,15,12,13,68,21,23,72,2,27,28,29,30,32,33,35,40,41,43,45,49,48,52,53,38,56,57,58,59,64,66,67,69,70,71],itself:73,href:[74,54],limit:50,rawclicknod:9,attach:54,sever:[73,74],httprequest:[52,28],subscrib:36,selectcontrol:7,treepanel:[4,40,63,9,66,42,52,29,65,73,34],develop:[36,20,60,42,54,73,57],welcom:54,readrecord:[5,25],perform:[73,8,57,61],suggest:57,make:[36,1,33,3,30,49,15,55,50,51,35,71,54,73,68,21,74,57],addlay:[73,39,57,54],cross:39,same:[30,76,66,39,50,71,13,73,68,57],complex:30,pad:55,singletil:[76,71],inch:30,word:57,dealt:[33,51],start:[60,66,42,50,54,14,74],pan:[72,57,71,39],complet:[74,76,39,71,61],finish:[30,16,17,39,37],archiv:36,closest:2,gx_render:58,optim:54,recordtyp:[5,43,25,27,69,12,13],nest:74,upon:[30,71],effect:[78,30,52,28],attributeform:[32,26,10],fairli:57,sourcemap:71,user:[36,20,66,42,50,29,71,54,74,39,57],mani:[74,57],immedi:76,parent:[26,66],littl:50,stack:66,expand:66,googl:[73,57,39],lib:[78,54],task:57,anccl:72,equival:[26,39],layeropt:[75,13],savvi:20,entri:[45,64],markup:78,min:3,well:[57,66,39],getform:46,know:[20,50,57,39],without:[57,71,40,66],client:[73,57,39],command:30,elev:[5,7],choos:[37,16,17,50],programm:57,everyth:78,getlegendgraph:55,labelcl:[31,51,64,55],rout:78,left:74,explor:[73,74,57],comment:60,distanc:50,identifi:[50,63,57,4,13],execut:74,baselay:29,"boolean":[58,51,3,23,41,53,30,7,2,64,48,55,70,71,31,68,59,72,57,35],tip:[59,70,48],exclud:[78,30],obtain:30,insid:[73,2],alloverlai:66,observ:[30,2,28,62,38,56,57],publicu:[46,61],irc:36,aspect:71,world:[50,74],wmsdescribelay:49,less_than:46,gettoptoolbar:50,speed:57,yet:2,web:[20,39,50,75,54,74,57],expos:[73,57],gml:39,indexof:66,point:[58,30,64,39,72,57],help:[20,50,54,66,42],except:[30,57],shortcut:[8,61],desktop:[20,74],wer:56,add:[3,23,53,30,76,46,9,66,10,39,50,71,73,55,57],denomin:[30,64,48,23,6],changevisibilitydelai:3,versa:[7,45,4],win:68,event2:57,els:50,unlik:57,subsequ:78,hat:57,app:20,match:[2,4,62,45,39,52,71,13],equal_to:46,real:50,protocolproxi:[39,18,26,41],rendernod:9,hover:[59,70,48],vendor:55,around:[78,64,39],transpar:[3,66],read:[20,54,76,39,60,41,30,2,46,42,11,71,13,55,57],foundat:54,caller:57,even:[50,57],gx_zoomslid:23,uncheck:4,grid:[0,7,26,66,42,11,73,39],bbox:13,background:39,insert:[73,19,66],step:54,somewher:74,bit:73,loader:[4,40,75,65,66,28,29,56,11],associ:[50,23],measur:[50,57],gx_legendpanel:53,marbl:[73,57],like:[78,4,30,63,46,66,10,54,19,39,74,57],specif:[2,8,46,47,55,71,61,68],header:7,snippet:[74,66],brace:[59,48],layerload:[0,40,26,66,28,29,65,56],the_typenam:32,manual:[30,7,74],html:[54,30,63,72,73,74],integ:72,noth:[2,54],collect:[0,29,40,65],"true":[3,7,55,68,51,23,72,2,39,29,31,32,59,35,40,41,30,46,48,50,53,38,56,58,62,76,64,65,66,70,71,73,74],subnod:[52,4],singl:[74,57],docutil:[61,1,2,3,4,5,6,7,8,9,10,12,13,76,19,21,18,68,51,22,23,24,25,27,28,29,30,31,32,33,34,35,40,41,43,45,46,49,48,52,53,55,56,58,59,38,62,63,64,65,15,67,69,70,71,72,73,75,77],popular:73,output:11,resiz:57,page:[36,76,62,30,2,66,50,11,71,54,73,74,38],wfscapabilitiesread:[1,18,26,27],encount:57,sketch:57,cql_filter:66,old:57,often:[74,57,66],ruleselect:64,understand:61,addbutton:[50,61],creation:[30,7,56,28],selectonclick:64,ptype:[63,62,76,32,38,34],zoom:[20,23,30,76,48,39,50,11,71,6,68,72,57],swatch:64,sure:[36,51,3,55,71,68,33],sampl:[76,3,7,9,61,68,19,23,72,25,39,32,59,34,35,45,46,48,63,67,70,74],superclass:57,componentmanag:4,setrot:2,interf:57,server:[36,30,46,39,54,74,57],rel:[74,54],librari:[37,39,60,47,42,50,54,73,16,17,74,57],addfeatur:57,scale:[23,62,30,2,64,48,55,11,71,6,59],layeropacityslid:[0,59,3,26],bottom:[68,66],avoid:[50,56,28],stateid:35,definit:[1,22,30,49,15,67,24,21],subclass:[52,40,4],symboltyp:[58,64],when:[76,3,7,9,61,16,17,68,23,72,2,59,37,30,46,48,50,57,58,63,64,66,70,71,73,74],larg:73,unit:[6,50,2],gx_urllegend:51,overlai:65,fixedwidth:13,checkedgroup:[66,4],blank_image_url:33,localhost:54,myfunct:57,cgi:36,attributeread:[69,32,21,18,26],customparam:[30,2,38,62],idiomat:50,zoomtomaxext:19,power:[20,57],geowebcach:[20,3,23,39,35,54,73,57],geoserv:[30,76,46,66,71,61],"__ne":46,cascad:13,usag:5,baseattr:[56,66],gx_mappanel:[20,68],accordingli:[72,71],tasmania_c:66,convent:46,discov:57,although:57,offset:[59,70,48],post:[36,30],impos:39,layertre:66,panel:[74,3,23,53,6,46,64,66,42,50,52,11,71,61,73,32,55,68,57,35],plug:[63,34],comparison:46,about:[36,20,60,66,39,50,30,74,57],redraw:58,actual:[73,50,4],would:[8,46,50,71,61,57],addev:57,column:[73,7,39],slightli:57,manag:[50,35,57],countri:57,gx_formpanel:61,integr:73,includ:[78,39,40,30,46,65,47,42,69,29,54,74,21,56,57],dialog:71,constructor:[61,1,3,22,24,7,8,49,15,39,67,13,68,21,74,57],pertin:58,queryabl:13,bodybord:64,untitledprefix:64,road:57,own:[1,44,49,66,15,54,21,57],emphasi:14,removepag:76,primarili:57,press:50,autoel:34,within:[74,76,3,57],encod:[30,35],bound:[2,4,6,7,45,67,71,68],usual:[30,57],dataset:[50,39],down:76,pair:[30,2,52,28],right:50,jsonstor:30,been:[76,19,2],onreadi:[74,54],ensur:50,dpichang:30,browser:[73,74,57,39],"__eq":46,your:[1,55,66,15,16,17,20,21,39,60,78,37,30,44,46,49,50,54,57,47,74,11],leverag:73,websit:[57,54],robust:54,span:[61,1,2,3,4,5,6,7,8,9,10,12,13,76,19,21,18,68,51,22,23,24,25,27,28,29,30,31,32,33,34,35,40,41,43,45,46,49,48,52,53,55,56,58,59,38,62,63,64,65,15,67,69,70,71,72,73,75,77],prepar:54,suffici:66,area:50,support:[20,30,2,66,55,50,72,73],question:36,stylesheet:[74,54],"long":[32,66],custom:[78,37,38,62,30,44,66,28,59,67,48,71,54,73,16,17,56,57],avail:[61,20,40,30,6,2,47,39,11,71,54,73,68,74,57],gif:[57,66,55],compliant:55,loadcap:30,interfac:[20,57,30],low:30,treenoderadiobutton:[34,63,26,10],arg1:57,forward:[36,50],strictli:55,featurestor:[5,45,26,39,18,57],arg2:57,etc:57,"function":[0,1,10,15,61,21,18,24,26,28,34,78,39,22,30,46,49,50,53,54,56,57,63,66,67,35,71,74,77],head:[73,30,74,39,54],properli:71,north:74,hidetitl:[31,51,64,55],form:[0,37,38,61,62,8,46,26,10,11,54,76,16,17,32,57],sub1:74,forc:2,some:[1,3,49,66,39,50,47,54,15,32,21,74,57],printer:2,basic:[1,46,49,15,42,73,50,54,14,74,21,57],less_than_or_equal_to:46,"__lt":46,popupcl:72,treeload:[40,4,75],hear:36,seturl:33,intern:61,scope:[57,56,53,61],don:[64,66,39,35,71,19,68,57],line:[58,64,39,50,73,74,57],baseparam:[30,32,55],symbolclick:64,awai:57,freenod:36,"__le":46,info:[30,50],pull:66,"throw":57,made:3,attr:[56,28],tab:74,possibl:[30,66],whether:[31,51,64,35,55],geospati:[20,57,54],unpin:72,analyz:50,eventobject:9,tell:[30,39,50,73,74,57],legendpanel:[0,30,26,55,53,31],independ:66,below:[36,37,30,47,78,16,17,34,57],meta:[5,43,25,27,69,12,13],those:[61,1,2,3,4,5,7,8,55,15,31,13,19,21,68,51,40,23,24,25,28,29,6,33,35,22,41,30,45,46,49,48,52,53,38,56,57,58,59,62,64,65,66,67,70,71,72,75],reorder:[73,66],setprovid:35,otherwis:[3,40,65,55,57,29,53,56,23],minscal:13,similar:57,zoomend:57,layerparamload:[0,28,66,4,26],block:[5,30,74,25,11],featur:[58,45,39,22,41,5,64,7,2,46,42,50,69,11,72,76,32,21,57],layerdata:25,evalu:45,request:[78,1,41,30,46,49,15,55,61,32],"abstract":13,attributioncl:13,life:54,repres:[1,22,4,30,2,49,15,52,24,69,68,21,74,57],autoscrol:[73,32],decreas:57,grouplay:66,either:[1,30,7,8,49,15,28,67,52,69,21],almost:57,vectorlay:57,previewscal:71,rearrang:66,check:[74,66,4,56],link:[37,13,26,54,16,17,74,57],fill:32,again:[3,57],readi:[74,54],polygon:[50,64,58,57],getrecordfromfeatur:45,titl:[72,20,51,39,62,24,7,54,64,66,55,67,52,74,31,13,73,68,38,34],curli:[59,48],excel:[50,74],detail:[60,19,26],virtual:[73,57],urllegend:[0,51,26],idiom:74,setsymbol:58,other:[78,1,3,49,15,39,50,74,21,57],nav:57,normal:[73,39],varieti:[74,39,54],groupingstor:[68,71],ignor:[51,40,31,7,64,65,55,69,29,57],you:[1,7,15,68,17,16,20,21,39,60,36,37,30,44,49,50,54,57,66,78,35,71,73,74],disablecach:21,nice:73,node:[4,40,75,63,9,66,28,52,11,65,73,56,42,34,29],http:[36,20,76,3,23,30,61,46,66,39,35,71,54,73,32,57],draw:[73,50,58,66],notif:36,intend:54,regardless:64,printexcept:30,gxmap:[73,54],symbol:[58,64,11],decod:35,much:[73,30,74],drag:[64,48,50,70,66,59],transformfeatur:76,wfscapabilitiesstor:[1,18,26],dom:[73,72,74,9,13],reason:54,layercontain:[0,40,26,66,65,29,11],accommod:66,stai:50,setlay:[24,3,22],printservic:30,gx_opacityslid:3,scalestor:[6,18,26],vice:[7,45,4],directori:[74,39,54],unselect:64,kml:[39,57,42],descript:[49,12,39],rule:64,hello:74,uiprovid:[56,63,9,40,34],layerfromstor:7,extj:[66,42,73,50,54,14,39],nasa:57,boxcompon:[58,33,51],time:[3,35,66,28,50,29,56,11],map_to_stor:67,store_to_lay:45,preconfigur:66,scroll:57,stick:50},titles:["Widgets","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WFSCapabilitiesStore</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.PrintPage</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.LayerOpacitySlider</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.LayerNode</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.FeatureReader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.ScaleStore</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.grid.FeatureSelectionModel</span></tt>","<tt class=\"docutils literal\"><span class=\"pre\">GeoExt.form.BasicForm</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.TreeNodeUIEventMixin</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins</span></tt>","Examples","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WMSDescribeLayerReader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WMSCapabilitiesReader</span></tt>","Core Concepts","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WMSCapabilitiesStore</span></tt>","GeoExt 0.6 Builder","GeoExt 0.7 Builder","<tt class=\"docutils literal\"><span class=\"pre\">GeoExt.data</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.Action</span></tt>","JavaScript Toolkit for Rich Web Mapping Applications","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.AttributeStore</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.FeatureRecord</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.ZoomSlider</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.LayerRecord</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.LayerReader</span></tt>","API Reference","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WFSCapabilitiesReader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.LayerParamLoader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.BaseLayerContainer</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.PrintProvider</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.LayerLegend</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.AttributeForm</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.LegendImage</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.TreeNodeComponent</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.state.PermalinkProvider</span></tt>","GeoExt Community Involvement","GeoExt 1.0 Builder","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.PrintProviderField</span></tt>","Vector Data Tutorial","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.LayerContainer</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.ProtocolProxy</span></tt>","Tutorials","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WMCReader</span></tt>","Download GeoExt","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.FeatureStore</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.form.SearchAction</span></tt>","Ext Overrides","<tt class=\"docutils literal docutils literal docutils literal\"><span class=\"pre\">GeoExt.ZoomSliderTip</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.WMSDescribeLayerStore</span></tt>","Map Tool Tutorial","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.UrlLegend</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.LayerParamNode</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.LegendPanel</span></tt>","GeoExt QuickStart","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.WMSLegend</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.LayerLoader</span></tt>","Primer: OpenLayers","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.FeatureRenderer</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.LayerOpacitySliderTip</span></tt>","Documentation","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.form.FormPanel</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.PrintPageField</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.TreeNodeRadioButton</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.VectorLegend</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.OverlayLayerContainer</span></tt>","Layer Tree Tutorial","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.LayerStore</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.MapPanel</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.data.AttributeReader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.SliderTip</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.PrintMapPanel</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.Popup</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">MapPanel</span></tt> Tutorial","Primer: Ext","<tt class=\"docutils literal docutils literal docutils literal\"><span class=\"pre\">GeoExt.tree.WMSCapabilitiesLoader</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.plugins.PrintExtent</span></tt>","<tt class=\"docutils literal docutils literal\"><span class=\"pre\">GeoExt.state</span></tt>","Ext.Ajax Overrides"],modules:{"GeoExt.grid":0,GeoExt:26,"GeoExt.data":18,"GeoExt.plugins":10,"GeoExt.state":77,"GeoExt.form":0,"GeoExt.tree":0},descrefs:{GeoExt:{FeatureRenderer:[58,2],SliderTip:[70,2],Popup:[72,2],ZoomSliderTip:[48,2],VectorLegend:[64,2],LayerLegend:[31,2],LegendImage:[33,2],LayerOpacitySlider:[3,2],LegendPanel:[53,2],Action:[19,2],ZoomSlider:[23,2],UrlLegend:[51,2],MapPanel:[68,2],LayerOpacitySliderTip:[59,2],PrintMapPanel:[71,2],WMSLegend:[55,2]},"GeoExt.plugins":{PrintProviderField:[38,2],PrintPageField:[62,2],PrintExtent:[76,2],AttributeForm:[32,2]},"GeoExt.data.FeatureRecord":{create:[22,3],getFeature:[22,0],setLayer:[22,0]},"GeoExt.state":{PermalinkProvider:[35,2]},"GeoExt.data.PrintProvider":{dpis:[30,1],layout:[30,1],customParams:[30,1],setLayout:[30,0],layouts:[30,1],loadCapabilities:[30,0],print:[30,0],setDpi:[30,0],dpi:[30,1],scales:[30,1]},"GeoExt.form.BasicForm":{doAction:[8,0],search:[8,0]},"GeoExt.data":{LayerStore:[67,2],WMSDescribeLayerReader:[12,2],WMSDescribeLayerStore:[49,2],WFSCapabilitiesReader:[27,2],FeatureReader:[5,2],WMSCapabilitiesReader:[13,2],ScaleStore:[6,2],WFSCapabilitiesStore:[1,2],WMSCapabilitiesStore:[15,2],ProtocolProxy:[41,2],FeatureRecord:[22,2],AttributeStore:[21,2],LayerReader:[25,2],WMCReader:[43,2],FeatureStore:[45,2],PrintProvider:[30,2],PrintPage:[2,2],AttributeReader:[69,2],LayerRecord:[24,2]},"GeoExt.data.LayerRecord":{create:[24,3],getLayer:[24,0],clone:[24,0],setLayer:[24,0]},"GeoExt.LayerOpacitySlider":{setLayer:[3,0]},"GeoExt.data.LayerReader":{readRecords:[25,0]},"GeoExt.data.FeatureStore":{bind:[45,0],unbind:[45,0],getRecordFromFeature:[45,0]},"GeoExt.PrintMapPanel":{previewScales:[71,1],map:[71,1],layers:[71,1],printProvider:[71,1],print:[71,0],printPage:[71,1]},"GeoExt.LegendImage":{setUrl:[33,0]},"GeoExt.plugins.PrintExtent":{printProvider:[76,1],hide:[76,0],show:[76,0],removePage:[76,0],pages:[76,1],print:[76,0],selectPage:[76,0],page:[76,1],addPage:[76,0]},"GeoExt.grid":{FeatureSelectionModel:[7,2]},"GeoExt.MapPanel":{layers:[68,1],map:[68,1]},"GeoExt.VectorLegend":{update:[64,0],setCurrentScaleDenominator:[64,0]},"GeoExt.form.SearchAction":{response:[46,1]},"GeoExt.FeatureRenderer":{setFeature:[58,0],setSymbolType:[58,0],update:[58,0],setSymbolizers:[58,0]},"GeoExt.data.LayerStore":{map:[67,1]},"GeoExt.tree.LayerLoader":{createNode:[56,0]},"GeoExt.grid.FeatureSelectionModel":{bind:[7,0],unbind:[7,0]},"GeoExt.tree.LayerParamLoader":{createNode:[28,0]},"GeoExt.form":{BasicForm:[8,2],FormPanel:[61,2],SearchAction:[46,2]},"GeoExt.form.FormPanel":{search:[61,0]},"GeoExt.ZoomSlider":{getZoom:[23,0],getScale:[23,0],getResolution:[23,0]},"GeoExt.data.FeatureReader":{readRecords:[5,0]},"GeoExt.Popup":{setSize:[72,0]},"GeoExt.tree.LayerNode":{layer:[4,1]},"GeoExt.state.PermalinkProvider":{getLink:[35,0]},"GeoExt.data.PrintPage":{scale:[2,1],center:[2,1],fit:[2,0],customParams:[2,1],setCenter:[2,0],feature:[2,1],setScale:[2,0],setRotation:[2,0],rotation:[2,1],getPrintExtent:[2,0]},"GeoExt.data.ScaleStore":{bind:[6,0],unbind:[6,0]},"GeoExt.tree":{LayerParamNode:[52,2],LayerContainer:[40,2],OverlayLayerContainer:[65,2],BaseLayerContainer:[29,2],LayerNode:[4,2],LayerParamLoader:[28,2],LayerLoader:[56,2],WMSCapabilitiesLoader:[75,2]}},filenames:["lib/GeoExt/widgets","lib/GeoExt/data/WFSCapabilitiesStore","lib/GeoExt/data/PrintPage","lib/GeoExt/widgets/LayerOpacitySlider","lib/GeoExt/widgets/tree/LayerNode","lib/GeoExt/data/FeatureReader","lib/GeoExt/data/ScaleStore","lib/GeoExt/widgets/grid/FeatureSelectionModel","lib/GeoExt/widgets/form/BasicForm","lib/GeoExt/widgets/tree/TreeNodeUIEventMixin","lib/GeoExt/plugins","examples","lib/GeoExt/data/WMSDescribeLayerReader","lib/GeoExt/data/WMSCapabilitiesReader","primers/index","lib/GeoExt/data/WMSCapabilitiesStore","builder/v0.6","builder/v0.7","lib/GeoExt/data","lib/GeoExt/widgets/Action","index","lib/GeoExt/data/AttributeStore","lib/GeoExt/data/FeatureRecord","lib/GeoExt/widgets/ZoomSlider","lib/GeoExt/data/LayerRecord","lib/GeoExt/data/LayerReader","lib/index","lib/GeoExt/data/WFSCapabilitiesReader","lib/GeoExt/widgets/tree/LayerParamLoader","lib/GeoExt/widgets/tree/BaseLayerContainer","lib/GeoExt/data/PrintProvider","lib/GeoExt/widgets/LayerLegend","lib/GeoExt/plugins/AttributeForm","lib/GeoExt/widgets/LegendImage","lib/GeoExt/plugins/TreeNodeComponent","lib/GeoExt/state/PermalinkProvider","developer/index","builder/v1.0","lib/GeoExt/plugins/PrintProviderField","tutorials/remote-features-tutorial","lib/GeoExt/widgets/tree/LayerContainer","lib/GeoExt/data/ProtocolProxy","tutorials/index","lib/GeoExt/data/WMCReader","downloads","lib/GeoExt/data/FeatureStore","lib/GeoExt/widgets/form/SearchAction","lib/overrides","lib/GeoExt/widgets/tips/ZoomSliderTip","lib/GeoExt/data/WMSDescribeLayerStore","tutorials/control-button-tutorial","lib/GeoExt/widgets/UrlLegend","lib/GeoExt/widgets/tree/LayerParamNode","lib/GeoExt/widgets/LegendPanel","tutorials/quickstart","lib/GeoExt/widgets/WMSLegend","lib/GeoExt/widgets/tree/LayerLoader","primers/openlayers-primer","lib/GeoExt/widgets/FeatureRenderer","lib/GeoExt/widgets/tips/LayerOpacitySliderTip","docs","lib/GeoExt/widgets/form/FormPanel","lib/GeoExt/plugins/PrintPageField","lib/GeoExt/plugins/TreeNodeRadioButton","lib/GeoExt/widgets/VectorLegend","lib/GeoExt/widgets/tree/OverlayLayerContainer","tutorials/layertree-tutorial","lib/GeoExt/data/LayerStore","lib/GeoExt/widgets/MapPanel","lib/GeoExt/data/AttributeReader","lib/GeoExt/widgets/tips/SliderTip","lib/GeoExt/widgets/PrintMapPanel","lib/GeoExt/widgets/Popup","tutorials/mappanel-tutorial","primers/ext-primer","lib/GeoExt/widgets/tree/WMSCapabilitiesLoader","lib/GeoExt/plugins/PrintExtent","lib/GeoExt/state","lib/overrides/override-ext-ajax"]})
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/modindex.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/modindex.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/modindex.html	(revision 76)
@@ -0,0 +1,136 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>Global Module Index &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="index.html" />
+
+    
+    
+    
+    
+    
+
+
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="index.html">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Global Module Index</a></li>
+      </ul>
+    </div>
+
+      <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+        </div>
+      </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+
+   <h1 id="global-module-index">Global Module Index</h1>
+   <a href="#cap-G"><strong>G</strong></a> 
+   <hr/>
+
+   <table width="100%" class="indextable" cellspacing="0" cellpadding="2"><tr class="pcap"><td></td><td>&nbsp;</td><td></td></tr>
+   <tr class="cap"><td></td><td><a name="cap-G"><strong>G</strong></a></td><td></td></tr><tr>
+     <td><img src="_static/minus.png" id="toggle-1"
+            class="toggler" style="display: none" alt="-" /></td>
+     <td>
+     <a href="lib/index.html#module-GeoExt"><tt class="xref">GeoExt</tt></a></td><td>
+     <em>Extending mapping functionality to Ext classes.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/data.html#module-GeoExt.data"><tt class="xref">GeoExt.data</tt></a></td><td>
+     <em>A collection of map data related classes.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/widgets.html#module-GeoExt.form"><tt class="xref">GeoExt.form</tt></a></td><td>
+     <em>A collection of form related classes.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/widgets.html#module-GeoExt.grid"><tt class="xref">GeoExt.grid</tt></a></td><td>
+     <em>A collection of grid related classes.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/plugins.html#module-GeoExt.plugins"><tt class="xref">GeoExt.plugins</tt></a></td><td>
+     <em>Plugins add functionality to components like maps or forms.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/state.html#module-GeoExt.state"><tt class="xref">GeoExt.state</tt></a></td><td>
+     <em>State-related functionality.</em></td></tr><tr class="cg-1">
+     <td></td>
+     <td>&nbsp;&nbsp;&nbsp;
+     <a href="lib/GeoExt/widgets.html#module-GeoExt.tree"><tt class="xref">GeoExt.tree</tt></a></td><td>
+     <em>A collection of tree related classes.</em></td></tr>
+   </table>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+    <div class="related">
+      <h3>Navigation</h3>
+      <ul>
+            <li class="right" style="margin-right: 10px">
+              <a href="genindex.html" title="General Index"
+                 accesskey="I">index</a></li>
+            <li class="right" >
+              <a href="#" title="Global Module Index"
+                 accesskey="M">modules</a> |</li>
+        <li><a href="index.html">GeoExt</a> &raquo;</li>
+        <li><a href="#">Global Module Index</a></li>
+      </ul>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/docs/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/docs/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/docs/index.html	(revision 76)
@@ -0,0 +1,123 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    
+    <title>JavaScript Toolkit for Rich Web Mapping Applications &mdash; GeoExt v1.0</title>
+    <link rel="stylesheet" href="_static/geoext.css" type="text/css" />
+    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+    <script type="text/javascript">
+      var DOCUMENTATION_OPTIONS = {
+        URL_ROOT:    '#',
+        VERSION:     '1.0',
+        COLLAPSE_MODINDEX: false,
+        FILE_SUFFIX: '.html',
+        HAS_SOURCE:  true
+      };
+    </script>
+    <script type="text/javascript" src="_static/jquery.js"></script>
+    <script type="text/javascript" src="_static/doctools.js"></script>
+    <link rel="shortcut icon" href="_static/favicon.ico"/>
+    <link rel="top" title="GeoExt v1.0" href="#" />
+    <link rel="next" title="Documentation" href="docs.html" />
+    
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <script type="text/javascript" src="http://openlayers.org/api/2.10/OpenLayers.js"></script>
+    <script src="_static/GeoExt.js"></script>
+    <script src="_static/front-page.js"></script>
+    
+    
+    
+    
+    
+
+  </head>
+  <body>
+    <div class="header">
+        <div class="wrap">
+            <h1 id="logo"><a href="#">GeoExt</a></h1>
+            <ul id="top-nav">
+                <li class="first"><a href="docs.html">Documentation</a></li>
+                <li><a href="examples.html">Examples</a></li>
+                <li><a href="downloads.html">Download</a></li>
+                <li><a href="http://trac.geoext.org/">Development</a></li>
+            </ul>
+            <div id="searchbox">
+                <form class="search" action="search.html" method="get">
+                    <input id="searchbox-query" type="text" name="q" size="25" value="Search &hellip;" tabindex="3" onblur="if(this.value=='') this.value='Search &hellip;';" onfocus="if(this.value=='Search &hellip;') this.value='';" />
+                    <input id="searchbox-submit" type="image" value="Search" src="_static/img/search_icon_green.png" />
+                    <input type="hidden" name="check_keywords" value="yes" />
+                    <input type="hidden" name="area" value="default" />
+                </form>
+            </div>
+        </div>
+    </div>
+
+
+    <div class="sphinxsidebar">
+        <div class="sphinxsidebarwrapper">
+            <h1>Download</h1>
+            <p>Current release: <a href="downloads.html">1.0</a></p>
+            <h1>GeoExt News</h1>
+            <script charset="ISO-8859-1" src="http://landmark-project.com/feed2js/feed2js.php?src=http%3A%2F%2Fgeoext.blogspot.com%2Ffeeds%2Fposts%2Fdefault%3Falt%3Drss&num=3&desc=75"></script>
+            <span><a href="http://geoext.blogspot.com" title="GeoExt Blog">more ...</a></span>
+        </div>
+    </div>
+
+
+    <div class="document">
+      <div class="documentwrapper">
+        <div class="bodywrapper">
+          <div class="body">
+            
+  <div class="section" id="javascript-toolkit-for-rich-web-mapping-applications">
+<h1>JavaScript Toolkit for Rich Web Mapping Applications<a class="headerlink" href="#javascript-toolkit-for-rich-web-mapping-applications" title="Permalink to this headline">Â¶</a></h1>
+<p>GeoExt brings together the geospatial know how of
+<a class="reference external" href="http://openlayers.org">OpenLayers</a> with the user interface savvy of <a class="reference external" href="http://www.sencha.com/products/js/">Ext JS</a> to help you build powerful desktop style GIS apps on
+the web with JavaScript.</p>
+<p><a class="reference external" href="./docs.html">Documentation</a> |
+<a class="reference external" href="examples.html#examples"><em>Examples</em></a> |
+<a class="reference external" href="./downloads.html">Download</a> |
+<a class="reference external" href="http://trac.geoext.org/">Development</a></p>
+<div class="section" id="using-geoext">
+<h2>Using GeoExt<a class="headerlink" href="#using-geoext" title="Permalink to this headline">Â¶</a></h2>
+<p>See GeoExt in action.</p>
+<div class="execute highlight-javascript"><div class="highlight"><pre><span class="k">new</span> <span class="nx">Ext</span><span class="p">.</span><span class="nx">Window</span><span class="p">({</span>
+    <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;GeoExt in Action&quot;</span><span class="p">,</span>
+    <span class="nx">height</span><span class="o">:</span> <span class="mi">280</span><span class="p">,</span> <span class="nx">width</span><span class="o">:</span> <span class="mi">450</span><span class="p">,</span> <span class="nx">layout</span><span class="o">:</span> <span class="s2">&quot;fit&quot;</span><span class="p">,</span>
+    <span class="nx">items</span><span class="o">:</span> <span class="p">[{</span>
+        <span class="nx">xtype</span><span class="o">:</span> <span class="s2">&quot;gx_mappanel&quot;</span><span class="p">,</span>
+        <span class="nx">layers</span><span class="o">:</span> <span class="p">[</span><span class="k">new</span> <span class="nx">OpenLayers</span><span class="p">.</span><span class="nx">Layer</span><span class="p">.</span><span class="nx">WMS</span><span class="p">(</span>
+            <span class="s2">&quot;Global Imagery&quot;</span><span class="p">,</span> <span class="s2">&quot;http://maps.opengeo.org/geowebcache/service/wms&quot;</span><span class="p">,</span>
+            <span class="p">{</span><span class="nx">layers</span><span class="o">:</span> <span class="s2">&quot;bluemarble&quot;</span><span class="p">}</span>
+        <span class="p">)],</span>
+        <span class="nx">zoom</span><span class="o">:</span> <span class="mi">1</span>
+    <span class="p">}]</span>
+<span class="p">}).</span><span class="nx">show</span><span class="p">();</span>
+</pre></div>
+</div>
+<p>Learn more about using GeoExt in your application by reading the
+<a class="reference external" href="docs.html"><em>documentation</em></a>.</p>
+</div>
+<div class="section" id="geoext-is-open-source">
+<h2>GeoExt is Open Source<a class="headerlink" href="#geoext-is-open-source" title="Permalink to this headline">Â¶</a></h2>
+<p>GeoExt is available under the BSD license and is supported by a growing
+community of individuals, businesses and organizations.</p>
+</div>
+</div>
+
+
+          </div>
+        </div>
+      </div>
+      <div class="clearer"></div>
+    </div>
+
+    <div class="footer">
+      &copy; Copyright 2009-2010, GeoExt Community.
+    </div>
+  </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/layerlegend.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/layerlegend.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/layerlegend.css	(revision 76)
@@ -0,0 +1,1 @@
+.gx-ruledrag-insert-below{border-bottom:1px dotted;}.gx-ruledrag-insert-above{border-top:1px dotted;}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all.css	(revision 76)
@@ -0,0 +1,2 @@
+
+.gx-popup-anc{background:transparent url(../images/default/anchor.png) no-repeat 0 0;position:relative;top:-1px;left:5px;z-index:2;height:16px;width:31px;}.gx-ruledrag-insert-below{border-bottom:1px dotted;}.gx-ruledrag-insert-above{border-top:1px dotted;}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-gray.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-gray.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-gray.css	(revision 76)
@@ -0,0 +1,1 @@
+.gx-popup-anc{background:transparent url(../images/gray/anchor.png) no-repeat 0 0;position:relative;top:-1px;left:5px;z-index:2;height:16px;width:31px;}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/popup.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/popup.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/popup.css	(revision 76)
@@ -0,0 +1,1 @@
+.gx-popup-anc{background:transparent url(../images/default/anchor.png) no-repeat 0 0;position:relative;top:-1px;left:5px;z-index:2;height:16px;width:31px;}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all-debug.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all-debug.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/geoext-all-debug.css	(revision 76)
@@ -0,0 +1,1 @@
+@import popup.css;@import layerlegend.css;
Index: /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-slate.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-slate.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/resources/css/gxtheme-slate.css	(revision 76)
@@ -0,0 +1,1 @@
+.gx-popup-anc{background:transparent url(../images/slate/anchor.png) no-repeat 0 0;position:relative;top:-1px;left:5px;z-index:2;height:16px;width:31px;}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.html	(revision 76)
@@ -0,0 +1,30 @@
+<html>
+    <head>
+        <title>GeoExt FeatureStore in an Ext Grid</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="feature-grid.js"></script>
+
+    </head>
+    <body>
+        <h1>Grid Panel configured with a GeoExt.data.FeatureStore</h1>
+
+        <p>This example shows an Ext grid loaded with features read from a
+        GeoJSON document (data/summits.json).</p>
+        
+        <p>Because the layer and the store are bound to each other, the
+        features loaded into the store are automatically added to the layer. A 
+        GeoExt feature selection model is also used so that selecting rows in 
+        the grid selects features in the layer, and vice-versa.</p> 
+
+        <p>See <a href=feature-grid.js>feature-grid.js</a>.</p>
+
+        <div id="mainpanel"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.js	(revision 76)
@@ -0,0 +1,172 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[renderer]
+ *  Feature Renderer
+ *  ----------------
+ *  Render a vector feature with multiple symbolizers in a box component.
+ */
+
+var blue = {
+    fillColor: "blue",
+    fillOpacity: 0.25,
+    strokeColor: "blue",
+    strokeWidth: 2,
+    pointRadius: 5
+};
+
+var custom = {
+    point: {
+        graphicName: "star",
+        pointRadius: 8,
+        fillColor: "yellow",
+        strokeColor: "red",
+        strokeWidth: 1
+    },
+    line: {
+        strokeColor: "#669900",
+        strokeWidth: 3
+    },
+    poly: {
+        fillColor: "olive",
+        fillOpacity: 0.25,
+        strokeColor: "#666666",
+        strokeWidth: 2,
+        strokeDashstyle: "dot"
+    }
+};
+
+var stacked = {
+    point: [{
+        pointRadius: 8,
+        fillColor: "white",
+        strokeColor: "red",
+        strokeWidth: 2
+    }, {
+        graphicName: "star",
+        pointRadius: 5,
+        fillColor: "red"
+    }],
+    line: [{
+        strokeColor: "red",
+        strokeWidth: 5
+    }, {
+        strokeColor: "#ff9933",
+        strokeWidth: 2
+    }],
+    poly: [{
+        strokeWidth: 3,
+        fillColor: "white",
+        strokeColor: "#669900"
+    }, {
+        strokeWidth: 2,
+        fillOpacity: 0,
+        strokeColor: "red",
+        strokeDashstyle: "dot"
+    }]
+};
+
+var configs = [{
+    symbolType: "Point",
+    renderTo: "point_default"
+}, {
+    symbolType: "Line",
+    renderTo: "line_default"
+}, {
+    symbolType: "Polygon",
+    renderTo: "poly_default"
+}, {
+    symbolType: "Point",
+    symbolizers: [blue],
+    renderTo: "point_blue"
+}, {
+    symbolType: "Line",
+    symbolizers: [blue],
+    renderTo: "line_blue"
+}, {
+    symbolType: "Polygon",
+    symbolizers: [blue],
+    renderTo: "poly_blue"
+}, {
+    symbolType: "Point",
+    symbolizers: [custom.point],
+    renderTo: "point_custom"
+}, {
+    symbolType: "Line",
+    symbolizers: [custom.line],
+    renderTo: "line_custom"
+}, {
+    symbolType: "Polygon",
+    symbolizers: [custom.poly],
+    renderTo: "poly_custom"
+}, {
+    symbolType: "Point",
+    symbolizers: stacked.point,
+    renderTo: "point_stacked"
+}, {
+    symbolType: "Line",
+    symbolizers: stacked.line,
+    renderTo: "line_stacked"
+}, {
+    symbolType: "Polygon",
+    symbolizers: stacked.poly,
+    renderTo: "poly_stacked"
+}];
+
+Ext.onReady(function() {        
+    for(var i=0; i<configs.length; ++i) {
+        new GeoExt.FeatureRenderer(configs[i]);
+    }
+    $("render").onclick = render;
+});
+
+var format = new OpenLayers.Format.WKT();
+var renderer, win;
+function render() {
+    var wkt = $("wkt").value;
+    var feature;
+    try {
+        feature = format.read(wkt)
+    } catch(err) {
+        $("wkt").value = "Bad WKT: " + err;
+    }
+    var symbolizers;
+    try {
+        var value = $("symbolizers").value;
+        symbolizers = eval("(" + value + ")");
+        if (!symbolizers || symbolizers.constructor !== Array) {
+            throw "Must be an array literal";
+        }
+    } catch(err) {
+        $("symbolizers").value = "Bad symbolizers: " + err + "\n\n" + value;
+        symbolizers = null;
+    }
+    if(feature && symbolizers) {
+        if(!win) {
+            renderer = new GeoExt.FeatureRenderer({
+                feature: feature,
+                symbolizers: symbolizers,
+                width: 150,
+                style: {margin: 4}
+            });
+            win = new Ext.Window({
+                closeAction: "hide",
+                layout: "fit",
+                width: 175,
+                items: [renderer]
+            });
+        } else {
+            renderer.update({
+                feature: feature,
+                symbolizers: symbolizers
+            });
+        }
+        win.show();
+    }
+}
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.html	(revision 76)
@@ -0,0 +1,21 @@
+<html>
+    <head>
+        <title>GeoExt ScaleStore Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="zoom-chooser.js"></script>
+
+    </head>
+    <body>
+        <h1>GeoExt.data.ScaleStore with an Existing OpenLayers.Map</h1>
+        <p>This example demonstrates the use of a GeoExt.data.ScaleStore to list the available zoom levels for a map.<p>
+        <p>The js is not minified so it is readable. See <a href="zoom-chooser.js">zoom-chooser.js</a>.</p>
+        <div id="mappanel"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/feature-grid.js	(revision 76)
@@ -0,0 +1,85 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[feature-grid]
+ *  Grid with Features
+ *  ------------------
+ *  Synchronize selection of features between a grid and a layer.
+ */
+
+var mapPanel, store, gridPanel, mainPanel;
+
+Ext.onReady(function() {
+    // create map instance
+    var map = new OpenLayers.Map();
+    var wmsLayer = new OpenLayers.Layer.WMS(
+        "vmap0",
+        "http://vmap0.tiles.osgeo.org/wms/vmap0",
+        {layers: 'basic'}
+    );
+
+    // create vector layer
+    var vecLayer = new OpenLayers.Layer.Vector("vector");
+    map.addLayers([wmsLayer, vecLayer]);
+
+    // create map panel
+    mapPanel = new GeoExt.MapPanel({
+        title: "Map",
+        region: "center",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 6
+    });
+ 
+    // create feature store, binding it to the vector layer
+    store = new GeoExt.data.FeatureStore({
+        layer: vecLayer,
+        fields: [
+            {name: 'name', type: 'string'},
+            {name: 'elevation', type: 'float'}
+        ],
+        proxy: new GeoExt.data.ProtocolProxy({
+            protocol: new OpenLayers.Protocol.HTTP({
+                url: "data/summits.json",
+                format: new OpenLayers.Format.GeoJSON()
+            })
+        }),
+        autoLoad: true
+    });
+
+    // create grid panel configured with feature store
+    gridPanel = new Ext.grid.GridPanel({
+        title: "Feature Grid",
+        region: "east",
+        store: store,
+        width: 320,
+        columns: [{
+            header: "Name",
+            width: 200,
+            dataIndex: "name"
+        }, {
+            header: "Elevation",
+            width: 100,
+            dataIndex: "elevation"
+        }],
+        sm: new GeoExt.grid.FeatureSelectionModel() 
+    });
+
+    // create a panel and add the map panel and grid panel
+    // inside it
+    mainPanel = new Ext.Panel({
+        renderTo: "mainpanel",
+        layout: "border",
+        height: 400,
+        width: 920,
+        items: [mapPanel, gridPanel]
+    });
+});
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.html	(revision 76)
@@ -0,0 +1,23 @@
+<html>
+    <head>
+        <title>GeoExt ZoomSlider</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="zoomslider.js"></script>
+    </head>
+    <body>
+        <h1>GeoExt.ZoomSlider</h1>
+        <p>The ZoomSlider allows control of the map scale using an Ext.Slider.
+        It is also possible to add a special tooltip plugin, ZoomSliderTip, which
+        will show the zoom level, scale and resolution while dragging the slider
+        (the content is configurable).<p>
+        <p>The js is not minified so it is readable. See <a href="zoomslider.js">zoomslider.js</a>.</p>
+        <div id="map-container"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.html	(revision 76)
@@ -0,0 +1,42 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>GeoExt Legend Tree</title>
+        
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="tree-legend.js"></script>
+
+        <style type="text/css">
+        .legend {
+            padding-left: 18px;
+        }
+        .x-tree-node-el {
+            border-bottom: 1px solid #ddd;
+            padding-bottom: 3px;
+        }
+        .x-tree-ec-icon {
+            width: 3px;
+        }
+        .gx-tree-layer-icon {
+            display: none;
+        }
+    </style>
+
+    </head>
+    <body>
+        <div id="desc">
+            <h1>GeoExt Legend Tree</h1>
+
+            <p>This example shows how to add legends to the layer nodes in a
+            tree.</p>
+
+            <p>The js is not minified so it is readable. See
+            <a href="tree-legend.js">tree-legend.js</a>.</p>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoom-chooser.js	(revision 76)
@@ -0,0 +1,68 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[zoom-chooser]
+ *  Scale Chooser
+ *  -------------
+ *  Use a ComboBox to display available map scales.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    var map = new OpenLayers.Map();
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    map.addLayer(layer);
+
+    var scaleStore = new GeoExt.data.ScaleStore({map: map});
+    var zoomSelector = new Ext.form.ComboBox({
+        store: scaleStore,
+        emptyText: "Zoom Level",
+        tpl: '<tpl for="."><div class="x-combo-list-item">1 : {[parseInt(values.scale)]}</div></tpl>',
+        editable: false,
+        triggerAction: 'all', // needed so that the combo box doesn't filter by its current content
+        mode: 'local' // keep the combo box from forcing a lot of unneeded data refreshes
+    });
+
+    zoomSelector.on('select', 
+        function(combo, record, index) {
+            map.zoomTo(record.data.level);
+        },
+        this
+    );     
+
+    map.events.register('zoomend', this, function() {
+        var scale = scaleStore.queryBy(function(record){
+            return this.map.getZoom() == record.data.level;
+        });
+
+        if (scale.length > 0) {
+            scale = scale.items[0];
+            zoomSelector.setValue("1 : " + parseInt(scale.data.scale));
+        } else {
+            if (!zoomSelector.rendered) return;
+            zoomSelector.clearValue();
+        }
+    });
+
+    mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        bbar: [zoomSelector]
+    });
+});
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.html	(revision 76)
@@ -0,0 +1,42 @@
+<html>
+    <head>
+        <title>GeoExt Vector Legend</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="vector-legend.js"></script>
+        <style>
+            #wrapper {
+                position: relative;
+            }
+            #mappanel {
+                position: absolute;
+                top: 0px;
+                left: 0px;
+                width: 512px;
+                height: 256px;
+            }
+            #legend {
+                position: absolute;
+                top: 0px;
+                left: 550px;
+                height: 256px;
+                width: 150px;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>GeoExt.LegendPanel with Vector Layers</h1>
+        <p>This example shows the how to create a legend for vector layers.  Zoom out to see how the legend is updated with changes in scale.<p>
+        <p>The js is not minified so it is readable. See <a href="vector-legend.js">vector-legend.js</a>.</p>
+        <div id="wrapper">
+            <div id="mappanel"></div>
+            <div id="legend"></div>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.html	(revision 76)
@@ -0,0 +1,30 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>GeoExt Tree Components</title>
+        
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="tree.js"></script>
+
+    </head>
+    <body>
+        <div id="desc">
+            <h1>GeoExt.tree Components</h1>
+            <p>This example shows how to work with a layer tree.  The basic
+            component for building layer trees is the LayerNode, and there are
+            different types of containers for automatically adding a map's
+            layers to the tree. The tree configuration of this example is pure
+            JSON and can be edited live by clicking on the "Show/Edit Tree Config"
+            button below the layers panel.<p>
+            <p>The js is not minified so it is readable. See
+            <a href="tree.js">tree.js</a>.</p>
+            <p>Also see the <a href="layercontainer.html">Layer Container</a>
+            example for drag-n-drop support.</p>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/zoomslider.js	(revision 76)
@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[zoomslider]
+ *  Zoom Slider
+ *  -----------
+ *  Use a slider to control map scale.
+ */
+
+var panel, slider;
+
+Ext.onReady(function() {
+    
+    // create a map panel with an embedded slider
+    panel = new GeoExt.MapPanel({
+        title: "Map",
+        renderTo: "map-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        )],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_zoomslider",
+            vertical: true,
+            height: 100,
+            x: 10,
+            y: 20,
+            plugins: new GeoExt.ZoomSliderTip()
+        }]
+    });
+    
+    // create a separate slider bound to the map but displayed elsewhere
+    slider = new GeoExt.ZoomSlider({
+        map: panel.map,
+        aggressive: true,                                                                                                                                                   
+        width: 200,
+        plugins: new GeoExt.ZoomSliderTip({
+            template: "<div>Zoom Level: {zoom}</div>"
+        }),
+        renderTo: document.body
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.html	(revision 76)
@@ -0,0 +1,22 @@
+<html>
+    <head>
+        <title>GeoExt MapPanel in an Ext Window</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="mappanel-window.js"></script>
+
+    </head>
+    <body>
+        <h1>GeoExt.MapPanel in an Ext.Window</h1>
+        <p>This example shows the how to place a MapPanel in another Ext container
+        without creating a map first.  See <a href="mappanel-div.html">mappanel-div.html</a>
+        for an example that creates the map before creating the map panel.<p>
+        <p>The js is not minified so it is readable. See <a href="mappanel-window.js">mappanel-window.js</a>.</p>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.html	(revision 76)
@@ -0,0 +1,43 @@
+<html>
+    <head>
+        <title>GeoExt Toolbar Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="toolbar.js"></script>
+
+        <style type="text/css">
+            /* work around an Ext bug that makes the rendering
+               of menu items not as one would expect */
+            .ext-ie .x-menu-item-icon {
+                left: -24px;
+            }
+            .ext-strict .x-menu-item-icon {
+                left: 3px;
+            }
+            .ext-ie6 .x-menu-item-icon {
+                left: -24px;
+            }
+            .ext-ie7 .x-menu-item-icon {
+                left: -24px;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>OpenLayers controls in an Ext toolbar</h1>
+
+        <p>This example shows how to add OpenLayers controls in an Ext toolbar.
+        GeoExt provides the GeoExt.Action class for adapating a control to an
+        object that can be inserted in a toolbar or in a menu.</p>
+
+        <p>The js is not minified so it is readable. See <a
+        href="toolbar.js">toolbar.js</a>.</p>
+
+        <div id="mappanel"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree-legend.js	(revision 76)
@@ -0,0 +1,117 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+ /** api: example[tree-legend]
+  *  Tree Legend
+  *  -----------
+  *  Render layer nodes with legends.
+  */
+
+// custom layer node UI class
+var LayerNodeUI = Ext.extend(
+    GeoExt.tree.LayerNodeUI,
+    new GeoExt.tree.TreeNodeUIEventMixin()
+);
+
+Ext.onReady(function() {
+    var mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        center: [146.1569825, -41.6109735],
+        zoom: 6,
+        layers: [
+            new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_state_boundaries"
+                }, {
+                    buffer: 0,
+                    // exclude this layer from layer container nodes
+                    displayInLayerSwitcher: false
+               }),
+            new OpenLayers.Layer.WMS("Water",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_water_bodies",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                }),
+            new OpenLayers.Layer.WMS("Cities",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_cities",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                }),
+            new OpenLayers.Layer.WMS("Tasmania Roads",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_roads",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                })
+        ]
+    });
+
+    var tree = new Ext.tree.TreePanel({
+        region: "east",
+        title: "Layers",
+        width: 250,
+        autoScroll: true,
+        enableDD: true,
+        // apply the tree node component plugin to layer nodes
+        plugins: [{
+            ptype: "gx_treenodecomponent"
+        }],
+        loader: {
+            applyLoader: false,
+            uiProviders: {
+                "custom_ui": LayerNodeUI
+            }
+        },
+        root: {
+            nodeType: "gx_layercontainer",
+            loader: {
+                baseAttrs: {
+                    uiProvider: "custom_ui"
+                },
+                createNode: function(attr) {
+                    // add a WMS legend to each node created
+                    attr.component = {
+                        xtype: "gx_wmslegend",
+                        layerRecord: mapPanel.layers.getByLayer(attr.layer),
+                        showTitle: false,
+                        // custom class for css positioning
+                        // see tree-legend.html
+                        cls: "legend"
+                    }
+                    return GeoExt.tree.LayerLoader.prototype.createNode.call(this, attr);
+                }
+            }
+        },
+        rootVisible: false,
+        lines: false
+    });
+
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            items: [
+                mapPanel, tree, {
+                    contentEl: desc,
+                    region: "west",
+                    width: 250,
+                    bodyStyle: {padding: "5px"}
+                }
+            ]
+        }
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.html	(revision 76)
@@ -0,0 +1,27 @@
+<html>
+    <head>
+        <title>WMSCapabilitiesLoader Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="wms-tree.js"></script>
+        
+    </head>
+    <body>
+        <h1>Tree using a GeoExt.tree.WMSCapabilitiesLoader</h1>
+       <div id="desc"> 
+            <p>This example shows how to use GeoExt.tree.WMSCapabilitiesLoader to populate a tree
+            with the hierarchical structure of a WMS GetCapabilities response. The example
+            also shows how to customize the loader's <tt>createNode</tt> method to add a checkbox
+            with a <tt>checkchange</tt> listener that adds and removes layers to and from the map.
+            </p>
+            <p>See <a href="wms-tree.js">wms-tree.js</a> for the source code.</p>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.html	(revision 76)
@@ -0,0 +1,31 @@
+<html>
+    <head>
+        <title>Attribute Form</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="attribute-form.js"></script>
+
+    </head>
+    <body>
+        <h1>Attribute Form</h1>
+
+        <p>This example shows how to create a form with fields creates from
+        attributes read from a WFS DescribeFeatureType response. This can be
+        useful when doing feature editing with WFS-T.</p>
+
+        <p>Note that validation is activated based on the restriction
+        information read from the DescribeFeatureType document. For example the
+        "STATE_NAME", "STATE_FIPS", "SUB_REGION", and "STATE_ABBR" text fields
+        indicate errors if more than 5 characters are entered.</p>
+
+        <p>Note that the js is not minified so it is readable.
+        See <a href="attribute-form.js">attribute-form.js</a>.</p>
+
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/vector-legend.js	(revision 76)
@@ -0,0 +1,113 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[vector-legend]
+ *  Vector Legend
+ *  -------------------------
+ *  Render a legend for a vector layer.
+ */
+
+var mapPanel, legendPanel;
+
+Ext.onReady(function() {
+
+    var rules = [
+        new OpenLayers.Rule({
+            title: "> 2000m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.GREATER_THAN,
+                property: "elevation",
+                value: 2000
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 8,
+                fillColor: "#99ccff",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "1500 - 2000m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.BETWEEN,
+                property: "elevation",
+                upperBoundary: 2000,
+                lowerBoundary: 1500
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 6,
+                fillColor: "#6699cc",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "< 1500m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.LESS_THAN,
+                property: "elevation",
+                value: 1500
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 4,
+                fillColor: "#0033cc",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "All",
+            minScaleDenominator: 3000000,
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 5,
+                fillColor: "#99ccff",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        })
+    ];
+
+    var imagery = new OpenLayers.Layer.WMS(
+        "Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"},
+        {displayInLayerSwitcher: false}
+    );
+
+    var summits = new OpenLayers.Layer.Vector("Summits", {
+        strategies: [new OpenLayers.Strategy.Fixed()],
+        protocol: new OpenLayers.Protocol.HTTP({
+            url: "data/summits.json",
+            format: new OpenLayers.Format.GeoJSON()
+        }),
+        styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({}, {rules: rules}))
+    });
+    
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        border: false,
+        layers: [imagery, summits],
+        center: [6.3, 45.6],
+        height: 256, // IE6 wants this
+        zoom: 8
+    });
+    
+    legendPanel = new GeoExt.LegendPanel({
+        layerStore: mapPanel.layers,
+        renderTo: "legend",
+        border: false
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.html	(revision 76)
@@ -0,0 +1,33 @@
+<html>
+    <head>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="search-form.js"></script>
+    </head>
+    <body>
+        <h1>Example of a search form using GeoExt.form.FormPanel</h1>
+
+        <p>This example shows how to create a search form based on
+        GeoExt.form.FormPanel.</p>
+        
+        <p>A GeoExt.form.FormPanel instance uses an OpenLayers.Protocol object
+        for sending search requests. In this example a fake protocol is used,
+        in a real-life scenario a specific protocol like
+        OpenLayers.Protocol.WFS would be used.</p>
+
+        <p>If you click on the "search" button below the form, the filter
+        resulting from the form values is represented to the right of the
+        form.</p>
+
+        <p>The js is not minified so it is readable. See <a
+        href="search-form.js">search-form.js</a></p>
+
+        <div id="formpanel" style="float:left;"></div>
+        <div id="filter"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/summits.json
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/summits.json	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/summits.json	(revision 76)
@@ -0,0 +1,1 @@
+{"type": "FeatureCollection", "features": [{"geometry": {"type": "Point", "coordinates": [6.18218, 45.5949]}, "type": "Feature", "properties": {"elevation": 1770, "name": "Col d'Arclusaz"}, "id": 472}, {"geometry": {"type": "Point", "coordinates": [6.27827, 45.6769]}, "type": "Feature", "properties": {"elevation": 1831, "name": "Pointe de C\u00f4te Favre"}, "id": 458}, {"geometry": {"type": "Point", "coordinates": [6.47122, 46.0062]}, "type": "Feature", "properties": {"elevation": 2364, "name": "Pointe du Midi"}, "id": 487}, {"geometry": {"type": "Point", "coordinates": [6.82156068193, 46.3129835428]}, "type": "Feature", "properties": {"elevation": 1856, "name": "Col d'Outanne"}, "id": 5700}, {"geometry": {"type": "Point", "coordinates": [6.84989241629, 46.136626095]}, "type": "Feature", "properties": {"elevation": 2375, "name": "Col de Comba Mornay"}, "id": 5644}, {"geometry": {"type": "Point", "coordinates": [6.62, 46.187778]}, "type": "Feature", "properties": {"elevation": 2000, "name": "La Pointe"}, "id": 5710}, {"geometry": {"type": "Point", "coordinates": [5.9134, 44.93331]}, "type": "Feature", "properties": {"elevation": 2607, "name": "Le Coiro"}, "id": 496}, {"geometry": {"type": "Point", "coordinates": [6.03219, 45.7204]}, "type": "Feature", "properties": {"elevation": 1451, "name": "D\u00f4me de la Cochette"}, "id": 322}, {"geometry": {"type": "Point", "coordinates": [6.23048, 45.6324]}, "type": "Feature", "properties": {"elevation": 2197, "name": "Mont P\u00e9cloz"}, "id": 515}, {"geometry": {"type": "Point", "coordinates": [6.1962, 45.6927]}, "type": "Feature", "properties": {"elevation": 2181, "name": "Tr\u00e9lod"}, "id": 601}]}
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/wmscap.xml
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/wmscap.xml	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/wmscap.xml	(revision 76)
@@ -0,0 +1,4922 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE WMT_MS_Capabilities SYSTEM "http://demo.opengeo.org/geoserver/schemas/wms/1.1.1/WMS_MS_Capabilities.dtd">
+<WMT_MS_Capabilities version="1.1.1" updateSequence="146">
+  <Service>
+    <Name>OGC:WMS</Name>
+    <Title>GeoServer Web Map Service</Title>
+    <Abstract>A compliant implementation of WMS 1.1.1 plus most of the SLD 1.0 extension (dynamic styling). Can also generate PDF, SVG, KML, GeoRSS</Abstract>
+    <KeywordList>
+      <Keyword>WFS</Keyword>
+      <Keyword>WMS</Keyword>
+      <Keyword>GEOSERVER</Keyword>
+    </KeywordList>
+    <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms"/>
+    <ContactInformation>
+      <ContactPersonPrimary>
+        <ContactPerson>Claudius Ptolomaeus</ContactPerson>
+        <ContactOrganization>The ancient geographes INC</ContactOrganization>
+      </ContactPersonPrimary>
+      <ContactPosition>Chief geographer</ContactPosition>
+      <ContactAddress>
+        <AddressType>Work</AddressType>
+        <Address/>
+        <City>Alexandria</City>
+        <StateOrProvince/>
+        <PostCode/>
+        <Country>Egypt</Country>
+      </ContactAddress>
+      <ContactVoiceTelephone/>
+      <ContactFacsimileTelephone/>
+      <ContactElectronicMailAddress>claudius.ptolomaeus@gmail.com</ContactElectronicMailAddress>
+    </ContactInformation>
+    <Fees>NONE</Fees>
+    <AccessConstraints>NONE</AccessConstraints>
+  </Service>
+  <Capability>
+    <Request>
+      <GetCapabilities>
+        <Format>application/vnd.ogc.wms_xml</Format>
+        <DCPType>
+          <HTTP>
+            <Get>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Get>
+            <Post>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Post>
+          </HTTP>
+        </DCPType>
+      </GetCapabilities>
+      <GetMap>
+        <Format>image/png</Format>
+        <Format>application/atom xml</Format>
+        <Format>application/atom+xml</Format>
+        <Format>application/openlayers</Format>
+        <Format>application/pdf</Format>
+        <Format>application/rss xml</Format>
+        <Format>application/rss+xml</Format>
+        <Format>application/vnd.google-earth.kml</Format>
+        <Format>application/vnd.google-earth.kml xml</Format>
+        <Format>application/vnd.google-earth.kml+xml</Format>
+        <Format>application/vnd.google-earth.kmz</Format>
+        <Format>application/vnd.google-earth.kmz xml</Format>
+        <Format>application/vnd.google-earth.kmz+xml</Format>
+        <Format>atom</Format>
+        <Format>image/geotiff</Format>
+        <Format>image/geotiff8</Format>
+        <Format>image/gif</Format>
+        <Format>image/jpeg</Format>
+        <Format>image/png8</Format>
+        <Format>image/svg</Format>
+        <Format>image/svg xml</Format>
+        <Format>image/svg+xml</Format>
+        <Format>image/tiff</Format>
+        <Format>image/tiff8</Format>
+        <Format>kml</Format>
+        <Format>kmz</Format>
+        <Format>openlayers</Format>
+        <Format>rss</Format>
+        <DCPType>
+          <HTTP>
+            <Get>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Get>
+          </HTTP>
+        </DCPType>
+      </GetMap>
+      <GetFeatureInfo>
+        <Format>text/plain</Format>
+        <Format>text/html</Format>
+        <Format>application/vnd.ogc.gml</Format>
+        <DCPType>
+          <HTTP>
+            <Get>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Get>
+            <Post>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Post>
+          </HTTP>
+        </DCPType>
+      </GetFeatureInfo>
+      <DescribeLayer>
+        <Format>application/vnd.ogc.wms_xml</Format>
+        <DCPType>
+          <HTTP>
+            <Get>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Get>
+          </HTTP>
+        </DCPType>
+      </DescribeLayer>
+      <GetLegendGraphic>
+        <Format>image/png</Format>
+        <Format>image/jpeg</Format>
+        <Format>image/gif</Format>
+        <DCPType>
+          <HTTP>
+            <Get>
+              <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms?SERVICE=WMS&amp;"/>
+            </Get>
+          </HTTP>
+        </DCPType>
+      </GetLegendGraphic>
+    </Request>
+    <Exception>
+      <Format>application/vnd.ogc.se_xml</Format>
+    </Exception>
+    <UserDefinedSymbolization SupportSLD="1" UserLayer="1" UserStyle="1" RemoteWFS="1"/>
+    <Layer>
+      <Title>GeoServer Web Map Service</Title>
+      <Abstract>A compliant implementation of WMS 1.1.1 plus most of the SLD 1.0 extension (dynamic styling). Can also generate PDF, SVG, KML, GeoRSS</Abstract>
+      <!--All supported EPSG projections:-->
+      <SRS>EPSG:WGS84(DD)</SRS>
+      <SRS>EPSG:2000</SRS>
+      <SRS>EPSG:2001</SRS>
+      <SRS>EPSG:2002</SRS>
+      <SRS>EPSG:2003</SRS>
+      <SRS>EPSG:2004</SRS>
+      <SRS>EPSG:2005</SRS>
+      <SRS>EPSG:2006</SRS>
+      <SRS>EPSG:2007</SRS>
+      <SRS>EPSG:2008</SRS>
+      <SRS>EPSG:2009</SRS>
+      <SRS>EPSG:2010</SRS>
+      <SRS>EPSG:2011</SRS>
+      <SRS>EPSG:2012</SRS>
+      <SRS>EPSG:2013</SRS>
+      <SRS>EPSG:2014</SRS>
+      <SRS>EPSG:2015</SRS>
+      <SRS>EPSG:2016</SRS>
+      <SRS>EPSG:2017</SRS>
+      <SRS>EPSG:2018</SRS>
+      <SRS>EPSG:2019</SRS>
+      <SRS>EPSG:2020</SRS>
+      <SRS>EPSG:2021</SRS>
+      <SRS>EPSG:2022</SRS>
+      <SRS>EPSG:2023</SRS>
+      <SRS>EPSG:2024</SRS>
+      <SRS>EPSG:2025</SRS>
+      <SRS>EPSG:2026</SRS>
+      <SRS>EPSG:2027</SRS>
+      <SRS>EPSG:2028</SRS>
+      <SRS>EPSG:2029</SRS>
+      <SRS>EPSG:2030</SRS>
+      <SRS>EPSG:2031</SRS>
+      <SRS>EPSG:2032</SRS>
+      <SRS>EPSG:2033</SRS>
+      <SRS>EPSG:2034</SRS>
+      <SRS>EPSG:2035</SRS>
+      <SRS>EPSG:2036</SRS>
+      <SRS>EPSG:2037</SRS>
+      <SRS>EPSG:2038</SRS>
+      <SRS>EPSG:2039</SRS>
+      <SRS>EPSG:2040</SRS>
+      <SRS>EPSG:2041</SRS>
+      <SRS>EPSG:2042</SRS>
+      <SRS>EPSG:2043</SRS>
+      <SRS>EPSG:2044</SRS>
+      <SRS>EPSG:2045</SRS>
+      <SRS>EPSG:2046</SRS>
+      <SRS>EPSG:2047</SRS>
+      <SRS>EPSG:2048</SRS>
+      <SRS>EPSG:2049</SRS>
+      <SRS>EPSG:2050</SRS>
+      <SRS>EPSG:2051</SRS>
+      <SRS>EPSG:2052</SRS>
+      <SRS>EPSG:2053</SRS>
+      <SRS>EPSG:2054</SRS>
+      <SRS>EPSG:2055</SRS>
+      <SRS>EPSG:2056</SRS>
+      <SRS>EPSG:2057</SRS>
+      <SRS>EPSG:2058</SRS>
+      <SRS>EPSG:2059</SRS>
+      <SRS>EPSG:2060</SRS>
+      <SRS>EPSG:2061</SRS>
+      <SRS>EPSG:2062</SRS>
+      <SRS>EPSG:2063</SRS>
+      <SRS>EPSG:2064</SRS>
+      <SRS>EPSG:2065</SRS>
+      <SRS>EPSG:2066</SRS>
+      <SRS>EPSG:2067</SRS>
+      <SRS>EPSG:2068</SRS>
+      <SRS>EPSG:2069</SRS>
+      <SRS>EPSG:2070</SRS>
+      <SRS>EPSG:2071</SRS>
+      <SRS>EPSG:2072</SRS>
+      <SRS>EPSG:2073</SRS>
+      <SRS>EPSG:2074</SRS>
+      <SRS>EPSG:2075</SRS>
+      <SRS>EPSG:2076</SRS>
+      <SRS>EPSG:2077</SRS>
+      <SRS>EPSG:2078</SRS>
+      <SRS>EPSG:2079</SRS>
+      <SRS>EPSG:2080</SRS>
+      <SRS>EPSG:2081</SRS>
+      <SRS>EPSG:2082</SRS>
+      <SRS>EPSG:2083</SRS>
+      <SRS>EPSG:2084</SRS>
+      <SRS>EPSG:2085</SRS>
+      <SRS>EPSG:2086</SRS>
+      <SRS>EPSG:2087</SRS>
+      <SRS>EPSG:2088</SRS>
+      <SRS>EPSG:2089</SRS>
+      <SRS>EPSG:2090</SRS>
+      <SRS>EPSG:2091</SRS>
+      <SRS>EPSG:2092</SRS>
+      <SRS>EPSG:2093</SRS>
+      <SRS>EPSG:2094</SRS>
+      <SRS>EPSG:2095</SRS>
+      <SRS>EPSG:2096</SRS>
+      <SRS>EPSG:2097</SRS>
+      <SRS>EPSG:2098</SRS>
+      <SRS>EPSG:2099</SRS>
+      <SRS>EPSG:2100</SRS>
+      <SRS>EPSG:2101</SRS>
+      <SRS>EPSG:2102</SRS>
+      <SRS>EPSG:2103</SRS>
+      <SRS>EPSG:2104</SRS>
+      <SRS>EPSG:2105</SRS>
+      <SRS>EPSG:2106</SRS>
+      <SRS>EPSG:2107</SRS>
+      <SRS>EPSG:2108</SRS>
+      <SRS>EPSG:2109</SRS>
+      <SRS>EPSG:2110</SRS>
+      <SRS>EPSG:2111</SRS>
+      <SRS>EPSG:2112</SRS>
+      <SRS>EPSG:2113</SRS>
+      <SRS>EPSG:2114</SRS>
+      <SRS>EPSG:2115</SRS>
+      <SRS>EPSG:2116</SRS>
+      <SRS>EPSG:2117</SRS>
+      <SRS>EPSG:2118</SRS>
+      <SRS>EPSG:2119</SRS>
+      <SRS>EPSG:2120</SRS>
+      <SRS>EPSG:2121</SRS>
+      <SRS>EPSG:2122</SRS>
+      <SRS>EPSG:2123</SRS>
+      <SRS>EPSG:2124</SRS>
+      <SRS>EPSG:2125</SRS>
+      <SRS>EPSG:2126</SRS>
+      <SRS>EPSG:2127</SRS>
+      <SRS>EPSG:2128</SRS>
+      <SRS>EPSG:2129</SRS>
+      <SRS>EPSG:2130</SRS>
+      <SRS>EPSG:2131</SRS>
+      <SRS>EPSG:2132</SRS>
+      <SRS>EPSG:2133</SRS>
+      <SRS>EPSG:2134</SRS>
+      <SRS>EPSG:2135</SRS>
+      <SRS>EPSG:2136</SRS>
+      <SRS>EPSG:2137</SRS>
+      <SRS>EPSG:2138</SRS>
+      <SRS>EPSG:2139</SRS>
+      <SRS>EPSG:2140</SRS>
+      <SRS>EPSG:2141</SRS>
+      <SRS>EPSG:2142</SRS>
+      <SRS>EPSG:2143</SRS>
+      <SRS>EPSG:2144</SRS>
+      <SRS>EPSG:2145</SRS>
+      <SRS>EPSG:2146</SRS>
+      <SRS>EPSG:2147</SRS>
+      <SRS>EPSG:2148</SRS>
+      <SRS>EPSG:2149</SRS>
+      <SRS>EPSG:2150</SRS>
+      <SRS>EPSG:2151</SRS>
+      <SRS>EPSG:2152</SRS>
+      <SRS>EPSG:2153</SRS>
+      <SRS>EPSG:2154</SRS>
+      <SRS>EPSG:2155</SRS>
+      <SRS>EPSG:2156</SRS>
+      <SRS>EPSG:2157</SRS>
+      <SRS>EPSG:2158</SRS>
+      <SRS>EPSG:2159</SRS>
+      <SRS>EPSG:2160</SRS>
+      <SRS>EPSG:2161</SRS>
+      <SRS>EPSG:2162</SRS>
+      <SRS>EPSG:2163</SRS>
+      <SRS>EPSG:2164</SRS>
+      <SRS>EPSG:2165</SRS>
+      <SRS>EPSG:2166</SRS>
+      <SRS>EPSG:2167</SRS>
+      <SRS>EPSG:2168</SRS>
+      <SRS>EPSG:2169</SRS>
+      <SRS>EPSG:2170</SRS>
+      <SRS>EPSG:2171</SRS>
+      <SRS>EPSG:2172</SRS>
+      <SRS>EPSG:2173</SRS>
+      <SRS>EPSG:2174</SRS>
+      <SRS>EPSG:2175</SRS>
+      <SRS>EPSG:2176</SRS>
+      <SRS>EPSG:2177</SRS>
+      <SRS>EPSG:2178</SRS>
+      <SRS>EPSG:2179</SRS>
+      <SRS>EPSG:2180</SRS>
+      <SRS>EPSG:2188</SRS>
+      <SRS>EPSG:2189</SRS>
+      <SRS>EPSG:2190</SRS>
+      <SRS>EPSG:2191</SRS>
+      <SRS>EPSG:2192</SRS>
+      <SRS>EPSG:2193</SRS>
+      <SRS>EPSG:2194</SRS>
+      <SRS>EPSG:2195</SRS>
+      <SRS>EPSG:2196</SRS>
+      <SRS>EPSG:2197</SRS>
+      <SRS>EPSG:2198</SRS>
+      <SRS>EPSG:2199</SRS>
+      <SRS>EPSG:2200</SRS>
+      <SRS>EPSG:2201</SRS>
+      <SRS>EPSG:2202</SRS>
+      <SRS>EPSG:2203</SRS>
+      <SRS>EPSG:2204</SRS>
+      <SRS>EPSG:2205</SRS>
+      <SRS>EPSG:2206</SRS>
+      <SRS>EPSG:2207</SRS>
+      <SRS>EPSG:2208</SRS>
+      <SRS>EPSG:2209</SRS>
+      <SRS>EPSG:2210</SRS>
+      <SRS>EPSG:2211</SRS>
+      <SRS>EPSG:2212</SRS>
+      <SRS>EPSG:2213</SRS>
+      <SRS>EPSG:2214</SRS>
+      <SRS>EPSG:2215</SRS>
+      <SRS>EPSG:2216</SRS>
+      <SRS>EPSG:2217</SRS>
+      <SRS>EPSG:2218</SRS>
+      <SRS>EPSG:2219</SRS>
+      <SRS>EPSG:2220</SRS>
+      <SRS>EPSG:2221</SRS>
+      <SRS>EPSG:2222</SRS>
+      <SRS>EPSG:2223</SRS>
+      <SRS>EPSG:2224</SRS>
+      <SRS>EPSG:2225</SRS>
+      <SRS>EPSG:2226</SRS>
+      <SRS>EPSG:2227</SRS>
+      <SRS>EPSG:2228</SRS>
+      <SRS>EPSG:2229</SRS>
+      <SRS>EPSG:2230</SRS>
+      <SRS>EPSG:2231</SRS>
+      <SRS>EPSG:2232</SRS>
+      <SRS>EPSG:2233</SRS>
+      <SRS>EPSG:2234</SRS>
+      <SRS>EPSG:2235</SRS>
+      <SRS>EPSG:2236</SRS>
+      <SRS>EPSG:2237</SRS>
+      <SRS>EPSG:2238</SRS>
+      <SRS>EPSG:2239</SRS>
+      <SRS>EPSG:2240</SRS>
+      <SRS>EPSG:2241</SRS>
+      <SRS>EPSG:2242</SRS>
+      <SRS>EPSG:2243</SRS>
+      <SRS>EPSG:2244</SRS>
+      <SRS>EPSG:2245</SRS>
+      <SRS>EPSG:2246</SRS>
+      <SRS>EPSG:2247</SRS>
+      <SRS>EPSG:2248</SRS>
+      <SRS>EPSG:2249</SRS>
+      <SRS>EPSG:2250</SRS>
+      <SRS>EPSG:2251</SRS>
+      <SRS>EPSG:2252</SRS>
+      <SRS>EPSG:2253</SRS>
+      <SRS>EPSG:2254</SRS>
+      <SRS>EPSG:2255</SRS>
+      <SRS>EPSG:2256</SRS>
+      <SRS>EPSG:2257</SRS>
+      <SRS>EPSG:2258</SRS>
+      <SRS>EPSG:2259</SRS>
+      <SRS>EPSG:2260</SRS>
+      <SRS>EPSG:2261</SRS>
+      <SRS>EPSG:2262</SRS>
+      <SRS>EPSG:2263</SRS>
+      <SRS>EPSG:2264</SRS>
+      <SRS>EPSG:2265</SRS>
+      <SRS>EPSG:2266</SRS>
+      <SRS>EPSG:2267</SRS>
+      <SRS>EPSG:2268</SRS>
+      <SRS>EPSG:2269</SRS>
+      <SRS>EPSG:2270</SRS>
+      <SRS>EPSG:2271</SRS>
+      <SRS>EPSG:2272</SRS>
+      <SRS>EPSG:2273</SRS>
+      <SRS>EPSG:2274</SRS>
+      <SRS>EPSG:2275</SRS>
+      <SRS>EPSG:2276</SRS>
+      <SRS>EPSG:2277</SRS>
+      <SRS>EPSG:2278</SRS>
+      <SRS>EPSG:2279</SRS>
+      <SRS>EPSG:2280</SRS>
+      <SRS>EPSG:2281</SRS>
+      <SRS>EPSG:2282</SRS>
+      <SRS>EPSG:2283</SRS>
+      <SRS>EPSG:2284</SRS>
+      <SRS>EPSG:2285</SRS>
+      <SRS>EPSG:2286</SRS>
+      <SRS>EPSG:2287</SRS>
+      <SRS>EPSG:2288</SRS>
+      <SRS>EPSG:2289</SRS>
+      <SRS>EPSG:2290</SRS>
+      <SRS>EPSG:2291</SRS>
+      <SRS>EPSG:2292</SRS>
+      <SRS>EPSG:2294</SRS>
+      <SRS>EPSG:2295</SRS>
+      <SRS>EPSG:2296</SRS>
+      <SRS>EPSG:2297</SRS>
+      <SRS>EPSG:2298</SRS>
+      <SRS>EPSG:2299</SRS>
+      <SRS>EPSG:2300</SRS>
+      <SRS>EPSG:2301</SRS>
+      <SRS>EPSG:2302</SRS>
+      <SRS>EPSG:2303</SRS>
+      <SRS>EPSG:2304</SRS>
+      <SRS>EPSG:2305</SRS>
+      <SRS>EPSG:2306</SRS>
+      <SRS>EPSG:2307</SRS>
+      <SRS>EPSG:2308</SRS>
+      <SRS>EPSG:2309</SRS>
+      <SRS>EPSG:2310</SRS>
+      <SRS>EPSG:2311</SRS>
+      <SRS>EPSG:2312</SRS>
+      <SRS>EPSG:2313</SRS>
+      <SRS>EPSG:2314</SRS>
+      <SRS>EPSG:2315</SRS>
+      <SRS>EPSG:2316</SRS>
+      <SRS>EPSG:2317</SRS>
+      <SRS>EPSG:2318</SRS>
+      <SRS>EPSG:2319</SRS>
+      <SRS>EPSG:2320</SRS>
+      <SRS>EPSG:2321</SRS>
+      <SRS>EPSG:2322</SRS>
+      <SRS>EPSG:2323</SRS>
+      <SRS>EPSG:2324</SRS>
+      <SRS>EPSG:2325</SRS>
+      <SRS>EPSG:2326</SRS>
+      <SRS>EPSG:2327</SRS>
+      <SRS>EPSG:2328</SRS>
+      <SRS>EPSG:2329</SRS>
+      <SRS>EPSG:2330</SRS>
+      <SRS>EPSG:2331</SRS>
+      <SRS>EPSG:2332</SRS>
+      <SRS>EPSG:2333</SRS>
+      <SRS>EPSG:2334</SRS>
+      <SRS>EPSG:2335</SRS>
+      <SRS>EPSG:2336</SRS>
+      <SRS>EPSG:2337</SRS>
+      <SRS>EPSG:2338</SRS>
+      <SRS>EPSG:2339</SRS>
+      <SRS>EPSG:2340</SRS>
+      <SRS>EPSG:2341</SRS>
+      <SRS>EPSG:2342</SRS>
+      <SRS>EPSG:2343</SRS>
+      <SRS>EPSG:2344</SRS>
+      <SRS>EPSG:2345</SRS>
+      <SRS>EPSG:2346</SRS>
+      <SRS>EPSG:2347</SRS>
+      <SRS>EPSG:2348</SRS>
+      <SRS>EPSG:2349</SRS>
+      <SRS>EPSG:2350</SRS>
+      <SRS>EPSG:2351</SRS>
+      <SRS>EPSG:2352</SRS>
+      <SRS>EPSG:2353</SRS>
+      <SRS>EPSG:2354</SRS>
+      <SRS>EPSG:2355</SRS>
+      <SRS>EPSG:2356</SRS>
+      <SRS>EPSG:2357</SRS>
+      <SRS>EPSG:2358</SRS>
+      <SRS>EPSG:2359</SRS>
+      <SRS>EPSG:2360</SRS>
+      <SRS>EPSG:2361</SRS>
+      <SRS>EPSG:2362</SRS>
+      <SRS>EPSG:2363</SRS>
+      <SRS>EPSG:2364</SRS>
+      <SRS>EPSG:2365</SRS>
+      <SRS>EPSG:2366</SRS>
+      <SRS>EPSG:2367</SRS>
+      <SRS>EPSG:2368</SRS>
+      <SRS>EPSG:2369</SRS>
+      <SRS>EPSG:2370</SRS>
+      <SRS>EPSG:2371</SRS>
+      <SRS>EPSG:2372</SRS>
+      <SRS>EPSG:2373</SRS>
+      <SRS>EPSG:2374</SRS>
+      <SRS>EPSG:2375</SRS>
+      <SRS>EPSG:2376</SRS>
+      <SRS>EPSG:2377</SRS>
+      <SRS>EPSG:2378</SRS>
+      <SRS>EPSG:2379</SRS>
+      <SRS>EPSG:2380</SRS>
+      <SRS>EPSG:2381</SRS>
+      <SRS>EPSG:2382</SRS>
+      <SRS>EPSG:2383</SRS>
+      <SRS>EPSG:2384</SRS>
+      <SRS>EPSG:2385</SRS>
+      <SRS>EPSG:2386</SRS>
+      <SRS>EPSG:2387</SRS>
+      <SRS>EPSG:2388</SRS>
+      <SRS>EPSG:2389</SRS>
+      <SRS>EPSG:2390</SRS>
+      <SRS>EPSG:2391</SRS>
+      <SRS>EPSG:2392</SRS>
+      <SRS>EPSG:2393</SRS>
+      <SRS>EPSG:2394</SRS>
+      <SRS>EPSG:2395</SRS>
+      <SRS>EPSG:2396</SRS>
+      <SRS>EPSG:2397</SRS>
+      <SRS>EPSG:2398</SRS>
+      <SRS>EPSG:2399</SRS>
+      <SRS>EPSG:2400</SRS>
+      <SRS>EPSG:2401</SRS>
+      <SRS>EPSG:2402</SRS>
+      <SRS>EPSG:2403</SRS>
+      <SRS>EPSG:2404</SRS>
+      <SRS>EPSG:2405</SRS>
+      <SRS>EPSG:2406</SRS>
+      <SRS>EPSG:2407</SRS>
+      <SRS>EPSG:2408</SRS>
+      <SRS>EPSG:2409</SRS>
+      <SRS>EPSG:2410</SRS>
+      <SRS>EPSG:2411</SRS>
+      <SRS>EPSG:2412</SRS>
+      <SRS>EPSG:2413</SRS>
+      <SRS>EPSG:2414</SRS>
+      <SRS>EPSG:2415</SRS>
+      <SRS>EPSG:2416</SRS>
+      <SRS>EPSG:2417</SRS>
+      <SRS>EPSG:2418</SRS>
+      <SRS>EPSG:2419</SRS>
+      <SRS>EPSG:2420</SRS>
+      <SRS>EPSG:2421</SRS>
+      <SRS>EPSG:2422</SRS>
+      <SRS>EPSG:2423</SRS>
+      <SRS>EPSG:2424</SRS>
+      <SRS>EPSG:2425</SRS>
+      <SRS>EPSG:2426</SRS>
+      <SRS>EPSG:2427</SRS>
+      <SRS>EPSG:2428</SRS>
+      <SRS>EPSG:2429</SRS>
+      <SRS>EPSG:2430</SRS>
+      <SRS>EPSG:2431</SRS>
+      <SRS>EPSG:2432</SRS>
+      <SRS>EPSG:2433</SRS>
+      <SRS>EPSG:2434</SRS>
+      <SRS>EPSG:2435</SRS>
+      <SRS>EPSG:2436</SRS>
+      <SRS>EPSG:2437</SRS>
+      <SRS>EPSG:2438</SRS>
+      <SRS>EPSG:2439</SRS>
+      <SRS>EPSG:2440</SRS>
+      <SRS>EPSG:2441</SRS>
+      <SRS>EPSG:2442</SRS>
+      <SRS>EPSG:2443</SRS>
+      <SRS>EPSG:2444</SRS>
+      <SRS>EPSG:2445</SRS>
+      <SRS>EPSG:2446</SRS>
+      <SRS>EPSG:2447</SRS>
+      <SRS>EPSG:2448</SRS>
+      <SRS>EPSG:2449</SRS>
+      <SRS>EPSG:2450</SRS>
+      <SRS>EPSG:2451</SRS>
+      <SRS>EPSG:2452</SRS>
+      <SRS>EPSG:2453</SRS>
+      <SRS>EPSG:2454</SRS>
+      <SRS>EPSG:2455</SRS>
+      <SRS>EPSG:2456</SRS>
+      <SRS>EPSG:2457</SRS>
+      <SRS>EPSG:2458</SRS>
+      <SRS>EPSG:2459</SRS>
+      <SRS>EPSG:2460</SRS>
+      <SRS>EPSG:2461</SRS>
+      <SRS>EPSG:2462</SRS>
+      <SRS>EPSG:2463</SRS>
+      <SRS>EPSG:2464</SRS>
+      <SRS>EPSG:2465</SRS>
+      <SRS>EPSG:2466</SRS>
+      <SRS>EPSG:2467</SRS>
+      <SRS>EPSG:2468</SRS>
+      <SRS>EPSG:2469</SRS>
+      <SRS>EPSG:2470</SRS>
+      <SRS>EPSG:2471</SRS>
+      <SRS>EPSG:2472</SRS>
+      <SRS>EPSG:2473</SRS>
+      <SRS>EPSG:2474</SRS>
+      <SRS>EPSG:2475</SRS>
+      <SRS>EPSG:2476</SRS>
+      <SRS>EPSG:2477</SRS>
+      <SRS>EPSG:2478</SRS>
+      <SRS>EPSG:2479</SRS>
+      <SRS>EPSG:2480</SRS>
+      <SRS>EPSG:2481</SRS>
+      <SRS>EPSG:2482</SRS>
+      <SRS>EPSG:2483</SRS>
+      <SRS>EPSG:2484</SRS>
+      <SRS>EPSG:2485</SRS>
+      <SRS>EPSG:2486</SRS>
+      <SRS>EPSG:2487</SRS>
+      <SRS>EPSG:2488</SRS>
+      <SRS>EPSG:2489</SRS>
+      <SRS>EPSG:2490</SRS>
+      <SRS>EPSG:2491</SRS>
+      <SRS>EPSG:2492</SRS>
+      <SRS>EPSG:2493</SRS>
+      <SRS>EPSG:2494</SRS>
+      <SRS>EPSG:2495</SRS>
+      <SRS>EPSG:2496</SRS>
+      <SRS>EPSG:2497</SRS>
+      <SRS>EPSG:2498</SRS>
+      <SRS>EPSG:2499</SRS>
+      <SRS>EPSG:2500</SRS>
+      <SRS>EPSG:2501</SRS>
+      <SRS>EPSG:2502</SRS>
+      <SRS>EPSG:2503</SRS>
+      <SRS>EPSG:2504</SRS>
+      <SRS>EPSG:2505</SRS>
+      <SRS>EPSG:2506</SRS>
+      <SRS>EPSG:2507</SRS>
+      <SRS>EPSG:2508</SRS>
+      <SRS>EPSG:2509</SRS>
+      <SRS>EPSG:2510</SRS>
+      <SRS>EPSG:2511</SRS>
+      <SRS>EPSG:2512</SRS>
+      <SRS>EPSG:2513</SRS>
+      <SRS>EPSG:2514</SRS>
+      <SRS>EPSG:2515</SRS>
+      <SRS>EPSG:2516</SRS>
+      <SRS>EPSG:2517</SRS>
+      <SRS>EPSG:2518</SRS>
+      <SRS>EPSG:2519</SRS>
+      <SRS>EPSG:2520</SRS>
+      <SRS>EPSG:2521</SRS>
+      <SRS>EPSG:2522</SRS>
+      <SRS>EPSG:2523</SRS>
+      <SRS>EPSG:2524</SRS>
+      <SRS>EPSG:2525</SRS>
+      <SRS>EPSG:2526</SRS>
+      <SRS>EPSG:2527</SRS>
+      <SRS>EPSG:2528</SRS>
+      <SRS>EPSG:2529</SRS>
+      <SRS>EPSG:2530</SRS>
+      <SRS>EPSG:2531</SRS>
+      <SRS>EPSG:2532</SRS>
+      <SRS>EPSG:2533</SRS>
+      <SRS>EPSG:2534</SRS>
+      <SRS>EPSG:2535</SRS>
+      <SRS>EPSG:2536</SRS>
+      <SRS>EPSG:2537</SRS>
+      <SRS>EPSG:2538</SRS>
+      <SRS>EPSG:2539</SRS>
+      <SRS>EPSG:2540</SRS>
+      <SRS>EPSG:2541</SRS>
+      <SRS>EPSG:2542</SRS>
+      <SRS>EPSG:2543</SRS>
+      <SRS>EPSG:2544</SRS>
+      <SRS>EPSG:2545</SRS>
+      <SRS>EPSG:2546</SRS>
+      <SRS>EPSG:2547</SRS>
+      <SRS>EPSG:2548</SRS>
+      <SRS>EPSG:2549</SRS>
+      <SRS>EPSG:2550</SRS>
+      <SRS>EPSG:2551</SRS>
+      <SRS>EPSG:2552</SRS>
+      <SRS>EPSG:2553</SRS>
+      <SRS>EPSG:2554</SRS>
+      <SRS>EPSG:2555</SRS>
+      <SRS>EPSG:2556</SRS>
+      <SRS>EPSG:2557</SRS>
+      <SRS>EPSG:2558</SRS>
+      <SRS>EPSG:2559</SRS>
+      <SRS>EPSG:2560</SRS>
+      <SRS>EPSG:2561</SRS>
+      <SRS>EPSG:2562</SRS>
+      <SRS>EPSG:2563</SRS>
+      <SRS>EPSG:2564</SRS>
+      <SRS>EPSG:2565</SRS>
+      <SRS>EPSG:2566</SRS>
+      <SRS>EPSG:2567</SRS>
+      <SRS>EPSG:2568</SRS>
+      <SRS>EPSG:2569</SRS>
+      <SRS>EPSG:2570</SRS>
+      <SRS>EPSG:2571</SRS>
+      <SRS>EPSG:2572</SRS>
+      <SRS>EPSG:2573</SRS>
+      <SRS>EPSG:2574</SRS>
+      <SRS>EPSG:2575</SRS>
+      <SRS>EPSG:2576</SRS>
+      <SRS>EPSG:2577</SRS>
+      <SRS>EPSG:2578</SRS>
+      <SRS>EPSG:2579</SRS>
+      <SRS>EPSG:2580</SRS>
+      <SRS>EPSG:2581</SRS>
+      <SRS>EPSG:2582</SRS>
+      <SRS>EPSG:2583</SRS>
+      <SRS>EPSG:2584</SRS>
+      <SRS>EPSG:2585</SRS>
+      <SRS>EPSG:2586</SRS>
+      <SRS>EPSG:2587</SRS>
+      <SRS>EPSG:2588</SRS>
+      <SRS>EPSG:2589</SRS>
+      <SRS>EPSG:2590</SRS>
+      <SRS>EPSG:2591</SRS>
+      <SRS>EPSG:2592</SRS>
+      <SRS>EPSG:2593</SRS>
+      <SRS>EPSG:2594</SRS>
+      <SRS>EPSG:2595</SRS>
+      <SRS>EPSG:2596</SRS>
+      <SRS>EPSG:2597</SRS>
+      <SRS>EPSG:2598</SRS>
+      <SRS>EPSG:2599</SRS>
+      <SRS>EPSG:2600</SRS>
+      <SRS>EPSG:2601</SRS>
+      <SRS>EPSG:2602</SRS>
+      <SRS>EPSG:2603</SRS>
+      <SRS>EPSG:2604</SRS>
+      <SRS>EPSG:2605</SRS>
+      <SRS>EPSG:2606</SRS>
+      <SRS>EPSG:2607</SRS>
+      <SRS>EPSG:2608</SRS>
+      <SRS>EPSG:2609</SRS>
+      <SRS>EPSG:2610</SRS>
+      <SRS>EPSG:2611</SRS>
+      <SRS>EPSG:2612</SRS>
+      <SRS>EPSG:2613</SRS>
+      <SRS>EPSG:2614</SRS>
+      <SRS>EPSG:2615</SRS>
+      <SRS>EPSG:2616</SRS>
+      <SRS>EPSG:2617</SRS>
+      <SRS>EPSG:2618</SRS>
+      <SRS>EPSG:2619</SRS>
+      <SRS>EPSG:2620</SRS>
+      <SRS>EPSG:2621</SRS>
+      <SRS>EPSG:2622</SRS>
+      <SRS>EPSG:2623</SRS>
+      <SRS>EPSG:2624</SRS>
+      <SRS>EPSG:2625</SRS>
+      <SRS>EPSG:2626</SRS>
+      <SRS>EPSG:2627</SRS>
+      <SRS>EPSG:2628</SRS>
+      <SRS>EPSG:2629</SRS>
+      <SRS>EPSG:2630</SRS>
+      <SRS>EPSG:2631</SRS>
+      <SRS>EPSG:2632</SRS>
+      <SRS>EPSG:2633</SRS>
+      <SRS>EPSG:2634</SRS>
+      <SRS>EPSG:2635</SRS>
+      <SRS>EPSG:2636</SRS>
+      <SRS>EPSG:2637</SRS>
+      <SRS>EPSG:2638</SRS>
+      <SRS>EPSG:2639</SRS>
+      <SRS>EPSG:2640</SRS>
+      <SRS>EPSG:2641</SRS>
+      <SRS>EPSG:2642</SRS>
+      <SRS>EPSG:2643</SRS>
+      <SRS>EPSG:2644</SRS>
+      <SRS>EPSG:2645</SRS>
+      <SRS>EPSG:2646</SRS>
+      <SRS>EPSG:2647</SRS>
+      <SRS>EPSG:2648</SRS>
+      <SRS>EPSG:2649</SRS>
+      <SRS>EPSG:2650</SRS>
+      <SRS>EPSG:2651</SRS>
+      <SRS>EPSG:2652</SRS>
+      <SRS>EPSG:2653</SRS>
+      <SRS>EPSG:2654</SRS>
+      <SRS>EPSG:2655</SRS>
+      <SRS>EPSG:2656</SRS>
+      <SRS>EPSG:2657</SRS>
+      <SRS>EPSG:2658</SRS>
+      <SRS>EPSG:2659</SRS>
+      <SRS>EPSG:2660</SRS>
+      <SRS>EPSG:2661</SRS>
+      <SRS>EPSG:2662</SRS>
+      <SRS>EPSG:2663</SRS>
+      <SRS>EPSG:2664</SRS>
+      <SRS>EPSG:2665</SRS>
+      <SRS>EPSG:2666</SRS>
+      <SRS>EPSG:2667</SRS>
+      <SRS>EPSG:2668</SRS>
+      <SRS>EPSG:2669</SRS>
+      <SRS>EPSG:2670</SRS>
+      <SRS>EPSG:2671</SRS>
+      <SRS>EPSG:2672</SRS>
+      <SRS>EPSG:2673</SRS>
+      <SRS>EPSG:2674</SRS>
+      <SRS>EPSG:2675</SRS>
+      <SRS>EPSG:2676</SRS>
+      <SRS>EPSG:2677</SRS>
+      <SRS>EPSG:2678</SRS>
+      <SRS>EPSG:2679</SRS>
+      <SRS>EPSG:2680</SRS>
+      <SRS>EPSG:2681</SRS>
+      <SRS>EPSG:2682</SRS>
+      <SRS>EPSG:2683</SRS>
+      <SRS>EPSG:2684</SRS>
+      <SRS>EPSG:2685</SRS>
+      <SRS>EPSG:2686</SRS>
+      <SRS>EPSG:2687</SRS>
+      <SRS>EPSG:2688</SRS>
+      <SRS>EPSG:2689</SRS>
+      <SRS>EPSG:2690</SRS>
+      <SRS>EPSG:2691</SRS>
+      <SRS>EPSG:2692</SRS>
+      <SRS>EPSG:2693</SRS>
+      <SRS>EPSG:2694</SRS>
+      <SRS>EPSG:2695</SRS>
+      <SRS>EPSG:2696</SRS>
+      <SRS>EPSG:2697</SRS>
+      <SRS>EPSG:2698</SRS>
+      <SRS>EPSG:2699</SRS>
+      <SRS>EPSG:2700</SRS>
+      <SRS>EPSG:2701</SRS>
+      <SRS>EPSG:2702</SRS>
+      <SRS>EPSG:2703</SRS>
+      <SRS>EPSG:2704</SRS>
+      <SRS>EPSG:2705</SRS>
+      <SRS>EPSG:2706</SRS>
+      <SRS>EPSG:2707</SRS>
+      <SRS>EPSG:2708</SRS>
+      <SRS>EPSG:2709</SRS>
+      <SRS>EPSG:2710</SRS>
+      <SRS>EPSG:2711</SRS>
+      <SRS>EPSG:2712</SRS>
+      <SRS>EPSG:2713</SRS>
+      <SRS>EPSG:2714</SRS>
+      <SRS>EPSG:2715</SRS>
+      <SRS>EPSG:2716</SRS>
+      <SRS>EPSG:2717</SRS>
+      <SRS>EPSG:2718</SRS>
+      <SRS>EPSG:2719</SRS>
+      <SRS>EPSG:2720</SRS>
+      <SRS>EPSG:2721</SRS>
+      <SRS>EPSG:2722</SRS>
+      <SRS>EPSG:2723</SRS>
+      <SRS>EPSG:2724</SRS>
+      <SRS>EPSG:2725</SRS>
+      <SRS>EPSG:2726</SRS>
+      <SRS>EPSG:2727</SRS>
+      <SRS>EPSG:2728</SRS>
+      <SRS>EPSG:2729</SRS>
+      <SRS>EPSG:2730</SRS>
+      <SRS>EPSG:2731</SRS>
+      <SRS>EPSG:2732</SRS>
+      <SRS>EPSG:2733</SRS>
+      <SRS>EPSG:2734</SRS>
+      <SRS>EPSG:2735</SRS>
+      <SRS>EPSG:2736</SRS>
+      <SRS>EPSG:2737</SRS>
+      <SRS>EPSG:2738</SRS>
+      <SRS>EPSG:2739</SRS>
+      <SRS>EPSG:2740</SRS>
+      <SRS>EPSG:2741</SRS>
+      <SRS>EPSG:2742</SRS>
+      <SRS>EPSG:2743</SRS>
+      <SRS>EPSG:2744</SRS>
+      <SRS>EPSG:2745</SRS>
+      <SRS>EPSG:2746</SRS>
+      <SRS>EPSG:2747</SRS>
+      <SRS>EPSG:2748</SRS>
+      <SRS>EPSG:2749</SRS>
+      <SRS>EPSG:2750</SRS>
+      <SRS>EPSG:2751</SRS>
+      <SRS>EPSG:2752</SRS>
+      <SRS>EPSG:2753</SRS>
+      <SRS>EPSG:2754</SRS>
+      <SRS>EPSG:2755</SRS>
+      <SRS>EPSG:2756</SRS>
+      <SRS>EPSG:2757</SRS>
+      <SRS>EPSG:2758</SRS>
+      <SRS>EPSG:2759</SRS>
+      <SRS>EPSG:2760</SRS>
+      <SRS>EPSG:2761</SRS>
+      <SRS>EPSG:2762</SRS>
+      <SRS>EPSG:2763</SRS>
+      <SRS>EPSG:2764</SRS>
+      <SRS>EPSG:2765</SRS>
+      <SRS>EPSG:2766</SRS>
+      <SRS>EPSG:2767</SRS>
+      <SRS>EPSG:2768</SRS>
+      <SRS>EPSG:2769</SRS>
+      <SRS>EPSG:2770</SRS>
+      <SRS>EPSG:2771</SRS>
+      <SRS>EPSG:2772</SRS>
+      <SRS>EPSG:2773</SRS>
+      <SRS>EPSG:2774</SRS>
+      <SRS>EPSG:2775</SRS>
+      <SRS>EPSG:2776</SRS>
+      <SRS>EPSG:2777</SRS>
+      <SRS>EPSG:2778</SRS>
+      <SRS>EPSG:2779</SRS>
+      <SRS>EPSG:2780</SRS>
+      <SRS>EPSG:2781</SRS>
+      <SRS>EPSG:2782</SRS>
+      <SRS>EPSG:2783</SRS>
+      <SRS>EPSG:2784</SRS>
+      <SRS>EPSG:2785</SRS>
+      <SRS>EPSG:2786</SRS>
+      <SRS>EPSG:2787</SRS>
+      <SRS>EPSG:2788</SRS>
+      <SRS>EPSG:2789</SRS>
+      <SRS>EPSG:2790</SRS>
+      <SRS>EPSG:2791</SRS>
+      <SRS>EPSG:2792</SRS>
+      <SRS>EPSG:2793</SRS>
+      <SRS>EPSG:2794</SRS>
+      <SRS>EPSG:2795</SRS>
+      <SRS>EPSG:2796</SRS>
+      <SRS>EPSG:2797</SRS>
+      <SRS>EPSG:2798</SRS>
+      <SRS>EPSG:2799</SRS>
+      <SRS>EPSG:2800</SRS>
+      <SRS>EPSG:2801</SRS>
+      <SRS>EPSG:2802</SRS>
+      <SRS>EPSG:2803</SRS>
+      <SRS>EPSG:2804</SRS>
+      <SRS>EPSG:2805</SRS>
+      <SRS>EPSG:2806</SRS>
+      <SRS>EPSG:2807</SRS>
+      <SRS>EPSG:2808</SRS>
+      <SRS>EPSG:2809</SRS>
+      <SRS>EPSG:2810</SRS>
+      <SRS>EPSG:2811</SRS>
+      <SRS>EPSG:2812</SRS>
+      <SRS>EPSG:2813</SRS>
+      <SRS>EPSG:2814</SRS>
+      <SRS>EPSG:2815</SRS>
+      <SRS>EPSG:2816</SRS>
+      <SRS>EPSG:2817</SRS>
+      <SRS>EPSG:2818</SRS>
+      <SRS>EPSG:2819</SRS>
+      <SRS>EPSG:2820</SRS>
+      <SRS>EPSG:2821</SRS>
+      <SRS>EPSG:2822</SRS>
+      <SRS>EPSG:2823</SRS>
+      <SRS>EPSG:2824</SRS>
+      <SRS>EPSG:2825</SRS>
+      <SRS>EPSG:2826</SRS>
+      <SRS>EPSG:2827</SRS>
+      <SRS>EPSG:2828</SRS>
+      <SRS>EPSG:2829</SRS>
+      <SRS>EPSG:2830</SRS>
+      <SRS>EPSG:2831</SRS>
+      <SRS>EPSG:2832</SRS>
+      <SRS>EPSG:2833</SRS>
+      <SRS>EPSG:2834</SRS>
+      <SRS>EPSG:2835</SRS>
+      <SRS>EPSG:2836</SRS>
+      <SRS>EPSG:2837</SRS>
+      <SRS>EPSG:2838</SRS>
+      <SRS>EPSG:2839</SRS>
+      <SRS>EPSG:2840</SRS>
+      <SRS>EPSG:2841</SRS>
+      <SRS>EPSG:2842</SRS>
+      <SRS>EPSG:2843</SRS>
+      <SRS>EPSG:2844</SRS>
+      <SRS>EPSG:2845</SRS>
+      <SRS>EPSG:2846</SRS>
+      <SRS>EPSG:2847</SRS>
+      <SRS>EPSG:2848</SRS>
+      <SRS>EPSG:2849</SRS>
+      <SRS>EPSG:2850</SRS>
+      <SRS>EPSG:2851</SRS>
+      <SRS>EPSG:2852</SRS>
+      <SRS>EPSG:2853</SRS>
+      <SRS>EPSG:2854</SRS>
+      <SRS>EPSG:2855</SRS>
+      <SRS>EPSG:2856</SRS>
+      <SRS>EPSG:2857</SRS>
+      <SRS>EPSG:2858</SRS>
+      <SRS>EPSG:2859</SRS>
+      <SRS>EPSG:2860</SRS>
+      <SRS>EPSG:2861</SRS>
+      <SRS>EPSG:2862</SRS>
+      <SRS>EPSG:2863</SRS>
+      <SRS>EPSG:2864</SRS>
+      <SRS>EPSG:2865</SRS>
+      <SRS>EPSG:2866</SRS>
+      <SRS>EPSG:2867</SRS>
+      <SRS>EPSG:2868</SRS>
+      <SRS>EPSG:2869</SRS>
+      <SRS>EPSG:2870</SRS>
+      <SRS>EPSG:2871</SRS>
+      <SRS>EPSG:2872</SRS>
+      <SRS>EPSG:2873</SRS>
+      <SRS>EPSG:2874</SRS>
+      <SRS>EPSG:2875</SRS>
+      <SRS>EPSG:2876</SRS>
+      <SRS>EPSG:2877</SRS>
+      <SRS>EPSG:2878</SRS>
+      <SRS>EPSG:2879</SRS>
+      <SRS>EPSG:2880</SRS>
+      <SRS>EPSG:2881</SRS>
+      <SRS>EPSG:2882</SRS>
+      <SRS>EPSG:2883</SRS>
+      <SRS>EPSG:2884</SRS>
+      <SRS>EPSG:2885</SRS>
+      <SRS>EPSG:2886</SRS>
+      <SRS>EPSG:2887</SRS>
+      <SRS>EPSG:2888</SRS>
+      <SRS>EPSG:2889</SRS>
+      <SRS>EPSG:2890</SRS>
+      <SRS>EPSG:2891</SRS>
+      <SRS>EPSG:2892</SRS>
+      <SRS>EPSG:2893</SRS>
+      <SRS>EPSG:2894</SRS>
+      <SRS>EPSG:2895</SRS>
+      <SRS>EPSG:2896</SRS>
+      <SRS>EPSG:2897</SRS>
+      <SRS>EPSG:2898</SRS>
+      <SRS>EPSG:2899</SRS>
+      <SRS>EPSG:2900</SRS>
+      <SRS>EPSG:2901</SRS>
+      <SRS>EPSG:2902</SRS>
+      <SRS>EPSG:2903</SRS>
+      <SRS>EPSG:2904</SRS>
+      <SRS>EPSG:2905</SRS>
+      <SRS>EPSG:2906</SRS>
+      <SRS>EPSG:2907</SRS>
+      <SRS>EPSG:2908</SRS>
+      <SRS>EPSG:2909</SRS>
+      <SRS>EPSG:2910</SRS>
+      <SRS>EPSG:2911</SRS>
+      <SRS>EPSG:2912</SRS>
+      <SRS>EPSG:2913</SRS>
+      <SRS>EPSG:2914</SRS>
+      <SRS>EPSG:2915</SRS>
+      <SRS>EPSG:2916</SRS>
+      <SRS>EPSG:2917</SRS>
+      <SRS>EPSG:2918</SRS>
+      <SRS>EPSG:2919</SRS>
+      <SRS>EPSG:2920</SRS>
+      <SRS>EPSG:2921</SRS>
+      <SRS>EPSG:2922</SRS>
+      <SRS>EPSG:2923</SRS>
+      <SRS>EPSG:2924</SRS>
+      <SRS>EPSG:2925</SRS>
+      <SRS>EPSG:2926</SRS>
+      <SRS>EPSG:2927</SRS>
+      <SRS>EPSG:2928</SRS>
+      <SRS>EPSG:2929</SRS>
+      <SRS>EPSG:2930</SRS>
+      <SRS>EPSG:2931</SRS>
+      <SRS>EPSG:2932</SRS>
+      <SRS>EPSG:2933</SRS>
+      <SRS>EPSG:2934</SRS>
+      <SRS>EPSG:2935</SRS>
+      <SRS>EPSG:2936</SRS>
+      <SRS>EPSG:2937</SRS>
+      <SRS>EPSG:2938</SRS>
+      <SRS>EPSG:2939</SRS>
+      <SRS>EPSG:2940</SRS>
+      <SRS>EPSG:2941</SRS>
+      <SRS>EPSG:2942</SRS>
+      <SRS>EPSG:2943</SRS>
+      <SRS>EPSG:2944</SRS>
+      <SRS>EPSG:2945</SRS>
+      <SRS>EPSG:2946</SRS>
+      <SRS>EPSG:2947</SRS>
+      <SRS>EPSG:2948</SRS>
+      <SRS>EPSG:2949</SRS>
+      <SRS>EPSG:2950</SRS>
+      <SRS>EPSG:2951</SRS>
+      <SRS>EPSG:2952</SRS>
+      <SRS>EPSG:2953</SRS>
+      <SRS>EPSG:2954</SRS>
+      <SRS>EPSG:2955</SRS>
+      <SRS>EPSG:2956</SRS>
+      <SRS>EPSG:2957</SRS>
+      <SRS>EPSG:2958</SRS>
+      <SRS>EPSG:2959</SRS>
+      <SRS>EPSG:2960</SRS>
+      <SRS>EPSG:2961</SRS>
+      <SRS>EPSG:2962</SRS>
+      <SRS>EPSG:2963</SRS>
+      <SRS>EPSG:2964</SRS>
+      <SRS>EPSG:2965</SRS>
+      <SRS>EPSG:2966</SRS>
+      <SRS>EPSG:2967</SRS>
+      <SRS>EPSG:2968</SRS>
+      <SRS>EPSG:2969</SRS>
+      <SRS>EPSG:2970</SRS>
+      <SRS>EPSG:2971</SRS>
+      <SRS>EPSG:2972</SRS>
+      <SRS>EPSG:2973</SRS>
+      <SRS>EPSG:2975</SRS>
+      <SRS>EPSG:2976</SRS>
+      <SRS>EPSG:2977</SRS>
+      <SRS>EPSG:2978</SRS>
+      <SRS>EPSG:2979</SRS>
+      <SRS>EPSG:2980</SRS>
+      <SRS>EPSG:2981</SRS>
+      <SRS>EPSG:2982</SRS>
+      <SRS>EPSG:2983</SRS>
+      <SRS>EPSG:2984</SRS>
+      <SRS>EPSG:2985</SRS>
+      <SRS>EPSG:2986</SRS>
+      <SRS>EPSG:2987</SRS>
+      <SRS>EPSG:2988</SRS>
+      <SRS>EPSG:2989</SRS>
+      <SRS>EPSG:2990</SRS>
+      <SRS>EPSG:2991</SRS>
+      <SRS>EPSG:2992</SRS>
+      <SRS>EPSG:2993</SRS>
+      <SRS>EPSG:2994</SRS>
+      <SRS>EPSG:2995</SRS>
+      <SRS>EPSG:2996</SRS>
+      <SRS>EPSG:2997</SRS>
+      <SRS>EPSG:2998</SRS>
+      <SRS>EPSG:2999</SRS>
+      <SRS>EPSG:3000</SRS>
+      <SRS>EPSG:3001</SRS>
+      <SRS>EPSG:3002</SRS>
+      <SRS>EPSG:3003</SRS>
+      <SRS>EPSG:3004</SRS>
+      <SRS>EPSG:3005</SRS>
+      <SRS>EPSG:3006</SRS>
+      <SRS>EPSG:3007</SRS>
+      <SRS>EPSG:3008</SRS>
+      <SRS>EPSG:3009</SRS>
+      <SRS>EPSG:3010</SRS>
+      <SRS>EPSG:3011</SRS>
+      <SRS>EPSG:3012</SRS>
+      <SRS>EPSG:3013</SRS>
+      <SRS>EPSG:3014</SRS>
+      <SRS>EPSG:3015</SRS>
+      <SRS>EPSG:3016</SRS>
+      <SRS>EPSG:3017</SRS>
+      <SRS>EPSG:3018</SRS>
+      <SRS>EPSG:3019</SRS>
+      <SRS>EPSG:3020</SRS>
+      <SRS>EPSG:3021</SRS>
+      <SRS>EPSG:3022</SRS>
+      <SRS>EPSG:3023</SRS>
+      <SRS>EPSG:3024</SRS>
+      <SRS>EPSG:3025</SRS>
+      <SRS>EPSG:3026</SRS>
+      <SRS>EPSG:3027</SRS>
+      <SRS>EPSG:3028</SRS>
+      <SRS>EPSG:3029</SRS>
+      <SRS>EPSG:3030</SRS>
+      <SRS>EPSG:3031</SRS>
+      <SRS>EPSG:3032</SRS>
+      <SRS>EPSG:3033</SRS>
+      <SRS>EPSG:3034</SRS>
+      <SRS>EPSG:3035</SRS>
+      <SRS>EPSG:3036</SRS>
+      <SRS>EPSG:3037</SRS>
+      <SRS>EPSG:3038</SRS>
+      <SRS>EPSG:3039</SRS>
+      <SRS>EPSG:3040</SRS>
+      <SRS>EPSG:3041</SRS>
+      <SRS>EPSG:3042</SRS>
+      <SRS>EPSG:3043</SRS>
+      <SRS>EPSG:3044</SRS>
+      <SRS>EPSG:3045</SRS>
+      <SRS>EPSG:3046</SRS>
+      <SRS>EPSG:3047</SRS>
+      <SRS>EPSG:3048</SRS>
+      <SRS>EPSG:3049</SRS>
+      <SRS>EPSG:3050</SRS>
+      <SRS>EPSG:3051</SRS>
+      <SRS>EPSG:3052</SRS>
+      <SRS>EPSG:3053</SRS>
+      <SRS>EPSG:3054</SRS>
+      <SRS>EPSG:3055</SRS>
+      <SRS>EPSG:3056</SRS>
+      <SRS>EPSG:3057</SRS>
+      <SRS>EPSG:3058</SRS>
+      <SRS>EPSG:3059</SRS>
+      <SRS>EPSG:3060</SRS>
+      <SRS>EPSG:3061</SRS>
+      <SRS>EPSG:3062</SRS>
+      <SRS>EPSG:3063</SRS>
+      <SRS>EPSG:3064</SRS>
+      <SRS>EPSG:3065</SRS>
+      <SRS>EPSG:3066</SRS>
+      <SRS>EPSG:3067</SRS>
+      <SRS>EPSG:3068</SRS>
+      <SRS>EPSG:3069</SRS>
+      <SRS>EPSG:3070</SRS>
+      <SRS>EPSG:3071</SRS>
+      <SRS>EPSG:3072</SRS>
+      <SRS>EPSG:3073</SRS>
+      <SRS>EPSG:3074</SRS>
+      <SRS>EPSG:3075</SRS>
+      <SRS>EPSG:3076</SRS>
+      <SRS>EPSG:3077</SRS>
+      <SRS>EPSG:3078</SRS>
+      <SRS>EPSG:3079</SRS>
+      <SRS>EPSG:3080</SRS>
+      <SRS>EPSG:3081</SRS>
+      <SRS>EPSG:3082</SRS>
+      <SRS>EPSG:3083</SRS>
+      <SRS>EPSG:3084</SRS>
+      <SRS>EPSG:3085</SRS>
+      <SRS>EPSG:3086</SRS>
+      <SRS>EPSG:3087</SRS>
+      <SRS>EPSG:3088</SRS>
+      <SRS>EPSG:3089</SRS>
+      <SRS>EPSG:3090</SRS>
+      <SRS>EPSG:3091</SRS>
+      <SRS>EPSG:3092</SRS>
+      <SRS>EPSG:3093</SRS>
+      <SRS>EPSG:3094</SRS>
+      <SRS>EPSG:3095</SRS>
+      <SRS>EPSG:3096</SRS>
+      <SRS>EPSG:3097</SRS>
+      <SRS>EPSG:3098</SRS>
+      <SRS>EPSG:3099</SRS>
+      <SRS>EPSG:3100</SRS>
+      <SRS>EPSG:3101</SRS>
+      <SRS>EPSG:3102</SRS>
+      <SRS>EPSG:3103</SRS>
+      <SRS>EPSG:3104</SRS>
+      <SRS>EPSG:3105</SRS>
+      <SRS>EPSG:3106</SRS>
+      <SRS>EPSG:3107</SRS>
+      <SRS>EPSG:3108</SRS>
+      <SRS>EPSG:3109</SRS>
+      <SRS>EPSG:3110</SRS>
+      <SRS>EPSG:3111</SRS>
+      <SRS>EPSG:3112</SRS>
+      <SRS>EPSG:3113</SRS>
+      <SRS>EPSG:3114</SRS>
+      <SRS>EPSG:3115</SRS>
+      <SRS>EPSG:3116</SRS>
+      <SRS>EPSG:3117</SRS>
+      <SRS>EPSG:3118</SRS>
+      <SRS>EPSG:3119</SRS>
+      <SRS>EPSG:3120</SRS>
+      <SRS>EPSG:3121</SRS>
+      <SRS>EPSG:3122</SRS>
+      <SRS>EPSG:3123</SRS>
+      <SRS>EPSG:3124</SRS>
+      <SRS>EPSG:3125</SRS>
+      <SRS>EPSG:3126</SRS>
+      <SRS>EPSG:3127</SRS>
+      <SRS>EPSG:3128</SRS>
+      <SRS>EPSG:3129</SRS>
+      <SRS>EPSG:3130</SRS>
+      <SRS>EPSG:3131</SRS>
+      <SRS>EPSG:3132</SRS>
+      <SRS>EPSG:3133</SRS>
+      <SRS>EPSG:3134</SRS>
+      <SRS>EPSG:3135</SRS>
+      <SRS>EPSG:3136</SRS>
+      <SRS>EPSG:3137</SRS>
+      <SRS>EPSG:3138</SRS>
+      <SRS>EPSG:3139</SRS>
+      <SRS>EPSG:3140</SRS>
+      <SRS>EPSG:3141</SRS>
+      <SRS>EPSG:3142</SRS>
+      <SRS>EPSG:3143</SRS>
+      <SRS>EPSG:3144</SRS>
+      <SRS>EPSG:3145</SRS>
+      <SRS>EPSG:3146</SRS>
+      <SRS>EPSG:3147</SRS>
+      <SRS>EPSG:3148</SRS>
+      <SRS>EPSG:3149</SRS>
+      <SRS>EPSG:3150</SRS>
+      <SRS>EPSG:3151</SRS>
+      <SRS>EPSG:3152</SRS>
+      <SRS>EPSG:3153</SRS>
+      <SRS>EPSG:3154</SRS>
+      <SRS>EPSG:3155</SRS>
+      <SRS>EPSG:3156</SRS>
+      <SRS>EPSG:3157</SRS>
+      <SRS>EPSG:3158</SRS>
+      <SRS>EPSG:3159</SRS>
+      <SRS>EPSG:3160</SRS>
+      <SRS>EPSG:3161</SRS>
+      <SRS>EPSG:3162</SRS>
+      <SRS>EPSG:3163</SRS>
+      <SRS>EPSG:3164</SRS>
+      <SRS>EPSG:3165</SRS>
+      <SRS>EPSG:3166</SRS>
+      <SRS>EPSG:3167</SRS>
+      <SRS>EPSG:3168</SRS>
+      <SRS>EPSG:3169</SRS>
+      <SRS>EPSG:3170</SRS>
+      <SRS>EPSG:3171</SRS>
+      <SRS>EPSG:3172</SRS>
+      <SRS>EPSG:3173</SRS>
+      <SRS>EPSG:3174</SRS>
+      <SRS>EPSG:3175</SRS>
+      <SRS>EPSG:3176</SRS>
+      <SRS>EPSG:3177</SRS>
+      <SRS>EPSG:3178</SRS>
+      <SRS>EPSG:3179</SRS>
+      <SRS>EPSG:3180</SRS>
+      <SRS>EPSG:3181</SRS>
+      <SRS>EPSG:3182</SRS>
+      <SRS>EPSG:3183</SRS>
+      <SRS>EPSG:3184</SRS>
+      <SRS>EPSG:3185</SRS>
+      <SRS>EPSG:3186</SRS>
+      <SRS>EPSG:3187</SRS>
+      <SRS>EPSG:3188</SRS>
+      <SRS>EPSG:3189</SRS>
+      <SRS>EPSG:3190</SRS>
+      <SRS>EPSG:3191</SRS>
+      <SRS>EPSG:3192</SRS>
+      <SRS>EPSG:3193</SRS>
+      <SRS>EPSG:3194</SRS>
+      <SRS>EPSG:3195</SRS>
+      <SRS>EPSG:3196</SRS>
+      <SRS>EPSG:3197</SRS>
+      <SRS>EPSG:3198</SRS>
+      <SRS>EPSG:3199</SRS>
+      <SRS>EPSG:3200</SRS>
+      <SRS>EPSG:3201</SRS>
+      <SRS>EPSG:3202</SRS>
+      <SRS>EPSG:3203</SRS>
+      <SRS>EPSG:3204</SRS>
+      <SRS>EPSG:3205</SRS>
+      <SRS>EPSG:3206</SRS>
+      <SRS>EPSG:3207</SRS>
+      <SRS>EPSG:3208</SRS>
+      <SRS>EPSG:3209</SRS>
+      <SRS>EPSG:3210</SRS>
+      <SRS>EPSG:3211</SRS>
+      <SRS>EPSG:3212</SRS>
+      <SRS>EPSG:3213</SRS>
+      <SRS>EPSG:3214</SRS>
+      <SRS>EPSG:3215</SRS>
+      <SRS>EPSG:3216</SRS>
+      <SRS>EPSG:3217</SRS>
+      <SRS>EPSG:3218</SRS>
+      <SRS>EPSG:3219</SRS>
+      <SRS>EPSG:3220</SRS>
+      <SRS>EPSG:3221</SRS>
+      <SRS>EPSG:3222</SRS>
+      <SRS>EPSG:3223</SRS>
+      <SRS>EPSG:3224</SRS>
+      <SRS>EPSG:3225</SRS>
+      <SRS>EPSG:3226</SRS>
+      <SRS>EPSG:3227</SRS>
+      <SRS>EPSG:3228</SRS>
+      <SRS>EPSG:3229</SRS>
+      <SRS>EPSG:3230</SRS>
+      <SRS>EPSG:3231</SRS>
+      <SRS>EPSG:3232</SRS>
+      <SRS>EPSG:3233</SRS>
+      <SRS>EPSG:3234</SRS>
+      <SRS>EPSG:3235</SRS>
+      <SRS>EPSG:3236</SRS>
+      <SRS>EPSG:3237</SRS>
+      <SRS>EPSG:3238</SRS>
+      <SRS>EPSG:3239</SRS>
+      <SRS>EPSG:3240</SRS>
+      <SRS>EPSG:3241</SRS>
+      <SRS>EPSG:3242</SRS>
+      <SRS>EPSG:3243</SRS>
+      <SRS>EPSG:3244</SRS>
+      <SRS>EPSG:3245</SRS>
+      <SRS>EPSG:3246</SRS>
+      <SRS>EPSG:3247</SRS>
+      <SRS>EPSG:3248</SRS>
+      <SRS>EPSG:3249</SRS>
+      <SRS>EPSG:3250</SRS>
+      <SRS>EPSG:3251</SRS>
+      <SRS>EPSG:3252</SRS>
+      <SRS>EPSG:3253</SRS>
+      <SRS>EPSG:3254</SRS>
+      <SRS>EPSG:3255</SRS>
+      <SRS>EPSG:3256</SRS>
+      <SRS>EPSG:3257</SRS>
+      <SRS>EPSG:3258</SRS>
+      <SRS>EPSG:3259</SRS>
+      <SRS>EPSG:3260</SRS>
+      <SRS>EPSG:3261</SRS>
+      <SRS>EPSG:3262</SRS>
+      <SRS>EPSG:3263</SRS>
+      <SRS>EPSG:3264</SRS>
+      <SRS>EPSG:3265</SRS>
+      <SRS>EPSG:3266</SRS>
+      <SRS>EPSG:3267</SRS>
+      <SRS>EPSG:3268</SRS>
+      <SRS>EPSG:3269</SRS>
+      <SRS>EPSG:3270</SRS>
+      <SRS>EPSG:3271</SRS>
+      <SRS>EPSG:3272</SRS>
+      <SRS>EPSG:3273</SRS>
+      <SRS>EPSG:3274</SRS>
+      <SRS>EPSG:3275</SRS>
+      <SRS>EPSG:3276</SRS>
+      <SRS>EPSG:3277</SRS>
+      <SRS>EPSG:3278</SRS>
+      <SRS>EPSG:3279</SRS>
+      <SRS>EPSG:3280</SRS>
+      <SRS>EPSG:3281</SRS>
+      <SRS>EPSG:3282</SRS>
+      <SRS>EPSG:3283</SRS>
+      <SRS>EPSG:3284</SRS>
+      <SRS>EPSG:3285</SRS>
+      <SRS>EPSG:3286</SRS>
+      <SRS>EPSG:3287</SRS>
+      <SRS>EPSG:3288</SRS>
+      <SRS>EPSG:3289</SRS>
+      <SRS>EPSG:3290</SRS>
+      <SRS>EPSG:3291</SRS>
+      <SRS>EPSG:3292</SRS>
+      <SRS>EPSG:3293</SRS>
+      <SRS>EPSG:3294</SRS>
+      <SRS>EPSG:3295</SRS>
+      <SRS>EPSG:3296</SRS>
+      <SRS>EPSG:3297</SRS>
+      <SRS>EPSG:3298</SRS>
+      <SRS>EPSG:3299</SRS>
+      <SRS>EPSG:3300</SRS>
+      <SRS>EPSG:3301</SRS>
+      <SRS>EPSG:3302</SRS>
+      <SRS>EPSG:3303</SRS>
+      <SRS>EPSG:3304</SRS>
+      <SRS>EPSG:3305</SRS>
+      <SRS>EPSG:3306</SRS>
+      <SRS>EPSG:3307</SRS>
+      <SRS>EPSG:3308</SRS>
+      <SRS>EPSG:3309</SRS>
+      <SRS>EPSG:3310</SRS>
+      <SRS>EPSG:3311</SRS>
+      <SRS>EPSG:3312</SRS>
+      <SRS>EPSG:3313</SRS>
+      <SRS>EPSG:3314</SRS>
+      <SRS>EPSG:3315</SRS>
+      <SRS>EPSG:3316</SRS>
+      <SRS>EPSG:3317</SRS>
+      <SRS>EPSG:3318</SRS>
+      <SRS>EPSG:3319</SRS>
+      <SRS>EPSG:3320</SRS>
+      <SRS>EPSG:3321</SRS>
+      <SRS>EPSG:3322</SRS>
+      <SRS>EPSG:3323</SRS>
+      <SRS>EPSG:3324</SRS>
+      <SRS>EPSG:3325</SRS>
+      <SRS>EPSG:3326</SRS>
+      <SRS>EPSG:3327</SRS>
+      <SRS>EPSG:3328</SRS>
+      <SRS>EPSG:3329</SRS>
+      <SRS>EPSG:3330</SRS>
+      <SRS>EPSG:3331</SRS>
+      <SRS>EPSG:3332</SRS>
+      <SRS>EPSG:3333</SRS>
+      <SRS>EPSG:3334</SRS>
+      <SRS>EPSG:3335</SRS>
+      <SRS>EPSG:3336</SRS>
+      <SRS>EPSG:3337</SRS>
+      <SRS>EPSG:3338</SRS>
+      <SRS>EPSG:3339</SRS>
+      <SRS>EPSG:3340</SRS>
+      <SRS>EPSG:3341</SRS>
+      <SRS>EPSG:3342</SRS>
+      <SRS>EPSG:3343</SRS>
+      <SRS>EPSG:3344</SRS>
+      <SRS>EPSG:3345</SRS>
+      <SRS>EPSG:3346</SRS>
+      <SRS>EPSG:3347</SRS>
+      <SRS>EPSG:3348</SRS>
+      <SRS>EPSG:3349</SRS>
+      <SRS>EPSG:3350</SRS>
+      <SRS>EPSG:3351</SRS>
+      <SRS>EPSG:3352</SRS>
+      <SRS>EPSG:3353</SRS>
+      <SRS>EPSG:3354</SRS>
+      <SRS>EPSG:3355</SRS>
+      <SRS>EPSG:3356</SRS>
+      <SRS>EPSG:3357</SRS>
+      <SRS>EPSG:3358</SRS>
+      <SRS>EPSG:3359</SRS>
+      <SRS>EPSG:3360</SRS>
+      <SRS>EPSG:3361</SRS>
+      <SRS>EPSG:3362</SRS>
+      <SRS>EPSG:3363</SRS>
+      <SRS>EPSG:3364</SRS>
+      <SRS>EPSG:3365</SRS>
+      <SRS>EPSG:3366</SRS>
+      <SRS>EPSG:3367</SRS>
+      <SRS>EPSG:3368</SRS>
+      <SRS>EPSG:3369</SRS>
+      <SRS>EPSG:3370</SRS>
+      <SRS>EPSG:3371</SRS>
+      <SRS>EPSG:3372</SRS>
+      <SRS>EPSG:3373</SRS>
+      <SRS>EPSG:3374</SRS>
+      <SRS>EPSG:3375</SRS>
+      <SRS>EPSG:3376</SRS>
+      <SRS>EPSG:3377</SRS>
+      <SRS>EPSG:3378</SRS>
+      <SRS>EPSG:3379</SRS>
+      <SRS>EPSG:3380</SRS>
+      <SRS>EPSG:3381</SRS>
+      <SRS>EPSG:3382</SRS>
+      <SRS>EPSG:3383</SRS>
+      <SRS>EPSG:3384</SRS>
+      <SRS>EPSG:3385</SRS>
+      <SRS>EPSG:3386</SRS>
+      <SRS>EPSG:3387</SRS>
+      <SRS>EPSG:3388</SRS>
+      <SRS>EPSG:3389</SRS>
+      <SRS>EPSG:3390</SRS>
+      <SRS>EPSG:3391</SRS>
+      <SRS>EPSG:3392</SRS>
+      <SRS>EPSG:3393</SRS>
+      <SRS>EPSG:3394</SRS>
+      <SRS>EPSG:3395</SRS>
+      <SRS>EPSG:3396</SRS>
+      <SRS>EPSG:3397</SRS>
+      <SRS>EPSG:3398</SRS>
+      <SRS>EPSG:3399</SRS>
+      <SRS>EPSG:3400</SRS>
+      <SRS>EPSG:3401</SRS>
+      <SRS>EPSG:3402</SRS>
+      <SRS>EPSG:3403</SRS>
+      <SRS>EPSG:3404</SRS>
+      <SRS>EPSG:3405</SRS>
+      <SRS>EPSG:3406</SRS>
+      <SRS>EPSG:3407</SRS>
+      <SRS>EPSG:3408</SRS>
+      <SRS>EPSG:3409</SRS>
+      <SRS>EPSG:3410</SRS>
+      <SRS>EPSG:3411</SRS>
+      <SRS>EPSG:3412</SRS>
+      <SRS>EPSG:3413</SRS>
+      <SRS>EPSG:3414</SRS>
+      <SRS>EPSG:3415</SRS>
+      <SRS>EPSG:3416</SRS>
+      <SRS>EPSG:3417</SRS>
+      <SRS>EPSG:3418</SRS>
+      <SRS>EPSG:3419</SRS>
+      <SRS>EPSG:3420</SRS>
+      <SRS>EPSG:3421</SRS>
+      <SRS>EPSG:3422</SRS>
+      <SRS>EPSG:3423</SRS>
+      <SRS>EPSG:3424</SRS>
+      <SRS>EPSG:3425</SRS>
+      <SRS>EPSG:3426</SRS>
+      <SRS>EPSG:3427</SRS>
+      <SRS>EPSG:3428</SRS>
+      <SRS>EPSG:3429</SRS>
+      <SRS>EPSG:3430</SRS>
+      <SRS>EPSG:3431</SRS>
+      <SRS>EPSG:3432</SRS>
+      <SRS>EPSG:3433</SRS>
+      <SRS>EPSG:3434</SRS>
+      <SRS>EPSG:3435</SRS>
+      <SRS>EPSG:3436</SRS>
+      <SRS>EPSG:3437</SRS>
+      <SRS>EPSG:3438</SRS>
+      <SRS>EPSG:3439</SRS>
+      <SRS>EPSG:3440</SRS>
+      <SRS>EPSG:3441</SRS>
+      <SRS>EPSG:3442</SRS>
+      <SRS>EPSG:3443</SRS>
+      <SRS>EPSG:3444</SRS>
+      <SRS>EPSG:3445</SRS>
+      <SRS>EPSG:3446</SRS>
+      <SRS>EPSG:3447</SRS>
+      <SRS>EPSG:3448</SRS>
+      <SRS>EPSG:3449</SRS>
+      <SRS>EPSG:3450</SRS>
+      <SRS>EPSG:3451</SRS>
+      <SRS>EPSG:3452</SRS>
+      <SRS>EPSG:3453</SRS>
+      <SRS>EPSG:3454</SRS>
+      <SRS>EPSG:3455</SRS>
+      <SRS>EPSG:3456</SRS>
+      <SRS>EPSG:3457</SRS>
+      <SRS>EPSG:3458</SRS>
+      <SRS>EPSG:3459</SRS>
+      <SRS>EPSG:3460</SRS>
+      <SRS>EPSG:3461</SRS>
+      <SRS>EPSG:3462</SRS>
+      <SRS>EPSG:3463</SRS>
+      <SRS>EPSG:3464</SRS>
+      <SRS>EPSG:3560</SRS>
+      <SRS>EPSG:3561</SRS>
+      <SRS>EPSG:3562</SRS>
+      <SRS>EPSG:3563</SRS>
+      <SRS>EPSG:3564</SRS>
+      <SRS>EPSG:3565</SRS>
+      <SRS>EPSG:3566</SRS>
+      <SRS>EPSG:3567</SRS>
+      <SRS>EPSG:3568</SRS>
+      <SRS>EPSG:3569</SRS>
+      <SRS>EPSG:3570</SRS>
+      <SRS>EPSG:3571</SRS>
+      <SRS>EPSG:3572</SRS>
+      <SRS>EPSG:3573</SRS>
+      <SRS>EPSG:3574</SRS>
+      <SRS>EPSG:3575</SRS>
+      <SRS>EPSG:3576</SRS>
+      <SRS>EPSG:3577</SRS>
+      <SRS>EPSG:3920</SRS>
+      <SRS>EPSG:3991</SRS>
+      <SRS>EPSG:3992</SRS>
+      <SRS>EPSG:3993</SRS>
+      <SRS>EPSG:4001</SRS>
+      <SRS>EPSG:4002</SRS>
+      <SRS>EPSG:4003</SRS>
+      <SRS>EPSG:4004</SRS>
+      <SRS>EPSG:4005</SRS>
+      <SRS>EPSG:4006</SRS>
+      <SRS>EPSG:4007</SRS>
+      <SRS>EPSG:4008</SRS>
+      <SRS>EPSG:4009</SRS>
+      <SRS>EPSG:4010</SRS>
+      <SRS>EPSG:4011</SRS>
+      <SRS>EPSG:4012</SRS>
+      <SRS>EPSG:4013</SRS>
+      <SRS>EPSG:4014</SRS>
+      <SRS>EPSG:4015</SRS>
+      <SRS>EPSG:4016</SRS>
+      <SRS>EPSG:4018</SRS>
+      <SRS>EPSG:4019</SRS>
+      <SRS>EPSG:4020</SRS>
+      <SRS>EPSG:4021</SRS>
+      <SRS>EPSG:4022</SRS>
+      <SRS>EPSG:4024</SRS>
+      <SRS>EPSG:4025</SRS>
+      <SRS>EPSG:4027</SRS>
+      <SRS>EPSG:4028</SRS>
+      <SRS>EPSG:4029</SRS>
+      <SRS>EPSG:4030</SRS>
+      <SRS>EPSG:4031</SRS>
+      <SRS>EPSG:4032</SRS>
+      <SRS>EPSG:4033</SRS>
+      <SRS>EPSG:4034</SRS>
+      <SRS>EPSG:4035</SRS>
+      <SRS>EPSG:4036</SRS>
+      <SRS>EPSG:4041</SRS>
+      <SRS>EPSG:4042</SRS>
+      <SRS>EPSG:4043</SRS>
+      <SRS>EPSG:4044</SRS>
+      <SRS>EPSG:4045</SRS>
+      <SRS>EPSG:4047</SRS>
+      <SRS>EPSG:4052</SRS>
+      <SRS>EPSG:4053</SRS>
+      <SRS>EPSG:4054</SRS>
+      <SRS>EPSG:4120</SRS>
+      <SRS>EPSG:4121</SRS>
+      <SRS>EPSG:4122</SRS>
+      <SRS>EPSG:4123</SRS>
+      <SRS>EPSG:4124</SRS>
+      <SRS>EPSG:4125</SRS>
+      <SRS>EPSG:4126</SRS>
+      <SRS>EPSG:4127</SRS>
+      <SRS>EPSG:4128</SRS>
+      <SRS>EPSG:4129</SRS>
+      <SRS>EPSG:4130</SRS>
+      <SRS>EPSG:4131</SRS>
+      <SRS>EPSG:4132</SRS>
+      <SRS>EPSG:4133</SRS>
+      <SRS>EPSG:4134</SRS>
+      <SRS>EPSG:4135</SRS>
+      <SRS>EPSG:4136</SRS>
+      <SRS>EPSG:4137</SRS>
+      <SRS>EPSG:4138</SRS>
+      <SRS>EPSG:4139</SRS>
+      <SRS>EPSG:4140</SRS>
+      <SRS>EPSG:4141</SRS>
+      <SRS>EPSG:4142</SRS>
+      <SRS>EPSG:4143</SRS>
+      <SRS>EPSG:4144</SRS>
+      <SRS>EPSG:4145</SRS>
+      <SRS>EPSG:4146</SRS>
+      <SRS>EPSG:4147</SRS>
+      <SRS>EPSG:4148</SRS>
+      <SRS>EPSG:4149</SRS>
+      <SRS>EPSG:4150</SRS>
+      <SRS>EPSG:4151</SRS>
+      <SRS>EPSG:4152</SRS>
+      <SRS>EPSG:4153</SRS>
+      <SRS>EPSG:4154</SRS>
+      <SRS>EPSG:4155</SRS>
+      <SRS>EPSG:4156</SRS>
+      <SRS>EPSG:4157</SRS>
+      <SRS>EPSG:4158</SRS>
+      <SRS>EPSG:4159</SRS>
+      <SRS>EPSG:4160</SRS>
+      <SRS>EPSG:4161</SRS>
+      <SRS>EPSG:4162</SRS>
+      <SRS>EPSG:4163</SRS>
+      <SRS>EPSG:4164</SRS>
+      <SRS>EPSG:4165</SRS>
+      <SRS>EPSG:4166</SRS>
+      <SRS>EPSG:4167</SRS>
+      <SRS>EPSG:4168</SRS>
+      <SRS>EPSG:4169</SRS>
+      <SRS>EPSG:4170</SRS>
+      <SRS>EPSG:4171</SRS>
+      <SRS>EPSG:4172</SRS>
+      <SRS>EPSG:4173</SRS>
+      <SRS>EPSG:4174</SRS>
+      <SRS>EPSG:4175</SRS>
+      <SRS>EPSG:4176</SRS>
+      <SRS>EPSG:4178</SRS>
+      <SRS>EPSG:4179</SRS>
+      <SRS>EPSG:4180</SRS>
+      <SRS>EPSG:4181</SRS>
+      <SRS>EPSG:4182</SRS>
+      <SRS>EPSG:4183</SRS>
+      <SRS>EPSG:4184</SRS>
+      <SRS>EPSG:4185</SRS>
+      <SRS>EPSG:4188</SRS>
+      <SRS>EPSG:4189</SRS>
+      <SRS>EPSG:4190</SRS>
+      <SRS>EPSG:4191</SRS>
+      <SRS>EPSG:4192</SRS>
+      <SRS>EPSG:4193</SRS>
+      <SRS>EPSG:4194</SRS>
+      <SRS>EPSG:4195</SRS>
+      <SRS>EPSG:4196</SRS>
+      <SRS>EPSG:4197</SRS>
+      <SRS>EPSG:4198</SRS>
+      <SRS>EPSG:4199</SRS>
+      <SRS>EPSG:4200</SRS>
+      <SRS>EPSG:4201</SRS>
+      <SRS>EPSG:4202</SRS>
+      <SRS>EPSG:4203</SRS>
+      <SRS>EPSG:4204</SRS>
+      <SRS>EPSG:4205</SRS>
+      <SRS>EPSG:4206</SRS>
+      <SRS>EPSG:4207</SRS>
+      <SRS>EPSG:4208</SRS>
+      <SRS>EPSG:4209</SRS>
+      <SRS>EPSG:4210</SRS>
+      <SRS>EPSG:4211</SRS>
+      <SRS>EPSG:4212</SRS>
+      <SRS>EPSG:4213</SRS>
+      <SRS>EPSG:4214</SRS>
+      <SRS>EPSG:4215</SRS>
+      <SRS>EPSG:4216</SRS>
+      <SRS>EPSG:4218</SRS>
+      <SRS>EPSG:4219</SRS>
+      <SRS>EPSG:4220</SRS>
+      <SRS>EPSG:4221</SRS>
+      <SRS>EPSG:4222</SRS>
+      <SRS>EPSG:4223</SRS>
+      <SRS>EPSG:4224</SRS>
+      <SRS>EPSG:4225</SRS>
+      <SRS>EPSG:4226</SRS>
+      <SRS>EPSG:4227</SRS>
+      <SRS>EPSG:4228</SRS>
+      <SRS>EPSG:4229</SRS>
+      <SRS>EPSG:4230</SRS>
+      <SRS>EPSG:4231</SRS>
+      <SRS>EPSG:4232</SRS>
+      <SRS>EPSG:4233</SRS>
+      <SRS>EPSG:4234</SRS>
+      <SRS>EPSG:4235</SRS>
+      <SRS>EPSG:4236</SRS>
+      <SRS>EPSG:4237</SRS>
+      <SRS>EPSG:4238</SRS>
+      <SRS>EPSG:4239</SRS>
+      <SRS>EPSG:4240</SRS>
+      <SRS>EPSG:4241</SRS>
+      <SRS>EPSG:4242</SRS>
+      <SRS>EPSG:4243</SRS>
+      <SRS>EPSG:4244</SRS>
+      <SRS>EPSG:4245</SRS>
+      <SRS>EPSG:4246</SRS>
+      <SRS>EPSG:4247</SRS>
+      <SRS>EPSG:4248</SRS>
+      <SRS>EPSG:4249</SRS>
+      <SRS>EPSG:4250</SRS>
+      <SRS>EPSG:4251</SRS>
+      <SRS>EPSG:4252</SRS>
+      <SRS>EPSG:4253</SRS>
+      <SRS>EPSG:4254</SRS>
+      <SRS>EPSG:4255</SRS>
+      <SRS>EPSG:4256</SRS>
+      <SRS>EPSG:4257</SRS>
+      <SRS>EPSG:4258</SRS>
+      <SRS>EPSG:4259</SRS>
+      <SRS>EPSG:4260</SRS>
+      <SRS>EPSG:4261</SRS>
+      <SRS>EPSG:4262</SRS>
+      <SRS>EPSG:4263</SRS>
+      <SRS>EPSG:4264</SRS>
+      <SRS>EPSG:4265</SRS>
+      <SRS>EPSG:4266</SRS>
+      <SRS>EPSG:4267</SRS>
+      <SRS>EPSG:4268</SRS>
+      <SRS>EPSG:4269</SRS>
+      <SRS>EPSG:4270</SRS>
+      <SRS>EPSG:4271</SRS>
+      <SRS>EPSG:4272</SRS>
+      <SRS>EPSG:4273</SRS>
+      <SRS>EPSG:4274</SRS>
+      <SRS>EPSG:4275</SRS>
+      <SRS>EPSG:4276</SRS>
+      <SRS>EPSG:4277</SRS>
+      <SRS>EPSG:4278</SRS>
+      <SRS>EPSG:4279</SRS>
+      <SRS>EPSG:4280</SRS>
+      <SRS>EPSG:4281</SRS>
+      <SRS>EPSG:4282</SRS>
+      <SRS>EPSG:4283</SRS>
+      <SRS>EPSG:4284</SRS>
+      <SRS>EPSG:4285</SRS>
+      <SRS>EPSG:4286</SRS>
+      <SRS>EPSG:4287</SRS>
+      <SRS>EPSG:4288</SRS>
+      <SRS>EPSG:4289</SRS>
+      <SRS>EPSG:4291</SRS>
+      <SRS>EPSG:4292</SRS>
+      <SRS>EPSG:4293</SRS>
+      <SRS>EPSG:4294</SRS>
+      <SRS>EPSG:4295</SRS>
+      <SRS>EPSG:4296</SRS>
+      <SRS>EPSG:4297</SRS>
+      <SRS>EPSG:4298</SRS>
+      <SRS>EPSG:4299</SRS>
+      <SRS>EPSG:4300</SRS>
+      <SRS>EPSG:4301</SRS>
+      <SRS>EPSG:4302</SRS>
+      <SRS>EPSG:4303</SRS>
+      <SRS>EPSG:4304</SRS>
+      <SRS>EPSG:4306</SRS>
+      <SRS>EPSG:4307</SRS>
+      <SRS>EPSG:4308</SRS>
+      <SRS>EPSG:4309</SRS>
+      <SRS>EPSG:4310</SRS>
+      <SRS>EPSG:4311</SRS>
+      <SRS>EPSG:4312</SRS>
+      <SRS>EPSG:4313</SRS>
+      <SRS>EPSG:4314</SRS>
+      <SRS>EPSG:4315</SRS>
+      <SRS>EPSG:4316</SRS>
+      <SRS>EPSG:4317</SRS>
+      <SRS>EPSG:4318</SRS>
+      <SRS>EPSG:4319</SRS>
+      <SRS>EPSG:4322</SRS>
+      <SRS>EPSG:4324</SRS>
+      <SRS>EPSG:4326</SRS>
+      <SRS>EPSG:4327</SRS>
+      <SRS>EPSG:4328</SRS>
+      <SRS>EPSG:4329</SRS>
+      <SRS>EPSG:4330</SRS>
+      <SRS>EPSG:4331</SRS>
+      <SRS>EPSG:4332</SRS>
+      <SRS>EPSG:4333</SRS>
+      <SRS>EPSG:4334</SRS>
+      <SRS>EPSG:4335</SRS>
+      <SRS>EPSG:4336</SRS>
+      <SRS>EPSG:4337</SRS>
+      <SRS>EPSG:4338</SRS>
+      <SRS>EPSG:4339</SRS>
+      <SRS>EPSG:4340</SRS>
+      <SRS>EPSG:4341</SRS>
+      <SRS>EPSG:4342</SRS>
+      <SRS>EPSG:4343</SRS>
+      <SRS>EPSG:4344</SRS>
+      <SRS>EPSG:4345</SRS>
+      <SRS>EPSG:4346</SRS>
+      <SRS>EPSG:4347</SRS>
+      <SRS>EPSG:4348</SRS>
+      <SRS>EPSG:4349</SRS>
+      <SRS>EPSG:4350</SRS>
+      <SRS>EPSG:4351</SRS>
+      <SRS>EPSG:4352</SRS>
+      <SRS>EPSG:4353</SRS>
+      <SRS>EPSG:4354</SRS>
+      <SRS>EPSG:4355</SRS>
+      <SRS>EPSG:4356</SRS>
+      <SRS>EPSG:4357</SRS>
+      <SRS>EPSG:4358</SRS>
+      <SRS>EPSG:4359</SRS>
+      <SRS>EPSG:4360</SRS>
+      <SRS>EPSG:4361</SRS>
+      <SRS>EPSG:4362</SRS>
+      <SRS>EPSG:4363</SRS>
+      <SRS>EPSG:4364</SRS>
+      <SRS>EPSG:4365</SRS>
+      <SRS>EPSG:4366</SRS>
+      <SRS>EPSG:4367</SRS>
+      <SRS>EPSG:4368</SRS>
+      <SRS>EPSG:4369</SRS>
+      <SRS>EPSG:4370</SRS>
+      <SRS>EPSG:4371</SRS>
+      <SRS>EPSG:4372</SRS>
+      <SRS>EPSG:4373</SRS>
+      <SRS>EPSG:4374</SRS>
+      <SRS>EPSG:4375</SRS>
+      <SRS>EPSG:4376</SRS>
+      <SRS>EPSG:4377</SRS>
+      <SRS>EPSG:4378</SRS>
+      <SRS>EPSG:4379</SRS>
+      <SRS>EPSG:4380</SRS>
+      <SRS>EPSG:4381</SRS>
+      <SRS>EPSG:4382</SRS>
+      <SRS>EPSG:4383</SRS>
+      <SRS>EPSG:4384</SRS>
+      <SRS>EPSG:4385</SRS>
+      <SRS>EPSG:4386</SRS>
+      <SRS>EPSG:4387</SRS>
+      <SRS>EPSG:4388</SRS>
+      <SRS>EPSG:4389</SRS>
+      <SRS>EPSG:4600</SRS>
+      <SRS>EPSG:4601</SRS>
+      <SRS>EPSG:4602</SRS>
+      <SRS>EPSG:4603</SRS>
+      <SRS>EPSG:4604</SRS>
+      <SRS>EPSG:4605</SRS>
+      <SRS>EPSG:4606</SRS>
+      <SRS>EPSG:4607</SRS>
+      <SRS>EPSG:4608</SRS>
+      <SRS>EPSG:4609</SRS>
+      <SRS>EPSG:4610</SRS>
+      <SRS>EPSG:4611</SRS>
+      <SRS>EPSG:4612</SRS>
+      <SRS>EPSG:4613</SRS>
+      <SRS>EPSG:4614</SRS>
+      <SRS>EPSG:4615</SRS>
+      <SRS>EPSG:4616</SRS>
+      <SRS>EPSG:4617</SRS>
+      <SRS>EPSG:4618</SRS>
+      <SRS>EPSG:4619</SRS>
+      <SRS>EPSG:4620</SRS>
+      <SRS>EPSG:4621</SRS>
+      <SRS>EPSG:4622</SRS>
+      <SRS>EPSG:4623</SRS>
+      <SRS>EPSG:4624</SRS>
+      <SRS>EPSG:4625</SRS>
+      <SRS>EPSG:4626</SRS>
+      <SRS>EPSG:4627</SRS>
+      <SRS>EPSG:4628</SRS>
+      <SRS>EPSG:4629</SRS>
+      <SRS>EPSG:4630</SRS>
+      <SRS>EPSG:4631</SRS>
+      <SRS>EPSG:4632</SRS>
+      <SRS>EPSG:4633</SRS>
+      <SRS>EPSG:4634</SRS>
+      <SRS>EPSG:4635</SRS>
+      <SRS>EPSG:4636</SRS>
+      <SRS>EPSG:4637</SRS>
+      <SRS>EPSG:4638</SRS>
+      <SRS>EPSG:4639</SRS>
+      <SRS>EPSG:4640</SRS>
+      <SRS>EPSG:4641</SRS>
+      <SRS>EPSG:4642</SRS>
+      <SRS>EPSG:4643</SRS>
+      <SRS>EPSG:4644</SRS>
+      <SRS>EPSG:4645</SRS>
+      <SRS>EPSG:4646</SRS>
+      <SRS>EPSG:4657</SRS>
+      <SRS>EPSG:4658</SRS>
+      <SRS>EPSG:4659</SRS>
+      <SRS>EPSG:4660</SRS>
+      <SRS>EPSG:4661</SRS>
+      <SRS>EPSG:4662</SRS>
+      <SRS>EPSG:4663</SRS>
+      <SRS>EPSG:4664</SRS>
+      <SRS>EPSG:4665</SRS>
+      <SRS>EPSG:4666</SRS>
+      <SRS>EPSG:4667</SRS>
+      <SRS>EPSG:4668</SRS>
+      <SRS>EPSG:4669</SRS>
+      <SRS>EPSG:4670</SRS>
+      <SRS>EPSG:4671</SRS>
+      <SRS>EPSG:4672</SRS>
+      <SRS>EPSG:4673</SRS>
+      <SRS>EPSG:4674</SRS>
+      <SRS>EPSG:4675</SRS>
+      <SRS>EPSG:4676</SRS>
+      <SRS>EPSG:4677</SRS>
+      <SRS>EPSG:4678</SRS>
+      <SRS>EPSG:4679</SRS>
+      <SRS>EPSG:4680</SRS>
+      <SRS>EPSG:4681</SRS>
+      <SRS>EPSG:4682</SRS>
+      <SRS>EPSG:4683</SRS>
+      <SRS>EPSG:4684</SRS>
+      <SRS>EPSG:4685</SRS>
+      <SRS>EPSG:4686</SRS>
+      <SRS>EPSG:4687</SRS>
+      <SRS>EPSG:4688</SRS>
+      <SRS>EPSG:4689</SRS>
+      <SRS>EPSG:4690</SRS>
+      <SRS>EPSG:4691</SRS>
+      <SRS>EPSG:4692</SRS>
+      <SRS>EPSG:4693</SRS>
+      <SRS>EPSG:4694</SRS>
+      <SRS>EPSG:4695</SRS>
+      <SRS>EPSG:4696</SRS>
+      <SRS>EPSG:4697</SRS>
+      <SRS>EPSG:4698</SRS>
+      <SRS>EPSG:4699</SRS>
+      <SRS>EPSG:4700</SRS>
+      <SRS>EPSG:4701</SRS>
+      <SRS>EPSG:4702</SRS>
+      <SRS>EPSG:4703</SRS>
+      <SRS>EPSG:4704</SRS>
+      <SRS>EPSG:4705</SRS>
+      <SRS>EPSG:4706</SRS>
+      <SRS>EPSG:4707</SRS>
+      <SRS>EPSG:4708</SRS>
+      <SRS>EPSG:4709</SRS>
+      <SRS>EPSG:4710</SRS>
+      <SRS>EPSG:4711</SRS>
+      <SRS>EPSG:4712</SRS>
+      <SRS>EPSG:4713</SRS>
+      <SRS>EPSG:4714</SRS>
+      <SRS>EPSG:4715</SRS>
+      <SRS>EPSG:4716</SRS>
+      <SRS>EPSG:4717</SRS>
+      <SRS>EPSG:4718</SRS>
+      <SRS>EPSG:4719</SRS>
+      <SRS>EPSG:4720</SRS>
+      <SRS>EPSG:4721</SRS>
+      <SRS>EPSG:4722</SRS>
+      <SRS>EPSG:4723</SRS>
+      <SRS>EPSG:4724</SRS>
+      <SRS>EPSG:4725</SRS>
+      <SRS>EPSG:4726</SRS>
+      <SRS>EPSG:4727</SRS>
+      <SRS>EPSG:4728</SRS>
+      <SRS>EPSG:4729</SRS>
+      <SRS>EPSG:4730</SRS>
+      <SRS>EPSG:4731</SRS>
+      <SRS>EPSG:4732</SRS>
+      <SRS>EPSG:4733</SRS>
+      <SRS>EPSG:4734</SRS>
+      <SRS>EPSG:4735</SRS>
+      <SRS>EPSG:4736</SRS>
+      <SRS>EPSG:4737</SRS>
+      <SRS>EPSG:4738</SRS>
+      <SRS>EPSG:4739</SRS>
+      <SRS>EPSG:4740</SRS>
+      <SRS>EPSG:4741</SRS>
+      <SRS>EPSG:4742</SRS>
+      <SRS>EPSG:4743</SRS>
+      <SRS>EPSG:4744</SRS>
+      <SRS>EPSG:4745</SRS>
+      <SRS>EPSG:4746</SRS>
+      <SRS>EPSG:4747</SRS>
+      <SRS>EPSG:4748</SRS>
+      <SRS>EPSG:4749</SRS>
+      <SRS>EPSG:4750</SRS>
+      <SRS>EPSG:4751</SRS>
+      <SRS>EPSG:4752</SRS>
+      <SRS>EPSG:4753</SRS>
+      <SRS>EPSG:4754</SRS>
+      <SRS>EPSG:4755</SRS>
+      <SRS>EPSG:4756</SRS>
+      <SRS>EPSG:4757</SRS>
+      <SRS>EPSG:4758</SRS>
+      <SRS>EPSG:4801</SRS>
+      <SRS>EPSG:4802</SRS>
+      <SRS>EPSG:4803</SRS>
+      <SRS>EPSG:4804</SRS>
+      <SRS>EPSG:4805</SRS>
+      <SRS>EPSG:4806</SRS>
+      <SRS>EPSG:4807</SRS>
+      <SRS>EPSG:4808</SRS>
+      <SRS>EPSG:4809</SRS>
+      <SRS>EPSG:4810</SRS>
+      <SRS>EPSG:4811</SRS>
+      <SRS>EPSG:4813</SRS>
+      <SRS>EPSG:4814</SRS>
+      <SRS>EPSG:4815</SRS>
+      <SRS>EPSG:4816</SRS>
+      <SRS>EPSG:4817</SRS>
+      <SRS>EPSG:4818</SRS>
+      <SRS>EPSG:4819</SRS>
+      <SRS>EPSG:4820</SRS>
+      <SRS>EPSG:4821</SRS>
+      <SRS>EPSG:4894</SRS>
+      <SRS>EPSG:4895</SRS>
+      <SRS>EPSG:4896</SRS>
+      <SRS>EPSG:4897</SRS>
+      <SRS>EPSG:4898</SRS>
+      <SRS>EPSG:4899</SRS>
+      <SRS>EPSG:4900</SRS>
+      <SRS>EPSG:4901</SRS>
+      <SRS>EPSG:4902</SRS>
+      <SRS>EPSG:4903</SRS>
+      <SRS>EPSG:4904</SRS>
+      <SRS>EPSG:4906</SRS>
+      <SRS>EPSG:4907</SRS>
+      <SRS>EPSG:4908</SRS>
+      <SRS>EPSG:4909</SRS>
+      <SRS>EPSG:4910</SRS>
+      <SRS>EPSG:4911</SRS>
+      <SRS>EPSG:4912</SRS>
+      <SRS>EPSG:4913</SRS>
+      <SRS>EPSG:4914</SRS>
+      <SRS>EPSG:4915</SRS>
+      <SRS>EPSG:4916</SRS>
+      <SRS>EPSG:4917</SRS>
+      <SRS>EPSG:4918</SRS>
+      <SRS>EPSG:4919</SRS>
+      <SRS>EPSG:4920</SRS>
+      <SRS>EPSG:4921</SRS>
+      <SRS>EPSG:4922</SRS>
+      <SRS>EPSG:4923</SRS>
+      <SRS>EPSG:4924</SRS>
+      <SRS>EPSG:4925</SRS>
+      <SRS>EPSG:4926</SRS>
+      <SRS>EPSG:4927</SRS>
+      <SRS>EPSG:4928</SRS>
+      <SRS>EPSG:4929</SRS>
+      <SRS>EPSG:4930</SRS>
+      <SRS>EPSG:4931</SRS>
+      <SRS>EPSG:4932</SRS>
+      <SRS>EPSG:4933</SRS>
+      <SRS>EPSG:4934</SRS>
+      <SRS>EPSG:4935</SRS>
+      <SRS>EPSG:4936</SRS>
+      <SRS>EPSG:4937</SRS>
+      <SRS>EPSG:4938</SRS>
+      <SRS>EPSG:4939</SRS>
+      <SRS>EPSG:4940</SRS>
+      <SRS>EPSG:4941</SRS>
+      <SRS>EPSG:4942</SRS>
+      <SRS>EPSG:4943</SRS>
+      <SRS>EPSG:4944</SRS>
+      <SRS>EPSG:4945</SRS>
+      <SRS>EPSG:4946</SRS>
+      <SRS>EPSG:4947</SRS>
+      <SRS>EPSG:4948</SRS>
+      <SRS>EPSG:4949</SRS>
+      <SRS>EPSG:4950</SRS>
+      <SRS>EPSG:4951</SRS>
+      <SRS>EPSG:4952</SRS>
+      <SRS>EPSG:4953</SRS>
+      <SRS>EPSG:4954</SRS>
+      <SRS>EPSG:4955</SRS>
+      <SRS>EPSG:4956</SRS>
+      <SRS>EPSG:4957</SRS>
+      <SRS>EPSG:4958</SRS>
+      <SRS>EPSG:4959</SRS>
+      <SRS>EPSG:4960</SRS>
+      <SRS>EPSG:4961</SRS>
+      <SRS>EPSG:4962</SRS>
+      <SRS>EPSG:4963</SRS>
+      <SRS>EPSG:4964</SRS>
+      <SRS>EPSG:4965</SRS>
+      <SRS>EPSG:4966</SRS>
+      <SRS>EPSG:4967</SRS>
+      <SRS>EPSG:4968</SRS>
+      <SRS>EPSG:4969</SRS>
+      <SRS>EPSG:4970</SRS>
+      <SRS>EPSG:4971</SRS>
+      <SRS>EPSG:4972</SRS>
+      <SRS>EPSG:4973</SRS>
+      <SRS>EPSG:4974</SRS>
+      <SRS>EPSG:4975</SRS>
+      <SRS>EPSG:4976</SRS>
+      <SRS>EPSG:4977</SRS>
+      <SRS>EPSG:4978</SRS>
+      <SRS>EPSG:4979</SRS>
+      <SRS>EPSG:4980</SRS>
+      <SRS>EPSG:4981</SRS>
+      <SRS>EPSG:4982</SRS>
+      <SRS>EPSG:4983</SRS>
+      <SRS>EPSG:4984</SRS>
+      <SRS>EPSG:4985</SRS>
+      <SRS>EPSG:4986</SRS>
+      <SRS>EPSG:4987</SRS>
+      <SRS>EPSG:4988</SRS>
+      <SRS>EPSG:4989</SRS>
+      <SRS>EPSG:4990</SRS>
+      <SRS>EPSG:4991</SRS>
+      <SRS>EPSG:4992</SRS>
+      <SRS>EPSG:4993</SRS>
+      <SRS>EPSG:4994</SRS>
+      <SRS>EPSG:4995</SRS>
+      <SRS>EPSG:4996</SRS>
+      <SRS>EPSG:4997</SRS>
+      <SRS>EPSG:4998</SRS>
+      <SRS>EPSG:4999</SRS>
+      <SRS>EPSG:5600</SRS>
+      <SRS>EPSG:5601</SRS>
+      <SRS>EPSG:5602</SRS>
+      <SRS>EPSG:5603</SRS>
+      <SRS>EPSG:5604</SRS>
+      <SRS>EPSG:5605</SRS>
+      <SRS>EPSG:5606</SRS>
+      <SRS>EPSG:5607</SRS>
+      <SRS>EPSG:5608</SRS>
+      <SRS>EPSG:5609</SRS>
+      <SRS>EPSG:5701</SRS>
+      <SRS>EPSG:5702</SRS>
+      <SRS>EPSG:5703</SRS>
+      <SRS>EPSG:5704</SRS>
+      <SRS>EPSG:5705</SRS>
+      <SRS>EPSG:5706</SRS>
+      <SRS>EPSG:5709</SRS>
+      <SRS>EPSG:5710</SRS>
+      <SRS>EPSG:5711</SRS>
+      <SRS>EPSG:5712</SRS>
+      <SRS>EPSG:5713</SRS>
+      <SRS>EPSG:5714</SRS>
+      <SRS>EPSG:5715</SRS>
+      <SRS>EPSG:5716</SRS>
+      <SRS>EPSG:5717</SRS>
+      <SRS>EPSG:5718</SRS>
+      <SRS>EPSG:5719</SRS>
+      <SRS>EPSG:5720</SRS>
+      <SRS>EPSG:5721</SRS>
+      <SRS>EPSG:5722</SRS>
+      <SRS>EPSG:5723</SRS>
+      <SRS>EPSG:5724</SRS>
+      <SRS>EPSG:5725</SRS>
+      <SRS>EPSG:5726</SRS>
+      <SRS>EPSG:5727</SRS>
+      <SRS>EPSG:5728</SRS>
+      <SRS>EPSG:5729</SRS>
+      <SRS>EPSG:5730</SRS>
+      <SRS>EPSG:5731</SRS>
+      <SRS>EPSG:5732</SRS>
+      <SRS>EPSG:5733</SRS>
+      <SRS>EPSG:5734</SRS>
+      <SRS>EPSG:5735</SRS>
+      <SRS>EPSG:5736</SRS>
+      <SRS>EPSG:5737</SRS>
+      <SRS>EPSG:5738</SRS>
+      <SRS>EPSG:5739</SRS>
+      <SRS>EPSG:5740</SRS>
+      <SRS>EPSG:5741</SRS>
+      <SRS>EPSG:5742</SRS>
+      <SRS>EPSG:5743</SRS>
+      <SRS>EPSG:5744</SRS>
+      <SRS>EPSG:5745</SRS>
+      <SRS>EPSG:5746</SRS>
+      <SRS>EPSG:5747</SRS>
+      <SRS>EPSG:5748</SRS>
+      <SRS>EPSG:5749</SRS>
+      <SRS>EPSG:5750</SRS>
+      <SRS>EPSG:5751</SRS>
+      <SRS>EPSG:5752</SRS>
+      <SRS>EPSG:5753</SRS>
+      <SRS>EPSG:5754</SRS>
+      <SRS>EPSG:5755</SRS>
+      <SRS>EPSG:5756</SRS>
+      <SRS>EPSG:5757</SRS>
+      <SRS>EPSG:5758</SRS>
+      <SRS>EPSG:5759</SRS>
+      <SRS>EPSG:5760</SRS>
+      <SRS>EPSG:5761</SRS>
+      <SRS>EPSG:5762</SRS>
+      <SRS>EPSG:5763</SRS>
+      <SRS>EPSG:5764</SRS>
+      <SRS>EPSG:5765</SRS>
+      <SRS>EPSG:5766</SRS>
+      <SRS>EPSG:5767</SRS>
+      <SRS>EPSG:5768</SRS>
+      <SRS>EPSG:5769</SRS>
+      <SRS>EPSG:5770</SRS>
+      <SRS>EPSG:5771</SRS>
+      <SRS>EPSG:5772</SRS>
+      <SRS>EPSG:5773</SRS>
+      <SRS>EPSG:5774</SRS>
+      <SRS>EPSG:5775</SRS>
+      <SRS>EPSG:5776</SRS>
+      <SRS>EPSG:5777</SRS>
+      <SRS>EPSG:5778</SRS>
+      <SRS>EPSG:5779</SRS>
+      <SRS>EPSG:5780</SRS>
+      <SRS>EPSG:5781</SRS>
+      <SRS>EPSG:5782</SRS>
+      <SRS>EPSG:5783</SRS>
+      <SRS>EPSG:5784</SRS>
+      <SRS>EPSG:5785</SRS>
+      <SRS>EPSG:5786</SRS>
+      <SRS>EPSG:5787</SRS>
+      <SRS>EPSG:5788</SRS>
+      <SRS>EPSG:5789</SRS>
+      <SRS>EPSG:5790</SRS>
+      <SRS>EPSG:5791</SRS>
+      <SRS>EPSG:5792</SRS>
+      <SRS>EPSG:5793</SRS>
+      <SRS>EPSG:5794</SRS>
+      <SRS>EPSG:5795</SRS>
+      <SRS>EPSG:5796</SRS>
+      <SRS>EPSG:5797</SRS>
+      <SRS>EPSG:5798</SRS>
+      <SRS>EPSG:5799</SRS>
+      <SRS>EPSG:5800</SRS>
+      <SRS>EPSG:5801</SRS>
+      <SRS>EPSG:5802</SRS>
+      <SRS>EPSG:5803</SRS>
+      <SRS>EPSG:5804</SRS>
+      <SRS>EPSG:5805</SRS>
+      <SRS>EPSG:5806</SRS>
+      <SRS>EPSG:5807</SRS>
+      <SRS>EPSG:5808</SRS>
+      <SRS>EPSG:5809</SRS>
+      <SRS>EPSG:5810</SRS>
+      <SRS>EPSG:5811</SRS>
+      <SRS>EPSG:5812</SRS>
+      <SRS>EPSG:5813</SRS>
+      <SRS>EPSG:5814</SRS>
+      <SRS>EPSG:5815</SRS>
+      <SRS>EPSG:5816</SRS>
+      <SRS>EPSG:5817</SRS>
+      <SRS>EPSG:5818</SRS>
+      <SRS>EPSG:7400</SRS>
+      <SRS>EPSG:7401</SRS>
+      <SRS>EPSG:7402</SRS>
+      <SRS>EPSG:7403</SRS>
+      <SRS>EPSG:7404</SRS>
+      <SRS>EPSG:7405</SRS>
+      <SRS>EPSG:7406</SRS>
+      <SRS>EPSG:7407</SRS>
+      <SRS>EPSG:7408</SRS>
+      <SRS>EPSG:7409</SRS>
+      <SRS>EPSG:7410</SRS>
+      <SRS>EPSG:7411</SRS>
+      <SRS>EPSG:7412</SRS>
+      <SRS>EPSG:7413</SRS>
+      <SRS>EPSG:7414</SRS>
+      <SRS>EPSG:7415</SRS>
+      <SRS>EPSG:7416</SRS>
+      <SRS>EPSG:7417</SRS>
+      <SRS>EPSG:7418</SRS>
+      <SRS>EPSG:7419</SRS>
+      <SRS>EPSG:7420</SRS>
+      <SRS>EPSG:20004</SRS>
+      <SRS>EPSG:20005</SRS>
+      <SRS>EPSG:20006</SRS>
+      <SRS>EPSG:20007</SRS>
+      <SRS>EPSG:20008</SRS>
+      <SRS>EPSG:20009</SRS>
+      <SRS>EPSG:20010</SRS>
+      <SRS>EPSG:20011</SRS>
+      <SRS>EPSG:20012</SRS>
+      <SRS>EPSG:20013</SRS>
+      <SRS>EPSG:20014</SRS>
+      <SRS>EPSG:20015</SRS>
+      <SRS>EPSG:20016</SRS>
+      <SRS>EPSG:20017</SRS>
+      <SRS>EPSG:20018</SRS>
+      <SRS>EPSG:20019</SRS>
+      <SRS>EPSG:20020</SRS>
+      <SRS>EPSG:20021</SRS>
+      <SRS>EPSG:20022</SRS>
+      <SRS>EPSG:20023</SRS>
+      <SRS>EPSG:20024</SRS>
+      <SRS>EPSG:20025</SRS>
+      <SRS>EPSG:20026</SRS>
+      <SRS>EPSG:20027</SRS>
+      <SRS>EPSG:20028</SRS>
+      <SRS>EPSG:20029</SRS>
+      <SRS>EPSG:20030</SRS>
+      <SRS>EPSG:20031</SRS>
+      <SRS>EPSG:20032</SRS>
+      <SRS>EPSG:20064</SRS>
+      <SRS>EPSG:20065</SRS>
+      <SRS>EPSG:20066</SRS>
+      <SRS>EPSG:20067</SRS>
+      <SRS>EPSG:20068</SRS>
+      <SRS>EPSG:20069</SRS>
+      <SRS>EPSG:20070</SRS>
+      <SRS>EPSG:20071</SRS>
+      <SRS>EPSG:20072</SRS>
+      <SRS>EPSG:20073</SRS>
+      <SRS>EPSG:20074</SRS>
+      <SRS>EPSG:20075</SRS>
+      <SRS>EPSG:20076</SRS>
+      <SRS>EPSG:20077</SRS>
+      <SRS>EPSG:20078</SRS>
+      <SRS>EPSG:20079</SRS>
+      <SRS>EPSG:20080</SRS>
+      <SRS>EPSG:20081</SRS>
+      <SRS>EPSG:20082</SRS>
+      <SRS>EPSG:20083</SRS>
+      <SRS>EPSG:20084</SRS>
+      <SRS>EPSG:20085</SRS>
+      <SRS>EPSG:20086</SRS>
+      <SRS>EPSG:20087</SRS>
+      <SRS>EPSG:20088</SRS>
+      <SRS>EPSG:20089</SRS>
+      <SRS>EPSG:20090</SRS>
+      <SRS>EPSG:20091</SRS>
+      <SRS>EPSG:20092</SRS>
+      <SRS>EPSG:20135</SRS>
+      <SRS>EPSG:20136</SRS>
+      <SRS>EPSG:20137</SRS>
+      <SRS>EPSG:20138</SRS>
+      <SRS>EPSG:20248</SRS>
+      <SRS>EPSG:20249</SRS>
+      <SRS>EPSG:20250</SRS>
+      <SRS>EPSG:20251</SRS>
+      <SRS>EPSG:20252</SRS>
+      <SRS>EPSG:20253</SRS>
+      <SRS>EPSG:20254</SRS>
+      <SRS>EPSG:20255</SRS>
+      <SRS>EPSG:20256</SRS>
+      <SRS>EPSG:20257</SRS>
+      <SRS>EPSG:20258</SRS>
+      <SRS>EPSG:20348</SRS>
+      <SRS>EPSG:20349</SRS>
+      <SRS>EPSG:20350</SRS>
+      <SRS>EPSG:20351</SRS>
+      <SRS>EPSG:20352</SRS>
+      <SRS>EPSG:20353</SRS>
+      <SRS>EPSG:20354</SRS>
+      <SRS>EPSG:20355</SRS>
+      <SRS>EPSG:20356</SRS>
+      <SRS>EPSG:20357</SRS>
+      <SRS>EPSG:20358</SRS>
+      <SRS>EPSG:20436</SRS>
+      <SRS>EPSG:20437</SRS>
+      <SRS>EPSG:20438</SRS>
+      <SRS>EPSG:20439</SRS>
+      <SRS>EPSG:20440</SRS>
+      <SRS>EPSG:20499</SRS>
+      <SRS>EPSG:20538</SRS>
+      <SRS>EPSG:20539</SRS>
+      <SRS>EPSG:20790</SRS>
+      <SRS>EPSG:20791</SRS>
+      <SRS>EPSG:20822</SRS>
+      <SRS>EPSG:20823</SRS>
+      <SRS>EPSG:20824</SRS>
+      <SRS>EPSG:20934</SRS>
+      <SRS>EPSG:20935</SRS>
+      <SRS>EPSG:20936</SRS>
+      <SRS>EPSG:21035</SRS>
+      <SRS>EPSG:21036</SRS>
+      <SRS>EPSG:21037</SRS>
+      <SRS>EPSG:21095</SRS>
+      <SRS>EPSG:21096</SRS>
+      <SRS>EPSG:21097</SRS>
+      <SRS>EPSG:21100</SRS>
+      <SRS>EPSG:21148</SRS>
+      <SRS>EPSG:21149</SRS>
+      <SRS>EPSG:21150</SRS>
+      <SRS>EPSG:21291</SRS>
+      <SRS>EPSG:21292</SRS>
+      <SRS>EPSG:21413</SRS>
+      <SRS>EPSG:21414</SRS>
+      <SRS>EPSG:21415</SRS>
+      <SRS>EPSG:21416</SRS>
+      <SRS>EPSG:21417</SRS>
+      <SRS>EPSG:21418</SRS>
+      <SRS>EPSG:21419</SRS>
+      <SRS>EPSG:21420</SRS>
+      <SRS>EPSG:21421</SRS>
+      <SRS>EPSG:21422</SRS>
+      <SRS>EPSG:21423</SRS>
+      <SRS>EPSG:21453</SRS>
+      <SRS>EPSG:21454</SRS>
+      <SRS>EPSG:21455</SRS>
+      <SRS>EPSG:21456</SRS>
+      <SRS>EPSG:21457</SRS>
+      <SRS>EPSG:21458</SRS>
+      <SRS>EPSG:21459</SRS>
+      <SRS>EPSG:21460</SRS>
+      <SRS>EPSG:21461</SRS>
+      <SRS>EPSG:21462</SRS>
+      <SRS>EPSG:21463</SRS>
+      <SRS>EPSG:21473</SRS>
+      <SRS>EPSG:21474</SRS>
+      <SRS>EPSG:21475</SRS>
+      <SRS>EPSG:21476</SRS>
+      <SRS>EPSG:21477</SRS>
+      <SRS>EPSG:21478</SRS>
+      <SRS>EPSG:21479</SRS>
+      <SRS>EPSG:21480</SRS>
+      <SRS>EPSG:21481</SRS>
+      <SRS>EPSG:21482</SRS>
+      <SRS>EPSG:21483</SRS>
+      <SRS>EPSG:21500</SRS>
+      <SRS>EPSG:21780</SRS>
+      <SRS>EPSG:21781</SRS>
+      <SRS>EPSG:21817</SRS>
+      <SRS>EPSG:21818</SRS>
+      <SRS>EPSG:21891</SRS>
+      <SRS>EPSG:21892</SRS>
+      <SRS>EPSG:21893</SRS>
+      <SRS>EPSG:21894</SRS>
+      <SRS>EPSG:21896</SRS>
+      <SRS>EPSG:21897</SRS>
+      <SRS>EPSG:21898</SRS>
+      <SRS>EPSG:21899</SRS>
+      <SRS>EPSG:22032</SRS>
+      <SRS>EPSG:22033</SRS>
+      <SRS>EPSG:22091</SRS>
+      <SRS>EPSG:22092</SRS>
+      <SRS>EPSG:22171</SRS>
+      <SRS>EPSG:22172</SRS>
+      <SRS>EPSG:22173</SRS>
+      <SRS>EPSG:22174</SRS>
+      <SRS>EPSG:22175</SRS>
+      <SRS>EPSG:22176</SRS>
+      <SRS>EPSG:22177</SRS>
+      <SRS>EPSG:22181</SRS>
+      <SRS>EPSG:22182</SRS>
+      <SRS>EPSG:22183</SRS>
+      <SRS>EPSG:22184</SRS>
+      <SRS>EPSG:22185</SRS>
+      <SRS>EPSG:22186</SRS>
+      <SRS>EPSG:22187</SRS>
+      <SRS>EPSG:22191</SRS>
+      <SRS>EPSG:22192</SRS>
+      <SRS>EPSG:22193</SRS>
+      <SRS>EPSG:22194</SRS>
+      <SRS>EPSG:22195</SRS>
+      <SRS>EPSG:22196</SRS>
+      <SRS>EPSG:22197</SRS>
+      <SRS>EPSG:22234</SRS>
+      <SRS>EPSG:22235</SRS>
+      <SRS>EPSG:22236</SRS>
+      <SRS>EPSG:22275</SRS>
+      <SRS>EPSG:22277</SRS>
+      <SRS>EPSG:22279</SRS>
+      <SRS>EPSG:22281</SRS>
+      <SRS>EPSG:22283</SRS>
+      <SRS>EPSG:22285</SRS>
+      <SRS>EPSG:22287</SRS>
+      <SRS>EPSG:22289</SRS>
+      <SRS>EPSG:22291</SRS>
+      <SRS>EPSG:22293</SRS>
+      <SRS>EPSG:22300</SRS>
+      <SRS>EPSG:22332</SRS>
+      <SRS>EPSG:22391</SRS>
+      <SRS>EPSG:22392</SRS>
+      <SRS>EPSG:22521</SRS>
+      <SRS>EPSG:22522</SRS>
+      <SRS>EPSG:22523</SRS>
+      <SRS>EPSG:22524</SRS>
+      <SRS>EPSG:22525</SRS>
+      <SRS>EPSG:22700</SRS>
+      <SRS>EPSG:22770</SRS>
+      <SRS>EPSG:22780</SRS>
+      <SRS>EPSG:22832</SRS>
+      <SRS>EPSG:22991</SRS>
+      <SRS>EPSG:22992</SRS>
+      <SRS>EPSG:22993</SRS>
+      <SRS>EPSG:22994</SRS>
+      <SRS>EPSG:23028</SRS>
+      <SRS>EPSG:23029</SRS>
+      <SRS>EPSG:23030</SRS>
+      <SRS>EPSG:23031</SRS>
+      <SRS>EPSG:23032</SRS>
+      <SRS>EPSG:23033</SRS>
+      <SRS>EPSG:23034</SRS>
+      <SRS>EPSG:23035</SRS>
+      <SRS>EPSG:23036</SRS>
+      <SRS>EPSG:23037</SRS>
+      <SRS>EPSG:23038</SRS>
+      <SRS>EPSG:23090</SRS>
+      <SRS>EPSG:23095</SRS>
+      <SRS>EPSG:23239</SRS>
+      <SRS>EPSG:23240</SRS>
+      <SRS>EPSG:23433</SRS>
+      <SRS>EPSG:23700</SRS>
+      <SRS>EPSG:23846</SRS>
+      <SRS>EPSG:23847</SRS>
+      <SRS>EPSG:23848</SRS>
+      <SRS>EPSG:23849</SRS>
+      <SRS>EPSG:23850</SRS>
+      <SRS>EPSG:23851</SRS>
+      <SRS>EPSG:23852</SRS>
+      <SRS>EPSG:23853</SRS>
+      <SRS>EPSG:23866</SRS>
+      <SRS>EPSG:23867</SRS>
+      <SRS>EPSG:23868</SRS>
+      <SRS>EPSG:23869</SRS>
+      <SRS>EPSG:23870</SRS>
+      <SRS>EPSG:23871</SRS>
+      <SRS>EPSG:23872</SRS>
+      <SRS>EPSG:23877</SRS>
+      <SRS>EPSG:23878</SRS>
+      <SRS>EPSG:23879</SRS>
+      <SRS>EPSG:23880</SRS>
+      <SRS>EPSG:23881</SRS>
+      <SRS>EPSG:23882</SRS>
+      <SRS>EPSG:23883</SRS>
+      <SRS>EPSG:23884</SRS>
+      <SRS>EPSG:23886</SRS>
+      <SRS>EPSG:23887</SRS>
+      <SRS>EPSG:23888</SRS>
+      <SRS>EPSG:23889</SRS>
+      <SRS>EPSG:23890</SRS>
+      <SRS>EPSG:23891</SRS>
+      <SRS>EPSG:23892</SRS>
+      <SRS>EPSG:23893</SRS>
+      <SRS>EPSG:23894</SRS>
+      <SRS>EPSG:23946</SRS>
+      <SRS>EPSG:23947</SRS>
+      <SRS>EPSG:23948</SRS>
+      <SRS>EPSG:24047</SRS>
+      <SRS>EPSG:24048</SRS>
+      <SRS>EPSG:24100</SRS>
+      <SRS>EPSG:24200</SRS>
+      <SRS>EPSG:24305</SRS>
+      <SRS>EPSG:24306</SRS>
+      <SRS>EPSG:24311</SRS>
+      <SRS>EPSG:24312</SRS>
+      <SRS>EPSG:24313</SRS>
+      <SRS>EPSG:24342</SRS>
+      <SRS>EPSG:24343</SRS>
+      <SRS>EPSG:24344</SRS>
+      <SRS>EPSG:24345</SRS>
+      <SRS>EPSG:24346</SRS>
+      <SRS>EPSG:24347</SRS>
+      <SRS>EPSG:24370</SRS>
+      <SRS>EPSG:24371</SRS>
+      <SRS>EPSG:24372</SRS>
+      <SRS>EPSG:24373</SRS>
+      <SRS>EPSG:24374</SRS>
+      <SRS>EPSG:24375</SRS>
+      <SRS>EPSG:24376</SRS>
+      <SRS>EPSG:24377</SRS>
+      <SRS>EPSG:24378</SRS>
+      <SRS>EPSG:24379</SRS>
+      <SRS>EPSG:24380</SRS>
+      <SRS>EPSG:24381</SRS>
+      <SRS>EPSG:24382</SRS>
+      <SRS>EPSG:24383</SRS>
+      <SRS>EPSG:24500</SRS>
+      <SRS>EPSG:24547</SRS>
+      <SRS>EPSG:24548</SRS>
+      <SRS>EPSG:24571</SRS>
+      <SRS>EPSG:24600</SRS>
+      <SRS>EPSG:24718</SRS>
+      <SRS>EPSG:24719</SRS>
+      <SRS>EPSG:24720</SRS>
+      <SRS>EPSG:24817</SRS>
+      <SRS>EPSG:24818</SRS>
+      <SRS>EPSG:24819</SRS>
+      <SRS>EPSG:24820</SRS>
+      <SRS>EPSG:24821</SRS>
+      <SRS>EPSG:24877</SRS>
+      <SRS>EPSG:24878</SRS>
+      <SRS>EPSG:24879</SRS>
+      <SRS>EPSG:24880</SRS>
+      <SRS>EPSG:24881</SRS>
+      <SRS>EPSG:24882</SRS>
+      <SRS>EPSG:24891</SRS>
+      <SRS>EPSG:24892</SRS>
+      <SRS>EPSG:24893</SRS>
+      <SRS>EPSG:25000</SRS>
+      <SRS>EPSG:25231</SRS>
+      <SRS>EPSG:25391</SRS>
+      <SRS>EPSG:25392</SRS>
+      <SRS>EPSG:25393</SRS>
+      <SRS>EPSG:25394</SRS>
+      <SRS>EPSG:25395</SRS>
+      <SRS>EPSG:25700</SRS>
+      <SRS>EPSG:25828</SRS>
+      <SRS>EPSG:25829</SRS>
+      <SRS>EPSG:25830</SRS>
+      <SRS>EPSG:25831</SRS>
+      <SRS>EPSG:25832</SRS>
+      <SRS>EPSG:25833</SRS>
+      <SRS>EPSG:25834</SRS>
+      <SRS>EPSG:25835</SRS>
+      <SRS>EPSG:25836</SRS>
+      <SRS>EPSG:25837</SRS>
+      <SRS>EPSG:25838</SRS>
+      <SRS>EPSG:25884</SRS>
+      <SRS>EPSG:25932</SRS>
+      <SRS>EPSG:26191</SRS>
+      <SRS>EPSG:26192</SRS>
+      <SRS>EPSG:26193</SRS>
+      <SRS>EPSG:26194</SRS>
+      <SRS>EPSG:26195</SRS>
+      <SRS>EPSG:26237</SRS>
+      <SRS>EPSG:26331</SRS>
+      <SRS>EPSG:26332</SRS>
+      <SRS>EPSG:26391</SRS>
+      <SRS>EPSG:26392</SRS>
+      <SRS>EPSG:26393</SRS>
+      <SRS>EPSG:26432</SRS>
+      <SRS>EPSG:26591</SRS>
+      <SRS>EPSG:26592</SRS>
+      <SRS>EPSG:26632</SRS>
+      <SRS>EPSG:26692</SRS>
+      <SRS>EPSG:26701</SRS>
+      <SRS>EPSG:26702</SRS>
+      <SRS>EPSG:26703</SRS>
+      <SRS>EPSG:26704</SRS>
+      <SRS>EPSG:26705</SRS>
+      <SRS>EPSG:26706</SRS>
+      <SRS>EPSG:26707</SRS>
+      <SRS>EPSG:26708</SRS>
+      <SRS>EPSG:26709</SRS>
+      <SRS>EPSG:26710</SRS>
+      <SRS>EPSG:26711</SRS>
+      <SRS>EPSG:26712</SRS>
+      <SRS>EPSG:26713</SRS>
+      <SRS>EPSG:26714</SRS>
+      <SRS>EPSG:26715</SRS>
+      <SRS>EPSG:26716</SRS>
+      <SRS>EPSG:26717</SRS>
+      <SRS>EPSG:26718</SRS>
+      <SRS>EPSG:26719</SRS>
+      <SRS>EPSG:26720</SRS>
+      <SRS>EPSG:26721</SRS>
+      <SRS>EPSG:26722</SRS>
+      <SRS>EPSG:26729</SRS>
+      <SRS>EPSG:26730</SRS>
+      <SRS>EPSG:26731</SRS>
+      <SRS>EPSG:26732</SRS>
+      <SRS>EPSG:26733</SRS>
+      <SRS>EPSG:26734</SRS>
+      <SRS>EPSG:26735</SRS>
+      <SRS>EPSG:26736</SRS>
+      <SRS>EPSG:26737</SRS>
+      <SRS>EPSG:26738</SRS>
+      <SRS>EPSG:26739</SRS>
+      <SRS>EPSG:26740</SRS>
+      <SRS>EPSG:26741</SRS>
+      <SRS>EPSG:26742</SRS>
+      <SRS>EPSG:26743</SRS>
+      <SRS>EPSG:26744</SRS>
+      <SRS>EPSG:26745</SRS>
+      <SRS>EPSG:26746</SRS>
+      <SRS>EPSG:26747</SRS>
+      <SRS>EPSG:26748</SRS>
+      <SRS>EPSG:26749</SRS>
+      <SRS>EPSG:26750</SRS>
+      <SRS>EPSG:26751</SRS>
+      <SRS>EPSG:26752</SRS>
+      <SRS>EPSG:26753</SRS>
+      <SRS>EPSG:26754</SRS>
+      <SRS>EPSG:26755</SRS>
+      <SRS>EPSG:26756</SRS>
+      <SRS>EPSG:26757</SRS>
+      <SRS>EPSG:26758</SRS>
+      <SRS>EPSG:26759</SRS>
+      <SRS>EPSG:26760</SRS>
+      <SRS>EPSG:26766</SRS>
+      <SRS>EPSG:26767</SRS>
+      <SRS>EPSG:26768</SRS>
+      <SRS>EPSG:26769</SRS>
+      <SRS>EPSG:26770</SRS>
+      <SRS>EPSG:26771</SRS>
+      <SRS>EPSG:26772</SRS>
+      <SRS>EPSG:26773</SRS>
+      <SRS>EPSG:26774</SRS>
+      <SRS>EPSG:26775</SRS>
+      <SRS>EPSG:26776</SRS>
+      <SRS>EPSG:26777</SRS>
+      <SRS>EPSG:26778</SRS>
+      <SRS>EPSG:26779</SRS>
+      <SRS>EPSG:26780</SRS>
+      <SRS>EPSG:26781</SRS>
+      <SRS>EPSG:26782</SRS>
+      <SRS>EPSG:26783</SRS>
+      <SRS>EPSG:26784</SRS>
+      <SRS>EPSG:26785</SRS>
+      <SRS>EPSG:26786</SRS>
+      <SRS>EPSG:26787</SRS>
+      <SRS>EPSG:26791</SRS>
+      <SRS>EPSG:26792</SRS>
+      <SRS>EPSG:26793</SRS>
+      <SRS>EPSG:26794</SRS>
+      <SRS>EPSG:26795</SRS>
+      <SRS>EPSG:26796</SRS>
+      <SRS>EPSG:26797</SRS>
+      <SRS>EPSG:26798</SRS>
+      <SRS>EPSG:26799</SRS>
+      <SRS>EPSG:26801</SRS>
+      <SRS>EPSG:26802</SRS>
+      <SRS>EPSG:26803</SRS>
+      <SRS>EPSG:26811</SRS>
+      <SRS>EPSG:26812</SRS>
+      <SRS>EPSG:26813</SRS>
+      <SRS>EPSG:26901</SRS>
+      <SRS>EPSG:26902</SRS>
+      <SRS>EPSG:26903</SRS>
+      <SRS>EPSG:26904</SRS>
+      <SRS>EPSG:26905</SRS>
+      <SRS>EPSG:26906</SRS>
+      <SRS>EPSG:26907</SRS>
+      <SRS>EPSG:26908</SRS>
+      <SRS>EPSG:26909</SRS>
+      <SRS>EPSG:26910</SRS>
+      <SRS>EPSG:26911</SRS>
+      <SRS>EPSG:26912</SRS>
+      <SRS>EPSG:26913</SRS>
+      <SRS>EPSG:26914</SRS>
+      <SRS>EPSG:26915</SRS>
+      <SRS>EPSG:26916</SRS>
+      <SRS>EPSG:26917</SRS>
+      <SRS>EPSG:26918</SRS>
+      <SRS>EPSG:26919</SRS>
+      <SRS>EPSG:26920</SRS>
+      <SRS>EPSG:26921</SRS>
+      <SRS>EPSG:26922</SRS>
+      <SRS>EPSG:26923</SRS>
+      <SRS>EPSG:26929</SRS>
+      <SRS>EPSG:26930</SRS>
+      <SRS>EPSG:26931</SRS>
+      <SRS>EPSG:26932</SRS>
+      <SRS>EPSG:26933</SRS>
+      <SRS>EPSG:26934</SRS>
+      <SRS>EPSG:26935</SRS>
+      <SRS>EPSG:26936</SRS>
+      <SRS>EPSG:26937</SRS>
+      <SRS>EPSG:26938</SRS>
+      <SRS>EPSG:26939</SRS>
+      <SRS>EPSG:26940</SRS>
+      <SRS>EPSG:26941</SRS>
+      <SRS>EPSG:26942</SRS>
+      <SRS>EPSG:26943</SRS>
+      <SRS>EPSG:26944</SRS>
+      <SRS>EPSG:26945</SRS>
+      <SRS>EPSG:26946</SRS>
+      <SRS>EPSG:26948</SRS>
+      <SRS>EPSG:26949</SRS>
+      <SRS>EPSG:26950</SRS>
+      <SRS>EPSG:26951</SRS>
+      <SRS>EPSG:26952</SRS>
+      <SRS>EPSG:26953</SRS>
+      <SRS>EPSG:26954</SRS>
+      <SRS>EPSG:26955</SRS>
+      <SRS>EPSG:26956</SRS>
+      <SRS>EPSG:26957</SRS>
+      <SRS>EPSG:26958</SRS>
+      <SRS>EPSG:26959</SRS>
+      <SRS>EPSG:26960</SRS>
+      <SRS>EPSG:26961</SRS>
+      <SRS>EPSG:26962</SRS>
+      <SRS>EPSG:26963</SRS>
+      <SRS>EPSG:26964</SRS>
+      <SRS>EPSG:26965</SRS>
+      <SRS>EPSG:26966</SRS>
+      <SRS>EPSG:26967</SRS>
+      <SRS>EPSG:26968</SRS>
+      <SRS>EPSG:26969</SRS>
+      <SRS>EPSG:26970</SRS>
+      <SRS>EPSG:26971</SRS>
+      <SRS>EPSG:26972</SRS>
+      <SRS>EPSG:26973</SRS>
+      <SRS>EPSG:26974</SRS>
+      <SRS>EPSG:26975</SRS>
+      <SRS>EPSG:26976</SRS>
+      <SRS>EPSG:26977</SRS>
+      <SRS>EPSG:26978</SRS>
+      <SRS>EPSG:26979</SRS>
+      <SRS>EPSG:26980</SRS>
+      <SRS>EPSG:26981</SRS>
+      <SRS>EPSG:26982</SRS>
+      <SRS>EPSG:26983</SRS>
+      <SRS>EPSG:26984</SRS>
+      <SRS>EPSG:26985</SRS>
+      <SRS>EPSG:26986</SRS>
+      <SRS>EPSG:26987</SRS>
+      <SRS>EPSG:26988</SRS>
+      <SRS>EPSG:26989</SRS>
+      <SRS>EPSG:26990</SRS>
+      <SRS>EPSG:26991</SRS>
+      <SRS>EPSG:26992</SRS>
+      <SRS>EPSG:26993</SRS>
+      <SRS>EPSG:26994</SRS>
+      <SRS>EPSG:26995</SRS>
+      <SRS>EPSG:26996</SRS>
+      <SRS>EPSG:26997</SRS>
+      <SRS>EPSG:26998</SRS>
+      <SRS>EPSG:27037</SRS>
+      <SRS>EPSG:27038</SRS>
+      <SRS>EPSG:27039</SRS>
+      <SRS>EPSG:27040</SRS>
+      <SRS>EPSG:27120</SRS>
+      <SRS>EPSG:27200</SRS>
+      <SRS>EPSG:27205</SRS>
+      <SRS>EPSG:27206</SRS>
+      <SRS>EPSG:27207</SRS>
+      <SRS>EPSG:27208</SRS>
+      <SRS>EPSG:27209</SRS>
+      <SRS>EPSG:27210</SRS>
+      <SRS>EPSG:27211</SRS>
+      <SRS>EPSG:27212</SRS>
+      <SRS>EPSG:27213</SRS>
+      <SRS>EPSG:27214</SRS>
+      <SRS>EPSG:27215</SRS>
+      <SRS>EPSG:27216</SRS>
+      <SRS>EPSG:27217</SRS>
+      <SRS>EPSG:27218</SRS>
+      <SRS>EPSG:27219</SRS>
+      <SRS>EPSG:27220</SRS>
+      <SRS>EPSG:27221</SRS>
+      <SRS>EPSG:27222</SRS>
+      <SRS>EPSG:27223</SRS>
+      <SRS>EPSG:27224</SRS>
+      <SRS>EPSG:27225</SRS>
+      <SRS>EPSG:27226</SRS>
+      <SRS>EPSG:27227</SRS>
+      <SRS>EPSG:27228</SRS>
+      <SRS>EPSG:27229</SRS>
+      <SRS>EPSG:27230</SRS>
+      <SRS>EPSG:27231</SRS>
+      <SRS>EPSG:27232</SRS>
+      <SRS>EPSG:27258</SRS>
+      <SRS>EPSG:27259</SRS>
+      <SRS>EPSG:27260</SRS>
+      <SRS>EPSG:27291</SRS>
+      <SRS>EPSG:27292</SRS>
+      <SRS>EPSG:27391</SRS>
+      <SRS>EPSG:27392</SRS>
+      <SRS>EPSG:27393</SRS>
+      <SRS>EPSG:27394</SRS>
+      <SRS>EPSG:27395</SRS>
+      <SRS>EPSG:27396</SRS>
+      <SRS>EPSG:27397</SRS>
+      <SRS>EPSG:27398</SRS>
+      <SRS>EPSG:27429</SRS>
+      <SRS>EPSG:27492</SRS>
+      <SRS>EPSG:27500</SRS>
+      <SRS>EPSG:27561</SRS>
+      <SRS>EPSG:27562</SRS>
+      <SRS>EPSG:27563</SRS>
+      <SRS>EPSG:27564</SRS>
+      <SRS>EPSG:27571</SRS>
+      <SRS>EPSG:27572</SRS>
+      <SRS>EPSG:27573</SRS>
+      <SRS>EPSG:27574</SRS>
+      <SRS>EPSG:27581</SRS>
+      <SRS>EPSG:27582</SRS>
+      <SRS>EPSG:27583</SRS>
+      <SRS>EPSG:27584</SRS>
+      <SRS>EPSG:27591</SRS>
+      <SRS>EPSG:27592</SRS>
+      <SRS>EPSG:27593</SRS>
+      <SRS>EPSG:27594</SRS>
+      <SRS>EPSG:27700</SRS>
+      <SRS>EPSG:28191</SRS>
+      <SRS>EPSG:28192</SRS>
+      <SRS>EPSG:28193</SRS>
+      <SRS>EPSG:28232</SRS>
+      <SRS>EPSG:28348</SRS>
+      <SRS>EPSG:28349</SRS>
+      <SRS>EPSG:28350</SRS>
+      <SRS>EPSG:28351</SRS>
+      <SRS>EPSG:28352</SRS>
+      <SRS>EPSG:28353</SRS>
+      <SRS>EPSG:28354</SRS>
+      <SRS>EPSG:28355</SRS>
+      <SRS>EPSG:28356</SRS>
+      <SRS>EPSG:28357</SRS>
+      <SRS>EPSG:28358</SRS>
+      <SRS>EPSG:28402</SRS>
+      <SRS>EPSG:28403</SRS>
+      <SRS>EPSG:28404</SRS>
+      <SRS>EPSG:28405</SRS>
+      <SRS>EPSG:28406</SRS>
+      <SRS>EPSG:28407</SRS>
+      <SRS>EPSG:28408</SRS>
+      <SRS>EPSG:28409</SRS>
+      <SRS>EPSG:28410</SRS>
+      <SRS>EPSG:28411</SRS>
+      <SRS>EPSG:28412</SRS>
+      <SRS>EPSG:28413</SRS>
+      <SRS>EPSG:28414</SRS>
+      <SRS>EPSG:28415</SRS>
+      <SRS>EPSG:28416</SRS>
+      <SRS>EPSG:28417</SRS>
+      <SRS>EPSG:28418</SRS>
+      <SRS>EPSG:28419</SRS>
+      <SRS>EPSG:28420</SRS>
+      <SRS>EPSG:28421</SRS>
+      <SRS>EPSG:28422</SRS>
+      <SRS>EPSG:28423</SRS>
+      <SRS>EPSG:28424</SRS>
+      <SRS>EPSG:28425</SRS>
+      <SRS>EPSG:28426</SRS>
+      <SRS>EPSG:28427</SRS>
+      <SRS>EPSG:28428</SRS>
+      <SRS>EPSG:28429</SRS>
+      <SRS>EPSG:28430</SRS>
+      <SRS>EPSG:28431</SRS>
+      <SRS>EPSG:28432</SRS>
+      <SRS>EPSG:28462</SRS>
+      <SRS>EPSG:28463</SRS>
+      <SRS>EPSG:28464</SRS>
+      <SRS>EPSG:28465</SRS>
+      <SRS>EPSG:28466</SRS>
+      <SRS>EPSG:28467</SRS>
+      <SRS>EPSG:28468</SRS>
+      <SRS>EPSG:28469</SRS>
+      <SRS>EPSG:28470</SRS>
+      <SRS>EPSG:28471</SRS>
+      <SRS>EPSG:28472</SRS>
+      <SRS>EPSG:28473</SRS>
+      <SRS>EPSG:28474</SRS>
+      <SRS>EPSG:28475</SRS>
+      <SRS>EPSG:28476</SRS>
+      <SRS>EPSG:28477</SRS>
+      <SRS>EPSG:28478</SRS>
+      <SRS>EPSG:28479</SRS>
+      <SRS>EPSG:28480</SRS>
+      <SRS>EPSG:28481</SRS>
+      <SRS>EPSG:28482</SRS>
+      <SRS>EPSG:28483</SRS>
+      <SRS>EPSG:28484</SRS>
+      <SRS>EPSG:28485</SRS>
+      <SRS>EPSG:28486</SRS>
+      <SRS>EPSG:28487</SRS>
+      <SRS>EPSG:28488</SRS>
+      <SRS>EPSG:28489</SRS>
+      <SRS>EPSG:28490</SRS>
+      <SRS>EPSG:28491</SRS>
+      <SRS>EPSG:28492</SRS>
+      <SRS>EPSG:28600</SRS>
+      <SRS>EPSG:28991</SRS>
+      <SRS>EPSG:28992</SRS>
+      <SRS>EPSG:29100</SRS>
+      <SRS>EPSG:29101</SRS>
+      <SRS>EPSG:29118</SRS>
+      <SRS>EPSG:29119</SRS>
+      <SRS>EPSG:29120</SRS>
+      <SRS>EPSG:29121</SRS>
+      <SRS>EPSG:29122</SRS>
+      <SRS>EPSG:29168</SRS>
+      <SRS>EPSG:29169</SRS>
+      <SRS>EPSG:29170</SRS>
+      <SRS>EPSG:29171</SRS>
+      <SRS>EPSG:29172</SRS>
+      <SRS>EPSG:29177</SRS>
+      <SRS>EPSG:29178</SRS>
+      <SRS>EPSG:29179</SRS>
+      <SRS>EPSG:29180</SRS>
+      <SRS>EPSG:29181</SRS>
+      <SRS>EPSG:29182</SRS>
+      <SRS>EPSG:29183</SRS>
+      <SRS>EPSG:29184</SRS>
+      <SRS>EPSG:29185</SRS>
+      <SRS>EPSG:29187</SRS>
+      <SRS>EPSG:29188</SRS>
+      <SRS>EPSG:29189</SRS>
+      <SRS>EPSG:29190</SRS>
+      <SRS>EPSG:29191</SRS>
+      <SRS>EPSG:29192</SRS>
+      <SRS>EPSG:29193</SRS>
+      <SRS>EPSG:29194</SRS>
+      <SRS>EPSG:29195</SRS>
+      <SRS>EPSG:29220</SRS>
+      <SRS>EPSG:29221</SRS>
+      <SRS>EPSG:29333</SRS>
+      <SRS>EPSG:29371</SRS>
+      <SRS>EPSG:29373</SRS>
+      <SRS>EPSG:29375</SRS>
+      <SRS>EPSG:29377</SRS>
+      <SRS>EPSG:29379</SRS>
+      <SRS>EPSG:29381</SRS>
+      <SRS>EPSG:29383</SRS>
+      <SRS>EPSG:29385</SRS>
+      <SRS>EPSG:29635</SRS>
+      <SRS>EPSG:29636</SRS>
+      <SRS>EPSG:29700</SRS>
+      <SRS>EPSG:29701</SRS>
+      <SRS>EPSG:29702</SRS>
+      <SRS>EPSG:29738</SRS>
+      <SRS>EPSG:29739</SRS>
+      <SRS>EPSG:29849</SRS>
+      <SRS>EPSG:29850</SRS>
+      <SRS>EPSG:29871</SRS>
+      <SRS>EPSG:29872</SRS>
+      <SRS>EPSG:29873</SRS>
+      <SRS>EPSG:29900</SRS>
+      <SRS>EPSG:29901</SRS>
+      <SRS>EPSG:29902</SRS>
+      <SRS>EPSG:29903</SRS>
+      <SRS>EPSG:30161</SRS>
+      <SRS>EPSG:30162</SRS>
+      <SRS>EPSG:30163</SRS>
+      <SRS>EPSG:30164</SRS>
+      <SRS>EPSG:30165</SRS>
+      <SRS>EPSG:30166</SRS>
+      <SRS>EPSG:30167</SRS>
+      <SRS>EPSG:30168</SRS>
+      <SRS>EPSG:30169</SRS>
+      <SRS>EPSG:30170</SRS>
+      <SRS>EPSG:30171</SRS>
+      <SRS>EPSG:30172</SRS>
+      <SRS>EPSG:30173</SRS>
+      <SRS>EPSG:30174</SRS>
+      <SRS>EPSG:30175</SRS>
+      <SRS>EPSG:30176</SRS>
+      <SRS>EPSG:30177</SRS>
+      <SRS>EPSG:30178</SRS>
+      <SRS>EPSG:30179</SRS>
+      <SRS>EPSG:30200</SRS>
+      <SRS>EPSG:30339</SRS>
+      <SRS>EPSG:30340</SRS>
+      <SRS>EPSG:30491</SRS>
+      <SRS>EPSG:30492</SRS>
+      <SRS>EPSG:30493</SRS>
+      <SRS>EPSG:30494</SRS>
+      <SRS>EPSG:30729</SRS>
+      <SRS>EPSG:30730</SRS>
+      <SRS>EPSG:30731</SRS>
+      <SRS>EPSG:30732</SRS>
+      <SRS>EPSG:30791</SRS>
+      <SRS>EPSG:30792</SRS>
+      <SRS>EPSG:30800</SRS>
+      <SRS>EPSG:31028</SRS>
+      <SRS>EPSG:31121</SRS>
+      <SRS>EPSG:31154</SRS>
+      <SRS>EPSG:31170</SRS>
+      <SRS>EPSG:31171</SRS>
+      <SRS>EPSG:31251</SRS>
+      <SRS>EPSG:31252</SRS>
+      <SRS>EPSG:31253</SRS>
+      <SRS>EPSG:31254</SRS>
+      <SRS>EPSG:31255</SRS>
+      <SRS>EPSG:31256</SRS>
+      <SRS>EPSG:31257</SRS>
+      <SRS>EPSG:31258</SRS>
+      <SRS>EPSG:31259</SRS>
+      <SRS>EPSG:31265</SRS>
+      <SRS>EPSG:31266</SRS>
+      <SRS>EPSG:31267</SRS>
+      <SRS>EPSG:31268</SRS>
+      <SRS>EPSG:31275</SRS>
+      <SRS>EPSG:31276</SRS>
+      <SRS>EPSG:31277</SRS>
+      <SRS>EPSG:31278</SRS>
+      <SRS>EPSG:31279</SRS>
+      <SRS>EPSG:31281</SRS>
+      <SRS>EPSG:31282</SRS>
+      <SRS>EPSG:31283</SRS>
+      <SRS>EPSG:31284</SRS>
+      <SRS>EPSG:31285</SRS>
+      <SRS>EPSG:31286</SRS>
+      <SRS>EPSG:31287</SRS>
+      <SRS>EPSG:31288</SRS>
+      <SRS>EPSG:31289</SRS>
+      <SRS>EPSG:31290</SRS>
+      <SRS>EPSG:31291</SRS>
+      <SRS>EPSG:31292</SRS>
+      <SRS>EPSG:31293</SRS>
+      <SRS>EPSG:31294</SRS>
+      <SRS>EPSG:31295</SRS>
+      <SRS>EPSG:31296</SRS>
+      <SRS>EPSG:31297</SRS>
+      <SRS>EPSG:31300</SRS>
+      <SRS>EPSG:31370</SRS>
+      <SRS>EPSG:31461</SRS>
+      <SRS>EPSG:31462</SRS>
+      <SRS>EPSG:31463</SRS>
+      <SRS>EPSG:31464</SRS>
+      <SRS>EPSG:31465</SRS>
+      <SRS>EPSG:31466</SRS>
+      <SRS>EPSG:31467</SRS>
+      <SRS>EPSG:31468</SRS>
+      <SRS>EPSG:31469</SRS>
+      <SRS>EPSG:31528</SRS>
+      <SRS>EPSG:31529</SRS>
+      <SRS>EPSG:31600</SRS>
+      <SRS>EPSG:31700</SRS>
+      <SRS>EPSG:31838</SRS>
+      <SRS>EPSG:31839</SRS>
+      <SRS>EPSG:31900</SRS>
+      <SRS>EPSG:31901</SRS>
+      <SRS>EPSG:31965</SRS>
+      <SRS>EPSG:31966</SRS>
+      <SRS>EPSG:31967</SRS>
+      <SRS>EPSG:31968</SRS>
+      <SRS>EPSG:31969</SRS>
+      <SRS>EPSG:31970</SRS>
+      <SRS>EPSG:31971</SRS>
+      <SRS>EPSG:31972</SRS>
+      <SRS>EPSG:31973</SRS>
+      <SRS>EPSG:31974</SRS>
+      <SRS>EPSG:31975</SRS>
+      <SRS>EPSG:31976</SRS>
+      <SRS>EPSG:31977</SRS>
+      <SRS>EPSG:31978</SRS>
+      <SRS>EPSG:31979</SRS>
+      <SRS>EPSG:31980</SRS>
+      <SRS>EPSG:31981</SRS>
+      <SRS>EPSG:31982</SRS>
+      <SRS>EPSG:31983</SRS>
+      <SRS>EPSG:31984</SRS>
+      <SRS>EPSG:31985</SRS>
+      <SRS>EPSG:31986</SRS>
+      <SRS>EPSG:31987</SRS>
+      <SRS>EPSG:31988</SRS>
+      <SRS>EPSG:31989</SRS>
+      <SRS>EPSG:31990</SRS>
+      <SRS>EPSG:31991</SRS>
+      <SRS>EPSG:31992</SRS>
+      <SRS>EPSG:31993</SRS>
+      <SRS>EPSG:31994</SRS>
+      <SRS>EPSG:31995</SRS>
+      <SRS>EPSG:31996</SRS>
+      <SRS>EPSG:31997</SRS>
+      <SRS>EPSG:31998</SRS>
+      <SRS>EPSG:31999</SRS>
+      <SRS>EPSG:32000</SRS>
+      <SRS>EPSG:32001</SRS>
+      <SRS>EPSG:32002</SRS>
+      <SRS>EPSG:32003</SRS>
+      <SRS>EPSG:32005</SRS>
+      <SRS>EPSG:32006</SRS>
+      <SRS>EPSG:32007</SRS>
+      <SRS>EPSG:32008</SRS>
+      <SRS>EPSG:32009</SRS>
+      <SRS>EPSG:32010</SRS>
+      <SRS>EPSG:32011</SRS>
+      <SRS>EPSG:32012</SRS>
+      <SRS>EPSG:32013</SRS>
+      <SRS>EPSG:32014</SRS>
+      <SRS>EPSG:32015</SRS>
+      <SRS>EPSG:32016</SRS>
+      <SRS>EPSG:32017</SRS>
+      <SRS>EPSG:32018</SRS>
+      <SRS>EPSG:32019</SRS>
+      <SRS>EPSG:32020</SRS>
+      <SRS>EPSG:32021</SRS>
+      <SRS>EPSG:32022</SRS>
+      <SRS>EPSG:32023</SRS>
+      <SRS>EPSG:32024</SRS>
+      <SRS>EPSG:32025</SRS>
+      <SRS>EPSG:32026</SRS>
+      <SRS>EPSG:32027</SRS>
+      <SRS>EPSG:32028</SRS>
+      <SRS>EPSG:32029</SRS>
+      <SRS>EPSG:32030</SRS>
+      <SRS>EPSG:32031</SRS>
+      <SRS>EPSG:32033</SRS>
+      <SRS>EPSG:32034</SRS>
+      <SRS>EPSG:32035</SRS>
+      <SRS>EPSG:32036</SRS>
+      <SRS>EPSG:32037</SRS>
+      <SRS>EPSG:32038</SRS>
+      <SRS>EPSG:32039</SRS>
+      <SRS>EPSG:32040</SRS>
+      <SRS>EPSG:32041</SRS>
+      <SRS>EPSG:32042</SRS>
+      <SRS>EPSG:32043</SRS>
+      <SRS>EPSG:32044</SRS>
+      <SRS>EPSG:32045</SRS>
+      <SRS>EPSG:32046</SRS>
+      <SRS>EPSG:32047</SRS>
+      <SRS>EPSG:32048</SRS>
+      <SRS>EPSG:32049</SRS>
+      <SRS>EPSG:32050</SRS>
+      <SRS>EPSG:32051</SRS>
+      <SRS>EPSG:32052</SRS>
+      <SRS>EPSG:32053</SRS>
+      <SRS>EPSG:32054</SRS>
+      <SRS>EPSG:32055</SRS>
+      <SRS>EPSG:32056</SRS>
+      <SRS>EPSG:32057</SRS>
+      <SRS>EPSG:32058</SRS>
+      <SRS>EPSG:32061</SRS>
+      <SRS>EPSG:32062</SRS>
+      <SRS>EPSG:32064</SRS>
+      <SRS>EPSG:32065</SRS>
+      <SRS>EPSG:32066</SRS>
+      <SRS>EPSG:32067</SRS>
+      <SRS>EPSG:32074</SRS>
+      <SRS>EPSG:32075</SRS>
+      <SRS>EPSG:32076</SRS>
+      <SRS>EPSG:32077</SRS>
+      <SRS>EPSG:32081</SRS>
+      <SRS>EPSG:32082</SRS>
+      <SRS>EPSG:32083</SRS>
+      <SRS>EPSG:32084</SRS>
+      <SRS>EPSG:32085</SRS>
+      <SRS>EPSG:32086</SRS>
+      <SRS>EPSG:32098</SRS>
+      <SRS>EPSG:32099</SRS>
+      <SRS>EPSG:32100</SRS>
+      <SRS>EPSG:32104</SRS>
+      <SRS>EPSG:32107</SRS>
+      <SRS>EPSG:32108</SRS>
+      <SRS>EPSG:32109</SRS>
+      <SRS>EPSG:32110</SRS>
+      <SRS>EPSG:32111</SRS>
+      <SRS>EPSG:32112</SRS>
+      <SRS>EPSG:32113</SRS>
+      <SRS>EPSG:32114</SRS>
+      <SRS>EPSG:32115</SRS>
+      <SRS>EPSG:32116</SRS>
+      <SRS>EPSG:32117</SRS>
+      <SRS>EPSG:32118</SRS>
+      <SRS>EPSG:32119</SRS>
+      <SRS>EPSG:32120</SRS>
+      <SRS>EPSG:32121</SRS>
+      <SRS>EPSG:32122</SRS>
+      <SRS>EPSG:32123</SRS>
+      <SRS>EPSG:32124</SRS>
+      <SRS>EPSG:32125</SRS>
+      <SRS>EPSG:32126</SRS>
+      <SRS>EPSG:32127</SRS>
+      <SRS>EPSG:32128</SRS>
+      <SRS>EPSG:32129</SRS>
+      <SRS>EPSG:32130</SRS>
+      <SRS>EPSG:32133</SRS>
+      <SRS>EPSG:32134</SRS>
+      <SRS>EPSG:32135</SRS>
+      <SRS>EPSG:32136</SRS>
+      <SRS>EPSG:32137</SRS>
+      <SRS>EPSG:32138</SRS>
+      <SRS>EPSG:32139</SRS>
+      <SRS>EPSG:32140</SRS>
+      <SRS>EPSG:32141</SRS>
+      <SRS>EPSG:32142</SRS>
+      <SRS>EPSG:32143</SRS>
+      <SRS>EPSG:32144</SRS>
+      <SRS>EPSG:32145</SRS>
+      <SRS>EPSG:32146</SRS>
+      <SRS>EPSG:32147</SRS>
+      <SRS>EPSG:32148</SRS>
+      <SRS>EPSG:32149</SRS>
+      <SRS>EPSG:32150</SRS>
+      <SRS>EPSG:32151</SRS>
+      <SRS>EPSG:32152</SRS>
+      <SRS>EPSG:32153</SRS>
+      <SRS>EPSG:32154</SRS>
+      <SRS>EPSG:32155</SRS>
+      <SRS>EPSG:32156</SRS>
+      <SRS>EPSG:32157</SRS>
+      <SRS>EPSG:32158</SRS>
+      <SRS>EPSG:32161</SRS>
+      <SRS>EPSG:32164</SRS>
+      <SRS>EPSG:32165</SRS>
+      <SRS>EPSG:32166</SRS>
+      <SRS>EPSG:32167</SRS>
+      <SRS>EPSG:32180</SRS>
+      <SRS>EPSG:32181</SRS>
+      <SRS>EPSG:32182</SRS>
+      <SRS>EPSG:32183</SRS>
+      <SRS>EPSG:32184</SRS>
+      <SRS>EPSG:32185</SRS>
+      <SRS>EPSG:32186</SRS>
+      <SRS>EPSG:32187</SRS>
+      <SRS>EPSG:32188</SRS>
+      <SRS>EPSG:32189</SRS>
+      <SRS>EPSG:32190</SRS>
+      <SRS>EPSG:32191</SRS>
+      <SRS>EPSG:32192</SRS>
+      <SRS>EPSG:32193</SRS>
+      <SRS>EPSG:32194</SRS>
+      <SRS>EPSG:32195</SRS>
+      <SRS>EPSG:32196</SRS>
+      <SRS>EPSG:32197</SRS>
+      <SRS>EPSG:32198</SRS>
+      <SRS>EPSG:32199</SRS>
+      <SRS>EPSG:32201</SRS>
+      <SRS>EPSG:32202</SRS>
+      <SRS>EPSG:32203</SRS>
+      <SRS>EPSG:32204</SRS>
+      <SRS>EPSG:32205</SRS>
+      <SRS>EPSG:32206</SRS>
+      <SRS>EPSG:32207</SRS>
+      <SRS>EPSG:32208</SRS>
+      <SRS>EPSG:32209</SRS>
+      <SRS>EPSG:32210</SRS>
+      <SRS>EPSG:32211</SRS>
+      <SRS>EPSG:32212</SRS>
+      <SRS>EPSG:32213</SRS>
+      <SRS>EPSG:32214</SRS>
+      <SRS>EPSG:32215</SRS>
+      <SRS>EPSG:32216</SRS>
+      <SRS>EPSG:32217</SRS>
+      <SRS>EPSG:32218</SRS>
+      <SRS>EPSG:32219</SRS>
+      <SRS>EPSG:32220</SRS>
+      <SRS>EPSG:32221</SRS>
+      <SRS>EPSG:32222</SRS>
+      <SRS>EPSG:32223</SRS>
+      <SRS>EPSG:32224</SRS>
+      <SRS>EPSG:32225</SRS>
+      <SRS>EPSG:32226</SRS>
+      <SRS>EPSG:32227</SRS>
+      <SRS>EPSG:32228</SRS>
+      <SRS>EPSG:32229</SRS>
+      <SRS>EPSG:32230</SRS>
+      <SRS>EPSG:32231</SRS>
+      <SRS>EPSG:32232</SRS>
+      <SRS>EPSG:32233</SRS>
+      <SRS>EPSG:32234</SRS>
+      <SRS>EPSG:32235</SRS>
+      <SRS>EPSG:32236</SRS>
+      <SRS>EPSG:32237</SRS>
+      <SRS>EPSG:32238</SRS>
+      <SRS>EPSG:32239</SRS>
+      <SRS>EPSG:32240</SRS>
+      <SRS>EPSG:32241</SRS>
+      <SRS>EPSG:32242</SRS>
+      <SRS>EPSG:32243</SRS>
+      <SRS>EPSG:32244</SRS>
+      <SRS>EPSG:32245</SRS>
+      <SRS>EPSG:32246</SRS>
+      <SRS>EPSG:32247</SRS>
+      <SRS>EPSG:32248</SRS>
+      <SRS>EPSG:32249</SRS>
+      <SRS>EPSG:32250</SRS>
+      <SRS>EPSG:32251</SRS>
+      <SRS>EPSG:32252</SRS>
+      <SRS>EPSG:32253</SRS>
+      <SRS>EPSG:32254</SRS>
+      <SRS>EPSG:32255</SRS>
+      <SRS>EPSG:32256</SRS>
+      <SRS>EPSG:32257</SRS>
+      <SRS>EPSG:32258</SRS>
+      <SRS>EPSG:32259</SRS>
+      <SRS>EPSG:32260</SRS>
+      <SRS>EPSG:32301</SRS>
+      <SRS>EPSG:32302</SRS>
+      <SRS>EPSG:32303</SRS>
+      <SRS>EPSG:32304</SRS>
+      <SRS>EPSG:32305</SRS>
+      <SRS>EPSG:32306</SRS>
+      <SRS>EPSG:32307</SRS>
+      <SRS>EPSG:32308</SRS>
+      <SRS>EPSG:32309</SRS>
+      <SRS>EPSG:32310</SRS>
+      <SRS>EPSG:32311</SRS>
+      <SRS>EPSG:32312</SRS>
+      <SRS>EPSG:32313</SRS>
+      <SRS>EPSG:32314</SRS>
+      <SRS>EPSG:32315</SRS>
+      <SRS>EPSG:32316</SRS>
+      <SRS>EPSG:32317</SRS>
+      <SRS>EPSG:32318</SRS>
+      <SRS>EPSG:32319</SRS>
+      <SRS>EPSG:32320</SRS>
+      <SRS>EPSG:32321</SRS>
+      <SRS>EPSG:32322</SRS>
+      <SRS>EPSG:32323</SRS>
+      <SRS>EPSG:32324</SRS>
+      <SRS>EPSG:32325</SRS>
+      <SRS>EPSG:32326</SRS>
+      <SRS>EPSG:32327</SRS>
+      <SRS>EPSG:32328</SRS>
+      <SRS>EPSG:32329</SRS>
+      <SRS>EPSG:32330</SRS>
+      <SRS>EPSG:32331</SRS>
+      <SRS>EPSG:32332</SRS>
+      <SRS>EPSG:32333</SRS>
+      <SRS>EPSG:32334</SRS>
+      <SRS>EPSG:32335</SRS>
+      <SRS>EPSG:32336</SRS>
+      <SRS>EPSG:32337</SRS>
+      <SRS>EPSG:32338</SRS>
+      <SRS>EPSG:32339</SRS>
+      <SRS>EPSG:32340</SRS>
+      <SRS>EPSG:32341</SRS>
+      <SRS>EPSG:32342</SRS>
+      <SRS>EPSG:32343</SRS>
+      <SRS>EPSG:32344</SRS>
+      <SRS>EPSG:32345</SRS>
+      <SRS>EPSG:32346</SRS>
+      <SRS>EPSG:32347</SRS>
+      <SRS>EPSG:32348</SRS>
+      <SRS>EPSG:32349</SRS>
+      <SRS>EPSG:32350</SRS>
+      <SRS>EPSG:32351</SRS>
+      <SRS>EPSG:32352</SRS>
+      <SRS>EPSG:32353</SRS>
+      <SRS>EPSG:32354</SRS>
+      <SRS>EPSG:32355</SRS>
+      <SRS>EPSG:32356</SRS>
+      <SRS>EPSG:32357</SRS>
+      <SRS>EPSG:32358</SRS>
+      <SRS>EPSG:32359</SRS>
+      <SRS>EPSG:32360</SRS>
+      <SRS>EPSG:32401</SRS>
+      <SRS>EPSG:32402</SRS>
+      <SRS>EPSG:32403</SRS>
+      <SRS>EPSG:32404</SRS>
+      <SRS>EPSG:32405</SRS>
+      <SRS>EPSG:32406</SRS>
+      <SRS>EPSG:32407</SRS>
+      <SRS>EPSG:32408</SRS>
+      <SRS>EPSG:32409</SRS>
+      <SRS>EPSG:32410</SRS>
+      <SRS>EPSG:32411</SRS>
+      <SRS>EPSG:32412</SRS>
+      <SRS>EPSG:32413</SRS>
+      <SRS>EPSG:32414</SRS>
+      <SRS>EPSG:32415</SRS>
+      <SRS>EPSG:32416</SRS>
+      <SRS>EPSG:32417</SRS>
+      <SRS>EPSG:32418</SRS>
+      <SRS>EPSG:32419</SRS>
+      <SRS>EPSG:32420</SRS>
+      <SRS>EPSG:32421</SRS>
+      <SRS>EPSG:32422</SRS>
+      <SRS>EPSG:32423</SRS>
+      <SRS>EPSG:32424</SRS>
+      <SRS>EPSG:32425</SRS>
+      <SRS>EPSG:32426</SRS>
+      <SRS>EPSG:32427</SRS>
+      <SRS>EPSG:32428</SRS>
+      <SRS>EPSG:32429</SRS>
+      <SRS>EPSG:32430</SRS>
+      <SRS>EPSG:32431</SRS>
+      <SRS>EPSG:32432</SRS>
+      <SRS>EPSG:32433</SRS>
+      <SRS>EPSG:32434</SRS>
+      <SRS>EPSG:32435</SRS>
+      <SRS>EPSG:32436</SRS>
+      <SRS>EPSG:32437</SRS>
+      <SRS>EPSG:32438</SRS>
+      <SRS>EPSG:32439</SRS>
+      <SRS>EPSG:32440</SRS>
+      <SRS>EPSG:32441</SRS>
+      <SRS>EPSG:32442</SRS>
+      <SRS>EPSG:32443</SRS>
+      <SRS>EPSG:32444</SRS>
+      <SRS>EPSG:32445</SRS>
+      <SRS>EPSG:32446</SRS>
+      <SRS>EPSG:32447</SRS>
+      <SRS>EPSG:32448</SRS>
+      <SRS>EPSG:32449</SRS>
+      <SRS>EPSG:32450</SRS>
+      <SRS>EPSG:32451</SRS>
+      <SRS>EPSG:32452</SRS>
+      <SRS>EPSG:32453</SRS>
+      <SRS>EPSG:32454</SRS>
+      <SRS>EPSG:32455</SRS>
+      <SRS>EPSG:32456</SRS>
+      <SRS>EPSG:32457</SRS>
+      <SRS>EPSG:32458</SRS>
+      <SRS>EPSG:32459</SRS>
+      <SRS>EPSG:32460</SRS>
+      <SRS>EPSG:32501</SRS>
+      <SRS>EPSG:32502</SRS>
+      <SRS>EPSG:32503</SRS>
+      <SRS>EPSG:32504</SRS>
+      <SRS>EPSG:32505</SRS>
+      <SRS>EPSG:32506</SRS>
+      <SRS>EPSG:32507</SRS>
+      <SRS>EPSG:32508</SRS>
+      <SRS>EPSG:32509</SRS>
+      <SRS>EPSG:32510</SRS>
+      <SRS>EPSG:32511</SRS>
+      <SRS>EPSG:32512</SRS>
+      <SRS>EPSG:32513</SRS>
+      <SRS>EPSG:32514</SRS>
+      <SRS>EPSG:32515</SRS>
+      <SRS>EPSG:32516</SRS>
+      <SRS>EPSG:32517</SRS>
+      <SRS>EPSG:32518</SRS>
+      <SRS>EPSG:32519</SRS>
+      <SRS>EPSG:32520</SRS>
+      <SRS>EPSG:32521</SRS>
+      <SRS>EPSG:32522</SRS>
+      <SRS>EPSG:32523</SRS>
+      <SRS>EPSG:32524</SRS>
+      <SRS>EPSG:32525</SRS>
+      <SRS>EPSG:32526</SRS>
+      <SRS>EPSG:32527</SRS>
+      <SRS>EPSG:32528</SRS>
+      <SRS>EPSG:32529</SRS>
+      <SRS>EPSG:32530</SRS>
+      <SRS>EPSG:32531</SRS>
+      <SRS>EPSG:32532</SRS>
+      <SRS>EPSG:32533</SRS>
+      <SRS>EPSG:32534</SRS>
+      <SRS>EPSG:32535</SRS>
+      <SRS>EPSG:32536</SRS>
+      <SRS>EPSG:32537</SRS>
+      <SRS>EPSG:32538</SRS>
+      <SRS>EPSG:32539</SRS>
+      <SRS>EPSG:32540</SRS>
+      <SRS>EPSG:32541</SRS>
+      <SRS>EPSG:32542</SRS>
+      <SRS>EPSG:32543</SRS>
+      <SRS>EPSG:32544</SRS>
+      <SRS>EPSG:32545</SRS>
+      <SRS>EPSG:32546</SRS>
+      <SRS>EPSG:32547</SRS>
+      <SRS>EPSG:32548</SRS>
+      <SRS>EPSG:32549</SRS>
+      <SRS>EPSG:32550</SRS>
+      <SRS>EPSG:32551</SRS>
+      <SRS>EPSG:32552</SRS>
+      <SRS>EPSG:32553</SRS>
+      <SRS>EPSG:32554</SRS>
+      <SRS>EPSG:32555</SRS>
+      <SRS>EPSG:32556</SRS>
+      <SRS>EPSG:32557</SRS>
+      <SRS>EPSG:32558</SRS>
+      <SRS>EPSG:32559</SRS>
+      <SRS>EPSG:32560</SRS>
+      <SRS>EPSG:32600</SRS>
+      <SRS>EPSG:32601</SRS>
+      <SRS>EPSG:32602</SRS>
+      <SRS>EPSG:32603</SRS>
+      <SRS>EPSG:32604</SRS>
+      <SRS>EPSG:32605</SRS>
+      <SRS>EPSG:32606</SRS>
+      <SRS>EPSG:32607</SRS>
+      <SRS>EPSG:32608</SRS>
+      <SRS>EPSG:32609</SRS>
+      <SRS>EPSG:32610</SRS>
+      <SRS>EPSG:32611</SRS>
+      <SRS>EPSG:32612</SRS>
+      <SRS>EPSG:32613</SRS>
+      <SRS>EPSG:32614</SRS>
+      <SRS>EPSG:32615</SRS>
+      <SRS>EPSG:32616</SRS>
+      <SRS>EPSG:32617</SRS>
+      <SRS>EPSG:32618</SRS>
+      <SRS>EPSG:32619</SRS>
+      <SRS>EPSG:32620</SRS>
+      <SRS>EPSG:32621</SRS>
+      <SRS>EPSG:32622</SRS>
+      <SRS>EPSG:32623</SRS>
+      <SRS>EPSG:32624</SRS>
+      <SRS>EPSG:32625</SRS>
+      <SRS>EPSG:32626</SRS>
+      <SRS>EPSG:32627</SRS>
+      <SRS>EPSG:32628</SRS>
+      <SRS>EPSG:32629</SRS>
+      <SRS>EPSG:32630</SRS>
+      <SRS>EPSG:32631</SRS>
+      <SRS>EPSG:32632</SRS>
+      <SRS>EPSG:32633</SRS>
+      <SRS>EPSG:32634</SRS>
+      <SRS>EPSG:32635</SRS>
+      <SRS>EPSG:32636</SRS>
+      <SRS>EPSG:32637</SRS>
+      <SRS>EPSG:32638</SRS>
+      <SRS>EPSG:32639</SRS>
+      <SRS>EPSG:32640</SRS>
+      <SRS>EPSG:32641</SRS>
+      <SRS>EPSG:32642</SRS>
+      <SRS>EPSG:32643</SRS>
+      <SRS>EPSG:32644</SRS>
+      <SRS>EPSG:32645</SRS>
+      <SRS>EPSG:32646</SRS>
+      <SRS>EPSG:32647</SRS>
+      <SRS>EPSG:32648</SRS>
+      <SRS>EPSG:32649</SRS>
+      <SRS>EPSG:32650</SRS>
+      <SRS>EPSG:32651</SRS>
+      <SRS>EPSG:32652</SRS>
+      <SRS>EPSG:32653</SRS>
+      <SRS>EPSG:32654</SRS>
+      <SRS>EPSG:32655</SRS>
+      <SRS>EPSG:32656</SRS>
+      <SRS>EPSG:32657</SRS>
+      <SRS>EPSG:32658</SRS>
+      <SRS>EPSG:32659</SRS>
+      <SRS>EPSG:32660</SRS>
+      <SRS>EPSG:32661</SRS>
+      <SRS>EPSG:32662</SRS>
+      <SRS>EPSG:32664</SRS>
+      <SRS>EPSG:32665</SRS>
+      <SRS>EPSG:32666</SRS>
+      <SRS>EPSG:32667</SRS>
+      <SRS>EPSG:32700</SRS>
+      <SRS>EPSG:32701</SRS>
+      <SRS>EPSG:32702</SRS>
+      <SRS>EPSG:32703</SRS>
+      <SRS>EPSG:32704</SRS>
+      <SRS>EPSG:32705</SRS>
+      <SRS>EPSG:32706</SRS>
+      <SRS>EPSG:32707</SRS>
+      <SRS>EPSG:32708</SRS>
+      <SRS>EPSG:32709</SRS>
+      <SRS>EPSG:32710</SRS>
+      <SRS>EPSG:32711</SRS>
+      <SRS>EPSG:32712</SRS>
+      <SRS>EPSG:32713</SRS>
+      <SRS>EPSG:32714</SRS>
+      <SRS>EPSG:32715</SRS>
+      <SRS>EPSG:32716</SRS>
+      <SRS>EPSG:32717</SRS>
+      <SRS>EPSG:32718</SRS>
+      <SRS>EPSG:32719</SRS>
+      <SRS>EPSG:32720</SRS>
+      <SRS>EPSG:32721</SRS>
+      <SRS>EPSG:32722</SRS>
+      <SRS>EPSG:32723</SRS>
+      <SRS>EPSG:32724</SRS>
+      <SRS>EPSG:32725</SRS>
+      <SRS>EPSG:32726</SRS>
+      <SRS>EPSG:32727</SRS>
+      <SRS>EPSG:32728</SRS>
+      <SRS>EPSG:32729</SRS>
+      <SRS>EPSG:32730</SRS>
+      <SRS>EPSG:32731</SRS>
+      <SRS>EPSG:32732</SRS>
+      <SRS>EPSG:32733</SRS>
+      <SRS>EPSG:32734</SRS>
+      <SRS>EPSG:32735</SRS>
+      <SRS>EPSG:32736</SRS>
+      <SRS>EPSG:32737</SRS>
+      <SRS>EPSG:32738</SRS>
+      <SRS>EPSG:32739</SRS>
+      <SRS>EPSG:32740</SRS>
+      <SRS>EPSG:32741</SRS>
+      <SRS>EPSG:32742</SRS>
+      <SRS>EPSG:32743</SRS>
+      <SRS>EPSG:32744</SRS>
+      <SRS>EPSG:32745</SRS>
+      <SRS>EPSG:32746</SRS>
+      <SRS>EPSG:32747</SRS>
+      <SRS>EPSG:32748</SRS>
+      <SRS>EPSG:32749</SRS>
+      <SRS>EPSG:32750</SRS>
+      <SRS>EPSG:32751</SRS>
+      <SRS>EPSG:32752</SRS>
+      <SRS>EPSG:32753</SRS>
+      <SRS>EPSG:32754</SRS>
+      <SRS>EPSG:32755</SRS>
+      <SRS>EPSG:32756</SRS>
+      <SRS>EPSG:32757</SRS>
+      <SRS>EPSG:32758</SRS>
+      <SRS>EPSG:32759</SRS>
+      <SRS>EPSG:32760</SRS>
+      <SRS>EPSG:32761</SRS>
+      <SRS>EPSG:32766</SRS>
+      <SRS>EPSG:61206405</SRS>
+      <SRS>EPSG:61216405</SRS>
+      <SRS>EPSG:61226405</SRS>
+      <SRS>EPSG:61236405</SRS>
+      <SRS>EPSG:61246405</SRS>
+      <SRS>EPSG:61266405</SRS>
+      <SRS>EPSG:61266413</SRS>
+      <SRS>EPSG:61276405</SRS>
+      <SRS>EPSG:61286405</SRS>
+      <SRS>EPSG:61296405</SRS>
+      <SRS>EPSG:61306405</SRS>
+      <SRS>EPSG:61306413</SRS>
+      <SRS>EPSG:61316405</SRS>
+      <SRS>EPSG:61326405</SRS>
+      <SRS>EPSG:61336405</SRS>
+      <SRS>EPSG:61346405</SRS>
+      <SRS>EPSG:61356405</SRS>
+      <SRS>EPSG:61366405</SRS>
+      <SRS>EPSG:61376405</SRS>
+      <SRS>EPSG:61386405</SRS>
+      <SRS>EPSG:61396405</SRS>
+      <SRS>EPSG:61406405</SRS>
+      <SRS>EPSG:61406413</SRS>
+      <SRS>EPSG:61416405</SRS>
+      <SRS>EPSG:61426405</SRS>
+      <SRS>EPSG:61436405</SRS>
+      <SRS>EPSG:61446405</SRS>
+      <SRS>EPSG:61456405</SRS>
+      <SRS>EPSG:61466405</SRS>
+      <SRS>EPSG:61476405</SRS>
+      <SRS>EPSG:61486405</SRS>
+      <SRS>EPSG:61486413</SRS>
+      <SRS>EPSG:61496405</SRS>
+      <SRS>EPSG:61506405</SRS>
+      <SRS>EPSG:61516405</SRS>
+      <SRS>EPSG:61516413</SRS>
+      <SRS>EPSG:61526405</SRS>
+      <SRS>EPSG:61526413</SRS>
+      <SRS>EPSG:61536405</SRS>
+      <SRS>EPSG:61546405</SRS>
+      <SRS>EPSG:61556405</SRS>
+      <SRS>EPSG:61566405</SRS>
+      <SRS>EPSG:61576405</SRS>
+      <SRS>EPSG:61586405</SRS>
+      <SRS>EPSG:61596405</SRS>
+      <SRS>EPSG:61606405</SRS>
+      <SRS>EPSG:61616405</SRS>
+      <SRS>EPSG:61626405</SRS>
+      <SRS>EPSG:61636405</SRS>
+      <SRS>EPSG:61636413</SRS>
+      <SRS>EPSG:61646405</SRS>
+      <SRS>EPSG:61656405</SRS>
+      <SRS>EPSG:61666405</SRS>
+      <SRS>EPSG:61676405</SRS>
+      <SRS>EPSG:61676413</SRS>
+      <SRS>EPSG:61686405</SRS>
+      <SRS>EPSG:61696405</SRS>
+      <SRS>EPSG:61706405</SRS>
+      <SRS>EPSG:61706413</SRS>
+      <SRS>EPSG:61716405</SRS>
+      <SRS>EPSG:61716413</SRS>
+      <SRS>EPSG:61736405</SRS>
+      <SRS>EPSG:61736413</SRS>
+      <SRS>EPSG:61746405</SRS>
+      <SRS>EPSG:61756405</SRS>
+      <SRS>EPSG:61766405</SRS>
+      <SRS>EPSG:61766413</SRS>
+      <SRS>EPSG:61786405</SRS>
+      <SRS>EPSG:61796405</SRS>
+      <SRS>EPSG:61806405</SRS>
+      <SRS>EPSG:61806413</SRS>
+      <SRS>EPSG:61816405</SRS>
+      <SRS>EPSG:61826405</SRS>
+      <SRS>EPSG:61836405</SRS>
+      <SRS>EPSG:61846405</SRS>
+      <SRS>EPSG:61886405</SRS>
+      <SRS>EPSG:61896405</SRS>
+      <SRS>EPSG:61896413</SRS>
+      <SRS>EPSG:61906405</SRS>
+      <SRS>EPSG:61906413</SRS>
+      <SRS>EPSG:61916405</SRS>
+      <SRS>EPSG:61926405</SRS>
+      <SRS>EPSG:61936405</SRS>
+      <SRS>EPSG:61946405</SRS>
+      <SRS>EPSG:61956405</SRS>
+      <SRS>EPSG:61966405</SRS>
+      <SRS>EPSG:61976405</SRS>
+      <SRS>EPSG:61986405</SRS>
+      <SRS>EPSG:61996405</SRS>
+      <SRS>EPSG:62006405</SRS>
+      <SRS>EPSG:62016405</SRS>
+      <SRS>EPSG:62026405</SRS>
+      <SRS>EPSG:62036405</SRS>
+      <SRS>EPSG:62046405</SRS>
+      <SRS>EPSG:62056405</SRS>
+      <SRS>EPSG:62066405</SRS>
+      <SRS>EPSG:62076405</SRS>
+      <SRS>EPSG:62086405</SRS>
+      <SRS>EPSG:62096405</SRS>
+      <SRS>EPSG:62106405</SRS>
+      <SRS>EPSG:62116405</SRS>
+      <SRS>EPSG:62126405</SRS>
+      <SRS>EPSG:62136405</SRS>
+      <SRS>EPSG:62146405</SRS>
+      <SRS>EPSG:62156405</SRS>
+      <SRS>EPSG:62166405</SRS>
+      <SRS>EPSG:62186405</SRS>
+      <SRS>EPSG:62196405</SRS>
+      <SRS>EPSG:62206405</SRS>
+      <SRS>EPSG:62216405</SRS>
+      <SRS>EPSG:62226405</SRS>
+      <SRS>EPSG:62236405</SRS>
+      <SRS>EPSG:62246405</SRS>
+      <SRS>EPSG:62256405</SRS>
+      <SRS>EPSG:62276405</SRS>
+      <SRS>EPSG:62296405</SRS>
+      <SRS>EPSG:62306405</SRS>
+      <SRS>EPSG:62316405</SRS>
+      <SRS>EPSG:62326405</SRS>
+      <SRS>EPSG:62336405</SRS>
+      <SRS>EPSG:62366405</SRS>
+      <SRS>EPSG:62376405</SRS>
+      <SRS>EPSG:62386405</SRS>
+      <SRS>EPSG:62396405</SRS>
+      <SRS>EPSG:62406405</SRS>
+      <SRS>EPSG:62416405</SRS>
+      <SRS>EPSG:62426405</SRS>
+      <SRS>EPSG:62436405</SRS>
+      <SRS>EPSG:62446405</SRS>
+      <SRS>EPSG:62456405</SRS>
+      <SRS>EPSG:62466405</SRS>
+      <SRS>EPSG:62476405</SRS>
+      <SRS>EPSG:62486405</SRS>
+      <SRS>EPSG:62496405</SRS>
+      <SRS>EPSG:62506405</SRS>
+      <SRS>EPSG:62516405</SRS>
+      <SRS>EPSG:62526405</SRS>
+      <SRS>EPSG:62536405</SRS>
+      <SRS>EPSG:62546405</SRS>
+      <SRS>EPSG:62556405</SRS>
+      <SRS>EPSG:62566405</SRS>
+      <SRS>EPSG:62576405</SRS>
+      <SRS>EPSG:62586405</SRS>
+      <SRS>EPSG:62586413</SRS>
+      <SRS>EPSG:62596405</SRS>
+      <SRS>EPSG:62616405</SRS>
+      <SRS>EPSG:62626405</SRS>
+      <SRS>EPSG:62636405</SRS>
+      <SRS>EPSG:62646405</SRS>
+      <SRS>EPSG:62656405</SRS>
+      <SRS>EPSG:62666405</SRS>
+      <SRS>EPSG:62676405</SRS>
+      <SRS>EPSG:62686405</SRS>
+      <SRS>EPSG:62696405</SRS>
+      <SRS>EPSG:62706405</SRS>
+      <SRS>EPSG:62716405</SRS>
+      <SRS>EPSG:62726405</SRS>
+      <SRS>EPSG:62736405</SRS>
+      <SRS>EPSG:62746405</SRS>
+      <SRS>EPSG:62756405</SRS>
+      <SRS>EPSG:62766405</SRS>
+      <SRS>EPSG:62776405</SRS>
+      <SRS>EPSG:62786405</SRS>
+      <SRS>EPSG:62796405</SRS>
+      <SRS>EPSG:62806405</SRS>
+      <SRS>EPSG:62816405</SRS>
+      <SRS>EPSG:62826405</SRS>
+      <SRS>EPSG:62836405</SRS>
+      <SRS>EPSG:62836413</SRS>
+      <SRS>EPSG:62846405</SRS>
+      <SRS>EPSG:62856405</SRS>
+      <SRS>EPSG:62866405</SRS>
+      <SRS>EPSG:62886405</SRS>
+      <SRS>EPSG:62896405</SRS>
+      <SRS>EPSG:62926405</SRS>
+      <SRS>EPSG:62936405</SRS>
+      <SRS>EPSG:62956405</SRS>
+      <SRS>EPSG:62976405</SRS>
+      <SRS>EPSG:62986405</SRS>
+      <SRS>EPSG:62996405</SRS>
+      <SRS>EPSG:63006405</SRS>
+      <SRS>EPSG:63016405</SRS>
+      <SRS>EPSG:63026405</SRS>
+      <SRS>EPSG:63036405</SRS>
+      <SRS>EPSG:63046405</SRS>
+      <SRS>EPSG:63066405</SRS>
+      <SRS>EPSG:63076405</SRS>
+      <SRS>EPSG:63086405</SRS>
+      <SRS>EPSG:63096405</SRS>
+      <SRS>EPSG:63106405</SRS>
+      <SRS>EPSG:63116405</SRS>
+      <SRS>EPSG:63126405</SRS>
+      <SRS>EPSG:63136405</SRS>
+      <SRS>EPSG:63146405</SRS>
+      <SRS>EPSG:63156405</SRS>
+      <SRS>EPSG:63166405</SRS>
+      <SRS>EPSG:63176405</SRS>
+      <SRS>EPSG:63186405</SRS>
+      <SRS>EPSG:63196405</SRS>
+      <SRS>EPSG:63226405</SRS>
+      <SRS>EPSG:63246405</SRS>
+      <SRS>EPSG:63266405</SRS>
+      <SRS>EPSG:63266406</SRS>
+      <SRS>EPSG:63266407</SRS>
+      <SRS>EPSG:63266408</SRS>
+      <SRS>EPSG:63266409</SRS>
+      <SRS>EPSG:63266410</SRS>
+      <SRS>EPSG:63266411</SRS>
+      <SRS>EPSG:63266412</SRS>
+      <SRS>EPSG:63266413</SRS>
+      <SRS>EPSG:63266414</SRS>
+      <SRS>EPSG:63266415</SRS>
+      <SRS>EPSG:63266416</SRS>
+      <SRS>EPSG:63266417</SRS>
+      <SRS>EPSG:63266418</SRS>
+      <SRS>EPSG:63266419</SRS>
+      <SRS>EPSG:63266420</SRS>
+      <SRS>EPSG:66006405</SRS>
+      <SRS>EPSG:66016405</SRS>
+      <SRS>EPSG:66026405</SRS>
+      <SRS>EPSG:66036405</SRS>
+      <SRS>EPSG:66046405</SRS>
+      <SRS>EPSG:66056405</SRS>
+      <SRS>EPSG:66066405</SRS>
+      <SRS>EPSG:66076405</SRS>
+      <SRS>EPSG:66086405</SRS>
+      <SRS>EPSG:66096405</SRS>
+      <SRS>EPSG:66106405</SRS>
+      <SRS>EPSG:66116405</SRS>
+      <SRS>EPSG:66126405</SRS>
+      <SRS>EPSG:66126413</SRS>
+      <SRS>EPSG:66136405</SRS>
+      <SRS>EPSG:66146405</SRS>
+      <SRS>EPSG:66156405</SRS>
+      <SRS>EPSG:66166405</SRS>
+      <SRS>EPSG:66186405</SRS>
+      <SRS>EPSG:66196405</SRS>
+      <SRS>EPSG:66196413</SRS>
+      <SRS>EPSG:66206405</SRS>
+      <SRS>EPSG:66216405</SRS>
+      <SRS>EPSG:66226405</SRS>
+      <SRS>EPSG:66236405</SRS>
+      <SRS>EPSG:66246405</SRS>
+      <SRS>EPSG:66246413</SRS>
+      <SRS>EPSG:66256405</SRS>
+      <SRS>EPSG:66266405</SRS>
+      <SRS>EPSG:66276405</SRS>
+      <SRS>EPSG:66276413</SRS>
+      <SRS>EPSG:66286405</SRS>
+      <SRS>EPSG:66296405</SRS>
+      <SRS>EPSG:66306405</SRS>
+      <SRS>EPSG:66316405</SRS>
+      <SRS>EPSG:66326405</SRS>
+      <SRS>EPSG:66336405</SRS>
+      <SRS>EPSG:66346405</SRS>
+      <SRS>EPSG:66356405</SRS>
+      <SRS>EPSG:66366405</SRS>
+      <SRS>EPSG:66376405</SRS>
+      <SRS>EPSG:66386405</SRS>
+      <SRS>EPSG:66396405</SRS>
+      <SRS>EPSG:66406405</SRS>
+      <SRS>EPSG:66406413</SRS>
+      <SRS>EPSG:66416405</SRS>
+      <SRS>EPSG:66426405</SRS>
+      <SRS>EPSG:66436405</SRS>
+      <SRS>EPSG:66446405</SRS>
+      <SRS>EPSG:66456405</SRS>
+      <SRS>EPSG:66456413</SRS>
+      <SRS>EPSG:66466405</SRS>
+      <SRS>EPSG:66576405</SRS>
+      <SRS>EPSG:66586405</SRS>
+      <SRS>EPSG:66596405</SRS>
+      <SRS>EPSG:66596413</SRS>
+      <SRS>EPSG:66606405</SRS>
+      <SRS>EPSG:66616405</SRS>
+      <SRS>EPSG:66616413</SRS>
+      <SRS>EPSG:66636405</SRS>
+      <SRS>EPSG:66646405</SRS>
+      <SRS>EPSG:66656405</SRS>
+      <SRS>EPSG:66666405</SRS>
+      <SRS>EPSG:66676405</SRS>
+      <SRS>EPSG:68016405</SRS>
+      <SRS>EPSG:68026405</SRS>
+      <SRS>EPSG:68036405</SRS>
+      <SRS>EPSG:68046405</SRS>
+      <SRS>EPSG:68056405</SRS>
+      <SRS>EPSG:68066405</SRS>
+      <SRS>EPSG:68086405</SRS>
+      <SRS>EPSG:68096405</SRS>
+      <SRS>EPSG:68136405</SRS>
+      <SRS>EPSG:68146405</SRS>
+      <SRS>EPSG:68156405</SRS>
+      <SRS>EPSG:68186405</SRS>
+      <SRS>EPSG:68206405</SRS>
+      <SRS>EPSG:69036405</SRS>
+      <SRS>EPSG:42302</SRS>
+      <SRS>EPSG:42301</SRS>
+      <SRS>EPSG:900913</SRS>
+      <SRS>EPSG:45556</SRS>
+      <SRS>EPSG:45555</SRS>
+      <SRS>EPSG:54004</SRS>
+      <SRS>EPSG:41001</SRS>
+      <SRS>EPSG:42311</SRS>
+      <SRS>EPSG:42310</SRS>
+      <SRS>EPSG:18001</SRS>
+      <SRS>EPSG:100003</SRS>
+      <SRS>EPSG:42106</SRS>
+      <SRS>EPSG:100002</SRS>
+      <SRS>EPSG:42105</SRS>
+      <SRS>EPSG:100001</SRS>
+      <SRS>EPSG:42309</SRS>
+      <SRS>EPSG:42104</SRS>
+      <SRS>EPSG:42308</SRS>
+      <SRS>EPSG:42103</SRS>
+      <SRS>EPSG:42307</SRS>
+      <SRS>EPSG:42102</SRS>
+      <SRS>EPSG:42306</SRS>
+      <SRS>EPSG:42101</SRS>
+      <SRS>EPSG:42305</SRS>
+      <SRS>EPSG:42304</SRS>
+      <SRS>EPSG:42303</SRS>
+      <LatLonBoundingBox minx="-180.0" miny="-2277.78344726562" maxx="2.971959E7" maxy="4927039.0"/>
+      <Layer queryable="1">
+        <Name>og:bugsites</Name>
+        <Title/>
+        <Abstract>Sample data from GRASS, bug sites location, Spearfish, South Dakota, USA</Abstract>
+        <KeywordList>
+          <Keyword>spearfish</Keyword>
+          <Keyword>sfBugsites</Keyword>
+          <Keyword>insects</Keyword>
+          <Keyword>bugsites</Keyword>
+          <Keyword>tiger_beetles</Keyword>
+        </KeywordList>
+        <SRS>EPSG:26713</SRS>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <LatLonBoundingBox minx="-103.8678559295459" miny="44.3738305876282" maxx="-103.63763045271456" maxy="44.434080121216205"/>
+        <BoundingBox SRS="EPSG:26713" minx="590232.0" miny="4914096.0" maxx="608471.0" maxy="4920512.0"/>
+        <Style>
+          <Name>capitals</Name>
+          <Title>Capital cities</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=og:bugsites"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>og:restricted</Name>
+        <Title/>
+        <Abstract>Sample data from GRASS, restricted areas, Spearfish, South Dakota, USA</Abstract>
+        <KeywordList>
+          <Keyword>spearfish</Keyword>
+          <Keyword>restricted</Keyword>
+          <Keyword>areas</Keyword>
+          <Keyword>sfRestricted</Keyword>
+        </KeywordList>
+        <SRS>EPSG:26713</SRS>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <LatLonBoundingBox minx="-104.35148148738409" miny="44.25607459294179" maxx="-103.0750295549078" maxy="44.621871797688264"/>
+        <BoundingBox SRS="EPSG:26713" minx="551796.8125" miny="4901896.0" maxx="652788.5625" maxy="4940954.0"/>
+        <Style>
+          <Name>restricted</Name>
+          <Title>Red, translucent style</Title>
+          <Abstract>A sample style that just prints out a transparent red interior with a red outline</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=og:restricted"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>og:archsites</Name>
+        <Title/>
+        <Abstract>Sample data from GRASS, archeological sites location, Spearfish, South Dakota, USA</Abstract>
+        <KeywordList>
+          <Keyword>archsites</Keyword>
+          <Keyword>spearfish</Keyword>
+          <Keyword>sfArchsites</Keyword>
+          <Keyword>archeology</Keyword>
+        </KeywordList>
+        <SRS>EPSG:26713</SRS>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <LatLonBoundingBox minx="-103.8724583832911" miny="44.37729507653392" maxx="-103.63783694485966" maxy="44.48793465340441"/>
+        <BoundingBox SRS="EPSG:26713" minx="589860.0" miny="4914479.0" maxx="608355.0" maxy="4926490.0"/>
+        <Style>
+          <Name>point</Name>
+          <Title>Default point</Title>
+          <Abstract>A sample style that just prints out a 6px wide red square</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=og:archsites"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>og:streams</Name>
+        <Title/>
+        <Abstract>Sample data from GRASS, streams, Spearfish, South Dakota, USA</Abstract>
+        <KeywordList>
+          <Keyword>spearfish</Keyword>
+          <Keyword>sfStreams</Keyword>
+          <Keyword>streams</Keyword>
+        </KeywordList>
+        <SRS>EPSG:26713</SRS>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <LatLonBoundingBox minx="-103.87778561486992" miny="44.37222288070277" maxx="-103.62277295981083" maxy="44.50211347714936"/>
+        <BoundingBox SRS="EPSG:26713" minx="589443.0" miny="4913935.0" maxx="609526.75" maxy="4928059.5"/>
+        <Style>
+          <Name>simple_streams</Name>
+          <Title>Default Styler for streams segments</Title>
+          <Abstract>Blue lines, 2px wide</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=og:streams"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tiger:poly_landmarks</Name>
+        <Title>Manhattan (NY) landmarks</Title>
+        <Abstract>Manhattan landmarks, identifies water, lakes, parks, interesting buildilngs</Abstract>
+        <KeywordList>
+          <Keyword>landmarks</Keyword>
+          <Keyword>DS_poly_landmarks</Keyword>
+          <Keyword>manhattan</Keyword>
+          <Keyword>poly_landmarks</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="-74.047185" miny="40.679648" maxx="-73.90782" maxy="40.882078"/>
+        <BoundingBox SRS="EPSG:4326" minx="-74.047185" miny="40.679648" maxx="-73.90782" maxy="40.882078"/>
+        <Style>
+          <Name>poly_landmarks</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tiger:poly_landmarks"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tiger:poi</Name>
+        <Title>Manhattan (NY) points of interest</Title>
+        <Abstract>Points of interest in New York, New York (on Manhattan). One of the attributes contains the name of a file with a picture of the point of interest.</Abstract>
+        <KeywordList>
+          <Keyword>poi</Keyword>
+          <Keyword>Manhattan</Keyword>
+          <Keyword>DS_poi</Keyword>
+          <Keyword>points_of_interest</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="-74.0118315772888" miny="40.70754683896324" maxx="-74.00857344353275" maxy="40.711945649065406"/>
+        <BoundingBox SRS="EPSG:4326" minx="-74.0118315772888" miny="40.70754683896324" maxx="-74.00153046439813" maxy="40.719885123828675"/>
+        <Style>
+          <Name>poi</Name>
+          <Title>Points of interest</Title>
+          <Abstract>Manhattan points of interest</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tiger:poi"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tiger:tiger_roads</Name>
+        <Title>Manhattan (NY) roads</Title>
+        <Abstract>Highly simplified road layout of Manhattan in New York..</Abstract>
+        <KeywordList>
+          <Keyword>DS_tiger_roads</Keyword>
+          <Keyword>tiger_roads</Keyword>
+          <Keyword>roads</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="-74.02722" miny="40.684221" maxx="-73.907005" maxy="40.878178"/>
+        <BoundingBox SRS="EPSG:4326" minx="-74.02722" miny="40.684221" maxx="-73.907005" maxy="40.878178"/>
+        <Style>
+          <Name>tiger_roads</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tiger:tiger_roads"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>za:za_natural</Name>
+        <Title>Natural Landmarks in South Africa</Title>
+        <Abstract>This layer describes natural features of South Africa such as forests and lakes.</Abstract>
+        <KeywordList>
+          <Keyword>forests</Keyword>
+          <Keyword>water</Keyword>
+          <Keyword>landmarks</Keyword>
+          <Keyword>Africa</Keyword>
+          <Keyword>South</Keyword>
+          <Keyword>natural</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="16.935359954834" miny="-34.3737831115723" maxx="32.5472412109375" maxy="-22.7736549377441"/>
+        <BoundingBox SRS="EPSG:4326" minx="16.935359954834" miny="-34.3737831115723" maxx="32.5472412109375" maxy="-22.7736549377441"/>
+        <Style>
+          <Name>za_natural</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=za:za_natural"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>za:za_points</Name>
+        <Title>Points of Interest in South Africa</Title>
+        <Abstract>Noteworthy locations such as hotels and tourist attractions in South Africa.</Abstract>
+        <KeywordList>
+          <Keyword>of</Keyword>
+          <Keyword>tourist</Keyword>
+          <Keyword>zoo</Keyword>
+          <Keyword>landmarks</Keyword>
+          <Keyword>cities</Keyword>
+          <Keyword>interest</Keyword>
+          <Keyword>attractions</Keyword>
+          <Keyword>museum</Keyword>
+          <Keyword>hotel</Keyword>
+          <Keyword>points</Keyword>
+          <Keyword>picnic</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="16.4827766418457" miny="-46.9045600891113" maxx="37.9386329650879" maxy="-22.2347373962402"/>
+        <BoundingBox SRS="EPSG:4326" minx="16.4827766418457" miny="-46.9045600891113" maxx="37.9386329650879" maxy="-22.2347373962402"/>
+        <Style>
+          <Name>za_points</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=za:za_points"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>za:za_roads</Name>
+        <Title>South African Roads</Title>
+        <Abstract>This layer describes roads in South Africa.</Abstract>
+        <KeywordList>
+          <Keyword>south</Keyword>
+          <Keyword>africa</Keyword>
+          <Keyword>roads</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="16.4580821990967" miny="-34.8331336975098" maxx="32.8781242370605" maxy="-22.1271991729736"/>
+        <BoundingBox SRS="EPSG:4326" minx="16.4580821990967" miny="-34.8331336975098" maxx="32.8781242370605" maxy="-22.1271991729736"/>
+        <Style>
+          <Name>za_roads</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=za:za_roads"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>za:za_vegetation</Name>
+        <Title>South African Vegetation</Title>
+        <Abstract>This layer describes vegetated areas in South Africa, categorized by biome.</Abstract>
+        <KeywordList>
+          <Keyword>south</Keyword>
+          <Keyword>africa</Keyword>
+          <Keyword>vegetation</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="16.4691715240479" miny="-34.8336486816406" maxx="32.8940010070801" maxy="-22.123929977417"/>
+        <BoundingBox SRS="EPSG:4326" minx="16.4691715240479" miny="-34.8336486816406" maxx="32.8940010070801" maxy="-22.123929977417"/>
+        <Style>
+          <Name>za_vegetation</Name>
+          <Title>Default Styler</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=za:za_vegetation"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>topp:tasmania_cities</Name>
+        <Title>Tasmania cities</Title>
+        <Abstract>Cities in Tasmania (actually, just the capital)</Abstract>
+        <KeywordList>
+          <Keyword>cities</Keyword>
+          <Keyword>Tasmania</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="145.19754" miny="-43.423512" maxx="148.27298000000002" maxy="-40.852802"/>
+        <BoundingBox SRS="EPSG:4326" minx="147.2910004483" miny="-42.851001816890005" maxx="147.2910004483" maxy="-42.851001816890005"/>
+        <Style>
+          <Name>capitals</Name>
+          <Title>Capital cities</Title>
+          <Abstract/>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=topp:tasmania_cities"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>topp:tasmania_roads</Name>
+        <Title>Tasmania roads</Title>
+        <Abstract>Main Tasmania roads</Abstract>
+        <KeywordList>
+          <Keyword>Roads</Keyword>
+          <Keyword>Tasmania</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="145.19754" miny="-43.423512" maxx="148.27298000000002" maxy="-40.852802"/>
+        <BoundingBox SRS="EPSG:4326" minx="145.19754" miny="-43.423512" maxx="148.27298000000002" maxy="-40.852802"/>
+        <Style>
+          <Name>simple_roads</Name>
+          <Title>Default Styler for simple road segments</Title>
+          <Abstract>Light red line, 2px wide</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=topp:tasmania_roads"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>topp:tasmania_state_boundaries</Name>
+        <Title>Tasmania state boundaries</Title>
+        <Abstract>Tasmania state boundaries</Abstract>
+        <KeywordList>
+          <Keyword>boundaries</Keyword>
+          <Keyword>tasmania_state_boundaries</Keyword>
+          <Keyword>Tasmania</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="143.83482400000003" miny="-43.648056" maxx="148.47914100000003" maxy="-39.573891"/>
+        <BoundingBox SRS="EPSG:4326" minx="143.83482400000003" miny="-43.648056" maxx="148.47914100000003" maxy="-39.573891"/>
+        <Style>
+          <Name>green</Name>
+          <Title>Green polygon</Title>
+          <Abstract>Green fill with black outline</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=topp:tasmania_state_boundaries"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>topp:tasmania_water_bodies</Name>
+        <Title>Tasmania water bodies</Title>
+        <Abstract>Tasmania water bodies</Abstract>
+        <KeywordList>
+          <Keyword>Lakes</Keyword>
+          <Keyword>Bodies</Keyword>
+          <Keyword>Australia</Keyword>
+          <Keyword>Water</Keyword>
+          <Keyword>Tasmania</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="145.97161899999998" miny="-43.031944" maxx="147.219696" maxy="-41.775558"/>
+        <BoundingBox SRS="EPSG:4326" minx="145.97161899999998" miny="-43.031944" maxx="147.219696" maxy="-41.775558"/>
+        <Style>
+          <Name>cite_lakes</Name>
+          <Title>Blue lake</Title>
+          <Abstract>A blue fill, solid black outline style</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=topp:tasmania_water_bodies"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>topp:states</Name>
+        <Title>USA Population</Title>
+        <Abstract>This is some census data on the states.</Abstract>
+        <KeywordList>
+          <Keyword>census</Keyword>
+          <Keyword>united</Keyword>
+          <Keyword>boundaries</Keyword>
+          <Keyword>state</Keyword>
+          <Keyword>states</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="-124.731422" miny="24.955967" maxx="-66.969849" maxy="49.371735"/>
+        <BoundingBox SRS="EPSG:4326" minx="-124.73142200000001" miny="24.955967" maxx="-66.969849" maxy="49.371735"/>
+        <Style>
+          <Name>population</Name>
+          <Title>Population in the United States</Title>
+          <Abstract>A sample filter that filters the United States into three
+        categories of population, drawn in different colors</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=topp:states"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tike:waterways</Name>
+        <Title>Waterways</Title>
+        <Abstract>Waterways in Finland.</Abstract>
+        <KeywordList>
+          <Keyword>Finland</Keyword>
+          <Keyword>waterways</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="19.649055480957" miny="59.9357719421387" maxx="31.5377140045166" maxy="69.9118957519531"/>
+        <BoundingBox SRS="EPSG:4326" minx="19.649055480957" miny="59.9357719421387" maxx="31.5377140045166" maxy="69.9118957519531"/>
+        <Style>
+          <Name>line</Name>
+          <Title>1 px blue line</Title>
+          <Abstract>Default line style, 1 pixel wide blue</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tike:waterways"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tike:railways</Name>
+        <Title>roads_Type</Title>
+        <Abstract>Generated from tike</Abstract>
+        <KeywordList>
+          <Keyword>tike</Keyword>
+          <Keyword>roads</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="19.5393085479736" miny="-2277.78344726562" maxx="2.971959E7" maxy="4927039.0"/>
+        <BoundingBox SRS="EPSG:4326" minx="19.5393085479736" miny="-2277.78344726562" maxx="2.971959E7" maxy="4927039.0"/>
+        <Style>
+          <Name>line</Name>
+          <Title>1 px blue line</Title>
+          <Abstract>Default line style, 1 pixel wide blue</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tike:railways"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tike:roads</Name>
+        <Title>roads_Type</Title>
+        <Abstract>Generated from tike</Abstract>
+        <KeywordList>
+          <Keyword>tike</Keyword>
+          <Keyword>roads</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="19.5393085479736" miny="-2277.78344726562" maxx="2.971959E7" maxy="4927039.0"/>
+        <BoundingBox SRS="EPSG:4326" minx="19.5393085479736" miny="-2277.78344726562" maxx="2.971959E7" maxy="4927039.0"/>
+        <Style>
+          <Name>line</Name>
+          <Title>1 px blue line</Title>
+          <Abstract>Default line style, 1 pixel wide blue</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tike:roads"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>og:roads</Name>
+        <Title>roads_Type</Title>
+        <Abstract>Generated from sf_reset</Abstract>
+        <KeywordList>
+          <Keyword>roads</Keyword>
+          <Keyword>sf_reset</Keyword>
+        </KeywordList>
+        <SRS>EPSG:26713</SRS>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <LatLonBoundingBox minx="-103.87787616044085" miny="44.37286182959436" maxx="-103.62269938718721" maxy="44.50497230654195"/>
+        <BoundingBox SRS="EPSG:26713" minx="589434.8125" miny="4914006.0" maxx="609527.25" maxy="4928377.0"/>
+        <Style>
+          <Name>simple_roads</Name>
+          <Title>Default Styler for simple road segments</Title>
+          <Abstract>Light red line, 2px wide</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=og:roads"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>tike:points</Name>
+        <Title>roads_Type</Title>
+        <Abstract>Generated from tike</Abstract>
+        <KeywordList>
+          <Keyword>tike</Keyword>
+          <Keyword>roads</Keyword>
+        </KeywordList>
+        <SRS>EPSG:4326</SRS>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <LatLonBoundingBox minx="19.8481521606445" miny="59.8213005065918" maxx="31.2861518859863" maxy="70.0596923828125"/>
+        <BoundingBox SRS="EPSG:4326" minx="19.8481521606445" miny="59.8213005065918" maxx="31.2861518859863" maxy="70.0596923828125"/>
+        <Style>
+          <Name>line</Name>
+          <Title>1 px blue line</Title>
+          <Abstract>Default line style, 1 pixel wide blue</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=tike:points"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>nurc:Arc_Sample</Name>
+        <Title>Global annual rainfall</Title>
+        <Abstract>Global annual rainfall in ArcGrid format</Abstract>
+        <KeywordList>
+          <Keyword>WCS</Keyword>
+          <Keyword>arcGridSample</Keyword>
+          <Keyword>arcGridSample_Coverage</Keyword>
+        </KeywordList>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <SRS>EPSG:4326</SRS>
+        <LatLonBoundingBox minx="-180.0" miny="-90.0" maxx="180.0" maxy="90.0"/>
+        <BoundingBox SRS="EPSG:4326" minx="-180.0" miny="-90.0" maxx="180.0" maxy="90.0"/>
+        <Style>
+          <Name>raster</Name>
+          <Title>Raster</Title>
+          <Abstract>A sample style for rasters, good for displaying imagery</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=nurc:Arc_Sample"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>nurc:Img_Sample</Name>
+        <Title>North America sample imagery</Title>
+        <Abstract>A very rough imagery of North America</Abstract>
+        <KeywordList>
+          <Keyword>WCS</Keyword>
+          <Keyword>worldImageSample</Keyword>
+          <Keyword>worldImageSample_Coverage</Keyword>
+        </KeywordList>
+        <!--WKT definition of this CRS:
+GEOGCS["WGS 84", 
+  DATUM["World Geodetic System 1984", 
+    SPHEROID["WGS 84", 6378137.0, 298.257223563, AUTHORITY["EPSG","7030"]], 
+    AUTHORITY["EPSG","6326"]], 
+  PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+  UNIT["degree", 0.017453292519943295], 
+  AXIS["Geodetic longitude", EAST], 
+  AXIS["Geodetic latitude", NORTH], 
+  AUTHORITY["EPSG","4326"]]-->
+        <SRS>EPSG:4326</SRS>
+        <LatLonBoundingBox minx="-130.85168" miny="20.7052" maxx="-62.0054" maxy="54.1141"/>
+        <BoundingBox SRS="EPSG:4326" minx="-130.85168" miny="20.7052" maxx="-62.0054" maxy="54.1141"/>
+        <Style>
+          <Name>raster</Name>
+          <Title>Raster</Title>
+          <Abstract>A sample style for rasters, good for displaying imagery</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=nurc:Img_Sample"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="1">
+        <Name>sf:sfdem</Name>
+        <Title>Spearfish DEM</Title>
+        <Abstract>Digital Elevation Model data for Spearfish, South Dakota</Abstract>
+        <KeywordList>
+          <Keyword>WCS</Keyword>
+          <Keyword>sf</Keyword>
+          <Keyword>dem</Keyword>
+          <Keyword>digital</Keyword>
+          <Keyword>elevation</Keyword>
+          <Keyword>model</Keyword>
+        </KeywordList>
+        <!--WKT definition of this CRS:
+PROJCS["NAD27 / UTM zone 13N", 
+  GEOGCS["NAD27", 
+    DATUM["North American Datum 1927", 
+      SPHEROID["Clarke 1866", 6378206.4, 294.9786982138982, AUTHORITY["EPSG","7008"]], 
+      TOWGS84[-4.2, 135.4, 181.9, 0.0, 0.0, 0.0, 0.0], 
+      AUTHORITY["EPSG","6267"]], 
+    PRIMEM["Greenwich", 0.0, AUTHORITY["EPSG","8901"]], 
+    UNIT["degree", 0.017453292519943295], 
+    AXIS["Geodetic longitude", EAST], 
+    AXIS["Geodetic latitude", NORTH], 
+    AUTHORITY["EPSG","4267"]], 
+  PROJECTION["Transverse Mercator", AUTHORITY["EPSG","9807"]], 
+  PARAMETER["central_meridian", -105.0], 
+  PARAMETER["latitude_of_origin", 0.0], 
+  PARAMETER["scale_factor", 0.9996], 
+  PARAMETER["false_easting", 500000.0], 
+  PARAMETER["false_northing", 0.0], 
+  UNIT["m", 1.0], 
+  AXIS["Easting", EAST], 
+  AXIS["Northing", NORTH], 
+  AUTHORITY["EPSG","26713"]]-->
+        <SRS>EPSG:26713</SRS>
+        <LatLonBoundingBox minx="-103.87108701853181" miny="44.370187074132616" maxx="-103.62940739432703" maxy="44.5016011535299"/>
+        <BoundingBox SRS="EPSG:26713" minx="589980.0" miny="4913700.0" maxx="609000.0" maxy="4928010.0"/>
+        <Style>
+          <Name>dem</Name>
+          <Title>Simple DEM style</Title>
+          <Abstract>Classic elevation color progression</Abstract>
+          <LegendURL width="20" height="20">
+            <Format>image/png</Format>
+            <OnlineResource xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="simple" xlink:href="http://demo.opengeo.org/geoserver/wms/GetLegendGraphic?VERSION=1.0.0&amp;FORMAT=image/png&amp;WIDTH=20&amp;HEIGHT=20&amp;LAYER=sf:sfdem"/>
+          </LegendURL>
+        </Style>
+      </Layer>
+      <Layer queryable="0">
+        <Name>tasmania</Name>
+        <Title>tasmania</Title>
+        <Abstract>Layer-Group type layer: tasmania</Abstract>
+        <SRS>EPSG:4326</SRS>
+        <LatLonBoundingBox minx="143.83482400000003" miny="-43.648056" maxx="148.47914100000003" maxy="-39.573891"/>
+        <BoundingBox SRS="EPSG:4326" minx="143.83482400000003" miny="-43.648056" maxx="148.47914100000003" maxy="-39.573891"/>
+      </Layer>
+      <Layer queryable="0">
+        <Name>tiger-ny</Name>
+        <Title>tiger-ny</Title>
+        <Abstract>Layer-Group type layer: tiger-ny</Abstract>
+        <SRS>EPSG:4326</SRS>
+        <LatLonBoundingBox minx="-74.047185" miny="40.679648" maxx="-73.907005" maxy="40.882078"/>
+        <BoundingBox SRS="EPSG:4326" minx="-74.047185" miny="40.679648" maxx="-73.907005" maxy="40.882078"/>
+      </Layer>
+    </Layer>
+  </Capability>
+</WMT_MS_Capabilities>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/describe_feature_type.xml
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/describe_feature_type.xml	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/data/describe_feature_type.xml	(revision 76)
@@ -0,0 +1,1 @@
+<?xml version="1.0" encoding="UTF-8"?><xs:schema  targetNamespace="http://www.openplans.org/topp"  xmlns:topp="http://www.openplans.org/topp" xmlns:gml="http://www.opengis.net/gml" xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" attributeFormDefault="unqualified" version="1.0"><xs:import namespace="http://www.opengis.net/gml" schemaLocation="http://localhost:8080/geoserver/schemas/gml/2.1.2.1/feature.xsd"/><xs:complexType xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns="http://www.w3.org/2001/XMLSchema" name="states_Type"><xs:complexContent><xs:extension base="gml:AbstractFeatureType"><xs:sequence><xs:element name="the_geom" minOccurs="0" nillable="true" type="gml:MultiPolygonPropertyType"/><xs:element name="STATE_NAME" minOccurs="0" nillable="true"><xs:simpleType><xs:restriction base="xs:string"><xs:maxLength value="5"/></xs:restriction></xs:simpleType></xs:element><xs:element name="STATE_FIPS" minOccurs="0" nillable="true"><xs:simpleType><xs:restriction base="xs:string"><xs:maxLength value="5"/></xs:restriction></xs:simpleType></xs:element><xs:element name="SUB_REGION" minOccurs="0" nillable="true"><xs:simpleType><xs:restriction base="xs:string"><xs:maxLength value="5"/></xs:restriction></xs:simpleType></xs:element><xs:element name="STATE_ABBR" minOccurs="0" nillable="true"><xs:simpleType><xs:restriction base="xs:string"><xs:maxLength value="5"/></xs:restriction></xs:simpleType></xs:element><xs:element name="LAND_KM" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="WATER_KM" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="PERSONS" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="FAMILIES" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="HOUSHOLD" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="MALE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="FEMALE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="WORKERS" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="DRVALONE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="CARPOOL" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="PUBTRANS" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="EMPLOYED" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="UNEMPLOY" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="SERVICE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="MANUAL" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="P_MALE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="P_FEMALE" minOccurs="0" nillable="true" type="xs:double"/><xs:element name="SAMP_POP" minOccurs="0" nillable="true" type="xs:double"/></xs:sequence></xs:extension></xs:complexContent></xs:complexType><xs:element name="states" type="topp:states_Type" substitutionGroup="gml:_Feature"/></xs:schema>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.html	(revision 76)
@@ -0,0 +1,31 @@
+<html>
+    <head>
+        <title>GeoExt PrintPage Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-page.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Printing Contents from a MapPanel</h1>
+        <p>This example shows the how to create a printable PDF with
+        GeoExt.data.PrintProvider and GeoExt.data.PrintPage, using the
+        <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://docs.geoserver.org/stable/en/user/community/printing/">GeoServer</a>
+        print module.</p>
+        <p>The js is not minified so it is readable. See <a href="print-page.js">print-page.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/tree.js	(revision 76)
@@ -0,0 +1,232 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[tree]
+ *  Tree Nodes
+ *  ----------
+ *  Create all kinds of tree nodes.
+ */
+
+var mapPanel, tree;
+Ext.onReady(function() {
+    // create a map panel with some layers that we will show in our layer tree
+    // below.
+    mapPanel = new GeoExt.MapPanel({
+        border: true,
+        region: "center",
+        // we do not want all overlays, to try the OverlayLayerContainer
+        map: new OpenLayers.Map({allOverlays: false}),
+        center: [146.1569825, -41.6109735],
+        zoom: 6,
+        layers: [
+            new OpenLayers.Layer.WMS("Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms", {
+                    layers: "bluemarble"
+                }, {
+                    buffer: 0,
+                    visibility: false
+                }
+            ),
+            new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_state_boundaries"
+                }, {
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Water",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_water_bodies",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Cities",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_cities",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Tasmania Roads",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_roads",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            // create a group layer (with several layers in the "layers" param)
+            // to show how the LayerParamLoader works
+            new OpenLayers.Layer.WMS("Tasmania (Group Layer)",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: [
+                        "topp:tasmania_state_boundaries",
+                        "topp:tasmania_water_bodies",
+                        "topp:tasmania_cities",
+                        "topp:tasmania_roads"
+                    ],
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0,
+                    // exclude this layer from layer container nodes
+                    displayInLayerSwitcher: false,
+                    visibility: false
+                }
+            )
+        ]
+    });
+
+    // create our own layer node UI class, using the TreeNodeUIEventMixin
+    var LayerNodeUI = Ext.extend(GeoExt.tree.LayerNodeUI, new GeoExt.tree.TreeNodeUIEventMixin());
+        
+    // using OpenLayers.Format.JSON to create a nice formatted string of the
+    // configuration for editing it in the UI
+    var treeConfig = new OpenLayers.Format.JSON().write([{
+        nodeType: "gx_baselayercontainer"
+    }, {
+        nodeType: "gx_overlaylayercontainer",
+        expanded: true,
+        // render the nodes inside this container with a radio button,
+        // and assign them the group "foo".
+        loader: {
+            baseAttrs: {
+                radioGroup: "foo",
+                uiProvider: "layernodeui"
+            }
+        }
+    }, {
+        nodeType: "gx_layer",
+        layer: "Tasmania (Group Layer)",
+        isLeaf: false,
+        // create subnodes for the layers in the LAYERS param. If we assign
+        // a loader to a LayerNode and do not provide a loader class, a
+        // LayerParamLoader will be assumed.
+        loader: {
+            param: "LAYERS"
+        }
+    }], true);
+
+    // create the tree with the configuration from above
+    tree = new Ext.tree.TreePanel({
+        border: true,
+        region: "west",
+        title: "Layers",
+        width: 200,
+        split: true,
+        collapsible: true,
+        collapseMode: "mini",
+        autoScroll: true,
+        plugins: [
+            new GeoExt.plugins.TreeNodeRadioButton({
+                listeners: {
+                    "radiochange": function(node) {
+                        alert(node.text + " is now the active layer.");
+                    }
+                }
+            })
+        ],
+        loader: new Ext.tree.TreeLoader({
+            // applyLoader has to be set to false to not interfer with loaders
+            // of nodes further down the tree hierarchy
+            applyLoader: false,
+            uiProviders: {
+                "layernodeui": LayerNodeUI
+            }
+        }),
+        root: {
+            nodeType: "async",
+            // the children property of an Ext.tree.AsyncTreeNode is used to
+            // provide an initial set of layer nodes. We use the treeConfig
+            // from above, that we created with OpenLayers.Format.JSON.write.
+            children: Ext.decode(treeConfig)
+        },
+        listeners: {
+            "radiochange": function(node){
+                alert(node.layer.name + " is now the the active layer.");
+            }
+        },
+        rootVisible: false,
+        lines: false,
+        bbar: [{
+            text: "Show/Edit Tree Config",
+            handler: function() {
+                treeConfigWin.show();
+                Ext.getCmp("treeconfig").setValue(treeConfig);
+            }
+        }]
+    });
+
+    // dialog for editing the tree configuration
+    var treeConfigWin = new Ext.Window({
+        layout: "fit",
+        hideBorders: true,
+        closeAction: "hide",
+        width: 300,
+        height: 400,
+        title: "Tree Configuration",
+        items: [{
+            xtype: "form",
+            layout: "fit",
+            items: [{
+                id: "treeconfig",
+                xtype: "textarea"
+            }],
+            buttons: [{
+                text: "Save",
+                handler: function() {
+                    var value = Ext.getCmp("treeconfig").getValue()
+                    try {
+                        var root = tree.getRootNode();
+                        root.attributes.children = Ext.decode(value);
+                        tree.getLoader().load(root);
+                    } catch(e) {
+                        alert("Invalid JSON");
+                        return;
+                    }
+                    treeConfig = value;
+                    treeConfigWin.hide();
+                }
+            }, {
+                text: "Cancel",
+                handler: function() {
+                    treeConfigWin.hide();
+                }
+            }]
+        }]
+    });
+    
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            deferredRender: false,
+            items: [mapPanel, tree, {
+                contentEl: "desc",
+                region: "east",
+                bodyStyle: {"padding": "5px"},
+                collapsible: true,
+                collapseMode: "mini",
+                split: true,
+                width: 200,
+                title: "Description"
+            }]
+        }
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.html	(revision 76)
@@ -0,0 +1,31 @@
+<html>
+    <head>
+        <title>GeoExt PrintMapPanel Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-preview-osm.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Using a Print Preview</h1>
+        <p>This example shows the how to use GeoExt.PrintMapPanel, to create
+            a printable OSM map. It requires the
+        <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://docs.geoserver.org/stable/en/user/community/printing/">GeoServer</a>
+        print module.</p>
+        <p>The js is not minified so it is readable. See <a href="print-preview-osm.js">print-preview-osm.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.html	(revision 76)
@@ -0,0 +1,46 @@
+<html>
+    <head>
+        <title>GeoExt LayerOpacitySlider</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://dev.sencha.com/deploy/dev/examples/shared/examples.css"></link>
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        <style type="text/css">
+            .x-tree-node-leaf .gx-tree-layer-icon {
+                width: 0px;
+            }
+        </style>
+
+        <script type="text/javascript" src="layeropacityslider.js"></script>
+    </head>
+    <body>
+        <h1>GeoExt.LayerOpacitySlider</h1>
+
+        <p>The LayerOpacitySlider allows control of a layer opacity using an
+        Ext.Slider.  It is also possible to add a special tooltip plugin,
+        LayerOpacitySliderTip, which will show the opacity value while dragging
+        the slider (the content is configurable).<p>
+
+        <p>In this example, the slider in below the map is in aggressive mode: the
+        opacity is changed as soon as the slider is moved. The slider inside
+        Map 1 is not aggressive: the opacity is changed when the slider is
+        released. Also, the slider below the map is an inverse slider, which means
+        it uses transparency instead of opacity.</p>
+
+        <p>In Map 2 we have a fading effect between two layers. The slider is configured
+        with changeVisibility:true and a complementaryLayer. This avoids downloading images
+        when layer opacity is 0 or when complementaryLayer is fully covered by layer.
+        The effect on layer visibility is shown in the tree (checkboxes).</p>
+
+        <p>The js is not minified so it is readable. See <a
+        href="layeropacityslider.js">layeropacityslider.js</a>.</p>
+
+            <div id="map1-container" style="float:left"></div>
+            <div id="map2-container" style="float:right"></div>
+            <div id="tree" style="float:right"></div>
+            <div id="slider" style="clear:both"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/toolbar.js	(revision 76)
@@ -0,0 +1,162 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[toolbar]
+ *  Toolbar with Actions
+ *  --------------------
+ *  Create a toolbar with GeoExt Actions.
+ */
+
+Ext.onReady(function() {
+    Ext.QuickTips.init();
+
+    var map = new OpenLayers.Map();
+    var wms = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    var vector = new OpenLayers.Layer.Vector("vector");
+    map.addLayers([wms, vector]);
+    
+    var ctrl, toolbarItems = [], action, actions = {};
+
+    // ZoomToMaxExtent control, a "button" control
+    action = new GeoExt.Action({
+        control: new OpenLayers.Control.ZoomToMaxExtent(),
+        map: map,
+        text: "max extent",
+        tooltip: "zoom to max extent"
+    });
+    actions["max_extent"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // Navigation control and DrawFeature controls
+    // in the same toggle group
+    action = new GeoExt.Action({
+        text: "nav",
+        control: new OpenLayers.Control.Navigation(),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        pressed: true,
+        tooltip: "navigate",
+        // check item options
+        group: "draw",
+        checked: true
+    });
+    actions["nav"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "draw poly",
+        control: new OpenLayers.Control.DrawFeature(
+            vector, OpenLayers.Handler.Polygon
+        ),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        tooltip: "draw polygon",
+        // check item options
+        group: "draw"
+    });
+    actions["draw_poly"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "draw line",
+        control: new OpenLayers.Control.DrawFeature(
+            vector, OpenLayers.Handler.Path
+        ),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        tooltip: "draw line",
+        // check item options
+        group: "draw"
+    });
+    actions["draw_line"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // SelectFeature control, a "toggle" control
+    action = new GeoExt.Action({
+        text: "select",
+        control: new OpenLayers.Control.SelectFeature(vector, {
+            type: OpenLayers.Control.TYPE_TOGGLE,
+            hover: true
+        }),
+        map: map,
+        // button options
+        enableToggle: true,
+        tooltip: "select feature"
+    });
+    actions["select"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // Navigation history - two "button" controls
+    ctrl = new OpenLayers.Control.NavigationHistory();
+    map.addControl(ctrl);
+
+    action = new GeoExt.Action({
+        text: "previous",
+        control: ctrl.previous,
+        disabled: true,
+        tooltip: "previous in history"
+    });
+    actions["previous"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "next",
+        control: ctrl.next,
+        disabled: true,
+        tooltip: "next in history"
+    });
+    actions["next"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("->");
+
+    // Reuse the GeoExt.Action objects created above
+    // as menu items
+    toolbarItems.push({
+        text: "menu",
+        menu: new Ext.menu.Menu({
+            items: [
+                // ZoomToMaxExtent
+                actions["max_extent"],
+                // Nav
+                new Ext.menu.CheckItem(actions["nav"]),
+                // Draw poly
+                new Ext.menu.CheckItem(actions["draw_poly"]),
+                // Draw line
+                new Ext.menu.CheckItem(actions["draw_line"]),
+                // Select control
+                new Ext.menu.CheckItem(actions["select"]),
+                // Navigation history control
+                actions["previous"],
+                actions["next"]
+            ]
+        })
+    });
+
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        tbar: toolbarItems
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.html	(revision 76)
@@ -0,0 +1,35 @@
+<html>
+    <head>
+        <title>GeoExt MapPanel in an Ext Viewport</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <!-- Google Maps API for "localhost" -->
+        <!--
+        <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
+        -->
+        <!-- Google Maps API for "dev.geoext.org" -->
+        <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA_5ak-hsiH4j5bQQn7-k66xTWxvN8zH6Ta_pgIhhU0TB7bG8iAhS99ituPif4lG-2CHXoZ3qenLnK1g'></script>
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="mappanel-viewport.js"></script>
+
+    </head>
+    <body>
+        <div id="title">
+            <h1>GeoExt.MapPanel in an Ext.Viewport</h1>
+        </div>
+
+        <div id="description">
+            <p>This example shows how to place a MapPanel as a region in a
+            container using a border layout, the container is a Viewport in
+            this example.</p>
+            
+            <p>The js is not minified so it is readable. See <a
+            href="mappanel-viewport.js">mappanel-viewport.js</a>.</p>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-window.js	(revision 76)
@@ -0,0 +1,36 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-window]
+ *  Map Panel (in a Window)
+ *  -------------------------
+ *  Render a map panel in a Window.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    new Ext.Window({
+        title: "GeoExt MapPanel Window",
+        height: 400,
+        width: 600,
+        layout: "fit",
+        items: [{
+            xtype: "gx_mappanel",
+            id: "mappanel",
+            layers: [new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )],
+            extent: "-5,35,15,55"
+        }]
+    }).show();
+    
+    mapPanel = Ext.getCmp("mappanel");
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-tree.js	(revision 76)
@@ -0,0 +1,81 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[wms-tree]
+ *  WMS Capabilities Tree
+ *  ---------------------
+ *  Create a tree loader from WMS capabilities documents.
+ */
+var tree, mapPanel;
+
+Ext.onReady(function() {
+
+    var root = new Ext.tree.AsyncTreeNode({
+        text: 'GeoServer Demo WMS',
+        loader: new GeoExt.tree.WMSCapabilitiesLoader({
+            url: 'data/wmscap.xml',
+            layerOptions: {buffer: 0, singleTile: true, ratio: 1},
+            layerParams: {'TRANSPARENT': 'TRUE'},
+            // customize the createNode method to add a checkbox to nodes
+            createNode: function(attr) {
+                attr.checked = attr.leaf ? false : undefined;
+                return GeoExt.tree.WMSCapabilitiesLoader.prototype.createNode.apply(this, [attr]);
+            }
+        })
+    });
+
+    tree = new Ext.tree.TreePanel({
+        root: root,
+        region: 'west',
+        width: 250,
+        listeners: {
+            // Add layers to the map when ckecked, remove when unchecked.
+            // Note that this does not take care of maintaining the layer
+            // order on the map.
+            'checkchange': function(node, checked) { 
+                if (checked === true) {
+                    mapPanel.map.addLayer(node.attributes.layer); 
+                } else {
+                    mapPanel.map.removeLayer(node.attributes.layer);
+                }
+            }
+        }
+    });
+
+    mapPanel = new GeoExt.MapPanel({
+        zoom: 2,
+        layers: [
+            new OpenLayers.Layer.WMS("Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms", 
+                {layers: "bluemarble"},
+                {buffer: 0}
+            )
+        ],
+        region: 'center'
+    });
+
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            deferredRender: false,
+            items: [mapPanel, tree, {
+                contentEl: "desc",
+                region: "east",
+                bodyStyle: {"padding": "5px"},
+                collapsible: true,
+                collapseMode: "mini",
+                split: true,
+                width: 200,
+                title: "Description"
+            }]
+        }
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.html	(revision 76)
@@ -0,0 +1,31 @@
+<html>
+    <head>
+        <title>GeoExt PrintMapPanel Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-preview.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Using a Print Preview</h1>
+        <p>This example shows the how to create a printable PDF with
+        GeoExt.data.PrintProvider and GeoExt.PrintMapPanel, using the
+        <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://docs.geoserver.org/stable/en/user/community/printing/">GeoServer</a>
+        print module.</p>
+        <p>The js is not minified so it is readable. See <a href="print-preview.js">print-preview.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/attribute-form.js	(revision 76)
@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[attribute-form]
+ *  Attribute Form
+ *  --------------
+ *  Create a form with fields from attributes read from a WFS
+ *  DescribeFeatureType response
+ */
+
+var form;
+
+Ext.onReady(function() {
+    Ext.QuickTips.init();
+
+    // create attributes store
+    var attributeStore = new GeoExt.data.AttributeStore({
+        url: "data/describe_feature_type.xml"
+    });
+
+    form = new Ext.form.FormPanel({
+        renderTo: document.body,
+        autoScroll: true,
+        height: 300,
+        width: 350,
+        defaults: {
+            width: 120,
+            maxLengthText: "too long",
+            minLengthText: "too short"
+        },
+        plugins: [
+            new GeoExt.plugins.AttributeForm({
+                attributeStore: attributeStore
+            })
+        ]
+    });
+
+    attributeStore.load();
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.html	(revision 76)
@@ -0,0 +1,30 @@
+<html>
+    <head>
+        <title>GeoExt MapPanel Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="mappanel-div.js"></script>
+
+    </head>
+    <body>
+        <h1>GeoExt.MapPanel with an Existing OpenLayers.Map</h1>
+        <p>This example shows the how to create a MapPanel with a map that has
+        already been created.  See <a href="mappanel-window.html">mappanel-window.html</a>
+        for an example that creates the MapPanel without creating the map first.<p>
+        <p>This example makes use of a <code>CookieProvider</code>. The <code>MapPanel</code>
+        being a stateful component, if you reload the page the map should be
+        at the same location as previously. Also the <code>getState</code> and
+        <code>applyState</code> methods are overloaded so the size of the map
+        panel is also restored when refreshing the page.</p>
+        <p>The js is not minified so it is readable. See <a href="mappanel-div.js">mappanel-div.js</a>.</p>
+        <div id="mappanel"></div>
+        <input type="button" onclick="mapSizeUp()" value="bigger"></input>
+        <input type="button" onclick="mapSizeDown()" value="smaller"></input>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/search-form.js	(revision 76)
@@ -0,0 +1,86 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[search-form]
+ *  Filter Form Panel
+ *  -----------------
+ *  Use a form to build an OpenLayers filter.
+ */
+
+var formPanel;
+
+Ext.onReady(function() {
+
+    // create a protocol, this protocol is used by the form
+    // to send the search request, this protocol's read
+    // method received an OpenLayers.Filter instance,
+    // which is derived from the content of the form
+    var protocol = new OpenLayers.Protocol({
+        read: function(options) {
+            var f; html = [];
+
+            f = options.filter;
+            html.push([f.CLASS_NAME, ",", f.type, "<br />"].join(" "));
+
+            f = options.filter.filters[0];
+            html.push([f.CLASS_NAME, ",", f.type, ",",
+                       f.property, ":", f.value, "<br />"].join(" "));
+
+            f = options.filter.filters[1];
+            html.push([f.CLASS_NAME, ",", f.type, ", ",
+                       f.property, ": ", f.value].join(" "));
+
+            Ext.get("filter").update(html.join(""));
+
+        }
+    });
+
+    // create a GeoExt form panel (configured with an OpenLayers.Protocol
+    // instance)
+    formPanel = new GeoExt.form.FormPanel({
+        width: 300,
+        height: 200,
+        protocol: protocol,
+        items: [{
+            xtype: "textfield",
+            name: "name__like",
+            value: "foo",
+            fieldLabel: "name"
+        }, {
+            xtype: "textfield",
+            name: "elevation__ge",
+            value: "1200",
+            fieldLabel: "maximum elevation"
+        }],
+        listeners: {
+            actioncomplete: function(form, action) {
+                // this listener triggers when the search request
+                // is complete, the OpenLayers.Protocol.Response
+                // resulting from the request is available
+                // through "action.response"
+            }
+        }
+    });
+
+    formPanel.addButton({
+        text: "search",
+        handler: function() {
+            // trigger search request, the options passed to doAction
+            // are passed to the protocol's read method, so one
+            // can register a read callback here
+            var o = {
+                callback: function(response) {
+                }
+            };
+            this.search(o);
+        },
+        scope: formPanel
+    });
+
+    formPanel.render("formpanel");
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.html	(revision 76)
@@ -0,0 +1,28 @@
+<html>
+    <head>
+        <title>GeoExt Legend Panel</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="legendpanel.js"></script>
+
+        <style type="text/css">
+        .mylabel {
+            font-weight: bold;
+            color: red;
+        }
+        </style>
+    </head>
+    <body>
+        <h1>GeoExt.LegendPanel</h1>
+        <p>This example shows the how to create a LegendPanel that autopopulates with legends from a map
+        that has already been created.</p>
+        <p>The js is not minified so it is readable. See <a href="legendpanel.js">legendpanel.js</a>.</p>
+        <div id="view"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-page.js	(revision 76)
@@ -0,0 +1,72 @@
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-page]
+ *  Print Your Map
+ *  --------------
+ *  Print the visible extent of a MapPanel with PrintPage and PrintProvider.
+ */
+
+var mapPanel, printPage;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities // from the info.json script in the html
+    });
+    // Our print page. Tells the PrintProvider about the scale and center of
+    // our page.
+    printPage = new GeoExt.data.PrintPage({
+        printProvider: printProvider,
+        customParams: {
+            mapTitle: "Printing Demo",
+            comment: "This is a simple map printed from GeoExt."
+        }
+    });
+
+    // The map we want to print
+    mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 7
+    });
+    // The legend to optionally include on the printout
+    var legendPanel = new GeoExt.LegendPanel({
+        region: "west",
+        width: 150,
+        bodyStyle: "padding:5px",
+        layerStore: mapPanel.layers
+    });
+    
+    var includeLegend; // controlled by the "Include legend?" checkbox
+     
+    // The main panel
+    new Ext.Panel({
+        renderTo: "content",
+        layout: "border",
+        width: 700,
+        height: 420,
+        items: [mapPanel, legendPanel],
+        bbar: ["->", {
+            text: "Print",
+            handler: function() {
+                // convenient way to fit the print page to the visible map area
+                printPage.fit(mapPanel, true);
+                // print the page, optionally including the legend
+                printProvider.print(mapPanel, printPage, includeLegend && {legend: legendPanel});
+            }
+        }, {
+            xtype: "checkbox",
+            boxLabel: "Include legend?",
+            handler: function() {includeLegend = this.checked}
+        }]
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.html	(revision 76)
@@ -0,0 +1,33 @@
+<html>
+    <head>
+        <title>GeoExt Layer Tree</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="layercontainer.js"></script>
+
+    </head>
+    <body>
+        <h1>Layer Tree Example</h1>
+        <p>This is example that shows how create a TreePanel with layers
+        from a map.  GeoExt does not provide a LayerTree component.  Instead,
+        to create a tree with nodes that represent layers, create a tree with
+        a LayerContainer at the root, or add LayerNodes directly. See also the
+        <a href="tree.html">tree</a> example for a more complex tree
+        configuration</p>
+
+        <p>Note that the js is not minified so it is readable.
+        See <a href="layercontainer.js">layercontainer.js</a>.</p>
+
+        <div style="position: relative;">
+            <div id="capgrid"></div>
+            <div id="tree"></div>
+            <div id="mappanel"></div>
+        </div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview-osm.js	(revision 76)
@@ -0,0 +1,76 @@
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-preview-osm]
+ *  Printing OpenStreetMap
+ *  ----------------------------------------
+ *  PrintMapPanel with an OSM map.
+ */
+
+var mapPanel, printDialog;
+
+Ext.onReady(function() {
+    // The PrintProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // provide url instead for lazy loading
+        customParams: {
+            mapTitle: "GeoExt Printing Demo",
+            comment: "This demo shows how to use GeoExt.PrintMapPanel with OSM"
+        }
+    });
+    
+    // A MapPanel with a "Print..." button
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 500,
+        height: 350,
+        map: {
+            maxExtent: new OpenLayers.Bounds(
+                -128 * 156543.0339,
+                -128 * 156543.0339,
+                128 * 156543.0339,
+                128 * 156543.0339
+            ),
+            maxResolution: 156543.0339,
+            units: "m",
+            projection: "EPSG:900913"
+        },
+        layers: [new OpenLayers.Layer.OSM()],
+        /*layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],*/
+        center: [16314984.568391, -5095295.7603428],
+        zoom: 6,
+        bbar: [{
+            text: "Print...",
+            handler: function(){
+                // A window with the PrintMapPanel, which we can use to adjust
+                // the print extent before creating the pdf.
+                printDialog = new Ext.Window({
+                    title: "Print Preview",
+                    width: 350,
+                    autoHeight: true,
+                    items: [{
+                        xtype: "gx_printmappanel",
+                        // use only a PanPanel control
+                        map: {controls: [new OpenLayers.Control.PanPanel()]},
+                        sourceMap: mapPanel,
+                        printProvider: printProvider
+                    }],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function(){ printDialog.items.get(0).print(); }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.js	(revision 76)
@@ -0,0 +1,98 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[layeropacityslider]
+ *  Layer Opacity Slider
+ *  --------------------
+ *  Use a slider to control layer opacity.
+ */
+
+var panel1, panel2, wms, slider;
+
+Ext.onReady(function() {
+    
+    wms = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+
+    // create a map panel with an embedded slider
+    panel1 = new GeoExt.MapPanel({
+        title: "Map 1",
+        renderTo: "map1-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [wms],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_opacityslider",
+            layer: wms,
+            vertical: true,
+            height: 120,
+            x: 10,
+            y: 10,
+            plugins: new GeoExt.LayerOpacitySliderTip({template: '<div>Opacity: {opacity}%</div>'})
+        }]
+    });
+    // create a separate slider bound to the map but displayed elsewhere
+    slider = new GeoExt.LayerOpacitySlider({
+        layer: wms,
+        aggressive: true, 
+        width: 200,
+        isFormField: true,
+        inverse: true,
+        fieldLabel: "opacity",
+        renderTo: "slider",
+        plugins: new GeoExt.LayerOpacitySliderTip({template: '<div>Transparency: {opacity}%</div>'})
+    });
+        
+    var clone = wms.clone();
+    var wms2 = new OpenLayers.Layer.WMS(
+        "OpenLayers WMS",
+        "http://vmap0.tiles.osgeo.org/wms/vmap0",
+        {layers: 'basic'}
+    );
+    panel2 = new GeoExt.MapPanel({
+        title: "Map 2",
+        renderTo: "map2-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [wms2, clone],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_opacityslider",
+            layer: clone,
+            complementaryLayer: wms2,
+            changeVisibility: true,
+            aggressive: true,
+            vertical: true,
+            height: 120,
+            x: 10,
+            y: 10,
+            plugins: new GeoExt.LayerOpacitySliderTip()
+        }]
+    });
+    
+    var tree = new Ext.tree.TreePanel({
+        width: 145,
+        height: 300,
+        renderTo: "tree",
+        root: new GeoExt.tree.LayerContainer({
+            layerStore: panel2.layers,
+            expanded: true
+        })
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.html	(revision 76)
@@ -0,0 +1,23 @@
+<html>
+    <head>
+        <title>Permalink Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="permalink.js"></script>
+
+    </head>
+    <body>
+        <h1>Permalink</h1>
+        <p>This example shows how to generate permalinks with the current map position and visible layers.</p>
+        <p>The js is not minified so it is readable. See <a href="permalink.js">permalink.js</a>.</p>
+        <div id="mappanel"></div>
+        <h2>Permalink:</h2>
+        <div id="permalink"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-viewport.js	(revision 76)
@@ -0,0 +1,82 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-viewport]
+ *  Map Panel (in a Viewport)
+ *  -------------------------
+ *  Render a map panel in a viewport.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+
+    // if true a google layer is used, if false
+    // the bluemarble WMS layer is used
+    var google = false;
+
+    var options, layer;
+    var extent = new OpenLayers.Bounds(-5, 35, 15, 55);
+
+    if (google) {
+
+        options = {
+            projection: new OpenLayers.Projection("EPSG:900913"),
+            units: "m",
+            numZoomLevels: 18,
+            maxResolution: 156543.0339,
+            maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
+                                             20037508, 20037508.34)
+        };
+
+        layer = new OpenLayers.Layer.Google(
+            "Google Satellite",
+            {type: G_SATELLITE_MAP, sphericalMercator: true}
+        );
+
+        extent.transform(
+            new OpenLayers.Projection("EPSG:4326"), options.projection
+        );
+
+    } else {
+        layer = new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"},
+            {isBaseLayer: true}
+        );
+    }
+
+    var map = new OpenLayers.Map(options);
+
+    new Ext.Viewport({
+        layout: "border",
+        items: [{
+            region: "north",
+            contentEl: "title",
+            height: 50
+        }, {
+            region: "center",
+            id: "mappanel",
+            title: "Map",
+            xtype: "gx_mappanel",
+            map: map,
+            layers: [layer],
+            extent: extent,
+            split: true
+        }, {
+            region: "east",
+            title: "Description",
+            contentEl: "description",
+            width: 200,
+            split: true
+        }]
+    });
+
+    mapPanel = Ext.getCmp("mappanel");
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-preview.js	(revision 76)
@@ -0,0 +1,73 @@
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-preview]
+ *  Print Preview Window
+ *  --------------------
+ *  Use the PrintMapPanel for interactive print previews.
+ */
+
+var mapPanel, printDialog;
+
+Ext.onReady(function() {
+    // The PrintProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // provide url instead for lazy loading
+        customParams: {
+            mapTitle: "GeoExt Printing Demo",
+            comment: "This demo shows how to use GeoExt.PrintMapPanel"
+        }
+    });
+    
+    // A MapPanel with a "Print..." button
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 500,
+        height: 350,
+        map: {
+            maxExtent: new OpenLayers.Bounds(
+                143.835, -43.648,
+                148.479, -39.574
+            ),
+            maxResolution: 0.018140625,
+            projection: "EPSG:4326",
+            units: 'degrees'
+        },
+        layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"},
+            {singleTile: true, numZoomLevels: 8})],
+        center: [146.56, -41.56],
+        zoom: 0,
+        bbar: [{
+            text: "Print...",
+            handler: function(){
+                // A window with the PrintMapPanel, which we can use to adjust
+                // the print extent before creating the pdf.
+                printDialog = new Ext.Window({
+                    title: "Print Preview",
+                    layout: "fit",
+                    width: 350,
+                    autoHeight: true,
+                    items: [{
+                        xtype: "gx_printmappanel",
+                        sourceMap: mapPanel,
+                        printProvider: printProvider
+                    }],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function(){ printDialog.items.get(0).print(); }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/mappanel-div.js	(revision 76)
@@ -0,0 +1,65 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-div]
+ *  Map Panel
+ *  ---------
+ *  Render a map panel in any block level page element.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+    var map = new OpenLayers.Map();
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    map.addLayer(layer);
+
+    mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        stateId: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        // getState and applyState are overloaded so panel size
+        // can be stored and restored
+        getState: function() {
+            var state = GeoExt.MapPanel.prototype.getState.apply(this);
+            state.width = this.getSize().width;
+            state.height = this.getSize().height;
+            return state;
+        },
+        applyState: function(state) {
+            GeoExt.MapPanel.prototype.applyState.apply(this, arguments);
+            this.width = state.width;
+            this.height = state.height;
+        }
+    });
+});
+
+// functions for resizing the map panel
+function mapSizeUp() {
+    var size = mapPanel.getSize();
+    size.width += 40;
+    size.height += 40;
+    mapPanel.setSize(size);
+}
+function mapSizeDown() {
+    var size = mapPanel.getSize();
+    size.width -= 40;
+    size.height -= 40;
+    mapPanel.setSize(size);
+}
+
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.html	(revision 76)
@@ -0,0 +1,24 @@
+<html>
+    <head>
+        <title>GeoExt AttributeReader and AttributeStore</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="attributes.js"></script>
+
+    </head>
+    <body>
+        <h1>AttributeReader and AttributeStore</h1>
+        <p>This is example that shows how create an AttributeStore with
+        records read from a WFS DescribeFeatureType response.</p>
+
+        <p>Note that the js is not minified so it is readable.
+        See <a href="attributes.js">attributes.js</a>.</p>
+
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/legendpanel.js	(revision 76)
@@ -0,0 +1,129 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[legendpanel]
+ *  Legend Panel
+ *  ------------
+ *  Display a layer legend in a panel.
+ */
+
+
+var mapPanel, legendPanel;
+
+Ext.onReady(function() {
+    var map = new OpenLayers.Map({allOverlays: true});
+    map.addLayers([
+        new OpenLayers.Layer.WMS(
+            "Tasmania",
+            "http://demo.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_state_boundaries', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.WMS(
+            "Cities and Roads",
+            "http://demo.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_cities,topp:tasmania_roads', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.Vector('Polygons', {styleMap: new OpenLayers.StyleMap({
+                "default": new OpenLayers.Style({
+                    pointRadius: 8,
+                    fillColor: "#00ffee",
+                    strokeColor: "#000000",
+                    strokeWidth: 2
+                }) }) })
+    ]);
+    map.layers[2].addFeatures([
+        new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT(
+            "POLYGON(146.1 -41, 146.2 -41, 146.2 -41.1, 146.1 -41.1)"))
+    ]);
+    map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+    var addRemoveLayer = function() {
+        if(mapPanel.map.layers.indexOf(water) == -1) {
+            mapPanel.map.addLayer(water);
+        } else {
+            mapPanel.map.removeLayer(water);
+        }
+    };
+
+    var moveLayer = function(idx) {
+        var layer = layerRec0.getLayer();
+        var idx = mapPanel.map.layers.indexOf(layer) == 0 ?
+            mapPanel.map.layers.length : 0;
+        mapPanel.map.setLayerIndex(layerRec0.getLayer(), idx);
+    };
+
+    var toggleVisibility = function() {
+        var layer = layerRec1.getLayer();
+        layer.setVisibility(!layer.getVisibility());
+    };
+
+    var updateHideInLegend = function() {
+        layerRec0.set("hideInLegend", !layerRec0.get("hideInLegend"));
+    };
+
+    var updateLegendUrl = function() {
+        var url = layerRec0.get("legendURL");
+        layerRec0.set("legendURL", otherUrl);
+        otherUrl = url;
+    };
+
+    mapPanel = new GeoExt.MapPanel({
+        region: 'center',
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(146.4, -41.6),
+        zoom: 7
+    });
+    
+    // give the record of the 1st layer a legendURL, which will cause
+    // UrlLegend instead of WMSLegend to be used
+    var layerRec0 = mapPanel.layers.getAt(0);
+    layerRec0.set("legendURL", "http://demo.opengeo.org/geoserver/wms?FORMAT=image%2Fgif&TRANSPARENT=true&SERVICE=WMS&VERSION=1.1.1&REQUEST=GetLegendGraphic&EXCEPTIONS=application%2Fvnd.ogc.se_xml&LAYER=topp%3Atasmania_state_boundaries");
+
+    // store the layer that we will modify in toggleVis()
+    var layerRec1 = mapPanel.layers.getAt(1);
+
+    // stores another legendURL for the legendurl button action
+    var otherUrl = "http://www.geoext.org/trac/geoext/chrome/site/img/GeoExt.png";
+
+    // create another layer for the add/remove button action
+    var water = new OpenLayers.Layer.WMS("Bodies of Water",
+        "http://demo.opengeo.org/geoserver/wms?",
+        {layers: 'topp:tasmania_water_bodies', format: 'image/png', transparent: true},
+        {singleTile: true});
+
+    legendPanel = new GeoExt.LegendPanel({
+        defaults: {
+            labelCls: 'mylabel',
+            style: 'padding:5px'
+        },
+        bodyStyle: 'padding:5px',
+        width: 350,
+        autoScroll: true,
+        region: 'west'
+    });
+
+    new Ext.Panel({
+        title: "GeoExt LegendPanel Demo",
+        layout: 'border',
+        renderTo: 'view',
+        height: 400,
+        width: 800,
+        tbar: new Ext.Toolbar({
+            items: [
+                {text: 'add/remove', handler: addRemoveLayer},
+                {text: 'movetop/bottom', handler: moveLayer },
+                {text: 'togglevis', handler: toggleVisibility},
+                {text: 'hide/show', handler: updateHideInLegend},
+                {text: 'legendurl', handler: updateLegendUrl}
+            ]
+        }),
+        items: [legendPanel, mapPanel]
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/layercontainer.js	(revision 76)
@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[layercontainer]
+ *  Layer Tree
+ *  ----------
+ *  Create a layer tree with a LayerContainer.
+ */
+
+var store, tree, panel;
+Ext.onReady(function() {
+    
+    // create a new WMS capabilities store
+    store = new GeoExt.data.WMSCapabilitiesStore({
+        url: "data/wmscap.xml"
+    });
+    // load the store with records derived from the doc at the above url
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "WMS Capabilities",
+        store: store,
+        cm: new Ext.grid.ColumnModel([
+            {header: "Name", dataIndex: "name", sortable: true},
+            {id: "title", header: "Title", dataIndex: "title", sortable: true}
+        ]),
+        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
+        autoExpandColumn: "title",
+        renderTo: "capgrid",
+        height: 300,
+        width: 350,
+        floating: true,
+        x: 10,
+        y: 0,
+        bbar: ["->", {
+            text: "Add Layer",
+            handler: function() {
+                var record = grid.getSelectionModel().getSelected();
+                if(record) {
+                    var copy = record.copy();
+                    // Ext 3.X does not allow circular references in objects passed 
+                    // to record.set 
+                    copy.data["layer"] = record.getLayer();
+                    copy.getLayer().mergeNewParams({
+                        format: "image/png",
+                        transparent: "true"
+                    });
+                    panel.layers.add(copy);
+                    panel.map.zoomToExtent(
+                        OpenLayers.Bounds.fromArray(copy.get("llbbox"))
+                    );
+                }
+            }
+        }]
+    });
+    
+    // create a map panel
+    panel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        width: 350,
+        height: 300,
+        floating: true,
+        x: 570,
+        y: 0
+    });
+    
+    tree = new Ext.tree.TreePanel({
+        renderTo: "tree",
+        root: new GeoExt.tree.LayerContainer({
+            text: 'Map Layers',
+            layerStore: panel.layers,
+            leaf: false,
+            expanded: true
+        }),
+        enableDD: true,
+        width: 170,
+        height: 300,
+        floating: true,
+        x: 380,
+        y: 0
+    });
+    
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/permalink.js	(revision 76)
@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[permalink]
+ *  Permalink
+ *  ---------
+ *  Display a permalink each time the map changes position.
+ */
+
+var permalinkProvider;
+
+Ext.onReady(function() {
+
+    // set a permalink provider
+    permalinkProvider = new GeoExt.state.PermalinkProvider({encodeType: false});
+    Ext.state.Manager.setProvider(permalinkProvider);
+
+    var map = new OpenLayers.Map();
+    map.addLayers([
+        new OpenLayers.Layer.WMS(
+            "Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        ),
+        new OpenLayers.Layer.WMS(
+            "OSM",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "openstreetmap"}
+        )
+    ]);
+    map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+    var mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        stateId: "map",
+        prettyStateKeys: true
+    });
+
+    // update link when state chnages
+    var onStatechange = function(provider) {
+        var l = provider.getLink();
+        Ext.get("permalink").update("<a href=" + l + ">" + l + "</a>");
+    };
+    permalinkProvider.on({statechange: onStatechange});
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.html	(revision 76)
@@ -0,0 +1,31 @@
+<html>
+    <head>
+        <title>GeoExt PrintPageField and PrintProviderField Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-form.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Advanced Printing with Special Form Fields</h1>
+        <p>This example shows the how to accomplish advanced printing, with a
+        form controlling parameters for the
+        <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://docs.geoserver.org/stable/en/user/community/printing/">GeoServer</a>
+        print module.</p>
+        <p>The js is not minified so it is readable. See <a href="print-form.js">print-form.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/tmp/examples.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/tmp/examples.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/tmp/examples.js	(revision 76)
@@ -0,0 +1,2534 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[attribute-form]
+ *  Attribute Form
+ *  --------------
+ *  Create a form with fields from attributes read from a WFS
+ *  DescribeFeatureType response
+ */
+
+var form;
+
+Ext.onReady(function() {
+    Ext.QuickTips.init();
+
+    // create attributes store
+    var attributeStore = new GeoExt.data.AttributeStore({
+        url: "data/describe_feature_type.xml"
+    });
+
+    form = new Ext.form.FormPanel({
+        renderTo: document.body,
+        autoScroll: true,
+        height: 300,
+        width: 350,
+        defaults: {
+            width: 120,
+            maxLengthText: "too long",
+            minLengthText: "too short"
+        },
+        plugins: [
+            new GeoExt.plugins.AttributeForm({
+                attributeStore: attributeStore
+            })
+        ]
+    });
+
+    attributeStore.load();
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[attributes]
+ *  Attribute Store & Reader
+ *  ------------------------
+ *  Create records with attribute types and values with an AttributeStore.
+ */
+
+var store;
+Ext.onReady(function() {
+    
+    // create a new attributes store
+    store = new GeoExt.data.AttributeStore({
+        url: "data/describe_feature_type.xml"
+    });
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "Feature Attributes",
+        store: store,
+        cm: new Ext.grid.ColumnModel([
+            {id: "name", header: "Name", dataIndex: "name", sortable: true},
+            {id: "type", header: "Type", dataIndex: "type", sortable: true}
+        ]),
+        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
+        autoExpandColumn: "name",
+        renderTo: document.body,
+        height: 300,
+        width: 350
+    });    
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[feature-grid]
+ *  Grid with Features
+ *  ------------------
+ *  Synchronize selection of features between a grid and a layer.
+ */
+
+var mapPanel, store, gridPanel, mainPanel;
+
+Ext.onReady(function() {
+    // create map instance
+    var map = new OpenLayers.Map();
+    var wmsLayer = new OpenLayers.Layer.WMS(
+        "vmap0",
+        "http://vmap0.tiles.osgeo.org/wms/vmap0",
+        {layers: 'basic'}
+    );
+
+    // create vector layer
+    var vecLayer = new OpenLayers.Layer.Vector("vector");
+    map.addLayers([wmsLayer, vecLayer]);
+
+    // create map panel
+    mapPanel = new GeoExt.MapPanel({
+        title: "Map",
+        region: "center",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 6
+    });
+ 
+    // create feature store, binding it to the vector layer
+    store = new GeoExt.data.FeatureStore({
+        layer: vecLayer,
+        fields: [
+            {name: 'name', type: 'string'},
+            {name: 'elevation', type: 'float'}
+        ],
+        proxy: new GeoExt.data.ProtocolProxy({
+            protocol: new OpenLayers.Protocol.HTTP({
+                url: "data/summits.json",
+                format: new OpenLayers.Format.GeoJSON()
+            })
+        }),
+        autoLoad: true
+    });
+
+    // create grid panel configured with feature store
+    gridPanel = new Ext.grid.GridPanel({
+        title: "Feature Grid",
+        region: "east",
+        store: store,
+        width: 320,
+        columns: [{
+            header: "Name",
+            width: 200,
+            dataIndex: "name"
+        }, {
+            header: "Elevation",
+            width: 100,
+            dataIndex: "elevation"
+        }],
+        sm: new GeoExt.grid.FeatureSelectionModel() 
+    });
+
+    // create a panel and add the map panel and grid panel
+    // inside it
+    mainPanel = new Ext.Panel({
+        renderTo: "mainpanel",
+        layout: "border",
+        height: 400,
+        width: 920,
+        items: [mapPanel, gridPanel]
+    });
+});
+
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[layercontainer]
+ *  Layer Tree
+ *  ----------
+ *  Create a layer tree with a LayerContainer.
+ */
+
+var store, tree, panel;
+Ext.onReady(function() {
+    
+    // create a new WMS capabilities store
+    store = new GeoExt.data.WMSCapabilitiesStore({
+        url: "data/wmscap.xml"
+    });
+    // load the store with records derived from the doc at the above url
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "WMS Capabilities",
+        store: store,
+        cm: new Ext.grid.ColumnModel([
+            {header: "Name", dataIndex: "name", sortable: true},
+            {id: "title", header: "Title", dataIndex: "title", sortable: true}
+        ]),
+        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
+        autoExpandColumn: "title",
+        renderTo: "capgrid",
+        height: 300,
+        width: 350,
+        floating: true,
+        x: 10,
+        y: 0,
+        bbar: ["->", {
+            text: "Add Layer",
+            handler: function() {
+                var record = grid.getSelectionModel().getSelected();
+                if(record) {
+                    var copy = record.copy();
+                    // Ext 3.X does not allow circular references in objects passed 
+                    // to record.set 
+                    copy.data["layer"] = record.getLayer();
+                    copy.getLayer().mergeNewParams({
+                        format: "image/png",
+                        transparent: "true"
+                    });
+                    panel.layers.add(copy);
+                    panel.map.zoomToExtent(
+                        OpenLayers.Bounds.fromArray(copy.get("llbbox"))
+                    );
+                }
+            }
+        }]
+    });
+    
+    // create a map panel
+    panel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        width: 350,
+        height: 300,
+        floating: true,
+        x: 570,
+        y: 0
+    });
+    
+    tree = new Ext.tree.TreePanel({
+        renderTo: "tree",
+        root: new GeoExt.tree.LayerContainer({
+            text: 'Map Layers',
+            layerStore: panel.layers,
+            leaf: false,
+            expanded: true
+        }),
+        enableDD: true,
+        width: 170,
+        height: 300,
+        floating: true,
+        x: 380,
+        y: 0
+    });
+    
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[layeropacityslider]
+ *  Layer Opacity Slider
+ *  --------------------
+ *  Use a slider to control layer opacity.
+ */
+
+var panel1, panel2, wms, slider;
+
+Ext.onReady(function() {
+    
+    wms = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+
+    // create a map panel with an embedded slider
+    panel1 = new GeoExt.MapPanel({
+        title: "Map 1",
+        renderTo: "map1-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [wms],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_opacityslider",
+            layer: wms,
+            vertical: true,
+            height: 120,
+            x: 10,
+            y: 10,
+            plugins: new GeoExt.LayerOpacitySliderTip({template: '<div>Opacity: {opacity}%</div>'})
+        }]
+    });
+    // create a separate slider bound to the map but displayed elsewhere
+    slider = new GeoExt.LayerOpacitySlider({
+        layer: wms,
+        aggressive: true, 
+        width: 200,
+        isFormField: true,
+        inverse: true,
+        fieldLabel: "opacity",
+        renderTo: "slider",
+        plugins: new GeoExt.LayerOpacitySliderTip({template: '<div>Transparency: {opacity}%</div>'})
+    });
+        
+    var clone = wms.clone();
+    var wms2 = new OpenLayers.Layer.WMS(
+        "OpenLayers WMS",
+        "http://vmap0.tiles.osgeo.org/wms/vmap0",
+        {layers: 'basic'}
+    );
+    panel2 = new GeoExt.MapPanel({
+        title: "Map 2",
+        renderTo: "map2-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [wms2, clone],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_opacityslider",
+            layer: clone,
+            complementaryLayer: wms2,
+            changeVisibility: true,
+            aggressive: true,
+            vertical: true,
+            height: 120,
+            x: 10,
+            y: 10,
+            plugins: new GeoExt.LayerOpacitySliderTip()
+        }]
+    });
+    
+    var tree = new Ext.tree.TreePanel({
+        width: 145,
+        height: 300,
+        renderTo: "tree",
+        root: new GeoExt.tree.LayerContainer({
+            layerStore: panel2.layers,
+            expanded: true
+        })
+    });
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[legendpanel]
+ *  Legend Panel
+ *  ------------
+ *  Display a layer legend in a panel.
+ */
+
+
+var mapPanel, legendPanel;
+
+Ext.onReady(function() {
+    var map = new OpenLayers.Map({allOverlays: true});
+    map.addLayers([
+        new OpenLayers.Layer.WMS(
+            "Tasmania",
+            "http://demo.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_state_boundaries', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.WMS(
+            "Cities and Roads",
+            "http://demo.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_cities,topp:tasmania_roads', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.Vector('Polygons', {styleMap: new OpenLayers.StyleMap({
+                "default": new OpenLayers.Style({
+                    pointRadius: 8,
+                    fillColor: "#00ffee",
+                    strokeColor: "#000000",
+                    strokeWidth: 2
+                }) }) })
+    ]);
+    map.layers[2].addFeatures([
+        new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT(
+            "POLYGON(146.1 -41, 146.2 -41, 146.2 -41.1, 146.1 -41.1)"))
+    ]);
+    map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+    var addRemoveLayer = function() {
+        if(mapPanel.map.layers.indexOf(water) == -1) {
+            mapPanel.map.addLayer(water);
+        } else {
+            mapPanel.map.removeLayer(water);
+        }
+    };
+
+    var moveLayer = function(idx) {
+        var layer = layerRec0.getLayer();
+        var idx = mapPanel.map.layers.indexOf(layer) == 0 ?
+            mapPanel.map.layers.length : 0;
+        mapPanel.map.setLayerIndex(layerRec0.getLayer(), idx);
+    };
+
+    var toggleVisibility = function() {
+        var layer = layerRec1.getLayer();
+        layer.setVisibility(!layer.getVisibility());
+    };
+
+    var updateHideInLegend = function() {
+        layerRec0.set("hideInLegend", !layerRec0.get("hideInLegend"));
+    };
+
+    var updateLegendUrl = function() {
+        var url = layerRec0.get("legendURL");
+        layerRec0.set("legendURL", otherUrl);
+        otherUrl = url;
+    };
+
+    mapPanel = new GeoExt.MapPanel({
+        region: 'center',
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(146.4, -41.6),
+        zoom: 7
+    });
+    
+    // give the record of the 1st layer a legendURL, which will cause
+    // UrlLegend instead of WMSLegend to be used
+    var layerRec0 = mapPanel.layers.getAt(0);
+    layerRec0.set("legendURL", "http://demo.opengeo.org/geoserver/wms?FORMAT=image%2Fgif&TRANSPARENT=true&SERVICE=WMS&VERSION=1.1.1&REQUEST=GetLegendGraphic&EXCEPTIONS=application%2Fvnd.ogc.se_xml&LAYER=topp%3Atasmania_state_boundaries");
+
+    // store the layer that we will modify in toggleVis()
+    var layerRec1 = mapPanel.layers.getAt(1);
+
+    // stores another legendURL for the legendurl button action
+    var otherUrl = "http://www.geoext.org/trac/geoext/chrome/site/img/GeoExt.png";
+
+    // create another layer for the add/remove button action
+    var water = new OpenLayers.Layer.WMS("Bodies of Water",
+        "http://demo.opengeo.org/geoserver/wms?",
+        {layers: 'topp:tasmania_water_bodies', format: 'image/png', transparent: true},
+        {singleTile: true});
+
+    legendPanel = new GeoExt.LegendPanel({
+        defaults: {
+            labelCls: 'mylabel',
+            style: 'padding:5px'
+        },
+        bodyStyle: 'padding:5px',
+        width: 350,
+        autoScroll: true,
+        region: 'west'
+    });
+
+    new Ext.Panel({
+        title: "GeoExt LegendPanel Demo",
+        layout: 'border',
+        renderTo: 'view',
+        height: 400,
+        width: 800,
+        tbar: new Ext.Toolbar({
+            items: [
+                {text: 'add/remove', handler: addRemoveLayer},
+                {text: 'movetop/bottom', handler: moveLayer },
+                {text: 'togglevis', handler: toggleVisibility},
+                {text: 'hide/show', handler: updateHideInLegend},
+                {text: 'legendurl', handler: updateLegendUrl}
+            ]
+        }),
+        items: [legendPanel, mapPanel]
+    });
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-div]
+ *  Map Panel
+ *  ---------
+ *  Render a map panel in any block level page element.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+    var map = new OpenLayers.Map();
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    map.addLayer(layer);
+
+    mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        stateId: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        // getState and applyState are overloaded so panel size
+        // can be stored and restored
+        getState: function() {
+            var state = GeoExt.MapPanel.prototype.getState.apply(this);
+            state.width = this.getSize().width;
+            state.height = this.getSize().height;
+            return state;
+        },
+        applyState: function(state) {
+            GeoExt.MapPanel.prototype.applyState.apply(this, arguments);
+            this.width = state.width;
+            this.height = state.height;
+        }
+    });
+});
+
+// functions for resizing the map panel
+function mapSizeUp() {
+    var size = mapPanel.getSize();
+    size.width += 40;
+    size.height += 40;
+    mapPanel.setSize(size);
+}
+function mapSizeDown() {
+    var size = mapPanel.getSize();
+    size.width -= 40;
+    size.height -= 40;
+    mapPanel.setSize(size);
+}
+
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-viewport]
+ *  Map Panel (in a Viewport)
+ *  -------------------------
+ *  Render a map panel in a viewport.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+
+    // if true a google layer is used, if false
+    // the bluemarble WMS layer is used
+    var google = false;
+
+    var options, layer;
+    var extent = new OpenLayers.Bounds(-5, 35, 15, 55);
+
+    if (google) {
+
+        options = {
+            projection: new OpenLayers.Projection("EPSG:900913"),
+            units: "m",
+            numZoomLevels: 18,
+            maxResolution: 156543.0339,
+            maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
+                                             20037508, 20037508.34)
+        };
+
+        layer = new OpenLayers.Layer.Google(
+            "Google Satellite",
+            {type: G_SATELLITE_MAP, sphericalMercator: true}
+        );
+
+        extent.transform(
+            new OpenLayers.Projection("EPSG:4326"), options.projection
+        );
+
+    } else {
+        layer = new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"},
+            {isBaseLayer: true}
+        );
+    }
+
+    var map = new OpenLayers.Map(options);
+
+    new Ext.Viewport({
+        layout: "border",
+        items: [{
+            region: "north",
+            contentEl: "title",
+            height: 50
+        }, {
+            region: "center",
+            id: "mappanel",
+            title: "Map",
+            xtype: "gx_mappanel",
+            map: map,
+            layers: [layer],
+            extent: extent,
+            split: true
+        }, {
+            region: "east",
+            title: "Description",
+            contentEl: "description",
+            width: 200,
+            split: true
+        }]
+    });
+
+    mapPanel = Ext.getCmp("mappanel");
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[mappanel-window]
+ *  Map Panel (in a Window)
+ *  -------------------------
+ *  Render a map panel in a Window.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    new Ext.Window({
+        title: "GeoExt MapPanel Window",
+        height: 400,
+        width: 600,
+        layout: "fit",
+        items: [{
+            xtype: "gx_mappanel",
+            id: "mappanel",
+            layers: [new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )],
+            extent: "-5,35,15,55"
+        }]
+    }).show();
+    
+    mapPanel = Ext.getCmp("mappanel");
+});
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[permalink]
+ *  Permalink
+ *  ---------
+ *  Display a permalink each time the map changes position.
+ */
+
+var permalinkProvider;
+
+Ext.onReady(function() {
+
+    // set a permalink provider
+    permalinkProvider = new GeoExt.state.PermalinkProvider({encodeType: false});
+    Ext.state.Manager.setProvider(permalinkProvider);
+
+    var map = new OpenLayers.Map();
+    map.addLayers([
+        new OpenLayers.Layer.WMS(
+            "Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        ),
+        new OpenLayers.Layer.WMS(
+            "OSM",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "openstreetmap"}
+        )
+    ]);
+    map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+    var mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        stateId: "map",
+        prettyStateKeys: true
+    });
+
+    // update link when state chnages
+    var onStatechange = function(provider) {
+        var l = provider.getLink();
+        Ext.get("permalink").update("<a href=" + l + ">" + l + "</a>");
+    };
+    permalinkProvider.on({statechange: onStatechange});
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[popup-more]
+ *  Modifying Popups
+ *  ----------------
+ *  Update a popup with information from multiple locations.
+ */
+
+var mapPanel, popup;
+
+Ext.onReady(function() {
+
+    function addToPopup(loc) {
+
+        // create the popup if it doesn't exist
+        if (!popup) {
+            popup = new GeoExt.Popup({
+                title: "Popup",
+                width: 200,
+                maximizable: true,
+                collapsible: true,
+                map: mapPanel.map,
+                anchored: true,
+                listeners: {
+                    close: function() {
+                        // closing a popup destroys it, but our reference is truthy
+                        popup = null;
+                    }
+                }
+            });
+        }
+
+        // add some content to the popup (this can be any Ext component)
+        popup.add({
+            xtype: "box",
+            autoEl: {
+                html: "You clicked on (" + loc.lon.toFixed(2) + ", " + loc.lat.toFixed(2) + ")"
+            }
+        });
+
+        // reset the popup's location
+        popup.location = loc;
+        
+        popup.doLayout();
+
+        // since the popup is anchored, calling show will move popup to this location
+        popup.show();
+    }
+
+    // create Ext window including a map panel
+    var mapPanel = new GeoExt.MapPanel({
+        title: "Map",
+        renderTo: "container",
+        width: 650, height: 356,
+        layers: [
+            new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )
+        ],
+        center: [0, 0],
+        zoom: 2
+    });
+
+    var control = new OpenLayers.Control.Click({
+        trigger: function(evt) {
+            var loc = mapPanel.map.getLonLatFromViewPortPx(evt.xy);
+            addToPopup(loc);
+        }
+    });
+    
+    mapPanel.map.addControl(control);
+    control.activate();
+
+});
+
+// simple control to handle user clicks on the map
+
+OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
+
+    defaultHandlerOptions: {
+        single: true,
+        double: false,
+        pixelTolerance: 0,
+        stopSingle: true
+    },
+
+    initialize: function(options) {
+
+        this.handlerOptions = OpenLayers.Util.extend(
+            options && options.handlerOptions || {}, 
+            this.defaultHandlerOptions
+        );
+        OpenLayers.Control.prototype.initialize.apply(
+            this, arguments
+        ); 
+        this.handler = new OpenLayers.Handler.Click(
+            this, 
+            {
+                click: this.trigger
+            }, 
+            this.handlerOptions
+        );
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.Click"
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[popup]
+ *  Feature Popup
+ *  -------------
+ *  Display a popup with feature information.
+ */
+
+var mapPanel, popup;
+
+Ext.onReady(function() {
+
+    // create a vector layer, add a feature into it
+    var vectorLayer = new OpenLayers.Layer.Vector("vector");
+    vectorLayer.addFeatures(
+        new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(-45, 5)
+        )
+    );
+
+    // create select feature control
+    var selectCtrl = new OpenLayers.Control.SelectFeature(vectorLayer);
+
+    // define "createPopup" function
+    var bogusMarkup = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit.";
+    function createPopup(feature) {
+        popup = new GeoExt.Popup({
+            title: 'My Popup',
+            location: feature,
+            width:200,
+            html: bogusMarkup,
+            maximizable: true,
+            collapsible: true
+        });
+        // unselect feature when the popup
+        // is closed
+        popup.on({
+            close: function() {
+                if(OpenLayers.Util.indexOf(vectorLayer.selectedFeatures,
+                                           this.feature) > -1) {
+                    selectCtrl.unselect(this.feature);
+                }
+            }
+        });
+        popup.show();
+    }
+
+    // create popup on "featureselected"
+    vectorLayer.events.on({
+        featureselected: function(e) {
+            createPopup(e.feature);
+        }
+    });
+
+    // create Ext window including a map panel
+    var mapwin = new Ext.Window({
+        layout: "fit",
+        title: "Map",
+        closeAction: "hide",
+        width: 650,
+        height: 356,
+        x: 50,
+        y: 100,
+        items: {
+            xtype: "gx_mappanel",
+            region: "center",
+            layers: [
+                new OpenLayers.Layer.WMS( 
+                    "OpenLayers WMS",
+                    "http://vmap0.tiles.osgeo.org/wms/vmap0",
+                    {layers: 'basic'} ),
+                vectorLayer
+            ]
+        }
+    });
+    mapwin.show();
+
+    mapPanel = mapwin.items.get(0);
+    mapPanel.map.addControl(selectCtrl);
+    selectCtrl.activate();
+});
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-extent]
+ *  Interactive Print Extent
+ *  ------------------------
+ *  Change print scale, center and rotation with the PrintExtent plugin.
+ */
+
+var mapPanel, printProvider;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // from the info.json script in the html
+        customParams: {
+            mapTitle: "Printing Demo",
+            comment: "This is a map printed from GeoExt."
+        }
+    });
+
+    var printExtent = new GeoExt.plugins.PrintExtent({
+        printProvider: printProvider
+    });
+
+    // The map we want to print, with the PrintExtent added as item.
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 450,
+        height: 320,
+        layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 6,
+        plugins: [printExtent],
+        bbar: [{
+            text: "Create PDF",
+            handler: function() {
+                // the PrintExtent plugin is the mapPanel's 1st plugin
+                mapPanel.plugins[0].print();
+            }
+        }]
+    });
+    printExtent.addPage();
+});
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-form]
+ *  Print Configuration with a Form
+ *  -------------------------------
+ *  Use form field plugins to control print output.
+ */
+
+var mapPanel, printPage;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // from the info.json script in the html
+        customParams: {
+            mapTitle: "Printing Demo"
+        }
+    });
+    // Our print page. Stores scale, center and rotation and gives us a page
+    // extent feature that we can add to a layer.
+    printPage = new GeoExt.data.PrintPage({
+        printProvider: printProvider
+    });
+    // A layer to display the print page extent
+    var pageLayer = new OpenLayers.Layer.Vector();
+    pageLayer.addFeatures(printPage.feature);
+
+    // The map we want to print
+    mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        map: {
+            eventListeners: {
+                // recenter/resize page extent after pan/zoom
+                "moveend": function(){ printPage.fit(this, {mode: "screen"}); }
+            }
+        },
+        layers: [
+            new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+                {layers: "topp:tasmania_state_boundaries"}, {singleTile: true}),
+            pageLayer
+        ],
+        center: [146.56, -41.56],
+        zoom: 6
+    });
+    // The form with fields controlling the print output
+    var formPanel = new Ext.form.FormPanel({
+        region: "west",
+        width: 150,
+        bodyStyle: "padding:5px",
+        labelAlign: "top",
+        defaults: {anchor: "100%"},
+        items: [{
+            xtype: "textarea",
+            name: "comment",
+            value: "",
+            fieldLabel: "Comment",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "combo",
+            store: printProvider.layouts,
+            displayField: "name",
+            fieldLabel: "Layout",
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            })
+        }, {
+            xtype: "combo",
+            store: printProvider.dpis,
+            displayField: "name",
+            fieldLabel: "Resolution",
+            tpl: '<tpl for="."><div class="x-combo-list-item">{name} dpi</div></tpl>',
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            }),
+            // the plugin will work even if we modify a combo value
+            setValue: function(v) {
+                v = parseInt(v) + " dpi";
+                Ext.form.ComboBox.prototype.setValue.apply(this, arguments);
+            }
+        }, {
+            xtype: "combo",
+            store: printProvider.scales,
+            displayField: "name",
+            fieldLabel: "Scale",
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "textfield",
+            name: "rotation",
+            fieldLabel: "Rotation",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }],
+        buttons: [{
+            text: "Create PDF",
+            handler: function() {
+                printProvider.print(mapPanel, printPage);
+            }
+        }]
+    });
+     
+    // The main panel
+    new Ext.Panel({
+        renderTo: "content",
+        layout: "border",
+        width: 700,
+        height: 420,
+        items: [mapPanel, formPanel]
+    });
+});
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-page]
+ *  Print Your Map
+ *  --------------
+ *  Print the visible extent of a MapPanel with PrintPage and PrintProvider.
+ */
+
+var mapPanel, printPage;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities // from the info.json script in the html
+    });
+    // Our print page. Tells the PrintProvider about the scale and center of
+    // our page.
+    printPage = new GeoExt.data.PrintPage({
+        printProvider: printProvider,
+        customParams: {
+            mapTitle: "Printing Demo",
+            comment: "This is a simple map printed from GeoExt."
+        }
+    });
+
+    // The map we want to print
+    mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 7
+    });
+    // The legend to optionally include on the printout
+    var legendPanel = new GeoExt.LegendPanel({
+        region: "west",
+        width: 150,
+        bodyStyle: "padding:5px",
+        layerStore: mapPanel.layers
+    });
+    
+    var includeLegend; // controlled by the "Include legend?" checkbox
+     
+    // The main panel
+    new Ext.Panel({
+        renderTo: "content",
+        layout: "border",
+        width: 700,
+        height: 420,
+        items: [mapPanel, legendPanel],
+        bbar: ["->", {
+            text: "Print",
+            handler: function() {
+                // convenient way to fit the print page to the visible map area
+                printPage.fit(mapPanel, true);
+                // print the page, optionally including the legend
+                printProvider.print(mapPanel, printPage, includeLegend && {legend: legendPanel});
+            }
+        }, {
+            xtype: "checkbox",
+            boxLabel: "Include legend?",
+            handler: function() {includeLegend = this.checked}
+        }]
+    });
+});
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-preview-osm]
+ *  Printing OpenStreetMap
+ *  ----------------------------------------
+ *  PrintMapPanel with an OSM map.
+ */
+
+var mapPanel, printDialog;
+
+Ext.onReady(function() {
+    // The PrintProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // provide url instead for lazy loading
+        customParams: {
+            mapTitle: "GeoExt Printing Demo",
+            comment: "This demo shows how to use GeoExt.PrintMapPanel with OSM"
+        }
+    });
+    
+    // A MapPanel with a "Print..." button
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 500,
+        height: 350,
+        map: {
+            maxExtent: new OpenLayers.Bounds(
+                -128 * 156543.0339,
+                -128 * 156543.0339,
+                128 * 156543.0339,
+                128 * 156543.0339
+            ),
+            maxResolution: 156543.0339,
+            units: "m",
+            projection: "EPSG:900913"
+        },
+        layers: [new OpenLayers.Layer.OSM()],
+        /*layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],*/
+        center: [16314984.568391, -5095295.7603428],
+        zoom: 6,
+        bbar: [{
+            text: "Print...",
+            handler: function(){
+                // A window with the PrintMapPanel, which we can use to adjust
+                // the print extent before creating the pdf.
+                printDialog = new Ext.Window({
+                    title: "Print Preview",
+                    width: 350,
+                    autoHeight: true,
+                    items: [{
+                        xtype: "gx_printmappanel",
+                        // use only a PanPanel control
+                        map: {controls: [new OpenLayers.Control.PanPanel()]},
+                        sourceMap: mapPanel,
+                        printProvider: printProvider
+                    }],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function(){ printDialog.items.get(0).print(); }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+}); /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-preview]
+ *  Print Preview Window
+ *  --------------------
+ *  Use the PrintMapPanel for interactive print previews.
+ */
+
+var mapPanel, printDialog;
+
+Ext.onReady(function() {
+    // The PrintProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // provide url instead for lazy loading
+        customParams: {
+            mapTitle: "GeoExt Printing Demo",
+            comment: "This demo shows how to use GeoExt.PrintMapPanel"
+        }
+    });
+    
+    // A MapPanel with a "Print..." button
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 500,
+        height: 350,
+        map: {
+            maxExtent: new OpenLayers.Bounds(
+                143.835, -43.648,
+                148.479, -39.574
+            ),
+            maxResolution: 0.018140625,
+            projection: "EPSG:4326",
+            units: 'degrees'
+        },
+        layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"},
+            {singleTile: true, numZoomLevels: 8})],
+        center: [146.56, -41.56],
+        zoom: 0,
+        bbar: [{
+            text: "Print...",
+            handler: function(){
+                // A window with the PrintMapPanel, which we can use to adjust
+                // the print extent before creating the pdf.
+                printDialog = new Ext.Window({
+                    title: "Print Preview",
+                    layout: "fit",
+                    width: 350,
+                    autoHeight: true,
+                    items: [{
+                        xtype: "gx_printmappanel",
+                        sourceMap: mapPanel,
+                        printProvider: printProvider
+                    }],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function(){ printDialog.items.get(0).print(); }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+});/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[renderer]
+ *  Feature Renderer
+ *  ----------------
+ *  Render a vector feature with multiple symbolizers in a box component.
+ */
+
+var blue = {
+    fillColor: "blue",
+    fillOpacity: 0.25,
+    strokeColor: "blue",
+    strokeWidth: 2,
+    pointRadius: 5
+};
+
+var custom = {
+    point: {
+        graphicName: "star",
+        pointRadius: 8,
+        fillColor: "yellow",
+        strokeColor: "red",
+        strokeWidth: 1
+    },
+    line: {
+        strokeColor: "#669900",
+        strokeWidth: 3
+    },
+    poly: {
+        fillColor: "olive",
+        fillOpacity: 0.25,
+        strokeColor: "#666666",
+        strokeWidth: 2,
+        strokeDashstyle: "dot"
+    }
+};
+
+var stacked = {
+    point: [{
+        pointRadius: 8,
+        fillColor: "white",
+        strokeColor: "red",
+        strokeWidth: 2
+    }, {
+        graphicName: "star",
+        pointRadius: 5,
+        fillColor: "red"
+    }],
+    line: [{
+        strokeColor: "red",
+        strokeWidth: 5
+    }, {
+        strokeColor: "#ff9933",
+        strokeWidth: 2
+    }],
+    poly: [{
+        strokeWidth: 3,
+        fillColor: "white",
+        strokeColor: "#669900"
+    }, {
+        strokeWidth: 2,
+        fillOpacity: 0,
+        strokeColor: "red",
+        strokeDashstyle: "dot"
+    }]
+};
+
+var configs = [{
+    symbolType: "Point",
+    renderTo: "point_default"
+}, {
+    symbolType: "Line",
+    renderTo: "line_default"
+}, {
+    symbolType: "Polygon",
+    renderTo: "poly_default"
+}, {
+    symbolType: "Point",
+    symbolizers: [blue],
+    renderTo: "point_blue"
+}, {
+    symbolType: "Line",
+    symbolizers: [blue],
+    renderTo: "line_blue"
+}, {
+    symbolType: "Polygon",
+    symbolizers: [blue],
+    renderTo: "poly_blue"
+}, {
+    symbolType: "Point",
+    symbolizers: [custom.point],
+    renderTo: "point_custom"
+}, {
+    symbolType: "Line",
+    symbolizers: [custom.line],
+    renderTo: "line_custom"
+}, {
+    symbolType: "Polygon",
+    symbolizers: [custom.poly],
+    renderTo: "poly_custom"
+}, {
+    symbolType: "Point",
+    symbolizers: stacked.point,
+    renderTo: "point_stacked"
+}, {
+    symbolType: "Line",
+    symbolizers: stacked.line,
+    renderTo: "line_stacked"
+}, {
+    symbolType: "Polygon",
+    symbolizers: stacked.poly,
+    renderTo: "poly_stacked"
+}];
+
+Ext.onReady(function() {        
+    for(var i=0; i<configs.length; ++i) {
+        new GeoExt.FeatureRenderer(configs[i]);
+    }
+    $("render").onclick = render;
+});
+
+var format = new OpenLayers.Format.WKT();
+var renderer, win;
+function render() {
+    var wkt = $("wkt").value;
+    var feature;
+    try {
+        feature = format.read(wkt)
+    } catch(err) {
+        $("wkt").value = "Bad WKT: " + err;
+    }
+    var symbolizers;
+    try {
+        var value = $("symbolizers").value;
+        symbolizers = eval("(" + value + ")");
+        if (!symbolizers || symbolizers.constructor !== Array) {
+            throw "Must be an array literal";
+        }
+    } catch(err) {
+        $("symbolizers").value = "Bad symbolizers: " + err + "\n\n" + value;
+        symbolizers = null;
+    }
+    if(feature && symbolizers) {
+        if(!win) {
+            renderer = new GeoExt.FeatureRenderer({
+                feature: feature,
+                symbolizers: symbolizers,
+                width: 150,
+                style: {margin: 4}
+            });
+            win = new Ext.Window({
+                closeAction: "hide",
+                layout: "fit",
+                width: 175,
+                items: [renderer]
+            });
+        } else {
+            renderer.update({
+                feature: feature,
+                symbolizers: symbolizers
+            });
+        }
+        win.show();
+    }
+}
+
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[search-form]
+ *  Filter Form Panel
+ *  -----------------
+ *  Use a form to build an OpenLayers filter.
+ */
+
+var formPanel;
+
+Ext.onReady(function() {
+
+    // create a protocol, this protocol is used by the form
+    // to send the search request, this protocol's read
+    // method received an OpenLayers.Filter instance,
+    // which is derived from the content of the form
+    var protocol = new OpenLayers.Protocol({
+        read: function(options) {
+            var f; html = [];
+
+            f = options.filter;
+            html.push([f.CLASS_NAME, ",", f.type, "<br />"].join(" "));
+
+            f = options.filter.filters[0];
+            html.push([f.CLASS_NAME, ",", f.type, ",",
+                       f.property, ":", f.value, "<br />"].join(" "));
+
+            f = options.filter.filters[1];
+            html.push([f.CLASS_NAME, ",", f.type, ", ",
+                       f.property, ": ", f.value].join(" "));
+
+            Ext.get("filter").update(html.join(""));
+
+        }
+    });
+
+    // create a GeoExt form panel (configured with an OpenLayers.Protocol
+    // instance)
+    formPanel = new GeoExt.form.FormPanel({
+        width: 300,
+        height: 200,
+        protocol: protocol,
+        items: [{
+            xtype: "textfield",
+            name: "name__like",
+            value: "foo",
+            fieldLabel: "name"
+        }, {
+            xtype: "textfield",
+            name: "elevation__ge",
+            value: "1200",
+            fieldLabel: "maximum elevation"
+        }],
+        listeners: {
+            actioncomplete: function(form, action) {
+                // this listener triggers when the search request
+                // is complete, the OpenLayers.Protocol.Response
+                // resulting from the request is available
+                // through "action.response"
+            }
+        }
+    });
+
+    formPanel.addButton({
+        text: "search",
+        handler: function() {
+            // trigger search request, the options passed to doAction
+            // are passed to the protocol's read method, so one
+            // can register a read callback here
+            var o = {
+                callback: function(response) {
+                }
+            };
+            this.search(o);
+        },
+        scope: formPanel
+    });
+
+    formPanel.render("formpanel");
+});
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.onReady(function(){
+
+    new Ext.Slider({
+        renderTo: "tip-slider",
+        width: 214,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip()
+    });
+
+    new Ext.Slider({
+        renderTo: "custom-tip-slider",
+        width: 214,
+        increment: 10,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip({
+            getText: function(thumb){
+                return String.format("<b>{0}% complete</b>", thumb.value);
+            }
+        })
+    });
+
+    new Ext.Slider({
+        renderTo: "no-hover-tip",
+        width: 214,
+        increment: 10,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip({hover: false})
+    });
+    
+    new Ext.Slider({
+        renderTo: "multi-slider-horizontal",
+        width   : 214,
+        minValue: 0,
+        maxValue: 100,
+        values  : [10, 50, 90],
+        plugins : new GeoExt.SliderTip()
+    });
+    
+    new Ext.Slider({
+        renderTo : "multi-slider-vertical",
+        vertical : true,
+        height   : 214,
+        minValue: 0,
+        maxValue: 100,
+        values  : [10, 50, 90],
+        plugins : new GeoExt.SliderTip()
+    });
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[toolbar]
+ *  Toolbar with Actions
+ *  --------------------
+ *  Create a toolbar with GeoExt Actions.
+ */
+
+Ext.onReady(function() {
+    Ext.QuickTips.init();
+
+    var map = new OpenLayers.Map();
+    var wms = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    var vector = new OpenLayers.Layer.Vector("vector");
+    map.addLayers([wms, vector]);
+    
+    var ctrl, toolbarItems = [], action, actions = {};
+
+    // ZoomToMaxExtent control, a "button" control
+    action = new GeoExt.Action({
+        control: new OpenLayers.Control.ZoomToMaxExtent(),
+        map: map,
+        text: "max extent",
+        tooltip: "zoom to max extent"
+    });
+    actions["max_extent"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // Navigation control and DrawFeature controls
+    // in the same toggle group
+    action = new GeoExt.Action({
+        text: "nav",
+        control: new OpenLayers.Control.Navigation(),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        pressed: true,
+        tooltip: "navigate",
+        // check item options
+        group: "draw",
+        checked: true
+    });
+    actions["nav"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "draw poly",
+        control: new OpenLayers.Control.DrawFeature(
+            vector, OpenLayers.Handler.Polygon
+        ),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        tooltip: "draw polygon",
+        // check item options
+        group: "draw"
+    });
+    actions["draw_poly"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "draw line",
+        control: new OpenLayers.Control.DrawFeature(
+            vector, OpenLayers.Handler.Path
+        ),
+        map: map,
+        // button options
+        toggleGroup: "draw",
+        allowDepress: false,
+        tooltip: "draw line",
+        // check item options
+        group: "draw"
+    });
+    actions["draw_line"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // SelectFeature control, a "toggle" control
+    action = new GeoExt.Action({
+        text: "select",
+        control: new OpenLayers.Control.SelectFeature(vector, {
+            type: OpenLayers.Control.TYPE_TOGGLE,
+            hover: true
+        }),
+        map: map,
+        // button options
+        enableToggle: true,
+        tooltip: "select feature"
+    });
+    actions["select"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("-");
+
+    // Navigation history - two "button" controls
+    ctrl = new OpenLayers.Control.NavigationHistory();
+    map.addControl(ctrl);
+
+    action = new GeoExt.Action({
+        text: "previous",
+        control: ctrl.previous,
+        disabled: true,
+        tooltip: "previous in history"
+    });
+    actions["previous"] = action;
+    toolbarItems.push(action);
+
+    action = new GeoExt.Action({
+        text: "next",
+        control: ctrl.next,
+        disabled: true,
+        tooltip: "next in history"
+    });
+    actions["next"] = action;
+    toolbarItems.push(action);
+    toolbarItems.push("->");
+
+    // Reuse the GeoExt.Action objects created above
+    // as menu items
+    toolbarItems.push({
+        text: "menu",
+        menu: new Ext.menu.Menu({
+            items: [
+                // ZoomToMaxExtent
+                actions["max_extent"],
+                // Nav
+                new Ext.menu.CheckItem(actions["nav"]),
+                // Draw poly
+                new Ext.menu.CheckItem(actions["draw_poly"]),
+                // Draw line
+                new Ext.menu.CheckItem(actions["draw_line"]),
+                // Select control
+                new Ext.menu.CheckItem(actions["select"]),
+                // Navigation history control
+                actions["previous"],
+                actions["next"]
+            ]
+        })
+    });
+
+    var mapPanel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        tbar: toolbarItems
+    });
+});
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+ /** api: example[tree-legend]
+  *  Tree Legend
+  *  -----------
+  *  Render layer nodes with legends.
+  */
+
+// custom layer node UI class
+var LayerNodeUI = Ext.extend(
+    GeoExt.tree.LayerNodeUI,
+    new GeoExt.tree.TreeNodeUIEventMixin()
+);
+
+Ext.onReady(function() {
+    var mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        center: [146.1569825, -41.6109735],
+        zoom: 6,
+        layers: [
+            new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_state_boundaries"
+                }, {
+                    buffer: 0,
+                    // exclude this layer from layer container nodes
+                    displayInLayerSwitcher: false
+               }),
+            new OpenLayers.Layer.WMS("Water",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_water_bodies",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                }),
+            new OpenLayers.Layer.WMS("Cities",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_cities",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                }),
+            new OpenLayers.Layer.WMS("Tasmania Roads",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_roads",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    buffer: 0
+                })
+        ]
+    });
+
+    var tree = new Ext.tree.TreePanel({
+        region: "east",
+        title: "Layers",
+        width: 250,
+        autoScroll: true,
+        enableDD: true,
+        // apply the tree node component plugin to layer nodes
+        plugins: [{
+            ptype: "gx_treenodecomponent"
+        }],
+        loader: {
+            applyLoader: false,
+            uiProviders: {
+                "custom_ui": LayerNodeUI
+            }
+        },
+        root: {
+            nodeType: "gx_layercontainer",
+            loader: {
+                baseAttrs: {
+                    uiProvider: "custom_ui"
+                },
+                createNode: function(attr) {
+                    // add a WMS legend to each node created
+                    attr.component = {
+                        xtype: "gx_wmslegend",
+                        layerRecord: mapPanel.layers.getByLayer(attr.layer),
+                        showTitle: false,
+                        // custom class for css positioning
+                        // see tree-legend.html
+                        cls: "legend"
+                    }
+                    return GeoExt.tree.LayerLoader.prototype.createNode.call(this, attr);
+                }
+            }
+        },
+        rootVisible: false,
+        lines: false
+    });
+
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            items: [
+                mapPanel, tree, {
+                    contentEl: desc,
+                    region: "west",
+                    width: 250,
+                    bodyStyle: {padding: "5px"}
+                }
+            ]
+        }
+    });
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[tree]
+ *  Tree Nodes
+ *  ----------
+ *  Create all kinds of tree nodes.
+ */
+
+var mapPanel, tree;
+Ext.onReady(function() {
+    // create a map panel with some layers that we will show in our layer tree
+    // below.
+    mapPanel = new GeoExt.MapPanel({
+        border: true,
+        region: "center",
+        // we do not want all overlays, to try the OverlayLayerContainer
+        map: new OpenLayers.Map({allOverlays: false}),
+        center: [146.1569825, -41.6109735],
+        zoom: 6,
+        layers: [
+            new OpenLayers.Layer.WMS("Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms", {
+                    layers: "bluemarble"
+                }, {
+                    buffer: 0,
+                    visibility: false
+                }
+            ),
+            new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_state_boundaries"
+                }, {
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Water",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_water_bodies",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Cities",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_cities",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            new OpenLayers.Layer.WMS("Tasmania Roads",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: "topp:tasmania_roads",
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0
+                }
+            ),
+            // create a group layer (with several layers in the "layers" param)
+            // to show how the LayerParamLoader works
+            new OpenLayers.Layer.WMS("Tasmania (Group Layer)",
+                "http://demo.opengeo.org/geoserver/wms", {
+                    layers: [
+                        "topp:tasmania_state_boundaries",
+                        "topp:tasmania_water_bodies",
+                        "topp:tasmania_cities",
+                        "topp:tasmania_roads"
+                    ],
+                    transparent: true,
+                    format: "image/gif"
+                }, {
+                    isBaseLayer: false,
+                    buffer: 0,
+                    // exclude this layer from layer container nodes
+                    displayInLayerSwitcher: false,
+                    visibility: false
+                }
+            )
+        ]
+    });
+
+    // create our own layer node UI class, using the TreeNodeUIEventMixin
+    var LayerNodeUI = Ext.extend(GeoExt.tree.LayerNodeUI, new GeoExt.tree.TreeNodeUIEventMixin());
+        
+    // using OpenLayers.Format.JSON to create a nice formatted string of the
+    // configuration for editing it in the UI
+    var treeConfig = new OpenLayers.Format.JSON().write([{
+        nodeType: "gx_baselayercontainer"
+    }, {
+        nodeType: "gx_overlaylayercontainer",
+        expanded: true,
+        // render the nodes inside this container with a radio button,
+        // and assign them the group "foo".
+        loader: {
+            baseAttrs: {
+                radioGroup: "foo",
+                uiProvider: "layernodeui"
+            }
+        }
+    }, {
+        nodeType: "gx_layer",
+        layer: "Tasmania (Group Layer)",
+        isLeaf: false,
+        // create subnodes for the layers in the LAYERS param. If we assign
+        // a loader to a LayerNode and do not provide a loader class, a
+        // LayerParamLoader will be assumed.
+        loader: {
+            param: "LAYERS"
+        }
+    }], true);
+
+    // create the tree with the configuration from above
+    tree = new Ext.tree.TreePanel({
+        border: true,
+        region: "west",
+        title: "Layers",
+        width: 200,
+        split: true,
+        collapsible: true,
+        collapseMode: "mini",
+        autoScroll: true,
+        plugins: [
+            new GeoExt.plugins.TreeNodeRadioButton({
+                listeners: {
+                    "radiochange": function(node) {
+                        alert(node.text + " is now the active layer.");
+                    }
+                }
+            })
+        ],
+        loader: new Ext.tree.TreeLoader({
+            // applyLoader has to be set to false to not interfer with loaders
+            // of nodes further down the tree hierarchy
+            applyLoader: false,
+            uiProviders: {
+                "layernodeui": LayerNodeUI
+            }
+        }),
+        root: {
+            nodeType: "async",
+            // the children property of an Ext.tree.AsyncTreeNode is used to
+            // provide an initial set of layer nodes. We use the treeConfig
+            // from above, that we created with OpenLayers.Format.JSON.write.
+            children: Ext.decode(treeConfig)
+        },
+        listeners: {
+            "radiochange": function(node){
+                alert(node.layer.name + " is now the the active layer.");
+            }
+        },
+        rootVisible: false,
+        lines: false,
+        bbar: [{
+            text: "Show/Edit Tree Config",
+            handler: function() {
+                treeConfigWin.show();
+                Ext.getCmp("treeconfig").setValue(treeConfig);
+            }
+        }]
+    });
+
+    // dialog for editing the tree configuration
+    var treeConfigWin = new Ext.Window({
+        layout: "fit",
+        hideBorders: true,
+        closeAction: "hide",
+        width: 300,
+        height: 400,
+        title: "Tree Configuration",
+        items: [{
+            xtype: "form",
+            layout: "fit",
+            items: [{
+                id: "treeconfig",
+                xtype: "textarea"
+            }],
+            buttons: [{
+                text: "Save",
+                handler: function() {
+                    var value = Ext.getCmp("treeconfig").getValue()
+                    try {
+                        var root = tree.getRootNode();
+                        root.attributes.children = Ext.decode(value);
+                        tree.getLoader().load(root);
+                    } catch(e) {
+                        alert("Invalid JSON");
+                        return;
+                    }
+                    treeConfig = value;
+                    treeConfigWin.hide();
+                }
+            }, {
+                text: "Cancel",
+                handler: function() {
+                    treeConfigWin.hide();
+                }
+            }]
+        }]
+    });
+    
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            deferredRender: false,
+            items: [mapPanel, tree, {
+                contentEl: "desc",
+                region: "east",
+                bodyStyle: {"padding": "5px"},
+                collapsible: true,
+                collapseMode: "mini",
+                split: true,
+                width: 200,
+                title: "Description"
+            }]
+        }
+    });
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[vector-legend]
+ *  Vector Legend
+ *  -------------------------
+ *  Render a legend for a vector layer.
+ */
+
+var mapPanel, legendPanel;
+
+Ext.onReady(function() {
+
+    var rules = [
+        new OpenLayers.Rule({
+            title: "> 2000m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.GREATER_THAN,
+                property: "elevation",
+                value: 2000
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 8,
+                fillColor: "#99ccff",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "1500 - 2000m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.BETWEEN,
+                property: "elevation",
+                upperBoundary: 2000,
+                lowerBoundary: 1500
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 6,
+                fillColor: "#6699cc",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "< 1500m",
+            maxScaleDenominator: 3000000,
+            filter: new OpenLayers.Filter.Comparison({
+                type: OpenLayers.Filter.Comparison.LESS_THAN,
+                property: "elevation",
+                value: 1500
+            }),
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 4,
+                fillColor: "#0033cc",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        }),
+        new OpenLayers.Rule({
+            title: "All",
+            minScaleDenominator: 3000000,
+            symbolizer: {
+                graphicName: "star",
+                pointRadius: 5,
+                fillColor: "#99ccff",
+                strokeColor: "#666666",
+                strokeWidth: 1
+            }
+        })
+    ];
+
+    var imagery = new OpenLayers.Layer.WMS(
+        "Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"},
+        {displayInLayerSwitcher: false}
+    );
+
+    var summits = new OpenLayers.Layer.Vector("Summits", {
+        strategies: [new OpenLayers.Strategy.Fixed()],
+        protocol: new OpenLayers.Protocol.HTTP({
+            url: "data/summits.json",
+            format: new OpenLayers.Format.GeoJSON()
+        }),
+        styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({}, {rules: rules}))
+    });
+    
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "mappanel",
+        border: false,
+        layers: [imagery, summits],
+        center: [6.3, 45.6],
+        height: 256, // IE6 wants this
+        zoom: 8
+    });
+    
+    legendPanel = new GeoExt.LegendPanel({
+        layerStore: mapPanel.layers,
+        renderTo: "legend",
+        border: false
+    });
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+
+/** api: example[wms-capabilities]
+ *  WMS Capabilities Store
+ *  ----------------------
+ *  Create layer records from WMS capabilities documents.
+ */
+
+var store;
+Ext.onReady(function() {
+    
+    // create a new WMS capabilities store
+    store = new GeoExt.data.WMSCapabilitiesStore({
+        url: "data/wmscap.xml"
+    });
+    // load the store with records derived from the doc at the above url
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "WMS Capabilities",
+        store: store,
+        columns: [
+            {header: "Title", dataIndex: "title", sortable: true},
+            {header: "Name", dataIndex: "name", sortable: true},
+            {header: "Queryable", dataIndex: "queryable", sortable: true, width: 70},
+            {id: "description", header: "Description", dataIndex: "abstract"}
+        ],
+        autoExpandColumn: "description",
+        renderTo: "capgrid",
+        height: 300,
+        width: 650,
+        listeners: {
+            rowdblclick: mapPreview
+        }
+    });
+    
+    function mapPreview(grid, index) {
+        var record = grid.getStore().getAt(index);
+        var layer = record.getLayer().clone();
+        
+        var win = new Ext.Window({
+            title: "Preview: " + record.get("title"),
+            width: 512,
+            height: 256,
+            layout: "fit",
+            items: [{
+                xtype: "gx_mappanel",
+                layers: [layer],
+                extent: record.get("llbbox")
+            }]
+        });
+        win.show();
+    }
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[wms-tree]
+ *  WMS Capabilities Tree
+ *  ---------------------
+ *  Create a tree loader from WMS capabilities documents.
+ */
+var tree, mapPanel;
+
+Ext.onReady(function() {
+
+    var root = new Ext.tree.AsyncTreeNode({
+        text: 'GeoServer Demo WMS',
+        loader: new GeoExt.tree.WMSCapabilitiesLoader({
+            url: 'data/wmscap.xml',
+            layerOptions: {buffer: 0, singleTile: true, ratio: 1},
+            layerParams: {'TRANSPARENT': 'TRUE'},
+            // customize the createNode method to add a checkbox to nodes
+            createNode: function(attr) {
+                attr.checked = attr.leaf ? false : undefined;
+                return GeoExt.tree.WMSCapabilitiesLoader.prototype.createNode.apply(this, [attr]);
+            }
+        })
+    });
+
+    tree = new Ext.tree.TreePanel({
+        root: root,
+        region: 'west',
+        width: 250,
+        listeners: {
+            // Add layers to the map when ckecked, remove when unchecked.
+            // Note that this does not take care of maintaining the layer
+            // order on the map.
+            'checkchange': function(node, checked) { 
+                if (checked === true) {
+                    mapPanel.map.addLayer(node.attributes.layer); 
+                } else {
+                    mapPanel.map.removeLayer(node.attributes.layer);
+                }
+            }
+        }
+    });
+
+    mapPanel = new GeoExt.MapPanel({
+        zoom: 2,
+        layers: [
+            new OpenLayers.Layer.WMS("Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms", 
+                {layers: "bluemarble"},
+                {buffer: 0}
+            )
+        ],
+        region: 'center'
+    });
+
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            deferredRender: false,
+            items: [mapPanel, tree, {
+                contentEl: "desc",
+                region: "east",
+                bodyStyle: {"padding": "5px"},
+                collapsible: true,
+                collapseMode: "mini",
+                split: true,
+                width: 200,
+                title: "Description"
+            }]
+        }
+    });
+
+});
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[zoom-chooser]
+ *  Scale Chooser
+ *  -------------
+ *  Use a ComboBox to display available map scales.
+ */
+
+var mapPanel;
+
+Ext.onReady(function() {
+    var map = new OpenLayers.Map();
+    var layer = new OpenLayers.Layer.WMS(
+        "Global Imagery",
+        "http://maps.opengeo.org/geowebcache/service/wms",
+        {layers: "bluemarble"}
+    );
+    map.addLayer(layer);
+
+    var scaleStore = new GeoExt.data.ScaleStore({map: map});
+    var zoomSelector = new Ext.form.ComboBox({
+        store: scaleStore,
+        emptyText: "Zoom Level",
+        tpl: '<tpl for="."><div class="x-combo-list-item">1 : {[parseInt(values.scale)]}</div></tpl>',
+        editable: false,
+        triggerAction: 'all', // needed so that the combo box doesn't filter by its current content
+        mode: 'local' // keep the combo box from forcing a lot of unneeded data refreshes
+    });
+
+    zoomSelector.on('select', 
+        function(combo, record, index) {
+            map.zoomTo(record.data.level);
+        },
+        this
+    );     
+
+    map.events.register('zoomend', this, function() {
+        var scale = scaleStore.queryBy(function(record){
+            return this.map.getZoom() == record.data.level;
+        });
+
+        if (scale.length > 0) {
+            scale = scale.items[0];
+            zoomSelector.setValue("1 : " + parseInt(scale.data.scale));
+        } else {
+            if (!zoomSelector.rendered) return;
+            zoomSelector.clearValue();
+        }
+    });
+
+    mapPanel = new GeoExt.MapPanel({
+        title: "GeoExt MapPanel",
+        renderTo: "mappanel",
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(5, 45),
+        zoom: 4,
+        bbar: [zoomSelector]
+    });
+});
+
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[zoomslider]
+ *  Zoom Slider
+ *  -----------
+ *  Use a slider to control map scale.
+ */
+
+var panel, slider;
+
+Ext.onReady(function() {
+    
+    // create a map panel with an embedded slider
+    panel = new GeoExt.MapPanel({
+        title: "Map",
+        renderTo: "map-container",
+        height: 300,
+        width: 400,
+        map: {
+            controls: [new OpenLayers.Control.Navigation()]
+        },
+        layers: [new OpenLayers.Layer.WMS(
+            "Global Imagery",
+            "http://maps.opengeo.org/geowebcache/service/wms",
+            {layers: "bluemarble"}
+        )],
+        extent: [-5, 35, 15, 55],
+        items: [{
+            xtype: "gx_zoomslider",
+            vertical: true,
+            height: 100,
+            x: 10,
+            y: 20,
+            plugins: new GeoExt.ZoomSliderTip()
+        }]
+    });
+    
+    // create a separate slider bound to the map but displayed elsewhere
+    slider = new GeoExt.ZoomSlider({
+        map: panel.map,
+        aggressive: true,                                                                                                                                                   
+        width: 200,
+        plugins: new GeoExt.ZoomSliderTip({
+            template: "<div>Zoom Level: {zoom}</div>"
+        }),
+        renderTo: document.body
+    });
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.html	(revision 76)
@@ -0,0 +1,25 @@
+<html>
+    <head>
+        <title>GeoExt WMS Capabilities Example</title>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="wms-capabilities.js"></script>
+
+    </head>
+    <body>
+        <h1>WMS Capabilities Example</h1>
+        <p>This example shows how to load a grid with data from a WMS
+        capabilities document.  You can double-click on a row to see
+        a map preview of the layer.</p>
+
+        <p>Note that the js is not minified so it is readable.
+        See <a href="wms-capabilities.js">wms-capabilities.js</a>.</p>
+
+        <div id="capgrid"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/attributes.js	(revision 76)
@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[attributes]
+ *  Attribute Store & Reader
+ *  ------------------------
+ *  Create records with attribute types and values with an AttributeStore.
+ */
+
+var store;
+Ext.onReady(function() {
+    
+    // create a new attributes store
+    store = new GeoExt.data.AttributeStore({
+        url: "data/describe_feature_type.xml"
+    });
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "Feature Attributes",
+        store: store,
+        cm: new Ext.grid.ColumnModel([
+            {id: "name", header: "Name", dataIndex: "name", sortable: true},
+            {id: "type", header: "Type", dataIndex: "type", sortable: true}
+        ]),
+        sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
+        autoExpandColumn: "name",
+        renderTo: document.body,
+        height: 300,
+        width: 350
+    });    
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.html	(revision 76)
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css">
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css">
+    </head>
+
+    <body>
+        <!-- EXAMPLES -->
+        <!--
+        These examples are intended to mimic the Ext Slider examples.  Ideally,
+        the GeoExt.SliderTip would be replaced by similar functionality in the 
+        Ext.slider.Tip.  See the following forum for details:
+        http://www.sencha.com/forum/showthread.php?94903-DISCUSS-Ext.slider.Tip-hover-option
+        -->
+        <h1>GeoExt.SliderTip Examples</h1>
+        <p>The GeoExt.SliderTip extends the Ext.slider.Tip with the ability to display on hover.</p>
+        <p>The source is not minified - see <a href="slidertip.js">slidertip.js</a></p>
+        <h3>Slider with tip</h3>
+        <div id="tip-slider"></div>
+        <br>
+        <h3>Slider with custom tip</h3>
+        <div id="custom-tip-slider"></div>
+        <br>
+        <h3>Slider with tip on drag only (no hover)</h3>
+        <div id="no-hover-tip"></div>
+
+        <h3>Slider with multiple thumbs</h3>
+        <div id="multi-slider-horizontal"></div>
+
+        <h3>Vertical Slider with multiple thumbs</h3>
+        <div id="multi-slider-vertical"></div>
+
+        <!-- extra space for scrolling -->
+        <div style="height:150px;"></div>
+        <script src="../lib/GeoExt/widgets/tips/SliderTip.js"></script>
+        <script src="slidertip.js"></script>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.html	(revision 76)
@@ -0,0 +1,35 @@
+<html>
+    <head>
+        <title>GeoExt PrintExtent Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-extent.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Setting the Print Extent on the Map Interactively</h1>
+        <p>This example shows how to set the bounds of a printable PDF
+        interactively with a dynamic print extent rectangle. It requires
+        the <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://docs.geoserver.org/stable/en/user/community/printing/">GeoServer</a>
+        print module.</p>
+        <p>Drag one of the handles to control the scale. Grab one of the
+        corner handles at its edge to rotate the extent. Hold the SHIFT key to
+        rotate in 45Â° increments only. Drag the extent rectangle to change the
+        center.</p>
+        <p>The js is not minified so it is readable. See <a href="print-extent.js">print-extent.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.html	(revision 76)
@@ -0,0 +1,29 @@
+<html>
+    <head>
+        <title>GeoExt Popup Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <link rel="stylesheet" type="text/css" href="../resources/css/geoext-all.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="popup.js"></script>
+    
+        <style type="text/css">
+            div#map {
+               width: 650px;
+               height: 400px;
+               position: relative;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>Popup Example</h1>
+        <p>Click on the point in the map panel to open a popup.
+        The js is not minified so it is readable. See <a href="popup.js">popup.js</a>.</p>
+        <div id="container"></div>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.html	(revision 76)
@@ -0,0 +1,37 @@
+<html>
+    <head>
+        <title>GeoExt Modified Popup Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+        <link rel="stylesheet" type="text/css" href="../resources/css/geoext-all.css" />
+        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+        <script type="text/javascript" src="../script/GeoExt.js"></script>
+        
+        <script type="text/javascript" src="popup-more.js"></script>
+    
+        <style type="text/css">
+            #container {
+                margin: 1em;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>Modified Popup Example</h1>
+        <p>
+            This example demonstrates the use of a single popup to display 
+            content from multiple locations.
+        <p>
+        <div id="container"></div>
+        <p>
+            Clicking on the map will open a popup displaying the click location.
+            Subsequent clicks will update the content and the position.  Close
+            the popup to start over.
+        <p>
+            See the <a href="popup-more.js">popup-more.js</a> source for more
+            detail.
+        </p>
+    </body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-form.js	(revision 76)
@@ -0,0 +1,130 @@
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-form]
+ *  Print Configuration with a Form
+ *  -------------------------------
+ *  Use form field plugins to control print output.
+ */
+
+var mapPanel, printPage;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // from the info.json script in the html
+        customParams: {
+            mapTitle: "Printing Demo"
+        }
+    });
+    // Our print page. Stores scale, center and rotation and gives us a page
+    // extent feature that we can add to a layer.
+    printPage = new GeoExt.data.PrintPage({
+        printProvider: printProvider
+    });
+    // A layer to display the print page extent
+    var pageLayer = new OpenLayers.Layer.Vector();
+    pageLayer.addFeatures(printPage.feature);
+
+    // The map we want to print
+    mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        map: {
+            eventListeners: {
+                // recenter/resize page extent after pan/zoom
+                "moveend": function(){ printPage.fit(this, {mode: "screen"}); }
+            }
+        },
+        layers: [
+            new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+                {layers: "topp:tasmania_state_boundaries"}, {singleTile: true}),
+            pageLayer
+        ],
+        center: [146.56, -41.56],
+        zoom: 6
+    });
+    // The form with fields controlling the print output
+    var formPanel = new Ext.form.FormPanel({
+        region: "west",
+        width: 150,
+        bodyStyle: "padding:5px",
+        labelAlign: "top",
+        defaults: {anchor: "100%"},
+        items: [{
+            xtype: "textarea",
+            name: "comment",
+            value: "",
+            fieldLabel: "Comment",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "combo",
+            store: printProvider.layouts,
+            displayField: "name",
+            fieldLabel: "Layout",
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            })
+        }, {
+            xtype: "combo",
+            store: printProvider.dpis,
+            displayField: "name",
+            fieldLabel: "Resolution",
+            tpl: '<tpl for="."><div class="x-combo-list-item">{name} dpi</div></tpl>',
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintProviderField({
+                printProvider: printProvider
+            }),
+            // the plugin will work even if we modify a combo value
+            setValue: function(v) {
+                v = parseInt(v) + " dpi";
+                Ext.form.ComboBox.prototype.setValue.apply(this, arguments);
+            }
+        }, {
+            xtype: "combo",
+            store: printProvider.scales,
+            displayField: "name",
+            fieldLabel: "Scale",
+            typeAhead: true,
+            mode: "local",
+            triggerAction: "all",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }, {
+            xtype: "textfield",
+            name: "rotation",
+            fieldLabel: "Rotation",
+            plugins: new GeoExt.plugins.PrintPageField({
+                printPage: printPage
+            })
+        }],
+        buttons: [{
+            text: "Create PDF",
+            handler: function() {
+                printProvider.print(mapPanel, printPage);
+            }
+        }]
+    });
+     
+    // The main panel
+    new Ext.Panel({
+        renderTo: "content",
+        layout: "border",
+        width: 700,
+        height: 420,
+        items: [mapPanel, formPanel]
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/wms-capabilities.js	(revision 76)
@@ -0,0 +1,63 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+
+/** api: example[wms-capabilities]
+ *  WMS Capabilities Store
+ *  ----------------------
+ *  Create layer records from WMS capabilities documents.
+ */
+
+var store;
+Ext.onReady(function() {
+    
+    // create a new WMS capabilities store
+    store = new GeoExt.data.WMSCapabilitiesStore({
+        url: "data/wmscap.xml"
+    });
+    // load the store with records derived from the doc at the above url
+    store.load();
+
+    // create a grid to display records from the store
+    var grid = new Ext.grid.GridPanel({
+        title: "WMS Capabilities",
+        store: store,
+        columns: [
+            {header: "Title", dataIndex: "title", sortable: true},
+            {header: "Name", dataIndex: "name", sortable: true},
+            {header: "Queryable", dataIndex: "queryable", sortable: true, width: 70},
+            {id: "description", header: "Description", dataIndex: "abstract"}
+        ],
+        autoExpandColumn: "description",
+        renderTo: "capgrid",
+        height: 300,
+        width: 650,
+        listeners: {
+            rowdblclick: mapPreview
+        }
+    });
+    
+    function mapPreview(grid, index) {
+        var record = grid.getStore().getAt(index);
+        var layer = record.getLayer().clone();
+        
+        var win = new Ext.Window({
+            title: "Preview: " + record.get("title"),
+            width: 512,
+            height: 256,
+            layout: "fit",
+            items: [{
+                xtype: "gx_mappanel",
+                layers: [layer],
+                extent: record.get("llbbox")
+            }]
+        });
+        win.show();
+    }
+
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/renderer.html	(revision 76)
@@ -0,0 +1,98 @@
+<html>
+<head>
+    <title>GeoExt Feature Renderer</title>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
+    <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
+    <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/examples/shared/examples.css" />
+    <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
+    <script type="text/javascript" src="../script/GeoExt.js"></script>
+
+    <script src="renderer.js"></script>
+    <style type="text/css">
+        .x-window-body {
+            background-color: white;
+        }
+        #swatches {
+            padding: 1em;
+        }
+        #swatches td {
+            border: 1px solid #ccc;
+            text-align: center;
+            margin: 0 auto;
+            padding: 0.5em;
+        }
+        #swatches td div div {
+            text-align: left; /* IE centers VML in root otherwise */
+        }
+        #wkt {
+            width: 400px;
+            height: 100px;
+        }
+        #symbolizers {
+            width: 400px;
+            height: 150px;
+        }
+    </style>
+</head>
+<body>
+    <div id="panel"></div>
+    <h1>GeoExt.FeatureRenderer</h1>
+    <p>The FeatureRenderer renderers arbitrary OpenLayers.Feature.Vector objects
+    given a list of symbolizers.  The FeatureRenderer component can be used 
+    anywhere a box component is used.</p>
+
+    <p>The js is not minified so it is readable. See <a href="renderer.js">renderer.js</a>.</p>
+
+    <h2>Symbol Types</h2>
+    <p>If the feature renderer is not given a feature, it can be configured to
+    render a default feature based on geometry type alone.</p>
+    <table id="swatches">
+        <tbody>
+            <tr><td>&nbsp;</td><td>point</td><td>line</td><td>polygon</td></tr>
+            <tr>
+                <td>default</td>
+                <td id="point_default"></td>
+                <td id="line_default"></td>
+                <td id="poly_default"></td>
+            </tr><tr>
+                <td>blue</td>
+                <td id="point_blue"></td>
+                <td id="line_blue"></td>
+                <td id="poly_blue"></td>
+            </tr><tr>
+                <td>custom</td>
+                <td id="point_custom"></td>
+                <td id="line_custom"></td>
+                <td id="poly_custom"></td>
+            </tr>
+            </tr><tr>
+                <td>stacked</td>
+                <td id="point_stacked"></td>
+                <td id="line_stacked"></td>
+                <td id="poly_stacked"></td>
+            </tr>
+        </tbody>
+    </table>
+    
+    <h2>Custom Feature Rendering</h2>
+    <p>You can render any OpenLayers.Feature.Vector object with a FeatureRenderer.
+    Use the inputs below to modify the well-known text and symbolizer.  These
+    will be used to render a feature in a new window.</p><br>
+    <label for="wkt">Geometry Well-Known Text</label><br>
+    <textarea id="wkt">
+POLYGON((1 30, -33 10, -39 -21, 1 -41, 23 -22, 27 15, 1 30), (0 10, -14 0, -4 -24, 12 -8, 0 10))
+    </textarea><br><br>
+    <label for="symbolizers">Feature Symbolizers</label><br>
+    <textarea id="symbolizers">
+[{
+    fillColor: "yellow",
+    fillOpacity: 1,
+    strokeColor: "blue",
+    strokeWidth: 1,
+    pointRadius: 5
+}]
+    </textarea><br>
+    <button id="render">render</button>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/slidertip.js	(revision 76)
@@ -0,0 +1,59 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+Ext.onReady(function(){
+
+    new Ext.Slider({
+        renderTo: "tip-slider",
+        width: 214,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip()
+    });
+
+    new Ext.Slider({
+        renderTo: "custom-tip-slider",
+        width: 214,
+        increment: 10,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip({
+            getText: function(thumb){
+                return String.format("<b>{0}% complete</b>", thumb.value);
+            }
+        })
+    });
+
+    new Ext.Slider({
+        renderTo: "no-hover-tip",
+        width: 214,
+        increment: 10,
+        minValue: 0,
+        maxValue: 100,
+        plugins: new GeoExt.SliderTip({hover: false})
+    });
+    
+    new Ext.Slider({
+        renderTo: "multi-slider-horizontal",
+        width   : 214,
+        minValue: 0,
+        maxValue: 100,
+        values  : [10, 50, 90],
+        plugins : new GeoExt.SliderTip()
+    });
+    
+    new Ext.Slider({
+        renderTo : "multi-slider-vertical",
+        vertical : true,
+        height   : 214,
+        minValue: 0,
+        maxValue: 100,
+        values  : [10, 50, 90],
+        plugins : new GeoExt.SliderTip()
+    });
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/print-extent.js	(revision 76)
@@ -0,0 +1,51 @@
+ /**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[print-extent]
+ *  Interactive Print Extent
+ *  ------------------------
+ *  Change print scale, center and rotation with the PrintExtent plugin.
+ */
+
+var mapPanel, printProvider;
+
+Ext.onReady(function() {
+    // The printProvider that connects us to the print service
+    printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // from the info.json script in the html
+        customParams: {
+            mapTitle: "Printing Demo",
+            comment: "This is a map printed from GeoExt."
+        }
+    });
+
+    var printExtent = new GeoExt.plugins.PrintExtent({
+        printProvider: printProvider
+    });
+
+    // The map we want to print, with the PrintExtent added as item.
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 450,
+        height: 320,
+        layers: [new OpenLayers.Layer.WMS("Tasmania", "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],
+        center: [146.56, -41.56],
+        zoom: 6,
+        plugins: [printExtent],
+        bbar: [{
+            text: "Create PDF",
+            handler: function() {
+                // the PrintExtent plugin is the mapPanel's 1st plugin
+                mapPanel.plugins[0].print();
+            }
+        }]
+    });
+    printExtent.addPage();
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup.js	(revision 76)
@@ -0,0 +1,87 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[popup]
+ *  Feature Popup
+ *  -------------
+ *  Display a popup with feature information.
+ */
+
+var mapPanel, popup;
+
+Ext.onReady(function() {
+
+    // create a vector layer, add a feature into it
+    var vectorLayer = new OpenLayers.Layer.Vector("vector");
+    vectorLayer.addFeatures(
+        new OpenLayers.Feature.Vector(
+            new OpenLayers.Geometry.Point(-45, 5)
+        )
+    );
+
+    // create select feature control
+    var selectCtrl = new OpenLayers.Control.SelectFeature(vectorLayer);
+
+    // define "createPopup" function
+    var bogusMarkup = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit.";
+    function createPopup(feature) {
+        popup = new GeoExt.Popup({
+            title: 'My Popup',
+            location: feature,
+            width:200,
+            html: bogusMarkup,
+            maximizable: true,
+            collapsible: true
+        });
+        // unselect feature when the popup
+        // is closed
+        popup.on({
+            close: function() {
+                if(OpenLayers.Util.indexOf(vectorLayer.selectedFeatures,
+                                           this.feature) > -1) {
+                    selectCtrl.unselect(this.feature);
+                }
+            }
+        });
+        popup.show();
+    }
+
+    // create popup on "featureselected"
+    vectorLayer.events.on({
+        featureselected: function(e) {
+            createPopup(e.feature);
+        }
+    });
+
+    // create Ext window including a map panel
+    var mapwin = new Ext.Window({
+        layout: "fit",
+        title: "Map",
+        closeAction: "hide",
+        width: 650,
+        height: 356,
+        x: 50,
+        y: 100,
+        items: {
+            xtype: "gx_mappanel",
+            region: "center",
+            layers: [
+                new OpenLayers.Layer.WMS( 
+                    "OpenLayers WMS",
+                    "http://vmap0.tiles.osgeo.org/wms/vmap0",
+                    {layers: 'basic'} ),
+                vectorLayer
+            ]
+        }
+    });
+    mapwin.show();
+
+    mapPanel = mapwin.items.get(0);
+    mapPanel.map.addControl(selectCtrl);
+    selectCtrl.activate();
+});
Index: /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/GeoExt/examples/popup-more.js	(revision 76)
@@ -0,0 +1,115 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[popup-more]
+ *  Modifying Popups
+ *  ----------------
+ *  Update a popup with information from multiple locations.
+ */
+
+var mapPanel, popup;
+
+Ext.onReady(function() {
+
+    function addToPopup(loc) {
+
+        // create the popup if it doesn't exist
+        if (!popup) {
+            popup = new GeoExt.Popup({
+                title: "Popup",
+                width: 200,
+                maximizable: true,
+                collapsible: true,
+                map: mapPanel.map,
+                anchored: true,
+                listeners: {
+                    close: function() {
+                        // closing a popup destroys it, but our reference is truthy
+                        popup = null;
+                    }
+                }
+            });
+        }
+
+        // add some content to the popup (this can be any Ext component)
+        popup.add({
+            xtype: "box",
+            autoEl: {
+                html: "You clicked on (" + loc.lon.toFixed(2) + ", " + loc.lat.toFixed(2) + ")"
+            }
+        });
+
+        // reset the popup's location
+        popup.location = loc;
+        
+        popup.doLayout();
+
+        // since the popup is anchored, calling show will move popup to this location
+        popup.show();
+    }
+
+    // create Ext window including a map panel
+    var mapPanel = new GeoExt.MapPanel({
+        title: "Map",
+        renderTo: "container",
+        width: 650, height: 356,
+        layers: [
+            new OpenLayers.Layer.WMS(
+                "Global Imagery",
+                "http://maps.opengeo.org/geowebcache/service/wms",
+                {layers: "bluemarble"}
+            )
+        ],
+        center: [0, 0],
+        zoom: 2
+    });
+
+    var control = new OpenLayers.Control.Click({
+        trigger: function(evt) {
+            var loc = mapPanel.map.getLonLatFromViewPortPx(evt.xy);
+            addToPopup(loc);
+        }
+    });
+    
+    mapPanel.map.addControl(control);
+    control.activate();
+
+});
+
+// simple control to handle user clicks on the map
+
+OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
+
+    defaultHandlerOptions: {
+        single: true,
+        double: false,
+        pixelTolerance: 0,
+        stopSingle: true
+    },
+
+    initialize: function(options) {
+
+        this.handlerOptions = OpenLayers.Util.extend(
+            options && options.handlerOptions || {}, 
+            this.defaultHandlerOptions
+        );
+        OpenLayers.Control.prototype.initialize.apply(
+            this, arguments
+        ); 
+        this.handler = new OpenLayers.Handler.Click(
+            this, 
+            {
+                click: this.trigger
+            }, 
+            this.handlerOptions
+        );
+    },
+    
+    CLASS_NAME: "OpenLayers.Control.Click"
+
+});
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/license.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/license.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/license.txt	(revision 76)
@@ -0,0 +1,11 @@
+/*
+  proj4js.js -- Javascript reprojection library. 
+  
+  Authors:      Mike Adair madairATdmsolutions.ca
+                Richard Greenwood richATgreenwoodmap.com
+                Didier Richard didier.richardATign.fr
+                Stephen Irons
+  License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html 
+                Note: This program is an almost direct port of the C library
+                Proj4.
+*/
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/library.cfg
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/library.cfg	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/library.cfg	(revision 76)
@@ -0,0 +1,11 @@
+[first]
+proj4js.js
+
+[last]
+
+[include]
+projCode/*.js
+defs/GOOGLE.js
+
+[exclude]
+defs/*
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/build.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/build.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/build.py	(revision 76)
@@ -0,0 +1,35 @@
+#!/usr/bin/env python
+
+import sys
+sys.path.append("../tools")
+
+import jsmin, mergejs
+
+sourceDirectory = "../lib"
+configFilename = "library.cfg"
+filename = "proj4js-compressed.js"
+outputFilename = "../lib/" + filename
+
+if len(sys.argv) > 1:
+    configFilename = sys.argv[1]
+    extension = configFilename[-4:]
+
+    if extension  != ".cfg":
+        configFilename = sys.argv[1] + ".cfg"
+
+if len(sys.argv) > 2:
+    outputFilename = sys.argv[2]
+
+print "Merging libraries."
+merged = mergejs.run(sourceDirectory, None, configFilename)
+print "Setting the filename to "+filename
+merged = merged.replace('scriptName: "proj4js.js",','scriptName: "'+filename+'",');
+print "Compressing."
+minimized = jsmin.jsmin(merged)
+print "Adding license file."
+minimized = file("license.txt").read() + minimized
+
+print "Writing to %s." % outputFilename
+file(outputFilename, "w").write(minimized)
+
+print "Done."
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/README.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/README.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/README.txt	(revision 76)
@@ -0,0 +1,13 @@
+## HowTo: Build & deploy "Shrunk" Single File Library version of proj4js ##
+
+ * Build:
+
+     cd build
+     ./build.py
+     cd ..
+
+ * Upload the result to the server: e.g.
+
+  scp build/proj4js.js openlayers@openlayers.org:openlayers.org/htdocs/code/
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/build.xml
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/build.xml	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/build.xml	(revision 76)
@@ -0,0 +1,159 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--*************************************************************************
+Filename        :   build.xml
+Project         :   proj4js
+Document Type   :   XML
+Purpose         :   build file for ant tool
+
+Author     Date            Description
+M.Adair    17-Dec-2001     initial version copied from mapbuilder
+
+$Id: build.xml 2955 2007-07-09 12:12:27Z steven $
+***************************************************************************--><!--
+-->
+<!-- A "project" describes a set of targets that may be requested
+     when Ant is executed.  The "default" attribute defines the
+     target which is executed if no specific target is requested,
+     and the "basedir" attribute defines the current working directory
+     from which Ant executes the requested task.  This is normally
+     set to the current working directory.
+-->
+  <project basedir=".." default="dist" name="proj4js">
+
+<!-- ===================== Property Definitions =========================== -->
+<!--
+  Each of the following properties are used in the build script.
+  Values for these properties are set by the first place they are
+  defined, from the following list:
+
+  * Definitions on the "ant" command line (ant -Dfoo=bar compile).
+
+  * Definitions from a "build.properties" file in the top level
+    source directory of this application.
+
+  * Definitions from a "build.properties" file in the developer's
+    home directory.
+
+  * Default definitions in this build.xml file.
+
+  You will note below that property values can be composed based on the
+  contents of previously defined properties.  This is a powerful technique
+  that helps you minimize the number of changes required when your development
+  environment is modified.  Note that property composition is allowed within
+  "build.properties" files as well as in the "build.xml" script.
+-->
+  <property file="build.properties"/>
+  <property file="${user.home}/build.properties"/>
+  <property file="default.properties"/>  	
+
+<!-- ==================== File and Directory Names ======================== -->
+<!--
+
+  These properties generally define file and directory names (or paths) that
+  affect where the build process stores its outputs.
+
+  app.name             Base name of this application, used to
+                       construct filenames and directories.
+                       Defaults to "myapp".
+
+  app.path             Context path to which this application should be
+                       deployed (defaults to "/" plus the value of the
+                       "app.name" property).
+
+  app.version          Version number of this iteration of the application.
+
+  build.home           The directory into which the "prepare" and
+                       "compile" targets will generate their output.
+                       Defaults to "build".
+
+  dist.home            The name of the base directory in which
+                       distribution files are created.
+                       Defaults to "dist".
+-->
+
+  <property environment="env"/>
+  <property name="app.name" value="proj4js"/>
+  <property name="app.path" value="/${app.name}"/>
+  <property name="app.version" value="1.0.2"/>
+  <property name="build.home" value="${basedir}/tempBuild"/>
+  <property name="dist.home" value="${basedir}/dist"/>
+  <property name="docs.home" value="${build.home}/docs"/>
+
+
+<!-- ==================== Prepare Target ================================== -->
+<!--
+  The "prepare" target is used to create the "build" destination directory,
+  and copy the static contents of your web application to it.  If you need
+  to copy static files from external dependencies, you can customize the
+  contents of this task.
+
+  Normally, this task is executed indirectly when needed.
+
+-->
+
+  <target name="prepare">
+    <!-- Create build directories as needed -->
+    <mkdir dir="${build.home}"/>
+    <!-- Copy static content of the mapbuilder project  -->
+    <copy todir="${build.home}">
+      <fileset dir="${basedir}" excludes="tools/*.pyc "
+          includes="index.html
+                    lib/proj4js.js,
+                    lib/proj4js-combined.js
+                    lib/proj4js-compressed.js
+                    lib/defs/**
+                    lib/projCode/**
+                    build/**
+                    demo/**
+                    test/**
+                    tools/**"
+      />
+    </copy>
+  </target>
+
+
+<!-- ==================== Clean Target ==================================== -->
+<!--
+
+  The "clean" target deletes any previous "build" and "dist" directory,
+  so that you can be ensured the application can be built from scratch.
+
+-->
+
+  <target description="Delete old build and dist directories" name="clean">
+    <delete dir="${build.home}"/>
+    <delete dir="${dist.home}"/>
+  </target>
+
+
+<!-- ==================== Documentation =================================== -->
+
+  <target description="Create documentation" name="docs" depends="prepare">
+  
+    <mkdir dir="${build.home}/docs"/>
+    <mkdir dir="${build.home}/docs/NaturalDocs"/>
+    
+    <echo message="Generating documentation"/>
+    <exec executable="cmd" os="Windows XP" dir="${build.home}">
+        <arg line="/c perl C:\Progra~1\NaturalDocs\NaturalDocs -i ./lib -o html ./docs/NaturalDocs -p ./docs/NaturalDocs -r"/>
+    </exec>
+  </target>
+
+
+<!-- ==================== Dist Target ===================================== -->
+<!--
+  The "dist" target creates the zip file distribution for the Apache/PHP
+  environment.
+-->
+  <target name="dist" description="Create binary distribution" depends="clean,prepare,docs">
+
+    <mkdir dir="${dist.home}"/>
+
+    <!-- Create application zip file -->
+    <zip destfile="${dist.home}/${app.name}-${app.version}.zip" update="true">
+      <zipfileset dir="${build.home}" prefix="proj4js"/>
+    </zip>
+
+  </target>
+
+</project>
Index: /trunk/workshop-routing-foss4g/web/proj4js/build/buildUncompressed.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/build/buildUncompressed.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/build/buildUncompressed.py	(revision 76)
@@ -0,0 +1,28 @@
+#!/usr/bin/env python
+
+import sys
+sys.path.append("../tools")
+
+import jsmin, mergejs
+
+sourceDirectory = "../lib"
+configFilename = "library.cfg"
+filename = "proj4js-combined.js"
+outputFilename = "../lib/" + filename
+
+if len(sys.argv) > 1:
+    configFilename = sys.argv[1] + ".cfg"
+if len(sys.argv) > 2:
+    outputFilename = sys.argv[2]
+
+print "Merging libraries."
+merged = mergejs.run(sourceDirectory, None, configFilename)
+print "Setting the filename to "+filename
+merged = merged.replace('scriptName: "proj4js.js",','scriptName: "'+filename+'",');
+print "Adding license file."
+merged = file("license.txt").read() + merged
+
+print "Writing to %s." % outputFilename
+file(outputFilename, "w").write(merged)
+
+print "Done."
Index: /trunk/workshop-routing-foss4g/web/proj4js/test/base.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/test/base.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/test/base.css	(revision 76)
@@ -0,0 +1,29 @@
+#footer {
+  margin-top: 20px;
+  border-top: 1px solid #eee;
+  padding: 10px;
+}  
+body {
+ font-family:Verdana;
+}
+#header {
+  background: #9D9FA1;
+  color: #FFFFFF;
+  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
+  font-size: 18px;
+  text-shadow: 2px 2px 3px gray;
+  height: 3em;
+  padding: 4px 16px 0px 16px;
+  vertical-align: top;
+  margin: -10px -5px 0px -5px;
+  border-bottom: 10px solid #e9eef9;
+}
+#header h1{margin-top: 0px;font-weight:normal;}
+#navbar { background-color: #eee; margin: 0px -5px 10px -5px; padding: 10px;  }
+
+td {
+  font-size: 75%;
+}
+td.error {
+  background-color: red;
+}
Index: /trunk/workshop-routing-foss4g/web/proj4js/test/runtests.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/test/runtests.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/test/runtests.js	(revision 76)
@@ -0,0 +1,86 @@
+/* Loop through the test points and create a Proj object for each
+ */
+ var src, dest;
+function runTests() {
+  
+  //src = new Proj4js.Proj(Proj4js.defs["WKT0"],cb2);
+  /*
+  src = new Proj4js.Proj("EPSG:900913",cb1);
+  var testPt = new Proj4js.Point([1113194.9079327357, 6800125.454397307]);
+  var testRes = Proj4js.transform(src, dest, testPt);
+  alert(testRes.toString());
+  */
+  
+  for (var i=0; i < Proj4js.testPoints.length; ++i) {
+    var test = Proj4js.testPoints[i];
+    var proj = new Proj4js.Proj(test.code, Proj4js.bind(showResults, this, test));
+  }
+}
+function cb1() {
+  dest = new Proj4js.Proj("EPSG:2303X",cb2);
+}
+function cb2(arg1) {
+  //alert('all set');
+}
+
+/* a callback function to run the test for this test point since we are using
+ the dynamic load capabilities in the test page
+ */
+function showResults(test, proj) {
+  //var test = proj.testPoint;
+  var xyEPSLN = 1.0e-2;
+  var llEPSLN = 1.0e-6;
+    var row = document.createElement('tr');
+    var td = document.createElement('td');
+    td.innerHTML = test.code;
+    row.appendChild(td);
+    var td = document.createElement('td');
+    td.innerHTML = proj.projName;
+    row.appendChild(td);
+    
+    //transform from lon/lat to projected x/y and cmopare 
+    var xyResult = Proj4js.transform(Proj4js.WGS84, proj, new Proj4js.Point(test.ll));
+    if (xyResult) {
+      var deltaX = Math.abs(xyResult.x - test.xy[0]);
+      var deltaY = Math.abs(xyResult.y - test.xy[1]);
+      td = document.createElement('td');
+      td.innerHTML = "in:"+test.ll[0]+","+test.ll[1];
+      row.appendChild(td);
+      td = document.createElement('td');
+      td.innerHTML = "out:"+xyResult.x+","+xyResult.y;
+      row.appendChild(td);
+      td = document.createElement('td');
+      td.innerHTML = "dx:"+deltaX+ " dy:"+deltaY;
+      if ( deltaX>xyEPSLN || deltaY>xyEPSLN ) td.style.backgroundColor='red';
+      row.appendChild(td);
+    } else {
+      td = document.createElement('td');
+      td.innerHTML = "proj undefined";
+      row.appendChild(td);
+    }
+    
+    //transform from map x/y to lon/lat and compare
+    var llResult = Proj4js.transform(proj, Proj4js.WGS84, new Proj4js.Point(test.xy));
+    if (llResult) {
+      var deltaX = Math.abs(llResult.x - test.ll[0]);
+      var deltaY = Math.abs(llResult.y - test.ll[1]);
+      td = document.createElement('td');
+      td.innerHTML = "in:"+test.xy[0]+","+test.xy[1];
+      row.appendChild(td);
+      td = document.createElement('td');
+      td.innerHTML = "out:"+llResult.x+","+llResult.y;
+      row.appendChild(td);
+      td = document.createElement('td');
+      td.innerHTML = "dx:"+deltaX+ " dy:"+deltaY;
+      if ( deltaX>llEPSLN || deltaY>llEPSLN ) td.style.backgroundColor='red';
+      row.appendChild(td);
+    } else {
+      td = document.createElement('td');
+      td.innerHTML = "proj undefined";
+      row.appendChild(td);
+    }
+    
+    var testTable = document.getElementById('testResult');
+    testTable.tBodies[0].appendChild(row);
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/test/testdata.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/test/testdata.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/test/testdata.js	(revision 76)
@@ -0,0 +1,167 @@
+// a set of points in map XY and Lon/Lat that are supposed to correspond between
+// forward and invers transforms
+Proj4js.defs["EPSG:54003"] = "+proj=mill +lat_0=0 +lon_0=0 +x_0=0 +y_0=0 +R_A +ellps=WGS84 +datum=WGS84 +units=m +no_defs";
+Proj4js.defs["EPSG:54029"] = "+proj=vandg +lon_0=0 +x_0=0 +y_0=0 +R_A +ellps=WGS84 +datum=WGS84 +units=m +no_defs";
+Proj4js.defs["EPSG:2303X"] = "+proj=utm +zone=30 +ellps=intl +units=m +towgs84=-157.89,-17.16,-78.41,2.118,2.697,-1.434,-1.1097046576093785 +no_defs ";
+Proj4js.defs["EPSG:3035"] = "+proj=laea +lat_0=52 +lon_0=10 +x_0=4321000 +y_0=3210000 +ellps=GRS80 +units=m +no_defs";
+Proj4js.defs["EPSG:54009"] = "+proj=moll +lon_0=0 +units=m";
+Proj4js.defs["EPSG:28191"] = "+proj=cass +lat_0=31.73409694444445 +lon_0=35.21208055555556 +x_0=170251.555 +y_0=126867.909 +a=6378300.789 +b=6356566.435 +towgs84=-275.722,94.7824,340.894,-8.001,-4.42,-11.821,1 +units=m +no_defs";
+Proj4js.defs["EPSG:2958"] = "+proj=utm +zone=17 +ellps=GRS80 +units=m +no_defs";
+Proj4js.defs["EPSG:102018"] = "+proj=gnom +lat_0=90 +lon_0=0 +x_0=6300000 +y_0=6300000 +ellps=WGS84 +datum=WGS84 +units=m +no_defs";
+Proj4js.defs["ESRI:102026"] = "+proj=eqdc +lat_0=0 +lon_0=0 +lat_1=15 +lat_2=65 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m +no_defs";
+Proj4js.defs["EPSG:26986"] = "+proj=lcc +lat_1=42.68333333333333 +lat_2=41.71666666666667 +lat_0=41 +lon_0=-71.5 +x_0=200000 +y_0=750000 +ellps=GRS80 +datum=NAD83 +units=m +no_defs";
+
+//need test points for these
+
+/*
+Proj4js.defs["WKT0"] = 'PROJCS["HARN/WI.SheboyganWI-M",GEOGCS["HARN/WI.LL",DATUM["HARN/WI",SPHEROID["GRS1980",6378137.000,298.25722210],TOWGS84[0.0000,0.0000,0.0000,0.000000,0.000000,0.000000,0.00000000]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]],PROJECTION["Transverse Mercator, Wisconsin County Variation"],PARAMETER["false_easting",79857.760],PARAMETER["false_northing",0.000],PARAMETER["scale_factor",1.000000000000],PARAMETER["central_meridian",-87.55000000000000],PARAMETER["latitude_of_origin",43.26666666670000],PARAMETER["Average Geoid Height (meters)",-34.0200],PARAMETER["Average Elevation (system unit)",182.8800],UNIT["Meter",1.00000000000000]]';
+Proj4js.defs["WKT1"] = 'GEOGCS["WGS84 Lat/Long Degrees -180 ==> +180",DATUM["D_WGS_1984",SPHEROID["World_Geodetic_System_of_1984",6378137,298.257222932867]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]]',
+Proj4js.defs["WKT2"] = 'PROJCS["ALG-S-AN",GEOGCS["VOIR1875",DATUM["VOIR1875",SPHEROID["CLRK-IGN",6378249.200,293.46602129],TOWGS84[-73.0000,-247.0000,227.0000,0.000000,0.000000,0.000000,0.00000000]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]],PROJECTION["Lambert Tangential Conformal Conic Projection"],PARAMETER["false_easting",500000.000],PARAMETER["false_northing",300000.000],PARAMETER["scale_factor",0.999625800000],PARAMETER["central_meridian",2.70000000000000],PARAMETER["latitude_of_origin",33.30000000000000],UNIT["Meter",1.00000000000000]]',
+Proj4js.defs["WKT3"] = 'PROJCS["CANQ27-M15M",GEOGCS["LL27",DATUM["NAD27",SPHEROID["CLRK66",6378206.400,294.97869821]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]],PROJECTION["Transverse_Mercator"],PARAMETER["false_easting",304800.000],PARAMETER["false_northing",0.000],PARAMETER["scale_factor",0.999900000000],PARAMETER["central_meridian",-90.00000000000000],PARAMETER["latitude_of_origin",0.00000000000000],UNIT["Meter",1.00000000000000]]',
+Proj4js.defs["WKT4"] = 'LOCAL_CS["Non-Earth (Meter)",LOCAL_DATUM["Local Datum",0],UNIT["Meter", 1],AXIS["X",EAST],AXIS["Y",NORTH]]',
+Proj4js.defs["WKT5"] = 'PROJCS["SVY21",GEOGCS["SVY21[WGS84]",DATUM["D_WGS_1984",SPHEROID["WGS_1984",6378137.0,298.257223563]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]],PROJECTION["Transverse_Mercator"],PARAMETER["False_Easting",28001.642],PARAMETER["False_Northing",38744.572],PARAMETER["Central_Meridian",103.8333333333333],PARAMETER["Scale_Factor",1.0],PARAMETER["Latitude_Of_Origin",1.366666666666667],UNIT["Meter",1.0]]'
+*/
+
+Proj4js.testPoints = [
+  {code: 'EPSG:26986',
+    xy: [ 231394.84,902621.11],
+    ll: [-71.11881762742996,42.37346263960867]
+  }/*,
+  {code: 'ESRI:102026',
+    xy: [3257939.781874, 5459865.918947],
+    ll: [45.17578125, 41.923828125]
+  },
+  {code: 'EPSG:54029',
+    xy: [2359523.653024, 3280192.180346],
+    ll: [21.796875, 28.828125]
+  },
+  {code: 'EPSG:102018',
+    xy: [350577.5930806119, 4705857.070634324],
+    ll: [-75,46]
+  },
+  {code: 'EPSG:2958',
+    xy: [411461.807497, 4700123.744402],
+    ll: [-82.07666015625, 42.448388671875]
+  },
+  {code: 'EPSG:54009',
+    xy: [3891383.58309223, 6876758.9933288],
+    ll: [60,60]
+  },
+  {code: 'EPSG:3035',
+    xy: [4388138.60, 3321736.46],
+    ll: [11.0, 53.0]
+  },
+  {code: 'EPSG:23030',
+    xy: [168035.13,4199884.83,-216.62],
+    ll: [-6.77432123185356, 37.88456231505968]   
+  }, 
+  {code: 'EPSG:29100',
+    xy: [5110899.06,10552971.81,-22.99],
+    ll: [-53.0, 5.0,0.0]   
+  },
+  {code: 'EPSG:27700',
+    xy: [343733.14, 612144.53, -51.89],
+    ll: [-2.89, 55.4, 0]   
+  },
+  {code: 'EPSG:27492',
+    xy: [25260.493584, -9579.245052],
+    ll: [-7.84, 39.58]
+  },
+  {code: 'EPSG:3411',
+    xy: [1070076.44,-4635010.27,-136.63],       
+    ll: [-32, 48, 0]
+  },
+  {code: 'EPSG:2403',
+    xy: [27500000.00,	4198690.08, -109.02],
+    ll: [81, 37.92, 0] 
+  },
+  {code: 'EPSG:21781',
+    xy: [660389.52, 185731.63, -49.23], 
+    ll: [8.23, 46.82, 0]
+  },
+  {code: 'EPSG:27563',
+    xy: [653704.865208, 176887.660037],
+    ll: [3.005, 43.89]
+  },
+  {code: 'EPSG:54003',
+    xy: [1223145.57,6491218.13,-6468.21],
+    ll: [11.0, 53.0]
+  },
+  {code: 'EPSG:3573',
+    xy: [2923052.02009, 1054885.46559],
+    ll: [9.84375, 61.875]
+  },
+  {code: 'EPSG:54009',
+    xy: [-10617602.79013849,4108337.84708608,0.00000000 ], 
+    ll: [-119,34,0]
+  },
+  
+  {code: 'EPSG:31466',
+    xy: [2547685.01212,5699155.7345],
+    ll: [6.685,51.425]
+  },
+  {code: 'EPSG:54008',
+    xy: [738509.49,5874620.38],
+    ll: [11.0, 53.0]
+  },
+  {code: 'EPSG:2057',
+    xy: [-11608322.26,18282612.23,-281.67],
+    ll: [-53.0, 5.0,0.0]
+  },
+  {code: 'EPSG:54009',
+    xy: [804759.21,6164983.82,-13598.03],
+    ll: [11.0, 53.0, 0.0]
+  },
+  {code: 'EPSG:3035',
+    xy: [4388138.60, 3321736.46],
+    ll: [11.0, 53.0]
+  },
+  {code: 'EPSG:54032',
+    xy: [-4024426.19, 6432026.98],
+    ll: [-127.0, 52.11]
+  },
+  {code: 'EPSG:3153',
+    xy: [931625.91, 789252.65],
+    ll: [-127.0, 52.11]
+  },
+  {code: 'EPSG:32615',
+    xy: [500000, 4649776.22482],
+    ll: [-93, 42]
+  },
+  {code: 'EPSG:26916',
+    xy: [5110899.06,10552971.81,-22.99],
+    ll: [-86.6056, 34.5790,0.0]   
+  },
+  {code: 'EPSG:32612',
+    xy: [383357.429537, 6684599.06392],
+    ll: [-113.109375, 60.28125]
+  },
+  {code: 'EPSG:3031',
+    xy: [-992481.633786, 628482.06328],
+    ll: [-57.65625, -79.21875]
+  },
+  {code: 'EPSG:31285',
+    xy: [450055.70, 5262356.33],
+    ll: [13.33333333333, 47.5]
+  },
+  {code: 'EPSG:2736',
+    xy: [603933.40,	7677505.64],
+    ll: [34.0, -21.0]
+  },
+  {code: 'EPSG:42304',
+    xy: [-358185.267976, -40271.099023],
+    ll: [-99.84375, 48.515625]
+  },
+  {code: 'google',
+    xy: [-8531595.34908, 6432756.94421],
+    ll: [-76.640625, 49.921875]
+  },
+  {code: 'EPSG:42304',
+    xy: [-358185.267976, -40271.099023],
+    ll: [-99.84375, 48.515625]
+  },
+  {code: 'EPSG:28992',
+    xy: [148312.15,	457804.79, 698.48],
+    ll: [5.29, 52.11]
+  }*/
+];
Index: /trunk/workshop-routing-foss4g/web/proj4js/test/testWKT.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/test/testWKT.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/test/testWKT.html	(revision 76)
@@ -0,0 +1,51 @@
+<html>
+<head>
+<script type="text/javascript" src="../lib/proj4js.js"></script>
+<script type="text/javascript">
+
+var aWKT = [
+'GEOGCS["WGS84 Lat/Long Degrees -180 ==> +180",DATUM["D_WGS_1984",SPHEROID["World_Geodetic_System_of_1984",6378137,298.257222932867]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]]',
+'PROJCS["ALG-S-AN",GEOGCS["VOIR1875",DATUM["VOIR1875",SPHEROID["CLRK-IGN",6378249.200,293.46602129],TOWGS84[-73.0000,-247.0000,227.0000,0.000000,0.000000,0.000000,0.00000000]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]],PROJECTION["Lambert Tangential Conformal Conic Projection"],PARAMETER["false_easting",500000.000],PARAMETER["false_northing",300000.000],PARAMETER["scale_factor",0.999625800000],PARAMETER["central_meridian",2.70000000000000],PARAMETER["latitude_of_origin",33.30000000000000],UNIT["Meter",1.00000000000000]]',
+'PROJCS["CANQ27-M15M",GEOGCS["LL27",DATUM["NAD27",SPHEROID["CLRK66",6378206.400,294.97869821]],PRIMEM["Greenwich",0],UNIT["Degree",0.017453292519943295]],PROJECTION["Transverse_Mercator"],PARAMETER["false_easting",304800.000],PARAMETER["false_northing",0.000],PARAMETER["scale_factor",0.999900000000],PARAMETER["central_meridian",-90.00000000000000],PARAMETER["latitude_of_origin",0.00000000000000],UNIT["Meter",1.00000000000000]]',
+'LOCAL_CS["Non-Earth (Meter)",LOCAL_DATUM["Local Datum",0],UNIT["Meter", 1],AXIS["X",EAST],AXIS["Y",NORTH]]',
+'PROJCS["SVY21",GEOGCS["SVY21[WGS84]",DATUM["D_WGS_1984",SPHEROID["WGS_1984",6378137.0,298.257223563]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]],PROJECTION["Transverse_Mercator"],PARAMETER["False_Easting",28001.642],PARAMETER["False_Northing",38744.572],PARAMETER["Central_Meridian",103.8333333333333],PARAMETER["Scale_Factor",1.0],PARAMETER["Latitude_Of_Origin",1.366666666666667],UNIT["Meter",1.0]]'
+];
+
+var wktRE = /^\,(\w+)\[(.*)\]/;
+
+window.onload = function() {
+  var table = document.getElementById('resultsTable');
+  for (var i=0; i<aWKT.length; ++i) {
+    var tr = document.createElement('tr');
+    var wkt = aWKT[i];
+    //wkt = ','+wkt;
+    var testProj = new Proj4js.Proj(wkt);
+    
+    var td = document.createElement('td');
+    td.innerHTML = testProj.srsCode;
+    tr.appendChild(td);
+    
+    td = document.createElement('td');
+    td.innerHTML = testProj.units;
+    tr.appendChild(td);
+    
+    td = document.createElement('td');
+    td.innerHTML = testProj.projName;
+    tr.appendChild(td);
+    
+    td = document.createElement('td');
+    td.innerHTML = wkt;
+    tr.appendChild(td);
+    table.appendChild(tr);
+  }
+}
+
+</script>
+</head>
+<body>
+<h2>testing WKT parser</h2>
+<table id='resultsTable'>
+  <tr><th>name</th><th>units</th><th>proj</th><th align="left">wkt</th></tr>
+</table>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/proj4js/test/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/test/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/test/index.html	(revision 76)
@@ -0,0 +1,32 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <link href="base.css" type="text/css" rel="stylesheet"/>
+  <title>Proj4js Test Page</title>
+  <script src="../lib/proj4js.js"></script>
+  <script src="../lib/defs/EPSG42304.js"></script>
+  <script src="testdata.js"></script>
+  <script src="runtests.js"></script>
+</head>
+
+<body onload="runTests()">
+  <div id="header">
+    <h1>Proj4js test page</h1>
+  </div>
+  <div id="navbar">
+    <a href="http://trac.osgeo.org/proj4js">Proj4js Wiki/Trac</a> | 
+    <a href="http://wiki.osgeo.org/wiki/MetaCRS">OSGeo MetaCRS</a> |
+    <a href="http://spatialreference.org/">spatialreference.org</a> |
+    <a href="http://communitymapbuilder.org/">MapBuilder</a> | 
+    <a href="http://openlayers.org/">OpenLayers</a> | 
+  </div>
+  <table id="testResult" border="1">
+      <tr>
+        <th>projection</th>
+        <th>class</th>
+        <th colspan="3">forward (m)</th>
+        <th colspan="3">inverse (dd)</th>
+      </tr>
+  </table>
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/mkpjcat.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/mkpjcat.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/mkpjcat.py	(revision 76)
@@ -0,0 +1,21 @@
+#!/usr/bin/env python
+
+import sys
+sys.path.append(".")
+
+import pjjs
+
+resourcesDirectory = "catalogues"
+targetDirectory = "../lib/defs"
+
+if len(sys.argv) > 1:
+    resourcesDirectory = sys.argv[1]
+
+if len(sys.argv) > 2:
+    targetDirectory = sys.argv[2]
+
+print "Generating Proj4js catalogues."
+pjjs.pjcat2js_clean(resourcesDirectory,targetDirectory)
+pjjs.pjcat2js_run(resourcesDirectory,targetDirectory)
+
+print "Done."
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/toposort.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/toposort.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/toposort.py	(revision 76)
@@ -0,0 +1,260 @@
+#
+# According to <http://www.vrplumber.com/programming/> this file
+# is licensed under a BSD-style license. We only use the section
+# originally by Tim Peters.
+#
+# TODO: The use of this code needs to be okayed by someone.
+#
+
+class RecursionError( OverflowError, ValueError ):
+    '''Unable to calculate result because of recursive structure'''
+    
+
+def sort(nodes, routes, noRecursion=1):
+    '''Passed a list of node IDs and a list of source,dest ID routes
+    attempt to create a list of stages where each sub list
+    is one stage in a process.
+    '''
+    children, parents = _buildChildrenLists(routes)
+    # first stage is those nodes
+    # having no incoming routes...
+    stage = []
+    stages = [stage]
+    taken = []
+    for node in nodes:
+        if (not parents.get(node)):
+            stage.append (node)
+    if nodes and not stage:
+        # there is no element which does not depend on
+        # some other element!!!
+        stage.append( nodes[0])
+    taken.extend( stage )
+    nodes = filter ( lambda x, l=stage: x not in l, nodes )
+    while nodes:
+        previousStageChildren = []
+        nodelen = len(nodes)
+        # second stage are those nodes
+        # which are direct children of the first stage
+        for node in stage:
+            for child in children.get (node, []):
+                if child not in previousStageChildren and child not in taken:
+                    previousStageChildren.append(child)
+                elif child in taken and noRecursion:
+                    raise RecursionError( (child, node) )
+        # unless they are children of other direct children...
+        # TODO, actually do that...
+        stage = previousStageChildren
+        removes = []
+        for current in stage:
+            currentParents = parents.get( current, [] )
+            for parent in currentParents:
+                if parent in stage and parent != current:
+                    # might wind up removing current...
+                    if not current in parents.get(parent, []):
+                        # is not mutually dependent...
+                        removes.append( current )
+        for remove in removes:
+            while remove in stage:
+                stage.remove( remove )
+        stages.append( stage)
+        taken.extend( stage )
+        nodes = filter ( lambda x, l=stage: x not in l, nodes )
+        if nodelen == len(nodes):
+            if noRecursion:
+                raise RecursionError( nodes )
+            else:
+                stages.append( nodes[:] )
+                nodes = []
+    return stages
+
+def _buildChildrenLists (routes):
+    childrenTable = {}
+    parentTable = {}
+    for sourceID,destinationID in routes:
+        currentChildren = childrenTable.get( sourceID, [])
+        currentParents = parentTable.get( destinationID, [])
+        if not destinationID in currentChildren:
+            currentChildren.append ( destinationID)
+        if not sourceID in currentParents:
+            currentParents.append ( sourceID)
+        childrenTable[sourceID] = currentChildren
+        parentTable[destinationID] = currentParents
+    return childrenTable, parentTable
+
+
+def toposort (nodes, routes, noRecursion=1):
+    '''Topological sort from Tim Peters, fairly efficient
+    in comparison (it seems).'''
+    #first calculate the recursion depth
+    
+    dependencies = {}
+    inversedependencies = {}
+    if not nodes:
+        return []
+    if not routes:
+        return [nodes]
+    for node in nodes:
+        dependencies[ node ] = (0, node)
+        inversedependencies[ node ] = []
+    
+    
+    for depended, depends in routes:
+        # is it a null rule
+        try:
+            newdependencylevel, object = dependencies.get ( depends, (0, depends))
+        except TypeError:
+            print depends
+            raise
+        dependencies[ depends ] = (newdependencylevel + 1,  depends)
+        # "dependency (existence) of depended-on"
+        newdependencylevel,object = dependencies.get ( depended, (0, depended) )
+        dependencies[ depended ] = (newdependencylevel, depended)
+        # Inverse dependency set up
+        dependencieslist = inversedependencies.get ( depended, [])
+        dependencieslist.append (depends)
+        inversedependencies[depended] = dependencieslist
+    ### Now we do the actual sorting
+    # The first task is to create the sortable
+    # list of dependency-levels
+    sortinglist = dependencies.values()
+    sortinglist.sort ()
+    output = []
+    while sortinglist:
+        deletelist = []
+        generation = []
+        output.append( generation)
+        while sortinglist and sortinglist[0][0] == 0:
+            number, object = sortinglist[0]
+            generation.append ( object )
+            deletelist.append( object )
+            for inverse in inversedependencies.get(object, () ):
+                try:
+                    oldcount, inverse = dependencies [ inverse]
+                    if oldcount > 0:
+                        # will be dealt with on later pass
+                        dependencies [ inverse] = (oldcount-1, inverse)
+                    else:
+                        # will be dealt with on this pass,
+                        # so needs not to be in the sorting list next time
+                        deletelist.append( inverse )
+                    # just in case a loop comes through
+                    inversedependencies[object] = []
+                except KeyError:
+                    # dealing with a recursion-breaking run...
+                    pass
+            del sortinglist [0]
+        # if no elements could be deleted, then
+        # there is something which depends upon itself
+        if not deletelist:
+            if noRecursion:
+                raise RecursionError( sortinglist )
+            else:
+                # hack so that something gets deleted...
+##                import pdb
+##                pdb.set_trace()
+                dependencies[sortinglist[0][1]] = (0,sortinglist[0][1])
+        # delete the items that were dealt with
+        for item in deletelist:
+            try:
+                del dependencies [ item ]
+            except KeyError:
+                pass
+        # need to recreate the sortinglist
+        sortinglist = dependencies.values()
+        if not generation:
+            output.remove( generation )
+        sortinglist.sort ()
+    return output
+
+
+
+
+
+if __name__ == "__main__":
+
+    nodes = ['a', 'b', 'c', 'd', 'e', 'f']
+    route = [('a', 'b'), ('b', 'c'), ('b', 'd'), ('e','f')]
+
+    for x in  toposort( nodes, route):
+        for a in x:
+            print a
+
+    raise SystemExit
+
+
+
+    import pprint, traceback
+    nodes= [ 0,1,2,3,4,5 ]
+    testingValues = [
+        [ (0,1),(1,2),(2,3),(3,4),(4,5)],
+        [ (0,1),(0,2),(1,2),(3,4),(4,5)],
+        [
+        (0,1),
+        (0,2),
+        (0,2),
+                    (2,4),
+                    (2,5),
+                (3,2),
+        (0,3)],
+        [
+        (0,1), # 3-element cycle test, no orphan nodes
+        (1,2),
+        (2,0),
+                    (2,4),
+                    (2,5),
+                (3,2),
+        (0,3)],
+        [
+        (0,1),
+        (1,1),
+        (1,1),
+                (1,4),
+                (1,5),
+                (1,2),
+        (3,1),
+        (2,1),
+        (2,0)],
+        [
+            (0,1),
+            (1,0),
+            (0,2),
+            (0,3),
+        ],
+        [
+            (0,1),
+            (1,0),
+            (0,2),
+            (3,1),
+        ],
+    ]
+    print 'sort, no recursion allowed'
+    for index in range(len(testingValues)):
+##        print '    %s -- %s'%( index, testingValues[index])
+        try:
+            print '        ', sort( nodes, testingValues[index] )
+        except:
+            print 'exception raised'
+    print 'toposort, no recursion allowed'
+    for index in range(len(testingValues)):
+##        print '    %s -- %s'%( index, testingValues[index])
+        try:
+            print '        ', toposort( nodes, testingValues[index] )
+        except:
+            print 'exception raised'
+    print 'sort, recursion allowed'
+    for index in range(len(testingValues)):
+##        print '    %s -- %s'%( index, testingValues[index])
+        try:
+            print '        ', sort( nodes, testingValues[index],0 )
+        except:
+            print 'exception raised'
+    print 'toposort, recursion allowed'
+    for index in range(len(testingValues)):
+##        print '    %s -- %s'%( index, testingValues[index])
+        try:
+            print '        ', toposort( nodes, testingValues[index],0 )
+        except:
+            print 'exception raised'
+        
+        
+    
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.c
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.c	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.c	(revision 76)
@@ -0,0 +1,272 @@
+/* jsmin.c
+   2006-05-04
+
+Copyright (c) 2002 Douglas Crockford  (www.crockford.com)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+The Software shall be used for Good, not Evil.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+*/
+
+#include <stdlib.h>
+#include <stdio.h>
+
+static int   theA;
+static int   theB;
+static int   theLookahead = EOF;
+
+
+/* isAlphanum -- return true if the character is a letter, digit, underscore,
+        dollar sign, or non-ASCII character.
+*/
+
+static int
+isAlphanum(int c)
+{
+    return ((c >= 'a' && c <= 'z') || (c >= '0' && c <= '9') ||
+        (c >= 'A' && c <= 'Z') || c == '_' || c == '$' || c == '\\' ||
+        c > 126);
+}
+
+
+/* get -- return the next character from stdin. Watch out for lookahead. If
+        the character is a control character, translate it to a space or
+        linefeed.
+*/
+
+static int
+get()
+{
+    int c = theLookahead;
+    theLookahead = EOF;
+    if (c == EOF) {
+        c = getc(stdin);
+    }
+    if (c >= ' ' || c == '\n' || c == EOF) {
+        return c;
+    }
+    if (c == '\r') {
+        return '\n';
+    }
+    return ' ';
+}
+
+
+/* peek -- get the next character without getting it.
+*/
+
+static int
+peek()
+{
+    theLookahead = get();
+    return theLookahead;
+}
+
+
+/* next -- get the next character, excluding comments. peek() is used to see
+        if a '/' is followed by a '/' or '*'.
+*/
+
+static int
+next()
+{
+    int c = get();
+    if  (c == '/') {
+        switch (peek()) {
+        case '/':
+            for (;;) {
+                c = get();
+                if (c <= '\n') {
+                    return c;
+                }
+            }
+        case '*':
+            get();
+            for (;;) {
+                switch (get()) {
+                case '*':
+                    if (peek() == '/') {
+                        get();
+                        return ' ';
+                    }
+                    break;
+                case EOF:
+                    fprintf(stderr, "Error: JSMIN Unterminated comment.\n");
+                    exit(1);
+                }
+            }
+        default:
+            return c;
+        }
+    }
+    return c;
+}
+
+
+/* action -- do something! What you do is determined by the argument:
+        1   Output A. Copy B to A. Get the next B.
+        2   Copy B to A. Get the next B. (Delete A).
+        3   Get the next B. (Delete B).
+   action treats a string as a single character. Wow!
+   action recognizes a regular expression if it is preceded by ( or , or =.
+*/
+
+static void
+action(int d)
+{
+    switch (d) {
+    case 1:
+        putc(theA, stdout);
+    case 2:
+        theA = theB;
+        if (theA == '\'' || theA == '"') {
+            for (;;) {
+                putc(theA, stdout);
+                theA = get();
+                if (theA == theB) {
+                    break;
+                }
+                if (theA <= '\n') {
+                    fprintf(stderr,
+"Error: JSMIN unterminated string literal: %c\n", theA);
+                    exit(1);
+                }
+                if (theA == '\\') {
+                    putc(theA, stdout);
+                    theA = get();
+                }
+            }
+        }
+    case 3:
+        theB = next();
+        if (theB == '/' && (theA == '(' || theA == ',' || theA == '=' ||
+                theA == ':' || theA == '[' || theA == '!' || theA == '&' || 
+                theA == '|')) {
+            putc(theA, stdout);
+            putc(theB, stdout);
+            for (;;) {
+                theA = get();
+                if (theA == '/') {
+                    break;
+                } else if (theA =='\\') {
+                    putc(theA, stdout);
+                    theA = get();
+                } else if (theA <= '\n') {
+                    fprintf(stderr,
+"Error: JSMIN unterminated Regular Expression literal.\n", theA);
+                    exit(1);
+                }
+                putc(theA, stdout);
+            }
+            theB = next();
+        }
+    }
+}
+
+
+/* jsmin -- Copy the input to the output, deleting the characters which are
+        insignificant to JavaScript. Comments will be removed. Tabs will be
+        replaced with spaces. Carriage returns will be replaced with linefeeds.
+        Most spaces and linefeeds will be removed.
+*/
+
+static void
+jsmin()
+{
+    theA = '\n';
+    action(3);
+    while (theA != EOF) {
+        switch (theA) {
+        case ' ':
+            if (isAlphanum(theB)) {
+                action(1);
+            } else {
+                action(2);
+            }
+            break;
+        case '\n':
+            switch (theB) {
+            case '{':
+            case '[':
+            case '(':
+            case '+':
+            case '-':
+                action(1);
+                break;
+            case ' ':
+                action(3);
+                break;
+            default:
+                if (isAlphanum(theB)) {
+                    action(1);
+                } else {
+                    action(2);
+                }
+            }
+            break;
+        default:
+            switch (theB) {
+            case ' ':
+                if (isAlphanum(theA)) {
+                    action(1);
+                    break;
+                }
+                action(3);
+                break;
+            case '\n':
+                switch (theA) {
+                case '}':
+                case ']':
+                case ')':
+                case '+':
+                case '-':
+                case '"':
+                case '\'':
+                    action(1);
+                    break;
+                default:
+                    if (isAlphanum(theA)) {
+                        action(1);
+                    } else {
+                        action(3);
+                    }
+                }
+                break;
+            default:
+                action(1);
+                break;
+            }
+        }
+    }
+}
+
+
+/* main -- Output any command line arguments as comments
+        and then minify the input.
+*/
+extern int
+main(int argc, char* argv[])
+{
+    int i;
+    for (i = 1; i < argc; i += 1) {
+        fprintf(stdout, "// %s\n", argv[i]);
+    }
+    jsmin();
+    return 0;
+}
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/mergejs.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/mergejs.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/mergejs.py	(revision 76)
@@ -0,0 +1,267 @@
+#!/usr/bin/env python
+#
+# Merge multiple JavaScript source code files into one.
+#
+# Usage:
+# This script requires source files to have dependencies specified in them.
+#
+# Dependencies are specified with a comment of the form:
+#
+#     // @requires <file path>
+#
+#  e.g.
+#
+#    // @requires Geo/DataSource.js
+#
+#  or (ideally) within a class comment definition
+#
+#     /**
+#      * @class
+#      *
+#      * @requires OpenLayers/Layer.js
+#      */
+#
+# This script should be executed like so:
+#
+#     mergejs.py <output.js> <directory> [...]
+#
+# e.g.
+#
+#     mergejs.py openlayers.js Geo/ CrossBrowser/
+#
+#  This example will cause the script to walk the `Geo` and
+#  `CrossBrowser` directories--and subdirectories thereof--and import
+#  all `*.js` files encountered. The dependency declarations will be extracted
+#  and then the source code from imported files will be output to 
+#  a file named `openlayers.js` in an order which fulfils the dependencies
+#  specified.
+#
+#
+# Note: This is a very rough initial version of this code.
+#
+# -- Copyright 2005-2007 MetaCarta, Inc. / OpenLayers project --
+#
+
+# TODO: Allow files to be excluded. e.g. `Crossbrowser/DebugMode.js`?
+# TODO: Report error when dependency can not be found rather than KeyError.
+
+import re
+import os
+import sys
+import glob
+
+SUFFIX_JAVASCRIPT = ".js"
+
+RE_REQUIRE = "@requires (.*)\n" # TODO: Ensure in comment?
+class SourceFile:
+    """
+    Represents a Javascript source code file.
+    """
+
+    def __init__(self, filepath, source):
+        """
+        """
+        self.filepath = filepath
+        self.source = source
+
+        self.requiredBy = []
+
+
+    def _getRequirements(self):
+        """
+        Extracts the dependencies specified in the source code and returns
+        a list of them.
+        """
+        # TODO: Cache?
+        return re.findall(RE_REQUIRE, self.source)
+
+    requires = property(fget=_getRequirements, doc="")
+
+
+
+def usage(filename):
+    """
+    Displays a usage message.
+    """
+    print "%s [-c <config file>] <output.js> <directory> [...]" % filename
+
+
+class Config:
+    """
+    Represents a parsed configuration file.
+
+    A configuration file should be of the following form:
+
+        [first]
+        3rd/prototype.js
+        core/application.js
+        core/params.js
+
+        [last]
+        core/api.js
+
+        [exclude]
+        3rd/logger.js
+
+    All headings are required.
+
+    The files listed in the `first` section will be forced to load
+    *before* all other files (in the order listed). The files in `last`
+    section will be forced to load *after* all the other files (in the
+    order listed).
+
+    The files list in the `exclude` section will not be imported.
+    
+    """
+
+    def __init__(self, filename):
+        """
+        Parses the content of the named file and stores the values.
+        """
+        lines = [line.strip() # Assumes end-of-line character is present
+                 for line in open(filename)
+                 if line.strip()] # Skip blank lines
+
+        self.forceFirst = lines[lines.index("[first]") + 1:lines.index("[last]")]
+
+        self.forceLast = lines[lines.index("[last]") + 1:lines.index("[include]")]
+        self.include =  lines[lines.index("[include]") + 1:lines.index("[exclude]")]
+        self.exclude =  lines[lines.index("[exclude]") + 1:]
+
+def run (sourceDirectory, outputFilename = None, configFile = None):
+    cfg = None
+    if configFile:
+        cfg = Config(configFile)
+
+    allFiles = []
+
+    ## Find all the Javascript source files
+    for root, dirs, files in os.walk(sourceDirectory):
+        for filename in files:
+            if filename.endswith(SUFFIX_JAVASCRIPT) and not filename.startswith("."):
+                filepath = os.path.join(root, filename)[len(sourceDirectory)+1:]
+                filepath = filepath.replace("\\", "/")
+                if cfg and cfg.include:
+                    include = False
+                    for included in cfg.include:
+                        if glob.fnmatch.fnmatch(filepath, included):
+                            include = True
+                    if include or filepath in cfg.forceFirst:
+                        allFiles.append(filepath)
+                elif (not cfg) or (filepath not in cfg.exclude):
+                    exclude = False
+                    for excluded in cfg.exclude:
+                        if glob.fnmatch.fnmatch(filepath, excluded):
+                            exclude = True
+                    if not exclude:
+                        allFiles.append(filepath)
+
+    ## Header inserted at the start of each file in the output
+    HEADER = "/* " + "=" * 70 + "\n    %s\n" + "   " + "=" * 70 + " */\n\n"
+
+    files = {}
+
+    order = [] # List of filepaths to output, in a dependency satisfying order 
+
+    ## Import file source code
+    ## TODO: Do import when we walk the directories above?
+    for filepath in allFiles:
+        print "Importing: %s" % filepath
+        fullpath = os.path.join(sourceDirectory, filepath)
+        content = open(fullpath, "U").read() # TODO: Ensure end of line @ EOF?
+        files[filepath] = SourceFile(filepath, content) # TODO: Chop path?
+
+    print
+
+    from toposort import toposort
+
+    complete = False
+    resolution_pass = 1
+
+    while not complete:
+        order = [] # List of filepaths to output, in a dependency satisfying order 
+        nodes = []
+        routes = []
+        ## Resolve the dependencies
+        print "Resolution pass %s... " % resolution_pass
+        resolution_pass += 1 
+
+        for filepath, info in files.items():
+            nodes.append(filepath)
+            for neededFilePath in info.requires:
+                routes.append((neededFilePath, filepath))
+
+        for dependencyLevel in toposort(nodes, routes):
+            for filepath in dependencyLevel:
+                order.append(filepath)
+                if not files.has_key(filepath):
+                    print "Importing: %s" % filepath
+                    fullpath = os.path.join(sourceDirectory, filepath)
+                    content = open(fullpath, "U").read() # TODO: Ensure end of line @ EOF?
+                    files[filepath] = SourceFile(filepath, content) # TODO: Chop path?
+        
+
+
+        # Double check all dependencies have been met
+        complete = True
+        try:
+            for fp in order:
+                if max([order.index(rfp) for rfp in files[fp].requires] +
+                       [order.index(fp)]) != order.index(fp):
+                    complete = False
+        except:
+            complete = False
+        
+        print    
+
+
+    ## Move forced first and last files to the required position
+    if cfg:
+        print "Re-ordering files..."
+        order = cfg.forceFirst + [item
+                     for item in order
+                     if ((item not in cfg.forceFirst) and
+                         (item not in cfg.forceLast))] + cfg.forceLast
+    
+    print
+    ## Output the files in the determined order
+    result = []
+
+    for fp in order:
+        f = files[fp]
+        print "Exporting: ", f.filepath
+        result.append(HEADER % f.filepath)
+        source = f.source
+        result.append(source)
+        if not source.endswith("\n"):
+            result.append("\n")
+
+    print "\nTotal files merged: %d " % len(files)
+
+    if outputFilename:
+        print "\nGenerating: %s" % (outputFilename)
+        open(outputFilename, "w").write("".join(result))
+    return "".join(result)
+
+if __name__ == "__main__":
+    import getopt
+
+    options, args = getopt.getopt(sys.argv[1:], "-c:")
+    
+    try:
+        outputFilename = args[0]
+    except IndexError:
+        usage(sys.argv[0])
+        raise SystemExit
+    else:
+        sourceDirectory = args[1]
+        if not sourceDirectory:
+            usage(sys.argv[0])
+            raise SystemExit
+
+    configFile = None
+    if options and options[0][0] == "-c":
+        configFile = options[0][1]
+        print "Parsing configuration file: %s" % filename
+
+    run( sourceDirectory, outputFilename, configFile )
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/IGNF
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/IGNF	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/IGNF	(revision 76)
@@ -0,0 +1,131 @@
+<CROZ63> +title=Crozet 1963 +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<CSG67> +title=Guyane CSG67 +proj=geocent +towgs84=-193.0660,236.9930,105.4470,0.4814,-0.8074,0.1276,1.564900 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<ED50> +title=ED50 +proj=geocent +towgs84=-84.0000,-97.0000,-117.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<GUAD48> +title=Guadeloupe Ste Anne +proj=geocent +towgs84=-472.2900,-5.6300,-304.1200,0.4362,-0.8374,0.2563,1.898400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<GUADFM49> +title=Guadeloupe Fort Marigot +proj=geocent +towgs84=136.5960,248.1480,-429.7890 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<IGN63> +title=IGN 1963 (Hiva Oa, Tahuata, Mohotani) +proj=geocent +towgs84=410.7210,55.0490,80.7460,-2.5779,-2.3514,-0.6664,17.331100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<IGN72> +title=IGN 1972 Grande-Terre / Ile des Pins +proj=geocent +towgs84=-11.6400,-348.6000,291.6800 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+# W [JULES55]
+<KERG62CAR> +title=Kerguelen - K0 +proj=geocent +towgs84=145.0000,-187.0000,103.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<MART38> +title=Martinique Fort-Desaix +proj=geocent +towgs84=126.9260,547.9390,130.4090,-2.7867,5.1612,-0.8584,13.822650 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+# W [MAUPITI]
+<MAYO50> +title=Mayotte Combani +proj=geocent +towgs84=-599.9280,-275.5520,-195.6650,-0.0835,-0.4715,0.0602,49.281400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<MOOREA87> +title=Moorea 1987 +proj=geocent +towgs84=215.9820,149.5930,176.2290,3.2624,1.6920,1.1571,10.477300 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<NTF> +title=Nouvelle Triangulation Francaise +proj=geocent +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +units=m +no_defs <>
+<NUKU72> +title=IGN 1972 Nuku Hiva +proj=geocent +towgs84=165.7320,216.7200,180.5050,-0.6434,-0.4512,-0.0791,7.420400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<REUN47> +title=Reunion 1947 +proj=geocent +towgs84=789.5240,-626.4860,-89.9040,0.6006,76.7946,-10.5788,-32.324100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<RGF93> +title=Reseau geodesique francais 1993 +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGFG95> +title=Reseau geodesique francais de Guyane 1995 +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGM04> +title=RGM04 (Reseau Geodesique de Mayotte 2004) +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGNC> +title=Reseau Geodesique de Nouvelle-Caledonie +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGPF> +title=RGPF (Reseau Geodesique de Polynesie Francaise) +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGR92> +title=Reseau geodesique Reunion 1992 +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGSPM06> +title=Reseau Geodesique Saint-Pierre-et-Miquelon (2006) +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RRAF91> +title=RRAF 1991 (Reseau de Reference des Antilles Francaises) +proj=geocent +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<STPM50> +title=St Pierre et Miquelon 1950 +proj=geocent +towgs84=-95.5930,573.7630,173.4420,-0.9602,1.2510,-1.3918,42.626500 +a=6378206.4000 +rf=294.9786982000000 +units=m +no_defs <>
+<TAHAA> +title=Raiatea - Tahaa 51-54 (Tahaa, Base Terme Est) +proj=geocent +towgs84=72.4380,345.9180,79.4860,-1.6045,-0.8823,-0.5565,1.374600 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<TAHI79> +title=IGN79 (Tahiti) Iles de la Societe +proj=geocent +towgs84=221.5250,152.9480,176.7680,2.3847,1.3896,0.8770,11.474100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<TERA50> +title=Pointe Geologie - Perroud 1950 +proj=geocent +towgs84=324.8000,153.6000,172.1000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<WALL78> +title=Wallis-Uvea 1978 (MOP78) +proj=geocent +towgs84=253.0000,-133.0000,-127.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<WGS72> +title=World Geodetic System 1972 +proj=geocent +towgs84=0.0000,12.0000,6.0000 +a=6378135.0000 +rf=298.2600000000000 +units=m +no_defs <>
+<WGS84> +title=World Geodetic System 1984 +proj=geocent +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<CROZ63GEO> +title=Crozet 1963 +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<CSG67GEO> +title=Guyane CSG67 UTM fuseau 21 +proj=longlat +towgs84=-193.0660,236.9930,105.4470,0.4814,-0.8074,0.1276,1.564900 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<ED50G> +title=ED50 +proj=longlat +towgs84=-84.0000,-97.0000,-117.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<GUAD48GEO> +title=Guadeloupe Ste Anne +proj=longlat +towgs84=-472.2900,-5.6300,-304.1200,0.4362,-0.8374,0.2563,1.898400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<GUADFM49GEO> +title=Guadeloupe Fort Marigot +proj=longlat +towgs84=136.5960,248.1480,-429.7890 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<IGN63GEO> +title=IGN 1963 (Hiva Oa, Tahuata, Mohotani) +proj=longlat +towgs84=410.7210,55.0490,80.7460,-2.5779,-2.3514,-0.6664,17.331100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<IGN72GEO> +title=IGN 1972 Grande-Terre / Ile des Pins +proj=longlat +towgs84=-11.6400,-348.6000,291.6800 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<KERG62GEO> +title=Kerguelen - K0 +proj=longlat +towgs84=145.0000,-187.0000,103.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<MART38GEO> +title=Martinique Fort-Desaix +proj=longlat +towgs84=126.9260,547.9390,130.4090,-2.7867,5.1612,-0.8584,13.822650 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<MAYO50GEO> +title=Mayotte Combani +proj=longlat +towgs84=-599.9280,-275.5520,-195.6650,-0.0835,-0.4715,0.0602,49.281400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<MOOREA87GEO> +title=Moorea 1987 +proj=longlat +towgs84=215.9820,149.5930,176.2290,3.2624,1.6920,1.1571,10.477300 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<NTFG> +title=Nouvelle Triangulation Francaise Greenwich degres sexagesimaux +proj=longlat +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +units=m +no_defs <>
+<NTFP> +title=Nouvelle Triangulation Francaise Paris grades +proj=longlat +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +units=m +no_defs <>
+<NUKU72GEO> +title=IGN 1972 Nuku Hiva +proj=longlat +towgs84=165.7320,216.7200,180.5050,-0.6434,-0.4512,-0.0791,7.420400 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<REUN47GEO> +title=Reunion 1947 +proj=longlat +towgs84=789.5240,-626.4860,-89.9040,0.6006,76.7946,-10.5788,-32.324100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<RGF93G> +title=Reseau geodesique francais 1993 +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGFG95GEO> +title=Reseau geodesique francais de Guyane 1995 +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGM04GEO> +title=RGM04 (Reseau Geodesique de Mayotte 2004) +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGNCGEO> +title=Reseau Geodesique de Nouvelle-Caledonie +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGPFGEO> +title=RGPF (Reseau Geodesique de Polynesie Francaise) +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGR92GEO> +title=Reseau geodesique de la Reunion 1992 +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<RGSPM06GEO> +title=Saint-Pierre-et-Miquelon (2006) +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<STPM50GEO> +title=St Pierre et Miquelon 1950  +proj=longlat +towgs84=-95.5930,573.7630,173.4420,-0.9602,1.2510,-1.3918,42.626500 +a=6378206.4000 +rf=294.9786982000000 +units=m +no_defs <>
+<TAHAAGEO> +title=Raiatea - Tahaa 51-54 (Tahaa, Base Terme Est) +proj=longlat +towgs84=72.4380,345.9180,79.4860,-1.6045,-0.8823,-0.5565,1.374600 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<TAHI79GEO> +title=IGN79 (Tahiti) Iles de la Societe +proj=longlat +towgs84=221.5250,152.9480,176.7680,2.3847,1.3896,0.8770,11.474100 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<TERA50GEO> +title=Pointe Geologie - Perroud 1950 +proj=longlat +towgs84=324.8000,153.6000,172.1000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<WALL78GEO> +title=Wallis - Uvea 1978 (MOP78) +proj=longlat +towgs84=253.0000,-133.0000,-127.0000 +a=6378388.0000 +rf=297.0000000000000 +units=m +no_defs <>
+<WGS72G> +title=WGS72 +proj=longlat +towgs84=0.0000,12.0000,6.0000 +a=6378135.0000 +rf=298.2600000000000 +units=m +no_defs <>
+<WGS84G> +title=World Geodetic System 1984 +proj=longlat +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<WGS84RRAFGEO> +title=Reseau de reference des Antilles francaises (1988-1991) +proj=longlat +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<XGEO> +title=Systeme CIO-BIH +proj=longlat +towgs84=0.0000,0.0000,0.5000,0.0000,0.0000,0.0140,-0.100000 +a=6378137.0000 +rf=298.2572221010000 +units=m +no_defs <>
+<CROZ63UTM39S> +title=Crozet 1963 +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=51.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<CSG67UTM21> +title=Guyane CSG67 UTM fuseau 21 +proj=tmerc +towgs84=-193.0660,236.9930,105.4470,0.4814,-0.8074,0.1276,1.564900 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-57.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<CSG67UTM22> +title=Guyane CSG67 UTM fuseau 22 +proj=tmerc +towgs84=-193.0660,236.9930,105.4470,0.4814,-0.8074,0.1276,1.564900 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-51.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALANF> +title=Geoportail - Antilles francaises +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=15.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALCRZ> +title=Geoportail - Crozet +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-46.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALFXX> +title=Geoportail - France metropolitaine +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=46.500000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALGUF> +title=Geoportail - Guyane +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=4.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+# FIXME : Bug Geoconcept : +lat_ts=-49.500000000 a Ã©tÃ© remplacÃ© par +lat_ts=-47.300000000 (soluce temporaire)
+<GEOPORTALKER> +title=Geoportail - Kerguelen +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-49.500000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALMYT> +title=Geoportail - Mayotte +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-12.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALNCL> +title=Geoportail - Nouvelle-Caledonie +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-22.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALPYF> +title=Geoportail - Polynesie francaise +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-15.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALREU> +title=Geoportail - Reunion et dependances +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-21.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALSPM> +title=Geoportail - Saint-Pierre et Miquelon +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=47.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GEOPORTALWLF> +title=Geoportail - Wallis et Futuna +proj=eqc +nadgrids=null +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=0.000000000 +lat_ts=-14.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<GUAD48UTM20> +title=Guadeloupe Ste Anne +proj=tmerc +towgs84=-472.2900,-5.6300,-304.1200,0.4362,-0.8374,0.2563,1.898400 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-63.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<GUADFM49U20> +title=Guadeloupe Fort Marigot  +proj=tmerc +towgs84=136.5960,248.1480,-429.7890 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-63.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<IGN63UTM7S> +title=IGN 1963 - Hiva Oa, Tahuata, Mohotani - UTM fuseau 7 Sud +proj=tmerc +towgs84=410.7210,55.0490,80.7460,-2.5779,-2.3514,-0.6664,17.331100 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-141.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<IGN72UTM58S> +title=IGN 1972 - UTM fuseau 58 Sud +proj=tmerc +towgs84=-11.6400,-348.6000,291.6800 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=165.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<KERG62UTM42S> +title=Kerguelen 1962 +proj=tmerc +towgs84=145.0000,-187.0000,103.0000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=69.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<LAMB1> +title=Lambert I +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=49.500000000 +lon_0=0.000000000 +k_0=0.99987734 +lat_1=49.500000000 +x_0=600000.000 +y_0=200000.000 +units=m +no_defs <>
+<LAMB1C> +title=Lambert I Carto +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=49.500000000 +lon_0=0.000000000 +k_0=0.99987734 +lat_1=49.500000000 +x_0=600000.000 +y_0=1200000.000 +units=m +no_defs <>
+<LAMB2> +title=Lambert II +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=46.800000000 +lon_0=0.000000000 +k_0=0.99987742 +lat_1=46.800000000 +x_0=600000.000 +y_0=200000.000 +units=m +no_defs <>
+<LAMB2C> +title=Lambert II Carto +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=46.800000000 +lon_0=0.000000000 +k_0=0.99987742 +lat_1=46.800000000 +x_0=600000.000 +y_0=2200000.000 +units=m +no_defs <>
+<LAMB3> +title=Lambert III +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=44.100000000 +lon_0=0.000000000 +k_0=0.99987750 +lat_1=44.100000000 +x_0=600000.000 +y_0=200000.000 +units=m +no_defs <>
+<LAMB3C> +title=Lambert III Carto +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=44.100000000 +lon_0=0.000000000 +k_0=0.99987750 +lat_1=44.100000000 +x_0=600000.000 +y_0=3200000.000 +units=m +no_defs <>
+<LAMB4> +title=Lambert IV +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=42.165000000 +lon_0=0.000000000 +k_0=0.99994471 +lat_1=42.165000000 +x_0=234.358 +y_0=185861.369 +units=m +no_defs <>
+<LAMB4C> +title=Lambert IV Carto +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=42.165000000 +lon_0=0.000000000 +k_0=0.99994471 +lat_1=42.165000000 +x_0=234.358 +y_0=4185861.369 +units=m +no_defs <>
+<LAMB93> +title=Lambert 93 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=46.500000000 +lon_0=3.000000000 +lat_1=44.000000000 +lat_2=49.000000000 +x_0=700000.000 +y_0=6600000.000 +units=m +no_defs <>
+<RGF93CC42> +title=Lambert conique conforme Zone 1 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=42.000000000 +lon_0=3.000000000 +lat_1=41.200000000 +lat_2=42.800000000 +x_0=1700000.000 +y_0=1200000.000 +units=m +no_defs <>
+<RGF93CC43> +title=Lambert conique conforme Zone 2 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=43.000000000 +lon_0=3.000000000 +lat_1=42.200000000 +lat_2=43.800000000 +x_0=1700000.000 +y_0=2200000.000 +units=m +no_defs <>
+<RGF93CC44> +title=Lambert conique conforme Zone 3 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=44.000000000 +lon_0=3.000000000 +lat_1=43.200000000 +lat_2=44.800000000 +x_0=1700000.000 +y_0=3200000.000 +units=m +no_defs <>
+<RGF93CC45> +title=Lambert conique conforme Zone 4 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=45.000000000 +lon_0=3.000000000 +lat_1=44.200000000 +lat_2=45.800000000 +x_0=1700000.000 +y_0=4200000.000 +units=m +no_defs <>
+<RGF93CC46> +title=Lambert conique conforme Zone 5 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=46.000000000 +lon_0=3.000000000 +lat_1=45.200000000 +lat_2=46.800000000 +x_0=1700000.000 +y_0=5200000.000 +units=m +no_defs <>
+<RGF93CC47> +title=Lambert conique conforme Zone 6 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=47.000000000 +lon_0=3.000000000 +lat_1=46.200000000 +lat_2=47.800000000 +x_0=1700000.000 +y_0=6200000.000 +units=m +no_defs <>
+<RGF93CC48> +title=Lambert conique conforme Zone 7 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=48.000000000 +lon_0=3.000000000 +lat_1=47.200000000 +lat_2=48.800000000 +x_0=1700000.000 +y_0=7200000.000 +units=m +no_defs <>
+<RGF93CC49> +title=Lambert conique conforme Zone 8 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=49.000000000 +lon_0=3.000000000 +lat_1=48.200000000 +lat_2=49.800000000 +x_0=1700000.000 +y_0=8200000.000 +units=m +no_defs <>
+<RGF93CC50> +title=Lambert conique conforme Zone 9 +proj=lcc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=50.000000000 +lon_0=3.000000000 +lat_1=49.200000000 +lat_2=50.800000000 +x_0=1700000.000 +y_0=9200000.000 +units=m +no_defs <>
+<LAMBE> +title=Lambert II etendu +proj=lcc +nadgrids=ntf_r93.gsb,null +towgs84=-168.0000,-60.0000,320.0000 +a=6378249.2000 +rf=293.4660210000000 +pm=2.337229167 +lat_0=46.800000000 +lon_0=0.000000000 +k_0=0.99987742 +lat_1=46.800000000 +x_0=600000.000 +y_0=2200000.000 +units=m +no_defs <>
+<MART38UTM20> +title=Martinique Fort-Desaix +proj=tmerc +towgs84=126.9260,547.9390,130.4090,-2.7867,5.1612,-0.8584,13.822650 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-63.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<MAYO50UTM38S> +title=Mayotte Combani +proj=tmerc +towgs84=-599.9280,-275.5520,-195.6650,-0.0835,-0.4715,0.0602,49.281400 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=45.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<MILLER> +title=Geoportail - Monde +proj=mill +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lon_0=0.000000000 +x_0=0.000 +y_0=0.000 +units=m +no_defs <>
+<MOOREA87U6S> +title=Moorea 1987 - UTM fuseau 6 Sud +proj=tmerc +towgs84=215.9820,149.5930,176.2290,3.2624,1.6920,1.1571,10.477300 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-147.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<NUKU72U7S> +title=IGN 1972 Nuku Hiva - UTM fuseau 7 Sud +proj=tmerc +towgs84=165.7320,216.7200,180.5050,-0.6434,-0.4512,-0.0791,7.420400 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-141.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<REUN47GAUSSL> +title=Reunion Gauss Laborde +proj=gstmerc +towgs84=789.5240,-626.4860,-89.9040,0.6006,76.7946,-10.5788,-32.324100 +a=6378388.0000 +rf=297.0000000000000 +lat_0=-21.116666667 +lon_0=55.533333333 +k_0=1.00000000 +x_0=160000.000 +y_0=50000.000 +units=m +no_defs <>
+<RGM04UTM38S> +title=UTM fuseau 38 Sud (Reseau Geodesique de Mayotte 2004) +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=45.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGNCUTM57S> +title=Reseau Geodesique de Nouvelle-Caledonie - UTM fuseau 57 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=159.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGNCUTM58S> +title=Reseau Geodesique de Nouvelle-Caledonie - UTM fuseau 58 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=165.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGNCUTM59S> +title=Reseau Geodesique de Nouvelle-Caledonie - UTM fuseau 59 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=171.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGPFUTM5S> +title=RGPF - UTM fuseau 5 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-153.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGPFUTM6S> +title=RGPF - UTM fuseau 6 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-147.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGPFUTM7S> +title=RGPF - UTM fuseau 7 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-141.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGR92UTM40S> +title=RGR92 UTM fuseau 40 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=57.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<RGSPM06U21> +title=Saint-Pierre-et-Miquelon (2006) UTM Fuseau 21 Nord +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-57.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<STEREOSX> +title=Stereographique polaire Sud +proj=sterea +towgs84=0.0000,0.0000,0.5000,0.0000,0.0000,0.0140,-0.100000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=-90.000000000 +lon_0=140.000000000 +k=0.96027295 +x_0=300000.000 +y_0=-2299363.482 +units=m +no_defs <>
+<STPM50UTM21> +title=St Pierre et Miquelon 1950 +proj=tmerc +towgs84=-95.5930,573.7630,173.4420,-0.9602,1.2510,-1.3918,42.626500 +a=6378206.4000 +rf=294.9786982000000 +lat_0=0.000000000 +lon_0=-57.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<TAHAAUTM05S> +title=Tahaa 1951 +proj=tmerc +towgs84=72.4380,345.9180,79.4860,-1.6045,-0.8823,-0.5565,1.374600 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-153.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<TAHI51UTM06S> +title=Tahiti-Terme Nord UTM fuseau 6 Sud +proj=tmerc +towgs84=162.0000,117.0000,154.0000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-147.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<TAHI79UTM6S> +title=Tahiti 1979 +proj=tmerc +towgs84=221.5250,152.9480,176.7680,2.3847,1.3896,0.8770,11.474100 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-147.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<TERA50SPTA> +title=Terre Adelie Stereo polaire Terre Adelie +proj=sterea +towgs84=324.8000,153.6000,172.1000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=-67.000000000 +lon_0=140.000000000 +k=1.00000000 +x_0=300000.000 +y_0=200000.000 +units=m +no_defs <>
+<TERA50STEREO> +title=Terre Adelie 1950 +proj=sterea +towgs84=324.8000,153.6000,172.1000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=-90.000000000 +lon_0=140.000000000 +k=0.96027295 +x_0=300000.000 +y_0=-2299363.482 +units=m +no_defs <>
+<UTM01SW84> +title=World Geodetic System 1984 UTM fuseau 01 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-177.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<UTM20W84GUAD> +title=World Geodetic System 1984 UTM fuseau 20 Nord-Guadeloupe +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-63.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<UTM20W84MART> +title=World Geodetic System 1984 UTM fuseau 20 Nord-Martinique +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-63.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<UTM22RGFG95> +title=RGFG95 UTM fuseau 22 Nord-Guyane +proj=tmerc +towgs84=0.0000,0.0000,0.0000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=-51.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=0.000 +units=m +no_defs <>
+<UTM39SW84> +title=World Geodetic System 1984 UTM fuseau 39 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=51.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<UTM42SW84> +title=World Geodetic System 1984 UTM fuseau 42 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=69.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<UTM43SW84> +title=World Geodetic System 1984 UTM fuseau 43 Sud +proj=tmerc +towgs84=0.0000,0.0000,0.0000,0.0000,0.0000,0.0000,0.000000 +a=6378137.0000 +rf=298.2572221010000 +lat_0=0.000000000 +lon_0=75.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
+<WALL78UTM1S> +title=Wallis-Uvea 1978 (MOP78) UTM 1 SUD +proj=tmerc +towgs84=253.0000,-133.0000,-127.0000 +a=6378388.0000 +rf=297.0000000000000 +lat_0=0.000000000 +lon_0=-177.000000000 +k_0=0.99960000 +x_0=500000.000 +y_0=10000000.000 +units=m +no_defs <>
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/CRS
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/CRS	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/CRS	(revision 76)
@@ -0,0 +1,2 @@
+# WGS 84 longitude - latitude
+<84> +title=WGS 84 longitude-latitude +proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs  <>
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/EPSG
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/EPSG	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/catalogues/EPSG	(revision 76)
@@ -0,0 +1,220 @@
+# CH1903
+<4149> +title=CH1903 +proj=longlat +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +no_defs  <>
+# CH1903+
+<4150> +title=CH1903plus +proj=longlat +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +no_defs  <>
+# CHTRF95
+<4151> +title=CHTRF95 +proj=longlat +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# RGF93
+<4171> +title=RGF93 +proj=longlat +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# ED50
+<4230> +title=ED50 +proj=longlat +ellps=intl +no_defs  <>
+# Guyane Francaise
+<4235> +title=Guyane Francaise +proj=longlat +ellps=intl +no_defs  <>
+# ETRS89
+<4258> +title=ETRS89 +proj=longlat +ellps=GRS80 +no_defs  <>
+# NTF
+<4275> +title=NTF +proj=longlat +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +no_defs  <>
+# WGS 72
+<4322> +title=WGS 72 +proj=longlat +ellps=WGS72 +no_defs  <>
+# WGS 84
+<4326> +title=WGS 84 +proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs  <>
+# Fort Marigot
+<4621> +title=Fort Marigot +proj=longlat +ellps=intl +towgs84=137,248,-430,0,0,0,0 +no_defs  <>
+# Guadeloupe 1948
+<4622> +title=Guadeloupe 1948 +proj=longlat +ellps=intl +no_defs  <>
+# CSG67
+<4623> +title=CSG67 +proj=longlat +ellps=intl +towgs84=-186,230,110,0,0,0,0 +no_defs  <>
+# RGFG95
+<4624> +title=RGFG95 +proj=longlat +ellps=GRS80 +towgs84=2,2,-2,0,0,0,0 +no_defs  <>
+# Martinique 1938
+<4625> +title=Martinique 1938 +proj=longlat +ellps=intl +no_defs  <>
+# Reunion 1947
+<4626> +title=Reunion 1947 +proj=longlat +ellps=intl +no_defs  <>
+# RGR92
+<4627> +title=RGR92 +proj=longlat +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# Tahiti 52
+<4628> +title=Tahiti 52 +proj=longlat +ellps=intl +towgs84=162,117,154,0,0,0,0 +no_defs  <>
+# Tahaa 54
+<4629> +title=Tahaa 54 +proj=longlat +ellps=intl +no_defs  <>
+# IGN72 Nuku Hiva
+<4630> +title=IGN72 Nuku Hiva +proj=longlat +ellps=intl +no_defs  <>
+# Combani 1950
+<4632> +title=Combani 1950 +proj=longlat +ellps=intl +towgs84=-382,-59,-262,0,0,0,0 +no_defs  <>
+# IGN56 Lifou
+<4633> +title=IGN56 Lifou +proj=longlat +ellps=intl +no_defs  <>
+# IGN72 Grand Terre
+<4634> +title=IGN72 Grand Terre +proj=longlat +ellps=intl +no_defs  <>
+# Perroud 1950
+<4637> +title=Perroud 1950 +proj=longlat +ellps=intl +towgs84=325,154,172,0,0,0,0 +no_defs  <>
+# Saint Pierre et Miquelon 1950
+<4638> +title=Saint Pierre et Miquelon 1950 +proj=longlat +ellps=clrk66 +towgs84=30,430,368,0,0,0,0 +no_defs  <>
+# RRAF 1991
+<4640> +title=RRAF 1991 +proj=longlat +ellps=WGS84 +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# IGN53 Mare
+<4641> +title=IGN53 Mare +proj=longlat +ellps=intl +no_defs  <>
+# RGNC 1991
+<4645> +title=RGNC 1991 +proj=longlat +ellps=intl +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# IGN72 Grande Terre
+<4662> +title=IGN72 Grande Terre +proj=longlat +ellps=intl +no_defs  <>
+# IGN63 Hiva Oa
+<4689> +title=IGN63 Hiva Oa +proj=longlat +ellps=intl +no_defs  <>
+# Tahiti 79
+<4690> +title=Tahiti 79 +proj=longlat +ellps=intl +no_defs  <>
+# Moorea 87
+<4691> +title=Moorea 87 +proj=longlat +ellps=intl +towgs84=215.525,149.593,176.229,-3.2624,-1.692,-1.1571,10.4773 +no_defs  <>
+# Maupiti 83
+<4692> +title=Maupiti 83 +proj=longlat +ellps=intl +towgs84=217.037,86.959,23.956,0,0,0,0 +no_defs  <>
+# IGN 1962 Kerguelen
+<4698> +title=IGN 1962 Kerguelen +proj=longlat +ellps=intl +towgs84=145,-187,103,0,0,0,0 +no_defs  <>
+# RGNC91-93
+<4749> +title=RGNC91-93 +proj=longlat +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +no_defs  <>
+# ST87 Ouvea
+<4750> +title=ST87 Ouvea +proj=longlat +ellps=WGS84 +towgs84=-56.263,16.136,-22.856,0,0,0,0 +no_defs  <>
+# NTF (Paris)
+<4807> +title=NTF (Paris) +proj=longlat +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +no_defs  <>
+# CH1903+ / LV95
+<2056> +title=CH1903+ / LV95 +proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 +x_0=2600000 +y_0=1200000 +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +units=m +no_defs  <>
+# RGF93 / Lambert-93
+<2154> +title=RGF93 / Lambert-93 +proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# ETRS89 / TM 30 NE
+<2213> +title=ETRS89 / TM 30 NE +proj=tmerc +lat_0=0 +lon_0=30 +k=0.9996 +x_0=500000 +y_0=0 +ellps=GRS80 +units=m +no_defs  <>
+# Fort Marigot / UTM zone 20N
+<2969> +title=Fort Marigot / UTM zone 20N +proj=utm +zone=20 +ellps=intl +towgs84=137,248,-430,0,0,0,0 +units=m +no_defs  <>
+# Guadeloupe 1948 / UTM zone 20N
+<2970> +title=Guadeloupe 1948 / UTM zone 20N +proj=utm +zone=20 +ellps=intl +units=m +no_defs  <>
+# CSG67 / UTM zone 22N
+<2971> +title=CSG67 / UTM zone 22N +proj=utm +zone=22 +ellps=intl +towgs84=-186,230,110,0,0,0,0 +units=m +no_defs  <>
+# RGFG95 / UTM zone 22N
+<2972> +title=RGFG95 / UTM zone 22N +proj=utm +zone=22 +ellps=GRS80 +towgs84=2,2,-2,0,0,0,0 +units=m +no_defs  <>
+# Martinique 1938 / UTM zone 20N
+<2973> +title=Martinique 1938 / UTM zone 20N +proj=utm +zone=20 +ellps=intl +units=m +no_defs  <>
+# RGR92 / UTM zone 40S
+<2975> +title=RGR92 / UTM zone 40S +proj=utm +zone=40 +south +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# Tahiti 52 / UTM zone 6S
+<2976> +title=Tahiti 52 / UTM zone 6S +proj=utm +zone=6 +south +ellps=intl +towgs84=162,117,154,0,0,0,0 +units=m +no_defs  <>
+# Tahaa 54 / UTM zone 5S
+<2977> +title=Tahaa 54 / UTM zone 5S +proj=utm +zone=5 +south +ellps=intl +units=m +no_defs  <>
+# IGN72 Nuku Hiva / UTM zone 7S
+<2978> +title=IGN72 Nuku Hiva / UTM zone 7S +proj=utm +zone=7 +south +ellps=intl +units=m +no_defs  <>
+# Combani 1950 / UTM zone 38S
+<2980> +title=Combani 1950 / UTM zone 38S +proj=utm +zone=38 +south +ellps=intl +towgs84=-382,-59,-262,0,0,0,0 +units=m +no_defs  <>
+# IGN56 Lifou / UTM zone 58S
+<2981> +title=IGN56 Lifou / UTM zone 58S +proj=utm +zone=58 +south +ellps=intl +units=m +no_defs  <>
+# IGN72 Grand Terre / UTM zone 58S (deprecated)
+<2982> +title=IGN72 Grand Terre / UTM zone 58S (deprecated) +proj=utm +zone=58 +south +ellps=intl +units=m +no_defs  <>
+# RGNC 1991 / Lambert New Caledonia (deprecated)
+<2984> +title=RGNC 1991 / Lambert New Caledonia (deprecated) +proj=lcc +lat_1=-20.66666666666667 +lat_2=-22.33333333333333 +lat_0=-21.5 +lon_0=166 +x_0=400000 +y_0=300000 +ellps=intl +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# Saint Pierre et Miquelon 1950 / UTM zone 21N
+<2987> +title=Saint Pierre et Miquelon 1950 / UTM zone 21N +proj=utm +zone=21 +ellps=clrk66 +towgs84=30,430,368,0,0,0,0 +units=m +no_defs  <>
+# RRAF 1991 / UTM zone 20N
+<2989> +title=RRAF 1991 / UTM zone 20N +proj=utm +zone=20 +ellps=WGS84 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# Reunion 1947 / TM Reunion (deprecated)
+<2990> +title=Reunion 1947 / TM Reunion (deprecated) +proj=tmerc +lat_0=-21.11666666666667 +lon_0=55.53333333333333 +k=1 +x_0=50000 +y_0=160000 +ellps=intl +units=m +no_defs  <>
+# IGN53 Mare / UTM zone 58S
+<2995> +title=IGN53 Mare / UTM zone 58S +proj=utm +zone=58 +south +ellps=intl +units=m +no_defs  <>
+# ETRS89 / ETRS-LCC
+<3034> +title=ETRS89 / ETRS-LCC +proj=lcc +lat_1=35 +lat_2=65 +lat_0=52 +lon_0=10 +x_0=4000000 +y_0=2800000 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / ETRS-LAEA
+<3035> +title=ETRS89 / ETRS-LAEA +proj=laea +lat_0=52 +lon_0=10 +x_0=4321000 +y_0=3210000 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / ETRS-TM30
+<3042> +title=ETRS89 / ETRS-TM30 +proj=utm +zone=30 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / ETRS-TM31
+<3043> +title=ETRS89 / ETRS-TM31 +proj=utm +zone=31 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / ETRS-TM32
+<3044> +title=ETRS89 / ETRS-TM32 +proj=utm +zone=32 +ellps=GRS80 +units=m +no_defs  <>
+# IGN72 Grande Terre / UTM zone 58S
+<3060> +title=IGN72 Grande Terre / UTM zone 58S +proj=utm +zone=58 +south +ellps=intl +units=m +no_defs  <>
+# RGNC91-93 / Lambert New Caledonia
+<3163> +title=RGNC91-93 / Lambert New Caledonia +proj=lcc +lat_1=-20.66666666666667 +lat_2=-22.33333333333333 +lat_0=-21.5 +lon_0=166 +x_0=400000 +y_0=300000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# ST87 Ouvea / UTM zone 58S
+<3164> +title=ST87 Ouvea / UTM zone 58S +proj=utm +zone=58 +south +ellps=WGS84 +towgs84=-56.263,16.136,-22.856,0,0,0,0 +units=m +no_defs  <>
+# NEA74 Noumea / Noumea Lambert
+<3165> +title=NEA74 Noumea / Noumea Lambert +proj=lcc +lat_1=-22.24469175 +lat_2=-22.29469175 +lat_0=-22.26969175 +lon_0=166.44242575 +x_0=0.66 +y_0=1.02 +ellps=intl +units=m +no_defs  <>
+# NEA74 Noumea / Noumea Lambert 2
+<3166> +title=NEA74 Noumea / Noumea Lambert 2 +proj=lcc +lat_1=-22.24472222222222 +lat_2=-22.29472222222222 +lat_0=-22.26972222222222 +lon_0=166.4425 +x_0=8.313000000000001 +y_0=-2.354 +ellps=intl +units=m +no_defs  <>
+# RGNC91-93 / UTM zone 57S
+<3169> +title=RGNC91-93 / UTM zone 57S +proj=utm +zone=57 +south +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# RGNC91-93 / UTM zone 58S
+<3170> +title=RGNC91-93 / UTM zone 58S +proj=utm +zone=58 +south +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# RGNC91-93 / UTM zone 59S
+<3171> +title=RGNC91-93 / UTM zone 59S +proj=utm +zone=59 +south +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs  <>
+# IGN53 Mare / UTM zone 59S
+<3172> +title=IGN53 Mare / UTM zone 59S +proj=utm +zone=59 +south +ellps=intl +units=m +no_defs  <>
+# RGPF / UTM zone 5S
+<3296> +title=RGPF / UTM zone 5S +proj=utm +zone=5 +south +ellps=GRS80 +units=m +no_defs  <>
+# RGPF / UTM zone 6S
+<3297> +title=RGPF / UTM zone 6S +proj=utm +zone=6 +south +ellps=GRS80 +units=m +no_defs  <>
+# RGPF / UTM zone 7S
+<3298> +title=RGPF / UTM zone 7S +proj=utm +zone=7 +south +ellps=GRS80 +units=m +no_defs  <>
+# RGPF / UTM zone 8S
+<3299> +title=RGPF / UTM zone 8S +proj=utm +zone=8 +south +ellps=GRS80 +units=m +no_defs  <>
+# IGN63 Hiva Oa / UTM zone 7S
+<3302> +title=IGN63 Hiva Oa / UTM zone 7S +proj=utm +zone=7 +south +ellps=intl +units=m +no_defs  <>
+# Fatu Iva 72 / UTM zone 7S
+<3303> +title=Fatu Iva 72 / UTM zone 7S +proj=utm +zone=7 +south +ellps=intl +towgs84=347.103,1078.12,2623.92,-33.8875,70.6773,-9.3943,186.074 +units=m +no_defs  <>
+# Tahiti 79 / UTM zone 6S
+<3304> +title=Tahiti 79 / UTM zone 6S +proj=utm +zone=6 +south +ellps=intl +units=m +no_defs  <>
+# Moorea 87 / UTM zone 6S
+<3305> +title=Moorea 87 / UTM zone 6S +proj=utm +zone=6 +south +ellps=intl +towgs84=215.525,149.593,176.229,-3.2624,-1.692,-1.1571,10.4773 +units=m +no_defs  <>
+# Maupiti 83 / UTM zone 5S
+<3306> +title=Maupiti 83 / UTM zone 5S +proj=utm +zone=5 +south +ellps=intl +towgs84=217.037,86.959,23.956,0,0,0,0 +units=m +no_defs  <>
+# CSG67 / UTM zone 21N
+<3312> +title=CSG67 / UTM zone 21N +proj=utm +zone=21 +ellps=intl +towgs84=-186,230,110,0,0,0,0 +units=m +no_defs  <>
+# RGFG95 / UTM zone 21N
+<3313> +title=RGFG95 / UTM zone 21N +proj=utm +zone=21 +ellps=GRS80 +towgs84=2,2,-2,0,0,0,0 +units=m +no_defs  <>
+# IGN 1962 Kerguelen / UTM zone 42S
+<3336> +title=IGN 1962 Kerguelen / UTM zone 42S +proj=utm +zone=42 +south +ellps=intl +towgs84=145,-187,103,0,0,0,0 +units=m +no_defs  <>
+# WGS 84 / World Mercator
+<3395> +title=WGS 84 / World Mercator +proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
+# Reunion 1947 / TM Reunion
+<3727> +title=Reunion 1947 / TM Reunion +proj=tmerc +lat_0=-21.11666666666667 +lon_0=55.53333333333333 +k=1 +x_0=160000 +y_0=50000 +ellps=intl +units=m +no_defs  <>
+# CH1903 / LV03
+<21781> +title=CH1903 / LV03 +proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 +x_0=600000 +y_0=200000 +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +units=m +no_defs  <>
+# ETRS89 / UTM zone 30N
+<25830> +title=ETRS89 / UTM zone 30N +proj=utm +zone=30 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / UTM zone 31N
+<25831> +title=ETRS89 / UTM zone 31N +proj=utm +zone=31 +ellps=GRS80 +units=m +no_defs  <>
+# ETRS89 / UTM zone 32N
+<25832> +title=ETRS89 / UTM zone 32N +proj=utm +zone=32 +ellps=GRS80 +units=m +no_defs  <>
+# NTF (Paris) / Lambert Nord France
+<27561> +title=NTF (Paris) / Lambert Nord France +proj=lcc +lat_1=49.50000000000001 +lat_0=49.50000000000001 +lon_0=0 +k_0=0.999877341 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert Centre France
+<27562> +title=NTF (Paris) / Lambert Centre France +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert Sud France
+<27563> +title=NTF (Paris) / Lambert Sud France +proj=lcc +lat_1=44.10000000000001 +lat_0=44.10000000000001 +lon_0=0 +k_0=0.9998774990000001 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert Corse
+<27564> +title=NTF (Paris) / Lambert Corse +proj=lcc +lat_1=42.16500000000001 +lat_0=42.16500000000001 +lon_0=0 +k_0=0.9999447100000001 +x_0=234.358 +y_0=185861.369 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert zone I
+<27571> +title=NTF (Paris) / Lambert zone I +proj=lcc +lat_1=49.50000000000001 +lat_0=49.50000000000001 +lon_0=0 +k_0=0.999877341 +x_0=600000 +y_0=1200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert zone II
+<27572> +title=NTF (Paris) / Lambert zone II +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=2200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert zone III
+<27573> +title=NTF (Paris) / Lambert zone III +proj=lcc +lat_1=44.10000000000001 +lat_0=44.10000000000001 +lon_0=0 +k_0=0.9998774990000001 +x_0=600000 +y_0=3200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Lambert zone IV
+<27574> +title=NTF (Paris) / Lambert zone IV +proj=lcc +lat_1=42.16500000000001 +lat_0=42.16500000000001 +lon_0=0 +k_0=0.9999447100000001 +x_0=234.358 +y_0=4185861.369 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / France I (deprecated)
+<27581> +title=NTF (Paris) / France I (deprecated) +proj=lcc +lat_1=49.50000000000001 +lat_0=49.50000000000001 +lon_0=0 +k_0=0.999877341 +x_0=600000 +y_0=1200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / France II (deprecated)
+<27582> +title=NTF (Paris) / France II (deprecated) +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=2200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / France III (deprecated)
+<27583> +title=NTF (Paris) / France III (deprecated) +proj=lcc +lat_1=44.10000000000001 +lat_0=44.10000000000001 +lon_0=0 +k_0=0.9998774990000001 +x_0=600000 +y_0=3200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / France IV (deprecated)
+<27584> +title=NTF (Paris) / France IV (deprecated) +proj=lcc +lat_1=42.16500000000001 +lat_0=42.16500000000001 +lon_0=0 +k_0=0.9999447100000001 +x_0=234.358 +y_0=4185861.369 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Nord France (deprecated)
+<27591> +title=NTF (Paris) / Nord France (deprecated) +proj=lcc +lat_1=49.50000000000001 +lat_0=49.50000000000001 +lon_0=0 +k_0=0.999877341 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Centre France (deprecated)
+<27592> +title=NTF (Paris) / Centre France (deprecated) +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Sud France (deprecated)
+<27593> +title=NTF (Paris) / Sud France (deprecated) +proj=lcc +lat_1=44.10000000000001 +lat_0=44.10000000000001 +lon_0=0 +k_0=0.9998774990000001 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# NTF (Paris) / Corse (deprecated)
+<27594> +title=NTF (Paris) / Corse (deprecated) +proj=lcc +lat_1=42.16500000000001 +lat_0=42.16500000000001 +lon_0=0 +k_0=0.9999447100000001 +x_0=234.358 +y_0=185861.369 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs  <>
+# WGS 84 / Plate Carree
+<32662> +title=WGS 84 / Plate Carree +proj=eqc +lat_ts=0 +lon_0=0 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
+# WGS 84 / UTM zone 1S
+<32701> +title=WGS 84 / UTM zone 1S +proj=utm +zone=1 +south +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
+# WGS 84 / UTM zone 39S
+<32739> +title=WGS 84 / UTM zone 39S +proj=utm +zone=39 +south +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
+# WGS 84 / UTM zone 42S
+<32742> +title=WGS 84 / UTM zone 42S +proj=utm +zone=42 +south +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
+# WGS 84 / UTM zone 43S
+<32743> +title=WGS 84 / UTM zone 43S +proj=utm +zone=43 +south +ellps=WGS84 +datum=WGS84 +units=m +no_defs  <>
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/jsmin.py	(revision 76)
@@ -0,0 +1,216 @@
+#!/usr/bin/python
+
+# This code is original from jsmin by Douglas Crockford, it was translated to
+# Python by Baruch Even. The original code had the following copyright and
+# license.
+#
+# /* jsmin.c
+#    2007-01-08
+#
+# Copyright (c) 2002 Douglas Crockford  (www.crockford.com)
+#
+# Permission is hereby granted, free of charge, to any person obtaining a copy of
+# this software and associated documentation files (the "Software"), to deal in
+# the Software without restriction, including without limitation the rights to
+# use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+# of the Software, and to permit persons to whom the Software is furnished to do
+# so, subject to the following conditions:
+#
+# The above copyright notice and this permission notice shall be included in all
+# copies or substantial portions of the Software.
+#
+# The Software shall be used for Good, not Evil.
+#
+# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+# SOFTWARE.
+# */
+
+from StringIO import StringIO
+
+def jsmin(js):
+    ins = StringIO(js)
+    outs = StringIO()
+    JavascriptMinify().minify(ins, outs)
+    str = outs.getvalue()
+    if len(str) > 0 and str[0] == '\n':
+        str = str[1:]
+    return str
+
+def isAlphanum(c):
+    """return true if the character is a letter, digit, underscore,
+           dollar sign, or non-ASCII character.
+    """
+    return ((c >= 'a' and c <= 'z') or (c >= '0' and c <= '9') or
+            (c >= 'A' and c <= 'Z') or c == '_' or c == '$' or c == '\\' or (c is not None and ord(c) > 126));
+
+class UnterminatedComment(Exception):
+    pass
+
+class UnterminatedStringLiteral(Exception):
+    pass
+
+class UnterminatedRegularExpression(Exception):
+    pass
+
+class JavascriptMinify(object):
+
+    def _outA(self):
+        self.outstream.write(self.theA)
+    def _outB(self):
+        self.outstream.write(self.theB)
+
+    def _get(self):
+        """return the next character from stdin. Watch out for lookahead. If
+           the character is a control character, translate it to a space or
+           linefeed.
+        """
+        c = self.theLookahead
+        self.theLookahead = None
+        if c == None:
+            c = self.instream.read(1)
+        if c >= ' ' or c == '\n':
+            return c
+        if c == '': # EOF
+            return '\000'
+        if c == '\r':
+            return '\n'
+        return ' '
+
+    def _peek(self):
+        self.theLookahead = self._get()
+        return self.theLookahead
+
+    def _next(self):
+        """get the next character, excluding comments. peek() is used to see
+           if a '/' is followed by a '/' or '*'.
+        """
+        c = self._get()
+        if c == '/':
+            p = self._peek()
+            if p == '/':
+                c = self._get()
+                while c > '\n':
+                    c = self._get()
+                return c
+            if p == '*':
+                c = self._get()
+                while 1:
+                    c = self._get()
+                    if c == '*':
+                        if self._peek() == '/':
+                            self._get()
+                            return ' '
+                    if c == '\000':
+                        raise UnterminatedComment()
+
+        return c
+
+    def _action(self, action):
+        """do something! What you do is determined by the argument:
+           1   Output A. Copy B to A. Get the next B.
+           2   Copy B to A. Get the next B. (Delete A).
+           3   Get the next B. (Delete B).
+           action treats a string as a single character. Wow!
+           action recognizes a regular expression if it is preceded by ( or , or =.
+        """
+        if action <= 1:
+            self._outA()
+
+        if action <= 2:
+            self.theA = self.theB
+            if self.theA == "'" or self.theA == '"':
+                while 1:
+                    self._outA()
+                    self.theA = self._get()
+                    if self.theA == self.theB:
+                        break
+                    if self.theA <= '\n':
+                        raise UnterminatedStringLiteral()
+                    if self.theA == '\\':
+                        self._outA()
+                        self.theA = self._get()
+
+
+        if action <= 3:
+            self.theB = self._next()
+            if self.theB == '/' and (self.theA == '(' or self.theA == ',' or
+                                     self.theA == '=' or self.theA == ':' or
+                                     self.theA == '[' or self.theA == '?' or
+                                     self.theA == '!' or self.theA == '&' or
+                                     self.theA == '|'):
+                self._outA()
+                self._outB()
+                while 1:
+                    self.theA = self._get()
+                    if self.theA == '/':
+                        break
+                    elif self.theA == '\\':
+                        self._outA()
+                        self.theA = self._get()
+                    elif self.theA <= '\n':
+                        raise UnterminatedRegularExpression()
+                    self._outA()
+                self.theB = self._next()
+
+
+    def _jsmin(self):
+        """Copy the input to the output, deleting the characters which are
+           insignificant to JavaScript. Comments will be removed. Tabs will be
+           replaced with spaces. Carriage returns will be replaced with linefeeds.
+           Most spaces and linefeeds will be removed.
+        """
+        self.theA = '\n'
+        self._action(3)
+
+        while self.theA != '\000':
+            if self.theA == ' ':
+                if isAlphanum(self.theB):
+                    self._action(1)
+                else:
+                    self._action(2)
+            elif self.theA == '\n':
+                if self.theB in ['{', '[', '(', '+', '-']:
+                    self._action(1)
+                elif self.theB == ' ':
+                    self._action(3)
+                else:
+                    if isAlphanum(self.theB):
+                        self._action(1)
+                    else:
+                        self._action(2)
+            else:
+                if self.theB == ' ':
+                    if isAlphanum(self.theA):
+                        self._action(1)
+                    else:
+                        self._action(3)
+                elif self.theB == '\n':
+                    if self.theA in ['}', ']', ')', '+', '-', '"', '\'']:
+                        self._action(1)
+                    else:
+                        if isAlphanum(self.theA):
+                            self._action(1)
+                        else:
+                            self._action(3)
+                else:
+                    self._action(1)
+
+    def minify(self, instream, outstream):
+        self.instream = instream
+        self.outstream = outstream
+        self.theA = None
+        self.thaB = None
+        self.theLookahead = None
+
+        self._jsmin()
+        self.instream.close()
+
+if __name__ == '__main__':
+    import sys
+    jsm = JavascriptMinify()
+    jsm.minify(sys.stdin, sys.stdout)
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/README.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/README.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/README.txt	(revision 76)
@@ -0,0 +1,7 @@
+This directory contains tools used in the packaging or deployment of proj4js.
+
+Javascript minimizing tools:
+
+ * jsmin.c, jsmin.py:
+   jsmin.py is a direct translation of the jsmin.c code into Python. jsmin.py
+   will therefore run anyplace Python runs... but at significantly slower speed.
Index: /trunk/workshop-routing-foss4g/web/proj4js/tools/pjjs.py
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/tools/pjjs.py	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/tools/pjjs.py	(revision 76)
@@ -0,0 +1,85 @@
+#!/usr/bin/env python
+#
+# TODO explain
+#
+# -- Copyright 2007 IGN France / Geoportail project --
+#
+
+import sys
+import os
+import re
+
+SUFFIX_JAVASCRIPT = ".js"
+
+def _pjcat2js_remove(rezDirectory,catName,targetDirectory):
+    pjCatFilename = os.path.join(rezDirectory, catName)
+    pjCat = open(pjCatFilename,'r')
+    comment_re = re.compile("^#")
+    srsdef_re = re.compile("^<([^>]*)>.* <>$")
+    l = pjCat.readline()
+    while len(l) != 0:
+        if comment_re.search(l) is None:
+            srsdef_mo = srsdef_re.match(l)
+            srsdef_fn = os.path.join(targetDirectory, catName+srsdef_mo.group(1)+".js")
+            if os.path.exists(srsdef_fn):
+                os.remove(srsdef_fn)
+        l = pjCat.readline()
+    pjCat.close()
+
+def _pjcat2js_make(rezDirectory,catName,targetDirectory):
+    pjCatFilename = os.path.join(rezDirectory, catName)
+    pjCat = open(pjCatFilename,'r')
+    comment_re = re.compile("^#")
+    srsdef_re = re.compile("^<([^>]*)> *(.*) <>$")
+    l = pjCat.readline()
+    while len(l) != 0:
+        if comment_re.search(l) is None:
+            srsdef_mo = srsdef_re.match(l)
+            srsdef_fn = os.path.join(targetDirectory, catName+srsdef_mo.group(1)+".js")
+            srsdef = 'Proj4js.defs["'+catName+':'+srsdef_mo.group(1)+'"]="'+srsdef_mo.group(2)+'";'
+            file(srsdef_fn,'w').write(srsdef)
+        l = pjCat.readline()
+    pjCat.close()
+
+def pjcat2js_clean(rezDirectory,targetDirectory):
+    if not os.path.isdir(rezDirectory):
+        return
+    if not os.path.isdir(targetDirectory):
+        return
+    if os.path.abspath(rezDirectory) == '/':
+        return
+    if os.path.abspath(targetDirectory) == '/':
+        return
+    rezDirectory_name_len = len(rezDirectory)
+    for root, dirs, filenames in os.walk(rezDirectory):
+        if 'CVS' in dirs:
+            dirs.remove('CVS')
+        if '.svn' in dirs:
+            dirs.remove('.svn')
+        for filename in filenames:
+            if not filename.endswith(SUFFIX_JAVASCRIPT) and not filename.startswith("."):
+                filepath = os.path.join(root, filename)[rezDirectory_name_len+1:]
+                filepath = filepath.replace("\\", "/")
+                _pjcat2js_remove(rezDirectory,filepath,targetDirectory)
+
+def pjcat2js_run(rezDirectory,targetDirectory):
+    if not os.path.isdir(rezDirectory):
+        return
+    if not os.path.isdir(targetDirectory):
+        return
+    if os.path.abspath(rezDirectory) == '/':
+        return
+    if os.path.abspath(targetDirectory) == '/':
+        return
+    rezDirectory_name_len = len(rezDirectory)
+    for root, dirs, filenames in os.walk(rezDirectory):
+        if 'CVS' in dirs:
+            dirs.remove('CVS')
+        if '.svn' in dirs:
+            dirs.remove('.svn')
+        for filename in filenames:
+            if not filename.endswith(SUFFIX_JAVASCRIPT) and not filename.startswith("."):
+                filepath = os.path.join(root, filename)[rezDirectory_name_len+1:]
+                filepath = filepath.replace("\\", "/")
+                _pjcat2js_make(rezDirectory,filepath,targetDirectory)
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG27563.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG27563.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG27563.js	(revision 76)
@@ -0,0 +1,11 @@
+Proj4js.maps.EPSG27563 = {
+  mapOptions: {
+    projection: 'EPSG:27563',
+    units: 'm', 
+    maxResolution: 2000000/512
+  },
+  layerName: 'metacarta default',
+  layerUrl: 'http://labs.metacarta.com/wms-c/Basic.py',
+  layerParams: {'layers':'basic'},
+  layerOptions: null
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG42304.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG42304.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/demo/maps/EPSG42304.js	(revision 76)
@@ -0,0 +1,12 @@
+Proj4js.maps.EPSG43204 = {
+  mapOptions : {
+    maxExtent: new OpenLayers.Bounds(-3631568.75,-1293815.5,4491139.5833333321,4937122), 
+    scales: [50000000,23207944.16806,10772173.45016,5000000,2320794.41681,1077217.34502,500000,232079.44168,107721.7345,50000],
+    units: 'm', 
+    projection: 'EPSG:42304'
+  },
+  layerName: 'DM Solutions Demo',
+  layerUrl: "http://localhost/cgi-bin/mapserv.exe?MAP=/ms4w/apps/gmap/htdocs/gmap75_wms.map",
+  layerParams: {layers: "bathymetry,land_fn,park,drain_fn,drainage,prov_bound,fedlimit,rail,road,popplace", transparent: "false", format: "image/png" },
+  layerOptions: {singleTile: true}
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/demo/base.css
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/demo/base.css	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/demo/base.css	(revision 76)
@@ -0,0 +1,22 @@
+#footer {
+  margin-top: 20px;
+  border-top: 1px solid #eee;
+  padding: 10px;
+}  
+body {
+ font-family:Verdana;
+}
+#header {
+  background: #9D9FA1;
+  color: #FFFFFF;
+  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
+  font-size: 18px;
+  text-shadow: 2px 2px 3px gray;
+  height: 3em;
+  padding: 4px 16px 0px 16px;
+  vertical-align: top;
+  margin:-10px -5px 0px -5px;
+  border-bottom: 10px solid #e9eef9;
+}
+#header h1{margin-top: 0px;font-weight:normal;}
+#navbar { background-color: #eee; margin: 0px -5px 10px -5px; padding: 10px;  }
Index: /trunk/workshop-routing-foss4g/web/proj4js/demo/ProjPane.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/demo/ProjPane.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/demo/ProjPane.js	(revision 76)
@@ -0,0 +1,91 @@
+var panes = {
+  mapL: {},
+  mapLL: {},
+  mapR: {}
+};
+
+ProjPane = Class.create();
+ProjPane.prototype = {
+  id: null,
+  map: null,
+  proj: null,
+
+  initialize: function(pane, code) {
+    this.id = pane;
+    if (code) this.setProj(code);
+  },
+
+  updateCoords: function(coords) {
+    document.getElementById(this.id+'_coords').innerHTML = coords.toString();
+    var pt = this.map.getLayerPxFromLonLat(coords);
+    this.marker.moveTo(pt);
+  },
+
+  setProj: function(code) {
+    document.getElementById(this.id+'_proj').value = code; 
+
+    this.proj = new Proj4js.Proj(code);
+    var mapDef = Proj4js.maps[this.proj.srsCode];
+
+    if (this.map) this.map.destroy();
+    this.map = new OpenLayers.Map(this.id, mapDef.mapOptions);
+    this.mapLayer = new OpenLayers.Layer.WMS(mapDef.layerName, mapDef.layerUrl, mapDef.layerParams, mapDef.layerOptions);
+    this.map.addLayer(this.mapLayer);
+
+    this.map.addLayer(new OpenLayers.Layer.Markers(''));
+    this.marker = new OpenLayers.Marker(new OpenLayers.LonLat(0,0));
+    this.map.layers[1].addMarker(this.marker);
+    this.marker.map = this.map;
+    if (window.bounds) {
+      this.map.addLayer(new OpenLayers.Layer.Boxes());
+      this.map.layers[2].addMarker(new OpenLayers.Marker.Box(bounds));
+      this.map.setCenter(bounds.getCenterLonLat());
+    } else {    
+      this.map.zoomToMaxExtent();
+    }    
+    this.map.events.register('click', this.map, this.mapClicked.bind(this));
+
+    document.getElementById(this.id+'_units').innerHTML = this.proj.units; 
+    document.getElementById(this.id+'_title').innerHTML = this.proj.title; 
+    document.getElementById(this.id+'_class').innerHTML = this.proj.projName; 
+  },
+
+  mapClicked: function(ev) { 
+    var olc = this.map.getLonLatFromViewPortPx(ev.xy);
+    c = new Proj4js.Point(olc.lon, olc.lat);
+    this.updateCoords(c);
+  
+    if (this.opposite && this.opposite.proj) {
+      var newCoords = this.proj.transform(c, this.opposite.proj);
+      this.opposite.updateCoords(newCoords);
+    }
+    if (this.common) {
+      var newCoords = this.proj.inverse(c);
+      this.common.updateCoords(newCoords);
+    }
+    if (this.projected1 && this.projected1.proj) {
+      var newCoords = this.projected1.proj.forward(c);
+      this.projected1.updateCoords(newCoords);
+    }
+    if (this.projected2 && this.projected2.proj) {
+      var newCoords = this.projected2.proj.forward(c);
+      this.projected2.updateCoords(newCoords);
+    }
+  }
+};
+
+
+function init() {
+  panes['mapLL'] = new ProjPane('mapLL',Proj4js.defaultDatum);
+  panes['mapL'] = new ProjPane('mapL');
+  panes['mapR'] = new ProjPane('mapR');
+
+  panes['mapLL'].projected1 = panes['mapL'];
+  panes['mapLL'].projected2 = panes['mapR'];
+  panes['mapL'].opposite = panes['mapR'];
+  panes['mapR'].opposite = panes['mapL'];
+  panes['mapL'].common = panes['mapLL'];
+  panes['mapR'].common = panes['mapLL'];
+
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/demo/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/demo/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/demo/index.html	(revision 76)
@@ -0,0 +1,20 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <link href="base.css" type="text/css" rel="stylesheet"/>
+  <title>Proj4js Demonstration Page</title>
+  <script src="http://openlayers.org/api/OpenLayers.js"></script>
+  <script src="../lib/proj4js.js"></script>
+  <script src="../lib/maps/EPSG27563.js"></script>
+  <!--script src="../lib/defs/EPSG27563.js"></script-->
+  <script src="ProjPane.js"></script>
+</head>
+
+<body onload="init()">
+  <div id="header">
+    <h1>Proj4js demo page</h1>
+    <p>coming soon!</p>
+  </div>
+
+</body>
+</html>
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26591.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26591.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26591.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:26591"] = "+title= Monte Mario (Rome) / Italy zone 1 EPSG:26591 +proj=tmerc +lat_0=0 +lon_0=-3.45233333333333 +from_greenwich=12.45233333333333 +k=0.999600 +x_0=1500000 +y_0=0 +a=6378388.0, +b=6356911.94612795 +units=m";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27563.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27563.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27563.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:27563"]="+title=NTF (Paris)/Lambert Sud France +proj=lcc +lat_1=44.10000000000001 +lat_0=44.10000000000001 +lon_0=0 +k_0=0.9998774990000001 +x_0=600000 +y_0=200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs ";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4302.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4302.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4302.js	(revision 76)
@@ -0,0 +1,2 @@
+Proj4js.defs["EPSG:4302"] = "+title=Trinidad 1903 EPSG:4302 (7 param datum shift) +proj=longlat +a=6378293.63683822 +b=6356617.979337744 +towgs84=-61.702,284.488,472.052,0,0,0,0";
+  
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4181.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4181.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4181.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:4181"] = "+title=Luxembourg 1930 EPSG:4181 (7 param datum shift) +proj=longlat +towgs84=-193,13.7,-39.3,-0.41,-2.933,2.688,0.43 +a=6378388.0, +b=6356911.94612795";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/GOOGLE.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/GOOGLE.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/GOOGLE.js	(revision 76)
@@ -0,0 +1,2 @@
+Proj4js.defs["GOOGLE"]="+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";
+Proj4js.defs["EPSG:900913"]=Proj4js.defs["GOOGLE"];
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4272.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4272.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4272.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:4272"] = "+title=NZGD49 +proj=longlat +ellps=intl +datum=nzgd49 +no_defs ";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4139.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4139.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG4139.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:4139"] = "+title=Puerto Rico EPSG:4139 (3 param datum shift) +proj=longlat +towgs84 = 11,72,-101,0,0,0,0 +a=6378206.4 +b=6356583.8";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102757.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102757.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102757.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:102757"] = "+title=NAD 1983 StatePlane Wyoming West Central FIPS 4903 Feet +proj=tmerc +lat_0=40.5 +lon_0=-108.75 +x_0=600000.0 +y_0=0 +k=0.999938 +a=6378137.0  +b=6356752.3141403 +to_meter=0.3048006096012192";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG41001.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG41001.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG41001.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:41001"] = "+title=simple mercator EPSG:41001 +proj=merc +lat_ts=0 +lon_0=0 +k=1.000000 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.js	(revision 76)
@@ -0,0 +1,5 @@
+// Google Mercator projection
+// Used in combination with GoogleMercator layer type in OpenLayers
+//+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs
+
+Proj4js.defs["EPSG:900913"]= "+title=GoogleMercator +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102758.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102758.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG102758.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:102758"] = "+title=NAD 1983 StatePlane Wyoming West FIPS 4904 Feet +proj=tmerc +lat_0=40.5  +lon_0=-110.0833333333333 +x_0=800000  +y_0=100000  +k=0.999938 +a=6378137.0 +b=6356752.3141403 +to_meter=0.3048006096012192";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.txt
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.txt	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG900913.txt	(revision 76)
@@ -0,0 +1,11 @@
+// Google Mercator projection
+// Used in combination with GoogleMercator layer type in OpenLayers
+//+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs
+
+csList.EPSG900913= "\
+  +title= Google Mercator EPSG:900913\
+  +proj=merc +a=6378137 +b=6378137 \
+  +lat_ts=0.0 +lon_0=0.0 \
+  +x_0=0.0 +y_0=0 +k=1.0 \
+  +units=m +nadgrids=@null +no_defs \
+";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27200.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27200.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG27200.js	(revision 76)
@@ -0,0 +1,5 @@
+Proj4js.defs["EPSG:27200"] = "+title=New Zealand Map Grid\
+  +proj=nzmg \
+  +lat_0=-41 +lon_0=173 \
+  +x_0=2510000 +y_0=6023150 \
+  +ellps=intl +datum=nzgd49 +units=m +no_defs"
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG42304.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG42304.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG42304.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:42304"]="+title=Atlas of Canada, LCC +proj=lcc +lat_1=49 +lat_2=77 +lat_0=49 +lon_0=-95 +x_0=0 +y_0=0 +ellps=GRS80 +datum=NAD83 +units=m +no_defs";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG21781.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG21781.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG21781.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG:21781"] = "+title=CH1903 / LV03 +proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 +x_0=600000 +y_0=200000 +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +units=m +no_defs";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26912.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26912.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/defs/EPSG26912.js	(revision 76)
@@ -0,0 +1,1 @@
+Proj4js.defs["EPSG26912"] = "+title=NAD83 / UTM zone 12N +proj=utm +zone=12 +a=6378137.0 +b=6356752.3141403";
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-combined.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-combined.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-combined.js	(revision 76)
@@ -0,0 +1,5259 @@
+/*
+  proj4js.js -- Javascript reprojection library. 
+  
+  Authors:      Mike Adair madairATdmsolutions.ca
+                Richard Greenwood richATgreenwoodmap.com
+                Didier Richard didier.richardATign.fr
+                Stephen Irons
+  License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html 
+                Note: This program is an almost direct port of the C library
+                Proj4.
+*/
+/* ======================================================================
+    proj4js.js
+   ====================================================================== */
+
+/*
+Author:       Mike Adair madairATdmsolutions.ca
+              Richard Greenwood rich@greenwoodmap.com
+License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html
+
+$Id: Proj.js 2956 2007-07-09 12:17:52Z steven $
+*/
+
+/**
+ * Namespace: Proj4js
+ *
+ * Proj4js is a JavaScript library to transform point coordinates from one 
+ * coordinate system to another, including datum transformations.
+ *
+ * This library is a port of both the Proj.4 and GCTCP C libraries to JavaScript. 
+ * Enabling these transformations in the browser allows geographic data stored 
+ * in different projections to be combined in browser-based web mapping 
+ * applications.
+ * 
+ * Proj4js must have access to coordinate system initialization strings (which
+ * are the same as for PROJ.4 command line).  Thes can be included in your 
+ * application using a <script> tag or Proj4js can load CS initialization 
+ * strings from a local directory or a web service such as spatialreference.org.
+ *
+ * Similarly, Proj4js must have access to projection transform code.  These can
+ * be included individually using a <script> tag in your page, built into a 
+ * custom build of Proj4js or loaded dynamically at run-time.  Using the
+ * -combined and -compressed versions of Proj4js includes all projection class
+ * code by default.
+ *
+ * Note that dynamic loading of defs and code happens ascynchrously, check the
+ * Proj.readyToUse flag before using the Proj object.  If the defs and code
+ * required by your application are loaded through script tags, dynamic loading
+ * is not required and the Proj object will be readyToUse on return from the 
+ * constructor.
+ * 
+ * All coordinates are handled as points which have a .x and a .y property
+ * which will be modified in place.
+ *
+ * Override Proj4js.reportError for output of alerts and warnings.
+ *
+ * See http://trac.osgeo.org/proj4js/wiki/UserGuide for full details.
+*/
+
+/**
+ * Global namespace object for Proj4js library
+ */
+Proj4js = {
+
+    /**
+     * Property: defaultDatum
+     * The datum to use when no others a specified
+     */
+    defaultDatum: 'WGS84',                  //default datum
+
+    /** 
+    * Method: transform(source, dest, point)
+    * Transform a point coordinate from one map projection to another.  This is
+    * really the only public method you should need to use.
+    *
+    * Parameters:
+    * source - {Proj4js.Proj} source map projection for the transformation
+    * dest - {Proj4js.Proj} destination map projection for the transformation
+    * point - {Object} point to transform, may be geodetic (long, lat) or
+    *     projected Cartesian (x,y), but should always have x,y properties.
+    */
+    transform: function(source, dest, point) {
+        if (!source.readyToUse) {
+            this.reportError("Proj4js initialization for:"+source.srsCode+" not yet complete");
+            return point;
+        }
+        if (!dest.readyToUse) {
+            this.reportError("Proj4js initialization for:"+dest.srsCode+" not yet complete");
+            return point;
+        }
+        
+        // Workaround for Spherical Mercator
+        if ((source.srsProjNumber =="900913" && dest.datumCode != "WGS84" && !dest.datum_params) ||
+            (dest.srsProjNumber == "900913" && source.datumCode != "WGS84" && !source.datum_params)) {
+            var wgs84 = Proj4js.WGS84;
+            this.transform(source, wgs84, point);
+            source = wgs84;
+        }
+
+        // DGR, 2010/11/12
+        if (source.axis!="enu") {
+            this.adjust_axis(source,false,point);
+        }
+
+        // Transform source points to long/lat, if they aren't already.
+        if ( source.projName=="longlat") {
+            point.x *= Proj4js.common.D2R;  // convert degrees to radians
+            point.y *= Proj4js.common.D2R;
+        } else {
+            if (source.to_meter) {
+                point.x *= source.to_meter;
+                point.y *= source.to_meter;
+            }
+            source.inverse(point); // Convert Cartesian to longlat
+        }
+
+        // Adjust for the prime meridian if necessary
+        if (source.from_greenwich) { 
+            point.x += source.from_greenwich; 
+        }
+
+        // Convert datums if needed, and if possible.
+        point = this.datum_transform( source.datum, dest.datum, point );
+
+        // Adjust for the prime meridian if necessary
+        if (dest.from_greenwich) {
+            point.x -= dest.from_greenwich;
+        }
+
+        if( dest.projName=="longlat" ) {             
+            // convert radians to decimal degrees
+            point.x *= Proj4js.common.R2D;
+            point.y *= Proj4js.common.R2D;
+        } else  {               // else project
+            dest.forward(point);
+            if (dest.to_meter) {
+                point.x /= dest.to_meter;
+                point.y /= dest.to_meter;
+            }
+        }
+
+        // DGR, 2010/11/12
+        if (dest.axis!="enu") {
+            this.adjust_axis(dest,true,point);
+        }
+
+        return point;
+    }, // transform()
+
+    /** datum_transform()
+      source coordinate system definition,
+      destination coordinate system definition,
+      point to transform in geodetic coordinates (long, lat, height)
+    */
+    datum_transform : function( source, dest, point ) {
+
+      // Short cut if the datums are identical.
+      if( source.compare_datums( dest ) ) {
+          return point; // in this case, zero is sucess,
+                    // whereas cs_compare_datums returns 1 to indicate TRUE
+                    // confusing, should fix this
+      }
+
+      // Explicitly skip datum transform by setting 'datum=none' as parameter for either source or dest
+      if( source.datum_type == Proj4js.common.PJD_NODATUM
+          || dest.datum_type == Proj4js.common.PJD_NODATUM) {
+          return point;
+      }
+
+      // If this datum requires grid shifts, then apply it to geodetic coordinates.
+      if( source.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        /*
+          pj_apply_gridshift( pj_param(source.params,"snadgrids").s, 0,
+                              point_count, point_offset, x, y, z );
+          CHECK_RETURN;
+
+          src_a = SRS_WGS84_SEMIMAJOR;
+          src_es = 0.006694379990;
+        */
+      }
+
+      if( dest.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        /*
+          dst_a = ;
+          dst_es = 0.006694379990;
+        */
+      }
+
+      // Do we need to go through geocentric coordinates?
+      if( source.es != dest.es || source.a != dest.a
+          || source.datum_type == Proj4js.common.PJD_3PARAM
+          || source.datum_type == Proj4js.common.PJD_7PARAM
+          || dest.datum_type == Proj4js.common.PJD_3PARAM
+          || dest.datum_type == Proj4js.common.PJD_7PARAM)
+      {
+
+        // Convert to geocentric coordinates.
+        source.geodetic_to_geocentric( point );
+        // CHECK_RETURN;
+
+        // Convert between datums
+        if( source.datum_type == Proj4js.common.PJD_3PARAM || source.datum_type == Proj4js.common.PJD_7PARAM ) {
+          source.geocentric_to_wgs84(point);
+          // CHECK_RETURN;
+        }
+
+        if( dest.datum_type == Proj4js.common.PJD_3PARAM || dest.datum_type == Proj4js.common.PJD_7PARAM ) {
+          dest.geocentric_from_wgs84(point);
+          // CHECK_RETURN;
+        }
+
+        // Convert back to geodetic coordinates
+        dest.geocentric_to_geodetic( point );
+          // CHECK_RETURN;
+      }
+
+      // Apply grid shift to destination if required
+      if( dest.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        // pj_apply_gridshift( pj_param(dest.params,"snadgrids").s, 1, point);
+        // CHECK_RETURN;
+      }
+      return point;
+    }, // cs_datum_transform
+
+    /**
+     * Function: adjust_axis
+     * Normalize or de-normalized the x/y/z axes.  The normal form is "enu"
+     * (easting, northing, up).
+     * Parameters:
+     * crs {Proj4js.Proj} the coordinate reference system
+     * denorm {Boolean} when false, normalize
+     * point {Object} the coordinates to adjust
+     */
+    adjust_axis: function(crs, denorm, point) {
+        var xin= point.x, yin= point.y, zin= point.z || 0.0;
+        var v, t;
+        for (var i= 0; i<3; i++) {
+            if (denorm && i==2 && point.z===undefined) { continue; }
+                 if (i==0) { v= xin; t= 'x'; }
+            else if (i==1) { v= yin; t= 'y'; }
+            else           { v= zin; t= 'z'; }
+            switch(crs.axis[i]) {
+            case 'e':
+                point[t]= v;
+                break;
+            case 'w':
+                point[t]= -v;
+                break;
+            case 'n':
+                point[t]= v;
+                break;
+            case 's':
+                point[t]= -v;
+                break;
+            case 'u':
+                if (point[t]!==undefined) { point.z= v; }
+                break;
+            case 'd':
+                if (point[t]!==undefined) { point.z= -v; }
+                break;
+            default :
+                alert("ERROR: unknow axis ("+crs.axis[i]+") - check definition of "+src.projName);
+                return null;
+            }
+        }
+        return point;
+    },
+
+    /**
+     * Function: reportError
+     * An internal method to report errors back to user. 
+     * Override this in applications to report error messages or throw exceptions.
+     */
+    reportError: function(msg) {
+      //console.log(msg);
+    },
+
+/**
+ *
+ * Title: Private Methods
+ * The following properties and methods are intended for internal use only.
+ *
+ * This is a minimal implementation of JavaScript inheritance methods so that 
+ * Proj4js can be used as a stand-alone library.
+ * These are copies of the equivalent OpenLayers methods at v2.7
+ */
+ 
+/**
+ * Function: extend
+ * Copy all properties of a source object to a destination object.  Modifies
+ *     the passed in destination object.  Any properties on the source object
+ *     that are set to undefined will not be (re)set on the destination object.
+ *
+ * Parameters:
+ * destination - {Object} The object that will be modified
+ * source - {Object} The object with properties to be set on the destination
+ *
+ * Returns:
+ * {Object} The destination object.
+ */
+    extend: function(destination, source) {
+      destination = destination || {};
+      if(source) {
+          for(var property in source) {
+              var value = source[property];
+              if(value !== undefined) {
+                  destination[property] = value;
+              }
+          }
+      }
+      return destination;
+    },
+
+/**
+ * Constructor: Class
+ * Base class used to construct all other classes. Includes support for 
+ *     multiple inheritance. 
+ *  
+ */
+    Class: function() {
+      var Class = function() {
+          this.initialize.apply(this, arguments);
+      };
+  
+      var extended = {};
+      var parent;
+      for(var i=0; i<arguments.length; ++i) {
+          if(typeof arguments[i] == "function") {
+              // get the prototype of the superclass
+              parent = arguments[i].prototype;
+          } else {
+              // in this case we're extending with the prototype
+              parent = arguments[i];
+          }
+          Proj4js.extend(extended, parent);
+      }
+      Class.prototype = extended;
+      
+      return Class;
+    },
+
+    /**
+     * Function: bind
+     * Bind a function to an object.  Method to easily create closures with
+     *     'this' altered.
+     * 
+     * Parameters:
+     * func - {Function} Input function.
+     * object - {Object} The object to bind to the input function (as this).
+     * 
+     * Returns:
+     * {Function} A closure with 'this' set to the passed in object.
+     */
+    bind: function(func, object) {
+        // create a reference to all arguments past the second one
+        var args = Array.prototype.slice.apply(arguments, [2]);
+        return function() {
+            // Push on any additional arguments from the actual function call.
+            // These will come after those sent to the bind call.
+            var newArgs = args.concat(
+                Array.prototype.slice.apply(arguments, [0])
+            );
+            return func.apply(object, newArgs);
+        };
+    },
+    
+/**
+ * The following properties and methods handle dynamic loading of JSON objects.
+ */
+ 
+    /**
+     * Property: scriptName
+     * {String} The filename of this script without any path.
+     */
+    scriptName: "proj4js-combined.js",
+
+    /**
+     * Property: defsLookupService
+     * AJAX service to retreive projection definition parameters from
+     */
+    defsLookupService: 'http://spatialreference.org/ref',
+
+    /**
+     * Property: libPath
+     * internal: http server path to library code.
+     */
+    libPath: null,
+
+    /**
+     * Function: getScriptLocation
+     * Return the path to this script.
+     *
+     * Returns:
+     * Path to this script
+     */
+    getScriptLocation: function () {
+        if (this.libPath) return this.libPath;
+        var scriptName = this.scriptName;
+        var scriptNameLen = scriptName.length;
+
+        var scripts = document.getElementsByTagName('script');
+        for (var i = 0; i < scripts.length; i++) {
+            var src = scripts[i].getAttribute('src');
+            if (src) {
+                var index = src.lastIndexOf(scriptName);
+                // is it found, at the end of the URL?
+                if ((index > -1) && (index + scriptNameLen == src.length)) {
+                    this.libPath = src.slice(0, -scriptNameLen);
+                    break;
+                }
+            }
+        }
+        return this.libPath||"";
+    },
+
+    /**
+     * Function: loadScript
+     * Load a JS file from a URL into a <script> tag in the page.
+     * 
+     * Parameters:
+     * url - {String} The URL containing the script to load
+     * onload - {Function} A method to be executed when the script loads successfully
+     * onfail - {Function} A method to be executed when there is an error loading the script
+     * loadCheck - {Function} A boolean method that checks to see if the script 
+     *            has loaded.  Typically this just checks for the existance of
+     *            an object in the file just loaded.
+     */
+    loadScript: function(url, onload, onfail, loadCheck) {
+      var script = document.createElement('script');
+      script.defer = false;
+      script.type = "text/javascript";
+      script.id = url;
+      script.src = url;
+      script.onload = onload;
+      script.onerror = onfail;
+      script.loadCheck = loadCheck;
+      if (/MSIE/.test(navigator.userAgent)) {
+        script.onreadystatechange = this.checkReadyState;
+      }
+      document.getElementsByTagName('head')[0].appendChild(script);
+    },
+    
+    /**
+     * Function: checkReadyState
+     * IE workaround since there is no onerror handler.  Calls the user defined 
+     * loadCheck method to determine if the script is loaded.
+     * 
+     */
+    checkReadyState: function() {
+      if (this.readyState == 'loaded') {
+        if (!this.loadCheck()) {
+          this.onerror();
+        } else {
+          this.onload();
+        }
+      }
+    }
+};
+
+/**
+ * Class: Proj4js.Proj
+ *
+ * Proj objects provide transformation methods for point coordinates
+ * between geodetic latitude/longitude and a projected coordinate system. 
+ * once they have been initialized with a projection code.
+ *
+ * Initialization of Proj objects is with a projection code, usually EPSG codes,
+ * which is the key that will be used with the Proj4js.defs array.
+ * 
+ * The code passed in will be stripped of colons and converted to uppercase
+ * to locate projection definition files.
+ *
+ * A projection object has properties for units and title strings.
+ */
+Proj4js.Proj = Proj4js.Class({
+
+  /**
+   * Property: readyToUse
+   * Flag to indicate if initialization is complete for this Proj object
+   */
+  readyToUse: false,   
+  
+  /**
+   * Property: title
+   * The title to describe the projection
+   */
+  title: null,  
+  
+  /**
+   * Property: projName
+   * The projection class for this projection, e.g. lcc (lambert conformal conic,
+   * or merc for mercator).  These are exactly equivalent to their Proj4 
+   * counterparts.
+   */
+  projName: null,
+  /**
+   * Property: units
+   * The units of the projection.  Values include 'm' and 'degrees'
+   */
+  units: null,
+  /**
+   * Property: datum
+   * The datum specified for the projection
+   */
+  datum: null,
+  /**
+   * Property: x0
+   * The x coordinate origin
+   */
+  x0: 0,
+  /**
+   * Property: y0
+   * The y coordinate origin
+   */
+  y0: 0,
+  /**
+   * Property: localCS
+   * Flag to indicate if the projection is a local one in which no transforms
+   * are required.
+   */
+  localCS: false,
+
+  /**
+  * Property: queue
+  * Buffer (FIFO) to hold callbacks waiting to be called when projection loaded.
+  */
+  queue: null,
+
+  /**
+  * Constructor: initialize
+  * Constructor for Proj4js.Proj objects
+  *
+  * Parameters:
+  * srsCode - a code for map projection definition parameters.  These are usually
+  * (but not always) EPSG codes.
+  */
+  initialize: function(srsCode, callback) {
+      this.srsCodeInput = srsCode;
+      
+      //Register callbacks prior to attempting to process definition
+      this.queue = [];
+      if( callback ){
+           this.queue.push( callback );
+      }
+      
+      //check to see if this is a WKT string
+      if ((srsCode.indexOf('GEOGCS') >= 0) ||
+          (srsCode.indexOf('GEOCCS') >= 0) ||
+          (srsCode.indexOf('PROJCS') >= 0) ||
+          (srsCode.indexOf('LOCAL_CS') >= 0)) {
+            this.parseWKT(srsCode);
+            this.deriveConstants();
+            this.loadProjCode(this.projName);
+            return;
+      }
+      
+      // DGR 2008-08-03 : support urn and url
+      if (srsCode.indexOf('urn:') == 0) {
+          //urn:ORIGINATOR:def:crs:CODESPACE:VERSION:ID
+          var urn = srsCode.split(':');
+          if ((urn[1] == 'ogc' || urn[1] =='x-ogc') &&
+              (urn[2] =='def') &&
+              (urn[3] =='crs')) {
+              srsCode = urn[4]+':'+urn[urn.length-1];
+          }
+      } else if (srsCode.indexOf('http://') == 0) {
+          //url#ID
+          var url = srsCode.split('#');
+          if (url[0].match(/epsg.org/)) {
+            // http://www.epsg.org/#
+            srsCode = 'EPSG:'+url[1];
+          } else if (url[0].match(/RIG.xml/)) {
+            //http://librairies.ign.fr/geoportail/resources/RIG.xml#
+            //http://interop.ign.fr/registers/ign/RIG.xml#
+            srsCode = 'IGNF:'+url[1];
+          }
+      }
+      this.srsCode = srsCode.toUpperCase();
+      if (this.srsCode.indexOf("EPSG") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'epsg';
+          this.srsProjNumber = this.srsCode.substring(5);
+      // DGR 2007-11-20 : authority IGNF
+      } else if (this.srsCode.indexOf("IGNF") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'IGNF';
+          this.srsProjNumber = this.srsCode.substring(5);
+      // DGR 2008-06-19 : pseudo-authority CRS for WMS
+      } else if (this.srsCode.indexOf("CRS") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'CRS';
+          this.srsProjNumber = this.srsCode.substring(4);
+      } else {
+          this.srsAuth = '';
+          this.srsProjNumber = this.srsCode;
+      }
+      
+      this.loadProjDefinition();
+  },
+  
+/**
+ * Function: loadProjDefinition
+ *    Loads the coordinate system initialization string if required.
+ *    Note that dynamic loading happens asynchronously so an application must 
+ *    wait for the readyToUse property is set to true.
+ *    To prevent dynamic loading, include the defs through a script tag in
+ *    your application.
+ *
+ */
+    loadProjDefinition: function() {
+      //check in memory
+      if (Proj4js.defs[this.srsCode]) {
+        this.defsLoaded();
+        return;
+      }
+
+      //else check for def on the server
+      var url = Proj4js.getScriptLocation() + 'defs/' + this.srsAuth.toUpperCase() + this.srsProjNumber + '.js';
+      Proj4js.loadScript(url, 
+                Proj4js.bind(this.defsLoaded, this),
+                Proj4js.bind(this.loadFromService, this),
+                Proj4js.bind(this.checkDefsLoaded, this) );
+    },
+
+/**
+ * Function: loadFromService
+ *    Creates the REST URL for loading the definition from a web service and 
+ *    loads it.
+ *
+ */
+    loadFromService: function() {
+      //else load from web service
+      var url = Proj4js.defsLookupService +'/' + this.srsAuth +'/'+ this.srsProjNumber + '/proj4js/';
+      Proj4js.loadScript(url, 
+            Proj4js.bind(this.defsLoaded, this),
+            Proj4js.bind(this.defsFailed, this),
+            Proj4js.bind(this.checkDefsLoaded, this) );
+    },
+
+/**
+ * Function: defsLoaded
+ * Continues the Proj object initilization once the def file is loaded
+ *
+ */
+    defsLoaded: function() {
+      this.parseDefs();
+      this.loadProjCode(this.projName);
+    },
+    
+/**
+ * Function: checkDefsLoaded
+ *    This is the loadCheck method to see if the def object exists
+ *
+ */
+    checkDefsLoaded: function() {
+      if (Proj4js.defs[this.srsCode]) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+
+ /**
+ * Function: defsFailed
+ *    Report an error in loading the defs file, but continue on using WGS84
+ *
+ */
+   defsFailed: function() {
+      Proj4js.reportError('failed to load projection definition for: '+this.srsCode);
+      Proj4js.defs[this.srsCode] = Proj4js.defs['WGS84'];  //set it to something so it can at least continue
+      this.defsLoaded();
+    },
+
+/**
+ * Function: loadProjCode
+ *    Loads projection class code dynamically if required.
+ *     Projection code may be included either through a script tag or in
+ *     a built version of proj4js
+ *
+ */
+    loadProjCode: function(projName) {
+      if (Proj4js.Proj[projName]) {
+        this.initTransforms();
+        return;
+      }
+
+      //the URL for the projection code
+      var url = Proj4js.getScriptLocation() + 'projCode/' + projName + '.js';
+      Proj4js.loadScript(url, 
+              Proj4js.bind(this.loadProjCodeSuccess, this, projName),
+              Proj4js.bind(this.loadProjCodeFailure, this, projName), 
+              Proj4js.bind(this.checkCodeLoaded, this, projName) );
+    },
+
+ /**
+ * Function: loadProjCodeSuccess
+ *    Loads any proj dependencies or continue on to final initialization.
+ *
+ */
+    loadProjCodeSuccess: function(projName) {
+      if (Proj4js.Proj[projName].dependsOn){
+        this.loadProjCode(Proj4js.Proj[projName].dependsOn);
+      } else {
+        this.initTransforms();
+      }
+    },
+
+ /**
+ * Function: defsFailed
+ *    Report an error in loading the proj file.  Initialization of the Proj
+ *    object has failed and the readyToUse flag will never be set.
+ *
+ */
+    loadProjCodeFailure: function(projName) {
+      Proj4js.reportError("failed to find projection file for: " + projName);
+      //TBD initialize with identity transforms so proj will still work?
+    },
+    
+/**
+ * Function: checkCodeLoaded
+ *    This is the loadCheck method to see if the projection code is loaded
+ *
+ */
+    checkCodeLoaded: function(projName) {
+      if (Proj4js.Proj[projName]) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+
+/**
+ * Function: initTransforms
+ *    Finalize the initialization of the Proj object
+ *
+ */
+    initTransforms: function() {
+      Proj4js.extend(this, Proj4js.Proj[this.projName]);
+      this.init();
+      this.readyToUse = true;
+      if( this.queue ) {
+        var item;
+        while( (item = this.queue.shift()) ) {
+          item.call( this, this );
+        }
+      }
+  },
+
+/**
+ * Function: parseWKT
+ * Parses a WKT string to get initialization parameters
+ *
+ */
+ wktRE: /^(\w+)\[(.*)\]$/,
+ parseWKT: function(wkt) {
+    var wktMatch = wkt.match(this.wktRE);
+    if (!wktMatch) return;
+    var wktObject = wktMatch[1];
+    var wktContent = wktMatch[2];
+    var wktTemp = wktContent.split(",");
+    var wktName;
+    if (wktObject.toUpperCase() == "TOWGS84") {
+      wktName = wktObject;  //no name supplied for the TOWGS84 array
+    } else {
+      wktName = wktTemp.shift();
+    }
+    wktName = wktName.replace(/^\"/,"");
+    wktName = wktName.replace(/\"$/,"");
+    
+    /*
+    wktContent = wktTemp.join(",");
+    var wktArray = wktContent.split("],");
+    for (var i=0; i<wktArray.length-1; ++i) {
+      wktArray[i] += "]";
+    }
+    */
+    
+    var wktArray = new Array();
+    var bkCount = 0;
+    var obj = "";
+    for (var i=0; i<wktTemp.length; ++i) {
+      var token = wktTemp[i];
+      for (var j=0; j<token.length; ++j) {
+        if (token.charAt(j) == "[") ++bkCount;
+        if (token.charAt(j) == "]") --bkCount;
+      }
+      obj += token;
+      if (bkCount === 0) {
+        wktArray.push(obj);
+        obj = "";
+      } else {
+        obj += ",";
+      }
+    }
+    
+    //do something based on the type of the wktObject being parsed
+    //add in variations in the spelling as required
+    switch (wktObject) {
+      case 'LOCAL_CS':
+        this.projName = 'identity'
+        this.localCS = true;
+        this.srsCode = wktName;
+        break;
+      case 'GEOGCS':
+        this.projName = 'longlat'
+        this.geocsCode = wktName;
+        if (!this.srsCode) this.srsCode = wktName;
+        break;
+      case 'PROJCS':
+        this.srsCode = wktName;
+        break;
+      case 'GEOCCS':
+        break;
+      case 'PROJECTION':
+        this.projName = Proj4js.wktProjections[wktName]
+        break;
+      case 'DATUM':
+        this.datumName = wktName;
+        break;
+      case 'LOCAL_DATUM':
+        this.datumCode = 'none';
+        break;
+      case 'SPHEROID':
+        this.ellps = wktName;
+        this.a = parseFloat(wktArray.shift());
+        this.rf = parseFloat(wktArray.shift());
+        break;
+      case 'PRIMEM':
+        this.from_greenwich = parseFloat(wktArray.shift()); //to radians?
+        break;
+      case 'UNIT':
+        this.units = wktName;
+        this.unitsPerMeter = parseFloat(wktArray.shift());
+        break;
+      case 'PARAMETER':
+        var name = wktName.toLowerCase();
+        var value = parseFloat(wktArray.shift());
+        //there may be many variations on the wktName values, add in case
+        //statements as required
+        switch (name) {
+          case 'false_easting':
+            this.x0 = value;
+            break;
+          case 'false_northing':
+            this.y0 = value;
+            break;
+          case 'scale_factor':
+            this.k0 = value;
+            break;
+          case 'central_meridian':
+            this.long0 = value*Proj4js.common.D2R;
+            break;
+          case 'latitude_of_origin':
+            this.lat0 = value*Proj4js.common.D2R;
+            break;
+          case 'more_here':
+            break;
+          default:
+            break;
+        }
+        break;
+      case 'TOWGS84':
+        this.datum_params = wktArray;
+        break;
+      //DGR 2010-11-12: AXIS
+      case 'AXIS':
+        var name= wktName.toLowerCase();
+        var value= wktArray.shift();
+        switch (value) {
+          case 'EAST' : value= 'e'; break;
+          case 'WEST' : value= 'w'; break;
+          case 'NORTH': value= 'n'; break;
+          case 'SOUTH': value= 's'; break;
+          case 'UP'   : value= 'u'; break;
+          case 'DOWN' : value= 'd'; break;
+          case 'OTHER':
+          default     : value= ' '; break;//FIXME
+        }
+        if (!this.axis) { this.axis= "enu"; }
+        switch(name) {
+          case 'X': this.axis=                         value + this.axis.substr(1,2); break;
+          case 'Y': this.axis= this.axis.substr(0,1) + value + this.axis.substr(2,1); break;
+          case 'Z': this.axis= this.axis.substr(0,2) + value                        ; break;
+          default : break;
+        }
+      case 'MORE_HERE':
+        break;
+      default:
+        break;
+    }
+    for (var i=0; i<wktArray.length; ++i) {
+      this.parseWKT(wktArray[i]);
+    }
+ },
+
+/**
+ * Function: parseDefs
+ * Parses the PROJ.4 initialization string and sets the associated properties.
+ *
+ */
+  parseDefs: function() {
+      this.defData = Proj4js.defs[this.srsCode];
+      var paramName, paramVal;
+      if (!this.defData) {
+        return;
+      }
+      var paramArray=this.defData.split("+");
+
+      for (var prop=0; prop<paramArray.length; prop++) {
+          var property = paramArray[prop].split("=");
+          paramName = property[0].toLowerCase();
+          paramVal = property[1];
+
+          switch (paramName.replace(/\s/gi,"")) {  // trim out spaces
+              case "": break;   // throw away nameless parameter
+              case "title":  this.title = paramVal; break;
+              case "proj":   this.projName =  paramVal.replace(/\s/gi,""); break;
+              case "units":  this.units = paramVal.replace(/\s/gi,""); break;
+              case "datum":  this.datumCode = paramVal.replace(/\s/gi,""); break;
+              case "nadgrids": this.nagrids = paramVal.replace(/\s/gi,""); break;
+              case "ellps":  this.ellps = paramVal.replace(/\s/gi,""); break;
+              case "a":      this.a =  parseFloat(paramVal); break;  // semi-major radius
+              case "b":      this.b =  parseFloat(paramVal); break;  // semi-minor radius
+              // DGR 2007-11-20
+              case "rf":     this.rf = parseFloat(paramVal); break; // inverse flattening rf= a/(a-b)
+              case "lat_0":  this.lat0 = paramVal*Proj4js.common.D2R; break;        // phi0, central latitude
+              case "lat_1":  this.lat1 = paramVal*Proj4js.common.D2R; break;        //standard parallel 1
+              case "lat_2":  this.lat2 = paramVal*Proj4js.common.D2R; break;        //standard parallel 2
+              case "lat_ts": this.lat_ts = paramVal*Proj4js.common.D2R; break;      // used in merc and eqc
+              case "lon_0":  this.long0 = paramVal*Proj4js.common.D2R; break;       // lam0, central longitude
+              case "alpha":  this.alpha =  parseFloat(paramVal)*Proj4js.common.D2R; break;  //for somerc projection
+              case "lonc":   this.longc = paramVal*Proj4js.common.D2R; break;       //for somerc projection
+              case "x_0":    this.x0 = parseFloat(paramVal); break;  // false easting
+              case "y_0":    this.y0 = parseFloat(paramVal); break;  // false northing
+              case "k_0":    this.k0 = parseFloat(paramVal); break;  // projection scale factor
+              case "k":      this.k0 = parseFloat(paramVal); break;  // both forms returned
+              case "r_a":    this.R_A = true; break;                 // sphere--area of ellipsoid
+              case "zone":   this.zone = parseInt(paramVal); break;  // UTM Zone
+              case "south":   this.utmSouth = true; break;  // UTM north/south
+              case "towgs84":this.datum_params = paramVal.split(","); break;
+              case "to_meter": this.to_meter = parseFloat(paramVal); break; // cartesian scaling
+              case "from_greenwich": this.from_greenwich = paramVal*Proj4js.common.D2R; break;
+              // DGR 2008-07-09 : if pm is not a well-known prime meridian take
+              // the value instead of 0.0, then convert to radians
+              case "pm":     paramVal = paramVal.replace(/\s/gi,"");
+                             this.from_greenwich = Proj4js.PrimeMeridian[paramVal] ?
+                                Proj4js.PrimeMeridian[paramVal] : parseFloat(paramVal);
+                             this.from_greenwich *= Proj4js.common.D2R; 
+                             break;
+              // DGR 2010-11-12: axis
+              case "axis":   paramVal = paramVal.replace(/\s/gi,"");
+                             var legalAxis= "ewnsud";
+                             if (paramVal.length==3 &&
+                                 legalAxis.indexOf(paramVal.substr(0,1))!=-1 &&
+                                 legalAxis.indexOf(paramVal.substr(1,1))!=-1 &&
+                                 legalAxis.indexOf(paramVal.substr(2,1))!=-1) {
+                                this.axis= paramVal;
+                             } //FIXME: be silent ?
+                             break
+              case "no_defs": break; 
+              default: //alert("Unrecognized parameter: " + paramName);
+          } // switch()
+      } // for paramArray
+      this.deriveConstants();
+  },
+
+/**
+ * Function: deriveConstants
+ * Sets several derived constant values and initialization of datum and ellipse
+ *     parameters.
+ *
+ */
+  deriveConstants: function() {
+      if (this.nagrids == '@null') this.datumCode = 'none';
+      if (this.datumCode && this.datumCode != 'none') {
+        var datumDef = Proj4js.Datum[this.datumCode];
+        if (datumDef) {
+          this.datum_params = datumDef.towgs84 ? datumDef.towgs84.split(',') : null;
+          this.ellps = datumDef.ellipse;
+          this.datumName = datumDef.datumName ? datumDef.datumName : this.datumCode;
+        }
+      }
+      if (!this.a) {    // do we have an ellipsoid?
+          var ellipse = Proj4js.Ellipsoid[this.ellps] ? Proj4js.Ellipsoid[this.ellps] : Proj4js.Ellipsoid['WGS84'];
+          Proj4js.extend(this, ellipse);
+      }
+      if (this.rf && !this.b) this.b = (1.0 - 1.0/this.rf) * this.a;
+      if (Math.abs(this.a - this.b)<Proj4js.common.EPSLN) {
+        this.sphere = true;
+        this.b= this.a;
+      }
+      this.a2 = this.a * this.a;          // used in geocentric
+      this.b2 = this.b * this.b;          // used in geocentric
+      this.es = (this.a2-this.b2)/this.a2;  // e ^ 2
+      this.e = Math.sqrt(this.es);        // eccentricity
+      if (this.R_A) {
+        this.a *= 1. - this.es * (Proj4js.common.SIXTH + this.es * (Proj4js.common.RA4 + this.es * Proj4js.common.RA6));
+        this.a2 = this.a * this.a;
+        this.b2 = this.b * this.b;
+        this.es = 0.;
+      }
+      this.ep2=(this.a2-this.b2)/this.b2; // used in geocentric
+      if (!this.k0) this.k0 = 1.0;    //default value
+      //DGR 2010-11-12: axis
+      if (!this.axis) { this.axis= "enu"; }
+
+      this.datum = new Proj4js.datum(this);
+  }
+});
+
+Proj4js.Proj.longlat = {
+  init: function() {
+    //no-op for longlat
+  },
+  forward: function(pt) {
+    //identity transform
+    return pt;
+  },
+  inverse: function(pt) {
+    //identity transform
+    return pt;
+  }
+};
+Proj4js.Proj.identity = Proj4js.Proj.longlat;
+
+/**
+  Proj4js.defs is a collection of coordinate system definition objects in the 
+  PROJ.4 command line format.
+  Generally a def is added by means of a separate .js file for example:
+
+    <SCRIPT type="text/javascript" src="defs/EPSG26912.js"></SCRIPT>
+
+  def is a CS definition in PROJ.4 WKT format, for example:
+    +proj="tmerc"   //longlat, etc.
+    +a=majorRadius
+    +b=minorRadius
+    +lat0=somenumber
+    +long=somenumber
+*/
+Proj4js.defs = {
+  // These are so widely used, we'll go ahead and throw them in
+  // without requiring a separate .js file
+  'WGS84': "+title=long/lat:WGS84 +proj=longlat +ellps=WGS84 +datum=WGS84 +units=degrees",
+  'EPSG:4326': "+title=long/lat:WGS84 +proj=longlat +a=6378137.0 +b=6356752.31424518 +ellps=WGS84 +datum=WGS84 +units=degrees",
+  'EPSG:4269': "+title=long/lat:NAD83 +proj=longlat +a=6378137.0 +b=6356752.31414036 +ellps=GRS80 +datum=NAD83 +units=degrees",
+  'EPSG:3785': "+title= Google Mercator +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs"
+};
+Proj4js.defs['GOOGLE'] = Proj4js.defs['EPSG:3785'];
+Proj4js.defs['EPSG:900913'] = Proj4js.defs['EPSG:3785'];
+Proj4js.defs['EPSG:102113'] = Proj4js.defs['EPSG:3785'];
+
+Proj4js.common = {
+  PI : 3.141592653589793238, //Math.PI,
+  HALF_PI : 1.570796326794896619, //Math.PI*0.5,
+  TWO_PI : 6.283185307179586477, //Math.PI*2,
+  FORTPI : 0.78539816339744833,
+  R2D : 57.29577951308232088,
+  D2R : 0.01745329251994329577,
+  SEC_TO_RAD : 4.84813681109535993589914102357e-6, /* SEC_TO_RAD = Pi/180/3600 */
+  EPSLN : 1.0e-10,
+  MAX_ITER : 20,
+  // following constants from geocent.c
+  COS_67P5 : 0.38268343236508977,  /* cosine of 67.5 degrees */
+  AD_C : 1.0026000,                /* Toms region 1 constant */
+
+  /* datum_type values */
+  PJD_UNKNOWN  : 0,
+  PJD_3PARAM   : 1,
+  PJD_7PARAM   : 2,
+  PJD_GRIDSHIFT: 3,
+  PJD_WGS84    : 4,   // WGS84 or equivalent
+  PJD_NODATUM  : 5,   // WGS84 or equivalent
+  SRS_WGS84_SEMIMAJOR : 6378137.0,  // only used in grid shift transforms
+
+  // ellipoid pj_set_ell.c
+  SIXTH : .1666666666666666667, /* 1/6 */
+  RA4   : .04722222222222222222, /* 17/360 */
+  RA6   : .02215608465608465608, /* 67/3024 */
+  RV4   : .06944444444444444444, /* 5/72 */
+  RV6   : .04243827160493827160, /* 55/1296 */
+
+// Function to compute the constant small m which is the radius of
+//   a parallel of latitude, phi, divided by the semimajor axis.
+// -----------------------------------------------------------------
+  msfnz : function(eccent, sinphi, cosphi) {
+      var con = eccent * sinphi;
+      return cosphi/(Math.sqrt(1.0 - con * con));
+  },
+
+// Function to compute the constant small t for use in the forward
+//   computations in the Lambert Conformal Conic and the Polar
+//   Stereographic projections.
+// -----------------------------------------------------------------
+  tsfnz : function(eccent, phi, sinphi) {
+    var con = eccent * sinphi;
+    var com = .5 * eccent;
+    con = Math.pow(((1.0 - con) / (1.0 + con)), com);
+    return (Math.tan(.5 * (this.HALF_PI - phi))/con);
+  },
+
+// Function to compute the latitude angle, phi2, for the inverse of the
+//   Lambert Conformal Conic and Polar Stereographic projections.
+// ----------------------------------------------------------------
+  phi2z : function(eccent, ts) {
+    var eccnth = .5 * eccent;
+    var con, dphi;
+    var phi = this.HALF_PI - 2 * Math.atan(ts);
+    for (var i = 0; i <= 15; i++) {
+      con = eccent * Math.sin(phi);
+      dphi = this.HALF_PI - 2 * Math.atan(ts *(Math.pow(((1.0 - con)/(1.0 + con)),eccnth))) - phi;
+      phi += dphi;
+      if (Math.abs(dphi) <= .0000000001) return phi;
+    }
+    alert("phi2z has NoConvergence");
+    return (-9999);
+  },
+
+/* Function to compute constant small q which is the radius of a 
+   parallel of latitude, phi, divided by the semimajor axis. 
+------------------------------------------------------------*/
+  qsfnz : function(eccent,sinphi) {
+    var con;
+    if (eccent > 1.0e-7) {
+      con = eccent * sinphi;
+      return (( 1.0- eccent * eccent) * (sinphi /(1.0 - con * con) - (.5/eccent)*Math.log((1.0 - con)/(1.0 + con))));
+    } else {
+      return(2.0 * sinphi);
+    }
+  },
+
+/* Function to eliminate roundoff errors in asin
+----------------------------------------------*/
+  asinz : function(x) {
+    if (Math.abs(x)>1.0) {
+      x=(x>1.0)?1.0:-1.0;
+    }
+    return Math.asin(x);
+  },
+
+// following functions from gctpc cproj.c for transverse mercator projections
+  e0fn : function(x) {return(1.0-0.25*x*(1.0+x/16.0*(3.0+1.25*x)));},
+  e1fn : function(x) {return(0.375*x*(1.0+0.25*x*(1.0+0.46875*x)));},
+  e2fn : function(x) {return(0.05859375*x*x*(1.0+0.75*x));},
+  e3fn : function(x) {return(x*x*x*(35.0/3072.0));},
+  mlfn : function(e0,e1,e2,e3,phi) {return(e0*phi-e1*Math.sin(2.0*phi)+e2*Math.sin(4.0*phi)-e3*Math.sin(6.0*phi));},
+
+  srat : function(esinp, exp) {
+    return(Math.pow((1.0-esinp)/(1.0+esinp), exp));
+  },
+
+// Function to return the sign of an argument
+  sign : function(x) { if (x < 0.0) return(-1); else return(1);},
+
+// Function to adjust longitude to -180 to 180; input in radians
+  adjust_lon : function(x) {
+    x = (Math.abs(x) < this.PI) ? x: (x - (this.sign(x)*this.TWO_PI) );
+    return x;
+  },
+
+// IGNF - DGR : algorithms used by IGN France
+
+// Function to adjust latitude to -90 to 90; input in radians
+  adjust_lat : function(x) {
+    x= (Math.abs(x) < this.HALF_PI) ? x: (x - (this.sign(x)*this.PI) );
+    return x;
+  },
+
+// Latitude Isometrique - close to tsfnz ...
+  latiso : function(eccent, phi, sinphi) {
+    if (Math.abs(phi) > this.HALF_PI) return +Number.NaN;
+    if (phi==this.HALF_PI) return Number.POSITIVE_INFINITY;
+    if (phi==-1.0*this.HALF_PI) return -1.0*Number.POSITIVE_INFINITY;
+
+    var con= eccent*sinphi;
+    return Math.log(Math.tan((this.HALF_PI+phi)/2.0))+eccent*Math.log((1.0-con)/(1.0+con))/2.0;
+  },
+
+  fL : function(x,L) {
+    return 2.0*Math.atan(x*Math.exp(L)) - this.HALF_PI;
+  },
+
+// Inverse Latitude Isometrique - close to ph2z
+  invlatiso : function(eccent, ts) {
+    var phi= this.fL(1.0,ts);
+    var Iphi= 0.0;
+    var con= 0.0;
+    do {
+      Iphi= phi;
+      con= eccent*Math.sin(Iphi);
+      phi= this.fL(Math.exp(eccent*Math.log((1.0+con)/(1.0-con))/2.0),ts)
+    } while (Math.abs(phi-Iphi)>1.0e-12);
+    return phi;
+  },
+
+// Needed for Gauss Schreiber
+// Original:  Denis Makarov (info@binarythings.com)
+// Web Site:  http://www.binarythings.com
+  sinh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r-1.0/r)/2.0;
+    return r;
+  },
+
+  cosh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r+1.0/r)/2.0;
+    return r;
+  },
+
+  tanh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r-1.0/r)/(r+1.0/r);
+    return r;
+  },
+
+  asinh : function(x)
+  {
+    var s= (x>= 0? 1.0:-1.0);
+    return s*(Math.log( Math.abs(x) + Math.sqrt(x*x+1.0) ));
+  },
+
+  acosh : function(x)
+  {
+    return 2.0*Math.log(Math.sqrt((x+1.0)/2.0) + Math.sqrt((x-1.0)/2.0));
+  },
+
+  atanh : function(x)
+  {
+    return Math.log((x-1.0)/(x+1.0))/2.0;
+  },
+
+// Grande Normale
+  gN : function(a,e,sinphi)
+  {
+    var temp= e*sinphi;
+    return a/Math.sqrt(1.0 - temp*temp);
+  }
+
+};
+
+/** datum object
+*/
+Proj4js.datum = Proj4js.Class({
+
+  initialize : function(proj) {
+    this.datum_type = Proj4js.common.PJD_WGS84;   //default setting
+    if (proj.datumCode && proj.datumCode == 'none') {
+      this.datum_type = Proj4js.common.PJD_NODATUM;
+    }
+    if (proj && proj.datum_params) {
+      for (var i=0; i<proj.datum_params.length; i++) {
+        proj.datum_params[i]=parseFloat(proj.datum_params[i]);
+      }
+      if (proj.datum_params[0] != 0 || proj.datum_params[1] != 0 || proj.datum_params[2] != 0 ) {
+        this.datum_type = Proj4js.common.PJD_3PARAM;
+      }
+      if (proj.datum_params.length > 3) {
+        if (proj.datum_params[3] != 0 || proj.datum_params[4] != 0 ||
+            proj.datum_params[5] != 0 || proj.datum_params[6] != 0 ) {
+          this.datum_type = Proj4js.common.PJD_7PARAM;
+          proj.datum_params[3] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[4] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[5] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[6] = (proj.datum_params[6]/1000000.0) + 1.0;
+        }
+      }
+    }
+    if (proj) {
+      this.a = proj.a;    //datum object also uses these values
+      this.b = proj.b;
+      this.es = proj.es;
+      this.ep2 = proj.ep2;
+      this.datum_params = proj.datum_params;
+    }
+  },
+
+  /****************************************************************/
+  // cs_compare_datums()
+  //   Returns 1 (TRUE) if the two datums match, otherwise 0 (FALSE).
+  compare_datums : function( dest ) {
+    if( this.datum_type != dest.datum_type ) {
+      return false; // false, datums are not equal
+    } else if( this.a != dest.a || Math.abs(this.es-dest.es) > 0.000000000050 ) {
+      // the tolerence for es is to ensure that GRS80 and WGS84
+      // are considered identical
+      return false;
+    } else if( this.datum_type == Proj4js.common.PJD_3PARAM ) {
+      return (this.datum_params[0] == dest.datum_params[0]
+              && this.datum_params[1] == dest.datum_params[1]
+              && this.datum_params[2] == dest.datum_params[2]);
+    } else if( this.datum_type == Proj4js.common.PJD_7PARAM ) {
+      return (this.datum_params[0] == dest.datum_params[0]
+              && this.datum_params[1] == dest.datum_params[1]
+              && this.datum_params[2] == dest.datum_params[2]
+              && this.datum_params[3] == dest.datum_params[3]
+              && this.datum_params[4] == dest.datum_params[4]
+              && this.datum_params[5] == dest.datum_params[5]
+              && this.datum_params[6] == dest.datum_params[6]);
+    } else if( this.datum_type == Proj4js.common.PJD_GRIDSHIFT ) {
+      return strcmp( pj_param(this.params,"snadgrids").s,
+                     pj_param(dest.params,"snadgrids").s ) == 0;
+    } else {
+      return true; // datums are equal
+    }
+  }, // cs_compare_datums()
+
+  /*
+   * The function Convert_Geodetic_To_Geocentric converts geodetic coordinates
+   * (latitude, longitude, and height) to geocentric coordinates (X, Y, Z),
+   * according to the current ellipsoid parameters.
+   *
+   *    Latitude  : Geodetic latitude in radians                     (input)
+   *    Longitude : Geodetic longitude in radians                    (input)
+   *    Height    : Geodetic height, in meters                       (input)
+   *    X         : Calculated Geocentric X coordinate, in meters    (output)
+   *    Y         : Calculated Geocentric Y coordinate, in meters    (output)
+   *    Z         : Calculated Geocentric Z coordinate, in meters    (output)
+   *
+   */
+  geodetic_to_geocentric : function(p) {
+    var Longitude = p.x;
+    var Latitude = p.y;
+    var Height = p.z ? p.z : 0;   //Z value not always supplied
+    var X;  // output
+    var Y;
+    var Z;
+
+    var Error_Code=0;  //  GEOCENT_NO_ERROR;
+    var Rn;            /*  Earth radius at location  */
+    var Sin_Lat;       /*  Math.sin(Latitude)  */
+    var Sin2_Lat;      /*  Square of Math.sin(Latitude)  */
+    var Cos_Lat;       /*  Math.cos(Latitude)  */
+
+    /*
+    ** Don't blow up if Latitude is just a little out of the value
+    ** range as it may just be a rounding issue.  Also removed longitude
+    ** test, it should be wrapped by Math.cos() and Math.sin().  NFW for PROJ.4, Sep/2001.
+    */
+    if( Latitude < -Proj4js.common.HALF_PI && Latitude > -1.001 * Proj4js.common.HALF_PI ) {
+        Latitude = -Proj4js.common.HALF_PI;
+    } else if( Latitude > Proj4js.common.HALF_PI && Latitude < 1.001 * Proj4js.common.HALF_PI ) {
+        Latitude = Proj4js.common.HALF_PI;
+    } else if ((Latitude < -Proj4js.common.HALF_PI) || (Latitude > Proj4js.common.HALF_PI)) {
+      /* Latitude out of range */
+      Proj4js.reportError('geocent:lat out of range:'+Latitude);
+      return null;
+    }
+
+    if (Longitude > Proj4js.common.PI) Longitude -= (2*Proj4js.common.PI);
+    Sin_Lat = Math.sin(Latitude);
+    Cos_Lat = Math.cos(Latitude);
+    Sin2_Lat = Sin_Lat * Sin_Lat;
+    Rn = this.a / (Math.sqrt(1.0e0 - this.es * Sin2_Lat));
+    X = (Rn + Height) * Cos_Lat * Math.cos(Longitude);
+    Y = (Rn + Height) * Cos_Lat * Math.sin(Longitude);
+    Z = ((Rn * (1 - this.es)) + Height) * Sin_Lat;
+
+    p.x = X;
+    p.y = Y;
+    p.z = Z;
+    return Error_Code;
+  }, // cs_geodetic_to_geocentric()
+
+
+  geocentric_to_geodetic : function (p) {
+/* local defintions and variables */
+/* end-criterium of loop, accuracy of sin(Latitude) */
+var genau = 1.E-12;
+var genau2 = (genau*genau);
+var maxiter = 30;
+
+    var P;        /* distance between semi-minor axis and location */
+    var RR;       /* distance between center and location */
+    var CT;       /* sin of geocentric latitude */
+    var ST;       /* cos of geocentric latitude */
+    var RX;
+    var RK;
+    var RN;       /* Earth radius at location */
+    var CPHI0;    /* cos of start or old geodetic latitude in iterations */
+    var SPHI0;    /* sin of start or old geodetic latitude in iterations */
+    var CPHI;     /* cos of searched geodetic latitude */
+    var SPHI;     /* sin of searched geodetic latitude */
+    var SDPHI;    /* end-criterium: addition-theorem of sin(Latitude(iter)-Latitude(iter-1)) */
+    var At_Pole;     /* indicates location is in polar region */
+    var iter;        /* # of continous iteration, max. 30 is always enough (s.a.) */
+
+    var X = p.x;
+    var Y = p.y;
+    var Z = p.z ? p.z : 0.0;   //Z value not always supplied
+    var Longitude;
+    var Latitude;
+    var Height;
+
+    At_Pole = false;
+    P = Math.sqrt(X*X+Y*Y);
+    RR = Math.sqrt(X*X+Y*Y+Z*Z);
+
+/*      special cases for latitude and longitude */
+    if (P/this.a < genau) {
+
+/*  special case, if P=0. (X=0., Y=0.) */
+        At_Pole = true;
+        Longitude = 0.0;
+
+/*  if (X,Y,Z)=(0.,0.,0.) then Height becomes semi-minor axis
+ *  of ellipsoid (=center of mass), Latitude becomes PI/2 */
+        if (RR/this.a < genau) {
+            Latitude = Proj4js.common.HALF_PI;
+            Height   = -this.b;
+            return;
+        }
+    } else {
+/*  ellipsoidal (geodetic) longitude
+ *  interval: -PI < Longitude <= +PI */
+        Longitude=Math.atan2(Y,X);
+    }
+
+/* --------------------------------------------------------------
+ * Following iterative algorithm was developped by
+ * "Institut fï¿œr Erdmessung", University of Hannover, July 1988.
+ * Internet: www.ife.uni-hannover.de
+ * Iterative computation of CPHI,SPHI and Height.
+ * Iteration of CPHI and SPHI to 10**-12 radian resp.
+ * 2*10**-7 arcsec.
+ * --------------------------------------------------------------
+ */
+    CT = Z/RR;
+    ST = P/RR;
+    RX = 1.0/Math.sqrt(1.0-this.es*(2.0-this.es)*ST*ST);
+    CPHI0 = ST*(1.0-this.es)*RX;
+    SPHI0 = CT*RX;
+    iter = 0;
+
+/* loop to find sin(Latitude) resp. Latitude
+ * until |sin(Latitude(iter)-Latitude(iter-1))| < genau */
+    do
+    {
+        iter++;
+        RN = this.a/Math.sqrt(1.0-this.es*SPHI0*SPHI0);
+
+/*  ellipsoidal (geodetic) height */
+        Height = P*CPHI0+Z*SPHI0-RN*(1.0-this.es*SPHI0*SPHI0);
+
+        RK = this.es*RN/(RN+Height);
+        RX = 1.0/Math.sqrt(1.0-RK*(2.0-RK)*ST*ST);
+        CPHI = ST*(1.0-RK)*RX;
+        SPHI = CT*RX;
+        SDPHI = SPHI*CPHI0-CPHI*SPHI0;
+        CPHI0 = CPHI;
+        SPHI0 = SPHI;
+    }
+    while (SDPHI*SDPHI > genau2 && iter < maxiter);
+
+/*      ellipsoidal (geodetic) latitude */
+    Latitude=Math.atan(SPHI/Math.abs(CPHI));
+
+    p.x = Longitude;
+    p.y = Latitude;
+    p.z = Height;
+    return p;
+  }, // cs_geocentric_to_geodetic()
+
+  /** Convert_Geocentric_To_Geodetic
+   * The method used here is derived from 'An Improved Algorithm for
+   * Geocentric to Geodetic Coordinate Conversion', by Ralph Toms, Feb 1996
+   */
+  geocentric_to_geodetic_noniter : function (p) {
+    var X = p.x;
+    var Y = p.y;
+    var Z = p.z ? p.z : 0;   //Z value not always supplied
+    var Longitude;
+    var Latitude;
+    var Height;
+
+    var W;        /* distance from Z axis */
+    var W2;       /* square of distance from Z axis */
+    var T0;       /* initial estimate of vertical component */
+    var T1;       /* corrected estimate of vertical component */
+    var S0;       /* initial estimate of horizontal component */
+    var S1;       /* corrected estimate of horizontal component */
+    var Sin_B0;   /* Math.sin(B0), B0 is estimate of Bowring aux variable */
+    var Sin3_B0;  /* cube of Math.sin(B0) */
+    var Cos_B0;   /* Math.cos(B0) */
+    var Sin_p1;   /* Math.sin(phi1), phi1 is estimated latitude */
+    var Cos_p1;   /* Math.cos(phi1) */
+    var Rn;       /* Earth radius at location */
+    var Sum;      /* numerator of Math.cos(phi1) */
+    var At_Pole;  /* indicates location is in polar region */
+
+    X = parseFloat(X);  // cast from string to float
+    Y = parseFloat(Y);
+    Z = parseFloat(Z);
+
+    At_Pole = false;
+    if (X != 0.0)
+    {
+        Longitude = Math.atan2(Y,X);
+    }
+    else
+    {
+        if (Y > 0)
+        {
+            Longitude = Proj4js.common.HALF_PI;
+        }
+        else if (Y < 0)
+        {
+            Longitude = -Proj4js.common.HALF_PI;
+        }
+        else
+        {
+            At_Pole = true;
+            Longitude = 0.0;
+            if (Z > 0.0)
+            {  /* north pole */
+                Latitude = Proj4js.common.HALF_PI;
+            }
+            else if (Z < 0.0)
+            {  /* south pole */
+                Latitude = -Proj4js.common.HALF_PI;
+            }
+            else
+            {  /* center of earth */
+                Latitude = Proj4js.common.HALF_PI;
+                Height = -this.b;
+                return;
+            }
+        }
+    }
+    W2 = X*X + Y*Y;
+    W = Math.sqrt(W2);
+    T0 = Z * Proj4js.common.AD_C;
+    S0 = Math.sqrt(T0 * T0 + W2);
+    Sin_B0 = T0 / S0;
+    Cos_B0 = W / S0;
+    Sin3_B0 = Sin_B0 * Sin_B0 * Sin_B0;
+    T1 = Z + this.b * this.ep2 * Sin3_B0;
+    Sum = W - this.a * this.es * Cos_B0 * Cos_B0 * Cos_B0;
+    S1 = Math.sqrt(T1*T1 + Sum * Sum);
+    Sin_p1 = T1 / S1;
+    Cos_p1 = Sum / S1;
+    Rn = this.a / Math.sqrt(1.0 - this.es * Sin_p1 * Sin_p1);
+    if (Cos_p1 >= Proj4js.common.COS_67P5)
+    {
+        Height = W / Cos_p1 - Rn;
+    }
+    else if (Cos_p1 <= -Proj4js.common.COS_67P5)
+    {
+        Height = W / -Cos_p1 - Rn;
+    }
+    else
+    {
+        Height = Z / Sin_p1 + Rn * (this.es - 1.0);
+    }
+    if (At_Pole == false)
+    {
+        Latitude = Math.atan(Sin_p1 / Cos_p1);
+    }
+
+    p.x = Longitude;
+    p.y = Latitude;
+    p.z = Height;
+    return p;
+  }, // geocentric_to_geodetic_noniter()
+
+  /****************************************************************/
+  // pj_geocentic_to_wgs84( p )
+  //  p = point to transform in geocentric coordinates (x,y,z)
+  geocentric_to_wgs84 : function ( p ) {
+
+    if( this.datum_type == Proj4js.common.PJD_3PARAM )
+    {
+      // if( x[io] == HUGE_VAL )
+      //    continue;
+      p.x += this.datum_params[0];
+      p.y += this.datum_params[1];
+      p.z += this.datum_params[2];
+
+    }
+    else if (this.datum_type == Proj4js.common.PJD_7PARAM)
+    {
+      var Dx_BF =this.datum_params[0];
+      var Dy_BF =this.datum_params[1];
+      var Dz_BF =this.datum_params[2];
+      var Rx_BF =this.datum_params[3];
+      var Ry_BF =this.datum_params[4];
+      var Rz_BF =this.datum_params[5];
+      var M_BF  =this.datum_params[6];
+      // if( x[io] == HUGE_VAL )
+      //    continue;
+      var x_out = M_BF*(       p.x - Rz_BF*p.y + Ry_BF*p.z) + Dx_BF;
+      var y_out = M_BF*( Rz_BF*p.x +       p.y - Rx_BF*p.z) + Dy_BF;
+      var z_out = M_BF*(-Ry_BF*p.x + Rx_BF*p.y +       p.z) + Dz_BF;
+      p.x = x_out;
+      p.y = y_out;
+      p.z = z_out;
+    }
+  }, // cs_geocentric_to_wgs84
+
+  /****************************************************************/
+  // pj_geocentic_from_wgs84()
+  //  coordinate system definition,
+  //  point to transform in geocentric coordinates (x,y,z)
+  geocentric_from_wgs84 : function( p ) {
+
+    if( this.datum_type == Proj4js.common.PJD_3PARAM )
+    {
+      //if( x[io] == HUGE_VAL )
+      //    continue;
+      p.x -= this.datum_params[0];
+      p.y -= this.datum_params[1];
+      p.z -= this.datum_params[2];
+
+    }
+    else if (this.datum_type == Proj4js.common.PJD_7PARAM)
+    {
+      var Dx_BF =this.datum_params[0];
+      var Dy_BF =this.datum_params[1];
+      var Dz_BF =this.datum_params[2];
+      var Rx_BF =this.datum_params[3];
+      var Ry_BF =this.datum_params[4];
+      var Rz_BF =this.datum_params[5];
+      var M_BF  =this.datum_params[6];
+      var x_tmp = (p.x - Dx_BF) / M_BF;
+      var y_tmp = (p.y - Dy_BF) / M_BF;
+      var z_tmp = (p.z - Dz_BF) / M_BF;
+      //if( x[io] == HUGE_VAL )
+      //    continue;
+
+      p.x =        x_tmp + Rz_BF*y_tmp - Ry_BF*z_tmp;
+      p.y = -Rz_BF*x_tmp +       y_tmp + Rx_BF*z_tmp;
+      p.z =  Ry_BF*x_tmp - Rx_BF*y_tmp +       z_tmp;
+    } //cs_geocentric_from_wgs84()
+  }
+});
+
+/** point object, nothing fancy, just allows values to be
+    passed back and forth by reference rather than by value.
+    Other point classes may be used as long as they have
+    x and y properties, which will get modified in the transform method.
+*/
+Proj4js.Point = Proj4js.Class({
+
+    /**
+     * Constructor: Proj4js.Point
+     *
+     * Parameters:
+     * - x {float} or {Array} either the first coordinates component or
+     *     the full coordinates
+     * - y {float} the second component
+     * - z {float} the third component, optional.
+     */
+    initialize : function(x,y,z) {
+      if (typeof x == 'object') {
+        this.x = x[0];
+        this.y = x[1];
+        this.z = x[2] || 0.0;
+      } else if (typeof x == 'string' && typeof y == 'undefined') {
+        var coords = x.split(',');
+        this.x = parseFloat(coords[0]);
+        this.y = parseFloat(coords[1]);
+        this.z = parseFloat(coords[2]) || 0.0;
+      } else {
+        this.x = x;
+        this.y = y;
+        this.z = z || 0.0;
+      }
+    },
+
+    /**
+     * APIMethod: clone
+     * Build a copy of a Proj4js.Point object.
+     *
+     * Return:
+     * {Proj4js}.Point the cloned point.
+     */
+    clone : function() {
+      return new Proj4js.Point(this.x, this.y, this.z);
+    },
+
+    /**
+     * APIMethod: toString
+     * Return a readable string version of the point
+     *
+     * Return:
+     * {String} String representation of Proj4js.Point object. 
+     *           (ex. <i>"x=5,y=42"</i>)
+     */
+    toString : function() {
+        return ("x=" + this.x + ",y=" + this.y);
+    },
+
+    /** 
+     * APIMethod: toShortString
+     * Return a short string version of the point.
+     *
+     * Return:
+     * {String} Shortened String representation of Proj4js.Point object. 
+     *         (ex. <i>"5, 42"</i>)
+     */
+    toShortString : function() {
+        return (this.x + ", " + this.y);
+    }
+});
+
+Proj4js.PrimeMeridian = {
+    "greenwich": 0.0,               //"0dE",
+    "lisbon":     -9.131906111111,   //"9d07'54.862\"W",
+    "paris":       2.337229166667,   //"2d20'14.025\"E",
+    "bogota":    -74.080916666667,  //"74d04'51.3\"W",
+    "madrid":     -3.687938888889,  //"3d41'16.58\"W",
+    "rome":       12.452333333333,  //"12d27'8.4\"E",
+    "bern":        7.439583333333,  //"7d26'22.5\"E",
+    "jakarta":   106.807719444444,  //"106d48'27.79\"E",
+    "ferro":     -17.666666666667,  //"17d40'W",
+    "brussels":    4.367975,        //"4d22'4.71\"E",
+    "stockholm":  18.058277777778,  //"18d3'29.8\"E",
+    "athens":     23.7163375,       //"23d42'58.815\"E",
+    "oslo":       10.722916666667   //"10d43'22.5\"E"
+};
+
+Proj4js.Ellipsoid = {
+  "MERIT": {a:6378137.0, rf:298.257, ellipseName:"MERIT 1983"},
+  "SGS85": {a:6378136.0, rf:298.257, ellipseName:"Soviet Geodetic System 85"},
+  "GRS80": {a:6378137.0, rf:298.257222101, ellipseName:"GRS 1980(IUGG, 1980)"},
+  "IAU76": {a:6378140.0, rf:298.257, ellipseName:"IAU 1976"},
+  "airy": {a:6377563.396, b:6356256.910, ellipseName:"Airy 1830"},
+  "APL4.": {a:6378137, rf:298.25, ellipseName:"Appl. Physics. 1965"},
+  "NWL9D": {a:6378145.0, rf:298.25, ellipseName:"Naval Weapons Lab., 1965"},
+  "mod_airy": {a:6377340.189, b:6356034.446, ellipseName:"Modified Airy"},
+  "andrae": {a:6377104.43, rf:300.0, ellipseName:"Andrae 1876 (Den., Iclnd.)"},
+  "aust_SA": {a:6378160.0, rf:298.25, ellipseName:"Australian Natl & S. Amer. 1969"},
+  "GRS67": {a:6378160.0, rf:298.2471674270, ellipseName:"GRS 67(IUGG 1967)"},
+  "bessel": {a:6377397.155, rf:299.1528128, ellipseName:"Bessel 1841"},
+  "bess_nam": {a:6377483.865, rf:299.1528128, ellipseName:"Bessel 1841 (Namibia)"},
+  "clrk66": {a:6378206.4, b:6356583.8, ellipseName:"Clarke 1866"},
+  "clrk80": {a:6378249.145, rf:293.4663, ellipseName:"Clarke 1880 mod."},
+  "CPM": {a:6375738.7, rf:334.29, ellipseName:"Comm. des Poids et Mesures 1799"},
+  "delmbr": {a:6376428.0, rf:311.5, ellipseName:"Delambre 1810 (Belgium)"},
+  "engelis": {a:6378136.05, rf:298.2566, ellipseName:"Engelis 1985"},
+  "evrst30": {a:6377276.345, rf:300.8017, ellipseName:"Everest 1830"},
+  "evrst48": {a:6377304.063, rf:300.8017, ellipseName:"Everest 1948"},
+  "evrst56": {a:6377301.243, rf:300.8017, ellipseName:"Everest 1956"},
+  "evrst69": {a:6377295.664, rf:300.8017, ellipseName:"Everest 1969"},
+  "evrstSS": {a:6377298.556, rf:300.8017, ellipseName:"Everest (Sabah & Sarawak)"},
+  "fschr60": {a:6378166.0, rf:298.3, ellipseName:"Fischer (Mercury Datum) 1960"},
+  "fschr60m": {a:6378155.0, rf:298.3, ellipseName:"Fischer 1960"},
+  "fschr68": {a:6378150.0, rf:298.3, ellipseName:"Fischer 1968"},
+  "helmert": {a:6378200.0, rf:298.3, ellipseName:"Helmert 1906"},
+  "hough": {a:6378270.0, rf:297.0, ellipseName:"Hough"},
+  "intl": {a:6378388.0, rf:297.0, ellipseName:"International 1909 (Hayford)"},
+  "kaula": {a:6378163.0, rf:298.24, ellipseName:"Kaula 1961"},
+  "lerch": {a:6378139.0, rf:298.257, ellipseName:"Lerch 1979"},
+  "mprts": {a:6397300.0, rf:191.0, ellipseName:"Maupertius 1738"},
+  "new_intl": {a:6378157.5, b:6356772.2, ellipseName:"New International 1967"},
+  "plessis": {a:6376523.0, rf:6355863.0, ellipseName:"Plessis 1817 (France)"},
+  "krass": {a:6378245.0, rf:298.3, ellipseName:"Krassovsky, 1942"},
+  "SEasia": {a:6378155.0, b:6356773.3205, ellipseName:"Southeast Asia"},
+  "walbeck": {a:6376896.0, b:6355834.8467, ellipseName:"Walbeck"},
+  "WGS60": {a:6378165.0, rf:298.3, ellipseName:"WGS 60"},
+  "WGS66": {a:6378145.0, rf:298.25, ellipseName:"WGS 66"},
+  "WGS72": {a:6378135.0, rf:298.26, ellipseName:"WGS 72"},
+  "WGS84": {a:6378137.0, rf:298.257223563, ellipseName:"WGS 84"},
+  "sphere": {a:6370997.0, b:6370997.0, ellipseName:"Normal Sphere (r=6370997)"}
+};
+
+Proj4js.Datum = {
+  "WGS84": {towgs84: "0,0,0", ellipse: "WGS84", datumName: "WGS84"},
+  "GGRS87": {towgs84: "-199.87,74.79,246.62", ellipse: "GRS80", datumName: "Greek_Geodetic_Reference_System_1987"},
+  "NAD83": {towgs84: "0,0,0", ellipse: "GRS80", datumName: "North_American_Datum_1983"},
+  "NAD27": {nadgrids: "@conus,@alaska,@ntv2_0.gsb,@ntv1_can.dat", ellipse: "clrk66", datumName: "North_American_Datum_1927"},
+  "potsdam": {towgs84: "606.0,23.0,413.0", ellipse: "bessel", datumName: "Potsdam Rauenberg 1950 DHDN"},
+  "carthage": {towgs84: "-263.0,6.0,431.0", ellipse: "clark80", datumName: "Carthage 1934 Tunisia"},
+  "hermannskogel": {towgs84: "653.0,-212.0,449.0", ellipse: "bessel", datumName: "Hermannskogel"},
+  "ire65": {towgs84: "482.530,-130.596,564.557,-1.042,-0.214,-0.631,8.15", ellipse: "mod_airy", datumName: "Ireland 1965"},
+  "nzgd49": {towgs84: "59.47,-5.04,187.44,0.47,-0.1,1.024,-4.5993", ellipse: "intl", datumName: "New Zealand Geodetic Datum 1949"},
+  "OSGB36": {towgs84: "446.448,-125.157,542.060,0.1502,0.2470,0.8421,-20.4894", ellipse: "airy", datumName: "Airy 1830"}
+};
+
+Proj4js.WGS84 = new Proj4js.Proj('WGS84');
+Proj4js.Datum['OSB36'] = Proj4js.Datum['OSGB36']; //as returned from spatialreference.org
+
+//lookup table to go from the projection name in WKT to the Proj4js projection name
+//build this out as required
+Proj4js.wktProjections = {
+  "Lambert Tangential Conformal Conic Projection": "lcc",
+  "Mercator": "merc",
+  "Popular Visualisation Pseudo Mercator": "merc",
+  "Transverse_Mercator": "tmerc",
+  "Transverse Mercator": "tmerc",
+  "Lambert Azimuthal Equal Area": "laea",
+  "Universal Transverse Mercator System": "utm"
+};
+
+
+/* ======================================================================
+    projCode/aea.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                     ALBERS CONICAL EQUAL AREA 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and Northing
+		for the Albers Conical Equal Area projection.  The longitude
+		and latitude must be in radians.  The Easting and Northing
+		values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan,       	Feb, 1992
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+Proj4js.Proj.aea = {
+  init : function() {
+
+    if (Math.abs(this.lat1 + this.lat2) < Proj4js.common.EPSLN) {
+       Proj4js.reportError("aeaInitEqualLatitudes");
+       return;
+    }
+    this.temp = this.b / this.a;
+    this.es = 1.0 - Math.pow(this.temp,2);
+    this.e3 = Math.sqrt(this.es);
+
+    this.sin_po=Math.sin(this.lat1);
+    this.cos_po=Math.cos(this.lat1);
+    this.t1=this.sin_po;
+    this.con = this.sin_po;
+    this.ms1 = Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);
+    this.qs1 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    this.sin_po=Math.sin(this.lat2);
+    this.cos_po=Math.cos(this.lat2);
+    this.t2=this.sin_po;
+    this.ms2 = Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);
+    this.qs2 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    this.sin_po=Math.sin(this.lat0);
+    this.cos_po=Math.cos(this.lat0);
+    this.t3=this.sin_po;
+    this.qs0 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    if (Math.abs(this.lat1 - this.lat2) > Proj4js.common.EPSLN) {
+      this.ns0 = (this.ms1 * this.ms1 - this.ms2 *this.ms2)/ (this.qs2 - this.qs1);
+    } else {
+      this.ns0 = this.con;
+    }
+    this.c = this.ms1 * this.ms1 + this.ns0 * this.qs1;
+    this.rh = this.a * Math.sqrt(this.c - this.ns0 * this.qs0)/this.ns0;
+  },
+
+/* Albers Conical Equal Area forward equations--mapping lat,long to x,y
+  -------------------------------------------------------------------*/
+  forward: function(p){
+
+    var lon=p.x;
+    var lat=p.y;
+
+    this.sin_phi=Math.sin(lat);
+    this.cos_phi=Math.cos(lat);
+
+    var qs = Proj4js.common.qsfnz(this.e3,this.sin_phi,this.cos_phi);
+    var rh1 =this.a * Math.sqrt(this.c - this.ns0 * qs)/this.ns0;
+    var theta = this.ns0 * Proj4js.common.adjust_lon(lon - this.long0); 
+    var x = rh1 * Math.sin(theta) + this.x0;
+    var y = this.rh - rh1 * Math.cos(theta) + this.y0;
+
+    p.x = x; 
+    p.y = y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh1,qs,con,theta,lon,lat;
+
+    p.x -= this.x0;
+    p.y = this.rh - p.y + this.y0;
+    if (this.ns0 >= 0) {
+      rh1 = Math.sqrt(p.x *p.x + p.y * p.y);
+      con = 1.0;
+    } else {
+      rh1 = -Math.sqrt(p.x * p.x + p.y *p.y);
+      con = -1.0;
+    }
+    theta = 0.0;
+    if (rh1 != 0.0) {
+      theta = Math.atan2(con * p.x, con * p.y);
+    }
+    con = rh1 * this.ns0 / this.a;
+    qs = (this.c - con * con) / this.ns0;
+    if (this.e3 >= 1e-10) {
+      con = 1 - .5 * (1.0 -this.es) * Math.log((1.0 - this.e3) / (1.0 + this.e3))/this.e3;
+      if (Math.abs(Math.abs(con) - Math.abs(qs)) > .0000000001 ) {
+          lat = this.phi1z(this.e3,qs);
+      } else {
+          if (qs >= 0) {
+             lat = .5 * PI;
+          } else {
+             lat = -.5 * PI;
+          }
+      }
+    } else {
+      lat = this.phi1z(e3,qs);
+    }
+
+    lon = Proj4js.common.adjust_lon(theta/this.ns0 + this.long0);
+    p.x = lon;
+    p.y = lat;
+    return p;
+  },
+  
+/* Function to compute phi1, the latitude for the inverse of the
+   Albers Conical Equal-Area projection.
+-------------------------------------------*/
+  phi1z: function (eccent,qs) {
+    var con, com, dphi;
+    var phi = Proj4js.common.asinz(.5 * qs);
+    if (eccent < Proj4js.common.EPSLN) return phi;
+    
+    var eccnts = eccent * eccent; 
+    for (var i = 1; i <= 25; i++) {
+        sinphi = Math.sin(phi);
+        cosphi = Math.cos(phi);
+        con = eccent * sinphi; 
+        com = 1.0 - con * con;
+        dphi = .5 * com * com / cosphi * (qs / (1.0 - eccnts) - sinphi / com + .5 / eccent * Math.log((1.0 - con) / (1.0 + con)));
+        phi = phi + dphi;
+        if (Math.abs(dphi) <= 1e-7) return phi;
+    }
+    Proj4js.reportError("aea:phi1z:Convergence error");
+    return null;
+  }
+  
+};
+
+
+
+/* ======================================================================
+    projCode/sterea.js
+   ====================================================================== */
+
+
+Proj4js.Proj.sterea = {
+  dependsOn : 'gauss',
+
+  init : function() {
+    Proj4js.Proj['gauss'].init.apply(this);
+    if (!this.rc) {
+      Proj4js.reportError("sterea:init:E_ERROR_0");
+      return;
+    }
+    this.sinc0 = Math.sin(this.phic0);
+    this.cosc0 = Math.cos(this.phic0);
+    this.R2 = 2.0 * this.rc;
+    if (!this.title) this.title = "Oblique Stereographic Alternative";
+  },
+
+  forward : function(p) {
+    p.x = Proj4js.common.adjust_lon(p.x-this.long0); /* adjust del longitude */
+    Proj4js.Proj['gauss'].forward.apply(this, [p]);
+    sinc = Math.sin(p.y);
+    cosc = Math.cos(p.y);
+    cosl = Math.cos(p.x);
+    k = this.k0 * this.R2 / (1.0 + this.sinc0 * sinc + this.cosc0 * cosc * cosl);
+    p.x = k * cosc * Math.sin(p.x);
+    p.y = k * (this.cosc0 * sinc - this.sinc0 * cosc * cosl);
+    p.x = this.a * p.x + this.x0;
+    p.y = this.a * p.y + this.y0;
+    return p;
+  },
+
+  inverse : function(p) {
+    var lon,lat;
+    p.x = (p.x - this.x0) / this.a; /* descale and de-offset */
+    p.y = (p.y - this.y0) / this.a;
+
+    p.x /= this.k0;
+    p.y /= this.k0;
+    if ( (rho = Math.sqrt(p.x*p.x + p.y*p.y)) ) {
+      c = 2.0 * Math.atan2(rho, this.R2);
+      sinc = Math.sin(c);
+      cosc = Math.cos(c);
+      lat = Math.asin(cosc * this.sinc0 + p.y * sinc * this.cosc0 / rho);
+      lon = Math.atan2(p.x * sinc, rho * this.cosc0 * cosc - p.y * this.sinc0 * sinc);
+    } else {
+      lat = this.phic0;
+      lon = 0.;
+    }
+
+    p.x = lon;
+    p.y = lat;
+    Proj4js.Proj['gauss'].inverse.apply(this,[p]);
+    p.x = Proj4js.common.adjust_lon(p.x + this.long0); /* adjust longitude to CM */
+    return p;
+  }
+};
+
+/* ======================================================================
+    projCode/poly.js
+   ====================================================================== */
+
+/* Function to compute, phi4, the latitude for the inverse of the
+   Polyconic projection.
+------------------------------------------------------------*/
+function phi4z (eccent,e0,e1,e2,e3,a,b,c,phi) {
+	var sinphi, sin2ph, tanph, ml, mlp, con1, con2, con3, dphi, i;
+
+	phi = a;
+	for (i = 1; i <= 15; i++) {
+		sinphi = Math.sin(phi);
+		tanphi = Math.tan(phi);
+		c = tanphi * Math.sqrt (1.0 - eccent * sinphi * sinphi);
+		sin2ph = Math.sin (2.0 * phi);
+		/*
+		ml = e0 * *phi - e1 * sin2ph + e2 * sin (4.0 *  *phi);
+		mlp = e0 - 2.0 * e1 * cos (2.0 *  *phi) + 4.0 * e2 *  cos (4.0 *  *phi);
+		*/
+		ml = e0 * phi - e1 * sin2ph + e2 * Math.sin (4.0 *  phi) - e3 * Math.sin (6.0 * phi);
+		mlp = e0 - 2.0 * e1 * Math.cos (2.0 *  phi) + 4.0 * e2 * Math.cos (4.0 *  phi) - 6.0 * e3 * Math.cos (6.0 *  phi);
+		con1 = 2.0 * ml + c * (ml * ml + b) - 2.0 * a *  (c * ml + 1.0);
+		con2 = eccent * sin2ph * (ml * ml + b - 2.0 * a * ml) / (2.0 *c);
+		con3 = 2.0 * (a - ml) * (c * mlp - 2.0 / sin2ph) - 2.0 * mlp;
+		dphi = con1 / (con2 + con3);
+		phi += dphi;
+		if (Math.abs(dphi) <= .0000000001 ) return(phi);   
+	}
+	Proj4js.reportError("phi4z: No convergence");
+	return null;
+}
+
+
+/* Function to compute the constant e4 from the input of the eccentricity
+   of the spheroid, x.  This constant is used in the Polar Stereographic
+   projection.
+--------------------------------------------------------------------*/
+function e4fn(x) {
+	var con, com;
+	con = 1.0 + x;
+	com = 1.0 - x;
+	return (Math.sqrt((Math.pow(con,con))*(Math.pow(com,com))));
+}
+
+
+
+
+
+/*******************************************************************************
+NAME                             POLYCONIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Polyconic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.poly = {
+
+	/* Initialize the POLYCONIC projection
+	  ----------------------------------*/
+	init: function() {
+		var temp;			/* temporary variable		*/
+		if (this.lat0=0) this.lat0=90;//this.lat0 ca
+
+		/* Place parameters in static storage for common use
+		  -------------------------------------------------*/
+		this.temp = this.b / this.a;
+		this.es = 1.0 - Math.pow(this.temp,2);// devait etre dans tmerc.js mais n y est pas donc je commente sinon retour de valeurs nulles 
+		this.e = Math.sqrt(this.es);
+		this.e0 = Proj4js.common.e0fn(this.es);
+		this.e1 = Proj4js.common.e1fn(this.es);
+		this.e2 = Proj4js.common.e2fn(this.es);
+		this.e3 = Proj4js.common.e3fn(this.es);
+		this.ml0 = Proj4js.common.mlfn(this.e0, this.e1,this.e2, this.e3, this.lat0);//si que des zeros le calcul ne se fait pas
+		//if (!this.ml0) {this.ml0=0;}
+	},
+
+
+	/* Polyconic forward equations--mapping lat,long to x,y
+	  ---------------------------------------------------*/
+	forward: function(p) {
+		var sinphi, cosphi;	/* sin and cos value				*/
+		var al;				/* temporary values				*/
+		var c;				/* temporary values				*/
+		var con, ml;		/* cone constant, small m			*/
+		var ms;				/* small m					*/
+		var x,y;
+
+		var lon=p.x;
+		var lat=p.y;	
+
+		con = Proj4js.common.adjust_lon(lon - this.long0);
+		if (Math.abs(lat) <= .0000001) {
+			x = this.x0 + this.a * con;
+			y = this.y0 - this.a * this.ml0;
+		} else {
+			sinphi = Math.sin(lat);
+			cosphi = Math.cos(lat);	   
+
+			ml = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+			ms = Proj4js.common.msfnz(this.e,sinphi,cosphi);
+			con = sinphi;
+			x = this.x0 + this.a * ms * Math.sin(con)/sinphi;
+			y = this.y0 + this.a * (ml - this.ml0 + ms * (1.0 - Math.cos(con))/sinphi);
+		}
+
+		p.x=x;
+		p.y=y;   
+		return p;
+	},
+
+
+	/* Inverse equations
+	-----------------*/
+	inverse: function(p) {
+		var sin_phi, cos_phi;	/* sin and cos value				*/
+		var al;					/* temporary values				*/
+		var b;					/* temporary values				*/
+		var c;					/* temporary values				*/
+		var con, ml;			/* cone constant, small m			*/
+		var iflg;				/* error flag					*/
+		var lon,lat;
+		p.x -= this.x0;
+		p.y -= this.y0;
+		al = this.ml0 + p.y/this.a;
+		iflg = 0;
+
+		if (Math.abs(al) <= .0000001) {
+			lon = p.x/this.a + this.long0;
+			lat = 0.0;
+		} else {
+			b = al * al + (p.x/this.a) * (p.x/this.a);
+			iflg = phi4z(this.es,this.e0,this.e1,this.e2,this.e3,this.al,b,c,lat);
+			if (iflg != 1) return(iflg);
+			lon = Proj4js.common.adjust_lon((Proj4js.common.asinz(p.x * c / this.a) / Math.sin(lat)) + this.long0);
+		}
+
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
+
+
+
+/* ======================================================================
+    projCode/equi.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                             EQUIRECTANGULAR 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Equirectangular projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+Proj4js.Proj.equi = {
+
+  init: function() {
+    if(!this.x0) this.x0=0;
+    if(!this.y0) this.y0=0;
+    if(!this.lat0) this.lat0=0;
+    if(!this.long0) this.long0=0;
+    ///this.t2;
+  },
+
+
+
+/* Equirectangular forward equations--mapping lat,long to x,y
+  ---------------------------------------------------------*/
+  forward: function(p) {
+
+    var lon=p.x;				
+    var lat=p.y;			
+
+    var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+    var x = this.x0 +this. a * dlon *Math.cos(this.lat0);
+    var y = this.y0 + this.a * lat;
+
+    this.t1=x;
+    this.t2=Math.cos(this.lat0);
+    p.x=x;
+    p.y=y;
+    return p;
+  },  //equiFwd()
+
+
+
+/* Equirectangular inverse equations--mapping x,y to lat/long
+  ---------------------------------------------------------*/
+  inverse: function(p) {
+
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var lat = p.y /this. a;
+
+    if ( Math.abs(lat) > Proj4js.common.HALF_PI) {
+        Proj4js.reportError("equi:Inv:DataError");
+    }
+    var lon = Proj4js.common.adjust_lon(this.long0 + p.x / (this.a * Math.cos(this.lat0)));
+    p.x=lon;
+    p.y=lat;
+  }//equiInv()
+};
+
+
+/* ======================================================================
+    projCode/merc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+D. Steinwand, EROS      Nov, 1991
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+//static double r_major = a;		   /* major axis 				*/
+//static double r_minor = b;		   /* minor axis 				*/
+//static double lon_center = long0;	   /* Center longitude (projection center) */
+//static double lat_origin =  lat0;	   /* center latitude			*/
+//static double e,es;		           /* eccentricity constants		*/
+//static double m1;		               /* small value m			*/
+//static double false_northing = y0;   /* y offset in meters			*/
+//static double false_easting = x0;	   /* x offset in meters			*/
+//scale_fact = k0 
+
+Proj4js.Proj.merc = {
+  init : function() {
+	//?this.temp = this.r_minor / this.r_major;
+	//this.temp = this.b / this.a;
+	//this.es = 1.0 - Math.sqrt(this.temp);
+	//this.e = Math.sqrt( this.es );
+	//?this.m1 = Math.cos(this.lat_origin) / (Math.sqrt( 1.0 - this.es * Math.sin(this.lat_origin) * Math.sin(this.lat_origin)));
+	//this.m1 = Math.cos(0.0) / (Math.sqrt( 1.0 - this.es * Math.sin(0.0) * Math.sin(0.0)));
+    if (this.lat_ts) {
+      if (this.sphere) {
+        this.k0 = Math.cos(this.lat_ts);
+      } else {
+        this.k0 = Proj4js.common.msfnz(this.es, Math.sin(this.lat_ts), Math.cos(this.lat_ts));
+      }
+    }
+  },
+
+/* Mercator forward equations--mapping lat,long to x,y
+  --------------------------------------------------*/
+
+  forward : function(p) {	
+    //alert("ll2m coords : "+coords);
+    var lon = p.x;
+    var lat = p.y;
+    // convert to radians
+    if ( lat*Proj4js.common.R2D > 90.0 && 
+          lat*Proj4js.common.R2D < -90.0 && 
+          lon*Proj4js.common.R2D > 180.0 && 
+          lon*Proj4js.common.R2D < -180.0) {
+      Proj4js.reportError("merc:forward: llInputOutOfRange: "+ lon +" : " + lat);
+      return null;
+    }
+
+    var x,y;
+    if(Math.abs( Math.abs(lat) - Proj4js.common.HALF_PI)  <= Proj4js.common.EPSLN) {
+      Proj4js.reportError("merc:forward: ll2mAtPoles");
+      return null;
+    } else {
+      if (this.sphere) {
+        x = this.x0 + this.a * this.k0 * Proj4js.common.adjust_lon(lon - this.long0);
+        y = this.y0 + this.a * this.k0 * Math.log(Math.tan(Proj4js.common.FORTPI + 0.5*lat));
+      } else {
+        var sinphi = Math.sin(lat);
+        var ts = Proj4js.common.tsfnz(this.e,lat,sinphi);
+        x = this.x0 + this.a * this.k0 * Proj4js.common.adjust_lon(lon - this.long0);
+        y = this.y0 - this.a * this.k0 * Math.log(ts);
+      }
+      p.x = x; 
+      p.y = y;
+      return p;
+    }
+  },
+
+
+  /* Mercator inverse equations--mapping x,y to lat/long
+  --------------------------------------------------*/
+  inverse : function(p) {	
+
+    var x = p.x - this.x0;
+    var y = p.y - this.y0;
+    var lon,lat;
+
+    if (this.sphere) {
+      lat = Proj4js.common.HALF_PI - 2.0 * Math.atan(Math.exp(-y / this.a * this.k0));
+    } else {
+      var ts = Math.exp(-y / (this.a * this.k0));
+      lat = Proj4js.common.phi2z(this.e,ts);
+      if(lat == -9999) {
+        Proj4js.reportError("merc:inverse: lat = -9999");
+        return null;
+      }
+    }
+    lon = Proj4js.common.adjust_lon(this.long0+ x / (this.a * this.k0));
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
+
+/* ======================================================================
+    projCode/utm.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            TRANSVERSE MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Transverse Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+/**
+  Initialize Transverse Mercator projection
+*/
+
+Proj4js.Proj.utm = {
+  dependsOn : 'tmerc',
+
+  init : function() {
+    if (!this.zone) {
+      Proj4js.reportError("utm:init: zone must be specified for UTM");
+      return;
+    }
+    this.lat0 = 0.0;
+    this.long0 = ((6 * Math.abs(this.zone)) - 183) * Proj4js.common.D2R;
+    this.x0 = 500000.0;
+    this.y0 = this.utmSouth ? 10000000.0 : 0.0;
+    this.k0 = 0.9996;
+
+    Proj4js.Proj['tmerc'].init.apply(this);
+    this.forward = Proj4js.Proj['tmerc'].forward;
+    this.inverse = Proj4js.Proj['tmerc'].inverse;
+  }
+};
+/* ======================================================================
+    projCode/eqdc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            EQUIDISTANT CONIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and Northing
+		for the Equidistant Conic projection.  The longitude and
+		latitude must be in radians.  The Easting and Northing values
+		will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+/* Variables common to all subroutines in this code file
+  -----------------------------------------------------*/
+
+Proj4js.Proj.eqdc = {
+
+/* Initialize the Equidistant Conic projection
+  ------------------------------------------*/
+  init: function() {
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+
+    if(!this.mode) this.mode=0;//chosen default mode
+    this.temp = this.b / this.a;
+    this.es = 1.0 - Math.pow(this.temp,2);
+    this.e = Math.sqrt(this.es);
+    this.e0 = Proj4js.common.e0fn(this.es);
+    this.e1 = Proj4js.common.e1fn(this.es);
+    this.e2 = Proj4js.common.e2fn(this.es);
+    this.e3 = Proj4js.common.e3fn(this.es);
+
+    this.sinphi=Math.sin(this.lat1);
+    this.cosphi=Math.cos(this.lat1);
+
+    this.ms1 = Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);
+    this.ml1 = Proj4js.common.mlfn(this.e0, this.e1, this.e2,this.e3, this.lat1);
+
+    /* format B
+    ---------*/
+    if (this.mode != 0) {
+      if (Math.abs(this.lat1 + this.lat2) < Proj4js.common.EPSLN) {
+            Proj4js.reportError("eqdc:Init:EqualLatitudes");
+            //return(81);
+       }
+       this.sinphi=Math.sin(this.lat2);
+       this.cosphi=Math.cos(this.lat2);   
+
+       this.ms2 = Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);
+       this.ml2 = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, this.lat2);
+       if (Math.abs(this.lat1 - this.lat2) >= Proj4js.common.EPSLN) {
+         this.ns = (this.ms1 - this.ms2) / (this.ml2 - this.ml1);
+       } else {
+          this.ns = this.sinphi;
+       }
+    } else {
+      this.ns = this.sinphi;
+    }
+    this.g = this.ml1 + this.ms1/this.ns;
+    this.ml0 = Proj4js.common.mlfn(this.e0, this.e1,this. e2, this.e3, this.lat0);
+    this.rh = this.a * (this.g - this.ml0);
+  },
+
+
+/* Equidistant Conic forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+
+    /* Forward equations
+      -----------------*/
+    var ml = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+    var rh1 = this.a * (this.g - ml);
+    var theta = this.ns * Proj4js.common.adjust_lon(lon - this.long0);
+
+    var x = this.x0  + rh1 * Math.sin(theta);
+    var y = this.y0 + this.rh - rh1 * Math.cos(theta);
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y  = this.rh - p.y + this.y0;
+    var con, rh1;
+    if (this.ns >= 0) {
+       var rh1 = Math.sqrt(p.x *p.x + p.y * p.y); 
+       var con = 1.0;
+    } else {
+       rh1 = -Math.sqrt(p.x *p. x +p. y * p.y); 
+       con = -1.0;
+    }
+    var theta = 0.0;
+    if (rh1 != 0.0) theta = Math.atan2(con *p.x, con *p.y);
+    var ml = this.g - rh1 /this.a;
+    var lat = this.phi3z(ml,this.e0,this.e1,this.e2,this.e3);
+    var lon = Proj4js.common.adjust_lon(this.long0 + theta / this.ns);
+
+     p.x=lon;
+     p.y=lat;  
+     return p;
+    },
+    
+/* Function to compute latitude, phi3, for the inverse of the Equidistant
+   Conic projection.
+-----------------------------------------------------------------*/
+  phi3z: function(ml,e0,e1,e2,e3) {
+    var phi;
+    var dphi;
+
+    phi = ml;
+    for (var i = 0; i < 15; i++) {
+      dphi = (ml + e1 * Math.sin(2.0 * phi) - e2 * Math.sin(4.0 * phi) + e3 * Math.sin(6.0 * phi))/ e0 - phi;
+      phi += dphi;
+      if (Math.abs(dphi) <= .0000000001) {
+        return phi;
+      }
+    }
+    Proj4js.reportError("PHI3Z-CONV:Latitude failed to converge after 15 iterations");
+    return null;
+  }
+
+    
+};
+/* ======================================================================
+    projCode/tmerc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            TRANSVERSE MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Transverse Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+/**
+  Initialize Transverse Mercator projection
+*/
+
+Proj4js.Proj.tmerc = {
+  init : function() {
+    this.e0 = Proj4js.common.e0fn(this.es);
+    this.e1 = Proj4js.common.e1fn(this.es);
+    this.e2 = Proj4js.common.e2fn(this.es);
+    this.e3 = Proj4js.common.e3fn(this.es);
+    this.ml0 = this.a * Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, this.lat0);
+  },
+
+  /**
+    Transverse Mercator Forward  - long/lat to x/y
+    long/lat in radians
+  */
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    var delta_lon = Proj4js.common.adjust_lon(lon - this.long0); // Delta longitude
+    var con;    // cone constant
+    var x, y;
+    var sin_phi=Math.sin(lat);
+    var cos_phi=Math.cos(lat);
+
+    if (this.sphere) {  /* spherical form */
+      var b = cos_phi * Math.sin(delta_lon);
+      if ((Math.abs(Math.abs(b) - 1.0)) < .0000000001)  {
+        Proj4js.reportError("tmerc:forward: Point projects into infinity");
+        return(93);
+      } else {
+        x = .5 * this.a * this.k0 * Math.log((1.0 + b)/(1.0 - b));
+        con = Math.acos(cos_phi * Math.cos(delta_lon)/Math.sqrt(1.0 - b*b));
+        if (lat < 0) con = - con;
+        y = this.a * this.k0 * (con - this.lat0);
+      }
+    } else {
+      var al  = cos_phi * delta_lon;
+      var als = Math.pow(al,2);
+      var c   = this.ep2 * Math.pow(cos_phi,2);
+      var tq  = Math.tan(lat);
+      var t   = Math.pow(tq,2);
+      con = 1.0 - this.es * Math.pow(sin_phi,2);
+      var n   = this.a / Math.sqrt(con);
+      var ml  = this.a * Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+
+      x = this.k0 * n * al * (1.0 + als / 6.0 * (1.0 - t + c + als / 20.0 * (5.0 - 18.0 * t + Math.pow(t,2) + 72.0 * c - 58.0 * this.ep2))) + this.x0;
+      y = this.k0 * (ml - this.ml0 + n * tq * (als * (0.5 + als / 24.0 * (5.0 - t + 9.0 * c + 4.0 * Math.pow(c,2) + als / 30.0 * (61.0 - 58.0 * t + Math.pow(t,2) + 600.0 * c - 330.0 * this.ep2))))) + this.y0;
+
+    }
+    p.x = x; p.y = y;
+    return p;
+  }, // tmercFwd()
+
+  /**
+    Transverse Mercator Inverse  -  x/y to long/lat
+  */
+  inverse : function(p) {
+    var con, phi;  /* temporary angles       */
+    var delta_phi; /* difference between longitudes    */
+    var i;
+    var max_iter = 6;      /* maximun number of iterations */
+    var lat, lon;
+
+    if (this.sphere) {   /* spherical form */
+      var f = Math.exp(p.x/(this.a * this.k0));
+      var g = .5 * (f - 1/f);
+      var temp = this.lat0 + p.y/(this.a * this.k0);
+      var h = Math.cos(temp);
+      con = Math.sqrt((1.0 - h * h)/(1.0 + g * g));
+      lat = Proj4js.common.asinz(con);
+      if (temp < 0)
+        lat = -lat;
+      if ((g == 0) && (h == 0)) {
+        lon = this.long0;
+      } else {
+        lon = Proj4js.common.adjust_lon(Math.atan2(g,h) + this.long0);
+      }
+    } else {    // ellipsoidal form
+      var x = p.x - this.x0;
+      var y = p.y - this.y0;
+
+      con = (this.ml0 + y / this.k0) / this.a;
+      phi = con;
+      for (i=0;true;i++) {
+        delta_phi=((con + this.e1 * Math.sin(2.0*phi) - this.e2 * Math.sin(4.0*phi) + this.e3 * Math.sin(6.0*phi)) / this.e0) - phi;
+        phi += delta_phi;
+        if (Math.abs(delta_phi) <= Proj4js.common.EPSLN) break;
+        if (i >= max_iter) {
+          Proj4js.reportError("tmerc:inverse: Latitude failed to converge");
+          return(95);
+        }
+      } // for()
+      if (Math.abs(phi) < Proj4js.common.HALF_PI) {
+        // sincos(phi, &sin_phi, &cos_phi);
+        var sin_phi=Math.sin(phi);
+        var cos_phi=Math.cos(phi);
+        var tan_phi = Math.tan(phi);
+        var c = this.ep2 * Math.pow(cos_phi,2);
+        var cs = Math.pow(c,2);
+        var t = Math.pow(tan_phi,2);
+        var ts = Math.pow(t,2);
+        con = 1.0 - this.es * Math.pow(sin_phi,2);
+        var n = this.a / Math.sqrt(con);
+        var r = n * (1.0 - this.es) / con;
+        var d = x / (n * this.k0);
+        var ds = Math.pow(d,2);
+        lat = phi - (n * tan_phi * ds / r) * (0.5 - ds / 24.0 * (5.0 + 3.0 * t + 10.0 * c - 4.0 * cs - 9.0 * this.ep2 - ds / 30.0 * (61.0 + 90.0 * t + 298.0 * c + 45.0 * ts - 252.0 * this.ep2 - 3.0 * cs)));
+        lon = Proj4js.common.adjust_lon(this.long0 + (d * (1.0 - ds / 6.0 * (1.0 + 2.0 * t + c - ds / 20.0 * (5.0 - 2.0 * c + 28.0 * t - 3.0 * cs + 8.0 * this.ep2 + 24.0 * ts))) / cos_phi));
+      } else {
+        lat = Proj4js.common.HALF_PI * Proj4js.common.sign(y);
+        lon = this.long0;
+      }
+    }
+    p.x = lon;
+    p.y = lat;
+    return p;
+  } // tmercInv()
+};
+/* ======================================================================
+    defs/GOOGLE.js
+   ====================================================================== */
+
+Proj4js.defs["GOOGLE"]="+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";
+Proj4js.defs["EPSG:900913"]=Proj4js.defs["GOOGLE"];
+/* ======================================================================
+    projCode/gstmerc.js
+   ====================================================================== */
+
+Proj4js.Proj.gstmerc = {
+  init : function() {
+
+    // array of:  a, b, lon0, lat0, k0, x0, y0
+      var temp= this.b / this.a;
+      this.e= Math.sqrt(1.0 - temp*temp);
+      this.lc= this.long0;
+      this.rs= Math.sqrt(1.0+this.e*this.e*Math.pow(Math.cos(this.lat0),4.0)/(1.0-this.e*this.e));
+      var sinz= Math.sin(this.lat0);
+      var pc= Math.asin(sinz/this.rs);
+      var sinzpc= Math.sin(pc);
+      this.cp= Proj4js.common.latiso(0.0,pc,sinzpc)-this.rs*Proj4js.common.latiso(this.e,this.lat0,sinz);
+      this.n2= this.k0*this.a*Math.sqrt(1.0-this.e*this.e)/(1.0-this.e*this.e*sinz*sinz);
+      this.xs= this.x0;
+      this.ys= this.y0-this.n2*pc;
+
+      if (!this.title) this.title = "Gauss Schreiber transverse mercator";
+    },
+
+
+    // forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon= p.x;
+      var lat= p.y;
+
+      var L= this.rs*(lon-this.lc);
+      var Ls= this.cp+(this.rs*Proj4js.common.latiso(this.e,lat,Math.sin(lat)));
+      var lat1= Math.asin(Math.sin(L)/Proj4js.common.cosh(Ls));
+      var Ls1= Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));
+      p.x= this.xs+(this.n2*Ls1);
+      p.y= this.ys+(this.n2*Math.atan(Proj4js.common.sinh(Ls)/Math.cos(L)));
+      return p;
+    },
+
+  // inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var x= p.x;
+    var y= p.y;
+
+    var L= Math.atan(Proj4js.common.sinh((x-this.xs)/this.n2)/Math.cos((y-this.ys)/this.n2));
+    var lat1= Math.asin(Math.sin((y-this.ys)/this.n2)/Proj4js.common.cosh((x-this.xs)/this.n2));
+    var LC= Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));
+    p.x= this.lc+L/this.rs;
+    p.y= Proj4js.common.invlatiso(this.e,(LC-this.cp)/this.rs);
+    return p;
+  }
+
+};
+/* ======================================================================
+    projCode/ortho.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                             ORTHOGRAPHIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Orthographic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.ortho = {
+
+  /* Initialize the Orthographic projection
+    -------------------------------------*/
+  init: function(def) {
+    //double temp;			/* temporary variable		*/
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/;
+    this.sin_p14=Math.sin(this.lat0);
+    this.cos_p14=Math.cos(this.lat0);	
+  },
+
+
+  /* Orthographic forward equations--mapping lat,long to x,y
+    ---------------------------------------------------*/
+  forward: function(p) {
+    var sinphi, cosphi;	/* sin and cos value				*/
+    var dlon;		/* delta longitude value			*/
+    var coslon;		/* cos of longitude				*/
+    var ksp;		/* scale factor					*/
+    var g;		
+    var lon=p.x;
+    var lat=p.y;	
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon - this.long0);
+
+    sinphi=Math.sin(lat);
+    cosphi=Math.cos(lat);	
+
+    coslon = Math.cos(dlon);
+    g = this.sin_p14 * sinphi + this.cos_p14 * cosphi * coslon;
+    ksp = 1.0;
+    if ((g > 0) || (Math.abs(g) <= Proj4js.common.EPSLN)) {
+      var x = this.a * ksp * cosphi * Math.sin(dlon);
+      var y = this.y0 + this.a * ksp * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon);
+    } else {
+      Proj4js.reportError("orthoFwdPointError");
+    }
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh;		/* height above ellipsoid			*/
+    var z;		/* angle					*/
+    var sinz,cosz;	/* sin of z and cos of z			*/
+    var temp;
+    var con;
+    var lon , lat;
+    /* Inverse equations
+      -----------------*/
+    p.x -= this.x0;
+    p.y -= this.y0;
+    rh = Math.sqrt(p.x * p.x + p.y * p.y);
+    if (rh > this.a + .0000001) {
+      Proj4js.reportError("orthoInvDataError");
+    }
+    z = Proj4js.common.asinz(rh / this.a);
+
+    sinz=Math.sin(z);
+    cosz=Math.cos(z);
+
+    lon = this.long0;
+    if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+      lat = this.lat0; 
+    }
+    lat = Proj4js.common.asinz(cosz * this.sin_p14 + (p.y * sinz * this.cos_p14)/rh);
+    con = Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+    if (Math.abs(con) <= Proj4js.common.EPSLN) {
+       if (this.lat0 >= 0) {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x, -p.y));
+       } else {
+          lon = Proj4js.common.adjust_lon(this.long0 -Math.atan2(-p.x, p.y));
+       }
+    }
+    con = cosz - this.sin_p14 * Math.sin(lat);
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
+
+/* ======================================================================
+    projCode/somerc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                       SWISS OBLIQUE MERCATOR
+
+PURPOSE:	Swiss projection.
+WARNING:  X and Y are inverted (weird) in the swiss coordinate system. Not
+   here, since we want X to be horizontal and Y vertical.
+
+ALGORITHM REFERENCES
+1. "Formules et constantes pour le Calcul pour la
+ projection cylindrique conforme Ã  axe oblique et pour la transformation entre
+ des systÃšmes de rÃ©fÃ©rence".
+ http://www.swisstopo.admin.ch/internet/swisstopo/fr/home/topics/survey/sys/refsys/switzerland.parsysrelated1.31216.downloadList.77004.DownloadFile.tmp/swissprojectionfr.pdf
+
+*******************************************************************************/
+
+Proj4js.Proj.somerc = {
+
+  init: function() {
+    var phy0 = this.lat0;
+    this.lambda0 = this.long0;
+    var sinPhy0 = Math.sin(phy0);
+    var semiMajorAxis = this.a;
+    var invF = this.rf;
+    var flattening = 1 / invF;
+    var e2 = 2 * flattening - Math.pow(flattening, 2);
+    var e = this.e = Math.sqrt(e2);
+    this.R = this.k0 * semiMajorAxis * Math.sqrt(1 - e2) / (1 - e2 * Math.pow(sinPhy0, 2.0));
+    this.alpha = Math.sqrt(1 + e2 / (1 - e2) * Math.pow(Math.cos(phy0), 4.0));
+    this.b0 = Math.asin(sinPhy0 / this.alpha);
+    this.K = Math.log(Math.tan(Math.PI / 4.0 + this.b0 / 2.0))
+            - this.alpha
+            * Math.log(Math.tan(Math.PI / 4.0 + phy0 / 2.0))
+            + this.alpha
+            * e / 2
+            * Math.log((1 + e * sinPhy0)
+            / (1 - e * sinPhy0));
+  },
+
+
+  forward: function(p) {
+    var Sa1 = Math.log(Math.tan(Math.PI / 4.0 - p.y / 2.0));
+    var Sa2 = this.e / 2.0
+            * Math.log((1 + this.e * Math.sin(p.y))
+            / (1 - this.e * Math.sin(p.y)));
+    var S = -this.alpha * (Sa1 + Sa2) + this.K;
+
+        // spheric latitude
+    var b = 2.0 * (Math.atan(Math.exp(S)) - Math.PI / 4.0);
+
+        // spheric longitude
+    var I = this.alpha * (p.x - this.lambda0);
+
+        // psoeudo equatorial rotation
+    var rotI = Math.atan(Math.sin(I)
+            / (Math.sin(this.b0) * Math.tan(b) +
+               Math.cos(this.b0) * Math.cos(I)));
+
+    var rotB = Math.asin(Math.cos(this.b0) * Math.sin(b) -
+                         Math.sin(this.b0) * Math.cos(b) * Math.cos(I));
+
+    p.y = this.R / 2.0
+            * Math.log((1 + Math.sin(rotB)) / (1 - Math.sin(rotB)))
+            + this.y0;
+    p.x = this.R * rotI + this.x0;
+    return p;
+  },
+
+  inverse: function(p) {
+    var Y = p.x - this.x0;
+    var X = p.y - this.y0;
+
+    var rotI = Y / this.R;
+    var rotB = 2 * (Math.atan(Math.exp(X / this.R)) - Math.PI / 4.0);
+
+    var b = Math.asin(Math.cos(this.b0) * Math.sin(rotB)
+            + Math.sin(this.b0) * Math.cos(rotB) * Math.cos(rotI));
+    var I = Math.atan(Math.sin(rotI)
+            / (Math.cos(this.b0) * Math.cos(rotI) - Math.sin(this.b0)
+            * Math.tan(rotB)));
+
+    var lambda = this.lambda0 + I / this.alpha;
+
+    var S = 0.0;
+    var phy = b;
+    var prevPhy = -1000.0;
+    var iteration = 0;
+    while (Math.abs(phy - prevPhy) > 0.0000001)
+    {
+      if (++iteration > 20)
+      {
+        Proj4js.reportError("omercFwdInfinity");
+        return;
+      }
+      //S = Math.log(Math.tan(Math.PI / 4.0 + phy / 2.0));
+      S = 1.0
+              / this.alpha
+              * (Math.log(Math.tan(Math.PI / 4.0 + b / 2.0)) - this.K)
+              + this.e
+              * Math.log(Math.tan(Math.PI / 4.0
+              + Math.asin(this.e * Math.sin(phy))
+              / 2.0));
+      prevPhy = phy;
+      phy = 2.0 * Math.atan(Math.exp(S)) - Math.PI / 2.0;
+    }
+
+    p.x = lambda;
+    p.y = phy;
+    return p;
+  }
+};
+/* ======================================================================
+    projCode/stere.js
+   ====================================================================== */
+
+
+// Initialize the Stereographic projection
+
+Proj4js.Proj.stere = {
+  ssfn_: function(phit, sinphi, eccen) {
+  	sinphi *= eccen;
+  	return (Math.tan (.5 * (Proj4js.common.HALF_PI + phit)) * Math.pow((1. - sinphi) / (1. + sinphi), .5 * eccen));
+  },
+  TOL:	1.e-8,
+  NITER:	8,
+  CONV:	1.e-10,
+  S_POLE:	0,
+  N_POLE:	1,
+  OBLIQ:	2,
+  EQUIT:	3,
+
+  init : function() {
+  	this.phits = this.lat_ts ? this.lat_ts : Proj4js.common.HALF_PI;
+    var t = Math.abs(this.lat0);
+  	if ((Math.abs(t) - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+  		this.mode = this.lat0 < 0. ? this.S_POLE : this.N_POLE;
+  	} else {
+  		this.mode = t > Proj4js.common.EPSLN ? this.OBLIQ : this.EQUIT;
+    }
+  	this.phits = Math.abs(this.phits);
+  	if (this.es) {
+  		var X;
+
+  		switch (this.mode) {
+  		case this.N_POLE:
+  		case this.S_POLE:
+  			if (Math.abs(this.phits - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+  				this.akm1 = 2. * this.k0 / Math.sqrt(Math.pow(1+this.e,1+this.e)*Math.pow(1-this.e,1-this.e));
+  			} else {
+          t = Math.sin(this.phits);
+  				this.akm1 = Math.cos(this.phits) / Proj4js.common.tsfnz(this.e, this.phits, t);
+  				t *= this.e;
+  				this.akm1 /= Math.sqrt(1. - t * t);
+  			}
+  			break;
+  		case this.EQUIT:
+  			this.akm1 = 2. * this.k0;
+  			break;
+  		case this.OBLIQ:
+  			t = Math.sin(this.lat0);
+  			X = 2. * Math.atan(this.ssfn_(this.lat0, t, this.e)) - Proj4js.common.HALF_PI;
+  			t *= this.e;
+  			this.akm1 = 2. * this.k0 * Math.cos(this.lat0) / Math.sqrt(1. - t * t);
+  			this.sinX1 = Math.sin(X);
+  			this.cosX1 = Math.cos(X);
+  			break;
+  		}
+  	} else {
+  		switch (this.mode) {
+  		case this.OBLIQ:
+  			this.sinph0 = Math.sin(this.lat0);
+  			this.cosph0 = Math.cos(this.lat0);
+  		case this.EQUIT:
+  			this.akm1 = 2. * this.k0;
+  			break;
+  		case this.S_POLE:
+  		case this.N_POLE:
+  			this.akm1 = Math.abs(this.phits - Proj4js.common.HALF_PI) >= Proj4js.common.EPSLN ?
+  			   Math.cos(this.phits) / Math.tan(Proj4js.common.FORTPI - .5 * this.phits) :
+  			   2. * this.k0 ;
+  			break;
+  		}
+  	}
+  }, 
+
+// Stereographic forward equations--mapping lat,long to x,y
+  forward: function(p) {
+    var lon = p.x;
+    lon = Proj4js.common.adjust_lon(lon - this.long0);
+    var lat = p.y;
+    var x, y;
+    
+    if (this.sphere) {
+    	var  sinphi, cosphi, coslam, sinlam;
+
+    	sinphi = Math.sin(lat);
+    	cosphi = Math.cos(lat);
+    	coslam = Math.cos(lon);
+    	sinlam = Math.sin(lon);
+    	switch (this.mode) {
+    	case this.EQUIT:
+    		y = 1. + cosphi * coslam;
+    		if (y <= Proj4js.common.EPSLN) {
+          F_ERROR;
+        }
+        y = this.akm1 / y;
+    		x = y * cosphi * sinlam;
+        y *= sinphi;
+    		break;
+    	case this.OBLIQ:
+    		y = 1. + this.sinph0 * sinphi + this.cosph0 * cosphi * coslam;
+    		if (y <= Proj4js.common.EPSLN) {
+          F_ERROR;
+        }
+        y = this.akm1 / y;
+    		x = y * cosphi * sinlam;
+    		y *= this.cosph0 * sinphi - this.sinph0 * cosphi * coslam;
+    		break;
+    	case this.N_POLE:
+    		coslam = -coslam;
+    		lat = -lat;
+        //Note  no break here so it conitnues through S_POLE
+    	case this.S_POLE:
+    		if (Math.abs(lat - Proj4js.common.HALF_PI) < this.TOL) {
+          F_ERROR;
+        }
+        y = this.akm1 * Math.tan(Proj4js.common.FORTPI + .5 * lat);
+    		x = sinlam * y;
+    		y *= coslam;
+    		break;
+    	}
+    } else {
+    	coslam = Math.cos(lon);
+    	sinlam = Math.sin(lon);
+    	sinphi = Math.sin(lat);
+    	if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+        X = 2. * Math.atan(this.ssfn_(lat, sinphi, this.e));
+    		sinX = Math.sin(X - Proj4js.common.HALF_PI);
+    		cosX = Math.cos(X);
+    	}
+    	switch (this.mode) {
+    	case this.OBLIQ:
+    		A = this.akm1 / (this.cosX1 * (1. + this.sinX1 * sinX + this.cosX1 * cosX * coslam));
+    		y = A * (this.cosX1 * sinX - this.sinX1 * cosX * coslam);
+    		x = A * cosX;
+    		break;
+    	case this.EQUIT:
+    		A = 2. * this.akm1 / (1. + cosX * coslam);
+    		y = A * sinX;
+    		x = A * cosX;
+    		break;
+    	case this.S_POLE:
+    		lat = -lat;
+    		coslam = - coslam;
+    		sinphi = -sinphi;
+    	case this.N_POLE:
+    		x = this.akm1 * Proj4js.common.tsfnz(this.e, lat, sinphi);
+    		y = - x * coslam;
+    		break;
+    	}
+    	x = x * sinlam;
+    }
+    p.x = x*this.a + this.x0;
+    p.y = y*this.a + this.y0;
+    return p;
+  },
+
+
+//* Stereographic inverse equations--mapping x,y to lat/long
+  inverse: function(p) {
+    var x = (p.x - this.x0)/this.a;   /* descale and de-offset */
+    var y = (p.y - this.y0)/this.a;
+    var lon, lat;
+
+    var cosphi, sinphi, tp=0.0, phi_l=0.0, rho, halfe=0.0, pi2=0.0;
+    var i;
+
+    if (this.sphere) {
+    	var  c, rh, sinc, cosc;
+
+      rh = Math.sqrt(x*x + y*y);
+      c = 2. * Math.atan(rh / this.akm1);
+    	sinc = Math.sin(c);
+    	cosc = Math.cos(c);
+    	lon = 0.;
+    	switch (this.mode) {
+    	case this.EQUIT:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = 0.;
+    		} else {
+    			lat = Math.asin(y * sinc / rh);
+        }
+    		if (cosc != 0. || x != 0.) lon = Math.atan2(x * sinc, cosc * rh);
+    		break;
+    	case this.OBLIQ:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = this.phi0;
+    		} else {
+    			lat = Math.asin(cosc * sinph0 + y * sinc * cosph0 / rh);
+        }
+        c = cosc - sinph0 * Math.sin(lat);
+    		if (c != 0. || x != 0.) {
+    			lon = Math.atan2(x * sinc * cosph0, c * rh);
+        }
+    		break;
+    	case this.N_POLE:
+    		y = -y;
+    	case this.S_POLE:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = this.phi0;
+    		} else {
+    			lat = Math.asin(this.mode == this.S_POLE ? -cosc : cosc);
+        }
+    		lon = (x == 0. && y == 0.) ? 0. : Math.atan2(x, y);
+    		break;
+    	}
+        p.x = Proj4js.common.adjust_lon(lon + this.long0);
+        p.y = lat;
+    } else {
+    	rho = Math.sqrt(x*x + y*y);
+    	switch (this.mode) {
+    	case this.OBLIQ:
+    	case this.EQUIT:
+        tp = 2. * Math.atan2(rho * this.cosX1 , this.akm1);
+    		cosphi = Math.cos(tp);
+    		sinphi = Math.sin(tp);
+        if( rho == 0.0 ) {
+    		  phi_l = Math.asin(cosphi * this.sinX1);
+        } else {
+    		  phi_l = Math.asin(cosphi * this.sinX1 + (y * sinphi * this.cosX1 / rho));
+        }
+
+    		tp = Math.tan(.5 * (Proj4js.common.HALF_PI + phi_l));
+    		x *= sinphi;
+    		y = rho * this.cosX1 * cosphi - y * this.sinX1* sinphi;
+    		pi2 = Proj4js.common.HALF_PI;
+    		halfe = .5 * this.e;
+    		break;
+    	case this.N_POLE:
+    		y = -y;
+    	case this.S_POLE:
+        tp = - rho / this.akm1;
+    		phi_l = Proj4js.common.HALF_PI - 2. * Math.atan(tp);
+    		pi2 = -Proj4js.common.HALF_PI;
+    		halfe = -.5 * this.e;
+    		break;
+    	}
+    	for (i = this.NITER; i--; phi_l = lat) { //check this
+    		sinphi = this.e * Math.sin(phi_l);
+    		lat = 2. * Math.atan(tp * Math.pow((1.+sinphi)/(1.-sinphi), halfe)) - pi2;
+    		if (Math.abs(phi_l - lat) < this.CONV) {
+    			if (this.mode == this.S_POLE) lat = -lat;
+    			lon = (x == 0. && y == 0.) ? 0. : Math.atan2(x, y);
+          p.x = Proj4js.common.adjust_lon(lon + this.long0);
+          p.y = lat;
+    			return p;
+    		}
+    	}
+    }
+  }
+}; 
+/* ======================================================================
+    projCode/nzmg.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            NEW ZEALAND MAP GRID
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the New Zealand Map Grid projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+
+ALGORITHM REFERENCES
+
+1.  Department of Land and Survey Technical Circular 1973/32
+      http://www.linz.govt.nz/docs/miscellaneous/nz-map-definition.pdf
+
+2.  OSG Technical Report 4.1
+      http://www.linz.govt.nz/docs/miscellaneous/nzmg.pdf
+
+
+IMPLEMENTATION NOTES
+
+The two references use different symbols for the calculated values. This
+implementation uses the variable names similar to the symbols in reference [1].
+
+The alogrithm uses different units for delta latitude and delta longitude.
+The delta latitude is assumed to be in units of seconds of arc x 10^-5.
+The delta longitude is the usual radians. Look out for these conversions.
+
+The algorithm is described using complex arithmetic. There were three
+options:
+   * find and use a Javascript library for complex arithmetic
+   * write my own complex library
+   * expand the complex arithmetic by hand to simple arithmetic
+
+This implementation has expanded the complex multiplication operations
+into parallel simple arithmetic operations for the real and imaginary parts.
+The imaginary part is way over to the right of the display; this probably
+violates every coding standard in the world, but, to me, it makes it much
+more obvious what is going on.
+
+The following complex operations are used:
+   - addition
+   - multiplication
+   - division
+   - complex number raised to integer power
+   - summation
+
+A summary of complex arithmetic operations:
+   (from http://en.wikipedia.org/wiki/Complex_arithmetic)
+   addition:       (a + bi) + (c + di) = (a + c) + (b + d)i
+   subtraction:    (a + bi) - (c + di) = (a - c) + (b - d)i
+   multiplication: (a + bi) x (c + di) = (ac - bd) + (bc + ad)i
+   division:       (a + bi) / (c + di) = [(ac + bd)/(cc + dd)] + [(bc - ad)/(cc + dd)]i
+
+The algorithm needs to calculate summations of simple and complex numbers. This is
+implemented using a for-loop, pre-loading the summed value to zero.
+
+The algorithm needs to calculate theta^2, theta^3, etc while doing a summation.
+There are three possible implementations:
+   - use Math.pow in the summation loop - except for complex numbers
+   - precalculate the values before running the loop
+   - calculate theta^n = theta^(n-1) * theta during the loop
+This implementation uses the third option for both real and complex arithmetic.
+
+For example
+   psi_n = 1;
+   sum = 0;
+   for (n = 1; n <=6; n++) {
+      psi_n1 = psi_n * psi;       // calculate psi^(n+1)
+      psi_n = psi_n1;
+      sum = sum + A[n] * psi_n;
+   }
+
+
+TEST VECTORS
+
+NZMG E, N:         2487100.638      6751049.719     metres
+NZGD49 long, lat:      172.739194       -34.444066  degrees
+
+NZMG E, N:         2486533.395      6077263.661     metres
+NZGD49 long, lat:      172.723106       -40.512409  degrees
+
+NZMG E, N:         2216746.425      5388508.765     metres
+NZGD49 long, lat:      169.172062       -46.651295  degrees
+
+Note that these test vectors convert from NZMG metres to lat/long referenced
+to NZGD49, not the more usual WGS84. The difference is about 70m N/S and about
+10m E/W.
+
+These test vectors are provided in reference [1]. Many more test
+vectors are available in
+   http://www.linz.govt.nz/docs/topography/topographicdata/placenamesdatabase/nznamesmar08.zip
+which is a catalog of names on the 260-series maps.
+
+
+EPSG CODES
+
+NZMG     EPSG:27200
+NZGD49   EPSG:4272
+
+http://spatialreference.org/ defines these as
+  Proj4js.defs["EPSG:4272"] = "+proj=longlat +ellps=intl +datum=nzgd49 +no_defs ";
+  Proj4js.defs["EPSG:27200"] = "+proj=nzmg +lat_0=-41 +lon_0=173 +x_0=2510000 +y_0=6023150 +ellps=intl +datum=nzgd49 +units=m +no_defs ";
+
+
+LICENSE
+  Copyright: Stephen Irons 2008
+  Released under terms of the LGPL as per: http://www.gnu.org/copyleft/lesser.html
+
+*******************************************************************************/
+
+
+/**
+  Initialize New Zealand Map Grip projection
+*/
+
+Proj4js.Proj.nzmg = {
+
+  /**
+   * iterations: Number of iterations to refine inverse transform.
+   *     0 -> km accuracy
+   *     1 -> m accuracy -- suitable for most mapping applications
+   *     2 -> mm accuracy
+   */
+  iterations: 1,
+
+  init : function() {
+    this.A = new Array();
+    this.A[1]  = +0.6399175073;
+    this.A[2]  = -0.1358797613;
+    this.A[3]  = +0.063294409;
+    this.A[4]  = -0.02526853;
+    this.A[5]  = +0.0117879;
+    this.A[6]  = -0.0055161;
+    this.A[7]  = +0.0026906;
+    this.A[8]  = -0.001333;
+    this.A[9]  = +0.00067;
+    this.A[10] = -0.00034;
+
+    this.B_re = new Array();        this.B_im = new Array();
+    this.B_re[1] = +0.7557853228;   this.B_im[1] =  0.0;
+    this.B_re[2] = +0.249204646;    this.B_im[2] = +0.003371507;
+    this.B_re[3] = -0.001541739;    this.B_im[3] = +0.041058560;
+    this.B_re[4] = -0.10162907;     this.B_im[4] = +0.01727609;
+    this.B_re[5] = -0.26623489;     this.B_im[5] = -0.36249218;
+    this.B_re[6] = -0.6870983;      this.B_im[6] = -1.1651967;
+
+    this.C_re = new Array();        this.C_im = new Array();
+    this.C_re[1] = +1.3231270439;   this.C_im[1] =  0.0;
+    this.C_re[2] = -0.577245789;    this.C_im[2] = -0.007809598;
+    this.C_re[3] = +0.508307513;    this.C_im[3] = -0.112208952;
+    this.C_re[4] = -0.15094762;     this.C_im[4] = +0.18200602;
+    this.C_re[5] = +1.01418179;     this.C_im[5] = +1.64497696;
+    this.C_re[6] = +1.9660549;      this.C_im[6] = +2.5127645;
+
+    this.D = new Array();
+    this.D[1] = +1.5627014243;
+    this.D[2] = +0.5185406398;
+    this.D[3] = -0.03333098;
+    this.D[4] = -0.1052906;
+    this.D[5] = -0.0368594;
+    this.D[6] = +0.007317;
+    this.D[7] = +0.01220;
+    this.D[8] = +0.00394;
+    this.D[9] = -0.0013;
+  },
+
+  /**
+    New Zealand Map Grid Forward  - long/lat to x/y
+    long/lat in radians
+  */
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    var delta_lat = lat - this.lat0;
+    var delta_lon = lon - this.long0;
+
+    // 1. Calculate d_phi and d_psi    ...                          // and d_lambda
+    // For this algorithm, delta_latitude is in seconds of arc x 10-5, so we need to scale to those units. Longitude is radians.
+    var d_phi = delta_lat / Proj4js.common.SEC_TO_RAD * 1E-5;       var d_lambda = delta_lon;
+    var d_phi_n = 1;  // d_phi^0
+
+    var d_psi = 0;
+    for (n = 1; n <= 10; n++) {
+      d_phi_n = d_phi_n * d_phi;
+      d_psi = d_psi + this.A[n] * d_phi_n;
+    }
+
+    // 2. Calculate theta
+    var th_re = d_psi;                                              var th_im = d_lambda;
+
+    // 3. Calculate z
+    var th_n_re = 1;                                                var th_n_im = 0;  // theta^0
+    var th_n_re1;                                                   var th_n_im1;
+
+    var z_re = 0;                                                   var z_im = 0;
+    for (n = 1; n <= 6; n++) {
+      th_n_re1 = th_n_re*th_re - th_n_im*th_im;                     th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+      th_n_re = th_n_re1;                                           th_n_im = th_n_im1;
+      z_re = z_re + this.B_re[n]*th_n_re - this.B_im[n]*th_n_im;    z_im = z_im + this.B_im[n]*th_n_re + this.B_re[n]*th_n_im;
+    }
+
+    // 4. Calculate easting and northing
+    x = (z_im * this.a) + this.x0;
+    y = (z_re * this.a) + this.y0;
+
+    p.x = x; p.y = y;
+
+    return p;
+  },
+
+
+  /**
+    New Zealand Map Grid Inverse  -  x/y to long/lat
+  */
+  inverse : function(p) {
+
+    var x = p.x;
+    var y = p.y;
+
+    var delta_x = x - this.x0;
+    var delta_y = y - this.y0;
+
+    // 1. Calculate z
+    var z_re = delta_y / this.a;                                              var z_im = delta_x / this.a;
+
+    // 2a. Calculate theta - first approximation gives km accuracy
+    var z_n_re = 1;                                                           var z_n_im = 0;  // z^0
+    var z_n_re1;                                                              var z_n_im1;
+
+    var th_re = 0;                                                            var th_im = 0;
+    for (n = 1; n <= 6; n++) {
+      z_n_re1 = z_n_re*z_re - z_n_im*z_im;                                    z_n_im1 = z_n_im*z_re + z_n_re*z_im;
+      z_n_re = z_n_re1;                                                       z_n_im = z_n_im1;
+      th_re = th_re + this.C_re[n]*z_n_re - this.C_im[n]*z_n_im;              th_im = th_im + this.C_im[n]*z_n_re + this.C_re[n]*z_n_im;
+    }
+
+    // 2b. Iterate to refine the accuracy of the calculation
+    //        0 iterations gives km accuracy
+    //        1 iteration gives m accuracy -- good enough for most mapping applications
+    //        2 iterations bives mm accuracy
+    for (i = 0; i < this.iterations; i++) {
+       var th_n_re = th_re;                                                      var th_n_im = th_im;
+       var th_n_re1;                                                             var th_n_im1;
+
+       var num_re = z_re;                                                        var num_im = z_im;
+       for (n = 2; n <= 6; n++) {
+         th_n_re1 = th_n_re*th_re - th_n_im*th_im;                               th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+         th_n_re = th_n_re1;                                                     th_n_im = th_n_im1;
+         num_re = num_re + (n-1)*(this.B_re[n]*th_n_re - this.B_im[n]*th_n_im);  num_im = num_im + (n-1)*(this.B_im[n]*th_n_re + this.B_re[n]*th_n_im);
+       }
+
+       th_n_re = 1;                                                              th_n_im = 0;
+       var den_re = this.B_re[1];                                                var den_im = this.B_im[1];
+       for (n = 2; n <= 6; n++) {
+         th_n_re1 = th_n_re*th_re - th_n_im*th_im;                               th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+         th_n_re = th_n_re1;                                                     th_n_im = th_n_im1;
+         den_re = den_re + n * (this.B_re[n]*th_n_re - this.B_im[n]*th_n_im);    den_im = den_im + n * (this.B_im[n]*th_n_re + this.B_re[n]*th_n_im);
+       }
+
+       // Complex division
+       var den2 = den_re*den_re + den_im*den_im;
+       th_re = (num_re*den_re + num_im*den_im) / den2;                           th_im = (num_im*den_re - num_re*den_im) / den2;
+    }
+
+    // 3. Calculate d_phi              ...                                    // and d_lambda
+    var d_psi = th_re;                                                        var d_lambda = th_im;
+    var d_psi_n = 1;  // d_psi^0
+
+    var d_phi = 0;
+    for (n = 1; n <= 9; n++) {
+       d_psi_n = d_psi_n * d_psi;
+       d_phi = d_phi + this.D[n] * d_psi_n;
+    }
+
+    // 4. Calculate latitude and longitude
+    // d_phi is calcuated in second of arc * 10^-5, so we need to scale back to radians. d_lambda is in radians.
+    var lat = this.lat0 + (d_phi * Proj4js.common.SEC_TO_RAD * 1E5);
+    var lon = this.long0 +  d_lambda;
+
+    p.x = lon;
+    p.y = lat;
+
+    return p;
+  }
+};
+/* ======================================================================
+    projCode/mill.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                    MILLER CYLINDRICAL 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Miller Cylindrical projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+T. Mittan		March, 1993
+
+This function was adapted from the Lambert Azimuthal Equal Area projection
+code (FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.mill = {
+
+/* Initialize the Miller Cylindrical projection
+  -------------------------------------------*/
+  init: function() {
+    //no-op
+  },
+
+
+  /* Miller Cylindrical forward equations--mapping lat,long to x,y
+    ------------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    var dlon = Proj4js.common.adjust_lon(lon -this.long0);
+    var x = this.x0 + this.a * dlon;
+    var y = this.y0 + this.a * Math.log(Math.tan((Proj4js.common.PI / 4.0) + (lat / 2.5))) * 1.25;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },//millFwd()
+
+  /* Miller Cylindrical inverse equations--mapping x,y to lat/long
+    ------------------------------------------------------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var lon = Proj4js.common.adjust_lon(this.long0 + p.x /this.a);
+    var lat = 2.5 * (Math.atan(Math.exp(0.8*p.y/this.a)) - Proj4js.common.PI / 4.0);
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }//millInv()
+};
+/* ======================================================================
+    projCode/gnom.js
+   ====================================================================== */
+
+/*****************************************************************************
+NAME                             GNOMONIC
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Gnomonic Projection.
+                Implementation based on the existing sterea and ortho
+                implementations.
+
+PROGRAMMER              DATE
+----------              ----
+Richard Marsden         November 2009
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Flattening the Earth - Two Thousand Years of Map 
+    Projections", University of Chicago Press 1993
+
+2.  Wolfram Mathworld "Gnomonic Projection"
+    http://mathworld.wolfram.com/GnomonicProjection.html
+    Accessed: 12th November 2009
+******************************************************************************/
+
+Proj4js.Proj.gnom = {
+
+  /* Initialize the Gnomonic projection
+    -------------------------------------*/
+  init: function(def) {
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+    this.sin_p14=Math.sin(this.lat0);
+    this.cos_p14=Math.cos(this.lat0);
+    // Approximation for projecting points to the horizon (infinity)
+    this.infinity_dist = 1000 * this.a;
+    this.rc = 1;
+  },
+
+
+  /* Gnomonic forward equations--mapping lat,long to x,y
+    ---------------------------------------------------*/
+  forward: function(p) {
+    var sinphi, cosphi;	/* sin and cos value				*/
+    var dlon;		/* delta longitude value			*/
+    var coslon;		/* cos of longitude				*/
+    var ksp;		/* scale factor					*/
+    var g;		
+    var lon=p.x;
+    var lat=p.y;	
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon - this.long0);
+
+    sinphi=Math.sin(lat);
+    cosphi=Math.cos(lat);	
+
+    coslon = Math.cos(dlon);
+    g = this.sin_p14 * sinphi + this.cos_p14 * cosphi * coslon;
+    ksp = 1.0;
+    if ((g > 0) || (Math.abs(g) <= Proj4js.common.EPSLN)) {
+      x = this.x0 + this.a * ksp * cosphi * Math.sin(dlon) / g;
+      y = this.y0 + this.a * ksp * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon) / g;
+    } else {
+      Proj4js.reportError("orthoFwdPointError");
+
+      // Point is in the opposing hemisphere and is unprojectable
+      // We still need to return a reasonable point, so we project 
+      // to infinity, on a bearing 
+      // equivalent to the northern hemisphere equivalent
+      // This is a reasonable approximation for short shapes and lines that 
+      // straddle the horizon.
+
+      x = this.x0 + this.infinity_dist * cosphi * Math.sin(dlon);
+      y = this.y0 + this.infinity_dist * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon);
+
+    }
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh;		/* Rho */
+    var z;		/* angle */
+    var sinc, cosc;
+    var c;
+    var lon , lat;
+
+    /* Inverse equations
+      -----------------*/
+    p.x = (p.x - this.x0) / this.a;
+    p.y = (p.y - this.y0) / this.a;
+
+    p.x /= this.k0;
+    p.y /= this.k0;
+
+    if ( (rh = Math.sqrt(p.x * p.x + p.y * p.y)) ) {
+      c = Math.atan2(rh, this.rc);
+      sinc = Math.sin(c);
+      cosc = Math.cos(c);
+
+      lat = Proj4js.common.asinz(cosc*this.sin_p14 + (p.y*sinc*this.cos_p14) / rh);
+      lon = Math.atan2(p.x*sinc, rh*this.cos_p14*cosc - p.y*this.sin_p14*sinc);
+      lon = Proj4js.common.adjust_lon(this.long0+lon);
+    } else {
+      lat = this.phic0;
+      lon = 0.0;
+    }
+ 
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
+
+/* ======================================================================
+    projCode/sinu.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                  		SINUSOIDAL
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Sinusoidal projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+D. Steinwand, EROS      May, 1991     
+
+This function was adapted from the Sinusoidal projection code (FORTRAN) in the 
+General Cartographic Transformation Package software which is available from 
+the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.sinu = {
+
+	/* Initialize the Sinusoidal projection
+	  ------------------------------------*/
+	init: function() {
+		/* Place parameters in static storage for common use
+		  -------------------------------------------------*/
+		this.R = 6370997.0; //Radius of earth
+	},
+
+	/* Sinusoidal forward equations--mapping lat,long to x,y
+	-----------------------------------------------------*/
+	forward: function(p) {
+		var x,y,delta_lon;	
+		var lon=p.x;
+		var lat=p.y;	
+		/* Forward equations
+		-----------------*/
+		delta_lon = Proj4js.common.adjust_lon(lon - this.long0);
+		x = this.R * delta_lon * Math.cos(lat) + this.x0;
+		y = this.R * lat + this.y0;
+
+		p.x=x;
+		p.y=y;	
+		return p;
+	},
+
+	inverse: function(p) {
+		var lat,temp,lon;	
+
+		/* Inverse equations
+		  -----------------*/
+		p.x -= this.x0;
+		p.y -= this.y0;
+		lat = p.y / this.R;
+		if (Math.abs(lat) > Proj4js.common.HALF_PI) {
+		    Proj4js.reportError("sinu:Inv:DataError");
+		}
+		temp = Math.abs(lat) - Proj4js.common.HALF_PI;
+		if (Math.abs(temp) > Proj4js.common.EPSLN) {
+			temp = this.long0+ p.x / (this.R *Math.cos(lat));
+			lon = Proj4js.common.adjust_lon(temp);
+		} else {
+			lon = this.long0;
+		}
+		  
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
+
+
+/* ======================================================================
+    projCode/vandg.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                    VAN DER GRINTEN 
+
+PURPOSE:	Transforms input Easting and Northing to longitude and
+		latitude for the Van der Grinten projection.  The
+		Easting and Northing must be in meters.  The longitude
+		and latitude values will be returned in radians.
+
+PROGRAMMER              DATE            
+----------              ----           
+T. Mittan		March, 1993
+
+This function was adapted from the Van Der Grinten projection code
+(FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.vandg = {
+
+/* Initialize the Van Der Grinten projection
+  ----------------------------------------*/
+	init: function() {
+		this.R = 6370997.0; //Radius of earth
+	},
+
+	forward: function(p) {
+
+		var lon=p.x;
+		var lat=p.y;	
+
+		/* Forward equations
+		-----------------*/
+		var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+		var x,y;
+
+		if (Math.abs(lat) <= Proj4js.common.EPSLN) {
+			x = this.x0  + this.R * dlon;
+			y = this.y0;
+		}
+		var theta = Proj4js.common.asinz(2.0 * Math.abs(lat / Proj4js.common.PI));
+		if ((Math.abs(dlon) <= Proj4js.common.EPSLN) || (Math.abs(Math.abs(lat) - Proj4js.common.HALF_PI) <= Proj4js.common.EPSLN)) {
+			x = this.x0;
+			if (lat >= 0) {
+				y = this.y0 + Proj4js.common.PI * this.R * Math.tan(.5 * theta);
+			} else {
+				y = this.y0 + Proj4js.common.PI * this.R * - Math.tan(.5 * theta);
+			}
+			//  return(OK);
+		}
+		var al = .5 * Math.abs((Proj4js.common.PI / dlon) - (dlon / Proj4js.common.PI));
+		var asq = al * al;
+		var sinth = Math.sin(theta);
+		var costh = Math.cos(theta);
+
+		var g = costh / (sinth + costh - 1.0);
+		var gsq = g * g;
+		var m = g * (2.0 / sinth - 1.0);
+		var msq = m * m;
+		var con = Proj4js.common.PI * this.R * (al * (g - msq) + Math.sqrt(asq * (g - msq) * (g - msq) - (msq + asq) * (gsq - msq))) / (msq + asq);
+		if (dlon < 0) {
+		 con = -con;
+		}
+		x = this.x0 + con;
+		con = Math.abs(con / (Proj4js.common.PI * this.R));
+		if (lat >= 0) {
+		 y = this.y0 + Proj4js.common.PI * this.R * Math.sqrt(1.0 - con * con - 2.0 * al * con);
+		} else {
+		 y = this.y0 - Proj4js.common.PI * this.R * Math.sqrt(1.0 - con * con - 2.0 * al * con);
+		}
+		p.x = x;
+		p.y = y;
+		return p;
+	},
+
+/* Van Der Grinten inverse equations--mapping x,y to lat/long
+  ---------------------------------------------------------*/
+	inverse: function(p) {
+		var dlon;
+		var xx,yy,xys,c1,c2,c3;
+		var al,asq;
+		var a1;
+		var m1;
+		var con;
+		var th1;
+		var d;
+
+		/* inverse equations
+		-----------------*/
+		p.x -= this.x0;
+		p.y -= this.y0;
+		con = Proj4js.common.PI * this.R;
+		xx = p.x / con;
+		yy =p.y / con;
+		xys = xx * xx + yy * yy;
+		c1 = -Math.abs(yy) * (1.0 + xys);
+		c2 = c1 - 2.0 * yy * yy + xx * xx;
+		c3 = -2.0 * c1 + 1.0 + 2.0 * yy * yy + xys * xys;
+		d = yy * yy / c3 + (2.0 * c2 * c2 * c2 / c3 / c3 / c3 - 9.0 * c1 * c2 / c3 /c3) / 27.0;
+		a1 = (c1 - c2 * c2 / 3.0 / c3) / c3;
+		m1 = 2.0 * Math.sqrt( -a1 / 3.0);
+		con = ((3.0 * d) / a1) / m1;
+		if (Math.abs(con) > 1.0) {
+			if (con >= 0.0) {
+				con = 1.0;
+			} else {
+				con = -1.0;
+			}
+		}
+		th1 = Math.acos(con) / 3.0;
+		if (p.y >= 0) {
+			lat = (-m1 *Math.cos(th1 + Proj4js.common.PI / 3.0) - c2 / 3.0 / c3) * Proj4js.common.PI;
+		} else {
+			lat = -(-m1 * Math.cos(th1 + Proj4js.common.PI / 3.0) - c2 / 3.0 / c3) * Proj4js.common.PI;
+		}
+
+		if (Math.abs(xx) < Proj4js.common.EPSLN) {
+			lon = this.long0;
+		}
+		lon = Proj4js.common.adjust_lon(this.long0 + Proj4js.common.PI * (xys - 1.0 + Math.sqrt(1.0 + 2.0 * (xx * xx - yy * yy) + xys * xys)) / 2.0 / xx);
+
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
+/* ======================================================================
+    projCode/cea.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                    LAMBERT CYLINDRICAL EQUAL AREA
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Cylindrical Equal Area projection.
+                This class of projection includes the Behrmann and 
+                Gall-Peters Projections.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----
+R. Marsden              August 2009
+Winwaed Software Tech LLC, http://www.winwaed.com
+
+This function was adapted from the Miller Cylindrical Projection in the Proj4JS
+library.
+
+Note: This implementation assumes a Spherical Earth. The (commented) code 
+has been included for the ellipsoidal forward transform, but derivation of 
+the ellispoidal inverse transform is beyond me. Note that most of the 
+Proj4JS implementations do NOT currently support ellipsoidal figures. 
+Therefore this is not seen as a problem - especially this lack of support 
+is explicitly stated here.
+ 
+ALGORITHM REFERENCES
+
+1.  "Cartographic Projection Procedures for the UNIX Environment - 
+     A User's Manual" by Gerald I. Evenden, USGS Open File Report 90-284
+    and Release 4 Interim Reports (2003)
+
+2.  Snyder, John P., "Flattening the Earth - Two Thousand Years of Map 
+    Projections", Univ. Chicago Press, 1993
+*******************************************************************************/
+
+Proj4js.Proj.cea = {
+
+/* Initialize the Cylindrical Equal Area projection
+  -------------------------------------------*/
+  init: function() {
+    //no-op
+  },
+
+
+  /* Cylindrical Equal Area forward equations--mapping lat,long to x,y
+    ------------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon -this.long0);
+    var x = this.x0 + this.a * dlon * Math.cos(this.lat_ts);
+    var y = this.y0 + this.a * Math.sin(lat) / Math.cos(this.lat_ts);
+   /* Elliptical Forward Transform
+      Not implemented due to a lack of a matchign inverse function
+    {
+      var Sin_Lat = Math.sin(lat);
+      var Rn = this.a * (Math.sqrt(1.0e0 - this.es * Sin_Lat * Sin_Lat ));
+      x = this.x0 + this.a * dlon * Math.cos(this.lat_ts);
+      y = this.y0 + Rn * Math.sin(lat) / Math.cos(this.lat_ts);
+    }
+   */
+
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },//ceaFwd()
+
+  /* Cylindrical Equal Area inverse equations--mapping x,y to lat/long
+    ------------------------------------------------------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var lon = Proj4js.common.adjust_lon( this.long0 + (p.x / this.a) / Math.cos(this.lat_ts) );
+
+    var lat = Math.asin( (p.y/this.a) * Math.cos(this.lat_ts) );
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }//ceaInv()
+};
+/* ======================================================================
+    projCode/eqc.js
+   ====================================================================== */
+
+/* similar to equi.js FIXME proj4 uses eqc */
+Proj4js.Proj.eqc = {
+  init : function() {
+
+      if(!this.x0) this.x0=0;
+      if(!this.y0) this.y0=0;
+      if(!this.lat0) this.lat0=0;
+      if(!this.long0) this.long0=0;
+      if(!this.lat_ts) this.lat_ts=0;
+      if (!this.title) this.title = "Equidistant Cylindrical (Plate Carre)";
+
+      this.rc= Math.cos(this.lat_ts);
+    },
+
+
+    // forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon= p.x;
+      var lat= p.y;
+
+      var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+      var dlat = Proj4js.common.adjust_lat(lat - this.lat0 );
+      p.x= this.x0 + (this.a*dlon*this.rc);
+      p.y= this.y0 + (this.a*dlat        );
+      return p;
+    },
+
+  // inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var x= p.x;
+    var y= p.y;
+
+    p.x= Proj4js.common.adjust_lon(this.long0 + ((x - this.x0)/(this.a*this.rc)));
+    p.y= Proj4js.common.adjust_lat(this.lat0  + ((y - this.y0)/(this.a        )));
+    return p;
+  }
+
+};
+/* ======================================================================
+    projCode/cass.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            CASSINI
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Cassini projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+    Ported from PROJ.4.
+
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+*******************************************************************************/
+
+
+//Proj4js.defs["EPSG:28191"] = "+proj=cass +lat_0=31.73409694444445 +lon_0=35.21208055555556 +x_0=170251.555 +y_0=126867.909 +a=6378300.789 +b=6356566.435 +towgs84=-275.722,94.7824,340.894,-8.001,-4.42,-11.821,1 +units=m +no_defs";
+
+// Initialize the Cassini projection
+// -----------------------------------------------------------------
+
+Proj4js.Proj.cass = {
+  init : function() {
+    if (!this.sphere) {
+      this.en = this.pj_enfn(this.es)
+      this.m0 = this.pj_mlfn(this.lat0, Math.sin(this.lat0), Math.cos(this.lat0), this.en);
+    }
+  },
+
+  C1:	.16666666666666666666,
+  C2:	.00833333333333333333,
+  C3:	.04166666666666666666,
+  C4:	.33333333333333333333,
+  C5:	.06666666666666666666,
+
+
+/* Cassini forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var x,y;
+    var lam=p.x;
+    var phi=p.y;
+    lam = Proj4js.common.adjust_lon(lam - this.long0);
+    
+    if (this.sphere) {
+      x = Math.asin(Math.cos(phi) * Math.sin(lam));
+      y = Math.atan2(Math.tan(phi) , Math.cos(lam)) - this.phi0;
+    } else {
+        //ellipsoid
+      this.n = Math.sin(phi);
+      this.c = Math.cos(phi);
+      y = this.pj_mlfn(phi, this.n, this.c, this.en);
+      this.n = 1./Math.sqrt(1. - this.es * this.n * this.n);
+      this.tn = Math.tan(phi); 
+      this.t = this.tn * this.tn;
+      this.a1 = lam * this.c;
+      this.c *= this.es * this.c / (1 - this.es);
+      this.a2 = this.a1 * this.a1;
+      x = this.n * this.a1 * (1. - this.a2 * this.t * (this.C1 - (8. - this.t + 8. * this.c) * this.a2 * this.C2));
+      y -= this.m0 - this.n * this.tn * this.a2 * (.5 + (5. - this.t + 6. * this.c) * this.a2 * this.C3);
+    }
+    
+    p.x = this.a*x + this.x0;
+    p.y = this.a*y + this.y0;
+    return p;
+  },//cassFwd()
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var x = p.x/this.a;
+    var y = p.y/this.a;
+    
+    if (this.sphere) {
+      this.dd = y + this.lat0;
+      phi = Math.asin(Math.sin(this.dd) * Math.cos(x));
+      lam = Math.atan2(Math.tan(x), Math.cos(this.dd));
+    } else {
+      /* ellipsoid */
+      ph1 = this.pj_inv_mlfn(this.m0 + y, this.es, this.en);
+      this.tn = Math.tan(ph1); 
+      this.t = this.tn * this.tn;
+      this.n = Math.sin(ph1);
+      this.r = 1. / (1. - this.es * this.n * this.n);
+      this.n = Math.sqrt(this.r);
+      this.r *= (1. - this.es) * this.n;
+      this.dd = x / this.n;
+      this.d2 = this.dd * this.dd;
+      phi = ph1 - (this.n * this.tn / this.r) * this.d2 * (.5 - (1. + 3. * this.t) * this.d2 * this.C3);
+      lam = this.dd * (1. + this.t * this.d2 * (-this.C4 + (1. + 3. * this.t) * this.d2 * this.C5)) / Math.cos(ph1);
+    }
+    p.x = Proj4js.common.adjust_lon(this.long0+lam);
+    p.y = phi;
+    return p;
+  },//lamazInv()
+
+
+  //code from the PROJ.4 pj_mlfn.c file;  this may be useful for other projections
+  pj_enfn: function(es) {
+    en = new Array();
+    en[0] = this.C00 - es * (this.C02 + es * (this.C04 + es * (this.C06 + es * this.C08)));
+    en[1] = es * (this.C22 - es * (this.C04 + es * (this.C06 + es * this.C08)));
+    var t = es * es;
+    en[2] = t * (this.C44 - es * (this.C46 + es * this.C48));
+    t *= es;
+    en[3] = t * (this.C66 - es * this.C68);
+    en[4] = t * es * this.C88;
+    return en;
+  },
+  
+  pj_mlfn: function(phi, sphi, cphi, en) {
+    cphi *= sphi;
+    sphi *= sphi;
+    return(en[0] * phi - cphi * (en[1] + sphi*(en[2]+ sphi*(en[3] + sphi*en[4]))));
+  },
+  
+  pj_inv_mlfn: function(arg, es, en) {
+    k = 1./(1.-es);
+    phi = arg;
+    for (i = Proj4js.common.MAX_ITER; i ; --i) { /* rarely goes over 2 iterations */
+      s = Math.sin(phi);
+      t = 1. - es * s * s;
+      //t = this.pj_mlfn(phi, s, Math.cos(phi), en) - arg;
+      //phi -= t * (t * Math.sqrt(t)) * k;
+      t = (this.pj_mlfn(phi, s, Math.cos(phi), en) - arg) * (t * Math.sqrt(t)) * k;
+      phi -= t;
+      if (Math.abs(t) < Proj4js.common.EPSLN)
+        return phi;
+    }
+    Proj4js.reportError("cass:pj_inv_mlfn: Convergence error");
+    return phi;
+  },
+
+/* meridinal distance for ellipsoid and inverse
+**	8th degree - accurate to < 1e-5 meters when used in conjuction
+**		with typical major axis values.
+**	Inverse determines phi to EPS (1e-11) radians, about 1e-6 seconds.
+*/
+  C00: 1.0,
+  C02: .25,
+  C04: .046875,
+  C06: .01953125,
+  C08: .01068115234375,
+  C22: .75,
+  C44: .46875,
+  C46: .01302083333333333333,
+  C48: .00712076822916666666,
+  C66: .36458333333333333333,
+  C68: .00569661458333333333,
+  C88: .3076171875
+
+}
+/* ======================================================================
+    projCode/gauss.js
+   ====================================================================== */
+
+
+Proj4js.Proj.gauss = {
+
+  init : function() {
+    sphi = Math.sin(this.lat0);
+    cphi = Math.cos(this.lat0);  
+    cphi *= cphi;
+    this.rc = Math.sqrt(1.0 - this.es) / (1.0 - this.es * sphi * sphi);
+    this.C = Math.sqrt(1.0 + this.es * cphi * cphi / (1.0 - this.es));
+    this.phic0 = Math.asin(sphi / this.C);
+    this.ratexp = 0.5 * this.C * this.e;
+    this.K = Math.tan(0.5 * this.phic0 + Proj4js.common.FORTPI) / (Math.pow(Math.tan(0.5*this.lat0 + Proj4js.common.FORTPI), this.C) * Proj4js.common.srat(this.e*sphi, this.ratexp));
+  },
+
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    p.y = 2.0 * Math.atan( this.K * Math.pow(Math.tan(0.5 * lat + Proj4js.common.FORTPI), this.C) * Proj4js.common.srat(this.e * Math.sin(lat), this.ratexp) ) - Proj4js.common.HALF_PI;
+    p.x = this.C * lon;
+    return p;
+  },
+
+  inverse : function(p) {
+    var DEL_TOL = 1e-14;
+    var lon = p.x / this.C;
+    var lat = p.y;
+    num = Math.pow(Math.tan(0.5 * lat + Proj4js.common.FORTPI)/this.K, 1./this.C);
+    for (var i = Proj4js.common.MAX_ITER; i>0; --i) {
+      lat = 2.0 * Math.atan(num * Proj4js.common.srat(this.e * Math.sin(p.y), -0.5 * this.e)) - Proj4js.common.HALF_PI;
+      if (Math.abs(lat - p.y) < DEL_TOL) break;
+      p.y = lat;
+    }	
+    /* convergence failed */
+    if (!i) {
+      Proj4js.reportError("gauss:inverse:convergence failed");
+      return null;
+    }
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
+/* ======================================================================
+    projCode/omerc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                       OBLIQUE MERCATOR (HOTINE) 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Oblique Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.omerc = {
+
+  /* Initialize the Oblique Mercator  projection
+    ------------------------------------------*/
+  init: function() {
+    if (!this.mode) this.mode=0;
+    if (!this.lon1)   {this.lon1=0;this.mode=1;}
+    if (!this.lon2)   this.lon2=0;
+    if (!this.lat2)    this.lat2=0;
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+    var temp = this.b/ this.a;
+    var es = 1.0 - Math.pow(temp,2);
+    var e = Math.sqrt(es);
+
+    this.sin_p20=Math.sin(this.lat0);
+    this.cos_p20=Math.cos(this.lat0);
+
+    this.con = 1.0 - this.es * this.sin_p20 * this.sin_p20;
+    this.com = Math.sqrt(1.0 - es);
+    this.bl = Math.sqrt(1.0 + this.es * Math.pow(this.cos_p20,4.0)/(1.0 - es));
+    this.al = this.a * this.bl * this.k0 * this.com / this.con;
+    if (Math.abs(this.lat0) < Proj4js.common.EPSLN) {
+       this.ts = 1.0;
+       this.d = 1.0;
+       this.el = 1.0;
+    } else {
+       this.ts = Proj4js.common.tsfnz(this.e,this.lat0,this.sin_p20);
+       this.con = Math.sqrt(this.con);
+       this.d = this.bl * this.com / (this.cos_p20 * this.con);
+       if ((this.d * this.d - 1.0) > 0.0) {
+          if (this.lat0 >= 0.0) {
+             this.f = this.d + Math.sqrt(this.d * this.d - 1.0);
+          } else {
+             this.f = this.d - Math.sqrt(this.d * this.d - 1.0);
+          }
+       } else {
+         this.f = this.d;
+       }
+       this.el = this.f * Math.pow(this.ts,this.bl);
+    }
+
+    //this.longc=52.60353916666667;
+
+    if (this.mode != 0) {
+       this.g = .5 * (this.f - 1.0/this.f);
+       this.gama = Proj4js.common.asinz(Math.sin(this.alpha) / this.d);
+       this.longc= this.longc - Proj4js.common.asinz(this.g * Math.tan(this.gama))/this.bl;
+
+       /* Report parameters common to format B
+       -------------------------------------*/
+       //genrpt(azimuth * R2D,"Azimuth of Central Line:    ");
+       //cenlon(lon_origin);
+      // cenlat(lat_origin);
+
+       this.con = Math.abs(this.lat0);
+       if ((this.con > Proj4js.common.EPSLN) && (Math.abs(this.con - Proj4js.common.HALF_PI) > Proj4js.common.EPSLN)) {
+            this.singam=Math.sin(this.gama);
+            this.cosgam=Math.cos(this.gama);
+
+            this.sinaz=Math.sin(this.alpha);
+            this.cosaz=Math.cos(this.alpha);
+
+            if (this.lat0>= 0) {
+               this.u =  (this.al / this.bl) * Math.atan(Math.sqrt(this.d*this.d - 1.0)/this.cosaz);
+            } else {
+               this.u =  -(this.al / this.bl) *Math.atan(Math.sqrt(this.d*this.d - 1.0)/this.cosaz);
+            }
+          } else {
+            Proj4js.reportError("omerc:Init:DataError");
+          }
+       } else {
+       this.sinphi =Math. sin(this.at1);
+       this.ts1 = Proj4js.common.tsfnz(this.e,this.lat1,this.sinphi);
+       this.sinphi = Math.sin(this.lat2);
+       this.ts2 = Proj4js.common.tsfnz(this.e,this.lat2,this.sinphi);
+       this.h = Math.pow(this.ts1,this.bl);
+       this.l = Math.pow(this.ts2,this.bl);
+       this.f = this.el/this.h;
+       this.g = .5 * (this.f - 1.0/this.f);
+       this.j = (this.el * this.el - this.l * this.h)/(this.el * this.el + this.l * this.h);
+       this.p = (this.l - this.h) / (this.l + this.h);
+       this.dlon = this.lon1 - this.lon2;
+       if (this.dlon < -Proj4js.common.PI) this.lon2 = this.lon2 - 2.0 * Proj4js.common.PI;
+       if (this.dlon > Proj4js.common.PI) this.lon2 = this.lon2 + 2.0 * Proj4js.common.PI;
+       this.dlon = this.lon1 - this.lon2;
+       this.longc = .5 * (this.lon1 + this.lon2) -Math.atan(this.j * Math.tan(.5 * this.bl * this.dlon)/this.p)/this.bl;
+       this.dlon  = Proj4js.common.adjust_lon(this.lon1 - this.longc);
+       this.gama = Math.atan(Math.sin(this.bl * this.dlon)/this.g);
+       this.alpha = Proj4js.common.asinz(this.d * Math.sin(this.gama));
+
+       /* Report parameters common to format A
+       -------------------------------------*/
+
+       if (Math.abs(this.lat1 - this.lat2) <= Proj4js.common.EPSLN) {
+          Proj4js.reportError("omercInitDataError");
+          //return(202);
+       } else {
+          this.con = Math.abs(this.lat1);
+       }
+       if ((this.con <= Proj4js.common.EPSLN) || (Math.abs(this.con - HALF_PI) <= Proj4js.common.EPSLN)) {
+           Proj4js.reportError("omercInitDataError");
+                //return(202);
+       } else {
+         if (Math.abs(Math.abs(this.lat0) - Proj4js.common.HALF_PI) <= Proj4js.common.EPSLN) {
+            Proj4js.reportError("omercInitDataError");
+            //return(202);
+         }
+       }
+
+       this.singam=Math.sin(this.gam);
+       this.cosgam=Math.cos(this.gam);
+
+       this.sinaz=Math.sin(this.alpha);
+       this.cosaz=Math.cos(this.alpha);  
+
+
+       if (this.lat0 >= 0) {
+          this.u =  (this.al/this.bl) * Math.atan(Math.sqrt(this.d * this.d - 1.0)/this.cosaz);
+       } else {
+          this.u = -(this.al/this.bl) * Math.atan(Math.sqrt(this.d * this.d - 1.0)/this.cosaz);
+       }
+     }
+  },
+
+
+  /* Oblique Mercator forward equations--mapping lat,long to x,y
+    ----------------------------------------------------------*/
+  forward: function(p) {
+    var theta;		/* angle					*/
+    var sin_phi, cos_phi;/* sin and cos value				*/
+    var b;		/* temporary values				*/
+    var c, t, tq;	/* temporary values				*/
+    var con, n, ml;	/* cone constant, small m			*/
+    var q,us,vl;
+    var ul,vs;
+    var s;
+    var dlon;
+    var ts1;
+
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    sin_phi = Math.sin(lat);
+    dlon = Proj4js.common.adjust_lon(lon - this.longc);
+    vl = Math.sin(this.bl * dlon);
+    if (Math.abs(Math.abs(lat) - Proj4js.common.HALF_PI) > Proj4js.common.EPSLN) {
+       ts1 = Proj4js.common.tsfnz(this.e,lat,sin_phi);
+       q = this.el / (Math.pow(ts1,this.bl));
+       s = .5 * (q - 1.0 / q);
+       t = .5 * (q + 1.0/ q);
+       ul = (s * this.singam - vl * this.cosgam) / t;
+       con = Math.cos(this.bl * dlon);
+       if (Math.abs(con) < .0000001) {
+          us = this.al * this.bl * dlon;
+       } else {
+          us = this.al * Math.atan((s * this.cosgam + vl * this.singam) / con)/this.bl;
+          if (con < 0) us = us + Proj4js.common.PI * this.al / this.bl;
+       }
+    } else {
+       if (lat >= 0) {
+          ul = this.singam;
+       } else {
+          ul = -this.singam;
+       }
+       us = this.al * lat / this.bl;
+    }
+    if (Math.abs(Math.abs(ul) - 1.0) <= Proj4js.common.EPSLN) {
+       //alert("Point projects into infinity","omer-for");
+       Proj4js.reportError("omercFwdInfinity");
+       //return(205);
+    }
+    vs = .5 * this.al * Math.log((1.0 - ul)/(1.0 + ul)) / this.bl;
+    us = us - this.u;
+    var x = this.x0 + vs * this.cosaz + us * this.sinaz;
+    var y = this.y0 + us * this.cosaz - vs * this.sinaz;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+  inverse: function(p) {
+    var delta_lon;	/* Delta longitude (Given longitude - center 	*/
+    var theta;		/* angle					*/
+    var delta_theta;	/* adjusted longitude				*/
+    var sin_phi, cos_phi;/* sin and cos value				*/
+    var b;		/* temporary values				*/
+    var c, t, tq;	/* temporary values				*/
+    var con, n, ml;	/* cone constant, small m			*/
+    var vs,us,q,s,ts1;
+    var vl,ul,bs;
+    var dlon;
+    var  flag;
+
+    /* Inverse equations
+      -----------------*/
+    p.x -= this.x0;
+    p.y -= this.y0;
+    flag = 0;
+    vs = p.x * this.cosaz - p.y * this.sinaz;
+    us = p.y * this.cosaz + p.x * this.sinaz;
+    us = us + this.u;
+    q = Math.exp(-this.bl * vs / this.al);
+    s = .5 * (q - 1.0/q);
+    t = .5 * (q + 1.0/q);
+    vl = Math.sin(this.bl * us / this.al);
+    ul = (vl * this.cosgam + s * this.singam)/t;
+    if (Math.abs(Math.abs(ul) - 1.0) <= Proj4js.common.EPSLN)
+       {
+       lon = this.longc;
+       if (ul >= 0.0) {
+          lat = Proj4js.common.HALF_PI;
+       } else {
+         lat = -Proj4js.common.HALF_PI;
+       }
+    } else {
+       con = 1.0 / this.bl;
+       ts1 =Math.pow((this.el / Math.sqrt((1.0 + ul) / (1.0 - ul))),con);
+       lat = Proj4js.common.phi2z(this.e,ts1);
+       //if (flag != 0)
+          //return(flag);
+       //~ con = Math.cos(this.bl * us /al);
+       theta = this.longc - Math.atan2((s * this.cosgam - vl * this.singam) , con)/this.bl;
+       lon = Proj4js.common.adjust_lon(theta);
+    }
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+/* ======================================================================
+    projCode/lcc.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            LAMBERT CONFORMAL CONIC
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Conformal Conic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+*******************************************************************************/
+
+
+//<2104> +proj=lcc +lat_1=10.16666666666667 +lat_0=10.16666666666667 +lon_0=-71.60561777777777 +k_0=1 +x0=-17044 +x0=-23139.97 +ellps=intl +units=m +no_defs  no_defs
+
+// Initialize the Lambert Conformal conic projection
+// -----------------------------------------------------------------
+
+//Proj4js.Proj.lcc = Class.create();
+Proj4js.Proj.lcc = {
+  init : function() {
+
+    // array of:  r_maj,r_min,lat1,lat2,c_lon,c_lat,false_east,false_north
+    //double c_lat;                   /* center latitude                      */
+    //double c_lon;                   /* center longitude                     */
+    //double lat1;                    /* first standard parallel              */
+    //double lat2;                    /* second standard parallel             */
+    //double r_maj;                   /* major axis                           */
+    //double r_min;                   /* minor axis                           */
+    //double false_east;              /* x offset in meters                   */
+    //double false_north;             /* y offset in meters                   */
+
+      if (!this.lat2){this.lat2=this.lat0;}//if lat2 is not defined
+      if (!this.k0) this.k0 = 1.0;
+
+    // Standard Parallels cannot be equal and on opposite sides of the equator
+      if (Math.abs(this.lat1+this.lat2) < Proj4js.common.EPSLN) {
+        Proj4js.reportError("lcc:init: Equal Latitudes");
+        return;
+      }
+
+      var temp = this.b / this.a;
+      this.e = Math.sqrt(1.0 - temp*temp);
+
+      var sin1 = Math.sin(this.lat1);
+      var cos1 = Math.cos(this.lat1);
+      var ms1 = Proj4js.common.msfnz(this.e, sin1, cos1);
+      var ts1 = Proj4js.common.tsfnz(this.e, this.lat1, sin1);
+
+      var sin2 = Math.sin(this.lat2);
+      var cos2 = Math.cos(this.lat2);
+      var ms2 = Proj4js.common.msfnz(this.e, sin2, cos2);
+      var ts2 = Proj4js.common.tsfnz(this.e, this.lat2, sin2);
+
+      var ts0 = Proj4js.common.tsfnz(this.e, this.lat0, Math.sin(this.lat0));
+
+      if (Math.abs(this.lat1 - this.lat2) > Proj4js.common.EPSLN) {
+        this.ns = Math.log(ms1/ms2)/Math.log(ts1/ts2);
+      } else {
+        this.ns = sin1;
+      }
+      this.f0 = ms1 / (this.ns * Math.pow(ts1, this.ns));
+      this.rh = this.a * this.f0 * Math.pow(ts0, this.ns);
+      if (!this.title) this.title = "Lambert Conformal Conic";
+    },
+
+
+    // Lambert Conformal conic forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon = p.x;
+      var lat = p.y;
+
+    // convert to radians
+      if ( lat <= 90.0 && lat >= -90.0 && lon <= 180.0 && lon >= -180.0) {
+        //lon = lon * Proj4js.common.D2R;
+        //lat = lat * Proj4js.common.D2R;
+      } else {
+        Proj4js.reportError("lcc:forward: llInputOutOfRange: "+ lon +" : " + lat);
+        return null;
+      }
+
+      var con  = Math.abs( Math.abs(lat) - Proj4js.common.HALF_PI);
+      var ts, rh1;
+      if (con > Proj4js.common.EPSLN) {
+        ts = Proj4js.common.tsfnz(this.e, lat, Math.sin(lat) );
+        rh1 = this.a * this.f0 * Math.pow(ts, this.ns);
+      } else {
+        con = lat * this.ns;
+        if (con <= 0) {
+          Proj4js.reportError("lcc:forward: No Projection");
+          return null;
+        }
+        rh1 = 0;
+      }
+      var theta = this.ns * Proj4js.common.adjust_lon(lon - this.long0);
+      p.x = this.k0 * (rh1 * Math.sin(theta)) + this.x0;
+      p.y = this.k0 * (this.rh - rh1 * Math.cos(theta)) + this.y0;
+
+      return p;
+    },
+
+  // Lambert Conformal Conic inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var rh1, con, ts;
+    var lat, lon;
+    var x = (p.x - this.x0)/this.k0;
+    var y = (this.rh - (p.y - this.y0)/this.k0);
+    if (this.ns > 0) {
+      rh1 = Math.sqrt (x * x + y * y);
+      con = 1.0;
+    } else {
+      rh1 = -Math.sqrt (x * x + y * y);
+      con = -1.0;
+    }
+    var theta = 0.0;
+    if (rh1 != 0) {
+      theta = Math.atan2((con * x),(con * y));
+    }
+    if ((rh1 != 0) || (this.ns > 0.0)) {
+      con = 1.0/this.ns;
+      ts = Math.pow((rh1/(this.a * this.f0)), con);
+      lat = Proj4js.common.phi2z(this.e, ts);
+      if (lat == -9999) return null;
+    } else {
+      lat = -Proj4js.common.HALF_PI;
+    }
+    lon = Proj4js.common.adjust_lon(theta/this.ns + this.long0);
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
+
+
+
+/* ======================================================================
+    projCode/laea.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                  LAMBERT AZIMUTHAL EQUAL-AREA
+ 
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Azimuthal Equal-Area projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+D. Steinwand, EROS      March, 1991   
+
+This function was adapted from the Lambert Azimuthal Equal Area projection
+code (FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.laea = {
+  S_POLE: 1,
+  N_POLE: 2,
+  EQUIT: 3,
+  OBLIQ: 4,
+
+
+/* Initialize the Lambert Azimuthal Equal Area projection
+  ------------------------------------------------------*/
+  init: function() {
+    var t = Math.abs(this.lat0);
+    if (Math.abs(t - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+      this.mode = this.lat0 < 0. ? this.S_POLE : this.N_POLE;
+    } else if (Math.abs(t) < Proj4js.common.EPSLN) {
+      this.mode = this.EQUIT;
+    } else {
+      this.mode = this.OBLIQ;
+    }
+    if (this.es > 0) {
+      var sinphi;
+  
+      this.qp = Proj4js.common.qsfnz(this.e, 1.0);
+      this.mmf = .5 / (1. - this.es);
+      this.apa = this.authset(this.es);
+      switch (this.mode) {
+        case this.N_POLE:
+        case this.S_POLE:
+          this.dd = 1.;
+          break;
+        case this.EQUIT:
+          this.rq = Math.sqrt(.5 * this.qp);
+          this.dd = 1. / this.rq;
+          this.xmf = 1.;
+          this.ymf = .5 * this.qp;
+          break;
+        case this.OBLIQ:
+          this.rq = Math.sqrt(.5 * this.qp);
+          sinphi = Math.sin(this.lat0);
+          this.sinb1 = Proj4js.common.qsfnz(this.e, sinphi) / this.qp;
+          this.cosb1 = Math.sqrt(1. - this.sinb1 * this.sinb1);
+          this.dd = Math.cos(this.lat0) / (Math.sqrt(1. - this.es * sinphi * sinphi) * this.rq * this.cosb1);
+          this.ymf = (this.xmf = this.rq) / this.dd;
+          this.xmf *= this.dd;
+          break;
+      }
+    } else {
+      if (this.mode == this.OBLIQ) {
+        this.sinph0 = Math.sin(this.lat0);
+        this.cosph0 = Math.cos(this.lat0);
+      }
+    }
+  },
+
+/* Lambert Azimuthal Equal Area forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var x,y;
+    var lam=p.x;
+    var phi=p.y;
+    lam = Proj4js.common.adjust_lon(lam - this.long0);
+    
+    if (this.sphere) {
+        var coslam, cosphi, sinphi;
+      
+        sinphi = Math.sin(phi);
+        cosphi = Math.cos(phi);
+        coslam = Math.cos(lam);
+        switch (this.mode) {
+          case this.OBLIQ:
+          case this.EQUIT:
+            y = (this.mode == this.EQUIT) ? 1. + cosphi * coslam : 1. + this.sinph0 * sinphi + this.cosph0 * cosphi * coslam;
+            if (y <= Proj4js.common.EPSLN) {
+              Proj4js.reportError("laea:fwd:y less than eps");
+              return null;
+            }
+            y = Math.sqrt(2. / y);
+            x = y * cosphi * Math.sin(lam);
+            y *= (this.mode == this.EQUIT) ? sinphi : this.cosph0 * sinphi - this.sinph0 * cosphi * coslam;
+            break;
+          case this.N_POLE:
+            coslam = -coslam;
+          case this.S_POLE:
+            if (Math.abs(phi + this.phi0) < Proj4js.common.EPSLN) {
+              Proj4js.reportError("laea:fwd:phi < eps");
+              return null;
+            }
+            y = Proj4js.common.FORTPI - phi * .5;
+            y = 2. * ((this.mode == this.S_POLE) ? Math.cos(y) : Math.sin(y));
+            x = y * Math.sin(lam);
+            y *= coslam;
+            break;
+        }
+    } else {
+        var coslam, sinlam, sinphi, q, sinb=0.0, cosb=0.0, b=0.0;
+      
+        coslam = Math.cos(lam);
+        sinlam = Math.sin(lam);
+        sinphi = Math.sin(phi);
+        q = Proj4js.common.qsfnz(this.e, sinphi);
+        if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+          sinb = q / this.qp;
+          cosb = Math.sqrt(1. - sinb * sinb);
+        }
+        switch (this.mode) {
+          case this.OBLIQ:
+            b = 1. + this.sinb1 * sinb + this.cosb1 * cosb * coslam;
+            break;
+          case this.EQUIT:
+            b = 1. + cosb * coslam;
+            break;
+          case this.N_POLE:
+            b = Proj4js.common.HALF_PI + phi;
+            q = this.qp - q;
+            break;
+          case this.S_POLE:
+            b = phi - Proj4js.common.HALF_PI;
+            q = this.qp + q;
+            break;
+        }
+        if (Math.abs(b) < Proj4js.common.EPSLN) {
+            Proj4js.reportError("laea:fwd:b < eps");
+            return null;
+        }
+        switch (this.mode) {
+          case this.OBLIQ:
+          case this.EQUIT:
+            b = Math.sqrt(2. / b);
+            if (this.mode == this.OBLIQ) {
+              y = this.ymf * b * (this.cosb1 * sinb - this.sinb1 * cosb * coslam);
+            } else {
+              y = (b = Math.sqrt(2. / (1. + cosb * coslam))) * sinb * this.ymf;
+            }
+            x = this.xmf * b * cosb * sinlam;
+            break;
+          case this.N_POLE:
+          case this.S_POLE:
+            if (q >= 0.) {
+              x = (b = Math.sqrt(q)) * sinlam;
+              y = coslam * ((this.mode == this.S_POLE) ? b : -b);
+            } else {
+              x = y = 0.;
+            }
+            break;
+        }
+    }
+
+    //v 1.0
+    /*
+    var sin_lat=Math.sin(lat);
+    var cos_lat=Math.cos(lat);
+
+    var sin_delta_lon=Math.sin(delta_lon);
+    var cos_delta_lon=Math.cos(delta_lon);
+
+    var g =this.sin_lat_o * sin_lat +this.cos_lat_o * cos_lat * cos_delta_lon;
+    if (g == -1.0) {
+      Proj4js.reportError("laea:fwd:Point projects to a circle of radius "+ 2.0 * R);
+      return null;
+    }
+    var ksp = this.a * Math.sqrt(2.0 / (1.0 + g));
+    var x = ksp * cos_lat * sin_delta_lon + this.x0;
+    var y = ksp * (this.cos_lat_o * sin_lat - this.sin_lat_o * cos_lat * cos_delta_lon) + this.y0;
+    */
+    p.x = this.a*x + this.x0;
+    p.y = this.a*y + this.y0;
+    return p;
+  },//lamazFwd()
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var x = p.x/this.a;
+    var y = p.y/this.a;
+    
+    if (this.sphere) {
+        var  cosz=0.0, rh, sinz=0.0;
+      
+        rh = Math.sqrt(x*x + y*y);
+        var phi = rh * .5;
+        if (phi > 1.) {
+          Proj4js.reportError("laea:Inv:DataError");
+          return null;
+        }
+        phi = 2. * Math.asin(phi);
+        if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+          sinz = Math.sin(phi);
+          cosz = Math.cos(phi);
+        }
+        switch (this.mode) {
+        case this.EQUIT:
+          phi = (Math.abs(rh) <= Proj4js.common.EPSLN) ? 0. : Math.asin(y * sinz / rh);
+          x *= sinz;
+          y = cosz * rh;
+          break;
+        case this.OBLIQ:
+          phi = (Math.abs(rh) <= Proj4js.common.EPSLN) ? this.phi0 : Math.asin(cosz * sinph0 + y * sinz * cosph0 / rh);
+          x *= sinz * cosph0;
+          y = (cosz - Math.sin(phi) * sinph0) * rh;
+          break;
+        case this.N_POLE:
+          y = -y;
+          phi = Proj4js.common.HALF_PI - phi;
+          break;
+        case this.S_POLE:
+          phi -= Proj4js.common.HALF_PI;
+          break;
+        }
+        lam = (y == 0. && (this.mode == this.EQUIT || this.mode == this.OBLIQ)) ? 0. : Math.atan2(x, y);
+    } else {
+        var cCe, sCe, q, rho, ab=0.0;
+      
+        switch (this.mode) {
+          case this.EQUIT:
+          case this.OBLIQ:
+            x /= this.dd;
+            y *=  this.dd;
+            rho = Math.sqrt(x*x + y*y);
+            if (rho < Proj4js.common.EPSLN) {
+              p.x = 0.;
+              p.y = this.phi0;
+              return p;
+            }
+            sCe = 2. * Math.asin(.5 * rho / this.rq);
+            cCe = Math.cos(sCe);
+            x *= (sCe = Math.sin(sCe));
+            if (this.mode == this.OBLIQ) {
+              ab = cCe * this.sinb1 + y * sCe * this.cosb1 / rho
+              q = this.qp * ab;
+              y = rho * this.cosb1 * cCe - y * this.sinb1 * sCe;
+            } else {
+              ab = y * sCe / rho;
+              q = this.qp * ab;
+              y = rho * cCe;
+            }
+            break;
+          case this.N_POLE:
+            y = -y;
+          case this.S_POLE:
+            q = (x * x + y * y);
+            if (!q ) {
+              p.x = 0.;
+              p.y = this.phi0;
+              return p;
+            }
+            /*
+            q = this.qp - q;
+            */
+            ab = 1. - q / this.qp;
+            if (this.mode == this.S_POLE) {
+              ab = - ab;
+            }
+            break;
+        }
+        lam = Math.atan2(x, y);
+        phi = this.authlat(Math.asin(ab), this.apa);
+    }
+
+    /*
+    var Rh = Math.Math.sqrt(p.x *p.x +p.y * p.y);
+    var temp = Rh / (2.0 * this.a);
+
+    if (temp > 1) {
+      Proj4js.reportError("laea:Inv:DataError");
+      return null;
+    }
+
+    var z = 2.0 * Proj4js.common.asinz(temp);
+    var sin_z=Math.sin(z);
+    var cos_z=Math.cos(z);
+
+    var lon =this.long0;
+    if (Math.abs(Rh) > Proj4js.common.EPSLN) {
+       var lat = Proj4js.common.asinz(this.sin_lat_o * cos_z +this. cos_lat_o * sin_z *p.y / Rh);
+       var temp =Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+       if (Math.abs(temp) > Proj4js.common.EPSLN) {
+          temp = cos_z -this.sin_lat_o * Math.sin(lat);
+          if(temp!=0.0) lon=Proj4js.common.adjust_lon(this.long0+Math.atan2(p.x*sin_z*this.cos_lat_o,temp*Rh));
+       } else if (this.lat0 < 0.0) {
+          lon = Proj4js.common.adjust_lon(this.long0 - Math.atan2(-p.x,p.y));
+       } else {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x, -p.y));
+       }
+    } else {
+      lat = this.lat0;
+    }
+    */
+    //return(OK);
+    p.x = Proj4js.common.adjust_lon(this.long0+lam);
+    p.y = phi;
+    return p;
+  },//lamazInv()
+  
+/* determine latitude from authalic latitude */
+  P00: .33333333333333333333,
+  P01: .17222222222222222222,
+  P02: .10257936507936507936,
+  P10: .06388888888888888888,
+  P11: .06640211640211640211,
+  P20: .01641501294219154443,
+  
+  authset: function(es) {
+    var t;
+    var APA = new Array();
+    APA[0] = es * this.P00;
+    t = es * es;
+    APA[0] += t * this.P01;
+    APA[1] = t * this.P10;
+    t *= es;
+    APA[0] += t * this.P02;
+    APA[1] += t * this.P11;
+    APA[2] = t * this.P20;
+    return APA;
+  },
+  
+  authlat: function(beta, APA) {
+    var t = beta+beta;
+    return(beta + APA[0] * Math.sin(t) + APA[1] * Math.sin(t+t) + APA[2] * Math.sin(t+t+t));
+  }
+  
+};
+
+
+
+/* ======================================================================
+    projCode/aeqd.js
+   ====================================================================== */
+
+Proj4js.Proj.aeqd = {
+
+  init : function() {
+    this.sin_p12=Math.sin(this.lat0);
+    this.cos_p12=Math.cos(this.lat0);
+  },
+
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    var ksp;
+
+    var sinphi=Math.sin(p.y);
+    var cosphi=Math.cos(p.y); 
+    var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+    var coslon = Math.cos(dlon);
+    var g = this.sin_p12 * sinphi + this.cos_p12 * cosphi * coslon;
+    if (Math.abs(Math.abs(g) - 1.0) < Proj4js.common.EPSLN) {
+       ksp = 1.0;
+       if (g < 0.0) {
+         Proj4js.reportError("aeqd:Fwd:PointError");
+         return;
+       }
+    } else {
+       var z = Math.acos(g);
+       ksp = z/Math.sin(z);
+    }
+    p.x = this.x0 + this.a * ksp * cosphi * Math.sin(dlon);
+    p.y = this.y0 + this.a * ksp * (this.cos_p12 * sinphi - this.sin_p12 * cosphi * coslon);
+    return p;
+  },
+
+  inverse: function(p){
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var rh = Math.sqrt(p.x * p.x + p.y *p.y);
+    if (rh > (2.0 * Proj4js.common.HALF_PI * this.a)) {
+       Proj4js.reportError("aeqdInvDataError");
+       return;
+    }
+    var z = rh / this.a;
+
+    var sinz=Math.sin(z);
+    var cosz=Math.cos(z);
+
+    var lon = this.long0;
+    var lat;
+    if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+      lat = this.lat0;
+    } else {
+      lat = Proj4js.common.asinz(cosz * this.sin_p12 + (p.y * sinz * this.cos_p12) / rh);
+      var con = Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+      if (Math.abs(con) <= Proj4js.common.EPSLN) {
+        if (lat0 >= 0.0) {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x , -p.y));
+        } else {
+          lon = Proj4js.common.adjust_lon(this.long0 - Math.atan2(-p.x , p.y));
+        }
+      } else {
+        con = cosz - this.sin_p12 * Math.sin(lat);
+        if ((Math.abs(con) < Proj4js.common.EPSLN) && (Math.abs(p.x) < Proj4js.common.EPSLN)) {
+           //no-op, just keep the lon value as is
+        } else {
+          var temp = Math.atan2((p.x * sinz * this.cos_p12), (con * rh));
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2((p.x * sinz * this.cos_p12), (con * rh)));
+        }
+      }
+    }
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  } 
+};
+/* ======================================================================
+    projCode/moll.js
+   ====================================================================== */
+
+/*******************************************************************************
+NAME                            MOLLWEIDE
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the MOllweide projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+D. Steinwand, EROS      May, 1991;  Updated Sept, 1992; Updated Feb, 1993
+S. Nelson, EDC		Jun, 2993;	Made corrections in precision and
+					number of iterations.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+*******************************************************************************/
+
+Proj4js.Proj.moll = {
+
+  /* Initialize the Mollweide projection
+    ------------------------------------*/
+  init: function(){
+    //no-op
+  },
+
+  /* Mollweide forward equations--mapping lat,long to x,y
+    ----------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var lon=p.x;
+    var lat=p.y;
+
+    var delta_lon = Proj4js.common.adjust_lon(lon - this.long0);
+    var theta = lat;
+    var con = Proj4js.common.PI * Math.sin(lat);
+
+    /* Iterate using the Newton-Raphson method to find theta
+      -----------------------------------------------------*/
+    for (var i=0;true;i++) {
+       var delta_theta = -(theta + Math.sin(theta) - con)/ (1.0 + Math.cos(theta));
+       theta += delta_theta;
+       if (Math.abs(delta_theta) < Proj4js.common.EPSLN) break;
+       if (i >= 50) {
+          Proj4js.reportError("moll:Fwd:IterationError");
+         //return(241);
+       }
+    }
+    theta /= 2.0;
+
+    /* If the latitude is 90 deg, force the x coordinate to be "0 + false easting"
+       this is done here because of precision problems with "cos(theta)"
+       --------------------------------------------------------------------------*/
+    if (Proj4js.common.PI/2 - Math.abs(lat) < Proj4js.common.EPSLN) delta_lon =0;
+    var x = 0.900316316158 * this.a * delta_lon * Math.cos(theta) + this.x0;
+    var y = 1.4142135623731 * this.a * Math.sin(theta) + this.y0;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+  inverse: function(p){
+    var theta;
+    var arg;
+
+    /* Inverse equations
+      -----------------*/
+    p.x-= this.x0;
+    //~ p.y -= this.y0;
+    var arg = p.y /  (1.4142135623731 * this.a);
+
+    /* Because of division by zero problems, 'arg' can not be 1.0.  Therefore
+       a number very close to one is used instead.
+       -------------------------------------------------------------------*/
+    if(Math.abs(arg) > 0.999999999999) arg=0.999999999999;
+    var theta =Math.asin(arg);
+    var lon = Proj4js.common.adjust_lon(this.long0 + (p.x / (0.900316316158 * this.a * Math.cos(theta))));
+    if(lon < (-Proj4js.common.PI)) lon= -Proj4js.common.PI;
+    if(lon > Proj4js.common.PI) lon= Proj4js.common.PI;
+    arg = (2.0 * theta + Math.sin(2.0 * theta)) / Proj4js.common.PI;
+    if(Math.abs(arg) > 1.0)arg=1.0;
+    var lat = Math.asin(arg);
+    //return(OK);
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gstmerc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gstmerc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gstmerc.js	(revision 76)
@@ -0,0 +1,52 @@
+Proj4js.Proj.gstmerc = {
+  init : function() {
+
+    // array of:  a, b, lon0, lat0, k0, x0, y0
+      var temp= this.b / this.a;
+      this.e= Math.sqrt(1.0 - temp*temp);
+      this.lc= this.long0;
+      this.rs= Math.sqrt(1.0+this.e*this.e*Math.pow(Math.cos(this.lat0),4.0)/(1.0-this.e*this.e));
+      var sinz= Math.sin(this.lat0);
+      var pc= Math.asin(sinz/this.rs);
+      var sinzpc= Math.sin(pc);
+      this.cp= Proj4js.common.latiso(0.0,pc,sinzpc)-this.rs*Proj4js.common.latiso(this.e,this.lat0,sinz);
+      this.n2= this.k0*this.a*Math.sqrt(1.0-this.e*this.e)/(1.0-this.e*this.e*sinz*sinz);
+      this.xs= this.x0;
+      this.ys= this.y0-this.n2*pc;
+
+      if (!this.title) this.title = "Gauss Schreiber transverse mercator";
+    },
+
+
+    // forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon= p.x;
+      var lat= p.y;
+
+      var L= this.rs*(lon-this.lc);
+      var Ls= this.cp+(this.rs*Proj4js.common.latiso(this.e,lat,Math.sin(lat)));
+      var lat1= Math.asin(Math.sin(L)/Proj4js.common.cosh(Ls));
+      var Ls1= Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));
+      p.x= this.xs+(this.n2*Ls1);
+      p.y= this.ys+(this.n2*Math.atan(Proj4js.common.sinh(Ls)/Math.cos(L)));
+      return p;
+    },
+
+  // inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var x= p.x;
+    var y= p.y;
+
+    var L= Math.atan(Proj4js.common.sinh((x-this.xs)/this.n2)/Math.cos((y-this.ys)/this.n2));
+    var lat1= Math.asin(Math.sin((y-this.ys)/this.n2)/Proj4js.common.cosh((x-this.xs)/this.n2));
+    var LC= Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));
+    p.x= this.lc+L/this.rs;
+    p.y= Proj4js.common.invlatiso(this.e,(LC-this.cp)/this.rs);
+    return p;
+  }
+
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/utm.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/utm.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/utm.js	(revision 76)
@@ -0,0 +1,43 @@
+/*******************************************************************************
+NAME                            TRANSVERSE MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Transverse Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+/**
+  Initialize Transverse Mercator projection
+*/
+
+Proj4js.Proj.utm = {
+  dependsOn : 'tmerc',
+
+  init : function() {
+    if (!this.zone) {
+      Proj4js.reportError("utm:init: zone must be specified for UTM");
+      return;
+    }
+    this.lat0 = 0.0;
+    this.long0 = ((6 * Math.abs(this.zone)) - 183) * Proj4js.common.D2R;
+    this.x0 = 500000.0;
+    this.y0 = this.utmSouth ? 10000000.0 : 0.0;
+    this.k0 = 0.9996;
+
+    Proj4js.Proj['tmerc'].init.apply(this);
+    this.forward = Proj4js.Proj['tmerc'].forward;
+    this.inverse = Proj4js.Proj['tmerc'].inverse;
+  }
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/omerc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/omerc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/omerc.js	(revision 76)
@@ -0,0 +1,256 @@
+/*******************************************************************************
+NAME                       OBLIQUE MERCATOR (HOTINE) 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Oblique Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.omerc = {
+
+  /* Initialize the Oblique Mercator  projection
+    ------------------------------------------*/
+  init: function() {
+    if (!this.mode) this.mode=0;
+    if (!this.lon1)   {this.lon1=0;this.mode=1;}
+    if (!this.lon2)   this.lon2=0;
+    if (!this.lat2)    this.lat2=0;
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+    var temp = this.b/ this.a;
+    var es = 1.0 - Math.pow(temp,2);
+    var e = Math.sqrt(es);
+
+    this.sin_p20=Math.sin(this.lat0);
+    this.cos_p20=Math.cos(this.lat0);
+
+    this.con = 1.0 - this.es * this.sin_p20 * this.sin_p20;
+    this.com = Math.sqrt(1.0 - es);
+    this.bl = Math.sqrt(1.0 + this.es * Math.pow(this.cos_p20,4.0)/(1.0 - es));
+    this.al = this.a * this.bl * this.k0 * this.com / this.con;
+    if (Math.abs(this.lat0) < Proj4js.common.EPSLN) {
+       this.ts = 1.0;
+       this.d = 1.0;
+       this.el = 1.0;
+    } else {
+       this.ts = Proj4js.common.tsfnz(this.e,this.lat0,this.sin_p20);
+       this.con = Math.sqrt(this.con);
+       this.d = this.bl * this.com / (this.cos_p20 * this.con);
+       if ((this.d * this.d - 1.0) > 0.0) {
+          if (this.lat0 >= 0.0) {
+             this.f = this.d + Math.sqrt(this.d * this.d - 1.0);
+          } else {
+             this.f = this.d - Math.sqrt(this.d * this.d - 1.0);
+          }
+       } else {
+         this.f = this.d;
+       }
+       this.el = this.f * Math.pow(this.ts,this.bl);
+    }
+
+    //this.longc=52.60353916666667;
+
+    if (this.mode != 0) {
+       this.g = .5 * (this.f - 1.0/this.f);
+       this.gama = Proj4js.common.asinz(Math.sin(this.alpha) / this.d);
+       this.longc= this.longc - Proj4js.common.asinz(this.g * Math.tan(this.gama))/this.bl;
+
+       /* Report parameters common to format B
+       -------------------------------------*/
+       //genrpt(azimuth * R2D,"Azimuth of Central Line:    ");
+       //cenlon(lon_origin);
+      // cenlat(lat_origin);
+
+       this.con = Math.abs(this.lat0);
+       if ((this.con > Proj4js.common.EPSLN) && (Math.abs(this.con - Proj4js.common.HALF_PI) > Proj4js.common.EPSLN)) {
+            this.singam=Math.sin(this.gama);
+            this.cosgam=Math.cos(this.gama);
+
+            this.sinaz=Math.sin(this.alpha);
+            this.cosaz=Math.cos(this.alpha);
+
+            if (this.lat0>= 0) {
+               this.u =  (this.al / this.bl) * Math.atan(Math.sqrt(this.d*this.d - 1.0)/this.cosaz);
+            } else {
+               this.u =  -(this.al / this.bl) *Math.atan(Math.sqrt(this.d*this.d - 1.0)/this.cosaz);
+            }
+          } else {
+            Proj4js.reportError("omerc:Init:DataError");
+          }
+       } else {
+       this.sinphi =Math. sin(this.at1);
+       this.ts1 = Proj4js.common.tsfnz(this.e,this.lat1,this.sinphi);
+       this.sinphi = Math.sin(this.lat2);
+       this.ts2 = Proj4js.common.tsfnz(this.e,this.lat2,this.sinphi);
+       this.h = Math.pow(this.ts1,this.bl);
+       this.l = Math.pow(this.ts2,this.bl);
+       this.f = this.el/this.h;
+       this.g = .5 * (this.f - 1.0/this.f);
+       this.j = (this.el * this.el - this.l * this.h)/(this.el * this.el + this.l * this.h);
+       this.p = (this.l - this.h) / (this.l + this.h);
+       this.dlon = this.lon1 - this.lon2;
+       if (this.dlon < -Proj4js.common.PI) this.lon2 = this.lon2 - 2.0 * Proj4js.common.PI;
+       if (this.dlon > Proj4js.common.PI) this.lon2 = this.lon2 + 2.0 * Proj4js.common.PI;
+       this.dlon = this.lon1 - this.lon2;
+       this.longc = .5 * (this.lon1 + this.lon2) -Math.atan(this.j * Math.tan(.5 * this.bl * this.dlon)/this.p)/this.bl;
+       this.dlon  = Proj4js.common.adjust_lon(this.lon1 - this.longc);
+       this.gama = Math.atan(Math.sin(this.bl * this.dlon)/this.g);
+       this.alpha = Proj4js.common.asinz(this.d * Math.sin(this.gama));
+
+       /* Report parameters common to format A
+       -------------------------------------*/
+
+       if (Math.abs(this.lat1 - this.lat2) <= Proj4js.common.EPSLN) {
+          Proj4js.reportError("omercInitDataError");
+          //return(202);
+       } else {
+          this.con = Math.abs(this.lat1);
+       }
+       if ((this.con <= Proj4js.common.EPSLN) || (Math.abs(this.con - HALF_PI) <= Proj4js.common.EPSLN)) {
+           Proj4js.reportError("omercInitDataError");
+                //return(202);
+       } else {
+         if (Math.abs(Math.abs(this.lat0) - Proj4js.common.HALF_PI) <= Proj4js.common.EPSLN) {
+            Proj4js.reportError("omercInitDataError");
+            //return(202);
+         }
+       }
+
+       this.singam=Math.sin(this.gam);
+       this.cosgam=Math.cos(this.gam);
+
+       this.sinaz=Math.sin(this.alpha);
+       this.cosaz=Math.cos(this.alpha);  
+
+
+       if (this.lat0 >= 0) {
+          this.u =  (this.al/this.bl) * Math.atan(Math.sqrt(this.d * this.d - 1.0)/this.cosaz);
+       } else {
+          this.u = -(this.al/this.bl) * Math.atan(Math.sqrt(this.d * this.d - 1.0)/this.cosaz);
+       }
+     }
+  },
+
+
+  /* Oblique Mercator forward equations--mapping lat,long to x,y
+    ----------------------------------------------------------*/
+  forward: function(p) {
+    var theta;		/* angle					*/
+    var sin_phi, cos_phi;/* sin and cos value				*/
+    var b;		/* temporary values				*/
+    var c, t, tq;	/* temporary values				*/
+    var con, n, ml;	/* cone constant, small m			*/
+    var q,us,vl;
+    var ul,vs;
+    var s;
+    var dlon;
+    var ts1;
+
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    sin_phi = Math.sin(lat);
+    dlon = Proj4js.common.adjust_lon(lon - this.longc);
+    vl = Math.sin(this.bl * dlon);
+    if (Math.abs(Math.abs(lat) - Proj4js.common.HALF_PI) > Proj4js.common.EPSLN) {
+       ts1 = Proj4js.common.tsfnz(this.e,lat,sin_phi);
+       q = this.el / (Math.pow(ts1,this.bl));
+       s = .5 * (q - 1.0 / q);
+       t = .5 * (q + 1.0/ q);
+       ul = (s * this.singam - vl * this.cosgam) / t;
+       con = Math.cos(this.bl * dlon);
+       if (Math.abs(con) < .0000001) {
+          us = this.al * this.bl * dlon;
+       } else {
+          us = this.al * Math.atan((s * this.cosgam + vl * this.singam) / con)/this.bl;
+          if (con < 0) us = us + Proj4js.common.PI * this.al / this.bl;
+       }
+    } else {
+       if (lat >= 0) {
+          ul = this.singam;
+       } else {
+          ul = -this.singam;
+       }
+       us = this.al * lat / this.bl;
+    }
+    if (Math.abs(Math.abs(ul) - 1.0) <= Proj4js.common.EPSLN) {
+       //alert("Point projects into infinity","omer-for");
+       Proj4js.reportError("omercFwdInfinity");
+       //return(205);
+    }
+    vs = .5 * this.al * Math.log((1.0 - ul)/(1.0 + ul)) / this.bl;
+    us = us - this.u;
+    var x = this.x0 + vs * this.cosaz + us * this.sinaz;
+    var y = this.y0 + us * this.cosaz - vs * this.sinaz;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+  inverse: function(p) {
+    var delta_lon;	/* Delta longitude (Given longitude - center 	*/
+    var theta;		/* angle					*/
+    var delta_theta;	/* adjusted longitude				*/
+    var sin_phi, cos_phi;/* sin and cos value				*/
+    var b;		/* temporary values				*/
+    var c, t, tq;	/* temporary values				*/
+    var con, n, ml;	/* cone constant, small m			*/
+    var vs,us,q,s,ts1;
+    var vl,ul,bs;
+    var dlon;
+    var  flag;
+
+    /* Inverse equations
+      -----------------*/
+    p.x -= this.x0;
+    p.y -= this.y0;
+    flag = 0;
+    vs = p.x * this.cosaz - p.y * this.sinaz;
+    us = p.y * this.cosaz + p.x * this.sinaz;
+    us = us + this.u;
+    q = Math.exp(-this.bl * vs / this.al);
+    s = .5 * (q - 1.0/q);
+    t = .5 * (q + 1.0/q);
+    vl = Math.sin(this.bl * us / this.al);
+    ul = (vl * this.cosgam + s * this.singam)/t;
+    if (Math.abs(Math.abs(ul) - 1.0) <= Proj4js.common.EPSLN)
+       {
+       lon = this.longc;
+       if (ul >= 0.0) {
+          lat = Proj4js.common.HALF_PI;
+       } else {
+         lat = -Proj4js.common.HALF_PI;
+       }
+    } else {
+       con = 1.0 / this.bl;
+       ts1 =Math.pow((this.el / Math.sqrt((1.0 + ul) / (1.0 - ul))),con);
+       lat = Proj4js.common.phi2z(this.e,ts1);
+       //if (flag != 0)
+          //return(flag);
+       //~ con = Math.cos(this.bl * us /al);
+       theta = this.longc - Math.atan2((s * this.cosgam - vl * this.singam) , con)/this.bl;
+       lon = Proj4js.common.adjust_lon(theta);
+    }
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqc.js	(revision 76)
@@ -0,0 +1,42 @@
+/* similar to equi.js FIXME proj4 uses eqc */
+Proj4js.Proj.eqc = {
+  init : function() {
+
+      if(!this.x0) this.x0=0;
+      if(!this.y0) this.y0=0;
+      if(!this.lat0) this.lat0=0;
+      if(!this.long0) this.long0=0;
+      if(!this.lat_ts) this.lat_ts=0;
+      if (!this.title) this.title = "Equidistant Cylindrical (Plate Carre)";
+
+      this.rc= Math.cos(this.lat_ts);
+    },
+
+
+    // forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon= p.x;
+      var lat= p.y;
+
+      var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+      var dlat = Proj4js.common.adjust_lat(lat - this.lat0 );
+      p.x= this.x0 + (this.a*dlon*this.rc);
+      p.y= this.y0 + (this.a*dlat        );
+      return p;
+    },
+
+  // inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var x= p.x;
+    var y= p.y;
+
+    p.x= Proj4js.common.adjust_lon(this.long0 + ((x - this.x0)/(this.a*this.rc)));
+    p.y= Proj4js.common.adjust_lat(this.lat0  + ((y - this.y0)/(this.a        )));
+    return p;
+  }
+
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/tmerc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/tmerc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/tmerc.js	(revision 76)
@@ -0,0 +1,141 @@
+/*******************************************************************************
+NAME                            TRANSVERSE MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Transverse Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+/**
+  Initialize Transverse Mercator projection
+*/
+
+Proj4js.Proj.tmerc = {
+  init : function() {
+    this.e0 = Proj4js.common.e0fn(this.es);
+    this.e1 = Proj4js.common.e1fn(this.es);
+    this.e2 = Proj4js.common.e2fn(this.es);
+    this.e3 = Proj4js.common.e3fn(this.es);
+    this.ml0 = this.a * Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, this.lat0);
+  },
+
+  /**
+    Transverse Mercator Forward  - long/lat to x/y
+    long/lat in radians
+  */
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    var delta_lon = Proj4js.common.adjust_lon(lon - this.long0); // Delta longitude
+    var con;    // cone constant
+    var x, y;
+    var sin_phi=Math.sin(lat);
+    var cos_phi=Math.cos(lat);
+
+    if (this.sphere) {  /* spherical form */
+      var b = cos_phi * Math.sin(delta_lon);
+      if ((Math.abs(Math.abs(b) - 1.0)) < .0000000001)  {
+        Proj4js.reportError("tmerc:forward: Point projects into infinity");
+        return(93);
+      } else {
+        x = .5 * this.a * this.k0 * Math.log((1.0 + b)/(1.0 - b));
+        con = Math.acos(cos_phi * Math.cos(delta_lon)/Math.sqrt(1.0 - b*b));
+        if (lat < 0) con = - con;
+        y = this.a * this.k0 * (con - this.lat0);
+      }
+    } else {
+      var al  = cos_phi * delta_lon;
+      var als = Math.pow(al,2);
+      var c   = this.ep2 * Math.pow(cos_phi,2);
+      var tq  = Math.tan(lat);
+      var t   = Math.pow(tq,2);
+      con = 1.0 - this.es * Math.pow(sin_phi,2);
+      var n   = this.a / Math.sqrt(con);
+      var ml  = this.a * Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+
+      x = this.k0 * n * al * (1.0 + als / 6.0 * (1.0 - t + c + als / 20.0 * (5.0 - 18.0 * t + Math.pow(t,2) + 72.0 * c - 58.0 * this.ep2))) + this.x0;
+      y = this.k0 * (ml - this.ml0 + n * tq * (als * (0.5 + als / 24.0 * (5.0 - t + 9.0 * c + 4.0 * Math.pow(c,2) + als / 30.0 * (61.0 - 58.0 * t + Math.pow(t,2) + 600.0 * c - 330.0 * this.ep2))))) + this.y0;
+
+    }
+    p.x = x; p.y = y;
+    return p;
+  }, // tmercFwd()
+
+  /**
+    Transverse Mercator Inverse  -  x/y to long/lat
+  */
+  inverse : function(p) {
+    var con, phi;  /* temporary angles       */
+    var delta_phi; /* difference between longitudes    */
+    var i;
+    var max_iter = 6;      /* maximun number of iterations */
+    var lat, lon;
+
+    if (this.sphere) {   /* spherical form */
+      var f = Math.exp(p.x/(this.a * this.k0));
+      var g = .5 * (f - 1/f);
+      var temp = this.lat0 + p.y/(this.a * this.k0);
+      var h = Math.cos(temp);
+      con = Math.sqrt((1.0 - h * h)/(1.0 + g * g));
+      lat = Proj4js.common.asinz(con);
+      if (temp < 0)
+        lat = -lat;
+      if ((g == 0) && (h == 0)) {
+        lon = this.long0;
+      } else {
+        lon = Proj4js.common.adjust_lon(Math.atan2(g,h) + this.long0);
+      }
+    } else {    // ellipsoidal form
+      var x = p.x - this.x0;
+      var y = p.y - this.y0;
+
+      con = (this.ml0 + y / this.k0) / this.a;
+      phi = con;
+      for (i=0;true;i++) {
+        delta_phi=((con + this.e1 * Math.sin(2.0*phi) - this.e2 * Math.sin(4.0*phi) + this.e3 * Math.sin(6.0*phi)) / this.e0) - phi;
+        phi += delta_phi;
+        if (Math.abs(delta_phi) <= Proj4js.common.EPSLN) break;
+        if (i >= max_iter) {
+          Proj4js.reportError("tmerc:inverse: Latitude failed to converge");
+          return(95);
+        }
+      } // for()
+      if (Math.abs(phi) < Proj4js.common.HALF_PI) {
+        // sincos(phi, &sin_phi, &cos_phi);
+        var sin_phi=Math.sin(phi);
+        var cos_phi=Math.cos(phi);
+        var tan_phi = Math.tan(phi);
+        var c = this.ep2 * Math.pow(cos_phi,2);
+        var cs = Math.pow(c,2);
+        var t = Math.pow(tan_phi,2);
+        var ts = Math.pow(t,2);
+        con = 1.0 - this.es * Math.pow(sin_phi,2);
+        var n = this.a / Math.sqrt(con);
+        var r = n * (1.0 - this.es) / con;
+        var d = x / (n * this.k0);
+        var ds = Math.pow(d,2);
+        lat = phi - (n * tan_phi * ds / r) * (0.5 - ds / 24.0 * (5.0 + 3.0 * t + 10.0 * c - 4.0 * cs - 9.0 * this.ep2 - ds / 30.0 * (61.0 + 90.0 * t + 298.0 * c + 45.0 * ts - 252.0 * this.ep2 - 3.0 * cs)));
+        lon = Proj4js.common.adjust_lon(this.long0 + (d * (1.0 - ds / 6.0 * (1.0 + 2.0 * t + c - ds / 20.0 * (5.0 - 2.0 * c + 28.0 * t - 3.0 * cs + 8.0 * this.ep2 + 24.0 * ts))) / cos_phi));
+      } else {
+        lat = Proj4js.common.HALF_PI * Proj4js.common.sign(y);
+        lon = this.long0;
+      }
+    }
+    p.x = lon;
+    p.y = lat;
+    return p;
+  } // tmercInv()
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aeqd.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aeqd.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aeqd.js	(revision 76)
@@ -0,0 +1,75 @@
+Proj4js.Proj.aeqd = {
+
+  init : function() {
+    this.sin_p12=Math.sin(this.lat0);
+    this.cos_p12=Math.cos(this.lat0);
+  },
+
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    var ksp;
+
+    var sinphi=Math.sin(p.y);
+    var cosphi=Math.cos(p.y); 
+    var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+    var coslon = Math.cos(dlon);
+    var g = this.sin_p12 * sinphi + this.cos_p12 * cosphi * coslon;
+    if (Math.abs(Math.abs(g) - 1.0) < Proj4js.common.EPSLN) {
+       ksp = 1.0;
+       if (g < 0.0) {
+         Proj4js.reportError("aeqd:Fwd:PointError");
+         return;
+       }
+    } else {
+       var z = Math.acos(g);
+       ksp = z/Math.sin(z);
+    }
+    p.x = this.x0 + this.a * ksp * cosphi * Math.sin(dlon);
+    p.y = this.y0 + this.a * ksp * (this.cos_p12 * sinphi - this.sin_p12 * cosphi * coslon);
+    return p;
+  },
+
+  inverse: function(p){
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var rh = Math.sqrt(p.x * p.x + p.y *p.y);
+    if (rh > (2.0 * Proj4js.common.HALF_PI * this.a)) {
+       Proj4js.reportError("aeqdInvDataError");
+       return;
+    }
+    var z = rh / this.a;
+
+    var sinz=Math.sin(z);
+    var cosz=Math.cos(z);
+
+    var lon = this.long0;
+    var lat;
+    if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+      lat = this.lat0;
+    } else {
+      lat = Proj4js.common.asinz(cosz * this.sin_p12 + (p.y * sinz * this.cos_p12) / rh);
+      var con = Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+      if (Math.abs(con) <= Proj4js.common.EPSLN) {
+        if (lat0 >= 0.0) {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x , -p.y));
+        } else {
+          lon = Proj4js.common.adjust_lon(this.long0 - Math.atan2(-p.x , p.y));
+        }
+      } else {
+        con = cosz - this.sin_p12 * Math.sin(lat);
+        if ((Math.abs(con) < Proj4js.common.EPSLN) && (Math.abs(p.x) < Proj4js.common.EPSLN)) {
+           //no-op, just keep the lon value as is
+        } else {
+          var temp = Math.atan2((p.x * sinz * this.cos_p12), (con * rh));
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2((p.x * sinz * this.cos_p12), (con * rh)));
+        }
+      }
+    }
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  } 
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/nzmg.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/nzmg.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/nzmg.js	(revision 76)
@@ -0,0 +1,286 @@
+/*******************************************************************************
+NAME                            NEW ZEALAND MAP GRID
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the New Zealand Map Grid projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+
+ALGORITHM REFERENCES
+
+1.  Department of Land and Survey Technical Circular 1973/32
+      http://www.linz.govt.nz/docs/miscellaneous/nz-map-definition.pdf
+
+2.  OSG Technical Report 4.1
+      http://www.linz.govt.nz/docs/miscellaneous/nzmg.pdf
+
+
+IMPLEMENTATION NOTES
+
+The two references use different symbols for the calculated values. This
+implementation uses the variable names similar to the symbols in reference [1].
+
+The alogrithm uses different units for delta latitude and delta longitude.
+The delta latitude is assumed to be in units of seconds of arc x 10^-5.
+The delta longitude is the usual radians. Look out for these conversions.
+
+The algorithm is described using complex arithmetic. There were three
+options:
+   * find and use a Javascript library for complex arithmetic
+   * write my own complex library
+   * expand the complex arithmetic by hand to simple arithmetic
+
+This implementation has expanded the complex multiplication operations
+into parallel simple arithmetic operations for the real and imaginary parts.
+The imaginary part is way over to the right of the display; this probably
+violates every coding standard in the world, but, to me, it makes it much
+more obvious what is going on.
+
+The following complex operations are used:
+   - addition
+   - multiplication
+   - division
+   - complex number raised to integer power
+   - summation
+
+A summary of complex arithmetic operations:
+   (from http://en.wikipedia.org/wiki/Complex_arithmetic)
+   addition:       (a + bi) + (c + di) = (a + c) + (b + d)i
+   subtraction:    (a + bi) - (c + di) = (a - c) + (b - d)i
+   multiplication: (a + bi) x (c + di) = (ac - bd) + (bc + ad)i
+   division:       (a + bi) / (c + di) = [(ac + bd)/(cc + dd)] + [(bc - ad)/(cc + dd)]i
+
+The algorithm needs to calculate summations of simple and complex numbers. This is
+implemented using a for-loop, pre-loading the summed value to zero.
+
+The algorithm needs to calculate theta^2, theta^3, etc while doing a summation.
+There are three possible implementations:
+   - use Math.pow in the summation loop - except for complex numbers
+   - precalculate the values before running the loop
+   - calculate theta^n = theta^(n-1) * theta during the loop
+This implementation uses the third option for both real and complex arithmetic.
+
+For example
+   psi_n = 1;
+   sum = 0;
+   for (n = 1; n <=6; n++) {
+      psi_n1 = psi_n * psi;       // calculate psi^(n+1)
+      psi_n = psi_n1;
+      sum = sum + A[n] * psi_n;
+   }
+
+
+TEST VECTORS
+
+NZMG E, N:         2487100.638      6751049.719     metres
+NZGD49 long, lat:      172.739194       -34.444066  degrees
+
+NZMG E, N:         2486533.395      6077263.661     metres
+NZGD49 long, lat:      172.723106       -40.512409  degrees
+
+NZMG E, N:         2216746.425      5388508.765     metres
+NZGD49 long, lat:      169.172062       -46.651295  degrees
+
+Note that these test vectors convert from NZMG metres to lat/long referenced
+to NZGD49, not the more usual WGS84. The difference is about 70m N/S and about
+10m E/W.
+
+These test vectors are provided in reference [1]. Many more test
+vectors are available in
+   http://www.linz.govt.nz/docs/topography/topographicdata/placenamesdatabase/nznamesmar08.zip
+which is a catalog of names on the 260-series maps.
+
+
+EPSG CODES
+
+NZMG     EPSG:27200
+NZGD49   EPSG:4272
+
+http://spatialreference.org/ defines these as
+  Proj4js.defs["EPSG:4272"] = "+proj=longlat +ellps=intl +datum=nzgd49 +no_defs ";
+  Proj4js.defs["EPSG:27200"] = "+proj=nzmg +lat_0=-41 +lon_0=173 +x_0=2510000 +y_0=6023150 +ellps=intl +datum=nzgd49 +units=m +no_defs ";
+
+
+LICENSE
+  Copyright: Stephen Irons 2008
+  Released under terms of the LGPL as per: http://www.gnu.org/copyleft/lesser.html
+
+*******************************************************************************/
+
+
+/**
+  Initialize New Zealand Map Grip projection
+*/
+
+Proj4js.Proj.nzmg = {
+
+  /**
+   * iterations: Number of iterations to refine inverse transform.
+   *     0 -> km accuracy
+   *     1 -> m accuracy -- suitable for most mapping applications
+   *     2 -> mm accuracy
+   */
+  iterations: 1,
+
+  init : function() {
+    this.A = new Array();
+    this.A[1]  = +0.6399175073;
+    this.A[2]  = -0.1358797613;
+    this.A[3]  = +0.063294409;
+    this.A[4]  = -0.02526853;
+    this.A[5]  = +0.0117879;
+    this.A[6]  = -0.0055161;
+    this.A[7]  = +0.0026906;
+    this.A[8]  = -0.001333;
+    this.A[9]  = +0.00067;
+    this.A[10] = -0.00034;
+
+    this.B_re = new Array();        this.B_im = new Array();
+    this.B_re[1] = +0.7557853228;   this.B_im[1] =  0.0;
+    this.B_re[2] = +0.249204646;    this.B_im[2] = +0.003371507;
+    this.B_re[3] = -0.001541739;    this.B_im[3] = +0.041058560;
+    this.B_re[4] = -0.10162907;     this.B_im[4] = +0.01727609;
+    this.B_re[5] = -0.26623489;     this.B_im[5] = -0.36249218;
+    this.B_re[6] = -0.6870983;      this.B_im[6] = -1.1651967;
+
+    this.C_re = new Array();        this.C_im = new Array();
+    this.C_re[1] = +1.3231270439;   this.C_im[1] =  0.0;
+    this.C_re[2] = -0.577245789;    this.C_im[2] = -0.007809598;
+    this.C_re[3] = +0.508307513;    this.C_im[3] = -0.112208952;
+    this.C_re[4] = -0.15094762;     this.C_im[4] = +0.18200602;
+    this.C_re[5] = +1.01418179;     this.C_im[5] = +1.64497696;
+    this.C_re[6] = +1.9660549;      this.C_im[6] = +2.5127645;
+
+    this.D = new Array();
+    this.D[1] = +1.5627014243;
+    this.D[2] = +0.5185406398;
+    this.D[3] = -0.03333098;
+    this.D[4] = -0.1052906;
+    this.D[5] = -0.0368594;
+    this.D[6] = +0.007317;
+    this.D[7] = +0.01220;
+    this.D[8] = +0.00394;
+    this.D[9] = -0.0013;
+  },
+
+  /**
+    New Zealand Map Grid Forward  - long/lat to x/y
+    long/lat in radians
+  */
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    var delta_lat = lat - this.lat0;
+    var delta_lon = lon - this.long0;
+
+    // 1. Calculate d_phi and d_psi    ...                          // and d_lambda
+    // For this algorithm, delta_latitude is in seconds of arc x 10-5, so we need to scale to those units. Longitude is radians.
+    var d_phi = delta_lat / Proj4js.common.SEC_TO_RAD * 1E-5;       var d_lambda = delta_lon;
+    var d_phi_n = 1;  // d_phi^0
+
+    var d_psi = 0;
+    for (n = 1; n <= 10; n++) {
+      d_phi_n = d_phi_n * d_phi;
+      d_psi = d_psi + this.A[n] * d_phi_n;
+    }
+
+    // 2. Calculate theta
+    var th_re = d_psi;                                              var th_im = d_lambda;
+
+    // 3. Calculate z
+    var th_n_re = 1;                                                var th_n_im = 0;  // theta^0
+    var th_n_re1;                                                   var th_n_im1;
+
+    var z_re = 0;                                                   var z_im = 0;
+    for (n = 1; n <= 6; n++) {
+      th_n_re1 = th_n_re*th_re - th_n_im*th_im;                     th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+      th_n_re = th_n_re1;                                           th_n_im = th_n_im1;
+      z_re = z_re + this.B_re[n]*th_n_re - this.B_im[n]*th_n_im;    z_im = z_im + this.B_im[n]*th_n_re + this.B_re[n]*th_n_im;
+    }
+
+    // 4. Calculate easting and northing
+    x = (z_im * this.a) + this.x0;
+    y = (z_re * this.a) + this.y0;
+
+    p.x = x; p.y = y;
+
+    return p;
+  },
+
+
+  /**
+    New Zealand Map Grid Inverse  -  x/y to long/lat
+  */
+  inverse : function(p) {
+
+    var x = p.x;
+    var y = p.y;
+
+    var delta_x = x - this.x0;
+    var delta_y = y - this.y0;
+
+    // 1. Calculate z
+    var z_re = delta_y / this.a;                                              var z_im = delta_x / this.a;
+
+    // 2a. Calculate theta - first approximation gives km accuracy
+    var z_n_re = 1;                                                           var z_n_im = 0;  // z^0
+    var z_n_re1;                                                              var z_n_im1;
+
+    var th_re = 0;                                                            var th_im = 0;
+    for (n = 1; n <= 6; n++) {
+      z_n_re1 = z_n_re*z_re - z_n_im*z_im;                                    z_n_im1 = z_n_im*z_re + z_n_re*z_im;
+      z_n_re = z_n_re1;                                                       z_n_im = z_n_im1;
+      th_re = th_re + this.C_re[n]*z_n_re - this.C_im[n]*z_n_im;              th_im = th_im + this.C_im[n]*z_n_re + this.C_re[n]*z_n_im;
+    }
+
+    // 2b. Iterate to refine the accuracy of the calculation
+    //        0 iterations gives km accuracy
+    //        1 iteration gives m accuracy -- good enough for most mapping applications
+    //        2 iterations bives mm accuracy
+    for (i = 0; i < this.iterations; i++) {
+       var th_n_re = th_re;                                                      var th_n_im = th_im;
+       var th_n_re1;                                                             var th_n_im1;
+
+       var num_re = z_re;                                                        var num_im = z_im;
+       for (n = 2; n <= 6; n++) {
+         th_n_re1 = th_n_re*th_re - th_n_im*th_im;                               th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+         th_n_re = th_n_re1;                                                     th_n_im = th_n_im1;
+         num_re = num_re + (n-1)*(this.B_re[n]*th_n_re - this.B_im[n]*th_n_im);  num_im = num_im + (n-1)*(this.B_im[n]*th_n_re + this.B_re[n]*th_n_im);
+       }
+
+       th_n_re = 1;                                                              th_n_im = 0;
+       var den_re = this.B_re[1];                                                var den_im = this.B_im[1];
+       for (n = 2; n <= 6; n++) {
+         th_n_re1 = th_n_re*th_re - th_n_im*th_im;                               th_n_im1 = th_n_im*th_re + th_n_re*th_im;
+         th_n_re = th_n_re1;                                                     th_n_im = th_n_im1;
+         den_re = den_re + n * (this.B_re[n]*th_n_re - this.B_im[n]*th_n_im);    den_im = den_im + n * (this.B_im[n]*th_n_re + this.B_re[n]*th_n_im);
+       }
+
+       // Complex division
+       var den2 = den_re*den_re + den_im*den_im;
+       th_re = (num_re*den_re + num_im*den_im) / den2;                           th_im = (num_im*den_re - num_re*den_im) / den2;
+    }
+
+    // 3. Calculate d_phi              ...                                    // and d_lambda
+    var d_psi = th_re;                                                        var d_lambda = th_im;
+    var d_psi_n = 1;  // d_psi^0
+
+    var d_phi = 0;
+    for (n = 1; n <= 9; n++) {
+       d_psi_n = d_psi_n * d_psi;
+       d_phi = d_phi + this.D[n] * d_psi_n;
+    }
+
+    // 4. Calculate latitude and longitude
+    // d_phi is calcuated in second of arc * 10^-5, so we need to scale back to radians. d_lambda is in radians.
+    var lat = this.lat0 + (d_phi * Proj4js.common.SEC_TO_RAD * 1E5);
+    var lon = this.long0 +  d_lambda;
+
+    p.x = lon;
+    p.y = lat;
+
+    return p;
+  }
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqdc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqdc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/eqdc.js	(revision 76)
@@ -0,0 +1,140 @@
+/*******************************************************************************
+NAME                            EQUIDISTANT CONIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and Northing
+		for the Equidistant Conic projection.  The longitude and
+		latitude must be in radians.  The Easting and Northing values
+		will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+/* Variables common to all subroutines in this code file
+  -----------------------------------------------------*/
+
+Proj4js.Proj.eqdc = {
+
+/* Initialize the Equidistant Conic projection
+  ------------------------------------------*/
+  init: function() {
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+
+    if(!this.mode) this.mode=0;//chosen default mode
+    this.temp = this.b / this.a;
+    this.es = 1.0 - Math.pow(this.temp,2);
+    this.e = Math.sqrt(this.es);
+    this.e0 = Proj4js.common.e0fn(this.es);
+    this.e1 = Proj4js.common.e1fn(this.es);
+    this.e2 = Proj4js.common.e2fn(this.es);
+    this.e3 = Proj4js.common.e3fn(this.es);
+
+    this.sinphi=Math.sin(this.lat1);
+    this.cosphi=Math.cos(this.lat1);
+
+    this.ms1 = Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);
+    this.ml1 = Proj4js.common.mlfn(this.e0, this.e1, this.e2,this.e3, this.lat1);
+
+    /* format B
+    ---------*/
+    if (this.mode != 0) {
+      if (Math.abs(this.lat1 + this.lat2) < Proj4js.common.EPSLN) {
+            Proj4js.reportError("eqdc:Init:EqualLatitudes");
+            //return(81);
+       }
+       this.sinphi=Math.sin(this.lat2);
+       this.cosphi=Math.cos(this.lat2);   
+
+       this.ms2 = Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);
+       this.ml2 = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, this.lat2);
+       if (Math.abs(this.lat1 - this.lat2) >= Proj4js.common.EPSLN) {
+         this.ns = (this.ms1 - this.ms2) / (this.ml2 - this.ml1);
+       } else {
+          this.ns = this.sinphi;
+       }
+    } else {
+      this.ns = this.sinphi;
+    }
+    this.g = this.ml1 + this.ms1/this.ns;
+    this.ml0 = Proj4js.common.mlfn(this.e0, this.e1,this. e2, this.e3, this.lat0);
+    this.rh = this.a * (this.g - this.ml0);
+  },
+
+
+/* Equidistant Conic forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+
+    /* Forward equations
+      -----------------*/
+    var ml = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+    var rh1 = this.a * (this.g - ml);
+    var theta = this.ns * Proj4js.common.adjust_lon(lon - this.long0);
+
+    var x = this.x0  + rh1 * Math.sin(theta);
+    var y = this.y0 + this.rh - rh1 * Math.cos(theta);
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y  = this.rh - p.y + this.y0;
+    var con, rh1;
+    if (this.ns >= 0) {
+       var rh1 = Math.sqrt(p.x *p.x + p.y * p.y); 
+       var con = 1.0;
+    } else {
+       rh1 = -Math.sqrt(p.x *p. x +p. y * p.y); 
+       con = -1.0;
+    }
+    var theta = 0.0;
+    if (rh1 != 0.0) theta = Math.atan2(con *p.x, con *p.y);
+    var ml = this.g - rh1 /this.a;
+    var lat = this.phi3z(ml,this.e0,this.e1,this.e2,this.e3);
+    var lon = Proj4js.common.adjust_lon(this.long0 + theta / this.ns);
+
+     p.x=lon;
+     p.y=lat;  
+     return p;
+    },
+    
+/* Function to compute latitude, phi3, for the inverse of the Equidistant
+   Conic projection.
+-----------------------------------------------------------------*/
+  phi3z: function(ml,e0,e1,e2,e3) {
+    var phi;
+    var dphi;
+
+    phi = ml;
+    for (var i = 0; i < 15; i++) {
+      dphi = (ml + e1 * Math.sin(2.0 * phi) - e2 * Math.sin(4.0 * phi) + e3 * Math.sin(6.0 * phi))/ e0 - phi;
+      phi += dphi;
+      if (Math.abs(dphi) <= .0000000001) {
+        return phi;
+      }
+    }
+    Proj4js.reportError("PHI3Z-CONV:Latitude failed to converge after 15 iterations");
+    return null;
+  }
+
+    
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sinu.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sinu.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sinu.js	(revision 76)
@@ -0,0 +1,79 @@
+/*******************************************************************************
+NAME                  		SINUSOIDAL
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Sinusoidal projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+D. Steinwand, EROS      May, 1991     
+
+This function was adapted from the Sinusoidal projection code (FORTRAN) in the 
+General Cartographic Transformation Package software which is available from 
+the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.sinu = {
+
+	/* Initialize the Sinusoidal projection
+	  ------------------------------------*/
+	init: function() {
+		/* Place parameters in static storage for common use
+		  -------------------------------------------------*/
+		this.R = 6370997.0; //Radius of earth
+	},
+
+	/* Sinusoidal forward equations--mapping lat,long to x,y
+	-----------------------------------------------------*/
+	forward: function(p) {
+		var x,y,delta_lon;	
+		var lon=p.x;
+		var lat=p.y;	
+		/* Forward equations
+		-----------------*/
+		delta_lon = Proj4js.common.adjust_lon(lon - this.long0);
+		x = this.R * delta_lon * Math.cos(lat) + this.x0;
+		y = this.R * lat + this.y0;
+
+		p.x=x;
+		p.y=y;	
+		return p;
+	},
+
+	inverse: function(p) {
+		var lat,temp,lon;	
+
+		/* Inverse equations
+		  -----------------*/
+		p.x -= this.x0;
+		p.y -= this.y0;
+		lat = p.y / this.R;
+		if (Math.abs(lat) > Proj4js.common.HALF_PI) {
+		    Proj4js.reportError("sinu:Inv:DataError");
+		}
+		temp = Math.abs(lat) - Proj4js.common.HALF_PI;
+		if (Math.abs(temp) > Proj4js.common.EPSLN) {
+			temp = this.long0+ p.x / (this.R *Math.cos(lat));
+			lon = Proj4js.common.adjust_lon(temp);
+		} else {
+			lon = this.long0;
+		}
+		  
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/stere.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/stere.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/stere.js	(revision 76)
@@ -0,0 +1,246 @@
+
+// Initialize the Stereographic projection
+
+Proj4js.Proj.stere = {
+  ssfn_: function(phit, sinphi, eccen) {
+  	sinphi *= eccen;
+  	return (Math.tan (.5 * (Proj4js.common.HALF_PI + phit)) * Math.pow((1. - sinphi) / (1. + sinphi), .5 * eccen));
+  },
+  TOL:	1.e-8,
+  NITER:	8,
+  CONV:	1.e-10,
+  S_POLE:	0,
+  N_POLE:	1,
+  OBLIQ:	2,
+  EQUIT:	3,
+
+  init : function() {
+  	this.phits = this.lat_ts ? this.lat_ts : Proj4js.common.HALF_PI;
+    var t = Math.abs(this.lat0);
+  	if ((Math.abs(t) - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+  		this.mode = this.lat0 < 0. ? this.S_POLE : this.N_POLE;
+  	} else {
+  		this.mode = t > Proj4js.common.EPSLN ? this.OBLIQ : this.EQUIT;
+    }
+  	this.phits = Math.abs(this.phits);
+  	if (this.es) {
+  		var X;
+
+  		switch (this.mode) {
+  		case this.N_POLE:
+  		case this.S_POLE:
+  			if (Math.abs(this.phits - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+  				this.akm1 = 2. * this.k0 / Math.sqrt(Math.pow(1+this.e,1+this.e)*Math.pow(1-this.e,1-this.e));
+  			} else {
+          t = Math.sin(this.phits);
+  				this.akm1 = Math.cos(this.phits) / Proj4js.common.tsfnz(this.e, this.phits, t);
+  				t *= this.e;
+  				this.akm1 /= Math.sqrt(1. - t * t);
+  			}
+  			break;
+  		case this.EQUIT:
+  			this.akm1 = 2. * this.k0;
+  			break;
+  		case this.OBLIQ:
+  			t = Math.sin(this.lat0);
+  			X = 2. * Math.atan(this.ssfn_(this.lat0, t, this.e)) - Proj4js.common.HALF_PI;
+  			t *= this.e;
+  			this.akm1 = 2. * this.k0 * Math.cos(this.lat0) / Math.sqrt(1. - t * t);
+  			this.sinX1 = Math.sin(X);
+  			this.cosX1 = Math.cos(X);
+  			break;
+  		}
+  	} else {
+  		switch (this.mode) {
+  		case this.OBLIQ:
+  			this.sinph0 = Math.sin(this.lat0);
+  			this.cosph0 = Math.cos(this.lat0);
+  		case this.EQUIT:
+  			this.akm1 = 2. * this.k0;
+  			break;
+  		case this.S_POLE:
+  		case this.N_POLE:
+  			this.akm1 = Math.abs(this.phits - Proj4js.common.HALF_PI) >= Proj4js.common.EPSLN ?
+  			   Math.cos(this.phits) / Math.tan(Proj4js.common.FORTPI - .5 * this.phits) :
+  			   2. * this.k0 ;
+  			break;
+  		}
+  	}
+  }, 
+
+// Stereographic forward equations--mapping lat,long to x,y
+  forward: function(p) {
+    var lon = p.x;
+    lon = Proj4js.common.adjust_lon(lon - this.long0);
+    var lat = p.y;
+    var x, y;
+    
+    if (this.sphere) {
+    	var  sinphi, cosphi, coslam, sinlam;
+
+    	sinphi = Math.sin(lat);
+    	cosphi = Math.cos(lat);
+    	coslam = Math.cos(lon);
+    	sinlam = Math.sin(lon);
+    	switch (this.mode) {
+    	case this.EQUIT:
+    		y = 1. + cosphi * coslam;
+    		if (y <= Proj4js.common.EPSLN) {
+          F_ERROR;
+        }
+        y = this.akm1 / y;
+    		x = y * cosphi * sinlam;
+        y *= sinphi;
+    		break;
+    	case this.OBLIQ:
+    		y = 1. + this.sinph0 * sinphi + this.cosph0 * cosphi * coslam;
+    		if (y <= Proj4js.common.EPSLN) {
+          F_ERROR;
+        }
+        y = this.akm1 / y;
+    		x = y * cosphi * sinlam;
+    		y *= this.cosph0 * sinphi - this.sinph0 * cosphi * coslam;
+    		break;
+    	case this.N_POLE:
+    		coslam = -coslam;
+    		lat = -lat;
+        //Note  no break here so it conitnues through S_POLE
+    	case this.S_POLE:
+    		if (Math.abs(lat - Proj4js.common.HALF_PI) < this.TOL) {
+          F_ERROR;
+        }
+        y = this.akm1 * Math.tan(Proj4js.common.FORTPI + .5 * lat);
+    		x = sinlam * y;
+    		y *= coslam;
+    		break;
+    	}
+    } else {
+    	coslam = Math.cos(lon);
+    	sinlam = Math.sin(lon);
+    	sinphi = Math.sin(lat);
+    	if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+        X = 2. * Math.atan(this.ssfn_(lat, sinphi, this.e));
+    		sinX = Math.sin(X - Proj4js.common.HALF_PI);
+    		cosX = Math.cos(X);
+    	}
+    	switch (this.mode) {
+    	case this.OBLIQ:
+    		A = this.akm1 / (this.cosX1 * (1. + this.sinX1 * sinX + this.cosX1 * cosX * coslam));
+    		y = A * (this.cosX1 * sinX - this.sinX1 * cosX * coslam);
+    		x = A * cosX;
+    		break;
+    	case this.EQUIT:
+    		A = 2. * this.akm1 / (1. + cosX * coslam);
+    		y = A * sinX;
+    		x = A * cosX;
+    		break;
+    	case this.S_POLE:
+    		lat = -lat;
+    		coslam = - coslam;
+    		sinphi = -sinphi;
+    	case this.N_POLE:
+    		x = this.akm1 * Proj4js.common.tsfnz(this.e, lat, sinphi);
+    		y = - x * coslam;
+    		break;
+    	}
+    	x = x * sinlam;
+    }
+    p.x = x*this.a + this.x0;
+    p.y = y*this.a + this.y0;
+    return p;
+  },
+
+
+//* Stereographic inverse equations--mapping x,y to lat/long
+  inverse: function(p) {
+    var x = (p.x - this.x0)/this.a;   /* descale and de-offset */
+    var y = (p.y - this.y0)/this.a;
+    var lon, lat;
+
+    var cosphi, sinphi, tp=0.0, phi_l=0.0, rho, halfe=0.0, pi2=0.0;
+    var i;
+
+    if (this.sphere) {
+    	var  c, rh, sinc, cosc;
+
+      rh = Math.sqrt(x*x + y*y);
+      c = 2. * Math.atan(rh / this.akm1);
+    	sinc = Math.sin(c);
+    	cosc = Math.cos(c);
+    	lon = 0.;
+    	switch (this.mode) {
+    	case this.EQUIT:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = 0.;
+    		} else {
+    			lat = Math.asin(y * sinc / rh);
+        }
+    		if (cosc != 0. || x != 0.) lon = Math.atan2(x * sinc, cosc * rh);
+    		break;
+    	case this.OBLIQ:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = this.phi0;
+    		} else {
+    			lat = Math.asin(cosc * sinph0 + y * sinc * cosph0 / rh);
+        }
+        c = cosc - sinph0 * Math.sin(lat);
+    		if (c != 0. || x != 0.) {
+    			lon = Math.atan2(x * sinc * cosph0, c * rh);
+        }
+    		break;
+    	case this.N_POLE:
+    		y = -y;
+    	case this.S_POLE:
+    		if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+    			lat = this.phi0;
+    		} else {
+    			lat = Math.asin(this.mode == this.S_POLE ? -cosc : cosc);
+        }
+    		lon = (x == 0. && y == 0.) ? 0. : Math.atan2(x, y);
+    		break;
+    	}
+        p.x = Proj4js.common.adjust_lon(lon + this.long0);
+        p.y = lat;
+    } else {
+    	rho = Math.sqrt(x*x + y*y);
+    	switch (this.mode) {
+    	case this.OBLIQ:
+    	case this.EQUIT:
+        tp = 2. * Math.atan2(rho * this.cosX1 , this.akm1);
+    		cosphi = Math.cos(tp);
+    		sinphi = Math.sin(tp);
+        if( rho == 0.0 ) {
+    		  phi_l = Math.asin(cosphi * this.sinX1);
+        } else {
+    		  phi_l = Math.asin(cosphi * this.sinX1 + (y * sinphi * this.cosX1 / rho));
+        }
+
+    		tp = Math.tan(.5 * (Proj4js.common.HALF_PI + phi_l));
+    		x *= sinphi;
+    		y = rho * this.cosX1 * cosphi - y * this.sinX1* sinphi;
+    		pi2 = Proj4js.common.HALF_PI;
+    		halfe = .5 * this.e;
+    		break;
+    	case this.N_POLE:
+    		y = -y;
+    	case this.S_POLE:
+        tp = - rho / this.akm1;
+    		phi_l = Proj4js.common.HALF_PI - 2. * Math.atan(tp);
+    		pi2 = -Proj4js.common.HALF_PI;
+    		halfe = -.5 * this.e;
+    		break;
+    	}
+    	for (i = this.NITER; i--; phi_l = lat) { //check this
+    		sinphi = this.e * Math.sin(phi_l);
+    		lat = 2. * Math.atan(tp * Math.pow((1.+sinphi)/(1.-sinphi), halfe)) - pi2;
+    		if (Math.abs(phi_l - lat) < this.CONV) {
+    			if (this.mode == this.S_POLE) lat = -lat;
+    			lon = (x == 0. && y == 0.) ? 0. : Math.atan2(x, y);
+          p.x = Proj4js.common.adjust_lon(lon + this.long0);
+          p.y = lat;
+    			return p;
+    		}
+    	}
+    }
+  }
+}; 
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gauss.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gauss.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gauss.js	(revision 76)
@@ -0,0 +1,44 @@
+
+Proj4js.Proj.gauss = {
+
+  init : function() {
+    sphi = Math.sin(this.lat0);
+    cphi = Math.cos(this.lat0);  
+    cphi *= cphi;
+    this.rc = Math.sqrt(1.0 - this.es) / (1.0 - this.es * sphi * sphi);
+    this.C = Math.sqrt(1.0 + this.es * cphi * cphi / (1.0 - this.es));
+    this.phic0 = Math.asin(sphi / this.C);
+    this.ratexp = 0.5 * this.C * this.e;
+    this.K = Math.tan(0.5 * this.phic0 + Proj4js.common.FORTPI) / (Math.pow(Math.tan(0.5*this.lat0 + Proj4js.common.FORTPI), this.C) * Proj4js.common.srat(this.e*sphi, this.ratexp));
+  },
+
+  forward : function(p) {
+    var lon = p.x;
+    var lat = p.y;
+
+    p.y = 2.0 * Math.atan( this.K * Math.pow(Math.tan(0.5 * lat + Proj4js.common.FORTPI), this.C) * Proj4js.common.srat(this.e * Math.sin(lat), this.ratexp) ) - Proj4js.common.HALF_PI;
+    p.x = this.C * lon;
+    return p;
+  },
+
+  inverse : function(p) {
+    var DEL_TOL = 1e-14;
+    var lon = p.x / this.C;
+    var lat = p.y;
+    num = Math.pow(Math.tan(0.5 * lat + Proj4js.common.FORTPI)/this.K, 1./this.C);
+    for (var i = Proj4js.common.MAX_ITER; i>0; --i) {
+      lat = 2.0 * Math.atan(num * Proj4js.common.srat(this.e * Math.sin(p.y), -0.5 * this.e)) - Proj4js.common.HALF_PI;
+      if (Math.abs(lat - p.y) < DEL_TOL) break;
+      p.y = lat;
+    }	
+    /* convergence failed */
+    if (!i) {
+      Proj4js.reportError("gauss:inverse:convergence failed");
+      return null;
+    }
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sterea.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sterea.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/sterea.js	(revision 76)
@@ -0,0 +1,56 @@
+
+Proj4js.Proj.sterea = {
+  dependsOn : 'gauss',
+
+  init : function() {
+    Proj4js.Proj['gauss'].init.apply(this);
+    if (!this.rc) {
+      Proj4js.reportError("sterea:init:E_ERROR_0");
+      return;
+    }
+    this.sinc0 = Math.sin(this.phic0);
+    this.cosc0 = Math.cos(this.phic0);
+    this.R2 = 2.0 * this.rc;
+    if (!this.title) this.title = "Oblique Stereographic Alternative";
+  },
+
+  forward : function(p) {
+    p.x = Proj4js.common.adjust_lon(p.x-this.long0); /* adjust del longitude */
+    Proj4js.Proj['gauss'].forward.apply(this, [p]);
+    sinc = Math.sin(p.y);
+    cosc = Math.cos(p.y);
+    cosl = Math.cos(p.x);
+    k = this.k0 * this.R2 / (1.0 + this.sinc0 * sinc + this.cosc0 * cosc * cosl);
+    p.x = k * cosc * Math.sin(p.x);
+    p.y = k * (this.cosc0 * sinc - this.sinc0 * cosc * cosl);
+    p.x = this.a * p.x + this.x0;
+    p.y = this.a * p.y + this.y0;
+    return p;
+  },
+
+  inverse : function(p) {
+    var lon,lat;
+    p.x = (p.x - this.x0) / this.a; /* descale and de-offset */
+    p.y = (p.y - this.y0) / this.a;
+
+    p.x /= this.k0;
+    p.y /= this.k0;
+    if ( (rho = Math.sqrt(p.x*p.x + p.y*p.y)) ) {
+      c = 2.0 * Math.atan2(rho, this.R2);
+      sinc = Math.sin(c);
+      cosc = Math.cos(c);
+      lat = Math.asin(cosc * this.sinc0 + p.y * sinc * this.cosc0 / rho);
+      lon = Math.atan2(p.x * sinc, rho * this.cosc0 * cosc - p.y * this.sinc0 * sinc);
+    } else {
+      lat = this.phic0;
+      lon = 0.;
+    }
+
+    p.x = lon;
+    p.y = lat;
+    Proj4js.Proj['gauss'].inverse.apply(this,[p]);
+    p.x = Proj4js.common.adjust_lon(p.x + this.long0); /* adjust longitude to CM */
+    return p;
+  }
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/poly.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/poly.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/poly.js	(revision 76)
@@ -0,0 +1,157 @@
+/* Function to compute, phi4, the latitude for the inverse of the
+   Polyconic projection.
+------------------------------------------------------------*/
+function phi4z (eccent,e0,e1,e2,e3,a,b,c,phi) {
+	var sinphi, sin2ph, tanph, ml, mlp, con1, con2, con3, dphi, i;
+
+	phi = a;
+	for (i = 1; i <= 15; i++) {
+		sinphi = Math.sin(phi);
+		tanphi = Math.tan(phi);
+		c = tanphi * Math.sqrt (1.0 - eccent * sinphi * sinphi);
+		sin2ph = Math.sin (2.0 * phi);
+		/*
+		ml = e0 * *phi - e1 * sin2ph + e2 * sin (4.0 *  *phi);
+		mlp = e0 - 2.0 * e1 * cos (2.0 *  *phi) + 4.0 * e2 *  cos (4.0 *  *phi);
+		*/
+		ml = e0 * phi - e1 * sin2ph + e2 * Math.sin (4.0 *  phi) - e3 * Math.sin (6.0 * phi);
+		mlp = e0 - 2.0 * e1 * Math.cos (2.0 *  phi) + 4.0 * e2 * Math.cos (4.0 *  phi) - 6.0 * e3 * Math.cos (6.0 *  phi);
+		con1 = 2.0 * ml + c * (ml * ml + b) - 2.0 * a *  (c * ml + 1.0);
+		con2 = eccent * sin2ph * (ml * ml + b - 2.0 * a * ml) / (2.0 *c);
+		con3 = 2.0 * (a - ml) * (c * mlp - 2.0 / sin2ph) - 2.0 * mlp;
+		dphi = con1 / (con2 + con3);
+		phi += dphi;
+		if (Math.abs(dphi) <= .0000000001 ) return(phi);   
+	}
+	Proj4js.reportError("phi4z: No convergence");
+	return null;
+}
+
+
+/* Function to compute the constant e4 from the input of the eccentricity
+   of the spheroid, x.  This constant is used in the Polar Stereographic
+   projection.
+--------------------------------------------------------------------*/
+function e4fn(x) {
+	var con, com;
+	con = 1.0 + x;
+	com = 1.0 - x;
+	return (Math.sqrt((Math.pow(con,con))*(Math.pow(com,com))));
+}
+
+
+
+
+
+/*******************************************************************************
+NAME                             POLYCONIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Polyconic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.poly = {
+
+	/* Initialize the POLYCONIC projection
+	  ----------------------------------*/
+	init: function() {
+		var temp;			/* temporary variable		*/
+		if (this.lat0=0) this.lat0=90;//this.lat0 ca
+
+		/* Place parameters in static storage for common use
+		  -------------------------------------------------*/
+		this.temp = this.b / this.a;
+		this.es = 1.0 - Math.pow(this.temp,2);// devait etre dans tmerc.js mais n y est pas donc je commente sinon retour de valeurs nulles 
+		this.e = Math.sqrt(this.es);
+		this.e0 = Proj4js.common.e0fn(this.es);
+		this.e1 = Proj4js.common.e1fn(this.es);
+		this.e2 = Proj4js.common.e2fn(this.es);
+		this.e3 = Proj4js.common.e3fn(this.es);
+		this.ml0 = Proj4js.common.mlfn(this.e0, this.e1,this.e2, this.e3, this.lat0);//si que des zeros le calcul ne se fait pas
+		//if (!this.ml0) {this.ml0=0;}
+	},
+
+
+	/* Polyconic forward equations--mapping lat,long to x,y
+	  ---------------------------------------------------*/
+	forward: function(p) {
+		var sinphi, cosphi;	/* sin and cos value				*/
+		var al;				/* temporary values				*/
+		var c;				/* temporary values				*/
+		var con, ml;		/* cone constant, small m			*/
+		var ms;				/* small m					*/
+		var x,y;
+
+		var lon=p.x;
+		var lat=p.y;	
+
+		con = Proj4js.common.adjust_lon(lon - this.long0);
+		if (Math.abs(lat) <= .0000001) {
+			x = this.x0 + this.a * con;
+			y = this.y0 - this.a * this.ml0;
+		} else {
+			sinphi = Math.sin(lat);
+			cosphi = Math.cos(lat);	   
+
+			ml = Proj4js.common.mlfn(this.e0, this.e1, this.e2, this.e3, lat);
+			ms = Proj4js.common.msfnz(this.e,sinphi,cosphi);
+			con = sinphi;
+			x = this.x0 + this.a * ms * Math.sin(con)/sinphi;
+			y = this.y0 + this.a * (ml - this.ml0 + ms * (1.0 - Math.cos(con))/sinphi);
+		}
+
+		p.x=x;
+		p.y=y;   
+		return p;
+	},
+
+
+	/* Inverse equations
+	-----------------*/
+	inverse: function(p) {
+		var sin_phi, cos_phi;	/* sin and cos value				*/
+		var al;					/* temporary values				*/
+		var b;					/* temporary values				*/
+		var c;					/* temporary values				*/
+		var con, ml;			/* cone constant, small m			*/
+		var iflg;				/* error flag					*/
+		var lon,lat;
+		p.x -= this.x0;
+		p.y -= this.y0;
+		al = this.ml0 + p.y/this.a;
+		iflg = 0;
+
+		if (Math.abs(al) <= .0000001) {
+			lon = p.x/this.a + this.long0;
+			lat = 0.0;
+		} else {
+			b = al * al + (p.x/this.a) * (p.x/this.a);
+			iflg = phi4z(this.es,this.e0,this.e1,this.e2,this.e3,this.al,b,c,lat);
+			if (iflg != 1) return(iflg);
+			lon = Proj4js.common.adjust_lon((Proj4js.common.asinz(p.x * c / this.a) / Math.sin(lat)) + this.long0);
+		}
+
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
+
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aea.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aea.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/aea.js	(revision 76)
@@ -0,0 +1,149 @@
+/*******************************************************************************
+NAME                     ALBERS CONICAL EQUAL AREA 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and Northing
+		for the Albers Conical Equal Area projection.  The longitude
+		and latitude must be in radians.  The Easting and Northing
+		values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan,       	Feb, 1992
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+
+Proj4js.Proj.aea = {
+  init : function() {
+
+    if (Math.abs(this.lat1 + this.lat2) < Proj4js.common.EPSLN) {
+       Proj4js.reportError("aeaInitEqualLatitudes");
+       return;
+    }
+    this.temp = this.b / this.a;
+    this.es = 1.0 - Math.pow(this.temp,2);
+    this.e3 = Math.sqrt(this.es);
+
+    this.sin_po=Math.sin(this.lat1);
+    this.cos_po=Math.cos(this.lat1);
+    this.t1=this.sin_po;
+    this.con = this.sin_po;
+    this.ms1 = Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);
+    this.qs1 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    this.sin_po=Math.sin(this.lat2);
+    this.cos_po=Math.cos(this.lat2);
+    this.t2=this.sin_po;
+    this.ms2 = Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);
+    this.qs2 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    this.sin_po=Math.sin(this.lat0);
+    this.cos_po=Math.cos(this.lat0);
+    this.t3=this.sin_po;
+    this.qs0 = Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);
+
+    if (Math.abs(this.lat1 - this.lat2) > Proj4js.common.EPSLN) {
+      this.ns0 = (this.ms1 * this.ms1 - this.ms2 *this.ms2)/ (this.qs2 - this.qs1);
+    } else {
+      this.ns0 = this.con;
+    }
+    this.c = this.ms1 * this.ms1 + this.ns0 * this.qs1;
+    this.rh = this.a * Math.sqrt(this.c - this.ns0 * this.qs0)/this.ns0;
+  },
+
+/* Albers Conical Equal Area forward equations--mapping lat,long to x,y
+  -------------------------------------------------------------------*/
+  forward: function(p){
+
+    var lon=p.x;
+    var lat=p.y;
+
+    this.sin_phi=Math.sin(lat);
+    this.cos_phi=Math.cos(lat);
+
+    var qs = Proj4js.common.qsfnz(this.e3,this.sin_phi,this.cos_phi);
+    var rh1 =this.a * Math.sqrt(this.c - this.ns0 * qs)/this.ns0;
+    var theta = this.ns0 * Proj4js.common.adjust_lon(lon - this.long0); 
+    var x = rh1 * Math.sin(theta) + this.x0;
+    var y = this.rh - rh1 * Math.cos(theta) + this.y0;
+
+    p.x = x; 
+    p.y = y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh1,qs,con,theta,lon,lat;
+
+    p.x -= this.x0;
+    p.y = this.rh - p.y + this.y0;
+    if (this.ns0 >= 0) {
+      rh1 = Math.sqrt(p.x *p.x + p.y * p.y);
+      con = 1.0;
+    } else {
+      rh1 = -Math.sqrt(p.x * p.x + p.y *p.y);
+      con = -1.0;
+    }
+    theta = 0.0;
+    if (rh1 != 0.0) {
+      theta = Math.atan2(con * p.x, con * p.y);
+    }
+    con = rh1 * this.ns0 / this.a;
+    qs = (this.c - con * con) / this.ns0;
+    if (this.e3 >= 1e-10) {
+      con = 1 - .5 * (1.0 -this.es) * Math.log((1.0 - this.e3) / (1.0 + this.e3))/this.e3;
+      if (Math.abs(Math.abs(con) - Math.abs(qs)) > .0000000001 ) {
+          lat = this.phi1z(this.e3,qs);
+      } else {
+          if (qs >= 0) {
+             lat = .5 * PI;
+          } else {
+             lat = -.5 * PI;
+          }
+      }
+    } else {
+      lat = this.phi1z(e3,qs);
+    }
+
+    lon = Proj4js.common.adjust_lon(theta/this.ns0 + this.long0);
+    p.x = lon;
+    p.y = lat;
+    return p;
+  },
+  
+/* Function to compute phi1, the latitude for the inverse of the
+   Albers Conical Equal-Area projection.
+-------------------------------------------*/
+  phi1z: function (eccent,qs) {
+    var con, com, dphi;
+    var phi = Proj4js.common.asinz(.5 * qs);
+    if (eccent < Proj4js.common.EPSLN) return phi;
+    
+    var eccnts = eccent * eccent; 
+    for (var i = 1; i <= 25; i++) {
+        sinphi = Math.sin(phi);
+        cosphi = Math.cos(phi);
+        con = eccent * sinphi; 
+        com = 1.0 - con * con;
+        dphi = .5 * com * com / cosphi * (qs / (1.0 - eccnts) - sinphi / com + .5 / eccent * Math.log((1.0 - con) / (1.0 + con)));
+        phi = phi + dphi;
+        if (Math.abs(dphi) <= 1e-7) return phi;
+    }
+    Proj4js.reportError("aea:phi1z:Convergence error");
+    return null;
+  }
+  
+};
+
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/merc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/merc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/merc.js	(revision 76)
@@ -0,0 +1,115 @@
+/*******************************************************************************
+NAME                            MERCATOR
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Mercator projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+D. Steinwand, EROS      Nov, 1991
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+//static double r_major = a;		   /* major axis 				*/
+//static double r_minor = b;		   /* minor axis 				*/
+//static double lon_center = long0;	   /* Center longitude (projection center) */
+//static double lat_origin =  lat0;	   /* center latitude			*/
+//static double e,es;		           /* eccentricity constants		*/
+//static double m1;		               /* small value m			*/
+//static double false_northing = y0;   /* y offset in meters			*/
+//static double false_easting = x0;	   /* x offset in meters			*/
+//scale_fact = k0 
+
+Proj4js.Proj.merc = {
+  init : function() {
+	//?this.temp = this.r_minor / this.r_major;
+	//this.temp = this.b / this.a;
+	//this.es = 1.0 - Math.sqrt(this.temp);
+	//this.e = Math.sqrt( this.es );
+	//?this.m1 = Math.cos(this.lat_origin) / (Math.sqrt( 1.0 - this.es * Math.sin(this.lat_origin) * Math.sin(this.lat_origin)));
+	//this.m1 = Math.cos(0.0) / (Math.sqrt( 1.0 - this.es * Math.sin(0.0) * Math.sin(0.0)));
+    if (this.lat_ts) {
+      if (this.sphere) {
+        this.k0 = Math.cos(this.lat_ts);
+      } else {
+        this.k0 = Proj4js.common.msfnz(this.es, Math.sin(this.lat_ts), Math.cos(this.lat_ts));
+      }
+    }
+  },
+
+/* Mercator forward equations--mapping lat,long to x,y
+  --------------------------------------------------*/
+
+  forward : function(p) {	
+    //alert("ll2m coords : "+coords);
+    var lon = p.x;
+    var lat = p.y;
+    // convert to radians
+    if ( lat*Proj4js.common.R2D > 90.0 && 
+          lat*Proj4js.common.R2D < -90.0 && 
+          lon*Proj4js.common.R2D > 180.0 && 
+          lon*Proj4js.common.R2D < -180.0) {
+      Proj4js.reportError("merc:forward: llInputOutOfRange: "+ lon +" : " + lat);
+      return null;
+    }
+
+    var x,y;
+    if(Math.abs( Math.abs(lat) - Proj4js.common.HALF_PI)  <= Proj4js.common.EPSLN) {
+      Proj4js.reportError("merc:forward: ll2mAtPoles");
+      return null;
+    } else {
+      if (this.sphere) {
+        x = this.x0 + this.a * this.k0 * Proj4js.common.adjust_lon(lon - this.long0);
+        y = this.y0 + this.a * this.k0 * Math.log(Math.tan(Proj4js.common.FORTPI + 0.5*lat));
+      } else {
+        var sinphi = Math.sin(lat);
+        var ts = Proj4js.common.tsfnz(this.e,lat,sinphi);
+        x = this.x0 + this.a * this.k0 * Proj4js.common.adjust_lon(lon - this.long0);
+        y = this.y0 - this.a * this.k0 * Math.log(ts);
+      }
+      p.x = x; 
+      p.y = y;
+      return p;
+    }
+  },
+
+
+  /* Mercator inverse equations--mapping x,y to lat/long
+  --------------------------------------------------*/
+  inverse : function(p) {	
+
+    var x = p.x - this.x0;
+    var y = p.y - this.y0;
+    var lon,lat;
+
+    if (this.sphere) {
+      lat = Proj4js.common.HALF_PI - 2.0 * Math.atan(Math.exp(-y / this.a * this.k0));
+    } else {
+      var ts = Math.exp(-y / (this.a * this.k0));
+      lat = Proj4js.common.phi2z(this.e,ts);
+      if(lat == -9999) {
+        Proj4js.reportError("merc:inverse: lat = -9999");
+        return null;
+      }
+    }
+    lon = Proj4js.common.adjust_lon(this.long0+ x / (this.a * this.k0));
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cea.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cea.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cea.js	(revision 76)
@@ -0,0 +1,85 @@
+/*******************************************************************************
+NAME                    LAMBERT CYLINDRICAL EQUAL AREA
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Cylindrical Equal Area projection.
+                This class of projection includes the Behrmann and 
+                Gall-Peters Projections.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----
+R. Marsden              August 2009
+Winwaed Software Tech LLC, http://www.winwaed.com
+
+This function was adapted from the Miller Cylindrical Projection in the Proj4JS
+library.
+
+Note: This implementation assumes a Spherical Earth. The (commented) code 
+has been included for the ellipsoidal forward transform, but derivation of 
+the ellispoidal inverse transform is beyond me. Note that most of the 
+Proj4JS implementations do NOT currently support ellipsoidal figures. 
+Therefore this is not seen as a problem - especially this lack of support 
+is explicitly stated here.
+ 
+ALGORITHM REFERENCES
+
+1.  "Cartographic Projection Procedures for the UNIX Environment - 
+     A User's Manual" by Gerald I. Evenden, USGS Open File Report 90-284
+    and Release 4 Interim Reports (2003)
+
+2.  Snyder, John P., "Flattening the Earth - Two Thousand Years of Map 
+    Projections", Univ. Chicago Press, 1993
+*******************************************************************************/
+
+Proj4js.Proj.cea = {
+
+/* Initialize the Cylindrical Equal Area projection
+  -------------------------------------------*/
+  init: function() {
+    //no-op
+  },
+
+
+  /* Cylindrical Equal Area forward equations--mapping lat,long to x,y
+    ------------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon -this.long0);
+    var x = this.x0 + this.a * dlon * Math.cos(this.lat_ts);
+    var y = this.y0 + this.a * Math.sin(lat) / Math.cos(this.lat_ts);
+   /* Elliptical Forward Transform
+      Not implemented due to a lack of a matchign inverse function
+    {
+      var Sin_Lat = Math.sin(lat);
+      var Rn = this.a * (Math.sqrt(1.0e0 - this.es * Sin_Lat * Sin_Lat ));
+      x = this.x0 + this.a * dlon * Math.cos(this.lat_ts);
+      y = this.y0 + Rn * Math.sin(lat) / Math.cos(this.lat_ts);
+    }
+   */
+
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },//ceaFwd()
+
+  /* Cylindrical Equal Area inverse equations--mapping x,y to lat/long
+    ------------------------------------------------------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var lon = Proj4js.common.adjust_lon( this.long0 + (p.x / this.a) / Math.cos(this.lat_ts) );
+
+    var lat = Math.asin( (p.y/this.a) * Math.cos(this.lat_ts) );
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }//ceaInv()
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/somerc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/somerc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/somerc.js	(revision 76)
@@ -0,0 +1,110 @@
+/*******************************************************************************
+NAME                       SWISS OBLIQUE MERCATOR
+
+PURPOSE:	Swiss projection.
+WARNING:  X and Y are inverted (weird) in the swiss coordinate system. Not
+   here, since we want X to be horizontal and Y vertical.
+
+ALGORITHM REFERENCES
+1. "Formules et constantes pour le Calcul pour la
+ projection cylindrique conforme Ã  axe oblique et pour la transformation entre
+ des systÃšmes de rÃ©fÃ©rence".
+ http://www.swisstopo.admin.ch/internet/swisstopo/fr/home/topics/survey/sys/refsys/switzerland.parsysrelated1.31216.downloadList.77004.DownloadFile.tmp/swissprojectionfr.pdf
+
+*******************************************************************************/
+
+Proj4js.Proj.somerc = {
+
+  init: function() {
+    var phy0 = this.lat0;
+    this.lambda0 = this.long0;
+    var sinPhy0 = Math.sin(phy0);
+    var semiMajorAxis = this.a;
+    var invF = this.rf;
+    var flattening = 1 / invF;
+    var e2 = 2 * flattening - Math.pow(flattening, 2);
+    var e = this.e = Math.sqrt(e2);
+    this.R = this.k0 * semiMajorAxis * Math.sqrt(1 - e2) / (1 - e2 * Math.pow(sinPhy0, 2.0));
+    this.alpha = Math.sqrt(1 + e2 / (1 - e2) * Math.pow(Math.cos(phy0), 4.0));
+    this.b0 = Math.asin(sinPhy0 / this.alpha);
+    this.K = Math.log(Math.tan(Math.PI / 4.0 + this.b0 / 2.0))
+            - this.alpha
+            * Math.log(Math.tan(Math.PI / 4.0 + phy0 / 2.0))
+            + this.alpha
+            * e / 2
+            * Math.log((1 + e * sinPhy0)
+            / (1 - e * sinPhy0));
+  },
+
+
+  forward: function(p) {
+    var Sa1 = Math.log(Math.tan(Math.PI / 4.0 - p.y / 2.0));
+    var Sa2 = this.e / 2.0
+            * Math.log((1 + this.e * Math.sin(p.y))
+            / (1 - this.e * Math.sin(p.y)));
+    var S = -this.alpha * (Sa1 + Sa2) + this.K;
+
+        // spheric latitude
+    var b = 2.0 * (Math.atan(Math.exp(S)) - Math.PI / 4.0);
+
+        // spheric longitude
+    var I = this.alpha * (p.x - this.lambda0);
+
+        // psoeudo equatorial rotation
+    var rotI = Math.atan(Math.sin(I)
+            / (Math.sin(this.b0) * Math.tan(b) +
+               Math.cos(this.b0) * Math.cos(I)));
+
+    var rotB = Math.asin(Math.cos(this.b0) * Math.sin(b) -
+                         Math.sin(this.b0) * Math.cos(b) * Math.cos(I));
+
+    p.y = this.R / 2.0
+            * Math.log((1 + Math.sin(rotB)) / (1 - Math.sin(rotB)))
+            + this.y0;
+    p.x = this.R * rotI + this.x0;
+    return p;
+  },
+
+  inverse: function(p) {
+    var Y = p.x - this.x0;
+    var X = p.y - this.y0;
+
+    var rotI = Y / this.R;
+    var rotB = 2 * (Math.atan(Math.exp(X / this.R)) - Math.PI / 4.0);
+
+    var b = Math.asin(Math.cos(this.b0) * Math.sin(rotB)
+            + Math.sin(this.b0) * Math.cos(rotB) * Math.cos(rotI));
+    var I = Math.atan(Math.sin(rotI)
+            / (Math.cos(this.b0) * Math.cos(rotI) - Math.sin(this.b0)
+            * Math.tan(rotB)));
+
+    var lambda = this.lambda0 + I / this.alpha;
+
+    var S = 0.0;
+    var phy = b;
+    var prevPhy = -1000.0;
+    var iteration = 0;
+    while (Math.abs(phy - prevPhy) > 0.0000001)
+    {
+      if (++iteration > 20)
+      {
+        Proj4js.reportError("omercFwdInfinity");
+        return;
+      }
+      //S = Math.log(Math.tan(Math.PI / 4.0 + phy / 2.0));
+      S = 1.0
+              / this.alpha
+              * (Math.log(Math.tan(Math.PI / 4.0 + b / 2.0)) - this.K)
+              + this.e
+              * Math.log(Math.tan(Math.PI / 4.0
+              + Math.asin(this.e * Math.sin(phy))
+              / 2.0));
+      prevPhy = phy;
+      phy = 2.0 * Math.atan(Math.exp(S)) - Math.PI / 2.0;
+    }
+
+    p.x = lambda;
+    p.y = phy;
+    return p;
+  }
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cass.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cass.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/cass.js	(revision 76)
@@ -0,0 +1,162 @@
+/*******************************************************************************
+NAME                            CASSINI
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Cassini projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+    Ported from PROJ.4.
+
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+*******************************************************************************/
+
+
+//Proj4js.defs["EPSG:28191"] = "+proj=cass +lat_0=31.73409694444445 +lon_0=35.21208055555556 +x_0=170251.555 +y_0=126867.909 +a=6378300.789 +b=6356566.435 +towgs84=-275.722,94.7824,340.894,-8.001,-4.42,-11.821,1 +units=m +no_defs";
+
+// Initialize the Cassini projection
+// -----------------------------------------------------------------
+
+Proj4js.Proj.cass = {
+  init : function() {
+    if (!this.sphere) {
+      this.en = this.pj_enfn(this.es)
+      this.m0 = this.pj_mlfn(this.lat0, Math.sin(this.lat0), Math.cos(this.lat0), this.en);
+    }
+  },
+
+  C1:	.16666666666666666666,
+  C2:	.00833333333333333333,
+  C3:	.04166666666666666666,
+  C4:	.33333333333333333333,
+  C5:	.06666666666666666666,
+
+
+/* Cassini forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var x,y;
+    var lam=p.x;
+    var phi=p.y;
+    lam = Proj4js.common.adjust_lon(lam - this.long0);
+    
+    if (this.sphere) {
+      x = Math.asin(Math.cos(phi) * Math.sin(lam));
+      y = Math.atan2(Math.tan(phi) , Math.cos(lam)) - this.phi0;
+    } else {
+        //ellipsoid
+      this.n = Math.sin(phi);
+      this.c = Math.cos(phi);
+      y = this.pj_mlfn(phi, this.n, this.c, this.en);
+      this.n = 1./Math.sqrt(1. - this.es * this.n * this.n);
+      this.tn = Math.tan(phi); 
+      this.t = this.tn * this.tn;
+      this.a1 = lam * this.c;
+      this.c *= this.es * this.c / (1 - this.es);
+      this.a2 = this.a1 * this.a1;
+      x = this.n * this.a1 * (1. - this.a2 * this.t * (this.C1 - (8. - this.t + 8. * this.c) * this.a2 * this.C2));
+      y -= this.m0 - this.n * this.tn * this.a2 * (.5 + (5. - this.t + 6. * this.c) * this.a2 * this.C3);
+    }
+    
+    p.x = this.a*x + this.x0;
+    p.y = this.a*y + this.y0;
+    return p;
+  },//cassFwd()
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var x = p.x/this.a;
+    var y = p.y/this.a;
+    
+    if (this.sphere) {
+      this.dd = y + this.lat0;
+      phi = Math.asin(Math.sin(this.dd) * Math.cos(x));
+      lam = Math.atan2(Math.tan(x), Math.cos(this.dd));
+    } else {
+      /* ellipsoid */
+      ph1 = this.pj_inv_mlfn(this.m0 + y, this.es, this.en);
+      this.tn = Math.tan(ph1); 
+      this.t = this.tn * this.tn;
+      this.n = Math.sin(ph1);
+      this.r = 1. / (1. - this.es * this.n * this.n);
+      this.n = Math.sqrt(this.r);
+      this.r *= (1. - this.es) * this.n;
+      this.dd = x / this.n;
+      this.d2 = this.dd * this.dd;
+      phi = ph1 - (this.n * this.tn / this.r) * this.d2 * (.5 - (1. + 3. * this.t) * this.d2 * this.C3);
+      lam = this.dd * (1. + this.t * this.d2 * (-this.C4 + (1. + 3. * this.t) * this.d2 * this.C5)) / Math.cos(ph1);
+    }
+    p.x = Proj4js.common.adjust_lon(this.long0+lam);
+    p.y = phi;
+    return p;
+  },//lamazInv()
+
+
+  //code from the PROJ.4 pj_mlfn.c file;  this may be useful for other projections
+  pj_enfn: function(es) {
+    en = new Array();
+    en[0] = this.C00 - es * (this.C02 + es * (this.C04 + es * (this.C06 + es * this.C08)));
+    en[1] = es * (this.C22 - es * (this.C04 + es * (this.C06 + es * this.C08)));
+    var t = es * es;
+    en[2] = t * (this.C44 - es * (this.C46 + es * this.C48));
+    t *= es;
+    en[3] = t * (this.C66 - es * this.C68);
+    en[4] = t * es * this.C88;
+    return en;
+  },
+  
+  pj_mlfn: function(phi, sphi, cphi, en) {
+    cphi *= sphi;
+    sphi *= sphi;
+    return(en[0] * phi - cphi * (en[1] + sphi*(en[2]+ sphi*(en[3] + sphi*en[4]))));
+  },
+  
+  pj_inv_mlfn: function(arg, es, en) {
+    k = 1./(1.-es);
+    phi = arg;
+    for (i = Proj4js.common.MAX_ITER; i ; --i) { /* rarely goes over 2 iterations */
+      s = Math.sin(phi);
+      t = 1. - es * s * s;
+      //t = this.pj_mlfn(phi, s, Math.cos(phi), en) - arg;
+      //phi -= t * (t * Math.sqrt(t)) * k;
+      t = (this.pj_mlfn(phi, s, Math.cos(phi), en) - arg) * (t * Math.sqrt(t)) * k;
+      phi -= t;
+      if (Math.abs(t) < Proj4js.common.EPSLN)
+        return phi;
+    }
+    Proj4js.reportError("cass:pj_inv_mlfn: Convergence error");
+    return phi;
+  },
+
+/* meridinal distance for ellipsoid and inverse
+**	8th degree - accurate to < 1e-5 meters when used in conjuction
+**		with typical major axis values.
+**	Inverse determines phi to EPS (1e-11) radians, about 1e-6 seconds.
+*/
+  C00: 1.0,
+  C02: .25,
+  C04: .046875,
+  C06: .01953125,
+  C08: .01068115234375,
+  C22: .75,
+  C44: .46875,
+  C46: .01302083333333333333,
+  C48: .00712076822916666666,
+  C66: .36458333333333333333,
+  C68: .00569661458333333333,
+  C88: .3076171875
+
+}
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/ortho.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/ortho.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/ortho.js	(revision 76)
@@ -0,0 +1,110 @@
+/*******************************************************************************
+NAME                             ORTHOGRAPHIC 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Orthographic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+
+Proj4js.Proj.ortho = {
+
+  /* Initialize the Orthographic projection
+    -------------------------------------*/
+  init: function(def) {
+    //double temp;			/* temporary variable		*/
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/;
+    this.sin_p14=Math.sin(this.lat0);
+    this.cos_p14=Math.cos(this.lat0);	
+  },
+
+
+  /* Orthographic forward equations--mapping lat,long to x,y
+    ---------------------------------------------------*/
+  forward: function(p) {
+    var sinphi, cosphi;	/* sin and cos value				*/
+    var dlon;		/* delta longitude value			*/
+    var coslon;		/* cos of longitude				*/
+    var ksp;		/* scale factor					*/
+    var g;		
+    var lon=p.x;
+    var lat=p.y;	
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon - this.long0);
+
+    sinphi=Math.sin(lat);
+    cosphi=Math.cos(lat);	
+
+    coslon = Math.cos(dlon);
+    g = this.sin_p14 * sinphi + this.cos_p14 * cosphi * coslon;
+    ksp = 1.0;
+    if ((g > 0) || (Math.abs(g) <= Proj4js.common.EPSLN)) {
+      var x = this.a * ksp * cosphi * Math.sin(dlon);
+      var y = this.y0 + this.a * ksp * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon);
+    } else {
+      Proj4js.reportError("orthoFwdPointError");
+    }
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh;		/* height above ellipsoid			*/
+    var z;		/* angle					*/
+    var sinz,cosz;	/* sin of z and cos of z			*/
+    var temp;
+    var con;
+    var lon , lat;
+    /* Inverse equations
+      -----------------*/
+    p.x -= this.x0;
+    p.y -= this.y0;
+    rh = Math.sqrt(p.x * p.x + p.y * p.y);
+    if (rh > this.a + .0000001) {
+      Proj4js.reportError("orthoInvDataError");
+    }
+    z = Proj4js.common.asinz(rh / this.a);
+
+    sinz=Math.sin(z);
+    cosz=Math.cos(z);
+
+    lon = this.long0;
+    if (Math.abs(rh) <= Proj4js.common.EPSLN) {
+      lat = this.lat0; 
+    }
+    lat = Proj4js.common.asinz(cosz * this.sin_p14 + (p.y * sinz * this.cos_p14)/rh);
+    con = Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+    if (Math.abs(con) <= Proj4js.common.EPSLN) {
+       if (this.lat0 >= 0) {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x, -p.y));
+       } else {
+          lon = Proj4js.common.adjust_lon(this.long0 -Math.atan2(-p.x, p.y));
+       }
+    }
+    con = cosz - this.sin_p14 * Math.sin(lat);
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/mill.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/mill.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/mill.js	(revision 76)
@@ -0,0 +1,68 @@
+/*******************************************************************************
+NAME                    MILLER CYLINDRICAL 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Miller Cylindrical projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+T. Mittan		March, 1993
+
+This function was adapted from the Lambert Azimuthal Equal Area projection
+code (FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.mill = {
+
+/* Initialize the Miller Cylindrical projection
+  -------------------------------------------*/
+  init: function() {
+    //no-op
+  },
+
+
+  /* Miller Cylindrical forward equations--mapping lat,long to x,y
+    ------------------------------------------------------------*/
+  forward: function(p) {
+    var lon=p.x;
+    var lat=p.y;
+    /* Forward equations
+      -----------------*/
+    var dlon = Proj4js.common.adjust_lon(lon -this.long0);
+    var x = this.x0 + this.a * dlon;
+    var y = this.y0 + this.a * Math.log(Math.tan((Proj4js.common.PI / 4.0) + (lat / 2.5))) * 1.25;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },//millFwd()
+
+  /* Miller Cylindrical inverse equations--mapping x,y to lat/long
+    ------------------------------------------------------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+
+    var lon = Proj4js.common.adjust_lon(this.long0 + p.x /this.a);
+    var lat = 2.5 * (Math.atan(Math.exp(0.8*p.y/this.a)) - Proj4js.common.PI / 4.0);
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }//millInv()
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/vandg.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/vandg.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/vandg.js	(revision 76)
@@ -0,0 +1,137 @@
+/*******************************************************************************
+NAME                    VAN DER GRINTEN 
+
+PURPOSE:	Transforms input Easting and Northing to longitude and
+		latitude for the Van der Grinten projection.  The
+		Easting and Northing must be in meters.  The longitude
+		and latitude values will be returned in radians.
+
+PROGRAMMER              DATE            
+----------              ----           
+T. Mittan		March, 1993
+
+This function was adapted from the Van Der Grinten projection code
+(FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.vandg = {
+
+/* Initialize the Van Der Grinten projection
+  ----------------------------------------*/
+	init: function() {
+		this.R = 6370997.0; //Radius of earth
+	},
+
+	forward: function(p) {
+
+		var lon=p.x;
+		var lat=p.y;	
+
+		/* Forward equations
+		-----------------*/
+		var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+		var x,y;
+
+		if (Math.abs(lat) <= Proj4js.common.EPSLN) {
+			x = this.x0  + this.R * dlon;
+			y = this.y0;
+		}
+		var theta = Proj4js.common.asinz(2.0 * Math.abs(lat / Proj4js.common.PI));
+		if ((Math.abs(dlon) <= Proj4js.common.EPSLN) || (Math.abs(Math.abs(lat) - Proj4js.common.HALF_PI) <= Proj4js.common.EPSLN)) {
+			x = this.x0;
+			if (lat >= 0) {
+				y = this.y0 + Proj4js.common.PI * this.R * Math.tan(.5 * theta);
+			} else {
+				y = this.y0 + Proj4js.common.PI * this.R * - Math.tan(.5 * theta);
+			}
+			//  return(OK);
+		}
+		var al = .5 * Math.abs((Proj4js.common.PI / dlon) - (dlon / Proj4js.common.PI));
+		var asq = al * al;
+		var sinth = Math.sin(theta);
+		var costh = Math.cos(theta);
+
+		var g = costh / (sinth + costh - 1.0);
+		var gsq = g * g;
+		var m = g * (2.0 / sinth - 1.0);
+		var msq = m * m;
+		var con = Proj4js.common.PI * this.R * (al * (g - msq) + Math.sqrt(asq * (g - msq) * (g - msq) - (msq + asq) * (gsq - msq))) / (msq + asq);
+		if (dlon < 0) {
+		 con = -con;
+		}
+		x = this.x0 + con;
+		con = Math.abs(con / (Proj4js.common.PI * this.R));
+		if (lat >= 0) {
+		 y = this.y0 + Proj4js.common.PI * this.R * Math.sqrt(1.0 - con * con - 2.0 * al * con);
+		} else {
+		 y = this.y0 - Proj4js.common.PI * this.R * Math.sqrt(1.0 - con * con - 2.0 * al * con);
+		}
+		p.x = x;
+		p.y = y;
+		return p;
+	},
+
+/* Van Der Grinten inverse equations--mapping x,y to lat/long
+  ---------------------------------------------------------*/
+	inverse: function(p) {
+		var dlon;
+		var xx,yy,xys,c1,c2,c3;
+		var al,asq;
+		var a1;
+		var m1;
+		var con;
+		var th1;
+		var d;
+
+		/* inverse equations
+		-----------------*/
+		p.x -= this.x0;
+		p.y -= this.y0;
+		con = Proj4js.common.PI * this.R;
+		xx = p.x / con;
+		yy =p.y / con;
+		xys = xx * xx + yy * yy;
+		c1 = -Math.abs(yy) * (1.0 + xys);
+		c2 = c1 - 2.0 * yy * yy + xx * xx;
+		c3 = -2.0 * c1 + 1.0 + 2.0 * yy * yy + xys * xys;
+		d = yy * yy / c3 + (2.0 * c2 * c2 * c2 / c3 / c3 / c3 - 9.0 * c1 * c2 / c3 /c3) / 27.0;
+		a1 = (c1 - c2 * c2 / 3.0 / c3) / c3;
+		m1 = 2.0 * Math.sqrt( -a1 / 3.0);
+		con = ((3.0 * d) / a1) / m1;
+		if (Math.abs(con) > 1.0) {
+			if (con >= 0.0) {
+				con = 1.0;
+			} else {
+				con = -1.0;
+			}
+		}
+		th1 = Math.acos(con) / 3.0;
+		if (p.y >= 0) {
+			lat = (-m1 *Math.cos(th1 + Proj4js.common.PI / 3.0) - c2 / 3.0 / c3) * Proj4js.common.PI;
+		} else {
+			lat = -(-m1 * Math.cos(th1 + Proj4js.common.PI / 3.0) - c2 / 3.0 / c3) * Proj4js.common.PI;
+		}
+
+		if (Math.abs(xx) < Proj4js.common.EPSLN) {
+			lon = this.long0;
+		}
+		lon = Proj4js.common.adjust_lon(this.long0 + Proj4js.common.PI * (xys - 1.0 + Math.sqrt(1.0 + 2.0 * (xx * xx - yy * yy) + xys * xys)) / 2.0 / xx);
+
+		p.x=lon;
+		p.y=lat;
+		return p;
+	}
+};
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gnom.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gnom.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/gnom.js	(revision 76)
@@ -0,0 +1,116 @@
+/*****************************************************************************
+NAME                             GNOMONIC
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Gnomonic Projection.
+                Implementation based on the existing sterea and ortho
+                implementations.
+
+PROGRAMMER              DATE
+----------              ----
+Richard Marsden         November 2009
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Flattening the Earth - Two Thousand Years of Map 
+    Projections", University of Chicago Press 1993
+
+2.  Wolfram Mathworld "Gnomonic Projection"
+    http://mathworld.wolfram.com/GnomonicProjection.html
+    Accessed: 12th November 2009
+******************************************************************************/
+
+Proj4js.Proj.gnom = {
+
+  /* Initialize the Gnomonic projection
+    -------------------------------------*/
+  init: function(def) {
+
+    /* Place parameters in static storage for common use
+      -------------------------------------------------*/
+    this.sin_p14=Math.sin(this.lat0);
+    this.cos_p14=Math.cos(this.lat0);
+    // Approximation for projecting points to the horizon (infinity)
+    this.infinity_dist = 1000 * this.a;
+    this.rc = 1;
+  },
+
+
+  /* Gnomonic forward equations--mapping lat,long to x,y
+    ---------------------------------------------------*/
+  forward: function(p) {
+    var sinphi, cosphi;	/* sin and cos value				*/
+    var dlon;		/* delta longitude value			*/
+    var coslon;		/* cos of longitude				*/
+    var ksp;		/* scale factor					*/
+    var g;		
+    var lon=p.x;
+    var lat=p.y;	
+    /* Forward equations
+      -----------------*/
+    dlon = Proj4js.common.adjust_lon(lon - this.long0);
+
+    sinphi=Math.sin(lat);
+    cosphi=Math.cos(lat);	
+
+    coslon = Math.cos(dlon);
+    g = this.sin_p14 * sinphi + this.cos_p14 * cosphi * coslon;
+    ksp = 1.0;
+    if ((g > 0) || (Math.abs(g) <= Proj4js.common.EPSLN)) {
+      x = this.x0 + this.a * ksp * cosphi * Math.sin(dlon) / g;
+      y = this.y0 + this.a * ksp * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon) / g;
+    } else {
+      Proj4js.reportError("orthoFwdPointError");
+
+      // Point is in the opposing hemisphere and is unprojectable
+      // We still need to return a reasonable point, so we project 
+      // to infinity, on a bearing 
+      // equivalent to the northern hemisphere equivalent
+      // This is a reasonable approximation for short shapes and lines that 
+      // straddle the horizon.
+
+      x = this.x0 + this.infinity_dist * cosphi * Math.sin(dlon);
+      y = this.y0 + this.infinity_dist * (this.cos_p14 * sinphi - this.sin_p14 * cosphi * coslon);
+
+    }
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+
+  inverse: function(p) {
+    var rh;		/* Rho */
+    var z;		/* angle */
+    var sinc, cosc;
+    var c;
+    var lon , lat;
+
+    /* Inverse equations
+      -----------------*/
+    p.x = (p.x - this.x0) / this.a;
+    p.y = (p.y - this.y0) / this.a;
+
+    p.x /= this.k0;
+    p.y /= this.k0;
+
+    if ( (rh = Math.sqrt(p.x * p.x + p.y * p.y)) ) {
+      c = Math.atan2(rh, this.rc);
+      sinc = Math.sin(c);
+      cosc = Math.cos(c);
+
+      lat = Proj4js.common.asinz(cosc*this.sin_p14 + (p.y*sinc*this.cos_p14) / rh);
+      lon = Math.atan2(p.x*sinc, rh*this.cos_p14*cosc - p.y*this.sin_p14*sinc);
+      lon = Proj4js.common.adjust_lon(this.long0+lon);
+    } else {
+      lat = this.phic0;
+      lon = 0.0;
+    }
+ 
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/lcc.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/lcc.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/lcc.js	(revision 76)
@@ -0,0 +1,148 @@
+/*******************************************************************************
+NAME                            LAMBERT CONFORMAL CONIC
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Conformal Conic projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+*******************************************************************************/
+
+
+//<2104> +proj=lcc +lat_1=10.16666666666667 +lat_0=10.16666666666667 +lon_0=-71.60561777777777 +k_0=1 +x0=-17044 +x0=-23139.97 +ellps=intl +units=m +no_defs  no_defs
+
+// Initialize the Lambert Conformal conic projection
+// -----------------------------------------------------------------
+
+//Proj4js.Proj.lcc = Class.create();
+Proj4js.Proj.lcc = {
+  init : function() {
+
+    // array of:  r_maj,r_min,lat1,lat2,c_lon,c_lat,false_east,false_north
+    //double c_lat;                   /* center latitude                      */
+    //double c_lon;                   /* center longitude                     */
+    //double lat1;                    /* first standard parallel              */
+    //double lat2;                    /* second standard parallel             */
+    //double r_maj;                   /* major axis                           */
+    //double r_min;                   /* minor axis                           */
+    //double false_east;              /* x offset in meters                   */
+    //double false_north;             /* y offset in meters                   */
+
+      if (!this.lat2){this.lat2=this.lat0;}//if lat2 is not defined
+      if (!this.k0) this.k0 = 1.0;
+
+    // Standard Parallels cannot be equal and on opposite sides of the equator
+      if (Math.abs(this.lat1+this.lat2) < Proj4js.common.EPSLN) {
+        Proj4js.reportError("lcc:init: Equal Latitudes");
+        return;
+      }
+
+      var temp = this.b / this.a;
+      this.e = Math.sqrt(1.0 - temp*temp);
+
+      var sin1 = Math.sin(this.lat1);
+      var cos1 = Math.cos(this.lat1);
+      var ms1 = Proj4js.common.msfnz(this.e, sin1, cos1);
+      var ts1 = Proj4js.common.tsfnz(this.e, this.lat1, sin1);
+
+      var sin2 = Math.sin(this.lat2);
+      var cos2 = Math.cos(this.lat2);
+      var ms2 = Proj4js.common.msfnz(this.e, sin2, cos2);
+      var ts2 = Proj4js.common.tsfnz(this.e, this.lat2, sin2);
+
+      var ts0 = Proj4js.common.tsfnz(this.e, this.lat0, Math.sin(this.lat0));
+
+      if (Math.abs(this.lat1 - this.lat2) > Proj4js.common.EPSLN) {
+        this.ns = Math.log(ms1/ms2)/Math.log(ts1/ts2);
+      } else {
+        this.ns = sin1;
+      }
+      this.f0 = ms1 / (this.ns * Math.pow(ts1, this.ns));
+      this.rh = this.a * this.f0 * Math.pow(ts0, this.ns);
+      if (!this.title) this.title = "Lambert Conformal Conic";
+    },
+
+
+    // Lambert Conformal conic forward equations--mapping lat,long to x,y
+    // -----------------------------------------------------------------
+    forward : function(p) {
+
+      var lon = p.x;
+      var lat = p.y;
+
+    // convert to radians
+      if ( lat <= 90.0 && lat >= -90.0 && lon <= 180.0 && lon >= -180.0) {
+        //lon = lon * Proj4js.common.D2R;
+        //lat = lat * Proj4js.common.D2R;
+      } else {
+        Proj4js.reportError("lcc:forward: llInputOutOfRange: "+ lon +" : " + lat);
+        return null;
+      }
+
+      var con  = Math.abs( Math.abs(lat) - Proj4js.common.HALF_PI);
+      var ts, rh1;
+      if (con > Proj4js.common.EPSLN) {
+        ts = Proj4js.common.tsfnz(this.e, lat, Math.sin(lat) );
+        rh1 = this.a * this.f0 * Math.pow(ts, this.ns);
+      } else {
+        con = lat * this.ns;
+        if (con <= 0) {
+          Proj4js.reportError("lcc:forward: No Projection");
+          return null;
+        }
+        rh1 = 0;
+      }
+      var theta = this.ns * Proj4js.common.adjust_lon(lon - this.long0);
+      p.x = this.k0 * (rh1 * Math.sin(theta)) + this.x0;
+      p.y = this.k0 * (this.rh - rh1 * Math.cos(theta)) + this.y0;
+
+      return p;
+    },
+
+  // Lambert Conformal Conic inverse equations--mapping x,y to lat/long
+  // -----------------------------------------------------------------
+  inverse : function(p) {
+
+    var rh1, con, ts;
+    var lat, lon;
+    var x = (p.x - this.x0)/this.k0;
+    var y = (this.rh - (p.y - this.y0)/this.k0);
+    if (this.ns > 0) {
+      rh1 = Math.sqrt (x * x + y * y);
+      con = 1.0;
+    } else {
+      rh1 = -Math.sqrt (x * x + y * y);
+      con = -1.0;
+    }
+    var theta = 0.0;
+    if (rh1 != 0) {
+      theta = Math.atan2((con * x),(con * y));
+    }
+    if ((rh1 != 0) || (this.ns > 0.0)) {
+      con = 1.0/this.ns;
+      ts = Math.pow((rh1/(this.a * this.f0)), con);
+      lat = Proj4js.common.phi2z(this.e, ts);
+      if (lat == -9999) return null;
+    } else {
+      lat = -Proj4js.common.HALF_PI;
+    }
+    lon = Proj4js.common.adjust_lon(theta/this.ns + this.long0);
+
+    p.x = lon;
+    p.y = lat;
+    return p;
+  }
+};
+
+
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/laea.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/laea.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/laea.js	(revision 76)
@@ -0,0 +1,357 @@
+/*******************************************************************************
+NAME                  LAMBERT AZIMUTHAL EQUAL-AREA
+ 
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Lambert Azimuthal Equal-Area projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE            
+----------              ----           
+D. Steinwand, EROS      March, 1991   
+
+This function was adapted from the Lambert Azimuthal Equal Area projection
+code (FORTRAN) in the General Cartographic Transformation Package software
+which is available from the U.S. Geological Survey National Mapping Division.
+ 
+ALGORITHM REFERENCES
+
+1.  "New Equal-Area Map Projections for Noncircular Regions", John P. Snyder,
+    The American Cartographer, Vol 15, No. 4, October 1988, pp. 341-355.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+3.  "Software Documentation for GCTP General Cartographic Transformation
+    Package", U.S. Geological Survey National Mapping Division, May 1982.
+*******************************************************************************/
+
+Proj4js.Proj.laea = {
+  S_POLE: 1,
+  N_POLE: 2,
+  EQUIT: 3,
+  OBLIQ: 4,
+
+
+/* Initialize the Lambert Azimuthal Equal Area projection
+  ------------------------------------------------------*/
+  init: function() {
+    var t = Math.abs(this.lat0);
+    if (Math.abs(t - Proj4js.common.HALF_PI) < Proj4js.common.EPSLN) {
+      this.mode = this.lat0 < 0. ? this.S_POLE : this.N_POLE;
+    } else if (Math.abs(t) < Proj4js.common.EPSLN) {
+      this.mode = this.EQUIT;
+    } else {
+      this.mode = this.OBLIQ;
+    }
+    if (this.es > 0) {
+      var sinphi;
+  
+      this.qp = Proj4js.common.qsfnz(this.e, 1.0);
+      this.mmf = .5 / (1. - this.es);
+      this.apa = this.authset(this.es);
+      switch (this.mode) {
+        case this.N_POLE:
+        case this.S_POLE:
+          this.dd = 1.;
+          break;
+        case this.EQUIT:
+          this.rq = Math.sqrt(.5 * this.qp);
+          this.dd = 1. / this.rq;
+          this.xmf = 1.;
+          this.ymf = .5 * this.qp;
+          break;
+        case this.OBLIQ:
+          this.rq = Math.sqrt(.5 * this.qp);
+          sinphi = Math.sin(this.lat0);
+          this.sinb1 = Proj4js.common.qsfnz(this.e, sinphi) / this.qp;
+          this.cosb1 = Math.sqrt(1. - this.sinb1 * this.sinb1);
+          this.dd = Math.cos(this.lat0) / (Math.sqrt(1. - this.es * sinphi * sinphi) * this.rq * this.cosb1);
+          this.ymf = (this.xmf = this.rq) / this.dd;
+          this.xmf *= this.dd;
+          break;
+      }
+    } else {
+      if (this.mode == this.OBLIQ) {
+        this.sinph0 = Math.sin(this.lat0);
+        this.cosph0 = Math.cos(this.lat0);
+      }
+    }
+  },
+
+/* Lambert Azimuthal Equal Area forward equations--mapping lat,long to x,y
+  -----------------------------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var x,y;
+    var lam=p.x;
+    var phi=p.y;
+    lam = Proj4js.common.adjust_lon(lam - this.long0);
+    
+    if (this.sphere) {
+        var coslam, cosphi, sinphi;
+      
+        sinphi = Math.sin(phi);
+        cosphi = Math.cos(phi);
+        coslam = Math.cos(lam);
+        switch (this.mode) {
+          case this.OBLIQ:
+          case this.EQUIT:
+            y = (this.mode == this.EQUIT) ? 1. + cosphi * coslam : 1. + this.sinph0 * sinphi + this.cosph0 * cosphi * coslam;
+            if (y <= Proj4js.common.EPSLN) {
+              Proj4js.reportError("laea:fwd:y less than eps");
+              return null;
+            }
+            y = Math.sqrt(2. / y);
+            x = y * cosphi * Math.sin(lam);
+            y *= (this.mode == this.EQUIT) ? sinphi : this.cosph0 * sinphi - this.sinph0 * cosphi * coslam;
+            break;
+          case this.N_POLE:
+            coslam = -coslam;
+          case this.S_POLE:
+            if (Math.abs(phi + this.phi0) < Proj4js.common.EPSLN) {
+              Proj4js.reportError("laea:fwd:phi < eps");
+              return null;
+            }
+            y = Proj4js.common.FORTPI - phi * .5;
+            y = 2. * ((this.mode == this.S_POLE) ? Math.cos(y) : Math.sin(y));
+            x = y * Math.sin(lam);
+            y *= coslam;
+            break;
+        }
+    } else {
+        var coslam, sinlam, sinphi, q, sinb=0.0, cosb=0.0, b=0.0;
+      
+        coslam = Math.cos(lam);
+        sinlam = Math.sin(lam);
+        sinphi = Math.sin(phi);
+        q = Proj4js.common.qsfnz(this.e, sinphi);
+        if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+          sinb = q / this.qp;
+          cosb = Math.sqrt(1. - sinb * sinb);
+        }
+        switch (this.mode) {
+          case this.OBLIQ:
+            b = 1. + this.sinb1 * sinb + this.cosb1 * cosb * coslam;
+            break;
+          case this.EQUIT:
+            b = 1. + cosb * coslam;
+            break;
+          case this.N_POLE:
+            b = Proj4js.common.HALF_PI + phi;
+            q = this.qp - q;
+            break;
+          case this.S_POLE:
+            b = phi - Proj4js.common.HALF_PI;
+            q = this.qp + q;
+            break;
+        }
+        if (Math.abs(b) < Proj4js.common.EPSLN) {
+            Proj4js.reportError("laea:fwd:b < eps");
+            return null;
+        }
+        switch (this.mode) {
+          case this.OBLIQ:
+          case this.EQUIT:
+            b = Math.sqrt(2. / b);
+            if (this.mode == this.OBLIQ) {
+              y = this.ymf * b * (this.cosb1 * sinb - this.sinb1 * cosb * coslam);
+            } else {
+              y = (b = Math.sqrt(2. / (1. + cosb * coslam))) * sinb * this.ymf;
+            }
+            x = this.xmf * b * cosb * sinlam;
+            break;
+          case this.N_POLE:
+          case this.S_POLE:
+            if (q >= 0.) {
+              x = (b = Math.sqrt(q)) * sinlam;
+              y = coslam * ((this.mode == this.S_POLE) ? b : -b);
+            } else {
+              x = y = 0.;
+            }
+            break;
+        }
+    }
+
+    //v 1.0
+    /*
+    var sin_lat=Math.sin(lat);
+    var cos_lat=Math.cos(lat);
+
+    var sin_delta_lon=Math.sin(delta_lon);
+    var cos_delta_lon=Math.cos(delta_lon);
+
+    var g =this.sin_lat_o * sin_lat +this.cos_lat_o * cos_lat * cos_delta_lon;
+    if (g == -1.0) {
+      Proj4js.reportError("laea:fwd:Point projects to a circle of radius "+ 2.0 * R);
+      return null;
+    }
+    var ksp = this.a * Math.sqrt(2.0 / (1.0 + g));
+    var x = ksp * cos_lat * sin_delta_lon + this.x0;
+    var y = ksp * (this.cos_lat_o * sin_lat - this.sin_lat_o * cos_lat * cos_delta_lon) + this.y0;
+    */
+    p.x = this.a*x + this.x0;
+    p.y = this.a*y + this.y0;
+    return p;
+  },//lamazFwd()
+
+/* Inverse equations
+  -----------------*/
+  inverse: function(p) {
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var x = p.x/this.a;
+    var y = p.y/this.a;
+    
+    if (this.sphere) {
+        var  cosz=0.0, rh, sinz=0.0;
+      
+        rh = Math.sqrt(x*x + y*y);
+        var phi = rh * .5;
+        if (phi > 1.) {
+          Proj4js.reportError("laea:Inv:DataError");
+          return null;
+        }
+        phi = 2. * Math.asin(phi);
+        if (this.mode == this.OBLIQ || this.mode == this.EQUIT) {
+          sinz = Math.sin(phi);
+          cosz = Math.cos(phi);
+        }
+        switch (this.mode) {
+        case this.EQUIT:
+          phi = (Math.abs(rh) <= Proj4js.common.EPSLN) ? 0. : Math.asin(y * sinz / rh);
+          x *= sinz;
+          y = cosz * rh;
+          break;
+        case this.OBLIQ:
+          phi = (Math.abs(rh) <= Proj4js.common.EPSLN) ? this.phi0 : Math.asin(cosz * sinph0 + y * sinz * cosph0 / rh);
+          x *= sinz * cosph0;
+          y = (cosz - Math.sin(phi) * sinph0) * rh;
+          break;
+        case this.N_POLE:
+          y = -y;
+          phi = Proj4js.common.HALF_PI - phi;
+          break;
+        case this.S_POLE:
+          phi -= Proj4js.common.HALF_PI;
+          break;
+        }
+        lam = (y == 0. && (this.mode == this.EQUIT || this.mode == this.OBLIQ)) ? 0. : Math.atan2(x, y);
+    } else {
+        var cCe, sCe, q, rho, ab=0.0;
+      
+        switch (this.mode) {
+          case this.EQUIT:
+          case this.OBLIQ:
+            x /= this.dd;
+            y *=  this.dd;
+            rho = Math.sqrt(x*x + y*y);
+            if (rho < Proj4js.common.EPSLN) {
+              p.x = 0.;
+              p.y = this.phi0;
+              return p;
+            }
+            sCe = 2. * Math.asin(.5 * rho / this.rq);
+            cCe = Math.cos(sCe);
+            x *= (sCe = Math.sin(sCe));
+            if (this.mode == this.OBLIQ) {
+              ab = cCe * this.sinb1 + y * sCe * this.cosb1 / rho
+              q = this.qp * ab;
+              y = rho * this.cosb1 * cCe - y * this.sinb1 * sCe;
+            } else {
+              ab = y * sCe / rho;
+              q = this.qp * ab;
+              y = rho * cCe;
+            }
+            break;
+          case this.N_POLE:
+            y = -y;
+          case this.S_POLE:
+            q = (x * x + y * y);
+            if (!q ) {
+              p.x = 0.;
+              p.y = this.phi0;
+              return p;
+            }
+            /*
+            q = this.qp - q;
+            */
+            ab = 1. - q / this.qp;
+            if (this.mode == this.S_POLE) {
+              ab = - ab;
+            }
+            break;
+        }
+        lam = Math.atan2(x, y);
+        phi = this.authlat(Math.asin(ab), this.apa);
+    }
+
+    /*
+    var Rh = Math.Math.sqrt(p.x *p.x +p.y * p.y);
+    var temp = Rh / (2.0 * this.a);
+
+    if (temp > 1) {
+      Proj4js.reportError("laea:Inv:DataError");
+      return null;
+    }
+
+    var z = 2.0 * Proj4js.common.asinz(temp);
+    var sin_z=Math.sin(z);
+    var cos_z=Math.cos(z);
+
+    var lon =this.long0;
+    if (Math.abs(Rh) > Proj4js.common.EPSLN) {
+       var lat = Proj4js.common.asinz(this.sin_lat_o * cos_z +this. cos_lat_o * sin_z *p.y / Rh);
+       var temp =Math.abs(this.lat0) - Proj4js.common.HALF_PI;
+       if (Math.abs(temp) > Proj4js.common.EPSLN) {
+          temp = cos_z -this.sin_lat_o * Math.sin(lat);
+          if(temp!=0.0) lon=Proj4js.common.adjust_lon(this.long0+Math.atan2(p.x*sin_z*this.cos_lat_o,temp*Rh));
+       } else if (this.lat0 < 0.0) {
+          lon = Proj4js.common.adjust_lon(this.long0 - Math.atan2(-p.x,p.y));
+       } else {
+          lon = Proj4js.common.adjust_lon(this.long0 + Math.atan2(p.x, -p.y));
+       }
+    } else {
+      lat = this.lat0;
+    }
+    */
+    //return(OK);
+    p.x = Proj4js.common.adjust_lon(this.long0+lam);
+    p.y = phi;
+    return p;
+  },//lamazInv()
+  
+/* determine latitude from authalic latitude */
+  P00: .33333333333333333333,
+  P01: .17222222222222222222,
+  P02: .10257936507936507936,
+  P10: .06388888888888888888,
+  P11: .06640211640211640211,
+  P20: .01641501294219154443,
+  
+  authset: function(es) {
+    var t;
+    var APA = new Array();
+    APA[0] = es * this.P00;
+    t = es * es;
+    APA[0] += t * this.P01;
+    APA[1] = t * this.P10;
+    t *= es;
+    APA[0] += t * this.P02;
+    APA[1] += t * this.P11;
+    APA[2] = t * this.P20;
+    return APA;
+  },
+  
+  authlat: function(beta, APA) {
+    var t = beta+beta;
+    return(beta + APA[0] * Math.sin(t) + APA[1] * Math.sin(t+t) + APA[2] * Math.sin(t+t+t));
+  }
+  
+};
+
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/moll.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/moll.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/moll.js	(revision 76)
@@ -0,0 +1,100 @@
+/*******************************************************************************
+NAME                            MOLLWEIDE
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the MOllweide projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+D. Steinwand, EROS      May, 1991;  Updated Sept, 1992; Updated Feb, 1993
+S. Nelson, EDC		Jun, 2993;	Made corrections in precision and
+					number of iterations.
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+
+2.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+*******************************************************************************/
+
+Proj4js.Proj.moll = {
+
+  /* Initialize the Mollweide projection
+    ------------------------------------*/
+  init: function(){
+    //no-op
+  },
+
+  /* Mollweide forward equations--mapping lat,long to x,y
+    ----------------------------------------------------*/
+  forward: function(p) {
+
+    /* Forward equations
+      -----------------*/
+    var lon=p.x;
+    var lat=p.y;
+
+    var delta_lon = Proj4js.common.adjust_lon(lon - this.long0);
+    var theta = lat;
+    var con = Proj4js.common.PI * Math.sin(lat);
+
+    /* Iterate using the Newton-Raphson method to find theta
+      -----------------------------------------------------*/
+    for (var i=0;true;i++) {
+       var delta_theta = -(theta + Math.sin(theta) - con)/ (1.0 + Math.cos(theta));
+       theta += delta_theta;
+       if (Math.abs(delta_theta) < Proj4js.common.EPSLN) break;
+       if (i >= 50) {
+          Proj4js.reportError("moll:Fwd:IterationError");
+         //return(241);
+       }
+    }
+    theta /= 2.0;
+
+    /* If the latitude is 90 deg, force the x coordinate to be "0 + false easting"
+       this is done here because of precision problems with "cos(theta)"
+       --------------------------------------------------------------------------*/
+    if (Proj4js.common.PI/2 - Math.abs(lat) < Proj4js.common.EPSLN) delta_lon =0;
+    var x = 0.900316316158 * this.a * delta_lon * Math.cos(theta) + this.x0;
+    var y = 1.4142135623731 * this.a * Math.sin(theta) + this.y0;
+
+    p.x=x;
+    p.y=y;
+    return p;
+  },
+
+  inverse: function(p){
+    var theta;
+    var arg;
+
+    /* Inverse equations
+      -----------------*/
+    p.x-= this.x0;
+    //~ p.y -= this.y0;
+    var arg = p.y /  (1.4142135623731 * this.a);
+
+    /* Because of division by zero problems, 'arg' can not be 1.0.  Therefore
+       a number very close to one is used instead.
+       -------------------------------------------------------------------*/
+    if(Math.abs(arg) > 0.999999999999) arg=0.999999999999;
+    var theta =Math.asin(arg);
+    var lon = Proj4js.common.adjust_lon(this.long0 + (p.x / (0.900316316158 * this.a * Math.cos(theta))));
+    if(lon < (-Proj4js.common.PI)) lon= -Proj4js.common.PI;
+    if(lon > Proj4js.common.PI) lon= Proj4js.common.PI;
+    arg = (2.0 * theta + Math.sin(2.0 * theta)) / Proj4js.common.PI;
+    if(Math.abs(arg) > 1.0)arg=1.0;
+    var lat = Math.asin(arg);
+    //return(OK);
+
+    p.x=lon;
+    p.y=lat;
+    return p;
+  }
+};
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/equi.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/equi.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/projCode/equi.js	(revision 76)
@@ -0,0 +1,72 @@
+/*******************************************************************************
+NAME                             EQUIRECTANGULAR 
+
+PURPOSE:	Transforms input longitude and latitude to Easting and
+		Northing for the Equirectangular projection.  The
+		longitude and latitude must be in radians.  The Easting
+		and Northing values will be returned in meters.
+
+PROGRAMMER              DATE
+----------              ----
+T. Mittan		Mar, 1993
+
+ALGORITHM REFERENCES
+
+1.  Snyder, John P., "Map Projections--A Working Manual", U.S. Geological
+    Survey Professional Paper 1395 (Supersedes USGS Bulletin 1532), United
+    State Government Printing Office, Washington D.C., 1987.
+
+2.  Snyder, John P. and Voxland, Philip M., "An Album of Map Projections",
+    U.S. Geological Survey Professional Paper 1453 , United State Government
+    Printing Office, Washington D.C., 1989.
+*******************************************************************************/
+Proj4js.Proj.equi = {
+
+  init: function() {
+    if(!this.x0) this.x0=0;
+    if(!this.y0) this.y0=0;
+    if(!this.lat0) this.lat0=0;
+    if(!this.long0) this.long0=0;
+    ///this.t2;
+  },
+
+
+
+/* Equirectangular forward equations--mapping lat,long to x,y
+  ---------------------------------------------------------*/
+  forward: function(p) {
+
+    var lon=p.x;				
+    var lat=p.y;			
+
+    var dlon = Proj4js.common.adjust_lon(lon - this.long0);
+    var x = this.x0 +this. a * dlon *Math.cos(this.lat0);
+    var y = this.y0 + this.a * lat;
+
+    this.t1=x;
+    this.t2=Math.cos(this.lat0);
+    p.x=x;
+    p.y=y;
+    return p;
+  },  //equiFwd()
+
+
+
+/* Equirectangular inverse equations--mapping x,y to lat/long
+  ---------------------------------------------------------*/
+  inverse: function(p) {
+
+    p.x -= this.x0;
+    p.y -= this.y0;
+    var lat = p.y /this. a;
+
+    if ( Math.abs(lat) > Proj4js.common.HALF_PI) {
+        Proj4js.reportError("equi:Inv:DataError");
+    }
+    var lon = Proj4js.common.adjust_lon(this.long0 + p.x / (this.a * Math.cos(this.lat0)));
+    p.x=lon;
+    p.y=lat;
+  }//equiInv()
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js.js	(revision 76)
@@ -0,0 +1,1788 @@
+/*
+Author:       Mike Adair madairATdmsolutions.ca
+              Richard Greenwood rich@greenwoodmap.com
+License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html
+
+$Id: Proj.js 2956 2007-07-09 12:17:52Z steven $
+*/
+
+/**
+ * Namespace: Proj4js
+ *
+ * Proj4js is a JavaScript library to transform point coordinates from one 
+ * coordinate system to another, including datum transformations.
+ *
+ * This library is a port of both the Proj.4 and GCTCP C libraries to JavaScript. 
+ * Enabling these transformations in the browser allows geographic data stored 
+ * in different projections to be combined in browser-based web mapping 
+ * applications.
+ * 
+ * Proj4js must have access to coordinate system initialization strings (which
+ * are the same as for PROJ.4 command line).  Thes can be included in your 
+ * application using a <script> tag or Proj4js can load CS initialization 
+ * strings from a local directory or a web service such as spatialreference.org.
+ *
+ * Similarly, Proj4js must have access to projection transform code.  These can
+ * be included individually using a <script> tag in your page, built into a 
+ * custom build of Proj4js or loaded dynamically at run-time.  Using the
+ * -combined and -compressed versions of Proj4js includes all projection class
+ * code by default.
+ *
+ * Note that dynamic loading of defs and code happens ascynchrously, check the
+ * Proj.readyToUse flag before using the Proj object.  If the defs and code
+ * required by your application are loaded through script tags, dynamic loading
+ * is not required and the Proj object will be readyToUse on return from the 
+ * constructor.
+ * 
+ * All coordinates are handled as points which have a .x and a .y property
+ * which will be modified in place.
+ *
+ * Override Proj4js.reportError for output of alerts and warnings.
+ *
+ * See http://trac.osgeo.org/proj4js/wiki/UserGuide for full details.
+*/
+
+/**
+ * Global namespace object for Proj4js library
+ */
+Proj4js = {
+
+    /**
+     * Property: defaultDatum
+     * The datum to use when no others a specified
+     */
+    defaultDatum: 'WGS84',                  //default datum
+
+    /** 
+    * Method: transform(source, dest, point)
+    * Transform a point coordinate from one map projection to another.  This is
+    * really the only public method you should need to use.
+    *
+    * Parameters:
+    * source - {Proj4js.Proj} source map projection for the transformation
+    * dest - {Proj4js.Proj} destination map projection for the transformation
+    * point - {Object} point to transform, may be geodetic (long, lat) or
+    *     projected Cartesian (x,y), but should always have x,y properties.
+    */
+    transform: function(source, dest, point) {
+        if (!source.readyToUse) {
+            this.reportError("Proj4js initialization for:"+source.srsCode+" not yet complete");
+            return point;
+        }
+        if (!dest.readyToUse) {
+            this.reportError("Proj4js initialization for:"+dest.srsCode+" not yet complete");
+            return point;
+        }
+        
+        // Workaround for Spherical Mercator
+        if ((source.srsProjNumber =="900913" && dest.datumCode != "WGS84" && !dest.datum_params) ||
+            (dest.srsProjNumber == "900913" && source.datumCode != "WGS84" && !source.datum_params)) {
+            var wgs84 = Proj4js.WGS84;
+            this.transform(source, wgs84, point);
+            source = wgs84;
+        }
+
+        // DGR, 2010/11/12
+        if (source.axis!="enu") {
+            this.adjust_axis(source,false,point);
+        }
+
+        // Transform source points to long/lat, if they aren't already.
+        if ( source.projName=="longlat") {
+            point.x *= Proj4js.common.D2R;  // convert degrees to radians
+            point.y *= Proj4js.common.D2R;
+        } else {
+            if (source.to_meter) {
+                point.x *= source.to_meter;
+                point.y *= source.to_meter;
+            }
+            source.inverse(point); // Convert Cartesian to longlat
+        }
+
+        // Adjust for the prime meridian if necessary
+        if (source.from_greenwich) { 
+            point.x += source.from_greenwich; 
+        }
+
+        // Convert datums if needed, and if possible.
+        point = this.datum_transform( source.datum, dest.datum, point );
+
+        // Adjust for the prime meridian if necessary
+        if (dest.from_greenwich) {
+            point.x -= dest.from_greenwich;
+        }
+
+        if( dest.projName=="longlat" ) {             
+            // convert radians to decimal degrees
+            point.x *= Proj4js.common.R2D;
+            point.y *= Proj4js.common.R2D;
+        } else  {               // else project
+            dest.forward(point);
+            if (dest.to_meter) {
+                point.x /= dest.to_meter;
+                point.y /= dest.to_meter;
+            }
+        }
+
+        // DGR, 2010/11/12
+        if (dest.axis!="enu") {
+            this.adjust_axis(dest,true,point);
+        }
+
+        return point;
+    }, // transform()
+
+    /** datum_transform()
+      source coordinate system definition,
+      destination coordinate system definition,
+      point to transform in geodetic coordinates (long, lat, height)
+    */
+    datum_transform : function( source, dest, point ) {
+
+      // Short cut if the datums are identical.
+      if( source.compare_datums( dest ) ) {
+          return point; // in this case, zero is sucess,
+                    // whereas cs_compare_datums returns 1 to indicate TRUE
+                    // confusing, should fix this
+      }
+
+      // Explicitly skip datum transform by setting 'datum=none' as parameter for either source or dest
+      if( source.datum_type == Proj4js.common.PJD_NODATUM
+          || dest.datum_type == Proj4js.common.PJD_NODATUM) {
+          return point;
+      }
+
+      // If this datum requires grid shifts, then apply it to geodetic coordinates.
+      if( source.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        /*
+          pj_apply_gridshift( pj_param(source.params,"snadgrids").s, 0,
+                              point_count, point_offset, x, y, z );
+          CHECK_RETURN;
+
+          src_a = SRS_WGS84_SEMIMAJOR;
+          src_es = 0.006694379990;
+        */
+      }
+
+      if( dest.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        /*
+          dst_a = ;
+          dst_es = 0.006694379990;
+        */
+      }
+
+      // Do we need to go through geocentric coordinates?
+      if( source.es != dest.es || source.a != dest.a
+          || source.datum_type == Proj4js.common.PJD_3PARAM
+          || source.datum_type == Proj4js.common.PJD_7PARAM
+          || dest.datum_type == Proj4js.common.PJD_3PARAM
+          || dest.datum_type == Proj4js.common.PJD_7PARAM)
+      {
+
+        // Convert to geocentric coordinates.
+        source.geodetic_to_geocentric( point );
+        // CHECK_RETURN;
+
+        // Convert between datums
+        if( source.datum_type == Proj4js.common.PJD_3PARAM || source.datum_type == Proj4js.common.PJD_7PARAM ) {
+          source.geocentric_to_wgs84(point);
+          // CHECK_RETURN;
+        }
+
+        if( dest.datum_type == Proj4js.common.PJD_3PARAM || dest.datum_type == Proj4js.common.PJD_7PARAM ) {
+          dest.geocentric_from_wgs84(point);
+          // CHECK_RETURN;
+        }
+
+        // Convert back to geodetic coordinates
+        dest.geocentric_to_geodetic( point );
+          // CHECK_RETURN;
+      }
+
+      // Apply grid shift to destination if required
+      if( dest.datum_type == Proj4js.common.PJD_GRIDSHIFT )
+      {
+        alert("ERROR: Grid shift transformations are not implemented yet.");
+        // pj_apply_gridshift( pj_param(dest.params,"snadgrids").s, 1, point);
+        // CHECK_RETURN;
+      }
+      return point;
+    }, // cs_datum_transform
+
+    /**
+     * Function: adjust_axis
+     * Normalize or de-normalized the x/y/z axes.  The normal form is "enu"
+     * (easting, northing, up).
+     * Parameters:
+     * crs {Proj4js.Proj} the coordinate reference system
+     * denorm {Boolean} when false, normalize
+     * point {Object} the coordinates to adjust
+     */
+    adjust_axis: function(crs, denorm, point) {
+        var xin= point.x, yin= point.y, zin= point.z || 0.0;
+        var v, t;
+        for (var i= 0; i<3; i++) {
+            if (denorm && i==2 && point.z===undefined) { continue; }
+                 if (i==0) { v= xin; t= 'x'; }
+            else if (i==1) { v= yin; t= 'y'; }
+            else           { v= zin; t= 'z'; }
+            switch(crs.axis[i]) {
+            case 'e':
+                point[t]= v;
+                break;
+            case 'w':
+                point[t]= -v;
+                break;
+            case 'n':
+                point[t]= v;
+                break;
+            case 's':
+                point[t]= -v;
+                break;
+            case 'u':
+                if (point[t]!==undefined) { point.z= v; }
+                break;
+            case 'd':
+                if (point[t]!==undefined) { point.z= -v; }
+                break;
+            default :
+                alert("ERROR: unknow axis ("+crs.axis[i]+") - check definition of "+src.projName);
+                return null;
+            }
+        }
+        return point;
+    },
+
+    /**
+     * Function: reportError
+     * An internal method to report errors back to user. 
+     * Override this in applications to report error messages or throw exceptions.
+     */
+    reportError: function(msg) {
+      //console.log(msg);
+    },
+
+/**
+ *
+ * Title: Private Methods
+ * The following properties and methods are intended for internal use only.
+ *
+ * This is a minimal implementation of JavaScript inheritance methods so that 
+ * Proj4js can be used as a stand-alone library.
+ * These are copies of the equivalent OpenLayers methods at v2.7
+ */
+ 
+/**
+ * Function: extend
+ * Copy all properties of a source object to a destination object.  Modifies
+ *     the passed in destination object.  Any properties on the source object
+ *     that are set to undefined will not be (re)set on the destination object.
+ *
+ * Parameters:
+ * destination - {Object} The object that will be modified
+ * source - {Object} The object with properties to be set on the destination
+ *
+ * Returns:
+ * {Object} The destination object.
+ */
+    extend: function(destination, source) {
+      destination = destination || {};
+      if(source) {
+          for(var property in source) {
+              var value = source[property];
+              if(value !== undefined) {
+                  destination[property] = value;
+              }
+          }
+      }
+      return destination;
+    },
+
+/**
+ * Constructor: Class
+ * Base class used to construct all other classes. Includes support for 
+ *     multiple inheritance. 
+ *  
+ */
+    Class: function() {
+      var Class = function() {
+          this.initialize.apply(this, arguments);
+      };
+  
+      var extended = {};
+      var parent;
+      for(var i=0; i<arguments.length; ++i) {
+          if(typeof arguments[i] == "function") {
+              // get the prototype of the superclass
+              parent = arguments[i].prototype;
+          } else {
+              // in this case we're extending with the prototype
+              parent = arguments[i];
+          }
+          Proj4js.extend(extended, parent);
+      }
+      Class.prototype = extended;
+      
+      return Class;
+    },
+
+    /**
+     * Function: bind
+     * Bind a function to an object.  Method to easily create closures with
+     *     'this' altered.
+     * 
+     * Parameters:
+     * func - {Function} Input function.
+     * object - {Object} The object to bind to the input function (as this).
+     * 
+     * Returns:
+     * {Function} A closure with 'this' set to the passed in object.
+     */
+    bind: function(func, object) {
+        // create a reference to all arguments past the second one
+        var args = Array.prototype.slice.apply(arguments, [2]);
+        return function() {
+            // Push on any additional arguments from the actual function call.
+            // These will come after those sent to the bind call.
+            var newArgs = args.concat(
+                Array.prototype.slice.apply(arguments, [0])
+            );
+            return func.apply(object, newArgs);
+        };
+    },
+    
+/**
+ * The following properties and methods handle dynamic loading of JSON objects.
+ */
+ 
+    /**
+     * Property: scriptName
+     * {String} The filename of this script without any path.
+     */
+    scriptName: "proj4js.js",
+
+    /**
+     * Property: defsLookupService
+     * AJAX service to retreive projection definition parameters from
+     */
+    defsLookupService: 'http://spatialreference.org/ref',
+
+    /**
+     * Property: libPath
+     * internal: http server path to library code.
+     */
+    libPath: null,
+
+    /**
+     * Function: getScriptLocation
+     * Return the path to this script.
+     *
+     * Returns:
+     * Path to this script
+     */
+    getScriptLocation: function () {
+        if (this.libPath) return this.libPath;
+        var scriptName = this.scriptName;
+        var scriptNameLen = scriptName.length;
+
+        var scripts = document.getElementsByTagName('script');
+        for (var i = 0; i < scripts.length; i++) {
+            var src = scripts[i].getAttribute('src');
+            if (src) {
+                var index = src.lastIndexOf(scriptName);
+                // is it found, at the end of the URL?
+                if ((index > -1) && (index + scriptNameLen == src.length)) {
+                    this.libPath = src.slice(0, -scriptNameLen);
+                    break;
+                }
+            }
+        }
+        return this.libPath||"";
+    },
+
+    /**
+     * Function: loadScript
+     * Load a JS file from a URL into a <script> tag in the page.
+     * 
+     * Parameters:
+     * url - {String} The URL containing the script to load
+     * onload - {Function} A method to be executed when the script loads successfully
+     * onfail - {Function} A method to be executed when there is an error loading the script
+     * loadCheck - {Function} A boolean method that checks to see if the script 
+     *            has loaded.  Typically this just checks for the existance of
+     *            an object in the file just loaded.
+     */
+    loadScript: function(url, onload, onfail, loadCheck) {
+      var script = document.createElement('script');
+      script.defer = false;
+      script.type = "text/javascript";
+      script.id = url;
+      script.src = url;
+      script.onload = onload;
+      script.onerror = onfail;
+      script.loadCheck = loadCheck;
+      if (/MSIE/.test(navigator.userAgent)) {
+        script.onreadystatechange = this.checkReadyState;
+      }
+      document.getElementsByTagName('head')[0].appendChild(script);
+    },
+    
+    /**
+     * Function: checkReadyState
+     * IE workaround since there is no onerror handler.  Calls the user defined 
+     * loadCheck method to determine if the script is loaded.
+     * 
+     */
+    checkReadyState: function() {
+      if (this.readyState == 'loaded') {
+        if (!this.loadCheck()) {
+          this.onerror();
+        } else {
+          this.onload();
+        }
+      }
+    }
+};
+
+/**
+ * Class: Proj4js.Proj
+ *
+ * Proj objects provide transformation methods for point coordinates
+ * between geodetic latitude/longitude and a projected coordinate system. 
+ * once they have been initialized with a projection code.
+ *
+ * Initialization of Proj objects is with a projection code, usually EPSG codes,
+ * which is the key that will be used with the Proj4js.defs array.
+ * 
+ * The code passed in will be stripped of colons and converted to uppercase
+ * to locate projection definition files.
+ *
+ * A projection object has properties for units and title strings.
+ */
+Proj4js.Proj = Proj4js.Class({
+
+  /**
+   * Property: readyToUse
+   * Flag to indicate if initialization is complete for this Proj object
+   */
+  readyToUse: false,   
+  
+  /**
+   * Property: title
+   * The title to describe the projection
+   */
+  title: null,  
+  
+  /**
+   * Property: projName
+   * The projection class for this projection, e.g. lcc (lambert conformal conic,
+   * or merc for mercator).  These are exactly equivalent to their Proj4 
+   * counterparts.
+   */
+  projName: null,
+  /**
+   * Property: units
+   * The units of the projection.  Values include 'm' and 'degrees'
+   */
+  units: null,
+  /**
+   * Property: datum
+   * The datum specified for the projection
+   */
+  datum: null,
+  /**
+   * Property: x0
+   * The x coordinate origin
+   */
+  x0: 0,
+  /**
+   * Property: y0
+   * The y coordinate origin
+   */
+  y0: 0,
+  /**
+   * Property: localCS
+   * Flag to indicate if the projection is a local one in which no transforms
+   * are required.
+   */
+  localCS: false,
+
+  /**
+  * Property: queue
+  * Buffer (FIFO) to hold callbacks waiting to be called when projection loaded.
+  */
+  queue: null,
+
+  /**
+  * Constructor: initialize
+  * Constructor for Proj4js.Proj objects
+  *
+  * Parameters:
+  * srsCode - a code for map projection definition parameters.  These are usually
+  * (but not always) EPSG codes.
+  */
+  initialize: function(srsCode, callback) {
+      this.srsCodeInput = srsCode;
+      
+      //Register callbacks prior to attempting to process definition
+      this.queue = [];
+      if( callback ){
+           this.queue.push( callback );
+      }
+      
+      //check to see if this is a WKT string
+      if ((srsCode.indexOf('GEOGCS') >= 0) ||
+          (srsCode.indexOf('GEOCCS') >= 0) ||
+          (srsCode.indexOf('PROJCS') >= 0) ||
+          (srsCode.indexOf('LOCAL_CS') >= 0)) {
+            this.parseWKT(srsCode);
+            this.deriveConstants();
+            this.loadProjCode(this.projName);
+            return;
+      }
+      
+      // DGR 2008-08-03 : support urn and url
+      if (srsCode.indexOf('urn:') == 0) {
+          //urn:ORIGINATOR:def:crs:CODESPACE:VERSION:ID
+          var urn = srsCode.split(':');
+          if ((urn[1] == 'ogc' || urn[1] =='x-ogc') &&
+              (urn[2] =='def') &&
+              (urn[3] =='crs')) {
+              srsCode = urn[4]+':'+urn[urn.length-1];
+          }
+      } else if (srsCode.indexOf('http://') == 0) {
+          //url#ID
+          var url = srsCode.split('#');
+          if (url[0].match(/epsg.org/)) {
+            // http://www.epsg.org/#
+            srsCode = 'EPSG:'+url[1];
+          } else if (url[0].match(/RIG.xml/)) {
+            //http://librairies.ign.fr/geoportail/resources/RIG.xml#
+            //http://interop.ign.fr/registers/ign/RIG.xml#
+            srsCode = 'IGNF:'+url[1];
+          }
+      }
+      this.srsCode = srsCode.toUpperCase();
+      if (this.srsCode.indexOf("EPSG") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'epsg';
+          this.srsProjNumber = this.srsCode.substring(5);
+      // DGR 2007-11-20 : authority IGNF
+      } else if (this.srsCode.indexOf("IGNF") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'IGNF';
+          this.srsProjNumber = this.srsCode.substring(5);
+      // DGR 2008-06-19 : pseudo-authority CRS for WMS
+      } else if (this.srsCode.indexOf("CRS") == 0) {
+          this.srsCode = this.srsCode;
+          this.srsAuth = 'CRS';
+          this.srsProjNumber = this.srsCode.substring(4);
+      } else {
+          this.srsAuth = '';
+          this.srsProjNumber = this.srsCode;
+      }
+      
+      this.loadProjDefinition();
+  },
+  
+/**
+ * Function: loadProjDefinition
+ *    Loads the coordinate system initialization string if required.
+ *    Note that dynamic loading happens asynchronously so an application must 
+ *    wait for the readyToUse property is set to true.
+ *    To prevent dynamic loading, include the defs through a script tag in
+ *    your application.
+ *
+ */
+    loadProjDefinition: function() {
+      //check in memory
+      if (Proj4js.defs[this.srsCode]) {
+        this.defsLoaded();
+        return;
+      }
+
+      //else check for def on the server
+      var url = Proj4js.getScriptLocation() + 'defs/' + this.srsAuth.toUpperCase() + this.srsProjNumber + '.js';
+      Proj4js.loadScript(url, 
+                Proj4js.bind(this.defsLoaded, this),
+                Proj4js.bind(this.loadFromService, this),
+                Proj4js.bind(this.checkDefsLoaded, this) );
+    },
+
+/**
+ * Function: loadFromService
+ *    Creates the REST URL for loading the definition from a web service and 
+ *    loads it.
+ *
+ */
+    loadFromService: function() {
+      //else load from web service
+      var url = Proj4js.defsLookupService +'/' + this.srsAuth +'/'+ this.srsProjNumber + '/proj4js/';
+      Proj4js.loadScript(url, 
+            Proj4js.bind(this.defsLoaded, this),
+            Proj4js.bind(this.defsFailed, this),
+            Proj4js.bind(this.checkDefsLoaded, this) );
+    },
+
+/**
+ * Function: defsLoaded
+ * Continues the Proj object initilization once the def file is loaded
+ *
+ */
+    defsLoaded: function() {
+      this.parseDefs();
+      this.loadProjCode(this.projName);
+    },
+    
+/**
+ * Function: checkDefsLoaded
+ *    This is the loadCheck method to see if the def object exists
+ *
+ */
+    checkDefsLoaded: function() {
+      if (Proj4js.defs[this.srsCode]) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+
+ /**
+ * Function: defsFailed
+ *    Report an error in loading the defs file, but continue on using WGS84
+ *
+ */
+   defsFailed: function() {
+      Proj4js.reportError('failed to load projection definition for: '+this.srsCode);
+      Proj4js.defs[this.srsCode] = Proj4js.defs['WGS84'];  //set it to something so it can at least continue
+      this.defsLoaded();
+    },
+
+/**
+ * Function: loadProjCode
+ *    Loads projection class code dynamically if required.
+ *     Projection code may be included either through a script tag or in
+ *     a built version of proj4js
+ *
+ */
+    loadProjCode: function(projName) {
+      if (Proj4js.Proj[projName]) {
+        this.initTransforms();
+        return;
+      }
+
+      //the URL for the projection code
+      var url = Proj4js.getScriptLocation() + 'projCode/' + projName + '.js';
+      Proj4js.loadScript(url, 
+              Proj4js.bind(this.loadProjCodeSuccess, this, projName),
+              Proj4js.bind(this.loadProjCodeFailure, this, projName), 
+              Proj4js.bind(this.checkCodeLoaded, this, projName) );
+    },
+
+ /**
+ * Function: loadProjCodeSuccess
+ *    Loads any proj dependencies or continue on to final initialization.
+ *
+ */
+    loadProjCodeSuccess: function(projName) {
+      if (Proj4js.Proj[projName].dependsOn){
+        this.loadProjCode(Proj4js.Proj[projName].dependsOn);
+      } else {
+        this.initTransforms();
+      }
+    },
+
+ /**
+ * Function: defsFailed
+ *    Report an error in loading the proj file.  Initialization of the Proj
+ *    object has failed and the readyToUse flag will never be set.
+ *
+ */
+    loadProjCodeFailure: function(projName) {
+      Proj4js.reportError("failed to find projection file for: " + projName);
+      //TBD initialize with identity transforms so proj will still work?
+    },
+    
+/**
+ * Function: checkCodeLoaded
+ *    This is the loadCheck method to see if the projection code is loaded
+ *
+ */
+    checkCodeLoaded: function(projName) {
+      if (Proj4js.Proj[projName]) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+
+/**
+ * Function: initTransforms
+ *    Finalize the initialization of the Proj object
+ *
+ */
+    initTransforms: function() {
+      Proj4js.extend(this, Proj4js.Proj[this.projName]);
+      this.init();
+      this.readyToUse = true;
+      if( this.queue ) {
+        var item;
+        while( (item = this.queue.shift()) ) {
+          item.call( this, this );
+        }
+      }
+  },
+
+/**
+ * Function: parseWKT
+ * Parses a WKT string to get initialization parameters
+ *
+ */
+ wktRE: /^(\w+)\[(.*)\]$/,
+ parseWKT: function(wkt) {
+    var wktMatch = wkt.match(this.wktRE);
+    if (!wktMatch) return;
+    var wktObject = wktMatch[1];
+    var wktContent = wktMatch[2];
+    var wktTemp = wktContent.split(",");
+    var wktName;
+    if (wktObject.toUpperCase() == "TOWGS84") {
+      wktName = wktObject;  //no name supplied for the TOWGS84 array
+    } else {
+      wktName = wktTemp.shift();
+    }
+    wktName = wktName.replace(/^\"/,"");
+    wktName = wktName.replace(/\"$/,"");
+    
+    /*
+    wktContent = wktTemp.join(",");
+    var wktArray = wktContent.split("],");
+    for (var i=0; i<wktArray.length-1; ++i) {
+      wktArray[i] += "]";
+    }
+    */
+    
+    var wktArray = new Array();
+    var bkCount = 0;
+    var obj = "";
+    for (var i=0; i<wktTemp.length; ++i) {
+      var token = wktTemp[i];
+      for (var j=0; j<token.length; ++j) {
+        if (token.charAt(j) == "[") ++bkCount;
+        if (token.charAt(j) == "]") --bkCount;
+      }
+      obj += token;
+      if (bkCount === 0) {
+        wktArray.push(obj);
+        obj = "";
+      } else {
+        obj += ",";
+      }
+    }
+    
+    //do something based on the type of the wktObject being parsed
+    //add in variations in the spelling as required
+    switch (wktObject) {
+      case 'LOCAL_CS':
+        this.projName = 'identity'
+        this.localCS = true;
+        this.srsCode = wktName;
+        break;
+      case 'GEOGCS':
+        this.projName = 'longlat'
+        this.geocsCode = wktName;
+        if (!this.srsCode) this.srsCode = wktName;
+        break;
+      case 'PROJCS':
+        this.srsCode = wktName;
+        break;
+      case 'GEOCCS':
+        break;
+      case 'PROJECTION':
+        this.projName = Proj4js.wktProjections[wktName]
+        break;
+      case 'DATUM':
+        this.datumName = wktName;
+        break;
+      case 'LOCAL_DATUM':
+        this.datumCode = 'none';
+        break;
+      case 'SPHEROID':
+        this.ellps = wktName;
+        this.a = parseFloat(wktArray.shift());
+        this.rf = parseFloat(wktArray.shift());
+        break;
+      case 'PRIMEM':
+        this.from_greenwich = parseFloat(wktArray.shift()); //to radians?
+        break;
+      case 'UNIT':
+        this.units = wktName;
+        this.unitsPerMeter = parseFloat(wktArray.shift());
+        break;
+      case 'PARAMETER':
+        var name = wktName.toLowerCase();
+        var value = parseFloat(wktArray.shift());
+        //there may be many variations on the wktName values, add in case
+        //statements as required
+        switch (name) {
+          case 'false_easting':
+            this.x0 = value;
+            break;
+          case 'false_northing':
+            this.y0 = value;
+            break;
+          case 'scale_factor':
+            this.k0 = value;
+            break;
+          case 'central_meridian':
+            this.long0 = value*Proj4js.common.D2R;
+            break;
+          case 'latitude_of_origin':
+            this.lat0 = value*Proj4js.common.D2R;
+            break;
+          case 'more_here':
+            break;
+          default:
+            break;
+        }
+        break;
+      case 'TOWGS84':
+        this.datum_params = wktArray;
+        break;
+      //DGR 2010-11-12: AXIS
+      case 'AXIS':
+        var name= wktName.toLowerCase();
+        var value= wktArray.shift();
+        switch (value) {
+          case 'EAST' : value= 'e'; break;
+          case 'WEST' : value= 'w'; break;
+          case 'NORTH': value= 'n'; break;
+          case 'SOUTH': value= 's'; break;
+          case 'UP'   : value= 'u'; break;
+          case 'DOWN' : value= 'd'; break;
+          case 'OTHER':
+          default     : value= ' '; break;//FIXME
+        }
+        if (!this.axis) { this.axis= "enu"; }
+        switch(name) {
+          case 'X': this.axis=                         value + this.axis.substr(1,2); break;
+          case 'Y': this.axis= this.axis.substr(0,1) + value + this.axis.substr(2,1); break;
+          case 'Z': this.axis= this.axis.substr(0,2) + value                        ; break;
+          default : break;
+        }
+      case 'MORE_HERE':
+        break;
+      default:
+        break;
+    }
+    for (var i=0; i<wktArray.length; ++i) {
+      this.parseWKT(wktArray[i]);
+    }
+ },
+
+/**
+ * Function: parseDefs
+ * Parses the PROJ.4 initialization string and sets the associated properties.
+ *
+ */
+  parseDefs: function() {
+      this.defData = Proj4js.defs[this.srsCode];
+      var paramName, paramVal;
+      if (!this.defData) {
+        return;
+      }
+      var paramArray=this.defData.split("+");
+
+      for (var prop=0; prop<paramArray.length; prop++) {
+          var property = paramArray[prop].split("=");
+          paramName = property[0].toLowerCase();
+          paramVal = property[1];
+
+          switch (paramName.replace(/\s/gi,"")) {  // trim out spaces
+              case "": break;   // throw away nameless parameter
+              case "title":  this.title = paramVal; break;
+              case "proj":   this.projName =  paramVal.replace(/\s/gi,""); break;
+              case "units":  this.units = paramVal.replace(/\s/gi,""); break;
+              case "datum":  this.datumCode = paramVal.replace(/\s/gi,""); break;
+              case "nadgrids": this.nagrids = paramVal.replace(/\s/gi,""); break;
+              case "ellps":  this.ellps = paramVal.replace(/\s/gi,""); break;
+              case "a":      this.a =  parseFloat(paramVal); break;  // semi-major radius
+              case "b":      this.b =  parseFloat(paramVal); break;  // semi-minor radius
+              // DGR 2007-11-20
+              case "rf":     this.rf = parseFloat(paramVal); break; // inverse flattening rf= a/(a-b)
+              case "lat_0":  this.lat0 = paramVal*Proj4js.common.D2R; break;        // phi0, central latitude
+              case "lat_1":  this.lat1 = paramVal*Proj4js.common.D2R; break;        //standard parallel 1
+              case "lat_2":  this.lat2 = paramVal*Proj4js.common.D2R; break;        //standard parallel 2
+              case "lat_ts": this.lat_ts = paramVal*Proj4js.common.D2R; break;      // used in merc and eqc
+              case "lon_0":  this.long0 = paramVal*Proj4js.common.D2R; break;       // lam0, central longitude
+              case "alpha":  this.alpha =  parseFloat(paramVal)*Proj4js.common.D2R; break;  //for somerc projection
+              case "lonc":   this.longc = paramVal*Proj4js.common.D2R; break;       //for somerc projection
+              case "x_0":    this.x0 = parseFloat(paramVal); break;  // false easting
+              case "y_0":    this.y0 = parseFloat(paramVal); break;  // false northing
+              case "k_0":    this.k0 = parseFloat(paramVal); break;  // projection scale factor
+              case "k":      this.k0 = parseFloat(paramVal); break;  // both forms returned
+              case "r_a":    this.R_A = true; break;                 // sphere--area of ellipsoid
+              case "zone":   this.zone = parseInt(paramVal); break;  // UTM Zone
+              case "south":   this.utmSouth = true; break;  // UTM north/south
+              case "towgs84":this.datum_params = paramVal.split(","); break;
+              case "to_meter": this.to_meter = parseFloat(paramVal); break; // cartesian scaling
+              case "from_greenwich": this.from_greenwich = paramVal*Proj4js.common.D2R; break;
+              // DGR 2008-07-09 : if pm is not a well-known prime meridian take
+              // the value instead of 0.0, then convert to radians
+              case "pm":     paramVal = paramVal.replace(/\s/gi,"");
+                             this.from_greenwich = Proj4js.PrimeMeridian[paramVal] ?
+                                Proj4js.PrimeMeridian[paramVal] : parseFloat(paramVal);
+                             this.from_greenwich *= Proj4js.common.D2R; 
+                             break;
+              // DGR 2010-11-12: axis
+              case "axis":   paramVal = paramVal.replace(/\s/gi,"");
+                             var legalAxis= "ewnsud";
+                             if (paramVal.length==3 &&
+                                 legalAxis.indexOf(paramVal.substr(0,1))!=-1 &&
+                                 legalAxis.indexOf(paramVal.substr(1,1))!=-1 &&
+                                 legalAxis.indexOf(paramVal.substr(2,1))!=-1) {
+                                this.axis= paramVal;
+                             } //FIXME: be silent ?
+                             break
+              case "no_defs": break; 
+              default: //alert("Unrecognized parameter: " + paramName);
+          } // switch()
+      } // for paramArray
+      this.deriveConstants();
+  },
+
+/**
+ * Function: deriveConstants
+ * Sets several derived constant values and initialization of datum and ellipse
+ *     parameters.
+ *
+ */
+  deriveConstants: function() {
+      if (this.nagrids == '@null') this.datumCode = 'none';
+      if (this.datumCode && this.datumCode != 'none') {
+        var datumDef = Proj4js.Datum[this.datumCode];
+        if (datumDef) {
+          this.datum_params = datumDef.towgs84 ? datumDef.towgs84.split(',') : null;
+          this.ellps = datumDef.ellipse;
+          this.datumName = datumDef.datumName ? datumDef.datumName : this.datumCode;
+        }
+      }
+      if (!this.a) {    // do we have an ellipsoid?
+          var ellipse = Proj4js.Ellipsoid[this.ellps] ? Proj4js.Ellipsoid[this.ellps] : Proj4js.Ellipsoid['WGS84'];
+          Proj4js.extend(this, ellipse);
+      }
+      if (this.rf && !this.b) this.b = (1.0 - 1.0/this.rf) * this.a;
+      if (Math.abs(this.a - this.b)<Proj4js.common.EPSLN) {
+        this.sphere = true;
+        this.b= this.a;
+      }
+      this.a2 = this.a * this.a;          // used in geocentric
+      this.b2 = this.b * this.b;          // used in geocentric
+      this.es = (this.a2-this.b2)/this.a2;  // e ^ 2
+      this.e = Math.sqrt(this.es);        // eccentricity
+      if (this.R_A) {
+        this.a *= 1. - this.es * (Proj4js.common.SIXTH + this.es * (Proj4js.common.RA4 + this.es * Proj4js.common.RA6));
+        this.a2 = this.a * this.a;
+        this.b2 = this.b * this.b;
+        this.es = 0.;
+      }
+      this.ep2=(this.a2-this.b2)/this.b2; // used in geocentric
+      if (!this.k0) this.k0 = 1.0;    //default value
+      //DGR 2010-11-12: axis
+      if (!this.axis) { this.axis= "enu"; }
+
+      this.datum = new Proj4js.datum(this);
+  }
+});
+
+Proj4js.Proj.longlat = {
+  init: function() {
+    //no-op for longlat
+  },
+  forward: function(pt) {
+    //identity transform
+    return pt;
+  },
+  inverse: function(pt) {
+    //identity transform
+    return pt;
+  }
+};
+Proj4js.Proj.identity = Proj4js.Proj.longlat;
+
+/**
+  Proj4js.defs is a collection of coordinate system definition objects in the 
+  PROJ.4 command line format.
+  Generally a def is added by means of a separate .js file for example:
+
+    <SCRIPT type="text/javascript" src="defs/EPSG26912.js"></SCRIPT>
+
+  def is a CS definition in PROJ.4 WKT format, for example:
+    +proj="tmerc"   //longlat, etc.
+    +a=majorRadius
+    +b=minorRadius
+    +lat0=somenumber
+    +long=somenumber
+*/
+Proj4js.defs = {
+  // These are so widely used, we'll go ahead and throw them in
+  // without requiring a separate .js file
+  'WGS84': "+title=long/lat:WGS84 +proj=longlat +ellps=WGS84 +datum=WGS84 +units=degrees",
+  'EPSG:4326': "+title=long/lat:WGS84 +proj=longlat +a=6378137.0 +b=6356752.31424518 +ellps=WGS84 +datum=WGS84 +units=degrees",
+  'EPSG:4269': "+title=long/lat:NAD83 +proj=longlat +a=6378137.0 +b=6356752.31414036 +ellps=GRS80 +datum=NAD83 +units=degrees",
+  'EPSG:3785': "+title= Google Mercator +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs"
+};
+Proj4js.defs['GOOGLE'] = Proj4js.defs['EPSG:3785'];
+Proj4js.defs['EPSG:900913'] = Proj4js.defs['EPSG:3785'];
+Proj4js.defs['EPSG:102113'] = Proj4js.defs['EPSG:3785'];
+
+Proj4js.common = {
+  PI : 3.141592653589793238, //Math.PI,
+  HALF_PI : 1.570796326794896619, //Math.PI*0.5,
+  TWO_PI : 6.283185307179586477, //Math.PI*2,
+  FORTPI : 0.78539816339744833,
+  R2D : 57.29577951308232088,
+  D2R : 0.01745329251994329577,
+  SEC_TO_RAD : 4.84813681109535993589914102357e-6, /* SEC_TO_RAD = Pi/180/3600 */
+  EPSLN : 1.0e-10,
+  MAX_ITER : 20,
+  // following constants from geocent.c
+  COS_67P5 : 0.38268343236508977,  /* cosine of 67.5 degrees */
+  AD_C : 1.0026000,                /* Toms region 1 constant */
+
+  /* datum_type values */
+  PJD_UNKNOWN  : 0,
+  PJD_3PARAM   : 1,
+  PJD_7PARAM   : 2,
+  PJD_GRIDSHIFT: 3,
+  PJD_WGS84    : 4,   // WGS84 or equivalent
+  PJD_NODATUM  : 5,   // WGS84 or equivalent
+  SRS_WGS84_SEMIMAJOR : 6378137.0,  // only used in grid shift transforms
+
+  // ellipoid pj_set_ell.c
+  SIXTH : .1666666666666666667, /* 1/6 */
+  RA4   : .04722222222222222222, /* 17/360 */
+  RA6   : .02215608465608465608, /* 67/3024 */
+  RV4   : .06944444444444444444, /* 5/72 */
+  RV6   : .04243827160493827160, /* 55/1296 */
+
+// Function to compute the constant small m which is the radius of
+//   a parallel of latitude, phi, divided by the semimajor axis.
+// -----------------------------------------------------------------
+  msfnz : function(eccent, sinphi, cosphi) {
+      var con = eccent * sinphi;
+      return cosphi/(Math.sqrt(1.0 - con * con));
+  },
+
+// Function to compute the constant small t for use in the forward
+//   computations in the Lambert Conformal Conic and the Polar
+//   Stereographic projections.
+// -----------------------------------------------------------------
+  tsfnz : function(eccent, phi, sinphi) {
+    var con = eccent * sinphi;
+    var com = .5 * eccent;
+    con = Math.pow(((1.0 - con) / (1.0 + con)), com);
+    return (Math.tan(.5 * (this.HALF_PI - phi))/con);
+  },
+
+// Function to compute the latitude angle, phi2, for the inverse of the
+//   Lambert Conformal Conic and Polar Stereographic projections.
+// ----------------------------------------------------------------
+  phi2z : function(eccent, ts) {
+    var eccnth = .5 * eccent;
+    var con, dphi;
+    var phi = this.HALF_PI - 2 * Math.atan(ts);
+    for (var i = 0; i <= 15; i++) {
+      con = eccent * Math.sin(phi);
+      dphi = this.HALF_PI - 2 * Math.atan(ts *(Math.pow(((1.0 - con)/(1.0 + con)),eccnth))) - phi;
+      phi += dphi;
+      if (Math.abs(dphi) <= .0000000001) return phi;
+    }
+    alert("phi2z has NoConvergence");
+    return (-9999);
+  },
+
+/* Function to compute constant small q which is the radius of a 
+   parallel of latitude, phi, divided by the semimajor axis. 
+------------------------------------------------------------*/
+  qsfnz : function(eccent,sinphi) {
+    var con;
+    if (eccent > 1.0e-7) {
+      con = eccent * sinphi;
+      return (( 1.0- eccent * eccent) * (sinphi /(1.0 - con * con) - (.5/eccent)*Math.log((1.0 - con)/(1.0 + con))));
+    } else {
+      return(2.0 * sinphi);
+    }
+  },
+
+/* Function to eliminate roundoff errors in asin
+----------------------------------------------*/
+  asinz : function(x) {
+    if (Math.abs(x)>1.0) {
+      x=(x>1.0)?1.0:-1.0;
+    }
+    return Math.asin(x);
+  },
+
+// following functions from gctpc cproj.c for transverse mercator projections
+  e0fn : function(x) {return(1.0-0.25*x*(1.0+x/16.0*(3.0+1.25*x)));},
+  e1fn : function(x) {return(0.375*x*(1.0+0.25*x*(1.0+0.46875*x)));},
+  e2fn : function(x) {return(0.05859375*x*x*(1.0+0.75*x));},
+  e3fn : function(x) {return(x*x*x*(35.0/3072.0));},
+  mlfn : function(e0,e1,e2,e3,phi) {return(e0*phi-e1*Math.sin(2.0*phi)+e2*Math.sin(4.0*phi)-e3*Math.sin(6.0*phi));},
+
+  srat : function(esinp, exp) {
+    return(Math.pow((1.0-esinp)/(1.0+esinp), exp));
+  },
+
+// Function to return the sign of an argument
+  sign : function(x) { if (x < 0.0) return(-1); else return(1);},
+
+// Function to adjust longitude to -180 to 180; input in radians
+  adjust_lon : function(x) {
+    x = (Math.abs(x) < this.PI) ? x: (x - (this.sign(x)*this.TWO_PI) );
+    return x;
+  },
+
+// IGNF - DGR : algorithms used by IGN France
+
+// Function to adjust latitude to -90 to 90; input in radians
+  adjust_lat : function(x) {
+    x= (Math.abs(x) < this.HALF_PI) ? x: (x - (this.sign(x)*this.PI) );
+    return x;
+  },
+
+// Latitude Isometrique - close to tsfnz ...
+  latiso : function(eccent, phi, sinphi) {
+    if (Math.abs(phi) > this.HALF_PI) return +Number.NaN;
+    if (phi==this.HALF_PI) return Number.POSITIVE_INFINITY;
+    if (phi==-1.0*this.HALF_PI) return -1.0*Number.POSITIVE_INFINITY;
+
+    var con= eccent*sinphi;
+    return Math.log(Math.tan((this.HALF_PI+phi)/2.0))+eccent*Math.log((1.0-con)/(1.0+con))/2.0;
+  },
+
+  fL : function(x,L) {
+    return 2.0*Math.atan(x*Math.exp(L)) - this.HALF_PI;
+  },
+
+// Inverse Latitude Isometrique - close to ph2z
+  invlatiso : function(eccent, ts) {
+    var phi= this.fL(1.0,ts);
+    var Iphi= 0.0;
+    var con= 0.0;
+    do {
+      Iphi= phi;
+      con= eccent*Math.sin(Iphi);
+      phi= this.fL(Math.exp(eccent*Math.log((1.0+con)/(1.0-con))/2.0),ts)
+    } while (Math.abs(phi-Iphi)>1.0e-12);
+    return phi;
+  },
+
+// Needed for Gauss Schreiber
+// Original:  Denis Makarov (info@binarythings.com)
+// Web Site:  http://www.binarythings.com
+  sinh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r-1.0/r)/2.0;
+    return r;
+  },
+
+  cosh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r+1.0/r)/2.0;
+    return r;
+  },
+
+  tanh : function(x)
+  {
+    var r= Math.exp(x);
+    r= (r-1.0/r)/(r+1.0/r);
+    return r;
+  },
+
+  asinh : function(x)
+  {
+    var s= (x>= 0? 1.0:-1.0);
+    return s*(Math.log( Math.abs(x) + Math.sqrt(x*x+1.0) ));
+  },
+
+  acosh : function(x)
+  {
+    return 2.0*Math.log(Math.sqrt((x+1.0)/2.0) + Math.sqrt((x-1.0)/2.0));
+  },
+
+  atanh : function(x)
+  {
+    return Math.log((x-1.0)/(x+1.0))/2.0;
+  },
+
+// Grande Normale
+  gN : function(a,e,sinphi)
+  {
+    var temp= e*sinphi;
+    return a/Math.sqrt(1.0 - temp*temp);
+  }
+
+};
+
+/** datum object
+*/
+Proj4js.datum = Proj4js.Class({
+
+  initialize : function(proj) {
+    this.datum_type = Proj4js.common.PJD_WGS84;   //default setting
+    if (proj.datumCode && proj.datumCode == 'none') {
+      this.datum_type = Proj4js.common.PJD_NODATUM;
+    }
+    if (proj && proj.datum_params) {
+      for (var i=0; i<proj.datum_params.length; i++) {
+        proj.datum_params[i]=parseFloat(proj.datum_params[i]);
+      }
+      if (proj.datum_params[0] != 0 || proj.datum_params[1] != 0 || proj.datum_params[2] != 0 ) {
+        this.datum_type = Proj4js.common.PJD_3PARAM;
+      }
+      if (proj.datum_params.length > 3) {
+        if (proj.datum_params[3] != 0 || proj.datum_params[4] != 0 ||
+            proj.datum_params[5] != 0 || proj.datum_params[6] != 0 ) {
+          this.datum_type = Proj4js.common.PJD_7PARAM;
+          proj.datum_params[3] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[4] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[5] *= Proj4js.common.SEC_TO_RAD;
+          proj.datum_params[6] = (proj.datum_params[6]/1000000.0) + 1.0;
+        }
+      }
+    }
+    if (proj) {
+      this.a = proj.a;    //datum object also uses these values
+      this.b = proj.b;
+      this.es = proj.es;
+      this.ep2 = proj.ep2;
+      this.datum_params = proj.datum_params;
+    }
+  },
+
+  /****************************************************************/
+  // cs_compare_datums()
+  //   Returns 1 (TRUE) if the two datums match, otherwise 0 (FALSE).
+  compare_datums : function( dest ) {
+    if( this.datum_type != dest.datum_type ) {
+      return false; // false, datums are not equal
+    } else if( this.a != dest.a || Math.abs(this.es-dest.es) > 0.000000000050 ) {
+      // the tolerence for es is to ensure that GRS80 and WGS84
+      // are considered identical
+      return false;
+    } else if( this.datum_type == Proj4js.common.PJD_3PARAM ) {
+      return (this.datum_params[0] == dest.datum_params[0]
+              && this.datum_params[1] == dest.datum_params[1]
+              && this.datum_params[2] == dest.datum_params[2]);
+    } else if( this.datum_type == Proj4js.common.PJD_7PARAM ) {
+      return (this.datum_params[0] == dest.datum_params[0]
+              && this.datum_params[1] == dest.datum_params[1]
+              && this.datum_params[2] == dest.datum_params[2]
+              && this.datum_params[3] == dest.datum_params[3]
+              && this.datum_params[4] == dest.datum_params[4]
+              && this.datum_params[5] == dest.datum_params[5]
+              && this.datum_params[6] == dest.datum_params[6]);
+    } else if( this.datum_type == Proj4js.common.PJD_GRIDSHIFT ) {
+      return strcmp( pj_param(this.params,"snadgrids").s,
+                     pj_param(dest.params,"snadgrids").s ) == 0;
+    } else {
+      return true; // datums are equal
+    }
+  }, // cs_compare_datums()
+
+  /*
+   * The function Convert_Geodetic_To_Geocentric converts geodetic coordinates
+   * (latitude, longitude, and height) to geocentric coordinates (X, Y, Z),
+   * according to the current ellipsoid parameters.
+   *
+   *    Latitude  : Geodetic latitude in radians                     (input)
+   *    Longitude : Geodetic longitude in radians                    (input)
+   *    Height    : Geodetic height, in meters                       (input)
+   *    X         : Calculated Geocentric X coordinate, in meters    (output)
+   *    Y         : Calculated Geocentric Y coordinate, in meters    (output)
+   *    Z         : Calculated Geocentric Z coordinate, in meters    (output)
+   *
+   */
+  geodetic_to_geocentric : function(p) {
+    var Longitude = p.x;
+    var Latitude = p.y;
+    var Height = p.z ? p.z : 0;   //Z value not always supplied
+    var X;  // output
+    var Y;
+    var Z;
+
+    var Error_Code=0;  //  GEOCENT_NO_ERROR;
+    var Rn;            /*  Earth radius at location  */
+    var Sin_Lat;       /*  Math.sin(Latitude)  */
+    var Sin2_Lat;      /*  Square of Math.sin(Latitude)  */
+    var Cos_Lat;       /*  Math.cos(Latitude)  */
+
+    /*
+    ** Don't blow up if Latitude is just a little out of the value
+    ** range as it may just be a rounding issue.  Also removed longitude
+    ** test, it should be wrapped by Math.cos() and Math.sin().  NFW for PROJ.4, Sep/2001.
+    */
+    if( Latitude < -Proj4js.common.HALF_PI && Latitude > -1.001 * Proj4js.common.HALF_PI ) {
+        Latitude = -Proj4js.common.HALF_PI;
+    } else if( Latitude > Proj4js.common.HALF_PI && Latitude < 1.001 * Proj4js.common.HALF_PI ) {
+        Latitude = Proj4js.common.HALF_PI;
+    } else if ((Latitude < -Proj4js.common.HALF_PI) || (Latitude > Proj4js.common.HALF_PI)) {
+      /* Latitude out of range */
+      Proj4js.reportError('geocent:lat out of range:'+Latitude);
+      return null;
+    }
+
+    if (Longitude > Proj4js.common.PI) Longitude -= (2*Proj4js.common.PI);
+    Sin_Lat = Math.sin(Latitude);
+    Cos_Lat = Math.cos(Latitude);
+    Sin2_Lat = Sin_Lat * Sin_Lat;
+    Rn = this.a / (Math.sqrt(1.0e0 - this.es * Sin2_Lat));
+    X = (Rn + Height) * Cos_Lat * Math.cos(Longitude);
+    Y = (Rn + Height) * Cos_Lat * Math.sin(Longitude);
+    Z = ((Rn * (1 - this.es)) + Height) * Sin_Lat;
+
+    p.x = X;
+    p.y = Y;
+    p.z = Z;
+    return Error_Code;
+  }, // cs_geodetic_to_geocentric()
+
+
+  geocentric_to_geodetic : function (p) {
+/* local defintions and variables */
+/* end-criterium of loop, accuracy of sin(Latitude) */
+var genau = 1.E-12;
+var genau2 = (genau*genau);
+var maxiter = 30;
+
+    var P;        /* distance between semi-minor axis and location */
+    var RR;       /* distance between center and location */
+    var CT;       /* sin of geocentric latitude */
+    var ST;       /* cos of geocentric latitude */
+    var RX;
+    var RK;
+    var RN;       /* Earth radius at location */
+    var CPHI0;    /* cos of start or old geodetic latitude in iterations */
+    var SPHI0;    /* sin of start or old geodetic latitude in iterations */
+    var CPHI;     /* cos of searched geodetic latitude */
+    var SPHI;     /* sin of searched geodetic latitude */
+    var SDPHI;    /* end-criterium: addition-theorem of sin(Latitude(iter)-Latitude(iter-1)) */
+    var At_Pole;     /* indicates location is in polar region */
+    var iter;        /* # of continous iteration, max. 30 is always enough (s.a.) */
+
+    var X = p.x;
+    var Y = p.y;
+    var Z = p.z ? p.z : 0.0;   //Z value not always supplied
+    var Longitude;
+    var Latitude;
+    var Height;
+
+    At_Pole = false;
+    P = Math.sqrt(X*X+Y*Y);
+    RR = Math.sqrt(X*X+Y*Y+Z*Z);
+
+/*      special cases for latitude and longitude */
+    if (P/this.a < genau) {
+
+/*  special case, if P=0. (X=0., Y=0.) */
+        At_Pole = true;
+        Longitude = 0.0;
+
+/*  if (X,Y,Z)=(0.,0.,0.) then Height becomes semi-minor axis
+ *  of ellipsoid (=center of mass), Latitude becomes PI/2 */
+        if (RR/this.a < genau) {
+            Latitude = Proj4js.common.HALF_PI;
+            Height   = -this.b;
+            return;
+        }
+    } else {
+/*  ellipsoidal (geodetic) longitude
+ *  interval: -PI < Longitude <= +PI */
+        Longitude=Math.atan2(Y,X);
+    }
+
+/* --------------------------------------------------------------
+ * Following iterative algorithm was developped by
+ * "Institut fï¿œr Erdmessung", University of Hannover, July 1988.
+ * Internet: www.ife.uni-hannover.de
+ * Iterative computation of CPHI,SPHI and Height.
+ * Iteration of CPHI and SPHI to 10**-12 radian resp.
+ * 2*10**-7 arcsec.
+ * --------------------------------------------------------------
+ */
+    CT = Z/RR;
+    ST = P/RR;
+    RX = 1.0/Math.sqrt(1.0-this.es*(2.0-this.es)*ST*ST);
+    CPHI0 = ST*(1.0-this.es)*RX;
+    SPHI0 = CT*RX;
+    iter = 0;
+
+/* loop to find sin(Latitude) resp. Latitude
+ * until |sin(Latitude(iter)-Latitude(iter-1))| < genau */
+    do
+    {
+        iter++;
+        RN = this.a/Math.sqrt(1.0-this.es*SPHI0*SPHI0);
+
+/*  ellipsoidal (geodetic) height */
+        Height = P*CPHI0+Z*SPHI0-RN*(1.0-this.es*SPHI0*SPHI0);
+
+        RK = this.es*RN/(RN+Height);
+        RX = 1.0/Math.sqrt(1.0-RK*(2.0-RK)*ST*ST);
+        CPHI = ST*(1.0-RK)*RX;
+        SPHI = CT*RX;
+        SDPHI = SPHI*CPHI0-CPHI*SPHI0;
+        CPHI0 = CPHI;
+        SPHI0 = SPHI;
+    }
+    while (SDPHI*SDPHI > genau2 && iter < maxiter);
+
+/*      ellipsoidal (geodetic) latitude */
+    Latitude=Math.atan(SPHI/Math.abs(CPHI));
+
+    p.x = Longitude;
+    p.y = Latitude;
+    p.z = Height;
+    return p;
+  }, // cs_geocentric_to_geodetic()
+
+  /** Convert_Geocentric_To_Geodetic
+   * The method used here is derived from 'An Improved Algorithm for
+   * Geocentric to Geodetic Coordinate Conversion', by Ralph Toms, Feb 1996
+   */
+  geocentric_to_geodetic_noniter : function (p) {
+    var X = p.x;
+    var Y = p.y;
+    var Z = p.z ? p.z : 0;   //Z value not always supplied
+    var Longitude;
+    var Latitude;
+    var Height;
+
+    var W;        /* distance from Z axis */
+    var W2;       /* square of distance from Z axis */
+    var T0;       /* initial estimate of vertical component */
+    var T1;       /* corrected estimate of vertical component */
+    var S0;       /* initial estimate of horizontal component */
+    var S1;       /* corrected estimate of horizontal component */
+    var Sin_B0;   /* Math.sin(B0), B0 is estimate of Bowring aux variable */
+    var Sin3_B0;  /* cube of Math.sin(B0) */
+    var Cos_B0;   /* Math.cos(B0) */
+    var Sin_p1;   /* Math.sin(phi1), phi1 is estimated latitude */
+    var Cos_p1;   /* Math.cos(phi1) */
+    var Rn;       /* Earth radius at location */
+    var Sum;      /* numerator of Math.cos(phi1) */
+    var At_Pole;  /* indicates location is in polar region */
+
+    X = parseFloat(X);  // cast from string to float
+    Y = parseFloat(Y);
+    Z = parseFloat(Z);
+
+    At_Pole = false;
+    if (X != 0.0)
+    {
+        Longitude = Math.atan2(Y,X);
+    }
+    else
+    {
+        if (Y > 0)
+        {
+            Longitude = Proj4js.common.HALF_PI;
+        }
+        else if (Y < 0)
+        {
+            Longitude = -Proj4js.common.HALF_PI;
+        }
+        else
+        {
+            At_Pole = true;
+            Longitude = 0.0;
+            if (Z > 0.0)
+            {  /* north pole */
+                Latitude = Proj4js.common.HALF_PI;
+            }
+            else if (Z < 0.0)
+            {  /* south pole */
+                Latitude = -Proj4js.common.HALF_PI;
+            }
+            else
+            {  /* center of earth */
+                Latitude = Proj4js.common.HALF_PI;
+                Height = -this.b;
+                return;
+            }
+        }
+    }
+    W2 = X*X + Y*Y;
+    W = Math.sqrt(W2);
+    T0 = Z * Proj4js.common.AD_C;
+    S0 = Math.sqrt(T0 * T0 + W2);
+    Sin_B0 = T0 / S0;
+    Cos_B0 = W / S0;
+    Sin3_B0 = Sin_B0 * Sin_B0 * Sin_B0;
+    T1 = Z + this.b * this.ep2 * Sin3_B0;
+    Sum = W - this.a * this.es * Cos_B0 * Cos_B0 * Cos_B0;
+    S1 = Math.sqrt(T1*T1 + Sum * Sum);
+    Sin_p1 = T1 / S1;
+    Cos_p1 = Sum / S1;
+    Rn = this.a / Math.sqrt(1.0 - this.es * Sin_p1 * Sin_p1);
+    if (Cos_p1 >= Proj4js.common.COS_67P5)
+    {
+        Height = W / Cos_p1 - Rn;
+    }
+    else if (Cos_p1 <= -Proj4js.common.COS_67P5)
+    {
+        Height = W / -Cos_p1 - Rn;
+    }
+    else
+    {
+        Height = Z / Sin_p1 + Rn * (this.es - 1.0);
+    }
+    if (At_Pole == false)
+    {
+        Latitude = Math.atan(Sin_p1 / Cos_p1);
+    }
+
+    p.x = Longitude;
+    p.y = Latitude;
+    p.z = Height;
+    return p;
+  }, // geocentric_to_geodetic_noniter()
+
+  /****************************************************************/
+  // pj_geocentic_to_wgs84( p )
+  //  p = point to transform in geocentric coordinates (x,y,z)
+  geocentric_to_wgs84 : function ( p ) {
+
+    if( this.datum_type == Proj4js.common.PJD_3PARAM )
+    {
+      // if( x[io] == HUGE_VAL )
+      //    continue;
+      p.x += this.datum_params[0];
+      p.y += this.datum_params[1];
+      p.z += this.datum_params[2];
+
+    }
+    else if (this.datum_type == Proj4js.common.PJD_7PARAM)
+    {
+      var Dx_BF =this.datum_params[0];
+      var Dy_BF =this.datum_params[1];
+      var Dz_BF =this.datum_params[2];
+      var Rx_BF =this.datum_params[3];
+      var Ry_BF =this.datum_params[4];
+      var Rz_BF =this.datum_params[5];
+      var M_BF  =this.datum_params[6];
+      // if( x[io] == HUGE_VAL )
+      //    continue;
+      var x_out = M_BF*(       p.x - Rz_BF*p.y + Ry_BF*p.z) + Dx_BF;
+      var y_out = M_BF*( Rz_BF*p.x +       p.y - Rx_BF*p.z) + Dy_BF;
+      var z_out = M_BF*(-Ry_BF*p.x + Rx_BF*p.y +       p.z) + Dz_BF;
+      p.x = x_out;
+      p.y = y_out;
+      p.z = z_out;
+    }
+  }, // cs_geocentric_to_wgs84
+
+  /****************************************************************/
+  // pj_geocentic_from_wgs84()
+  //  coordinate system definition,
+  //  point to transform in geocentric coordinates (x,y,z)
+  geocentric_from_wgs84 : function( p ) {
+
+    if( this.datum_type == Proj4js.common.PJD_3PARAM )
+    {
+      //if( x[io] == HUGE_VAL )
+      //    continue;
+      p.x -= this.datum_params[0];
+      p.y -= this.datum_params[1];
+      p.z -= this.datum_params[2];
+
+    }
+    else if (this.datum_type == Proj4js.common.PJD_7PARAM)
+    {
+      var Dx_BF =this.datum_params[0];
+      var Dy_BF =this.datum_params[1];
+      var Dz_BF =this.datum_params[2];
+      var Rx_BF =this.datum_params[3];
+      var Ry_BF =this.datum_params[4];
+      var Rz_BF =this.datum_params[5];
+      var M_BF  =this.datum_params[6];
+      var x_tmp = (p.x - Dx_BF) / M_BF;
+      var y_tmp = (p.y - Dy_BF) / M_BF;
+      var z_tmp = (p.z - Dz_BF) / M_BF;
+      //if( x[io] == HUGE_VAL )
+      //    continue;
+
+      p.x =        x_tmp + Rz_BF*y_tmp - Ry_BF*z_tmp;
+      p.y = -Rz_BF*x_tmp +       y_tmp + Rx_BF*z_tmp;
+      p.z =  Ry_BF*x_tmp - Rx_BF*y_tmp +       z_tmp;
+    } //cs_geocentric_from_wgs84()
+  }
+});
+
+/** point object, nothing fancy, just allows values to be
+    passed back and forth by reference rather than by value.
+    Other point classes may be used as long as they have
+    x and y properties, which will get modified in the transform method.
+*/
+Proj4js.Point = Proj4js.Class({
+
+    /**
+     * Constructor: Proj4js.Point
+     *
+     * Parameters:
+     * - x {float} or {Array} either the first coordinates component or
+     *     the full coordinates
+     * - y {float} the second component
+     * - z {float} the third component, optional.
+     */
+    initialize : function(x,y,z) {
+      if (typeof x == 'object') {
+        this.x = x[0];
+        this.y = x[1];
+        this.z = x[2] || 0.0;
+      } else if (typeof x == 'string' && typeof y == 'undefined') {
+        var coords = x.split(',');
+        this.x = parseFloat(coords[0]);
+        this.y = parseFloat(coords[1]);
+        this.z = parseFloat(coords[2]) || 0.0;
+      } else {
+        this.x = x;
+        this.y = y;
+        this.z = z || 0.0;
+      }
+    },
+
+    /**
+     * APIMethod: clone
+     * Build a copy of a Proj4js.Point object.
+     *
+     * Return:
+     * {Proj4js}.Point the cloned point.
+     */
+    clone : function() {
+      return new Proj4js.Point(this.x, this.y, this.z);
+    },
+
+    /**
+     * APIMethod: toString
+     * Return a readable string version of the point
+     *
+     * Return:
+     * {String} String representation of Proj4js.Point object. 
+     *           (ex. <i>"x=5,y=42"</i>)
+     */
+    toString : function() {
+        return ("x=" + this.x + ",y=" + this.y);
+    },
+
+    /** 
+     * APIMethod: toShortString
+     * Return a short string version of the point.
+     *
+     * Return:
+     * {String} Shortened String representation of Proj4js.Point object. 
+     *         (ex. <i>"5, 42"</i>)
+     */
+    toShortString : function() {
+        return (this.x + ", " + this.y);
+    }
+});
+
+Proj4js.PrimeMeridian = {
+    "greenwich": 0.0,               //"0dE",
+    "lisbon":     -9.131906111111,   //"9d07'54.862\"W",
+    "paris":       2.337229166667,   //"2d20'14.025\"E",
+    "bogota":    -74.080916666667,  //"74d04'51.3\"W",
+    "madrid":     -3.687938888889,  //"3d41'16.58\"W",
+    "rome":       12.452333333333,  //"12d27'8.4\"E",
+    "bern":        7.439583333333,  //"7d26'22.5\"E",
+    "jakarta":   106.807719444444,  //"106d48'27.79\"E",
+    "ferro":     -17.666666666667,  //"17d40'W",
+    "brussels":    4.367975,        //"4d22'4.71\"E",
+    "stockholm":  18.058277777778,  //"18d3'29.8\"E",
+    "athens":     23.7163375,       //"23d42'58.815\"E",
+    "oslo":       10.722916666667   //"10d43'22.5\"E"
+};
+
+Proj4js.Ellipsoid = {
+  "MERIT": {a:6378137.0, rf:298.257, ellipseName:"MERIT 1983"},
+  "SGS85": {a:6378136.0, rf:298.257, ellipseName:"Soviet Geodetic System 85"},
+  "GRS80": {a:6378137.0, rf:298.257222101, ellipseName:"GRS 1980(IUGG, 1980)"},
+  "IAU76": {a:6378140.0, rf:298.257, ellipseName:"IAU 1976"},
+  "airy": {a:6377563.396, b:6356256.910, ellipseName:"Airy 1830"},
+  "APL4.": {a:6378137, rf:298.25, ellipseName:"Appl. Physics. 1965"},
+  "NWL9D": {a:6378145.0, rf:298.25, ellipseName:"Naval Weapons Lab., 1965"},
+  "mod_airy": {a:6377340.189, b:6356034.446, ellipseName:"Modified Airy"},
+  "andrae": {a:6377104.43, rf:300.0, ellipseName:"Andrae 1876 (Den., Iclnd.)"},
+  "aust_SA": {a:6378160.0, rf:298.25, ellipseName:"Australian Natl & S. Amer. 1969"},
+  "GRS67": {a:6378160.0, rf:298.2471674270, ellipseName:"GRS 67(IUGG 1967)"},
+  "bessel": {a:6377397.155, rf:299.1528128, ellipseName:"Bessel 1841"},
+  "bess_nam": {a:6377483.865, rf:299.1528128, ellipseName:"Bessel 1841 (Namibia)"},
+  "clrk66": {a:6378206.4, b:6356583.8, ellipseName:"Clarke 1866"},
+  "clrk80": {a:6378249.145, rf:293.4663, ellipseName:"Clarke 1880 mod."},
+  "CPM": {a:6375738.7, rf:334.29, ellipseName:"Comm. des Poids et Mesures 1799"},
+  "delmbr": {a:6376428.0, rf:311.5, ellipseName:"Delambre 1810 (Belgium)"},
+  "engelis": {a:6378136.05, rf:298.2566, ellipseName:"Engelis 1985"},
+  "evrst30": {a:6377276.345, rf:300.8017, ellipseName:"Everest 1830"},
+  "evrst48": {a:6377304.063, rf:300.8017, ellipseName:"Everest 1948"},
+  "evrst56": {a:6377301.243, rf:300.8017, ellipseName:"Everest 1956"},
+  "evrst69": {a:6377295.664, rf:300.8017, ellipseName:"Everest 1969"},
+  "evrstSS": {a:6377298.556, rf:300.8017, ellipseName:"Everest (Sabah & Sarawak)"},
+  "fschr60": {a:6378166.0, rf:298.3, ellipseName:"Fischer (Mercury Datum) 1960"},
+  "fschr60m": {a:6378155.0, rf:298.3, ellipseName:"Fischer 1960"},
+  "fschr68": {a:6378150.0, rf:298.3, ellipseName:"Fischer 1968"},
+  "helmert": {a:6378200.0, rf:298.3, ellipseName:"Helmert 1906"},
+  "hough": {a:6378270.0, rf:297.0, ellipseName:"Hough"},
+  "intl": {a:6378388.0, rf:297.0, ellipseName:"International 1909 (Hayford)"},
+  "kaula": {a:6378163.0, rf:298.24, ellipseName:"Kaula 1961"},
+  "lerch": {a:6378139.0, rf:298.257, ellipseName:"Lerch 1979"},
+  "mprts": {a:6397300.0, rf:191.0, ellipseName:"Maupertius 1738"},
+  "new_intl": {a:6378157.5, b:6356772.2, ellipseName:"New International 1967"},
+  "plessis": {a:6376523.0, rf:6355863.0, ellipseName:"Plessis 1817 (France)"},
+  "krass": {a:6378245.0, rf:298.3, ellipseName:"Krassovsky, 1942"},
+  "SEasia": {a:6378155.0, b:6356773.3205, ellipseName:"Southeast Asia"},
+  "walbeck": {a:6376896.0, b:6355834.8467, ellipseName:"Walbeck"},
+  "WGS60": {a:6378165.0, rf:298.3, ellipseName:"WGS 60"},
+  "WGS66": {a:6378145.0, rf:298.25, ellipseName:"WGS 66"},
+  "WGS72": {a:6378135.0, rf:298.26, ellipseName:"WGS 72"},
+  "WGS84": {a:6378137.0, rf:298.257223563, ellipseName:"WGS 84"},
+  "sphere": {a:6370997.0, b:6370997.0, ellipseName:"Normal Sphere (r=6370997)"}
+};
+
+Proj4js.Datum = {
+  "WGS84": {towgs84: "0,0,0", ellipse: "WGS84", datumName: "WGS84"},
+  "GGRS87": {towgs84: "-199.87,74.79,246.62", ellipse: "GRS80", datumName: "Greek_Geodetic_Reference_System_1987"},
+  "NAD83": {towgs84: "0,0,0", ellipse: "GRS80", datumName: "North_American_Datum_1983"},
+  "NAD27": {nadgrids: "@conus,@alaska,@ntv2_0.gsb,@ntv1_can.dat", ellipse: "clrk66", datumName: "North_American_Datum_1927"},
+  "potsdam": {towgs84: "606.0,23.0,413.0", ellipse: "bessel", datumName: "Potsdam Rauenberg 1950 DHDN"},
+  "carthage": {towgs84: "-263.0,6.0,431.0", ellipse: "clark80", datumName: "Carthage 1934 Tunisia"},
+  "hermannskogel": {towgs84: "653.0,-212.0,449.0", ellipse: "bessel", datumName: "Hermannskogel"},
+  "ire65": {towgs84: "482.530,-130.596,564.557,-1.042,-0.214,-0.631,8.15", ellipse: "mod_airy", datumName: "Ireland 1965"},
+  "nzgd49": {towgs84: "59.47,-5.04,187.44,0.47,-0.1,1.024,-4.5993", ellipse: "intl", datumName: "New Zealand Geodetic Datum 1949"},
+  "OSGB36": {towgs84: "446.448,-125.157,542.060,0.1502,0.2470,0.8421,-20.4894", ellipse: "airy", datumName: "Airy 1830"}
+};
+
+Proj4js.WGS84 = new Proj4js.Proj('WGS84');
+Proj4js.Datum['OSB36'] = Proj4js.Datum['OSGB36']; //as returned from spatialreference.org
+
+//lookup table to go from the projection name in WKT to the Proj4js projection name
+//build this out as required
+Proj4js.wktProjections = {
+  "Lambert Tangential Conformal Conic Projection": "lcc",
+  "Mercator": "merc",
+  "Popular Visualisation Pseudo Mercator": "merc",
+  "Transverse_Mercator": "tmerc",
+  "Transverse Mercator": "tmerc",
+  "Lambert Azimuthal Equal Area": "laea",
+  "Universal Transverse Mercator System": "utm"
+};
+
+
Index: /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-compressed.js
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-compressed.js	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/lib/proj4js-compressed.js	(revision 76)
@@ -0,0 +1,242 @@
+/*
+  proj4js.js -- Javascript reprojection library. 
+  
+  Authors:      Mike Adair madairATdmsolutions.ca
+                Richard Greenwood richATgreenwoodmap.com
+                Didier Richard didier.richardATign.fr
+                Stephen Irons
+  License:      LGPL as per: http://www.gnu.org/copyleft/lesser.html 
+                Note: This program is an almost direct port of the C library
+                Proj4.
+*/
+Proj4js={defaultDatum:'WGS84',transform:function(source,dest,point){if(!source.readyToUse){this.reportError("Proj4js initialization for:"+source.srsCode+" not yet complete");return point;}
+if(!dest.readyToUse){this.reportError("Proj4js initialization for:"+dest.srsCode+" not yet complete");return point;}
+if((source.srsProjNumber=="900913"&&dest.datumCode!="WGS84"&&!dest.datum_params)||(dest.srsProjNumber=="900913"&&source.datumCode!="WGS84"&&!source.datum_params)){var wgs84=Proj4js.WGS84;this.transform(source,wgs84,point);source=wgs84;}
+if(source.axis!="enu"){this.adjust_axis(source,false,point);}
+if(source.projName=="longlat"){point.x*=Proj4js.common.D2R;point.y*=Proj4js.common.D2R;}else{if(source.to_meter){point.x*=source.to_meter;point.y*=source.to_meter;}
+source.inverse(point);}
+if(source.from_greenwich){point.x+=source.from_greenwich;}
+point=this.datum_transform(source.datum,dest.datum,point);if(dest.from_greenwich){point.x-=dest.from_greenwich;}
+if(dest.projName=="longlat"){point.x*=Proj4js.common.R2D;point.y*=Proj4js.common.R2D;}else{dest.forward(point);if(dest.to_meter){point.x/=dest.to_meter;point.y/=dest.to_meter;}}
+if(dest.axis!="enu"){this.adjust_axis(dest,true,point);}
+return point;},datum_transform:function(source,dest,point){if(source.compare_datums(dest)){return point;}
+if(source.datum_type==Proj4js.common.PJD_NODATUM||dest.datum_type==Proj4js.common.PJD_NODATUM){return point;}
+if(source.datum_type==Proj4js.common.PJD_GRIDSHIFT)
+{alert("ERROR: Grid shift transformations are not implemented yet.");}
+if(dest.datum_type==Proj4js.common.PJD_GRIDSHIFT)
+{alert("ERROR: Grid shift transformations are not implemented yet.");}
+if(source.es!=dest.es||source.a!=dest.a||source.datum_type==Proj4js.common.PJD_3PARAM||source.datum_type==Proj4js.common.PJD_7PARAM||dest.datum_type==Proj4js.common.PJD_3PARAM||dest.datum_type==Proj4js.common.PJD_7PARAM)
+{source.geodetic_to_geocentric(point);if(source.datum_type==Proj4js.common.PJD_3PARAM||source.datum_type==Proj4js.common.PJD_7PARAM){source.geocentric_to_wgs84(point);}
+if(dest.datum_type==Proj4js.common.PJD_3PARAM||dest.datum_type==Proj4js.common.PJD_7PARAM){dest.geocentric_from_wgs84(point);}
+dest.geocentric_to_geodetic(point);}
+if(dest.datum_type==Proj4js.common.PJD_GRIDSHIFT)
+{alert("ERROR: Grid shift transformations are not implemented yet.");}
+return point;},adjust_axis:function(crs,denorm,point){var xin=point.x,yin=point.y,zin=point.z||0.0;var v,t;for(var i=0;i<3;i++){if(denorm&&i==2&&point.z===undefined){continue;}
+if(i==0){v=xin;t='x';}
+else if(i==1){v=yin;t='y';}
+else{v=zin;t='z';}
+switch(crs.axis[i]){case'e':point[t]=v;break;case'w':point[t]=-v;break;case'n':point[t]=v;break;case's':point[t]=-v;break;case'u':if(point[t]!==undefined){point.z=v;}
+break;case'd':if(point[t]!==undefined){point.z=-v;}
+break;default:alert("ERROR: unknow axis ("+crs.axis[i]+") - check definition of "+src.projName);return null;}}
+return point;},reportError:function(msg){},extend:function(destination,source){destination=destination||{};if(source){for(var property in source){var value=source[property];if(value!==undefined){destination[property]=value;}}}
+return destination;},Class:function(){var Class=function(){this.initialize.apply(this,arguments);};var extended={};var parent;for(var i=0;i<arguments.length;++i){if(typeof arguments[i]=="function"){parent=arguments[i].prototype;}else{parent=arguments[i];}
+Proj4js.extend(extended,parent);}
+Class.prototype=extended;return Class;},bind:function(func,object){var args=Array.prototype.slice.apply(arguments,[2]);return function(){var newArgs=args.concat(Array.prototype.slice.apply(arguments,[0]));return func.apply(object,newArgs);};},scriptName:"proj4js-compressed.js",defsLookupService:'http://spatialreference.org/ref',libPath:null,getScriptLocation:function(){if(this.libPath)return this.libPath;var scriptName=this.scriptName;var scriptNameLen=scriptName.length;var scripts=document.getElementsByTagName('script');for(var i=0;i<scripts.length;i++){var src=scripts[i].getAttribute('src');if(src){var index=src.lastIndexOf(scriptName);if((index>-1)&&(index+scriptNameLen==src.length)){this.libPath=src.slice(0,-scriptNameLen);break;}}}
+return this.libPath||"";},loadScript:function(url,onload,onfail,loadCheck){var script=document.createElement('script');script.defer=false;script.type="text/javascript";script.id=url;script.src=url;script.onload=onload;script.onerror=onfail;script.loadCheck=loadCheck;if(/MSIE/.test(navigator.userAgent)){script.onreadystatechange=this.checkReadyState;}
+document.getElementsByTagName('head')[0].appendChild(script);},checkReadyState:function(){if(this.readyState=='loaded'){if(!this.loadCheck()){this.onerror();}else{this.onload();}}}};Proj4js.Proj=Proj4js.Class({readyToUse:false,title:null,projName:null,units:null,datum:null,x0:0,y0:0,localCS:false,queue:null,initialize:function(srsCode,callback){this.srsCodeInput=srsCode;this.queue=[];if(callback){this.queue.push(callback);}
+if((srsCode.indexOf('GEOGCS')>=0)||(srsCode.indexOf('GEOCCS')>=0)||(srsCode.indexOf('PROJCS')>=0)||(srsCode.indexOf('LOCAL_CS')>=0)){this.parseWKT(srsCode);this.deriveConstants();this.loadProjCode(this.projName);return;}
+if(srsCode.indexOf('urn:')==0){var urn=srsCode.split(':');if((urn[1]=='ogc'||urn[1]=='x-ogc')&&(urn[2]=='def')&&(urn[3]=='crs')){srsCode=urn[4]+':'+urn[urn.length-1];}}else if(srsCode.indexOf('http://')==0){var url=srsCode.split('#');if(url[0].match(/epsg.org/)){srsCode='EPSG:'+url[1];}else if(url[0].match(/RIG.xml/)){srsCode='IGNF:'+url[1];}}
+this.srsCode=srsCode.toUpperCase();if(this.srsCode.indexOf("EPSG")==0){this.srsCode=this.srsCode;this.srsAuth='epsg';this.srsProjNumber=this.srsCode.substring(5);}else if(this.srsCode.indexOf("IGNF")==0){this.srsCode=this.srsCode;this.srsAuth='IGNF';this.srsProjNumber=this.srsCode.substring(5);}else if(this.srsCode.indexOf("CRS")==0){this.srsCode=this.srsCode;this.srsAuth='CRS';this.srsProjNumber=this.srsCode.substring(4);}else{this.srsAuth='';this.srsProjNumber=this.srsCode;}
+this.loadProjDefinition();},loadProjDefinition:function(){if(Proj4js.defs[this.srsCode]){this.defsLoaded();return;}
+var url=Proj4js.getScriptLocation()+'defs/'+this.srsAuth.toUpperCase()+this.srsProjNumber+'.js';Proj4js.loadScript(url,Proj4js.bind(this.defsLoaded,this),Proj4js.bind(this.loadFromService,this),Proj4js.bind(this.checkDefsLoaded,this));},loadFromService:function(){var url=Proj4js.defsLookupService+'/'+this.srsAuth+'/'+this.srsProjNumber+'/proj4js/';Proj4js.loadScript(url,Proj4js.bind(this.defsLoaded,this),Proj4js.bind(this.defsFailed,this),Proj4js.bind(this.checkDefsLoaded,this));},defsLoaded:function(){this.parseDefs();this.loadProjCode(this.projName);},checkDefsLoaded:function(){if(Proj4js.defs[this.srsCode]){return true;}else{return false;}},defsFailed:function(){Proj4js.reportError('failed to load projection definition for: '+this.srsCode);Proj4js.defs[this.srsCode]=Proj4js.defs['WGS84'];this.defsLoaded();},loadProjCode:function(projName){if(Proj4js.Proj[projName]){this.initTransforms();return;}
+var url=Proj4js.getScriptLocation()+'projCode/'+projName+'.js';Proj4js.loadScript(url,Proj4js.bind(this.loadProjCodeSuccess,this,projName),Proj4js.bind(this.loadProjCodeFailure,this,projName),Proj4js.bind(this.checkCodeLoaded,this,projName));},loadProjCodeSuccess:function(projName){if(Proj4js.Proj[projName].dependsOn){this.loadProjCode(Proj4js.Proj[projName].dependsOn);}else{this.initTransforms();}},loadProjCodeFailure:function(projName){Proj4js.reportError("failed to find projection file for: "+projName);},checkCodeLoaded:function(projName){if(Proj4js.Proj[projName]){return true;}else{return false;}},initTransforms:function(){Proj4js.extend(this,Proj4js.Proj[this.projName]);this.init();this.readyToUse=true;if(this.queue){var item;while((item=this.queue.shift())){item.call(this,this);}}},wktRE:/^(\w+)\[(.*)\]$/,parseWKT:function(wkt){var wktMatch=wkt.match(this.wktRE);if(!wktMatch)return;var wktObject=wktMatch[1];var wktContent=wktMatch[2];var wktTemp=wktContent.split(",");var wktName;if(wktObject.toUpperCase()=="TOWGS84"){wktName=wktObject;}else{wktName=wktTemp.shift();}
+wktName=wktName.replace(/^\"/,"");wktName=wktName.replace(/\"$/,"");var wktArray=new Array();var bkCount=0;var obj="";for(var i=0;i<wktTemp.length;++i){var token=wktTemp[i];for(var j=0;j<token.length;++j){if(token.charAt(j)=="[")++bkCount;if(token.charAt(j)=="]")--bkCount;}
+obj+=token;if(bkCount===0){wktArray.push(obj);obj="";}else{obj+=",";}}
+switch(wktObject){case'LOCAL_CS':this.projName='identity'
+this.localCS=true;this.srsCode=wktName;break;case'GEOGCS':this.projName='longlat'
+this.geocsCode=wktName;if(!this.srsCode)this.srsCode=wktName;break;case'PROJCS':this.srsCode=wktName;break;case'GEOCCS':break;case'PROJECTION':this.projName=Proj4js.wktProjections[wktName]
+break;case'DATUM':this.datumName=wktName;break;case'LOCAL_DATUM':this.datumCode='none';break;case'SPHEROID':this.ellps=wktName;this.a=parseFloat(wktArray.shift());this.rf=parseFloat(wktArray.shift());break;case'PRIMEM':this.from_greenwich=parseFloat(wktArray.shift());break;case'UNIT':this.units=wktName;this.unitsPerMeter=parseFloat(wktArray.shift());break;case'PARAMETER':var name=wktName.toLowerCase();var value=parseFloat(wktArray.shift());switch(name){case'false_easting':this.x0=value;break;case'false_northing':this.y0=value;break;case'scale_factor':this.k0=value;break;case'central_meridian':this.long0=value*Proj4js.common.D2R;break;case'latitude_of_origin':this.lat0=value*Proj4js.common.D2R;break;case'more_here':break;default:break;}
+break;case'TOWGS84':this.datum_params=wktArray;break;case'AXIS':var name=wktName.toLowerCase();var value=wktArray.shift();switch(value){case'EAST':value='e';break;case'WEST':value='w';break;case'NORTH':value='n';break;case'SOUTH':value='s';break;case'UP':value='u';break;case'DOWN':value='d';break;case'OTHER':default:value=' ';break;}
+if(!this.axis){this.axis="enu";}
+switch(name){case'X':this.axis=value+this.axis.substr(1,2);break;case'Y':this.axis=this.axis.substr(0,1)+value+this.axis.substr(2,1);break;case'Z':this.axis=this.axis.substr(0,2)+value;break;default:break;}
+case'MORE_HERE':break;default:break;}
+for(var i=0;i<wktArray.length;++i){this.parseWKT(wktArray[i]);}},parseDefs:function(){this.defData=Proj4js.defs[this.srsCode];var paramName,paramVal;if(!this.defData){return;}
+var paramArray=this.defData.split("+");for(var prop=0;prop<paramArray.length;prop++){var property=paramArray[prop].split("=");paramName=property[0].toLowerCase();paramVal=property[1];switch(paramName.replace(/\s/gi,"")){case"":break;case"title":this.title=paramVal;break;case"proj":this.projName=paramVal.replace(/\s/gi,"");break;case"units":this.units=paramVal.replace(/\s/gi,"");break;case"datum":this.datumCode=paramVal.replace(/\s/gi,"");break;case"nadgrids":this.nagrids=paramVal.replace(/\s/gi,"");break;case"ellps":this.ellps=paramVal.replace(/\s/gi,"");break;case"a":this.a=parseFloat(paramVal);break;case"b":this.b=parseFloat(paramVal);break;case"rf":this.rf=parseFloat(paramVal);break;case"lat_0":this.lat0=paramVal*Proj4js.common.D2R;break;case"lat_1":this.lat1=paramVal*Proj4js.common.D2R;break;case"lat_2":this.lat2=paramVal*Proj4js.common.D2R;break;case"lat_ts":this.lat_ts=paramVal*Proj4js.common.D2R;break;case"lon_0":this.long0=paramVal*Proj4js.common.D2R;break;case"alpha":this.alpha=parseFloat(paramVal)*Proj4js.common.D2R;break;case"lonc":this.longc=paramVal*Proj4js.common.D2R;break;case"x_0":this.x0=parseFloat(paramVal);break;case"y_0":this.y0=parseFloat(paramVal);break;case"k_0":this.k0=parseFloat(paramVal);break;case"k":this.k0=parseFloat(paramVal);break;case"r_a":this.R_A=true;break;case"zone":this.zone=parseInt(paramVal);break;case"south":this.utmSouth=true;break;case"towgs84":this.datum_params=paramVal.split(",");break;case"to_meter":this.to_meter=parseFloat(paramVal);break;case"from_greenwich":this.from_greenwich=paramVal*Proj4js.common.D2R;break;case"pm":paramVal=paramVal.replace(/\s/gi,"");this.from_greenwich=Proj4js.PrimeMeridian[paramVal]?Proj4js.PrimeMeridian[paramVal]:parseFloat(paramVal);this.from_greenwich*=Proj4js.common.D2R;break;case"axis":paramVal=paramVal.replace(/\s/gi,"");var legalAxis="ewnsud";if(paramVal.length==3&&legalAxis.indexOf(paramVal.substr(0,1))!=-1&&legalAxis.indexOf(paramVal.substr(1,1))!=-1&&legalAxis.indexOf(paramVal.substr(2,1))!=-1){this.axis=paramVal;}
+break
+case"no_defs":break;default:}}
+this.deriveConstants();},deriveConstants:function(){if(this.nagrids=='@null')this.datumCode='none';if(this.datumCode&&this.datumCode!='none'){var datumDef=Proj4js.Datum[this.datumCode];if(datumDef){this.datum_params=datumDef.towgs84?datumDef.towgs84.split(','):null;this.ellps=datumDef.ellipse;this.datumName=datumDef.datumName?datumDef.datumName:this.datumCode;}}
+if(!this.a){var ellipse=Proj4js.Ellipsoid[this.ellps]?Proj4js.Ellipsoid[this.ellps]:Proj4js.Ellipsoid['WGS84'];Proj4js.extend(this,ellipse);}
+if(this.rf&&!this.b)this.b=(1.0-1.0/this.rf)*this.a;if(Math.abs(this.a-this.b)<Proj4js.common.EPSLN){this.sphere=true;this.b=this.a;}
+this.a2=this.a*this.a;this.b2=this.b*this.b;this.es=(this.a2-this.b2)/this.a2;this.e=Math.sqrt(this.es);if(this.R_A){this.a*=1.-this.es*(Proj4js.common.SIXTH+this.es*(Proj4js.common.RA4+this.es*Proj4js.common.RA6));this.a2=this.a*this.a;this.b2=this.b*this.b;this.es=0.;}
+this.ep2=(this.a2-this.b2)/this.b2;if(!this.k0)this.k0=1.0;if(!this.axis){this.axis="enu";}
+this.datum=new Proj4js.datum(this);}});Proj4js.Proj.longlat={init:function(){},forward:function(pt){return pt;},inverse:function(pt){return pt;}};Proj4js.Proj.identity=Proj4js.Proj.longlat;Proj4js.defs={'WGS84':"+title=long/lat:WGS84 +proj=longlat +ellps=WGS84 +datum=WGS84 +units=degrees",'EPSG:4326':"+title=long/lat:WGS84 +proj=longlat +a=6378137.0 +b=6356752.31424518 +ellps=WGS84 +datum=WGS84 +units=degrees",'EPSG:4269':"+title=long/lat:NAD83 +proj=longlat +a=6378137.0 +b=6356752.31414036 +ellps=GRS80 +datum=NAD83 +units=degrees",'EPSG:3785':"+title= Google Mercator +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs"};Proj4js.defs['GOOGLE']=Proj4js.defs['EPSG:3785'];Proj4js.defs['EPSG:900913']=Proj4js.defs['EPSG:3785'];Proj4js.defs['EPSG:102113']=Proj4js.defs['EPSG:3785'];Proj4js.common={PI:3.141592653589793238,HALF_PI:1.570796326794896619,TWO_PI:6.283185307179586477,FORTPI:0.78539816339744833,R2D:57.29577951308232088,D2R:0.01745329251994329577,SEC_TO_RAD:4.84813681109535993589914102357e-6,EPSLN:1.0e-10,MAX_ITER:20,COS_67P5:0.38268343236508977,AD_C:1.0026000,PJD_UNKNOWN:0,PJD_3PARAM:1,PJD_7PARAM:2,PJD_GRIDSHIFT:3,PJD_WGS84:4,PJD_NODATUM:5,SRS_WGS84_SEMIMAJOR:6378137.0,SIXTH:.1666666666666666667,RA4:.04722222222222222222,RA6:.02215608465608465608,RV4:.06944444444444444444,RV6:.04243827160493827160,msfnz:function(eccent,sinphi,cosphi){var con=eccent*sinphi;return cosphi/(Math.sqrt(1.0-con*con));},tsfnz:function(eccent,phi,sinphi){var con=eccent*sinphi;var com=.5*eccent;con=Math.pow(((1.0-con)/(1.0+con)),com);return(Math.tan(.5*(this.HALF_PI-phi))/con);},phi2z:function(eccent,ts){var eccnth=.5*eccent;var con,dphi;var phi=this.HALF_PI-2*Math.atan(ts);for(var i=0;i<=15;i++){con=eccent*Math.sin(phi);dphi=this.HALF_PI-2*Math.atan(ts*(Math.pow(((1.0-con)/(1.0+con)),eccnth)))-phi;phi+=dphi;if(Math.abs(dphi)<=.0000000001)return phi;}
+alert("phi2z has NoConvergence");return(-9999);},qsfnz:function(eccent,sinphi){var con;if(eccent>1.0e-7){con=eccent*sinphi;return((1.0-eccent*eccent)*(sinphi/(1.0-con*con)-(.5/eccent)*Math.log((1.0-con)/(1.0+con))));}else{return(2.0*sinphi);}},asinz:function(x){if(Math.abs(x)>1.0){x=(x>1.0)?1.0:-1.0;}
+return Math.asin(x);},e0fn:function(x){return(1.0-0.25*x*(1.0+x/16.0*(3.0+1.25*x)));},e1fn:function(x){return(0.375*x*(1.0+0.25*x*(1.0+0.46875*x)));},e2fn:function(x){return(0.05859375*x*x*(1.0+0.75*x));},e3fn:function(x){return(x*x*x*(35.0/3072.0));},mlfn:function(e0,e1,e2,e3,phi){return(e0*phi-e1*Math.sin(2.0*phi)+e2*Math.sin(4.0*phi)-e3*Math.sin(6.0*phi));},srat:function(esinp,exp){return(Math.pow((1.0-esinp)/(1.0+esinp),exp));},sign:function(x){if(x<0.0)return(-1);else return(1);},adjust_lon:function(x){x=(Math.abs(x)<this.PI)?x:(x-(this.sign(x)*this.TWO_PI));return x;},adjust_lat:function(x){x=(Math.abs(x)<this.HALF_PI)?x:(x-(this.sign(x)*this.PI));return x;},latiso:function(eccent,phi,sinphi){if(Math.abs(phi)>this.HALF_PI)return+Number.NaN;if(phi==this.HALF_PI)return Number.POSITIVE_INFINITY;if(phi==-1.0*this.HALF_PI)return-1.0*Number.POSITIVE_INFINITY;var con=eccent*sinphi;return Math.log(Math.tan((this.HALF_PI+phi)/2.0))+eccent*Math.log((1.0-con)/(1.0+con))/2.0;},fL:function(x,L){return 2.0*Math.atan(x*Math.exp(L))-this.HALF_PI;},invlatiso:function(eccent,ts){var phi=this.fL(1.0,ts);var Iphi=0.0;var con=0.0;do{Iphi=phi;con=eccent*Math.sin(Iphi);phi=this.fL(Math.exp(eccent*Math.log((1.0+con)/(1.0-con))/2.0),ts)}while(Math.abs(phi-Iphi)>1.0e-12);return phi;},sinh:function(x)
+{var r=Math.exp(x);r=(r-1.0/r)/2.0;return r;},cosh:function(x)
+{var r=Math.exp(x);r=(r+1.0/r)/2.0;return r;},tanh:function(x)
+{var r=Math.exp(x);r=(r-1.0/r)/(r+1.0/r);return r;},asinh:function(x)
+{var s=(x>=0?1.0:-1.0);return s*(Math.log(Math.abs(x)+Math.sqrt(x*x+1.0)));},acosh:function(x)
+{return 2.0*Math.log(Math.sqrt((x+1.0)/2.0)+Math.sqrt((x-1.0)/2.0));},atanh:function(x)
+{return Math.log((x-1.0)/(x+1.0))/2.0;},gN:function(a,e,sinphi)
+{var temp=e*sinphi;return a/Math.sqrt(1.0-temp*temp);}};Proj4js.datum=Proj4js.Class({initialize:function(proj){this.datum_type=Proj4js.common.PJD_WGS84;if(proj.datumCode&&proj.datumCode=='none'){this.datum_type=Proj4js.common.PJD_NODATUM;}
+if(proj&&proj.datum_params){for(var i=0;i<proj.datum_params.length;i++){proj.datum_params[i]=parseFloat(proj.datum_params[i]);}
+if(proj.datum_params[0]!=0||proj.datum_params[1]!=0||proj.datum_params[2]!=0){this.datum_type=Proj4js.common.PJD_3PARAM;}
+if(proj.datum_params.length>3){if(proj.datum_params[3]!=0||proj.datum_params[4]!=0||proj.datum_params[5]!=0||proj.datum_params[6]!=0){this.datum_type=Proj4js.common.PJD_7PARAM;proj.datum_params[3]*=Proj4js.common.SEC_TO_RAD;proj.datum_params[4]*=Proj4js.common.SEC_TO_RAD;proj.datum_params[5]*=Proj4js.common.SEC_TO_RAD;proj.datum_params[6]=(proj.datum_params[6]/1000000.0)+1.0;}}}
+if(proj){this.a=proj.a;this.b=proj.b;this.es=proj.es;this.ep2=proj.ep2;this.datum_params=proj.datum_params;}},compare_datums:function(dest){if(this.datum_type!=dest.datum_type){return false;}else if(this.a!=dest.a||Math.abs(this.es-dest.es)>0.000000000050){return false;}else if(this.datum_type==Proj4js.common.PJD_3PARAM){return(this.datum_params[0]==dest.datum_params[0]&&this.datum_params[1]==dest.datum_params[1]&&this.datum_params[2]==dest.datum_params[2]);}else if(this.datum_type==Proj4js.common.PJD_7PARAM){return(this.datum_params[0]==dest.datum_params[0]&&this.datum_params[1]==dest.datum_params[1]&&this.datum_params[2]==dest.datum_params[2]&&this.datum_params[3]==dest.datum_params[3]&&this.datum_params[4]==dest.datum_params[4]&&this.datum_params[5]==dest.datum_params[5]&&this.datum_params[6]==dest.datum_params[6]);}else if(this.datum_type==Proj4js.common.PJD_GRIDSHIFT){return strcmp(pj_param(this.params,"snadgrids").s,pj_param(dest.params,"snadgrids").s)==0;}else{return true;}},geodetic_to_geocentric:function(p){var Longitude=p.x;var Latitude=p.y;var Height=p.z?p.z:0;var X;var Y;var Z;var Error_Code=0;var Rn;var Sin_Lat;var Sin2_Lat;var Cos_Lat;if(Latitude<-Proj4js.common.HALF_PI&&Latitude>-1.001*Proj4js.common.HALF_PI){Latitude=-Proj4js.common.HALF_PI;}else if(Latitude>Proj4js.common.HALF_PI&&Latitude<1.001*Proj4js.common.HALF_PI){Latitude=Proj4js.common.HALF_PI;}else if((Latitude<-Proj4js.common.HALF_PI)||(Latitude>Proj4js.common.HALF_PI)){Proj4js.reportError('geocent:lat out of range:'+Latitude);return null;}
+if(Longitude>Proj4js.common.PI)Longitude-=(2*Proj4js.common.PI);Sin_Lat=Math.sin(Latitude);Cos_Lat=Math.cos(Latitude);Sin2_Lat=Sin_Lat*Sin_Lat;Rn=this.a/(Math.sqrt(1.0e0-this.es*Sin2_Lat));X=(Rn+Height)*Cos_Lat*Math.cos(Longitude);Y=(Rn+Height)*Cos_Lat*Math.sin(Longitude);Z=((Rn*(1-this.es))+Height)*Sin_Lat;p.x=X;p.y=Y;p.z=Z;return Error_Code;},geocentric_to_geodetic:function(p){var genau=1.E-12;var genau2=(genau*genau);var maxiter=30;var P;var RR;var CT;var ST;var RX;var RK;var RN;var CPHI0;var SPHI0;var CPHI;var SPHI;var SDPHI;var At_Pole;var iter;var X=p.x;var Y=p.y;var Z=p.z?p.z:0.0;var Longitude;var Latitude;var Height;At_Pole=false;P=Math.sqrt(X*X+Y*Y);RR=Math.sqrt(X*X+Y*Y+Z*Z);if(P/this.a<genau){At_Pole=true;Longitude=0.0;if(RR/this.a<genau){Latitude=Proj4js.common.HALF_PI;Height=-this.b;return;}}else{Longitude=Math.atan2(Y,X);}
+CT=Z/RR;ST=P/RR;RX=1.0/Math.sqrt(1.0-this.es*(2.0-this.es)*ST*ST);CPHI0=ST*(1.0-this.es)*RX;SPHI0=CT*RX;iter=0;do
+{iter++;RN=this.a/Math.sqrt(1.0-this.es*SPHI0*SPHI0);Height=P*CPHI0+Z*SPHI0-RN*(1.0-this.es*SPHI0*SPHI0);RK=this.es*RN/(RN+Height);RX=1.0/Math.sqrt(1.0-RK*(2.0-RK)*ST*ST);CPHI=ST*(1.0-RK)*RX;SPHI=CT*RX;SDPHI=SPHI*CPHI0-CPHI*SPHI0;CPHI0=CPHI;SPHI0=SPHI;}
+while(SDPHI*SDPHI>genau2&&iter<maxiter);Latitude=Math.atan(SPHI/Math.abs(CPHI));p.x=Longitude;p.y=Latitude;p.z=Height;return p;},geocentric_to_geodetic_noniter:function(p){var X=p.x;var Y=p.y;var Z=p.z?p.z:0;var Longitude;var Latitude;var Height;var W;var W2;var T0;var T1;var S0;var S1;var Sin_B0;var Sin3_B0;var Cos_B0;var Sin_p1;var Cos_p1;var Rn;var Sum;var At_Pole;X=parseFloat(X);Y=parseFloat(Y);Z=parseFloat(Z);At_Pole=false;if(X!=0.0)
+{Longitude=Math.atan2(Y,X);}
+else
+{if(Y>0)
+{Longitude=Proj4js.common.HALF_PI;}
+else if(Y<0)
+{Longitude=-Proj4js.common.HALF_PI;}
+else
+{At_Pole=true;Longitude=0.0;if(Z>0.0)
+{Latitude=Proj4js.common.HALF_PI;}
+else if(Z<0.0)
+{Latitude=-Proj4js.common.HALF_PI;}
+else
+{Latitude=Proj4js.common.HALF_PI;Height=-this.b;return;}}}
+W2=X*X+Y*Y;W=Math.sqrt(W2);T0=Z*Proj4js.common.AD_C;S0=Math.sqrt(T0*T0+W2);Sin_B0=T0/S0;Cos_B0=W/S0;Sin3_B0=Sin_B0*Sin_B0*Sin_B0;T1=Z+this.b*this.ep2*Sin3_B0;Sum=W-this.a*this.es*Cos_B0*Cos_B0*Cos_B0;S1=Math.sqrt(T1*T1+Sum*Sum);Sin_p1=T1/S1;Cos_p1=Sum/S1;Rn=this.a/Math.sqrt(1.0-this.es*Sin_p1*Sin_p1);if(Cos_p1>=Proj4js.common.COS_67P5)
+{Height=W/Cos_p1-Rn;}
+else if(Cos_p1<=-Proj4js.common.COS_67P5)
+{Height=W/-Cos_p1-Rn;}
+else
+{Height=Z/Sin_p1+Rn*(this.es-1.0);}
+if(At_Pole==false)
+{Latitude=Math.atan(Sin_p1/Cos_p1);}
+p.x=Longitude;p.y=Latitude;p.z=Height;return p;},geocentric_to_wgs84:function(p){if(this.datum_type==Proj4js.common.PJD_3PARAM)
+{p.x+=this.datum_params[0];p.y+=this.datum_params[1];p.z+=this.datum_params[2];}
+else if(this.datum_type==Proj4js.common.PJD_7PARAM)
+{var Dx_BF=this.datum_params[0];var Dy_BF=this.datum_params[1];var Dz_BF=this.datum_params[2];var Rx_BF=this.datum_params[3];var Ry_BF=this.datum_params[4];var Rz_BF=this.datum_params[5];var M_BF=this.datum_params[6];var x_out=M_BF*(p.x-Rz_BF*p.y+Ry_BF*p.z)+Dx_BF;var y_out=M_BF*(Rz_BF*p.x+p.y-Rx_BF*p.z)+Dy_BF;var z_out=M_BF*(-Ry_BF*p.x+Rx_BF*p.y+p.z)+Dz_BF;p.x=x_out;p.y=y_out;p.z=z_out;}},geocentric_from_wgs84:function(p){if(this.datum_type==Proj4js.common.PJD_3PARAM)
+{p.x-=this.datum_params[0];p.y-=this.datum_params[1];p.z-=this.datum_params[2];}
+else if(this.datum_type==Proj4js.common.PJD_7PARAM)
+{var Dx_BF=this.datum_params[0];var Dy_BF=this.datum_params[1];var Dz_BF=this.datum_params[2];var Rx_BF=this.datum_params[3];var Ry_BF=this.datum_params[4];var Rz_BF=this.datum_params[5];var M_BF=this.datum_params[6];var x_tmp=(p.x-Dx_BF)/M_BF;var y_tmp=(p.y-Dy_BF)/M_BF;var z_tmp=(p.z-Dz_BF)/M_BF;p.x=x_tmp+Rz_BF*y_tmp-Ry_BF*z_tmp;p.y=-Rz_BF*x_tmp+y_tmp+Rx_BF*z_tmp;p.z=Ry_BF*x_tmp-Rx_BF*y_tmp+z_tmp;}}});Proj4js.Point=Proj4js.Class({initialize:function(x,y,z){if(typeof x=='object'){this.x=x[0];this.y=x[1];this.z=x[2]||0.0;}else if(typeof x=='string'&&typeof y=='undefined'){var coords=x.split(',');this.x=parseFloat(coords[0]);this.y=parseFloat(coords[1]);this.z=parseFloat(coords[2])||0.0;}else{this.x=x;this.y=y;this.z=z||0.0;}},clone:function(){return new Proj4js.Point(this.x,this.y,this.z);},toString:function(){return("x="+this.x+",y="+this.y);},toShortString:function(){return(this.x+", "+this.y);}});Proj4js.PrimeMeridian={"greenwich":0.0,"lisbon":-9.131906111111,"paris":2.337229166667,"bogota":-74.080916666667,"madrid":-3.687938888889,"rome":12.452333333333,"bern":7.439583333333,"jakarta":106.807719444444,"ferro":-17.666666666667,"brussels":4.367975,"stockholm":18.058277777778,"athens":23.7163375,"oslo":10.722916666667};Proj4js.Ellipsoid={"MERIT":{a:6378137.0,rf:298.257,ellipseName:"MERIT 1983"},"SGS85":{a:6378136.0,rf:298.257,ellipseName:"Soviet Geodetic System 85"},"GRS80":{a:6378137.0,rf:298.257222101,ellipseName:"GRS 1980(IUGG, 1980)"},"IAU76":{a:6378140.0,rf:298.257,ellipseName:"IAU 1976"},"airy":{a:6377563.396,b:6356256.910,ellipseName:"Airy 1830"},"APL4.":{a:6378137,rf:298.25,ellipseName:"Appl. Physics. 1965"},"NWL9D":{a:6378145.0,rf:298.25,ellipseName:"Naval Weapons Lab., 1965"},"mod_airy":{a:6377340.189,b:6356034.446,ellipseName:"Modified Airy"},"andrae":{a:6377104.43,rf:300.0,ellipseName:"Andrae 1876 (Den., Iclnd.)"},"aust_SA":{a:6378160.0,rf:298.25,ellipseName:"Australian Natl & S. Amer. 1969"},"GRS67":{a:6378160.0,rf:298.2471674270,ellipseName:"GRS 67(IUGG 1967)"},"bessel":{a:6377397.155,rf:299.1528128,ellipseName:"Bessel 1841"},"bess_nam":{a:6377483.865,rf:299.1528128,ellipseName:"Bessel 1841 (Namibia)"},"clrk66":{a:6378206.4,b:6356583.8,ellipseName:"Clarke 1866"},"clrk80":{a:6378249.145,rf:293.4663,ellipseName:"Clarke 1880 mod."},"CPM":{a:6375738.7,rf:334.29,ellipseName:"Comm. des Poids et Mesures 1799"},"delmbr":{a:6376428.0,rf:311.5,ellipseName:"Delambre 1810 (Belgium)"},"engelis":{a:6378136.05,rf:298.2566,ellipseName:"Engelis 1985"},"evrst30":{a:6377276.345,rf:300.8017,ellipseName:"Everest 1830"},"evrst48":{a:6377304.063,rf:300.8017,ellipseName:"Everest 1948"},"evrst56":{a:6377301.243,rf:300.8017,ellipseName:"Everest 1956"},"evrst69":{a:6377295.664,rf:300.8017,ellipseName:"Everest 1969"},"evrstSS":{a:6377298.556,rf:300.8017,ellipseName:"Everest (Sabah & Sarawak)"},"fschr60":{a:6378166.0,rf:298.3,ellipseName:"Fischer (Mercury Datum) 1960"},"fschr60m":{a:6378155.0,rf:298.3,ellipseName:"Fischer 1960"},"fschr68":{a:6378150.0,rf:298.3,ellipseName:"Fischer 1968"},"helmert":{a:6378200.0,rf:298.3,ellipseName:"Helmert 1906"},"hough":{a:6378270.0,rf:297.0,ellipseName:"Hough"},"intl":{a:6378388.0,rf:297.0,ellipseName:"International 1909 (Hayford)"},"kaula":{a:6378163.0,rf:298.24,ellipseName:"Kaula 1961"},"lerch":{a:6378139.0,rf:298.257,ellipseName:"Lerch 1979"},"mprts":{a:6397300.0,rf:191.0,ellipseName:"Maupertius 1738"},"new_intl":{a:6378157.5,b:6356772.2,ellipseName:"New International 1967"},"plessis":{a:6376523.0,rf:6355863.0,ellipseName:"Plessis 1817 (France)"},"krass":{a:6378245.0,rf:298.3,ellipseName:"Krassovsky, 1942"},"SEasia":{a:6378155.0,b:6356773.3205,ellipseName:"Southeast Asia"},"walbeck":{a:6376896.0,b:6355834.8467,ellipseName:"Walbeck"},"WGS60":{a:6378165.0,rf:298.3,ellipseName:"WGS 60"},"WGS66":{a:6378145.0,rf:298.25,ellipseName:"WGS 66"},"WGS72":{a:6378135.0,rf:298.26,ellipseName:"WGS 72"},"WGS84":{a:6378137.0,rf:298.257223563,ellipseName:"WGS 84"},"sphere":{a:6370997.0,b:6370997.0,ellipseName:"Normal Sphere (r=6370997)"}};Proj4js.Datum={"WGS84":{towgs84:"0,0,0",ellipse:"WGS84",datumName:"WGS84"},"GGRS87":{towgs84:"-199.87,74.79,246.62",ellipse:"GRS80",datumName:"Greek_Geodetic_Reference_System_1987"},"NAD83":{towgs84:"0,0,0",ellipse:"GRS80",datumName:"North_American_Datum_1983"},"NAD27":{nadgrids:"@conus,@alaska,@ntv2_0.gsb,@ntv1_can.dat",ellipse:"clrk66",datumName:"North_American_Datum_1927"},"potsdam":{towgs84:"606.0,23.0,413.0",ellipse:"bessel",datumName:"Potsdam Rauenberg 1950 DHDN"},"carthage":{towgs84:"-263.0,6.0,431.0",ellipse:"clark80",datumName:"Carthage 1934 Tunisia"},"hermannskogel":{towgs84:"653.0,-212.0,449.0",ellipse:"bessel",datumName:"Hermannskogel"},"ire65":{towgs84:"482.530,-130.596,564.557,-1.042,-0.214,-0.631,8.15",ellipse:"mod_airy",datumName:"Ireland 1965"},"nzgd49":{towgs84:"59.47,-5.04,187.44,0.47,-0.1,1.024,-4.5993",ellipse:"intl",datumName:"New Zealand Geodetic Datum 1949"},"OSGB36":{towgs84:"446.448,-125.157,542.060,0.1502,0.2470,0.8421,-20.4894",ellipse:"airy",datumName:"Airy 1830"}};Proj4js.WGS84=new Proj4js.Proj('WGS84');Proj4js.Datum['OSB36']=Proj4js.Datum['OSGB36'];Proj4js.wktProjections={"Lambert Tangential Conformal Conic Projection":"lcc","Mercator":"merc","Popular Visualisation Pseudo Mercator":"merc","Transverse_Mercator":"tmerc","Transverse Mercator":"tmerc","Lambert Azimuthal Equal Area":"laea","Universal Transverse Mercator System":"utm"};Proj4js.Proj.aea={init:function(){if(Math.abs(this.lat1+this.lat2)<Proj4js.common.EPSLN){Proj4js.reportError("aeaInitEqualLatitudes");return;}
+this.temp=this.b/this.a;this.es=1.0-Math.pow(this.temp,2);this.e3=Math.sqrt(this.es);this.sin_po=Math.sin(this.lat1);this.cos_po=Math.cos(this.lat1);this.t1=this.sin_po;this.con=this.sin_po;this.ms1=Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);this.qs1=Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);this.sin_po=Math.sin(this.lat2);this.cos_po=Math.cos(this.lat2);this.t2=this.sin_po;this.ms2=Proj4js.common.msfnz(this.e3,this.sin_po,this.cos_po);this.qs2=Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);this.sin_po=Math.sin(this.lat0);this.cos_po=Math.cos(this.lat0);this.t3=this.sin_po;this.qs0=Proj4js.common.qsfnz(this.e3,this.sin_po,this.cos_po);if(Math.abs(this.lat1-this.lat2)>Proj4js.common.EPSLN){this.ns0=(this.ms1*this.ms1-this.ms2*this.ms2)/(this.qs2-this.qs1);}else{this.ns0=this.con;}
+this.c=this.ms1*this.ms1+this.ns0*this.qs1;this.rh=this.a*Math.sqrt(this.c-this.ns0*this.qs0)/this.ns0;},forward:function(p){var lon=p.x;var lat=p.y;this.sin_phi=Math.sin(lat);this.cos_phi=Math.cos(lat);var qs=Proj4js.common.qsfnz(this.e3,this.sin_phi,this.cos_phi);var rh1=this.a*Math.sqrt(this.c-this.ns0*qs)/this.ns0;var theta=this.ns0*Proj4js.common.adjust_lon(lon-this.long0);var x=rh1*Math.sin(theta)+this.x0;var y=this.rh-rh1*Math.cos(theta)+this.y0;p.x=x;p.y=y;return p;},inverse:function(p){var rh1,qs,con,theta,lon,lat;p.x-=this.x0;p.y=this.rh-p.y+this.y0;if(this.ns0>=0){rh1=Math.sqrt(p.x*p.x+p.y*p.y);con=1.0;}else{rh1=-Math.sqrt(p.x*p.x+p.y*p.y);con=-1.0;}
+theta=0.0;if(rh1!=0.0){theta=Math.atan2(con*p.x,con*p.y);}
+con=rh1*this.ns0/this.a;qs=(this.c-con*con)/this.ns0;if(this.e3>=1e-10){con=1-.5*(1.0-this.es)*Math.log((1.0-this.e3)/(1.0+this.e3))/this.e3;if(Math.abs(Math.abs(con)-Math.abs(qs))>.0000000001){lat=this.phi1z(this.e3,qs);}else{if(qs>=0){lat=.5*PI;}else{lat=-.5*PI;}}}else{lat=this.phi1z(e3,qs);}
+lon=Proj4js.common.adjust_lon(theta/this.ns0+this.long0);p.x=lon;p.y=lat;return p;},phi1z:function(eccent,qs){var con,com,dphi;var phi=Proj4js.common.asinz(.5*qs);if(eccent<Proj4js.common.EPSLN)return phi;var eccnts=eccent*eccent;for(var i=1;i<=25;i++){sinphi=Math.sin(phi);cosphi=Math.cos(phi);con=eccent*sinphi;com=1.0-con*con;dphi=.5*com*com/cosphi*(qs/(1.0-eccnts)-sinphi/com+.5/eccent*Math.log((1.0-con)/(1.0+con)));phi=phi+dphi;if(Math.abs(dphi)<=1e-7)return phi;}
+Proj4js.reportError("aea:phi1z:Convergence error");return null;}};Proj4js.Proj.sterea={dependsOn:'gauss',init:function(){Proj4js.Proj['gauss'].init.apply(this);if(!this.rc){Proj4js.reportError("sterea:init:E_ERROR_0");return;}
+this.sinc0=Math.sin(this.phic0);this.cosc0=Math.cos(this.phic0);this.R2=2.0*this.rc;if(!this.title)this.title="Oblique Stereographic Alternative";},forward:function(p){p.x=Proj4js.common.adjust_lon(p.x-this.long0);Proj4js.Proj['gauss'].forward.apply(this,[p]);sinc=Math.sin(p.y);cosc=Math.cos(p.y);cosl=Math.cos(p.x);k=this.k0*this.R2/(1.0+this.sinc0*sinc+this.cosc0*cosc*cosl);p.x=k*cosc*Math.sin(p.x);p.y=k*(this.cosc0*sinc-this.sinc0*cosc*cosl);p.x=this.a*p.x+this.x0;p.y=this.a*p.y+this.y0;return p;},inverse:function(p){var lon,lat;p.x=(p.x-this.x0)/this.a;p.y=(p.y-this.y0)/this.a;p.x/=this.k0;p.y/=this.k0;if((rho=Math.sqrt(p.x*p.x+p.y*p.y))){c=2.0*Math.atan2(rho,this.R2);sinc=Math.sin(c);cosc=Math.cos(c);lat=Math.asin(cosc*this.sinc0+p.y*sinc*this.cosc0/rho);lon=Math.atan2(p.x*sinc,rho*this.cosc0*cosc-p.y*this.sinc0*sinc);}else{lat=this.phic0;lon=0.;}
+p.x=lon;p.y=lat;Proj4js.Proj['gauss'].inverse.apply(this,[p]);p.x=Proj4js.common.adjust_lon(p.x+this.long0);return p;}};function phi4z(eccent,e0,e1,e2,e3,a,b,c,phi){var sinphi,sin2ph,tanph,ml,mlp,con1,con2,con3,dphi,i;phi=a;for(i=1;i<=15;i++){sinphi=Math.sin(phi);tanphi=Math.tan(phi);c=tanphi*Math.sqrt(1.0-eccent*sinphi*sinphi);sin2ph=Math.sin(2.0*phi);ml=e0*phi-e1*sin2ph+e2*Math.sin(4.0*phi)-e3*Math.sin(6.0*phi);mlp=e0-2.0*e1*Math.cos(2.0*phi)+4.0*e2*Math.cos(4.0*phi)-6.0*e3*Math.cos(6.0*phi);con1=2.0*ml+c*(ml*ml+b)-2.0*a*(c*ml+1.0);con2=eccent*sin2ph*(ml*ml+b-2.0*a*ml)/(2.0*c);con3=2.0*(a-ml)*(c*mlp-2.0/sin2ph)-2.0*mlp;dphi=con1/(con2+con3);phi+=dphi;if(Math.abs(dphi)<=.0000000001)return(phi);}
+Proj4js.reportError("phi4z: No convergence");return null;}
+function e4fn(x){var con,com;con=1.0+x;com=1.0-x;return(Math.sqrt((Math.pow(con,con))*(Math.pow(com,com))));}
+Proj4js.Proj.poly={init:function(){var temp;if(this.lat0=0)this.lat0=90;this.temp=this.b/this.a;this.es=1.0-Math.pow(this.temp,2);this.e=Math.sqrt(this.es);this.e0=Proj4js.common.e0fn(this.es);this.e1=Proj4js.common.e1fn(this.es);this.e2=Proj4js.common.e2fn(this.es);this.e3=Proj4js.common.e3fn(this.es);this.ml0=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,this.lat0);},forward:function(p){var sinphi,cosphi;var al;var c;var con,ml;var ms;var x,y;var lon=p.x;var lat=p.y;con=Proj4js.common.adjust_lon(lon-this.long0);if(Math.abs(lat)<=.0000001){x=this.x0+this.a*con;y=this.y0-this.a*this.ml0;}else{sinphi=Math.sin(lat);cosphi=Math.cos(lat);ml=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,lat);ms=Proj4js.common.msfnz(this.e,sinphi,cosphi);con=sinphi;x=this.x0+this.a*ms*Math.sin(con)/sinphi;y=this.y0+this.a*(ml-this.ml0+ms*(1.0-Math.cos(con))/sinphi);}
+p.x=x;p.y=y;return p;},inverse:function(p){var sin_phi,cos_phi;var al;var b;var c;var con,ml;var iflg;var lon,lat;p.x-=this.x0;p.y-=this.y0;al=this.ml0+p.y/this.a;iflg=0;if(Math.abs(al)<=.0000001){lon=p.x/this.a+this.long0;lat=0.0;}else{b=al*al+(p.x/this.a)*(p.x/this.a);iflg=phi4z(this.es,this.e0,this.e1,this.e2,this.e3,this.al,b,c,lat);if(iflg!=1)return(iflg);lon=Proj4js.common.adjust_lon((Proj4js.common.asinz(p.x*c/this.a)/Math.sin(lat))+this.long0);}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.equi={init:function(){if(!this.x0)this.x0=0;if(!this.y0)this.y0=0;if(!this.lat0)this.lat0=0;if(!this.long0)this.long0=0;},forward:function(p){var lon=p.x;var lat=p.y;var dlon=Proj4js.common.adjust_lon(lon-this.long0);var x=this.x0+this.a*dlon*Math.cos(this.lat0);var y=this.y0+this.a*lat;this.t1=x;this.t2=Math.cos(this.lat0);p.x=x;p.y=y;return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var lat=p.y/this.a;if(Math.abs(lat)>Proj4js.common.HALF_PI){Proj4js.reportError("equi:Inv:DataError");}
+var lon=Proj4js.common.adjust_lon(this.long0+p.x/(this.a*Math.cos(this.lat0)));p.x=lon;p.y=lat;}};Proj4js.Proj.merc={init:function(){if(this.lat_ts){if(this.sphere){this.k0=Math.cos(this.lat_ts);}else{this.k0=Proj4js.common.msfnz(this.es,Math.sin(this.lat_ts),Math.cos(this.lat_ts));}}},forward:function(p){var lon=p.x;var lat=p.y;if(lat*Proj4js.common.R2D>90.0&&lat*Proj4js.common.R2D<-90.0&&lon*Proj4js.common.R2D>180.0&&lon*Proj4js.common.R2D<-180.0){Proj4js.reportError("merc:forward: llInputOutOfRange: "+lon+" : "+lat);return null;}
+var x,y;if(Math.abs(Math.abs(lat)-Proj4js.common.HALF_PI)<=Proj4js.common.EPSLN){Proj4js.reportError("merc:forward: ll2mAtPoles");return null;}else{if(this.sphere){x=this.x0+this.a*this.k0*Proj4js.common.adjust_lon(lon-this.long0);y=this.y0+this.a*this.k0*Math.log(Math.tan(Proj4js.common.FORTPI+0.5*lat));}else{var sinphi=Math.sin(lat);var ts=Proj4js.common.tsfnz(this.e,lat,sinphi);x=this.x0+this.a*this.k0*Proj4js.common.adjust_lon(lon-this.long0);y=this.y0-this.a*this.k0*Math.log(ts);}
+p.x=x;p.y=y;return p;}},inverse:function(p){var x=p.x-this.x0;var y=p.y-this.y0;var lon,lat;if(this.sphere){lat=Proj4js.common.HALF_PI-2.0*Math.atan(Math.exp(-y/this.a*this.k0));}else{var ts=Math.exp(-y/(this.a*this.k0));lat=Proj4js.common.phi2z(this.e,ts);if(lat==-9999){Proj4js.reportError("merc:inverse: lat = -9999");return null;}}
+lon=Proj4js.common.adjust_lon(this.long0+x/(this.a*this.k0));p.x=lon;p.y=lat;return p;}};Proj4js.Proj.utm={dependsOn:'tmerc',init:function(){if(!this.zone){Proj4js.reportError("utm:init: zone must be specified for UTM");return;}
+this.lat0=0.0;this.long0=((6*Math.abs(this.zone))-183)*Proj4js.common.D2R;this.x0=500000.0;this.y0=this.utmSouth?10000000.0:0.0;this.k0=0.9996;Proj4js.Proj['tmerc'].init.apply(this);this.forward=Proj4js.Proj['tmerc'].forward;this.inverse=Proj4js.Proj['tmerc'].inverse;}};Proj4js.Proj.eqdc={init:function(){if(!this.mode)this.mode=0;this.temp=this.b/this.a;this.es=1.0-Math.pow(this.temp,2);this.e=Math.sqrt(this.es);this.e0=Proj4js.common.e0fn(this.es);this.e1=Proj4js.common.e1fn(this.es);this.e2=Proj4js.common.e2fn(this.es);this.e3=Proj4js.common.e3fn(this.es);this.sinphi=Math.sin(this.lat1);this.cosphi=Math.cos(this.lat1);this.ms1=Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);this.ml1=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,this.lat1);if(this.mode!=0){if(Math.abs(this.lat1+this.lat2)<Proj4js.common.EPSLN){Proj4js.reportError("eqdc:Init:EqualLatitudes");}
+this.sinphi=Math.sin(this.lat2);this.cosphi=Math.cos(this.lat2);this.ms2=Proj4js.common.msfnz(this.e,this.sinphi,this.cosphi);this.ml2=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,this.lat2);if(Math.abs(this.lat1-this.lat2)>=Proj4js.common.EPSLN){this.ns=(this.ms1-this.ms2)/(this.ml2-this.ml1);}else{this.ns=this.sinphi;}}else{this.ns=this.sinphi;}
+this.g=this.ml1+this.ms1/this.ns;this.ml0=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,this.lat0);this.rh=this.a*(this.g-this.ml0);},forward:function(p){var lon=p.x;var lat=p.y;var ml=Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,lat);var rh1=this.a*(this.g-ml);var theta=this.ns*Proj4js.common.adjust_lon(lon-this.long0);var x=this.x0+rh1*Math.sin(theta);var y=this.y0+this.rh-rh1*Math.cos(theta);p.x=x;p.y=y;return p;},inverse:function(p){p.x-=this.x0;p.y=this.rh-p.y+this.y0;var con,rh1;if(this.ns>=0){var rh1=Math.sqrt(p.x*p.x+p.y*p.y);var con=1.0;}else{rh1=-Math.sqrt(p.x*p.x+p.y*p.y);con=-1.0;}
+var theta=0.0;if(rh1!=0.0)theta=Math.atan2(con*p.x,con*p.y);var ml=this.g-rh1/this.a;var lat=this.phi3z(ml,this.e0,this.e1,this.e2,this.e3);var lon=Proj4js.common.adjust_lon(this.long0+theta/this.ns);p.x=lon;p.y=lat;return p;},phi3z:function(ml,e0,e1,e2,e3){var phi;var dphi;phi=ml;for(var i=0;i<15;i++){dphi=(ml+e1*Math.sin(2.0*phi)-e2*Math.sin(4.0*phi)+e3*Math.sin(6.0*phi))/e0-phi;phi+=dphi;if(Math.abs(dphi)<=.0000000001){return phi;}}
+Proj4js.reportError("PHI3Z-CONV:Latitude failed to converge after 15 iterations");return null;}};Proj4js.Proj.tmerc={init:function(){this.e0=Proj4js.common.e0fn(this.es);this.e1=Proj4js.common.e1fn(this.es);this.e2=Proj4js.common.e2fn(this.es);this.e3=Proj4js.common.e3fn(this.es);this.ml0=this.a*Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,this.lat0);},forward:function(p){var lon=p.x;var lat=p.y;var delta_lon=Proj4js.common.adjust_lon(lon-this.long0);var con;var x,y;var sin_phi=Math.sin(lat);var cos_phi=Math.cos(lat);if(this.sphere){var b=cos_phi*Math.sin(delta_lon);if((Math.abs(Math.abs(b)-1.0))<.0000000001){Proj4js.reportError("tmerc:forward: Point projects into infinity");return(93);}else{x=.5*this.a*this.k0*Math.log((1.0+b)/(1.0-b));con=Math.acos(cos_phi*Math.cos(delta_lon)/Math.sqrt(1.0-b*b));if(lat<0)con=-con;y=this.a*this.k0*(con-this.lat0);}}else{var al=cos_phi*delta_lon;var als=Math.pow(al,2);var c=this.ep2*Math.pow(cos_phi,2);var tq=Math.tan(lat);var t=Math.pow(tq,2);con=1.0-this.es*Math.pow(sin_phi,2);var n=this.a/Math.sqrt(con);var ml=this.a*Proj4js.common.mlfn(this.e0,this.e1,this.e2,this.e3,lat);x=this.k0*n*al*(1.0+als/6.0*(1.0-t+c+als/20.0*(5.0-18.0*t+Math.pow(t,2)+72.0*c-58.0*this.ep2)))+this.x0;y=this.k0*(ml-this.ml0+n*tq*(als*(0.5+als/24.0*(5.0-t+9.0*c+4.0*Math.pow(c,2)+als/30.0*(61.0-58.0*t+Math.pow(t,2)+600.0*c-330.0*this.ep2)))))+this.y0;}
+p.x=x;p.y=y;return p;},inverse:function(p){var con,phi;var delta_phi;var i;var max_iter=6;var lat,lon;if(this.sphere){var f=Math.exp(p.x/(this.a*this.k0));var g=.5*(f-1/f);var temp=this.lat0+p.y/(this.a*this.k0);var h=Math.cos(temp);con=Math.sqrt((1.0-h*h)/(1.0+g*g));lat=Proj4js.common.asinz(con);if(temp<0)
+lat=-lat;if((g==0)&&(h==0)){lon=this.long0;}else{lon=Proj4js.common.adjust_lon(Math.atan2(g,h)+this.long0);}}else{var x=p.x-this.x0;var y=p.y-this.y0;con=(this.ml0+y/this.k0)/this.a;phi=con;for(i=0;true;i++){delta_phi=((con+this.e1*Math.sin(2.0*phi)-this.e2*Math.sin(4.0*phi)+this.e3*Math.sin(6.0*phi))/this.e0)-phi;phi+=delta_phi;if(Math.abs(delta_phi)<=Proj4js.common.EPSLN)break;if(i>=max_iter){Proj4js.reportError("tmerc:inverse: Latitude failed to converge");return(95);}}
+if(Math.abs(phi)<Proj4js.common.HALF_PI){var sin_phi=Math.sin(phi);var cos_phi=Math.cos(phi);var tan_phi=Math.tan(phi);var c=this.ep2*Math.pow(cos_phi,2);var cs=Math.pow(c,2);var t=Math.pow(tan_phi,2);var ts=Math.pow(t,2);con=1.0-this.es*Math.pow(sin_phi,2);var n=this.a/Math.sqrt(con);var r=n*(1.0-this.es)/con;var d=x/(n*this.k0);var ds=Math.pow(d,2);lat=phi-(n*tan_phi*ds/r)*(0.5-ds/24.0*(5.0+3.0*t+10.0*c-4.0*cs-9.0*this.ep2-ds/30.0*(61.0+90.0*t+298.0*c+45.0*ts-252.0*this.ep2-3.0*cs)));lon=Proj4js.common.adjust_lon(this.long0+(d*(1.0-ds/6.0*(1.0+2.0*t+c-ds/20.0*(5.0-2.0*c+28.0*t-3.0*cs+8.0*this.ep2+24.0*ts)))/cos_phi));}else{lat=Proj4js.common.HALF_PI*Proj4js.common.sign(y);lon=this.long0;}}
+p.x=lon;p.y=lat;return p;}};Proj4js.defs["GOOGLE"]="+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";Proj4js.defs["EPSG:900913"]=Proj4js.defs["GOOGLE"];Proj4js.Proj.gstmerc={init:function(){var temp=this.b/this.a;this.e=Math.sqrt(1.0-temp*temp);this.lc=this.long0;this.rs=Math.sqrt(1.0+this.e*this.e*Math.pow(Math.cos(this.lat0),4.0)/(1.0-this.e*this.e));var sinz=Math.sin(this.lat0);var pc=Math.asin(sinz/this.rs);var sinzpc=Math.sin(pc);this.cp=Proj4js.common.latiso(0.0,pc,sinzpc)-this.rs*Proj4js.common.latiso(this.e,this.lat0,sinz);this.n2=this.k0*this.a*Math.sqrt(1.0-this.e*this.e)/(1.0-this.e*this.e*sinz*sinz);this.xs=this.x0;this.ys=this.y0-this.n2*pc;if(!this.title)this.title="Gauss Schreiber transverse mercator";},forward:function(p){var lon=p.x;var lat=p.y;var L=this.rs*(lon-this.lc);var Ls=this.cp+(this.rs*Proj4js.common.latiso(this.e,lat,Math.sin(lat)));var lat1=Math.asin(Math.sin(L)/Proj4js.common.cosh(Ls));var Ls1=Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));p.x=this.xs+(this.n2*Ls1);p.y=this.ys+(this.n2*Math.atan(Proj4js.common.sinh(Ls)/Math.cos(L)));return p;},inverse:function(p){var x=p.x;var y=p.y;var L=Math.atan(Proj4js.common.sinh((x-this.xs)/this.n2)/Math.cos((y-this.ys)/this.n2));var lat1=Math.asin(Math.sin((y-this.ys)/this.n2)/Proj4js.common.cosh((x-this.xs)/this.n2));var LC=Proj4js.common.latiso(0.0,lat1,Math.sin(lat1));p.x=this.lc+L/this.rs;p.y=Proj4js.common.invlatiso(this.e,(LC-this.cp)/this.rs);return p;}};Proj4js.Proj.ortho={init:function(def){;this.sin_p14=Math.sin(this.lat0);this.cos_p14=Math.cos(this.lat0);},forward:function(p){var sinphi,cosphi;var dlon;var coslon;var ksp;var g;var lon=p.x;var lat=p.y;dlon=Proj4js.common.adjust_lon(lon-this.long0);sinphi=Math.sin(lat);cosphi=Math.cos(lat);coslon=Math.cos(dlon);g=this.sin_p14*sinphi+this.cos_p14*cosphi*coslon;ksp=1.0;if((g>0)||(Math.abs(g)<=Proj4js.common.EPSLN)){var x=this.a*ksp*cosphi*Math.sin(dlon);var y=this.y0+this.a*ksp*(this.cos_p14*sinphi-this.sin_p14*cosphi*coslon);}else{Proj4js.reportError("orthoFwdPointError");}
+p.x=x;p.y=y;return p;},inverse:function(p){var rh;var z;var sinz,cosz;var temp;var con;var lon,lat;p.x-=this.x0;p.y-=this.y0;rh=Math.sqrt(p.x*p.x+p.y*p.y);if(rh>this.a+.0000001){Proj4js.reportError("orthoInvDataError");}
+z=Proj4js.common.asinz(rh/this.a);sinz=Math.sin(z);cosz=Math.cos(z);lon=this.long0;if(Math.abs(rh)<=Proj4js.common.EPSLN){lat=this.lat0;}
+lat=Proj4js.common.asinz(cosz*this.sin_p14+(p.y*sinz*this.cos_p14)/rh);con=Math.abs(this.lat0)-Proj4js.common.HALF_PI;if(Math.abs(con)<=Proj4js.common.EPSLN){if(this.lat0>=0){lon=Proj4js.common.adjust_lon(this.long0+Math.atan2(p.x,-p.y));}else{lon=Proj4js.common.adjust_lon(this.long0-Math.atan2(-p.x,p.y));}}
+con=cosz-this.sin_p14*Math.sin(lat);p.x=lon;p.y=lat;return p;}};Proj4js.Proj.somerc={init:function(){var phy0=this.lat0;this.lambda0=this.long0;var sinPhy0=Math.sin(phy0);var semiMajorAxis=this.a;var invF=this.rf;var flattening=1/invF;var e2=2*flattening-Math.pow(flattening,2);var e=this.e=Math.sqrt(e2);this.R=this.k0*semiMajorAxis*Math.sqrt(1-e2)/(1-e2*Math.pow(sinPhy0,2.0));this.alpha=Math.sqrt(1+e2/(1-e2)*Math.pow(Math.cos(phy0),4.0));this.b0=Math.asin(sinPhy0/this.alpha);this.K=Math.log(Math.tan(Math.PI/4.0+this.b0/2.0))
+-this.alpha*Math.log(Math.tan(Math.PI/4.0+phy0/2.0))
++this.alpha*e/2*Math.log((1+e*sinPhy0)/(1-e*sinPhy0));},forward:function(p){var Sa1=Math.log(Math.tan(Math.PI/4.0-p.y/2.0));var Sa2=this.e/2.0*Math.log((1+this.e*Math.sin(p.y))/(1-this.e*Math.sin(p.y)));var S=-this.alpha*(Sa1+Sa2)+this.K;var b=2.0*(Math.atan(Math.exp(S))-Math.PI/4.0);var I=this.alpha*(p.x-this.lambda0);var rotI=Math.atan(Math.sin(I)/(Math.sin(this.b0)*Math.tan(b)+
+Math.cos(this.b0)*Math.cos(I)));var rotB=Math.asin(Math.cos(this.b0)*Math.sin(b)-
+Math.sin(this.b0)*Math.cos(b)*Math.cos(I));p.y=this.R/2.0*Math.log((1+Math.sin(rotB))/(1-Math.sin(rotB)))
++this.y0;p.x=this.R*rotI+this.x0;return p;},inverse:function(p){var Y=p.x-this.x0;var X=p.y-this.y0;var rotI=Y/this.R;var rotB=2*(Math.atan(Math.exp(X/this.R))-Math.PI/4.0);var b=Math.asin(Math.cos(this.b0)*Math.sin(rotB)
++Math.sin(this.b0)*Math.cos(rotB)*Math.cos(rotI));var I=Math.atan(Math.sin(rotI)/(Math.cos(this.b0)*Math.cos(rotI)-Math.sin(this.b0)*Math.tan(rotB)));var lambda=this.lambda0+I/this.alpha;var S=0.0;var phy=b;var prevPhy=-1000.0;var iteration=0;while(Math.abs(phy-prevPhy)>0.0000001)
+{if(++iteration>20)
+{Proj4js.reportError("omercFwdInfinity");return;}
+S=1.0/this.alpha*(Math.log(Math.tan(Math.PI/4.0+b/2.0))-this.K)
++this.e*Math.log(Math.tan(Math.PI/4.0
++Math.asin(this.e*Math.sin(phy))/2.0));prevPhy=phy;phy=2.0*Math.atan(Math.exp(S))-Math.PI/2.0;}
+p.x=lambda;p.y=phy;return p;}};Proj4js.Proj.stere={ssfn_:function(phit,sinphi,eccen){sinphi*=eccen;return(Math.tan(.5*(Proj4js.common.HALF_PI+phit))*Math.pow((1.-sinphi)/(1.+sinphi),.5*eccen));},TOL:1.e-8,NITER:8,CONV:1.e-10,S_POLE:0,N_POLE:1,OBLIQ:2,EQUIT:3,init:function(){this.phits=this.lat_ts?this.lat_ts:Proj4js.common.HALF_PI;var t=Math.abs(this.lat0);if((Math.abs(t)-Proj4js.common.HALF_PI)<Proj4js.common.EPSLN){this.mode=this.lat0<0.?this.S_POLE:this.N_POLE;}else{this.mode=t>Proj4js.common.EPSLN?this.OBLIQ:this.EQUIT;}
+this.phits=Math.abs(this.phits);if(this.es){var X;switch(this.mode){case this.N_POLE:case this.S_POLE:if(Math.abs(this.phits-Proj4js.common.HALF_PI)<Proj4js.common.EPSLN){this.akm1=2.*this.k0/Math.sqrt(Math.pow(1+this.e,1+this.e)*Math.pow(1-this.e,1-this.e));}else{t=Math.sin(this.phits);this.akm1=Math.cos(this.phits)/Proj4js.common.tsfnz(this.e,this.phits,t);t*=this.e;this.akm1/=Math.sqrt(1.-t*t);}
+break;case this.EQUIT:this.akm1=2.*this.k0;break;case this.OBLIQ:t=Math.sin(this.lat0);X=2.*Math.atan(this.ssfn_(this.lat0,t,this.e))-Proj4js.common.HALF_PI;t*=this.e;this.akm1=2.*this.k0*Math.cos(this.lat0)/Math.sqrt(1.-t*t);this.sinX1=Math.sin(X);this.cosX1=Math.cos(X);break;}}else{switch(this.mode){case this.OBLIQ:this.sinph0=Math.sin(this.lat0);this.cosph0=Math.cos(this.lat0);case this.EQUIT:this.akm1=2.*this.k0;break;case this.S_POLE:case this.N_POLE:this.akm1=Math.abs(this.phits-Proj4js.common.HALF_PI)>=Proj4js.common.EPSLN?Math.cos(this.phits)/Math.tan(Proj4js.common.FORTPI-.5*this.phits):2.*this.k0;break;}}},forward:function(p){var lon=p.x;lon=Proj4js.common.adjust_lon(lon-this.long0);var lat=p.y;var x,y;if(this.sphere){var sinphi,cosphi,coslam,sinlam;sinphi=Math.sin(lat);cosphi=Math.cos(lat);coslam=Math.cos(lon);sinlam=Math.sin(lon);switch(this.mode){case this.EQUIT:y=1.+cosphi*coslam;if(y<=Proj4js.common.EPSLN){F_ERROR;}
+y=this.akm1/y;x=y*cosphi*sinlam;y*=sinphi;break;case this.OBLIQ:y=1.+this.sinph0*sinphi+this.cosph0*cosphi*coslam;if(y<=Proj4js.common.EPSLN){F_ERROR;}
+y=this.akm1/y;x=y*cosphi*sinlam;y*=this.cosph0*sinphi-this.sinph0*cosphi*coslam;break;case this.N_POLE:coslam=-coslam;lat=-lat;case this.S_POLE:if(Math.abs(lat-Proj4js.common.HALF_PI)<this.TOL){F_ERROR;}
+y=this.akm1*Math.tan(Proj4js.common.FORTPI+.5*lat);x=sinlam*y;y*=coslam;break;}}else{coslam=Math.cos(lon);sinlam=Math.sin(lon);sinphi=Math.sin(lat);if(this.mode==this.OBLIQ||this.mode==this.EQUIT){X=2.*Math.atan(this.ssfn_(lat,sinphi,this.e));sinX=Math.sin(X-Proj4js.common.HALF_PI);cosX=Math.cos(X);}
+switch(this.mode){case this.OBLIQ:A=this.akm1/(this.cosX1*(1.+this.sinX1*sinX+this.cosX1*cosX*coslam));y=A*(this.cosX1*sinX-this.sinX1*cosX*coslam);x=A*cosX;break;case this.EQUIT:A=2.*this.akm1/(1.+cosX*coslam);y=A*sinX;x=A*cosX;break;case this.S_POLE:lat=-lat;coslam=-coslam;sinphi=-sinphi;case this.N_POLE:x=this.akm1*Proj4js.common.tsfnz(this.e,lat,sinphi);y=-x*coslam;break;}
+x=x*sinlam;}
+p.x=x*this.a+this.x0;p.y=y*this.a+this.y0;return p;},inverse:function(p){var x=(p.x-this.x0)/this.a;var y=(p.y-this.y0)/this.a;var lon,lat;var cosphi,sinphi,tp=0.0,phi_l=0.0,rho,halfe=0.0,pi2=0.0;var i;if(this.sphere){var c,rh,sinc,cosc;rh=Math.sqrt(x*x+y*y);c=2.*Math.atan(rh/this.akm1);sinc=Math.sin(c);cosc=Math.cos(c);lon=0.;switch(this.mode){case this.EQUIT:if(Math.abs(rh)<=Proj4js.common.EPSLN){lat=0.;}else{lat=Math.asin(y*sinc/rh);}
+if(cosc!=0.||x!=0.)lon=Math.atan2(x*sinc,cosc*rh);break;case this.OBLIQ:if(Math.abs(rh)<=Proj4js.common.EPSLN){lat=this.phi0;}else{lat=Math.asin(cosc*sinph0+y*sinc*cosph0/rh);}
+c=cosc-sinph0*Math.sin(lat);if(c!=0.||x!=0.){lon=Math.atan2(x*sinc*cosph0,c*rh);}
+break;case this.N_POLE:y=-y;case this.S_POLE:if(Math.abs(rh)<=Proj4js.common.EPSLN){lat=this.phi0;}else{lat=Math.asin(this.mode==this.S_POLE?-cosc:cosc);}
+lon=(x==0.&&y==0.)?0.:Math.atan2(x,y);break;}
+p.x=Proj4js.common.adjust_lon(lon+this.long0);p.y=lat;}else{rho=Math.sqrt(x*x+y*y);switch(this.mode){case this.OBLIQ:case this.EQUIT:tp=2.*Math.atan2(rho*this.cosX1,this.akm1);cosphi=Math.cos(tp);sinphi=Math.sin(tp);if(rho==0.0){phi_l=Math.asin(cosphi*this.sinX1);}else{phi_l=Math.asin(cosphi*this.sinX1+(y*sinphi*this.cosX1/rho));}
+tp=Math.tan(.5*(Proj4js.common.HALF_PI+phi_l));x*=sinphi;y=rho*this.cosX1*cosphi-y*this.sinX1*sinphi;pi2=Proj4js.common.HALF_PI;halfe=.5*this.e;break;case this.N_POLE:y=-y;case this.S_POLE:tp=-rho/this.akm1;phi_l=Proj4js.common.HALF_PI-2.*Math.atan(tp);pi2=-Proj4js.common.HALF_PI;halfe=-.5*this.e;break;}
+for(i=this.NITER;i--;phi_l=lat){sinphi=this.e*Math.sin(phi_l);lat=2.*Math.atan(tp*Math.pow((1.+sinphi)/(1.-sinphi),halfe))-pi2;if(Math.abs(phi_l-lat)<this.CONV){if(this.mode==this.S_POLE)lat=-lat;lon=(x==0.&&y==0.)?0.:Math.atan2(x,y);p.x=Proj4js.common.adjust_lon(lon+this.long0);p.y=lat;return p;}}}}};Proj4js.Proj.nzmg={iterations:1,init:function(){this.A=new Array();this.A[1]=+0.6399175073;this.A[2]=-0.1358797613;this.A[3]=+0.063294409;this.A[4]=-0.02526853;this.A[5]=+0.0117879;this.A[6]=-0.0055161;this.A[7]=+0.0026906;this.A[8]=-0.001333;this.A[9]=+0.00067;this.A[10]=-0.00034;this.B_re=new Array();this.B_im=new Array();this.B_re[1]=+0.7557853228;this.B_im[1]=0.0;this.B_re[2]=+0.249204646;this.B_im[2]=+0.003371507;this.B_re[3]=-0.001541739;this.B_im[3]=+0.041058560;this.B_re[4]=-0.10162907;this.B_im[4]=+0.01727609;this.B_re[5]=-0.26623489;this.B_im[5]=-0.36249218;this.B_re[6]=-0.6870983;this.B_im[6]=-1.1651967;this.C_re=new Array();this.C_im=new Array();this.C_re[1]=+1.3231270439;this.C_im[1]=0.0;this.C_re[2]=-0.577245789;this.C_im[2]=-0.007809598;this.C_re[3]=+0.508307513;this.C_im[3]=-0.112208952;this.C_re[4]=-0.15094762;this.C_im[4]=+0.18200602;this.C_re[5]=+1.01418179;this.C_im[5]=+1.64497696;this.C_re[6]=+1.9660549;this.C_im[6]=+2.5127645;this.D=new Array();this.D[1]=+1.5627014243;this.D[2]=+0.5185406398;this.D[3]=-0.03333098;this.D[4]=-0.1052906;this.D[5]=-0.0368594;this.D[6]=+0.007317;this.D[7]=+0.01220;this.D[8]=+0.00394;this.D[9]=-0.0013;},forward:function(p){var lon=p.x;var lat=p.y;var delta_lat=lat-this.lat0;var delta_lon=lon-this.long0;var d_phi=delta_lat/Proj4js.common.SEC_TO_RAD*1E-5;var d_lambda=delta_lon;var d_phi_n=1;var d_psi=0;for(n=1;n<=10;n++){d_phi_n=d_phi_n*d_phi;d_psi=d_psi+this.A[n]*d_phi_n;}
+var th_re=d_psi;var th_im=d_lambda;var th_n_re=1;var th_n_im=0;var th_n_re1;var th_n_im1;var z_re=0;var z_im=0;for(n=1;n<=6;n++){th_n_re1=th_n_re*th_re-th_n_im*th_im;th_n_im1=th_n_im*th_re+th_n_re*th_im;th_n_re=th_n_re1;th_n_im=th_n_im1;z_re=z_re+this.B_re[n]*th_n_re-this.B_im[n]*th_n_im;z_im=z_im+this.B_im[n]*th_n_re+this.B_re[n]*th_n_im;}
+x=(z_im*this.a)+this.x0;y=(z_re*this.a)+this.y0;p.x=x;p.y=y;return p;},inverse:function(p){var x=p.x;var y=p.y;var delta_x=x-this.x0;var delta_y=y-this.y0;var z_re=delta_y/this.a;var z_im=delta_x/this.a;var z_n_re=1;var z_n_im=0;var z_n_re1;var z_n_im1;var th_re=0;var th_im=0;for(n=1;n<=6;n++){z_n_re1=z_n_re*z_re-z_n_im*z_im;z_n_im1=z_n_im*z_re+z_n_re*z_im;z_n_re=z_n_re1;z_n_im=z_n_im1;th_re=th_re+this.C_re[n]*z_n_re-this.C_im[n]*z_n_im;th_im=th_im+this.C_im[n]*z_n_re+this.C_re[n]*z_n_im;}
+for(i=0;i<this.iterations;i++){var th_n_re=th_re;var th_n_im=th_im;var th_n_re1;var th_n_im1;var num_re=z_re;var num_im=z_im;for(n=2;n<=6;n++){th_n_re1=th_n_re*th_re-th_n_im*th_im;th_n_im1=th_n_im*th_re+th_n_re*th_im;th_n_re=th_n_re1;th_n_im=th_n_im1;num_re=num_re+(n-1)*(this.B_re[n]*th_n_re-this.B_im[n]*th_n_im);num_im=num_im+(n-1)*(this.B_im[n]*th_n_re+this.B_re[n]*th_n_im);}
+th_n_re=1;th_n_im=0;var den_re=this.B_re[1];var den_im=this.B_im[1];for(n=2;n<=6;n++){th_n_re1=th_n_re*th_re-th_n_im*th_im;th_n_im1=th_n_im*th_re+th_n_re*th_im;th_n_re=th_n_re1;th_n_im=th_n_im1;den_re=den_re+n*(this.B_re[n]*th_n_re-this.B_im[n]*th_n_im);den_im=den_im+n*(this.B_im[n]*th_n_re+this.B_re[n]*th_n_im);}
+var den2=den_re*den_re+den_im*den_im;th_re=(num_re*den_re+num_im*den_im)/den2;th_im=(num_im*den_re-num_re*den_im)/den2;}
+var d_psi=th_re;var d_lambda=th_im;var d_psi_n=1;var d_phi=0;for(n=1;n<=9;n++){d_psi_n=d_psi_n*d_psi;d_phi=d_phi+this.D[n]*d_psi_n;}
+var lat=this.lat0+(d_phi*Proj4js.common.SEC_TO_RAD*1E5);var lon=this.long0+d_lambda;p.x=lon;p.y=lat;return p;}};Proj4js.Proj.mill={init:function(){},forward:function(p){var lon=p.x;var lat=p.y;var dlon=Proj4js.common.adjust_lon(lon-this.long0);var x=this.x0+this.a*dlon;var y=this.y0+this.a*Math.log(Math.tan((Proj4js.common.PI/4.0)+(lat/2.5)))*1.25;p.x=x;p.y=y;return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var lon=Proj4js.common.adjust_lon(this.long0+p.x/this.a);var lat=2.5*(Math.atan(Math.exp(0.8*p.y/this.a))-Proj4js.common.PI/4.0);p.x=lon;p.y=lat;return p;}};Proj4js.Proj.gnom={init:function(def){this.sin_p14=Math.sin(this.lat0);this.cos_p14=Math.cos(this.lat0);this.infinity_dist=1000*this.a;this.rc=1;},forward:function(p){var sinphi,cosphi;var dlon;var coslon;var ksp;var g;var lon=p.x;var lat=p.y;dlon=Proj4js.common.adjust_lon(lon-this.long0);sinphi=Math.sin(lat);cosphi=Math.cos(lat);coslon=Math.cos(dlon);g=this.sin_p14*sinphi+this.cos_p14*cosphi*coslon;ksp=1.0;if((g>0)||(Math.abs(g)<=Proj4js.common.EPSLN)){x=this.x0+this.a*ksp*cosphi*Math.sin(dlon)/g;y=this.y0+this.a*ksp*(this.cos_p14*sinphi-this.sin_p14*cosphi*coslon)/g;}else{Proj4js.reportError("orthoFwdPointError");x=this.x0+this.infinity_dist*cosphi*Math.sin(dlon);y=this.y0+this.infinity_dist*(this.cos_p14*sinphi-this.sin_p14*cosphi*coslon);}
+p.x=x;p.y=y;return p;},inverse:function(p){var rh;var z;var sinc,cosc;var c;var lon,lat;p.x=(p.x-this.x0)/this.a;p.y=(p.y-this.y0)/this.a;p.x/=this.k0;p.y/=this.k0;if((rh=Math.sqrt(p.x*p.x+p.y*p.y))){c=Math.atan2(rh,this.rc);sinc=Math.sin(c);cosc=Math.cos(c);lat=Proj4js.common.asinz(cosc*this.sin_p14+(p.y*sinc*this.cos_p14)/rh);lon=Math.atan2(p.x*sinc,rh*this.cos_p14*cosc-p.y*this.sin_p14*sinc);lon=Proj4js.common.adjust_lon(this.long0+lon);}else{lat=this.phic0;lon=0.0;}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.sinu={init:function(){this.R=6370997.0;},forward:function(p){var x,y,delta_lon;var lon=p.x;var lat=p.y;delta_lon=Proj4js.common.adjust_lon(lon-this.long0);x=this.R*delta_lon*Math.cos(lat)+this.x0;y=this.R*lat+this.y0;p.x=x;p.y=y;return p;},inverse:function(p){var lat,temp,lon;p.x-=this.x0;p.y-=this.y0;lat=p.y/this.R;if(Math.abs(lat)>Proj4js.common.HALF_PI){Proj4js.reportError("sinu:Inv:DataError");}
+temp=Math.abs(lat)-Proj4js.common.HALF_PI;if(Math.abs(temp)>Proj4js.common.EPSLN){temp=this.long0+p.x/(this.R*Math.cos(lat));lon=Proj4js.common.adjust_lon(temp);}else{lon=this.long0;}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.vandg={init:function(){this.R=6370997.0;},forward:function(p){var lon=p.x;var lat=p.y;var dlon=Proj4js.common.adjust_lon(lon-this.long0);var x,y;if(Math.abs(lat)<=Proj4js.common.EPSLN){x=this.x0+this.R*dlon;y=this.y0;}
+var theta=Proj4js.common.asinz(2.0*Math.abs(lat/Proj4js.common.PI));if((Math.abs(dlon)<=Proj4js.common.EPSLN)||(Math.abs(Math.abs(lat)-Proj4js.common.HALF_PI)<=Proj4js.common.EPSLN)){x=this.x0;if(lat>=0){y=this.y0+Proj4js.common.PI*this.R*Math.tan(.5*theta);}else{y=this.y0+Proj4js.common.PI*this.R*-Math.tan(.5*theta);}}
+var al=.5*Math.abs((Proj4js.common.PI/dlon)-(dlon/Proj4js.common.PI));var asq=al*al;var sinth=Math.sin(theta);var costh=Math.cos(theta);var g=costh/(sinth+costh-1.0);var gsq=g*g;var m=g*(2.0/sinth-1.0);var msq=m*m;var con=Proj4js.common.PI*this.R*(al*(g-msq)+Math.sqrt(asq*(g-msq)*(g-msq)-(msq+asq)*(gsq-msq)))/(msq+asq);if(dlon<0){con=-con;}
+x=this.x0+con;con=Math.abs(con/(Proj4js.common.PI*this.R));if(lat>=0){y=this.y0+Proj4js.common.PI*this.R*Math.sqrt(1.0-con*con-2.0*al*con);}else{y=this.y0-Proj4js.common.PI*this.R*Math.sqrt(1.0-con*con-2.0*al*con);}
+p.x=x;p.y=y;return p;},inverse:function(p){var dlon;var xx,yy,xys,c1,c2,c3;var al,asq;var a1;var m1;var con;var th1;var d;p.x-=this.x0;p.y-=this.y0;con=Proj4js.common.PI*this.R;xx=p.x/con;yy=p.y/con;xys=xx*xx+yy*yy;c1=-Math.abs(yy)*(1.0+xys);c2=c1-2.0*yy*yy+xx*xx;c3=-2.0*c1+1.0+2.0*yy*yy+xys*xys;d=yy*yy/c3+(2.0*c2*c2*c2/c3/c3/c3-9.0*c1*c2/c3/c3)/27.0;a1=(c1-c2*c2/3.0/c3)/c3;m1=2.0*Math.sqrt(-a1/3.0);con=((3.0*d)/a1)/m1;if(Math.abs(con)>1.0){if(con>=0.0){con=1.0;}else{con=-1.0;}}
+th1=Math.acos(con)/3.0;if(p.y>=0){lat=(-m1*Math.cos(th1+Proj4js.common.PI/3.0)-c2/3.0/c3)*Proj4js.common.PI;}else{lat=-(-m1*Math.cos(th1+Proj4js.common.PI/3.0)-c2/3.0/c3)*Proj4js.common.PI;}
+if(Math.abs(xx)<Proj4js.common.EPSLN){lon=this.long0;}
+lon=Proj4js.common.adjust_lon(this.long0+Proj4js.common.PI*(xys-1.0+Math.sqrt(1.0+2.0*(xx*xx-yy*yy)+xys*xys))/2.0/xx);p.x=lon;p.y=lat;return p;}};Proj4js.Proj.cea={init:function(){},forward:function(p){var lon=p.x;var lat=p.y;dlon=Proj4js.common.adjust_lon(lon-this.long0);var x=this.x0+this.a*dlon*Math.cos(this.lat_ts);var y=this.y0+this.a*Math.sin(lat)/Math.cos(this.lat_ts);p.x=x;p.y=y;return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var lon=Proj4js.common.adjust_lon(this.long0+(p.x/this.a)/Math.cos(this.lat_ts));var lat=Math.asin((p.y/this.a)*Math.cos(this.lat_ts));p.x=lon;p.y=lat;return p;}};Proj4js.Proj.eqc={init:function(){if(!this.x0)this.x0=0;if(!this.y0)this.y0=0;if(!this.lat0)this.lat0=0;if(!this.long0)this.long0=0;if(!this.lat_ts)this.lat_ts=0;if(!this.title)this.title="Equidistant Cylindrical (Plate Carre)";this.rc=Math.cos(this.lat_ts);},forward:function(p){var lon=p.x;var lat=p.y;var dlon=Proj4js.common.adjust_lon(lon-this.long0);var dlat=Proj4js.common.adjust_lat(lat-this.lat0);p.x=this.x0+(this.a*dlon*this.rc);p.y=this.y0+(this.a*dlat);return p;},inverse:function(p){var x=p.x;var y=p.y;p.x=Proj4js.common.adjust_lon(this.long0+((x-this.x0)/(this.a*this.rc)));p.y=Proj4js.common.adjust_lat(this.lat0+((y-this.y0)/(this.a)));return p;}};Proj4js.Proj.cass={init:function(){if(!this.sphere){this.en=this.pj_enfn(this.es)
+this.m0=this.pj_mlfn(this.lat0,Math.sin(this.lat0),Math.cos(this.lat0),this.en);}},C1:.16666666666666666666,C2:.00833333333333333333,C3:.04166666666666666666,C4:.33333333333333333333,C5:.06666666666666666666,forward:function(p){var x,y;var lam=p.x;var phi=p.y;lam=Proj4js.common.adjust_lon(lam-this.long0);if(this.sphere){x=Math.asin(Math.cos(phi)*Math.sin(lam));y=Math.atan2(Math.tan(phi),Math.cos(lam))-this.phi0;}else{this.n=Math.sin(phi);this.c=Math.cos(phi);y=this.pj_mlfn(phi,this.n,this.c,this.en);this.n=1./Math.sqrt(1.-this.es*this.n*this.n);this.tn=Math.tan(phi);this.t=this.tn*this.tn;this.a1=lam*this.c;this.c*=this.es*this.c/(1-this.es);this.a2=this.a1*this.a1;x=this.n*this.a1*(1.-this.a2*this.t*(this.C1-(8.-this.t+8.*this.c)*this.a2*this.C2));y-=this.m0-this.n*this.tn*this.a2*(.5+(5.-this.t+6.*this.c)*this.a2*this.C3);}
+p.x=this.a*x+this.x0;p.y=this.a*y+this.y0;return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var x=p.x/this.a;var y=p.y/this.a;if(this.sphere){this.dd=y+this.lat0;phi=Math.asin(Math.sin(this.dd)*Math.cos(x));lam=Math.atan2(Math.tan(x),Math.cos(this.dd));}else{ph1=this.pj_inv_mlfn(this.m0+y,this.es,this.en);this.tn=Math.tan(ph1);this.t=this.tn*this.tn;this.n=Math.sin(ph1);this.r=1./(1.-this.es*this.n*this.n);this.n=Math.sqrt(this.r);this.r*=(1.-this.es)*this.n;this.dd=x/this.n;this.d2=this.dd*this.dd;phi=ph1-(this.n*this.tn/this.r)*this.d2*(.5-(1.+3.*this.t)*this.d2*this.C3);lam=this.dd*(1.+this.t*this.d2*(-this.C4+(1.+3.*this.t)*this.d2*this.C5))/Math.cos(ph1);}
+p.x=Proj4js.common.adjust_lon(this.long0+lam);p.y=phi;return p;},pj_enfn:function(es){en=new Array();en[0]=this.C00-es*(this.C02+es*(this.C04+es*(this.C06+es*this.C08)));en[1]=es*(this.C22-es*(this.C04+es*(this.C06+es*this.C08)));var t=es*es;en[2]=t*(this.C44-es*(this.C46+es*this.C48));t*=es;en[3]=t*(this.C66-es*this.C68);en[4]=t*es*this.C88;return en;},pj_mlfn:function(phi,sphi,cphi,en){cphi*=sphi;sphi*=sphi;return(en[0]*phi-cphi*(en[1]+sphi*(en[2]+sphi*(en[3]+sphi*en[4]))));},pj_inv_mlfn:function(arg,es,en){k=1./(1.-es);phi=arg;for(i=Proj4js.common.MAX_ITER;i;--i){s=Math.sin(phi);t=1.-es*s*s;t=(this.pj_mlfn(phi,s,Math.cos(phi),en)-arg)*(t*Math.sqrt(t))*k;phi-=t;if(Math.abs(t)<Proj4js.common.EPSLN)
+return phi;}
+Proj4js.reportError("cass:pj_inv_mlfn: Convergence error");return phi;},C00:1.0,C02:.25,C04:.046875,C06:.01953125,C08:.01068115234375,C22:.75,C44:.46875,C46:.01302083333333333333,C48:.00712076822916666666,C66:.36458333333333333333,C68:.00569661458333333333,C88:.3076171875}
+Proj4js.Proj.gauss={init:function(){sphi=Math.sin(this.lat0);cphi=Math.cos(this.lat0);cphi*=cphi;this.rc=Math.sqrt(1.0-this.es)/(1.0-this.es*sphi*sphi);this.C=Math.sqrt(1.0+this.es*cphi*cphi/(1.0-this.es));this.phic0=Math.asin(sphi/this.C);this.ratexp=0.5*this.C*this.e;this.K=Math.tan(0.5*this.phic0+Proj4js.common.FORTPI)/(Math.pow(Math.tan(0.5*this.lat0+Proj4js.common.FORTPI),this.C)*Proj4js.common.srat(this.e*sphi,this.ratexp));},forward:function(p){var lon=p.x;var lat=p.y;p.y=2.0*Math.atan(this.K*Math.pow(Math.tan(0.5*lat+Proj4js.common.FORTPI),this.C)*Proj4js.common.srat(this.e*Math.sin(lat),this.ratexp))-Proj4js.common.HALF_PI;p.x=this.C*lon;return p;},inverse:function(p){var DEL_TOL=1e-14;var lon=p.x/this.C;var lat=p.y;num=Math.pow(Math.tan(0.5*lat+Proj4js.common.FORTPI)/this.K,1./this.C);for(var i=Proj4js.common.MAX_ITER;i>0;--i){lat=2.0*Math.atan(num*Proj4js.common.srat(this.e*Math.sin(p.y),-0.5*this.e))-Proj4js.common.HALF_PI;if(Math.abs(lat-p.y)<DEL_TOL)break;p.y=lat;}
+if(!i){Proj4js.reportError("gauss:inverse:convergence failed");return null;}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.omerc={init:function(){if(!this.mode)this.mode=0;if(!this.lon1){this.lon1=0;this.mode=1;}
+if(!this.lon2)this.lon2=0;if(!this.lat2)this.lat2=0;var temp=this.b/this.a;var es=1.0-Math.pow(temp,2);var e=Math.sqrt(es);this.sin_p20=Math.sin(this.lat0);this.cos_p20=Math.cos(this.lat0);this.con=1.0-this.es*this.sin_p20*this.sin_p20;this.com=Math.sqrt(1.0-es);this.bl=Math.sqrt(1.0+this.es*Math.pow(this.cos_p20,4.0)/(1.0-es));this.al=this.a*this.bl*this.k0*this.com/this.con;if(Math.abs(this.lat0)<Proj4js.common.EPSLN){this.ts=1.0;this.d=1.0;this.el=1.0;}else{this.ts=Proj4js.common.tsfnz(this.e,this.lat0,this.sin_p20);this.con=Math.sqrt(this.con);this.d=this.bl*this.com/(this.cos_p20*this.con);if((this.d*this.d-1.0)>0.0){if(this.lat0>=0.0){this.f=this.d+Math.sqrt(this.d*this.d-1.0);}else{this.f=this.d-Math.sqrt(this.d*this.d-1.0);}}else{this.f=this.d;}
+this.el=this.f*Math.pow(this.ts,this.bl);}
+if(this.mode!=0){this.g=.5*(this.f-1.0/this.f);this.gama=Proj4js.common.asinz(Math.sin(this.alpha)/this.d);this.longc=this.longc-Proj4js.common.asinz(this.g*Math.tan(this.gama))/this.bl;this.con=Math.abs(this.lat0);if((this.con>Proj4js.common.EPSLN)&&(Math.abs(this.con-Proj4js.common.HALF_PI)>Proj4js.common.EPSLN)){this.singam=Math.sin(this.gama);this.cosgam=Math.cos(this.gama);this.sinaz=Math.sin(this.alpha);this.cosaz=Math.cos(this.alpha);if(this.lat0>=0){this.u=(this.al/this.bl)*Math.atan(Math.sqrt(this.d*this.d-1.0)/this.cosaz);}else{this.u=-(this.al/this.bl)*Math.atan(Math.sqrt(this.d*this.d-1.0)/this.cosaz);}}else{Proj4js.reportError("omerc:Init:DataError");}}else{this.sinphi=Math.sin(this.at1);this.ts1=Proj4js.common.tsfnz(this.e,this.lat1,this.sinphi);this.sinphi=Math.sin(this.lat2);this.ts2=Proj4js.common.tsfnz(this.e,this.lat2,this.sinphi);this.h=Math.pow(this.ts1,this.bl);this.l=Math.pow(this.ts2,this.bl);this.f=this.el/this.h;this.g=.5*(this.f-1.0/this.f);this.j=(this.el*this.el-this.l*this.h)/(this.el*this.el+this.l*this.h);this.p=(this.l-this.h)/(this.l+this.h);this.dlon=this.lon1-this.lon2;if(this.dlon<-Proj4js.common.PI)this.lon2=this.lon2-2.0*Proj4js.common.PI;if(this.dlon>Proj4js.common.PI)this.lon2=this.lon2+2.0*Proj4js.common.PI;this.dlon=this.lon1-this.lon2;this.longc=.5*(this.lon1+this.lon2)-Math.atan(this.j*Math.tan(.5*this.bl*this.dlon)/this.p)/this.bl;this.dlon=Proj4js.common.adjust_lon(this.lon1-this.longc);this.gama=Math.atan(Math.sin(this.bl*this.dlon)/this.g);this.alpha=Proj4js.common.asinz(this.d*Math.sin(this.gama));if(Math.abs(this.lat1-this.lat2)<=Proj4js.common.EPSLN){Proj4js.reportError("omercInitDataError");}else{this.con=Math.abs(this.lat1);}
+if((this.con<=Proj4js.common.EPSLN)||(Math.abs(this.con-HALF_PI)<=Proj4js.common.EPSLN)){Proj4js.reportError("omercInitDataError");}else{if(Math.abs(Math.abs(this.lat0)-Proj4js.common.HALF_PI)<=Proj4js.common.EPSLN){Proj4js.reportError("omercInitDataError");}}
+this.singam=Math.sin(this.gam);this.cosgam=Math.cos(this.gam);this.sinaz=Math.sin(this.alpha);this.cosaz=Math.cos(this.alpha);if(this.lat0>=0){this.u=(this.al/this.bl)*Math.atan(Math.sqrt(this.d*this.d-1.0)/this.cosaz);}else{this.u=-(this.al/this.bl)*Math.atan(Math.sqrt(this.d*this.d-1.0)/this.cosaz);}}},forward:function(p){var theta;var sin_phi,cos_phi;var b;var c,t,tq;var con,n,ml;var q,us,vl;var ul,vs;var s;var dlon;var ts1;var lon=p.x;var lat=p.y;sin_phi=Math.sin(lat);dlon=Proj4js.common.adjust_lon(lon-this.longc);vl=Math.sin(this.bl*dlon);if(Math.abs(Math.abs(lat)-Proj4js.common.HALF_PI)>Proj4js.common.EPSLN){ts1=Proj4js.common.tsfnz(this.e,lat,sin_phi);q=this.el/(Math.pow(ts1,this.bl));s=.5*(q-1.0/q);t=.5*(q+1.0/q);ul=(s*this.singam-vl*this.cosgam)/t;con=Math.cos(this.bl*dlon);if(Math.abs(con)<.0000001){us=this.al*this.bl*dlon;}else{us=this.al*Math.atan((s*this.cosgam+vl*this.singam)/con)/this.bl;if(con<0)us=us+Proj4js.common.PI*this.al/this.bl;}}else{if(lat>=0){ul=this.singam;}else{ul=-this.singam;}
+us=this.al*lat/this.bl;}
+if(Math.abs(Math.abs(ul)-1.0)<=Proj4js.common.EPSLN){Proj4js.reportError("omercFwdInfinity");}
+vs=.5*this.al*Math.log((1.0-ul)/(1.0+ul))/this.bl;us=us-this.u;var x=this.x0+vs*this.cosaz+us*this.sinaz;var y=this.y0+us*this.cosaz-vs*this.sinaz;p.x=x;p.y=y;return p;},inverse:function(p){var delta_lon;var theta;var delta_theta;var sin_phi,cos_phi;var b;var c,t,tq;var con,n,ml;var vs,us,q,s,ts1;var vl,ul,bs;var dlon;var flag;p.x-=this.x0;p.y-=this.y0;flag=0;vs=p.x*this.cosaz-p.y*this.sinaz;us=p.y*this.cosaz+p.x*this.sinaz;us=us+this.u;q=Math.exp(-this.bl*vs/this.al);s=.5*(q-1.0/q);t=.5*(q+1.0/q);vl=Math.sin(this.bl*us/this.al);ul=(vl*this.cosgam+s*this.singam)/t;if(Math.abs(Math.abs(ul)-1.0)<=Proj4js.common.EPSLN)
+{lon=this.longc;if(ul>=0.0){lat=Proj4js.common.HALF_PI;}else{lat=-Proj4js.common.HALF_PI;}}else{con=1.0/this.bl;ts1=Math.pow((this.el/Math.sqrt((1.0+ul)/(1.0-ul))),con);lat=Proj4js.common.phi2z(this.e,ts1);theta=this.longc-Math.atan2((s*this.cosgam-vl*this.singam),con)/this.bl;lon=Proj4js.common.adjust_lon(theta);}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.lcc={init:function(){if(!this.lat2){this.lat2=this.lat0;}
+if(!this.k0)this.k0=1.0;if(Math.abs(this.lat1+this.lat2)<Proj4js.common.EPSLN){Proj4js.reportError("lcc:init: Equal Latitudes");return;}
+var temp=this.b/this.a;this.e=Math.sqrt(1.0-temp*temp);var sin1=Math.sin(this.lat1);var cos1=Math.cos(this.lat1);var ms1=Proj4js.common.msfnz(this.e,sin1,cos1);var ts1=Proj4js.common.tsfnz(this.e,this.lat1,sin1);var sin2=Math.sin(this.lat2);var cos2=Math.cos(this.lat2);var ms2=Proj4js.common.msfnz(this.e,sin2,cos2);var ts2=Proj4js.common.tsfnz(this.e,this.lat2,sin2);var ts0=Proj4js.common.tsfnz(this.e,this.lat0,Math.sin(this.lat0));if(Math.abs(this.lat1-this.lat2)>Proj4js.common.EPSLN){this.ns=Math.log(ms1/ms2)/Math.log(ts1/ts2);}else{this.ns=sin1;}
+this.f0=ms1/(this.ns*Math.pow(ts1,this.ns));this.rh=this.a*this.f0*Math.pow(ts0,this.ns);if(!this.title)this.title="Lambert Conformal Conic";},forward:function(p){var lon=p.x;var lat=p.y;if(lat<=90.0&&lat>=-90.0&&lon<=180.0&&lon>=-180.0){}else{Proj4js.reportError("lcc:forward: llInputOutOfRange: "+lon+" : "+lat);return null;}
+var con=Math.abs(Math.abs(lat)-Proj4js.common.HALF_PI);var ts,rh1;if(con>Proj4js.common.EPSLN){ts=Proj4js.common.tsfnz(this.e,lat,Math.sin(lat));rh1=this.a*this.f0*Math.pow(ts,this.ns);}else{con=lat*this.ns;if(con<=0){Proj4js.reportError("lcc:forward: No Projection");return null;}
+rh1=0;}
+var theta=this.ns*Proj4js.common.adjust_lon(lon-this.long0);p.x=this.k0*(rh1*Math.sin(theta))+this.x0;p.y=this.k0*(this.rh-rh1*Math.cos(theta))+this.y0;return p;},inverse:function(p){var rh1,con,ts;var lat,lon;var x=(p.x-this.x0)/this.k0;var y=(this.rh-(p.y-this.y0)/this.k0);if(this.ns>0){rh1=Math.sqrt(x*x+y*y);con=1.0;}else{rh1=-Math.sqrt(x*x+y*y);con=-1.0;}
+var theta=0.0;if(rh1!=0){theta=Math.atan2((con*x),(con*y));}
+if((rh1!=0)||(this.ns>0.0)){con=1.0/this.ns;ts=Math.pow((rh1/(this.a*this.f0)),con);lat=Proj4js.common.phi2z(this.e,ts);if(lat==-9999)return null;}else{lat=-Proj4js.common.HALF_PI;}
+lon=Proj4js.common.adjust_lon(theta/this.ns+this.long0);p.x=lon;p.y=lat;return p;}};Proj4js.Proj.laea={S_POLE:1,N_POLE:2,EQUIT:3,OBLIQ:4,init:function(){var t=Math.abs(this.lat0);if(Math.abs(t-Proj4js.common.HALF_PI)<Proj4js.common.EPSLN){this.mode=this.lat0<0.?this.S_POLE:this.N_POLE;}else if(Math.abs(t)<Proj4js.common.EPSLN){this.mode=this.EQUIT;}else{this.mode=this.OBLIQ;}
+if(this.es>0){var sinphi;this.qp=Proj4js.common.qsfnz(this.e,1.0);this.mmf=.5/(1.-this.es);this.apa=this.authset(this.es);switch(this.mode){case this.N_POLE:case this.S_POLE:this.dd=1.;break;case this.EQUIT:this.rq=Math.sqrt(.5*this.qp);this.dd=1./this.rq;this.xmf=1.;this.ymf=.5*this.qp;break;case this.OBLIQ:this.rq=Math.sqrt(.5*this.qp);sinphi=Math.sin(this.lat0);this.sinb1=Proj4js.common.qsfnz(this.e,sinphi)/this.qp;this.cosb1=Math.sqrt(1.-this.sinb1*this.sinb1);this.dd=Math.cos(this.lat0)/(Math.sqrt(1.-this.es*sinphi*sinphi)*this.rq*this.cosb1);this.ymf=(this.xmf=this.rq)/this.dd;this.xmf*=this.dd;break;}}else{if(this.mode==this.OBLIQ){this.sinph0=Math.sin(this.lat0);this.cosph0=Math.cos(this.lat0);}}},forward:function(p){var x,y;var lam=p.x;var phi=p.y;lam=Proj4js.common.adjust_lon(lam-this.long0);if(this.sphere){var coslam,cosphi,sinphi;sinphi=Math.sin(phi);cosphi=Math.cos(phi);coslam=Math.cos(lam);switch(this.mode){case this.OBLIQ:case this.EQUIT:y=(this.mode==this.EQUIT)?1.+cosphi*coslam:1.+this.sinph0*sinphi+this.cosph0*cosphi*coslam;if(y<=Proj4js.common.EPSLN){Proj4js.reportError("laea:fwd:y less than eps");return null;}
+y=Math.sqrt(2./y);x=y*cosphi*Math.sin(lam);y*=(this.mode==this.EQUIT)?sinphi:this.cosph0*sinphi-this.sinph0*cosphi*coslam;break;case this.N_POLE:coslam=-coslam;case this.S_POLE:if(Math.abs(phi+this.phi0)<Proj4js.common.EPSLN){Proj4js.reportError("laea:fwd:phi < eps");return null;}
+y=Proj4js.common.FORTPI-phi*.5;y=2.*((this.mode==this.S_POLE)?Math.cos(y):Math.sin(y));x=y*Math.sin(lam);y*=coslam;break;}}else{var coslam,sinlam,sinphi,q,sinb=0.0,cosb=0.0,b=0.0;coslam=Math.cos(lam);sinlam=Math.sin(lam);sinphi=Math.sin(phi);q=Proj4js.common.qsfnz(this.e,sinphi);if(this.mode==this.OBLIQ||this.mode==this.EQUIT){sinb=q/this.qp;cosb=Math.sqrt(1.-sinb*sinb);}
+switch(this.mode){case this.OBLIQ:b=1.+this.sinb1*sinb+this.cosb1*cosb*coslam;break;case this.EQUIT:b=1.+cosb*coslam;break;case this.N_POLE:b=Proj4js.common.HALF_PI+phi;q=this.qp-q;break;case this.S_POLE:b=phi-Proj4js.common.HALF_PI;q=this.qp+q;break;}
+if(Math.abs(b)<Proj4js.common.EPSLN){Proj4js.reportError("laea:fwd:b < eps");return null;}
+switch(this.mode){case this.OBLIQ:case this.EQUIT:b=Math.sqrt(2./b);if(this.mode==this.OBLIQ){y=this.ymf*b*(this.cosb1*sinb-this.sinb1*cosb*coslam);}else{y=(b=Math.sqrt(2./(1.+cosb*coslam)))*sinb*this.ymf;}
+x=this.xmf*b*cosb*sinlam;break;case this.N_POLE:case this.S_POLE:if(q>=0.){x=(b=Math.sqrt(q))*sinlam;y=coslam*((this.mode==this.S_POLE)?b:-b);}else{x=y=0.;}
+break;}}
+p.x=this.a*x+this.x0;p.y=this.a*y+this.y0;return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var x=p.x/this.a;var y=p.y/this.a;if(this.sphere){var cosz=0.0,rh,sinz=0.0;rh=Math.sqrt(x*x+y*y);var phi=rh*.5;if(phi>1.){Proj4js.reportError("laea:Inv:DataError");return null;}
+phi=2.*Math.asin(phi);if(this.mode==this.OBLIQ||this.mode==this.EQUIT){sinz=Math.sin(phi);cosz=Math.cos(phi);}
+switch(this.mode){case this.EQUIT:phi=(Math.abs(rh)<=Proj4js.common.EPSLN)?0.:Math.asin(y*sinz/rh);x*=sinz;y=cosz*rh;break;case this.OBLIQ:phi=(Math.abs(rh)<=Proj4js.common.EPSLN)?this.phi0:Math.asin(cosz*sinph0+y*sinz*cosph0/rh);x*=sinz*cosph0;y=(cosz-Math.sin(phi)*sinph0)*rh;break;case this.N_POLE:y=-y;phi=Proj4js.common.HALF_PI-phi;break;case this.S_POLE:phi-=Proj4js.common.HALF_PI;break;}
+lam=(y==0.&&(this.mode==this.EQUIT||this.mode==this.OBLIQ))?0.:Math.atan2(x,y);}else{var cCe,sCe,q,rho,ab=0.0;switch(this.mode){case this.EQUIT:case this.OBLIQ:x/=this.dd;y*=this.dd;rho=Math.sqrt(x*x+y*y);if(rho<Proj4js.common.EPSLN){p.x=0.;p.y=this.phi0;return p;}
+sCe=2.*Math.asin(.5*rho/this.rq);cCe=Math.cos(sCe);x*=(sCe=Math.sin(sCe));if(this.mode==this.OBLIQ){ab=cCe*this.sinb1+y*sCe*this.cosb1/rho
+q=this.qp*ab;y=rho*this.cosb1*cCe-y*this.sinb1*sCe;}else{ab=y*sCe/rho;q=this.qp*ab;y=rho*cCe;}
+break;case this.N_POLE:y=-y;case this.S_POLE:q=(x*x+y*y);if(!q){p.x=0.;p.y=this.phi0;return p;}
+ab=1.-q/this.qp;if(this.mode==this.S_POLE){ab=-ab;}
+break;}
+lam=Math.atan2(x,y);phi=this.authlat(Math.asin(ab),this.apa);}
+p.x=Proj4js.common.adjust_lon(this.long0+lam);p.y=phi;return p;},P00:.33333333333333333333,P01:.17222222222222222222,P02:.10257936507936507936,P10:.06388888888888888888,P11:.06640211640211640211,P20:.01641501294219154443,authset:function(es){var t;var APA=new Array();APA[0]=es*this.P00;t=es*es;APA[0]+=t*this.P01;APA[1]=t*this.P10;t*=es;APA[0]+=t*this.P02;APA[1]+=t*this.P11;APA[2]=t*this.P20;return APA;},authlat:function(beta,APA){var t=beta+beta;return(beta+APA[0]*Math.sin(t)+APA[1]*Math.sin(t+t)+APA[2]*Math.sin(t+t+t));}};Proj4js.Proj.aeqd={init:function(){this.sin_p12=Math.sin(this.lat0);this.cos_p12=Math.cos(this.lat0);},forward:function(p){var lon=p.x;var lat=p.y;var ksp;var sinphi=Math.sin(p.y);var cosphi=Math.cos(p.y);var dlon=Proj4js.common.adjust_lon(lon-this.long0);var coslon=Math.cos(dlon);var g=this.sin_p12*sinphi+this.cos_p12*cosphi*coslon;if(Math.abs(Math.abs(g)-1.0)<Proj4js.common.EPSLN){ksp=1.0;if(g<0.0){Proj4js.reportError("aeqd:Fwd:PointError");return;}}else{var z=Math.acos(g);ksp=z/Math.sin(z);}
+p.x=this.x0+this.a*ksp*cosphi*Math.sin(dlon);p.y=this.y0+this.a*ksp*(this.cos_p12*sinphi-this.sin_p12*cosphi*coslon);return p;},inverse:function(p){p.x-=this.x0;p.y-=this.y0;var rh=Math.sqrt(p.x*p.x+p.y*p.y);if(rh>(2.0*Proj4js.common.HALF_PI*this.a)){Proj4js.reportError("aeqdInvDataError");return;}
+var z=rh/this.a;var sinz=Math.sin(z);var cosz=Math.cos(z);var lon=this.long0;var lat;if(Math.abs(rh)<=Proj4js.common.EPSLN){lat=this.lat0;}else{lat=Proj4js.common.asinz(cosz*this.sin_p12+(p.y*sinz*this.cos_p12)/rh);var con=Math.abs(this.lat0)-Proj4js.common.HALF_PI;if(Math.abs(con)<=Proj4js.common.EPSLN){if(lat0>=0.0){lon=Proj4js.common.adjust_lon(this.long0+Math.atan2(p.x,-p.y));}else{lon=Proj4js.common.adjust_lon(this.long0-Math.atan2(-p.x,p.y));}}else{con=cosz-this.sin_p12*Math.sin(lat);if((Math.abs(con)<Proj4js.common.EPSLN)&&(Math.abs(p.x)<Proj4js.common.EPSLN)){}else{var temp=Math.atan2((p.x*sinz*this.cos_p12),(con*rh));lon=Proj4js.common.adjust_lon(this.long0+Math.atan2((p.x*sinz*this.cos_p12),(con*rh)));}}}
+p.x=lon;p.y=lat;return p;}};Proj4js.Proj.moll={init:function(){},forward:function(p){var lon=p.x;var lat=p.y;var delta_lon=Proj4js.common.adjust_lon(lon-this.long0);var theta=lat;var con=Proj4js.common.PI*Math.sin(lat);for(var i=0;true;i++){var delta_theta=-(theta+Math.sin(theta)-con)/(1.0+Math.cos(theta));theta+=delta_theta;if(Math.abs(delta_theta)<Proj4js.common.EPSLN)break;if(i>=50){Proj4js.reportError("moll:Fwd:IterationError");}}
+theta/=2.0;if(Proj4js.common.PI/2-Math.abs(lat)<Proj4js.common.EPSLN)delta_lon=0;var x=0.900316316158*this.a*delta_lon*Math.cos(theta)+this.x0;var y=1.4142135623731*this.a*Math.sin(theta)+this.y0;p.x=x;p.y=y;return p;},inverse:function(p){var theta;var arg;p.x-=this.x0;var arg=p.y/(1.4142135623731*this.a);if(Math.abs(arg)>0.999999999999)arg=0.999999999999;var theta=Math.asin(arg);var lon=Proj4js.common.adjust_lon(this.long0+(p.x/(0.900316316158*this.a*Math.cos(theta))));if(lon<(-Proj4js.common.PI))lon=-Proj4js.common.PI;if(lon>Proj4js.common.PI)lon=Proj4js.common.PI;arg=(2.0*theta+Math.sin(2.0*theta))/Proj4js.common.PI;if(Math.abs(arg)>1.0)arg=1.0;var lat=Math.asin(arg);p.x=lon;p.y=lat;return p;}};
Index: /trunk/workshop-routing-foss4g/web/proj4js/index.html
===================================================================
--- /trunk/workshop-routing-foss4g/web/proj4js/index.html	(revision 76)
+++ /trunk/workshop-routing-foss4g/web/proj4js/index.html	(revision 76)
@@ -0,0 +1,172 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>Proj4js</title>
+  
+  <style type="text/css">
+    @import url(test/base.css);
+
+    #descSource, #descDest {
+        font-style: italic;
+        color: #999;
+    }
+    
+    #xySource, #xyDest {
+        width: 100%;
+    }
+    
+  </style>
+  
+  <script src="lib/proj4js.js"></script>
+ 
+  <script src="lib/defs/EPSG27200.js"></script>
+  <script src="lib/defs/EPSG4272.js"></script>
+  <script src="lib/defs/EPSG54009.js"></script>
+  <script src="lib/defs/EPSG42304.js"></script>
+  <script src="lib/defs/EPSG25833.js"></script>
+  <script src="lib/defs/EPSG27563.js"></script>
+  <script src="lib/defs/EPSG4139.js"></script>
+  <script src="lib/defs/EPSG4302.js"></script>
+  <script src="lib/defs/EPSG31285.js"></script>
+  <script src="lib/defs/EPSG900913.js"></script>
+                      
+  <script type="text/javascript">
+  
+  var projHash = {};
+  function initProj4js() {
+    var crsSource = document.getElementById('crsSource');
+    var crsDest = document.getElementById('crsDest');
+    var optIndex = 0;
+    for (var def in Proj4js.defs) {
+       projHash[def] = new Proj4js.Proj(def);    //create a Proj for each definition
+       var label = def+" - "+ (projHash[def].title ? projHash[def].title : '');
+       var opt = new Option(label, def);
+       crsSource.options[optIndex]= opt;
+       var opt = new Option(label, def);
+       crsDest.options[optIndex]= opt;
+       ++optIndex;
+    }  // for
+    updateCrs('Source');
+    updateCrs('Dest');
+  }
+  
+  function updateCrs(id) {
+    var crs = document.getElementById('crs'+id);
+    if (crs.value) {
+      var proj = projHash[crs.value];
+      var str = 'projection: ' + proj.projName + ' - datum: ' + proj.datumName;
+      var desc = document.getElementById('desc'+id);
+      desc.innerHTML = str;
+      var units = document.getElementById('units'+id);
+      units.innerHTML = proj.units;
+    }
+  }
+  
+  function transform() {
+    var crsSource = document.getElementById('crsSource');
+    var projSource = null;
+    if (crsSource.value) {
+      projSource = projHash[crsSource.value];
+    } else {
+      alert("Select a source coordinate system");
+      return;
+    }
+    var crsDest = document.getElementById('crsDest');
+    var projDest = null;
+    if (crsDest.value) {
+      projDest = projHash[crsDest.value];
+    } else {
+      alert("Select a destination coordinate system");
+      return;
+    }
+    var pointInput = document.getElementById('xySource');
+    if (pointInput.value) {
+      var pointSource = new Proj4js.Point(pointInput.value);
+      var pointDest = Proj4js.transform(projSource, projDest, pointSource);
+      document.getElementById('xyDest').value = pointDest.toShortString();
+    } else {
+      alert("Enter source coordinates");
+      return;
+    }
+  }
+  
+  </script>
+</head>
+
+<body onload="initProj4js()">
+  <div id="header">
+    <h1>Proj4js Home Page</h1>
+  </div>
+  <div id="navbar">
+    <a href="http://trac.osgeo.org/proj4js">Proj4js Wiki/Trac</a> | 
+    <a href="http://wiki.osgeo.org/wiki/MetaCRS">OSGeo MetaCRS</a> |
+    <a href="http://spatialreference.org/">spatialreference.org</a> |
+    <a href="http://communitymapbuilder.org/">MapBuilder</a> | 
+    <a href="http://openlayers.org/">OpenLayers</a> | 
+  </div>
+  <h1>Welcome to Proj4js</h1>
+  <p>
+This is a JavaScript library that provides methods for coordinate 
+transformations between map projections and longitude/latitude, 
+including datum transformations, in a web client.
+  </p>
+
+  <p>
+To use the Proj4js, you first create a source and destination Proj4js.Proj
+objects, passing in a projection code (e.g. EPSG:4326).
+You can then use the Proj4js.transform() method, passing in map XY as a point
+object and the source and destination projection objects,
+and it returns the point coordinate in the destination projection.
+  </p>
+  <form>
+  <table>
+    <tbody>
+      <tr>
+        <th colspan="3">source</th>
+        <th></th>
+        <th colspan="3">dest</th>
+      </tr>
+      <tr>
+        <td>CRS:</td>
+        <td colspan="2">
+          <select name="crsSource" id="crsSource" onchange="updateCrs('Source')">
+            <option value selected="selected">Select a CRS</option>
+          </select>
+        </td>
+        <td></td>
+        <td>CRS:</td>
+        <td colspan="2">
+          <select name="crsDest" id="crsDest" onchange="updateCrs('Dest')">
+            <option value selected="selected">Select a CRS</option>
+          </select>
+        </td>
+      </tr>
+      <tr>
+        <td></td>
+        <td colspan="2" id="descSource">Projection - datum</td>
+        <td></td>
+        <td></td>
+        <td colspan="2" id="descDest">Projection - datum</td>
+      </tr>
+      <tr>
+        <td>x,y</td>
+        <td><input name="xySource" id="xySource" type="text"/></td>
+        <td id="unitsSource">units</td>
+        <td><input type="button" value="--> transform -->" onclick="transform();"/></td>
+        <td>x,y</td>
+        <td><input name="xyDest" id="xyDest" type="text"></td>
+        <td id="unitsDest">units</td>
+      </tr>
+      <tr>
+        <td colspan="7" align="center"><input type="reset" value="reset"/></td>
+      </tr>
+    </tbody>
+  </table>
+  </form>
+  <p>
+For more information on Proj4js and to report bugs, please visit the 
+<a href="http://trac.osgeo.org/proj4js">Proj4js Trac and Wiki</a> at OSGeo.
+  </p>
+
+</body>
+</html>
Index: unk/workshop-routing-foss4g/make.bat
===================================================================
--- /trunk/workshop-routing-foss4g/make.bat	(revision 75)
+++ 	(revision )
@@ -1,113 +1,0 @@
-@ECHO OFF
-
-REM Command file for Sphinx documentation
-
-set SPHINXBUILD=sphinx-build
-set BUILDDIR=_build
-set ALLSPHINXOPTS=-d %BUILDDIR%/doctrees %SPHINXOPTS% .
-if NOT "%PAPER%" == "" (
-	set ALLSPHINXOPTS=-D latex_paper_size=%PAPER% %ALLSPHINXOPTS%
-)
-
-if "%1" == "" goto help
-
-if "%1" == "help" (
-	:help
-	echo.Please use `make ^<target^>` where ^<target^> is one of
-	echo.  html      to make standalone HTML files
-	echo.  dirhtml   to make HTML files named index.html in directories
-	echo.  pickle    to make pickle files
-	echo.  json      to make JSON files
-	echo.  htmlhelp  to make HTML files and a HTML help project
-	echo.  qthelp    to make HTML files and a qthelp project
-	echo.  latex     to make LaTeX files, you can set PAPER=a4 or PAPER=letter
-	echo.  changes   to make an overview over all changed/added/deprecated items
-	echo.  linkcheck to check all external links for integrity
-	echo.  doctest   to run all doctests embedded in the documentation if enabled
-	goto end
-)
-
-if "%1" == "clean" (
-	for /d %%i in (%BUILDDIR%\*) do rmdir /q /s %%i
-	del /q /s %BUILDDIR%\*
-	goto end
-)
-
-if "%1" == "html" (
-	%SPHINXBUILD% -b html %ALLSPHINXOPTS% %BUILDDIR%/html
-	echo.
-	echo.Build finished. The HTML pages are in %BUILDDIR%/html.
-	goto end
-)
-
-if "%1" == "dirhtml" (
-	%SPHINXBUILD% -b dirhtml %ALLSPHINXOPTS% %BUILDDIR%/dirhtml
-	echo.
-	echo.Build finished. The HTML pages are in %BUILDDIR%/dirhtml.
-	goto end
-)
-
-if "%1" == "pickle" (
-	%SPHINXBUILD% -b pickle %ALLSPHINXOPTS% %BUILDDIR%/pickle
-	echo.
-	echo.Build finished; now you can process the pickle files.
-	goto end
-)
-
-if "%1" == "json" (
-	%SPHINXBUILD% -b json %ALLSPHINXOPTS% %BUILDDIR%/json
-	echo.
-	echo.Build finished; now you can process the JSON files.
-	goto end
-)
-
-if "%1" == "htmlhelp" (
-	%SPHINXBUILD% -b htmlhelp %ALLSPHINXOPTS% %BUILDDIR%/htmlhelp
-	echo.
-	echo.Build finished; now you can run HTML Help Workshop with the ^
-.hhp project file in %BUILDDIR%/htmlhelp.
-	goto end
-)
-
-if "%1" == "qthelp" (
-	%SPHINXBUILD% -b qthelp %ALLSPHINXOPTS% %BUILDDIR%/qthelp
-	echo.
-	echo.Build finished; now you can run "qcollectiongenerator" with the ^
-.qhcp project file in %BUILDDIR%/qthelp, like this:
-	echo.^> qcollectiongenerator %BUILDDIR%\qthelp\Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhcp
-	echo.To view the help file:
-	echo.^> assistant -collectionFile %BUILDDIR%\qthelp\Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.ghc
-	goto end
-)
-
-if "%1" == "latex" (
-	%SPHINXBUILD% -b latex %ALLSPHINXOPTS% %BUILDDIR%/latex
-	echo.
-	echo.Build finished; the LaTeX files are in %BUILDDIR%/latex.
-	goto end
-)
-
-if "%1" == "changes" (
-	%SPHINXBUILD% -b changes %ALLSPHINXOPTS% %BUILDDIR%/changes
-	echo.
-	echo.The overview file is in %BUILDDIR%/changes.
-	goto end
-)
-
-if "%1" == "linkcheck" (
-	%SPHINXBUILD% -b linkcheck %ALLSPHINXOPTS% %BUILDDIR%/linkcheck
-	echo.
-	echo.Link check complete; look for any errors in the above output ^
-or in %BUILDDIR%/linkcheck/output.txt.
-	goto end
-)
-
-if "%1" == "doctest" (
-	%SPHINXBUILD% -b doctest %ALLSPHINXOPTS% %BUILDDIR%/doctest
-	echo.
-	echo.Testing of doctests in the sources finished, look at the ^
-results in %BUILDDIR%/doctest/output.txt.
-	goto end
-)
-
-:end
Index: unk/workshop-routing-foss4g/latex.rst
===================================================================
--- /trunk/workshop-routing-foss4g/latex.rst	(revision 75)
+++ 	(revision )
@@ -1,23 +1,0 @@
-.. Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt documentation master file, created by
-   sphinx-quickstart on Sat Jul  3 21:23:22 2010.
-   You can adapt this file completely to your liking, but it should at least
-   contain the root `toctree` directive.
-
-==============================================================================================================
-pgRouting Workshop - Latex generation (doesn't include this page)
-==============================================================================================================
-
-.. toctree::
-   :numbered:
-   :maxdepth: 3
-
-   chapters/introduction.rst
-   chapters/about.rst
-   chapters/installation.rst
-   chapters/osm2pgrouting.rst
-   chapters/topology.rst
-   chapters/shortest_path.rst
-   chapters/advanced.rst
-   chapters/php_server.rst
-   chapters/geoext_client.rst
-
Index: unk/workshop-routing-foss4g/conf.py
===================================================================
--- /trunk/workshop-routing-foss4g/conf.py	(revision 75)
+++ 	(revision )
@@ -1,227 +1,0 @@
-# -*- coding: utf-8 -*-
-#
-# Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt documentation build configuration file, created by
-# sphinx-quickstart on Sat Jul  3 21:23:22 2010.
-#
-# This file is execfile()d with the current directory set to its containing dir.
-#
-# Note that not all possible configuration values are present in this
-# autogenerated file.
-#
-# All configuration values have a default; values that are commented out
-# serve to show the default.
-
-import sys, os
-
-# If extensions (or modules to document with autodoc) are in another directory,
-# add these directories to sys.path here. If the directory is relative to the
-# documentation root, use os.path.abspath to make it absolute, like shown here.
-sys.path.append(os.path.abspath('.'))
-
-# -- General configuration -----------------------------------------------------
-
-# Add any Sphinx extension module names here, as strings. They can be extensions
-# coming with Sphinx (named 'sphinx.ext.*') or your custom ones.
-extensions = ['sphinx.ext.todo']
-
-# Add any paths that contain templates here, relative to this directory.
-templates_path = ['_templates']
-
-# The suffix of source filenames.
-source_suffix = '.rst'
-
-# The encoding of source files.
-#source_encoding = 'utf-8'
-
-# The master toctree document.
-master_doc = 'index'
-
-# General information about the project.
-project = u'Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le rÃ©seau routier d''OpenStreetMap et GeoExt'
-copyright = u'2010-2011 Daniel Kastl, FrÃ©dÃ©ric Junod'
-
-# The version info for the project you're documenting, acts as replacement for
-# |version| and |release|, also used in various other places throughout the
-# built documents.
-#
-# The short X.Y version.
-version = '2011'
-# The full version, including alpha/beta/rc tags.
-release = '2'
-
-# The language for content autogenerated by Sphinx. Refer to documentation
-# for a list of supported languages.
-#language = None
-
-# There are two options for replacing |today|: either, you set today to some
-# non-false value, then it is used:
-#today = ''
-# Else, today_fmt is used as the format for a strftime call.
-#today_fmt = '%B %d, %Y'
-
-# List of documents that shouldn't be included in the build.
-#unused_docs = []
-
-# List of directories, relative to source directory, that shouldn't be searched
-# for source files.
-exclude_trees = ['_build']
-
-# The reST default role (used for this markup: `text`) to use for all documents.
-#default_role = None
-
-# If true, '()' will be appended to :func: etc. cross-reference text.
-#add_function_parentheses = True
-
-# If true, the current module name will be prepended to all description
-# unit titles (such as .. function::).
-#add_module_names = True
-
-# If true, sectionauthor and moduleauthor directives will be shown in the
-# output. They are ignored by default.
-#show_authors = False
-
-# The name of the Pygments (syntax highlighting) style to use.
-pygments_style = 'sphinx'
-
-# A list of ignored prefixes for module index sorting.
-#modindex_common_prefix = []
-
-
-# -- Options for HTML output ---------------------------------------------------
-
-# The theme to use for HTML and HTML Help pages.  Major themes that come with
-# Sphinx are currently 'default' and 'sphinxdoc'.
-html_theme = 'default'
-
-# Theme options are theme-specific and customize the look and feel of a theme
-# further.  For a list of options available for each theme, see the
-# documentation.
-html_theme_options = {
-    #"rightsidebar": "true",
-    "stickysidebar": "true",
-    "footerbgcolor": "#FFEEFF",
-    "footertextcolor": "#555555",
-    "sidebarbgcolor": "#FFEEFF",
-    "sidebartextcolor": "#111111",
-    "sidebarlinkcolor": "#355F7C",
-    #"bgcolor": "",
-    #"textcolor": "",
-    #"linkcolor": "",
-    #"headbgcolor": "",
-    #"headtextcolor": "",
-    #"headlinkcolor": "",
-    #"codebgcolor": "",
-    #"codetextcolor": "",
-    #"bodyfont": "",
-    #"headfont": "",
-    #"relbartextcolor": "",
-    #"relbarlinkcolor": "",
-    "relbarbgcolor": "#555555"
-}
-
-# Add any paths that contain custom themes here, relative to this directory.
-#html_theme_path = []
-
-# The name for this set of Sphinx documents.  If None, it defaults to
-# "<project> v<release> documentation".
-html_title = "Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le reseau routier d'OpenStreetMap et GeoExt"
-
-# A shorter title for the navigation bar.  Default is the same as html_title.
-html_short_title = "Travaux pratiques - Routage FOSS4G avec les outils de pgRouting, le reseau routier d'OpenStreetMap et GeoExt"
-
-# The name of an image file (relative to this directory) to place at the top
-# of the sidebar.
-html_logo = "_static/pgrouting.png"
-
-# The name of an image file (within the static path) to use as favicon of the
-# docs.  This file should be a Windows icon file (.ico) being 16x16 or 32x32
-# pixels large.
-html_favicon = "_static/favicon.ico"
-
-# Add any paths that contain custom static files (such as style sheets) here,
-# relative to this directory. They are copied after the builtin static files,
-# so a file named "default.css" will overwrite the builtin "default.css".
-html_static_path = ['_static']
-
-# If not '', a 'Last updated on:' timestamp is inserted at every page bottom,
-# using the given strftime format.
-html_last_updated_fmt = '%b %d, %Y'
-
-# If true, SmartyPants will be used to convert quotes and dashes to
-# typographically correct entities.
-#html_use_smartypants = True
-
-# Custom sidebar templates, maps document names to template names.
-#html_sidebars = {}
-
-# Additional templates that should be rendered to pages, maps page names to
-# template names.
-#html_additional_pages = {}
-
-# If false, no module index is generated.
-#html_use_modindex = True
-
-# If false, no index is generated.
-html_use_index = False
-
-# If true, the index is split into individual pages for each letter.
-#html_split_index = False
-
-# If true, links to the reST sources are added to the pages.
-html_show_sourcelink = False
-
-# If true, an OpenSearch description file will be output, and all pages will
-# contain a <link> tag referring to it.  The value of this option must be the
-# base URL from which the finished HTML is served.
-#html_use_opensearch = ''
-
-# If nonempty, this is the file name suffix for HTML files (e.g. ".xhtml").
-#html_file_suffix = ''
-
-# Output file base name for HTML help builder.
-htmlhelp_basename = 'pgRoutingWorkshop'
-
-
-# -- Options for LaTeX output --------------------------------------------------
-
-latex_elements = {
-	'papersize'	: 'letter',
-	'pointsize'	: '10pt'
-}
-
-# Grouping the document tree into LaTeX files. List of tuples
-# (source start file, target name, title, author, documentclass [howto/manual]).
-latex_documents = [
-  ('latex', 'pgRoutingWorkshop.tex', u'Workshop - FOSS4G routing with pgRouting tools, OpenStreetMap road data and GeoExt Manual',
-   u'Daniel Kastl, FrÃ©dÃ©ric Junod', 'manual', False),
-]
-
-# The name of an image file (relative to this directory) to place at the top of
-# the title page.
-#latex_logo = None
-
-# For "manual" documents, if this is true, then toplevel headings are parts,
-# not chapters.
-#latex_use_parts = False
-
-# Additional stuff for the LaTeX preamble.
-#latex_preamble = ''
-
-# Documents to append as an appendix to all manuals.
-#latex_appendices = []
-
-# If false, no module index is generated.
-latex_use_modindex = False
-
-# New in version 1.0
-latex_show_pagerefs = False
-latex_domain_indices = False
-
-
-# -- Custom Options --------------------------------------------------
-
-# Enable ToDo extension
-todo_include_todos = True
-
-html_show_sphinx = False
-
Index: unk/workshop-routing-foss4g/Makefile
===================================================================
--- /trunk/workshop-routing-foss4g/Makefile	(revision 75)
+++ 	(revision )
@@ -1,89 +1,0 @@
-# Makefile for Sphinx documentation
-#
-
-# You can set these variables from the command line.
-SPHINXOPTS    = -Dlanguage=fr
-SPHINXBUILD   = sphinx-build
-PAPER         =
-BUILDDIR      = _build
-
-# Internal variables.
-PAPEROPT_a4     = -D latex_paper_size=a4
-PAPEROPT_letter = -D latex_paper_size=letter
-ALLSPHINXOPTS   = -d $(BUILDDIR)/doctrees $(PAPEROPT_$(PAPER)) $(SPHINXOPTS) .
-
-.PHONY: help clean html dirhtml pickle json htmlhelp qthelp latex changes linkcheck doctest
-
-help:
-	@echo "Please use \`make <target>' where <target> is one of"
-	@echo "  html      to make standalone HTML files"
-	@echo "  dirhtml   to make HTML files named index.html in directories"
-	@echo "  pickle    to make pickle files"
-	@echo "  json      to make JSON files"
-	@echo "  htmlhelp  to make HTML files and a HTML help project"
-	@echo "  qthelp    to make HTML files and a qthelp project"
-	@echo "  latex     to make LaTeX files, you can set PAPER=a4 or PAPER=letter"
-	@echo "  changes   to make an overview of all changed/added/deprecated items"
-	@echo "  linkcheck to check all external links for integrity"
-	@echo "  doctest   to run all doctests embedded in the documentation (if enabled)"
-
-clean:
-	-rm -rf $(BUILDDIR)/*
-
-html:
-	$(SPHINXBUILD) -b html $(ALLSPHINXOPTS) $(BUILDDIR)/html
-	@echo
-	@echo "Build finished. The HTML pages are in $(BUILDDIR)/html."
-
-dirhtml:
-	$(SPHINXBUILD) -b dirhtml $(ALLSPHINXOPTS) $(BUILDDIR)/dirhtml
-	@echo
-	@echo "Build finished. The HTML pages are in $(BUILDDIR)/dirhtml."
-
-pickle:
-	$(SPHINXBUILD) -b pickle $(ALLSPHINXOPTS) $(BUILDDIR)/pickle
-	@echo
-	@echo "Build finished; now you can process the pickle files."
-
-json:
-	$(SPHINXBUILD) -b json $(ALLSPHINXOPTS) $(BUILDDIR)/json
-	@echo
-	@echo "Build finished; now you can process the JSON files."
-
-htmlhelp:
-	$(SPHINXBUILD) -b htmlhelp $(ALLSPHINXOPTS) $(BUILDDIR)/htmlhelp
-	@echo
-	@echo "Build finished; now you can run HTML Help Workshop with the" \
-	      ".hhp project file in $(BUILDDIR)/htmlhelp."
-
-qthelp:
-	$(SPHINXBUILD) -b qthelp $(ALLSPHINXOPTS) $(BUILDDIR)/qthelp
-	@echo
-	@echo "Build finished; now you can run "qcollectiongenerator" with the" \
-	      ".qhcp project file in $(BUILDDIR)/qthelp, like this:"
-	@echo "# qcollectiongenerator $(BUILDDIR)/qthelp/Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhcp"
-	@echo "To view the help file:"
-	@echo "# assistant -collectionFile $(BUILDDIR)/qthelp/Workshop-FOSS4GroutingwithpgRoutingtoolsOpenStreetMaproaddataandGeoExt.qhc"
-
-latex:
-	$(SPHINXBUILD) -b latex $(ALLSPHINXOPTS) $(BUILDDIR)/latex
-	@echo
-	@echo "Build finished; the LaTeX files are in $(BUILDDIR)/latex."
-	@echo "Run \`make all-pdf' or \`make all-ps' in that directory to" \
-	      "run these through (pdf)latex."
-
-changes:
-	$(SPHINXBUILD) -b changes $(ALLSPHINXOPTS) $(BUILDDIR)/changes
-	@echo
-	@echo "The overview file is in $(BUILDDIR)/changes."
-
-linkcheck:
-	$(SPHINXBUILD) -b linkcheck $(ALLSPHINXOPTS) $(BUILDDIR)/linkcheck
-	@echo
-	@echo "Link check complete; look for any errors in the above output " \
-	      "or in $(BUILDDIR)/linkcheck/output.txt."
-
-doctest:
-	$(SPHINXBUILD) -b doctest $(ALLSPHINXOPTS) $(BUILDDIR)/doctest
-	@echo "Testing of doctests in the sources finished, look at the " \
-	      "results in $(BUILDDIR)/doctest/output.txt."
Index: unk/workshop-routing-foss4g/README
===================================================================
--- /trunk/workshop-routing-foss4g/README	(revision 75)
+++ 	(revision )
@@ -1,20 +1,0 @@
-# 
-# About:
-# =====
-# The docs directory contains the workshop documentation.
-# Sphinx installed on Ubuntu 10.04
-#
-
-# Install notes:
-# =============
-sudo apt-get install python-sphinx texlive-full
-sphinx-quickstart
-
-# Build Documentation:
-# ===================
-make html
-
-make latex
-cd _build/latex/
-make all-pdf
-
Index: unk/workshop-routing-foss4g/checkout.sh
===================================================================
--- /trunk/workshop-routing-foss4g/checkout.sh	(revision 75)
+++ 	(revision )
@@ -1,49 +1,0 @@
-#!/bin/sh
-###############################################################
-# 
-# Purpose: Automated build and update of pgRouting website
-# Authors: Daniel Kastl <daniel@georepublic.de>
-#
-###############################################################
-# Copyright (c) 2010 Georepublic UG
-#
-# Licensed under the GNU LGPL.
-# 
-# This library is free software; you can redistribute it and/or modify it
-# under the terms of the GNU Lesser General Public License as published
-# by the Free Software Foundation, either version 2.1 of the License,
-# or any later version.  This library is distributed in the hope that
-# it will be useful, but WITHOUT ANY WARRANTY, without even the implied
-# warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
-# See the GNU Lesser General Public License for more details, either
-# in the "LICENSE.LGPL.txt" file distributed with this software or at
-# web page "http://www.fsf.org/licenses/lgpl.html".
-#
-
-# About:
-# =====
-# This script will run the following tasks
-#       - Update to the latest changes of the workshop repository 
-#       - Build documentation with Sphinx
-#
-# NOTE: This script was written to run on Ubuntu server. 
-#		It requires an existing
-#		clone of pgRouting workshop repository
-
-# Running:
-# =======
-# This script can run as cron job for example
-# ./checkout.sh
-
-REPDIR="/opt/pgrouting/workshop/docs/"
-WEBDIR="/var/www/pgrouting-workshop/"
-
-cd $REPDIR
-
-# Update to latest version
-git pull -q origin
-
-# Create HTML
-sphinx-build -b html -Q $REPDIR $WEBDIR
-
-
Index: unk/workshop-routing-foss4g/index.rst
===================================================================
--- /trunk/workshop-routing-foss4g/index.rst	(revision 75)
+++ 	(revision )
@@ -1,28 +1,0 @@
-.. Travaux pratiques - Routage FOSS4G avec les outils pgRouting, les rÃ©seau routier d'OpenStreetMap et GeoExt documentation master file, crÃ©Ã© par
-   sphinx-quickstart on Sat Jul  3 21:23:22 2010.
-   You can adapt this file completely to your liking, but it should at least
-   contain the root `toctree` directive.
-
-==============================================================================================================
-pgRouting Workshop Manual
-==============================================================================================================
-
-*"Routage FOSS4G avec les outils pgRouting, le rÃ©seau routier d'OpenStreetMap et GeoExt"*, originalement Ã©crit pour les travaux pratiques du `FOSS4G2011 <http://2011.foss4g.org/sessions/foss4g-routing-pgrouting-tools-openstreetmap-road-data-and-geoext>`_.
-
-.. rubric:: Contenu
-
-.. toctree::
-   :numbered:
-   :maxdepth: 2
-
-   chapters/introduction.rst
-   chapters/about.rst
-   chapters/installation.rst
-   chapters/osm2pgrouting.rst
-   chapters/topology.rst
-   chapters/shortest_path.rst
-   chapters/advanced.rst
-   chapters/php_server.rst
-   chapters/geoext_client.rst
-
-
